*,*::before,*::after{margin:0;padding:0;box-sizing:border-box}
:root{
  --bg:#FAFAF9;
  --white:#FFFFFF;
  --text:#1A1614;
  --sub:#6E6560;
  --muted:#9E9890;
  --accent:#3666D1;
  --accent-d:#2A52A8;
  --accent-2:#92C1F1;
  --accent-l:#EAF1FC;
  --border:#E8E4DE;
  --fP:'Manrope',system-ui,sans-serif;
  --fB:'Manrope',system-ui,sans-serif;
  --r:8px;
  --glow:0 0 20px rgba(54,102,209,0.25);
  --ease:cubic-bezier(0.4,0,0.2,1);
}
html{scroll-behavior:auto}
body{font-family:var(--fB);color:var(--text);background:var(--bg);overflow-x:hidden}
a{text-decoration:none;color:inherit}
img{display:block;max-width:100%;height:auto}

/* --- Preloader --- */
.preloader{position:fixed;inset:0;z-index:99999;background:var(--white);display:flex;align-items:center;justify-content:center;transition:opacity .5s var(--ease),visibility .5s}
.preloader.is-done{opacity:0;visibility:hidden;pointer-events:none}
.preloader-ring{width:44px;height:44px;border:3px solid var(--border);border-top-color:var(--accent);border-radius:50%;animation:preloaderSpin .7s linear infinite}
@keyframes preloaderSpin{to{transform:rotate(360deg)}}

/* --- Header with auto-hide --- */
header{position:sticky;top:0;z-index:100;background:rgba(255,255,255,0.95);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);border-bottom:1px solid var(--border);transition:transform .35s var(--ease),box-shadow .35s var(--ease)}
header.is-hidden{transform:translateY(-100%)}
header.is-scrolled{box-shadow:0 2px 20px rgba(0,0,0,0.06)}
header::before{content:'';position:absolute;inset:0;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='76' height='40' fill='%233666D1'%3E%3Crect x='1' y='1' width='36' height='18' rx='2'/%3E%3Crect x='39' y='1' width='36' height='18' rx='2'/%3E%3Crect x='-18' y='21' width='36' height='18' rx='2'/%3E%3Crect x='20' y='21' width='36' height='18' rx='2'/%3E%3Crect x='58' y='21' width='36' height='18' rx='2'/%3E%3C/svg%3E");background-size:76px 40px;background-position:var(--tile-x,0) var(--tile-y,0);opacity:.055;transition:opacity .4s var(--ease),background-position .5s var(--ease);pointer-events:none;z-index:0}
header:hover::before{opacity:.1}
.nav-inner{max-width:1200px;margin:0 auto;display:flex;align-items:center;gap:32px;padding:14px 24px;position:relative;z-index:1}
.logo img{height:52px;width:auto;max-width:200px}
.nav-links{display:flex;gap:28px;list-style:none;margin-left:auto}
.nav-links a{font-size:13.5px;font-weight:500;color:var(--sub);transition:color .2s;white-space:nowrap;position:relative}
.nav-links a::after{content:'';position:absolute;left:0;bottom:-4px;width:0;height:2px;background:var(--accent);border-radius:1px;transition:width .3s var(--ease)}
.nav-links a:hover{color:var(--text)}
.nav-links a:hover::after{width:100%}
.nav-links a.active{color:var(--accent);font-weight:600}
.nav-links a.active::after{width:100%}
.nav-phone{font-size:14px;font-weight:600;color:var(--text);display:flex;align-items:center;gap:6px;white-space:nowrap}

/* --- Hamburger (mobile) --- */
.hamburger{display:none;flex-direction:column;gap:5px;padding:8px;cursor:pointer;border:none;background:none;z-index:201}
.hamburger span{display:block;width:22px;height:2px;background:var(--text);border-radius:1px;transition:transform .3s var(--ease),opacity .3s}
.hamburger.is-open span:nth-child(1){transform:rotate(45deg) translate(5px,5px)}
.hamburger.is-open span:nth-child(2){opacity:0}
.hamburger.is-open span:nth-child(3){transform:rotate(-45deg) translate(5px,-5px)}

/* --- Mobile nav overlay (outside header to avoid backdrop-filter containment) --- */
.mobile-nav{display:none;position:fixed;inset:0;z-index:150;background:rgba(255,255,255,0.98);backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px);flex-direction:column;align-items:center;justify-content:center;gap:28px;opacity:0;visibility:hidden;transition:opacity .3s var(--ease),visibility .3s}
.mobile-nav.is-open{opacity:1 !important;visibility:visible !important}
.mobile-nav a{font-size:22px;font-weight:600;color:var(--text);transition:color .2s}
.mobile-nav a:hover{color:var(--accent)}

/* --- CTA button with glow --- */
.btn-wa{display:flex;align-items:center;gap:8px;background:var(--accent);color:#fff;font-size:13px;font-weight:600;padding:10px 20px;border-radius:var(--r);white-space:nowrap;transition:background .2s,box-shadow .3s,transform .2s}
.btn-wa:hover{background:var(--accent-d);box-shadow:var(--glow);transform:translateY(-1px)}
.btn-wa svg{width:18px;height:18px;flex-shrink:0}
.hero{position:relative;z-index:0;height:90vh;min-height:560px;max-height:780px;overflow:hidden}
.hero-slides{position:absolute;inset:0;z-index:0}
.hero-slide{position:absolute;inset:0;background-size:cover;background-position:center;opacity:0;transition:opacity .8s ease}
.hero-slide.is-active{opacity:1}
.hero-overlay{position:absolute;inset:0;background:linear-gradient(to top,rgba(0,0,0,0.75) 0%,rgba(0,0,0,0.3) 50%,transparent 100%)}
.hero-content{position:relative;z-index:2;max-width:1200px;margin:0 auto;padding:0 24px;height:100%;display:flex;align-items:center}
.hero-panel{position:absolute;left:24px;right:24px;bottom:140px;max-width:1152px;margin:0 auto;opacity:0;pointer-events:none;transition:opacity .3s ease}
.hero-panel.is-active{opacity:1;pointer-events:auto}
.hero-tag{display:inline-block;background:var(--accent);color:#fff;font-size:11px;font-weight:600;letter-spacing:.1em;text-transform:uppercase;padding:5px 12px;border-radius:4px;margin-bottom:20px}
.hero h1{font-family:var(--fP);font-size:clamp(30px,3.5vw,42px);font-weight:700;line-height:1.25;color:#fff;max-width:700px;margin-bottom:10px}
.hero h1 em{color:var(--accent-2);font-style:normal}
.hero-sub{font-size:17px;font-weight:400;color:rgba(255,255,255,0.88);max-width:520px;line-height:1.6;margin-bottom:22px}
.hero-ctas{display:flex;gap:14px;flex-wrap:wrap}
.btn-primary{display:inline-flex;align-items:center;gap:9px;background:var(--accent);color:#fff;font-size:14px;font-weight:600;padding:14px 28px;border-radius:999px;transition:background .25s var(--ease),box-shadow .3s var(--ease),transform .25s var(--ease);position:relative;overflow:hidden}
.btn-primary::before{content:'';position:absolute;inset:0;background:linear-gradient(135deg,rgba(255,255,255,0.2),transparent 60%);opacity:0;transition:opacity .3s}
.btn-primary:hover{background:var(--accent-d);box-shadow:0 4px 20px rgba(54,102,209,0.35);transform:translateY(-2px)}
.btn-primary:hover::before{opacity:1}
.btn-primary:active{transform:translateY(0);box-shadow:0 2px 10px rgba(54,102,209,0.25)}
.btn-secondary{display:inline-flex;align-items:center;gap:9px;background:var(--accent-2);color:#16305E;font-size:14px;font-weight:600;padding:14px 28px;border-radius:999px;transition:filter .2s,transform .25s var(--ease),box-shadow .3s}
.btn-secondary:hover{filter:brightness(0.94);transform:translateY(-2px);box-shadow:0 4px 16px rgba(146,193,241,0.35)}
.hero-nav-arrow{position:absolute;top:50%;transform:translateY(-50%);z-index:3;width:44px;height:44px;border-radius:50%;background:rgba(255,255,255,0.5);border:none;display:flex;align-items:center;justify-content:center;cursor:pointer;color:#1A1614;transition:background .2s}
.hero-nav-arrow:hover{background:rgba(255,255,255,0.8)}
.hero-nav-arrow.prev{left:20px}
.hero-nav-arrow.next{right:20px}
.hero-dots{position:absolute;bottom:100px;left:50%;transform:translateX(-50%);z-index:3;display:flex;gap:8px}
.hero-dot{width:28px;height:4px;border-radius:2px;background:rgba(255,255,255,0.4);border:none;cursor:pointer;padding:0;transition:background .2s}
.hero-dot.is-active{background:var(--accent-2)}
.trust-bar{position:absolute;bottom:0;left:0;right:0;z-index:2;background:rgba(255,255,255,0.1);backdrop-filter:blur(12px);border-top:1px solid rgba(255,255,255,0.15)}
.trust-inner{max-width:1200px;margin:0 auto;padding:14px 24px;display:flex;gap:40px;align-items:center;flex-wrap:wrap}
.trust-item{display:flex;align-items:center;gap:8px;font-size:13px;color:rgba(255,255,255,0.85);font-weight:400}
.trust-dot{width:6px;height:6px;border-radius:50%;background:var(--accent-2);flex-shrink:0}
.section{position:relative;z-index:1;padding:88px 24px}
.section-inner{max-width:1200px;margin:0 auto}
.section-label{font-size:11px;font-weight:600;letter-spacing:.12em;text-transform:uppercase;color:var(--accent);margin-bottom:12px}
.section-title{font-family:var(--fP);font-size:clamp(26px,3.6vw,40px);font-weight:700;line-height:1.15;margin-bottom:16px}
.section-title em{color:var(--accent);font-style:normal}
.section-body{font-size:16px;font-weight:400;color:var(--sub);line-height:1.7;max-width:520px}
.section-white{background:var(--white)}
.section-warm{background:#F2F5FB}
.why-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:24px;margin-top:52px;counter-reset:why-num}
.why-card{position:relative;overflow:hidden;background:var(--white);border:1px solid var(--border);border-radius:14px;padding:32px 28px;transition:box-shadow .35s var(--ease),transform .35s var(--ease),border-color .35s var(--ease),background .4s var(--ease);counter-increment:why-num}
.why-card::before{content:'0' counter(why-num);position:absolute;top:8px;right:14px;font-family:var(--fP);font-size:72px;font-weight:800;line-height:1;color:var(--accent);opacity:.05;pointer-events:none;transition:opacity .4s var(--ease),transform .4s var(--ease)}
.why-card:hover::before{opacity:.1;transform:scale(1.06) translate(3px,-3px)}
.why-card::after{content:'';position:absolute;inset:0;border-radius:inherit;background:radial-gradient(circle 200px at var(--mx,50%) var(--my,50%),rgba(54,102,209,0.08) 0%,transparent 70%);opacity:0;transition:opacity .35s;pointer-events:none}
.why-card:hover{transform:translateY(-6px);border-color:var(--accent);box-shadow:0 20px 44px rgba(26,58,122,0.13),0 0 0 1px rgba(54,102,209,0.06);background:linear-gradient(145deg,#fff 50%,var(--accent-l))}
.why-card:hover::after{opacity:1}
.klinker-strip{height:10px;margin-top:18px;border-radius:5px;background-image:url('https://styromat.com.pl/images/design/box-offerhome-f-3.webp');background-size:150px 96px;transform:scaleX(0);transform-origin:left center}
.anchor-row{display:flex;gap:6px;margin-top:18px;height:10px;align-items:center}
.anchor-dot{width:9px;height:9px;border-radius:2.5px;background:var(--accent);opacity:0;transform:scale(0)}
.shine{position:absolute;top:0;bottom:0;left:0;width:55%;background:linear-gradient(105deg,transparent 10%,rgba(146,193,241,0.38) 50%,transparent 90%);transform:translateX(-180%) skewX(-14deg);pointer-events:none}
.speed-bar{height:10px;margin-top:18px;border-radius:5px;background:var(--accent-l);overflow:hidden}
.speed-bar i{display:block;height:100%;width:100%;border-radius:5px;background:linear-gradient(90deg,var(--accent-2),var(--accent));transform:scaleX(0);transform-origin:left center}
.why-icon{width:52px;height:52px;border-radius:12px;background:var(--accent-l);display:flex;align-items:center;justify-content:center;margin-bottom:20px;color:var(--accent);transition:background .35s var(--ease),color .3s,transform .4s var(--ease),box-shadow .35s,border-radius .4s var(--ease)}
.why-card:hover .why-icon{background:var(--accent);color:#fff;transform:scale(1.1) rotate(-6deg);box-shadow:0 6px 20px rgba(54,102,209,0.3);border-radius:14px}
.why-card h3{font-family:var(--fP);font-size:21px;font-weight:600;margin-bottom:10px;position:relative;display:inline-block;cursor:default}
.klinker-fill{position:absolute;inset:0;background-image:url('https://styromat.com.pl/images/design/box-offerhome-f-3.webp');background-size:140px 90px;-webkit-background-clip:text;background-clip:text;color:transparent;clip-path:inset(0% 100% 0% 0%);pointer-events:none;white-space:nowrap}
.why-card p{font-size:14px;font-weight:400;color:var(--sub);line-height:1.68}
.how-grid{display:grid;grid-template-columns:1fr 1fr;gap:80px;align-items:center;margin-top:52px}
.how-img{border-radius:16px;overflow:hidden;aspect-ratio:4/3}
.how-img img{width:100%;height:100%;object-fit:cover}
.how-specs{display:flex;flex-direction:column;gap:22px}
.spec-row{display:flex;gap:16px;align-items:flex-start;padding-bottom:22px;border-bottom:1px solid var(--border)}
.spec-row:last-child{border-bottom:none;padding-bottom:0}
.spec-num{font-family:var(--fP);font-size:34px;font-weight:700;color:var(--accent);line-height:1;flex-shrink:0;min-width:80px}
.spec-num small{font-family:var(--fB);font-size:14px;font-weight:400;color:var(--sub)}
.spec-text h4{font-size:15px;font-weight:600;margin-bottom:4px}
.spec-text p{font-size:13.5px;font-weight:400;color:var(--sub);line-height:1.6}
.colors-grid{display:grid;grid-template-columns:repeat(5,1fr);gap:16px;margin-top:52px}
.color-card{border-radius:12px;overflow:hidden;cursor:pointer;transition:transform .2s}
.color-card:hover{transform:translateY(-4px)}
.color-swatch{height:160px;position:relative}
.color-swatch img{width:100%;height:100%;object-fit:cover}
.color-info{background:var(--white);border:1px solid var(--border);border-top:none;padding:14px}
.color-info h4{font-size:14px;font-weight:600;margin-bottom:3px}
.color-info span{font-size:12px;color:var(--muted)}
.color-card.cta-card{display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;height:100%;background:var(--accent-l);border:1px solid var(--border);border-radius:12px;padding:20px;gap:8px}
.color-card.cta-card h4{font-size:14px;font-weight:600}
.color-card.cta-card span{font-size:12px;color:var(--accent)}
.projects-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:16px;margin-top:52px}
.project-card{border-radius:14px;overflow:hidden;position:relative;aspect-ratio:4/3}
.project-card img{width:100%;height:100%;object-fit:cover;display:block;transition:transform .6s var(--ease),filter .4s}
.project-card:hover img{transform:scale(1.06);filter:brightness(1.05)}
.project-card .project-label{position:absolute;left:0;right:0;bottom:0;padding:14px 16px 12px;background:linear-gradient(to top,rgba(10,20,45,0.82),transparent);color:#fff;font-size:12.5px;font-weight:600;transform:translateY(4px);opacity:.85;transition:transform .35s var(--ease),opacity .35s}
.project-card:hover .project-label{transform:translateY(0);opacity:1}
.stats-row{display:grid;grid-template-columns:repeat(4,1fr);gap:2px;margin-top:52px;border:1px solid var(--border);border-radius:16px;overflow:hidden}
.stat-item{padding:48px 36px;background:var(--white);border-right:1px solid var(--border);text-align:center}
.stat-item:last-child{border-right:none}
.stat-num{font-family:var(--fP);font-size:52px;font-weight:700;color:var(--accent);line-height:1;margin-bottom:8px}
.stat-label{font-size:14px;color:var(--sub);font-weight:400}
.contact-grid{display:grid;grid-template-columns:1fr 1fr;gap:80px;align-items:center}
.contact-title{font-family:var(--fP);font-size:clamp(26px,3.6vw,40px);font-weight:700;line-height:1.15;margin-bottom:16px}
.contact-sub{font-size:16px;font-weight:400;color:var(--sub);line-height:1.7;margin-bottom:28px}
.contact-actions{display:flex;flex-direction:column;gap:12px}
.contact-btn{display:flex;align-items:center;gap:16px;padding:20px 24px;border-radius:12px;border:1.5px solid var(--border);background:var(--white);transition:border-color .25s var(--ease),background .25s var(--ease),transform .25s var(--ease),box-shadow .3s}
.contact-btn:hover{border-color:var(--accent);background:var(--accent-l);transform:translateX(6px);box-shadow:0 4px 16px rgba(54,102,209,0.1)}
.contact-btn-icon{width:46px;height:46px;border-radius:10px;background:var(--accent-l);display:flex;align-items:center;justify-content:center;font-size:20px;flex-shrink:0}
.contact-btn-text .label{font-size:11px;color:var(--muted);text-transform:uppercase;letter-spacing:.08em;margin-bottom:3px}
.contact-btn-text .value{font-size:15px;font-weight:600;color:var(--text)}
.contact-btn-arrow{margin-left:auto;color:var(--muted);font-size:18px;transition:transform .2s,color .2s}
.contact-btn:hover .contact-btn-arrow{transform:translateX(4px);color:var(--accent)}
footer{background:var(--text);color:rgba(255,255,255,0.6);padding:48px 24px 28px}
.footer-inner{max-width:1200px;margin:0 auto;display:grid;grid-template-columns:1.2fr 1fr 1.4fr;gap:40px;align-items:start}
.footer-logo img{height:32px;filter:brightness(0) invert(1);opacity:.7;margin-bottom:12px}
.footer-copy{font-size:12px;margin-top:8px}
.footer-links{display:flex;flex-direction:column;gap:10px}
.footer-links a{font-size:13px;color:rgba(255,255,255,0.5);transition:color .2s}
.footer-links a:hover{color:rgba(255,255,255,0.8)}
.footer-col-title{font-size:13px;font-weight:600;color:rgba(255,255,255,0.85);margin-bottom:12px;text-transform:uppercase;letter-spacing:.08em}
.footer-company{font-size:13px;line-height:1.7}
.footer-company a{color:rgba(255,255,255,0.5);transition:color .2s}
.footer-company a:hover{color:rgba(255,255,255,0.8)}
.footer-bottom{max-width:1200px;margin:28px auto 0;padding-top:20px;border-top:1px solid rgba(255,255,255,0.1);font-size:12px;text-align:center}
.footer-social{display:flex;gap:14px;margin-top:16px}
.footer-social a{width:36px;height:36px;border-radius:8px;background:rgba(255,255,255,0.08);display:flex;align-items:center;justify-content:center;transition:background .2s,transform .2s}
.footer-social a:hover{background:rgba(255,255,255,0.18);transform:translateY(-2px)}
.footer-social svg{width:18px;height:18px;fill:rgba(255,255,255,0.6)}
.footer-social a:hover svg{fill:rgba(255,255,255,0.9)}
.footer-social .tiktok-label{font-size:9px;color:rgba(255,255,255,0.4);margin-top:2px;text-align:center;line-height:1}
.fade-up{opacity:0;transform:translateY(24px);transition:opacity .6s ease,transform .6s ease}
.fade-up.visible{opacity:1;transform:translateY(0)}
@media(min-width:900px){
  .spec-row.fade-up,.color-card.fade-up,.ref-card.fade-up,.ablauf-step-wave.fade-up,.adv-card.fade-up,.comp-card.fade-up,.montage-phase.fade-up{
    transition:none;
  }
  .why-card.fade-up{
    transition:box-shadow .35s var(--ease),transform .35s var(--ease),border-color .35s var(--ease),background .4s var(--ease);
  }
}
.scroll-progress{position:fixed;top:0;left:0;height:3px;background:linear-gradient(90deg,var(--accent),var(--accent-2));z-index:9999;width:0;pointer-events:none;box-shadow:0 0 8px rgba(54,102,209,0.4)}
.wa-float{position:fixed;bottom:28px;right:28px;z-index:999;width:60px;height:60px;border-radius:50%;background:#25D366;display:flex;align-items:center;justify-content:center;box-shadow:0 4px 16px rgba(37,211,102,0.35);transition:transform .2s,box-shadow .2s;animation:waPulse 3s infinite}
.wa-float:hover{transform:scale(1.1);box-shadow:0 6px 24px rgba(37,211,102,0.5);animation:none}
.wa-float svg{width:32px;height:32px;fill:#fff}
@keyframes waPulse{0%,100%{box-shadow:0 4px 16px rgba(37,211,102,0.35)}50%{box-shadow:0 0 0 12px rgba(37,211,102,0),0 4px 16px rgba(37,211,102,0.35)}}
.float-btns{position:fixed;bottom:28px;right:28px;z-index:999;display:flex;flex-direction:column;gap:14px;align-items:flex-end}
.float-btns .wa-float{position:static;animation:waPulse 3s infinite}
.email-float-link{width:48px;height:48px;border-radius:50%;background:#3666D1;display:flex;align-items:center;justify-content:center;box-shadow:0 4px 16px rgba(54,102,209,0.3);transition:transform .2s,box-shadow .2s}
.email-float-link:hover{transform:scale(1.1);box-shadow:0 6px 24px rgba(54,102,209,0.45)}
.email-float-link svg{width:24px;height:24px;fill:#fff}
.email-menu{position:absolute;bottom:62px;right:0;background:#fff;border-radius:14px;box-shadow:0 8px 32px rgba(0,0,0,0.15);padding:8px 0;min-width:260px;opacity:0;visibility:hidden;transform:translateY(10px) scale(0.95);transition:opacity .2s,transform .2s,visibility .2s}
.email-float:hover .email-menu,.email-menu:hover{opacity:1;visibility:visible;transform:translateY(0) scale(1)}
.email-menu a{display:flex;align-items:center;gap:12px;padding:12px 18px;text-decoration:none;color:var(--text);font-size:14px;font-weight:500;transition:background .15s}
.email-menu a:hover{background:var(--accent-l)}
.email-menu a .em-icon{width:36px;height:36px;border-radius:50%;display:flex;align-items:center;justify-content:center;flex-shrink:0;font-size:18px}
.email-menu a:first-child .em-icon{background:#E8F0FE;color:var(--accent)}
.email-menu a:last-child .em-icon{background:#FFF3E0;color:#E65100}
.email-menu a .em-label{font-size:12px;color:var(--sub);font-weight:400}
.email-menu a .em-addr{font-size:14px;font-weight:600}
.ba-section{padding:100px 24px;background:var(--white);position:relative;z-index:1}
.ba-section .section-inner{max-width:1200px;margin:0 auto}
.ba-header{text-align:left;margin-bottom:48px}
.ba-carousel{position:relative;max-width:900px;margin:0 auto}
.ba-track{position:relative;border-radius:16px;overflow:hidden;box-shadow:0 12px 48px rgba(0,0,0,0.12);aspect-ratio:16/10}
.ba-slide{position:absolute;inset:0;opacity:0;pointer-events:none;transition:opacity .6s ease;z-index:0}
.ba-slide.is-active{opacity:1;pointer-events:auto;z-index:1}
.ba-container{position:relative;width:100%;height:100%;cursor:col-resize;-webkit-user-select:none;user-select:none}
.ba-container img{position:absolute;top:0;left:0;width:100%;height:100%;object-fit:cover;pointer-events:none}
.ba-after{clip-path:inset(0 0 0 0)}
.ba-before{clip-path:inset(0 50% 0 0)}
.ba-slider{position:absolute;top:0;bottom:0;left:50%;width:4px;background:#fff;z-index:10;transform:translateX(-50%);box-shadow:0 0 12px rgba(0,0,0,0.3)}
.ba-slider::before{content:'';position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:52px;height:52px;border-radius:50%;background:#fff;box-shadow:0 2px 16px rgba(0,0,0,0.35);display:flex;align-items:center;justify-content:center;border:3px solid var(--accent)}
.ba-slider svg{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:22px;height:22px;z-index:1}
.ba-label{position:absolute;bottom:16px;padding:12px 18px;background:rgba(0,0,0,0.75);color:#fff;border-radius:10px;backdrop-filter:blur(6px);z-index:5;max-width:44%}
.ba-label-before{left:16px}
.ba-label-after{right:16px}
.ba-label strong{display:block;font-size:13px;font-weight:700;letter-spacing:.1em;text-transform:uppercase;margin-bottom:2px}
.ba-label small{font-size:11px;font-weight:400;color:rgba(255,255,255,0.75);line-height:1.35;display:block}
.ba-project-label{text-align:center;margin-top:16px;font-size:14px;font-weight:600;color:var(--text);font-family:var(--fP);letter-spacing:.02em;min-height:22px;transition:opacity .3s}
.ba-dots{display:flex;justify-content:center;gap:10px;margin-top:16px}
.ba-dot{width:12px;height:12px;border-radius:50%;border:2px solid var(--accent);background:transparent;cursor:pointer;padding:0;transition:background .25s,transform .25s}
.ba-dot.is-active{background:var(--accent);transform:scale(1.15)}
.ba-dot:hover{background:var(--accent);opacity:.7}
.ba-hint{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);z-index:20;padding:10px 20px;background:rgba(0,0,0,0.7);color:#fff;font-size:13px;font-weight:500;border-radius:999px;backdrop-filter:blur(4px);pointer-events:none;opacity:0;transition:opacity .4s}
.ba-hint.is-visible{opacity:1;animation:baHintPulse 2s ease-in-out infinite}
@keyframes baHintPulse{0%,100%{transform:translate(-50%,-50%) scale(1)}50%{transform:translate(-50%,-50%) scale(1.05)}}
.ba-cta{text-align:center;margin-top:48px}
.ba-cta h3{font-size:22px;font-weight:700;color:var(--text);margin-bottom:8px}
.ba-cta p{font-size:15px;color:var(--sub);margin-bottom:20px}
.explode-section{padding:100px 24px;background:var(--bg);position:relative;z-index:1}
.explode-section .section-inner{max-width:1100px;margin:0 auto}
.explode-header{text-align:center;margin-bottom:56px}
.explode-wrap{display:flex;align-items:center;gap:56px}
.explode-stack{flex:1;display:flex;flex-direction:column;gap:0;max-width:520px;transition:gap .8s cubic-bezier(.4,0,.2,1);counter-reset:layer-num}
.explode-stack.is-exploded{gap:20px}
.explode-strip{border-radius:14px;overflow:hidden;box-shadow:0 4px 20px rgba(0,0,0,0.08);opacity:0;transform:translateY(20px);transition:opacity .5s ease,transform .5s ease,box-shadow .4s var(--ease),border-color .3s;counter-increment:layer-num}
.explode-strip.is-visible{opacity:1;transform:translateY(0)}
.explode-strip.is-visible:hover{box-shadow:0 8px 32px rgba(0,0,0,0.14);transform:translateX(6px)}
.explode-strip-inner{display:flex;align-items:stretch}
.explode-strip-visual{width:160px;min-height:110px;flex-shrink:0;position:relative;overflow:hidden}
.explode-strip-visual img{width:100%;height:100%;object-fit:cover;display:block;transition:transform .5s var(--ease)}
.explode-strip:hover .explode-strip-visual img{transform:scale(1.08)}
.explode-strip-body{flex:1;padding:20px 24px;display:flex;flex-direction:column;justify-content:center;position:relative}
.explode-strip-body::after{content:counter(layer-num);position:absolute;top:10px;right:14px;width:28px;height:28px;border-radius:50%;background:var(--accent-l);color:var(--accent);font-family:var(--fP);font-size:13px;font-weight:700;display:flex;align-items:center;justify-content:center;transition:background .3s,color .3s}
.explode-strip:hover .explode-strip-body::after{background:var(--accent);color:#fff}
.explode-strip-body h4{font-size:16px;font-weight:700;color:var(--text);margin-bottom:5px}
.explode-strip-body p{font-size:13.5px;color:var(--sub);line-height:1.55;margin:0}
.explode-strip-klinker .explode-strip-visual{background:#C4763A}
.explode-strip-klinker{background:var(--white);border-left:4px solid #C4763A}
.explode-strip-eps .explode-strip-visual{background:linear-gradient(135deg,#E8E4DE,#D5D0C8)}
.explode-strip-eps{background:var(--white);border-left:4px solid #9E9890}
.explode-strip-wall .explode-strip-visual{background:linear-gradient(135deg,#A09890,#8A8278)}
.explode-strip-wall{background:var(--white);border-left:4px solid #6E6560}
.explode-strip-dim{display:inline-block;margin-top:8px;padding:4px 12px;background:var(--accent-l);color:var(--accent);font-size:11px;font-weight:600;border-radius:6px;letter-spacing:.02em}
.explode-connector{display:flex;align-items:center;gap:12px;padding:0 20px;opacity:0;transition:opacity .5s ease .6s}
.explode-stack.is-exploded .explode-connector{opacity:1}
.explode-connector-line{flex:1;height:2px;background:linear-gradient(90deg,transparent,var(--accent-2),transparent);border-radius:1px}
.explode-connector-label{font-size:11px;font-weight:700;color:var(--accent);text-transform:uppercase;letter-spacing:.5px;white-space:nowrap;padding:3px 10px;background:var(--accent-l);border-radius:4px}
.explode-sidebar{flex:1;padding:0;background:var(--white);border-radius:16px;border:1px solid var(--border);box-shadow:0 4px 24px rgba(0,0,0,0.04);overflow:hidden}
.explode-sidebar h3{font-size:17px;font-weight:700;margin:0;padding:20px 24px;color:var(--white);background:linear-gradient(135deg,var(--accent),var(--accent-d));letter-spacing:.02em}
.explode-spec-row{display:flex;justify-content:space-between;padding:14px 24px;border-bottom:1px solid var(--border);font-size:14px;transition:background .2s}
.explode-spec-row:last-child{border-bottom:none}
.explode-spec-row:hover{background:var(--accent-l)}
.explode-spec-label{color:var(--sub)}
.explode-spec-value{font-weight:700;color:var(--text)}
.explode-spec-label{color:var(--sub);font-weight:500}
.explode-spec-value{color:var(--text);font-weight:600;text-align:right}
@media(max-width:900px){.explode-wrap{flex-direction:column}.explode-stack{max-width:100%}.explode-strip-visual{width:100px;min-height:80px}.ba-track{aspect-ratio:4/3}}
.lightbox{position:fixed;inset:0;z-index:10000;background:rgba(0,0,0,0.0);display:flex;align-items:center;justify-content:center;cursor:zoom-out;backdrop-filter:blur(0);-webkit-backdrop-filter:blur(0);opacity:0;visibility:hidden;transition:background .4s var(--ease),backdrop-filter .4s,opacity .4s,visibility .4s}
.lightbox.is-open{background:rgba(0,0,0,0.92);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);opacity:1;visibility:visible}
.lightbox img{max-width:90vw;max-height:90vh;object-fit:contain;border-radius:8px;box-shadow:0 0 60px rgba(0,0,0,0.5);cursor:default;transform:scale(0.9);opacity:0;transition:transform .4s var(--ease),opacity .35s}
.lightbox.is-open img{transform:scale(1);opacity:1}
.lightbox-close{position:absolute;top:20px;right:24px;width:44px;height:44px;border-radius:50%;background:rgba(255,255,255,0.12);border:none;color:#fff;font-size:28px;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:background .2s,transform .2s}
.lightbox-close:hover{background:rgba(255,255,255,0.25);transform:rotate(90deg)}
.project-card{cursor:zoom-in}
.ref-img{cursor:zoom-in}
html.lenis,html.lenis body{height:auto;scroll-behavior:auto}
.steps-section{background:var(--accent-d);padding:88px 24px;position:relative;z-index:1}
.steps-section::before{content:'';position:absolute;top:-47px;left:0;right:0;height:48px;background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1440 48' preserveAspectRatio='none'%3E%3Cpath d='M0,48 C240,16 480,44 720,20 C960,0 1200,28 1440,12 L1440,48 Z' fill='%232A52A8'/%3E%3C/svg%3E") no-repeat bottom center;background-size:100% 100%;pointer-events:none;z-index:1}
.steps-inner{max-width:1200px;margin:0 auto;text-align:center}
.steps-title{font-family:var(--fP);font-size:clamp(26px,3.6vw,40px);font-weight:700;line-height:1.15;color:#fff;margin-bottom:56px}
.steps-title em{color:var(--accent-2);font-style:normal}
.steps-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:0;position:relative}
.steps-grid::before{content:'';position:absolute;top:36px;left:12%;right:12%;height:2px;border-top:2px dashed rgba(255,255,255,0.25)}
.step{text-align:center;position:relative;padding:0 16px}
.step-num{width:72px;height:72px;border-radius:50%;background:rgba(255,255,255,0.12);display:flex;align-items:center;justify-content:center;margin:0 auto 20px;font-size:28px;position:relative;z-index:1}
.step h4{font-family:var(--fP);font-size:16px;font-weight:600;color:#fff;margin-bottom:8px}
.step p{font-size:13.5px;color:rgba(255,255,255,0.7);line-height:1.55}
.reviews-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:24px;margin-top:52px}
.review-card{background:var(--white);border:1px solid var(--border);border-radius:14px;padding:28px;box-shadow:0 2px 12px rgba(0,0,0,0.06);position:relative;overflow:hidden;transition:transform .35s var(--ease),box-shadow .35s var(--ease),border-color .35s}
.review-card:hover{transform:translateY(-4px);box-shadow:0 12px 32px rgba(0,0,0,0.09);border-color:var(--accent-2)}
.review-quote{position:absolute;top:16px;right:20px;font-size:64px;line-height:1;color:var(--accent-l);font-family:Georgia,serif;pointer-events:none}
.review-stars{color:#FFB800;font-size:16px;letter-spacing:2px;margin-bottom:14px}
.review-text{font-size:14px;color:var(--sub);line-height:1.65;font-style:italic;margin-bottom:18px}
.review-author{font-size:13px;font-weight:600;color:var(--text)}
.review-meta{font-size:12px;color:var(--muted);margin-top:2px}
.compare-wrap{margin-top:52px;overflow-x:auto}
.compare-title{font-family:var(--fP);font-size:20px;font-weight:700;margin-bottom:20px}
.compare-table{width:100%;border-collapse:collapse;font-size:14px}
.compare-table thead th{background:var(--accent);color:#fff;font-weight:600;padding:14px 20px;text-align:left}
.compare-table td{padding:14px 20px;border-bottom:1px solid var(--border);background:var(--white)}
.compare-table tr:last-child td{border-bottom:none}
.compare-table td:nth-child(2){background:var(--accent-l);font-weight:600}
.compare-check{color:#22C55E;font-weight:700}
.compare-cross{color:#EF4444;font-weight:700}
.cookie-banner{position:fixed;bottom:0;left:0;right:0;z-index:9998;background:var(--white);box-shadow:0 -4px 24px rgba(0,0,0,0.1);padding:20px 24px;display:none;border-top:1px solid var(--border)}
.cookie-banner.is-visible{display:block}
.cookie-inner{max-width:1200px;margin:0 auto;display:flex;align-items:center;gap:20px;flex-wrap:wrap}
.cookie-text{flex:1;font-size:13px;color:var(--sub);line-height:1.55;min-width:280px}
.cookie-text a{color:var(--accent);text-decoration:underline}
.cookie-btns{display:flex;gap:10px;flex-shrink:0}
.cookie-accept{background:#22C55E;color:#fff;border:none;padding:10px 24px;border-radius:var(--r);font-size:13px;font-weight:600;cursor:pointer;transition:background .2s}
.cookie-accept:hover{background:#1ea34d}
.cookie-decline{background:transparent;color:var(--sub);border:1.5px solid var(--border);padding:10px 24px;border-radius:var(--r);font-size:13px;font-weight:600;cursor:pointer;transition:border-color .2s,color .2s}
.cookie-decline:hover{border-color:var(--text);color:var(--text)}
.system-intro{display:grid;grid-template-columns:1fr 1fr;gap:52px;align-items:center;margin-top:56px;padding-top:56px;border-top:1px solid var(--border)}
.system-intro-img{border-radius:14px;overflow:hidden}
.system-intro-img img{width:100%;height:auto}
.system-intro h3{font-family:var(--fP);font-size:20px;font-weight:700;margin-bottom:12px}
.system-intro p{font-size:14.5px;color:var(--sub);line-height:1.7;margin-bottom:14px}
.adv-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:20px;margin-top:48px}
.adv-card{background:var(--white);border:1px solid var(--border);border-radius:14px;padding:24px;display:flex;gap:16px;align-items:flex-start;transition:box-shadow .25s,transform .25s}
.adv-card:hover{transform:translateY(-3px);box-shadow:0 8px 24px rgba(26,58,122,0.1)}
.adv-icon{width:44px;height:44px;border-radius:10px;background:var(--accent-l);display:flex;align-items:center;justify-content:center;flex-shrink:0;font-size:20px}
.adv-card h4{font-family:var(--fP);font-size:15px;font-weight:600;margin-bottom:5px}
.adv-card p{font-size:13px;color:var(--sub);line-height:1.6}
.speed-chart{margin-top:24px;border-radius:12px;overflow:hidden}
.speed-chart img{width:100%;max-width:560px}
.thermo-grid{display:grid;grid-template-columns:1fr 1fr;gap:52px;align-items:start;margin-top:48px}
.thermo-grid img{width:100%;border-radius:14px}
.thermo-text h3{font-family:var(--fP);font-size:20px;font-weight:700;margin-bottom:12px}
.thermo-text p{font-size:14.5px;color:var(--sub);line-height:1.7;margin-bottom:14px}
.thermo-benefits{display:flex;flex-direction:column;gap:10px;margin-top:20px}
.thermo-benefit{display:flex;gap:10px;align-items:baseline;font-size:14px;color:var(--sub);line-height:1.6}
.thermo-benefit .tb-check{color:#22C55E;font-weight:700;flex-shrink:0}
.uvalue-row{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin-top:36px}
.uvalue-card{background:var(--accent-l);border-radius:12px;padding:22px;text-align:center}
.uvalue-card .uval{font-family:var(--fP);font-size:24px;font-weight:700;color:var(--accent)}
.uvalue-card .ulabel{font-size:12px;color:var(--sub);margin-top:4px}
.comp-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;margin-top:48px}
.comp-card{background:var(--white);border:1px solid var(--border);border-radius:14px;overflow:hidden;transition:transform .2s,box-shadow .2s}
.comp-card:hover{transform:translateY(-4px);box-shadow:0 8px 24px rgba(0,0,0,0.08)}
.comp-img{height:180px;background:#f5f5f5;display:flex;align-items:center;justify-content:center;padding:16px}
.comp-img img{max-height:100%;max-width:100%;object-fit:contain}
.comp-info{padding:18px}
.comp-info h4{font-size:14px;font-weight:600;margin-bottom:5px}
.comp-info p{font-size:12.5px;color:var(--sub);line-height:1.5}
.comp-dim{font-size:12px;color:var(--accent);font-weight:600;margin-top:6px}
.montage-grid{display:grid;grid-template-columns:1fr 1fr;gap:52px;align-items:start;margin-top:48px}
.montage-phases{display:flex;flex-direction:column;gap:24px}
.montage-phase{background:var(--white);border-radius:14px;padding:24px;border:1px solid var(--border)}
.phase-num{width:36px;height:36px;border-radius:50%;background:var(--accent);color:#fff;display:inline-flex;align-items:center;justify-content:center;font-family:var(--fP);font-weight:700;font-size:15px;margin-bottom:12px}
.montage-phase h4{font-family:var(--fP);font-size:16px;font-weight:600;margin-bottom:6px}
.montage-phase p{font-size:13.5px;color:var(--sub);line-height:1.6}
.montage-img{border-radius:14px;overflow:hidden}
.montage-img img{width:100%;height:auto}
.techdata-table{width:100%;border-collapse:collapse;margin-top:32px;font-size:14px}
.techdata-table th{background:var(--accent);color:#fff;padding:12px 18px;text-align:left;font-weight:600}
.techdata-table td{padding:12px 18px;border-bottom:1px solid var(--border);background:var(--white)}
.techdata-table tr:nth-child(even) td{background:#f8f9fc}
.cert-row{display:flex;gap:14px;margin-top:28px;flex-wrap:wrap}
.cert-badge{background:var(--accent-l);border:1px solid var(--border);border-radius:10px;padding:12px 18px;font-size:13px;font-weight:500;color:var(--text)}
.color-collection{margin-top:32px}
.color-collection-title{font-family:var(--fP);font-size:17px;font-weight:600;margin-bottom:14px;padding-bottom:6px;border-bottom:2px solid var(--accent);display:inline-block}
.colors-full-grid{display:grid;grid-template-columns:repeat(5,1fr);gap:12px;margin-bottom:32px}
.colors-full-grid .color-swatch{height:120px}
.colors-full-grid .color-info{padding:10px 12px}
.colors-full-grid .color-info h4{font-size:12px}
.stats-sky{position:relative;background:linear-gradient(180deg,#4A90D9 0%,#6AABE6 25%,#89C4F4 50%,#A8D8F8 75%,#C8E6FB 100%);overflow:hidden;padding:80px 24px 0;z-index:1}
.stats-sky::before{content:'';position:absolute;inset:0;pointer-events:none;background:radial-gradient(ellipse 320px 120px at 15% 25%,rgba(255,255,255,0.7) 0%,transparent 70%),radial-gradient(ellipse 260px 90px at 20% 30%,rgba(255,255,255,0.5) 0%,transparent 60%),radial-gradient(ellipse 400px 140px at 55% 18%,rgba(255,255,255,0.6) 0%,transparent 65%),radial-gradient(ellipse 200px 80px at 60% 22%,rgba(255,255,255,0.45) 0%,transparent 60%),radial-gradient(ellipse 300px 100px at 80% 32%,rgba(255,255,255,0.55) 0%,transparent 65%),radial-gradient(ellipse 180px 70px at 85% 28%,rgba(255,255,255,0.4) 0%,transparent 60%),radial-gradient(ellipse 220px 85px at 40% 35%,rgba(255,255,255,0.35) 0%,transparent 60%)}
.stats-sky .stats-bg-img{position:absolute;left:0;bottom:0;height:60%;width:30%;object-fit:cover;object-position:right top;opacity:.85;pointer-events:none;mask-image:linear-gradient(to right,rgba(0,0,0,0.9) 30%,transparent 90%),linear-gradient(to top,rgba(0,0,0,0.9) 40%,transparent 90%);-webkit-mask-image:linear-gradient(to right,rgba(0,0,0,0.9) 30%,transparent 90%),linear-gradient(to top,rgba(0,0,0,0.9) 40%,transparent 90%);mask-composite:intersect;-webkit-mask-composite:source-in}
.stats-sky .section-inner{position:relative;z-index:2}
.stats-sky .stats-row{border:none;border-radius:0;background:transparent;grid-template-columns:repeat(5,1fr)}
.stats-sky .stat-item{background:transparent;border-right:1px solid rgba(255,255,255,0.2);padding:56px 36px}
.stats-sky .stat-item:last-child{border-right:none}
.stats-sky .stat-num{color:#fff;font-size:44px;text-shadow:0 2px 12px rgba(0,0,0,0.35),0 1px 3px rgba(0,0,0,0.25)}
.stats-sky .stat-label{color:rgba(255,255,255,0.9);font-size:15px}
.sky-cta-row{position:relative;z-index:2;display:flex;gap:40px;align-items:center;margin-top:56px;padding:48px 0 80px}
.sky-cta-card{background:#fff;border-radius:24px;padding:44px 48px;max-width:520px;box-shadow:0 16px 48px rgba(0,0,0,0.12);flex-shrink:0}
.sky-cta-card h3{font-family:var(--fP);font-size:26px;font-weight:700;text-transform:uppercase;line-height:1.2;color:var(--text);margin-bottom:12px}
.sky-cta-line{width:60px;height:3px;background:var(--accent-2);border-radius:2px;margin-bottom:18px}
.sky-cta-card p{font-family:var(--fP);font-size:18px;font-weight:700;color:var(--accent);text-transform:uppercase;line-height:1.35;margin-bottom:24px}
.sky-cta-card .btn-primary{font-size:15px;padding:16px 32px}
.sky-cta-text{color:#fff;max-width:420px}
.sky-cta-text h4{font-family:var(--fP);font-size:20px;font-weight:700;margin-bottom:10px;text-shadow:0 2px 8px rgba(0,0,0,0.1)}
.sky-cta-text p{font-size:15px;line-height:1.65;opacity:.9}

.page-hero{background:var(--accent-d);padding:140px 24px 64px;position:relative;z-index:1}
.page-hero .section-inner{text-align:center}
.page-hero .section-label{color:var(--accent-2)}
.page-hero .section-title{color:#fff}
.page-hero .section-title em{color:var(--accent-2)}
.page-hero .section-body{color:rgba(255,255,255,0.85);margin:0 auto}
.contact-cta{text-align:center}
.contact-cta .section-body{margin:0 auto 28px}
.contact-cta .cta-buttons{display:flex;gap:14px;justify-content:center;flex-wrap:wrap}

/* --- Back to top --- */
.back-top{position:fixed;bottom:100px;right:28px;z-index:998;width:44px;height:44px;border-radius:50%;background:var(--white);border:1.5px solid var(--border);display:flex;align-items:center;justify-content:center;cursor:pointer;box-shadow:0 4px 16px rgba(0,0,0,0.08);opacity:0;visibility:hidden;transform:translateY(12px);transition:opacity .3s var(--ease),visibility .3s,transform .3s var(--ease),background .2s,border-color .2s}
.back-top.is-visible{opacity:1;visibility:visible;transform:translateY(0)}
.back-top:hover{background:var(--accent);border-color:var(--accent);color:#fff}
.back-top svg{width:18px;height:18px;transition:color .2s}
.back-top:hover svg{stroke:#fff}

/* --- Grain overlay --- */
.grain{position:fixed;inset:0;z-index:9998;pointer-events:none;opacity:.035;mix-blend-mode:multiply;background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 256 256' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='g'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.85' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23g)'/%3E%3C/svg%3E");background-repeat:repeat;background-size:256px}

/* --- Smooth fade variants --- */
.fade-up-s{opacity:0;transform:translateY(32px) scale(0.98);transition:opacity .7s var(--ease),transform .7s var(--ease)}
.fade-up-s.visible{opacity:1;transform:translateY(0) scale(1)}

@media(max-width:900px){
.hamburger{display:flex}
.nav-links{display:none}
.mobile-nav{display:flex}
.nav-phone{display:none}.why-grid{grid-template-columns:1fr}.how-grid{grid-template-columns:1fr;gap:36px}.colors-grid{grid-template-columns:repeat(3,1fr)}.ref-grid{grid-template-columns:repeat(2,1fr)}.stats-row{grid-template-columns:1fr;border-radius:12px}.stat-item{border-right:none;border-bottom:1px solid var(--border);padding:32px 24px}.stat-item:last-child{border-bottom:none}.contact-grid{grid-template-columns:1fr;gap:36px}.trust-inner{gap:16px}.hero{height:80vh}.hero-dots{bottom:76px}.hero-panel{bottom:110px}.footer-inner{grid-template-columns:1fr;gap:24px}.compare-table{font-size:12px}.compare-table td,.compare-table thead th{padding:10px 12px}.cookie-inner{flex-direction:column;text-align:center}}
@media(max-width:600px){.colors-grid{grid-template-columns:repeat(2,1fr)}.ref-grid{grid-template-columns:1fr}.section{padding:60px 20px}.hero-nav-arrow{display:none}}
@media(max-width:900px){.stats-sky{padding:48px 24px 0}.stats-sky .stat-num{font-size:42px}.sky-cta-row{flex-direction:column;gap:24px;padding:36px 0 48px}.sky-cta-card{max-width:100%}.stats-sky .stats-bg-img{width:100%;opacity:.25;mask-image:linear-gradient(to top,rgba(0,0,0,0.5),transparent);-webkit-mask-image:linear-gradient(to top,rgba(0,0,0,0.5),transparent)}}
@media(max-width:900px){.adv-grid{grid-template-columns:1fr}.system-intro{grid-template-columns:1fr;gap:28px}.thermo-grid{grid-template-columns:1fr;gap:28px}.comp-grid{grid-template-columns:repeat(2,1fr)}.montage-grid{grid-template-columns:1fr;gap:28px}.uvalue-row{grid-template-columns:1fr}.colors-full-grid{grid-template-columns:repeat(3,1fr)}.page-hero{padding:120px 24px 48px}}
@media(max-width:600px){.comp-grid{grid-template-columns:1fr}.colors-full-grid{grid-template-columns:repeat(2,1fr)}}

/* ══ Comparison Table ══ */
.comp-table-wrap{overflow-x:auto;margin-top:40px;border-radius:14px;border:1px solid var(--border);background:#fff}
.comp-table{width:100%;border-collapse:collapse;font-size:14px;min-width:640px}
.comp-table thead{background:linear-gradient(135deg,var(--accent),var(--accent-d))}
.comp-table thead th{padding:18px 20px;color:#fff;font-weight:600;text-align:left;font-size:15px;border-bottom:2px solid var(--accent-d);white-space:nowrap}
.comp-table thead th:first-child{border-radius:13px 0 0 0}
.comp-table thead th:last-child{border-radius:0 13px 0 0}
.comp-table thead th small{display:block;font-weight:400;font-size:11px;opacity:.8;margin-top:2px}
.comp-table tbody td{padding:14px 20px;border-bottom:1px solid var(--border);color:var(--text);vertical-align:top;line-height:1.5}
.comp-table tbody tr:last-child td{border-bottom:none}
.comp-table tbody tr:hover{background:var(--accent-l)}
.comp-table td:first-child{font-weight:600;color:var(--sub);white-space:nowrap}
.comp-highlight{background:rgba(54,102,209,0.04)!important;position:relative}
.comp-table thead th.comp-highlight{background:var(--accent-d)}
.comp-badge{display:inline-block;background:#fff;color:var(--accent);font-size:10px;font-weight:700;text-transform:uppercase;letter-spacing:.06em;padding:2px 8px;border-radius:4px;margin-bottom:6px}

/* ══ FAQ Accordion ══ */
.section-light{background:#F8FAFD}
.faq-list{max-width:780px;margin:40px auto 0;display:flex;flex-direction:column;gap:12px}
.faq-item{background:#fff;border:1px solid var(--border);border-radius:12px;overflow:hidden;transition:border-color .3s var(--ease),box-shadow .3s var(--ease)}
.faq-item[open]{border-color:var(--accent);box-shadow:0 4px 20px rgba(54,102,209,0.08)}
.faq-q{padding:20px 52px 20px 24px;font-family:var(--fP);font-weight:600;font-size:16px;color:var(--text);cursor:pointer;list-style:none;position:relative;transition:color .2s}
.faq-q::-webkit-details-marker{display:none}
.faq-q::marker{display:none;content:''}
.faq-q::after{content:'';position:absolute;right:20px;top:50%;width:10px;height:10px;border-right:2px solid var(--accent);border-bottom:2px solid var(--accent);transform:translateY(-70%) rotate(45deg);transition:transform .3s var(--ease)}
.faq-item[open] .faq-q::after{transform:translateY(-30%) rotate(-135deg)}
.faq-item[open] .faq-q{color:var(--accent)}
.faq-a{padding:0 24px 20px;color:var(--sub);line-height:1.7;font-size:15px}
.faq-a p{margin:0}
.faq-a a{color:var(--accent);text-decoration:underline;text-underline-offset:3px}
.faq-a a:hover{color:var(--accent-d)}

/* ══ Comparison + FAQ responsive ══ */
@media(max-width:900px){.comp-table-wrap{margin-top:28px}.faq-list{margin-top:28px}}
@media(max-width:600px){.comp-table{font-size:12px}.comp-table thead th,.comp-table tbody td{padding:10px 12px}.faq-q{font-size:14px;padding:16px 44px 16px 18px}.faq-a{padding:0 18px 16px;font-size:14px}}

/* ══ Header extras: Muster CTA + Lang switcher ══ */
.nav-lang{font-size:13px;font-weight:700;color:var(--sub);display:flex;align-items:center;gap:3px}
.nav-lang-active{color:var(--text);font-weight:800}
.nav-lang-link{color:var(--sub);text-decoration:none}
.nav-lang-link:hover{color:var(--accent)}
.btn-muster-nav{padding:10px 18px;background:var(--accent);color:#fff;border-radius:9px;font-size:13.5px;font-weight:700;text-decoration:none;white-space:nowrap;transition:background .2s var(--ease)}
.btn-muster-nav:hover{background:var(--accent-d)}
@media(max-width:900px){.nav-lang,.btn-muster-nav{display:none}}

/* ══ Rechner (Calculator) ══ */
.rechner-wrap{display:grid;grid-template-columns:1fr 1fr;gap:0;margin-top:40px;background:#fff;border-radius:18px;overflow:hidden;box-shadow:0 1px 3px rgba(20,22,28,.08),0 18px 50px -30px rgba(20,22,28,.3)}
.rechner-inputs{padding:clamp(28px,4vw,48px);display:flex;flex-direction:column;gap:26px}
.rechner-field{display:flex;flex-direction:column;gap:9px}
.rechner-field label{font-size:15px;font-weight:600;color:var(--text)}
.rechner-field-head{display:flex;justify-content:space-between;align-items:baseline}
.rechner-val{font-size:17px;font-weight:700;color:var(--accent);font-variant-numeric:tabular-nums}
.rechner-slider{width:100%;height:26px;margin:0;accent-color:var(--accent)}
.rechner-hint{font-size:13px;color:var(--sub)}
.rechner-thickness-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin-top:4px}
.rechner-thickness{padding:14px 8px 12px;border:1.5px solid var(--border);background:#fff;border-radius:11px;cursor:pointer;display:flex;flex-direction:column;align-items:center;gap:3px;transition:border-color .2s,background .2s}
.rechner-thickness:hover{border-color:var(--accent)}
.rechner-thickness.is-active{border-color:var(--accent);background:var(--accent-l)}
.thickness-num{font-size:19px;font-weight:800;letter-spacing:-.01em;color:var(--text)}
.thickness-sub{font-size:12px;color:var(--sub);font-weight:500}
.rechner-thickness.is-active .thickness-num{color:var(--accent)}
.rechner-result{background:linear-gradient(135deg,var(--accent) 0%,var(--accent-d) 100%);color:#fff;padding:clamp(28px,4vw,48px);display:flex;flex-direction:column}
.rechner-result-label{font-size:12px;font-weight:700;letter-spacing:.16em;color:var(--accent-2);text-transform:uppercase}
.rechner-price{margin:24px 0 4px;font-size:clamp(32px,4vw,48px);font-weight:800;letter-spacing:-.03em;line-height:1;font-variant-numeric:tabular-nums}
.rechner-price-note{font-size:14px;color:rgba(255,255,255,.55)}
.rechner-divider{height:1px;background:rgba(255,255,255,.12);margin:28px 0 22px}
.rechner-detail{display:flex;justify-content:space-between;align-items:baseline;padding:12px 0;border-bottom:1px solid rgba(255,255,255,.08)}
.rechner-detail span:first-child{font-size:14px;color:rgba(255,255,255,.55)}
.rechner-detail span:last-child{font-size:15px;font-weight:700;font-variant-numeric:tabular-nums}
.rechner-cta-wrap{margin-top:auto;padding-top:30px;display:flex;flex-direction:column;gap:12px}
.rechner-cta{text-align:center;display:block}
.rechner-disclaimer{margin:0;font-size:12px;line-height:1.5;color:rgba(255,255,255,.4)}
@media(max-width:900px){.rechner-wrap{grid-template-columns:1fr}}

/* ══ Muster (Sample Order) ══ */
.muster-wrap{display:grid;grid-template-columns:1fr 1fr;gap:clamp(28px,4vw,48px);margin-top:40px}
.muster-pick-label{font-size:14px;font-weight:700;margin-bottom:14px;color:var(--text)}
.muster-pick-label span{color:var(--sub);font-weight:500}
.swatch-grid{display:flex;flex-wrap:wrap;gap:10px}
.swatch-btn{width:80px;display:flex;flex-direction:column;align-items:center;gap:7px;background:none;border:none;padding:0;cursor:pointer}
.swatch-tile{width:80px;height:56px;border-radius:9px;background:var(--sw);box-shadow:inset 0 0 0 1px rgba(20,22,28,.14);transition:box-shadow .2s}
.swatch-btn.is-picked .swatch-tile{box-shadow:inset 0 0 0 3px var(--accent),inset 0 0 0 1px rgba(20,22,28,.14)}
.swatch-name{font-size:11.5px;line-height:1.25;color:var(--sub);text-align:center}
.swatch-btn.is-picked .swatch-name{color:var(--accent);font-weight:700}
.muster-form{background:var(--accent-l);border-radius:15px;padding:clamp(24px,3vw,34px);display:flex;flex-direction:column;gap:14px}
.muster-form-field{display:flex;flex-direction:column;gap:6px}
.muster-form-field label{font-size:13.5px;font-weight:600;color:var(--text)}
.muster-optional{color:var(--sub);font-weight:400}
.muster-form-field input{padding:13px 15px;border:1.5px solid var(--border);border-radius:9px;background:#fff;font-size:15px;font-family:var(--fP);outline:none;transition:border-color .2s}
.muster-form-field input:focus{border-color:var(--accent)}
.muster-form-row{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.muster-consent{display:flex;gap:10px;align-items:flex-start;font-size:12.5px;line-height:1.5;color:var(--sub);cursor:pointer;margin-top:2px}
.muster-consent input{margin:2px 0 0;width:17px;height:17px;accent-color:var(--accent);flex-shrink:0}
.muster-consent a{color:var(--accent)}
.muster-submit{width:100%;text-align:center;margin-top:4px}
.muster-note{font-size:12.5px;color:var(--sub);text-align:center}
@media(max-width:900px){.muster-wrap{grid-template-columns:1fr}.muster-form-row{grid-template-columns:1fr}}

/* ══ Zulassungen (Certifications) ══ */
.cert-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(230px,1fr));gap:18px;margin-top:36px}
.cert-card{display:flex;flex-direction:column;gap:8px;padding:24px 22px 22px;background:#fff;border-radius:14px;border:1.5px solid transparent;box-shadow:0 1px 3px rgba(20,22,28,.07);text-decoration:none;transition:border-color .2s,transform .2s}
.cert-card:hover{border-color:var(--accent);transform:translateY(-2px)}
.cert-tag{font-size:11.5px;font-weight:700;letter-spacing:.1em;color:var(--accent);text-transform:uppercase}
.cert-title{font-size:16px;font-weight:700;line-height:1.25;letter-spacing:-.01em;color:var(--text)}
.cert-note{font-size:13px;line-height:1.5;color:var(--sub)}
.cert-link{margin-top:6px;font-size:13px;font-weight:600;color:var(--accent)}

/* ══ Ablauf Wave (Process Steps — blue wave from original) ══ */
.ablauf-wave{position:relative;z-index:1;background:var(--accent)}
.ablauf-wave-top,.ablauf-wave-bottom{display:block;width:100%;height:auto;position:relative;z-index:1}
.ablauf-wave-top{margin-bottom:-3px}
.ablauf-wave-bottom{margin-top:-3px;background:var(--white)}
.ablauf-wave-body{background:var(--accent);padding:40px 24px 56px;position:relative;overflow:hidden}
.ablauf-wave-body::before{content:'';position:absolute;inset:0;background:radial-gradient(ellipse at 30% 0%,rgba(146,193,241,0.2),transparent 60%);pointer-events:none}
.ablauf-timeline{display:flex;align-items:flex-start;justify-content:center;gap:0;margin-top:48px;position:relative}
.ablauf-step-wave{flex:1;max-width:260px;text-align:center;position:relative;z-index:1}
.ablauf-icon{width:68px;height:68px;border-radius:50%;background:rgba(255,255,255,0.15);display:flex;align-items:center;justify-content:center;margin:0 auto 18px;backdrop-filter:blur(6px);transition:transform .3s var(--ease),background .3s}
.ablauf-step-wave:hover .ablauf-icon{transform:scale(1.08);background:rgba(255,255,255,0.22)}
.ablauf-step-wave h4{font-family:var(--fP);font-size:17px;font-weight:700;color:#fff;margin-bottom:10px}
.ablauf-step-wave p{font-size:14px;color:rgba(255,255,255,0.78);line-height:1.55;padding:0 8px}
.ablauf-connector-line{width:60px;min-width:30px;height:2px;border-top:2px dashed rgba(255,255,255,0.3);align-self:center;margin-top:-40px;flex-shrink:1}

/* ══ Floating Social Rail (right side) ══ */
.social-rail{position:fixed;right:0;top:50%;transform:translateY(-50%);z-index:998;display:flex;flex-direction:column;gap:0}
.social-rail-btn{display:flex;align-items:center;justify-content:center;width:52px;height:52px;transition:transform .2s var(--ease),filter .2s}
.social-rail-btn:hover{transform:scale(1.08);filter:brightness(1.1)}
.social-rail-btn svg{width:24px;height:24px}
.social-rail-fb{background:#1877F2;border-radius:12px 0 0 0}
.social-rail-fb svg{fill:#fff}
.social-rail-li{background:#0A66C2}
.social-rail-li svg{fill:#fff}
.social-rail-ig{background:linear-gradient(135deg,#f09433,#e6683c,#dc2743,#cc2366,#bc1888)}
.social-rail-ig svg{fill:#fff}
.social-rail-tt{background:#000;border-radius:0 0 0 12px}
.social-rail-tt svg{fill:#fff}

/* ══ Referenzen (Project Cards with Specs) ══ */
.ref-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(275px,1fr));gap:22px;margin-top:44px}
.ref-card{background:#fff;border-radius:15px;overflow:hidden;box-shadow:0 1px 3px rgba(20,22,28,.07);transition:transform .2s var(--ease),box-shadow .2s}
.ref-card:hover{transform:translateY(-3px);box-shadow:0 8px 28px rgba(20,22,28,.1)}
.ref-img{aspect-ratio:4/3;overflow:hidden}
.ref-img img{width:100%;height:100%;object-fit:cover;display:block;transition:transform .5s var(--ease)}
.ref-card:hover .ref-img img{transform:scale(1.04)}
.ref-body{padding:18px 20px 22px}
.ref-body h4{font-family:var(--fP);font-size:18px;font-weight:700;color:var(--text);margin-bottom:3px}
.ref-city{font-size:14px;color:var(--muted);display:block;margin-bottom:14px}
.ref-specs{display:flex;flex-direction:column;gap:0}
.ref-spec{display:flex;justify-content:space-between;padding:9px 0;border-top:1px solid var(--border);font-size:13.5px}
.ref-spec-label{color:var(--sub)}
.ref-spec-val{font-weight:700;color:var(--text);font-variant-numeric:tabular-nums}

/* ══ Kontakt Dark ══ */
.kontakt-dark{background:var(--text);padding:88px 24px;position:relative;z-index:1;border-radius:20px;margin:0 12px 0}
.kontakt-dark .section-inner{max-width:1200px;margin:0 auto}
.kontakt-dark .contact-btn--dark{background:#1f2229;border-color:#262930;color:#fff}
.kontakt-dark .contact-btn--dark:hover{border-color:var(--accent);background:#242830}
.kontakt-dark .contact-btn--dark .label{color:rgba(255,255,255,.45)}
.kontakt-dark .contact-btn--dark .value{color:#fff}
.kontakt-dark .contact-btn--dark .contact-btn-arrow{color:rgba(255,255,255,.3)}
.kontakt-dark .contact-btn--dark:hover .contact-btn-arrow{color:var(--accent-2)}
@media(max-width:900px){.kontakt-dark{margin:0;border-radius:0;padding:60px 24px}.ablauf-timeline{flex-wrap:wrap;gap:20px}.ablauf-connector-line{display:none}.ablauf-step-wave{max-width:none;flex:1 1 40%}.social-rail{display:none}}
@media(max-width:600px){.ablauf-step-wave{flex:1 1 100%}}