/* ══════════════════════════════════════════════════
   ALYZE — Cinema Layer
   Video heroes, cinematic text beats, gold reveals.
   Shares the animation language of the member app's
   welcome film (WelcomeSequence): house easing
   cubic-bezier(.22,1,.36,1), blur-dissolve entrances,
   tracking compression, drifting gold orbs, grain.
   ══════════════════════════════════════════════════ */

/* ── Cinematic hero (video) ── */
.cine-hero{position:sticky;top:0;height:100vh;min-height:680px;overflow:hidden;background:var(--deep);display:flex;align-items:center;justify-content:center;text-align:center}
.cine-hero video.hero-bg{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;filter:brightness(.42) saturate(.92);will-change:transform}
.cine-hero::after{content:'';position:absolute;inset:0;z-index:1;background:
  linear-gradient(180deg,rgba(34,30,26,.62) 0%,rgba(34,30,26,.28) 36%,rgba(34,30,26,.18) 55%,rgba(228,223,214,.32) 78%,rgba(228,223,214,.88) 92%,var(--plaster-l) 100%)}

/* film grain + vignette, same recipe as the member app film */
.cine-grain{position:absolute;inset:0;z-index:1;pointer-events:none;opacity:.55;mix-blend-mode:overlay;background:url("data:image/svg+xml,%3Csvg viewBox='0 0 300 300' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='g'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23g)' opacity='0.05'/%3E%3C/svg%3E")}
.cine-vig{position:absolute;inset:0;z-index:1;pointer-events:none;background:radial-gradient(120% 120% at 50% 42%,transparent 55%,rgba(10,8,5,.42) 100%)}

/* drifting gold orbs — depth layer */
.orb{position:absolute;border-radius:50%;pointer-events:none;z-index:1;will-change:transform}
.orb-a{width:70vmax;height:70vmax;left:-22vmax;top:-26vmax;opacity:.15;background:radial-gradient(circle,rgba(212,188,142,.55),rgba(212,188,142,0) 62%);animation:orb-a 26s cubic-bezier(.45,0,.55,1) infinite alternate}
.orb-b{width:52vmax;height:52vmax;right:-18vmax;bottom:-20vmax;opacity:.1;background:radial-gradient(circle,rgba(193,168,117,.5),rgba(193,168,117,0) 60%);animation:orb-b 21s cubic-bezier(.45,0,.55,1) infinite alternate}
@keyframes orb-a{from{transform:translate3d(0,0,0) scale(1)}to{transform:translate3d(7vmax,5vmax,0) scale(1.14)}}
@keyframes orb-b{from{transform:translate3d(0,0,0) scale(1.1)}to{transform:translate3d(-6vmax,-4vmax,0) scale(1)}}

/* cinematic text entrance — blur-dissolve + tracking compression */
@keyframes cine-land{
  from{opacity:0;transform:translateY(28px);filter:blur(14px);letter-spacing:.08em}
  to{opacity:1;transform:translateY(0);filter:blur(0);letter-spacing:normal}}
@keyframes cine-soft{from{opacity:0;transform:translateY(14px)}to{opacity:1;transform:translateY(0)}}
.cl{opacity:0;animation:cine-land 1.2s cubic-bezier(.22,1,.36,1) forwards}
.cs{opacity:0;animation:cine-soft 1s cubic-bezier(.22,1,.36,1) forwards}
.cl-1{animation-delay:.25s}.cl-2{animation-delay:1.05s}.cl-3{animation-delay:1.85s}
.cs-4{animation-delay:2.7s}.cs-5{animation-delay:3.05s}

/* gold underline sweep */
.gold-sweep{position:relative;display:inline-block}
.gold-sweep::after{content:'';position:absolute;left:0;right:0;bottom:-6px;height:1.5px;background:linear-gradient(90deg,rgba(193,168,117,0),var(--gold) 18%,var(--gold-b) 50%,var(--gold) 82%,rgba(193,168,117,0));transform:scaleX(0);transform-origin:left;animation:sweep .85s cubic-bezier(.22,1,.36,1) 2.5s forwards}
@keyframes sweep{to{transform:scaleX(1)}}

/* wordmark light sweep (ALYZE shine) */
.shine{position:relative;display:inline-block}
.shine::after{content:attr(data-text);position:absolute;inset:0;background:linear-gradient(105deg,transparent 38%,rgba(255,248,235,.9) 50%,transparent 62%);background-size:220% 100%;background-position:220% 0;-webkit-background-clip:text;background-clip:text;color:transparent;animation:shine 1.4s cubic-bezier(.4,0,.2,1) 2.1s forwards}
@keyframes shine{to{background-position:-120% 0}}

/* ── Video loop cards ── */
.vc{position:relative;border-radius:22px;overflow:hidden;display:block;text-decoration:none;color:inherit;box-shadow:0 10px 36px rgba(42,36,32,.08);transition:transform .5s cubic-bezier(.22,1,.36,1),box-shadow .5s}
.vc:hover{transform:translateY(-4px);box-shadow:0 18px 48px rgba(42,36,32,.14)}
.vc video,.vc img.vc-poster{width:100%;aspect-ratio:4/3;object-fit:cover;display:block;transition:transform .8s cubic-bezier(.22,1,.36,1)}
.vc:hover video,.vc:hover img.vc-poster{transform:scale(1.04)}
.vc::after{content:'';position:absolute;inset:0;background:linear-gradient(180deg,transparent 42%,rgba(26,22,18,.72) 100%);pointer-events:none}
.vc-label{position:absolute;left:20px;right:20px;bottom:16px;z-index:2}
.vc-label h3{color:var(--cream);font-size:16px;font-weight:600;letter-spacing:.01em;margin-bottom:2px}
.vc-label p{color:rgba(245,241,235,.62);font-size:12.5px;font-weight:300;line-height:1.5}
.vc-num{position:absolute;top:16px;left:20px;z-index:2;font-family:'Antonio',sans-serif;font-size:13px;letter-spacing:.18em;color:rgba(245,241,235,.5)}

/* ── Journey (scroll-driven assessment timeline) ── */
.jny{position:relative;max-width:1080px;margin:0 auto}
.jny-line{position:absolute;left:50%;top:0;bottom:0;width:1px;background:linear-gradient(180deg,transparent,rgba(193,168,117,.35) 8%,rgba(193,168,117,.35) 92%,transparent);transform:translateX(-50%)}
.jny-step{display:grid;grid-template-columns:1fr 56px 1fr;align-items:center;gap:0;padding:34px 0}
.jny-dot{grid-column:2;justify-self:center;width:11px;height:11px;border-radius:50%;background:var(--gold);box-shadow:0 0 0 5px rgba(193,168,117,.15);position:relative;z-index:2}
.jny-media{border-radius:20px;overflow:hidden;box-shadow:0 12px 40px rgba(42,36,32,.1)}
.jny-media video,.jny-media img{width:100%;aspect-ratio:16/10;object-fit:cover;display:block}
.jny-copy{padding:0 36px}
.jny-copy .jn{font-family:'Antonio',sans-serif;font-size:13px;letter-spacing:.22em;color:var(--gold);opacity:.75;margin-bottom:8px}
.jny-copy h3{font-weight:300;font-size:clamp(19px,2vw,27px);letter-spacing:-.01em;line-height:1.3;margin-bottom:10px}
.jny-copy p{font-size:14px;font-weight:300;color:var(--char-l);line-height:1.8;max-width:380px}
.jny-step:nth-child(even) .jny-media{grid-column:3;grid-row:1}
.jny-step:nth-child(even) .jny-copy{grid-column:1;grid-row:1;text-align:right}
.jny-step:nth-child(even) .jny-copy p{margin-left:auto}
.jny-step:nth-child(odd) .jny-media{grid-column:1;grid-row:1}
.jny-step:nth-child(odd) .jny-copy{grid-column:3;grid-row:1}

/* ── Dark constellation section (Higgsfield bg) ── */
.constellation{position:relative;background:var(--deep);overflow:hidden}
.constellation video.cn-bg{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:.5}
.constellation::after{content:'';position:absolute;inset:0;background:radial-gradient(90% 90% at 50% 50%,transparent 30%,rgba(34,30,26,.88) 100%)}
.cn-inner{position:relative;z-index:2;max-width:880px;margin:0 auto;padding:130px 48px;text-align:center}
.cn-inner .lbl{margin-bottom:16px}
.cn-inner h2{font-weight:200;font-size:clamp(26px,3.2vw,46px);line-height:1.22;letter-spacing:-.02em;color:var(--cream)}
.cn-inner h2 .em{color:var(--gold-b)}
.cn-inner>p{margin:20px auto 0;font-size:15px;font-weight:300;color:rgba(245,241,235,.5);line-height:1.85;max-width:560px}

/* ── App showcase ── */
.app-show{display:grid;grid-template-columns:1fr 1fr;gap:64px;align-items:center;max-width:1080px;margin:0 auto}
.phone{width:min(290px,72vw);margin:0 auto;border-radius:44px;border:1px solid rgba(193,168,117,.25);background:var(--deep2);padding:10px;box-shadow:0 30px 80px rgba(42,36,32,.28),0 0 0 1px rgba(255,255,255,.04) inset}
.phone-screen{border-radius:36px;overflow:hidden;background:var(--deep)}
.phone-screen img{width:100%;display:block}
.app-feat{list-style:none;padding:0;margin:26px 0 0;display:grid;gap:14px}
.app-feat li{display:grid;grid-template-columns:30px 1fr;gap:12px;align-items:start}
.af-dot{width:26px;height:26px;border-radius:50%;background:var(--gold-soft);border:1px solid rgba(193,168,117,.4);color:var(--gold);font-size:12px;display:flex;align-items:center;justify-content:center;margin-top:1px}
.app-feat h4{font-size:14.5px;font-weight:600;color:var(--cream);margin-bottom:2px}
.app-feat p{font-size:13px;font-weight:300;color:rgba(245,241,235,.45);line-height:1.65;max-width:none}

/* ── Reveal variants ── */
.rv-l{opacity:0;transform:translateX(-24px);transition:opacity .9s cubic-bezier(.22,1,.36,1),transform .9s cubic-bezier(.22,1,.36,1)}
.rv-r{opacity:0;transform:translateX(24px);transition:opacity .9s cubic-bezier(.22,1,.36,1),transform .9s cubic-bezier(.22,1,.36,1)}
.rv-l.vis,.rv-r.vis{opacity:1;transform:translateX(0)}

/* ── Pillar page video hero ── */
.page-hero video.page-hero-bg{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;filter:brightness(.38) saturate(.92)}

/* ── V3: braver type scale ── */
.t-hero{font-weight:200;font-size:clamp(34px,5vw,78px);line-height:1.06;letter-spacing:-.03em}
.t-hero .em{font-size:1.05em}

/* ── V3: dark-section ambience (grain + corner orb everywhere dark) ── */
.dark-amb{position:relative;overflow:hidden}
.dark-amb::before{content:'';position:absolute;inset:0;z-index:0;pointer-events:none;opacity:.5;mix-blend-mode:overlay;background:url("data:image/svg+xml,%3Csvg viewBox='0 0 300 300' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='g'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23g)' opacity='0.05'/%3E%3C/svg%3E")}
.dark-amb::after{content:'';position:absolute;width:60vmax;height:60vmax;border-radius:50%;left:-26vmax;top:-30vmax;z-index:0;pointer-events:none;opacity:.12;background:radial-gradient(circle,rgba(212,188,142,.5),rgba(212,188,142,0) 62%);animation:orb-a 26s cubic-bezier(.45,0,.55,1) infinite alternate}

/* ── V3: journey takeover — full-bleed cinematic steps ── */
.jtk{position:relative;min-height:88vh;display:flex;align-items:flex-end;overflow:hidden;border-radius:28px;margin:18px auto;max-width:1320px}
.jtk video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.jtk::after{content:'';position:absolute;inset:0;background:linear-gradient(200deg,rgba(26,22,18,0) 30%,rgba(26,22,18,.74) 82%)}
.jtk-copy{position:relative;z-index:2;padding:56px;max-width:640px}
.jtk.alt{justify-content:flex-end}
.jtk.alt::after{background:linear-gradient(160deg,rgba(26,22,18,0) 30%,rgba(26,22,18,.74) 82%)}
.jtk.alt .jtk-copy{text-align:right}
.jtk-n{font-family:'Antonio',sans-serif;font-size:15px;letter-spacing:.3em;color:var(--gold-b);margin-bottom:14px}
.jtk-copy h3{font-weight:200;font-size:clamp(28px,3.6vw,54px);line-height:1.1;letter-spacing:-.02em;color:var(--cream)}
.jtk-copy h3 .em{color:var(--gold-b)}
.jtk-copy p{margin-top:14px;font-size:15px;font-weight:300;color:rgba(245,241,235,.66);line-height:1.8;max-width:440px}
.jtk.alt .jtk-copy p{margin-left:auto}

/* ── V3: arched pillar cards (the building's geometry) ── */
.vc-arch{border-radius:46% 46% 22px 22px / 32% 32% 22px 22px}
.vc-arch video,.vc-arch img.vc-poster{aspect-ratio:3/3.7}
.vc-arch .vc-label{left:24px;right:24px;bottom:20px;text-align:center}
.p-grid-v3{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;max-width:1140px;margin:0 auto;align-items:end}

/* ── V3: phone stage — Apple treatment ── */
.phone-stage{position:relative;display:inline-block}
.phone-stage::before{content:'';position:absolute;inset:-12% -28%;background:radial-gradient(50% 50% at 50% 52%,rgba(212,188,142,.3),rgba(212,188,142,.07) 55%,transparent 75%);pointer-events:none;z-index:0}
.phone-stage .phone{position:relative;z-index:1;will-change:transform}

/* ── V3: gradient seam between light and dark ── */
.seam-down{height:140px;background:linear-gradient(180deg,var(--plaster-l),var(--deep));border:none;margin:0}
.seam-up{height:140px;background:linear-gradient(180deg,var(--deep),var(--plaster-l));border:none;margin:0}

.offer-grid{margin-top:64px;display:grid;grid-template-columns:1fr auto 1fr;gap:48px;align-items:center}
@media(max-width:1024px){
  .p-grid-v3{grid-template-columns:repeat(2,1fr)}
  .offer-grid{grid-template-columns:1fr;gap:44px;justify-items:center}
  .offer-grid .app-feat{max-width:480px;order:2}
  .offer-grid>div:last-child{display:none}
}
@media(max-width:640px){
  .jtk{min-height:72vh;border-radius:18px;margin:10px 12px}
  .jtk-copy{padding:26px 22px}
  .jtk.alt .jtk-copy{text-align:left}
  .jtk.alt .jtk-copy p{margin-left:0}
  .p-grid-v3{grid-template-columns:1fr}
  .seam-down,.seam-up{height:80px}
}

/* ── Reduced motion ── */
@media (prefers-reduced-motion: reduce){
  .cl,.cs{animation:none;opacity:1}
  .gold-sweep::after{animation:none;transform:scaleX(1)}
  .shine::after{animation:none}
  .orb{animation:none}
  .rv,.rv-l,.rv-r{transition:none;opacity:1;transform:none}
  .cine-hero video.hero-bg,.constellation video.cn-bg{display:none}
}

@media(max-width:1024px){
  .app-show{grid-template-columns:1fr;gap:40px}
  .jny-step{grid-template-columns:1fr;padding:22px 0}
  .jny-line{left:6px}
  .jny-step .jny-dot{display:none}
  .jny-step:nth-child(n) .jny-media{grid-column:1;grid-row:auto}
  .jny-step:nth-child(n) .jny-copy{grid-column:1;grid-row:auto;text-align:left;padding:18px 0 0 22px}
  .jny-step:nth-child(even) .jny-copy p{margin-left:0}
}
@media(max-width:640px){
  .cine-hero{min-height:560px}
  .vc video,.vc img.vc-poster{aspect-ratio:16/10}
  .cn-inner{padding:80px 20px}
}
