/* ListingLift by Keel & Charter. Design system, Oct 27, 2026. Mobile first: base rules target a 390px iPhone; min-width queries add the desktop layout. */
@font-face{font-family:"Newsreader";src:url(fonts/newsreader-var-latin.woff2) format("woff2");font-weight:200 800;font-style:normal;font-display:swap}
@font-face{font-family:"Public Sans";src:url(fonts/public-sans-var-latin.woff2) format("woff2");font-weight:100 900;font-style:normal;font-display:swap}
:root{
  /* Brand: harbor green. Accent: buoy orange. Surfaces: paper and sand. */
  --harbor-900:#0C2B29;--harbor-800:#103A37;--harbor-700:#145049;--harbor-600:#1B6158;--harbor-100:#E0EDE9;--harbor-50:#F0F6F4;
  --buoy-700:#8E3511;--buoy-600:#B0441A;--buoy-400:#F0A26E;--buoy-100:#FBE5D6;
  --ink:#16201F;--ink-2:#46524F;--ink-3:#5E6A67;
  --paper:#F7F3EA;--sand:#EFE8DA;--surface:#FFFFFF;--line:#DDD4C3;--line-2:#E9E3D6;
  --good:#23704A;--ok:#1B6158;--warn:#985A0B;--bad:#AE3520;
  --font-display:"Newsreader",Georgia,"Times New Roman",serif;
  --font-text:"Public Sans",system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;
  --r-sm:8px;--r:14px;--r-lg:20px;
  --shadow:0 1px 2px rgba(12,43,41,.06),0 8px 24px -12px rgba(12,43,41,.18);
  --shadow-lg:0 2px 4px rgba(12,43,41,.06),0 24px 48px -20px rgba(12,43,41,.32);
  --gutter:20px;--tap:44px;
  --safe-b:env(safe-area-inset-bottom,0px);
}
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;text-size-adjust:100%;scroll-behavior:smooth;scroll-padding-top:72px}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}*{transition:none!important;animation:none!important}}
body{margin:0;font-family:var(--font-text);font-size:17px;line-height:1.6;color:var(--ink);background:var(--paper);overflow-x:hidden;padding-bottom:calc(76px + var(--safe-b));font-feature-settings:"tnum" 0}
img,svg{max-width:100%}
a{color:var(--harbor-600);text-decoration-thickness:1px;text-underline-offset:3px}
a:hover{color:var(--harbor-800)}
:focus-visible{outline:3px solid var(--buoy-600);outline-offset:2px;border-radius:4px}
.wrap{max-width:1160px;margin:0 auto;padding-left:max(var(--gutter),env(safe-area-inset-left));padding-right:max(var(--gutter),env(safe-area-inset-right))}
.hidden{display:none!important}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.skip{position:absolute;left:12px;top:-60px;background:var(--harbor-900);color:#fff;padding:10px 14px;border-radius:var(--r-sm);z-index:50}
.skip:focus{top:12px;color:#fff}
h1,h2,h3{color:var(--ink);text-wrap:balance}
h1,h2{font-family:var(--font-display);font-weight:560;letter-spacing:-.015em;font-variation-settings:"opsz" 60}
h1{font-size:2.35rem;line-height:1.06;margin:0 0 16px}
h2{font-size:1.75rem;line-height:1.15;margin:40px 0 12px}
h3{font-size:1.06rem;line-height:1.3;margin:0 0 6px;font-weight:650}
p{margin:0 0 14px}
.lead{font-size:1.1rem;color:var(--ink-2);max-width:60ch}
.eyebrow{font-size:.78rem;font-weight:700;letter-spacing:.09em;text-transform:uppercase;color:var(--harbor-600);margin:0 0 10px}
.eyebrow-accent{color:var(--buoy-700)}
.note{font-size:.9rem;color:var(--ink-3)}
.counter{font-weight:500;font-size:.85rem;color:var(--ink-3);font-variant-numeric:tabular-nums}
.counter.over{color:var(--bad);font-weight:700}
.ico{vertical-align:-3px;flex:none}

/* Buttons: 48px tall on phones, never below the 44px tap target */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:48px;padding:12px 20px;border-radius:999px;border:1.5px solid transparent;font:inherit;font-weight:650;font-size:1rem;line-height:1.2;text-decoration:none;cursor:pointer;transition:background .15s,border-color .15s,transform .15s;-webkit-tap-highlight-color:transparent}
.btn:active{transform:translateY(1px)}
.btn-primary{background:var(--harbor-700);color:#fff}
.btn-primary:hover{background:var(--harbor-900);color:#fff}
.btn-accent{background:var(--buoy-600);color:#fff}
.btn-accent:hover{background:var(--buoy-700);color:#fff}
.btn-ghost{background:transparent;color:var(--harbor-700);border-color:var(--harbor-600)}
.btn-ghost:hover{background:var(--harbor-50);color:var(--harbor-900)}
.btn-sm{min-height:44px;padding:9px 16px;font-size:.95rem}
.btn-block{display:flex;width:100%}
.btn[aria-disabled=true]{opacity:.7}

/* Header */
.site-head{position:sticky;top:0;z-index:30;background:rgba(247,243,234,.94);-webkit-backdrop-filter:saturate(1.4) blur(10px);backdrop-filter:saturate(1.4) blur(10px);border-bottom:1px solid var(--line-2);padding-top:env(safe-area-inset-top)}
.head-row{display:flex;align-items:center;justify-content:space-between;min-height:60px;gap:12px}
.logo{display:inline-flex;align-items:center;gap:10px;text-decoration:none;color:var(--ink);min-height:44px}
.logo .mark{width:30px;height:30px;flex:none}
.logo-word{font-family:var(--font-display);font-weight:620;font-size:1.3rem;letter-spacing:-.01em}
.logo-by{display:none;font-size:.85rem;color:var(--ink-3)}
.nav-main{display:none}
.nav-mobile{position:relative}
.nav-mobile summary{list-style:none;display:grid;place-items:center;width:44px;height:44px;border-radius:12px;cursor:pointer}
.nav-mobile summary::-webkit-details-marker{display:none}
.burger{display:grid;gap:4px}.burger i{display:block;width:20px;height:2px;background:var(--ink);border-radius:2px;transition:transform .2s,opacity .2s}
.nav-mobile[open] .burger i:nth-child(1){transform:translateY(6px) rotate(45deg)}
.nav-mobile[open] .burger i:nth-child(2){opacity:0}
.nav-mobile[open] .burger i:nth-child(3){transform:translateY(-6px) rotate(-45deg)}
.nav-sheet{position:absolute;right:0;top:52px;width:min(300px,calc(100vw - 32px));background:var(--surface);border:1px solid var(--line);border-radius:var(--r);box-shadow:var(--shadow-lg);padding:8px}
.nav-sheet a{display:flex;align-items:center;min-height:48px;padding:0 14px;border-radius:10px;color:var(--ink);text-decoration:none;font-weight:600}
.nav-sheet a:hover{background:var(--harbor-50)}

/* Shared panel */
.panel{background:var(--surface);border:1px solid var(--line);border-radius:var(--r-lg);box-shadow:var(--shadow);padding:20px}

/* Hero */
.hero{padding:28px 0 36px;background:
 linear-gradient(var(--paper),rgba(247,243,234,.0) 70%),
 repeating-linear-gradient(0deg,transparent 0 39px,rgba(12,43,41,.045) 39px 40px),
 repeating-linear-gradient(90deg,transparent 0 39px,rgba(12,43,41,.045) 39px 40px)}
.hero-grid{display:grid;gap:32px}
.hero-cta{display:flex;flex-wrap:wrap;gap:10px;margin:22px 0 18px}
.hero-cta .btn{flex:1 1 180px}
.assure{list-style:none;padding:0;margin:0;display:grid;gap:8px;color:var(--ink-2);font-size:.95rem}
.assure li{display:flex;gap:8px;align-items:center}
.assure .ico{color:var(--good)}

/* Hero mock: browser frame around the real results component */
.mock{margin:0;position:relative}
.mock-bar{display:flex;align-items:center;gap:6px;background:var(--harbor-900);border-radius:var(--r-lg) var(--r-lg) 0 0;padding:10px 14px}
.mock-bar span{width:9px;height:9px;border-radius:50%;background:rgba(255,255,255,.28)}
.mock-bar em{font-style:normal;font-size:.75rem;color:rgba(255,255,255,.72);margin-left:8px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.mock-panel{border-radius:0 0 var(--r-lg) var(--r-lg);border-top:0;box-shadow:var(--shadow-lg)}
.mock-title{font-size:.88rem;color:var(--ink-2);margin:2px 0 0;line-height:1.35}
.mock-fixes{margin-top:16px;border-top:1px solid var(--line-2);padding-top:14px}
.mock-fixes ol{list-style:none;padding:0;margin:0;display:grid;gap:8px;font-size:.92rem;line-height:1.4}
.mock-fixes li{display:flex;gap:10px;align-items:flex-start}
.mock figcaption,.mock>figcaption{font-size:.85rem;color:var(--ink-3);margin-top:10px}

/* Dial */
.dial{position:relative;flex:none}
.dial svg{display:block;width:100%;height:100%}
.dial .track{fill:none;stroke:var(--sand);stroke-width:11}
.dial .arc{fill:none;stroke:var(--ok);stroke-width:11;stroke-linecap:round;transition:stroke-dashoffset .5s cubic-bezier(.2,.7,.2,1),stroke .3s}
.dial.tone-good .arc{stroke:var(--good)}.dial.tone-warn .arc{stroke:#C37A16}.dial.tone-bad .arc{stroke:var(--bad)}
.dial-num{position:absolute;inset:0;display:grid;place-content:center;text-align:center;line-height:1}
.dial-num b{font-family:var(--font-display);font-weight:600;font-variant-numeric:tabular-nums;letter-spacing:-.02em}
.dial-num span{font-size:.75rem;color:var(--ink-3);margin-top:2px}
.dial-md{width:112px;height:112px}.dial-md .dial-num b{font-size:2.5rem}
.dial-sm{width:72px;height:72px}.dial-sm .dial-num b{font-size:1.5rem}.dial-sm .dial-num span{font-size:.62rem}
.score-head{display:flex;gap:16px;align-items:center}
.band{font-family:var(--font-display);font-size:1.35rem;font-weight:600;line-height:1.15;margin:0 0 4px}
.band-good{color:var(--good)}.band-ok{color:var(--harbor-700)}.band-warn{color:var(--warn)}.band-bad{color:var(--bad)}

/* Category bars */
.cats{display:grid;gap:12px;margin-top:18px}
.cat-top{display:flex;justify-content:space-between;gap:8px;font-weight:600;font-size:.95rem;margin-bottom:6px}
.num{font-variant-numeric:tabular-nums}.num small{color:var(--ink-3);font-weight:500}
.bar{height:8px;background:var(--sand);border-radius:99px;overflow:hidden}
.bar i{display:block;height:100%;border-radius:99px;background:var(--ok);transition:width .5s cubic-bezier(.2,.7,.2,1)}
.bar i.tone-good{background:var(--good)}.bar i.tone-warn{background:#C37A16}.bar i.tone-bad{background:var(--bad)}
.cat details{border-top:1px solid var(--line-2);margin-top:2px}
.cat summary{list-style:none;cursor:pointer;min-height:44px;display:flex;align-items:center;justify-content:space-between;gap:8px}
.cat summary::-webkit-details-marker{display:none}
.cat summary .chev{width:18px;height:18px;transition:transform .2s;color:var(--ink-3)}
.cat details[open] .chev{transform:rotate(180deg)}
.cat-live .cat-top{margin:0}
.cat-live summary{padding:6px 0 0;display:block}
.cat-live summary .bar{margin-top:6px}
.see{display:flex;justify-content:space-between;align-items:center;font-size:.82rem;color:var(--ink-3);margin-top:6px}
ul.checks{list-style:none;padding:0;margin:8px 0 6px}
ul.checks li{position:relative;padding:8px 0 8px 28px;border-bottom:1px dashed var(--line-2);font-size:.93rem;line-height:1.45}
ul.checks li:last-child{border-bottom:0}
ul.checks li::before{content:"";position:absolute;left:0;top:10px;width:18px;height:18px;border-radius:50%;background:var(--harbor-100) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'%3E%3Cpath d='m6 10.2 2.6 2.6L14 7.6' fill='none' stroke='%2323704A' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center/16px no-repeat}
ul.checks li.no::before{background:#F8E1DA url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'%3E%3Cpath d='m7 7 6 6m0-6-6 6' fill='none' stroke='%23AE3520' stroke-width='2.2' stroke-linecap='round'/%3E%3C/svg%3E") center/16px no-repeat}
.lost{font-weight:700;color:var(--bad);font-variant-numeric:tabular-nums}

/* POV band */
.pov{background:var(--harbor-900);color:#E6EFEC;padding:40px 0}
.pov-grid{display:grid;gap:16px}
.pov-big{font-family:var(--font-display);font-size:1.6rem;line-height:1.2;color:#fff;margin:0;font-weight:500;text-wrap:balance}
.pov p{max-width:62ch}

/* Tool */
.tool{padding:44px 0 24px}
.section-head{max-width:680px;margin-bottom:22px}
.section-head h2{margin:0 0 10px;font-size:2rem}
.section-head p{color:var(--ink-2)}
.tool-grid{display:grid;gap:20px}
.form fieldset{border:0;margin:0;padding:0 0 22px;margin-bottom:22px;border-bottom:1px solid var(--line-2);min-width:0}
.step-head{display:flex;gap:12px;align-items:flex-start;margin-bottom:12px}
.step-head h3{margin:2px 0 2px}.step-head p{margin:0;font-size:.9rem;color:var(--ink-3)}
.step-n{display:grid;place-items:center;width:30px;height:30px;border-radius:50%;background:var(--harbor-100);color:var(--harbor-800);font-weight:700;font-size:.9rem;flex:none;font-variant-numeric:tabular-nums}
label{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:baseline;gap:6px;font-weight:600;font-size:.95rem;margin:12px 0 6px}
/* 16px minimum so iOS Safari does not zoom on focus */
input[type=text],input[type=number],textarea{width:100%;font:inherit;font-size:17px;line-height:1.45;color:var(--ink);background:var(--surface);border:1.5px solid var(--line);border-radius:12px;padding:12px 14px;min-height:48px;-webkit-appearance:none;appearance:none;transition:border-color .15s,box-shadow .15s}
input::placeholder,textarea::placeholder{color:#6B7673}
input:focus,textarea:focus{outline:none;border-color:var(--harbor-600);box-shadow:0 0 0 4px rgba(27,97,88,.16)}
textarea{resize:vertical;min-height:120px}
.row2{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.row2 label{margin-top:0}
label.check{display:flex;justify-content:flex-start;align-items:center;gap:12px;font-weight:500;min-height:48px;margin:6px 0 0;cursor:pointer}
label.check input{width:24px;height:24px;margin:0;accent-color:var(--harbor-700);flex:none}
.form-actions{display:flex;flex-wrap:wrap;gap:10px}
.form-actions .btn{flex:1 1 180px}
.form .note{margin:14px 0 0}

/* Live score */
.empty{display:flex;flex-direction:column;align-items:center;text-align:center;padding:10px 0}
.empty .dial{opacity:.55}
.empty-t{font-family:var(--font-display);font-size:1.25rem;margin:14px 0 6px;color:var(--ink)}

/* Results */
.results{display:grid;gap:20px;margin-top:20px}
.fixes-head{display:flex;justify-content:space-between;align-items:flex-end;gap:10px;flex-wrap:wrap}
.fixes-head h2{margin:0;font-size:1.7rem}
.fixes-score{margin:0;color:var(--ink-2);font-variant-numeric:tabular-nums}
.fixes-score b{font-family:var(--font-display);font-size:1.4rem;color:var(--ink)}
ol.wins{list-style:none;counter-reset:w;padding:0;margin:18px 0 0;display:grid;gap:12px}
ol.wins li{counter-increment:w;position:relative;padding:16px 16px 16px 58px;border:1px solid var(--line-2);border-radius:var(--r);background:var(--paper)}
ol.wins li::before{content:counter(w);position:absolute;left:16px;top:16px;width:30px;height:30px;border-radius:50%;background:var(--harbor-900);color:#fff;display:grid;place-items:center;font-weight:700;font-size:.9rem}
.win-top{display:flex;flex-wrap:wrap;gap:6px 8px;align-items:center;margin-bottom:6px}
.win-cat{font-weight:700}
.pts{display:inline-flex;align-items:center;flex:none;background:var(--buoy-100);color:var(--buoy-700);font-weight:750;font-size:.8rem;padding:3px 9px;border-radius:99px;font-variant-numeric:tabular-nums}
.effort{font-size:.8rem;color:var(--ink-3);background:var(--surface);border:1px solid var(--line-2);padding:2px 8px;border-radius:99px}
.win-fix{margin:0 0 6px}
.win-src{font-size:.88rem}
.more{margin:16px 0 0;color:var(--ink-2)}
.fix-actions{display:flex;flex-wrap:wrap;gap:10px;align-items:center;margin-top:16px}
.kit{border:1.5px solid var(--buoy-600);background:linear-gradient(180deg,#FFF9F4,#fff 40%)}
.kit h2{margin:0 0 10px;font-size:1.6rem}
.kit-grid{display:grid;gap:18px}
.price{display:flex;align-items:baseline;gap:10px;margin:0 0 12px}
.price b{font-family:var(--font-display);font-size:2.6rem;line-height:1;font-weight:600}
.price span{color:var(--ink-3);font-size:.92rem}
.kit-buy .note{margin-top:12px}
.bundle{border-top:1px solid var(--line-2);padding-top:12px}
ul.ticks{list-style:none;padding:0;margin:14px 0 0;display:grid;gap:8px}
ul.ticks li{position:relative;padding-left:28px;line-height:1.45}
ul.ticks li::before{content:"";position:absolute;left:0;top:3px;width:18px;height:18px;border-radius:50%;background:var(--harbor-100) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'%3E%3Cpath d='m6 10.2 2.6 2.6L14 7.6' fill='none' stroke='%2323704A' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center/16px no-repeat}

/* How it works */
.how{padding:48px 0;background:var(--sand);border-top:1px solid var(--line-2);border-bottom:1px solid var(--line-2)}
.how-grid{list-style:none;padding:0;margin:0;display:grid;gap:12px}
.how-card{background:var(--surface);border:1px solid var(--line);border-radius:var(--r);padding:18px}
.how-top{display:flex;justify-content:space-between;align-items:baseline;gap:8px}
.how-pts{font-family:var(--font-display);font-weight:600;font-size:1.15rem;color:var(--harbor-700);font-variant-numeric:tabular-nums}
.how-card p{font-size:.95rem;color:var(--ink-2);margin:6px 0 0}
.how-card .how-src{font-size:.85rem;margin-top:10px}
.cant-see{margin-top:20px;border-left:3px solid var(--buoy-600);padding:4px 0 4px 16px;max-width:760px}
.cant-see h3{font-family:var(--font-display);font-size:1.3rem;font-weight:600}
.cant-see p{color:var(--ink-2);margin:0}

/* Guides */
.guides,.related{padding:48px 0}
.guide-grid-list{list-style:none;padding:0;margin:0;display:grid;gap:12px}
.guide-card{display:flex;flex-direction:column;gap:6px;height:100%;padding:18px;background:var(--surface);border:1px solid var(--line);border-radius:var(--r);text-decoration:none;color:var(--ink);transition:border-color .15s,box-shadow .15s,transform .15s}
.guide-card:hover{border-color:var(--harbor-600);box-shadow:var(--shadow);color:var(--ink);transform:translateY(-1px)}
.guide-t{font-family:var(--font-display);font-size:1.22rem;font-weight:600;line-height:1.2}
.guide-d{font-size:.93rem;color:var(--ink-2)}
.guide-go{margin-top:auto;padding-top:6px;font-weight:650;font-size:.92rem;color:var(--harbor-600);display:flex;gap:6px;align-items:center}
.also{margin-top:22px;padding:16px 18px;background:var(--harbor-50);border:1px solid var(--harbor-100);border-radius:var(--r)}
.also p{margin:0}

/* Guide pages */
.guide-hero{padding:24px 0 28px;border-bottom:1px solid var(--line-2);background:linear-gradient(180deg,var(--sand),var(--paper))}
.crumbs{display:flex;gap:8px;align-items:center;font-size:.9rem;margin-bottom:14px;color:var(--ink-3)}
.crumbs a{display:inline-flex;align-items:center;min-height:44px}
.guide-hero h1{font-size:2.1rem;max-width:22ch}
.meta{font-size:.88rem;color:var(--ink-3);margin:0}
.guide-layout{display:grid;gap:28px;padding-top:12px;padding-bottom:12px}
.prose{min-width:0;max-width:720px}
.prose>h2{font-size:1.6rem;margin-top:36px}
.prose ul,.prose ol{padding-left:22px}
.prose li{margin:8px 0}
.prose ul.checks{padding-left:0}
.prose .template{background:var(--surface);border:1px solid var(--line);border-left:4px solid var(--harbor-600);border-radius:var(--r);padding:18px 18px 4px;margin:16px 0;position:relative}
.copy-btn{position:absolute;top:10px;right:10px}
.prose .template.has-copy{padding-top:62px}
.table-wrap{overflow-x:auto;-webkit-overflow-scrolling:touch;border:1px solid var(--line);border-radius:var(--r);background:var(--surface);margin:14px 0}
table{width:100%;border-collapse:collapse;min-width:520px}
td,th{padding:12px 14px;border-bottom:1px solid var(--line-2);text-align:left;font-size:.94rem;vertical-align:top}
tr:last-child td{border-bottom:0}
th{background:var(--harbor-50);font-weight:700;font-size:.85rem;text-transform:uppercase;letter-spacing:.04em;color:var(--harbor-800)}
.cta-band{display:grid;gap:14px;background:var(--harbor-900);color:#E6EFEC;border-radius:var(--r-lg);padding:22px;margin:36px 0 20px}
.cta-band h2{color:#fff;margin:0 0 6px;font-size:1.5rem}
.cta-band p{margin:0}
.cta-band .btn-primary{background:var(--buoy-400);color:var(--harbor-900)}
.cta-band .btn-primary:hover{background:#F6B88D;color:var(--harbor-900)}
.cta-band :focus-visible{outline-color:#fff}
.kit-inline{margin:0 0 20px}
.kit-inline h2{font-size:1.4rem}
.guide-side{display:none}
.toc ol{list-style:none;padding:0;margin:0;border-left:2px solid var(--line)}
.toc a{display:block;padding:6px 0 6px 14px;margin-left:-2px;border-left:2px solid transparent;color:var(--ink-2);text-decoration:none;font-size:.92rem;line-height:1.35}
.toc a:hover{color:var(--harbor-700);border-left-color:var(--harbor-600)}
.side-score{margin-top:24px;padding:18px}
.side-score-top{display:flex;gap:14px;align-items:center;margin-bottom:14px}
.side-score-top p{margin:0;font-size:.92rem;line-height:1.4}
.related{background:var(--sand);border-top:1px solid var(--line-2)}
.related h2{margin-top:0}
.nf{padding:56px 0 64px}

/* Footer */
.site-foot{background:var(--harbor-900);color:#C9D8D4;padding:44px 0 28px;font-size:.95rem}
.site-foot a{color:#fff}
.site-foot a:hover{color:var(--buoy-400)}
.site-foot :focus-visible{outline-color:var(--buoy-400)}
.logo-inverse{color:#fff}
.logo-inverse .mark rect{stroke:rgba(247,243,234,.35);stroke-width:1.5}
.foot-grid{display:grid;gap:28px}
.foot-h{font-family:var(--font-text);font-size:.78rem;letter-spacing:.09em;text-transform:uppercase;color:var(--buoy-400);margin:0 0 10px}
.site-foot ul{list-style:none;padding:0;margin:0}
.site-foot li a{display:inline-flex;align-items:center;min-height:44px;text-decoration:none}
.site-foot li a:hover{text-decoration:underline}
.foot-brand p{max-width:44ch;margin-top:12px}
.foot-contact a{word-break:break-all}
.foot-legal{border-top:1px solid rgba(255,255,255,.14);margin-top:28px;padding-top:18px;font-size:.84rem;color:#A9BDB8}
.foot-legal p{max-width:90ch}

/* Sticky bottom CTA, phones only. Respects the iPhone home indicator. */
.sticky-cta{position:fixed;left:0;right:0;bottom:0;z-index:40;background:rgba(255,255,255,.96);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border-top:1px solid var(--line);box-shadow:0 -8px 24px -16px rgba(12,43,41,.3);padding:10px max(16px,env(safe-area-inset-right)) calc(10px + var(--safe-b)) max(16px,env(safe-area-inset-left));transition:transform .25s}
.sticky-cta.away{transform:translateY(110%)}
.sticky-inner{display:flex;align-items:center;justify-content:space-between;gap:12px;max-width:640px;margin:0 auto}
.sticky-msg{font-size:.88rem;color:var(--ink-2);line-height:1.3}
.sticky-score{display:flex;align-items:baseline;gap:4px;flex-wrap:wrap}
.sticky-score b{font-family:var(--font-display);font-size:1.7rem;line-height:1;font-variant-numeric:tabular-nums}
.sticky-score small{color:var(--ink-3)}
.sticky-score span{font-size:.85rem;font-weight:650;margin-left:6px}
.sticky-cta .btn{flex:none}

/* 430px and up: roomier phones */
@media (min-width:420px){h1{font-size:2.55rem}}

/* Tablet */
@media (min-width:720px){
  :root{--gutter:32px}
  h1{font-size:3.1rem}
  .logo-by{display:inline}
  .how-grid,.guide-grid-list{grid-template-columns:repeat(2,1fr)}
  .kit-grid{grid-template-columns:1.4fr 1fr;align-items:start}
  .cta-band{grid-template-columns:1fr auto;align-items:center}
  .foot-grid{grid-template-columns:1.4fr 1fr 1fr}
  .assure{display:flex;gap:20px}
  .hero-cta .btn{flex:0 0 auto}
  .form-actions .btn{flex:0 0 auto}
  .panel{padding:28px}
}

/* Desktop: full nav, two-column hero and tool, sticky live score, no bottom bar */
@media (min-width:1000px){
  body{padding-bottom:0}
  .sticky-cta{display:none}
  .nav-main{display:flex;align-items:center;gap:26px}
  .nav-main a:not(.btn){color:var(--ink-2);text-decoration:none;font-weight:550;font-size:.97rem;min-height:44px;display:inline-flex;align-items:center}
  .nav-main a:not(.btn):hover{color:var(--harbor-700)}
  .nav-mobile{display:none}
  .head-row{min-height:68px}
  .hero{padding:64px 0 72px}
  .hero-grid{grid-template-columns:1.05fr .95fr;align-items:center;gap:56px}
  h1{font-size:3.6rem}
  .lead{font-size:1.2rem}
  .pov{padding:56px 0}
  .pov-grid{grid-template-columns:1.1fr 1fr;gap:56px;align-items:center}
  .pov-big{font-size:2.1rem}
  .tool{padding:72px 0 40px}
  .section-head h2{font-size:2.5rem}
  .tool-grid{grid-template-columns:minmax(0,1.35fr) minmax(0,1fr);align-items:start;gap:28px}
  .live{position:sticky;top:88px}
  .how,.guides,.related{padding:72px 0}
  .how-grid,.guide-grid-list{grid-template-columns:repeat(3,1fr)}
  .guide-hero{padding:40px 0 44px}
  .guide-hero h1{font-size:3rem}
  .guide-layout{grid-template-columns:minmax(0,1fr) 300px;gap:56px;padding-top:24px}
  .guide-side{display:block;position:sticky;top:96px;align-self:start;padding-top:30px}
}
@media print{
  .site-head,.site-foot,.sticky-cta,.hero,.pov,.how,.guides,.form,.kit,.fix-actions{display:none!important}
  body{background:#fff;padding:0}
  .tool-grid{display:block}.panel{box-shadow:none;border-color:#ccc}
  .cat details{display:block}.cat details>*{display:block}
}