/* ============ Zelik Autotrans — landing ============ */
:root{
  --primary:#691C1C;
  --primary-deep:#4f1414;
  --ink:#1A1413;
  --ink-soft:#5b524f;
  --bg:#ffffff;
  --bg-soft:#f6f2f0;
  --line:rgba(26,20,19,.12);
  --line-strong:rgba(26,20,19,.22);
  --font-display:'Manrope', system-ui, sans-serif;
  --font-body:'Manrope', system-ui, sans-serif;
  --gut: clamp(16px, 4vw, 96px);
  --gut-left: clamp(78px, 8vw, 130px);
  --laneX: clamp(40px, 4.5vw, 70px);
  --maxw: 1280px;
  --radius: 0px;
}

*{ box-sizing:border-box; }
html{ scroll-behavior:smooth; -webkit-text-size-adjust:100%; }
body{
  margin:0;
  background:var(--bg);
  color:var(--ink);
  font-family:var(--font-body);
  font-weight:500;
  line-height:1.5;
  -webkit-font-smoothing:antialiased;
  text-rendering:optimizeLegibility;
  overflow-x:hidden;
}
::selection{ background:var(--primary); color:#fff; }
a{ color:inherit; text-decoration:none; }
button{ font-family:inherit; cursor:pointer; }

.wrap{ width:100%; max-width:var(--maxw); margin:0 auto; padding-left:var(--gut); padding-right:var(--gut); }
/* sections with the cargo rail get extra left padding so boxes don't overlap content */
#services .wrap, #pains .wrap, #advantages .wrap, #how .wrap, #instagram .wrap{ padding-left:var(--gut-left); }
/* form section: slightly larger symmetric padding on mobile for breathing room */
@media (max-width:560px){ #zayavka .wrap{ padding-left:22px; padding-right:22px; } }

/* ---------- typography ---------- */
.eyebrow{
  font-weight:800; font-size:clamp(11px,1vw,13px); letter-spacing:.22em;
  text-transform:uppercase; color:var(--primary);
  display:inline-flex; align-items:center; gap:.7em;
}
.eyebrow::before{ content:""; width:34px; height:2px; background:var(--primary); display:inline-block; }
.eyebrow.no-bar::before{ display:none; }

h1,h2,h3{ font-family:var(--font-display); font-weight:800; letter-spacing:-.03em; line-height:.94; margin:0; }
.display{ font-size:clamp(48px, 9.4vw, 180px); white-space:nowrap; line-height:.92; }
.h2{ font-size:clamp(38px, 6.5vw, 104px); }
.h3{ font-size:clamp(26px, 3.4vw, 52px); letter-spacing:-.02em; }
.lead{ font-size:clamp(17px,1.5vw,22px); line-height:1.45; color:var(--ink-soft); max-width:46ch; }

/* ---------- buttons ---------- */
.btn{
  display:inline-flex; align-items:center; gap:.7em; justify-content:center;
  font-weight:800; font-size:clamp(15px,1.1vw,18px); letter-spacing:-.01em; white-space:nowrap;
  padding:1.05em 1.6em; border:2px solid var(--primary); border-radius:var(--radius);
  background:var(--primary); color:#fff; transition:transform .18s cubic-bezier(.2,.7,.2,1), background .2s, color .2s, box-shadow .2s;
  position:relative; overflow:hidden;
}
.btn:hover{ background:var(--primary-deep); border-color:var(--primary-deep); transform:translateY(-3px); box-shadow:0 16px 40px -16px rgba(105,28,28,.6); }
.btn:active{ transform:translateY(-1px); }
.btn .arrow{ transition:transform .22s cubic-bezier(.2,.7,.2,1); }
.btn:hover .arrow{ transform:translateX(5px); }
.btn--ghost{ background:transparent; color:var(--primary); }
.btn--ghost:hover{ background:var(--primary); color:#fff; border-color:var(--primary); }
.btn--lg{ padding:1.25em 2em; }

/* ---------- header ---------- */
.site-head{
  position:fixed; inset:0 0 auto 0; z-index:60;
  display:flex; align-items:center; justify-content:space-between;
  padding:18px var(--gut); transition:background .3s, box-shadow .3s, padding .3s;
}
.site-head.scrolled{ background:rgba(255,255,255,.86); backdrop-filter:blur(14px); box-shadow:0 1px 0 var(--line); padding-top:12px; padding-bottom:12px; }
.brand{ display:flex; align-items:center; gap:12px; flex:none; }
.brand-logo{ height:72px; width:auto; display:block; transition:height .35s cubic-bezier(.2,.7,.2,1); }
.site-head.scrolled .brand-logo{ height:52px; }
@media (max-width:520px){ .brand-logo{ height:60px; } .site-head.scrolled .brand-logo{ height:46px; } }

.nav-desktop{ display:flex; gap:clamp(16px,2vw,30px); align-items:center; }
.nav-desktop a{ font-weight:700; font-size:15px; color:var(--ink); position:relative; padding:4px 0; }
.nav-desktop a::after{ content:""; position:absolute; left:0; bottom:-2px; width:0; height:2px; background:var(--primary); transition:width .25s; }
.nav-desktop a:hover{ color:var(--primary); } .nav-desktop a:hover::after{ width:100%; }

.head-actions{ display:flex; align-items:center; gap:clamp(10px,1.4vw,18px); }
.head-phone{ font-weight:800; letter-spacing:-.01em; font-size:16px; white-space:nowrap; }
.head-phone:hover{ color:var(--primary); }
.head-cta{ padding:.72em 1.1em; font-size:14px; }

/* language switch */
.lang{ position:relative; }
.lang-btn{ display:inline-flex; align-items:center; gap:6px; background:transparent; border:2px solid var(--line-strong); border-radius:var(--radius); padding:8px 10px; font-weight:800; font-size:13px; letter-spacing:.04em; color:var(--ink); transition:border-color .2s,color .2s; }
.lang-btn:hover{ border-color:var(--primary); color:var(--primary); }
.lang-globe{ font-size:13px; opacity:.6; }
.lang-caret{ font-size:9px; transition:transform .2s; }
.lang-caret.up{ transform:rotate(180deg); }
.lang-menu{ position:absolute; right:0; top:calc(100% + 8px); background:#fff; border:2px solid var(--ink); display:flex; flex-direction:column; min-width:84px; box-shadow:0 18px 40px -20px rgba(26,20,19,.5); z-index:80; }
.lang-item{ background:transparent; border:none; text-align:left; padding:11px 16px; font-weight:800; font-size:13px; letter-spacing:.06em; color:var(--ink); }
.lang-item:hover{ background:var(--bg-soft); }
.lang-item.on{ color:var(--primary); }
.lang--block{ width:100%; }
.lang--block .lang-btn{ width:100%; justify-content:center; padding:15px; font-size:15px; }
.lang--block .lang-menu{ right:auto; left:0; width:100%; bottom:calc(100% + 8px); top:auto; }

/* hamburger */
.burger{ display:none; width:44px; height:44px; border:2px solid var(--ink); background:transparent; padding:0; position:relative; flex:none; }
.burger span{ position:absolute; left:9px; right:9px; height:2px; background:var(--ink); transition:transform .3s, opacity .2s; }
.burger span:nth-child(1){ top:13px; } .burger span:nth-child(2){ top:20px; } .burger span:nth-child(3){ top:27px; }
.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); }

/* mobile menu overlay */
.mobile-menu{ position:fixed; inset:0; background:#ffffff; z-index:55; padding:96px var(--gut) 36px; display:flex; flex-direction:column; justify-content:space-between; transform:translateX(100%); transition:transform .4s cubic-bezier(.4,0,.2,1); visibility:hidden; }
.mobile-menu.open{ transform:none; visibility:visible; background:#ffffff; }
.mm-close{ position:absolute; top:18px; right:var(--gut); width:46px; height:46px; border:2px solid var(--ink); background:#fff; color:var(--ink); padding:0; display:grid; place-items:center; cursor:pointer; transition:background .2s,color .2s; }
.mm-close:hover{ background:var(--ink); color:#fff; }
.mobile-menu nav{ display:flex; flex-direction:column; }
.mobile-menu nav a{ font-family:var(--font-display); font-weight:800; font-size:clamp(28px,8vw,44px); letter-spacing:-.02em; color:var(--ink); padding:14px 0; border-bottom:1px solid var(--line); opacity:0; transform:translateX(22px); transition:opacity .4s, transform .4s, color .2s; }
.mobile-menu.open nav a{ opacity:1; transform:none; }
.mobile-menu nav a:hover{ color:var(--primary); }
.mobile-menu-foot{ display:flex; flex-direction:column; gap:16px; }
.mobile-menu-foot .btn{ width:100%; }
.mobile-phone{ font-weight:800; font-size:22px; text-align:center; }

@media (min-width:1041px){ .mobile-menu{ display:none; } }
@media (max-width:1040px){ .nav-desktop{ display:none; } .head-cta{ display:none; } .burger{ display:block; } }
@media (max-width:720px){ .head-phone{ display:none; } }

/* ---------- per-block cargo rails ---------- */
.rails{ position:absolute; top:0; left:0; width:100%; height:0; z-index:38; pointer-events:none; }
.block-rail{ position:absolute; left:var(--laneX); width:44px; transform:translateX(-50%); }
.rail-track{ position:absolute; left:50%; top:0; bottom:0; width:2px; transform:translateX(-50%); background:var(--line); }
.rail-fill{ position:absolute; left:50%; top:0; width:2px; transform:translateX(-50%); background:var(--primary); height:0; }
.rail-stack{ position:absolute; left:0; top:0; width:44px; }
.rbox{ position:absolute; left:0; width:44px; height:44px; transition:transform .7s cubic-bezier(.4,0,.2,1), opacity .55s; }
.rbox img{ width:100%; height:100%; display:block; filter:drop-shadow(0 6px 7px rgba(26,20,19,.42)) drop-shadow(0 0 1.5px rgba(255,255,255,.85)); }
/* at the form: boxes fly into the van */
.block-rail[data-fly="true"] .rbox{ transform:translate(var(--tx,120px), var(--ty,260px)) scale(.3) rotate(8deg); opacity:0; transition-delay:calc(var(--i) * .12s); }

/* ---------- reveal (progressive enhancement: hidden only when JS adds .pre) ---------- */
.reveal{ transition:opacity .8s cubic-bezier(.2,.7,.2,1), transform .8s cubic-bezier(.2,.7,.2,1); }
.reveal.pre{ opacity:0; transform:translateY(34px); }
.reveal.d1{ transition-delay:.08s; } .reveal.d2{ transition-delay:.16s; }
.reveal.d3{ transition-delay:.24s; } .reveal.d4{ transition-delay:.32s; }

/* ---------- hero ---------- */
.hero{ position:relative; padding-top:clamp(150px,18vh,230px); padding-bottom:clamp(60px,9vh,120px); }
.hero .display .accent{ color:var(--primary); }
/* Two independent panels: title hugs left, side hugs right — never overlap, scale together */
.hero-grid{ display:flex; justify-content:space-between; align-items:flex-end; gap:clamp(24px,3vw,80px); flex-wrap:wrap; }
.hero-grid > *{ min-width:0; }
.hero-left{ flex:1 1 auto; min-width:0; }
.hero-right{ flex:0 0 clamp(260px, 28vw, 380px); min-width:260px; }
@media (max-width:760px){
  .hero-grid{ flex-direction:column; align-items:stretch; gap:36px; }
  .hero-right{ flex:none; width:100%; }
}
.display{ font-size:clamp(56px, 11vw, 220px); white-space:nowrap; line-height:.92; margin-top:14px; }
.display .line{ display:block; }
html[lang="pl"] .hero .display{ font-size:clamp(44px, 9vw, 180px); }
html[lang="ru"] .hero .display{ font-size:clamp(50px, 9.8vw, 190px); }
.hero-cta{ display:flex; flex-wrap:wrap; gap:14px; margin-top:38px; }
.hero-side, .hero-right{ border-top:2px solid var(--ink); padding-top:20px; }
.hero-side .lead, .hero-right .lead{ margin:0 0 26px; }
.hero-meta{ display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:16px clamp(10px,1.4vw,20px); }
.hero-meta div{ display:flex; flex-direction:column; min-width:0; }
.hero-meta b{ font-family:var(--font-display); font-size:clamp(20px,2vw,34px); font-weight:800; letter-spacing:-.04em; line-height:1; white-space:nowrap; }
.hero-meta span{ font-size:clamp(10px,.95vw,12.5px); color:var(--ink-soft); font-weight:600; margin-top:7px; line-height:1.22; overflow-wrap:anywhere; }
@media (max-width:1100px) and (min-width:881px){ .hero-meta b{ font-size:clamp(18px,1.9vw,26px); } }

/* moving strip */
.strip{ border-top:2px solid var(--ink); border-bottom:2px solid var(--ink); overflow:hidden; margin-top:clamp(50px,7vh,90px); padding:18px 0; background:var(--ink); color:#fff; }
.strip-track{ display:inline-flex; gap:40px; white-space:nowrap; animation:marquee 26s linear infinite; will-change:transform; }
.strip-track span{ font-family:var(--font-display); font-weight:800; font-size:clamp(20px,2.4vw,34px); letter-spacing:-.02em; display:inline-flex; align-items:center; gap:40px; }
.strip-track span::after{ content:""; width:11px; height:11px; border-radius:50%; background:var(--primary); display:inline-block; }
@keyframes marquee{ to{ transform:translateX(-50%); } }

/* ---------- section frame ---------- */
section.block{ position:relative; padding:clamp(70px,11vh,150px) 0; }
.sec-head{ display:flex; align-items:flex-end; justify-content:space-between; gap:30px; margin-bottom:clamp(40px,6vh,76px); flex-wrap:wrap; }
.sec-index{ font-family:var(--font-display); font-weight:800; font-size:clamp(13px,1.1vw,15px); color:var(--primary); letter-spacing:.1em; }

/* ---------- services ---------- */
.services{ display:grid; grid-template-columns:repeat(3,1fr); border-top:2px solid var(--ink); }
@media (max-width:860px){ .services{ grid-template-columns:1fr; } }
.svc{ position:relative; display:flex; flex-direction:column; padding:clamp(28px,3vw,46px) clamp(22px,2.4vw,40px); border-bottom:2px solid var(--ink); border-right:2px solid var(--ink); transition:background .25s; }
.svc:last-child{ border-right:none; }
@media (max-width:860px){ .svc{ border-right:none; } }
.svc-num{ font-family:var(--font-display); font-weight:800; font-size:15px; color:var(--primary); margin-bottom:clamp(34px,5vw,72px); }
.svc-body{ display:flex; flex-direction:column; flex:1; }
.svc-body h3{ margin:0 0 .45em; transition:color .25s; }
.svc-body p{ margin:0; color:var(--ink-soft); font-size:16px; flex:1; }
.svc-link{ display:inline-flex; align-items:center; gap:.5em; margin-top:22px; font-weight:800; font-size:14px; color:var(--primary); }
.svc:hover{ background:var(--bg-soft); }
.svc:hover .svc-body h3{ color:var(--primary); }
.svc:hover .svc-link .arrow{ transform:translateX(5px); }

/* ---------- pains (Q&A) ---------- */
.pains{ background:var(--bg-soft); }
.pains .accent{ color:var(--primary); }
.qa-list{ display:grid; border-top:2px solid var(--ink); }
.qa{ display:flex; gap:clamp(18px,3vw,40px); padding:clamp(28px,4vw,52px) 0; border-bottom:2px solid var(--ink); align-items:flex-start; }
.qa-mark{ flex:none; width:clamp(46px,5vw,66px); height:clamp(46px,5vw,66px); border:2px solid var(--primary); color:var(--primary); border-radius:50%; display:grid; place-items:center; font-family:var(--font-display); font-weight:800; font-size:clamp(22px,2.4vw,32px); }
.qa-q{ font-family:var(--font-display); font-weight:800; font-size:clamp(21px,2.6vw,38px); letter-spacing:-.02em; margin:0 0 .35em; line-height:1; }
.qa-a{ margin:0; color:var(--ink-soft); font-size:clamp(15px,1.3vw,18px); max-width:62ch; }

/* ---------- advantages ---------- */
.adv-grid{ display:grid; grid-template-columns:repeat(3,1fr); border-top:2px solid var(--ink); border-left:2px solid var(--ink); }
@media (max-width:860px){ .adv-grid{ grid-template-columns:1fr; } }
.adv{ padding:clamp(26px,3vw,44px); border-right:2px solid var(--ink); border-bottom:2px solid var(--ink); }
.adv-num{ font-family:var(--font-display); font-weight:800; font-size:15px; color:var(--primary); }
.adv-t{ font-family:var(--font-display); font-weight:800; font-size:clamp(20px,1.8vw,27px); letter-spacing:-.02em; margin:clamp(28px,4vw,54px) 0 .45em; }
.adv-d{ margin:0; color:var(--ink-soft); font-size:15px; }

/* ---------- steps ---------- */
.steps-sec{ background:var(--ink); color:#fff; }
.steps-sec .sec-index{ color:#fff; }
.steps-sec .eyebrow{ color:#fff; } .steps-sec .eyebrow::before{ background:#fff; }
.steps{ display:grid; grid-template-columns:repeat(4,1fr); gap:0; }
@media (max-width:900px){ .steps{ grid-template-columns:repeat(2,1fr); } }
@media (max-width:520px){ .steps{ grid-template-columns:1fr; } }
.step{ position:relative; padding:clamp(28px,3vw,40px) clamp(18px,2vw,30px) clamp(28px,3vw,40px) 0; }
.step + .step{ border-left:1px solid rgba(255,255,255,.16); padding-left:clamp(18px,2vw,30px); }
@media (max-width:900px){ .step:nth-child(odd){ border-left:none; padding-left:0; } }
@media (max-width:520px){ .step{ border-left:none !important; padding-left:0 !important; border-top:1px solid rgba(255,255,255,.16); } }
.step-dot{ width:46px; height:46px; border-radius:50%; border:2px solid var(--primary); color:var(--primary); display:grid; place-items:center; font-family:var(--font-display); font-weight:800; font-size:18px; margin-bottom:26px; position:relative; background:var(--ink); }
.step:hover .step-dot{ background:var(--primary); color:#fff; }
.step h3{ font-size:clamp(22px,1.9vw,28px); margin-bottom:.5em; }
.step p{ margin:0; color:rgba(255,255,255,.62); font-size:15px; line-height:1.5; }
.steps-line{ position:absolute; left:0; right:0; top:calc(clamp(28px,3vw,40px) + 23px); height:2px; background:rgba(255,255,255,.16); z-index:0; }
.steps-line i{ display:block; height:100%; width:0; background:var(--primary); transition:width 1.1s cubic-bezier(.2,.7,.2,1); }

/* ---------- instagram (phone / portrait format) ---------- */
.instagram .ig-grid{ display:grid; grid-template-columns:repeat(6,1fr); gap:12px; }
@media (max-width:860px){ .instagram .ig-grid{ grid-template-columns:repeat(3,1fr); } }
@media (max-width:560px){ .instagram .ig-grid{ grid-template-columns:repeat(2,1fr); gap:10px; } }
.ig-grid image-slot{ width:100%; height:auto; aspect-ratio:9 / 16; display:block; border:2px solid var(--ink); }
.instagram .sec-head .btn--ghost{ margin-top:22px; }

/* ---------- form layout (centered) ---------- */
.form-head{ max-width:780px; margin-bottom:clamp(28px,4vh,40px); }
.form-head--center{ margin-left:auto; margin-right:auto; text-align:center; }
.form-head .h2{ margin-top:14px; }
.form-head .lead{ margin-top:18px; }
.form-head--center .lead{ margin-left:auto; margin-right:auto; }
.form-head--center .eyebrow::before{ display:none; }
.form-stack{ max-width:760px; margin:0 auto; }
@media (max-width:760px){ .form-stack{ max-width:100%; } }
.form-card{ width:100%; }
@media (max-width:560px){
  .card{ padding:16px 12px; }
  .b2b{ padding:18px 14px; }
  .form-stack{ margin-left:-4px; margin-right:-4px; }
}
.grid2{ display:grid; grid-template-columns:1fr 1fr; gap:18px; }
.grid2 > .field{ margin-bottom:0; }
@media (max-width:560px){ .grid2{ grid-template-columns:1fr; gap:0; } .grid2 > .field{ margin-bottom:18px; } }

/* inline success (replaces a form in place) */
.success-inline{ text-align:center; padding:clamp(26px,4vw,48px) 10px; }
.success-inline .check{ margin:0 auto 22px; }
.success-inline h3{ margin:0 0 .4em; }
.success-inline p{ color:var(--ink-soft); margin:0 auto 26px; max-width:40ch; }
.success-inline--dark h3{ color:#fff; }
.success-inline--dark p{ color:rgba(255,255,255,.7); }
.success-inline--dark .check{ border-color:#fff; }
.success-inline--dark .check path{ stroke:#fff; }

/* ---------- B2B (contrast) ---------- */
.b2b{ margin-top:26px; width:100%; background:var(--ink); color:#fff; border:2px solid var(--ink); padding:clamp(26px,3vw,46px); display:grid; grid-template-columns:1fr; gap:clamp(20px,3vw,30px); }
.b2b-title{ font-family:var(--font-display); font-weight:800; font-size:clamp(26px,3vw,44px); letter-spacing:-.02em; margin:0 0 .4em; line-height:.96; }
.b2b-lead{ margin:0; color:rgba(255,255,255,.66); font-size:16px; }
.b2b-form{ display:grid; grid-template-columns:1fr 1fr; gap:16px; align-items:end; }
.b2b-form > .field{ margin-bottom:0; }
.b2b-form > .field:nth-child(3){ grid-column:1 / -1; }
.b2b-form > .btn{ grid-column:1 / -1; width:100%; }
@media (max-width:520px){ .b2b-form{ grid-template-columns:1fr; } }
.b2b .lbl{ color:rgba(255,255,255,.7); }
.inp--dark{ background:rgba(255,255,255,.07); border-color:rgba(255,255,255,.24); color:#fff; }
.inp--dark::placeholder{ color:rgba(255,255,255,.4); }
.inp--dark:focus{ border-color:#fff; box-shadow:0 0 0 4px rgba(255,255,255,.12); }
.btn--light{ background:#fff; color:var(--ink); border-color:#fff; }
.btn--light:hover{ background:var(--bg-soft); border-color:var(--bg-soft); color:var(--ink); box-shadow:0 16px 40px -16px rgba(0,0,0,.5); }
.err-msg.light{ color:#ffb4ab; }

/* ---------- modal ---------- */
.modal-ov{ position:fixed; inset:0; background:rgba(26,20,19,.55); backdrop-filter:blur(4px); z-index:100; display:grid; place-items:center; padding:24px; animation:ovIn .25s ease; }
@keyframes ovIn{ from{ opacity:0; } }
.modal{ background:#fff; border:2px solid var(--ink); padding:clamp(30px,4vw,52px); max-width:440px; width:100%; text-align:center; animation:modIn .35s cubic-bezier(.2,1.25,.4,1); }
@keyframes modIn{ from{ transform:translateY(20px) scale(.96); opacity:0; } }
.modal h3{ margin:0 0 .4em; } .modal p{ color:var(--ink-soft); margin:0 0 26px; }
.modal .btn{ width:100%; }
.modal .check{ margin:0 auto 22px; }

/* ---------- form ---------- */
.form-sec{ background:var(--bg-soft); }
.form-grid{ display:grid; grid-template-columns:1fr 1.15fr; gap:clamp(40px,6vw,90px); align-items:start; }
@media (max-width:920px){ .form-grid{ grid-template-columns:1fr; gap:44px; } }
.form-aside .h2{ margin-bottom:.35em; }
.form-aside .lead{ margin-bottom:34px; }
.contact-line{ display:flex; align-items:center; gap:14px; padding:18px 0; border-top:1px solid var(--line); font-weight:700; }
.contact-line:last-child{ border-bottom:1px solid var(--line); }
.contact-line .ci{ width:38px; height:38px; border-radius:50%; border:2px solid var(--primary); color:var(--primary); display:grid; place-items:center; flex:none; font-size:15px; }
.contact-line small{ display:block; font-weight:600; color:var(--ink-soft); font-size:12px; letter-spacing:.04em; text-transform:uppercase; margin-bottom:2px; }

.card{ background:#fff; border:2px solid var(--ink); padding:clamp(24px,3vw,42px); }
.field{ margin-bottom:20px; position:relative; }
.field.row2{ display:grid; grid-template-columns:1fr 1fr; gap:18px; }
.field.row2 .field{ margin-bottom:0; }
label.lbl{ display:block; font-weight:800; font-size:12px; letter-spacing:.08em; text-transform:uppercase; margin-bottom:9px; color:var(--ink); }
.inp, .sel, textarea.inp{
  width:100%; font-family:inherit; font-size:16px; font-weight:600; color:var(--ink);
  padding:14px 16px; border:2px solid var(--line-strong); border-radius:var(--radius);
  background:#fff; transition:border-color .18s, box-shadow .18s; outline:none;
}
.inp::placeholder{ color:#a89f9c; font-weight:500; }
.inp:focus, .sel:focus, textarea.inp:focus{ border-color:var(--primary); box-shadow:0 0 0 4px rgba(105,28,28,.1); }
.inp.err{ border-color:#b42318; box-shadow:0 0 0 4px rgba(180,35,24,.08); }
.err-msg{ color:#b42318; font-size:12.5px; font-weight:700; margin-top:7px; }
textarea.inp{ resize:vertical; min-height:88px; }
.sel{ appearance:none; background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='14' viewBox='0 0 24 24' fill='none' stroke='%23691C1C' stroke-width='3'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E"); background-repeat:no-repeat; background-position:right 16px center; padding-right:42px; }

/* cargo chips */
.chips{ display:flex; flex-wrap:wrap; gap:10px; }
.chip{ padding:11px 16px; border:2px solid var(--line-strong); border-radius:var(--radius); font-weight:700; font-size:14px; background:#fff; color:var(--ink); transition:all .16s; }
.chip:hover{ border-color:var(--primary); }
.chip[aria-pressed="true"]{ background:var(--primary); border-color:var(--primary); color:#fff; }

.form-foot{ margin-top:26px; display:flex; align-items:center; gap:18px; flex-wrap:wrap; }
.form-foot .btn{ flex:1; min-width:200px; }
.form-note{ font-size:12.5px; color:var(--ink-soft); }

/* success */
.success{ text-align:center; padding:clamp(30px,5vw,60px) 10px; }
.check{ width:84px; height:84px; border-radius:50%; border:3px solid var(--primary); display:grid; place-items:center; margin:0 auto 26px; }
.check svg{ width:42px; height:42px; }
.check path{ stroke:var(--primary); stroke-width:3.4; fill:none; stroke-linecap:round; stroke-linejoin:round; stroke-dasharray:48; stroke-dashoffset:48; animation:draw .6s .15s cubic-bezier(.2,.7,.2,1) forwards; }
@keyframes draw{ to{ stroke-dashoffset:0; } }
.success h3{ margin-bottom:.4em; }
.success p{ color:var(--ink-soft); max-width:38ch; margin:0 auto 28px; }

/* ---------- footer ---------- */
.foot{ background:var(--ink); color:#fff; padding:clamp(60px,9vh,110px) 0 40px; position:relative; }
.foot .big{ font-family:var(--font-display); font-weight:800; font-size:clamp(56px,12vw,180px); letter-spacing:-.04em; line-height:.9; }
.foot .big em{ font-style:normal; color:var(--primary); }
.foot-grid{ display:flex; justify-content:space-between; gap:30px; flex-wrap:wrap; margin-top:clamp(40px,6vh,70px); padding-top:32px; border-top:1px solid rgba(255,255,255,.16); }
.foot-grid a{ color:rgba(255,255,255,.7); font-weight:600; }
.foot-grid a:hover{ color:#fff; }
.foot-col h4{ font-size:12px; letter-spacing:.14em; text-transform:uppercase; color:rgba(255,255,255,.45); margin:0 0 14px; font-weight:800; }
.foot-col div{ margin-bottom:8px; }
.foot-copy{ margin-top:50px; display:flex; justify-content:space-between; gap:20px; flex-wrap:wrap; color:rgba(255,255,255,.4); font-size:13px; font-weight:600; }

@media (prefers-reduced-motion: reduce){
  *{ animation-duration:.001ms !important; animation-iteration-count:1 !important; }
  .reveal{ opacity:1 !important; transform:none !important; }
}

/* ---------- mobile sticky CTA ---------- */
.sticky-cta{
  position:fixed; left:16px; right:16px; bottom:14px; z-index:54;
  display:none; align-items:center; justify-content:center; gap:.7em;
  padding:14px 18px; background:var(--primary); color:#fff;
  font-family:var(--font-display); font-weight:800; font-size:15px; letter-spacing:-.01em;
  border:2px solid var(--primary); box-shadow:0 14px 32px -10px rgba(105,28,28,.55);
  opacity:0; transform:translateY(80px); pointer-events:none;
  transition:opacity .35s cubic-bezier(.2,.7,.2,1), transform .35s cubic-bezier(.2,.7,.2,1);
}
.sticky-cta.on{ opacity:1; transform:none; pointer-events:auto; }
.sticky-cta:hover{ background:var(--primary-deep); border-color:var(--primary-deep); color:#fff; }
@media (max-width:760px){ .sticky-cta{ display:inline-flex; } }
@media (max-width:760px) and (display-mode:standalone){ .sticky-cta{ bottom:calc(14px + env(safe-area-inset-bottom)); } }
@media (max-width:760px){ .sticky-cta{ bottom:calc(14px + env(safe-area-inset-bottom)); } }

/* on mobile: hide the form's box stripe — boxes still fly into the van, but no resting stack */
@media (max-width:760px){
  .block-rail[data-form="true"] .rail-track,
  .block-rail[data-form="true"] .rail-fill{ display:none; }
  .block-rail[data-form="true"] .rbox{ opacity:0; }
  .block-rail[data-form="true"][data-fly="true"] .rbox{
    opacity:1; animation:flyIntoVan 1.3s cubic-bezier(.5,0,.35,1) forwards;
    animation-delay:calc(var(--i) * .18s);
  }
}
@keyframes flyIntoVan{
  0%   { transform:translate(-60vw, -40vh) scale(.5) rotate(-22deg); opacity:0; }
  25%  { opacity:1; }
  60%  { transform:translate(0,0) scale(1) rotate(0); }
  100% { transform:translate(var(--tx,120px), var(--ty,160px)) scale(.25) rotate(14deg); opacity:0; }
}

/* road strip + van inside the form section */
.roadvan{ position:relative; height:178px; margin:6px 0 36px; }
.road{ position:absolute; left:0; right:0; bottom:36px; height:6px; background:var(--ink); }
.road-dash{ position:absolute; left:8px; right:8px; top:2px; height:2px; background-image:repeating-linear-gradient(90deg,#fff 0 20px,transparent 20px 40px); opacity:.45; }
.rv-stage{ position:absolute; left:6px; bottom:36px; width:128px; height:74px; transform:scale(1.62); transform-origin:left bottom; }
.rv-label{ position:absolute; right:0; bottom:54px; text-align:right; max-width:48%; }
.rv-label b{ font-family:var(--font-display); font-weight:800; font-size:clamp(15px,1.6vw,21px); letter-spacing:-.01em; display:block; line-height:1.1; margin-bottom:4px; }
.rv-label small{ display:block; font-size:13px; color:var(--ink-soft); font-weight:600; line-height:1.3; }
@media (max-width:560px){ .rv-stage{ transform:scale(1.3); } .rv-label b{ font-size:14px; } .rv-label small{ font-size:11px; } }

.van{ position:absolute; left:0; bottom:0; width:128px; height:74px; }
.van-floor{ position:absolute; left:6px; right:6px; bottom:6px; height:2px; background:rgba(26,20,19,.18); }
.van-body{ position:absolute; left:2px; bottom:14px; width:80px; height:48px; background:var(--primary); }
.van-body::after{ content:""; position:absolute; left:9px; top:9px; width:62px; height:5px; background:rgba(255,255,255,.18); }
.van-cab{ position:absolute; left:80px; bottom:14px; width:44px; height:36px; background:var(--primary-deep); clip-path:polygon(0 0, 64% 0, 100% 42%, 100% 100%, 0 100%); }
.van-window{ position:absolute; left:88px; bottom:30px; width:24px; height:14px; background:#fff; opacity:.9; clip-path:polygon(0 0,100% 22%,100% 100%,0 100%); }
.van-wheel{ position:absolute; bottom:0; width:20px; height:20px; border-radius:50%; background:#1d1614; border:4px solid #2a2020; }
.van-wheel::after{ content:""; position:absolute; inset:5px; border-radius:50%; background:var(--primary); }
.van-wheel.w1{ left:16px; } .van-wheel.w2{ left:92px; }
.van-back{ position:absolute; left:2px; bottom:14px; width:11px; height:48px; background:#3a1010; }
.van-door{ position:absolute; left:2px; bottom:14px; width:11px; height:48px; background:var(--primary-deep); border-right:2px solid rgba(255,255,255,.12); transform-origin:top center; transform:scaleY(0); transition:transform .5s cubic-bezier(.3,.7,.3,1); }
.van-exhaust{ position:absolute; left:-3px; bottom:14px; width:9px; height:9px; border-radius:50%; background:rgba(120,110,105,.5); opacity:0; }
.roadvan[data-loading="true"] .van-door{ transform:scaleY(1); transition-delay:1.2s; }
.roadvan[data-loading="true"] .van{ animation:vanReady 1.1s ease-in-out 1.7s; }

/* submit: rev up, then drive off with spinning wheels + tyre smoke */
.roadvan[data-sent="true"] .van{ animation:vanRev .9s ease-in-out 0s 1, driveOff 1.4s cubic-bezier(.45,0,.85,.4) .9s forwards; }
.roadvan[data-sent="true"] .van-wheel::after{ animation:spin .28s linear .9s 8; }
.roadvan[data-sent="true"] .van-exhaust{ animation:exhaust .45s ease-out .1s 4; }
@keyframes vanReady{ 0%,100%{ transform:none; } 45%{ transform:translateY(-4px); } }
@keyframes vanRev{ 0%,100%{ transform:none; } 15%{ transform:translateY(-1.5px) rotate(-.7deg); } 35%{ transform:translateY(.5px) rotate(.6deg); } 55%{ transform:translateY(-1.5px) rotate(-.5deg); } 75%{ transform:translateY(.5px) rotate(.4deg); } }
@keyframes driveOff{ 0%{ transform:none; } 8%{ transform:translateX(-12px); } 100%{ transform:translateX(165vw); } }
@keyframes spin{ to{ transform:rotate(360deg); } }
@keyframes exhaust{ 0%{ opacity:.55; transform:translate(0,0) scale(.5); } 100%{ opacity:0; transform:translate(-12px,-7px) scale(1.5); } }

/* tyre smoke left behind on the road */
.road-smoke{ position:absolute; left:36px; bottom:38px; width:0; height:0; opacity:0; z-index:1; }
.roadvan[data-sent="true"] .road-smoke{ opacity:1; }
.road-smoke i{ position:absolute; width:16px; height:16px; border-radius:50%; background:rgba(110,100,95,.42); }
.roadvan[data-sent="true"] .road-smoke i{ animation:tyresmoke 1.2s ease-out forwards; }
.road-smoke i:nth-child(1){ animation-delay:.9s; }
.road-smoke i:nth-child(2){ left:9px; animation-delay:1.05s; }
.road-smoke i:nth-child(3){ left:-7px; animation-delay:1.2s; }
.road-smoke i:nth-child(4){ left:16px; animation-delay:1.35s; }
@keyframes tyresmoke{ 0%{ opacity:.5; transform:translate(0,0) scale(.4); } 100%{ opacity:0; transform:translate(-32px,-15px) scale(2.1); } }

/* label clears as the van drives past it */
.roadvan[data-sent="true"] .rv-label{ animation:labelOut .5s ease 1.25s forwards; }
@keyframes labelOut{ to{ opacity:0; transform:translateX(12px); } }

@media (max-width:560px){
  .block-rail{ width:34px; }
  .rail-stack{ width:34px; }
  .rbox{ width:34px; height:34px; }
}
@media (max-width:380px){
  .block-rail{ width:30px; }
  .rail-stack{ width:30px; }
  .rbox{ width:30px; height:30px; }
}
@media (prefers-reduced-motion: reduce){ .rbox{ transition:none; } }


@media (max-width: 760px) {
  .rbox img { filter: none; }
}