/* Archi Vogue — editorial photography (CMS section images). Loaded via ContentKit::imageryCss(). */

/* Shared figure: frame + quiet caption */
.av-figure { margin: 0; }
.av-figure-frame, .hero-band-frame { position: relative; overflow: hidden; background: var(--av-stone); }
.av-figure-frame img, .hero-band-frame img { display: block; width: 100%; height: 100%; object-fit: cover; }
.av-figure figcaption, .hero-band figcaption { display: flex; align-items: center; gap: .9rem; margin-top: .95rem; font-size: .66rem; letter-spacing: .2em; text-transform: uppercase; color: var(--av-grey); }
.av-figure figcaption .rule, .hero-band figcaption .rule { flex: 0 0 2.25rem; height: 1px; background: currentColor; opacity: .5; }

/* Inner-page hero: title block, then a wide image band inside the container */
.content-hero.has-media, .page-hero.has-media { padding-bottom: clamp(28px, 3.5vw, 48px); }
.hero-band { margin: clamp(40px, 5.5vw, 88px) 0 0; }
.hero-band-frame { aspect-ratio: 21 / 9; }
.hero-band-frame img { object-position: 50% 55%; }
.hero-band-frame::after { content: ""; position: absolute; inset: 0; box-shadow: inset 0 0 0 1px rgba(23, 23, 23, .06); pointer-events: none; }
@media (max-width: 767.98px) {
  .hero-band { margin-top: 2rem; margin-inline: calc(var(--av-gutter) * -1); }
  .hero-band-frame { aspect-ratio: 4 / 3; }
  .hero-band figcaption { padding-inline: var(--av-gutter); }
}

/* Home — hero photo framing (portrait photo survives the 3:4 desktop and 4:3 mobile crops) */
.home-hero .hero-media img { object-position: 50% 42%; }
@media (max-width: 991.98px) { .home-hero .hero-media img { object-position: 50% 22%; } }

/* Home — intro: wide editorial band under the statement */
.intro-figure { margin-top: clamp(56px, 7vw, 112px); }
.intro-figure .av-figure-frame { aspect-ratio: 21 / 9; }
@media (max-width: 767.98px) { .intro-figure .av-figure-frame { aspect-ratio: 4 / 3; } }

/* Home — trust: landscape photograph under the pillars (left intro column stays sticky) */
.trust-figure { margin-top: clamp(40px, 4.5vw, 64px); }
.trust-figure .av-figure-frame { aspect-ratio: 3 / 2; }
.trust-figure .av-figure-frame img { object-position: 50% 78%; }
@media (max-width: 991.98px) { .trust-figure .av-figure-frame { aspect-ratio: 4 / 3; } }

/* Home — customization: photograph with the revision drawing laid over its corner */
.cz-composite { position: relative; padding-bottom: 14%; }
.cz-composite .cz-photo { width: 84%; aspect-ratio: 4 / 3; overflow: hidden; background: var(--av-stone); }
.cz-composite .cz-photo img { display: block; width: 100%; height: 100%; object-fit: cover; }
.cz-composite .drawing-overlay { position: absolute; right: 0; bottom: 0; width: 54%; box-shadow: 0 30px 60px -36px rgba(23, 23, 23, .45); }
@media (max-width: 575.98px) { .cz-composite { padding-bottom: 22%; } .cz-composite .cz-photo { width: 92%; } .cz-composite .drawing-overlay { width: 62%; } }

/* Home — bespoke (dark band): wide photograph under the statement */
.bespoke-figure { margin-top: clamp(48px, 6vw, 96px); }
.bespoke-figure .av-figure-frame { aspect-ratio: 21 / 8; background: #222; }
.bespoke-figure figcaption { color: rgba(248, 246, 242, .55); }
@media (max-width: 767.98px) { .bespoke-figure .av-figure-frame { aspect-ratio: 4 / 3; } }

/* About — two worlds: slim material band between heading and the two columns */
.tw-figure { margin-bottom: clamp(32px, 4vw, 56px); }
.tw-figure .av-figure-frame { aspect-ratio: 21 / 6; }
@media (max-width: 767.98px) { .tw-figure .av-figure-frame { aspect-ratio: 16 / 9; } }


/* Tool pages (Plan Finder): a slimmer band keeps the wizard close to the fold */
.page-hero .hero-band-frame { aspect-ratio: 3 / 1; }
@media (max-width: 767.98px) { .page-hero .hero-band-frame { aspect-ratio: 16 / 9; } }