/* ============================================================
   STRONA PRODUKTU (single) — Herbarium · Partia 4 (restyle hero/buy-box)
   Scoped pod .sp-woo-main. Lower sekcje (opinie/related/faq) — kolejny krok.
   ============================================================ */
.sp-woo-main {
  --ink:#2c2a26; --muted:#7c7a76; --soft:#525252;
  --pink:#c97b8a; --green:#4a7c5f; --green-ink:#2d5a3d;
  --cream:#faf8f5; --cream-2:#f0eae0; --sand:#e8d5c0; --line:#e7e7e7;
  font-family:"Jost",sans-serif; color:var(--ink);
}
.sp-woo-main .container { width:100%; max-width:1240px; margin-inline:auto; padding-inline:24px; }
.sp-woo-main * , .sp-woo-main *::before, .sp-woo-main *::after { box-sizing:border-box; }

/* ── Layout hero ── */
.sp-woo-main .sp-wrap { padding:24px 0 56px; }
.sp-woo-main .sp-upper { display:grid; grid-template-columns:1fr 1fr; gap:48px; align-items:flex-start; }

/* ── Galeria ── */
.sp-woo-main .sp-gallery { position:sticky; top:24px; display:flex; flex-direction:column; gap:12px; }
.sp-woo-main .sp-gallery__main { position:relative; aspect-ratio:1; border:0; padding:0; width:100%; border-radius:8px; overflow:hidden; background:var(--cream); cursor:zoom-in; }
.sp-woo-main .sp-gallery__main img { width:100%; height:100%; object-fit:cover; display:block; }
.sp-woo-main .sp-gallery__thumbs { display:grid; grid-template-columns:1fr 1fr; gap:12px; }
.sp-woo-main .sp-thumb { position:relative; width:100%; aspect-ratio:1; padding:0; border:1px solid var(--cream-2); border-radius:8px; overflow:hidden; background:var(--cream); cursor:zoom-in; transition:border-color .15s; }
.sp-woo-main .sp-thumb:hover { border-color:var(--green); }
.sp-woo-main .sp-thumb img, .sp-woo-main .sp-thumb--video video { width:100%; height:100%; object-fit:cover; display:block; }

/* Mobilny slider — domyślnie ukryty (desktop: main + miniatury) */
.sp-woo-main .sp-gallery__slider { display:none; }

/* Overlay ▶ na slajdach/miniaturach z wideo */
.sp-woo-main .sp-gallery__slide--video, .sp-woo-main .sp-thumb--video { position:relative; }
.sp-woo-main .sp-gallery__play {
  position:absolute; top:50%; left:50%; transform:translate(-50%,-50%);
  width:56px; height:56px; border-radius:50%; background:rgba(0,0,0,.55); color:#fff;
  display:inline-flex; align-items:center; justify-content:center; pointer-events:none;
}
.sp-woo-main .sp-thumb--video .sp-thumb__video-label {
  position:absolute; bottom:8px; right:8px; display:inline-flex; align-items:center; gap:4px;
  padding:4px 8px; border-radius:6px;
  background:rgba(0,0,0,.55); color:#fff; font-size:10px; font-weight:600; letter-spacing:.08em; text-transform:uppercase; pointer-events:none;
}
.sp-woo-main .sp-thumb--video .sp-thumb__video-label svg { width:12px; height:12px; }

/* ── Lightbox galerii ── */
.sp-lightbox { position:fixed; inset:0; z-index:2000; display:flex; align-items:center; justify-content:center; padding:24px; background:rgba(15,18,30,.92); }
.sp-lightbox[hidden] { display:none; }
.sp-lightbox__stage { margin:0; max-width:92vw; max-height:88vh; display:flex; align-items:center; justify-content:center; }
.sp-lightbox__stage img { max-width:92vw; max-height:88vh; object-fit:contain; display:block; border-radius:8px; }
.sp-lightbox__stage video { width:auto; height:auto; max-width:92vw; max-height:88vh; object-fit:contain; display:block; border-radius:8px; background:#000; }
.sp-lightbox__stage img[hidden], .sp-lightbox__stage video[hidden] { display:none; }
.sp-lightbox__stage #sp-lightbox-embed { width:min(92vw,1100px); aspect-ratio:16/9; }
.sp-lightbox__stage #sp-lightbox-embed[hidden] { display:none; }
.sp-lightbox__stage #sp-lightbox-embed iframe { width:100%; height:100%; border:0; border-radius:8px; background:#000; }
.sp-lightbox__close, .sp-lightbox__nav { position:absolute; display:inline-flex; align-items:center; justify-content:center; background:rgba(255,255,255,.12); color:#fff; border:none; border-radius:50%; cursor:pointer; transition:background .2s; }
.sp-lightbox__close:hover, .sp-lightbox__nav:hover { background:rgba(255,255,255,.25); }
.sp-lightbox__close { top:20px; right:24px; width:44px; height:44px; }
.sp-lightbox__nav { top:50%; transform:translateY(-50%); width:52px; height:52px; }
.sp-lightbox__nav--prev { left:24px; }
.sp-lightbox__nav--next { right:24px; }
.sp-lightbox__counter { position:absolute; bottom:24px; left:50%; transform:translateX(-50%); color:#fff; font-size:14px; font-weight:600; letter-spacing:.04em; }

@media (max-width:880px) {
  .sp-woo-main .sp-gallery { position:static; }
  .sp-woo-main .sp-gallery__main, .sp-woo-main .sp-gallery__thumbs { display:none; }
  /* galeria na całą szerokość ekranu — odbijamy 24px paddingu .container */
  .sp-woo-main .sp-gallery__slider { display:flex; gap:12px; overflow-x:auto; scroll-snap-type:x mandatory; scrollbar-width:none; -webkit-overflow-scrolling:touch; margin-inline:-24px; padding-inline:0; }
  .sp-woo-main .sp-gallery__slider::-webkit-scrollbar { display:none; }
  .sp-woo-main .sp-gallery__slide { flex:0 0 88%; scroll-snap-align:center; aspect-ratio:1; border:0; padding:0; border-radius:8px; overflow:hidden; background:var(--cream); cursor:zoom-in; }
  .sp-woo-main .sp-gallery__slide img, .sp-woo-main .sp-gallery__slide video { width:100%; height:100%; object-fit:cover; display:block; }
  .sp-lightbox__nav { width:44px; height:44px; }
  .sp-lightbox__nav--prev { left:8px; }
  .sp-lightbox__nav--next { right:8px; }
}

/* ── Buy box ── */
.sp-woo-main .sp-info { display:flex; flex-direction:column; gap:20px; }
.sp-woo-main .sp-info-top { display:flex; align-items:center; justify-content:space-between; gap:16px; flex-wrap:wrap; margin-bottom:0; }
.sp-woo-main .sp-badges { display:flex; gap:8px; }
.sp-woo-main .sp-badge { display:inline-flex; align-items:center; padding:4px 10px; border-radius:8px; font-size:13px; font-weight:700; }
.sp-woo-main .sp-badge--label { background:var(--sand); color:var(--ink); }
.sp-woo-main .sp-badge--discount { background:var(--pink); color:#fff; }
.sp-woo-main .sp-meta-stats { display:flex; gap:16px; flex-wrap:wrap; }
.sp-woo-main .sp-meta-stat { display:inline-flex; align-items:center; gap:6px; font-size:13px; color:var(--muted); }
.sp-woo-main .sp-meta-stat--handmade { color:#2C2A26; font-weight:400; }

/* Odstępy w kolumnie .sp-info bazują na flex gap:20px — poniżej dociskamy
   ujemnym marginesem: badge→tytuł 8px, tytuł→dopisek 4px. */
.sp-woo-main .sp-title { font-family:"Playfair Display",serif; font-size:clamp(26px,3vw,32px); font-weight:700; line-height:1.2; margin:0; margin-top:-12px; color:var(--ink); }
.sp-woo-main .sp-short-desc { color:var(--muted); font-size:16px; line-height:1.6; margin-top:-16px; }
.sp-woo-main .sp-short-desc p { margin:0 0 8px; }

/* Cechy pod opisem — lista z ✓, odstęp 16px między pozycjami */
.sp-woo-main .sp-features { list-style:none; margin:0; padding:0; display:flex; flex-direction:column; gap:16px; }
.sp-woo-main .sp-feature { display:flex; align-items:center; gap:12px; font-family:var(--font-family-body, "Jost", sans-serif); font-size:var(--font-size-text-sm, 14px); font-weight:400; line-height:150%; letter-spacing:0; text-transform:uppercase; color:#2C2A26; }
.sp-woo-main .sp-feature__icon { width:22px; height:22px; color:var(--green-ink); flex-shrink:0; }

/* Buy-box — cena + ATC + wysyłka na tle #FAF8F5 */
.sp-woo-main .sp-buybox { display:flex; flex-direction:column; gap:16px; background:var(--cream); border-radius:12px; padding:24px; }

/* Cena */
.sp-woo-main .sp-price-wrap { display:flex; flex-direction:column; gap:6px; padding:0 !important; background:transparent !important; border:0 !important; border-radius:0 !important; }
.sp-woo-main .sp-price { font-size:30px; font-weight:700; color:var(--ink); line-height:1.1; }
.sp-woo-main .sp-price del { color:var(--muted); font-weight:400; font-size:18px; margin-left:10px; }
.sp-woo-main .sp-price ins { text-decoration:none; }
.sp-woo-main .sp-price-meta { display:flex; gap:16px; flex-wrap:wrap; font-size:13px; }
.sp-woo-main .sp-omnibus { margin:0; color:var(--muted); }
.sp-woo-main .sp-stock { display:inline-flex; align-items:center; gap:4px; margin:0; color:var(--green-ink); font-weight:500; }

/* Add to cart */
.sp-woo-main .sp-atc-wrap { display:flex; flex-direction:column; gap:12px; }
.sp-woo-main .sp-atc-wrap form.cart { display:flex; align-items:stretch; gap:12px; margin:0; flex-wrap:wrap; }
.sp-woo-main .sp-atc-wrap .quantity { display:inline-flex; align-items:center; border:1px solid var(--cream-2); border-radius:8px; overflow:hidden; }
.sp-woo-main .sp-atc-wrap .quantity input.qty { width:64px; height:52px; border:0; text-align:center; font-family:"Jost",sans-serif; font-size:16px; background:#fff; color:var(--ink); -moz-appearance:textfield; }
.sp-woo-main .sp-atc-wrap button.single_add_to_cart_button {
  flex:1; min-height:52px; display:inline-flex; align-items:center; justify-content:center; gap:10px;
  background:var(--pink) !important; color:#fff !important; border:0; border-radius:8px; padding:14px 24px;
  font-family:"Jost",sans-serif; font-size:14px; font-weight:400; text-transform:uppercase; letter-spacing:.02em; cursor:pointer;
  transition:background .18s;
}
.sp-woo-main .sp-atc-wrap button.single_add_to_cart_button:hover { background:#b96a79 !important; }

/* Nagłówek buy-boxa: cena (lewo) + wysyłka (prawy górny róg) */
.sp-woo-main .sp-buybox__head { display:flex; align-items:flex-start; justify-content:space-between; gap:16px; }
.sp-woo-main .sp-ship-inline { display:inline-flex; align-items:center; gap:6px; flex-shrink:0; color:var(--green-ink); font-size:12px; font-weight:500; text-transform:uppercase; letter-spacing:.04em; }
.sp-woo-main .sp-ship-inline svg { width:16px; height:16px; flex-shrink:0; }

/* Korzyści — biała karta z obramowaniem; odstęp od buy-boxa 24px (flex gap 20 + 4) */
.sp-woo-main .sp-benefits { display:flex; flex-direction:column; gap:12px; margin-top:4px; background:#fff; border:1px solid var(--line); border-radius:12px; padding:20px; }
.sp-woo-main .sp-benefits__title { margin:0; font-size:12px; font-weight:500; text-transform:uppercase; letter-spacing:.04em; color:var(--muted); }
.sp-woo-main .sp-benefit { display:flex; align-items:center; gap:10px; font-size:14px; text-transform:uppercase; letter-spacing:.02em; }
.sp-woo-main .sp-benefit__icon { width:22px; height:22px; color:var(--green-ink); flex-shrink:0; }
.sp-woo-main .sp-benefit strong { font-weight:400; }

/* Akordeony (reużywa .faq-* z main.js) — płaskie, rozdzielone liniami, etykiety UPPERCASE */
.sp-woo-main .sp-accordions { display:flex; flex-direction:column; gap:0; border-top:1px solid var(--line); }
.sp-woo-main .sp-accordions .faq-item { background:transparent; border-bottom:1px solid var(--line); border-radius:0; overflow:hidden; }
.sp-woo-main .sp-accordions .faq-question { width:100%; display:flex; align-items:center; justify-content:space-between; gap:16px; padding:18px 0; border:0; background:transparent; cursor:pointer; font-family:"Jost",sans-serif; font-size:14px; font-weight:500; letter-spacing:.04em; text-transform:uppercase; text-align:left; color:var(--ink); }
.sp-woo-main .sp-accordions .faq-question__inner { display:inline-flex; align-items:center; gap:12px; }
.sp-woo-main .sp-accordions .faq-acc-icon { width:22px; height:22px; color:var(--green-ink); flex-shrink:0; }
.sp-woo-main .sp-accordions .faq-chevron { width:18px; height:18px; flex-shrink:0; color:var(--muted); transition:transform .2s; }
.sp-woo-main .sp-accordions .faq-question[aria-expanded="true"] .faq-chevron { transform:rotate(180deg); }
.sp-woo-main .sp-accordions .faq-answer { max-height:0; overflow:hidden; transition:max-height .3s ease; color:var(--muted); font-size:var(--font-size-text-base, 16px); line-height:150%; }
.sp-woo-main .sp-accordions .faq-question[aria-expanded="true"] + .faq-answer { max-height:1200px; }
.sp-woo-main .sp-accordions .faq-answer > * { padding:0 0 18px; margin:0; }
.sp-woo-main .sp-accordions .faq-answer { color:var(--muted); font-size:var(--font-size-text-base, 16px); line-height:150%; }
.sp-woo-main .sp-accordions .faq-answer > * { padding:0 20px; }
.sp-woo-main .sp-accordions .faq-answer > *:last-child { padding-bottom:20px; }

/* ── Responsywność ── */
@media (max-width:880px) {
  .sp-woo-main .sp-upper { grid-template-columns:1fr; gap:28px; }
  .sp-woo-main .sp-gallery { position:static; }
}

/* ============================================================
   DOLNE SEKCJE — related + FAQ (restyle pod nowy design)
   ============================================================ */
/* Zobacz inne z tej kategorii */
.sp-woo-main .related-section { padding:48px 0; background:#fff; }
.sp-woo-main .related-inner { display:grid; grid-template-columns:280px 1fr; gap:32px; align-items:flex-start; }
.sp-woo-main .related-intro { display:flex; flex-direction:column; gap:18px; padding-top:8px; }
.sp-woo-main .related-intro h2 { font-family:"Playfair Display",serif; font-size:28px; font-weight:700; margin:0; color:var(--ink); }
.sp-woo-main .related-intro p { margin:0; color:var(--muted); font-size:15px; line-height:1.5; }
.sp-woo-main .related-intro .btn { align-self:flex-start; display:inline-flex; align-items:center; gap:10px; height:48px; padding:12px 24px; border:1px solid var(--green); border-radius:8px; background:transparent; color:var(--green-ink); font-size:14px; text-transform:uppercase; letter-spacing:.02em; text-decoration:none; transition:background .18s,color .18s; }
.sp-woo-main .related-intro .btn:hover { background:var(--green); color:#fff; }
.sp-woo-main .related-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:20px; min-width:0; }

/* Karta produktu (.shop-card) — wspólny arkusz: assets/css/product-card.css */

/* FAQ */
.sp-woo-main .faq-section { padding:48px 0; background:#fff; }
.sp-woo-main .faq-section__inner { display:grid; grid-template-columns:1fr 1fr; gap:32px; align-items:start; }
.sp-woo-main .faq-section__title { font-family:"Playfair Display",serif; font-size:30px; font-weight:700; margin:0 0 32px; color:var(--ink); text-align:center; }
.sp-woo-main .faq-section__img { border-radius:8px; overflow:hidden; min-height:420px; background:var(--cream-2); }
.sp-woo-main .faq-section__img img { width:100%; height:100%; object-fit:cover; display:block; }
.sp-woo-main .faq-section .faq-list { display:flex; flex-direction:column; gap:8px; max-width:none; }
.sp-woo-main .faq-section .faq-item { background:var(--cream); border-radius:8px; overflow:hidden; }
.sp-woo-main .faq-section .faq-question { width:100%; display:flex; align-items:center; justify-content:space-between; gap:16px; padding:18px 20px; border:0; background:transparent; cursor:pointer; font-family:"Playfair Display",serif; font-size:15px; font-weight:700; text-align:left; color:var(--ink); }
.sp-woo-main .faq-section .faq-chevron { width:18px; height:18px; flex-shrink:0; padding:0; box-sizing:content-box; color:var(--ink); transition:transform .2s; }
.sp-woo-main .faq-section .faq-question[aria-expanded="true"] .faq-chevron { transform:rotate(180deg); }
.sp-woo-main .faq-section .faq-answer { max-height:0; overflow:hidden; transition:max-height .3s ease; }
.sp-woo-main .faq-section .faq-question[aria-expanded="true"] + .faq-answer { max-height:600px; }
.sp-woo-main .faq-section .faq-answer p { margin:0; padding:0 20px 18px; color:var(--muted); font-size:var(--font-size-text-base, 16px); line-height:150%; }

/* FAQ — obraz po lewej (1:1), akordeon po prawej; tytuł wycentrowany nad kolumnami */
.sp-woo-main .faq-section__img { aspect-ratio:1; min-height:0; }

/* ── Opinie klientów (styl jak modliteczka) ── */
.sp-woo-main .sp-reviews-section { background:#fff; padding:48px 0; }
.sp-woo-main .sp-reviews-card { background:var(--cream); border-radius:24px; padding:56px 64px 40px; text-align:center; }
.sp-woo-main .sp-reviews-section__title { font-family:"Playfair Display",serif; font-size:24px; font-weight:700; line-height:30px; color:var(--ink); margin:0 0 32px; }
.sp-woo-main .sp-reviews-viewport { overflow:hidden; min-width:0; }
.sp-woo-main .sp-reviews-track { display:flex; transition:transform .35s ease; }
.sp-woo-main .sp-review { flex:0 0 100%; display:flex; flex-direction:column; gap:18px; text-align:left; }
.sp-woo-main .sp-review__stars { color:#F5A623; font-size:18px; letter-spacing:4px; line-height:1; }
.sp-woo-main .sp-review__text { font-size:15px; line-height:24px; color:var(--ink); margin:0; }
.sp-woo-main .sp-review__author { font-size:14px; font-weight:500; text-transform:uppercase; letter-spacing:.04em; color:var(--muted); }
.sp-woo-main .sp-reviews-dots { display:flex; justify-content:center; gap:10px; margin-top:28px; }
.sp-woo-main .sp-reviews-dot { width:10px; height:10px; border-radius:50%; border:none; padding:0; cursor:pointer; background:rgba(44,42,38,.18); transition:background .2s, width .2s; }
.sp-woo-main .sp-reviews-dot:hover { background:rgba(44,42,38,.35); }
.sp-woo-main .sp-reviews-dot.is-active { background:var(--pink); width:22px; border-radius:5px; }

@media (max-width:880px) {
  .sp-woo-main .related-inner { grid-template-columns:1fr; gap:20px; }
  /* na mobile lista przesuwana w bok (jak slidery na stronie głównej), pełna szerokość ekranu */
  .sp-woo-main .related-grid {
    display:flex; grid-template-columns:none; gap:20px;
    overflow-x:auto; scroll-snap-type:x mandatory; -webkit-overflow-scrolling:touch; scrollbar-width:none;
    margin-inline:-24px; padding-inline:24px; scroll-padding-left:24px;
  }
  .sp-woo-main .related-grid::-webkit-scrollbar { display:none; }
  .sp-woo-main .related-grid .shop-card { flex:0 0 72%; scroll-snap-align:start; }
  .sp-woo-main .faq-section__inner { grid-template-columns:1fr; }
  .sp-woo-main .faq-section__img { display:none; }
  .sp-woo-main .sp-reviews-card { padding:32px 20px 24px; border-radius:16px; }
  .sp-woo-main .sp-reviews-section__title { font-size:22px; line-height:28px; margin-bottom:20px; }
}
