.m-services__title b,
.m-services__title strong { font-weight: 700; }


.container {
    max-width: 1200px;
    margin: 0 auto;
    padding: 0 0px
}

.site-header,.site-footer {
    padding-top: 0px;
   padding-bottom: 16px;
}

.site-logo {
    font-weight: 700;
    text-decoration: none
}

.site-main {
    display: block
}

.m-banner {
    width: 100%;
    display: block;
    overflow: hidden;
  margin-top: 15px
}

.m-banner__img {
    width: 1280px;
    height: auto;
    display: block;
    object-fit: cover;
    display: block;
    margin-left: auto;
    margin-right: auto;
}

.m-text-image {
    padding: 60px 0
}

.m-text-image__inner {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 32px;
    align-items: center
}

.m-text-image__image img {
    width: 100%;
    display: block;
    border-radius: 12px
}

@media(max-width: 900px) {
    .m-text-image__inner {
        grid-template-columns:1fr
    }
}




/* === HERO CARDS (3 kafelki) === */

.mojeee1 {
z-index: 2;
position: relative;
 margin-top: -180px;
margin-bottom: -120px 
}


.m-hero-cards{
  width:min(1128px, 100% - 2rem);
  display:grid;
  grid-template-columns: 578fr 263fr 263fr; /* 578 / 263 / 263 */
  gap:12px;
  margin:0 auto;
}

.mhc__big{
  padding:24px;
  height:220px;
  display:flex;
  flex-direction:column;
  align-items:flex-start;
  gap:24px;
}
.mhc__title{
  font-size:42px; line-height:110%; color:#283896; font-weight:400; margin:0;
}
.mhc__subtitle{
  font-size:21px; line-height:120%; color:rgba(40,56,150,.75); font-weight:500; margin:0;
}
.mhc__btn{
  background:#E7DAFA; border:1.4px solid #8849D4; color:#283896; border-radius:24px;
  padding:12px 24px; gap:6px; height:40px
}

.hoverrroff {
	
}

.hoverrron {
display: none;	
}

.mhc__btn:hover {
  background:#DCDCDC; border:1.4px solid #DCDCDC; color:#989898; border-radius:24px;
  padding:12px 24px; gap:6px; height:40px
}

.mhc__btn:hover .hoverrroff {
display: none;	
}

.mhc__btn:hover .hoverrron {
display: block;	
}

.mhc__btn .mhc__arrow{ width:16px; height:16px }

/* wspólny wygląd małych kart */
.mhc__small{
  padding:16px;
  height:220px;
  display:flex;
  flex-direction:column;
  gap:16px;
  text-decoration:none;
  color:inherit;
}
.mhc__small-media{
  position:relative;
  width:231px; height:135px;
  border-radius:12px 12px 0 0;
  overflow:hidden;
  background:#283896;
  display:flex; align-items:flex-start; justify-content:center;
}
.mhc__small-media img{ width:100%; height:100%; object-fit:cover; display:block }

.mhc__small-media.is-placeholder{ background:#283896 }
.mhc__badge{
  position:absolute; top:8px; left:8px;
  width:24px; height:24px; border-radius:50%; display:grid; place-items:center;
  color:#fff; background:#263788; font-size:12px; font-weight:700;
}
.mhc__small-caption{
  position:absolute; bottom:8px; left:8px; right:8px; color:#fff; text-align:center
}
.mhc__small-title{ font-size:24px; line-height:110%; font-weight:700 }
.mhc__small-sub{ font-size:12px; line-height:110%; opacity:.95 }

.mhc__bars{ position:absolute; display:flex; gap:6px; opacity:.2 }
.mhc__bars--right{ right:6px; bottom:8px; height:118px }
.mhc__bars--left{ left:6px; top:8px; height:118px; transform:rotate(180deg) }
.mhc__bars::before, .mhc__bars::after, .mhc__bars span{
  content:""; display:block; width:20px; background:#E7DAFA; border-radius:24px 24px 0 0
}
.mhc__bars::before{ height:62px }
.mhc__bars span{ height:90px }
.mhc__bars::after{ height:118px }

.mhc__link{
  display:flex; align-items:center; gap:16px; height:36px;
  font-size:16px; font-weight:500; line-height:110%; color:#283896;
}

@media (max-width: 1150px){
  .m-hero-cards{ grid-template-columns: 1fr; }
  .mhc__big, .mhc__small{ height:auto }
  .mhc__small-media{ width:100% }
}


/* === PORTAL CTA (1128x, gap 72; obraz 550x350, radius 24) === */
.m-cta{
  width:min(1128px, 100% - 2rem);
  margin:0 auto;
  display:flex;
  align-items:center;
  gap:72px;
  padding:64px 0;
}

.m-cta__media{
  width:550px; height:350px; flex:0 0 auto; overflow:hidden; border-radius:24px;
  box-shadow: var(--shadow-200);
}
.m-cta__media img{ width:100%; height:100%; object-fit:cover; display:block }

.m-cta__content{ width:506px; display:flex; flex-direction:column; gap:24px }
.m-cta__title{
  font-size:36px; line-height:110%; color:var(--primary); font-weight:400; margin:0;
}
.m-cta__text{
  font-size:14px; line-height:140%; letter-spacing:.01em; color:#3D3D3D; margin:0;
}

.m-cta__actions{ display:flex; gap:24px; align-items:flex-start }
.m-cta__btn{ height:40px; padding:12px 24px; gap:6px; border-radius:24px }
.m-cta__btn svg{ flex:0 0 auto }

.btn--primary{ background:var(--primary); color:#fff }

.btn--primary:hover { background:#DCDCDC; color:#989898 }

.btn--primary:hover .hoverrroff {
display: none;	
}

.btn--primary:hover .hoverrron {
display: block;	
  margin-left: 2px;
width: 11px !important;
height: 11px !important;
}


.m-cta__btn--ghost{ border-color:var(--primary); color:var(--primary) }

.m-cta__btn--ghost:hover {
border-color:#989898;	
color:#989898;
}	


.m-cta__btn--ghost:hover .hoverrroff {
display: none;	
}

.m-cta__btn--ghost:hover .hoverrron {
display: block;	
  margin-left: 2px;

}


@media (max-width: 1100px){
  .m-cta{ flex-direction:column; gap:32px }
  .m-cta__media, .m-cta__content{ width:100% }
  .m-cta__media{ height:auto; aspect-ratio: 11 / 7; }
}
@media (max-width:600px){
  .m-cta{ padding:32px 0 }
  .m-cta__actions{ flex-direction:column; align-items:stretch }
}



/* === OPIEKA MEDYCZNA – SEKCJA === */
.m-services{
  width: min(1128px, 100% - 2rem);
  margin: 0 auto;
  background: #fff;
  border-radius: 36px;
  padding: 24px;
  box-shadow: 0 1px 4px rgba(12,12,13,.1), 0 1px 4px rgba(12,12,13,.05);
  display: grid;
  grid-template-columns: clamp(280px, 36vw, 414px) 1fr 1fr 1fr;
  gap: 24px;
}

/* Lewa kolumna (zajmuje wysokość dwóch rzędów kart) */
.m-services__head{
  grid-column: 1 / span 1;
  grid-row: 1 / span 2;
  display: flex;
  flex-direction: column;
  gap: 12px;
}
.m-services__title{
  margin: 0;
  font-size: 36px; line-height: 1.1; font-weight: 400; color: #283896;
}
.m-services__intro{
  margin: 0;
  font-size: 14px; line-height: 1.4; letter-spacing: .01em; color: rgba(40,56,150,.75);
}

/* === PRAWA STRONA – SIATKA KART === */
.m-services__grid{
  grid-column: 2 / span 3;
  display: grid !important;
  grid-template-columns: repeat(3, minmax(0,1fr)) !important;
  grid-auto-flow: row !important;    /* wypełnianie wierszami od lewej */
  gap: 16px !important;
  justify-items: stretch !important;
  align-items: stretch !important;
}

/* Każde dziecko to pojedyncza kolumna – bez spanów i szerokości własnych */
.m-services__grid > *{
  grid-column: auto / span 1 !important;
  width: 100% !important;
  min-width: 0 !important;
  margin: 0 !important;
  justify-self: stretch !important;
  align-self: stretch !important;
}

/* GWOŹDŹ PROGRAMU: 1., 4., 7., ... element ZAWSZE w kolumnie 1 */
.m-services__grid > *:nth-child(3n+1){
  grid-column: 1 !important;
}

/* === KARTA === */
.m-services__card{
  box-sizing: border-box !important;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  min-height: 182px;
  padding: 16px;
  background: #fff;
  border: 1.4px solid #9F68E4;
  border-radius: 24px;
  text-decoration: none;
  transition: transform .15s ease, box-shadow .15s ease;
}
.m-services__card:hover{
  transform: translateY(-2px);
  box-shadow: 0 3px 10px rgba(12,12,13,.08);
}

/* Wnętrze karty */
.m-services__item-inner{
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 24px;
  width: 100%;
  max-width: 172px;
  margin-inline: auto;
}

/* Ikona 90×90 */
.m-services__icon{
  width: 90px; height: 90px;
  display: flex; align-items: center; justify-content: center;
}
.m-services__icon img,
.m-services__icon svg{
  width: 100%; height: 100%;
  display: block;
  object-fit: contain;
}

/* Nazwa + strzałka przy dole karty */
.m-services__row{
  display: flex; align-items: center; gap: 8px;
  margin-top: auto; min-height: 36px; width: 100%;
}
.m-services__name{
  flex: 1 1 auto; font-size: 16px; line-height: 1.1; font-weight: 500; color: #283896;
}
.m-services__arrow{ width: 20px; height: 20px; flex: 0 0 auto; }

/* === RWD === */
@media (max-width: 1024px){
  .m-services{ grid-template-columns: 1fr; }
  .m-services__head{ grid-column: auto; grid-row: auto; }
  .m-services__grid{
    grid-column: auto;
    grid-template-columns: repeat(2, minmax(0,1fr)) !important;
  }
}
@media (max-width: 640px){
  .m-services__grid{ grid-template-columns: 1fr !important; }
}

/* (sprzątanie starych klas – jeśli gdzieś zostały) */
.sgrid__row, .sgrid__card, .sgrid__cardInner{ all: unset !important; }



/* === OPIEKA MEDYCZNA — FINAL === */
section.m-services{
  width: min(1128px, 100% - 2rem);
  margin: 0 auto;
  background:#fff;
  border-radius:36px;
  padding:24px;
  box-shadow:0 1px 4px rgba(12,12,13,.1), 0 1px 4px rgba(12,12,13,.05);
  display:grid !important;
  grid-template-columns: clamp(280px,36vw,414px) 1fr !important; /* lewa kolumna + prawa kolumna */
  gap:24px !important;
}

/* Lewa kolumna */
section.m-services > .m-services__head{
  display:flex !important;
  flex-direction:column !important;
  gap:12px !important;
  grid-column: 1 / 2 !important;
  grid-row: auto !important; /* NIE zajmujemy 2 rzędów */
}
.m-services__title{ margin:0; font-size:36px; line-height:1.1; font-weight:400; color:#283896; }
.m-services__intro{ margin:0; font-size:14px; line-height:1.4; letter-spacing:.01em; color:rgba(40,56,150,.75); }

/* Prawa kolumna – lista WIERSZY (bez grida) */
section.m-services > .m-services__grid{
  grid-column: 2 / -1 !important;
  grid-row: auto !important;
  display:block !important;
}

/* ► WIERSZ 3 kolumny – NOWA KLASA, unika konfliktu z „row” w karcie */
.m-services__line{
  display:flex !important;
  flex-wrap:nowrap !important;
  gap:16px !important;
  margin-bottom:16px !important;
}
.m-services__line:last-child{ margin-bottom:0 !important; }

/* Karta = dokładnie 1/3 szerokości wiersza */
.m-services__line .m-services__card{
  flex:0 0 calc((100% - 2*16px)/3) !important;
  margin:0 !important;
  width:auto !important;
  min-width:0 !important;
  box-sizing:border-box !important;
}

/* Karta – wygląd */
.m-services__card{
  display:flex !important;
  flex-direction:column !important;
  justify-content:space-between !important;
  min-height:182px !important;
  padding:16px !important;
  background:#fff !important;
  border:1.4px solid #9F68E4 !important;
  border-radius:24px !important;
  text-decoration:none !important;
  transition:transform .15s ease, box-shadow .15s ease !important;
}
.mojehoverrrr::hover{ background:#F9F6FE !important; transform:translateY(-2px); box-shadow:0 3px 10px rgba(12,12,13,.08); }

/* Wnętrze karty */
.m-services__item-inner{
  display:flex !important; flex-direction:column !important; align-items:center !important;
  gap:24px !important; width:100% !important; max-width:172px !important; margin-inline:auto !important;
}
.m-services__icon{ width:90px !important; height:90px !important; display:flex !important; align-items:center !important; justify-content:center !important; }
.m-services__icon img, .m-services__icon svg{ width:100% !important; height:100% !important; display:block !important; object-fit:contain !important; }

/* ► WEWNĘTRZNY rząd (tytuł + strzałka) – NOWA KLASA .m-services__meta */
.m-services__meta{
  display:flex !important; align-items:center !important; gap:8px !important;
  width:100% !important; min-height:36px !important; margin-top:auto !important;
}
.m-services__name{ flex:1 1 auto !important; font-size:16px !important; line-height:1.1 !important; font-weight:500 !important; color:#283896 !important; }
.m-services__arrow{ width:20px !important; height:20px !important; flex:0 0 auto !important; }

/* RWD */
@media (max-width:1024px){
  section.m-services{ grid-template-columns: 1fr !important; }
  section.m-services > .m-services__head{ grid-column: 1 / -1 !important; }
  section.m-services > .m-services__grid{ grid-column: 1 / -1 !important; }
  .m-services__line .m-services__card{ flex:0 0 calc((100% - 16px)/2) !important; }
}
@media (max-width:640px){
  .m-services__line .m-services__card{ flex:0 0 100% !important; }
}

/* Sprzątanie starych, kolizyjnych klas (jeśli gdzieś wiszą w CSS) */
.sgrid__row, .sgrid__card, .sgrid__cardInner{ all: unset !important; }


/* kontener sekcji: lewa kolumna + prawa (wiersze) */
.m-services{display:grid;grid-template-columns:clamp(280px,36vw,414px) 1fr;gap:24px;}
.m-services__grid{display:block;}

/* WIERSZ z kafelkami (3 kolumny) */
.m-services__line{display:flex;gap:16px;margin:0 0 16px 0;}
.m-services__line:last-child{margin-bottom:0;}
.m-services__line .m-services__card{
  flex:0 0 calc((100% - 32px)/3); /* 3 kolumny, 2 odstępy po 16px */
  box-sizing:border-box;
}

/* wygląd karty i wnętrza */
.m-services__card{display:flex;flex-direction:column;justify-content:space-between;min-height:182px;padding:16px;
  background:#fff;border:1.4px solid #9F68E4;border-radius:24px;text-decoration:none;}
.m-services__item-inner{display:flex;flex-direction:column;align-items:center;gap:24px;max-width:172px;margin-inline:auto;width:100%;}
.m-services__icon{width:90px;height:90px;display:flex;align-items:center;justify-content:center;}
.m-services__icon img,.m-services__icon svg{width:100%;height:100%;display:block;object-fit:contain;}
.m-services__meta{display:flex;align-items:center;gap:8px;width:100%;min-height:36px;margin-top:auto;}
.m-services__name{flex:1 1 auto;font-size:16px;line-height:1.1;font-weight:500;color:#283896;}
.m-services__arrow{width:20px;height:20px;flex:0 0 auto;}

/* RWD: 2 kolumny / 1 kolumna */
@media (max-width:1024px){ .m-services{grid-template-columns:1fr;} .m-services__line .m-services__card{flex:0 0 calc((100% - 16px)/2);} }
@media (max-width:640px){ .m-services__line .m-services__card{flex:0 0 100%;} }


/* wspólne dla wszystkich rzędów */
.m-services__line{ display:flex; gap:16px; margin:0 0 16px 0; }
.m-services__line:last-child{ margin-bottom:0; }
.m-services__line .m-services__card{
  flex:0 0 calc((100% - 32px)/3);  /* 3 kolumny */
  box-sizing:border-box;
}

/* rzÄ…d 1 */
.m-services__line1 .m-services__card{ /* np. nic lub delikatny efekt */ }

/* rzÄ…d 2 */
.m-services__line2 .m-services__card{ /* Twoje własne style dla drugiego rzędu */ }

/* rzÄ…d 3 */
.m-services__line3 .m-services__card{ /* Twoje własne style dla trzeciego rzędu */ }

/* RWD (jak wcześniej) */
@media (max-width:1024px){
  .m-services__line .m-services__card{ flex:0 0 calc((100% - 16px)/2); }
}
@media (max-width:640px){
  .m-services__line .m-services__card{ flex:0 0 100%; }
}

/* wewnÄ…trz karty */
.m-services__card{ display:flex; flex-direction:column; justify-content:space-between; min-height:182px; padding:16px;
  background:#fff; border:1.4px solid #9F68E4; border-radius:24px; text-decoration:none; }
.m-services__item-inner{ display:flex; flex-direction:column; align-items:center; gap:24px; width:100%; max-width:172px; margin-inline:auto; }
.m-services__icon{ width:90px; height:90px; display:flex; align-items:center; justify-content:center; }
.m-services__icon img, .m-services__icon svg{ width:100%; height:100%; display:block; object-fit:contain; }
.m-services__meta{ display:flex; align-items:center; gap:8px; width:100%; min-height:36px; margin-top:auto; }
.m-services__name{ flex:1 1 auto; font-size:16px; line-height:1.1; font-weight:500; color:#283896; }
.m-services__arrow{ width:20px; height:20px; flex:0 0 auto; }


/* kontener listy wierszy */
.m-services__grid { display:block; }

/* wspólne dla wszystkich wierszy */
.m-services__line { display:flex; gap:16px; margin:0 0 16px 0; }
.m-services__line:last-child { margin-bottom:0; }

/* rzÄ…d 1: 3 kolumny */
.m-services__line1 .m-services__card {         
  flex: 0 0 calc((100% - 2*16px)/3);
  box-sizing: border-box;
}

/* rzÄ…d 2: 5 kolumn */
.m-services__line2 .m-services__card {
  flex: 0 0 calc((100% - 4*16px)/5);
  box-sizing: border-box;
}

/* rzędy 3+: po 3 kolumny (opcjonalnie) */
.m-services__line3 .m-services__card,
.m-services__line4 .m-services__card,
.m-services__line5 .m-services__card {
  flex: 0 0 calc((100% - 2*16px)/3);
  box-sizing: border-box;
}

/* RWD: 2 kolumny, potem 1 kolumna */
@media (max-width:1024px){
  .m-services__line .m-services__card { flex: 0 0 calc((100% - 16px)/2); }
}
@media (max-width:640px){
  .m-services__line .m-services__card { flex: 0 0 100%; }
}

/* (reszta wyglądu kart może zostać jak masz) */


.m-services__line2 {
  margin-left: -438px !important;; /* dopasuj wartość do szerokości lewej kolumny */
  width: calc(100% + 136px);
}


/* ===== Moduł: Nasza przychodnia w liczbach ===== */
.mod-stats {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  padding: 64px 0;
  max-width: 1128px;
  margin: 0 auto;
}

.mod-stats__heading {
  width: 100%;
  margin: 0 0 24px 0;
  font-family: 'Satoshi', system-ui, -apple-system, Segoe UI, Roboto, 'Helvetica Neue', Arial, 'Noto Sans', 'Liberation Sans', sans-serif;
  font-weight: 400;
  font-size: 36px;
  line-height: 110%;
  color: #283896;
}

.mod-stats__row {
  display: flex;
  flex-direction: row;
  align-items: center;
  gap: 36px;
  width: 100%;
}

.mod-stats__col {
  display: flex;
  flex-direction: column;
  gap: 12px;
  flex: 1 1 0;
  min-width: 0;
}

/* Karty */
.mod-stats__card {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  padding: 16px;
  border-radius: 24px;
  box-shadow: 0px 1px 4px rgba(12,12,13,.1), 0px 1px 4px rgba(12,12,13,.05);
}

/* Górne – warianty kolorystyczne */
.mod-stats__card--top { height: 187px; }
.mod-stats__card--blue    { background: #283896; color: #fff; }
.mod-stats__card--lavender{ background: #E7DAFA; color: #283896; }
.mod-stats__card--magenta { background: #B34694; color: #fff; }

/* Dolne */
.mod-stats__card--bottom {
  background: #fff;
  height: 120px;
  min-height: 120px;
  max-height: 120px;
}

/* Treści */
.mod-stats__value {
  width: 100%;
  text-align: left;
  font-family: 'Satoshi', system-ui, -apple-system, Segoe UI, Roboto, 'Helvetica Neue', Arial, 'Noto Sans', 'Liberation Sans', sans-serif;
  font-weight: 500;
  font-size: 72px;
  line-height: 110%;
  margin-bottom: 24px;
  word-break: break-word;
}

.mod-stats__subtitle {
  width: 100%;
  text-align: left;
  font-weight: 500;
  font-size: 16px;
  line-height: 110%;
}

.mod-stats__desc {
  width: 100%;
  font-weight: 400;
  font-size: 14px;
  line-height: 160%;
  color: #283896;
  text-align: left;
}

/* Responsywność */
@media (max-width: 1024px) {
  .mod-stats { padding: 48px 16px; }
  .mod-stats__row { gap: 24px; }
}
@media (max-width: 860px) {
  .mod-stats__row {
    flex-direction: column;
    align-items: stretch;
  }
  .mod-stats__card--top { height: 168px; }
  .mod-stats__card--bottom { height: auto; min-height: 120px; }
  .mod-stats__value { font-size: 60px; }
}
@media (max-width: 480px) {
  .mod-stats__value { font-size: 48px; }
  .mod-stats__heading { font-size: 28px; }
}


/* ===== Moduł SC (obraz + tekst + przycisk) ===== */
.mod-sc {
  display: flex;
  flex-direction: row;
  align-items: center;
  gap: 72px;
  padding: 32px 0 64px;
  max-width: 1128px;
  margin: 0 auto;
}

.mod-sc__img {
  width: 550px;
  height: 350px;
  border-radius: 24px;
  background-position: center;
  background-size: cover;
  flex: 0 0 auto;
}

.mod-sc__content {
  display: flex;
  flex-direction: column;
  gap: 24px;
  width: 506px;
  max-width: 100%;
  flex: 1 1 0;
}

.mod-sc__top {
  display: flex;
  flex-direction: column;
  gap: 12px;
}

.mod-sc__title {
  margin: 0;
  font-family: 'Satoshi', system-ui, -apple-system, Segoe UI, Roboto, 'Helvetica Neue', Arial, 'Noto Sans', sans-serif;
  font-weight: 400;
  font-size: 36px;
  line-height: 110%;
  color: #283896;
}

.mod-sc__text {
  font-family: 'Satoshi', system-ui, -apple-system, Segoe UI, Roboto, 'Helvetica Neue', Arial, 'Noto Sans', sans-serif;
  font-weight: 400;
  font-size: 14px;
  line-height: 140%;
  color: #3D3D3D;
}

.mod-sc__btn {
  box-sizing: border-box;
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 12px 24px;
  height: 40px;
  background: #E7DAFA;
  border: 1.4px solid #8849D4;
  border-radius: 24px;
  text-decoration: none;
  width: 199px;
}

.hoverrrefekt .hoverrron {
	display: none;	
	
}

.hoverrrefekt:hover {
background:#DCDCDC;  border:1.4px solid #DCDCDC;  
}	

.hoverrrefekt:hover .hoverrroff {
display: none;	
}

.hoverrrefekt:hover .hoverrron {
display: block;	
  margin-left: 2px;
width: 11px !important;
height: 11px !important;
}

.hoverrrefekt:hover .hoverrroff {
display: none;	
}

.hoverrrefekt:hover .hoverrron {
display: block;	
  margin-left: 2px;

}

.mod-sc__btn-label {
  font-family: 'Satoshi', system-ui, -apple-system, Segoe UI, Roboto, 'Helvetica Neue', Arial, 'Noto Sans', sans-serif;
  font-weight: 500;
  font-size: 14px;
  line-height: 110%;
  color: #283896;
}

.hoverrrefekt:hover .mod-sc__btn-label{
color:#989898 !important;
	
}

.mod-sc__btn-ico { width:16px; height:16px; display:inline-block; }

/* Responsywność */
@media (max-width: 1024px) {
  .mod-sc { gap: 32px; padding: 24px 16px 48px; }
  .mod-sc__img { width: 480px; height: 320px; }
  .mod-sc__title { font-size: 32px; }
}
@media (max-width: 860px) {
  .mod-sc { flex-direction: column; align-items: stretch; }
  .mod-sc__img { width: 100%; height: 300px; }
  .mod-sc__content { width: 100%; }
}
@media (max-width: 480px) {
  .mod-sc__img { height: 220px; }
  .mod-sc__title { font-size: 28px; }
}


/* ===== Moduł: Aktualne cenniki ===== */
.mod-prices {
  max-width: 1128px;
  margin: 0 auto;
  background: #FFFFFF;
  border-radius: 36px;
  box-shadow: 0px 1px 4px rgba(12,12,13,.1), 0px 1px 4px rgba(12,12,13,.05);
}

.mod-prices__inner {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: flex-start;
  padding: 32px;
  gap: 24px;
}

.mod-prices__title {
  margin: 0;
  font-family: 'Satoshi', system-ui, -apple-system, Segoe UI, Roboto, 'Helvetica Neue', Arial, 'Noto Sans', sans-serif;
  font-weight: 400;
  font-size: 36px;
  line-height: 110%;
  color: #283896;
}

.mod-prices__row {
  display: flex;
  flex-direction: row;
  align-items: center;
  gap: 24px;
  width: 100%;
}

.mod-prices__link {
  box-sizing: border-box;
  display: inline-flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  padding: 16px 16px;
  height: 57px;
  background: #FFFFFF;
  border: 1.4px solid #9F68E4;
  border-radius: 24px;
  text-decoration: none;
  width: 100%;
  max-width: 520px;         /* jak w figmie */
  flex: 1 1 0;              /* pozwala rosnąć / zwijać */
}

.mod-prices__link:hover  {
 background: #F9F6FE;

}

.mod-prices__link-label {
  display: inline-block;
  font-family: 'Satoshi', system-ui, -apple-system, Segoe UI, Roboto, 'Helvetica Neue', Arial, 'Noto Sans', sans-serif;
  font-weight: 500;
  font-size: 21px;
  line-height: 120%;
  color: #283896;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.mod-prices__link-ico {
  width: 20px;
  height: 20px;
  flex: 0 0 auto;
}

/* Responsywność */
@media (max-width: 1024px) {
  .mod-prices__title { font-size: 32px; }
}
@media (max-width: 860px) {
  .mod-prices__row { flex-direction: column; align-items: stretch; }
  .mod-prices__link { max-width: 100%; }
}
@media (max-width: 480px) {
  .mod-prices__title { font-size: 28px; }
}


/* ===== Modul: Poznaj nasze Projekty ===== */

.mod-projects {
  max-width: 1128px;
  margin: 0 auto;
  padding: 80px 0 32px;
}

.mod-projects__title {
  font-family: 'Satoshi', system-ui, -apple-system, Segoe UI, Roboto, 'Helvetica Neue', Arial, 'Noto Sans', sans-serif;
  font-weight: 400;
  font-size: 36px;
  line-height: 110%;
  color: #283896;
  margin-bottom: 24px;
}

.mod-projects__grid {
  display: flex;
  flex-direction: row;
  gap: 36px;
  flex-wrap: wrap;
}

/* Kafelek jako link */
.mod-projects__item {
  position: relative;
  width: 352px;
  height: 352px;
  border-radius: 24px;
  overflow: hidden;
  box-shadow: 0px 1px 4px rgba(12, 12, 13, 0.1), 0px 1px 4px rgba(12, 12, 13, 0.05);
  display: block;
  text-decoration: none;
  color: inherit;
  transition: transform .2s ease, box-shadow .2s ease;
}

.mod-projects__item:hover {
  transform: translateY(-2px);
  box-shadow: 0 6px 18px rgba(12,12,13,.16);
}

/* Tło (obraz) */
.mod-projects__img {
  position: absolute;
  inset: 0;
  background-size: cover;
  background-position: center;
}

/* === Panel (Frame 61) – przyklejony do dołu === */

.mod-projects__caption {
  position: absolute;
  left: 0;
  bottom: 0;                  /* trzyma się dolnej krawędzi */
  width: 100%;
  padding: 16px;
  border-radius: 24px;
  box-shadow: 0px 1px 4px rgba(12, 12, 13, 0.1), 0px 1px 4px rgba(12, 12, 13, 0.05);

  display: flex;
  flex-direction: column;
  justify-content: center;    /* jak w Figmie */
  align-items: center;
}

/* Frame 60/38 – zawartość w środku panelu */
.mod-projects__caption-inner {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 12px;                  /* odstęp tytuł <-> reszta */
  width: 320px;
}

/* Tytuł */
.mod-projects__caption-text {
  width: 320px;
  margin: 0;
  font-family: 'Satoshi', system-ui, -apple-system, Segoe UI, Roboto, 'Helvetica Neue', Arial, 'Noto Sans', sans-serif;
  font-weight: 500;
  font-size: 21px;
  line-height: 140%;          /* jak H3 140% */
}

/* === Część hover (opis + button) – siedzi pod tytułem === */

.mod-projects__hover {
  width: 100%;
  display: flex;
  flex-direction: column;
  gap: 24px;                  /* odstęp opis <-> button (Frame 60) */

  max-height: 0;              /* zwinięte w stanie normalnym */
  opacity: 0;
  overflow: hidden;
  transition: max-height .25s ease, opacity .25s ease;
}

/* Po najechaniu kafelka panel się "rozszerza" do góry,
   bo dokładamy zawartość wewnątrz */
.mod-projects__item:hover .mod-projects__hover {
  max-height: 120px;          /* wystarczy na tekst + przycisk */
  opacity: 1;
}

/* Krótki opis */
.mod-projects__hover-desc {
  width: 320px;
  max-height: 44px;
  font-family: 'Satoshi', system-ui, -apple-system, Segoe UI, Roboto, 'Helvetica Neue', Arial, 'Noto Sans', sans-serif;
  font-weight: 400;
  font-size: 14px;
  line-height: 140%;
  letter-spacing: 0.01em;
}

/* Button "Czytaj więcej" – stan normalny */
.mod-projects__hover-button {
  box-sizing: border-box;

  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
  padding: 12px 24px;
  gap: 10px;

  width: 320px;
  height: 39px;
  border-radius: 24px;

  font-family: 'Satoshi', system-ui, -apple-system, Segoe UI, Roboto, 'Helvetica Neue', Arial, 'Noto Sans', sans-serif;
  font-weight: 400;
  font-size: 14px;
  line-height: 1;
  letter-spacing: 0.01em;
  text-decoration: none;

  cursor: pointer;
  transition: background-color .2s ease, color .2s ease, border-color .2s ease;
}

/* === Warianty kolorystyczne – stan normalny === */

/* Jasny fiolet (#E7DAFA) – granatowy tekst i ramka */
.mod-projects__hover[data-bg="#E7DAFA"] .mod-projects__hover-desc,
.mod-projects__hover[data-bg="#E7DAFA"] .mod-projects__hover-button {
  color: #283896;
}

.mod-projects__hover[data-bg="#E7DAFA"] .mod-projects__hover-button {
  border: 1px solid #283896;
}

/* Pozostałe kolory – biały tekst i ramka */
.mod-projects__hover:not([data-bg="#E7DAFA"]) .mod-projects__hover-desc,
.mod-projects__hover:not([data-bg="#E7DAFA"]) .mod-projects__hover-button {
  color: #FFFFFF;
}

.mod-projects__hover:not([data-bg="#E7DAFA"]) .mod-projects__hover-button {
  border: 1px solid #FFFFFF;
}

/* === HOVER na przycisku "Czytaj więcej" – dla obu wariantów === */

/* Na jasnym fiolecie – wypełniony granatowy przycisk */
.mod-projects__hover[data-bg="#E7DAFA"] .mod-projects__hover-button:hover {
  
  color: #989898;
  border-color: #fff;
}

/* Na ciemniejszych tłach – biały przycisk z granatowym tekstem */
.mod-projects__hover:not([data-bg="#E7DAFA"]) .mod-projects__hover-button:hover {
  color: #989898;
  border-color: #fff;
}

/* Responsywność */
@media (max-width: 1100px) {
  .mod-projects__grid { justify-content: center; }
}

@media (max-width: 768px) {
  .mod-projects__title { font-size: 30px; }
  .mod-projects__item { width: 100%; max-width: 400px; }
}




/* ===== Top Navigation (global) ===== */
.topnav-wrap {
  width: 100%;
  padding:24px 16px; /* responsywny odpowiednik figmowego 24 / 396 */
  box-sizing: border-box;
}
.topnav {
  max-width: 1280px;
  height: 53px;
  margin: 0 auto;
  background: #FFFFFF;
  border-radius: 24px;
  padding: 8px 24px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 24px;
  box-sizing: border-box;
}








/* Right side (badge) */
.topnav__right { display:flex; align-items:center; gap:12px; }
.topnav__badge img { height:37px; width:auto; display:block; }

/* Brand */
.topnav__left { display:flex; align-items:center; }
.topnav__brand { display:inline-flex; align-items:center; text-decoration:none; }
.topnav__logo { height: 28px; width:auto; display:block; }
.topnav__fallback { color:#283896; font-weight:700; }



/* ===== Footer (wg figmy, zgrubnie) ===== */
.footer-wrap {
  background: #E7DAFA;
  padding: 64px 16px; /* zamiast 310px – responsywnie */
}
.footer { max-width: 1128px; margin: 0 auto; display: flex; flex-direction: column; gap: 36px; }

.footer__top {
  display: grid;
  grid-template-columns: 1fr 1fr 1fr 1fr; /* 3 kolumny menu + CTA */
  gap: 36px 112px;
  align-items: start;
}

.footer__col { display:flex; flex-direction:column; gap:24px; }
.footer__title {
  margin:0; color:#283896; font-family:'Satoshi',system-ui,-apple-system,Segoe UI,Roboto,'Helvetica Neue',Arial,'Noto Sans',sans-serif;
  font-weight:500; font-size:21px; line-height:120%;
}

.footer__social-title {
  margin:0; color:#283896; font-family:'Satoshi',system-ui,-apple-system,Segoe UI,Roboto,'Helvetica Neue',Arial,'Noto Sans',sans-serif;
  font-weight:500; font-size:21px; line-height:120%;
margin-top: 30px
  
}


.footer__list, .footer__list ul { list-style:none; margin:0; padding:0; }
.footer__list li { margin:0 0 5px 0; }
.footer__list a {
  text-decoration:none; color:#283896; font-weight:400; font-size:16px; line-height:110%;
}
.footer__list a:hover { text-decoration:underline; }

/* CTA + Social */
.footer__cta { display:flex; flex-direction:column; gap:24px; }
.footer__cta-title {
  color:#283896; font-weight:500; font-size:21px; line-height:120%;
}
.footer__cta-btn {
  display:inline-flex; align-items:center; justify-content:center;
  padding:12px 24px; border-radius:24px; background:#283896; color:#fff; text-decoration:none;
  font-weight:500; font-size:14px; line-height:110%; width: 270px
}
.footer__cta-btn:hover { opacity:.9; }
.footer__social { display:flex; flex-direction:column; gap:12px; }
.footer__social-link { color:#283896; text-decoration:none; font-weight:500; font-size:16px; }
.footer__social-link:hover { text-decoration:underline; }

/* Divider */
.footer__divider { width:100%; height:0; border-top:2px solid #283896; }

/* Bottom */
.footer__bottom { display:flex; align-items:center; justify-content:space-between; gap:24px; }
.footer__brand img { height:40px; width:auto; display:block; }
.footer__copy { color:#283896; font-size:16px; line-height:140%; }

/* Responsive */
@media (max-width: 1100px) {
  .footer__top { grid-template-columns: 1fr 1fr; }
}
@media (max-width: 720px) {
  .footer__top { grid-template-columns: 1fr; }
  .footer__bottom { flex-direction:column; align-items:flex-start; }
}


/* Social rows with icons (figma style) */
.footer__social { display:flex; flex-direction:column; gap:12px; }

.footer__social-row {
  display:flex; align-items:center; gap:10px;
  text-decoration:none;
}

.footer__social-ico {
  width:30px; height:30px; border-radius:6px;
  background:#283896; display:inline-flex; align-items:center; justify-content:center;
  flex:0 0 30px;
}

.footer__social-text {
  color:#283896; font-weight:500; font-size:16px; line-height:110%;
}

.footer__social-row:hover .footer__social-text { text-decoration:underline; }


.site-footer {
margin-bottom: 0px !important ;
padding-bottom: 0px !important ;  
}

.footer__top{
  display:grid;
  grid-template-columns: 1fr 1fr 1fr; /* było 4 */
  gap:112px; /* jak w figmie */
}
.footer__col--stack .footer__subcol{ margin-top:64px; } /* odstęp między "Pacjent" i "O Nas" */



/*  Minimal CSS zgodny z Twoim designem (nazwy klas ~ figma)  */
.locmod-wrap{padding:0 0 24px;
            margin-top: 64px;
            margin-bottom: 64px}
.locmod{background:#fff;box-shadow:0 1px 4px rgba(12,12,13,.1),0 1px 4px rgba(12,12,13,.05);border-radius:36px;padding:24px;max-width:1128px;margin:0 auto}
.locmod__head{display:flex;gap:24px;align-items:center}
.locmod__intro{flex:1;color:#283896;font-size:21px;line-height:1.4}
.locmod__cta{display:flex;gap:6px;align-items:center;justify-content:center;background:#283896;color:#fff;border-radius:24px;height:40px;padding:0 24px;text-decoration:none}

.locmod__cta:hover {
background:#DCDCDC; color:#989898 
}	


.locmod__cta:hover .hoverrroff {
display: none;	
}

.locmod__cta .hoverrron {
display: none;

}

.locmod__cta:hover .hoverrron {
display: block;	
  margin-left: 0px;
width: 11px !important;
height: 11px !important;
}


.locmod__seg{margin-top:12px}
.locmod__seg-inner{display:flex;gap:16px;align-items:center;border:1px solid #E7DAFA;border-radius:40px;padding:8px}
.locmod__tab{
  display:flex;gap:12px;align-items:center;justify-content:center;padding:12px 24px;border-radius:24px;border:1.4px solid transparent;background:transparent;color:#283896;
  font-weight:500;
font-size: 14px;


}
.locmod__tab.is-active{background:#E7DAFA;border-color:#9F68E4}


.locmod__tab:hover {
 cursor: pointer;
background:#F9F6FE;
	border-color:#9F68E4	
}



.locmod__panels{margin-top:12px}
.locmod__panel{border-radius:24px;background:#fff}
.locmod__panel-inner{display:flex;gap:72px;align-items:center;padding:8px}
.locmod__map{width:638px;max-width:100%}
.locmod__map-embed iframe{width:100%;height:407px;border:0;border-radius:24px}
.locmod__map-img{width:100%;height:407px;object-fit:cover;border-radius:24px}
.locmod__details{width:354px;max-width:100%}
.locmod__title{color:#283896;font-size:16px;line-height:1.2;margin:0 0 12px}
.locmod__block{margin-bottom:24px}
.locmod__block-title{color:#283896;font-weight:500;margin-bottom:12px}
.locmod__row{display:flex;align-items:center;gap:6px;height:20px}
.locmod__ico{display:inline-flex}
.locmod__link{color:#283896;text-decoration:none}
.locmod__text{color:#283896;line-height:1.4}
.locmod__cols{
  display:flex;
  flex-direction: column;
  gap: 12px;        /* odstęp między blokami */
}
@media (min-width: 981px){
  .locmod__block{ margin-bottom: 16px; }
}
@media (max-width:980px){
  .locmod__panel-inner{flex-direction:column;gap:24px}
  .locmod__map,.locmod__details{width:100%}
  .locmod__cols{flex-direction:column;gap:16px}
  .locmod__head{flex-direction:column;align-items:flex-start}
}

.locmod__note {
  width: 354px;
  max-width: 100%;
  color: #8849D4;
  font-family: 'Satoshi';
  font-style: normal;
  font-weight: 400;
  font-size: 14px;
  line-height: 140%;
  letter-spacing: 0.01em;
  margin-top: 12px;
}

.locmod__note{
  color:#8849D4;
  font-size:14px;
  line-height:140%;
  letter-spacing:.01em;
  margin-top:12px;
}



.strza1 img {
width: 11px !important;
height: 14px !important;	
}

.strza2 img {
width: 15px !important;
height: 15px !important;	
}


.strza3 img {
width: 16px !important;
height: 16px !important;	
}

.strza4 img {
width: 20px !important;
height: 20px !important;	
}

.strza5 img {
width: 15px !important;
height: 15px !important;	
}

.strza6 img {
width: 16px !important;
height: 16px !important;	
}

.strza7 img {
width: 20px !important;
height: 20px !important;	
}

/* ===============================
   Kontakt – moduł (clean version)
   =============================== */

/* Kontener */
.cform{
  max-width:1128px;
  margin:32px auto;
  padding:24px;
  border-radius:36px;
  box-shadow:0 1px 4px rgba(12,12,13,.1), 0 1px 4px rgba(12,12,13,.05);
  background:#fff;
  position:relative;
}

/* Honeypot */
.cform [name="website"]{
  position:absolute!important;
  left:-5000px!important;
  opacity:0!important;
  height:0!important;
  width:0!important;
  pointer-events:none!important;
}

/* Layout wnętrza */
.cform__inner{
  width:1080px;
  margin:0 auto;
  display:flex;
  align-items:flex-start;
  gap:36px;
}

/* Lewa kolumna */
.cform__col--left{
  width:373px; flex:0 0 373px;
  display:flex; flex-direction:column; gap:36px;
}
.cform__intro{
  font-family:'Satoshi',system-ui,-apple-system,Segoe UI,Roboto,Arial,sans-serif;
  font-weight:400; font-size:21px; line-height:140%; color:#283896;
}
.cform__media{width:373px; border-radius:24px; overflow:hidden;
  box-shadow:0 1px 4px rgba(223,219,214,.5), 0 1px 4px rgba(223,219,214,.05)}
.cform__image{display:block; width:100%; height:auto; border-radius:24px}

/* Prawa kolumna – karta */
.cform__col--right{
  width:671px; flex:0 0 671px;
  border:1px solid #E7DAFA; border-radius:24px; padding:36px; background:#fff;
  display:flex; align-items:center;
}

/* Formularz */
.cform__form{width:599px; display:flex; flex-direction:column; gap:24px}
.cform__row{width:599px; display:flex; gap:24px; align-items:flex-end}
.cform__field{flex:1 1 0; display:flex; flex-direction:column; gap:6px}

/* Etykiety */
.cform__label{
  font-family:'Satoshi',system-ui,-apple-system,Segoe UI,Roboto,Arial,sans-serif;
  font-weight:500; font-size:14px; line-height:120%; color:#283896; margin-bottom:0;
}

/* ===== Pola (bazowe) ===== */
.cform__input,
.cform__select{
  display:block; width:100%; height:42px;
  padding:10px 12px;
  border:1px solid #9F68E4; background:#fff; color:#283896;
  border-radius:24px; font-size:14px; line-height:160%; outline:0;
}
.cform__input::placeholder,
.cform__textarea::placeholder{ color:rgba(40,56,150,.75) }

/* Select z własną strzałką */
.cform__select-wrap{ position:relative; width:100% }
.cform__select{
  padding-right:36px;
  -webkit-appearance:none; -moz-appearance:none; appearance:none;
}
.cform__select::-ms-expand{ display:none }         /* IE/Edge legacy */
.cform__select:focus{ box-shadow:0 0 0 2px rgba(159,104,228,.15) }
.cform__select option{ color:#283896; background:#fff }
.cform__chev{
  position:absolute; right:12px; top:50%; width:16px; height:16px;
  transform:translateY(-50%); pointer-events:none;
}
.cform__chev:before{
  content:""; display:block; width:10px; height:10px;
  border-right:1.33333px solid #9F68E4; border-bottom:1.33333px solid #9F68E4;
  transform:rotate(45deg); margin:auto;
}

/* ===== Telefon (kapsuła) ===== */
.cform__phone{ display:flex; gap:8px; align-items:center }

/* select z kierunkowym */
.cform__dial-select{ position:relative; width:77px; flex:0 0 77px }
.cform__select--dial{
  padding:10px 28px 10px 12px;            /* trochę węższy padding */
  border-radius:36px;                      /* zgodnie z makietÄ… */
  text-align:center;
}

/* pole numeru */
.cform__input--phone{ border-radius:36px }

/* ===== Textarea ===== */
.cform__field--textarea{ width:599px }
.cform__textarea{
  width:100%; min-height:80px; padding:10px 12px;
  border:1px solid #9F68E4; border-radius:16px; resize:vertical;
  font-size:14px; line-height:160%; color:#283896; background:#fff; outline:0;
}

/* ===== Zgoda ===== */
.cform__consent{ display:flex; gap:16px; align-items:center; width:599px }
.cform__checkbox{
  width:24px; height:24px; border:1px solid #9F68E4; border-radius:40px;
  display:inline-flex; align-items:center; justify-content:center; position:relative;
}
.cform__checkbox input{ position:absolute; inset:0; opacity:0 }
.cform__check{ width:12px; height:12px; border-radius:50%; background:transparent; transition:background .2s }
.cform__checkbox input:checked + .cform__check{ background:#9F68E4 }
.cform__consent-text{ width:559px; display:flex; align-items:center;
  font-size:12px; line-height:140%; color:rgba(40,56,150,.75) }

/* ===== Przycisk ===== */
.cform__submit{
  width:599px; height:40px; padding:12px 24px;
  border:0; border-radius:24px; background:#283896; color:#fff;
  font-weight:500; font-size:14px; line-height:110%;
  display:flex; justify-content:center; align-items:center; gap:6px;
  cursor:pointer; transition:background .2s;
}
.cform__submit:hover{ background:#1e2b7a }
.cform__submit svg{ width:16px; height:16px }
.cform__submit svg *{ stroke:#fff }

/* Focus spójny dla wszystkich kontrolek */
.cform__input:focus,
.cform__textarea:focus{ box-shadow:0 0 0 2px rgba(159,104,228,.15) }

/* ===== RWD ===== */
@media (max-width:1100px){
  .cform__inner{ flex-direction:column; width:100% }
  .cform__col--left,
  .cform__col--right{ width:100%; flex:unset }
  .cform__media{ width:100% }
  .cform__form,.cform__row,.cform__field--textarea,.cform__consent,.cform__submit{ width:100% }
}
@media (max-width:640px){
  .cform__row{ flex-direction:column }
  .cform__dial-select{ width:68px; flex-basis:68px }
}



/* ===== Breadcrumbs (Frame 1103) ===== */
.crumbs{
  display:flex;
  justify-content:center;
  align-items:flex-start;
  padding:12px 0;
}
.crumbs__wrap{
  width:1128px;
  max-width:calc(100% - 32px);
  margin:0 auto;
}

/* Pigułka */
.crumbs__pill{
  display:flex;
  align-items:center;
  gap:8px;
  padding:8px 16px;
  background:#FFFFFF;
  border-radius:24px;
  list-style:none;
  margin:0;
}

/* Elementy */
.crumbs__item{
  display:flex;
  align-items:center;
  gap:8px;
}

/* Link „Strona główna” i rodzice */
.crumbs__link{
  font-family:'Satoshi',system-ui,-apple-system,Segoe UI,Roboto,Arial,sans-serif;
  font-weight:500;
  font-size:12px;
  line-height:16px;
  color:#283896;
  text-decoration:none;
}
.crumbs__link:hover{ text-decoration:underline; }

/* Bieżąca strona (fiolet) */
.crumbs__current{
  font-family:'Satoshi',system-ui,-apple-system,Segoe UI,Roboto,Arial,sans-serif;
  font-weight:500;
  font-size:12px;
  line-height:16px;
  color:#8849D4;
}

/* Separator – pionowa kreska 16px */
.crumbs__sep{
  width:0;
  height:16px;
  border-left:1.4px solid #E7DAFA;
  display:inline-block;
}

/* RWD – gdy mniej miejsca, pigułka przewijalna horyzontalnie */
@media (max-width:640px){
  .crumbs__pill{
    overflow:auto hidden;
    -webkit-overflow-scrolling:touch;
  }
}


/* === MOD: Projekty (Figma: Frame 45 / 1104) === */

.mod-projekty{
  display:flex;
  flex-direction:row;
  justify-content:center;
  align-items:center;
  padding:0;
  gap:72px; /* zgodnie z Figma */
}

.mod-projekty__inner{
  display:flex;
  flex-direction:column;
  align-items:flex-start;
  padding:0;
  gap:12px;
  width:700px;
  max-width:100%;
  /* wysokość w Figmie 118px wynika z treści; nie blokujemy na sztywno */
}

.mod-projekty__title{
  margin:0;
  width:100%;
  font-family:'Satoshi', system-ui, -apple-system, "Segoe UI", Roboto, Arial, sans-serif;
  font-style:normal;
  font-weight:500;
  font-size:36px;
  line-height:110%; /* ~40px */
  color:#283896; /* kolor z Figmy */
}

.mod-projekty__desc{
  width:100%;
  font-family:'Satoshi', system-ui, -apple-system, "Segoe UI", Roboto, Arial, sans-serif;
  font-style:normal;
  font-weight:400;
  font-size:16px;
  line-height:140%; /* ~22px */
  color:rgba(40,56,150,0.75);
}

.mod-projekty__desc p{
  margin:0; /* opis w jednej „belce” jak w projekcie */
}

/* Responsywność (miękka redukcja nagłówka na mniejszych ekranach) */
@media (max-width: 768px){
  .mod-projekty{ gap:32px; }
  .mod-projekty__title{ font-size:28px; }
}


/* ===== Projects Hero (m-projects-hero) ===== */
.m-projects-hero { padding: 24px 0; } /* opcjonalnie, miękki oddech sekcji */

.m-projects-hero__wrap{
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 12px;
  max-width: 700px;
  width: 100%;
  margin-left: auto;
  margin-right: auto;
}

.m-projects-hero__title{
  font-family: 'Satoshi', system-ui, -apple-system, Segoe UI, Roboto, Arial, sans-serif;
  font-weight: 500;
  font-size: 36px;
  line-height: 110%;
  color: #283896;
  margin: 0;
}

.m-projects-hero__desc{
  font-family: 'Satoshi', system-ui, -apple-system, Segoe UI, Roboto, Arial, sans-serif;
  font-weight: 400;
  font-size: 16px;
  line-height: 140%;
  color: rgba(40, 56, 150, 0.75);
  margin: 0;
}

/* reset marginesów elementów z WYSIWYG, żeby gap=12px trzymał pion */
.m-projects-hero__desc p,
.m-projects-hero__desc ul,
.m-projects-hero__desc ol { margin: 0; }

@media (max-width: 480px){
  .m-projects-hero__title{ font-size: 28px; }
}



/* ==== MOD: Projects – przegląd ==== */

.mod-projects-przeglad{
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  gap:24px;
  padding:24px 0;
  width:100%;
  max-width:1128px;
  margin:0 auto;
}

/* Segmented control */
.mod-prj__segmented{
  position:relative;
  display:flex;
  gap:16px;
  align-items:center;
  padding:8px;
  width:700px;
  height:55px;
  border:1px solid #E7DAFA;
  border-radius:40px;
  box-sizing:border-box;
}

.mod-prj__seg-btn{
  position:relative;
  z-index:2;
  flex:1 1 0;
  height:39px;
  padding:12px 24px;
  border-radius:24px;
  border:1.4px solid transparent;
  background:transparent;
  cursor:pointer;
  font-family:'Satoshi', system-ui, sans-serif;
  font-weight:500;
  font-size:14px;
  line-height:1.1;
  color:#283896;
}




.mod-prj__seg-btn.is-active{
  color:#283896;
}

.mod-prj__seg-slider{
  position:absolute;
  left:8px;
  top:8px;
  width:calc(50% - 8px);
  height:39px;
  background:#E7DAFA;
  border:1.4px solid #9F68E4;
  border-radius:24px;
  box-shadow:0 1px 4px rgba(12,12,13,.1), 0 1px 4px rgba(12,12,13,.05);
  transition:transform .25s ease;
}

/* Panels */
.mod-prj__panels{
  width:100%;
  margin-bottom:40px;
}
.mod-prj__panel{
  width:100%;
}
.mod-prj__panel.is-visible{ display:block; }
.mod-prj__panel:not(.is-visible){ display:none; }

/* Grid 3 kolumny (desktop) -> 1/2 na mniejszych */
.mod-prj__grid{
  display:grid;
  grid-template-columns:repeat(3, 1fr);
  gap:36px;
  width:100%;
}
@media (max-width: 992px){
  .mod-prj__grid{
    grid-template-columns:repeat(2, 1fr);
    gap:24px;
  }
}
@media (max-width: 640px){
  .mod-prj__grid{
    grid-template-columns:1fr;
    gap:20px;
  }
}

/* === KAFELKI === */

.mod-prj-card{
  position:relative;
  display:block;
  width:352px;
  max-width:100%;
  height:352px;
  border-radius:24px;
  box-shadow:0 1px 4px rgba(12,12,13,.1), 0 1px 4px rgba(12,12,13,.05);
  overflow:hidden;
  text-decoration:none;
  color:inherit;
  transition:transform .2s ease, box-shadow .2s ease;
}
.mod-prj-card:hover{
  transform:translateY(-2px);
  box-shadow:0 6px 18px rgba(12,12,13,.16);
}

.mod-prj-card__bg{
  position:absolute;
  inset:0;
  background-size:cover;
  background-position:center;
  border-radius:24px;
}

/* Panel z tłem przy dole (overlay) */
.mod-prj-card__overlay{
  position:absolute;
  left:0;
  right:0;
  bottom:0;
  padding:16px;
  border-radius:24px;
  margin:0;
  box-shadow:0 1px 4px rgba(12,12,13,.1), 0 1px 4px rgba(12,12,13,.05);

  display:flex;
  justify-content:center;
  align-items:center;
}

/* Wnętrze overlay (tytuł + część hover) */
.mod-prj-card__overlay-inner{
  display:flex;
  flex-direction:column;
  align-items:flex-start;
  gap:12px;           /* odstęp tytuł <-> reszta */
  width:320px;
}

/* Tytuł */
.mod-prj-card__title{
  display:block;
  width:320px;
  font-family:'Satoshi', system-ui, sans-serif;
  font-weight:500;
  font-size:21px;
  line-height:140%;
}

/* === Część hover: opis + przycisk (wewnątrz panelu) === */

.mod-prj-card__hover{
  width:100%;
  display:flex;
  flex-direction:column;
  gap:24px;           /* odstęp opis <-> przycisk */
  max-height:0;
  opacity:0;
  overflow:hidden;
  transition:max-height .25s ease, opacity .25s ease;
}

/* Po najechaniu kafelka panel zwiększa wysokość do góry */
.mod-prj-card:hover .mod-prj-card__hover{
  max-height:120px;  /* wystarczająco na krótki opis + button */
  opacity:1;
}

/* Opis w hoverze */
.mod-prj-card__hover-desc{
  width:320px;
  max-height:44px;
  font-family:'Satoshi', system-ui, sans-serif;
  font-weight:400;
  font-size:14px;
  line-height:140%;
  letter-spacing:0.01em;
}

/* Button "Czytaj więcej" – stan bazowy */
.mod-prj-card__hover-button{
  box-sizing:border-box;
  display:flex;
  flex-direction:row;
  justify-content:center;
  align-items:center;
  padding:12px 24px;
  gap:10px;
  width:320px;
  height:39px;
  border-radius:24px;

  font-family:'Satoshi', system-ui, sans-serif;
  font-weight:400;
  font-size:14px;
  line-height:1;
  letter-spacing:0.01em;
  text-decoration:none;

  border:1px solid currentColor;
  cursor:pointer;
  transition:background-color .2s ease, color .2s ease, border-color .2s ease;
}

/* === Warianty tła (blue / lilac / magenta / white) === */

.mod-prj-card__overlay--blue{
  background:#283896;
  color:#FFFFFF;
  min-height:90px;
}

.mod-prj-card__overlay--lilac{
  background:#E7DAFA;
  color:#283896;
  min-height:90px;
}

.mod-prj-card__overlay--magenta{
  background:#B34694;
  color:#FFFFFF;
  min-height:90px;
}

.mod-prj-card__overlay--white{
  background:#FFFFFF;
  color:#283896;
  min-height:90px;
}

/* Kolory tekstu w hoverze – dziedziczą po wariancie */
.mod-prj-card__overlay--blue .mod-prj-card__hover-desc,
.mod-prj-card__overlay--blue .mod-prj-card__hover-button{
  color:#FFFFFF;
}

.mod-prj-card__overlay--magenta .mod-prj-card__hover-desc,
.mod-prj-card__overlay--magenta .mod-prj-card__hover-button{
  color:#FFFFFF;
}

.mod-prj-card__overlay--lilac .mod-prj-card__hover-desc,
.mod-prj-card__overlay--lilac .mod-prj-card__hover-button,
.mod-prj-card__overlay--white .mod-prj-card__hover-desc,
.mod-prj-card__overlay--white .mod-prj-card__hover-button{
  color:#283896;
}

/* HOVER przycisku – warianty */

/* Jasny fiolet + białe tło (white) – wypełniony granatowy button */
.mod-prj-card__overlay--lilac .mod-prj-card__hover-button:hover,
.mod-prj-card__overlay--white .mod-prj-card__hover-button:hover{
 color: #989898;
  border-color: #fff;
}

/* Granat i magenta – biały przycisk z granatowym tekstem */
.mod-prj-card__overlay--blue .mod-prj-card__hover-button:hover,
.mod-prj-card__overlay--magenta .mod-prj-card__hover-button:hover{
 color: #989898;
  border-color: #fff;
}

/* Dostępność / focus */
.mod-prj__seg-btn:focus-visible,
.mod-prj-card:focus-visible{
  outline:2px solid #9F68E4;
  outline-offset:2px;
}

/* Puste stany */
.mod-prj__empty{
  font-family:'Satoshi', system-ui, sans-serif;
  color:#283896;
  opacity:.7;
  padding:16px 0;
  text-align:center;
  grid-column:1/-1;
}

/* Hover dla NIEaktywnego przycisku w segmencie */
.mod-prj__seg-btn:not(.is-active):hover {
  background-color: #F9F6FE;
  border-color: #9F68E4;
}


/* ==== MOD: Projects – dół (CTA) ==== */
.mod-projects-dol{
  display:flex; flex-direction:column; justify-content:center; align-items:flex-start;
  padding:32px 0 64px; gap:24px; width:100%; max-width:1128px; margin:0 auto;
}

/* Tekst */
.mod-prd__text{
  width:100%; max-width:1128px;
  font-family:'Satoshi',system-ui,sans-serif; font-weight:500; font-size:21px; line-height:140%;
  color:#283896;
}
.mod-prd__text p{ margin:0; } /* w makiecie jedna linia, bez odstępów */

/* Przyciski */
.mod-prd__buttons{
  display:flex; flex-direction:row; align-items:flex-start; gap:24px;
  width:480px; height:40px; /* wg makiety */
}

/* Primary */
.mod-prd__btn{
  display:flex; align-items:center; justify-content:center; gap:6px;
  height:40px; padding:12px 24px; border-radius:24px; text-decoration:none;
  font-family:'Satoshi',system-ui,sans-serif; font-weight:500; font-size:14px; line-height:110%;
}
.mod-prd__btn--primary{
  background:#283896; color:#fff;
}
.mod-prd__btn--primary .mod-prd__btn-label{ color:#fff; }
.mod-prd__btn--primary .mod-prd__icon{ filter:none; }

/* Tertiary */
.mod-prd__btn--tertiary{
  box-sizing:border-box; border:1px solid #283896; color:#283896; gap:10px;
  background:transparent;
}
.mod-prd__btn--tertiary .mod-prd__btn-label{ color:#283896; }

/* Ikony */
.mod-prd__icon{ width:16px; height:16px; display:inline-block; }

/* Responsywność – przy mniejszych szerokościach złam w kolumnę */
@media (max-width:640px){
  .mod-prd__buttons{ width:100%; flex-wrap:wrap; }
}


/* ==== MOD: Projects – dół (CTA) — przyciski z Figmy ==== */

/* Wspólne */
.mod-prd__btn{
  display:flex;
  flex-direction:row;
  justify-content:center;
  align-items:center;
  padding:12px 24px;
  height:40px;
  border-radius:24px;
  text-decoration:none;
  font-family:'Satoshi',system-ui,sans-serif;
  font-weight:500;
  font-size:14px;
  line-height:110%;
  gap:6px; /* nadpisywane w tertiary */
}

/* Lewy: Button Primary */
.mod-prd__btn--primary{
  width:209px;
  background:#283896;
  color:#FFFFFF;
  border:none;
}
.mod-prd__btn--primary .mod-prd__btn-label{ color:#FFFFFF; }
.mod-prd__btn--primary .mod-prd__icon{
  width:16px; height:16px;
}


.mod-prd__btn--primary:hover {
background:#DCDCDC; color:#989898 
}	

.mod-prd__btn--primary:hover .mod-prd__btn-label {
 color:#989898 
}	


.mod-prd__btn--primary:hover .hoverrroff {
display: none;	
}

.mod-prd__btn--primary .hoverrron {
display: none;

}

.mod-prd__btn--primary:hover .hoverrron {
display: block;	
  margin-left: 0px;
width: 11px !important;
height: 11px !important;
}




/* Prawy: Tertiary Button */
.mod-prd__btn--tertiary{
  width:247px;
  box-sizing:border-box;
  background:transparent;
  border:1px solid #283896;
  color:#283896;
  gap:10px; /* z Figmy */
}
.mod-prd__btn--tertiary .mod-prd__btn-label{ color:#283896; }
.mod-prd__btn--tertiary .mod-prd__icon{
  width:16px; height:16px;
}




.mod-prd__btn--tertiary:hover {
border-color:#989898;	
color:#989898;
}	

.mod-prd__btn--tertiary:hover .mod-prd__btn-label {
 color:#989898 
}	


.mod-prd__btn--tertiary:hover .hoverrroff {
display: none;	
}

.mod-prd__btn--tertiary .hoverrron {
display: none;

}

.mod-prd__btn--tertiary:hover .hoverrron {
display: block;	
  margin-left: 0px;
width: 16px !important;
height: 16px !important;
}




/* Focus (dostępność) */
.mod-prd__btn:focus-visible{
  outline:2px solid #283896;
  outline-offset:2px;
}


/* PRAWY: Tertiary Button — poprawka 1:1 z Figmy (Hug) */
.mod-prd__btn--tertiary{
  box-sizing: border-box;
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
  padding: 12px 24px;        /* z Figmy */
  gap: 10px;                 /* z Figmy */
  height: 40px;              /* z Figmy */
  border: 1px solid #283896; /* z Figmy */
  border-radius: 24px;       /* z Figmy */
  background: transparent;
  color: #283896;
  /* UWAGA: bez width — Figma 'Hug' = auto szerokość wg treści */
}

.mod-prd__btn--tertiary .mod-prd__btn-label{
  font-family: 'Satoshi', system-ui, sans-serif;
  font-weight: 500;
  font-size: 13.8px;
  line-height: 110%;
  text-align: center;
  
  color: #283896;
}

.mod-prd__btn--tertiary .mod-prd__icon{
  width: 16px;
  height: 16px;
  flex: 0 0 auto;
}



/* ===== Mod: Projects – wpis ===== */
.m-prj-wpis{display:flex;justify-content:center;padding:24px}
.m-prj-wpis__card{
  margin-bottom: 40px;
  width:100%;max-width:900px;background:#fff;border-radius:40px;box-shadow:0 1px 4px rgba(12,12,13,.1),0 1px 4px rgba(12,12,13,.05);padding:24px}
.m-prj-wpis__head{display:flex;gap:56px;align-items:center}
.m-prj-wpis__media{flex:0 0 250px}
.m-prj-wpis__img{width:250px;height:250px;object-fit:cover;border-radius:24px;display:block;box-shadow:0 1px 4px rgba(12,12,13,.1),0 1px 4px rgba(12,12,13,.05)}
.m-prj-wpis__img--ph{background:#eee}
.m-prj-wpis__meta{display:flex;flex-direction:column;gap:12px;flex:1;min-width:0}
.m-prj-wpis__date{font:500 21px/140% 'Satoshi',system-ui;color:#8849D4}
.m-prj-wpis__title{font:500 36px/110% 'Satoshi',system-ui;color:#283896;margin:0}
.m-prj-wpis__badge{
  
  
  display:inline-flex;align-items:center;gap:10px;background:#E7DAFA;border-radius:24px;padding:4px 12px 6px;width:106px;  text-align: center }
.m-prj-wpis__badge span{font:500 10px/140% 'Satoshi',system-ui;color:#283896;letter-spacing:.2px}
.m-prj-wpis__body{margin-top:36px;display:flex;flex-direction:column;gap:24px}
.m-prj-wpis__body h2{font:500 21px/140% 'Satoshi',system-ui;color:#283896;margin:0}
.m-prj-wpis__body p{font:400 14px/160% 'Satoshi',system-ui;color:rgba(40,56,150,.75);margin:0}
.m-prj-wpis__body ul{color:rgba(40,56,150,.75); margin:0 0 0 1.1em}
@media (max-width:680px){.m-prj-wpis__head{flex-direction:column;gap:16px;align-items:flex-start}.m-prj-wpis__media{flex:0 0 auto}.m-prj-wpis__img{width:160px;height:160px}.m-prj-wpis__title{font-size:28px}}




/* === Placówki – Specjalistyczne (dopasowane do mod-placowki-st.php) === */
:root{
  --c-primary:#283896;        /* granat */
  --c-accent:#8849D4;         /* fiolet tekstów pomocniczych */
  --c-accent-2:#9F68E4;       /* obrys / aktywne */
  --c-bg-chip:#E7DAFA;        /* tło aktywnego segmentu */
  --c-sep:#E7DAFA;            /* linie */
  --c-text:#3D3D3D;
}

/* kontener strony */
.placowki-st{max-width:1128px;margin:0 auto;padding:0 16px 96px;}
.placowki-st__header{
  width: 700px;
  display:flex;flex-direction:column;gap:12px;
margin-left: auto;
  margin-right: auto;
  margin-top: 40px;
}

.placowki-st__descriptions {
width: 700px;
 margin-left: auto;
  margin-right: auto ;

}

.placowki-st__descriptions h2 {
font-family: Satoshi;
font-weight: 500;
font-style: Medium;
font-size: 21px;

line-height: 140%;
letter-spacing: 0%;


}

.placowki-st__descriptions p {
font-family: Satoshi;
font-weight: 400;
font-style: Regular;
font-size: 14px;
leading-trim: NONE;
line-height: 160%;
letter-spacing: 0%;


}

/* breadcrumbs */
.breadcrumbs{display:flex;align-items:center;gap:12px;padding:24px 0}
.breadcrumbs .br-home{font:500 12px/16px 'Satoshi',sans-serif;color:var(--c-primary);text-decoration:none;background:#fff;border-radius:24px;padding:8px 16px}
.breadcrumbs .br-sep{width:1px;height:16px;background:var(--c-sep)}
.breadcrumbs .br-current{font:500 12px/16px 'Satoshi',sans-serif;color:var(--c-accent)}

/* lead */
.lead h2{margin:0 0 6px;color:var(--c-primary);font:500 36px/110% 'Satoshi',sans-serif}
.lead p{margin:0;color:rgba(40,56,150,.75);font:400 16px/140% 'Satoshi',sans-serif}

/* przełącznik NFZ / Prywatne */
.segmented{display:flex;gap:16px;margin:24px 0;border:1px solid var(--c-sep);border-radius:40px;padding:8px;max-width:700px}
.segmented__btn{flex:1;border:0;background:#fff;border-radius:24px;padding:12px 24px;font:500 14px/110% 'Satoshi',sans-serif;color:var(--c-primary);cursor:pointer;transition:background .2s,border-color .2s,box-shadow .2s}
.segmented__btn.is-active{background:var(--c-bg-chip);border:1.4px solid var(--c-accent-2);box-shadow:0 0 0 1px rgba(0,0,0,0)}





/* bloki opisów + CTA nad listami */
.placowki-st__descriptions .desc{max-width:700px}
.placowki-st__ctas{display:flex;gap:24px;align-items:center;flex-wrap:wrap;max-width:700px;margin:30px 0 36px}

/* przyciski */
.btn{display:inline-flex;align-items:center;gap:6px;padding:12px 24px;border-radius:24px;text-decoration:none;font:500 14px/110% 'Satoshi',sans-serif}
.btn .ico{width:16px;height:16px}
.btn-primary{background:var(--c-primary);color:#fff}
.btn-primary .ico{filter:brightness(0) invert(1);margin-left:6px}
.btn-ghost{
  width: 57%;
  border:1px solid var(--c-primary);color:var(--c-primary);background:transparent}
.btn-ghost .ico{margin-right:10px}


.btn-ghost:hover {
border-color:#989898;	
color:#989898;
}	

.btn-ghost:hover .mod-prd__btn-label {
 color:#989898 
}	


.btn-ghost:hover .hoverrroff {
display: none;	
}

.btn-ghost .hoverrron {
display: none;

}

.btn-ghost:hover .hoverrron {
display: block;	
  margin-left: 0px;
width: 16px !important;
height: 16px !important;
}










/* nagłówki lokalizacji */
.placowki-st__location{margin-top:68px}
.placowki-st__location-head{text-align:center}
.placowki-st__location-head h3{margin:0;color:var(--c-primary);font:500 21px/140% 'Satoshi',sans-serif}
.placowki-st__location-head .addr{margin:6px 0 18px;color:var(--c-accent);font:400 16px/140% 'Satoshi',sans-serif}
.placowki-st__location-head hr{border:0;border-top:1.4px solid var(--c-sep);margin:0}

/* siatka przycisków poradni */
.placowki-st__grid{display:grid;grid-template-columns:repeat(3,1fr);gap:24px;margin-top:12px}
@media (max-width: 960px){.placowki-st__grid{grid-template-columns:1fr 1fr}}
@media (max-width: 640px){.placowki-st__grid{grid-template-columns:1fr}}

/* „pigułka” poradni */
.clinic-pill{box-sizing:border-box;display:flex;align-items:center;justify-content:space-between;gap:15px;width:100%;height:52px;padding:16px;background:#fff;border:1px solid var(--c-accent-2);border-radius:24px;color:var(--c-primary);font:500 16px/110% 'Satoshi',sans-serif;cursor:pointer;transition:box-shadow .2s,transform .05s}
.clinic-pill:hover{box-shadow:0 2px 10px rgba(40,56,150,.08);
				  background: #F9F6FE	
				  
				  }
.clinic-pill:active{transform:translateY(1px)}
.clinic-pill .ico{width:20px;height:20px}
.clinic-pill.is-emph{background:#F9F6FE}

/* === Modal (popup) === */
body.no-scroll{overflow:hidden}
.clinic-modal{position:fixed;inset:0;z-index:9999;display:none}
.clinic-modal[aria-hidden="false"]{display:block}
.clinic-modal__backdrop{position:absolute;inset:0;background:rgba(40,56,150,.5)}
.clinic-modal__dialog{position:relative;z-index:2;max-width:900px;margin:30px auto;background:#fff;border-radius:36px;box-shadow:0 1px 4px rgba(12,12,13,.1),0 1px 4px rgba(12,12,13,.05);padding:24px;outline:none}
.clinic-modal__close{position:absolute;right:24px;top:24px;border:0;background:none;cursor:pointer}

/* treść modala */
.clinic-modal__content{display:flex;flex-direction:column;gap:24px}
.cm-head .cm-title{margin:0;color:var(--c-primary);font:500 36px/110% 'Satoshi',sans-serif}
.cm-head .cm-sub{
  margin-top: 5px;
  margin-bottom: 5px;
  
  color:var(--c-accent);font:500 16px/110% 'Satoshi',sans-serif}
.cm-head .cm-badge{
  
  display:inline-flex;align-items:center;gap:10px;padding:4px 12px 6px;height:24px;border:1px solid #0CA78B;background:#DFF7F3;color:#097662;border-radius:24px;font:500 10px/140% 'Satoshi',sans-serif}

.cm-cols{display:flex;gap:24px}
.cm-col{flex:1}
.cm-col h4{margin:0 0 6px;color:var(--c-primary);font:500 16px/110% 'Satoshi',sans-serif}
.cm-col h3{margin:0 0 12px;color:var(--c-primary);font:500 21px/140% 'Satoshi',sans-serif}
.cm-col p{margin:0 0 6px;color:var(--c-text);font:400 12px/140% 'Satoshi',sans-serif;letter-spacing:.01em}
.cm-doctors p {
color:#8849D4
  
}
.cm-hours p {
color:#8849D4
  
}

.cm-contacts{display:flex;flex-direction:column;gap:12px}
.cm-contact{display:flex;align-items:center;gap:6px;color:var(--c-primary);font:500 14px/140% 'Satoshi',sans-serif}
.cm-contact img{width:16px;height:16px}

.cm-actions{display:flex;gap:24px;margin-top:8px}

@media (max-width:900px){
  .clinic-modal__dialog{margin:40px 16px}
  .cm-head .cm-title{font-size:28px}
  .cm-cols{flex-direction:column}
}

/* pomocnicze */
.is-hidden{display:none!important}


/* === CENNIK – wspólne === */
.price { padding: 0 16px 64px; }
.price__container { max-width:1128px; margin:0 auto; }
.price__title { font:500 36px/110% 'Satoshi',sans-serif; color:#283896; margin:50px 0 36px; }

/* Kotwice */
.price-tabs { display:flex; justify-content:center; margin:12px 0 24px; }
.price-tabs__list { display:flex; flex-wrap:wrap; gap:24px; padding:0; margin:0; list-style:none; }
.price-tabs__btn {
  display:inline-flex; align-items:center; gap:10px; padding:12px 24px;
  border:1px solid #9F68E4; border-radius:24px; background:#fff; color:#283896;
  font:500 14px/110% 'Satoshi',sans-serif; cursor:pointer;
}
.price-tabs__btn.is-active { background:#F9F6FE; }
.price-tabs__btn:hover {
background:#F9F6FE;
	
}
/* Karty */
.price-cards { display:flex; flex-direction:column; gap:24px; }
.price-card {
 width: 900px;
  margin-left: auto;
  margin-right: auto;
  
  background:#fff; border-radius:36px; padding:32px; box-shadow:0 1px 4px rgba(12,12,13,.1), 0 1px 4px rgba(12,12,13,.05);
}
.price-card__title { margin:0 0 24px; text-align:center; color:#283896; font:500 21px/120% 'Satoshi',sans-serif; }

/* Tabela (pseudo-table na divach, zgodnie z designem) */
.price-table { width:100%; max-width:836px; margin:0 auto; }
.price-table__head { display:grid; grid-template-columns: 1fr 100px 100px 100px; align-items:center; }
.price-th { padding:12px 0; text-align:center; color:#8849D4; font:500 12px/140% 'Satoshi',sans-serif; }
.price-th--name { text-align:left; padding-right:24px; }

/* Wiersze */
.price-row { display:grid; grid-template-columns: 1fr 100px 100px 100px; gap:0; align-items:center; padding:16px 0; }
.price-row + .price-row { border-top:2px solid #E7DAFA; }

.price-cell { text-align:center; color:#283896; font:500 14px/120% 'Satoshi',sans-serif; }
.price-cell--name { text-align:left; padding-right:24px; color:#3D3D3D; font-weight:500; }

/* Podtytuł (label w środku tabeli) */
.price-row--label { grid-template-columns: 1fr; }
.price-cell--label {
  color:#8849D4; font:500 16px/110% 'Satoshi',sans-serif;
  padding:12px 0; border-top:0px solid #E7DAFA;
  text-align: left;
}

/* Responsywność */
@media (max-width: 920px){
  .price-card { padding:24px; }
  .price-table__head, .price-row { grid-template-columns: 1fr 80px 80px 80px; }
  .price-th, .price-cell { font-size:13px; }
}
@media (max-width: 640px){
  /* wariant kolumnowy (nazwa u góry, ceny w wierszu poniżej) */
  .price-table__head { display:none; }
  .price-row { grid-template-columns: 1fr; padding:12px 0; }
  .price-cell--name { margin-bottom:6px; }
  .price-cell { text-align:left; }
  .price-row:not(.price-row--label) .price-cell:nth-child(2)::before { content:"Cena netto: "; color:#8849D4; }
  .price-row:not(.price-row--label) .price-cell:nth-child(3)::before { content:"VAT: "; color:#8849D4; }
  .price-row:not(.price-row--label) .price-cell:nth-child(4)::before { content:"Cena brutto: "; color:#8849D4; }
}


/* === Cennik – Podział (duże link-przyciski) === */
.cennik-split{display:flex;justify-content:center;padding:12px 0 64px}
.cennik-split__inner{width:100%;max-width:1128px;padding:0 16px;display:flex;flex-direction:column;align-items:center;gap:24px}
.cennik-split__head{
  
  color: #283896BF;
  width:100%;max-width:700px;display:flex;flex-direction:column;gap:12px;align-items:center;text-align:left}
.cennik-split__title{margin:0;width:100%;font:500 36px/110% 'Satoshi',sans-serif;color:#283896}
.cennik-split__lead{margin:0;width:100%;font:400 16px/140% 'Satoshi',sans-serif;color:rgba(40,56,150,.75)}

.cennik-split__links{width:100%;max-width:520px;display:flex;flex-direction:column;gap:24px;align-items:flex-start}

/* link button */
.cs-link{box-sizing:border-box;display:flex;align-items:center;justify-content:space-between;
  width:100%;min-height:57px;padding:16px;border:1.4px solid #9F68E4;border-radius:24px;
  background:#fff;text-decoration:none}
.cs-link__label{flex:1;font:500 21px/120% 'Satoshi',sans-serif;color:#283896}
.cs-link__arrow{width:20px;height:20px;flex:0 0 20px}

/* hover/focus */
.cs-link{transition:box-shadow .2s, transform .05s}
.cs-link:hover{box-shadow:0 2px 10px rgba(40,56,150,.08);
	background: #F9F6FE		  
			  }
.cs-link:active{transform:translateY(1px)}

/* responsive */
@media (max-width:560px){
  .cennik-split__head{max-width:100%}
  .cennik-split__links{max-width:100%}
}

/* === Cennik – Info (mod-cennik-info) === */
.cennik-info{
  max-width:1128px;
  margin:0 auto;
  padding:30px 16px 64px;
  display:flex;                 /* centrowanie całego modułu */
  justify-content:center;
}

.cennik-info__wrap{
  width:700px;                  /* zgodnie z makietÄ… */
  max-width:100%;
  margin:0 auto;                /* dodatkowe wyśrodkowanie na wszelki wypadek */
  display:flex;
  flex-direction:column;
  gap:24px;
  align-items:flex-start;
}

.cennik-info__head{display:flex;flex-direction:column;gap:12px}
.cennik-info__title{
  margin:0;
  color:#283896;
  font-family:'Satoshi',sans-serif;
  font-weight:500;
  font-size:36px;
  line-height:110%;
}
.cennik-info__desc{
  color:rgba(40,56,150,.75);
  font:400 16px/140% 'Satoshi',sans-serif;
}

/* CTA – jedna linia */
.cennik-info__cta{
  display:flex;
  gap:24px;
  align-items:center;
  flex-wrap:nowrap;             /* ważne: jedna linia */
}

.btn{
  display:inline-flex;
  align-items:center;
  gap:6px;
  padding:12px 24px;
  height:40px;                  /* zgodnie z makietÄ… */
  border-radius:24px;
  text-decoration:none;
  white-space:nowrap;
}

.btn:hover {
 
}



.btn .ico{width:16px;height:16px}

.btn-ghost{border:1px solid #283896;color:#283896;background:#fff}
.btn-primary{background:#283896;color:#fff}



.hoverbtnprime:hover {
background:#DCDCDC; color:#989898 
}	

.hoverbtnprime:hover .mod-prd__btn-label {
 color:#989898 
}	


.hoverbtnprime:hover .hoverrroff {
display: none;	
}

.hoverbtnprime  .hoverrron {
display: none;

}

.hoverbtnprime:hover .hoverrron {
display: block;	
  margin-left: 0px;
width: 11px !important;
height: 11px !important;
}


.hoverbtnprimedwaa:hover {
border-color:#989898;	
color:#989898;
}	

.hoverbtnprimedwaa:hover .mod-prd__btn-label {
 color:#989898 
}	


.hoverbtnprimedwaa:hover .hoverrroff {
display: none;	
}

.hoverbtnprimedwaa .hoverrron {
display: none;

}

.hoverbtnprimedwaa:hover .hoverrron {
display: block;	
  margin-left: 0px;
width: 16px !important;
height: 16px !important;
}


.btn-primary .ico{filter:brightness(0) invert(1)}

/* opcjonalnie: jeśli kiedyś zechcesz pozwolić na zawijanie na bardzo małych ekranach,
   odkomentuj blok poniżej */
/*
@media (max-width:560px){
  .cennik-info__cta{flex-wrap:wrap}
}
*/


.btn-primaryhover:hover {
background:#DCDCDC; color:#989898 
}	

.btn-primaryhover:hover .mod-prd__btn-label {
 color:#989898 
}	


.btn-primaryhover:hover .hoverrroff {
display: none !important;	
width:0px;height:0px
}

.btn-primaryhover .hoverrron {
display: none;

}

.btn-primaryhover:hover .hoverrron {
display: block;	
  margin-left: 0px;
width: 12px !important;
height: 12px !important;
}






/* ========== ZMIANA ROZMIARU CZCIONKI NA STRONIE ========== */

body.font-normal {
  font-size: 100%;
}

body.font-medium {
  font-size: 112.5%; /* ok. 18px przy bazowym 16px */
}

body.font-large {
  font-size: 125%;   /* ok. 20px */
}

/* ========== WYSOKI KONTRAST (oko) ========== */

body.contrast-on {
  background-color: #000000 !important;
  color: #FFFFFF !important;
}

/* linki w trybie kontrastu */
body.contrast-on a {
  color: #00FFFF !important;
}

/* przykładowe elementy nagłówka/stopki – dopasuj do swoich klas */
body.contrast-on .site-header,
body.contrast-on .site-footer,
body.contrast-on .topnav {
  background-color: #000000 !important;
}

/* obrazki w kontrastowym trybie, jak chcesz: */
body.contrast-on img {
  filter: grayscale(100%);
}

/* ========== DODATKOWE – dostępność (screen-reader only) ========== */

.sr-only {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border: 0;
}

/* ========== PROSTE RWD (opcjonalnie) ========== */

@media (max-width: 767px) {
  .wcag-panel {
    right: auto;
    left: 50%;
    transform: translateX(-50%);
  }
}




/* ===== WCAG: powiększanie samego tekstu, bez rozwalania layoutu ===== */

/* A – domyślnie nic nie zmieniamy, nie trzeba reguł */

/* A+ – ok. 130% */
html.font-medium :where(
  p,
  a,
  li,
  span,
  strong,
  em,
  h1,
  h2,
  h3,
  h4,
  h5,
  h6,
  button,
  input,
  textarea,
  label
) {
  font-size: 105% !important;
}

/* A++ – mocniejsze powiększenie, np. 160% */
html.font-large :where(
  p,
  a,
  li,
  span,
  strong,
  em,
  h1,
  h2,
  h3,
  h4,
  h5,
  h6,
  button,
  input,
  textarea,
  label
) {
  font-size: 110% !important;
}


/* ===== Korekta: niech menu i mega-nagłówki nie rosną za mocno ===== */

/* MENU GÓRNE – delikatne powiększenie zamiast x2 */
html.font-medium .topnav__menu a {
  font-size: 101% !important;   /* A+ – trochę większe */
}

html.font-large .topnav__menu a {
  font-size: 105% !important;   /* A++ – większe, ale bez rozwalenia navu */
}

/* DUŻE NAGŁÓWKI – ograniczamy wzrost, żeby nie wchodziły pod nav */
/* dopasowałem do Twojej struktury, ale jak masz inne klasy tytułu, dorzuć je tutaj */
html.font-medium h1,
html.font-medium .page-title,
html.font-medium .entry-title {
  font-size: 101% !important;
}

html.font-large h1,
html.font-large .page-title,
html.font-large .entry-title {
  font-size: 105% !important;
}



.mod-prj__seg-btn:not(.is-active):hover {
  background-color: #F9F6FE;
  border-color: #9F68E4;
}


.segmented__btn{
  flex:1;
  border:1.4px solid transparent;     /* ważne */
  background:#fff;
  border-radius:24px;
  padding:12px 24px;
  font:500 14px/110% 'Satoshi',sans-serif;
  color:var(--c-primary);
  cursor:pointer;
  transition:background .2s, border-color .2s, box-shadow .2s;
}



/* poprawiony selector – DWA podkreślenia */
.segmented__btn:not(.is-active):hover {
  background-color: #F9F6FE;
  border-color: #9F68E4;
}



//* ========== NAV: AA + OKO ========== */

/* kontener WCAG w navie */
.nav-accessibility {
  position: relative;
  display: flex;
  flex-direction: column;
  align-items: flex-end;
  gap: 0;
}

/* górny rząd – AA + oko */
.nav-accessibility__controls {
  display: inline-flex;
  flex-direction: row;
  align-items: center;
  gap: 12px;
}

/* przyciski w górnym rzędzie – bez tła, bez ramek */
.nav-accessibility__btn {
  background: transparent !important;
  border: none !important;
  box-shadow: none !important;
  padding: 0;
  margin: 0;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
}

.nav-accessibility__btn svg,
.nav-accessibility__btn img {
  width: 20px;
  height: 20px;
  display: block;
}

/* =========================
   Ikona AA (font switcher)
   ========================= */

/* domyślny kolor – #283896 */
.nav-accessibility__btn--font svg path {
  stroke: #283896 !important;
  transition: stroke .15s ease;
}

/* HOVER + AKTYWNE – #8849D4, bez tła i bez ramki */
.nav-accessibility__btn--font:hover svg path,
.nav-accessibility__btn--font.is-active svg path {
  stroke: #8849D4 !important;
}

/* na wszelki wypadek – żadnego tła / cienia przy aktywnym */
.nav-accessibility__btn--font:hover,
.nav-accessibility__btn--font.is-active {
  background: transparent !important;
  box-shadow: none !important;
}

/* =========================
   Ikona oka (kontrast)
   ========================= */

.nav-accessibility__btn--contrast img {
  width: 20px;
  height: 20px;
  display: block;
}

/* przy włączonym kontraście – lekkie zafioletowienie ikony */
html.high-contrast .nav-accessibility__btn--contrast img,
.nav-accessibility__btn--contrast.is-active img {
  filter: brightness(0) saturate(100%) hue-rotate(260deg);
}

/* =========================
   PANEL A / A+ / A++
   ========================= */

.wcag-panel {
  position: absolute;
  top: calc(100% + 16px);
  right: -2px; /* dopasowane do Twojej makiety */

  display: none;
  flex-direction: row;
  justify-content: center;
  align-items: center;
  padding: 8px 16px;
  gap: 8px;

  width: 233px;
  height: 55px;

  background: #FFFFFF;
  border-radius: 24px;
  box-shadow: 0 8px 24px rgba(0, 0, 0, 0.12);
  z-index: 20;
}

.wcag-panel.is-open {
  display: flex;
}

/* pionowe kreski pomiędzy A / A+ / A++ */
.wcag-panel__divider {
  width: 24px;
  height: 0;
  border: 1px solid #E7DAFA;
  transform: rotate(90deg);
  flex: none;
}

/* =========================
   Przyciski A / A+ / A++
   ========================= */

.wcag-font {
  display: flex;
  align-items: flex-start;
  padding: 4px 8px;
  gap: 8px;

  font-family: 'DM Sans', system-ui, -apple-system, BlinkMacSystemFont, sans-serif;
  font-style: normal;
  font-weight: 400;
  color: #283896;

  background: transparent;
  border-radius: 12px;
  border: 1px solid transparent;  /* pod hover border */
  cursor: pointer;
  transition: background .2s ease, color .2s ease, border-color .2s ease;
}

/* rozmiary */

.wcag-font--small {
  width: 24px;
  height: 22px;
  font-size: 11px;
  line-height: 14px;
}

.wcag-font--medium {
  width: 37px;
  height: 30px;
  font-size: 17px;
  line-height: 22px;
}

.wcag-font--large {
  width: 58px;
  height: 39px;
  font-size: 24px;
  line-height: 31px;
}

/* ACTIVE – tylko kolor tekstu, brak tła/ramki */
.wcag-font.is-active {
  color: #8849D4;
  background: transparent;
  border-color: transparent;
}

/* HOVER – tło + ramka (dla wszystkich, także aktywnego) */
.wcag-font:hover {
  background: #F9F6FE;
  border-color: #E7DAFA;
}

/* =========================
   TOPNAV + FIOLETOWE TŁO
   ========================= */

/* biały nav w „pigułce” – stała wysokość jak w projekcie */
.topnav {
  position: relative;
  height: 53px;
  display: flex;
  align-items: center;
}

/* fioletowe tło pod navem */
.topnav-wrap {
  padding-bottom: 24px;
  transition: padding-bottom .2s ease;
}

/* gdy panel A/A+/A++ jest otwarty – trochę więcej fioletu, ale nie 90px ;) */
.topnav-wrap.wcag-open {
  padding-bottom: 56px;   /* możesz podbić na 60–64 jeśli będzie za mało */
}

/* =========================
   Dodatkowe utility
   ========================= */

.cm-badge--private {
  background: #FEEDF9;
  border: 1px solid #E066BD;
  color: #A53886;
}

/* sr-only */
.sr-only {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  border: 0;
}

/* RWD panelu WCAG */
@media (max-width: 767px) {
  .nav-accessibility {
    align-items: center;
  }

  .wcag-panel {
    right: 50%;
    transform: translateX(50%);
    width: auto;
    min-width: 233px;
  }
}


/* =========================
   TOP NAV – GŁÓWNY RZĄD LINKÓW
   ========================= */

.topnav__nav {
  flex: 1 1 auto;
  display: flex;
  justify-content: center;
}

.topnav__menu {
  display: flex;
  align-items: center;
  gap: 16px;                 /* odstęp między pozycjami */
  list-style: none;
  margin: 0;
  padding: 0;
}

.topnav__menu > li {
  position: relative;
}

/* link top–level jak w Figmie: padding 8px, tekst Satoshi 14px */
.topnav__menu > li > a.topnav__link {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  padding: 8px;
  text-decoration: none;

  font-family: 'Satoshi', system-ui, -apple-system, Segoe UI, Roboto, 'Helvetica Neue', Arial, 'Noto Sans', sans-serif;
  font-weight: 500;
  font-size: 14px;
  line-height: 19px;

  color: #283896;
  border-radius: 999px;
  transition: color .15s ease;
}

/* stan aktywny (aktualna strona) – fioletowy, jak "O Nas" na makiecie */
.topnav__menu > li.current-menu-item > a.topnav__link,
.topnav__menu > li.current_page_item > a.topnav__link {
  color: #8849D4;
}

/* hover/focus – też fiolet */
.topnav__menu > li > a.topnav__link:hover,
.topnav__menu > li > a.topnav__link:focus-visible {
  color: #8849D4;
  outline: none;
}

/* =========================
   Strzałki (chevron) przy pozycjach z podmenu
   ========================= */

.topnav__menu > li.menu-item-has-children > a.topnav__link {
  padding-right: 18px; /* miejsce na strzałkę */
  position: relative;
}

/* strzałka – borderowy chevron */
.topnav__menu > li.menu-item-has-children > a.topnav__link::after {
  content: "";
  position: absolute;
  right: 6px;
  top: 50%;
  width: 8px;
  height: 8px;
  border-right: 1.7px solid currentColor;
  border-bottom: 1.7px solid currentColor;
  transform: translateY(-60%) rotate(45deg); /* w dół */
  transition: transform .15s ease;
}

/* gdy hover / focus / aktualna sekcja – strzałka do góry (jak O Nas na Figmie) */
.topnav__menu > li.menu-item-has-children:hover > a.topnav__link::after,
.topnav__menu > li.menu-item-has-children:focus-within > a.topnav__link::after,
.topnav__menu > li.menu-item-has-children.current-menu-item > a.topnav__link::after,
.topnav__menu > li.menu-item-has-children.current_page_item > a.topnav__link::after {
  transform: translateY(-40%) rotate(-135deg); /* do góry */
}


/* =========================
   MEGA MENU – POZIOMA KARTA
   ========================= */

/* domyślnie ukryte */
.topnav__menu .sub-menu {
  display: none;
  position: absolute;
  left: 50%;
  transform: translateX(-50%);
  top: calc(100% + 16px);

  background: #FFFFFF;
  border-radius: 24px;
  box-shadow:
    0 16px 32px -4px rgba(12, 12, 13, 0.10),
    0 4px 4px -4px rgba(12, 12, 13, 0.05);

  padding: 24px;
  min-width: 720px;
  max-width: 1280px;
  width: min(960px, calc(100vw - 48px));

  z-index: 9999;

  /* układ kafelków */
  flex-direction: row;
  align-items: stretch;
  gap: 16px;
}

/* pokaż na hover + focus (klawiatura) */
.topnav__menu > li:hover > .sub-menu,
.topnav__menu > li:focus-within > .sub-menu {
  display: flex;
}

/* każdy element w mega menu – kolumna */
/* każdy element w mega menu – zawsze 3 kolumny, z uwzględnieniem gapów */
.topnav__menu .sub-menu > li {
  list-style: none;
  flex: 0 0 calc((100% - 32px) / 3);
  max-width: calc((100% - 32px) / 3);
  min-width: 0;
}



/* link wewnątrz karty – pełna wysokość, bez domyślnych dekoracji */
.topnav__menu .sub-menu {
  display: none;
  position: absolute;

  left: 50%;
  transform: translateX(-50%);
  top: calc(100% + 4px);

  background: #FFFFFF;
  border-radius: 24px;
  box-shadow:
    0 16px 32px -4px rgba(12, 12, 13, 0.10),
    0 4px 4px -4px rgba(12, 12, 13, 0.05);

  padding: 24px;
  width: 100%;
  max-width: 1232px;       /* dokładnie jak w Figmie: 1280 - 2×24 */
  z-index: 9999;

  box-sizing: border-box;
  flex-direction: row;
  align-items: stretch;
  gap: 16px;
}


/* pierwszy kafelek – wyróżniony jak na screenie (F9F6FE + 9F68E4) */
.topnav__menu .sub-menu > li:first-child > a.topnav__link {
  background: #F9F6FE;
  border-color: #9F68E4;
}

/* hover karty – delikatne podbicie */
.topnav__menu .sub-menu > li > a.topnav__link:hover {
  background: #F9F6FE;
  border-color: #9F68E4;
  box-shadow: 0 8px 16px rgba(12, 12, 13, 0.10);
  transform: translateY(-1px);
}

/* teksty w kartach (title + opis) */

.mega-menu-card__top {
  display: flex;
  flex-direction: row;
  align-items: center;
  gap: 8px;
  margin-bottom: 6px;
}

.mega-menu-card__icon {
  display: inline-flex;
  width: 19px;
  height: 19px;
}

/* ikony w kartach – fioletowe obrysy */
.mega-menu-card__icon svg path {
  stroke: #9F68E4;
}

/* tytuł kafelka */
.mega-menu-card__title {
  font-size: 16px;
  line-height: 1.1;
  font-weight: 500;
  color: #283896;
}

/* opis kafelka */
.mega-menu-card__desc {
  margin-top: 4px;
  font-size: 12px;
  line-height: 1.4;
  font-weight: 400;
  color: rgba(40, 56, 150, 0.75);
}


/* =========================
   0. FIOLETOWE TŁO
   ========================= */

.topnav-wrap {
  padding-bottom: 24px;
  transition: padding-bottom .2s ease;
}

/* gdy otwarty panel WCAG albo mega-menu – więcej fioletu POD kartą */
.topnav-wrap.wcag-open,
.topnav-wrap.mega-open {
  padding-bottom: 190px; /* w razie czego dostrój 170–210px */
}

/* =========================
   0. FIOLETOWE TŁO ZA TOPNAV
   ========================= */

.topnav-wrap {
  padding-bottom: 24px;
  transition: padding-bottom .2s ease;
}

/* gdy otwarty panel WCAG albo mega-menu – więcej fioletu pod spodem */
.topnav-wrap.wcag-open,
.topnav-wrap.mega-open {
  padding-bottom: 190px; /* w razie czego dostrój: 170–210px */
}

/* =========================
   1. USTAWIENIE TOPNAV
   ========================= */

.topnav {
  position: relative;     /* punkt odniesienia dla mega-menu */
  height: 53px;
  display: flex;
  align-items: center;
}

/* lewa część zostaje jak była */

.topnav__nav {
  flex: 1 1 auto;
  display: flex;
  justify-content: center;
}

/* ważne: li już NIE jest positioned – mega-menu liczy się względem .topnav */
.topnav__menu {
  display: flex;
  align-items: center;
  gap: 16px;
  list-style: none;
  margin: 0;
  padding: 0;
}

.topnav__menu > li {
  position: static;
}

/* link top-level */

.topnav__menu > li > a.topnav__link {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  padding: 8px;
  text-decoration: none;

  font-family: 'Satoshi', system-ui, -apple-system, Segoe UI, Roboto, 'Helvetica Neue', Arial, 'Noto Sans', sans-serif;
  font-weight: 500;
  font-size: 14px;
  line-height: 19px;

  color: #283896;
  border-radius: 999px;
  transition: color .15s ease;
}

/* aktywny element główny */

.topnav__menu > li.current-menu-item > a.topnav__link,
.topnav__menu > li.current_page_item > a.topnav__link {
  color: #8849D4;
}

/* hover/focus */

.topnav__menu > li > a.topnav__link:hover,
.topnav__menu > li > a.topnav__link:focus-visible {
  color: #8849D4;
  outline: none;
}

/* strzałki przy elementach z podmenu */

.topnav__menu > li.menu-item-has-children > a.topnav__link {
  padding-right: 18px;
  position: relative;
}

.topnav__menu > li.menu-item-has-children > a.topnav__link::after {
  content: "";
  position: absolute;
  right: 7px;
  top: 50%;
  width: 4px;
  height: 4px;
  border-right: 1.7px solid currentColor;
  border-bottom: 1.7px solid currentColor;
  transform: translateY(-60%) rotate(45deg); /* strzałka w dół */
  transition: transform .15s ease;
}

/* gdy menu aktywne/hover – strzałka do góry */

.topnav__menu > li.menu-item-has-children:hover > a.topnav__link::after,
.topnav__menu > li.menu-item-has-children:focus-within > a.topnav__link::after,
.topnav__menu > li.menu-item-has-children.current-menu-item > a.topnav__link::after,
.topnav__menu > li.menu-item-has-children.current_page_item > a.topnav__link::after {
  transform: translateY(-40%) rotate(-135deg);
}

/* =========================
   2. MEGA MENU – POZIOMA KARTA
   ========================= */

/* domyślnie ukryte */
.topnav__menu .sub-menu {
  display: none;
  position: absolute;

  /* pozycjonowane względem .topnav (ta ma position:relative) */
  left: 50%;
  transform: translateX(-50%);
  top: calc(100% + 4px);      /* wizualna przerwa 4px */

  background: #FFFFFF;
  border-radius: 24px;
  box-shadow:
    0 16px 32px -4px rgba(12, 12, 13, 0.10),
    0 4px 4px -4px rgba(12, 12, 13, 0.05);

  padding: 24px;
  width: 100%;
  max-width: 1280px;

  z-index: 9999;

  /* układ kafelków – resztę robią flexy w li */
  flex-direction: row;
  align-items: stretch;
  gap: 16px;
}

/* „mostek” między topnav a kartą – żeby nie znikało przy zjeżdżaniu myszą */
.topnav__menu .sub-menu::before {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  top: -12px;
  height: 12px;
  background: transparent;
}

/* pokaż na hover + focus (klawiatura) */
.topnav__menu > li:hover > .sub-menu,
.topnav__menu > li:focus-within > .sub-menu {
  display: flex;
}

/* każdy element w mega menu – minimalnie węższe niż 1/3,
   żeby 3 kafelki weszły spokojnie na biały panel */
.topnav__menu .sub-menu > li {
  list-style: none;
  flex: 0 0 32.5%;
  max-width: 32.5%;
  min-width: 0;
}

/* upewniamy się, że padding i border liczą się w szerokość */
.topnav__menu .sub-menu > li > a.topnav__link {
  box-sizing: border-box;
}

/* link wewnątrz karty – BAZA dla wszystkich kafelków */
.topnav__menu .sub-menu > li > a.topnav__link {
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  height: 100%;

  padding: 12px;
  border-radius: 12px;

  text-decoration: none;
  background: #FFFFFF;
  border: 1.5px solid #E7DAFA;

  color: #283896;
  font-family: 'Satoshi', system-ui, -apple-system, Segoe UI, Roboto, 'Helvetica Neue', Arial, 'Noto Sans', sans-serif;
  transition: background .15s ease, border-color .15s ease,
              box-shadow .15s ease, transform .15s ease;

  /* wysokość jak w Figmie */
  min-height: 83px;
}

/* pierwszy kafelek – taki sam jak reszta */
.topnav__menu .sub-menu > li:first-child > a.topnav__link {
  background: #FFFFFF;
  border-color: #E7DAFA;
}

/* HOVER – efekt jak na makiecie */
.topnav__menu .sub-menu > li > a.topnav__link:hover {
  background: #F9F6FE;
  border-color: #9F68E4;
  box-shadow: 0 8px 16px rgba(12, 12, 13, 0.10);
  transform: translateY(-1px);
}

/* =========================
   3. TEKSTY W KARTACH (TYPOGRAFIA FIGMA)
   ========================= */

/* zerujemy font-size na linku, żeby nie pompował tekstów */
.topnav__menu .sub-menu > li > a.topnav__link {
  font-size: 0;
}

/* tytuł kafelka – Satoshi 16px / 110% */
.mega-menu-card__title {
  font-family: 'Satoshi', system-ui, -apple-system, Segoe UI, Roboto, 'Helvetica Neue', Arial, 'Noto Sans', sans-serif;
  font-style: normal;
  font-weight: 500;
  font-size: 14px;
  line-height: 1.1;
  color: #283896;
}

/* opis – Satoshi 12px / 140% */
.mega-menu-card__desc {
  margin-top: 4px;
  font-family: 'Satoshi', system-ui, -apple-system, Segoe UI, Roboto, 'Helvetica Neue', Arial, 'Noto Sans', sans-serif;
  font-style: normal;
  font-weight: 400;
  font-size: 12px;
  line-height: 1.4;
  color: rgba(40, 56, 150, 0.75);
}

/* wrapper tytułu + ikonki */

.mega-menu-card__top {
  display: flex;
  flex-direction: row;
  align-items: center;
  gap: 8px;
  margin-bottom: 6px;
}

.mega-menu-card__icon {
  display: inline-flex;
  width: 19px;
  height: 19px;
}

.mega-menu-card__icon svg path {
  stroke: #9F68E4;
}

/* zdejmujemy sztuczne min-height i zmniejszamy pionowy padding */
.topnav__menu .sub-menu > li > a.topnav__link {
  min-height: auto;          /* nadpisuje wcześniejsze 83px */
  padding-top: 8px;
  padding-bottom: 8px;
}


/* RESET – usuwamy „podwójne” powiększanie */
.topnav-wrap.wcag-open.mega-open {
  padding-bottom: 0 !important;
}

/* WCAG panel – małe powiększenie */
.topnav-wrap.wcag-open {
  padding-bottom: 86px !important;   /* dostosowane pod panel A/A+/A++ */
}

/* MEGA MENU – duże powiększenie */
.topnav-wrap.mega-open {
  padding-bottom: 250px !important;  /* pod karty mega menu */
}

/* Domyślny – małe tło */
.topnav-wrap {
  padding-bottom: 24px;
  transition: padding-bottom .2s ease;
}


/* === POPRAWA MEGA MENU – 3 kolumny, FAQ obok Dokumentów === */

/* przy otwartym menu używamy grida zamiast flexa */
.topnav__menu > li:hover > .sub-menu,
.topnav__menu > li:focus-within > .sub-menu {
  display: grid !important;
  grid-template-columns: repeat(3, minmax(0, 1fr)); /* 3 równe kolumny */
  column-gap: 16px;
  row-gap: 16px;
}

/* resetujemy stare ustawienia flex szerokości elementów */
.topnav__menu .sub-menu > li {
  list-style: none;
  flex: 0 0 auto;      /* nadpisuje calc((100% - 32px)/3) */
  max-width: none;
  min-width: 0;
}


#menu-menu-footer-3 {
margin-top: 0px
	
}

/* === FOOTER LINK – waga 500 tylko na hover === */

/* stan bazowy linku w stopce */
.footer__list a,
.footer-link {
  display: inline-flex !important;
  align-items: center;
  gap: 6px;
  padding: 0;
  margin: 0;

  font-family: 'Satoshi', system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif !important;
  font-style: normal !important;
  font-weight: 400 !important;        /* NORMAL (Regular) przed hoverem */
  font-size: 16px !important;
  line-height: 1.1 !important;

  color: #283896 !important;
  text-decoration: none !important;
}

/* sama strzałka */
.footer-link__icon {
  width: 16px;
  height: 16px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;

  border: none !important;
  opacity: 0;
  transform: translateX(-4px);
  transition: opacity .2s ease, transform .2s ease;
}

.footer-link__icon svg {
  width: 11px;
  height: 11px;
  display: block;
}

/* HOVER: tekst robi się 500, pokazuje się strzałka */
.footer-link:hover .footer-link__label,
.footer-link:focus-visible .footer-link__label {
  font-weight: 500 !important;        /* Medium tylko na hover/focus */
}

.footer-link:hover .footer-link__icon,
.footer-link:focus-visible .footer-link__icon {
  opacity: 1;
  transform: translateX(0);
}

/* bez podkreślenia także na hover */
.footer-link:hover {
  text-decoration: none !important;
}


/* TŁO + kontener jak w figmie */
.footer-wrap {
  background: #E7DAFA;
  padding: 64px 0 !important;
}

.footer {
  max-width: 1128px;
  margin: 0 auto;
  display: flex;
  flex-direction: column;
  gap: 36px;
}

/* Górna część: lewy blok (menu) + prawy blok (CTA) */
.footer__top {
  display: flex !important;
  flex-direction: row;
  align-items: flex-start;
  justify-content: space-between;
  gap: 112px;
}

/* LEWY BLOK: Dla Pacjenta + Oferta + O Nas */
.footer__main {
  display: flex;
  flex-direction: column;
  gap: 64px;
  flex: 1 1 auto;
}

/* Rząd z Dla Pacjenta i Ofertą obok siebie */
.footer__cols-row {
  display: flex;
  flex-direction: row;
  align-items: flex-start;
  gap: 112px;
}

/* Pojedyncza kolumna (Dla Pacjenta / Oferta) */
.footer__col {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 24px;
  width: 301.33px;
}

.footer__title {
  margin: 0;
  font-family: 'Satoshi', system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  font-weight: 500;
  font-size: 21px;
  line-height: 1.2;
  color: #283896;
}

.footer__list {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  flex-direction: column;
  gap: 12px;
}

.footer__item {
  margin: 0;
}

.footer-link__label,
.footer__list a {
  font-family: 'Satoshi', system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  font-weight: 400;
  font-size: 16px;
  line-height: 1.1;
  color: #283896;
}

/* RZĄD z "O Nas" pod spodem, na szerokość obu kolumn */
.footer__row--onas {
  margin-top: 0; /* w figmie to jest 64px gap – mamy go wyżej w .footer__main */
}

.footer__onas {
  display: flex;
  flex-direction: column;
  gap: 24px;
  /* szerokość ~ 2 kolumn + odstęp między nimi */
  max-width: 714px; /* 301.33 * 2 + ~112 */
}

/* Menu "O Nas" w dwóch kolumnach */
.footer__menu--onas .footer__list {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  column-gap: 112px;
  row-gap: 12px;
}

/* PRAWA KOLUMNA: CTA + social – tylko porządkujemy, layout jak w figmie */
.footer__cta {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 24px;
  width: 301.33px;
  flex: 0 0 auto;
}

/* Separator i dół stopki */
.footer__divider {
  width: 100%;
  height: 0;
  border-top: 2px solid #283896;
}

.footer__bottom {
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  align-items: center;
}

.footer__copy {
  font-family: 'Satoshi', system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  font-weight: 400;
  font-size: 16px;
  line-height: 1.4;
  color: #283896;
}