:root{--navy:#041f3a;--navy2:#082d52;--green:#67ad2f;--green2:#7ac43b;--ink:#0b1d31;--muted:#536274;--line:#d9e1e8;--soft:#f4f7f9;--white:#fff;--shadow:0 18px 45px rgba(4,31,58,.14);--radius:10px}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;font-family:Arial,Helvetica,sans-serif;color:var(--ink);line-height:1.55;background:#fff}a{color:inherit;text-decoration:none}img{max-width:100%;display:block}h1,h2,h3{font-family:Arial,Helvetica,sans-serif;line-height:1.08;margin:0 0 .65rem;font-weight:900;letter-spacing:-.025em}h1{font-size:clamp(2.7rem,5vw,5.15rem)}h2{font-size:clamp(1.85rem,3.2vw,3rem)}h3{font-size:1.18rem}.wrap{width:min(1240px,calc(100% - 40px));margin:auto}.topbar{background:var(--navy);color:#fff;font-size:.86rem}.topbar .wrap{min-height:34px;display:flex;align-items:center;justify-content:space-between;gap:22px}.site-header{position:sticky;top:0;z-index:100;background:#fff;border-bottom:1px solid #e3e8ed;box-shadow:0 3px 14px rgba(4,31,58,.05)}.nav{min-height:84px;display:flex;align-items:center;gap:28px}.brand{display:flex;align-items:center;min-width:275px}.brand img{width:260px;height:auto}.nav-links{margin-left:auto;display:flex;align-items:center;gap:24px}.nav-links a{font-size:.84rem;font-weight:900;color:var(--ink);text-transform:uppercase}.nav-links a:hover{color:var(--green)}.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;border:0;border-radius:5px;padding:14px 22px;font-weight:900;text-transform:uppercase;font-size:.85rem;cursor:pointer}.btn-primary{background:var(--green);color:#fff}.btn-primary:hover{background:#559522}.btn-dark{background:var(--navy);color:#fff}.btn-outline{background:#fff;color:var(--navy);border:2px solid var(--navy)}.menu-btn{display:none}.mobile-call{display:none}.hero{position:relative;color:#fff;background:var(--navy);overflow:visible}.hero:before{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(3,20,37,.9) 0%,rgba(3,20,37,.56) 47%,rgba(3,20,37,.08) 72%),url('images/img-shop-audi.png') center/cover no-repeat}.hero .wrap{position:relative;display:grid;grid-template-columns:minmax(0,1.45fr) minmax(340px,.62fr);gap:34px;align-items:start;min-height:620px;padding:66px 0 42px}.hero-copy{padding-top:30px;max-width:700px}.eyebrow{display:inline-block;color:#b9e596;text-transform:uppercase;letter-spacing:.12em;font-weight:900;font-size:.78rem;margin-bottom:13px}.hero h1{max-width:720px;text-transform:uppercase;text-shadow:0 2px 14px rgba(0,0,0,.25)}.hero p{font-size:1.18rem;max-width:560px;color:#f2f5f7}.hero-actions{display:flex;gap:12px;flex-wrap:wrap;margin:27px 0 18px}.hero .btn-outline{background:rgba(4,31,58,.82);border-color:#fff;color:#fff}.trust-row{display:flex;gap:20px;flex-wrap:wrap;font-size:.86rem;font-weight:700}.form-card{background:var(--navy);color:#fff;border-radius:8px;padding:25px 22px;box-shadow:0 20px 48px rgba(0,0,0,.3);margin-top:-18px;border-top:5px solid var(--green)}.form-card h2{text-align:center;font-size:1.55rem;text-transform:uppercase}.form-card>p{text-align:center;color:#dbe7ef}.form-grid{display:grid;grid-template-columns:1fr;gap:10px}.field{display:flex;flex-direction:column;gap:5px}.field.full{grid-column:1/-1}.field label{font-weight:800;font-size:.78rem}.field input,.field select,.field textarea{width:100%;min-height:44px;border:1px solid #c8d2dd;border-radius:4px;padding:10px 12px;font:inherit;background:#fff;color:#172536}.field textarea{min-height:82px;resize:vertical}.form-card .field label{position:absolute;left:-9999px}.form-card .small{color:#d5e0e8}.form-card .btn{width:100%;background:var(--green);color:#fff}.small{font-size:.75rem;color:var(--muted)}.photo-consent{display:flex;flex-direction:row;align-items:flex-start;gap:8px}.photo-consent input{width:auto;min-height:0;margin-top:3px}.section{padding:72px 0}.section.alt{background:var(--soft)}.section-head{display:flex;justify-content:space-between;align-items:end;gap:32px;margin-bottom:28px}.section-head p{max-width:650px;color:var(--muted);margin:0}.pill{display:inline-block;color:var(--green);font-weight:900;text-transform:uppercase;letter-spacing:.08em;font-size:.74rem;margin-bottom:7px}.grid-3{display:grid;grid-template-columns:repeat(3,1fr);gap:22px}.grid-2{display:grid;grid-template-columns:repeat(2,1fr);gap:24px}.grid-4{display:grid;grid-template-columns:repeat(4,1fr);gap:16px}.card{background:#fff;border:1px solid var(--line);border-radius:8px;overflow:hidden;box-shadow:0 8px 24px rgba(4,31,58,.08);transition:.2s transform,.2s box-shadow}.card:hover{transform:translateY(-4px);box-shadow:var(--shadow)}.card img{width:100%;aspect-ratio:4/3;object-fit:cover}.card-body{padding:19px}.card p{color:var(--muted);margin:.4rem 0 .8rem}.card strong{color:var(--green);text-transform:uppercase;font-size:.8rem}.service-deck{position:relative;margin-top:-105px;z-index:3}.service-deck .grid-4{align-items:stretch}.service-deck .card{border-radius:8px}.service-deck .card img{aspect-ratio:16/9}.trust-band{background:var(--navy);color:#fff;padding:22px 0}.trust-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:20px}.trust-item{display:flex;gap:13px;align-items:center}.trust-icon{width:46px;height:46px;border:2px solid var(--green);border-radius:50%;display:grid;place-items:center;color:var(--green);font-size:1.3rem;font-weight:900}.trust-item b{display:block;text-transform:uppercase;font-size:.79rem}.trust-item span{color:#c8d6e1;font-size:.78rem}.tool-grid{display:grid;grid-template-columns:repeat(6,1fr);gap:12px}.tool-card{border:1px solid #bfd0df;background:#fff;border-radius:7px;padding:20px 13px;text-align:center}.tool-card .tool-icon{font-size:2rem;margin-bottom:8px}.tool-card h3{font-size:.95rem}.tool-card p{font-size:.78rem;color:var(--muted);min-height:58px}.tool-card a{font-size:.73rem;color:var(--green);font-weight:900;text-transform:uppercase}.area-list{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}.area-link{background:#fff;border:1px solid var(--line);padding:13px 15px;border-radius:5px;font-weight:800}.area-link:hover{border-color:var(--green);color:var(--green)}.local-panel{display:grid;grid-template-columns:1.1fr .9fr;background:var(--navy);color:#fff;overflow:hidden;border-radius:9px}.local-panel img{width:100%;height:100%;object-fit:cover;min-height:340px}.local-copy{padding:44px}.local-copy p{color:#d5e1e9}.band{background:linear-gradient(135deg,var(--navy),var(--navy2));color:#fff;border-radius:9px;padding:36px;display:flex;justify-content:space-between;align-items:center;gap:30px}.page-hero{background:linear-gradient(100deg,rgba(4,31,58,.98),rgba(8,45,82,.88)),url('images/img-commercial-interior.png') center/cover;color:#fff;padding:72px 0}.page-hero p{max-width:760px;color:#dce7ee;font-size:1.08rem}.breadcrumbs{font-size:.8rem;color:#c5d3dc;margin-bottom:15px}.breadcrumbs a{color:#fff}.content{display:grid;grid-template-columns:minmax(0,1fr) 360px;gap:44px}.prose h2{margin-top:2.1rem;color:var(--navy)}.prose h3{margin-top:1.4rem}.prose p,.prose li{color:#3f4d5c}.sidebar{position:sticky;top:112px;height:max-content}.faq details{border:1px solid var(--line);border-radius:7px;padding:15px 17px;margin:11px 0;background:#fff}.faq summary{font-weight:900;cursor:pointer}.notice{background:#eef6ed;border-left:4px solid var(--green);padding:16px;border-radius:5px}.gallery{display:grid;grid-template-columns:repeat(3,1fr);gap:15px}.gallery img{aspect-ratio:3/2;object-fit:cover;border-radius:7px}.checklist{list-style:none;padding:0}.checklist li{padding-left:26px;position:relative;margin:8px 0}.checklist li:before{content:'✓';position:absolute;left:0;color:var(--green);font-weight:900}.cta-strip{padding:27px 0;background:var(--green);color:#fff}.cta-strip .wrap{display:flex;justify-content:space-between;align-items:center;gap:20px}.cta-strip h2{font-size:1.5rem;margin:0}.cta-strip .btn{background:var(--navy);color:#fff}.footer{background:#03172c;color:#c7d3dc;padding:52px 0 24px}.footer a{color:#e6edf2}.footer-grid{display:grid;grid-template-columns:1.45fr 1fr 1fr 1fr;gap:32px}.footer h3{color:#fff;text-transform:uppercase;font-size:1rem}.footer-bottom{border-top:1px solid #264058;margin-top:34px;padding-top:20px;font-size:.78rem;color:#9fb0bd}.legal-links{display:flex;gap:14px;flex-wrap:wrap}
.visualizer{display:grid;grid-template-columns:360px 1fr;gap:34px;align-items:center}.visualizer-controls{background:var(--soft);border:1px solid var(--line);padding:24px;border-radius:8px}.visualizer-controls input[type=range]{width:100%;margin:24px 0}.preset-row{display:flex;flex-wrap:wrap;gap:8px}.preset-row button{border:1px solid var(--line);background:#fff;border-radius:4px;padding:8px 12px;font-weight:800;cursor:pointer}.car-window-scene{position:relative;min-height:390px;border-radius:8px;overflow:hidden;background:url('images/img-auto-sedan.png') center/cover}.tint-window{position:absolute;left:20%;top:22%;width:50%;height:31%;clip-path:polygon(8% 45%,28% 9%,75% 8%,98% 43%,90% 94%,13% 94%);transition:.2s background}.window-label{position:absolute;right:16px;top:16px;background:#fff;padding:8px 12px;border-radius:4px;font-weight:900}.tool-form{border:1px solid var(--line);padding:24px;border-radius:8px;background:#fff}.option-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}.option-card{display:block;border:2px solid var(--line);padding:16px;border-radius:7px;cursor:pointer}.option-card:has(input:checked){border-color:var(--green);background:#f2faec}.option-card input{margin-right:7px}.result-box{display:none;margin-top:18px;padding:18px;background:#eff8eb;border-left:4px solid var(--green);border-radius:4px}.result-box.show{display:block}.meter-grid{display:grid;gap:14px}.meter-grid label{font-weight:800}.meter-grid meter{width:100%;height:24px}.stepper{display:flex;gap:8px;margin-bottom:20px}.stepper span{flex:1;height:7px;background:#dce4ea;border-radius:999px}.stepper span.active{background:var(--green)}
@media(max-width:1080px){.nav-links{gap:14px}.nav-links a{font-size:.75rem}.nav>.btn-dark{display:none}.hero .wrap{grid-template-columns:1fr 360px}.tool-grid{grid-template-columns:repeat(3,1fr)}}
@media(max-width:860px){.topbar{display:none}.nav{min-height:72px}.brand{min-width:0}.brand img{width:215px}.menu-btn{display:block;margin-left:auto;border:0;background:var(--soft);font-size:1.2rem;padding:9px 12px}.nav-links{display:none;position:absolute;left:0;right:0;top:72px;background:#fff;flex-direction:column;align-items:flex-start;padding:22px;box-shadow:0 12px 30px rgba(4,31,58,.15)}.nav-links.open{display:flex}.hero .wrap{grid-template-columns:1fr;padding:46px 0 135px}.hero-copy{padding-top:0}.form-card{margin:0}.service-deck{margin-top:-90px}.grid-4,.grid-3,.grid-2,.trust-grid,.footer-grid,.content,.local-panel{grid-template-columns:1fr 1fr}.tool-grid{grid-template-columns:repeat(2,1fr)}.sidebar{position:static}.mobile-call{display:flex;position:fixed;z-index:150;left:12px;right:12px;bottom:12px;background:var(--green);color:#fff;padding:14px;justify-content:center;border-radius:5px;font-weight:900;box-shadow:0 12px 28px rgba(0,0,0,.25)}.visualizer{grid-template-columns:1fr}}
@media(max-width:580px){.wrap{width:min(100% - 24px,1240px)}h1{font-size:2.65rem}.hero:before{background:linear-gradient(rgba(3,20,37,.8),rgba(3,20,37,.76)),url('images/img-shop-audi.png') center/cover}.hero .wrap{padding-bottom:130px}.grid-4,.grid-3,.grid-2,.trust-grid,.footer-grid,.content,.local-panel,.area-list,.option-grid{grid-template-columns:1fr}.service-deck{margin-top:-100px}.tool-grid{grid-template-columns:1fr 1fr}.section{padding:54px 0}.section-head,.band,.cta-strip .wrap{flex-direction:column;align-items:flex-start}.local-copy{padding:28px}.form-card{padding:22px 16px}.gallery{grid-template-columns:1fr}.car-window-scene{min-height:270px}}


/* ============================================================
   PHASE 1 — PREMIUM VISUAL SYSTEM
   Target: crisp editorial layout inspired by approved illustration
   ============================================================ */
:root{--navy:#061b33;--navy2:#0b2c50;--green:#3b8d2f;--green2:#66ad3d;--ink:#0b1d35;--muted:#5f6f7f;--soft:#f5f7f9;--line:#dbe2e8;--white:#fff;--shadow:0 24px 60px rgba(4,24,45,.16);--shadow-sm:0 10px 30px rgba(4,24,45,.10);--radius:14px}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;color:var(--ink);background:#fff;line-height:1.55;-webkit-font-smoothing:antialiased}h1,h2,h3,h4{font-family:Montserrat,Inter,ui-sans-serif,system-ui,sans-serif;letter-spacing:-.025em}h1{font-size:clamp(2.9rem,5vw,5.2rem);line-height:.94;font-weight:900}h2{font-size:clamp(2rem,3vw,3.15rem);line-height:1.05;font-weight:900}h3{font-weight:850}.wrap{width:min(100% - 48px,1280px);margin-inline:auto}
.topbar{background:#04172d;color:#fff;font-size:.8rem;border-bottom:1px solid rgba(255,255,255,.09)}.topbar .wrap{min-height:35px;display:flex;align-items:center;justify-content:space-between}.topbar a{color:#fff}.topbar span:first-child{color:#dfe9ef}.topbar span:first-child::first-letter{color:var(--green2)}
.site-header{position:sticky;top:0;z-index:110;background:rgba(255,255,255,.97);backdrop-filter:blur(18px);box-shadow:0 1px 0 rgba(4,31,58,.09)}.nav{min-height:98px;display:flex;align-items:center;gap:28px}.brand{display:flex;align-items:center;min-width:300px}.brand img{width:286px;height:auto;display:block}.nav-links{display:flex;align-items:center;justify-content:center;gap:25px;flex:1}.nav-links a{position:relative;color:var(--ink);font-size:.79rem;font-weight:850;text-transform:uppercase;letter-spacing:.02em;padding:39px 0}.nav-links a:after{content:"";position:absolute;left:0;right:100%;bottom:25px;height:3px;background:var(--green);transition:.22s}.nav-links a:hover:after{right:0}.btn{display:inline-flex;align-items:center;justify-content:center;gap:.55rem;border:0;border-radius:5px;padding:14px 22px;font-size:.8rem;font-weight:900;text-transform:uppercase;letter-spacing:.02em;transition:.22s transform,.22s box-shadow,.22s background}.btn:hover{transform:translateY(-2px);box-shadow:0 12px 25px rgba(4,31,58,.18)}.btn-primary{background:linear-gradient(180deg,#4d9d35,#327a29);color:#fff}.btn-outline{border:1px solid rgba(255,255,255,.7);color:#fff;background:rgba(4,27,51,.82)}
.hero{min-height:690px;background:var(--navy);position:relative;overflow:hidden}.hero:before{background:linear-gradient(90deg,rgba(3,19,36,.92) 0%,rgba(3,19,36,.66) 38%,rgba(3,19,36,.14) 72%),url('images/phase2/hero-home.webp') 54% 52%/cover no-repeat}.hero:after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,transparent 65%,rgba(3,20,37,.54));pointer-events:none}.hero .wrap{z-index:2;grid-template-columns:minmax(0,1.45fr) minmax(365px,.58fr);gap:40px;min-height:690px;padding:56px 0 150px}.hero-copy{max-width:720px;padding-top:44px}.hero h1{text-transform:uppercase;color:#fff;max-width:760px;text-shadow:0 3px 22px rgba(0,0,0,.3)}.hero p{font-size:1.18rem;line-height:1.65;max-width:580px}.eyebrow{color:#9bd06e;font-size:.76rem;letter-spacing:.16em}.hero-actions{margin:30px 0 19px}.trust-row{font-size:.78rem;gap:18px;color:#edf3f6}.trust-row span:before{color:var(--green2)}
.form-card{margin-top:-16px;padding:27px 22px 23px;background:linear-gradient(180deg,#071f3a,#04182e);border-radius:9px;border-top:4px solid var(--green2);box-shadow:0 28px 70px rgba(0,0,0,.34)}.form-card h2{font-size:1.55rem;letter-spacing:-.01em}.form-card .field input,.form-card .field select,.form-card .field textarea{border:1px solid #c7d1dc;border-radius:4px;min-height:45px}.form-card .btn{min-height:48px}.form-card textarea{min-height:72px}
.service-deck{margin-top:-118px}.service-deck .grid-4{gap:18px}.service-deck .card{border:1px solid rgba(9,34,59,.12);border-radius:10px;box-shadow:0 18px 40px rgba(4,31,58,.17);overflow:hidden}.service-deck .card img{aspect-ratio:1.52/1;object-fit:cover}.service-deck .card-body{padding:19px 18px 20px}.service-deck h3{text-transform:uppercase;font-size:1.03rem}.service-deck .card p{font-size:.86rem;min-height:67px}.service-deck .card strong{font-size:.73rem;letter-spacing:.04em}.service-deck .card:hover{transform:translateY(-7px)}
.trust-band{padding:23px 0;background:linear-gradient(90deg,#061b33,#0a2b4e)}.trust-grid{gap:32px}.trust-item{padding:0 8px}.trust-icon{width:48px;height:48px;background:rgba(255,255,255,.03);border-color:#8ed15d}.trust-item b{font-size:.76rem;letter-spacing:.04em}.trust-item span{font-size:.75rem;line-height:1.35}
.section{padding:84px 0}.section.alt{background:#f4f6f8}.section-head{margin-bottom:34px}.section-head h2{text-transform:uppercase}.section-head p{font-size:1rem}.tool-grid{grid-template-columns:repeat(6,1fr);gap:14px}.tool-card{min-height:226px;display:flex;flex-direction:column;align-items:center;border-radius:10px;padding:26px 15px 19px;box-shadow:0 7px 22px rgba(4,31,58,.05);transition:.22s}.tool-card:hover{transform:translateY(-5px);border-color:#91bd73;box-shadow:var(--shadow-sm)}.tool-card .tool-icon{font-size:2.15rem;color:var(--navy)}.tool-card h3{text-transform:uppercase;font-size:.88rem}.tool-card p{font-size:.77rem;line-height:1.45;min-height:67px}.tool-card a{margin-top:auto;font-size:.7rem}
.local-panel{border-radius:13px;box-shadow:var(--shadow);grid-template-columns:1.08fr .92fr}.local-panel img{min-height:405px}.local-copy{padding:55px}.local-copy h2{text-transform:uppercase;color:#fff}.area-link{border-radius:6px;box-shadow:0 5px 16px rgba(0,0,0,.08);font-size:.84rem}.band{border-radius:13px;box-shadow:var(--shadow-sm)}
.page-hero{position:relative;overflow:hidden;background:linear-gradient(95deg,rgba(4,25,47,.97),rgba(7,38,69,.82)),var(--page-hero,url('images/phase2/hero-specialty.webp')) center/cover no-repeat;padding:88px 0}.page-hero:after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(3,20,37,.75),transparent 70%)}.page-hero .wrap{position:relative;z-index:2}.page-hero h1{text-transform:uppercase;font-size:clamp(2.7rem,5vw,4.7rem);max-width:950px}.page-hero p{font-size:1.12rem;line-height:1.7}.content{gap:56px}.prose{font-size:1.02rem}.prose>p:first-of-type{font-size:1.12rem;color:#263a4e}.sidebar .form-card{margin-top:0}.card{border-radius:11px}.card img{object-fit:cover}.gallery{gap:18px}.gallery img{border-radius:10px;box-shadow:0 10px 28px rgba(4,31,58,.12)}
.footer{background:linear-gradient(160deg,#03172c,#061e38);padding-top:62px}.footer-grid{gap:42px}.footer h3{font-size:.84rem;letter-spacing:.08em}.footer a{font-size:.86rem}.footer-bottom{font-size:.74rem}
@media(max-width:1150px){.nav{gap:18px}.brand{min-width:250px}.brand img{width:245px}.nav-links{gap:17px}.nav-links a{font-size:.72rem}.hero .wrap{grid-template-columns:1fr 355px}.tool-grid{grid-template-columns:repeat(3,1fr)}}
@media(max-width:860px){.wrap{width:min(100% - 32px,1280px)}.nav{min-height:76px}.brand img{width:224px}.nav-links{top:76px}.hero{min-height:auto}.hero .wrap{padding:42px 0 150px;grid-template-columns:1fr}.hero-copy{padding-top:10px}.hero h1{font-size:clamp(2.7rem,12vw,4.6rem)}.hero:before{background:linear-gradient(rgba(3,20,37,.70),rgba(3,20,37,.76)),url('images/phase2/hero-home.webp') 62% center/cover}.form-card{margin-top:0}.service-deck{margin-top:-110px}.grid-4,.grid-3,.grid-2,.trust-grid,.footer-grid,.content,.local-panel{grid-template-columns:1fr 1fr}.tool-grid{grid-template-columns:repeat(2,1fr)}.page-hero{padding:68px 0}.page-hero h1{font-size:clamp(2.5rem,8vw,4rem)}}
@media(max-width:580px){.wrap{width:min(100% - 24px,1280px)}.topbar{display:none}.brand img{width:205px}.hero .wrap{padding:36px 0 132px}.hero-copy{padding-top:0}.hero p{font-size:1rem}.hero-actions{display:grid;grid-template-columns:1fr}.hero-actions .btn{width:100%}.trust-row{display:grid;gap:7px}.service-deck{margin-top:-92px}.grid-4,.grid-3,.grid-2,.trust-grid,.footer-grid,.content,.local-panel,.area-list,.option-grid{grid-template-columns:1fr}.tool-grid{grid-template-columns:1fr 1fr;gap:10px}.tool-card{min-height:210px;padding:20px 11px}.section{padding:58px 0}.section-head h2{font-size:2rem}.local-copy{padding:30px 24px}.local-panel img{min-height:260px}.page-hero{padding:56px 0}.page-hero h1{font-size:2.55rem}.form-card{padding:21px 15px}.footer{padding-bottom:86px}}

/* ============================================================
   PHASE 4 — UX, ACCESSIBILITY, FORMS & INTERACTION HARDENING
   ============================================================ */
.skip-link{position:fixed;z-index:1000;top:10px;left:10px;padding:11px 16px;background:#fff;color:var(--navy);border:2px solid var(--green);border-radius:5px;font-weight:900;transform:translateY(-160%);transition:transform .18s ease;box-shadow:var(--shadow-sm)}
.skip-link:focus{transform:translateY(0)}
main:focus{outline:none}
:where(a,button,input,select,textarea,summary,[tabindex]):focus-visible{outline:3px solid #93cf63;outline-offset:3px}
.nav-links a[aria-current="page"]{color:var(--green)}
.nav-links a[aria-current="page"]:after{right:0}
.menu-btn{min-width:46px;min-height:46px;border:1px solid var(--line);border-radius:5px;color:var(--navy);background:#fff;cursor:pointer}

/* Forms remain native POST forms; this layer only improves clarity and validation. */
.form-card .field>label,.form-card .field>label.tool-label{position:static;left:auto;width:auto;height:auto;overflow:visible;clip:auto;white-space:normal;color:#f4f8fb;font-size:.76rem;line-height:1.3;margin-bottom:1px}
.form-card .photo-consent>label{position:static;left:auto;color:#d8e4eb;line-height:1.4}
.form-card input::placeholder,.form-card textarea::placeholder{color:#728195;opacity:1}
.field input,.field select,.field textarea{transition:border-color .18s ease,box-shadow .18s ease,background .18s ease}
.field input:focus,.field select:focus,.field textarea:focus{border-color:var(--green);box-shadow:0 0 0 3px rgba(84,151,54,.18)}
.field.has-error input,.field.has-error select,.field.has-error textarea,[aria-invalid="true"]{border-color:#b42318!important;box-shadow:0 0 0 3px rgba(180,35,24,.13)!important}
.file-status{display:block;min-height:1.2em;margin-top:4px}
.file-status.error,.form-status.error{color:#ffd3cf}
.form-status{min-height:1.35em;margin-top:11px;font-size:.8rem;font-weight:750}
.tool-form .form-status,.section:not(.hero) form:not(.form-card) .form-status{color:var(--muted)}
.tool-form .form-status.error,.section:not(.hero) form:not(.form-card) .form-status.error{color:#9f1c13}
form[aria-busy="true"]{cursor:progress}
form[aria-busy="true"] [type="submit"]{opacity:.72;cursor:wait}
input[type="file"]{padding:8px;background:#fff}
.photo-consent{min-height:35px;align-items:flex-start}
.photo-consent input{flex:0 0 auto;width:18px!important;height:18px;min-height:18px!important;margin-top:1px}

/* Customer tools */
.tool-panel{max-width:920px;margin:0 auto 34px;padding:clamp(22px,4vw,38px);background:#fff;border:1px solid var(--line);border-radius:14px;box-shadow:var(--shadow-sm)}
.tool-panel h2{font-size:clamp(1.25rem,2vw,1.65rem);margin-top:0}
.tool-label{display:block;margin:0 0 7px;color:var(--ink);font-size:.82rem;font-weight:850}
.choice-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px;margin:13px 0 26px}
.choice{position:relative;display:flex;align-items:center;min-height:58px;padding:14px;border:2px solid var(--line);border-radius:8px;background:#fff;cursor:pointer;font-weight:850;transition:border-color .18s ease,background .18s ease,transform .18s ease}
.choice input{width:18px;height:18px;margin:0 9px 0 0;accent-color:var(--green)}
.choice:hover,.choice.selected,.choice:has(input:checked){border-color:var(--green);background:#f2f8ee}
.choice:focus-within{outline:3px solid rgba(103,173,47,.28);outline-offset:2px}
.progress{height:8px;margin-bottom:28px;overflow:hidden;border-radius:999px;background:#e6ebef}
.progress span{display:block;width:34%;height:100%;border-radius:inherit;background:linear-gradient(90deg,var(--green),var(--green2));transition:width .25s ease}
.result-card,.result-box{display:none;margin-top:22px;padding:20px 22px;border-left:5px solid var(--green);border-radius:7px;background:#eff7eb;color:var(--ink)}
.result-card.show,.result-box.show{display:block}
.result-card:focus,.result-box:focus{outline:3px solid rgba(103,173,47,.35);outline-offset:3px}
.result-card h3,.result-box h3{color:var(--navy)}
.preset-row button.active{border-color:var(--green);background:var(--green);color:#fff}
.preset-row button{min-width:50px;min-height:42px}

/* Mobile navigation behaves like a controlled panel rather than a loose dropdown. */
@media(max-width:860px){
  body.nav-open{overflow:hidden}
  .site-header .nav{position:relative}
  .menu-btn{display:inline-grid;place-items:center;margin-left:auto;font-size:1.25rem}
  .nav>.btn{display:none}
  .nav-links{display:flex;visibility:hidden;opacity:0;pointer-events:none;position:fixed;z-index:140;inset:111px 0 auto 0;max-height:calc(100dvh - 111px);overflow:auto;transform:translateY(-12px);flex-direction:column;align-items:stretch;gap:0;padding:12px 20px 26px;background:#fff;border-top:1px solid var(--line);box-shadow:0 22px 44px rgba(4,31,58,.2);transition:opacity .18s ease,transform .18s ease,visibility .18s}
  .nav-links.open{visibility:visible;opacity:1;pointer-events:auto;transform:translateY(0)}
  .nav-links a{display:flex;align-items:center;min-height:48px;padding:10px 4px;border-bottom:1px solid #edf1f4;font-size:.82rem}
  .nav-links a:after{display:none}
  .choice-grid{grid-template-columns:1fr 1fr}
  .mobile-call{bottom:max(12px,env(safe-area-inset-bottom));min-height:50px}
}
@media(max-width:580px){
  .nav-links{inset:76px 0 auto 0;max-height:calc(100dvh - 76px)}
  .choice-grid{grid-template-columns:1fr}
  .tool-panel{padding:20px 16px}
  .form-card .field>label{font-size:.74rem}
}
@media(hover:none){.card:hover,.tool-card:hover,.btn:hover{transform:none}}
@media(prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  *,*:before,*:after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important;scroll-behavior:auto!important}
}


/* Phase 6–7: functionality and final polish */
:root{
  --focus-ring:0 0 0 4px rgba(103,173,47,.28);
  --shadow-soft:0 10px 30px rgba(4,31,58,.10);
  --shadow-lift:0 20px 52px rgba(4,31,58,.17);
}
html{scroll-padding-top:112px}
body{-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}
body.nav-open{overflow:hidden}
main{min-height:52vh}
h2,h3,[id]{scroll-margin-top:118px}
a,button,input,select,textarea{touch-action:manipulation}
button,.btn,.nav-links a,.area-link,.tool-card,.card{transition:transform .18s ease,box-shadow .18s ease,border-color .18s ease,background-color .18s ease,color .18s ease,opacity .18s ease}
.nav-links a[aria-current="page"]{color:var(--green);position:relative}
.nav-links a[aria-current="page"]:after{content:"";position:absolute;left:0;right:0;bottom:-11px;height:3px;border-radius:99px;background:var(--green)}
.card,.tool-card,.form-card,.sidebar{isolation:isolate}
.card{height:100%}.card-body{height:100%;display:flex;flex-direction:column}.card-body>a:last-child{margin-top:auto}
.field{display:flex;flex-direction:column;gap:5px;min-width:0}
.field>label{font-weight:800}
.field input,.field select,.field textarea{width:100%}
.field textarea{resize:vertical}
.field.has-error input,.field.has-error select,.field.has-error textarea,[aria-invalid="true"]{border-color:#b42318!important;box-shadow:0 0 0 3px rgba(180,35,24,.12)!important}
.form-status{min-height:1.4em;margin-top:10px;font-weight:800}
.file-status{display:block;min-height:1.2em;margin-top:5px}
.file-status.error,.form-status.error{color:#b42318}
.form-status.success{color:#267227}
.photo-consent{display:grid!important;grid-template-columns:auto 1fr!important;align-items:start;gap:9px!important}
.photo-consent input{width:auto!important;margin-top:4px}
.photo-consent label{font-weight:600!important}
.result-box[hidden],.result-card[hidden]{display:none!important}
.result-box.show,.result-card.show{display:block!important}
.preset-row button.active{background:var(--navy);color:#fff;border-color:var(--navy);box-shadow:var(--focus-ring)}
input[type="range"]{accent-color:var(--green)}
input[type="checkbox"],input[type="radio"]{accent-color:var(--green)}
.menu-btn{border-radius:6px;min-width:44px;min-height:44px}
.mobile-call{padding-bottom:max(14px,env(safe-area-inset-bottom))}
@media(hover:hover){
  .btn:hover{transform:translateY(-2px);box-shadow:var(--shadow-soft)}
  .card:hover,.tool-card:hover{box-shadow:var(--shadow-lift)}
}
@media(max-width:860px){
  .nav-links.open{max-height:calc(100vh - 76px);overflow:auto;overscroll-behavior:contain}
  .nav-links a{width:100%;padding:10px 4px}
  .nav-links a[aria-current="page"]:after{bottom:2px;right:auto;width:42px}
  input,select,textarea{font-size:16px}
}
@media(max-width:580px){
  .tool-grid{grid-template-columns:1fr}
  .tool-card{min-height:auto;align-items:flex-start;text-align:left}
  .tool-card p{min-height:0}
  .preset-row{display:grid;grid-template-columns:repeat(4,1fr)}
  .preset-row button{min-width:0;padding:10px 6px}
}
@media(prefers-contrast:more){
  :root{--line:#73808c}
  .btn-outline,.card,.tool-card,.form-card,input,select,textarea{border-width:2px}
}
@media(prefers-reduced-motion:reduce){
  *,*:before,*:after{scroll-behavior:auto!important;transition:none!important;animation:none!important}
}
@media print{
  .topbar,.site-header,.mobile-call,.menu-btn,.cta-strip,.form-card,.footer{display:none!important}
  body{color:#000;background:#fff}
  main,.section,.page-hero{padding:0!important;background:#fff!important;color:#000!important}
  a{text-decoration:underline}
}

/* Phase 6 visualizer repair: restore the stable, responsive CSS illustration. */
.car-window-scene{
  position:relative;
  min-height:390px;
  border-radius:12px;
  overflow:hidden;
  background:linear-gradient(#8ed0ff 0 46%,#d9d7cf 46% 100%);
  box-shadow:var(--shadow-soft);
}
.car-window-scene .sky:before{
  content:"";
  position:absolute;
  inset:25px 8% auto;
  height:110px;
  background:linear-gradient(90deg,#d8e9f2,#f8fbfd);
  clip-path:polygon(0 100%,13% 20%,25% 100%,40% 5%,56% 100%,73% 28%,100% 100%);
}
.car-body{
  position:absolute;
  left:8%;
  right:8%;
  bottom:28px;
  height:225px;
  background:linear-gradient(160deg,#dce2e8,#748393);
  border-radius:44% 35% 18% 18%/48% 45% 22% 22%;
  box-shadow:inset 0 -28px 0 #1d2b38;
}
.car-body:before,.car-body:after{
  content:"";
  position:absolute;
  bottom:-17px;
  width:72px;
  height:72px;
  border-radius:50%;
  background:#101820;
  border:12px solid #52606c;
}
.car-body:before{left:13%}
.car-body:after{right:13%}
.car-body .window{
  position:absolute;
  left:25%;
  right:25%;
  top:28px;
  height:92px;
  background:rgba(4,18,30,.65);
  clip-path:polygon(12% 0,88% 0,100% 100%,0 100%);
  display:grid;
  place-items:center;
  color:#fff;
  font-weight:900;
  text-shadow:0 1px 2px rgba(0,0,0,.4);
  transition:background .2s ease;
}
@media(max-width:580px){
  .car-window-scene{min-height:300px}
  .car-body{left:4%;right:4%;height:185px}
  .car-body:before,.car-body:after{width:58px;height:58px;border-width:10px}
  .car-body .window{top:24px;height:76px}
}