:root{
  --bg:#0b0d10;
  --bg-elev:#13171b;
  --bg-elev-2:#181d22;
  --ink:#f4f1ed;
  --ink-mute:#b3bcc5;       /* bumped from #a4adb6 for AA */
  --ink-faint:#8a929c;      /* bumped from #6c757f for AA */
  --brass:#b8732e;
  --brass-light:#f0c987;
  --brass-deep:#8a5a23;
  --rule:#23282e;
  --rule-strong:#2c3239;
  --radius:14px;
  --radius-lg:18px;
  --maxw:1080px;
  --shadow-card:0 1px 0 rgba(255,255,255,.02) inset, 0 12px 32px -16px rgba(0,0,0,.6);
  --shadow-device:0 30px 80px -20px rgba(0,0,0,.7), 0 8px 24px -8px rgba(184,115,46,.15);
}

*{box-sizing:border-box}
html,body{margin:0;padding:0}
html{scroll-behavior:smooth}
body{
  background:
    radial-gradient(1100px 600px at 80% -10%, rgba(184,115,46,.08), transparent 60%),
    radial-gradient(900px 500px at -10% 30%, rgba(240,201,135,.04), transparent 55%),
    var(--bg);
  color:var(--ink);
  font:16px/1.6 -apple-system,BlinkMacSystemFont,"SF Pro Text","Segoe UI",system-ui,sans-serif;
  -webkit-font-smoothing:antialiased;
  text-rendering:optimizeLegibility;
}
img,svg{max-width:100%}
a{color:var(--brass-light);text-decoration:none}
a:hover{text-decoration:underline}

/* a11y focus ring */
:focus-visible{
  outline:2px solid var(--brass-light);
  outline-offset:3px;
  border-radius:6px;
}

.skip{position:absolute;left:-999px;top:0;background:#000;color:#fff;padding:.5rem 1rem}
.skip:focus{left:1rem;top:1rem;z-index:10}

/* nav */
.nav{
  display:flex;align-items:center;justify-content:space-between;
  max-width:var(--maxw);margin:0 auto;padding:1.25rem 1.5rem;
}
.brand{display:flex;align-items:center;gap:.65rem;color:var(--ink);font-weight:600}
.brand:hover{text-decoration:none}
.brand-logo{flex-shrink:0;display:block}
.brand-name{font-size:1.05rem;letter-spacing:-.01em}
.nav nav a{
  color:var(--ink-mute);
  margin-left:1.25rem;
  font-size:14px;
}
.nav nav a:hover{color:var(--ink);text-decoration:none}

/* hero */
.hero{
  max-width:var(--maxw);margin:0 auto;padding:3rem 1.5rem 2.5rem;
  display:grid;
  grid-template-columns:1.15fr .85fr;
  gap:2.5rem;
  align-items:center;
}
.hero-copy{text-align:left}
.kicker{
  text-transform:uppercase;letter-spacing:.18em;font-size:11px;
  color:var(--brass-light);margin:0 0 1rem;font-weight:600;
}
.kicker-sm{
  text-transform:uppercase;letter-spacing:.16em;font-size:10px;
  color:var(--brass-light);margin:0 0 .6rem;font-weight:600;
}
h1{
  font:700 clamp(2.4rem,5.6vw,3.8rem)/1.04 -apple-system,BlinkMacSystemFont,"SF Pro Display",system-ui,sans-serif;
  margin:0 0 .65rem;letter-spacing:-.025em;text-wrap:balance;
}
.sub{
  margin:0 0 1.4rem;color:var(--brass-light);
  font:500 clamp(1.05rem,1.6vw,1.2rem)/1.4 -apple-system,BlinkMacSystemFont,"SF Pro Text",system-ui,sans-serif;
  letter-spacing:-.005em;
}
.lede{
  max-width:560px;margin:0 0 1.75rem;color:var(--ink-mute);font-size:1.05rem;
  text-wrap:pretty;line-height:1.6;
}
.cta-row{display:flex;align-items:center;gap:1rem;flex-wrap:wrap}
.btn-primary{
  display:inline-flex;align-items:center;gap:.6rem;
  padding:.85rem 1.3rem;border-radius:999px;
  background:linear-gradient(135deg,#c98e3f 0%,#8a5a23 100%);
  color:#1a0e02;
  font-weight:700;font-size:.95rem;letter-spacing:-.005em;
  border:1px solid rgba(240,201,135,.4);
  box-shadow:0 8px 22px -10px rgba(184,115,46,.6), inset 0 1px 0 rgba(255,255,255,.18);
  transition:transform .15s ease, box-shadow .2s ease;
}
.btn-primary:hover{
  transform:translateY(-1px);
  text-decoration:none;
  box-shadow:0 12px 28px -10px rgba(184,115,46,.75), inset 0 1px 0 rgba(255,255,255,.22);
}
.btn-primary svg{display:block;color:#1a0e02}
.cta-note{color:var(--ink-mute);font-size:.92rem}

/* hero device mockup */
.hero-device{
  position:relative;
  display:flex;justify-content:center;align-items:center;
  perspective:1200px;
}
.device-shell{
  position:relative;
  width:280px;height:570px;
  background:linear-gradient(155deg,#1a1f24 0%,#0d1115 100%);
  border:1px solid #2a3037;
  border-radius:42px;
  padding:9px;
  box-shadow:var(--shadow-device);
  transform:rotate(-2.5deg);
}
.device-notch{
  position:absolute;
  top:18px;left:50%;transform:translateX(-50%);
  width:90px;height:24px;
  background:#000;
  border-radius:14px;
  z-index:2;
}
.device-screen{
  width:100%;height:100%;
  background:linear-gradient(180deg,#0b0d10 0%,#13171b 100%);
  border-radius:34px;
  overflow:hidden;
  display:flex;flex-direction:column;
  position:relative;
}
.device-status{
  display:flex;justify-content:space-between;align-items:center;
  padding:14px 28px 6px;
  font-size:11px;font-weight:600;color:var(--ink);
  letter-spacing:.02em;
}
.device-status-right{display:inline-flex;align-items:center;gap:5px}
.device-title{
  padding:14px 18px 4px;
  font:700 1.6rem/1 -apple-system,BlinkMacSystemFont,"SF Pro Display",system-ui,sans-serif;
  letter-spacing:-.02em;color:var(--ink);
}
.device-search{
  margin:6px 18px 10px;
  padding:6px 10px;
  background:rgba(255,255,255,.06);
  border-radius:8px;
  font-size:12px;
  color:var(--ink-faint);
  display:flex;align-items:center;gap:6px;
}
.device-list{
  list-style:none;margin:0;padding:0 8px;
  display:flex;flex-direction:column;gap:2px;
  flex:1;overflow:hidden;
}
.device-list li{
  display:flex;align-items:center;gap:10px;
  padding:8px 10px;border-radius:10px;
}
.device-list li:hover{background:rgba(255,255,255,.03)}
.dl-icon{
  flex-shrink:0;width:32px;height:32px;
  display:grid;place-items:center;
  background:rgba(184,115,46,.1);
  border:1px solid rgba(184,115,46,.25);
  border-radius:8px;
}
.dl-body{flex:1;min-width:0}
.dl-title{
  font-size:12.5px;font-weight:600;color:var(--ink);
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis;
  letter-spacing:-.01em;
}
.dl-sub{
  font-size:10.5px;color:var(--ink-mute);
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis;
  margin-top:1px;
}
.dl-meta{
  flex-shrink:0;font-size:11px;font-weight:600;
  color:var(--ink-mute);
}
.dl-fav{color:var(--brass-light);font-size:13px}
.dl-meta-mute{color:var(--ink-faint)}
.device-tabbar{
  display:flex;justify-content:space-around;
  padding:10px 8px 18px;
  border-top:1px solid rgba(255,255,255,.05);
  font-size:10px;color:var(--ink-faint);font-weight:600;
}
.device-tabbar .active{color:var(--brass-light)}

/* promise band */
.promise{
  max-width:var(--maxw);margin:1.5rem auto 1rem;padding:0 1.5rem;
}
.promise-grid{
  background:var(--bg-elev);
  border:1px solid var(--rule);
  border-radius:var(--radius-lg);
  padding:2rem 2.25rem;
  display:grid;gap:2rem;
  grid-template-columns:1.4fr 1fr;
  align-items:start;
  box-shadow:var(--shadow-card);
}
.promise-grid h2{
  font:700 1.55rem/1.2 -apple-system,BlinkMacSystemFont,"SF Pro Display",system-ui,sans-serif;
  margin:0 0 .9rem;letter-spacing:-.02em;text-wrap:balance;
}
.promise-grid p{margin:0 0 .8rem;color:var(--ink-mute);font-size:1rem;line-height:1.65}
.promise-stack{list-style:none;margin:0;padding:0;display:grid;gap:.65rem}
.promise-stack li{
  background:var(--bg-elev-2);
  border:1px solid var(--rule);
  border-radius:10px;
  padding:.75rem .95rem;
  display:flex;align-items:baseline;justify-content:space-between;gap:.8rem;
}
.promise-stack span{color:var(--brass-light);font-weight:700;font-size:.95rem;flex-shrink:0;letter-spacing:-.005em}
.promise-stack em{color:var(--ink-mute);font-style:normal;font-size:.9rem;text-align:right}

/* features */
.features{max-width:var(--maxw);margin:0 auto;padding:3.5rem 1.5rem 1rem}
.features h2{
  font:700 1.7rem/1.2 -apple-system,BlinkMacSystemFont,"SF Pro Display",system-ui,sans-serif;
  margin:0 0 1.75rem;letter-spacing:-.02em;
}
.grid{
  list-style:none;padding:0;margin:0;
  display:grid;gap:1rem;
  grid-template-columns:repeat(auto-fit,minmax(280px,1fr));
}
.grid li{
  position:relative;
  background:var(--bg-elev);
  border:1px solid var(--rule);
  border-radius:var(--radius);
  padding:1.4rem 1.4rem 1.3rem;
  overflow:hidden;
  box-shadow:var(--shadow-card);
}
.grid li::before{
  content:"";position:absolute;top:0;left:0;right:0;height:1px;
  background:linear-gradient(90deg,transparent 0%,var(--brass) 30%,var(--brass-light) 50%,var(--brass) 70%,transparent 100%);
  opacity:.5;
}
.grid h3{
  margin:.7rem 0 .4rem;font-size:1.02rem;color:var(--ink);
  letter-spacing:-.005em;font-weight:600;
}
.grid p{margin:0;color:var(--ink-mute);font-size:.95rem;line-height:1.6}
.feat-icon{
  display:inline-grid;place-items:center;
  width:38px;height:38px;border-radius:10px;
  background:linear-gradient(135deg,rgba(184,115,46,.18) 0%,rgba(240,201,135,.06) 100%);
  border:1px solid rgba(184,115,46,.4);
  color:var(--brass-light);
}

/* value stack */
.stack{
  max-width:var(--maxw);margin:3.5rem auto 1rem;padding:0 1.5rem;
}
.stack h2{
  font:700 1.7rem/1.2 -apple-system,BlinkMacSystemFont,"SF Pro Display",system-ui,sans-serif;
  margin:0 0 .35rem;letter-spacing:-.02em;
}
.stack-lede{margin:0 0 1.4rem;color:var(--ink-mute);font-size:1rem}
.stack-list{
  list-style:none;margin:0;padding:1.25rem 1.5rem;
  background:var(--bg-elev);
  border:1px solid var(--rule);
  border-radius:var(--radius);
  box-shadow:var(--shadow-card);
}
.stack-list li{
  display:flex;align-items:baseline;justify-content:space-between;gap:.8rem;
  padding:.55rem 0;
  font-size:.97rem;
  border-bottom:1px dashed var(--rule);
}
.stack-list li:last-child{border-bottom:none}
.stack-name{color:var(--ink);font-weight:500}
.stack-val{color:var(--brass-light);font-weight:600;flex-shrink:0;font-size:.92rem;letter-spacing:.01em}
.stack-total{
  margin-top:1.1rem;padding:1.4rem 1.5rem;
  background:linear-gradient(135deg,var(--bg-elev-2) 0%,var(--bg-elev) 100%);
  border:1px solid var(--brass-deep);
  border-radius:var(--radius);
  text-align:center;
}
.stack-total p{margin:.25rem 0;color:var(--ink-mute);font-size:.95rem}
.stack-total-val{color:var(--ink);font-weight:600;font-size:1.05rem}
.stack-price{color:var(--ink);margin-top:.7rem;font-size:1.05rem}
.stack-price strong{color:var(--brass-light)}

/* who it's for */
.who{max-width:var(--maxw);margin:3.5rem auto 1rem;padding:0 1.5rem}
.who h2{
  font:700 1.7rem/1.2 -apple-system,BlinkMacSystemFont,"SF Pro Display",system-ui,sans-serif;
  margin:0 0 1.4rem;letter-spacing:-.02em;
}
.who-grid{display:grid;gap:1rem;grid-template-columns:repeat(auto-fit,minmax(260px,1fr))}
.who-grid > div{
  position:relative;
  background:var(--bg-elev);
  border:1px solid var(--rule);
  border-radius:var(--radius);
  padding:1.4rem 1.4rem;
  overflow:hidden;
  box-shadow:var(--shadow-card);
}
.who-grid > div::before{
  content:"";position:absolute;top:0;left:0;right:0;height:1px;
  background:linear-gradient(90deg,transparent 0%,var(--brass) 50%,transparent 100%);
  opacity:.4;
}
.who-grid h3{margin:0 0 .55rem;font-size:1.02rem;color:var(--ink);font-weight:600;letter-spacing:-.005em}
.who-grid p{margin:0;color:var(--ink-mute);font-size:.95rem;line-height:1.6}

/* faq */
.faq{max-width:var(--maxw);margin:3.5rem auto 1rem;padding:0 1.5rem}
.faq h2{
  font:700 1.7rem/1.2 -apple-system,BlinkMacSystemFont,"SF Pro Display",system-ui,sans-serif;
  margin:0 0 1.4rem;letter-spacing:-.02em;
}
.faq-grid{display:grid;gap:1rem;grid-template-columns:repeat(2,1fr)}
.faq-grid > div{
  background:var(--bg-elev);
  border:1px solid var(--rule);
  border-radius:var(--radius);
  padding:1.25rem 1.35rem;
  box-shadow:var(--shadow-card);
}
.faq-grid h3{margin:0 0 .5rem;font-size:1rem;color:var(--ink);font-weight:600;letter-spacing:-.005em}
.faq-grid p{margin:0;color:var(--ink-mute);font-size:.94rem;line-height:1.6}

/* closing CTA */
.cta-final{
  max-width:var(--maxw);margin:4rem auto 1rem;padding:0 1.5rem;
}
.cta-final-inner{
  background:
    radial-gradient(800px 300px at 50% 0%, rgba(184,115,46,.18), transparent 70%),
    var(--bg-elev);
  border:1px solid var(--brass-deep);
  border-radius:var(--radius-lg);
  padding:3rem 2rem;
  text-align:center;
  box-shadow:var(--shadow-card);
}
.cta-final-inner h2{
  font:700 clamp(1.7rem,3vw,2.2rem)/1.15 -apple-system,BlinkMacSystemFont,"SF Pro Display",system-ui,sans-serif;
  margin:0 0 .85rem;letter-spacing:-.025em;text-wrap:balance;
}
.cta-final-inner p{
  max-width:520px;margin:0 auto 1.5rem;
  color:var(--ink-mute);font-size:1.02rem;line-height:1.6;
}
.cta-final-inner .btn-primary{margin:0 auto}
.cta-final-note{
  margin-top:1rem !important;
  font-size:.88rem !important;
  color:var(--ink-faint) !important;
}

/* legal cards */
.legal-cards{
  max-width:var(--maxw);margin:3rem auto 1rem;padding:0 1.5rem;
  display:grid;gap:.75rem;
  grid-template-columns:repeat(auto-fit,minmax(220px,1fr));
}
.legal-card{
  display:block;background:var(--bg-elev);border:1px solid var(--rule);
  border-radius:var(--radius);padding:1.1rem 1.2rem;color:var(--ink);
}
.legal-card:hover{border-color:var(--brass);text-decoration:none}
.legal-card h3{margin:0 0 .3rem;font-size:.97rem;color:var(--brass-light);font-weight:600}
.legal-card p{margin:0;color:var(--ink-mute);font-size:.87rem}

/* footer */
footer{
  max-width:var(--maxw);margin:4rem auto 2rem;padding:1.75rem 1.5rem;
  border-top:1px solid var(--rule);
  text-align:center;color:var(--ink-mute);font-size:.88rem;
}
footer p{margin:.25rem 0}

/* legal page (markdown rendered) */
.doc{
  max-width:760px;margin:1rem auto 4rem;padding:1rem 1.5rem;
}
.doc h1{font-size:2rem;margin:1.5rem 0 1rem}
.doc h2{font-size:1.25rem;margin:2rem 0 .5rem;color:var(--brass-light);border-bottom:1px solid var(--rule);padding-bottom:.4rem}
.doc h3{font-size:1.05rem;margin:1.5rem 0 .5rem}
.doc p,.doc li{color:var(--ink);line-height:1.65}
.doc ul,.doc ol{padding-left:1.4rem}
.doc code{background:#1c2228;padding:.1em .35em;border-radius:5px;font-size:.92em}
.doc pre{background:#1c2228;padding:.9rem 1rem;border-radius:9px;overflow-x:auto}
.doc table{border-collapse:collapse;width:100%;margin:1rem 0}
.doc th,.doc td{border:1px solid var(--rule);padding:.45rem .65rem;text-align:left;font-size:.92rem}
.doc th{background:#1c2228}
.doc blockquote{
  border-left:3px solid var(--brass);
  margin:1rem 0;padding:.5rem 1rem;color:var(--ink-mute);
  background:#13171b;border-radius:0 9px 9px 0;
}
.doc a{color:var(--brass-light)}
.doc hr{border:none;border-top:1px solid var(--rule);margin:2rem 0}

/* hover transitions */
@media (prefers-reduced-motion: no-preference){
  .grid li,.legal-card,.who-grid > div,.faq-grid > div{transition:transform .18s ease,border-color .18s ease}
  .grid li:hover,.legal-card:hover,.who-grid > div:hover,.faq-grid > div:hover{transform:translateY(-2px);border-color:var(--rule-strong)}
  .device-shell{transition:transform .4s cubic-bezier(.2,.8,.2,1)}
  .hero:hover .device-shell{transform:rotate(-1deg) translateY(-4px)}
}

/* tablet */
@media (max-width:920px){
  .hero{
    grid-template-columns:1fr;
    text-align:center;
    padding:2.5rem 1.5rem 2rem;
    gap:2rem;
  }
  .hero-copy{text-align:center}
  .lede{margin-left:auto;margin-right:auto}
  .cta-row{justify-content:center}
  .device-shell{transform:rotate(-1.5deg) scale(.92)}
  .promise-grid{grid-template-columns:1fr;padding:1.75rem 1.6rem}
  .faq-grid{grid-template-columns:1fr}
}

/* mobile */
@media (max-width:600px){
  .nav{padding:1rem 1.25rem}
  .nav nav a{margin-left:.85rem;font-size:13px}
  .hero{padding:2rem 1.25rem 1.5rem}
  h1{font-size:clamp(2rem,9vw,2.6rem)}
  .lede{font-size:1rem}
  .cta-note{font-size:.85rem}
  .promise-grid{padding:1.4rem 1.25rem}
  .features,.stack,.who,.faq,.cta-final{padding-left:1.25rem;padding-right:1.25rem}
  .stack-list{padding:1rem 1.1rem}
  .stack-list li{flex-wrap:wrap}
  .cta-final-inner{padding:2.25rem 1.25rem}
  .device-shell{width:240px;height:490px}
}