:root{--green:#163a2c;--green2:#24543f;--leather:#9a5b2e;--copper:#c07a45;--cream:#f6f0e4;--paper:#fbf8f1;--ink:#1d221f;--muted:#5f675f;--line:#e3d9c6}
*{box-sizing:border-box}body{margin:0;font-family:system-ui,-apple-system,"Segoe UI",sans-serif;color:var(--ink);background:var(--paper);line-height:1.6}
h1,h2,h3,.serif{font-family:Georgia,"Times New Roman",serif;letter-spacing:-.01em}a{color:var(--green2)}
.wrap{max-width:1140px;margin:0 auto;padding:0 20px}
header{position:sticky;top:0;z-index:10;background:rgba(22,58,44,.96);backdrop-filter:blur(6px);color:var(--cream)}
header .wrap{display:flex;align-items:center;justify-content:space-between;height:64px}
.logo{font-family:Georgia,serif;font-size:1.45rem;color:var(--cream);text-decoration:none}.logo b{color:var(--copper)}
nav a{color:var(--cream);text-decoration:none;margin-left:18px;font-size:.95rem}nav a:hover{color:var(--copper)}
.cartlink{background:var(--copper);padding:6px 12px;border-radius:99px}.count{font-weight:700}
.hero{background:radial-gradient(circle at 80% 20%,#2f6b50 0,transparent 45%),linear-gradient(135deg,var(--green),#0e271d);color:var(--cream);overflow:hidden}
.hero .wrap{display:grid;gap:30px;padding:70px 20px;align-items:center}@media(min-width:860px){.hero .wrap{grid-template-columns:1.1fr .9fr}}
.hero h1{font-size:clamp(2.3rem,5vw,3.8rem);line-height:1.05;margin:.2em 0}.hero p{color:#d9d1bf;max-width:520px}
.eyebrow{text-transform:uppercase;letter-spacing:.18em;font-size:.75rem;color:var(--copper)}
.btn{display:inline-block;background:var(--copper);color:#fff;border:0;padding:13px 24px;border-radius:99px;font-weight:600;text-decoration:none;cursor:pointer;font-size:1rem}
.btn:hover{background:var(--leather)}.btn.ghost{background:transparent;border:1px solid var(--cream);color:var(--cream);margin-left:8px}
.btn[disabled]{opacity:.5;cursor:not-allowed}
.hero svg{width:100%;max-width:440px;justify-self:center}
section{padding:60px 0}.center{text-align:center}
.grid{display:grid;gap:22px;grid-template-columns:repeat(auto-fill,minmax(250px,1fr))}
.card{background:#fff;border:1px solid var(--line);border-radius:18px;padding:22px;display:flex;flex-direction:column;transition:.2s}
.card:hover{transform:translateY(-3px);box-shadow:0 12px 30px rgba(22,58,44,.1)}
.vial{height:120px;border-radius:12px;background:linear-gradient(160deg,var(--cream),#efe3cc);display:flex;align-items:center;justify-content:center;margin-bottom:14px}
.card h3{margin:.2em 0;font-size:1.3rem}.card .tag{color:var(--muted);font-size:.92rem;flex:1}
.badges{display:flex;gap:6px;margin-bottom:6px}.badge{font-size:.72rem;padding:3px 9px;border-radius:99px;background:#e6efe9;color:var(--green);font-weight:600}
.badge.dog{background:#f5e6d8;color:var(--leather)}
.price{font-weight:700;font-size:1.1rem;color:var(--green)}.row{display:flex;justify-content:space-between;align-items:center;margin-top:12px;gap:8px}
.small{font-size:.8rem;color:var(--muted)}
.pillars{display:grid;gap:20px;grid-template-columns:repeat(auto-fit,minmax(220px,1fr))}.pillars div{background:var(--cream);padding:24px;border-radius:16px}
.band{background:var(--cream)}
.pd{display:grid;gap:36px}@media(min-width:820px){.pd{grid-template-columns:1fr 1fr}}.pd .vial{height:340px}
select,input{padding:10px;border:1px solid var(--line);border-radius:10px;font-size:1rem}
table{width:100%;border-collapse:collapse}td,th{padding:12px 6px;border-bottom:1px solid var(--line);text-align:left}
.notice{background:#fff7ea;border:1px solid #edd3ad;padding:14px 18px;border-radius:12px;font-size:.92rem}
footer{background:#0e271d;color:#c9c1ae;padding:44px 0;font-size:.88rem}footer .cols{display:grid;gap:24px;grid-template-columns:repeat(auto-fit,minmax(220px,1fr))}footer a{color:var(--copper)}
.filters button{background:#fff;border:1px solid var(--line);padding:8px 16px;border-radius:99px;margin:0 6px 10px 0;cursor:pointer}.filters button.on{background:var(--green);color:#fff}
@media(max-width:600px){nav a:not(.cartlink){display:none}}