
:root{
  --navy:#0E1F3C;
  --navy-2:#16294B;
  --navy-3:#1E3762;
  --gold:#C9A248;
  --gold-light:#E8D9B0;
  --gold-deep:#A9822F;
  --paper:#F6F4EF;
  --panel:#FFFFFF;
  --ink:#14171F;
  --muted:#6B7280;
  --line:#E4E1D8;
  --radius:16px;
  --radius-sm:10px;
  --shadow-card: 0 1px 2px rgba(14,31,60,.06), 0 8px 24px rgba(14,31,60,.08);
  --shadow-card-hover: 0 4px 10px rgba(14,31,60,.10), 0 24px 48px rgba(14,31,60,.18);
  --ff-display:'Montserrat',sans-serif;
  --ff-body:'Mulish',sans-serif;
  --ff-mono:'IBM Plex Mono',monospace;
}
*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth}
body{
  font-family:var(--ff-body);
  background:var(--paper);
  color:var(--ink);
  min-height:100vh;
  -webkit-font-smoothing:antialiased;
}
a{color:inherit;text-decoration:none}
button{font-family:inherit;cursor:pointer}
img{display:block;max-width:100%}

/* ══════ TOP STRIP (symuluje że jest wewnątrz cfteam.pl) ══════ */
.cfa-host-note{
  background:var(--navy); color:rgba(255,255,255,.55); font-family:var(--ff-mono);
  font-size:11px; text-align:center; padding:6px; letter-spacing:.04em;
}
.cfa-host-note b{color:var(--gold-light)}

/* ══════ PAGE HEADER (lekki, wewnątrz sekcji — bez menu/stopki WP) ══════ */
.cfa-page-head{
  background:
    linear-gradient(100deg, rgba(14,31,60,.94) 0%, rgba(14,31,60,.88) 30%, rgba(14,31,60,.55) 65%, rgba(14,31,60,.35) 100%),
    url('hero-bg.jpg');
  background-size:cover;
  background-position:center 35%;
  border-bottom:3px solid var(--gold);
  padding:44px 6vw 68px;
  position:relative;
}

.cfa-crumb{
  font-family:var(--ff-body); font-size:12.5px; color:rgba(255,255,255,.55);
  margin-bottom:16px; display:flex; gap:8px; align-items:center;
}
.cfa-crumb a{color:rgba(255,255,255,.75)}
.cfa-crumb a:hover{color:var(--gold-light)}
.cfa-head-row{display:flex;justify-content:space-between;align-items:flex-end;gap:24px;flex-wrap:wrap;position:relative;z-index:1}
.cfa-head-right{
  display:flex; flex-direction:column; align-items:flex-end; gap:20px;
  background:rgba(14,31,60,.55); backdrop-filter:blur(6px);
  padding:18px 20px; border-radius:var(--radius);
}

.cfa-head-advisor{display:flex; align-items:center; gap:16px}
.cfa-advisor-photo-wrap{
  width:126px; height:126px; border-radius:50%; overflow:hidden; flex-shrink:0;
  border:3px solid var(--gold); background:rgba(255,255,255,.06);
  box-shadow:0 14px 30px rgba(0,0,0,.38), 0 3px 8px rgba(0,0,0,.28), inset 0 0 0 4px var(--navy);
}
.cfa-advisor-photo-wrap img{width:100%; height:100%; object-fit:cover; object-position:top center}
.cfa-advisor-caption{display:flex; flex-direction:column; align-items:flex-start; gap:1px}
.cfa-advisor-name{font-family:var(--ff-display); font-weight:800; font-size:1.02rem; color:#fff}
.cfa-advisor-role{font-family:var(--ff-body); font-size:.7rem; color:rgba(255,255,255,.5); text-transform:uppercase; letter-spacing:.05em; margin-bottom:2px}
.cfa-advisor-phone{
  display:flex; align-items:center; gap:6px; margin-top:4px; font-family:var(--ff-body); font-weight:700;
  font-size:1rem; color:var(--gold-light); transition:color .15s;
}
.cfa-advisor-phone:hover{color:var(--gold)}
.cfa-signature-wrap{position:relative; height:44px; overflow:hidden; margin-top:2px}
.cfa-signature-text{
  font-family:'Alex Brush', cursive; font-size:2.15rem; line-height:1; color:var(--gold);
  display:inline-block; white-space:nowrap; position:relative; z-index:1;
  clip-path:inset(0 100% 0 0);
  animation:sig-reveal 1.3s cubic-bezier(.45,0,.2,1) .5s forwards;
}
.cfa-signature-underline{
  position:absolute; left:0; bottom:0; width:150px; height:12px; overflow:visible;
}
.cfa-signature-underline path{
  fill:none; stroke:var(--gold); stroke-width:1.4; stroke-linecap:round; opacity:.55;
  stroke-dasharray:230; stroke-dashoffset:230;
  animation:sig-underline 1s ease-out 1.7s forwards;
}
@keyframes sig-reveal{ to{ clip-path:inset(0 0 0 0); } }
@keyframes sig-underline{ to{ stroke-dashoffset:0; } }
.cfa-head-eyebrow{
  font-family:var(--ff-body); font-weight:700; font-size:12px; letter-spacing:.1em; color:var(--gold);
  text-transform:uppercase; margin-bottom:10px; display:flex; align-items:center; gap:8px;
}
.cfa-head-eyebrow::before{content:'';width:20px;height:1px;background:var(--gold)}
h1.cfa-page-title{
  font-family:var(--ff-display) !important; font-weight:800 !important; text-transform:uppercase !important;
  font-size:clamp(1.7rem,3.2vw,2.5rem) !important; color:#fff !important; line-height:1.15 !important;
  letter-spacing:0 !important; font-style:normal !important;
}
h1.cfa-page-title em{color:var(--gold) !important; font-style:normal !important}
.cfa-head-sub{color:rgba(255,255,255,.62); font-size:.95rem; margin-top:12px; max-width:480px; line-height:1.5}
.cfa-head-stats{display:flex; gap:28px; flex-wrap:wrap}
.cfa-head-stat{text-align:right}
.cfa-head-stat b{
  display:block; font-family:var(--ff-display); font-size:1.5rem; color:var(--gold); font-weight:800;
}
.cfa-head-stat span{font-size:11px; color:rgba(255,255,255,.5); letter-spacing:.04em}

/* Na mniejszych ekranach naturalne zawijanie flexboksa potrafiło ściskać
   nagłówek i blok doradcy na tej samej linii (nachodzące na siebie teksty).
   Wymuszamy więc czysty układ kolumnowy: najpierw tytuł, potem cały blok
   doradcy+statystyk pod spodem, na pełną szerokość. */
@media(max-width:640px){
  .cfa-head-row{flex-direction:column; align-items:flex-start; gap:22px}
  .cfa-head-right{align-items:flex-start; width:100%; box-sizing:border-box}
  .cfa-head-advisor{width:100%}
  .cfa-head-stats{width:100%; gap:24px}
  .cfa-advisor-photo-wrap{width:96px; height:96px}
  .cfa-signature-text{font-size:1.7rem}
}

/* ══════ SEARCH BAR — floating overlap card ══════ */
.cfa-searchbar-wrap{padding:0 6vw; margin-top:-46px; position:relative; z-index:5}
.cfa-searchbar{
  background:var(--panel); border-radius:var(--radius); box-shadow:var(--shadow-card);
  padding:18px; display:flex; gap:12px; flex-wrap:wrap; align-items:center;
  border:1px solid var(--line);
}
.cfa-searchbar input[type=text]{
  flex:1; min-width:220px; border:1px solid var(--line); border-radius:var(--radius-sm);
  padding:13px 16px; font-family:var(--ff-body); font-size:.92rem; background:var(--paper);
}
.cfa-searchbar input[type=text]:focus{outline:none; border-color:var(--gold-deep); background:#fff}
.cfa-searchbar-btn{
  background:var(--navy) !important; color:#fff !important; border:none !important; border-radius:var(--radius-sm) !important;
  padding:13px 26px; font-weight:600; font-size:.88rem; display:flex; align-items:center; gap:8px;
  transition:background .18s;
}
.cfa-searchbar-btn:hover{background:var(--gold-deep)}

/* ══════ LAYOUT ══════ */
.cfa-body-wrap{padding:40px 6vw 90px; max-width:1440px; margin:0 auto; display:grid; grid-template-columns:260px 1fr; gap:32px}
@media(max-width:900px){.cfa-body-wrap{grid-template-columns:minmax(0,1fr)}}

/* ── FILTER SIDEBAR ── */
.cfa-filters{
  background:var(--panel); border:1px solid var(--line); border-radius:var(--radius);
  padding:22px; align-self:start; position:sticky; top:20px;
}
.cfa-filters-head{display:flex; align-items:center; justify-content:space-between; margin-bottom:16px}
.cfa-filters h3{
  font-family:var(--ff-display); font-weight:700; font-size:1rem;
  color:var(--navy); text-transform:uppercase; letter-spacing:.03em;
}
.cfa-filters-chevron{display:none}
.cfa-filters-close-mobile{
  display:none; background:none !important; border:none !important; padding:4px; cursor:pointer; border-radius:6px !important; color:var(--navy) !important;
}
.cfa-filters-close-mobile:hover{background:var(--paper)}
.cfa-filters-apply-mobile{display:none}
.cfa-filters-trigger-mobile{
  display:none; align-items:center; gap:7px; background:var(--panel) !important; border:1px solid var(--line) !important;
  border-radius:var(--radius-sm) !important; padding:10px 16px; font-family:var(--ff-body); font-weight:700;
  font-size:.85rem; color:var(--navy) !important; flex-shrink:0;
}
.cfa-filters-backdrop{display:none}

.cfa-filters-sticky-bar{display:none}
@media(max-width:900px){
  .cfa-filters-sticky-bar{
    display:block; position:fixed; top:0; left:0; right:0; z-index:50;
    background:var(--panel); border-bottom:1px solid var(--line); padding:10px 6vw;
    transform:translateY(-110%); transition:transform .25s ease; box-shadow:0 4px 16px rgba(14,31,60,.12);
  }
  .cfa-filters-sticky-bar.cfa-visible{transform:translateY(0)}
}

/* Na telefonach/tabletach filtry wysuwają się jako panel boczny (drawer) z
   przyciemnionym tłem, zamiast być stale widoczne w kolumnie — inaczej cała
   lista aut jest zepchnięta poniżej ekranu. Otwiera go przycisk "Filtry" przy
   liczniku wyników; zamyka X w panelu, kliknięcie w tło, albo "Pokaż wyniki". */
@media(max-width:900px){
  .cfa-filters{
    position:fixed; top:0; left:0; height:100vh; width:88%; max-width:360px;
    border-radius:0; border:none; z-index:70; overflow-y:auto;
    box-shadow:0 0 50px rgba(0,0,0,.3);
    transform:translateX(-105%); transition:transform .3s cubic-bezier(.4,0,.2,1);
  }
  .cfa-filters.cfa-mobile-expanded{transform:translateX(0)}
  .cfa-filters-close-mobile{display:flex}
  .cfa-filters-trigger-mobile{display:inline-flex}
  .cfa-filters-backdrop{
    display:block; position:fixed; inset:0; background:rgba(14,31,60,.55); z-index:65;
    opacity:0; pointer-events:none; transition:opacity .3s;
  }
  .cfa-filters-backdrop.cfa-active{opacity:1; pointer-events:auto}
  .cfa-filters .cfa-filters-apply-mobile{
    display:block; width:100%; margin-top:6px; background:var(--navy); color:#fff; border:none;
    border-radius:var(--radius-sm); padding:13px; font-weight:700; font-size:.86rem;
  }
  body.cfa-filters-open-lock{overflow:hidden}
}
.cfa-fgroup{margin-bottom:20px; padding-bottom:20px; border-bottom:1px solid var(--line)}
.cfa-fgroup:last-child{border:none; margin:0; padding:0}
.cfa-fgroup-title{
  font-family:var(--ff-body); font-size:11px; letter-spacing:.04em; text-transform:uppercase;
  color:var(--muted); margin-bottom:10px; font-weight:700;
}
.cfa-filter-select{
  width:100%; padding:10px 34px 10px 12px; border:1px solid var(--line); border-radius:8px; background:var(--paper);
  font-family:var(--ff-body); font-size:.85rem; color:var(--ink);
}
.cfa-filter-select:focus{outline:none; border-color:var(--gold-deep); background:#fff}

/* Pola formularza kontaktowego (karta z prawej na stronie auta) — ten sam
   wzorzec co selecty filtrów, żeby wyglądały spójnie z resztą strony
   zamiast domyślnego wyglądu przeglądarki. */
.cfa-form-field{
  width:100%; padding:11px 12px; border:1px solid var(--line); border-radius:8px;
  font-family:var(--ff-body); font-size:.85rem; color:var(--ink); background:var(--paper);
  box-sizing:border-box;
}
.cfa-form-field:focus{outline:none; border-color:var(--gold-deep); background:#fff}
select.cfa-form-field{
  cursor:pointer; appearance:none; -webkit-appearance:none; -moz-appearance:none;
  padding-right:38px;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='14' viewBox='0 0 24 24' fill='none' stroke='%23596273' stroke-width='2.4'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E");
  background-repeat:no-repeat; background-position:right 12px center;
}
textarea.cfa-form-field{resize:vertical}
.cfa-filter-select-wrap{position:relative}
.cfa-filter-select-clear{
  display:none; position:absolute; right:6px; top:50%; transform:translateY(-50%);
  width:22px; height:22px; border-radius:50% !important; border:none !important; background:var(--line) !important; color:var(--navy) !important;
  font-size:15px; line-height:1; cursor:pointer; align-items:center; justify-content:center; padding:0;
}
.cfa-filter-select-wrap.cfa-has-value .cfa-filter-select-clear{display:flex}
.cfa-filter-select-wrap.cfa-has-value .cfa-filter-select{border-color:var(--gold-deep)}
.cfa-filter-select-clear:hover{background:var(--gold-deep); color:#fff}
.cfa-range-row{display:flex; align-items:center; gap:8px}
.cfa-range-row input{
  width:100%; border:1px solid var(--line); border-radius:8px; padding:9px 10px; font-family:var(--ff-mono);
  font-size:.82rem; background:var(--paper);
}
.cfa-own-toggle{
  display:flex; align-items:center; justify-content:space-between; gap:10px;
  background:linear-gradient(120deg,#FBF6E9,#F3ECD6); border:1px solid var(--gold-light);
  border-radius:var(--radius-sm); padding:12px 14px;
}
.cfa-own-toggle-label{font-size:.82rem; font-weight:600; color:var(--gold-deep); display:flex; align-items:center; gap:8px}
.cfa-switch{position:relative; width:38px; height:22px; flex-shrink:0}
.cfa-switch input{opacity:0; width:0; height:0}
.cfa-switch-track{
  position:absolute; inset:0; background:var(--line); border-radius:100px; transition:.2s; cursor:pointer;
}
.cfa-switch-track::before{
  content:''; position:absolute; width:16px; height:16px; left:3px; top:3px; background:#fff; border-radius:50%;
  transition:.2s; box-shadow:0 1px 3px rgba(0,0,0,.25);
}
.cfa-switch input:checked + .cfa-switch-track{background:var(--gold-deep)}
.cfa-switch input:checked + .cfa-switch-track::before{transform:translateX(16px)}
.cfa-filters-reset{
  width:100%; text-align:center; margin-top:4px; background:none !important; border:1px dashed var(--line) !important;
  border-radius:var(--radius-sm) !important; padding:10px; font-size:.8rem; color:var(--muted) !important;
}
.cfa-filters-reset:hover{border-color:var(--muted); color:var(--ink)}

/* ── RESULTS TOP BAR ── */
.cfa-results-top{display:flex; justify-content:space-between; align-items:center; margin-bottom:20px; flex-wrap:wrap; gap:12px}
.cfa-results-top-left{display:flex; align-items:center; gap:12px; flex-wrap:wrap}
.cfa-results-top-right{display:flex; align-items:center; gap:12px; flex-wrap:wrap}
.cfa-results-count{font-size:.88rem; color:var(--muted)}
.cfa-results-count b{color:var(--ink); font-family:var(--ff-body); font-weight:700}
.cfa-sort-select{
  border:1px solid var(--line); border-radius:var(--radius-sm); padding:9px 14px; background:var(--panel);
  font-size:.82rem; font-family:var(--ff-body); color:var(--ink);
}
.cfa-view-toggle{display:flex; border:1px solid var(--line); border-radius:var(--radius-sm); overflow:hidden; flex-shrink:0}
.cfa-view-toggle-btn{
  padding:9px 12px; background:var(--panel); border:none; cursor:pointer; color:var(--muted);
  display:flex; align-items:center; transition:background .15s, color .15s;
}
.cfa-view-toggle-btn + .cfa-view-toggle-btn{border-left:1px solid var(--line)}
.cfa-view-toggle-btn:hover:not(.cfa-active){background:var(--paper); color:var(--ink)}
.cfa-view-toggle-btn.cfa-active{background:var(--navy); color:#fff}

/* ══════ CAR GRID — signature shadow cards ══════ */
.cfa-car-grid{display:grid; grid-template-columns:repeat(auto-fill,minmax(290px,1fr)); gap:22px}
.cfa-car-card{
  background:var(--panel); border-radius:var(--radius); overflow:hidden;
  box-shadow:var(--shadow-card); border:1px solid rgba(14,31,60,.05);
  transition:transform .28s cubic-bezier(.2,.8,.2,1), box-shadow .28s;
  cursor:pointer; display:flex; flex-direction:column; position:relative;
}
.cfa-car-card:hover{
  transform:translateY(-6px);
  box-shadow:var(--shadow-card-hover);
}
.cfa-car-media{position:relative; width:100%; padding-top:75%; overflow:hidden; background:#EFEBE0}

/* Sprzedane auta: szara miniaturka + napis na przekątnej, karta lekko przygaszona */
.cfa-car-card-sold{opacity:.72}
.cfa-car-card-sold .cfa-car-media img{filter:grayscale(1)}
.cfa-sold-overlay{
  position:absolute; inset:0; z-index:3; display:flex; align-items:center; justify-content:center;
  background:rgba(20,20,20,.28);
}
.cfa-sold-overlay::after{
  content:'SPRZEDANY'; color:#fff; font-family:var(--ff-display); font-weight:800; font-size:1.1rem;
  letter-spacing:.06em; padding:6px 22px; background:rgba(179,38,30,.92); transform:rotate(-8deg);
  box-shadow:0 4px 14px rgba(0,0,0,.25);
}
.cfa-car-media img{
  position:absolute !important; top:0 !important; left:0 !important;
  width:100% !important; height:100% !important; max-width:none !important; max-height:none !important;
  object-fit:cover; transition:transform .5s cubic-bezier(.2,.8,.2,1);
}
.cfa-car-card:hover .cfa-car-media img{transform:scale(1.06)}
.cfa-car-media::after{
  content:''; position:absolute; inset:0;
  background:linear-gradient(180deg,transparent 55%,rgba(14,31,60,.55) 100%);
  opacity:0; transition:opacity .28s;
}
.cfa-car-card:hover .cfa-car-media::after{opacity:1}
.cfa-car-badges{position:absolute; top:12px; left:12px; display:flex; gap:6px; flex-wrap:wrap; z-index:2}
.cfa-badge{
  font-family:var(--ff-body); font-weight:700; font-size:10px; letter-spacing:.03em; padding:5px 10px; border-radius:100px;
  backdrop-filter:blur(6px);
}
.cfa-badge-new{background:rgba(255,255,255,.92); color:var(--navy); font-weight:600}
.cfa-badge-own{
  background:var(--gold); color:var(--navy); font-weight:700;
  display:flex; align-items:center; gap:4px;
}
/* Wariant do użycia na jasnym tle (np. karta szczegółów auta) — .cfa-badge-new
   ma biały box-shadow-blur, myślany pod ciemne zdjęcie w tle, na białej
   karcie byłby prawie niewidoczny. */
.cfa-badge-light{background:var(--paper); border:1px solid var(--line); color:var(--navy); font-weight:700}
.cfa-car-fav{
  position:absolute; top:12px; right:12px; width:32px; height:32px; border-radius:50%;
  background:rgba(255,255,255,.9); border:none; display:flex; align-items:center; justify-content:center; z-index:2;
}
.cfa-car-body{padding:18px 18px 20px; display:flex; flex-direction:column; gap:10px; flex:1}
.cfa-car-name{font-family:var(--ff-display); font-weight:700; font-size:1.05rem; color:var(--navy); line-height:1.25; letter-spacing:-.005em}
.cfa-car-version{font-size:.78rem; color:var(--muted); line-height:1.3}
.cfa-car-specs{
  display:flex; flex-wrap:wrap; gap:6px 14px; font-family:var(--ff-body); font-weight:600; font-size:.75rem; color:var(--muted);
  padding:10px 0; border-top:1px dashed var(--line); border-bottom:1px dashed var(--line);
}
.cfa-car-specs span{display:flex; align-items:center; gap:5px}
.cfa-real-photos-btn{
  display:flex; align-items:center; gap:6px; width:100%; margin:8px 0 0;
  padding:8px 12px; background:rgba(201,162,72,.06) !important; border:1px solid rgba(201,162,72,.4) !important; border-radius:8px;
  color:var(--navy) !important; font-family:var(--ff-body); font-weight:600; font-size:.76rem; cursor:pointer;
  transition:.15s;
}
.cfa-real-photos-btn:hover{background:rgba(201,162,72,.14) !important; border-color:var(--gold-deep) !important}
.cfa-car-foot{display:flex; justify-content:space-between; align-items:flex-end; margin-top:auto}
.cfa-car-price-label{font-size:10px; color:var(--muted); letter-spacing:.04em}
.cfa-car-price{font-family:var(--ff-mono); font-size:1.3rem; font-weight:600; color:var(--navy)}
.cfa-car-price small{font-size:.65rem; font-weight:400; color:var(--muted)}
.cfa-car-cta{
  width:38px; height:38px; border-radius:50%; background:var(--paper); border:1px solid var(--line);
  display:flex; align-items:center; justify-content:center; transition:.18s;
}
.cfa-car-card:hover .cfa-car-cta{background:var(--navy); border-color:var(--navy)}
.cfa-car-card:hover .cfa-car-cta svg{stroke:#fff}

.cfa-load-more{
  display:block; margin:36px auto 0; background:var(--panel) !important; border:1px solid var(--line) !important;
  padding:14px 34px; border-radius:100px; font-weight:600; font-size:.85rem; color:var(--navy) !important;
  box-shadow:var(--shadow-card);
}
.cfa-load-more:hover{border-color:var(--gold-deep); color:var(--gold-deep)}

/* ══════ TRYB LISTY (poziomy układ kart) ══════ */
.cfa-car-grid.cfa-list-view{grid-template-columns:minmax(0,1fr); gap:14px}
.cfa-car-grid.cfa-list-view .cfa-car-card{flex-direction:row; align-items:stretch}
.cfa-car-grid.cfa-list-view .cfa-car-card:hover{transform:translateY(-3px)}
.cfa-car-grid.cfa-list-view .cfa-car-media{width:260px; height:195px; padding-top:0; flex-shrink:0}
.cfa-car-grid.cfa-list-view .cfa-car-body{flex:1; padding:16px 22px; justify-content:center}
.cfa-car-grid.cfa-list-view .cfa-car-specs{border-top:none; border-bottom:none; padding:6px 0}
.cfa-car-grid.cfa-list-view .cfa-car-foot{margin-top:12px}
@media(max-width:640px){
  /* Na wąskich ekranach poziomy układ listy robi się za ciasny — pozwalamy
     kartom wrócić do pionowego stackowania, zachowując mniejsze zdjęcie. */
  .cfa-car-grid.cfa-list-view .cfa-car-card{flex-direction:column}
  .cfa-car-grid.cfa-list-view .cfa-car-media{width:100%; height:auto; padding-top:75%}
}

/* ══════ DETAIL VIEW ══════ */
#view-detail{display:none}
.cfa-detail-back{
  display:inline-flex; align-items:center; gap:8px; font-size:.82rem; color:rgba(255,255,255,.7);
  margin-bottom:6px;
}
.cfa-detail-back:hover{color:var(--gold-light)}
.cfa-detail-wrap{
  max-width:1360px; margin:-46px auto 90px; padding:0 6vw; position:relative; z-index:5;
  display:grid; grid-template-columns:minmax(0,1fr) 380px; gap:32px;
}
@media(max-width:980px){.cfa-detail-wrap{grid-template-columns:minmax(0,1fr)}}
.cfa-gallery{
  background:var(--panel); border-radius:var(--radius); box-shadow:var(--shadow-card); overflow:hidden;
  border:1px solid var(--line);
}
.cfa-gallery-main{
  position:relative; width:100%; padding-top:75%; /* 4:3 -> 3/4 = 75% — bliżej typowych zdjęć dealerskich niż poprzednie 16:10, mniej widoczne marginesy przy "contain" */
  background:#EFEBE0; overflow:hidden; touch-action:pan-y;
}
.cfa-gallery-main img{
  position:absolute !important; top:0 !important; left:0 !important;
  width:100% !important; height:100% !important; max-width:none !important; max-height:none !important;
  object-fit:contain !important; background:#EFEBE0; user-select:none;
}
.cfa-gallery-arrow.cfa-gallery-arrow{
  position:absolute !important; top:50% !important; transform:translateY(-50%) !important;
  width:42px !important; height:42px !important; border-radius:50% !important;
  background:rgba(14,31,60,.55) !important; border:none !important; color:#fff !important;
  display:flex !important; align-items:center; justify-content:center;
  cursor:pointer; transition:background .15s; backdrop-filter:blur(3px); z-index:2;
}
.cfa-gallery-arrow:hover{background:rgba(14,31,60,.82)}
.cfa-gallery-arrow-prev{left:14px}
.cfa-gallery-arrow-next{right:14px}
.cfa-gallery-arrow.cfa-gallery-arrow svg, .cfa-gallery-arrow.cfa-gallery-arrow svg path{
  fill:none !important; stroke:#fff !important; stroke-width:2.6px !important;
}
.cfa-gallery-arrow.cfa-gallery-arrow svg{width:20px !important; height:20px !important; min-width:20px !important; flex-shrink:0 !important; display:block !important}

/* To samo zabezpieczenie co przy strzałkach galerii, rozszerzone na
   pozostałe przyciski z ikonkami (przełącznik widoku, szukajka, zamknięcie
   filtrów, wyzwalacz filtrów mobile) — wszystkie tak samo narażone na
   globalny reset svg z motywu (Kadence i podobne często mają własny system
   ikon z regułą svg{fill:...}/svg path{stroke:...}, która wygrywa z naszym
   dziedziczonym stylem, bo celuje bezpośrednio w element path). */
.cfa-view-toggle-btn svg, .cfa-view-toggle-btn svg path,
.cfa-searchbar-btn svg, .cfa-searchbar-btn svg path,
.cfa-filters-close-mobile svg, .cfa-filters-close-mobile svg path,
.cfa-filters-trigger-mobile svg, .cfa-filters-trigger-mobile svg path,
.cfa-real-photos-btn svg, .cfa-real-photos-btn svg path{
  fill:none !important; stroke:currentColor !important;
}
.cfa-gallery-counter{
  position:absolute; bottom:14px; right:14px; background:rgba(14,31,60,.65); color:#fff; font-family:var(--ff-mono);
  font-size:11px; padding:5px 11px; border-radius:100px; z-index:2;
}
.cfa-gallery-thumbs{display:flex; gap:8px; padding:12px; overflow-x:auto}
.cfa-gallery-thumbs img{
  width:88px; height:64px; object-fit:cover; border-radius:8px; flex-shrink:0; cursor:pointer; opacity:.55;
  transition:.15s; border:2px solid transparent;
}
.cfa-gallery-thumbs img.cfa-active{opacity:1; border-color:var(--gold-deep)}

.cfa-detail-info-card{
  background:var(--panel); border-radius:var(--radius); box-shadow:var(--shadow-card); border:1px solid var(--line);
  padding:30px; margin-top:22px;
}
.cfa-detail-title-row{display:flex; justify-content:space-between; gap:16px; align-items:flex-start; flex-wrap:wrap}
.cfa-detail-title{font-family:var(--ff-display); font-weight:800; font-size:1.85rem; color:var(--navy); line-height:1.15; letter-spacing:-.005em}
.cfa-detail-version{color:var(--muted); font-size:1.05rem; margin-top:5px}
.cfa-detail-vehis-code{
  font-family:var(--ff-mono); font-size:.76rem; color:var(--muted); margin-top:8px;
  display:inline-block; background:var(--paper); border:1px solid var(--line); border-radius:100px;
  padding:4px 12px;
}
.cfa-detail-price-block{text-align:right}
.cfa-detail-price{font-family:var(--ff-mono); font-size:2.1rem; font-weight:600; color:var(--navy)}
.cfa-detail-price small{font-size:.78rem; color:var(--muted); font-weight:400; display:block}

.cfa-spec-grid{
  display:grid; grid-template-columns:repeat(auto-fill,minmax(150px,1fr)); gap:18px; margin-top:26px;
  padding-top:24px; border-top:1px solid var(--line);
}
.cfa-spec-item{}
.cfa-spec-item .cfa-lbl{
  font-family:var(--ff-body); font-weight:700; font-size:11px; color:var(--muted); letter-spacing:.05em;
  margin-bottom:5px; text-transform:uppercase; display:flex; align-items:center; gap:6px;
}
.cfa-spec-item .cfa-lbl svg{flex-shrink:0; stroke:var(--gold-deep)}
.cfa-spec-item .cfa-val{font-weight:700; font-size:1.05rem; color:var(--ink)}

.cfa-detail-side{display:flex; flex-direction:column; gap:20px}
.cfa-calc-card{
  background:var(--navy); border-radius:var(--radius); border-top:3px solid var(--gold);
  padding:24px; color:#fff; box-shadow:var(--shadow-card);
}
.cfa-calc-card h4{color:#fff !important; font-family:var(--ff-display); font-weight:700; font-size:1.05rem; margin-bottom:6px; text-transform:uppercase; letter-spacing:.02em}
.cfa-calc-card p{font-size:.8rem; color:rgba(255,255,255,.6); margin-bottom:16px; line-height:1.5}
.cfa-calc-widget-slot{
  background:rgba(255,255,255,.06); border:1px dashed rgba(255,255,255,.25); border-radius:12px;
  padding:20px; text-align:center; font-family:var(--ff-body); font-size:12px; color:rgba(255,255,255,.55);
  margin-bottom:16px;
}
.cfa-calc-field{margin-bottom:14px}
.cfa-calc-field label{display:block;font-size:.72rem;color:rgba(255,255,255,.55);text-transform:uppercase;letter-spacing:.04em;margin-bottom:6px;font-weight:700}
.cfa-calc-field select{
  width:100%; padding:11px 12px; border-radius:8px; border:1px solid rgba(255,255,255,.18);
  background:rgba(255,255,255,.06); color:#fff; font-family:var(--ff-body); font-size:.86rem;
}
.cfa-calc-field select option{background:var(--navy); color:#fff}
.cfa-calc-toggle{display:flex; border:1px solid rgba(255,255,255,.18); border-radius:8px; overflow:hidden}
.cfa-calc-toggle-opt{
  flex:1; padding:10px; background:transparent; border:none; color:rgba(255,255,255,.6);
  font-family:var(--ff-body); font-weight:700; font-size:.82rem; cursor:pointer; transition:.15s;
}
.cfa-calc-toggle-opt.cfa-active{background:var(--gold); color:var(--navy)}
.cfa-calc-result{
  background:rgba(255,255,255,.07); border-radius:10px; padding:16px; text-align:center; margin:16px 0;
}
.cfa-calc-result-label{font-size:.7rem; color:rgba(255,255,255,.5); text-transform:uppercase; letter-spacing:.05em; margin-bottom:4px}
.cfa-calc-result-value{font-family:var(--ff-mono); font-size:1.7rem; font-weight:600; color:var(--gold-light)}
.cfa-calc-result-note{font-size:.72rem; color:rgba(255,255,255,.5); margin-top:4px; min-height:14px}
.cfa-calc-cta{
  width:100%; background:var(--gold) !important; color:#2B1E05 !important; border:none !important; border-radius:var(--radius-sm) !important;
  padding:14px; font-weight:700; font-size:.88rem;
}
.cfa-contact-card{
  background:var(--panel); border-radius:var(--radius); border:1px solid var(--line); padding:22px;
  box-shadow:var(--shadow-card);
}
.cfa-advisor{display:flex; gap:12px; align-items:center; margin-bottom:16px}
.cfa-advisor img{width:52px; height:52px; border-radius:50%; object-fit:cover}
.cfa-advisor b{font-size:.92rem; color:var(--navy); display:block}
.cfa-advisor span{font-size:.76rem; color:var(--muted)}
.cfa-contact-btn{
  display:block; text-align:center; width:100%; padding:13px; border-radius:var(--radius-sm);
  font-weight:600; font-size:.85rem; margin-bottom:10px;
}
.cfa-contact-btn.cfa-primary{background:var(--navy); color:#fff}
.cfa-contact-btn.cfa-secondary{background:var(--paper); color:var(--navy); border:1px solid var(--line)}

.cfa-desc-card{
  background:var(--panel); border-radius:var(--radius); border:1px solid var(--line); padding:30px; margin-top:22px;
  box-shadow:var(--shadow-card);
}
.cfa-desc-card h4{font-family:var(--ff-display); font-weight:700; font-size:1.1rem; color:var(--navy) !important; margin-bottom:14px; text-transform:uppercase; letter-spacing:.03em}
.cfa-desc-card h4.cfa-with-top-border{margin-top:26px; padding-top:24px; border-top:1px solid var(--line)}
.cfa-desc-card p{font-size:1rem; color:var(--ink); line-height:1.75}
.cfa-equip-list{display:grid; grid-template-columns:repeat(auto-fill,minmax(180px,1fr)); gap:12px; margin-top:16px}
.cfa-equip-item{display:flex; gap:9px; align-items:center; font-size:.92rem; color:var(--ink); min-width:0}
.cfa-equip-item svg{flex-shrink:0; stroke:var(--gold-deep)}
.cfa-equip-item span{min-width:0; overflow-wrap:break-word; word-break:break-word}

.cfa-empty-state{
  grid-column:1/-1; text-align:center; padding:60px 20px; color:var(--muted);
}
.cfa-empty-state svg{margin:0 auto 16px; opacity:.4}

.cfa-site-footer{background:var(--navy); border-top:3px solid var(--gold); padding:22px 6vw; margin-top:20px}
.cfa-site-footer-inner{
  max-width:1440px; margin:0 auto; display:flex; justify-content:space-between; align-items:center;
  flex-wrap:wrap; gap:8px; font-size:.78rem; color:rgba(255,255,255,.5);
}
.cfa-site-footer-inner a{color:var(--gold-light); font-weight:600}
.cfa-site-footer-inner a:hover{color:var(--gold)}

/* Skromna linijka z kredytem — widoczna zamiast pełnej stopki, gdy strona
   żyje w WordPressie (tam prawdziwa stopka motywu i tak już jest niżej,
   więc celowo NIE robimy tu kolejnego kolorowego paska — tylko cienka
   linijka tekstu, żeby się nie powtórzyć problem "podwójnej stopki"). */
.cfa-credit-line{
  text-align:center; padding:14px 6vw; font-size:.72rem; color:var(--muted);
}
.cfa-credit-line a{color:var(--muted); text-decoration:underline; text-decoration-color:var(--line)}
.cfa-credit-line a:hover{color:var(--gold-deep)}
