/* ==========================================================================
   AT KLÍMA – style.css  (több-oldalas verzió)
   1. Reset  2. Tokenek  3. Tipográfia  4. Layout  5. Ikonok  6. Gombok
   7. Header  8. Mobil menü  9. Hero (full-bleed)  10. Aloldal-fejléc
   11. Szolgáltatások + Áraim  12. Miért válasszon  13. Rólam
   14. Munkáim + lightbox  15. Vélemények  16. Kapcsolat + űrlap + térkép
   17. CTA-sáv  18. Footer  19. Mobil alsó sáv  20. Jogi oldalak
   21. Reszponzív  22. Reduced-motion
   ========================================================================== */

/* ===== 1. RESET ======================================================= */
*, *::before, *::after { box-sizing: border-box; }
* { margin: 0; }
html { -webkit-text-size-adjust: 100%; scroll-behavior: smooth; }
img, svg, video, iframe { display: block; max-width: 100%; }
img, video { height: auto; }
input, button, textarea, select { font: inherit; color: inherit; }
button { cursor: pointer; background: none; border: none; }
ul { list-style: none; padding: 0; }
a { text-decoration: none; color: inherit; }

/* ===== 2. TOKENEK ===================================================== */
:root {
  --kek:#1B6FD4; --kek-sotet:#1558AB; --kek-vilagos:#7FB4FF;
  --sotetkek:#0B2545; --vilagos:#F4F7FB; --feher:#FFFFFF;
  --szoveg:#1A2233; --szurke:#667085; --border:#E4E9F0; --csillag:#F5A623;

  --sp-1:4px; --sp-2:8px; --sp-3:12px; --sp-4:16px; --sp-5:24px; --sp-6:32px; --sp-7:48px; --sp-8:64px;
  --r-btn:6px; --r-card:8px; --r-pill:999px;
  --sh-sm:0 1px 2px rgba(11,37,69,.06);
  --sh-md:0 6px 18px rgba(11,37,69,.08);
  --sh-lg:0 14px 40px rgba(11,37,69,.16);
  --sh-header:0 2px 14px rgba(11,37,69,.08);
  --container:1240px; --gutter:24px; --header-h:76px; --sec-pad:90px;
  --font:"Inter", system-ui, -apple-system, "Segoe UI", Roboto, Arial, "Noto Sans", sans-serif;
}

/* Inter self-hosted (opcionális) – lásd README.
@font-face{font-family:"Inter";font-style:normal;font-weight:400 900;font-display:swap;src:url("../fonts/Inter-Variable.woff2") format("woff2");}
*/

/* ===== 3. TIPOGRÁFIA ================================================== */
body { font-family:var(--font); font-size:17px; line-height:1.65; color:var(--szurke); background:var(--feher); -webkit-font-smoothing:antialiased; text-rendering:optimizeLegibility; }
h1,h2,h3,h4 { color:var(--szoveg); line-height:1.2; }
a { color:var(--kek); }
a:hover { color:var(--kek-sotet); }
:focus-visible { outline:3px solid var(--kek); outline-offset:2px; border-radius:4px; }
.skip-link { position:absolute; left:12px; top:-60px; background:var(--kek); color:#fff; padding:10px 18px; border-radius:var(--r-btn); font-weight:700; z-index:200; transition:top .2s ease; }
.skip-link:focus { top:12px; color:#fff; }

/* ===== 4. LAYOUT ===================================================== */
.container { width:100%; max-width:var(--container); margin-inline:auto; padding-inline:var(--gutter); }
.section { padding-block:var(--sec-pad); }
.section--light { background:var(--vilagos); }
.section--dark { background:var(--sotetkek); color:#d7e2f0; }
.section-intro { max-width:60ch; margin:calc(-1 * var(--sp-4)) auto var(--sp-7); text-align:center; }

.section-title { font-size:clamp(1.5rem,3vw,2rem); font-weight:800; text-transform:uppercase; letter-spacing:.01em; text-align:center; margin-bottom:var(--sp-7); }
.section-title::after { content:""; display:block; width:64px; height:4px; background:var(--kek); border-radius:2px; margin:var(--sp-3) auto 0; }
.section-title--left { text-align:left; }
.section-title--left::after { margin-inline:0; }
.section--dark .section-title { color:#fff; }

/* ===== 5. IKONOK ===================================================== */
.icon { width:24px; height:24px; fill:none; flex:none; }

/* ===== 6. GOMBOK ===================================================== */
.btn { display:inline-flex; align-items:center; justify-content:center; gap:var(--sp-2); padding:15px 30px; border-radius:var(--r-btn); font-weight:700; font-size:.95rem; text-transform:uppercase; letter-spacing:.01em; line-height:1.15; white-space:nowrap; border:2px solid transparent; transition:transform .2s ease, background-color .2s ease, box-shadow .2s ease, color .2s ease, border-color .2s ease; }
.btn .icon { width:20px; height:20px; }
.btn--primary { background:var(--kek); color:#fff; box-shadow:var(--sh-sm); }
.btn--primary:hover { background:var(--kek-sotet); color:#fff; transform:translateY(-2px); box-shadow:var(--sh-md); }
.btn--secondary { background:#fff; color:var(--kek); border-color:var(--kek); }
.btn--secondary:hover { background:var(--vilagos); color:var(--kek-sotet); transform:translateY(-2px); }
.btn--outline { background:transparent; color:var(--kek); border-color:var(--border); }
.btn--outline:hover { border-color:var(--kek); color:var(--kek-sotet); background:var(--vilagos); }
.btn--ghost-light { background:rgba(255,255,255,.12); color:#fff; border-color:rgba(255,255,255,.4); }
.btn--ghost-light:hover { background:rgba(255,255,255,.22); color:#fff; transform:translateY(-2px); }
.btn--stack { text-align:left; }
.btn--stack .btn__top { display:block; font-size:.72rem; opacity:.85; }
.btn--stack .btn__bottom { display:block; font-size:1rem; }

/* Header telefon-gomb: letisztult pill, nem nagybetűs, nem tördel */
.btn--phone { border-radius:var(--r-pill); padding:11px 20px; text-transform:none; letter-spacing:0; font-size:.92rem; gap:var(--sp-2); }
.btn--phone .icon { width:18px; height:18px; }

/* ===== 7. HEADER ===================================================== */
.site-header { position:sticky; top:0; z-index:100; background:#fff; border-bottom:1px solid var(--border); transition:box-shadow .25s ease; }
.site-header.is-scrolled { box-shadow:var(--sh-header); border-bottom-color:transparent; }
.site-header__inner { display:flex; align-items:center; gap:var(--sp-5); min-height:var(--header-h); }
.logo { display:inline-flex; align-items:center; gap:var(--sp-3); }
.logo__mark { display:grid; place-items:center; width:42px; height:42px; color:var(--kek); }
.logo__mark .icon { width:34px; height:34px; }
.logo__text { display:flex; flex-direction:column; line-height:1.05; }
.logo__name { font-weight:900; font-size:1.15rem; letter-spacing:.02em; color:var(--szoveg); }
.logo__sub { font-size:.6rem; font-weight:600; letter-spacing:.08em; color:var(--szurke); }
.main-nav { margin-left:auto; }
.main-nav__list { display:flex; align-items:center; gap:var(--sp-5); }
.main-nav__link { position:relative; color:var(--szoveg); font-weight:600; font-size:.82rem; text-transform:uppercase; letter-spacing:.03em; padding:6px 2px; }
.main-nav__link::after { content:""; position:absolute; left:0; right:0; bottom:-20px; height:3px; background:var(--kek); transform:scaleX(0); transition:transform .2s ease; }
.main-nav__link:hover { color:var(--kek); }
.main-nav__link.is-active { color:var(--kek); }
.main-nav__link.is-active::after { transform:scaleX(1); }
.main-nav__link--cta { color:var(--kek); }
.site-header__actions { display:flex; align-items:center; gap:var(--sp-3); }
.nav-toggle { display:none; width:44px; height:44px; align-items:center; justify-content:center; color:var(--szoveg); border-radius:var(--r-btn); }
.nav-toggle .icon { width:28px; height:28px; }

/* ===== 7b. NYELVVÁLTÓ ================================================ */
.lang-switch { position:relative; }
.lang-switch__btn { display:inline-flex; align-items:center; gap:6px; height:44px; padding:0 12px; color:var(--szoveg); border:1px solid var(--border); border-radius:var(--r-pill); font-weight:700; font-size:.82rem; letter-spacing:.02em; }
.lang-switch__btn:hover { border-color:var(--kek); color:var(--kek); }
.lang-switch__btn .icon { width:20px; height:20px; flex:none; }
.lang-switch__menu { position:absolute; top:calc(100% + 8px); right:0; z-index:110; min-width:150px; background:#fff; border:1px solid var(--border); border-radius:var(--r-card); box-shadow:var(--sh-md); padding:var(--sp-2); list-style:none; }
.lang-switch__menu[hidden] { display:none; }
.lang-switch__menu a { display:block; padding:10px 12px; border-radius:6px; font-weight:600; font-size:.9rem; color:var(--szoveg); }
.lang-switch__menu a:hover { background:var(--vilagos); color:var(--kek); }
.lang-switch__menu a.is-active { color:var(--kek); }
.mobile-menu__langs { display:flex; gap:var(--sp-2); margin-top:var(--sp-5); }
.mobile-menu__langs a { flex:1; text-align:center; padding:12px 4px; border:1px solid var(--border); border-radius:var(--r-btn); font-weight:700; font-size:.85rem; text-transform:uppercase; color:var(--szoveg); }
.mobile-menu__langs a.is-active { border-color:var(--kek); color:var(--kek); background:rgba(27,111,212,.06); }

/* ===== 8. MOBIL MENÜ ================================================= */
.mobile-menu { position:fixed; inset:0; z-index:150; background:#fff; display:flex; flex-direction:column; overflow-y:auto; }
.mobile-menu[hidden] { display:none; }
.mobile-menu.is-open { animation:fadeIn .2s ease; }
.mobile-menu__head { display:flex; align-items:center; justify-content:space-between; min-height:var(--header-h); border-bottom:1px solid var(--border); }
.mobile-menu__nav { display:flex; flex-direction:column; padding:var(--sp-5) var(--gutter) var(--sp-8); gap:var(--sp-2); }
.mobile-menu__nav a { padding:14px 4px; font-weight:700; font-size:1.1rem; text-transform:uppercase; letter-spacing:.02em; color:var(--szoveg); border-bottom:1px solid var(--border); }
.mobile-menu__nav a.is-active { color:var(--kek); }
.mobile-menu__nav a.btn { margin-top:var(--sp-4); border-bottom:none; color:#fff; justify-content:center; }
@keyframes fadeIn { from{opacity:0} to{opacity:1} }

/* ===== 9. HERO (full-bleed) ========================================== */
.hero { position:relative; min-height:min(86vh,720px); display:flex; align-items:center; background-color:var(--sotetkek); background-size:cover; background-position:center right; background-repeat:no-repeat; color:#fff; overflow:hidden; }
.hero::before { content:""; position:absolute; inset:0; background:linear-gradient(90deg, rgba(8,20,40,.86) 0%, rgba(8,20,40,.6) 40%, rgba(8,20,40,.15) 72%, rgba(8,20,40,0) 100%); }
.hero__inner { position:relative; z-index:1; max-width:640px; padding-block:var(--sp-8); }
.hero__title { color:#fff; font-size:clamp(2rem,5vw,3.4rem); font-weight:900; text-transform:uppercase; letter-spacing:-.02em; line-height:1.05; }
.hero__subtitle { color:var(--kek-vilagos); font-weight:700; text-transform:uppercase; letter-spacing:.02em; font-size:clamp(.95rem,1.6vw,1.15rem); margin-top:var(--sp-4); }
.hero__lead { color:#dbe6f4; margin-top:var(--sp-5); max-width:48ch; }
.hero__actions { display:flex; flex-wrap:wrap; gap:var(--sp-4); margin-top:var(--sp-6); }

/* ===== 10. ALOLDAL-FEJLÉC ============================================ */
.page-hero { background:var(--sotetkek); color:#fff; padding-block:clamp(40px,7vw,72px); text-align:center; }
.page-hero__title { color:#fff; font-size:clamp(1.7rem,4vw,2.6rem); font-weight:900; text-transform:uppercase; letter-spacing:-.01em; }
.page-hero__lead { color:#c6d5e8; max-width:60ch; margin:var(--sp-3) auto 0; }
.breadcrumbs { display:flex; gap:var(--sp-2); justify-content:center; flex-wrap:wrap; margin-top:var(--sp-4); font-size:.82rem; color:#9db4d1; }
.breadcrumbs a { color:#c6d5e8; }
.breadcrumbs a:hover { color:#fff; }

/* ===== 11. SZOLGÁLTATÁSOK + ÁRAIM ==================================== */
.card { background:#fff; border:1px solid var(--border); border-radius:var(--r-card); transition:transform .25s ease, box-shadow .25s ease; }
.card:hover { transform:translateY(-4px); box-shadow:var(--sh-md); }
.services__grid { display:grid; grid-template-columns:repeat(3,1fr); gap:var(--sp-5); }
.service-card { padding:var(--sp-6) var(--sp-5); text-align:center; display:flex; flex-direction:column; align-items:center; }
.service-card__icon { display:grid; place-items:center; width:66px; height:66px; border-radius:50%; background:rgba(27,111,212,.08); color:var(--kek); margin-bottom:var(--sp-4); }
.service-card__icon .icon { width:38px; height:38px; }
.service-card__title { font-size:1rem; font-weight:800; text-transform:uppercase; letter-spacing:.01em; color:var(--szoveg); }
.service-card__rule { display:block; width:34px; height:3px; background:var(--kek); border-radius:2px; margin:var(--sp-3) 0 var(--sp-4); }
.service-card p { font-size:.92rem; }

.pricing { margin-top:var(--sp-8); text-align:center; }
.pricing__title { font-size:clamp(1.25rem,2.4vw,1.6rem); font-weight:800; text-transform:uppercase; color:var(--szoveg); }
.pricing__intro { max-width:56ch; margin:var(--sp-3) auto var(--sp-6); }
.pricing__grid { display:grid; grid-template-columns:repeat(auto-fit,minmax(220px,1fr)); gap:var(--sp-5); max-width:900px; margin-inline:auto; }
.price-card { padding:var(--sp-6) var(--sp-5) var(--sp-5); position:relative; overflow:hidden; text-align:center; }
.price-card__bar { position:absolute; top:0; left:0; right:0; height:5px; background:var(--kek); }
.price-card__name { font-size:.95rem; font-weight:800; text-transform:uppercase; color:var(--szoveg); margin-top:var(--sp-2); }
.price-card__value { font-size:1.15rem; font-weight:800; color:var(--kek); margin:var(--sp-3) 0 var(--sp-2); }
.price-card__note { font-size:.86rem; }
.pricing__footnote { margin-top:var(--sp-6); font-weight:600; color:var(--szoveg); }
.pricing__disclaimer { margin-top:var(--sp-2); font-size:.85rem; color:var(--szurke); }
.pricing__cta { margin-top:var(--sp-5); }

/* Szolgáltatás-szekció klíma háttérrel + nagyon világos kék átfestéssel */
.services--bg { position:relative; overflow:hidden; isolation:isolate; }
.services--bg::before {
  content:""; position:absolute; inset:-14px; z-index:-1;
  background:
    linear-gradient(rgba(216,233,251,.80), rgba(226,239,252,.86)),
    url('img/services-bg.webp') center/cover no-repeat;
  filter:blur(2px);
}

/* Előtte–Utána */
.beforeafter__grid { display:grid; grid-template-columns:repeat(2,1fr); gap:var(--sp-6); max-width:920px; margin-inline:auto; }
.ba-card { border-radius:var(--r-card); overflow:hidden; border:1px solid var(--border); box-shadow:var(--sh-sm); background:#fff; }
.ba-card__item { position:relative; }
.ba-card__item + .ba-card__item { border-top:3px solid var(--kek); }
.ba-card__item img { width:100%; aspect-ratio:4/3; object-fit:cover; }
.ba-card__label { position:absolute; top:12px; left:12px; padding:5px 16px; border-radius:var(--r-pill); font-weight:800; font-size:.8rem; text-transform:uppercase; letter-spacing:.03em; color:#fff; box-shadow:var(--sh-sm); }
.ba-card__label--before { background:rgba(11,37,69,.88); }
.ba-card__label--after { background:var(--kek); }

/* Tartalmi (szolgáltatás-) oldalak */
.prose { max-width:760px; margin-inline:auto; }
.prose > h2 { font-size:clamp(1.3rem,2.4vw,1.7rem); font-weight:800; text-transform:uppercase; color:var(--szoveg); margin-top:var(--sp-7); margin-bottom:var(--sp-3); }
.prose > h2:first-child { margin-top:0; }
.prose h3 { font-size:1.1rem; font-weight:700; color:var(--szoveg); margin-top:var(--sp-5); margin-bottom:var(--sp-2); }
.prose p { margin-top:var(--sp-3); }
.prose > p:first-child { margin-top:0; }
.prose strong { color:var(--szoveg); }
.check-list { list-style:none; padding:0; display:flex; flex-direction:column; gap:var(--sp-2); margin-top:var(--sp-3); }
.check-list li { display:flex; gap:var(--sp-3); align-items:flex-start; }
.check-list li .icon { width:22px; height:22px; color:var(--kek); flex:none; margin-top:2px; }
.steps { display:grid; gap:var(--sp-4); margin-top:var(--sp-4); }
.step { display:flex; gap:var(--sp-4); align-items:flex-start; }
.step__num { flex:none; width:38px; height:38px; border-radius:50%; background:var(--kek); color:#fff; display:grid; place-items:center; font-weight:800; }
.step__body h3 { margin:0 0 4px; }
.step__body p { margin:0; font-size:.95rem; }
.service-card__more { margin-top:var(--sp-4); font-weight:700; font-size:.85rem; text-transform:uppercase; letter-spacing:.02em; color:var(--kek); display:inline-flex; align-items:center; gap:6px; }
.service-card__more .icon { width:16px; height:16px; }
.card.service-card:hover .service-card__more { gap:10px; }

/* GYIK akkordeon (natív details/summary) */
.faq { max-width:760px; margin-inline:auto; }
.faq__item { border:1px solid var(--border); border-radius:var(--r-card); background:#fff; margin-bottom:var(--sp-3); overflow:hidden; }
.faq__item summary { list-style:none; cursor:pointer; padding:18px 20px; font-weight:700; color:var(--szoveg); display:flex; justify-content:space-between; align-items:center; gap:12px; }
.faq__item summary::-webkit-details-marker { display:none; }
.faq__item summary::after { content:"+"; font-size:1.5rem; color:var(--kek); font-weight:400; line-height:1; flex:none; }
.faq__item[open] summary::after { content:"–"; }
.faq__a { padding:0 20px 18px; }
.faq__a p { margin:0; color:var(--szurke); }
.faq__a p + p { margin-top:var(--sp-3); }

/* ===== 12. MIÉRT VÁLASSZON =========================================== */
.why { background-color:var(--sotetkek); background-size:cover; background-position:center; background-repeat:no-repeat; background-blend-mode:multiply; }
.why__grid { display:grid; grid-template-columns:repeat(7,1fr); margin-top:var(--sp-6); }
.why__item { display:flex; flex-direction:column; align-items:center; text-align:center; gap:var(--sp-3); padding:var(--sp-3) var(--sp-4); border-left:1px solid rgba(255,255,255,.14); }
.why__item:first-child { border-left:none; }
.why__icon { color:#fff; }
.why__icon .icon { width:40px; height:40px; }
.why__label { font-size:.74rem; font-weight:700; text-transform:uppercase; letter-spacing:.02em; color:#fff; line-height:1.3; }

/* ===== 13. RÓLAM ===================================================== */
.about__inner { display:grid; grid-template-columns:.8fr 1.2fr; gap:var(--sp-7); align-items:center; }
.about__img { width:100%; border-radius:12px; box-shadow:var(--sh-md); object-fit:cover; }
.about__content p { margin-top:var(--sp-4); }
.about__actions { display:flex; flex-wrap:wrap; gap:var(--sp-4); margin-top:var(--sp-6); }

/* ===== 14. MUNKÁIM + LIGHTBOX ======================================== */
.works__grid { display:grid; grid-template-columns:repeat(5,1fr); gap:var(--sp-4); }
.works__grid--wide { grid-template-columns:repeat(3,1fr); gap:var(--sp-5); }
.works__item { display:flex; flex-direction:column; }
.works__btn { padding:0; border-radius:var(--r-card); overflow:hidden; border:1px solid var(--border); transition:transform .25s ease, box-shadow .25s ease; }
.works__btn:hover { transform:translateY(-4px); box-shadow:var(--sh-md); }
.works__btn img { width:100%; aspect-ratio:4/3; object-fit:cover; }
.works__caption { text-align:center; font-weight:600; color:var(--szoveg); margin-top:var(--sp-3); font-size:.9rem; }
.works__cta { text-align:center; margin-top:var(--sp-7); }

/* Üres állapot (pl. blog – még nincs bejegyzés) */
.empty-state { max-width:560px; margin-inline:auto; text-align:center; }
.empty-state__icon { display:inline-grid; place-items:center; width:72px; height:72px; border-radius:50%; background:rgba(27,111,212,.08); color:var(--kek); margin-bottom:var(--sp-5); }
.empty-state__icon .icon { width:36px; height:36px; }
.empty-state__title { font-size:clamp(1.25rem,2.4vw,1.6rem); font-weight:800; text-transform:uppercase; color:var(--szoveg); }
.empty-state__text { margin-top:var(--sp-3); }
.empty-state__actions { display:flex; flex-wrap:wrap; gap:var(--sp-4); justify-content:center; margin-top:var(--sp-6); }

.lightbox { position:fixed; inset:0; z-index:200; background:rgba(6,18,35,.92); display:flex; align-items:center; justify-content:center; gap:var(--sp-3); padding:var(--sp-5); }
.lightbox[hidden] { display:none; }
.lightbox__figure { max-width:min(1000px,92vw); text-align:center; }
.lightbox__img { width:100%; max-height:80vh; object-fit:contain; border-radius:8px; background:#0b2545; }
.lightbox__caption { color:#dbe6f4; margin-top:var(--sp-3); font-weight:600; }
.lightbox__close { position:absolute; top:18px; right:18px; width:48px; height:48px; color:#fff; display:grid; place-items:center; border-radius:var(--r-btn); background:rgba(255,255,255,.08); }
.lightbox__close:hover { background:rgba(255,255,255,.18); }
.lightbox__nav { width:52px; height:52px; color:#fff; flex:none; display:grid; place-items:center; border-radius:50%; background:rgba(255,255,255,.08); }
.lightbox__nav:hover { background:rgba(255,255,255,.18); }
.lightbox__nav .icon { width:30px; height:30px; }

/* ===== 15. VÉLEMÉNYEK =============================================== */
.reviews__inner { display:grid; grid-template-columns:240px 1fr; gap:var(--sp-7); align-items:start; }
.reviews__head { position:sticky; top:calc(var(--header-h) + 20px); }
.reviews__quote { color:var(--kek); display:block; }
.reviews__quote .icon { width:72px; height:72px; }
.reviews__grid { display:grid; grid-template-columns:repeat(auto-fit,minmax(240px,1fr)); gap:var(--sp-5); }
.review-card { padding:var(--sp-5); }
.review-card__stars { display:flex; gap:3px; color:var(--csillag); margin-bottom:var(--sp-3); }
.review-card__stars .icon { width:20px; height:20px; }
.review-card__text { color:var(--szoveg); }
.review-card__name { font-weight:700; color:var(--szoveg); margin-top:var(--sp-4); }
.reviews__google { display:inline-flex; align-items:center; gap:8px; margin-top:var(--sp-5); font-weight:600; }

/* ===== 16. KAPCSOLAT + ŰRLAP + TÉRKÉP =============================== */
.contact__grid { display:grid; grid-template-columns:1.5fr 1fr; gap:var(--sp-7); align-items:start; }
.contact__aside { display:flex; flex-direction:column; gap:var(--sp-5); }
.contact__list { display:flex; flex-direction:column; gap:var(--sp-4); }
.contact__list li { display:flex; align-items:flex-start; gap:var(--sp-3); }
.contact__list a { color:#fff; font-weight:600; }
.contact__list a:hover { color:var(--kek-vilagos); }
.contact__list small { color:#a9bdd6; }
.contact__ico { color:var(--kek-vilagos); flex:none; }
.contact__form-title { color:#fff; font-weight:800; text-transform:uppercase; font-size:1.1rem; margin-bottom:var(--sp-4); }

/* Kétoszlopos űrlap: bal (név/email/telefon), jobb (tárgy/üzenet), lent GDPR+küldés */
.form--split { display:grid; grid-template-columns:1fr 1fr; gap:var(--sp-3) var(--sp-5); align-items:start; }
.form__col { display:flex; flex-direction:column; }
.form__col--right { height:100%; }
.form--split .form__row--full { grid-column:1 / -1; }
.form--split textarea.form__input { min-height:150px; flex:1; }

.form__row { margin-bottom:var(--sp-4); }
.form__label { display:block; font-size:.85rem; font-weight:600; color:#cfe0f2; margin-bottom:6px; }
.form__input { width:100%; padding:12px 14px; background:#fff; border:1px solid var(--border); border-radius:var(--r-btn); color:var(--szoveg); }
.form__input:focus-visible { outline-offset:0; border-color:var(--kek); }
textarea.form__input { resize:vertical; min-height:96px; }
.req { color:#ff9db0; }
.form__error { display:block; min-height:1em; color:#ffb4c0; font-size:.8rem; margin-top:4px; }
.form__input.is-invalid { border-color:#ff6b81; box-shadow:0 0 0 2px rgba(255,107,129,.25); }
.form__row--check { display:flex; flex-direction:column; }
.form__check { display:flex; gap:var(--sp-2); align-items:flex-start; font-size:.85rem; color:#cfe0f2; }
.form__check input { margin-top:4px; flex:none; width:18px; height:18px; accent-color:var(--kek); }
.form__check a { color:#fff; text-decoration:underline; }
.form__submit { margin-top:var(--sp-2); }
.form__submit[disabled] { opacity:.7; cursor:progress; }
.form__status { margin-top:var(--sp-3); font-weight:600; min-height:1.2em; }
.form__status.is-ok { color:#7ee0a6; }
.form__status.is-err { color:#ffb4c0; }
.form__hp { position:absolute; left:-9999px; width:1px; height:1px; overflow:hidden; }

/* Szolgáltatási terület + stilizált térkép (nincs külső Google-hívás) */
.map-figure { margin:0; }
.map-figure figcaption { color:#a9bdd6; font-size:.82rem; margin-top:var(--sp-2); }
.map__svg { width:100%; height:auto; border-radius:var(--r-card); border:1px solid rgba(255,255,255,.12); }
.area__title { color:#fff; font-weight:800; text-transform:uppercase; font-size:1.05rem; margin-bottom:var(--sp-2); }
.area__big { color:var(--kek-vilagos); font-weight:800; font-size:clamp(1.3rem,2.5vw,1.7rem); line-height:1.15; margin-bottom:var(--sp-4); }
.area__big span { color:#9db4d1; font-weight:600; font-size:.8em; }
.area__note { color:#c6d5e8; font-size:.85rem; margin-top:var(--sp-3); }
.area__note strong { color:#fff; }

/* ===== 17. CTA-SÁV ================================================== */
.cta-band { background:var(--kek); color:#fff; text-align:center; }
.cta-band__title { color:#fff; font-size:clamp(1.4rem,3vw,2rem); font-weight:800; text-transform:uppercase; }
.cta-band__text { color:#e6f0fb; max-width:56ch; margin:var(--sp-3) auto var(--sp-5); }
.cta-band__actions { display:flex; gap:var(--sp-4); justify-content:center; flex-wrap:wrap; }

/* ===== 18. FOOTER ================================================== */
.site-footer { background:var(--sotetkek); color:#a9bdd6; border-top:1px solid rgba(255,255,255,.08); }
.site-footer__top { display:grid; grid-template-columns:1.6fr 1fr 1fr 1fr; gap:var(--sp-6); padding-block:var(--sp-8) var(--sp-6); }
.site-footer__brand .logo__name { color:#fff; }
.site-footer__brand p { margin-top:var(--sp-3); font-size:.9rem; max-width:34ch; }
.site-footer__col h3 { color:#fff; font-size:.8rem; text-transform:uppercase; letter-spacing:.06em; margin-bottom:var(--sp-3); }
.site-footer__col a, .site-footer__col p { display:block; color:#c6d5e8; font-size:.9rem; padding:4px 0; }
.site-footer__col a:hover { color:var(--kek-vilagos); }
.site-footer__bottom { display:flex; align-items:center; justify-content:space-between; flex-wrap:wrap; gap:var(--sp-3); padding-block:var(--sp-4); border-top:1px solid rgba(255,255,255,.08); font-size:.85rem; }
.site-footer__bottom nav { display:flex; gap:var(--sp-5); }
.site-footer__bottom a { color:#c6d5e8; }
.site-footer__bottom a:hover { color:var(--kek-vilagos); }

/* ===== 19. MOBIL ALSÓ SÁV ========================================== */
.mobile-bar { display:none; position:fixed; left:0; right:0; bottom:0; z-index:120; background:#fff; border-top:1px solid var(--border); box-shadow:0 -4px 16px rgba(11,37,69,.1); }
.mobile-bar__btn { flex:1 1 50%; display:flex; align-items:center; justify-content:center; gap:var(--sp-2); padding:14px 8px; font-weight:700; text-transform:uppercase; font-size:.85rem; letter-spacing:.02em; }
.mobile-bar__btn .icon { width:20px; height:20px; }
.mobile-bar__btn--call { background:var(--kek); color:#fff; }
.mobile-bar__btn--quote { background:var(--sotetkek); color:#fff; }

/* ===== 20. JOGI / ŰRLAP-OLDALAK ==================================== */
.page { padding-block:clamp(40px,6vw,72px); background:var(--vilagos); min-height:50vh; }
.page__card { background:#fff; border:1px solid var(--border); border-radius:var(--r-card); box-shadow:var(--sh-sm); max-width:720px; margin-inline:auto; padding:clamp(24px,5vw,48px); }
.legal { max-width:860px; }
.legal h2 { font-size:1.15rem; text-transform:uppercase; color:var(--szoveg); margin-top:var(--sp-6); margin-bottom:var(--sp-2); }
.legal p, .legal li { color:var(--szurke); }
.legal ul { list-style:disc; padding-left:1.4em; display:flex; flex-direction:column; gap:6px; }
.legal p { margin-top:var(--sp-3); }
.legal a { text-decoration:underline; }
.legal .placeholder { background:#fff4d6; padding:0 4px; border-radius:3px; color:#7a5a00; font-weight:600; }
.form--light .form__label { color:var(--szoveg); }
.form--light .form__check { color:var(--szurke); }
.form--light .form__check a { color:var(--kek); }
.form--light .req { color:#d33; }
.form--light .form__error { color:#d33; }
.form--light .form__status.is-ok { color:#1a8a4c; }
.form--light .form__status.is-err { color:#d33; }
.form__grid-2 { display:grid; grid-template-columns:1fr 1fr; gap:var(--sp-4); }
.back-link { display:inline-flex; align-items:center; gap:6px; margin-top:var(--sp-6); font-weight:600; }

/* ===== 21. RESZPONZÍV ============================================== */
@media (max-width:1080px){
  .main-nav__list { gap:var(--sp-4); }
  .main-nav__link { font-size:.76rem; }
  .contact__grid { grid-template-columns:1fr; }
  .site-footer__top { grid-template-columns:1fr 1fr; }
}
@media (max-width:960px){
  :root { --sec-pad:64px; }
  .main-nav { display:none; }
  .nav-toggle { display:inline-flex; }
  .about__inner { grid-template-columns:1fr; }
  .about__media { max-width:360px; }
  .why__grid { grid-template-columns:repeat(4,1fr); gap:var(--sp-5); }
  .why__item { border-left:none; }
  .reviews__inner { grid-template-columns:1fr; }
  .reviews__head { position:static; }
  .reviews__quote .icon { width:56px; height:56px; }
  .works__grid { grid-template-columns:repeat(3,1fr); }
  .services__grid { grid-template-columns:repeat(2,1fr); }
}
@media (max-width:768px){
  :root { --sec-pad:56px; }
  body { font-size:16px; padding-bottom:62px; }
  .btn--phone span[data-tel-display] { display:none; }
  .btn--phone { padding:11px; }
  .lang-switch__btn { padding:0 10px; }
  .mobile-bar { display:flex; }
  .form--split { grid-template-columns:1fr; }
  .site-footer__top { grid-template-columns:1fr; }
  .site-footer__bottom { flex-direction:column; text-align:center; }
  .hero { min-height:auto; padding-block:var(--sp-7); }
  .hero::before { background:linear-gradient(180deg, rgba(8,20,40,.6) 0%, rgba(8,20,40,.82) 100%); }
}
@media (max-width:620px){
  .why__grid { grid-template-columns:repeat(2,1fr); }
  .works__grid { grid-template-columns:repeat(2,1fr); }
  .works__grid--wide { grid-template-columns:repeat(2,1fr); }
  .form__grid-2 { grid-template-columns:1fr; }
  .hero__actions .btn { flex:1 1 100%; }
}
@media (max-width:420px){
  .services__grid { grid-template-columns:1fr; }
  .works__grid, .works__grid--wide { grid-template-columns:1fr; }
}

/* ===== 22. REDUCED MOTION ========================================== */
@media (prefers-reduced-motion:reduce){
  html { scroll-behavior:auto; }
  *, *::before, *::after { animation-duration:.001ms !important; animation-iteration-count:1 !important; transition-duration:.001ms !important; }
  .card:hover, .btn:hover, .works__btn:hover { transform:none; }
}
