/* AVST Projects: output of [avst_project_details] and [avst_project_gallery]. Uses the site's global design tokens. */
.avst-pd { display: flex; flex-direction: column; }
.avst-pd__row { display: flex; justify-content: space-between; align-items: baseline; gap: 16px; padding: 14px 0; border-bottom: 1px solid var(--color-border, #19303A); }
.avst-pd__row:first-child { padding-top: 0; }
.avst-pd__row:last-child { border-bottom: 0; padding-bottom: 0; }
.avst-pd__label { display: block; flex: 0 0 auto; color: var(--color-muted, #9AAAB2); }
.avst-pd__value { display: block; color: var(--color-heading, #FFFFFF); font-weight: 500; text-align: right; }
.avst-pd__value a { color: var(--color-primary, #008CFF); text-decoration: none; }
.avst-pd__value a:hover { color: var(--color-primary-hover, #00A3FF); }

/* Elementor's text widgets drop class names from dynamic output, so the details list is
   also styled by structure inside an element with the "avst-pd-host" class. */
.avst-pd-host > span { display: flex; flex-direction: column; }
.avst-pd-host > span > span { display: flex; justify-content: space-between; align-items: baseline; gap: 16px; padding: 14px 0; border-bottom: 1px solid var(--color-border, #19303A); }
.avst-pd-host > span > span:first-child { padding-top: 0; }
.avst-pd-host > span > span:last-child { border-bottom: 0; padding-bottom: 0; }
.avst-pd-host > span > span > span:first-child { display: block; flex: 0 0 auto; color: var(--color-muted, #9AAAB2); }
.avst-pd-host > span > span > span:last-child { display: block; color: var(--color-heading, #FFFFFF); font-weight: 500; text-align: right; }
.avst-pd-host a { color: var(--color-primary, #008CFF); text-decoration: none; }
.avst-pd-host a:hover { color: var(--color-primary-hover, #00A3FF); }

.avst-pg-wrap { display: flex; flex-direction: column; gap: 24px; margin-top: 40px; }
.avst-pg__title { display: block; font-family: var(--font-primary, Poppins), sans-serif; font-size: var(--fs-h3, 26px); font-weight: 600; line-height: 1.2; color: var(--color-heading, #FFFFFF); }
.avst-pg { display: grid; grid-template-columns: repeat(3, 1fr); gap: 16px; }
.avst-pg__item { display: block; position: relative; overflow: hidden; aspect-ratio: 4 / 3; border-radius: var(--radius-md, 4px); background: var(--color-surface, #081D27); }
.avst-pg__img { display: block; width: 100%; height: 100%; object-fit: cover; transition: transform 0.4s ease; }
.avst-pg__item:hover .avst-pg__img, .avst-pg__item:focus-visible .avst-pg__img { transform: scale(1.05); }
@media (max-width: 1024px) { .avst-pg { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 767px) { .avst-pg { gap: 10px; } .avst-pg__title { font-size: var(--fs-h3-mobile, 24px); } }
