/* Lightweight motion; content remains readable without JavaScript. */
html{scroll-padding-top:var(--header-offset,190px)}
.header{position:sticky;top:0;z-index:30;background:#fff;box-shadow:0 0 0 transparent;transition:box-shadow .22s ease;padding-top:env(safe-area-inset-top,0px);overflow:visible}
.header.is-scrolled{box-shadow:0 5px 24px #48215412;border-bottom-color:#e8ddec}
.header-row{height:auto;min-height:110px;padding-block:16px;overflow:visible}
.header.is-scrolled .header-row{height:auto;min-height:94px;padding-block:12px}
.header .brand{flex-shrink:0;overflow:visible}
.header .brand>span{display:block;padding-block:4px;overflow:visible}
.header .brand strong{line-height:1.6}
.header .brandmark{overflow:visible;flex-shrink:0}
.header-actions{flex-shrink:0;overflow:visible;align-self:center;padding-block:4px}
.header-actions .iconbtn{position:relative;overflow:visible}
.header-actions .count,.header-actions .favorites-count{top:0;right:0;min-width:20px;height:20px;line-height:18px;font-size:11px;border:1px solid #fff}
.header.is-scrolled .nav-inner{min-height:50px}
.nav-inner{transition:min-height .22s ease}
.card .product-image{transition:transform .3s ease}
.card:focus-within{border-color:#ba90ca;box-shadow:0 12px 28px #59336812}
.btn,.detail-btn,.chip,.iconbtn,.close{transition:background-color .18s ease,box-shadow .18s ease,transform .18s ease,filter .18s ease}
.btn:active:not(:disabled),.detail-btn:active,.chip:active:not(:disabled),.iconbtn:active{transform:scale(.97)}
.btn:disabled{cursor:not-allowed}
dialog[open]{animation:spenta-dialog-in .2s ease-out}
dialog[open]::backdrop{animation:spenta-backdrop-in .2s ease-out}
.favorite-toggle[aria-pressed=true]{animation:spenta-heart .24s ease-out}
@keyframes spenta-dialog-in{from{opacity:0;transform:translateY(12px) scale(.985)}to{opacity:1;transform:none}}
@keyframes spenta-backdrop-in{from{opacity:0}to{opacity:1}}
@keyframes spenta-heart{50%{transform:scale(1.12)}}
@media(hover:hover) and (pointer:fine){.card:hover .product-image{transform:scale(1.045)}.btn:hover:not(:disabled){box-shadow:0 8px 20px #69377922}.iconbtn:hover{background:#f8f0fb;border-radius:12px}}
@media(max-width:700px){
 .header-row,.header.is-scrolled .header-row{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center;min-height:0;height:auto;padding-block:14px;gap:12px 8px}
 .header-row>.brand{grid-column:1;grid-row:1;justify-self:start;min-width:0;gap:5px}
 .header .brand strong,.header.is-scrolled .brand strong{font-size:clamp(22px,7vw,28px);line-height:1.6;letter-spacing:-.8px}
 .header .brand small{font-size:10px;line-height:1.8;letter-spacing:1.8px}
 .header .brandmark,.header.is-scrolled .brandmark{width:34px;height:42px}
 .header-actions,.header.is-scrolled .header-actions{grid-column:2;grid-row:1;gap:4px;margin:0;padding-block:4px;justify-self:end}
 .header .iconbtn{min-width:36px;min-height:44px;padding:6px}
 .header .searchbox,.header.is-scrolled .searchbox{display:block;grid-column:1/-1;grid-row:2;width:100%;min-width:0;margin:0}
 .header.is-scrolled .nav{display:none}
 .card:hover{transform:none}
}
@media(prefers-reduced-motion:reduce){
 html{scroll-behavior:auto!important}
 .header,.header-row,.nav-inner,.card,.product-image,.btn,.detail-btn,.chip,.iconbtn,.close{transition:none!important}
 dialog[open],dialog[open]::backdrop,.favorite-toggle[aria-pressed=true]{animation:none!important}
 .card:hover,.card:hover .product-image,.btn:active,.detail-btn:active,.chip:active,.iconbtn:active{transform:none!important}
}
@media print{.header{position:static!important}dialog[open]{animation:none}}
