:root{
  --black:#070809;--black2:#0d0f10;--graphite:#111315;--graphite2:#1c1f22;--steel:#5f646a;
  --white:#fff;--smoke:#f3f3f3;--yellow:#f5b800;--yellow2:#ffc400;--gold:#b88200;
  --line:rgba(255,255,255,.16);--shell:1260px;--wide:1440px;
}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;font-family:Inter,Arial,sans-serif;background:var(--black);color:#fff;line-height:1.45;-webkit-font-smoothing:antialiased}img{display:block;max-width:100%}a{color:inherit;text-decoration:none}button,input,select,textarea{font:inherit}.svg-sprite{position:absolute;width:0;height:0;overflow:hidden}.shell{width:min(var(--shell),calc(100% - 40px));margin:auto}.shell-wide{width:min(var(--wide),calc(100% - 38px));margin:auto}svg{width:1em;height:1em;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}

.topbar{height:34px;background:#050606;border-bottom:1px solid rgba(255,255,255,.12);font-size:12px}.topbar-inner{height:100%;display:grid;grid-template-columns:1fr 1fr 1fr auto;align-items:center;gap:18px}.topbar-inner span,.topbar-inner>a:not(.topbar-cta){display:flex;align-items:center;gap:7px;white-space:nowrap}.topbar-inner svg{color:#cfd2d4}.topbar-center{justify-self:center}.topbar-inner>a:nth-child(3){justify-self:end}.topbar-cta{background:var(--yellow2);color:#070809;font-weight:800;padding:5px 24px;border-radius:3px}
.site-header{position:absolute;top:0;left:0;width:100%;z-index:40}.navbar{height:84px;background:rgba(7,8,9,.95);border-bottom:1px solid rgba(255,255,255,.12);backdrop-filter:blur(10px);transition:.25s}.navbar.stuck{position:fixed;top:0;left:0;width:100%;box-shadow:0 12px 40px rgba(0,0,0,.32)}.nav-inner{height:100%;display:flex;align-items:center;gap:28px}.brand{width:238px;min-width:238px;display:flex;align-items:center;justify-content:flex-start;position:relative;padding-right:24px}.brand::after{content:"";position:absolute;right:0;top:50%;width:1px;height:34px;background:linear-gradient(180deg,transparent,rgba(245,184,0,.72),transparent);transform:translateY(-50%)}.brand img{width:100%;height:auto;max-height:58px;object-fit:contain;object-position:left center;filter:drop-shadow(0 4px 12px rgba(0,0,0,.28));transition:transform .2s ease}.brand:hover img{transform:scale(1.025)}.nav-links{display:flex;align-items:stretch;height:100%;gap:34px;margin-left:auto}.nav-links a{font-size:13px;font-weight:700;display:flex;align-items:center;position:relative;color:#eceff0}.nav-links a::after{content:"";position:absolute;left:0;right:0;bottom:15px;height:2px;background:var(--yellow);transform:scaleX(0);transition:.2s}.nav-links a:hover::after,.nav-links a.active::after{transform:scaleX(1)}.nav-cta{margin-left:8px;white-space:nowrap}.menu-btn{display:none;background:none;border:0;color:#fff;font-size:28px;padding:7px}

.btn{min-height:44px;display:inline-flex;align-items:center;justify-content:center;padding:11px 22px;border:1px solid transparent;font-weight:800;font-size:13px;letter-spacing:.01em;border-radius:3px;transition:.2s;cursor:pointer}.btn-yellow{background:var(--yellow2);color:#090a0b;box-shadow:0 8px 22px rgba(245,184,0,.12)}.btn-yellow:hover{background:#ffd028;transform:translateY(-1px)}.btn-outline{border-color:rgba(255,255,255,.52);background:rgba(0,0,0,.22);color:#fff}.btn-outline:hover{border-color:var(--yellow);color:var(--yellow)}

.hero{height:690px;position:relative;overflow:hidden;background:#101214}.hero-media,.hero-media img,.hero-shade{position:absolute;inset:0;width:100%;height:100%}.hero-media img{object-fit:cover;object-position:center 48%}.hero-shade{background:linear-gradient(90deg,rgba(0,0,0,.93) 0%,rgba(0,0,0,.74) 31%,rgba(0,0,0,.15) 62%,rgba(0,0,0,.03) 100%),linear-gradient(0deg,rgba(0,0,0,.48),transparent 46%)}.hero-inner{height:100%;display:flex;align-items:center;padding-top:118px;position:relative;z-index:2}.hero-copy{max-width:610px}.eyebrow{font-family:"Barlow Condensed",sans-serif;color:var(--yellow2);font-weight:800;letter-spacing:.08em;font-size:18px;margin:0 0 6px}.hero h1{font-family:"Barlow Condensed",sans-serif;font-style:italic;font-size:78px;line-height:.9;margin:0 0 10px;font-weight:900;letter-spacing:-.025em}.hero h1 span{color:var(--yellow2)}.hero-slogan{font-size:24px;font-weight:800;margin:0 0 13px}.hero-text{font-size:17px;max-width:560px;color:#eef0f1;margin:0 0 24px}.hero-actions{display:flex;gap:12px;flex-wrap:wrap}.hero-meta{display:flex;gap:32px;margin-top:21px;font-size:13px;color:#e3e5e6}.hero-meta span{display:flex;align-items:center;gap:7px}.hero-meta svg{color:#fff}

.intro{background:var(--smoke);color:#121415}.intro-grid{display:grid;grid-template-columns:32% 23% 45%;min-height:190px}.intro-copy{padding:30px 48px 28px max(40px,calc((100vw - var(--wide))/2 + 38px))}.mini-line{display:block;width:34px;height:3px;background:var(--yellow);margin-bottom:10px}.intro-copy h2,.focus-panel h2,.works h2,.process h2,.why h2,.quote-card h2,.location-card h2,.faq h2,.final-cta h2{font-family:"Barlow Condensed",sans-serif;font-weight:800;line-height:.95;letter-spacing:-.012em}.intro-copy h2{font-size:37px;margin:0 0 12px}.intro-copy p{font-size:13px;max-width:390px;margin:0;color:#45494d}.intro-photo{clip-path:polygon(12% 0,100% 0,88% 100%,0 100%);overflow:hidden}.intro-photo img{width:100%;height:100%;object-fit:cover}.intro-pillars{background:var(--black2);display:grid;grid-template-columns:repeat(4,1fr);color:#fff}.intro-pillars article{padding:27px 18px;border-left:1px solid var(--line);display:flex;flex-direction:column;align-items:center;text-align:center;justify-content:center}.intro-pillars svg{font-size:31px;color:var(--yellow2);margin-bottom:7px}.intro-pillars strong{font-family:"Barlow Condensed",sans-serif;font-size:18px;color:var(--yellow2)}.intro-pillars span{font-size:11px;color:#d6d8d9;max-width:140px;margin-top:4px}

.services{background:#0c0e0f}.service-mosaic{display:grid;grid-template-columns:repeat(3,1fr);grid-auto-rows:230px;border:1px solid #2f3438}.service-card{position:relative;overflow:hidden;border-right:1px solid rgba(245,184,0,.72);border-bottom:1px solid rgba(255,255,255,.28);background-image:linear-gradient(90deg,rgba(6,7,7,.9),rgba(6,7,7,.28)),var(--bg);background-size:cover;background-position:center}.service-card:nth-child(3n){border-right:0}.service-card:nth-child(n+4){border-bottom:0}.service-card::after{content:"";position:absolute;inset:0;background:linear-gradient(0deg,rgba(0,0,0,.74),rgba(0,0,0,.05));pointer-events:none}.service-card>div{position:absolute;z-index:2;left:46%;top:50%;transform:translateY(-50%);padding:20px;max-width:52%}.service-card h3{font-family:"Barlow Condensed";font-size:30px;line-height:.9;margin:0 0 11px}.service-card ul{margin:0;padding:0;list-style:none;font-size:13px}.service-card li::before{content:"•";color:var(--yellow2);margin-right:7px}.service-card:nth-child(odd){background-position:center}.service-card:hover{filter:brightness(1.08)}

.service-focus{display:grid;grid-template-columns:1fr 1fr 1fr;min-height:410px}.focus-panel{position:relative;padding:34px 45px;overflow:hidden}.focus-light{background:#f4f4f2;color:#111315}.focus-panel h2{font-size:38px;margin:0 0 20px}.check-grid{display:grid;grid-template-columns:1fr 1fr;gap:11px 26px;margin-bottom:24px;font-size:13px}.check-grid span{white-space:nowrap}.focus-diagnostic{background:#080a0b}.focus-bg{position:absolute;inset:0;background-size:cover;background-position:center;opacity:.34}.focus-diagnostic::after{content:"";position:absolute;inset:0;background:linear-gradient(0deg,#070809 4%,rgba(7,8,9,.26) 78%)}.focus-content{position:relative;z-index:2}.focus-content p{font-size:13px;color:#d2d5d7;max-width:520px}.focus-icons{display:flex;gap:18px;padding:18px 0;margin:8px 0 3px;border-top:1px solid var(--line);border-bottom:1px solid var(--line);font-size:11px}.focus-icons span{display:flex;align-items:center;gap:6px}.focus-icons svg{font-size:21px}.comparison{--compare-position:52%;height:260px;position:relative;overflow:hidden;background:#111;margin:10px 0 10px;border:1px solid rgba(17,19,21,.14);box-shadow:0 18px 40px rgba(0,0,0,.14);isolation:isolate;user-select:none;touch-action:pan-y}.compare-base,.compare-overlay{position:absolute;inset:0}.compare-base img,.compare-overlay img{display:block;width:100%;height:100%;object-fit:cover;object-position:center}.compare-base::after,.compare-overlay::after{content:"";position:absolute;inset:0;pointer-events:none;background:linear-gradient(180deg,rgba(0,0,0,.06),rgba(0,0,0,.02) 58%,rgba(0,0,0,.2))}.compare-overlay{clip-path:inset(0 calc(100% - var(--compare-position)) 0 0);will-change:clip-path;z-index:2}.compare-label{position:absolute;top:14px;z-index:4;padding:7px 12px;font-size:11px;line-height:1;letter-spacing:.08em;font-weight:800;color:#fff;background:rgba(7,8,9,.88);border:1px solid rgba(255,255,255,.18);box-shadow:0 5px 16px rgba(0,0,0,.18)}.compare-label-before{left:14px}.compare-label-after{right:14px;background:var(--yellow);color:#090a0b;border-color:rgba(0,0,0,.12)}.compare-divider{position:absolute;z-index:5;top:0;bottom:0;left:var(--compare-position);width:3px;background:var(--yellow);transform:translateX(-1.5px);box-shadow:0 0 0 1px rgba(0,0,0,.08),0 0 16px rgba(245,184,0,.28);pointer-events:none}.comparison input{position:absolute;inset:0;z-index:7;width:100%;height:100%;margin:0;opacity:0;cursor:ew-resize;touch-action:pan-y}.compare-handle{position:absolute;left:var(--compare-position);top:50%;transform:translate(-50%,-50%);z-index:6;width:42px;height:42px;border-radius:50%;background:#070809;color:#fff;border:2px solid var(--yellow);display:flex;align-items:center;justify-content:center;gap:4px;font-size:17px;font-weight:800;line-height:1;box-shadow:0 8px 24px rgba(0,0,0,.3);pointer-events:none}.compare-handle span{display:block;transform:translateY(-1px)}.reference-note{font-size:11px;line-height:1.5;color:#5f646a;margin:0 0 12px}.plain-list{display:flex;flex-wrap:wrap;gap:5px 18px;margin:0 0 15px;padding:0;list-style:none;font-size:12px}.plain-list li::before{content:"•";color:#111;margin-right:6px}

.works{background:#07090a;padding:20px 0 12px;border-top:1px solid #282d30}.works-head{display:flex;align-items:flex-end;gap:24px;justify-content:space-between}.works h2{font-size:37px;margin:0}.filters{display:flex;gap:7px;flex-wrap:wrap}.filter{background:#131619;border:1px solid #444a4f;color:#fff;padding:6px 13px;border-radius:4px;font-size:11px;font-weight:700;cursor:pointer}.filter.active,.filter:hover{background:var(--yellow2);color:#08090a;border-color:var(--yellow2)}.works-grid{display:grid;grid-template-columns:repeat(6,1fr);gap:6px;margin-top:15px}.work-item{border:1px solid #3d4347;background:#121416;padding:0;color:#fff;text-align:left;cursor:pointer;overflow:hidden}.work-item img{width:100%;height:123px;object-fit:cover;transition:.25s}.work-item:hover img{transform:scale(1.04)}.work-item span{display:block;padding:8px 9px}.work-item strong{display:block;font-size:11px}.work-item small{color:#aeb2b4;font-size:9px}.work-item.hidden{display:none}.instagram-more{margin:12px 0 0 auto;width:max-content;display:flex;align-items:center;gap:7px;padding:9px 15px;border:1px solid var(--yellow);font-size:11px;border-radius:3px}.instagram-more svg{font-size:17px}

.process-contact{background:linear-gradient(180deg,#0c0f10,#0a0c0d);border-top:1px solid #353a3e}.process-layout{display:grid;grid-template-columns:minmax(0,1fr) 500px;gap:28px;padding:30px 0}.process{padding:0}.process>h2{font-size:31px;margin:0 0 17px}.steps{display:grid;grid-template-columns:repeat(6,1fr);border-bottom:1px solid #2c3135;padding-bottom:21px}.steps article{padding:0 14px 0 0;position:relative}.steps article:not(:last-child)::after{content:"›";position:absolute;right:7px;top:23px;color:#fff;font-size:25px}.steps b{font-family:"Barlow Condensed";font-size:30px;color:var(--yellow2);margin-right:8px}.steps svg{font-size:24px;vertical-align:middle}.steps h3{font-size:12px;margin:8px 0 4px}.steps p{font-size:9px;color:#b9bdc0;margin:0;line-height:1.4}.why{display:grid;grid-template-columns:1.1fr repeat(5,1fr);padding-top:25px}.why-title h2{font-size:34px;margin:0}.why article{border-left:1px solid #2f3438;padding:0 16px;text-align:center}.why article svg{font-size:28px;margin-bottom:7px}.why article h3{font-family:"Barlow Condensed";font-size:18px;line-height:.95;color:var(--yellow2);margin:0 0 5px}.why article p{font-size:9px;color:#c8cbcd;margin:0}

.quote-card{position:relative;background:linear-gradient(180deg,#15191b 0%,#0f1214 100%);border:1px solid #3d4449;border-top:3px solid var(--yellow2);padding:25px 26px 22px;align-self:start;box-shadow:0 22px 60px rgba(0,0,0,.28);overflow:hidden}.quote-card::before{content:"";position:absolute;width:180px;height:180px;right:-95px;top:-95px;border:1px solid rgba(255,196,0,.13);transform:rotate(45deg)}.quote-card::after{content:"";position:absolute;width:85px;height:2px;right:24px;top:18px;background:linear-gradient(90deg,transparent,var(--yellow2));opacity:.5}.quote-topline{display:flex;justify-content:space-between;align-items:center;gap:15px;margin-bottom:10px;position:relative;z-index:1}.quote-kicker{font-size:10px;letter-spacing:.14em;font-weight:800;color:var(--yellow2)}.quote-status{display:inline-flex;align-items:center;gap:6px;font-size:9px;color:#cfd3d5}.quote-status i{width:7px;height:7px;border-radius:50%;background:#25d366;box-shadow:0 0 0 4px rgba(37,211,102,.10)}.quote-card h2{font-size:37px;margin:0 0 7px;position:relative;z-index:1}.quote-lead{font-size:11px;line-height:1.55;color:#aeb4b8;margin:0 0 18px;max-width:420px}.quote-steps{display:grid;grid-template-columns:repeat(3,1fr);border:1px solid #2d3438;background:#0b0e10;margin-bottom:20px}.quote-steps span{display:flex;align-items:center;gap:7px;padding:9px 10px;font-size:9px;color:#b8bdc0;border-right:1px solid #2d3438}.quote-steps span:last-child{border-right:0}.quote-steps b{font-family:"Barlow Condensed";font-size:16px;color:var(--yellow2)}

#whatsappForm{position:relative;z-index:1}.form-section{margin:0 0 17px;padding:0;border:0}.form-section legend{width:100%;display:flex;align-items:center;gap:8px;padding:0 0 9px;margin:0 0 10px;border-bottom:1px solid #2b3135;font-size:10px;font-weight:800;text-transform:uppercase;letter-spacing:.07em;color:#eef0f1}.form-section legend span{display:grid;place-items:center;width:23px;height:23px;background:rgba(255,196,0,.1);border:1px solid rgba(255,196,0,.35);font-family:"Barlow Condensed";font-size:14px;color:var(--yellow2)}.form-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px 11px}.form-grid label{display:block;font-size:10px;color:#d5d7d8}.field-wide{grid-column:1/-1}.field-label{display:flex;align-items:center;gap:3px;margin-bottom:5px;font-size:9px;font-weight:700;color:#cbd0d2}.field-label em{font-style:normal;color:var(--yellow2)}.form-grid input,.form-grid select,.form-grid textarea{display:block;width:100%;margin:0;background:#f5f5f4;color:#121416;border:1px solid #c6c9ca;border-radius:2px;padding:11px 11px;outline:none;transition:border-color .18s,box-shadow .18s,background .18s}.form-grid input::placeholder,.form-grid textarea::placeholder{color:#8b9093}.form-grid input:focus,.form-grid select:focus,.form-grid textarea:focus{background:#fff;border-color:var(--yellow2);box-shadow:0 0 0 3px rgba(255,196,0,.13)}.form-grid textarea{resize:vertical;min-height:112px;line-height:1.45}.description{grid-row:auto}.textarea-meta{display:flex;justify-content:space-between;gap:12px;margin-top:5px;color:#747b7f}.textarea-meta small{font-size:8px}.textarea-meta small:last-child{white-space:nowrap}

.quote-summary{display:grid;grid-template-columns:34px 1fr;gap:10px;align-items:center;background:#0a0d0e;border:1px solid #30363a;border-left:3px solid var(--yellow2);padding:11px 12px;margin:4px 0 12px}.quote-summary-icon{width:30px;height:30px;display:grid;place-items:center;background:#171b1d;color:var(--yellow2);font-size:17px}.quote-summary strong{display:block;font-size:10px;color:#f2f3f3;margin-bottom:2px}.quote-summary span{display:block;font-size:8.5px;color:#92999d;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.form-submit{width:100%;min-height:50px;margin-top:0;gap:8px;font-size:13px;box-shadow:0 12px 30px rgba(245,184,0,.16)}.form-submit svg{font-size:19px}.quote-footer{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-top:13px;padding-top:12px;border-top:1px solid #292f33}.quote-footer span{display:flex;align-items:center;gap:6px;font-size:8.5px;color:#aeb3b6}.quote-footer svg{font-size:15px;color:var(--yellow2)}.form-note{font-size:8px;line-height:1.45;color:#72797d;margin:9px 0 0}

.location-faq{background:#f0f0ee;color:#111315}.location-grid{display:grid;grid-template-columns:31% 35% 34%;min-height:300px}.location-card{padding:22px 34px 22px 8px}.location-card h2,.faq h2{font-size:29px;margin:0 0 14px}.location-lines p{display:flex;gap:10px;align-items:flex-start;margin:10px 0;font-size:11px}.location-lines svg{font-size:19px}.map-wrap{min-height:300px}.map-wrap iframe{width:100%;height:100%;border:0}.faq{padding:22px 0 22px 28px}.faq-list details{border:1px solid #b8babc;border-bottom:0;background:#f7f7f6}.faq-list details:last-child{border-bottom:1px solid #b8babc}.faq-list summary{list-style:none;cursor:pointer;padding:9px 12px;font-size:11px;font-weight:600;display:flex;justify-content:space-between}.faq-list summary::-webkit-details-marker{display:none}.faq-list details p{padding:0 12px 10px;margin:0;font-size:10px;color:#4d5255}.faq-list details[open] summary span{transform:rotate(45deg)}

.final-cta{background:#0c0f10;border-top:1px solid var(--yellow)}.cta-inner{height:84px;display:grid;grid-template-columns:230px 1.5fr 1fr auto;align-items:center;gap:32px;overflow:hidden}.cta-car{height:100%;position:relative}.cta-car::after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,transparent,#0c0f10)}.cta-car img{width:100%;height:100%;object-fit:cover;filter:grayscale(.8) brightness(.5)}.final-cta h2{font-size:30px;margin:0}.final-cta p{font-size:11px;color:#c8cbcd;margin:0}
.footer{background:#080a0b;border-top:1px solid #2b3033;padding:18px 0 8px}.footer-grid{display:grid;grid-template-columns:1.4fr 1.2fr .8fr .7fr .7fr .9fr;gap:26px;align-items:start}.footer-brand img{width:190px}.footer-brand p{font-size:13px;margin:7px 0}.footer-grid>div:not(.footer-brand):not(.footer-car){font-size:10px;color:#c8cbcd;display:flex;flex-direction:column;gap:5px}.footer-grid strong{color:#fff}.footer-car{display:flex;justify-content:flex-end}.footer-car svg{font-size:105px;color:#303539;stroke-width:.7}.copyright{border-top:1px solid #202427;margin-top:12px;padding-top:8px;font-size:9px;color:#7f8588}
.float-wa{position:fixed;right:20px;bottom:18px;z-index:50;display:block;width:72px;height:72px;filter:drop-shadow(0 14px 28px rgba(0,0,0,.35));transition:transform .18s ease,filter .18s ease}.float-wa img{display:block;width:100%;height:100%;object-fit:contain}.float-wa:hover{transform:translateY(-2px) scale(1.04);filter:drop-shadow(0 18px 34px rgba(0,0,0,.42))}.float-wa:focus-visible{outline:3px solid rgba(245,184,0,.9);outline-offset:5px;border-radius:50%}.gallery-modal{border:0;padding:0;background:#0b0d0e;color:#fff;max-width:min(900px,92vw);width:100%;box-shadow:0 35px 100px #000}.gallery-modal::backdrop{background:rgba(0,0,0,.86)}.gallery-modal img{max-height:78vh;width:100%;object-fit:contain;background:#000}.gallery-modal p{padding:12px 18px;margin:0;font-weight:700}.modal-close{position:absolute;right:10px;top:10px;width:38px;height:38px;border-radius:50%;border:1px solid #777;background:#08090a;color:#fff;display:grid;place-items:center;cursor:pointer;z-index:2;font-size:20px}
.reveal{opacity:0;transform:translateY(18px);transition:opacity .7s cubic-bezier(.2,.72,.25,1),transform .7s cubic-bezier(.2,.72,.25,1)}.reveal.in-view{opacity:1;transform:none}

@media(max-width:1180px){.nav-links{gap:18px}.nav-cta{display:none}.service-card>div{left:39%;max-width:61%}.steps{grid-template-columns:repeat(3,1fr);row-gap:18px}.why{grid-template-columns:1fr repeat(3,1fr);row-gap:20px}.works-grid{grid-template-columns:repeat(3,1fr)}.process-layout{grid-template-columns:1fr;gap:26px}.quote-card{width:min(760px,100%);margin:0 auto 6px}.cta-inner{grid-template-columns:180px 1.4fr 1fr auto}}
@media(max-width:900px){.topbar{display:none}.site-header{position:absolute}.navbar{height:76px}.nav-inner{width:calc(100% - 28px);gap:18px}.brand{width:195px;min-width:195px;padding-right:18px}.brand::after{height:30px}.brand img{max-height:48px}.menu-btn{display:block;margin-left:auto}.nav-links{position:fixed;top:76px;left:0;width:100%;height:auto;background:#080a0b;display:none;flex-direction:column;gap:0;padding:8px 18px 20px;border-top:1px solid #31363a}.nav-links.open{display:flex}.nav-links a{padding:14px 8px}.nav-links a::after{bottom:5px;right:auto;width:42px}.hero{height:720px}.hero-inner{padding-top:82px;align-items:flex-end;padding-bottom:54px}.hero-shade{background:linear-gradient(0deg,rgba(0,0,0,.94),rgba(0,0,0,.15) 70%),linear-gradient(90deg,rgba(0,0,0,.42),transparent)}.hero h1{font-size:64px}.intro-grid{grid-template-columns:1fr 1fr}.intro-copy{padding:28px 25px}.intro-photo{clip-path:none}.intro-pillars{grid-column:1/-1}.service-mosaic{grid-template-columns:1fr 1fr}.service-card:nth-child(3n){border-right:1px solid rgba(245,184,0,.72)}.service-card:nth-child(2n){border-right:0}.service-card:nth-child(n+4){border-bottom:1px solid rgba(255,255,255,.28)}.service-card:nth-last-child(-n+2){border-bottom:0}.service-focus{grid-template-columns:1fr}.focus-panel{min-height:380px}.process-layout{grid-template-columns:1fr;padding:24px 0}.process{padding-right:0}.quote-card{margin-bottom:22px}.location-grid{grid-template-columns:1fr 1fr}.faq{grid-column:1/-1;padding:24px 0}.cta-inner{height:auto;padding:20px 0;grid-template-columns:1fr auto}.cta-car{display:none}.final-cta h2,.final-cta p{grid-column:1}.final-cta .btn{grid-column:2;grid-row:1/3}.footer-grid{grid-template-columns:repeat(3,1fr)}.footer-car{display:none}}
@media(max-width:640px){.shell,.shell-wide{width:calc(100% - 28px)}.hero{height:760px}.hero-media img{object-position:center top}.hero-copy{max-width:100%}.eyebrow{font-size:16px}.hero h1{font-size:58px}.hero-slogan{font-size:22px}.hero-text{font-size:14px;max-width:420px}.hero-actions .btn{width:100%}.hero-meta{flex-direction:column;gap:7px}.intro-grid{grid-template-columns:1fr}.intro-copy{padding:28px 18px}.intro-copy h2{font-size:33px}.intro-photo{height:180px}.intro-pillars{grid-column:1;grid-template-columns:1fr 1fr}.intro-pillars article{min-height:126px}.service-mosaic{width:100%;grid-template-columns:1fr;grid-auto-rows:215px}.service-card,.service-card:nth-child(n){border-right:0;border-bottom:1px solid rgba(255,255,255,.25)}.service-card:last-child{border-bottom:0}.service-card>div{left:42%;max-width:58%;padding:12px}.service-card h3{font-size:27px}.service-card ul{font-size:12px}.service-focus{width:100%}.focus-panel{padding:30px 22px;min-height:400px}.focus-panel h2{font-size:34px}.check-grid{grid-template-columns:1fr;gap:8px}.comparison{height:230px}.works{padding-top:18px}.works-head{align-items:flex-start;flex-direction:column}.filters{overflow-x:auto;flex-wrap:nowrap;width:100%;padding-bottom:4px}.filter{white-space:nowrap}.works-grid{grid-template-columns:1fr 1fr}.work-item img{height:120px}.instagram-more{margin:12px auto 0}.process>h2{font-size:29px}.steps{grid-template-columns:1fr 1fr}.steps article{min-height:145px}.why{grid-template-columns:1fr 1fr}.why-title{grid-column:1/-1}.why article{min-height:130px;padding:0 12px}.quote-card{width:auto;margin-left:-14px;margin-right:-14px;border-left:0;border-right:0;padding:23px 18px 20px}.quote-card h2{font-size:34px}.quote-topline{align-items:flex-start}.quote-status{font-size:8px}.quote-steps span{padding:8px 6px;font-size:8px;gap:4px}.form-grid{grid-template-columns:1fr}.field-wide{grid-column:auto}.description{grid-row:auto}.quote-footer{grid-template-columns:1fr}.quote-summary span{white-space:normal}.textarea-meta small:first-child{max-width:75%}.location-grid{width:100%;grid-template-columns:1fr}.location-card{padding:24px 20px}.map-wrap{min-height:280px}.faq{grid-column:auto;padding:24px 14px}.cta-inner{width:calc(100% - 28px);grid-template-columns:1fr;padding:23px 0;gap:12px}.final-cta h2{font-size:28px}.final-cta .btn{grid-column:1;grid-row:auto;width:100%}.footer-grid{grid-template-columns:1fr 1fr}.footer-brand{grid-column:1/-1}.float-wa{right:12px;bottom:12px;width:64px;height:64px}.footer-car{display:none}}


/* === STEP 2 · SECTION TRANSITIONS === */
main{overflow:hidden}
.hero,.intro,.services,.works,.process-contact,.location-faq,.final-cta{position:relative}

/* A thin industrial seam gives each large block a deliberate ending instead of a hard cut. */
.section-bridge{
  --bridge-left:#070809;
  --bridge-right:#111315;
  position:relative;
  height:28px;
  overflow:hidden;
  isolation:isolate;
  background:linear-gradient(90deg,var(--bridge-left) 0 49.8%,var(--bridge-right) 50.2% 100%);
  border-top:1px solid rgba(255,255,255,.055);
  border-bottom:1px solid rgba(0,0,0,.38);
}
.section-bridge::before{
  content:"";
  position:absolute;
  z-index:1;
  left:50%;top:-10px;
  width:150px;height:52px;
  transform:translateX(-50%) skewX(-30deg);
  background:linear-gradient(90deg,transparent 0 18%,rgba(245,184,0,.28) 18% 21%,var(--yellow) 21% 24%,rgba(255,196,0,.12) 24% 26%,transparent 26% 100%);
  pointer-events:none;
}
.section-bridge::after{
  content:"";
  position:absolute;
  left:0;right:0;top:50%;
  height:1px;
  background:linear-gradient(90deg,transparent 0 7%,rgba(255,255,255,.12) 7% 38%,transparent 48% 52%,rgba(255,255,255,.08) 62% 93%,transparent 93% 100%);
  pointer-events:none;
}
.section-bridge span{
  position:absolute;
  z-index:2;
  left:max(22px,calc((100vw - var(--wide))/2 + 20px));
  top:50%;transform:translateY(-50%);
  padding-right:10px;
  font-family:"Barlow Condensed",sans-serif;
  font-size:10px;font-weight:800;letter-spacing:.16em;
  color:rgba(255,255,255,.4);
  text-transform:uppercase;
}
.bridge-hero-light{--bridge-left:#070809;--bridge-right:#f3f3f3;background:linear-gradient(90deg,#090b0c 0 48%,#242728 48% 50%,#e7e7e4 50% 52%,#f3f3f3 52% 100%)}
.bridge-hero-light span,.bridge-light-dark span,.bridge-graphite-light span{color:rgba(255,255,255,.52)}
.bridge-light-dark{--bridge-left:#f3f3f3;--bridge-right:#0c0e0f;background:linear-gradient(90deg,#f3f3f3 0 48%,#d4d4d0 48% 50%,#242728 50% 52%,#0c0e0f 52% 100%)}
.bridge-dark-deep{--bridge-left:#0c0e0f;--bridge-right:#07090a}
.bridge-deep-graphite{--bridge-left:#07090a;--bridge-right:#101315}
.bridge-graphite-light{--bridge-left:#101315;--bridge-right:#f0f0ee;background:linear-gradient(90deg,#101315 0 48%,#252a2d 48% 50%,#d7d7d3 50% 52%,#f0f0ee 52% 100%)}
.bridge-compact{height:22px}

/* Controlled diagonal cuts reinforce the workshop identity without becoming decorative noise. */
.intro::before,.services::before,.works::before,.process-contact::before,.location-faq::before,.final-cta::before{
  content:"";
  position:absolute;
  z-index:3;
  top:0;left:max(18px,calc((100vw - var(--wide))/2 + 18px));
  width:78px;height:3px;
  background:var(--yellow);
  transform:skewX(-34deg);
  transform-origin:left center;
  pointer-events:none;
}
.services::before,.works::before,.process-contact::before,.final-cta::before{box-shadow:84px 0 0 rgba(245,184,0,.18)}
.location-faq::before,.intro::before{box-shadow:84px 0 0 rgba(17,19,21,.12)}

/* The hero gets a precise lower edge so its photo flows into the first editorial block. */
.hero::after{
  content:"";
  position:absolute;
  z-index:5;
  left:0;right:0;bottom:0;height:9px;
  background:linear-gradient(90deg,var(--yellow) 0 8%,rgba(245,184,0,.16) 8% 31%,transparent 31% 100%);
  clip-path:polygon(0 45%,8% 45%,8.7% 0,31% 0,31.6% 45%,100% 45%,100% 100%,0 100%);
  pointer-events:none;
}

/* The image in the first editorial band slightly breaks the grid line, visually tying hero and content. */
@media(min-width:901px){
  .intro-photo{position:relative;z-index:2;margin-top:-10px;margin-bottom:-10px;box-shadow:0 18px 35px rgba(0,0,0,.16)}
  .intro-pillars{position:relative;z-index:1}
}

/* Thin metal seams between the two service systems keep the long services area visually structured. */
.service-mosaic::after{
  content:"";position:absolute;left:0;right:0;bottom:-1px;height:1px;
  background:linear-gradient(90deg,transparent,var(--yellow) 18%,rgba(255,255,255,.25) 50%,var(--yellow) 82%,transparent);
  opacity:.55;pointer-events:none
}
.service-mosaic{position:relative}
.service-focus::before{
  content:"";position:absolute;left:50%;top:-11px;width:88px;height:22px;transform:translateX(-50%) skewX(-28deg);
  background:#0c0e0f;border-left:2px solid var(--yellow);border-right:1px solid rgba(255,255,255,.14);z-index:4;pointer-events:none
}
.service-focus{position:relative}

/* Prevent decorative elements from competing with content on narrow screens. */
@media(max-width:900px){
  .section-bridge{height:18px}
  .section-bridge span{display:none}
  .section-bridge::before{width:96px;opacity:.88}
  .bridge-compact{height:14px}
  .intro::before,.services::before,.works::before,.process-contact::before,.location-faq::before,.final-cta::before{left:14px;width:52px;height:2px;box-shadow:58px 0 0 rgba(245,184,0,.16)}
  .hero::after{height:6px}
  .service-focus::before{width:62px;height:16px;top:-8px}
}
@media(max-width:640px){
  .section-bridge{height:14px}
  .section-bridge::after{opacity:.6}
  .section-bridge::before{width:78px}
  .intro-photo{margin:0;box-shadow:none}
}


/* === STEP 4 · PREMIUM SCROLL MOTION === */
:root{--motion-ease:cubic-bezier(.2,.72,.25,1);--motion-fast:.55s;--motion-base:.72s}

/* Different entry directions keep the motion subtle but editorial. */
.hero-copy.reveal{transform:translate3d(-18px,10px,0)}
.hero-copy.reveal.in-view{transform:none}
.intro-photo.reveal,.map-wrap.reveal{transform:translate3d(20px,0,0) scale(.992)}
.intro-photo.reveal.in-view,.map-wrap.reveal.in-view{transform:none}
.focus-diagnostic.reveal{transform:translate3d(0,18px,0) scale(.992)}
.focus-diagnostic.reveal.in-view{transform:none}
.quote-card.reveal{transform:translate3d(18px,14px,0)}
.quote-card.reveal.in-view{transform:none}

/* Yellow title markers draw in instead of simply appearing. */
.reveal .mini-line{transform:scaleX(0);transform-origin:left center;transition:transform .62s var(--motion-ease) .16s}
.reveal.in-view .mini-line{transform:scaleX(1)}

/* Section top accents from Step 2 now extend as the section enters the viewport. */
.scroll-section::before{transform:skewX(-34deg) scaleX(0);transform-origin:left center;transition:transform .78s var(--motion-ease) .08s}
.scroll-section.in-view::before{transform:skewX(-34deg) scaleX(1)}

/* Bridge graphics get a short technical reveal between large blocks. */
.scroll-bridge::before{opacity:0;transform:translateX(-50%) skewX(-30deg) scaleX(.22);transform-origin:center;transition:opacity .4s ease,transform .7s var(--motion-ease)}
.scroll-bridge::after{opacity:0;transform:scaleX(.45);transition:opacity .4s ease .08s,transform .8s var(--motion-ease) .08s}
.scroll-bridge span{opacity:0;transform:translate3d(-8px,-50%,0);transition:opacity .45s ease .18s,transform .55s var(--motion-ease) .18s}
.scroll-bridge.in-view::before{opacity:1;transform:translateX(-50%) skewX(-30deg) scaleX(1)}
.scroll-bridge.in-view::after{opacity:1;transform:scaleX(1)}
.scroll-bridge.in-view span{opacity:1;transform:translate3d(0,-50%,0)}

/* Staggered groups. Each child gets its delay from --motion-index generated in JS. */
.scroll-cluster .motion-item{
  opacity:0;
  transform:translate3d(0,15px,0) scale(.994);
  transition:
    opacity var(--motion-fast) ease,
    transform var(--motion-base) var(--motion-ease);
  transition-delay:calc(var(--motion-index,0) * 62ms);
  will-change:opacity,transform;
}
.scroll-cluster.in-view .motion-item{opacity:1;transform:none}

/* Service cards enter from alternating directions, very slightly. */
.service-mosaic.scroll-cluster .service-card:nth-child(odd){transform:translate3d(-13px,12px,0) scale(.994)}
.service-mosaic.scroll-cluster .service-card:nth-child(even){transform:translate3d(13px,12px,0) scale(.994)}
.service-mosaic.scroll-cluster.in-view .service-card{transform:none}

/* Work thumbnails use a tighter stagger so the grid never feels slow. */
.works-grid.scroll-cluster .work-item{transition-delay:calc(var(--motion-index,0) * 48ms)}

/* Process numbers reveal after their corresponding step has settled. */
.steps.scroll-cluster article b{
  display:inline-block;
  opacity:0;
  transform:translateY(8px);
  transition:opacity .42s ease,transform .55s var(--motion-ease);
  transition-delay:calc(var(--motion-index,0) * 62ms + 120ms);
}
.steps.scroll-cluster.in-view article b{opacity:1;transform:none}

/* Small icon groups stay calm; no bouncing. */
.intro-pillars.scroll-cluster .motion-item svg,
.focus-icons.scroll-cluster .motion-item svg{
  transform:scale(.9);
  transition:transform .5s var(--motion-ease);
  transition-delay:calc(var(--motion-index,0) * 62ms + 80ms);
}
.intro-pillars.scroll-cluster.in-view .motion-item svg,
.focus-icons.scroll-cluster.in-view .motion-item svg{transform:scale(1)}

/* Before/after arrives as a single controlled surface. */
.appearance.reveal .comparison{opacity:.35;transform:translateY(10px) scale(.99);transition:opacity .65s ease .15s,transform .72s var(--motion-ease) .15s}
.appearance.reveal.in-view .comparison{opacity:1;transform:none}
.appearance.reveal .compare-handle{opacity:0;transform:translate(-50%,-50%) scale(.82);transition:opacity .35s ease .55s,transform .5s var(--motion-ease) .55s}
.appearance.reveal.in-view .compare-handle{opacity:1;transform:translate(-50%,-50%) scale(1)}

/* Keep interaction transitions responsive after the entrance animation ends. */
.service-card,.work-item,.btn,.filter,.float-wa{backface-visibility:hidden}

@media(max-width:640px){
  .scroll-cluster .motion-item{transition-delay:calc(var(--motion-index,0) * 38ms)}
  .service-mosaic.scroll-cluster .service-card:nth-child(n){transform:translate3d(0,12px,0) scale(.996)}
  .service-mosaic.scroll-cluster.in-view .service-card{transform:none}
  .steps.scroll-cluster article b{transition-delay:calc(var(--motion-index,0) * 38ms + 90ms)}
}

/* Respect users who request less motion. */
@media(prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  .reveal,.reveal.in-view,
  .scroll-cluster .motion-item,.scroll-cluster.in-view .motion-item,
  .hero-copy.reveal,.hero-copy.reveal.in-view,
  .intro-photo.reveal,.intro-photo.reveal.in-view,
  .map-wrap.reveal,.map-wrap.reveal.in-view,
  .focus-diagnostic.reveal,.focus-diagnostic.reveal.in-view,
  .quote-card.reveal,.quote-card.reveal.in-view,
  .service-mosaic.scroll-cluster .service-card:nth-child(n),
  .service-mosaic.scroll-cluster.in-view .service-card,
  .appearance.reveal .comparison,.appearance.reveal.in-view .comparison,
  .appearance.reveal .compare-handle,.appearance.reveal.in-view .compare-handle,
  .steps.scroll-cluster article b,.steps.scroll-cluster.in-view article b{
    opacity:1!important;transform:none!important;transition:none!important
  }
  .reveal .mini-line,.reveal.in-view .mini-line{transform:none!important;transition:none!important}
  .scroll-section::before,.scroll-section.in-view::before{transform:skewX(-34deg)!important;transition:none!important}
  .scroll-bridge::before,.scroll-bridge.in-view::before{opacity:1!important;transform:translateX(-50%) skewX(-30deg)!important;transition:none!important}
  .scroll-bridge::after,.scroll-bridge.in-view::after{opacity:1!important;transform:none!important;transition:none!important}
  .scroll-bridge span,.scroll-bridge.in-view span{opacity:1!important;transform:translateY(-50%)!important;transition:none!important}
}

/* =========================================================
   STEP 5 · CTA MICROINTERACTIONS
   Premium, consistent interaction language for TCC Garage.
   ========================================================= */
.btn,
.topbar-cta,
.instagram-more{
  position:relative;
  isolation:isolate;
  overflow:hidden;
  -webkit-tap-highlight-color:transparent;
  transition:
    transform .18s cubic-bezier(.2,.7,.2,1),
    box-shadow .24s ease,
    border-color .24s ease,
    color .24s ease,
    background-position .32s cubic-bezier(.2,.7,.2,1),
    filter .24s ease;
}

/* Arrow is part of the interaction system, not extra copy. */
.btn::after,
.topbar-cta::after,
.instagram-more::after{
  content:"→";
  display:inline-block;
  margin-left:9px;
  font-size:1.05em;
  line-height:1;
  transform:translateX(0);
  transition:transform .18s cubic-bezier(.2,.7,.2,1),opacity .18s ease;
  opacity:.82;
}

.btn:hover::after,
.topbar-cta:hover::after,
.instagram-more:hover::after{
  transform:translateX(4px);
  opacity:1;
}

/* Yellow CTAs: subtle directional light instead of a flat hover. */
.btn-yellow,
.topbar-cta{
  background-image:linear-gradient(110deg,
    var(--yellow2) 0%,
    var(--yellow2) 38%,
    #ffd847 49%,
    var(--yellow2) 60%,
    var(--yellow2) 100%);
  background-size:220% 100%;
  background-position:100% 0;
  box-shadow:0 8px 22px rgba(245,184,0,.12);
}

.btn-yellow:hover,
.topbar-cta:hover{
  background-position:0 0;
  color:#070809;
  transform:translateY(-2px);
  box-shadow:
    0 12px 28px rgba(245,184,0,.20),
    0 0 0 1px rgba(255,216,71,.18);
  filter:saturate(1.04);
}

/* Dark-outline CTA fills from the left with TCC yellow. */
.btn-outline{
  background-image:linear-gradient(90deg,
    var(--yellow2) 0%,
    var(--yellow2) 50%,
    rgba(0,0,0,.22) 50%,
    rgba(0,0,0,.22) 100%);
  background-size:205% 100%;
  background-position:100% 0;
}

.btn-outline:hover{
  background-position:0 0;
  border-color:var(--yellow2);
  color:#08090a;
  transform:translateY(-2px);
  box-shadow:0 12px 26px rgba(0,0,0,.22),0 0 0 1px rgba(245,184,0,.12);
}

/* Instagram / secondary utility CTA gets the same motion vocabulary. */
.instagram-more{
  background-image:linear-gradient(90deg,
    var(--yellow2) 0%,
    var(--yellow2) 50%,
    transparent 50%,
    transparent 100%);
  background-size:205% 100%;
  background-position:100% 0;
}

.instagram-more:hover{
  background-position:0 0;
  color:#08090a;
  border-color:var(--yellow2);
  transform:translateY(-2px);
  box-shadow:0 10px 24px rgba(245,184,0,.14);
}

/* Press feedback: short, physical and consistent across mouse/touch. */
.btn:active,
.topbar-cta:active,
.instagram-more:active{
  transform:translateY(0) scale(.975);
  transition-duration:.06s;
  box-shadow:0 4px 12px rgba(0,0,0,.18);
}

/* Strong keyboard focus without changing the normal visual hierarchy. */
.btn:focus-visible,
.topbar-cta:focus-visible,
.instagram-more:focus-visible,
.filter:focus-visible,
.menu-btn:focus-visible,
.work-item:focus-visible,
.modal-close:focus-visible{
  outline:3px solid #fff;
  outline-offset:3px;
  box-shadow:0 0 0 6px rgba(245,184,0,.68);
}

/* The form submit remains visually balanced despite its leading icon. */
.form-submit{
  gap:9px;
}
.form-submit::after{
  margin-left:auto;
}
.form-submit svg{
  transition:transform .18s ease;
}
.form-submit:hover svg{
  transform:scale(1.06);
}

/* Floating WhatsApp: preserve the original icon as the entire hit target. */
.float-wa:active{
  transform:translateY(0) scale(.96);
  transition-duration:.06s;
}

@media (hover:none){
  .btn:hover,
  .topbar-cta:hover,
  .instagram-more:hover{
    transform:none;
  }
}

@media (prefers-reduced-motion:reduce){
  .btn,
  .topbar-cta,
  .instagram-more,
  .btn::after,
  .topbar-cta::after,
  .instagram-more::after,
  .form-submit svg,
  .float-wa{
    transition:none!important;
  }
}


/* WIZARD · FORMULARIO DE COTIZACIÓN */
/* Ensure wizard controls truly disappear outside their corresponding step.
   Author button display rules can otherwise override the native [hidden] behavior. */
.wizard-actions>[hidden]{display:none!important}
.wizard-actions.is-first{grid-template-columns:1fr}
.wizard-actions.is-first .wizard-next{grid-column:1;width:100%}
.wizard-actions.is-last{grid-template-columns:auto 1fr}
.wizard-actions.is-last .form-submit{grid-column:2;width:100%}


.wizard-progress{position:relative;z-index:1;margin:-7px 0 18px}
.wizard-progress-meta{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:7px;font-size:9px;color:#9da4a8}
.wizard-progress-meta strong{font-size:9px;letter-spacing:.06em;text-transform:uppercase;color:#e8eaeb}
.wizard-progress-meta span{font-family:"Barlow Condensed",sans-serif;font-size:15px;font-weight:800;color:var(--yellow2)}
.wizard-progress-track{height:5px;background:#282e32;overflow:hidden;position:relative}
.wizard-progress-track>span{display:block;width:33.333%;height:100%;background:linear-gradient(90deg,var(--yellow),var(--yellow2));box-shadow:0 0 14px rgba(255,196,0,.32);transition:width .32s cubic-bezier(.22,.8,.24,1)}
.wizard-indicators span{position:relative;transition:background .2s ease,color .2s ease,border-color .2s ease}
.wizard-indicators span::after{content:"";position:absolute;left:0;right:0;bottom:-1px;height:2px;background:var(--yellow2);transform:scaleX(0);transform-origin:left;transition:transform .25s ease}
.wizard-indicators span.active{background:rgba(255,196,0,.07);color:#fff}
.wizard-indicators span.active::after{transform:scaleX(1)}
.wizard-indicators span.complete{color:#e7e9ea}
.wizard-indicators span.complete b{color:#0d1012;background:var(--yellow2)}
.wizard-indicators b{display:grid;place-items:center;min-width:25px;height:25px;padding:0 4px;transition:background .2s ease,color .2s ease}
.wizard-step{animation:wizardStepIn .28s ease both}
.wizard-step[hidden],.wizard-final[hidden]{display:none!important}
@keyframes wizardStepIn{from{opacity:0;transform:translate3d(12px,0,0)}to{opacity:1;transform:none}}
.wizard-actions{display:grid;grid-template-columns:auto 1fr;gap:9px;align-items:center;margin-top:4px}
.wizard-actions .wizard-next,.wizard-actions .form-submit{grid-column:2;width:100%;min-height:50px;margin:0}
.wizard-btn{min-height:50px;border:1px solid #3c4449;background:#151a1d;color:#e9ebec;padding:0 16px;font:700 11px/1 "Inter",sans-serif;cursor:pointer;display:inline-flex;align-items:center;justify-content:center;gap:7px;transition:background .18s ease,border-color .18s ease,color .18s ease,transform .12s ease}
.wizard-btn:hover{background:#1d2327;border-color:#596167;color:#fff}
.wizard-btn:active{transform:translateY(1px)}
.wizard-btn:focus-visible{outline:3px solid rgba(255,196,0,.32);outline-offset:2px}
.wizard-next{display:inline-flex;align-items:center;justify-content:center;gap:10px}
.wizard-next>span:last-child{font-size:16px;transition:transform .18s ease}
.wizard-next:hover>span:last-child{transform:translateX(4px)}
.wizard-final{animation:wizardStepIn .28s ease both}
.wizard-field-error{display:block;margin-top:5px;color:#ffbb58;font-size:8px;line-height:1.35}
.form-grid input[aria-invalid="true"],.form-grid select[aria-invalid="true"],.form-grid textarea[aria-invalid="true"]{border-color:#e6a331;box-shadow:0 0 0 3px rgba(230,163,49,.12)}
@media(max-width:640px){
  .wizard-progress{margin-top:-5px}
  .wizard-indicators span{justify-content:center;flex-direction:column;gap:3px;text-align:center;padding:8px 4px!important}
  .wizard-indicators b{min-width:22px;height:22px;font-size:14px}
  .wizard-actions{grid-template-columns:1fr 1.55fr}
  .wizard-actions.is-first{grid-template-columns:1fr}
  .wizard-btn{padding:0 10px}
  .wizard-actions .wizard-next,.wizard-actions .form-submit{grid-column:2}
  .wizard-actions.is-first .wizard-next{grid-column:1}
}
@media(prefers-reduced-motion:reduce){.wizard-step,.wizard-final{animation:none}.wizard-progress-track>span,.wizard-indicators span::after,.wizard-next>span:last-child{transition:none}}


/* TCC Garage - Choices.js multiselect */
.service-multiselect-field{position:relative;z-index:8}
.service-select-help{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-top:7px;color:#7f878c}
.service-select-help>span{font:800 9px/1 "Inter",sans-serif;color:var(--yellow2);text-transform:uppercase;letter-spacing:.04em}
.service-select-help small{font-size:8px;text-align:right}
.quote-card .choices{margin:0;font-size:11px;color:#121416;position:relative}
.quote-card .choices__inner{min-height:48px;padding:6px 38px 5px 7px;background:#f5f5f4;border:1px solid #c6c9ca;border-radius:2px;font-size:11px;display:flex;align-items:center;flex-wrap:wrap;gap:4px;transition:border-color .18s ease,box-shadow .18s ease,background .18s ease}
.quote-card .choices.is-focused .choices__inner,.quote-card .choices.is-open .choices__inner{background:#fff;border-color:var(--yellow2);box-shadow:0 0 0 3px rgba(255,196,0,.13)}
.quote-card .choices.is-error .choices__inner{border-color:#ffbb58;box-shadow:0 0 0 3px rgba(255,187,88,.12)}
.quote-card .choices[data-type*=select-multiple]::after{content:"";position:absolute;right:14px;top:22px;width:8px;height:8px;border-right:2px solid #111315;border-bottom:2px solid #111315;transform:translateY(-50%) rotate(45deg);pointer-events:none;transition:transform .18s ease,top .18s ease}
.quote-card .choices.is-open[data-type*=select-multiple]::after{top:26px;transform:translateY(-50%) rotate(225deg)}
.quote-card .choices__list--multiple{display:flex;flex-wrap:wrap;gap:4px;align-items:center}
.quote-card .choices__list--multiple .choices__item{display:inline-flex;align-items:center;gap:7px;margin:0;padding:6px 8px 6px 10px;border:1px solid #d19b00;border-radius:2px;background:linear-gradient(135deg,var(--yellow2),var(--yellow));color:#0b0d0e;font:800 9px/1 "Inter",sans-serif;letter-spacing:.01em;box-shadow:none;word-break:normal}
.quote-card .choices__list--multiple .choices__item.is-highlighted{background:var(--yellow2);border-color:#ffcc24}
.quote-card .choices[data-type*=select-multiple] .choices__button{position:relative;display:inline-grid;place-items:center;width:15px;height:15px;margin:0;padding:0;border:0;border-left:1px solid rgba(0,0,0,.25);background:none!important;opacity:.7;filter:none}
.quote-card .choices[data-type*=select-multiple] .choices__button::before,.quote-card .choices[data-type*=select-multiple] .choices__button::after{content:"";position:absolute;width:8px;height:1.5px;background:#111315;left:5px;top:7px}
.quote-card .choices[data-type*=select-multiple] .choices__button::before{transform:rotate(45deg)}
.quote-card .choices[data-type*=select-multiple] .choices__button::after{transform:rotate(-45deg)}
.quote-card .choices[data-type*=select-multiple] .choices__button:hover{opacity:1}
.quote-card .choices__input--cloned{min-width:155px!important;flex:1 1 155px;margin:0!important;padding:7px 4px!important;background:transparent!important;border:0!important;color:#121416!important;font:500 10px/1.2 "Inter",sans-serif!important;box-shadow:none!important}
.quote-card .choices__input--cloned::placeholder{color:#858b8f;opacity:1}
.quote-card .choices__list--dropdown,.quote-card .choices__list[aria-expanded]{z-index:40;margin-top:5px;background:#101416;border:1px solid #3a4247;border-radius:2px;box-shadow:0 18px 44px rgba(0,0,0,.48);color:#eef0f1;overflow:hidden}
.quote-card .choices__list--dropdown .choices__input,.quote-card .choices__list[aria-expanded] .choices__input{margin:0;padding:11px 12px;background:#181d20;border:0;border-bottom:1px solid #343b40;color:#fff;font:500 10px/1.2 "Inter",sans-serif}
.quote-card .choices__list--dropdown .choices__list,.quote-card .choices__list[aria-expanded] .choices__list{max-height:245px;padding:5px;scrollbar-width:thin;scrollbar-color:var(--yellow) #171b1e}
.quote-card .choices__list--dropdown .choices__item--choice,.quote-card .choices__list[aria-expanded] .choices__item--choice{position:relative;padding:11px 34px 11px 12px;border-bottom:1px solid rgba(255,255,255,.055);font:600 10px/1.2 "Inter",sans-serif;color:#dce0e2;transition:background .14s ease,color .14s ease,padding-left .14s ease}
.quote-card .choices__list--dropdown .choices__item--choice::after,.quote-card .choices__list[aria-expanded] .choices__item--choice::after{content:"+";position:absolute;right:12px;top:50%;transform:translateY(-50%);font-family:"Barlow Condensed",sans-serif;font-size:18px;font-weight:800;color:var(--yellow2)}
.quote-card .choices__list--dropdown .choices__item--choice:last-child,.quote-card .choices__list[aria-expanded] .choices__item--choice:last-child{border-bottom:0}
.quote-card .choices__list--dropdown .choices__item--selectable.is-highlighted,.quote-card .choices__list[aria-expanded] .choices__item--selectable.is-highlighted{background:#22282c;color:#fff;padding-left:16px}
.quote-card .choices__list--dropdown .choices__item--disabled,.quote-card .choices__list[aria-expanded] .choices__item--disabled{opacity:.45}
.quote-card .choices__placeholder{opacity:1;color:#858b8f}
.quote-card .choices__notice{padding:14px 12px;color:#aeb4b7;font-size:9px}
.quote-card select#serviceSelect.choices__input{position:absolute!important;width:1px!important;height:1px!important;overflow:hidden!important;clip:rect(0 0 0 0)!important;white-space:nowrap!important;clip-path:inset(50%)!important}
@media(max-width:640px){
  .service-select-help{align-items:flex-start;flex-direction:column;gap:4px}
  .service-select-help small{text-align:left}
  .quote-card .choices__inner{min-height:52px;padding-top:7px;padding-bottom:7px}
  .quote-card .choices__input--cloned{min-width:120px!important;flex-basis:120px}
  .quote-card .choices__list--dropdown .choices__item--choice,.quote-card .choices__list[aria-expanded] .choices__item--choice{min-height:44px;display:flex;align-items:center;font-size:11px}
}
@media(prefers-reduced-motion:reduce){
  .quote-card .choices__inner,.quote-card .choices[data-type*=select-multiple]::after,.quote-card .choices__list--dropdown .choices__item--choice,.quote-card .choices__list[aria-expanded] .choices__item--choice{transition:none}
}

@media(max-width:420px){.navbar{height:72px}.brand{width:180px;min-width:180px;padding-right:14px}.brand img{max-height:44px}.nav-links{top:72px}.brand::after{height:26px}}


/* FORMULARIO PREMIUM · TCC GARAGE */
.quote-card{
  --form-border:#323a3f;
  --form-muted:#899196;
  --form-surface:#111518;
  --form-surface-2:#171c1f;
  border-color:#343c41;
  border-top-width:4px;
  padding:30px 30px 24px;
  box-shadow:0 28px 80px rgba(0,0,0,.34),inset 0 1px 0 rgba(255,255,255,.025);
}
.quote-card::before{width:230px;height:230px;right:-150px;top:-150px;border-color:rgba(255,196,0,.10)}
.quote-card::after{width:110px;top:20px;right:28px;opacity:.68}
.quote-kicker{font-size:10px;letter-spacing:.18em}
.quote-status{padding:6px 9px;border:1px solid #30383d;background:#0c1012;color:#d6d9da}
.quote-card h2{font-size:42px;line-height:.92;margin-bottom:10px;max-width:520px}
.quote-lead{font-size:11.5px;line-height:1.6;color:#aeb5b9;max-width:540px;margin-bottom:12px}
.quote-assurance{display:flex;flex-wrap:wrap;gap:7px 18px;margin:0 0 20px;padding:10px 0;border-top:1px solid #262d31;border-bottom:1px solid #262d31;font-size:8.5px;color:#818a8f}
.quote-assurance span{display:inline-flex;align-items:center;gap:4px}
.quote-assurance span::before{content:"";width:5px;height:5px;background:var(--yellow2);box-shadow:0 0 0 3px rgba(255,196,0,.08)}
.quote-assurance b{color:#d8dcde;font-weight:700}

/* Three-step navigation: technical rail instead of three heavy cards */
.quote-steps{position:relative;border:0;background:transparent;margin:2px 0 17px;gap:0}
.quote-steps::before{content:"";position:absolute;left:13%;right:13%;top:17px;height:1px;background:#343c40}
.quote-steps span{position:relative;z-index:1;justify-content:center;flex-direction:column;gap:5px;padding:0 4px 7px;border:0!important;background:transparent!important;color:#778086;text-transform:uppercase;letter-spacing:.055em;font-size:8px;text-align:center}
.quote-steps span::after{left:18%;right:18%;bottom:0;height:2px}
.quote-steps b{min-width:34px!important;width:34px;height:34px!important;border:1px solid #40484d;background:#0e1214;color:#7f878c!important;font-size:17px!important;box-shadow:0 0 0 5px #121619}
.quote-steps span.active{color:#f3f4f4}
.quote-steps span.active b{border-color:var(--yellow2);background:var(--yellow2);color:#090b0c!important;box-shadow:0 0 0 5px #121619,0 0 18px rgba(255,196,0,.15)}
.quote-steps span.complete b{border-color:#9a7500;background:#1f1b0e;color:var(--yellow2)!important}

.wizard-progress{margin:0 0 20px;padding:10px 12px;background:#0b0f11;border:1px solid #293035}
.wizard-progress-meta{margin-bottom:8px}
.wizard-progress-meta strong{font-size:8.5px;letter-spacing:.1em}
.wizard-progress-meta span{font-size:17px}
.wizard-progress-track{height:4px;background:#252c30}

.form-section{margin-bottom:18px}
.form-section legend{padding-bottom:10px;margin-bottom:13px;border-bottom-color:#30373b;font-size:9.5px;letter-spacing:.095em}
.form-section legend span{width:29px;height:29px;background:#171b1d;border-color:#8d6c00;font-size:16px;box-shadow:inset 3px 0 0 var(--yellow2)}
.wizard-step-intro{margin:-2px 0 15px;padding:0 0 0 12px;border-left:2px solid rgba(255,196,0,.5)}
.wizard-step-intro strong{display:block;font:800 18px/1 "Barlow Condensed",sans-serif;color:#fff;letter-spacing:.01em;margin-bottom:4px}
.wizard-step-intro p{margin:0;color:#828b90;font-size:9px;line-height:1.5;max-width:520px}

.form-grid{gap:13px 13px}
.form-grid label{position:relative}
.field-label{justify-content:space-between;gap:8px;margin-bottom:7px;font-size:9px;letter-spacing:.015em;color:#d8dcde}
.field-label em{margin-right:auto;font-size:10px}
.field-label small{margin-left:auto;padding:2px 5px;border:1px solid #30373b;color:#727b80;font-size:7px;font-weight:600;text-transform:uppercase;letter-spacing:.05em}
.form-grid input,.form-grid select,.form-grid textarea{
  min-height:50px;
  background:#f1f2f1;
  border:1px solid #aeb3b6;
  border-radius:3px;
  padding:12px 13px;
  font:500 11px/1.25 "Inter",sans-serif;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.75);
}
.form-grid textarea{min-height:132px;padding-top:13px}
.form-grid input:hover,.form-grid select:hover,.form-grid textarea:hover{border-color:#d4d7d8;background:#f7f7f6}
.form-grid input:focus,.form-grid select:focus,.form-grid textarea:focus{border-color:var(--yellow2);box-shadow:0 0 0 3px rgba(255,196,0,.11),0 8px 20px rgba(0,0,0,.10)}
.form-grid input::placeholder,.form-grid textarea::placeholder{color:#8d9396}
.textarea-meta{margin-top:7px;color:#7e878c}
.textarea-meta small{font-size:7.8px;line-height:1.45}
.textarea-meta small:last-child{padding:2px 5px;border:1px solid #30373b;background:#0b0f11;color:#aab0b3}
.wizard-field-error{margin-top:6px;padding-left:10px;border-left:2px solid #e6a331;color:#ffc45e;font-size:8px}

/* Professional final review card */
.quote-summary{display:block;background:linear-gradient(180deg,#0b0f11,#0e1214);border:1px solid #343c40;border-left:3px solid var(--yellow2);padding:14px 14px 13px;margin:3px 0 15px}
.quote-summary-head{display:grid;grid-template-columns:38px 1fr;gap:11px;align-items:center;padding-bottom:11px;border-bottom:1px solid #282f33}
.quote-summary-icon{width:36px;height:36px;border:1px solid #343c40;background:#151a1d;font-size:19px}
.quote-summary-head strong{display:block;color:#f3f4f4;font-size:10px;margin-bottom:2px}
.quote-summary-head span{display:block;color:#848d92;font-size:8.5px}
.quote-summary-grid{display:grid;grid-template-columns:1.05fr 1.35fr .9fr;gap:0;margin-top:10px}
.quote-summary-grid>div{min-width:0;padding:4px 10px;border-right:1px solid #293035}
.quote-summary-grid>div:first-child{padding-left:0}.quote-summary-grid>div:last-child{border-right:0;padding-right:0}
.quote-summary-grid small{display:block;margin-bottom:4px;color:#70797e;font-size:7px;text-transform:uppercase;letter-spacing:.075em}
.quote-summary-grid b{display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;color:#dfe2e3;font-size:9px;font-weight:700}
.sr-only{position:absolute!important;width:1px!important;height:1px!important;padding:0!important;margin:-1px!important;overflow:hidden!important;clip:rect(0,0,0,0)!important;white-space:nowrap!important;border:0!important}

.wizard-actions{gap:10px;margin-top:7px;padding-top:2px}
.wizard-btn,.wizard-actions .wizard-next,.wizard-actions .form-submit{min-height:54px}
.wizard-btn{background:#111619;border-color:#3c454a;padding:0 19px;font-size:10px;letter-spacing:.015em}
.wizard-btn:hover{border-color:#657077}
.wizard-next,.form-submit{font-size:12px;letter-spacing:.005em}
.form-submit{box-shadow:0 14px 32px rgba(245,184,0,.15)}
.quote-footer{margin-top:17px;padding-top:14px;border-top-color:#30373b}
.quote-footer span{font-size:8px;color:#8c9599}
.form-note{margin-top:10px;color:#656e73;font-size:7.7px}

/* Choices follows the same field system */
.quote-card .choices__inner{min-height:52px;border-radius:3px;border-color:#aeb3b6;background:#f1f2f1;padding:7px 38px 6px 8px}
.quote-card .choices.is-focused .choices__inner,.quote-card .choices.is-open .choices__inner{box-shadow:0 0 0 3px rgba(255,196,0,.11),0 8px 20px rgba(0,0,0,.10)}
.quote-card .choices__list--multiple .choices__item{padding:7px 8px 7px 10px;border-radius:2px;font-size:8.5px}
.quote-card .choices__list--dropdown,.quote-card .choices__list[aria-expanded]{margin-top:7px;border-color:#444d52;box-shadow:0 22px 55px rgba(0,0,0,.55)}
.service-select-help{margin-top:8px;padding-top:7px;border-top:1px dashed #31383c}

@media(max-width:640px){
  .quote-card{padding:25px 18px 21px}
  .quote-card h2{font-size:37px}
  .quote-lead{font-size:10.5px}
  .quote-assurance{gap:7px 12px}
  .quote-steps::before{left:14%;right:14%;top:16px}
  .quote-steps span{font-size:7px;padding-left:2px!important;padding-right:2px!important}
  .quote-steps b{width:32px;min-width:32px!important;height:32px!important;font-size:16px!important}
  .wizard-progress{padding:9px 10px}
  .wizard-step-intro strong{font-size:17px}
  .form-grid{gap:12px}
  .form-grid input,.form-grid select,.form-grid textarea{min-height:52px;font-size:12px}
  .quote-summary-grid{grid-template-columns:1fr;gap:0}
  .quote-summary-grid>div,.quote-summary-grid>div:first-child,.quote-summary-grid>div:last-child{padding:8px 0;border-right:0;border-bottom:1px solid #293035}
  .quote-summary-grid>div:last-child{border-bottom:0}
  .quote-summary-grid b{white-space:normal}
  .wizard-actions{grid-template-columns:.8fr 1.45fr}
  .wizard-actions.is-last{grid-template-columns:.8fr 1.45fr}
  .wizard-btn,.wizard-actions .wizard-next,.wizard-actions .form-submit{min-height:56px}
  .wizard-next{font-size:10.5px}
  .form-submit{font-size:10.5px}
}
