/*
Theme Name: Logopeda-24 (Kadence Child)
Theme URI: https://logopeda-24.pl
Description: Motyw potomny na bazie Kadence — nowy wygląd Gabinetu Logopedycznego Aleksandry Boroń. Zachowuje pełną zgodność z WooCommerce i aktualizacjami motywu nadrzędnego.
Author: ksgraf (webmaster)
Author URI: https://logopeda-24.pl
Template: kadence
Version: 1.0.0
Text Domain: logopeda24-child
*/

/* ---------------------------------------------------------------
   1) ZMIENNE KOLORÓW I TYPOGRAFII — ta sama paleta co w makietach
   ------------------------------------------------------------- */
:root{
  --l24-teal-deep:#123B34;
  --l24-teal:#1F5C52;
  --l24-cream:#FAF6EF;
  --l24-cream-2:#F3ECDF;
  --l24-coral:#D8663B;
  --l24-coral-deep:#9C3F20;
  --l24-coral-tint:#F7E2D6;
  --l24-sage:#E4EEE3;
  --l24-white:#FFFDF9;
  --l24-ink:#1E332F;
  --l24-ink-soft:#3E5650;
  --l24-line:#DFD5C2;
}

body{
  background:var(--l24-cream);
  color:var(--l24-ink);
  font-family:'Work Sans', sans-serif;
}

h1,h2,h3,h4,
.entry-title,
.woocommerce-loop-product__title,
.product_title{
  font-family:'Fraunces', serif !important;
  font-weight:500;
  color:var(--l24-teal-deep);
}

a{ color:var(--l24-teal-deep); }
a:hover{ color:var(--l24-coral); }

/* ---------------------------------------------------------------
   2) NAGŁÓWEK / NAWIGACJA
   ------------------------------------------------------------- */
.site-header,
.kadence-header-row{
  background:var(--l24-cream);
  border-bottom:1px solid var(--l24-line);
}

.main-navigation a{
  font-weight:500;
  color:var(--l24-ink);
}
.main-navigation a:hover,
.main-navigation .current-menu-item > a{
  color:var(--l24-teal-deep);
  border-bottom:2px solid var(--l24-coral);
}

/* Przycisk "Zarezerwuj wizytę" w menu — dodaj klasę "cta-button" do linku w Wygląd > Menu */
.main-navigation a.cta-button,
.menu-item.cta-button > a{
  background:var(--l24-coral) !important;
  color:#fff !important;
  border-radius:30px;
  padding:10px 22px !important;
  border-bottom:none !important;
}
.main-navigation a.cta-button:hover{ background:var(--l24-coral-deep) !important; }

/* ---------------------------------------------------------------
   3) PRZYCISKI OGÓLNE
   ------------------------------------------------------------- */
.wp-block-button__link,
button, input[type="submit"],
.button, .btn{
  background:var(--l24-coral) !important;
  color:#fff !important;
  border-radius:30px !important;
  border:none !important;
  font-weight:600 !important;
  padding:12px 26px !important;
}
.wp-block-button__link:hover,
button:hover, input[type="submit"]:hover,
.button:hover, .btn:hover{
  background:var(--l24-coral-deep) !important;
}

/* Drugorzędny przycisk — klasa "btn-ghost" */
.btn-ghost{
  background:transparent !important;
  color:var(--l24-teal-deep) !important;
  border:1.5px solid var(--l24-teal-deep) !important;
}

/* ---------------------------------------------------------------
   4) SEKLCJA HERO (strona główna) — kontener z klasą "l24-hero"
   ------------------------------------------------------------- */
.l24-hero{
  background:var(--l24-white);
  border-radius:24px;
  padding:56px 48px;
}
.l24-eyebrow{
  display:inline-flex;
  background:var(--l24-sage);
  color:var(--l24-teal);
  font-weight:600;
  font-size:13px;
  padding:8px 16px;
  border-radius:30px;
  margin-bottom:18px;
}
.l24-trust-strip{
  background:var(--l24-sage);
  border-radius:16px;
  padding:20px 28px;
  display:flex;
  gap:32px;
  flex-wrap:wrap;
  font-weight:600;
  color:var(--l24-teal-deep);
  margin:24px 0;
}

/* ---------------------------------------------------------------
   5) WOOCOMMERCE — SKLEP / LISTA PRODUKTÓW (sesje, warsztaty)
   ------------------------------------------------------------- */
.woocommerce ul.products li.product,
.woocommerce-page ul.products li.product{
  background:var(--l24-white);
  border:1px solid var(--l24-line);
  border-radius:20px !important;
  padding:20px !important;
  box-shadow:none !important;
  transition:transform .15s ease;
}

.woocommerce ul.products li.product .price{
  color:var(--l24-teal-deep) !important;
  font-family:'Fraunces', serif;
  font-size:20px !important;
  font-weight:500;
}

.woocommerce ul.products li.product .price ins{
  color:var(--l24-coral) !important;
}

.woocommerce ul.products li.product a.add_to_cart_button,
.woocommerce ul.products li.product a.button{
  background:var(--l24-teal-deep) !important;
  border-radius:30px !important;
  color:#fff !important;
}
.woocommerce ul.products li.product a.add_to_cart_button:hover{
  background:var(--l24-coral) !important;
}

/* Wyróżniony produkt — dodaj klasę "featured-session" w polu CSS produktu w WooCommerce */
.woocommerce ul.products li.product.featured-session{
  border:2px solid var(--l24-coral) !important;
}

/* ---------------------------------------------------------------
   6) WOOCOMMERCE — KOSZYK / PODSUMOWANIE ZAMÓWIENIA
   ------------------------------------------------------------- */
.woocommerce .cart-collaterals .cart_totals,
.woocommerce-cart .cart_totals,
.woocommerce-checkout-review-order{
  background:var(--l24-white);
  border:1px solid var(--l24-line);
  border-radius:18px;
  padding:24px !important;
}

.woocommerce #payment #place_order,
.woocommerce-checkout #payment #place_order,
.checkout-button{
  width:100%;
  background:var(--l24-coral) !important;
  border-radius:30px !important;
  padding:16px !important;
  font-size:16px !important;
  font-weight:700 !important;
}

/* Pasek zaufania w koszyku/checkout — wstrzykiwany przez functions.php */
.l24-secure-note{
  display:flex;
  align-items:center;
  gap:10px;
  background:var(--l24-sage);
  color:var(--l24-teal-deep);
  border-radius:12px;
  padding:12px 16px;
  font-size:13px;
  font-weight:600;
  margin:16px 0;
}
.l24-pay-icons{
  display:flex;
  gap:8px;
  flex-wrap:wrap;
  margin:12px 0;
}
.l24-pay-icons span{
  background:var(--l24-cream-2);
  border:1px solid var(--l24-line);
  border-radius:8px;
  padding:6px 12px;
  font-size:12px;
  font-weight:700;
  color:var(--l24-ink-soft);
}

/* ---------------------------------------------------------------
   7) SEKCJA CERTYFIKATÓW — zamiennik siatki nieopisanych skanów
   ------------------------------------------------------------- */
.l24-credentials{
  display:grid;
  grid-template-columns:repeat(auto-fit, minmax(260px, 1fr));
  gap:20px;
  margin:32px 0;
}
.l24-credential-card{
  background:var(--l24-white);
  border:1px solid var(--l24-line);
  border-radius:16px;
  padding:24px;
}
.l24-credential-card .num{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  width:34px; height:34px;
  border-radius:50%;
  background:var(--l24-sage);
  color:var(--l24-teal-deep);
  font-weight:700;
  margin-bottom:12px;
}
.l24-credential-card h3{ font-size:16px; margin:0 0 6px; }
.l24-credential-card p{ font-size:13px; color:var(--l24-ink-soft); margin:0; }
/* ---------------------------------------------------------------
   9) SEKCJA "NASZA OFERTA" — siatka usług (strona główna)
   ------------------------------------------------------------- */
.l24-kicker{color:var(--l24-coral); font-weight:600; font-size:13px; letter-spacing:.06em; text-transform:uppercase; margin-bottom:10px; display:block;}
.l24-services-grid{display:grid; grid-template-columns:repeat(4,1fr); gap:20px; margin:32px 0;}
.l24-svc-card{background:var(--l24-white); border:1px solid var(--l24-line); border-radius:20px; padding:28px 24px;}
.l24-svc-card.featured{background:var(--l24-teal-deep); border-color:var(--l24-teal-deep);}
.l24-svc-card.featured h3, .l24-svc-card.featured p, .l24-svc-card.featured .price{color:#EFEAE0;}
.l24-svc-card .ico{width:46px; height:46px; border-radius:13px; background:var(--l24-sage); color:var(--l24-teal); display:flex; align-items:center; justify-content:center; font-size:20px; margin-bottom:20px;}
.l24-svc-card.featured .ico{background:rgba(255,255,255,.12); color:#F7C9A8;}
.l24-svc-card h3{font-size:18px; margin:0 0 10px; font-family:'Fraunces',serif; font-weight:500; color:var(--l24-teal-deep);}
.l24-svc-card p{font-size:14px; color:var(--l24-ink-soft); line-height:1.55; margin:0 0 18px;}
.l24-svc-card .price{font-size:13px; font-weight:600; color:var(--l24-teal);}
.l24-svc-card .price b{font-family:'Fraunces',serif; font-size:17px; font-weight:500;}

/* ---------------------------------------------------------------
   10) SEKCJA "O TERAPEUTCE"
   ------------------------------------------------------------- */
.l24-about{background:var(--l24-teal-deep); color:#EFEAE0; border-radius:24px; padding:56px 48px; display:grid; grid-template-columns:.8fr 1.2fr; gap:48px; align-items:center; margin:40px 0;}
.l24-about-photo{aspect-ratio:1/1.05; background:rgba(255,255,255,.06); border-radius:22px; border:1px solid rgba(255,255,255,.14);}
.l24-about h2{color:#fff; font-size:28px; margin:0 0 16px;}
.l24-about p{font-size:15px; line-height:1.75; color:#CBD9D2; margin:0 0 22px;}
.l24-badges{display:flex; gap:10px; flex-wrap:wrap;}
.l24-badge-pill{border:1px solid rgba(255,255,255,.22); border-radius:30px; padding:8px 14px; font-size:13px; color:#EFEAE0;}

/* ---------------------------------------------------------------
   11) LOKALIZACJE
   ------------------------------------------------------------- */
.l24-loc-grid{display:grid; grid-template-columns:1fr 1fr; gap:20px; margin:24px 0;}
.l24-loc-card{background:var(--l24-white); border:1px solid var(--l24-line); border-radius:20px; padding:26px; display:flex; gap:16px;}
.l24-loc-card .ico{width:44px; height:44px; border-radius:14px; background:var(--l24-coral-tint); color:var(--l24-coral-deep); display:flex; align-items:center; justify-content:center; font-size:18px; flex-shrink:0;}
.l24-loc-card h3{font-size:16px; margin:0 0 4px; font-family:'Fraunces',serif; font-weight:500; color:var(--l24-teal-deep);}
.l24-loc-card p{font-size:13px; color:var(--l24-ink-soft); line-height:1.6; margin:0;}

@media (max-width: 900px){
  .l24-services-grid{grid-template-columns:1fr 1fr;}
  .l24-about{grid-template-columns:1fr; padding:32px 24px;}
  .l24-loc-grid{grid-template-columns:1fr;}
}
/* ---------------------------------------------------------------
   8) MOBILE — dopracowanie pod telefony
   ------------------------------------------------------------- */
@media (max-width: 782px){
  .l24-hero{ padding:32px 24px; border-radius:18px; }
  .l24-trust-strip{ flex-direction:column; gap:12px; }
  .woocommerce ul.products li.product{ padding:16px !important; }
}