:root{
  --bg:#070b12;
  --panel:#10151e;
  --panel-2:#121822;
  --text:#f4f6fb;
  --muted:#9ea6b5;
  --line:#232a36;
  --accent:#7358ff;
  --ease:cubic-bezier(.2,.8,.2,1);
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  margin:0;
  color:var(--text);
  background:var(--bg);
  font-family:Inter,Arial,sans-serif;
}
.shell{
  width:min(1400px,calc(100% - 64px));
  margin:0 auto;
  padding-inline:2%;
}
.topbar{
  height:78px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  position:absolute;
  inset:0 0 auto;
  z-index:2;
}
.logo{font-weight:800;line-height:.8}
nav{display:flex;gap:52px;align-items:center}
a{color:inherit;text-decoration:none}
nav a{
  font-size:16px;
  font-weight:500;
}
.header-contacts{
  display:flex;
  align-items:center;
  gap:16px;
}
.header-phone{
  font-size:14px;
  font-weight:600;
}
.messengers-compact{
  gap:8px;
}
.messengers-compact a{
  width:36px;
  height:36px;
}
.messengers-compact svg{
  width:18px;
  height:18px;
}
.hero{
  width:min(1400px,100%);
  margin:0 auto;
  min-height:795px;
  position:relative;
  display:flex;
  align-items:center;
  border-bottom:1px solid var(--line);
}
.hero>img{
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  object-fit:cover;
}
.hero-copy{position:relative;z-index:1}
h1{font-size:58px;line-height:1.03;letter-spacing:0;margin:0 0 28px}
.hero p{width:390px;line-height:1.7;color:#d8dce5;margin:0 0 30px}
.buttons{display:flex;gap:14px;margin-bottom:48px}
.btn,button{
  border:1px solid #2e3644;
  border-radius:5px;
  min-height:48px;
  padding:0 28px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  text-transform:uppercase;
  font-size:12px;
  font-weight:700;
  transition:
    color .2s var(--ease),
    background-color .2s var(--ease),
    border-color .2s var(--ease),
    transform .2s var(--ease),
    box-shadow .2s var(--ease);
}
.btn:hover,
button:hover{
  transform:translateY(-1px);
}
.btn:active,
button:active{
  transform:translateY(0);
}
.btn.light,.footer button{background:#fff;color:#090c11}
.btn.dark{background:transparent}
.dealer{
  width:400px;
  padding-bottom:18px;
  margin-bottom:18px;
  border-bottom:1px solid #38404e;
  color:var(--muted);
  text-transform:uppercase;
  font-size:11px;
}
.benefits{display:flex;gap:28px;color:#d3d8e2;font-size:12px}
.benefits span{
  position:relative;
  min-height:24px;
  padding-left:34px;
  line-height:1.45;
}
.benefit-icon{
  width:22px;
  height:22px;
  position:absolute;
  left:0;
  top:1px;
  fill:none;
  stroke:#aeb8cb;
  stroke-width:1.6;
  stroke-linecap:round;
  stroke-linejoin:round;
}
.tech{
  display:grid;
  grid-template-columns:330px 1fr;
  gap:74px;
  padding:42px 0 46px;
}
small{color:#8876ff;text-transform:uppercase;font-size:11px}
h2{font-size:36px;line-height:1.12;margin:18px 0}
.section-copy p{color:var(--muted);line-height:1.7;margin:0}
.feature-grid{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:16px;
}
.feature-grid article{
  min-height:280px;
  padding:16px 20px 18px;
  background:linear-gradient(180deg,#141a24,#0f141d);
  border:1px solid #1d2430;
  border-radius:10px;
  overflow:hidden;
  transition:
    transform .25s var(--ease),
    border-color .25s var(--ease),
    box-shadow .25s var(--ease);
}
.feature-grid article:hover,
.product-grid article:hover{
  transform:translateY(-3px);
  border-color:#30394a;
  box-shadow:0 18px 36px rgba(0,0,0,.22);
}
.feature-grid img{
  width:100%;
  height:160px;
  display:block;
  object-fit:cover;
  margin:0 0 14px;
  border-radius:6px;
  opacity:.92;
}
.feature-grid b{display:block;margin-bottom:10px}
.feature-grid p{color:var(--muted);font-size:13px;line-height:1.55;margin:0}
.support-grid{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:16px;
}
.support-grid article{
  min-width:0;
}
.support-grid video{
  width:100%;
  aspect-ratio:16 / 10;
  display:block;
  object-fit:cover;
  margin-bottom:16px;
  border:1px solid #1d2430;
  border-radius:10px;
  background:#111722;
}
.support-grid h3{
  margin:0 0 10px;
  font-size:20px;
  line-height:1.3;
}
.support-grid p{
  margin:0;
  color:var(--muted);
  line-height:1.6;
}
.authenticity{
  display:grid;
  grid-template-columns:minmax(360px,1fr) 430px;
  gap:42px;
  align-items:center;
  padding:0 0 48px;
}
.authenticity img{
  width:100%;
  min-height:360px;
  max-height:460px;
  display:block;
  object-fit:cover;
  border:1px solid #1d2430;
  border-radius:10px;
}
.authenticity-copy p{
  margin:0;
  color:var(--muted);
  line-height:1.7;
}
.products{padding:42px 0 48px;border-top:1px solid var(--line)}
.products-head{
  display:flex;
  align-items:center;
  justify-content:space-between;
}
.slider-buttons{display:flex;gap:10px}
.slider-buttons button{
  width:44px;
  min-height:44px;
  padding:0;
  color:#fff;
  background:transparent;
  border-radius:50%;
  font-size:22px;
}
.product-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:16px}
.product-grid article{
  background:linear-gradient(180deg,#131923,#0d121a);
  border:1px solid #1b2230;
  border-radius:10px;
  padding:14px;
  transition:
    transform .25s var(--ease),
    border-color .25s var(--ease),
    box-shadow .25s var(--ease);
}
.product-grid img{
  width:100%;
  aspect-ratio:1/1.18;
  object-fit:contain;
}
.product-grid h3{font-size:15px;line-height:1.45;font-weight:500}
.product-grid p{font-size:16px}
.product-actions{
  display:grid;
  gap:10px;
}
.product-grid button{
  width:100%;
  background:#1a202b;
  color:#fff;
}
.product-grid .product-details-button{
  color:#dfe4ef;
  background:transparent;
}
.about{
  width:min(1400px,100%);
  margin:0 auto;
  min-height:430px;
  position:relative;
  display:flex;
  align-items:center;
  border-top:1px solid var(--line);
  background:
    linear-gradient(90deg, rgba(7,11,18,1) 0%, rgba(7,11,18,.96) 34%, rgba(7,11,18,.42) 54%, rgba(7,11,18,0) 72%),
    url("assets/banner-v3.png") center center / cover no-repeat;
}
.about-copy{position:relative;z-index:1}
.about ul{padding:0;margin:0 0 24px;list-style:none;color:#dce0e8}
.about li{margin:12px 0}
.about li::before{content:"●";color:var(--accent);margin-right:10px}
.footer{
  padding:36px 0 28px;
}
.footer-top{
  display:grid;
  grid-template-columns:1fr;
  gap:24px;
  padding-bottom:28px;
}
.footer-top > div:first-child{
  max-width:560px;
  margin:0 auto;
  text-align:center;
}
.footer-top > div:first-child .footer-contacts{
  justify-items:center;
}
.footer-top > div:first-child .messengers{
  justify-content:center;
}
.footer h2{margin:0 0 12px}
.footer p{margin:0;color:var(--muted);line-height:1.6}
.footer-contacts{
  display:grid;
  gap:14px;
  margin-top:20px;
}
.footer-contacts-bottom{
  margin-top:0;
  justify-items:end;
}
.footer-phone{
  width:max-content;
  color:#dce0e8;
  font-size:18px;
  font-weight:600;
}
.messengers{
  display:flex;
  gap:10px;
}
.messengers a{
  width:42px;
  height:42px;
  display:grid;
  place-items:center;
  border:1px solid #313847;
  border-radius:50%;
  transition:
    transform .2s var(--ease),
    border-color .2s var(--ease),
    background-color .2s var(--ease);
}
.messengers a:hover{
  transform:translateY(-2px);
  border-color:#4a556d;
  background:#131a25;
}
.messengers svg{
  width:20px;
  height:20px;
  fill:none;
  stroke:#dce0e8;
  stroke-width:1.6;
  stroke-linecap:round;
  stroke-linejoin:round;
}
.messenger-viber svg{stroke:#7360f2}
.messenger-whatsapp svg{stroke:#25d366}
.messenger-telegram svg{stroke:#26a5e4}
form{
  display:grid;
  grid-template-columns:minmax(180px,1fr) minmax(250px,1.15fr) minmax(210px,1fr) 260px;
  gap:12px;
}
.hp-field{
  position:absolute;
  left:-9999px;
  width:1px;
  height:1px;
  overflow:hidden;
}
input{
  min-height:52px;
  border:1px solid #2a3240;
  border-radius:6px;
  background:#0e131b;
  color:#fff;
  font:inherit;
  font-size:16px;
  padding:0 16px;
  transition:
    border-color .2s var(--ease),
    box-shadow .2s var(--ease),
    background-color .2s var(--ease);
}
input:focus{
  outline:none;
  border-color:#66718a;
  box-shadow:0 0 0 3px rgba(115,88,255,.12);
}
input:-webkit-autofill,
input:-webkit-autofill:hover,
input:-webkit-autofill:focus,
input:-webkit-autofill:active{
  -webkit-text-fill-color:#fff;
  -webkit-box-shadow:0 0 0 1000px #0e131b inset;
  transition:background-color 9999s ease-out 0s;
}
.iti{
  width:100%;
  min-width:250px;
}
.iti__tel-input{
  width:100%;
  background:#0e131b !important;
  color:#fff;
  font-size:18px;
  font-weight:500;
}
.iti__country-container{
  border-right:1px solid #2a3240;
}
.iti__selected-country,
.iti__selected-country-primary{
  background:#0e131b !important;
  border-radius:6px 0 0 6px;
}
.iti__selected-country:hover,
.iti__selected-country:focus,
.iti__selected-country-primary:hover,
.iti__selected-country-primary:focus{
  background:#151c27 !important;
}
.iti__selected-dial-code{
  color:#dce0e8;
  font-size:18px;
  font-weight:500;
}
.iti__dropdown-content{
  margin-top:8px;
  border:1px solid #273040;
  border-radius:10px;
  background:#0d121a;
  box-shadow:0 18px 40px rgba(0,0,0,.38);
  overflow:hidden;
  animation:dropdown-in .18s var(--ease);
}
.iti__search-input{
  min-height:52px;
  color:#fff;
  background:#0e131b;
  border:0;
  border-bottom:1px solid #202838;
  border-radius:0;
}
.iti__country-list{
  background:#0d121a;
}
.iti__country{
  min-height:52px;
  color:#dce0e8;
}
.iti__country.iti__highlight{
  background:#151c27;
}
.iti__country-name,
.iti__dial-code{
  color:#dce0e8;
}
.iti__country:hover{
  background:#151c27;
}
label{
  grid-column:1 / -1;
  color:var(--muted);
  font-size:12px;
}
label input{min-height:auto;margin-right:8px}
.form-status{grid-column:1 / -1}
.footer-bottom{
  display:grid;
  grid-template-columns:220px 1fr 1fr auto;
  gap:24px;
  align-items:start;
  padding-top:24px;
  border-top:1px solid var(--line);
}
.footer-logo{font-size:18px}
.footer-links{
  display:grid;
  gap:10px;
  color:var(--muted);
  font-size:12px;
}
.policy-page{
  min-height:100vh;
}
.policy-top{
  min-height:88px;
  display:flex;
  align-items:center;
  justify-content:space-between;
}
.policy{
  max-width:900px;
  padding:24px 0 72px;
}
.policy h1{
  margin-bottom:18px;
}
.policy-lead{
  max-width:760px;
  margin:0 0 32px;
  color:#d8dce5;
  line-height:1.7;
}
.policy section{
  padding:22px 0;
  border-top:1px solid var(--line);
}
.policy section:first-of-type{
  border-top:0;
}
.policy h2{
  margin:0 0 14px;
  font-size:24px;
}
.policy p,
.policy li{
  color:var(--muted);
  line-height:1.7;
}
.policy p{
  margin:0 0 10px;
}
.policy ul{
  margin:0;
  padding-left:20px;
}
.policy a{
  color:#dce0e8;
  text-decoration:underline;
  text-underline-offset:3px;
}
label a{
  color:#dce0e8;
  text-decoration:underline;
  text-underline-offset:3px;
}
.modal{
  position:fixed;
  inset:0;
  z-index:10;
  display:flex;
  align-items:center;
  justify-content:center;
  opacity:0;
  visibility:hidden;
  pointer-events:none;
  transition:
    opacity .22s var(--ease),
    visibility .22s var(--ease);
}
.modal.is-open{
  opacity:1;
  visibility:visible;
  pointer-events:auto;
}
.modal-backdrop{
  position:absolute;
  inset:0;
  background:rgba(0,0,0,.68);
  opacity:0;
  transition:opacity .22s var(--ease);
}
.modal.is-open .modal-backdrop{opacity:1}
.modal-dialog{
  width:min(460px,calc(100% - 32px));
  position:relative;
  z-index:1;
  padding:28px;
  border:1px solid #273040;
  border-radius:10px;
  background:#0d121a;
  opacity:0;
  transform:translateY(16px) scale(.985);
  transition:
    opacity .22s var(--ease),
    transform .22s var(--ease);
}
.modal.is-open .modal-dialog{
  opacity:1;
  transform:translateY(0) scale(1);
}
.modal-close{
  position:absolute;
  top:10px;
  right:12px;
  width:32px;
  min-height:32px;
  padding:0;
  color:#fff;
  background:transparent;
  border:0;
  font-size:26px;
}
.modal-copy{color:var(--muted);margin-bottom:20px}
.details-dialog{
  width:min(720px,calc(100% - 32px));
  max-height:min(82vh,760px);
  overflow:auto;
}
.details-dialog h2{
  margin-bottom:14px;
}
.details-gallery{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:10px;
  margin-bottom:20px;
}
.details-gallery img{
  width:100%;
  aspect-ratio:1 / 1;
  display:block;
  object-fit:cover;
  border:1px solid #202838;
  border-radius:8px;
  background:#111722;
}
.details-summary{
  margin:0 0 20px;
  color:#d8dce5;
  line-height:1.65;
}
.details-grid{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:10px;
  margin-bottom:20px;
}
.details-item{
  min-height:72px;
  padding:14px;
  border:1px solid #202838;
  border-radius:8px;
  background:#111722;
}
.details-item span{
  display:block;
  margin-bottom:6px;
  color:var(--muted);
  font-size:11px;
  text-transform:uppercase;
}
.details-item b{
  display:block;
  font-size:14px;
  line-height:1.45;
}
.details-highlights{
  margin:0;
  padding:18px 18px 18px 34px;
  border:1px solid #202838;
  border-radius:8px;
  color:#dce0e8;
  background:#0f141d;
}
.details-highlights li{
  margin:0 0 10px;
  line-height:1.55;
}
.details-highlights li:last-child{
  margin-bottom:0;
}
.details-support{
  margin-top:24px;
  padding-top:24px;
  border-top:1px solid #202838;
}
.details-support h2{
  margin-bottom:14px;
}
.details-support-copy{
  margin:0 0 20px;
  color:var(--muted);
  line-height:1.65;
}
#modal-form{
  display:grid;
  grid-template-columns:1fr;
}
#modal-form button{background:#fff;color:#090c11}
@media (max-width:900px){
  .shell{
    width:min(100% - 32px,700px);
    padding-inline:0;
  }
  .topbar{height:68px}
  nav{display:none}
  .header-contacts{
    gap:10px;
  }
  .header-phone{
    font-size:12px;
  }
  .messengers-compact a{
    width:32px;
    height:32px;
  }
  .hero{min-height:690px;align-items:flex-end;padding-bottom:34px}
  .hero>img{object-position:63% center}
  h1{font-size:38px}
  .hero p,.dealer{width:min(100%,360px)}
  .buttons,.benefits{flex-wrap:wrap}
  .benefits{row-gap:16px}
  .tech,.authenticity,.footer-top{grid-template-columns:1fr;gap:28px}
  .feature-grid,.support-grid,.product-grid{grid-template-columns:1fr}
  .products,.tech{padding-top:34px}
  .authenticity{padding-bottom:34px}
  .product-grid img{aspect-ratio:1/1}
  .about{min-height:470px}
  .about{
    background:
      linear-gradient(90deg, rgba(7,11,18,1) 0%, rgba(7,11,18,.92) 46%, rgba(7,11,18,.36) 72%, rgba(7,11,18,.14) 100%),
      url("assets/banner-v3.png") 72% center / cover no-repeat;
  }
  form{grid-template-columns:1fr}
  .iti{min-width:0}
  .footer-bottom{grid-template-columns:1fr 1fr;gap:18px}
  .footer-logo,.footer-contacts-bottom{grid-column:1 / -1}
  .footer-contacts-bottom{justify-items:start}
}

@media (max-width:600px){
  .shell{width:calc(100% - 32px)}
  .hero{min-height:620px}
  .tech{
    gap:22px;
    padding:28px 0 34px;
  }
  .section-copy h2{font-size:28px}
  .section-copy p{
    font-size:15px;
    line-height:1.55;
    margin-bottom:22px;
  }
  .section-copy a{font-size:11px}
  .feature-grid{gap:12px}
  .feature-grid article{
    min-height:auto;
    padding:10px 10px 14px;
    border-radius:8px;
  }
  .feature-grid img{
    height:auto;
    aspect-ratio:16/9;
    object-fit:cover;
    margin-bottom:12px;
  }
  .feature-grid b{
    font-size:18px;
    line-height:1.3;
  }
  .feature-grid p{
    font-size:14px;
    line-height:1.5;
  }
  .authenticity img{
    min-height:auto;
    aspect-ratio:1 / 1;
  }
  .modal{
    align-items:flex-end;
  }
  .modal-dialog{
    width:100%;
    border-radius:16px 16px 0 0;
    padding:24px 16px 20px;
  }
  .details-dialog{
    max-height:86vh;
  }
  .details-grid{
    grid-template-columns:1fr;
  }
  .details-gallery{
    grid-template-columns:1fr;
  }
}
@keyframes dropdown-in{
  from{
    opacity:0;
    transform:translateY(-6px);
  }
  to{
    opacity:1;
    transform:translateY(0);
  }
}

@media (prefers-reduced-motion:reduce){
  *,
  *::before,
  *::after{
    animation-duration:.01ms !important;
    animation-iteration-count:1 !important;
    transition-duration:.01ms !important;
    scroll-behavior:auto !important;
  }
}