/* ===========================================================
   GILROY — WOFF2 (tylko używane wagi)
   =========================================================== */
@font-face{font-family:"Gilroy";src:url("assets/fonts/Gilroy-Regular.woff2") format("woff2");font-weight:400;font-style:normal;font-display:swap}
@font-face{font-family:"Gilroy";src:url("assets/fonts/Gilroy-Medium.woff2") format("woff2");font-weight:500;font-style:normal;font-display:swap}  /* opcjonalnie: zostawiamy 500 */
@font-face{font-family:"Gilroy";src:url("assets/fonts/Gilroy-SemiBold.woff2") format("woff2");font-weight:600;font-style:normal;font-display:swap}
@font-face{font-family:"Gilroy";src:url("assets/fonts/Gilroy-Bold.woff2") format("woff2");font-weight:700;font-style:normal;font-display:swap}


/* Lepsze renderowanie tekstu + brak sztucznego bold/italic */
html{
  text-rendering: optimizeLegibility;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  font-kerning: normal;
  font-synthesis: none; /* nie symuluj bold/italic */
}

/* Dla nagłówków możesz dodatkowo włączyć ligatury/kern optyczny (opcjonalnie) */
h1,h2,h3,h4,h5,h6{
  font-feature-settings: "kern" 1, "liga" 1;
}

/* ===========================================================
   ZMIENNE / RESET
   =========================================================== */
:root{
  --gutter:4.5rem;                 /* 72px */
  --container-pad:clamp(1rem,4vw,var(--gutter));
  --dot-size:2.5rem;               /* 40px */
  --icon-max:1.25rem;              /* 20px */
  --brand-max-h:8.875rem;          /* 142px */
  --brand-max-w:17.9375rem;        /* 287px */
  --pink:#E61A4E; --hover-a:#4AAA4B; --hover-b:#F8D448;
  --yellow:#F8D448; --white:#fff; --ink:#1b1b1b; --blue:#2809CF;
  --focus-ring:0 0 0 3px rgba(230,26,78,.35),0 0 0 6px rgba(0,0,0,.08);
  --focus-ring-inv:0 0 0 3px rgba(255,255,255,.9),0 0 0 6px rgba(230,26,78,.55);
  --shadow-soft:0 2px 10px rgba(0,0,0,.06);
  --backdrop:rgba(0,0,0,.45);
}

*{box-sizing:border-box}
html,body{height:100%}
html.no-scroll,html.no-scroll body{overflow:hidden}
body{
  margin:0;
  font-family:"Gilroy",system-ui,-apple-system,Segoe UI,Roboto,Arial,sans-serif;
  font-weight:400;font-size:1rem;line-height:1.5;color:var(--ink);
}

/* ===========================================================
   HEADER / TOPBAR
   =========================================================== */
.site-header{position:relative;background:var(--white)}
.site-header,.site-header *{font-weight:600} /* biały blok = semibold */

.nav{
  width:100%;display:flex;align-items:center;justify-content:space-between;
  padding-inline:var(--container-pad);
  padding-block:clamp(.5rem,1.2vw,1rem);
  position:relative; /* dla pozycjonowania kulek/absolute */
}

.nav__brand{display:inline-flex;align-items:center;text-decoration:none;border-radius:.5rem}
.nav__brand img{
  display:block;height:clamp(2.5rem,7.4vw,var(--brand-max-h));
  max-height:var(--brand-max-h);width:auto;max-width:var(--brand-max-w);
}

.nav__actions{display:flex;align-items:center;gap:clamp(.5rem,1.2vw,1rem);list-style:none;margin:0;padding:0}

/* Kropki / przyciski */
.dot{
  --hover:var(--hover-a);
  inline-size:var(--dot-size);block-size:var(--dot-size);border-radius:50%;
  background:var(--pink);color:var(--white);
  display:inline-flex;align-items:center;justify-content:center;
  border:0;outline:none;cursor:pointer;text-decoration:none;
  transition:background-color 220ms ease,transform 120ms ease,box-shadow 220ms ease;
  box-shadow:var(--shadow-soft);-webkit-tap-highlight-color:transparent;
}
.dot:hover{background:var(--hover)}
.dot:active{transform:translateY(1px) scale(.98)}
.dot img{display:block;max-height:var(--icon-max);width:auto}
.dot--lang{background:var(--white);color:var(--pink);font-size:.875rem;letter-spacing:.02em;line-height:1}
.dot--lang:hover{color:#1b1b1b}
.nav__actions>li:nth-child(odd) .dot:hover{background:var(--hover-a)}
.nav__actions>li:nth-child(even) .dot:hover{background:var(--hover-b)}
.nav__brand:focus-visible,.dot:focus-visible,.icon-btn:focus-visible{box-shadow:var(--focus-ring)}
.dot--lang:focus-visible{box-shadow:var(--focus-ring-inv)}

.icon-btn{inline-size:var(--dot-size);block-size:var(--dot-size);border-radius:50%;border:0;background:var(--pink);display:inline-grid;place-items:center;cursor:pointer;box-shadow:var(--shadow-soft);transition:background-color 220ms ease,transform 120ms ease}
.icon-btn:hover{background:var(--hover-b)}
.icon-btn:active{transform:translateY(1px) scale(.98)}
.icon-btn img{width:1.125rem;height:1.125rem;display:block} /* 18px */

/* Pozioma nawigacja (desktop) */
.nav__menu{
  display:flex;flex-wrap:wrap;align-items:center;gap:1.125rem; /* 18px */
  margin:4rem 0 0; /* 64px pod logo */
  padding:0;list-style:none;
}
.nav__menu a{
  font-weight:600;font-size:1.5rem;line-height:1;
  color:var(--ink);text-decoration:none;position:relative;
}
.nav__menu a::after{
  content:"";position:absolute;left:0;bottom:-0.4em;width:100%;height:2px;
  background-color:var(--blue);transform:scaleX(0);transform-origin:left center;
  transition:transform .25s ease;
}
.nav__menu a:hover::after,.nav__menu a:focus-visible::after{transform:scaleX(1)}

/* Off-canvas (menu burger) */
.offcanvas{position:fixed;inset:0;pointer-events:none;z-index:1000}
.offcanvas.is-open{pointer-events:auto}
.offcanvas__backdrop{position:absolute;inset:0;background:transparent;border:0;transition:background 220ms ease}
.offcanvas.is-open .offcanvas__backdrop{background:var(--backdrop)}
.offcanvas__panel{
  position:absolute;top:0;right:0;height:100dvh;width:37.5rem; /* 600px */
  max-width:100%;background:var(--yellow);
  transform:translateX(100%);transition:transform 260ms ease;display:grid
}
.offcanvas.is-open .offcanvas__panel{transform:translateX(0)}
.icon-btn--close{position:absolute;top:var(--gutter);right:var(--gutter);background:var(--pink)}
.offcanvas__inner{padding:var(--gutter);padding-right:calc(var(--gutter) + 3.25rem);overflow:auto;display:grid;align-content:start}
.offcanvas__nav{display:grid;gap:var(--gutter)}
.list{list-style:none;margin:0;padding:0;display:grid;gap:.5rem}
.list--xl a{font-size:3rem;line-height:1.05;font-weight:800;letter-spacing:.01em;color:var(--ink);text-decoration:none}
.list--md a{font-size:1.75rem;line-height:1.25;font-weight:500;color:var(--ink);text-decoration:none}
.offcanvas .list a{position:relative;text-decoration:none;outline:none}
.offcanvas .list a::after{
  content:"";position:absolute;left:0;bottom:-.15em;width:100%;height:2px;background:currentColor;
  transform:scaleX(0);transform-origin:left center;opacity:.6;
  transition:transform 280ms cubic-bezier(.22,.61,.36,1),opacity 280ms ease
}
.offcanvas .list a:hover::after,.offcanvas .list a:focus-visible::after{transform:scaleX(1);opacity:1}
.list--xl a::after{height:3px}
.offcanvas__dots{display:flex;align-items:center;gap:.75rem}

/* Animacje wejścia (logo, kropki, menu) */
@keyframes fadeSlideUp{from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:translateY(0)}}
.nav__brand,.nav__actions>li,.nav__menu>li{opacity:0;animation:fadeSlideUp 520ms cubic-bezier(.22,.61,.36,1) both}
.nav__brand{animation-delay:0ms}
.nav__actions>li:nth-child(1){animation-delay:80ms}
.nav__actions>li:nth-child(2){animation-delay:140ms}
.nav__actions>li:nth-child(3){animation-delay:200ms}
.nav__actions>li:nth-child(4){animation-delay:260ms}
.nav__actions>li:nth-child(5){animation-delay:320ms}
.nav__menu>li:nth-child(1){animation-delay:120ms}
.nav__menu>li:nth-child(2){animation-delay:160ms}
.nav__menu>li:nth-child(3){animation-delay:200ms}
.nav__menu>li:nth-child(4){animation-delay:240ms}
.nav__menu>li:nth-child(5){animation-delay:280ms}
.nav__menu>li:nth-child(6){animation-delay:320ms}
.nav__menu>li:nth-child(7){animation-delay:360ms}
.nav__menu>li:nth-child(8){animation-delay:400ms}
@media (prefers-reduced-motion:reduce){
  .nav__brand,.nav__actions>li,.nav__menu>li{animation:none;opacity:1;transform:none}
}

/* ===========================================================
   HERO
   =========================================================== */
.hero{background:var(--blue);color:var(--white)}
.hero__inner{padding:var(--gutter);display:flex;align-items:center;justify-content:space-between;gap:clamp(2rem,6vw,6rem)}
.hero__text{max-width:46rem}
.hero__title{margin:0 0 1.25rem 0;font-weight:700;font-size:3.5rem;line-height:1.12;letter-spacing:.005em}
.hero__lead{margin:0 0 2rem 0;font-weight:500;font-size:1.5rem;line-height:1.5;color:rgba(255,255,255,.92)}
.hero__media{margin:0;flex:0 1 38rem}
.hero__media img{display:block;width:100%;height:auto}
.btn{--btn-h:3.5rem;--btn-w:13.625rem;display:inline-flex;align-items:center;justify-content:center;gap:.5rem;height:var(--btn-h);min-width:var(--btn-w);padding:0 1rem;border:0;border-radius:.375rem;text-decoration:none;cursor:pointer;transition:transform 140ms ease,box-shadow 220ms ease,background-color 220ms ease;-webkit-tap-highlight-color:transparent}
.btn--primary{background:var(--pink);color:var(--white);box-shadow:var(--shadow-soft);font-weight:700;font-size:1.5rem;line-height:1}
.btn--primary:hover{transform:translateY(-1px)}
.btn--primary:active{transform:translateY(0)}
.btn--primary:focus-visible{box-shadow:var(--focus-ring-inv)}
.btn--primary img{width:2rem;height:2rem}

/* ===========================================================
   O FUNDACJI
   =========================================================== */
.about{background:var(--yellow);color:var(--ink);max-height:43.0625rem;overflow:hidden}
.about__inner{padding:var(--gutter)}
.section-kicker{margin:0 0 .375rem 0;color:var(--pink);font-weight:500;font-size:1.375rem;letter-spacing:.02em} /* 6px podtytuł→tytuł */
.section-title{margin:0 0 2.25rem 0;color:#1E293B;font-weight:700;font-size:3rem;line-height:1.1}  /* 36px tytuł→blok */
.about .section-title::before{content:none} /* usunięte kółko */

.about__grid{display:grid;grid-template-columns:1fr 1fr;gap:4.5rem;align-items:start}
@media (min-width:1440px){.about__grid{grid-template-columns:51.375rem 55.125rem;justify-content:center}} /* 822/882px */

.quote-card{
  width:51.375rem;height:20rem; /* 822×320 */
  background:var(--pink);color:var(--white);
  display:flex;align-items:flex-start;border-radius:.25rem;
  padding:1.5rem; /* 24 */
  box-sizing:border-box;margin:0 0 2.25rem 0; /* 36px do autora */
}
.quote-card__text{margin:0;white-space:pre-line;font-weight:600;font-size:1.5rem;line-height:1.55} /* 24px */

.author{display:flex;align-items:center;gap:1rem}
.author__avatar{inline-size:4.5rem;block-size:4.5rem;border-radius:50%;object-fit:cover}
.author__name{font-weight:700;font-size:1.5rem;line-height:1.1;color:var(--ink)}
.author__role{font-weight:300;font-size:1.125rem;line-height:1.35;color:rgba(0,0,0,.75)}
.about__right p{margin:0 0 1rem 0;font-weight:400;font-size:1.75rem;line-height:1.45;color:var(--ink)} /* 28px */

/* ===========================================================
   RESPONSYWNOŚĆ
   =========================================================== */

@media (max-width:1180px){
  .hero__inner{gap:3rem}
  .hero__text{max-width:42rem}
}

@media (max-width:1024px){
  .hide-mobile{display:none !important}
  .nav__menu{display:none !important}
  .nav{padding-inline:1.25rem;padding-block:1.5rem}
  .nav__brand img{height:8.5rem;max-height:8.5rem;width:auto}
  .icon-btn{inline-size:2.75rem;block-size:2.75rem}
  .nav__actions{position:static}


  .hero__inner{padding:2.5rem 1.25rem;flex-direction:column;align-items:flex-start;gap:1.25rem}
  .hero__media{display:none}
  .hero__text{max-width:none}
  .hero__title{margin-bottom:.75rem;font-size:clamp(2rem,6.2vw,3rem)}
  .hero__lead{margin-bottom:1.25rem;font-size:clamp(1rem,3.8vw,1.25rem)}
  .btn{--btn-w:12.5rem;--btn-h:3rem}
  .btn--primary{font-size:1.25rem}
  .btn--primary img{width:1.5rem;height:1.5rem}

  .about__inner{padding:2.5rem 1.25rem}
  .about__grid{grid-template-columns:1fr;gap:1.75rem}
  .about__right p{font-size:1.25rem}
  .author__name{font-size:1.25rem}
  .author__role{font-size:1rem}
}

/* Preferencje systemowe */
@media (prefers-contrast:more){
  .nav__brand:focus-visible,.dot:focus-visible,.icon-btn:focus-visible{box-shadow:0 0 0 3px #000,0 0 0 6px #fff}
}
@media (prefers-reduced-motion:reduce){
  .dot,.icon-btn{transition:background-color .001ms linear}
}

/* O FUNDACJI — korekta koloru tekstów na #1E293B */
.about { color: #1E293B; } /* domyślny kolor sekcji */
.about .section-title { color: #1E293B; }
.about__right p { color: #1E293B; }
.author__name { color: #1E293B; }
.author__role { color: rgba(30, 41, 59, 0.75); } /* 1E293B z 75% krycia */
/* Cytat zostaje biały na magencie (bez zmian) */
.quote-card { color: #fff; }
.quote-card__text { color: #fff; }

/* O FUNDACJI — mobile layout: najpierw tekst, potem cytat+autor */
@media (max-width: 1024px) {
  .about__grid {
    display: flex;
    flex-direction: column;
    gap: 1.5rem; /* czytelny odstęp między blokami */
  }
  .about__right { order: 1; } /* tekst idzie pierwszy */
  .about__left  { order: 2; } /* cytat + autor po tekście */
  .quote-card { margin-top: 0.5rem; }
  .author     { margin-top: 1.5rem; }
}

/* ============================================
   O FUNDACJI — MOBILE REFACTOR
   ============================================ */
@media (max-width: 1024px) {
  .about { max-height: none !important; overflow: visible !important; }
  .about__grid { display: flex; flex-direction: column; gap: 1.5rem; }
  .section-kicker { font-size: clamp(1rem, 2.8vw, 1.125rem); margin-bottom: 0.375rem; }
  .section-title { font-size: clamp(1.75rem, 6vw, 2.25rem); margin-bottom: 2.25rem; line-height: 1.15; }
  .about__right p { font-size: clamp(1rem, 3.8vw, 1.25rem); line-height: 1.5; margin: 0 0 1rem 0; }
  .quote-card { width: 100% !important; height: auto !important; padding: 1rem 1rem 0.875rem 1rem; margin: 0.5rem 0 2.25rem 0; align-items: flex-start; border-radius: 0.25rem; box-sizing: border-box; }
  .quote-card__text { font-size: clamp(1rem, 3.6vw, 1.125rem); line-height: 1.55; }
  .author { gap: 0.75rem; }
  .author__avatar { inline-size: 3.5rem; block-size: 3.5rem; }
  .author__name { font-size: 1.25rem; line-height: 1.2; color: #1E293B; }
  .author__role { font-size: 1rem; line-height: 1.35; color: rgba(30,41,59,.75); }
}

/* ===========================================================
   NASZA MISJA
   =========================================================== */
.mission{
  background: var(--white);
  color: #1E293B;
}
.mission__inner{
  padding: var(--gutter); /* 72px z każdej strony */
  display: grid;
  grid-template-columns: 1fr 1fr; /* lewa: intro, prawa: grid z kartami */
  gap: 4.5rem; /* 72px między kolumnami */
  align-items: start;
}

/* Lewa kolumna */
.mission__title{
  margin: 0;
  color: #1E293B;
  font-weight: 700;         /* Gilroy Bold */
  font-size: 3rem;          /* 48px desktop */
  line-height: 1.15;
}

/* Prawa kolumna – karty 2×2 */
.mission__grid{
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 2.5rem;              /* 40px między kartami */
}

.mission-item{ color: #1E293B; }
.mission-item__icon{
  display: block;
  height: 4.375rem;          /* 70px */
  width: auto;
  margin: 0 0 2.25rem 0;     /* 36px odstępu do tytułu */
}
.mission-item__title{
  margin: 0 0 1.125rem 0;    /* 18px odstępu do linii */
  font-weight: 600;          /* Gilroy SemiBold */
  font-size: 1.5rem;         /* 24px */
  line-height: 1.2;
  color: #1E293B;
}
.mission-item__rule{
  display: inline-block;
  width: 3.125rem;           /* 50px */
  height: 0.5px;
  background: #1E293B;
  transform: translateZ(0);  /* ostre 0.5px */
  margin: 0 0 1.125rem 0;    /* 18px odstępu do opisu */
}
.mission-item__desc{
  margin: 0;
  font-weight: 500;          /* Gilroy Medium */
  font-size: 1.125rem;       /* 18px */
  line-height: 1.55;
  color: #1E293B;
}

/* Mobile / tablet — clamp */
@media (max-width: 1024px){
  .mission__inner{
    padding: 2.5rem 1.25rem;     /* jak w innych sekcjach mobile */
    grid-template-columns: 1fr;  /* wszystko pod sobą */
    gap: 1.5rem;
  }
  .mission__title{ font-size: clamp(1.75rem, 6vw, 2.25rem); }
  .mission__grid{ grid-template-columns: 1fr; gap: 1.25rem; }
  .mission-item__icon{ height: clamp(2.75rem, 10vw, 4.375rem); margin-bottom: clamp(1rem, 3.5vw, 2.25rem); }
  .mission-item__title{ font-size: clamp(1.125rem, 4.5vw, 1.25rem); margin-bottom: clamp(.5rem, 2.8vw, 1.125rem); }
  .mission-item__rule{ width: clamp(2rem, 8vw, 3.125rem); margin-bottom: clamp(.5rem, 2.8vw, 1.125rem); }
  .mission-item__desc{ font-size: clamp(1rem, 3.8vw, 1.125rem); }
}

/* ========= GLOBAL: ciaśniejszy odstęp kicker → nagłówek ========= */
:root { --kicker-gap: 0.25rem; }  /* 4px desktop */
.section-kicker{ margin: 0 0 var(--kicker-gap) 0 !important; }
@media (max-width:1024px){ :root { --kicker-gap: 0.2rem; } }

/* grid dla mission (zachowujemy ostatnią wersję odstępów) */
.mission__grid { display: grid; grid-template-columns: 1fr 1fr; column-gap: 2.5rem; row-gap: 4rem; }

/* ===========================================================
   PARTNERZY — kicker, tytuł i karuzela z auto-przewijaniem
   =========================================================== */
.partners {
  background: var(--white);
  color: #1E293B;
  overflow: hidden;
}
.partners__inner { padding: 2.25rem var(--gutter); overflow: hidden; }
.partners__kicker {
  color: var(--hover-a); font-weight: 600; font-size: 1.25rem; letter-spacing: 0.02em;
  margin: 0 0 .25rem 0; text-transform: uppercase;
}
.partners__title {
  margin: 0 0 2rem 0; font-weight: 700; font-size: 3rem; line-height: 1.15; color: #1E293B;
}

/* Karuzela */
.partners__carousel {
  position: relative; overflow: hidden; width: 100%;
  mask-image: linear-gradient(to right, transparent 0%, black 10%, black 90%, transparent 100%);
  -webkit-mask-image: linear-gradient(to right, transparent 0%, black 10%, black 90%, transparent 100%);
}
.partners__track { display: flex; align-items: center; gap: clamp(3rem, 8vw, 5rem); animation: partnersScroll 40s linear infinite; will-change: transform; }
.partners__carousel:hover .partners__track { animation-play-state: paused; }
.partner { flex: 0 0 auto; display: flex; align-items: center; justify-content: center; }
.partner img {
  display: block; height: clamp(4rem, 8vw, 6.25rem); width: auto;
  filter: grayscale(1) saturate(0.3); opacity: 0.9;
  transition: transform 0.3s ease, filter 0.3s ease, opacity 0.3s ease; transform-origin: center;
}
.partner img:hover { filter: none; opacity: 1; transform: scale(1.06); }
@keyframes partnersScroll { 0% { transform: translateX(0); } 100% { transform: translateX(-50%); } }
@media (max-width: 1024px) {
  .partners__inner { padding: 2.25rem 1.25rem; }
  .partners__title { font-size: clamp(1.75rem, 6vw, 2.25rem); margin-bottom: 1.5rem; }
  .partners__track { gap: clamp(2rem, 6vw, 3rem); animation-duration: 30s; }
  .partner img { height: clamp(3.5rem, 10vw, 5rem); }
}

/* ===========================================================
   AKTUALNOŚCI — (zostawiona najnowsza wersja + FIX mobile)
   =========================================================== */
.news{ position:relative; background:#fff; color:#1E293B; }
.news__inner{ padding:4.5rem var(--gutter) 2.25rem; position:relative; z-index:1; }
.news::before{
  content:""; position:absolute; inset:0 0 auto 0;
  height: calc(4.5rem + 2.25rem + 7.03125rem); background: var(--yellow); z-index:0;
}
.news__title{ margin:0; font-weight:700; font-size:3rem; line-height:1.15; color:#1E293B; }
.news__rows{ margin-top:2.25rem; display:grid; gap:2.25rem; }
.news__track{ display:grid; grid-template-columns:repeat(4, minmax(0,1fr)); gap:2.25rem; }

/* Karta */
.news-card{ color:#1E293B; }
.news-card__thumb{
  position:relative; display:block; width:100%;
  aspect-ratio:16/9; overflow:hidden; border-radius:.25rem; box-shadow:var(--shadow-soft); background:#f5f5f5;
}
.news-card__thumb img {
  position: absolute;
  inset: 0;
  width: 100%; height: 100%;
  object-fit: cover;
  transition: transform .4s ease, filter .4s ease;
  filter: grayscale(100%);         /* start czarno-biały */
}
.news-card__thumb:hover img { transform: scale(1.05); filter: grayscale(0%); }

.news-card__title{ margin:1.5rem 0 0 0; font-weight:700; font-size:1.5rem; line-height:1.25; }
.news-card__subtitle{ margin:.375rem 0 0 0; font-weight:400; font-size:1.125rem; line-height:1.45; color:rgba(30,41,59,.9); }
.news-card__date{ display:inline-block; margin-top:1.5rem; font-weight:400; font-size:1.125rem; color:var(--hover-a); }

/* MOBILE slider OFF — pokazujemy 2 karty z 1. rzędu */
@media (max-width: 1024px) {
  .news, .news__inner { overflow-x: hidden; }
  .news__inner{ padding:2.5rem 1.25rem 2rem; }
  .news::before{ height: calc(2.5rem + 2.25rem + 5.5rem); }
  .news__title{ font-size:clamp(1.75rem,6vw,2.25rem); }

  .news-card__thumb img { filter: none; }

  .news__row--2 { display: none !important; }
  .news__row--1 .news__track {
    display: block !important; width: 100% !important; transform: none !important; margin: 0; padding: 0;
  }
  .news__row--1 .news-card { display: none !important; width: 100%; }
  .news__row--1 .news-card:nth-child(1),
  .news__row--1 .news-card:nth-child(2) { display: block !important; }
  .news__row--1 .news-card:nth-child(2) { margin-top: clamp(1rem, 3vw, 1.5rem); }

  .news-card__thumb { aspect-ratio: auto !important; }
  .news-card__thumb img { position: static !important; width: 100% !important; height: auto !important; display: block; transform: none; }

  .news-card__title{ margin-top:1rem; font-size:clamp(1.125rem,3.8vw,1.25rem); }
  .news-card__subtitle, .news-card__date{ font-size:clamp(1rem,3.6vw,1.125rem); }
}

/* na wszelki wypadek: globalna bariera przed poziomowym scrollowaniem */
html, body { max-width: 100%; overflow-x: hidden; }

/* =========================
   YOTF
   ========================= */
.yotf{ background: var(--blue); color: #fff; }
.yotf__inner{
  display: flex; align-items: center; justify-content: space-between;
  gap: 4.5rem; padding: 2.25rem 4.5rem;
}
.yotf__image{ flex: 0 0 auto; width: clamp(28rem, 46vw, 46.5rem); height: clamp(28rem, 41vw, 42.25rem); }
.yotf__image img{ display: block; width: 100%; height: 100%; object-fit: cover; }
.yotf__content{
  flex: 1 1 auto; min-width: 0; min-height: clamp(28rem, 41vw, 42.25rem);
  display: grid; grid-template-rows: auto 1fr auto auto; align-content: stretch; gap: 1.75rem;
}
.yotf__top{ display: grid; gap: .5rem; }
.yotf .section-kicker{ margin: 0; color: #F84791; font-weight: 600; font-size: 1.25rem; letter-spacing: .02em; }
.yotf__title{ margin: 0; font-weight: 800; font-size: 2.75rem; line-height: 1.2; color: #fff; }
.yotf__subtitle{ align-self: end; margin: 0; font-weight: 700; font-size: 1.625rem; line-height: 1.45; }
.yotf__text{ margin: 0 0 1.25rem 0; font-weight: 500; font-size: 1.5rem; line-height: 1.55; }
.yotf__buttons{ display: flex; gap: 1.5rem; }
.yotf__buttons .btn img{ width: 2rem; height: 2rem; }
.btn--primary{ background: var(--hover-a); color:#fff; }
.btn--secondary{
  background: var(--pink); color:#fff; font-weight:700; font-size:1.5rem; line-height:1;
  padding:0 1.25rem; height:3.5rem; min-width:13.625rem; display:inline-flex; align-items:center; justify-content:center; gap:.5rem;
  border:none; border-radius:.375rem; cursor:pointer; box-shadow:var(--shadow-soft);
  transition: transform 140ms ease, box-shadow 220ms ease, background-color 220ms ease;
}
.btn--secondary:hover { transform: translateY(-1px); }
.btn--secondary:active { transform: translateY(0); }
.btn--secondary:focus-visible { box-shadow: var(--focus-ring-inv); }

@media (max-width: 1024px){
  .yotf__inner{ flex-direction: column; align-items: flex-start; gap: 1.75rem; padding: 2.5rem 1.25rem; }
  .yotf__image{ width: 100%; height: auto; aspect-ratio: 744 / 676; }
  .yotf__content{ min-height: auto; grid-template-rows: auto auto auto auto; gap: .75rem; }
  .yotf__title{ font-size: clamp(1.75rem, 6vw, 2.25rem); }
  .yotf__subtitle{ font-size: clamp(1.125rem, 4.5vw, 1.625rem); }
  .yotf__text{ font-size: clamp(1rem, 3.8vw, 1.25rem); }
  .yotf__buttons{ width: 100%; flex-direction: column; align-items: stretch; gap: .75rem; }
}

/* ===========================================================
   PARTNERZY — większy padding dolny
   =========================================================== */
.partners__inner { padding: 72px 72px 72px 72px !important; }

/* =============================
   KALENDARIUM — FINAL
   ============================= */
.calendar { background: var(--white); color: #1E293B; }
.calendar__inner { padding: 2.25rem 4.5rem; }
.calendar__title { margin: 0 0 2.25rem 0; font: 700 3rem/1.15 "Gilroy", sans-serif; color: #1E293B; }
.calendar__list { margin: 0; padding: 0; list-style: none; border-top: 0.5px solid #B1B1B1; }
.calendar__row {
  display: grid; grid-template-columns: 25rem 1fr; column-gap: 22.5rem; align-items: center;
  min-height: 4.5rem; padding: 1rem 0; border-bottom: 0.5px solid #B1B1B1;
  transition: background-color 0.3s ease, color 0.3s ease;
}
.calendar__row:hover { background-color: rgba(248, 212, 72, 0.5); }
.calendar__row:hover .calendar__date, .calendar__row:hover .calendar__event { color: var(--pink); transition: color 0.3s ease; }
.calendar__datecell { display: inline-flex; align-items: center; gap: 0.75rem; width: 25rem; }
.calendar__icon { inline-size: 1.25rem; block-size: 1.25rem; flex: 0 0 auto; }
.calendar__date { font: 700 2.25rem/1 "Gilroy", sans-serif; color: var(--pink); white-space: nowrap; transition: color 0.3s ease; }
.calendar__event { color: #1E293B; text-decoration: none; font: 700 1.5rem/1.25 "Gilroy", sans-serif; transition: color 0.3s ease; }
.calendar__event:hover { text-decoration: underline; text-underline-offset: 0.2em; }
@media (max-width: 1024px) {
  .calendar__inner { padding: 2.25rem 1.25rem; }
  .calendar__title { font-size: clamp(1.75rem, 6vw, 2.25rem); margin-bottom: 2.25rem; }
  .calendar__row { grid-template-columns: 1fr; row-gap: 0.5rem; column-gap: 0; }
  .calendar__datecell { width: 100%; }
  .calendar__date { font-size: clamp(1.375rem, 6vw, 1.75rem); }
  .calendar__event { font-size: clamp(1rem, 4.2vw, 1.25rem); }
}

/* =========================
   KONTAKT — FINAL
   ========================= */
.contact { background: var(--hover-a); color: #fff; }
.contact__inner {
  padding: var(--gutter); display: grid; grid-template-columns: 1fr 36.25rem; gap: 4.5rem; align-items: stretch;
}
.contact__title {
  margin: 0; font-family: "Gilroy", sans-serif; font-weight: 700; font-size: 3rem; line-height: 1.15; color: #fff;
}
.contact__lead {
  margin-top: 2.25rem; font-weight: 400; font-size: 1.75rem; line-height: 1.5; max-width: 42rem;
}
.contact__form { margin-top: 2.25rem; display: grid; gap: 1rem; }
.contact__row { display: grid; grid-template-columns: 25rem 25rem; gap: 1rem; }
.field { display: block; }
.field input {
  width: 100%; height: 3rem; padding: 0 .75rem; border: 1px solid rgba(255, 255, 255, 0.55);
  background: rgba(255, 255, 255, 0.12); color: #fff; border-radius: .25rem; outline: none;
  transition: border-color .2s ease, background-color .2s ease, box-shadow .2s ease;
  font: 400 1.125rem/1.2 "Gilroy", sans-serif;
}
.field input::placeholder { color: rgba(255, 255, 255, .9); }
.field input:focus { background: rgba(255, 255, 255, .18); border-color: #fff; box-shadow: 0 0 0 3px rgba(255, 255, 255, .25); }
.contact__submit {
  display: inline-flex; align-items: center; justify-content: center; height: 3rem; min-width: 10.5rem; padding: 0 1rem;
  border: none; border-radius: .25rem; background: var(--pink); color: #fff; font: 700 1.125rem/1 "Gilroy", sans-serif; cursor: pointer;
  transition: transform 0.2s ease, background-color 0.2s ease;
}
.contact__submit img { width: 1.125rem; height: 1.125rem; margin-left: .5rem; }
.contact__submit:hover { transform: translateY(-1px); background: #d91749; }
.contact__hint { margin: .5rem 0 0; font-size: .9375rem; color: #fff; opacity: .9; }
.contact__right { display: flex; flex-direction: column; justify-content: flex-end; }
.contact__rodo { margin: 0; max-width: 36.25rem; font-weight: 300; font-size: 1.125rem; line-height: 1.6; color: rgba(255, 255, 255, .95); }
@media (max-width: 1024px) {
  .contact__inner { padding: 2.5rem 1.25rem; grid-template-columns: 1fr; gap: 1.75rem; }
  .contact__title { font-size: clamp(1.75rem, 6vw, 2.25rem); }
  .contact__lead { font-size: clamp(1rem, 4.2vw, 1.25rem); margin-top: 1rem; }
  .contact__row { grid-template-columns: 1fr; }
  .field input { height: 2.75rem; font-size: clamp(1rem, 3.6vw, 1.125rem); }
  .contact__submit { width: 100%; height: 2.75rem; font-size: clamp(1rem, 3.6vw, 1.125rem); }
  .contact__rodo { font-size: clamp(.875rem, 3.3vw, 1rem); opacity: .95; }
}

/* =========================
   PARTNERZY STALI — FINAL CLEAN
   ========================= */
.partners-static { background: var(--white); color: #1E293B; }
.partners-static__inner { padding: 4.5rem 4.5rem; } /* 72px */
.partners-static__kicker {
  color: #1E293B; margin: 0 0 2.25rem 0; font-family: "Gilroy", sans-serif; font-weight: 600; font-size: 1.375rem; letter-spacing: 0.02em;
}
.partners-static__logos { display: flex; align-items: center; gap: 2.5rem; }
.partners-static__item img {
  display: block; height: clamp(3.5rem, 8vw, 6.25rem); width: auto;
  filter: grayscale(100%) contrast(1) opacity(.85);
  transform: translateZ(0); transition: filter .35s ease, transform .25s ease;
}
.partners-static__item:hover img, .partners-static__item:focus-within img { filter: grayscale(0%) opacity(1); transform: scale(1.03); }
@media (max-width: 1024px) {
  .partners-static__inner { padding: 2.5rem 1.25rem; }
  .partners-static__kicker { font-size: 1rem; font-weight: 500; margin-bottom: 1.75rem; }
  .partners-static__logos {
    display: flex; justify-content: flex-start; align-items: center; gap: 1.25rem; width: 100%;
  }
  .partners-static__item { flex: 1 1 40%; display: flex; justify-content: center; }
  .partners-static__item img {
    width: 85%; height: auto; filter: none; opacity: 1; transform: none; transition: none; max-width: 160px;
  }
}

/* ====== STOPKA – layout 3 kolumny ====== */
.site-footer { background: var(--pink); color: #fff; }
.site-footer__inner {
  padding: var(--gutter); display: grid; grid-template-columns: auto 1fr auto; align-items: start; column-gap: clamp(2rem, 6vw, 4rem);
}
.footer__brand { justify-self: start; align-self: start; }
.footer__brand img { display: block; width: 23.4375rem; height: 12.5rem; object-fit: contain; object-position: left top; }
.footer__nav { justify-self: center; align-self: start; }
.footer__menu { list-style: none; margin: 0; padding: 0; }
.footer__menu li + li { margin-top: .75rem; }
.footer__menu a {
  position: relative; display: inline-block; text-decoration: none; color: #fff;
  font: 700 1.375rem/1.2 "Gilroy", sans-serif; transition: color .25s ease;
}
.footer__menu a::after {
  content: ""; position: absolute; left: 0; bottom: -0.3em; width: 100%; height: 2px; background: currentColor;
  transform: scaleX(0); transform-origin: left center; transition: transform .28s cubic-bezier(.22,.61,.36,1); opacity: .9;
}
.footer__menu a:hover::after, .footer__menu a:focus-visible::after { transform: scaleX(1); }
.footer__social { list-style: none; margin: 0; padding: 0; display: flex; gap: 1rem; justify-self: end; align-self: start; }
.dot--footer {
  inline-size: var(--dot-size); block-size: var(--dot-size); border-radius: 50%; background: #fff;
  display: inline-grid; place-items: center; box-shadow: var(--shadow-soft);
  transition: background-color .22s ease, transform .12s ease;
}
.dot--footer:hover { background: var(--pink); }
/* obrazek-ikona jako <img> (zostawiamy ostatnią wersję filtra + :hover) */
.dot__img {
  width: 1.125rem; height: 1.125rem; display: block;
  filter: brightness(0) saturate(100%) invert(20%) sepia(99%) saturate(7492%) hue-rotate(323deg) brightness(94%) contrast(96%);
  transition: filter .22s ease;
}
.dot--footer:hover .dot__img, .dot--footer:focus-visible .dot__img { filter: brightness(0) invert(1); }

@media (max-width: 1024px) {
  .site-footer__inner {
    padding: 2.5rem 1.25rem; grid-template-columns: 1fr; row-gap: 1.25rem;
  }
  .footer__brand, .footer__nav, .footer__social { justify-self: start; }
  .footer__brand img { width: clamp(12rem, 60vw, 18rem); height: auto; }
  .footer__menu a { font-size: clamp(1rem, 3.8vw, 1.125rem); }
}

/* =========================
   COPYRIGHT FOOTER
   ========================= */
.footer-copyright {
  background: var(--white); color: #1E293B;
  padding: 2.25rem var(--gutter); display: flex; justify-content: flex-end; align-items: center;
}
.footer-copyright p {
  margin: 0; font-family: "Gilroy", sans-serif; font-weight: 700; font-size: 1.375rem; line-height: 1.2; color: #1E293B;
}
@media (max-width: 1024px) { .footer-copyright { display: none; } }

/* ===========================================================
   TYPOGRAPHY SYSTEM — skala, hierarchia i odchudzenie wag
   =========================================================== */

/* 2. Skala kroków (tokeny) */
:root{
  --step--1:.875rem; /* 14 */
  --step-0: 1rem;    /* 16 */
  --step-1:1.125rem; /* 18 */
  --step-2:1.25rem;  /* 20 */
  --step-3:1.5rem;   /* 24 */
  --step-4:2.25rem;  /* 36 */
  --step-5:3rem;     /* 48 */
}

/* 3. Header – bez „półgrubego wszędzie” */
.site-header{ background:var(--white); }
.site-header *{ font-weight:400; } /* reset globalnego 600 */
.nav__menu a{ font-weight:600; font-size:var(--step-3); } /* 24 semibold */

/* 4. Tytuły sekcji – spójnie */
.section-title,
.mission__title,
.partners__title,
.news__title,
.calendar__title,
.contact__title{
  font-weight:700;
  font-size:var(--step-4); /* 36 */
  line-height:1.2;
}

/* kicker */
.section-kicker{
  font-weight:600;
  font-size:var(--step-0); /* 16 */
  letter-spacing:.02em;
}

/* 5. Akapity / leady */
.about__right p,
.yotf__text,
.news-card__subtitle{
  font-weight:400;
  font-size:var(--step-1); /* 18 */
  line-height:1.55;
}

.hero__lead,
.contact__lead,
.yotf__subtitle{
  font-size:var(--step-2); /* 20 */
  font-weight:400;
  line-height:1.5;
}

/* 6. Tytuły kart / podnagłówki */
.mission-item__title,
.news-card__title{
  font-size:var(--step-3); /* 24 */
  font-weight:600;
  line-height:1.25;
}

/* 7. HERO / YOTF tytuły */
.hero__title{ font-size:var(--step-5); line-height:1.15; font-weight:700; }
.yotf__title{ font-size:2.5rem; line-height:1.2; font-weight:700; } /* było 800/2.75rem */

/* 8. CTA – lżejsze wizualnie (rozmiar 18) */
.btn--primary,
.btn--secondary{ font-size:var(--step-1); font-weight:700; }

/* 9. Stopka delikatniej */
.footer__menu a{ font-weight:600; font-size:var(--step-1); }
.footer-copyright p{ font-weight:600; font-size:var(--step-1); }

/* 10. Redukcja „przerośniętych” miejsc (priorytetowo, bez ruszania layoutu) */
.about__right p{ font-size:var(--step-1) !important; }  /* 18 zamiast 28 */
.contact__lead{ font-size:var(--step-2) !important; }   /* 20 zamiast 28 */
.contact__rodo{ font-weight:400 !important; }           /* z 300 na 400 */

/* ===== OFF-CANVAS — harden & fix ===== */
.offcanvas{
  position: fixed;
  inset: 0;
  z-index: 1200;                 /* wyżej niż wszystko inne */
  pointer-events: none;
  visibility: hidden;            /* domyślnie ukryty */
  opacity: 0;
  transition: opacity .26s ease, visibility .26s step-end;
}
.offcanvas__backdrop{
  position: absolute;
  inset: 0;
  background: transparent;
  transition: background .26s ease;
}
.offcanvas__panel{
  position: absolute;
  top: 0; right: 0;
  height: 100dvh;
  width: 37.5rem;                /* 600px */
  max-width: 100%;
  background: var(--yellow);
  transform: translateX(100%);
  will-change: transform;
  transition: transform .26s cubic-bezier(.22,.61,.36,1);
  display: grid;
}
/* Otwieranie — wspieramy dwie konwencje: .offcanvas.is-open OR body.offcanvas-open */
.offcanvas.is-open,
body.offcanvas-open .offcanvas{
  pointer-events: auto;
  visibility: visible;
  opacity: 1;
  transition: opacity .26s ease, visibility .26s step-start;
}
.offcanvas.is-open .offcanvas__panel,
body.offcanvas-open .offcanvas .offcanvas__panel{ transform: translateX(0); }
.offcanvas.is-open .offcanvas__backdrop,
body.offcanvas-open .offcanvas .offcanvas__backdrop{ background: var(--backdrop); }
/* Scroll lock (zgodny z Twoim istniejącym CSS) */
html.no-scroll, html.no-scroll body{ overflow: hidden; }

/* ===== HEADER: desktop – układ 2-rzędowy (logo, potem menu) ===== */
@media (min-width:1025px){
  .nav{
    display: grid;
    grid-template-columns: 1fr;
    grid-template-rows: auto auto;   /* 1: brand, 2: menu */
    align-items: start;
    column-gap: clamp(1rem, 4vw, 3rem);
    position: relative;              /* dla absolutnego .nav__actions */
  }
  .nav__brand{ grid-row: 1; }
  .nav__menu{ grid-row: 2; margin: 4rem 0 0; }
}

/* ============================================
   DOTS ROW STATIC, ONLY BURGER FIXED (DESKTOP)
   ============================================ */
/* JEST (desktop) — brand lewo, kropki prawo, menu niżej */
@media (min-width: 1025px) {
  .nav{
    display: grid;
    grid-template-columns: 1fr auto; /* brand | actions */
    grid-template-rows: auto auto;   /* rząd 1: brand+actions, rząd 2: menu */
    align-items: center;
    column-gap: clamp(1rem, 4vw, 3rem);
    position: relative; /* na wszelki wypadek */
  }
  .nav__brand{ grid-column: 1; grid-row: 1; }
  .nav__actions{
    grid-column: 2; grid-row: 1;
    position: static;            /* kluczowe: żadnego absolute */
    justify-self: end;
  }
  .nav__menu{ grid-column: 1 / -1; grid-row: 2; margin: 4rem 0 0; }
}


/* MOBILE/TABLET – układ bez kropek, tylko burger przy prawej krawędzi */
@media (max-width: 1024px){
  .hide-mobile{ display: none !important; } /* jeśli chcesz ukrywać social/EN */
  .nav__actions{ position: static; }
}

/* === BURGER — JEDNOŹRÓDŁOWE REGUŁY === */

/* 1) Pozycja startowa (desktop): burger stoi w rzędzie z kropkami */
#burger-btn{
  position: static;              /* jest w flow, więc stoi obok innych kropek */
  inline-size: var(--dot-size);
  block-size: var(--dot-size);
  border-radius: 50%;
  border: 0;
  display: inline-grid;
  place-items: center;
  background: var(--pink);
  cursor: pointer;
  box-shadow: var(--shadow-soft);
  transition: background-color 220ms ease, transform 120ms ease;
  z-index: 1100;                 /* nad treścią, ale niżej niż offcanvas (1200) */
}
#burger-btn:hover{ background: var(--hover-b); }
#burger-btn:active{ transform: translateY(1px) scale(.98); }
#burger-btn img{ width: 1.125rem; height: 1.125rem; display: block; }

/* 2) „Odklejony” burger po scrollu (desktop) */
@media (min-width:1025px){
  #burger-btn.is-stuck{
    position: fixed;
    top: 2.25rem;                /* 36px */
    right: var(--gutter);        /* 72px — spójnie z paddingiem nawigacji */
  }
}

/* 3) Mobile/Tablet — burger zawsze fixed przy prawej krawędzi (UX mobilny) */
@media (max-width:1024px){
  #burger-btn{
    position: fixed;
    top: 1.5rem;
    right: 1.25rem;
  }
}

/* ===========================
   PLACEHOLDER DOT W RZĘDZIE
   =========================== */
.dot--placeholder{
  inline-size: var(--dot-size);
  block-size: var(--dot-size);
  border-radius: 50%;
  background: var(--white);
  box-shadow: var(--shadow-soft);
  display: inline-block;
}

/* ===========================
   BURGER OVERLAY (desktop)
   =========================== */
/* Header jako kontekst pozycjonowania (masz już position:relative na .nav w desktopie;
   na wszelki wypadek nadajemy też względny kontekst na .site-header) */
.site-header{ position: relative; }

/* Burger jako warstwa nad rzędem (startowo leży tam,
   gdzie placeholder – prawa krawędź nagłówka) */
@media (min-width: 1025px){
  #burger-btn{
    position: absolute;          /* <— klucz: overlay, nie w flow */
    top: 2.25rem;                /* wyrównanie w pionie do rzędów (~36px) */
    right: var(--gutter);        /* ta sama „gutter” co kropki */
    z-index: 1100;
  }
  /* Po odklejeniu: wędruje do prawego górnego rogu okna */
  #burger-btn.is-stuck{
    position: fixed;
    top: 2.25rem;
    right: var(--gutter);
  }
}

/* ===========================
   BURGER (mobile/tablet)
   =========================== */
@media (max-width: 1024px){
  /* na mobile i tak chcesz fixed przy prawej krawędzi */
  #burger-btn{
    position: fixed;
    top: 1.5rem;
    right: 1.25rem;
    z-index: 1100;
  }
  /* placeholder niepotrzebny na mobile, bo kropki są ukryte */
  .dot--placeholder{ display: none; }
}

/* =========================
   BURGER (overlay) + PLACEHOLDER FINAL
   ========================= */

/* Placeholder – zawsze biały, nie reaguje na JS */
.dot--placeholder {
  inline-size: var(--dot-size);
  block-size: var(--dot-size);
  border-radius: 50%;
  background: var(--white) !important;
  box-shadow: var(--shadow-soft);
  display: inline-block;
  transition: background-color 0.2s ease, transform 0.12s ease;
}
.dot--placeholder:hover {
  background: var(--white) !important;
  transform: none;
}

/* Burger – warstwa nad kropkami */
.site-header { position: relative; }

#burger-btn {
  inline-size: var(--dot-size);
  block-size: var(--dot-size);
  border-radius: 50%;
  border: 0;
  display: inline-grid;
  place-items: center;
  background: var(--pink);
  cursor: pointer;
  box-shadow: var(--shadow-soft);
  transition: background-color 0.22s ease, transform 0.12s ease;
  z-index: 1100;
}

/* Desktop: absolute → fixed */
@media (min-width: 1025px) {
  #burger-btn {
    position: absolute;
    top: 2.25rem;
    right: var(--gutter);
  }
  #burger-btn.is-stuck {
    position: fixed;
    top: 2.25rem;
    right: var(--gutter);
  }
}

/* Mobile – zawsze fixed */
@media (max-width: 1024px) {
  #burger-btn {
    position: fixed;
    top: 1.5rem;
    right: 1.25rem;
  }
  .dot--placeholder { display: none; }
}

/* === Placeholder: zawsze biały, bez losowego hovera === */
.dot--placeholder{
  inline-size: var(--dot-size);
  block-size: var(--dot-size);
  border-radius: 50%;
  background: var(--white) !important;
  box-shadow: var(--shadow-soft);
  display: inline-block;
  transition: background-color .2s ease, transform .12s ease;
}
.dot--placeholder:hover{ background: var(--white) !important; transform: none; }

/* === Burger jako overlay — start: absolutnie na placeholderze === */
.site-header{ position: relative; }
#burger-btn{
  inline-size: var(--dot-size);
  block-size: var(--dot-size);
  border: 0;
  border-radius: 50%;
  display: inline-grid;
  place-items: center;
  background: var(--pink);
  box-shadow: var(--shadow-soft);
  cursor: pointer;
  transition: background-color .22s ease, transform .12s ease, opacity .12s ease;
  z-index: 1100;
  opacity: 0;                 /* ukryj do czasu pierwszego „dokowania” JS */
}
#burger-btn:hover{ background: var(--hover-b); }
#burger-btn img{ width: 1.125rem; height: 1.125rem; display: block; }

@media (min-width:1025px){
  /* pozycje startowe ustawi JS (left/top); trzymamy transform do centrowania */
  #burger-btn{
    position: absolute;
    left: 0; top: 0;
    transform: translate(-50%, -50%);
  }
  /* po odklejeniu: kontrola wyłącznie przez CSS */
  #burger-btn.is-stuck{
    position: fixed;
    top: 2.25rem;
    right: var(--gutter);
    left: auto !important;       /* ważne: zeruje left z trybu absolute */
    transform: none !important;  /* i zeruje centrowanie */
    opacity: 1;
  }
}

/* Mobile: burger stale fixed, placeholder znika */
@media (max-width:1024px){
  #burger-btn{
    position: fixed;
    top: 1.5rem;
    right: 1.25rem;
    opacity: 1;
  }
  .dot--placeholder{ display:none; }
}

/* bazowy transform do dokowania (center na placeholderze) */
#burger-btn{
  --t: translate(-50%, -50%);
  inline-size: var(--dot-size);
  block-size: var(--dot-size);
  border: 0;
  border-radius: 50%;
  display: inline-grid;
  place-items: center;
  background: var(--pink);
  box-shadow: var(--shadow-soft);
  cursor: pointer;
  transition: background-color .22s ease, transform .12s ease, opacity .12s ease;
  z-index: 1100;
  opacity: 0;
  transform: var(--t);              /* ← UŻYWAMY zmiennej */
}
#burger-btn:hover{ background: var(--hover-b); transform: var(--t); }
/* klik NIE nadpisuje bazowego centrowania */
#burger-btn:active{ transform: var(--t) translateY(1px) scale(.98); }

@media (min-width:1025px){
  #burger-btn{
    position: absolute;
    left: 0; top: 0;
  }
  #burger-btn.is-stuck{
    position: fixed;
    top: 2.25rem;
    right: var(--gutter);
    left: auto !important;
    /* gdy „odklejony” – wyłączamy bazowy transform */
    --t: none;
    transform: none !important;
    opacity: 1;
  }
}

@media (max-width:1024px){
  #burger-btn{
    position: fixed;
    top: 1.5rem;
    right: 1.25rem;
    --t: none;                   /* na mobile nie centrować */
    transform: none;
    opacity: 1;
  }
}


/* Ukrycie paska, ale zachowanie przewijania */
html {
  scrollbar-width: none;         /* Firefox */
}
html::-webkit-scrollbar {
  width: 0;
  height: 0;
}

/* ===== NATIVE SCROLLBAR: ukryty globalnie, ale scroll działa ===== */
html {
  scrollbar-width: none;            /* Firefox */
  -ms-overflow-style: none;         /* IE/Edge Legacy */
}
html::-webkit-scrollbar {
  width: 0 !important; height: 0 !important; /* Chrome/Safari/Edge */
}

/* ===== Ukrycie natywnych pasków (scroll działa) ===== */
html {
  scrollbar-width: none;          /* Firefox */
  -ms-overflow-style: none;       /* IE/Edge Legacy */
}
html::-webkit-scrollbar { width: 0 !important; height: 0 !important; }

.partners__inner {
  padding: 4.5rem var(--gutter); /* 72px po bokach w desktop */
  overflow: hidden;
}

@media (max-width: 1024px) {
  .partners__inner {
    padding: 2.5rem 1.25rem !important; /* spójnie z innymi sekcjami mobile */
  }
}

/* === MISSION: single column on mobile/tablet === */
@media (max-width: 1024px) {
  .mission__inner {
    grid-template-columns: 1fr !important;
  }
  .mission__grid {
    grid-template-columns: 1fr !important;  /* <— kluczowe */
    column-gap: 0 !important;
    row-gap: 1.25rem !important;
  }
}

/* === STOPKA – WIĘKSZE ODSTĘPY MIĘDZY BLOKAMI === */
.site-footer__inner {
  row-gap: 3rem; /* większy odstęp pionowy między logo, menu i kropkami */
}

.footer__brand {
  margin-bottom: 2rem; /* dodatkowa przestrzeń pod logo */
}

.footer__social {
  margin-top: 2rem; /* odstęp nad kulkami */
}

/* mobile: jeszcze więcej luzu dla przejrzystości */
@media (max-width: 1024px) {
  .site-footer__inner {
    row-gap: 2.75rem;
  }
  .footer__brand {
    margin-bottom: 2.25rem;
  }
  .footer__social {
    margin-top: 2.25rem;
  }
}

/* === YOTF: ukrycie zdjęcia w wersji mobilnej === */
@media (max-width: 1024px) {
  .yotf__image {
    display: none !important;
  }
}

/* === OFFCANVAS (mobile): close w tej samej pozycji co burger === */
@media (max-width: 1024px) {
  .icon-btn--close{
    top: 1.5rem !important;
    right: calc(1.25rem + env(safe-area-inset-right, 0px)) !important;
    inline-size: 2.75rem;
    block-size: 2.75rem;
  }

  /* opcjonalnie: wyrównaj wewnętrzne paddingi panelu jak w innych sekcjach */
  .offcanvas__inner{
    padding: 2.5rem 1.25rem !important;
    padding-right: calc(1.25rem + 3.25rem) !important; /* miejsce na przycisk */
  }
}

/* === OFFCANVAS (menu mobilne) – responsywne skalowanie === */
@media (max-width: 1024px) {
  .offcanvas__panel {
    height: 100dvh;               /* dokładnie wysokość widoczna */
    max-height: 100dvh;
    overflow: hidden;             /* wyłącz wewnętrzny scroll */
  }

  .offcanvas__inner {
    padding: 2rem 1.25rem;        /* ciaśniej, żeby wszystko się mieściło */
    display: flex;
    flex-direction: column;
    justify-content: space-between; /* rozciąga górną i dolną część */
    height: 100%;
  }

  /* Główne linki (O nas / Zespół / Kontakt) */
  .list--xl a {
    font-size: clamp(1.75rem, 6vw, 2.25rem); /* dynamicznie maleje na mniejszych ekranach */
    line-height: 1.1;
  }

  /* Linki drugiego poziomu */
  .list--md a {
    font-size: clamp(1.125rem, 4.5vw, 1.5rem);
    line-height: 1.25;
  }

  /* Kropki na dole */
  .offcanvas__dots {
    display: flex;
    justify-content: center;
    align-items: center;
    gap: clamp(0.5rem, 2vw, 0.75rem);
    margin-top: 1rem;
  }

  .offcanvas__dots .dot {
    inline-size: clamp(2.25rem, 7vw, 2.75rem);
    block-size: clamp(2.25rem, 7vw, 2.75rem);
  }

  /* Przycisk zamknięcia — ten sam rozmiar co burger */
  .icon-btn--close {
    top: 1.5rem !important;
    right: 1.25rem !important;
    inline-size: clamp(2.25rem, 7vw, 2.75rem);
    block-size: clamp(2.25rem, 7vw, 2.75rem);
  }
}

/* === MOBILE TYPO SCALE – delikatne zmniejszenie całości === */
@media (max-width: 1024px) {
  /* Lekkie zbicie całej skali (ok. ~7–12% w dół) */
  :root{
    --step--1: .8125rem; /* 13 */
    --step-0 : .9375rem; /* 15 */
    --step-1 : 1rem;     /* 16 */
    --step-2 : 1.125rem; /* 18 */
    --step-3 : 1.25rem;  /* 20 */
    --step-4 : 1.75rem;  /* 28 */
    --step-5 : 2.25rem;  /* 36 */
  }

  /* Uspójnienie dużych nagłówków sekcji na małych ekranach */
  .section-title,
  .mission__title,
  .partners__title,
  .news__title,
  .calendar__title,
  .contact__title{
    font-size: clamp(1.5rem, 5.2vw, 2rem) !important;
    line-height: 1.15;
  }

  /* YOTF (gdy obraz ukryty): jeszcze odrobinę ciaśniej */
  .yotf__title{ font-size: clamp(1.5rem, 5.2vw, 2rem) !important; }
  .yotf__subtitle{ font-size: clamp(1rem, 3.8vw, 1.125rem) !important; }
  .yotf__text{ font-size: clamp(.9375rem, 3.6vw, 1.0625rem) !important; }

  /* Karty / podtytuły – odrobinę mniejsze */
  .mission-item__title,
  .news-card__title{
    font-size: clamp(1rem, 4.2vw, 1.125rem) !important;
  }
  .news-card__subtitle{
    font-size: clamp(.9375rem, 3.6vw, 1.0625rem) !important;
  }

  /* Ogólne akapity (jeśli gdzieś nie używają tokenów) */
  p{ font-size: clamp(.9375rem, 3.6vw, 1rem); }
}