/* ===== motion.css : FULL motion layer (loaded AFTER styles.css) =====
   Owner override: reduced-motion guardrail intentionally DISABLED. Cranked up.
   Still works with JS off (no locks; content visible). */
:root{ --m-out:cubic-bezier(.22,.61,.36,1); --m-io:cubic-bezier(.32,.72,0,1); }

/* ---- page-load intro curtain (GSAP-driven via fx.js, fail-safe) ----
   Visible only while html.pre is set (JS present + fx not finished). If JS is off
   or fx fails, html.pre is never set / gets dropped and the curtain never sticks. */
#intro{display:none}
html.pre #intro{display:grid;place-items:center;position:fixed;inset:0;z-index:110;
  background:radial-gradient(120% 100% at 50% 40%,#1b3053,var(--navy-deep))}
html.pre #intro .im{font-family:var(--serif);font-weight:900;font-size:clamp(38px,7vw,58px);letter-spacing:5px;
  color:var(--gold-soft);opacity:0;transform:translateY(12px)}

/* ---- hero animated gradient mesh (bigger, faster) ---- */
.hero .mesh{position:absolute;inset:-30% -14%;z-index:0;pointer-events:none;
  background:
   radial-gradient(38% 38% at 20% 30%, rgba(203,168,105,.22), transparent 70%),
   radial-gradient(48% 48% at 86% 16%, rgba(27,48,83,.75), transparent 72%),
   radial-gradient(42% 42% at 72% 94%, rgba(203,168,105,.14), transparent 70%);
  animation:meshDrift 15s ease-in-out infinite alternate;will-change:transform}
@keyframes meshDrift{0%{transform:translate3d(0,0,0) scale(1)}50%{transform:translate3d(4%,-3%,0) scale(1.12)}100%{transform:translate3d(-3.5%,4%,0) scale(1.07)}}
.hero .wrap,.hero .mesh~*:not(.imgbg):not(.bgov){position:relative;z-index:2}

/* ---- headline word reveal (GSAP-driven masking; fx.js splits into .wm/.wi) ---- */
.reveal-words .wm{display:inline-block;overflow:hidden;vertical-align:top;padding-bottom:.14em}
.reveal-words .wi{display:inline-block;font-style:inherit}

/* ---- scroll reveals (gated behind html.pre; GSAP owns the motion) ---- */
html.pre [data-reveal]{opacity:0;transform:translateY(48px);filter:blur(10px)}
html.pre [data-reveal].in{opacity:1;transform:none;filter:none}

/* ---- image reveal zoom (frames + cards) ---- */
html.pre [data-reveal] .mframe img,html.pre [data-reveal] .portrait-frame img,html.pre [data-reveal] .cardimg{transform:scale(1.12);transition:transform 1.2s var(--m-out)}
html.pre [data-reveal].in .mframe img,html.pre [data-reveal].in .portrait-frame img,html.pre [data-reveal].in .cardimg{transform:none}

/* ---- WebGL hero canvas ---- */
.hero-canvas{position:absolute;inset:0;width:100%;height:100%;z-index:0;pointer-events:none;display:block;opacity:0;transition:opacity 1.4s ease}
.hero-canvas.on{opacity:1}

/* ---- page transition overlay ---- */
.pagefade{position:fixed;inset:0;z-index:120;background:radial-gradient(120% 100% at 50% 40%,#1b3053,var(--navy-deep));visibility:hidden;opacity:0;pointer-events:none}

/* ---- nav scroll progress + condense ---- */
.navpill{position:relative;overflow:hidden}
.navpill .prog{position:absolute;left:0;bottom:0;height:2px;width:0;background:linear-gradient(90deg,var(--gold),var(--gold-bright));border-radius:0 2px 2px 0}
header.site.scrolled .navpill{box-shadow:0 18px 46px -22px rgba(20,37,63,.5)}

/* ---- card 3D tilt + gold glow ---- */
.shell{position:relative}
@media (hover:hover) and (pointer:fine){
  .tilt,.shell{transition:transform .2s var(--m-out),box-shadow .4s var(--m-out)}
  .tilt{transform:perspective(900px) rotateX(var(--ry,0deg)) rotateY(var(--rx,0deg))}
  .shell:hover{transform:perspective(900px) rotateX(var(--ry,0deg)) rotateY(var(--rx,0deg)) translateY(-6px)}
  .tilt::after{content:"";position:absolute;inset:0;border-radius:inherit;background:radial-gradient(260px 260px at var(--mx,50%) var(--my,50%),rgba(203,168,105,.22),transparent 60%);opacity:0;transition:opacity .35s;pointer-events:none;z-index:1}
  .tilt:hover::after{opacity:1}
  .tilt>*{position:relative;z-index:2}
}
/* ---- venture card image header ---- */
.cardimg{height:172px;margin:-28px -28px 22px;border-radius:18px 18px 0 0;background-size:cover;background-position:center;background-color:var(--navy-deep)}
.cardimg.grad{background:linear-gradient(135deg,var(--navy-2),var(--navy-deep) 60%);position:relative;overflow:hidden}
.cardimg.grad::after{content:"";position:absolute;inset:0;background:radial-gradient(120% 120% at 80% 20%,rgba(203,168,105,.26),transparent 58%)}
.cardimg.logohead{display:flex;align-items:center;justify-content:center;position:relative;overflow:hidden}
.cardimg.logohead::after{content:"";position:absolute;inset:0;background:radial-gradient(130% 130% at 50% -20%,rgba(255,255,255,.10),transparent 55%)}
.cardimg.logohead img{max-width:60%;max-height:46px;width:auto;height:auto;position:relative;z-index:1}

/* ---- count-up numbers ---- */
.stat-num{font-variant-numeric:tabular-nums}
.statrow{display:flex;flex-wrap:wrap;gap:26px 48px}
.statrow .stat-b{min-width:140px}
.statrow .stat-num{font-family:var(--serif);font-weight:900;font-size:clamp(34px,4vw,54px);color:var(--gold-soft);line-height:1}
.statrow .stat-l{font-family:var(--sans);font-size:13px;letter-spacing:.06em;color:rgba(244,238,225,.75);margin-top:8px;max-width:22ch}

/* ---- marquee credential ribbon (faster) ---- */
.marquee{overflow:hidden;position:relative;-webkit-mask-image:linear-gradient(90deg,transparent,#000 8%,#000 92%,transparent);mask-image:linear-gradient(90deg,transparent,#000 8%,#000 92%,transparent)}
.marquee .mtrack{display:flex;width:max-content;animation:marq 26s linear infinite;will-change:transform}
.marquee:hover .mtrack{animation-play-state:paused}
.marquee .hl{white-space:nowrap;padding:0 30px}
@keyframes marq{to{transform:translateX(-50%)}}

/* (custom cursor removed per owner) */

/* ---- brandmark shimmer ---- */
@media (hover:hover){
  .brand{background:linear-gradient(90deg,currentColor 0%,currentColor 40%,var(--gold-bright) 50%,currentColor 60%,currentColor 100%);background-size:220% 100%;background-position:120% 0;-webkit-background-clip:text;background-clip:text;transition:background-position .8s var(--m-out)}
  header.site .brand:hover{background-position:-120% 0}
}

/* ---- image atmosphere layers ---- */
.imgbg{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:0;pointer-events:none;display:block}
.bgov{position:absolute;inset:0;z-index:1;pointer-events:none}
.sec-bg{position:relative;isolation:isolate}
.sec-bg>.wrap,.sec-bg>*:not(.imgbg):not(.bgov){position:relative;z-index:2}
