/* =========================================================
   Lekarna Dren – template.css
   Design: »dizajn 5« (home, category, product)
   ========================================================= */
:root{
	--orange:#fe7e00;
	--orange-h:#ef7400;
	--orange-ink:#a84e00;
	--peach:#fff1e3;
	--peach-2:#ffe4c8;
	--peach-line:#fbdcbc;
	--sand:#f6f1ec;
	--sand-2:#efe8e2;
	--line:#ece4dd;
	--ink:#28292a;
	--muted:#625d58;
	--white:#fff;
	--green:#2f7a34;
	--amber:#a35a00;
	--red:#b3261e;
	--radius:16px;
	--wrap:1240px;
	--head:Poppins,'Poppins Fallback',system-ui,sans-serif;
	--body:'Instrument Sans','Instrument Sans Fallback',system-ui,sans-serif;
	--header-h:124px; /* main.js keeps it at the header's visible height */
	--shadow-lg:0 24px 56px rgba(40,41,42,.18);
}
/* Metric-matched fallbacks: text set in Arial takes the same space as the web font, so the swap
   to Poppins / Instrument Sans does not shift the layout. */
@font-face{font-family:'Poppins Fallback';src:local('Arial'),local('ArialMT');size-adjust:114.78%;ascent-override:91.48%;descent-override:30.49%;line-gap-override:8.71%}
@font-face{font-family:'Instrument Sans Fallback';src:local('Arial'),local('ArialMT');size-adjust:102.17%;ascent-override:94.94%;descent-override:24.47%;line-gap-override:0%}

/* ---------- base ---------- */
*,*::before,*::after{box-sizing:border-box}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%;scroll-padding-top:var(--header-h)}
body{margin:0;background:var(--white);color:var(--ink);font-family:var(--body);font-size:1rem;line-height:1.5;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}
img,svg{max-width:100%;display:block}
img{height:auto}
a{color:inherit;text-decoration:none}
button,input,select,textarea{font:inherit;color:inherit}
button{cursor:pointer}
h1,h2,h3,h4{font-family:var(--head);font-weight:600;line-height:1.2;margin:0;letter-spacing:-.01em;text-wrap:balance}
p{text-wrap:pretty}
address{font-style:normal}
[hidden]{display:none!important}
.wrap{max-width:var(--wrap);margin:0 auto;padding:0 24px}
:focus-visible{outline:3px solid var(--orange-ink);outline-offset:2px;border-radius:6px}
.sr{position:absolute!important;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}
.skip{position:absolute;left:16px;top:-60px;z-index:100;background:var(--ink);color:#fff;padding:10px 16px;border-radius:10px;font-family:var(--head);font-weight:600;transition:top .15s}
.skip:focus{top:12px}
.center{text-align:center;margin:22px 0 0}

/* ---------- shared ---------- */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;height:48px;padding:0 26px;border-radius:999px;font-family:var(--head);font-weight:600;font-size:.9375rem;border:0;white-space:nowrap;transition:background .15s,box-shadow .15s;cursor:pointer;text-align:center}
.btn.primary{background:var(--orange);color:var(--ink)}
.btn.primary:hover{background:var(--orange-h)}
.btn.soft{background:#fff;color:var(--ink);box-shadow:inset 0 0 0 1.5px var(--peach-line)}
.btn.soft:hover{box-shadow:inset 0 0 0 1.5px var(--orange)}
.btn.big{height:52px;font-size:1rem;border-radius:14px}
.btn[aria-busy=true]{opacity:.7;pointer-events:none}
.eyebrow{font-family:var(--head);font-weight:600;font-size:.875rem;color:var(--orange-ink)}
.dots{position:absolute;pointer-events:none;opacity:.35}
.more{color:var(--orange-ink);font-family:var(--head);font-weight:600;font-size:.9375rem;white-space:nowrap}
.more:hover{text-decoration:underline}

/* ---------- header ---------- */
/* Scrolling moves the category row away with the page, 1:1 (phones: the logo row, search stays); scrolling up
   brings it back the same way, and a half-hidden row settles when scrolling stops. main.js sets --tuck-y (px
   moved out of view) and keeps --header-h at the visible height for sticky sidebars and anchors. Only transform
   and clip-path change, so the page below never jumps; the negative clip inset leaves room for the mega menu. */
header.site{position:sticky;top:0;z-index:40;background:#fff;clip-path:inset(0 0 -100vh 0)}
header.site::after{content:"";position:absolute;z-index:1;left:0;right:0;bottom:0;height:1px;background:var(--line);pointer-events:none}
.admin-bar header.site{top:32px}
.hdr{position:relative;display:flex;align-items:center;gap:32px;padding-top:16px;padding-bottom:16px}
.logo{flex:none;display:block;width:136px}
.logo img{width:100%;height:auto}
.burger{display:none;background:none;border:0;padding:8px;margin-left:-8px}
.hdr .search{position:absolute;left:0;right:0;top:50%;transform:translateY(-50%);margin:0 auto;width:min(480px,36vw);z-index:5}
.hdr .search form{display:flex;align-items:center;height:46px;border:1.5px solid #857d78;border-radius:999px;background:#fff;padding:2px 3px 2px 16px;box-shadow:0 2px 10px rgba(40,41,42,.05);transition:border-color .2s,box-shadow .2s}
.hdr .search form:focus-within{border-color:var(--orange-ink);box-shadow:0 0 0 3px rgba(254,126,0,.15),0 8px 22px rgba(40,41,42,.08)}
.hdr .search svg{flex:none;color:#494946}
.hdr .search input[type=search]{flex:1;border:0;outline:0;font-family:var(--head);font-size:.875rem;padding:0 10px;background:transparent;min-width:0;color:var(--ink);-webkit-appearance:none;appearance:none}
.hdr .search input[type=search]::-webkit-search-cancel-button{-webkit-appearance:none}
.hdr .search button[type=submit]{display:inline-flex;align-items:center;gap:6px;height:38px;padding:0 18px;border:0;border-radius:999px;background:var(--orange);font-family:var(--head);font-weight:600;font-size:.84375rem;box-shadow:0 2px 8px rgba(254,126,0,.3)}
.hdr .search button[type=submit]:hover{background:var(--orange-h)}
.suggest{position:absolute;z-index:5;left:0;right:0;top:54px;background:#fff;border:1px solid var(--line);border-radius:18px;box-shadow:var(--shadow-lg);padding:8px;max-height:min(70vh,520px);overflow:auto}
.suggest .hint{font-size:.75rem;font-family:var(--head);font-weight:600;letter-spacing:.06em;text-transform:uppercase;color:var(--muted);padding:8px 10px 4px}
.suggest [role=option]{display:flex;align-items:center;gap:12px;padding:8px 10px;border-radius:10px;cursor:pointer}
.suggest [role=option]:hover,.suggest [role=option][aria-selected=true]{background:var(--peach)}
.suggest img{width:40px;height:40px;object-fit:contain;flex:none}
.suggest small{display:block;color:var(--muted);font-size:.78125rem}
.suggest .p{margin-left:auto;font-family:var(--head);font-weight:600;font-size:.875rem;white-space:nowrap}
.suggest .all{justify-content:center;color:var(--orange-ink);font-family:var(--head);font-weight:600;font-size:.875rem;border-top:1px solid var(--line);margin-top:6px;border-radius:0 0 10px 10px}
.suggest .empty-s{padding:10px;font-size:.875rem;color:var(--muted)}
.hactions{display:flex;align-items:center;gap:6px;margin-left:auto}
.hlink{font-family:var(--head);font-weight:500;font-size:.90625rem;padding:8px 10px}
.hlink:hover{color:var(--orange-ink)}
.hbtn{display:flex;align-items:center;gap:8px;height:44px;padding:0 10px;border-radius:999px;background:none;border:0;font-family:var(--head);font-weight:500;font-size:.90625rem}
.hbtn:hover{color:var(--orange-ink)}
.cartbtn{position:relative;height:40px;background:var(--ink);color:#fff;padding:0 14px;margin-left:8px;box-shadow:0 6px 16px rgba(40,41,42,.16)}
.cartbtn svg{width:18px;height:18px}
.cartbtn:hover{color:#fff;background:#3a3b3c}
.cartbtn .count{position:absolute;top:-4px;right:-4px;background:var(--orange);color:var(--ink);border-radius:999px;min-width:20px;height:20px;display:grid;place-items:center;font-size:.75rem;font-weight:600;padding:0 6px;border:2px solid #fff;transition:transform .2s}
.cartbtn .count.bump{transform:scale(1.25)}

/* ---------- main navigation + mega menu ---------- */
nav.main{position:relative}
.nav-list{list-style:none;margin:0;padding:0;display:flex;flex-wrap:nowrap;gap:26px;justify-content:center;align-items:stretch}
@media (min-width:861px){
	/* Desktop search a touch slimmer (phones keep the 46 px tap target). */
	.hdr .search{width:min(460px,34vw)}
	.hdr .search form{height:42px}
	.hdr .search button[type=submit]{height:34px;padding:0 16px}
	.suggest{top:50px}
	/* The row slides up behind the (opaque) top row while the header's lower edge and line rise with it. */
	.hdr{z-index:2;background:#fff}
	nav.main{z-index:1;background:#fff;transform:translateY(calc(-1 * var(--tuck-y,0px)))}
	/* The line stays just below the top row (1 px left unclipped for it), so the row never hides it. */
	header.site.is-moved{clip-path:inset(0 0 calc(var(--tuck-y,0px) - 1px) 0)}
	header.site::after{transform:translateY(min(0px,calc(1px - var(--tuck-y,0px))))}
}
.nav-list>li{padding:0 0 14px;display:flex;align-items:center}
nav.main .top{display:block;white-space:nowrap;padding:2px 0;font-size:.875rem;font-family:var(--head);font-weight:500;transition:color .15s}
nav.main li.has.open .top,nav.main .top:hover{color:var(--orange-ink)}
nav.main .tg{display:grid;place-items:center;flex:none;width:24px;height:24px;margin:0 -7px 0 0;padding:0;background:none;border:0;border-radius:6px;color:var(--muted);cursor:pointer;transition:color .15s}
nav.main .tg svg{transition:transform .15s}
nav.main .tg:hover,nav.main li.has.open .tg{color:var(--orange-ink)}
nav.main li.has.open .tg svg{transform:rotate(180deg)}
.no-js nav.main .tg{display:none}
nav.main .sale .top{color:var(--orange-ink);font-weight:600}
.mega{display:none;position:absolute;left:0;right:0;top:100%;background:#fff;border-top:1px solid var(--line);border-radius:0 0 24px 24px;box-shadow:0 30px 60px rgba(40,41,42,.14);z-index:30}
nav.main li.has.open .mega{display:block}
.no-js nav.main li.has:hover .mega,.no-js nav.main li.has:focus-within .mega{display:block}
.mega>.wrap{padding-top:24px;padding-bottom:26px;display:grid;grid-template-columns:1fr 232px;gap:36px}
.mega>.wrap:not(:has(>.feat)){grid-template-columns:1fr}
.mega .mh{display:flex;justify-content:space-between;align-items:baseline;margin-bottom:18px;gap:16px}
.mega .mh-title{font-family:var(--head);font-weight:600;font-size:1.25rem;margin:0}
.mega .mh a{color:var(--orange-ink);font-family:var(--head);font-weight:500;font-size:.90625rem}
.mega .mh a:hover{text-decoration:underline}
.mega .cols{display:grid;grid-template-columns:repeat(4,1fr);gap:24px}
.mega .ch{font-family:var(--head);font-size:.9375rem;font-weight:600;padding-bottom:10px;border-bottom:1px solid var(--line);margin:0 0 10px}
.mega .ch a:hover{color:var(--orange-ink)}
.mega .cols ul{list-style:none;margin:0;padding:0;display:grid;gap:7px}
.mega .cols li a{font-size:.90625rem;color:var(--muted)}
.mega .cols li a:hover{color:var(--orange-ink);text-decoration:underline}
.feat{background:var(--peach);border-radius:16px;padding:14px;display:flex;flex-direction:column;align-self:start}
.feat .fl{font-family:var(--head);font-weight:600;font-size:.75rem;color:var(--orange-ink);margin-bottom:8px}
.feat .fi{background:#fff;border-radius:12px;height:120px;display:grid;place-items:center;margin-bottom:10px}
.feat .fi img{max-height:100px;max-width:70%;object-fit:contain}
.feat .fn{font-family:var(--head);font-weight:500;font-size:.875rem;line-height:1.3}
.feat .brand{font-size:.8125rem;color:var(--muted)}
.feat .fp{display:flex;align-items:center;justify-content:space-between;gap:8px;margin-top:10px}
.feat .fp b{font-family:var(--head);font-weight:600;font-size:1rem}
.feat .fp s{font-size:.78125rem;color:var(--muted);margin-left:4px}

/* ---------- hero ---------- */
.hero{position:relative;overflow:hidden;background:radial-gradient(ellipse 70% 90% at 68% 8%,#fffdfa 0%,#fff4e8 30%,#ffead4 55%,#ffe0c2 78%,#fdd5b0 100%)}
.hero .glow{position:absolute;left:50%;bottom:-180px;transform:translateX(-50%);width:1250px;height:520px;border-radius:50%;background:radial-gradient(ellipse,rgba(255,253,251,.95) 0%,rgba(255,253,251,.45) 45%,rgba(255,253,251,0) 72%);pointer-events:none}
.hero-pad{position:relative;padding-top:40px}
.hero-card{position:relative;background:#fff;border-radius:28px;box-shadow:0 30px 80px rgba(41,42,42,.12);overflow:hidden}
.hero-grid{display:grid;grid-template-columns:.82fr 1.4fr;height:420px}
.hero-copy{background:#fbf9f8;padding:32px 34px 26px 44px;display:flex;flex-direction:column;align-items:flex-start;justify-content:center;overflow:hidden;font-family:var(--head)}
.hero-copy .kick{margin:0 0 12px;font-size:.75rem;font-weight:600;letter-spacing:1.6px;text-transform:uppercase;color:#a85000}
.hero-copy h2{margin:0 0 12px;font-size:2.0625rem;line-height:1.12;font-weight:600;letter-spacing:-.7px;max-width:18ch}
.hero-copy p{margin:0 0 24px;font-size:.875rem;line-height:1.6;color:#5a5a58;max-width:44ch}
.hero-copy .cta{background:#292a2a;color:#efe7e4;border-radius:999px;padding:14px 30px;font-weight:600;font-size:.875rem;display:inline-block;box-shadow:0 10px 24px rgba(41,42,42,.16);transition:background .2s}
.hero-copy .cta:hover{background:#a85000;color:#fff}
.hero-img{position:relative;height:420px;background:#f7f3f1}
.hero-img img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.hero-ctrl{display:flex;align-items:center;justify-content:center;gap:15px;padding:20px 0 0}
.hero-ctrl .dot{border:0;padding:0;height:9px;width:9px;border-radius:999px;background:#cbbeb7;transition:width .25s,background .25s}
.hero-ctrl .dot[aria-pressed=true]{width:28px;background:var(--orange)}
.hero-pause{display:grid;place-items:center;width:28px;height:28px;border-radius:50%;border:0;background:rgba(255,255,255,.7);color:var(--ink);margin-right:4px}
.hero-pause .ico-play,.hero.is-paused .hero-pause .ico-pause{display:none}
.hero.is-paused .hero-pause .ico-play{display:block}
.white-start{height:40px;background:#fff;border-radius:36px 36px 0 0;margin-top:22px;position:relative}
@keyframes fade{from{opacity:0}to{opacity:1}}

/* ---------- category circles ---------- */
.cats{padding:4px 0 0}
.cats .wrap{position:relative}
/* The track reaches into the page gutter, so the circles' shadows are not cut off in a straight line at its
   edges, and the side where more categories follow fades out (main.js sets more-l / more-r). */
@property --fl{syntax:'<length>';inherits:false;initial-value:0px}
@property --fr{syntax:'<length>';inherits:false;initial-value:0px}
.cats .track{list-style:none;margin:0 -24px;padding:14px 24px 30px;scroll-padding:0 24px;display:flex;gap:36px;overflow-x:auto;scroll-behavior:smooth;scroll-snap-type:x proximity;scrollbar-width:none;--fade:88px;-webkit-mask-image:linear-gradient(90deg,transparent,#000 var(--fl),#000 calc(100% - var(--fr)),transparent);mask-image:linear-gradient(90deg,transparent,#000 var(--fl),#000 calc(100% - var(--fr)),transparent);transition:--fl .25s,--fr .25s}
.cats .track.more-l{--fl:var(--fade)}
.cats .track.more-r{--fr:var(--fade)}
.cats .track::-webkit-scrollbar{display:none}
.cats li{flex:0 0 150px;scroll-snap-align:start}
.cats a{position:relative;display:flex;flex-direction:column;align-items:center;gap:16px;text-align:center;font-family:var(--head);font-weight:600;font-size:.875rem;line-height:1.35;transition:transform .2s;hyphens:auto}
.cats a:hover{transform:translateY(-8px);color:var(--orange-ink)}
.cats .ic{display:block;width:150px;height:150px;border-radius:50%;padding:7px;background:#fff;box-shadow:0 10px 26px rgba(41,42,42,.09)}
.cats .ic img{width:100%;height:100%;border-radius:50%;background:#fff;object-fit:contain;padding:16%}
.cats .pct .ic{outline:2.5px solid var(--orange);outline-offset:-2.5px}
.cats .pct .pin{display:grid;place-items:center;width:100%;height:100%;border-radius:50%;background:var(--peach);color:var(--orange-ink);font-size:2.875rem;font-weight:600}
.cats .arr{position:absolute;top:66px;z-index:2;width:46px;height:46px;border-radius:50%;border:1px solid var(--line);background:#fff;box-shadow:0 8px 20px rgba(40,41,42,.12);display:grid;place-items:center;transition:opacity .2s,border-color .15s}
.cats .arr:hover{border-color:var(--orange)}
.cats .arr[disabled]{opacity:0;pointer-events:none}
.cats .arr.prev{left:4px}
.cats .arr.next{right:4px}
/* Touch screens swipe; the arrows would only cover the categories. */
@media (hover:none){.cats .arr{display:none}}

/* ---------- sections + product cards ---------- */
section.block{padding:40px 0 44px}
.shead{display:flex;align-items:flex-end;justify-content:space-between;gap:16px;margin-bottom:20px;flex-wrap:wrap}
.shead h2{font-size:1.75rem}
.shead p{margin:6px 0 0;color:var(--muted)}
.tabs{display:flex;gap:6px;background:var(--sand);padding:5px;border-radius:999px}
.tabs button{border:0;background:none;padding:8px 16px;border-radius:999px;font-family:var(--head);font-weight:500;font-size:.90625rem;white-space:nowrap}
.tabs button[aria-selected=true]{background:var(--orange)}
.grid{display:grid;grid-template-columns:repeat(4,1fr);gap:16px}
.card{position:relative;display:flex;flex-direction:column;border:1px solid var(--line);border-radius:var(--radius);padding:14px 16px 16px;background:#fff;transition:box-shadow .15s;min-width:0}
.card:hover{box-shadow:0 10px 28px rgba(40,41,42,.08)}
.card .img{aspect-ratio:4/3;display:grid;place-items:center;margin-bottom:12px}
.card .img img{max-height:100%;max-width:78%;width:auto;object-fit:contain}
.badge{position:absolute;top:14px;left:14px;z-index:1;font-family:var(--head);font-weight:600;font-size:.78125rem;padding:3px 9px;border-radius:999px}
.badge.sale{background:var(--orange)}
.badge.new{background:var(--peach);color:var(--orange-ink);box-shadow:inset 0 0 0 1px var(--peach-line)}
.brand{font-size:.8125rem;color:var(--muted)}
.name{font-family:var(--head);font-weight:500;font-size:.96875rem;line-height:1.3;margin:2px 0}
.name a:hover{color:var(--orange-ink)}
.pack{font-size:.84375rem;color:var(--muted)}
.pricerow{display:flex;align-items:baseline;gap:8px;margin-top:auto;padding-top:12px;flex-wrap:wrap}
.price{font-family:var(--head);font-weight:600;font-size:1.25rem}
.old{font-size:.875rem;color:var(--muted)}
.meta{display:flex;justify-content:space-between;gap:8px;font-size:.8125rem;color:var(--muted);margin:4px 0 12px}
.meta>span:only-child{margin-left:auto}
.stock{display:inline-flex;align-items:center;gap:6px;color:var(--green)}
.stock::before{content:"";width:8px;height:8px;border-radius:50%;background:currentColor;flex:none}
.stock.late{color:var(--amber)}
.stock.out{color:var(--muted)}
.add{height:44px;border-radius:999px;border:0;background:var(--peach);color:var(--ink);font-family:var(--head);font-weight:600;font-size:.9375rem;display:flex;align-items:center;justify-content:center;gap:8px;padding:0 16px;transition:background .15s;white-space:nowrap}
.add:hover,.add.done{background:var(--orange)}
.add.is-disabled,.add[disabled]{background:var(--sand);color:var(--muted);cursor:not-allowed}
.add[aria-busy=true]{opacity:.7}
.add.add-sm{height:36px;font-size:.84375rem;padding:0 14px;background:#fff}
.add.add-sm:hover{background:var(--orange)}

/* ---------- Kako vam lahko pomagamo ---------- */
.help{padding-top:8px}
.help .shead{margin-bottom:16px}
.help .need-row{display:flex;align-items:center;gap:6px;padding:6px;background:var(--sand);border-radius:999px;margin-bottom:22px}
.help .chips{display:flex;gap:4px;overflow-x:auto;scrollbar-width:none}
.help .chips::-webkit-scrollbar{display:none}
.help .chips button{flex:none;border:0;background:none;padding:10px 18px;border-radius:999px;font-family:var(--head);font-weight:500;font-size:.90625rem;white-space:nowrap}
.help .chips button:hover{background:#fff}
.help .chips button[aria-pressed=true]{background:var(--orange);color:var(--ink)}
.sym{position:relative;flex:1 1 240px;min-width:240px;margin-left:auto}
.sym>svg{position:absolute;left:16px;top:50%;transform:translateY(-50%);color:var(--muted);pointer-events:none}
.sym input{width:100%;height:44px;border-radius:999px;border:1px solid var(--line);background:#fff;padding:0 16px 0 42px;font-size:.9375rem;color:var(--ink);outline:0}
.sym input:focus{border-color:var(--orange-ink);box-shadow:0 0 0 1px var(--orange-ink)}
.sym .list{position:absolute;top:calc(100% + 8px);left:0;right:0;background:#fff;border:1px solid var(--line);border-radius:14px;box-shadow:0 20px 48px rgba(40,41,42,.14);padding:6px;z-index:10;max-height:290px;overflow:auto}
.sym .list [role=option]{width:100%;display:flex;justify-content:space-between;gap:12px;border-radius:10px;padding:10px 14px;font-family:var(--head);font-weight:500;font-size:.875rem;cursor:pointer}
.sym .list [role=option]:hover,.sym .list [role=option][aria-selected=true]{background:var(--peach)}
.sym .list span{font-family:var(--body);font-weight:400;font-size:.78125rem;color:var(--muted)}
.sym .list p{margin:0;padding:12px 14px;font-size:.84375rem;color:var(--muted)}
.panel{position:relative;overflow:hidden;background:var(--peach);border-radius:24px;padding:28px;scroll-margin-top:calc(var(--header-h) + 16px)}
.panel .dots{right:-30px;top:-30px;transform:rotate(180deg);opacity:.25}
.panel .ptop{position:relative;display:flex;align-items:center;justify-content:space-between;gap:20px;flex-wrap:wrap;margin-bottom:12px}
.panel .ptop p{margin:0;font-family:var(--head);font-weight:600;font-size:1.0625rem}
.panel .ptop p span{color:var(--orange-ink)}
.panel .ptop p a{text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:3px}
.panel .ptop p a:hover{text-decoration-thickness:2px}
.panel .ptop p small{color:var(--muted);font-weight:500;font-size:inherit}
.aud{display:flex;gap:4px;background:#fff;border-radius:999px;padding:4px}
.aud button{border:0;background:none;padding:6px 16px;border-radius:999px;font-family:var(--head);font-weight:500;font-size:.875rem}
.aud button[aria-pressed=true]{background:var(--orange)}
.advice{position:relative;margin:0 0 20px;font-size:.9375rem;color:var(--muted);max-width:80ch}
.advice b{color:var(--ink);font-family:var(--head);font-weight:600}
.need-grid{position:relative;display:grid;grid-template-columns:repeat(3,1fr);gap:14px}
.ncard{background:#fff;border-radius:16px;padding:12px 14px 14px;display:flex;flex-direction:column;transition:box-shadow .2s;min-width:0}
.ncard:hover{box-shadow:0 14px 32px rgba(168,78,0,.10)}
.ncard .ni{height:128px;display:grid;place-items:center;margin-bottom:10px}
.ncard .ni img{max-height:112px;max-width:70%;width:auto;object-fit:contain}
.ncard .cat{font-size:.6875rem;font-weight:600;font-family:var(--head);letter-spacing:.08em;text-transform:uppercase;color:var(--orange-ink)}
.ncard h3{font-size:.9375rem;font-weight:500;margin:4px 0}
.ncard h3 a:hover{color:var(--orange-ink)}
.ncard .why{font-size:.84375rem;color:var(--muted);margin:0 0 12px}
.ncard .nf{margin-top:auto;display:flex;align-items:center;justify-content:space-between;gap:10px}
.ncard .nprice{display:flex;align-items:baseline;gap:6px;flex-wrap:wrap}
.ncard .nprice .price{font-size:1.125rem}
.ncard .add{height:40px;font-size:.875rem}
.pnote{position:relative;display:flex;justify-content:space-between;align-items:center;gap:16px;flex-wrap:wrap;margin-top:18px;padding-top:16px;border-top:1px solid var(--peach-line);font-size:.90625rem;color:var(--muted)}
.pnote a.tel{color:var(--ink);font-family:var(--head);font-weight:600}

/* ---------- click & collect strip ---------- */
.cc-strip{background:var(--sand);border-top:1px solid var(--line);border-bottom:1px solid var(--line);margin-top:16px;margin-bottom:32px}
.cc-strip .wrap{display:flex;align-items:center;gap:18px;min-height:100px;padding-top:18px;padding-bottom:18px}
.cc-strip .ccl{flex:none}
.cc-strip .ccl .eyebrow{display:block;font-size:.78125rem}
.cc-strip .ccl h2{font-family:var(--head);font-weight:600;font-size:1rem;letter-spacing:0}
.cc-strip ol{list-style:none;margin:0 auto;padding:0;display:flex;align-items:center;gap:10px}
.cc-strip li{display:flex;align-items:center;gap:10px;font-size:.9375rem;color:var(--muted);white-space:nowrap}
.cc-strip li b{color:var(--ink);font-family:var(--head);font-weight:500}
.cc-strip li small{display:none;font-size:inherit}
.cc-strip li+li::before{content:"";width:14px;height:2px;background:var(--peach-line);border-radius:2px;margin-right:4px}
.cc-strip .ico{flex:none;width:42px;height:42px;border-radius:50%;background:#fff;border:2px solid var(--peach-line);display:grid;place-items:center;color:var(--orange)}
.cc-strip .btn{flex:none;height:44px;font-size:.90625rem;padding:0 20px}
@media (max-width:1180px) and (min-width:861px){.cc-strip .wrap{flex-wrap:wrap;justify-content:space-between}.cc-strip ol{order:3;flex-basis:100%;margin:0;justify-content:center}}

/* ---------- e-recept ---------- */
.rxsec{padding:28px 0 8px}
.rxbox{position:relative;overflow:hidden;display:grid;grid-template-columns:1fr auto;gap:28px;align-items:center;background:var(--peach);border-radius:22px;padding:28px 34px}
.rxbox .dots{right:-70px;bottom:-62px;opacity:.28}
.rxbox h2{font-size:1.5625rem;margin:6px 0 8px;position:relative}
.rxbox p{margin:0;color:var(--muted);font-size:1.0625rem;max-width:60ch;position:relative}
.rxbox .act{position:relative;display:flex;flex-direction:column;align-items:flex-end;gap:14px}
.lang{display:inline-flex;gap:4px;background:#fff;border-radius:999px;padding:4px;box-shadow:inset 0 0 0 1px var(--peach-line)}
.lang button{border:0;background:none;padding:6px 14px;border-radius:999px;font-family:var(--head);font-weight:600;font-size:.8125rem;color:var(--muted)}
.lang button:hover{color:var(--ink)}
.lang button[aria-pressed=true]{background:var(--orange);color:var(--ink)}

/* ---------- posts ---------- */
#nasveti{padding-top:28px}
.posts{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
.post .ph{aspect-ratio:16/9;border-radius:var(--radius);overflow:hidden;background:var(--sand)}
.post .ph img{width:100%;height:100%;object-fit:cover;transition:transform .3s}
.post:hover .ph img{transform:scale(1.03)}
.post .tag{font-family:var(--head);font-weight:600;font-size:.78125rem;color:var(--orange-ink);letter-spacing:.06em;text-transform:uppercase;margin:14px 0 4px}
.post h3,.post .post-title{font-size:1.125rem;font-weight:500;margin-top:10px}
.post .tag+h3{margin-top:0}
.post:hover h3,.post:hover .post-title{color:var(--orange-ink)}
.post .by{font-size:.84375rem;color:var(--muted);margin-top:4px}

/* ---------- lexicon ---------- */
.lexsec{padding:4px 0 44px}
.lexbar{display:flex;align-items:center;gap:16px;border:1px solid var(--line);border-radius:16px;padding:16px 22px;background:#fff;transition:border-color .15s,box-shadow .15s}
.lexbar:hover{border-color:var(--peach-line);box-shadow:0 8px 22px rgba(168,78,0,.08)}
.lexbar .tiles{display:flex;gap:6px;flex:none}
.lexbar .tiles span{display:grid;place-items:center;width:28px;height:28px;border-radius:7px;background:var(--peach);color:var(--orange-ink);font-family:var(--head);font-weight:600;font-size:.8125rem}
.lexbar b{display:block;font-family:var(--head);font-weight:600;font-size:1rem}
.lexbar small{display:block;font-size:.875rem;color:var(--muted)}
.lexbar .go{margin-left:auto;color:var(--orange-ink);font-family:var(--head);font-weight:600;font-size:.9375rem;white-space:nowrap}

/* ---------- footer ---------- */
.site-footer{background:#2b2c2d;color:#cfc9c3;font-size:.90625rem}
.site-footer a{color:#cfc9c3}
.news{position:relative;overflow:hidden;border-bottom:1px solid #3e3f40}
.news .dots{right:-60px;bottom:-56px;opacity:.3}
.news .wrap{position:relative;display:flex;align-items:center;justify-content:space-between;gap:20px;padding-top:28px;padding-bottom:28px;flex-wrap:wrap}
.news h2{font-size:1.25rem;color:#fff}
.news h2+span{color:#a9a39d;font-size:.90625rem}
.news form{display:flex;gap:8px;flex:1;max-width:460px}
.news input{flex:1;height:48px;border-radius:999px;border:1px solid #4a4b4c;background:#363738;color:#fff;padding:0 18px;min-width:0}
.news input::placeholder{color:#9a948e}
.fcols{display:grid;grid-template-columns:1.3fr 1fr 1fr 1fr;gap:28px;padding:40px 0}
.fcols .fh{font-size:.9375rem;font-weight:600;margin-bottom:12px;color:#fff}
.fcols ul{list-style:none;margin:0;padding:0;display:grid;gap:8px}
.fcols ul a:hover{color:#ffb066;text-decoration:underline}
.fcols .lexlink{color:#ffb066!important;font-family:var(--head);font-weight:500}
.flogo{display:block;width:130px;margin-bottom:14px}
.hours{display:grid;grid-template-columns:auto auto;justify-content:start;gap:4px 18px;margin:12px 0}
.hours dt{color:#a9a39d}
.hours dd{margin:0;color:#fff}
.fcontact address a{color:#ffb066;font-family:var(--head);font-weight:500}
.fbottom{border-top:1px solid #3e3f40}
.fbottom .wrap{display:flex;justify-content:space-between;align-items:center;gap:16px;padding-top:18px;padding-bottom:22px;flex-wrap:wrap;font-size:.8125rem;color:#a9a39d}
.fbottom .imprint{order:3;flex-basis:100%;margin:0;font-size:.75rem;line-height:1.6;color:#a9a39d}
.fbottom .imprint a{color:inherit;text-decoration:underline}
.eu{display:flex;align-items:center;gap:12px}
.eu img{height:44px;width:auto;background:#fff;border-radius:4px;padding:2px}
.pay{display:flex;gap:6px;flex-wrap:wrap;list-style:none;margin:0;padding:0}
.pay li{border:1px solid #4a4b4c;border-radius:6px;padding:3px 8px;font-size:.75rem}

/* ---------- toast ---------- */
.toast{position:fixed;left:50%;bottom:24px;width:max-content;transform:translate(-50%,140px);transition:transform .3s cubic-bezier(.2,.8,.2,1);z-index:60;max-width:calc(100vw - 32px)}
.toast.show{transform:translate(-50%,0)}

/* ---------- toast (design corrections) ---------- */
.ldr-toast{display:flex;align-items:center;gap:12px;max-width:calc(100vw - 32px);padding:8px 8px 8px 14px;background:#fff;border:1px solid var(--line);border-radius:12px;box-shadow:0 1px 2px rgba(40,41,42,.06),0 12px 32px rgba(40,41,42,.12);font-size:.90625rem;line-height:1.35;color:var(--ink)}
.toast-ico{flex:none;display:grid;place-items:center;width:22px;height:22px;border-radius:50%;color:#fff}
.toast-ok{background:var(--green)}
.toast-err{display:none;background:var(--red);font-weight:700;font-size:.8125rem;line-height:1}
.toast.is-error .toast-err{display:grid}
.toast.is-error .toast-ok{display:none}
.toast-text{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.toast-link{flex:none;display:inline-flex;align-items:center;gap:6px;height:34px;padding:0 14px;border:0;border-radius:8px;background:var(--sand);color:var(--ink);font-family:var(--head);font-weight:500;font-size:.84375rem;white-space:nowrap;cursor:pointer}
.toast-link:hover{background:#efe6dd}
@media (max-width:560px){.toast-text{white-space:normal;display:-webkit-box;-webkit-line-clamp:2;line-clamp:2;-webkit-box-orient:vertical}}

/* ---------- dialogs: drawers, modal, lightbox ---------- */
dialog{padding:0;border:0;color:var(--ink);max-width:none;max-height:none}
dialog::backdrop{background:rgba(40,41,42,.38)}
.sheet{position:fixed;top:0;bottom:0;margin:0;height:100dvh;width:min(92vw,420px);background:#fff;display:none;flex-direction:column;box-shadow:var(--shadow-lg)}
.sheet[open]{display:flex;animation:sheet-in .22s ease}
.sheet-left{left:0;right:auto;width:min(88vw,360px)}
.sheet-right{right:0;left:auto;--from:100%}
.sheet-left{--from:-100%}
@keyframes sheet-in{from{transform:translateX(var(--from))}to{transform:none}}
.sheet-head{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:16px 18px;border-bottom:1px solid var(--line)}
.sheet-head h2{font-size:1.1875rem}
.sheet-head .logo{width:118px}
.sheet-x{display:grid;place-items:center;width:40px;height:40px;border-radius:50%;border:0;background:var(--sand)}
.sheet-x:hover{background:var(--peach)}
.sheet-body{flex:1;overflow:auto;padding:16px 18px;overscroll-behavior:contain}
.drawer-nav details{border-bottom:1px solid var(--line)}
.drawer-nav summary{list-style:none;display:flex;justify-content:space-between;align-items:center;padding:14px 2px;font-family:var(--head);font-weight:500;cursor:pointer}
.drawer-nav summary::-webkit-details-marker{display:none}
.drawer-nav summary::after{content:"+";font-size:1.25rem;color:var(--orange-ink)}
.drawer-nav details[open] summary::after{content:"–"}
.drawer-nav .sub{padding:0 2px 14px}
.drawer-nav .sub a{display:block;padding:6px 0;color:var(--muted)}
.drawer-nav .sub a.all{color:var(--orange-ink);font-family:var(--head);font-weight:500}
.drawer-nav .sub a.col{font-family:var(--head);font-weight:600;font-size:.8125rem;color:var(--orange-ink);margin-top:8px}
.drawer-nav .plain-link,.drawer-nav .plain a{display:block;padding:14px 2px;border-bottom:1px solid var(--line);font-family:var(--head);font-weight:500}
.drawer-nav .plain-link.is-sale{color:var(--orange-ink)}
.drawer-nav .plain-list{list-style:none;margin:0;padding:0}
.lightbox{width:min(96vw,1000px);height:min(92dvh,1000px);border-radius:20px;background:#fff;padding:24px}
.lightbox[open]{display:grid;place-items:center}
.lightbox img{max-width:100%;max-height:100%;object-fit:contain}
.lightbox .sheet-x{position:absolute;top:12px;right:12px}

/* ---------- side cart (design corrections) ---------- */
.cart-sheet{width:min(92vw,420px)}
.cart-sheet .sheet-head{padding:18px 22px}
.mc-title{display:flex;align-items:baseline;gap:10px;min-width:0}
.cart-sheet .sheet-head h2{margin:0;font-family:var(--head);font-weight:500;font-size:1.1875rem;letter-spacing:-.2px}
.mc-n{font-size:.84375rem;color:var(--muted);white-space:nowrap}
.cart-sheet .sheet-x{flex:none}
.cart-sheet .sheet-x:hover{background:#efe6dd}
.mc-body{flex:1;min-height:0;display:flex;flex-direction:column}
.mc-scroll{flex:1;min-height:0;overflow:auto;overscroll-behavior:contain;padding:18px 22px 8px}
.cart-loading{margin:0;padding:18px 22px;color:var(--muted)}
.cart-empty{text-align:center;padding:40px 10px;color:var(--muted)}
.cart-empty svg{margin:0 auto 12px;color:var(--peach-line)}
.cart-empty b{color:var(--ink);font-family:var(--head);font-size:1.0625rem}
.cart-empty .btn{margin-top:10px}
.mc-ship{padding:0 0 18px;border-bottom:1px solid var(--line)}
.mc-ship p{margin:0 0 10px;font-size:.875rem;color:var(--ink)}
.mc-ship b{font-weight:600}
.mc-bar{display:block;height:4px;border-radius:2px;background:var(--line);overflow:hidden}
.mc-bar i{display:block;height:100%;border-radius:2px;background:var(--orange);transition:width .3s}
.cart-items{list-style:none;margin:0;padding:0}
.ci{display:grid;grid-template-columns:64px minmax(0,1fr);gap:14px;padding:18px 0;border-bottom:1px solid var(--line)}
.ci[aria-busy=true]{opacity:.5;pointer-events:none}
.ci-img img{display:block;width:64px;height:64px;object-fit:contain}
.ci-body{min-width:0}
.ci-top{display:flex;justify-content:space-between;gap:12px}
.ci-name{min-width:0;font-size:.9375rem;line-height:1.35;text-decoration:none;overflow-wrap:anywhere}
.ci-name:hover{text-decoration:underline}
.ci-price{flex:none;font-weight:500;font-size:.9375rem;font-variant-numeric:tabular-nums}
.ci-meta{margin:2px 0 0;font-size:.84375rem;color:var(--muted)}
.ci-tag{white-space:nowrap}
.ci-row{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-top:12px}
.ci-qty{display:inline-flex;align-items:center;height:34px;border:1px solid #ddd4cc;border-radius:9px;background:#fff}
.ci-qty button{width:32px;height:100%;border:0;background:none;padding:0;font-size:1rem;line-height:1;color:var(--ink);cursor:pointer}
.ci-qty button:hover:not([disabled]){color:var(--orange-ink)}
.ci-qty button[disabled]{opacity:.35;cursor:not-allowed}
.ci-qty output{min-width:22px;text-align:center;font-size:.875rem;font-variant-numeric:tabular-nums}
.ci-x{min-height:24px;border:0;background:none;padding:0;font:inherit;font-size:.84375rem;color:var(--muted);text-decoration:underline;text-underline-offset:3px;cursor:pointer}
.ci-x:hover{color:var(--ink)}
.mc-note{margin:18px 0 0;padding:14px 16px;border-radius:12px;background:var(--sand);font-size:.8125rem;line-height:1.5;color:var(--muted)}
.mc-note b{display:block;margin-bottom:2px;font-weight:600;color:var(--ink)}
.cart-foot{flex:none;display:grid;gap:12px;padding:16px 22px 20px;border-top:1px solid var(--line);background:#fff}
.cart-sum{display:flex;justify-content:space-between;align-items:baseline;gap:12px}
.cart-sum span{font-size:.875rem;color:var(--muted)}
.cart-sum b{font-family:var(--head);font-weight:500;font-size:1.25rem;letter-spacing:-.3px;font-variant-numeric:tabular-nums;white-space:nowrap}
.mc-go{display:flex;align-items:center;justify-content:center;gap:6px;height:50px;border-radius:10px;background:var(--orange);color:#1c1c1c;font-family:var(--head);font-weight:500;font-size:.96875rem;text-decoration:none;transition:background .15s}
.mc-go:hover{background:var(--orange-h)}
.cart-view{justify-self:center;font-size:.875rem;color:var(--ink);text-decoration:underline;text-underline-offset:3px}
.cart-view:hover{text-decoration-thickness:2px}
/* ---------- quantity stepper ---------- */
.qty{display:flex;align-items:center;border:1px solid var(--line);border-radius:14px;height:52px;background:#fff}
.qty button{width:44px;height:100%;border:0;background:none;font-size:1.25rem;line-height:1}
.qty button:hover:not([disabled]){color:var(--orange-ink)}
.qty button[disabled]{opacity:.35;cursor:not-allowed}
.qty input,.qty output{width:36px;text-align:center;border:0;font-family:var(--head);font-weight:600;font-size:1rem;outline:0;background:none;-moz-appearance:textfield;appearance:textfield}
.qty input:focus-visible{outline:3px solid var(--orange-ink);outline-offset:0;border-radius:6px}
.qty input::-webkit-inner-spin-button,.qty input::-webkit-outer-spin-button{-webkit-appearance:none;margin:0}

/* ---------- breadcrumbs, notices ---------- */
.crumbs{display:flex;flex-wrap:wrap;gap:8px;font-size:.84375rem;color:var(--muted);margin-bottom:20px}
.crumbs>span{display:contents}
.crumbs a{display:inline-flex;align-items:center;min-height:24px}
.crumbs a:hover{color:var(--orange-ink)}
.crumbs .breadcrumb_last,.crumbs>span>span:last-child{color:var(--ink)}
.wc-notices:empty{display:none}
.woocommerce-message,.woocommerce-error,.woocommerce-info,.woocommerce-notice{list-style:none;margin:0 0 18px;padding:14px 18px;border:1px solid #f3dcc4;border-radius:12px;background:#fdf8f3;font-size:.9375rem;line-height:1.5;display:flex;flex-wrap:wrap;align-items:center;gap:10px;outline:none}
.woocommerce-error{border-color:#efc9c4;background:#fdf6f5;color:#8c1d15}
.woocommerce-error a{color:inherit;text-decoration:underline}
.woocommerce-message:focus-visible,.woocommerce-info:focus-visible,.woocommerce-notice:focus-visible{box-shadow:0 0 0 3px rgba(254,126,0,.18)}
.woocommerce-error:focus-visible{box-shadow:0 0 0 3px rgba(179,38,30,.18)}
.woocommerce-message .button,.woocommerce-info .button{margin-left:auto;color:var(--orange-ink);font-family:var(--head);font-weight:600}

/* ---------- product page ---------- */
.pp{padding:22px 0 40px}
.top{display:grid;grid-template-columns:1fr 1fr;gap:56px;align-items:start}
.gallery{position:sticky;top:calc(var(--header-h) + 24px)}
.stage{position:relative;border:1px solid var(--line);border-radius:22px;aspect-ratio:1/1;background:#fff;overflow:hidden}
.stage-btn{display:grid;place-items:center;width:100%;height:100%;border:0;background:none;padding:0;cursor:zoom-in}
.stage img{max-width:74%;max-height:74%;width:auto;object-fit:contain}
.stage .tag{position:absolute;top:16px;left:16px;z-index:1;background:var(--peach);color:var(--orange-ink);font-family:var(--head);font-weight:600;font-size:.78125rem;padding:5px 11px;border-radius:8px}
.stage .sale{position:absolute;top:16px;right:16px;z-index:1;background:var(--orange);font-family:var(--head);font-weight:600;font-size:.8125rem;padding:5px 11px;border-radius:999px}
.thumbs{display:flex;gap:10px;margin-top:12px;flex-wrap:wrap}
.thumbs button{width:72px;height:72px;border-radius:12px;border:1.5px solid var(--line);background:#fff;display:grid;place-items:center;padding:6px}
.thumbs button img{max-width:100%;max-height:100%;object-fit:contain}
.thumbs button[aria-pressed=true]{border-color:var(--orange);box-shadow:0 0 0 2px var(--peach)}
.brand-l{font-family:var(--head);font-weight:500;font-size:.875rem;color:var(--muted)}
.brand-l:hover{color:var(--orange-ink)}
.buy h1{font-size:2.25rem;line-height:1.12;letter-spacing:-.02em;margin:6px 0 12px}
.facts{display:flex;flex-wrap:wrap;gap:6px 10px;align-items:center;font-size:.90625rem;color:var(--muted);margin:0 0 18px}
.facts b{color:var(--ink);font-weight:600}
.facts i{font-style:normal;color:#c9bdb3}
.facts a{display:inline-flex;align-items:center;gap:5px;color:var(--orange-ink);font-family:var(--head);font-weight:500}
.facts a:hover{text-decoration:underline}
.lead{color:var(--muted);font-size:.96875rem;margin:0 0 18px}
.lead p{margin:0 0 6px}
.packs-l{font-family:var(--head);font-weight:500;font-size:.875rem;margin:0 0 8px}
.packs{display:flex;gap:10px;margin-bottom:16px;flex-wrap:wrap}
.packs a{position:relative;text-align:left;border:1.5px solid var(--line);background:#fff;border-radius:14px;padding:12px 16px;min-width:150px}
.packs a:hover{border-color:var(--peach-line)}
.packs b{display:block;font-family:var(--head);font-weight:600;font-size:.9375rem}
.packs span{font-size:.8125rem;color:var(--muted)}
.packs em{position:absolute;top:-10px;right:10px;font-style:normal;background:var(--orange);font-family:var(--head);font-weight:600;font-size:.6875rem;padding:2px 8px;border-radius:999px}
.packs a[aria-current=page]{border-color:var(--orange);background:var(--peach)}
.box{border:1px solid var(--line);border-radius:20px;padding:20px 22px}
.prow1{display:flex;justify-content:space-between;align-items:flex-end;gap:12px;margin-bottom:14px}
.pr{display:flex;align-items:baseline;gap:10px}
.pr .price{font-size:2.125rem;color:var(--ink)}
.pr s{color:var(--muted);font-size:1rem}
.unit{font-size:.8125rem;color:var(--muted)}
.omnibus{margin:-6px 0 14px;font-size:.78125rem;color:var(--muted)}
.prow2{display:flex;gap:12px;flex-wrap:wrap}
.prow2 .btn.big{flex:1;min-width:200px}
.limit{margin:8px 0 0;font-size:.8125rem;color:var(--muted)}
.unavailable{margin:0;padding:12px 14px;border-radius:12px;background:var(--sand);color:var(--muted);font-size:.90625rem}
.ship{list-style:none;margin:16px 0 0;padding:14px 0 0;border-top:1px solid var(--line);display:grid;gap:14px}
.ship li{display:flex;gap:12px;align-items:flex-start}
.ship .si{flex:none;width:36px;height:36px;border-radius:10px;background:var(--peach);color:var(--orange-ink);display:grid;place-items:center}
.ship b{display:block;font-family:var(--head);font-weight:500;font-size:.9375rem}
.ship small{font-size:.8125rem;color:var(--muted)}
.ship em{margin-left:auto;font-style:normal;font-family:var(--head);font-weight:600;font-size:.90625rem;white-space:nowrap}
.ship em.free{color:var(--green)}
.box .hint{margin:12px 0 0;font-size:.78125rem;color:var(--muted)}
.trust{list-style:none;margin:16px 0;padding:0;display:grid;grid-template-columns:repeat(3,1fr);gap:10px;font-size:.84375rem;color:var(--muted)}
.trust li{display:flex;gap:8px;align-items:flex-start}
.trust li::before{content:"✓";color:var(--orange);font-weight:700}
.advice-box{display:flex;gap:14px;background:var(--peach);border-radius:18px;padding:18px 20px}
.advice-box .ai{flex:none;width:36px;height:36px;border-radius:50%;background:#fff;color:var(--orange-ink);display:grid;place-items:center}
.advice-box b{font-family:var(--head);font-weight:600}
.advice-box p{margin:4px 0 6px;font-size:.90625rem;color:var(--muted)}
.advice-box a{color:var(--orange-ink);font-family:var(--head);font-weight:600;font-size:.90625rem}
.warn{font-size:.78125rem;color:var(--muted);margin:14px 0 0}
.details{display:grid;grid-template-columns:1fr 1fr;gap:56px;margin-top:56px;align-items:start}
.acc details{border-top:1px solid var(--line)}
.acc details:last-of-type{border-bottom:1px solid var(--line)}
.acc summary{list-style:none;cursor:pointer;display:flex;justify-content:space-between;align-items:center;gap:12px;padding:18px 0}
.acc summary h2{font-family:var(--head);font-weight:600;font-size:1.0625rem;letter-spacing:0}
.acc summary::-webkit-details-marker{display:none}
.acc summary::after{content:"";flex:none;width:9px;height:9px;border-right:2px solid var(--ink);border-bottom:2px solid var(--ink);transform:rotate(45deg) translate(-3px,-3px);transition:transform .15s}
.acc details[open] summary::after{transform:rotate(-135deg)}
.acc summary:hover h2{color:var(--orange-ink)}
.acc details>div{padding:0 0 18px;color:var(--muted);font-size:.96875rem;line-height:1.6}
.acc details>div p{margin:0 0 10px}
.acc details>div p:last-child{margin-bottom:0}
.acc details>div ul,.acc details>div ol{margin:0 0 10px;padding-left:20px}
.acc details>div strong{color:var(--ink)}
/* content tables (dosing, composition): accordion, category guide, posts */
.acc details>div table,.gtext table,.kdesc table,.prose table{width:100%;border-collapse:separate;border-spacing:0;margin:12px 0 24px;font-size:.9375rem;line-height:1.5;border:1px solid var(--line);border-radius:14px;overflow:hidden}
.acc details>div caption,.gtext caption,.kdesc caption,.prose caption{caption-side:top;text-align:left;padding:0 0 10px;font-family:var(--head);font-weight:500;font-size:.9375rem;color:var(--ink)}
.acc details>div th,.gtext th,.kdesc th,.prose th{background:none;color:var(--muted);font-family:var(--body);font-weight:400;font-size:.8125rem;text-align:left;vertical-align:bottom;padding:12px 20px;border-bottom:1px solid var(--line)}
.acc details>div td,.gtext td,.kdesc td,.prose td{padding:14px 20px;border-bottom:1px solid var(--line);vertical-align:top;color:var(--muted)}
.acc details>div tbody tr:last-child>*,.gtext tbody tr:last-child>*,.kdesc tbody tr:last-child>*,.prose tbody tr:last-child>*{border-bottom:0}
.acc details>div td+td,.gtext td+td,.kdesc td+td,.prose td+td,.acc details>div th+th,.gtext th+th,.kdesc th+th,.prose th+th,.prose tbody th+td{border-left:1px solid var(--line)}
.acc details>div td:first-child,.gtext td:first-child,.kdesc td:first-child,.prose td:first-child,.acc details>div tbody th,.gtext tbody th,.kdesc tbody th,.prose tbody th{color:var(--ink);font-weight:500;width:36%}
.acc details>div tbody th,.gtext tbody th,.kdesc tbody th,.prose tbody th{font-size:.9375rem;vertical-align:top;border-bottom:1px solid var(--line);padding:14px 20px}
.prose .wp-block-table{margin:0 0 16px}
.prose .wp-block-table table{margin:0}
@media (max-width:560px){
	.acc details>div table,.gtext table,.kdesc table,.prose table{display:block;overflow-x:auto;font-size:.90625rem}
	.acc details>div th,.acc details>div td,.gtext th,.kdesc th,.gtext td,.kdesc td,.prose th,.prose td{padding-top:12px;padding-bottom:12px;min-width:140px}
	.acc details>div thead th,.gtext thead th,.kdesc thead th,.prose thead th{padding-top:10px;padding-bottom:10px}
}
.src{font-size:.8125rem;color:var(--muted);margin:14px 0 0}
.tiles{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin:0}
.tile{background:var(--sand);border-radius:16px;padding:14px 16px}
.tile dt{font-size:.8125rem;color:var(--muted)}
.tile dd{margin:0}
.tile b{display:block;font-family:var(--head);font-weight:600;font-size:1rem;margin:2px 0}
.tile span{font-size:.8125rem;color:var(--muted)}
.tile.warn-t{background:#fff4e0}
.tile.warn-t dt{color:var(--amber);font-weight:600}
.fbt{border:1px solid var(--line);border-radius:18px;padding:16px 18px;margin-top:12px}
.fbt h2{font-size:1rem;margin-bottom:6px}
.fr{display:flex;align-items:center;gap:12px;padding:8px 0}
.fr img{width:46px;height:46px;object-fit:contain;border:1px solid var(--line);border-radius:10px;padding:4px;flex:none}
.fr b{display:block;font-family:var(--head);font-weight:500;font-size:.90625rem}
.fr a:hover b{color:var(--orange-ink)}
.fr small{font-size:.8125rem;color:var(--muted)}
.fr .fp{margin-left:auto;font-family:var(--head);font-weight:600;white-space:nowrap}
.plus{flex:none;width:38px;height:38px;border-radius:50%;border:1.5px solid var(--orange);background:#fff;color:var(--orange-ink);font-size:1.25rem;line-height:1;display:grid;place-items:center}
.plus:hover,.plus.done{background:var(--orange);color:var(--ink)}
.mc-add{margin:16px 0 0}
.mc-add h3{font-family:var(--head);font-weight:600;font-size:.9375rem;margin:0 0 4px}
.mc-add .fr b{font-size:.84375rem;line-height:1.35}
/* product FAQ: same accordion as the sections above, help card in the side column */
.pfaq-h{font-size:1.5rem;margin:0 0 14px;line-height:1.25}
.pfaq-h span{display:block;margin-top:4px;font-family:var(--body);font-weight:400;font-size:.9375rem;color:var(--muted)}
.acc summary h3{font-family:var(--head);font-weight:600;font-size:1.03125rem;letter-spacing:0;margin:0;line-height:1.4}
.acc summary:hover h3{color:var(--orange-ink)}
.pfaq .acc details>div{max-width:68ch}
.pfaq .side{position:sticky;top:calc(var(--header-h) + 16px)}
.pfaq-ask .btn{display:inline-flex;align-items:center;gap:8px}
.similar{margin-top:64px}
.grid.g5{grid-template-columns:repeat(5,1fr);gap:14px}
.stickybar{position:fixed;left:0;right:0;bottom:0;z-index:50;display:none;align-items:center;gap:10px;background:#fff;border-top:1px solid var(--line);box-shadow:0 -8px 24px rgba(40,41,42,.08);padding:10px 16px calc(10px + env(safe-area-inset-bottom));transform:translateY(110%);transition:transform .25s}
.stickybar.show{transform:none}
.stickybar img{width:40px;height:40px;object-fit:contain;flex:none}
.stickybar div{min-width:0}
.stickybar b{display:block;font-family:var(--head);font-weight:600;font-size:.875rem;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.stickybar span{font-size:.8125rem;color:var(--muted)}
.stickybar .btn{margin-left:auto;height:44px;padding:0 18px;flex:none}

/* ---------- category page ---------- */
.kp{padding:22px 0 40px}
.kp .crumbs{margin-bottom:18px}
.khead{display:grid;grid-template-columns:1fr 340px;gap:48px;align-items:start}
.ktitle h1{display:inline;font:inherit;letter-spacing:inherit}
.khead .kcount{font-family:var(--body);font-weight:400;font-size:1.0625rem;color:var(--muted);letter-spacing:0;margin-left:6px}
.kdesc{margin:12px 0 0;font-size:1.03125rem;color:var(--muted);max-width:62ch}
.kdesc p{margin:0 0 8px}
.askbox{background:var(--peach);border-radius:20px;padding:20px 22px;position:relative;overflow:hidden}
.askbox b{font-family:var(--head);font-weight:600;font-size:1.0625rem;display:flex;align-items:center;gap:8px}
.askbox b span{display:grid;place-items:center;width:24px;height:24px;border-radius:50%;background:var(--orange);font-size:1.0625rem;line-height:1}
.askbox p{margin:8px 0 14px;font-size:.90625rem;color:var(--muted)}
.askbox .btn{height:42px;font-size:.875rem;padding:0 18px}
/* No category description: the help box becomes a one-line bar beside the title (phones use .askline). */
@media (min-width:861px){
	.khead.slim{grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:32px}
	.khead.slim .askbox{display:flex;align-items:center;gap:14px;padding:7px 7px 7px 16px;border-radius:999px}
	.khead.slim .askbox b{font-size:.9375rem;white-space:nowrap}
	.khead.slim .askbox p{margin:0;font-size:.875rem;white-space:nowrap}
	.khead.slim .askbox .btn{height:38px;padding:0 16px}
}
@media (max-width:1100px) and (min-width:861px){.khead.slim .askbox p{display:none}}
.subcats{display:flex;gap:8px;margin:26px 0 18px;overflow-x:auto;scrollbar-width:none;padding:2px}
.subcats::-webkit-scrollbar{display:none}
.subcats a{flex:none;border:1.5px solid var(--line);background:#fff;border-radius:999px;padding:8px 18px;font-family:var(--head);font-weight:500;font-size:.90625rem;white-space:nowrap;transition:border-color .15s,background .15s}
.subcats a:hover{border-color:var(--orange)}
.subcats a[aria-current=page]{background:var(--peach);border-color:var(--orange);color:var(--orange-ink)}
.klay{display:grid;grid-template-columns:250px 1fr;gap:36px;margin-top:22px;align-items:start}
.klay.bare{grid-template-columns:minmax(0,1fr)}
/* Filter column: no scroll box of its own (it trapped the wheel and hid the last filters). It stays under the
   header, and when taller than the screen it scrolls along with the page until its end is in view, then the
   other way when scrolling up (main.js moves its sticky top). The bottom padding keeps the last filter clear
   of the accessibility button in the corner. */
.filters{position:sticky;top:calc(var(--header-h) + 24px);padding:0 14px 64px 0}
/* Search in a long facet: a quiet pill with a magnifier, × to clear, matches in bold, a line when nothing fits. */
.fsearch-wrap{position:relative;margin:0 0 4px}
.filters .fsearch{width:100%;height:38px;margin:0;padding:0 34px;border:1px solid var(--line);border-radius:999px;font:inherit;font-size:.875rem;color:var(--ink);background:#faf8f7 url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23857d78' stroke-width='2.2' stroke-linecap='round'%3E%3Ccircle cx='11' cy='11' r='7'/%3E%3Cpath d='M16.5 16.5 21 21'/%3E%3C/svg%3E") no-repeat 13px 50%/15px;transition:border-color .15s,background-color .15s,box-shadow .15s;-webkit-appearance:none;appearance:none}
.filters .fsearch::placeholder{color:#8a817b}
.filters .fsearch::-webkit-search-cancel-button{-webkit-appearance:none;appearance:none}
.filters .fsearch:hover{border-color:#d9d0ca}
.filters .fsearch:focus{background-color:#fff;border-color:var(--orange-ink);outline:0;box-shadow:0 0 0 3px rgba(254,126,0,.15)}
.fsearch-x{position:absolute;right:6px;top:50%;transform:translateY(-50%);display:grid;place-items:center;width:26px;height:26px;padding:0;border:0;border-radius:50%;background:none;color:var(--muted)}
.fsearch-x:hover{background:var(--sand);color:var(--ink)}
.fsearch:placeholder-shown~.fsearch-x{display:none}
.filters label mark{background:none;color:inherit;font-weight:700}
.fsearch-none{margin:2px 0 0;font-size:.8125rem;color:var(--muted)}
.fsearch-none:empty{display:none}
.filters label[hidden]{display:none!important}
.fhead{display:flex;justify-content:space-between;align-items:center;gap:12px;padding-bottom:10px;border-bottom:1px solid var(--line)}
.fhead .reset{margin:0 0 0 auto;font-size:.8125rem}
.fhead h2{font-size:1.125rem}
/* Desktop: the line under »Filtri« sits level with the line under the toolbar: same border-box height
   (42 px controls + 14 px padding + 1 px line = 57 px). */
@media (min-width:861px){.fhead{min-height:57px;padding-bottom:14px}}
.fclose,.fapply{display:none}
.filters details{border-bottom:1px solid var(--line)}
.filters summary{list-style:none;cursor:pointer;display:flex;justify-content:space-between;align-items:center;padding:14px 0;font-family:var(--head);font-weight:600;font-size:.9375rem}
.filters summary::-webkit-details-marker{display:none}
.filters summary::after{content:"";width:8px;height:8px;border-right:2px solid var(--ink);border-bottom:2px solid var(--ink);transform:rotate(45deg) translate(-2px,-2px);transition:transform .15s}
.filters details[open]>summary::after{transform:rotate(-135deg)}
.filters fieldset{border:0;margin:0;padding:0;min-width:0}
.filters .opts{padding:0 0 14px;display:grid;gap:9px}
.filters label{display:flex;align-items:center;gap:10px;min-height:24px;font-size:.9375rem;cursor:pointer}
.filters label input{width:18px;height:18px;accent-color:var(--orange);margin:0;flex:none}
.filters label small{margin-left:auto;color:var(--muted);font-size:.8125rem}
.filters label.dim{opacity:.4;cursor:default}
.filters .more-opts{border:0}
.filters .more-opts>summary{padding:4px 0;font-family:var(--head);font-weight:500;font-size:.875rem;color:var(--orange-ink);justify-content:flex-start}
.filters .more-opts>summary::after{display:none}
.filters .more-opts[open]>summary{display:none}
.filters .more-opts[open]{display:grid;gap:9px}
.price-in{display:flex;align-items:center;gap:8px}
.price-in input{width:80px;height:40px;border:1px solid var(--line);border-radius:10px;padding:0 10px}
.reset{display:inline-block;color:var(--orange-ink);font-family:var(--head);font-weight:600;font-size:.875rem}
.reset:hover,.chips-on .clear a:hover{text-decoration:underline}
.tool{display:flex;align-items:center;gap:18px;padding-bottom:14px;border-bottom:1px solid var(--line);flex-wrap:wrap}
.fbtn{display:none;align-items:center;gap:8px;height:42px;padding:0 16px;border-radius:999px;border:1.5px solid var(--line);background:#fff;font-family:var(--head);font-weight:600;font-size:.875rem}
.fcnt:not(:empty){background:var(--orange);border-radius:999px;min-width:20px;height:20px;display:inline-grid;place-items:center;font-size:.75rem;padding:0 6px}
.tool .count{font-size:.9375rem;color:var(--muted)}
.tool .count b{color:var(--ink)}
.stocksw{position:relative;display:inline-flex;align-items:center;gap:10px;font-size:.90625rem;font-family:var(--head);font-weight:500;cursor:pointer;margin-left:auto}
.stocksw input{position:absolute;opacity:0;width:1px;height:1px}
.stocksw .sw{position:relative;width:40px;height:24px;border-radius:999px;background:#d8d0c9;transition:background .15s;flex:none}
.stocksw .sw::after{content:"";position:absolute;top:3px;left:3px;width:18px;height:18px;border-radius:50%;background:#fff;box-shadow:0 1px 3px rgba(0,0,0,.2);transition:left .15s}
.stocksw input:checked+.sw{background:var(--orange)}
.stocksw input:checked+.sw::after{left:19px}
.stocksw input:focus-visible+.sw{outline:3px solid var(--orange-ink);outline-offset:2px}
.sort{display:inline-flex;align-items:center;gap:8px;font-size:.875rem;color:var(--muted)}
.sort select{height:42px;border:1px solid var(--line);border-radius:12px;padding:0 12px;font-family:var(--head);font-weight:500;font-size:.875rem;color:var(--ink);background:#fff}
.chips-on{display:flex;flex-wrap:wrap;gap:8px;margin:12px 0 0;padding:0;list-style:none}
.chips-on a{display:inline-block;background:var(--peach);color:var(--orange-ink);border-radius:999px;padding:5px 12px;font-family:var(--head);font-weight:500;font-size:.8125rem}
.chips-on a::after{content:" ✕";font-size:.6875rem}
.chips-on a:hover{background:var(--peach-2)}
.chips-on .clear a{background:none;padding:5px 4px;font-weight:600}
.chips-on .clear a::after{content:none}
.chips-on .clear a:hover{background:none}
.results{min-width:0}
.results .grid{margin-top:18px}
.results[aria-busy=true] .grid{opacity:.45;transition:opacity .15s}
.grid.g4{grid-template-columns:repeat(4,1fr);gap:14px}
.prev-wrap{margin:18px 0 0;text-align:center}
.empty{padding:40px;text-align:center;color:var(--muted);background:var(--sand);border-radius:16px;margin-top:18px}
.empty p{margin:0 0 8px}
.empty a{color:var(--orange-ink);font-family:var(--head);font-weight:600}
.more-wrap{display:flex;flex-direction:column;align-items:center;gap:10px;margin:28px 0 0;font-size:.84375rem;color:var(--muted)}
.more-wrap .bar{width:180px;height:3px;background:var(--line);border-radius:3px;overflow:hidden}
.more-wrap .bar i{display:block;height:100%;background:var(--orange);transition:width .3s}
.askline{display:none}
.results .warn{margin:22px 0 0}
.guide{display:grid;grid-template-columns:1fr 1fr;gap:56px;margin-top:64px;padding-top:40px;border-top:1px solid var(--line)}
.gtext h2{font-size:1.625rem;margin-bottom:12px}
.gtext p{margin:0 0 12px;font-size:1rem;color:var(--muted);line-height:1.6}
.gtext small{color:var(--muted);font-size:.8125rem}
.faq-h{font-family:var(--head);font-size:.8125rem;letter-spacing:.08em;text-transform:uppercase;color:var(--muted);margin-bottom:6px}
.faq details{border-bottom:1px solid var(--line)}
.faq summary{list-style:none;cursor:pointer;display:flex;justify-content:space-between;gap:12px;padding:16px 0;font-family:var(--head);font-weight:600;font-size:1rem}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:"";flex:none;width:8px;height:8px;margin-top:6px;border-right:2px solid var(--ink);border-bottom:2px solid var(--ink);transform:rotate(45deg);transition:transform .15s}
.faq details[open] summary::after{transform:rotate(-135deg)}
.faq summary:hover{color:var(--orange-ink)}
.faq p{margin:0 0 16px;color:var(--muted);font-size:.9375rem}
.recent{margin-top:40px}
.recent h2{font-family:var(--head);font-size:.8125rem;letter-spacing:.08em;text-transform:uppercase;color:var(--muted);margin-bottom:12px}
.rh{display:flex;justify-content:space-between;align-items:baseline}
.rh button{border:0;background:none;color:var(--orange-ink);font-family:var(--head);font-weight:600;font-size:.875rem}
.rec{display:grid;grid-template-columns:repeat(4,1fr);gap:12px}
.rec a{display:flex;gap:12px;align-items:center;border:1px solid var(--line);border-radius:14px;padding:10px 12px;min-width:0}
.rec a:hover{border-color:var(--peach-line)}
.rec img{width:52px;height:52px;object-fit:contain;flex:none}
.rec span{min-width:0}
.rec b{display:block;font-family:var(--head);font-weight:500;font-size:.875rem;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.rec small{display:block;font-size:.78125rem;color:var(--muted)}
.rec em{font-style:normal;font-family:var(--head);font-weight:600;font-size:.875rem}
.fbg{display:none}

/* ---------- pages, posts, 404 ---------- */
.page-main{padding:22px 0 56px}
.page-head{margin-bottom:28px}

/* ---------- page title (design corrections): one H1 style for every subpage, as on the legal pages ---------- */
.page-head h1,.page-title{font-family:var(--head);font-weight:600;font-size:2.375rem;line-height:1.15;letter-spacing:-.02em;margin:0;text-wrap:balance}
.page-head h1,.prose-wrap>.page-title{margin-bottom:12px}
.prose-wrap{max-width:760px;margin:0 auto}
.prose-wrap .by{color:var(--muted);font-size:.875rem;margin:0 0 18px}
.post-hero{border-radius:20px;overflow:hidden;margin-bottom:24px}
.prose{font-size:1.0625rem;line-height:1.7}
.prose h2{font-size:1.625rem;margin:36px 0 12px}
.prose h3{font-size:1.25rem;margin:28px 0 10px}
.prose p,.prose ul,.prose ol{margin:0 0 16px}
.prose a{color:var(--orange-ink);text-decoration:underline;text-underline-offset:2px}
.prose img{border-radius:14px}
.prose blockquote{margin:24px 0;padding:16px 20px;background:var(--peach);border-radius:14px}
.prose .wp-block-button__link{display:inline-flex;align-items:center;height:48px;padding:0 26px;border-radius:999px;background:var(--orange);color:var(--ink);font-family:var(--head);font-weight:600;text-decoration:none}
.nav-links{display:flex;gap:8px;justify-content:center;margin-top:32px}
.nav-links .page-numbers{display:grid;place-items:center;min-width:40px;height:40px;border-radius:999px;border:1px solid var(--line);font-family:var(--head);font-weight:500;padding:0 12px}
.nav-links .current{background:var(--orange);border-color:var(--orange)}
.nf404{text-align:center;padding:60px 24px;max-width:640px}
.nf404 h1{margin:8px 0 12px}
.nf404 p{color:var(--muted)}
.nf-actions{display:flex;gap:10px;justify-content:center;flex-wrap:wrap;margin-top:22px}

/* ---------- cart + checkout ---------- */
/* steps (design corrections): finished = green check, current = orange (cart: dark), order received = all green */
.steps{margin:0 0 36px}
.steps ol{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;align-items:center;gap:14px;font-family:var(--body);font-weight:400;font-size:.875rem;color:var(--muted)}
.steps li{display:flex;align-items:center;gap:10px}
.steps li+li::before{content:"";flex:none;width:48px;height:1px;margin-right:4px;background:#e2d9d0}
.steps a{display:flex;align-items:center;gap:10px;color:inherit}
.steps a:hover{color:var(--ink)}
.steps .n{display:grid;place-items:center;flex:none;width:24px;height:24px;border-radius:50%;border:1px solid #d9cfc5;font-size:.78125rem;font-weight:600;line-height:1;color:var(--muted)}
.steps .done .n{border-color:transparent;background:#e8f3e9;color:var(--green)}
.steps .now{color:var(--ink)}
.steps .now .n{border-color:transparent;background:var(--orange);color:#1c1c1c}
.flow-1 .steps .now .n{background:var(--ink);color:#fff}
.flow-3 .steps{margin-bottom:44px}
.flow-3 .steps li+li::before{background:#bcdcbf}
.flow-3 .steps .now .n{background:var(--green);color:#fff}
/* cart (design corrections) */
.coupon{margin:0 0 18px;padding:14px 0;border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
.coupon summary{cursor:pointer;font-size:.90625rem;color:var(--ink);list-style-position:inside}
/* postcode → town (shared helper in main.js: checkout and account address forms) */
.has-pc-msg{position:relative}
.pc-msg{display:block;margin:6px 0 0;font-size:.8125rem;line-height:1.4;color:var(--red)}
.pc-msg.is-side{position:absolute;left:calc(100% + 16px);bottom:0;display:flex;align-items:center;width:max-content;max-width:260px;min-height:46px;margin:0;font-size:.84375rem;line-height:1.35}
/* checkout */
.checkout-inline-error-message{display:flex;gap:6px;align-items:flex-start;margin:6px 0 0;font-size:.84375rem;color:var(--red);font-weight:500}
.checkout-inline-error-message::before{content:"!";flex:none;display:grid;place-items:center;width:18px;height:18px;border-radius:50%;background:var(--red);color:#fff;font-size:.75rem;font-weight:700;margin-top:1px}
.woocommerce-form-login-toggle .woocommerce-info{margin-bottom:16px}
.woocommerce-form-login-toggle a{color:var(--orange-ink);font-family:var(--head);font-weight:600;text-decoration:underline}
.blockUI.blockOverlay{border-radius:14px}
/* checkout (design corrections): open numbered sections, cards for delivery and payment, inline errors */
.co-errs{margin:0 0 8px;padding:18px 20px;border:1px solid #efc9c4;border-radius:12px;background:#fdf6f5;outline:none}
.co-errs:focus-visible{box-shadow:0 0 0 3px rgba(179,38,30,.18)}
.co-errs-t{display:flex;align-items:center;gap:10px;margin:0 0 10px;font-family:var(--head);font-weight:500;font-size:1rem;color:#8c1d15}
.co-errs-t::before{content:"";flex:none;width:18px;height:18px;background:currentColor;-webkit-mask:var(--ico-alert) center/contain no-repeat;mask:var(--ico-alert) center/contain no-repeat}
.co-errs ul{display:flex;flex-wrap:wrap;gap:6px 8px;list-style:none;margin:0;padding:0 0 0 28px}
.co-errs a{display:inline-flex;align-items:center;min-height:30px;padding:0 12px;border:1px solid #efc9c4;border-radius:15px;background:#fff;font-size:.84375rem;color:#8c1d15;text-decoration:none}
.co-errs a:hover{border-color:var(--red)}
/* WooCommerce's own invalid marks give way to main.js (.is-invalid with the designer's message) */
.woocommerce-terms-and-conditions{max-height:220px;overflow:auto;border:1px solid var(--line);border-radius:12px;padding:12px 14px;margin:0 0 12px;font-size:.84375rem}
.woocommerce-privacy-policy-text p{margin:16px 0 0;font-size:.8125rem;line-height:1.5;color:var(--muted)}
.woocommerce-privacy-policy-text a,.ldr-consent a{color:var(--ink);text-decoration:underline;text-underline-offset:3px}
#place_order{display:flex;width:100%;height:54px;border:0;border-radius:10px;background:var(--orange);color:#1c1c1c;font-family:var(--head);font-weight:500;font-size:1rem}
#place_order:hover{background:var(--orange-h)}
#place_order:focus-visible{outline:3px solid var(--ink);outline-offset:2px}
/* order received (design corrections) */
@media (max-width:860px){
	.steps{margin-bottom:24px}
	.flow-3 .steps{margin-bottom:28px}
	.steps ol{gap:8px;font-size:.8125rem}
	.steps li{gap:8px}
	.steps li+li::before{width:20px;margin-right:0}
	.steps li:not(.now) .lbl{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
}

/* ---------- account ---------- */
.ao-notes h2,.od h2{font-size:1.125rem;margin-bottom:10px}
.od{border:1px solid var(--line);border-radius:20px;padding:20px 22px;margin:20px 0 0;background:#fff}
.account .woocommerce-privacy-policy-text p{font-size:.84375rem;color:var(--muted);margin:0 0 12px}
.account .woocommerce-privacy-policy-text a{color:var(--orange-ink);text-decoration:underline}
.pw-wrap{position:relative;display:block}
.pw-toggle{position:absolute;right:4px;top:4px;width:40px;height:40px;display:grid;place-items:center;border:0;border-radius:10px;background:none;color:var(--muted)}
.pw-toggle:hover{background:var(--sand)}
.pw-toggle[aria-pressed=true]{color:var(--orange-ink)}
.woocommerce-password-strength{margin-top:6px;font-size:.8125rem;padding:6px 10px;border-radius:8px;background:var(--sand)}
.woocommerce-password-strength.short,.woocommerce-password-strength.bad{background:#fbe7e5;color:var(--red)}
.woocommerce-password-strength.good{background:#fff4e0;color:var(--amber)}
.woocommerce-password-strength.strong{background:#e4f3e5;color:var(--green)}
.woocommerce-password-hint{display:block;margin-top:4px;font-size:.8125rem;color:var(--muted)}
@media (max-width:860px){
	.acc-card,.od{padding:16px;border-radius:16px}
}

/* ---------- product search results ---------- */
.search-help{margin:20px 0 0}
.search-note{margin:0 0 12px;padding:10px 14px;border-radius:12px;background:#fff4e0;border-left:4px solid var(--amber);font-size:.90625rem}
.search-hints{display:flex;flex-wrap:wrap;align-items:center;gap:8px}
.sh-label{font-family:var(--head);font-weight:600;font-size:.875rem;color:var(--muted);margin-right:4px}
.search-hints a{display:inline-flex;align-items:baseline;gap:6px;border:1.5px solid var(--line);background:#fff;border-radius:999px;padding:7px 14px;font-family:var(--head);font-weight:500;font-size:.875rem;transition:border-color .15s}
.search-hints a:hover{border-color:var(--orange)}
.search-hints small{font-family:var(--body);font-weight:400;font-size:.78125rem;color:var(--muted)}
.empty-search{text-align:left;padding:28px}
.empty-search .es-title{font-family:var(--head);font-weight:600;font-size:1.125rem;color:var(--ink);margin:0 0 10px}
.es-tips{margin:0 0 16px;padding-left:20px;display:grid;gap:4px;font-size:.9375rem}
.empty-search .subcats{flex-wrap:wrap;overflow:visible;margin:0 0 16px}
.empty-search .btn{color:var(--ink)}

/* ---------- responsive ---------- */
/* The category row stays one line: tighter from 1200 px, below 1080 px it moves into the drawer (burger). */
@media (max-width:1199px) and (min-width:1080px){
	.nav-list{gap:14px}
	nav.main .top{font-size:.8125rem}
}
@media (max-width:1079px) and (min-width:861px){
	nav.main{display:none}
	.burger{display:block}
	.hlink{display:none}
	.hactions .lbl{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
}
@media (max-width:1100px){
	.mega>.wrap{grid-template-columns:1fr}
	.feat{display:none}
	.grid{grid-template-columns:repeat(3,1fr)}
	.grid.g5{grid-template-columns:repeat(3,1fr)}
	.grid.g4{grid-template-columns:repeat(3,1fr)}
	.top,.details{gap:32px}
	.khead{grid-template-columns:1fr 300px;gap:28px}
	.rec{grid-template-columns:repeat(2,1fr)}
}
@media (max-width:860px){
	:root{--header-h:122px}
	header.site.is-moved{transform:translateY(calc(-1 * var(--tuck-y,0px)))}
	.wrap{padding:0 16px}
	.admin-bar header.site{top:0}
	.hdr{flex-wrap:wrap;gap:12px 10px;padding-top:12px;padding-bottom:12px}
	.burger{display:block}
	.logo{width:118px}
	.hlink{display:none}
	.hactions .lbl{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
	.hdr .search{order:3;position:static;transform:none;width:100%;flex:1 1 100%}
	.suggest{left:16px;right:16px;top:auto;margin-top:8px}
	nav.main{display:none}

	.hero-pad{padding-top:18px}
	.hero-card{border-radius:22px}
	.hero-grid{grid-template-columns:1fr;grid-template-rows:200px 1fr;height:auto}
	.hero-img{height:200px;order:-1}
	.hero-copy{padding:24px 22px 22px;justify-content:flex-start}
	.hero-copy h2{font-size:1.5rem;letter-spacing:-.5px}
	.hero-ctrl{padding-top:14px}
	.white-start{margin-top:12px;height:28px}

	.cats .track{gap:18px;margin:0 -16px;padding:10px 16px 20px;scroll-padding:0 16px;--fade:48px}
	.cats li{flex:0 0 96px}
	.cats .ic{width:82px;height:82px;padding:5px;box-shadow:0 6px 16px rgba(41,42,42,.08)}
	.cats a{font-size:.75rem;gap:10px}
	.cats .pct .pin{font-size:1.625rem}
	.cats .arr{top:28px;width:36px;height:36px}

	.cc-strip .wrap{flex-direction:column;align-items:stretch;gap:12px;padding-top:18px;padding-bottom:18px}
	.cc-strip li{white-space:normal}
	.cc-strip ol{flex-direction:column;align-items:flex-start;gap:10px;margin:0}
	.cc-strip ol li+li::before{display:none}
	.cc-strip .btn{width:100%}

	.rxbox{grid-template-columns:1fr;padding:24px 20px;gap:18px}
	.rxbox .act{align-items:stretch}
	.rxbox .lang{align-self:flex-start}
	.rxbox .btn{width:100%}
	.rxbox .dots{display:none}

	section.block{padding:30px 0}
	.shead h2{font-size:1.4375rem}
	.tabs{overflow-x:auto;max-width:100%}
	.grid,.grid.g4,.grid.g5{grid-template-columns:repeat(2,1fr);gap:10px}
	.card{padding:10px 12px 12px}
	.badge{top:10px;left:10px}
	.name{font-size:.90625rem}
	.price{font-size:1.125rem}
	.meta{flex-direction:column;gap:2px}
	.add{height:42px;font-size:.875rem;padding:0 10px}

	.help .need-row{flex-direction:column;align-items:stretch;background:none;padding:0;gap:10px}
	.help .chips{background:var(--sand);border-radius:999px;padding:5px}
	.sym{min-width:0;flex:none;margin:0}
	.panel{padding:18px 16px;border-radius:20px}
	.need-grid{grid-template-columns:repeat(3,78%);overflow-x:auto;scroll-snap-type:x mandatory;padding-bottom:6px}
	.ncard{scroll-snap-align:start}

	.posts{grid-template-columns:1fr;gap:22px}
	.lexbar{flex-wrap:wrap;padding:14px 16px}
	.lexbar .go{margin-left:0;width:100%}
	.fcols{grid-template-columns:1fr 1fr;gap:24px}
	.fcols .fc1{grid-column:1/-1}

	.toast{bottom:16px}

	.pp{padding-bottom:90px}
	.top,.details{grid-template-columns:minmax(0,1fr);gap:22px}
	.details{margin-top:32px}
	.pfaq .side{position:static}
	.gallery{position:static}
	.stage{aspect-ratio:4/3}
	.thumbs button{width:62px;height:62px}
	.buy h1{font-size:1.625rem}
	.pr .price{font-size:1.875rem}
	.box{padding:16px}
	.trust{grid-template-columns:1fr}
	.similar{margin-top:40px}
	.pfaq{margin-top:36px}
	.pfaq>h2{font-size:1.25rem}
	.stickybar{display:flex}
	.is-product .toast{bottom:84px}
	.crumbs{font-size:.78125rem;gap:6px}
	/* Phones: only the way back up (»← Gripa«), as one comfortable target instead of three lines of small links. */
	.crumbs>span>*{display:none}
	.crumbs>span>:nth-last-child(3):has(a){display:inline-flex}
	.crumbs>span>:nth-last-child(3) a{min-height:32px;font-size:.84375rem;color:var(--ink)}
	.crumbs>span>:nth-last-child(3) a::before{content:"←";margin-right:6px;color:var(--orange-ink)}

	.khead{grid-template-columns:minmax(0,1fr)}
	.kdesc{font-size:.96875rem}
	.askbox{display:none}
	.askline{display:flex;align-items:center;gap:10px;margin-top:22px;background:var(--peach);border-radius:14px;padding:12px 14px;font-size:.875rem;color:var(--muted)}
	.askline>span:first-child{flex:none;display:grid;place-items:center;width:24px;height:24px;border-radius:50%;background:var(--orange);color:var(--ink);font-weight:600}
	.askline b{color:var(--ink);font-family:var(--head);font-weight:600}
	.subcats{margin-top:18px}
	.klay{grid-template-columns:minmax(0,1fr);margin-top:14px}
	.filters{position:fixed;inset:0 0 0 auto;width:min(90vw,360px);overflow:auto;overscroll-behavior:contain;top:0;z-index:80;background:#fff;padding:16px 18px 90px;transform:translateX(105%);transition:transform .25s;box-shadow:-10px 0 30px rgba(0,0,0,.15);visibility:hidden}
	.filters.open{transform:none;visibility:visible}
	.filters .fhead{position:sticky;top:0;z-index:1;background:var(--white)}
	.fclose{display:grid;place-items:center;border:0;background:var(--sand);width:36px;height:36px;border-radius:50%}
	.fapply{display:flex;position:sticky;bottom:-74px;width:100%;margin-top:16px}
	.fbg.open{display:block!important;position:fixed;inset:0;background:rgba(40,41,42,.35);z-index:79}
	.tool{gap:10px}
	.fbtn{display:inline-flex}
	.tool .count{order:5;flex-basis:100%;font-size:.875rem}
	.stocksw{order:4;margin-left:0;flex-basis:100%;font-size:.875rem}
	.sort{margin-left:auto}
	.sort span{display:none}
	.guide{grid-template-columns:minmax(0,1fr);gap:28px;margin-top:40px;padding-top:28px}
	.gtext h2{font-size:1.375rem}
	.rec{grid-template-columns:1fr}
	.page-head h1,.page-title{font-size:1.875rem}
}

/* ---------- chips (shared) ---------- */
.chips{display:flex;flex-wrap:wrap;gap:8px}
.chips a,.chips button{display:inline-flex;align-items:center;border:1.5px solid var(--line);background:#fff;border-radius:999px;padding:7px 16px;font-family:var(--head);font-weight:500;font-size:.875rem;line-height:1.3;transition:border-color .15s,background .15s}
.chips a:hover,.chips button:hover{border-color:var(--orange)}
.chips [aria-current],.chips [aria-pressed=true]{background:var(--peach);border-color:var(--orange);color:var(--orange-ink)}

/* ---------- articles: index ---------- */
.post .tag+.post-title{margin-top:0}
.post-feat{margin-bottom:40px;padding-bottom:40px;border-bottom:1px solid var(--line)}
.post-feat .post-link{display:grid;grid-template-columns:minmax(0,1.2fr) minmax(0,1fr);gap:40px;align-items:center}
.post-feat .ph{aspect-ratio:3/2;border-radius:22px}
.post-feat .post-title{font-size:2rem;font-weight:600;line-height:1.2;margin-top:0}
.post-feat .post-ex{color:var(--muted);font-size:1.0625rem;line-height:1.55;margin:12px 0 14px}

/* ---------- articles: single ---------- */
.prose aside.tip{position:relative;margin:26px 0;padding:22px 22px 18px;border-radius:14px;background:var(--sand);border:1px solid var(--line)}
.prose aside.tip::before{content:"";position:absolute;top:-1px;left:22px;width:36px;height:4px;border-radius:0 0 4px 4px;background:var(--orange)}
.prose aside.tip p{margin:0}

/* ---------- article: product card in the text (design corrections) ---------- */
.art-inprod-empty{padding:14px 16px;border:1px dashed var(--line);border-radius:14px;color:var(--muted);font-size:.875rem}

/* ---------- e-recept ---------- */
.lang a{padding:6px 14px;border-radius:999px;font-family:var(--head);font-weight:600;font-size:.8125rem;color:var(--muted)}
.lang a:hover{color:var(--ink)}
.lang a[aria-current]{background:var(--orange);color:var(--ink)}
.rx-place .btn,.askbox .btn{display:inline-flex;align-items:center;gap:8px}
[data-rx-only][hidden]{display:none}

/* ---------- lexicon ---------- */
[data-lex-item][hidden],[data-lex-group][hidden]{display:none}
@media (max-width:860px){
	.post-feat .post-link{grid-template-columns:minmax(0,1fr);gap:16px}
	.post-feat .post-title{font-size:1.5rem}
	.post-feat{margin-bottom:28px;padding-bottom:28px}
}

/* ---------- contact ---------- */
.ct-pharm[hidden],[data-ct-order-only][hidden],[data-ct-health-only][hidden]{display:none}
@media print{
	.art-side,.toc-m,.legal-help,.linkbtn,.crumbs{display:none!important}
}
/* hero: larger tap area for the dots, same look */
.hero-ctrl .dot{position:relative}
.hero-ctrl .dot::after{content:"";position:absolute;inset:-8px -7.5px}
/* hero carousel: a snap track that follows finger, trackpad and mouse; on phones the next campaign peeks in */
.hero-stage{position:relative}
.hero-track{display:flex;overflow-x:auto;overflow-y:hidden;overscroll-behavior-x:contain;scroll-snap-type:x mandatory;scrollbar-width:none}
.hero-track::-webkit-scrollbar{display:none}
.hero-track>.hero-grid{flex:0 0 100%;min-width:0;scroll-snap-align:start;scroll-snap-stop:always}
.hero-arr{position:absolute;top:50%;z-index:2;width:48px;height:48px;margin-top:-24px;border:1px solid var(--line);border-radius:50%;background:#fff;box-shadow:0 8px 22px rgba(41,42,42,.14);color:var(--ink);display:grid;place-items:center;opacity:0;transform:scale(.88);transition:opacity .2s,transform .2s,border-color .15s,color .15s}
.hero-arr.prev{left:-24px}
.hero-arr.next{right:-24px}
.hero-stage:hover .hero-arr,.hero-arr:focus-visible{opacity:1;transform:none}
.hero-arr:hover{border-color:var(--orange);color:var(--orange-ink)}
.hero-arr:active{transform:scale(.94)}
/* active dot fills up until the next campaign; full when rotation is off */
.hero-ctrl .dot[aria-pressed=true]{background:#f3cba6}
.dot-fill{position:absolute;inset:0;border-radius:inherit;background:var(--orange);opacity:0;transform-origin:left center}
.dot[aria-pressed=true] .dot-fill{opacity:1}
.hero.is-auto .dot[aria-pressed=true] .dot-fill{animation:hero-fill var(--hero-int,7s) linear both}
.hero.is-hold .dot-fill{animation-play-state:paused}
@keyframes hero-fill{from{transform:scaleX(0)}}
/* mouse drag on snap tracks (main.js dragScroll) */
.snap-off{scroll-snap-type:none!important;scroll-behavior:auto!important}
.is-dragging{cursor:grabbing;-webkit-user-select:none;user-select:none}
.is-dragging a{cursor:grabbing}
@media (hover:none){.hero-arr{display:none}}
@media (max-width:860px){
	.hero-arr{display:none}
	.hero-track{gap:10px;margin:-10px -16px -34px;padding:10px 16px 34px;scroll-padding-inline:16px;background:none;border-radius:0;box-shadow:none}
	.hero-track>.hero-grid{flex-basis:calc(100% - 14px);background:#fff;border-radius:22px;overflow:hidden;box-shadow:0 14px 34px rgba(41,42,42,.12)}
	.hero-one .hero-track>.hero-grid{flex-basis:100%}
}
/* hero: one large campaign + two tiles */
.hf{display:grid;grid-template-columns:minmax(0,1.9fr) minmax(0,1fr);gap:20px;align-items:stretch}
.hf.hf-solo{grid-template-columns:minmax(0,1fr)}
.hf-main .hero-grid{grid-template-columns:1fr 1.12fr;height:440px}
.hf-solo .hero-grid{grid-template-columns:.82fr 1.4fr}
.hf-main .hero-img{height:440px}
.hf-main .hero-copy{padding:32px 28px 26px 40px}
.hf-main .hero-copy h2{font-size:1.9375rem}
.hf-tiles{list-style:none;margin:0;padding:0;display:grid;grid-auto-rows:minmax(0,1fr);gap:20px}
.hf-tiles li{display:flex;min-height:0}
.hf-tile{flex:1;display:grid;grid-template-columns:minmax(0,1.08fr) minmax(0,.92fr);background:#fff;border-radius:24px;overflow:hidden;box-shadow:0 18px 50px rgba(41,42,42,.10);color:inherit;transition:transform .2s ease,box-shadow .2s ease}
.hf-tile:hover{transform:translateY(-3px);box-shadow:0 26px 60px rgba(41,42,42,.16)}
.hf-tile:focus-visible{outline:3px solid var(--orange-ink);outline-offset:3px}
.hf-copy{background:#fbf9f8;padding:20px 16px 18px 24px;display:flex;flex-direction:column;align-items:flex-start;justify-content:center;font-family:var(--head);min-width:0}
.hf-copy .kick{font-size:.6875rem;font-weight:600;letter-spacing:1.4px;text-transform:uppercase;color:#a85000;margin-bottom:8px}
.hf-t{margin:0 0 14px;font-size:1.125rem;line-height:1.25;font-weight:600;letter-spacing:-.3px;text-wrap:balance}
.hf-tile:hover .hf-t{color:var(--orange-ink)}
.hf-cta{display:inline;font-size:.875rem;font-weight:600;line-height:1.35;color:#a85000}
.hf-cta .ar{display:inline-block;margin-left:2px;transition:transform .2s ease}
.hf-tile:hover .hf-cta .ar{transform:translateX(4px)}
.hf-img{position:relative;background:#fdd5b0;overflow:hidden}
.hf-img img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;transition:transform .5s ease}
.hf-tile:hover .hf-img img{transform:scale(1.04)}
.hf-ico{position:absolute;inset:0;display:grid;place-items:center;color:#a85000;background:radial-gradient(circle at 50% 45%,#fff1e3 0,#ffe4c8 55%,#fdd5b0 100%)}
.hf-ico svg{width:46px;height:46px}
@media (max-width:1100px) and (min-width:861px){
	.hf{grid-template-columns:minmax(0,1fr)}
	.hf-tiles{grid-template-columns:1fr 1fr;grid-auto-rows:190px}
	.hf-main .hero-grid,.hf-main .hero-img{height:400px}
}
@media (max-width:860px){
	.hf{grid-template-columns:minmax(0,1fr);gap:12px}
	.hf-main .hero-grid{height:auto;grid-template-columns:1fr}
	.hf-main .hero-img{height:200px}
	.hf-main .hero-copy{padding:24px 22px 22px}
	.hf-main .hero-copy h2{font-size:1.5rem}
	.hf-tiles{grid-template-columns:1fr 1fr;grid-auto-rows:auto;gap:12px}
	.hf-tile{grid-template-columns:1fr;grid-template-rows:96px auto;border-radius:18px}
	.hf-img{order:-1}
	.hf-copy{padding:12px 14px 14px;justify-content:flex-start}
	.hf-copy .kick{font-size:.625rem;letter-spacing:1px;margin-bottom:4px}
	.hf-t{font-size:.9375rem;margin-bottom:8px}
	.hf-cta{font-size:.8125rem}
	.hf-ico svg{width:34px;height:34px}
}
@media (prefers-reduced-motion:reduce){
	*,*::before,*::after{transition:none!important;animation:none!important;scroll-behavior:auto!important}
}
@media print{
	header.site,.site-footer,.stickybar,.toast,.hero-ctrl,.filters,.tool{display:none!important}
}
/* kontakt v4 form */
/* e-recept: segmented recipe type */
/* ZZZS number: 3x3 digit slots inside a normal field */

/* ---------- e-recept / kontakt (design corrections) ---------- */
/* kontakt: phone → e-mail → location */
/* kontakt: form + hours + map */
/* moj racun v2 */
/* moj racun prijavljen v2 */
/* moj racun: address form */

/* ---------- account (design corrections) ---------- */
/* login: card + dark »Brez registracije« panel */
/* logged in: layout, headings, panels, buttons */
/* status with a dot */
/* dashboard */
/* orders */
/* order details (also on the order received page) */
/* addresses */
/* forms: address, delivery address, account details */
/* postcode → town (main.js »postcode autofill«; account forms and checkout) */
.form-row:has(>.pc-msg.is-side){position:relative}
.pc-msg{display:block;margin-top:4px;font-size:.8125rem;line-height:1.4;color:var(--red)}
.pc-msg[hidden]{display:none}
.pc-msg.is-side{position:absolute;left:calc(100% + 16px);bottom:0;width:var(--pc-w,184px);height:46px;margin:0;display:flex;align-items:center;font-size:.84375rem;line-height:1.35}
.pc-flash{animation:ldr-pc-flash .6s ease-out}
@keyframes ldr-pc-flash{from{background-color:var(--peach)}to{background-color:#fff}}
@media (prefers-reduced-motion:reduce){.pc-flash{animation:none}}
/* checkout: saved delivery addresses (plugin addresses.php) */
@media (max-width:860px){
	.pc-msg.is-side{position:static;width:auto;height:auto;display:block;margin-top:4px;font-size:.8125rem}
}

/* ---------- accessibility panel (template-parts/a11y-panel.php) ---------- */
.a11y-fab{position:fixed;left:16px;bottom:16px;z-index:55;display:grid;place-items:center;width:48px;height:48px;border-radius:50%;border:0;background:var(--ink);color:#fff;box-shadow:0 8px 24px rgba(40,41,42,.25);cursor:pointer;transition:transform .15s,background .15s}
.a11y-fab:hover{background:#000;transform:scale(1.05)}
.a11y-fab:focus-visible{outline:3px solid var(--orange-ink);outline-offset:3px}
.a11y-sheet{position:fixed;inset:auto auto 76px 16px;margin:0;width:min(400px,calc(100vw - 40px));max-height:calc(100dvh - 110px);padding:0;border:0;border-radius:20px;background:#fff;color:var(--ink);box-shadow:var(--shadow-lg);display:none;flex-direction:column;overflow:hidden}
.a11y-sheet[open]{display:flex;animation:a11y-in .18s ease}
.a11y-sheet::backdrop{background:transparent}
@keyframes a11y-in{from{opacity:0;transform:translateY(8px)}}
.a11y-head{display:flex;justify-content:space-between;align-items:flex-start;gap:12px;padding:20px 20px 14px;border-bottom:1px solid var(--line)}
.a11y-head h2{font-size:1.25rem}
.a11y-head p{margin:4px 0 0;font-size:.8125rem;color:var(--muted)}
.a11y-body{overflow:auto;overscroll-behavior:contain;padding:4px 20px 20px}
.a11y-form fieldset{border:0;margin:0;padding:0;min-inline-size:0}
.a11y-form .a11y-seg{margin-top:16px}
.a11y-seg legend{padding:0;margin-bottom:8px;font-family:var(--head);font-weight:600;font-size:.75rem;letter-spacing:.06em;text-transform:uppercase;color:var(--muted)}
.a11y-seg>div{display:flex;gap:4px;padding:4px;border-radius:14px;background:var(--sand)}
.a11y-seg label{flex:1;position:relative}
.a11y-seg input{position:absolute;inset:0;width:100%;height:100%;opacity:0;margin:0;cursor:pointer}
.a11y-seg span{display:flex;align-items:center;justify-content:center;min-height:40px;padding:0 10px;border-radius:10px;font-family:var(--head);font-weight:500;font-size:.875rem;text-align:center;transition:background .15s,box-shadow .15s}
.a11y-seg label:hover input:not(:checked)+span{background:rgba(255,255,255,.6)}
.a11y-seg input:checked+span{background:#fff;box-shadow:0 1px 4px rgba(40,41,42,.16);font-weight:600}
.a11y-seg input:focus-visible+span{outline:3px solid var(--orange-ink);outline-offset:1px}
.a11y-form .a11y-sws{margin-top:10px}
.a11y-sw{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:12px 0;border-bottom:1px solid var(--line);cursor:pointer}
.a11y-sw:last-child{border-bottom:0}
.a11y-sw strong{display:block;font-family:var(--head);font-weight:600;font-size:.9375rem}
.a11y-sw small{display:block;margin-top:2px;font-size:.8125rem;color:var(--muted)}
.a11y-sw input{-webkit-appearance:none;appearance:none;flex:none;position:relative;width:46px;height:28px;margin:0;border-radius:999px;background:#8c827a;cursor:pointer;transition:background .15s}
.a11y-sw input::before{content:"";position:absolute;top:3px;left:3px;width:22px;height:22px;border-radius:50%;background:#fff;box-shadow:0 1px 3px rgba(0,0,0,.25);transition:transform .15s}
.a11y-sw input:checked{background:var(--orange-ink)}
.a11y-sw input:checked::before{transform:translateX(18px)}
.a11y-sw input:focus-visible{outline:3px solid var(--orange-ink);outline-offset:2px}
.a11y-foot{display:flex;justify-content:space-between;align-items:center;gap:12px;margin-top:14px;padding-top:14px;border-top:1px solid var(--line)}
.a11y-reset{min-height:40px;padding:0 18px;border:1.5px solid var(--line);border-radius:999px;background:#fff;font-family:var(--head);font-weight:600;font-size:.875rem;cursor:pointer}
.a11y-reset:hover{border-color:var(--ink)}
.a11y-foot a{font-size:.875rem;text-decoration:underline;text-underline-offset:3px}
.f-a11y{min-height:24px;padding:0;border:0;background:none;color:inherit;font:inherit;text-decoration:underline;text-underline-offset:3px;cursor:pointer}
.f-a11y:hover{color:#fff}
.drawer-nav button.plain-link{display:flex;align-items:center;gap:10px;width:100%;border:0;border-bottom:1px solid var(--line);background:none;color:inherit;font-size:inherit;text-align:left;cursor:pointer}
@media (pointer:coarse){.a11y-sw-cursor{display:none}}
/* Keyboard focus scrolled into view never lands under the floating button. */
@media (min-width:861px){html{scroll-padding-bottom:72px}}
@media (max-width:860px){
	.a11y-fab{display:none}
	.a11y-sheet{inset:auto 0 0;width:100%;max-height:88dvh;border-radius:20px 20px 0 0;padding-bottom:env(safe-area-inset-bottom)}
	.a11y-sheet::backdrop{background:rgba(40,41,42,.25)}
}
@media print{.a11y-fab{display:none}}

/* Modes chosen in the panel (data attributes on <html>). Font sizes are in rem, so the text size
   follows the root size, which also respects the browser's own default font size. */
html[data-a11y-text="1"]{font-size:112.5%}
html[data-a11y-text="2"]{font-size:125%}
html[data-a11y-text] .nav-list{flex-wrap:wrap;row-gap:2px}
html[data-a11y-contrast=high]{--ink:#111;--muted:#2f2c29;--orange-ink:#7a3800;--line:#8c827a;--peach-line:#a8927e;--sand-2:#d9cfc6}
html[data-a11y-contrast=high] body{color:#111}
html[data-a11y-contrast=high] .dim{opacity:.7}
html[data-a11y~=spacing] :is(p,li,dd,dt,blockquote,td,th,figcaption,label,.lead){letter-spacing:.05em!important;word-spacing:.12em!important;line-height:1.75!important}
html[data-a11y~=font]{--head:'Atkinson Hyperlegible Next','Atkinson Hyperlegible',Verdana,Tahoma,sans-serif;--body:'Atkinson Hyperlegible Next','Atkinson Hyperlegible',Verdana,Tahoma,sans-serif}
html[data-a11y~=links] :is(main,footer,.sheet,.mega) a:not(.btn){text-decoration:underline!important;text-underline-offset:.2em}
html[data-a11y~=focus] :focus{outline:3px solid var(--ink)!important;outline-offset:2px!important;box-shadow:0 0 0 6px #fff!important}
html[data-a11y~=motion],html[data-a11y~=motion] *,html[data-a11y~=motion] *::before,html[data-a11y~=motion] *::after{animation:none!important;transition:none!important;scroll-behavior:auto!important}
html[data-a11y~=cursor],html[data-a11y~=cursor] *{cursor:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='32' height='32' viewBox='0 0 32 32'%3E%3Cpath d='M5 3v23l6.3-6 4.3 9.7 4.2-1.9-4.2-9.5H24z' fill='%2328292a' stroke='%23fff' stroke-width='2' stroke-linejoin='round'/%3E%3C/svg%3E") 5 3,auto!important}
html[data-a11y~=cursor] :is(a,button,label,summary,select,[role=button],input[type=checkbox],input[type=radio]),html[data-a11y~=cursor] :is(a,button,label,summary) *{cursor:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='32' height='32' viewBox='0 0 32 32'%3E%3Cpath d='M5 3v23l6.3-6 4.3 9.7 4.2-1.9-4.2-9.5H24z' fill='%23a84e00' stroke='%23fff' stroke-width='2' stroke-linejoin='round'/%3E%3C/svg%3E") 5 3,pointer!important}

/* ---------- Windows contrast themes (forced colours) ----------
   The system replaces every colour, so anything shown only by a background, a shadow or a mask
   would vanish. Selected states use the system's own Highlight pair, focus gets a real outline. */
@media (forced-colors:active){
	:focus-visible,input:focus,select:focus,textarea:focus{outline:2px solid Highlight!important;outline-offset:2px}
	.hdr .search form:focus-within{outline:2px solid Highlight}
	.suggest [role=option][aria-selected=true],.sym .list [role=option][aria-selected=true],.tabs button[aria-selected=true],
	.help .chips button[aria-pressed=true],.aud button[aria-pressed=true],.lang button[aria-pressed=true],.lang a[aria-current],
	.chips [aria-current],.chips [aria-pressed=true],.packs a[aria-current=page],.subcats a[aria-current=page],
	.a11y-seg input:checked+span,.steps .now .n{forced-color-adjust:none;background:Highlight;color:HighlightText;border-color:Highlight}
	.thumbs button[aria-pressed=true]{outline:3px solid Highlight;outline-offset:1px}
	.hero-ctrl .dot{border:1px solid ButtonText}
	.hero-ctrl .dot[aria-pressed=true]{forced-color-adjust:none;background:Highlight;border-color:Highlight}
	.dot-fill{display:none}
	.steps li+li::before{forced-color-adjust:none;background:CanvasText}
	.co-errs-t::before{forced-color-adjust:none;background:CanvasText}
	.stocksw .sw,.a11y-sw input{forced-color-adjust:none;background:Canvas;border:2px solid CanvasText}
	.stocksw .sw::after,.a11y-sw input::before{background:CanvasText;box-shadow:none;top:1px;left:1px}
	.stocksw input:checked+.sw,.a11y-sw input:checked{background:Highlight;border-color:Highlight}
	.stocksw input:checked+.sw::after{background:HighlightText;left:17px}
	.a11y-sw input:checked::before{background:HighlightText}
	.a11y-fab{border:2px solid ButtonText}
}

/* Open panel or dialog on a phone: the page behind does not scroll. */
@media (max-width:860px){html.has-dialog{overflow:hidden}}