/** CPT Portfolio archive and Case Study detail components. */
.avc-portfolio-archive, .avc-case-study-single { padding-block: var(--avc-space-5); background: var(--avc-surface-alt); }.avc-portfolio-cpt-hero { max-width: var(--avc-reading); padding-block: var(--avc-space-4); }.avc-portfolio-cpt-hero > p:first-child, .avc-case-eyebrow { color: var(--avc-secondary); font-size: var(--avc-text-sm, .875rem); font-weight: var(--avc-weight-semibold, 600); text-transform: uppercase; letter-spacing: var(--avc-tracking, .08em); }.avc-portfolio-cpt-filters { display: flex; flex-wrap: wrap; gap: var(--avc-space-1); margin-bottom: var(--avc-space-3); }.avc-portfolio-cpt-filters button { padding: var(--avc-space-1) var(--avc-space-2); border: var(--avc-filter-border, 1px solid var(--avc-border)); border-radius: var(--avc-tag-radius, 999px); color: var(--avc-primary); background: var(--avc-surface); font: inherit; font-weight: var(--avc-weight-semibold, 600); cursor: pointer; }.avc-portfolio-cpt-filters button[aria-pressed="true"], .avc-portfolio-cpt-filters button:hover { color: var(--avc-surface); border-color: var(--avc-accent); background: var(--avc-primary); }.avc-portfolio-cpt-filters button:focus-visible, .avc-case-card a:focus-visible { outline: var(--avc-focus-outline, 3px solid var(--avc-focus)); outline-offset: var(--avc-focus-offset, 3px); }.avc-portfolio-cpt-grid { display: grid; gap: var(--avc-space-2); }.avc-case-card { overflow: hidden; border: var(--avc-case-border, 1px solid var(--avc-border)); border-radius: var(--avc-case-radius, 1.5rem); background: var(--avc-surface); box-shadow: var(--avc-shadow); transition: transform var(--avc-transition, .35s ease), border-color var(--avc-transition, .35s ease); }.avc-case-card:hover { border-color: var(--avc-accent); transform: translateY(var(--avc-case-lift, -8px)); }.avc-case-card--hidden { display: none; }.avc-case-card > img { width: 100%; aspect-ratio: var(--avc-case-media-ratio, 8 / 5); object-fit: cover; transition: transform var(--avc-transition, .35s ease); }.avc-case-card:hover > img { transform: scale(var(--avc-case-image-zoom, 1.04)); }.avc-case-card > div { padding: var(--avc-space-2); }.avc-case-card p { color: var(--avc-muted); }.avc-case-card ul, .avc-case-hero ul, .avc-case-technologies ul { display: flex; flex-wrap: wrap; gap: var(--avc-tag-gap, .35rem); padding: 0; list-style: none; }.avc-case-card li, .avc-case-hero li, .avc-case-technologies li { padding: var(--avc-tag-padding-y, .25rem) var(--avc-tag-padding-x, .5rem); border-radius: var(--avc-tag-radius, 999px); color: var(--avc-primary); background: var(--avc-surface-alt); font-size: var(--avc-tag-size, .75rem); }.avc-case-card a, .avc-case-related a { color: var(--avc-primary); font-weight: var(--avc-weight-semibold, 600); text-decoration: none; }
.avc-case-hero, .avc-case-cta { padding-block: var(--avc-space-5); color: var(--avc-surface); background: linear-gradient(var(--avc-primary), var(--avc-secondary)); }.avc-case-hero nav { margin-bottom: var(--avc-space-3); font-size: var(--avc-text-sm, .875rem); }.avc-case-hero nav a { color: inherit; }.avc-case-hero__grid { display: grid; gap: var(--avc-space-3); align-items: center; }.avc-case-hero h1 { color: inherit; font-size: clamp(2.25rem, 6vw, 4.25rem); }.avc-case-hero img { width: 100%; border-radius: var(--avc-case-radius, 1.5rem); }.avc-case-button { display: inline-flex; min-height: var(--avc-control-size, 2.75rem); align-items: center; margin-top: var(--avc-space-2); padding-inline: var(--avc-space-2); border: var(--avc-case-button-border, 1px solid transparent); border-radius: var(--avc-radius); color: var(--avc-surface); background: var(--avc-accent); font-weight: var(--avc-weight-semibold, 600); text-decoration: none; }.avc-case-button--outline { margin-left: var(--avc-space-1); border-color: var(--avc-surface); background: transparent; }.avc-case-section { padding-block: var(--avc-space-5); }.avc-case-section:nth-of-type(even) { background: var(--avc-surface); }.avc-case-reading { max-width: var(--avc-content); }.avc-case-architecture { display: grid; gap: var(--avc-space-1); grid-template-columns: repeat(2, 1fr); padding: var(--avc-space-3); border-radius: var(--avc-case-radius, 1.5rem); background: var(--avc-primary); }.avc-case-architecture span, .avc-case-implementation li, .avc-case-results li, .avc-case-related a { padding: var(--avc-space-2); border-radius: var(--avc-radius); background: var(--avc-surface); }.avc-case-implementation, .avc-case-results { display: grid; gap: var(--avc-space-1); padding: 0; list-style: none; }.avc-case-gallery { display: grid; gap: var(--avc-space-1); grid-template-columns: repeat(2, 1fr); }.avc-case-gallery button { padding: 0; border: 0; background: transparent; cursor: zoom-in; }.avc-case-gallery img { width: 100%; height: 100%; object-fit: cover; }.avc-case-testimonial { padding: var(--avc-space-3); border-radius: var(--avc-case-radius, 1.5rem); background: var(--avc-surface); box-shadow: var(--avc-shadow); }.avc-case-testimonial p { font-size: var(--avc-case-quote-size, 1.25rem); }.avc-case-testimonial footer { color: var(--avc-muted); }.avc-case-related { display: grid; gap: var(--avc-space-1); }.avc-case-cta { text-align: center; }.avc-case-cta h2 { color: inherit; }.avc-case-cta p { max-width: var(--avc-reading); margin-inline: auto; }
.avc-case-hero__media { min-width: 0; }.avc-case-hero__media img { display: block; width: 100%; height: auto; aspect-ratio: 3 / 2; object-fit: contain; background: var(--avc-surface); }
.avc-case-hero--visual { display: flex; min-height: 34rem; align-items: center; background-color: #4b2518; background-image: linear-gradient(90deg, rgb(4 22 54 / 88%) 0%, rgb(4 22 54 / 68%) 34%, rgb(4 22 54 / 12%) 62%, transparent 100%), var(--avc-case-banner); background-position: center; background-repeat: no-repeat; background-size: cover; }
.avc-case-hero--visual .avc-case-hero__grid { grid-template-columns: minmax(0, 34rem); }.avc-case-hero--visual .avc-case-hero__grid > div { padding: var(--avc-space-3); border-radius: var(--avc-case-radius, 1.5rem); background: rgb(4 22 54 / 38%); backdrop-filter: blur(2px); }
@media (min-width: 42rem) { .avc-portfolio-cpt-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }.avc-case-architecture { grid-template-columns: repeat(3, 1fr); } } @media (min-width: 64rem) { .avc-portfolio-cpt-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }.avc-case-hero__grid { grid-template-columns: 1fr 1fr; }.avc-case-hero--visual { aspect-ratio: var(--avc-case-banner-ratio); }.avc-case-hero--visual .avc-case-hero__grid { grid-template-columns: minmax(0, 34rem); }.avc-case-architecture { grid-template-columns: repeat(5, 1fr); } }
.avc-case-lightbox { max-width: min(var(--avc-lightbox-width, 70rem), 92vw); padding: var(--avc-space-1); border: 0; background: var(--avc-primary); }.avc-case-lightbox::backdrop { background: var(--avc-lightbox-overlay, rgb(0 0 0 / 75%)); }.avc-case-lightbox img { display: block; max-width: 100%; max-height: 80vh; }.avc-case-lightbox button { display: block; margin-left: auto; border: 0; color: var(--avc-surface); background: transparent; font-size: var(--avc-lightbox-close-size, 2rem); cursor: pointer; }
.avc-portfolio-cpt-filters a, .avc-portfolio-cpt-industry select, .avc-portfolio-cpt-industry button { padding: var(--avc-space-1) var(--avc-space-2); border: var(--avc-filter-border, 1px solid var(--avc-border)); border-radius: var(--avc-tag-radius, 999px); color: var(--avc-primary); background: var(--avc-surface); font: inherit; font-weight: var(--avc-weight-semibold, 600); text-decoration: none; }.avc-portfolio-cpt-filters a[aria-current="page"], .avc-portfolio-cpt-filters a:hover { color: var(--avc-surface); border-color: var(--avc-accent); background: var(--avc-primary); }.avc-portfolio-cpt-industry { display: flex; flex-wrap: wrap; align-items: center; gap: var(--avc-space-1); margin-bottom: var(--avc-space-3); }.avc-case-overview dl { display: grid; gap: var(--avc-space-1); grid-template-columns: repeat(2, minmax(0, 1fr)); }.avc-case-overview dl div { padding: var(--avc-space-2); border-radius: var(--avc-radius); background: var(--avc-surface); box-shadow: var(--avc-shadow); }.avc-case-overview dt { color: var(--avc-muted); font-size: var(--avc-text-sm, .875rem); }.avc-case-overview dd { margin: var(--avc-space-1) 0 0; color: var(--avc-primary); font-weight: var(--avc-weight-semibold, 600); }