/* Adv. Adir Golan, traffic law, Ramat Gan. Concept "נתיב פתוח": the page is a road at night. Asphalt, lane yellow,
   sign blue and red, highway green. Headlines in condensed Noto Sans Hebrew, text in Assistant. */
:root{
 --ink:#0e1013;--asph:#171a1f;--asph2:#20242a;--line:#2e333b;--txt:#eceef1;--mut:#a7aeb8;
 --y:#f5c400;--y2:#ffe07a;--blue:#1d5cb6;--red:#d0262e;--green:#0c6a3d;--paper:#f2eee5;--paper2:#e7e1d3;--dark:#16181c;
 --p3-a:#f5c400;--p3-b:#fff3c2;--p3-d:#14171b;--p3-solid:#22262d;--p3-top:76px;
 --disp:"Noto Sans Hebrew","Assistant",system-ui,sans-serif;--body:"Assistant","Noto Sans Hebrew",system-ui,sans-serif;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth;scroll-padding-top:80px}
body{margin:0;background:var(--ink);color:var(--txt);font:400 18px/1.65 var(--body);-webkit-font-smoothing:antialiased}
img{max-width:100%;height:auto;display:block}
a{color:inherit}
a[href^="tel:"]{white-space:nowrap;direction:ltr;unicode-bidi:isolate}
h1,h2,h3{font-family:var(--disp);font-stretch:78%;font-weight:800;line-height:1.08;margin:0 0 .5em;letter-spacing:0}
h2{font-size:clamp(32px,4.4vw,58px)}
h3{font-size:22px;font-stretch:88%;font-weight:700;line-height:1.2}
p{margin:0 0 1em}
svg{fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.wrap{width:min(1180px,100% - 40px);margin-inline:auto}
.skip{position:absolute;inset-inline-start:-999px}
.skip:focus{inset-inline-start:12px;top:12px;z-index:99;background:var(--y);color:#000;padding:8px 14px;border-radius:8px}
:focus-visible{outline:3px solid var(--y);outline-offset:3px}

/* bar */
.bar{position:sticky;top:0;z-index:40;display:flex;align-items:center;gap:22px;padding:12px max(20px,calc((100% - 1180px)/2));background:rgba(14,16,19,.97);border-bottom:1px solid var(--line)}
.brand{display:flex;align-items:center;gap:12px;text-decoration:none}
.plate{display:grid;place-items:center;height:36px;padding:0 10px;background:var(--y);color:#111;border:2px solid #111;box-shadow:0 0 0 2px var(--y);border-radius:6px;font:800 18px/1 var(--disp);font-stretch:75%}
.brand b{display:block;font:700 18px/1.1 var(--disp);font-stretch:85%}
.brand small{color:var(--mut);font-size:14px}
.nav{display:flex;gap:20px;margin-inline-start:auto}
.nav a{text-decoration:none;color:var(--mut);font-weight:600;font-size:16px}
.nav a:hover{color:var(--y)}
.bar-tel{display:flex;align-items:center;gap:8px;text-decoration:none;font-weight:700;color:var(--y);direction:ltr}
.bar-tel svg{width:18px;height:18px}
.menu{display:none;align-items:center;gap:6px;background:none;border:1px solid var(--line);color:var(--txt);border-radius:10px;padding:8px 12px;font:600 15px var(--body);cursor:pointer}
.menu svg{width:20px;height:20px}

/* buttons */
.btn{display:inline-flex;align-items:center;gap:10px;padding:15px 24px;border-radius:999px;font:700 17px/1 var(--body);text-decoration:none;border:0;cursor:pointer}
.btn svg{width:20px;height:20px;position:relative;z-index:2}.btn span{position:relative;z-index:2}
.btn-y{background:var(--y);color:#111;box-shadow:0 10px 30px -10px rgba(245,196,0,.6)}
.btn-y:hover{background:var(--y2)}
.btn-o{border:2px solid #3a4049;color:var(--txt);direction:ltr}
.btn-o:hover{border-color:var(--y)}
.tag{display:inline-block;font:700 14px/1 var(--body);color:var(--y);margin-bottom:14px;padding-inline-start:30px;position:relative}
.tag::before{content:"";position:absolute;inset-inline-start:0;top:50%;width:22px;height:4px;margin-top:-2px;background:repeating-linear-gradient(90deg,var(--y) 0 8px,transparent 8px 12px)}
.sec-head{max-width:760px;margin-bottom:46px}
.sec-head p{color:var(--mut);font-size:19px}
.sec-head.light p{color:#4a4f57}.sec-head.light .tag{color:#7a5d00}.sec-head.light .tag::before{background:repeating-linear-gradient(90deg,#111 0 8px,transparent 8px 12px)}

/* hero: the licence card on the right, the claim on the left, lanes receding underneath */
.hero{position:relative;padding:56px 0 90px;background:radial-gradient(80% 70% at 75% 30%,#262a31 0,var(--ink) 70%);overflow:hidden}
.lanes{position:absolute;inset:auto 0 -30% 0;height:85%;perspective:520px;pointer-events:none;opacity:.5}
.lanes i{position:absolute;bottom:0;width:10px;height:150%;transform-origin:50% 100%;
 background:repeating-linear-gradient(0deg,rgba(245,196,0,.55) 0 60px,transparent 60px 120px)}
.lanes i:nth-child(1){left:22%;transform:rotateX(68deg) rotateZ(-14deg)}
.lanes i:nth-child(2){left:50%;transform:rotateX(68deg);background:repeating-linear-gradient(0deg,rgba(255,255,255,.4) 0 60px,transparent 60px 120px)}
.lanes i:nth-child(3){left:78%;transform:rotateX(68deg) rotateZ(14deg)}
.hero-in{position:relative;width:min(1180px,100% - 40px);margin-inline:auto;display:grid;grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr);gap:64px;align-items:center}
.licence{margin:0;justify-self:center;width:min(390px,100%);background:linear-gradient(160deg,#fbf8f1,#efe7d6);color:#16181c;border-radius:24px;padding:0 0 18px;
 box-shadow:0 2px 0 #fff inset,0 40px 80px -30px rgba(0,0,0,.85),0 0 0 1px rgba(0,0,0,.2)}
.lic-top{display:flex;justify-content:space-between;background:var(--y);border-radius:24px 24px 0 0;padding:12px 20px;font:800 17px/1 var(--disp);font-stretch:75%;color:#111}
.lic-photo{margin:16px 18px 0;border-radius:16px;overflow:hidden;aspect-ratio:4/5;background:#cfc8b8;box-shadow:inset 0 0 0 1px rgba(0,0,0,.12)}
.lic-photo img{width:100%;height:100%;object-fit:cover;object-position:50% 20%}
.lic-name{--p3-z:70px;position:relative;margin:-38px 30px 0;background:#121418;color:#fff;border-radius:12px;padding:12px 16px;box-shadow:0 18px 30px -12px rgba(0,0,0,.7);border-inline-start:6px solid var(--y)}
.lic-name b{display:block;font:800 25px/1.1 var(--disp);font-stretch:80%;color:var(--y)}
.lic-name span{font-size:15px;color:#cfd3d9}
.lic-rows{list-style:none;margin:14px 20px 0;padding:0;display:grid;gap:6px}
.lic-rows li{display:flex;justify-content:space-between;gap:10px;border-bottom:1px dashed #c9c0ac;padding-bottom:6px;font-size:15px}
.lic-rows span{color:#6a6458}
.lic-cats{display:flex;gap:6px;margin:12px 20px 0;flex-wrap:wrap}
.lic-cats i{font-style:normal;font:700 13px/1 var(--body);border:1.5px solid #16181c;border-radius:6px;padding:6px 8px}
.go-sign{--p3-z:110px;position:absolute;top:44%;inset-inline-end:-30px;width:68px;height:68px;border-radius:50%;background:var(--blue);display:grid;place-items:center;
 border:4px solid #fff;box-shadow:0 14px 30px -8px rgba(0,0,0,.7);color:#fff}
.go-sign svg{width:34px;height:34px;stroke-width:2.6}
.kicker{display:flex;align-items:center;gap:12px;color:var(--mut);font-weight:600;margin-bottom:22px}
.kicker .dash{width:46px;height:5px;background:repeating-linear-gradient(90deg,var(--y) 0 14px,transparent 14px 22px)}
.hero h1{font-size:clamp(38px,5vw,72px);font-weight:900;font-stretch:72%;line-height:1.02;margin-bottom:24px}
.hero h1 em{font-style:normal;color:var(--y)}
.lead{font-size:20px;color:#c9ced5;max-width:600px}
.cta{display:flex;flex-wrap:wrap;gap:14px;margin-top:30px}

/* road: the case as one road, the centre line paints itself and a car drives it as you scroll */
.road-sec{padding:110px 0;background:var(--asph)}
.road{position:relative;--prog:0}
.road::before{content:"";position:absolute;top:-20px;bottom:-20px;left:50%;width:120px;margin-left:-60px;background:#24282f;border-inline:3px solid rgba(255,255,255,.55);border-radius:8px}
.asphalt{position:absolute;top:0;bottom:0;left:50%;width:6px;margin-left:-3px;background:repeating-linear-gradient(180deg,rgba(255,255,255,.2) 0 16px,transparent 16px 32px)}
.asphalt i{position:absolute;top:0;left:0;right:0;height:calc(var(--prog)*100%);background:var(--y);box-shadow:0 0 14px rgba(245,196,0,.55);border-radius:3px}
.car{position:absolute;left:50%;top:calc(var(--prog)*100%);width:30px;height:50px;margin:-25px 0 0 18px;z-index:3;transition:top .12s linear}
.car svg{width:100%;height:100%;fill:var(--y);stroke:#111;stroke-width:1.2;filter:drop-shadow(0 0 14px rgba(245,196,0,.5))}
.car .glass{fill:#1b2430}
.stops{list-style:none;margin:0;padding:0;position:relative;display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);column-gap:200px;row-gap:34px}
.stop.far{margin:130px 0 -130px}
.post{position:relative;background:var(--asph2);border:1px solid var(--line);border-radius:18px;padding:24px 24px 20px;transition:border-color .4s}
.post::after{content:"";position:absolute;top:44px;inset-inline-end:-100px;width:100px;height:3px;background:repeating-linear-gradient(90deg,rgba(255,255,255,.35) 0 6px,transparent 6px 10px)}
.stop.far .post::after{inset-inline-end:auto;inset-inline-start:-100px}
.post h3{margin-top:14px}
.post p{color:#c3c8cf;font-size:17px;margin-bottom:10px}
.law{display:inline-block;font:600 14px/1 var(--body);color:var(--y);border:1px solid rgba(245,196,0,.45);border-radius:999px;padding:6px 12px}
.stop.lit .post{border-color:rgba(245,196,0,.55)}
.stop.end .post{background:var(--y);color:#111;border-color:var(--y)}
.stop.end .post p{color:#2a2a2a}

/* signs: services as road signs on a sideways strip (daylight) */
.sign{display:grid;place-items:center;width:92px;height:92px;flex:none;position:relative}
.sign svg{width:46%;height:46%;position:relative;z-index:2;stroke-width:2.3}
.sign.ring{border-radius:50%;background:#fff;border:10px solid var(--red);color:#111;box-shadow:0 0 0 2px #fff,0 6px 14px rgba(0,0,0,.25)}
.sign.blue{border-radius:14px;background:var(--blue);color:#fff;box-shadow:0 0 0 3px #fff inset,0 6px 14px rgba(0,0,0,.25)}
.sign.round{border-radius:50%;background:var(--blue);color:#fff;box-shadow:0 0 0 4px #fff inset,0 6px 14px rgba(0,0,0,.25)}
.sign.tri{color:#111;filter:drop-shadow(0 6px 8px rgba(0,0,0,.25))}
.sign.tri::before,.sign.tri::after{content:"";position:absolute;inset:0;clip-path:polygon(50% 3%,98% 92%,2% 92%);background:var(--red)}
.sign.tri::after{inset:15px 14px 12px;background:#fff}
.sign.tri svg{margin-top:16px;width:40%;height:40%}
.sign.mini{width:58px;height:58px;border-width:6px}
.sign.mini svg{width:58%;height:58%}
.signs-sec{padding:110px 0 100px;background:var(--paper);color:#16181c}
.strip-wrap{position:relative}
.strip{display:flex;gap:22px;overflow-x:auto;scroll-snap-type:x mandatory;padding:20px max(20px,calc((100% - 1180px)/2)) 40px;scrollbar-width:thin;scrollbar-color:#b9b19f transparent}
.plate-card{flex:0 0 272px;scroll-snap-align:start;background:#fff;border:1px solid #ddd5c4;border-radius:20px;padding:26px 24px 22px;display:flex;flex-direction:column;align-items:center;text-align:center}
.plate-card .pole{width:8px;height:26px;background:linear-gradient(90deg,#8d939b,#c9ced4,#8d939b);margin-bottom:14px}
.plate-card h3{margin-bottom:8px}
.plate-card p{color:#4a4f57;font-size:16.5px;margin:0}
.strip-nav{display:flex;gap:10px;width:min(1180px,100% - 40px);margin:0 auto}
.strip-nav button{width:52px;height:52px;border-radius:50%;border:2px solid #16181c;background:transparent;color:#16181c;display:grid;place-items:center;cursor:pointer}
.strip-nav button:hover{background:#16181c;color:var(--y)}
.strip-nav svg{width:22px;height:22px}
#prev svg{transform:scaleX(-1)}

/* office: what happens outside the courtroom */
.office-sec{padding:110px 0;background:linear-gradient(180deg,#1b1f25,#13161a)}
.office-in{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.1fr);gap:56px;align-items:start}
.office-txt p{color:#c3c8cf;font-size:19px}
.office-orb{--p3-size:150px;margin-top:30px}
.office-cards{display:grid;gap:18px}
.desk{background:var(--p3-solid);border:1px solid var(--line);border-inline-start:6px solid var(--y);border-radius:16px;padding:24px 26px}
.desk-k{display:inline-block;font:700 13px/1 var(--body);background:var(--blue);color:#fff;border-radius:6px;padding:6px 10px;margin-bottom:12px}
.desk p{color:#c3c8cf;margin:0;font-size:17px}

/* courts: a green highway sign over the night road */
.courts-sec{position:relative;padding:140px 0;overflow:hidden}
.courts-bg{position:absolute;inset:0;margin:0}
.courts-bg img{width:100%;height:100%;object-fit:cover}
.courts-bg::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(14,16,19,.55),rgba(14,16,19,.35) 50%,rgba(14,16,19,.8))}
.courts-bg figcaption,.read figcaption,.ill figcaption{position:absolute;z-index:2;bottom:12px;inset-inline-start:12px;background:rgba(0,0,0,.62);color:#fff;font-size:13px;padding:4px 10px;border-radius:999px}
.gsign{position:relative;z-index:2;max-width:640px;margin-inline:auto;background:var(--green);color:#fff;border-radius:16px;padding:32px 34px 26px;
 box-shadow:0 0 0 4px var(--green),0 0 0 7px #fff inset,0 40px 80px -30px rgba(0,0,0,.9)}
.gsign h2{font-size:clamp(28px,3.4vw,42px);text-align:center;border-bottom:3px solid #fff;padding-bottom:16px}
.dirs{list-style:none;margin:0 0 18px;padding:0;display:grid;gap:4px}
.dirs li{display:grid;grid-template-columns:44px 1fr auto;align-items:center;gap:14px;padding:10px 6px;border-bottom:1px solid rgba(255,255,255,.25)}
.dirs .arr svg{width:34px;height:34px;stroke-width:3}
.dirs b{font:800 30px/1 var(--disp);font-stretch:80%}
.dirs small{font-size:15px;opacity:.85}
.dirs .here{background:rgba(255,255,255,.12);border-radius:8px}
.gsign>p{margin:0;font-size:17px;color:#e6f2ea}

/* about: the facts as dashboard gauges with an odometer */
.about-sec{padding:110px 0;background:var(--asph)}
.about-in{display:grid;grid-template-columns:minmax(0,1.15fr) minmax(0,.85fr);gap:60px;align-items:center}
.about-txt .big{font-size:22px;line-height:1.6;color:#e2e5e9}
.about-txt p{color:#b8bec7}
.dash-board{background:#0f1215;border:1px solid var(--line);border-radius:26px;padding:28px;display:grid;gap:18px;box-shadow:inset 0 0 60px rgba(0,0,0,.6)}
.gauge{border-inline-start:4px solid var(--y);padding-inline-start:16px}
.gauge b{display:block;font:800 22px/1.2 var(--disp);font-stretch:80%;color:var(--y)}
.gauge p{margin:4px 0 0;color:#c3c8cf;font-size:16.5px}
.odo{display:flex;align-items:center;gap:6px;margin-top:6px}
.odo span{display:grid;place-items:center;width:46px;height:62px;background:#1f2329;border:1px solid #3a4049;border-radius:8px;font:800 40px/1 var(--disp);color:#fff;overflow:hidden}
.odo .plus{color:var(--y)}
.odo small{margin-inline-start:12px;color:var(--mut);font-size:15px}
.p3-live .odo span{transform:translateY(0);transition:transform .9s cubic-bezier(.2,.8,.2,1)}
.p3-live .odo:not(.in) span{transform:translateY(-14px);opacity:.4}

/* hours: lane yellow band with a full 24-hour dial */
.hours-sec{padding:90px 0;background:var(--y);color:#111}
.hours-in{display:grid;grid-template-columns:auto minmax(0,1fr);gap:60px;align-items:center}
.dial{position:relative;width:220px;height:220px}
.dial svg{width:100%;height:100%;transform:rotate(-90deg)}
.dial circle{stroke-width:12;fill:none}
.dial .track{stroke:rgba(0,0,0,.14)}
.dial .full{stroke:#111;stroke-dasharray:100;stroke-dashoffset:0;transition:stroke-dashoffset 1.6s cubic-bezier(.3,.7,.2,1)}
.p3-live .dial:not(.in) .full{stroke-dashoffset:100}
.dial b{position:absolute;inset:0;display:grid;place-items:center;font:900 52px/1 var(--disp);font-stretch:72%;direction:ltr}
.hours-txt h2{font-size:clamp(32px,4vw,52px)}
.hours-txt>p{font-size:20px}
.facts{list-style:none;margin:0 0 22px;padding:0;display:grid;gap:8px}
.facts li{display:grid;grid-template-columns:90px 1fr;gap:12px;border-top:2px solid rgba(0,0,0,.18);padding-top:8px}
.facts a{direction:ltr;display:inline-block}
.maps{display:inline-flex;align-items:center;gap:8px;font-weight:700;color:#111}
.maps svg{width:18px;height:18px}

/* FAQ: dashboard warning lights */
.faq-sec{padding:110px 0;background:var(--ink)}
.faq-in{display:grid;grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr);gap:56px;align-items:start}
.faq-in .sec-head{position:sticky;top:110px}
.faq{display:grid;gap:12px}
.q{background:var(--asph2);border:1px solid var(--line);border-radius:16px}
.q summary{list-style:none;cursor:pointer;display:flex;align-items:center;gap:16px;padding:20px 22px;font:700 19px/1.35 var(--body)}
.q summary::-webkit-details-marker{display:none}
.q summary::before{content:"";flex:none;width:16px;height:16px;border-radius:50%;background:#3a4049;box-shadow:0 0 0 4px rgba(255,255,255,.05);transition:.3s}
.q[open] summary::before{background:var(--y);box-shadow:0 0 0 4px rgba(245,196,0,.2),0 0 18px rgba(245,196,0,.8)}
.q p{margin:0;padding:0 54px 22px 22px;color:#c3c8cf}

/* contact: a ticket you fill in */
.contact-sec{padding:110px 0;background:var(--paper);color:#16181c}
.contact-in{display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);gap:60px;align-items:start}
.contact-txt p{font-size:19px;color:#3d424a}
.contact-txt .alt a{font-weight:700;direction:ltr;display:inline-block}
.ticket{background:#fff;border-radius:6px 6px 18px 18px;padding:0 28px 28px;box-shadow:0 30px 60px -30px rgba(0,0,0,.45);position:relative;
 -webkit-mask:radial-gradient(circle 8px at 50% 0,transparent 98%,#000) top/22px 100% repeat-x;mask:radial-gradient(circle 8px at 50% 0,transparent 98%,#000) top/22px 100% repeat-x}
.ticket-head{display:flex;justify-content:space-between;align-items:center;margin:0 -28px 22px;padding:26px 28px 18px;background:#16181c;color:var(--y);font:800 22px/1 var(--disp);font-stretch:80%}
.code{width:120px;height:30px;background:repeating-linear-gradient(90deg,var(--y) 0 2px,transparent 2px 5px,var(--y) 5px 6px,transparent 6px 10px)}
.ticket label{display:block;font-weight:700;font-size:16px;margin-bottom:16px}
.ticket input,.ticket select,.ticket textarea{display:block;width:100%;margin-top:6px;font:400 17px var(--body);color:#16181c;background:#f7f5ef;border:0;border-bottom:2px solid #16181c;border-radius:8px 8px 0 0;padding:12px 14px}
.ticket input:focus,.ticket select:focus,.ticket textarea:focus{outline:none;border-color:var(--blue);background:#eef3fb}
.err{color:var(--red);font-weight:700;min-height:1.4em;margin:0 0 12px}

/* read */
.read-sec{padding:100px 0;background:var(--asph)}
.read-sec h2{font-size:clamp(28px,3.4vw,42px)}
.read{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.1fr);gap:0;text-decoration:none;background:var(--asph2);border:1px solid var(--line);border-radius:22px;overflow:hidden;transition:border-color .3s}
.read:hover{border-color:var(--y)}
.read figure{position:relative;margin:0;min-height:260px}
.read figure img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.read-txt{padding:34px}
.read-txt h2,.read-txt h3{font-size:clamp(24px,2.6vw,32px)}
.read-txt p{color:#c3c8cf}
.more{display:inline-flex;align-items:center;gap:8px;color:var(--y);font-weight:700}
.more svg{width:18px;height:18px}

/* inner pages */
.page-head{padding:70px 0 54px;background:radial-gradient(70% 90% at 80% 0,#262a31,var(--ink));border-bottom:6px solid transparent;border-image:repeating-linear-gradient(90deg,var(--y) 0 40px,transparent 40px 64px) 6}
.page-head h1{font-size:clamp(34px,5vw,62px);font-stretch:74%;font-weight:900;max-width:960px}
.page-head p{color:#c3c8cf;font-size:19px;max-width:760px}
.crumbs{display:flex;flex-wrap:wrap;gap:8px;color:var(--mut);font-size:15px;margin-bottom:22px}
.crumbs a{color:var(--y)}
.meta{display:flex;gap:18px;flex-wrap:wrap;font-size:15px!important;color:var(--mut)!important}
.art{background:var(--paper);color:#1b1d21;padding:60px 0 90px}
.art-in{display:grid;grid-template-columns:minmax(0,1fr) 270px;gap:56px;align-items:start}
.art-body{font-size:19px;line-height:1.75;max-width:760px}
.art-body h2{font-size:clamp(26px,3vw,36px);margin-top:1.6em;scroll-margin-top:90px}
.art-body ul{padding-inline-start:22px}
.art-body li{margin-bottom:6px}
.art-body a{color:var(--blue)}
.ill{position:relative;margin:0 0 30px;border-radius:18px;overflow:hidden}
.src{font-size:16px;color:#4a4f57;border-top:2px solid var(--paper2);padding-top:18px;margin-top:40px}
.cta-box{background:#16181c;color:#fff;border-radius:20px;padding:30px;margin-top:30px}
.cta-box h2{margin-top:0;color:var(--y)}
.cta-box p{color:#cfd3d9}
.cta-alt{margin:14px 0 0}.cta-alt a{color:var(--y)!important}
.toc{position:sticky;top:96px;background:#fff;border:1px solid var(--paper2);border-radius:16px;padding:20px 22px;font-size:15.5px}
.toc b{display:block;font:800 19px var(--disp);font-stretch:80%;margin-bottom:8px}
.toc ol{margin:0;padding-inline-start:20px}
.toc li{margin-bottom:6px}
.toc a{color:#1b1d21;text-decoration:none}.toc a:hover{color:var(--blue)}
.list{padding:60px 0 100px;background:var(--asph)}

.foot{background:#0a0b0d;border-top:1px solid var(--line);padding:40px 0;color:var(--mut);font-size:15.5px}
.foot-in{width:min(1180px,100% - 40px);margin-inline:auto}
.foot b{color:var(--txt)}
.foot a{color:var(--y)}
.fine{font-size:13.5px;opacity:.8}

@media (max-width:1020px){
 .nav{display:none;position:absolute;top:100%;inset-inline:0;flex-direction:column;gap:0;background:#0e1013;border-bottom:1px solid var(--line);padding:8px 20px 16px}
 .nav.open{display:flex}
 .nav a{padding:12px 0;border-bottom:1px solid var(--line);font-size:18px;color:var(--txt)}
 .menu{display:inline-flex;margin-inline-start:auto}
 .bar-tel span{display:none}
}
@media (max-width:860px){
 body{font-size:17px}
 .hero{padding:30px 0 70px}
 .hero-in{grid-template-columns:minmax(0,1fr);gap:40px}
 .licence{width:min(310px,84%)}
 .lic-photo{aspect-ratio:1/1}
 .go-sign{width:54px;height:54px;inset-inline-end:-18px}
 .road-sec,.signs-sec,.office-sec,.about-sec,.faq-sec,.contact-sec{padding:80px 0}
 .road::before{left:auto;right:6px;width:40px;margin:0;border-width:2px}
 .asphalt{left:auto;right:23px;margin:0}
 .stops{grid-template-columns:minmax(0,1fr)}
 .stop.far{margin:0}
 .car{left:auto;right:12px;width:20px;height:34px;margin:-17px 0 0}
 .stop,.stop.far{padding-inline-start:64px}
 .post::after,.stop.far .post::after{inset-inline-start:-18px;inset-inline-end:auto;width:18px}
 .plate-card{flex-basis:78vw}
 .office-in,.about-in,.contact-in,.art-in{grid-template-columns:minmax(0,1fr);gap:36px}
 .hours-in{grid-template-columns:minmax(0,1fr);gap:28px;justify-items:start}
 .dial{width:170px;height:170px}
 .courts-sec{padding:90px 0}
 .gsign{padding:26px 20px 20px}
 .dirs b{font-size:26px}
 .read{grid-template-columns:minmax(0,1fr)}
 .read figure{min-height:200px}
 .toc{position:static;order:-1}
 .q p{padding:0 22px 20px}
 .faq-in{grid-template-columns:minmax(0,1fr);gap:0}
 .faq-in .sec-head{position:static}
}