/*
Theme Name: Goji BIO — GP Child
Theme URI: https://goji-bio.ch/
Template: generatepress
Author: goji-bio.ch
Description: Skorka sklepu goji-bio.ch na GeneratePressie. Tozsamosc przeniesiona z motywu Herbarium (papier zamiast bieli, czarny tusz, jeden akcent w kolorze goji, Instrument Serif + Inter, wlosowe linie zamiast cieni), ale uklad karty produktu jest taki jak na imedzie i adad-medzie: hero z cena i CTA, tabela faktow, paski efektow, kafelki skladu, kroki stosowania, opinie z gwiazdkami, FAQ i zamkniecie zamowieniem.
Version: 1.0
Text Domain: goji-gp-child
*/

/* =======================================================================
   1. FUNDAMENT — paleta przeniesiona 1:1 z Herbarium
   ======================================================================= */
:root{
  --papier:#F6F2E9;
  --papier-ciemny:#EDE7DA;
  --tusz:#15120E;
  --tusz-slaby:#5B544A;
  --goji:#C2341D;
  --goji-ciemny:#992814;
  --zielen:#2E4A33;
  --linia:rgba(21,18,14,.18);
  --siatka:72rem;
}

body{
  background:var(--papier);color:var(--tusz);
  font-family:Inter,"Helvetica Neue",Arial,sans-serif;
  font-size:17px;line-height:1.62;letter-spacing:-.005em;
}
h1,h2,h3,h4,.gj-tyt{
  font-family:"Instrument Serif",Georgia,"Times New Roman",serif;
  font-weight:400;line-height:1.06;letter-spacing:-.018em;
}
h1{font-size:clamp(2.2rem,4.6vw,3.5rem)}
h2{font-size:clamp(1.7rem,3.2vw,2.5rem);margin-top:2.4rem}
h3{font-size:clamp(1.15rem,1.8vw,1.45rem)}
a{color:inherit;text-underline-offset:.22em}
a:hover{text-decoration-color:var(--goji)}

.site-header,.site-footer,.inside-header{background:var(--papier)}
.entry-content > *{max-width:none}

/* numerek sekcji — ten sam znak firmowy co w Herbarium */
.gj-numer{
  display:inline-block;font-family:Inter,sans-serif;font-size:.72rem;
  letter-spacing:.14em;text-transform:uppercase;color:var(--goji);
  margin-bottom:.5rem;
}

/* =======================================================================
   2. HERO KARTY — cena, zamowienie, znaczniki zaufania
   ======================================================================= */
.gj-hero{
  display:grid;grid-template-columns:1.25fr .85fr;gap:2.4rem;
  border-top:2px solid var(--tusz);border-bottom:1px solid var(--linia);
  padding:1.8rem 0 2rem;margin-bottom:.6rem;
}
.gj-hero__lead{font-size:1.14rem;color:var(--tusz-slaby)}
.gj-hero__lead strong{color:var(--tusz)}

.gj-cena{
  border:1px solid var(--tusz);padding:1.5rem;background:var(--papier-ciemny);
  align-self:start;
}
.gj-cena__kwota{
  font-family:"Instrument Serif",Georgia,serif;font-size:3rem;line-height:1;
  display:block;margin-bottom:.2rem;
}
.gj-cena__opis{font-size:.95rem;color:var(--tusz-slaby);margin:0 0 1rem}
.gj-cena ul{list-style:none;margin:0 0 1.2rem;padding:0;font-size:.95rem}
.gj-cena li{padding-left:1.4rem;position:relative;margin-bottom:.35rem}
.gj-cena li::before{content:"✓";position:absolute;left:0;color:var(--goji)}

.gj-guzik{
  display:inline-block;background:var(--goji);color:#fff;text-decoration:none;
  padding:.95rem 1.8rem;font-weight:600;letter-spacing:.01em;border:0;
  font-size:1.02rem;cursor:pointer;width:100%;text-align:center;
}
.gj-guzik:hover{background:var(--goji-ciemny);color:#fff}

.gj-znaczniki{display:flex;gap:1.6rem;flex-wrap:wrap;margin:.9rem 0 0}
.gj-znacznik{display:flex;gap:.55rem;align-items:center;font-size:.9rem;color:var(--tusz-slaby)}
.gj-znacznik svg{width:20px;height:20px;stroke:var(--goji);fill:none;stroke-width:1.7}

/* ocena */
.gj-ocena{display:flex;align-items:center;gap:.6rem;margin:.2rem 0 1rem}
.gj-gwiazdki{color:var(--goji);letter-spacing:.12em;font-size:1.05rem}
.gj-ocena small{color:var(--tusz-slaby)}

/* =======================================================================
   3. TABELA FAKTOW — to, czego szuka sie wzrokiem w pierwszej kolejnosci
   ======================================================================= */
.gj-fakty{width:100%;border-collapse:collapse;margin:1.4rem 0 2rem;font-size:.97rem}
.gj-fakty th,.gj-fakty td{
  text-align:left;padding:.72rem .9rem;border-bottom:1px solid var(--linia);
  vertical-align:top;
}
.gj-fakty th{
  width:32%;font-weight:600;font-family:Inter,sans-serif;
  background:var(--papier-ciemny);
}
.gj-fakty tr:first-child th,.gj-fakty tr:first-child td{border-top:1px solid var(--tusz)}

/* =======================================================================
   4. PASKI EFEKTOW — jak na imedzie: przed / po, bez obietnic w liczbach
   ======================================================================= */
.gj-paski{margin:1.4rem 0 2rem}
.gj-pasek{display:grid;grid-template-columns:13rem 1fr;gap:1rem;align-items:center;margin-bottom:.8rem}
.gj-pasek > span{font-size:.95rem}
.gj-tor{position:relative;height:.55rem;background:var(--papier-ciemny);border:1px solid var(--linia)}
.gj-tor i{position:absolute;inset:0 auto 0 0;background:var(--goji);display:block}

/* etapy w czasie */
.gj-etapy{display:grid;grid-template-columns:repeat(3,1fr);gap:1.2rem;margin:1.4rem 0 2rem}
.gj-etap{border-top:2px solid var(--goji);padding-top:.9rem}
.gj-etap b{display:block;font-size:.78rem;letter-spacing:.12em;text-transform:uppercase;color:var(--goji);margin-bottom:.35rem}
.gj-etap h3{margin:.1rem 0 .4rem}
.gj-etap p{font-size:.95rem;color:var(--tusz-slaby);margin:0}

/* =======================================================================
   5. SKLAD — kafelek na skladnik
   ======================================================================= */
.gj-sklad{display:grid;grid-template-columns:repeat(2,1fr);gap:1.2rem;margin:1.4rem 0 2rem}
.gj-skladnik{border:1px solid var(--linia);padding:1.1rem 1.2rem;background:#fff9}
.gj-skladnik h3{margin:0 0 .35rem;display:flex;justify-content:space-between;gap:1rem;align-items:baseline}
.gj-skladnik .gj-ile{
  font-family:Inter,sans-serif;font-size:.85rem;color:var(--goji);
  white-space:nowrap;font-weight:600;
}
.gj-skladnik p{margin:0;font-size:.95rem;color:var(--tusz-slaby)}

/* =======================================================================
   6. KROKI STOSOWANIA
   ======================================================================= */
.gj-kroki{counter-reset:k;display:grid;gap:1rem;margin:1.4rem 0 2rem;padding:0;list-style:none}
.gj-krok{display:grid;grid-template-columns:3rem 1fr;gap:1rem;align-items:start}
.gj-krok::before{
  counter-increment:k;content:counter(k);
  font-family:"Instrument Serif",Georgia,serif;font-size:2rem;line-height:1;
  color:var(--goji);border-top:2px solid var(--goji);padding-top:.3rem;
}
.gj-krok h3{margin:0 0 .25rem}
.gj-krok p{margin:0;font-size:.95rem;color:var(--tusz-slaby)}

/* =======================================================================
   7. OPINIE
   ======================================================================= */
.gj-opinie{display:grid;grid-template-columns:repeat(3,1fr);gap:1.2rem;margin:1.4rem 0 2rem}
.gj-opinia{border:1px solid var(--linia);padding:1.2rem;background:var(--papier-ciemny)}
.gj-opinia__kto{font-weight:600;margin:0}
.gj-opinia__kim{font-size:.85rem;color:var(--tusz-slaby);margin:0 0 .5rem}
.gj-opinia p{font-size:.95rem;margin:.5rem 0 0}
.gj-plakietka{
  display:inline-block;font-size:.72rem;letter-spacing:.06em;text-transform:uppercase;
  color:var(--zielen);border:1px solid var(--zielen);padding:.12rem .45rem;margin-top:.7rem;
}

/* zalety i wady */
.gj-bilans{display:grid;grid-template-columns:1fr 1fr;gap:1.4rem;margin:1.4rem 0 2rem}
.gj-bilans ul{list-style:none;margin:0;padding:0}
.gj-bilans li{padding-left:1.5rem;position:relative;margin-bottom:.45rem;font-size:.97rem}
.gj-plus li::before{content:"+";position:absolute;left:0;color:var(--zielen);font-weight:700}
.gj-minus li::before{content:"–";position:absolute;left:0;color:var(--goji);font-weight:700}

/* =======================================================================
   8. FAQ
   ======================================================================= */
.gj-faq{margin:1.4rem 0 2rem;border-top:1px solid var(--linia)}
.gj-faq details{border-bottom:1px solid var(--linia);padding:.9rem 0}
.gj-faq summary{
  cursor:pointer;font-family:"Instrument Serif",Georgia,serif;
  font-size:1.2rem;list-style:none;display:flex;justify-content:space-between;gap:1rem;
}
.gj-faq summary::-webkit-details-marker{display:none}
.gj-faq summary::after{content:"+";color:var(--goji)}
.gj-faq details[open] summary::after{content:"–"}
.gj-faq details p{margin:.7rem 0 0;color:var(--tusz-slaby);font-size:.97rem}

/* =======================================================================
   9. ZAMKNIECIE — pasek zamowienia
   ======================================================================= */
.gj-zamow{
  border:2px solid var(--tusz);padding:2rem;margin:2.4rem 0 1rem;
  display:grid;grid-template-columns:1fr auto;gap:2rem;align-items:center;
  background:var(--papier-ciemny);
}
.gj-zamow h2{margin:0 0 .4rem}
.gj-zamow p{margin:0;color:var(--tusz-slaby)}
.gj-zamow .gj-guzik{width:auto;padding:1rem 2.4rem}

/* ostrzezenie prawne — male, ale zawsze */
.gj-nota{font-size:.86rem;color:var(--tusz-slaby);border-left:2px solid var(--linia);padding-left:1rem;margin:1.6rem 0}

/* =======================================================================
   10. TELEFON
   ======================================================================= */
@media (max-width:860px){
  .gj-hero,.gj-zamow{grid-template-columns:1fr}
  .gj-sklad,.gj-opinie,.gj-etapy,.gj-bilans{grid-template-columns:1fr}
  .gj-pasek{grid-template-columns:1fr}
  .gj-zamow .gj-guzik{width:100%}
}

/* =======================================================================
   11. WOOCOMMERCE — karta ma sie czytac JEDNYM CIAGIEM
   ⚠ Domyslnie Woo stawia galerie i podsumowanie obok siebie jako kolumny
   z float, a nasza tresc wchodzila pod nie i NACHODZILA na naglowek.
   Zdejmujemy float i chowamy puste miejsce po zdjeciu, ktorego nie mamy.
   ======================================================================= */
.woocommerce div.product div.images,
.woocommerce div.product div.summary{float:none;width:100%;margin:0 0 1rem}
.woocommerce div.product .woocommerce-product-gallery__image--placeholder,
.woocommerce div.product .woocommerce-product-gallery:not(:has(img:not([src*="placeholder"]))){display:none}
.woocommerce div.product .summary .price,
.woocommerce div.product .summary .stock,
.woocommerce .woocommerce-breadcrumb{display:none}
.gj-karta{clear:both}
.woocommerce div.product .product_title{margin-bottom:.6rem}

/* listing sklepu: spis okazow, nie siatka kafelkow — jak w Herbarium */
.woocommerce ul.products{display:grid;grid-template-columns:1fr;gap:0;margin:0;padding:0}
.woocommerce ul.products li.product{
  width:100%!important;margin:0!important;float:none!important;
  border-bottom:1px solid var(--linia);padding:1.1rem 0;
  display:grid;grid-template-columns:1fr auto;gap:1.5rem;align-items:baseline;
}
.woocommerce ul.products li.product img{display:none}
.woocommerce ul.products li.product .woocommerce-loop-product__title{
  font-family:"Instrument Serif",Georgia,serif;font-size:1.5rem;margin:0;padding:0;
}
.woocommerce ul.products li.product .gj-cena__kwota{font-size:1.3rem}

/* menu: bez koszyka i konta, bo sprzedaz jest telefoniczna */
.main-navigation .menu-item a{font-size:.95rem}