:root{
  --bg:#fbfaf6;
  --ink:#111;
  --body:#27272a;
  --muted:#5b5b58;
  --rule:#e7e4dc;
  --rule-strong:#cfccc2;
  --code-bg:#f1efe7;
  --max:980px;
  --pad: clamp(1.25rem, 4vw, 2rem);
  --sans: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
  --mono: ui-monospace, "SF Mono", "Cascadia Mono", "Roboto Mono", Consolas, "Liberation Mono", monospace;
}
*,*::before,*::after{box-sizing:border-box}
html{ -webkit-text-size-adjust:100% }
body{
  margin:0;
  background:var(--bg);
  color:var(--body);
  font-family:var(--sans);
  font-size:16px;
  line-height:1.6;
  -webkit-font-smoothing:antialiased;
  text-rendering:optimizeLegibility;
}
img,svg{ max-width:100%; height:auto; display:block }
a{ color:var(--ink); text-decoration:underline; text-underline-offset:3px; text-decoration-thickness:1px }
a:hover{ text-decoration-thickness:2px }
h1,h2,h3{ color:var(--ink); font-weight:600; letter-spacing:-0.01em; line-height:1.2; margin:0 0 .5em }
h1{ font-size:clamp(1.875rem, 5vw, 3rem); letter-spacing:-0.02em; line-height:1.1 }
h2{ font-size:clamp(1.375rem, 3vw, 1.875rem) }
h3{ font-size:1.0625rem }
p{ margin:0 0 1rem }
hr{ border:0; border-top:1px solid var(--rule); margin:0 }
code,.mono{ font-family:var(--mono) }

.container{ max-width:var(--max); margin:0 auto; padding-left:var(--pad); padding-right:var(--pad) }

/* skip link */
.skip{ position:absolute; left:-9999px; top:0 }
.skip:focus{ position:fixed; left:1rem; top:1rem; padding:.5rem 1rem; background:var(--ink); color:var(--bg); z-index:50 }

/* nav */
.nav{ border-bottom:1px solid var(--rule); background:var(--bg); position:sticky; top:0; z-index:10 }
.nav-inner{ display:flex; align-items:center; justify-content:space-between; padding-top:1.25rem; padding-bottom:1.25rem; gap:1rem }
.brand{ text-decoration:none; color:var(--ink); display:inline-flex; align-items:center; line-height:0 }
.brand-logo{ height:56px; width:auto; display:block }
@media (max-width:480px){
  .nav-inner{ padding-top:1rem; padding-bottom:1rem }
  .brand-logo{ height:40px }
}
.nav-links{ display:flex; gap:1.25rem; align-items:center; font-size:.9375rem }
.nav-links a{ text-decoration:none; color:var(--body) }
.nav-links a:hover{ color:var(--ink); text-decoration:underline; text-underline-offset:4px }
.nav-links a[aria-current="page"]{ color:var(--ink); text-decoration:underline; text-underline-offset:4px }
@media (max-width:640px){ .nav-links a:not(.nav-cta){ display:none } }
.nav-cta{ border:1px solid var(--ink); padding:.4rem .75rem; font-size:.875rem; text-decoration:none !important; color:var(--ink) !important }
.nav-cta:hover{ background:var(--ink); color:var(--bg) !important }

/* sections */
section{ padding-top:clamp(3rem, 8vw, 5.5rem); padding-bottom:clamp(3rem, 8vw, 5.5rem) }
section + section{ border-top:1px solid var(--rule) }
.eyebrow{ font-family:var(--mono); font-size:.75rem; letter-spacing:.08em; text-transform:uppercase; color:var(--muted); margin-bottom:1rem; display:block }

/* hero */
.hero h1{ max-width:18ch }
.hero .lede{ font-size:clamp(1.0625rem, 2.2vw, 1.1875rem); color:var(--body); max-width:62ch; margin-top:1.25rem }
.hero-meta{ margin-top:2rem; display:flex; flex-wrap:wrap; gap:1.25rem 2rem; font-family:var(--mono); font-size:.8125rem; color:var(--muted) }
.hero-meta span::before{ content:"// "; color:var(--rule-strong) }

/* buttons */
.cta-row{ margin-top:2rem; display:flex; flex-wrap:wrap; gap:1rem; align-items:center }
.btn{ display:inline-block; background:var(--ink); color:var(--bg); padding:.75rem 1.25rem; text-decoration:none; font-size:.9375rem; font-weight:500; border:1px solid var(--ink); cursor:pointer; font-family:inherit; line-height:1.4 }
.btn:hover{ background:transparent; color:var(--ink) }
.btn-ghost{ background:transparent; color:var(--ink); border:1px solid var(--rule-strong) }
.btn-ghost:hover{ border-color:var(--ink); background:transparent; color:var(--ink) }

/* page header (inner pages without hero) */
.page-header{ padding-top:clamp(3rem, 8vw, 5rem); padding-bottom:clamp(2rem, 5vw, 3.5rem); border-bottom:1px solid var(--rule) }
.page-header h1{ font-size:clamp(1.875rem, 4.5vw, 2.5rem); max-width:24ch }
.page-header .lede{ max-width:60ch; font-size:clamp(1rem, 2vw, 1.125rem); color:var(--body); margin-top:1rem }

/* pillars */
.pillars{ display:grid; gap:2.5rem; grid-template-columns:1fr }
@media (min-width:760px){ .pillars{ grid-template-columns:repeat(3, 1fr); gap:2.5rem } }
.pillar h3{ margin-bottom:.5rem }
.pillar .tag{ font-family:var(--mono); font-size:.75rem; color:var(--muted); letter-spacing:.04em; text-transform:uppercase; padding-bottom:.5rem; border-bottom:1px solid var(--rule); margin-bottom:1rem; display:block }
.pillar p{ color:var(--body) }

/* prose */
.prose{ max-width:62ch }
.prose p{ font-size:1.0625rem }
.prose h2{ margin-top:1.75em }
.prose h2:first-child{ margin-top:0 }
.prose ul,.prose ol{ font-size:1.0625rem; padding-left:1.25rem; margin:0 0 1rem }
.prose li{ margin-bottom:.5rem }

/* feature list */
.feature-list{ list-style:none; padding:0; margin:0; display:grid; gap:1.5rem; grid-template-columns:1fr }
@media (min-width:720px){ .feature-list{ grid-template-columns:1fr 1fr; gap:1.75rem 2.5rem } }
.feature-list li{ border-top:1px solid var(--rule); padding-top:1rem }
.feature-list .name{ font-family:var(--mono); font-size:.8125rem; color:var(--ink); display:block; margin-bottom:.375rem; letter-spacing:.02em }

/* feature blocks (solutions page - larger, single column) */
.feature-blocks{ display:grid; gap:3rem; grid-template-columns:1fr }
.feature-blocks .block{ display:grid; grid-template-columns:1fr; gap:.5rem }
@media (min-width:760px){ .feature-blocks .block{ grid-template-columns:14rem 1fr; gap:2rem } }
.feature-blocks .block-name{ font-family:var(--mono); font-size:.8125rem; letter-spacing:.04em; color:var(--muted); padding-top:.25rem }
.feature-blocks .block-name strong{ display:block; color:var(--ink); font-weight:600; font-size:1rem; font-family:var(--sans); letter-spacing:-0.01em; margin-top:.25rem }
.feature-blocks .block-body p{ font-size:1.0625rem; margin-bottom:.75rem }
.feature-blocks .block-body ul{ list-style:none; padding:0; margin:.5rem 0 0 }
.feature-blocks .block-body li{ position:relative; padding-left:1.25rem; margin-bottom:.375rem; font-size:1rem }
.feature-blocks .block-body li::before{ content:"›"; position:absolute; left:0; color:var(--muted); font-family:var(--mono) }

/* quotes */
.quotes{ display:grid; gap:2rem; grid-template-columns:1fr }
@media (min-width:760px){ .quotes{ grid-template-columns:1fr 1fr } }
blockquote{ margin:0; padding:0; border-left:2px solid var(--rule-strong); padding-left:1.25rem }
blockquote p{ font-size:1rem; color:var(--ink); font-style:italic }
blockquote cite{ display:block; margin-top:.75rem; font-family:var(--mono); font-style:normal; font-size:.8125rem; color:var(--muted) }
blockquote cite::before{ content:"- " }

/* qa */
.qa{ display:grid; gap:0; grid-template-columns:1fr; max-width:64ch }
.qa .item{ border-top:1px solid var(--rule); padding:1.5rem 0 }
.qa .item:last-child{ border-bottom:1px solid var(--rule) }
.qa h3{ font-size:1.0625rem; margin-bottom:.5rem }
.qa .q{ font-family:var(--mono); font-size:.75rem; color:var(--muted); display:block; margin-bottom:.5rem; letter-spacing:.04em; text-transform:uppercase }
.qa p{ color:var(--body); margin-bottom:0 }

/* comparison table */
.compare-wrap{ overflow-x:auto; -webkit-overflow-scrolling:touch }
table.compare{ width:100%; border-collapse:collapse; font-size:.9375rem; min-width:36rem }
.compare th,.compare td{ text-align:left; padding:.875rem .75rem; border-bottom:1px solid var(--rule); vertical-align:top }
.compare thead th{ border-bottom:1px solid var(--rule-strong); font-family:var(--mono); font-weight:500; font-size:.75rem; letter-spacing:.06em; text-transform:uppercase; color:var(--muted); padding-top:0 }
.compare tbody th{ font-weight:500; color:var(--muted); width:30%; font-family:var(--mono); font-size:.8125rem; letter-spacing:.02em; text-transform:uppercase }
.compare td.us{ color:var(--ink); font-weight:500 }
.compare td.them{ color:var(--muted) }

/* form */
.contact-grid{ display:grid; gap:3rem; grid-template-columns:1fr }
@media (min-width:840px){ .contact-grid{ grid-template-columns:1.4fr 1fr; gap:4rem } }
.form{ display:grid; gap:1.25rem; max-width:36rem }
.field{ display:grid; gap:.375rem }
.field label{ font-family:var(--mono); font-size:.75rem; letter-spacing:.04em; text-transform:uppercase; color:var(--muted) }
.field label .req{ color:var(--ink) }
.field input,.field textarea{
  font-family:inherit; font-size:1rem; line-height:1.5;
  padding:.625rem .75rem;
  background:#fff; color:var(--ink);
  border:1px solid var(--rule-strong);
  border-radius:0;
  -webkit-appearance:none; appearance:none;
}
.field input:focus,.field textarea:focus{ outline:2px solid var(--ink); outline-offset:-1px; border-color:var(--ink) }
.field textarea{ min-height:9rem; resize:vertical }
.field .hint{ font-size:.8125rem; color:var(--muted) }
.field-honeypot{ position:absolute; left:-9999px; width:1px; height:1px; overflow:hidden }
.form-submit{ margin-top:.5rem }

.contact-side .item{ border-top:1px solid var(--rule); padding:1.25rem 0 }
.contact-side .item:first-child{ border-top:0; padding-top:0 }
.contact-side .label{ font-family:var(--mono); font-size:.75rem; color:var(--muted); letter-spacing:.04em; text-transform:uppercase; display:block; margin-bottom:.25rem }
.contact-side .value{ font-size:1.125rem; color:var(--ink) }
.contact-side .value a{ text-decoration:none }
.contact-side .value a:hover{ text-decoration:underline }
.contact-side p{ font-size:.9375rem; color:var(--body) }

/* notice */
.notice{ padding:1rem 1.25rem; border:1px solid var(--rule-strong); margin-bottom:2rem; font-size:.9375rem; background:#fff }
.notice-success{ border-color:#1f5d1f; color:#1f5d1f; background:#f3f7f2 }
.notice-error{ border-color:#7a1f1f; color:#7a1f1f; background:#fbf3f3 }
.notice strong{ font-weight:600 }

/* final cta */
.final-cta h2{ margin-bottom:1rem }

/* footer */
footer{ border-top:1px solid var(--rule); padding-top:2rem; padding-bottom:2rem; font-size:.875rem; color:var(--muted) }
.footer-grid{ display:grid; gap:1.5rem; grid-template-columns:1fr }
@media (min-width:640px){ .footer-grid{ grid-template-columns:2fr 1fr 1fr } }
footer a{ color:var(--body) }
footer .col h4{ font-family:var(--mono); font-size:.75rem; letter-spacing:.08em; text-transform:uppercase; color:var(--muted); margin:0 0 .5rem; font-weight:500 }
footer .col p{ margin:0; color:var(--body) }
footer ul{ list-style:none; padding:0; margin:0 }
footer li{ margin-bottom:.25rem }
.footer-meta{ margin-top:2rem; font-family:var(--mono); font-size:.75rem; color:var(--muted) }

/* misc */
.lead-link{ display:inline-block; margin-top:1.5rem }

/* a11y focus */
a:focus-visible,.btn:focus-visible,button:focus-visible,input:focus-visible,textarea:focus-visible{ outline:2px solid var(--ink); outline-offset:2px }

/* reduced motion (no animations to disable, but here for future-proofing) */
@media (prefers-reduced-motion:reduce){ *{ animation:none !important; transition:none !important } }
