:root {
  --black: #000;
  --near-black: #111;
  --dark:  #1a1a1a;
  --gray:  #f2f2f0;
  --gray2: #e8e8e6;
  --white: #fff;
  --text:  #111;
  --muted: #757575;
  --light: #bbb;
  --red:   #c41e1e;
  --border:#e0e0de;
  --border-dark: #2a2a2a;
}
*, *::before, *::after { margin:0; padding:0; box-sizing:border-box; }
html { scroll-behavior:smooth; overflow-x:hidden; }
/* коли поле вводу у фокусі — без smooth, інакше виділення тексту смикається */
html:has(input:focus, textarea:focus) { scroll-behavior:auto; }
body { font-family:'Inter', sans-serif; overflow-x:hidden; width:100%; max-width:100%; position:relative; -webkit-font-smoothing:antialiased; visibility:visible; }
a { color:inherit; text-decoration:none; }
img { display:block; width:100%; }
button { font-family:inherit; }
::selection { background:var(--red); color:#fff; }
:focus-visible { outline:2px solid var(--red); outline-offset:2px; }

/* ── СМУГА ПРОКРУТКИ ── */
/* Firefox */
html { scrollbar-width:thin; scrollbar-color:#3a3a3a #0b0b0b; }
/* Chrome / Edge / Safari */
::-webkit-scrollbar { width:10px; height:10px; }
::-webkit-scrollbar-track { background:#0b0b0b; }
::-webkit-scrollbar-thumb {
  background:#3a3a3a; border:2px solid #0b0b0b; border-radius:6px;
  transition:background .2s;
}
::-webkit-scrollbar-thumb:hover { background:var(--red); }
::-webkit-scrollbar-corner { background:#0b0b0b; }

/* ── SCROLL REVEAL ── */
.reveal { opacity:0; transform:translateY(26px); transition:opacity .7s ease, transform .7s cubic-bezier(.2,.6,.2,1); }
.reveal.in { opacity:1; transform:none; }

/* ── NAV ── */
nav {
  position:fixed; inset:0 0 auto; z-index:300;
  background:rgba(0,0,0,.97); backdrop-filter:blur(8px);
  border-bottom:1px solid #1e1e1e;
  height:64px; display:flex; align-items:center;
  padding:0 56px; gap:40px; justify-content:space-between;
}
.nav-logo { display:flex; flex-direction:column; gap:2px; }
.nav-logo-main {
  font-family:'Roboto Condensed', sans-serif; font-size:20px;
  font-weight:800; letter-spacing:6px; color:#fff; text-transform:uppercase;
}
.nav-logo-main em { font-style:normal; color:var(--red); }
.nav-logo-sub { font-size:8px; letter-spacing:3.5px; color:#666; text-transform:uppercase; }
.nav-links { display:flex; gap:32px; list-style:none; }
.nav-links a {
  position:relative; padding:4px 0;
  font-size:10px; font-weight:600; letter-spacing:2.5px;
  text-transform:uppercase; color:#888; transition:color .2s;
}
.nav-links a::after {
  content:''; position:absolute; left:0; bottom:-2px; height:2px; width:100%;
  background:var(--red); transform:scaleX(0); transform-origin:left;
  transition:transform .25s ease;
}
.nav-links a:hover { color:#fff; }
.nav-links a.on { color:#fff; }
.nav-links a.on::after { transform:scaleX(1); }
.nav-right { display:flex; align-items:center; gap:20px; }
.nav-phone { font-size:11px; font-weight:600; letter-spacing:1px; color:#888; transition:color .2s; }
.nav-phone:hover { color:#fff; }
.lang-sw { display:flex; border:1px solid #2a2a2a; }
.lang-sw button, .lang-sw a {
  padding:5px 12px; font-size:9px; font-weight:700; letter-spacing:1px;
  border:none; background:transparent; color:#666; cursor:pointer;
  transition:background .18s, color .18s; display:flex; align-items:center;
}
.lang-sw button.on, .lang-sw a.on { background:#fff; color:#000; }
.burger {
  display:none; flex-direction:column; gap:5px;
  background:none; border:none; cursor:pointer; padding:8px 4px;
}
.burger span { display:block; width:22px; height:2px; background:#fff; transition:transform .25s, opacity .25s; }
.burger.open span:nth-child(1) { transform:translateY(7px) rotate(45deg); }
.burger.open span:nth-child(2) { opacity:0; }
.burger.open span:nth-child(3) { transform:translateY(-7px) rotate(-45deg); }
.m-menu {
  position:fixed; top:64px; left:0; right:0; z-index:290;
  background:rgba(0,0,0,.98); backdrop-filter:blur(10px);
  border-bottom:1px solid #1e1e1e;
  padding:8px 24px 20px; display:none;
}
.m-menu.open { display:block; }
.m-menu a {
  display:block; padding:14px 0; border-bottom:1px solid #161616;
  font-size:12px; font-weight:600; letter-spacing:2.5px;
  text-transform:uppercase; color:#bbb;
}
.m-menu a:active { color:#fff; }
.m-foot { display:flex; justify-content:space-between; align-items:center; padding-top:16px; }

/* ── HERO ── */
.hero {
  background:var(--black); min-height:100vh;
  background-image:linear-gradient(to right, rgba(0,0,0,.92) 0%, rgba(0,0,0,.8) 38%, rgba(0,0,0,.25) 75%, rgba(0,0,0,.1) 100%), url('assets/img/main.webp');
  background-size:cover; background-position:center; background-repeat:no-repeat;
  display:flex; flex-direction:column; align-items:flex-start; justify-content:center;
  padding:80px 56px 130px 110px; position:relative; overflow:hidden;
}
.hero-text { text-align:left; max-width:620px; }
.hero-eyebrow {
  display:flex; align-items:center; gap:12px;
  font-size:10px; font-weight:600; letter-spacing:5px;
  color:#999; text-transform:uppercase; margin-bottom:28px;
}
.hero-eyebrow::before { content:''; width:32px; height:1px; background:var(--red); flex-shrink:0; }
.hero-h1 {
  font-family:'Roboto Condensed', sans-serif; font-weight:800;
  font-size:clamp(40px, 5.2vw, 76px);
  line-height:1.05; letter-spacing:1px; color:#fff; text-transform:uppercase;
}
.hero-h1 .dim { color:var(--red); }
.hero-sub { font-size:14px; line-height:1.75; color:#bbb; margin:28px 0 36px; max-width:420px; }
.hero-btns { display:flex; gap:12px; justify-content:flex-start; flex-wrap:wrap; }
.a1 { animation:fadeUp .8s cubic-bezier(.2,.6,.2,1) .05s both; }
.a2 { animation:fadeUp .8s cubic-bezier(.2,.6,.2,1) .18s both; }
.a3 { animation:fadeUp .8s cubic-bezier(.2,.6,.2,1) .32s both; }
.a4 { animation:fadeUp .8s cubic-bezier(.2,.6,.2,1) .46s both; }
@keyframes fadeUp { from { opacity:0; transform:translateY(28px); } to { opacity:1; transform:none; } }
.btn-white {
  display:inline-flex; align-items:center; gap:8px;
  padding:14px 32px; background:#fff; color:#000;
  font-size:10px; font-weight:700; letter-spacing:3px; text-transform:uppercase;
  transition:opacity .2s; border:none; cursor:pointer;
}
.btn-white:hover { opacity:.85; }
.btn-white:disabled { opacity:.35; cursor:not-allowed; }
.btn-white:disabled:hover { opacity:.35; }
.btn-outline-w {
  display:inline-flex; align-items:center; gap:8px;
  padding:14px 32px; border:1px solid #888; color:#ccc;
  font-size:10px; font-weight:600; letter-spacing:3px; text-transform:uppercase;
  transition:border-color .2s, color .2s; cursor:pointer; background:transparent;
}
.btn-outline-w:hover { border-color:#fff; color:#fff; }
/* hero stats strip */
.hero-stats {
  position:absolute; left:0; right:0; bottom:0;
  display:grid; grid-template-columns:repeat(3,1fr);
  border-top:1px solid rgba(255,255,255,.14);
  background:rgba(0,0,0,.35); backdrop-filter:blur(6px);
}
.hs {
  padding:18px 28px; display:flex; flex-direction:column; gap:4px;
  border-left:1px solid rgba(255,255,255,.08);
}
.hs:first-child { border-left:none; }
.hs-n { font-family:'Roboto Condensed', sans-serif; font-weight:800; font-size:26px; color:#fff; line-height:1; }
.hs-l { font-size:9px; font-weight:600; letter-spacing:2.5px; text-transform:uppercase; color:#9a9a9a; }

/* ── TICKER ── */
.ticker { background:var(--red); overflow:hidden; padding:11px 0; }
.ticker-track { display:flex; width:max-content; animation:tick 32s linear infinite; }
.tk-group { display:flex; align-items:center; }
.tk-group span {
  font-family:'Roboto Condensed', sans-serif; font-size:14px; font-weight:700;
  letter-spacing:2.5px; text-transform:uppercase; color:#fff; white-space:nowrap;
}
.tk-group i { font-style:normal; color:rgba(255,255,255,.55); font-size:8px; margin:0 28px; }
@keyframes tick { to { transform:translateX(-50%); } }

/* ── FEATURE SPLIT (light) ── */
.feature { background:#fff; padding:88px 56px; border-bottom:1px solid var(--border); }
.feature-text {
  max-width:720px; margin:0 auto; text-align:center;
  display:flex; flex-direction:column; align-items:center;
}
.feat-tag {
  display:flex; align-items:center; gap:12px;
  font-size:9px; font-weight:700; letter-spacing:4px; color:var(--red);
  text-transform:uppercase; margin-bottom:20px;
}
.feat-tag::before, .feat-tag::after { content:''; width:24px; height:1px; background:var(--red); }
.feat-h {
  font-family:'Roboto Condensed', sans-serif; font-weight:800;
  font-size:clamp(44px, 5vw, 66px);
  line-height:.94; text-transform:uppercase; color:var(--text); margin-bottom:22px;
}
.feat-p { font-size:16px; line-height:1.75; color:var(--muted); max-width:520px; margin-bottom:40px; }
.feat-points {
  display:grid; grid-template-columns:repeat(3,1fr);
  width:100%; max-width:720px;
}
.feat-point {
  padding:8px 20px;
  display:flex; flex-direction:column; align-items:center; gap:9px; text-align:center;
}
.feat-point + .feat-point { border-left:1px solid var(--border); }
.fp-ic { width:26px; height:26px; color:var(--text); transition:color .25s; }
.fp-ic svg { width:100%; height:100%; stroke:currentColor; fill:none; stroke-width:1.4; stroke-linecap:round; stroke-linejoin:round; }
.feat-point:hover .fp-ic { color:var(--red); }
.fp-t { font-family:'Roboto Condensed', sans-serif; font-weight:700; font-size:14px; text-transform:uppercase; letter-spacing:.5px; color:var(--text); }
.fp-d { font-size:12px; color:var(--muted); line-height:1.5; }
/* ── SECTION HEADS ── */
.sec-tag {
  font-size:9px; font-weight:700; letter-spacing:4px; color:var(--red);
  text-transform:uppercase; display:block; margin-bottom:14px;
}
.sec-h {
  font-family:'Roboto Condensed', sans-serif; font-weight:800;
  font-size:clamp(38px, 4.5vw, 60px);
  line-height:.92; text-transform:uppercase; color:var(--text);
}
.sec-p { font-size:15px; color:var(--muted); max-width:440px; margin:12px auto 0; line-height:1.7; }

/* ── VEHICLES (light) ── */
.vehicles { background:var(--gray); padding:100px 200px; }
.vehicles-head { text-align:center; margin-bottom:48px; }
.v-grid { display:grid; grid-template-columns:1fr; max-width:1500px; margin:0 auto; }
.v-card {
  background:#fff;
  display:grid; grid-template-columns:56% 44%;
  grid-template-rows:1fr auto;
  min-height:0;
  border:1px solid #d8d8d6;
}
.v-card-img { grid-column:1; grid-row:1/3; position:relative; overflow:hidden; }
.vc-state {
  position:absolute; inset:0;
  display:flex; flex-direction:column;
  opacity:0; transition:opacity .5s ease;
  overflow:hidden; pointer-events:none;
}
.vc-state.active { opacity:1; pointer-events:auto; }
.vc-state[data-color="graphite"] { background:#fff; }
.vc-state[data-color="silver"] { background:#f5f5f5; }
.vc-main-img {
  flex:1; width:100%; object-fit:contain; object-position:center center;
  background:transparent; min-height:0; display:block; cursor:pointer;
  filter:drop-shadow(0 30px 16px rgba(0,0,0,.45));
  -webkit-user-drag:none; user-drag:none;
}
.vc-thumbs {
  display:flex; gap:6px; justify-content:center;
  background:#efefed; padding:12px 16px; flex-shrink:0;
  border-top:1px solid #ddd;
  /* страховка: якщо мініатюри не влазять — прокрутка замість обрізання */
  flex-wrap:nowrap; overflow-x:auto; scrollbar-width:none;
}
.vc-thumbs::-webkit-scrollbar { display:none; }
.vc-thumb {
  flex:0 0 auto; width:90px; height:62px;
  border:2px solid transparent; background:#fff;
  cursor:pointer; padding:2px; overflow:hidden;
  transition:border-color .15s;
}
.vc-thumb img { width:100%; height:100%; object-fit:cover; display:block; pointer-events:none; }
.vc-thumb.active { border-color:#222; }
.vc-thumb:hover:not(.active) { border-color:#bbb; }
.vc-nav {
  position:absolute; top:42%; transform:translateY(-50%); z-index:10;
  background:none; border:none;
  width:38px; height:48px; display:flex; align-items:center; justify-content:center;
  cursor:pointer; opacity:0; transition:opacity .2s, color .15s;
  font-size:36px; line-height:1; color:rgba(17,17,17,.3); padding:0;
}
.v-card-img:hover .vc-nav, .v-card-img:focus-within .vc-nav { opacity:1; }
.vc-nav:hover { color:rgba(17,17,17,.7); }
.vc-nav-prev { left:12px; }
.vc-nav-next { right:12px; }
.v-card-img, .vc-nav, .vc-expand-btn, .vc-thumb, .vc-lb-prev, .vc-lb-next {
  touch-action:manipulation; user-select:none; -webkit-user-select:none;
  -webkit-tap-highlight-color:transparent;
}
.vc-count {
  position:absolute; left:14px; bottom:98px; z-index:10;
  background:none; border:none;
  font-size:11px; font-weight:600; letter-spacing:1px; color:rgba(17,17,17,.4);
  padding:0; pointer-events:none;
}
.vc-expand-btn {
  position:absolute; bottom:96px; right:12px; z-index:10;
  width:30px; height:30px; background:none; border:none;
  display:flex; align-items:center; justify-content:center;
  cursor:pointer; opacity:0; transition:opacity .2s, color .15s; padding:0;
  color:rgba(17,17,17,.35);
}
.v-card-img:hover .vc-expand-btn, .v-card-img:focus-within .vc-expand-btn { opacity:1; }
.vc-expand-btn:hover { color:rgba(17,17,17,.75); }
.no-gallery .vc-nav, .no-gallery .vc-expand-btn, .no-gallery .vc-count { display:none; }
/* один ракурс — ховаємо стрілки та лічильник, лишаємо тільки фулскрін */
.single-photo .vc-nav, .single-photo .vc-count { display:none; }
.v-card-body { grid-column:2; grid-row:1; padding:36px 36px 24px; border-left:1px solid #d0d0ce; }
.vc-swatches { display:flex; align-items:center; gap:6px; margin:22px 0 26px; }
.vc-swatches-label {
  font-size:8px; font-weight:700; letter-spacing:2px; color:var(--muted);
  text-transform:uppercase; margin-right:8px;
}
.vc-swatch {
  width:30px; height:30px; border-radius:50%; padding:4px;
  border:2px solid transparent; background:transparent; cursor:pointer;
  transition:border-color .2s; display:flex; align-items:center; justify-content:center;
}
.vc-swatch:hover { border-color:#aaa; }
.vc-swatch.active { border-color:var(--text); }
.vc-dot { width:18px; height:18px; border-radius:50%; display:block; flex-shrink:0; }
.v-card-brand {
  font-size:8px; font-weight:700; letter-spacing:3px;
  color:var(--muted); text-transform:uppercase; margin-bottom:3px;
}
.v-card-name {
  font-family:'Roboto Condensed', sans-serif; font-weight:700;
  font-size:30px; color:var(--text); text-transform:uppercase;
  letter-spacing:.3px; line-height:1; margin-bottom:4px;
}
.v-specs { border-top:1px solid var(--border); }
.v-spec {
  display:flex; justify-content:space-between; align-items:center;
  padding:7px 0; border-bottom:1px solid var(--border);
}
.v-spec:last-child { border-bottom:none; }
.v-spec-l { font-size:8px; font-weight:700; letter-spacing:1.5px; color:var(--muted); text-transform:uppercase; }
.v-spec-v { font-size:13px; font-weight:600; color:var(--text); }
.v-spec-eng { text-align:right; }
.rent-btn {
  padding:10px 20px; border:1px solid #ccc;
  font-size:8px; font-weight:700; letter-spacing:2px; text-transform:uppercase;
  color:var(--text); cursor:pointer; transition:all .2s; white-space:nowrap;
  background:transparent;
}
.rent-btn:hover { background:var(--red); color:#fff; border-color:var(--red); }
.v-card-foot { grid-column:2; grid-row:2; border-top:1px solid #d0d0ce; border-left:1px solid #d0d0ce; }
.v-options { border-bottom:1px solid #d0d0ce; }
.v-opt-head {
  font-size:8px; font-weight:700; letter-spacing:2.5px; color:var(--muted);
  text-transform:uppercase; padding:10px 36px 8px;
  background:#fafaf8; border-bottom:1px solid var(--border);
}
.v-option {
  display:flex; justify-content:space-between; align-items:center;
  padding:9px 36px; border-bottom:1px solid var(--border);
}
.v-option:last-child { border-bottom:none; }
.v-option-l { font-size:10px; font-weight:700; letter-spacing:1.5px; color:var(--muted); text-transform:uppercase; }
.v-option-p { font-family:'Roboto Condensed', sans-serif; font-size:18px; font-weight:700; color:var(--text); }
.v-option-sub { font-size:11.5px; color:var(--muted); font-weight:400; margin-left:5px; }
/* add-on row (детектор дронів) */
.v-option-addon { border-left:2px solid var(--red); padding-left:34px; background:#fbfbfa; position:relative; outline:none; cursor:help; }
.vo-tip {
  position:absolute; top:calc(100% + 7px); left:18px; z-index:40;
  background:#111; border:1px solid #2c2c2c;
  padding:9px 12px; max-width:184px; text-align:left;
  box-shadow:0 12px 32px rgba(0,0,0,.3);
  opacity:0; visibility:hidden; transform:translateY(-5px);
  transition:opacity .2s ease, transform .2s ease, visibility .2s;
  pointer-events:none;
}
.vo-tip::after {
  content:''; position:absolute; bottom:100%; left:22px;
  border:6px solid transparent; border-bottom-color:#111;
}
.vo-tip b {
  display:block; font-family:'Roboto Condensed', sans-serif;
  font-size:13px; font-weight:700; letter-spacing:.6px; color:#fff; margin-bottom:2px;
}
.vo-tip em { display:block; font-style:normal; font-size:10.5px; line-height:1.45; color:#9a9a9a; }
.v-option-addon:hover .vo-tip, .v-option-addon:focus .vo-tip {
  opacity:1; visibility:visible; transform:none;
}
.v-option-addon .v-option-l::before { content:'+'; color:var(--red); font-size:13px; font-weight:800; margin-right:5px; }
.v-option-req { font-family:'Roboto Condensed', sans-serif; font-size:13px; font-weight:700; color:#333; text-transform:uppercase; letter-spacing:.5px; }
.v-card-foot-btn { padding:14px 36px; display:flex; justify-content:flex-end; }

/* ── LIGHTBOX (light) ── */
.vc-lightbox {
  display:none; position:fixed; inset:0;
  background:rgba(0,0,0,.5); z-index:9999;
  align-items:center; justify-content:center;
}
.vc-lightbox.open { display:flex; }
.vc-lb-modal {
  position:relative; background:#fff;
  width:min(860px,88vw); height:min(640px,78vh);
  display:flex; align-items:center; justify-content:center;
  padding:40px 56px; flex-shrink:0;
  border:1px solid #d8d8d6;
  box-shadow:0 8px 48px rgba(0,0,0,.22);
}
.vc-lb-img { max-height:100%; max-width:100%; object-fit:contain; display:block; filter:drop-shadow(0 32px 18px rgba(0,0,0,.45)); }
.vc-lb-count {
  position:absolute; top:12px; left:16px;
  font-size:10px; font-weight:600; letter-spacing:1px; color:#999;
}
.vc-lb-close {
  position:absolute; top:10px; right:14px;
  font-size:22px; background:none; border:none;
  cursor:pointer; color:#999; line-height:1; padding:4px 8px;
  transition:color .15s;
}
.vc-lb-close:hover { color:#111; }
.vc-lb-prev, .vc-lb-next {
  position:absolute; top:50%; transform:translateY(-50%);
  background:none; border:none;
  font-size:46px; line-height:1; color:rgba(255,255,255,.5);
  cursor:pointer; padding:10px 18px; transition:color .15s;
  z-index:2;
}
.vc-lb-prev:hover, .vc-lb-next:hover { color:#fff; }
.vc-lb-prev { left:24px; }
.vc-lb-next { right:24px; }

/* ── TRAINING (dark) ── */
.training { background:var(--near-black); padding:100px 56px; }
.training-inner { display:grid; grid-template-columns:1fr 1fr; gap:80px; align-items:center; max-width:1400px; margin:0 auto; }
.training-tag {
  display:flex; align-items:center; gap:12px;
  font-size:9px; font-weight:700; letter-spacing:4px; color:#888;
  text-transform:uppercase; margin-bottom:16px;
}
.training-tag::before { content:''; width:24px; height:1px; background:var(--red); }
.training-h {
  font-family:'Roboto Condensed', sans-serif; font-weight:800;
  font-size:clamp(44px,5.5vw,72px); line-height:.92;
  text-transform:uppercase; color:#fff; margin-bottom:20px;
}
.training-p { font-size:14px; line-height:1.75; color:#aaa; max-width:380px; margin-bottom:36px; }
.training-cards { display:flex; flex-direction:column; gap:1px; background:#1a1a1a; }
.t-card { background:#111; padding:28px 28px 24px; transition:background .2s; border-left:2px solid transparent; }
.t-card:hover { background:#161616; border-left-color:var(--red); }
.t-card-label { font-size:8px; font-weight:700; letter-spacing:3px; color:#666; text-transform:uppercase; margin-bottom:8px; }
.t-card-name {
  font-family:'Roboto Condensed', sans-serif; font-weight:700; font-size:20px;
  text-transform:uppercase; color:#fff; letter-spacing:.3px; margin-bottom:16px;
}
.t-card-intro { font-size:13px; line-height:1.6; color:#999; margin-bottom:16px; }
.t-prog-toggle {
  display:flex; align-items:center; justify-content:space-between; gap:10px; width:100%;
  background:transparent; border:none; border-top:1px solid #1a1a1a; border-bottom:1px solid #1a1a1a;
  padding:12px 0; cursor:pointer; font-family:inherit;
  font-size:9px; font-weight:700; letter-spacing:2px; text-transform:uppercase; color:#bbb;
  transition:color .2s;
}
.t-prog-toggle:hover, .t-card.open .t-prog-toggle { color:#fff; }
.t-prog-toggle::after {
  content:''; width:7px; height:7px; flex-shrink:0;
  border-right:1.5px solid currentColor; border-bottom:1.5px solid currentColor;
  transform:translateY(-2px) rotate(45deg); transition:transform .25s;
}
.t-card.open .t-prog-toggle::after { transform:translateY(1px) rotate(-135deg); }
.t-prog {
  max-height:0; overflow:hidden; opacity:0;
  transition:max-height .35s ease, opacity .3s ease, margin .35s ease;
}
.t-card.open .t-prog { max-height:1100px; opacity:1; margin:16px 0 2px; }
/* картка простора — групи в дві колонки (і на планшеті, і на десктопі) */
@media(min-width:769px){
  .t-card.open .t-prog { display:grid; grid-template-columns:1fr 1fr; gap:0 26px; align-items:start; }
  .t-group { margin-bottom:14px; }
}
.t-group { margin-bottom:16px; }
.t-group:last-child { margin-bottom:0; }
.t-group-h {
  font-size:8px; font-weight:700; letter-spacing:2.5px; text-transform:uppercase;
  color:var(--red); margin-bottom:6px;
}
.t-item {
  font-size:13px; color:#aaa; padding:5px 0; line-height:1.5;
  display:flex; align-items:flex-start; gap:8px;
}
.t-item::before { content:'—'; color:#666; flex-shrink:0; }
.t-card-foot { border-top:1px solid #1a1a1a; padding-top:14px; }
.t-price-req { font-size:12px; color:#999; letter-spacing:.2px; }

/* ── WHY (white) ── */
.why { background:var(--white); padding:100px 56px; }
.why-head { text-align:center; margin-bottom:56px; }
.why-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:1px; background:var(--border); max-width:1400px; margin:0 auto; }
.why-card { background:var(--white); padding:40px 32px; position:relative; transition:background .25s; }
.why-card:hover { background:#fafaf8; }
.why-icon {
  width:38px; height:38px; margin-bottom:22px;
  color:var(--text); transition:color .3s, transform .35s cubic-bezier(.2,.6,.2,1);
}
.why-icon svg { width:100%; height:100%; display:block; stroke:currentColor; fill:none; stroke-width:1.4; stroke-linecap:round; stroke-linejoin:round; }
.why-card:hover .why-icon { color:var(--red); transform:translateY(-3px); }
.why-ttl {
  font-family:'Roboto Condensed', sans-serif; font-weight:700; font-size:18px;
  text-transform:uppercase; letter-spacing:.5px; color:var(--text);
  margin-bottom:10px; margin-top:8px;
}
.why-hr { width:24px; height:2px; background:var(--border); margin-bottom:16px; transition:background .3s, width .3s; }
.why-card:hover .why-hr { background:var(--red); width:40px; }
.why-txt { font-size:15px; line-height:1.75; color:var(--muted); }

/* ── CONTACT (black) ── */
.contact { background:var(--black); border-top:1px solid #1a1a1a; }
.contact-inner {
  display:grid; grid-template-columns:1fr 1fr;
  max-width:1212px; margin:0 auto; padding:0 56px; gap:0;
}
.contact-left { padding:80px 64px 80px 0; border-right:1px solid #1a1a1a; }
.contact-right { padding:80px 0 80px 64px; display:flex; flex-direction:column; }
.c-tag { font-size:9px; font-weight:700; letter-spacing:4px; color:var(--red); text-transform:uppercase; margin-bottom:16px; display:block; }
.c-h {
  font-family:'Roboto Condensed', sans-serif; font-weight:800;
  font-size:clamp(36px,4vw,56px); line-height:.92;
  text-transform:uppercase; color:#fff; margin-bottom:16px;
}
.c-h-sm { font-size:clamp(30px,3vw,48px); }
.ci-list { margin-top:36px; flex:1; display:flex; flex-direction:column; }
.c-p { font-size:15px; line-height:1.75; color:#aaa; margin-bottom:36px; max-width:380px; }
.cform { display:flex; flex-direction:column; gap:1px; background:#1a1a1a; }
.cf {
  flex:1; background:#000; display:flex; flex-direction:column;
  border-left:2px solid transparent; transition:border-color .25s;
}
.cf:focus-within { border-left-color:var(--red); }
.cf label {
  font-size:8px; font-weight:700; letter-spacing:2.5px; color:#666;
  text-transform:uppercase; padding:14px 18px 3px;
}
.cf input, .cf select, .cf textarea {
  background:transparent; border:none; outline:none;
  color:#fff; font-size:13px; font-family:'Inter',sans-serif;
  padding:3px 18px 14px; resize:none;
  width:100%; min-width:0;
}
.cf input::placeholder, .cf textarea::placeholder { color:#3a3a3a; }
.cf textarea { min-height:72px; }
.cfoot {
  background:#000; padding:16px 18px;
  display:flex; align-items:center; justify-content:space-between; gap:12px; flex-wrap:wrap;
}
.cnote { font-size:10px; color:#777; }
.ci-item {
  padding:20px 0; border-bottom:1px solid #1a1a1a;
  flex:1; display:flex; flex-direction:column; justify-content:center;
}
.ci-item:last-child { border-bottom:none; }
.ci-lbl { font-size:8px; font-weight:700; letter-spacing:3px; color:#777; text-transform:uppercase; margin-bottom:6px; }
.ci-val {
  font-family:'Roboto Condensed', sans-serif; font-size:20px;
  font-weight:600; color:#fff; letter-spacing:.3px;
}
.ci-val a { transition:color .2s; }
.ci-val a:hover { color:var(--red); }

/* ── FOOTER ── */
footer { background:var(--near-black); border-top:1px solid #1a1a1a; padding:44px 56px 0; }
.f-grid {
  display:grid; grid-template-columns:2fr 1fr 1fr; gap:40px;
  max-width:1400px; margin:0 auto; padding-bottom:34px;
}
.f-logo {
  font-family:'Roboto Condensed', sans-serif; font-size:18px;
  font-weight:800; letter-spacing:6px; color:#fff; text-transform:uppercase;
  margin-bottom:14px;
}
.f-logo em { font-style:normal; color:var(--red); }
.f-desc { font-size:13px; line-height:1.75; color:#777; max-width:320px; }
.f-h { font-size:9px; font-weight:700; letter-spacing:3px; color:#666; text-transform:uppercase; margin-bottom:16px; }
.f-col ul { list-style:none; display:flex; flex-direction:column; gap:10px; }
.f-col a { font-size:12px; color:#999; transition:color .2s; }
.f-col a:hover { color:#fff; }
.f-bottom {
  border-top:1px solid #1a1a1a; padding:18px 0;
  max-width:1400px; margin:0 auto;
  display:flex; align-items:center; justify-content:space-between; gap:16px; flex-wrap:wrap;
}
.f-copy { font-size:9px; letter-spacing:1px; color:#555; }
.f-badge {
  font-size:8px; font-weight:700; letter-spacing:2px; color:#777;
  border:1px solid #2a2a2a; padding:5px 10px; text-transform:uppercase;
}
.f-badge b { color:var(--red); }

/* ── RESPONSIVE ──
   Рівні: 1280 → 1024 → 900 → 860 → 768 → 600 → 480
   Плюс окремі правила для сенсорних екранів і горизонтальної орієнтації. */

/* ─ Виражена вертикальна орієнтація (планшет/телефон портретом):
     герой рахуємо по контенту, інакше половина екрана — порожнеча ─ */
@media(max-aspect-ratio:3/4){
  .hero { min-height:auto; }
}

/* ─ Сенсорні пристрої: керування галереї не має ховатись за :hover ─ */
@media(hover:none){
  .vc-nav, .vc-expand-btn, .vc-count { opacity:1; }
  .v-card-img { cursor:default; }
}

/* ─ Компактний десктоп ≤1280 ─ */
@media(max-width:1280px){
  nav { padding:0 40px; }
  .hero { padding:80px 40px 130px 72px; }
  .feature { padding:72px 40px; }
  .vehicles { padding:72px 40px; }
  .why, .training { padding:76px 40px; }
  .contact-inner { padding:0 40px; }
  footer { padding:40px 40px 0; }
}

/* ─ Планшет-ландшафт ≤1024: посилання ще вміщаються, сітки лишаються ─ */
@media(max-width:1024px){
  nav { padding:0 28px; gap:22px; }
  .nav-links { gap:22px; }
  .nav-phone { display:none; }

  /* герой стає центрованим — градієнт теж має бути вертикальним */
  .hero {
    background-image:linear-gradient(rgba(0,0,0,.82) 0%, rgba(0,0,0,.6) 100%), url('assets/img/main.webp');
    align-items:center; padding:110px 40px 116px;
  }
  /* на планшеті екран великий — текст рахуємо від ширини щедріше,
     інакше на високому вертикальному екрані він виглядає дрібним */
  .hero-text { text-align:center; max-width:760px; }
  .hero-h1 { font-size:clamp(46px, 7vw, 74px); line-height:1.04; }
  .hero-eyebrow { justify-content:center; font-size:11px; }
  .hero-sub { margin:26px auto 38px; font-size:16px; max-width:520px; }
  .hero-btns { justify-content:center; }
  .btn-white, .btn-outline-w { padding:15px 34px; font-size:11px; }
  .hs-n { font-size:30px; }
  .hs-l { font-size:10px; }

  .sec-h { font-size:clamp(34px, 4.6vw, 50px); }
  .sec-p { font-size:16px; }
  .feat-h { font-size:clamp(44px, 6.4vw, 68px); }
  .feat-p { font-size:16px; }
  .training-h { font-size:clamp(42px, 6vw, 64px); }
  .training-p { font-size:15px; }
  .c-h { font-size:clamp(38px, 5vw, 54px); }
  .hs { padding:16px 14px; }

  .feature { padding:64px 40px; }
  .vehicles { padding:64px 32px; }
  .why, .training { padding:64px 32px; }
  .why-grid { grid-template-columns:1fr 1fr; }
  /* колонка фото вужча — мініатюри мають влазити в ряд */
  .vc-thumb { width:66px; height:46px; }
  /* курс один — на планшеті йому краще на всю ширину, ніж у вузькій колонці */
  .training-inner { grid-template-columns:1fr; gap:36px; }
  .training-h br { display:none; }
  .contact-inner { padding:0 32px; }
  .contact-left { padding:64px 40px 64px 0; }
  .contact-right { padding:64px 0 64px 40px; }
  footer { padding:40px 32px 0; }
}

/* ─ Планшет ≤900: бургер, одноколонкові секції ─ */
@media(max-width:900px){
  .nav-links { display:none; }
  .burger { display:flex; }

  .contact-inner { grid-template-columns:1fr; padding:0; }
  .contact-left { padding:56px 32px; border-right:none; border-bottom:1px solid #1a1a1a; }
  .contact-right { padding:48px 32px 56px; }

  .f-grid { grid-template-columns:1fr 1fr; gap:26px; }
  .f-grid .f-col:first-child { grid-column:1/-1; }
}

/* ─ Картка авто складається ≤860 (нижче колонка характеристик тісна) ─ */
@media(max-width:860px){
  .v-card { grid-template-columns:1fr; grid-template-rows:clamp(300px, 46vw, 460px) auto auto; }
  .v-card-img { grid-column:1; grid-row:1; }
  .v-card-body { grid-column:1; grid-row:2; border-left:none; border-top:1px solid #d0d0ce; }
  .v-card-foot { grid-column:1; grid-row:3; border-left:none; }
  .v-option { padding:10px 24px; }
  .v-card-foot-btn { padding:14px 24px; }
  /* картка на всю ширину — мініатюрам знову є місце */
  .vc-thumb { width:78px; height:54px; }
}

/* ─ Планшет-портрет ≤768 ─ */
@media(max-width:768px){
  .hero { padding:100px 24px 120px; min-height:auto; }
  .hero-sub { margin:22px auto 30px; }
  .hs { padding:14px 10px; }

  .feature { padding:52px 24px; }
  .feat-h { font-size:clamp(32px, 6.5vw, 46px); }
  .feat-p { font-size:15px; margin-bottom:26px; }
  .feat-h br, .c-h br { display:none; }
  .feat-point { padding:20px 12px; }
  .fp-d { font-size:11.5px; }

  .sec-h { font-size:clamp(30px, 6vw, 42px); }
  .sec-p { font-size:14px; }

  .vehicles { padding:52px 24px; }
  .vehicles-head { margin-bottom:28px; }
  .vc-thumb { width:64px; height:46px; }

  .why, .training { padding:52px 24px; }
  .why-head { margin-bottom:30px; }
  .why-card { padding:28px 22px; }

  .training-h { font-size:clamp(32px, 6.5vw, 44px); margin-bottom:14px; }
  .training-p { font-size:14px; margin-bottom:24px; }
  .t-card { padding:22px 20px 18px; }

  .contact-left { padding:48px 24px; }
  .contact-right { padding:40px 24px 48px; }
  /* 16px — інакше iOS зумить сторінку при фокусі */
  .cf input, .cf textarea { font-size:16px; -webkit-user-select:text; user-select:text; }
  .cf textarea { min-height:64px; }

  footer { padding:36px 24px 0; }

  /* модалка по висоті фото, а не на весь екран — і вужча,
     щоб з боків лишалось місце для стрілок (як на ПК) на темному тлі */
  .vc-lb-modal {
    width:calc(100vw - 84px); height:auto;
    max-height:calc(100vh - 150px);
    padding:34px 14px 18px;
  }
  .vc-lb-img { max-height:calc(100vh - 210px); width:auto; cursor:pointer; }
  .vc-lb-prev, .vc-lb-next { font-size:34px; padding:8px 10px; }
  .vc-lb-prev { left:6px; }
  .vc-lb-next { right:6px; }
}

/* ─ Великий телефон ≤600: тут починається справді мобільна подача ─ */
@media(max-width:600px){
  .hero { padding:96px 20px 104px; }
  .hs { padding:12px 10px; }
  .hs-n { font-size:20px; }

  .feature { padding:40px 20px; }
  .feat-h { font-size:clamp(30px, 7.5vw, 42px); }
  .feat-p { font-size:14px; margin-bottom:24px; }
  .feat-points { gap:1px; }
  .feat-point { padding:16px 8px; gap:7px; }
  .fp-ic { width:22px; height:22px; }
  .fp-t { font-size:11px; letter-spacing:.3px; }
  .fp-d { display:none; }

  .sec-h { font-size:clamp(28px, 7vw, 38px); }
  .sec-p { font-size:13.5px; }

  .vehicles { padding:44px 20px; }
  .vehicles-head { margin-bottom:24px; }

  /* «Чому» — акордеон замість карток */
  .why { padding:44px 20px; }
  .why-head { margin-bottom:26px; }
  .why-grid { grid-template-columns:1fr; }
  .why-card {
    display:grid; grid-template-columns:24px 1fr 12px; column-gap:14px;
    align-items:center; padding:15px 16px; cursor:pointer;
    touch-action:manipulation; user-select:none; -webkit-user-select:none;
    -webkit-tap-highlight-color:transparent;
  }
  .why-icon { grid-column:1; grid-row:1; width:22px; height:22px; margin:0; }
  .why-hr { display:none; }
  .why-ttl { grid-column:2; grid-row:1; font-size:14px; margin:0; }
  .why-card::after {
    content:''; grid-column:3; grid-row:1; justify-self:center;
    width:7px; height:7px; margin-top:-4px;
    border-right:1.5px solid #999; border-bottom:1.5px solid #999;
    transform:rotate(45deg); transition:transform .25s, border-color .25s;
  }
  .why-card.open::after { transform:rotate(225deg); margin-top:4px; border-color:var(--red); }
  .why-card.open .why-icon { color:var(--red); }
  .why-txt {
    grid-column:2 / 4; grid-row:2;
    max-height:0; overflow:hidden; opacity:0;
    font-size:13px; line-height:1.6;
    transition:max-height .3s ease, opacity .25s ease, margin-top .3s ease;
  }
  .why-card.open .why-txt { max-height:160px; opacity:1; margin-top:8px; }

  .training { padding:44px 20px; }
  .training-inner { gap:26px; }
  .training-h { font-size:clamp(30px, 7.5vw, 40px); margin-bottom:12px; }
  .training-p { font-size:13px; margin-bottom:20px; }
  .t-card { padding:18px 16px 14px; }
  .t-card-name { font-size:17px; margin-bottom:10px; }
  .t-item { font-size:12.5px; padding:6px 0; }
  .t-card-foot { padding-top:10px; }

  /* контакти — обидва блоки з однаковими відступами */
  .contact-left { padding:36px 20px; }
  .contact-right { padding:36px 20px; }
  .c-p { font-size:14px; margin-bottom:16px; }
  .cfoot .btn-white { padding:11px 18px; font-size:9px; letter-spacing:2px; }
  .cf textarea { min-height:56px; }
  .contact-right .c-tag { display:none; }
  .c-h-sm { font-size:20px; margin-bottom:0; }
  .ci-list { margin-top:16px; }
  .ci-item { flex-direction:row; justify-content:space-between; align-items:baseline; gap:14px; padding:20px 0; }
  .ci-lbl { margin-bottom:0; font-size:9px; letter-spacing:2px; flex-shrink:0; }
  .ci-val { font-size:19px; text-align:right; }

  /* компактний футер */
  footer { padding:24px 20px 0; }
  .f-grid { grid-template-columns:1fr; gap:12px; padding-bottom:16px; }
  .f-desc { display:none; }
  .f-logo { margin-bottom:0; font-size:16px; }
  .f-h { display:none; }
  .f-col ul { flex-direction:row; flex-wrap:wrap; gap:6px 18px; }
  .f-col a { font-size:11px; }
  .f-bottom { padding:12px 0 14px; }
}

/* ─ Телефон ≤480 ─ */
@media(max-width:480px){
  nav { height:52px; padding:0 16px; gap:12px; }
  .nav-logo-main { font-size:16px; letter-spacing:4px; }
  .nav-logo-sub { font-size:6.5px; letter-spacing:2.5px; }
  .lang-sw button, .lang-sw a { padding:4px 9px; }
  .m-menu { top:52px; }

  .hero { padding:80px 20px 108px; }
  .hero-eyebrow { font-size:9px; letter-spacing:2.5px; gap:8px; }
  .hero-eyebrow::before { width:16px; }
  .hs { padding:12px; }
  .hs-l { font-size:8px; letter-spacing:2px; }
  .hero-h1 { font-size:clamp(32px, 9vw, 50px); line-height:1.05; }
  .hero-btns { flex-direction:column; align-items:stretch; }
  .btn-white, .btn-outline-w { justify-content:center; padding:14px 20px; }

  /* компактна картка авто — щоб влазила в екран */
  .v-card { grid-template-rows:250px auto auto; }
  .vc-thumb { width:40px; height:29px; }
  .vc-thumbs { padding:5px 8px; gap:4px; }
  .vc-count { bottom:46px; left:12px; padding:0; }
  .vc-expand-btn { bottom:44px; width:26px; height:26px; }
  .v-card-body { padding:16px 16px 12px; }
  .v-card-name { font-size:27px; }
  .vc-swatches { margin:10px 0 14px; }
  .vc-swatch { width:26px; height:26px; }

  /* характеристики — рівні рядки з крупнішим текстом */
  .v-spec { padding:7px 0; gap:12px; align-items:center; }
  .v-spec-l { font-size:9px; letter-spacing:1.2px; }
  .v-spec-v { font-size:14px; text-align:right; }

  /* ціна — великим числом */
  .v-opt-head { padding:7px 16px 5px; }
  .v-option { padding:4px 16px; }
  .v-option-p { font-size:20px; }
  .v-option-sub { font-size:12px; }
  .v-option-l { font-size:9.5px; }
  .v-option-addon .v-option-req { font-size:12px; }

  /* кнопка на всю ширину */
  .v-card-foot-btn { padding:12px 16px; }
  .v-card-foot-btn .rent-btn { width:100%; text-align:center; padding:13px 10px; font-size:9.5px; }

  .vc-lb-modal { padding:32px 10px 16px; }
}

/* ─ Телефон у горизонтальній орієнтації: герой не має займати 100vh ─ */
@media(max-height:520px) and (orientation:landscape){
  .hero { min-height:auto; padding:84px 32px 96px; }
  .hs { padding:10px 8px; }
  .hs-n { font-size:19px; }
  .vc-lb-modal { max-height:calc(100vh - 60px); padding:26px 12px 14px; }
  .vc-lb-img { max-height:calc(100vh - 110px); }
  .vc-lb-prev, .vc-lb-next { bottom:auto; top:50%; transform:translateY(-50%); font-size:32px; }
  .vc-lb-prev { left:4px; right:auto; }
  .vc-lb-next { right:4px; }
}

/* ─ Ноутбук: широкий, але невисокий екран (1366×768, 1440×900 тощо) —
     десктопні відступи/шрифти розраховані на високі монітори і не влазять ─ */
@media(min-width:901px) and (max-height:900px){
  .feature { padding:56px 40px; }
  .vehicles { padding:56px 64px; }
  .why, .training { padding:56px 40px; }
  .vehicles-head, .why-head { margin-bottom:32px; }
  .sec-h { font-size:clamp(30px, 3.4vw, 44px); }
  .sec-p { font-size:14px; margin-top:10px; }
  .feat-h { font-size:clamp(32px, 3.8vw, 48px); }
  .feat-p { font-size:14px; margin-bottom:28px; }
  .why-card { padding:28px 24px; }
  .why-icon { width:30px; height:30px; margin-bottom:14px; }
  .why-hr { margin-bottom:12px; }
  .why-ttl { font-size:16px; margin-bottom:8px; }
  .why-txt { font-size:13.5px; line-height:1.65; }
  .training-h { font-size:clamp(32px, 4vw, 50px); margin-bottom:16px; }
  .training-p { font-size:13.5px; margin-bottom:26px; }
  .t-card { padding:22px 24px 18px; }
}

@media (prefers-reduced-motion: reduce){
  html { scroll-behavior:auto; }
  *, *::before, *::after { animation:none !important; transition:none !important; }
  .reveal { opacity:1; transform:none; }
}