/* =========================================================
   ZWIERZAK 5.13.18.41 — DESKTOP MODE ON PHONE + COMPACT FOOTER
   - naprawia HOME 861–1100 px: hamburger bez równoczesnego pełnego menu
   - porządkuje header w wymuszonej „Wersji na komputer”
   - stopka 861–1100 px: pięć sekcji w jednym rzędzie
   - stopka <=860 px: zwarty układ dwukolumnowy + mapa na całą szerokość
   ========================================================= */

/* Telefon z wymuszoną wersją desktopową / pośrednie viewporty.
   HOME wcześniej pokazywał hamburger, ale .site-nav pozostawał widoczny
   w zakresie 861–1024 px. Wymuszamy jeden spójny model drawer menu. */
@media (min-width:861px) and (max-width:1100px){
  body.zw-v510.home .site-header .header-row{
    display:flex;
    flex-wrap:nowrap;
    align-items:center;
    min-width:0;
    height:82px;
    gap:10px!important;
  }

  body.zw-v510.home .site-header .brand{
    flex:0 0 150px!important;
    width:150px!important;
    height:70px!important;
    min-width:0;
  }

  body.zw-v510.home .site-header .header-cta{
    order:2;
    margin-left:auto;
    min-height:44px;
    padding-inline:12px;
    font-size:11px;
  }
  body.zw-v510.home .site-header .header-cta .header-cta__full{display:none}
  body.zw-v510.home .site-header .header-cta .header-cta__short{display:inline}

  body.zw-v510.home .site-header .zw-language-switcher{order:3;flex:0 0 auto}
  body.zw-v510.home .site-header .theme-switch{order:4;flex:0 0 44px;width:44px;min-width:44px;margin:0}
  body.zw-v510.home .site-header .theme-switch__label{display:none}
  body.zw-v510.home .site-header .a11y-tools{order:5;flex:0 0 auto;margin-left:0}

  body.zw-v510.home .site-header .nav-toggle{
    order:6;
    display:flex!important;
    flex:0 0 44px;
    width:44px;
    height:44px;
    min-width:44px;
    min-height:44px;
    margin:0;
    padding:10px;
    flex-direction:column;
    justify-content:center;
    gap:4px;
  }
  body.zw-v510.home .site-header .nav-toggle>span:not(.screen-reader-text){
    display:block;
    width:22px;
    height:2px;
    border-radius:2px;
    background:var(--ink);
  }

  body.zw-v510.home .site-header .site-nav{
    position:fixed!important;
    z-index:1000;
    display:none!important;
    left:18px;
    right:18px;
    top:94px;
    margin:0!important;
    padding:15px;
    background:#fff;
    border:1px solid var(--line);
    border-radius:14px;
    box-shadow:var(--shadow);
  }
  body.zw-v510.home .site-header .site-nav.is-open{display:block!important}
  body.zw-v510.home .site-header .site-nav__list,
  body.zw-v510.home .site-header .site-nav .menu{
    display:grid!important;
    grid-template-columns:1fr;
    gap:0!important;
    width:100%;
  }
  body.zw-v510.home .site-header .site-nav a{
    padding:11px!important;
    font-size:14px!important;
  }
  body.zw-v510.home .site-header .site-nav a::after{display:none}
  body.zw-v510.home .site-header .site-nav .sub-menu{
    position:static;
    visibility:visible;
    opacity:1;
    transform:none;
    box-shadow:none;
  }

  /* Stopka w „Wersji na komputer”: wszystkie główne bloki obok siebie. */
  body.zw-v510 .site-footer{
    padding-top:28px;
  }
  body.zw-v510 .footer-grid{
    grid-template-columns:minmax(150px,1.15fr) minmax(90px,.72fr) minmax(100px,.82fr) minmax(155px,1.05fr) minmax(180px,1.2fr)!important;
    gap:16px!important;
    align-items:start;
  }
  body.zw-v510 .footer-grid>*{min-width:0}
  body.zw-v510 .footer-logo{width:145px;height:88px}
  body.zw-v510 .footer-brand p{max-width:180px;margin:3px 0 10px;font-size:9px;line-height:1.45}
  body.zw-v510 .site-footer h2{margin:6px 0 9px;font-size:10px}
  body.zw-v510 .site-footer ul{gap:5px}
  body.zw-v510 .site-footer li,
  body.zw-v510 .site-footer a{font-size:9px;line-height:1.35;overflow-wrap:anywhere}
  body.zw-v510 .contact-list{gap:6px}
  body.zw-v510 .contact-list svg{flex-basis:13px;width:13px;height:13px}
  body.zw-v510 .footer-map{
    grid-column:auto!important;
    min-height:128px;
  }
  body.zw-v510 .footer-map img{height:128px;min-height:128px}
  body.zw-v510 .footer-map span{bottom:10px;padding:7px 12px;font-size:8px}
  body.zw-v510 .footer-bottom{
    margin-top:20px;
    padding-top:11px;
    gap:12px;
    font-size:8px;
  }
  body.zw-v510 .footer-bottom div{gap:12px;flex-wrap:wrap;justify-content:flex-end}
}

/* Zwykły tablet/mobile: zamiast jednej bardzo długiej kolumny — dwa zwarte tory. */
@media (max-width:860px){
  body.zw-v510 .site-footer{
    padding-top:24px;
  }
  body.zw-v510 .footer-grid{
    grid-template-columns:minmax(0,1fr) minmax(0,1fr)!important;
    gap:18px 22px!important;
    align-items:start;
  }
  body.zw-v510 .footer-grid>*{min-width:0}
  body.zw-v510 .footer-logo{width:145px;height:88px}
  body.zw-v510 .footer-brand p{max-width:none;margin:4px 0 12px;font-size:9.5px;line-height:1.45}
  body.zw-v510 .site-footer h2{margin:7px 0 10px;font-size:11px}
  body.zw-v510 .site-footer ul{gap:6px}
  body.zw-v510 .site-footer li,
  body.zw-v510 .site-footer a{font-size:9.5px;line-height:1.4;overflow-wrap:anywhere}
  body.zw-v510 .contact-list li{gap:6px}
  body.zw-v510 .footer-map{
    grid-column:1 / -1!important;
    min-height:130px;
  }
  body.zw-v510 .footer-map img{height:130px;min-height:130px}
  body.zw-v510 .footer-bottom{
    margin-top:20px;
    padding-top:12px;
    gap:10px;
  }
  body.zw-v510 .footer-bottom>span{min-width:0}
  body.zw-v510 .footer-bottom div{gap:10px 14px}
}

@media (max-width:620px){
  body.zw-v510 .site-footer{padding:20px 0 14px}
  body.zw-v510 .footer-grid{
    grid-template-columns:minmax(0,1fr) minmax(0,1fr)!important;
    gap:16px 18px!important;
  }
  body.zw-v510 .footer-logo{width:128px;height:76px}
  body.zw-v510 .footer-brand p{font-size:9px;line-height:1.4}
  body.zw-v510 .socials a{width:28px;height:28px}
  body.zw-v510 .site-footer h2{margin:5px 0 8px;font-size:10px}
  body.zw-v510 .site-footer li,
  body.zw-v510 .site-footer a{font-size:9px}
  body.zw-v510 .contact-list svg{flex:0 0 13px;width:13px;height:13px}
  body.zw-v510 .footer-map{min-height:112px}
  body.zw-v510 .footer-map img{height:112px;min-height:112px}
  body.zw-v510 .footer-map span{bottom:9px;padding:7px 12px;font-size:8px}
  body.zw-v510 .footer-bottom{
    flex-direction:row!important;
    align-items:flex-start;
    justify-content:space-between;
    flex-wrap:wrap;
    margin-top:16px;
    padding-top:10px;
    font-size:7.5px;
  }
  body.zw-v510 .footer-bottom>span{flex:1 1 180px}
  body.zw-v510 .footer-bottom div{
    flex:1 1 180px;
    justify-content:flex-end;
    flex-wrap:wrap;
    gap:7px 11px!important;
  }
}

/* Dark mode: drawer w zakresie pośrednim pozostaje spójny wizualnie. */
@media (min-width:861px) and (max-width:1100px){
  html[data-theme="dark"]:not(.is-high-contrast) body.zw-v510.home .site-header .site-nav{
    border-color:#2b4035;
    background:#101b16;
  }
  html[data-theme="dark"]:not(.is-high-contrast) body.zw-v510.home .site-header .nav-toggle>span:not(.screen-reader-text){
    background:#f2f7f4;
  }
}

/* =========================================================
   ZWIERZAK 5.13.18.42 — FINAL POLISH
   - desktop-mode 861–1100 px: lepsze kadrowanie psa w atlasie
   - desktop-mode 861–1100 px: stabilny początek karuzeli zespołu
   - desktop-mode 861–1100 px: dolny pasek prawny stopki w jednym rzędzie
   Normalny mobile <=860 px pozostaje bez zmian.
   ========================================================= */
@media (min-width:861px) and (max-width:1100px){
  /* Pies ma najdłuższą sylwetkę; zmniejszamy całe płótno razem z hotspotami
     i delikatnie przesuwamy je w lewo. Pozostałe gatunki pozostają bez zmian. */
  body.zw-v510.home .zw-atlas--home[data-active-species="dog"] .zw-atlas__media{
    --atlas-base-scale:.88!important;
  }
  body.zw-v510.home .zw-atlas--home[data-active-species="dog"] .zw-atlas__canvas{
    margin-left:-44px!important;
  }

  /* Karuzela ma zaczynać się równo od pierwszej karty, bez widocznego „ogona”
     poprzedniego slajdu przy wymuszonym widoku desktopowym telefonu. */
  body.zw-v510.home .team-cards{
    scroll-padding-inline-start:0!important;
    overscroll-behavior-inline:contain;
  }
  body.zw-v510.home .team-card:first-child{
    scroll-snap-align:start!important;
  }

  /* Dolny pasek prawny — jedna linia, bez samotnej „Mapy strony” niżej. */
  body.zw-v510 .footer-bottom{
    display:grid!important;
    grid-template-columns:minmax(0,1fr) auto;
    align-items:center;
    column-gap:14px!important;
  }
  body.zw-v510 .footer-bottom>span{
    min-width:0;
    line-height:1.35;
  }
  body.zw-v510 .footer-bottom>div{
    display:flex!important;
    align-items:center;
    justify-content:flex-end!important;
    flex-wrap:nowrap!important;
    gap:8px!important;
    min-width:0;
  }
  body.zw-v510 .footer-bottom>div>a,
  body.zw-v510 .footer-bottom>div>button{
    flex:0 0 auto;
    white-space:nowrap;
    font-size:7.5px!important;
    line-height:1.2;
  }
}


/* =========================================================
   ZWIERZAK 5.13.18.43 — FINAL ATLAS MICRO-FIX
   Desktop-mode telefonu 861–1100 px: pies przesunięty dodatkowo
   o 22 px w lewo. Płótno i hotspoty pozostają zsynchronizowane.
   Normalny mobile <=860 px i desktop >1100 px bez zmian.
   ========================================================= */

/* =========================================================
   ZWIERZAK 5.13.18.44 — DESKTOP-MODE ATLAS RECENTER
   Telefon z wymuszoną „Wersją na komputer” 861–1100 px.
   Mocniejsze, celowe kadrowanie psa: całe płótno (obraz + hotspoty)
   jest zmniejszone i przesunięte w lewo, aby pokazać pełną sylwetkę.
   Normalny mobile <=860 px i desktop >1100 px bez zmian.
   ========================================================= */
@media (min-width:861px) and (max-width:1100px){
  body.zw-v510.home .zw-atlas--home[data-active-species="dog"] .zw-atlas__media{
    --atlas-base-scale:.82!important;
  }
  body.zw-v510.home .zw-atlas--home[data-active-species="dog"] .zw-atlas__canvas{
    margin-left:-92px!important;
  }
}


/* =========================================================
   ZWIERZAK 5.13.18.45 — MOBILE HEADER CTA RESTORE
   Normalny mobile <=620 px: przywraca szybki przycisk rezerwacji,
   który bazowy main.css ukrywał przez .header-cta{display:none}.
   Na bardzo wąskim ekranie CTA jest ikoną kalendarza 44x44,
   dzięki czemu mieści się obok logo, trybu, Aa i hamburgera.
   Desktop-mode 861–1100 px i pozostałe sekcje bez zmian.
   ========================================================= */
@media (max-width:620px){
  body.zw-v510 .site-header .header-row{
    flex-wrap:nowrap!important;
    gap:7px!important;
  }
  body.zw-v510 .site-header .brand{
    margin-right:auto;
  }
  body.zw-v510 .site-header .header-cta{
    display:inline-flex!important;
    order:2;
    flex:0 0 42px!important;
    width:42px!important;
    min-width:42px!important;
    height:42px!important;
    min-height:42px!important;
    margin:0!important;
    padding:0!important;
    border-radius:10px;
    font-size:0!important;
  }
  body.zw-v510 .site-header .header-cta svg{
    width:17px!important;
    height:17px!important;
    margin:0!important;
  }
  body.zw-v510 .site-header .header-cta .header-cta__full,
  body.zw-v510 .site-header .header-cta .header-cta__short{
    display:none!important;
  }
  body.zw-v510 .site-header .theme-switch{
    order:3;
    flex:0 0 42px!important;
    width:42px!important;
    min-width:42px!important;
    height:42px!important;
    min-height:42px!important;
    margin:0!important;
  }
  body.zw-v510 .site-header .a11y-tools{
    order:4;
    flex:0 0 42px!important;
    width:42px!important;
    min-width:42px!important;
    margin:0!important;
  }
  body.zw-v510 .site-header .a11y-tools__toggle{
    width:42px!important;
    min-width:42px!important;
    height:42px!important;
    min-height:42px!important;
  }
  body.zw-v510 .site-header .nav-toggle{
    order:5;
    flex:0 0 42px!important;
    width:42px!important;
    min-width:42px!important;
    height:42px!important;
    min-height:42px!important;
    margin:0!important;
  }
}

/* Ekstremalnie wąskie telefony: zachowujemy wszystkie akcje,
   tylko lekko zmniejszamy logo i odstępy. */
@media (max-width:370px){
  body.zw-v510 .site-header .header-row{gap:5px!important}
  body.zw-v510 .site-header .brand{
    width:104px!important;
    flex-basis:104px!important;
  }
  body.zw-v510 .site-header .header-cta,
  body.zw-v510 .site-header .theme-switch,
  body.zw-v510 .site-header .a11y-tools,
  body.zw-v510 .site-header .a11y-tools__toggle,
  body.zw-v510 .site-header .nav-toggle{
    flex-basis:40px!important;
    width:40px!important;
    min-width:40px!important;
    height:40px!important;
    min-height:40px!important;
  }
}


/* =========================================================
   ZWIERZAK 5.13.18.46 — MOBILE FOOTER CLEAN LAYOUT
   Normalny mobile <=620 px: systematyczna stopka w logicznych sekcjach:
   marka -> linki/usługi -> kontakt -> mapa -> informacje prawne.
   Nie zmienia desktopu ani trybu „Wersja na komputer” 861–1100 px.
   ========================================================= */
@media (max-width:620px){
  body.zw-v510 .site-footer{
    padding:24px 0 18px!important;
  }

  body.zw-v510 .site-footer .footer-grid{
    display:grid!important;
    grid-template-columns:minmax(0,1fr) minmax(0,1fr)!important;
    grid-template-areas:
      "brand brand"
      "quick services"
      "contact contact"
      "map map";
    column-gap:22px!important;
    row-gap:0!important;
    align-items:start!important;
  }

  body.zw-v510 .site-footer .footer-brand{
    grid-area:brand;
    display:grid;
    grid-template-columns:132px minmax(0,1fr);
    grid-template-areas:
      "logo text"
      "logo socials";
    column-gap:18px;
    row-gap:10px;
    align-items:center;
    padding:0 0 22px;
    margin:0 0 20px;
    border-bottom:1px solid var(--line);
  }
  body.zw-v510 .site-footer .footer-logo{
    grid-area:logo;
    width:132px!important;
    height:82px!important;
    margin:0!important;
  }
  body.zw-v510 .site-footer .footer-brand p{
    grid-area:text;
    max-width:none!important;
    margin:0!important;
    font-size:12px!important;
    line-height:1.55!important;
  }
  body.zw-v510 .site-footer .socials{
    grid-area:socials;
    margin:0!important;
  }
  body.zw-v510 .site-footer .socials a{
    width:34px!important;
    height:34px!important;
  }

  body.zw-v510 .site-footer .footer-quick{
    grid-area:quick;
    padding:0 10px 22px 0;
  }
  body.zw-v510 .site-footer .footer-services{
    grid-area:services;
    padding:0 0 22px 10px;
  }
  body.zw-v510 .site-footer .footer-quick,
  body.zw-v510 .site-footer .footer-services{
    min-width:0;
  }
  body.zw-v510 .site-footer .footer-quick h2,
  body.zw-v510 .site-footer .footer-services h2,
  body.zw-v510 .site-footer .footer-contact h2{
    margin:0 0 12px!important;
    font-size:13px!important;
    line-height:1.25!important;
  }
  body.zw-v510 .site-footer .footer-quick ul,
  body.zw-v510 .site-footer .footer-services ul{
    gap:8px!important;
  }
  body.zw-v510 .site-footer .footer-quick li,
  body.zw-v510 .site-footer .footer-services li,
  body.zw-v510 .site-footer .footer-quick a,
  body.zw-v510 .site-footer .footer-services a{
    font-size:11px!important;
    line-height:1.4!important;
  }

  body.zw-v510 .site-footer .footer-contact{
    grid-area:contact;
    padding:20px 0 22px;
    margin:0;
    border-top:1px solid var(--line);
  }
  body.zw-v510 .site-footer .footer-contact .contact-list{
    display:grid!important;
    grid-template-columns:minmax(0,1fr) minmax(0,1fr)!important;
    gap:12px 18px!important;
  }
  body.zw-v510 .site-footer .footer-contact .contact-list li{
    display:flex!important;
    align-items:flex-start!important;
    gap:9px!important;
    min-width:0;
    font-size:11px!important;
    line-height:1.45!important;
  }
  body.zw-v510 .site-footer .footer-contact .contact-list li:nth-child(3),
  body.zw-v510 .site-footer .footer-contact .contact-list li:nth-child(4){
    grid-column:auto;
  }
  body.zw-v510 .site-footer .footer-contact .contact-list a,
  body.zw-v510 .site-footer .footer-contact .contact-list span{
    min-width:0;
    overflow-wrap:anywhere;
    font-size:11px!important;
    line-height:1.45!important;
  }
  body.zw-v510 .site-footer .footer-contact .contact-list svg{
    flex:0 0 16px!important;
    width:16px!important;
    height:16px!important;
    margin-top:1px;
  }

  body.zw-v510 .site-footer .footer-map{
    grid-area:map;
    width:100%;
    min-height:126px!important;
    margin:0!important;
    border-radius:14px!important;
  }
  body.zw-v510 .site-footer .footer-map img{
    width:100%!important;
    height:126px!important;
    min-height:126px!important;
    object-fit:cover!important;
  }
  body.zw-v510 .site-footer .footer-map span{
    bottom:10px!important;
    padding:8px 14px!important;
    font-size:8px!important;
  }

  body.zw-v510 .site-footer .footer-bottom{
    display:flex!important;
    flex-direction:column!important;
    align-items:center!important;
    justify-content:center!important;
    gap:11px!important;
    margin-top:20px!important;
    padding-top:14px!important;
    text-align:center;
    font-size:8px!important;
    line-height:1.45!important;
  }
  body.zw-v510 .site-footer .footer-bottom>span{
    flex:none!important;
    width:100%;
  }
  body.zw-v510 .site-footer .footer-bottom>div{
    display:flex!important;
    width:100%;
    align-items:center!important;
    justify-content:center!important;
    flex-wrap:wrap!important;
    gap:8px 14px!important;
  }
  body.zw-v510 .site-footer .footer-bottom>div>a,
  body.zw-v510 .site-footer .footer-bottom>div>button{
    flex:0 0 auto;
    white-space:nowrap;
    font-size:8px!important;
    line-height:1.3!important;
  }
}

/* Bardzo wąski ekran: kontakt przechodzi w jedną kolumnę,
   ale sekcje linków nadal zostają obok siebie. */
@media (max-width:390px){
  body.zw-v510 .site-footer .footer-brand{
    grid-template-columns:112px minmax(0,1fr);
    column-gap:14px;
  }
  body.zw-v510 .site-footer .footer-logo{
    width:112px!important;
    height:72px!important;
  }
  body.zw-v510 .site-footer .footer-brand p{
    font-size:11px!important;
  }
  body.zw-v510 .site-footer .footer-contact .contact-list{
    grid-template-columns:1fr!important;
    gap:10px!important;
  }
}


/* =========================================================
   5.13.18.49 — HOME TEAM CAROUSEL + TOP SOCIAL POLISH
   Desktop HOME: 7 lekarzy pozostaje w jednym poziomym torze.
   Widoczne jest 6 kart, siódma dostępna przez przesunięcie.
   Elżbieta nie może spaść do drugiego wiersza.
   ========================================================= */
@media (min-width:901px){
  body.zw-v510.home .team-cards{
    display:flex!important;
    flex-wrap:nowrap!important;
    gap:8px!important;
    overflow-x:auto!important;
    overflow-y:hidden!important;
    scroll-snap-type:x proximity;
    scrollbar-width:thin;
    scrollbar-color:rgba(8,122,60,.28) transparent;
    padding:2px 0 8px!important;
  }
  body.zw-v510.home .team-card{
    flex:0 0 calc((100% - 40px)/6)!important;
    min-width:0!important;
    scroll-snap-align:start;
  }
  body.zw-v510.home .team-card img,
  body.zw-v510.home .team-card__weronika-crop{
    width:100%!important;
  }
  body.zw-v510.home .team-cards::-webkit-scrollbar{height:6px}
  body.zw-v510.home .team-cards::-webkit-scrollbar-track{background:transparent}
  body.zw-v510.home .team-cards::-webkit-scrollbar-thumb{background:rgba(8,122,60,.22);border-radius:999px}
}


/* =========================================================
   5.13.18.51 — Weronika: spokojniejszy, naturalny kadr na HOME.
   Bez agresywnego zoomu; priorytetem jest twarz lekarza i górna część pacjenta.
   ========================================================= */
body.zw-v510.home .team-card--weronika-focus img{
  object-fit:cover!important;
  object-position:50% 14%!important;
}
@media (min-width:901px){
  body.zw-v510.home .team-card--weronika-focus img{
    width:100%!important;
    height:auto!important;
    aspect-ratio:1/1!important;
  }
}
@media (max-width:900px){
  body.zw-v510.home .team-card--weronika-focus img{
    height:130px!important;
    object-position:50% 12%!important;
  }
}
