/* ==========================================================================
   Konkan Grove — organic storefront design system (plain CSS)
   Tokens first, then base, layout, components, pages, utilities.
   ========================================================================== */
:root{
  --radius:.5rem;
  --background:oklch(.985 .012 90);
  --foreground:oklch(.22 .03 150);
  --card:oklch(1 0 0);
  --primary:oklch(.42 .11 148);
  --primary-fg:oklch(.985 .012 90);
  --secondary:oklch(.94 .03 85);
  --muted:oklch(.955 .018 85);
  --muted-fg:oklch(.48 .03 145);
  --accent:oklch(.74 .17 60);
  --accent-fg:oklch(.22 .05 40);
  --border:oklch(.9 .02 85);
  --ring:oklch(.55 .13 148);
  --leaf-deep:oklch(.28 .08 150);
  --mango:oklch(.78 .18 65);
  --cream:oklch(.97 .03 85);
  --price:oklch(.5 .22 25);
  --star:oklch(.75 .16 75);
  --gradient-hero:linear-gradient(135deg,oklch(.35 .09 148) 0%,oklch(.55 .15 155) 100%);
  --shadow-soft:0 1px 2px oklch(.2 .03 150/.06),0 4px 12px oklch(.2 .03 150/.06);
  --shadow-elevated:0 8px 28px oklch(.2 .03 150/.12);
  --font-display:"Fraunces",ui-serif,Georgia,serif;
  --font-sans:"Inter",ui-sans-serif,system-ui,sans-serif;
}
*,*::before,*::after{box-sizing:border-box;border-color:var(--border)}
html{-webkit-text-size-adjust:100%}
body{margin:0;background:var(--background);color:var(--foreground);font-family:var(--font-sans);font-size:15px;line-height:1.5;-webkit-font-smoothing:antialiased}
h1,h2,h3,h4{font-family:var(--font-display);letter-spacing:-.01em;margin:0;font-weight:600}
img{display:block;max-width:100%}
a{color:inherit;text-decoration:none}
button,input,select,textarea{font:inherit;color:inherit}
ul{margin:0;padding:0;list-style:none}
svg{width:1.25em;height:1.25em;stroke:currentColor;fill:none;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;flex:none}

/* ---------- layout ---------- */
.container-x{width:100%;max-width:80rem;margin-inline:auto;padding-inline:1rem}
@media(min-width:768px){.container-x{padding-inline:1.5rem}}
@media(min-width:1024px){.container-x{padding-inline:2rem}}
.page{display:flex;min-height:100vh;flex-direction:column}
.page main{flex:1}
.grid{display:grid}
.flex{display:flex}
.row{display:flex;align-items:center;gap:.5rem}
.between{display:flex;align-items:center;justify-content:space-between;gap:1rem}
.stack{display:grid;gap:1.25rem}

/* ---------- buttons ---------- */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:.5rem;border:1px solid transparent;border-radius:var(--radius);padding:.5rem 1rem;font-size:.875rem;font-weight:600;cursor:pointer;transition:filter .15s,background .15s,box-shadow .15s;background:var(--primary);color:var(--primary-fg)}
.btn:hover{filter:brightness(.94)}
.btn:focus-visible{outline:2px solid var(--ring);outline-offset:2px}
.btn-accent{background:var(--accent);color:var(--accent-fg)}
.btn-outline{background:var(--card);color:var(--foreground);border-color:var(--border)}
.btn-outline:hover{background:var(--secondary);filter:none}
.btn-ghost{background:transparent;color:inherit;padding:.5rem}
.btn-ghost:hover{background:var(--secondary);filter:none}
.btn-lg{padding:.75rem 1.25rem;font-size:1rem}
.btn-sm{padding:.35rem .7rem;font-size:.8rem}
.btn-block{width:100%}
.btn[disabled]{opacity:.5;cursor:not-allowed}

/* ---------- form ---------- */
.field label{display:block;font-size:.8rem;font-weight:600;color:var(--muted-fg)}
.input,select.input{width:100%;margin-top:.25rem;background:var(--card);border:1px solid var(--border);border-radius:var(--radius);padding:.55rem .75rem;font-size:.9rem}
.input:focus{outline:2px solid var(--ring);outline-offset:-1px}
.check{display:flex;align-items:center;gap:.5rem;font-size:.875rem;cursor:pointer}
.check input{accent-color:var(--primary);width:1rem;height:1rem}

/* ---------- header ---------- */
.site-header{position:sticky;top:0;z-index:40;background:color-mix(in oklab,var(--background) 95%,transparent);backdrop-filter:blur(8px);border-bottom:1px solid var(--border)}
.utility-bar{background:var(--leaf-deep);color:var(--primary-fg);font-size:.75rem}
.utility-bar .container-x{display:flex;height:2rem;align-items:center;justify-content:space-between}
.utility-bar a:hover{text-decoration:underline}
.header-main{display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:.75rem;padding-block:.75rem}
@media(min-width:768px){.header-main{gap:1.5rem;padding-block:1rem}}
.brand{display:flex;align-items:center;gap:.5rem;flex:none}
.brand-mark{display:grid;place-items:center;height:2.25rem;width:2.25rem;border-radius:.5rem;background:var(--primary);color:var(--primary-fg)}
.brand-name{display:block;font-family:var(--font-display);font-size:1.125rem;font-weight:600;line-height:1.15}
.brand-sub{display:block;font-size:.625rem;text-transform:uppercase;letter-spacing:.15em;color:var(--muted-fg)}
.brand-text{display:none}
@media(min-width:640px){.brand-text{display:block}}
.searchbar{display:flex;align-items:stretch;overflow:hidden;border:1px solid var(--border);border-radius:.5rem;background:var(--card);min-width:0}
.searchbar:focus-within{box-shadow:0 0 0 2px var(--ring)}
.searchbar select{display:none;background:var(--secondary);border:0;padding-inline:.75rem;font-size:.85rem}
@media(min-width:768px){.searchbar select{display:block}}
.searchbar input{flex:1;min-width:0;border:0;background:transparent;padding:.6rem .75rem;font-size:.9rem}
.searchbar input:focus{outline:none}
.searchbar button{border:0;background:var(--accent);color:var(--accent-fg);padding-inline:1rem;cursor:pointer}
.header-actions{display:flex;align-items:center;gap:.25rem}
.acct-link{display:none;flex-direction:column;align-items:flex-start;border-radius:var(--radius);padding:.25rem .5rem;font-size:.75rem}
@media(min-width:768px){.acct-link{display:flex}}
.acct-link:hover{background:var(--secondary)}
.acct-link b{display:flex;align-items:center;gap:.25rem}
.icon-link{display:none}
@media(min-width:640px){.icon-link{display:inline-flex}}
.cart-link{position:relative;display:inline-flex;align-items:center;gap:.5rem;border-radius:var(--radius);padding:.5rem .75rem;font-size:.875rem;font-weight:600}
.cart-link:hover{background:var(--secondary)}
.cart-link svg{width:1.5rem;height:1.5rem}
.cart-badge{position:absolute;right:-.5rem;top:-.5rem;display:grid;place-items:center;height:1.25rem;min-width:1.25rem;padding-inline:.25rem;border-radius:999px;background:var(--accent);color:var(--accent-fg);font-size:.7rem;font-weight:700}
.cart-badge[hidden]{display:none}
.cart-label{display:none}
@media(min-width:640px){.cart-label{display:inline}}
.menu-btn{display:inline-flex}
@media(min-width:1024px){.menu-btn{display:none}}
.cat-strip{display:none;border-top:1px solid var(--border);background:color-mix(in oklab,var(--cream) 60%,transparent)}
@media(min-width:1024px){.cat-strip{display:block}}
.cat-strip .container-x{display:flex;height:2.75rem;align-items:center;gap:.25rem;font-size:.875rem;overflow-x:auto}
.cat-strip a{border-radius:var(--radius);padding:.375rem .75rem;white-space:nowrap}
.cat-strip a:hover{background:var(--secondary)}
.cat-strip .deal{color:var(--price);font-weight:600}
.strip-note{display:inline-flex;align-items:center;gap:.25rem;padding-right:.75rem;color:var(--muted-fg)}
.divider-v{margin-inline:.5rem;height:1rem;width:1px;background:var(--border)}
/* mobile drawer */
.drawer{position:fixed;inset:0;z-index:60;display:none}
.drawer[open]{display:block}
.drawer-scrim{position:absolute;inset:0;background:oklch(.2 .03 150/.45)}
.drawer-panel{position:absolute;inset-block:0;left:0;width:18rem;background:var(--card);padding:1.5rem;box-shadow:var(--shadow-elevated);overflow:auto}
.drawer-panel nav{display:grid;gap:.25rem;margin-top:2rem}
.drawer-panel nav a{border-radius:var(--radius);padding:.5rem .75rem}
.drawer-panel nav a:hover{background:var(--secondary)}

/* ---------- product card ---------- */
.card{background:var(--card);border:1px solid var(--border);border-radius:.75rem}
.product-card{display:flex;flex-direction:column;overflow:hidden;background:var(--card);border:1px solid var(--border);border-radius:.75rem;transition:box-shadow .2s}
.product-card:hover{box-shadow:var(--shadow-elevated)}
.product-media{position:relative;display:block;aspect-ratio:1;overflow:hidden;background:var(--secondary)}
.product-media img{height:100%;width:100%;object-fit:cover;transition:transform .5s}
.product-card:hover .product-media img{transform:scale(1.05)}
.tag-off{position:absolute;left:.75rem;top:.75rem;border-radius:999px;background:var(--price);color:#fff;padding:.1rem .5rem;font-size:.7rem;font-weight:700}
.tag-badge{position:absolute;right:.75rem;top:.75rem;border-radius:999px;background:color-mix(in oklab,var(--background) 90%,transparent);padding:.1rem .5rem;font-size:.7rem;font-weight:600;box-shadow:var(--shadow-soft)}
.product-body{display:flex;flex:1;flex-direction:column;padding:1rem}
.eyebrow{font-size:.7rem;text-transform:uppercase;letter-spacing:.15em;color:var(--muted-fg)}
.product-title{margin-top:.25rem;font-weight:500;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.product-title:hover{color:var(--primary)}
.rating{margin-top:.25rem;display:flex;align-items:center;gap:.25rem;font-size:.75rem;color:var(--muted-fg)}
.rating svg{width:.9rem;height:.9rem;fill:var(--star);stroke:var(--star)}
.rating b{color:var(--foreground);font-weight:600}
.price-row{margin-top:.5rem;display:flex;align-items:baseline;gap:.5rem}
.price{font-size:1.125rem;font-weight:700;color:var(--price)}
.mrp{font-size:.75rem;color:var(--muted-fg);text-decoration:line-through}
.product-card .btn{margin-top:auto}
.unit{font-size:.75rem;color:var(--muted-fg);margin-bottom:1rem}

/* ---------- grids ---------- */
.pgrid{display:grid;gap:1.25rem;grid-template-columns:1fr}
@media(min-width:640px){.pgrid{grid-template-columns:repeat(2,1fr)}}
@media(min-width:1024px){.pgrid{grid-template-columns:repeat(3,1fr)}}
@media(min-width:1280px){.pgrid-4{grid-template-columns:repeat(4,1fr)}}

/* ---------- hero / home ---------- */
.hero{background:var(--cream);overflow:hidden}
.hero .container-x{display:grid;gap:2rem;padding-block:2.5rem}
@media(min-width:768px){.hero .container-x{grid-template-columns:1fr 1fr;align-items:center;padding-block:4rem}}
.pill{display:inline-flex;align-items:center;gap:.5rem;border-radius:999px;background:color-mix(in oklab,var(--primary) 12%,transparent);color:var(--primary);padding:.25rem .75rem;font-size:.75rem;font-weight:600;text-transform:uppercase;letter-spacing:.08em}
.hero h1{margin-top:1rem;font-size:2.25rem;line-height:1.05}
@media(min-width:640px){.hero h1{font-size:3rem}}
@media(min-width:768px){.hero h1{font-size:3.5rem}}
.hero h1 .accentline{color:var(--primary)}
.lede{margin-top:1.25rem;max-width:32rem;color:var(--muted-fg);font-size:1rem}
.hero-cta{margin-top:1.75rem;display:flex;flex-wrap:wrap;gap:.75rem}
.stats{margin-top:2rem;display:grid;grid-template-columns:repeat(3,1fr);gap:1rem;max-width:28rem;font-size:.75rem;color:var(--muted-fg)}
.stats b{display:block;font-size:1.5rem;font-weight:600;color:var(--foreground)}
.hero-media{position:relative}
.hero-media .frame{aspect-ratio:4/3;overflow:hidden;border-radius:1rem;background:var(--secondary);box-shadow:var(--shadow-elevated)}
.hero-media img{height:100%;width:100%;object-fit:cover}
.float-card{display:none;position:absolute;bottom:-1.5rem;left:-1rem;border:1px solid var(--border);background:var(--card);border-radius:.75rem;padding:1rem;box-shadow:var(--shadow-elevated)}
@media(min-width:640px){.float-card{display:block}}
.trust{border-block:1px solid var(--border);background:var(--background)}
.trust .container-x{display:grid;gap:1.5rem;padding-block:1.5rem}
@media(min-width:640px){.trust .container-x{grid-template-columns:repeat(2,1fr)}}
@media(min-width:1024px){.trust .container-x{grid-template-columns:repeat(4,1fr)}}
.trust-item{display:flex;align-items:center;gap:.75rem}
.trust-item span.ic{display:grid;place-items:center;height:2.5rem;width:2.5rem;flex:none;border-radius:999px;background:color-mix(in oklab,var(--primary) 12%,transparent);color:var(--primary)}
.trust-item .t{font-size:.875rem;font-weight:600}
.trust-item .s{font-size:.75rem;color:var(--muted-fg)}
.section{padding-block:3.5rem}
.section-head{display:flex;align-items:flex-end;justify-content:space-between;gap:1rem}
.section-head h2{font-size:1.875rem}
.section-head p{margin:.25rem 0 0;font-size:.875rem;color:var(--muted-fg)}
.link-more{font-size:.875rem;font-weight:600;color:var(--primary)}
.cat-grid{margin-top:1.5rem;display:grid;gap:1rem;grid-template-columns:1fr}
@media(min-width:640px){.cat-grid{grid-template-columns:repeat(2,1fr)}}
@media(min-width:1024px){.cat-grid{grid-template-columns:repeat(5,1fr)}}
.cat-card{position:relative;overflow:hidden;border:1px solid var(--border);border-radius:.75rem;padding:1.5rem;transition:box-shadow .2s}
.cat-card:hover{box-shadow:var(--shadow-elevated)}
.cat-card.warm{background:linear-gradient(135deg,oklch(.96 .04 85),oklch(.92 .06 75))}
.cat-card.leafy{background:linear-gradient(135deg,oklch(.95 .05 145),oklch(.9 .07 155))}
.cat-card .tag{font-size:.7rem;font-weight:600;text-transform:uppercase;letter-spacing:.15em;color:var(--primary)}
.cat-card .name{margin-top:.5rem;font-family:var(--font-display);font-size:1.5rem;font-weight:600}
.cat-card .go{margin-top:1.5rem;display:inline-flex;align-items:center;gap:.25rem;font-size:.875rem;font-weight:600;color:var(--primary)}
.cat-card:hover .go svg{transform:translateX(4px)}
.cat-card .go svg{transition:transform .2s}
.feature{display:grid;overflow:hidden;border-radius:1rem;background:var(--gradient-hero)}
@media(min-width:768px){.feature{grid-template-columns:1fr 1fr}}
.feature .copy{padding:2rem;color:var(--primary-fg)}
@media(min-width:768px){.feature .copy{padding:3rem}}
.feature h3{margin-top:.75rem;font-size:1.875rem}
@media(min-width:768px){.feature h3{font-size:2.25rem}}
.feature .kicker{font-size:.75rem;font-weight:600;text-transform:uppercase;letter-spacing:.15em;opacity:.8}
.feature p{margin-top:1rem;max-width:28rem;opacity:.9}
.feature img{height:100%;width:100%;object-fit:cover;aspect-ratio:16/10}
@media(min-width:768px){.feature img{aspect-ratio:auto}}

/* ---------- shop ---------- */
.crumbs{font-size:.75rem;color:var(--muted-fg)}
.crumbs a:hover{color:var(--primary)}
.crumbs .cur{color:var(--foreground)}
.shop-layout{display:grid;gap:2rem;padding-bottom:4rem}
@media(min-width:1024px){.shop-layout{grid-template-columns:240px 1fr}}
.filters{align-self:start;display:grid;gap:1.5rem;background:var(--card);border:1px solid var(--border);border-radius:.75rem;padding:1.25rem}
@media(min-width:1024px){.filters{position:sticky;top:8rem}}
.filters h3{font-size:.8rem;font-weight:600;text-transform:uppercase;letter-spacing:.08em;color:var(--muted-fg)}
.filters .opts{margin-top:.75rem;display:grid;gap:.5rem}
input[type=range]{width:100%;accent-color:var(--primary)}
.empty{border:1px dashed var(--border);border-radius:.75rem;padding:3rem;text-align:center}

/* ---------- product detail ---------- */
.pdp{display:grid;gap:2rem;padding-bottom:2rem}
@media(min-width:1024px){.pdp{grid-template-columns:1.1fr 1fr 320px}}
.gallery{display:grid;grid-template-columns:64px 1fr;gap:.75rem}
.thumbs{display:flex;flex-direction:column;gap:.5rem}
.thumbs button{aspect-ratio:1;overflow:hidden;border:1px solid var(--border);border-radius:.375rem;background:var(--secondary);padding:0;cursor:pointer}
.thumbs button[aria-current=true]{border-color:var(--primary)}
.thumbs img{height:100%;width:100%;object-fit:cover}
.main-shot{overflow:hidden;border:1px solid var(--border);border-radius:.75rem;background:var(--secondary)}
.main-shot img{height:100%;width:100%;object-fit:cover}
.pdp-price{margin-top:1.25rem;border-block:1px solid var(--border);padding-block:1.25rem}
.pdp-price .big{font-size:1.875rem;font-weight:700;color:var(--price)}
.save{border-radius:.25rem;background:color-mix(in oklab,var(--price) 12%,transparent);color:var(--price);padding:.1rem .5rem;font-size:.75rem;font-weight:700}
.highlights{margin-top:.5rem;display:grid;gap:.375rem;font-size:.875rem}
.highlights li{display:flex;gap:.5rem}
.highlights svg{width:1rem;height:1rem;margin-top:.2rem;color:var(--primary)}
.about{margin-top:1.5rem;border-radius:.75rem;background:var(--secondary);padding:1rem;font-size:.875rem}
.about p{margin:.25rem 0 0;color:var(--muted-fg)}
.buybox{align-self:start;background:var(--card);border:1px solid var(--border);border-radius:.75rem;padding:1.25rem}
@media(min-width:1024px){.buybox{position:sticky;top:8rem}}
.instock{margin-top:.25rem;display:flex;align-items:center;gap:.25rem;font-size:.875rem;color:var(--primary)}
.qty{display:flex;align-items:center;border:1px solid var(--border);border-radius:var(--radius);width:8rem;margin-top:.25rem}
.qty button{flex:none;display:grid;place-items:center;height:2.5rem;width:2.5rem;border:0;background:transparent;cursor:pointer}
.qty button:hover{background:var(--secondary)}
.qty .val{flex:1;text-align:center;font-weight:600}
.guarantees{margin-top:1.25rem;display:grid;gap:.5rem;border-top:1px solid var(--border);padding-top:1rem;font-size:.75rem;color:var(--muted-fg)}
.guarantees div{display:flex;align-items:center;gap:.5rem}

/* ---------- cart / checkout ---------- */
.two-col{display:grid;gap:2rem;align-items:start}
@media(min-width:1024px){.two-col{grid-template-columns:1fr 360px}}
@media(min-width:1024px){.two-col-wide{grid-template-columns:1fr 380px}}
.summary{align-self:start;background:var(--card);border:1px solid var(--border);border-radius:.75rem;padding:1.5rem}
@media(min-width:1024px){.summary{position:sticky;top:8rem}}
.summary .line{display:flex;justify-content:space-between;font-size:.875rem}
.summary .total{margin-top:1rem;display:flex;justify-content:space-between;border-top:1px solid var(--border);padding-top:1rem;font-size:1.125rem;font-weight:700}
.cart-list{background:var(--card);border:1px solid var(--border);border-radius:.75rem}
.cart-row{display:grid;grid-template-columns:80px 1fr auto;gap:1rem;padding:1rem;border-bottom:1px solid var(--border)}
.cart-row:last-child{border-bottom:0}
@media(min-width:640px){.cart-row{grid-template-columns:100px 1fr auto auto;align-items:center}}
.cart-row .thumb{aspect-ratio:1;overflow:hidden;border-radius:.375rem;background:var(--secondary)}
.cart-row .thumb img{height:100%;width:100%;object-fit:cover}
.cart-row .name{font-weight:500}
.cart-row .name:hover{color:var(--primary)}
.remove{margin-top:.5rem;display:inline-flex;align-items:center;gap:.25rem;border:0;background:none;padding:0;font-size:.75rem;color:var(--muted-fg);cursor:pointer}
.remove:hover{color:var(--price)}
.line-total{grid-column:span 3;text-align:right;font-weight:700;color:var(--price)}
@media(min-width:640px){.line-total{grid-column:auto}}
.empty-cart svg{width:3rem;height:3rem;margin-inline:auto;color:var(--muted-fg)}
.empty-cart{margin-top:2rem;border:1px dashed var(--border);background:var(--card);border-radius:1rem;padding:4rem 1rem;text-align:center}
.co-section{background:var(--card);border:1px solid var(--border);border-radius:.75rem;padding:1.5rem}
.co-grid{margin-top:1rem;display:grid;gap:1rem}
@media(min-width:640px){.co-grid{grid-template-columns:1fr 1fr}}
.span2{grid-column:1/-1}
.pay-opt{display:flex;align-items:center;gap:.75rem;border:1px solid var(--border);border-radius:.5rem;padding:.75rem;cursor:pointer;font-size:.875rem;font-weight:500}
.pay-opt:hover{background:var(--secondary)}
.pay-opt input{accent-color:var(--primary)}
.mini-item{display:flex;gap:.75rem;font-size:.875rem}
.mini-item .thumb{position:relative;height:3.5rem;width:3.5rem;flex:none;overflow:hidden;border-radius:.375rem;background:var(--secondary)}
.mini-item .thumb img{height:100%;width:100%;object-fit:cover}
.mini-item .qtybub{position:absolute;right:-.25rem;top:-.25rem;display:grid;place-items:center;height:1.25rem;width:1.25rem;border-radius:999px;background:var(--primary);color:var(--primary-fg);font-size:.65rem;font-weight:700}

/* ---------- account ---------- */
.tiles{margin-top:2rem;display:grid;gap:1rem;grid-template-columns:1fr}
@media(min-width:640px){.tiles{grid-template-columns:repeat(2,1fr)}}
@media(min-width:1024px){.tiles{grid-template-columns:repeat(3,1fr)}}
.tile{display:flex;align-items:flex-start;gap:1rem;background:var(--card);border:1px solid var(--border);border-radius:.75rem;padding:1.25rem;transition:box-shadow .2s}
.tile:hover{box-shadow:var(--shadow-elevated)}
.tile .ic{display:grid;place-items:center;height:2.75rem;width:2.75rem;flex:none;border-radius:.5rem;background:color-mix(in oklab,var(--primary) 12%,transparent);color:var(--primary)}
.tile .t{font-weight:600}
.tile:hover .t{color:var(--primary)}
.tile .s{font-size:.875rem;color:var(--muted-fg)}
.order-row{display:grid;grid-template-columns:1fr 1fr;gap:1rem;border-bottom:1px solid var(--border);padding:1.25rem}
.order-row:last-child{border-bottom:0}
@media(min-width:640px){.order-row{grid-template-columns:repeat(5,1fr);align-items:center}}
.chip{border-radius:999px;background:color-mix(in oklab,var(--primary) 12%,transparent);color:var(--primary);padding:.25rem .75rem;font-size:.75rem;font-weight:600}

/* ---------- footer ---------- */
.site-footer{margin-top:6rem;background:var(--leaf-deep);color:var(--primary-fg)}
.site-footer .container-x.cols{display:grid;gap:2.5rem;padding-block:3.5rem}
@media(min-width:768px){.site-footer .container-x.cols{grid-template-columns:repeat(4,1fr)}}
.site-footer h4{font-size:.8rem;font-weight:600;text-transform:uppercase;letter-spacing:.1em;opacity:.7}
.site-footer ul{margin-top:1rem;display:grid;gap:.5rem;font-size:.875rem;opacity:.9}
.site-footer p{opacity:.8;font-size:.875rem}
.newsletter{margin-top:1rem;display:flex;overflow:hidden;border-radius:.375rem;background:oklch(1 0 0/.1);box-shadow:inset 0 0 0 1px oklch(1 0 0/.2)}
.newsletter input{flex:1;min-width:0;border:0;background:transparent;padding:.5rem .75rem;font-size:.875rem;color:inherit}
.newsletter input::placeholder{color:oklch(1 0 0/.5)}
.newsletter input:focus{outline:none}
.newsletter button{border:0;background:var(--accent);color:var(--accent-fg);padding-inline:1rem;font-size:.875rem;font-weight:600;cursor:pointer}
.footer-bottom{border-top:1px solid oklch(1 0 0/.1)}
.footer-bottom .container-x{display:flex;flex-direction:column;gap:.5rem;padding-block:1.25rem;font-size:.75rem;opacity:.7}
@media(min-width:640px){.footer-bottom .container-x{flex-direction:row;justify-content:space-between}}
.socials{margin-top:1.25rem;display:flex;gap:.75rem;opacity:.9}

/* ---------- toast ---------- */
#toasts{position:fixed;right:1rem;bottom:1rem;z-index:80;display:grid;gap:.5rem}
.toast{background:var(--card);border:1px solid var(--border);border-radius:.5rem;box-shadow:var(--shadow-elevated);padding:.75rem 1rem;font-size:.875rem;font-weight:500;animation:toast-in .2s ease-out}
@keyframes toast-in{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}

/* ---------- utilities ---------- */
.muted{color:var(--muted-fg)}
.small{font-size:.875rem}
.xs{font-size:.75rem}
.mt-1{margin-top:.25rem}.mt-2{margin-top:.5rem}.mt-3{margin-top:.75rem}.mt-4{margin-top:1rem}.mt-5{margin-top:1.25rem}.mt-6{margin-top:1.5rem}.mt-8{margin-top:2rem}.mt-10{margin-top:2.5rem}
.pt-6{padding-top:1.5rem}.pb-16{padding-bottom:4rem}.py-6{padding-block:1.5rem}.py-8{padding-block:2rem}
.h1{font-size:1.875rem}
.h2{font-size:1.5rem}
.bold{font-weight:700}
.text-right{text-align:right}
.text-center{text-align:center}
.strike{text-decoration:line-through}
.priced{color:var(--price)}
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}