/* Peak Peppers — White & Earthy Green laboratory theme */
:root{
  --bg:#F6F7F3; --bg-2:#F0F3EC; --card:#FFFFFF; --line:#DFE5DA; --line-2:#E9EEE5;
  --green:#2C4A34; --green-h:#1F3626; --sage:#4A6B50; --olive:#6A8B6E; --mint:#EAF0EA; --mint-2:#DCE7DC;
  --brass:#B5945B; --ink:#141F17; --ink-2:#4E5D52; --ink-3:#7A877D; --warn:#9A3B2A; --warn-bg:#FBEDE8;
  --r-sm:10px; --r:16px; --r-lg:24px;
  --sh-1:0 1px 2px rgba(20,31,23,.04),0 2px 10px rgba(20,31,23,.04);
  --sh-2:0 10px 30px -10px rgba(31,54,38,.18),0 2px 6px rgba(20,31,23,.05);
  --sh-3:0 30px 80px -20px rgba(31,54,38,.28);
  --f-head:"Montserrat",system-ui,sans-serif; --f-body:"Inter",system-ui,-apple-system,"Segoe UI",sans-serif; --f-mono:"JetBrains Mono",ui-monospace,SFMono-Regular,Menlo,monospace;
  --hdr:68px;
}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth}
body{margin:0;font-family:var(--f-body);color:var(--ink);background:var(--bg);line-height:1.55;font-size:15px;-webkit-font-smoothing:antialiased;overflow-x:hidden}
body.lock{overflow:hidden}
a{color:inherit;text-decoration:none}
img,svg{display:block;max-width:100%}
button{font:inherit;color:inherit;cursor:pointer;background:none;border:0;padding:0}
input,select,textarea{font:inherit;color:inherit}
:focus-visible{outline:2px solid var(--olive);outline-offset:2px}
.mono{font-family:var(--f-mono);font-feature-settings:"zero" 0}
.container{max-width:1240px;margin:0 auto;padding:0 20px}
.narrow{max-width:880px}
.sr{position:absolute!important;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.aura{position:fixed;inset:0;pointer-events:none;z-index:-1;background:radial-gradient(1200px 600px at 85% -10%,rgba(106,139,110,.10),transparent 60%),radial-gradient(900px 500px at -10% 30%,rgba(181,148,91,.05),transparent 60%)}

/* type */
.eyebrow{font-family:var(--f-head);font-size:10.5px;font-weight:700;letter-spacing:.34em;text-transform:uppercase;color:var(--sage)}
.h1{font-family:var(--f-head);font-weight:800;font-size:clamp(34px,6vw,64px);line-height:1.04;letter-spacing:-.02em;margin:0;color:var(--ink)}
.h2{font-family:var(--f-head);font-weight:800;font-size:clamp(26px,3.6vw,40px);line-height:1.1;letter-spacing:-.015em;margin:0;color:var(--ink)}
.h3{font-family:var(--f-head);font-weight:700;font-size:18px;line-height:1.25;margin:0}
.lead{font-size:17px;color:var(--ink-2);max-width:620px}
.muted{color:var(--ink-2)} .dim{color:var(--ink-3)}
.accent{color:var(--green)}
.sec{padding:84px 0} .sec.tight{padding:56px 0}
.sec-head{text-align:center;max-width:720px;margin:0 auto 44px}
.sec-head .h2{margin:12px 0 12px}
.sec-head p{color:var(--ink-2);margin:0}
.rule{height:1px;background:linear-gradient(90deg,transparent,var(--line),transparent);border:0;margin:0}

/* buttons */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:10px;height:48px;padding:0 26px;border-radius:999px;font-family:var(--f-head);font-weight:700;font-size:12px;letter-spacing:.18em;text-transform:uppercase;transition:background .2s,color .2s,border-color .2s,transform .15s,box-shadow .2s;white-space:nowrap;user-select:none}
.btn:active{transform:translateY(1px)}
.btn svg{width:16px;height:16px;flex:none}
.btn-primary{background:var(--green);color:#fff;box-shadow:0 8px 22px -10px rgba(44,74,52,.7)}
.btn-primary:hover{background:var(--green-h)}
.btn-ghost{border:1.5px solid var(--line);background:#fff;color:var(--ink)}
.btn-ghost:hover{border-color:var(--sage);color:var(--green)}
.btn-soft{background:var(--mint);color:var(--green)}
.btn-soft:hover{background:var(--mint-2)}
.btn-sm{height:38px;padding:0 16px;font-size:10.5px;letter-spacing:.16em}
.btn-block{width:100%}
.btn[disabled]{opacity:.45;pointer-events:none}
.link{color:var(--green);font-weight:600;border-bottom:1px solid rgba(44,74,52,.25)}
.link:hover{border-color:var(--green)}

/* pills/badges */
.pill{display:inline-flex;align-items:center;gap:6px;height:24px;padding:0 10px;border-radius:999px;font-size:10px;font-weight:700;letter-spacing:.14em;text-transform:uppercase;font-family:var(--f-head);background:var(--mint);color:var(--green);border:1px solid var(--mint-2);white-space:nowrap}
.pill.outline{background:#fff;border-color:var(--line);color:var(--ink-2)}
.pill.brass{background:#F7F1E6;border-color:#EADCC2;color:#8A6C3A}
.pill.warn{background:var(--warn-bg);border-color:#F1CFC6;color:var(--warn)}
.pill svg{width:12px;height:12px}

/* announcement + header */
.announce{background:var(--green);color:#E6EEE6;font-family:var(--f-head);font-size:10.5px;font-weight:600;letter-spacing:.22em;text-transform:uppercase;overflow:hidden;height:34px;display:flex;align-items:center}
.announce .track{display:flex;gap:48px;white-space:nowrap;animation:ticker 38s linear infinite;padding-left:48px}
.announce span{display:inline-flex;align-items:center;gap:10px}
.announce span::before{content:"";width:5px;height:5px;border-radius:50%;background:var(--brass)}
@keyframes ticker{from{transform:translateX(0)}to{transform:translateX(-50%)}}
@media (prefers-reduced-motion:reduce){.announce .track,.ticker-track{animation:none!important}}
.hdr{position:sticky;top:0;z-index:60;background:rgba(255,255,255,.86);backdrop-filter:saturate(1.6) blur(14px);-webkit-backdrop-filter:saturate(1.6) blur(14px);border-bottom:1px solid var(--line-2);transition:box-shadow .2s}
.hdr.scrolled{box-shadow:0 6px 24px -14px rgba(20,31,23,.25)}
.hdr .bar{height:var(--hdr);display:flex;align-items:center;gap:22px}
.brand{display:flex;align-items:center;gap:10px;flex:none}
.brand img{width:40px;height:40px}
.brand b{font-family:var(--f-head);font-weight:800;letter-spacing:.2em;font-size:15px;color:var(--ink);line-height:1}
.brand small{display:block;font-family:var(--f-head);font-size:8.5px;letter-spacing:.38em;color:var(--sage);font-weight:700;margin-top:4px}
.nav{display:none;gap:4px;margin-left:12px}
.nav a{font-family:var(--f-head);font-size:11px;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:var(--ink-2);padding:9px 12px;border-radius:999px;transition:.2s}
.nav a:hover{color:var(--green);background:var(--mint)}
.nav a.active{color:var(--green);background:var(--mint)}
.hdr-actions{margin-left:auto;display:flex;align-items:center;gap:6px}
.icon-btn{width:42px;height:42px;border-radius:999px;display:grid;place-items:center;color:var(--ink);transition:.2s;position:relative}
.icon-btn:hover{background:var(--mint);color:var(--green)}
.icon-btn svg{width:20px;height:20px}
.search-trigger{display:none;align-items:center;gap:10px;height:40px;padding:0 14px;border:1px solid var(--line);border-radius:999px;background:#fff;color:var(--ink-3);font-size:13px;min-width:200px;transition:.2s}
.search-trigger:hover{border-color:var(--olive)}
.search-trigger svg{width:16px;height:16px}
.search-trigger kbd{margin-left:auto;font-family:var(--f-mono);font-size:10px;border:1px solid var(--line);border-radius:6px;padding:1px 6px}
.cart-count{position:absolute;top:3px;right:2px;min-width:18px;height:18px;padding:0 5px;border-radius:999px;background:var(--green);color:#fff;font-size:10px;font-weight:700;display:grid;place-items:center;font-family:var(--f-mono);transform:scale(0);transition:transform .25s cubic-bezier(.3,1.6,.6,1)}
.cart-count.on{transform:scale(1)}
.cart-count.bump{animation:bump .4s}
@keyframes bump{50%{transform:scale(1.35)}}
.menu-btn{display:grid}
@media (min-width:1060px){.nav{display:flex}.menu-btn{display:none}}
@media (min-width:1220px){.search-trigger{display:flex}.search-icon{display:none}}

/* mobile nav */
.mnav{position:fixed;inset:0;z-index:90;pointer-events:none}
.mnav .scrim{position:absolute;inset:0;background:rgba(20,31,23,.35);opacity:0;transition:.25s}
.mnav .panel{position:absolute;top:0;left:0;bottom:0;width:min(86vw,340px);background:#fff;transform:translateX(-100%);transition:transform .3s cubic-bezier(.2,.8,.2,1);padding:20px;display:flex;flex-direction:column;gap:6px}
.mnav.open{pointer-events:auto}.mnav.open .scrim{opacity:1}.mnav.open .panel{transform:none}
.mnav .panel a{font-family:var(--f-head);font-weight:700;font-size:13px;letter-spacing:.14em;text-transform:uppercase;padding:14px 12px;border-radius:12px;color:var(--ink)}
.mnav .panel a:hover,.mnav .panel a.active{background:var(--mint);color:var(--green)}

/* hero */
.hero{position:relative;padding:64px 0 40px;overflow:hidden}
.hero-grid{display:grid;gap:44px;align-items:center}
.hero .h1 .accent{background:linear-gradient(120deg,var(--green),var(--olive));-webkit-background-clip:text;background-clip:text;color:transparent}
.hero .lead{margin:20px 0 30px}
.hero-ctas{display:flex;gap:12px;flex-wrap:wrap}
.hero-meta{display:flex;gap:22px;flex-wrap:wrap;margin-top:30px;color:var(--ink-2);font-size:13px}
.hero-meta div{display:flex;align-items:center;gap:8px}
.hero-meta svg{width:16px;height:16px;color:var(--sage)}
.hero-stage{position:relative;aspect-ratio:1/1;max-width:560px;margin:0 auto;width:100%}
.hero-stage .plate{position:absolute;inset:8% 4% 4%;border-radius:50%;background:radial-gradient(circle at 50% 40%,#fff 0%,#F1F5EE 55%,#E3EBE0 100%);box-shadow:inset 0 -30px 60px -30px rgba(44,74,52,.25),var(--sh-3)}
.hero-stage .ring{position:absolute;inset:2%;border-radius:50%;border:1px dashed rgba(74,107,80,.25);animation:spin 80s linear infinite}
@keyframes spin{to{transform:rotate(360deg)}}
.hero-stage .vials{position:absolute;inset:0;display:flex;align-items:flex-end;justify-content:center;padding-bottom:13%}
.hero-stage .vials .v{width:26%;filter:drop-shadow(0 26px 22px rgba(20,31,23,.22));transition:transform .5s cubic-bezier(.2,.8,.2,1)}
.hero-stage .vials .v:nth-child(1){transform:translate(18%,6%) rotate(-7deg) scale(.86)}
.hero-stage .vials .v:nth-child(2){z-index:2;width:31%}
.hero-stage .vials .v:nth-child(3){transform:translate(-18%,6%) rotate(7deg) scale(.86)}
.hero-stage:hover .vials .v:nth-child(1){transform:translate(8%,2%) rotate(-10deg) scale(.88)}
.hero-stage:hover .vials .v:nth-child(3){transform:translate(-8%,2%) rotate(10deg) scale(.88)}
.float-chip{position:absolute;background:#fff;border:1px solid var(--line);border-radius:14px;padding:10px 14px;box-shadow:var(--sh-2);font-size:12px;display:flex;gap:10px;align-items:center;animation:floaty 6s ease-in-out infinite}
.float-chip b{font-family:var(--f-mono);font-size:13px;color:var(--green)}
.float-chip .ic{width:30px;height:30px;border-radius:9px;background:var(--mint);display:grid;place-items:center;color:var(--green)}
.float-chip .ic svg{width:16px;height:16px}
.float-chip.a{top:14%;left:-2%}.float-chip.b{bottom:18%;right:-3%;animation-delay:-3s}
@keyframes floaty{50%{transform:translateY(-8px)}}
@media (min-width:960px){.hero{padding:88px 0 56px}.hero-grid{grid-template-columns:1.05fr .95fr}}

/* trust bar */
.trust{border-top:1px solid var(--line-2);border-bottom:1px solid var(--line-2);background:#fff}
.trust .row{display:grid;grid-template-columns:repeat(2,1fr)}
.trust .it{display:flex;align-items:center;gap:12px;padding:20px 14px;border-right:1px solid var(--line-2)}
.trust .it:nth-child(2n){border-right:0}
.trust .it .ic{width:40px;height:40px;border-radius:12px;background:var(--mint);color:var(--green);display:grid;place-items:center;flex:none}
.trust .it svg{width:20px;height:20px}
.trust .it b{display:block;font-family:var(--f-head);font-size:12px;letter-spacing:.08em;text-transform:uppercase}
.trust .it span{font-size:12px;color:var(--ink-3)}
@media (min-width:900px){.trust .row{grid-template-columns:repeat(4,1fr)}.trust .it,.trust .it:nth-child(2n){border-right:1px solid var(--line-2)}.trust .it:last-child{border-right:0}}

/* product grid & cards */
.grid{display:grid;gap:18px;grid-template-columns:repeat(auto-fill,minmax(230px,1fr))}
.card{background:var(--card);border:1px solid var(--line);border-radius:var(--r-lg);box-shadow:var(--sh-1)}
.pcard{display:flex;flex-direction:column;overflow:hidden;transition:transform .3s cubic-bezier(.2,.8,.2,1),box-shadow .3s,border-color .3s;position:relative}
.pcard:hover{transform:translateY(-4px);box-shadow:var(--sh-2);border-color:var(--mint-2)}
.pcard .media{position:relative;display:block;aspect-ratio:1/1.02;background:radial-gradient(circle at 50% 38%,#fff,#F3F6F0 60%,#E9EFE6);border-bottom:1px solid var(--line-2)}
.pcard .media .v{position:absolute;left:50%;bottom:9%;width:40%;transform:translateX(-50%);filter:drop-shadow(0 16px 14px rgba(20,31,23,.18));transition:transform .45s cubic-bezier(.2,.8,.2,1)}
.pcard:hover .media .v{transform:translateX(-50%) translateY(-6px) rotate(-2deg)}
.pcard .media .shadow{position:absolute;left:50%;bottom:7%;width:44%;height:5%;transform:translateX(-50%);background:radial-gradient(ellipse,rgba(20,31,23,.22),transparent 70%)}
.pcard .tags{position:absolute;top:12px;left:12px;right:12px;display:flex;justify-content:space-between;gap:6px}
.pcard .body{padding:16px 16px 18px;display:flex;flex-direction:column;gap:10px;flex:1}
.pcard .cat{font-family:var(--f-head);font-size:9.5px;letter-spacing:.3em;text-transform:uppercase;color:var(--sage);font-weight:700}
.pcard .nm{font-family:var(--f-head);font-weight:800;font-size:18px;line-height:1.15;letter-spacing:-.01em}
.pcard .nm small{display:block;font-family:var(--f-body);font-weight:500;font-size:12px;color:var(--ink-3);letter-spacing:0;margin-top:3px}
.pcard .specline{font-size:11.5px;color:var(--ink-3);display:flex;gap:8px;flex-wrap:wrap}
.pcard .specline .mono{color:var(--ink-2)}
.pcard .pc-foot{margin-top:auto;display:flex;align-items:center;justify-content:space-between;gap:10px}
.price{font-family:var(--f-mono);font-weight:500;font-size:20px;color:var(--ink);letter-spacing:-.02em}
.price small{font-size:11px;color:var(--ink-3)}
.vpills{display:flex;gap:6px;flex-wrap:wrap}
.vpill{height:30px;padding:0 12px;border-radius:999px;border:1.5px solid var(--line);font-family:var(--f-mono);font-size:12px;color:var(--ink-2);background:#fff;transition:.15s}
.vpill:hover{border-color:var(--olive)}
.vpill[aria-pressed=true]{border-color:var(--green);background:var(--green);color:#fff}
.add-btn{height:40px;padding:0 16px;border-radius:999px;background:var(--green);color:#fff;font-family:var(--f-head);font-weight:700;font-size:10.5px;letter-spacing:.16em;text-transform:uppercase;display:inline-flex;align-items:center;gap:8px;transition:.2s}
.add-btn:hover{background:var(--green-h)}
.add-btn svg{width:15px;height:15px}
.add-btn.done{background:var(--olive)}

/* catalog toolbar */
.page-hero{padding:56px 0 30px;text-align:center}
.page-hero .h1{font-size:clamp(32px,5vw,52px)}
.page-hero p{color:var(--ink-2);max-width:620px;margin:14px auto 0}
.toolbar{position:sticky;top:var(--hdr);z-index:30;background:rgba(246,247,243,.92);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);padding:14px 0;border-bottom:1px solid var(--line-2);margin-bottom:28px}
.toolbar .row{display:flex;flex-wrap:wrap;gap:10px;align-items:center}
.tabs{display:flex;gap:6px;overflow-x:auto;scrollbar-width:none;flex:1 1 100%;padding-bottom:2px}
.tabs::-webkit-scrollbar{display:none}
.tab{height:36px;padding:0 14px;border-radius:999px;border:1px solid var(--line);background:#fff;font-family:var(--f-head);font-weight:700;font-size:10.5px;letter-spacing:.14em;text-transform:uppercase;color:var(--ink-2);white-space:nowrap;transition:.15s}
.tab:hover{border-color:var(--olive);color:var(--green)}
.tab[aria-pressed=true]{background:var(--green);border-color:var(--green);color:#fff}
.tab .n{font-family:var(--f-mono);opacity:.6;margin-left:6px;font-weight:500}
.field{position:relative;flex:1 1 220px}
.field svg{position:absolute;left:14px;top:50%;transform:translateY(-50%);width:16px;height:16px;color:var(--ink-3)}
.input,.select,.textarea{width:100%;height:44px;border:1.5px solid var(--line);border-radius:12px;background:#fff;padding:0 14px;font-size:14px;transition:border-color .15s,box-shadow .15s;outline:0}
.field .input{padding-left:40px;border-radius:999px}
.input:focus,.select:focus,.textarea:focus{border-color:var(--olive);box-shadow:0 0 0 4px rgba(106,139,110,.15)}
.select{appearance:none;-webkit-appearance:none;padding-right:36px;background:#fff url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%234E5D52' stroke-width='2'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E") right 12px center/16px no-repeat}
.toolbar .select{width:auto;border-radius:999px;flex:0 0 auto}
.textarea{height:auto;min-height:96px;padding:12px 14px;resize:vertical;line-height:1.45}
.result-count{font-size:12px;color:var(--ink-3);font-family:var(--f-mono)}
@media (min-width:900px){.tabs{flex:1 1 auto}.field{flex:0 1 260px}}
.empty{text-align:center;padding:60px 20px;color:var(--ink-3)}
.cat-head{display:flex;align-items:end;justify-content:space-between;gap:20px;margin:34px 0 16px}
.cat-head:first-child{margin-top:0}
.cat-head p{margin:6px 0 0;color:var(--ink-3);font-size:13px}

/* product detail */
.crumbs{font-size:12px;color:var(--ink-3);display:flex;gap:8px;align-items:center;padding:24px 0 8px;flex-wrap:wrap}
.crumbs a:hover{color:var(--green)}
.pd{display:grid;gap:40px;padding:10px 0 60px}
@media (min-width:960px){.pd{grid-template-columns:1.05fr 1fr;align-items:start}}
.pd-stage{position:relative;border-radius:var(--r-lg);background:radial-gradient(circle at 50% 35%,#fff,#F2F6EF 55%,#E4ECE1);border:1px solid var(--line);aspect-ratio:1/1;overflow:hidden}
@media (min-width:960px){.pd-stage{position:sticky;top:calc(var(--hdr) + 20px)}}
.pd-stage .v{position:absolute;left:50%;bottom:10%;width:36%;transform:translateX(-50%);filter:drop-shadow(0 34px 26px rgba(20,31,23,.24));animation:hover 7s ease-in-out infinite}
@keyframes hover{50%{transform:translateX(-50%) translateY(-10px)}}
.pd-stage .shadow{position:absolute;left:50%;bottom:7%;width:40%;height:5%;transform:translateX(-50%);background:radial-gradient(ellipse,rgba(20,31,23,.25),transparent 70%)}
.pd-stage .grid-bg{position:absolute;inset:0;background-image:linear-gradient(rgba(74,107,80,.06) 1px,transparent 1px),linear-gradient(90deg,rgba(74,107,80,.06) 1px,transparent 1px);background-size:32px 32px;mask-image:radial-gradient(circle at 50% 50%,#000 30%,transparent 75%);-webkit-mask-image:radial-gradient(circle at 50% 50%,#000 30%,transparent 75%)}
.pd-stage .tl{position:absolute;top:16px;left:16px;display:flex;gap:6px;flex-wrap:wrap}
.pd-stage .br{position:absolute;bottom:16px;right:16px;font-family:var(--f-mono);font-size:10.5px;color:var(--ink-3);text-align:right}
.pd-info .cat{margin-bottom:10px}
.pd-info .h1{font-size:clamp(32px,4.4vw,48px)}
.pd-info .alias{font-size:14px;color:var(--ink-3);margin-top:6px}
.pd-price{display:flex;align-items:baseline;gap:12px;margin:20px 0 6px}
.pd-price .price{font-size:32px}
.pd-desc{color:var(--ink-2);margin:14px 0 24px}
.opt-label{display:flex;justify-content:space-between;align-items:center;font-family:var(--f-head);font-size:10.5px;font-weight:700;letter-spacing:.24em;text-transform:uppercase;color:var(--ink-2);margin:22px 0 10px}
.opt-label span{font-family:var(--f-mono);letter-spacing:0;text-transform:none;font-weight:500;color:var(--ink-3)}
.vgrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(120px,1fr));gap:10px}
.vopt{border:1.5px solid var(--line);border-radius:14px;padding:12px 14px;text-align:left;background:#fff;transition:.15s}
.vopt:hover{border-color:var(--olive)}
.vopt b{display:block;font-family:var(--f-mono);font-size:16px;font-weight:500}
.vopt span{font-size:12px;color:var(--ink-3)}
.vopt[aria-pressed=true]{border-color:var(--green);box-shadow:0 0 0 3px rgba(44,74,52,.12);background:#FBFDFB}
.qgrid{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}
.qopt{position:relative;border:1.5px solid var(--line);border-radius:14px;padding:14px 12px;text-align:center;background:#fff;transition:.15s}
.qopt:hover{border-color:var(--olive)}
.qopt b{display:block;font-family:var(--f-head);font-weight:800;font-size:15px}
.qopt span{display:block;font-family:var(--f-mono);font-size:12px;color:var(--ink-3);margin-top:2px}
.qopt[aria-pressed=true]{border-color:var(--green);box-shadow:0 0 0 3px rgba(44,74,52,.12);background:#FBFDFB}
.stepper{display:inline-flex;align-items:center;border:1.5px solid var(--line);border-radius:999px;background:#fff;height:48px}
.stepper button{width:44px;height:100%;display:grid;place-items:center;color:var(--ink-2);border-radius:999px}
.stepper button:hover{color:var(--green);background:var(--mint)}
.stepper button svg{width:16px;height:16px}
.stepper input{width:44px;text-align:center;border:0;outline:0;font-family:var(--f-mono);font-size:15px;background:transparent;-moz-appearance:textfield}
.stepper input::-webkit-inner-spin-button{-webkit-appearance:none}
.stepper.sm{height:34px}.stepper.sm button{width:32px}.stepper.sm input{width:30px;font-size:13px}
.buy-row{display:flex;gap:12px;margin-top:22px;flex-wrap:wrap}
.buy-row .btn{flex:1;height:52px}
.assure{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:22px}
.assure div{display:flex;gap:10px;align-items:center;font-size:12.5px;color:var(--ink-2);background:#fff;border:1px solid var(--line-2);border-radius:12px;padding:10px 12px}
.assure svg{width:18px;height:18px;color:var(--sage);flex:none}
.spec-card{margin-top:26px;padding:22px}
.spec-card h3{font-family:var(--f-head);font-size:11px;letter-spacing:.28em;text-transform:uppercase;color:var(--sage);margin:0 0 12px}
.spec{display:grid;grid-template-columns:140px 1fr;border-top:1px solid var(--line-2)}
.spec>div{padding:11px 0;border-bottom:1px solid var(--line-2);font-size:13.5px}
.spec>div:nth-child(odd){color:var(--ink-3)}
.spec .mono{font-size:12.5px;word-break:break-word}
.ruo-box{margin-top:16px;padding:16px 18px;border-radius:14px;background:#FBF8F1;border:1px solid #EFE4CD;font-size:12.5px;color:#6B5631;display:flex;gap:12px}
.ruo-box svg{width:18px;height:18px;flex:none;margin-top:1px}
.tabs-pd{display:flex;gap:4px;border-bottom:1px solid var(--line);margin-top:30px}
.tabs-pd button{padding:12px 14px;font-family:var(--f-head);font-size:11px;font-weight:700;letter-spacing:.16em;text-transform:uppercase;color:var(--ink-3);border-bottom:2px solid transparent;margin-bottom:-1px}
.tabs-pd button[aria-selected=true]{color:var(--green);border-color:var(--green)}
.tabpanel{padding:18px 0;color:var(--ink-2);font-size:14px}
.tabpanel ul{padding-left:18px;margin:0}
.tabpanel li{margin:6px 0}

/* features / steps */
.feat-grid{display:grid;gap:16px;grid-template-columns:repeat(auto-fit,minmax(260px,1fr))}
.feat{padding:26px;transition:.25s}
.feat:hover{border-color:var(--mint-2);box-shadow:var(--sh-2)}
.feat .ic{width:46px;height:46px;border-radius:14px;background:var(--mint);color:var(--green);display:grid;place-items:center;margin-bottom:16px}
.feat .ic svg{width:22px;height:22px}
.feat p{color:var(--ink-2);font-size:14px;margin:8px 0 0}
.steps{display:grid;gap:16px;counter-reset:s}
@media (min-width:900px){.steps{grid-template-columns:repeat(3,1fr)}}
.step{padding:28px;position:relative;overflow:hidden}
.step .num{font-family:var(--f-mono);font-size:12px;color:var(--sage);letter-spacing:.1em}
.step .big{position:absolute;right:-6px;top:-24px;font-family:var(--f-head);font-weight:900;font-size:120px;color:var(--mint);line-height:1;z-index:0}
.step>*{position:relative;z-index:1}
.step h3{margin:14px 0 8px}
.step p{color:var(--ink-2);font-size:14px;margin:0}
.lab{display:grid;gap:30px;align-items:center}
@media (min-width:960px){.lab{grid-template-columns:1fr 1fr}}
.lab-visual{padding:24px;position:relative}
.chroma{width:100%;height:auto}
.lab-list{display:grid;gap:12px;margin-top:22px}
.lab-list div{display:flex;gap:12px;align-items:flex-start;font-size:14px;color:var(--ink-2)}
.lab-list svg{width:20px;height:20px;color:var(--green);flex:none;margin-top:1px}
.lab-list b{color:var(--ink)}
.stat-row{display:grid;grid-template-columns:repeat(2,1fr);gap:12px;margin-top:18px}
.stat{background:var(--bg-2);border-radius:14px;padding:14px}
.stat b{display:block;font-family:var(--f-mono);font-size:20px;color:var(--green);font-weight:500}
.stat span{font-size:11.5px;color:var(--ink-3)}
.band{background:var(--green);color:#E8EFE8;border-radius:var(--r-lg);padding:44px 28px;position:relative;overflow:hidden}
.band::after{content:"";position:absolute;right:-120px;top:-120px;width:380px;height:380px;border-radius:50%;background:radial-gradient(circle,rgba(255,255,255,.12),transparent 65%)}
.band .h2{color:#fff}
.band p{color:#C9D6CA}
.band .btn-primary{background:#fff;color:var(--green)}
.band .btn-primary:hover{background:var(--mint)}
.band .btn-ghost{background:transparent;border-color:rgba(255,255,255,.3);color:#fff}

/* accordion */
.acc{border-top:1px solid var(--line)}
.acc-item{border-bottom:1px solid var(--line)}
.acc-q{width:100%;display:flex;justify-content:space-between;align-items:center;gap:16px;padding:20px 4px;text-align:left;font-family:var(--f-head);font-weight:700;font-size:15.5px;color:var(--ink)}
.acc-q:hover{color:var(--green)}
.acc-q .pm{width:30px;height:30px;border-radius:50%;border:1px solid var(--line);display:grid;place-items:center;flex:none;transition:.25s}
.acc-q .pm svg{width:14px;height:14px;transition:transform .25s}
.acc-item.open .pm{background:var(--green);border-color:var(--green);color:#fff}
.acc-item.open .pm svg{transform:rotate(45deg)}
.acc-a{display:grid;grid-template-rows:0fr;transition:grid-template-rows .3s ease}
.acc-a>div{overflow:hidden}
.acc-a p{margin:0;padding:0 4px 20px;color:var(--ink-2);font-size:14.5px;max-width:760px}
.acc-item.open .acc-a{grid-template-rows:1fr}
.faq-layout{display:grid;gap:30px}
@media (min-width:960px){.faq-layout{grid-template-columns:240px 1fr}}
.faq-cats{display:flex;gap:6px;flex-wrap:wrap}
@media (min-width:960px){.faq-cats{flex-direction:column;position:sticky;top:calc(var(--hdr) + 24px)}}
.faq-cats button{text-align:left;padding:10px 14px;border-radius:12px;font-family:var(--f-head);font-weight:700;font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:var(--ink-2);border:1px solid transparent}
.faq-cats button:hover{background:#fff;border-color:var(--line)}
.faq-cats button[aria-pressed=true]{background:var(--mint);color:var(--green)}
mark{background:#E4EEDB;color:inherit;border-radius:3px;padding:0 2px}

.lab-strip{display:flex;flex-wrap:wrap;gap:16px;align-items:center;justify-content:center;padding:18px;margin-bottom:28px}
.lab-strip div{display:flex;align-items:center;gap:10px;font-size:13px;color:var(--ink-2)}
.lab-strip svg{width:18px;height:18px;color:var(--green)}

/* modal / lightbox */
.modal{position:fixed;inset:0;z-index:120;display:flex;align-items:center;justify-content:center;padding:20px;opacity:0;pointer-events:none;transition:opacity .25s}
.modal.open{opacity:1;pointer-events:auto}
.modal .scrim{position:absolute;inset:0;background:rgba(20,31,23,.5);backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px)}
.modal .box{position:relative;background:#fff;border-radius:var(--r-lg);box-shadow:var(--sh-3);width:min(560px,100%);max-height:calc(100vh - 40px);overflow:auto;transform:translateY(14px) scale(.98);transition:transform .3s cubic-bezier(.2,.8,.2,1)}
.modal.open .box{transform:none}
.modal .x{position:absolute;top:12px;right:12px;z-index:3}
.lightbox .box{width:min(1100px,100%);height:calc(100vh - 40px);display:flex;flex-direction:column;background:#F2F4F0}
.lb-top{display:flex;align-items:center;gap:12px;padding:14px 60px 14px 18px;background:#fff;border-bottom:1px solid var(--line)}
.lb-top b{font-family:var(--f-head);font-size:15px}
.lb-top .mono{font-size:11px;color:var(--ink-3)}
.lb-tools{margin-left:auto;display:flex;gap:6px;align-items:center}
.lb-stage{flex:1;overflow:auto;display:flex;justify-content:center;align-items:flex-start;padding:20px;cursor:zoom-in}
.lb-stage.zoomed{cursor:zoom-out}
.lb-stage img{width:auto;max-width:100%;max-height:100%;box-shadow:0 20px 50px -12px rgba(20,31,23,.35);background:#fff;transition:width .2s}
.lb-stage.zoomed img{max-width:none;max-height:none}
.lb-side{display:none}
.gate .box{text-align:center;padding:38px 30px 30px;width:min(480px,100%)}
.gate img{width:84px;height:84px;margin:0 auto 14px}
.gate h2{font-family:var(--f-head);font-weight:800;font-size:22px;margin:10px 0 10px}
.gate p{color:var(--ink-2);font-size:14px;margin:0 0 14px}
.gate ul{text-align:left;font-size:13px;color:var(--ink-2);margin:0 0 20px;padding:14px 16px 14px 34px;background:var(--bg);border-radius:14px}
.gate ul li{margin:4px 0}
.gate .acts{display:grid;gap:10px}
.search-modal{align-items:flex-start;padding-top:10vh}
.search-modal .box{width:min(640px,100%)}
.sm-input{display:flex;align-items:center;gap:12px;padding:18px 56px 18px 20px;border-bottom:1px solid var(--line)}
.sm-input svg{width:20px;height:20px;color:var(--ink-3)}
.sm-input input{flex:1;border:0;outline:0;font-size:17px;background:transparent}
.sm-results{max-height:60vh;overflow:auto;padding:8px}
.sm-item{display:flex;align-items:center;gap:14px;padding:10px 12px;border-radius:14px;cursor:pointer}
.sm-item:hover,.sm-item.hl{background:var(--mint)}
.sm-item .v{width:34px;flex:none}
.sm-item b{font-family:var(--f-head);font-size:14px;display:block}
.sm-item span{font-size:12px;color:var(--ink-3)}
.sm-item .price{margin-left:auto;font-size:14px}
.sm-hint{padding:14px 20px;font-size:12px;color:var(--ink-3);border-top:1px solid var(--line-2);display:flex;gap:16px}

/* cart drawer */
.drawer{position:fixed;inset:0;z-index:110;pointer-events:none}
.drawer .scrim{position:absolute;inset:0;background:rgba(20,31,23,.38);opacity:0;transition:.3s}
.drawer .panel{position:absolute;top:0;right:0;bottom:0;width:min(100vw,460px);background:#fff;transform:translateX(100%);transition:transform .35s cubic-bezier(.2,.8,.2,1);display:flex;flex-direction:column;box-shadow:var(--sh-3)}
.drawer.open{pointer-events:auto}.drawer.open .scrim{opacity:1}.drawer.open .panel{transform:none}
.dr-head{display:flex;align-items:center;gap:12px;padding:18px 20px;border-bottom:1px solid var(--line-2)}
.dr-head h2{font-family:var(--f-head);font-size:14px;letter-spacing:.22em;text-transform:uppercase;margin:0}
.dr-head .x{margin-left:auto}
.dr-steps{display:flex;gap:8px;padding:12px 20px;border-bottom:1px solid var(--line-2);font-family:var(--f-head);font-size:10px;letter-spacing:.18em;text-transform:uppercase;color:var(--ink-3)}
.dr-steps span{display:flex;align-items:center;gap:6px}
.dr-steps span i{width:18px;height:18px;border-radius:50%;border:1px solid var(--line);display:grid;place-items:center;font-style:normal;font-family:var(--f-mono);font-size:10px}
.dr-steps span.on{color:var(--green)}
.dr-steps span.on i{background:var(--green);border-color:var(--green);color:#fff}
.dr-body{flex:1;overflow:auto;padding:16px 20px}
.dr-foot{border-top:1px solid var(--line-2);padding:16px 20px 20px;background:#FCFDFB}
.line{display:flex;gap:14px;padding:14px 0;border-bottom:1px solid var(--line-2)}
.line .thumb{width:64px;height:72px;border-radius:12px;background:radial-gradient(circle at 50% 35%,#fff,#EEF3EB);border:1px solid var(--line-2);display:flex;align-items:flex-end;justify-content:center;padding-bottom:6px;flex:none}
.line .thumb .v{width:26px}
.line .mid{flex:1;min-width:0}
.line .mid b{font-family:var(--f-head);font-size:14px;display:block}
.line .mid .mono{font-size:11.5px;color:var(--ink-3)}
.line .mid .row{display:flex;align-items:center;justify-content:space-between;margin-top:10px}
.line .rm{font-size:11px;color:var(--ink-3);text-decoration:underline}
.line .rm:hover{color:var(--warn)}
.totals{display:grid;gap:6px;font-size:13.5px}
.totals div{display:flex;justify-content:space-between}
.totals .mono{font-size:13.5px}
.totals .grand{font-weight:700;font-size:16px;padding-top:8px;margin-top:4px;border-top:1px dashed var(--line)}
.totals .grand .mono{font-size:18px;color:var(--green)}
.form-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.form-grid .full{grid-column:1/-1}
.fl{display:block;font-size:11px;font-weight:700;color:var(--ink-2);margin:0 0 5px;letter-spacing:.06em;text-transform:uppercase;font-family:var(--f-head)}
.check{display:flex;gap:10px;align-items:flex-start;font-size:12.5px;color:var(--ink-2);padding:12px;border-radius:12px;background:var(--bg);border:1px solid var(--line-2);cursor:pointer}
.check input{width:18px;height:18px;accent-color:var(--green);flex:none;margin-top:1px}
.err{color:var(--warn);font-size:12px;margin-top:8px;display:none}
.err.show{display:block}
.empty-cart{text-align:center;padding:50px 10px;color:var(--ink-3)}
.empty-cart .v{width:56px;margin:0 auto 16px;opacity:.7}
.confirm{text-align:center;padding:10px 0}
.confirm .tick{width:64px;height:64px;border-radius:50%;background:var(--mint);color:var(--green);display:grid;place-items:center;margin:10px auto 14px}
.confirm .tick svg{width:30px;height:30px}
.ref{font-family:var(--f-mono);font-size:20px;color:var(--green);background:var(--bg);border:1px dashed var(--line);border-radius:12px;padding:10px;margin:10px 0 16px;letter-spacing:.05em}
.order-preview{text-align:left;font-family:var(--f-mono);font-size:11px;background:var(--bg);border-radius:12px;padding:12px;white-space:pre-wrap;color:var(--ink-2);max-height:200px;overflow:auto;border:1px solid var(--line-2)}
.toast{position:fixed;left:50%;bottom:24px;transform:translateX(-50%) translateY(30px);background:var(--ink);color:#fff;padding:12px 18px;border-radius:999px;font-size:13px;z-index:200;opacity:0;transition:.3s;display:flex;align-items:center;gap:10px;box-shadow:var(--sh-3);pointer-events:none}
.toast.show{opacity:1;transform:translateX(-50%)}
.toast svg{width:16px;height:16px;color:#A9CBA9}

/* calculator */
.calc{display:grid;gap:18px}
@media (min-width:960px){.calc{grid-template-columns:1fr 1fr;align-items:start}.calc .results{position:sticky;top:calc(var(--hdr) + 20px)}}
.calc .card{padding:24px}
.cfield{margin-bottom:18px}
.cfield .lbl{display:flex;justify-content:space-between;align-items:baseline;font-family:var(--f-head);font-weight:700;font-size:11px;letter-spacing:.16em;text-transform:uppercase;color:var(--ink-2);margin-bottom:8px}
.cfield .lbl span{font-family:var(--f-body);font-weight:500;letter-spacing:0;text-transform:none;color:var(--ink-3);font-size:12px}
.inrow{display:flex;border:1.5px solid var(--line);border-radius:14px;background:#fff;overflow:hidden;transition:.15s}
.inrow:focus-within{border-color:var(--olive);box-shadow:0 0 0 4px rgba(106,139,110,.15)}
.inrow input{flex:1;min-width:0;border:0;outline:0;font-family:var(--f-mono);font-size:20px;padding:12px 14px;background:transparent}
.inrow .unit{display:flex;align-items:center;padding:0 14px;font-family:var(--f-mono);font-size:13px;color:var(--ink-3);background:var(--bg);border-left:1px solid var(--line)}
.seg{display:flex;background:var(--bg);border-left:1px solid var(--line)}
.seg button{padding:0 14px;font-family:var(--f-mono);font-size:13px;color:var(--ink-3)}
.seg button[aria-pressed=true]{background:var(--green);color:#fff}
.chips{display:flex;flex-wrap:wrap;gap:6px;margin-top:10px}
.chip{height:30px;padding:0 12px;border-radius:999px;border:1px solid var(--line);background:#fff;font-family:var(--f-mono);font-size:12px;color:var(--ink-2)}
.chip:hover{border-color:var(--olive)}
.chip[aria-pressed=true]{background:var(--mint);border-color:var(--sage);color:var(--green)}
.syr-opts{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}
.syr-opts button{border:1.5px solid var(--line);border-radius:14px;padding:12px 6px;background:#fff;font-family:var(--f-head);font-weight:700;font-size:13px}
.syr-opts button small{display:block;font-family:var(--f-mono);font-weight:400;font-size:11px;color:var(--ink-3);margin-top:2px}
.syr-opts button[aria-pressed=true]{border-color:var(--green);background:var(--green);color:#fff}
.syr-opts button[aria-pressed=true] small{color:#CFE0D0}
.res-big{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.res-big .s{border-radius:16px;padding:16px;background:var(--green);color:#fff}
.res-big .s.alt{background:var(--mint);color:var(--green)}
.res-big .k{font-family:var(--f-head);font-size:10px;font-weight:700;letter-spacing:.2em;text-transform:uppercase;opacity:.8}
.res-big .v{font-family:var(--f-mono);font-size:30px;line-height:1.1;margin-top:6px}
.res-big .v small{font-size:13px;opacity:.75}
.res-minor{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-top:10px}
.res-minor div{border:1px solid var(--line-2);border-radius:12px;padding:10px 12px;background:#fff}
.res-minor .k{font-size:10.5px;color:var(--ink-3);text-transform:uppercase;letter-spacing:.1em;font-weight:600}
.res-minor .v{font-family:var(--f-mono);color:var(--green);font-size:15px}
.cmsg{margin-top:12px;border-radius:12px;padding:10px 12px;font-size:13px;display:none}
.cmsg.show{display:block}.cmsg.warn{background:var(--warn-bg);color:var(--warn)}.cmsg.info{background:var(--mint);color:var(--green)}
.syr-box{margin-top:14px;background:#fff;border:1px solid var(--line-2);border-radius:14px;padding:12px 8px 6px}
.syr-cap{font-size:12px;color:var(--ink-3);text-align:center;margin:4px 0 4px}
.edu{margin-top:12px;font-size:12px;color:var(--ink-3);background:var(--bg);border-left:3px solid var(--sage);padding:10px 12px;border-radius:8px}

/* reviews */
.rev-stats{display:grid;gap:12px;grid-template-columns:repeat(2,1fr)}
@media (min-width:900px){.rev-stats{grid-template-columns:repeat(4,1fr)}}
.rev-stats .card{padding:20px;text-align:center}
.rev-stats b{display:block;font-family:var(--f-mono);font-size:26px;color:var(--green);font-weight:500}
.rev-stats span{font-size:12px;color:var(--ink-3)}
.ticker{overflow:hidden;mask-image:linear-gradient(90deg,transparent,#000 8%,#000 92%,transparent);-webkit-mask-image:linear-gradient(90deg,transparent,#000 8%,#000 92%,transparent)}
.ticker-track{display:flex;gap:16px;width:max-content;animation:ticker 60s linear infinite}
.ticker:hover .ticker-track{animation-play-state:paused}
.rcard{width:300px;padding:20px;flex:none;display:flex;flex-direction:column;gap:10px;position:relative}
.rcard .stars{display:flex;gap:2px;color:#C8CFC6}
.rcard .stars svg{width:14px;height:14px}
.rcard p{margin:0;font-size:13.5px;color:var(--ink-3);font-style:italic}
.rcard .who{font-size:12px;color:var(--ink-3);display:flex;gap:8px;align-items:center;margin-top:auto}
.rcard .who i{width:28px;height:28px;border-radius:50%;background:var(--bg-2);display:block;border:1px dashed var(--line)}
.sample-pill{position:absolute;top:-9px;right:14px}
.std-grid{display:grid;gap:16px;grid-template-columns:repeat(auto-fit,minmax(240px,1fr))}
.fb-wrap{display:grid;gap:28px}
@media (min-width:960px){.fb-wrap{grid-template-columns:.9fr 1.1fr;align-items:start}}
.rating-input{display:flex;gap:4px}
.rating-input button{color:#D3D9D1;transition:.15s}
.rating-input button svg{width:28px;height:28px}
.rating-input button.on{color:var(--brass)}

/* footer */
.site-foot{margin-top:40px;background:#13201A;color:#B6C3B8;padding:60px 0 30px;font-size:13.5px}
.site-foot .cols{display:grid;gap:30px}
@media (min-width:900px){.site-foot .cols{grid-template-columns:1.4fr 1fr 1fr 1fr}}
.site-foot h4{font-family:var(--f-head);color:#fff;font-size:11px;letter-spacing:.24em;text-transform:uppercase;margin:0 0 14px}
.site-foot a{display:block;padding:4px 0;color:#B6C3B8}
.site-foot a:hover{color:#fff}
.site-foot .brand b{color:#fff}
.site-foot .brand img{background:#fff;border-radius:50%}
.site-foot .disc{margin-top:36px;padding:20px;border:1px solid rgba(255,255,255,.1);border-radius:16px;font-size:12px;color:#93A396;line-height:1.6}
.site-foot .disc b{color:#D9C9A8;letter-spacing:.2em;font-family:var(--f-head);font-size:10.5px;display:block;margin-bottom:6px}
.site-foot .copy{margin-top:24px;display:flex;justify-content:space-between;gap:12px;flex-wrap:wrap;font-size:12px;color:#7D8C80}

/* misc */
.ssg{max-width:900px;margin:40px auto;padding:0 20px}
.fade-in{animation:fadeIn .4s ease both}
@keyframes fadeIn{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}
.reveal{opacity:0;transform:translateY(16px);transition:opacity .6s ease,transform .6s ease}
.reveal.in{opacity:1;transform:none}
.split{display:grid;gap:30px;align-items:center}
@media (min-width:960px){.split{grid-template-columns:1fr 1fr}}
.text-center{text-align:center}
.mt-0{margin-top:0}.mt-1{margin-top:8px}.mt-2{margin-top:16px}.mt-3{margin-top:24px}.mt-4{margin-top:36px}
.flex{display:flex}.gap-1{gap:8px}.gap-2{gap:12px}.wrap{flex-wrap:wrap}.center{justify-content:center}.between{justify-content:space-between}.items-center{align-items:center}
.floating-text{position:fixed;right:18px;bottom:18px;z-index:50;height:52px;padding:0 20px;border-radius:999px;background:#fff;border:1px solid var(--line);box-shadow:var(--sh-2);display:flex;align-items:center;gap:10px;font-family:var(--f-head);font-weight:700;font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:var(--green)}
.floating-text svg{width:18px;height:18px}
.floating-text:hover{background:var(--green);color:#fff}
@media (max-width:640px){.floating-text span{display:none}.floating-text{padding:0;width:52px;justify-content:center}}
/* checkout additions */
.order-badge{font-family:var(--f-mono);letter-spacing:.04em;text-transform:none;font-size:11px;height:24px;margin-left:8px;vertical-align:middle}
.dr-head h2{display:flex;align-items:center;flex-wrap:wrap;gap:4px}
.order-strip{display:flex;justify-content:space-between;align-items:center;padding:12px 14px;border-radius:14px;background:var(--mint);border:1px solid var(--mint-2);color:var(--green);font-size:13px}
.order-strip span{display:flex;align-items:center;gap:8px}.order-strip svg{width:16px;height:16px}
.order-strip b{font-size:16px}
.pay-opts{display:grid;gap:10px}
.pay-opt{display:flex;align-items:center;gap:14px;text-align:left;padding:16px;border:1.5px solid var(--line);border-radius:16px;background:#fff;transition:.15s}
.pay-opt:hover{border-color:var(--olive)}
.pay-opt b{display:block;font-family:var(--f-head);font-size:15px}
.pay-opt small{display:block;font-size:12px;color:var(--ink-3);margin-top:2px}
.pay-opt .radio{margin-left:auto;width:20px;height:20px;border-radius:50%;border:2px solid var(--line);flex:none;transition:.15s}
.pay-opt[aria-checked=true]{border-color:var(--green);box-shadow:0 0 0 3px rgba(44,74,52,.12);background:#FBFDFB}
.pay-opt[aria-checked=true] .radio{border-color:var(--green);border-width:6px}
.pay-ic{width:40px;height:40px;border-radius:12px;background:var(--mint);color:var(--green);display:grid;place-items:center;flex:none;font-family:var(--f-head);font-weight:900;font-size:20px}
.pay-ic svg{width:20px;height:20px}
.pay-ic.venmo{background:#E7F2FB;color:#1E7FD0}
.input.bad{border-color:#E1A99C}
.pay-card{border:1px solid var(--line);border-radius:16px;padding:16px;margin-top:12px;background:#fff}
.pay-card p{margin:8px 0 12px;font-size:13.5px;color:var(--ink-2)}
.venmo-card{border-color:#BFDDF3;background:#FAFDFF}
.venmo-handle{display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin:12px 0}
.venmo-handle b{font-size:17px;color:var(--ink)}
.venmo-handle .btn{margin-left:auto}
.warn-banner{display:flex;gap:10px;align-items:flex-start;padding:12px 14px;border-radius:12px;background:#FFF6E5;border:1.5px solid #E9C77F;color:#6B4B12;font-size:13px;margin:6px 0 12px;font-weight:500}
.warn-banner svg{width:18px;height:18px;flex:none;margin-top:1px}
.venmo-btn{background:#1E7FD0;box-shadow:0 8px 22px -10px rgba(30,127,208,.7);height:54px;font-size:13px}
.venmo-btn:hover{background:#1668AD}
.pending-banner{display:flex;gap:18px;align-items:center;padding:22px;flex-wrap:wrap;background:linear-gradient(120deg,#fff,#F3F7F1)}
.pending-banner>div:nth-child(2){flex:1;min-width:240px}
.pending-banner b{font-family:var(--f-head);font-size:17px}
.pending-banner p{margin:6px 0 0;color:var(--ink-2);font-size:13.5px}
.cs-top{display:flex;gap:14px;align-items:center}
.cs-vial{width:52px;height:80px;flex:none;border-radius:12px;background:radial-gradient(circle at 50% 35%,#fff,#EEF3EB);display:flex;align-items:flex-end;justify-content:center;padding-bottom:4px;border:1px solid var(--line-2)}
.cs-vial .v{width:30px}
.cs-status{display:flex;gap:10px;align-items:flex-start;padding:10px 12px;border-radius:12px;background:#FBF8F1;border:1px solid #EFE4CD;font-size:12px;color:#6B5631;line-height:1.4}
.cs-status b{font-family:var(--f-head);font-size:12px}
.cs-status .dot{width:8px;height:8px;border-radius:50%;background:var(--brass);margin-top:4px;flex:none;box-shadow:0 0 0 4px rgba(181,148,91,.18);animation:pulse 2s infinite}
@keyframes pulse{50%{box-shadow:0 0 0 7px rgba(181,148,91,.05)}}

/* svg sizing safety net: every inline svg gets explicit size */
svg{flex-shrink:0}
svg.v{height:auto}
.chroma,#cSyr{width:100%;height:auto}
.empty svg{width:28px;height:28px;margin:0 auto 10px;color:var(--ink-3)}
.step .ic svg,.icon-btn svg,.btn svg,.add-btn svg{flex-shrink:0}
.pcard .pc-foot .add-btn{flex:none;height:40px;align-self:center}
.pcard .pc-foot .add-btn svg{width:15px;height:15px}
.sm-item svg.v{width:34px}
.site-foot svg{width:18px;height:18px}

/* Real Peak Peppers product photography — consistently cropped 4:5 source frames. */
[hidden]{display:none!important}
.pcard .media:has(.vial-photo){background:#F3F4F0}
.pcard .media .vial-photo{position:absolute;inset:0;width:100%;height:100%;max-width:none;object-fit:contain;transform:none;filter:none;border-radius:22px 22px 0 0}
.pcard:hover .media .vial-photo{transform:none}
.pcard .media:has(.vial-photo) .shadow{display:none}
.pd-stage .vial-photo{position:absolute;inset:0;width:100%;height:100%;max-width:none;object-fit:contain;transform:none;filter:none;animation:none;border-radius:23px}
.pd-stage:has(.vial-photo) .shadow,.pd-stage:has(.vial-photo) .grid-bg{display:none}
.pd-stage:has(.vial-photo) .br{background:rgba(255,255,255,.90);border-radius:8px;padding:4px 8px}
.line .thumb:has(.vial-photo){padding:0;overflow:hidden}
.line .thumb .vial-photo{width:100%;height:100%;object-fit:cover;max-width:none}
.sm-item img.vial-photo{width:44px;height:55px;object-fit:cover;border-radius:6px}
.cs-vial:has(.vial-photo){padding:0;overflow:hidden}
.cs-vial .vial-photo{width:100%;height:100%;object-fit:cover}
.hero-stage .vials img.vial-photo{height:auto;border-radius:12px}
.stock-badge{background:#EDF0EC;border-color:#D9DED7;color:#6D776D;font-size:10px;letter-spacing:.08em;align-self:flex-start}
.add-btn:disabled{background:#E5E9E3;color:#73806F;box-shadow:none;cursor:not-allowed;opacity:1;letter-spacing:.04em;font-size:10px;padding:0 12px;white-space:normal;line-height:1.2;text-align:center;max-width:150px}
.price small{display:block;font-family:var(--f-body);font-size:10px;letter-spacing:0}
/* Missing product photographs: flat alabaster/sage brand panels, no rendered vials. */
.brand-panel{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:8px;text-align:center;background:linear-gradient(145deg,#F6F8F2,#E8EEE4);color:var(--green);padding:22px;border-radius:14px;overflow:hidden;isolation:isolate;position:relative}
.brand-panel .panel-mark{width:80px;height:80px;object-fit:contain;opacity:.30;margin:0 auto 8px}
.brand-panel strong{font-family:var(--f-head);font-size:17px;line-height:1.3;max-width:100%}
.brand-panel .mono{font-size:13px}.brand-panel small{font-size:10px;color:var(--ink-3)}
.pcard .media .brand-panel,.pcard:hover .media .brand-panel{inset:0;left:0;bottom:0;width:100%;height:100%;transform:none;filter:none;border-radius:22px 22px 0 0}
.pcard .media:has(.brand-panel) .shadow{display:none}
.pd-stage .brand-panel{inset:0;left:0;bottom:0;width:100%;height:100%;transform:none;animation:none;filter:none;border-radius:23px}
.pd-stage .brand-panel strong{font-size:clamp(22px,3vw,34px)}
.pd-stage .brand-panel .panel-mark{width:110px;height:110px}
.pd-stage:has(.brand-panel) .shadow,.pd-stage:has(.brand-panel) .grid-bg{display:none}
.line .thumb:has(.brand-panel),.cs-vial:has(.brand-panel){padding:0;overflow:hidden}
.line .thumb .brand-panel,.cs-vial .brand-panel{width:100%;height:100%;padding:4px;gap:0;border-radius:8px}
.line .thumb .brand-panel strong,.line .thumb .brand-panel span,.line .thumb .brand-panel small,.cs-vial .brand-panel strong,.cs-vial .brand-panel span,.cs-vial .brand-panel small{display:none}
.line .thumb .brand-panel .panel-mark,.cs-vial .brand-panel .panel-mark{width:36px;height:36px;margin:0}
.sm-item .brand-panel{width:44px;height:55px;padding:4px;flex:none}.sm-item .brand-panel .panel-mark{width:34px;height:34px;margin:0}.sm-item .brand-panel strong,.sm-item .brand-panel span,.sm-item .brand-panel small{display:none}
.empty-cart .brand-panel{width:150px;height:180px;padding:10px}.empty-cart .brand-panel strong{font-size:13px}.empty-cart .brand-panel .panel-mark{width:50px;height:50px}
/* Direct website review submission */
.review-form-wrap{max-width:650px}.review-form{padding:clamp(20px,4vw,36px)}
.review-rating{padding:0;border:0;min-width:0}.review-rating-options{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:8px}
.review-rating-options label{position:relative;min-width:0;cursor:pointer}.review-rating-options input{position:absolute;opacity:0;width:1px;height:1px}
.review-rating-options span{display:flex;align-items:center;justify-content:center;gap:5px;min-height:48px;border:1.5px solid var(--line);border-radius:12px;background:var(--cream);font-weight:700}
.review-rating-options svg{width:17px;height:17px;flex-shrink:0}.review-rating-options input:checked+span{background:var(--green);color:white;border-color:var(--green)}
.review-rating-options input:focus-visible+span{outline:3px solid var(--olive);outline-offset:3px}.review-form .input,.review-form .textarea{font-size:16px}
.review-form .textarea{min-height:150px}.review-guidance{display:flex;align-items:start;gap:12px;justify-content:space-between;margin-top:8px}.review-guidance small:first-child{flex:1}.review-guidance small:last-child{white-space:nowrap}
.review-honey{position:absolute;left:-10000px;width:1px;height:1px;overflow:hidden}.review-success{padding:20px 0;text-align:center}.public-reviews{display:grid;gap:18px}.public-review{padding:24px;overflow-wrap:anywhere}.review-body{white-space:pre-wrap;line-height:1.75}.review-stars{color:var(--brass);font-size:20px;white-space:nowrap}.review-empty{padding:32px;text-align:center}.review-summary{padding:16px 0;font-weight:700}
[hidden]{display:none!important}
.review-rating-options{gap:4px}
@media (min-width:1060px){.hdr .bar{gap:14px}.nav{margin-left:0}.nav a{font-size:10px;letter-spacing:.08em;padding:9px 8px;white-space:nowrap}}