/* =====================================================================
   AE Projekt — podstrony w szablonie v4 „Biała bryła” (ADR-008)
   Ładowany PO assets/ae.css, wyłącznie na podstronach (generator tools/podstrony_v4/build.py).
   Arkusz v3 daje układ komponentów (siatki, tabele, FAQ, kroki, drabina, formularz, strony prawne);
   ta warstwa przestawia tokeny, typografię, przyciski i rytm sekcji na język strony głównej v4.
   Wartości = strona główna v4 (index.html, style w atrybutach). Granatowych pasm na podstronach nie ma:
   generator zamienia je na płaszczyznę `ae-pasmo-ral`, a szare pasma na biel.
   ===================================================================== */

@font-face{font-family:'Host Grotesk';src:url('fonts/HostGrotesk-Variable.ttf') format('truetype');font-weight:100 900;font-style:normal;font-display:swap;}

:root{
  --ae-ink:#1B1E22;
  --ae-ink-2:#5D636A;
  --ae-grey-t:#5D636A;
  --ae-grey-t2:#5D636A;
  --ae-ral:#F2F4F5;          /* płaszczyzna (na głównej: tło mapy) */
  --ae-ral-2:#F7F8F9;
  --ae-line:#DDE1E4;
  --ae-blue:#1368A2;
  --ae-blue-d:#0B4168;
  --ae-line-d:#DDE1E4;       /* w v3 linia na granacie — tu granatu nie ma, a używają jej reguły bazowe hero */
  --ae-onnavy:#5D636A;
  --ae-font-body:'Host Grotesk';
  --ae-font-head:'Host Grotesk';
  --ae-max:1440px;
  --ae-pad:clamp(20px,5.33vw + 3.2px,80px);
  --ae-sec:clamp(64px,4.57vw + 46.2px,112px);
}

/* --- Baza strony głównej v4 (jej <helmet>) — nagłówek i stopka są z niej przeniesione 1:1 --- */
body{background:#fff;color:#1B1E22;font-family:'Host Grotesk','Helvetica Neue',Arial,sans-serif;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;}
.ae-v4 > header,.ae-v4 > footer{font-size:16px;line-height:normal;}
.ae-v4 > header :is(h1,h2,h3,p,ul,figure,address),.ae-v4 > footer :is(h1,h2,h3,p,ul,figure,address){margin:0;padding:0;}
:where(.ae-v4 > header,.ae-v4 > footer) a{color:#1B1E22;}
:where(.ae-v4 > header,.ae-v4 > footer) a:hover{color:#1368A2;}
@media (prefers-reduced-motion:no-preference){html{scroll-behavior:smooth;}}
.ae-v4 > footer address{font-style:normal;}
.ae-v4 img{display:block;max-width:100%;}
.ae-v4 :focus-visible{outline:2px solid #1368A2;outline-offset:4px;}
.ae-v4 ::selection{background:#D4E5F2;}

/* --- Rytm sekcji: hero na bieli, sekcje na bieli z linią 1 px; znacznik 32×3 tylko przy pierwszej sekcji
   (brief: „niebieskie odcinki w 2–3 miejscach”, na głównej: Obszary + stopka) --- */
.ae-v4 .ae-pod-hero > .ae-arkusz{padding-top:clamp(32px,3.05vw + 20.1px,64px);padding-bottom:0;}
.ae-v4 .ae-pasmo-white:not(.ae-pod-hero) > .ae-arkusz{padding-bottom:0;}
.ae-v4 .ae-pasmo-white:not(.ae-pod-hero) > .ae-arkusz::before{content:"";display:block;box-sizing:border-box;height:3px;margin:-1px 0 clamp(24px,2.3vw + 15px,48px);background:linear-gradient(#DDE1E4,#DDE1E4) 0 1px/100% 1px no-repeat;}
.ae-v4 .ae-pod-hero + .ae-pasmo-white > .ae-arkusz::before{background:linear-gradient(#1368A2,#1368A2) 0 0/32px 3px no-repeat,linear-gradient(#DDE1E4,#DDE1E4) 0 1px/100% 1px no-repeat;}
.ae-v4 .ae-pasmo-white:not(.ae-pod-hero) > .ae-arkusz:is(.ae-pod-cta,.ae-kol)::before{grid-column:1/-1;margin-bottom:0;}
.ae-v4 .ae-pasmo-white:has(+ .ae-pasmo-ral) > .ae-arkusz{padding-bottom:var(--ae-sec);}
.ae-v4 .ae-pasmo-ral{background:var(--ae-ral);}
.ae-v4 .ae-pasmo-ral + .ae-pasmo-white > .ae-arkusz{padding-top:var(--ae-sec);}

/* --- Typografia: Host Grotesk 400/500, sylwetki nagłówków strony głównej --- */
.ae-v4 .ae-h1{font-weight:400;line-height:1.04;letter-spacing:-0.035em;}
.ae-v4 .ae-pod-hero-h1{font-size:clamp(38px,2.6vw + 28px,64px);}
.ae-v4 .ae-h2{font-size:clamp(30px,1.33vw + 24.8px,44px);font-weight:400;line-height:1.1;letter-spacing:-0.02em;}
.ae-v4 .ae-h3{font-weight:400;letter-spacing:-0.01em;}
.ae-v4 .ae-lbl{font-size:13px;line-height:1.46;font-weight:500;letter-spacing:0.08em;text-transform:uppercase;color:var(--ae-ink-2);}
.ae-v4 .ae-pod-hero .ae-lbl{color:var(--ae-blue);}
.ae-v4 .ae-lead{font-size:clamp(17px,0.095vw + 16.6px,18px);line-height:1.5;color:var(--ae-ink);}
.ae-v4 .ae-p{font-size:clamp(17px,0.095vw + 16.6px,18px);line-height:1.6;color:var(--ae-ink-2);}
.ae-v4 .ae-pod-liczby-v{font-weight:400;}

/* --- Okruchy na bieli (w v3 stały na granacie) --- */
.ae-v4 .ae-okruchy{font-size:13px;color:var(--ae-ink-2);}
.ae-v4 .ae-okruchy li + li::before{color:var(--ae-line);}
.ae-v4 .ae-okruchy a{color:var(--ae-ink-2);text-decoration:none;}
.ae-v4 .ae-okruchy a:hover{color:var(--ae-blue);}
.ae-v4 .ae-okruchy [aria-current]{color:var(--ae-ink);}

/* --- Przyciski → link ze strzałką jak „Zobacz realizacje” na głównej; przycisk formularza zostaje przyciskiem --- */
.ae-v4 .ae-actions{gap:12px 32px;}
.ae-v4 .ae-cta,.ae-v4 .ae-btn2{gap:12px;min-height:44px;padding:0;background:none;border:0;font-size:17px;font-weight:500;line-height:1.4;text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:6px;}
.ae-v4 .ae-cta{color:var(--ae-blue);}
.ae-v4 .ae-cta:hover{background:none;color:var(--ae-blue-d);}
.ae-v4 .ae-cta::after{content:"";flex:none;width:20px;height:10px;background:currentColor;-webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 10'%3E%3Cpath d='M0 5h18M14 1l4 4-4 4' fill='none' stroke='%23000' stroke-width='1.4'/%3E%3C/svg%3E") center/contain no-repeat;mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 10'%3E%3Cpath d='M0 5h18M14 1l4 4-4 4' fill='none' stroke='%23000' stroke-width='1.4'/%3E%3C/svg%3E") center/contain no-repeat;}
.ae-v4 .ae-btn2{color:var(--ae-ink);text-decoration-color:var(--ae-line);}
.ae-v4 .ae-btn2:hover{background:none;color:var(--ae-blue);border-color:transparent;}
.ae-v4 .ae-form .ae-cta{justify-content:center;min-height:52px;padding:14px 24px;background:var(--ae-blue);color:#fff;text-decoration:none;}
.ae-v4 .ae-form .ae-cta:hover{background:var(--ae-blue-d);color:#fff;}
.ae-v4 .ae-form .ae-cta::after{background:#fff;}

/* --- Zdjęcia: bez filtra i nakładki v3 (na głównej v4 zdjęcia są naturalne), tło zastępcze = płaszczyzna --- */
.ae-v4 .ae-foto{background:var(--ae-ral);}
.ae-v4 .ae-foto img{filter:none;}
.ae-v4 .ae-foto::after{content:none;}

/* --- Znaczniki rysunkowe v3 (ADR-006) wyłączone: w v4 jedynym znacznikiem jest kreska 32×3 sekcji --- */
.ae-v4 .ae-tab--opis .ae-tab-r::before{content:none;}

/* --- Mini-drabina: zawarte poziomy na płaszczyźnie z błękitną kreską u góry (w v3 granat) --- */
.ae-v4 .ae-drab-c.is-on{background:linear-gradient(var(--ae-blue),var(--ae-blue)) 0 0/100% 3px no-repeat,var(--ae-ral);border-left-color:var(--ae-line);}
.ae-v4 .ae-drab-c.is-on + .ae-drab-c.is-on{border-left-color:var(--ae-line);border-top-color:var(--ae-line);}
.ae-v4 .ae-drab-c.is-on .ae-drab-n{color:var(--ae-ink-2);}
.ae-v4 .ae-drab-c.is-on .ae-drab-t{color:var(--ae-ink);}

/* --- Nota nad formularzem (/kontakt/) — w v3 stała na granacie --- */
.ae-v4 .ae-nota{border-color:var(--ae-line);color:var(--ae-ink-2);background:#fff;}

/* --- Linki CTA na telefonie stoją do lewej, jak na głównej (v3 rozciągał przyciski na całą szerokość) --- */
@media (max-width:640px){
  .ae-v4 .ae-actions{align-items:flex-start;gap:8px 32px;}
  .ae-v4 .ae-actions > .ae-cta,.ae-v4 .ae-actions > .ae-btn2{width:auto;justify-content:flex-start;text-align:left;}
}