/* Bogso Farmasi page (/farmasi/): hero with the delivery bag, picture categories, lean product cards. */
.shop-hero{display:none}
.fx-hero{position:relative;overflow:hidden;background:radial-gradient(700px 360px at 82% 40%,color-mix(in srgb,var(--rx,#0E9F6E) 22%,transparent),transparent 70%),var(--bg-2);border-bottom:1px solid var(--line)}
.fx-hero-in{display:grid;grid-template-columns:minmax(0,1.15fr) minmax(0,.85fr);gap:clamp(20px,4vw,48px);align-items:center;padding-top:clamp(28px,4.5vw,64px);padding-bottom:clamp(28px,4.5vw,56px)}
.fx-eyebrow{display:inline-flex;align-items:center;gap:9px;font-weight:700;font-size:16px;color:var(--text)}
.fx-eyebrow svg{width:22px;height:22px;fill:#E5383B}
.fx-hero h1{margin-top:12px;font-size:clamp(36px,5vw,64px);font-weight:800;letter-spacing:-.04em;line-height:1.02;max-width:14ch}
.fx-search{margin-top:26px;width:min(520px,100%);min-height:60px;padding:0 20px;background:var(--surface);border-width:2px;box-shadow:0 18px 40px -26px rgba(6,23,29,.45)}
.fx-search input{font-size:17px;min-height:56px}
.fx-trust{list-style:none;margin:18px 0 0;padding:0;display:flex;flex-wrap:wrap;gap:8px 18px}
.fx-trust li{display:inline-flex;align-items:center;gap:7px;font-size:14.5px;font-weight:600;color:var(--text-soft)}
.fx-trust svg{width:18px;height:18px;flex:none;color:var(--rx,#0E9F6E)}
.fx-bag{justify-self:center;width:min(360px,100%)}
.fx-bag svg{width:100%;height:auto;display:block;overflow:visible}
.fx-peek{animation:fx-peek 4.5s ease-in-out infinite;transform-box:fill-box}
.fx-peek:nth-of-type(2n){animation-delay:-1.5s}.fx-peek:nth-of-type(3n){animation-delay:-3s}
@keyframes fx-peek{0%,100%{translate:0 0}50%{translate:0 -6px}}
@media (prefers-reduced-motion:reduce){.fx-peek{animation:none}}

/* categories: one compact row of picture tiles, swipe sideways for more (like a department strip) */
.fx-cats.shop-tools{position:static;display:flex;flex-wrap:nowrap;align-items:flex-start;justify-content:flex-start;gap:10px;overflow-x:auto;overscroll-behavior-x:contain;scroll-snap-type:x proximity;scrollbar-width:none;padding:18px 2px 16px;margin:0;border-bottom:1px solid var(--line);background:none;scroll-margin-top:calc(var(--nav-h) + 10px)}
.fx-cats::-webkit-scrollbar{display:none}
.fx-cat{flex:0 0 auto;width:112px;min-height:0;padding:0;border:0;background:none;color:var(--text);display:flex;flex-direction:column;align-items:center;gap:6px;cursor:pointer;scroll-snap-align:start;font:inherit}
.fx-cat-art{width:84px;height:84px;border-radius:22px;background:var(--surface);border:1.5px solid var(--line);display:grid;place-items:center;transition:transform .25s,border-color .2s,box-shadow .25s}
.fx-cat:hover .fx-cat-art{transform:translateY(-2px);border-color:color-mix(in srgb,var(--sky) 55%,var(--line))}
.fx-cat.on .fx-cat-art{border-color:var(--sky);box-shadow:0 0 0 2px var(--sky),0 12px 22px -16px var(--sky)}
.fx-cat-art svg{width:84%;height:auto}
.fx-all{grid-template-columns:1fr 1fr;padding:8px;gap:0}
.fx-all i{display:grid;place-items:center}.fx-all i svg{width:94%}
.fx-cat b{font-size:13.5px;font-weight:700;line-height:1.2;text-align:center;max-width:100%}
.fx-cat.on{background:none;border:0;color:var(--text)}
.fx-cat.on b{color:var(--sky)}
.fx-cat small{font-size:12px;font-weight:600;color:var(--muted);margin-top:-3px}
.fx-sub{display:flex;flex-wrap:wrap;align-items:center;gap:10px;margin:18px 0 12px}
.fx-sub h3{font-size:17px;font-weight:700;color:var(--text-soft);letter-spacing:-.01em}
.cat-block .cat-h{margin-bottom:4px}

/* lean product cards: picture, name, size, price, add */
.shop .p-body{gap:4px;padding:14px 16px 16px}
.shop .p-body h3{font-size:17.5px}
.shop .p-art svg{width:68%}
.shop .grid-products{grid-template-columns:repeat(auto-fill,minmax(210px,1fr))}
.shop .cat-block{padding-top:28px}

@media (max-width:860px){
  .fx-hero-in{grid-template-columns:minmax(0,1fr)}
  .fx-bag{display:none}
  .fx-hero h1{font-size:clamp(32px,9vw,44px)}
  .fx-search{margin-top:18px;min-height:54px}.fx-search input{min-height:50px}
  .fx-trust{gap:6px 14px}.fx-trust li{font-size:13.5px}
}
@media (max-width:760px){
  .fx-cat{width:80px;gap:5px}
  .fx-cat-art{width:66px;height:66px;border-radius:18px}
  .fx-cat b{font-size:12px}
  .fx-cat small{font-size:11px}
  .fx-cats.shop-tools{gap:6px;padding:14px 16px 12px;margin:0 -16px}
  .shop .p-body{padding:12px 12px 14px}.shop .p-body h3{font-size:15.5px}
  .shop .grid-products{grid-template-columns:repeat(2,minmax(0,1fr))}
}

/* hero picks: one product at a time, swipe or tap the dots; real offer prices */
.fx-deals{justify-self:end;width:min(420px,100%);background:var(--surface);border:1px solid var(--line);border-radius:26px;padding:14px;box-shadow:0 30px 60px -42px rgba(6,23,29,.6)}
.fx-deal-top{display:flex;align-items:center;flex-wrap:wrap;gap:6px 9px;padding:2px 4px 12px;font-size:14.5px}
.fx-flag{background:#E5383B;color:#fff;font-weight:800;font-size:13px;padding:4px 10px;border-radius:999px;white-space:nowrap}
.fx-deal-top b{font-weight:700}
.fx-count{margin-left:auto;color:var(--muted);font-weight:600;font-size:13.5px;font-variant-numeric:tabular-nums;white-space:nowrap}
.fx-count time{color:var(--text);font-weight:800}
.fx-track{display:flex;overflow-x:auto;scroll-snap-type:x mandatory;scrollbar-width:none;overscroll-behavior-x:contain;border-radius:18px;outline-offset:3px}
.fx-track::-webkit-scrollbar{display:none}
.fx-slide.product{flex:0 0 100%;min-width:0;scroll-snap-align:start;border:0;border-radius:18px;background:none;box-shadow:none;transform:none}
.fx-slide.product:hover{transform:none;box-shadow:none}
.fx-slide-art{position:relative;aspect-ratio:4/3;border-radius:18px;background:color-mix(in srgb,var(--c) 14%,var(--surface-2));display:grid;place-items:center;overflow:hidden}
.fx-slide-art svg{width:56%;height:auto}
.fx-slide-body{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:2px 12px;padding:14px 4px 2px}
.fx-slide-body h3{grid-column:1/-1;font-size:19px;font-weight:700;letter-spacing:-.01em;line-height:1.2;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.fx-slide-body .p-size{grid-column:1/-1;margin-bottom:6px}
.fx-slide-price{display:flex;align-items:baseline;flex-wrap:wrap;gap:2px 8px}
.fx-slide-price b{font-family:var(--display);font-size:26px;letter-spacing:-.02em}
.fx-slide-price s,.p-was{color:var(--muted);font-size:15px;font-weight:600;text-decoration-thickness:1.5px}
.p-was{margin-left:7px}
.fx-slide-price em,.p-first{font-style:normal;font-size:12.5px;font-weight:700;color:#E5383B}
.p-first{display:block}
.fx-slide .p-cta .qty{min-width:120px}
.fx-off{position:absolute;top:12px;right:12px;background:#E5383B;color:#fff;font-weight:800;font-size:13px;line-height:1;padding:6px 9px;border-radius:10px;box-shadow:0 6px 14px -6px rgba(229,56,59,.6)}
.fx-dots{display:flex;justify-content:center;gap:7px;padding-top:12px}
.fx-dots button{width:8px;height:8px;padding:0;border:0;border-radius:99px;background:var(--line);cursor:pointer;transition:width .25s,background .25s}
.fx-dots button[aria-current]{width:22px;background:var(--sky)}
.p-photo{width:80%;height:84%;object-fit:contain;border-radius:10px}
/* hero: a real photo gets a clean white stage and fills it (the product is never squeezed or cropped) */
.fx-slide-art:has(.p-photo){background:#fff;isolation:isolate}
.fx-slide-art .p-photo{width:100%;height:100%;padding:4%;box-sizing:border-box;border-radius:0;mix-blend-mode:multiply}
.cl-art .p-photo{width:82%;height:82%;border-radius:8px}
.fx-save{color:#0E9F6E;font-weight:700;margin-top:4px}
.fx-first-note{color:#E5383B;font-weight:600;margin-top:8px}
@media (prefers-reduced-motion:reduce){.fx-dots button{transition:none}}
@media (max-width:860px){
  .fx-deals{justify-self:stretch;width:100%;padding:12px;border-radius:22px}
  .fx-slide.product{display:grid;grid-template-columns:40% minmax(0,1fr);align-items:center;gap:12px}
  .fx-slide-art{aspect-ratio:1/1;border-radius:16px}
  .fx-slide-body{grid-template-columns:minmax(0,1fr);padding:0}
  .fx-slide-body h3{font-size:16.5px;white-space:normal;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical}
  .fx-slide-body .p-size{margin-bottom:2px}
  .fx-slide-price b{font-size:22px}
  .fx-slide .p-cta{margin-top:8px}.fx-slide .p-cta .btn,.fx-slide .p-cta .qty{width:100%}
  .fx-off{top:8px;right:8px;font-size:12px;padding:5px 7px}
}