:root{
  --rind:#1B5E20; --stripe:#7CB342; --flesh:#FC4A6B; --flesh-deep:#E63956;
  --cantaloupe:#EE7B4D; --honeydew:#A7D98C; --canary:#F2C94C;
  --seed:#241F1A; --cream:#FBF7F0; --sand:#EDE6DA; --stone:#C7BFB2; --slate:#6E675C;
  --success:#1D9E75; --warning:#E5A100; --danger:#C9302C;
}
*{box-sizing:border-box;}
body{margin:0;background:var(--cream);color:var(--seed);
  font-family:'Open Sans',system-ui,sans-serif;line-height:1.65;-webkit-font-smoothing:antialiased;}
.wrap{max-width:860px;margin:0 auto;padding:0 24px;}
a{color:var(--flesh-deep);text-decoration:none;}
a:hover{text-decoration:underline;}
h1,h2,h3{font-family:'Ubuntu',sans-serif;font-weight:500;line-height:1.2;color:var(--seed);}
h1{font-size:38px;font-weight:700;margin:0 0 14px;}
h2{font-size:25px;margin:2.4em 0 0.5em;}
h3{font-size:18px;margin:0 0 4px;}
p{margin:0 0 1.1em;}
.lead{font-size:20px;color:var(--slate);max-width:56ch;}
/* header */
header.site{border-bottom:1px solid var(--sand);background:var(--cream);}
.nav{display:flex;align-items:center;justify-content:space-between;padding:16px 0;}
.nav .brand{display:inline-flex;align-items:center;}
.nav nav a{color:var(--slate);font-family:'Ubuntu',sans-serif;font-weight:500;font-size:15px;margin-left:22px;}
.nav nav a:hover{color:var(--rind);text-decoration:none;}
/* hero */
.hero{padding:52px 0 6px;}
/* product cards */
.grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(232px,1fr));gap:18px;margin:34px 0;}
.card{background:#fff;border:1px solid var(--sand);border-radius:16px;padding:22px;border-top:4px solid var(--accent,var(--rind));}
.card h3{margin:0 0 4px;}
.card p{margin:0 0 12px;color:var(--slate);font-size:15px;}
.soon{font-family:'Ubuntu Mono',monospace;font-size:12px;color:var(--rind);background:#EAF3DE;padding:3px 10px;border-radius:20px;}
/* brand swatches */
.swatches{display:flex;flex-wrap:wrap;gap:10px;margin:12px 0 4px;}
.sw{width:64px;}
.sw i{display:block;height:46px;border-radius:8px;border:0.5px solid var(--sand);}
.sw span{font-family:'Ubuntu Mono',monospace;font-size:10px;color:var(--slate);display:block;margin-top:5px;line-height:1.3;}
code{font-family:'Ubuntu Mono',monospace;font-size:0.88em;background:var(--sand);padding:1px 5px;border-radius:4px;}
/* footer */
footer.site{border-top:1px solid var(--sand);margin-top:60px;padding:26px 0;}
footer.site .wrap{display:flex;justify-content:space-between;flex-wrap:wrap;gap:8px;color:var(--slate);font-size:14px;}
footer.site a{color:var(--slate);}