/* Podstrona „Warsztaty": proste karty i lista kroków w stylu menu. */
.workshop-cards{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:24px;margin:0 80px 40px}
.workshop-card{padding:0;color:var(--text)}
.workshop-author{font-size:15px;color:#325900;margin-bottom:12px}
.workshop-card h3{font:800 44px/.95 PangramCompressed,Impact,sans-serif;text-transform:uppercase;margin-bottom:16px}
.workshop-card p:last-child{font-size:17px;line-height:1.5;color:#444}
.workshop-steps{list-style:none;margin:0 80px 40px;padding:0;display:grid;gap:24px;max-width:760px}
.workshop-steps li{font-size:18px;line-height:1.5;color:var(--green)}
.workshop-steps strong{display:block;margin-bottom:4px;font-size:20px}
@media(max-width:1100px){.workshop-cards{grid-template-columns:minmax(0,1fr);margin-inline:48px}.workshop-steps{margin-inline:48px}}
@media(max-width:700px){.workshop-cards{margin-inline:var(--ws-inset);gap:28px}.workshop-card h3{font-size:38px}.workshop-steps{margin-inline:var(--ws-inset)}.workshop-steps li{font-size:17px}}

/* Telefon i tablet (do 1100 px): wspólny boczny margines tekstu (nagłówek, karty, kroki, zapisy). Fale tła rosną z szerokością, więc margines też rośnie. */
@media(max-width:1100px){
  main{--ws-inset:calc(5.2vw + 24px)}
  .workshops .section-heading,.workshops-how .section-heading{padding-inline:var(--ws-inset)}
  .workshop-cards,.workshop-steps{margin-inline:var(--ws-inset)}
  .workshops-how ~ .menu-allergy{margin-inline:calc(var(--ws-inset) + 20px)}
}
/* Szersze okna (od 801 px): kroki w trzech kolumnach. */
@media(min-width:801px){
  .workshop-steps{grid-template-columns:repeat(3,minmax(0,1fr));gap:24px;max-width:none}
}

/* Pionowe marginesy wewnątrz sekcji z falą: więcej miejsca nad nagłówkiem i pod ostatnim tekstem. */
.workshops .section-heading,.workshops-how .section-heading{padding-top:64px;padding-bottom:36px}
.workshops,.workshops-how{padding-bottom:64px}
.workshop-cards,.workshop-steps{margin-bottom:0}
@media(max-width:700px){
  .workshops .section-heading,.workshops-how .section-heading{padding-top:48px;padding-bottom:28px}
  .workshops,.workshops-how{padding-bottom:48px}
}

/* Odstęp między różowym pasem z nagłówkiem a treścią pod nim. */
.workshop-cards,.workshop-steps{margin-top:48px}
@media(max-width:700px){.workshop-cards,.workshop-steps{margin-top:32px}}

/* Desktop i tablet poziomo (od 801 px): mniejsze, takie same marginesy jak w kartach produktów. */
@media(min-width:801px){
  main{--ws-inset:40px}
  .workshops .section-heading,.workshops-how .section-heading{padding-inline:var(--ws-inset)}
  .workshop-cards,.workshop-steps{margin-inline:var(--ws-inset)}
  .workshop-cards{gap:32px}
}
@media(min-width:801px){.workshops-how ~ .menu-allergy{margin-inline:calc(var(--product-gutter) + var(--ws-inset))}}
