/* Wspólny system wyglądu strony głównej: jedna siatka, jeden rytm odstępów, jedna rodzina przycisków.
   Ładowany po stylach w index.html; kolory i kroje pisma pozostają te same. */
:root{
  --cz-terra:var(--action-workshop);--cz-terra-dk:var(--action-workshop-hover);--cz-terra-soft:var(--action-workshop-soft);
  --cz-moss:var(--action-shop);--cz-moss-dk:var(--action-shop-hover);--cz-moss-soft:var(--action-shop-soft);
  --cz-page:1080px;--cz-gutter:24px;--cz-section:4.5rem;
  --cz-btn-lg:54px;--cz-btn-md:44px;--cz-btn-sm:36px;
}

/* ── Siatka: każda sekcja zaczyna się na tej samej lewej krawędzi co logo ── */
.hero,section,#sklepik{padding:var(--cz-section) var(--cz-gutter)}
.strip,footer{padding-left:var(--cz-gutter);padding-right:var(--cz-gutter)}
.container{max-width:var(--cz-page);padding:0}

/* ── Nagłówki sekcji ── */
.section-tag{color:var(--cz-terra);font-size:.75rem;letter-spacing:.12em;margin-bottom:.75rem}
section .container>h2,.cz-shop-heading h2{margin-bottom:.75rem}
section .container>p,.cz-shop-heading p{max-width:62ch}

/* ── Przyciski: wspólna podstawa ── */
.btn-primary,.btn-outline,.wc-btn,.need-btn,.strip-event-btn,.strip-event-spots.custom[href]{
  display:inline-flex;align-items:center;justify-content:center;gap:10px;
  border-radius:999px;font-family:'Nunito',sans-serif;font-weight:800;line-height:1.2;
  text-align:center;text-decoration:none;white-space:nowrap;
  transition:background .15s,border-color .15s,color .15s;
}
.btn-primary,.btn-outline{min-height:48px;padding:0 28px;font-size:.95rem;border:2px solid var(--cz-terra)}
.btn-primary{background:var(--cz-terra);color:#fff}
.btn-primary:hover{background:var(--cz-terra-dk);border-color:var(--cz-terra-dk);text-decoration:none}
.btn-outline{background:transparent;color:var(--cz-terra)}
.btn-outline:hover{background:var(--cz-terra-soft);text-decoration:none}

/* średnie — w kartach */
.wc-btn,.need-btn,.path-card .btn-outline,.cz-shop-all{min-height:var(--cz-btn-md);padding:0 20px;font-size:.88rem}
.wc-btn{background:var(--cz-terra);color:#fff;border:2px solid var(--cz-terra)}
.wc-btn:hover{background:var(--cz-terra-dk);border-color:var(--cz-terra-dk);text-decoration:none}
.wc-btn.disabled,.wc-btn.disabled:hover{background:#c2b5a8;border-color:#c2b5a8}
.need-btn{border:2px solid var(--cz-terra);color:var(--cz-terra);margin-top:auto;align-self:flex-start}

/* małe — w pasku najbliższych zajęć */
.strip-event-btn,.strip-event-spots{min-height:var(--cz-btn-sm);padding:0 16px;font-size:.78rem;line-height:1.2}
.strip-event-spots{display:inline-flex;align-items:center;border-radius:999px;font-weight:800}
.strip-event-btn{background:var(--cz-terra)}
.strip-event-btn:hover{background:var(--cz-terra-dk)}
.strip-event-btn.disabled,.strip-event-btn.disabled:hover{background:#c2b5a8}
.strip-event-spots.custom{background:transparent;color:var(--cz-terra);box-shadow:inset 0 0 0 2px var(--cz-terra)}
.strip-event-spots.custom[href]:hover,.strip-event-spots.custom[href]:focus-visible{background:var(--cz-terra-soft)}
.strip-label{background:var(--cz-terra);padding:0 24px}
.strip-event{padding:12px 24px;gap:14px}

a:focus-visible,button:focus-visible,summary:focus-visible{outline:3px solid #385e85;outline-offset:3px}

/* ── Hero ── */
.hero-inner{max-width:var(--cz-page);gap:3.5rem}
.hero-lead{margin-bottom:2rem}
.hero-visual{aspect-ratio:auto;background:#fff;box-shadow:0 12px 40px #2a211814}
.hero-visual picture{display:block;width:100%}
.hero-visual img{display:block;height:auto;aspect-ratio:1376/768}

/* ── Siatki kart: pełne rzędy, równe wysokości ── */
.workshops-grid,.needs-grid,.paths-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:1.5rem;margin-top:2.5rem}
.workshop-card{display:flex;flex-direction:column}
.wc-body{flex:1;display:flex;flex-direction:column}
.wc-footer{margin-top:auto;padding-top:.5rem}
.wc-spots.custom{color:var(--cz-terra)}
.need-card{padding:1.25rem 1.5rem;gap:10px}
.path-card{display:flex;flex-direction:column;padding:1.75rem 1.5rem;gap:.25rem}
.path-card p{margin-bottom:1.25rem}
.path-card .btn-outline{margin-top:auto;align-self:flex-start}
.team-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:.75rem}
.team-card{align-items:flex-start;padding:1rem 1.1rem}
.team-name{margin-bottom:2px}
.team-role{font-size:.82rem;line-height:1.45}
.kontakt-grid{gap:3.5rem}
.info-icon{width:40px;height:40px;border-radius:50%}

/* ── Formularz zapisu ── */
.form-wrap{max-width:640px}
.form-grid{gap:1.1rem 1.25rem}
input,select,textarea{min-height:48px;border-color:#d9c8b4;border-radius:8px;padding:11px 14px;font-size:1rem}
textarea{min-height:110px}
input:focus,select:focus,textarea:focus{border-color:var(--cz-terra);box-shadow:0 0 0 3px #a64f2e2e}
.form-submit .btn-primary{min-height:var(--cz-btn-lg);padding:0 40px;font-size:1rem}

/* ── Rytm tła sekcji ── */
#potrzeby{background:var(--cream)}

@media (max-width:900px){
  .workshops-grid,.needs-grid,.paths-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media (max-width:700px){
  :root{--cz-gutter:20px;--cz-section:3rem}
  .hero{padding-top:2rem;padding-bottom:2.5rem}
  .strip{padding:0}
  .strip-events{padding:0 var(--cz-gutter)}
  .strip-event{padding:14px 0}
  .strip-event:nth-child(n+3){display:none}
  .strip-label{padding:12px var(--cz-gutter)}
  .workshops-grid,.needs-grid,.paths-grid{grid-template-columns:1fr;gap:1rem}
  .need-btn,.path-card .btn-outline{align-self:stretch}
  .wc-btn,.wc-btn.disabled{display:flex;width:100%}
  .form-submit .btn-primary{width:100%}
  .team-grid{grid-template-columns:1fr 1fr}
}
@media (max-width:380px){.team-grid{grid-template-columns:1fr}}