/* Marlowe Bros. Motor Service — "a 1962 service-station sign, repainted" (glossy, 2026) */
:root{
  --red:#E2131F; --red-d:#A80B15; --navy:#0A1C4A; --navy-d:#050E28; --navy-l:#132D73; --white:#fff; --ink:#0A1C4A;
  --pad:clamp(20px,5vw,80px);
  --snap:cubic-bezier(.2,1.5,.4,1); --out:cubic-bezier(.2,.8,.2,1);
}
*,*::before,*::after{box-sizing:border-box}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}
body{margin:0;background:var(--navy);color:var(--ink);font:500 1.0625rem/1.55 "Work Sans",system-ui,sans-serif;-webkit-font-smoothing:antialiased}
h1,h2,h3,p,ul,dl,dd,figure,table{margin:0;padding:0}
ul{list-style:none}
img{display:block;width:100%;height:auto}
a{color:inherit}
:focus-visible{outline:4px solid #FFD23F;outline-offset:3px;border-radius:6px}

.red{background:var(--red);color:#fff}
.navy{background:var(--navy);color:#fff}
.white{background:#fff;color:var(--ink)}
section{position:relative;padding:clamp(4rem,9vw,8rem) calc(var(--pad) + clamp(0px,6vw,90px)) clamp(4rem,9vw,8rem) var(--pad);overflow:hidden}

.script{font:400 clamp(1.7rem,3vw,2.8rem)/1 Yellowtail,cursive;color:#fff;transform:rotate(-4deg);transform-origin:left bottom;display:inline-block;margin-bottom:.4rem;text-shadow:.05em .05em 0 var(--navy)}
.script-red{color:var(--red);text-shadow:none}
.white .script-red{text-shadow:none}
h2{font:400 clamp(2.6rem,7.4vw,7.4rem)/.92 "Alfa Slab One",Georgia,serif;letter-spacing:-.01em;text-transform:uppercase;text-wrap:balance}
.red h2,.navy h2{text-shadow:.045em .045em 0 var(--navy-d)}
.navy h2{text-shadow:.045em .045em 0 var(--red)}
.white h2{color:var(--navy);text-shadow:.045em .045em 0 var(--red)}
.sec-head{max-width:64rem;margin-bottom:clamp(2.2rem,5vw,4.5rem)}
.sec-p{font-size:clamp(1.1rem,1.5vw,1.35rem);max-width:40rem;margin-top:1.4rem}

/* racing stripes down the page */
main{position:relative}
.stripes{position:absolute;top:0;bottom:0;right:clamp(14px,3.4vw,56px);width:clamp(34px,4.4vw,66px);z-index:5;display:flex;pointer-events:none}
.stripes i{display:block;height:100%}
.stripes i:nth-child(1),.stripes i:nth-child(3){flex:1;background:#fff}
.stripes i:nth-child(2){flex:2.2;background:var(--navy)}
.js .stripes{transform-origin:top;animation:lay 1.6s var(--out) .1s both}
@keyframes lay{from{transform:scaleY(0)}to{transform:none}}

/* enamel buttons */
.btn{--sh:var(--navy-d);display:inline-flex;align-items:center;justify-content:center;min-height:64px;padding:.4rem 1.9rem;border-radius:16px;border:3px solid var(--navy-d);font:400 1.2rem/1 "Alfa Slab One",serif;letter-spacing:.02em;text-transform:uppercase;text-decoration:none;cursor:pointer;position:relative;box-shadow:0 8px 0 var(--sh),inset 0 3px 0 rgba(255,255,255,.55),inset 0 -4px 0 rgba(0,0,0,.14);background-image:linear-gradient(180deg,rgba(255,255,255,.28),rgba(255,255,255,0) 46%);transition:transform .12s ease-out,box-shadow .12s ease-out}
.btn:hover,.btn:focus-visible{transform:translateY(3px);box-shadow:0 5px 0 var(--sh),inset 0 3px 0 rgba(255,255,255,.55),inset 0 -4px 0 rgba(0,0,0,.14)}
.btn:active{transform:translateY(8px);box-shadow:0 0 0 var(--sh),inset 0 4px 8px rgba(0,0,0,.3)}
.btn-white{background-color:#fff;color:var(--navy)}
.btn-navy{background-color:var(--navy);color:#fff;border-color:#fff;--sh:var(--navy-d)}
.btn-red{background-color:var(--red);color:#fff;border-color:var(--navy);--sh:var(--navy)}
.btn-sm{min-height:48px;font-size:1rem;padding:.2rem 1.2rem;border-radius:12px;box-shadow:0 5px 0 var(--sh),inset 0 2px 0 rgba(255,255,255,.5)}
.btn-sm:hover{transform:translateY(2px);box-shadow:0 3px 0 var(--sh),inset 0 2px 0 rgba(255,255,255,.5)}
.btn-sm:active{transform:translateY(5px);box-shadow:0 0 0 var(--sh)}

/* header */
.top{position:sticky;top:0;z-index:60;display:flex;align-items:center;gap:1.5rem;padding:.55rem var(--pad) .8rem;background:#fff;border-bottom:5px solid var(--navy)}
.brand{display:flex;align-items:center;gap:.7rem;text-decoration:none;color:var(--navy);margin-right:auto}
.brand .roundel{width:52px;height:52px;flex:none}
.brand-t{display:grid;line-height:1}
.brand-t b{font:400 1.4rem/1 "Alfa Slab One",serif;text-transform:uppercase;letter-spacing:.01em}
.brand-t i{font:400 1.25rem/1 Yellowtail,cursive;color:var(--red);font-style:normal}
.top nav{display:flex;gap:1.5rem}
.top nav a{font-weight:700;font-size:.98rem;text-decoration:none;padding:.8rem 0;color:var(--navy);box-shadow:inset 0 -4px 0 transparent;transition:box-shadow .25s var(--out),color .25s}
.top nav a:hover,.top nav a:focus-visible{box-shadow:inset 0 -4px 0 var(--red);color:var(--red)}

/* svg lettering */
.cap-t{fill:#fff;font:700 21px "Work Sans",sans-serif;letter-spacing:2.5px}
.rd-t{font-size:24px}
.cap-n{font:400 40px "Alfa Slab One",serif}
.g-nums text{fill:#fff;font:400 36px "Alfa Slab One",serif}
.g-cap{fill:#fff;font:700 15px "Work Sans",sans-serif;letter-spacing:3.5px}
.g-cap-s{font-size:12px}
.g-odo-n{fill:#fff;font:400 30px "Alfa Slab One",serif;letter-spacing:3px}

/* hero */
.hero{min-height:calc(100svh - 125px);display:grid;grid-template-columns:minmax(0,1.5fr) minmax(0,1fr);gap:2rem;align-items:center;padding-top:clamp(1.6rem,3vw,3rem);padding-bottom:clamp(3rem,5vw,5rem);overflow:visible;z-index:2;background-image:radial-gradient(120% 90% at 20% 0%,#FF3A45 0%,var(--red) 45%,#C50D18 100%)}
.hero .script{font-size:clamp(1.9rem,3.2vw,3rem);margin-bottom:.6rem}
h1{font:400 clamp(3.2rem,7.2vw,8rem)/.88 "Alfa Slab One",Georgia,serif;text-transform:uppercase;letter-spacing:-.015em}
h1 span{display:block;overflow:hidden;padding:.06em .08em .1em 0;margin-bottom:-.06em}
h1 b{display:block;font-weight:400;text-shadow:.045em .045em 0 var(--navy-d)}
.js h1 b{animation:slam .9s var(--out) both}
.js h1 span:nth-child(2) b{animation-delay:.12s}
.js h1 span:nth-child(3) b{animation-delay:.24s}
@keyframes slam{from{transform:translateY(110%) skewY(4deg)}to{transform:none}}
.hero-p{font-size:clamp(1.12rem,1.5vw,1.4rem);max-width:33rem;margin-top:1.6rem;font-weight:500}
.hero-cta{display:flex;flex-wrap:wrap;gap:1rem;margin-top:2rem}
.js .hero-p,.js .hero-cta{animation:fade 1s var(--out) .6s both}
@keyframes fade{from{opacity:0;transform:translateY(24px)}to{opacity:1;transform:none}}
.dial{position:relative;align-self:end;margin-bottom:clamp(-8rem,-7vw,-4rem);justify-self:center;width:min(100%,600px);z-index:4;filter:drop-shadow(0 26px 30px rgba(5,14,40,.5))}
.gauge{display:block;width:100%;height:auto;overflow:visible}
.js .dial{animation:spinin 1.1s var(--snap) .15s both}
@keyframes spinin{from{opacity:0;transform:rotate(-120deg) scale(.4)}to{opacity:1;transform:none}}
.needle{transform-box:view-box;transform-origin:300px 300px;transform:rotate(81deg)}
.js .needle{transform:rotate(-135deg)}
.js .needle.test{animation:selftest 1.9s cubic-bezier(.5,0,.3,1) 1.1s both}
@keyframes selftest{0%{transform:rotate(-135deg)}48%{transform:rotate(135deg)}60%{transform:rotate(135deg)}100%{transform:rotate(-135deg)}}
.needle.live{transition:transform .25s ease-out}

/* dash */
.dash{padding-top:clamp(3rem,6vw,5rem);padding-bottom:clamp(3rem,6vw,5rem);border-top:8px solid #fff;border-bottom:8px solid #fff;z-index:1}
.dash-nums{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:2rem;max-width:min(58%,52rem)}
.dash-nums b{display:block;font:400 clamp(2.8rem,6vw,6rem)/.95 "Alfa Slab One",serif;color:#fff;text-shadow:.05em .05em 0 var(--red);font-variant-numeric:tabular-nums}
.dash-nums span{display:block;margin-top:.7rem;font-size:1rem;max-width:15rem;color:#fff}

/* service board */
.board{position:relative;background:var(--navy);background-image:linear-gradient(160deg,rgba(255,255,255,.2) 0%,rgba(255,255,255,0) 32%),radial-gradient(90% 120% at 50% 0%,var(--navy-l),var(--navy) 70%);color:#fff;border-radius:34px;padding:clamp(2rem,4.5vw,4.5rem) clamp(1.4rem,4.5vw,5rem) clamp(1.8rem,3vw,3rem);border:6px solid var(--navy);box-shadow:inset 0 0 0 5px #fff,0 14px 0 var(--red),0 40px 50px -20px rgba(10,28,74,.5)}
.screw{position:absolute;width:20px;height:20px;border-radius:50%;background:radial-gradient(circle at 35% 30%,#fff,#9EABC4 70%);box-shadow:inset 0 -2px 0 rgba(0,0,0,.3)}
.screw::after{content:"";position:absolute;left:3px;right:3px;top:9px;height:2px;background:#5a6785;transform:rotate(-35deg)}
.s1{left:26px;top:26px}.s2{right:26px;top:26px}.s3{left:26px;bottom:26px}.s4{right:26px;bottom:26px}
.board-title{font:400 clamp(2rem,4.6vw,4.4rem)/1 "Alfa Slab One",serif;text-transform:uppercase;text-align:center;margin-bottom:clamp(1.5rem,3vw,3rem);text-shadow:.05em .05em 0 var(--red)}
.board-title .script{font-size:1.15em;text-transform:none;color:#fff;margin:0 .1em 0 0;text-shadow:.04em .04em 0 var(--red)}
.board ul{display:grid;grid-template-columns:1fr 1fr;gap:0 clamp(2rem,5vw,6rem)}
.board li{display:flex;align-items:baseline;gap:.7rem;padding:1.05rem 0;border-bottom:2px solid rgba(255,255,255,.22);transition:transform .3s var(--out)}
.board li:hover{transform:translateX(8px)}
.job{font:400 clamp(1.05rem,1.55vw,1.5rem)/1.1 "Alfa Slab One",serif;text-transform:uppercase;letter-spacing:.02em}
.dots{flex:1;min-width:1.2rem;border-bottom:4px dotted rgba(255,255,255,.55);transform:translateY(-.3em)}
.amt{font:400 clamp(1.3rem,2.1vw,2.1rem)/1 "Alfa Slab One",serif;color:#fff;background:var(--red);padding:.28em .5em .3em;border-radius:10px;white-space:nowrap;box-shadow:inset 0 2px 0 rgba(255,255,255,.4),0 3px 0 var(--navy-d)}
.amt small{font:700 .42em "Work Sans",sans-serif;text-transform:uppercase;letter-spacing:.1em;margin-right:.5em;vertical-align:.35em}
.board-foot{text-align:center;font-size:.95rem;margin-top:1.8rem;color:#fff}

/* cost table */
.cost{background-image:radial-gradient(110% 80% at 85% 0%,#FF3A45 0%,var(--red) 50%,#C50D18 100%)}
.table-wrap{background:#fff;color:var(--navy);border-radius:28px;border:6px solid var(--navy);box-shadow:0 14px 0 var(--navy-d);overflow:hidden}
table{width:100%;border-collapse:collapse}
thead th{background:var(--navy);color:#fff;font:400 clamp(.95rem,1.3vw,1.2rem)/1.1 "Alfa Slab One",serif;text-transform:uppercase;letter-spacing:.04em;text-align:left;padding:1.3rem clamp(1rem,2.4vw,2.2rem)}
tbody th{font:400 clamp(1.1rem,1.7vw,1.6rem)/1.1 "Alfa Slab One",serif;text-transform:uppercase;text-align:left;color:var(--navy)}
tbody th,tbody td{padding:1.15rem clamp(1rem,2.4vw,2.2rem);border-bottom:2px solid rgba(10,28,74,.14)}
tbody td{font-weight:700;font-size:clamp(1.05rem,1.4vw,1.3rem);color:var(--red-d);font-variant-numeric:tabular-nums;white-space:nowrap}
tbody td:last-child{color:var(--navy);font-weight:500}
tbody tr{transition:background .25s}
tbody tr:hover{background:#FFF1B8}
.table-note{padding:1.2rem clamp(1rem,2.4vw,2.2rem) 1.5rem;font-size:1rem}

/* promise */
.promise-grid{display:grid;grid-template-columns:minmax(0,1.3fr) minmax(0,1fr);gap:clamp(2rem,5vw,6rem);align-items:center}
.promise h2{font-size:clamp(2.8rem,8.4vw,8.6rem)}
.promise-fig{border-radius:28px;overflow:hidden;border:6px solid #fff;box-shadow:14px 14px 0 var(--red);transform:rotate(2.5deg)}
.promise-fig img{aspect-ratio:4/4.6;object-fit:cover}
.caps{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:clamp(1rem,2.4vw,2.5rem);margin-top:clamp(3rem,6vw,6rem)}
.caps li{text-align:center}
.cap{display:block;width:min(100%,250px);height:auto;margin:0 auto 1rem;filter:drop-shadow(0 12px 12px rgba(0,0,0,.45));overflow:visible}
.caps p{font-size:1rem}
.caps b{display:block;font:400 1.15rem/1.15 "Alfa Slab One",serif;text-transform:uppercase;letter-spacing:.02em;margin-bottom:.3rem}
.js [data-cap] .cap{opacity:0;transform:rotate(-260deg) scale(.15)}
.js [data-cap].in .cap{opacity:1;transform:rotate(var(--tilt,-6deg));transition:transform 1.1s var(--snap),opacity .3s}
.caps li:nth-child(2){--tilt:5deg}.caps li:nth-child(3){--tilt:-3deg}.caps li:nth-child(4){--tilt:7deg}
.js [data-cap]:nth-child(2) .cap{transition-delay:.12s}.js [data-cap]:nth-child(3) .cap{transition-delay:.24s}.js [data-cap]:nth-child(4) .cap{transition-delay:.36s}

/* shop */
.shop{padding-top:0;padding-left:0;padding-right:0}
.shop-wide{position:relative}
.shop-wide img{height:min(78svh,760px);object-fit:cover;object-position:50% 60%}
.shop-wide figcaption{position:absolute;left:var(--pad);bottom:clamp(1.2rem,3vw,2.6rem);font:400 clamp(1.6rem,3.6vw,3.4rem)/1 "Alfa Slab One",serif;text-transform:uppercase;color:#fff;text-shadow:.05em .05em 0 var(--navy-d)}
.shop-wide figcaption .script{font-size:1.2em;text-transform:none;margin:0 .15em 0 0}
.shop-grid{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));gap:clamp(1rem,2vw,2rem);padding:clamp(3rem,7vw,6.5rem) calc(var(--pad) + clamp(0px,6vw,90px)) 0 var(--pad);align-items:start}
.shop-copy{grid-column:1/6}
.shop-copy h2{font-size:clamp(2.4rem,5.2vw,5.2rem);margin-bottom:1.6rem}
.shop-copy p{font-size:1.12rem;margin-bottom:1.1rem;max-width:32rem}
.shop-copy .btn{margin-top:1rem}
.ph{border-radius:24px;overflow:hidden;border:5px solid var(--navy);box-shadow:10px 10px 0 var(--red)}
.ph img{object-fit:cover;height:100%}
.ph1{grid-column:6/13}.ph1 img{aspect-ratio:3/2}
.ph2{grid-column:8/13;box-shadow:10px 10px 0 var(--navy)}.ph2 img{aspect-ratio:4/4.4;object-position:50% 70%}
.ph3{grid-column:4/8;margin-top:-6rem;transform:rotate(-3deg)}.ph3 img{aspect-ratio:1}

/* reviews */
.reviews{background-image:radial-gradient(110% 80% at 10% 0%,#FF3A45 0%,var(--red) 50%,#C50D18 100%)}
.rev-head{display:grid;grid-template-columns:auto minmax(0,1fr);gap:clamp(1.5rem,4vw,4.5rem);align-items:center;margin-bottom:clamp(2.5rem,5vw,4.5rem)}
.shield{position:relative;width:clamp(170px,20vw,290px);filter:drop-shadow(0 16px 14px rgba(5,14,40,.45))}
.shield svg{display:block;width:100%;height:auto}
.shield-n{position:absolute;left:0;right:0;top:20%;text-align:center;font:400 clamp(3.4rem,6.6vw,6.4rem)/1 "Alfa Slab One",serif;color:#fff}
.shield-s{position:absolute;left:22%;right:22%;top:58%}
.rev-head h2{font-size:clamp(2.4rem,6vw,6rem)}
.rev-list{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:clamp(1.2rem,2.4vw,2.4rem)}
.rev-list li{background:#fff;color:var(--navy);border-radius:24px;border:5px solid var(--navy);box-shadow:0 10px 0 var(--navy-d);padding:clamp(1.4rem,2.6vw,2.4rem)}
.rev-list li:nth-child(odd){transform:rotate(-.8deg)}.rev-list li:nth-child(even){transform:rotate(.7deg)}
.rev-list p{font-size:clamp(1.15rem,1.6vw,1.45rem);line-height:1.35;font-weight:700}
.rev-list footer{margin-top:1rem;font-size:.95rem;font-weight:700;color:var(--red-d);text-transform:uppercase;letter-spacing:.06em}

/* find */
.find-grid{display:grid;grid-template-columns:minmax(0,1.15fr) minmax(0,1fr);gap:clamp(2rem,5vw,6rem);align-items:start}
.find h2{font-size:clamp(2.4rem,5.6vw,5.6rem)}
.find-fig{margin:2rem 0;border-radius:24px;overflow:hidden;border:5px solid var(--navy);box-shadow:10px 10px 0 var(--red)}
.find-fig img{aspect-ratio:16/9;object-fit:cover}
.find dl{display:grid;grid-template-columns:1fr 1fr;gap:1.6rem 2rem}
.find dt{font:400 1rem/1 "Alfa Slab One",serif;text-transform:uppercase;letter-spacing:.06em;color:var(--red);margin-bottom:.4rem}
.find dd{font-weight:500}
.find dd a{display:inline-block;padding:.3rem 0;font-weight:700;text-decoration-color:var(--red);text-decoration-thickness:3px;text-underline-offset:4px;word-break:break-word}
.form{background:var(--navy);color:#fff;border-radius:28px;border:6px solid var(--navy);box-shadow:inset 0 0 0 4px #fff,0 14px 0 var(--red);padding:clamp(1.8rem,3.4vw,3rem);display:grid;gap:1.1rem;background-image:linear-gradient(160deg,rgba(255,255,255,.18),rgba(255,255,255,0) 30%)}
.form-title{font:400 clamp(1.8rem,3vw,2.6rem)/1 "Alfa Slab One",serif;text-transform:uppercase;text-shadow:.05em .05em 0 var(--red)}
.form-title .script{font-size:1.25em;text-transform:none;color:#fff;margin:0 .1em 0 0;text-shadow:.04em .04em 0 var(--red)}
.form label{display:grid;gap:.4rem;font-weight:700;font-size:.95rem}
.form input,.form select,.form textarea{font:500 1.05rem "Work Sans",sans-serif;color:var(--navy);background:#fff;border:3px solid #fff;border-radius:12px;padding:.75rem .9rem;min-height:50px;width:100%;box-shadow:inset 0 3px 0 rgba(10,28,74,.15)}
.form input:focus,.form select:focus,.form textarea:focus{outline:4px solid #FFD23F;outline-offset:1px}
.form ::placeholder{color:#5d6a8c}
.form .btn{margin-top:.6rem;--sh:var(--navy-d);border-color:#fff}
.form-note{font-weight:700;background:#fff;color:var(--red-d);padding:.8rem 1rem;border-radius:12px}

/* footer */
.foot{position:relative}
.checker{height:32px;background:conic-gradient(#fff 25%,var(--navy) 0 50%,#fff 0 75%,var(--navy) 0) 0 0/32px 32px}
.foot-in{padding:clamp(2.5rem,5vw,4.5rem) var(--pad) 2.5rem}
.foot-mark{display:flex;flex-wrap:wrap;align-items:baseline;gap:.2em .5em;margin-bottom:2.2rem}
.foot-mark .script{font-size:clamp(3rem,8vw,8rem);color:#fff;text-shadow:.04em .04em 0 var(--red);margin:0}
.foot-mark b{font:400 clamp(1.6rem,4vw,4rem)/1 "Alfa Slab One",serif;text-transform:uppercase}
.foot-cols{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:1.5rem;font-size:1rem}
.foot a{display:inline-block;padding:.2rem 0;text-underline-offset:4px;word-break:break-word}
.dock{display:none}

/* entrances */
.js [data-pop]{opacity:0;transform:rotate(-14deg) scale(.6)}
.js [data-pop].in{opacity:1;transform:rotate(-4deg);transition:transform .8s var(--snap),opacity .3s}
.js .shield[data-pop].in{transform:none}
.js [data-rise]{opacity:0;translate:0 50px}
.js [data-rise].in{opacity:1;translate:0 0;transition:translate .9s var(--out),opacity .6s}
.js .rev-list li:nth-child(even),.js .ph2{transition-delay:.12s}

@media (max-width:1020px){
  .top nav{display:none}
  .hero{grid-template-columns:minmax(0,1fr);padding-bottom:0}
  .dial{width:min(84vw,460px);margin:1.5rem auto clamp(-9rem,-24vw,-7rem)}
  .dash{padding-top:clamp(9rem,27vw,12rem)}
  .dash-nums{max-width:none}
  .promise-grid,.find-grid{grid-template-columns:1fr}
  .promise-fig{max-width:460px}
  .caps{grid-template-columns:repeat(2,minmax(0,1fr))}
  .shop-copy{grid-column:1/-1}.ph1{grid-column:1/-1}.ph2{grid-column:6/13}.ph3{grid-column:1/6;margin-top:0}
}
@media (max-width:760px){
  body{padding-bottom:62px;font-size:1.02rem}
  section{padding-right:var(--pad)}
  .stripes{display:none}
  .top{padding:.45rem 16px .6rem;gap:.6rem;overflow-x:clip}
  .brand{min-height:44px}
  .find dd a,.foot a{padding:.7rem 0}
  .brand .roundel{width:42px;height:42px}
  .brand-t b{font-size:.98rem;white-space:nowrap}.brand-t i{font-size:1rem}
  .btn-sm{font-size:.84rem;padding:.2rem .7rem;white-space:nowrap}
  .hero{min-height:0;padding-top:2.2rem;border-right:0}
  h1{font-size:12.4vw}
  .hero .script{font-size:7.4vw}
  .hero-cta .btn{flex:1 1 100%}
  .dash-nums{grid-template-columns:1fr;gap:1.6rem}
  .dash-nums b{font-size:clamp(2.6rem,12vw,4rem)}
  .board{border-radius:24px;padding-top:2.6rem}
  .board ul{grid-template-columns:1fr}
  .screw{width:14px;height:14px}.screw::after{top:6px;left:2px;right:2px}
  .s1,.s2{top:16px}.s3,.s4{bottom:16px}.s1,.s3{left:16px}.s2,.s4{right:16px}
  .job{font-size:1rem}
  .amt{font-size:1.2rem}
  table,thead,tbody,tr,th,td{display:block}
  thead{position:absolute;left:-9999px}
  tbody tr{padding:1.1rem 1.1rem .9rem;border-bottom:3px solid var(--navy)}
  tbody th,tbody td{padding:0;border:0}
  tbody th{margin-bottom:.6rem;font-size:1.25rem}
  tbody td{display:flex;justify-content:space-between;gap:1rem;padding:.25rem 0;white-space:normal}
  tbody td::before{content:attr(data-l);font-weight:500;color:var(--navy);font-size:.95rem}
  .shop-grid{padding-right:var(--pad)}
  .shop-wide img{height:62svh}
  .ph2{grid-column:3/13}.ph3{grid-column:1/9;margin-top:-3rem}
  .rev-head{grid-template-columns:1fr}
  .shield{width:170px}
  .rev-list{grid-template-columns:1fr}
  .find dl{grid-template-columns:1fr}
  .foot-cols{grid-template-columns:1fr}
  .dock{position:fixed;left:0;right:0;bottom:0;z-index:2147483100;display:grid;grid-template-columns:1.3fr 1fr;border-top:4px solid #fff}
  .dock a{display:flex;align-items:center;justify-content:center;min-height:58px;background:var(--navy);color:#fff;text-decoration:none;font:400 .84rem "Alfa Slab One",serif;text-transform:uppercase;letter-spacing:.02em;white-space:nowrap}
  .dock .dock-b{background:var(--red)}
}
/* Reduce Motion: slams, spins, rises and the stripe drop become plain fades; the gauge needle still
   self-tests and follows the scroll (a small dial, not screen movement). */
@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  .js .stripes,.js h1 b,.js .hero-p,.js .hero-cta,.js .dial{animation-name:fadein}
  .js [data-pop]{transform:rotate(-4deg)}
  .js .shield[data-pop]{transform:none}
  .js [data-pop].in{transition:opacity .7s ease}
  .js [data-rise]{translate:none}
  .js [data-rise].in{transition:opacity .8s ease}
  .js [data-cap] .cap{transform:rotate(var(--tilt,-6deg))}
  .js [data-cap].in .cap{transition:opacity .8s ease}
  .btn,.board li{transition:none}
  @keyframes fadein{from{opacity:0}}
}
@media (max-width:400px){
  .top{padding-inline:12px}
  .brand .roundel{width:36px;height:36px}
  .brand{gap:.45rem}
  .brand-t b{font-size:.86rem}.brand-t i{font-size:.92rem}
  .btn-sm{font-size:.76rem;padding:.2rem .55rem;min-height:44px}
}
