/* ============================================================
   WITTY PRODUCTIONS — page-specific styles (light cream edition)
   ============================================================ */

/* ============================= HOME ============================= */
.hero{position:relative;height:100svh;min-height:640px;overflow:hidden}
.hero__slide{position:absolute;inset:0;opacity:0}
.hero__slide.is-active{opacity:1}
.hero__slide .img-wrap{position:absolute;inset:0;overflow:hidden}
.hero__slide img{width:100%;height:100%;object-fit:cover;transform:scale(1.14)}
.hero__veil{position:absolute;inset:0;background:linear-gradient(180deg,rgba(29,26,21,.42) 0%,rgba(29,26,21,.18) 40%,rgba(29,26,21,.62) 100%)}
.hero__veil::after{content:"";position:absolute;inset:0;background:radial-gradient(120% 90% at 50% 10%,transparent 46%,rgba(29,26,21,.34) 100%)}
.hero__content{position:absolute;inset:0;z-index:5;display:flex;flex-direction:column;align-items:center;justify-content:flex-end;text-align:center;padding:0 var(--gutter) clamp(120px,17vh,200px)}
/* photos show through now — hero words flip to cream for contrast */
.hero__kicker{margin-bottom:22px;color:rgba(244,241,232,.85)}
.hero__title{font-size:clamp(52px,11.5vw,178px);letter-spacing:.06em;line-height:.98;text-transform:uppercase;color:#F4F1E8}
.hero__title .row{display:block;overflow:hidden;padding:0 .06em .06em}
.hero__title .row span{display:block;transform:translateY(112%)}
.hero__script{font-size:clamp(30px,4vw,58px);margin-top:6px;opacity:0;color:var(--gold-bright)}
.hero__sub{margin-top:26px;max-width:560px;font-size:13px;letter-spacing:.06em;color:rgba(244,241,232,.82);opacity:0}
.hero__progress{position:absolute;bottom:0;left:0;right:0;height:2px;z-index:6;background:rgba(29,26,21,.08)}
.hero__progress i{display:block;height:100%;width:0;background:linear-gradient(90deg,var(--gold-deep),var(--gold-bright))}
.hero__frames{position:absolute;right:var(--gutter);bottom:64px;z-index:6;display:flex;flex-direction:column;gap:10px}
.hero__frames button{width:44px;height:56px;border:1px solid rgba(29,26,21,.35);overflow:hidden;opacity:.5;transition:opacity .4s,border-color .4s;padding:0;background:var(--ink)}
.hero__frames button img{width:100%;height:100%;object-fit:cover}
.hero__frames button.is-active{opacity:1;border-color:var(--gold-deep)}
.hero__frames button:hover{opacity:1}

/* intro strip */
.intro{display:grid;grid-template-columns:1fr 1.05fr;gap:clamp(30px,6vw,90px);align-items:center}
.intro__left{position:relative}
.intro__img{position:relative;overflow:hidden}
.intro__img img{width:100%;height:auto;transform:scale(1.18)}
.intro__img--float{position:absolute;right:0;bottom:-14%;width:44%;box-shadow:0 30px 80px rgba(29,26,21,.3);z-index:2;outline:1px solid var(--hair);outline-offset:8px}
.intro__right{display:flex;flex-direction:column;gap:28px;align-items:flex-start}
.intro__stats{display:flex;gap:clamp(28px,4.6vw,64px);margin-top:8px;flex-wrap:wrap}
.stat{display:flex;flex-direction:column;gap:8px}
.stat b{font-family:var(--font-display);font-weight:400;font-size:clamp(64px,8.4vw,124px);color:var(--ivory);line-height:.95;letter-spacing:.01em}
.stat b span{font-size:inherit;letter-spacing:inherit;text-transform:none;color:inherit}
.stat b .suffix{font-size:.42em;vertical-align:.55em;color:var(--gold-deep)}
.stat > span{font-size:9px;letter-spacing:.34em;text-transform:uppercase;color:var(--ivory-faint)}

/* signature list (galleries) */
.sig-list{border-top:1px solid var(--hair-soft)}
.sig-item{position:relative;display:block;border-bottom:1px solid var(--hair-soft);overflow:hidden}
.sig-item__row{position:relative;z-index:2;display:grid;grid-template-columns:70px 1fr auto 1fr;align-items:center;gap:clamp(14px,3vw,40px);padding:clamp(22px,4.4vh,44px) 0;transition:padding .6s var(--ease-lux)}
.sig-item__num{font-size:10px;letter-spacing:.3em;color:var(--gold-deep)}
.sig-item__name{font-family:var(--font-display);font-size:clamp(30px,5.6vw,74px);letter-spacing:.05em;line-height:1;transition:transform .7s var(--ease-lux),color .5s}
.sig-item__meta{font-size:10px;letter-spacing:.28em;text-transform:uppercase;color:var(--ivory-faint);text-align:right}
.sig-item__arrow{justify-self:end;font-size:26px;color:var(--gold-deep);opacity:0;transform:translateX(-24px) rotate(-45deg);transition:all .6s var(--ease-lux)}
.sig-item__bg{position:absolute;inset:0;z-index:1;opacity:0;overflow:hidden;transition:opacity .55s ease}
.sig-item__bg img{width:100%;height:130%;object-fit:cover;filter:brightness(1.06) saturate(.85) contrast(.94);transform:translateY(-8%)}
.sig-item__bg::after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,var(--ink) 2%,rgba(244,241,232,.55) 50%,rgba(244,241,232,.82) 96%)}
.sig-item:hover .sig-item__bg{opacity:1}
.sig-item:hover .sig-item__bg img{animation:bgdrift 7s ease-in-out infinite alternate}
@keyframes bgdrift{from{transform:translateY(-8%) scale(1.02)}to{transform:translateY(0) scale(1.1)}}
.sig-item:hover .sig-item__name{transform:translateX(clamp(8px,2vw,26px));color:var(--gold-deep)}
.sig-item:hover .sig-item__arrow{opacity:1;transform:translateX(0) rotate(-45deg)}
@media (hover:none){.sig-item__bg{display:none}}

/* showreel — full-bleed video, no play ornament (click anywhere / cursor says Play) */
.showreel{position:relative;height:clamp(480px,92vh,900px);overflow:hidden}
.showreel__media{position:absolute;inset:0;overflow:hidden}
.showreel__media video,.showreel__media img{width:100%;height:100%;object-fit:cover}
.showreel__media video{filter:brightness(.96) saturate(1.02);transition:transform 1.4s var(--ease-lux),filter .6s}
.showreel:hover .showreel__media video{transform:scale(1.025);filter:brightness(1.02) saturate(1.05)}
.showreel__veil{position:absolute;inset:0;background:radial-gradient(90% 70% at 50% 50%,transparent 34%,rgba(244,241,232,.5) 100%)}
.showreel__center{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:22px;text-align:center;z-index:3;pointer-events:none}
.showreel__title{font-size:clamp(40px,8vw,120px)}
.showreel__hint{font-size:9px;letter-spacing:.42em;text-transform:uppercase;color:var(--ivory-dim)}
.showreel__side{position:absolute;left:var(--gutter);bottom:44px;z-index:3;display:flex;gap:14px;align-items:center;font-size:9px;letter-spacing:.4em;text-transform:uppercase;color:var(--ivory-dim)}
.showreel__side i{width:60px;height:1px;background:var(--hair);display:block}

/* philosophy (pinned) */
.philo{position:relative}
.philo__pin{height:100svh;display:flex;align-items:center;overflow:hidden}
.philo__quote{font-size:clamp(26px,4.4vw,58px);max-width:1180px;line-height:1.28}
.philo__quote em{font-style:italic;color:var(--gold-deep)}
.philo__word{display:inline-block;opacity:.14;filter:blur(2px);transition:opacity .2s linear,filter .2s linear}
.philo__sign{margin-top:40px;display:flex;align-items:center;gap:18px}
.philo__sign .script{font-size:clamp(30px,3.8vw,50px)}
.philo__sign i{width:70px;height:1px;background:var(--hair);display:block}

/* marquee of words */
.word-marquee{padding:clamp(40px,7vw,80px) 0;border-top:1px solid var(--hair-soft);border-bottom:1px solid var(--hair-soft);overflow:hidden}
.word-marquee .track{display:inline-flex;gap:70px;white-space:nowrap;animation:marquee 26s linear infinite}
.word-marquee span{font-family:var(--font-display);font-size:clamp(34px,5.4vw,70px);letter-spacing:.08em;color:transparent;-webkit-text-stroke:1px rgba(140,111,60,.5);display:inline-flex;align-items:center;gap:70px}
.word-marquee span::after{content:"✦";font-size:.4em;color:var(--gold);-webkit-text-stroke:0}

/* cta band */
.cta-band{position:relative;text-align:center;display:flex;flex-direction:column;align-items:center;gap:26px;overflow:hidden}
.cta-band .script{font-size:clamp(36px,5vw,60px)}

/* ============================= PAGE HERO (inner pages) ============================= */
.page-hero{position:relative;min-height:72svh;display:flex;align-items:flex-end;overflow:hidden}
.page-hero__bg{position:absolute;inset:0;overflow:hidden}
.page-hero__bg img{width:100%;height:100%;object-fit:cover;transform:scale(1.16);filter:brightness(1.02) saturate(.92)}
.page-hero__bg::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(244,241,232,.42),rgba(244,241,232,.14) 45%,var(--ink) 96%)}
.page-hero__content{position:relative;z-index:2;width:100%;padding:0 var(--gutter) clamp(56px,9vh,110px);display:flex;flex-direction:column;gap:20px}
.page-hero__title{font-size:clamp(46px,9.4vw,140px);line-height:.98;text-transform:uppercase;letter-spacing:.05em}
.page-hero__title .row{display:block;overflow:hidden;padding-bottom:.06em}
.page-hero__title .row span{display:block;transform:translateY(112%)}
.page-hero__crumbs{display:flex;gap:12px;align-items:center;font-size:10px;letter-spacing:.32em;text-transform:uppercase;color:var(--ivory-faint)}

/* ============================= ABOUT ============================= */
.about-intro{display:grid;grid-template-columns:1.05fr .95fr;gap:clamp(30px,6vw,90px);align-items:center}
.about-intro__portrait{position:relative}
.about-intro__portrait .frame{position:relative;overflow:hidden;outline:1px solid var(--hair);outline-offset:10px}
.about-intro__portrait img{width:100%;transform:scale(1.16)}
.about-intro__portrait .badge{
  position:absolute;right:-18px;bottom:-18px;z-index:3;width:clamp(120px,13vw,168px);height:clamp(120px,13vw,168px);
  border-radius:50%;background:var(--ink);border:1px solid var(--hair);
  display:flex;flex-direction:column;align-items:center;justify-content:center;gap:4px;text-align:center;
  box-shadow:0 24px 60px rgba(29,26,21,.18);
}
.about-intro__portrait .badge b{font-family:var(--font-display);font-weight:400;font-size:clamp(38px,4.4vw,58px);color:var(--gold-deep);line-height:1}
.about-intro__portrait .badge span{font-size:8px;letter-spacing:.28em;text-transform:uppercase;color:var(--ivory-faint)}
.about-intro__right{display:flex;flex-direction:column;gap:26px;align-items:flex-start}
.values-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;background:var(--hair-soft);border:1px solid var(--hair-soft)}
.value{background:var(--ink);padding:clamp(28px,3.6vw,52px);display:flex;flex-direction:column;gap:16px;transition:background .5s}
.value:hover{background:var(--ink-2)}
.value b{font-family:var(--font-display);font-weight:400;font-size:clamp(20px,2vw,28px);letter-spacing:.06em}
.value span.num{font-size:10px;letter-spacing:.3em;color:var(--gold-deep)}
.value p{font-size:13px;color:var(--ivory-dim);line-height:1.9}
.timeline{position:relative;padding-left:clamp(30px,5vw,70px)}
.timeline::before{content:"";position:absolute;left:8px;top:6px;bottom:6px;width:1px;background:linear-gradient(var(--gold),rgba(198,161,91,.08))}
.tl-item{position:relative;padding:0 0 clamp(30px,4.6vw,54px)}
.tl-item::before{content:"";position:absolute;left:calc(-1 * clamp(30px,5vw,70px) + 4px);top:8px;width:9px;height:9px;border-radius:50%;background:var(--ink);border:1px solid var(--gold);transition:background .4s,box-shadow .4s}
.tl-item:hover::before{background:var(--gold-bright);box-shadow:0 0 18px rgba(198,161,91,.7)}
.tl-item .tl-year{font-family:var(--font-display);font-size:clamp(34px,4vw,54px);color:var(--ivory);line-height:1}
.tl-item h4{font-size:12px;letter-spacing:.3em;text-transform:uppercase;margin:10px 0 10px;color:var(--gold-deep)}
.tl-item p{font-size:13.5px;color:var(--ivory-dim);max-width:640px}

/* ============================= PORTFOLIO INDEX ============================= */
.pf-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:clamp(18px,3vw,44px)}
.pf-card{position:relative;display:block;overflow:hidden}
.pf-card__media{position:relative;overflow:hidden;aspect-ratio:4/5}
.pf-card__media img{width:100%;height:100%;object-fit:cover;transform:scale(1.12)}
.pf-card__media::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,transparent 40%,rgba(244,241,232,.9));opacity:.95}
.pf-card__body{position:absolute;inset:auto 0 0 0;z-index:2;padding:clamp(20px,2.6vw,36px);display:flex;align-items:flex-end;justify-content:space-between;gap:16px}
.pf-card__name{font-family:var(--font-display);font-size:clamp(26px,3.4vw,44px);letter-spacing:.05em}
.pf-card__count{font-size:10px;letter-spacing:.3em;color:var(--gold-deep)}
.pf-card__veil{position:absolute;inset:0;z-index:3;background:var(--gold);transform:scaleY(0);transform-origin:bottom;transition:transform .5s var(--ease-lux);opacity:.16}
.pf-card:hover .pf-card__veil{transform:scaleY(1)}
.pf-card:hover .pf-card__media img{transform:scale(1.045)}
.pf-card--wide{grid-column:1/-1}
.pf-card--wide .pf-card__media{aspect-ratio:21/9}

/* ============================= GALLERY ============================= */
.gal-filter{display:flex;gap:8px;flex-wrap:wrap}
.chip{padding:10px 20px;border:1px solid var(--hair-soft);font-size:9.5px;letter-spacing:.3em;text-transform:uppercase;color:var(--ivory-dim);transition:all .4s;border-radius:99px}
.chip:hover{border-color:var(--gold);color:var(--gold-deep)}
.chip.is-active{background:var(--gold);border-color:var(--gold);color:var(--on-gold)}
.masonry{columns:3;column-gap:clamp(14px,2vw,26px)}
.masonry--2{columns:2}
.m-item{break-inside:avoid;margin-bottom:clamp(14px,2vw,26px);position:relative;overflow:hidden;display:block;width:100%;padding:0}
.m-item img{width:100%;height:auto;transform:scale(1.06)}
.m-item::after{content:"";position:absolute;inset:0;background:rgba(198,161,91,.0);transition:background .45s}
.m-item:hover::after{background:rgba(198,161,91,.16)}
.m-item .m-cap{position:absolute;left:14px;bottom:12px;z-index:2;font-size:9px;letter-spacing:.3em;text-transform:uppercase;color:var(--ivory);background:rgba(29,26,21,.55);color:#F4F1E8;padding:5px 10px;opacity:0;transform:translateY(10px);transition:all .45s var(--ease-lux)}
.m-item:hover .m-cap{opacity:1;transform:none}
.gal-nav{display:flex;justify-content:space-between;align-items:center;gap:20px;border-top:1px solid var(--hair-soft);padding-top:34px;flex-wrap:wrap}

/* ============================= FILMS ============================= */
.films-grid{display:flex;flex-direction:column;gap:clamp(60px,9vw,120px)}
.film-row{display:grid;grid-template-columns:1.35fr .65fr;gap:clamp(24px,4vw,60px);align-items:center}
.film-row:nth-child(even){grid-template-columns:.65fr 1.35fr}
.film-row:nth-child(even) .film-card{order:2}
.film-card{position:relative;overflow:hidden;aspect-ratio:16/9;background:var(--ink-2);outline:1px solid var(--hair);outline-offset:6px}
.film-card video{width:100%;height:100%;object-fit:cover;display:block}
.film-card__poster{position:absolute;inset:0;background-size:cover;background-position:center;transition:opacity .5s,transform 1.2s var(--ease-lux)}
.film-card__scrim{position:absolute;inset:0;background:linear-gradient(180deg,rgba(244,241,232,.02),rgba(29,26,21,.14));transition:opacity .5s}
.film-card:hover .film-card__poster{transform:scale(1.045)}
.film-card__dur{position:absolute;right:16px;bottom:14px;font-size:9px;letter-spacing:.3em;color:var(--ivory);background:rgba(244,241,232,.8);padding:7px 12px;border:1px solid var(--hair-soft)}
.film-meta{display:flex;flex-direction:column;gap:18px;align-items:flex-start}
.film-meta h3{font-family:var(--font-display);font-weight:400;font-size:clamp(26px,3.2vw,44px);letter-spacing:.05em;line-height:1.15}
.film-meta p{font-size:13.5px;color:var(--ivory-dim);line-height:2;max-width:420px}
.theater{position:fixed;inset:0;z-index:4300;background:rgba(244,241,232,.97);display:flex;flex-direction:column;justify-content:center;opacity:0;visibility:hidden;transition:opacity .5s,visibility .5s}
.theater.is-open{opacity:1;visibility:visible}
.theater video{width:min(1200px,92vw);max-height:76vh;margin:0 auto;display:block;background:#000;box-shadow:0 40px 140px rgba(29,26,21,.35)}
.theater__bar{width:min(1200px,92vw);margin:20px auto 0;display:flex;align-items:center;justify-content:space-between;gap:18px}
.theater__title{font-family:var(--font-display);letter-spacing:.14em;font-size:15px;color:var(--ivory-dim);text-transform:uppercase}
.theater__close{border:1px solid var(--hair);border-radius:50%;width:48px;height:48px;display:grid;place-items:center;transition:all .4s;color:var(--ivory)}
.theater__close:hover{transform:rotate(90deg);border-color:var(--gold-deep);color:var(--gold-deep)}

/* ============================= CONTACT ============================= */
.contact-wrap{display:grid;grid-template-columns:1fr 1.1fr;gap:clamp(34px,6vw,90px);align-items:start}
.contact-info{display:flex;flex-direction:column;gap:34px}
.c-line{display:flex;flex-direction:column;gap:6px;border-left:1px solid var(--hair);padding-left:22px}
.c-line span{font-size:9px;letter-spacing:.4em;text-transform:uppercase;color:var(--gold-deep)}
.c-line a,.c-line p{font-family:var(--font-serif);font-size:clamp(18px,2vw,24px);color:var(--ivory);transition:color .35s}
.c-line a:hover{color:var(--gold-deep)}
.contact-form{display:flex;flex-direction:column;gap:30px}
.form-row{display:grid;grid-template-columns:1fr 1fr;gap:clamp(20px,3vw,34px)}
.field{position:relative;padding-top:16px}
.field input,.field textarea,.field select{
  width:100%;background:transparent;border:0;border-bottom:1px solid var(--hair-soft);
  padding:12px 2px;color:var(--ivory);font-family:var(--font-serif);font-weight:600;font-size:18px;
  outline:none;border-radius:0;resize:vertical;
}
.field input::placeholder,.field textarea::placeholder{color:var(--ivory-dim);opacity:1;font-weight:500}
.field select{appearance:none;cursor:pointer}
.field select option{background:var(--ink);color:var(--ivory)}
.field label{
  position:absolute;left:2px;top:26px;font-size:11px;letter-spacing:.3em;text-transform:uppercase;
  color:var(--ivory-dim);pointer-events:none;transition:all .4s var(--ease-lux);
}
.field.is-active label,.field input:focus~label,.field textarea:focus~label,.field select:focus~label{
  top:0;font-size:8.5px;color:var(--gold-deep);
}
.field .bar{position:absolute;left:0;bottom:0;height:1px;width:100%;background:linear-gradient(90deg,var(--gold-deep),var(--gold-bright));transform:scaleX(0);transform-origin:left;transition:transform .6s var(--ease-lux)}
.field input:focus~.bar,.field textarea:focus~.bar,.field select:focus~.bar{transform:scaleX(1)}
.form-note{font-size:12.5px;font-weight:500;color:var(--ivory-dim);letter-spacing:.06em}
.faq{border-top:1px solid var(--hair-soft)}
.faq-item{border-bottom:1px solid var(--hair-soft)}
.faq-q{width:100%;display:flex;justify-content:space-between;align-items:center;gap:20px;padding:24px 0;text-align:left;font-family:var(--font-serif);font-size:clamp(17px,1.8vw,22px);color:var(--ivory);transition:color .35s}
.faq-q:hover{color:var(--gold-deep)}
.faq-q i{font-style:normal;color:var(--gold-deep);font-size:20px;transition:transform .5s var(--ease-lux)}
.faq-item.is-open .faq-q i{transform:rotate(45deg)}
.faq-a{overflow:hidden;height:0}
.faq-a p{padding:0 0 24px;font-size:13.5px;color:var(--ivory-dim);max-width:720px;line-height:2}

/* ============================= RESPONSIVE ============================= */
@media (max-width:960px){
  .intro,.about-intro,.contact-wrap{grid-template-columns:1fr}
  .intro__img--float{right:0;bottom:-6%;width:38%}
  .pf-grid{grid-template-columns:1fr}
  .pf-card--wide .pf-card__media{aspect-ratio:4/5}
  .masonry{columns:2}
  .film-row,.film-row:nth-child(even){grid-template-columns:1fr}
  .film-row:nth-child(even) .film-card{order:0}
  .values-grid{grid-template-columns:1fr}
  .hero__frames{display:none}
  .philo__pin{height:auto;padding:clamp(80px,14vw,140px) 0}
}
@media (max-width:600px){
  .masonry{columns:1}
  .sig-item__row{grid-template-columns:44px 1fr auto;gap:12px}
  .sig-item__meta{display:none}
  .intro__stats{gap:24px}
  .form-row{grid-template-columns:1fr}
}

/* ---- SEO studio-line (crawlable facts, visually quiet) ---- */
.studio-line{display:flex;align-items:flex-start;gap:9px;margin-top:20px;color:var(--ivory-faint);font-size:12px;letter-spacing:.03em;max-width:540px}
.studio-line__mark{color:var(--gold);font-size:13px;line-height:1.4;padding-top:2px}
.studio-line__text{display:block;color:var(--ivory-dim);line-height:1.55;word-break:break-word}
.studio-line__text b{color:var(--ivory);font-weight:600}
.studio-line__text .pill{color:var(--gold-deep);font-weight:600}
body:not(.menu-open) .studio-line{opacity:.95}
.menu-open .studio-line{color:var(--ink-3)}
.studio-line b,.studio-line .pill{text-transform:none;letter-spacing:0}

/* ---- glowing "Let's create something eternal" footer link ---- */
a.script{text-decoration:none;cursor:pointer;display:inline-block}
.footer-cta a.script{
  transition:color .5s;
  animation:eternalGlow 4.5s ease-in-out infinite;
}
.footer-cta a.script:hover{color:var(--gold-deep);animation-duration:2.2s}
@keyframes eternalGlow{
  0%,100%{text-shadow:0 0 12px rgba(232,201,134,.3),0 0 34px rgba(198,161,91,.18)}
  50%{text-shadow:0 0 22px rgba(232,201,134,.85),0 0 60px rgba(198,161,91,.5),0 0 90px rgba(198,161,91,.25)}
}
@media (prefers-reduced-motion:reduce){
  .footer-cta a.script{animation:none;text-shadow:0 0 16px rgba(232,201,134,.5)}
}

/* ==================== STUDIO MOTION BAND (video + lines) ==================== */
.motion-band{padding-top:clamp(90px,13vw,170px)}
.motion-grid{display:grid;grid-template-columns:1.05fr .95fr;gap:clamp(36px,7vw,110px);align-items:center}
.motion-media{position:relative}
.motion-media video{
  width:100%;height:auto;display:block;aspect-ratio:4/3;object-fit:cover;
  -webkit-mask-image:radial-gradient(120% 120% at 50% 50%,#000 55%,transparent 98%);
  mask-image:radial-gradient(120% 120% at 50% 50%,#000 55%,transparent 98%);
  filter:saturate(.92) contrast(.96) brightness(1.02);
  mix-blend-mode:multiply;
  background:transparent;
}
.motion-copy{display:flex;flex-direction:column;gap:clamp(18px,2.6vw,30px);align-items:flex-start}
.motion-line{
  font-family:var(--font-serif);font-style:italic;
  font-size:clamp(22px,2.9vw,40px);line-height:1.42;color:var(--ivory);
  max-width:560px;
}
.motion-line--soft{
  font-size:clamp(18px,2.1vw,27px);color:var(--ivory-dim);line-height:1.5;
}
.motion-note{
  margin-top:clamp(8px,1.4vw,18px);
  font-size:10.5px;letter-spacing:.26em;text-transform:uppercase;color:var(--gold-deep);
}
@media (max-width:960px){
  .motion-grid{grid-template-columns:1fr;gap:clamp(30px,6vw,48px)}
  .motion-line{max-width:none}
}
@media (prefers-reduced-motion:reduce){
  .motion-media video{animation:none}
}

/* ============================ GOLDEN LIGHT ORBITS ============================
   A comet of golden light that endlessly travels around the border of every
   framed element: cards, photos, buttons, film posters, portrait frames.
   Pure additive CSS — no existing rules touched. */
@property --or {syntax:'<angle>';inherits:false;initial-value:0deg}

.orbit,.pf-card,.film-card,.m-item,.intro__img,.intro__img--float,.about-intro__portrait .frame,.value,.btn,.header-cta{
  position:relative;
}
.orbit::before,.pf-card::before,.film-card::before,.m-item::before,.intro__img::before,.intro__img--float::before,.about-intro__portrait .frame::before,.value::before,.btn::before,.header-cta::before{
  content:"";position:absolute;inset:0;z-index:4;pointer-events:none;
  border-radius:inherit;
  padding:2.5px;
  background:conic-gradient(from var(--or),
    transparent 0deg,
    rgba(198,161,91,.1) 38deg,
    rgba(232,201,134,1) 76deg,
    #FFF3D6 96deg,
    rgba(198,161,91,.75) 124deg,
    rgba(198,161,91,0) 195deg,
    transparent 360deg);
  -webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);
  -webkit-mask-composite:xor;mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);mask-composite:exclude;
  opacity:.9;
  animation:orbitRun 6s linear infinite;
  will-change:--or;
}
/* resting glow so frames read gilded even between comet passes */
.orbit::before,.pf-card::before,.film-card::before,.m-item::before,.intro__img::before,.intro__img--float::before,.about-intro__portrait .frame::before,.value::before,.btn::before,.header-cta::before{
  box-shadow:0 0 18px -1px rgba(198,161,91,.9),0 0 4px rgba(232,201,134,.55);
}
@keyframes orbitRun{to{--or:360deg}}

/* vary phases + speeds so the page feels alive, not synchronized */
.pf-card:nth-child(2n)::before{animation-duration:7.5s;animation-delay:-2.4s}
.pf-card:nth-child(3n)::before{animation-duration:9s;animation-delay:-4.1s}
.film-card::before{animation-duration:8s;animation-delay:-3s}
.m-item:nth-child(2n)::before{animation-duration:7s;animation-delay:-1.6s}
.m-item:nth-child(3n)::before{animation-duration:8.5s;animation-delay:-5s}
.value:nth-child(2)::before{animation-delay:-2s}
.value:nth-child(3)::before{animation-delay:-4s}
.intro__img--float::before{animation-duration:7.2s;animation-delay:-3.4s}
.btn::before{animation-duration:5.2s}
.header-cta::before{animation-duration:5.6s;animation-delay:-1.2s}
/* respect reduced-motion: static gilded ring instead of moving comet */
@media (prefers-reduced-motion:reduce){
  .orbit::before,.pf-card::before,.film-card::before,.m-item::before,.intro__img::before,.intro__img--float::before,.about-intro__portrait .frame::before,.value::before,.btn::before,.header-cta::before{
    animation:none;
    background:linear-gradient(135deg,rgba(198,161,91,.45),rgba(232,201,134,.65),rgba(198,161,91,.45));
    box-shadow:0 0 10px -2px rgba(198,161,91,.5);
  }
}

/* ==================== LIGHT RUNNING BETWEEN GALLERY ROWS ====================
   A slow golden pulse that travels along each separator line of the
   signature gallery list (Wedding -> Promise -> Haldi -> Sangeet -> Candid),
   staggered so it reads as light flowing down the list. */
@keyframes beamSweep{0%{background-position:-45% 0;opacity:0}12%{opacity:1}50%{opacity:1}62%{background-position:145% 0;opacity:0}100%{background-position:145% 0;opacity:0}}
.sig-item::after{
  content:"";position:absolute;left:0;right:0;bottom:-1px;height:3px;z-index:3;pointer-events:none;
  background:linear-gradient(90deg,transparent,rgba(198,161,91,1) 42%,#FFE9B8 50%,rgba(198,161,91,1) 58%,transparent);
  background-size:55% 100%;background-repeat:no-repeat;
  filter:drop-shadow(0 0 12px rgba(232,201,134,.95));
  opacity:0;
  animation:beamSweep 7s ease-in-out infinite;
}
.sig-item:nth-child(1)::after{animation-delay:0s}
.sig-item:nth-child(2)::after{animation-delay:1.4s}
.sig-item:nth-child(3)::after{animation-delay:2.8s}
.sig-item:nth-child(4)::after{animation-delay:4.2s}
.sig-item:nth-child(5)::after{animation-delay:5.6s}
.sig-item:nth-child(n+6)::after{animation-delay:7s}
@media (prefers-reduced-motion:reduce){
  .sig-item::after{animation:none;opacity:.5;background:linear-gradient(90deg,transparent,rgba(198,161,91,.5),transparent)}
}

/* ============================ PERF GUARD ============================
   Same golden light, fewer repaints. Nothing is removed — animations are
   only PAUSED for elements far offscreen (25% margin around the viewport),
   while the browser tab is hidden, and while the fullscreen menu covers
   the page. Classes are toggled by core.js (WP.initPerfGuard). */
.pf-card.perf-idle::before,.film-card.perf-idle::before,.m-item.perf-idle::before,
.intro__img.perf-idle::before,.intro__img--float.perf-idle::before,
.about-intro__portrait .frame.perf-idle::before,.value.perf-idle::before,
.btn.perf-idle::before,.header-cta.perf-idle::before,.orbit.perf-idle::before{
  animation-play-state:paused;
}
.sig-item.perf-idle::after{animation-play-state:paused}
html.perf-hidden .pf-card::before,html.perf-hidden .film-card::before,html.perf-hidden .m-item::before,
html.perf-hidden .intro__img::before,html.perf-hidden .intro__img--float::before,
html.perf-hidden .about-intro__portrait .frame::before,html.perf-hidden .value::before,
html.perf-hidden .btn::before,html.perf-hidden .header-cta::before,html.perf-hidden .orbit::before,
html.perf-hidden .sig-item::after,
html.perf-hidden .grain,
html.perf-hidden .footer-marquee .track{animation-play-state:paused}
/* the frosted menu hides the page — freeze everything behind it */
body.menu-open .grain,
body.menu-open .footer-marquee .track{animation-play-state:paused}
