/* Second edition — the page is a single piece of paper and a single gesture. */
body{position:relative}
main,.site-footer{position:relative;z-index:1}
.ink-flow{position:absolute;inset:0 0 auto;z-index:0;pointer-events:none;overflow:hidden;contain:layout paint}
.ink-tile{position:absolute;left:0;display:block}
.hero-ink-fallback{position:absolute;left:-3%;top:115px;width:106%;height:260px;max-width:none;object-fit:fill;pointer-events:none}
.ink-flow-ready .hero-ink-fallback{visibility:hidden}
.hero{min-height:0;padding-top:22px}
.hero-scene{height:290px}
.hero-caption{margin-top:12px}
.hero-bottom{padding-top:23px;padding-bottom:24px;justify-content:center;gap:60px}
.hero-smallprint{left:7.5%;bottom:120px;font-size:8px}
.care-section{padding-top:0}
.care-section>.chapter-line{border:0;justify-content:flex-end;position:relative;margin-top:0;padding-top:5px}
.care-section>.chapter-line>span:first-child{margin-right:8%}
.care-section>.chapter-line>span:last-child{display:none}
.diagnostics-spread{min-height:575px;padding-top:25px;padding-bottom:45px;grid-template-columns:1.1fr 1fr}
.brakes-spread{min-height:590px;padding-top:25px;padding-bottom:45px}
.photo-diagnostics{transform:rotate(-3deg);width:112%;margin-left:-6%}
.photo-brakes{transform:rotate(3deg);width:108%;margin-left:0}
.ink-photo>img{height:400px;transition:transform 1.2s var(--ease),filter 1.2s var(--ease)}
.photo-diagnostics>img{mask-image:url('assets/photo-opening-diagnostics.svg');-webkit-mask-image:url('assets/photo-opening-diagnostics.svg');mask-size:100% 100%;mask-position:center;mask-repeat:no-repeat;mask-mode:alpha;object-position:53% 44%}
.photo-brakes>img{mask-image:url('assets/photo-opening-brakes.svg');-webkit-mask-image:url('assets/photo-opening-brakes.svg');mask-size:100% 100%;mask-position:center;mask-repeat:no-repeat;mask-mode:alpha;object-position:48% 46%}
.ink-photo:hover>img{transform:scale(1.018);filter:contrast(1.03)}
.diagnostics-spread .spread-copy .hand-note{top:-32px;right:18px;font-size:24px}
.service-index{padding-top:83px;padding-bottom:110px}
.service-row:before{background-image:url('assets/ink-ribbon-v2.webp');background-size:100% 250%;background-position:center;background-color:transparent;transform:scaleX(0);transform-origin:left;transition:transform .5s var(--ease)}
.service-row:hover:before,.service-row:focus-visible:before{transform:scaleX(1)}
.service-row:focus-visible{color:#fff;padding-inline:10px}
.service-row:focus-visible small{color:#deded8}
.approach-section{padding-top:115px;padding-bottom:115px;gap:7%}
.approach-copy{align-self:center}
.approach-copy h2{font-size:clamp(65px,6.7vw,104px)}
.inspection-report{background:#fdfdfb;box-shadow:3px 5px 8px #00000008,9px 20px 28px #00000013,0 0 1px #0004}
.inspection-report:after{content:'';position:absolute;inset:6px -3px -5px 3px;border:1px solid #deded7;background:#fdfdfb;transform:rotate(-.8deg);z-index:-1}
.report-wrap{padding-right:12px}
.process-section{padding-top:65px;padding-bottom:90px}
.process-steps li{transition:background-color .45s,padding-left .45s var(--ease)}
.process-steps li:hover{background:#fafaf8}
.process-steps li:hover .step-num{transform:translateY(-3px) rotate(-7deg)}
.step-num{transition:transform .45s var(--ease);transform-origin:30% 90%}
.seasonal-section{padding-bottom:225px}
.season-road>svg{display:none}
.road-car,.seasonal-section[data-active-season=trip] .road-car,.seasonal-section[data-active-season=cold] .road-car{left:0;top:0;bottom:auto;transition:none;transform-origin:50% 97.6%;will-change:transform}
.road-note{bottom:10px;right:19%;font-size:26px}
.notes-section{padding-top:90px;padding-bottom:115px}
.notes-grid{gap:44px}
.note-card{transition:transform .6s var(--ease),box-shadow .6s var(--ease)}
.note-card:hover{transform:translateY(-9px) rotate(-1deg)}
.note-b:hover{transform:translateY(-9px) rotate(1deg)}
.note-read{transition:color .3s}
.note-card:hover .note-read{color:var(--red)}
.visit-section{min-height:570px;padding-block:95px 100px}
.visit-inner{position:relative;z-index:1}
.site-footer{padding-top:5px}
.footer-illustration{position:relative;z-index:2}
.footer-illustration>img{transition:transform 1.1s var(--ease)}
.footer-illustration:hover>img{transform:translateY(-3px)}
@media(min-width:1500px){.ink-flow{max-width:100%}.hero-bottom{padding-bottom:45px}}
/* Leave room below the wheel-level stroke before the wide-screen caption. */
@media(min-width:1600px){.hero-scene{height:340px}}
@media(max-width:1000px) and (min-width:581px){
 .diagnostics-spread,.brakes-spread{min-height:525px}.ink-photo>img{height:340px}
 .approach-section{gap:5%;padding-top:100px}.approach-copy h2{font-size:64px}
 .report-wrap{padding-right:0}.hero-scene{height:270px}
}
/* Keep the angled caption in the upper-left white space, above car and ink. */
@media(min-width:801px) and (max-width:1000px){
 .hero-smallprint{top:8px;bottom:auto}
}
@media(max-width:580px){
 .hero{padding-top:31px}.hero-scene{height:200px}
 .hero-caption{margin-top:16px;padding-inline:35px}.hero-caption p{font-size:21px}
 .hero-smallprint{left:6%;bottom:0;font-size:6px}
 .hero-bottom{padding-top:18px;padding-bottom:23px;gap:37px}
 .hero-ink-fallback{top:90px;height:135px;width:120%;left:-10%}
 .care-section>.chapter-line{display:none}
 .diagnostics-spread,.brakes-spread{min-height:0;padding-top:18px;padding-bottom:72px}
 .photo-diagnostics{width:117%;margin-left:0;transform:rotate(-2deg)}
 .photo-brakes{width:117%;margin-left:0;transform:rotate(2deg)}
 .ink-photo>img{height:290px}
 .spread-copy,.brakes-spread .spread-copy{padding-top:33px;padding-left:0}
 .spread-copy h2,.brakes-spread h2{font-size:61px}
 .diagnostics-spread .spread-copy .hand-note{position:static;font-size:24px;margin:25px 0 0 75px}
 .service-index{padding-top:28px;padding-bottom:80px}
 .approach-section{padding-top:95px;padding-bottom:90px}
 .approach-copy h2{font-size:64px;line-height:.94}
 .report-wrap{padding-right:6px;padding-left:6px;margin-top:55px}
 .inspection-report{padding:25px 23px 20px}
 .process-section{padding-top:55px;padding-bottom:75px}
 .seasonal-section{padding-top:35px;padding-bottom:210px}
 .season-road{width:100%;left:0;height:180px}
 .road-note{font-size:22px;right:11%;bottom:6px}
 .notes-section{padding-top:55px;padding-bottom:72px}
 .visit-section{min-height:470px;padding:92px 20px 97px}
 .visit-inner .eyebrow{font-size:7px;max-width:250px;margin-inline:auto}
 .visit-inner h2{font-size:11.6vw}
 .site-footer{padding-top:12px}
}
@media(prefers-reduced-motion:reduce){.road-car{will-change:auto}.ink-photo:hover>img,.note-card:hover,.note-b:hover,.footer-illustration:hover>img{transform:none}}

/* Two mechanical subjects in the existing brush-cut opening. */
.photo-brakes>img{height:auto;aspect-ratio:3/2;object-position:center}
.photo-brakes>img[hidden],.care-image-status[hidden]{display:none!important}
.care-image-status{display:grid;place-items:center;min-height:250px;color:var(--muted);font-size:12px}
.paired-links [aria-pressed="true"]{color:var(--red);text-decoration:underline;text-underline-offset:7px}
@media(max-width:800px){.brakes-spread .spread-copy>.photo-brakes{margin:22px 0 0 -7%;width:114%;padding:0;order:initial}.brakes-spread .spread-copy{padding-top:20px}.photo-brakes>img{height:auto;aspect-ratio:3/2}}

.care-details{display:flex;margin-top:24px;font-size:13px}
