/* Revisão 2: grafite, azul profundo e conteúdo sempre visível. */
:root{--blue:#104cba;--blue-ink:#073d98;--paper:#f2f3f2;--slate:#e5e8eb;--muted:#bdc5cf;--navy:#102744;--carbon:#111923;--signal:#2875ec;--stage-ink:#eef2f6;--stage-window:#1a2430;--stage-note:#c2cbd6;--head:clamp(40px,5vw,72px);--display:clamp(42px,5vw,72px);--ease:cubic-bezier(.16,1,.3,1)}
html{scroll-padding-top:28px;scrollbar-color:#435064 #111923}
::selection{background:var(--blue);color:var(--white)}
main,.header,.footer{position:relative;z-index:1}
h2{line-height:1.06;letter-spacing:-.04em}h3{letter-spacing:-.03em}
a{text-underline-offset:5px}.text-link{min-height:44px}
.text-link:hover,.scroll-link:hover,.instagram:hover{text-decoration:underline}
.hero{background:var(--black)}.footer{background:var(--black)}
.hero-statement{letter-spacing:-.03em}.button{min-height:60px;padding:17px 28px}
.services{padding:112px var(--gutter) 120px}
.service-intro{gap:7vw;margin-bottom:55px}.service-intro p{max-width:36ch}
.car-stage{top:32px;background:var(--carbon);color:var(--stage-ink);padding:30px 30px 32px}
.car-body,.hood-panel{fill:var(--stage-ink)}.car-window{fill:var(--stage-window)}
.car-detail{stroke:var(--stage-window)}.wheel circle{fill:var(--stage-ink)}.wheel .rim{fill:var(--stage-window)}.wheel .spokes{stroke:var(--stage-ink)}
.stage-caption{letter-spacing:-.03em;line-height:1.25}
.car-stage>p{color:var(--stage-note);margin-top:12px;max-width:39ch}
.hood-hotspot::before,.engine-block{background:var(--signal);fill:var(--signal)}
.engine-well{fill:#697e93}.engine-lines{stroke:var(--carbon)}
.service summary{min-height:74px;letter-spacing:-.025em}
.service{transition:background .18s}.service-content .text-link{color:var(--blue-ink)}
.workshop-background{position:fixed;z-index:0;inset:0;height:auto;pointer-events:none;background:var(--black)}
.workshop-background img{width:100%;height:100%;object-fit:cover;object-position:50% 60%;transform:none}
.workshop-background::after{background:rgba(0,0,0,.62)}
.workshop{background:transparent;isolation:auto;clip-path:none;min-height:105svh;padding:105px var(--gutter) 100px}
.workshop-heading{gap:44px}.workshop-heading h2{font-size:var(--head)}
.workshop-layout{margin-top:150px}
.address-panel{background:var(--navy);padding:32px;width:min(380px,100%);min-height:360px;gap:32px}
.address-number{font-size:96px;letter-spacing:-.04em}.address-panel address{margin-bottom:15px}
.reviews{padding:110px var(--gutter)}.review-intro h2{font-size:var(--head)}
.review-slide blockquote{font-size:clamp(22px,2vw,30px);line-height:1.4;letter-spacing:-.025em}
.google-score{margin:32px 0 14px}.score{letter-spacing:-.04em}.stars,.quote-symbol{color:var(--blue)}
.contact{background:#0c121b;padding:100px var(--gutter);display:grid;grid-template-columns:1.05fr 1fr;gap:26px 7vw;align-items:start}
.contact h2{grid-column:1;grid-row:1;font-size:var(--display);max-width:15ch;line-height:1.06;margin:0}
.contact-bottom{display:contents}.contact-bottom>div:first-child{grid-column:1;grid-row:2}
.contact-bottom>div:first-child p{margin-bottom:28px}
.contact-info{grid-column:2;grid-row:1 / 3;background:var(--navy);padding:40px;align-self:stretch;display:flex;flex-direction:column;justify-content:center;clip-path:polygon(0 0,100% 0,100% calc(100% - 28px),calc(100% - 28px) 100%,0 100%)}
.contact-info .phone{font-size:clamp(26px,2.4vw,36px);letter-spacing:-.03em;margin-bottom:20px;line-height:1.2}
.contact-info p{margin-bottom:14px}.contact .button.dark{background:var(--blue)}.contact .button.dark:hover{background:var(--blue-ink)}
.footer{padding-top:55px}.footer-top{padding-bottom:45px}

/* A montagem desloca os elementos; nunca altera sua opacidade. */
@media(prefers-reduced-motion:no-preference){
  .motion-ready [data-assemble]{transform:translateY(22px);transition:transform .65s var(--ease)}
  .motion-ready [data-assemble].is-above{transform:translateY(-14px)}
  .motion-ready [data-assemble].is-in-view{transform:none}
  .opening-running .hero-logo img{animation:brand-settle 1s var(--ease) both}
  .opening-running .hero-copy{animation:settle .7s var(--ease) .15s both}
  .opening-running .hero-actions{animation:settle .7s var(--ease) .25s both}
  .opening-running .speed-band span{animation:brand-stroke .9s var(--ease) .15s both}
  .opening-running .speed-band span+span{animation-delay:.25s}
  .review-enter{animation:settle .25s var(--ease)}
}
@keyframes brand-settle{from{transform:translateY(12px) scale(.98)}to{transform:none}}
@keyframes settle{from{transform:translateY(12px)}to{transform:none}}
@keyframes brand-stroke{from{transform:scaleX(.2)}to{transform:scaleX(1)}}
@media(hover:hover){.service:not([open]):hover{background:#dce1e6}}
@media(min-width:761px) and (max-width:1100px){
  .hero-statement{font-size:34px}.service-intro{gap:4vw}.workshop-heading{align-items:flex-start}
  .contact{gap:25px 4vw}.contact-info{padding:30px}
}
@media(max-width:760px){
  :root{--head:clamp(38px,7.2vw,52px);--display:clamp(38px,7.2vw,52px)}
  .header{min-height:96px;height:auto;padding-block:18px}
  .header nav{display:grid;grid-template-columns:auto auto;gap:2px 19px;font-size:14px}
  .header nav a{padding:5px 0}.header nav a:nth-child(2),.header nav a:nth-child(3){display:block}.small-brand span{font-size:23px}
  .hero{min-height:0}.hero-logo{padding:62px 0 52px}.hero-bottom{padding-bottom:34px}
  .hero-statement{font-size:27px;max-width:none;line-height:1.2}
  .hero-actions{margin-top:26px;gap:9px}.scroll-link{padding:16px 0;align-self:flex-start}
  .services{padding:72px var(--gutter) 120px}.service-intro{margin-bottom:30px}
  .service-intro h2{margin-bottom:23px}.service-layout{gap:26px}
  .car-stage{top:0;padding:15px 22px 27px}.stage-caption{font-size:22px}.car-stage>p{font-size:14px;margin-top:11px}
  .service summary{min-height:70px;font-size:23px}
  .workshop{padding:76px var(--gutter) 80px;min-height:110svh}
  .workshop-heading h2{font-size:clamp(34px,6.8vw,48px);margin-bottom:24px}
  .workshop-heading p{max-width:29ch}.workshop-layout{margin-top:170px}
  .workshop-background img{object-position:48% 55%}
  .address-panel{width:100%;min-height:0;padding:28px 25px;gap:23px}
  .address-number{font-size:70px}.address-panel address{margin-bottom:12px}
  .reviews{padding:76px var(--gutter)}.review-intro h2{font-size:var(--head)}
  .review-carousel{margin-top:36px}.review-slide blockquote{font-size:24px;min-height:150px}
  .contact{display:block;padding:76px var(--gutter)}.contact h2{font-size:var(--display);max-width:100%;margin-bottom:26px}
  .contact-bottom{display:block}.contact-info{margin-top:35px;padding:29px 25px}
  .contact-info .phone{font-size:26px;margin-bottom:18px}.contact-info .text-link{font-size:14px}
  .footer{padding-top:45px}.footer-top{padding-bottom:30px}
}
@media(max-width:370px){
  .header nav{gap:2px 13px}.hero-statement{font-size:24px}.hero-logo{padding:52px 0 45px}
  .service summary{font-size:21px}.stage-caption{font-size:21px}.workshop-heading h2{font-size:32px}
  .address-panel{padding:26px 20px;gap:16px}.address-number{font-size:57px}
  .review-slide blockquote{font-size:22px}.contact h2{font-size:35px}.contact-info .phone{font-size:23px}
}
@media(prefers-reduced-motion:reduce){.workshop-background{position:fixed;height:auto}}
@media print{.workshop-background{display:none}.contact{display:block}.contact-info,.address-panel{background:#eee!important;color:black!important}}

/* Indicação desenhada de toque, afastada do capô. */
.hood-cue{position:absolute;left:89%;top:23%;width:38px;height:42px;transform:translate(-50%,-50%);pointer-events:none}
.hood-cue img{display:block;width:100%;height:100%;object-fit:contain}
.address-marker{display:flex;flex-direction:column;align-items:flex-start;gap:18px;flex:none}
.location-link{display:grid;place-items:center;width:54px;height:54px;background:#193b61;transition:background .18s,transform .16s var(--ease)}
.location-link img{width:38px;height:38px}
.location-link:hover{background:#244d78}.location-link:active{transform:scale(.96)}
@media(prefers-reduced-motion:no-preference){
  .car-stage.is-in-view:not(.hood-is-open):not(.hood-instant) .hood-cue img{animation:indicate-tap 1s var(--ease) 2}
}
@keyframes indicate-tap{0%,65%,100%{transform:translateY(0)}35%{transform:translateY(5px)}}
@media(max-width:760px){.hood-cue{left:90%;top:22%;width:32px;height:36px}.address-marker{gap:15px}.location-link{width:50px;height:50px}.location-link img{width:35px;height:35px}}
