@font-face{font-family:Archivo;src:url('/fonts/archivo-700.woff2') format('woff2');font-weight:700;font-style:normal;font-display:swap}
@font-face{font-family:Archivo;src:url('/fonts/archivo-800.woff2') format('woff2');font-weight:800;font-style:normal;font-display:swap}
@font-face{font-family:'Instrument Sans';src:url('/fonts/instrument-400.woff2') format('woff2');font-weight:400;font-style:normal;font-display:swap}
@font-face{font-family:'Instrument Sans';src:url('/fonts/instrument-500.woff2') format('woff2');font-weight:500;font-style:normal;font-display:swap}
@font-face{font-family:'Instrument Sans';src:url('/fonts/instrument-600.woff2') format('woff2');font-weight:600;font-style:normal;font-display:swap}
@font-face{font-family:'JetBrains Mono';src:url('/fonts/jetbrains-400.woff2') format('woff2');font-weight:400;font-style:normal;font-display:swap}

:root{
  --paper:#dad9ca;
  --tile:#e6e5d8;
  --tile-2:#efeee4;
  --ink:#0e0e0c;
  --on-ink:#f1f0e6;
  --muted:#5e5d50;
  --dim:#74735f;
  --hairline:#c9c8b8;
  --accent:#e5171b;
  --ok:#1f7a4a;
  --r-tile:20px;
  --r-input:12px;
  --r-pill:999px;
  --r-chip:10px;
  --max:1200px;
  --ease:cubic-bezier(.2,0,0,1);
}

:root[data-theme=dark]{
  --paper:#111110;
  --tile:#1b1b19;
  --tile-2:#232321;
  --ink:#f1f0e6;
  --on-ink:#111110;
  --muted:#a7a693;
  --dim:#77766a;
  --hairline:#2e2e2b;
  --ok:#5fc08c;
}

*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  margin:0;
  background:var(--paper);
  color:var(--ink);
  font:400 16px/1.45 'Instrument Sans',-apple-system,BlinkMacSystemFont,sans-serif;
  overflow-x:hidden;
}

a{color:inherit;text-decoration:none}
button{font:inherit;color:inherit;border:0;cursor:pointer}
a:focus-visible,button:focus-visible{outline:2px solid var(--ink);outline-offset:3px}

.shell{width:min(calc(100% - 64px),var(--max));margin-inline:auto}
.skip-link{position:absolute;left:16px;top:16px;transform:translateY(-150%);background:var(--ink);color:var(--on-ink);padding:8px 12px;border-radius:var(--r-pill);z-index:10}.skip-link:focus{transform:none}

/* Header */
.site-header{
  display:flex;
  justify-content:space-between;
  align-items:center;
  min-height:80px;
  border-bottom:1px solid var(--hairline);
}
.wordmark{font:700 24px/1 Archivo,sans-serif;letter-spacing:-.03em}
.wordmark span{color:var(--accent)}
nav{display:flex;gap:28px;font-size:14px;color:var(--muted);align-items:center}
nav a:hover,.text-link:hover{color:var(--dim);text-decoration:underline;text-underline-offset:4px}
.header-actions{display:flex;gap:16px;align-items:center}
.theme-toggle{background:none;display:flex;align-items:center;color:var(--muted);font-size:18px}

/* Hero */
.hero{
  display:grid;
  grid-template-columns:1fr 1.1fr;
  gap:48px;
  align-items:center;
  min-height:640px;
  padding-block:72px;
}
.eyebrow{margin:0 0 16px;color:var(--muted);font:500 12px/1.2 'Instrument Sans',sans-serif;letter-spacing:.03em}
.status-dot{display:inline-block;width:8px;height:8px;border-radius:50%;background:var(--accent);margin-right:7px}
h1,h2,h3,p{margin-top:0}
h1,h2,h3{font-family:Archivo,sans-serif}
h1{
  font-size:clamp(52px,6.5vw,90px);
  line-height:.92;
  letter-spacing:-.045em;
  margin-bottom:24px;
}
h1 span,h2 span{color:var(--dim)}
.hero-lede{font-size:19px;line-height:1.4;color:var(--muted);margin-bottom:28px;max-width:520px}
.hero-actions{display:flex;align-items:center;gap:16px;flex-wrap:wrap}

/* Buttons */
.button{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:10px;
  min-height:46px;
  padding:12px 22px;
  border-radius:var(--r-pill);
  font-weight:600;
  transition:transform 180ms var(--ease),background 180ms var(--ease);
}
.button:hover{transform:translateY(-2px)}
.button-dark{background:var(--ink);color:var(--on-ink)}
.button-secondary{background:var(--tile);color:var(--ink)}
.button-small{min-height:36px;padding:8px 16px;font-size:13px}
.text-link{font-size:14px;text-decoration:underline;text-underline-offset:4px}
.microcopy{color:var(--muted);font-size:13px;margin-top:36px;max-width:480px}
.check{color:var(--ok);font-weight:600;margin-right:6px}

/* Screenshot Hero */
.hero-visual{position:relative}
.app-screenshot{
  width:100%;
  height:auto;
  display:block;
  border-radius:var(--r-tile);
  border:1px solid var(--hairline);
  box-shadow:0 12px 36px rgba(0,0,0,0.06);
}

/* Signal Strip */
.signal-strip{background:var(--ink);color:var(--on-ink);padding:34px 0}
.signal-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:40px}
.signal-grid>div{display:grid;grid-template-columns:auto 1fr;column-gap:14px}
.signal-number{grid-row:span 2;color:var(--accent);font:400 13px/1 'JetBrains Mono',monospace;padding-top:3px}
.signal-grid strong{font:700 17px/1.1 Archivo,sans-serif}
.signal-grid p{grid-column:2;color:#b5b4a9;font-size:14px;margin:8px 0 0}

/* Section */
.section{padding-block:100px}
.section-intro{max-width:620px;margin-bottom:48px}
.section-intro h2{font-size:clamp(36px,4.5vw,56px);line-height:1;letter-spacing:-.035em;margin-bottom:18px}
.section-intro>p:last-child{color:var(--muted);font-size:17px}

/* Workflow Cards */
.workflow-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}
.workflow-card{
  background:var(--tile);
  border-radius:var(--r-tile);
  padding:28px;
  min-height:280px;
  display:flex;
  flex-direction:column;
  position:relative;
}
.workflow-card-ink{background:var(--ink);color:var(--on-ink)}
.card-index{font:400 12px/1 'JetBrains Mono',monospace;color:var(--muted);margin-bottom:24px}
.workflow-card-ink .card-index{color:#aaa99c}
.workflow-card h3{font-size:24px;margin-bottom:12px;letter-spacing:-.02em}
.workflow-card p{color:var(--muted);font-size:15px;line-height:1.45}
.workflow-card-ink p{color:#b5b4a9}
.card-note{margin-top:auto;font:400 11px/1 'JetBrains Mono',monospace;color:var(--muted);padding-top:20px}
.workflow-card-ink .card-note{color:#aaa99c}

/* Split Snaps Section */
.split-section{display:grid;grid-template-columns:1fr 1fr;gap:64px;align-items:center}
.split-copy h2{font-size:clamp(36px,4.5vw,56px);line-height:1;letter-spacing:-.035em;margin-bottom:20px}
.split-copy p{color:var(--muted);font-size:17px;line-height:1.45;margin-bottom:28px}

/* Pricing Grid */
.pricing-grid{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:24px;
  align-items:stretch;
  margin-top:40px;
}
.pricing-card{
  background:var(--tile);
  border-radius:var(--r-tile);
  padding:36px 32px;
  display:flex;
  flex-direction:column;
  position:relative;
}
.pricing-card-featured{
  background:var(--tile-2);
  border:2px solid var(--ink);
}
.badge-featured{
  position:absolute;
  top:-14px;
  right:28px;
  background:var(--ink);
  color:var(--on-ink);
  padding:4px 12px;
  border-radius:var(--r-pill);
  font:600 11px/1 'JetBrains Mono',monospace;
  text-transform:uppercase;
  letter-spacing:.05em;
}
.pricing-header h3{font-size:24px;margin-bottom:8px}
.pricing-desc{color:var(--muted);font-size:14px;margin-bottom:24px;min-height:40px}
.price-display{display:flex;align-items:baseline;gap:8px;margin-bottom:28px;padding-bottom:24px;border-bottom:1px solid var(--hairline)}
.price-num{font:800 48px/1 Archivo,sans-serif;color:var(--ink);letter-spacing:-.03em}
.price-sub{font:500 13px/1 'JetBrains Mono',monospace;color:var(--muted)}
.pricing-features{
  list-style:none;
  padding:0;
  margin:0 0 32px;
  display:flex;
  flex-direction:column;
  gap:14px;
  font-size:14px;
  flex-grow:1;
}
.pricing-features li{display:flex;align-items:center}
.pricing-btn{width:100%;text-align:center;margin-top:auto}
.guarantee-micro{font-size:12px;color:var(--muted);text-align:center;margin:12px 0 0}

/* Refund Banner */
.refund-banner{
  background:var(--tile);
  border-radius:var(--r-tile);
  padding:24px 32px;
  margin-top:32px;
  border-left:4px solid var(--ok);
}
.refund-banner strong{font:700 16px/1.2 Archivo,sans-serif;display:block;margin-bottom:6px}
.refund-banner p{color:var(--muted);font-size:14px;margin:0}

/* Download Section */
.download-box{
  background:var(--tile);
  border-radius:var(--r-tile);
  padding:56px 48px;
}
.download-grid{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:24px;
  margin-top:36px;
}
.download-item{
  background:var(--tile-2);
  border-radius:var(--r-input);
  padding:28px;
}
.download-item h3{font-size:22px;margin-bottom:6px}
.download-item p{color:var(--muted);font-size:14px;margin-bottom:20px}

/* Legal Pages */
.legal-page{padding-top:72px;padding-bottom:120px;max-width:800px}
.legal-date{font:400 13px/1 'JetBrains Mono',monospace;color:var(--muted);margin-bottom:48px;padding-bottom:16px;border-bottom:1px solid var(--hairline)}
.legal-content h2{font-size:24px;margin-top:40px;margin-bottom:14px}
.legal-content p,.legal-content li{color:var(--muted);font-size:15px;line-height:1.6}
.legal-content ul{padding-left:24px;margin-bottom:20px}
.legal-content li{margin-bottom:8px}

/* Footer */
.site-footer{
  border-top:1px solid var(--hairline);
  padding-block:48px;
  margin-top:80px;
}
.footer-top{
  display:flex;
  justify-content:space-between;
  align-items:center;
  margin-bottom:32px;
}
.footer-nav{display:flex;gap:24px;font-size:14px;color:var(--muted);flex-wrap:wrap}
.footer-bottom{
  display:flex;
  justify-content:space-between;
  font-size:13px;
  color:var(--muted);
  border-top:1px solid var(--hairline);
  padding-top:24px;
}

/* Responsiveness */
@media (max-width:960px){
  .hero{grid-template-columns:1fr;gap:40px;min-height:auto;padding-block:48px}
  .signal-grid{grid-template-columns:1fr;gap:24px}
  .workflow-grid{grid-template-columns:1fr}
  .split-section{grid-template-columns:1fr;gap:36px}
  .pricing-grid{grid-template-columns:1fr}
  .download-grid{grid-template-columns:1fr}
  .footer-top,.footer-bottom{flex-direction:column;gap:16px;align-items:flex-start}
}
