/*
Theme Name: YesOrganic
Template: generatepress
Description: Motyw potomny GeneratePress dla yesorganic.pl. Paleta prowadzona od skladu
 produktu: dzika roza (Rosa canina) daje czerwien, owies daje tlo. Zero cieni, zero
 ciemnego pasma hero, zero wersalikow w przyciskach.
Version: 1.0
*/

:root{
  --yo-tlo:        #FBF8F3;
  --yo-tlo-2:      #F3EDE4;
  --yo-atrament:   #2A1F26;
  --yo-tekst:      #4A3B43;
  --yo-tekst-cichy:#6E5C65;
  --yo-roza:       #8E2F4A;
  --yo-roza-ciemna:#6E2139;
  --yo-roza-jasna: #D98A72;
  --yo-roza-mgla:  #F6E7E4;
  --yo-kreska:     #E2D6C8;
  --yo-promien:    20px;
  --yo-promien-s:  6px;
}

body{
  background: var(--yo-tlo);
  color: var(--yo-tekst);
  font-family: Karla, system-ui, -apple-system, Segoe UI, sans-serif;
  font-size: 18px;
  line-height: 1.68;
}

h1,h2,h3,h4{
  font-family: Fraunces, Georgia, serif;
  color: var(--yo-atrament);
  font-weight: 600;
  letter-spacing: normal;
  line-height: 1.22;
}
h1{ font-size: clamp(2rem, 1.4rem + 2.4vw, 3.1rem); }
h2{ font-size: clamp(1.5rem, 1.2rem + 1.3vw, 2.1rem); margin-top: 2.4em; }
h3{ font-size: clamp(1.18rem, 1.05rem + .6vw, 1.42rem); }

.yo-kreska-nad{ position: relative; padding-top: 1.5rem; }
.yo-kreska-nad::before{
  content:""; position:absolute; top:0; left:0;
  width: 68px; height: 3px; background: var(--yo-roza); border-radius: 2px;
}

.yo-hero{
  display:grid; gap: clamp(1.5rem, 4vw, 3.2rem);
  grid-template-columns: 1fr; align-items:center;
  padding: clamp(1.8rem, 4vw, 3.4rem) 0 clamp(1.4rem, 3vw, 2.6rem);
}
@media (min-width: 900px){ .yo-hero{ grid-template-columns: 1.08fr .92fr; } }
.yo-hero__lead{ font-size: 1.12rem; color: var(--yo-tekst); max-width: 56ch; }
.yo-hero__foto{
  background: var(--yo-roza-mgla);
  border: 1px solid var(--yo-kreska);
  border-radius: var(--yo-promien);
  padding: clamp(1rem, 3vw, 2rem);
  display:flex; align-items:center; justify-content:center;
}
.yo-hero__foto img{ max-width:100%; height:auto; display:block; }

.yo-cta{
  display:inline-block; background: var(--yo-roza); color:#fff;
  font-family: Karla, sans-serif; font-weight:700; font-size:1.05rem;
  text-transform: none; letter-spacing: normal;
  padding: .92em 1.9em; border-radius: var(--yo-promien-s);
  border: 1px solid var(--yo-roza-ciemna); text-decoration:none;
  transition: background .15s ease;
}
.yo-cta:hover, .yo-cta:focus{ background: var(--yo-roza-ciemna); color:#fff; }
.yo-cta-pod{ display:block; margin-top:.75rem; font-size:.95rem; color: var(--yo-tekst-cichy); }
.yo-cta-pod a{ color: var(--yo-roza); }

.yo-karta{
  background:#fff; border:1px solid var(--yo-kreska);
  border-radius: var(--yo-promien); padding: clamp(1.1rem, 3vw, 1.9rem);
  box-shadow:none;
}
.yo-siatka{ display:grid; gap:1rem; grid-template-columns:1fr; }
@media (min-width: 760px){
  .yo-siatka--3{ grid-template-columns:repeat(3,1fr); }
  .yo-siatka--2{ grid-template-columns:repeat(2,1fr); }
}

.yo-skrot{ background: var(--yo-tlo-2); border:1px solid var(--yo-kreska);
  border-radius: var(--yo-promien); padding: clamp(1.1rem,3vw,1.8rem); }
.yo-skrot dl{ display:grid; grid-template-columns:auto 1fr; gap:.55rem 1.1rem; margin:0; }
.yo-skrot dt{ color: var(--yo-tekst-cichy); font-size:.95rem; }
.yo-skrot dd{ margin:0; font-weight:700; color: var(--yo-atrament); }

.yo-tabela{ width:100%; border-collapse:collapse; margin:1.2rem 0; font-size:1rem; }
.yo-tabela thead th{
  text-align:left; background: var(--yo-roza-mgla); color: var(--yo-atrament);
  font-family: Fraunces, serif; font-weight:600; padding:.7rem .9rem;
  border-bottom:1px solid var(--yo-kreska);
}
.yo-tabela td{ padding:.66rem .9rem; border-bottom:1px solid var(--yo-kreska); vertical-align:top; }
.yo-tabela tbody tr:last-child td{ border-bottom:none; }

.yo-faq details{ border:1px solid var(--yo-kreska); border-radius: var(--yo-promien-s);
  padding:.9rem 1.1rem; margin-bottom:.7rem; background:#fff; }
.yo-faq summary{ cursor:pointer; font-weight:700; color: var(--yo-atrament); }
.yo-faq details[open] summary{ margin-bottom:.6rem; }

.yo-form{ background:#fff; border:1px solid var(--yo-kreska); border-radius: var(--yo-promien);
  padding: clamp(1.2rem,3vw,2rem); }
.yo-form label{ display:block; font-size:.95rem; color: var(--yo-tekst-cichy); margin-bottom:.3rem; }
.yo-form input[type=text], .yo-form input[type=tel]{
  width:100%; padding:.8em .95em; font-size:1.05rem; font-family: Karla, sans-serif;
  border:1px solid var(--yo-kreska); border-radius: var(--yo-promien-s);
  background: var(--yo-tlo); color: var(--yo-atrament); margin-bottom:1rem;
}
.yo-form input:focus{ outline:2px solid var(--yo-roza); outline-offset:1px; }

.yo-nota{ font-size:.92rem; color: var(--yo-tekst-cichy); border-top:1px solid var(--yo-kreska);
  padding-top:1rem; margin-top:2.4rem; }

html, body{ overflow-x: clip; }
img, table{ max-width:100%; }
