/* Aria Spain — wlasny uklad naglowka strony glownej (operator 23.10: „napisy slabe i slabo rozmieszczone — zaplanuj ladnie") + banery podstron
   + naglowek wynikow. 25.10: zdjecie glowne ma STALE 600 px (operator: skalowanie do okna na duzym monitorze wygladalo zle; „napisow nie ruszac").
   Tresc nietknieta — zmienia sie wylacznie typografia i kompozycja. Cofniecie = usuniecie <link hero.css> w lib/pogoda-wstrzyk.ts. */
:root { --ah-navy: #1e2d4a; --ah-gold: #D2C196; --ah-blue: #4192D9; }

/* scena: cover z gradientowym przyciemnieniem od dolu i z lewej (pod tekstem), zdjecie bez zmian */
/* Pierwszy ekran konczy sie na wyszukiwarce (operator 23.10: „na pierwszym ekranie widac wszystko do sekcji Polecane, bez wzgledu na okno").
   Zmierzone: naglowek 106 + odstep 4, pod zdjeciem formularz i przycisk mapy siegaja 147 px, „Polecane" zaczyna sie 147 px pod zdjeciem
   → zdjecie = okno − 250 px (min. 600 px jak oryginal). Tytul i plakietki sa pozycjonowane od dolu/gory, wiec skaluja sie z nim. */
body.home .section-search .wp-block-cover { position: relative; height: 600px !important; min-height: 600px !important; }   /* 25.10: STALE 600 px jak oryginal WP (operator: skalowanie do okna na duzym monitorze wygladalo zle); napisy i kompozycja z 23.10 bez zmian */
body.home .section-search .wp-block-cover::after { content: ""; position: absolute; inset: auto 0 0 0; height: 55%; pointer-events: none; z-index: 1;
  background: linear-gradient(180deg, rgba(10, 18, 34, 0) 0%, rgba(10, 18, 34, .45) 100%); }   /* tylko czytelnosc tekstu u dolu */

/* 25.10: warstwa napisow NIE przechwytuje klikniec — zakladki „Podstawowy/Zaawansowany" wystaja na zdjecie i byly pod nia (operator: „nie mozna sie
   przelaczyc"); klikalne zostaja same elementy warstwy (tytul, przycisk) */
body.home .section-search .wp-block-cover__inner-container { pointer-events: none; }
body.home .section-search .wp-block-cover__inner-container > * { pointer-events: auto; }
.baner-page .wp-block-cover .wp-block-cover__inner-container { pointer-events: none; }
.baner-page .wp-block-cover .wp-block-cover__inner-container > * { pointer-events: auto; }
/* kompozycja: lewy dol, waska kolumna tekstu */
body.home .section-search .wp-block-cover__inner-container { position: relative; z-index: 3 !important; display: flex !important; flex-direction: column; align-items: flex-start; justify-content: flex-end;
  width: 100%; max-width: none; height: 100%; min-height: 0; box-sizing: border-box !important; padding: 120px 6% 112px !important; text-align: left; }   /* dol: nad formularzem (nachodzi ~100 px na zdjecie) */

/* napis wprowadzajacy — w KAZDYM jezyku ten sam uklad (operator 23.10: „wszystkie jezyki maja wygladac jak polska") */
/* „0% prowizji” w jezykach obcych: akapit <p style="font-size:18px"> jest tlumaczony z szablonu PL (i18n), wiec dawny dopisek ::after usuniety 24.10 (byl podwojnie) */
body.home .section-search .wp-block-cover__inner-container > p.has-large-font-size::before {
  content: "Polska agencja nieruchomości w Hiszpanii"; display: block; margin: 0 0 14px; font-family: "Poppins", sans-serif; font-size: 15px; font-weight: 700;
  letter-spacing: .2em; text-transform: uppercase; color: var(--ah-gold); line-height: 1.25;   /* zloty jak „0% prowizji” (operator 23.10) */
  /* bez ramki (operator 23.10): mocny cien + zlota kreska z lewej jak przy „0% prowizji” — czytelne na jasnym zdjeciu */
  text-shadow: 0 1px 2px rgba(0, 0, 0, .65), 0 4px 18px rgba(0, 0, 0, .5);
  padding-left: 48px; background: linear-gradient(var(--ah-gold), var(--ah-gold)) no-repeat 0 50% / 34px 2px; white-space: nowrap; }   /* jedna linia na desktopie */
html[lang^="en"] body.home .section-search .wp-block-cover__inner-container > p.has-large-font-size::before { content: "Real estate agency in Spain"; }
html[lang^="de"] body.home .section-search .wp-block-cover__inner-container > p.has-large-font-size::before { content: "Immobilienagentur in Spanien"; }
html[lang^="fr"] body.home .section-search .wp-block-cover__inner-container > p.has-large-font-size::before { content: "Agence immobilière en Espagne"; }
html[lang^="nl"] body.home .section-search .wp-block-cover__inner-container > p.has-large-font-size::before { content: "Makelaar in Spanje"; }
html[lang^="sv"] body.home .section-search .wp-block-cover__inner-container > p.has-large-font-size::before { content: "Fastighetsmäklare i Spanien"; }
html[lang^="da"] body.home .section-search .wp-block-cover__inner-container > p.has-large-font-size::before { content: "Ejendomsmægler i Spanien"; }
html[lang^="nb"] body.home .section-search .wp-block-cover__inner-container > p.has-large-font-size::before, html[lang^="no"] body.home .section-search .wp-block-cover__inner-container > p.has-large-font-size::before { content: "Eiendomsmegler i Spania"; }
html[lang^="es"] body.home .section-search .wp-block-cover__inner-container > p.has-large-font-size::before { content: "Agencia inmobiliaria en España"; }
html[lang^="uk"] body.home .section-search .wp-block-cover__inner-container > p.has-large-font-size::before { content: "Агентство нерухомості в Іспанії"; }

/* tytul */
body.home .section-search .wp-block-cover__inner-container > p.has-large-font-size { margin: 0 0 14px !important; max-width: 15ch; text-align: left !important;
  font-size: clamp(34px, 3.8vw, 52px) !important; line-height: 1.04 !important; letter-spacing: -.015em; font-weight: 700; color: #fff;
  text-shadow: 0 2px 18px rgba(0, 0, 0, .45), 0 1px 2px rgba(0, 0, 0, .35); }

/* „0% prowizji" jako zlota etykieta z kreska */
body.home .section-search .wp-block-cover__inner-container > p[style*="font-size:18px"] { display: flex; align-items: center; gap: 14px; margin: 0 0 20px !important; text-align: left !important;
  font-family: "Poppins", sans-serif; font-size: 15px !important; font-weight: 600; letter-spacing: .2em; text-transform: uppercase; color: var(--ah-gold);
  text-shadow: 0 1px 10px rgba(0, 0, 0, .45); }
body.home .section-search .wp-block-cover__inner-container > p[style*="font-size:18px"]::before { content: ""; width: 44px; height: 2px; background: var(--ah-gold); box-shadow: 0 0 8px rgba(210, 193, 150, .6); }

/* etykieta „0% prowizji" w pozostalych jezykach: tresc WP ma ja tylko po polsku — generowana po tytule, ta sama typografia co wyzej */
  font-family: "Poppins", sans-serif; font-size: 15px; font-weight: 600; letter-spacing: .2em; text-transform: uppercase; color: var(--ah-gold); text-shadow: 0 1px 10px rgba(0, 0, 0, .45); line-height: 1.4; }

/* przycisk: bialy, wyrazny, z uniesieniem */
body.home .section-search .wp-block-cover__inner-container .wp-block-buttons { justify-content: flex-start !important; margin: 0; }
body.home .section-search .wp-block-cover__inner-container .wp-block-button__link { padding: 13px 30px !important; border-radius: 999px; font-family: "Poppins", sans-serif; font-weight: 600; font-size: 17px;
  background: #fff !important; color: var(--ah-navy) !important; box-shadow: 0 14px 34px -14px rgba(0, 0, 0, .55); transition: transform .2s ease, box-shadow .2s ease; }
body.home .section-search .wp-block-cover__inner-container .wp-block-button__link:hover { transform: translateY(-2px); box-shadow: 0 20px 40px -14px rgba(0, 0, 0, .6); }

/* telefon: wszystko wysrodkowane, mniejsze; odczyt pogody jest w lewym gornym rogu, wiec tekst zaczyna sie nizej */
@media (max-width: 781px) {
  body.home .section-search .wp-block-cover { height: 390px !important; min-height: 390px !important; }   /* oryginal: 360 px; +30 na znaczek Forbes pod przyciskiem (operator 23.10) */
  body.home .section-search .wp-block-cover__inner-container { align-items: center; justify-content: flex-end; padding: 64px 16px 55px !important; text-align: center; }   /* 55: blok tekstu z przyciskiem 20 px wyzej (operator 24.10); znaczek Forbes absolutnie, bottom 12 */
  body.home .section-search .wp-block-cover__inner-container > p.has-large-font-size::before { font-size: 11px; letter-spacing: .16em; margin-bottom: 10px; padding-left: 0; background: none; white-space: normal; }
  body.home .section-search .wp-block-cover__inner-container > p.has-large-font-size { max-width: 14ch; text-align: center !important; font-size: clamp(24px, 7vw, 30px) !important; margin-bottom: 8px !important; }
  body.home .section-search .wp-block-cover__inner-container > p[style*="font-size:18px"] { justify-content: center; text-align: center !important; font-size: 12px !important; margin-bottom: 12px !important; }
  body.home .section-search .wp-block-cover__inner-container .wp-block-button__link { padding: 11px 24px !important; font-size: 15px; }
  body.home .section-search .wp-block-cover__inner-container .wp-block-buttons { justify-content: center !important; }
}


/* ===== BANERY PODSTRON (listing, archiwa, blog, kategorie, wpisy): ten sam jezyk co naglowek strony glownej =====
   Struktura WP: .wp-block-cgb-section.baner-page > .container > figure img (600 px desktop / 400 px telefon) + h1 absolutnie na srodku.
   Zmieniamy tylko typografie i polozenie h1 oraz dodajemy przyciemnienie; rozmiar baneru bez zmian. */
.baner-page .container { position: relative; }
.baner-page .container::after { content: ""; position: absolute; left: 0; right: 0; bottom: 0; height: 60%; pointer-events: none; z-index: 1;
  background: linear-gradient(180deg, rgba(10, 18, 34, 0) 0%, rgba(10, 18, 34, .55) 100%); border-radius: inherit; }
.baner-page .container > h1 { position: absolute !important; z-index: 3; top: auto !important; bottom: 237px !important; left: 6% !important;   /* = dolna krawedz tytulu na stronie glownej (zmierzone: 237 px nad dolem zdjecia; operator 23.10: na tej wysokosci musza byc te napisy) */ right: auto !important;
  transform: none !important; width: auto !important; max-width: 20ch; margin: 0 !important; text-align: left !important;
  font-size: clamp(30px, 3.4vw, 48px) !important; line-height: 1.06 !important; letter-spacing: -.012em; font-weight: 700; color: #fff;
  text-shadow: 0 2px 18px rgba(0, 0, 0, .45), 0 1px 2px rgba(0, 0, 0, .35); }
.baner-page .container > h1::before { left: 0 !important; transform: none !important; }   /* kreska motywu pod tytulem: do lewej */
/* listing i archiwa ofert: ta sama wysokosc co wszedzie (237 px jest wyzej niz formularz wyszukiwarki, ktory nachodzi ~100 px) */
@media (max-width: 781px) {
  .baner-page .container > h1 { bottom: 121px !important; left: 16px !important;   /* telefon: tytul na glownej konczy sie 121 px nad dolem zdjecia */ right: 16px !important; max-width: none; text-align: center !important;
    font-size: clamp(22px, 6.5vw, 28px) !important; }
  .baner-page .container > h1::before { left: 50% !important; transform: translateX(-50%) !important; }
}

/* ===== BANER PODSTRON — wariant z wp-block-cover (Kontakt, Korzysci, Pracuj z nami, About us…): ten sam uklad co blog ===== */
.baner-page .wp-block-cover { position: relative; display: flex !important; align-items: flex-end !important; }   /* tytul u dolu takze na telefonie (cover ma tam min-height, wiec height:100% dziecka nie dziala) */
.baner-page .wp-block-cover::after { content: ""; position: absolute; left: 0; right: 0; bottom: 0; height: 60%; pointer-events: none; z-index: 1;
  background: linear-gradient(180deg, rgba(10, 18, 34, 0) 0%, rgba(10, 18, 34, .45) 100%); }
.baner-page .wp-block-cover .wp-block-cover__inner-container { position: relative; z-index: 3 !important; display: flex !important; flex-direction: column; align-items: flex-start; justify-content: flex-end;
  width: 100%; max-width: none; height: 100%; box-sizing: border-box; padding: 60px 6% 221px !important; text-align: left; }   /* h1 konczy sie 16 px nad krawedzia kontenera: 221 + 16 = 237 jak na glownej */
.baner-page .wp-block-cover .wp-block-cover__inner-container > h1 { position: relative !important; margin: 0 !important; max-width: 20ch; text-align: left !important;
  font-size: clamp(30px, 3.4vw, 48px) !important; line-height: 1.06 !important; letter-spacing: -.012em; font-weight: 700; color: #fff;
  text-shadow: 0 2px 18px rgba(0, 0, 0, .45), 0 1px 2px rgba(0, 0, 0, .35); }
.baner-page .wp-block-cover .wp-block-cover__inner-container > h1::before { left: 0 !important; transform: none !important; }   /* kreska motywu do lewej */
@media (max-width: 781px) {
  .baner-page .wp-block-cover .wp-block-cover__inner-container { align-items: center; padding: 40px 16px 105px !important; text-align: center; }   /* 105 + 16 = 121 jak na glownej (telefon) */
  .baner-page .wp-block-cover .wp-block-cover__inner-container > h1 { max-width: none; text-align: center !important; font-size: clamp(22px, 6.5vw, 28px) !important; }
  .baner-page .wp-block-cover .wp-block-cover__inner-container > h1::before { left: 50% !important; transform: translateX(-50%) !important; }
}

/* ===== NAGLOWEK WYNIKOW WYSZUKIWANIA (listing z filtrami albo z mapy; wstawiany w lib/listing.ts) ===== */
.aria-wyniki { margin: 8px 0 28px; padding: 0 0 18px; border-bottom: 1px solid rgba(30, 45, 74, .12); }
.aria-wyniki__tytul { margin: 0 0 6px !important; font-size: clamp(26px, 2.6vw, 36px) !important; line-height: 1.1; color: var(--ah-navy); }
.aria-wyniki__opis { margin: 0; font-family: "Poppins", sans-serif; font-size: 15px; color: #4b5563; }
.aria-wyniki__opis::before { content: ""; display: inline-block; width: 28px; height: 2px; margin: 0 10px 4px 0; background: var(--ah-gold); vertical-align: middle; }
@media (max-width: 781px) { .aria-wyniki { margin: 0 0 18px; text-align: center; } }

/* ===== WYSZUKIWARKA ZAAWANSOWANA — „Informacje dodatkowe" w rownych kolumnach (operator 25.10: „wyrownaj, 3-4 kolumny rowniutko") ===== */
.search-oferta-form .checkboxes { display: grid !important; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 12px 20px; align-items: center; padding-bottom: 14px; }
.search-oferta-form .checkboxes label { display: flex !important; align-items: center; gap: 8px; margin: 0 !important; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.search-oferta-form .checkboxes label input[type="checkbox"] { flex: 0 0 auto; margin: 0; }
@media (max-width: 1100px) { .search-oferta-form .checkboxes { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
@media (max-width: 781px) { .search-oferta-form .checkboxes { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px 12px; } .search-oferta-form .checkboxes label { white-space: normal; } }
/* jedna lupa w wyszukiwarce zaawansowanej — ta w wierszu „Cena od–do"; dolna (top-level) ukryta (operator 25.10) */
.search-oferta-form .search-button.top-level { display: none !important; }


/* odleglosc od morza na KARTACH (listing, Polecane, slidery, dymki mapy): czwarta pozycja w rzedzie danych — 2026-10-25 */
.danw li.morze{position:relative;padding-left:30px;white-space:nowrap}
.danw li.morze:before{content:"";position:absolute;left:-2px;top:-2px;width:26px;height:26px;background:url(/wp-content/themes/wp-arai/img/plaza.svg) 50%/contain no-repeat}

/* rzad danych w kartach ZAWSZE w jednej linii (operator 25.10): 4 pozycje (m2, sypialnie, lazienki, morze) */
.box-offer .danw{display:flex !important;flex-wrap:nowrap !important;justify-content:space-between !important;gap:8px !important;row-gap:0 !important}
.box-offer .danw li{flex:0 0 auto !important;white-space:nowrap;font-size:15px !important;padding-left:28px !important;min-width:0}
.box-offer .danw li sup{font-size:10px}
@media (max-width:600px){.box-offer .danw{gap:6px !important}.box-offer .danw li{font-size:13px !important;padding-left:24px !important}.box-offer .danw li:before{width:22px !important;height:22px !important;top:0 !important}.box-offer .danw li.morze:before{width:22px;height:22px;top:0}}