:root{
    --cream:#FBF6EC;
    --cream-deep:#F3EAD9;
    --paper:#FFFDF7;
    --pine:#1E3A31;
    --pine-2:#2C5346;
    --moss:#4C7A66;
    --amber:#E0A153;
    --amber-deep:#C9853A;
    --clay:#C2643F;
    --ink:#241F19;
    --ink-soft:#5A5046;
    --line:#E6DAC6;
    --shadow:28px 28px 60px rgba(30,58,49,.10), 0 2px 4px rgba(30,58,49,.04);
    --shadow-sm:0 1px 2px rgba(30,58,49,.05), 0 8px 24px rgba(30,58,49,.07);
    --r:22px;
    --maxw:1200px;
    --emblem:url("assets/emblem.png");
  }
  *{box-sizing:border-box;margin:0;padding:0}
  html{scroll-behavior:smooth}
  body{
    font-family:"Hanken Grotesk",system-ui,sans-serif;
    background:var(--cream);
    color:var(--ink);
    line-height:1.6;
    -webkit-font-smoothing:antialiased;
    overflow-x:hidden;
  }
  /* warm grain overlay */
  body::before{
    content:"";position:fixed;inset:0;z-index:9999;pointer-events:none;opacity:.035;
    background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.85' numOctaves='3'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
  }
  h1,h2,h3,h4{font-family:"Fraunces",Georgia,serif;font-weight:600;line-height:1.08;letter-spacing:-.01em;color:var(--pine)}
  a{color:inherit;text-decoration:none}
  .wrap{max-width:var(--maxw);margin:0 auto;padding:0 28px}
  .eyebrow{
    font-family:"Hanken Grotesk";font-weight:700;font-size:.74rem;letter-spacing:.16em;
    text-transform:uppercase;color:var(--amber-deep);display:inline-flex;align-items:center;gap:.55rem;
  }
  .eyebrow::before{content:"";width:22px;height:2px;background:var(--amber);border-radius:2px}

  /* ---------- NAV ---------- */
  header.nav{
    position:sticky;top:0;z-index:100;
    background:rgba(251,246,236,.82);backdrop-filter:blur(14px);
    border-bottom:1px solid var(--line);
  }
  .nav-inner{display:flex;align-items:center;justify-content:space-between;height:74px}
  .brand{display:flex;align-items:center;gap:12px}
  .brand .mark{width:38px;height:38px;flex:0 0 auto}
  .brand .name{font-family:"Fraunces";font-weight:600;font-size:1.32rem;color:var(--pine);letter-spacing:-.01em}
  .brand .name b{color:var(--amber-deep);font-weight:600}
  .powered{font-size:.66rem;letter-spacing:.12em;text-transform:uppercase;color:var(--ink-soft);font-weight:600;margin-top:1px}
  .navlinks{display:flex;align-items:center;gap:34px}
  .navlinks a{font-weight:500;font-size:.95rem;color:var(--ink);position:relative;padding:4px 0}
  .navlinks a::after{content:"";position:absolute;left:0;bottom:-2px;width:0;height:2px;background:var(--amber);transition:width .25s ease}
  .navlinks a:hover::after{width:100%}
  .btn{
    display:inline-flex;align-items:center;gap:.5rem;font-weight:600;font-size:.95rem;
    padding:.72rem 1.35rem;border-radius:100px;cursor:pointer;border:none;transition:transform .2s ease,box-shadow .2s ease,background .2s ease;
  }
  .btn-primary{background:var(--pine);color:var(--cream)}
  .btn-primary:hover{background:var(--pine-2);transform:translateY(-2px);box-shadow:0 10px 26px rgba(30,58,49,.22)}
  .btn-ghost{background:transparent;color:var(--pine);border:1.5px solid var(--pine)}
  .btn-ghost:hover{background:var(--pine);color:var(--cream);transform:translateY(-2px)}
  .btn-amber{background:var(--amber);color:var(--pine)}
  .btn-amber:hover{background:var(--amber-deep);transform:translateY(-2px);box-shadow:0 10px 26px rgba(201,133,58,.3)}
  .nav-cta{display:flex;align-items:center;gap:14px}
  .burger{display:none;background:none;border:none;cursor:pointer;flex-direction:column;gap:5px;padding:8px}
  .burger span{width:24px;height:2px;background:var(--pine);border-radius:2px;transition:.3s}

  /* ---------- HERO ---------- */
  .hero{position:relative;padding:84px 0 96px;overflow:hidden}
  .hero::before{
    content:"";position:absolute;top:-180px;right:-160px;width:620px;height:620px;border-radius:50%;
    background:radial-gradient(circle at center, rgba(224,161,83,.30), rgba(224,161,83,0) 68%);z-index:0;
  }
  .hero::after{
    content:"";position:absolute;bottom:-220px;left:-180px;width:560px;height:560px;border-radius:50%;
    background:radial-gradient(circle at center, rgba(76,122,102,.22), rgba(76,122,102,0) 70%);z-index:0;
  }
  .hero-grid{position:relative;z-index:1;display:grid;grid-template-columns:1.1fr .9fr;gap:56px;align-items:center}
  .hero h1{font-size:clamp(2.5rem,5.2vw,4.4rem);margin:22px 0 0}
  .hero h1 em{font-style:italic;color:var(--clay)}
  .hero .lede{font-size:1.2rem;color:var(--ink-soft);max-width:34ch;margin:24px 0 32px}
  .hero-cta{display:flex;gap:14px;flex-wrap:wrap}
  .trust-row{display:flex;gap:26px;margin-top:38px;flex-wrap:wrap}
  .trust-row div{display:flex;flex-direction:column}
  .trust-row .num{font-family:"Fraunces";font-size:1.7rem;font-weight:600;color:var(--pine)}
  .trust-row .lab{font-size:.82rem;color:var(--ink-soft);font-weight:500}

  /* hero visual card */
  .hero-vis{position:relative}
  .vis-card{
    background:var(--paper);border:1px solid var(--line);border-radius:var(--r);padding:30px;
    box-shadow:var(--shadow);position:relative;
  }
  .vis-card .falcon{width:100%;height:auto;display:block;margin-bottom:18px}

  /* ---------- MARQUEE / pedigree ---------- */
  .pedigree{border-top:1px solid var(--line);border-bottom:1px solid var(--line);background:var(--cream-deep);padding:22px 0}
  .pedigree .wrap{display:flex;align-items:center;gap:30px;flex-wrap:wrap;justify-content:center;text-align:center}
  .pedigree p{font-size:.95rem;color:var(--ink-soft);font-weight:500}
  .pedigree b{color:var(--pine);font-weight:700}

  /* ---------- SECTION SHELL ---------- */
  section{padding:96px 0}
  .sec-head{max-width:62ch;margin-bottom:54px}
  .sec-head h2{font-size:clamp(2rem,3.6vw,2.9rem);margin:16px 0 14px}
  .sec-head p{font-size:1.1rem;color:var(--ink-soft)}

  /* ---------- VALUE PROPS ---------- */
  .why{background:var(--paper);border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
  .why-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:26px}
  .vcard{
    background:var(--cream);border:1px solid var(--line);border-radius:var(--r);padding:30px 28px;
    transition:transform .3s ease,box-shadow .3s ease;
  }
  .vcard:hover{transform:translateY(-6px);box-shadow:var(--shadow)}
  .vcard .ic{width:50px;height:50px;border-radius:14px;background:rgba(76,122,102,.12);display:flex;align-items:center;justify-content:center;margin-bottom:18px}
  .vcard h3{font-size:1.28rem;margin-bottom:8px}
  .vcard p{color:var(--ink-soft);font-size:.98rem}

  /* ---------- PRODUCTS ---------- */
  .group-label{font-family:"Hanken Grotesk";font-weight:700;font-size:.78rem;letter-spacing:.14em;text-transform:uppercase;color:var(--moss);margin:0 0 22px;display:flex;align-items:center;gap:12px}
  .group-label::after{content:"";flex:1;height:1px;background:var(--line)}
  .prod-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:24px;margin-bottom:56px}
  .prod-grid.infra{grid-template-columns:repeat(2,1fr)}
  .pcard{
    background:var(--paper);border:1px solid var(--line);border-radius:var(--r);padding:32px;
    display:flex;gap:22px;align-items:flex-start;transition:transform .3s ease,box-shadow .3s ease,border-color .3s;
    position:relative;overflow:hidden;
  }
  .pcard:hover{transform:translateY(-5px);box-shadow:var(--shadow);border-color:#D9C9AC}
  .pcard .picon{flex:0 0 auto;width:64px;height:64px;border-radius:16px;background:var(--pine);display:flex;align-items:center;justify-content:center}
  .pcard.alt .picon{background:var(--clay)}
  .pcard.amber .picon{background:var(--amber-deep)}
  .pcard .pbody h3{font-size:1.4rem;margin-bottom:2px}
  .pcard .ptag{font-size:.74rem;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--amber-deep);margin-bottom:10px;display:inline-block}
  .pcard .pbody p{color:var(--ink-soft);font-size:.98rem}
  .pcard .pill{display:inline-block;margin-top:14px;margin-right:6px;font-size:.78rem;font-weight:600;color:var(--pine);background:rgba(76,122,102,.12);padding:.32rem .7rem;border-radius:100px}
  .pcard .pill.soon{color:var(--amber-deep);background:rgba(224,161,83,.16)}

  /* ---------- HOW IT WORKS ---------- */
  .how{background:var(--pine);color:var(--cream);position:relative;overflow:hidden}
  .how::before{content:"";position:absolute;top:-120px;left:-120px;width:420px;height:420px;border-radius:50%;background:radial-gradient(circle,rgba(224,161,83,.18),transparent 70%)}
  .how h2,.how h3{color:var(--cream)}
  .how .sec-head p{color:rgba(251,246,236,.72)}
  .how .eyebrow{color:var(--amber)}
  .flow{display:grid;grid-template-columns:repeat(4,1fr);gap:18px;position:relative;z-index:1}
  .fstep{background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.14);border-radius:18px;padding:26px 22px;position:relative}
  .fstep .step-n{font-family:"Fraunces";font-size:.9rem;color:var(--amber);font-weight:600;margin-bottom:14px}
  .fstep h3{font-size:1.18rem;margin-bottom:8px}
  .fstep p{font-size:.92rem;color:rgba(251,246,236,.74)}
  .fstep .arr{position:absolute;right:-22px;top:50%;transform:translateY(-50%);color:var(--amber);font-size:1.3rem;z-index:2}
  .fstep:last-child .arr{display:none}
  .how-note{margin-top:34px;font-size:.98rem;color:rgba(251,246,236,.7);max-width:70ch}
  .how-note b{color:var(--amber)}

  /* ---------- COMPLIANCE ---------- */
  .comp-grid{display:grid;grid-template-columns:1fr 1fr;gap:26px}
  .ccard{border-radius:var(--r);padding:38px;border:1px solid var(--line);position:relative;overflow:hidden}
  .ccard.alyssa{background:linear-gradient(155deg,#234A3E,#1E3A31);color:var(--cream)}
  .ccard.eli{background:linear-gradient(155deg,#C9853A,#B06B2C);color:#fff}
  .ccard h3{color:inherit;font-size:1.7rem;margin-bottom:6px}
  .ccard .law{font-size:.78rem;font-weight:700;letter-spacing:.12em;text-transform:uppercase;opacity:.8;margin-bottom:18px;display:block}
  .ccard p{font-size:1rem;opacity:.92;margin-bottom:18px}
  .ccard .devs{display:flex;gap:10px;flex-wrap:wrap}
  .ccard .devs span{font-size:.82rem;font-weight:600;background:rgba(255,255,255,.16);padding:.34rem .78rem;border-radius:100px}
  .comp-disc{margin-top:24px;font-size:.86rem;color:var(--ink-soft);max-width:80ch}

  /* ---------- PARTNER / CTA ---------- */
  .partner{background:var(--cream-deep)}
  .partner-grid{display:grid;grid-template-columns:1fr 1fr;gap:56px;align-items:center}
  .partner ul{list-style:none;margin-top:26px;display:grid;gap:14px}
  .partner li{display:flex;gap:12px;align-items:flex-start;font-size:1.03rem;color:var(--ink-soft)}
  .partner li svg{flex:0 0 auto;margin-top:4px}
  .cta-box{background:var(--paper);border:1px solid var(--line);border-radius:var(--r);padding:42px;box-shadow:var(--shadow)}
  .cta-box h3{font-size:1.8rem;margin-bottom:10px}
  .cta-box p{color:var(--ink-soft);margin-bottom:24px}
  .field{display:flex;flex-direction:column;gap:6px;margin-bottom:16px}
  .field label{font-size:.84rem;font-weight:600;color:var(--pine)}
  .field input{padding:.8rem 1rem;border:1.5px solid var(--line);border-radius:12px;font-family:inherit;font-size:.96rem;background:var(--cream);color:var(--ink)}
  .field input:focus{outline:none;border-color:var(--moss)}
  .cta-box .btn-amber{width:100%;justify-content:center;margin-top:6px}
  .cta-note{font-size:.82rem;color:var(--ink-soft);margin-top:14px;text-align:center}

  /* ---------- FOOTER ---------- */
  footer{background:var(--pine);color:rgba(251,246,236,.8);padding:64px 0 30px}
  .foot-grid{display:grid;grid-template-columns:1.4fr 1fr 1fr 1fr;gap:40px;margin-bottom:46px}
  footer .brand .name{color:var(--cream)}
  footer h4{color:var(--cream);font-family:"Hanken Grotesk";font-weight:700;font-size:.84rem;letter-spacing:.1em;text-transform:uppercase;margin-bottom:18px}
  footer ul{list-style:none;display:grid;gap:10px}
  footer ul a{font-size:.94rem;color:rgba(251,246,236,.72)}
  footer ul a:hover{color:var(--amber)}
  .foot-blurb{font-size:.94rem;color:rgba(251,246,236,.62);margin-top:18px;max-width:34ch}
  .foot-bottom{border-top:1px solid rgba(255,255,255,.12);padding-top:24px;display:flex;justify-content:space-between;align-items:center;gap:20px;flex-wrap:wrap;font-size:.85rem;color:rgba(251,246,236,.55)}
  .foot-bottom a{color:rgba(251,246,236,.7)}

  /* reveal animation */
  .reveal{opacity:0;transform:translateY(28px);transition:opacity .7s cubic-bezier(.16,1,.3,1),transform .7s cubic-bezier(.16,1,.3,1)}
  .reveal.in{opacity:1;transform:none}

  /* ---------- RESPONSIVE ---------- */
  @media(max-width:920px){
    .hero-grid{grid-template-columns:1fr;gap:46px}
    .hero .lede{max-width:46ch}
    .why-grid{grid-template-columns:1fr}
    .prod-grid,.prod-grid.infra{grid-template-columns:1fr}
    .flow{grid-template-columns:1fr 1fr}
    .fstep .arr{display:none}
    .comp-grid{grid-template-columns:1fr}
    .partner-grid{grid-template-columns:1fr;gap:40px}
    .foot-grid{grid-template-columns:1fr 1fr}
    .navlinks{display:none}
    .navlinks.open{display:flex;position:absolute;top:74px;left:0;right:0;background:var(--cream);flex-direction:column;gap:0;padding:8px 28px 22px;border-bottom:1px solid var(--line)}
    .navlinks.open a{padding:14px 0;border-bottom:1px solid var(--line);width:100%}
    .burger{display:flex}
    .nav-cta .btn-ghost{display:none}
  }
  @media(max-width:560px){
    .foot-grid{grid-template-columns:1fr}
    .flow{grid-template-columns:1fr}
    section{padding:68px 0}
    .hero{padding:54px 0 70px}
  }

  /* logo badge (nav) */
  .brand .logo-badge{width:44px;height:44px;flex:0 0 auto;border-radius:12px;display:flex;align-items:center;justify-content:center;
    background:var(--emblem) center / contain no-repeat, radial-gradient(125% 125% at 30% 18%, #16283d 0%, #0a121d 100%);
    border:1px solid rgba(255,255,255,.07);box-shadow:inset 0 1px 0 rgba(255,255,255,.10), 0 5px 14px rgba(10,18,29,.22)}
  footer .foot-emblem{width:48px;height:46px;flex:0 0 auto;background:var(--emblem) center / contain no-repeat;filter:drop-shadow(0 2px 6px rgba(0,0,0,.3))}
  /* hero device mesh */
  .mesh{position:relative;width:100%;height:292px;margin-bottom:18px}
  .mesh-lines{position:absolute;inset:0;width:100%;height:100%}
  .dev{position:absolute;transform:translate(-50%,-50%);display:flex;flex-direction:column;align-items:center;gap:6px;z-index:2}
  .dev .ph{border-radius:14px;overflow:hidden;background:var(--cream-deep);border:1px solid var(--line);
    box-shadow:0 8px 20px rgba(30,58,49,.16);width:52px;height:52px}
  .dev .ph img{width:100%;height:100%;object-fit:cover;display:block}
  .dev span{font-size:.6rem;font-weight:700;letter-spacing:.01em;color:var(--ink-soft);white-space:nowrap}
  .dev.center{z-index:3}
  .dev.center .ph{width:64px;height:64px;border-radius:16px;border:2px solid var(--amber);
    box-shadow:0 10px 26px rgba(30,58,49,.26)}
  .dev.center span{color:var(--pine);font-size:.66rem}
  .dev.center::after{content:"";position:absolute;top:32px;left:50%;width:84px;height:84px;transform:translate(-50%,-50%);
    border-radius:50%;background:radial-gradient(circle,rgba(224,161,83,.22),transparent 70%);z-index:-1}
  .t-ctrl{left:50%;top:13%}
  .m-eth{left:31%;top:46%}.m-mesh{left:69%;top:46%}
  .b-dm{left:17%;top:85%}.b-pb{left:50%;top:85%}.b-pbadge{left:83%;top:85%}
  @media(max-width:560px){.mesh{height:272px}.dev .ph{width:46px;height:46px}.dev.center .ph{width:58px;height:58px}.dev span{font-size:.54rem}}
  /* expandable / future-proof band */
  .expand{background:var(--cream-deep);border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
  .expand .inner{max-width:920px;margin:0 auto;text-align:center}
  .expand h2{font-size:clamp(1.9rem,3.4vw,2.7rem);margin:14px 0 16px}
  .expand p{font-size:1.12rem;color:var(--ink-soft);max-width:62ch;margin:0 auto}
  .path{display:flex;align-items:center;justify-content:center;flex-wrap:wrap;gap:10px;margin-top:40px}
  .path-step{font-weight:600;font-size:.95rem;color:var(--pine);background:var(--paper);border:1px solid var(--line);padding:.6rem 1rem;border-radius:100px;box-shadow:var(--shadow-sm);white-space:nowrap}
  .path-step.future{color:var(--ink-soft);background:transparent;border-style:dashed;font-style:italic;box-shadow:none}
  .path-arrow{color:var(--amber);font-weight:700;font-size:1.1rem}
  .path-base{margin-top:18px;font-size:.9rem;color:var(--ink-soft);font-weight:600}
  .path-base b{color:var(--moss)}
  @media(max-width:560px){.path-arrow{display:none}.path{gap:8px}}