/* ═══ responsive.css ═══ */
@media(max-width:1024px){
  nav{width:calc(100% - 48px)}
  .ct-g{gap:40px}
  .fl-g{grid-template-columns:repeat(2,1fr)}
  #fleet-normal{padding:80px 32px 60px}
  #big-text{font-size:clamp(32px,5vw,62px)}
}

/* ── TABLET 768px ── */
@media(max-width:768px){
  nav{width:calc(100% - 24px);padding:10px 14px;top:12px}
  .nav-logo img{height:32px}
  .nav-links{display:none}

  /* Scroll container */
  #scroll-container{height:250vh}

  /* Hero text */
  #big-text{
    position:absolute;top:14vh;left:0;right:0;
    padding:0 5vw;
    font-size:clamp(30px,7.5vw,52px);
    line-height:1.08;
    text-shadow:0 2px 16px rgba(0,0,0,.9);
  }

  /* Truck */
  #truck-img{width:100%;bottom:-2%}
  #truck-wrap{height:55%}

  /* Ticker */
  .ticker-tr span{font-size:14px;padding:0 20px}

  /* Features split */
  #features{flex-direction:column;overflow:hidden}
  .fl{
    width:100%;
    height:100%;
    padding:56px 20px 12px;
    box-sizing:border-box;
    justify-content:space-evenly;
    overflow:hidden;
  }
  .fl .feat-item{padding:6px 0 6px 14px;flex-shrink:1}
  .fl .f-title{font-size:14px;line-height:1.2}
  .fl .f-num{font-size:9px;margin-bottom:2px}
  .fr{display:none}

  /* Fleet */
  .fl-g{grid-template-columns:1fr}
  #fleet-normal{padding:80px 16px 48px}
  .fc{padding:18px 16px}
  .fc-nm{font-size:18px}

  /* Fleet accordion */
  .acc-body{grid-template-columns:1fr}
  .acc-title{font-size:18px}
  .acc-header{padding-right:60px}

  /* Contact */
  .ct-g{grid-template-columns:1fr;gap:20px;padding:0}
  #contact-sec{padding:80px 16px 16px;align-items:flex-start;overflow-y:auto}
  .ct-h{font-size:clamp(26px,6vw,38px)}
  .cf{padding:20px 16px}

  /* Social buttons */
  #social-btns{bottom:16px !important;right:12px !important;gap:8px !important}
  #social-btns a{padding:8px !important;width:40px !important;height:40px !important;border-radius:50% !important;justify-content:center !important;box-sizing:border-box !important}
  #social-btns a span{display:none !important}
  #social-btns svg{width:20px !important;height:20px !important;flex-shrink:0}

  /* Contact bottom padding */
  #contact-sec{padding-bottom:80px !important}
  .ct-g{padding-bottom:60px}

  /* Cursor ring hidden on touch */
  #cur-dot,#cur-ring{display:none}
  *{cursor:auto!important}
}

/* ── MOBILE 480px ── */
@media(max-width:480px){
  nav{width:calc(100% - 16px);padding:9px 12px;top:8px;border-radius:8px}
  .nav-logo img{height:28px}
  .nav-cta{padding:7px 14px;font-size:10px}

  #big-text{
    top:12vh;
    font-size:clamp(26px,8vw,42px);
    padding:0 4vw;
  }

  #truck-img{width:110%}

  /* Features — ещё компактнее */
  .fl{padding:48px 16px 10px}
  .fl .feat-item{padding:4px 0 4px 12px}
  .fl .f-title{font-size:13px}

  .fl-g{grid-template-columns:1fr}
  #fleet-normal{padding:72px 12px 40px}
  .acc-header{padding-right:64px}

  .ct-g{gap:16px}
  .cf{padding:16px 12px}
  .fg-2{grid-template-columns:1fr}

  /* Social buttons */
  #social-btns{bottom:16px !important;right:8px !important}
  #social-btns a{padding:8px !important;width:40px !important;height:40px !important;border-radius:50% !important;justify-content:center !important;box-sizing:border-box !important}
  #social-btns a span{display:none !important}
  #social-btns svg{width:20px !important;height:20px !important;flex-shrink:0}

  .hb-num{font-size:36px}
  .hb-lbl{font-size:8px}
  .hb-item{padding:18px 12px}
}

/* ── SMALL MOBILE 360px ── */
@media(max-width:360px){
  .hb-item{padding:14px 8px}
  .hb-num{font-size:30px}
  nav{top:6px}
  #big-text{font-size:22px}
  .acc-header{padding-right:56px}

  /* Features — минимальный размер */
  .fl{padding:44px 12px 8px}
  .fl .feat-item{padding:3px 0 3px 10px}
  .fl .f-title{font-size:12px}
}

@media(max-width:480px){
  #big-text .tagline{
    font-size:9px !important;
    letter-spacing:3px;
    white-space:nowrap;
    overflow:hidden;
    text-overflow:ellipsis;
  }
}

/* ── FLUID RESPONSIVE SYSTEM ── */
:root {
  --fluid-min-w: 320;
  --fluid-max-w: 1440;
}

html { font-size: clamp(13px, 1.1vw, 16px); }

.acc-header { padding: clamp(14px,2vw,26px) clamp(16px,2.5vw,32px); }
.acc-meta { font-size: clamp(12px,1.3vw,17px); }

.fc { padding-top: clamp(16px,1.8vw,26px); padding-bottom: clamp(16px,1.8vw,26px); padding-left: clamp(16px,1.8vw,26px); }
.fc-nm { font-size: clamp(16px,1.6vw,24px); }
.fc-sr { font-size: clamp(11px,1vw,13px); padding: clamp(4px,.5vw,7px) 0; }
.fc-sk { font-size: clamp(10px,.9vw,12px); }

.ct-h { font-size: clamp(24px,3.5vw,46px) !important; }
.cf-h { font-size: clamp(20px,2.2vw,28px); }
.ct-lbl { font-size: clamp(8px,.7vw,10px); }
.ct-val { font-size: clamp(11px,1vw,13px); }
.ct-item { padding: clamp(6px,.7vw,10px) 0; gap: clamp(10px,1.2vw,16px); }
.fg input, .fg select, .fg textarea {
  padding: clamp(6px,.8vw,10px) clamp(8px,1vw,13px);
  font-size: clamp(11px,1vw,13px);
}
.fg textarea { min-height: clamp(44px,5vh,60px); }
.btn-sub { padding: clamp(9px,1vw,13px); font-size: clamp(9px,.9vw,11px); }

nav { padding: clamp(8px,.8vw,14px) clamp(16px,2vw,32px); }
.nav-logo img { height: clamp(28px,3vw,44px); }
.nav-links a { font-size: clamp(10px,.9vw,13px); gap: clamp(16px,2vw,32px); }
.nav-cta { padding: clamp(7px,.7vw,11px) clamp(14px,1.5vw,22px); font-size: clamp(9px,.9vw,12px); }

.fl-tag { font-size: clamp(10px,1vw,15px); }
.fl-h { font-size: clamp(36px,4.5vw,72px) !important; }

.hb-num { font-size: clamp(32px,3.5vw,56px); }
.hb-lbl { font-size: clamp(8px,.8vw,11px); }
.hb-item { padding: clamp(16px,2vw,28px) clamp(20px,2.5vw,40px); }

#contact-sec .ct-tag,
#contact-sec .ct-lbl {
  color: #222 !important;
}

html { scroll-behavior: smooth; }
* { -webkit-overflow-scrolling: touch; }

/* ── FLEET cards: clearance for fixed social buttons ── */
@media(max-width:768px){
  .fc { padding-right: 60px !important; }
}
@media(max-width:480px){
  .fc { padding-right: 56px !important; }
}
@media(max-width:360px){
  .fc { padding-right: 52px !important; }
}