/* Pixel Check — values copied from docs/design/*.dc.html (inline styles → classes). */
body{margin:0;background:#F4F5F7;font-family:'Heebo',system-ui,sans-serif;color:#14181F}
a{color:#1D4ED8}a:hover{color:#1E3A8A}
button,input{font-family:inherit}
/* Focus ring: #1D4ED8 is 6.70:1 on white / 6.14:1 on #F4F5F7; the light #93B4F5 stays on the dark bands (8.55:1). WCAG 1.4.11 */
button:focus-visible,input:focus-visible,summary:focus-visible,a:focus-visible,select:focus-visible,textarea:focus-visible{outline:3px solid #1D4ED8;outline-offset:2px}
.final :focus-visible,.audit :focus-visible{outline-color:#93B4F5}
/* Headings and status text that get focus from script (tabindex=-1) aren't controls: no ring. */
[tabindex="-1"]:focus{outline:none}
[hidden]{display:none !important}
.page{min-height:100vh;background:#F4F5F7;color:#14181F;font-family:'Heebo',system-ui,sans-serif;text-align:right}

/* header / footer */
.site-header{background:#FFFFFF;border-bottom:1px solid #E3E6EB}
.wrap{max-width:1120px;margin:0 auto}
.wrap-narrow{max-width:760px;margin:0 auto}
.header-row{padding:16px 20px;display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:12px}
.brand{display:flex;align-items:center;gap:10px;color:#14181F;text-decoration:none}
.brand:hover{color:#14181F}
.brand-name{font-size:20px;font-weight:800;letter-spacing:-0.01em}
.header-link{font-size:15px;font-weight:500}
.header-note{font-size:14px;color:#4B5563}
.site-footer{max-width:1120px;margin:0 auto;padding:24px 20px 40px;display:flex;flex-wrap:wrap;justify-content:space-between;gap:12px;font-size:14px;color:#4B5563}

/* LP hero */
.hero{background:#FFFFFF;border-bottom:1px solid #E3E6EB}
.hero-row{padding:56px 20px;display:flex;flex-wrap:wrap;gap:40px;align-items:center}
.hero-copy{flex:1 1 420px;min-width:0;display:flex;flex-direction:column;gap:18px}
.pill-green{display:inline-flex;align-self:flex-start;align-items:center;gap:8px;padding:6px 12px;border-radius:999px;background:#E4F4F1;color:#0F6B5F;font-size:14px;font-weight:700}
.hero h1{margin:0;font-size:46px;line-height:1.15;font-weight:800;letter-spacing:-0.02em}
.hero-lede{margin:0;font-size:19px;line-height:1.6;color:#374151}
.checks{margin:0;padding:0;list-style:none;display:flex;flex-direction:column;gap:8px;font-size:16px;color:#374151}
.checks li{display:flex;gap:10px;align-items:center}
.checks svg{flex:none}
.form-card{flex:1 1 380px;min-width:0;max-width:480px;background:#FFFFFF;border:1px solid #D9DDE3;border-radius:18px;padding:28px;box-shadow:0 12px 32px rgba(20,24,31,0.08);box-sizing:border-box}
.scan-form{display:flex;flex-direction:column;gap:16px}
.form-h2{margin:0;font-size:22px;font-weight:800}
.field{display:flex;flex-direction:column;gap:6px}
.field label{font-size:15px;font-weight:700}
.input{min-height:48px;padding:10px 14px;border:1px solid #7C8594;border-radius:10px;font-size:16px;box-sizing:border-box;width:100%}
.input-email{text-align:right}
.hint{font-size:13px;color:#4B5563}
.turnstile-box{min-height:65px;display:flex;align-items:center;justify-content:center}
.consent{display:flex;gap:10px;align-items:flex-start;min-height:44px;font-size:14px;line-height:1.5;color:#374151;cursor:pointer}
.consent input{width:20px;height:20px;margin:2px 0 0;flex:none;accent-color:#1D4ED8}
.alert{margin:0;font-size:15px;line-height:1.5;color:#A6330F;background:#FCEDE7;border-radius:10px;padding:10px 14px}
.btn{display:inline-flex;align-items:center;justify-content:center;min-height:44px;padding:10px 18px;border-radius:10px;font-size:16px;font-weight:700;text-decoration:none;cursor:pointer;box-sizing:border-box}
.btn-primary{border:none;background:#1D4ED8;color:#FFFFFF}
.btn-primary:hover{color:#FFFFFF;background:#1E40AF}
.btn-secondary{border:1px solid #B8BFCA;background:#FFFFFF;color:#14181F}
.btn-outline{border:2px solid #1D4ED8;background:#FFFFFF;color:#1D4ED8;padding:10px 20px}
.btn[disabled]{opacity:.6;cursor:wait}
.btn-submit{min-height:52px;padding:12px 24px;font-size:18px}
.fineprint{font-size:13px;line-height:1.5;color:#4B5563}
.sent{display:flex;flex-direction:column;gap:14px}
.sent p{margin:0;font-size:16px;line-height:1.6;color:#374151}
.sent .muted{font-size:14px;color:#4B5563}
.ltr-strong{font-weight:700;color:#14181F}
.row-wrap{display:flex;flex-wrap:wrap;gap:10px}

/* LP sections */
.sec{max-width:1120px;margin:0 auto;padding:40px 20px;display:flex;flex-direction:column;gap:20px}
.sec-why{padding:56px 20px 8px;gap:14px}
.sec-why h2{margin:0;font-size:32px;line-height:1.25;font-weight:800}
.sec-why p{margin:0;max-width:720px;font-size:18px;line-height:1.7;color:#374151}
.h26{margin:0;font-size:26px;font-weight:800}
.grid-200{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:16px}
.grid-230{display:grid;grid-template-columns:repeat(auto-fit,minmax(230px,1fr));gap:16px}
.tile{background:#FFFFFF;border:1px solid #E3E6EB;border-radius:16px;padding:22px;display:flex;flex-direction:column;gap:8px}
.tile h3{margin:0;font-size:18px;line-height:1.35;font-weight:700}
.tile p{margin:0;font-size:15px;line-height:1.6;color:#374151}
.band-white{background:#FFFFFF;border-top:1px solid #E3E6EB;border-bottom:1px solid #E3E6EB}
.how{padding:48px 20px;display:flex;flex-direction:column;gap:22px}
.how ol{margin:0;padding:0;list-style:none;display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:16px}
.how li{display:flex;gap:14px;align-items:flex-start}
.step-n{flex:none;width:40px;height:40px;border-radius:999px;background:#14181F;color:#FFFFFF;display:inline-flex;align-items:center;justify-content:center;font-size:18px;font-weight:800}
.step-t{font-size:18px;font-weight:700}
.step-b{font-size:15px;line-height:1.6;color:#374151}
.col4{display:flex;flex-direction:column;gap:4px}
.sec-next{padding:48px 20px}
.next-sub{margin:0;font-size:17px;color:#374151}
.ladder-tag{font-size:14px;font-weight:700;color:#4B5563}
.tile .ladder-h{margin:0;font-size:19px;font-weight:700}
.tile .ladder-b{flex:1}
.ladder-price{font-size:20px;font-weight:800}
.tile-soon{border-style:dashed;grid-column:1/-1}
.tile-soon .ladder-b{max-width:60ch}
.btn-soon{align-self:flex-start}
.sec-faq{padding:8px 20px 48px;gap:12px}
.sec-faq h2{margin:0 0 4px}
.faq{background:#FFFFFF;border:1px solid #E3E6EB;border-radius:14px;padding:16px 20px}
.faq summary{cursor:pointer;font-size:17px;font-weight:700;min-height:30px}
.faq p{margin:10px 0 0;font-size:16px;line-height:1.7;color:#374151}
.final{background:#14181F;color:#FFFFFF}
.final-row{padding:52px 20px;display:flex;flex-wrap:wrap;gap:20px;align-items:center;justify-content:space-between}
.final-copy{display:flex;flex-direction:column;gap:8px;flex:1 1 420px;min-width:0}
.final h2{margin:0;font-size:30px;line-height:1.25;font-weight:800}
.final p{margin:0;font-size:17px;color:#C9CED6}
.btn-final{min-height:52px;padding:12px 28px;font-size:18px}

/* report */
.report-main{padding:28px 20px 64px;display:flex;flex-direction:column;gap:20px}
.card{background:#FFFFFF;border:1px solid #E3E6EB;border-radius:16px}
.summary{padding:28px;display:flex;flex-direction:column;gap:16px}
.meta{display:flex;flex-wrap:wrap;gap:4px 8px;align-items:center;font-size:14px;color:#4B5563}
.meta-url{font-weight:500;color:#14181F}
.meta-url{min-width:0;overflow-wrap:anywhere}
@media (max-width:479px){.meta-sep{display:none}.meta-date{flex-basis:100%}}
.summary h1{margin:0;font-size:34px;line-height:1.2;font-weight:800;letter-spacing:-0.01em}
.summary p{margin:0;font-size:17px;line-height:1.6;color:#374151}
.chips{display:flex;flex-wrap:wrap;gap:8px}
.chip{display:inline-flex;align-items:center;gap:6px;padding:6px 12px;border-radius:999px;font-size:14px;font-weight:700}
.chip-crit{background:#FCEDE7;color:#A6330F}
.chip-warn{background:#FFF3D6;color:#7A4E00}
.chip-lock{background:#ECEEF2;color:#374151}
.h2-found{margin:8px 0 0;font-size:22px;font-weight:800}
.finding{padding:24px;display:flex;flex-direction:column;gap:12px}
.badges{display:flex;flex-wrap:wrap;gap:10px;align-items:center}
.badge{display:inline-flex;align-items:center;gap:6px;padding:4px 10px;border-radius:999px;font-size:13px;font-weight:700}
.finding h3{margin:0;font-size:21px;line-height:1.3;font-weight:700}
.finding .f-body{margin:0;font-size:16px;line-height:1.6;color:#374151}
.finding code,.f-code{display:block;direction:ltr;text-align:left;font-size:14px;background:#F4F5F7;border-radius:8px;padding:8px 10px;white-space:pre-wrap;word-break:break-word}
.cost{margin:0;font-size:16px;line-height:1.6;color:#14181F;background:#F4F5F7;border-radius:10px;padding:12px 14px}
.cost strong{font-weight:700}
.fix-row{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:12px;padding-top:4px}
.fix-name{font-size:15px;color:#4B5563}
.locked{background:#FFFFFF;border:1px dashed #B8BFCA;border-radius:16px;padding:24px;display:flex;flex-direction:column;gap:14px}
.locked-head{display:flex;align-items:center;gap:10px}
.locked h3{margin:0;font-size:20px;font-weight:700}
.blur{display:flex;flex-direction:column;gap:8px;filter:blur(3px);user-select:none}
.blur div{height:14px;border-radius:6px;background:#E3E6EB}
.locked p{margin:0;font-size:16px;line-height:1.6;color:#374151}
.audit{background:#14181F;color:#FFFFFF;border-radius:16px;padding:28px;display:flex;flex-direction:column;gap:16px}
.audit h2{margin:0;font-size:26px;font-weight:800}
.audit ul{margin:0;padding:0;list-style:none;display:flex;flex-direction:column;gap:10px;font-size:16px;line-height:1.5}
.audit li{display:flex;gap:10px;align-items:flex-start}
.audit li svg{flex:none;margin-top:2px}
.audit-buy{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:14px;padding-top:4px}
.audit-price{display:flex;flex-direction:column;gap:2px}
.audit-price .big{font-size:28px;font-weight:800}
.audit-price .small{font-size:14px;color:#C9CED6}
.btn-audit{min-height:48px;padding:12px 26px;font-size:17px}
.works{padding:18px 24px}
.works summary{cursor:pointer;font-size:17px;font-weight:700;min-height:32px}
.works ul{margin:12px 0 0;padding:0;list-style:none;display:flex;flex-direction:column;gap:10px;font-size:16px;color:#374151}
.works li{display:flex;gap:10px;align-items:center}
.works li svg{flex:none}
.monitor{padding:24px;display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:16px}
.monitor-copy{display:flex;flex-direction:column;gap:6px;flex:1 1 320px;min-width:0}
.monitor h2{margin:0;font-size:20px;font-weight:700}
.monitor p{margin:0;font-size:16px;line-height:1.6;color:#374151}
.report-footer{display:flex;flex-direction:column;gap:6px;padding-top:8px;font-size:14px;line-height:1.6;color:#4B5563}
.report-footer p{margin:0}

/* scan states */
.state{padding:28px;display:flex;flex-direction:column;gap:14px}
.state h1{margin:0;font-size:28px;line-height:1.25;font-weight:800}
.state p{margin:0;font-size:17px;line-height:1.6;color:#374151}
.spinner{width:36px;height:36px;border-radius:999px;border:4px solid #E3E6EB;border-top-color:#1D4ED8;animation:spin 1s linear infinite}
@keyframes spin{to{transform:rotate(360deg)}}
@media (prefers-reduced-motion:reduce){.spinner{animation:none}}

/* checkout sheet */
.overlay{position:fixed;inset:0;background:rgba(20,24,31,0.55);display:flex;align-items:flex-end;justify-content:center;padding:16px;z-index:10}
.sheet{background:#FFFFFF;width:100%;max-width:520px;max-height:90vh;overflow-y:auto;border-radius:18px;padding:26px;display:flex;flex-direction:column;gap:16px;box-sizing:border-box;margin:auto 0}
.sheet-col{display:flex;flex-direction:column;gap:16px}
.sheet-head{display:flex;align-items:center;justify-content:space-between;gap:12px}
.sheet h2{margin:0;font-size:22px;font-weight:800}
.btn-x{width:44px;height:44px;border-radius:10px;border:1px solid #E3E6EB;background:#FFFFFF;cursor:pointer;display:inline-flex;align-items:center;justify-content:center}
.order-box{display:flex;flex-direction:column;gap:10px;background:#F4F5F7;border-radius:12px;padding:16px}
.order-name{font-size:18px;font-weight:700}
.order-inc{margin:0;padding:0;list-style:none;display:flex;flex-direction:column;gap:8px;font-size:15px;line-height:1.5;color:#374151}
.order-inc li{display:flex;gap:8px;align-items:flex-start}
.order-inc svg{flex:none;margin-top:2px}
.order-total{display:flex;justify-content:space-between;align-items:baseline;border-top:1px solid #D9DDE3;padding-top:10px;margin-top:2px}
.order-total .lbl{font-size:15px;color:#4B5563}
.order-total .val{font-size:22px;font-weight:800}
.sheet .input{min-height:46px}
.sheet .help{font-size:14px;color:#4B5563}
.sheet .next{margin:0;font-size:15px;line-height:1.6;color:#374151}
.btn-pay{min-height:50px;padding:12px 24px;font-size:17px}
.pay-note{font-size:13px;color:#4B5563;text-align:center}
.done-head{display:flex;align-items:center;gap:10px}
.done p{margin:0;font-size:16px;line-height:1.6;color:#374151}
.done ol{margin:0;padding:0;list-style:none;display:flex;flex-direction:column;gap:12px}
.done li{display:flex;gap:12px;align-items:flex-start;font-size:16px;line-height:1.5}
.done-n{flex:none;width:28px;height:28px;border-radius:999px;background:#ECEEF2;display:inline-flex;align-items:center;justify-content:center;font-size:14px;font-weight:700}
.stub-note{font-size:13px;color:#4B5563}

/* simple server pages */
.simple-main{padding:28px 20px 64px}
.simple-card{padding:28px;display:flex;flex-direction:column;gap:14px;align-items:flex-start}
.simple-h1{margin:0;font-size:28px;font-weight:800}
.simple-p{margin:0;font-size:17px;line-height:1.6;color:#374151}

@media (max-width:480px){
  .hero h1{font-size:34px}
  .summary h1{font-size:28px}
  .form-card,.summary,.finding,.audit,.locked{padding:20px}
}

/* Tap targets >= 44px on phone (accessibility audit T1). */
.header-link,.site-footer a,.report-footer a{display:inline-block;padding:10px 4px;min-height:44px;box-sizing:border-box}
.faq summary,.works summary{min-height:44px;padding:8px 0;box-sizing:border-box}
.brand{min-height:44px}

/* Skip link (audit S3): off screen until it gets keyboard focus. */
.skip-link{position:absolute;top:-200px;right:12px;z-index:100;padding:12px 18px;min-height:44px;box-sizing:border-box;background:#1D4ED8;color:#FFFFFF;font-weight:700;border-radius:10px;text-decoration:none}
.skip-link:focus{top:12px;color:#FFFFFF;outline:3px solid #14181F;outline-offset:2px}
main:focus{outline:none}