/* Leafkept landing page: identity v1 ("Kept", 2026-10-20). See design/DESIGN.md.
   Self-hosted OFL fonts only; no external requests. Shared with blog/ (keep legacy token names below). */
@font-face{font-family:"Fraunces";src:url(fonts/fraunces-latin-600-normal.woff2) format("woff2");font-weight:600;font-style:normal;font-display:swap}
@font-face{font-family:"Atkinson Hyperlegible Next";src:url(fonts/atkinson-hyperlegible-next-latin-400-normal.woff2) format("woff2");font-weight:400;font-style:normal;font-display:swap}
@font-face{font-family:"Atkinson Hyperlegible Next";src:url(fonts/atkinson-hyperlegible-next-latin-400-italic.woff2) format("woff2");font-weight:400;font-style:italic;font-display:swap}
@font-face{font-family:"Atkinson Hyperlegible Next";src:url(fonts/atkinson-hyperlegible-next-latin-700-normal.woff2) format("woff2");font-weight:600 800;font-style:normal;font-display:swap}

:root{
  color-scheme:light dark;
  /* palette: 1 primary, 1 accent, 3 neutrals (+ tints of the primary/accent for illustration only) */
  --fern:#1E4D36; --fern-hover:#2A6547; --sprout:#BFE0B4; --fern-soft:#DDEBD6;
  --terra:#A9481F; --terra-soft:#E9B798;
  --paper:#FBF7EF; --oat:#F1EADB; --ink:#1B2420;
  --muted:#56635B; --line:#E2D8C3; --surface:#FFFFFF;
  --err-ink:#9A3412; --err-bg:#FBEDE5; --err-line:#A9481F; --ok-ink:#1E4D36; --ok-bg:#E6F0E0; --ok-line:#2F7A4F;
  --on-fern:#FBF7EF; --btn:var(--fern); --btn-hover:var(--fern-hover); --heading:var(--fern);
  --pot:#C2653A; --pot-dark:#A9481F; --leaf-a:#1E4D36; --leaf-b:#2F7A4F; --leaf-c:#7DB98A; --vein:#FBF7EF; --blob:#E6EEDC;
  /* type */
  --display:"Fraunces",ui-serif,Georgia,serif;
  --text:"Atkinson Hyperlegible Next",system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;
  /* 8px spacing scale */
  --s1:8px;--s2:16px;--s3:24px;--s4:32px;--s5:40px;--s6:48px;--s8:64px;--s10:80px;--s12:96px;--s15:120px;
  /* radius + shadow */
  --r-sm:8px;--r-md:16px;--r-lg:24px;--r-pill:999px;
  --shadow-1:0 1px 2px rgba(27,36,32,.06),0 2px 8px rgba(27,36,32,.06);
  --shadow-2:0 2px 4px rgba(27,36,32,.06),0 16px 40px rgba(30,77,54,.14);
  --shadow-phone:0 4px 8px rgba(27,36,32,.10),0 32px 64px rgba(30,77,54,.24);
  /* legacy names used by blog/blog.css */
  --band:#1E4D36;--on-band:#FBF7EF;--band-btn:#FBF7EF;--band-btn-ink:#1E4D36;--spot-bg:#F1EADB;
  --check:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 18 18'%3E%3Cpath d='M5 9.4l2.6 2.6L13 6.6' fill='none' stroke='%232F7A4F' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
  --green:var(--fern); --green-2:var(--fern-hover); --leaf:var(--sprout); --cream:var(--oat); --accent:var(--terra); --radius:var(--r-md);
}
@media (prefers-color-scheme:dark){
  :root{
    --fern:#8CCB9C; --fern-hover:#A6D9B2; --sprout:#2C4A38; --fern-soft:#1F3328;
    --terra:#EE9A6E; --terra-soft:#5A3424;
    --paper:#111814; --oat:#18221D; --ink:#ECE6D8;
    --muted:#A9B5AC; --line:#2C3A33; --surface:#1A241F;
    --err-ink:#F4B391; --err-bg:#2A1B14; --err-line:#EE9A6E; --ok-ink:#A6D9B2; --ok-bg:#1A2E22; --ok-line:#8CCB9C;
    --on-fern:#111814; --heading:#ECE6D8;
    --pot:#B95E36; --pot-dark:#94471F; --leaf-a:#3E8A5C; --leaf-b:#5FA877; --leaf-c:#8CCB9C; --vein:#111814; --blob:#1A2A21;
    --shadow-1:0 1px 2px rgba(0,0,0,.3);
    --shadow-2:0 2px 4px rgba(0,0,0,.3),0 16px 40px rgba(0,0,0,.35);
    --shadow-phone:0 4px 8px rgba(0,0,0,.3),0 32px 64px rgba(0,0,0,.5);
    --leaf:#2C4A38;
    --band:#1D3A2B;--on-band:#ECE6D8;--band-btn:#ECE6D8;--band-btn-ink:#1D3A2B;--spot-bg:#2A3832;
    --check:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 18 18'%3E%3Cpath d='M5 9.4l2.6 2.6L13 6.6' fill='none' stroke='%238CCB9C' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
  }
}

*,*::before,*::after{box-sizing:border-box}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}
body{margin:0;font-family:var(--text);color:var(--ink);background:var(--paper);line-height:1.6;font-size:18px;text-rendering:optimizeLegibility}
h1,h2,h3{font-family:var(--display);font-weight:600;line-height:1.12;margin:0 0 var(--s2);color:var(--heading);letter-spacing:-.01em}
h1{font-size:clamp(2.5rem,5.6vw,4.25rem);letter-spacing:-.025em;line-height:1.04}
h2{font-size:clamp(1.875rem,3.4vw,2.75rem);letter-spacing:-.02em}
h3{font-size:1.25rem;line-height:1.25}
p{margin:0 0 var(--s2)}
a{color:var(--fern);text-underline-offset:.18em}
a:hover{color:var(--fern-hover)}
img,svg{max-width:100%}
.wrap{max-width:1200px;margin:0 auto;padding:0 var(--s3)}
.narrow{max-width:800px}
.center{text-align:center}
.nw{white-space:nowrap}
h1,h2{text-wrap:balance}
p,li,h3,summary,.faq p{text-wrap:pretty}
.muted{color:var(--muted)}
.small{font-size:.9rem;color:var(--muted)}
.sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
section{padding:var(--s12) 0}
:focus-visible{outline:3px solid var(--terra);outline-offset:3px;border-radius:4px}

/* header */
.site-header{position:sticky;top:0;z-index:10;background:color-mix(in srgb,var(--paper) 90%,transparent);backdrop-filter:saturate(1.4) blur(10px);-webkit-backdrop-filter:saturate(1.4) blur(10px);border-bottom:1px solid var(--line)}
.header-inner{display:flex;align-items:center;justify-content:space-between;height:72px;gap:var(--s2)}
.brand{display:flex;gap:10px;align-items:center;text-decoration:none;color:var(--fern);font-family:var(--display);font-weight:600;font-size:1.5rem;letter-spacing:-.01em}
.brand svg{flex:none}
.brand span{color:var(--heading)}
.brand small{display:none}
.site-header nav{display:flex;gap:var(--s3);align-items:center}
.site-header nav a{text-decoration:none;color:var(--ink);font-size:1rem}
.site-header nav a:not(.btn):hover{color:var(--fern);text-decoration:underline}

/* buttons */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:48px;background:var(--btn);color:var(--on-fern);border:0;border-radius:var(--r-pill);padding:12px 24px;font:700 1rem/1.2 var(--text);text-decoration:none;cursor:pointer;transition:background-color .15s,transform .15s}
.btn:hover{background:var(--btn-hover);color:var(--on-fern)}
.btn:active{transform:translateY(1px)}
.btn-small{min-height:40px;padding:8px 18px;font-size:.95rem;white-space:nowrap}
.site-header nav a.btn,.site-header nav a.btn:hover{color:var(--on-fern);text-decoration:none}

/* hero */
.hero{position:relative;overflow:hidden;padding:var(--s10) 0 var(--s12);background:var(--paper)}
.hero-grid{display:grid;grid-template-columns:minmax(0,1.05fr) minmax(0,.95fr);gap:var(--s6);align-items:center}
.eyebrow{display:inline-flex;align-items:center;gap:8px;font-size:.875rem;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--terra);margin:0 0 var(--s3)}
.eyebrow::before{content:"";width:8px;height:8px;border-radius:50%;background:currentColor}
.hero h1{max-width:12ch;margin-bottom:var(--s3)}
.subhead{font-size:1.25rem;line-height:1.55;color:var(--ink);max-width:34em;opacity:.92}
.waitlist{display:grid;grid-template-columns:1fr auto;gap:12px;margin-top:var(--s4);max-width:560px;padding:var(--s1);background:var(--surface);border:1px solid var(--line);border-radius:var(--r-lg);box-shadow:var(--shadow-1)}
.waitlist input[type=email]{grid-column:1/2;min-height:48px;padding:12px 16px;border:0;border-radius:var(--r-md);font:400 1.05rem var(--text);background:transparent;color:var(--ink)}
.waitlist input[type=email]::placeholder{color:var(--muted)}
.waitlist input[type=email]:focus-visible{outline:3px solid var(--terra);outline-offset:0}
.waitlist .btn{grid-column:2/3;grid-row:1/2}
.platform{grid-column:1/3;border:0;margin:0;padding:4px 12px 0;display:flex;flex-wrap:wrap;gap:var(--s3);font-size:1rem;border-top:1px solid var(--line);padding-top:12px}
.platform label{display:inline-flex;align-items:center;gap:8px;cursor:pointer;min-height:32px}
.platform input{accent-color:var(--fern);width:18px;height:18px;margin:0}
.micro{grid-column:1/3;font-size:.875rem;color:var(--muted);margin:0;padding:0 12px 8px}
.form-msg{grid-column:1/3;margin:0 4px 4px;padding:10px 14px;display:flex;align-items:flex-start;gap:10px;font-size:.95rem;line-height:1.45;font-weight:700;color:var(--err-ink);background:var(--err-bg);border:1px solid var(--err-line);border-left-width:4px;border-radius:var(--r-sm)}
.form-msg:empty{display:none}
.hp{position:absolute;left:-9999px}
/* Form states. main.js (current) only writes error text into .form-msg (success swaps to #success), so the default
   non-empty look is the error state: "!" icon + text, never colour alone. Optional hooks for later:
   data-state="success|loading" or .is-success/.is-loading on .form-msg or the form. AA-checked in light and dark. */
.form-msg::before{content:"!";flex:none;width:20px;height:20px;margin-top:1px;border-radius:50%;display:grid;place-items:center;font:800 13px/1 var(--text);background:var(--err-ink);color:var(--err-bg)}
.form-msg[data-state=success],.form-msg.is-success,.waitlist[data-state=success] .form-msg,.waitlist.is-success .form-msg{color:var(--ok-ink);background:var(--ok-bg);border-color:var(--ok-line)}
.form-msg[data-state=success]::before,.form-msg.is-success::before,.waitlist[data-state=success] .form-msg::before,.waitlist.is-success .form-msg::before{content:"";background:var(--ok-ink) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 18 18'%3E%3Cpath d='M5 9.4l2.6 2.6L13 6.6' fill='none' stroke='white' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center/18px no-repeat}
@media (prefers-color-scheme:dark){.form-msg[data-state=success]::before,.form-msg.is-success::before,.waitlist[data-state=success] .form-msg::before,.waitlist.is-success .form-msg::before{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 18 18'%3E%3Cpath d='M5 9.4l2.6 2.6L13 6.6' fill='none' stroke='%23111814' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E")}}
.form-msg[data-state=loading],.form-msg.is-loading,.waitlist[data-state=loading] .form-msg,.waitlist.is-loading .form-msg{font-weight:400;color:var(--muted);background:var(--oat);border-color:var(--line)}
.form-msg[data-state=loading]::before,.form-msg.is-loading::before,.waitlist[data-state=loading] .form-msg::before,.waitlist.is-loading .form-msg::before{content:"";width:16px;height:16px;margin:3px 2px 0;background:none;border:2.5px solid var(--line);border-top-color:var(--fern);animation:spin .8s linear infinite}
@keyframes spin{to{transform:rotate(360deg)}}
.waitlist:has(.form-msg:not(:empty):not([data-state=success]):not([data-state=loading]):not(.is-success):not(.is-loading)),.waitlist:has(input[aria-invalid=true]){border-color:var(--err-line)}
.waitlist .btn:disabled,.waitlist .btn[aria-busy=true],.waitlist[aria-busy=true] .btn{opacity:.75;cursor:progress}
.waitlist .btn:disabled:hover{background:var(--btn)}
.success{margin-top:var(--s4);padding:var(--s3);background:var(--surface);border:1.5px solid var(--sprout);border-radius:var(--r-lg);max-width:560px;box-shadow:var(--shadow-1)}
.success h2{font-size:1.75rem}
.trust{list-style:none;padding:0;margin:var(--s3) 0 0;display:flex;flex-wrap:wrap;gap:var(--s1) var(--s3)}
.trust li{display:inline-flex;align-items:center;gap:8px;font-size:.95rem;color:var(--ink)}
.trust li::before{content:"";width:18px;height:18px;flex:none;border-radius:50%;background:var(--fern-soft) var(--check) center/18px no-repeat}

/* hero art: illustration + phone */
.hero-art{position:relative;min-height:600px;display:flex;justify-content:center;align-items:center}
.hero-illo{position:absolute;inset:0;margin:auto;width:100%;max-width:560px;height:auto}
.hero-art .phone{position:relative;z-index:2}

/* illustration palette (shared by every illustration on the page) */
.i-blob{fill:var(--blob)}.i-pot{fill:var(--pot)}.i-pot-d{fill:var(--pot-dark)}
.i-a{fill:var(--leaf-a)}.i-b{fill:var(--leaf-b)}.i-c{fill:var(--leaf-c)}
.i-vein{fill:none;stroke:var(--vein);stroke-width:2;stroke-linecap:round;opacity:.55}
.i-stem{fill:none;stroke:var(--leaf-a);stroke-width:3;stroke-linecap:round}
.i-soil{fill:#5B3A26}.i-oat{fill:var(--oat)}.i-line{fill:none;stroke:var(--line);stroke-width:3;stroke-linecap:round}
.i-water{fill:#7FB3D5}
.sway{transform-box:fill-box;transform-origin:50% 100%;animation:sway 7s ease-in-out infinite}
.sway-2{animation-duration:9s;animation-delay:-3s}
@keyframes sway{0%,100%{transform:rotate(-1.5deg)}50%{transform:rotate(1.5deg)}}

/* phone mockup (screens stay in the light app theme in both page modes) */
.phone{--p-ink:#1B2420;--p-muted:#56635B;--p-line:#E7DFCF;--p-bg:#FBF7EF;--p-card:#FFFFFF;--p-fern:#1E4D36;--p-fern2:#2F7A4F;--p-soft:#DDEBD6;--p-terra:#A9481F;
  width:288px;aspect-ratio:288/592;flex:none;border-radius:48px;background:#0F1512;padding:11px;box-shadow:var(--shadow-phone);color:var(--p-ink);font-family:var(--text);text-align:left}
.screen{position:relative;height:100%;border-radius:38px;background:var(--p-bg);overflow:hidden;display:flex;flex-direction:column;font-size:13px;line-height:1.35}
.island{position:absolute;top:10px;left:50%;width:84px;height:24px;margin-left:-42px;border-radius:20px;background:#0F1512}
.status{display:flex;justify-content:space-between;padding:14px 26px 0;font-weight:700;font-size:12px}
.status i{font-style:normal;letter-spacing:1px}
.app{flex:1;padding:18px 16px 0;overflow:hidden}
.app-title{font-family:var(--display);font-weight:600;font-size:26px;line-height:1.1;margin:0 0 2px;color:var(--p-ink);letter-spacing:-.01em}
.app-sub{color:var(--p-muted);font-size:12px;margin:0 0 12px}
.room{display:flex;justify-content:space-between;align-items:center;margin:14px 2px 8px;font-size:11px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--p-muted)}
.task{display:flex;align-items:center;gap:10px;background:var(--p-card);border:1px solid var(--p-line);border-radius:14px;padding:9px 10px;margin-bottom:6px}
.task .thumb{width:34px;height:34px;flex:none;border-radius:10px;background:var(--p-soft);display:grid;place-items:center}
.task .thumb svg{width:22px;height:22px}
.task .t{flex:1;min-width:0;display:flex;flex-direction:column}
.task b{font-size:13.5px}
.task small{color:var(--p-muted);font-size:11.5px}
.tag{display:inline-block;font-size:10.5px;font-weight:700;color:var(--p-terra);}
.tick{width:30px;height:30px;flex:none;border-radius:50%;border:2px solid var(--p-fern2);display:grid;place-items:center}
.tick svg{width:14px;height:14px}
.tick.done{background:var(--p-fern2)}
.task.is-done{opacity:.6}
.task.is-done b{text-decoration:line-through}
.bulk{display:block;margin:4px 0 0;text-align:center;background:var(--p-soft);color:var(--p-fern);border-radius:999px;padding:8px;font-weight:700;font-size:12px}
.tabbar{display:flex;justify-content:space-around;align-items:center;padding:8px 6px 18px;border-top:1px solid var(--p-line);background:var(--p-card);font-size:10.5px;color:var(--p-muted);position:relative}
.tabbar span{display:flex;flex-direction:column;align-items:center;gap:2px}
.tabbar span::before{content:"";width:18px;height:18px;border-radius:6px;background:currentColor;opacity:.45}
.tabbar .on{color:var(--p-fern);font-weight:700}
.tabbar .on::before{opacity:1}
.fab{position:absolute;right:16px;top:-62px;width:48px;height:48px;border-radius:50%;background:var(--p-fern);color:#fff;display:grid;place-items:center;font-size:26px;line-height:1;box-shadow:0 6px 16px rgba(30,77,54,.35)}
/* ID result screen */
.photo{height:112px;border-radius:16px;background:linear-gradient(160deg,#cfe3c6,#9cc79f);position:relative;overflow:hidden;margin-bottom:12px}
.photo svg{position:absolute;inset:0;width:100%;height:100%}
.id-head{font-family:var(--display);font-weight:600;font-size:19px;margin:0 0 2px}
.match{display:grid;grid-template-columns:36px 1fr auto;gap:4px 10px;align-items:center;background:var(--p-card);border:1px solid var(--p-line);border-radius:14px;padding:9px 10px;margin-bottom:6px}
.match.top{border-color:var(--p-fern2);box-shadow:0 0 0 1px var(--p-fern2) inset}
.match .ref{width:36px;height:36px;border-radius:9px;grid-row:1/3;background:var(--p-soft)}
.match .ref svg{width:100%;height:100%}
.match b{font-size:13px}
.match small{color:var(--p-muted);font-size:11px}
.conf{font-weight:800;color:var(--p-fern);font-size:15px;grid-row:1/2}
.bar{grid-column:2/4;height:5px;background:#ECE5D6;border-radius:5px;overflow:hidden}
.bar span{display:block;height:100%;background:var(--p-fern2);border-radius:5px}
.w62{width:62%}.w21{width:21%}.w7{width:7%}
.id-actions{display:flex;gap:6px;margin-top:10px}
.id-actions span{flex:1;text-align:center;border-radius:999px;padding:8px 6px;font-weight:700;font-size:11.5px}
.a-pri{background:var(--p-fern);color:#fff}.a-sec{background:var(--p-card);border:1px solid var(--p-line);color:var(--p-fern)}
.why{margin-top:8px;font-size:11px;color:var(--p-muted);text-align:center}
/* Price & Promises screen */
.pp-card{background:var(--p-card);border:1px solid var(--p-line);border-radius:14px;padding:11px 12px;margin-bottom:8px}
.pp-card.plus{border-color:var(--p-fern2);box-shadow:0 0 0 1px var(--p-fern2) inset}
.pp-row{display:flex;justify-content:space-between;align-items:baseline;gap:8px}
.pp-row b{font-family:var(--display);font-size:16px;font-weight:600}
.pp-price{font-weight:800;color:var(--p-fern);font-size:14px}
.pp-card ul{list-style:none;margin:6px 0 0;padding:0;font-size:11.5px;color:var(--p-muted)}
.pp-card li{padding-left:14px;position:relative;margin:2px 0}
.pp-card li::before{content:"";position:absolute;left:0;top:6px;width:6px;height:6px;border-radius:50%;background:var(--p-fern2)}
.pp-opt{display:flex;gap:6px;margin-top:8px}
.pp-opt span{flex:1;border:1px solid var(--p-line);border-radius:10px;padding:6px 8px;font-size:11px;color:var(--p-muted);line-height:1.25}
.pp-opt strong{display:block;color:var(--p-ink);font-size:13px}
.pp-promise{display:flex;gap:6px;flex-wrap:wrap;margin:4px 0 8px}
.pp-promise span{font-size:10.5px;font-weight:700;color:var(--p-fern);background:var(--p-soft);border-radius:999px;padding:4px 8px}
.pp-link{display:flex;justify-content:space-between;padding:9px 2px;border-top:1px solid var(--p-line);font-size:12px;color:var(--p-fern);font-weight:700}

/* "Sound familiar?" */
.familiar{background:var(--oat)}
.section-head{max-width:720px;margin-bottom:var(--s6)}
.cards{display:grid;gap:var(--s3);margin-top:var(--s4)}
.three{grid-template-columns:repeat(3,1fr)}
.two{grid-template-columns:repeat(2,1fr)}
.card{background:var(--surface);border:1px solid var(--line);border-radius:var(--r-lg);padding:var(--s4);box-shadow:var(--shadow-1)}
.card p:last-child{margin-bottom:0}
.pain .spot{width:64px;height:64px;margin-bottom:var(--s3)}
.pain h3{color:var(--ink);font-size:1.375rem}
.pain p{color:var(--muted)}
.pain p strong{color:var(--ink)}
.pain .answer{display:flex;gap:10px;padding-top:var(--s2);border-top:1px dashed var(--line);color:var(--ink)}
.pain .answer::before{content:"";flex:none;width:22px;height:22px;margin-top:2px;border-radius:50%;background:var(--fern-soft) var(--check) center/20px no-repeat}

/* How it works */
.steps{list-style:none;counter-reset:s;padding:0;margin:0;display:grid;grid-template-columns:repeat(3,1fr);gap:var(--s5);position:relative}
.steps li{counter-increment:s;position:relative;padding-top:var(--s10)}
.steps li::before{content:counter(s);position:absolute;top:0;left:0;width:56px;height:56px;border-radius:50% 50% 50% 8px;background:var(--sprout);color:var(--fern);display:grid;place-items:center;font:600 1.5rem var(--display);transform:rotate(0)}
.steps li::after{content:"";position:absolute;top:28px;left:72px;right:calc(-1 * var(--s5) + 16px);border-top:2px dashed var(--line)}
.steps li:last-child::after{display:none}
.steps p{color:var(--muted)}
@media (prefers-color-scheme:dark){.steps li::before{color:var(--ink)}}

/* Plant ID split */
.id-split{margin-top:var(--s12);display:grid;grid-template-columns:auto 1fr;gap:var(--s10);align-items:center;background:var(--oat);border-radius:32px;padding:var(--s8)}
.callout{padding:0}
.callout h3{font-size:clamp(1.75rem,3vw,2.25rem);margin-bottom:var(--s3)}
.callout p{font-size:1.125rem;max-width:32em}
.callout strong{color:var(--heading)}

/* pricing */
.pricing{background:var(--paper)}
.pricing h2{text-align:center}
.pricing .two{max-width:960px;margin:var(--s6) auto 0;align-items:stretch}
.plan{display:flex;flex-direction:column;padding:var(--s5)}
.plan h3{font-size:1.75rem;margin-bottom:var(--s1)}
.plan .price{font:600 2.75rem/1.1 var(--display);color:var(--heading);margin:0 0 var(--s1);letter-spacing:-.02em}
.plan .price span{font:400 1rem var(--text);color:var(--muted);letter-spacing:0}
.price.price-alt{font-size:1.5rem;margin-bottom:var(--s2)}
.plan-lead{margin:var(--s1) 0 var(--s3);padding-bottom:var(--s3);border-bottom:1px solid var(--line);color:var(--ink)}
.plan-plus{background:var(--band);border-color:var(--band);color:var(--on-band);box-shadow:var(--shadow-2)}
.plan-plus h3,.plan-plus .price,.plan-plus .plan-lead,.plan-plus .small,.plan-plus .price span{color:var(--on-band)}
.plan-plus .price span,.plan-plus .small{opacity:.88}
.plan-plus .plan-lead{border-color:color-mix(in srgb,var(--on-band) 25%,transparent)}
.checks{list-style:none;padding:0;margin:0 0 var(--s2)}
.checks li{padding-left:32px;position:relative;margin:12px 0}
.checks li::before{content:"";position:absolute;left:0;top:3px;width:22px;height:22px;border-radius:50%;background:var(--fern-soft) var(--check) center/20px no-repeat}
.plan-plus .checks li::before{background-color:#FBF7EF;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 18 18'%3E%3Cpath d='M5 9.4l2.6 2.6L13 6.6' fill='none' stroke='%232F7A4F' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E")}
.plan-plus .small{margin-top:auto}
.plan-plus .small+.small{margin-top:var(--s1)}
.note{margin:var(--s5) auto 0;max-width:46em;color:var(--muted)}

/* promises split */
.promises-section{background:var(--oat)}
.promise-grid{display:grid;grid-template-columns:1fr auto;gap:var(--s10);align-items:center}
.promises{list-style:none;counter-reset:p;padding:0;margin:var(--s4) 0 0;display:grid;grid-template-columns:1fr 1fr;gap:var(--s3) var(--s4)}
.promises li{counter-increment:p;position:relative;padding-left:48px}
.promises li::before{content:counter(p,decimal-leading-zero);position:absolute;left:0;top:0;font:600 1.25rem/1.3 var(--display);color:var(--terra)}
.promises b{display:block;font-size:1.0625rem;color:var(--ink)}
.promise-grid .phone{transform:rotate(2deg)}

/* FAQ */
.faq h2{margin-bottom:var(--s4)}
.faq details{border-bottom:1px solid var(--line)}
.faq details:first-of-type{border-top:1px solid var(--line)}
.faq summary{cursor:pointer;font-weight:700;font-size:1.125rem;padding:var(--s3) 40px var(--s3) 0;list-style:none;position:relative}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:"";position:absolute;right:8px;top:50%;width:12px;height:12px;margin-top:-8px;border-right:2.5px solid var(--fern);border-bottom:2.5px solid var(--fern);transform:rotate(45deg);transition:transform .2s}
.faq details[open] summary::after{transform:rotate(225deg);margin-top:-2px}
.faq p{margin:0 0 var(--s3);color:var(--muted);max-width:40em}

/* CTA band */
.cta{background:var(--band);color:var(--on-band);position:relative;overflow:hidden;padding:var(--s12) 0}
.cta h2{color:var(--on-band);font-size:clamp(2rem,4vw,3rem);margin-bottom:var(--s4)}
.cta .btn{background:var(--band-btn);color:var(--band-btn-ink);min-height:56px;padding:16px 32px;font-size:1.0625rem}
.cta .btn:hover{background:var(--sprout);color:var(--band-btn-ink)}
.cta-leaf{position:absolute;width:320px;height:320px;opacity:.12;pointer-events:none}
.cta-leaf.l{left:-80px;bottom:-120px;transform:rotate(-20deg)}
.cta-leaf.r{right:-60px;top:-140px;transform:rotate(160deg)}
.cta-leaf path{fill:var(--on-band)}

/* footer */
.site-footer{padding:var(--s5) 0;border-top:1px solid var(--line);font-size:.95rem;color:var(--ink)}
.site-footer p{margin:0 0 var(--s1)}

/* entrance motion (CSS only; off for reduced motion) */
.rise{animation:rise .8s cubic-bezier(.2,.7,.2,1) both}
.rise-2{animation-delay:.12s}.rise-3{animation-delay:.24s}
@keyframes rise{from{opacity:0;transform:translateY(16px)}to{opacity:1;transform:none}}
.hero-art .phone.rise{animation-delay:.2s}

/* blog compatibility (blog.css loads after this file; dark-mode fixes need higher specificity) */
body .skip{color:var(--on-fern)}
@media (prefers-color-scheme:dark){
  body .prose table{background:var(--surface)}
}

/* responsive */
@media (max-width:1100px){
  .hero-art{min-height:560px}
  .id-split{gap:var(--s6);padding:var(--s6)}
  .promise-grid{gap:var(--s6)}
}
@media (max-width:960px){
  .site-header nav a:not(.btn){display:none}
  section{padding:var(--s10) 0}
  .hero{padding:var(--s6) 0 var(--s10)}
  .hero-grid{grid-template-columns:1fr;gap:var(--s4)}
  .hero h1{max-width:14ch}
  .hero-art{min-height:620px}
  .three{grid-template-columns:1fr}
  .pain{display:grid;grid-template-columns:64px 1fr;gap:0 var(--s3)}
  .pain .spot{grid-row:1/4;margin:0}
  .steps{grid-template-columns:1fr;gap:var(--s4)}
  .steps li{padding:0 0 0 80px;min-height:56px}
  .steps li::after{display:none}
  .id-split{grid-template-columns:1fr;padding:var(--s5) var(--s4);gap:var(--s4)}
  .id-split .callout{order:-1}
  .id-split .phone{justify-self:center}
  .promise-grid{grid-template-columns:1fr}
  .promise-grid .phone{justify-self:center;transform:none}
}
@media (max-width:720px){
  .two{grid-template-columns:1fr}
  .promises{grid-template-columns:1fr}
}
@media (max-width:600px){
  body{font-size:17px}
  .wrap{padding:0 var(--s2)}
  section{padding:var(--s8) 0}
  .header-inner{height:64px}
  .brand{font-size:1.3rem}
  .waitlist{grid-template-columns:1fr}
  .waitlist .btn{grid-column:1/2;grid-row:auto}
  .platform,.micro,.form-msg{grid-column:1/2}
  .subhead{font-size:1.125rem}
  .hero-art{min-height:560px}
  .hero-art .phone{zoom:.9}
  .pain{display:block}
  .pain .spot{margin-bottom:var(--s2)}
  .card,.plan{padding:var(--s3)}
  .plan .price{font-size:2.25rem}
  .id-split{border-radius:var(--r-lg);padding:var(--s4) var(--s2)}
  .id-split .phone{zoom:.9}
  .cta{padding:var(--s10) 0}
}
@media (max-width:380px){
  .btn-small{padding:8px 14px;font-size:.9rem}
  .brand{font-size:1.2rem;gap:8px}
  .hero-art .phone,.id-split .phone,.promise-grid .phone{zoom:.86}
}
@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  *,*::before,*::after{animation:none!important;transition:none!important}
}
.sprite{position:absolute;width:0;height:0;overflow:hidden}
.mark-check{stroke:var(--paper)}
.i-stroke-terra{stroke:var(--pot-dark)}
.tick{color:var(--p-fern2)}
.tick.done{color:#fff}
.match .nm{grid-column:2/3;grid-row:1/2;min-width:0;line-height:1.25}
.match .conf{grid-column:3/4}
.match .ref{grid-column:1/2}
.tabbar .fab::before{display:none}
.i-spot{fill:var(--spot-bg)}
/* legal pages */
.legal section{padding:var(--s8) 0}
.legal h1{font-size:clamp(2.25rem,5vw,3.25rem);margin-bottom:var(--s1)}
.legal h2{font-size:1.5rem;margin:var(--s5) 0 var(--s1)}
.legal .small{margin-bottom:var(--s4);padding:var(--s1) var(--s2);background:var(--oat);border-radius:var(--r-sm);display:inline-block}
.plan .price span{display:inline-block;white-space:nowrap}
.task.is-done{opacity:1;background:#F6F2E9}
.task.is-done b,.task.is-done small{color:#56635B}
.task.is-done .thumb{opacity:.6}
.hero-illo{overflow:visible}
.tabbar .fab{font-size:0;display:grid;place-items:center;gap:0;padding:0}
.tabbar .fab::after{content:"";width:18px;height:18px;background:linear-gradient(#fff,#fff) center/100% 2.5px no-repeat,linear-gradient(#fff,#fff) center/2.5px 100% no-repeat}
/* logo v2 "Potted" */
.mk-l{fill:var(--fern)}.mk-l2{fill:var(--leaf-b)}.mk-p{fill:var(--pot)}.mk-p2{opacity:.82}
.site-header .brand:has(.lk-logo){gap:6px}
.site-header .brand svg.lk-logo{width:40px;height:40px;margin-left:-6px}
@media (max-width:600px){.site-header .brand svg.lk-logo{width:36px;height:36px}}

/* hero device pair: iPad (Plants + detail, sidebar) behind, iPhone (Today) in front. Light app theme in both page modes. */
.hero-art .devices{position:relative;z-index:2;width:560px;height:600px;flex:none}
.hero-art .devices .phone{position:absolute;left:0;bottom:0;zoom:.84}
.tablet{--p-ink:#1B2420;--p-muted:#56635B;--p-line:#E7DFCF;--p-bg:#FBF7EF;--p-card:#FFFFFF;--p-fern:#1E4D36;--p-fern2:#2F7A4F;--p-soft:#DDEBD6;--p-terra:#A9481F;--p-blue:#24638A;
  position:absolute;right:0;top:24px;width:520px;aspect-ratio:4/3;border-radius:30px;background:#0F1512;padding:12px;box-shadow:var(--shadow-phone);color:var(--p-ink);font-family:var(--text);text-align:left}
.tscreen{height:100%;border-radius:19px;background:var(--p-bg);overflow:hidden;display:grid;grid-template-columns:92px 168px 1fr;font-size:10px;line-height:1.3}
.tside{background:#F1EADB;border-right:1px solid var(--p-line);padding:14px 8px;display:flex;flex-direction:column;gap:3px}
.tside b{font-family:var(--display);font-size:13px;margin:0 4px 8px}
.tside span,.tside i{padding:5px 7px;border-radius:7px;font-style:normal;font-size:10px}
.tside i{padding-left:16px;color:var(--p-muted)}
.tside .on{background:var(--p-fern);color:#FBF7EF;font-weight:700}
.tlist{padding:14px 10px;border-right:1px solid var(--p-line);overflow:hidden}
.tablet .app-title{font-size:18px}.tablet .app-sub{font-size:9.5px;margin-bottom:8px}
.tgrid{display:grid;grid-template-columns:1fr 1fr;gap:6px}
.tcard{background:var(--p-card);border:1px solid var(--p-line);border-radius:10px;padding:6px;display:flex;flex-direction:column;gap:1px}
.tcard.on{border:2px solid var(--p-fern2);background:var(--p-soft)}
.tcard .thumb{width:100%;height:42px;border-radius:7px;background:#F1EADB;display:grid;place-items:center;margin-bottom:3px}
.tcard .thumb svg{width:26px;height:26px}
.tcard b{font-size:10px}.tcard small{font-size:9px;color:var(--p-muted);font-weight:700}
.tcard small.due{color:var(--p-blue)}.tcard small.late{color:var(--p-terra)}.tcard small.done{color:#276A43}
.tdetail{padding:14px 14px;overflow:hidden}
.tbig{display:grid;place-items:center;width:58px;height:58px;border-radius:16px;background:var(--p-soft);margin-bottom:6px}.tbig svg{width:38px;height:38px}
.tchip{display:inline-block;background:#DCEAF2;color:var(--p-blue);font-weight:700;font-size:9.5px;border-radius:999px;padding:3px 8px}
.tbox{background:var(--p-card);border:1px solid var(--p-line);border-radius:10px;padding:8px;margin-top:8px;display:flex;flex-direction:column;gap:3px}
.tbox b{font-size:11px}.tbox small{font-size:9.5px;color:var(--p-muted)}
.tseg{font-size:9px;color:var(--p-muted);background:#F6F2E9;border-radius:6px;padding:2px 3px;align-self:flex-start}.tseg em{font-style:normal;background:var(--p-card);color:var(--p-ink);font-weight:700;border-radius:4px;padding:1px 5px}
.hero-art .tablet.rise{animation-delay:.05s}
@media (max-width:1100px){.hero-art .devices{zoom:.78}}
@media (max-width:960px){.hero-art .devices{zoom:1}.hero-art{min-height:620px}}
@media (max-width:600px){.hero-art{min-height:0;padding:8px 0}.hero-art .devices{zoom:.62}.hero-art .devices .phone{zoom:.84}}
@media (max-width:380px){.hero-art .devices{zoom:.57}.hero-art .devices .phone{zoom:.84}}
@media (prefers-color-scheme:dark){.hero-art .tablet,.hero-art .devices .phone{box-shadow:0 0 0 1.5px #3A4A42,var(--shadow-phone)}}
/* 404 */
.notfound{padding:var(--s15) 0;text-align:center}
.notfound .lk-logo{width:72px;height:72px;margin:0 auto var(--s3);display:block}
.notfound p{color:var(--muted);margin-bottom:var(--s4)}
@media (max-width:600px){.notfound{padding:var(--s10) 0}}