:root{
    --void:#07080A;          /* near-black base */
    --panel:#0F1115;
    --panel-2:#151820;
    --rule:#23272F;
    --rule-soft:#1A1D24;
    --ink:#E4E7EC;           /* primary text */
    --dim:#828B98;           /* secondary text */
    --faint:#525966;
    --signal:#37E0A6;        /* telemetry green — the live/positive accent */
    --alert:#E0603A;         /* the cut/negative accent, used sparingly */
    --amber:#E6B23A;         /* provisional / recording, not yet validated */
    --disp:"Barlow Condensed",Impact,sans-serif;
    --mono:"Share Tech Mono",ui-monospace,Menlo,monospace;
    --body:"Spline Sans",system-ui,sans-serif;
  }
  *{box-sizing:border-box}
  html{scroll-behavior:smooth}
  @media (prefers-reduced-motion:reduce){html{scroll-behavior:auto} *{animation:none!important;transition:none!important}}
  body{
    margin:0;background:var(--void);color:var(--ink);
    font-family:var(--body);font-size:17px;line-height:1.62;
    -webkit-font-smoothing:antialiased;overflow-x:hidden;
  }
  a{color:inherit;text-decoration:none}
  .wrap{max-width:1080px;margin:0 auto;padding:0 24px}

  /* ---------- telemetry ticker ---------- */
  .ticker{
    border-bottom:1px solid var(--rule-soft);background:var(--void);
    font-family:var(--mono);font-size:11px;letter-spacing:.14em;color:var(--faint);
    text-transform:uppercase;overflow:hidden;white-space:nowrap;
  }
  .ticker .wrap{display:flex;gap:36px;padding-top:9px;padding-bottom:9px;align-items:center}
  .ticker b{color:var(--signal);font-weight:400}
  .ticker .sep{color:var(--rule)}

  /* ---------- nav ---------- */
  nav{position:sticky;top:0;z-index:50;background:rgba(7,8,10,.86);backdrop-filter:blur(10px);
    border-bottom:1px solid var(--rule-soft)}
  nav .wrap{display:flex;align-items:center;justify-content:space-between;height:66px}
  .brand{display:flex;align-items:center;gap:11px;font-family:var(--disp);font-weight:600;
    text-transform:uppercase;letter-spacing:.03em;font-size:19px}
  .brand .mark{display:none}
  @keyframes pulse{0%{box-shadow:0 0 0 0 rgba(55,224,166,.5)}70%{box-shadow:0 0 0 9px rgba(55,224,166,0)}100%{box-shadow:0 0 0 0 rgba(55,224,166,0)}}
  .navlinks{display:flex;gap:6px;align-items:center;font-family:var(--body);font-size:15px;font-weight:500;
    letter-spacing:0;text-transform:none;color:var(--ink)}
  .navlinks a{color:var(--ink);opacity:.82;padding:8px 14px;border-radius:8px;transition:all .15s;text-decoration:none}
  .navlinks a:hover{opacity:1;background:rgba(255,255,255,.06);color:#fff}
  .nav-cta{font-family:var(--body);font-size:15px;font-weight:700;letter-spacing:0;text-transform:none;
    background:var(--signal);border:1px solid var(--signal);color:var(--void);padding:10px 20px;border-radius:8px;transition:all .15s;text-decoration:none}
  .nav-cta:hover{background:#2ee0a6;box-shadow:0 4px 16px rgba(55,224,166,.32);transform:translateY(-1px)}
  @media (max-width:760px){.navlinks{display:none}}

  /* ---------- hero ---------- */
  .hero{position:relative;padding:96px 0 76px;border-bottom:1px solid var(--rule-soft);overflow:hidden}
  .hero .grid-bg{position:absolute;inset:0;pointer-events:none;opacity:.5;
    background-image:linear-gradient(var(--rule-soft) 1px,transparent 1px),linear-gradient(90deg,var(--rule-soft) 1px,transparent 1px);
    background-size:64px 64px;
    mask-image:radial-gradient(ellipse 70% 60% at 30% 20%,#000 30%,transparent 75%);
    -webkit-mask-image:radial-gradient(ellipse 70% 60% at 30% 20%,#000 30%,transparent 75%);}
  .hero-eyebrow{font-family:var(--mono);font-size:12px;letter-spacing:.22em;text-transform:uppercase;
    color:var(--signal);margin-bottom:26px;position:relative}
  h1{font-family:var(--disp);font-weight:700;text-transform:uppercase;line-height:.94;letter-spacing:-.01em;
    font-size:clamp(46px,8.5vw,104px);margin:0 0 28px;position:relative}
  h1 .quiet{color:var(--dim);display:block}
  .hero-lede{font-size:clamp(17px,2.2vw,20px);color:var(--dim);max-width:56ch;margin:0 0 40px;position:relative}
  .hero-lede strong{color:var(--ink);font-weight:500}
  .hero-actions{display:flex;gap:14px;flex-wrap:wrap;position:relative}
  .btn{font-family:var(--mono);font-size:15px;letter-spacing:.08em;text-transform:uppercase;
    padding:17px 30px;border-radius:6px;cursor:pointer;transition:all .16s;display:inline-flex;align-items:center;gap:10px;border:1px solid transparent}
  .btn-primary{background:var(--signal);color:var(--void);font-weight:400}
  .btn-primary:hover{transform:translateY(-2px);box-shadow:0 10px 30px -8px rgba(55,224,166,.5)}
  .btn-ghost{border-color:var(--rule);color:var(--ink)}
  .btn-ghost:hover{border-color:var(--dim);background:var(--panel)}

  /* ---------- section scaffolding ---------- */
  section{padding:88px 0;border-bottom:1px solid var(--rule-soft)}
  .sec-tag{font-family:var(--mono);font-size:12px;letter-spacing:.2em;text-transform:uppercase;
    color:var(--faint);margin-bottom:18px;display:flex;align-items:center;gap:12px}
  .sec-tag::before{content:"";width:26px;height:1px;background:var(--signal)}
  h2{font-family:var(--disp);font-weight:600;text-transform:uppercase;letter-spacing:0;line-height:1;
    font-size:clamp(32px,5vw,52px);margin:0 0 22px}
  .sec-lede{color:var(--dim);max-width:62ch;font-size:19px;line-height:1.6;margin:0 0 46px}

  /* ---------- the story panel ---------- */
  .story{background:var(--panel);border:1px solid var(--rule);border-radius:10px;overflow:hidden}
  .story-head{border-bottom:1px solid var(--rule);padding:14px 22px;display:flex;justify-content:space-between;
    align-items:center;font-family:var(--mono);font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:var(--faint)}
  .story-head .live{color:var(--alert)}
  .story-body{padding:34px 30px}
  .story-body p{margin:0 0 20px;font-size:17px;line-height:1.72}
  .story-body p:last-child{margin-bottom:0}
  .story-body .punch{font-family:var(--disp);font-weight:500;text-transform:uppercase;font-size:clamp(20px,3vw,27px);
    line-height:1.15;color:var(--ink);letter-spacing:.01em}
  .story-body .punch b{color:var(--signal);font-weight:500}
  .story-body em{color:var(--dim);font-style:normal}

  /* ---------- receipt ---------- */
  .receipt-wrap{display:grid;grid-template-columns:1fr 1fr;gap:28px;align-items:start}
  .receipt-wrap .receipt-legend{grid-column:1 / -1;margin-top:6px}
  @media (max-width:820px){.receipt-wrap{grid-template-columns:1fr;gap:28px}.receipt-wrap .receipt-legend{grid-column:auto}}
  .receipt{background:#0B0D11;border:1px solid var(--rule);border-radius:10px;font-family:var(--mono);
    font-size:13px;overflow:hidden;box-shadow:0 30px 60px -30px #000}
  .receipt-top{background:var(--panel-2);padding:13px 18px;border-bottom:1px solid var(--rule);
    display:flex;justify-content:space-between;color:var(--dim);font-size:11px;letter-spacing:.1em;text-transform:uppercase}
  .receipt-top .grade{color:var(--signal);font-weight:400}
  .receipt-rows{padding:8px 0}
  .rrow{display:grid;grid-template-columns:1fr auto;gap:16px;padding:11px 18px;border-bottom:1px solid var(--rule-soft);align-items:baseline}
  .rrow:last-child{border-bottom:0}
  .rrow .k{color:var(--dim)}
  .rrow .v{text-align:right;color:var(--ink)}
  .rrow .v.pos{color:var(--signal)} .rrow .v.neg{color:var(--alert)} .rrow .v.amb{color:var(--amber)}
  .rrow small{display:block;color:var(--faint);font-size:11px;margin-top:3px;letter-spacing:.02em}
  .rrow.final{background:rgba(55,224,166,.06);border-top:1px solid var(--rule)}
  .rrow.final .k{color:var(--ink)}
  .receipt-legend{color:var(--dim);font-size:15px;line-height:1.7}
  .receipt-legend h3{font-family:var(--disp);text-transform:uppercase;font-size:24px;font-weight:600;margin:0 0 14px;color:var(--ink)}
  .receipt-legend b{color:var(--signal);font-weight:400;font-family:var(--mono);font-size:13px}

  /* ---------- compounding visual ---------- */
  .stack{display:grid;grid-template-columns:.95fr 1.05fr;gap:48px;align-items:center}
  @media (max-width:820px){.stack{grid-template-columns:1fr;gap:32px}}
  .stack-copy h2{margin-bottom:20px}
  .stack-copy p{color:var(--dim);margin:0 0 18px;font-size:17px}
  .stack-copy p strong{color:var(--ink);font-weight:500}
  .brick-viz{background:var(--panel);border:1px solid var(--rule);border-radius:10px;padding:30px 26px}
  .brick-cap{font-family:var(--mono);font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:var(--faint);
    margin-bottom:22px;display:flex;justify-content:space-between}
  .bricks{display:flex;flex-direction:column-reverse;gap:5px}
  .brick{height:26px;border-radius:6px;background:linear-gradient(90deg,rgba(55,224,166,.16),rgba(55,224,166,.04));
    border:1px solid rgba(55,224,166,.28);display:flex;align-items:center;padding:0 12px;
    font-family:var(--mono);font-size:11px;color:var(--signal);letter-spacing:.06em;
    transform-origin:left;animation:grow .8s cubic-bezier(.2,.8,.2,1) backwards}
  @keyframes grow{from{transform:scaleX(0);opacity:0}to{transform:scaleX(1);opacity:1}}
  .brick:nth-child(1){animation-delay:.05s} .brick:nth-child(2){animation-delay:.15s}
  .brick:nth-child(3){animation-delay:.25s} .brick:nth-child(4){animation-delay:.35s}
  .brick:nth-child(5){animation-delay:.45s} .brick:nth-child(6){animation-delay:.55s}
  .brick:nth-child(7){animation-delay:.65s}
  .brick .neg{color:var(--alert)}
  .brick-note{margin-top:20px;font-size:13px;color:var(--faint);line-height:1.6;font-family:var(--mono)}

  /* ---------- pillars ---------- */
  .pillars{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}
  @media (max-width:820px){.pillars{grid-template-columns:1fr}}
  .pillar{background:var(--panel);border:1px solid var(--rule);border-radius:10px;padding:28px 24px;transition:border-color .18s,transform .18s}
  .pillar:hover{border-color:var(--rule);transform:translateY(-3px)}
  .pillar .idx{font-family:var(--mono);font-size:12px;color:var(--signal);letter-spacing:.14em;margin-bottom:16px}
  .pillar h3{font-family:var(--disp);text-transform:uppercase;font-size:23px;font-weight:600;margin:0 0 12px;letter-spacing:.01em}
  .pillar p{color:var(--dim);font-size:16.5px;margin:0}

  /* ---------- intel / recording strip ---------- */
  .intel{background:var(--panel);border:1px solid var(--rule);border-radius:10px;padding:34px 30px;
    display:grid;grid-template-columns:auto 1fr;gap:30px;align-items:center}
  @media (max-width:760px){.intel{grid-template-columns:1fr;gap:22px}}
  .intel-badge{font-family:var(--mono);font-size:12px;letter-spacing:.1em;text-transform:uppercase;
    border:1px solid var(--amber);color:var(--amber);border-radius:6px;padding:10px 14px;white-space:nowrap;text-align:center}
  .intel-badge .dot{display:inline-block;width:7px;height:7px;border-radius:50%;background:var(--amber);margin-right:7px;
    animation:pulse-amber 2s infinite}
  @keyframes pulse-amber{0%,100%{opacity:1}50%{opacity:.35}}
  .intel h3{font-family:var(--disp);text-transform:uppercase;font-size:26px;font-weight:600;margin:0 0 10px}
  .intel p{color:var(--dim);font-size:16px;margin:0}
  .intel p b{color:var(--ink);font-weight:500}

  /* ---------- tiers ---------- */
  .tiers{display:grid;grid-template-columns:1fr 1fr;gap:20px}
  .tiers-3{grid-template-columns:repeat(3,1fr)}
  @media (max-width:900px){.tiers-3{grid-template-columns:1fr}}
  @media (max-width:760px){.tiers{grid-template-columns:1fr}}
  .tier{background:var(--panel);border:2px solid var(--rule);border-radius:16px;padding:36px 30px;position:relative;display:flex;flex-direction:column;transition:border-color .18s,transform .18s}
  .tier:hover{transform:translateY(-4px)}
  .tier.feature{border-color:var(--signal);box-shadow:0 0 0 1px var(--signal),0 30px 60px -30px rgba(55,224,166,.35)}
  .tier .flag{position:absolute;top:-2px;right:24px;background:var(--signal);color:var(--void);
    font-family:var(--mono);font-size:12px;font-weight:500;letter-spacing:.12em;text-transform:uppercase;padding:7px 14px;border-radius:0 0 8px 8px}
  .tier .tname{font-family:var(--disp);text-transform:uppercase;font-size:34px;font-weight:700;margin:0 0 14px;letter-spacing:.01em}
  .tprice{font-family:var(--disp);font-weight:700;line-height:.9;margin:0 0 4px;color:#fff}
  .tprice .amt{font-size:66px;letter-spacing:-.01em}
  .tprice .per{font-family:var(--mono);font-size:15px;font-weight:400;color:var(--dim);letter-spacing:.06em;text-transform:uppercase;margin-left:4px}
  .tier.feature .tprice .amt{color:var(--signal)}
  .tier .tsub{font-family:var(--body);font-size:16px;color:var(--dim);margin-bottom:26px;line-height:1.4}
  .tier ul{list-style:none;margin:0 0 28px;padding:0;flex:1}
  .tier li{padding:13px 0 13px 28px;position:relative;color:var(--ink);font-size:16.5px;border-bottom:1px solid var(--rule-soft)}
  .tier li:last-child{border-bottom:0}
  .tier li::before{content:"";position:absolute;left:0;top:19px;width:11px;height:11px;border-radius:50%;
    border:1.5px solid var(--signal)}
  .tier li.on::before{background:var(--signal)}
  .tier li.off{color:var(--faint)}
  .tier li.off::before{border-color:var(--faint)}
  .tier .btn{width:100%;justify-content:center}

  /* ---------- compliance / trust footer strip ---------- */
  .trust{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;background:var(--rule);border:1px solid var(--rule);border-radius:10px;overflow:hidden}
  @media (max-width:760px){.trust{grid-template-columns:1fr}}
  .trust div{background:var(--panel);padding:26px 24px}
  .trust h4{font-family:var(--mono);font-size:14px;letter-spacing:.1em;text-transform:uppercase;color:var(--signal);margin:0 0 12px}
  .trust p{color:var(--dim);font-size:16px;margin:0;line-height:1.62}

  /* ---------- final CTA ---------- */
  .final{text-align:center;padding:104px 0}
  .final h2{font-size:clamp(38px,7vw,74px);margin-bottom:20px}
  .final p{color:var(--dim);max-width:48ch;margin:0 auto 40px;font-size:18px}

  footer{border-top:1px solid var(--rule-soft);padding:44px 0;color:var(--faint);font-size:13px}
  footer .wrap{display:flex;justify-content:space-between;gap:20px;flex-wrap:wrap;align-items:center}
  footer .disc{font-family:var(--mono);font-size:11px;line-height:1.7;max-width:62ch;color:var(--faint)}
  footer a{color:var(--dim)}footer a:hover{color:var(--ink)}

/* ===== shared page furniture (interior pages) ===== */
.page-hero{padding:72px 0 48px;border-bottom:1px solid var(--rule-soft);position:relative}
.page-hero h1{font-size:clamp(38px,6.5vw,72px);margin-bottom:20px}
.page-hero .hero-lede{margin-bottom:0}
.back-link{font-family:var(--mono);font-size:12px;letter-spacing:.1em;text-transform:uppercase;color:var(--dim);display:inline-flex;gap:8px;margin-bottom:26px}
.back-link:hover{color:var(--signal)}

/* step list */
.steps{display:flex;flex-direction:column;gap:2px}
.step{display:grid;grid-template-columns:auto 1fr;gap:26px;padding:30px 0;border-bottom:1px solid var(--rule-soft);align-items:start}
.step:last-child{border-bottom:0}
.step-n{font-family:var(--disp);font-weight:600;font-size:44px;line-height:1;color:var(--signal);opacity:.5;min-width:56px}
.step h3{font-family:var(--disp);text-transform:uppercase;font-size:26px;font-weight:600;margin:0 0 10px}
.step p{color:var(--dim);margin:0;font-size:17.5px;max-width:62ch}
.step p b{color:var(--ink);font-weight:500}

/* faq */
.faq-list{border-top:1px solid var(--rule-soft)}
.faq-item{border-bottom:1px solid var(--rule-soft)}
.faq-q{width:100%;background:none;border:0;color:var(--ink);font-family:var(--disp);text-transform:uppercase;
  font-size:clamp(19px,2.6vw,24px);font-weight:500;letter-spacing:.01em;text-align:left;padding:24px 40px 24px 0;
  cursor:pointer;position:relative;display:block}
.faq-q::after{content:"+";position:absolute;right:6px;top:50%;transform:translateY(-50%);color:var(--signal);font-family:var(--mono);font-size:22px;transition:transform .2s}
.faq-item.open .faq-q::after{content:"−"}
.faq-a{max-height:0;overflow:hidden;transition:max-height .28s ease;color:var(--dim);font-size:17.5px;line-height:1.72}
.faq-item.open .faq-a{max-height:340px}
.faq-a .inner{padding:0 0 26px}
.faq-a b{color:var(--ink);font-weight:500}

/* track record */
.tr-panel{background:var(--panel);border:1px solid var(--rule);border-radius:10px;overflow:hidden;margin-bottom:24px}
.tr-head{padding:16px 22px;border-bottom:1px solid var(--rule);display:flex;justify-content:space-between;align-items:center;
  font-family:var(--mono);font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:var(--faint)}
.tr-head .live{color:var(--signal)}
.tr-table{width:100%;border-collapse:collapse;font-family:var(--mono);font-size:13px}
.tr-table th{text-align:right;padding:14px 22px;color:var(--faint);font-size:10px;letter-spacing:.14em;text-transform:uppercase;font-weight:400;border-bottom:1px solid var(--rule)}
.tr-table th:first-child,.tr-table td:first-child{text-align:left}
.tr-table td{text-align:right;padding:15px 22px;border-bottom:1px solid var(--rule-soft);color:var(--ink)}
.tr-empty{padding:54px 22px;text-align:center;color:var(--dim);font-size:16px;line-height:1.7}
.tr-empty .big{font-family:var(--disp);text-transform:uppercase;font-size:26px;color:var(--ink);font-weight:600;margin-bottom:12px}

/* calculator */
.calc{display:grid;grid-template-columns:1fr 1fr;gap:40px;align-items:start}
@media (max-width:820px){.calc{grid-template-columns:1fr;gap:28px}}
.calc-controls{background:var(--panel);border:1px solid var(--rule);border-radius:10px;padding:30px 28px}
.calc-field{margin-bottom:26px}
.calc-field:last-child{margin-bottom:0}
.calc-field label{display:flex;justify-content:space-between;align-items:baseline;font-family:var(--mono);font-size:12px;letter-spacing:.1em;text-transform:uppercase;color:var(--dim);margin-bottom:12px}
.calc-field label .val{color:var(--signal);font-size:16px}
input[type=range]{width:100%;height:4px;border-radius:6px;background:var(--rule);appearance:none;outline:none}
input[type=range]::-webkit-slider-thumb{appearance:none;width:20px;height:20px;border-radius:50%;background:var(--signal);cursor:pointer;box-shadow:0 0 0 4px rgba(55,224,166,.15)}
input[type=range]::-moz-range-thumb{width:20px;height:20px;border:0;border-radius:50%;background:var(--signal);cursor:pointer}
.calc-out{background:var(--panel);border:1px solid var(--rule);border-radius:10px;padding:32px 28px;position:sticky;top:90px}
.calc-out .cap{font-family:var(--mono);font-size:12px;letter-spacing:.12em;text-transform:uppercase;color:var(--faint);margin-bottom:8px}
.calc-big{font-family:var(--disp);font-weight:700;font-size:clamp(40px,6vw,60px);line-height:1;color:var(--signal);margin-bottom:6px}
.calc-sub{color:var(--dim);font-size:14px;margin-bottom:26px}
.calc-mini{display:grid;grid-template-columns:1fr 1fr;gap:1px;background:var(--rule);border:1px solid var(--rule);border-radius:6px;overflow:hidden}
.calc-mini div{background:var(--panel);padding:16px 18px}
.calc-mini .k{font-family:var(--mono);font-size:10px;letter-spacing:.1em;text-transform:uppercase;color:var(--faint);margin-bottom:6px}
.calc-mini .n{font-family:var(--mono);font-size:18px;color:var(--ink)}
.calc-note{margin-top:22px;font-family:var(--mono);font-size:11px;line-height:1.7;color:var(--faint)}

/* ===== signal report card (homepage method section) ===== */
.card{background:linear-gradient(180deg,#0C0F14,#090B0F);border:1px solid var(--rule);border-radius:8px;
  overflow:hidden;box-shadow:0 40px 80px -40px #000, 0 0 0 1px rgba(55,224,166,.04)}
.card-top{display:flex;justify-content:space-between;align-items:center;padding:18px 22px;
  border-bottom:1px solid var(--rule);background:rgba(255,255,255,.015)}
.card-asset{display:flex;align-items:center;gap:12px}
.card-asset .tk{font-family:var(--disp);font-weight:700;font-size:26px;text-transform:uppercase;letter-spacing:.01em}
.card-asset .side{font-family:var(--mono);font-size:12px;letter-spacing:.12em;text-transform:uppercase;
  padding:5px 11px;border-radius:6px;background:rgba(55,224,166,.14);color:var(--signal);border:1px solid rgba(55,224,166,.35)}
.card-tf{font-family:var(--mono);font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:var(--faint)}

/* Sample intelligence card (homepage, beside the signal card) */
.intel-card .ic-score{display:flex;gap:16px;align-items:center;padding:20px 22px;border-bottom:1px solid var(--rule)}
.intel-card .ic-badge{flex:0 0 auto;width:74px;height:74px;border-radius:10px;background:linear-gradient(180deg,rgba(34,197,94,.14),rgba(34,197,94,.04));border:1px solid rgba(34,197,94,.35);display:flex;flex-direction:column;align-items:center;justify-content:center}
.intel-card .ic-badge b{font-family:var(--disp);font-size:30px;font-weight:700;color:#22c55e;line-height:1}
.intel-card .ic-badge small{font-size:9px;letter-spacing:.1em;text-transform:uppercase;color:var(--faint);margin-top:3px}
.intel-card .ic-score p{margin:0;font-size:13.5px;line-height:1.55;color:var(--dim)}
.intel-card .ic-metrics{padding:18px 22px}
.intel-card .ic-row{display:grid;grid-template-columns:1fr 90px 30px;gap:10px;align-items:center;margin-bottom:14px}
.intel-card .ic-lbl{font-size:13px;color:var(--ink);font-weight:500}
.intel-card .ic-lbl em{display:block;font-style:normal;font-size:11px;color:var(--faint);margin-top:1px}
.intel-card .ic-bar{height:7px;background:#1a1e26;border-radius:5px;overflow:hidden}
.intel-card .ic-bar i{display:block;height:100%;border-radius:5px}
.intel-card .ic-val{font-family:var(--mono);font-size:14px;text-align:right;color:var(--ink)}
.intel-card .ic-social{font-size:12.5px;color:var(--dim);padding-top:12px;border-top:1px solid var(--rule);margin-top:4px}
.intel-card .ic-info{font-family:var(--mono);font-size:9px;letter-spacing:.1em;text-transform:uppercase;color:var(--faint);border:1px solid var(--rule);border-radius:4px;padding:2px 6px;margin-left:4px}
.intel-card .ic-note{margin:0;padding:0 22px 20px;font-size:11.5px;line-height:1.5;color:var(--faint)}

/* confidence score */
.card-conf{display:flex;align-items:center;gap:20px;padding:24px 22px;border-bottom:1px solid var(--rule-soft)}
.conf-dial{--v:78;position:relative;width:88px;height:88px;flex:none;border-radius:50%;
  background:conic-gradient(var(--signal) calc(var(--v)*1%),var(--rule-soft) 0);}
.conf-dial::after{content:"";position:absolute;inset:7px;border-radius:50%;background:#0A0C10}
.conf-dial .num{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;z-index:1}
.conf-dial .num b{font-family:var(--disp);font-weight:700;font-size:34px;line-height:.9;color:#fff}
.conf-dial .num small{font-family:var(--mono);font-size:9px;letter-spacing:.14em;text-transform:uppercase;color:var(--faint)}
.conf-label h4{font-family:var(--disp);text-transform:uppercase;font-size:22px;font-weight:600;margin:0 0 4px;color:var(--signal)}
.conf-label p{margin:0;color:var(--dim);font-size:14px;line-height:1.5;max-width:34ch}

/* level ladder */
.levels{padding:8px 22px 20px}
.lvl{display:grid;grid-template-columns:auto 1fr auto;gap:16px;align-items:center;padding:15px 0;border-bottom:1px solid var(--rule-soft)}
.lvl:last-child{border-bottom:0}
.lvl-tag{font-family:var(--mono);font-size:11px;letter-spacing:.1em;text-transform:uppercase;padding:6px 10px;border-radius:6px;
  white-space:nowrap;min-width:74px;text-align:center;font-weight:400}
.lvl-tag.entry{background:rgba(230,178,58,.14);color:var(--amber);border:1px solid rgba(230,178,58,.35)}
.lvl-tag.sl{background:rgba(224,96,58,.14);color:var(--alert);border:1px solid rgba(224,96,58,.4)}
.lvl-tag.tp{background:rgba(55,224,166,.12);color:var(--signal);border:1px solid rgba(55,224,166,.32)}
.lvl-name{font-family:var(--body);font-size:15px;color:var(--dim)}
.lvl-name b{color:var(--ink);font-weight:500;display:block;font-size:16px;margin-bottom:1px}
.lvl-price{font-family:var(--disp);font-weight:600;font-size:26px;letter-spacing:.01em;color:#fff;text-align:right;white-space:nowrap}
.lvl-price .r{display:block;font-family:var(--mono);font-size:11px;color:var(--faint);letter-spacing:.06em;font-weight:400;margin-top:2px}

/* leverage options */
.lev{padding:20px 22px;border-top:1px solid var(--rule);background:rgba(255,255,255,.012)}
.lev-cap{font-family:var(--mono);font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:var(--faint);margin-bottom:14px}
.lev-opts{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}
.lev-opt{border:1px solid var(--rule);border-radius:12px;padding:14px 12px;text-align:center;transition:border-color .15s}
.lev-opt.std{border-color:rgba(55,224,166,.4);background:rgba(55,224,166,.05)}
.lev-opt .x{font-family:var(--disp);font-weight:700;font-size:30px;line-height:1;color:#fff}
.lev-opt.std .x{color:var(--signal)}
.lev-opt .lb{font-family:var(--mono);font-size:10px;letter-spacing:.1em;text-transform:uppercase;color:var(--dim);margin-top:6px}
.lev-opt .rk{font-family:var(--mono);font-size:10px;color:var(--faint);margin-top:3px}
@media (max-width:480px){
  .conf-dial{width:72px;height:72px}.conf-dial .num b{font-size:28px}
  .lvl-price{font-size:22px}.lev-opt .x{font-size:24px}
  .card-asset .tk{font-size:22px}
}


/* ===== HERO IMAGE VARIANTS ===== */
/* Shared: a --hero-img variable so you swap one line to change the photo. */
:root{--hero-img:url("/hero.jpg");}

/* VARIANT A — full-width text, metrics row underneath, woman as atmospheric backdrop */
.hero.bg-image{
  position:relative;
  padding:72px 0 56px;
  overflow:hidden;
}
.hero.bg-image .photo{
  position:absolute;inset:0;z-index:0;
  background-image:var(--hero-img);
  background-size:cover;
  /* push image up so her head sits higher on the page */
  background-position:78% -40px;
  opacity:.92;
}
/* Lighter wash — closer to original brightness, still readable on the left */
.hero.bg-image::after{
  content:"";position:absolute;inset:0;z-index:1;pointer-events:none;
  background:
    linear-gradient(90deg, rgba(7,8,10,0.88) 0%, rgba(7,8,10,0.55) 28%, rgba(7,8,10,0.22) 52%, rgba(7,8,10,0.06) 72%, transparent 100%),
    linear-gradient(180deg, rgba(7,8,10,0.15) 0%, transparent 35%, transparent 65%, rgba(7,8,10,0.55) 100%),
    radial-gradient(ellipse 50% 55% at 80% 18%, rgba(55,224,166,0.12), transparent 60%);
}
.hero.bg-image .wrap{
  position:relative;z-index:2;
  display:flex;
  flex-direction:column;
  gap:36px;
}
.hero.bg-image .inner{
  /* shared column — headline + paragraphs the same width */
  max-width: min(100%, 42rem);
  width:100%;
  position:relative;
  z-index:3;
}
.hero.bg-image h1{
  max-width:100%;
  font-size:clamp(48px, 7.5vw, 88px);
}
.hero.bg-image .hero-lede{
  max-width:100%;
  font-size:clamp(17px, 1.6vw, 20px);
  margin-bottom:14px;
}
.hero.bg-image .hero-lede + .hero-lede{
  margin-top:0 !important;
  margin-bottom:28px;
}
.hero.bg-image .hero-actions{margin-bottom:0}
.hero.bg-image .grid-bg{opacity:.08}

@media (max-width:760px){
  .hero.bg-image{padding:56px 0 40px}
  .hero.bg-image .photo{background-position:80% -20px; opacity:.55}
  .hero.bg-image::after{
    background:
      linear-gradient(180deg, rgba(7,8,10,0.75) 0%, rgba(7,8,10,0.9) 100%);
  }
  .hero.bg-image h1{max-width:100%}
  .hero.bg-image .hero-lede{max-width:100%}
}

/* VARIANT B — contained image panel beside the copy */
.hero.split .wrap{display:grid;grid-template-columns:1.05fr .95fr;gap:52px;align-items:center}
.hero.split .hero-photo{border-radius:16px;overflow:hidden;border:2px solid var(--rule);
  aspect-ratio:4/3;background-image:var(--hero-img);background-size:cover;background-position:center;
  box-shadow:0 40px 80px -40px #000;position:relative}
.hero.split .hero-photo::after{content:"";position:absolute;inset:0;
  background:linear-gradient(180deg,transparent 55%,rgba(7,8,10,.5));mix-blend-mode:multiply}
@media (max-width:820px){
  .hero.split .wrap{grid-template-columns:1fr;gap:32px}
  .hero.split .hero-photo{aspect-ratio:16/10}
}


/* ===== real PTL logo in nav ===== */
.brand .ptl-logo{width:30px;height:30px;flex:none;filter:drop-shadow(0 0 6px rgba(16,185,129,.35));}
.brand{gap:12px}
.page-hero .brand,.hero .brand{}

/* ============================================================
   CONCEPT 2 v3 — REAL GLASS (white edge + chart backdrop)
   ============================================================ */

:root{
  --glass-fill: rgba(16, 28, 32, 0.55);
  --glass-edge: rgba(220, 255, 245, 0.55);
  --glass-edge-dim: rgba(180, 240, 220, 0.18);
  --glass-border: rgba(55, 224, 166, 0.5);
  --glass-glow: rgba(55, 224, 166, 0.4);
}

body{
  background:
    radial-gradient(ellipse 100% 55% at 10% -5%, rgba(55,224,166,0.12), transparent 50%),
    radial-gradient(ellipse 80% 45% at 95% 0%, rgba(55,224,166,0.07), transparent 45%),
    #07080A !important;
}

/* Chart grid pattern used behind glass panels */
.chart-bg, .story, .card, .pillar, .tier, .intel, .brick-viz, .hero-metric{
  position: relative;
  isolation: isolate;
}
.story::before, .card::before, .pillar::before, .tier::before, .intel::before, .brick-viz::before, .hero-metric::before{
  content: "";
  position: absolute;
  inset: 0;
  border-radius: inherit;
  z-index: -1;
  opacity: 0.35;
  pointer-events: none;
  background-image:
    linear-gradient(rgba(55,224,166,0.07) 1px, transparent 1px),
    linear-gradient(90deg, rgba(55,224,166,0.07) 1px, transparent 1px),
    linear-gradient(180deg, transparent 60%, rgba(55,224,166,0.08));
  background-size: 28px 28px, 28px 28px, 100% 100%;
}

/* Real glass panel recipe — white top edge is the key */
.glass-panel,
.story, .card, .pillar, .tier, .intel, .brick-viz, .receipt, .trust, .hero-metric{
  background:
    linear-gradient(165deg, rgba(55,224,166,0.10) 0%, rgba(12,20,24,0.72) 40%, rgba(8,12,16,0.88) 100%) !important;
  backdrop-filter: blur(18px) saturate(1.25) !important;
  -webkit-backdrop-filter: blur(18px) saturate(1.25) !important;
  border: 1px solid var(--glass-border) !important;
  border-top-color: var(--glass-edge) !important;
  border-left-color: rgba(220,255,245,0.28) !important;
  border-radius: 18px !important;
  box-shadow:
    /* outer depth */
    0 24px 50px -16px rgba(0,0,0,0.75),
    0 0 40px -12px var(--glass-glow),
    /* WHITE glass edge highlight */
    inset 0 1px 0 0 rgba(255,255,255,0.45),
    inset 1px 0 0 0 rgba(255,255,255,0.12),
    inset 0 -1px 0 0 rgba(0,0,0,0.35),
    inset 0 0 40px rgba(55,224,166,0.05) !important;
}

.story:hover, .card:hover, .pillar:hover, .tier:hover, .hero-metric:hover{
  border-color: rgba(55,224,166,0.75) !important;
  border-top-color: rgba(255,255,255,0.7) !important;
  transform: translateY(-4px) !important;
  box-shadow:
    0 32px 60px -12px rgba(0,0,0,0.7),
    0 0 56px -8px var(--glass-glow),
    inset 0 1px 0 0 rgba(255,255,255,0.55),
    inset 1px 0 0 0 rgba(255,255,255,0.18),
    inset 0 0 48px rgba(55,224,166,0.08) !important;
}

.tier.feature{
  border-color: #37E0A6 !important;
  border-top-color: rgba(255,255,255,0.65) !important;
  background: linear-gradient(165deg, rgba(55,224,166,0.22), rgba(10,18,20,0.9)) !important;
  box-shadow:
    0 0 0 1px #37E0A6,
    0 28px 60px -14px var(--glass-glow),
    0 0 60px -6px rgba(55,224,166,0.5),
    inset 0 1px 0 0 rgba(255,255,255,0.5),
    inset 1px 0 0 0 rgba(255,255,255,0.15) !important;
}

/* Nav glass */
nav{
  background: rgba(8,12,16,0.65) !important;
  backdrop-filter: blur(22px) saturate(1.3) !important;
  -webkit-backdrop-filter: blur(22px) saturate(1.3) !important;
  border-bottom: 1px solid var(--glass-border) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,0.12), 0 12px 40px rgba(0,0,0,0.45) !important;
}

/* Hero metrics — full-width horizontal row UNDER the text */
.hero-metrics{
  display: grid !important;
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  gap: 18px !important;
  position: relative !important;
  width: 100% !important;
  max-width: 100% !important;
  margin: 0 !important;
  z-index: 4 !important;
  top: auto !important;
  right: auto !important;
}
@media (max-width:760px){
  .hero-metrics{
    grid-template-columns: 1fr !important;
    gap: 14px !important;
  }
}

.hero-metric{
  padding: 28px 26px 26px 26px !important;
  box-sizing: border-box !important;
  width: 100% !important;
  min-height: 148px !important;
}

.hero-metric .hm-label{
  font-family: var(--mono) !important;
  font-size: 12px !important;
  letter-spacing: .18em !important;
  text-transform: uppercase !important;
  color: #37E0A6 !important;
  margin: 0 0 12px 0 !important;
}
.hero-metric .hm-title{
  font-family: var(--disp) !important;
  font-size: 28px !important;
  font-weight: 700 !important;
  text-transform: uppercase !important;
  color: #fff !important;
  margin: 0 0 12px 0 !important;
  letter-spacing: .02em !important;
}
.hero-metric .hm-desc{
  font-size: 16px !important;
  color: #b0bac4 !important;
  margin: 0 !important;
  line-height: 1.5 !important;
}

.btn-primary{ box-shadow: 0 0 28px var(--glass-glow), 0 8px 24px rgba(0,0,0,.35) !important; }
.btn-ghost{
  background: rgba(16,28,32,0.55) !important;
  backdrop-filter: blur(12px) !important;
  border: 1px solid var(--glass-border) !important;
  border-top-color: rgba(255,255,255,0.35) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,0.2) !important;
}

/* hero atmosphere handled in VARIANT A */