:root{--bg:#050607;--panel:#0c0e10;--text:#f7f7f7;--muted:#b5b8bd;--pink:#ff007c;--blue:#00a9ff;--yellow:#f5e900;--lime:#a5ff00;--purple:#d44cff;--orange:#ff8a00;--line:rgba(255,255,255,.12);--shell:1360px;--radius:18px;--shadow:0 24px 70px rgba(0,0,0,.45)}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--bg);color:var(--text);font-family:Arial,Helvetica,sans-serif;font-size:16px;line-height:1.6;background-image:radial-gradient(circle at 20% 10%,rgba(255,0,124,.07),transparent 26%),radial-gradient(circle at 80% 25%,rgba(0,169,255,.06),transparent 24%),repeating-linear-gradient(0deg,rgba(255,255,255,.012) 0 1px,transparent 1px 4px)}body:before{content:"";position:fixed;inset:0;pointer-events:none;opacity:.25;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.12'/%3E%3C/svg%3E")}a{color:inherit}img{max-width:100%;height:auto;display:block}.shell{width:min(var(--shell),calc(100% - 40px));margin-inline:auto}.screen-reader-text{position:absolute!important;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}.skip-link:focus{clip:auto!important;width:auto;height:auto;top:10px;left:10px;padding:10px;background:#fff;color:#000;z-index:9999}.site-header{position:sticky;top:0;z-index:100;background:rgba(5,6,7,.82);backdrop-filter:blur(16px);border-bottom:1px solid transparent;transition:.25s}.site-header.is-scrolled{border-color:var(--line);box-shadow:0 10px 30px rgba(0,0,0,.32)}.site-header__inner{min-height:92px;display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:36px}.custom-logo{max-height:76px;width:auto}.text-logo{display:inline-grid;text-decoration:none;line-height:.8;transform:skew(-7deg) rotate(-2deg)}.text-logo span,.text-logo strong{font-size:30px;font-weight:1000;letter-spacing:-2px}.text-logo span{color:var(--pink);text-shadow:3px 3px 0 var(--yellow)}.text-logo strong{color:var(--blue);text-shadow:3px 3px 0 var(--lime)}.text-logo small{margin-top:5px;font-size:10px;letter-spacing:1.6px;color:#fff}.primary-menu{display:flex;justify-content:center;align-items:center;gap:30px;list-style:none;margin:0;padding:0}.primary-menu a{text-decoration:none;text-transform:uppercase;font-weight:800;font-size:13px;letter-spacing:.7px}.primary-menu a:hover,.primary-menu .current-menu-item>a{color:var(--pink)}.menu-toggle{display:none;background:none;border:0;color:#fff;width:44px;height:44px}.menu-toggle svg,.btn svg,.floating-whatsapp svg{width:20px;height:20px;fill:currentColor}.menu-toggle__close{display:none}.menu-toggle[aria-expanded=true] .menu-toggle__open{display:none}.menu-toggle[aria-expanded=true] .menu-toggle__close{display:block}.btn{display:inline-flex;align-items:center;justify-content:center;gap:10px;min-height:50px;padding:12px 24px;border:2px solid transparent;text-decoration:none;text-transform:uppercase;font-weight:900;letter-spacing:.5px;line-height:1;clip-path:polygon(3% 0,98% 2%,100% 90%,95% 100%,2% 97%,0 12%);transition:transform .2s,box-shadow .2s,background .2s}.btn:hover{transform:translateY(-2px)}.btn--pink{background:var(--pink);box-shadow:0 0 0 3px rgba(255,0,124,.15),0 10px 30px rgba(255,0,124,.22)}.btn--outline-lime{border-color:var(--lime);box-shadow:inset 0 0 18px rgba(165,255,0,.06),0 0 0 2px rgba(165,255,0,.08)}.btn--outline-yellow{border-color:var(--yellow);box-shadow:inset 0 0 18px rgba(245,233,0,.05)}.btn--outline-blue{border-color:var(--blue)}.btn--full{width:100%}.hero{position:relative;overflow:hidden;min-height:720px;display:flex;align-items:center;background-image:linear-gradient(90deg,rgba(5,6,7,.98) 0%,rgba(5,6,7,.8) 42%,rgba(5,6,7,.45) 72%,rgba(5,6,7,.88) 100%),var(--hero-bg,linear-gradient(140deg,#0b0d10,#020304));background-size:cover;background-position:center}.hero__grid{position:relative;display:grid;grid-template-columns:1.08fr 1.2fr .76fr;gap:28px;align-items:center;padding:70px 0}.hero__copy{position:relative;z-index:4}.brush-kicker,.section-heading span{display:block;color:var(--blue);font-weight:1000;text-transform:uppercase;letter-spacing:2px;font-style:italic}.hero h1,.section-heading h2,.coverage h2,.quote-panel h2,.page-header h1,.coming-soon h1{font-family:Impact,Haettenschweiler,'Arial Narrow Bold',sans-serif;text-transform:uppercase;font-style:italic;letter-spacing:1px;line-height:.9;margin:12px 0 22px}.hero h1{font-size:clamp(64px,8vw,126px)}.hero h1 span{display:inline-block;background:linear-gradient(180deg,var(--pink),#8f0057);-webkit-background-clip:text;background-clip:text;color:transparent;filter:drop-shadow(6px 8px 0 rgba(245,233,0,.85));transform:skew(-6deg) rotate(-2deg)}.hero__subtitle{font-size:20px;font-weight:800;text-transform:uppercase;max-width:600px}.hero__actions{display:flex;flex-wrap:wrap;gap:16px;margin-top:30px}.hero__vehicle{position:relative;z-index:2;min-height:480px;display:flex;align-items:center}.hero__vehicle img{width:120%;max-width:none;margin-left:-10%;filter:drop-shadow(0 30px 40px rgba(0,0,0,.7))}.car-silhouette{width:100%;aspect-ratio:16/8;border-radius:52% 52% 18% 18%/68% 70% 24% 24%;background:linear-gradient(165deg,#323940 0 18%,#090b0d 25% 65%,#262c32 72% 100%);box-shadow:inset 0 0 0 4px #15191d,0 40px 70px #000;transform:skew(-8deg)}.car-silhouette:before,.car-silhouette:after{content:"";position:absolute;width:92px;height:92px;border-radius:50%;bottom:-18px;background:radial-gradient(circle,#101317 0 34%,var(--blue) 36% 39%,#050607 41% 62%,#343a41 64%);box-shadow:0 0 0 9px #050607}.car-silhouette:before{left:15%}.car-silhouette:after{right:15%}.quick-quote{position:relative;z-index:5;padding:34px;background:rgba(4,5,6,.92);border:2px solid var(--yellow);box-shadow:0 0 0 5px rgba(245,233,0,.1),var(--shadow);clip-path:polygon(2% 0,97% 2%,100% 94%,94% 100%,4% 98%,0 8%)}.quick-quote__label{color:var(--yellow);font-family:Impact,Arial Narrow,sans-serif;font-size:30px;font-style:italic;text-transform:uppercase}.quick-quote__or{display:block;text-align:center;color:var(--pink);font-weight:900;text-transform:uppercase;margin:10px}.quick-quote__response{margin-top:20px;padding-top:18px;border-top:1px solid var(--line);text-align:center}.quick-quote__response strong{display:block;color:var(--pink);text-transform:uppercase}.quick-quote__response span{font-size:14px}.hero__paint,.coming-soon__paint{position:absolute;border-radius:48% 52% 42% 58%;filter:blur(1px);opacity:.55;transform:rotate(-16deg)}.hero__paint:before,.coming-soon__paint:before{content:"";position:absolute;inset:-18px;background:inherit;filter:blur(16px);opacity:.35}.hero__paint--pink{width:420px;height:130px;background:var(--pink);right:36%;top:18%}.hero__paint--blue{width:310px;height:90px;background:var(--blue);right:16%;bottom:18%}.hero__paint--yellow{width:220px;height:80px;background:var(--yellow);left:6%;bottom:12%}.trust-strip{border-block:1px solid var(--line);background:#080a0c}.trust-grid{display:grid;grid-template-columns:repeat(4,1fr)}.trust-item{display:flex;align-items:center;gap:16px;padding:20px 28px;border-right:1px solid var(--line)}.trust-item:last-child{border-right:0}.trust-item>span{color:var(--yellow);font-size:32px}.trust-item strong,.trust-item small{display:block}.trust-item strong{text-transform:uppercase}.trust-item small{color:var(--muted)}.section{padding:88px 0;border-bottom:1px solid rgba(255,255,255,.06)}.section-heading{text-align:center;margin-bottom:44px}.section-heading h2,.coverage h2,.quote-panel h2,.page-header h1{font-size:clamp(40px,5vw,74px);margin-bottom:0}.service-grid{display:grid;grid-template-columns:repeat(6,1fr);gap:0}.service-card{position:relative;padding:30px 22px 26px;text-align:center;border-right:1px solid var(--line);overflow:hidden}.service-card:last-child{border-right:0}.service-card__splash{position:absolute;left:16%;right:16%;top:22px;height:100px;opacity:.35;filter:blur(8px);clip-path:polygon(3% 33%,22% 14%,28% 0,42% 14%,59% 4%,68% 26%,92% 13%,100% 50%,79% 62%,92% 88%,64% 82%,48% 100%,31% 76%,8% 91%,15% 61%,0 49%)}.service-card--pink .service-card__splash,.service-card--pink a{background:var(--pink);color:var(--pink)}.service-card--blue .service-card__splash,.service-card--blue a{background:var(--blue);color:var(--blue)}.service-card--yellow .service-card__splash,.service-card--yellow a{background:var(--yellow);color:var(--yellow)}.service-card--lime .service-card__splash,.service-card--lime a{background:var(--lime);color:var(--lime)}.service-card--purple .service-card__splash,.service-card--purple a{background:var(--purple);color:var(--purple)}.service-card--orange .service-card__splash,.service-card--orange a{background:var(--orange);color:var(--orange)}.service-card__icon{position:relative;font-size:58px;line-height:1.6;text-shadow:0 0 25px currentColor}.service-card h3{font-family:Impact,Arial Narrow,sans-serif;font-style:italic;text-transform:uppercase;font-size:26px;line-height:1;margin:16px 0}.service-card p{color:var(--muted);font-size:14px}.service-card a{display:inline-flex;gap:6px;align-items:center;text-decoration:none;text-transform:uppercase;font-weight:900;font-size:12px;background:none!important}.service-card a svg{width:16px;fill:currentColor}.comparison{--position:50%;position:relative;aspect-ratio:16/4.4;overflow:hidden;border:2px solid #fff;background:#16191c;box-shadow:var(--shadow)}.comparison__before,.comparison__after{position:absolute;inset:0;background-size:cover;background-position:center}.comparison__before{background-image:linear-gradient(135deg,#d5d5d5,#6f7275)}.comparison__after{background-image:linear-gradient(135deg,#e6e7e8,#fafafa)}.comparison__after{clip-path:inset(0 0 0 var(--position))}.comparison__before span,.comparison__after span{position:absolute;top:16px;padding:8px 14px;font-weight:1000;text-transform:uppercase}.comparison__before span{left:16px;background:var(--pink)}.comparison__after span{right:16px;background:var(--blue)}.comparison input{position:absolute;inset:0;width:100%;height:100%;opacity:0;cursor:ew-resize;z-index:4}.comparison__handle{position:absolute;left:var(--position);top:50%;transform:translate(-50%,-50%);width:56px;height:56px;border-radius:50%;display:grid;place-items:center;background:#060708;border:4px solid #fff;font-size:25px;z-index:3}.comparison:after{content:"";position:absolute;left:var(--position);top:0;bottom:0;width:3px;background:#fff;transform:translateX(-50%)}.benefit-grid{display:grid;grid-template-columns:repeat(6,1fr)}.benefit{text-align:center;padding:20px;border-right:1px solid var(--line)}.benefit:last-child{border-right:0}.benefit__icon{font-size:42px}.benefit--pink .benefit__icon{color:var(--pink)}.benefit--blue .benefit__icon{color:var(--blue)}.benefit--yellow .benefit__icon{color:var(--yellow)}.benefit--lime .benefit__icon{color:var(--lime)}.benefit--purple .benefit__icon{color:var(--purple)}.benefit--orange .benefit__icon{color:var(--orange)}.benefit h3{text-transform:uppercase;font-size:15px}.benefit p{font-size:13px;color:var(--muted)}.process-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:20px}.process-step{position:relative;text-align:center;padding:24px}.process-step__number{font-family:Impact,Arial Narrow,sans-serif;font-size:92px;line-height:1}.process-step--pink .process-step__number{color:var(--pink)}.process-step--blue .process-step__number{color:var(--blue)}.process-step--yellow .process-step__number{color:var(--yellow)}.process-step--lime .process-step__number{color:var(--lime)}.process-step__icon{font-size:38px;margin-top:-48px;margin-left:54px}.process-step h3{text-transform:uppercase}.process-step p{color:var(--muted)}.process-step__arrow{position:absolute;right:-22px;top:70px;font-size:40px}.testimonial-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:30px}.testimonial{padding:30px;text-align:center;background:linear-gradient(180deg,rgba(255,255,255,.035),rgba(255,255,255,.01));border:2px solid var(--pink);box-shadow:0 0 24px rgba(255,0,124,.08)}.testimonial:nth-child(2){border-color:var(--blue)}.testimonial:nth-child(3){border-color:var(--yellow)}.testimonial blockquote{margin:18px 0;color:#eee}.testimonial strong,.testimonial small{display:block}.testimonial strong{text-transform:uppercase;color:var(--blue)}.testimonial small{color:var(--muted)}.stars{color:var(--pink);letter-spacing:5px}.testimonial:nth-child(2) .stars{color:var(--blue)}.testimonial:nth-child(3) .stars{color:var(--yellow)}.repair-grid{display:grid;grid-template-columns:repeat(6,1fr);gap:4px}.repair-tile{position:relative;min-height:190px;overflow:hidden;background:#121519;text-decoration:none}.repair-tile img,.repair-placeholder{width:100%;height:100%;object-fit:cover;transition:transform .35s}.repair-placeholder{background:linear-gradient(135deg,#272c31,#0b0d0f 55%,#3c434a)}.repair-tile:nth-child(2n) .repair-placeholder{background:linear-gradient(135deg,#14171a,#4c5359)}.repair-tile span{position:absolute;left:0;right:0;bottom:0;padding:12px;background:linear-gradient(transparent,rgba(0,0,0,.9));font-weight:900;text-transform:uppercase;font-size:12px}.repair-tile:hover img,.repair-tile:hover .repair-placeholder{transform:scale(1.06)}.center{text-align:center;margin-top:32px}.coverage{background:radial-gradient(circle at 80% 40%,rgba(0,169,255,.12),transparent 30%),#07090b}.coverage__grid{display:grid;grid-template-columns:.8fr 1.2fr;gap:70px;align-items:center}.coverage__places{display:grid;grid-template-columns:repeat(2,1fr);gap:10px 24px;margin:28px 0}.coverage__places span:before{content:"⌖";color:var(--pink);margin-right:8px}.coverage__map{position:relative;min-height:360px;border:1px solid rgba(0,169,255,.3);overflow:hidden;background:radial-gradient(circle at center,rgba(255,0,124,.12),transparent 34%),linear-gradient(135deg,#0b151d,#030607)}.map-lines{position:absolute;inset:-40%;background:repeating-radial-gradient(ellipse at center,transparent 0 18px,rgba(0,169,255,.18) 19px 20px),repeating-linear-gradient(27deg,transparent 0 38px,rgba(165,255,0,.13) 39px 40px);transform:rotate(-7deg)}.map-pin{position:absolute;left:53%;top:47%;transform:translate(-50%,-50%);display:grid;place-items:center;text-transform:uppercase;font-style:italic}.map-pin span{font-size:70px;color:var(--pink);filter:drop-shadow(0 0 18px rgba(255,0,124,.5))}.quote-panel{display:grid;grid-template-columns:1fr 1fr;gap:40px;align-items:center;padding:50px;background:linear-gradient(100deg,rgba(255,0,124,.32),rgba(5,6,7,.95) 36%,rgba(245,233,0,.17));border:1px solid var(--line);box-shadow:var(--shadow)}.quote-panel__actions{display:flex;justify-content:flex-end;flex-wrap:wrap;gap:15px}.quote-form{width:100%}.site-footer{background:#030405}.paint-line{height:8px;background:linear-gradient(90deg,var(--pink) 0 26%,var(--blue) 26% 52%,var(--yellow) 52% 76%,var(--lime) 76%)}.footer-grid{display:grid;grid-template-columns:1.2fr .7fr .9fr 1fr;gap:48px;padding:60px 0}.footer-grid h3{text-transform:uppercase;font-size:15px;color:var(--yellow)}.footer-grid ul{list-style:none;margin:0;padding:0}.footer-grid a{text-decoration:none}.footer-brand p,.footer-contact{color:var(--muted)}.site-footer__bottom{border-top:1px solid var(--line);padding:18px 0;color:#8c9095;font-size:13px}.site-footer__bottom .shell{display:flex;justify-content:space-between}.floating-whatsapp{position:fixed;right:22px;bottom:22px;width:58px;height:58px;border-radius:50%;display:grid;place-items:center;background:#25d366;color:#fff;box-shadow:0 15px 35px rgba(0,0,0,.4);z-index:50}.content-area{min-height:60vh}.page-header{text-align:center;margin-bottom:42px}.entry-content{max-width:900px;margin:auto}.entry-content a{color:var(--blue)}.single-featured img{width:100%;border-radius:var(--radius)}.content-card{padding:25px;border-bottom:1px solid var(--line)}.pagination{margin-top:40px}.coming-soon{position:relative;min-height:calc(100vh - 92px);display:grid;place-items:center;overflow:hidden;padding:90px 0;background:radial-gradient(circle at 70% 20%,rgba(0,169,255,.14),transparent 35%),radial-gradient(circle at 20% 70%,rgba(255,0,124,.15),transparent 32%),#050607}.coming-soon__inner{text-align:center;position:relative;z-index:2}.coming-soon h1{font-size:clamp(76px,12vw,180px);color:var(--pink);text-shadow:8px 8px 0 var(--yellow)}.coming-soon__copy p{max-width:760px;margin:0 auto;font-size:20px;color:var(--muted)}.coming-soon .hero__actions{justify-content:center}.countdown{display:grid;grid-template-columns:repeat(4,150px);justify-content:center;gap:16px;margin:45px 0}.countdown div{padding:22px 12px;background:#090b0d;border:1px solid var(--line)}.countdown strong,.countdown span{display:block}.countdown strong{font-family:Impact,Arial Narrow,sans-serif;font-size:54px;color:var(--blue)}.countdown span{text-transform:uppercase;font-size:12px}.coming-soon__services{display:flex;justify-content:center;flex-wrap:wrap;gap:12px}.coming-soon__services span{padding:9px 16px;border:1px solid var(--line);text-transform:uppercase;font-weight:800}.coming-soon__paint--pink{width:520px;height:150px;background:var(--pink);left:-180px;top:18%}.coming-soon__paint--blue{width:420px;height:110px;background:var(--blue);right:-140px;bottom:18%}.coming-soon__paint--yellow{width:260px;height:80px;background:var(--yellow);right:14%;top:12%}.reveal{opacity:0;transform:translateY(28px);transition:opacity .7s ease,transform .7s ease}.reveal--delay{transition-delay:.12s}.reveal--delay-2{transition-delay:.24s}.reveal.is-visible{opacity:1;transform:none}
@media(max-width:1100px){.site-header__inner{grid-template-columns:auto auto 1fr}.menu-toggle{display:block;justify-self:end}.primary-nav{position:fixed;left:0;right:0;top:92px;background:#050607;border-bottom:1px solid var(--line);padding:24px;display:none}.primary-nav.is-open{display:block}.primary-menu{flex-direction:column;align-items:flex-start}.header-quote{display:none}.hero__grid{grid-template-columns:1fr 1fr}.quick-quote{grid-column:1/-1;max-width:620px;margin:auto}.service-grid{grid-template-columns:repeat(3,1fr)}.service-card:nth-child(3){border-right:0}.benefit-grid{grid-template-columns:repeat(3,1fr)}.benefit:nth-child(3){border-right:0}.repair-grid{grid-template-columns:repeat(3,1fr)}.footer-grid{grid-template-columns:repeat(2,1fr)}}
@media(max-width:760px){.shell{width:min(100% - 26px,var(--shell))}.site-header__inner{min-height:78px}.primary-nav{top:78px}.custom-logo{max-height:62px}.hero{min-height:auto}.hero__grid{grid-template-columns:1fr;padding:54px 0}.hero__vehicle{min-height:260px;order:2}.hero__copy{order:1;text-align:center}.hero__actions{justify-content:center}.quick-quote{order:3}.hero h1{font-size:62px}.hero__subtitle{font-size:16px}.trust-grid{grid-template-columns:repeat(2,1fr)}.trust-item{border-bottom:1px solid var(--line);padding:16px}.section{padding:64px 0}.service-grid{grid-template-columns:repeat(2,1fr)}.service-card:nth-child(2n){border-right:0}.comparison{aspect-ratio:4/3}.benefit-grid{grid-template-columns:repeat(2,1fr)}.benefit:nth-child(2n){border-right:0}.process-grid{grid-template-columns:1fr}.process-step__arrow{display:none}.testimonial-grid{grid-template-columns:1fr}.repair-grid{grid-template-columns:repeat(2,1fr)}.coverage__grid,.quote-panel{grid-template-columns:1fr}.coverage__map{min-height:280px}.quote-panel{padding:30px}.quote-panel__actions{justify-content:flex-start}.footer-grid{grid-template-columns:1fr}.site-footer__bottom .shell{display:block}.countdown{grid-template-columns:repeat(2,1fr)}.coming-soon h1{font-size:76px}.coming-soon__copy p{font-size:17px}}
@media(max-width:420px){.hero h1{font-size:52px}.service-grid,.repair-grid{grid-template-columns:1fr}.service-card{border-right:0;border-bottom:1px solid var(--line)}.benefit-grid{grid-template-columns:1fr}.benefit{border-right:0;border-bottom:1px solid var(--line)}.trust-grid{grid-template-columns:1fr}.trust-item{border-right:0}.btn{width:100%}.footer-grid{gap:28px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}.reveal{opacity:1;transform:none;transition:none}.btn,.repair-tile img,.repair-placeholder{transition:none}}

/* 1.1 design fidelity refinements */
.hero__actions--mobile{display:none}.section-heading--left{text-align:left}.faq-section{background:linear-gradient(180deg,#050607,#090a0c)}.faq-layout{display:grid;grid-template-columns:1.15fr .85fr;gap:54px;align-items:start}.faq-list{display:grid;gap:12px}.faq-item{background:#111315;border:1px solid rgba(255,255,255,.05)}.faq-item summary{cursor:pointer;list-style:none;display:flex;justify-content:space-between;gap:20px;padding:20px 22px;font-weight:900}.faq-item summary::-webkit-details-marker{display:none}.faq-item summary span{color:var(--pink);font-size:24px;line-height:1}.faq-item[open] summary span{transform:rotate(45deg)}.faq-item div{padding:0 22px 20px;color:var(--muted)}.faq-item p{margin:0}.faq-cta{position:relative;padding:42px 34px;background:radial-gradient(circle at 80% 15%,rgba(245,233,0,.2),transparent 26%),radial-gradient(circle at 15% 85%,rgba(255,0,124,.25),transparent 34%),#090a0c;border:2px solid var(--pink);box-shadow:0 0 0 5px rgba(255,0,124,.08),var(--shadow);clip-path:polygon(3% 0,97% 2%,100% 94%,94% 100%,4% 98%,0 7%)}.faq-cta h2{font-family:Impact,Haettenschweiler,'Arial Narrow Bold',sans-serif;text-transform:uppercase;font-style:italic;font-size:clamp(38px,5vw,68px);line-height:.95;margin:10px 0 18px}.faq-cta .btn{margin-top:14px}
.mobile-cta-bar{display:none}
@media(max-width:760px){
 body{padding-bottom:72px}.site-header{position:sticky}.hero{padding-top:0}.hero__grid{padding:34px 0 40px}.hero__copy{text-align:center}.hero__copy .brush-kicker{color:#fff;font-size:19px;letter-spacing:.5px}.hero h1{margin-top:4px}.hero__subtitle{max-width:340px;margin-inline:auto}.hero__actions--desktop{display:none}.hero__actions--mobile{display:grid;grid-template-columns:1fr;order:3;width:100%;gap:14px}.hero__vehicle{order:2;min-height:270px;margin-top:-6px}.hero__vehicle img{width:118%;margin-left:-9%}.quick-quote{display:none}.trust-strip{margin-top:0}.service-grid{gap:14px}.service-card{border:1px solid currentColor!important;padding:22px 14px;background:rgba(255,255,255,.015)}.service-card:nth-child(6n+1){color:var(--pink)}.service-card:nth-child(6n+2){color:var(--blue)}.service-card:nth-child(6n+3){color:var(--yellow)}.service-card:nth-child(6n+4){color:var(--lime)}.service-card:nth-child(6n+5){color:var(--purple)}.service-card:nth-child(6n+6){color:var(--orange)}.service-card p{color:var(--muted)}.benefit-grid{gap:0}.process-step{padding:12px 24px 44px}.process-step__number{font-size:84px}.testimonial-grid{gap:18px}.repair-grid{gap:5px}.faq-layout{grid-template-columns:1fr;gap:28px}.faq-cta{padding:34px 24px}.footer-grid{padding-bottom:36px}.floating-whatsapp{display:none}.mobile-cta-bar{position:fixed;display:grid;grid-template-columns:1fr 1fr;left:0;right:0;bottom:0;z-index:120;background:#050607;border-top:1px solid var(--line);padding:8px;gap:8px}.mobile-cta-bar .btn{min-height:54px;padding:10px;font-size:12px}
}

/* Bundled production artwork (v1.2) */
.bundled-logo{display:block}.bundled-logo img{display:block;max-height:78px;width:auto}.bundled-logo--footer img{max-height:105px}.hero__paint-sheet{position:absolute;inset:auto auto 4% 0;width:360px;max-width:40vw;opacity:.65;pointer-events:none;z-index:1}.quick-quote:before{content:"";position:absolute;inset:-34px;background-image:var(--form-frame);background-size:100% 100%;background-repeat:no-repeat;pointer-events:none;z-index:-1}.quick-quote{isolation:isolate}.service-card__art{position:relative;z-index:1;width:100%;height:155px;object-fit:contain;object-position:center top;margin:0 auto 2px}.service-card__content{position:relative;z-index:2;background:linear-gradient(180deg,rgba(5,6,7,.18),rgba(5,6,7,.98) 22%);padding-top:2px}.benefit__art{width:100%;height:92px;object-fit:contain;margin:0 auto 6px}.process-step__art{width:100%;height:88px;object-fit:contain;margin:-14px auto 0}.comparison--reference{background-image:var(--comparison-reference);background-size:cover;background-position:center}.comparison--reference .comparison__before,.comparison--reference .comparison__after{background-image:none}.coverage__map{background-image:linear-gradient(rgba(3,6,7,.12),rgba(3,6,7,.12)),var(--coverage-map,radial-gradient(circle at center,rgba(255,0,124,.12),transparent 34%));background-size:cover;background-position:center}.coverage__map[style] .map-lines{opacity:.15}.quote-panel{position:relative;overflow:hidden}.quote-panel:before{content:"";position:absolute;inset:0;background-image:var(--cta-art);background-size:cover;background-position:center;opacity:.26;pointer-events:none}.quote-panel>*{position:relative;z-index:1}
@media(max-width:760px){.bundled-logo img{max-height:62px}.hero__paint-sheet{width:230px;max-width:64vw;bottom:17%}.service-card__art{height:120px}.benefit__art{height:82px}.process-step__art{height:100px}.quick-quote:before{display:none}}

/* ======================================================================
   SCUFF OFF v1.6 — CONCEPT FIDELITY WITHOUT HEADER REGRESSION
   Keeps the proven v1.4 header/grid rules intact. This layer only:
   1) establishes the concept typography,
   2) refines the hero typography without changing its core grid,
   3) removes the rectangular quote-card background,
   4) improves below-hero proportions and artwork scale.
   ====================================================================== */

:root{
  --scuff-brush:'Road Rage',Impact,Haettenschweiler,'Arial Narrow Bold',sans-serif;
  --scuff-display:'Bebas Neue',Impact,Haettenschweiler,'Arial Narrow Bold',sans-serif;
  --scuff-body:'Montserrat',Arial,Helvetica,sans-serif;
}

body{font-family:var(--scuff-body)}
.primary-menu a,.btn,.trust-item,.faq-item,.footer-grid{font-family:var(--scuff-body)}
.brush-kicker,.section-heading h2,.coverage h2,.quote-panel h2,.page-header h1,.coming-soon h1,
.service-card h3,.hero h1,.quick-quote__label,.faq-cta h2{
  font-family:var(--scuff-brush);
  font-weight:400;
  letter-spacing:.2px;
}

/* HERO: preserve the original grid/spacing; only restore the concept lettering. */
.hero h1{
  display:flex;
  flex-direction:column;
  align-items:flex-start;
  line-height:.72;
  margin:9px 0 20px;
  letter-spacing:1px;
}
.hero h1 .hero-title{display:block;transform:skew(-5deg) rotate(-1.5deg)}
.hero h1 .hero-title--pink{
  color:var(--pink);
  background:none;
  -webkit-background-clip:initial;
  background-clip:initial;
  filter:none;
  text-shadow:3px 4px 0 #5d0035,6px 7px 0 rgba(0,0,0,.62);
}
.hero h1 .hero-title--lime{
  color:var(--lime);
  margin-top:7px;
  background:none;
  -webkit-background-clip:initial;
  background-clip:initial;
  filter:none;
  text-shadow:3px 4px 0 #3f5200,6px 7px 0 rgba(0,0,0,.62);
}
.hero__copy .brush-kicker{
  font-family:var(--scuff-brush);
  font-size:31px;
  line-height:1;
  letter-spacing:.4px;
  color:#fff;
  text-transform:uppercase;
}
.hero__subtitle{
  font-family:var(--scuff-display);
  letter-spacing:.45px;
}

/* NEED A QUOTE: no visible rectangular card behind the splash artwork. */
.quick-quote{
  isolation:isolate;
  overflow:visible;
  background:transparent;
  border:0;
  box-shadow:none;
  clip-path:none;
}
.quick-quote:before{
  content:"";
  position:absolute;
  inset:-43px -34px -50px;
  z-index:-1;
  background-image:var(--form-frame);
  background-size:100% 100%;
  background-repeat:no-repeat;
  background-position:center;
  pointer-events:none;
}
.quick-quote:after{
  content:"";
  position:absolute;
  inset:11px 8px 12px;
  z-index:-2;
  background:rgba(2,3,4,.94);
  clip-path:polygon(4% 1%,96% 3%,100% 12%,98% 87%,94% 99%,7% 97%,1% 91%,2% 10%);
  pointer-events:none;
}
.quick-quote__label{font-size:31px;line-height:.95}

/* Shared section headings — closer to the rough handwritten concept. */
.section-heading span,.brush-kicker{
  font-family:var(--scuff-display);
  font-style:normal;
  font-weight:400;
  letter-spacing:1.2px;
}
.section-heading h2,.coverage h2,.quote-panel h2{
  line-height:.9;
}
.section-heading h2:after{
  content:"";
  display:block;
  width:145px;
  height:5px;
  margin:7px auto 0;
  background:linear-gradient(90deg,var(--pink) 0 63%,var(--blue) 63%);
  clip-path:polygon(0 30%,100% 0,97% 70%,2% 100%);
  transform:rotate(-1deg);
}
.section-heading--left h2:after{margin-left:0}

/* SERVICES */
.services{padding-top:42px;padding-bottom:42px}
.service-grid{grid-template-columns:repeat(6,minmax(0,1fr));gap:0}
.service-card{padding:8px 15px 22px;background:none;overflow:visible}
.service-card__splash{display:none}
.service-card__art{
  width:100%;height:166px;object-fit:contain;object-position:center bottom;
  margin:0 auto -5px;filter:drop-shadow(0 8px 14px rgba(0,0,0,.28));
}
.service-card__content{background:none;padding-top:0}
.service-card h3{font-size:30px;line-height:.86;min-height:51px;margin:0 0 8px}
.service-card p{max-width:175px;min-height:62px;margin:0 auto 11px;color:#ddd;font-size:12px;line-height:1.32}

/* BEFORE / AFTER */
.comparison-section{padding-top:24px;padding-bottom:31px}
.comparison-section .section-heading{margin-bottom:12px}
.comparison{aspect-ratio:16/3.45;border:0;box-shadow:0 16px 42px rgba(0,0,0,.48)}
.comparison__handle{width:50px;height:50px;border-width:3px}

/* WHY CHOOSE US: supplied artwork already contains feature title. */
.benefits{padding-top:27px;padding-bottom:36px}
.benefit-grid{grid-template-columns:repeat(6,minmax(0,1fr));gap:0}
.benefit{padding:0 12px 5px;background:none}
.benefit__art{height:150px;width:100%;object-fit:contain;object-position:center bottom;margin:0 auto}
.benefit h3{display:none}
.benefit p{max-width:165px;margin:4px auto 0;color:#ddd;font-size:11px;line-height:1.32}

/* HOW IT WORKS */
.process{padding-top:28px;padding-bottom:31px}
.process-grid{grid-template-columns:repeat(4,1fr);gap:0}
.process-step{min-height:165px;padding:5px 22px 10px}
.process-step__number{
  position:relative;font-family:var(--scuff-brush);font-weight:400;font-size:100px;
  text-shadow:4px 4px 0 #101010;transform:rotate(-5deg)
}
.process-step__number:before{
  content:"";position:absolute;z-index:-1;inset:20% -25% 7% -20%;background:currentColor;opacity:.24;
  clip-path:polygon(0 35%,13% 4%,34% 16%,52% 0,68% 22%,96% 6%,89% 44%,100% 70%,74% 66%,66% 100%,43% 82%,16% 97%,23% 65%,0 72%)
}
.process-step h3{font-family:var(--scuff-display);font-size:16px;letter-spacing:.6px}
.process-step p{font-size:11px;line-height:1.32}

/* TESTIMONIALS */
.testimonials{padding-top:27px;padding-bottom:35px}
.testimonial-grid{max-width:1240px;margin-inline:auto;gap:42px}
.testimonial{position:relative;min-height:180px;padding:26px 30px 22px;background:#070809;border-width:1px;box-shadow:none}
.testimonial:before{
  content:"";position:absolute;inset:-5px;border:1px solid currentColor;opacity:.22;pointer-events:none;
  clip-path:polygon(0 8%,5% 0,39% 3%,64% 0,100% 5%,97% 34%,100% 78%,93% 100%,61% 96%,26% 100%,0 94%,3% 56%)
}
.testimonial:nth-child(1){color:var(--pink)}
.testimonial:nth-child(2){color:var(--blue)}
.testimonial:nth-child(3){color:var(--yellow)}
.stars{color:currentColor}
.testimonial strong{color:currentColor}

/* GALLERY */
.repair-gallery{padding-top:24px;padding-bottom:38px}
.repair-grid{grid-template-columns:repeat(6,1fr);gap:3px}
.repair-tile{min-height:165px}
.repair-filter-bar{display:flex;justify-content:center;align-items:center;gap:22px;margin:0 0 13px;font-family:var(--scuff-display);font-size:13px;letter-spacing:.5px;text-transform:uppercase}
.repair-filter-bar span{padding:6px 10px}
.repair-filter-bar .is-active{background:var(--pink)}

/* COVERAGE */
.coverage{padding:40px 0;background:radial-gradient(circle at 80% 44%,rgba(0,169,255,.11),transparent 32%),#050607}
.coverage__grid{grid-template-columns:.8fr 1.2fr;gap:38px}
.coverage__copy .brush-kicker{color:var(--pink)}
.coverage h2{font-size:clamp(48px,5vw,72px)}
.coverage__places{grid-template-columns:repeat(3,1fr);gap:8px 18px}
.coverage__map{min-height:330px;border:0;box-shadow:inset 0 0 55px #020304}

/* FAQ + BOTTOM CTA */
.faq-section{padding-top:40px;padding-bottom:46px}
.faq-layout{grid-template-columns:1.08fr .72fr;gap:48px}
.faq-cta{border:0;box-shadow:none}
.quote-section{padding-top:0;padding-bottom:0}
.quote-panel{border:0;box-shadow:none}
.quote-panel h2{color:var(--yellow);font-size:clamp(45px,4.5vw,65px)}

/* FOOTER */
.footer-grid{padding:40px 0 31px;gap:38px}
.footer-grid h3{font-family:var(--scuff-display);font-size:14px;letter-spacing:.6px;color:var(--pink)}

@media(max-width:1100px){
  .service-grid{grid-template-columns:repeat(3,1fr)}
  .benefit-grid{grid-template-columns:repeat(3,1fr);row-gap:22px}
  .repair-grid{grid-template-columns:repeat(3,1fr)}
}

@media(max-width:760px){
  .hero h1{align-items:center;line-height:.75}
  .hero__copy .brush-kicker{font-size:25px}
  .quick-quote:after{display:none}

  .service-grid{grid-template-columns:repeat(2,1fr);gap:12px}
  .service-card__art{height:120px}
  .service-card h3{font-size:24px}
  .comparison{aspect-ratio:1.72/1}

  .benefit-grid{grid-template-columns:repeat(2,1fr);gap:18px 0}
  .benefit__art{height:128px}

  .process-grid{grid-template-columns:1fr;max-width:340px;margin-inline:auto}
  .process-step__number{font-size:86px}

  .testimonial-grid{grid-template-columns:1fr;gap:18px}
  .repair-grid{grid-template-columns:repeat(2,1fr)}
  .coverage__grid{grid-template-columns:1fr}
  .coverage__places{grid-template-columns:repeat(2,1fr)}
  .faq-layout{grid-template-columns:1fr}
}


/* ======================================================================
   SCUFF OFF v1.7 — APPROVED CONCEPT MATCH
   Header layout intentionally NOT redefined in this layer.
   ====================================================================== */

:root{
  --scuff-brush:'Road Rage','Permanent Marker',Impact,Haettenschweiler,'Arial Narrow Bold',sans-serif;
  --scuff-hand:'Permanent Marker','Road Rage',cursive;
  --scuff-display:'Bebas Neue',Impact,Haettenschweiler,'Arial Narrow Bold',sans-serif;
  --scuff-body:'Montserrat',Arial,Helvetica,sans-serif;
}

/* Typography */
body{font-family:var(--scuff-body)}
.hero h1,
.section-heading h2,
.coverage h2,
.quote-panel h2,
.quick-quote__label,
.faq-cta h2{
  font-family:var(--scuff-brush);
  font-style:normal;
  font-weight:400;
  letter-spacing:.2px;
}
.hero__copy .brush-kicker,
.brush-kicker{
  font-family:var(--scuff-hand);
  font-style:normal;
  font-weight:400;
  letter-spacing:.1px;
}
.section-heading span{
  font-family:var(--scuff-display);
  font-style:normal;
  font-weight:400;
  letter-spacing:1.2px;
}

/* ----------------------------------------------------------------------
   HERO — large visual centrepiece matching the approved concept
   ---------------------------------------------------------------------- */
.hero{
  min-height:770px;
  align-items:center;
  isolation:isolate;
  background-image:
    linear-gradient(90deg,rgba(3,4,5,.99) 0%,rgba(3,4,5,.91) 31%,rgba(3,4,5,.38) 62%,rgba(3,4,5,.82) 100%),
    var(--hero-bg,linear-gradient(140deg,#080a0c,#010203));
}

.hero__grid{
  grid-template-columns:minmax(360px,.94fr) minmax(540px,1.48fr) minmax(290px,.68fr);
  gap:0;
  align-items:center;
  padding:72px 0 58px;
}

.hero__copy{
  z-index:8;
  padding-left:4px;
}

.hero__copy .brush-kicker{
  color:#fff;
  font-size:clamp(28px,2.25vw,38px);
  line-height:1;
  text-shadow:2px 2px 0 #101010;
  transform:rotate(-2deg);
}

.hero h1{
  align-items:flex-start;
  margin:2px 0 13px;
  font-size:clamp(92px,8.6vw,144px);
  line-height:.61;
}

.hero h1 .hero-title{
  display:block;
  white-space:nowrap;
  transform:skew(-5deg) rotate(-2deg);
}

.hero h1 .hero-title--pink{
  color:var(--pink);
  text-shadow:4px 5px 0 #57002f,8px 9px 0 rgba(0,0,0,.65);
}

.hero h1 .hero-title--lime{
  margin-top:15px;
  color:var(--lime);
  text-shadow:4px 5px 0 #3a4a00,8px 9px 0 rgba(0,0,0,.65);
}

.hero__subtitle{
  max-width:560px;
  margin-top:18px;
  font-family:var(--scuff-hand);
  color:#fff;
  font-size:clamp(17px,1.4vw,23px);
  font-weight:400;
  line-height:1.25;
  text-transform:uppercase;
}

.hero__actions{
  margin-top:24px;
}

/* Car occupies the central visual field rather than looking like a thumbnail. */
.hero__vehicle{
  z-index:5;
  min-height:575px;
  max-width:400px;
  margin-left:145px;
  margin-right:115px;
  display:flex;
  align-items:center;
  justify-content:center;
  overflow:visible;
}

.hero__vehicle img{
  position:relative;
  z-index:4;
  width:154%;
  max-width:none;
  margin:28px -27% -4px -27%;
  filter:
    drop-shadow(0 35px 42px rgba(0,0,0,.86))
    drop-shadow(0 0 14px rgba(0,169,255,.12));
}

/* Large CSS splash layers. These scale cleanly and do not rely on tiny image files. */
.hero__splash{
  position:absolute;
  z-index:1;
  pointer-events:none;
  opacity:.84;
  filter:saturate(1.16);
}

.hero__splash::before,
.hero__splash::after{
  content:"";
  position:absolute;
  background:inherit;
}

.hero__splash--pink{
  width:590px;
  height:300px;
  left:39%;
  top:105px;
  background:
    radial-gradient(circle at 12% 34%,var(--pink) 0 3%,transparent 3.6%),
    radial-gradient(circle at 87% 15%,var(--pink) 0 2%,transparent 2.7%),
    radial-gradient(circle at 78% 78%,var(--pink) 0 2.6%,transparent 3.1%),
    var(--pink);
  clip-path:polygon(0 43%,11% 28%,25% 30%,36% 11%,50% 26%,65% 0,71% 29%,99% 17%,84% 43%,100% 58%,71% 63%,85% 91%,57% 74%,43% 100%,33% 72%,4% 90%,18% 61%);
  transform:rotate(-8deg);
  opacity:.72;
}

.hero__splash--blue{
  width:470px;
  height:230px;
  right:12%;
  bottom:95px;
  background:var(--blue);
  clip-path:polygon(0 48%,14% 31%,30% 36%,39% 4%,54% 29%,74% 12%,68% 41%,100% 27%,83% 53%,99% 70%,70% 66%,77% 98%,52% 75%,35% 100%,29% 69%,2% 82%,18% 58%);
  transform:rotate(8deg);
  opacity:.48;
}

.hero__splash--yellow{
  width:390px;
  height:170px;
  left:5%;
  bottom:42px;
  background:var(--yellow);
  clip-path:polygon(0 43%,16% 26%,31% 33%,42% 3%,53% 30%,70% 11%,66% 38%,100% 20%,79% 53%,96% 68%,66% 64%,74% 96%,52% 76%,37% 100%,31% 69%,2% 85%,19% 58%);
  transform:rotate(-8deg);
  opacity:.4;
}

/* Existing uploaded splash sheet now acts as texture across the car. */
.hero__paint-sheet{
  z-index:2;
  left:35%;
  top:78px;
  bottom:auto;
  width:58%;
  max-width:none;
  opacity:.62;
  mix-blend-mode:screen;
  image-rendering:auto;
}

/* ----------------------------------------------------------------------
   NEED A QUOTE — paint frame only; no square background
   ---------------------------------------------------------------------- */
.quick-quote{
  z-index:9;
  min-height:390px;
  padding:48px 34px 33px;
  background:transparent!important;
  border:0!important;
  box-shadow:none!important;
  clip-path:none!important;
  isolation:isolate;
  overflow:visible;
}

.quick-quote:before{
  content:"";
  position:absolute;
  z-index:-1;
  inset:-44px -40px -52px;
  background-image:var(--form-frame);
  background-size:100% 100%;
  background-position:center;
  background-repeat:no-repeat;
  pointer-events:none;
}

/* Soft irregular centre shading only. No rectangular panel edges. */
.quick-quote:after{
  content:"";
  position:absolute;
  z-index:-2;
  left:3%;
  right:3%;
  top:7%;
  bottom:7%;
  border-radius:44% 53% 47% 51% / 18% 20% 17% 22%;
  background:radial-gradient(ellipse at center,rgba(1,2,3,.97) 0 56%,rgba(1,2,3,.80) 68%,transparent 82%);
  filter:blur(1px);
  pointer-events:none;
}

.quick-quote__label{
  color:var(--yellow);
  font-size:clamp(31px,2.15vw,39px);
  line-height:.9;
  transform:rotate(-2deg);
}

.quick-quote p{
  color:#fff;
  font-size:13px;
  line-height:1.4;
}

.quick-quote__response{
  border-top:0;
}

/* ----------------------------------------------------------------------
   HEADINGS / GENERAL SCALE
   ---------------------------------------------------------------------- */
.section{
  padding-top:45px;
  padding-bottom:46px;
}

.section-heading{
  margin-bottom:24px;
}

.section-heading h2{
  font-size:clamp(46px,4.35vw,67px);
  line-height:.82;
}

.section-heading h2:after{
  width:150px;
  margin-top:9px;
}

/* ----------------------------------------------------------------------
   SERVICES
   ---------------------------------------------------------------------- */
.services{
  padding-top:34px;
}

.service-card__art{
  height:184px;
}

.service-card h3{
  font-family:var(--scuff-brush);
  font-size:31px;
  line-height:.78;
  font-weight:400;
}

.service-card p{
  font-size:12px;
}

/* ----------------------------------------------------------------------
   COMPARISON
   ---------------------------------------------------------------------- */
.comparison-section{
  padding-top:22px;
  padding-bottom:28px;
}

.comparison{
  aspect-ratio:16/3.3;
}

/* ----------------------------------------------------------------------
   BENEFITS
   ---------------------------------------------------------------------- */
.benefits{
  padding-top:25px;
  padding-bottom:34px;
}

.benefit__art{
  height:166px;
}

.benefit p{
  max-width:170px;
  font-size:11px;
}

/* ----------------------------------------------------------------------
   HOW IT WORKS — entirely HTML/CSS/SVG
   ---------------------------------------------------------------------- */
.process{
  padding-top:27px;
  padding-bottom:33px;
}

.process-grid{
  display:grid;
  grid-template-columns:repeat(4,1fr);
  gap:0;
}

.process-step{
  position:relative;
  min-height:210px;
  padding:5px 30px 8px;
  text-align:center;
}

.process-step__visual{
  position:relative;
  display:flex;
  align-items:center;
  justify-content:center;
  gap:5px;
  min-height:115px;
}

.process-step__number{
  position:relative;
  z-index:1;
  display:block;
  margin:0;
  font-family:var(--scuff-brush);
  font-size:112px;
  font-weight:400;
  line-height:.75;
  text-shadow:4px 5px 0 #111;
  transform:rotate(-5deg);
}

.process-step__icon{
  position:relative;
  z-index:2;
  display:grid;
  place-items:center;
  width:67px;
  height:67px;
  margin-left:-10px;
  color:#fff;
}

.process-step__icon svg{
  width:62px;
  height:62px;
  overflow:visible;
  fill:none;
  stroke:currentColor;
  stroke-width:3.1;
  stroke-linecap:round;
  stroke-linejoin:round;
  filter:drop-shadow(2px 3px 0 #111);
}

.process-step__copy h3{
  margin:0 0 6px;
  font-family:var(--scuff-display);
  color:#fff;
  font-size:17px;
  font-weight:400;
  letter-spacing:.5px;
  text-transform:uppercase;
}

.process-step__copy p{
  max-width:195px;
  margin:0 auto;
  color:#ddd;
  font-size:11px;
  line-height:1.36;
}

.process-step__arrow{
  right:-18px;
  top:66px;
  font-family:var(--scuff-hand);
  font-size:43px;
}

/* Explicitly kill old mapped process-image layout if cached markup remains. */
.process-step__art{
  display:none!important;
}

/* ----------------------------------------------------------------------
   TESTIMONIALS
   ---------------------------------------------------------------------- */
.testimonials{
  padding-top:25px;
  padding-bottom:34px;
}

.testimonial-grid{
  max-width:1290px;
  gap:48px;
}

.testimonial{
  min-height:195px;
  padding:29px 32px 24px;
}

.testimonial:after{
  content:"";
  position:absolute;
  left:-22px;
  right:-22px;
  bottom:-9px;
  height:20px;
  background:currentColor;
  opacity:.23;
  clip-path:polygon(0 42%,17% 18%,33% 45%,48% 13%,68% 53%,100% 20%,96% 70%,72% 78%,49% 58%,22% 87%,3% 68%);
  pointer-events:none;
}

/* ----------------------------------------------------------------------
   GALLERY — make the imagery a visual section, not a tiny strip
   ---------------------------------------------------------------------- */
.repair-gallery{
  padding-top:24px;
  padding-bottom:39px;
}

.repair-filter-bar{
  margin-bottom:15px;
}

.repair-grid{
  min-height:205px;
}

.repair-tile{
  min-height:205px;
}

/* ----------------------------------------------------------------------
   COVERAGE
   ---------------------------------------------------------------------- */
.coverage{
  padding:42px 0;
}

.coverage__grid{
  grid-template-columns:.78fr 1.22fr;
  gap:28px;
}

.coverage h2{
  font-size:clamp(52px,5vw,76px);
  line-height:.8;
}

.coverage__map{
  min-height:385px;
}

/* ----------------------------------------------------------------------
   FAQ — not in approved desktop concept; retained for approved mobile flow
   ---------------------------------------------------------------------- */
.faq-section{
  display:none;
}

/* ----------------------------------------------------------------------
   CTA / FOOTER
   ---------------------------------------------------------------------- */
.quote-panel{
  min-height:150px;
  padding:31px 43px;
}

.quote-panel h2{
  font-size:clamp(48px,4.5vw,68px);
  line-height:.8;
}

.footer-grid{
  padding-top:37px;
}

/* ----------------------------------------------------------------------
   TABLET
   ---------------------------------------------------------------------- */
@media(max-width:1180px){
  .hero__grid{
    grid-template-columns:.9fr 1.3fr .7fr;
  }
  .hero__vehicle{
    margin-left:-100px;
    margin-right:-80px;
  }
  .hero__vehicle img{
    width:148%;
  }
}

/* ----------------------------------------------------------------------
   MOBILE — closely follows the approved tall mobile concept
   ---------------------------------------------------------------------- */
@media(max-width:760px){
  .hero{
    min-height:auto;
  }

  .hero__grid{
    display:flex;
    flex-direction:column;
    padding:24px 0 34px;
  }

  .hero__copy{
    width:100%;
    text-align:center;
  }

  .hero__copy .brush-kicker{
    font-size:24px;
  }

  .hero h1{
    align-items:center;
    font-size:clamp(72px,22vw,98px);
    line-height:.62;
  }

  .hero h1 .hero-title--lime{
    margin-top:13px;
  }

  .hero__subtitle{
    max-width:340px;
    margin:17px auto 0;
    font-size:15px;
  }

  .hero__vehicle{
    order:2;
    width:100%;
    min-height:330px;
    margin:-4px 0 -8px;
  }

  .hero__vehicle img{
    width:145%;
    margin:0 -22.5%;
  }

  .hero__paint-sheet{
    left:7%;
    top:230px;
    width:94%;
    opacity:.6;
  }

  .hero__splash--pink{
    width:430px;
    height:210px;
    left:23%;
    top:240px;
  }

  .hero__splash--blue{
    width:300px;
    height:160px;
    right:-25px;
    bottom:125px;
  }

  .hero__splash--yellow{
    width:280px;
    height:130px;
    left:-45px;
    bottom:170px;
  }

  .hero__actions--mobile{
    order:3;
  }

  .quick-quote{
    display:none;
  }

  .section-heading h2{
    font-size:clamp(39px,12vw,54px);
  }

  .service-card__art{
    height:136px;
  }

  .service-card h3{
    font-size:27px;
  }

  .benefit__art{
    height:145px;
  }

  .process-grid{
    max-width:390px;
    margin-inline:auto;
    grid-template-columns:1fr;
  }

  .process-step{
    display:grid;
    grid-template-columns:115px 1fr;
    min-height:150px;
    align-items:center;
    padding:4px 10px 30px;
    text-align:left;
  }

  .process-step__visual{
    min-height:112px;
    justify-content:flex-start;
    gap:0;
  }

  .process-step__number{
    font-size:98px;
  }

  .process-step__icon{
    width:58px;
    height:58px;
    margin-left:-24px;
  }

  .process-step__icon svg{
    width:54px;
    height:54px;
  }

  .process-step__copy h3{
    font-size:18px;
  }

  .process-step__copy p{
    max-width:none;
    margin:0;
    font-size:11px;
  }

  .process-step__arrow{
    left:50px;
    right:auto;
    top:auto;
    bottom:-3px;
    transform:rotate(90deg);
    font-size:35px;
  }

  .repair-tile{
    min-height:165px;
  }

  .coverage__map{
    min-height:270px;
  }

  .faq-section{
    display:block;
  }
}

@media(max-width:430px){
  .hero h1{
    font-size:70px;
  }
  .hero__vehicle{
    min-height:285px;
  }
  .hero__vehicle img{
    width:151%;
    margin:0 -25.5%;
  }
  .service-card__art{height:122px}
  .benefit__art{height:132px}
  .repair-tile{min-height:145px}
}


/* ======================================================================
   SCUFF OFF v1.8 — FULL-WIDTH + ORGANIC HERO PAINT
   This layer intentionally fixes the two issues reported after v1.7:
   1. pointed/star-like hero shapes
   2. desktop canvas constrained too narrowly
   ====================================================================== */

/* ----------------------------------------------------------------------
   FULL-WIDTH RESPONSIVE CANVAS
   ---------------------------------------------------------------------- */

/*
 * The approved composition is visually full-width. Rather than imposing a
 * 1360/1450px content cap, shells now span the viewport and use responsive
 * gutters. This preserves breathing room without shrinking the whole design
 * into a narrow column on large monitors.
 */
.shell{
  width:100%;
  max-width:none;
  margin-inline:0;
  padding-inline:clamp(22px,4vw,72px);
}

/* Header can use the full canvas while retaining its existing grid. */
.site-header__inner{
  width:100%;
}

/* Main visual strips genuinely fill the browser width. */
.hero,
.trust-strip,
.services,
.comparison-section,
.benefits,
.process,
.testimonials,
.repair-gallery,
.coverage,
.faq-section,
.quote-section,
.site-footer{
  width:100%;
}

/* Allow major feature sections to feel wide like the approved desktop art. */
.comparison-section .shell,
.repair-gallery .shell,
.coverage .shell,
.quote-section .shell{
  padding-inline:clamp(18px,3vw,48px);
}

/* ----------------------------------------------------------------------
   HERO ORGANIC PAINT — NO POLYGON / STAR SHAPES
   ---------------------------------------------------------------------- */

/*
 * Remove the v1.7 polygon silhouettes completely. The replacement consists
 * of stretched irregular daubs plus pseudo-element splatters. Nothing uses
 * a pointed clip-path.
 */
.hero__splash{
  position:absolute;
  z-index:1;
  pointer-events:none;
  clip-path:none!important;
  filter:none;
  transform-origin:center;
}

.hero__splash::before,
.hero__splash::after{
  content:"";
  position:absolute;
  pointer-events:none;
}

/* PINK: broad sprayed swipe behind the roof / upper body */
.hero__splash--pink{
  left:38%;
  top:122px;
  width:520px;
  height:128px;
  opacity:.76;
  transform:rotate(-9deg);
  border-radius:58% 42% 61% 39% / 48% 59% 41% 52%;
  background:
    radial-gradient(circle at 8% 36%,rgba(244,0,120,.98) 0 2.4%,transparent 2.8%),
    radial-gradient(circle at 18% 78%,rgba(244,0,120,.95) 0 1.7%,transparent 2.2%),
    radial-gradient(circle at 78% 15%,rgba(244,0,120,.95) 0 2%,transparent 2.5%),
    linear-gradient(91deg,rgba(244,0,120,.12),var(--pink) 16% 81%,rgba(244,0,120,.05));
  box-shadow:
    -55px 28px 0 -49px var(--pink),
    -82px 56px 0 -76px var(--pink),
    42px -38px 0 -35px var(--pink),
    88px 34px 0 -82px var(--pink),
    120px 8px 0 -113px var(--pink);
}

.hero__splash--pink::before{
  left:-45px;
  top:71px;
  width:620px;
  height:23px;
  border-radius:70% 30% 64% 36%;
  background:linear-gradient(90deg,transparent,var(--pink) 10% 79%,transparent);
  opacity:.82;
  transform:rotate(5deg);
}

.hero__splash--pink::after{
  left:82px;
  top:112px;
  width:280px;
  height:5px;
  background:var(--pink);
  border-radius:999px;
  box-shadow:
    32px 12px 0 -1px var(--pink),
    87px 25px 0 -1px var(--pink),
    156px 8px 0 -1px var(--pink),
    208px 31px 0 -1px var(--pink);
  opacity:.75;
}

/* BLUE: long low swipe around wheels / lower vehicle */
.hero__splash--blue{
  right:8%;
  bottom:120px;
  width:550px;
  height:92px;
  opacity:.58;
  transform:rotate(5deg);
  border-radius:42% 58% 37% 63% / 55% 39% 61% 45%;
  background:linear-gradient(89deg,transparent 0,var(--blue) 14% 86%,transparent 100%);
  box-shadow:
    -72px 32px 0 -63px var(--blue),
    58px -28px 0 -51px var(--blue),
    118px 31px 0 -111px var(--blue);
}

.hero__splash--blue::before{
  left:35px;
  top:-25px;
  width:430px;
  height:28px;
  border-radius:35% 65% 55% 45%;
  background:var(--blue);
  opacity:.58;
  transform:rotate(-4deg);
}

.hero__splash--blue::after{
  right:25px;
  top:78px;
  width:9px;
  height:58px;
  border-radius:50% 50% 70% 70%;
  background:var(--blue);
  opacity:.58;
  box-shadow:
    -58px -14px 0 -2px var(--blue),
    -118px 11px 0 -3px var(--blue),
    -178px -5px 0 -3px var(--blue);
}

/* YELLOW: dirty low brush burst rather than a geometric object */
.hero__splash--yellow{
  left:3%;
  bottom:55px;
  width:430px;
  height:96px;
  opacity:.52;
  transform:rotate(-5deg);
  border-radius:60% 40% 52% 48% / 45% 61% 39% 55%;
  background:linear-gradient(90deg,transparent 0,var(--yellow) 12% 75%,transparent 100%);
  box-shadow:
    -27px -37px 0 -20px var(--yellow),
    44px -55px 0 -47px var(--yellow),
    107px 43px 0 -100px var(--yellow),
    224px -27px 0 -216px var(--yellow);
}

.hero__splash--yellow::before{
  left:26px;
  top:12px;
  width:330px;
  height:17px;
  border-radius:999px;
  background:var(--yellow);
  opacity:.68;
  transform:rotate(7deg);
}

.hero__splash--yellow::after{
  left:58px;
  bottom:-31px;
  width:7px;
  height:52px;
  border-radius:0 0 70% 70%;
  background:var(--yellow);
  box-shadow:
    78px 14px 0 -1px var(--yellow),
    171px -8px 0 -2px var(--yellow);
  opacity:.52;
}

/*
 * The uploaded hero paint sheet is real paint artwork, so keep it as a
 * secondary texture. It is deliberately broad and behind the vehicle.
 */
.hero__paint-sheet{
  left:32%;
  top:68px;
  width:64%;
  max-width:none;
  opacity:.72;
  mix-blend-mode:screen;
}

/* Larger central vehicle, while preventing it from escaping the viewport. */
.hero__vehicle{
  min-width:0;
  overflow:visible;
}

.hero__vehicle img{
  width:min(158%,1120px);
}

/* Quote artwork remains above paint. */
.quick-quote{
  z-index:12;
}

/* ----------------------------------------------------------------------
   LARGE DESKTOP — use the extra canvas instead of creating empty margins
   ---------------------------------------------------------------------- */

@media(min-width:1500px){
  .shell{
    padding-inline:clamp(42px,4vw,86px);
  }

  .hero__grid{
    grid-template-columns:minmax(390px,.88fr) minmax(650px,1.52fr) minmax(300px,.62fr);
  }

  .hero__vehicle img{
    width:min(163%,1240px);
  }

  .hero__paint-sheet{
    left:34%;
    width:60%;
  }

  .service-card__art{
    height:200px;
  }

  .benefit__art{
    height:180px;
  }

  .comparison{
    aspect-ratio:16/3.05;
  }

  .repair-tile{
    min-height:225px;
  }

  .coverage__map{
    min-height:420px;
  }
}

/* ----------------------------------------------------------------------
   TABLET / SMALL LAPTOP
   ---------------------------------------------------------------------- */

@media(max-width:1180px){
  .shell{
    padding-inline:32px;
  }

  .hero__grid{
    grid-template-columns:.9fr 1.26fr .72fr;
  }

  .hero__vehicle{
    margin-left:-90px;
    margin-right:-70px;
  }

  .hero__vehicle img{
    width:148%;
  }

  .hero__splash--pink{
    left:35%;
    top:130px;
    width:430px;
    height:105px;
  }

  .hero__splash--blue{
    right:4%;
    width:410px;
  }

  .hero__splash--yellow{
    left:0;
    width:340px;
  }

  .service-grid{
    grid-template-columns:repeat(3,1fr);
  }

  .benefit-grid{
    grid-template-columns:repeat(3,1fr);
  }
}

/* ----------------------------------------------------------------------
   TABLET PORTRAIT
   ---------------------------------------------------------------------- */

@media(max-width:900px){
  .shell{
    padding-inline:24px;
  }

  .hero__grid{
    grid-template-columns:1fr 1.05fr;
    gap:8px;
  }

  .hero__vehicle{
    margin-left:-45px;
    margin-right:-25px;
  }

  .hero__vehicle img{
    width:135%;
  }

  .quick-quote{
    grid-column:1/-1;
    width:min(520px,82vw);
    margin-inline:auto;
  }

  .hero__splash--pink{
    left:45%;
    width:390px;
  }

  .hero__splash--blue{
    right:-8%;
  }

  .hero__paint-sheet{
    left:42%;
    width:68%;
  }

  .coverage__grid{
    grid-template-columns:1fr 1fr;
  }
}

/* ----------------------------------------------------------------------
   MOBILE
   ---------------------------------------------------------------------- */

@media(max-width:760px){
  .shell{
    width:100%;
    padding-inline:16px;
  }

  .hero{
    overflow:hidden;
  }

  .hero__grid{
    width:100%;
    padding-inline:0;
  }

  .hero__vehicle{
    overflow:visible;
  }

  .hero__vehicle img{
    width:145%;
    max-width:none;
  }

  /* Paint becomes long brush strokes behind the mobile car. */
  .hero__splash--pink{
    left:12%;
    top:232px;
    width:390px;
    height:94px;
    transform:rotate(-7deg);
  }

  .hero__splash--pink::before{
    width:430px;
  }

  .hero__splash--blue{
    right:-100px;
    bottom:130px;
    width:360px;
    height:72px;
  }

  .hero__splash--yellow{
    left:-110px;
    bottom:168px;
    width:330px;
    height:72px;
  }

  .hero__paint-sheet{
    left:0;
    top:220px;
    width:100%;
    opacity:.65;
  }

  .comparison-section .shell,
  .repair-gallery .shell,
  .coverage .shell,
  .quote-section .shell{
    padding-inline:13px;
  }

  .service-grid{
    grid-template-columns:repeat(2,minmax(0,1fr));
  }

  .benefit-grid{
    grid-template-columns:repeat(2,minmax(0,1fr));
  }

  .repair-grid{
    grid-template-columns:repeat(2,minmax(0,1fr));
  }

  .coverage__grid{
    grid-template-columns:1fr;
  }
}

@media(max-width:460px){
  .shell{
    padding-inline:11px;
  }

  .hero__splash--pink{
    left:6%;
    width:350px;
  }

  .hero__splash--blue{
    right:-130px;
  }

  .hero__splash--yellow{
    left:-140px;
  }

  .hero__vehicle img{
    width:151%;
  }
}


/* ======================================================================
   SCUFF OFF v1.9 — COVERAGE HEIGHT + PAINT POLISH
   ====================================================================== */

/* ----------------------------------------------------------------------
   MORE AUTHENTIC PAINT LANGUAGE
   ---------------------------------------------------------------------- */

/*
 * Previous iterations leaned too heavily on clip-path polygons.  v1.9 uses
 * broad brush strokes, imperfect rounded edges, overspray and droplets.
 */

.section-heading{
  overflow:visible;
}

.section-heading h2{
  position:relative;
  display:inline-block;
  overflow:visible;
}

/* Replace the simple geometric underline with a rough painted swipe. */
.section-heading h2:after{
  content:"";
  position:absolute;
  left:50%;
  bottom:-13px;
  width:58%;
  min-width:120px;
  max-width:210px;
  height:9px;
  margin:0;
  transform:translateX(-50%) rotate(-2deg);
  background:
    radial-gradient(circle at 5% 65%,var(--pink) 0 5%,transparent 6%),
    radial-gradient(circle at 92% 28%,var(--blue) 0 4%,transparent 5%),
    linear-gradient(90deg,
      transparent 0 2%,
      var(--pink) 3% 63%,
      var(--blue) 66% 96%,
      transparent 98%);
  border-radius:61% 39% 55% 45% / 52% 37% 63% 48%;
  clip-path:none!important;
  filter:drop-shadow(0 2px 0 rgba(0,0,0,.35));
}

/* Fine overspray around important headings. */
.section-heading:after{
  content:"";
  position:absolute;
  left:50%;
  top:calc(100% - 4px);
  width:220px;
  height:28px;
  transform:translateX(-50%);
  pointer-events:none;
  opacity:.42;
  background:
    radial-gradient(circle at 8% 35%,var(--pink) 0 1.3px,transparent 1.8px),
    radial-gradient(circle at 18% 72%,var(--pink) 0 1px,transparent 1.6px),
    radial-gradient(circle at 77% 28%,var(--blue) 0 1.2px,transparent 1.8px),
    radial-gradient(circle at 91% 66%,var(--blue) 0 1px,transparent 1.5px);
}

/* Hero paint: soften into overlapping physical brush marks. */
.hero__splash{
  mix-blend-mode:screen;
  filter:saturate(1.08) contrast(1.03);
}

.hero__splash--pink{
  background:
    radial-gradient(ellipse at 20% 54%,rgba(244,0,120,.95) 0 18%,transparent 20%),
    radial-gradient(ellipse at 58% 46%,rgba(244,0,120,.93) 0 31%,transparent 33%),
    radial-gradient(ellipse at 83% 55%,rgba(244,0,120,.82) 0 16%,transparent 18%),
    linear-gradient(90deg,transparent 0 5%,rgba(244,0,120,.96) 13% 85%,transparent 97%);
  border-radius:65% 35% 58% 42% / 44% 57% 43% 56%;
}

.hero__splash--blue{
  background:
    radial-gradient(ellipse at 17% 48%,rgba(0,169,244,.9) 0 18%,transparent 20%),
    radial-gradient(ellipse at 50% 53%,rgba(0,169,244,.88) 0 34%,transparent 36%),
    radial-gradient(ellipse at 84% 48%,rgba(0,169,244,.74) 0 15%,transparent 18%),
    linear-gradient(90deg,transparent 0 4%,var(--blue) 15% 84%,transparent 98%);
}

.hero__splash--yellow{
  background:
    radial-gradient(ellipse at 22% 52%,rgba(244,233,0,.9) 0 18%,transparent 21%),
    radial-gradient(ellipse at 51% 46%,rgba(244,233,0,.86) 0 31%,transparent 34%),
    radial-gradient(ellipse at 79% 57%,rgba(244,233,0,.67) 0 15%,transparent 18%),
    linear-gradient(90deg,transparent 0 5%,var(--yellow) 15% 81%,transparent 97%);
}

/* Buttons get an irregular painted shadow rather than hard starburst edges. */
.btn:before{
  clip-path:none!important;
  inset:-4px -7px;
  border-radius:58% 42% 53% 47% / 45% 58% 42% 55%;
  filter:blur(.4px);
}

/* Process number paint: organic daub behind the digit. */
.process-step__number:before{
  inset:16% -24% 8% -20%;
  clip-path:none!important;
  border-radius:54% 46% 62% 38% / 48% 56% 44% 52%;
  opacity:.3;
  filter:blur(.25px);
}

.process-step__number:after{
  content:"";
  position:absolute;
  z-index:-2;
  left:-16%;
  right:-22%;
  top:58%;
  height:8px;
  background:currentColor;
  border-radius:999px;
  opacity:.45;
  transform:rotate(-5deg);
  box-shadow:
    14px 14px 0 -3px currentColor,
    48px -17px 0 -3px currentColor,
    87px 17px 0 -3px currentColor;
}

/* Service/benefit imagery should float naturally rather than feel boxed in. */
.service-card,
.benefit{
  overflow:visible;
}

.service-card__art,
.benefit__art{
  filter:
    drop-shadow(0 8px 13px rgba(0,0,0,.34))
    saturate(1.06);
}

/* Testimonials: distressed paint frames without geometric shards. */
.testimonial{
  overflow:visible;
}

.testimonial:before{
  inset:-5px;
  border:2px solid currentColor;
  border-radius:7px 12px 5px 10px / 10px 6px 12px 7px;
  clip-path:none!important;
  opacity:.35;
  transform:rotate(-.35deg);
}

.testimonial:after{
  left:-18px;
  right:-14px;
  bottom:-11px;
  height:12px;
  clip-path:none!important;
  border-radius:61% 39% 56% 44%;
  transform:rotate(-1.5deg);
  opacity:.28;
  box-shadow:
    23px 10px 0 -4px currentColor,
    67px -8px 0 -4px currentColor,
    124px 9px 0 -5px currentColor,
    220px -4px 0 -5px currentColor;
}

/* Quote CTA paint texture becomes more visible but remains behind live content. */
.quote-panel:before{
  opacity:.55;
  filter:saturate(1.08) contrast(1.03);
}

/* Footer paint line becomes an imperfect sprayed strip. */
.paint-line{
  position:relative;
  height:7px;
  background:
    linear-gradient(90deg,
      var(--pink) 0 24%,
      var(--blue) 27% 50%,
      var(--yellow) 53% 75%,
      var(--lime) 78% 100%);
}

.paint-line:after{
  content:"";
  position:absolute;
  inset:-6px 0;
  opacity:.38;
  background:
    radial-gradient(circle at 6% 50%,var(--pink) 0 2px,transparent 2.7px),
    radial-gradient(circle at 30% 22%,var(--blue) 0 1.7px,transparent 2.3px),
    radial-gradient(circle at 58% 78%,var(--yellow) 0 1.8px,transparent 2.4px),
    radial-gradient(circle at 87% 28%,var(--lime) 0 2px,transparent 2.7px);
}

/* ----------------------------------------------------------------------
   COVERAGE — MORE HEIGHT / NEVER CROP THE TOP OF THE ARTWORK
   ---------------------------------------------------------------------- */

.coverage{
  padding-top:58px!important;
  padding-bottom:56px!important;
  overflow:visible;
}

.coverage__grid{
  align-items:center;
  min-height:510px;
}

/*
 * The graphic has artwork very close to its upper edge. Give the map panel
 * real vertical room and use contain rather than cover so no part is cropped.
 */
.coverage__map{
  min-height:500px!important;
  height:500px;
  overflow:visible!important;
  background-size:contain!important;
  background-repeat:no-repeat!important;
  background-position:center 18px!important;
  border:0;
  box-shadow:none;
}

/* Keep any generated overlay very subtle so the supplied artwork remains visible. */
.coverage__map:after{
  inset:-8px;
  box-shadow:inset 0 0 42px rgba(2,3,4,.45);
  border-radius:20px;
}

.coverage__map .map-lines{
  opacity:.035!important;
}

/* Position live pin content lower so it doesn't sit over the graphic title. */
.map-pin{
  top:58%;
}

/* Give the copy side comparable breathing room. */
.coverage__copy{
  padding-top:28px;
  padding-bottom:28px;
}

.coverage h2{
  margin-bottom:16px;
}

/* Decorative paint swipe behind coverage copy. */
.coverage__copy:before{
  content:"";
  position:absolute;
  z-index:-1;
  left:-60px;
  top:28px;
  width:380px;
  height:95px;
  background:
    radial-gradient(ellipse at 30% 50%,rgba(244,0,120,.35) 0 24%,transparent 26%),
    linear-gradient(90deg,transparent,rgba(244,0,120,.2) 12% 72%,transparent);
  border-radius:64% 36% 58% 42%;
  transform:rotate(-5deg);
  pointer-events:none;
}

.coverage__copy{
  position:relative;
  z-index:1;
}

/* ----------------------------------------------------------------------
   LARGE DESKTOP
   ---------------------------------------------------------------------- */

@media(min-width:1500px){
  .coverage__grid{
    min-height:570px;
  }

  .coverage__map{
    min-height:560px!important;
    height:560px;
    background-position:center 22px!important;
  }

  .coverage__copy{
    padding-left:4vw;
  }
}

/* ----------------------------------------------------------------------
   TABLET
   ---------------------------------------------------------------------- */

@media(max-width:1180px){
  .coverage__grid{
    min-height:450px;
  }

  .coverage__map{
    min-height:440px!important;
    height:440px;
    background-position:center 16px!important;
  }
}

@media(max-width:900px){
  .coverage{
    padding-top:48px!important;
  }

  .coverage__grid{
    min-height:420px;
  }

  .coverage__map{
    min-height:400px!important;
    height:400px;
  }
}

/* ----------------------------------------------------------------------
   MOBILE
   ---------------------------------------------------------------------- */

@media(max-width:760px){
  .section-heading h2:after{
    bottom:-10px;
    min-width:95px;
    max-width:150px;
    height:7px;
  }

  .section-heading:after{
    width:160px;
  }

  .coverage{
    padding-top:42px!important;
    padding-bottom:42px!important;
  }

  .coverage__grid{
    min-height:0;
  }

  .coverage__copy{
    padding-top:0;
    padding-bottom:8px;
  }

  .coverage__copy:before{
    left:50%;
    top:20px;
    width:310px;
    transform:translateX(-50%) rotate(-5deg);
  }

  .coverage__map{
    min-height:350px!important;
    height:350px;
    background-position:center 12px!important;
  }

  .map-pin{
    top:60%;
  }
}

@media(max-width:460px){
  .coverage__map{
    min-height:320px!important;
    height:320px;
  }
}


/* ======================================================================
   SCUFF OFF v2.0 — REPAIR CASE STUDY PAGES
   Added on top of the exact v1.9 homepage/header/paint styling.
   ====================================================================== */
.repair-case-study{background:#030405;overflow:hidden}
.repair-case-study h1,.repair-case-study h2{font-family:var(--scuff-brush,'Road Rage',Impact,sans-serif);font-weight:400;text-transform:uppercase}
.repair-hero{position:relative;min-height:650px;display:flex;align-items:center;overflow:hidden;background:radial-gradient(circle at 74% 45%,rgba(0,169,244,.09),transparent 28%),#030405}
.repair-hero__grid{position:relative;z-index:3;display:grid;grid-template-columns:.86fr 1.14fr;gap:34px;align-items:center;padding-top:120px;padding-bottom:68px}
.repair-hero__copy{position:relative;z-index:5}.repair-hero__copy .brush-kicker{color:var(--pink);font-size:21px}
.repair-hero h1{max-width:700px;margin:7px 0 18px;color:#fff;font-size:clamp(58px,6vw,94px);line-height:.77;text-shadow:4px 5px 0 #151515}
.repair-hero__meta{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:25px}.repair-hero__meta span{padding:7px 11px;border:1px solid rgba(255,255,255,.18);background:rgba(0,0,0,.45);font-family:var(--scuff-display,'Bebas Neue',sans-serif);font-size:14px;letter-spacing:.7px;text-transform:uppercase}
.repair-hero__image{position:relative;min-height:440px;display:flex;align-items:center;justify-content:center}.repair-hero__image:before{content:"";position:absolute;inset:7% -3% 4% 2%;z-index:-1;background:radial-gradient(ellipse at 45% 52%,rgba(244,0,120,.78),transparent 48%),radial-gradient(ellipse at 68% 46%,rgba(0,169,244,.62),transparent 46%);filter:blur(8px);opacity:.58}.repair-hero__image img{width:100%;height:460px;object-fit:cover;filter:drop-shadow(0 30px 35px rgba(0,0,0,.62))}
.repair-hero__paint{position:absolute;z-index:1;pointer-events:none;border-radius:60% 40% 55% 45%}.repair-hero__paint--pink{left:37%;top:145px;width:510px;height:84px;transform:rotate(-8deg);background:linear-gradient(90deg,transparent,var(--pink) 12% 84%,transparent);opacity:.54}.repair-hero__paint--blue{right:-40px;bottom:75px;width:580px;height:85px;transform:rotate(5deg);background:linear-gradient(90deg,transparent,var(--blue) 14% 84%,transparent);opacity:.38}
.repair-facts{border-block:1px solid rgba(255,255,255,.12);background:#08090a}.repair-facts__grid{display:grid;grid-template-columns:repeat(4,1fr)}.repair-facts__grid>div{padding:21px 28px;border-right:1px solid rgba(255,255,255,.1)}.repair-facts__grid>div:last-child{border-right:0}.repair-facts small,.repair-facts strong{display:block}.repair-facts small{margin-bottom:4px;color:var(--blue);font-size:10px;font-weight:900;letter-spacing:1px;text-transform:uppercase}.repair-facts strong{font-family:var(--scuff-display,'Bebas Neue',sans-serif);font-size:20px;font-weight:400;text-transform:uppercase}
.repair-request{padding-top:62px!important;padding-bottom:64px!important}.repair-request__grid{display:grid;grid-template-columns:1.05fr .95fr;gap:62px;align-items:center}.repair-photo-frame{position:relative;min-height:480px}.repair-photo-frame:before{content:"";position:absolute;inset:-17px;z-index:0;background:linear-gradient(94deg,var(--pink),transparent 42%,var(--blue));opacity:.34;border-radius:55% 45% 60% 40%/5% 9% 6% 8%;transform:rotate(-1deg)}.repair-photo-frame img{position:relative;z-index:1;width:100%;height:480px;object-fit:cover}.repair-photo-frame span{position:absolute;z-index:2;left:18px;top:18px;padding:8px 13px;background:var(--pink);font-family:var(--scuff-display,'Bebas Neue',sans-serif);font-size:16px;text-transform:uppercase}
.repair-request__copy .brush-kicker{color:var(--blue)}.repair-request__copy h2,.repair-result h2,.repair-case-cta h2{margin:5px 0 18px;font-size:clamp(46px,5vw,72px);line-height:.8}.repair-lead{font-size:17px;line-height:1.65;color:#f5f5f5}.repair-note{margin-top:22px;padding:18px 20px;border-left:4px solid var(--yellow);background:#0b0d0f}.repair-note strong{color:var(--yellow);text-transform:uppercase}.repair-note p{margin:5px 0 0;color:#ccc}.repair-tags{display:flex;flex-wrap:wrap;gap:8px;margin-top:22px}.repair-tags span{padding:7px 11px;background:rgba(244,0,120,.13);border:1px solid rgba(244,0,120,.5);font-size:11px;font-weight:800;text-transform:uppercase}
.repair-work{background:#060708}.repair-work__intro{max-width:850px;margin:-2px auto 34px;text-align:center;color:#ccc}.repair-work__steps{display:grid;grid-template-columns:repeat(4,1fr)}.repair-work-step{padding:16px 28px 18px;text-align:center;border-right:1px solid rgba(255,255,255,.09)}.repair-work-step:last-child{border-right:0}.repair-work-step__number{display:block;margin-bottom:-7px;font-family:var(--scuff-brush,'Road Rage',Impact,sans-serif);font-size:100px;line-height:.8;transform:rotate(-5deg);text-shadow:4px 5px 0 #111}.repair-work-step--1 .repair-work-step__number{color:var(--pink)}.repair-work-step--2 .repair-work-step__number{color:var(--blue)}.repair-work-step--3 .repair-work-step__number{color:var(--yellow)}.repair-work-step--4 .repair-work-step__number{color:var(--lime)}.repair-work-step h3{margin:0 0 7px;font-family:var(--scuff-display,'Bebas Neue',sans-serif);font-size:20px;font-weight:400;text-transform:uppercase}.repair-work-step p{margin:0;color:#bbb;font-size:12px;line-height:1.5}
.repair-comparison-section{padding-top:36px!important}.repair-comparison{aspect-ratio:16/5.7;min-height:420px}
.repair-case-gallery{background:#050607}.repair-case-gallery__grid{display:grid;grid-template-columns:repeat(12,1fr);grid-auto-rows:165px;gap:7px}.repair-case-gallery__item{overflow:hidden;background:#111}.repair-case-gallery__item img{width:100%;height:100%;object-fit:cover;transition:transform .28s ease}.repair-case-gallery__item:hover img{transform:scale(1.045)}.repair-case-gallery__item--1{grid-column:span 6;grid-row:span 2}.repair-case-gallery__item--2,.repair-case-gallery__item--3,.repair-case-gallery__item--5{grid-column:span 3}.repair-case-gallery__item--4{grid-column:span 6}
.repair-result{padding-top:58px!important;padding-bottom:58px!important;background:radial-gradient(circle at 16% 50%,rgba(244,0,120,.15),transparent 28%),#050607}.repair-result__grid{display:grid;grid-template-columns:1fr .78fr;gap:65px;align-items:center}.repair-result .brush-kicker{color:var(--pink)}.repair-result p{max-width:720px;color:#ddd;font-size:16px;line-height:1.65}.repair-result__checks{display:grid;grid-template-columns:repeat(2,1fr);gap:12px}.repair-result__checks span{display:flex;align-items:center;gap:10px;padding:15px 16px;background:#0b0d0f;border:1px solid rgba(255,255,255,.09);font-size:12px;font-weight:800;text-transform:uppercase}.repair-result__checks b{display:grid;place-items:center;width:25px;height:25px;border-radius:50%;background:var(--lime);color:#030405;font-size:15px}
.repair-review{padding-top:44px!important;padding-bottom:50px!important}.repair-review__card{position:relative;max-width:900px;margin:auto;padding:38px 55px;text-align:center;background:#08090a;border:2px solid var(--pink)}.repair-review__card:before{content:"";position:absolute;inset:-7px;border:1px solid var(--pink);opacity:.3;transform:rotate(-.5deg)}.repair-review__card blockquote{margin:15px auto;max-width:760px;color:#fff;font-size:20px;line-height:1.55}.repair-review__card strong{color:var(--blue);text-transform:uppercase}
.repair-case-cta{position:relative;padding:48px 0;overflow:hidden;background:linear-gradient(100deg,rgba(244,0,120,.4),#030405 39%,#030405 70%,rgba(244,233,0,.16))}.repair-case-cta__inner{display:grid;grid-template-columns:1fr auto;gap:38px;align-items:center}.repair-case-cta .brush-kicker{color:#fff}.repair-case-cta h2{margin-bottom:9px;color:var(--yellow)}.repair-case-cta p{margin:0}.repair-case-cta__actions{display:flex;gap:13px;flex-wrap:wrap;justify-content:flex-end}
@media(max-width:1000px){.repair-hero__grid{grid-template-columns:1fr 1fr}.repair-hero h1{font-size:60px}.repair-request__grid{gap:35px}.repair-work__steps{grid-template-columns:repeat(2,1fr);row-gap:25px}.repair-work-step:nth-child(2){border-right:0}.repair-result__grid{gap:35px}}
@media(max-width:760px){.repair-hero{min-height:auto}.repair-hero__grid{grid-template-columns:1fr;padding-top:35px;padding-bottom:35px}.repair-hero__copy{text-align:center}.repair-hero h1{font-size:clamp(50px,15vw,68px)}.repair-hero__meta{justify-content:center}.repair-hero__image{min-height:280px}.repair-hero__image img{height:300px}.repair-facts__grid{grid-template-columns:repeat(2,1fr)}.repair-facts__grid>div:nth-child(2n){border-right:0}.repair-facts__grid>div{padding:16px}.repair-request__grid{grid-template-columns:1fr;gap:34px}.repair-photo-frame,.repair-photo-frame img{min-height:0;height:330px}.repair-work__steps{grid-template-columns:1fr}.repair-work-step{display:grid;grid-template-columns:90px 1fr;align-items:center;text-align:left;border-right:0;border-bottom:1px solid rgba(255,255,255,.08);padding:12px 0}.repair-work-step__number{font-size:78px}.repair-comparison{aspect-ratio:4/3;min-height:0}.repair-case-gallery__grid{grid-template-columns:repeat(2,1fr);grid-auto-rows:150px}.repair-case-gallery__item--1{grid-column:span 2;grid-row:span 2}.repair-case-gallery__item--2,.repair-case-gallery__item--3,.repair-case-gallery__item--4,.repair-case-gallery__item--5{grid-column:span 1;grid-row:span 1}.repair-result__grid{grid-template-columns:1fr}.repair-result__checks{grid-template-columns:1fr}.repair-review__card{padding:30px 22px}.repair-case-cta__inner{grid-template-columns:1fr;text-align:center}.repair-case-cta__actions{justify-content:center}.repair-case-cta__actions .btn{width:100%}}


/* ======================================================================
   SCUFF OFF v2.0.1 — HERO "NEED A QUOTE" SIZING FIX
   Keeps the v1.9/v2.0 hero composition but gives the quote artwork enough
   usable width/height so headings, buttons and response copy are not clipped.
   ====================================================================== */

/* Give the right-hand quote column a little more real estate on desktop. */
@media(min-width:1181px){
  .hero__grid{
    grid-template-columns:minmax(350px,.90fr) minmax(520px,1.34fr) minmax(330px,.78fr);
    column-gap:18px;
  }

  .quick-quote{
    width:100%;
    min-width:330px;
    max-width:395px;
    min-height:430px;
    padding:56px 42px 40px;
    margin-left:auto;
    margin-right:0;
  }

  /*
   * The decorative uploaded frame was being squeezed around a smaller box,
   * which caused parts of "NEED A QUOTE?" and the lower response wording to
   * sit beneath the artwork edges. Increase the frame beyond the content box.
   */
  .quick-quote:before{
    inset:-62px -55px -72px;
    background-size:100% 100%;
  }

  .quick-quote:after{
    left:0;
    right:0;
    top:4%;
    bottom:4%;
  }

  .quick-quote__label{
    max-width:100%;
    margin:0 0 12px;
    font-size:clamp(34px,2.35vw,43px);
    line-height:.92;
    white-space:normal;
    overflow:visible;
  }

  .quick-quote p{
    max-width:290px;
    margin:13px auto 18px;
    font-size:13px;
    line-height:1.42;
  }

  .quick-quote .btn{
    width:100%;
    min-height:52px;
    padding-inline:16px;
    font-size:12px;
    white-space:normal;
    text-align:center;
  }

  .quick-quote__or{
    margin:12px 0;
    line-height:1;
  }

  .quick-quote__response{
    margin-top:18px;
    padding:0 5px;
    overflow:visible;
  }

  .quick-quote__response strong{
    font-size:12px;
    line-height:1.25;
  }

  .quick-quote__response span{
    font-size:12px;
    line-height:1.35;
  }
}

/* Normal laptop / tablet landscape. */
@media(min-width:901px) and (max-width:1180px){
  .hero__grid{
    grid-template-columns:minmax(290px,.86fr) minmax(410px,1.20fr) minmax(300px,.78fr);
    column-gap:12px;
  }

  .quick-quote{
    width:100%;
    min-width:300px;
    max-width:355px;
    min-height:410px;
    padding:52px 34px 36px;
    margin-left:auto;
  }

  .quick-quote:before{
    inset:-54px -46px -64px;
  }

  .quick-quote__label{
    font-size:34px;
    line-height:.92;
  }

  .quick-quote p{
    font-size:12px;
  }

  .quick-quote .btn{
    width:100%;
    padding-inline:13px;
    font-size:11px;
  }
}

/*
 * Tablet portrait: keep the existing stacked quote behaviour but provide
 * enough room for the full artwork and wording.
 */
@media(min-width:761px) and (max-width:900px){
  .quick-quote{
    width:min(560px,88vw);
    max-width:560px;
    min-height:410px;
    padding:52px 44px 38px;
    margin:22px auto 8px;
  }

  .quick-quote:before{
    inset:-58px -55px -68px;
  }

  .quick-quote__label{
    font-size:38px;
  }

  .quick-quote p{
    max-width:360px;
    margin-inline:auto;
  }

  .quick-quote .btn{
    width:100%;
  }
}

/* Mobile still uses the dedicated mobile CTA treatment from the theme. */
@media(max-width:760px){
  .quick-quote{
    display:none;
  }
}


/* ======================================================================
   SCUFF OFF v2.1 — MOBILE PRESENTATION OVERHAUL
   Built on v2.0.1. Desktop styles are intentionally left unchanged.
   Targets the approved mobile hierarchy:
   logo/header -> title -> car -> CTAs -> trust -> content.
   ====================================================================== */

@media(max-width:760px){

  html{
    overflow-x:hidden;
    scroll-padding-top:82px;
  }

  body{
    overflow-x:hidden;
    padding-bottom:78px;
  }

  .shell{
    width:100%;
    max-width:none;
    padding-inline:15px;
  }

  /* ---------------------------------------------------------------
     MOBILE HEADER
     --------------------------------------------------------------- */
  .site-header{
    position:sticky;
    top:0;
    z-index:150;
    background:rgba(3,4,5,.96);
    backdrop-filter:blur(12px);
    border-bottom:1px solid rgba(255,255,255,.08);
  }

  .site-header__inner{
    min-height:76px;
    display:grid;
    grid-template-columns:1fr 48px;
    gap:10px;
    align-items:center;
    padding-inline:14px;
  }

  .site-branding{
    min-width:0;
    justify-self:start;
  }

  .site-branding .custom-logo,
  .bundled-logo img{
    width:auto;
    max-width:190px;
    max-height:58px;
    object-fit:contain;
  }

  .header-quote{
    display:none!important;
  }

  .menu-toggle{
    display:grid;
    place-items:center;
    justify-self:end;
    width:46px;
    height:46px;
    border:1px solid rgba(255,255,255,.14);
    background:#090a0c;
    color:#fff;
    border-radius:4px;
  }

  .menu-toggle svg{
    width:25px;
    height:25px;
  }

  .primary-nav{
    position:absolute;
    left:0;
    right:0;
    top:76px;
    z-index:149;
    display:none;
    padding:12px 15px 18px;
    background:rgba(3,4,5,.985);
    border-bottom:1px solid rgba(255,255,255,.1);
    box-shadow:0 18px 32px rgba(0,0,0,.46);
  }

  .primary-nav.is-open,
  .menu-toggle[aria-expanded="true"] + .primary-nav{
    display:block;
  }

  .primary-menu{
    display:grid!important;
    grid-template-columns:1fr!important;
    gap:0!important;
    margin:0!important;
    padding:0!important;
  }

  .primary-menu li{
    width:100%;
  }

  .primary-menu a{
    display:block;
    width:100%;
    padding:14px 8px;
    border-bottom:1px solid rgba(255,255,255,.07);
    font-size:14px;
    text-align:left;
  }

  /* ---------------------------------------------------------------
     HERO — MOBILE-SPECIFIC COMPOSITION
     --------------------------------------------------------------- */
  .hero{
    min-height:auto;
    display:block;
    overflow:hidden;
    padding:0;
    background-position:center top;
  }

  .hero__grid{
    display:flex!important;
    flex-direction:column;
    width:100%;
    gap:0;
    padding:24px 0 32px!important;
  }

  .hero__copy{
    order:1;
    width:100%;
    padding-inline:6px;
    text-align:center;
  }

  .hero__copy .brush-kicker{
    margin-bottom:4px;
    color:#fff;
    font-family:var(--scuff-hand);
    font-size:clamp(20px,6vw,26px);
    line-height:1;
    letter-spacing:.15px;
    text-transform:uppercase;
  }

  .hero h1{
    width:100%;
    margin:3px 0 14px;
    align-items:center!important;
    font-size:clamp(68px,21vw,92px)!important;
    line-height:.62!important;
    text-align:center;
  }

  .hero h1 .hero-title{
    display:block;
    width:100%;
    white-space:normal;
    text-align:center;
  }

  .hero h1 .hero-title--lime{
    margin-top:13px;
  }

  .hero__subtitle{
    max-width:350px;
    margin:17px auto 0;
    padding-inline:8px;
    font-size:clamp(14px,4vw,17px);
    line-height:1.32;
    text-align:center;
  }

  /* Car is deliberately prominent and sits BEFORE the mobile buttons. */
  .hero__vehicle{
    order:2!important;
    position:relative;
    z-index:5;
    width:100%;
    min-height:305px!important;
    margin:-3px 0 -4px!important;
    display:flex;
    align-items:center;
    justify-content:center;
    overflow:visible;
  }

  .hero__vehicle img{
    width:146%!important;
    max-width:none!important;
    margin:0 -23%!important;
    transform:none;
    object-fit:contain;
    filter:
      drop-shadow(0 26px 28px rgba(0,0,0,.86))
      drop-shadow(0 0 9px rgba(0,169,244,.12));
  }

  .hero__actions--desktop{
    display:none!important;
  }

  .hero__actions--mobile{
    order:3!important;
    display:grid!important;
    grid-template-columns:1fr!important;
    gap:11px!important;
    width:100%;
    max-width:390px;
    margin:8px auto 0!important;
    padding-inline:6px;
  }

  .hero__actions--mobile .btn{
    width:100%;
    min-height:54px;
    margin:0;
    padding:12px 16px;
    font-size:12px;
  }

  /* Desktop quote art must not appear in the mobile hero. */
  .quick-quote{
    display:none!important;
  }

  /* Recompose paint around the car rather than the viewport edges. */
  .hero__paint-sheet{
    left:50%!important;
    top:225px!important;
    bottom:auto!important;
    width:112%!important;
    max-width:none!important;
    transform:translateX(-50%);
    opacity:.64!important;
    object-fit:contain;
  }

  .hero__splash--pink{
    left:50%!important;
    top:238px!important;
    width:390px!important;
    height:82px!important;
    transform:translateX(-45%) rotate(-7deg)!important;
    opacity:.63!important;
  }

  .hero__splash--blue{
    right:-105px!important;
    bottom:132px!important;
    width:370px!important;
    height:69px!important;
    opacity:.43!important;
  }

  .hero__splash--yellow{
    left:-125px!important;
    bottom:174px!important;
    width:335px!important;
    height:66px!important;
    opacity:.38!important;
  }

  /* ---------------------------------------------------------------
     TRUST STRIP
     --------------------------------------------------------------- */
  .trust-strip{
    margin-top:0;
  }

  .trust-grid{
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
  }

  .trust-item{
    min-height:82px;
    padding:13px 11px!important;
    gap:9px;
    border-right:1px solid var(--line)!important;
    border-bottom:1px solid var(--line);
  }

  .trust-item:nth-child(2n){
    border-right:0!important;
  }

  .trust-item>span{
    font-size:24px;
  }

  .trust-item strong{
    font-size:11px;
    line-height:1.15;
  }

  .trust-item small{
    font-size:9px;
    line-height:1.2;
  }

  /* ---------------------------------------------------------------
     GLOBAL MOBILE SECTION RHYTHM
     --------------------------------------------------------------- */
  .section{
    padding-top:42px!important;
    padding-bottom:44px!important;
  }

  .section-heading{
    margin-bottom:27px;
    padding-inline:5px;
  }

  .section-heading span{
    margin-bottom:3px;
    font-size:13px;
    letter-spacing:1.2px;
  }

  .section-heading h2{
    font-size:clamp(39px,12.5vw,53px)!important;
    line-height:.82!important;
  }

  /* ---------------------------------------------------------------
     SERVICES — intentionally two columns on mobile
     --------------------------------------------------------------- */
  .service-grid{
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
    gap:11px!important;
  }

  .service-card{
    min-width:0;
    padding:12px 8px 15px!important;
    border:0!important;
    background:transparent!important;
    text-align:center;
  }

  .service-card__art{
    width:100%;
    height:118px!important;
    margin:0 auto 4px;
    object-fit:contain;
  }

  .service-card__content{
    padding:0 2px!important;
    background:none!important;
  }

  .service-card h3{
    margin:0 0 5px;
    font-size:clamp(22px,6.2vw,27px)!important;
    line-height:.82;
  }

  .service-card p{
    margin:0 auto;
    max-width:165px;
    font-size:10px;
    line-height:1.35;
  }

  .service-card a:not(.btn){
    font-size:10px;
  }

  /* ---------------------------------------------------------------
     BEFORE / AFTER
     --------------------------------------------------------------- */
  .comparison-section{
    padding-top:32px!important;
    padding-bottom:36px!important;
  }

  .comparison-section .shell{
    padding-inline:10px!important;
  }

  .comparison{
    width:100%;
    aspect-ratio:4/3!important;
    min-height:0;
    max-height:none;
  }

  .comparison__before span,
  .comparison__after span{
    top:10px;
    padding:6px 9px;
    font-size:10px;
  }

  .comparison__handle{
    width:42px;
    height:42px;
    font-size:17px;
  }

  /* ---------------------------------------------------------------
     BENEFITS — two-column visual grid
     --------------------------------------------------------------- */
  .benefit-grid{
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
    gap:16px 5px!important;
  }

  .benefit{
    min-width:0;
    padding:0 5px 10px!important;
    border:0!important;
  }

  .benefit__art{
    height:126px!important;
    margin-bottom:5px;
  }

  .benefit p{
    max-width:150px;
    margin-inline:auto;
    font-size:9.5px!important;
    line-height:1.35;
  }

  /* ---------------------------------------------------------------
     HOW IT WORKS
     --------------------------------------------------------------- */
  .process-grid{
    width:100%;
    max-width:390px!important;
    margin-inline:auto;
    grid-template-columns:1fr!important;
    gap:0;
  }

  .process-step{
    display:grid!important;
    grid-template-columns:112px minmax(0,1fr)!important;
    align-items:center;
    min-height:142px!important;
    padding:6px 2px 29px!important;
    text-align:left!important;
  }

  .process-step__visual{
    min-height:104px;
    justify-content:flex-start!important;
  }

  .process-step__number{
    font-size:88px!important;
  }

  .process-step__icon{
    width:54px!important;
    height:54px!important;
    margin-left:-25px!important;
  }

  .process-step__icon svg{
    width:50px!important;
    height:50px!important;
  }

  .process-step__copy{
    min-width:0;
    padding-left:5px;
  }

  .process-step__copy h3{
    font-size:17px!important;
    line-height:1.05;
  }

  .process-step__copy p{
    max-width:none!important;
    font-size:10px!important;
    line-height:1.38;
  }

  .process-step__arrow{
    display:block!important;
    left:45px!important;
    right:auto!important;
    top:auto!important;
    bottom:-4px!important;
    transform:rotate(90deg)!important;
    font-size:31px!important;
  }

  /* ---------------------------------------------------------------
     TESTIMONIALS
     --------------------------------------------------------------- */
  .testimonial-grid{
    grid-template-columns:1fr!important;
    gap:21px!important;
    padding-inline:4px;
  }

  .testimonial{
    min-height:0!important;
    padding:23px 20px 20px!important;
  }

  .testimonial p{
    font-size:12px;
    line-height:1.55;
  }

  /* ---------------------------------------------------------------
     RECENT REPAIRS
     --------------------------------------------------------------- */
  .repair-gallery{
    padding-top:37px!important;
    padding-bottom:41px!important;
  }

  .repair-gallery .shell{
    padding-inline:10px!important;
  }

  .repair-filter-bar{
    display:flex;
    max-width:100%;
    gap:10px!important;
    overflow-x:auto;
    justify-content:flex-start!important;
    padding:2px 4px 10px;
    scrollbar-width:none;
  }

  .repair-filter-bar::-webkit-scrollbar{
    display:none;
  }

  .repair-filter-bar>*{
    flex:0 0 auto;
  }

  .repair-grid{
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
    gap:5px!important;
  }

  .repair-tile{
    min-height:150px!important;
  }

  .repair-tile span{
    left:7px;
    right:7px;
    bottom:7px;
    padding:5px 6px;
    font-size:9px;
    line-height:1.2;
  }

  /* ---------------------------------------------------------------
     COVERAGE
     --------------------------------------------------------------- */
  .coverage{
    padding-top:41px!important;
    padding-bottom:40px!important;
  }

  .coverage .shell{
    padding-inline:14px!important;
  }

  .coverage__grid{
    grid-template-columns:1fr!important;
    gap:16px!important;
  }

  .coverage__copy{
    text-align:center;
  }

  .coverage h2{
    font-size:clamp(45px,13vw,58px)!important;
    line-height:.82!important;
  }

  .coverage__places{
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
    gap:7px 10px;
    max-width:390px;
    margin-inline:auto;
    text-align:left;
  }

  .coverage__map{
    width:100%;
    min-height:345px!important;
    height:345px!important;
    margin-top:5px;
    background-size:contain!important;
    background-position:center 8px!important;
  }

  /* ---------------------------------------------------------------
     MOBILE FAQ
     --------------------------------------------------------------- */
  .faq-section{
    display:block!important;
  }

  .faq-layout{
    grid-template-columns:1fr!important;
    gap:27px!important;
  }

  .faq-item summary{
    padding:16px 15px;
    font-size:12px;
    line-height:1.3;
  }

  .faq-item div{
    padding:0 15px 16px;
    font-size:11px;
    line-height:1.5;
  }

  .faq-cta{
    padding:29px 19px!important;
    clip-path:none!important;
    border-radius:8px 12px 7px 10px;
  }

  .faq-cta h2{
    font-size:clamp(39px,12vw,51px)!important;
  }

  /* ---------------------------------------------------------------
     FINAL CTA
     --------------------------------------------------------------- */
  .quote-section{
    padding:34px 0!important;
  }

  .quote-panel{
    grid-template-columns:1fr!important;
    gap:20px!important;
    min-height:0!important;
    padding:28px 18px!important;
    text-align:center;
  }

  .quote-panel h2{
    font-size:clamp(43px,13vw,57px)!important;
    line-height:.82!important;
  }

  .quote-panel__actions{
    width:100%;
    display:grid!important;
    grid-template-columns:1fr!important;
    gap:10px!important;
    justify-content:stretch!important;
  }

  .quote-panel__actions .btn{
    width:100%;
  }

  /* ---------------------------------------------------------------
     FOOTER
     --------------------------------------------------------------- */
  .footer-grid{
    grid-template-columns:1fr!important;
    gap:24px!important;
    padding-top:30px!important;
    padding-bottom:30px!important;
    text-align:center;
  }

  .footer-brand .custom-logo,
  .bundled-logo--footer img{
    margin-inline:auto;
  }

  .footer-brand p{
    max-width:330px;
    margin-inline:auto;
  }

  .footer-grid ul{
    padding:0;
    list-style:none;
  }

  .footer-review img{
    margin-inline:auto;
  }

  .site-footer__bottom{
    padding-bottom:7px;
  }

  .site-footer__bottom .shell{
    display:grid!important;
    gap:8px;
    text-align:center;
    font-size:10px;
  }

  /* ---------------------------------------------------------------
     FIXED MOBILE CTA
     --------------------------------------------------------------- */
  .floating-whatsapp{
    display:none!important;
  }

  .mobile-cta-bar{
    position:fixed!important;
    left:0;
    right:0;
    bottom:0;
    z-index:220;
    display:grid!important;
    grid-template-columns:1fr 1fr;
    gap:7px!important;
    padding:8px max(8px,env(safe-area-inset-right)) calc(8px + env(safe-area-inset-bottom)) max(8px,env(safe-area-inset-left))!important;
    background:rgba(3,4,5,.975)!important;
    border-top:1px solid rgba(255,255,255,.12);
    box-shadow:0 -12px 30px rgba(0,0,0,.4);
    backdrop-filter:blur(12px);
  }

  .mobile-cta-bar .btn{
    width:100%;
    min-height:52px!important;
    padding:9px 7px!important;
    font-size:10.5px!important;
    gap:6px;
    white-space:nowrap;
  }

  /* ---------------------------------------------------------------
     REPAIR CASE STUDIES ON MOBILE
     --------------------------------------------------------------- */
  .repair-hero__grid{
    grid-template-columns:1fr!important;
    gap:20px!important;
    padding-top:30px!important;
    padding-bottom:31px!important;
  }

  .repair-hero__copy{
    text-align:center!important;
  }

  .repair-hero h1{
    margin-top:5px;
    font-size:clamp(47px,14vw,64px)!important;
    line-height:.79!important;
  }

  .repair-hero__meta{
    justify-content:center!important;
  }

  .repair-hero__image{
    min-height:0!important;
  }

  .repair-hero__image img{
    width:100%;
    height:auto!important;
    max-height:360px;
    aspect-ratio:4/3;
    object-fit:cover;
  }

  .repair-facts__grid{
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
  }

  .repair-facts__grid>div{
    min-width:0;
    padding:14px 10px!important;
  }

  .repair-facts strong{
    font-size:16px!important;
    overflow-wrap:anywhere;
  }

  .repair-request__grid{
    grid-template-columns:1fr!important;
    gap:30px!important;
  }

  .repair-photo-frame{
    min-height:0!important;
  }

  .repair-photo-frame img{
    width:100%;
    height:auto!important;
    aspect-ratio:4/3;
    object-fit:cover;
  }

  .repair-request__copy h2,
  .repair-result h2,
  .repair-case-cta h2{
    font-size:clamp(42px,12vw,54px)!important;
  }

  .repair-lead{
    font-size:14px!important;
    line-height:1.6!important;
  }

  .repair-work__steps{
    grid-template-columns:1fr!important;
  }

  .repair-work-step{
    grid-template-columns:82px minmax(0,1fr)!important;
    padding:12px 0!important;
  }

  .repair-work-step__number{
    font-size:72px!important;
  }

  .repair-comparison{
    aspect-ratio:4/3!important;
    min-height:0!important;
  }

  .repair-case-gallery__grid{
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
    grid-auto-rows:145px!important;
  }

  .repair-case-gallery__item--1{
    grid-column:span 2!important;
    grid-row:span 2!important;
  }

  .repair-result__grid{
    grid-template-columns:1fr!important;
    gap:28px!important;
  }

  .repair-result__checks{
    grid-template-columns:1fr!important;
  }

  .repair-review__card{
    padding:28px 18px!important;
  }

  .repair-case-cta__inner{
    grid-template-columns:1fr!important;
    gap:22px!important;
    text-align:center;
  }

  .repair-case-cta__actions{
    display:grid!important;
    grid-template-columns:1fr!important;
    width:100%;
  }
}

/* Smaller phones: preserve the approved two-column visual language where
   practical, but reduce image and text scale rather than collapsing everything. */
@media(max-width:430px){

  .site-branding .custom-logo,
  .bundled-logo img{
    max-width:166px;
    max-height:54px;
  }

  .hero h1{
    font-size:clamp(62px,20vw,78px)!important;
  }

  .hero__vehicle{
    min-height:275px!important;
  }

  .hero__vehicle img{
    width:153%!important;
    margin-inline:-26.5%!important;
  }

  .hero__paint-sheet{
    top:215px!important;
    width:118%!important;
  }

  .service-card__art{
    height:105px!important;
  }

  .service-card h3{
    font-size:21px!important;
  }

  .service-card p{
    font-size:9px;
  }

  .benefit__art{
    height:112px!important;
  }

  .repair-tile{
    min-height:135px!important;
  }

  .coverage__map{
    min-height:315px!important;
    height:315px!important;
  }
}


/* ======================================================================
   SCUFF OFF v2.1.1 — DESKTOP HERO TOP-SPACING REDUCTION
   Mobile/tablet presentation from v2.1 remains unchanged.
   ====================================================================== */

/*
 * The desktop hero was carrying too much vertical padding above the content.
 * Pull the complete hero composition upward without changing the header or
 * shrinking the car / quote panel.
 */
@media(min-width:1181px){
  .hero{
    min-height:710px;
  }

  .hero__grid{
    padding-top:34px!important;
    padding-bottom:48px!important;
  }

  .hero__copy{
    transform:translateY(-8px);
  }

  .hero__vehicle{
    transform:translateY(-10px);
  }

  .quick-quote{
    transform:translateY(-8px);
  }

  /* Keep paint visually attached to the vehicle after moving the content up. */
  .hero__paint-sheet{
    top:42px!important;
  }

  .hero__splash--pink{
    top:92px!important;
  }
}

/* Smaller desktop/laptop: tighter again, but don't affect tablet portrait. */
@media(min-width:901px) and (max-width:1180px){
  .hero{
    min-height:690px;
  }

  .hero__grid{
    padding-top:30px!important;
    padding-bottom:44px!important;
  }

  .hero__copy,
  .hero__vehicle,
  .quick-quote{
    transform:translateY(-5px);
  }

  .hero__paint-sheet{
    top:46px!important;
  }

  .hero__splash--pink{
    top:102px!important;
  }
}


/* ======================================================================
   SCUFF OFF v2.1.2 — DESKTOP FULL-WIDTH CANVAS FIX
   Fixes the visible unused strip on the right side of the desktop viewport.
   ====================================================================== */

/*
 * Force the document/root canvas to use the complete viewport.  This also
 * protects the theme from an inherited/legacy width rule being applied to
 * body or the homepage main wrapper.
 */
html,
body{
  width:100%!important;
  max-width:none!important;
  min-width:0;
  margin-left:0!important;
  margin-right:0!important;
}

body{
  overflow-x:hidden;
}

#primary{
  width:100%!important;
  max-width:none!important;
  margin-left:0!important;
  margin-right:0!important;
}

/*
 * Homepage bands are intended to span edge-to-edge. Their internal .shell
 * elements continue to provide responsive gutters, so this does not make the
 * text touch the browser edge.
 */
.site-header,
.hero,
.trust-strip,
.services,
.comparison-section,
.benefits,
.process,
.testimonials,
.repair-gallery,
.coverage,
.faq-section,
.quote-section,
.site-footer{
  display:block;
  width:100%!important;
  max-width:none!important;
  margin-left:0!important;
  margin-right:0!important;
}

/* Restore layout modes that need something other than block. */
.hero{
  display:flex;
}

.site-header{
  display:block;
}

.shell{
  width:100%!important;
  max-width:none!important;
}

/*
 * Desktop gets equal left/right gutters. This prevents the composition from
 * looking anchored to the left after the full-width correction.
 */
@media(min-width:901px){
  .shell{
    padding-left:clamp(28px,4vw,72px)!important;
    padding-right:clamp(28px,4vw,72px)!important;
  }

  .comparison-section .shell,
  .repair-gallery .shell,
  .coverage .shell,
  .quote-section .shell{
    padding-left:clamp(24px,3vw,54px)!important;
    padding-right:clamp(24px,3vw,54px)!important;
  }
}

/* Mobile retains the dedicated v2.1 gutters. */
@media(max-width:760px){
  .shell{
    padding-left:15px!important;
    padding-right:15px!important;
  }

  .comparison-section .shell,
  .repair-gallery .shell,
  .coverage .shell,
  .quote-section .shell{
    padding-left:13px!important;
    padding-right:13px!important;
  }
}

@media(max-width:430px){
  .shell{
    padding-left:11px!important;
    padding-right:11px!important;
  }
}


/* ======================================================================
   SCUFF OFF v2.2 — DEDICATED ABOUT US PAGE
   ====================================================================== */

.about-page{
  width:100%;
  max-width:none;
  overflow:hidden;
  background:#030405;
}

/* ----------------------------------------------------------------------
   HERO
   ---------------------------------------------------------------------- */
.about-hero{
  position:relative;
  min-height:650px;
  display:flex;
  align-items:center;
  overflow:hidden;
  background:
    radial-gradient(circle at 72% 46%,rgba(0,169,244,.11),transparent 31%),
    radial-gradient(circle at 45% 52%,rgba(244,0,120,.06),transparent 32%),
    #030405;
}

.about-hero__grid{
  position:relative;
  z-index:4;
  display:grid;
  grid-template-columns:.9fr 1.1fr;
  gap:28px;
  align-items:center;
  padding-top:70px;
  padding-bottom:62px;
}

.about-hero__copy{
  position:relative;
  z-index:8;
}

.about-hero__copy .brush-kicker{
  color:#fff;
  font-size:clamp(24px,2vw,34px);
}

.about-hero h1{
  display:flex;
  flex-direction:column;
  align-items:flex-start;
  margin:8px 0 22px;
  font-family:var(--scuff-brush);
  font-size:clamp(66px,6.4vw,105px);
  font-weight:400;
  line-height:.7;
  text-transform:uppercase;
}

.about-hero h1 span{
  color:var(--pink);
  text-shadow:4px 5px 0 #51002b,8px 9px 0 rgba(0,0,0,.62);
  transform:rotate(-2deg);
}

.about-hero h1 strong{
  margin-top:16px;
  color:var(--lime);
  font:inherit;
  text-shadow:4px 5px 0 #364500,8px 9px 0 rgba(0,0,0,.62);
  transform:rotate(-1deg);
}

.about-hero__copy>p{
  max-width:640px;
  color:#e9e9e9;
  font-size:16px;
  line-height:1.65;
}

.about-hero__actions{
  display:flex;
  flex-wrap:wrap;
  gap:12px;
  margin-top:28px;
}

.about-hero__visual{
  position:relative;
  z-index:5;
  min-height:465px;
  display:flex;
  align-items:center;
  justify-content:center;
}

.about-hero__visual img{
  position:relative;
  z-index:4;
  width:124%;
  max-width:none;
  margin-left:-13%;
  filter:drop-shadow(0 34px 35px rgba(0,0,0,.8));
}

.about-hero__paint{
  position:absolute;
  z-index:2;
  pointer-events:none;
  border-radius:62% 38% 55% 45%/46% 58% 42% 54%;
}

.about-hero__paint--pink{
  left:42%;
  top:130px;
  width:540px;
  height:102px;
  background:linear-gradient(90deg,transparent,var(--pink) 12% 86%,transparent);
  transform:rotate(-8deg);
  opacity:.63;
}

.about-hero__paint--blue{
  right:1%;
  bottom:87px;
  width:560px;
  height:78px;
  background:linear-gradient(90deg,transparent,var(--blue) 12% 85%,transparent);
  transform:rotate(5deg);
  opacity:.39;
}

.about-hero__paint-sheet{
  position:absolute;
  z-index:1;
  left:39%;
  top:54px;
  width:57%;
  max-width:none;
  opacity:.58;
  mix-blend-mode:screen;
  pointer-events:none;
}

/* ----------------------------------------------------------------------
   TRUST STRIP
   ---------------------------------------------------------------------- */
.about-trust{
  border-block:1px solid rgba(255,255,255,.1);
  background:#080a0b;
}

.about-trust__grid{
  display:grid;
  grid-template-columns:repeat(4,1fr);
}

.about-trust__grid>div{
  display:flex;
  align-items:center;
  justify-content:center;
  gap:13px;
  min-height:92px;
  padding:17px 22px;
  border-right:1px solid rgba(255,255,255,.09);
}

.about-trust__grid>div:last-child{
  border-right:0;
}

.about-trust__grid>div>span{
  display:grid;
  place-items:center;
  min-width:39px;
  min-height:39px;
  color:var(--yellow);
  font-size:28px;
}

.about-trust__grid strong,
.about-trust__grid small{
  display:block;
}

.about-trust__grid strong{
  font-family:var(--scuff-display);
  font-size:16px;
  font-weight:400;
  letter-spacing:.5px;
  text-transform:uppercase;
}

.about-trust__grid small{
  margin-top:3px;
  color:#aaa;
  font-size:10px;
}

/* ----------------------------------------------------------------------
   GENERAL SPLIT SECTIONS
   ---------------------------------------------------------------------- */
.about-split,
.about-quality__grid{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:clamp(38px,5vw,78px);
  align-items:center;
}

.about-copy h2,
.about-quality h2,
.about-real-work h2,
.about-local h2,
.about-final-cta h2{
  margin:7px 0 18px;
  font-family:var(--scuff-brush);
  font-size:clamp(50px,5vw,74px);
  font-weight:400;
  line-height:.8;
  text-transform:uppercase;
}

.about-copy .brush-kicker{
  color:var(--blue);
}

.about-copy p,
.about-quality__copy p,
.about-local__copy p{
  color:#c8c8c8;
  line-height:1.68;
}

.about-lead{
  color:#fff!important;
  font-size:18px;
  line-height:1.55!important;
}

.about-text-link{
  display:inline-flex;
  align-items:center;
  gap:7px;
  margin-top:7px;
  color:var(--blue);
  font-size:12px;
  font-weight:900;
  text-transform:uppercase;
}

.about-photo{
  position:relative;
  min-height:490px;
  isolation:isolate;
}

.about-photo:before{
  content:"";
  position:absolute;
  z-index:-1;
  inset:-18px -17px;
  border-radius:55% 45% 59% 41% / 5% 8% 5% 7%;
  background:
    radial-gradient(ellipse at 16% 50%,rgba(244,0,120,.74),transparent 23%),
    linear-gradient(93deg,var(--pink),transparent 44%,var(--blue));
  opacity:.35;
  transform:rotate(-1deg);
}

.about-photo img{
  width:100%;
  height:490px;
  object-fit:cover;
}

.about-photo>span{
  position:absolute;
  left:17px;
  bottom:17px;
  padding:8px 13px;
  background:var(--pink);
  font-family:var(--scuff-display);
  font-size:15px;
  text-transform:uppercase;
}

/* ----------------------------------------------------------------------
   SERVICES
   ---------------------------------------------------------------------- */
.about-services{
  background:
    radial-gradient(circle at 7% 50%,rgba(244,0,120,.05),transparent 22%),
    radial-gradient(circle at 93% 44%,rgba(0,169,244,.05),transparent 24%),
    #050607;
}

.about-service-scroller{
  display:grid;
  grid-template-columns:repeat(6,minmax(0,1fr));
  gap:7px;
}

.about-service{
  min-width:0;
  padding:8px 10px 17px;
  text-align:center;
}

.about-service img{
  width:100%;
  height:150px;
  object-fit:contain;
  filter:drop-shadow(0 8px 14px rgba(0,0,0,.37)) saturate(1.06);
}

.about-service h3{
  margin:3px 0 7px;
  font-family:var(--scuff-brush);
  font-size:27px;
  font-weight:400;
  line-height:.8;
  text-transform:uppercase;
}

.about-service p{
  max-width:175px;
  margin:0 auto;
  color:#aaa;
  font-size:10px;
  line-height:1.42;
}

/* ----------------------------------------------------------------------
   QUALITY
   ---------------------------------------------------------------------- */
.about-quality{
  position:relative;
  background:
    radial-gradient(circle at 22% 50%,rgba(244,0,120,.08),transparent 28%),
    #030405;
}

.about-quality__copy .brush-kicker{
  color:var(--pink);
}

.about-quality__image{
  position:relative;
  min-height:500px;
  display:flex;
  align-items:center;
  isolation:isolate;
}

.about-quality__image img{
  width:100%;
  height:500px;
  object-fit:cover;
  position:relative;
  z-index:2;
}

.about-quality__brush{
  position:absolute;
  z-index:1;
  left:-45px;
  right:-55px;
  top:45%;
  height:92px;
  border-radius:58% 42% 55% 45%;
  background:
    radial-gradient(ellipse at 26% 50%,rgba(244,0,120,.72),transparent 26%),
    linear-gradient(90deg,transparent,var(--pink) 12% 45%,var(--blue) 70%,transparent);
  transform:rotate(-5deg);
  opacity:.65;
}

/* Give reused comparison a distinct About-page position. */
.about-page .comparison-section{
  background:#060708;
}

/* ----------------------------------------------------------------------
   BENEFITS
   ---------------------------------------------------------------------- */
.about-benefits__grid{
  display:grid;
  grid-template-columns:repeat(6,minmax(0,1fr));
  gap:12px;
}

.about-benefit{
  min-width:0;
  padding:5px 7px 13px;
  text-align:center;
}

.about-benefit img{
  width:100%;
  height:145px;
  object-fit:contain;
}

.about-benefit p{
  max-width:175px;
  margin:3px auto 0;
  color:#aaa;
  font-size:10px;
  line-height:1.42;
}

/* ----------------------------------------------------------------------
   COMPACT PROCESS
   ---------------------------------------------------------------------- */
.about-process{
  background:#060708;
}

.about-process__grid{
  display:grid;
  grid-template-columns:repeat(4,1fr);
  gap:0;
}

.about-process-step{
  position:relative;
  display:grid;
  grid-template-columns:80px 1fr;
  gap:8px;
  align-items:center;
  min-height:148px;
  padding:13px 22px;
  border-right:1px solid rgba(255,255,255,.09);
}

.about-process-step:last-child{
  border-right:0;
}

.about-process-step>span{
  font-family:var(--scuff-brush);
  font-size:74px;
  line-height:.8;
  transform:rotate(-5deg);
  text-shadow:3px 4px 0 #111;
}

.about-process-step--pink>span{color:var(--pink)}
.about-process-step--blue>span{color:var(--blue)}
.about-process-step--yellow>span{color:var(--yellow)}
.about-process-step--lime>span{color:var(--lime)}

.about-process-step h3{
  margin:0 0 5px;
  font-family:var(--scuff-display);
  font-size:18px;
  font-weight:400;
  text-transform:uppercase;
}

.about-process-step p{
  margin:0;
  color:#aaa;
  font-size:10px;
  line-height:1.4;
}

/* ----------------------------------------------------------------------
   REAL WORK / SOCIAL
   ---------------------------------------------------------------------- */
.about-real-work__heading{
  display:grid;
  grid-template-columns:1fr .8fr;
  gap:45px;
  align-items:end;
  margin-bottom:27px;
}

.about-real-work__heading .brush-kicker{
  color:var(--blue);
}

.about-real-work__heading p{
  max-width:650px;
  margin:0;
  color:#bbb;
  line-height:1.6;
}

.about-repairs-grid{
  display:grid;
  grid-template-columns:repeat(12,1fr);
  grid-auto-rows:165px;
  gap:7px;
}

.about-repair-tile{
  position:relative;
  overflow:hidden;
  background:#111;
}

.about-repair-tile--1{
  grid-column:span 5;
  grid-row:span 2;
}

.about-repair-tile--2{
  grid-column:span 4;
  grid-row:span 2;
}

.about-repair-tile--3{
  grid-column:span 3;
}

.about-repair-tile--4{
  grid-column:span 3;
}

.about-repair-tile--5,
.about-repair-tile--6{
  grid-column:span 6;
}

.about-repair-tile img{
  width:100%;
  height:100%;
  object-fit:cover;
  transition:transform .3s ease,filter .3s ease;
}

.about-repair-tile:hover img{
  transform:scale(1.045);
  filter:contrast(1.05);
}

.about-repair-tile:after{
  content:"";
  position:absolute;
  inset:45% 0 0;
  background:linear-gradient(transparent,rgba(0,0,0,.8));
}

.about-repair-tile span{
  position:absolute;
  z-index:2;
  left:14px;
  right:14px;
  bottom:12px;
  font-family:var(--scuff-display);
  font-size:15px;
  text-transform:uppercase;
}

.about-social-row{
  display:flex;
  align-items:center;
  justify-content:center;
  flex-wrap:wrap;
  gap:15px;
  margin-top:26px;
}

.about-social-link{
  padding:9px 13px;
  color:#fff;
  border-bottom:2px solid var(--pink);
  font-size:11px;
  font-weight:900;
  text-transform:uppercase;
}

/* ----------------------------------------------------------------------
   LOCAL
   ---------------------------------------------------------------------- */
.about-local{
  background:
    radial-gradient(circle at 80% 50%,rgba(0,169,244,.07),transparent 28%),
    #060809;
}

.about-local__grid{
  display:grid;
  grid-template-columns:.72fr 1.28fr;
  gap:40px;
  align-items:center;
}

.about-local__copy .brush-kicker{
  color:var(--pink);
}

.about-local__map{
  min-height:480px;
  background-image:var(--about-map);
  background-repeat:no-repeat;
  background-size:contain;
  background-position:center;
}

/* ----------------------------------------------------------------------
   FINAL CTA
   ---------------------------------------------------------------------- */
.about-final-cta{
  position:relative;
  overflow:hidden;
  padding:48px 0;
  background:
    linear-gradient(90deg,rgba(244,0,120,.29),rgba(3,4,5,.84) 34%,rgba(3,4,5,.7) 70%,rgba(244,233,0,.16)),
    var(--about-cta),
    #050607;
  background-size:cover;
  background-position:center;
}

.about-final-cta:before{
  content:"";
  position:absolute;
  left:-2%;
  right:-2%;
  top:4px;
  height:9px;
  border-radius:50%;
  background:linear-gradient(90deg,transparent,var(--pink) 8% 32%,var(--blue) 37% 61%,var(--yellow) 66% 89%,transparent);
  opacity:.42;
  transform:rotate(-.5deg);
}

.about-final-cta__grid{
  position:relative;
  z-index:2;
  display:grid;
  grid-template-columns:1fr auto;
  gap:45px;
  align-items:center;
}

.about-final-cta .brush-kicker{
  color:#fff;
}

.about-final-cta h2{
  margin-bottom:10px;
  color:var(--yellow);
}

.about-final-cta p{
  max-width:720px;
  margin:0;
  color:#eee;
  line-height:1.55;
}

.about-final-cta__actions{
  display:flex;
  flex-wrap:wrap;
  gap:12px;
  justify-content:flex-end;
}

/* ----------------------------------------------------------------------
   TABLET
   ---------------------------------------------------------------------- */
@media(max-width:1100px){
  .about-hero__grid{
    grid-template-columns:.95fr 1.05fr;
  }

  .about-hero h1{
    font-size:68px;
  }

  .about-service-scroller,
  .about-benefits__grid{
    grid-template-columns:repeat(3,1fr);
    row-gap:22px;
  }

  .about-process__grid{
    grid-template-columns:repeat(2,1fr);
  }

  .about-process-step:nth-child(2){
    border-right:0;
  }

  .about-real-work__heading{
    grid-template-columns:1fr 1fr;
  }
}

/* ----------------------------------------------------------------------
   MOBILE
   ---------------------------------------------------------------------- */
@media(max-width:760px){
  .about-hero{
    min-height:auto;
  }

  .about-hero__grid{
    display:flex;
    flex-direction:column;
    gap:0;
    padding-top:27px;
    padding-bottom:31px;
  }

  .about-hero__copy{
    order:1;
    width:100%;
    text-align:center;
  }

  .about-hero__copy .brush-kicker{
    font-size:23px;
  }

  .about-hero h1{
    align-items:center;
    margin-top:6px;
    font-size:clamp(57px,17vw,76px);
    line-height:.7;
    text-align:center;
  }

  .about-hero h1 span,
  .about-hero h1 strong{
    width:100%;
    text-align:center;
  }

  .about-hero h1 strong{
    margin-top:12px;
  }

  .about-hero__copy>p{
    max-width:350px;
    margin-inline:auto;
    font-size:13px;
    line-height:1.55;
  }

  .about-hero__visual{
    order:2;
    width:100%;
    min-height:285px;
    margin-top:0;
  }

  .about-hero__visual img{
    width:145%;
    margin-left:0;
    max-width:none;
  }

  .about-hero__actions{
    order:3;
    display:grid;
    grid-template-columns:1fr;
    width:100%;
    max-width:390px;
    margin:7px auto 0;
  }

  .about-hero__actions .btn{
    width:100%;
  }

  .about-hero__paint-sheet{
    left:50%;
    top:217px;
    width:116%;
    transform:translateX(-50%);
  }

  .about-hero__paint--pink{
    left:50%;
    top:238px;
    width:370px;
    height:71px;
    transform:translateX(-50%) rotate(-7deg);
  }

  .about-hero__paint--blue{
    right:-120px;
    bottom:105px;
    width:350px;
    height:59px;
  }

  .about-trust__grid{
    grid-template-columns:repeat(2,1fr);
  }

  .about-trust__grid>div{
    min-height:80px;
    padding:11px 9px;
  }

  .about-trust__grid>div:nth-child(2n){
    border-right:0;
  }

  .about-trust__grid strong{
    font-size:13px;
  }

  .about-trust__grid small{
    font-size:8.5px;
  }

  .about-split,
  .about-quality__grid,
  .about-local__grid{
    grid-template-columns:1fr;
    gap:31px;
  }

  .about-copy h2,
  .about-quality h2,
  .about-real-work h2,
  .about-local h2,
  .about-final-cta h2{
    font-size:clamp(41px,12.5vw,54px);
  }

  .about-lead{
    font-size:15px;
  }

  .about-photo{
    min-height:0;
  }

  .about-photo img{
    height:auto;
    aspect-ratio:4/3;
  }

  /* Swipeable services are more useful than shrinking six tiles. */
  .about-service-scroller{
    display:flex;
    gap:10px;
    overflow-x:auto;
    margin-inline:-15px;
    padding:0 15px 12px;
    scroll-snap-type:x mandatory;
    scrollbar-width:none;
  }

  .about-service-scroller::-webkit-scrollbar{
    display:none;
  }

  .about-service{
    flex:0 0 66vw;
    max-width:270px;
    scroll-snap-align:center;
  }

  .about-service img{
    height:140px;
  }

  .about-quality__copy{
    order:1;
  }

  .about-quality__image{
    order:2;
    min-height:0;
  }

  .about-quality__image img{
    height:auto;
    aspect-ratio:4/3;
  }

  .about-benefits__grid{
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:15px 5px;
  }

  .about-benefit img{
    height:120px;
  }

  .about-benefit p{
    font-size:9px;
  }

  .about-process__grid{
    grid-template-columns:1fr;
  }

  .about-process-step{
    grid-template-columns:78px 1fr;
    min-height:112px;
    padding:11px 4px;
    border-right:0;
    border-bottom:1px solid rgba(255,255,255,.08);
  }

  .about-process-step:last-child{
    border-bottom:0;
  }

  .about-process-step>span{
    font-size:68px;
  }

  .about-real-work__heading{
    grid-template-columns:1fr;
    gap:12px;
    text-align:center;
  }

  .about-real-work__heading p{
    font-size:12px;
  }

  .about-repairs-grid{
    grid-template-columns:repeat(2,1fr);
    grid-auto-rows:135px;
  }

  .about-repair-tile--1{
    grid-column:span 2;
    grid-row:span 2;
  }

  .about-repair-tile--2,
  .about-repair-tile--3,
  .about-repair-tile--4,
  .about-repair-tile--5,
  .about-repair-tile--6{
    grid-column:span 1;
    grid-row:span 1;
  }

  .about-local__copy{
    text-align:center;
  }

  .about-local__map{
    min-height:320px;
  }

  .about-final-cta{
    padding:37px 0;
  }

  .about-final-cta__grid{
    grid-template-columns:1fr;
    gap:22px;
    text-align:center;
  }

  .about-final-cta__actions{
    display:grid;
    grid-template-columns:1fr;
    width:100%;
  }

  .about-final-cta__actions .btn{
    width:100%;
  }
}

@media(max-width:430px){
  .about-hero h1{
    font-size:55px;
  }

  .about-hero__visual{
    min-height:260px;
  }

  .about-hero__visual img{
    width:153%;
  }

  .about-service{
    flex-basis:72vw;
  }

  .about-local__map{
    min-height:285px;
  }
}


/* ======================================================================
   SCUFF OFF v2.2.1 — ABOUT PAGE VISUAL POLISH
   Tightens the hero, reduces dead black space and improves section styling.
   ====================================================================== */

/* ----------------------------------------------------------------------
   ABOUT HERO — tighter, fuller, more image-led
   ---------------------------------------------------------------------- */
.about-hero{
  min-height:545px!important;
  align-items:center;
  background:
    radial-gradient(circle at 74% 48%,rgba(0,169,244,.15),transparent 28%),
    radial-gradient(circle at 48% 48%,rgba(244,0,120,.10),transparent 34%),
    linear-gradient(90deg,#030405 0%,#050608 58%,#020304 100%)!important;
}

.about-hero__grid{
  grid-template-columns:.82fr 1.18fr!important;
  gap:6px!important;
  padding-top:34px!important;
  padding-bottom:30px!important;
}

.about-hero__copy{
  padding-left:2px;
}

.about-hero h1{
  margin-top:4px!important;
  margin-bottom:16px!important;
  font-size:clamp(60px,5.9vw,96px)!important;
}

.about-hero__copy>p{
  max-width:600px!important;
  margin-bottom:0;
  font-size:15px!important;
}

.about-hero__actions{
  margin-top:21px!important;
}

/* Fill the right-hand side rather than leaving a large empty black field. */
.about-hero__visual{
  min-height:400px!important;
  margin-right:-3vw;
  justify-content:flex-end!important;
}

.about-hero__visual img{
  width:138%!important;
  max-width:none!important;
  margin-left:-20%!important;
  margin-right:-10%!important;
  transform:translateY(4px);
  filter:
    drop-shadow(0 28px 34px rgba(0,0,0,.82))
    drop-shadow(0 0 16px rgba(0,169,244,.13))!important;
}

.about-hero__paint-sheet{
  left:36%!important;
  top:12px!important;
  width:68%!important;
  opacity:.7!important;
}

.about-hero__paint--pink{
  left:36%!important;
  top:92px!important;
  width:610px!important;
  height:95px!important;
  opacity:.7!important;
}

.about-hero__paint--blue{
  right:-4%!important;
  bottom:45px!important;
  width:650px!important;
  height:74px!important;
  opacity:.46!important;
}

/* subtle overspray to avoid sterile empty black areas */
.about-hero:after{
  content:"";
  position:absolute;
  inset:0;
  z-index:0;
  pointer-events:none;
  opacity:.28;
  background:
    radial-gradient(circle at 91% 15%,rgba(244,0,120,.75) 0 2px,transparent 2.8px),
    radial-gradient(circle at 87% 24%,rgba(0,169,244,.75) 0 1.5px,transparent 2.2px),
    radial-gradient(circle at 67% 11%,rgba(244,233,0,.6) 0 1.3px,transparent 2px),
    radial-gradient(circle at 58% 81%,rgba(244,0,120,.55) 0 1.5px,transparent 2.2px);
}

/* ----------------------------------------------------------------------
   TRUST STRIP — slightly denser and more premium
   ---------------------------------------------------------------------- */
.about-trust__grid>div{
  min-height:82px!important;
  padding-top:13px!important;
  padding-bottom:13px!important;
}

.about-trust__grid strong{
  font-size:15px!important;
}

/* ----------------------------------------------------------------------
   STORY / SPLIT SECTIONS
   ---------------------------------------------------------------------- */
.about-mobile-service,
.about-quality,
.about-real-work,
.about-local{
  position:relative;
}

.about-mobile-service:before,
.about-quality:before,
.about-real-work:before{
  content:"";
  position:absolute;
  left:0;
  right:0;
  top:0;
  height:1px;
  background:linear-gradient(90deg,transparent,rgba(255,255,255,.08),transparent);
}

.about-split,
.about-quality__grid{
  gap:clamp(28px,4vw,60px)!important;
}

.about-photo{
  min-height:430px!important;
}

.about-photo img{
  height:430px!important;
}

.about-copy h2,
.about-quality h2,
.about-real-work h2,
.about-local h2{
  margin-top:4px!important;
  margin-bottom:14px!important;
}

.about-copy p,
.about-quality__copy p,
.about-local__copy p{
  font-size:14px;
}

/* ----------------------------------------------------------------------
   SERVICES — more designed, less "floating six items"
   ---------------------------------------------------------------------- */
.about-service-scroller{
  gap:10px!important;
}

.about-service{
  position:relative;
  padding:12px 12px 18px!important;
  border-bottom:2px solid rgba(255,255,255,.08);
}

.about-service:before{
  content:"";
  position:absolute;
  left:12%;
  right:12%;
  bottom:-2px;
  height:2px;
  opacity:.75;
  border-radius:999px;
}

.about-service--pink:before{background:var(--pink)}
.about-service--blue:before{background:var(--blue)}
.about-service--yellow:before{background:var(--yellow)}
.about-service--lime:before{background:var(--lime)}
.about-service--purple:before{background:#aa55ff}
.about-service--orange:before{background:#ff7b22}

.about-service img{
  height:165px!important;
}

.about-service h3{
  font-size:29px!important;
}

/* ----------------------------------------------------------------------
   QUALITY — stronger visual balance
   ---------------------------------------------------------------------- */
.about-quality__grid{
  grid-template-columns:.9fr 1.1fr!important;
}

.about-quality__image{
  min-height:440px!important;
}

.about-quality__image img{
  height:440px!important;
}

.about-quality__brush{
  height:75px!important;
  opacity:.72!important;
}

/* ----------------------------------------------------------------------
   BENEFITS
   ---------------------------------------------------------------------- */
.about-benefit{
  position:relative;
  padding-bottom:16px!important;
}

.about-benefit:after{
  content:"";
  position:absolute;
  left:28%;
  right:28%;
  bottom:0;
  height:2px;
  background:linear-gradient(90deg,transparent,var(--pink),transparent);
  opacity:.35;
}

.about-benefit img{
  height:155px!important;
}

/* ----------------------------------------------------------------------
   PROCESS
   ---------------------------------------------------------------------- */
.about-process-step{
  min-height:136px!important;
  padding-top:9px!important;
  padding-bottom:9px!important;
}

.about-process-step>span{
  font-size:70px!important;
}

/* ----------------------------------------------------------------------
   REAL WORK GALLERY — larger and less empty
   ---------------------------------------------------------------------- */
.about-real-work__heading{
  margin-bottom:22px!important;
}

.about-repairs-grid{
  grid-auto-rows:185px!important;
}

.about-repair-tile span{
  font-size:14px!important;
}

/* ----------------------------------------------------------------------
   COVERAGE
   ---------------------------------------------------------------------- */
.about-local__grid{
  grid-template-columns:.78fr 1.22fr!important;
  gap:28px!important;
}

.about-local__map{
  min-height:430px!important;
}

/* ----------------------------------------------------------------------
   FINAL CTA
   ---------------------------------------------------------------------- */
.about-final-cta{
  padding-top:40px!important;
  padding-bottom:40px!important;
}

.about-final-cta__grid{
  gap:32px!important;
}

/* ----------------------------------------------------------------------
   LARGE DESKTOP
   ---------------------------------------------------------------------- */
@media(min-width:1500px){
  .about-hero{
    min-height:585px!important;
  }

  .about-hero__grid{
    grid-template-columns:.78fr 1.22fr!important;
  }

  .about-hero__visual{
    min-height:440px!important;
  }

  .about-hero__visual img{
    width:144%!important;
  }
}

/* ----------------------------------------------------------------------
   TABLET / SMALL LAPTOP
   ---------------------------------------------------------------------- */
@media(min-width:761px) and (max-width:1100px){
  .about-hero{
    min-height:515px!important;
  }

  .about-hero__grid{
    grid-template-columns:.9fr 1.1fr!important;
    padding-top:28px!important;
    padding-bottom:26px!important;
  }

  .about-hero h1{
    font-size:58px!important;
  }

  .about-hero__visual{
    min-height:350px!important;
    margin-right:-5vw;
  }

  .about-hero__visual img{
    width:132%!important;
    margin-left:-13%!important;
  }

  .about-hero__paint-sheet{
    left:40%!important;
    width:65%!important;
  }

  .about-photo,
  .about-photo img,
  .about-quality__image,
  .about-quality__image img{
    min-height:380px!important;
    height:380px!important;
  }
}

/* ----------------------------------------------------------------------
   MOBILE — preserve v2.2 stacking but remove excess hero height/spacing
   ---------------------------------------------------------------------- */
@media(max-width:760px){
  .about-hero{
    min-height:auto!important;
  }

  .about-hero__grid{
    grid-template-columns:1fr!important;
    padding-top:20px!important;
    padding-bottom:25px!important;
  }

  .about-hero h1{
    margin-top:4px!important;
    margin-bottom:12px!important;
    font-size:clamp(52px,16vw,69px)!important;
  }

  .about-hero__copy>p{
    font-size:12.5px!important;
  }

  .about-hero__actions{
    margin-top:16px!important;
  }

  .about-hero__visual{
    min-height:250px!important;
    margin:0!important;
  }

  .about-hero__visual img{
    width:151%!important;
    margin:0 -25.5%!important;
  }

  .about-hero__paint-sheet{
    left:50%!important;
    top:192px!important;
    width:118%!important;
    transform:translateX(-50%);
  }

  .about-hero__paint--pink{
    left:50%!important;
    top:210px!important;
    width:350px!important;
    height:63px!important;
    transform:translateX(-50%) rotate(-7deg)!important;
  }

  .about-hero__paint--blue{
    right:-125px!important;
    bottom:90px!important;
    width:340px!important;
    height:55px!important;
  }

  .about-photo{
    min-height:0!important;
  }

  .about-photo img{
    height:auto!important;
  }

  .about-quality__grid{
    grid-template-columns:1fr!important;
  }

  .about-quality__image{
    min-height:0!important;
  }

  .about-quality__image img{
    height:auto!important;
  }

  .about-repairs-grid{
    grid-auto-rows:145px!important;
  }

  .about-local__grid{
    grid-template-columns:1fr!important;
  }

  .about-local__map{
    min-height:300px!important;
  }
}


/* ======================================================================
   SCUFF OFF v2.4 — CONTACT US PAGE
   ====================================================================== */
.contact-page{
  width:100%;
  max-width:none;
  overflow:hidden;
  background:#030405;
}

.contact-hero{
  position:relative;
  min-height:535px;
  display:flex;
  align-items:center;
  overflow:hidden;
  background:
    radial-gradient(circle at 72% 45%,rgba(0,169,244,.14),transparent 29%),
    radial-gradient(circle at 47% 38%,rgba(244,0,120,.08),transparent 28%),
    #030405;
}

.contact-hero__grid{
  position:relative;
  z-index:4;
  display:grid;
  grid-template-columns:.84fr 1.16fr;
  gap:10px;
  align-items:center;
  padding-top:36px;
  padding-bottom:34px;
}

.contact-hero__copy{
  position:relative;
  z-index:6;
}

.contact-hero__copy .brush-kicker{
  color:#fff;
  font-size:clamp(23px,2vw,32px);
}

.contact-hero h1{
  display:flex;
  flex-direction:column;
  align-items:flex-start;
  margin:5px 0 17px;
  font-family:var(--scuff-brush);
  font-size:clamp(68px,6.1vw,100px);
  font-weight:400;
  line-height:.67;
  text-transform:uppercase;
}

.contact-hero h1 span{
  color:var(--pink);
  text-shadow:4px 5px 0 #51002b,8px 9px 0 rgba(0,0,0,.62);
  transform:rotate(-2deg);
}

.contact-hero h1 strong{
  margin-top:15px;
  color:var(--lime);
  font:inherit;
  text-shadow:4px 5px 0 #364500,8px 9px 0 rgba(0,0,0,.62);
  transform:rotate(-1deg);
}

.contact-hero__copy>p{
  max-width:590px;
  margin:0;
  color:#e6e6e6;
  font-size:15px;
  line-height:1.65;
}

.contact-hero__actions{
  display:flex;
  flex-wrap:wrap;
  gap:12px;
  margin-top:23px;
}

.contact-hero__visual{
  position:relative;
  min-height:390px;
  display:flex;
  align-items:center;
  justify-content:flex-end;
  margin-right:-4vw;
}

.contact-hero__visual>img{
  position:relative;
  z-index:3;
  width:136%;
  max-width:none;
  margin-left:-20%;
  margin-right:-8%;
  filter:drop-shadow(0 30px 34px rgba(0,0,0,.8));
}

.contact-hero__paint-sheet{
  position:absolute;
  z-index:1;
  left:37%;
  top:14px;
  width:67%;
  max-width:none;
  opacity:.66;
  mix-blend-mode:screen;
  pointer-events:none;
}

.contact-hero__swipe{
  position:absolute;
  z-index:2;
  pointer-events:none;
  border-radius:52% 48% 57% 43%;
}

.contact-hero__swipe--pink{
  left:39%;
  top:96px;
  width:600px;
  height:83px;
  background:linear-gradient(90deg,transparent,var(--pink) 11% 87%,transparent);
  transform:rotate(-7deg);
  opacity:.7;
}

.contact-hero__swipe--blue{
  right:-4%;
  bottom:43px;
  width:650px;
  height:72px;
  background:linear-gradient(90deg,transparent,var(--blue) 11% 85%,transparent);
  transform:rotate(4deg);
  opacity:.42;
}

.contact-hero__message{
  position:absolute;
  z-index:6;
  right:6%;
  bottom:27px;
  max-width:280px;
  padding:12px 15px 11px;
  background:rgba(5,7,8,.91);
  border-left:4px solid var(--yellow);
  box-shadow:0 12px 30px rgba(0,0,0,.45);
}

.contact-hero__message strong,
.contact-hero__message span{
  display:block;
}

.contact-hero__message strong{
  color:var(--yellow);
  font-family:var(--scuff-display);
  font-size:15px;
  font-weight:400;
  text-transform:uppercase;
}

.contact-hero__message span{
  margin-top:3px;
  color:#bbb;
  font-size:10px;
  line-height:1.4;
}

/* CONTACT METHODS */
.contact-methods{
  background:#070809;
}

.contact-section-heading{
  max-width:850px;
  margin:0 auto 30px;
  text-align:center;
}

.contact-section-heading .brush-kicker{
  color:var(--blue);
}

.contact-section-heading h2,
.contact-enquiry h2,
.contact-workshop h2,
.contact-bottom-cta h2{
  margin:5px 0 14px;
  font-family:var(--scuff-brush);
  font-size:clamp(48px,5vw,72px);
  font-weight:400;
  line-height:.8;
  text-transform:uppercase;
}

.contact-section-heading p{
  max-width:700px;
  margin:0 auto;
  color:#bdbdbd;
  line-height:1.65;
}

.contact-methods__grid{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:0;
  border-block:1px solid rgba(255,255,255,.09);
}

.contact-method{
  position:relative;
  display:grid;
  grid-template-columns:62px 1fr;
  gap:15px;
  align-items:center;
  min-height:128px;
  padding:20px 26px;
  color:#fff;
  border-right:1px solid rgba(255,255,255,.09);
  transition:background .2s ease,transform .2s ease;
}

.contact-method:last-child{
  border-right:0;
}

.contact-method:hover{
  background:rgba(255,255,255,.035);
  transform:translateY(-2px);
}

.contact-method:after{
  content:"";
  position:absolute;
  left:11%;
  right:11%;
  bottom:-1px;
  height:3px;
  border-radius:999px;
}

.contact-method--pink:after{background:var(--pink)}
.contact-method--blue:after{background:var(--blue)}
.contact-method--lime:after{background:var(--lime)}

.contact-method__icon{
  display:grid;
  place-items:center;
  width:58px;
  height:58px;
  font-size:30px;
}

.contact-method--pink .contact-method__icon{color:var(--pink)}
.contact-method--blue .contact-method__icon{color:var(--blue)}
.contact-method--lime .contact-method__icon{color:var(--lime)}

.contact-method__icon svg{
  width:34px;
  height:34px;
  fill:currentColor;
}

.contact-method span,
.contact-method strong,
.contact-method small{
  display:block;
}

.contact-method span{
  font-family:var(--scuff-display);
  color:#999;
  font-size:13px;
  text-transform:uppercase;
}

.contact-method strong{
  margin-top:2px;
  font-size:15px;
  word-break:break-word;
}

.contact-method small{
  margin-top:3px;
  color:#777;
  font-size:9px;
}

.contact-social{
  display:flex;
  justify-content:center;
  align-items:center;
  flex-wrap:wrap;
  gap:13px;
  margin-top:27px;
}

.contact-social>span{
  color:#888;
  font-size:10px;
  font-weight:800;
  text-transform:uppercase;
}

.contact-social a{
  padding:7px 11px;
  border-bottom:2px solid var(--pink);
  color:#fff;
  font-size:10px;
  font-weight:900;
  text-transform:uppercase;
}

/* FORM */
.contact-enquiry{
  position:relative;
  background:
    radial-gradient(circle at 79% 48%,rgba(244,0,120,.08),transparent 28%),
    #030405;
}

.contact-enquiry__grid{
  display:grid;
  grid-template-columns:.82fr 1.18fr;
  gap:clamp(38px,5vw,78px);
  align-items:center;
}

.contact-enquiry__copy .brush-kicker{
  color:var(--pink);
}

.contact-enquiry__copy>p{
  max-width:590px;
  color:#bdbdbd;
  line-height:1.65;
}

.contact-enquiry__tips{
  margin-top:24px;
  border-top:1px solid rgba(255,255,255,.09);
}

.contact-enquiry__tips>div{
  display:grid;
  grid-template-columns:52px 1fr;
  align-items:center;
  min-height:67px;
  border-bottom:1px solid rgba(255,255,255,.07);
}

.contact-enquiry__tips span{
  font-family:var(--scuff-brush);
  color:var(--blue);
  font-size:38px;
  transform:rotate(-3deg);
}

.contact-enquiry__tips p{
  margin:0;
  color:#ccc;
  font-size:11px;
  line-height:1.4;
}

.contact-response{
  display:flex;
  align-items:center;
  flex-wrap:wrap;
  gap:7px 12px;
  margin-top:20px;
  padding:12px 15px;
  border-left:4px solid var(--yellow);
  background:#080a0b;
}

.contact-response strong{
  font-family:var(--scuff-display);
  color:#aaa;
  font-weight:400;
  text-transform:uppercase;
}

.contact-response>span{
  color:var(--yellow);
  font-weight:900;
}

.contact-response small{
  flex-basis:100%;
  color:#777;
  font-size:9px;
}

.contact-enquiry__form-wrap{
  position:relative;
  isolation:isolate;
  padding:34px;
}

.contact-enquiry__form-wrap:before{
  content:"";
  position:absolute;
  z-index:-1;
  inset:-22px -25px;
  background-image:var(--contact-form-frame);
  background-size:100% 100%;
  background-repeat:no-repeat;
  background-position:center;
  opacity:.75;
  pointer-events:none;
}

.contact-enquiry__form,
.contact-enquiry__fallback{
  min-height:430px;
  padding:28px;
  background:rgba(8,10,11,.96);
  border:1px solid rgba(255,255,255,.1);
  box-shadow:0 22px 50px rgba(0,0,0,.5);
}

.contact-enquiry__fallback{
  display:flex;
  flex-direction:column;
  justify-content:center;
}

.contact-enquiry__fallback .brush-kicker{
  color:var(--pink);
}

.contact-enquiry__fallback h3{
  margin:4px 0 10px;
  font-family:var(--scuff-brush);
  font-size:50px;
  font-weight:400;
  line-height:.8;
  text-transform:uppercase;
}

.contact-enquiry__fallback p{
  color:#aaa;
  line-height:1.55;
}

.contact-enquiry__fallback .btn+.btn{
  margin-top:10px;
}

/* Form plugin normalisation */
.contact-enquiry__form input:not([type="checkbox"]):not([type="radio"]):not([type="submit"]),
.contact-enquiry__form textarea,
.contact-enquiry__form select{
  width:100%;
  max-width:none;
  min-height:48px;
  border:1px solid #333!important;
  border-radius:0!important;
  background:#111315!important;
  color:#fff!important;
  box-shadow:none!important;
}

.contact-enquiry__form textarea{
  min-height:120px;
}

.contact-enquiry__form label{
  color:#eee!important;
  font-size:11px!important;
  font-weight:800!important;
  text-transform:uppercase;
}

.contact-enquiry__form input[type="submit"],
.contact-enquiry__form button[type="submit"]{
  min-height:50px;
  padding:12px 24px!important;
  border:0!important;
  border-radius:0!important;
  background:var(--pink)!important;
  color:#fff!important;
  font-family:var(--scuff-body)!important;
  font-weight:900!important;
  text-transform:uppercase;
  cursor:pointer;
}

/* WORKSHOP + GOOGLE MAP */
.contact-workshop{
  background:
    radial-gradient(circle at 68% 55%,rgba(0,169,244,.08),transparent 31%),
    #070809;
}

.contact-workshop__heading{
  display:grid;
  grid-template-columns:.8fr 1.2fr;
  gap:45px;
  align-items:end;
  margin-bottom:26px;
}

.contact-workshop__heading .brush-kicker{
  color:var(--blue);
}

.contact-workshop__heading p{
  margin:0 0 7px;
  color:#bbb;
  line-height:1.65;
}

.contact-workshop__grid{
  display:grid;
  grid-template-columns:.72fr 1.28fr;
  min-height:480px;
  border:1px solid rgba(255,255,255,.1);
}

.contact-workshop__details{
  position:relative;
  padding:34px 37px;
  background:#090b0c;
}

.contact-workshop__details:after{
  content:"";
  position:absolute;
  left:0;
  right:0;
  bottom:0;
  height:4px;
  background:linear-gradient(90deg,var(--pink),var(--blue),var(--yellow));
}

.contact-workshop__label{
  margin-bottom:13px;
  color:var(--pink);
  font-family:var(--scuff-display);
  font-size:15px;
  text-transform:uppercase;
}

.contact-workshop address{
  margin:0 0 26px;
  color:#fff;
  font-style:normal;
  font-size:18px;
  font-weight:700;
  line-height:1.55;
}

.contact-workshop__hours{
  padding-top:19px;
  margin-bottom:25px;
  border-top:1px solid rgba(255,255,255,.09);
}

.contact-workshop__hours>span{
  color:var(--yellow);
  font-family:var(--scuff-display);
  font-size:14px;
  text-transform:uppercase;
}

.contact-workshop__hours p{
  color:#bbb;
  font-size:12px;
  line-height:1.65;
}

.contact-workshop__address-needed{
  margin-bottom:24px;
  padding:15px;
  border-left:4px solid var(--yellow);
  background:#111315;
}

.contact-workshop__address-needed strong{
  color:var(--yellow);
}

.contact-workshop__address-needed p{
  margin:5px 0 0;
  color:#999;
  font-size:10px;
  line-height:1.5;
}

.contact-workshop__map{
  min-height:480px;
  background:#111;
}

.contact-workshop__map iframe{
  display:block;
  width:100%;
  height:100%;
  min-height:480px;
  border:0;
  filter:saturate(.88) contrast(1.04);
}

.contact-workshop__map-placeholder{
  min-height:480px;
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  padding:35px;
  text-align:center;
  background:
    radial-gradient(circle at center,rgba(0,169,244,.1),transparent 38%),
    repeating-linear-gradient(45deg,#0c0e0f 0,#0c0e0f 14px,#090b0c 14px,#090b0c 28px);
}

.contact-workshop__map-placeholder>span{
  color:var(--blue);
  font-size:56px;
}

.contact-workshop__map-placeholder strong{
  margin-top:5px;
  font-family:var(--scuff-brush);
  font-size:46px;
  font-weight:400;
  text-transform:uppercase;
}

.contact-workshop__map-placeholder p{
  max-width:390px;
  color:#999;
  font-size:11px;
  line-height:1.55;
}

/* BOTTOM CTA */
.contact-bottom-cta{
  position:relative;
  padding:42px 0;
  overflow:hidden;
  background:
    linear-gradient(90deg,rgba(244,0,120,.24),rgba(3,4,5,.92) 33%,rgba(3,4,5,.92) 72%,rgba(165,255,0,.12)),
    #030405;
  border-top:1px solid rgba(255,255,255,.08);
}

.contact-bottom-cta:before{
  content:"";
  position:absolute;
  left:-2%;
  right:-2%;
  top:3px;
  height:7px;
  border-radius:50%;
  background:linear-gradient(90deg,transparent,var(--pink) 9% 32%,var(--blue) 38% 63%,var(--yellow) 68% 90%,transparent);
  opacity:.42;
}

.contact-bottom-cta__grid{
  display:grid;
  grid-template-columns:1fr auto;
  gap:40px;
  align-items:center;
}

.contact-bottom-cta .brush-kicker{
  color:#fff;
}

.contact-bottom-cta h2{
  margin-bottom:8px;
  color:var(--yellow);
}

.contact-bottom-cta p{
  max-width:720px;
  margin:0;
  color:#ddd;
}

.contact-bottom-cta__actions{
  display:flex;
  flex-wrap:wrap;
  gap:11px;
}

/* Tablet */
@media(max-width:1100px){
  .contact-hero__grid{
    grid-template-columns:.9fr 1.1fr;
  }
  .contact-hero h1{
    font-size:67px;
  }
  .contact-method{
    padding-inline:18px;
  }
  .contact-enquiry__grid{
    gap:30px;
  }
  .contact-workshop__grid{
    grid-template-columns:.8fr 1.2fr;
  }
}

/* Mobile */
@media(max-width:760px){
  .contact-hero{
    min-height:auto;
  }

  .contact-hero__grid{
    display:flex;
    flex-direction:column;
    gap:0;
    padding-top:21px;
    padding-bottom:27px;
  }

  .contact-hero__copy{
    order:1;
    width:100%;
    text-align:center;
  }

  .contact-hero__copy .brush-kicker{
    font-size:22px;
  }

  .contact-hero h1{
    align-items:center;
    margin:5px 0 12px;
    font-size:clamp(56px,17vw,72px);
    line-height:.69;
    text-align:center;
  }

  .contact-hero h1 strong{
    margin-top:11px;
  }

  .contact-hero__copy>p{
    max-width:350px;
    margin-inline:auto;
    font-size:12.5px;
  }

  .contact-hero__visual{
    order:2;
    width:100%;
    min-height:250px;
    margin:0;
    justify-content:center;
  }

  .contact-hero__visual>img{
    width:151%;
    margin:0 -25.5%;
  }

  .contact-hero__message{
    display:none;
  }

  .contact-hero__actions{
    display:grid;
    grid-template-columns:1fr;
    max-width:390px;
    margin:14px auto 0;
  }

  .contact-hero__actions .btn{
    width:100%;
  }

  .contact-hero__paint-sheet{
    left:50%;
    top:194px;
    width:118%;
    transform:translateX(-50%);
  }

  .contact-hero__swipe--pink{
    left:50%;
    top:216px;
    width:360px;
    height:62px;
    transform:translateX(-50%) rotate(-7deg);
  }

  .contact-hero__swipe--blue{
    right:-125px;
    bottom:89px;
    width:340px;
    height:55px;
  }

  .contact-section-heading h2,
  .contact-enquiry h2,
  .contact-workshop h2,
  .contact-bottom-cta h2{
    font-size:clamp(41px,12.5vw,54px);
  }

  .contact-methods__grid{
    grid-template-columns:1fr;
  }

  .contact-method{
    grid-template-columns:52px 1fr;
    min-height:100px;
    padding:14px 10px;
    border-right:0;
    border-bottom:1px solid rgba(255,255,255,.08);
  }

  .contact-method:last-child{
    border-bottom:0;
  }

  .contact-method__icon{
    width:48px;
    height:48px;
  }

  .contact-method strong{
    font-size:13px;
  }

  .contact-enquiry__grid,
  .contact-workshop__heading,
  .contact-workshop__grid,
  .contact-bottom-cta__grid{
    grid-template-columns:1fr;
  }

  .contact-enquiry__grid{
    gap:27px;
  }

  .contact-enquiry__form-wrap{
    padding:12px;
  }

  .contact-enquiry__form-wrap:before{
    inset:-9px;
  }

  .contact-enquiry__form,
  .contact-enquiry__fallback{
    min-height:0;
    padding:19px 16px;
  }

  .contact-enquiry__fallback h3{
    font-size:42px;
  }

  .contact-workshop__heading{
    gap:8px;
    text-align:center;
  }

  .contact-workshop__heading p{
    font-size:12px;
  }

  .contact-workshop__grid{
    min-height:0;
  }

  .contact-workshop__details{
    padding:23px 18px;
    text-align:center;
  }

  .contact-workshop address{
    font-size:16px;
  }

  .contact-workshop__map,
  .contact-workshop__map iframe,
  .contact-workshop__map-placeholder{
    min-height:350px;
  }

  .contact-bottom-cta__grid{
    gap:20px;
    text-align:center;
  }

  .contact-bottom-cta__actions{
    display:grid;
    grid-template-columns:1fr;
    width:100%;
  }

  .contact-bottom-cta__actions .btn{
    width:100%;
  }
}

@media(max-width:430px){
  .contact-hero h1{
    font-size:53px;
  }

  .contact-hero__visual{
    min-height:235px;
  }

  .contact-workshop__map,
  .contact-workshop__map iframe,
  .contact-workshop__map-placeholder{
    min-height:310px;
  }
}


/* ======================================================================
   SCUFF OFF v2.4.1 — CMS-CONTROLLED FOOTER MENUS
   ====================================================================== */
.site-footer .footer-menu{
  list-style:none;
  margin:0;
  padding:0;
}

.site-footer .footer-menu li{
  margin:0;
  padding:0;
}

.site-footer .footer-menu a{
  display:inline-block;
}

.site-footer .footer-menu .sub-menu{
  display:none;
}

/* SCUFF OFF v2.5 — GET A QUOTE */
.quote-page{width:100%;overflow:hidden;background:#030405}.quote-hero{position:relative;min-height:520px;display:flex;align-items:center;overflow:hidden;background:radial-gradient(circle at 73% 45%,rgba(0,169,244,.14),transparent 28%),radial-gradient(circle at 48% 38%,rgba(244,0,120,.09),transparent 31%),#030405}.quote-hero__grid{position:relative;z-index:2;display:grid;grid-template-columns:.84fr 1.16fr;align-items:center;padding-top:30px;padding-bottom:28px}.quote-hero h1{display:flex;flex-direction:column;margin:5px 0 16px;font-family:var(--scuff-brush);font-size:clamp(64px,5.8vw,95px);font-weight:400;line-height:.68;text-transform:uppercase}.quote-hero h1 span{color:var(--pink)}.quote-hero h1 strong{margin-top:14px;color:var(--lime);font:inherit}.quote-hero__copy>p{max-width:600px;color:#e5e5e5;line-height:1.65}.quote-hero__trust{display:flex;flex-wrap:wrap;gap:10px 18px;margin-top:20px;color:#aaa;font-size:10px;font-weight:900;text-transform:uppercase}.quote-hero__visual{position:relative;min-height:380px;display:flex;align-items:center;justify-content:flex-end;margin-right:-4vw}.quote-hero__visual>img{width:136%;max-width:none;margin-left:-19%;margin-right:-8%;filter:drop-shadow(0 30px 34px rgba(0,0,0,.82))}.quote-hero__paint-sheet{position:absolute;left:37%;top:13px;width:67%;opacity:.68;mix-blend-mode:screen}.quote-hero__jump{position:absolute;right:5%;bottom:25px;padding:12px 16px;background:rgba(6,8,9,.94);border-left:4px solid var(--yellow)}.quote-hero__jump span,.quote-hero__jump strong{display:block}.quote-hero__jump span{color:#999;font-size:9px;text-transform:uppercase}.quote-hero__jump strong{color:var(--yellow);font-family:var(--scuff-display);font-size:17px;text-transform:uppercase}.quote-fast-strip{border-block:1px solid rgba(255,255,255,.09);background:#080a0b}.quote-fast-strip__grid{display:grid;grid-template-columns:repeat(4,1fr)}.quote-fast-strip__grid>div{display:flex;align-items:center;justify-content:center;gap:10px;min-height:76px;border-right:1px solid rgba(255,255,255,.08)}.quote-fast-strip strong{font-family:var(--scuff-brush);color:var(--pink);font-size:36px}.quote-fast-strip span{font-family:var(--scuff-display);font-size:12px;text-transform:uppercase}.quote-form-section__grid{display:grid;grid-template-columns:.78fr 1.22fr;gap:clamp(36px,5vw,76px);align-items:center}.quote-form-section__intro .brush-kicker{color:var(--pink)}.quote-form-section h2,.quote-faq h2,.quote-final h2{margin:5px 0 14px;font-family:var(--scuff-brush);font-size:clamp(48px,5vw,72px);font-weight:400;line-height:.8;text-transform:uppercase}.quote-form-section__intro>p{color:#bbb;line-height:1.65}.quote-alt-contact{margin-top:25px;padding-top:20px;border-top:1px solid rgba(255,255,255,.08)}.quote-alt-contact p{color:#888;font-size:10px}.quote-form-shell__inner,.quote-form-fallback{min-height:460px;padding:28px;background:#080a0b;border:1px solid rgba(255,255,255,.1)}.quote-form-fallback{display:flex;flex-direction:column;justify-content:center}.quote-form-fallback h3{font-family:var(--scuff-brush);font-size:50px;font-weight:400;text-transform:uppercase}.quote-form-shell__inner input:not([type=checkbox]):not([type=radio]):not([type=submit]),.quote-form-shell__inner textarea,.quote-form-shell__inner select{width:100%;min-height:48px;border:1px solid #333!important;background:#111315!important;color:#fff!important}.quote-photo-help{background:#070809}.quote-photo-help__grid,.quote-next__grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}.quote-photo-help__grid article,.quote-next__grid article{padding:24px;background:#090b0c;border-bottom:3px solid var(--pink)}.quote-photo-help__grid strong,.quote-next__grid>article>span{font-family:var(--scuff-brush);color:var(--blue);font-size:64px}.quote-photo-help__grid h3,.quote-next__grid h3{font-family:var(--scuff-display);font-weight:400;text-transform:uppercase}.quote-photo-help__grid p,.quote-next__grid p{color:#999;font-size:11px;line-height:1.5}.quote-faq{background:#070809}.quote-faq__grid{display:grid;grid-template-columns:.72fr 1.28fr;gap:50px}.quote-faq details{padding:17px 0;border-bottom:1px solid rgba(255,255,255,.09)}.quote-faq summary{font-family:var(--scuff-display);font-size:17px;text-transform:uppercase;cursor:pointer}.quote-faq p{color:#999;font-size:11px}.quote-final{padding:40px 0;background:linear-gradient(90deg,rgba(244,0,120,.23),#030405 36%,#030405 74%,rgba(244,233,0,.12))}.quote-final__grid{display:grid;grid-template-columns:1fr auto;gap:35px;align-items:center}.quote-final h2{color:var(--yellow);margin-bottom:6px}.quote-final p{margin:0;color:#ddd}@media(max-width:760px){.quote-hero{min-height:auto}.quote-hero__grid{display:flex;flex-direction:column;padding-top:20px;padding-bottom:25px}.quote-hero__copy{text-align:center}.quote-hero h1{align-items:center;font-size:clamp(52px,15.5vw,68px)}.quote-hero__trust{justify-content:center}.quote-hero__visual{min-height:240px;margin:0}.quote-hero__visual>img{width:151%;margin:0 -25.5%}.quote-hero__jump{display:none}.quote-hero__paint-sheet{left:50%;top:190px;width:118%;transform:translateX(-50%)}.quote-fast-strip__grid{grid-template-columns:repeat(2,1fr)}.quote-form-section__grid,.quote-photo-help__grid,.quote-next__grid,.quote-faq__grid,.quote-final__grid{grid-template-columns:1fr}.quote-form-section__intro{text-align:center}.quote-form-shell__inner,.quote-form-fallback{min-height:0;padding:18px 15px}.quote-final__grid{text-align:center}.quote-final .btn{width:100%}}

/* SCUFF OFF v2.5.1 — BESPOKE QUOTE FORM */
.quote-form-shell__inner--native{padding:24px!important}.scuff-quote-honeypot{position:absolute!important;left:-9999px!important;width:1px!important;height:1px!important;overflow:hidden!important}.scuff-quote-form-grid{display:grid;gap:14px}.scuff-quote-form-grid--2{grid-template-columns:repeat(2,minmax(0,1fr))}.scuff-quote-form-field{margin-bottom:14px}.scuff-quote-form-field label{display:flex!important;gap:5px;margin-bottom:6px;color:#eee!important;font-size:10px!important;font-weight:900!important;text-transform:uppercase}.scuff-quote-form-field label>span{color:var(--pink)}.scuff-quote-form-field label small{color:#777;font-size:8px}.scuff-native-quote-form input[type=text],.scuff-native-quote-form input[type=tel],.scuff-native-quote-form input[type=email],.scuff-native-quote-form select,.scuff-native-quote-form textarea{width:100%;min-height:48px;padding:11px 12px;border:1px solid #323538!important;border-radius:0!important;background:#101214!important;color:#fff!important;box-shadow:none!important}.scuff-native-quote-form textarea{min-height:132px;resize:vertical}.scuff-native-quote-form input:focus,.scuff-native-quote-form select:focus,.scuff-native-quote-form textarea:focus{border-color:var(--blue)!important;box-shadow:0 0 0 1px var(--blue)!important}.scuff-quote-upload{margin-top:7px;padding-top:20px;border-top:1px solid rgba(255,255,255,.09)}.scuff-quote-upload__heading{display:flex;justify-content:space-between;gap:20px;align-items:flex-end;margin-bottom:11px}.scuff-quote-upload__heading span,.scuff-quote-upload__heading strong{display:block}.scuff-quote-upload__heading span{color:var(--pink);font-family:var(--scuff-display);font-size:12px;text-transform:uppercase}.scuff-quote-upload__heading strong{font-family:var(--scuff-brush);font-size:34px;font-weight:400;line-height:.85;text-transform:uppercase}.scuff-quote-upload__heading>small{max-width:230px;color:#777;font-size:8.5px;text-align:right}.scuff-quote-dropzone{position:relative;display:flex!important;flex-direction:column;align-items:center!important;justify-content:center;min-height:180px;padding:22px;border:2px dashed #3b3e40;background:radial-gradient(circle at 50% 55%,rgba(0,169,244,.08),transparent 39%),#0c0e0f;cursor:pointer;text-align:center}.scuff-quote-dropzone:hover{border-color:var(--blue)}.scuff-quote-dropzone__icon{display:grid;place-items:center;width:52px;height:52px;margin-bottom:9px;border:2px solid var(--pink);border-radius:50%;color:var(--pink);font-size:34px}.scuff-quote-dropzone>strong{color:#fff;font-family:var(--scuff-display);font-size:17px;font-weight:400;text-transform:uppercase}.scuff-quote-dropzone>small{max-width:380px;margin-top:5px;color:#777;font-size:9px}.scuff-quote-dropzone input[type=file]{position:absolute;inset:0;width:100%;height:100%;opacity:0;cursor:pointer}.scuff-quote-file-list{display:grid;gap:5px;margin-top:8px}.scuff-quote-file-item{display:flex;justify-content:space-between;gap:12px;padding:7px 9px;border-left:3px solid var(--blue);background:#0f1112;color:#bbb;font-size:9px}.scuff-quote-file-error{padding:8px 10px;border-left:3px solid var(--pink);background:#16080e;color:#fff;font-size:10px}.scuff-quote-consent{margin-top:16px;padding:12px 13px;background:#0b0d0e;border:1px solid rgba(255,255,255,.07)}.scuff-quote-consent label{display:flex!important;align-items:flex-start!important;gap:9px!important;margin:0!important;color:#aaa!important;font-size:9px!important;font-weight:500!important;line-height:1.5!important;text-transform:none!important}.scuff-quote-consent a{color:var(--blue);text-decoration:underline}.scuff-quote-submit{width:100%;min-height:54px;margin-top:14px;border:0;cursor:pointer}.scuff-quote-form-alt{display:flex;justify-content:center;flex-wrap:wrap;gap:5px;margin-top:11px;color:#777;font-size:9px}.scuff-quote-form-alt a{color:var(--lime);font-weight:800}.scuff-quote-notice{margin-bottom:15px;padding:12px 14px;border-left:4px solid}.scuff-quote-notice strong,.scuff-quote-notice span{display:block}.scuff-quote-notice strong{color:#fff;font-family:var(--scuff-display);font-size:14px;font-weight:400;text-transform:uppercase}.scuff-quote-notice span{margin-top:3px;color:#aaa;font-size:9px}.scuff-quote-notice--success{border-color:var(--lime);background:rgba(165,255,0,.07)}.scuff-quote-notice--error{border-color:var(--pink);background:rgba(244,0,120,.07)}@media(max-width:760px){.quote-form-shell__inner--native{padding:16px!important}.scuff-quote-form-grid--2{grid-template-columns:1fr;gap:0}.scuff-quote-upload__heading{display:block}.scuff-quote-upload__heading>small{display:block;margin-top:6px;text-align:left}.scuff-quote-dropzone{min-height:155px}}


/* ======================================================================
   SCUFF OFF v2.6 — SHARED CONTENT HERO IMAGE MODES
   Applies to About Us, Contact Us and Get A Quote.
   ====================================================================== */

/* Manual uploads default to this contained logo/artwork treatment. */
.about-hero__visual--contain,
.contact-hero__visual--contain,
.quote-hero__visual--contain{
  position:relative;
  justify-content:center!important;
  margin-right:0!important;
  padding:clamp(18px,3vw,46px)!important;
  overflow:visible!important;
}

.about-hero__visual--contain img,
.contact-hero__visual--contain>img,
.quote-hero__visual--contain>img{
  position:relative!important;
  z-index:3!important;
  width:min(88%,760px)!important;
  max-width:760px!important;
  max-height:420px!important;
  height:auto!important;
  margin:0!important;
  object-fit:contain!important;
  object-position:center!important;
  transform:none!important;
  filter:drop-shadow(0 20px 28px rgba(0,0,0,.6))!important;
}

.about-hero__visual--contain:before,
.contact-hero__visual--contain:before,
.quote-hero__visual--contain:before{
  content:"";
  position:absolute;
  z-index:0;
  left:8%;
  right:8%;
  top:14%;
  bottom:13%;
  background:
    radial-gradient(ellipse at 45% 48%,rgba(244,0,120,.16),transparent 52%),
    radial-gradient(ellipse at 66% 56%,rgba(0,169,244,.13),transparent 58%);
  pointer-events:none;
}

/* Full visual mode deliberately preserves the existing oversized car/artwork behaviour. */
.about-hero__visual--visual img,
.contact-hero__visual--visual>img,
.quote-hero__visual--visual>img{
  object-fit:contain;
}

.contact-hero__visual--contain .contact-hero__message,
.quote-hero__visual--contain .quote-hero__jump{
  right:2%;
  bottom:8px;
}

@media(min-width:761px) and (max-width:1100px){
  .about-hero__visual--contain img,
  .contact-hero__visual--contain>img,
  .quote-hero__visual--contain>img{
    width:min(90%,620px)!important;
    max-height:340px!important;
  }
}

@media(max-width:760px){
  .about-hero__visual--contain,
  .contact-hero__visual--contain,
  .quote-hero__visual--contain{
    min-height:210px!important;
    padding:15px 7px!important;
  }

  .about-hero__visual--contain img,
  .contact-hero__visual--contain>img,
  .quote-hero__visual--contain>img{
    width:min(92%,430px)!important;
    max-width:430px!important;
    max-height:245px!important;
    margin:0!important;
  }

  .contact-hero__visual--contain .contact-hero__message,
  .quote-hero__visual--contain .quote-hero__jump{
    display:none!important;
  }
}


/* ======================================================================
   SCUFF OFF v2.7 — HOME PAGE CMS + STATIC FRONT PAGE SUPPORT
   ====================================================================== */
.home-cms-hero__vehicle--contain{
  position:relative;
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  padding:clamp(18px,2vw,34px)!important;
  overflow:visible!important;
}

.home-cms-hero__vehicle--contain img{
  width:min(88%,760px)!important;
  max-width:760px!important;
  max-height:430px!important;
  height:auto!important;
  margin:0!important;
  object-fit:contain!important;
  object-position:center!important;
  filter:drop-shadow(0 22px 28px rgba(0,0,0,.62))!important;
}

.home-cms-hero__vehicle--visual img{
  object-fit:contain;
}

@media(max-width:760px){
  .home-cms-hero__vehicle--contain{
    min-height:230px!important;
    padding:12px 5px!important;
  }

  .home-cms-hero__vehicle--contain img{
    width:min(92%,430px)!important;
    max-width:430px!important;
    max-height:250px!important;
    margin:0!important;
  }
}


/* ======================================================================
   SCUFF OFF v2.7.1 — HOMEPAGE HERO IMAGE PLACEMENT
   Rebalances custom logo/artwork mode across desktop, tablet and mobile.
   ====================================================================== */

/* Desktop: keep the uploaded logo/artwork prominent, but no longer let it
   dominate the complete hero or collide with the copy/quote panel. */
@media(min-width:1181px){
  .home-cms-hero .hero__grid{
    grid-template-columns:minmax(330px,.92fr) minmax(500px,1.22fr) minmax(320px,.76fr)!important;
    gap:22px!important;
  }

  .home-cms-hero__vehicle--contain{
    min-height:410px!important;
    padding:24px 18px!important;
    display:flex!important;
    align-items:center!important;
    justify-content:center!important;
    overflow:visible!important;
  }

  .home-cms-hero__vehicle--contain img{
    width:auto!important;
    max-width:min(76%,500px)!important;
    max-height:300px!important;
    height:auto!important;
    margin:0 auto!important;
    object-fit:contain!important;
    object-position:center!important;
    transform:none!important;
    filter:drop-shadow(0 22px 34px rgba(0,0,0,.62))!important;
  }

  /* Keep paint behind the contained logo, rather than using the car-sized
     offsets that made the composition feel misplaced. */
  .home-cms-hero:has(.home-cms-hero__vehicle--contain) .hero__paint-sheet{
    left:31%!important;
    top:32px!important;
    width:48%!important;
    opacity:.62!important;
  }

  .home-cms-hero:has(.home-cms-hero__vehicle--contain) .hero__splash--pink{
    left:35%!important;
    top:110px!important;
    right:auto!important;
  }

  .home-cms-hero:has(.home-cms-hero__vehicle--contain) .hero__splash--blue{
    right:27%!important;
    bottom:90px!important;
  }
}

/* Laptop / tablet landscape */
@media(min-width:901px) and (max-width:1180px){
  .home-cms-hero .hero__grid{
    grid-template-columns:minmax(300px,.9fr) minmax(390px,1.15fr) minmax(280px,.72fr)!important;
    gap:18px!important;
  }

  .home-cms-hero__vehicle--contain{
    min-height:360px!important;
    padding:20px 12px!important;
    display:flex!important;
    align-items:center!important;
    justify-content:center!important;
  }

  .home-cms-hero__vehicle--contain img{
    width:auto!important;
    max-width:min(78%,420px)!important;
    max-height:270px!important;
    height:auto!important;
    margin:0 auto!important;
    object-fit:contain!important;
    transform:none!important;
  }
}

/* Tablet portrait: the artwork sits between the copy and the CTA cleanly. */
@media(min-width:761px) and (max-width:900px){
  .home-cms-hero .hero__grid{
    grid-template-columns:1fr!important;
    gap:8px!important;
  }

  .home-cms-hero__vehicle--contain{
    order:2!important;
    min-height:310px!important;
    padding:12px 20px!important;
    display:flex!important;
    align-items:center!important;
    justify-content:center!important;
  }

  .home-cms-hero__vehicle--contain img{
    width:auto!important;
    max-width:min(74vw,440px)!important;
    max-height:255px!important;
    height:auto!important;
    margin:0 auto!important;
    object-fit:contain!important;
    transform:none!important;
  }

  .home-cms-hero .hero__copy{
    text-align:center!important;
  }

  .home-cms-hero .hero__actions--desktop{
    justify-content:center!important;
  }

  .home-cms-hero .quick-quote{
    width:min(560px,88vw)!important;
    margin:12px auto 0!important;
  }
}

/* Mobile: smaller logo, centred, with breathing room and no car-style oversize. */
@media(max-width:760px){
  .home-cms-hero__vehicle--contain{
    order:2!important;
    min-height:235px!important;
    padding:10px 4px 8px!important;
    display:flex!important;
    align-items:center!important;
    justify-content:center!important;
    margin-top:2px!important;
  }

  .home-cms-hero__vehicle--contain img{
    width:auto!important;
    max-width:min(78vw,320px)!important;
    max-height:190px!important;
    height:auto!important;
    margin:0 auto!important;
    object-fit:contain!important;
    object-position:center!important;
    transform:none!important;
    filter:drop-shadow(0 16px 24px rgba(0,0,0,.58))!important;
  }

  .home-cms-hero:has(.home-cms-hero__vehicle--contain) .hero__paint-sheet{
    left:50%!important;
    top:215px!important;
    width:105%!important;
    transform:translateX(-50%)!important;
    opacity:.5!important;
  }

  .home-cms-hero .hero__actions--mobile{
    margin-top:8px!important;
  }
}

@media(max-width:430px){
  .home-cms-hero__vehicle--contain{
    min-height:205px!important;
  }

  .home-cms-hero__vehicle--contain img{
    max-width:min(76vw,280px)!important;
    max-height:170px!important;
  }
}


/* ======================================================================
   FINAL HOMEPAGE HERO RESPONSIVE OVERRIDE
   Targets the ACTUAL live markup:
   .home-cms-hero__vehicle--visual
   Desktop remains unchanged.
   ====================================================================== */

@media (max-width:1180px){

  html,
  body,
  #primary,
  .home-page-cms,
  .home-cms-hero{
    width:100%!important;
    max-width:100%!important;
    overflow-x:hidden!important;
  }

  .page-template-page-home .home-cms-hero .hero__grid{
    width:100%!important;
    max-width:100%!important;
    min-width:0!important;
    box-sizing:border-box!important;
  }

  .page-template-page-home .home-cms-hero .home-cms-hero__vehicle--visual{
    width:100%!important;
    max-width:100%!important;
    min-width:0!important;
    margin-left:0!important;
    margin-right:0!important;
    padding-left:0!important;
    padding-right:0!important;
    display:flex!important;
    align-items:center!important;
    justify-content:center!important;
    overflow:hidden!important;
    transform:none!important;
  }

  .page-template-page-home .home-cms-hero .home-cms-hero__vehicle--visual > img{
    display:block!important;
    width:auto!important;
    height:auto!important;
    max-width:100%!important;
    max-height:none!important;
    margin:0 auto!important;
    object-fit:contain!important;
    object-position:center!important;
    transform:none!important;
  }
}

/* Tablet landscape / small laptops */
@media (min-width:901px) and (max-width:1180px){
  .page-template-page-home .home-cms-hero .home-cms-hero__vehicle--visual{
    min-height:320px!important;
  }

  .page-template-page-home .home-cms-hero .home-cms-hero__vehicle--visual > img{
    width:min(52vw,560px)!important;
    max-width:100%!important;
  }
}

/* Tablet portrait */
@media (min-width:761px) and (max-width:900px){
  .page-template-page-home .home-cms-hero .hero__grid{
    grid-template-columns:1fr!important;
  }

  .page-template-page-home .home-cms-hero .home-cms-hero__vehicle--visual{
    order:2!important;
    min-height:260px!important;
  }

  .page-template-page-home .home-cms-hero .home-cms-hero__vehicle--visual > img{
    width:min(68vw,470px)!important;
    max-width:100%!important;
  }
}

/* Mobile */
@media (max-width:760px){
  .page-template-page-home .home-cms-hero .hero__grid{
    padding-left:12px!important;
    padding-right:12px!important;
  }

  .page-template-page-home .home-cms-hero .home-cms-hero__vehicle--visual{
    order:2!important;
    min-height:0!important;
    margin:8px 0 6px!important;
  }

  .page-template-page-home .home-cms-hero .home-cms-hero__vehicle--visual > img{
    width:min(82vw,330px)!important;
    max-width:100%!important;
    margin:0 auto!important;
  }
}

/* Small phones */
@media (max-width:430px){
  .page-template-page-home .home-cms-hero .home-cms-hero__vehicle--visual > img{
    width:min(80vw,290px)!important;
    max-width:100%!important;
  }
}