/* ===========================================
   HEADER 
   =========================================== */
@media (max-width: 1024px) {

  /* Ukrywamy wersję desktopową menu i banery */
  .chwp-header-menu .main-header-menu {
    display: none !important;
  }

  .chwp-banner,
  .chwp-slider {
    display: none !important;
  }

  /* Nagłówek – logo wyśrodkowane */
  .chwp-header-top .container.header-flex {
    flex-direction: column !important;
    align-items: center !important;
    padding: 10px 0 !important;
  }

  .chwp-header-top .site-branding img {
    max-height: 70px !important;
    height: auto !important;
  }

  .chwp-header-top .site-branding-right {
    display: none !important; /* drugie logo chowamy na mobile */
  }


  /* Menu rozwijane po kliknięciu */
  .mobile-menu {
    display: none;
    background: #000;
    width: 100%;
  }

  .mobile-menu.open {
    display: block;
  }

  .mobile-menu ul {
    list-style: none;
    margin: 0;
    padding: 0;
  }

  .mobile-menu ul li a {
    display: block;
    color: #fff;
    text-decoration: none;
    padding: 14px 0;
    border-bottom: 1px solid #222;
  }

  .mobile-menu ul li a:hover {
    background: #E6007D;
  }

  /* Aktywny element menu */
  .mobile-menu ul li.current-menu-item a {
    background: #fdf0f7;
    color: #E6007D;
  }
}

/* ===========================================
   STRONY PARTNERÓW – TEKST POD ZDJĘCIEM (MOBILE)
   =========================================== */
@media (max-width: 1024px) {

  /* Reset floatów WordPressa przy zdjęciach */
  .page-container .content-center img.alignleft,
  .page-container .content-center img[align="left"],
  .page-container .content-center img[style*="float:left"] {
    float: none !important;
    display: block !important;
    margin: 0 auto 15px auto !important;
  }

  /* Zapewniamy poprawny układ pionowy */
  .page-container .content-center p {
    clear: both !important;
  }

  /* Dodatkowe ujednolicenie wyglądu */
  .page-container .content-center {
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    text-align: center !important;
  }

  /* Zdjęcie */
  .page-container .content-center img {
    width: 100% !important;
    max-width: 340px !important;
    border-radius: 8px !important;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);
  }

  /* Tekst biograficzny pod spodem */
  .page-container .content-center p {
    text-align: justify !important;
    font-size: 15px !important;
    color: #333 !important;
    line-height: 1.8 !important;
    margin-bottom: 14px !important;
  }
}

/* ===========================================
   LINKEDIN – CZYSTA IKONA (bez tła, poprawka)
   =========================================== */
@media (max-width: 1024px) {

  /* Link – reset poprzednich stylów */
  .page-container .content-center a[href*="linkedin"] {
    all: unset !important;              /* usuwa stare dziedziczone style */
    display: inline-block !important;
    text-align: center !important;
    margin: 12px auto 20px auto !important;
    cursor: pointer !important;
  }

  /* Przywracamy tylko minimum, żeby nie zniknął link */
  .page-container .content-center a[href*="linkedin"] {
    color: inherit !important;
  }

  /* Sama ikona LinkedIn */
  .page-container .content-center a[href*="linkedin"] img {
    width: 28px !important;             /* naturalny rozmiar ikony */
    height: auto !important;
    margin: 0 auto !important;
    display: block !important;
    border: none !important;
    background: none !important;
    box-shadow: none !important;
    filter: none !important;
  }
}

/* ===========================================
   FOOTER 
   =========================================== */
@media (max-width: 1024px) {

  .site-footer {
    background: #111 !important;
    color: #fff !important;
    padding: 30px 20px !important;
    text-align: left !important;
  }

  /* Siatka dwukolumnowa – idealne wyrównanie */
  .footer-widgets {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(140px, 1fr)) !important;
    grid-auto-rows: minmax(130px, auto) !important;
    gap: 35px 40px !important;
    max-width: 600px !important;
    margin: 0 auto !important;              /* wyśrodkowanie całej siatki */
    justify-items: stretch !important;
    align-items: start !important;
  }

  /* Kolumny – wyrównane do lewej */
  .footer-widgets .footer-col {
    text-align: left !important;
    margin: 0 !important;
    padding: 0 !important;
  }

  /* Nagłówki sekcji */
  .footer-widgets .footer-col h2,
  .footer-widgets .footer-col h3 {
    font-size: 14px !important;
    color: #fff !important;
    font-weight: 700 !important;
    text-transform: uppercase;
    margin-bottom: 10px !important;
    border-bottom: 2px solid #E6007D !important;
    padding-bottom: 2px !important;
    width: fit-content !important;
  }

  /* Linki */
  .footer-widgets .footer-col a {
    display: block !important;
    color: #fff !important;
    text-decoration: none !important;
    font-size: 14px !important;
    margin-bottom: 6px !important;
    transition: color 0.3s ease;
  }

  .footer-widgets .footer-col a:hover {
    color: #E6007D !important;
  }

  /* Delikatne wyrównanie kolumn w pionie */
  .footer-widgets .footer-col:nth-child(odd) {
    padding-right: 15px !important;
  }
  .footer-widgets .footer-col:nth-child(even) {
    padding-left: 15px !important;
  }

  /* Dolna część stopki */
  .footer-bottom {
    margin-top: 30px !important;
    border-top: 1px solid #333 !important;
    width: 100% !important;
    text-align: center !important;
    padding-top: 15px !important;
    font-size: 13px !important;
    color: #aaa !important;
  }

  .footer-bottom a {
    color: #E6007D !important;
    text-decoration: none !important;
    font-weight: 500 !important;
  }

  .footer-bottom a:hover {
    text-decoration: underline !important;
  }
}
/* ===========================================
   MOBILE — NAPRAWA WĄSKIEGO TEKSTU
   =========================================== */
@media (max-width: 1024px) {

  /* Kontener główny – pełna szerokość */
  .page-container,
  .content-area,
  .site-main,
  .content-center {
    width: 100% !important;
    max-width: 100% !important;
    padding: 0 18px !important;
    margin: 0 auto !important;
    float: none !important;
    box-sizing: border-box !important;
  }

  /* Akapity – normalna szerokość i czytelność */
  .page-container p,
  .content-center p,
  .entry-content p {
    font-size: 16px !important;
    line-height: 1.75 !important;
    margin-bottom: 18px !important;
    text-align: justify !important;
    width: 100% !important;
  }

  /* Obrazki – szerokość 100% */
  .page-container img,
  .content-center img,
  .entry-content img {
    max-width: 100% !important;
    height: auto !important;
    float: none !important;
    margin: 15px auto !important;
    display: block !important;
  }

  /* Usuwamy resztki starych floatów */
  .alignleft,
  .alignright,
  img[style*="float"],
  figure {
    float: none !important;
    margin: 15px auto !important;
  }
}

/* ===========================================
   SIDEBAR MOBILE — TEKST 12px + H3 POGRUBIONE
   =========================================== */
@media (max-width: 1024px) {

  /* usuwamy białe prostokątne boxy */
  .sidebar-left,
  .sidebar-left-clone,
  .sidebar-right {
    background: none !important;
    box-shadow: none !important;
    border-radius: 0 !important;
    padding: 0 !important;
    width: 100% !important;
    margin: 0 auto !important;
  }

  /* linki – 12px */
  .sidebar-left ul li a,
  .sidebar-left-clone ul li a,
  .sidebar-right ul li a {
    background: transparent !important;
    border: none !important;
    border-bottom: 1px solid #eee !important;
    padding: 10px 8px !important;
    font-size: 12px !important;   /* TU 12px */
    color: #000 !important;
    border-radius: 0 !important;
    font-weight: 400 !important;
  }

  /* nagłówki sekcji – 14px + pogrubienie */
  .sidebar-left h3,
  .sidebar-left-clone h3,
  .sidebar-right h3 {
    background: transparent !important;
    color: #E6007D !important;
    padding: 10px 8px !important;
    margin-top: 14px !important;
    margin-bottom: 5px !important;
    font-size: 14px !important;   /* 14px */
    font-weight: 700 !important;  /* POGRUBIONE */
    position: relative;
  }

  /* pionowa różowa kreska */
  .sidebar-left h3::before,
  .sidebar-left-clone h3::before,
  .sidebar-right h3::before {
    content: "";
    position: absolute;
    left: 0;
    top: 10px;
    width: 4px;
    height: 70%;
    background: #E6007D;
    border-radius: 5px;
  }

  /* aktywny link – też 12px */
  .sidebar-left ul li.current-menu-item a,
  .sidebar-left-clone ul li.current-menu-item a,
  .sidebar-right ul li.current-menu-item a {
    background: #fdf0f7 !important;
    color: #E6007D !important;
    font-weight: 700 !important;
    position: relative;
    font-size: 12px !important;   /* TU 12px */
  }

  .sidebar-left ul li.current-menu-item a::before,
  .sidebar-left-clone ul li.current-menu-item a::before,
  .sidebar-right ul li.current-menu-item a::before {
    content: "";
    position: absolute;
    left: 0;
    top: 0;
    width: 4px;
    height: 100%;
    background: #E6007D;
  }
}

/* Zwężenie sidebaru */
@media (max-width: 1024px) {
  body .page-container > .sidebar-left,
  body .page-container > .sidebar-left-clone,
  body .page-container > .sidebar-right,
  body aside.sidebar-left,
  body aside.sidebar-left-clone,
  body aside.sidebar-right {
    width: 100% !important;
    max-width: 100% !important;
    margin-left: auto !important;
    margin-right: auto !important;
  }
}

/* ===========================================
 SIDEBAR MOBILE 
   =========================================== */
@media (max-width: 1024px) {

  /* Główny box sidebaru */
  aside.sidebar-right {
    background: #fff !important;
    border-radius: 8px !important;
    box-shadow: 0 0 12px rgba(0,0,0,0.07) !important;
    padding: 18px 18px 22px 18px !important;
    margin: 20px auto !important;
    width: 90% !important;              /* lepsze wyrównanie niż 100% */
    max-width: 90% !important;
  }

  /* Sekcja */
  .sidebar-right .sidebar-section {
    margin-bottom: 28px !important;      /* większy odstęp między sekcjami */
  }

  /* Nagłówki sekcji */
  .sidebar-right .sidebar-section h3 {
    font-size: 13px !important;
    font-weight: 700 !important;
    color: #E6007D !important;
    text-transform: uppercase;
    margin: 0 0 14px 0 !important;
    padding-left: 14px !important;
    position: relative;
  }

  /* pionowa różowa kreska */
  .sidebar-right .sidebar-section h3::before {
    content: "";
    position: absolute;
    left: 0;
    top: 3px;
    width: 3px;
    height: 18px;
    background: #E6007D;
    border-radius: 3px;
  }

  /* odstępy w treści */
  .sidebar-right p {
    margin: 0 0 10px 0 !important;
    line-height: 1.6 !important;
    font-size: 14px !important;
  }

  /* aby e-mail i telefony były czytelniejsze */
  .sidebar-right a {
    color: #111 !important;
    font-weight: 500 !important;
    text-decoration: none !important;
  }

  .sidebar-right a:hover {
    color: #E6007D !important;
  }
}

/* ===========================================
   MENU MOBILNE
   =========================================== */
@media (max-width: 1024px) {

  /* HAMBURGER */
  .chwp-mobile-hamburger-wrapper {
    position: absolute;
    right: 18px;
    top: 20px;
    z-index: 99999;
  }

  .chwp-mobile-hamburger {
    background: none;
    border: none;
    font-size: 60px;
    font-weight: 700;
    color: #111;
    cursor: pointer;
    padding: 4px 8px;
    line-height: 1;
  }

  .chwp-mobile-hamburger:active,
  .chwp-mobile-hamburger:hover {
    color: #E6007D;
  }

  /* OVERLAY — pełny ekran */
  .chwp-mobile-overlay {
    position: fixed;
    top: 0; left: 0;
    width: 100%; height: 100%;
    background: #fff;
    z-index: 99998;
    opacity: 0;
    pointer-events: none;
    overflow-y: auto;
    transition: opacity .25s ease;
  }

  .chwp-mobile-overlay.open {
    opacity: 1;
    pointer-events: auto;
  }

  /* PANELE */
  .chwp-mobile-panel {
    display: none;
    padding-top: 90px;
    min-height: 100vh;

    /* animacja slide-in */
    transform: translateX(100%);
    transition: transform .35s ease;
  }

  .chwp-mobile-panel.active {
    display: block;
    transform: translateX(0);
  }

  /* TOPBAR — MENU / USŁUGI */
  .chwp-mobile-topbar {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 90px;

    background: #E6007D;
    color: #fff;

    display: flex;
    align-items: center;
    justify-content: space-between;

    padding: 0 18px;
    z-index: 999999;
  }

  .mobile-menu-title {
    font-size: 17px;
    font-weight: 700;
    margin: 0 auto;
    text-align: center;
  }

  .mobile-menu-close,
  .mobile-back {
    font-size: 0px;
    cursor: pointer;
    font-weight: 700;
    padding: 4px 6px;
    user-select: none;
  }

  .mobile-menu-close:hover,
  .mobile-back:hover {
    color: #fff;
    opacity: 0.7;
  }

  /* LISTA GŁÓWNA */
  .chwp-mobile-list {
    list-style: none;
    margin: 0;
    padding: 0;
  }

  .chwp-mobile-list li {
    display: flex;
    justify-content: space-between;
    align-items: center;
    border-bottom: 1px solid #eee;
  }

  .chwp-mobile-list a {
    display: block;
    padding: 16px 18px;
    width: 100%;
    text-decoration: none;
    color: #111;
    font-size: 16px;
  }

  .chwp-mobile-list a:hover {
    color: #E6007D;
  }

  /* PRZYCISK ROZWINIĘCIA USŁUG */
  .submenu-open {
    background: none;
    border: none;
    font-size: 26px;
    padding: 12px 12px;
    cursor: pointer;
    color: #111;
  }

  .submenu-open:hover {
    color: #E6007D;
  }

  /* PANEL USŁUG — ZAWARTOŚĆ */
  .mobile-submenu-content {
    padding: 20px 22px;
  }

  .mobile-submenu-content h3 {
    font-size: 17px;
    font-weight: 700;
    color: #E6007D;
    margin: 18px 0 8px;
  }

  .mobile-submenu-content ul {
    list-style: none;
    margin: 0;
    padding: 0;
  }

  .mobile-submenu-content li a {
    display: block;
    padding: 12px 0;
    border-bottom: 1px solid #eee;
    text-decoration: none;
    color: #111;
    font-size: 15px;
  }

  .mobile-submenu-content li a:hover {
    color: #E6007D;
  }
}
@media (max-width: 1024px) {

  .chwp-mobile-hamburger {
    font-size: 40px;
    font-weight: 700;
    color: #E6007D;
    transition: transform .3s ease, color .3s ease;
  }

  /* Zmiana ikony po otwarciu menu */
  .chwp-mobile-hamburger.active {
    transform: rotate(90deg);
    color: #111;
  }

  /* Zamieniamy znak na krzyżyk */
  .chwp-mobile-hamburger.active::before {
    content: "✕";
    font-size: 42px;
    font-weight: 700;
  }

  /* Ukrywamy oryginalny znak ☰ gdy active */
  .chwp-mobile-hamburger.active {
    font-size: 0; /* ukryj znak ☰ */
  }

  .chwp-mobile-hamburger.active::before {
    font-size: 42px;
    color: #FFFFFF;
  }
}
.mobile-menu-close {
  position: relative;
  z-index: 9999999;
  cursor: pointer;
}

@media (max-width: 1024px) {
  .chwp-mobile-hamburger-wrapper {
      top: 40px !important; 
  }
}

.mobile-back {
    font-size: 40px !important;
    color: #FFFFFF !important;
    font-weight: 700 !important;
}
.mobile-back:hover {
    opacity: 0.7;
}
@media (max-width: 1024px) {
    .chwp-mobile-topbar .mobile-back {
        margin-top: 30px !important;  
    }
}

/* ===========================================
UKRYCIE MENU NA PC
   =========================================== */
/* ukrycie mobilnych elementów na desktopie */
@media (min-width: 1025px) {
    .chwp-mobile-hamburger-wrapper,
    #chwpMobileMenu,
    .mobile-header,
    .mobile-menu {
        display: none !important;
        visibility: hidden !important;
        opacity: 0 !important;
        height: 0 !important;
        width: 0 !important;
        pointer-events: none !important;
    }
}
/* ===========================================
UKRYCIE SIDEBARU
   =========================================== */
@media (max-width: 1024px) {
  aside.sidebar-right:not(.sidebar-left-clone) {
    display: none !important;
  }
}

/* ===========================================
LEWY SIDEBAR NA DÓŁ STRONY
   =========================================== */
@media (max-width: 767px) {

  .content-area,
  .site-main,
  .page-layout {
    display: flex;
    flex-direction: column;
  }

  aside.sidebar-left-clone {
    order: 99;          /* zawsze na sam dół */
    width: 100%;
    margin-top: 40px;
  }
}

/* ===========================================
Linki na telefonie
   =========================================== */
@media (max-width: 768px) {
  .sidebar-left-clone a[aria-current="page"] {
    color: #e6007d !important;
    font-weight: 600 !important;
    opacity: 1 !important;
    filter: none !important;
  }
}

/* ===========================================
menu uslugi 
   =========================================== */

/* Nagłówki sekcji – klikane */
.mobile-submenu-content h3 {
  position: relative;
  margin: 16px 0 6px;
  padding-right: 24px;
  font-size: 14px;
  font-weight: 600;
  cursor: pointer;
  color: rgba(0,0,0,0.75);
}

/* Chevron CSS */
.mobile-submenu-content h3::after {
  content: "";
  position: absolute;
  right: 0;
  top: 50%;
  width: 8px;
  height: 8px;
  border-right: 2px solid rgba(0,0,0,0.6);
  border-bottom: 2px solid rgba(0,0,0,0.6);
  transform: translateY(-50%) rotate(45deg);
  transition: transform 0.25s ease;
}

/* Obrót po otwarciu */
.mobile-submenu-content h3.active::after {
  transform: translateY(-50%) rotate(-135deg);
}
/* Wszystkie linki pod nagłówkami ukryte */
.panel-services .mobile-submenu-content li {
  display: none;
}

.mobile-submenu-content a.is-active {
  color: #e6007d;
  font-weight: 600;
  background: none;
}