/*
 * HardFish — publiczny nagłówek, nawigacja, stopka i wspólne sekcje sklepu.
 */

.topbar{background:var(--hf-brand-950);color:#e8f2ed;font-size:13px}.topbar__inner{display:flex;min-height:34px;align-items:center;justify-content:space-between;gap:20px}.topbar a{color:#fff;font-weight:750}.dot{margin:0 10px;color:var(--hf-accent)}
.site-header{position:sticky;z-index:var(--hf-z-header);top:0;border-bottom:1px solid rgba(18,63,48,.1);background:rgba(255,255,255,.97);backdrop-filter:blur(16px)}.header-main{display:grid;height:82px;grid-template-columns:190px minmax(300px,1fr) auto;align-items:center;gap:24px}.logo{display:flex;min-width:0;align-items:center}.logo img{width:180px;height:56px;object-fit:contain;object-position:left center}.search{position:relative;display:flex;height:46px;min-width:0;align-items:center;padding-left:16px;border:1px solid var(--hf-line);border-radius:var(--hf-radius-full);background:var(--hf-surface-soft);transition:border-color var(--hf-duration-base),box-shadow var(--hf-duration-base),background var(--hf-duration-base)}.search:focus-within{border-color:var(--hf-brand-700);background:var(--hf-surface);box-shadow:0 0 0 3px var(--hf-focus-ring)}.search svg{width:20px;fill:none;stroke:var(--hf-brand-900);stroke-width:2}.search input{min-width:0;flex:1;padding:0 12px;border:0;background:transparent;color:var(--hf-ink);outline:0}.search button{height:44px;padding:0 20px;border:0;border-radius:var(--hf-radius-full);background:var(--hf-brand-900);color:#fff;font-weight:850}.header-actions{display:flex;align-items:center;gap:16px}.action-link{display:flex;min-height:44px;align-items:center;gap:9px;white-space:nowrap}.action-link small{display:block;color:var(--hf-muted);font-size:11px}.action-link strong{color:var(--hf-brand-900)}.action-icon{display:grid;width:38px;height:38px;border-radius:50%;background:var(--hf-brand-soft);color:var(--hf-brand-900);font-weight:900;place-items:center}.cart-link{min-width:44px;padding:4px 7px;border-radius:var(--hf-radius-md);transition:background var(--hf-duration-base),transform var(--hf-duration-base)}.cart-link:hover,.cart-link:focus-visible{background:var(--hf-brand-soft);outline:3px solid transparent}.cart-link:focus-visible{box-shadow:0 0 0 3px var(--hf-focus-ring)}.cart-link .action-icon{position:relative}.cart-link__details{display:flex;align-items:center;gap:7px;color:var(--hf-ink);font-size:13px}.cart-link__details strong{padding-left:7px;border-left:1px solid var(--hf-line);font-size:13px}.cart-link__mobile-total{display:none}.cart-link.is-updated{animation:hf-cart-pulse .38s ease-out}.cart-count-badge{display:none}@keyframes hf-cart-pulse{50%{transform:scale(1.035)}}
.nav-shell{border-top:1px solid #edf1ee}.main-nav{display:flex;height:48px;min-width:0;align-items:center;gap:4px}.main-nav>a,.nav-item>a{display:flex;height:44px;align-items:center;padding:0 13px;border-radius:var(--hf-radius-sm);color:#31443b;font-size:14px;font-weight:750}.nav-item{position:relative;display:flex;height:48px;align-items:center}.main-nav a:focus-visible,.nav-catalog-trigger:focus-visible{outline:3px solid var(--hf-accent);outline-offset:2px}.mobile-only,.main-nav__mobile-head,.mobile-search-toggle,.mobile-search-bar,.menu-overlay{display:none}
.mega-menu{position:absolute;top:100%;left:50%;z-index:var(--hf-z-dropdown);min-width:0;border:1px solid var(--hf-line);border-radius:0 0 var(--hf-radius-xl) var(--hf-radius-xl);background:var(--hf-surface);box-shadow:var(--hf-shadow);transform:translate(-50%,7px)}
.hero{padding:42px 0 28px}.hero-card{position:relative;display:grid;min-height:540px;grid-template-columns:1.05fr .95fr;overflow:hidden;border-radius:var(--hf-radius-xl);background:linear-gradient(120deg,var(--hf-brand-950),var(--hf-brand-900) 55%,var(--hf-brand-700));box-shadow:var(--hf-shadow)}.hero-card::before{position:absolute;z-index:1;inset:0;background:radial-gradient(circle at 18% 15%,rgba(230,182,46,.17),transparent 28%);content:"";pointer-events:none}.hero__content{position:relative;z-index:2;align-self:center;padding:64px;color:#fff}.hero h1{max-width:700px;margin:12px 0 24px;color:#fff;font-size:clamp(42px,5.2vw,70px);line-height:.99;letter-spacing:-.045em}.hero h1 span{display:block;color:var(--hf-accent-light)}.hero__lead{max-width:610px;color:#dbeae3;font-size:18px}.hero__actions{display:flex;flex-wrap:wrap;gap:12px;margin:30px 0}.hero__visual{position:relative;min-height:540px}.hero__visual img{width:100%;height:100%;object-fit:cover}.hero__visual::after{position:absolute;inset:0;background:linear-gradient(90deg,var(--hf-brand-900),rgba(18,63,48,.48) 14%,transparent 50%),linear-gradient(0deg,rgba(5,21,15,.42),transparent 36%);content:""}
.value-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px}.value-card{display:flex;height:100%;gap:18px;align-items:flex-start;padding:28px;border:1px solid var(--hf-line);border-radius:var(--hf-radius-lg);background:var(--hf-surface)}.value-icon{display:grid;width:52px;height:52px;flex:0 0 52px;border-radius:var(--hf-radius-md);background:var(--hf-brand-soft);color:var(--hf-brand-900);font-size:25px;place-items:center}.value-icon svg{width:27px;height:27px;fill:none;stroke:currentColor;stroke-width:1.9;stroke-linecap:round;stroke-linejoin:round}.value-card h3{margin:0 0 6px}.value-card p{margin:0;color:var(--hf-muted);font-size:14px}.home-category-action{display:flex;justify-content:center;margin-top:22px}
.store-section{display:grid;grid-template-columns:1fr 1fr;gap:28px;align-items:stretch}.store-photo{min-height:500px;overflow:hidden;border-radius:var(--hf-radius-xl);box-shadow:var(--hf-shadow)}.store-photo img{width:100%;height:100%;object-fit:cover}.store-copy{display:flex;flex-direction:column;justify-content:center;padding:clamp(34px,5vw,56px);border:1px solid var(--hf-line);border-radius:var(--hf-radius-xl);background:linear-gradient(145deg,var(--hf-surface),var(--hf-surface-alt))}.store-copy h2{max-width:15ch;margin:8px 0 20px;font-size:clamp(34px,4vw,46px);line-height:1.05}.store-copy p{max-width:68ch;color:var(--hf-muted);font-size:17px}.store-copy .btn{align-self:flex-start;margin-top:8px}
.contact-grid{display:grid;grid-template-columns:.9fr 1.1fr;gap:24px}.contact-card{position:relative;padding:28px;border:1px solid var(--hf-line);border-radius:var(--hf-radius-lg);background:var(--hf-surface)}.contact-list{display:grid;gap:14px;margin:22px 0}.contact-list a,.contact-list>div{display:flex;min-height:44px;align-items:flex-start;gap:12px}.contact-icon{display:grid;width:44px;height:44px;flex:0 0 44px;border-radius:var(--hf-radius-md);background:var(--hf-brand-soft);color:var(--hf-brand-900);font-weight:900;place-items:center}.contact-icon--nip{font-size:10px;letter-spacing:.03em}.contact-honeypot{position:absolute;left:-10000px;width:1px;height:1px;overflow:hidden}.map{width:100%;min-height:430px;border:0;border-radius:var(--hf-radius-lg);box-shadow:var(--hf-shadow-sm)}
.newsletter{padding:clamp(52px,5vw,70px) 0;border-top:1px solid var(--hf-line);background:#f5f8f6;color:var(--hf-ink)}.newsletter__inner{display:flex;align-items:center;justify-content:space-between;gap:clamp(32px,6vw,76px)}.newsletter__inner>div{min-width:0;max-width:520px}.newsletter h2{margin:7px 0 10px;color:var(--hf-brand-950);font-size:clamp(30px,3.2vw,42px);line-height:1.08}.newsletter p{margin:0;color:var(--hf-muted)}.newsletter-form{display:grid;width:min(620px,100%);min-width:0;grid-template-columns:minmax(220px,1fr) auto;gap:10px}.newsletter-form>input[type="email"]{min-width:0;min-height:50px;padding:0 15px;border:1px solid var(--hf-line);border-radius:var(--hf-radius-md);background:#fff;color:var(--hf-ink);outline:0}.newsletter-form>input[type="email"]:focus{border-color:var(--hf-brand-700);box-shadow:0 0 0 3px var(--hf-focus-ring)}.newsletter-form>input[type="email"]::placeholder{color:var(--hf-muted)}.newsletter-consent{display:flex;grid-column:1/-1;align-items:flex-start;gap:9px;color:var(--hf-muted);font-size:11px;line-height:1.45}.newsletter-consent input{width:18px;height:18px;flex:0 0 18px;margin-top:0;accent-color:var(--hf-brand-900)}.newsletter-consent a{color:var(--hf-brand-800);font-weight:750;text-decoration:underline}.newsletter-form__status{min-height:1.3em;grid-column:1/-1;margin:0;color:var(--hf-muted);font-size:12px}
.footer{padding:clamp(58px,6vw,78px) 0 22px;background:#091f18;color:#d8e4de}.footer__grid{display:grid;grid-template-columns:1.6fr repeat(3,minmax(0,1fr));gap:clamp(28px,4vw,52px)}.footer__grid>div{min-width:0}.footer__brand img{width:190px;max-width:100%}.footer p,.footer a{overflow-wrap:anywhere}.footer p{color:#9eb2a9}.footer h3{margin-top:0;color:#fff}.footer__grid>div:not(.footer__brand){display:flex;flex-direction:column;gap:9px}.footer a:focus-visible{outline:3px solid var(--hf-accent);outline-offset:3px}.footer__bottom{display:flex;justify-content:space-between;gap:20px;margin-top:42px;padding-top:20px;border-top:1px solid rgba(255,255,255,.1);color:#8fa49b;font-size:13px}.toast{position:fixed;z-index:var(--hf-z-toast);right:22px;bottom:22px;display:flex;max-width:min(420px,calc(100vw - 28px));align-items:center;gap:14px;padding:14px 18px;border-radius:var(--hf-radius-md);background:#102f24;box-shadow:var(--hf-shadow);color:#fff;opacity:0;visibility:hidden;transform:translateY(10px);transition:opacity var(--hf-duration-base),transform var(--hf-duration-base),visibility var(--hf-duration-base)}.toast.is-visible{opacity:1;visibility:visible;transform:none}.toast.is-error{background:#8d2e2e}.toast a,.toast button{margin-left:auto;border:0;background:transparent;color:var(--hf-accent-light);font-weight:850;text-decoration:underline}.back-to-top{position:fixed;z-index:80;right:22px;bottom:22px;display:none;width:50px;height:50px;border:1px solid rgba(255,255,255,.25);border-radius:var(--hf-radius-md);background:var(--hf-brand-900);box-shadow:var(--hf-shadow-sm);color:#fff;font-size:24px;font-weight:800;place-items:center}.back-to-top.is-visible{display:grid}
@media(hover:hover) and (pointer:fine){.main-nav>a:hover,.nav-item>a:hover,.footer a:hover{color:var(--hf-accent-light)}.main-nav>a:hover,.nav-item>a:hover{background:var(--hf-brand-soft);color:var(--hf-brand-900)}.back-to-top:hover{border-color:var(--hf-accent);background:var(--hf-accent);color:var(--hf-ink)}}
@media(max-width:1100px) and (min-width:861px){.header-main{grid-template-columns:165px minmax(260px,1fr) auto;gap:14px}.logo img{width:158px}.header-actions .action-link:first-child{display:none}.header-social{display:none}.main-nav>a,.nav-item>a{padding-inline:10px;font-size:13px}.nav-finder-link{margin-left:auto}.footer__grid{grid-template-columns:1.3fr repeat(3,1fr)}}
@media(max-width:860px){.topbar__inner>div{display:none}.header-main{height:70px;grid-template-columns:44px 145px minmax(0,1fr);gap:10px}.mobile-only,.mobile-search-toggle{display:grid}.logo img{width:142px}.search{display:none}.header-actions{justify-content:flex-end;gap:6px}.header-actions>.action-link:not(.cart-link)>span:last-child,.cart-link__copy{display:none}.cart-link{display:grid;min-width:62px;min-height:56px;align-content:center;justify-items:center;gap:0;padding:2px 3px}.cart-link .action-icon{width:34px;height:34px}.cart-link__mobile-total{display:block;max-width:62px;overflow:hidden;color:var(--hf-brand-900);font-size:10px;line-height:1.15;text-overflow:ellipsis}.cart-count-badge{position:absolute;top:-7px;right:-7px;display:grid;min-width:21px;height:21px;padding:0 5px;border:2px solid #fff;border-radius:999px;background:var(--hf-accent);box-shadow:0 3px 10px rgba(5,21,15,.22);color:var(--hf-brand-950);font-size:11px;font-weight:900;line-height:1;place-items:center}.nav-shell{border:0}.value-grid,.store-section,.contact-grid{grid-template-columns:1fr}.store-photo{min-height:390px}.newsletter__inner{align-items:flex-start;flex-direction:column}.newsletter-form{width:100%;min-width:0}.footer__grid{grid-template-columns:repeat(2,minmax(0,1fr))}.hero-card{grid-template-columns:1fr}.hero__content{padding:48px 30px}.hero__visual{min-height:360px}}
@media(max-width:560px){.topbar{display:none}.header-main{height:64px;grid-template-columns:44px 124px minmax(0,1fr);gap:8px}.logo img{width:120px;height:40px}.hero{padding-top:18px}.hero-card{border-radius:var(--hf-radius-lg)}.hero__content{padding:36px 22px}.hero h1{font-size:clamp(38px,11vw,46px)}.hero__lead{font-size:16px}.hero__visual{min-height:290px}.value-card{padding:22px}.store-copy{padding:28px}.newsletter-form{grid-template-columns:1fr}.newsletter-form .btn{width:100%}.footer__grid{grid-template-columns:1fr}.footer__bottom{flex-direction:column}.toast{right:14px;bottom:14px}.back-to-top{right:14px;bottom:14px;width:46px;height:46px}}
@media(max-width:360px){.header-main{grid-template-columns:44px 110px minmax(0,1fr)}.logo img{width:108px}.cart-link{min-width:58px}.cart-link__mobile-total{max-width:58px;font-size:9.5px}}
@media(prefers-reduced-motion:reduce){.cart-link.is-updated{animation:none}}

/* ═══════════════════════════════════════════════════════════════════════
   RC STAGE 1 — nav CTA, leaf product preview, availability chips
   ═══════════════════════════════════════════════════════════════════════ */

/* Persistent shop CTA — the detailed visual layer lives with navigation below. */
.nav-go-shop {
  font-weight: 900;
  white-space: nowrap;
  flex-shrink: 0;
}
/* Hide the duplicate nav-all link on desktop when nav-go-shop is visible */
@media (min-width: 861px) { .main-nav>.nav-all { display: none; } }
/* On mobile the shop CTA appears as the first drawer item */
@media (max-width: 860px) {
  .nav-go-shop {
    display: block;
    width: 100%;
    margin-bottom: 10px;
  }
}

/* ─── Leaf category product preview in mega-menu ─────────────────── */
.category-menu__leaf-products {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 6px;
  padding: 8px 0;
}
.category-menu__leaf-product {
  display: grid;
  min-width: 0;
  grid-template-columns: 52px minmax(0, 1fr);
  grid-template-rows: auto auto;
  align-items: center;
  gap: 2px 10px;
  min-height: 70px;
  padding: 8px;
  border: 1px solid var(--hf-line);
  border-radius: 11px;
  background: #fff;
  color: var(--ink);
  transition: background .15s, border-color .15s;
  text-decoration: none;
}
.category-menu__leaf-product:hover { border-color: var(--hf-line-strong); background: #f8faf9; }
.category-menu__leaf-product img {
  width: 52px; height: 52px; grid-row: 1/3; padding: 4px; object-fit: contain;
  border-radius: 8px; background: #f7f9f7;
}
.category-menu__leaf-product span { display: -webkit-box; min-width: 0; overflow: hidden; font-size: 12px; font-weight: 600; line-height: 1.3; -webkit-box-orient: vertical; -webkit-line-clamp: 2; }
.category-menu__leaf-product strong { align-self: end; font-size: 13px; color: var(--brand); white-space: nowrap; }
.category-menu__leaf-all {
  grid-column: 1/-1;
  display: inline-flex; align-items: center; gap: 5px;
  margin-top: 6px; padding: 7px 10px;
  border-radius: 10px; font-size: 13px; font-weight: 750;
  color: var(--brand); background: #edf4ef;
  transition: background .15s;
}
.category-menu__leaf-all:hover { background: #daeadf; }

/* ═══════════════════════════════════════════════════════════════════════
   1. SEARCH — position context + enriched suggestions
   ═══════════════════════════════════════════════════════════════════════ */

/* Search form needs relative positioning for the absolute suggestions panel */
.search {
  position: relative;
}

/* ─── Enriched suggestion item ─────────────────────────────────────── */

.search-suggestions {
  position: absolute;
  z-index: var(--hf-z-dropdown);
  top: calc(100% + 8px);
  right: 0;
  left: 0;
  padding: 6px;
  display: grid;
  gap: 2px;
  border: 1px solid var(--hf-line);
  border-radius: var(--hf-radius-md);
  background: var(--hf-surface);
  box-shadow: var(--hf-shadow-sm);
  max-height: 72vh;
  overflow-y: auto;
  scrollbar-width: thin;
  scrollbar-color: var(--hf-line) transparent;
}

.search-suggestions[hidden] {
  display: none;
}

.search-suggestions__loading {
  padding: 14px 16px;
  color: var(--hf-muted);
  font-size: var(--hf-text-sm);
  text-align: center;
}

.search-suggestions__empty {
  padding: 18px 16px;
  color: var(--hf-muted);
  font-size: var(--hf-text-sm);
  line-height: 1.5;
  text-align: center;
}

.search-suggestion {
  display: grid;
  grid-template-columns: 52px 1fr auto;
  align-items: center;
  gap: 11px;
  padding: 9px 12px;
  border-radius: var(--hf-radius-sm);
  color: var(--hf-ink);
  transition: background var(--hf-duration-fast) var(--hf-ease);
  text-decoration: none;
}

.search-suggestion:hover,
.search-suggestion[aria-selected="true"] {
  background: var(--hf-brand-soft);
  outline: none;
}

.search-suggestion:focus-visible {
  outline: 2px solid var(--hf-brand-mid);
  outline-offset: -2px;
}

/* Thumbnail */
.search-suggestion__thumb {
  flex-shrink: 0;
  width: 52px;
  height: 40px;
  border-radius: var(--hf-radius-xs);
  overflow: hidden;
  background: var(--hf-bg);
  border: 1px solid var(--hf-line);
  display: flex;
  align-items: center;
  justify-content: center;
}

.search-suggestion__thumb img {
  width: 100%;
  height: 100%;
  object-fit: contain;
  display: block;
}

.search-suggestion__thumb--fallback {
  background: linear-gradient(145deg, var(--hf-brand-soft), #dde9e3);
}

/* Info column */
.search-suggestion__info {
  display: flex;
  flex-direction: column;
  gap: 2px;
  min-width: 0;
  overflow: hidden;
}

.search-suggestion__info strong {
  font-size: 13px;
  font-weight: 700;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  color: var(--hf-ink);
  line-height: 1.35;
}

.search-suggestion__meta {
  font-size: 11px;
  color: var(--hf-muted);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  line-height: 1.4;
}

/* Aside: price + availability */
.search-suggestion__aside {
  display: flex;
  flex-direction: column;
  align-items: flex-end;
  gap: 4px;
  white-space: nowrap;
  flex-shrink: 0;
}

.search-suggestion__price {
  font-size: 13px;
  font-weight: 850;
  color: var(--hf-brand);
}

.search-suggestion__avail {
  font-size: 10px;
  font-weight: 750;
  padding: 2px 7px;
  border-radius: var(--hf-radius-full);
  line-height: 1.5;
}

.search-suggestion__avail--local {
  background: var(--hf-success-bg);
  color: var(--hf-success);
}

.search-suggestion__avail--supplier {
  background: var(--hf-info-bg);
  color: var(--hf-info);
}

/* "Zobacz wszystkie" footer link */
.search-suggestions__all {
  display: block;
  padding: 10px 12px;
  border-top: 1px solid var(--hf-line);
  font-size: 13px;
  font-weight: 750;
  color: var(--hf-brand);
  text-align: center;
  border-radius: 0 0 var(--hf-radius-sm) var(--hf-radius-sm);
  text-decoration: none;
}

.search-suggestions__all:hover,
.search-suggestions__all[aria-selected="true"] {
  background: var(--hf-brand-soft);
  color: var(--hf-brand-dark);
}

@media (max-width: 860px) {
  .search-suggestions--mobile {
    top: calc(100% + 7px);
    max-height: min(58vh, 440px);
    border-radius: var(--hf-radius-lg);
    box-shadow: var(--hf-shadow);
  }

  .search-suggestions--mobile .search-suggestion {
    min-height: 64px;
    grid-template-columns: 48px minmax(0, 1fr) auto;
    gap: 9px;
    padding: 8px 10px;
  }

  .search-suggestions--mobile .search-suggestion__thumb {
    width: 48px;
    height: 44px;
  }

  .search-suggestions--mobile .search-suggestions__all {
    display: grid;
    min-height: 48px;
    align-items: center;
  }
}

@media (max-width: 420px) {
  .mobile-search-bar {
    padding-inline: var(--hf-space-3);
  }

  .mobile-search-form {
    gap: 3px;
    padding-left: 10px;
  }

  .mobile-search-form input[type="search"] {
    padding-inline: 6px;
  }

  .mobile-search-form button[type="submit"] {
    padding-inline: 12px;
  }

  .search-suggestions--mobile .search-suggestion__avail {
    display: none;
  }
}

/* ═══════════════════════════════════════════════════════════════════════
   2. COMPACT STICKY HEADER
   ═══════════════════════════════════════════════════════════════════════ */

.site-header {
  transition: box-shadow var(--hf-duration-slow) var(--hf-ease);
}

/* After scroll, add subtle elevated shadow */
.site-header.is-compact {
  box-shadow: 0 2px 18px rgba(16, 53, 40, .13);
}

/* On large screens, slightly shrink header on scroll to reclaim vertical space */
@media (min-width: 861px) {
  .site-header.is-compact .header-main {
    height: 70px;
    transition: height var(--hf-duration-slow) var(--hf-ease);
  }
  .site-header.is-compact .logo img {
    width: 170px;
  }
}

/* ═══════════════════════════════════════════════════════════════════════
   3. MOBILE MENU — overlay and z-index
   ═══════════════════════════════════════════════════════════════════════ */

@media (max-width: 860px) {
  /* Raise site-header so it stays above the overlay */
  .site-header {
    z-index: 200;
  }

  /* Nav drawer above the overlay */
  .main-nav {
    z-index: 300;
  }

  /* Dimming overlay when mobile menu is open */
  body.menu-open::before {
    content: "";
    position: fixed;
    inset: 0;
    z-index: 250;
    background: rgba(5, 21, 15, 0.46);
  }

  /* Raise drawer above the overlay pseudo-element */
  body.menu-open .main-nav {
    z-index: 320;
  }
}

/* ═══════════════════════════════════════════════════════════════════════
   4. FEATURED CATEGORIES — homepage
   ═══════════════════════════════════════════════════════════════════════ */

.home-categories {
  background: var(--hf-surface);
  padding: 54px 0 48px;
}

.feat-cat-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 14px;
  list-style: none;
  padding: 0;
  margin: 0;
}

/* Bump to more columns when there's enough room (up to 8 categories) */
@media (min-width: 860px) {
  .feat-cat-grid {
    grid-template-columns: repeat(auto-fill, minmax(140px, 1fr));
  }
}

.feat-cat-card__link {
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
  gap: 11px;
  padding: 20px 12px 18px;
  border: 1px solid var(--hf-line);
  border-radius: var(--hf-radius-md);
  background: var(--hf-surface);
  transition: border-color var(--hf-duration-base) var(--hf-ease),
              box-shadow var(--hf-duration-base) var(--hf-ease),
              transform var(--hf-duration-base) var(--hf-ease);
  text-decoration: none;
  color: var(--hf-ink);
  height: 100%;
}

.feat-cat-card__link:hover {
  border-color: var(--hf-brand-mid);
  box-shadow: var(--hf-shadow-xs);
  transform: translateY(-3px);
}

.feat-cat-card__link:focus-visible {
  outline: 2px solid var(--hf-brand-mid);
  outline-offset: 2px;
  border-color: var(--hf-brand-mid);
  transform: translateY(-3px);
}

/* Image / icon wrapper */
.feat-cat-card__img-wrap {
  width: 72px;
  height: 72px;
  border-radius: var(--hf-radius-sm);
  overflow: hidden;
  background: var(--hf-bg);
  border: 1px solid var(--hf-line);
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
}

.feat-cat-card__img-wrap img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

/* Fallback: dark gradient when no image */
.feat-cat-card__img-wrap--fallback {
  background: linear-gradient(145deg, var(--hf-brand), var(--hf-brand-dark));
  border-color: transparent;
}

.feat-cat-card__icon {
  width: 36px;
  height: 36px;
  display: flex;
  align-items: center;
  justify-content: center;
  color: #fff;
}

.feat-cat-card__icon svg {
  width: 26px;
  height: 26px;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.8;
  stroke-linecap: round;
  stroke-linejoin: round;
}

/* Text block */
.feat-cat-card__body {
  display: flex;
  flex-direction: column;
  gap: 3px;
}

.feat-cat-card__name {
  font-size: 13px;
  font-weight: 750;
  color: var(--hf-ink);
  line-height: 1.35;
}

.feat-cat-card__count {
  font-size: 11px;
  color: var(--hf-muted);
}

/* ═══════════════════════════════════════════════════════════════════════
   5. BESTSELLERS — fix arbitrary nth-child hiding + mobile scroll-snap
   ═══════════════════════════════════════════════════════════════════════ */

/* Mobile: replace 2-column grid with horizontal scroll-snap carousel */
@media (max-width: 480px) {
  .storefront-collection__grid {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    overflow: visible;
    scroll-snap-type: none;
    gap: var(--hf-space-3);
    padding-bottom: var(--hf-space-2);
    -webkit-overflow-scrolling: touch;
    scrollbar-width: none;
  }

  .storefront-collection__grid::-webkit-scrollbar {
    display: none;
  }

  /* Show 1 card at a time with a peek of the next */
  .storefront-collection__grid > .product-card {
    max-width: none;
    scroll-snap-align: none;
  }

  .storefront-collection__grid .product-card__image {
    aspect-ratio: 4/3;
  }
}

/* ═══════════════════════════════════════════════════════════════════════
   6. HERO — large-screen polish
   ═══════════════════════════════════════════════════════════════════════ */

@media (min-width: 1440px) {
  .hero--day3 .hero-card {
    min-height: 580px;
  }

  .hero--day3 .hero__content {
    padding: 72px 56px 64px 72px;
  }
}

/* ═══════════════════════════════════════════════════════════════════════
   7. NEWSLETTER — accessibility polish
   ═══════════════════════════════════════════════════════════════════════ */

/* Improve focus rings on white newsletter form fields */
.newsletter-form > input[type="email"]:focus {
  outline: 2px solid var(--hf-accent);
  outline-offset: 2px;
  border-color: var(--hf-accent);
  background: #fff;
}

.newsletter-form > input[type="email"]:focus-visible {
  outline: 2px solid var(--hf-accent);
  outline-offset: 2px;
}

/* ═══════════════════════════════════════════════════════════════════════
   8. FOOTER — focus visibility + minor polish
   ═══════════════════════════════════════════════════════════════════════ */

.footer a:focus-visible,
.footer button:focus-visible {
  outline: 2px solid var(--hf-accent);
  outline-offset: 3px;
  border-radius: 3px;
}

/* Ensure social link focus ring is visible */
.social-link:focus-visible {
  outline: 2px solid var(--hf-accent);
  outline-offset: 2px;
}

/* ═══════════════════════════════════════════════════════════════════════
   9. RESPONSIVE — featured categories
   ═══════════════════════════════════════════════════════════════════════ */

@media (max-width: 767px) {
  .home-categories {
    padding: 42px 0 36px;
  }

  .feat-cat-grid {
    grid-template-columns: repeat(4, 1fr);
    gap: 10px;
  }

  .feat-cat-card__img-wrap {
    width: 56px;
    height: 56px;
  }

  .feat-cat-card__link {
    padding: 14px 8px;
    gap: 8px;
  }

  .feat-cat-card__name {
    font-size: 12px;
  }
}

@media (max-width: 480px) {
  .home-categories {
    padding: 36px 0 30px;
  }

  /* Horizontal scroll for categories on very small screens */
  .feat-cat-grid {
    display: flex;
    overflow-x: auto;
    scroll-snap-type: x mandatory;
    scroll-padding: 0 var(--hf-space-4);
    gap: 10px;
    padding-bottom: 8px;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: none;
    width: 100%;
    max-width: 100%;
    margin-inline: 0;
    padding-inline: 0;
  }

  .feat-cat-grid::-webkit-scrollbar {
    display: none;
  }

  .feat-cat-card {
    flex: 0 0 88px;
    min-width: 88px;
    scroll-snap-align: start;
  }

  .feat-cat-card__link {
    width: 88px;
    padding: 12px 8px;
    gap: 8px;
  }

  .feat-cat-card__img-wrap {
    width: 48px;
    height: 48px;
    border-radius: var(--hf-radius-xs);
  }

  .feat-cat-card__name {
    font-size: 11px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    max-width: 76px;
  }

  .feat-cat-card__count {
    display: none; /* save space at this size */
  }
}

/* ═══════════════════════════════════════════════════════════════════════
   10. SEARCH SUGGESTIONS — mobile
   ═══════════════════════════════════════════════════════════════════════ */

@media (max-width: 560px) {
  .search-suggestion {
    grid-template-columns: 40px 1fr;
    gap: 9px;
  }

  /* Hide price/availability aside on very small screens to prevent overflow */
  .search-suggestion__aside {
    display: none;
  }

  .search-suggestion__thumb {
    width: 40px;
    height: 32px;
  }
}

/* ═══════════════════════════════════════════════════════════════════════
   11. REDUCED MOTION
   ═══════════════════════════════════════════════════════════════════════ */

@media (prefers-reduced-motion: reduce) {
  .feat-cat-card__link,
  .site-header,
  .site-header .header-main,
  .site-header .logo img {
    transition: none ;
  }
}

/* === RC STAGE 2 — Free shipping progress bar === */
.free-shipping-progress{margin:14px 0 6px;padding:13px 14px;background:#f0f8f3;border-radius:10px;border:1px solid #d4eadb;}.free-shipping-progress__label{font-size:13px;color:#2e5c3e;margin:0 0 8px;}.free-shipping-progress__achieved{display:flex;align-items:center;gap:7px;font-size:13px;font-weight:800;color:#1a6638;margin:0;}.free-shipping-progress__achieved svg{stroke:#22a256;flex-shrink:0;}.free-shipping-progress__bar{height:8px;background:#d4eadb;border-radius:999px;overflow:hidden;}.free-shipping-progress__fill{height:100%;background:linear-gradient(90deg,#22a256,#18883e);border-radius:999px;transition:width .4s cubic-bezier(.4,0,.2,1);min-width:4px;}
.payment-status-icon{display:block;width:64px;height:64px;margin:0 auto 16px;}.payment-status-icon--paid{color:#22a256;}.payment-status-icon--pending{color:#d97706;}.payment-status-icon--failed{color:#dc2626;}.payment-status-icon--expired{color:#9ca3af;}.payment-status-icon--refunded{color:#6366f1;}

/* ═══════════════════════════════════════════════════════════════════════
   2026-08 UI hardening — custom navigation artwork, mobile drawer layer,
   and catalog-wide live search in the results toolbar.
   ═══════════════════════════════════════════════════════════════════════ */
.mobile-menu-toggle{position:relative;isolation:isolate;overflow:hidden;padding:0;border:1px solid rgba(235,188,55,.38);border-radius:13px;background:linear-gradient(145deg,#0e4b37,#072f23);box-shadow:inset 0 1px 0 rgba(255,255,255,.12),0 7px 18px rgba(5,45,32,.2);color:#f3c53d;transition:transform .2s var(--hf-ease),border-color .2s var(--hf-ease),background .2s var(--hf-ease),box-shadow .2s var(--hf-ease)}
.mobile-menu-toggle::before{position:absolute;z-index:0;inset:-35% 35% -35% -45%;border-radius:50%;background:radial-gradient(circle,rgba(244,198,61,.28),transparent 68%);content:"";transition:transform .28s var(--hf-ease),opacity .28s var(--hf-ease)}
.mobile-menu-toggle__lines{position:relative;z-index:1;display:block;width:21px;height:16px}
.mobile-menu-toggle__lines>span{position:absolute;left:0;width:21px;height:2px;border-radius:999px;background:currentColor;box-shadow:0 0 8px rgba(244,198,61,.28);transform-origin:center;transition:top .22s var(--hf-ease),transform .22s var(--hf-ease),opacity .16s var(--hf-ease),width .22s var(--hf-ease)}
.mobile-menu-toggle__lines>span:nth-child(1){top:1px}
.mobile-menu-toggle__lines>span:nth-child(2){top:7px;width:15px}
.mobile-menu-toggle__lines>span:nth-child(3){top:13px}
.mobile-menu-toggle[aria-expanded="true"]{border-color:rgba(247,207,83,.78);background:linear-gradient(145deg,#176047,#0b3f2e);box-shadow:inset 0 1px 0 rgba(255,255,255,.16),0 0 0 4px rgba(235,188,55,.1),0 9px 22px rgba(5,45,32,.26)}
.mobile-menu-toggle[aria-expanded="true"]::before{opacity:.85;transform:translateX(42%)}
.mobile-menu-toggle[aria-expanded="true"] .mobile-menu-toggle__lines>span:nth-child(1){top:7px;transform:rotate(45deg)}
.mobile-menu-toggle[aria-expanded="true"] .mobile-menu-toggle__lines>span:nth-child(2){opacity:0;transform:scaleX(.3)}
.mobile-menu-toggle[aria-expanded="true"] .mobile-menu-toggle__lines>span:nth-child(3){top:7px;transform:rotate(-45deg)}
.mobile-menu-toggle:focus-visible{outline:3px solid rgba(226,177,39,.72);outline-offset:3px}
.mobile-menu-toggle:active{transform:translateY(0) scale(.97)}

.main-nav>.nav-go-shop--art{position:relative;isolation:isolate;display:flex;width:184px;height:44px;min-height:44px;align-items:center;justify-content:center;gap:9px;padding:0 13px;overflow:hidden;border:1px solid rgba(236,188,49,.44);border-radius:13px;background:linear-gradient(118deg,#073a2a 0%,#0b4a35 58%,#07523a 100%);box-shadow:inset 0 1px 0 rgba(255,255,255,.11),0 7px 18px rgba(5,51,36,.2);color:#fff;font-size:12px;font-weight:900;letter-spacing:.01em;transition:transform .2s var(--hf-ease),border-color .2s var(--hf-ease),background .2s var(--hf-ease),box-shadow .2s var(--hf-ease)}
.nav-go-shop--art::before{position:absolute;z-index:0;inset:-70% 56% -70% -35%;border-radius:50%;background:radial-gradient(circle,rgba(244,198,61,.28),transparent 68%);content:"";transition:opacity .25s var(--hf-ease),transform .32s var(--hf-ease)}
.nav-go-shop--art::after{position:absolute;z-index:0;top:-40%;bottom:-40%;left:-45%;width:36%;background:linear-gradient(105deg,transparent,rgba(255,255,255,.22),transparent);content:"";transform:skewX(-18deg);transition:left .46s var(--hf-ease)}
.nav-go-shop__icon{position:relative;z-index:1;width:25px;height:25px;flex:0 0 25px;border:1px solid rgba(247,207,83,.5);border-radius:8px;background:rgba(244,198,61,.08);box-shadow:inset 0 1px 0 rgba(255,255,255,.11)}
.nav-go-shop__icon::before{position:absolute;right:4px;bottom:4px;left:4px;height:10px;border:2px solid #f4c63d;border-radius:2px;content:""}
.nav-go-shop__icon::after{position:absolute;top:5px;left:8px;width:7px;height:5px;border:2px solid #f4c63d;border-bottom:0;border-radius:4px 4px 0 0;content:""}
.nav-go-shop__label{position:relative;z-index:1;line-height:1}
.nav-go-shop__arrow{position:relative;z-index:1;color:#f7cf53;font-size:18px;line-height:1;transition:transform .2s var(--hf-ease),color .2s var(--hf-ease)}
.main-nav>.nav-go-shop--art:focus-visible{border-color:#f7cf53;outline:3px solid rgba(226,177,39,.68);outline-offset:3px;box-shadow:inset 0 1px 0 rgba(255,255,255,.14),0 8px 22px rgba(5,51,36,.24)}
.main-nav>.nav-go-shop--art:active{transform:translateY(0) scale(.985)}

@media(hover:hover) and (pointer:fine){
  .mobile-menu-toggle:hover{border-color:rgba(247,207,83,.76);background:linear-gradient(145deg,#146047,#083a2a);box-shadow:inset 0 1px 0 rgba(255,255,255,.16),0 0 18px rgba(230,182,46,.2),0 9px 22px rgba(5,45,32,.24);transform:translateY(-2px)}
  .mobile-menu-toggle:hover::before{transform:translateX(38%)}
  .mobile-menu-toggle:hover .mobile-menu-toggle__lines>span:nth-child(2){width:21px}
  .main-nav>.nav-go-shop--art:hover{border-color:rgba(247,207,83,.84);background:linear-gradient(118deg,#0a4632 0%,#126047 60%,#0b684a 100%);box-shadow:inset 0 1px 0 rgba(255,255,255,.16),0 0 22px rgba(230,182,46,.2),0 10px 23px rgba(5,51,36,.27);color:#fff;transform:translateY(-2px)}
  .nav-go-shop--art:hover::before{opacity:.95;transform:translateX(24%)}
  .nav-go-shop--art:hover::after{left:125%}
  .nav-go-shop--art:hover .nav-go-shop__arrow{color:#fff1b3;transform:translateX(4px)}
}

.menu-overlay{display:none;position:fixed;inset:0;z-index:90;padding:0;border:0;background:rgba(7,24,18,.48);cursor:pointer}

@media(max-width:860px){
  body.menu-open:before{display:none;content:none}
  body.menu-open .menu-overlay{display:block}
  .site-header{z-index:100}
  .main-nav{z-index:120;isolation:isolate;opacity:0;filter:none;backdrop-filter:none}
  .main-nav.main-nav.is-open{opacity:1;background:#fff;filter:none}
  .main-nav>.nav-go-shop--art{width:100%;height:52px;min-height:52px;margin-bottom:12px;padding:0 16px;border-radius:14px;font-size:14px;box-shadow:inset 0 1px 0 rgba(255,255,255,.12),0 8px 22px rgba(5,51,36,.2)}
  .nav-go-shop__icon{width:28px;height:28px;flex-basis:28px}
  .nav-go-shop__icon::before{right:5px;bottom:5px;left:5px}
  .nav-go-shop__icon::after{top:6px;left:9px}
  .nav-go-shop__arrow{margin-left:auto}
}

@media(prefers-reduced-motion:reduce){.mobile-menu-toggle,.mobile-menu-toggle::before,.mobile-menu-toggle__lines>span,.main-nav>.nav-go-shop--art,.nav-go-shop--art::before,.nav-go-shop--art::after,.nav-go-shop__arrow{transition:none}}

.search-suggestions__empty {
  padding: 16px;
  border-radius: var(--hf-radius-sm);
  background: var(--hf-surface-soft);
  color: var(--hf-muted);
  font-size: var(--hf-text-sm);
  line-height: 1.45;
  text-align: center;
}
@media(max-width:620px){
}

/* Wide presentation shell used by the public header and homepage. */
.site-header .container,.topbar .container,.page-home .container{width:min(var(--hf-container-wide),calc(100% - clamp(32px,5vw,96px)))}
.site-header{border-bottom-color:rgba(8,40,30,.13);background:rgba(255,255,255,.985);box-shadow:0 6px 22px rgba(8,40,30,.055);backdrop-filter:blur(8px)}
.header-main{height:72px;grid-template-columns:190px minmax(320px,1fr) auto;gap:clamp(16px,2vw,30px)}
.logo img{width:174px;height:52px}
.header-actions{gap:12px}
.action-link{border-radius:var(--hf-radius-md);transition:background var(--hf-duration-base) var(--hf-ease),transform var(--hf-duration-base) var(--hf-ease),box-shadow var(--hf-duration-base) var(--hf-ease)}
.action-link:focus-visible{outline:3px solid var(--hf-accent);outline-offset:2px}
@media(hover:hover) and (pointer:fine){.action-link:hover{background:#f3f8f5;box-shadow:var(--hf-shadow-xs);transform:translateY(-1px)}}
@media(max-width:860px){.site-header .container,.topbar .container,.page-home .container{width:min(var(--hf-container-wide),calc(100% - 24px))}.header-main{height:64px;grid-template-columns:44px minmax(108px,142px) minmax(0,1fr);gap:8px}}
@media(prefers-reduced-motion:reduce){.action-link{transition:none}}
/* Fishing methods: shared navigation and active states. */
.main-nav > a,.main-nav > .nav-item > button{position:relative;min-height:44px}
.main-nav > a.is-active::after,.main-nav > .nav-item > button.is-active::after,.main-nav > a[aria-current="page"]::after{content:"";position:absolute;left:12px;right:12px;bottom:3px;height:3px;border-radius:3px;background:var(--color-accent,#f4bd24)}
.nav-secondary-start{margin-left:auto}
.nav-item--methods .nav-method-trigger{color:#113f30;font-weight:800}
.mega-menu--methods{padding:0;overflow:hidden}
.method-menu__head{display:flex;align-items:center;justify-content:space-between;gap:20px;padding:20px 24px;border-bottom:1px solid #dce7e1;background:#f5f9f7}
.method-menu__head strong{display:block;font-size:1.35rem;color:#0a392b}
.method-menu__head [data-submenu-back]{display:none}
.method-menu__grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px;padding:20px 24px;max-height:min(62vh,620px);overflow:auto}
.method-menu__method{border:1px solid #d8e4de;border-radius:14px;background:#fff;overflow:hidden}
.method-menu__method[open],.method-menu__method.is-current{border-color:#b88a08;box-shadow:0 8px 24px rgba(13,63,47,.1)}
.method-menu__method summary{display:flex;justify-content:space-between;align-items:center;gap:10px;min-height:52px;padding:12px 14px;color:#0d3f2f;font-weight:850;cursor:pointer;background:#f8fbf9}
.method-menu__method summary small{font-weight:700;color:#577066}
.method-menu__method>div{display:grid;gap:2px;padding:6px}
.method-menu__method>div>a{display:flex;align-items:center;justify-content:space-between;gap:12px;min-height:44px;padding:8px 10px;border-radius:9px;color:#294a3f;text-decoration:none;font-size:.88rem}
.method-menu__method>div>a:hover,.method-menu__method>div>a:focus-visible{background:#eaf3ef;color:#073d2c;outline:2px solid #b88a08;outline-offset:-2px}
.method-menu__method .method-menu__all{background:#0d4937;color:#fff;font-weight:800}

@media (max-width:959px){
  .nav-secondary-start{margin-left:0}
  .mega-menu--methods{position:fixed;inset:0;z-index:4;border-radius:0;overflow:auto}
  .method-menu__head{position:sticky;top:0;z-index:2;padding:14px 16px}
  .method-menu__head [data-submenu-back]{display:inline-flex;min-height:44px;align-items:center}
  .method-menu__head .category-menu__close{display:none}
  .method-menu__grid{display:block;padding:12px 14px;max-height:none;overflow:visible}
  .method-menu__method{margin-bottom:10px}
  .method-menu__method summary{min-height:56px}
}