/**
 * =============================================================================
 * Apartmore Design System (Faza 2 Tor B)
 * =============================================================================
 * Wspólny fundament dla 4 nowych szablonów: front-page, archive-apartamenty,
 * single-apartamenty, page-wlasciciele.
 *
 * Zawiera: CSS variables (paleta + typografia), reset, header (.hdr + .nav +
 * mobile overlay), btn, footer, focus a11y.
 *
 * NIE zawiera: hero/feat/listing/lightbox/B2B-specific — te są w plikach
 * per-template (front-page.css, archive.css, single.css, b2b.css).
 *
 * Źródło wzorca: Claude Design handoff (2026-04-19), pliki w
 * Claude Desing-Mockups/Praca nad stron_ apartmore/handoff/.
 * =============================================================================
 */

:root{
    --ink:#343130; --ink-2:#616161; --ink-3:#A39E9A;
    --paper:#FFFFFF; --cream:#FAF7F2; --stone:#F3F0EA;
    --amber:#A37753; --amber-2:#8d623f; --amber-light:#B48B59;
    --sand:#E0C28E; --burgundy:#5C2B2E;
    --line:#ece5d7;
    --shadow:0 10px 40px -12px rgba(52,49,48,.18);
    --shadow-lg:0 24px 60px -20px rgba(52,49,48,.3);
    --display:'Bebas Neue',Impact,sans-serif;
    --sans:'Montserrat',-apple-system,BlinkMacSystemFont,sans-serif;
    --mono:'JetBrains Mono',ui-monospace,monospace;
}

/* ---------- RESET / BASE ---------- */
*{box-sizing:border-box;margin:0;padding:0}
html,body{background:var(--cream);font-family:var(--sans);color:var(--ink);-webkit-font-smoothing:antialiased}
img{max-width:100%;display:block}
a{color:inherit}

/* ---------- BUTTONS (shared) ---------- */
.btn{display:inline-flex;align-items:center;gap:8px;padding:14px 26px;border-radius:999px;text-decoration:none;cursor:pointer;border:none;transition:transform .15s,background .2s;white-space:nowrap;font-family:var(--display);letter-spacing:.18em;text-transform:uppercase;font-size:16px}
.btn-primary{background:var(--amber);color:#fff;padding:15px 28px 13px}
.btn-primary:hover{background:var(--amber-2)}
.btn-ghost{border:1px solid rgba(255,255,255,.45);color:#fff;background:transparent;padding:12px 22px 10px}

/* ---------- HEADER (shared markup, scroll/transparency varies per template) ---------- */
.hdr{position:sticky;top:0;z-index:50;height:80px;display:flex;align-items:center;padding:0 56px;
     transition:background .35s ease,box-shadow .35s ease,color .35s ease;color:#fff}
.hdr.scrolled{background:rgba(255,255,255,.97);backdrop-filter:saturate(1.2) blur(8px);box-shadow:0 1px 0 rgba(52,49,48,.06),0 8px 24px -16px rgba(52,49,48,.2);color:var(--ink)}
.hdr.scrolled .btn-ghost{border-color:rgba(52,49,48,.2);color:var(--ink)}

/* opaque (used on archive/single/b2b — header-on-light pages) */
.hdr.opaque{background:rgba(250,247,242,.97);backdrop-filter:saturate(1.2) blur(8px);color:var(--ink);box-shadow:0 1px 0 rgba(52,49,48,.06)}

.logo{font-family:var(--display);font-weight:400;font-size:28px;letter-spacing:.22em;display:flex;align-items:baseline;text-decoration:none;color:inherit}
.logo .dot-a{width:6px;height:6px;border-radius:50%;background:var(--amber);display:inline-block;margin-left:4px;transform:translateY(-4px)}

.nav{margin-left:auto;display:flex;align-items:center;gap:32px;font:500 14px var(--sans);letter-spacing:.12em;text-transform:uppercase}
.nav a{color:inherit;text-decoration:none;opacity:.88;transition:opacity .2s;position:relative;padding:4px 0}
.nav a[aria-current]{opacity:1;color:var(--amber)}
.nav a:hover{opacity:1}
.nav a:hover::after{content:"";position:absolute;left:0;right:0;bottom:-2px;height:1px;background:var(--amber)}

.lang{font-size:11px;letter-spacing:.16em;opacity:.75;display:inline-flex;gap:4px;align-items:center}
.lang a{text-decoration:none;opacity:.88;color:inherit}
.lang a.active,.lang b{color:var(--amber);font-weight:700;opacity:1}

.burger{display:none;width:42px;height:42px;border-radius:50%;border:1px solid currentColor;background:transparent;color:inherit;cursor:pointer;align-items:center;justify-content:center;margin-left:auto}
.burger span{display:block;width:16px;height:1.5px;background:currentColor;position:relative}
.burger span::before,.burger span::after{content:"";position:absolute;left:0;width:16px;height:1.5px;background:currentColor}
.burger span::before{top:-5px}.burger span::after{top:5px}

@media (max-width:900px){
  .hdr{padding:0 24px;height:70px}
  .nav{display:none}
  .burger{display:inline-flex}
}

/* ---------- MOBILE NAV OVERLAY ---------- */
/* 2026-06-04 (#8 mobile): z-index PODNIESIONE z 100 → 1100. Sticky .hdr ma
 * z-index:1000 (override dla Leaflet markerów [[feedback_apartmore_leaflet_zindex]]).
 * Bez tego header (logo + hamburger) prześwitywał przez overlay menu — user
 * widział 2 kółka (hamburger i X) jednocześnie. */
.m-overlay{position:fixed;inset:0;background:var(--ink);color:#fff;z-index:1100;padding:28px 24px;opacity:0;pointer-events:none;transition:opacity .3s;display:flex;flex-direction:column}
.m-overlay.open{opacity:1;pointer-events:auto}
.m-overlay-hdr{display:flex;align-items:center;margin-bottom:44px}
.m-nav{display:flex;flex-direction:column;gap:2px;margin-top:8px}
.m-nav a{font-family:var(--display);font-size:42px;letter-spacing:.05em;text-transform:uppercase;color:#fff;text-decoration:none;padding:10px 0;border-bottom:1px solid rgba(255,255,255,.08);display:flex;align-items:baseline;gap:16px}
.m-nav a .num{font-family:var(--sans);font-size:10px;color:var(--amber);letter-spacing:.22em;font-weight:600}
.m-foot{margin-top:auto;padding-top:22px;border-top:1px solid rgba(255,255,255,.12);display:flex;flex-direction:column;gap:14px}
.m-foot .phone-link{font-family:var(--display);font-size:26px;letter-spacing:.08em;color:#e8d5bd;text-decoration:none}
.m-foot .phone-link small{font:600 10px var(--sans);color:var(--ink-3);letter-spacing:.22em;text-transform:uppercase;display:block;margin-bottom:6px}

/* ---------- FOOTER (shared) ---------- */
footer.site-footer{background:var(--ink);color:#bcb7af;padding:72px 56px 32px;font:400 13px var(--sans)}
@media (max-width:900px){footer.site-footer{padding:48px 24px 24px}}
/* 2026-06-05 (#18): 5→4 kolumny po usunięciu Newsletter (1.2fr ostatnia col).
 * Logo column dostaje proporcjonalnie więcej miejsca. */
.ft-grid{max-width:1280px;margin:0 auto;display:grid;grid-template-columns:1.8fr 1fr 1fr 1fr;gap:40px}

/* 2026-06-05 (#18): Strony statyczne (regulamin, polityka prywatności) — czysta typografia
 * w bogatym contentcie WordPress. Reset stylów parent theme + sensible defaults. */
.apm-page-static{background:var(--cream);padding:72px 24px;min-height:60vh}
.apm-page-static__wrap{max-width:780px;margin:0 auto}
.apm-page-static__header{margin-bottom:48px;padding-bottom:24px;border-bottom:1px solid var(--line)}
.apm-page-static__title{font-family:var(--display);font-weight:400;font-size:clamp(36px,5vw,52px);letter-spacing:.04em;text-transform:uppercase;line-height:1.05;color:var(--ink)}
.apm-page-static__content{font:300 16px/1.75 var(--sans);color:var(--ink)}
.apm-page-static__content h2{font-family:var(--display);font-weight:400;font-size:clamp(22px,2.4vw,30px);letter-spacing:.04em;text-transform:uppercase;color:var(--ink);margin:48px 0 16px}
.apm-page-static__content h3{font-family:var(--display);font-weight:400;font-size:clamp(18px,2vw,22px);letter-spacing:.04em;text-transform:uppercase;color:var(--ink);margin:32px 0 12px}
.apm-page-static__content h4{font-weight:600;font-size:16px;color:var(--ink);margin:24px 0 8px}
.apm-page-static__content p{margin:0 0 16px}
.apm-page-static__content ul,.apm-page-static__content ol{margin:0 0 16px;padding-left:24px}
.apm-page-static__content li{margin-bottom:6px}
.apm-page-static__content a{color:var(--amber);text-decoration:underline;text-underline-offset:3px}
.apm-page-static__content a:hover{color:var(--amber-2)}
.apm-page-static__content strong{color:var(--ink);font-weight:600}
.apm-page-static__content hr{border:0;border-top:1px solid var(--line);margin:32px 0}
.apm-page-static__content blockquote{border-left:3px solid var(--amber);padding-left:20px;margin:24px 0;color:var(--ink-2);font-style:italic}
@media (max-width:680px){.apm-page-static{padding:48px 20px}}
@media (max-width:900px){.ft-grid{grid-template-columns:1fr 1fr;gap:32px}}
.ft-logo{font-family:var(--display);font-size:26px;letter-spacing:.22em;color:#fff;display:flex;align-items:baseline;margin-bottom:14px;text-decoration:none}
.ft-logo .dot-a{width:5px;height:5px;border-radius:50%;background:var(--amber);margin-left:4px;transform:translateY(-4px)}
.ft-col p{line-height:1.65;margin-bottom:16px;max-width:360px}
.ft-col h5{font:600 11px var(--sans);letter-spacing:.22em;text-transform:uppercase;color:#fff;margin-bottom:16px}
.ft-col ul{list-style:none;display:flex;flex-direction:column;gap:9px}
.ft-col a{color:inherit;text-decoration:none;transition:color .2s}
.ft-col a:hover{color:var(--amber)}
.social{display:flex;gap:10px;margin-top:6px}
.social a{width:34px;height:34px;border:1px solid #494440;border-radius:50%;display:grid;place-items:center;color:#bcb7af;transition:all .2s}
.social a:hover{border-color:var(--amber);color:var(--amber)}
.social svg{width:15px;height:15px;stroke:currentColor;stroke-width:1.6;fill:none;stroke-linecap:round;stroke-linejoin:round}
.news input{width:100%;background:transparent;border:none;border-bottom:1px solid #494440;color:#fff;padding:10px 0;font:400 13px var(--sans);outline:none;margin-bottom:10px}
.news input:focus{border-color:var(--amber)}
.news button{background:var(--amber);color:#fff;border:none;padding:10px 18px 8px;font:400 12px var(--display);letter-spacing:.18em;text-transform:uppercase;border-radius:2px;cursor:pointer}
.copy{max-width:1280px;margin:48px auto 0;padding-top:20px;border-top:1px solid #494440;display:flex;justify-content:space-between;gap:16px;flex-wrap:wrap;color:#8f8a82;font-size:12px}
/* 2026-06-05 (#19): multi-line dane firmy w dolnym pasku — left-aligned, naturalna typografia. */
.copy__legal{font-style:normal;line-height:1.6}
.copy__legal strong{color:#bcb7af;font-weight:600}

/* ---------- COMMON: eyebrow / breadcrumbs ---------- */
.eyebrow{font:500 11px var(--sans);letter-spacing:.32em;text-transform:uppercase;opacity:.88;margin-bottom:22px;display:flex;align-items:center;gap:14px}
.eyebrow::before{content:"";width:32px;height:1px;background:var(--amber)}

.crumbs{font:500 11px var(--sans);letter-spacing:.14em;text-transform:uppercase;color:var(--ink-3);margin-bottom:20px;display:flex;gap:10px;flex-wrap:wrap}
.crumbs a{color:var(--amber);text-decoration:none}
.crumbs span.sep{color:var(--ink-3)}

/* ---------- A11Y ---------- */
:focus-visible{outline:2px solid var(--amber);outline-offset:3px;border-radius:2px}
.screen-reader-text{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}

/* ---------- WP body classes — auto opaque header on non-home ---------- */
body:not(.home):not(.front-page) .hdr{background:rgba(250,247,242,.97);backdrop-filter:saturate(1.2) blur(8px);color:var(--ink);box-shadow:0 1px 0 rgba(52,49,48,.06)}

/* Menu nav list reset - primary-v2 (added 2026-04-19 menu-fix) */
.hdr .nav li{list-style:none;padding:0;margin:0;display:inline-flex;align-items:center}
.hdr .nav ul{list-style:none;padding:0;margin:0;display:contents}

/* ============================================================
 * Fix REZERWUJ button w .nav — `.nav a` ma padding 4px 0px co wygrywa
 * specyficznością nad .btn/.btn-primary. Override z wyższą specyficznością.
 * 2026-05-14
 * ============================================================ */
.hdr .nav a.btn {
    padding: 14px 26px;
}
.hdr .nav a.btn-primary {
    padding: 15px 28px 13px;
}

/* 2026-06-04 (#8) v3: mclose ma teraz osobną klasę `.mclose-x` z inline SVG X
 * zamiast walczyć z `.burger` (która rysowała paski hamburgera).
 * SVG X jest czysty, bez konfliktów ::before/::after. */
.mclose-x {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 42px;
    height: 42px;
    border-radius: 50%;
    border: 1px solid #fff;
    background: transparent;
    color: #fff;
    cursor: pointer;
    margin-left: auto;
    padding: 0;
    transition: background .15s ease, transform .15s ease;
}
.mclose-x:hover,
.mclose-x:focus {
    background: rgba(255,255,255,0.08);
    transform: scale(1.05);
}
.mclose-x svg {
    display: block;
    /* SVG dzieci łapią pointer events tylko na paintowanych liniach. Wyłącz,
     * żeby cały button (kółko) łapał click — nawet gdy user kliknie obok cienkiej linii. */
    pointer-events: none;
}

/* =============================================================================
   Stopka — piąty słupek „Nowe inwestycje" (2026-08-02).
   Renderowany z footer-v2.php tylko w PL i tylko gdy podstrony są opublikowane.
   Klasa .ft-grid--5 jest na gridzie WYŁĄCZNIE wtedy, gdy słupek faktycznie jest —
   inaczej na EN/DE zostałaby pusta piąta kolumna. APM_INW_COL_CSS
   ========================================================================== */
.ft-grid--5{grid-template-columns:1.6fr 1fr 1fr 1.05fr 1fr;gap:32px}
@media (max-width:1100px){.ft-grid--5{grid-template-columns:1fr 1fr 1fr;gap:32px}}
@media (max-width:900px){.ft-grid--5{grid-template-columns:1fr 1fr;gap:32px}}
.ft-col--inw ul{gap:8px}
.ft-col--inw a{display:inline-block;line-height:1.45}
