/*
 * epiano — Kadence Overrides
 * ===========================
 * Naprawia konflikty gdzie Kadence nadpisuje style motywu epiano.
 * Plik wygenerowany na podstawie css-audit.js (devtools/css-audit.js).
 *
 * ZASADA: nie dodajemy tu stylów "od zera" — tylko resetujemy
 * konkretne właściwości które Kadence psuje.
 */

/* ── 1. Hamburger button ────────────────────────────────────────────────────
 *
 * Problem: Kadence łapie nasz <button class="hamburger"> mega-selektorem:
 *   button, .button, .wp-block-button__link, .wp-element-button,
 *   input[type="button"], input[type="reset"], input[type="submit"]
 * Specificity Kadence: (0,6,4) — nasz .hamburger: (0,1,0)
 *
 * Fix: używamy .site-header .hamburger żeby zwiększyć specificity do (0,2,1)
 * i !important tam gdzie Kadence też używa !important.
 */

.site-header .hamburger {
    background: transparent !important;
    border:     none !important;
    padding:    0 !important;
    cursor:     pointer;
}

@media (max-width: 991px) {
    .site-header .hamburger {
        display: block !important;
    }
}

@media (min-width: 992px) {
    .site-header .hamburger {
        display: none !important;
    }
}

/* ── 2. Marginesy nagłówków w blokach ───────────────────────────────────────
 *
 * Problem: Kadence targetuje wszystkie nagłówki wewnątrz .single-content:
 *   .single-content h1, .single-content h2, ... { margin-top: ... }
 * Specificity: (0,1,1) — nasze BEM klasy: (0,1,0)
 *
 * Fix: zerujemy TYLKO margin-top — margin-bottom każdy blok ustawia
 * samodzielnie w swoim style.css (przez padding-bottom lub wyższy specificity).
 */

/* Utility classes (nowe bloki będą używać tych — ochrona z wyprzedzeniem) */
.epiano-section-heading,
/* BEM klasy istniejących bloków */
.epiano-hero__title,
.epiano-usp__heading,
.epiano-usp__title,
.epiano-cta__title,
.epiano-subpage-hero__title,
.epiano-transport-cards__heading,
.epiano-transport-cards__title,
.epiano-contact-form__title,
.epiano-contact-details__title,
.epiano-contact-details__owner-names {
    margin-top: 0 !important;
}

/* ── 3. Marginesy opisów / paragrafów w blokach ─────────────────────────────
 *
 * Problem: Kadence targetuje paragrafy wewnątrz .single-content:
 *   .single-content p, .single-content address, ... { margin-bottom: var(--global-md-spacing) }
 *   .single-content p:last-child { margin-bottom: 0 }
 * Specificity: od (0,1,1) do (0,72,15)
 */

.epiano-hero__desc,
.epiano-usp__subtitle,
.epiano-usp__desc,
.epiano-cta__desc,
.epiano-subpage-hero__desc,
.epiano-transport-cards__desc,
.epiano-contact-form__intro,
.epiano-info-box p,
.epiano-contact-form__form p {
    margin-top:    0 !important;
    margin-bottom: 0 !important;
}

/* ── 4. Lista kontaktowa ────────────────────────────────────────────────────
 *
 * Rozwiązanie przeniesione do contact-details/style.css przez podniesienie
 * specificity do (0,2,0): .epiano-contact-details .epiano-contact-details__list
 * bije Kadence .single-content ul (0,1,1) — bez !important.
 */

/* ── 5. Kolor linków nawigacji na hover/focus/active ────────────────────────
 *
 * Problem: Kadence ma globalne:
 *   a:hover, a:focus, a:active { color: var(--global-palette-highlight-alt) }
 * Specificity: (0,1,1) — bije nasze `.nav-link` (0,1,0) bo brakuje pseudoklasy.
 *
 * Intencja projektu: nav-link na hover pokazuje złote podkreślenie (::after)
 * ale NIE zmienia koloru — kolor pozostaje --text-main.
 * Mobile i footer: hover → --accent-gold (zdefiniowane w header-footer.css,
 * ale tu chronimy też :focus i :active).
 */

.nav-link:hover,
.nav-link:focus,
.nav-link:active {
    color: var(--text-main);
    text-decoration: none;
}

.site-logo:hover,
.site-logo:focus,
.site-logo:active {
    color: inherit;
    text-decoration: none;
}

.mobile-nav-link:focus,
.mobile-nav-link:active {
    color: var(--accent-gold);
}

.footer-link:focus,
.footer-link:active {
    color: var(--accent-gold);
}

/* ── 6. Section intro paragraph ─────────────────────────────────────────────
 *
 * Problem: Kadence resetuje margin na .single-content p.
 */

.epiano-section-intro {
    margin-top:    0 !important;
    margin-bottom: 0 !important;
}

/* ── 7. Contact grid — 2-col layout ─────────────────────────────────────────
 *
 * Problem: WP .wp-block-columns używa flexbox z flex-basis: 0 na kolumnach.
 *   Potrzebujemy: CSS grid 1fr : 1.2fr z wyrównaniem start.
 */

@media (min-width: 992px) {
    .wp-block-columns.epiano-contact-grid {
        display:               grid !important;
        grid-template-columns: 1fr 1.2fr !important;
        gap:                   var(--space-3xl) !important;
        align-items:           start !important;
        flex-wrap:             unset !important;
    }

    .wp-block-columns.epiano-contact-grid > .wp-block-column {
        flex:  unset !important;
        width: auto  !important;
    }
}