/* ============================================
   HEADER STYLES
   ============================================ */

/* Header – opóźniony fade-in po reveal hero (strony z hero-clip-reveal) */
#header.header-fade-in {
    opacity: 0;
    transition: opacity 0.5s ease;
}
#header.header-fade-in.header-visible {
    opacity: 1;
}

/* Base header styles */
#header {
    box-sizing: border-box;
    position: sticky;
    top: 0;
    width: 100%;
    z-index: 1000;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    padding: 1.6rem 0;
    height: 9.4rem;
    transition: background-color 0.3s ease;
  }
  
  /* Header with background */
  #header.header-with-bg {
    background-color: var(--neutral-100);
  }
  
  /* Header without background (transparent) */
  #header.header-transparent {
    background-color: transparent;
  }

  /* Gdy mega menu rozwinięte – header jak na stronie kontakt (tło + kolorowe logo) */
  #header.header-mega-open {
    background-color: var(--neutral-100);
    transition: background-color 0.3s ease;
  }
  #header.header-mega-open .header-nav a {
    color: var(--neutral-500);
  }
  #header.header-mega-open .logo-white {
    filter: none;
  }
  #header.header-mega-open .dropdown-arrow {
    color: var(--neutral-500);
  }
  #header.header-mega-open .hamburger-menu-icon::before,
  #header.header-mega-open .hamburger-menu-icon::after,
  #header.header-mega-open .hamburger-menu-icon span {
    background-color: var(--neutral-900);
  }

  /* Gdy scroll – header dopięty u góry ze stylem jak kontakt */
  #header.header-scrolled {
    background-color: var(--neutral-100);
  }
  #header.header-scrolled .header-nav a {
    color: var(--neutral-500);
  }
  #header.header-scrolled .logo-white {
    filter: none;
  }
  #header.header-scrolled .dropdown-arrow {
    color: var(--neutral-500);
  }
  #header.header-scrolled .hamburger-menu-icon::before,
  #header.header-scrolled .hamburger-menu-icon::after,
  #header.header-scrolled .hamburger-menu-icon span {
    background-color: var(--neutral-900);
  }
  /* Mobile: header-scrolled musi nadpisać header-transparent (wyższa specyficzność) */
  #header.header-transparent.header-scrolled .hamburger-menu-icon::before,
  #header.header-transparent.header-scrolled .hamburger-menu-icon::after,
  #header.header-transparent.header-scrolled .hamburger-menu-icon span {
    background-color: var(--neutral-900);
  }
  
  
  /* ============================================
     LOGO STYLES
     ============================================ */
  
  .header-logo {
    display: flex;
    flex-direction: row;
    align-items: center;
    padding: 0;
    gap: 1rem;
    margin: 0;
    flex: none;
    order: 0;
    flex-grow: 0;
  }
  
  .header-logo a {
    display: block;
    text-decoration: none;
  }
  
  .header-logo img {
    height: auto;
    max-width: 100%;
    flex: none;
    order: 0;
    flex-grow: 0;
    max-height: 40px;
  }

  /* Show desktop logo, hide mobile sygnet on desktop */
  .header-logo .logo-desktop {
    display: block;
  }

  .header-logo .logo-mobile {
    display: none;
  }
  
  /* White logo for transparent header (homepage) */
  .header-logo .logo-white {
    filter: brightness(0) invert(1);
  }
  
  /* Colored logo for header with background */
  .header-logo .logo-colored {
    filter: none;
  }
  
  /* ============================================
     NAVIGATION MENU STYLES
     ============================================ */
  
  .header-nav {
    display: flex;
    flex-direction: row;
    justify-content: center;
    align-items: center;
    padding: 0;
    gap: 2.4rem;
    margin: 0 auto;
    width: 51.4rem;
    height: 2rem;
    flex: none;
    order: 1;
    flex-grow: 0;
  }
  
  .header-nav ul {
    display: flex;
    flex-direction: row;
    justify-content: center;
    align-items: center;
    gap: 2.4rem;
    list-style: none;
    margin: 0;
    padding: 0;
    width: 100%;
    height: 100%;
  }
  
  .header-nav li {
    margin: 0;
    padding: 0;
    flex: none;
    flex-grow: 0;
  }
  
  .header-nav a {
    text-decoration: none;
    color: var(--main-100);
    transition: color 0.3s ease;
    flex: none;
    flex-grow: 0;
  }
  
  /* Apply menu-link typography - use class from global styles */
  .header-nav a {
    font-family: var(--font-family-gibson);
    font-style: normal;
    font-weight: 400; /* Regular - matching .menu-link from style.css */
    font-size: 2rem;
    line-height: 100%;
    letter-spacing: 0.005em;
    font-feature-settings: 'kern' off;
  }
  
  /* Menu links on header with background */
  #header.header-with-bg .header-nav a {
    color: var(--neutral-500);
  }
  
  /* Menu link hover - higher specificity to override default colors */
  #header .header-nav a:hover,
  #header.header-with-bg .header-nav a:hover,
  #header.header-transparent .header-nav a:hover {
    color: var(--main-500);
  }
  
  /* Active menu item */
  #header .header-nav .current-menu-item > a,
  #header .header-nav .current_page_item > a {
    color: var(--main-500);
  }
  
  /* ============================================
     DROPDOWN MENU STYLES
     ============================================ */
  
  .menu-item-has-children {
    position: relative;
  }
  
  .menu-item-has-children > a {
    display: flex;
    flex-direction: row;
    align-items: center;
    gap: 0.6rem;
    flex: none;
    flex-grow: 0;
  }
  
  /* Dropdown arrow container */
  .menu-item-has-children > a > span:last-child {
    display: flex;
    flex-direction: row;
    align-items: center;
    gap: 0.6rem;
    flex: none;
    flex-grow: 0;
  }
  
  /* Dropdown arrow icon */
  .dropdown-arrow {
    width: 1rem;
    height: 1rem;
    display: inline-block;
    position: relative;
    transition: color 0.3s ease;
    flex-shrink: 0;
    flex: none;
    order: 1;
    flex-grow: 0;
  }
  
  .dropdown-arrow::after {
    content: '';
    position: absolute;
    top: 0;
    left: 8px;
    width: 0;
    height: 0;
    border-left: 0.5rem solid transparent;
    border-right: 0.5rem solid transparent;
    border-top: 0.5rem solid currentColor;
  }
  
  /* Dropdown arrow on header with background */
  #header.header-with-bg .dropdown-arrow {
    color: var(--neutral-500);
  }
  
  /* Dropdown arrow on header without background */
  #header.header-transparent .dropdown-arrow {
    color: var(--neutral-100);
  }
  
  /* Dropdown arrow when active/hovered - higher specificity */
  #header .menu-item-has-children:hover > a,
  #header .menu-item-has-children.current-menu-item > a,
  #header.header-with-bg .menu-item-has-children:hover > a,
  #header.header-transparent .menu-item-has-children:hover > a {
    color: var(--main-500);
  }
  
  #header .menu-item-has-children:hover > a .dropdown-arrow,
  #header .menu-item-has-children.current-menu-item > a .dropdown-arrow,
  #header .menu-item-has-mega:hover > .mega-menu-trigger-wrapper > a .dropdown-arrow {
    color: var(--main-500);
  }

  /* ============================================
     MEGA MENU USŁUGI
     ============================================ */

  .menu-item-has-mega {
    position: static;
  }

  /* Ukryj domyślny sub-menu WordPress – używamy mega menu */
  #header .menu-item-has-mega > .sub-menu {
    display: none;
  }

  .mega-menu-trigger-wrapper {
    position: relative;
    display: inline-block;
  }

  .services-mega-menu {
    position: fixed;
    left: 0;
    right: 0;
    top: 9.4rem;
    margin-top: 0;
    width: 100%;
    z-index: 1001;
    padding: 2.4rem 0 3.2rem;
    background: var(--neutral-150);
    box-sizing: border-box;
    /* Smooth fade-in/out + delay before hiding */
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
    transition: opacity 0.35s ease, visibility 0.35s ease;
    transition-delay: 0s;
  }

  /* Mostek – niewidoczny obszar między linkiem a menu (bez przerwy) */
  .services-mega-menu::before {
    content: '';
    position: absolute;
    bottom: 100%;
    left: 0;
    right: 0;
    height: 2rem;
    background: transparent;
  }

  .menu-item-has-mega.is-mega-visible .services-mega-menu,
  .menu-item-has-mega:hover .services-mega-menu,
  .menu-item-has-mega .mega-menu-trigger-wrapper:hover .services-mega-menu {
    opacity: 1;
    visibility: visible;
    pointer-events: auto;
  }

  .services-mega-menu__frame-outer {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    width: 100%;
    max-width: 144rem;
    margin: 0 auto;
    padding: 0 2%;
  }

  .services-mega-menu__frame-inner {
    display: flex;
    flex-direction: row;
    align-items: flex-start;
    width: 100%;
    gap: 1.6rem;
  }

  /* Lewa kolumna – usługi main */
  .services-mega-menu__main-col {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    width: 23.2rem;
    min-width: 23.2rem;
    flex-shrink: 0;
  }

  /* Usługi main – capitalize (Wielka litera), kolory nadpisują style header-nav */
  .services-mega-menu .services-mega-menu__main-item {
    display: flex;
    flex-direction: row;
    align-items: center;
    padding: 0.8rem;
    width: 100%;
    min-height: 7.3rem;
    box-sizing: border-box;
    text-decoration: none;
    color: #67666B;
    font-family: var(--font-family-gibson);
    font-size: 2.3rem;
    line-height: 140%;
    font-feature-settings: 'kern' off;
    text-transform: capitalize;
    background: var(--neutral-150);
    border-radius: 0;
    transition: color 0.2s ease, background 0.2s ease;
  }

  .services-mega-menu .services-mega-menu__main-item:hover {
    background: var(--neutral-100);
    border-radius: 0.8rem;
    color: #85244E;
  }

  /* Środkowa + prawa kolumna */
  .services-mega-menu__content-col {
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    align-items: flex-start;
    padding: 2.4rem;
    gap: 1.6rem;
    flex: 1;
    min-width: 0;
    background: var(--neutral-100);
    border-radius: 0.8rem;
    margin-left: 0;
  }

  /* Lista subusług */
  .services-mega-menu__sub-col {
    flex: 1;
    min-width: 0;
  }

  .services-mega-menu__sub-list {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 1.6rem;
    max-width: 48.4rem;
  }

  /* Placeholder i subusługi – normalny font (bez uppercase), kolory nadpisują style header-nav */
  .services-mega-menu .services-mega-menu__sub-placeholder {
    color: #98979B;
    font-family: var(--font-family-gibson);
    font-size: 2.3rem;
    line-height: 140%;
    text-transform: none;
    margin: 0;
  }

  .services-mega-menu .services-mega-menu__sub-item {
    display: flex;
    flex-direction: row;
    justify-content: flex-start;
    align-items: center;
    gap: 0.4rem;
    text-decoration: none;
    color: #98979B;
    font-family: var(--font-family-gibson);
    font-size: 2.3rem;
    line-height: 140%;
    font-feature-settings: 'kern' off;
    text-transform: none;
    transition: color 0.2s ease;
  }

  .services-mega-menu .services-mega-menu__sub-item:hover {
    color: #85244E;
  }

  /* Strzałka tylko na hover – arrow.svg z assets, płynne pojawianie */
  .services-mega-menu .services-mega-menu__sub-item::after {
    content: '';
    display: inline-block;
    width: 3.2rem;
    height: 3.2rem;
    flex-shrink: 0;
    margin-left: 0.4rem;
    background: url('../assets/arrow.svg') no-repeat center;
    background-size: contain;
    opacity: 0;
    transform: translateX(-0.4rem);
    transition: opacity 0.25s ease, transform 0.25s ease;
  }

  .services-mega-menu .services-mega-menu__sub-item:hover::after {
    opacity: 1;
    transform: translateX(0);
  }

  /* Zdjęcie wyróżniające */
  .services-mega-menu__img-col {
    flex-shrink: 0;
    width: 51rem;
    max-width: 51rem;
  }

  .services-mega-menu__img-inner {
    width: 100%;
    height: 46.4rem;
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    border-radius: 0.8rem;
  }

  /* Ukryj mega menu na mobile */
  @media (max-width: 1024px) {
    .services-mega-menu {
      display: none;
    }
  }
  
  /* ============================================
     CTA BUTTON STYLES
     ============================================ */
  
  .header-cta {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    padding: 0;
    gap: 1rem;
    margin: 0;
    flex: none;
    order: 2;
    flex-grow: 0;
  }
  
  .header-cta > div {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: flex-end;
    padding: 0;
    gap: 1rem;
    flex: none;
    order: 0;
    align-self: stretch;
    flex-grow: 0;
  }
  
  
  /* ============================================
     HAMBURGER MENU (MOBILE)
     ============================================ */
  
  .hamburger-menu {
    display: none;
    flex-direction: row;
    align-items: center;
    padding: 0;
    gap: 1rem;
    width: 4.8rem;
    height: 4.8rem;
    background: transparent;
    border: none;
    cursor: pointer;
    position: relative;
  }
  
  .hamburger-menu-icon {
    position: absolute;
    width: 3.2rem;
    height: 2.4rem;
    left: calc(50% - 3.2rem / 2);
    top: calc(50% - 2.4rem / 2);
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    transition: all 0.3s ease;
  }
  
  .hamburger-menu-icon::before,
  .hamburger-menu-icon::after,
  .hamburger-menu-icon span {
    content: '';
    display: block;
    width: 100%;
    height: 1.5px;
    background-color: var(--neutral-900);
    transition: all 0.3s ease;
  }
  
  .hamburger-menu-icon span {
    display: block;
  }
  
  /* Hamburger icon on header with background */
  #header.header-with-bg .hamburger-menu-icon::before,
  #header.header-with-bg .hamburger-menu-icon::after,
  #header.header-with-bg .hamburger-menu-icon span {
    background-color: var(--neutral-900);
  }
  
  /* Hamburger icon on header without background */
  #header.header-transparent .hamburger-menu-icon::before,
  #header.header-transparent .hamburger-menu-icon::after,
  #header.header-transparent .hamburger-menu-icon span {
    background-color: var(--neutral-100);
  }
  
  /* Hamburger icon when active (X shape) */
  .hamburger-menu.active .hamburger-menu-icon {
    width: 2.7rem;
    left: calc(50% - 2.7rem / 2 - 0.05rem);
  }
  
  .hamburger-menu.active .hamburger-menu-icon::before {
    transform: rotate(45deg) translate(0.8rem, 0.8rem);
  }
  
  .hamburger-menu.active .hamburger-menu-icon::after {
    transform: rotate(-45deg) translate(0.8rem, -0.8rem);
  }
  
  .hamburger-menu.active .hamburger-menu-icon span {
    opacity: 0;
  }
  
  /* ============================================
     MOBILE STYLES
     ============================================ */
  
  @media (max-width: 1024px) {
    /* Header container mobile */
    .header-container {
      height: 8.8rem;
    }
  
  
    /* Logo mobile styles */
    .header-logo {
      margin: 0;
      justify-content: flex-start;
    }

    /* Show mobile sygnet, hide desktop logo on mobile */
    .header-logo .logo-desktop {
      display: none;
    }

    .header-logo .logo-mobile {
      display: block;
    }

    .header-logo img {
      height: auto;
      max-width: 100%;
      flex: none;
      order: 0;
      flex-grow: 0;
      max-height: 40px;
      width: fit-content;
    }

    /* Hide desktop navigation */
    .header-nav {
      display: none;
    }

    /* Show hamburger menu */
    .hamburger-menu {
      display: flex;
    }

    /* Hide CTA button on mobile */
    .header-cta {
      display: none;
    }
  
    /* Mobile Menu */
    .mobile-menu {
      display: none;
      position: absolute;
      top: 100%;
      left: 0;
      right: 0;
      background-color: var(--neutral-100);
      padding: 2rem;
      box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
    }
  
    .mobile-menu-list {
      list-style: none;
      margin: 0;
      padding: 0;
    }
  
    .mobile-menu-list li {
      margin: 0 0 1.5rem 0;
      padding: 0;
    }
  
    .mobile-menu-list a {
      text-decoration: none;
      color: var(--neutral-500);
      display: flex;
      align-items: center;
      gap: 0.6rem;
    }
    
    /* Apply menu-link typography from global styles */
    .mobile-menu-list a {
      font-family: var(--font-family-gibson);
      font-style: normal;
      font-weight: 400; /* Regular - matching .menu-link from style.css */
      font-size: 2rem;
      line-height: 100%;
      letter-spacing: 0.005em;
      text-transform: uppercase;
      font-feature-settings: 'kern' off;
    }
  
    .mobile-menu-list .menu-item-has-children > a {
      justify-content: space-between;
    }
  
    .mobile-menu-list .sub-menu {
      list-style: none;
      margin: 1rem 0 0 0;
      padding: 0 0 0 2rem;
    }
  
    .mobile-menu-list .sub-menu li {
      margin: 0 0 1rem 0;
    }

    /* Ukryj domyślny sub-menu USŁUGI – używamy własnego mobile-services-menu */
    .mobile-menu-list .menu-item-has-mega > .sub-menu,
    .mobile-menu-list .menu-item-uslugi > .sub-menu {
      display: none;
    }

    /* USŁUGI rozszerzone – podświetlenie + strzałka w górę */
    .mobile-menu-list li.is-expanded > a {
      color: #85244E;
    }
    .mobile-menu-list li.is-expanded .dropdown-arrow {
      color: #85244E;
      transform: rotate(180deg);
    }

    /* Moduł usług wewnątrz pozycji USŁUGI – odstęp od linku */
    .mobile-menu-list li #mobile-services-menu {
      margin-top: 0.8rem;
    }

    /* CTA Button in Mobile Menu */
    .mobile-menu-cta {
      margin-top: 2rem;
      padding-top: 2rem;
      border-top: 1px solid var(--neutral-200);
      width: 100%;
    }

    .mobile-menu-cta .btn {
      width: 100%;
    }

    /* ============================================
       MOBILE SERVICES MENU (ekran main + sub)
       ============================================ */
    .mobile-services-menu {
      display: none;
      flex-direction: column;
      padding: 1.6rem 0;
      gap: 1.6rem;
      width: 100%;
      max-width: 100%;
    }

    .mobile-services-menu:not([hidden]) {
      display: flex;
    }

    .mobile-services-screen-main,
    .mobile-services-screen-sub {
      display: flex;
      flex-direction: column;
      align-items: flex-start;
      width: 100%;
    }

    .mobile-services-screen-main[hidden],
    .mobile-services-screen-sub[hidden] {
      display: none;
    }

    /* Ekran 1: Header USŁUGI + strzałka w górę (powrót) – ukryty */
    .mobile-services-main-header {
      display: none;
      flex-direction: row;
      justify-content: space-between;
      align-items: center;
      padding: 1.6rem 0 0.8rem;
      width: 100%;
      gap: 0.6rem;
    }

    .mobile-services-back-btn {
      display: flex;
      align-items: center;
      justify-content: center;
      padding: 0;
      width: 2.4rem;
      height: 2.4rem;
      background: none;
      border: none;
      cursor: pointer;
      color: #85244E;
    }

    .mobile-services-main-title {
      font-family: var(--font-family-gibson);
      font-size: 2rem;
      line-height: 100%;
      letter-spacing: 0.005em;
      text-transform: uppercase;
      color: #85244E;
    }

    /* Lista usług main */
    .mobile-services-main-list {
      display: flex;
      flex-direction: column;
      align-items: flex-start;
      padding: 0;
      gap: 0;
      width: 100%;
      border-radius: 0.4rem;
      overflow: hidden;
    }

    .mobile-services-main-item {
      display: flex;
      flex-direction: row;
      justify-content: space-between;
      align-items: center;
      padding: 0.8rem 0.4rem 0.8rem 0.8rem;
      width: 100%;
      min-height: 4.1rem;
      box-sizing: border-box;
      text-decoration: none;
      color: #67666B;
      font-family: var(--font-family-gibson);
      font-size: 1.8rem;
      line-height: 140%;
      font-feature-settings: 'kern' off;
      text-transform: capitalize;
      background: #F0F0F1;
      transition: color 0.2s ease;
    }

    .mobile-services-main-item:hover {
      color: #85244E;
    }

    /* Strzałki na mobile – mobile-arrow.svg */
    .mobile-services-chevron {
      display: inline-block;
      width: 0.8rem;
      height: 1.6rem;
      background-color: #4E4E51;
      mask: url(../assets/mobile-arrow.svg) no-repeat center;
      mask-size: contain;
      -webkit-mask: url(../assets/mobile-arrow.svg) no-repeat center;
      -webkit-mask-size: contain;
      border: 1px solid #85244e;
      padding: 0.8rem;
    }

    .mobile-services-chevron-right {
      transform: rotate(0deg);
    }

    .mobile-services-chevron-left {
      transform: rotate(180deg);
    }

    .mobile-services-chevron-up {
      transform: rotate(-90deg);
      background-color: #85244E;
    }

    /* Ekran 2: Header z powrotem + tytuł kategorii */
    .mobile-services-sub-header {
      display: flex;
      flex-direction: row;
      justify-content: space-between;
      align-items: center;
      padding: 0;
      width: 100%;
      min-height: 2.7rem;
      background: #F9F9F9;
      border-radius: 1.2rem 0 0 1.2rem;
    }

    .mobile-services-sub-header .mobile-services-back-btn {
      color: #4E4E51;
    }

    .mobile-services-sub-title {
      font-family: var(--font-family-gibson);
      font-size: 2rem;
      line-height: 135%;
      text-align: center;
      font-feature-settings: 'kern' off;
      color: #85244E;
      flex-grow: 1;
      text-transform: uppercase;
    }

    .mobile-services-spacer {
      width: 2.4rem;
      flex-shrink: 0;
    }

    /* Lista subusług */
    .mobile-services-sub-list {
      display: flex;
      flex-direction: column;
      align-items: flex-start;
      padding: 0;
      width: 100%;
      padding-top: 2.4rem;
    }

    .mobile-services-sub-item {
      display: flex;
      flex-direction: row;
      align-items: flex-end;
      padding: 0.8rem 0;
      width: 100%;
      min-height: 4.1rem;
      box-sizing: border-box;
      text-decoration: none;
      color: #98979B;
      font-family: var(--font-family-gibson);
      font-size: 1.8rem;
      line-height: 140%;
      font-feature-settings: 'kern' off;
      text-transform: none;
      transition: color 0.2s ease;
    }

    .mobile-services-sub-item:hover {
      color: #85244E;
    }

    div#mobile-services-sub-list a {
      text-transform: none;
      color: var(--neutral-400);
    }
  }

/* ============================================
   FOOTER STYLES
   ============================================ */

.site-footer {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  padding: 9.6rem 0 0;
  width: 100%;
  background: #F0F0F1;
}

.footer-container {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  padding: 0 2%;
  gap: 9.6rem;
  width: 100%;
  max-width: 144rem;
  margin: 0 auto;
  box-sizing: border-box;
}

.footer-top {
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  align-items: flex-start;
  padding: 0 0 2.4rem;
  width: 100%;
}

.footer-cta {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: flex-start;
  padding: 0;
  gap: 3.2rem;
  max-width: 82.7rem;
}

.footer-cta-content {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  padding: 0;
  gap: 0.8rem;
}

.footer-cta-title {
  font-family: var(--font-family-gibson), sans-serif;
  font-style: normal;
  font-weight: 400;
  font-size: 4.4rem;
  line-height: 116%;
  letter-spacing: -0.015em;
  font-feature-settings: 'kern' off;
  color: #040404;
  margin: 0;
}

.footer-cta-text {
  font-family: var(--font-family-gibson), sans-serif;
  font-style: normal;
  font-weight: 400;
  font-size: 2.3rem;
  line-height: 140%;
  font-feature-settings: 'kern' off;
  color: #3A393C;
  margin: 0;
  max-width: 80%;
}

.footer-cta-buttons {
  display: flex;
  flex-direction: row;
  align-items: flex-start;
  padding: 0;
  gap: 2rem;
}

.footer-cta-buttons .btn {
  padding: 3.2rem;
}

.footer-cta-buttons .btn-secondary {
  border-width: 2px;
  color: var(--main-500);
}

.footer-nav {
  display: flex;
  flex-direction: row;
  align-items: flex-start;
  padding: 0;
  gap: 4.8rem;
}

/* Desktop: footer-nav-left używa display: contents, dzieci mają order dla Info | Usługi | Noty prawne */
.footer-nav-left {
  display: contents;
}

.footer-nav-left .footer-nav-column:first-child {
  order: 1;
}

.footer-nav > .footer-nav-column {
  order: 2;
}

.footer-nav-left .footer-nav-column:last-child {
  order: 3;
}

.footer-nav-column {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  padding: 0;
  gap: 1.6rem;
}

.footer-nav-title {
  font-family: var(--font-family-gibson), sans-serif;
  font-style: normal;
  font-weight: 400;
  font-size: 2rem;
  line-height: 160%;
  font-feature-settings: 'kern' off;
  color: #212122;
}

.footer-nav-links {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  padding: 0;
  gap: 0.8rem;
}

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

.footer-menu-list li {
  margin: 0;
  padding: 0;
}

.footer-menu-list a {
  font-family: var(--font-family-gibson), sans-serif;
  font-style: normal;
  font-weight: 400;
  font-size: 1.8rem;
  line-height: 175%;
  color: #67666B;
  text-decoration: none;
  transition: color 0.3s ease;
}

.footer-menu-list a:hover {
  color: #85244E;
}

.footer-bottom {
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  align-items: center;
  padding: 3.2rem 0;
  gap: 0;
  width: 100%;
}

.footer-copyright,
.footer-credit {
  font-family: var(--font-family-gibson), sans-serif;
  font-style: normal;
  font-weight: 400;
  font-size: 1.8rem;
  line-height: 175%;
  color: #212122;
  margin: 0;
}

.footer-credit {
  text-align: right;
}

.footer-credit a {
  color: #85244E;
  text-decoration: none;
}

.footer-credit a:hover {
  text-decoration: underline;
}

/* ============================================
   FOOTER - MOBILE STYLES
   ============================================ */

@media (max-width: 1024px) {
  .site-footer {
    padding: 7.2rem 1.6rem 0;
  }

  .footer-container {
    gap: 5.6rem;
    padding: 0;
  }

  .footer-top {
    flex-direction: column;
    gap: 5.6rem;
    padding: 0;
  }

  .footer-cta {
    gap: 2.4rem;
    max-width: 100%;
  }

  .footer-cta-title {
    font-size: 3.4rem;
    line-height: 115%;
    letter-spacing: -0.023em;
  }

  .footer-cta-text {
    font-size: 2rem;
    line-height: 135%;
    max-width: 100%;
  }

  .footer-cta-buttons {
    flex-direction: column;
    gap: 1.6rem;
    width: 100%;
  }

  .footer-cta-buttons .btn {
    width: 100%;
    justify-content: center;
    padding: 2.4rem 3.2rem;
    font-size: 1.8rem;
    letter-spacing: 0.06em;
  }

  .footer-nav {
    flex-direction: row;
    flex-wrap: nowrap;
    gap: 2.4rem;
    width: 100%;
  }

  .footer-nav-left {
    display: flex;
    flex-direction: column;
    gap: 3.2rem;
    flex: 0 1 auto;
    min-width: 0;
    width: 50%;
  }

  .footer-nav-left .footer-nav-column {
    flex: none;
    order: unset;
  }

  .footer-nav > .footer-nav-column {
    order: unset;
  }

  .footer-nav > .footer-nav-column {
    width: 50%;
  }

  .footer-nav-column {
    gap: 2rem;
    flex: 0 1 auto;
    min-width: 0;
  }

  .footer-nav-title {
    font-size: 1.8rem;
    line-height: 140%;
  }

  .footer-menu-list a {
    font-size: 1.6rem;
    line-height: 150%;
  }

  .footer-bottom {
    flex-direction: column;
    justify-content: center;
    align-items: center;
    padding: 1.6rem 0;
    gap: 0.4rem;
  }

  .footer-copyright,
  .footer-credit {
    font-size: 1.6rem;
    line-height: 150%;
    text-align: center;
  }

  .footer-credit {
    text-align: center;
  }
}

/* ============================================
   FOOTER - TABLET (767px–1024px)
   ============================================ */

@media (min-width: 767px) and (max-width: 1024px) {
  .footer-cta-buttons {
    flex-direction: row;
    gap: 1.6rem;
    width: 100%;
  }
}