/* K&M Invest / HOME / wyłącznie ekrany mobilne. Desktop bez zmian. */
/* Duplikat CTA jest widoczny tylko na telefonach. */
body.home.km-site-page .km-home-project__mobile-cta { display: none; }

@media (max-width: 767px) {
  /* 1. Biały tekst na złotym CTA w rozwiniętym menu. */
  body.home.km-site-page .km-site-nav a.km-mobile-menu-cta,
  body.home.km-site-page .km-site-nav a.km-mobile-menu-cta span {
    color: #fff !important;
    -webkit-text-fill-color: #fff !important;
  }

  /* 2. Parametry inwestycji — równe 2 x 2 i 130 mieszkań w jednym wierszu. */
  body.home.km-site-page .km-facts {
    height: auto !important;
    min-height: 0 !important;
  }
  body.home.km-site-page .km-facts__inner {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    grid-auto-rows: minmax(105px, auto) !important;
    width: 100% !important;
    max-width: none !important;
    height: auto !important;
    gap: 0 !important;
    margin: 0 !important;
  }
  body.home.km-site-page .km-fact {
    position: relative !important;
    display: flex !important;
    flex-direction: column !important;
    justify-content: center !important;
    min-width: 0 !important;
    min-height: 105px !important;
    padding: 16px clamp(10px, 3.7vw, 19px) !important;
    border: 0 !important;
    border-right: 1px solid rgba(255,255,255,.42) !important;
    border-bottom: 1px solid rgba(255,255,255,.42) !important;
  }
  body.home.km-site-page .km-fact:nth-child(even) { border-right: 0 !important; }
  body.home.km-site-page .km-fact:nth-child(n+3) { border-bottom: 0 !important; }
  body.home.km-site-page .km-fact::after { display: none !important; }
  body.home.km-site-page .km-fact span {
    display: block !important;
    margin: 0 0 10px !important;
    font-size: clamp(11px, 3.15vw, 14px) !important;
    line-height: 1.22 !important;
    white-space: nowrap !important;
  }
  body.home.km-site-page .km-fact strong {
    display: block !important;
    margin: 0 !important;
    font-size: clamp(13px, 4.15vw, 21px) !important;
    line-height: 1.25 !important;
    letter-spacing: -.025em !important;
    white-space: nowrap !important;
    font-weight: 400 !important;
  }

  /* 3. Symfonia: znak w kole -> opis -> zdjęcie -> CTA. */
  body.home.km-site-page .km-home-project {
    display: flex !important;
    flex-direction: column !important;
    align-items: stretch !important;
    height: auto !important;
    min-height: 0 !important;
    padding: 49px 0 45px !important;
    overflow: visible !important;
  }
  body.home.km-site-page .km-home-project > .km-home-project__inner {
    display: flex !important;
    flex-direction: column !important;
    width: calc(100% - 32px) !important;
    height: auto !important;
    min-height: 0 !important;
    gap: 0 !important;
    margin: 0 auto !important;
  }
  body.home.km-site-page .km-home-project .km-home-project__badge-col {
    position: relative !important;
    inset: auto !important;
    width: 100% !important;
    max-width: none !important;
    height: auto !important;
    margin: 0 0 35px !important;
  }
  body.home.km-site-page .km-home-project .km-badge-square {
    width: clamp(145px, 43vw, 185px) !important;
    height: clamp(145px, 43vw, 185px) !important;
    border-radius: 50% !important;
    margin: 0 !important;
    padding: 0 !important;
    overflow: hidden !important;
  }
  body.home.km-site-page .km-home-project .km-badge-square img {
    display: block !important;
    width: 100% !important;
    height: 100% !important;
    object-fit: contain !important;
  }
  body.home.km-site-page .km-home-project .km-home-project__badge-col > .km-pill {
    display: none !important;
  }
  body.home.km-site-page .km-home-project .km-home-project__copy {
    position: relative !important;
    inset: auto !important;
    width: 100% !important;
    height: auto !important;
    margin: 0 !important;
    padding: 0 !important;
  }
  body.home.km-site-page .km-home-project .km-home-project__copy h2 {
    margin: 0 0 21px !important;
    font-size: clamp(30px, 8.1vw, 39px) !important;
    line-height: 1.2 !important;
  }
  body.home.km-site-page .km-home-project .km-home-project__copy h3 {
    font-size: clamp(19px, 5.1vw, 22px) !important;
    line-height: 1.45 !important;
  }
  body.home.km-site-page .km-home-project .km-home-project__copy p {
    font-size: 16px !important;
    line-height: 1.58 !important;
  }
  body.home.km-site-page .km-home-project .km-home-project__building {
    position: relative !important;
    inset: auto !important;
    align-self: flex-end !important;
    display: block !important;
    width: 100% !important;
    max-width: 100% !important;
    height: auto !important;
    margin: 18px 0 0 !important;
    object-fit: contain !important;
    object-position: right bottom !important;
  }
  body.home.km-site-page .km-home-project > .km-home-project__mobile-cta {
    position: relative !important;
    inset: auto !important;
    align-self: flex-start !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    width: min(300px, calc(100% - 32px)) !important;
    min-height: 54px !important;
    height: 54px !important;
    padding: 0 7px 0 25px !important;
    margin: 23px 16px 0 !important;
  }

  /* 4. Mniej przypadkowej bieli przed „Znajdź swoje miejsce”. */
  body.home.km-site-page .km-home-intro {
    height: auto !important;
    min-height: 0 !important;
    padding-top: 50px !important;
    padding-bottom: 30px !important;
  }
  body.home.km-site-page .km-home-intro__inner {
    height: auto !important;
    gap: 27px !important;
  }
  body.home.km-site-page .km-building-picker {
    padding-top: 40px !important;
    padding-bottom: 55px !important;
  }
  body.home.km-site-page .km-building-picker__media {
    margin-top: 27px !important;
  }

  /* 5. Dwa linki obok siebie; własny SVG zamiast iOS-owego emoji. */
  body.home.km-site-page .km-building-picker__mobile-links {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 10px !important;
    margin-top: 17px !important;
  }
  body.home.km-site-page .km-building-picker__mobile-links a {
    display: flex !important;
    min-width: 0 !important;
    min-height: 51px !important;
    gap: 5px !important;
    padding: 10px 12px !important;
    font-size: clamp(11px, 3.1vw, 14px) !important;
    line-height: 1.12 !important;
    white-space: nowrap !important;
  }
  body.home.km-site-page .km-building-picker__mobile-links a span {
    display: block !important;
    width: 17px !important;
    height: 17px !important;
    flex: 0 0 17px !important;
    font-size: 0 !important;
    line-height: 0 !important;
    color: transparent !important;
    background: center/contain no-repeat url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 18 18' fill='none'%3E%3Cpath d='M3 15L15 3M6 3h9v9' stroke='%236A4533' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") !important;
  }

  /* 6. Złota sekcja: logo bliżej tekstu, mniej pustego miejsca. */
  body.home.km-site-page .km-experience {
    height: auto !important;
    min-height: 0 !important;
    padding: 52px 0 56px !important;
  }
  body.home.km-site-page .km-experience__inner {
    position: relative !important;
    display: flex !important;
    flex-direction: column !important;
    width: calc(100% - 32px) !important;
    height: auto !important;
    min-height: 0 !important;
    gap: 29px !important;
    padding: 0 !important;
    margin: 0 auto !important;
  }
  body.home.km-site-page .km-experience__mark {
    position: relative !important;
    inset: auto !important;
    width: min(50vw, 200px) !important;
    max-width: none !important;
    height: auto !important;
    margin: 0 !important;
  }
  body.home.km-site-page .km-experience__mark img {
    display: block !important;
    width: 100% !important;
    height: auto !important;
    max-height: none !important;
    object-fit: contain !important;
  }
  body.home.km-site-page .km-experience__copy {
    position: relative !important;
    inset: auto !important;
    width: 100% !important;
    height: auto !important;
    margin: 0 !important;
    padding: 0 !important;
  }
  body.home.km-site-page .km-experience h2 {
    margin: 0 0 23px !important;
    font-size: clamp(32px, 8vw, 43px) !important;
    line-height: 1.17 !important;
    letter-spacing: -.028em !important;
  }
  body.home.km-site-page .km-experience p {
    margin: 0 0 17px !important;
    font-size: 16px !important;
    line-height: 1.58 !important;
  }
  body.home.km-site-page .km-experience__copy > .km-pill {
    position: relative !important;
    inset: auto !important;
    width: min(290px, 100%) !important;
    margin: 26px 0 0 !important;
  }

  /* 7. Wyślij: zamiana znaku ↗ na białą strzałkę SVG, tylko HOME mobile. */
  body.home.km-site-page .km-contact-section .km-form__bottom button.km-pill--form .km-pill__arrow-text {
    display: block !important;
    width: 20px !important;
    height: 20px !important;
    overflow: hidden !important;
    font-size: 0 !important;
    line-height: 0 !important;
    color: transparent !important;
    background: center/contain no-repeat url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 18 18' fill='none'%3E%3Cpath d='M3 15L15 3M6 3h9v9' stroke='%23FFFFFF' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") !important;
    transform: none;
  }
}

/*
 * 20.10.2026 — Korekta WYŁĄCZNIE 3 elementów HOME na mobile.
 * Wzorzec: oryginalne CTA „Wyślij” i „Przejdź do inwestycji”.
 * Menu burger, struktura sekcji i pozostałe poprawki bez zmian.
 */
@media (max-width: 767px) {
  /* Parametry: większe, czytelne wartości, nadal równa siatka 2×2. */
  body.home.km-site-page .km-facts__inner {
    grid-auto-rows: minmax(116px, auto) !important;
  }
  body.home.km-site-page .km-fact {
    min-height: 116px !important;
    padding: 15px clamp(10px, 3.25vw, 17px) !important;
  }
  body.home.km-site-page .km-fact span {
    font-size: clamp(12px, 3.45vw, 15px) !important;
    line-height: 1.24 !important;
    margin-bottom: 9px !important;
  }
  body.home.km-site-page .km-fact strong {
    font-size: clamp(17px, 5.35vw, 23px) !important;
    line-height: 1.27 !important;
    letter-spacing: -.045em !important;
    white-space: nowrap !important;
  }

  /* Poznaj inwestycję: pełny, identyczny układ obwódka + złote koło + strzałka. */
  body.home.km-site-page .km-home-project > a.km-home-project__mobile-cta {
    box-sizing: border-box !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    gap: 10px !important;
    width: min(300px, calc(100% - 32px)) !important;
    height: 64px !important;
    min-height: 64px !important;
    padding: 0 7px 0 24px !important;
    margin-top: 23px !important;
    border: 1.5px solid #a38b4b !important;
    border-radius: 999px !important;
    background: transparent !important;
    color: #a38b4b !important;
    font-size: 15px !important;
    line-height: 1.2 !important;
    font-weight: 700 !important;
    text-decoration: none !important;
  }
  body.home.km-site-page .km-home-project > a.km-home-project__mobile-cta > span:first-child {
    min-width: 0 !important;
    color: inherit !important;
  }
  body.home.km-site-page .km-home-project > a.km-home-project__mobile-cta > .km-pill__circle {
    box-sizing: border-box !important;
    position: relative !important;
    inset: auto !important;
    flex: 0 0 48px !important;
    display: grid !important;
    place-items: center !important;
    width: 48px !important;
    height: 48px !important;
    min-width: 48px !important;
    min-height: 48px !important;
    margin: 0 !important;
    padding: 0 !important;
    border: 0 !important;
    border-radius: 50% !important;
    background: #a38b4b !important;
    color: #fff !important;
  }
  body.home.km-site-page .km-home-project > a.km-home-project__mobile-cta .km-pill__arrow {
    display: block !important;
    position: static !important;
    width: 18px !important;
    height: 18px !important;
    max-width: none !important;
    object-fit: contain !important;
    margin: 0 !important;
  }

  /* Budynek 1 i 2: kompaktowa wersja tego samego charakterystycznego CTA. */
  body.home.km-site-page .km-building-picker__mobile-links a {
    box-sizing: border-box !important;
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    width: 100% !important;
    min-width: 0 !important;
    min-height: 56px !important;
    height: 56px !important;
    padding: 0 6px 0 clamp(10px, 3.2vw, 16px) !important;
    gap: 4px !important;
    border: 1.5px solid #a38b4b !important;
    border-radius: 999px !important;
    background: #fff !important;
    color: #a38b4b !important;
    font-size: clamp(11px, 3.1vw, 14px) !important;
    line-height: 1.15 !important;
    font-weight: 700 !important;
    white-space: nowrap !important;
    text-decoration: none !important;
  }
  /* Nie pozwalamy iOS rysować „↗” jako emoji. */
  body.home.km-site-page .km-building-picker__mobile-links a > span[aria-hidden="true"] {
    display: none !important;
  }
  body.home.km-site-page .km-building-picker__mobile-links a::after {
    content: "";
    display: block;
    flex: 0 0 clamp(35px, 10.5vw, 43px);
    width: clamp(35px, 10.5vw, 43px);
    height: clamp(35px, 10.5vw, 43px);
    box-sizing: border-box;
    border-radius: 50%;
    background-color: #a38b4b;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 18 18' fill='none'%3E%3Cpath d='M3 15L15 3M6 3h9v9' stroke='%23FFFFFF' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
    background-repeat: no-repeat;
    background-position: center;
    background-size: 17px 17px;
  }
  body.home.km-site-page .km-building-picker__mobile-links a:focus-visible {
    outline: 2px solid #a38b4b;
    outline-offset: 3px;
  }
}


/* ================================================================
   K&M Invest — Home / ekran desktopowy pośredni 1181–1919 px.
   Tylko Hero CTA, parametry i dwie sekcje tekst + zdjęcie.
   Nie zmieniamy mobilnego RWD <=1180 ani artboardu 1920+.
   Osobny blok przywraca wyłącznie potrzebne płynne proporcje.
   ================================================================ */
@media (min-width: 1181px) and (max-width: 1919px) {
  /* 1. Jeden wiersz CTA w Hero. */
  body.home.km-site-page .km-home-hero__actions {
    width: clamp(310px, 18.2vw, 348px);
    max-width: calc(100vw - 48px);
  }
  body.home.km-site-page .km-home-hero__actions > .km-pill {
    width: 100%;
    flex: 0 0 100%;
    min-width: 0;
    justify-content: space-between;
    height: clamp(55px, 3.802083vw, 73px);
    padding: 0 8px 0 clamp(18px, 1.42vw, 27px);
    gap: clamp(10px, .78vw, 15px);
    font-size: clamp(12px, .9vw, 16px);
  }
  body.home.km-site-page .km-home-hero__actions > .km-pill .km-pill__circle {
    width: clamp(42px, 2.916667vw, 56px);
    height: clamp(42px, 2.916667vw, 56px);
    flex: 0 0 clamp(42px, 2.916667vw, 56px);
  }
  body.home.km-site-page .km-home-hero__actions > .km-pill > span:first-child {
    white-space: nowrap;
    flex-shrink: 0;
  }

  /* 2. Parametry: siatka nie może być szersza od ekranu. */
  body.home.km-site-page .km-facts {
    height: max(116px, 9.635417vw);
  }
  body.home.km-site-page .km-facts__inner {
    width: 84.375vw;
    max-width: calc(100% - 40px);
    height: 100%;
    margin-inline: auto;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 1.5625vw;
  }
  body.home.km-site-page .km-fact {
    min-width: 0;
    padding: 1.822917vw 0 0;
  }
  body.home.km-site-page .km-fact:not(:last-child)::after {
    right: 0;
    top: 1.927083vw;
    height: 5.416667vw;
  }
  body.home.km-site-page .km-fact span {
    margin: 0 0 .260417vw;
    font-size: clamp(12px, .9375vw, 18px);
    line-height: 1.55;
  }
  body.home.km-site-page .km-fact strong {
    display: block;
    font-size: clamp(27px, 2.3vw, 44.5px);
    line-height: 1.625;
    letter-spacing: -.015em;
    white-space: nowrap;
  }

  /* 3. Symfonia Park: skalowany panel tekstowy z odstępem od renderu. */
  body.home.km-site-page .km-home-project__inner {
    width: 84.375vw;
    max-width: calc(100% - 40px);
  }
  body.home.km-site-page .km-home-project__copy {
    left: 17.239583vw;
    top: 5.208333vw;
    width: 34vw;
    max-width: 100%;
  }
  body.home.km-site-page .km-home-project__copy h2 {
    margin: 0 0 1.09375vw;
    font-size: clamp(32px, 2.5vw, 48px);
    line-height: 1.208333;
    letter-spacing: -.05em;
  }
  body.home.km-site-page .km-home-project__copy h3 {
    margin: 0 0 .833333vw;
    font-size: clamp(16px, 1.25vw, 24px);
    line-height: 1.416667;
  }
  body.home.km-site-page .km-home-project__copy p {
    margin: 0 0 .9375vw;
    font-size: clamp(13px, .9375vw, 18px);
    line-height: clamp(20px, 1.458333vw, 28px);
  }

  /* 4. Mrągowo: węższy opis, zdjęcie pozostaje we własnej kolumnie. */
  body.home.km-site-page .km-home-intro__inner {
    width: 84.375vw;
    max-width: calc(100% - 40px);
  }
  body.home.km-site-page .km-home-intro__copy {
    left: 0;
    top: 7.1875vw;
    width: 36.5vw;
    max-width: 100%;
  }
  body.home.km-site-page .km-home-intro__copy h2 {
    margin: 0 0 1.25vw;
    font-size: clamp(32px, 2.5vw, 48px);
    line-height: 1.208333;
    letter-spacing: -.05em;
  }
  body.home.km-site-page .km-home-intro__copy p {
    margin: 0 0 .9375vw;
    font-size: clamp(13px, .9375vw, 18px);
    line-height: clamp(20px, 1.458333vw, 28px);
  }
  body.home.km-site-page .km-home-intro__media {
    right: 0;
    top: 6.197917vw;
    width: 41.25vw;
    height: 27.1875vw;
  }
  body.home.km-site-page .km-home-intro__media > img.km-home-intro__lines {
    left: 12.135417vw;
    top: 10.677083vw;
    width: 30.208333vw;
    height: 20.104167vw;
  }
}
