:root{
  --bg:#08090c;
  --fg:#fff;
  --muted:rgba(255,255,255,.72);
  --line:rgba(255,255,255,.14);
  --accent:#22d3ee;
  --accent-ink:#04141a;
  --ease:cubic-bezier(.22,.61,.36,1);
}
*{box-sizing:border-box;margin:0;padding:0}
body{background:var(--bg);color:var(--fg);font-family:Manrope,system-ui,sans-serif;font-size:16px;line-height:1.5;-webkit-font-smoothing:antialiased;overflow-x:hidden}
a{color:inherit;text-decoration:none}
em{font-style:normal;color:var(--accent)}
.wrap{width:100%;max-width:1440px;margin:0 auto;padding:0 48px}

/* ===== Появление (как на debritour: fade-up 34px, ease .22,.61,.36,1, задержка --d) ===== */
[data-anim]{opacity:0;transform:translate3d(0,34px,0);transition:opacity .9s var(--ease),transform .9s var(--ease);transition-delay:var(--d,0s)}
.is-inview [data-anim]{opacity:1;transform:none}
/* построчное появление заголовка из-под маски */
.line{display:block;overflow:hidden;padding-bottom:.08em}
[data-line]{display:inline-block;transform:translate3d(0,110%,0);transition:transform 1.1s var(--ease);transition-delay:var(--d,0s)}
.is-inview [data-line]{transform:none}

/* ===== Кнопки ===== */
.btn{position:relative;display:inline-flex;align-items:center;justify-content:center;height:58px;padding:0 32px;border-radius:10px;font-weight:600;font-size:16px;border:0;cursor:pointer;overflow:hidden;font-family:inherit;transition:transform .35s var(--ease),box-shadow .35s var(--ease)}
.btn--sm{height:48px;padding:0 24px;font-size:15px}
.btn--accent{background:var(--accent);color:var(--accent-ink)}
.btn--accent:hover{transform:translateY(-2px);box-shadow:0 10px 30px -8px rgba(34,211,238,.6)}
/* блик по кнопке — qb-shine */
.btn--accent::after{content:"";position:absolute;top:0;left:-75%;width:50%;height:100%;background:linear-gradient(90deg,transparent,rgba(255,255,255,.65),transparent);transform:skewX(-18deg);opacity:0;pointer-events:none}
.btn--shine::after{animation:shine 1s var(--ease) 2.2s 1 forwards}
.btn--accent:hover::after{animation:shine .85s var(--ease) forwards}
@keyframes shine{0%{left:-75%;opacity:0}20%{opacity:1}100%{left:125%;opacity:0}}

.link-arrow{display:inline-flex;gap:10px;font-weight:600}
.link-arrow span{transition:transform .35s var(--ease)}
.link-arrow:hover span{transform:translateX(6px)}

.dot{display:inline-block;width:8px;height:8px;border-radius:50%;background:var(--accent);animation:pulse 2.4s infinite;flex:none}
@keyframes pulse{0%{box-shadow:0 0 0 0 rgba(34,211,238,.55)}70%{box-shadow:0 0 0 8px rgba(34,211,238,0)}100%{box-shadow:0 0 0 0 rgba(34,211,238,0)}}

/* ===== Шапка ===== */
.hdr{position:fixed;inset:0 0 auto;z-index:50;animation:hdrIn 1s var(--ease) both}
@keyframes hdrIn{from{opacity:0;transform:translateY(-100%)}}
.hdr__in{display:flex;align-items:center;gap:36px;height:100px}
.logo{display:flex;flex-direction:column;line-height:1.1;margin-right:auto}
.logo b{font-size:20px;font-weight:700;letter-spacing:.01em}
.logo span{font-size:12px;color:var(--muted)}
.nav{display:flex;gap:36px;margin-right:auto}
.nav a{position:relative;font-size:15px;color:rgba(255,255,255,.88)}
.nav a::after{content:"";position:absolute;left:0;bottom:-6px;width:100%;height:1px;background:var(--accent);transform:scaleX(0);transform-origin:right;transition:transform .45s var(--ease)}
.nav a:hover::after{transform:scaleX(1);transform-origin:left}
.hdr__tel{font-weight:500;font-size:16px}
.burger{display:none;width:44px;height:44px;border-radius:10px;background:rgba(255,255,255,.1);border:0;cursor:pointer;position:relative}
.burger i{position:absolute;left:12px;width:20px;height:2px;background:#fff;transition:transform .4s var(--ease),top .4s var(--ease)}
.burger i:first-child{top:17px}.burger i:last-child{top:25px}
.menu-open .burger i:first-child{top:21px;transform:rotate(45deg)}
.menu-open .burger i:last-child{top:21px;transform:rotate(-45deg)}

.menu{position:fixed;inset:0;z-index:40;background:rgba(8,9,12,.85);backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px);display:flex;flex-direction:column;justify-content:center;padding:0 24px;gap:32px;opacity:0;visibility:hidden;transition:opacity .45s var(--ease),visibility .45s}
.menu-open .menu{opacity:1;visibility:visible}
.menu__nav{display:flex;flex-direction:column;gap:14px}
.menu__nav a,.menu__tel{font-size:32px;font-weight:500;opacity:0;transform:translateY(24px);filter:blur(6px);transition:all .6s var(--ease);transition-delay:var(--d)}
.menu__tel{font-size:20px;color:var(--accent)}
.menu-open .menu__nav a,.menu-open .menu__tel{opacity:1;transform:none;filter:none}

/* ===== Первый экран ===== */
.hero{position:relative;min-height:100vh;min-height:100svh;display:flex;flex-direction:column;justify-content:flex-end;overflow:hidden;isolation:isolate}
.hero__bg{position:absolute;inset:0;z-index:-1;background:#07080b}
.hero__bg img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
/* «лампы»: плавный zoom-in как у слайдера debritour (scale 1.08 → 1) */
.tubes{position:absolute;right:-20%;top:-40%;width:110%;height:180%;display:flex;gap:4.2%;transform:rotate(-34deg) scale(1.08);opacity:0;transition:opacity 1.4s var(--ease),transform 2.4s var(--ease),translate 1.2s var(--ease)}
.is-inview .tubes{opacity:1;transform:rotate(-34deg) scale(1)}
.tubes span{flex:none;width:5.2%;height:100%;border-radius:999px;position:relative;overflow:hidden;
  background:linear-gradient(90deg,rgba(20,22,35,.9) 0%,rgba(90,90,170,.45) 30%,rgba(190,190,255,.55) 48%,rgba(110,100,220,.4) 62%,rgba(15,16,26,.95) 100%);
  box-shadow:0 0 40px rgba(109,92,255,.18);animation:flicker 7s infinite}
.tubes span::after{content:"";position:absolute;left:0;right:0;height:30%;top:-30%;background:linear-gradient(180deg,transparent,rgba(170,160,255,.55),rgba(34,211,238,.25),transparent);animation:scan 6s linear infinite}
.tubes span:nth-child(2n){animation-delay:-2s}.tubes span:nth-child(2n)::after{animation-delay:-3s;animation-duration:7.5s}
.tubes span:nth-child(3n){animation-delay:-4s}.tubes span:nth-child(3n)::after{animation-delay:-1.5s;animation-duration:5s}
.tubes span:nth-child(-n+3){opacity:.35}
@keyframes scan{to{top:130%}}
@keyframes flicker{0%,100%{filter:brightness(1)}45%{filter:brightness(1.18)}47%{filter:brightness(.85)}49%{filter:brightness(1.15)}}
.hero__glow{position:absolute;width:60vw;height:60vw;right:-10vw;top:-10vw;border-radius:50%;background:radial-gradient(circle,rgba(109,92,255,.35),transparent 60%);filter:blur(40px);animation:drift 14s ease-in-out infinite alternate}
@keyframes drift{to{transform:translate(-8vw,10vw) scale(1.15)}}
.hero__shade{position:absolute;inset:0;background:linear-gradient(90deg,rgba(7,8,11,.95) 0%,rgba(7,8,11,.75) 35%,rgba(7,8,11,.2) 70%,rgba(7,8,11,.4) 100%),linear-gradient(0deg,rgba(7,8,11,.9) 0%,transparent 40%)}
.hero__in{padding-top:150px}
.hero__tags{display:flex;align-items:center;gap:16px;margin-bottom:28px}
.pill{display:inline-flex;align-items:center;gap:10px;padding:10px 18px;border:1px solid rgba(255,255,255,.3);border-radius:999px;background:rgba(255,255,255,.06);backdrop-filter:blur(10px);font-weight:600;font-size:15px}
.hero__dealer{font-size:15px;color:var(--muted)}
.hero__title{font-size:clamp(38px,5.3vw,80px);font-weight:400;line-height:1.02;letter-spacing:-.035em;max-width:1200px}
.hero__lead{margin-top:28px;max-width:480px;font-size:19px;color:var(--muted)}
.hero__cta{display:flex;align-items:center;gap:28px;margin-top:40px;flex-wrap:wrap}
.hero__facts{display:grid;grid-template-columns:repeat(4,auto);justify-content:space-between;gap:20px;margin-top:80px;padding-top:26px;padding-bottom:30px;border-top:1px solid var(--line)}
.hero__facts div{display:flex;align-items:center;gap:12px}

/* ===== Адаптив ===== */
@media (max-width:1100px){
  .nav,.hdr__tel{display:none}
  .burger{display:block}
  .hero__facts{grid-template-columns:1fr 1fr}
}
@media (max-width:720px){
  .wrap{padding:0 16px}
  .hdr__in{height:72px;gap:12px}
  .hdr .btn--sm{display:none}
  .hero__in{padding-top:120px}
  .hero__lead{font-size:17px}
  .hero__facts{grid-template-columns:1fr;margin-top:56px;gap:12px}
  .tubes{width:200%;right:-60%}
}

@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation-duration:.001ms!important;transition-duration:.001ms!important}
  [data-anim],[data-line]{opacity:1!important;transform:none!important}
}
