  :root{
    --paper:#f6efdf; --paper-2:#fbf6ea; --card:#fffdf7;
    --ink:#1c150c; --ink-dim:#574d3d; --muted:#938876;
    --line:rgba(40,28,10,.13); --line-2:rgba(40,28,10,.22);
    --gold:#bd7714; --gold-bright:#e8a33d; --gold-soft:#f6c453; --peach:#f4b16a; --gold-ink:#8a5a12;
    --serif:"Instrument Serif",Georgia,serif; --sans:"Instrument Sans",system-ui,sans-serif; --mono:"JetBrains Mono",monospace;
    --maxw:1220px;
  }
  *{box-sizing:border-box}
  html,body{margin:0;padding:0}
  body{background:var(--paper);color:var(--ink);font-family:var(--sans);font-size:17px;line-height:1.6;-webkit-font-smoothing:antialiased;overflow-x:hidden}
  a{color:inherit;text-decoration:none}
  .wrap{max-width:var(--maxw);margin:0 auto;padding:0 40px;position:relative;z-index:3}
  .eyebrow{font-family:var(--mono);font-size:12px;letter-spacing:.24em;text-transform:uppercase;color:var(--gold);opacity:.95}
  h2{font-family:var(--serif);font-weight:400;font-size:clamp(38px,5.2vw,74px);line-height:.98;letter-spacing:-.01em;margin:14px 0 0;max-width:15ch}
  .big{font-size:clamp(44px,6.4vw,94px)}

  /* signature: rotating sun rays + warm wash */
  .rays{position:fixed;top:-42vh;right:-18vw;width:120vh;height:120vh;z-index:0;pointer-events:none;opacity:.55;
    background:repeating-conic-gradient(from 0deg at 50% 50%, rgba(232,163,61,.16) 0deg .5deg, transparent .5deg 6deg);
    -webkit-mask:radial-gradient(closest-side, #000 8%, transparent 62%); mask:radial-gradient(closest-side,#000 8%,transparent 62%);
    animation:turn 140s linear infinite}
  @keyframes turn{to{transform:rotate(360deg)}}
  body::before{content:"";position:fixed;inset:0;z-index:0;pointer-events:none;
    background:radial-gradient(90% 55% at 82% -6%,rgba(246,196,83,.42),rgba(244,177,106,.14) 32%,rgba(246,239,223,0) 58%)}
  body::after{content:"";position:fixed;inset:0;z-index:1;pointer-events:none;opacity:.045;mix-blend-mode:multiply;
    background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='140' height='140'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.8' numOctaves='3'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E")}

  nav{position:fixed;top:0;left:0;right:0;z-index:40;transition:background .3s,border-color .3s;border-bottom:1px solid transparent}
  nav.scrolled{background:rgba(246,239,223,.8);backdrop-filter:blur(12px);border-bottom:1px solid var(--line)}
  .nav-in{max-width:var(--maxw);margin:0 auto;padding:18px 40px;display:flex;align-items:center;justify-content:space-between}
  .brand{display:flex;align-items:center;gap:11px;font-family:var(--serif);font-weight:400;font-size:26px}
  .brand svg{width:27px;height:27px}

  .btn{display:inline-flex;align-items:center;gap:.5rem;padding:.85rem 1.55rem;border-radius:100px;font-family:var(--sans);font-weight:600;font-size:15px;transition:transform .18s,box-shadow .18s,border-color .18s,background .18s;cursor:pointer;border:0;white-space:nowrap}
  .btn-primary{background:var(--ink);color:var(--paper);box-shadow:0 10px 30px rgba(28,21,12,.18)}
  .btn-primary:hover{transform:translateY(-2px);box-shadow:0 18px 44px rgba(28,21,12,.26)}
  .btn-glow{background:linear-gradient(100deg,var(--gold-soft),var(--peach));color:#3a2408;box-shadow:0 12px 34px rgba(232,163,61,.34)}
  .btn-glow:hover{transform:translateY(-2px);box-shadow:0 18px 48px rgba(232,163,61,.46)}
  .btn-ghost{color:var(--ink);border:1px solid var(--line-2);background:transparent}
  .btn-ghost:hover{border-color:var(--ink);background:rgba(28,21,12,.03)}
  .nav-in .btn{padding:.6rem 1.25rem;font-size:14px}

  .pill{display:inline-flex;align-items:center;gap:8px;font-family:var(--mono);font-size:12px;letter-spacing:.02em;color:var(--gold-ink);background:var(--card);border:1px solid var(--line-2);padding:7px 14px;border-radius:100px;box-shadow:0 4px 14px rgba(60,42,15,.06)}
  .pill .s{width:7px;height:7px;border-radius:50%;background:var(--gold-bright);box-shadow:0 0 9px var(--gold-bright)}

  .hero{position:relative;min-height:100svh;display:grid;grid-template-columns:1.06fr .94fr;align-items:center;gap:54px;padding:150px 0 40px}
  #sun{position:absolute;right:-6%;top:-2%;width:min(720px,54vw);height:min(720px,54vw);z-index:0;pointer-events:none}
  .hero-l{position:relative;z-index:3;max-width:660px}
  .hero h1{font-family:var(--serif);font-weight:400;font-size:clamp(58px,8vw,124px);line-height:.9;letter-spacing:-.02em;margin:24px 0 0}
  .hero h1 .it{font-style:italic}
  .hero h1 .mark{position:relative;white-space:nowrap}
  .hero h1 .mark::after{content:"";position:absolute;left:-.04em;right:-.04em;bottom:.08em;height:.30em;z-index:-1;border-radius:8px;background:linear-gradient(100deg,rgba(246,196,83,.85),rgba(244,177,106,.6));transform:rotate(-.8deg)}
  .hero .sub{color:var(--ink-dim);font-size:clamp(18px,1.4vw,21px);max-width:500px;margin:32px 0 0;line-height:1.55}
  .hero .cta-row{display:flex;gap:13px;flex-wrap:wrap;margin-top:38px}
  .hero .assur{margin-top:24px;font-family:var(--mono);font-size:12px;color:var(--muted);letter-spacing:.02em;display:flex;align-items:center;gap:9px}
  .hero .assur .d{width:7px;height:7px;border-radius:50%;background:var(--gold-bright);box-shadow:0 0 10px var(--gold-bright)}
  .hero-r{position:relative;z-index:3}

  /* console inside a warm gradient showcase */
  .showcase{position:relative;padding:30px;border-radius:28px;background:
    radial-gradient(120% 120% at 20% 0%,rgba(246,196,83,.5),rgba(244,177,106,.28) 46%,rgba(255,253,247,.6) 100%);
    box-shadow:0 30px 90px rgba(150,95,20,.2),inset 0 1px 0 rgba(255,255,255,.5);border:1px solid rgba(255,255,255,.5)}
  .console{background:var(--card);border:1px solid var(--line);border-radius:16px;box-shadow:0 20px 50px rgba(60,42,15,.16);padding:16px;font-family:var(--mono);font-size:13.5px}
  .console .top{display:flex;align-items:center;gap:9px;padding:4px 6px 13px;border-bottom:1px solid var(--line);margin-bottom:9px}
  .console .top .dot{width:9px;height:9px;border-radius:50%;background:var(--gold-bright);box-shadow:0 0 9px var(--gold-bright);animation:pulse 2s infinite}
  @keyframes pulse{0%,100%{opacity:1}50%{opacity:.35}}
  .console .top b{font-family:var(--serif);font-size:18px;font-weight:400}
  .console .top .job{color:var(--muted);margin-left:auto;font-size:12px}
  .task{display:flex;align-items:center;gap:11px;padding:10px;border-radius:10px;margin:2px 0;color:var(--ink-dim)}
  .task .ic{width:19px;height:19px;flex:0 0 auto;display:grid;place-items:center;border-radius:50%;font-size:11px;font-weight:700}
  .task.done{color:var(--muted)}.task.done .ic{background:rgba(58,160,96,.14);color:#3a9a5c}
  .task.wait{background:linear-gradient(90deg,rgba(246,196,83,.22),rgba(246,196,83,.05));border:1px solid var(--line-2)}
  .task.wait .ic{background:rgba(232,163,61,.22);color:var(--gold);border:1px solid var(--line-2)}
  .task.wait b{color:var(--ink);font-weight:500}
  .task .meta{margin-left:auto;font-size:11.5px;color:var(--muted)}
  .task.wait .approve{margin-left:auto;background:var(--ink);color:var(--paper);border:0;padding:6px 15px;border-radius:9px;font-family:var(--mono);font-weight:600;font-size:12px;cursor:pointer}
  .task.pend{opacity:.5}.task.pend .ic{border:1px solid var(--line-2);color:var(--muted)}
  .console .foot{margin-top:9px;padding:10px 8px 3px;border-top:1px solid var(--line);color:var(--muted);font-size:11.5px;display:flex;gap:8px;align-items:center}
  .console .foot .live{color:var(--gold)}
  @media(max-width:940px){.hero{grid-template-columns:1fr;gap:40px;min-height:auto;padding:122px 0 30px}#sun{right:-26%;top:-8%;opacity:.8}}

  /* marquee */
  .marq{border-top:1px solid var(--line);border-bottom:1px solid var(--line);padding:20px 0;overflow:hidden;position:relative;z-index:3;background:rgba(255,253,247,.35)}
  .marq-t{display:flex;gap:0;white-space:nowrap;width:max-content;animation:slide 34s linear infinite;font-family:var(--serif);font-size:30px;color:var(--ink);align-items:center}
  .marq-t .it{font-style:italic;color:var(--gold-ink)}
  .marq-t span{padding:0 34px;display:inline-flex;align-items:center;gap:34px}
  .marq-t .dot{width:6px;height:6px;border-radius:50%;background:var(--gold-bright)}
  @keyframes slide{to{transform:translateX(-50%)}}

  section{padding:120px 0;position:relative;z-index:3}
  .rule{height:1px;background:var(--line);max-width:var(--maxw);margin:0 auto}
  .body{color:var(--ink-dim);font-size:20px;line-height:1.62;max-width:54ch;margin-top:22px}
  .body .em{color:var(--ink);font-weight:500}
  .split{display:grid;grid-template-columns:.66fr 1.34fr;gap:64px;align-items:start}
  .sticky-label{position:sticky;top:130px}
  @media(max-width:880px){.split{grid-template-columns:1fr;gap:20px}}

  .triad{display:grid;grid-template-columns:repeat(3,1fr);gap:24px;margin-top:60px}
  .tcard{border-top:1.5px solid var(--ink);padding:26px 4px 0}
  .tcard:nth-child(2){transform:translateY(38px)}.tcard:nth-child(3){transform:translateY(76px)}
  .tcard .n{font-family:var(--mono);font-size:12px;color:var(--gold);letter-spacing:.12em}
  .tcard h3{font-family:var(--serif);font-weight:400;font-size:30px;margin:14px 0 10px}
  .tcard p{color:var(--ink-dim);font-size:15.5px;line-height:1.55;margin:0}
  @media(max-width:880px){.triad{grid-template-columns:1fr;gap:18px}.tcard:nth-child(2),.tcard:nth-child(3){transform:none}}

  .orbit-sec{text-align:center}
  .orbit{position:relative;width:min(560px,84vw);height:min(560px,84vw);margin:60px auto 0}
  .orbit .ring{position:absolute;inset:0;border:1px solid var(--line);border-radius:50%}.orbit .ring.r2{inset:16%}.orbit .ring.r3{inset:33%}
  .orbit .core{position:absolute;left:50%;top:50%;width:104px;height:104px;transform:translate(-50%,-50%);border-radius:50%;
    background:radial-gradient(circle at 40% 36%,var(--gold-soft),var(--gold-bright));box-shadow:0 0 60px rgba(232,163,61,.6),0 0 130px rgba(232,163,61,.3);
    display:grid;place-items:center;font-family:var(--serif);font-weight:400;color:#3a2408;font-size:19px}
  .orbit .planet{position:absolute;left:50%;top:50%;width:var(--pw,150px);height:var(--pw,150px);transform:translate(-50%,-50%);border-radius:50%;animation:spin var(--sp,22s) linear infinite}
  .orbit .planet span{position:absolute;top:-11px;left:50%;font-family:var(--mono);font-size:11.5px;color:var(--ink);background:var(--card);border:1px solid var(--line-2);padding:6px 13px;border-radius:100px;white-space:nowrap;box-shadow:0 6px 16px rgba(60,42,15,.09);animation:antispin var(--sp,22s) linear infinite}
  @keyframes spin{to{transform:translate(-50%,-50%) rotate(360deg)}}@keyframes antispin{to{transform:translateX(-50%) rotate(-360deg)}}

  .proof{border:1px solid rgba(255,255,255,.5);border-radius:28px;padding:64px 58px;position:relative;overflow:hidden;
    background:radial-gradient(120% 130% at 85% 0%,rgba(246,196,83,.42),rgba(244,177,106,.2) 42%,rgba(251,246,234,.7) 100%);box-shadow:0 24px 70px rgba(150,95,20,.14)}
  .proof .q{font-family:var(--serif);font-size:clamp(28px,3.4vw,46px);line-height:1.24;letter-spacing:-.01em;position:relative;z-index:2;max-width:22ch;font-weight:400}
  .proof .q .hl{font-style:italic;color:var(--gold-ink)}
  .proof .attr{margin-top:28px;font-family:var(--mono);font-size:13px;color:var(--muted);position:relative;z-index:2}

  .soul{text-align:center;padding:180px 0}
  .soul h2{font-size:clamp(44px,6.6vw,96px);margin:0 auto;max-width:18ch;line-height:.96}
  .soul .stamp{font-family:var(--serif);font-style:italic;font-size:clamp(24px,3vw,34px);color:var(--gold-ink);margin-top:30px}

  footer{border-top:1px solid var(--line);padding:48px 0 66px;position:relative;z-index:3}
  .foot-in{max-width:var(--maxw);margin:0 auto;padding:0 40px;display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:16px}
  .foot-b{display:flex;align-items:center;gap:10px;font-family:var(--serif);font-weight:400;font-size:22px}
  .foot-b svg{width:23px;height:23px}
  .foot-m{font-family:var(--mono);font-size:12px;color:var(--muted)}

  .anim{opacity:0;transform:translateY(30px)}
  @media(prefers-reduced-motion:reduce){.anim{opacity:1;transform:none}.rays,.marq-t{animation:none}}

/* nav extras + sub-pages */
.nav-r{display:flex;align-items:center;gap:22px}
.navlink{font-size:14.5px;font-weight:500;color:var(--ink-dim);transition:color .18s}
.navlink:hover{color:var(--ink)}
nav.solid{background:rgba(246,239,223,.82);backdrop-filter:blur(12px);border-bottom:1px solid var(--line)}
.doc{max-width:920px;margin:0 auto;padding:150px 40px 30px;position:relative;z-index:3}
.doc-head h1{font-family:var(--serif);font-weight:400;font-size:clamp(50px,7vw,92px);line-height:.93;letter-spacing:-.02em;margin:18px 0 0}
.doc-head .sub{color:var(--ink-dim);font-size:19px;line-height:1.6;max-width:52ch;margin:26px 0 0}
.vsec{padding:54px 0;border-bottom:1px solid var(--line)}
.vsec:last-of-type{border-bottom:0}
.vsec .n{font-family:var(--mono);font-size:12px;letter-spacing:.2em;color:var(--gold)}
.vsec h3{font-family:var(--serif);font-weight:400;font-size:clamp(30px,3.6vw,42px);line-height:1.02;margin:12px 0 4px;letter-spacing:-.01em}
.vsec p{color:var(--ink-dim);font-size:16.5px;line-height:1.64;max-width:66ch;margin:14px 0 0}
.vsec p b,.vlist li b{color:var(--ink);font-weight:600}
.vlist{list-style:none;margin:16px 0 0;padding:0}
.vlist li{position:relative;padding:9px 0 9px 26px;color:var(--ink-dim);font-size:16px;line-height:1.58;max-width:66ch}
.vlist li::before{content:"";position:absolute;left:2px;top:1.02em;width:7px;height:7px;border-radius:50%;background:var(--gold-bright)}
.pull{border-left:2px solid var(--gold-bright);padding:4px 0 4px 22px;margin:24px 0 0;font-family:var(--serif);font-style:italic;font-size:clamp(21px,2.6vw,28px);line-height:1.32;color:var(--ink);max-width:32ch}
.stamp-line{font-family:var(--serif);font-style:italic;font-size:clamp(22px,2.8vw,30px);color:var(--gold-ink);margin-top:22px}
@media(max-width:720px){.doc{padding:130px 24px 20px}}
