/* avtorozborka static site, shared by skoda and mazda */
@font-face{font-family:'auto';src:url(fonts/auto.woff) format('woff');font-weight:normal;font-style:normal;font-display:block}

:root{
  --yellow:#fede00;
  --yellow-dk:#e6c900;
  --ink:#1b1b1b;
  --dark:#232323;
  --dark-2:#2c2c2c;
  --grey:#f3f3f3;
  --line:#e2e2e2;
  --text:#4a4a4a;
  --muted:#8a8a8a;
  --head:'Oswald',Arial Narrow,Arial,sans-serif;
  --body:'Mulish',Arial,sans-serif;
  --wrap:1170px;
  --hdr:84px;
}

*,*::before,*::after{box-sizing:border-box}
html{scroll-behavior:smooth;scroll-padding-top:calc(var(--hdr) + 10px);-webkit-text-size-adjust:100%}
body{margin:0;font:400 15px/1.6 var(--body);color:var(--text);background:#fff;overflow-x:hidden}
img{max-width:100%;height:auto;display:block}
a{color:inherit}
h1,h2,h3,h4,h5{font-family:var(--head);font-weight:500;color:var(--ink);margin:0;line-height:1.15}
p{margin:0}
ul{margin:0;padding:0;list-style:none}
button{font:inherit;cursor:pointer}
.wrap{max-width:var(--wrap);margin:0 auto;padding:0 16px}
.ico{font-family:'auto'!important;font-style:normal;font-weight:normal;line-height:1;speak:never;-webkit-font-smoothing:antialiased}
.ico-power::before{content:"\e905"}
.ico-check::before{content:"\e908"}
.ico-close::before{content:"\e909"}
.ico-menu::before{content:"\e90e"}
.ico-rocket::before{content:"\e910"}
.ico-people-1::before{content:"\e911"}
.ico-people::before{content:"\e912"}
.ico-transport::before{content:"\e913"}
.ico-phone::before{content:"\e917"}
.ico-technology::before{content:"\e919"}
.ico-tool::before{content:"\e91a"}
.ico-diploma::before{content:"\e91b"}
.hl{color:var(--yellow)}

/* buttons */
.btn{display:inline-flex;align-items:center;gap:10px;height:48px;padding:0 26px;border:2px solid var(--yellow);background:var(--yellow);color:var(--ink);font:500 15px/1 var(--head);text-transform:uppercase;letter-spacing:.06em;text-decoration:none;transition:background .2s,color .2s,border-color .2s}
.btn:hover{background:var(--ink);border-color:var(--ink);color:var(--yellow)}
.btn--ghost{background:transparent;color:#fff;border-color:rgba(255,255,255,.55)}
.btn--ghost:hover{background:#fff;color:var(--ink);border-color:#fff}
.btn .ico{font-size:20px}
.i-phone{width:18px;height:18px;flex:none;fill:currentColor}
.btn img{width:22px;height:22px}

/* topbar + header */
.topbar{background:#0e0e0e;color:#a8a8a8;font-size:13px;border-bottom:1px solid #262626}
.topbar .wrap{display:flex;justify-content:space-between;align-items:center;height:36px}
.topbar b{color:var(--yellow);font-weight:600}
.lang{display:flex;gap:2px;font:500 13px/1 var(--head);letter-spacing:.08em}
.lang a,.lang span{padding:6px 9px;text-decoration:none;color:#bdbdbd}
.lang span{background:var(--yellow);color:var(--ink)}
.lang a:hover{color:#fff}

.hdr{position:sticky;top:0;z-index:50;background:var(--ink);border-bottom:3px solid var(--yellow);transition:box-shadow .2s}
.hdr.is-stuck{box-shadow:0 3px 16px rgba(0,0,0,.45)}
.hdr .wrap{display:flex;align-items:center;gap:28px;height:var(--hdr)}
.logo{flex:none;display:block}
.logo img{height:58px;width:auto}
.nav{display:flex;gap:24px;margin-right:auto;white-space:nowrap}
.nav a{font:500 15px/1 var(--head);text-transform:uppercase;letter-spacing:.05em;color:#fff;text-decoration:none;padding:8px 0;border-bottom:2px solid transparent}
.nav a:hover{border-color:var(--yellow);color:var(--yellow)}
.hdr-phones{display:flex;flex-direction:column;align-items:flex-end;line-height:1.25}
.hdr-phones small{font-size:11px;text-transform:uppercase;letter-spacing:.08em;color:#9a9a9a}
.hdr-phones a{font:500 18px/1.3 var(--head);color:#fff;text-decoration:none;white-space:nowrap}
.hdr-phones a+a{margin-left:12px}
.hdr-phones a:hover{color:var(--yellow)}
.hdr .btn{height:44px;padding:0 18px;font-size:14px}
.hdr .btn:hover{background:#fff;border-color:#fff;color:var(--ink)}
.hdr-call,.burger{display:none}

/* mobile drawer */
.drawer{position:fixed;inset:0;z-index:80;background:rgba(0,0,0,.55);opacity:0;visibility:hidden;transition:opacity .2s,visibility .2s}
.drawer.is-open{opacity:1;visibility:visible}
.drawer-panel{position:absolute;top:0;right:0;bottom:0;width:min(320px,86vw);background:var(--ink);color:#ddd;padding:22px 22px 30px;overflow-y:auto;transform:translateX(100%);transition:transform .25s}
.drawer.is-open .drawer-panel{transform:none}
.drawer-close{position:absolute;top:14px;right:14px;width:40px;height:40px;border:0;background:none;color:#fff;font-size:18px}
.drawer nav{display:flex;flex-direction:column;margin:44px 0 26px;border-top:1px solid #333}
.drawer nav a{font:500 18px/1 var(--head);text-transform:uppercase;letter-spacing:.05em;color:#fff;text-decoration:none;padding:16px 0;border-bottom:1px solid #333}
.drawer .phones a{display:block;font:500 22px/1.5 var(--head);color:var(--yellow);text-decoration:none}
.drawer .hours{margin:14px 0 22px;font-size:14px;color:#aaa}
.drawer .lang{margin-top:24px}

/* hero */
.hero{position:relative;color:#fff;background-color:#000;background-position:center 60%;background-size:cover;background-repeat:no-repeat;min-height:620px;display:flex;align-items:center;text-align:center}
.hero::before{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(0,0,0,.55) 0%,rgba(0,0,0,.25) 45%,rgba(0,0,0,.7) 100%)}
.hero .wrap{position:relative;padding-top:60px;padding-bottom:60px}
.hero-kicker{font:400 26px/1.2 var(--head);color:#fff;margin-bottom:14px}
.hero h1{font:500 64px/1.08 var(--head);color:var(--yellow);text-transform:none;max-width:980px;margin:0 auto}
.hero h1.long{font-size:52px}
.hero-sub{margin:22px auto 0;font-size:14px;letter-spacing:.14em;text-transform:uppercase;color:#e6e6e6}
.hero-cta{display:flex;gap:14px;justify-content:center;flex-wrap:wrap;margin-top:36px}

/* section basics */
.sec{padding:90px 0}
.sec-head{text-align:center;max-width:820px;margin:0 auto 46px}
.sec-head h2{font-size:38px;text-transform:none}
.sec-head h2::after{content:"";display:block;width:56px;height:3px;background:var(--yellow);margin:18px auto 0}
.sec-head p{margin-top:16px;font-style:italic;color:var(--muted)}
.sec--dark{background:var(--dark) url(img/block-bg.jpg) center/cover no-repeat;color:#cfcfcf}
.sec--dark .sec-head h2{color:#fff}
.sec--dark .sec-head p{color:#a9a9a9}
.sec--grey{background:var(--grey)}

/* checklists */
.checks li{position:relative;padding:5px 0 5px 30px;font-size:15px;font-style:italic}
.checks li::before{content:"";position:absolute;left:3px;top:11px;width:12px;height:6px;border-left:2px solid var(--yellow);border-bottom:2px solid var(--yellow);transform:rotate(-45deg)}
.checks-cols{columns:3;column-gap:40px}
.checks-cols.two{columns:2;max-width:960px;margin:0 auto}
.checks-cols li{break-inside:avoid}
.more-btn{display:none}

/* tiles (parts + advantages) */
.tiles{display:grid;grid-template-columns:repeat(3,1fr);max-width:var(--wrap);margin:0 auto}
.tile{position:relative;aspect-ratio:5/4;overflow:hidden}
.tile img{width:100%;height:100%;object-fit:cover;transition:transform .5s}
.tile:hover img{transform:scale(1.05)}
.tile-txt{display:flex;flex-direction:column;justify-content:center;align-items:center;text-align:center;padding:24px 30px}
.tile-txt h3{font-size:28px;text-transform:uppercase;letter-spacing:.02em;line-height:1.15}
.tile-txt p{margin-top:12px;font-size:14px;line-height:1.5}
.tile-txt h3::after{content:"";display:block;width:34px;height:2px;margin:14px auto 0;background:currentColor;opacity:.35}
.c-y{background:var(--yellow)}
.c-y h3,.c-y p{color:var(--ink)}
.c-l{background:var(--grey)}
.c-l h3{color:var(--ink)}
.c-d{background:var(--dark-2)}
.c-d h3{color:var(--yellow)}
.c-d p{color:#cfcfcf}

/* aircon */
.aircon{display:grid;grid-template-columns:440px 1fr;gap:56px;align-items:center;max-width:1000px;margin:0 auto}
.aircon h2{font-size:34px;margin-bottom:22px}
.aircon .note{margin-top:20px;font-size:14px;color:var(--muted);border-left:3px solid var(--yellow);padding-left:14px}
.sec--grey .checks li::before{border-color:var(--ink)}

/* why us */
.why{display:grid;grid-template-columns:repeat(4,1fr);gap:0;border:1px solid var(--line)}
.why-item{padding:40px 26px 36px;text-align:center;border-right:1px solid var(--line);transition:background .2s}
.why-item:last-child{border-right:0}
.why-item:hover{background:var(--grey)}
.why-icon{width:84px;height:84px;margin:0 auto 22px;border-radius:50%;background:var(--yellow);display:flex;align-items:center;justify-content:center;font-size:38px;color:#fff}
.why-item h3{font-size:22px;text-transform:uppercase;letter-spacing:.04em;margin-bottom:10px}
.why-item p{font-size:14px;color:var(--muted);font-style:italic}

/* stats */
.stats{display:grid;grid-template-columns:repeat(4,1fr);gap:20px;text-align:center}
.stat-num{display:flex;justify-content:center;align-items:center;gap:12px;font:500 54px/1 var(--head);color:var(--ink)}
.stat-num .ico{color:var(--yellow);font-size:34px}
.stat h3{margin-top:14px;font:500 14px/1.3 var(--head);letter-spacing:.12em;text-transform:uppercase;color:var(--muted)}

/* team */
.team{background:#fff;padding:80px 0;text-align:center}
.team h2{font-size:34px;margin-bottom:18px}
.team h2::after{content:"";display:block;width:56px;height:3px;background:var(--yellow);margin:18px auto 0}
.team p{max-width:760px;margin:0 auto;font-style:italic;color:var(--muted)}

/* contacts */
.band{background:var(--ink);padding:26px 0;text-align:center}
.band h2{color:#fff;font-size:34px}
.contacts-info{display:flex;justify-content:center;flex-wrap:wrap;gap:16px 46px;margin:0 auto 34px;text-align:center}
.contacts-info div{min-width:200px}
.contacts-info small{display:block;font:500 12px/1 var(--head);letter-spacing:.12em;text-transform:uppercase;color:var(--muted);margin-bottom:8px}
.contacts-info strong,.contacts-info a{font:500 19px/1.4 var(--head);color:var(--ink);text-decoration:none}
.contacts-info a:hover{text-decoration:underline;text-decoration-color:var(--yellow);text-decoration-thickness:2px}
.contacts-media{display:grid;grid-template-columns:1fr 1fr;gap:0}
.contacts-media.single{grid-template-columns:1fr}
.contacts-media img{width:100%;height:100%;min-height:420px;object-fit:cover}
.map{position:relative;min-height:420px;background:#e5e3df}
.map iframe{position:absolute;inset:0;width:100%;height:100%;border:0}

/* footer */
.ftr{background:#111;color:#8f8f8f;font-size:14px;padding:44px 0 28px}
.ftr-grid{display:grid;grid-template-columns:1.3fr 1fr 1fr 1fr;gap:30px}
.ftr img{height:52px;width:auto;margin-bottom:14px}
.ftr h4{font:500 14px/1 var(--head);letter-spacing:.12em;text-transform:uppercase;color:#fff;margin-bottom:14px}
.ftr a{color:#cfcfcf;text-decoration:none}
.ftr a:hover{color:var(--yellow)}
.ftr .lang{margin-left:-9px}
.ftr-bottom{display:flex;justify-content:space-between;flex-wrap:wrap;gap:8px 24px;margin-top:34px;padding-top:20px;border-top:1px solid #262626;font-size:13px;color:#666}
.ftr-bottom a{color:#9a9a9a;font-weight:700;letter-spacing:.04em}

/* modal */
.modal{position:fixed;inset:0;z-index:90;display:flex;align-items:center;justify-content:center;padding:16px;background:rgba(0,0,0,.65);opacity:0;visibility:hidden;transition:opacity .2s,visibility .2s}
.modal.is-open{opacity:1;visibility:visible}
.modal-box{position:relative;width:100%;max-width:460px;background:#fff;padding:40px 34px 34px;border-top:5px solid var(--yellow);text-align:center}
.modal-box h2{font-size:28px;margin-bottom:12px}
.modal-box p{color:var(--muted);font-size:14px;margin-bottom:24px}
.modal-close{position:absolute;top:10px;right:10px;width:40px;height:40px;border:0;background:none;color:var(--ink);font-size:16px}
.modal-phones a{display:flex;align-items:center;justify-content:center;gap:10px;height:54px;margin-bottom:10px;border:2px solid var(--ink);font:500 21px/1 var(--head);color:var(--ink);text-decoration:none;transition:background .2s,color .2s}
.modal-phones a:hover{background:var(--ink);color:var(--yellow)}
.modal-phones a.viber{border-color:#7360f2;color:#7360f2}
.modal-phones a.viber:hover{background:#7360f2;color:#fff}
.modal-phones a.viber img{width:24px;height:24px}

/* ---------- responsive ---------- */
@media (min-width:1025px) and (hover:hover){
  .sec--dark{background-attachment:fixed}
}
@media (max-width:1180px){
  .nav{gap:18px}
  .hdr .btn span{display:none}
  .hdr .btn{padding:0 13px}
}
@media (max-width:1060px){
  .hdr-phones small{display:none}
  .hdr-phones a{display:block;font-size:16px}
  .hdr-phones a+a{margin-left:0}
}
@media (max-width:991px){
  :root{--hdr:66px}
  .topbar{display:none}
  .nav,.hdr-phones,.hdr .btn{display:none}
  .hdr .wrap{gap:10px}
  .logo{margin-right:auto}
  .logo img{height:46px}
  .hdr-call,.burger{display:flex;align-items:center;justify-content:center;width:46px;height:46px;border:0;font-size:20px;text-decoration:none}
  .hdr-call{background:var(--yellow);color:var(--ink)}
  .burger{background:#2f2f2f;color:#fff}
  .hero{min-height:540px}
  .hero h1{font-size:50px}
  .hero h1.long{font-size:40px}
  .sec{padding:70px 0}
  .checks-cols{columns:2}
  .aircon{grid-template-columns:1fr;gap:30px;text-align:center}
  .aircon img{margin:0 auto}
  .aircon .checks{display:inline-block;text-align:left}
  .aircon .note{text-align:left}
  .why{grid-template-columns:1fr 1fr}
  .why-item:nth-child(2){border-right:0}
  .why-item:nth-child(-n+2){border-bottom:1px solid var(--line)}
  .stats{grid-template-columns:1fr 1fr;gap:44px 20px}
  .ftr-grid{grid-template-columns:1fr 1fr}
  .tile-txt h3{font-size:22px}
}
@media (max-width:640px){
  body{font-size:15px}
  .hero{min-height:0;background-position:58% center}
  .hero .wrap{padding-top:80px;padding-bottom:70px}
  .hero-kicker{font-size:19px}
  .hero h1{font-size:40px}
  .hero h1.long{font-size:30px}
  .hero-sub{font-size:12px;letter-spacing:.1em}
  .hero-cta .btn{width:100%;justify-content:center}
  .sec{padding:56px 0}
  .sec-head{margin-bottom:30px}
  .sec-head h2{font-size:28px}
  .checks-cols,.checks-cols.two{columns:1}
  .checks li{font-size:15px}
  .collapsible .is-extra{display:none}
  .collapsible.is-open .is-extra{display:list-item}
  .more-btn{display:flex;margin:22px auto 0;height:44px;padding:0 22px;align-items:center;border:2px solid var(--yellow);background:none;color:var(--yellow);font:500 14px/1 var(--head);letter-spacing:.08em;text-transform:uppercase}
  .tiles{grid-template-columns:1fr 1fr}
  .tile{aspect-ratio:1/1}
  .tile-txt{padding:14px 12px}
  .tile-txt h3{font-size:18px}
  .tile-txt h3::after{margin-top:9px;width:26px}
  .tile-txt p{margin-top:8px;font-size:12.5px;line-height:1.4}
  /* 2-col layout has its own colour map so neighbours never match */
  .tile-txt.m-y{background:var(--yellow)}
  .tile-txt.m-y h3,.tile-txt.m-y p{color:var(--ink)}
  .tile-txt.m-l{background:var(--grey)}
  .tile-txt.m-l h3,.tile-txt.m-l p{color:var(--ink)}
  .tile-txt.m-d{background:var(--dark-2)}
  .tile-txt.m-d h3{color:var(--yellow)}
  .tile-txt.m-d p{color:#cfcfcf}
  .aircon h2{font-size:26px}
  .why{grid-template-columns:1fr;border:0;gap:12px}
  .why-item,.why-item:nth-child(-n+2){display:grid;grid-template-columns:64px 1fr;gap:0 18px;text-align:left;padding:20px 18px;border:1px solid var(--line)}
  .why-icon{grid-row:span 2;width:64px;height:64px;font-size:28px;margin:0}
  .why-item h3{font-size:19px;margin:6px 0 4px}
  .stat-num{font-size:40px}
  .stat-num .ico{font-size:26px}
  .stat h3{font-size:12px}
  .team{padding:56px 0}
  .team h2,.band h2{font-size:26px}
  .contacts-media{grid-template-columns:1fr}
  .contacts-media img{min-height:0;height:260px}
  .map{min-height:340px}
  .ftr-grid{grid-template-columns:1fr}
  .modal-box{padding:36px 20px 24px}
}
@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  *{transition:none!important}
}