:root{--text-xs:clamp(0.75rem,0.7rem + 0.25vw,0.875rem);--text-sm:clamp(0.875rem,0.8rem + 0.35vw,1rem);--text-base:clamp(1rem,0.95rem + 0.25vw,1.125rem);--text-lg:clamp(1.125rem,1rem + 0.75vw,1.5rem);--text-xl:clamp(1.5rem,1.2rem + 1.25vw,2.25rem);--text-2xl:clamp(2rem,1.2rem + 2.2vw,3.25rem);--space-4:1rem;--space-5:1.25rem;--space-6:1.5rem;--space-8:2rem;--space-10:2.5rem;--space-12:3rem;--space-16:4rem;--space-20:5rem;--space-24:6rem;--space-32:8rem;--color-bg:#070b11;--color-surface:#0b111a;--color-surface-2:#101826;--color-divider:#1c2534;--color-border:rgba(201,161,74,0.16);--color-text:#ead9b0;--color-text-soft:#c8b98f;--color-text-muted:#8d8672;--color-text-faint:#5d5949;--color-gold:#c9a14a;--color-gold-bright:#e8c877;--gold-glow:rgba(201,161,74,0.28);--radius-sm:0.375rem;--radius-lg:0.875rem;--radius-xl:1.25rem;--ease:cubic-bezier(0.16,1,0.3,1);--transition:240ms var(--ease);--shadow-md:0 10px 30px rgba(0,0,0,0.5);--content-wide:1240px;--content-narrow:680px;--font-display:'Cinzel',serif;--font-accent:'Cormorant Garamond',serif;--font-body:'Manrope',sans-serif}
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
html{-webkit-font-smoothing:antialiased;scroll-behavior:smooth;scroll-padding-top:5rem}
body{min-height:100dvh;font-family:var(--font-body);font-size:var(--text-base);line-height:1.6;color:var(--color-text-soft);background:var(--color-bg)}
img,svg{display:block;max-width:100%}
h1,h2,h3,h4{font-family:var(--font-display);font-weight:500;color:var(--color-text);letter-spacing:0.06em;line-height:1.15;text-wrap:balance}
p{text-wrap:pretty} a{color:inherit;text-decoration:none} button{cursor:pointer;background:none;border:none;font:inherit;color:inherit}
::selection{background:var(--gold-glow)}
:focus-visible{outline:2px solid var(--color-gold);outline-offset:3px}
.sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap}
a,button{transition:all var(--transition)}
@media (prefers-reduced-motion:reduce){*,*::before,*::after{animation-duration:.01ms!important;transition-duration:.01ms!important}}
.wrap{max-width:var(--content-wide);margin-inline:auto;padding-inline:var(--space-6)}
.section{padding-block:clamp(var(--space-10),5vw,var(--space-16))}
.nav{position:fixed;inset:0 0 auto 0;z-index:100;transition:background .35s var(--ease)}
.nav.scrolled{background:rgba(7,11,17,0.85);backdrop-filter:blur(16px);border-bottom:1px solid var(--color-divider)}
.nav-inner{max-width:var(--content-wide);margin-inline:auto;padding:var(--space-4) var(--space-6);display:flex;align-items:center;justify-content:space-between;gap:var(--space-6)}
.brand{display:flex;align-items:center;gap:var(--space-3);font-family:var(--font-display);font-size:1rem;letter-spacing:0.28em;color:var(--color-text)}
.brand img{border-radius:50%}
.nav-links{display:flex;align-items:center;gap:var(--space-8)}
.nav-links a{font-family:var(--font-display);font-size:0.8rem;letter-spacing:0.18em;color:var(--color-text-muted)}
.nav-links a:hover{color:var(--color-gold-bright)}
.btn{display:inline-flex;align-items:center;gap:var(--space-2);padding:0.8rem 1.6rem;border-radius:var(--radius-sm);font-family:var(--font-display);font-size:0.8rem;font-weight:500;letter-spacing:0.14em;line-height:1}
.btn-gold{background:linear-gradient(180deg,var(--color-gold-bright),var(--color-gold));color:#1a1404;box-shadow:0 4px 24px var(--gold-glow)}
.btn-gold:hover{transform:translateY(-2px);box-shadow:0 6px 36px var(--gold-glow)}
.btn-ghost{border:1px solid var(--color-border);color:var(--color-text)}
.btn-ghost:hover{border-color:var(--color-gold);color:var(--color-gold-bright)}
.sec-head{max-width:var(--content-narrow);margin:0 auto var(--space-16);text-align:center}
.sec-head .eyebrow{font-family:var(--font-display);font-size:var(--text-xs);letter-spacing:0.35em;text-transform:uppercase;color:var(--color-gold)}
.sec-head h2{font-size:var(--text-xl);margin-top:var(--space-5)}
.sec-head .rule{width:72px;height:1px;margin:var(--space-6) auto 0;background:linear-gradient(90deg,transparent,var(--color-gold),transparent)}
.product{display:grid;grid-template-columns:1fr 1fr;gap:clamp(var(--space-8),5vw,var(--space-20));align-items:center;padding-block:var(--space-16);border-top:1px solid var(--color-divider)}
.product:last-of-type{border-bottom:1px solid var(--color-divider)}
.product:nth-child(even) .product-media{order:-1}
.product .p-eyebrow{font-family:var(--font-display);font-size:var(--text-xs);letter-spacing:0.3em;text-transform:uppercase;color:var(--color-gold)}
.product h3{font-size:var(--text-xl);margin-top:var(--space-4)}
.product p{color:var(--color-text-muted);margin-top:var(--space-4);max-width:46ch}
.product-feats{list-style:none;margin-top:var(--space-6);display:flex;flex-direction:column;gap:var(--space-3)}
.product-feats li{display:flex;gap:var(--space-3);font-size:var(--text-sm);color:var(--color-text-soft)}
.product-feats li::before{content:"◆";color:var(--color-gold);font-size:0.6em;margin-top:0.4em}
.product-link{display:inline-flex;align-items:center;gap:var(--space-2);margin-top:var(--space-8);font-family:var(--font-display);font-size:0.8rem;letter-spacing:0.16em;color:var(--color-gold-bright)}
.product-link .arrow{transition:transform var(--transition)}
.product-link:hover .arrow{transform:translateX(5px)}
.product-media{position:relative;aspect-ratio:4/3;border-radius:var(--radius-lg);border:1px solid var(--color-border);background:linear-gradient(160deg,var(--color-surface) 0%,var(--color-surface-2) 100%);overflow:hidden;box-shadow:var(--shadow-md)}
.product-media::before{content:"";position:absolute;inset:0;z-index:1;background:radial-gradient(80% 90% at 50% 110%,var(--gold-glow),transparent 55%);opacity:0.6}
.product-media .corner{position:absolute;z-index:3;width:18px;height:18px;border-color:var(--color-gold)}
.corner.tl{top:12px;left:12px;border-top:1px solid;border-left:1px solid}
.corner.tr{top:12px;right:12px;border-top:1px solid;border-right:1px solid}
.corner.bl{bottom:12px;left:12px;border-bottom:1px solid;border-left:1px solid}
.corner.br{bottom:12px;right:12px;border-bottom:1px solid;border-right:1px solid}
.viz-label{position:absolute;z-index:3;top:var(--space-5);left:var(--space-6);font-family:var(--font-display);font-size:var(--text-xs);letter-spacing:0.25em;color:var(--color-text-faint);text-transform:uppercase}
.viz-center{position:absolute;inset:0;z-index:2;display:grid;place-items:center}
.viz-glyph{width:clamp(90px,11vw,140px);color:var(--color-gold);opacity:0.9}
.viz-foot{position:absolute;z-index:3;bottom:var(--space-5);left:var(--space-6);right:var(--space-6);display:flex;justify-content:space-between;font-family:var(--font-display);font-size:var(--text-xs);letter-spacing:0.2em;color:var(--color-text-faint);text-transform:uppercase}

/* Real product screenshots (2026-09-14): a slow crossfade of real dashboard/
   chart captures, toned to the page's own navy/gold palette rather than shown
   raw -- a bright orange-terminal or red/green TradingView screenshot dropped
   in at native color would fight the page's own restrained gold accent. The
   filter desaturates + warms toward gold, and the ::after wash on top pulls
   the darks back to the exact navy this page already uses everywhere else,
   so the real product is recognizable but reads as PART of this page, not a
   pasted-in screenshot. Corners/labels stay in their own top layer (z-index:3)
   so the frame is always crisp regardless of what's playing underneath. */
.product-shots{position:absolute;inset:0;z-index:0}
.product-shots img{position:absolute;inset:0;z-index:0;width:100%;height:100%;object-fit:cover;object-position:top center;
  filter:grayscale(0.3) sepia(0.25) saturate(1.3) hue-rotate(-8deg) brightness(0.6) contrast(1.1);opacity:0}
.product-media.has-shots .viz-center{display:none}
.product-media.has-shots::after{content:"";position:absolute;inset:0;z-index:2;pointer-events:none;
  background:linear-gradient(165deg,rgba(9,14,22,0.35) 0%,rgba(11,17,26,0.58) 45%,rgba(7,11,17,0.88) 100%),
             linear-gradient(0deg,rgba(201,161,74,0.10),transparent 42%)}
.product-shots img{animation:shotFade3 13.5s infinite}
.product-shots img:nth-child(1){animation-delay:0s}
.product-shots img:nth-child(2){animation-delay:4.5s}
.product-shots img:nth-child(3){animation-delay:9s}
.product-shots.n2 img{animation:shotFade2 10s infinite}
.product-shots.n2 img:nth-child(1){animation-delay:0s}
.product-shots.n2 img:nth-child(2){animation-delay:5s}
@keyframes shotFade3{0%,4%{opacity:0}9%,26%{opacity:1}31%,100%{opacity:0}}
@keyframes shotFade2{0%,4%{opacity:0}9%,41%{opacity:1}46%,100%{opacity:0}}
@media (prefers-reduced-motion:reduce){.product-shots img{animation:none!important;opacity:0}.product-shots img:first-child{opacity:1}}
.cta-band{position:relative;text-align:center;padding:clamp(var(--space-12),7vw,var(--space-24)) var(--space-6);border:1px solid var(--color-border);border-radius:var(--radius-xl);background:linear-gradient(180deg,var(--color-surface) 0%,var(--color-surface-2) 100%);overflow:hidden}
.cta-band::before{content:"";position:absolute;inset:0;background:radial-gradient(70% 90% at 50% 0%,var(--gold-glow),transparent 60%);opacity:0.5;pointer-events:none}
.cta-band h2{font-size:var(--text-xl)}
.cta-band p{font-family:var(--font-accent);font-style:italic;color:var(--color-text-muted);font-size:var(--text-lg);max-width:46ch;margin:var(--space-5) auto 0}
.cta-band .band-cta{position:relative;display:flex;flex-wrap:wrap;justify-content:center;gap:var(--space-4);margin-top:var(--space-10)}
footer{border-top:1px solid var(--color-divider);background:var(--color-surface);margin-top:var(--space-24)}
.foot{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:var(--space-6);padding-block:var(--space-10)}
.foot-nav{display:flex;gap:var(--space-8)}
.foot-nav a{font-family:var(--font-display);font-size:0.75rem;letter-spacing:0.2em;color:var(--color-text-muted)}
.foot-nav a:hover{color:var(--color-gold-bright)}
.foot-legal{width:100%;display:flex;justify-content:space-between;flex-wrap:wrap;gap:var(--space-3);border-top:1px solid var(--color-divider);padding-top:var(--space-5);font-size:var(--text-xs);color:var(--color-text-faint)}
.foot-legal a{text-decoration:underline;text-underline-offset:2px;text-decoration-color:var(--color-border)}
.foot-legal a:hover{color:var(--color-gold-bright);text-decoration-color:var(--color-gold)}
.reveal{opacity:0;transform:translateY(14px);transition:opacity .8s var(--ease),transform .8s var(--ease)}
.reveal.in{opacity:1;transform:none}
@media (max-width:900px){.nav-links{display:none}.product{grid-template-columns:1fr;gap:var(--space-8)}.product:nth-child(even) .product-media{order:0}}
@media (max-width:700px){.btn{width:100%;justify-content:center}}
/* HERO */
.hero{position:relative;min-height:100svh;display:flex;align-items:flex-end;overflow:hidden}
.hero img.hero-bg{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center 30%}
.hero::before{content:"";position:absolute;inset:0;pointer-events:none;z-index:1;background:linear-gradient(180deg,rgba(7,11,17,0.55) 0%,rgba(7,11,17,0) 20%)}
.hero::after{content:"";position:absolute;left:0;right:0;bottom:0;height:44%;pointer-events:none;z-index:1;background:linear-gradient(180deg,rgba(7,11,17,0) 0%,rgba(7,11,17,0.34) 38%,var(--color-bg) 100%)}
.hero-content{position:relative;z-index:2;width:100%;max-width:var(--content-wide);margin-inline:auto;padding:0 var(--space-6) clamp(var(--space-32),22vh,13rem);text-align:center;display:flex;flex-direction:column;align-items:center}
.hero-emblem{width:clamp(130px,15vw,185px);height:auto;margin-bottom:var(--space-5);filter:drop-shadow(0 14px 34px rgba(7,11,17,0.9))}
.hero-eyebrow{font-family:var(--font-display);font-size:var(--text-xs);letter-spacing:0.42em;color:var(--color-gold);text-transform:uppercase;margin-bottom:var(--space-5);text-shadow:0 2px 18px rgba(7,11,17,0.85)}
.hero-content h1{font-size:var(--text-2xl);text-shadow:0 4px 32px rgba(7,11,17,0.92),0 1px 8px rgba(7,11,17,0.75)}
.hero-sub{font-family:var(--font-accent);font-style:italic;font-size:var(--text-lg);color:var(--color-text-soft);max-width:54ch;margin:var(--space-5) auto 0;line-height:1.55;text-shadow:0 2px 20px rgba(7,11,17,0.9),0 1px 6px rgba(7,11,17,0.8)}
.hero-proof{display:flex;flex-wrap:wrap;justify-content:center;gap:0.65rem;margin-top:var(--space-6);font-family:var(--font-display);font-size:0.68rem;letter-spacing:0.16em;text-transform:uppercase;color:var(--color-text);text-shadow:0 2px 18px rgba(7,11,17,0.9)}
.hero-proof span{border:1px solid rgba(201,161,74,0.34);background:rgba(7,11,17,0.42);backdrop-filter:blur(10px);border-radius:999px;padding:0.45rem 0.72rem}
.sec-head p{font-family:var(--font-accent);font-style:italic;margin:var(--space-5) auto 0;max-width:58ch;color:var(--color-text-muted);font-size:var(--text-lg)}
.hero-cta{display:flex;flex-wrap:wrap;justify-content:center;gap:var(--space-4);margin-top:var(--space-8)}
@media (max-width:700px){.hero{min-height:92svh}.hero img.hero-bg{object-position:center 34%}.hero::after{height:58%}.hero-cta .btn{width:auto;flex:1 1 44%}}

@media (max-width:700px){.nav-inner{padding:0.85rem 1rem;gap:0.75rem}.nav .brand{font-size:0.72rem;letter-spacing:0.18em;min-width:0}.nav .brand img{width:28px;height:28px}.nav .btn{width:auto;flex:0 0 auto;padding:0.72rem 1rem;font-size:0.68rem;letter-spacing:0.1em}.hero-cta .btn{width:auto;flex:1 1 44%}}
@media (max-width:360px){.nav .brand{font-size:0.64rem;letter-spacing:0.14em}.nav .btn{padding:0.68rem 0.8rem;font-size:0.62rem}}


@media (max-width:700px){.hero-proof{gap:0.45rem;font-size:0.56rem;letter-spacing:0.1em}.hero-proof span{padding:0.36rem 0.52rem}.sec-head p{text-align:center}}



/* CMO polish: restore bullet spacing where draft CSS referenced undefined spacing tokens. */
.product-feats li{gap:0.75rem}
.btn,.product-link{gap:0.5rem}

/* LEGAL PAGES (2026-09-14) -- company-level Terms/Privacy/Disclaimers,
   reusing this same page's tokens/fonts so they read as part of the same
   site, not a bolted-on template. */
.legal-nav{position:sticky;top:0;z-index:10;background:rgba(7,11,17,0.92);backdrop-filter:blur(16px);border-bottom:1px solid var(--color-divider)}
.legal-nav .nav-inner{max-width:var(--content-narrow);margin-inline:auto;padding:var(--space-4) var(--space-6);display:flex;align-items:center;justify-content:space-between;gap:var(--space-6)}
.legal-doc{max-width:var(--content-narrow);margin-inline:auto;padding:var(--space-16) var(--space-6) var(--space-24)}
.legal-doc .doc-head{margin-bottom:var(--space-10)}
.legal-doc .eyebrow{font-family:var(--font-display);font-size:var(--text-xs);letter-spacing:0.3em;text-transform:uppercase;color:var(--color-gold)}
.legal-doc h1{font-size:var(--text-xl);margin-top:var(--space-4)}
.legal-doc .meta{font-family:var(--font-body);font-size:var(--text-sm);color:var(--color-text-muted);margin-top:var(--space-4);line-height:1.8}
.legal-doc .scope-note{font-family:var(--font-accent);font-style:italic;color:var(--color-text-soft);font-size:var(--text-lg);margin-top:var(--space-8);line-height:1.6;border-left:2px solid var(--color-border);padding-left:var(--space-6)}
.legal-doc h2{font-size:var(--text-lg);margin-top:var(--space-12);margin-bottom:var(--space-4);padding-top:var(--space-8);border-top:1px solid var(--color-divider)}
.legal-doc h2:first-of-type{border-top:none;padding-top:0}
.legal-doc p{margin-top:var(--space-4);max-width:70ch}
.legal-doc ul{margin-top:var(--space-4);padding-left:var(--space-6);display:flex;flex-direction:column;gap:var(--space-2)}
.legal-doc li{color:var(--color-text-soft)}
.legal-doc strong{color:var(--color-text);font-weight:600}
.legal-doc .product-links{display:flex;flex-wrap:wrap;gap:var(--space-4);margin-top:var(--space-6);list-style:none;padding:0}
.legal-doc .product-links a{font-family:var(--font-display);font-size:0.8rem;letter-spacing:0.14em;color:var(--color-gold-bright);border:1px solid var(--color-border);border-radius:var(--radius-sm);padding:0.6rem 1.1rem;display:inline-flex;align-items:center;gap:0.4rem}
.legal-doc .product-links a:hover{border-color:var(--color-gold)}
.legal-doc .back-link{margin-top:var(--space-16);display:inline-block;font-family:var(--font-display);font-size:0.8rem;letter-spacing:0.16em;color:var(--color-gold-bright)}