﻿.hero-scroll{height:260svh;position:relative}.hero-stage{height:100svh;min-height:600px;position:sticky;top:0;overflow:hidden}.hero-media{position:absolute;left:5%;top:11%;width:90%;height:80%;overflow:hidden;background:var(--color-hex-eeeee4);border:1px solid var(--color-hex-b3a17455);border-radius:5px;z-index:2;will-change:width,left,top,height}.hero-media-inner{width:100%;height:100%;will-change:transform;transform-origin:58% 58%}.hero-poster,.hero-video{width:100%;height:100%;object-fit:contain;object-position:center;display:block;mix-blend-mode:multiply}.hero-video[hidden]{display:none}.film-heading{position:absolute;top:6%;left:0;right:0;text-align:center;pointer-events:none}.film-title{display:block;margin-top:12px;font-family:'Manrope',sans-serif;font-size:clamp(30px,4.5vw,70px);letter-spacing:-2px}.media-label{position:absolute;bottom:20px;left:25px;right:25px;display:flex;justify-content:space-between;color:var(--ink);font-size:8px;letter-spacing:2px}.hero-story{position:absolute;left:7%;top:30%;width:38%;z-index:1;opacity:0;transform:translateY(40px);will-change:transform,opacity}.hero-story h1{font-family:'Manrope',sans-serif;font-size:clamp(38px,4.2vw,68px);line-height:1.12;letter-spacing:-2.7px;font-weight:400;margin:26px 0}.hero-story p{font-size:13px;line-height:2;color:var(--muted)}.gold-rule{display:block;width:45px;height:1px;background:var(--gold);margin:30px 0}.tamil{font-size:12px;line-height:1.8;color:var(--gold)}.hero-controls{position:absolute;bottom:3%;left:5%;right:5%;display:flex;align-items:center;justify-content:space-between;gap:15px;font-size:8px;letter-spacing:1.5px;z-index:3}.scroll-cue{display:flex;align-items:center;gap:13px;color:var(--gold);font-size:20px}.scroll-cue span{font-size:8px;color:var(--muted)}.motion-toggle{border:1px solid var(--line);border-radius:25px;background:var(--ivory);color:var(--ink);padding:10px 16px;font-size:10px}.motion-toggle span{margin-left:12px;color:var(--gold)}.scene-number{color:var(--gold);font-size:14px}.scene-number span{font-size:7px;color:var(--muted);margin-left:10px}.scroll-progress{position:absolute;bottom:0;left:0;width:100%;height:2px;background:var(--line)}.scroll-progress span{display:block;width:100%;height:100%;background:var(--gold);transform:scaleX(0);transform-origin:left}@media(max-width:700px){.hero-stage{min-height:560px}.film-heading{top:10%}.film-title{font-size:36px;letter-spacing:-1.6px}.film-heading .eyebrow{font-size:7px;letter-spacing:1.3px}.hero-story{left:6%;top:14%;width:88%}.hero-story .eyebrow{font-size:7px;letter-spacing:1.2px}.hero-story h1{font-size:37px;margin:16px 0;letter-spacing:-1.7px}.hero-story p{font-size:11px;line-height:1.8;margin:0}.gold-rule{margin:15px 0}.tamil{font-size:10px}.scene-number{display:none}.media-label{left:15px;right:15px;font-size:6px;letter-spacing:1px}.scroll-cue span{font-size:7px}.hero-controls{bottom:3%}}@media(prefers-reduced-motion:reduce){.hero-scroll{height:120svh}.hero-media,.hero-story,.hero-media-inner{will-change:auto}}

/* Full-viewport opening film, followed by the split story. */
.hero-media{left:0;top:0;width:100%;height:100%;border:0;border-radius:0;background:var(--ivory)}
.hero-poster,.hero-video{object-fit:cover;mix-blend-mode:normal}
.hero-stage{min-height:0}
.hero-story{opacity:1;transform:none;visibility:hidden;z-index:3;pointer-events:none}
.hero-story.is-visible{visibility:visible;pointer-events:auto}
.hero-story>*{opacity:0;transform:translateY(24px);transition:opacity .8s ease,transform .8s cubic-bezier(.22,1,.36,1)}
.hero-story.is-visible>*{opacity:1;transform:translateY(0)}
.hero-story.is-visible>:nth-child(2){transition-delay:.13s}
.hero-story.is-visible>:nth-child(3){transition-delay:.26s}
.hero-story.is-visible>:nth-child(4){transition-delay:.39s}
.hero-story.is-visible>:nth-child(5){transition-delay:.52s}
.hero-controls{bottom:3%;text-shadow:0 1px 12px var(--color-hex-f8f7f2)}
.motion-toggle{background:var(--color-hex-f8f7f280);backdrop-filter:blur(10px)}
.media-label{opacity:0;transition:opacity .5s ease}
.hero-stage.story-ready .media-label{opacity:1}
@media(max-width:700px){.hero-stage{min-height:0}.hero-story{top:13%}.hero-story h1{font-size:34px}.hero-story p{font-size:11px}}
@media(prefers-reduced-motion:reduce){.hero-story>*{transition:none;transform:none}}
/* A soft ivory veil blends the story into the moving landscape. */
.hero-stage::after{content:'';position:absolute;inset:0;z-index:2;pointer-events:none;background:linear-gradient(90deg,var(--color-hex-f8f7f2) 0%,var(--color-hex-f8f7f2) 32%,var(--color-tone-214) 43%,var(--color-tone-215) 51%,var(--color-tone-216) 59%,var(--color-tone-217) 67%,var(--color-tone-218) 77%);opacity:var(--mist-opacity,0)}
@media(max-width:700px){.hero-stage::after{background:linear-gradient(180deg,var(--color-hex-f8f7f2) 0%,var(--color-hex-f8f7f2) 36%,var(--color-tone-219) 47%,var(--color-tone-220) 56%,var(--color-tone-221) 65%,var(--color-tone-218) 77%)}}
/* The landscape remains beneath the entire veil: no half-width media edge. */
.hero-stage::after{background:linear-gradient(90deg,var(--color-tone-222) 0%,var(--color-tone-223) 20%,var(--color-tone-224) 34%,var(--color-tone-225) 45%,var(--color-tone-226) 55%,var(--color-tone-227) 67%,var(--color-tone-218) 80%)}
@media(max-width:700px){.hero-stage::after{background:linear-gradient(180deg,var(--color-tone-214) 0%,var(--color-tone-228) 25%,var(--color-tone-215) 40%,var(--color-tone-229) 56%,var(--color-tone-217) 70%,var(--color-tone-218) 85%)}}
/* Rectangular editorial hero: solid ivory copy area, scroll-scrubbed film. */
.hero-stage::after{display:none}
.hero-media{left:5%;top:12%;width:90%;height:76%;border:1px solid var(--color-hex-c6b78e);border-radius:0;background:var(--color-hex-eeeee6)}
.hero-media-inner{transform-origin:center}
.hero-poster,.hero-video{object-fit:contain;object-position:center;mix-blend-mode:normal}
.motion-toggle{border-radius:3px;background:var(--ivory);backdrop-filter:none}
.hero-stage.story-ready .media-label{background:var(--color-hex-f8f7f2dc);padding:8px 12px;bottom:12px;left:12px;right:12px}
/* Full-bleed scroll film with a crisp, unblurred white content panel. */
.hero-media{left:0;top:0;width:100%;height:100%;border:0;border-radius:0}
.hero-poster,.hero-video{object-fit:cover}
.hero-stage::after{display:block;content:'';position:absolute;inset:0 auto 0 0;width:48%;background:var(--color-white);opacity:var(--white-panel,0);z-index:2;pointer-events:none;backdrop-filter:none;filter:none}
@media(max-width:700px){.hero-stage::after{inset:0 0 auto;width:100%;height:43%;background:var(--color-white)}}
.hero-stage .motion-toggle,.hero-stage .partner-form{backdrop-filter:none;-webkit-backdrop-filter:none;filter:none}
/* White copy panel enters spatially from the left, never by fading. */
.hero-stage::after{opacity:1;transform:translate3d(var(--white-panel-offset,-100%),0,0);will-change:transform}
/* Independently loaded clips avoid source resets during stage transitions. */
.hero-media-inner{position:relative}
.hero-video-layer{position:absolute;inset:0;width:100%;height:100%;opacity:0;pointer-events:none;transition:opacity .3s ease;object-fit:cover;object-position:center}
.hero-video-layer.is-active{opacity:1;z-index:1}
.hero-stage.story-ready .hero-video-layer{object-fit:contain}
.hero-media{background:var(--ivory)}
@media(prefers-reduced-motion:reduce){.hero-video-layer{transition:none}}
/* All three stages preserve a full-screen canvas, including the final loop. */
.hero-stage.story-ready .hero-video-layer{object-fit:cover;object-position:center}
.hero-media{border:0;border-radius:0}
