/* Hunker website. Tokens and sizes from docs/design/Hunker Website.dc.html (claude.ai/design). */
*{box-sizing:border-box}
:root{--bg:#F3F2EF;--card:#fff;--ink:#111;--sub:#5E5E66;--line:rgba(0,0,0,.09);--red:#C42A1C;--amber:#E59A12;--btn:#111;--on-btn:#fff;--bezel:#111;
  --round:ui-rounded,"SF Pro Rounded",-apple-system,system-ui,sans-serif;color-scheme:light dark}
@media (prefers-color-scheme:dark){:root{--bg:#0E0E10;--card:#1A1A1E;--ink:#F5F5F7;--sub:#A1A1A8;--line:rgba(255,255,255,.1);--red:#FF6B5C;--amber:#FFB547;--btn:#F5F5F7;--on-btn:#000;--bezel:#000}}
body{margin:0;background:var(--bg);color:var(--ink);font:17px/1.5 -apple-system,"SF Pro Text",system-ui,sans-serif;-webkit-text-size-adjust:100%}
a{color:inherit}
h1,h2,.title{font-family:var(--round);font-weight:800;text-wrap:balance}
p,li{text-wrap:pretty}

/* Header and footer */
.top{height:60px;padding:0 12px 0 20px;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid var(--line)}
.brand{display:flex;align-items:center;gap:9px;text-decoration:none;font:800 20px var(--round)}
.ring{display:block;flex:none;width:18px;height:18px;border-radius:50%;border:3.5px solid var(--ink)}
.nav{display:flex;font-size:15px;font-weight:600}
.nav a{text-decoration:none;color:var(--sub);padding:12px 10px}
.nav a[aria-current]{color:var(--ink)}
.foot{margin-top:56px;border-top:1px solid var(--line);padding:20px 20px 36px}
.foot .brand{display:none}
.foot .links{display:flex;font-size:16px;font-weight:600;margin-left:-10px}
.foot .links a{text-decoration:none;padding:12px 10px}
.foot p{margin:8px 0 0;font-size:15px;line-height:1.45;color:var(--sub)}

/* Marks */
.tri{display:block;width:22px;height:19px;background:var(--red);clip-path:polygon(50% 0,100% 100%,0 100%)}
.dia{display:block;width:15px;height:15px;background:var(--amber);transform:rotate(45deg);margin:2px 3px}
.mark-ring{width:22px;height:22px}
.tri.sm{width:11px;height:10px}

/* Official Apple badge (Apple Marketing Tools). Not a link until the app is live. */
.badge{display:block;flex:none;height:56px;width:auto}
.cta{display:flex;align-items:center;gap:16px;margin-top:28px;flex-wrap:wrap}
.cta .note{font-size:15px;line-height:1.35;font-weight:600;color:var(--sub)}
.cta .note span{display:block}

/* Home */
.hero{padding:32px 20px 0}
.hero h1{margin:0;font-size:36px;line-height:1.08;letter-spacing:-.6px}
.lead{margin:18px 0 0;font-size:18px;line-height:1.5;color:var(--sub)}
.shot{display:flex;flex-direction:column;align-items:center;gap:12px;margin:0}
.phone{display:block;width:100%;max-width:320px;border-radius:46px;padding:7px;background:var(--bezel);box-shadow:0 0 0 1px var(--line),0 24px 60px rgba(0,0,0,.28)}
.phone img{display:block;width:100%;height:auto;border-radius:39px}
.shot figcaption{display:flex;align-items:center;justify-content:center;gap:8px;font-size:14px;line-height:1.4;color:var(--sub);text-align:center;max-width:300px}
.hero-shot{margin-top:48px}
.features{padding:56px 20px 0;display:flex;flex-direction:column;gap:48px}
.pair{display:flex;flex-direction:column;gap:48px}
.feature h2{margin:14px 0 0;font-size:28px;line-height:1.12}
.dash{list-style:none;margin:16px 0 0;padding:0;display:flex;flex-direction:column;gap:10px;font-size:17px;line-height:1.45}
.dash li{display:flex;gap:12px}
.dash li::before{content:"";width:9px;height:2px;background:var(--sub);margin-top:12px;flex:none}
.pro{margin:56px 12px 0;padding:28px 22px;border-radius:28px;background:var(--card)}
.pro .title{margin:0;font-size:26px;line-height:1.15}
.pro p{font-size:17px;line-height:1.45;color:var(--sub);margin:8px 0 0}
.pro .badge{margin-top:22px}

/* Privacy and Support */
.doc{padding:36px 22px 0}
.toc{display:none}
.doc h1{margin:0;font-size:36px;line-height:1.08;letter-spacing:-.6px}
.updated{font-size:14px;color:var(--sub);margin-top:10px}
.intro{margin:24px 0 0;font-size:19px;line-height:1.55}
.doc h2{margin:44px 0 0;font-size:23px;line-height:1.22;scroll-margin-top:24px}
.doc p{margin:12px 0 0;font-size:17px;line-height:1.65}
.doc .dash{margin-top:12px;gap:8px;line-height:1.55}
.doc .dash li::before{margin-top:13px}
.contact{margin-top:24px;padding:20px;border-radius:24px;background:var(--card)}
.contact .label{font-size:14px;font-weight:600;color:var(--sub)}
.contact .email{font:700 18px var(--round);margin-top:4px;overflow-wrap:anywhere}
.pill{height:52px;padding:0 26px;border-radius:26px;background:var(--btn);color:var(--on-btn);display:flex;align-items:center;justify-content:center;font:800 17px var(--round);text-decoration:none}
.contact .pill{margin-top:16px}
.pill.alt{background:var(--card);color:var(--ink)}

/* 404 */
.lost{min-height:100vh;display:flex;flex-direction:column}
.lost main{flex:1;display:flex;flex-direction:column;justify-content:center;padding:48px 22px}
.marks{display:flex;gap:12px;align-items:center}
.marks .mark-ring{border-color:var(--sub);width:21px;height:21px}
.code{font-size:14px;font-weight:700;color:var(--sub);margin-top:24px;letter-spacing:.4px}
.lost h1{margin:6px 0 0;font-size:36px;line-height:1.08;letter-spacing:-.6px}
.lost main p{margin:14px 0 0;font-size:17px;line-height:1.5;color:var(--sub)}
.lost .buttons{display:flex;flex-direction:column;gap:10px;margin-top:32px}
.lost .pill{height:56px;border-radius:28px;font-size:18px}
.lost .foot{margin-top:0}
.lost .foot .links,.lost .foot .brand{display:none}

@media (min-width:960px){
  .top{height:72px;padding:0 64px}
  .top .brand{gap:10px;font-size:22px}
  .top .ring{width:20px;height:20px;border-width:4px}
  .nav{gap:32px;font-size:16px}
  .nav a{padding:0}
  .wide{width:100%;max-width:1280px;margin:0 auto}
  .foot{margin-top:96px;padding:36px 64px 48px;display:flex;align-items:center;justify-content:space-between;gap:32px}
  .foot .brand{display:flex;gap:8px;font-size:17px}
  .foot .brand .ring{width:15px;height:15px;border-width:3px}
  .foot .links{align-items:center;gap:28px;font-size:15px;margin-left:0}
  .foot .links a{padding:0;color:var(--sub)}
  .foot p{margin:0}
  .hero{display:grid;grid-template-columns:minmax(0,1fr) 352px;gap:80px;align-items:center;padding:72px 96px 88px 64px}
  .hero h1{font-size:64px;line-height:1.03;letter-spacing:-1.5px;max-width:660px}
  .lead{margin-top:26px;font-size:21px;max-width:590px}
  .cta{margin-top:40px;gap:20px}
  .cta .note{font-size:16px}
  .badge{height:58px}
  .hero-shot{margin:0}
  .hero-shot .phone{max-width:302px}
  .shot figcaption{max-width:none}
  .features{display:grid;grid-template-columns:336px minmax(0,1fr) 336px;column-gap:112px;row-gap:112px;align-items:center;padding:96px 96px 0 64px;border-top:1px solid var(--line)}
  .features .alert-shot{grid-column:1;grid-row:1}
  .features .pair{grid-column:2/4;grid-row:1;gap:64px;max-width:560px}
  .features .after{grid-column:1/3;grid-row:2;max-width:560px}
  .features .report-shot{grid-column:3;grid-row:2}
  .features .phone{max-width:288px}
  .tri{width:26px;height:22px}
  .tri.sm{width:11px;height:10px}
  .dia{width:18px;height:18px;margin:2px 4px}
  .features .mark-ring{width:26px;height:26px;border-width:4px}
  .feature h2{margin-top:18px;font-size:36px;line-height:1.1;letter-spacing:-.5px}
  .dash{margin-top:20px;gap:12px;font-size:19px}
  .dash li{gap:14px}
  .dash li::before{width:10px;margin-top:13px}
  .pro{margin:112px 64px 0;padding:48px 56px;border-radius:36px;display:flex;align-items:center;justify-content:space-between;gap:40px}
  .pro .title{font-size:36px;line-height:1.1;letter-spacing:-.5px}
  .pro p{font-size:19px;margin-top:10px}
  .pro .badge{margin-top:0}
  .doc{display:grid;grid-template-columns:220px minmax(0,680px);gap:96px;padding:80px 64px 16px}
  .toc{display:block;position:sticky;top:32px;align-self:start;padding-top:14px}
  .toc .label{font-size:13px;font-weight:700;color:var(--sub);letter-spacing:.4px}
  .toc ul{list-style:none;margin:16px 0 0;padding:0;display:flex;flex-direction:column;gap:12px;font-size:15px;line-height:1.35;font-weight:500}
  .toc a{text-decoration:none;color:var(--sub)}
  .doc h1{font-size:52px;line-height:1.05;letter-spacing:-1px}
  .updated{font-size:15px;margin-top:14px}
  .intro{margin-top:32px;font-size:21px}
  .doc h2{margin-top:56px;font-size:27px;line-height:1.2;letter-spacing:-.3px}
  .doc p{margin-top:14px;font-size:18px;line-height:1.7}
  .doc .dash{margin-top:14px;font-size:18px;line-height:1.6}
  .doc .dash li::before{margin-top:14px}
  .contact{margin-top:32px;padding:24px 28px;display:flex;align-items:center;justify-content:space-between;gap:24px}
  .contact .label{font-size:15px}
  .contact .email{font-size:21px}
  .contact .pill{margin-top:0;flex:none}
  .lost main{align-items:center;text-align:center;padding:48px 64px}
  .marks{gap:14px}
  .code{font-size:15px;margin-top:28px}
  .lost h1{margin-top:8px;font-size:52px;line-height:1.05;letter-spacing:-1px}
  .lost main p{margin-top:16px;font-size:19px;max-width:520px}
  .lost .buttons{flex-direction:row;gap:12px;margin-top:36px}
  .lost .pill{padding:0 30px}
  .lost .foot{justify-content:flex-end;padding:28px 64px 36px}
}
