/* ============================================================
   ZAMIESZKAJ – Layout Components
   Nagłówek · Nawigacja · Hero · Stopka
   ============================================================ */

/* ============================================================
   NAGŁÓWEK
   ============================================================ */
.site-header {
    position:     fixed;
    top:          0;
    left:         0;
    right:        0;
    z-index:      1000;
    height:       var(--header-h);
    background:   var(--header-bg);
    backdrop-filter: blur(16px) saturate(180%);
    -webkit-backdrop-filter: blur(16px) saturate(180%);
    border-bottom: 1px solid transparent;
    transition:   border-color var(--transition), box-shadow var(--transition);
    display:      flex;
    align-items:  center;
}
.site-header > .container {
    display:      flex;
    align-items:  center;
    width:        100%;
    height:       100%;
}
.site-header.scrolled {
    border-bottom-color: var(--color-border);
    box-shadow: var(--shadow-sm);
}

.header-inner {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: var(--space-8);
    width: 100%;
}

/* Logo */
@import url('https://fonts.googleapis.com/css2?family=Plus+Jakarta+Sans:wght@700;800&display=swap');
.site-logo {
    display:     flex;
    align-items: center;
    gap:         10px;
    text-decoration: none;
    white-space: nowrap;
    flex-shrink: 0;
}
.site-logo__icon {
    width: 36px; height: 36px;
    flex-shrink: 0;
}
.site-logo__icon img, .site-logo__icon svg {
    width: 100%; height: 100%;
}
.site-logo__wordmark {
    display: flex;
    flex-direction: column;
    line-height: 1;
}
.site-logo__name {
    font-family: 'Plus Jakarta Sans', system-ui, sans-serif;
    font-weight: 800;
    font-size: 1.1rem;
    letter-spacing: -.03em;
    color: #111;
    line-height: 1.1;
}
.site-logo__name em {
    font-style: normal;
    color: var(--color-primary);
}
.site-logo__domain {
    font-family: 'Plus Jakarta Sans', system-ui, sans-serif;
    font-size: .65rem;
    font-weight: 600;
    letter-spacing: .01em;
    color: #9ca3af;
    margin-top: 2px;
    font-style: italic;
}

/* Główna nawigacja */
.nav-primary {
    display:     flex;
    align-items: center;
    gap:         var(--space-2);
    flex:        1;
}
.nav-primary__link {
    padding:       var(--space-2) var(--space-4);
    border-radius: var(--radius);
    font-size:     var(--text-sm);
    font-weight:   var(--weight-medium);
    color:         var(--color-text-2);
    transition:    color var(--transition-fast), background var(--transition-fast);
    white-space:   nowrap;
}
.nav-primary__link:hover,
.nav-primary__link.active {
    color:      var(--color-text);
    background: var(--color-surface-2);
}
.nav-primary__link.active { font-weight: var(--weight-semi); }

/* ── Dropdown ── */
.nav-primary__list {
    display: flex;
    align-items: center;
    gap: var(--space-2);
    list-style: none;
    margin: 0; padding: 0;
    flex: 1;
}
.nav-primary__item {
    position: relative;
}
.nav-primary__toggle {
    display: inline-flex;
    align-items: center;
    background: none;
    border: none;
    padding: 4px 2px;
    cursor: pointer;
    color: var(--color-text-2);
    transition: transform .2s;
    vertical-align: middle;
    margin-left: -4px;
}
.nav-primary__item.has-dropdown:hover .nav-primary__toggle,
.nav-primary__item.has-dropdown.open .nav-primary__toggle {
    color: var(--color-text);
}
.nav-primary__item.open .nav-primary__toggle {
    transform: rotate(180deg);
}
.nav-primary__dropdown {
    display: none;
    position: absolute;
    top: calc(100% + 6px);
    left: 0;
    min-width: 200px;
    background: #fff;
    border: 1px solid #e5e7eb;
    border-radius: 10px;
    box-shadow: 0 8px 24px rgba(0,0,0,.10);
    list-style: none;
    margin: 0; padding: 6px;
    z-index: 500;
}
.nav-primary__item.open .nav-primary__dropdown,
.nav-primary__item:focus-within .nav-primary__dropdown {
    display: block;
}
.nav-primary__sub-link {
    display: block;
    padding: 9px 12px;
    font-size: var(--text-sm);
    font-weight: var(--weight-medium);
    color: var(--color-text-2);
    text-decoration: none;
    border-radius: 7px;
    white-space: nowrap;
    transition: background .12s, color .12s;
}
.nav-primary__sub-link:hover,
.nav-primary__sub-link.active {
    background: var(--color-surface-2);
    color: var(--color-text);
}


/* Prawy panel nagłówka */
.header-actions {
    display:     flex;
    align-items: center;
    gap:         var(--space-3);
    flex-shrink: 0;
}
.header-city-badge {
    display:     flex;
    align-items: center;
    gap:         var(--space-2);
    padding:     var(--space-1) var(--space-3);
    background:  var(--color-primary-soft);
    color:       var(--color-primary);
    border-radius: var(--radius-full);
    font-size:   var(--text-xs);
    font-weight: var(--weight-semi);
    letter-spacing: .03em;
}

/* Hamburger (mobile) */
/* ============================================================
   HERO
   ============================================================ */
.hero {
    position:    relative;
    min-height:  580px;
    display:     flex;
    align-items: center;
    overflow:    hidden;
    padding-top: calc(var(--header-h) + var(--space-16));
    padding-bottom: var(--space-20);
}
.hero__bg {
    position:   absolute;
    inset:      0;
    z-index:    0;
}
.hero__bg img {
    width: 100%; height: 100%; object-fit: cover;
}
.hero__bg::after {
    content:    '';
    position:   absolute;
    inset:      0;
    background: linear-gradient(
        105deg,
        rgba(250,250,248,.97) 0%,
        rgba(250,250,248,.92) 38%,
        rgba(250,250,248,.6)  65%,
        rgba(250,250,248,.1)  100%
    );
}
.hero__content {
    position:  relative;
    z-index:   1;
    max-width: 640px;
}
.hero__eyebrow {
    display:         inline-flex;
    align-items:     center;
    gap:             var(--space-2);
    font-size:       var(--text-xs);
    font-weight:     var(--weight-semi);
    text-transform:  uppercase;
    letter-spacing:  .1em;
    color:           var(--color-primary);
    margin-bottom:   var(--space-5);
}
.hero__title {
    font-family:   var(--font-serif);
    font-size:     clamp(2.5rem, 5vw, 4.5rem);
    line-height:   var(--leading-tight);
    letter-spacing: -.02em;
    color:         var(--color-text);
    margin-bottom: var(--space-6);
}
.hero__title em {
    font-style: italic;
    color:      var(--color-primary);
}
.hero__subtitle {
    font-size:     var(--text-md);
    line-height:   var(--leading-loose);
    color:         var(--color-text-2);
    margin-bottom: var(--space-8);
    max-width:     500px;
}
.hero__actions {
    display:     flex;
    flex-wrap:   wrap;
    gap:         var(--space-4);
    align-items: center;
}
.hero__scroll-hint {
    display:    flex;
    align-items: center;
    gap:        var(--space-2);
    font-size:  var(--text-xs);
    color:      var(--color-text-3);
    margin-top: var(--space-12);
    letter-spacing: .04em;
}
.hero__scroll-line {
    width: 32px; height: 1px;
    background: var(--color-border);
}

/* Stats bar pod hero */
.hero-stats {
    background: var(--color-surface);
    border-top:    1px solid var(--color-border);
    border-bottom: 1px solid var(--color-border);
}
.hero-stats__inner {
    display: flex;
    justify-content: space-around;
    padding-block: var(--space-6);
    text-align: center;
    gap: var(--space-4);
}
.hero-stats__item { flex: 1; }
.hero-stats__value {
    font-family: var(--font-serif);
    font-size:   var(--text-2xl);
    color:       var(--color-text);
    line-height: 1;
}
.hero-stats__value span { color: var(--color-primary); }
.hero-stats__label {
    font-size:  var(--text-xs);
    color:      var(--color-text-3);
    text-transform: uppercase;
    letter-spacing: .06em;
    margin-top: var(--space-2);
}
.hero-stats__divider {
    width: 1px;
    background: var(--color-border);
    align-self: stretch;
}

/* ============================================================
   STOPKA
   ============================================================ */
.site-footer {
    background:  var(--color-text);
    color:       rgba(255,255,255,.7);
    padding-top: var(--space-20);
}
.footer-grid {
    display:               grid;
    grid-template-columns: 2fr 1fr 1fr 1fr;
    gap:                   var(--space-12);
    padding-bottom:        var(--space-16);
    border-bottom:         1px solid rgba(255,255,255,.1);
}
.footer-brand__logo {
    font-family: var(--font-serif);
    font-size:   var(--text-2xl);
    color:       #fff;
    margin-bottom: var(--space-4);
    word-break: break-word;
    line-height: 1.2;
}
@media(max-width:480px){
    .footer-brand__logo { font-size: 1.4rem; }
}
.footer-brand__logo span { color: var(--color-primary); font-style: italic; }
.footer-brand__desc {
    font-size:  var(--text-sm);
    line-height: var(--leading-loose);
    color:      rgba(255,255,255,.55);
    max-width:  280px;
}
.footer-col__title {
    font-size:   var(--text-xs);
    font-weight: var(--weight-semi);
    text-transform: uppercase;
    letter-spacing: .1em;
    color:       rgba(255,255,255,.4);
    margin-bottom: var(--space-5);
}
.footer-col__links { display: flex; flex-direction: column; gap: var(--space-3); }
.footer-col__link {
    font-size:   var(--text-sm);
    color:       rgba(255,255,255,.6);
    transition:  color var(--transition-fast);
}
.footer-col__link:hover { color: #fff; }

.footer-bottom {
    display:          flex;
    justify-content:  space-between;
    align-items:      center;
    padding-block:    var(--space-6);
    font-size:        var(--text-xs);
    color:            rgba(255,255,255,.35);
    gap:              var(--space-4);
    flex-wrap:        wrap;
}
.footer-bottom a { color: rgba(255,255,255,.45); transition: color var(--transition-fast); }
.footer-bottom a:hover { color: rgba(255,255,255,.8); }

/* ============================================================
   BREADCRUMBS
   ============================================================ */
.breadcrumbs {
    display: flex; align-items: center; gap: var(--space-2);
    font-size: var(--text-xs); color: var(--color-text-3);
    padding-block: var(--space-4);
    flex-wrap: wrap;
}
.breadcrumbs a { color: var(--color-text-3); transition: color var(--transition-fast); }
.breadcrumbs a:hover { color: var(--color-text); }
.breadcrumbs__sep { color: var(--color-border-hover); }
.breadcrumbs__current { color: var(--color-text-2); }

/* ============================================================
   RESPONSIVE
   ============================================================ */
@media (max-width: 1024px) {
    .footer-grid { grid-template-columns: 1fr 1fr; }
    .footer-brand { grid-column: 1 / -1; }
}
@media (max-width: 768px) {
    .nav-primary, .header-city-badge { display: none; }
    .nav-toggle { display: flex; }

    .hero { min-height: 480px; padding-top: calc(var(--header-h) + var(--space-10)); }
    .hero__bg::after {
        background: linear-gradient(
            180deg,
            rgba(250,250,248,.98) 0%,
            rgba(250,250,248,.92) 50%,
            rgba(250,250,248,.75) 100%
        );
    }

    .hero-stats__inner { flex-wrap: wrap; }
    .hero-stats__divider { display: none; }
    .hero-stats__item { flex: 1 0 40%; }

    .footer-grid { grid-template-columns: 1fr 1fr; gap: var(--space-8); }
    .footer-bottom { flex-direction: column; text-align: center; }
}
@media (max-width: 480px) {
    .footer-grid { grid-template-columns: 1fr; }
    .hero__actions { flex-direction: column; align-items: flex-start; }
}

/* ═══════════════════════════════════════════════════════════════
   MOBILE NAV – poprawki dostępności i animacja
═══════════════════════════════════════════════════════════════ */
.nav-mobile{
    position:fixed;
    top:var(--header-h);right:0;bottom:0;
    width:min(320px,85vw);
    background:#fff;
    border-left:1px solid #e5e7eb;
    transform:translateX(100%);
    transition:transform .3s cubic-bezier(.4,0,.2,1);
    z-index:200;
    display:flex;
    flex-direction:column;
    padding:24px 0;
    box-shadow:-4px 0 24px rgba(0,0,0,.12);
    overflow-y:auto;
}
.nav-mobile.is-open{transform:translateX(0);}
.nav-mobile__link{
    display:block;
    padding:14px 24px;
    font-size:1rem;
    font-weight:600;
    color:#111;
    text-decoration:none;
    border-bottom:1px solid #f3f4f6;
    transition:background .15s,color .15s;
}
.nav-mobile__link:hover{background:#f0fdf4;color:#1a6b45;}
.nav-mobile__link.active{color:#1a6b45;background:#f0fdf4;}
/* Lista podmenu z WP menu */
.nav-mobile__list { list-style:none; margin:0; padding:0; }
.nav-mobile__list > li { padding:0; margin:0; list-style:none; }
.nav-mobile__item { border-bottom:1px solid #f3f4f6; }
/* Fallback gdy brak Walkera - plain <a> */
.nav-mobile__list > li > a.nav-mobile__link { border-bottom:1px solid #f3f4f6; }
.nav-mobile__row { display:flex; align-items:stretch; }
.nav-mobile__sub-toggle {
    background:none; border:none; border-left:1px solid #f3f4f6;
    padding:0 18px; cursor:pointer; color:#6b7280;
    transition:transform .2s, background .15s;
}
.nav-mobile__sub-toggle:hover { background:#f9fafb; }
.nav-mobile__sub-toggle[aria-expanded="true"] { transform:rotate(180deg); }
.nav-mobile__sub {
    display:none;
    background:#f9fafb;
    border-top:1px solid #f3f4f6;
}
.nav-mobile__sub.is-open { display:block; }
.nav-mobile__sub-link {
    display:block;
    padding:11px 24px 11px 36px;
    font-size:.9rem;
    font-weight:500;
    color:#374151;
    text-decoration:none;
    border-bottom:1px solid #f3f4f6;
    transition:background .12s, color .12s;
}
.nav-mobile__sub-link:last-child { border-bottom:none; }
.nav-mobile__sub-link:hover, .nav-mobile__sub-link.active { background:#f0fdf4; color:#1a6b45; }

.nav-overlay{
    display:none;
    position:fixed;inset:0;
    background:rgba(0,0,0,.4);
    z-index:190;
    backdrop-filter:blur(2px);
}
.nav-overlay.is-open{display:block;}

/* Hamburger */
.nav-toggle{
    display:none;
    flex-direction:column;
    justify-content:center;
    gap:5px;
    width:40px;height:40px;
    background:transparent;
    border:1px solid #e5e7eb;
    border-radius:8px;
    cursor:pointer;
    padding:8px;
}
.nav-toggle span{
    display:block;height:2px;
    background:#111;border-radius:2px;
    transition:all .25s;
}
.nav-toggle[aria-expanded="true"] span:nth-child(1){transform:translateY(7px) rotate(45deg);}
.nav-toggle[aria-expanded="true"] span:nth-child(2){opacity:0;}
.nav-toggle[aria-expanded="true"] span:nth-child(3){transform:translateY(-7px) rotate(-45deg);}

/* ── Breakpoints ── */
@media(max-width:768px){
    .nav-primary{display:none;}
    .nav-toggle{display:flex;}
    .hide-mobile{display:none!important;}

    /* Nagłówek strony głównej na mobile */
    .fp-hero-kpi{grid-template-columns:1fr 1fr!important;}
    .fp-hero-btns{flex-direction:column;align-items:flex-start;}
    .fp-btn-primary,.fp-btn-outline{width:100%;justify-content:center;}

    /* Ticker – wolniej na mobile */
    .fp-ticker-track{animation-duration:60s;}
}
@media(max-width:480px){
    .fp-hero-kpi{grid-template-columns:1fr!important;}
    .fp-kpi-card[style*="grid-column"]{grid-column:auto!important;}

    /* Wykresy – tabela historii ukryta, wykres pełna szerokość */
    .fp-history-table{display:none!important;}
    .fp-tab-panel.active{grid-template-columns:1fr!important;}

    /* Cennik – stack */
    .fp-pricing-card.popular{transform:none!important;}

    /* Trans grid */
    .fp-trans-grid{grid-template-columns:1fr!important;}

    /* Artykuły grid */
    .fp-articles-grid{grid-template-columns:1fr!important;}

    /* Hero h1 */
    .fp-hero h1{font-size:clamp(1.7rem,8vw,2.2rem)!important;}
    .fp-hero-inner{padding:40px 16px 80px!important;}
    .fp-section-wrap{padding:0 16px!important;}
}

/* ── Ogólne poprawki mobile ── */
@media(max-width:600px){
    .art-layout{grid-template-columns:1fr!important;padding:16px!important;}
    .art-related-grid{grid-template-columns:1fr!important;}
    .arc2-main{grid-template-columns:1fr!important;padding:0 16px!important;}
    .arc2-filters-inner{gap:6px;}
    .inv2-grid{grid-template-columns:1fr!important;}
    .arc-inv-grid{grid-template-columns:1fr!important;}
}

/* ── Focus visible dla dostępności ── */
:focus-visible{
    outline:3px solid #1a6b45;
    outline-offset:2px;
    border-radius:3px;
}

/* Klikalne wiersze tabeli trendów */
tr[data-tab]:hover td { background: #f0fdf4; }
tr[data-tab] { transition: background .15s; }
tr.current-year td { background: #f0fdf4 !important; }

/* ═══════════════════════════════════════════════════════════════
   MOBILE FIXES v19h – kompleksowy przegląd
═══════════════════════════════════════════════════════════════ */

/* ── Header ── */
@media(max-width:768px){
    .site-header > .container { padding: 0 12px; }
    .site-logo__domain { display: none; }
    .site-logo__name { font-size: .78rem; letter-spacing: -.02em; }
    .site-logo__icon { width: 24px; height: 24px; }
    .site-logo { gap: 7px; }
    .site-logo__name em { font-style: italic; }
}

/* ── Front-page hero ── */
@media(max-width:768px){
    .fp-section-wrap { padding: 0 16px !important; }
    .fp-map-header { flex-direction: column; align-items: flex-start; gap: 10px; }
    .fp-map-btn { width: 100%; justify-content: center; }
}

/* ── Ticker ── */
@media(max-width:480px){
    .fp-ticker { font-size: .72rem; }
}

/* ── Wykresy RCN ── */
@media(max-width:768px){
    .fp-charts-grid { grid-template-columns: 1fr !important; }
    .fp-ctabs { overflow-x: auto; white-space: nowrap; padding-bottom: 4px; }
    .fp-ctab { font-size: .75rem; padding: 7px 12px; }
}

/* ── Kalkulator na stronie głównej ── */
@media(max-width:768px){
    .fp-calc-wrap { grid-template-columns: 1fr !important; gap: 24px; }
    .fp-calc-facts { display: none; } /* ukryj ikonki na mobile */
}
@media(max-width:480px){
    .fp-calc-res-grid { grid-template-columns: 1fr 1fr !important; }
}

/* ── Inwestycje grid ── */
@media(max-width:600px){
    .fp-inv-grid { grid-template-columns: 1fr !important; }
    .fp-inv-banner__body { padding: 20px !important; }
}

/* ── Cennik ── */
@media(max-width:600px){
    .fp-pricing-grid { grid-template-columns: 1fr !important; }
    .fp-pricing-card.popular { transform: none !important; }
}

/* ── Transakcje ── */
@media(max-width:768px){
    .fp-trans-grid { grid-template-columns: 1fr !important; gap: 24px; }
}

/* ── Artykuły ── */
@media(max-width:600px){
    .fp-articles-grid { grid-template-columns: 1fr !important; }
}

/* ── Sekcja trendów cen (tabela) ── */
@media(max-width:768px){
    .fp-trends-wrap { grid-template-columns: 1fr !important; }
}

/* ── Blog archive ── */
@media(max-width:768px){
    .arc2-main { grid-template-columns: 1fr !important; }
    .arc2-sidebar { display: none; } /* sidebar ukryty na mobile */
}
@media(max-width:600px){
    .arc2-cards { grid-template-columns: 1fr !important; }
    .arc2-feat-inner { flex-direction: column !important; }
    .arc2-feat-img { width: 100% !important; height: 200px !important; }
}

/* ── Strona inwestycji ── */
@media(max-width:768px){
    .inv2-hero-inner { flex-direction: column !important; }
    .inv2-header-main { padding: 20px !important; }
}

/* ── Kalkulator kredytowy (page-kalkulator) ── */
@media(max-width:768px){
    .kalk-wrap { flex-direction: column !important; }
    .kalk-sidebar { width: 100% !important; }
    .kalk-grid { grid-template-columns: 1fr 1fr !important; }
    .cl-offer { grid-template-columns: auto 1fr !important; }
    .cl-offer-cta { grid-column: 2; }
    .cl-lead-row { grid-template-columns: 1fr !important; }
}
@media(max-width:480px){
    .kalk-grid { grid-template-columns: 1fr !important; }
    .kalk-result-grid { grid-template-columns: 1fr 1fr !important; }
}

/* ── Kontakt ── */
@media(max-width:768px){
    .kontakt-grid { grid-template-columns: 1fr !important; }
    .kc-grid { grid-template-columns: 1fr !important; }
    .kontakt-comperia-inner { padding: 0 16px; }
}

/* ── Ceny RCN ── */
@media(max-width:768px){
    .rcn-hero { padding: 80px 16px 40px !important; }
    .rcn-grid { grid-template-columns: 1fr !important; }
}

/* ── Mobile nav - dodaj kalkulator ── */
/* (kalkulator link dodany w header.php) */

/* ── Ogólne ── */
@media(max-width:480px){
    h1 { font-size: clamp(1.5rem, 7vw, 2rem) !important; }
    .container { padding-left: 16px !important; padding-right: 16px !important; }
}

/* ── Dodatkowe poprawki mobile po review screenshota ── */
@media(max-width:768px){
    /* Header - zwężony */
    .header-inner { gap: 8px; }
    .btn--sm { padding: 8px 14px !important; font-size: .78rem !important; }

    /* Ticker - mniejszy padding */
    .fp-ticker-section { padding: 10px 0; }

    /* Sekcja map teaser - mniejsza na mobile */
    .fp-map-section { padding: 32px 0; }

    /* Sekcja wykresy - pełna szerokość */
    .fp-charts-section { padding: 32px 0; }

    /* Inwestycje - mniejszy padding */
    .fp-inv-section { padding: 32px 0; }
    .fp-inv-grid { grid-template-columns: 1fr !important; }

    /* Kalkulator - mniejszy padding */
    .fp-calc-section { padding: 40px 0; }
    .fp-calc-facts { display: none !important; }

    /* Artykuły */
    .fp-articles-section { padding: 32px 0; }

    /* Cennik */
    .fp-pricing-section { padding: 32px 0; }
    .fp-pricing-grid { grid-template-columns: 1fr !important; }

    /* Transakcje */
    .fp-trans-section { padding: 32px 0; }
    .fp-trans-grid { grid-template-columns: 1fr !important; }

    /* Footer */
    .footer-grid { grid-template-columns: 1fr !important; }
    .footer-brand { margin-bottom: 0; }
}

@media(max-width:480px){
    /* Logo - max-width żeby nie wychodził za ekran */
    .site-logo { max-width: calc(100vw - 120px); overflow: hidden; }
    .site-logo__name { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }

    /* Kontakt button w header - ukryj tekst zostawiając ikonę gdy za wąsko */
    .hide-mobile { display: none !important; }
}