:root{
  --accent:#0077a8;
  --accent-light:#1ca4d8;
  --accent-mid:#0e8ec4;
  --warm:#d97706;             
  --text-dark:#0e2a3a;
  --maxw:1200px;
  --header-h:64px;
  --maxw-wide: 1600px;   
}

*{box-sizing:border-box}
html,body{margin:0;padding:0;height:100%}
body{
  font-family:system-ui,-apple-system,"Segoe UI",Roboto,Helvetica,Arial,"Noto Sans";
  color:var(--text-dark);
  line-height:1.45;
  scroll-behavior:smooth;
  padding-top: var(--header-h); 
}


#fooldal {
  position: relative;
  background:
    linear-gradient(rgba(248, 251, 255, 0.9), rgba(227, 237, 255, 0.9)),
    url("profi_klimaszereles_hatterkep.jpg") center center / cover no-repeat;
}

#miert-mi {
  position: relative;
  background:
    linear-gradient(rgba(243, 248, 255, 0.9), rgba(221, 231, 255, 0.9)),
    url("miert_valasszon_minket_hatterkep.jpg") center center / cover no-repeat;
}

#szolgaltatasaink {
  position: relative;
  background:
    linear-gradient(rgba(238, 245, 255, 0.9), rgba(214, 227, 255, 0.9)),
    url("szolgaltatasaink_hatterkep.jpg") center center / cover no-repeat;
}

#klimaszereles {
  position: relative;
  background:
    linear-gradient(rgba(232, 240, 255, 0.9), rgba(203, 217, 255, 0.9)),
    url("klimaszereles_hatterkep.jpg") center center / cover no-repeat;
}



#karbantartas {
  position: relative;
  background:
    linear-gradient(rgba(250, 247, 242, 0.9), rgba(231, 215, 195, 0.9)),
    url("klimakarbantartas_hatterkep.jpg") center center / cover no-repeat;
}



#klimajavitas {
  position: relative;
  background:
    linear-gradient(rgba(249, 251, 255, 0.9), rgba(225, 233, 255, 0.9)),
    url("klimajavitas_hatterkep.jpg") center center / cover no-repeat;
}



#futes-klimaval {
  position: relative;
  background:
    linear-gradient(rgba(250, 244, 247, 0.95), rgba(226, 202, 221, 0.95)),
    url("klima_telen_hatterkep.jpg") center center / cover no-repeat;
}



#ertekeink {
  position: relative;
  background:
    linear-gradient(rgba(246, 251, 255, 0.95), rgba(214, 231, 255, 0.95)),
    url("ertekeink_hatterkep.jpg") center center / cover no-repeat;
}




#referenciak {
  position: relative;
  background:
    linear-gradient(rgba(244, 249, 255, 0.9), rgba(219, 230, 255, 0.9)),
    url("referenciamunkaink_hatter.jpg") center center / cover no-repeat;
}




#gyik {
  position: relative;
  background:
    linear-gradient(rgba(249, 244, 246, 0.9), rgba(227, 214, 224, 0.9)),
    url("gyakori_kerdesek_hatterkep.jpg") center center / cover no-repeat;
}



#gyik2 {
  position: relative;
  background:
    linear-gradient(rgba(243, 248, 255, 0.95), rgba(219, 229, 255, 0.95)),
    url("tovabbi_gyakori_kerdesek_hatter.jpg") center center / cover no-repeat;
}



#miert-futeni-klimaval {
  position: relative;
  background:
    linear-gradient(rgba(251, 245, 247, 0.9), rgba(215, 175, 196, 0.9)),
    url("miert_futeni_klimaval.png") center center / cover no-repeat;
}



#markak {
  position: relative;
  background:
    linear-gradient(rgba(242, 248, 255, 0.9), rgba(216, 229, 255, 0.9)),
    url("markak_hatterkep.jpg") center center / cover no-repeat;
}



#folyamat {
  position: relative;
  background:
    linear-gradient(rgba(234, 242, 255, 0.9), rgba(205, 218, 255, 0.9)),
    url("klimaszereles_folyamata_hatterkep.png") center center / cover no-repeat;
}



#miert-valasszon {
  position: relative;
  background:
    linear-gradient(rgba(240, 247, 255, 0.9), rgba(212, 224, 255, 0.9)),
    url("miert_valasszon_hatterkep2.jpg") center center / cover no-repeat;
}



#kapcsolat-oldal.kontakt-wrap{
  position: relative;
  background:

    linear-gradient(rgba(243,244,246,0.9), rgba(215,220,230,0.9)),

    url("kapcsolat_hatterkep.jpg") center center / cover no-repeat,

    radial-gradient(rgba(255,255,255,.35) 1px, transparent 1px) 0 0/6px 6px,

    linear-gradient(90deg,#f3f4f6 0%, #eceff3 35%, #e5e8ee 60%, #dee2ea 80%, #d7dce6 100%);
}


#kapcsolat-oldal .contact-grid {
  grid-template-columns: 1fr;
}



.stats4{
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: clamp(16px, 2.2vw, 26px);
  margin-bottom: 22px;
  text-align: center;
}
.stat-card{
  background: rgba(255,255,255,0.9);
  border-radius: 12px;
  padding: clamp(14px, 2vw, 18px);
  box-shadow: 0 8px 22px rgba(0,0,0,0.06);
}
.stat-value{
  font-size: clamp(28px, 4vw, 38px);
  font-weight: 800;
  color: var(--accent);
  margin-bottom: 6px;
}
.stat-title{
  margin: 0 0 6px;
  font-size: clamp(17px, 2vw, 20px);
  color: #102a3c;
}
.stat-card p{
  margin: 0;
  font-size: 15.5px;
  color: #223e52;
}


@media (max-width:1024px){
  .stats4{ grid-template-columns: repeat(2,1fr); }
}

@media (max-width:640px){
  .stats4{ grid-template-columns: 1fr; }
}


[id]{scroll-margin-top:calc(var(--header-h) + 12px)}


header.site-header{
  position:fixed; top:0; left:0; right:0; z-index:1000;
  background:rgba(255,255,255,0.9);
  backdrop-filter:saturate(1.1) blur(6px);
  box-shadow:0 2px 12px rgba(0,0,0,0.06);
}
.nav-bar{
  max-width:var(--maxw);margin:0 auto;
  padding:0 clamp(12px,3vw,24px);
  height:var(--header-h);
  display:flex;align-items:center;justify-content:space-between;gap:16px;
}


.site-header .brand{
  display:flex;
  align-items:center;
  gap:10px;
  text-decoration:none;
  color:inherit;
  white-space:nowrap;
  flex-shrink:0;
}
.site-header .brand img{width:36px;height:36px;object-fit:cover;border-radius:8px;display:block}
.site-header .brand span{font-weight:700;overflow:hidden;text-overflow:ellipsis}

nav.primary{display:flex;align-items:center;gap:18px}
.nav-link{text-decoration:none;color:#103042;font-weight:600;padding:8px 10px;border-radius:8px}
.nav-link:hover,.nav-link:focus-visible{background:rgba(0,0,0,0.06);outline:0}

.hambox{display:none}
.ham-btn{display:none;align-items:center;justify-content:center;width:40px;height:40px;border-radius:10px;cursor:pointer;border:1px solid rgba(0,0,0,0.08);background:#fff}
.ham-btn svg{width:22px;height:22px}

.mobile-panel{display:none;background:rgba(255,255,255,0.97);backdrop-filter:blur(6px);box-shadow:0 6px 20px rgba(0,0,0,0.08) inset}
.mobile-panel nav{max-width:var(--maxw);margin:0 auto;padding:8px clamp(12px,3vw,24px) 16px;display:grid;gap:6px}
.mobile-panel .nav-link{padding:10px 12px;border-radius:10px}


.hambox:checked ~ .mobile-panel{display:block}
.hambox:checked ~ .nav-bar .ham-btn{background:#f2f6fb}


.primary { position: relative; }
.more{ position: relative; }
.more-toggle{
  cursor: pointer;
  user-select: none;
  display: inline-flex;
  align-items: center;
}
.more[open] .more-toggle{ background: rgba(0,0,0,0.06); }
.more-menu{
  position: absolute;
  top: calc(100% + 6px);
  right: 0;
  min-width: 220px;
  padding: 6px;
  background: #fff;
  border: 1px solid rgba(0,0,0,0.08);
  border-radius: 10px;
  box-shadow: 0 10px 28px rgba(0,0,0,0.12);
  display: grid;
  gap: 4px;
  z-index: 1100;
}
.more-item{ display:block; padding:10px 12px; border-radius:8px; }
.more-item:hover,.more-item:focus-visible{ background:rgba(0,0,0,0.06); outline:0; }


@media (max-width:1024px){
  .more{ display:none; }
}


.wrap{

  display:grid;
  grid-template-columns:1fr minmax(260px,34%); 
  gap:clamp(16px,3vw,28px);
  align-items:stretch;
  width:100%;         
  margin:0;
  padding:clamp(16px,3.5vw,36px);
  position: relative;
  isolation: isolate;
}
.wrap--single{
  grid-template-columns:1fr;   
  width:100%;                 
}

.content{display:flex;flex-direction:column;justify-content:center;padding:clamp(12px,2.8vw,28px)}
.content--wide{justify-content:flex-start}

h1{margin:0 0 8px;font-size:clamp(26px,4vw,42px);letter-spacing:0.2px}
.subtitle{margin:0 0 14px;font-size:clamp(16px,2vw,20px);color:#274458;opacity:0.9}

.tags{display:flex;gap:18px;flex-wrap:wrap;margin:12px 0 22px}
.tag{font-weight:700;font-size:16px;color:#143247;background:none;border:none;padding:0}

.cta-title{margin:20px 0 8px;font-size:22px;color:#143247}
.cta-desc{margin:0 0 18px;color:#223e52;max-width:none}
.cta{
  display:inline-block;width:fit-content;padding:12px 18px;border-radius:12px;
  background:var(--accent);color:#fff;text-decoration:none;font-weight:700;
  transition:background-color .2s ease,transform .12s ease,box-shadow .12s ease;
  box-shadow:0 6px 18px rgba(0,119,168,0.25)
}
.cta:hover{background:var(--accent-light);transform:translateY(-1px);box-shadow:0 8px 24px rgba(0,119,168,0.35)}
.cta:active{transform:translateY(0)}

.content .cta{ margin-left:auto; align-self:flex-end; }

.photo{position:relative;display:flex;align-items:center;justify-content:center;padding:clamp(8px,1.8vw,16px)}
.photo figure{margin:0;width:100%;height:100%;display:grid;place-items:center;border-radius:12px;overflow:clip;box-shadow:0 8px 26px rgba(0,0,0,0.12);background:#fff}
.photo img{width:100%;height:100%;object-fit:cover;object-position:center;display:block}


.page-title{color:#143247;margin:0 0 18px;font-size:clamp(24px,3.2vw,34px);letter-spacing:.2px}
.features{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(16px,2.6vw,28px);margin-bottom:26px}
.feature{background:rgba(255,255,255,0.55);border:1px solid rgba(0,0,0,0.06);border-radius:14px;padding:clamp(14px,2.2vw,18px);box-shadow:0 6px 18px rgba(0,0,0,0.05);backdrop-filter:blur(2px)}
.feature .icon{font-size:34px;margin-bottom:8px}
.feature h3{margin:0 0 8px;font-size:clamp(18px,2.2vw,22px);color:#1a2d40}
.feature p{margin:0;color:#223e52;font-size:15.5px}


.services{
  display:grid;
  grid-template-columns: repeat(3, 1fr);
  gap: clamp(16px, 2.6vw, 28px);
  margin-bottom: 26px;
}
.service-card{
  background: rgba(255,255,255,0.9);
  border: 1px solid rgba(0,0,0,0.06);
  border-left: 8px solid var(--accent-mid);
  border-radius: 12px;
  padding: clamp(14px, 2.2vw, 18px);
  box-shadow: 0 12px 28px rgba(0,0,0,0.08);
}
.service-card h3{ margin:0 0 8px; font-size:clamp(18px,2.2vw,22px); color:#102a3c; }
.service-card p{ margin:0 0 10px; color:#223e52; font-size:15.5px; }
.service-list{ list-style:disc; padding-left:22px; margin:8px 0 0; }
.service-list li{ margin:6px 0; }


.process{ display:grid; gap:14px; margin: 8px 0 20px; }
.step{
  display:flex; gap:14px; align-items:flex-start;
  background: rgba(255,255,255,0.85);
  border:1px solid rgba(0,0,0,0.06);
  border-radius:12px;
  padding:12px 14px;
  box-shadow:0 8px 22px rgba(0,0,0,0.06);
}
.step img{
  width:64px; height:64px; object-fit:contain; flex:0 0 64px; display:block;
}
.step h3{ margin:0 0 4px; font-size:clamp(17px,2vw,20px); color:#102a3c; }
.step p{ margin:0; color:#223e52; font-size:15.5px; }


#klimaszereles.wrap{ grid-template-columns: 60% 40%; }
#klimaszereles .photo img{ object-fit:cover; object-position:left top; }


#karbantartas.wrap{ grid-template-columns: 60% 40%; }
.subhead-warm{ margin:14px 0 6px; color:var(--warm); font-weight:800; font-size:clamp(17px,2.1vw,20px); letter-spacing:.2px; }
.plain-list{ list-style: disc; padding-left:22px; margin:6px 0 10px; }
.note{ margin:10px 0 12px; color:#213748; }


.site-footer{
  width:100%;
  margin:0;
  padding:12px clamp(16px,3.5vw,36px) 28px;
  font-size:12px;color:#456;display:flex;flex-wrap:wrap;gap:10px;align-items:center
}
.footer-item{white-space:nowrap}
.footer-sep{opacity:.5}


.repair-features{
  display:grid;
  grid-template-columns: repeat(3, 1fr);
  gap: clamp(16px, 2.6vw, 28px);
  margin-bottom: 22px;
}
.repair-card{
  background: #f0f6ff;
  border: 2px solid #3b82f6;
  border-radius: 12px;
  padding: clamp(14px, 2vw, 18px);
  box-shadow: 0 6px 16px rgba(0,0,0,0.05);
}
.repair-card h3{ margin:0 0 6px; font-size:clamp(18px,2.2vw,22px); color:#123260; }
.repair-card p{ margin:0; font-size:15.5px; color:#1e293b; }


@media (max-width:1024px){ .repair-features{ grid-template-columns: repeat(2, 1fr); } }
@media (max-width:640px){ .repair-features{ grid-template-columns: 1fr; } }


.bottom-illustration{ margin-top:16px; }
.bottom-illustration img{
  width:50%;            
  max-width: 640px;     
  height:auto; display:block;
  margin-left:auto;     
  border-radius:12px; box-shadow:0 8px 26px rgba(0,0,0,0.10); background:#fff;
}


.values-grid{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:clamp(16px, 2.4vw, 28px);
  margin-bottom:22px;
}
.value-card{
  background: rgba(255,255,255,0.9);
  border: 1px solid rgba(0,0,0,0.06);
  border-radius: 14px;
  padding: clamp(14px, 2vw, 18px);
  box-shadow: 0 10px 24px rgba(0,0,0,0.06);
  backdrop-filter: blur(2px);
}
.value-icon{ width:56px; height:56px; object-fit:contain; display:block; margin-bottom:8px; }
.value-card h3{ margin:0 0 6px; font-size:clamp(18px,2.1vw,22px); color:#102a3c; }
.value-card p{ margin:0; color:#223e52; font-size:15.5px; }


@media (max-width:1024px){ .values-grid{ grid-template-columns: repeat(2, 1fr); } }

@media (max-width:640px){ .values-grid{ grid-template-columns: 1fr; } }


.refs-grid{
  display:grid;
  grid-template-columns:repeat(4,1fr);
  gap:clamp(12px, 2vw, 20px);
  margin:10px 0 22px;
}
.refs-item{
  position:relative; border-radius:12px; overflow:clip;
  box-shadow:0 10px 24px rgba(0,0,0,0.08); background:#fff;
  aspect-ratio:4 / 3;
}
.refs-item img{ width:100%; height:100%; object-fit:cover; display:block; }

@media (max-width:1024px){
  .refs-grid{ grid-template-columns: repeat(3, 1fr); }
  .refs-desktop-only{ display:none; }
}

@media (max-width:640px){ .refs-grid{ grid-template-columns: repeat(2, 1fr); } }


.faq-grid{
  display:grid;
  grid-template-columns:repeat(2,1fr);
  gap:clamp(16px, 2.4vw, 28px);
  margin-bottom:22px;
}
.faq-card{
  background:#fff;
  border:2px solid #b197c6;
  border-radius:12px;
  box-shadow:0 10px 24px rgba(0,0,0,0.06);
  overflow:hidden;
}
.faq-head{
  background:#e9def3;
  color:#2a1e3f;
  font-weight:800;
  padding:8px 12px;
  font-size:clamp(16px,1.8vw,18px);
}
.faq-title{
  margin:10px 12px 6px;
  font-size:clamp(18px,2.1vw,22px);
  color:#102a3c;
}
.faq-card p{ margin:0 12px 12px; color:#223e52; font-size:15.5px; }

.faq-highlight{ color:var(--warm); font-weight:700; }

@media (max-width:1024px){ .faq-grid{ grid-template-columns:1fr; } }


.faq2-grid{
  display:grid;
  grid-template-columns: repeat(2, 1fr);
  gap: clamp(16px, 2.2vw, 26px);
  margin-bottom: 22px;
}
.faq2-item{ background: transparent; padding: 2px 0; }
.faq2-title{
  margin: 4px 0 6px;
  font-size: clamp(18px, 2.1vw, 22px);
  color: #143247;
  font-weight: 800;
}
.faq2-item p{ margin: 0 0 4px; color:#223e52; font-size: 15.5px; }


.lead-orange{
  margin: 6px 0 14px;
  color: var(--warm);
  font-weight: 800;
  font-size: clamp(17px, 2.2vw, 20px);
}
.benefits3{
  display:grid;
  grid-template-columns: repeat(3, 1fr);
  gap: clamp(16px, 2.2vw, 26px);
  margin-bottom: 22px;
}
.benefit{ background: transparent; padding: 2px 0; }
.benefit-icon{ font-size: 26px; line-height: 1; margin-bottom: 6px; }
.benefit h3{
  margin: 0 0 6px;
  font-size: clamp(18px, 2.1vw, 22px);
  color: #143247;
}
.benefit p{ margin: 0; color:#223e52; font-size: 15.5px; }


@media (max-width:1024px){
  .values-grid{ grid-template-columns: repeat(2, 1fr); }
  .faq2-grid{ grid-template-columns: 1fr; }
  .benefits3{ grid-template-columns: repeat(2,1fr);}
}
@media (max-width:640px){
  .benefits3{ grid-template-columns: 1fr; }
}


.brand-grid{
  display: grid;
  grid-template-columns: repeat(5, 1fr);
  gap: clamp(12px, 2vw, 20px);
  align-items: center;
  margin: 10px 0 16px;
}
.brand-grid .brand{
  margin: 0;
  background: rgba(255,255,255,0.85);
  border: 1px solid rgba(0,0,0,0.06);
  border-radius: 12px;
  display: grid;
  place-items: center;
  padding: clamp(10px, 2vw, 18px);
  box-shadow: 0 8px 22px rgba(0,0,0,0.06);
}
.brand-grid .brand img{
  width: 100%;
  height: 64px;
  object-fit: contain;
  display: block;
}
@media (max-width:1024px){
  .brand-grid{ grid-template-columns: repeat(3, 1fr); }
}
@media (max-width:640px){
  .brand-grid{ grid-template-columns: repeat(2, 1fr); }
  .brand-grid .brand img{ height: 56px; }
}


.steps6{
  display:grid;
  grid-template-columns: repeat(2, 1fr);
  gap: clamp(16px,2.2vw,26px);
  margin-bottom:22px;
}
.step-card{
  background: rgba(255,255,255,0.88);
  border:1px solid rgba(0,0,0,0.06);
  border-radius:12px;
  padding: clamp(12px,2vw,16px);
  box-shadow: 0 8px 22px rgba(0,0,0,0.06);
  display:grid;
  grid-template-columns:auto 1fr;
  grid-template-areas:
    "num title"
    "icon text";
  column-gap:12px;
  row-gap:6px;
}
.step-num{
  grid-area:num;
  width:32px; height:32px;
  display:grid; place-items:center;
  border-radius:999px;
  background: var(--accent);
  color:#fff; font-weight:800;
}
.step-icon{
  grid-area:icon;
  font-size:24px; line-height:1;
  align-self:start;
}
.step-card h3{
  grid-area:title;
  margin:0; color:#102a3c;
  font-size: clamp(17px,2vw,20px);
}
.step-card p{
  grid-area:text;
  margin:0; color:#223e52; font-size:15.5px;
}

@media (max-width:1024px){
  .steps6{ grid-template-columns: 1fr; }
}


.contact-grid{
  display:grid;
  grid-template-columns: 1.1fr .9fr;
  gap: clamp(16px,2.4vw,28px);
}
@media (max-width:1024px){
  .contact-grid{ grid-template-columns: 1fr 1fr; }
}
@media (max-width:640px){
  .contact-grid{ grid-template-columns: 1fr; }
}


.contact-card{
  background: rgba(255,255,255,0.68);   
  backdrop-filter: blur(6px);
  -webkit-backdrop-filter: blur(6px);   
  border:1px solid rgba(0,0,0,0.06);
  border-radius:14px;
  padding: clamp(14px,2.2vw,18px);
  box-shadow:0 10px 24px rgba(0,0,0,0.08);
}

.contact-sub{ margin:0 0 8px; color:#143247; font-weight:800; font-size: clamp(18px,2.1vw,22px); }

.contact-dl{ display:grid; grid-template-columns: max-content 1fr; gap:8px 14px; margin:8px 0 14px; }
.contact-dl dt{ color:#234; font-weight:700; }
.contact-dl dd{ margin:0; color:#223e52; }
.contact-dl a{ color:#0e8ec4; text-decoration:none; }
.contact-dl a:hover{ text-decoration:underline; }

.contact-ill{
  margin:0;
  display:grid; place-items:center;
  padding: clamp(8px,1.8vw,16px);
  background:#fff;
  border:1px solid rgba(0,0,0,.06);
  border-radius:14px;
  box-shadow:0 10px 24px rgba(0,0,0,.06);
}
.contact-ill img{ width:100%; height:auto; display:block; }


.wrap::before{
  content:"";
  position: absolute;
  inset: 0;
  z-index: 0;
  pointer-events: none;
  background:
    radial-gradient(rgba(16,32,48,0.06) 0.7px, transparent 0.7px) 0 0/6px 6px,
    linear-gradient(90deg, rgba(0,0,0,0) 0%, rgba(16,32,48,0.06) 55%, rgba(16,32,48,0.12) 100%);
  mix-blend-mode: multiply;
}

#kapcsolat-oldal.kontakt-wrap::before{ content: none; }



#fooldal .content {
  align-items: center;   
  text-align: center;    
}





@media (max-width:1024px){
  nav.primary{display:none}
  .ham-btn{display:flex}
  .nav-bar{height:var(--header-h)}

 
  .wrap{grid-template-columns:1fr}
  .content{order:1}
  .photo{order:2;padding:0}
  .photo figure{border-radius:0;overflow:visible;box-shadow:none;background:transparent;width:100%;height:auto}
  .photo img{width:100%;height:auto;object-fit:contain;object-position:center}

  .features{grid-template-columns:repeat(2,1fr)}
  .services{grid-template-columns:repeat(2,1fr)}

  .step{ flex-direction:column; align-items:flex-start; }
  .step img{ width:72px; height:72px; }
}
@media (max-width:640px){
  
  .features{grid-template-columns:1fr}
  .services{grid-template-columns:1fr}

  .step img{ width:56px; height:56px; }

  #karbantartas.wrap{ grid-template-columns:1fr; }
}
@media (max-width:520px){
  .site-header .brand img{width:32px;height:32px}
  .site-header .brand span{font-size:15px}
}


.cta-off .cta-title,
.cta-off .cta-desc,
.cta-off .cta{
  display: none !important;
}



.nav-link.active,
.nav-link[aria-current="page"]{
  color: #0e8ec4;                 
  border-bottom: 2px solid #0e8ec4;
}

.mobile-panel .nav-link.active,
.mobile-panel .nav-link[aria-current="page"]{
  background: rgba(0,0,0,0.06);  
  border-bottom-color: transparent;
}


details.more.has-active > summary {
  color: #0e8ec4;                     
  border-bottom: 2px solid #0e8ec4;   
}





#adatvedelem.privacy-hc{
  position: relative;
  
  background:
    linear-gradient(rgba(7,23,49,0.92), rgba(7,23,49,0.92)),
    url("adatvedelmi_nyilatkozat.jpg") center/cover no-repeat;
  color: #e8eef6;
  isolation: isolate;
}

.privacy-hc .page-title{ color:#ffffff; }

.privacy-hc__header{
  display:flex; align-items:flex-start; justify-content:space-between; gap:1rem;
  margin-bottom: .5rem;
}
.privacy-hc__logo{
  width:64px; height:auto; flex:0 0 auto; opacity:.95;
  filter: drop-shadow(0 2px 4px rgba(0,0,0,.35));
}

.privacy-hc__lead{
  margin:.25rem 0 1.1rem 0;
  font-size:clamp(1rem, .9vw + .9rem, 1.2rem);
  line-height:1.6;
  color:#e6f0ff;
  max-width: 75ch;
}


.privacy-hc__grid{
  display:grid;
  grid-template-columns: repeat(2, 1fr);
  gap: clamp(12px, 2.2vw, 20px);
  margin-top: .6rem;
}
@media (max-width:900px){
  .privacy-hc__grid{ grid-template-columns: 1fr; }
}


.privacy-hc__card{
  background: rgba(255,255,255,0.08);
  border: 1px solid rgba(255,255,255,0.16);
  border-radius: 10px;
  padding: clamp(12px, 1.8vw, 16px);
  box-shadow: 0 10px 24px rgba(0,0,0,.15);
}
.privacy-hc__card h3{
  margin:0 0 .35rem 0;
  font-weight:800; line-height:1.25;
  font-size:clamp(1.05rem, .8vw + .95rem, 1.3rem);
  color:#ffffff;
}
.privacy-hc__card p{
  margin:0; line-height:1.55;
  color:#e8eef6;
  font-size:clamp(.98rem, .6vw + .9rem, 1.12rem);
}


.privacy-hc__link{
  color:#bfe2ff;                 /* világosabb, kontrasztos */
  text-decoration: underline;
  font-weight:700;
}


@media (max-width: 600px){
  .privacy-hc__header{ flex-direction: column; align-items: center; text-align: center; }
  .privacy-hc__logo{ margin-top: .25rem; }
}







body,
button,
input,
select,
textarea,
header.site-header,
.nav-link,
.cta,
.tag {
  font-family: "Source Sans 3", system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
  font-weight: 400;
}




#fooldal h1 {
  font-size: clamp(36px, 5vw, 59px);
  line-height: 1.08;
  font-weight: 600; 
}

#fooldal .subtitle {
  font-size: clamp(22px, 2.6vw, 28px);
  font-weight: 400;
}

#fooldal .tags .tag {
  font-size: 1.4rem;
  font-weight: 500;
}

#fooldal .cta-title {
  font-size: 1.95rem;
  font-weight: 600;
}

#fooldal .cta-desc {
  font-size: 1.4rem;
  line-height: 1.55;
}

#fooldal .cta {
  font-size: 1.1rem;
  font-weight: 600;
}

#fooldal p,
#fooldal li {
  font-size: 1.4rem;
  line-height: 1.55;
}




#miert-mi .page-title {

  font-size: clamp(34px, 3.8vw, 48px);
  font-weight: 600;
}


#miert-mi .feature .icon {
 
  font-size: 48px;
  line-height: 1;
}

#miert-mi .feature h3 {

  font-size: clamp(25px, 2.8vw, 31px);
  font-weight: 600;
}

#miert-mi .feature p {
  
  font-size: 1.35rem;
  line-height: 1.6;
  color: #223e52;
}


#miert-mi .feature li {
  font-size: 1.35rem;
  line-height: 1.6;
}


#miert-mi .cta-title {
 
  font-size: 1.95rem;
  font-weight: 600;
}

#miert-mi .cta-desc {
  font-size: 1.4rem;
  line-height: 1.55;
}

#miert-mi .cta {
  font-size: 1.1rem;
  font-weight: 600;
}




#szolgaltatasaink .page-title {
  
  font-size: clamp(34px, 3.8vw, 48px);
  font-weight: 600;
}


#szolgaltatasaink .service-card h3 {
  
  font-size: clamp(24px, 2.6vw, 32px);
  font-weight: 600;
}


#szolgaltatasaink .service-card p {
 
  font-size: 1.35rem;
  line-height: 1.6;
  color: #223e52;
}


#szolgaltatasaink .service-card .service-list li {
  font-size: 1.25rem;
  line-height: 1.5;
}


#szolgaltatasaink .cta-title {
  font-size: 1.95rem;
  font-weight: 600;
}

#szolgaltatasaink .cta-desc {
  font-size: 1.4rem;
  line-height: 1.55;
}

#szolgaltatasaink .cta {
  font-size: 1.1rem;
  font-weight: 600;
}




#klimaszereles .page-title {
  
  font-size: clamp(34px, 3.8vw, 48px);
  font-weight: 600;
}

#klimaszereles .subtitle {
  
  font-size: 1.4rem;
  line-height: 1.55;
}


#klimaszereles .process .step h3 {
  
  font-size: clamp(22px, 2.4vw, 30px);
  font-weight: 600;
}

#klimaszereles .process .step p {
 
  font-size: 1.35rem;
  line-height: 1.6;
  color: #223e52;
}


#klimaszereles .process .step .step-body {
  font-size: 1.35rem;
  line-height: 1.6;
}


#klimaszereles .cta-title {
  font-size: 1.95rem;
  font-weight: 600;
}

#klimaszereles .cta-desc {
  font-size: 1.4rem;
  line-height: 1.55;
}

#klimaszereles .cta {
  font-size: 1.1rem;
  font-weight: 600;
}




#karbantartas .page-title {
  
  font-size: clamp(34px, 3.8vw, 48px);
  font-weight: 600;
}

#karbantartas .subtitle {
  font-size: 1.4rem;
  line-height: 1.55;
}


#karbantartas .subhead-warm {
  font-size: 1.55rem;
  font-weight: 600;
}


#karbantartas .plain-list li {
  font-size: 1.35rem;
  line-height: 1.55;
}


#karbantartas .note {
  font-size: 1.25rem;
  line-height: 1.55;
}


#karbantartas .cta-title {
  font-size: 1.95rem;
  font-weight: 600;
}

#karbantartas .cta-desc {
  font-size: 1.4rem;
  line-height: 1.55;
}

#karbantartas .cta {
  font-size: 1.1rem;
  font-weight: 600;
}




#klimajavitas .page-title {
  
  font-size: clamp(34px, 3.8vw, 48px);
  font-weight: 600;
}

#klimajavitas .subtitle {
  font-size: 1.4rem;
  line-height: 1.5;
}


#klimajavitas .repair-card h3 {
  font-size: clamp(22px, 2.4vw, 30px);
  font-weight: 600;
}

#klimajavitas .repair-card p {
  font-size: 1.35rem;
  line-height: 1.6;
  color: #223e52;
}


#klimajavitas .note {
  font-size: 1.25rem;
  line-height: 1.55;
}


#klimajavitas .cta-title {
  font-size: 1.95rem;
  font-weight: 600;
}

#klimajavitas .cta-desc {
  font-size: 1.4rem;
  line-height: 1.55;
}

#klimajavitas .cta {
  font-size: 1.1rem;
  font-weight: 600;
}




#futes-klimaval .page-title {

  font-size: clamp(34px, 3.8vw, 48px);
  font-weight: 600;
}

#futes-klimaval .subtitle {
  font-size: 1.4rem;
  line-height: 1.55;
}


#futes-klimaval .subhead-warm {
  font-size: 1.55rem;
  font-weight: 600;
}


#futes-klimaval .plain-list li {
  font-size: 1.35rem;
  line-height: 1.55;
}


#futes-klimaval .cta-title {
  font-size: 1.95rem;
  font-weight: 600;
}

#futes-klimaval .cta-desc {
  font-size: 1.4rem;
  line-height: 1.55;
}

#futes-klimaval .cta {
  font-size: 1.1rem;
  font-weight: 600;
}


#futes-klimaval .bottom-illustration figcaption,
#futes-klimaval .bottom-illustration p {
  font-size: 1.1rem;
}




#ertekeink .page-title {
  font-size: clamp(34px, 3.8vw, 48px);
  font-weight: 600;
}


#ertekeink .values-grid .value-card .value-icon {
  width: 88px;         
  height: auto;
  display: block;
  margin-bottom: 0.75rem;
}


#ertekeink .values-grid .value-card h3 {
  font-size: clamp(22px, 2.4vw, 30px);
  font-weight: 600;
}


#ertekeink .values-grid .value-card p {
  font-size: 1.35rem;
  line-height: 1.6;
  color: #223e52;
}


#ertekeink .cta-title {
  font-size: 1.95rem;
  font-weight: 600;
}

#ertekeink .cta-desc {
  font-size: 1.4rem;
  line-height: 1.55;
}

#ertekeink .cta {
  font-size: 1.1rem;
  font-weight: 600;
}



#referenciak .page-title {
  font-size: clamp(34px, 3.8vw, 48px);
  font-weight: 600;
}

#referenciak .subtitle {
  font-size: 1.4rem;
  line-height: 1.55;
  max-width: 62rem; 
}


#referenciak .refs-grid figure figcaption {
  font-size: 1.1rem;
  line-height: 1.4;
}


#referenciak .refs-grid .refs-item img {
  display: block;
  width: 100%;
  border-radius: 0.9rem;
}


#referenciak .cta-title {
  font-size: 1.95rem;
  font-weight: 600;
}

#referenciak .cta-desc {
  font-size: 1.4rem;
  line-height: 1.55;
}

#referenciak .cta {
  font-size: 1.1rem;
  font-weight: 600;
}




#gyik .page-title {
  font-size: clamp(34px, 3.8vw, 48px);
  font-weight: 600;
}

#gyik .subtitle {
  font-size: 1.35rem;
  line-height: 1.55;
  max-width: 60rem;
}


#gyik .faq-card {

  line-height: 1.55;
}


#gyik .faq-card .faq-head {
  font-size: 1.35rem;
  font-weight: 600;
}


#gyik .faq-card .faq-title {
  font-size: clamp(22px, 2.4vw, 30px);
  font-weight: 600;
  margin-bottom: 0.4rem;
}


#gyik .faq-card p {
  font-size: 1.25rem;
  line-height: 1.6;
}


#gyik .faq-card .faq-highlight {
  font-size: 1.3rem;
  font-weight: 600;
}


#gyik .cta-title {
  font-size: 1.95rem;
  font-weight: 600;
}

#gyik .cta-desc {
  font-size: 1.4rem;
  line-height: 1.55;
}

#gyik .cta {
  font-size: 1.1rem;
  font-weight: 600;
}





#gyik2 .page-title {
  font-size: clamp(34px, 3.8vw, 48px);
  font-weight: 600;
}

#gyik2 .faq2-item {
  line-height: 1.55;
}


#gyik2 .faq2-title {
  font-size: clamp(22px, 2.4vw, 30px);
  font-weight: 600;
  margin-bottom: 0.35rem;
}


#gyik2 .faq2-item p {
  font-size: 1.25rem;
  line-height: 1.6;
  color: #223e52;
}


#gyik2 .cta-title {
  font-size: 1.95rem;
  font-weight: 600;
}

#gyik2 .cta-desc {
  font-size: 1.4rem;
  line-height: 1.55;
}

#gyik2 .cta {
  font-size: 1.1rem;
  font-weight: 600;
}





#miert-futeni-klimaval .page-title {
  font-size: clamp(34px, 3.8vw, 48px);
  font-weight: 600;
}


#miert-futeni-klimaval .lead-orange {
  font-size: 1.45rem;
  line-height: 1.5;
  font-weight: 500;
}


#miert-futeni-klimaval .benefits3 .benefit-icon {
  font-size: 2.4rem;   
  line-height: 1;
  margin-bottom: 0.4rem;
}

#miert-futeni-klimaval .benefits3 .benefit h3 {
  font-size: clamp(22px, 2.4vw, 30px);
  font-weight: 600;
}

#miert-futeni-klimaval .benefits3 .benefit p {
  font-size: 1.35rem;
  line-height: 1.6;
  color: #223e52;
}


#miert-futeni-klimaval .cta-title {
  font-size: 1.95rem;
  font-weight: 600;
}

#miert-futeni-klimaval .cta-desc {
  font-size: 1.4rem;
  line-height: 1.55;
}

#miert-futeni-klimaval .cta {
  font-size: 1.1rem;
  font-weight: 600;
}




#markak .page-title {
  font-size: clamp(34px, 3.8vw, 48px);
  font-weight: 600;
}

#markak .subtitle {
  font-size: 1.35rem;
  line-height: 1.55;
  max-width: 60rem;
}


#markak .brands-intro {
  font-size: 1.3rem;
  line-height: 1.6;
}


#markak .note {
  font-size: 1.25rem;
  line-height: 1.55;
}


#markak .cta-title {
  font-size: 1.95rem;
  font-weight: 600;
}

#markak .cta-desc {
  font-size: 1.4rem;
  line-height: 1.55;
}

#markak .cta {
  font-size: 1.1rem;
  font-weight: 600;
}




#folyamat .page-title {
  font-size: clamp(34px, 3.8vw, 48px);
  font-weight: 600;
}

#folyamat .steps6 .step-card {
  line-height: 1.55;
}


#folyamat .steps6 .step-card .step-num {
  font-size: 1.35rem;
  font-weight: 600;
}


#folyamat .steps6 .step-card .step-icon {
  font-size: 2.6rem;   
  line-height: 1;
  margin-bottom: 0.4rem;
}


#folyamat .steps6 .step-card h3 {
  font-size: clamp(22px, 2.4vw, 30px);
  font-weight: 600;
  margin-bottom: 0.35rem;
}


#folyamat .steps6 .step-card p {
  font-size: 1.25rem;
  line-height: 1.6;
  color: #223e52;
}


#folyamat .cta-title {
  font-size: 1.95rem;
  font-weight: 600;
}

#folyamat .cta-desc {
  font-size: 1.4rem;
  line-height: 1.55;
}

#folyamat .cta {
  font-size: 1.1rem;
  font-weight: 600;
}




#miert-valasszon .page-title {
  font-size: clamp(34px, 3.8vw, 48px);
  font-weight: 600;
}


#miert-valasszon .stats4 .stat-card {
  line-height: 1.55;
}


#miert-valasszon .stats4 .stat-card .stat-value {
  font-size: clamp(40px, 4.5vw, 60px);   
  font-weight: 700;
  line-height: 1.05;
}


#miert-valasszon .stats4 .stat-card .stat-title {
  font-size: clamp(22px, 2.4vw, 30px);
  font-weight: 600;
  margin-top: 0.25rem;
}


#miert-valasszon .stats4 .stat-card p {
  font-size: 1.25rem;
  line-height: 1.55;
  color: #223e52;
}


#miert-valasszon .cta-title {
  font-size: 1.95rem;
  font-weight: 600;
}

#miert-valasszon .cta-desc {
  font-size: 1.4rem;
  line-height: 1.55;
}

#miert-valasszon .cta {
  font-size: 1.1rem;
  font-weight: 600;
}


#kapcsolat-oldal .contact-dl {
  display: grid;
  grid-template-columns: minmax(12rem, 14rem) minmax(0, 1fr);
  column-gap: 1.2rem;
  row-gap: 0.5rem;
  margin-bottom: 1.5rem;
}

#kapcsolat-oldal .contact-dl dt {
  font-weight: 600;
  font-size: 1.15rem;
  line-height: 1.4;
  white-space: normal;          
}

#kapcsolat-oldal .contact-dl dd {
  font-size: 1.15rem;
  line-height: 1.5;
  word-break: break-word;     
}


@media (max-width: 900px) {
  #kapcsolat-oldal .contact-dl {
   
    grid-template-columns: minmax(10.5rem, 42%) minmax(0, 58%);
  }
}


@media (max-width: 520px) {
  #kapcsolat-oldal .contact-dl {
   
    grid-template-columns: minmax(9.5rem, 48%) minmax(0, 52%);
  }

  #kapcsolat-oldal .contact-dl dt,
  #kapcsolat-oldal .contact-dl dd {
    font-size: 1.05rem;   
  }
}

#kapcsolat-oldal .page-title {
  font-size: clamp(34px, 3.8vw, 48px);
  font-weight: 600;
}

#kapcsolat-oldal .contact-sub {
  font-size: 1.5rem;
  font-weight: 600;
  margin-bottom: 1rem;
}

#kapcsolat-oldal .cta-title {
  font-size: 1.95rem;
  font-weight: 600;
}

#kapcsolat-oldal .cta-desc {
  font-size: 1.35rem;
  line-height: 1.55;
}

#kapcsolat-oldal .cta {
  font-size: 1.1rem;
  font-weight: 600;
}





#adatvedelem .page-title {
  font-size: clamp(34px, 3.8vw, 48px);
  font-weight: 600;
  margin-bottom: 1rem;
}


#adatvedelem .privacy-hc__lead {
  font-size: 1.35rem;
  line-height: 1.6;
  max-width: 62rem;
}


#adatvedelem .privacy-hc__grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 1.4rem;
  margin-top: 1.6rem;
}

#adatvedelem .privacy-hc__card h3 {
  font-size: 1.45rem;
  font-weight: 600;
  margin-bottom: 0.4rem;
}

#adatvedelem .privacy-hc__card p {
  font-size: 1.2rem;
  line-height: 1.55;
  color: #223e52;
}

#adatvedelem .privacy-hc__link {
  font-size: 1.1rem;
  font-weight: 500;
}


#adatvedelem .privacy-hc__header {
  display: flex;
  align-items: center;
  gap: 1.2rem;
  flex-wrap: wrap;
}

#adatvedelem .privacy-hc__logo {
  height: 52px;
  width: auto;
}



@media (max-width: 1000px) {
  #adatvedelem .privacy-hc__grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 560px) {
  #adatvedelem .privacy-hc__grid {
    grid-template-columns: 1fr;
  }
  #adatvedelem .privacy-hc__card p {
    font-size: 1.15rem;
  }
}



#adatvedelem .privacy-hc__card p {
  color: inherit;   
}


#klimaszereles.wrap{
  grid-template-columns: 60% 40%;
  grid-template-areas: "content photo";
}
#klimaszereles .content{ grid-area: content; }
#klimaszereles .photo{ grid-area: photo; }


@media (max-width:1024px){
  #klimaszereles.wrap{
    grid-template-columns: 1fr;
    grid-template-areas:
      "content"
      "photo";
  }
}


#ertekeink .values-grid .value-card .value-icon {
  width: 64px;
  height: auto;
  display: block;
  margin-bottom: 0.75rem;
}


#ertekeink .values-grid {
  display: grid;
  gap: 16px;
  grid-template-columns: repeat(5, minmax(0, 1fr));   
}

@media (max-width: 1440px) {                          
  #ertekeink .values-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
}

@media (max-width: 1024px) {                          
  #ertekeink .values-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 640px) {                           
  #ertekeink .values-grid {
    grid-template-columns: 1fr !important;            
  }
}



#ertekeink .values-grid .value-card .value-icon {
  width: 45px;   
  height: auto;
  margin-bottom: 0.6rem;
}