/* ══════════════════════════════════════════════════════════════
   RECONCILER AI — "CONTINUUM II"  ·  refined & decent
   Dark, premium, restrained. Per-section background zones,
   in-content slide animation, single cool accent.
══════════════════════════════════════════════════════════════ */
:root{
  /* deeper, calmer ink — slightly warmer black, less blue-cold */
  --bg:#070810; --bg-1:#0B0D15; --bg-2:#0F121C; --bg-3:#151926;
  --line:rgba(255,255,255,0.055); --line-2:rgba(255,255,255,0.03); --line-hi:rgba(255,255,255,0.11);
  --ink:#ECEDF1; --ink-2:#9498A6; --ink-3:#595D6C; --ink-4:#31343F;
  /* accent: a more refined periwinkle, slightly desaturated for "decent" */
  --acc:#8591F2; --acc-soft:#AAB2F7; --acc-deep:#6573E8;
  --acc-wash:rgba(133,145,242,0.09); --acc-line:rgba(133,145,242,0.22);
  --pos:#62C9A0; --warn:#DBAE73; --neg:#DE8088;
  --serif:'Fraunces',Georgia,serif;
  --sans:'Geist','Inter',system-ui,sans-serif;
  --mono:'Geist Mono','JetBrains Mono',monospace;
  --r:14px; --r-lg:20px; --r-xl:28px;
  --ease:cubic-bezier(0.16,1,0.3,1);
  --nav:72px; --max:1180px; --gutter:6vw;
}
*,*::before,*::after{margin:0;padding:0;box-sizing:border-box;}
html{-webkit-text-size-adjust:100%;}
.lenis.lenis-smooth{scroll-behavior:auto!important;}.lenis.lenis-stopped{overflow:hidden;}
body{font-family:var(--sans);background:var(--bg);color:var(--ink);line-height:1.55;overflow-x:hidden;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;letter-spacing:-0.011em;cursor:none;}
a{color:inherit;text-decoration:none;}
button{font:inherit;color:inherit;border:none;background:none;cursor:none;}
img,svg,canvas{display:block;max-width:100%;}
input,select,textarea{font:inherit;}
::selection{background:rgba(133,145,242,0.26);color:#fff;}
::-webkit-scrollbar{width:8px;}::-webkit-scrollbar-track{background:var(--bg);}::-webkit-scrollbar-thumb{background:#191D2A;border-radius:8px;}
.wrap{width:88%;max-width:var(--max);margin-inline:auto;}

/* ── PER-SECTION BACKGROUND ZONES ──────────────────────────
   Each section carries its own tinted, layered background that
   transitions as the user flows down the page. No single flat field. */
section{position:relative;isolation:isolate;}
.zone{position:relative;overflow:hidden;}
.zone::before{content:'';position:absolute;inset:0;z-index:-2;pointer-events:none;transition:opacity 1s var(--ease);}
.zone::after{content:'';position:absolute;inset:0;z-index:-1;pointer-events:none;opacity:0.5;}
/* zone variants: each a distinct, content-matched gradient mood */
.zone-hero::before{background:
  radial-gradient(900px 600px at 78% 8%,rgba(133,145,242,0.16),transparent 60%),
  radial-gradient(700px 500px at 12% 70%,rgba(101,115,232,0.08),transparent 60%),
  linear-gradient(180deg,#070810,#080A14);}
.zone-capability::before{background:
  radial-gradient(800px 500px at 20% 0%,rgba(133,145,242,0.08),transparent 55%),
  linear-gradient(180deg,#080A14,#0A0C16);}
.zone-console::before{background:
  radial-gradient(1000px 600px at 50% 30%,rgba(101,115,232,0.1),transparent 60%),
  linear-gradient(180deg,#0A0C16,#090B13);}
.zone-how::before{background:
  radial-gradient(700px 500px at 85% 20%,rgba(98,201,160,0.05),transparent 55%),
  radial-gradient(700px 500px at 10% 80%,rgba(133,145,242,0.07),transparent 55%),
  linear-gradient(180deg,#090B13,#0B0D16);}
.zone-compliance::before{background:
  radial-gradient(820px 620px at 25% 40%,rgba(133,145,242,0.1),transparent 58%),
  linear-gradient(180deg,#0B0D16,#080A12);}
.zone-why::before{background:
  radial-gradient(760px 520px at 75% 25%,rgba(101,115,232,0.08),transparent 56%),
  linear-gradient(180deg,#080A12,#0A0C15);}
.zone-trust::before{background:linear-gradient(180deg,#0A0C15,#080912);}
.zone-voice::before{background:
  radial-gradient(900px 500px at 50% 0%,rgba(133,145,242,0.07),transparent 55%),
  linear-gradient(180deg,#080912,#0A0C16);}
.zone-cta::before{background:
  radial-gradient(700px 460px at 50% 60%,rgba(133,145,242,0.14),transparent 60%),
  linear-gradient(180deg,#0A0C16,#070810);}
/* faint hairline grid texture overlay, drifts subtly per zone */
.zone-hero::after,.zone-console::after,.zone-compliance::after{
  background-image:linear-gradient(rgba(255,255,255,0.018) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,0.018) 1px,transparent 1px);
  background-size:60px 60px;
  -webkit-mask:radial-gradient(ellipse 70% 60% at 50% 40%,#000,transparent 75%);
  mask:radial-gradient(ellipse 70% 60% at 50% 40%,#000,transparent 75%);}

#grain{position:fixed;inset:0;z-index:9000;pointer-events:none;opacity:0.035;mix-blend-mode:overlay;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='180' height='180'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.8' numOctaves='4'/%3E%3C/filter%3E%3Crect width='180' height='180' filter='url(%23n)'/%3E%3C/svg%3E");}

/* cursor */
#cur{position:fixed;top:0;left:0;width:7px;height:7px;border-radius:50%;background:var(--acc);z-index:99999;pointer-events:none;transform:translate(-50%,-50%);transition:width .25s,height .25s,opacity .25s;}
#curR{position:fixed;top:0;left:0;width:36px;height:36px;border:1px solid rgba(133,145,242,0.4);border-radius:50%;z-index:99998;pointer-events:none;transform:translate(-50%,-50%);transition:width .3s var(--ease),height .3s var(--ease),border-color .3s,opacity .3s;}
#curR.hov{width:64px;height:64px;border-color:var(--acc);background:rgba(133,145,242,0.04);}
#cur.hov{width:4px;height:4px;}
@media(pointer:coarse){#cur,#curR{display:none;}body,a,button{cursor:auto;}}

/* preloader */
#pre{position:fixed;inset:0;z-index:100000;background:var(--bg);display:flex;align-items:center;justify-content:center;flex-direction:column;gap:24px;}
#pre .pm{font-family:var(--serif);font-size:clamp(2rem,6vw,3rem);font-weight:340;font-style:italic;color:var(--ink);overflow:hidden;}
#pre .pm span{display:inline-block;transform:translateY(110%);animation:pmin .8s var(--ease) .15s forwards;}
#pre .pl{width:0;height:1px;background:var(--ink-3);animation:plw 1s var(--ease) .4s forwards;}
@keyframes pmin{to{transform:none;}}@keyframes plw{to{width:120px;}}
#pre.done{clip-path:inset(0 0 100% 0);transition:clip-path .9s var(--ease);pointer-events:none;}

/* type */
.kicker{display:inline-flex;align-items:center;gap:10px;font-family:var(--mono);font-size:11px;font-weight:500;letter-spacing:0.22em;text-transform:uppercase;color:var(--ink-3);}
.kicker::before{content:'';width:18px;height:1px;background:var(--acc);}
.kicker.c{justify-content:center;}
.h2{font-family:var(--serif);font-weight:340;font-size:clamp(2.1rem,4.6vw,3.4rem);letter-spacing:-0.025em;line-height:1.06;}
.h2 em{font-style:italic;color:var(--acc-soft);}
.lead{font-size:clamp(1rem,1.4vw,1.1rem);color:var(--ink-2);line-height:1.7;font-weight:330;}
.muted{color:var(--ink-3);}

/* buttons */
.btn{position:relative;display:inline-flex;align-items:center;gap:9px;font-family:var(--sans);font-weight:500;font-size:0.94rem;padding:13px 24px;border-radius:99px;overflow:hidden;letter-spacing:-0.01em;white-space:nowrap;transition:transform .4s var(--ease),background .3s,color .3s,border-color .3s,box-shadow .3s;will-change:transform;}
.btn svg{transition:transform .4s var(--ease);}
.btn-fill{background:var(--ink);color:var(--bg);}
.btn-fill:hover{box-shadow:0 12px 40px -12px rgba(255,255,255,0.28);}.btn-fill:hover svg{transform:translateX(4px);}
.btn-line{border:1px solid var(--line-hi);color:var(--ink);}
.btn-line:hover{border-color:var(--ink-2);background:rgba(255,255,255,0.03);}
.btn-acc{background:var(--acc);color:#0A0B12;}
.btn-acc:hover{background:var(--acc-soft);box-shadow:0 14px 44px -14px rgba(133,145,242,0.55);}.btn-acc:hover svg{transform:translateX(4px);}
.btn-lg{padding:16px 30px;font-size:1rem;}.btn-sm{padding:9px 17px;font-size:0.85rem;}
.btn-ghost{color:var(--ink-2);padding:9px 14px;}.btn-ghost:hover{color:var(--ink);}

.chip{display:inline-flex;align-items:center;gap:7px;padding:6px 13px;border-radius:99px;font-family:var(--mono);font-size:11px;letter-spacing:0.04em;color:var(--ink-2);border:1px solid var(--line);background:rgba(255,255,255,0.015);backdrop-filter:blur(6px);}
.chip .d{width:5px;height:5px;border-radius:50%;background:var(--acc);box-shadow:0 0 8px var(--acc);}

/* nav */
.nav{position:fixed;top:0;left:0;right:0;z-index:1000;height:var(--nav);display:flex;align-items:center;transition:background .5s,border-color .5s;border-bottom:1px solid transparent;}
.nav.scr{background:rgba(7,8,16,0.7);backdrop-filter:blur(24px) saturate(150%);-webkit-backdrop-filter:blur(24px) saturate(150%);border-bottom:1px solid var(--line);}
.nav-in{display:flex;align-items:center;justify-content:space-between;width:88%;max-width:var(--max);margin-inline:auto;}
.brand{display:flex;align-items:center;gap:11px;font-weight:600;font-size:1.05rem;letter-spacing:-0.02em;}
.brand .mk{width:30px;height:30px;border-radius:8px;border:1px solid var(--line-hi);display:flex;align-items:center;justify-content:center;font-family:var(--serif);font-style:italic;font-size:1.05rem;color:var(--acc-soft);background:var(--bg-2);transition:.4s var(--ease);}
.brand:hover .mk{border-color:var(--acc-line);transform:rotate(-6deg);}
.brand .ai{color:var(--ink-3);font-weight:400;}
.nav-links{display:flex;gap:4px;}
.nav-links a{font-size:0.9rem;color:var(--ink-2);padding:8px 14px;border-radius:8px;transition:color .25s,background .25s;}
.nav-links a:hover,.nav-links a.act{color:var(--ink);}
.nav-r{display:flex;align-items:center;gap:8px;}
.burger{display:none;flex-direction:column;gap:5px;padding:8px;}
.burger span{width:22px;height:1.5px;background:var(--ink);transition:.3s;border-radius:2px;}
.burger.open span:nth-child(1){transform:translateY(6.5px) rotate(45deg);}
.burger.open span:nth-child(2){opacity:0;}
.burger.open span:nth-child(3){transform:translateY(-6.5px) rotate(-45deg);}
.mnav{position:fixed;inset:var(--nav) 0 auto 0;z-index:999;background:rgba(7,8,16,0.97);backdrop-filter:blur(22px);border-bottom:1px solid var(--line);padding:18px var(--gutter) 26px;display:flex;flex-direction:column;gap:4px;transform:translateY(-10px);opacity:0;pointer-events:none;transition:.35s var(--ease);}
.mnav.open{transform:none;opacity:1;pointer-events:auto;}
.mnav a{font-size:1.05rem;color:var(--ink-2);padding:13px 8px;border-radius:9px;}

/* ── IN-CONTENT SLIDE REVEALS ──
   richer than a plain fade: content slides from a direction with a
   soft blur-in, children stagger. */
.rv{opacity:0;transform:translateY(34px);filter:blur(6px);transition:opacity .9s var(--ease),transform .9s var(--ease),filter .9s var(--ease);}
.rv.in{opacity:1;transform:none;filter:none;}
.rv-l{opacity:0;transform:translateX(-44px);filter:blur(5px);transition:opacity 1s var(--ease),transform 1s var(--ease),filter 1s var(--ease);}
.rv-l.in{opacity:1;transform:none;filter:none;}
.rv-r{opacity:0;transform:translateX(44px);filter:blur(5px);transition:opacity 1s var(--ease),transform 1s var(--ease),filter 1s var(--ease);}
.rv-r.in{opacity:1;transform:none;filter:none;}
.rv-sc{opacity:0;transform:scale(0.94);filter:blur(5px);transition:opacity 1s var(--ease),transform 1s var(--ease),filter 1s var(--ease);}
.rv-sc.in{opacity:1;transform:none;filter:none;}
.d1{transition-delay:.08s;}.d2{transition-delay:.16s;}.d3{transition-delay:.24s;}.d4{transition-delay:.32s;}.d5{transition-delay:.4s;}
/* stagger container: children animate in sequence */
.stag>*{opacity:0;transform:translateY(26px);filter:blur(5px);transition:opacity .8s var(--ease),transform .8s var(--ease),filter .8s var(--ease);}
.stag.in>*{opacity:1;transform:none;filter:none;}
.stag.in>*:nth-child(1){transition-delay:.05s;}
.stag.in>*:nth-child(2){transition-delay:.13s;}
.stag.in>*:nth-child(3){transition-delay:.21s;}
.stag.in>*:nth-child(4){transition-delay:.29s;}
.stag.in>*:nth-child(5){transition-delay:.37s;}
.stag.in>*:nth-child(6){transition-delay:.45s;}
.kin .w{display:inline-block;overflow:hidden;vertical-align:top;}
.kin .w>span{display:inline-block;transform:translateY(110%);transition:transform .9s var(--ease);}
.kin.go .w>span{transform:none;}

.sec{padding:140px 0;}.sec-sm{padding:96px 0;}
.hr{height:1px;background:var(--line);max-width:var(--max);width:88%;margin-inline:auto;}
.sec-head{max-width:680px;margin-bottom:68px;}
.sec-head.c{margin-inline:auto;text-align:center;}
.sec-head .kicker{margin-bottom:22px;}.sec-head .lead{margin-top:20px;}

@media(max-width:920px){:root{--gutter:7vw;}.nav-links,.nav-r .btn:not(.burger){display:none;}.burger{display:flex;}.sec{padding:96px 0;}.sec-head{margin-bottom:48px;}}
@media(prefers-reduced-motion:reduce){*{animation-duration:.001s!important;transition-duration:.001s!important;}.rv,.rv-l,.rv-r,.rv-sc,.stag>*{opacity:1!important;transform:none!important;filter:none!important;}.kin .w>span{transform:none!important;}#pre{display:none!important;}}
