/* ============================================================================
   MIODOWE OGRODY — warstwa sklepowa
   Pasek informacyjny, nagłówek z wyszukiwarką, karuzela zdjęć, karuzele
   produktowe, karty z wyborem gramatury, koszyk z dostawą, opinie, historia.
   Ładowana jako ostatnia: świadomie nadpisuje starsze reguły.
   ============================================================================ */

/* atrybut hidden wygrywa z układem (grid/flex) w każdym komponencie sklepu */
[hidden] { display: none !important; }

/* ---------------------------------------------------------- przyciski ----- */
.btn { border-radius: var(--radius); font-weight: 700; }
.btn--primary { --btn-bg: var(--honey); --btn-fg: var(--ink); }
.btn--primary:hover { background: var(--honey-deep); color: var(--ink); }
.btn--secondary { border-color: var(--line-strong); font-weight: 600; }
.btn--ghost {
  background: transparent; color: var(--ink); border-color: var(--line-strong);
  font-weight: 600; padding: .6em 1.05em;
}
.btn--ghost:hover { background: var(--ink); color: var(--paper); border-color: var(--ink); }

/* ------------------------------------------------- pasek informacyjny ----- */
.topbar {
  background: var(--ink); color: var(--paper);
  font-size: var(--step--1); line-height: 1.3;
}
.topbar__inner {
  display: flex; align-items: center; justify-content: space-between; gap: var(--space-s);
  min-height: 38px;
}
.topbar__rotator { position: relative; margin: 0; max-width: none; flex: 1; min-height: 1.3em; }
.topbar__msg {
  position: absolute; inset: 0; display: flex; align-items: center;
  opacity: 0; transform: translateY(6px); pointer-events: none;
  transition: opacity var(--dur-fast) var(--ease), transform var(--dur-fast) var(--ease);
}
.topbar__msg.is-active { opacity: 1; transform: none; }
.topbar__msg:first-child::before,
.topbar__msg.is-active::before { content: ""; }
.topbar__links { display: flex; align-items: center; gap: var(--space-m); white-space: nowrap; }
.topbar__links a { color: var(--paper); text-decoration: none; opacity: .9; }
.topbar__links a:hover { opacity: 1; text-decoration: underline; }
.topbar__tel { display: inline-flex; align-items: center; gap: .4rem; font-weight: 700; }
.topbar__tel svg { width: 15px; height: 15px; color: var(--pollen); }
@media (max-width: 700px) {
  .topbar__inner { min-height: 34px; }
  .topbar__links a:not(.topbar__tel) { display: none; }
  .topbar__rotator { font-size: .78rem; }
}

/* ------------------------------------------------------------ nagłówek ---- */
.nav { background: var(--paper); border-bottom: 1px solid var(--line); }
.nav__inner { min-height: 78px; gap: clamp(.75rem, 2vw, 1.75rem); }
.nav.is-stuck { background: var(--paper-92); }
.nav__links > ul { gap: clamp(.7rem, 1.5vw, 1.5rem); }
.nav__link { font-size: var(--step--1); font-weight: 600; letter-spacing: .01em; white-space: nowrap; }
.nav__link::after { background: var(--amber); height: 2px; bottom: -.15em; }
.nav__link[aria-current="page"] { color: var(--amber); }
.nav__gap { margin-left: clamp(.4rem, 1.5vw, 1.2rem); }
.nav__gap .nav__link { color: var(--ink-soft); }

.nav__end { gap: .4rem; }
/* uwaga: stara reguła .nav__cart ustawiała sztywne 42x42 px i spłaszczała ikonę */
.nav__ic, .nav__ic.nav__cart {
  position: relative; display: inline-flex; flex-direction: column; align-items: center; gap: .18rem;
  width: auto; height: auto; padding: .5rem .7rem; border-radius: var(--radius); color: var(--ink);
  border: 1px solid transparent; transition: background var(--dur-fast) var(--ease), border-color var(--dur-fast) var(--ease);
}
.nav__ic:hover, .nav__ic.nav__cart:hover { background: var(--honey-soft); border-color: var(--line); }
.nav__ic svg, .nav__ic.nav__cart svg { width: 27px; height: 27px; flex: none; stroke-width: 1.7; }
.nav__ic-label {
  font-size: .7rem; font-weight: 700; letter-spacing: .05em; text-transform: uppercase;
  color: var(--ink); line-height: 1;
}
.nav__cart .nav__cart-count {
  position: absolute; top: .1rem; right: .25rem; min-width: 20px; height: 20px; padding: 0 5px;
  display: grid; place-items: center; border-radius: var(--radius-pill);
  background: var(--amber); color: var(--card); font-size: .72rem; font-weight: 800; line-height: 1;
  border: 2px solid var(--paper);
}
.nav__cart-count[hidden] { display: none; }
.nav__cart.bump { animation: cart-bump .5s var(--ease); }
@keyframes cart-bump { 40% { transform: scale(1.14); } 100% { transform: none; } }

@media (max-width: 1120px) { .nav__ic-label { display: none; } }
@media (max-width: 1000px) {
  .nav__links { display: none; }
  .nav__toggle { display: inline-flex; align-items: center; color: var(--ink); padding: .4rem; }
  .nav__toggle svg { width: 27px; height: 27px; }
  .nav__inner { min-height: 64px; justify-content: space-between; }
  .brand { margin-inline: auto; }
}
@media (min-width: 1001px) { .nav__toggle { display: none; } }

/* ------------------------------------------------------- wyszukiwarka ----- */
.search {
  position: absolute; left: 0; right: 0; top: 100%;
  background: var(--paper); border-bottom: 1px solid var(--line);
  box-shadow: var(--lift); z-index: 20;
}
.search[hidden] { display: none; }
.search__inner { padding-block: var(--space-s) 1rem; }
.search__form {
  display: flex; align-items: center; gap: .7rem;
  border: 1px solid var(--line-strong); border-radius: var(--radius); background: var(--card);
  padding: .5rem .8rem;
}
.search__form:focus-within { border-color: var(--amber); }
.search__ic svg, .search__close svg { width: 21px; height: 21px; color: var(--ink-soft); }
.search__input { flex: 1; border: 0; background: none; padding: .35rem 0; font-size: var(--step-0); }
.search__input:focus { outline: none; }
.search__input::-webkit-search-cancel-button { display: none; }
.search__close { display: inline-flex; padding: .2rem; }
.search__hint { font-size: var(--step--1); color: var(--ink-soft); margin-top: .7rem; max-width: none; }
.search__hint button {
  color: var(--amber); font-weight: 600; text-decoration: underline;
  text-underline-offset: .18em; margin-right: .55rem;
}
.search__results { margin-top: .8rem; display: grid; gap: .25rem; max-height: 58vh; overflow-y: auto; }
.search__results[hidden] { display: none; }
.sres {
  display: flex; align-items: center; gap: .85rem; padding: .5rem; border-radius: var(--radius);
  text-decoration: none; color: var(--ink);
}
.sres:hover, .sres:focus-visible { background: var(--honey-soft); }
.sres img { width: 46px; height: 46px; object-fit: cover; border-radius: var(--radius-sm); flex: none; }
.sres__n { font-weight: 600; }
.sres__c { font-size: var(--step--1); color: var(--ink-soft); }
.sres__p { margin-left: auto; font-weight: 700; white-space: nowrap; }
.search__none { color: var(--ink-soft); padding: .6rem .2rem; }

/* -------------------------------------------- karuzela na pierwszym ekranie */
.hero { position: relative; background: var(--ink); padding-top: 0; }
.hero__track {
  display: flex; overflow-x: auto; scroll-snap-type: x mandatory;
  scrollbar-width: none; -ms-overflow-style: none; scroll-behavior: smooth;
}
.hero__track::-webkit-scrollbar { display: none; }
.hero__slide { position: relative; flex: 0 0 100%; scroll-snap-align: start; }
.hero__media { position: relative; height: clamp(390px, 62vh, 620px); }
.hero__media img { width: 100%; height: 100%; object-fit: cover; }
.hero__media::after {
  content: ""; position: absolute; inset: 0;
  background: linear-gradient(180deg, rgba(34,56,43,.22) 0%, rgba(34,56,43,.08) 32%, rgba(34,56,43,.62) 68%, rgba(34,56,43,.86) 100%);
}
.hero__caption { position: absolute; left: 0; right: 0; bottom: 0; padding-block: var(--space-m) calc(var(--space-m) + 1.6rem); }
.hero__caption-in { color: var(--paper); display: grid; gap: .55rem; justify-items: start; max-width: 100%; }
.hero__kicker {
  font-size: var(--step--1); font-weight: 800; letter-spacing: .14em; text-transform: uppercase;
  color: var(--paper); margin: 0;
}
.hero__title {
  font-family: var(--font-display); font-size: var(--step-3); line-height: 1.05; color: var(--paper);
  max-width: 18ch; margin: 0; font-weight: 400;
}
.hero__text { color: rgba(253,251,246,.92); max-width: 46ch; margin: 0; }
.hero__kicker, .hero__title, .hero__text { text-shadow: 0 1px 12px rgba(20,32,24,.45); }
.hero__cta { display: inline-flex; width: auto; margin-top: .5rem; text-shadow: none; }

/* strzałki w prawym dolnym rogu, żeby nigdy nie zasłaniały hasła */
.hero__nav {
  position: absolute; bottom: 1.1rem; z-index: 3;
  width: 44px; height: 44px; display: grid; place-items: center;
  background: var(--paper-92); border-radius: var(--radius-pill); color: var(--ink);
  transition: background var(--dur-fast) var(--ease);
}
.hero__nav:hover { background: var(--paper); }
.hero__nav svg { width: 23px; height: 23px; }
.hero__nav--prev { right: calc(clamp(.75rem, 2vw, 1.75rem) + 52px); }
.hero__nav--next { right: clamp(.75rem, 2vw, 1.75rem); }
/* pasek kropek rozciąga się na całą szerokość, więc przepuszcza kliknięcia
   (inaczej przykrywa strzałki w prawym dolnym rogu) */
.hero__dots {
  position: absolute; left: 0; right: 0; bottom: .9rem; z-index: 3;
  display: flex; justify-content: center; gap: .45rem; pointer-events: none;
}
.hero__dot { pointer-events: auto; }
.hero__dot {
  width: 9px; height: 9px; border-radius: var(--radius-pill);
  background: rgba(253,251,246,.5); transition: all var(--dur-fast) var(--ease);
}
.hero__dot.is-active { background: var(--honey); width: 26px; }
@media (max-width: 640px) {
  .hero__media { height: clamp(340px, 56vh, 460px); }
  .hero__nav { width: 38px; height: 38px; }
  .hero__title { font-size: var(--step-2); }
}

/* --------------------------------------------------- skróty kategorii ----- */
.catstrip { padding-block: var(--space-m); border-bottom: 1px solid var(--line); }
.catstrip__row { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: var(--space-s); }
.catstrip__item {
  display: flex; align-items: center; gap: .9rem; padding: .6rem .9rem .6rem .6rem;
  background: var(--card); border: 1px solid var(--line); border-radius: var(--radius);
  text-decoration: none; color: var(--ink);
  transition: border-color var(--dur-fast) var(--ease), transform var(--dur-fast) var(--ease), box-shadow var(--dur-fast) var(--ease);
}
.catstrip__item:hover { border-color: var(--honey); transform: translateY(-2px); box-shadow: var(--lift); }
.catstrip__media { flex: none; width: 56px; height: 56px; border-radius: var(--radius-sm); overflow: hidden; background: var(--honey-soft); }
.catstrip__media img { width: 100%; height: 100%; object-fit: cover; }
.catstrip__label { font-family: var(--font-display); font-size: var(--step-1); line-height: 1.1; min-width: 0; }
.catstrip__count { margin-left: auto; font-size: var(--step--1); color: var(--ink-soft); white-space: nowrap; }
/* licznik mieści się dopiero przy szerokim ekranie; niżej same nazwy kategorii */
@media (max-width: 1200px) { .catstrip__count { display: none; } }
@media (max-width: 860px) {
  .catstrip__row { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 520px) {
  .catstrip__label { font-size: var(--step-0); }
  .catstrip__media { width: 44px; height: 44px; }
}

/* -------------------------------------------------- karuzela produktowa --- */
.rail-sec { padding-block: var(--space-l); }
.rail-sec:nth-of-type(even) { background: var(--paper-warm); }
.rail__head {
  display: flex; flex-wrap: wrap; align-items: flex-end; justify-content: space-between;
  gap: var(--space-s) var(--space-m); margin-bottom: var(--space-m);
}
.rail__title { min-width: min(100%, 20rem); flex: 1; }
.rail__title h2 { font-size: var(--step-2); margin-top: .2rem; }
.rail__lead { color: var(--ink-soft); max-width: 62ch; margin-top: .5rem; }
.rail__all { flex: none; white-space: nowrap; }
@media (max-width: 560px) {
  .rail__ctrl { width: 100%; }
  .rail__all { flex: 1; justify-content: center; }
}
.rail { position: relative; }
/* padding + scroll-padding: bez tego scroll-snap dosuwa pierwszą kartę do krawędzi ekranu */
.rail__track {
  --rail-edge: max(1.15rem, calc((100vw - var(--container)) / 2 + 2.5rem));
  display: flex; gap: var(--space-s); overflow-x: auto; scroll-snap-type: x proximity;
  scroll-behavior: smooth; padding-inline: var(--rail-edge); scroll-padding-inline: var(--rail-edge);
  padding-block: .5rem 1rem; scrollbar-width: none; -ms-overflow-style: none;
}
.rail__track::-webkit-scrollbar { display: none; }
.rail__item { flex: 0 0 clamp(230px, 24vw, 285px); scroll-snap-align: start; display: flex; }
.rail__item > .pcard { width: 100%; }

/* strzałki obok nagłówka sekcji: nie zasłaniają produktów i są zawsze widoczne */
.rail__ctrl { display: flex; align-items: center; gap: .5rem; flex: none; }
.rail__nav {
  width: 46px; height: 46px; display: grid; place-items: center; flex: none;
  background: var(--paper); border: 1px solid var(--line-strong); border-radius: var(--radius-pill);
  color: var(--ink);
  transition: background var(--dur-fast) var(--ease), color var(--dur-fast) var(--ease), opacity var(--dur-fast) var(--ease);
}
.rail__nav:hover { background: var(--ink); color: var(--paper); border-color: var(--ink); }
.rail__nav svg { width: 24px; height: 24px; stroke-width: 1.8; }
.rail__nav[disabled] { opacity: .3; pointer-events: none; }
@media (max-width: 620px) { .rail__nav { display: none; } }

.railmore {
  display: flex; flex-direction: column; justify-content: center; gap: .5rem; width: 100%;
  padding: var(--space-m) 1.2rem; text-decoration: none; color: var(--ink);
  background: var(--honey-soft); border: 1px solid var(--line); border-radius: var(--radius);
}
.railmore:hover { border-color: var(--honey); }
.railmore__ic svg { width: 26px; height: 26px; color: var(--amber); }
.railmore__t { font-family: var(--font-display); font-size: var(--step-1); line-height: 1.15; }
.railmore__s { font-size: var(--step--1); color: var(--ink-soft); }

/* ------------------------------------------------------ karta produktu ---- */
.pgrid {
  display: grid; gap: var(--space-s);
  grid-template-columns: repeat(auto-fill, minmax(232px, 1fr));
}
.pcard {
  display: flex; flex-direction: column; background: var(--card);
  border: 1px solid var(--line); border-radius: var(--radius); overflow: hidden;
  transition: box-shadow var(--dur-fast) var(--ease), transform var(--dur-fast) var(--ease), border-color var(--dur-fast) var(--ease);
}
.pcard:hover { box-shadow: var(--lift); border-color: var(--line-strong); transform: translateY(-2px); }
/* równy kadr dla wszystkich produktów: zdjęcia mają różne proporcje,
   więc wpasowujemy je w kwadrat (nic nie przycinamy) */
.pcard__media { position: relative; display: block; background: var(--card); aspect-ratio: 1 / 1; overflow: hidden; }
.pcard__media img {
  position: absolute; inset: 0; width: 100%; height: 100%;
  object-fit: contain; object-position: center;
  transition: transform var(--dur-slow) var(--ease);
}
.pcard:hover .pcard__media img { transform: scale(1.035); }
.pcard__body { display: flex; flex-direction: column; gap: .45rem; padding: .9rem 1rem 1rem; flex: 1; }
/* stała wysokość nazwy: dzięki temu ceny i przyciski stoją w jednej linii w całym rzędzie */
.pcard__name {
  font-family: var(--font-display); font-size: var(--step-1); line-height: 1.15;
  display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden;
  min-height: 2.3em;
}
.pcard__name a { text-decoration: none; }
.pcard__name a:hover { color: var(--amber); }
.pcard__desc {
  font-size: var(--step--1); color: var(--ink-soft); line-height: 1.45;
  display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden;
  min-height: 2.6em; max-width: none;
}
.pcard__weights { display: flex; flex-wrap: wrap; gap: .3rem; margin-top: .1rem; }
.wchip {
  font-size: .8rem; font-weight: 700; padding: .3rem .55rem; border-radius: var(--radius-pill);
  border: 1px solid var(--line); color: var(--ink-soft); background: var(--paper);
  transition: all var(--dur-fast) var(--ease);
}
.wchip:hover { border-color: var(--honey); color: var(--ink); }
.wchip.is-active { background: var(--ink); border-color: var(--ink); color: var(--paper); }
.pcard__single { font-size: .8rem; font-weight: 700; color: var(--ink-soft); margin: .1rem 0; }
.pcard__foot { margin-top: auto; padding-top: .7rem; display: grid; gap: .55rem; }
.pcard__price { font-family: var(--font-display); font-size: var(--step-2); line-height: 1; color: var(--ink); margin: 0; }
.pcard__add { width: 100%; justify-content: center; padding: .7em 1em; font-size: var(--step--1); }
.pcard__add svg { width: 1.05em; height: 1.05em; }

/* ---------------------------------------------------- pasek zaufania ------ */
.tshop { background: var(--paper-warm); padding-block: var(--space-m); }
.rail-sec + .tshop { border-top: 1px solid var(--line); }
.tshop__row { display: grid; grid-template-columns: repeat(4, 1fr); gap: var(--space-m); }
.tshop__item { display: flex; gap: .8rem; align-items: flex-start; }
.tshop__ic { flex: none; display: grid; place-items: center; width: 40px; height: 40px;
  border-radius: var(--radius-pill); background: var(--honey-soft); color: var(--amber); }
.tshop__ic svg { width: 21px; height: 21px; }
.tshop__t { font-family: var(--font-body); font-size: var(--step-0); font-weight: 700; line-height: 1.3; }
.tshop__x { font-size: var(--step--1); color: var(--ink-soft); line-height: 1.45; max-width: none; }
@media (max-width: 900px) { .tshop__row { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 520px) { .tshop__row { grid-template-columns: 1fr; } }

/* ------------------------------------------------ opinie i bezpieczeństwo - */
.sp__head { margin-bottom: var(--space-m); }

/* opinie kupujących: treści wklejane z panelu sprzedawcy, bez odesłań na zewnątrz */
.rev__list {
  display: grid; grid-template-columns: repeat(auto-fit, minmax(270px, 1fr));
  gap: var(--space-s); list-style: none; padding: 0; margin: 0 0 var(--space-m);
}
.rev__item {
  display: grid; gap: .6rem; align-content: start; padding: var(--space-s) var(--space-m) var(--space-m);
  background: var(--card); border: 1px solid var(--line); border-left: 3px solid var(--honey);
  border-radius: var(--radius); box-shadow: var(--lift);
}
.rev__stars { display: inline-flex; gap: .12rem; color: var(--honey); }
.rev__stars svg { width: 19px; height: 19px; }
.rev__text {
  font-family: var(--font-display); font-size: var(--step-1); line-height: 1.35;
  color: var(--ink); margin: 0; quotes: "„" "”";
}
.rev__text::before { content: open-quote; }
.rev__text::after { content: close-quote; }
.rev__by { font-size: var(--step--1); color: var(--ink-soft); }
.sp__facts { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: var(--space-m); }
@media (max-width: 1000px) { .sp__facts { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
.sp__fact { display: flex; gap: .8rem; }
.sp__ic { flex: none; display: grid; place-items: center; width: 38px; height: 38px;
  border-radius: var(--radius-pill); background: var(--honey-soft); color: var(--amber); }
.sp__ic svg { width: 20px; height: 20px; }
.sp__fact strong { display: block; font-size: var(--step-0); }
.sp__fact span { font-size: var(--step--1); color: var(--ink-soft); line-height: 1.45; }
.sp__quotes { display: grid; grid-template-columns: repeat(auto-fit, minmax(260px, 1fr)); gap: var(--space-s); margin-top: var(--space-m); list-style: none; padding: 0; }
.sp__quote { background: var(--card); border: 1px solid var(--line); border-radius: var(--radius); padding: var(--space-s); }
.sp__quote footer { margin-top: .6rem; font-size: var(--step--1); color: var(--ink-soft); }
@media (max-width: 560px) { .sp__facts { grid-template-columns: 1fr; } }

/* ------------------------------------------------------ krótka historia --- */
.hstory__head { display: grid; grid-template-columns: minmax(260px, 1fr) 1.2fr; gap: var(--space-m); align-items: end; margin-bottom: var(--space-m); }
.hstory__lead { color: var(--ink-soft); max-width: 60ch; }
.hstory__grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--space-s); }
.hstory__card { margin: 0; background: var(--card); border: 1px solid var(--line); border-radius: var(--radius); overflow: hidden; }
.hstory__card img { width: 100%; aspect-ratio: 4 / 3; object-fit: cover; }
.hstory__card figcaption {
  padding: .85rem 1rem 1.1rem; font-family: var(--font-body); font-style: normal;
  font-size: var(--step--1); color: var(--ink-soft); line-height: 1.5;
}
.hstory__card figcaption strong { display: block; font-family: var(--font-display); font-size: var(--step-1); color: var(--ink); font-weight: 400; margin-bottom: .2rem; }
.hstory__more { margin-top: var(--space-m); }
@media (max-width: 980px) { .hstory__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 820px) { .hstory__head { grid-template-columns: 1fr; } }
@media (max-width: 560px) { .hstory__grid { grid-template-columns: 1fr; } }

/* --------------------------------------------------------------- koszyk --- */
.cart__panel { width: min(460px, 96vw); background: var(--paper); display: flex; flex-direction: column; }
.cart__head { border-bottom: 1px solid var(--line); }
.cart__free { padding: .8rem var(--space-m); background: var(--honey-soft); display: grid; gap: .45rem; }
.cart__free[hidden] { display: none; }
.cart__free-txt { font-size: var(--step--1); font-weight: 600; margin: 0; max-width: none; }
.cart__free-txt strong { color: var(--amber); }
.cart__free-bar { display: block; height: 6px; border-radius: var(--radius-pill); background: rgba(34,56,43,.12); overflow: hidden; }
.cart__free-fill { display: block; height: 100%; width: 0; border-radius: var(--radius-pill); background: var(--honey); transition: width var(--dur-mid) var(--ease); }
.cart__body { flex: 1; }
.cart__empty { display: grid; gap: .8rem; justify-items: start; }

.cart__item {
  display: grid; grid-template-columns: 62px 1fr auto; gap: .5rem .8rem; align-items: start;
  padding-bottom: .9rem; border-bottom: 1px solid var(--line);
}
.cart__i-img { grid-row: span 2; width: 62px; height: 62px; object-fit: cover; border-radius: var(--radius-sm); background: var(--honey-soft); }
.cart__i-main { display: grid; gap: .25rem; }
.cart__i-name { font-family: var(--font-display); font-size: var(--step-0); line-height: 1.2; }
.cart__i-w { font-size: var(--step--1); }
.cart__i-sel {
  font-size: .8rem; font-weight: 600; padding: .22rem .4rem; border: 1px solid var(--line);
  border-radius: var(--radius-sm); background: var(--card); color: var(--ink); max-width: 100%;
}
.cart__i-row { grid-column: 2 / -1; display: flex; align-items: center; justify-content: space-between; gap: .6rem; }
.cart__i-qty { display: inline-flex; align-items: center; gap: .1rem; border: 1px solid var(--line); border-radius: var(--radius-pill); padding: .1rem; }
.cart__i-qty button { width: 26px; height: 26px; border: 0; border-radius: var(--radius-pill); display: grid; place-items: center; color: var(--ink); }
.cart__i-qty button:hover { background: var(--honey-soft); }
.cart__i-qty span { min-width: 1.6rem; text-align: center; font-weight: 700; font-size: var(--step--1); }
.cart__i-price { font-family: var(--font-display); font-size: var(--step-1); white-space: nowrap; }
.cart__i-del { justify-self: end; align-self: start; color: var(--ink-soft); font-size: 1.25rem; line-height: 1; padding: .1rem .3rem; }
.cart__i-del:hover { color: var(--amber-deep); }

.cart__sums { display: grid; gap: .35rem; margin: 0; }
.cart__sums > div { display: flex; align-items: baseline; justify-content: space-between; gap: 1rem; }
.cart__sums dt { color: var(--ink-soft); font-size: var(--step--1); }
.cart__sums dd { margin: 0; font-weight: 600; }
.cart__sum-total { padding-top: .5rem; border-top: 1px solid var(--line); }
.cart__sum-total dt { font-size: var(--step-0); color: var(--ink); font-weight: 700; }
.cart__sum-total dd { font-family: var(--font-display); font-size: var(--step-2); }
.cart__next { justify-content: center; }
.cart__back { justify-content: center; }
.cart__checkout { overflow-y: auto; padding: var(--space-s) var(--space-m) var(--space-m); }
.cart__checkout[hidden] { display: none; }
.checkout { display: grid; gap: var(--space-s); }
.checkout__block { border: 0; padding: 0; margin: 0; display: grid; gap: .6rem; }
.checkout__block legend {
  font-family: var(--font-body); font-size: var(--step--1); font-weight: 800;
  text-transform: uppercase; letter-spacing: .1em; color: var(--ink-soft); margin-bottom: .3rem;
}
.field2 { display: grid; grid-template-columns: 1fr 1fr; gap: .6rem; }
.opts { display: grid; gap: .4rem; }
.opt {
  display: flex; align-items: center; gap: .7rem; padding: .65rem .8rem; cursor: pointer;
  border: 1px solid var(--line); border-radius: var(--radius); background: var(--card);
}
.opt:has(input:checked) { border-color: var(--honey); background: var(--honey-soft); }
.opt input { accent-color: var(--amber); flex: none; }
.opt__b { display: grid; }
.opt__l { font-weight: 600; font-size: var(--step--1); }
.opt__n { font-size: .78rem; color: var(--ink-soft); }
.opt__p { margin-left: auto; font-weight: 700; font-size: var(--step--1); white-space: nowrap; }
.cart__phone { display: inline-flex; align-items: center; justify-content: center; gap: .4rem; }
.cart__phone svg { width: 1em; height: 1em; }

/* ---------------------------------------- potwierdzenie zamówienia -------- */
.cart__done {
  padding: var(--space-m); display: grid; gap: .8rem; justify-items: start; align-content: start;
  overflow-y: auto;
}
.cart__done-ic {
  display: grid; place-items: center; width: 52px; height: 52px; border-radius: var(--radius-pill);
  background: var(--honey); color: var(--ink);
}
.cart__done-ic svg { width: 28px; height: 28px; }
.cart__done h3 { font-size: var(--step-2); }
.cart__done p { color: var(--ink-soft); }
.cart__done-sum { font-weight: 700; color: var(--ink); }
.cart__done .btn { margin-top: .4rem; }

/* komunikat po wysłaniu formularza kontaktowego lub hurtowego */
.form__status {
  margin-top: .6rem; padding: .7rem .9rem; border-radius: var(--radius);
  font-size: var(--step--1); background: var(--honey-soft); border: 1px solid var(--line);
}
.form__status.is-ok { border-color: var(--honey); }

/* ---------------------------------------------------- strona 404 ---------- */
.nf__inner { max-width: 46rem; }
.nf__cta { display: flex; flex-wrap: wrap; gap: .8rem; margin-top: var(--space-m); }
.nf__phone { margin-top: var(--space-s); color: var(--ink-soft); }

/* ------------------------------------------------------ potwierdzenie ----- */
.toast {
  position: fixed; z-index: 250; right: clamp(.75rem, 3vw, 1.5rem); bottom: clamp(.75rem, 3vw, 1.5rem);
  display: flex; align-items: center; gap: .8rem; max-width: min(380px, 92vw);
  padding: .8rem 1rem; background: var(--ink); color: var(--paper);
  border-radius: var(--radius); box-shadow: var(--lift-strong);
  transform: translateY(14px); opacity: 0; transition: opacity var(--dur-fast) var(--ease), transform var(--dur-fast) var(--ease);
}
.toast[hidden] { display: none; }
.toast.is-open { opacity: 1; transform: none; }
.toast__ic { display: grid; place-items: center; width: 30px; height: 30px; flex: none;
  border-radius: var(--radius-pill); background: var(--honey); color: var(--ink); }
.toast__ic svg { width: 18px; height: 18px; }
.toast__body { display: grid; line-height: 1.3; font-size: var(--step--1); }
.toast__body strong { font-weight: 700; }
.toast__body span { color: rgba(253,251,246,.75); }
.toast__go {
  margin-left: auto; flex: none; color: var(--pollen); font-weight: 700; font-size: var(--step--1);
  text-decoration: underline; text-underline-offset: .2em;
}

/* ------------------------------------------------------ strony kolekcji --- */
.coll-hero { padding-block: var(--space-l) var(--space-m); }
.coll-hero__intro { color: var(--ink-soft); }
.shop__filter { display: flex; flex-wrap: wrap; gap: .5rem; margin-bottom: var(--space-m); }
.shop__f {
  display: inline-flex; align-items: center; gap: .4rem; padding: .5rem .9rem;
  border: 1px solid var(--line); border-radius: var(--radius-pill);
  font-size: var(--step--1); font-weight: 700; color: var(--ink-soft); background: var(--card);
  transition: all var(--dur-fast) var(--ease);
}
.shop__f span { font-weight: 600; opacity: .7; }
.shop__f:hover { border-color: var(--honey); color: var(--ink); }
.shop__f.is-active { background: var(--ink); border-color: var(--ink); color: var(--paper); }

/* ------------------------------------------------------- strona produktu -- */
.pd__weights .wopt { border-radius: var(--radius); }
.pd__price { color: var(--ink); }
/* ten sam miodowy przycisk co na kartach (stara reguła dawała ciemny brąz) */
.add-btn--lg, .btn--primary.add-btn--lg {
  background: var(--honey); color: var(--ink); border-color: var(--honey); font-weight: 700;
}
.add-btn--lg:hover, .btn--primary.add-btn--lg:hover {
  background: var(--honey-deep); border-color: var(--honey-deep); color: var(--ink);
}
.pd__ship { display: grid; gap: .35rem; margin-top: .9rem; padding-top: .9rem; border-top: 1px solid var(--line); }
.pd__ship li { display: flex; align-items: center; gap: .5rem; font-size: var(--step--1); color: var(--ink-soft); }
.pd__ship svg { width: 18px; height: 18px; color: var(--amber); flex: none; }

/* --------------------------------------------------------------- stopka --- */
/* pięć kolumn: marka, strona, kontakt, sklep, zakupy (wcześniej piąta spadała pod markę) */
.footer__grid { grid-template-columns: 1.5fr 1fr 1.2fr 1.1fr 1.1fr; }
.footer__brand { align-self: start; }
.footer__brand .brand__logo { height: 64px; }
.footer__motto { margin-top: .9rem; }
@media (max-width: 1100px) { .footer__grid { grid-template-columns: 1fr 1fr 1fr; } }
@media (max-width: 760px) { .footer__grid { grid-template-columns: 1fr 1fr; } }
@media (max-width: 460px) { .footer__grid { grid-template-columns: 1fr; } }

/* ══════════════════════════════════ TELEFON: wygoda obsługi palcem ════════ */
/* Cele dotykowe mają mieć co najmniej 44 px, tak jak zaleca Apple i WCAG.
   Reguły dotyczą też tabletów i każdego ekranu obsługiwanego dotykiem. */
@media (max-width: 900px), (pointer: coarse) {
  .nav__toggle { min-width: 46px; min-height: 46px; justify-content: center; }
  .nav__ic, .nav__ic.nav__cart { min-width: 46px; min-height: 46px; justify-content: center; }
  .topbar__tel { min-height: 44px; display: inline-flex; align-items: center; padding-inline: .25rem; }

  /* przyciski i linki produktowe: pełnowymiarowe cele dotykowe */
  .btn, .pcard__add, .rail__all { min-height: 46px; }
  .pcard__name a { display: inline-flex; align-items: center; min-height: 44px; }
  .hero__nav { width: 46px; height: 46px; }
  .hero__dot { height: 44px; }

  /* wybór gramatury i ilości */
  .wchip { min-height: 44px; min-width: 44px; padding: .55rem .75rem; justify-content: center; }
  .qty__btn { min-width: 44px; min-height: 44px; }
  .qty__in { min-height: 44px; }
  .pd__thumb { min-width: 64px; min-height: 64px; }

  /* koszyk */
  .cart__i-qty button { width: 38px; height: 38px; }
  .cart__i-del { min-width: 40px; min-height: 40px; display: grid; place-items: center; font-size: 1.5rem; }
  .cart__close { min-width: 44px; min-height: 44px; display: grid; place-items: center; }
  .cart__i-sel { min-height: 40px; }
  .field2 { grid-template-columns: 1fr; }        /* telefon i e-mail jeden pod drugim */

  /* listy linków: powiększony obszar kliknięcia bez zmiany wyglądu */
  .footer__list a, .menu__foot a, .breadcrumb a, .crosslink,
  .search__hint button, .footer__base a, .contact__list a, .eyebrow a,
  .pd__phone, .cart__phone, .link-arrow { display: inline-flex; align-items: center; min-height: 44px; }
  .footer__list { gap: .1rem; }
  .tel-xl, .footer__contact .tel { min-height: 48px; display: inline-flex; align-items: center; }

  /* kropki karuzeli: mały znacznik, duży obszar dotyku */
  .hero__dots { gap: 0; bottom: .5rem; }
  .hero__dot {
    width: 44px; height: 44px; background: none; border-radius: 0;
    display: grid; place-items: center; position: relative;
  }
  .hero__dot::after {
    content: ""; width: 9px; height: 9px; border-radius: var(--radius-pill);
    background: rgba(253,251,246,.55); transition: all var(--dur-fast) var(--ease);
  }
  .hero__dot.is-active { background: none; width: 48px; }
  .hero__dot.is-active::after { background: var(--honey); width: 22px; }

  /* pasek filtrów w sklepie */
  .shop__f { min-height: 44px; }
}

/* na telefonie zdjęcia przewija się palcem, więc strzałki tylko zabierałyby miejsce */
@media (max-width: 700px) {
  .hero__nav { display: none; }
  .hero__dots { bottom: .35rem; }
}

/* listy produktów na telefonie: dwie kolumny zamiast jednej,
   czyli o połowę krótsze przewijanie przy 31 pozycjach */
@media (max-width: 640px) {
  .pgrid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .65rem; }
  .pgrid .pcard__body { padding: .7rem .7rem .8rem; gap: .35rem; }
  .pgrid .pcard__name { font-size: var(--step-0); min-height: 2.5em; }
  .pgrid .pcard__desc { -webkit-line-clamp: 2; min-height: 2.5em; font-size: .78rem; }
  .pgrid .pcard__price { font-size: var(--step-1); }
  /* w wąskiej karcie chipy muszą zmieścić się w jednym rzędzie, inaczej karty „skaczą” */
  .pgrid .pcard__weights { flex-wrap: nowrap; gap: .25rem; }
  .pgrid .wchip {
    font-size: .72rem; padding: .45rem .35rem; min-width: 0; flex: 1;
    min-height: 40px; border-radius: var(--radius-sm);
  }
  .pgrid .pcard__add { font-size: .78rem; padding: .6em .5em; gap: .35em; }
  .pgrid .pcard__add-long { display: none; }        /* „do koszyka” zamiast „Dodaj do koszyka” */
  .pgrid .pcard__add svg { width: 1em; height: 1em; }
}

/* obszar bezpieczny iPhone'a: element przyklejony do dołu nie chowa się pod paskiem */
.toast { bottom: calc(clamp(.75rem, 3vw, 1.5rem) + env(safe-area-inset-bottom, 0px)); }
.cart__panel { padding-bottom: env(safe-area-inset-bottom, 0px); }
.menu { padding-bottom: calc(var(--space-m) + env(safe-area-inset-bottom, 0px)); }

/* ------------------------------------------------------------ drobiazgi --- */
.section--warm { background: var(--paper-warm); }
.deco-bg { opacity: .05; }
.atlas__flora { opacity: .5; }
/* rycina w nagłówku kolekcji bywała przycięta na krawędzi ekranu */
.coll-hero__deco { display: none; }
@media (prefers-reduced-motion: reduce) {
  .hero__track, .rail__track { scroll-behavior: auto; }
}


/* ═══════════════════════ miodowe akcenty (życzenie właściciela) ═══════════ */
/* ikony w kółkach: pełny miodowy krążek z ciemnym symbolem */
.tshop__ic, .sp__ic, .railmore__ic {
  background: var(--honey); color: var(--ink);
}
.railmore__ic {
  display: grid; place-items: center; width: 42px; height: 42px; border-radius: var(--radius-pill);
}
.railmore { background: var(--card); }
.railmore:hover { background: var(--honey-soft); }

/* paski i sekcje pomocnicze na ciepłym miodzie zamiast szarego kremu */
.tshop { background: var(--honey-soft); border-block: 1px solid var(--line); }
.catstrip__media { background: var(--honey-soft); }

/* nagłówki sekcji: numer i kreska w miodzie */
.sec-head__num { color: var(--amber); }
.sec-head__rule { background: var(--honey); opacity: 1; }
.eyebrow { color: var(--amber); }
.hero__kicker { color: var(--paper); }          /* wyjątek: na zdjęciu liczy się czytelność */
.rail__title .eyebrow { color: var(--amber); }

/* wybrana gramatura: miodowa zamiast ciemnozielonej */
.wchip.is-active { background: var(--honey); border-color: var(--honey-deep); color: var(--ink); }

/* akordeon i drobne ikony kierunkowe */
.faq__mark { color: var(--amber); }
.faq__item summary:hover { color: var(--amber-deep); }
.link-arrow svg, .crosslink__ic { color: var(--amber); }
.pd__badge { background: var(--honey-soft); border-color: var(--honey); }
.shop__f.is-active { background: var(--honey); border-color: var(--honey-deep); color: var(--ink); }
.search__hint button { color: var(--amber-deep); }
.tshop__t { color: var(--ink); }

/* Wariant chwilowo niedostępny w sklepie. Zostaje widoczny, tylko przygaszony:
   znikające produkty czyta się jak błąd strony, a nie jak brak towaru. */
.wchip[data-brak] { opacity: .45; text-decoration: line-through; }
.wopt.is-brak { opacity: .5; }
.wopt.is-brak .wopt__p::after { content: " (brak)"; font-size: .8em; }

/* Karty z panelu obsługi: ten sam język wizualny co karty produktów, tylko bez
   odnośnika do podstrony (te pozycje nie mają własnej podstrony). */
.pcard--offer .pcard__media--static { display: block; aspect-ratio: 1; overflow: hidden; background: var(--paper); }
.pcard--offer .pcard__media--static img { width: 100%; height: 100%; object-fit: contain; }
.pcard__kicker { margin: 0 0 .15rem; font-size: .72rem; letter-spacing: .06em; text-transform: uppercase; color: var(--amber); font-weight: 700; }
.offer-sec .pgrid { margin-top: .25rem; }
/* Nazwy pozycji z panelu bywają dłuższe od nazw produktów katalogowych
   („Zestaw prezentowy: miód lipowy i olej lniany”), więc dajemy im trzeci
   wiersz zamiast ucinać w połowie słowa. */
.pcard--offer .pcard__name { -webkit-line-clamp: 3; min-height: 0; }
.pcard--offer .pcard__desc { -webkit-line-clamp: 3; min-height: 0; }

/* Informacja o wyrównaniu cen do sklepu. Pokazuje się tylko wtedy, gdy suma
   faktycznie się zmieniła między dodaniem do koszyka a zamówieniem. */
.cart__cena-info {
  margin: 0 1.25rem .75rem; padding: .6rem .8rem;
  background: var(--honey-soft); border: 1px solid var(--honey);
  border-radius: 10px; font-size: .85rem; line-height: 1.4; color: var(--ink);
}

/* ── Media społecznościowe ─────────────────────────────────────────────────── */
.socials { display: flex; gap: .5rem; margin-top: 1rem; }
.socials__ic {
  display: inline-flex; align-items: center; justify-content: center;
  width: 40px; height: 40px; border-radius: 50%;
  background: rgba(255,255,255,.1); color: #fff;
  border: 1px solid rgba(255,255,255,.22); transition: background .18s ease, transform .18s ease;
}
.socials__ic:hover { background: var(--honey); border-color: var(--honey); color: var(--ink); transform: translateY(-2px); }
.socials__ic svg { width: 20px; height: 20px; }
.socials__ic--wa:hover { background: #25D366; border-color: #25D366; color: #fff; }
/* wariant jasny (na kontakcie, na papierze) */
.socials--ink .socials__ic { background: var(--paper-warm); color: var(--ink); border-color: var(--line-strong); }
.socials--ink .socials__ic:hover { background: var(--honey); border-color: var(--honey); }

/* ── Pływający przycisk WhatsApp ────────────────────────────────────────────── */
.wa-fab {
  position: fixed; right: 1rem; bottom: calc(1rem + env(safe-area-inset-bottom, 0));
  z-index: 60; display: inline-flex; align-items: center; gap: .5rem;
  padding: .7rem .95rem; border-radius: var(--radius-pill, 999px);
  background: #25D366; color: #fff; font-weight: 700; font-size: .95rem;
  box-shadow: 0 8px 24px rgba(0,0,0,.22); text-decoration: none;
  transition: transform .18s ease, box-shadow .18s ease;
}
.wa-fab:hover { transform: translateY(-2px); box-shadow: 0 12px 30px rgba(0,0,0,.28); color: #fff; }
.wa-fab__ic { display: inline-flex; }
.wa-fab__ic svg { width: 24px; height: 24px; }
.wa-fab__txt { white-space: nowrap; }
@media (max-width: 560px) {
  .wa-fab { right: .75rem; bottom: calc(.75rem + env(safe-area-inset-bottom, 0)); padding: .8rem; }
  .wa-fab__txt { display: none; }
  .wa-fab__ic svg { width: 26px; height: 26px; }
}
@media (prefers-reduced-motion: reduce) { .wa-fab, .socials__ic { transition: none; } }

/* ── Notka o badaniu olejów ─────────────────────────────────────────────────── */
.labtest {
  display: flex; gap: 1rem; align-items: flex-start;
  padding: 1.25rem 1.4rem; background: var(--honey-soft);
  border: 1px solid var(--honey); border-radius: var(--radius, 12px);
}
.labtest__ic {
  flex: none; display: inline-flex; align-items: center; justify-content: center;
  width: 46px; height: 46px; border-radius: 50%; background: var(--honey); color: var(--ink);
}
.labtest__ic svg { width: 24px; height: 24px; }
.labtest__t { margin: 0 0 .25rem; font-size: 1.15rem; }
.labtest__x { margin: 0; color: var(--ink-soft); }

/* ── Strony prawne (regulamin, polityka) ───────────────────────────────────── */
.legal-hero { padding-top: var(--space-l); }
.legal__body { max-width: 780px; }
.legal__sec { margin-bottom: 1.75rem; }
.legal__sec h2 { font-size: 1.25rem; margin: 0 0 .5rem; }
.legal__sec p { margin: 0 0 .6rem; color: var(--ink-soft); line-height: 1.6; }

/* ── Social media na górnym pasku (dobrze widoczne, każda podstrona) ───────── */
.topbar__soc { display: inline-flex; align-items: center; opacity: .9; }
.topbar__soc svg { width: 16px; height: 16px; }
.topbar__soc:hover { opacity: 1; color: var(--honey); }
@media (max-width: 900px), (pointer: coarse) {
  /* nadpisz ukrycie linków: ikony social zostają widoczne na telefonie */
  .topbar__links a.topbar__soc { display: inline-flex !important; min-height: 44px; align-items: center; }
  .topbar__links { gap: .55rem; }
  .topbar__soc svg { width: 18px; height: 18px; }
}