﻿/* ===== Profibra ÔÇö custom design layer ===== */

:root{
  --pf-olive:#40452F;
  --pf-red:#B01A1D;
  --pf-red-dark:#7A1214;
  --pf-caramel:#A07C58;
  --pf-sage:#D5DEC4;
  --pf-cream:#F7F1E6;
  --pf-cream-deep:#EFE4D0;
  --pf-pink:#F7CCC0;
  --pf-text:#2E2A22;
}

body{ color:var(--pf-text); }

/* ---- generic section rhythm ---- */
.pf-hero, .pf-trustbar, .pf-categories, .pf-featured, .pf-about-teaser{
  padding:64px 5%;
}
.pf-hero{ background:var(--pf-cream); overflow:hidden; }
.pf-trustbar{ background:var(--pf-sage); }
.pf-categories{ background:#fff; }
.pf-featured{ background:var(--pf-cream); }
.pf-about-teaser{ background:#fff; }

.pf-section-title{
  color:var(--pf-olive);
  font-weight:800;
  margin-bottom:40px;
  letter-spacing:-0.5px;
}
.pf-section-title--left{ text-align:left; margin-bottom:20px; }

/* ---- hero ---- */
.pf-eyebrow{
  color:var(--pf-red);
  font-weight:700;
  letter-spacing:2px;
  text-transform:uppercase;
  font-size:14px;
  margin-bottom:12px;
}
.pf-hero-title{
  font-size:clamp(32px,4.5vw,52px);
  line-height:1.1;
  color:var(--pf-olive);
  font-weight:800;
  margin-bottom:20px;
}
.pf-hero-text{
  font-size:18px;
  line-height:1.6;
  color:var(--pf-text);
  max-width:520px;
  margin-bottom:28px;
}
.pf-hero-img-col{ display:flex; justify-content:center; }
.pf-hero-img img, .pf-rounded-img img{
  border-radius:28px;
  box-shadow:0 30px 60px -20px rgba(46,42,34,0.35);
  transition:transform .4s ease;
}
.pf-hero-img img:hover, .pf-rounded-img img:hover{ transform:scale(1.03); }

/* ---- buttons ---- */
.pf-btn .wp-block-button__link,
.pf-btn-outline .wp-block-button__link{
  border-radius:999px;
  padding:14px 32px;
  font-weight:700;
  transition:all .3s ease;
}
.pf-btn .wp-block-button__link{
  background:var(--pf-red);
  border:2px solid var(--pf-red);
}
.pf-btn .wp-block-button__link:hover{
  background:var(--pf-red-dark);
  border-color:var(--pf-red-dark);
  transform:translateY(-2px);
  box-shadow:0 10px 20px -8px rgba(122,18,20,0.5);
}
.pf-btn-outline .wp-block-button__link{
  background:transparent;
  color:var(--pf-olive) !important;
  border:2px solid var(--pf-olive);
}
.pf-btn-outline .wp-block-button__link:hover{
  background:var(--pf-olive);
  color:#fff !important;
  transform:translateY(-2px);
}

/* ---- trust bar ---- */
.pf-trust-cols{ gap:24px; }
.pf-trust-item{ text-align:center; }
.pf-trust-icon{
  font-size:38px;
  margin-bottom:8px;
  transition:transform .3s ease;
}
.pf-trust-item:hover .pf-trust-icon{ transform:scale(1.15) rotate(-4deg); }
.pf-trust-label{
  font-weight:700;
  color:var(--pf-olive);
  font-size:15px;
}

/* ---- category cards ---- */
.pf-cat-cols{ gap:32px; }
.pf-cat-card{
  background:var(--pf-cream);
  border-radius:20px;
  padding:24px;
  text-align:center;
  transition:transform .35s ease, box-shadow .35s ease;
}
.pf-cat-card:hover{
  transform:translateY(-6px);
  box-shadow:0 24px 40px -20px rgba(46,42,34,0.25);
}
.pf-cat-img img{
  border-radius:14px;
  aspect-ratio:16/10;
  object-fit:cover;
  width:100%;
  transition:transform .5s ease;
}
.pf-cat-card:hover .pf-cat-img img{ transform:scale(1.06); }
.pf-cat-card h3{ color:var(--pf-olive); margin-top:16px; }

/* ---- featured products (WooCommerce shortcode grid) ---- */
.pf-featured ul.products li.product{
  transition:transform .3s ease;
}
.pf-featured ul.products li.product img{
  border-radius:16px;
  transition:transform .4s ease, box-shadow .4s ease;
}
.pf-featured ul.products li.product:hover img{
  transform:scale(1.05);
  box-shadow:0 20px 30px -15px rgba(46,42,34,0.3);
}
.pf-featured ul.products li.product .price{ color:var(--pf-red); font-weight:700; }
.pf-featured ul.products li.product .button{
  background:var(--pf-olive) !important;
  border-radius:999px !important;
  transition:all .3s ease !important;
}
.pf-featured ul.products li.product .button:hover{
  background:var(--pf-red) !important;
  transform:translateY(-2px);
}

/* ---- scroll-in animation ---- */
.pf-anim{
  opacity:0;
  transform:translateY(28px);
  transition:opacity .7s ease, transform .7s ease;
}
.pf-anim.pf-in{ opacity:1; transform:translateY(0); }

/* ---- header hover ---- */
.main-header-menu .menu-item > a{ position:relative; }
.main-header-menu .menu-item > a::after{
  content:'';
  position:absolute; left:0; bottom:-4px;
  width:0; height:2px;
  background:var(--pf-red);
  transition:width .3s ease;
}
.main-header-menu .menu-item > a:hover::after{ width:100%; }

/* ---- responsive ---- */
@media (max-width:768px){
  .pf-hero, .pf-trustbar, .pf-categories, .pf-featured, .pf-about-teaser{ padding:40px 6%; }
  .pf-trust-cols{ flex-wrap:wrap; }
  .pf-trust-item{ flex-basis:50% !important; margin-bottom:20px; }
  .pf-hero-cols{ flex-direction:column-reverse; }
  .pf-hero-text{ max-width:none; }
}

/* 22.09 - na telefonie przyciski "Zobacz produkty"/"Zobacz przepisy" przenoszone na gore
   kolumny hero (w miejsce usunietego eyebrow-tekstu). Na komputerze przyciski zostaja
   na dotychczasowym miejscu (na dole, po korzysciach) - tylko mobile dostaje reorder. */
@media (max-width:768px){
  .pf-hero-cols > .wp-block-column:first-child{
    display:flex;
    flex-direction:column;
  }
  .pf-hero-cols > .wp-block-column:first-child > .wp-block-buttons{
    order:-1;
    margin-bottom:24px;
  }
}

/* ---- About / Contact pages ---- */
.pf-about-hero{ padding:70px 5% 20px; text-align:center; background:var(--pf-cream); }
.pf-about-title{ max-width:820px; margin:0 auto; }
.pf-about-body{ padding:50px 5% 80px; max-width:1100px; margin:0 auto; }
.pf-prose{ max-width:760px; margin:0 auto 36px; line-height:1.75; font-size:17px; }
.pf-prose h2{ color:var(--pf-olive); font-size:26px; margin-bottom:14px; }
.pf-about-closing{ text-align:center; background:var(--pf-sage); padding:36px; border-radius:20px; margin-top:20px; }
.pf-about-closing .wp-block-buttons{ justify-content:center; margin-top:16px; }

.pf-contact-card h3{ color:var(--pf-olive); margin-bottom:14px; }
.pf-contact-card p{ font-size:16px; line-height:1.7; margin-bottom:14px; }
.pf-contact-card a{ color:var(--pf-red); font-weight:600; }
.pf-map-wrap{ border-radius:20px; overflow:hidden; box-shadow:0 20px 40px -20px rgba(46,42,34,0.3); }

@media (max-width:768px){
  .pf-about-hero, .pf-about-body{ padding-left:6%; padding-right:6%; }
}

/* ---- footer fix: force readable colors ---- */
#colophon, .site-footer, .ast-small-footer{
  background:var(--pf-olive) !important;
}
#colophon, .site-footer, #colophon *, .site-footer *{
  color:var(--pf-cream) !important;
}
#colophon a, .site-footer a{
  color:var(--pf-pink) !important;
  text-decoration:none;
}
#colophon a:hover, .site-footer a:hover{
  color:#fff !important;
}
#colophon h1,#colophon h2,#colophon h3,#colophon h4,#colophon h5{
  color:#fff !important;
}
.ast-small-footer{ border-top:1px solid rgba(255,255,255,0.15) !important; }
.site-primary-footer-wrap{ background:transparent !important; }
.site-below-footer-wrap{ background:var(--pf-olive) !important; }

/* ---- fix: brown header + brown page content wrapper (Organic Store leftover) ---- */
.ast-primary-header-bar, .main-header-bar{
  background:var(--pf-cream) !important;
  border-bottom:1px solid rgba(64,69,47,0.1);
}
.ast-article-single, .ast-woocommerce-container, .woocommerce-page .ast-article-single,
.single-product .ast-article-single, .archive .ast-article-single{
  background:transparent !important;
}
.ast-separate-container .ast-article-single{
  box-shadow:none !important;
}

.pf-trust-icon{ color:var(--pf-olive); }
.pf-trust-icon svg{ width:52px; height:52px; display:inline-block; }

/* ---- v2 tweak: white header, light footer instead of dark olive ---- */
.ast-primary-header-bar, .main-header-bar{
  background:#FFFFFF !important;
}
#colophon, .site-footer, .ast-small-footer{
  background:var(--pf-cream-deep) !important;
}
#colophon *, .site-footer *{
  color:var(--pf-text) !important;
}
#colophon a, .site-footer a{
  color:var(--pf-red) !important;
}
#colophon a:hover, .site-footer a:hover{
  color:var(--pf-olive) !important;
}
#colophon h1,#colophon h2,#colophon h3,#colophon h4,#colophon h5{
  color:var(--pf-olive) !important;
}
.site-below-footer-wrap{
  background:#EDE1CB !important;
  border-top:1px solid rgba(64,69,47,0.12) !important;
}

/* hide placeholder demo social icons (not real accounts yet) */
.footer-social-item{ display:none !important; }

/* ---- v3: restore social icons, header shadow+bold nav, brand-brown footer, rounded shop images, heading font ---- */
@import url('https://fonts.googleapis.com/css2?family=Fraunces:opsz,wght@9..144,600;9..144,700&display=swap');

.footer-social-item{ display:inline-flex !important; }
.footer-social-item svg{ fill:var(--pf-text) !important; }

.ast-primary-header-bar{
  box-shadow:0 6px 20px -10px rgba(46,42,34,0.25) !important;
}
.main-header-menu .menu-item > a{
  font-weight:700 !important;
}

#colophon, .site-footer, .ast-small-footer{
  background:#A47C59 !important;
}
#colophon *, .site-footer *{
  color:#FFFFFF !important;
}
#colophon a, .site-footer a{
  color:#FFFFFF !important;
  opacity:0.92;
}
#colophon a:hover, .site-footer a:hover{
  opacity:1;
  text-decoration:underline;
}
#colophon h1,#colophon h2,#colophon h3,#colophon h4,#colophon h5{
  color:#FFFFFF !important;
  text-transform:uppercase;
  letter-spacing:0.6px;
  font-weight:700 !important;
}
#colophon .footer-social-item svg{ fill:#FFFFFF !important; }
.site-below-footer-wrap{
  background:#8F6A48 !important;
  border-top:1px solid rgba(255,255,255,0.18) !important;
}

.woocommerce ul.products li.product img,
.woocommerce div.product .images img,
.woocommerce div.product .woocommerce-product-gallery img{
  border-radius:16px !important;
}

h1,h2,h3,.pf-hero-title,.pf-section-title,.pf-about-title{
  font-family:'Fraunces', Georgia, serif !important;
}

/* ---- v4: brand stamp badges in trust bar (brown bg to match cream stamp ink) ---- */
.pf-trustbar{
  background:#A47C59 !important;
}
.pf-trust-icon{ color:#fff; margin-bottom:4px; }
.pf-trust-badge{
  width:110px;
  height:auto;
  display:inline-block;
  transition:transform .3s ease;
}
.pf-trust-item:hover .pf-trust-badge{ transform:scale(1.08) rotate(-2deg); }
.pf-trust-label{
  color:#FFFFFF !important;
  font-weight:700;
  text-transform:uppercase;
  letter-spacing:0.4px;
  font-size:14px;
}

/* ---- v5: align trust-bar labels on one line + header color experiment ---- */
.pf-trust-item{
  display:flex;
  flex-direction:column;
  align-items:center;
}
.pf-trust-icon{
  height:118px;
  display:flex;
  align-items:center;
  justify-content:center;
  margin-bottom:10px;
}
.pf-trust-badge{
  width:110px;
  max-height:118px;
  object-fit:contain;
}
.pf-trust-label{
  margin-top:auto;
}

/* EKSPERYMENT na pro┼Ťb─Ö: jasnozielony header (na pr├│b─Ö). ┼╗eby wr├│ci─ç do bieli: usu┼ä poni┼╝sz─ů regu┼é─Ö (zostanie #FFFFFF z regu┼éy wy┼╝ej) */
.ast-primary-header-bar{
  background:var(--pf-sage) !important;
}

/* v6: header jako gradient zielen->biel zamiast plaskiego zielonego */
.ast-primary-header-bar{
  background:linear-gradient(90deg, var(--pf-sage) 0%, #FFFFFF 32%) !important;
}

/* v7: powrot do bialego naglowka - eksperyment z zielenia/gradientem odrzucony */
.ast-primary-header-bar{
  background:#FFFFFF !important;
}

/* v8: fix koncentraty tile image not stretching, center category buttons, sage glow separator */
.pf-cat-img{
  display:block !important;
  width:100% !important;
}
.pf-cat-card .wp-block-buttons{
  justify-content:center !important;
}

.pf-featured{
  position:relative;
}
.pf-featured::before{
  content:'';
  position:absolute;
  top:0; left:0; right:0;
  height:70px;
  background:linear-gradient(to bottom, var(--pf-sage) 0%, rgba(213,222,196,0) 100%);
  opacity:0.65;
  pointer-events:none;
}

/* v9: force koncentraty tile image to fill width (sizes attr / specificity conflict fix) */
.pf-cat-img img.wp-image-6371,
.pf-cat-card .pf-cat-img img{
  width:100% !important;
  height:auto !important;
  max-width:none !important;
}

/* v10: biale menu + subtelny zielonkawy akcent pod spodem (tak jak przy Wybrane chleby) */
.ast-primary-header-bar{
  background:#FFFFFF !important;
  position:relative;
}
.ast-primary-header-bar::after{
  content:'';
  position:absolute;
  left:0; right:0; bottom:-8px;
  height:8px;
  background:linear-gradient(to bottom, var(--pf-sage) 0%, rgba(213,222,196,0) 100%);
  opacity:0.8;
  pointer-events:none;
}

/* v11: miekkie przejscie hero -> pasek brazowy, ciemna zielen jak kolor czcionki nag┼é├│wk├│w */
.pf-trustbar{ position:relative; }
.pf-trustbar::before{
  content:'';
  position:absolute;
  top:0; left:0; right:0;
  height:60px;
  background:linear-gradient(to bottom, var(--pf-olive) 0%, rgba(64,69,47,0) 100%);
  opacity:0.4;
  pointer-events:none;
}

/* v12: usuniecie zielonych 'poswiat' - nie podobaly sie */
.pf-featured::before,
.pf-trustbar::before{
  display:none !important;
}

/* v13: usuniecie zielonej poswiaty pod naglowkiem, zostaje sam box-shadow jak wczesniej */
.ast-primary-header-bar::after{
  display:none !important;
}

/* v14: powiekszenie plakietek na pasku zaufania, zeby czytac napisy w tloczeniu */
.pf-trust-icon{ height:140px !important; }
.pf-trust-badge{ width:135px !important; max-height:140px !important; }

/* v15: cofniecie wysokosci paska do oryginalu + wyrownanie wizualnego rozmiaru plakietek (rozny padding w zrodlowych PNG) */
.pf-trust-icon{ height:118px !important; }
.pf-trust-badge{ max-height:118px !important; }
.pf-trust-badge.wp-image-6394{ width:110px !important; }
.pf-trust-badge.wp-image-6395{ width:132px !important; }
.pf-trust-badge.wp-image-6396{ width:113px !important; }
.pf-trust-badge.wp-image-6397{ width:134px !important; }

/* v16: poprawka selektorow (obrazki nie mialy klas wp-image-X, uzywam src) */
.pf-trust-badge[src*='bez_glutenu']{ width:110px !important; }
.pf-trust-badge[src*='piekarnia-rzemieslnicza']{ width:132px !important; }
.pf-trust-badge[src*='szybka-wysylka']{ width:113px !important; }
.pf-trust-badge[src*='wieloletnie-doswiadczenie']{ width:134px !important; }

/* v17: mniejszy odstep etykieta<->ikonka, kafelek koncentraty na probe w jasnej zieleni, cien nad stopka */
.pf-trust-label{ margin-top:8px !important; }

.pf-cat-cols > .pf-cat-card:nth-child(2){
  background:var(--pf-sage) !important;
}

#colophon{
  position:relative;
  box-shadow:0 -8px 24px -12px rgba(46,42,34,0.3) !important;
}

/* v18: stylizacja logo w stopce */
.pf-footer-logo{ width:150px !important; height:auto !important; margin-top:6px; }

/* v19: prawdziwa przyczyna ogromnej przerwy - domyslny margines akapitu WP (60px) bil moja regule bez !important */
.pf-trust-icon{ margin-bottom:0 !important; }
.pf-trust-label{ margin-top:6px !important; margin-bottom:0 !important; }
.pf-trust-item{ justify-content:flex-start !important; }

/* v20: wersja probna - zielona stopka zamiast brazowej */
#colophon, .site-footer, .ast-small-footer{
  background:var(--pf-sage) !important;
}
#colophon *, .site-footer *{
  color:var(--pf-olive) !important;
}
#colophon a, .site-footer a{
  color:var(--pf-red) !important;
  opacity:1;
}
#colophon a:hover, .site-footer a:hover{
  color:var(--pf-olive) !important;
}
#colophon h1,#colophon h2,#colophon h3,#colophon h4,#colophon h5{
  color:var(--pf-olive) !important;
}
.site-below-footer-wrap{
  background:#C7D3B2 !important;
  border-top:1px solid rgba(64,69,47,0.15) !important;
}
.pf-footer-logo{ filter:none; }

/* v21: szuflada koszyka (Astra cart drawer) - bylo brazowe tlo z domyslnej palety, teraz czyste i spojne */
.astra-cart-drawer{
  background:#FFFFFF !important;
}
.astra-cart-drawer-header{
  border-bottom:1px solid rgba(64,69,47,0.12) !important;
}
.astra-cart-drawer-title{
  font-family:'Fraunces', Georgia, serif !important;
  color:var(--pf-olive) !important;
  font-weight:700 !important;
}
.astra-cart-drawer-close{
  color:var(--pf-olive) !important;
}
.astra-cart-drawer-content{
  color:var(--pf-text) !important;
}
.astra-cart-drawer .widget_shopping_cart_content a{
  color:var(--pf-red) !important;
}
.astra-cart-drawer .button, .astra-cart-drawer .checkout{
  background:var(--pf-red) !important;
  border-radius:999px !important;
  border:none !important;
  transition:all .3s ease !important;
}
.astra-cart-drawer .button:hover, .astra-cart-drawer .checkout:hover{
  background:var(--pf-red-dark) !important;
  transform:translateY(-2px);
}

/* v22: naprawa niewidocznego czerwonego tekstu na czerwonych przyciskach w szufladzie koszyka */
.astra-cart-drawer .button, .astra-cart-drawer .checkout{
  color:#FFFFFF !important;
}

/* v23: dogonienie specyficznosci - poprzednia regula .widget_shopping_cart_content a byla bardziej specyficzna */
.astra-cart-drawer a.button, .astra-cart-drawer a.checkout{
  color:#FFFFFF !important;
}


/* ==========================================================================
   CZ─ś┼Ü─ć WSP├ôLNA ÔÇö obowi─ůzuje w ka┼╝dym wariancie kolorystycznym (A / B / C).
   Uk┼éad, rotacja zdj─Ö─ç w hero, wyr├│wnanie piecz─ůtek, klikalno┼Ť─ç.
   Kolory siedz─ů ni┼╝ej, w blokach html.theme-b i html.theme-c.
   ========================================================================== */

/* ---- HERO: po┼Ťwiata z obu stron (bierze kolor z aktualnego wariantu) ---- */

.pf-hero{
  position:relative;
  overflow:hidden;
  padding:72px 5% 0;
}
.pf-hero::before{
  content:"";
  position:absolute;
  top:-26%;
  right:-10%;
  width:56vw;
  max-width:760px;
  aspect-ratio:1;
  background:radial-gradient(circle at 50% 50%, var(--pf-sage) 0%, transparent 70%);
  opacity:.6;
  pointer-events:none;
}
.pf-hero::after{
  content:"";
  position:absolute;
  bottom:-30%;
  left:-14%;
  width:48vw;
  max-width:640px;
  aspect-ratio:1;
  background:radial-gradient(circle at 50% 50%, var(--pf-sage) 0%, transparent 72%);
  opacity:.42;
  pointer-events:none;
}
.pf-hero > *{ position:relative; z-index:1; }

/* ---- HERO: rotacja zdj─Ö─ç --------------------------------------------- */
/* Proporcja 5:3 = dok┼éadnie tyle, co oryginalne hero-bread.jpg (661├Ś395). */

.pf-hero-media{
  position:relative;
  display:grid;
  aspect-ratio:1 / 1;   /* proba 14.09 - ciasto.jpg (kwadrat), caly obraz bez kadrowania */
  width:100%;
  max-width:400px;      /* 14.09 - rozmiar posredni (360 za male, 440 za duze) */
  margin-inline:auto;
}
/* Zaokr─ůglenie i przycinanie siedz─ů na kontenerze, nie na obrazku ÔÇö
   inaczej powi─Ökszany obrazek wyszed┼éby poza zaokr─ůglone rogi. */
.pf-hero-media .wp-block-image{
  grid-area:1 / 1;
  margin:0;
  height:100%;
  overflow:hidden;
  border-radius:28px;
  box-shadow:0 30px 60px -20px rgba(46,42,34,.35);
}
.pf-hero-media img{
  width:100%;
  height:100%;
  object-fit:cover;
  object-position:center;
  border-radius:0;
  box-shadow:none;
}

/* Bez JS widoczne jest pierwsze zdj─Öcie, reszta czeka schowana. */
.pf-hero-media .wp-block-image + .wp-block-image{ opacity:0; }
/* SAFETY (14.09): aktywny slajd ZAWSZE widoczny, niezaleznie od klasy --ready.
   Wczesniej przy przejsciu box migal na pusto, gdy is-active padal na slajd 2/3
   a regula opacity:1 dzialala tylko pod --ready. */
.pf-hero-media .wp-block-image.is-active{ opacity:1; }

/* Przenikanie na kontenerze, ruch na obrazku ÔÇö nie wchodz─ů sobie w drog─Ö. */
.pf-hero-media--ready .wp-block-image{
  opacity:0;
  transition:opacity .9s ease;
}
.pf-hero-media--ready .wp-block-image.is-active{
  opacity:1;
}

/* ---- powolny najazd / odjazd (efekt Kena Burnsa) ---------------------- */
/* Tempo LINIOWE, nie ease-out ÔÇö przy ease-out ruch gwa┼étownie zwalnia pod
   koniec i wygl─ůda, jakby zamiera┼é. Liniowo jedzie r├│wno a┼╝ do zmiany.
   Czas 5,4 s = 4,5 s odst─Öpu + 0,9 s przenikania, czyli dok┼éadnie tyle,
   ile slajd jest widoczny.                                               */

@keyframes pf-kenburns-in{
  from{ transform:scale(1); }
  to{   transform:scale(1.18); }
}
@keyframes pf-kenburns-out{
  from{ transform:scale(1.20); }
  to{   transform:scale(1.02); }
}

.pf-hero-media--ready .wp-block-image img{
  transform:scale(1);
  will-change:transform;
}
.pf-hero-media--ready .wp-block-image.is-active img{
  animation:pf-kenburns-in 5.4s linear forwards;
}
/* Slajd 2 startuje g┼é─Öbiej i si─Ö oddala. */
.pf-hero-media--ready .wp-block-image:nth-child(2).is-active img{
  animation-name:pf-kenburns-out;
}
.pf-hero-media--ready .wp-block-image:nth-child(2) img{
  transform:scale(1.20);
}

/* Punkt zaczepienia dobrany do kadru ÔÇö najazd idzie w stron─Ö chleba. */
.pf-hero-media .wp-block-image:nth-child(1) img{ transform-origin:60% 66%; }
.pf-hero-media .wp-block-image:nth-child(2) img{ transform-origin:50% 64%; }
.pf-hero-media .wp-block-image:nth-child(3) img{ transform-origin:45% 64%; }

.pf-hero-dots{
  display:flex;
  justify-content:center;
  gap:7px;
  margin-top:20px;
}
.pf-hero-dots button{
  width:7px;
  height:7px;
  padding:0;
  border:none;
  border-radius:50%;
  background:rgba(64,70,47,.24);
  cursor:pointer;
  transition:background .25s ease, width .25s ease;
}
.pf-hero-dots button.is-active{
  background:var(--pf-red);
  width:22px;
  border-radius:4px;
}
.pf-hero-dots button:focus-visible{
  outline:3px solid var(--pf-red);
  outline-offset:3px;
}

/* ---- PASEK ZAUFANIA: wyr├│wnanie i klikalno┼Ť─ç (bez kolor├│w) ------------- */
/* Bazowy CSS ustawia┼é ka┼╝dej piecz─ůtce inn─ů szeroko┼Ť─ç (per wp-image-ID),
   przez co podpisy siedzia┼éy na czterech r├│┼╝nych wysoko┼Ťciach.            */

.pf-trust-item{
  display:flex !important;
  flex-direction:column;
  align-items:center;
  position:relative;
  border-radius:20px;
  transition:transform .28s ease;
}
.pf-trust-item:hover{ transform:translateY(-4px); }

.pf-trust-icon{
  height:auto !important;
  min-height:104px;
  margin:0 0 16px !important;
  display:flex;
  align-items:center;
  justify-content:center;
}
.pf-trust-badge{
  width:auto !important;
  height:auto !important;
  max-width:100px !important;
  max-height:100px !important;
  transition:filter .25s ease, transform .28s ease;
}
.pf-trust-label{ margin:0 !important; }

/* Klikalna ca┼éa kafelka ÔÇö link siedzi w podpisie, a jego ::after
   rozci─ůga si─Ö na ca┼é─ů kolumn─Ö. Blok zostaje edytowalny w Gutenbergu. */
.pf-trust-label a{
  color:inherit;
  text-decoration:none;
}
.pf-trust-label a::after{
  content:"";
  position:absolute;
  inset:-12px -8px;
  border-radius:20px;
}
.pf-trust-item:has(a){ cursor:pointer; }
.pf-trust-item:has(a:hover) .pf-trust-label,
.pf-trust-item:has(a:focus-visible) .pf-trust-label{
  text-decoration:underline;
  text-underline-offset:4px;
}

/* ---- tytu┼éy produkt├│w: pogrubione ------------------------------------- */

.product_title,
.woocommerce-loop-product__title,
.wc-block-grid__product-title,
.ast-woo-product-title{
  font-weight:700 !important;
}

/* ---- przycisk ÔÇ×dodaj do koszyka" pod tytu┼éem --------------------------- */
/* Rozci─ůgni─Öty do prawej kraw─Ödzi kolumny, ┼╝eby ko┼äczy┼é si─Ö r├│wno z ramk─ů
   informacyjn─ů pod spodem, zamiast urywa─ç si─Ö w po┼éowie.                  */

.single-product form.cart:not(.grouped_form):not(.variations_form){
  display:flex;
  align-items:stretch;
  gap:12px;
}
.single-product form.cart .quantity{ flex:none; }
.single-product form.cart .single_add_to_cart_button{ flex:1; }

/* Napis nie mo┼╝e si─Ö ┼éama─ç - z ikon─ů koszyka zawija┼é si─Ö na dwie linie. */
.single_add_to_cart_button{
  white-space:nowrap;
}

/* ---- sekcja opisu jako akordeony -------------------------------------- */
/* Pasek zak┼éadek zamieniony na rozwijane sekcje (patrz assets/product.js).
   W─Ö┼╝sza kolumna, bo d┼éugi tekst na 1200 px ┼║le si─Ö czyta.                */

.woocommerce-tabs{
  max-width:820px;
  margin-inline:auto;
}

.pf-acc{
  border-bottom:1px solid rgba(64,70,47,.14);
}
.pf-acc:first-of-type{
  border-top:1px solid rgba(64,70,47,.14);
}

.pf-acc__head{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:18px;
  padding:22px 2px;
  cursor:pointer;
  list-style:none;
  user-select:none;
}
.pf-acc__head::-webkit-details-marker{ display:none; }
.pf-acc__head::marker{ content:""; }

.pf-acc__title{
  font-family:'Fraunces', Georgia, serif;
  font-size:21px;
  font-weight:700;
  color:var(--pf-olive);
  line-height:1.2;
}

.pf-acc__chev{
  flex:none;
  width:34px;
  height:34px;
  border-radius:50%;
  background:var(--pf-cream-deep);
  display:grid;
  place-items:center;
  transition:background .2s ease, transform .25s ease;
}
.pf-acc__chev::before{
  content:"";
  width:8px;
  height:8px;
  border-right:2px solid var(--pf-olive);
  border-bottom:2px solid var(--pf-olive);
  transform:translateY(-2px) rotate(45deg);
}
.pf-acc[open] .pf-acc__chev{ transform:rotate(180deg); }
.pf-acc__head:hover .pf-acc__chev{ background:var(--pf-sage); }
.pf-acc__head:focus-visible .pf-acc__chev{
  outline:3px solid var(--pf-red);
  outline-offset:2px;
}

.pf-acc__body{
  padding:0 2px 28px;
}

/* Podsekcje wewn─ůtrz akordeonu - np. dwa przepisy i wsp├│lny spos├│b
   przygotowania w sekcji ÔÇ×Przepisy". Mniejsze od tytu┼éu sekcji, ┼╝eby
   hierarchia by┼éa czytelna od razu.                                        */
.pf-acc__body h4{
  font-family:'Fraunces', Georgia, serif;
  font-size:16.5px;
  font-weight:700;
  color:var(--pf-olive);
  margin:26px 0 8px;
  padding-top:16px;
  border-top:1px solid rgba(64,70,47,.10);
}
.pf-acc__body h4:first-child{
  margin-top:0;
  padding-top:0;
  border-top:none;
}
.pf-acc__body > *:first-child{ margin-top:0; }
.pf-acc__body > *:last-child{ margin-bottom:0; }

/* Tabela warto┼Ťci od┼╝ywczych: bez ramek, same poziome linie - czy┼Ťciej. */
.pf-acc__body table,
.woocommerce-Tabs-panel table,
.woocommerce-product-attributes{
  border:none;
  border-collapse:collapse;
  width:100%;
}
.pf-acc__body table td,
.pf-acc__body table th,
.woocommerce-Tabs-panel table td,
.woocommerce-Tabs-panel table th,
.woocommerce-product-attributes th,
.woocommerce-product-attributes td{
  border:none;
  border-bottom:1px solid rgba(64,70,47,.12);
  padding:12px 4px;
  background:transparent !important;
}

@media (max-width:768px){
  .woocommerce-tabs{ max-width:none; }
  .pf-acc__title{ font-size:18px; }
  .single-product form.cart:not(.grouped_form):not(.variations_form){ gap:8px; }
}

/* ---- okruszki nad zdj─Öciem produktu ----------------------------------- */
/* Przeniesione z kolumny opisu (patrz mu-plugin profibra-product-page.php),
   bo tam spycha┼éy tytu┼é produktu ni┼╝ej ni┼╝ g├│rna kraw─Öd┼║ zdj─Öcia.         */

.pf-breadcrumb{
  max-width:1200px;
  margin:0 auto 22px;
  padding:0 5%;
  font-size:13px;
  line-height:1.5;
  letter-spacing:.2px;
}
.pf-breadcrumb a{
  color:rgba(64,70,47,.55);
  text-decoration:none;
  transition:color .18s ease;
}
.pf-breadcrumb a:hover,
.pf-breadcrumb a:focus-visible{
  color:var(--pf-red);
  text-decoration:underline;
  text-underline-offset:3px;
}
/* Ostatni cz┼éon to bie┼╝─ůcy produkt - ciemniejszy, bo to nie jest link. */
.pf-breadcrumb{ color:var(--pf-olive); font-weight:500; }
.pf-crumb-sep{
  display:inline-block;
  margin:0 8px;
  color:rgba(64,70,47,.32);
  font-weight:400;
}

/* ---- ramka z informacjami pod przyciskiem ----------------------------- */

.pf-product-info{
  list-style:none;
  margin:22px 0 0;
  padding:16px 18px;
  border:1px solid rgba(64,70,47,.14);
  border-radius:16px;
  background:rgba(255,255,255,.55);
  display:grid;
  gap:11px;
}
.pf-product-info li{
  display:flex;
  align-items:center;
  gap:12px;
  margin:0;
  font-size:14.5px;
  line-height:1.4;
  color:var(--pf-olive);
}
.pf-product-info__icon{
  flex:none;
  width:34px;
  height:34px;
  display:grid;
  place-items:center;
  border-radius:50%;
  background:var(--pf-sage);
  color:var(--pf-olive);
}
.pf-product-info__icon svg{ width:18px; height:18px; }

/* ---- ikona koszyka w przyciskach ÔÇ×dodaj do koszyka" -------------------- */

.single_add_to_cart_button::before,
.ast-sticky-add-to-cart .single_add_to_cart_button::before{
  content:"";
  display:inline-block;
  width:17px;
  height:17px;
  margin-right:9px;
  vertical-align:-3px;
  background-color:currentColor;
  -webkit-mask:var(--pf-cart-icon) center/contain no-repeat;
  mask:var(--pf-cart-icon) center/contain no-repeat;
}

:root{
  --pf-cart-icon:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='9' cy='20' r='1.4'/%3E%3Ccircle cx='18' cy='20' r='1.4'/%3E%3Cpath d='M2 3h2.6l2.2 11.2a1.6 1.6 0 0 0 1.6 1.3h8.4a1.6 1.6 0 0 0 1.6-1.3L22 7H5.6'/%3E%3C/svg%3E");
}

/* ---- przyklejony pasek ÔÇ×dodaj do koszyka" na karcie produktu ----------- */
/* Astra daje mu na sztywno karmelowe t┼éo (#A07C58), niezale┼╝nie od wariantu.
   Zamiast p┼éachty koloru: jasny, p├│┼éprzezroczysty panel z rozmyciem i cieniem
   od g├│ry ÔÇö unosi si─Ö nad tre┼Ťci─ů, nie konkuruje z ni─ů, a czerwony przycisk
   zostaje jedynym akcentem. Neutralny, wi─Öc pasuje do A, B i C.            */

/* Zewn─Ötrzny element zostaje wy┼é─ůcznie pozycjonowaniem ÔÇö ca┼éa oprawa
   przenosi si─Ö do ┼Ťrodka, dzi─Öki czemu pasek nie jest doklejony do do┼éu
   ekranu, tylko unosi si─Ö nad tre┼Ťci─ů jako osobna karta.
   pointer-events: przezroczyste boki nie mog─ů ┼éapa─ç klikni─Ö─ç.            */
.ast-sticky-add-to-cart{
  background:transparent !important;
  border:none !important;
  box-shadow:none !important;
  -webkit-backdrop-filter:none;
  backdrop-filter:none;
  padding:0 16px 18px !important;
  pointer-events:none;
}

.ast-sticky-add-to-cart .ast-container{
  pointer-events:auto;
  max-width:880px;
  margin-inline:auto;
  padding:8px 10px !important;
  background:rgba(255,255,255,.92);
  -webkit-backdrop-filter:blur(14px);
  backdrop-filter:blur(14px);
  border:1px solid rgba(64,70,47,.12);
  border-radius:18px;
  box-shadow:0 16px 42px -14px rgba(46,42,34,.45);
}

/* D┼éuga nazwa ┼éama┼éa si─Ö na dwie linie i rozpycha┼éa kart─Ö - przycinamy. */
.ast-sticky-add-to-cart-title{
  color:var(--pf-olive) !important;
  font-weight:600;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
  max-width:340px;
}

.ast-sticky-add-to-cart-action-price,
.ast-sticky-add-to-cart-action-price .amount,
.ast-sticky-add-to-cart-action-price .woocommerce-Price-currencySymbol{
  color:var(--pf-olive) !important;
  font-weight:700;
  font-size:19px;
}

/* Miniatura: zaokr─ůglona, na delikatnym tle ÔÇö pusty placeholder
   przestaje wygl─ůda─ç jak dziura w pasku. */
.ast-sticky-add-to-cart img{
  width:44px !important;
  height:44px !important;
  border-radius:10px;
  background:var(--pf-cream-deep);
  object-fit:cover;
}

/* Pasek ma by─ç dyskretny ÔÇö bez tego miniatura i przycisk rozpychaj─ů go
   wy┼╝ej ni┼╝ oryginalny, doklejony wariant. */
.ast-sticky-add-to-cart-content{ padding:0 !important; }
.ast-sticky-add-to-cart-title-wrap{ gap:12px; }

.ast-sticky-add-to-cart .quantity input{
  border-radius:10px;
  border:1px solid rgba(64,70,47,.18);
}

.ast-sticky-add-to-cart .single_add_to_cart_button{
  border-radius:999px !important;
  background:var(--pf-red) !important;
  border-color:var(--pf-red) !important;
  padding:11px 26px !important;
  letter-spacing:.3px;
  transition:background .2s ease, transform .2s ease;
}
.ast-sticky-add-to-cart .single_add_to_cart_button:hover{
  background:var(--pf-red-dark) !important;
  transform:translateY(-1px);
}

@media (max-width:768px){
  .pf-hero{ padding:44px 6% 0; }
  .pf-hero-media .wp-block-image{ border-radius:22px; }
  .ast-sticky-add-to-cart .single_add_to_cart_button{ padding:11px 20px !important; }
  .ast-sticky-add-to-cart-action-price{ font-size:17px; }
}

@media (prefers-reduced-motion: reduce){
  .pf-hero-media--ready .wp-block-image{ transition:opacity .01s linear; }
  .pf-hero-media--ready .wp-block-image.is-active img{ animation:none; transform:none; }
  .pf-trust-item{ transition:none; }
}
/* ==========================================================================
   PODGLAD WERSJA B ÔÇö nowa kolorystyka klienta (identyfikacja v2)
   Przelacznik widoczny tylko dla osob z dostepem (strona i tak w trybie maintenance)
   ========================================================================== */
html.theme-b{
  --pf-caramel:#26985A;
  --pf-sage:#C9D2B3;
  --pf-pink:#F5C9BF;
  --pf-text:#1D1D1D;
  --pf-cream:#EFF1E8;
  --pf-cream-deep:#DADADA;
}

html.theme-b .pf-trustbar{
  background:#B01A1D !important;   /* bordo (akcent) - 14.09, bylo zielone #26985A */
}
html.theme-b .pf-cat-cols > .pf-cat-card:nth-child(2){
  background:#C9D2B3 !important;
}
html.theme-b #colophon,
html.theme-b .site-footer,
html.theme-b .ast-small-footer{
  background:#26985A !important;
}
html.theme-b .site-below-footer-wrap{
  background:#1E7A48 !important;
}
html.theme-b .astra-cart-drawer{
  background:#FFFFFF !important;
}
html.theme-b .pf-hero{
  background:#EFF1E8 !important;
}
html.theme-b .pf-featured{
  background:#EFF1E8 !important;
}
html.theme-b .pf-about-teaser{
  background:#EFF1E8 !important;
}
html.theme-b body{
  color:#1D1D1D;
}

#pf-theme-toggle-btn{
  font-family: sans-serif;
}

/* v24: wiekszy odstep pod nawigacja na stronach O nas / Kontakt */
.pf-about-hero{ padding-top:110px !important; }

/* v25: ogolne tlo strony (w tym Sklep/kategorie) tez ma sie zmieniac w trybie B */
html.theme-b body{
  background:#EFF1E8 !important;
}
html.theme-b .site-content,
html.theme-b .ast-woocommerce-container{
  background:#EFF1E8 !important;
}

/* v26: czytelnosc tekstu w stopce w trybie B (ciemnozielone tlo) */
html.theme-b #colophon *,
html.theme-b .site-footer *{
  color:#FFFFFF !important;
}
html.theme-b #colophon h1,
html.theme-b #colophon h2,
html.theme-b #colophon h3,
html.theme-b #colophon h4,
html.theme-b #colophon h5{
  color:#FFFFFF !important;
}
html.theme-b #colophon a,
html.theme-b .site-footer a{
  color:#F5C9BF !important;
}
html.theme-b #colophon a:hover,
html.theme-b .site-footer a:hover{
  color:#FFFFFF !important;
}

/* ==========================================================================
   WARIANT C ÔÇö oficjalna paleta z ksi─Ögi (ProFibra Identyfikacja 2026 v2/v3)
   Pasek zaufania jako sza┼éwiowa karta zamiast pe┼énoekranowej p┼éachty.
   ========================================================================== */

html.theme-c{
  --pf-olive:#40462F;        /* CMYK 67/50/76/55 */
  --pf-green:#26985A;        /* CMYK 80/15/80/0 ÔÇö AKCENT, nie t┼éo */
  --pf-red:#B51917;          /* CMYK 19/100/100/12 */
  --pf-red-dark:#8E1312;
  --pf-caramel:#26985A;
  --pf-sage:#C9D2B3;         /* CMYK 26/10/35/0 */
  --pf-pink:#F5C9BF;         /* CMYK 2/27/22/0 */
  --pf-grey:#DADADA;         /* CMYK 0/0/0/20 */
  --pf-cream:#EFF1E8;
  --pf-cream-deep:#EDEFE7;
  --pf-text:#1D1D1D;         /* CMYK 0/0/0/100 */
}

/* T┼éo strony: bardzo lekki odcie┼ä sza┼éwii, nie ciep┼éy be┼╝ z wariantu A.
   Astra ustawia body na #F7F1E6 niezale┼╝nie od wariantu, wi─Öc w C trzeba
   je nadpisa─ç ÔÇö inaczej hero jest prawie bia┼éy, a reszta strony be┼╝owa.
   Trzy stopnie z jednej barwy: biel (nag┼é├│wek, karty) Ôćĺ #F5F7F0 (strona)
   Ôćĺ #C9D2B3 (pasek zaufania).                                            */
html.theme-c body{ background-color:#F5F7F0 !important; }
html.theme-c .pf-hero{ background:transparent; }

/* Pasek zaufania: karta, nie p┼éachta.
   Odst─Öp nad i pod kart─ů MUSI by─ç r├│wny ÔÇö inaczej karta wygl─ůda,
   jakby spad┼éa na g├│rn─ů kraw─Öd┼║ t┼éa.                                       */
html.theme-c .pf-trustbar{
  background:transparent !important;
  padding:44px 5% !important;
  border-radius:0;
  position:relative;
  z-index:2;
}
html.theme-c .pf-trustbar::before{ display:none !important; }

html.theme-c .pf-trust-cols{
  background:var(--pf-sage);
  border-radius:36px;
  padding:44px 20px 38px;
  max-width:1180px;
  margin-inline:auto;
}

/* Piecz─ůtki to jednokolorowa kremowa grafika ÔÇö na jasnej sza┼éwii
   znikn─Ö┼éyby, wi─Öc przyciemniamy je filtrem. Bez podmiany plik├│w. */
html.theme-c .pf-trust-badge{ filter:brightness(0) opacity(.78); }
html.theme-c .pf-trust-item:has(a:hover) .pf-trust-badge{ filter:brightness(0) opacity(.95); }

html.theme-c .pf-trust-label{
  color:var(--pf-olive) !important;
  font-weight:700;
  letter-spacing:.4px;
}
html.theme-c .pf-trust-item:has(a:hover) .pf-trust-label,
html.theme-c .pf-trust-item:has(a:focus-visible) .pf-trust-label{
  color:var(--pf-red) !important;
}
html.theme-c .pf-trust-label a:focus-visible::after{
  outline:3px solid var(--pf-red);
  outline-offset:0;
}

html.theme-c .pf-eyebrow{ color:var(--pf-red); }
html.theme-c .pf-hero-title,
html.theme-c .pf-section-title{ color:var(--pf-olive); }

@media (max-width:768px){
  html.theme-c .pf-trustbar{ padding:28px 5% !important; }
  html.theme-c .pf-trust-cols{ border-radius:28px; padding:32px 14px 24px; }
}

/* ==========================================================================
   v27 (14.09.2026) - TYPOGRAFIA + PRZYCISKI wg zatwierdzonego mockupu ÔÇ×Paleta ProFibra".
   Powod: mockup wygladal wyraznie lepiej niz zywy sklep - roznica to CZCIONKA
   (tresc w Figtree = miekki grotesk; zywy sklep uzywal domyslnej Astry) oraz
   ciezszy/ciasniejszy Fraunces na naglowkach. Blok na koncu pliku = wygrywa w kaskadzie.
   ========================================================================== */
body,
button, input, select, textarea,
p, li, a, span,
.woocommerce, .woocommerce-page,
.pf-hero-text, .pf-trust-label,
.wp-block-button__link,
.main-header-menu .menu-item > a{
  font-family:'Figtree', system-ui, -apple-system, 'Segoe UI', sans-serif;
}

/* naglowki: Fraunces ciezszy i ciasniejszy - jak w mockupie */
h1, h2, h3,
.pf-hero-title, .pf-section-title, .pf-about-title{
  font-family:'Fraunces', Georgia, serif !important;
  font-weight:900 !important;
  letter-spacing:-0.015em;
}
.pf-hero-title{ line-height:1.03; }

/* eyebrow: zielony akcent (bylo czerwone), jak ÔÇ×kick" w mockupie */
.pf-eyebrow{
  color:#26985A !important;
  letter-spacing:.16em;
  font-weight:800;
}

/* przyciski: pigulka wg mockupu - spojny padding/waga, Figtree, sentence-case */
.pf-btn .wp-block-button__link,
.pf-btn-outline .wp-block-button__link{
  padding:13px 28px !important;
  font-weight:700 !important;
  font-size:15px !important;
  letter-spacing:0 !important;
  text-transform:none !important;
}

/* ==========================================================================
   v28 (14.09.2026) - KARTY PRODUKTOW wg mockupu (biala karta, cien, zielony ÔÇ×Do koszyka").
   Jeden styl dla WSZEDZIE: Sklep (/shop/), kategorie, sekcja ÔÇ×Nasze produkty" na
   stronie glownej - WooCommerce uzywa tego samego li.product. Przycisk ÔÇ×add_cart"
   wlaczony w strukturze kafelka Astry (astra-settings > shop-product-structure).
   Struktura kafelka: li.product > .astra-shop-thumbnail-wrap (zdjecie)
                                  > .astra-shop-summary-wrap (kategoria, tytul, cena)
                                  > a.button (przycisk, dodany po summary).
   ========================================================================== */
.woocommerce ul.products li.product{
  background:#FFFFFF !important;
  border:1px solid rgba(20,30,18,.08);
  border-radius:16px;
  padding:14px 14px 16px !important;
  box-shadow:0 1px 2px rgba(20,30,18,.06);
  text-align:left !important;
  display:flex;
  flex-direction:column;
  transition:transform .25s ease, box-shadow .25s ease;
}
.woocommerce ul.products li.product:hover{
  transform:translateY(-4px);
  box-shadow:0 20px 34px -18px rgba(20,30,18,.35);
}
.woocommerce ul.products li.product .astra-shop-thumbnail-wrap{ margin-bottom:12px; }
.woocommerce ul.products li.product img{ border-radius:10px !important; background:#fff; }

/* kategoria: drobna, zielona, nad tytulem */
.woocommerce ul.products li.product .ast-woo-product-category{
  font-size:11px !important;
  letter-spacing:.07em;
  text-transform:uppercase;
  color:#26985A !important;
  font-weight:700 !important;
  margin-bottom:2px;
}
/* tytul: Figtree (nie ciezki serif), lewa strona */
.woocommerce ul.products li.product .woocommerce-loop-product__title{
  font-family:'Figtree', sans-serif !important;
  font-weight:700 !important;
  font-size:15px !important;
  line-height:1.3 !important;
  color:#1D1D1D !important;
  letter-spacing:0 !important;
  text-align:left !important;
  padding:0 !important;
  margin:0 0 6px !important;
}
/* cena: Fraunces bordo, dosunieta do dolu karty */
.woocommerce ul.products li.product .price{
  font-family:'Fraunces', serif !important;
  color:var(--pf-red) !important;
  font-weight:700 !important;
  font-size:19px !important;
  margin-top:auto !important;
}
.woocommerce ul.products li.product .price del{ color:#9a9a90 !important; font-weight:400; opacity:1; }
.woocommerce ul.products li.product .price ins{ text-decoration:none; }

/* przycisk ÔÇ×Dodaj do koszyka" / ÔÇ×Wybierz opcje": zielona pigulka, cala szerokosc */
.woocommerce ul.products li.product a.button,
.woocommerce ul.products li.product a.added_to_cart{
  display:block !important;
  text-align:center;
  width:100%;
  background:#26985A !important;
  color:#fff !important;
  border-radius:999px !important;
  font-family:'Figtree', sans-serif !important;
  font-weight:700 !important;
  font-size:13px !important;
  letter-spacing:.02em;
  padding:11px 14px !important;
  margin-top:12px !important;
  border:none !important;
  transition:background .2s ease, transform .12s ease !important;
}
.woocommerce ul.products li.product a.button:hover{
  background:#1E7A48 !important;
  transform:translateY(-1px);
  box-shadow:0 8px 18px -8px rgba(30,122,72,.6);
}
.woocommerce ul.products li.product a.button{ text-transform:none !important; }

/* ==========================================================================
   v29 (14.09.2026) - dopelnienie kafelka do mockupu 1:1:
   badge ÔÇ×Nowosc", cena za kg pod cena, licznik ilosci (- 1 +) obok przycisku.
   Elementy dokladane przez mu-plugin profibra-woo-core.php.
   ========================================================================== */
.woocommerce ul.products li.product{ position:relative; }

.pf-badge-nowosc{
  position:absolute; top:22px; left:22px; z-index:3;
  background:#26985A; color:#fff;
  font-family:'Figtree', sans-serif; font-size:10px; font-weight:800;
  letter-spacing:.08em; text-transform:uppercase;
  padding:4px 9px; border-radius:6px;
  box-shadow:0 2px 6px rgba(20,30,18,.18);
}

.pf-price-kg{
  display:block; font-family:'Figtree', sans-serif;
  font-size:11.5px; font-weight:500; color:#8a8f80;
  margin-top:1px; letter-spacing:0;
}

/* rzad zakupu: licznik + przycisk obok siebie (przycisk NIE na cala szerokosc) */
.woocommerce ul.products li.product .pf-buy-row{
  display:flex; gap:8px; align-items:stretch; margin-top:12px;
}
.woocommerce ul.products li.product .pf-buy-row a.button{
  margin-top:0 !important; width:auto !important; flex:1; align-self:stretch;
}
.pf-qty{
  display:flex; align-items:center; flex:none;
  border:1px solid rgba(20,30,18,.15); border-radius:8px; overflow:hidden; background:#fff;
}
.pf-qty button{
  width:30px; min-height:40px; border:none; background:transparent;
  font-size:17px; line-height:1; color:#5b6053; cursor:pointer; padding:0;
  transition:background .15s ease;
}
.pf-qty button:hover{ background:rgba(20,30,18,.05); }
.pf-qty-val{
  width:28px; text-align:center; font-family:'Figtree', sans-serif;
  font-weight:600; font-size:14px; font-variant-numeric:tabular-nums; color:#1D1D1D;
}

/* ==========================================================================
   v30 (14.09.2026) - HERO: korzysci z ikonkami po lewej (styl zrzut3 ÔÇ×Piekarnia Hert").
   Blok wstawiany jako wp:html w kolumnie lewej hero (miedzy tekstem a przyciskiem).
   Cechy PRODUKTU (nie zakupu - te sa w pasku zaufania).
   ========================================================================== */
.pf-hero-benefits{
  list-style:none; margin:4px 0 26px; padding:0;
  display:grid; grid-template-columns:1fr 1fr; gap:13px 22px; max-width:470px;
}
.pf-hero-benefits li{
  display:flex; align-items:center; gap:10px;
  font-family:'Figtree', system-ui, sans-serif; font-weight:600; font-size:15px;
  color:var(--pf-olive);
}
.pf-hb-ico{
  width:24px; height:24px; flex:none; border-radius:999px;
  background:#26985A; color:#fff;
  display:flex; align-items:center; justify-content:center;
}
.pf-hb-ico svg{ width:14px; height:14px; }
@media (max-width:768px){
  .pf-hero-benefits{ grid-template-columns:1fr 1fr; gap:11px 16px; margin-inline:auto; }
}

/* 14.09 - hero = plakaty (worek+wypiek), nie zdjecia do panoramowania.
   Wylaczamy Ken Burns (zoom), zostaje czysty crossfade jak w podgladzie. */
.pf-hero-media--ready .wp-block-image img,
.pf-hero-media--ready .wp-block-image.is-active img,
.pf-hero-media--ready .wp-block-image:nth-child(2) img{
  animation:none !important;
  transform:none !important;
}

/* 14.09 - centrowanie lewej kolumny hero PROBOWANE i COFNIETE (Filip woli do lewej). */

/* ==========================================================================
   v31 (15.09.2026) - STRONA GLOWNA: produkty w JEDNYM RZEDZIE + strzalki (jak ÔÇ×zrzut").
   Tylko sekcja .pf-featured (strona glowna). Sklep /shop/ zostaje pelna siatka.
   Strzalki tworzy JS profibra_carousel_js (mu-plugin).
   ========================================================================== */
.pf-featured .woocommerce{ position:relative; }
.pf-featured ul.products{
  display:flex !important;
  flex-wrap:nowrap !important;
  overflow-x:auto;
  gap:18px;
  margin:0 !important;
  padding:4px 2px 8px !important;
  scroll-snap-type:x proximity;
  scrollbar-width:none;
  -ms-overflow-style:none;
}
.pf-featured ul.products::-webkit-scrollbar{ display:none; }
.pf-featured ul.products li.product{
  flex:0 0 auto !important;
  width:250px !important;
  max-width:80vw;
  margin:0 !important;
  scroll-snap-align:start;
}
.pf-carousel-arrow{
  position:absolute; top:42%; transform:translateY(-50%);
  width:46px; height:46px; border-radius:999px; border:none;
  background:#fff; color:var(--pf-olive);
  box-shadow:0 6px 18px -6px rgba(20,30,18,.45);
  font-size:26px; line-height:1; cursor:pointer; z-index:6;
  display:flex; align-items:center; justify-content:center;
  transition:background .15s ease, transform .15s ease, opacity .15s ease;
}
.pf-carousel-arrow:hover{ background:var(--pf-olive); color:#fff; }
.pf-carousel-arrow:active{ transform:translateY(-50%) scale(.94); }
.pf-carousel-arrow.pf-prev{ left:-8px; }
.pf-carousel-arrow.pf-next{ right:-8px; }
.pf-carousel-arrow[hidden]{ display:none !important; }

/* Poprawki galerii WooCommerce - v32 */
.woocommerce div.product .woocommerce-product-gallery .woocommerce-product-gallery__image {
    aspect-ratio: 1 / 1 !important;
    display: flex !important;
    align-items: center;
    justify-content: center;
    background: #fff;
    overflow: hidden;
}
.woocommerce div.product .woocommerce-product-gallery .woocommerce-product-gallery__image img {
    object-fit: contain !important;
    width: 100% !important;
    height: 100% !important;
    margin: 0 !important;
}
.woocommerce div.product .woocommerce-product-gallery .flex-control-thumbs {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    margin-top: 15px;
    padding: 0;
}
.woocommerce div.product .woocommerce-product-gallery .flex-control-thumbs li {
    width: calc(25% - 7.5px) !important;
    float: none !important;
    margin: 0 !important;
}
.woocommerce div.product .woocommerce-product-gallery .flex-control-thumbs li img {
    aspect-ratio: 1 / 1 !important;
    object-fit: contain !important;
    background: #fff;
    border: 1px solid #eaeaea;
    border-radius: 8px !important;
    padding: 5px;
}
.woocommerce div.product .woocommerce-product-gallery .flex-viewport {
    height: auto !important;
}

/* Fixy dla przepis├│w - animacje i t┼éa */
.pf-recipes-section {
    background-color: #ffffff !important;
    padding: 60px 20px !important;
    margin-top: 40px;
    border-radius: 16px;
    box-shadow: 0 10px 30px rgba(0,0,0,0.03);
}
.pf-recipe-card {
    transition: all 0.3s ease !important;
}
.pf-recipe-card:hover {
    box-shadow: 0 20px 40px rgba(0,0,0,0.1) !important;
    transform: translateY(-8px) !important;
}
.pf-video-container .wp-block-video {
    margin: 0 !important;
}
.pf-video-container video {
    width: 100% !important;
    height: auto !important;
    display: block !important;
    max-height: 600px;
    object-fit: contain;
    background: #000;
}

/* Poprawki zg┼éoszone przez u┼╝ytkownika: pe┼éna szeroko┼Ť─ç i mocniejszy hover */
.pf-recipes-section {
    background-color: #ffffff !important;
    padding: 80px 5% !important;
    margin: 0 !important;
    border-radius: 0 !important;
    box-shadow: none !important;
}
.pf-recipes-section > .wp-block-heading,
.pf-recipes-section > p,
.pf-recipes-section > .pf-recipes-grid,
.pf-recipes-section > div {
    max-width: 1200px;
    margin-left: auto;
    margin-right: auto;
}
.pf-recipe-card {
    transition: all 0.4s cubic-bezier(0.175, 0.885, 0.32, 1.275) !important;
}
.pf-recipe-card:hover {
    box-shadow: 0 25px 50px rgba(0,0,0,0.15) !important;
    transform: translateY(-12px) !important;
}
.pf-recipe-img-wrapper img {
    transition: transform 0.5s ease;
}
.pf-recipe-card:hover .pf-recipe-img-wrapper img {
    transform: scale(1.05);
}
/* Poprawka dla wideo: wy┼Ťrodkowanie i bezpieczne ramy */
.pf-video-container {
    max-width: 100%;
    margin: 0 auto 40px auto;
    background: #000;
    border-radius: 12px;
    overflow: hidden;
    box-shadow: 0 10px 30px rgba(0,0,0,0.15);
    display: flex;
    justify-content: center;
    align-items: center;
}
.pf-video-container .wp-block-video {
    margin: 0 !important;
    width: 100%;
}
.pf-video-container video {
    width: 100% !important;
    height: auto !important;
    max-height: 600px;
    object-fit: contain;
    display: block;
}

/* Z┼éagodzenie animacji kart przepis├│w wg pro┼Ťby */
.pf-recipe-card:hover {
    box-shadow: 0 15px 30px rgba(0,0,0,0.08) !important;
    transform: translateY(-4px) !important;
}
.pf-recipe-card:hover .pf-recipe-img-wrapper img {
    transform: scale(1.02);
}

/* Fix ucinania wideo (nadpisanie domy┼Ťlnych styl├│w WP/Astry) */
.pf-video-container figure.wp-block-video {
    width: 100% !important;
    height: 100% !important;
    max-height: 600px;
    display: flex;
    justify-content: center;
    align-items: center;
    aspect-ratio: auto !important; /* Wy┼é─ůcza sztywne 16:9 z WP */
}
.pf-video-container video {
    width: 100% !important;
    height: 100% !important;
    max-height: 600px !important;
    object-fit: contain !important;
}
:-webkit-full-screen video {
    object-fit: contain !important;
}
:-moz-full-screen video {
    object-fit: contain !important;
}
:fullscreen video {
    object-fit: contain !important;
}
´╗┐
/* P┼éynne przewijanie dla kotwic (np. #przepisy) */
html {
    scroll-behavior: smooth;
}
´╗┐
/* Poprawka wygl─ůdu menu mobilnego (usuwa br─ůzowe t┼éo) */
#ast-mobile-popup,
#ast-mobile-popup-wrap,
.ast-mobile-popup-drawer,
.ast-mobile-popup-inner {
    background-color: #ffffff !important;
}
#ast-mobile-popup a,
.ast-mobile-popup-drawer a {
    color: #333333 !important;
    font-family: 'Figtree', sans-serif !important;
    font-size: 18px !important;
    font-weight: 600 !important;
}
#ast-mobile-popup .menu-item:hover > a,
#ast-mobile-popup .current-menu-item > a,
.ast-mobile-popup-drawer .menu-item:hover > a,
.ast-mobile-popup-drawer .current-menu-item > a {
    color: #26985A !important;
}
#ast-mobile-popup .ast-close-svg,
.ast-mobile-popup-drawer .ast-close-svg {
    fill: #333333 !important;
    color: #333333 !important;
}
´╗┐
/* Fix: usuni─Öcie br─ůzowego t┼éa spod poszczeg├│lnych napis├│w w menu */
.ast-mobile-popup-drawer ul,
.ast-mobile-popup-drawer li,
.ast-mobile-popup-drawer a,
.ast-mobile-popup-drawer .ast-builder-menu-mobile,
.ast-mobile-popup-drawer .main-header-menu,
.ast-mobile-popup-drawer .menu-item,
#ast-mobile-popup ul,
#ast-mobile-popup li,
#ast-mobile-popup a,
#ast-mobile-popup .ast-builder-menu-mobile,
#ast-mobile-popup .main-header-menu,
#ast-mobile-popup .menu-item {
    background-color: transparent !important;
    background: transparent !important;
}

﻿
/* Wymuszenie idealnego kwadratu dla miniatur przepisow (nadpisanie ewentualnych starych stylow) */
.pf-recipe-img-wrapper {
    height: auto !important;
    aspect-ratio: 1 / 1 !important;
}
.pf-recipe-img-wrapper img {
    height: 100% !important;
    object-fit: cover !important;
}

/* 16.09.2026 - link powrotny na stronie pojedynczego przepisu */
.pf-recipe-back {
  display: inline-block;
  color: #26985A;
  font-weight: 700;
  font-size: 14px;
  text-decoration: none;
  letter-spacing: .02em;
}
.pf-recipe-back:hover {
  text-decoration: underline;
}

/* 16.09.2026 - tekst przepisu pod wideo (opcjonalny, klientka dopisuje w edytorze) */
.pf-recipe-text {
  text-align: left;
  max-width: 640px;
  margin: 0 auto;
  color: #333;
  font-size: 16px;
  line-height: 1.75;
}
.pf-recipe-text h2, .pf-recipe-text h3 {
  font-family: 'Fraunces', serif;
  color: #26985A;
  margin-top: 32px;
  margin-bottom: 12px;
}
.pf-recipe-text ul, .pf-recipe-text ol {
  padding-left: 22px;
  margin-bottom: 16px;
}
.pf-recipe-text p {
  margin-bottom: 16px;
}

/* 16.09.2026 - uklad przepisu: film obok tekstu na desktopie, pod spodem na mobile */
.pf-video-container {
  background: #000;
  border-radius: 12px;
  overflow: hidden;
  box-shadow: 0 10px 20px rgba(0,0,0,0.2);
}
.pf-video-container--solo {
  max-width: 760px;
  margin: 0 auto 40px;
}
.pf-recipe-layout {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 40px;
  align-items: start;
  margin-bottom: 40px;
}
.pf-recipe-layout .pf-recipe-media {
  position: sticky;
  top: 24px;
}
.pf-recipe-layout .pf-recipe-text {
  max-width: none;
  margin: 0;
}
@media (max-width: 900px) {
  .pf-recipe-layout {
    grid-template-columns: 1fr;
    gap: 24px;
  }
  .pf-recipe-layout .pf-recipe-media {
    position: static;
  }
}

/* 16.09.2026 - poprawki ze zrzutow z telefonu Filipa (numeracja jak w zgloszeniu) */

/* 1/2: przycisk "Dodaj do koszyka" - tekst z ikona wyglada na "ucieta" prawa
   strone, bo przycisk nie centrowal tresci i mial niesymetryczny padding. */
.single_add_to_cart_button{
  display:inline-flex !important;
  align-items:center;
  justify-content:center;
  padding:14px 22px !important;
  text-align:center;
}

/* 4/6: koszyk i kasa "przyklejone do lewej" na telefonie. Przyczyna: Astra
   w trybie ast-plain-container daje blokom "alignwide" ujemny margines
   (do -20px z kazdej strony), zeby "wide" tresci mogly wychodzic poza
   kolumne - ale koszyk/kasa to zwykla tresc, nie ma wychodzic poza margines.
   Zerujemy ten ujemny margines tylko dla tych dwoch blokow. */
.entry-content[data-ast-blocks-layout] > .wp-block-woocommerce-cart.alignwide,
.entry-content[data-ast-blocks-layout] > .wp-block-woocommerce-checkout.alignwide{
  margin-left:0 !important;
  margin-right:0 !important;
}

/* 5: komunikat "dodano do koszyka" mial gorny pasek i ikonke w naszym bordo
   (kolor akcji/bledu), przez co wygladal jak ostrzezenie zamiast sukcesu.
   Dotyczy WYLACZNIE .woocommerce-message (sukces) - .woocommerce-error
   i .woocommerce-info zostaja bez zmian. */
.woocommerce-message{
  border-top-color:#26985A !important;
}
.woocommerce-message::before{
  color:#26985A !important;
}

/* 7: strona 404 miala karmelowe tlo (#A07C58) z bazowego motywu Astry -
   nigdy nie przeszlo na zielona/popielata paleta jak reszta strony. */
.error-404.not-found{
  background:#EFF1E8 !important;
}

/* 16.09.2026 - "placek" na kafelku produktu po dodaniu do koszyka. Przyczyna:
   WooCommerce po udanym AJAX dodaniu dokleja obok przycisku link "Zobacz
   koszyk" (a.added_to_cart) - wiersz .pf-buy-row (licznik + przycisk) nie byl
   projektowany na trzeci element, robilo sie ciasno, tekst lamal sie na dwie
   linie i przy border-radius:999px waski+wysoki przycisk wygladal jak kolo.
   Fix: link niepotrzebny (ikona koszyka w naglowku i tak zawsze widoczna) -
   ukryty na kafelkach listingu, zeby wiersz zostal przy swoich 2 elementach. */
.woocommerce ul.products li.product a.added_to_cart{
  display:none !important;
}

/* 16.09.2026 - siatka kart przepisow (.pf-recipe-card). Przeniesione z inline <style>
   w shortcode [profibra_przepisy] do custom.css, bo teraz uzywane w 3 miejscach
   (strona glowna, archiwum /przepisy/, nowa sekcja na karcie produktu) - jedno
   zrodlo stylu zamiast duplikowania <style> w kazdej funkcji. */
.pf-recipes-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
    gap: 20px;
    margin: 20px 0;
}
.pf-recipe-card {
    border: 1px solid #eaeaea;
    border-radius: 12px;
    overflow: hidden;
    background: #fff;
    transition: box-shadow 0.3s;
    display: flex;
    flex-direction: column;
}
.pf-recipe-card:hover {
    box-shadow: 0 10px 20px rgba(0,0,0,0.05);
}
.pf-recipe-img-wrapper {
    aspect-ratio: 1/1;
    overflow: hidden;
}
.pf-recipe-img-wrapper img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}
.pf-recipe-content {
    padding: 20px;
    display: flex;
    flex-direction: column;
    flex-grow: 1;
}
.pf-recipe-label {
    color: #26985A;
    font-weight: bold;
    font-size: 11px;
    letter-spacing: 1px;
    text-transform: uppercase;
    margin-bottom: 10px;
}
.pf-recipe-title {
    font-family: 'Fraunces', serif !important;
    font-size: 24px;
    margin: 0 0 15px 0;
    color: #333;
}
.pf-recipe-title a {
    color: inherit;
    text-decoration: none;
}
.pf-recipe-readmore {
    color: #B01A1D;
    font-weight: 700;
    text-decoration: none;
    margin-top: auto;
    font-size: 14px;
}
.pf-recipe-readmore:hover {
    text-decoration: underline;
}

/* 16.09.2026 - sekcja "Przepisy z ta mieszanka" na karcie produktu */
.pf-product-recipes {
    max-width: 1200px;
    margin: 50px auto 0;
    padding: 0 5% 10px;
}
.pf-product-recipes-title {
    font-family: 'Fraunces', serif;
    font-size: 28px;
    color: var(--pf-olive);
    text-align: center;
    margin-bottom: 24px;
}

/* 17.09.2026 - kafelek + lightbox dla ogolnego wideo o produkcie (np. "Poznaj Uniwersalna Mieszanke") w hero.
   Film ma inny ksztalt (pionowy) niz kwadratowe kafelki przepisow, wiec zamiast wciskac go
   w siatke, odtwarza sie na srodku ekranu w naturalnych proporcjach (lightbox). */
.pf-video-teaser{
  display:flex;
  align-items:center;
  gap:12px;
  margin-top:22px;
  padding:8px 18px 8px 8px;
  background:#fff;
  border-radius:999px;
  box-shadow:0 10px 30px -14px rgba(46,42,34,0.35);
  cursor:pointer;
  width:fit-content;
  transition:transform .2s ease, box-shadow .2s ease;
}
.pf-video-teaser:hover{
  transform:translateY(-2px);
  box-shadow:0 14px 34px -14px rgba(46,42,34,0.42);
}
.pf-video-teaser-thumb{
  position:relative;
  width:48px;
  height:48px;
  border-radius:50%;
  overflow:hidden;
  flex-shrink:0;
}
.pf-video-teaser-thumb img{
  width:100%;
  height:100%;
  object-fit:cover;
  display:block;
}
.pf-video-teaser-play{
  position:absolute;
  inset:0;
  display:flex;
  align-items:center;
  justify-content:center;
  background:rgba(46,42,34,0.4);
}
.pf-video-teaser-play svg{
  width:16px;
  height:16px;
  fill:#fff;
  margin-left:2px;
}
.pf-video-teaser-text{
  line-height:1.3;
}
.pf-video-teaser-label{
  display:block;
  font-size:14px;
  font-weight:700;
  color:var(--pf-olive);
}
.pf-video-teaser-sub{
  display:block;
  font-size:12px;
  color:var(--pf-text);
  opacity:.65;
}
.pf-video-lightbox{
  display:none;
  position:fixed;
  inset:0;
  background:rgba(20,18,14,0.9);
  z-index:9999;
  align-items:center;
  justify-content:center;
  padding:24px;
}
.pf-video-lightbox.is-open{ display:flex; }
.pf-video-lightbox video{
  max-width:min(420px, 90vw);
  max-height:85vh;
  border-radius:16px;
  box-shadow:0 30px 80px -20px rgba(0,0,0,0.6);
  background:#000;
}
.pf-video-lightbox-close{
  position:absolute;
  top:24px;
  right:24px;
  width:44px;
  height:44px;
  border-radius:50%;
  background:rgba(255,255,255,0.14);
  border:none;
  color:#fff;
  font-size:26px;
  line-height:1;
  cursor:pointer;
  display:flex;
  align-items:center;
  justify-content:center;
}
.pf-video-lightbox-close:hover{ background:rgba(255,255,255,0.26); }

/* 17.09.2026 - wersja plywajaca kafelka wideo (zamiast statycznego pod hero).
   Pojawia sie (fade+slide) dopiero gdy sekcja "Przepisy z Uniwersalnej" wjezdza w widok -
   ten sam mechanizm co sticky "Dodaj do koszyka" na karcie produktu (Astra), tylko wlasny. */
.pf-video-teaser--floating{
  position:fixed;
  top:96px;
  left:24px;
  z-index:500;
  margin-top:0;
  opacity:0;
  transform:translateX(-24px);
  pointer-events:none;
  transition:opacity .35s ease, transform .35s ease;
}
.pf-video-teaser--floating.is-visible{
  opacity:1;
  transform:translateX(0);
  pointer-events:auto;
}
@media (max-width:600px){
  .pf-video-teaser--floating{ top:auto; bottom:16px; left:16px; right:16px; width:calc(100% - 32px); }
  .pf-video-teaser--floating .pf-video-teaser-text{ flex:1; }
}

/* 17.09.2026 - przycisk X do recznego wylaczenia plywajacego kafelka wideo (Filip).
   Fix: motyw (Astra) narzuca domyslny padding/wyglad na kazdy <button> - bez
   jawnego resetu X urosl do owalu zaslaniajacego tresc. Teraz jawnie zerowany. */
.pf-video-teaser--floating{
  padding-right:30px;
  border:1.5px solid var(--pf-sage);
}
.pf-video-teaser-dismiss{
  all:unset;
  box-sizing:border-box;
  position:absolute;
  top:-7px;
  right:-7px;
  width:20px;
  height:20px;
  border-radius:50%;
  background:var(--pf-olive);
  color:#fff;
  border:2px solid #fff;
  font-size:12px;
  line-height:1;
  cursor:pointer;
  display:flex;
  align-items:center;
  justify-content:center;
  box-shadow:0 3px 8px -2px rgba(46,42,34,0.45);
}
.pf-video-teaser-dismiss:hover{ background:var(--pf-red); }
.pf-video-teaser--floating.is-dismissed{ display:none !important; }

/* 18.09 - jasniejsze tlo sekcji "Produkty niskobialkowe PKU" na stronie glownej, zeby odroznic ja od sekcji "Nasze produkty" (cream) */
.pf-featured-pku{ background:#FFFFFF; }

/* 18.09 - poprawka: motyw theme-b nadpisywal tlo .pf-featured-pku (!important, wyzsza specyficznosc html.theme-b .pf-featured) */
html.theme-b .pf-featured-pku{ background:#FFFFFF !important; }

/* 18.09 - korekta: biale tlo zlewalo sie z sekcja "Przepisy z Uniwersalnej" ponizej (tez #ffffff).
   Sekcja PKU miedzy kremowa "Nasze produkty" a biala "Przepisy" - potrzebny kolor rozny od OBU sasiadow,
   nie tylko jasniejszy. Uzywam --pf-sage (juz w palecie, ten sam co pasek zaufania wyzej na stronie). */
.pf-featured-pku{ background:var(--pf-sage) !important; }
html.theme-b .pf-featured-pku{ background:var(--pf-sage) !important; }

/* 18.09 - trzecia korekta: ma byc PO PROSTU troche jasniejszy odcien tego samego kremu co sekcja
   "Nasze produkty" wyzej (#EFF1E8), nie inny kolor. Zadne zielone, zadne biale. */
.pf-featured-pku{ background:#F6F7F1 !important; }
html.theme-b .pf-featured-pku{ background:#F6F7F1 !important; }

/* 18.09 - kafelek wideo w hero przeniesiony z plywajacego (scroll-trigger) na staly,
   obok przyciskow "Zobacz produkty"/"Zobacz przepisy". Bez gornego marginesu bazowej
   klasy .pf-video-teaser, zeby siedzial rowno w tym samym wierszu co przyciski. */
.pf-video-teaser--inline{
  margin-top:0;
}
@media (max-width:600px){
  .pf-video-teaser--inline{ width:100%; margin-top:10px; }
}

/* 18.09 - kafelek wideo przeniesiony po raz drugi: wycentrowany pod tekstem opisowym hero
   (zamiast w wierszu przyciskow). width:fit-content dziedziczone z bazowej .pf-video-teaser
   + margin auto na bokach = centrowanie w kolumnie tekstowej. */
.pf-video-teaser--centered{
  margin:8px auto 24px;
}
@media (max-width:600px){
  .pf-video-teaser--centered{ width:100%; }
}

/* 18.09 - poprawka centrowania kafelka wideo: centrowany teraz wzgledem SZEROKOSCI wiersza
   przyciskow (najszerszego dziecka), nie wzgledem calej (szerszej) kolumny tekstu hero -
   inaczej wypadal wizualnie na prawo od przyciskow. Kontener zostaje przy lewej krawedzi
   (jak dotad przyciski), tylko wewnatrz centruje kafelek nad nimi. */
.pf-hero-video-buttons{
  display:flex;
  flex-direction:column;
  align-items:center;
  width:fit-content;
}
.pf-hero-video-buttons .wp-block-buttons{
  width:auto;
}

/* 18.09 - kafelek wideo centrowany wzgledem listy korzysci (max-width:470px), nie calej
   kolumny tekstu - ten sam trik co przy przyciskach. */
.pf-hero-video-benefits{
  display:flex;
  flex-direction:column;
  align-items:center;
  width:fit-content;
}

/* 22.09 - odchudzenie paska zaufania WSZEDZIE (nie tylko telefon - Filip zwrocil uwage,
   ze poprzednia runda chudla tylko na mobile). To jest baza bez @media, wiec obowiazuje
   od razu i na komputerze, i na telefonie/tablecie; blok ponizej (@media max-width:768px)
   dalej dodatkowo zmniejsza dla telefonu (mniejsze liczby tam wygrywaja, bo sa nizej w pliku). */
.pf-trustbar{ padding:28px 5% !important; }
.pf-trust-cols{ gap:32px !important; }
.pf-trust-icon{ min-height:auto !important; margin:0 0 10px !important; }
.pf-trust-badge{ max-width:56px !important; max-height:56px !important; }
.pf-trust-label{ font-size:12px !important; letter-spacing:.3px !important; }

/* 22.09 - odchudzenie paska zaufania na telefonie: 3 pozycje w JEDNEJ linii (zamiast 2+1),
   jeszcze mniejsze plakietki i podpis niz baza wyzej, zeby sie zmiescily w jednym rzedzie.
   Regula na koncu pliku (i z !important), bo .pf-trust-item/.pf-trust-badge/.pf-trust-label
   maja juz kilka wczesniejszych, nadpisujacych sie warstw w tym pliku - tylko koniec pliku
   daje pewnosc wygranej w kaskadzie. */
@media (max-width:768px){
  .pf-trust-cols{ flex-wrap:nowrap !important; gap:8px !important; }
  .pf-trust-item{ flex-basis:33.333% !important; margin-bottom:0 !important; min-width:0; }
  .pf-trust-icon{ min-height:auto !important; margin:0 0 6px !important; }
  .pf-trust-badge{ max-width:40px !important; max-height:40px !important; }
  .pf-trust-label{ font-size:10px !important; letter-spacing:.2px !important; line-height:1.2 !important; }
  .pf-trustbar{ padding:20px 4% !important; }
}

/* 22.09 - runda 3: oba przyciski hero na prosbe klienta - (1) oba czerwone/wypelnione
   (tresc: drugi przycisk zmieniony z pf-btn-outline na pf-btn, patrz post_content 3610),
   (2) ta sama szerokosc, WSZEDZIE (nie tylko telefon) - min-width + wysrodkowany tekst,
   zeby "Zobacz produkty" i "Przepisy wideo" byly rownej dlugosci mimo roznej liczby liter. */
.pf-hero-cols .wp-block-buttons .wp-block-button__link{
  min-width:190px !important;
  text-align:center !important;
}

/* 22.09 - przyciski hero "Zobacz produkty"/"Przepisy wideo" w JEDNEJ linii na telefonie
   (rowne szerokosci obok siebie; tekst zawija sie w srodku przycisku w razie potrzeby,
   zamiast catly drugi przycisk spadac do nowego wiersza - zwlaszcza po dopisaniu "wideo"). */
@media (max-width:768px){
  .pf-hero-cols > .wp-block-column:first-child > .wp-block-buttons{
    flex-wrap:nowrap !important;
    gap:8px !important;
  }
  .pf-hero-cols > .wp-block-column:first-child > .wp-block-buttons > .wp-block-button{
    flex:1 1 0;
    min-width:0;
  }
  .pf-hero-cols .wp-block-buttons .wp-block-button__link{
    padding:10px 12px !important;
    font-size:13px !important;
    white-space:normal !important;
    text-align:center;
    min-width:0 !important;
  }
}

/* 30.09.2026 - kafelki w sekcji "Przepisy z ta mieszanka" na karcie produktu: nie rozciagac jednego kafelka na cala szerokosc (auto-fit + 1fr) */
.pf-product-recipes .pf-recipes-grid {
    grid-template-columns: repeat(auto-fit, minmax(min(100%, 300px), 340px));
    justify-content: center;
}

/* 01.10.2026 - formularz opinii na karcie produktu: rozmiary jak reszta tekstów (Astra dawała 19-21 px / 500) */
#reviews #reply-title{font-size:18px;font-weight:600;line-height:1.4}
#reviews #review_form label,#reviews .comment-form-rating label{font-size:16px;font-weight:500}
#reviews .comment-text,#reviews .comment-text p,#reviews .woocommerce-review__author{font-size:16px}

/* 01.10.2026 - sklep bez kont kupujacych: ikona czlowieczka (Moje konto) schowana w naglowku. Cofniecie: usunac ten blok. Strona /moje-konto/ istnieje dalej. */
.ast-header-account{display:none !important}

/* 05.10.2026 - plakaty w hero sa linkami. Slajdy leza na sobie (grid-area 1/1),
   ukryte tylko przez opacity - bez tego klik zawsze trafialby w ostatni slajd.
   Klikalny jest tylko slajd widoczny (bez JS: pierwszy). */
.pf-hero-media .wp-block-image + .wp-block-image{ pointer-events:none; }
.pf-hero-media--ready .wp-block-image{ pointer-events:none; }
.pf-hero-media .wp-block-image.is-active{ pointer-events:auto; }
.pf-hero-media .wp-block-image a{ display:block; height:100%; }
