/* Warstwa wizualna podstron SEO miast (Kraków, Tarnów, ...).
   Buduje na komponentach strony głównej (.vh-hero, .ab, .occ, .btn) - nie zmienia ich,
   tylko dokłada klasy .lp-* i domyka rytm sekcji dla kontenera .lp. Ładowana wyłącznie
   na podstronach SEO (warunek $landing w index.php), więc strona główna zostaje nietknięta. */

/* Ciaśniejszy rytm sekcji - usuwa wielkie puste przerwy na czarnym tle */
.lp .sec { padding-block: clamp(40px, 4.6vw, 68px); }
.lp .sec--tight { padding-block: clamp(30px, 3.4vw, 50px); }
.lp .sec--last { padding-bottom: clamp(54px, 7vw, 96px); }

/* Hero (na bazie .vh-hero): niższy niż na karcie auta, żeby zdjęcie w tle nie spychało auta w dół
   i nie zostawiało pustej przestrzeni. Kadr tła lekko wyżej, by auto było w centrum. */
.lp-hero { min-height: clamp(600px, 78svh, 820px); }
.lp-hero .vh-hero__bg img { object-position: var(--vhp-d, 50% 44%); }
/* Treść hero zawsze widoczna (bez czekania na animację wejścia) - stabilniej i lepiej dla LCP/SEO. */
.lp-hero .vh-hero__title, .lp-hero .vh-hero__stats li, .lp-hero .vh-hero__crumbs { opacity: 1; transform: none; animation: none; }
/* Okruszki niżej, żeby nie nachodziły na logo/menu w navbarze. */
.lp-hero .vh-hero__crumbs { top: clamp(82px, 11vh, 112px); }
.lp-hero-lead { max-width: 58ch; margin-top: clamp(14px, 1.8vw, 20px); font-size: clamp(15px, 1.15vw, 17px); line-height: 1.62; color: rgba(255, 255, 255, .74); }
.lp-hero-cta { display: flex; flex-wrap: wrap; gap: 12px; margin-top: clamp(20px, 2.4vw, 28px); }

/* Układ dwukolumnowy tekst + zdjęcie (blok dowozu) */
.lp-split { display: grid; grid-template-columns: minmax(0, 1.04fr) minmax(0, .96fr); gap: clamp(26px, 3.4vw, 58px); align-items: stretch; }
.lp-split--rev .lp-split__media { order: -1; }
.lp-split__media { align-self: stretch; }
.lp-split__media img { width: 100%; height: 100%; min-height: 260px; object-fit: cover; border-radius: 12px; display: block; }
.lp-split .bp-article { max-width: none; }
@media (max-width: 900px) {
    .lp-split { grid-template-columns: 1fr; }
    .lp-split--rev .lp-split__media { order: 0; }
    .lp-split__media img { min-height: 210px; }
}

/* Karty linków (modele/okazje) na bazie .occ, całe klikalne, ze zdjęciem */
.lp-card { display: block; text-decoration: none; color: inherit; transition: border-color .22s ease, transform .22s ease, box-shadow .22s ease; }
.lp-card:hover { border-color: rgba(194, 154, 63, .5); transform: translateY(-3px); box-shadow: 0 18px 36px -22px rgba(0, 0, 0, .92); }
.lp-card:hover .occ__b h3 { color: var(--gold); }
.lp-card:hover .lp-card__go svg { transform: translateX(4px); }
.lp-card__go { display: inline-flex; align-items: center; gap: 7px; margin-top: 13px; font-size: 12.5px; font-weight: 500; letter-spacing: .01em; color: var(--gold); }
.lp-card__go svg { width: 15px; height: 15px; transition: transform .25s cubic-bezier(.22, .8, .3, 1); }

/* Końcowy blok CTA - wyróżniony panel */
.lp-cta { border: 1px solid rgba(255, 255, 255, .1); border-radius: 16px; background: linear-gradient(180deg, rgba(194, 154, 63, .07), rgba(255, 255, 255, .015)); padding: clamp(28px, 4vw, 52px); text-align: center; }
.lp-cta h2 { margin-top: 0; }
.lp-cta p { margin-left: auto; margin-right: auto; max-width: 60ch; }
.lp-cta__btns { display: flex; flex-wrap: wrap; justify-content: center; gap: 12px; margin-top: clamp(18px, 2.2vw, 26px); }