/* Keepmine AI web: the same night-green house as the product, a calm light page beneath. Fonts are served from
   this site, so a visit sends nothing to any other company (12 Nov 2026). */
@font-face{font-family:"Inter";src:url("/fonts/inter.woff2") format("woff2");font-weight:100 900;font-style:normal;font-display:swap}
@font-face{font-family:"Sora";src:url("/fonts/sora.woff2") format("woff2");font-weight:100 800;font-style:normal;font-display:swap}
:root{
  --bg:#f4f6f3; --surface:#ffffff; --ink:#17201c; --muted:#56655e; --line:#dce4de;
  --night:#12211d; --night-2:#1d322b; --on-night:#e3eae6; --on-night-muted:#a9bab2; --night-line:rgba(227,234,230,.14);
  --mint:#5cc294; --accent:#2c7a57; --amber:#e3a557; --amber-hover:#ecb46d; --amber-ink:#8a5a14; --on-amber:#1b1206;
  --ok-bg:#e3f2e9; --ok-fg:#1f6b4a; --warn:#b5482f;
  --shadow:0 30px 60px -28px rgba(10,24,19,.45);
  --display:"Sora","Avenir Next","Segoe UI",system-ui,sans-serif;
  --body:"Inter","Segoe UI",system-ui,-apple-system,sans-serif;
  --mono:ui-monospace,"SFMono-Regular",Menlo,Consolas,monospace;
}
@media (prefers-color-scheme: dark){:root:not([data-theme="light"]){
  --bg:#0d1714; --surface:#14231e; --ink:#e3eae6; --muted:#a3b4ac; --line:#24372f;
  --accent:#6fd0a3; --amber-ink:#f0c27f; --ok-bg:#173a2b; --ok-fg:#93e2bd; --warn:#ff9c85;
  --shadow:0 30px 60px -28px rgba(0,0,0,.7); color-scheme:dark}}
:root[data-theme="dark"]{
  --bg:#0d1714; --surface:#14231e; --ink:#e3eae6; --muted:#a3b4ac; --line:#24372f;
  --accent:#6fd0a3; --amber-ink:#f0c27f; --ok-bg:#173a2b; --ok-fg:#93e2bd; --warn:#ff9c85;
  --shadow:0 30px 60px -28px rgba(0,0,0,.7); color-scheme:dark}

*{box-sizing:border-box}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}
@media (prefers-reduced-motion: reduce){html{scroll-behavior:auto}*{transition:none!important;animation:none!important}}
body{margin:0;background:var(--bg);color:var(--ink);font:400 17px/1.6 var(--body);-webkit-font-smoothing:antialiased}
img,video{max-width:100%;display:block}
a{color:var(--accent);text-underline-offset:3px}
:focus-visible{outline:3px solid var(--amber);outline-offset:3px;border-radius:6px}
.wrap{max-width:1160px;margin:0 auto;padding-left:max(16px,env(safe-area-inset-left,0px));padding-right:max(16px,env(safe-area-inset-right,0px))}
.narrow{max-width:820px}
h1,h2,h3{font-family:var(--display);text-wrap:balance;margin:0;font-weight:700}
h2{font-size:clamp(28px,3.4vw,40px);line-height:1.12;letter-spacing:-.01em}
h3{font-size:19px;line-height:1.3;font-weight:600}
p{margin:0}
.eyebrow{font:600 13px/1.2 var(--body);letter-spacing:.12em;text-transform:uppercase;color:var(--accent)}
.night .eyebrow{color:var(--mint)}
.lede{font-size:19px;color:var(--muted);max-width:60ch}
.section{padding-block:clamp(64px,9vw,112px)}
.section.tight{padding-top:0}
.section-head{display:grid;gap:14px;max-width:760px;margin-bottom:40px}
.mono{font-family:var(--mono);font-size:.95em}
.skip{position:absolute;left:-9999px;top:8px;background:var(--amber);color:var(--on-amber);padding:10px 14px;border-radius:8px;z-index:50}
.skip:focus{left:max(16px,env(safe-area-inset-left,0px))}

/* top bar */
body::before{content:"";position:fixed;inset:0 0 auto;height:env(safe-area-inset-top,0px);z-index:21;background:var(--night)}
.topbar{position:sticky;top:env(safe-area-inset-top,0px);z-index:20;background:color-mix(in srgb,var(--night) 94%,transparent);backdrop-filter:blur(10px);border-bottom:1px solid rgba(255,255,255,.06)}
.topbar .wrap{display:flex;align-items:center;gap:24px;min-height:64px}
.lockup{display:flex;align-items:center;gap:10px;text-decoration:none;color:var(--on-night)}
.lockup b{font:700 17px/1 var(--display);letter-spacing:.06em}
.lockup b span{color:var(--mint);font-weight:600}
.nav{display:flex;gap:22px;margin-left:auto;align-items:center}
.nav a{color:var(--on-night-muted);text-decoration:none;font-size:15px;font-weight:500}
.nav a:hover{color:var(--on-night)}
@media (max-width:820px){.nav a:not(.btn){display:none}}

/* buttons */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;font:600 16px/1 var(--body);text-decoration:none;border-radius:999px;padding:15px 24px;min-height:50px;border:0;cursor:pointer;white-space:nowrap}
.btn-amber,.nav a.btn-amber{background:var(--amber);color:var(--on-amber)}
.btn-amber:hover,.nav a.btn-amber:hover{background:var(--amber-hover);color:var(--on-amber)}
.btn[disabled]{opacity:.7;cursor:progress}
.nav .btn{padding:11px 18px;min-height:42px;font-size:15px}

/* night bands */
.night{background:var(--night);color:var(--on-night)}
.night .lede{color:var(--on-night-muted)}
.hero{padding-block:clamp(40px,6vw,80px) clamp(48px,7vw,88px)}
.hero-grid{display:grid;grid-template-columns:minmax(0,7fr) minmax(0,4fr);gap:clamp(32px,5vw,72px);align-items:center}
.hero-copy{display:grid;gap:22px;min-width:0}
.hero h1{font-size:clamp(40px,6vw,74px);line-height:1.02;letter-spacing:-.02em;max-width:13ch}
.hero h1 em{font-style:normal;color:var(--mint)}
.hero .lede{font-size:clamp(18px,1.6vw,21px)}
.terms{font-size:15px;color:var(--on-night-muted)}
.terms b{color:var(--amber);font-family:var(--display);font-weight:600}
@media (max-width:900px){.hero-grid{grid-template-columns:minmax(0,1fr)}}

/* the sign-up form */
.signup{display:grid;gap:14px;background:var(--night-2);border:1px solid var(--night-line);border-radius:20px;padding:clamp(18px,2.6vw,26px);max-width:620px}
.signup .label{font-weight:600;color:var(--on-night)}
.signup .row{display:flex;gap:10px;flex-wrap:wrap}
.signup input[type=email]{flex:1 1 240px;min-width:0;font:inherit;font-size:17px;padding:13px 16px;min-height:52px;border-radius:999px;border:1.5px solid rgba(227,234,230,.25);background:var(--night);color:var(--on-night)}
.signup input[type=email]::placeholder{color:#7f938a}
.signup input[type=email]:focus{outline:none;border-color:var(--mint);box-shadow:0 0 0 3px rgba(92,194,148,.25)}
.signup .btn{flex:0 0 auto}
@media (max-width:480px){.signup .btn{flex:1 1 100%}}
.which{border:0;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:8px;align-items:center}
.which legend{float:left;margin-right:6px;font-size:15px;color:var(--on-night-muted);padding:0}
.which input{position:absolute;opacity:0;pointer-events:none}
.which label{border:1.5px solid rgba(227,234,230,.22);border-radius:999px;padding:7px 14px;cursor:pointer;font-size:15px;font-weight:500;min-height:38px;display:inline-flex;align-items:center;color:var(--on-night)}
.which input:checked+label{border-color:var(--mint);background:rgba(92,194,148,.16);color:#c9f0dc}
.which input:focus-visible+label{outline:3px solid var(--amber);outline-offset:2px}
.consent{font-size:14px;color:var(--on-night-muted);max-width:60ch}
.consent a{color:var(--mint)}
.hp{position:absolute;left:-10000px;width:1px;height:1px;overflow:hidden}
.msg{min-height:1.4em;font-size:15px;color:#ffb4a3}
.msg:empty{display:none}
.done{display:grid;gap:8px}
.done b{font:700 22px/1.2 var(--display);color:var(--mint)}
.done p{color:var(--on-night-muted)}

/* the film */
.film{display:grid;gap:12px;justify-items:center;min-width:0}
.film-frame{width:100%;max-width:340px;aspect-ratio:9/16;border-radius:26px;overflow:hidden;background:#0a1411;border:1px solid rgba(255,255,255,.1);box-shadow:var(--shadow)}
.film-frame video{width:100%;height:100%;object-fit:cover;background:#0a1411}
.film .caption{font-size:14px;color:var(--on-night-muted);text-align:center;max-width:34ch}

/* features */
.cards{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:22px}
.card{background:var(--surface);border:1px solid var(--line);border-radius:20px;overflow:hidden;display:grid;grid-template-rows:auto 1fr;min-width:0}
.card figure{margin:0;background:var(--night-2);aspect-ratio:16/10;overflow:hidden;border-bottom:1px solid var(--line)}
.card figure img{width:100%;height:100%;object-fit:cover;object-position:top left}
.card div{padding:20px 22px 24px;display:grid;gap:8px;align-content:start}
.card p{color:var(--muted);font-size:16px}
@media (max-width:900px){.cards{grid-template-columns:minmax(0,1fr)}.card figure{aspect-ratio:16/9}}
.also{display:flex;flex-wrap:wrap;gap:10px 12px;margin-top:26px;padding:0;list-style:none}
.also li{background:var(--surface);border:1px solid var(--line);border-radius:999px;padding:8px 14px;font-size:15px;color:var(--muted)}

/* what leaves this computer */
.leaves{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);gap:clamp(28px,5vw,72px);align-items:start}
.leaves-head{display:grid;gap:16px}
.ledger{list-style:none;margin:0;padding:0;border-top:1px solid var(--night-line)}
.ledger li{display:grid;grid-template-columns:minmax(0,11rem) minmax(0,1fr);gap:18px;padding:18px 0;border-bottom:1px solid var(--night-line)}
.ledger b{font-family:var(--display);font-weight:600;color:var(--on-night)}
.ledger span{color:var(--on-night-muted)}
.ledger .never b{color:var(--mint)}
@media (max-width:860px){.leaves{grid-template-columns:minmax(0,1fr)}.ledger li{grid-template-columns:minmax(0,1fr);gap:4px}}

/* before you install, summary */
.heads{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px}
.heads > div{border-top:2px solid var(--ink);padding-top:16px;display:grid;gap:10px;align-content:start;min-width:0}
.heads ul{margin:0;padding-left:18px;display:grid;gap:6px;color:var(--muted);font-size:16px}
.heads kbd,.guide kbd{font:600 .88em/1 var(--mono);background:var(--surface);border:1px solid var(--line);border-bottom-width:2px;border-radius:6px;padding:2px 6px;white-space:nowrap;color:var(--ink)}
@media (max-width:900px){.heads{grid-template-columns:minmax(0,1fr)}}
.more-link{margin-top:26px;font-weight:600}

/* requirements */
.req{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:1px;background:var(--line);border:1px solid var(--line);border-radius:18px;overflow:hidden;margin-top:40px}
.req div{background:var(--surface);padding:20px;display:grid;gap:4px;align-content:start;min-width:0}
.req dt{font-size:13px;letter-spacing:.1em;text-transform:uppercase;color:var(--muted);font-weight:600}
.req dd{margin:0;font-weight:500}
.req dd small{display:block;color:var(--muted);font-weight:400;font-size:14px;margin-top:4px}
@media (max-width:900px){.req{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:520px){.req{grid-template-columns:minmax(0,1fr)}}

/* price band */
.price{display:grid;grid-template-columns:minmax(0,6fr) minmax(0,5fr);gap:clamp(28px,5vw,64px);align-items:center}
.price-copy{display:grid;gap:18px;min-width:0}
.amount{display:flex;align-items:baseline;gap:12px;flex-wrap:wrap}
.amount b{font:700 clamp(52px,6vw,72px)/1 var(--display);color:var(--amber);letter-spacing:-.02em}
.amount span{color:var(--on-night-muted)}
.ticks{list-style:none;padding:0;margin:0;display:grid;gap:8px}
.ticks li{padding-left:26px;position:relative}
.ticks li::before{content:"";position:absolute;left:2px;top:.55em;width:12px;height:7px;border-left:2px solid var(--mint);border-bottom:2px solid var(--mint);transform:rotate(-45deg)}
@media (max-width:900px){.price{grid-template-columns:minmax(0,1fr)}}

/* guide pages */
.page-head{padding-block:clamp(40px,6vw,72px)}
.page-head .wrap{display:grid;gap:16px}
.page-head h1{font-size:clamp(34px,4.6vw,54px);line-height:1.06;letter-spacing:-.015em}
.guide{display:grid;gap:clamp(40px,6vw,64px)}
.guide section{display:grid;gap:14px}
.guide h2{font-size:clamp(24px,2.8vw,32px)}
.guide h3{margin-top:8px}
.guide p,.guide li{color:var(--muted);max-width:68ch}
.guide p strong,.guide li strong{color:var(--ink)}
.guide ol,.guide ul{margin:0;padding-left:22px;display:grid;gap:8px}
.guide .two{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px}
.guide .box{background:var(--surface);border:1px solid var(--line);border-radius:18px;padding:clamp(18px,2.4vw,24px);display:grid;gap:10px;align-content:start;min-width:0}
.guide .note{border-left:3px solid var(--amber);padding:4px 0 4px 16px}
.guide .toc{display:flex;flex-wrap:wrap;gap:8px 18px;font-weight:600}
@media (max-width:760px){.guide .two{grid-template-columns:minmax(0,1fr)}}

footer{border-top:1px solid var(--line);padding-block:36px 48px;color:var(--muted);font-size:14px}
footer .wrap{display:grid;gap:12px}
footer nav{display:flex;flex-wrap:wrap;gap:8px 20px;font-weight:600}