/* ============================================================
   Gabriel Adeloju — Wedding Photography & Film
   Ivory & Forest design system · IvyPresto Display + Hanken Grotesk
   ============================================================ */

/* Palette: Vanilla #F1EADA · Tobacco #B59E7D · Mountain #AAA396 · Sand #CEC1A8 · Mahogany #584738 */
:root{
  --bg:#F1EADA;
  --bg-2:#E9E0CD;
  --onyx:#1C1C1B;
  --ink:#1C1C1B;
  --brown:#584738;
  --ink-deep:#4A3B2C;
  --ink-deeper:#3E3225;
  --accent:#B59E7D;
  --accent-deep:#8A7458;
  --accent-light:#CEC1A8;
  --grey:#AAA396;
  --grey-2:#6E6151;
  --cream:#F1EADA;
  --hairline:rgba(181,158,125,.35);
  --hairline-ink:rgba(88,71,56,.14);
  --serif:'ivypresto-display', Georgia, serif;
  --sans:'Hanken Grotesk', -apple-system, sans-serif;
  --ease:cubic-bezier(.22,1,.36,1);
}

*{margin:0;padding:0;box-sizing:border-box;}
html{scroll-behavior:auto;}
html.lenis, html.lenis body{height:auto;}
.lenis.lenis-smooth{scroll-behavior:auto!important;}
body{
  background:var(--bg);
  color:var(--ink);
  font-family:var(--sans);
  font-weight:300;
  font-size:16px;
  line-height:1.7;
  -webkit-font-smoothing:antialiased;
  overflow-x:hidden;
}
img{max-width:100%;display:block;}
a{color:inherit;}

::selection{background:var(--accent);color:var(--cream);}

/* Film grain */
.grain::after{
  content:"";position:fixed;inset:0;pointer-events:none;z-index:90;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='300' height='300'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='2'/%3E%3C/filter%3E%3Crect width='300' height='300' filter='url(%23n)' opacity='0.5'/%3E%3C/svg%3E");
  opacity:.035;mix-blend-mode:multiply;
}

/* Typography helpers */
.eyebrow{
  font-size:11px;letter-spacing:.42em;text-transform:uppercase;
  color:var(--accent-deep);font-weight:500;
}
h1,h2,h3{font-family:var(--serif);font-weight:400;line-height:1.06;}
h2 em,h1 em{font-style:normal;color:var(--accent-deep);}
.chapter-tag{display:flex;align-items:center;gap:20px;margin-bottom:38px;}
.chapter-tag .num{font-family:var(--serif);font-size:16px;color:var(--accent-deep);letter-spacing:.18em;}
.chapter-tag .rule{width:64px;height:1px;background:var(--hairline);}
.chapter-tag .name{font-size:11px;letter-spacing:.4em;text-transform:uppercase;color:var(--grey);}

/* Buttons */
.btn{
  display:inline-flex;align-items:center;justify-content:center;gap:12px;
  padding:17px 40px;font-size:12px;letter-spacing:.26em;text-transform:uppercase;
  text-decoration:none;font-weight:500;cursor:pointer;border:0;
  transition:background .45s var(--ease), color .45s var(--ease), border-color .45s var(--ease);
}
.btn-solid{background:var(--ink-deep);color:var(--cream);}
.btn-solid:hover{background:var(--ink-deeper);}
.btn-ghost{border:1px solid rgba(28,28,27,.35);color:var(--ink);background:transparent;}
.btn-ghost:hover{border-color:var(--accent);color:var(--accent-deep);}
.btn-ghost.on-dark{border-color:rgba(241,234,218,.35);color:var(--cream);}
.btn-ghost.on-dark:hover{border-color:var(--accent-light);color:var(--accent-light);}
.btn-play::before{content:"▶";font-size:9px;color:var(--accent);}
.on-dark.btn-play::before{color:var(--accent-light);}

/* ============ NAV — transparent negative (blend difference) ============ */
.nav{
  position:fixed;top:0;left:0;right:0;z-index:90;
  display:flex;align-items:center;justify-content:space-between;
  padding:22px 56px;
  background:transparent;
  mix-blend-mode:difference;
  transition:transform .6s var(--ease);
}
.nav.nav-hidden{transform:translateY(-100%);}
.nav-logo img{height:40px;width:auto;}
.nav-wordmark{
  position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);
  font-family:var(--serif);font-size:27px;letter-spacing:.12em;
  color:#fff;text-decoration:none;white-space:nowrap;
  transition:opacity .45s var(--ease);
}
.nav-wordmark.wm-hidden{opacity:0;pointer-events:none;}
.nav-links{display:flex;gap:24px;align-items:center;margin-left:auto;margin-right:24px;}
.nav-links a{
  color:#fff;text-decoration:none;
  font-size:12px;letter-spacing:.16em;text-transform:uppercase;font-weight:500;
  position:relative;padding-bottom:4px;
}
.nav-links a::after{
  content:"";position:absolute;left:0;bottom:0;height:1px;width:0;
  background:#fff;transition:width .4s var(--ease);
}
.nav-links a:hover::after,.nav-links a.active::after{width:100%;}
.nav-links a.active{color:#fff;}
.nav-cta{
  border:1px solid rgba(255,255,255,.8);color:#fff;
  padding:12px 26px;font-size:11px;letter-spacing:.26em;text-transform:uppercase;
  text-decoration:none;font-weight:500;
  transition:background .4s var(--ease), color .4s var(--ease);
}
.nav-cta:hover{background:#fff;color:#000;}
.nav-burger{display:none;background:none;border:0;cursor:pointer;padding:8px;z-index:95;}
.nav-burger span{display:block;width:26px;height:1.5px;background:#fff;margin:6px 0;transition:transform .4s var(--ease),opacity .3s;}
.nav-burger.open span:nth-child(1){transform:translateY(7.5px) rotate(45deg);}
.nav-burger.open span:nth-child(2){opacity:0;}
.nav-burger.open span:nth-child(3){transform:translateY(-7.5px) rotate(-45deg);}
@media (max-width:1280px){
  .nav-links,.nav-cta{display:none;}
  .nav-burger{display:block;}
}

/* Nav state: solid white over the homepage hero (no blend) */
.nav.nav-on-hero{mix-blend-mode:normal;}

/* Nav state: inner pages — frosted vanilla bar, onyx text (blend-proof on all browsers) */
.nav.nav-ink{
  mix-blend-mode:normal;
  background:rgba(241,234,218,.92);
  backdrop-filter:blur(10px);
  border-bottom:1px solid var(--hairline-ink);
}
.nav-ink .nav-links a{color:rgba(28,28,27,.85);}
.nav-ink .nav-links a::after{background:var(--ink);}
.nav-ink .nav-links a.active{color:var(--ink);}
.nav-ink .nav-cta{border-color:var(--accent);color:var(--accent-deep);}
.nav-ink .nav-cta:hover{background:var(--accent);color:var(--cream);}
.nav-ink .nav-burger span{background:var(--ink);}
.nav-ink .nav-wordmark{color:var(--ink);}
.nav-ink .nav-logo img{filter:invert(.85);}

/* Nav state: mobile menu open — plain cream on mahogany, never blended (kills the light-blue cast) */
.nav.nav-menu-open{mix-blend-mode:normal;}
.nav.nav-menu-open .nav-burger span{background:var(--cream);}
.nav.nav-menu-open .nav-wordmark{color:var(--cream);}
.nav.nav-menu-open .nav-logo img{filter:none;}

/* Mobile menu */
.mobile-menu{
  position:fixed;inset:0;z-index:85;background:var(--ink-deep);
  display:flex;flex-direction:column;justify-content:center;padding:0 40px;
  opacity:0;pointer-events:none;transition:opacity .5s var(--ease);
}
.mobile-menu.open{opacity:1;pointer-events:auto;}
.mobile-menu a{
  font-family:var(--serif);font-size:42px;color:var(--cream);text-decoration:none;
  padding:14px 0;border-bottom:1px solid rgba(206,193,168,.15);
}
.mobile-menu a.active{color:var(--accent-light);}
.mobile-menu .mm-meta{margin-top:36px;font-size:11px;letter-spacing:.3em;text-transform:uppercase;color:var(--accent-light);}

/* ============ REVEALS (JS adds .is-inview) ============ */
[data-reveal]{opacity:0;transform:translateY(46px);transition:opacity 1s var(--ease),transform 1s var(--ease);}
[data-reveal].is-inview{opacity:1;transform:none;}
[data-reveal-img]{overflow:hidden;}
[data-reveal-img] img{transform:scale(1.12);transition:transform 1.6s var(--ease);}
[data-reveal-img].is-inview img{transform:scale(1);}

/* ============ HOME HERO ============ */
.hero{
  min-height:100vh;display:grid;grid-template-columns:1fr 1fr;
  padding-top:85px;
}
.hero-left{
  display:flex;flex-direction:column;justify-content:center;
  padding:60px 7vw 100px;position:relative;
}
.hero-left .eyebrow{margin-bottom:32px;}
.hero-left h1{font-size:clamp(56px,6.4vw,104px);letter-spacing:.005em;}
.hero-sub{margin-top:32px;max-width:480px;font-size:18px;line-height:1.8;color:rgba(28,28,27,.75);}
.hero-ctas{display:flex;gap:18px;margin-top:46px;flex-wrap:wrap;}
.hero-meta{position:absolute;bottom:38px;left:7vw;font-size:11px;letter-spacing:.24em;text-transform:uppercase;color:rgba(28,28,27,.5);}
.hero-meta b{color:var(--accent-deep);font-weight:500;}
.hero-right{position:relative;overflow:hidden;min-height:560px;}
.hero-right img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center 28%;}
.hero-right::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(28,28,27,.18),transparent 30%,transparent 55%,rgba(28,28,27,.62));}
.hero-frame{position:absolute;inset:22px;border:1px solid rgba(241,234,218,.4);z-index:5;pointer-events:none;}
.hero-cap{position:absolute;bottom:48px;left:52px;z-index:6;}
.hero-cap .c1{font-family:var(--serif);font-size:27px;color:var(--cream);}
.hero-cap .c2{margin-top:6px;font-size:10px;letter-spacing:.3em;text-transform:uppercase;color:rgba(241,234,218,.75);}
.hero-vol{position:absolute;top:44px;right:52px;z-index:6;font-family:var(--serif);font-size:14px;letter-spacing:.3em;color:rgba(241,234,218,.65);text-transform:uppercase;}

/* ============ MARQUEE (thin strip) ============ */
.marquee{
  background:var(--ink-deep);color:var(--cream);
  padding:11px 0;overflow:hidden;white-space:nowrap;position:relative;
}
.marquee-track{display:inline-flex;gap:44px;align-items:center;will-change:transform;}
.marquee-track span{font-family:var(--serif);font-size:15px;color:var(--accent-light);letter-spacing:.06em;}
.marquee-track span b{color:var(--cream);font-weight:400;}
.marquee-track .sep{color:var(--accent);font-size:9px;}

/* ============ SECTIONS ============ */
.section{padding:120px 7vw;}
.section.tight{padding:100px 7vw;}
.section.on-dark{background:var(--ink-deep);color:var(--cream);}
.section.on-dark .chapter-tag .name{color:#AAA396;}
.section.on-dark .chapter-tag .num{color:var(--accent-light);}
.section.on-dark h2 em{color:var(--accent-light);}
.section.linen{background:var(--bg-2);}
.section h2{font-size:clamp(40px,4.4vw,64px);}
.section .lead{margin-top:32px;font-size:17.5px;line-height:1.85;color:rgba(28,28,27,.75);max-width:640px;}
.on-dark .lead{color:rgba(241,234,218,.75);}

/* Filmstrip gallery */
.filmstrip-wrap{overflow-x:auto;overflow-y:hidden;margin:0 -7vw;padding:0 7vw;scrollbar-width:none;-ms-overflow-style:none;}
.filmstrip-wrap::-webkit-scrollbar{display:none;}
.filmstrip{display:flex;gap:22px;cursor:grab;user-select:none;}
.filmstrip.dragging{cursor:grabbing;}
.fcard{flex:0 0 340px;height:440px;position:relative;overflow:hidden;display:flex;align-items:flex-end;padding:26px;text-decoration:none;}
.fcard.wide{flex:0 0 400px;}
.fcard img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;transition:transform 1.2s var(--ease);}
.fcard:hover img{transform:scale(1.05);}
.fcard::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,transparent 45%,rgba(28,28,27,.72));z-index:2;}
.fcard .cap{position:relative;z-index:5;}
.fcard .cap .c1{font-family:var(--serif);font-size:24px;color:var(--cream);}
.fcard .cap .c2{margin-top:5px;font-size:10px;letter-spacing:.3em;text-transform:uppercase;color:rgba(241,234,218,.7);}
.strip-hint{margin-top:30px;font-size:10px;letter-spacing:.3em;text-transform:uppercase;color:var(--grey);display:flex;align-items:center;gap:16px;}
.strip-hint::after{content:"";width:110px;height:1px;background:linear-gradient(90deg,var(--accent),transparent);}

/* Film feature */
.film-frame{position:relative;height:min(58vh,520px);overflow:hidden;margin-top:10px;}
.film-frame img{width:100%;height:100%;object-fit:cover;}
.film-frame::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(28,28,27,.3),transparent 35%,transparent 55%,rgba(28,28,27,.75));}
.film-play{
  position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);z-index:6;
  width:96px;height:96px;border-radius:50%;border:1px solid var(--accent-light);
  display:flex;align-items:center;justify-content:center;background:rgba(28,28,27,.5);
  color:var(--cream);font-size:18px;text-decoration:none;
  transition:transform .5s var(--ease),background .5s var(--ease);
}
.film-play:hover{transform:translate(-50%,-50%) scale(1.08);background:rgba(138,116,88,.6);}
.film-bar{position:absolute;bottom:0;left:0;right:0;z-index:5;display:flex;justify-content:space-between;padding:22px 30px;font-size:10px;letter-spacing:.28em;text-transform:uppercase;color:rgba(241,234,218,.7);}
.film-bar b{color:var(--accent-light);font-weight:500;}
.film-cols{display:grid;grid-template-columns:1fr 1fr;gap:70px;margin-top:52px;align-items:start;}
.film-cols h2{font-size:clamp(34px,3.6vw,50px);}
.film-cols p{color:rgba(241,234,218,.75);font-size:17px;line-height:1.85;}

/* Investment strip (home) + pricing page */
.inv-lines{margin-top:50px;display:flex;align-items:stretch;justify-content:center;flex-wrap:wrap;}
.inv-line{padding:12px 64px;text-align:center;}
.inv-line + .inv-line{border-left:1px solid var(--hairline);}
.inv-line .k{font-size:11px;letter-spacing:.34em;text-transform:uppercase;color:var(--grey);}
.inv-line .v{font-family:var(--serif);font-size:42px;color:var(--ink);margin-top:12px;}
.inv-line .v i{font-style:normal;color:var(--accent-deep);}
.inv-note{margin-top:44px;font-family:var(--serif);font-size:19px;color:var(--grey-2);}

/* Testimonial band */
.testimonial{background:var(--ink-deep);color:var(--cream);padding:130px 10vw;text-align:center;}
.testimonial .q{font-family:var(--serif);font-style:italic;font-size:clamp(28px,3.4vw,46px);line-height:1.4;}
.testimonial .q .hl{color:var(--accent-light);}
.testimonial .who{margin-top:32px;font-size:11px;letter-spacing:.34em;text-transform:uppercase;color:var(--accent-light);}
.testimonial .g{margin-top:12px;font-size:12px;color:#AAA396;letter-spacing:.1em;}

/* About block (home) */
.about-grid{display:grid;grid-template-columns:minmax(300px,480px) 1fr;gap:80px;align-items:center;}
.about-grid .portrait{position:relative;overflow:hidden;}
.about-grid .portrait img{width:100%;height:auto;aspect-ratio:4/5;object-fit:cover;}
.about-grid .portrait .frame{position:absolute;inset:16px;border:1px solid rgba(241,234,218,.45);z-index:3;}
.about-grid p{margin-top:30px;font-size:17px;line-height:1.9;color:rgba(28,28,27,.75);max-width:600px;}
.signature{margin-top:24px;font-family:var(--serif);font-style:italic;font-size:28px;color:var(--accent-deep);}

/* Final CTA */
.final{
  background:radial-gradient(1000px 400px at 50% 120%, rgba(138,116,88,.28), transparent 62%), linear-gradient(180deg,var(--ink-deep),var(--ink-deeper));
  color:var(--cream);text-align:center;padding:150px 7vw 60px;
}
.final .eyebrow{color:var(--accent-light);}
.final h2{font-size:clamp(44px,5.4vw,76px);margin-top:26px;}
.final h2 em{color:var(--accent-light);}
.final p{margin-top:24px;color:rgba(241,234,218,.7);max-width:560px;margin-left:auto;margin-right:auto;}
.final .btn{margin-top:44px;}

/* Footer */
.footer{
  border-top:1px solid rgba(206,193,168,.2);margin-top:110px;
  padding:34px 0 0;display:flex;justify-content:space-between;align-items:center;gap:24px;flex-wrap:wrap;
  font-size:11px;letter-spacing:.14em;color:#AAA396;text-align:left;
}
.footer img{height:32px;}
.footer .soc{display:flex;gap:26px;text-transform:uppercase;letter-spacing:.22em;font-size:10px;}
.footer .soc a{color:rgba(241,234,218,.65);text-decoration:none;transition:color .3s;}
.footer .soc a:hover{color:var(--accent-light);}

/* ============ INNER PAGES ============ */
.page-hero{padding:190px 7vw 80px;}
.page-hero h1{font-size:clamp(48px,6vw,88px);}
.page-hero .lead{margin-top:28px;font-size:18px;color:rgba(28,28,27,.72);max-width:640px;line-height:1.85;}

/* Weddings grid */
.wgrid{display:grid;grid-template-columns:repeat(3,1fr);gap:26px;}
.wgrid-3{grid-template-columns:repeat(3,1fr);}
.wgrid-4{grid-template-columns:repeat(4,1fr);}
.wcard{position:relative;overflow:hidden;text-decoration:none;display:block;}
.wcard .im{overflow:hidden;aspect-ratio:4/5;}
.wcard img{width:100%;height:100%;object-fit:cover;transition:transform 1.2s var(--ease);}
.wcard:hover img{transform:scale(1.05);}
.wcard .t{margin-top:18px;font-family:var(--serif);font-size:26px;color:var(--ink);}
.wcard .v{margin-top:4px;font-size:10px;letter-spacing:.3em;text-transform:uppercase;color:var(--grey);}
.wcard .view{margin-top:10px;font-size:10px;letter-spacing:.28em;text-transform:uppercase;color:var(--accent-deep);border-bottom:1px solid var(--accent);display:inline-block;padding-bottom:4px;}

/* Gallery masonry */
.masonry{columns:3;column-gap:22px;}
.masonry figure{margin:0 0 22px;overflow:hidden;break-inside:avoid;position:relative;}
.masonry img{width:100%;transition:transform 1.2s var(--ease);}
.masonry figure:hover img{transform:scale(1.04);}

/* Films page */
.video-embed{position:relative;aspect-ratio:16/9;background:var(--ink-deep);overflow:hidden;}
.video-embed iframe{position:absolute;inset:0;width:100%;height:100%;border:0;}
.film-note{display:grid;grid-template-columns:1fr 1fr;gap:70px;margin-top:70px;}
.film-note h3{font-size:30px;}
.film-note p{margin-top:18px;color:rgba(28,28,27,.72);}

/* Pricing page */
.price-cols{display:grid;grid-template-columns:1fr 1fr;gap:26px;margin-top:60px;}
.price-col{border:1px solid var(--hairline);padding:60px 50px;text-align:center;background:#F7F1E4;}
.price-col .k{font-size:11px;letter-spacing:.34em;text-transform:uppercase;color:var(--grey);}
.price-col .v{font-family:var(--serif);font-size:56px;margin-top:20px;}
.price-col .v i{font-style:normal;color:var(--accent-deep);}
.price-col p{margin-top:22px;color:rgba(28,28,27,.7);font-size:15px;line-height:1.8;}
.pricing-note{margin-top:56px;text-align:center;}
.pricing-note .inv-note{margin-top:0;}

/* Contact */
.contact-grid{display:grid;grid-template-columns:1fr 1fr;gap:90px;align-items:start;}
.contact-info .line{padding:22px 0;border-bottom:1px solid var(--hairline-ink);}
.contact-info .k{font-size:10px;letter-spacing:.3em;text-transform:uppercase;color:var(--grey);}
.contact-info .v{margin-top:8px;font-family:var(--serif);font-size:23px;}
.contact-info a{text-decoration:none;color:var(--ink);transition:color .3s;}
.contact-info a:hover{color:var(--accent-deep);}
.form-field{margin-bottom:26px;}
.form-field label{display:block;font-size:10px;letter-spacing:.3em;text-transform:uppercase;color:var(--grey);margin-bottom:10px;}
.form-field input,.form-field select,.form-field textarea{
  width:100%;background:transparent;border:0;border-bottom:1px solid rgba(28,28,27,.25);
  padding:12px 0;font-family:var(--sans);font-size:16px;color:var(--ink);
  transition:border-color .3s;outline:none;border-radius:0;-webkit-appearance:none;
}
.form-field input:focus,.form-field select:focus,.form-field textarea:focus{border-color:var(--accent);}
.form-field textarea{min-height:110px;resize:vertical;}
.form-success{display:none;padding:26px;border:1px solid var(--accent);color:var(--accent-deep);font-size:15px;margin-top:20px;}

/* ============ RESPONSIVE ============ */
@media (max-width:1100px){
  .hero{grid-template-columns:1fr;}
  .hero-right{min-height:64vh;order:-1;margin-top:0;}
  .hero-left{padding:70px 7vw 110px;}
  .wgrid,.wgrid-3{grid-template-columns:repeat(2,1fr);}
  .wgrid-4{grid-template-columns:repeat(2,1fr);}
  .masonry{columns:2;}
  .film-cols,.film-note,.contact-grid{grid-template-columns:1fr;gap:44px;}
  .about-grid{grid-template-columns:1fr;gap:50px;}
  .about-grid .portrait{max-width:480px;}
}
@media (max-width:760px){
  .nav{padding:16px 22px;}
  .nav-links,.nav-cta{display:none;}
  .nav-burger{display:block;}
  .section,.section.tight{padding:80px 22px;}
  .page-hero{padding:140px 22px 60px;}
  .filmstrip-wrap{margin:0 -22px;padding:0 22px;}
  .fcard{flex:0 0 78vw;height:420px;}
  .fcard.wide{flex:0 0 78vw;}
  .wgrid,.wgrid-3,.wgrid-4{grid-template-columns:1fr;}
  .masonry{columns:1;}
  .price-cols{grid-template-columns:1fr;}
  .inv-line{padding:12px 34px;}
  .inv-line + .inv-line{border-left:0;border-top:1px solid var(--hairline);margin-top:20px;padding-top:32px;}
  .hero-cap{left:26px;bottom:26px;}
  .hero-vol{display:none;}
  .hero-meta{position:static;margin-top:40px;}
  .testimonial{padding:90px 26px;}
  .footer{flex-direction:column;align-items:flex-start;gap:18px;}
}

/* ============ PRELOADER — letter-roll wordmark (first visit only) ============ */
.preloader{
  position:fixed;inset:0;z-index:200;background:var(--ink-deeper);
  display:flex;align-items:center;justify-content:center;
  transition:transform .8s cubic-bezier(.76,0,.24,1);
  --elemDistance:0.18em;
}
.preloader--skip{display:none;}
.preloader--lift{transform:translateY(-100%);}
.preloader--hide{display:none;}
.pl-word{display:flex;align-items:baseline;}
.pl-letter{
  position:relative;overflow:hidden;display:inline-block;
  font-family:var(--serif);font-size:clamp(52px,9vw,120px);
  line-height:1.1;color:var(--cream);
}
.pl-letter.pl-space{width:.34em;}
.pl-letter .g1,.pl-letter .g2{display:block;}
.pl-letter .g2{position:absolute;left:0;top:0;transform:translateY(calc(100% + var(--elemDistance)));}
/* wave in: first glyph rolls up and out, duplicate rolls up into place — 1s ease-in-out, staggered */
.preloader.pl-in .pl-letter .g1{animation:plRollOut 1s ease-in-out forwards;animation-delay:var(--d);}
.preloader.pl-in .pl-letter .g2{animation:plRollIn 1s ease-in-out forwards;animation-delay:var(--d);}
/* wave out: settled glyph rolls up and away */
.preloader.pl-out .pl-letter .g2{animation:plRollOut .7s ease-in-out forwards;animation-delay:var(--dout);}
@keyframes plRollOut{
  0%{transform:translateY(0);}
  100%{transform:translateY(calc(-100% - var(--elemDistance)));}
}
@keyframes plRollIn{
  0%{transform:translateY(calc(100% + var(--elemDistance)));}
  100%{transform:translateY(0);}
}
/* 0-100 load bar */
.pl-load{
  position:absolute;left:56px;right:56px;bottom:44px;
  display:flex;align-items:center;gap:20px;color:var(--cream);
}
.pl-num{font-family:var(--sans);font-size:12px;letter-spacing:.18em;min-width:48px;font-variant-numeric:tabular-nums;}
.pl-bar{flex:1;height:1px;background:rgba(241,234,218,.18);position:relative;display:block;}
.pl-bar b{position:absolute;left:0;top:0;bottom:0;width:100%;background:var(--cream);transform-origin:left;transform:scaleX(0);display:block;}
@media (max-width:760px){.pl-load{left:24px;right:24px;bottom:30px;}}
@media (prefers-reduced-motion:reduce){.preloader{display:none;}}

/* ============ GALLERY-ROLL HERO — reel-spin per image cell ============
   Each cell starts 130/210/170% of its own height below (per column) and
   travels to -420%: the gallery streams upward like a reel, 3s ease. */
.ghero{position:relative;height:100vh;min-height:640px;overflow:hidden;background:var(--ink-deeper);}
.ghero-cols{position:absolute;inset:0;display:flex;gap:14px;padding:0 14px;}
.gcol{flex:1;display:flex;flex-direction:column;gap:14px;}
.gcol img{width:100%;aspect-ratio:3/4;object-fit:cover;flex:0 0 auto;transform:translateY(var(--gfrom));will-change:transform;}
.gcol-1{--gfrom:130%;}
.gcol-2{--gfrom:210%;}
.gcol-3{--gfrom:170%;}
body.intro-go .gcol img{animation:gReel 3s ease forwards;}
@keyframes gReel{
  0%{transform:translateY(var(--gfrom));}
  100%{transform:translateY(-420%);}
}
.ghero-scrim{
  position:absolute;inset:0;z-index:2;
  background:linear-gradient(180deg,rgba(28,28,27,.42),rgba(28,28,27,.18) 40%,rgba(28,28,27,.55) 100%);
}
.ghero-center{
  position:absolute;inset:0;z-index:3;
  display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;
  padding:0 24px;
}
.ghero-center .eyebrow{color:var(--accent-light);margin-bottom:26px;}
.ghero-center h1{font-size:clamp(44px,10vw,150px);color:var(--cream);line-height:1.02;max-width:100%;}
.ghero-sub{margin-top:26px;max-width:520px;font-size:17.5px;line-height:1.8;color:rgba(241,234,218,.85);}
.ghero-ctas{display:flex;gap:18px;margin-top:42px;flex-wrap:wrap;justify-content:center;}
.ghero-meta{position:absolute;bottom:34px;left:0;right:0;z-index:3;text-align:center;font-size:11px;letter-spacing:.24em;text-transform:uppercase;color:rgba(241,234,218,.6);}
.ghero-meta b{color:var(--accent-light);font-weight:500;}
@media (prefers-reduced-motion:reduce){
  .gcol img{transform:translateY(-420%)!important;animation:none!important;}
}

/* Mobile: after the reel lands, zoom into a full-screen crossfading carousel */
.ghero-carousel{
  position:absolute;inset:0;z-index:1;
  opacity:0;transform:scale(1.12);
  transition:opacity 1.1s var(--ease),transform 1.7s var(--ease);
  pointer-events:none;
}
.ghero--carousel .ghero-carousel{opacity:1;transform:scale(1);}
.ghero-carousel img{
  position:absolute;inset:0;width:100%;height:100%;object-fit:cover;
  opacity:0;transition:opacity 1.2s var(--ease);
}
.ghero-carousel img.active{opacity:1;animation:kenburns 6.5s ease forwards;}
@keyframes kenburns{0%{transform:scale(1);}100%{transform:scale(1.07);}}
.ghero--carousel .ghero-cols{
  opacity:0;transform:scale(1.14);
  transition:opacity .9s var(--ease),transform 1.5s var(--ease);
}
.ghero--carousel .ghero-scrim{
  background:linear-gradient(180deg,rgba(28,28,27,.55),rgba(28,28,27,.32) 40%,rgba(28,28,27,.68) 100%);
}
@media (max-width:760px){
  .ghero-scrim{background:linear-gradient(180deg,rgba(28,28,27,.5),rgba(28,28,27,.3) 40%,rgba(28,28,27,.62) 100%);}
}
@media (max-width:760px){
  .ghero-cols{gap:8px;padding:0 8px;}
  .gcol{gap:8px;}
  .nav-wordmark{font-size:20px;}
  .ghero-center h1{font-size:clamp(40px,12vw,56px);}
  .ghero-sub{font-size:15.5px;}
  .ghero-ctas .btn{padding:15px 26px;letter-spacing:.2em;}
}

/* ============ CHAMPAGNE BOKEH HERO LAYER ============ */
.bokeh-canvas{position:absolute;inset:0;z-index:1;pointer-events:none;mix-blend-mode:screen;opacity:.85;}
.hero-right::after{z-index:2;}
.hero-right .hero-frame{z-index:5;}

/* SplitText characters */
.split-char{display:inline-block;will-change:transform;}

/* ============ SCROLL-SCRUB DRONE STAGE ============ */
.scrub-stage{position:relative;height:340vh;background:var(--ink-deeper);}
.scrub-pin{position:sticky;top:0;height:100vh;overflow:hidden;display:flex;align-items:center;justify-content:center;}
.scrub-video,.scrub-poster{
  position:absolute;inset:0;width:100%;height:100%;object-fit:cover;
  will-change:transform;backface-visibility:hidden;
}
.scrub-poster{z-index:1;transition:opacity .6s var(--ease);}
.scrub-stage.is-ready .scrub-poster{opacity:0;}
.scrub-video{z-index:2;opacity:0;transition:opacity .6s var(--ease);}
.scrub-stage.is-ready .scrub-video{opacity:1;}
.scrub-pin::after{content:"";position:absolute;inset:0;z-index:3;pointer-events:none;
  background:linear-gradient(180deg,rgba(28,28,27,.55),transparent 26%,transparent 62%,rgba(28,28,27,.82));}
.scrub-overlay{position:absolute;inset:0;z-index:4;color:var(--cream);}
.scrub-line-wrap{position:absolute;left:7vw;right:7vw;top:50%;transform:translateY(-50%);text-align:center;}
.scrub-cap{
  position:absolute;left:0;right:0;bottom:9vh;z-index:4;text-align:center;color:var(--cream);
  font-size:11px;letter-spacing:.34em;text-transform:uppercase;opacity:.85;
}
.scrub-line{
  font-family:var(--serif);font-weight:400;line-height:1.05;
  font-size:clamp(38px,6.6vw,104px);will-change:transform,opacity;
}
.scrub-line em{color:var(--accent-light);}
.scrub-eyebrow{will-change:transform,opacity;}
.scrub-progress{
  position:absolute;left:50%;bottom:4vh;transform:translateX(-50%);z-index:4;
  width:120px;height:2px;background:rgba(241,234,218,.22);overflow:hidden;
}
.scrub-progress span{position:absolute;inset:0;transform-origin:left;transform:scaleX(0);background:var(--accent-light);will-change:transform;}
.scrub-loading{position:absolute;inset:0;z-index:5;display:flex;align-items:center;justify-content:center;color:var(--cream);
  font-size:11px;letter-spacing:.3em;text-transform:uppercase;background:var(--ink-deeper);transition:opacity .5s var(--ease);}
.scrub-stage.is-ready .scrub-loading{opacity:0;pointer-events:none;}
@media (max-width:760px){.scrub-stage{height:280vh;}}

/* Lightbox */
.lightbox{
  position:fixed;inset:0;z-index:98;background:rgba(28,28,27,.94);
  display:flex;align-items:center;justify-content:center;padding:5vw;
  opacity:0;pointer-events:none;transition:opacity .4s var(--ease);cursor:zoom-out;
}
.lightbox.open{opacity:1;pointer-events:auto;}
.lightbox img{max-width:100%;max-height:90vh;object-fit:contain;box-shadow:0 30px 80px rgba(0,0,0,.5);}

/* Reduced motion */
@media (prefers-reduced-motion:reduce){
  [data-reveal],[data-reveal-img] img{opacity:1!important;transform:none!important;transition:none!important;}
  .marquee-track{animation:none!important;}
  *{scroll-behavior:auto!important;}
}
