/* ==========================================================================
   Thota Vaikuntam — home page add-on. Linked only on "/"; builds on main.css.
   ========================================================================== */

/* ------------------------------------------------------------ hero (art-directed) */
.hero-figure { margin: 0; }
/* header + hero fill exactly the first screen (owner, round 2): the band ends at the fold, and the
   source is cropped 24.3% at the top so the name sits close under the header with little bare wall */
.hero--home { height: calc(100svh - var(--header-h)); background: var(--white); color: var(--ink); }
.no-anim .hero--home { height: 749px; }                    /* 864 − 115: the owner's laptop fold, for tall captures */
.hero--home::after { display: none; }                      /* white wall: no gradient */
.hero--home img { object-position: 50% 0; }                /* top-anchored: a wide, short screen loses floor, never the wall above the name */
/* the name block tracks the image scale (width-fitted, so vw): ~30px under the header at 1536,
   its tagline ~40px above the left canvas top, which sits at ~11.7vw */
.hero__overlay--top { top: max(18px, 2vw); left: 0; bottom: auto; padding-top: 0; max-width: 60%; text-shadow: none; }
.hero--home .hero__eyebrow { color: var(--grey-1); }
.hero--home h1 { color: var(--ink); margin-bottom: .6em; }
.hero--home .hero__tagline { color: var(--grey-1); }
/* photographer credit: below the image, right-aligned, footnote size */
.figcaption--hero { justify-content: flex-end; padding-bottom: 0; }   /* image → credit: the shared --cap-gap */
.figcaption--hero .figcaption__credit { font-size: var(--fs-foot); }
/* same query as the portrait <source> (home.py HERO_MOBILE_MEDIA): phones and portrait tablets */
@media (max-width: 768px), (max-width: 1024px) and (orientation: portrait) {
  .hero--art-directed img { object-position: 50% 55%; }    /* kkri9944 focus */
  .hero--art-directed { background: var(--ink-2); }
  .hero--art-directed .hero__overlay--top { top: 0; max-width: 100%; padding-top: 32px; }
  .hero--art-directed h1,
  .hero--art-directed .hero__eyebrow,
  .hero--art-directed .hero__tagline { color: var(--white); }
}

/* ------------------------------------------------------------ full-bleed process image */
.bleed--process { height: 72svh; min-height: 420px; max-height: 820px; overflow: hidden; background: var(--ink-2); margin-block: var(--section-y); }   /* with the neighbouring sections' 60px: 120 above and below */
.bleed--process picture, .bleed--process img { width: 100%; height: 100%; }
.bleed--process img { object-fit: cover; }
.bleed__eyebrow {
  position: absolute; left: var(--gutter); bottom: 32px; margin: 0;
  display: inline-block;
  color: var(--white);
  background: rgba(0, 0, 0, .6);   /* plate: white on this over a pure-white photo is still 5.7:1 */
  padding: 6px 10px;
}

/* ------------------------------------------------------------ zardozi: text | installation view */
/* the photo is centred against the text block (same logic as the feature panel above), so the two
   read as one row whatever the column width; the shared sticky rule is not wanted here */
.split--zardozi { align-items: center; }
.split--zardozi .split__body h2 { margin-bottom: .8em; }
.split--zardozi .split__body p { max-width: 62ch; }
.split--zardozi .split__media { position: static; }
.split--zardozi .figure__media { background: var(--bg-soft); }