/* ============================================================
   MADERA CENTRUM — Custom CSS
   Sub-brands: Madera House | Flores Apartament | Rooms Silesia
   Site: maderacentrum.pl
   Wklej do: Arkusz stylów CSS → custom.css (prawy panel)
   Zastąp całą poprzednią zawartość tym plikiem.
   ============================================================ */

/* ============================================================
   DESIGN TOKENS
   Zmiana koloru marki: edytuj tylko tę sekcję.
   ============================================================ */

:root {
    /* — Brand palette — */
    --md-brand:        #C9A96E;  /* złoto — główny akcent */
    --md-brand-hover:  #B8935A;  /* ciemniejsze złoto — hover */
    --md-accent:       #8B6914;  /* głęboka ochre — dekoracje */

    /* — Tła — */
    --md-bg:           #1A1A1A;  /* główne ciemne tło */
    --md-bg-alt:       #222222;  /* sekcja alternatywna */
    --md-bg-muted:     #2A2520;  /* ciepły brąz — sekcja muted */
    --md-bg-card:      #242220;  /* tło kart */
    --md-bg-light:     #F5F0E8;  /* jasne tło (odwrócone sekcje) */

    /* — Tekst — */
    --md-text:         #F5F0E8;  /* ciepła biel — główny tekst */
    --md-text-muted:   #A89880;  /* przygaszony tekst */
    --md-text-subtle:  #6B5D50;  /* bardzo subtelny */

    /* — Obramowania — */
    --md-border:       rgba(201,169,110,0.2);   /* złota linia — subtelna */
    --md-border-light: rgba(201,169,110,0.35);  /* złota linia — wyraźna */
    --md-border-muted: rgba(201,169,110,0.12);  /* złota linia — muted bg */

    /* — Typografia — */
    --md-font-heading: 'Georgia', 'Times New Roman', serif;
    --md-font-body:    system-ui, -apple-system, 'Segoe UI', sans-serif;

    /* — Wymiary — */
    --md-max-width:    1170px;
    --md-section-pad:  88px;
    --md-section-pad-m: 56px;
    --md-inner-pad:    40px;
    --md-inner-pad-m:  24px;
}

/* ============================================================
   UKRYCIA SYSTEMOWE (zachowaj)
   ============================================================ */

.contact__block.--links ul li:first-child { display: none !important; }
.footer-contact ul li.footer-contact-phone { display: none !important; }
#additional_info .addonsList li:first-child { display: none !important; }

/* ============================================================
   UKRYCIE TYTUŁU CMS + RESET PADDINGU
   ============================================================ */

/* 1. CMS wstrzykuje <h1 class="big-label"> nad treścią — ukrywamy */
h1.big-label {
    display: none !important;
}

/* 2. CMS ustawia padding-top: 50px na #pageContent .container — zerujemy */
#pageContent .container {
    padding-top: 0 !important;
}

/* 3. Bootstrap .mb-5 otacza .txt-text — usuń zbędny margin-bottom */
#pageContent .mb-5 {
    margin-bottom: 0 !important;
}

/* ============================================================
   UCIECZKA Z KONTENERA CMS
   .txt-text jest w .container (max 1170px + 15px padding)
   Używamy negative margin żeby sekcje były full-width
   ============================================================ */

.txt-text .md-full {
    margin-left:  -15px;
    margin-right: -15px;
    width: calc(100% + 30px);
}

@media (min-width: 1200px) {
    .txt-text .md-full {
        margin-left:  calc(-50vw + 585px);
        margin-right: calc(-50vw + 585px);
        width: 100vw;
    }
}

/* ============================================================
   TYPOGRAFIA BAZOWA
   ============================================================ */

.txt-text {
    font-size: 1.5rem;
    color: var(--md-text);
    line-height: 1.7;
    background: var(--md-bg);
}

/* ============================================================
   SEKCJE
   ============================================================ */

.md-section {
    padding: var(--md-section-pad) 0;
    width: 100%;
    background: var(--md-bg);
    color: var(--md-text);
}

/* Ciemna sekcja — złoto jako tło akcentu */
.md-section--dark {
    background: var(--md-bg-alt);
    color: var(--md-text);
}

/* Muted sekcja — ciepły brąz */
.md-section--muted {
    background: var(--md-bg-muted);
    color: var(--md-text);
}

/* Jasna sekcja — dla kontrastu (np. cytaty) */
.md-section--light {
    background: var(--md-bg-light);
    color: #1A1A1A;
}

/* Złota sekcja akcentowa */
.md-section--gold {
    background: var(--md-brand);
    color: #1A1A1A;
}

/* Wewnętrzny kontener */
.md-inner {
    max-width: var(--md-max-width);
    margin: 0 auto;
    padding: 0 var(--md-inner-pad);
}

@media (max-width: 768px) {
    .md-inner { padding: 0 var(--md-inner-pad-m); }
    .md-section { padding: var(--md-section-pad-m) 0; }
}

/* ============================================================
   NAGŁÓWKI SEKCJI
   ============================================================ */

/* Nadnapis kicker — małe złote litery */
.md-label {
    display: block;
    font-size: 10px;
    letter-spacing: 4px;
    text-transform: uppercase;
    color: var(--md-brand);
    margin-bottom: 16px;
    font-weight: 500;
    font-family: var(--md-font-body);
}

.md-section--light .md-label  { color: var(--md-accent); }
.md-section--gold  .md-label  { color: rgba(26,26,26,0.6); }

/* Główny nagłówek sekcji — szeryfowy, elegancki */
.md-h2 {
    font-family: var(--md-font-heading);
    font-size: clamp(28px, 3.5vw, 48px);
    font-weight: 400;
    line-height: 1.15;
    letter-spacing: 0.01em;
    color: var(--md-text);
    margin: 0 0 24px;
}

.md-section--light .md-h2 { color: #111; }
.md-section--gold  .md-h2 { color: #1A1A1A; }

/* Nagłówek karty */
.md-h3 {
    font-family: var(--md-font-heading);
    font-size: 19px;
    font-weight: 400;
    color: var(--md-text);
    margin: 0 0 8px;
    letter-spacing: 0.01em;
}

.md-section--light .md-h3 { color: #111; }
.md-section--gold  .md-h3 { color: #1A1A1A; }

/* Lead — podtytuł sekcji */
.md-lead {
    font-size: 16px;
    color: var(--md-text-muted);
    line-height: 1.8;
    max-width: 680px;
    margin: 0 0 48px;
    font-family: var(--md-font-body);
}

.md-section--light .md-lead { color: #555; }
.md-section--gold  .md-lead { color: rgba(26,26,26,0.7); }

/* Linia dekoracyjna — złota */
.md-rule {
    border: none;
    border-top: 1px solid var(--md-brand);
    margin: 0 0 48px;
    max-width: 40px;
    opacity: 0.6;
}

.md-section--light .md-rule { border-color: var(--md-accent); }
.md-section--gold  .md-rule { border-color: rgba(26,26,26,0.3); }

/* ============================================================
   LAYOUT
   ============================================================ */

.md-split {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 80px;
    align-items: start;
}

.md-split--3 {
    display: grid;
    grid-template-columns: 1fr 1fr 1fr;
    gap: 0;
}

.md-split--4 {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 0;
}

@media (max-width: 900px) {
    .md-split,
    .md-split--3,
    .md-split--4 {
        grid-template-columns: 1fr;
        gap: 40px;
    }
}

/* ============================================================
   HERO BANER PODSTRONY
   ============================================================ */

.md-hero {
    padding: 100px 0 80px;
    background: var(--md-bg);
    color: var(--md-text);
    border-bottom: 1px solid var(--md-border);
    position: relative;
}

/* Dekoracyjna złota kreska po lewej stronie tytułu */
.md-hero::after {
    content: '';
    position: absolute;
    left: 0;
    top: 0;
    bottom: 0;
    width: 3px;
    background: linear-gradient(to bottom, transparent, var(--md-brand), transparent);
    display: none;
}

.md-hero__inner {
    max-width: var(--md-max-width);
    margin: 0 auto;
    padding: 0 var(--md-inner-pad);
}

.md-hero__kicker {
    display: block;
    font-size: 10px;
    letter-spacing: 4px;
    text-transform: uppercase;
    color: var(--md-brand);
    margin-bottom: 24px;
    font-family: var(--md-font-body);
}

.md-hero__title {
    font-family: var(--md-font-heading);
    font-size: clamp(36px, 5vw, 68px);
    font-weight: 400;
    letter-spacing: 0.01em;
    line-height: 1.1;
    color: var(--md-text);
    margin: 0 0 28px;
}

.md-hero__desc {
    font-size: 17px;
    color: var(--md-text-muted);
    line-height: 1.75;
    max-width: 560px;
    margin: 0;
    font-family: var(--md-font-body);
}

/* ============================================================
   KARTY APARTAMENTÓW / SUB-BRANDÓW
   ============================================================ */

.md-apt {
    display: grid;
    grid-template-columns: 1fr 1fr;
    border-top: 1px solid var(--md-border);
}

@media (max-width: 860px) {
    .md-apt { grid-template-columns: 1fr; }
}

.md-apt__item {
    padding: 56px 48px;
    border-right: 1px solid var(--md-border);
    border-bottom: 1px solid var(--md-border);
    position: relative;
    transition: background 0.2s ease;
}

.md-apt__item:hover {
    background: var(--md-bg-card);
}

.md-apt__item:nth-child(2n) {
    border-right: none;
}

.md-section--muted .md-apt__item {
    border-color: var(--md-border-muted);
}

/* Numer / etykieta pozycji */
.md-apt__num {
    font-size: 10px;
    letter-spacing: 3px;
    text-transform: uppercase;
    color: var(--md-brand);
    margin-bottom: 20px;
    display: block;
    font-family: var(--md-font-body);
}

.md-apt__name {
    font-family: var(--md-font-heading);
    font-size: 26px;
    font-weight: 400;
    letter-spacing: 0.01em;
    color: var(--md-text);
    margin: 0 0 6px;
}

.md-apt__floor {
    font-size: 13px;
    color: var(--md-text-muted);
    margin: 0 0 24px;
    display: block;
}

.md-apt__desc {
    font-size: 15px;
    color: var(--md-text-muted);
    line-height: 1.75;
    margin: 0 0 28px;
}

.md-apt__specs {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin-bottom: 32px;
}

.md-apt__spec {
    font-size: 11px;
    letter-spacing: 1px;
    text-transform: uppercase;
    color: var(--md-text-muted);
    border: 1px solid var(--md-border);
    padding: 5px 12px;
    white-space: nowrap;
    font-family: var(--md-font-body);
}

/* ============================================================
   LISTA CECH
   ============================================================ */

.md-features {
    list-style: none;
    padding: 0;
    margin: 0;
}

.md-features li {
    font-size: 15px;
    color: var(--md-text-muted);
    line-height: 1.65;
    padding: 13px 0;
    border-bottom: 1px solid var(--md-border);
    display: flex;
    align-items: baseline;
    gap: 14px;
}

.md-features li:last-child { border-bottom: none; }

.md-features li::before {
    content: "—";
    color: var(--md-brand);
    flex-shrink: 0;
    font-size: 12px;
    opacity: 0.7;
}

.md-section--light .md-features li {
    color: #444;
    border-color: #e0d8cc;
}

.md-section--light .md-features li::before {
    color: var(--md-accent);
}

/* ============================================================
   GRID UDOGODNIEŃ
   ============================================================ */

.md-amenities {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    border-top: 1px solid var(--md-border);
}

@media (max-width: 860px) {
    .md-amenities { grid-template-columns: 1fr; }
}

.md-amenity {
    padding: 48px 40px;
    border-right: 1px solid var(--md-border);
    border-bottom: 1px solid var(--md-border);
    transition: background 0.2s ease;
}

.md-amenity:hover {
    background: var(--md-bg-card);
}

.md-amenity:nth-child(3n) { border-right: none; }

.md-amenities--2 {
    grid-template-columns: repeat(2, 1fr);
}

.md-amenities--2 .md-amenity:nth-child(3n) { border-right: 1px solid var(--md-border); }
.md-amenities--2 .md-amenity:nth-child(2n) { border-right: none; }

.md-section--muted .md-amenities,
.md-section--muted .md-amenity { border-color: var(--md-border-muted); }

.md-amenity__icon {
    display: block;
    margin-bottom: 22px;
    color: var(--md-brand);
    line-height: 1;
}

.md-amenity__icon svg {
    width: 22px;
    height: 22px;
    stroke: currentColor;
    fill: none;
    stroke-width: 1.5;
    stroke-linecap: round;
    stroke-linejoin: round;
}

.md-amenity__title {
    font-family: var(--md-font-heading);
    font-size: 15px;
    font-weight: 400;
    color: var(--md-text);
    margin: 0 0 8px;
    letter-spacing: 0.01em;
}

.md-amenity__text {
    font-size: 14px;
    color: var(--md-text-muted);
    line-height: 1.7;
    margin: 0;
}

.md-section--light .md-amenity__title { color: #111; }
.md-section--light .md-amenity__text  { color: #666; }

/* ============================================================
   SPECS BAR (dane apartamentu)
   ============================================================ */

.md-specs {
    display: grid;
    grid-template-columns: repeat(5, 1fr);
    border-top: 1px solid var(--md-border);
    border-bottom: 1px solid var(--md-border);
}

@media (max-width: 768px) {
    .md-specs { grid-template-columns: repeat(2, 1fr); }
}

.md-spec {
    padding: 32px 24px;
    border-right: 1px solid var(--md-border);
    text-align: left;
}

.md-spec:last-child { border-right: none; }

.md-spec__val {
    display: block;
    font-family: var(--md-font-heading);
    font-size: 34px;
    font-weight: 400;
    letter-spacing: 0.01em;
    color: var(--md-brand);
    line-height: 1;
    margin-bottom: 6px;
}

.md-spec__label {
    font-size: 10px;
    letter-spacing: 2px;
    text-transform: uppercase;
    color: var(--md-text-subtle);
    font-family: var(--md-font-body);
}

/* ============================================================
   ATRAKCJE / LOKALIZACJA
   ============================================================ */

.md-places {
    border-top: 1px solid var(--md-border);
}

.md-place {
    display: grid;
    grid-template-columns: 1fr auto;
    gap: 40px;
    align-items: start;
    padding: 36px 0;
    border-bottom: 1px solid var(--md-border);
    transition: background 0.15s ease;
}

.md-place:hover {
    padding-left: 8px;
    transition: padding 0.2s ease, background 0.2s ease;
}

.md-place__name {
    font-family: var(--md-font-heading);
    font-size: 16px;
    font-weight: 400;
    color: var(--md-text);
    margin: 0 0 6px;
}

.md-place__desc {
    font-size: 14px;
    color: var(--md-text-muted);
    line-height: 1.65;
    margin: 0;
}

.md-place__dist {
    font-size: 11px;
    letter-spacing: 1px;
    text-transform: uppercase;
    color: var(--md-brand);
    white-space: nowrap;
    padding-top: 4px;
    font-weight: 600;
    font-family: var(--md-font-body);
}

/* ============================================================
   PRZYCISK CTA
   ============================================================ */

.md-btn {
    display: inline-block;
    background: var(--md-brand);
    color: #1A1A1A !important;
    padding: 14px 32px;
    font-size: 12px;
    font-weight: 600;
    letter-spacing: 1.5px;
    text-transform: uppercase;
    text-decoration: none !important;
    transition: background 0.2s ease, color 0.2s ease;
    font-family: var(--md-font-body);
}

.md-btn:hover {
    background: var(--md-brand-hover);
    color: #1A1A1A !important;
    text-decoration: none !important;
}

/* Przycisk obrysowany */
.md-btn--ghost {
    background: transparent;
    border: 1px solid var(--md-brand);
    color: var(--md-brand) !important;
}

.md-btn--ghost:hover {
    background: var(--md-brand);
    color: #1A1A1A !important;
}

/* Biały przycisk na złotym tle */
.md-section--gold .md-btn {
    background: #1A1A1A;
    color: var(--md-brand) !important;
}

.md-section--gold .md-btn:hover {
    background: #2A2A2A;
    color: var(--md-brand) !important;
}

/* Jasny przycisk na ciemnej sekcji */
.md-section--dark .md-btn--outline {
    background: transparent;
    border: 1px solid rgba(201,169,110,0.5);
    color: var(--md-text) !important;
}

.md-section--dark .md-btn--outline:hover {
    border-color: var(--md-brand);
    color: var(--md-brand) !important;
}

/* ============================================================
   GALERIA — albumy
   ============================================================ */

.md-albums {
    display: grid;
    grid-template-columns: 1fr 1fr;
    border-top: 1px solid var(--md-border);
}

@media (max-width: 680px) {
    .md-albums { grid-template-columns: 1fr; }
}

.md-album {
    padding: 48px 40px;
    border-right: 1px solid var(--md-border);
    border-bottom: 1px solid var(--md-border);
    transition: background 0.2s ease;
}

.md-album:nth-child(2n) { border-right: none; }

.md-album:hover {
    background: var(--md-bg-card);
}

.md-album__num {
    font-size: 10px;
    letter-spacing: 3px;
    text-transform: uppercase;
    color: var(--md-brand);
    margin-bottom: 16px;
    display: block;
    opacity: 0.7;
    font-family: var(--md-font-body);
}

.md-album__title {
    font-family: var(--md-font-heading);
    font-size: 20px;
    font-weight: 400;
    color: var(--md-text);
    letter-spacing: 0.01em;
    margin: 0 0 10px;
}

.md-album__desc {
    font-size: 14px;
    color: var(--md-text-muted);
    line-height: 1.7;
    margin: 0 0 24px;
}

/* ============================================================
   PASEK DOLNY CTA
   ============================================================ */

.md-cta-bar {
    padding: var(--md-section-pad) 0;
    background: var(--md-brand);
    color: #1A1A1A;
}

.md-cta-bar__inner {
    max-width: var(--md-max-width);
    margin: 0 auto;
    padding: 0 var(--md-inner-pad);
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 40px;
}

@media (max-width: 768px) {
    .md-cta-bar__inner { flex-direction: column; align-items: flex-start; }
    .md-cta-bar { padding: var(--md-section-pad-m) 0; }
}

.md-cta-bar__text h3 {
    font-family: var(--md-font-heading);
    font-size: clamp(22px, 3vw, 34px);
    font-weight: 400;
    color: #1A1A1A;
    letter-spacing: 0.01em;
    margin: 0 0 8px;
}

.md-cta-bar__text p {
    font-size: 15px;
    color: rgba(26,26,26,0.65);
    margin: 0;
    line-height: 1.6;
}

.md-cta-bar .md-btn {
    background: #1A1A1A;
    color: var(--md-brand) !important;
}

.md-cta-bar .md-btn:hover {
    background: #2A2A2A;
    color: var(--md-brand) !important;
}

.md-cta-bar__actions {
    flex-shrink: 0;
    display: flex;
    gap: 12px;
    flex-wrap: wrap;
    align-items: center;
}

/* ============================================================
   SEKCJA INTRO (duży tekst)
   ============================================================ */

.md-intro {
    font-family: var(--md-font-heading);
    font-size: clamp(18px, 2vw, 23px);
    color: var(--md-text-muted);
    line-height: 1.75;
    max-width: 780px;
    font-weight: 400;
    letter-spacing: 0.01em;
}

.md-section--light .md-intro { color: #444; }

/* ============================================================
   SIATKA ZDJĘĆ — galeria fotograficzna
   ============================================================ */

.md-photos {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 4px;
}

@media (max-width: 860px) {
    .md-photos { grid-template-columns: repeat(2, 1fr); }
}

@media (max-width: 480px) {
    .md-photos { grid-template-columns: 1fr; }
}

.md-photo {
    position: relative;
    overflow: hidden;
    aspect-ratio: 4 / 3;
    background: var(--md-bg-card);
    display: block;
}

.md-photo img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
    transition: transform 0.4s ease, opacity 0.4s ease;
}

.md-photo:hover img {
    transform: scale(1.04);
    opacity: 0.85;
}

.md-photo__overlay {
    position: absolute;
    inset: 0;
    background: rgba(201, 169, 110, 0);  /* rgba of --md-brand */
    transition: background 0.35s ease;
    display: flex;
    align-items: center;
    justify-content: center;
    pointer-events: none;
}

.md-photo:hover .md-photo__overlay {
    background: rgba(26, 26, 26, 0.4);
}

.md-photo__overlay svg {
    opacity: 0;
    transform: scale(0.8);
    transition: opacity 0.25s ease, transform 0.25s ease;
    color: var(--md-brand);
    filter: drop-shadow(0 1px 4px rgba(0,0,0,0.6));
}

.md-photo:hover .md-photo__overlay svg {
    opacity: 1;
    transform: scale(1);
}

/* Licznik zdjęć */
.md-photos-count {
    font-size: 12px;
    color: var(--md-text-subtle);
    letter-spacing: 1px;
    text-transform: uppercase;
    margin-bottom: 32px;
    display: block;
    font-family: var(--md-font-body);
}

/* ============================================================
   KLASY POMOCNICZE
   ============================================================ */

/* Wrapper na przyciski CTA */
.md-btn-group {
    display: flex;
    flex-wrap: wrap;
    gap: 12px;
    align-items: center;
}

/* Sekcja z mniejszym paddingiem */
.md-section--compact {
    padding-top: 48px !important;
    padding-bottom: 48px !important;
}

/* Wyrównanie tekstu do środka */
.md-center {
    text-align: center;
}

.md-center .md-lead {
    margin-left: auto;
    margin-right: auto;
}

/* Separator złotą linią */
.md-divider {
    border: none;
    border-top: 1px solid var(--md-border);
    margin: 0;
}

/* ============================================================
   ETYKIETA ZDJĘCIA (widoczna na kafelku)
   ============================================================ */

.md-photo__label {
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    padding: 6px 10px;
    font-size: 11px;
    letter-spacing: 0.5px;
    color: var(--md-text);
    background: linear-gradient(to top, rgba(26,26,26,0.85), transparent);
    opacity: 0;
    transition: opacity 0.25s ease;
    font-family: var(--md-font-body);
    pointer-events: none;
}

.md-photo:hover .md-photo__label {
    opacity: 1;
}

/* ============================================================
   LIGHTBOX
   ============================================================ */

.md-lightbox {
    position: fixed;
    inset: 0;
    z-index: 9999;
    background: rgba(10, 9, 8, 0.96);
    display: flex;
    align-items: center;
    justify-content: center;
    opacity: 0;
    pointer-events: none;
    transition: opacity 0.25s ease;
}

.md-lightbox--open {
    opacity: 1;
    pointer-events: auto;
}

.md-lightbox__img {
    max-width: 92vw;
    max-height: 85vh;
    object-fit: contain;
    display: block;
    box-shadow: 0 8px 48px rgba(0,0,0,0.7);
}

.md-lightbox__close {
    position: absolute;
    top: 20px;
    right: 24px;
    background: transparent;
    border: 1px solid var(--md-border);
    color: var(--md-text-muted);
    font-size: 24px;
    line-height: 1;
    width: 40px;
    height: 40px;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    transition: border-color 0.2s ease, color 0.2s ease;
    font-family: var(--md-font-body);
}

.md-lightbox__close:hover {
    border-color: var(--md-brand);
    color: var(--md-brand);
}

.md-lightbox__nav {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    background: transparent;
    border: 1px solid var(--md-border);
    color: var(--md-text-muted);
    width: 48px;
    height: 48px;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    transition: border-color 0.2s ease, color 0.2s ease;
}

.md-lightbox__nav:hover {
    border-color: var(--md-brand);
    color: var(--md-brand);
}

.md-lightbox__nav--prev { left: 20px; }
.md-lightbox__nav--next { right: 20px; }

@media (max-width: 600px) {
    .md-lightbox__nav--prev { left: 8px; }
    .md-lightbox__nav--next { right: 8px; }
}

.md-lightbox__meta {
    position: absolute;
    bottom: 20px;
    left: 50%;
    transform: translateX(-50%);
    display: flex;
    align-items: center;
    gap: 16px;
    white-space: nowrap;
}

.md-lightbox__label {
    font-size: 13px;
    color: var(--md-text-muted);
    font-family: var(--md-font-body);
    letter-spacing: 0.3px;
}

.md-lightbox__counter {
    font-size: 11px;
    letter-spacing: 1px;
    color: var(--md-text-subtle);
    font-family: var(--md-font-body);
    text-transform: uppercase;
}

/* ============================================================
   DOSTĘPNOŚĆ — ruch zredukowany
   ============================================================ */

@media (prefers-reduced-motion: reduce) {
    .md-btn,
    .md-photo img,
    .md-photo__overlay,
    .md-photo__overlay svg,
    .md-photo__label,
    .md-lightbox,
    .md-lightbox__close,
    .md-lightbox__nav,
    .md-album,
    .md-apt__item,
    .md-amenity,
    .md-place {
        transition: none !important;
    }

    .md-photo:hover img {
        transform: none !important;
    }

    .md-photo:hover .md-photo__overlay svg {
        opacity: 1 !important;
        transform: none !important;
    }
}

/* ==========================================================
   CMS TEMPLATE OVERRIDES
   Style template elements (header, footer, search) to match
   dark/gold theme. Keep them visible and functional.
   ========================================================== */

/* --- HEADER / NAVBAR --- */
header.default13 {
    background: var(--md-bg) !important;
    border-bottom: 1px solid var(--md-border) !important;
}

header.default13 .menu-wrapper {
    background: var(--md-bg) !important;
}

header.default13 .navbar {
    background: var(--md-bg) !important;
}

header.default13 .navbar-brand {
    filter: brightness(1.1);
}

header.default13 .navbar-brand img {
    max-height: 44px;
}

/* Nav links */
header.default13 #navbar .nav-link,
header.default13 .navbar-nav .nav-link {
    color: var(--md-text) !important;
    font-family: var(--md-font-body);
    font-size: 0.85rem;
    letter-spacing: 0.04em;
    text-transform: uppercase;
    transition: color 0.25s;
}

header.default13 #navbar .nav-link:hover,
header.default13 .navbar-nav .nav-link:hover {
    color: var(--md-brand) !important;
}

header.default13 #navbar .nav-item.active .nav-link {
    color: var(--md-brand) !important;
}

/* Reservation button in navbar */
header.default13 .navbar-reservation {
    background: var(--md-brand) !important;
    color: var(--md-bg) !important;
    border: none !important;
    font-size: 0.8rem;
    letter-spacing: 0.05em;
    text-transform: uppercase;
    border-radius: 2px;
    padding: 8px 18px;
    transition: background 0.25s;
}

header.default13 .navbar-reservation:hover {
    background: var(--md-brand-hover) !important;
}

/* Language switcher */
header.default13 .language__toggler {
    color: var(--md-text-muted) !important;
    background: transparent !important;
    border: 1px solid var(--md-border) !important;
}

header.default13 .language {
    background: var(--md-bg-alt) !important;
    border: 1px solid var(--md-border) !important;
}

header.default13 .language select,
header.default13 .language option {
    background: var(--md-bg-alt) !important;
    color: var(--md-text) !important;
}

/* Hamburger / mobile toggle */
header.default13 .navbar-toggler,
header.default13 .navbar-toggler-icon {
    color: var(--md-text) !important;
    border-color: var(--md-border) !important;
}

/* --- SEARCH BAR (parallax section on homepage) --- */
main > .section.parallax {
    background: var(--md-bg-alt) !important;
    padding: 40px 0 !important;
}

main > .section.parallax .parallax-slider {
    display: none !important; /* hide background slider images */
}

main > .section.parallax .iai-search,
main > .section.parallax .search-form,
main > .section.parallax form {
    background: transparent !important;
}

main > .section.parallax input,
main > .section.parallax select {
    background: var(--md-bg) !important;
    color: var(--md-text) !important;
    border: 1px solid var(--md-border) !important;
    border-radius: 2px;
    padding: 10px 14px;
    font-family: var(--md-font-body);
}

main > .section.parallax input::placeholder {
    color: var(--md-text-muted) !important;
}

main > .section.parallax label {
    color: var(--md-text-muted) !important;
    font-size: 0.8rem;
    text-transform: uppercase;
    letter-spacing: 0.04em;
}

main > .section.parallax button,
main > .section.parallax .btn {
    background: var(--md-brand) !important;
    color: var(--md-bg) !important;
    border: none !important;
    font-size: 0.85rem;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    border-radius: 2px;
    padding: 10px 24px;
    cursor: pointer;
    transition: background 0.25s;
}

main > .section.parallax button:hover,
main > .section.parallax .btn:hover {
    background: var(--md-brand-hover) !important;
}

/* Hide old "O nas" description sections */
main > .section.fp-auto-height {
    display: none !important;
}

/* Fix fullpage.js wrapper — disable scroll hijacking */
.fp-enabled body,
.fp-viewing-1 {
    overflow: auto !important;
}

html.fp-enabled {
    overflow: auto !important;
}

.fp-tableCell {
    display: block !important;
    height: auto !important;
}

/* Ensure page-index flows naturally */
.page-index {
    position: relative !important;
    transform: none !important;
    height: auto !important;
    overflow: visible !important;
}

/* --- FOOTER --- */
footer {
    background: var(--md-bg) !important;
    border-top: 1px solid var(--md-border) !important;
    display: block !important;
}

footer .footer {
    background: var(--md-bg) !important;
    color: var(--md-text-muted) !important;
}

footer .footer__wrapper {
    padding: 32px 0 !important;
}

footer .footer__contact,
footer .footer__contact li {
    color: var(--md-text-muted) !important;
    font-size: 0.85rem;
}

footer .footer__contact a {
    color: var(--md-brand) !important;
    text-decoration: none;
    transition: color 0.25s;
}

footer .footer__contact a:hover {
    color: var(--md-brand-hover) !important;
}

footer .footer-contact-terms a {
    color: var(--md-text-subtle) !important;
    font-size: 0.8rem;
}

footer .footer-contact-terms a:hover {
    color: var(--md-brand) !important;
}

/* Powered-by badge */
footer .footer a[href*="idosell"] {
    opacity: 0.5;
    transition: opacity 0.25s;
}

footer .footer a[href*="idosell"]:hover {
    opacity: 0.8;
}

/* Back to top button */
#backTop {
    background: var(--md-brand) !important;
    border-color: var(--md-brand) !important;
}

#backTop:hover {
    background: var(--md-brand-hover) !important;
    border-color: var(--md-brand-hover) !important;
}
