:root{
    --ink:#0E1620;
    --ink-2:#152233;
    --paper:#F5F4EF;
    --paper-2:#EAE8DF;
    --line:#D8D5C8;
    --amber:#F2B705;
    --amber-deep:#C88F00;
    --verified:#2E7D5B;
    --slate:#5B6472;
    --white:#FFFFFF;
    --display: "Archivo Black", "Arial Black", Helvetica, sans-serif;
    --body: -apple-system, BlinkMacSystemFont, "Segoe UI", "Inter", Helvetica, Arial, sans-serif;
    --mono: "SFMono-Regular", "JetBrains Mono", Consolas, "Liberation Mono", Menlo, monospace;
  }
  *{box-sizing:border-box; margin:0; padding:0;}
  html{scroll-behavior:smooth;}
  body{
    background:var(--paper);
    color:var(--ink);
    font-family:var(--body);
    -webkit-font-smoothing:antialiased;
    overflow-x:hidden;
  }
  a{color:inherit; text-decoration:none;}
  .wrap{max-width:1180px; margin:0 auto; padding:0 32px;}
  @media(max-width:640px){.wrap{padding:0 20px;}}

  /* ---------- Nav ---------- */
  nav{
    position:sticky; top:0; z-index:50;
    background:rgba(245,244,239,0.9);
    backdrop-filter:blur(8px);
    border-bottom:1px solid var(--line);
  }
  nav .wrap{
    display:flex; align-items:center; justify-content:space-between;
    height:72px;
  }
  .logo{
    font-family:var(--display);
    font-size:20px;
    letter-spacing:0.02em;
    display:flex; align-items:center; gap:8px;
  }
  .logo .dot{width:7px; height:7px; border-radius:50%; background:var(--verified); display:inline-block;}
  .nav-links{display:flex; gap:32px; font-size:14px; color:var(--slate);}
  .nav-links a:hover{color:var(--ink);}
  @media(max-width:768px){.nav-links{display:none;}}
  .btn{
    font-family:var(--mono);
    font-size:12px;
    letter-spacing:0.08em;
    text-transform:uppercase;
    padding:11px 20px;
    border-radius:3px;
    border:1px solid var(--ink);
    display:inline-block;
    transition:all .15s ease;
    cursor:pointer;
  }
  .btn-primary{background:var(--ink); color:var(--paper);}
  .btn-primary:hover{background:var(--ink-2);}
  .btn-amber{background:var(--amber); color:var(--ink); border-color:var(--amber);}
  .btn-amber:hover{background:var(--amber-deep); border-color:var(--amber-deep);}
  .btn-ghost{background:transparent; color:var(--ink);}
  .btn-ghost:hover{background:var(--ink); color:var(--paper);}

  /* ---------- Eyebrow / field label style ---------- */
  .field-label{
    font-family:var(--mono);
    font-size:11px;
    letter-spacing:0.14em;
    text-transform:uppercase;
    color:var(--slate);
    display:flex; align-items:center; gap:8px;
    margin-bottom:18px;
  }
  .field-label .bar{width:24px; height:2px; background:var(--amber);}
  .field-label.on-dark{color:#9AA5B4;}

  /* ---------- Hero ---------- */
  .hero{
    padding:90px 0 100px;
    position:relative;
  }
  .hero .wrap{
    display:grid;
    grid-template-columns:1.1fr 0.9fr;
    gap:48px;
    align-items:center;
  }
  @media(max-width:900px){
    .hero .wrap{grid-template-columns:1fr; text-align:left;}
    .hero{padding:56px 0 72px;}
  }
  .hero h1{
    font-family:var(--display);
    font-size:clamp(40px, 6vw, 68px);
    line-height:0.98;
    letter-spacing:-0.01em;
    margin-bottom:24px;
  }
  .hero p.sub{
    font-size:18px;
    line-height:1.6;
    color:var(--slate);
    max-width:480px;
    margin-bottom:32px;
  }
  .hero .cta-row{display:flex; gap:14px; flex-wrap:wrap; margin-bottom:18px;}
  .trust-line{
    font-family:var(--mono);
    font-size:12px;
    color:var(--slate);
    display:flex; align-items:center; gap:8px;
  }
  .trust-line .pip{width:6px; height:6px; border-radius:50%; background:var(--verified);}

  /* ---------- Badge card (signature element) ---------- */
  .badge-stage{
    position:relative;
    height:420px;
    display:flex; align-items:center; justify-content:center;
  }
  .badge{
    width:340px;
    background:var(--ink);
    border-radius:14px;
    padding:26px 24px 22px;
    color:var(--paper);
    position:relative;
    box-shadow:0 30px 60px -20px rgba(14,22,32,0.5);
    transform:rotate(-6deg);
  }
  .badge.back{
    position:absolute;
    transform:rotate(7deg) translate(18px, 14px);
    opacity:0.5;
    z-index:0;
    background:var(--ink-2);
  }
  .badge.front{position:relative; z-index:1;}
  .badge .hole{
    width:34px; height:6px; border-radius:4px;
    background:rgba(245,244,239,0.15);
    margin:0 auto 18px;
  }
  .badge .stripe{
    position:absolute; top:0; right:0;
    width:64px; height:100%;
    background:repeating-linear-gradient(
      -45deg, var(--amber), var(--amber) 6px, transparent 6px, transparent 12px
    );
    opacity:0.9;
    border-radius:0 14px 14px 0;
    clip-path:polygon(100% 0, 100% 100%, 40% 100%);
  }
  .badge .badge-top{
    display:flex; justify-content:space-between; align-items:flex-start;
    margin-bottom:22px;
  }
  .badge .badge-brand{
    font-family:var(--mono); font-size:10px; letter-spacing:0.16em; color:#9AA5B4;
  }
  .badge .verified-tag{
    font-family:var(--mono); font-size:10px; letter-spacing:0.08em;
    color:var(--verified); display:flex; align-items:center; gap:5px;
  }
  .badge .verified-tag .pip{width:6px; height:6px; border-radius:50%; background:var(--verified);}
  .badge .field{margin-bottom:12px;}
  .badge .field .k{
    font-family:var(--mono); font-size:9px; letter-spacing:0.14em; color:#7C8794; margin-bottom:3px;
  }
  .badge .field .v{
    font-family:var(--mono); font-size:15px; color:var(--paper); letter-spacing:0.01em;
  }
  .badge .field .v.muted{color:#B9C0CA; font-size:12px;}

  /* ---------- Problem section ---------- */
  .problem{
    background:var(--ink);
    color:var(--paper);
    padding:96px 0;
  }
  .problem h2{
    font-family:var(--display);
    font-size:clamp(30px,4.2vw,46px);
    line-height:1.08;
    max-width:640px;
    margin-bottom:22px;
  }
  .problem p{
    color:#B9C0CA;
    font-size:17px;
    line-height:1.7;
    max-width:560px;
    margin-bottom:48px;
  }
  .stamp-row{
    display:flex; gap:20px; flex-wrap:wrap;
  }
  .stamp{
    font-family:var(--mono);
    border:1.5px dashed #45505F;
    border-radius:50%;
    width:168px; height:168px;
    display:flex; flex-direction:column; align-items:center; justify-content:center;
    text-align:center;
    transform:rotate(-4deg);
    flex-shrink:0;
  }
  .stamp:nth-child(2){transform:rotate(3deg);}
  .stamp:nth-child(3){transform:rotate(-2deg);}
  .stamp .num{font-size:26px; font-weight:700; color:var(--amber); font-family:var(--display); margin-bottom:6px;}
  .stamp .lbl{font-size:9.5px; letter-spacing:0.08em; color:#9AA5B4; text-transform:uppercase; padding:0 16px; line-height:1.4;}
  .source-note{
    font-family:var(--mono);
    font-size:11px;
    color:#6B7684;
    margin-top:28px;
  }
  .source-note a{color:#9AA5B4; border-bottom:1px dotted #45505F;}
  .source-note a:hover{color:var(--amber);}

  /* ---------- Pillars ---------- */
  .pillars{padding:100px 0;}
  .section-head{max-width:600px; margin-bottom:56px;}
  .section-head h2{
    font-family:var(--display);
    font-size:clamp(28px,3.6vw,40px);
    line-height:1.1;
  }
  .pillar-grid{
    display:grid;
    grid-template-columns:repeat(3, 1fr);
    gap:24px;
  }
  @media(max-width:860px){.pillar-grid{grid-template-columns:1fr;}}
  .pillar-card{
    background:var(--white);
    border:1px solid var(--line);
    border-radius:10px;
    padding:32px 26px;
    position:relative;
  }
  .pillar-card .icon{
    width:38px; height:38px;
    margin-bottom:22px;
  }
  .pillar-card h3{
    font-size:19px;
    margin-bottom:10px;
    letter-spacing:-0.01em;
  }
  .pillar-card p{
    color:var(--slate);
    font-size:14.5px;
    line-height:1.6;
  }
  .pillar-card .tag{
    position:absolute; top:24px; right:24px;
    font-family:var(--mono); font-size:10px; color:var(--line-dark, #C7C3B4);
  }

  /* ---------- How it works ---------- */
  .how{background:var(--paper-2); padding:100px 0;}
  .steps{
    display:flex; gap:0; overflow-x:auto; padding-bottom:8px;
  }
  .step{
    flex:1 1 0;
    min-width:190px;
    padding:0 22px 0 0;
    position:relative;
  }
  .step:not(:last-child)::after{
    content:"";
    position:absolute; top:20px; right:0;
    width:22px; height:0;
    border-top:2px dashed var(--line);
  }
  @media(max-width:900px){
    .steps{flex-direction:column;}
    .step:not(:last-child)::after{display:none;}
    .step{padding:0 0 32px 0;}
  }
  .step .stepnum{
    font-family:var(--mono);
    font-size:12px; color:var(--amber-deep);
    background:var(--white);
    border:1.5px solid var(--ink);
    width:40px; height:40px;
    border-radius:50%;
    display:flex; align-items:center; justify-content:center;
    margin-bottom:18px;
  }
  .step h4{font-size:16px; margin-bottom:8px;}
  .step p{font-size:13.5px; color:var(--slate); line-height:1.6;}

  /* ---------- Inbox mock ---------- */
  .inbox-section{padding:100px 0;}
  .inbox-frame{
    background:var(--white);
    border:1px solid var(--line);
    border-radius:12px;
    overflow:hidden;
    box-shadow:0 40px 80px -40px rgba(14,22,32,0.25);
  }
  .inbox-chrome{
    display:flex; align-items:center; gap:8px;
    padding:14px 18px;
    border-bottom:1px solid var(--line);
    background:var(--paper-2);
  }
  .inbox-chrome span{width:9px; height:9px; border-radius:50%; background:var(--line);}
  .inbox-chrome .addr{
    font-family:var(--mono); font-size:11px; color:var(--slate);
    margin-left:8px;
  }
  .inbox-body{display:grid; grid-template-columns:190px 1fr;}
  @media(max-width:700px){.inbox-body{grid-template-columns:1fr;}}
  .inbox-side{
    border-right:1px solid var(--line);
    padding:18px 0;
  }
  @media(max-width:700px){.inbox-side{display:none;}}
  .inbox-side .cat{
    font-family:var(--mono);
    font-size:12px;
    padding:10px 20px;
    color:var(--slate);
    display:flex; justify-content:space-between;
  }
  .inbox-side .cat.active{color:var(--ink); background:var(--paper-2); border-right:2px solid var(--amber);}
  .inbox-list .row{
    display:flex; align-items:center; gap:14px;
    padding:16px 22px;
    border-bottom:1px solid var(--line);
  }
  .inbox-list .row:last-child{border-bottom:none;}
  .inbox-list .avatar{
    width:34px; height:34px; border-radius:8px;
    background:var(--paper-2);
    font-family:var(--mono); font-size:11px;
    display:flex; align-items:center; justify-content:center;
    color:var(--slate); flex-shrink:0;
  }
  .inbox-list .meta{flex:1; min-width:0;}
  .inbox-list .sender{font-size:14px; font-weight:600;}
  .inbox-list .snippet{font-size:12.5px; color:var(--slate); white-space:nowrap; overflow:hidden; text-overflow:ellipsis;}
  .tag-pill{
    font-family:var(--mono); font-size:9.5px; letter-spacing:0.05em; text-transform:uppercase;
    padding:4px 9px; border-radius:20px; flex-shrink:0;
  }
  .tag-pill.exploring{background:#E3ECF6; color:#3A5A80;}
  .tag-pill.evaluating{background:#FCEFCC; color:var(--amber-deep);}
  .tag-pill.decided{background:#DCEEE4; color:var(--verified);}

  /* ---------- Vendors ---------- */
  .vendors{background:var(--ink); color:var(--paper); padding:100px 0;}
  .vendors .wrap{display:grid; grid-template-columns:1fr 1fr; gap:56px; align-items:center;}
  @media(max-width:860px){.vendors .wrap{grid-template-columns:1fr;}}
  .vendors h2{font-family:var(--display); font-size:clamp(28px,3.6vw,40px); margin-bottom:20px; line-height:1.1;}
  .vendors p{color:#B9C0CA; font-size:16px; line-height:1.7; margin-bottom:28px;}
  .chip-list{display:flex; flex-direction:column; gap:14px;}
  .chip{
    font-family:var(--mono); font-size:12.5px;
    border:1px solid #2C394A;
    border-radius:8px;
    padding:14px 16px;
    display:flex; align-items:center; gap:10px;
    color:#D7DCE3;
  }
  .chip .pip{width:6px; height:6px; border-radius:50%; background:var(--verified); flex-shrink:0;}

  /* ---------- Trust statement ---------- */
  .trust{padding:120px 0; text-align:center;}
  .trust blockquote{
    font-family:var(--display);
    font-size:clamp(24px,3.4vw,36px);
    line-height:1.25;
    max-width:760px;
    margin:0 auto 24px;
  }
  .trust cite{
    font-family:var(--mono); font-size:12px; color:var(--slate); letter-spacing:0.08em; text-transform:uppercase; font-style:normal;
  }

  /* ---------- Closing CTA ---------- */
  .closing{background:var(--paper-2); padding:100px 0; text-align:center;}
  .closing h2{
    font-family:var(--display);
    font-size:clamp(30px,4.4vw,48px);
    margin-bottom:18px;
  }
  .closing p{color:var(--slate); font-size:16px; margin-bottom:36px;}
  .closing .cta-row{display:flex; gap:14px; justify-content:center; flex-wrap:wrap; margin-bottom:16px;}
  .closing .domain{font-family:var(--mono); font-size:12px; color:var(--slate);}

  footer{
    border-top:1px solid var(--line);
    padding:32px 0;
  }
  footer .wrap{display:flex; justify-content:space-between; align-items:center; flex-wrap:wrap; gap:12px;}
  footer .flinks{display:flex; gap:24px; font-size:13px; color:var(--slate);}
  footer .fnote{font-family:var(--mono); font-size:11px; color:var(--slate);}
  footer .fnote a{border-bottom:1px dotted var(--slate);}
  footer .fnote a:hover{color:var(--ink); border-bottom-color:var(--ink);}

  /* ---------- Waitlist form ---------- */
  .waitlist-form{
    display:flex; gap:10px; flex-wrap:wrap;
    max-width:440px;
  }
  .waitlist-form input[type="email"]{
    flex:1 1 220px;
    min-width:200px;
    padding:12px 14px;
    border:1px solid var(--ink);
    border-radius:3px;
    font-family:var(--body);
    font-size:14px;
    background:var(--white);
    color:var(--ink);
  }
  .waitlist-form input[type="email"]::placeholder{color:#9aa0a8;}
  .waitlist-form button{
    font-family:var(--mono);
    font-size:12px;
    letter-spacing:0.08em;
    text-transform:uppercase;
    padding:12px 22px;
    border-radius:3px;
    border:1px solid var(--amber);
    background:var(--amber);
    color:var(--ink);
    cursor:pointer;
    transition:all .15s ease;
  }
  .waitlist-form button:hover{background:var(--amber-deep); border-color:var(--amber-deep);}
  .waitlist-note{font-family:var(--mono); font-size:11px; color:var(--slate); margin-top:10px;}
  section.on-dark .waitlist-note{color:#9AA5B4;}
  section.on-dark .waitlist-form input[type="email"]{border-color:#3A4653;}

  /* ---------- Inner page header ---------- */
  .page-header{padding:64px 0 24px;}
  .page-header .field-label{margin-bottom:14px;}
  .page-header h1{
    font-family:var(--display);
    font-size:clamp(32px,4.6vw,52px);
    line-height:1.06;
    max-width:760px;
    margin-bottom:18px;
  }
  .page-header p{
    font-size:17px; color:var(--slate); max-width:560px; line-height:1.65;
  }

  /* ---------- Pricing ---------- */
  .pricing-grid{
    display:grid; grid-template-columns:repeat(3,1fr); gap:24px;
  }
  @media(max-width:900px){.pricing-grid{grid-template-columns:1fr;}}
  .price-card{
    background:var(--white);
    border:1px solid var(--line);
    border-radius:10px;
    padding:32px 26px;
    display:flex; flex-direction:column;
  }
  .price-card.featured{
    border-color:var(--ink);
    box-shadow:0 20px 50px -30px rgba(14,22,32,0.5);
    position:relative;
  }
  .price-card .plan-tag{
    font-family:var(--mono); font-size:10px; letter-spacing:0.1em; text-transform:uppercase;
    color:var(--amber-deep); margin-bottom:14px;
  }
  .price-card h3{font-size:20px; margin-bottom:6px;}
  .price-card .price{
    font-family:var(--display); font-size:34px; margin:14px 0 4px;
  }
  .price-card .price span{font-family:var(--mono); font-size:12px; color:var(--slate); font-weight:400;}
  .price-card ul{list-style:none; margin:20px 0 24px; flex:1;}
  .price-card li{
    font-size:13.5px; color:var(--slate); padding:8px 0; border-top:1px solid var(--paper-2);
    display:flex; gap:8px; align-items:flex-start;
  }
  .price-card li::before{content:"·"; color:var(--verified); font-weight:700; flex-shrink:0;}
  .pricing-note{
    font-family:var(--mono); font-size:12px; color:var(--slate);
    border:1px dashed var(--line); border-radius:8px; padding:16px 18px; margin-top:40px; max-width:700px;
  }

  /* ---------- FAQ ---------- */
  .faq-item{
    border-top:1px solid var(--line);
    padding:22px 0;
  }
  .faq-item:last-child{border-bottom:1px solid var(--line);}
  .faq-item h4{font-size:16px; margin-bottom:8px;}
  .faq-item p{font-size:14px; color:var(--slate); line-height:1.65; max-width:680px;}

  /* ---------- Trust / policy content ---------- */
  .policy-block{padding:8px 0 40px;}
  .policy-block h2{
    font-family:var(--display); font-size:22px; margin:36px 0 12px;
  }
  .policy-block h2:first-child{margin-top:0;}
  .policy-block p, .policy-block li{
    font-size:15px; color:var(--slate); line-height:1.75; max-width:720px;
  }
  .policy-block ul{margin:8px 0 8px 20px;}
  .disclaimer-box{
    background:var(--paper-2);
    border-left:3px solid var(--amber);
    padding:16px 20px;
    font-size:13.5px;
    color:var(--slate);
    max-width:720px;
    border-radius:0 6px 6px 0;
    margin-bottom:36px;
  }
