@import url('https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;500;600;700&family=Manrope:wght@600;700;800&display=swap');
:root{--accent:#0b7182;--accent2:#19adbb;--green:#69b33d;--ink:#12343b;--muted:#64777b;--soft:#f4f8f6;--line:#dce8e5;--white:#fff;--hero:#e8f3ef;--biz:#0e4854}
html[data-mode="business"]{--accent:#0e5360;--accent2:#237887;--green:#82b647;--hero:#e8eff0;--biz:#082f38}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;font-family:'DM Sans',Arial,sans-serif;color:var(--ink);background:#fff}a{color:inherit;text-decoration:none}button,input,select,textarea{font:inherit}
.site-header{height:86px;display:flex;align-items:center;gap:30px;padding:0 5vw;position:sticky;top:0;z-index:30;background:rgba(255,255,255,.94);backdrop-filter:blur(12px);border-bottom:1px solid var(--line)}.brand{display:flex;align-items:center;gap:12px;margin-right:auto}.brand img{width:62px;height:62px;object-fit:contain}.brand b{display:block;font:700 19px Manrope;letter-spacing:.04em}.brand small{display:block;color:var(--muted);margin-top:2px}.site-header nav{display:flex;gap:25px;font-size:13px;font-weight:600}.site-header nav a:hover,.header-phone{color:var(--accent)}.header-phone{font-weight:700}.mobile-menu{display:none;border:0;background:none;font-size:25px}
.hero{min-height:680px;display:grid;grid-template-columns:1.05fr .95fr;background:linear-gradient(115deg,var(--soft) 0 57%,var(--hero) 57%);overflow:hidden}.hero-content{padding:58px 5vw 75px 7vw;display:flex;flex-direction:column;justify-content:center}.mode-switch{display:inline-flex;align-self:flex-start;background:#fff;padding:5px;border:1px solid var(--line);box-shadow:0 8px 25px #12343b12;margin-bottom:50px}.mode{border:0;background:transparent;padding:12px 17px;font-weight:700;color:var(--muted);cursor:pointer}.mode.active{background:var(--accent);color:#fff}.kicker{font:700 12px Manrope;letter-spacing:.18em;color:var(--accent);margin:0 0 14px}.hero h1,.section h2,.split-feature h2{font-family:Manrope,sans-serif;line-height:1.08;margin:0}.hero h1{font-size:clamp(48px,5.6vw,82px);max-width:760px;letter-spacing:-.035em}.hero-lead{font-size:18px;line-height:1.75;color:var(--muted);max-width:690px;margin:27px 0}.hero-actions{display:flex;gap:10px;flex-wrap:wrap}.button{display:inline-block;border:1px solid var(--accent);padding:15px 23px;font-weight:700;cursor:pointer}.primary{background:var(--accent);color:#fff}.ghost{background:#fff;color:var(--accent)}.proof{display:flex;gap:28px;margin-top:38px;flex-wrap:wrap}.proof span{font-size:12px;color:var(--muted);border-left:2px solid var(--green);padding-left:10px}.proof b{display:block;color:var(--ink);font-size:18px}
.hero-scene{position:relative;min-height:600px}.scene-photo{position:absolute;inset:8% 5% 8% 0;box-shadow:0 25px 60px #12343b24;overflow:hidden}.room{position:absolute;inset:0;transition:opacity .35s ease}.room-home{background:linear-gradient(#eaf2ef 0 67%,#caa985 67%)}.window{position:absolute;width:38%;height:45%;right:9%;top:8%;background:linear-gradient(135deg,#d5eef1,#f8ffff);border:12px solid #fff;box-shadow:0 8px 20px #1232}.sofa{position:absolute;width:55%;height:24%;left:10%;bottom:10%;background:#d8c9b8;border-radius:10px 10px 3px 3px}.sofa:before{content:"";position:absolute;width:35%;height:48%;left:8%;top:-30%;background:#e5dbcf;border-radius:8px}.plant{position:absolute;width:8%;height:26%;right:10%;bottom:10%;background:linear-gradient(90deg,transparent 42%,#755d45 43% 55%,transparent 56%)}.plant:before{content:"✦";position:absolute;font-size:75px;color:#6b9b55;left:-22px;top:-50px}.paint-swipe{position:absolute;width:42%;height:12%;left:8%;top:15%;background:var(--accent);opacity:.88;transform:skew(-12deg)}
.room-business{opacity:0;background:linear-gradient(#e8eeee 0 68%,#b8c1c3 68%)}html[data-mode="business"] .room-home{opacity:0}html[data-mode="business"] .room-business{opacity:1}.office-window{position:absolute;left:7%;right:7%;top:7%;height:45%;background:repeating-linear-gradient(90deg,#d8edf0 0 24%,#eef8f9 24% 25%);border:10px solid #fff}.desk{position:absolute;width:32%;height:8%;bottom:24%;background:#53666a}.desk:after{content:"";position:absolute;width:4px;height:95px;background:#53666a;left:12%;top:100%;box-shadow:130px 0 #53666a}.d1{left:10%}.d2{right:10%}.office-line{position:absolute;left:0;top:15%;width:40%;height:12%;background:var(--accent);opacity:.9}
.floating-card{position:absolute;left:-5%;bottom:5%;background:#fff;padding:18px 22px;display:flex;align-items:center;gap:15px;box-shadow:0 18px 45px #12343b2b;border-bottom:4px solid var(--green);max-width:360px}.floating-card img{width:70px;height:70px;object-fit:contain}.floating-card small{display:block;color:var(--accent);font-weight:700;letter-spacing:.1em}.floating-card b{display:block;margin-top:4px}
.quick-strip{display:grid;grid-template-columns:repeat(3,1fr);max-width:1180px;margin:-35px auto 0;position:relative;z-index:5;background:#fff;box-shadow:0 15px 45px #12343b17}.quick-strip div{padding:27px 30px;border-right:1px solid var(--line);display:grid;grid-template-columns:auto 1fr;column-gap:14px}.quick-strip span{grid-row:1/3;font:700 26px Oswald;color:#c4d5d1}.quick-strip b{font-size:14px}.quick-strip small{color:var(--muted);margin-top:4px}
.section{padding:100px 7vw}.section-heading{max-width:800px;margin-bottom:45px}.section h2{font-size:clamp(38px,4.5vw,62px)}.service-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:15px}.service-grid article{position:relative;padding:30px;min-height:235px;background:var(--soft);border:1px solid transparent;transition:.25s}.service-grid article:hover{transform:translateY(-5px);border-color:var(--green);box-shadow:0 16px 35px #12343b12}.service-grid i{font:600 32px Oswald;color:#c3d5d1;font-style:normal}.service-grid h3{font-size:19px}.service-grid p{color:var(--muted);line-height:1.65}.service-grid article>span{position:absolute;bottom:24px;color:var(--green);font-weight:700}.business-content{display:none}html[data-mode="business"] .residential-content{display:none}html[data-mode="business"] .business-content{display:grid}
.split-feature{display:grid;grid-template-columns:.8fr 1.2fr;background:var(--biz);color:#fff;min-height:520px}.feature-visual{display:grid;place-content:center;text-align:center;background:linear-gradient(145deg,var(--accent2),var(--accent));position:relative;overflow:hidden}.feature-visual:after{content:"";position:absolute;width:380px;height:380px;border:80px solid #ffffff13;border-radius:50%;right:-150px;bottom:-150px}.big-kl{font:700 clamp(60px,8vw,120px) Oswald;letter-spacing:-.04em}.big-kl span{color:var(--green)}.feature-visual p{letter-spacing:.4em;margin:0}.feature-copy{padding:85px 8vw}.feature-copy .kicker{color:#a9dbe0}.feature-copy h2{font-size:clamp(38px,4.2vw,60px)}.feature-copy h2 em{font-family:Georgia,serif;text-transform:none;color:#99d56d;font-weight:400}.feature-copy>p:not(.kicker){color:#d4e3e5;line-height:1.8;max-width:720px}.ticks{display:grid;grid-template-columns:1fr 1fr;gap:14px;margin-top:30px}.ticks span{border-top:1px solid #ffffff28;padding-top:14px}
.about{display:grid;grid-template-columns:.8fr 1.2fr;gap:8vw;align-items:center;background:var(--soft)}.about-photo{position:relative;max-width:430px}.person-placeholder{aspect-ratio:4/5;background:linear-gradient(145deg,#d8eae6,#fff);display:grid;place-content:center;text-align:center;border-bottom:6px solid var(--green)}.person-placeholder b{font:700 90px Oswald;color:var(--accent)}.person-placeholder span{font-size:12px;color:var(--muted)}.experience{position:absolute;right:-35px;bottom:25px;background:var(--accent);color:#fff;padding:20px 25px;box-shadow:0 15px 35px #1233}.experience b{font:700 45px Oswald;display:block}.experience span{font-size:10px;letter-spacing:.12em}.about-copy p:not(.kicker){color:var(--muted);font-size:17px;line-height:1.8;max-width:700px}
.calculator{background:#102f36;color:#fff;display:grid;grid-template-columns:.65fr 1.35fr;gap:6vw}.calculator .kicker{color:#98d56b}.calc-intro p:last-child{color:#bfd0d3;line-height:1.7}.calc-panel{display:grid;grid-template-columns:1.25fr .75fr;background:#fff;color:var(--ink);padding:25px;gap:20px}.calc-panel form{display:grid;grid-template-columns:1fr 1fr;gap:14px}.calc-panel label{font-size:12px;font-weight:700}.calc-panel input,.calc-panel select,.quote-form input,.quote-form select,.quote-form textarea{width:100%;padding:12px;margin-top:6px;border:1px solid #cbdad7;background:#fff}.calc-result{background:var(--soft);padding:25px;display:flex;flex-direction:column;justify-content:center}.calc-result small{font-size:10px;letter-spacing:.12em;color:var(--muted);margin-top:12px}.calc-result b,.calc-result strong{font:700 31px Oswald;color:var(--accent)}.calc-result p{font-size:11px;color:var(--muted);line-height:1.55;margin-top:22px}
.quote{display:grid;grid-template-columns:.8fr 1.2fr;gap:8vw;background:#e7f2ed}.quote-copy p:not(.kicker){color:var(--muted);line-height:1.7}.quote-copy>a{display:block;margin-top:9px}.big-phone{font:700 30px Oswald;color:var(--accent)}.quote-form{background:#fff;padding:30px;box-shadow:0 15px 40px #12343b12}.quote-form>div{display:grid;grid-template-columns:1fr 1fr;gap:15px}.quote-form label{display:block;font-size:12px;font-weight:700;margin-bottom:15px}.quote-form textarea{resize:vertical}.quote-form>small{display:block;color:var(--green);margin-top:12px}
footer{background:#082c34;color:#fff;padding:32px 7vw;display:flex;align-items:center;gap:30px}footer div b{display:block;font:700 19px Oswald}footer div span,footer p,footer>small{color:#adc2c6;font-size:12px}footer p{margin-left:auto}
@media(max-width:1000px){.site-header nav,.header-phone{display:none}.mobile-menu{display:block}.site-header.open nav{display:flex;position:absolute;top:85px;left:0;right:0;background:#fff;flex-direction:column;padding:25px;border-bottom:1px solid var(--line)}.hero{grid-template-columns:1fr}.hero-scene{min-height:430px;background:var(--hero)}.scene-photo{inset:5%}.floating-card{left:7%}.quick-strip{margin:0}.service-grid{grid-template-columns:1fr 1fr}.split-feature,.about,.calculator,.quote{grid-template-columns:1fr}.feature-visual{min-height:330px}.about-photo{margin:auto}.calc-panel{max-width:900px}}
@media(max-width:620px){.site-header{height:72px;padding:0 18px}.brand img{width:49px;height:49px}.brand small{display:none}.hero-content,.section{padding:60px 22px}.mode-switch{width:100%;margin-bottom:38px}.mode{flex:1;padding:11px 7px;font-size:12px}.hero h1{font-size:47px}.hero-scene{min-height:330px}.floating-card{left:5%;right:5%;bottom:3%;max-width:none}.quick-strip{grid-template-columns:1fr}.quick-strip div{border-right:0;border-bottom:1px solid var(--line)}.service-grid{grid-template-columns:1fr}.split-feature .feature-copy{padding:65px 22px}.ticks{grid-template-columns:1fr}.experience{right:-5px}.calc-panel,.calc-panel form,.quote-form>div{grid-template-columns:1fr}.calc-panel{padding:16px}.quote-form{padding:22px}footer{padding:30px 22px;flex-direction:column;align-items:flex-start}footer p{margin:0}}

/* V6 hero refinement */
.hero-clean{
  min-height:600px;
  display:flex;
  align-items:center;
  justify-content:center;
  padding:7vw 6vw 7vw 2vw;
  position:relative;
}
.hero-clean:before{
  content:"";
  position:absolute;
  width:72%;
  aspect-ratio:1;
  border-radius:50%;
  background:radial-gradient(circle, rgba(11,113,130,.11), rgba(11,113,130,0) 68%);
}
.hero-brand-panel{
  position:relative;
  z-index:1;
  width:min(430px,85%);
  background:rgba(255,255,255,.88);
  backdrop-filter:blur(8px);
  border:1px solid rgba(18,52,59,.08);
  box-shadow:0 28px 70px rgba(18,52,59,.12);
  padding:50px;
}
.hero-brand-panel img{display:block;width:min(260px,85%);height:auto;margin:0 auto 28px}
.hero-brand-panel p{margin:0;text-align:center;color:var(--muted);font-size:16px;line-height:1.65}
.hero h1{text-transform:none;font-weight:800}
.section h2,.split-feature h2{text-transform:none;font-weight:800}
@media(max-width:900px){
 .hero-clean{min-height:390px;padding:35px 7vw 55px}
 .hero-brand-panel{padding:34px}
}

/* V7: strict residential/business content separation */
.business-content{display:none !important;}
html[data-mode="business"] .residential-content{display:none !important;}
html[data-mode="business"] .business-content{display:grid !important;}
html[data-mode="business"] p.business-content{display:block !important;}
html[data-mode="residential"] .business-content{display:none !important;}
html[data-mode="residential"] .residential-content.calc-panel{display:grid !important;}
html[data-mode="residential"] p.residential-content{display:block !important;}
html[data-mode="residential"] .residential-content.service-grid{display:grid !important;}

/* V8 hero room photo behind logo */
.hero-visual, .hero-media, .hero-right {
  position: relative;
}
.hero-visual::before, .hero-media::before, .hero-right::before {
  content:"";
  position:absolute;
  inset:0;
  background:
    linear-gradient(90deg, rgba(255,255,255,.06), rgba(255,255,255,.18)),
    url("assets/szoba-hatter.jpg") center/cover no-repeat;
  z-index:0;
}
.hero-visual > *, .hero-media > *, .hero-right > * {
  position:relative;
  z-index:1;
}
.hero-visual img, .hero-media img, .hero-right img {
  filter: drop-shadow(0 12px 22px rgba(0,0,0,.16));
}

/* V9 corrected: room photo is on the actual right-side hero/logo panel */
.room-photo-card{
 position:relative!important;
 overflow:hidden!important;
 background-image:linear-gradient(rgba(255,255,255,.18),rgba(255,255,255,.18)),url("assets/szoba-hatter.jpg")!important;
 background-size:cover!important;
 background-position:center!important;
 background-repeat:no-repeat!important;
}
.room-photo-card::before{content:none!important;}
.room-photo-card>*{position:relative;z-index:2;}

/* V10 – refined hero image composition */
.v10-photo-scene{
  position:relative;
  min-height:600px;
  display:flex;
  align-items:center;
  justify-content:flex-start;
  padding:54px 6vw 54px 0;
  background:transparent!important;
}
.v10-photo-scene::before{content:none!important}
.v10-photo-frame{
  position:relative;
  width:min(560px,94%);
  height:570px;
  overflow:hidden;
  border-radius:0 0 0 72px;
  box-shadow:0 26px 70px rgba(18,52,59,.18);
}
.v10-room-photo{
  position:absolute!important;
  inset:0;
  width:100%!important;
  height:100%!important;
  object-fit:cover!important;
  object-position:50% 46%!important;
  padding:0!important;
  background:none!important;
  box-shadow:none!important;
  filter:none!important;
}
.v10-photo-shade{
  position:absolute!important;
  inset:0;
  background:linear-gradient(90deg,rgba(8,54,61,.08),rgba(8,54,61,0) 45%,rgba(8,54,61,.08));
  z-index:1!important;
}
.v10-logo-float{
  position:absolute!important;
  z-index:2!important;
  left:34px;
  bottom:34px;
  width:190px;
  height:190px;
  border-radius:50%;
  background:rgba(255,255,255,.94);
  display:grid;
  place-items:center;
  padding:20px;
  box-shadow:0 18px 45px rgba(18,52,59,.22);
  border:1px solid rgba(255,255,255,.9);
  backdrop-filter:blur(5px);
}
.v10-logo-float img{
  width:100%!important;
  height:100%!important;
  object-fit:contain!important;
  padding:0!important;
  background:none!important;
  box-shadow:none!important;
  filter:none!important;
}
@media(max-width:900px){
 .v10-photo-scene{min-height:430px;padding:20px 7vw 55px}
 .v10-photo-frame{width:100%;height:420px;border-radius:0 0 0 42px}
 .v10-logo-float{width:145px;height:145px;left:22px;bottom:22px;padding:15px}
}

/* V11 – room photo integrated into the darker hero side with diagonal separation */
.hero{
  position:relative;
  overflow:hidden;
}
.v10-photo-scene{
  position:absolute!important;
  inset:0 0 0 48%!important;
  width:auto!important;
  min-height:0!important;
  padding:0!important;
  display:block!important;
  z-index:0!important;
  background:transparent!important;
}
.v10-photo-frame{
  position:absolute!important;
  inset:0!important;
  width:100%!important;
  height:100%!important;
  border-radius:0!important;
  box-shadow:none!important;
  clip-path:polygon(16% 0,100% 0,100% 100%,0 100%)!important;
}
.v10-room-photo{
  object-position:center 48%!important;
}
.v10-photo-shade{
  background:linear-gradient(90deg,rgba(13,63,70,.22) 0%,rgba(13,63,70,.05) 34%,rgba(13,63,70,.03) 100%)!important;
}
.v10-logo-float{
  left:24%!important;
  bottom:11%!important;
  width:170px!important;
  height:170px!important;
}
.hero > *:not(.v10-photo-scene){
  position:relative;
  z-index:2;
}
@media(max-width:900px){
 .v10-photo-scene{
   position:relative!important;
   inset:auto!important;
   width:100%!important;
   height:430px!important;
 }
 .v10-photo-frame{
   clip-path:polygon(0 10%,100% 0,100% 100%,0 100%)!important;
 }
 .v10-logo-float{left:7%!important;bottom:7%!important;width:140px!important;height:140px!important}
}

/* V12 – clean room image, no logo overlay, fitted to diagonal panel */
.v10-logo-float{display:none!important}
.v10-photo-frame{
  clip-path:polygon(15% 0,100% 0,100% 100%,0 100%)!important;
  background:#dfe9e7!important;
}
.v10-room-photo{
  width:100%!important;
  height:100%!important;
  object-fit:cover!important;
  object-position:62% 48%!important;
  transform:none!important;
  filter:none!important;
}
.v10-photo-shade{
  background:linear-gradient(90deg,rgba(10,65,72,.14),rgba(10,65,72,0) 28%)!important;
}

/* V14 – approved clean room photo integrated into the diagonal hero panel */
.v10-logo-float{display:none!important}
.v10-photo-scene{
  position:absolute!important;
  inset:0 0 0 48%!important;
  width:auto!important;
  min-height:0!important;
  height:auto!important;
  padding:0!important;
  display:block!important;
  z-index:0!important;
  background:#dce8e5!important;
}
.v10-photo-frame{
  position:absolute!important;
  inset:0!important;
  width:100%!important;
  height:100%!important;
  overflow:hidden!important;
  border-radius:0!important;
  box-shadow:none!important;
  clip-path:polygon(15% 0,100% 0,100% 100%,0 100%)!important;
  background:#dce8e5!important;
}
.v10-room-photo{
  position:absolute!important;
  inset:0!important;
  width:100%!important;
  height:100%!important;
  object-fit:cover!important;
  object-position:54% 50%!important;
  transform:none!important;
  padding:0!important;
  margin:0!important;
  background:none!important;
  box-shadow:none!important;
  filter:none!important;
}
.v10-photo-shade{
  position:absolute!important;
  inset:0!important;
  z-index:1!important;
  background:linear-gradient(90deg,rgba(10,61,67,.10) 0%,rgba(10,61,67,0) 30%)!important;
  pointer-events:none!important;
}
.hero > *:not(.v10-photo-scene){
  position:relative;
  z-index:2;
}
@media(max-width:900px){
  .v10-photo-scene{
    position:relative!important;
    inset:auto!important;
    width:100%!important;
    height:430px!important;
  }
  .v10-photo-frame{
    clip-path:polygon(0 10%,100% 0,100% 100%,0 100%)!important;
  }
  .v10-room-photo{object-position:center!important}
}


/* V15 – valódi portré, logó és jogi blokkok */
.feature-logo-card{
  display:flex; align-items:center; justify-content:center;
  padding:clamp(28px,5vw,70px); background:linear-gradient(145deg,#f7fbfa,#eaf4f2);
  overflow:hidden;
}
.feature-logo-card img{
  display:block; width:min(72%,430px); height:auto;
  filter:drop-shadow(0 18px 30px rgba(11,72,80,.12));
}
.about-photo-real{
  position:relative; overflow:hidden; background:linear-gradient(145deg,#eef7f5,#dfeeed);
  min-height:560px;
}
.about-portrait{
  width:100%; height:100%; min-height:560px; display:block; object-fit:cover;
  object-position:center top;
}
.about-photo-real .experience{
  position:absolute; left:24px; bottom:24px; z-index:2;
  box-shadow:0 16px 38px rgba(9,57,64,.18);
}
.legal-section{background:#f5f9f8}
.legal-head{max-width:760px;margin-bottom:28px}
.legal-card{
  max-width:1050px;margin:12px auto;background:#fff;border:1px solid rgba(8,82,92,.14);
  box-shadow:0 10px 28px rgba(8,55,62,.06);
}
.legal-card summary{
  cursor:pointer;list-style:none;padding:20px 24px;font-weight:800;color:#0b5965;
  display:flex;align-items:center;justify-content:space-between;
}
.legal-card summary::-webkit-details-marker{display:none}
.legal-card summary:after{content:"+";font-size:24px;font-weight:400}
.legal-card[open] summary:after{content:"–"}
.legal-content{padding:0 24px 24px;color:#536a6e;line-height:1.7}
.legal-content p{margin:10px 0}
.legal-content a,.footer-legal a{color:#087485}
.footer-legal{display:flex;gap:18px;flex-wrap:wrap;justify-content:center;padding:16px 20px}
@media(max-width:760px){
  .about-photo-real,.about-portrait{min-height:430px}
  .about-portrait{object-position:center top}
  .feature-logo-card{min-height:330px}
  .feature-logo-card img{width:min(70%,300px)}
}
