:root{--bg:oklch(0.965 0.012 125);--bg-2:oklch(0.945 0.018 125);--paper:oklch(0.99 0.004 110);--ink:oklch(0.20 0.012 130);--ink-2:oklch(0.40 0.012 130);--ink-3:oklch(0.55 0.010 130);--sage:oklch(0.52 0.060 150);--warn:oklch(0.55 0.18 30);--line:oklch(0.90 0.008 125);--line-2:oklch(0.85 0.010 125);--serif:"Cormorant Garamond","EB Garamond",Georgia,serif;--sans:-apple-system,BlinkMacSystemFont,"Inter",system-ui,sans-serif;--mono:"JetBrains Mono",ui-monospace,Menlo,monospace;--radius-sm:8px;--radius:12px;--radius-lg:18px;--shadow:0 1px 2px rgba(20,20,20,.04),0 6px 18px -8px rgba(20,20,20,.08);--shadow-lg:0 8px 30px -10px rgba(20,20,20,.25);--page-pad:24px;--page-max:1280px;--section-gap:22px}
body[data-palette="warm"]{--bg:oklch(0.970 0.018 80);--bg-2:oklch(0.948 0.028 75);--sage:oklch(0.50 0.080 60)}
body[data-palette="mineral"]{--bg:oklch(0.955 0.008 230);--bg-2:oklch(0.935 0.012 225);--sage:oklch(0.48 0.060 200)}
body{margin:0;background:var(--bg);color:var(--ink);font-family:var(--sans);font-size:15px;line-height:1.5;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}
.serif{font-family:var(--serif);font-weight:400}
.mono{font-family:var(--mono);font-variant-numeric:tabular-nums}
.page-width{max-width:var(--page-max);margin-inline:auto;padding-inline:var(--page-pad);width:100%}
.visually-hidden{position:absolute!important;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
.card{background:var(--paper);border:1px solid var(--line);border-radius:var(--radius);box-shadow:var(--shadow)}
.card-inset{background:var(--bg-2);border:1px solid var(--line);border-radius:var(--radius-sm)}
.hair{border:0;border-top:1px solid var(--line);margin:16px 0}
.eyebrow{font-family:var(--mono);font-size:10.5px;letter-spacing:.1em;text-transform:uppercase;color:var(--ink-3);font-weight:500}
.eyebrow--sage{color:var(--sage)}
.benefit-chip{display:inline-flex;align-items:center;gap:6px;background:var(--bg-2);border:1px solid var(--line);color:var(--ink-2);border-radius:999px;padding:5px 10px;font-size:12px}
.benefit-chip .cart-icon{color:var(--sage)}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;padding:10px 16px;border-radius:999px;font:inherit;font-weight:500;font-size:14px;line-height:1;text-decoration:none;cursor:pointer;transition:background .15s ease,color .15s ease,transform .12s ease;border:1px solid transparent}
.btn:disabled,.btn[aria-disabled="true"]{opacity:.55;cursor:not-allowed}
.btn--primary{background:var(--ink);color:var(--paper)}
.btn--primary:not(:disabled):hover{background:oklch(0.14 0.012 130)}
.btn--ghost{background:transparent;color:var(--ink);border-color:var(--line-2)}
.btn--ghost:not(:disabled):hover{background:var(--bg-2)}
.btn--lg{padding:14px 22px;font-size:15px}
.btn--block{width:100%}
.btn--pill{border-radius:999px}
.input{appearance:none;width:100%;background:var(--paper);border:1px solid var(--line-2);border-radius:var(--radius-sm);padding:10px 12px;font:inherit;font-size:14px;color:var(--ink);transition:border-color .15s ease}
.input:focus{outline:none;border-color:var(--ink)}
.live-dot{display:inline-block;width:8px;height:8px;background:var(--sage);border-radius:999px;position:relative}
.live-dot::after{content:"";position:absolute;inset:-3px;border-radius:999px;background:var(--sage);opacity:.25;animation:live-pulse 1.6s ease-out infinite}
@keyframes live-pulse{0%{transform:scale(.6);opacity:.35}100%{transform:scale(1.6);opacity:0}}
.anim-enter{animation:anim-enter .25s ease-out both}
@keyframes anim-enter{from{opacity:0;transform:translateY(4px)}to{opacity:1;transform:translateY(0)}}
@media (prefers-reduced-motion:reduce){.anim-enter{animation:none}.live-dot::after{animation:none;opacity:0}}
