/* Подача — демо сайта грузоперевозок. Мир: заказ, который уже едет к вам — уведомления поверх двора. */
@font-face{font-family:"Montserrat";src:url(../fonts/montserrat-cyrillic.woff2) format("woff2");font-weight:500 900;font-display:swap;unicode-range:U+0301,U+0400-045F,U+0490-0491,U+04B0-04B1,U+2116}
@font-face{font-family:"Montserrat";src:url(../fonts/montserrat-latin.woff2) format("woff2");font-weight:500 900;font-display:swap;unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD,U+20BD}
@font-face{font-family:"Geist";src:url(../fonts/geist-cyrillic.woff2) format("woff2");font-weight:400 700;font-display:swap;unicode-range:U+0301,U+0400-045F,U+0490-0491,U+04B0-04B1,U+2116}
@font-face{font-family:"Geist";src:url(../fonts/geist-latin.woff2) format("woff2");font-weight:400 700;font-display:swap;unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD,U+20BD}

:root{
  --brick:#a33e2b; --brick-d:#8c3424; --brick-l:#c25a43;
  --cab:#f5f6f3; --white:#fff;
  --ink:#1c2024; --ink-2:#454c54; --ink-3:#5b636b;
  --asph:#33373c; --asph-2:#43484e; --asph-3:#4f555c;
  --sky:#d7e5ec; --sky-2:#c3d6e1; --mist:#e9eff2;
  --live:#1a8a4c; --tape-r:#d6402e;
  --r-note:28px; --r-sm:16px;
  --shadow:0 22px 44px -22px rgba(20,25,30,.42),0 3px 8px -2px rgba(20,25,30,.12);
  --hdr:70px;
  --display:"Montserrat",system-ui,sans-serif;
  --text:"Geist",system-ui,sans-serif;
  --focus:var(--ink);
}
*,*::before,*::after{box-sizing:border-box}
html{scroll-behavior:smooth;scroll-padding-top:calc(var(--hdr) + 18px);-webkit-text-size-adjust:100%}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*::before,*::after{animation:none!important;transition:none!important}}
body{margin:0;background:var(--cab);color:var(--ink);font:400 17px/1.55 var(--text);font-feature-settings:"ss01" 0}
img,svg{display:block}
a{color:inherit;text-underline-offset:.2em;text-decoration-thickness:1.5px}
button,input,select,textarea{font:inherit;color:inherit}
::selection{background:var(--brick);color:#fff}
:focus-visible{outline:3px solid var(--focus);outline-offset:3px;border-radius:6px}
html{scrollbar-color:var(--asph-3) var(--cab)}
.defs{position:absolute;width:0;height:0;overflow:hidden}
.vh{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.skip{position:absolute;left:12px;top:-60px;z-index:200;background:var(--ink);color:#fff;padding:10px 16px;border-radius:999px;text-decoration:none}
.skip:focus{top:12px}
.ask{text-decoration:underline dotted 2px;text-underline-offset:.24em;text-decoration-color:color-mix(in srgb,currentColor 70%,transparent)}
.wrap{max-width:1240px;margin:0 auto;padding:0 28px}

/* Кнопки — как действия в уведомлении: пилюли */
.btn{display:inline-flex;align-items:center;gap:10px;border-radius:999px;padding:12px 22px;font:650 16px/1.2 var(--text);text-decoration:none;border:2px solid transparent;cursor:pointer;transition:background-color .2s,color .2s,border-color .2s}
.btn svg{width:18px;height:18px}
.btn-ink{background:var(--ink);color:#fff}
.btn-ink:hover{background:var(--brick)}
.btn-ink:disabled{background:#b9bfc4;color:#3c4248;cursor:not-allowed}
.btn-line{border-color:var(--ink);color:var(--ink);background:transparent}
.btn-line:hover{background:var(--ink);color:#fff}
.btn-big{padding:16px 28px;font-size:17px}

/* Шапка: белая эмаль кабины, по низу — контурная маркировка */
.hdr{position:sticky;top:0;z-index:50;background:rgba(251,251,249,.97);height:var(--hdr);transition:box-shadow .25s}
.hdr::after{content:"";position:absolute;left:0;right:0;bottom:0;height:5px;background:repeating-linear-gradient(90deg,var(--tape-r) 0 26px,#f2f2ee 26px 52px)}
.hdr.scrolled{box-shadow:0 10px 24px -18px rgba(20,25,30,.5)}
.hdr-in{height:100%;max-width:1360px;margin:0 auto;padding:0 28px 5px;display:flex;align-items:center;gap:22px}
.logo{display:flex;align-items:center;gap:11px;text-decoration:none;color:var(--ink);flex:none}
.logo-sign{width:42px;height:42px}
.logo-word{font:850 23px/1 var(--display);letter-spacing:-.02em;display:flex;flex-direction:column}
.logo-word small{font:500 12.5px/1.2 var(--text);letter-spacing:0;color:var(--ink-3);margin-top:3px}
.nav{display:flex;gap:2px;margin-left:auto}
.nav a{font:550 15px/1 var(--text);color:var(--ink-2);text-decoration:none;padding:10px 11px;border-radius:999px;position:relative}
.nav a:hover{color:var(--ink);background:#eceeea}
.nav a.is-on{color:var(--ink)}
.nav a.is-on::before{content:"";position:absolute;left:50%;bottom:1px;width:7px;height:7px;margin-left:-3.5px;border-radius:50%;background:var(--brick)}
.hdr-cta{flex:none;padding:11px 20px;gap:0}
.hdr-menu{display:none;align-items:center;gap:8px;border:2px solid var(--ink);background:transparent;border-radius:999px;padding:8px 14px;font:650 15px/1 var(--text);cursor:pointer}
.hdr-menu svg{width:20px;height:20px}

/* Уведомление — главный предмет сайта */
.note{background:var(--white);border-radius:var(--r-note);box-shadow:var(--shadow);padding:20px 24px 24px}
.note-head{display:flex;align-items:center;gap:10px;font:500 14px/1 var(--text);color:var(--ink-3);margin-bottom:12px}
.note-ico{width:26px;height:26px;flex:none}
.note-app{font-weight:650;color:var(--ink);letter-spacing:.01em}
.note-when{margin-left:auto;display:inline-flex;align-items:center;gap:7px;white-space:nowrap}
.live{width:9px;height:9px;border-radius:50%;background:var(--live)}
.note-hero .live{animation:live 2.4s ease-out 3}
@keyframes live{0%{box-shadow:0 0 0 0 rgba(26,138,76,.5)}70%,100%{box-shadow:0 0 0 9px rgba(26,138,76,0)}}
.note-title{font:850 clamp(2.15rem,3.45vw,3.25rem)/1.04 var(--display);letter-spacing:-.025em;margin:0 0 16px;text-wrap:balance}
.note-body{margin:0 0 18px;font-size:18px;color:var(--ink-2);max-width:56ch}
.note-fig{display:flex;align-items:flex-end;justify-content:space-between;gap:16px;background:var(--mist);border-radius:20px;padding:14px 18px;margin:0 0 20px}
.fig-l{font:600 16px/1.35 var(--text);color:var(--ink-2)}
.fig-r{text-align:right;display:flex;flex-direction:column;align-items:flex-end}
.fig-r b{font:850 30px/1 var(--display);letter-spacing:-.02em;white-space:nowrap;font-variant-numeric:tabular-nums}
.fig-r small{font-size:13px;color:var(--ink-3);margin-top:4px}
.note-act{display:flex;flex-wrap:wrap;gap:12px;align-items:center}
.br-d{display:none}
@media (min-width:1180px){.br-d{display:inline}}
.note-sys{background:rgba(236,240,242,.94);box-shadow:0 12px 26px -18px rgba(20,25,30,.5);padding:14px 20px 16px;font-size:14.5px;line-height:1.45;color:var(--ink-2)}
.note-sys .note-head{margin-bottom:6px}
.note-sys p{margin:0}

/* Первый экран */
.hero{position:relative;min-height:max(660px,calc(100svh - var(--hdr)));overflow:hidden;background:var(--sky)}
.hero-scene{position:absolute;inset:0}
.scene{width:100%;height:100%}
.hero-notes{position:relative;z-index:2;width:min(720px,50vw);margin-left:max(28px,calc((100vw - 1360px)/2 + 28px));padding:clamp(28px,5.5vh,64px) 0 40px;display:grid;gap:12px}
.hero-side{position:absolute;z-index:2;right:max(28px,calc((100vw - 1360px)/2 + 28px));top:clamp(32px,7vh,96px);width:340px;display:grid;gap:12px}
.note-mini{padding:14px 18px 16px;font-size:15px;line-height:1.45;animation:drop 1s cubic-bezier(.16,1,.3,1) 1.1s both}
.note-mini .note-head{margin-bottom:6px}
.note-mini p{margin:0;color:var(--ink-2)}
.note-mini b{color:var(--ink)}
@keyframes drop{from{opacity:0;transform:translateY(-26px) scale(.97)}to{opacity:1;transform:none}}
.plate-s{display:inline-block;background:#fff;border:1.5px solid var(--ink);border-radius:4px;padding:0 6px;font:750 .92em/1.35 var(--display);letter-spacing:.05em;white-space:nowrap;color:var(--ink)}
.tent-word{font-family:var(--display);font-weight:900;fill:#fff;letter-spacing:.02em}
.tent-sub{font-family:var(--text);font-weight:600;fill:#fbe9e2}

/* Разделы */
.sec{padding:clamp(76px,9vw,128px) 0;position:relative}
.h2{font:820 clamp(2rem,3.3vw,3.15rem)/1.06 var(--display);letter-spacing:-.022em;margin:0 0 18px;max-width:22ch;text-wrap:balance}
.h3{font:780 21px/1.2 var(--display);letter-spacing:-.01em;margin:0 0 10px}
.lead{font-size:19px;line-height:1.55;color:var(--ink-2);max-width:62ch;margin:0 0 28px}

/* Подбор */
.sec-podbor{background:linear-gradient(var(--sky) 0 520px,var(--mist) 520px)}
.podbor-top{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:24px 56px;align-items:end;margin-bottom:22px}
.podbor-top .lead{margin:0}
.presets{display:flex;flex-wrap:wrap;gap:8px;align-items:center;margin:0 0 22px}
.presets-l{font-weight:600;color:var(--ink-2);margin-right:6px}
.presets button,.bodies button,.seg button{border:2px solid var(--ink);background:transparent;border-radius:999px;padding:8px 15px;font:600 15px/1.2 var(--text);cursor:pointer;transition:background-color .15s,color .15s}
.presets button:hover,.bodies button:hover,.seg button:hover{background:rgba(28,32,36,.08)}
.presets button[aria-pressed="true"],.bodies button[aria-checked="true"],.seg button[aria-checked="true"]{background:var(--ink);color:#fff}
.loader{display:grid;gap:18px}
.stage{position:relative;background:linear-gradient(#dfe9ee,#eef3f5 70%,#bfc7cd 70.5%);border-radius:34px;padding:22px 22px 18px;overflow:hidden}
.note-read{position:absolute;left:22px;top:22px;width:min(380px,40%);z-index:2;padding:16px 20px 18px}
.read-row{display:flex;justify-content:space-between;align-items:flex-start;gap:14px}
.read-t{margin:0;font:820 26px/1.1 var(--display);letter-spacing:-.015em;display:flex;flex-direction:column}
.read-t small,.read-n small{font:500 13.5px/1.35 var(--text);color:var(--ink-3);letter-spacing:0;margin-top:5px}
.read-n{margin:0;text-align:right;display:flex;flex-direction:column;align-items:flex-end}
.read-n b{font:850 30px/1 var(--display);font-variant-numeric:tabular-nums;color:var(--brick)}
.read-why{margin:12px 0 0;font-size:15px;line-height:1.45;color:var(--ink-2)}
.truck-wrap{margin-top:96px;transition:transform .2s}
.truck-svg{width:100%;height:auto;overflow:visible}
.truck-svg .back{filter:brightness(var(--k,.86)) saturate(.9)}
.truck-svg .left{opacity:.92}
.left-t{font:700 26px var(--text);fill:var(--brick)}
.truck-wrap.over{outline:3px dashed var(--brick);outline-offset:6px;border-radius:20px}
.truck-wrap.thud{animation:thud .38s cubic-bezier(.2,.8,.2,1)}
@keyframes thud{0%{transform:translateY(0)}30%{transform:translateY(4px)}100%{transform:translateY(0)}}
.bodies{display:flex;flex-wrap:wrap;gap:8px;margin-top:14px}
.things{list-style:none;margin:0;padding:18px;display:grid;grid-template-columns:repeat(auto-fill,minmax(124px,1fr));gap:10px;background:var(--asph);border-radius:30px}
.thing{position:relative}
.thing-add{width:100%;height:122px;display:flex;flex-direction:column;align-items:center;justify-content:flex-end;gap:9px;padding:12px 6px 12px;border:0;border-radius:20px;background:var(--asph-2);color:#eef0f1;cursor:grab;touch-action:pan-y;font:550 14px/1.15 var(--text);transition:background-color .15s}
.thing-add:hover{background:var(--asph-3)}
.thing-add:active{cursor:grabbing}
.thing-add svg{height:66px;width:auto;max-width:96px;filter:drop-shadow(1.6px 0 0 #fff) drop-shadow(-1.6px 0 0 #fff) drop-shadow(0 1.6px 0 #fff) drop-shadow(0 -1.6px 0 #fff) drop-shadow(0 5px 5px rgba(0,0,0,.35));pointer-events:none}
.thing.on .thing-add{background:#585e65;box-shadow:inset 0 0 0 2px #f2f2ee}
.thing-n{position:absolute;right:8px;top:8px;min-width:28px;height:28px;padding:0 7px;border-radius:999px;background:var(--brick);color:#fff;font:800 14px/28px var(--display);text-align:center;opacity:0;transform:scale(.6);transition:opacity .15s,transform .25s cubic-bezier(.2,.8,.2,1);pointer-events:none}
.thing.on .thing-n{opacity:1;transform:none}
.thing-minus{position:absolute;left:8px;top:8px;width:30px;height:30px;border-radius:50%;border:0;background:#f2f2ee;color:var(--ink);display:grid;place-items:center;cursor:pointer}
.thing-minus svg{width:16px;height:16px;stroke:currentColor;stroke-width:2.6;stroke-linecap:round}
.thing-minus:disabled{visibility:hidden}
.ghost{position:fixed;left:0;top:0;width:80px;height:80px;pointer-events:none;z-index:300;filter:drop-shadow(2px 0 0 #fff) drop-shadow(-2px 0 0 #fff) drop-shadow(0 2px 0 #fff) drop-shadow(0 -2px 0 #fff) drop-shadow(0 10px 10px rgba(0,0,0,.35))}
.opts{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px;margin-top:22px}
.opt{border:0;margin:0;padding:16px 18px 18px;background:#fff;border-radius:22px;display:flex;flex-wrap:wrap;gap:10px 14px;align-items:center;min-width:0}
.opt legend{float:left;width:100%;font:780 17px/1.2 var(--display);margin-bottom:4px;padding:0}
.opt label{display:flex;align-items:center;gap:8px;font-size:15px;color:var(--ink-2)}
.opt select,.opt input{border:2px solid #c9ced3;border-radius:12px;padding:7px 10px;background:#fff;min-width:0}
.opt select:focus-visible,.opt input:focus-visible{border-color:var(--ink);outline:none}
.opt input[type=number]{width:84px}
.seg{display:flex;flex-wrap:wrap;gap:6px}
.km{width:100%}
.opts-note{margin:14px 0 0;color:var(--ink-2);font-size:15.5px}
.to-price{display:inline-flex;align-items:center;gap:8px;margin-top:10px;font-weight:650}
.to-price svg{width:18px;height:18px}
.fleet{margin-top:clamp(64px,7vw,96px)}
.fleet-sub{color:var(--ink-2);max-width:70ch;margin:0 0 24px}
.fleet-row{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:30px 56px;align-items:end}
.fl{display:grid;gap:10px;align-content:end;padding-bottom:16px;background:linear-gradient(transparent calc(100% - 6px),#c9ced3 0)}
.fl svg{width:var(--w);height:auto;overflow:visible}
.fl p{margin:0;font-size:15px;line-height:1.45;color:var(--ink-2)}
.fl b{display:block;font:800 18px/1.2 var(--display);color:var(--ink)}
.fl-r{font-weight:650;color:var(--ink)}

/* Цена: кирпичное поле тента */
.sec-cena{background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='8' height='8'%3E%3Cpath d='M0 2h8M0 6h8' stroke='%23933826' stroke-width='.8' opacity='.55'/%3E%3Cpath d='M2 0v8M6 0v8' stroke='%23b5503b' stroke-width='.7' opacity='.4'/%3E%3C/svg%3E"),var(--brick);color:#fff;--focus:#fff}
.sec-cena .lead{color:#fbe5de}
.cena-grid{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);gap:clamp(32px,5vw,72px);align-items:start}
.legend{list-style:none;margin:0 0 34px;padding:0;display:grid;gap:10px;font-weight:550}
.legend li{display:flex;align-items:center;gap:14px}
.ln{display:inline-block;width:56px;height:3px;flex:none}
.ln-in{background:#fff}
.ln-pre{background:repeating-linear-gradient(90deg,#fff 0 8px,transparent 8px 14px)}
.ln-no{background:linear-gradient(90deg,#fff 0 30%,transparent 30% 70%,#fff 70%)}
.change{background:var(--brick-d);border-radius:26px;padding:22px 24px}
.change ul{margin:0;padding:0 0 0 20px;display:grid;gap:10px;color:#fbe5de}
.change li::marker{color:#fff}
.note-bill{color:var(--ink);padding:22px 28px 28px;--focus:var(--ink)}
.bill-h{font:800 22px/1.2 var(--display);margin:0 0 14px}
.bill{list-style:none;margin:0;padding:0;display:grid}
.row{display:grid;grid-template-columns:auto minmax(28px,1fr) auto;align-items:end;gap:12px;padding:12px 0}
.row-l{font-weight:550;line-height:1.3}
.row-l small{display:block;font-weight:400;font-size:13.5px;color:var(--ink-3);margin-top:2px}
.lead-ln{height:2.5px;margin-bottom:6px}
.row-in .lead-ln{background:var(--ink)}
.row-pre .lead-ln{background:repeating-linear-gradient(90deg,var(--ink) 0 7px,transparent 7px 13px)}
.row-no .lead-ln{background:linear-gradient(90deg,var(--ink) 0 22%,transparent 22% 78%,var(--ink) 78%)}
.row-a{font:750 18px/1.2 var(--display);white-space:nowrap;font-variant-numeric:tabular-nums}
.row-no .row-a{color:var(--ink-3)}
.bill-sum{display:flex;justify-content:space-between;align-items:baseline;gap:12px;margin-top:14px;padding-top:18px;border-top:3px solid var(--ink)}
.bill-sum span{font:780 20px/1 var(--display)}
.bill-sum b{font:880 clamp(2.1rem,3.4vw,2.9rem)/1 var(--display);letter-spacing:-.02em;font-variant-numeric:tabular-nums;color:var(--brick)}
.bill-range{margin:8px 0 0;color:var(--ink-2);font-size:15px;text-align:right}
.bill-note{font-size:14px;color:var(--ink-3);margin:18px 0 20px}

/* Кто приедет */
.sec-kto{background:var(--sky)}
.kto-grid{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,6fr);gap:clamp(32px,5vw,72px);align-items:center}
.kto-scene{position:relative}
.rear{width:100%;height:auto}
.rear-word{font:900 30px var(--display);fill:#fff;letter-spacing:.03em}
.plate-t{font:800 20px var(--display);fill:var(--ink)}
.plate-r{font:800 16px var(--display);fill:var(--ink)}
.plate-rus{font:700 7px var(--text);fill:var(--ink)}
.brackets .bk{transition:transform .9s cubic-bezier(.16,1,.3,1),stroke .3s .6s}
.brackets .bk1{transform:translate(-26px,-26px)}.brackets .bk2{transform:translate(26px,-26px)}
.brackets .bk3{transform:translate(-26px,26px)}.brackets .bk4{transform:translate(26px,26px)}
.brackets.lock .bk{transform:none;stroke:#7df0ad}
.kto-cap{margin:6px 0 0;text-align:center;color:var(--ink-2);font-size:15px}
.kto-cap span{font-weight:700;color:var(--live)}
.note-card{margin:6px 0 28px;max-width:560px}
.card-t{font:820 26px/1.1 var(--display);margin:0 0 12px}
.card{margin:0;display:grid}
.card div{display:grid;grid-template-columns:110px minmax(0,1fr);gap:14px;padding:9px 0;align-items:baseline}
.card div+div{background:linear-gradient(90deg,#e3e8eb,#e3e8eb) top/100% 1.5px no-repeat}
.card dt{color:var(--ink-3);font-size:14.5px}
.card dd{margin:0;font-weight:550}
.rules{list-style:none;margin:0;padding:0;display:grid;gap:16px;max-width:62ch}
.rules li{position:relative;padding-left:26px;color:var(--ink-2)}
.rules li::before{content:"";position:absolute;left:0;top:.5em;width:11px;height:11px;border-radius:4px;background:var(--brick)}
.rules b{color:var(--ink);font-weight:650}

/* Время: асфальт */
.sec-vremya{background:var(--asph);color:#f2f3f4;--focus:#fff}
.sec-vremya .h2{max-width:24ch}
.day{display:grid;grid-template-columns:minmax(0,7fr) minmax(0,5fr);gap:clamp(28px,5vw,64px);align-items:start;margin-top:20px}
.feed{list-style:none;margin:0;padding:0;display:grid;gap:12px}
.note-dark{background:var(--asph-2);box-shadow:none;display:grid;grid-template-columns:120px minmax(0,1fr);gap:18px;align-items:start;padding:20px 24px}
.note-dark time{font:850 36px/1 var(--display);letter-spacing:-.02em;font-variant-numeric:tabular-nums;color:#fff}
.note-dark p{margin:0;color:#c9ced3}
.note-dark .feed-t{color:#fff;font:780 19px/1.25 var(--display);margin-bottom:6px}
.note-end{background:var(--brick)}
.note-end p{color:#fbe5de}
.clock-rules{display:grid;gap:12px;position:sticky;top:calc(var(--hdr) + 24px)}
.clock-rules h3{color:#fff;margin-bottom:4px}
.clock-rules{background:var(--asph-2);border-radius:var(--r-note);padding:22px 26px 24px}
.clock-rules p{margin:0;color:#c9ced3;font-size:16.5px;line-height:1.5}
.clock-rules b{font:850 22px/1 var(--display);color:#fff;white-space:nowrap}
.clock-note{margin:6px 0 0;font-size:14px;color:#aab1b8}

/* Сохранность */
.sec-cel{background:var(--cab)}
.frames{list-style:none;margin:8px 0 0;padding:0;display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:16px;align-items:start}
.frame-lead{grid-column:span 2}
.frame-lead h3{font-size:23px}
.frame h3{font:780 19px/1.2 var(--display);margin:16px 0 6px}
.frame p{margin:0;color:var(--ink-2);font-size:15.5px;line-height:1.5}
.shot{background:#e3e8eb;border-radius:22px;overflow:hidden}
.shot svg{width:100%;height:auto}
.shot use{filter:url(#stk)}
.corners{fill:none;stroke:#fff;stroke-width:5;stroke-linecap:round}
.rec{font:700 14px var(--text);fill:var(--tape-r)}
.film{stroke:#fff;stroke-width:6;opacity:.6}
.strap{stroke:#2b2f33;stroke-width:9}
.frame-if .shot{background:var(--brick);color:#fff}
.big30{font:900 92px var(--display);fill:#fff}
.days{font:600 17px var(--text);fill:#fbe5de}
.law{margin:34px 0 0;max-width:80ch;color:var(--ink-3);font-size:14.5px}

/* Маршрут */
.sec-put{background:var(--mist)}
.road{border-radius:22px;overflow:hidden;margin:14px 0 0}
.road svg{width:100%;height:76px}
.legs{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px;margin:18px 0 0}
.leg h3{font:800 22px/1.2 var(--display);margin:0}
.leg-n{margin:2px 0 8px;font:780 16px/1.2 var(--display);color:var(--brick)}
.leg p{color:var(--ink-2);margin-top:0}
.put-note{margin:20px 0 0;color:var(--ink-2);max-width:80ch}

/* Бумаги */
.sec-bumagi{background:#fff}
.bumagi-grid{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,6fr);gap:clamp(32px,5vw,72px);align-items:start}
.biz{background:var(--mist);border-radius:26px;padding:22px 24px}
.biz p{margin:0;color:var(--ink-2)}
.stack{list-style:none;margin:0;padding:0;display:grid;gap:12px}
.stack .note{background:var(--cab);box-shadow:0 14px 30px -22px rgba(20,25,30,.5)}
.stack .note:nth-child(2){margin-left:22px}.stack .note:nth-child(3){margin-left:44px}.stack .note:nth-child(4){margin-left:66px}
.stack p{margin:0;color:var(--ink-2)}
.stack .feed-t{font:780 19px/1.25 var(--display);color:var(--ink);margin-bottom:5px}

/* Вопросы */
.sec-voprosy{background:var(--sky)}
.qs{columns:2;column-gap:12px;margin-top:10px}
.qs .q{break-inside:avoid;margin-bottom:12px}
.q{background:#fff;border-radius:24px;box-shadow:0 14px 30px -24px rgba(20,25,30,.55)}
.q summary{list-style:none;cursor:pointer;padding:18px 22px;display:flex;align-items:center;gap:12px;font:760 18px/1.3 var(--display);border-radius:24px}
.q summary::-webkit-details-marker{display:none}
.q summary::before{content:"";width:26px;height:26px;flex:none;border-radius:8px;background:var(--brick) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 64 64'%3E%3Cpath d='M9 19h29v23H9zM40 27h8.5l6.5 7.5V42H40z' fill='%23fff'/%3E%3Ccircle cx='18.5' cy='44' r='5' fill='%23a33e2b' stroke='%23fff' stroke-width='3'/%3E%3Ccircle cx='47' cy='44' r='5' fill='%23a33e2b' stroke='%23fff' stroke-width='3'/%3E%3C/svg%3E") center/100% no-repeat}
.q summary::after{content:"";margin-left:auto;width:12px;height:12px;flex:none;border-right:2.5px solid var(--ink-3);border-bottom:2.5px solid var(--ink-3);transform:rotate(45deg) translate(-3px,-3px);transition:transform .25s}
.q[open] summary::after{transform:rotate(-135deg)}
.q p{margin:0;padding:0 22px 20px 60px;color:var(--ink-2)}

/* Финал */
.sec-end{padding-top:24px;background:linear-gradient(var(--sky) 0 calc(100% - 120px),#9ca3aa calc(100% - 120px) calc(100% - 114px),var(--asph) calc(100% - 114px));padding-bottom:0}
.end-grid{display:grid;grid-template-columns:minmax(0,6fr) minmax(0,5fr);gap:24px;align-items:end}
.note-final{max-width:680px;padding:26px 30px 30px;margin-bottom:150px}
.note-final .note-title{font-size:clamp(2rem,3.2vw,3.2rem)}
.end-truck{width:100%;height:auto;margin-bottom:96px}

/* Подвал */
.ftr{background:var(--ink);color:#d9dde0;padding:48px 0 56px;--focus:#fff}
.ftr-grid{display:grid;grid-template-columns:auto minmax(0,1fr) auto;gap:24px 48px;align-items:start}
.logo-ftr{color:#fff}
.logo-ftr .logo-word small{color:#aab1b8}
.ftr-demo{margin:0;font-size:14.5px;max-width:60ch;color:#c4c9cd}
.ftr-links{list-style:none;margin:0;padding:0;display:grid;gap:8px;font-size:14.5px}
.ftr-links a{color:#fff}

/* Окно заявки */
.dlg{border:0;padding:0;border-radius:30px;width:min(640px,calc(100vw - 32px));max-height:calc(100dvh - 32px);box-shadow:0 30px 80px -20px rgba(0,0,0,.5);color:var(--ink)}
.dlg::backdrop{background:rgba(28,32,36,.55)}
.dlg-form{padding:26px 28px 28px;position:relative}
.dlg-x{position:absolute;right:16px;top:16px;width:42px;height:42px;border-radius:50%;border:0;background:#eceeea;display:grid;place-items:center;cursor:pointer}
.dlg-x svg{width:20px;height:20px}
.dlg-demo{margin:0 50px 12px 0;display:inline-block;background:var(--mist);border-radius:999px;padding:6px 14px;font-size:14px;font-weight:600;color:var(--ink-2)}
.dlg h2{font:840 30px/1.1 var(--display);letter-spacing:-.02em;margin:4px 0 8px}
.dlg-sub{margin:0 0 18px;color:var(--ink-2)}
.fld-row{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.fld{display:grid;gap:6px;margin-bottom:12px;font-size:14.5px;font-weight:600;color:var(--ink-2)}
.fld input,.fld textarea{border:2px solid #c9ced3;border-radius:14px;padding:11px 13px;font:400 16px/1.4 var(--text);color:var(--ink);background:#fff;width:100%}
.fld input:focus-visible,.fld textarea:focus-visible{border-color:var(--ink);outline:none}
.fld input[aria-invalid="true"]{border-color:#b3261e}
.err{font-style:normal;color:#b3261e;font-weight:600;font-size:14px}
.agree{display:grid;gap:10px;margin:6px 0 18px;font-size:14.5px;line-height:1.45;color:var(--ink-2)}
.tick{display:grid;grid-template-columns:22px minmax(0,1fr);gap:10px;align-items:start;cursor:pointer}
.tick input{width:20px;height:20px;margin:1px 0 0;accent-color:var(--brick)}
.tick a{color:var(--ink)}
.tick i{display:block;font-style:normal;color:var(--ink-3)}
.dlg-send{width:100%;justify-content:center}
.dlg-hint{margin:10px 0 0;font-size:14px;color:var(--ink-3);text-align:center}
#dlgDone p{color:var(--ink-2)}

/* Правовые страницы */
.doc{max-width:820px;margin:0 auto;padding:56px 28px 80px}
.doc h1{font:840 clamp(2rem,3.4vw,2.8rem)/1.08 var(--display);letter-spacing:-.02em;margin:0 0 8px}
.doc h2{font:780 21px/1.25 var(--display);margin:34px 0 10px}
.doc p,.doc li{color:var(--ink-2)}
.doc-ver{color:var(--ink-3);margin:0 0 26px}
.doc-sys{margin:28px auto 0;max-width:820px}

/* Правовые страницы: шапка без выпадающего меню */
.doc-page .nav{display:flex;position:static;flex-direction:row;box-shadow:none;background:none;padding:0}
.doc-page .hdr-cta{order:0}

/* Планшет */
@media (max-width:1180px){
  .nav{display:none;position:absolute;left:0;right:0;top:var(--hdr);flex-direction:column;background:#fbfbf9;padding:10px 20px 20px;box-shadow:0 20px 30px -20px rgba(20,25,30,.5);gap:0}
  .nav.open{display:flex}
  .nav a{padding:14px 10px;font-size:17px;border-radius:12px}
  .nav a.is-on::before{left:auto;right:12px;bottom:auto;top:50%;margin-top:-3.5px}
  .hdr-menu{display:inline-flex;margin-left:auto}
  .hdr-cta{order:3}
  .opts{grid-template-columns:repeat(2,minmax(0,1fr))}
  .frames{grid-template-columns:repeat(3,minmax(0,1fr))}
  .frame-lead{grid-column:span 3}
  .frame-lead .shot{max-width:520px}
}
@media (max-width:980px){
  .hero-notes{width:min(600px,calc(100% - 56px))}
  .hero-side{position:relative;right:auto;top:auto;width:min(600px,calc(100% - 56px));margin:0 0 32px max(28px,calc((100vw - 1360px)/2 + 28px))}
  .note-mini{display:none}
  .podbor-top,.cena-grid,.kto-grid,.day,.bumagi-grid{grid-template-columns:minmax(0,1fr)}
  .clock-rules{position:static}
  .note-read{position:relative;left:auto;top:auto;width:auto;margin-bottom:8px}
  .truck-wrap{margin-top:0}
  .qs{columns:1}
  .end-grid{grid-template-columns:minmax(0,1fr)}
  .note-final{margin-bottom:0}
  .end-truck{max-width:460px;margin:8px 0 96px auto}
  .ftr-grid{grid-template-columns:minmax(0,1fr)}
  .kto-scene{max-width:520px}
}
/* Телефон */
@media (max-width:760px){
  :root{--hdr:62px}
  .wrap{padding:0 16px}
  .hdr-in{padding:0 16px 5px;gap:10px}
  .logo-sign{width:36px;height:36px}
  .logo-word{font-size:20px}
  .logo-word small{display:none}
  .hdr-cta{padding:9px 14px;font-size:14.5px}
  .hide-s{display:none}
  .hdr-menu span{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}
  .hdr-menu{padding:8px;margin-left:auto}
  .hero{min-height:0;display:flex;flex-direction:column;background:var(--sky)}
  .hero-scene{position:relative;order:0;height:250px;inset:auto}
  .hero-notes{width:auto;margin:-34px 0 0;padding:0 16px 4px;order:1}
  .note-hero .note-body{display:none}
  .note-hero .note-title{margin-bottom:12px}
  .note-hero .note-fig{margin-bottom:14px}
  .hero-side{order:2;width:auto;margin:10px 16px 18px}
  .note{padding:16px 18px 20px;border-radius:24px}
  .note-title{font-size:clamp(2rem,9vw,2.5rem)}
  .note-body{font-size:16.5px}
  .note-fig{flex-direction:column;align-items:flex-start}
  .fig-r{align-items:flex-start;text-align:left}
  .note-act .btn{width:100%;justify-content:center}
  .stage{padding:14px 10px 12px;border-radius:26px}
  .things{grid-template-columns:repeat(3,minmax(0,1fr));padding:12px;gap:8px;border-radius:24px}
  .thing-add{height:106px;font-size:12.5px;padding:10px 4px}
  .thing-add svg{height:54px;max-width:78px}
  .thing-minus{width:28px;height:28px;left:5px;top:5px}
  .thing-n{right:5px;top:5px}
  .opts{grid-template-columns:minmax(0,1fr)}
  .fleet-row{grid-template-columns:minmax(0,1fr)}
  .frames{grid-template-columns:minmax(0,1fr) minmax(0,1fr)}
  .frame-lead{grid-column:1/-1}
  .frame-if{grid-column:1/-1}
  .legs{grid-template-columns:minmax(0,1fr)}
  .road svg{height:56px}
  .note-dark{grid-template-columns:minmax(0,1fr);gap:8px}
  .note-dark time{font-size:30px}
  .stack .note:nth-child(n){margin-left:0}
  .row{grid-template-columns:minmax(0,1fr) auto;gap:6px 10px}
  .row .lead-ln{grid-column:1/-1;grid-row:2;margin:0}
  .bill-range{text-align:left}
  .note-bill{padding:18px 18px 22px}
  .dlg{width:100vw;max-width:none;height:100dvh;max-height:none;border-radius:0;margin:0}
  .dlg-form{padding:20px 16px 28px}
  .fld-row{grid-template-columns:minmax(0,1fr);gap:0}
  .q p{padding-left:22px}
  .doc-page .nav{display:none}
  .card div{grid-template-columns:92px minmax(0,1fr)}
}
@media (max-width:380px){
  .logo-word{font-size:18px}
  .frames{grid-template-columns:minmax(0,1fr)}
}
.act-404{margin-top:24px}
.cond{margin:14px 0 0;font-size:14px;color:var(--ink-3)}
.change .cond{color:#fbe5de}
.cond-q{margin:-6px 0 18px}
