/* ============================================================
   JM Auto Repair — implemented from "JM Auto Repair.dc.html"
   Palette: ink #16181C · red #CE2A22 · paper #F3F2EF
   Type:    Oswald (display) · Archivo (body)
   ============================================================ */

*{box-sizing:border-box}

:root{
  --ink:#16181C;
  --ink-deep:#0F1013;
  --red:#CE2A22;
  --red-dark:#A81F18;
  --paper:#F3F2EF;
  --card-border:#D8D9DD;
  --hairline:#EFEFED;
  --hairline-2:#ECECEA;
  --muted:#565B64;
  --gray:#9CA1A9;
  --gray-light:#B4B6BA;
  --dark-line:#2C2F36;
  --dark-line-2:#3A3D42;
  --dark-line-3:#565B64;
  --body-dark:#C9CCD1;
  --red-tint:#FCE9E7;
  --oswald:'Oswald',sans-serif;
  --tribal-shift:0px;
  --tribal-spin:0deg;
  --scroll-progress:0;
  --ember:#F03A2E;
}

body{margin:0;background:#E9E8E4}
a{color:var(--red);text-decoration:none}
a:hover{color:var(--red-dark)}
button{font-family:inherit}
:focus-visible{outline:3px solid var(--red);outline-offset:2px}
::selection{background:var(--red);color:#fff}
input,select,textarea{font-family:inherit}
@media (prefers-reduced-motion: reduce){
  *{transition:none !important;animation:none !important;scroll-behavior:auto !important}
}

.site{
  font-family:'Archivo',system-ui,sans-serif;
  color:var(--ink);
  background:var(--paper);
  min-height:100vh;
  overflow-x:hidden;
}

/* Coordinated tribal artwork derived from the red car-logo linework. */
.home-hero,.page-hero,.why-section,.cta-band,.site-footer{position:relative;overflow:hidden;isolation:isolate}
.page-hero::after,.why-section::after,.cta-band::after,.site-footer::after,
.svc-overview::before,.svc-overview::after,.svc-list-section::before,.svc-list-section::after,
.pricing-section::before,.pricing-section::after,.about-section::before,.about-section::after,
.contact-section::before,.contact-section::after{
  content:"";
  position:absolute;
  z-index:0;
  background-position:center;
  background-size:contain;
  background-repeat:no-repeat;
  pointer-events:none;
}
.page-hero::after{right:-4%;bottom:calc(-18% + var(--tribal-shift));width:min(980px,72vw);aspect-ratio:5.95/1;background-image:url('../assets/tribal-patterns/02-mirrored-divider.png');opacity:.18}
.why-section::after{left:-8%;top:calc(50% + var(--tribal-shift));width:min(760px,62vw);aspect-ratio:1/1;background-image:url('../assets/tribal-patterns/05-radial-watermark.png');opacity:.075;animation:sunSpin 36s linear infinite}
@keyframes sunSpin{from{transform:translateY(-50%) rotate(0deg)}to{transform:translateY(-50%) rotate(360deg)}}
.site-footer::after{left:-4%;top:-12%;width:min(560px,55vw);aspect-ratio:1/1;background-image:url('../assets/tribal-patterns/03-upper-left-corner.png');opacity:.09}
.home-hero-in,.page-hero-in,.why-in,.cta-in,.footer-in{position:relative;z-index:1}

.svc-overview,.svc-list-section,.pricing-section,.about-section,.contact-section{position:relative;isolation:isolate}
.svc-overview::before,.svc-list-section::before,.pricing-section::before,.about-section::before,.contact-section::before{left:-10%;top:3%;width:min(330px,34vw);aspect-ratio:1/1;background-image:url('../assets/tribal-patterns/03-upper-left-corner.png');opacity:.045}
.svc-overview::after,.svc-list-section::after,.pricing-section::after,.about-section::after,.contact-section::after{right:-10%;bottom:2%;width:min(320px,32vw);aspect-ratio:1/1;background-image:url('../assets/tribal-patterns/04-lower-right-corner.png');opacity:.045}
.svc-overview > *,.svc-list-section > *,.pricing-section > *,.about-section > *,.contact-section > *{position:relative;z-index:1}

/* Scroll motion is opt-in through JS so the page remains usable without it. */
.js-reveal{opacity:0;transform:translateY(28px);transition:opacity .62s ease,transform .62s cubic-bezier(.2,.7,.2,1)}
.js-reveal.reveal-left{transform:translateX(-34px)}
.js-reveal.reveal-right{transform:translateX(34px)}
.js-reveal.is-visible{opacity:1;transform:translate(0,0)}

/* ---------- shared bits ---------- */
.phone-glyph{font-size:14px}
.red-dot{width:7px;height:7px;background:var(--red);display:inline-block}
.red-square{width:9px;height:9px;background:var(--red);display:inline-block;flex:0 0 auto}

.kicker{font-family:var(--oswald);font-weight:600;font-size:12px;letter-spacing:3px;color:var(--red);margin-bottom:10px}
.section-title{font-family:var(--oswald);font-weight:700;font-size:clamp(1.8rem,5vw,2.8rem);text-transform:uppercase;margin:0;line-height:1}
.section-title::after,.why-in h2::after,.reviews-section h2::after,.team-title::after,.faq-wrap h2::after{content:"";display:inline-block;width:clamp(72px,10vw,126px);height:28px;margin-left:12px;background:url('../assets/tribal-patterns/06-compact-flourish.png') center/contain no-repeat;vertical-align:middle}

.container{max-width:1180px;margin:0 auto;padding-left:clamp(18px,5vw,40px);padding-right:clamp(18px,5vw,40px)}

.btn-red{background:var(--red);color:#fff;border:none;font-family:var(--oswald);font-weight:600;font-size:15px;letter-spacing:1px;text-transform:uppercase;padding:15px 26px;cursor:pointer;transition:background .15s,transform .15s,box-shadow .2s}
.btn-red:hover{background:var(--red-dark);transform:translateY(-1px);box-shadow:0 10px 26px rgba(206,42,34,.38)}
.btn-ghost-light{display:inline-block;background:none;color:#fff;border:1px solid var(--dark-line-3);font-family:var(--oswald);font-weight:600;font-size:15px;letter-spacing:1px;text-transform:uppercase;padding:15px 26px;transition:border-color .15s}
.btn-ghost-light:hover{border-color:#fff;color:#fff}
.btn-outline-ink{display:inline-block;background:none;border:1px solid var(--ink);color:var(--ink);font-family:var(--oswald);font-weight:600;font-size:13px;letter-spacing:1px;text-transform:uppercase;padding:11px 18px;cursor:pointer;transition:background .15s,color .15s}
.btn-outline-ink:hover{background:var(--ink);color:#fff}
.btn-ink{display:inline-block;background:var(--ink);color:#fff;font-family:var(--oswald);font-weight:600;font-size:13px;letter-spacing:1px;text-transform:uppercase;padding:12px 18px;transition:background .15s}
.btn-ink:hover{background:#000;color:#fff}
.btn-outline-red{display:inline-block;font-family:var(--oswald);font-weight:600;font-size:13px;letter-spacing:1px;text-transform:uppercase;border:1px solid var(--red);color:var(--red);padding:11px 18px;transition:background .15s,color .15s}
.btn-outline-red:hover{background:var(--red);color:#fff}

/* ---------- header ---------- */
.site-header{position:sticky;top:0;z-index:50;background:var(--ink);border-bottom:3px solid var(--red);overflow:hidden;isolation:isolate}
.site-header::after{content:"";position:absolute;z-index:0;top:0;right:-14%;bottom:0;left:0;background:url('../assets/tribal-patterns/01-speed-sweep.png') right center/auto 150% no-repeat;opacity:.56;filter:drop-shadow(0 0 16px rgba(240,31,36,.32));pointer-events:none}
@media (max-width:880px){.site-header::after{right:-10%;background-size:auto 105%}}
.header-in{position:relative;z-index:1;max-width:1180px;margin:0 auto;padding:10px clamp(14px,4vw,32px);display:flex;flex-wrap:wrap;align-items:center;gap:10px 18px}
.brand{display:flex;align-items:center;gap:13px;margin-right:auto;cursor:pointer}
.brand-logo{height:88px;width:auto;display:block;filter:drop-shadow(0 4px 10px rgba(0,0,0,.22))}
.brand-tag{display:flex;flex-direction:column;line-height:1.05;border-left:1px solid var(--dark-line);padding-left:13px}
.brand-tag-top{font-family:var(--oswald);font-weight:500;font-size:10px;letter-spacing:2.5px;color:var(--gray)}
.brand-tag-bot{font-family:var(--oswald);font-weight:500;font-size:10px;letter-spacing:1px;color:var(--red);margin-top:3px}

.lang-toggle{display:flex;align-items:center;border:1px solid var(--dark-line-2);border-radius:2px;overflow:hidden}
.lang-toggle button{background:transparent;color:var(--gray);border:none;font-family:var(--oswald);font-weight:600;font-size:12px;letter-spacing:1px;padding:7px 13px;cursor:pointer}
.lang-toggle button.active{background:var(--red);color:#fff}

.header-call{display:inline-flex;align-items:center;gap:7px;background:var(--red);color:#fff;font-family:var(--oswald);font-weight:600;font-size:13px;letter-spacing:1px;padding:9px 14px;border-radius:2px;transition:background .15s}
.header-call:hover{background:var(--red-dark);color:#fff}

.nav-burger{display:none;background:none;border:1px solid var(--dark-line-2);border-radius:2px;width:42px;height:38px;flex-direction:column;align-items:center;justify-content:center;gap:4px;cursor:pointer;padding:0;flex:0 0 auto}
.nav-burger span{display:block;width:18px;height:2px;background:#fff;transition:transform .2s,opacity .2s}
.site-header.nav-open .nav-burger span:nth-child(1){transform:translateY(6px) rotate(45deg)}
.site-header.nav-open .nav-burger span:nth-child(2){opacity:0}
.site-header.nav-open .nav-burger span:nth-child(3){transform:translateY(-6px) rotate(-45deg)}

#offer-slot .offer-band{display:none} /* desktop: the banner renders inside main */

.main-nav{order:3;flex-basis:100%;display:flex;flex-wrap:wrap;gap:2px;margin-top:6px;padding-top:6px;position:relative}
.main-nav::before{content:"";position:absolute;top:0;left:0;height:1px;width:min(510px,72vw);background:linear-gradient(90deg,var(--dark-line) 0 78%,transparent)}
.nav-btn{position:relative;display:inline-block;background:none;border:none;color:var(--body-dark);font-family:var(--oswald);font-weight:600;font-size:13px;letter-spacing:1.5px;text-transform:uppercase;padding:7px 12px;cursor:pointer;transition:color .15s}
.nav-btn:hover{color:#fff}
.nav-btn:has(.nav-underline){color:#fff}
.nav-btn::after{content:"";position:absolute;left:12px;right:12px;bottom:0;height:3px;background:var(--red);transform:scaleX(0);transform-origin:left;transition:transform .22s cubic-bezier(.2,.7,.2,1)}
.nav-btn:hover::after{transform:scaleX(1)}
.nav-btn:has(.nav-underline)::after{display:none}
/* mobile: single-row header (logo + lang + hamburger); page links live in a
   dropdown under the header; the deal banner rides above it via #offer-slot */
@media (max-width:720px){
  .site-header{overflow:visible}
  .site-header::after{display:none}
  .header-in{flex-wrap:nowrap;gap:10px;padding:8px 14px}
  .brand-tag{display:none}
  .brand-logo{height:46px}
  .header-call{display:none}
  .lang-toggle{margin-left:auto;flex:0 0 auto}
  .lang-toggle button{padding:7px 10px;font-size:11px}
  .nav-burger{display:flex}
  .main-nav{display:none;position:absolute;top:100%;left:0;right:0;z-index:60;background:var(--ink);border-bottom:3px solid var(--red);flex-direction:column;gap:0;margin:0;padding:4px 0 8px;box-shadow:0 16px 32px rgba(0,0,0,.4)}
  .main-nav::before{display:none}
  .site-header.nav-open .main-nav{display:flex}
  .nav-btn{padding:13px 20px;font-size:13px;letter-spacing:1.5px;text-align:left;white-space:nowrap}
  .nav-btn::after{display:none}
  #offer-slot .offer-band{display:block}
  main .offer-band{display:none}
}
.nav-btn .nav-underline{position:absolute;left:12px;right:12px;bottom:0;height:3px;background:var(--red)}

/* ---------- page hero (dark banner) ---------- */
.page-hero{background:var(--ink);color:#fff}
.page-hero-in{max-width:1180px;margin:0 auto;padding:clamp(40px,7vw,72px) clamp(18px,5vw,40px)}
.page-hero h1{font-family:var(--oswald);font-weight:700;font-size:clamp(2rem,6vw,3.4rem);text-transform:uppercase;margin:0 0 14px;line-height:1}
.page-hero h1:last-child{margin-bottom:0}
.page-hero .intro{font-size:1.05rem;color:var(--body-dark);max-width:56ch;line-height:1.5;margin:0}
.page-hero .intro.narrow{max-width:52ch}
.hero-note{margin-top:20px;display:inline-flex;align-items:center;gap:10px;border:1px solid var(--dark-line-2);padding:10px 16px;font-family:var(--oswald);font-weight:500;font-size:13px;letter-spacing:.5px;color:var(--gray)}
.hero-note .red-square{width:8px;height:8px}

/* ---------- services hero portrait ---------- */
.services-hero{min-height:clamp(430px,46vw,630px);display:flex;align-items:center;background:var(--ink-deep)}
.services-hero::before{content:"";position:absolute;inset:0;z-index:0;background-image:linear-gradient(90deg,rgba(9,10,12,.98) 0%,rgba(9,10,12,.91) 34%,rgba(9,10,12,.52) 55%,rgba(9,10,12,.08) 78%),url('../assets/heroes/services-owner-tools.webp');background-position:center 12%;background-size:cover;background-repeat:no-repeat}
.services-hero::after{opacity:.1}
.services-hero .page-hero-in{width:100%;padding-top:clamp(58px,8vw,92px);padding-bottom:clamp(58px,8vw,92px)}
.services-hero h1{font-size:clamp(2.6rem,6.8vw,4.8rem);text-shadow:0 3px 20px rgba(0,0,0,.52)}
.services-hero .intro{color:#D0D2D6;text-shadow:0 2px 14px rgba(0,0,0,.5)}
.services-hero .hero-note{max-width:46ch;background:rgba(11,13,16,.68);border-color:rgba(255,255,255,.25);color:#E5E6E8;backdrop-filter:blur(4px)}
@media (max-width:720px){
  .services-hero{min-height:690px;align-items:flex-end}
  .services-hero::before{background-image:linear-gradient(180deg,rgba(9,10,12,.05) 0%,rgba(9,10,12,.2) 36%,rgba(9,10,12,.9) 65%,var(--ink-deep) 84%),url('../assets/heroes/services-owner-tools.webp');background-position:82% 12%}
  .services-hero::after{opacity:.05}
  .services-hero .page-hero-in{padding-top:340px;padding-bottom:48px}
  .services-hero h1{font-size:clamp(2.5rem,13vw,3.8rem)}
}

/* ---------- home hero ---------- */
.home-hero{background:var(--ink);color:#fff;position:relative;overflow:hidden}
.home-hero::before{content:"";position:absolute;z-index:1;inset:0;background:linear-gradient(90deg,var(--ink) 0%,rgba(22,24,28,.96) 32%,rgba(22,24,28,.68) 55%,rgba(22,24,28,.12) 84%);pointer-events:none}
.home-hero-slides{position:absolute;z-index:0;inset:0;background:var(--ink-deep)}
.home-hero-slide{position:absolute;inset:0;opacity:0;background-size:cover;background-repeat:no-repeat;transition:opacity 1.2s ease;will-change:opacity}
.home-hero-slide.is-active{opacity:.88}
.home-hero-slide--outside{background-image:url('../assets/heroes/contact-owner-waving-neat.webp');background-position:center 36%}
.home-hero-slide--service{background-image:url('../assets/shop-mechanic-hero.webp');background-position:center 34%}
.home-hero-slide--customer{background-image:url('../assets/heroes/pricing-woman-driving-happy.webp');background-position:center 40%}
.home-hero-in{position:relative;z-index:2;max-width:1180px;margin:0 auto;padding:clamp(44px,9vw,96px) clamp(18px,5vw,40px) clamp(96px,13vw,140px)}
.hero-slideshow-controls{position:absolute;z-index:3;top:18px;right:clamp(18px,5vw,40px);display:flex;align-items:center;gap:9px;padding:8px 10px;background:rgba(9,10,12,.62);border:1px solid rgba(255,255,255,.25);backdrop-filter:blur(5px)}
.hero-slide-dot{width:11px;height:11px;padding:0;border:1px solid rgba(255,255,255,.75);border-radius:50%;background:transparent;cursor:pointer;transition:background-color .2s,transform .2s,border-color .2s}
.hero-slide-dot.is-active{background:var(--red);border-color:var(--red);transform:scale(1.18)}
.hero-slide-pause{position:relative;width:26px;height:26px;padding:0;margin-left:5px;border:1px solid rgba(255,255,255,.55);border-radius:50%;background:rgba(255,255,255,.1);cursor:pointer;transition:background .2s,border-color .2s,transform .2s}
.hero-slide-pause:hover{background:var(--red);border-color:var(--red);transform:scale(1.1)}
.hero-slide-pause span{display:none}
/* pause: two bars drawn in CSS (text glyphs render inconsistently on phones) */
.hero-slide-pause::before,.hero-slide-pause::after{content:"";position:absolute;top:50%;width:2.5px;height:9px;background:#fff;transform:translateY(-50%)}
.hero-slide-pause::before{left:calc(50% - 4px)}
.hero-slide-pause::after{left:calc(50% + 1.5px)}
/* play: triangle when paused */
.hero-slide-pause[aria-pressed="true"]::before{left:50%;width:0;height:0;background:transparent;border-left:8px solid #fff;border-top:5px solid transparent;border-bottom:5px solid transparent;transform:translate(-38%,-50%)}
.hero-slide-pause[aria-pressed="true"]::after{display:none}
.hero-eyebrow{display:inline-flex;align-items:center;gap:8px;border:1px solid var(--dark-line-2);padding:6px 12px;font-family:var(--oswald);font-weight:600;font-size:12px;letter-spacing:2px;color:var(--gray);margin-bottom:22px}
.home-hero h1{font-family:var(--oswald);font-weight:700;font-size:clamp(2.2rem,6.2vw,4.2rem);line-height:.98;letter-spacing:-0.5px;text-transform:uppercase;margin:0 0 18px;max-width:17ch;text-wrap:balance}
.home-hero .hero-sub{font-size:clamp(1.05rem,2.4vw,1.35rem);line-height:1.5;color:var(--body-dark);max-width:44ch;margin:0 0 30px}
.hero-actions{display:flex;flex-wrap:wrap;gap:12px;margin-bottom:26px}
.hero-lang{position:absolute;left:0;right:0;bottom:clamp(30px,4.5vw,48px);z-index:1;display:flex;align-items:center;justify-content:center;gap:14px;font-family:var(--oswald);font-weight:600;font-size:clamp(12px,1.8vw,15px);letter-spacing:2.6px;text-transform:uppercase;color:var(--body-dark);animation:heroRise .7s .64s cubic-bezier(.2,.7,.2,1) both;pointer-events:none}
.hero-lang .woven-mark{width:44px;height:9px;background:repeating-linear-gradient(90deg,var(--red) 0 6px,transparent 6px 10px,#5A5E66 10px 13px,transparent 13px 17px);clip-path:polygon(0 50%,12% 0,24% 50%,36% 0,48% 50%,60% 0,72% 50%,84% 0,100% 50%,84% 100%,72% 50%,60% 100%,48% 50%,36% 100%,24% 50%,12% 100%);flex:0 0 auto}
.hero-lang .woven-mark:last-child{transform:scaleX(-1)}
/* mobile: hablamos strip rides directly under the deal banner (first in the
   hero column) instead of floating over the photo */
@media (max-width:720px){
  .home-hero{display:flex;flex-direction:column}
  .home-hero::before{background:linear-gradient(180deg,rgba(9,10,12,.08) 0%,rgba(9,10,12,.08) 32%,rgba(9,10,12,.6) 64%,rgba(15,16,19,.98) 88%)}
  .home-hero-slide.is-active{opacity:1}
  .home-hero-slide--outside{background-position:76% top}
  .home-hero-slide--service{background-position:64% top}
  .home-hero-slide--customer{background-position:68% 12%}
  .hero-slideshow-controls{top:58px;right:14px}
  .hero-lang{position:static;order:-1;padding:13px 0;background:var(--ink-deep)}
  .home-hero-in{padding-top:344px;padding-bottom:48px}
  /* mobile hero: big photo, heading, two buttons */
  .hero-eyebrow,.home-hero .hero-sub{display:none}
  /* FREE ESTIMATES badge pinned to the hero's top-left corner */
  .home-hero .hero-rates{position:absolute;top:14px;left:14px;z-index:4;margin:0;background:rgba(9,10,12,.72);backdrop-filter:blur(4px)}
  .home-hero h1{margin-bottom:16px;text-shadow:0 3px 18px rgba(0,0,0,.6)}
  /* stacked on the left so the floating call + chat buttons stay unblocked */
  .hero-actions{flex-direction:column;align-items:stretch;margin:0 clamp(110px,30vw,150px) 0 0;gap:10px}
  .hero-actions .btn-red,.hero-actions .btn-ghost-light{text-align:center}
}
.hero-rates{display:inline-flex;flex-wrap:wrap;gap:0;border:1px solid var(--dark-line-2)}
.hero-rates span{font-family:var(--oswald);font-weight:600;font-size:13px;letter-spacing:1px;padding:10px 16px}
.hero-rates .rate-labor{color:#fff;border-right:1px solid var(--dark-line-2)}
.hero-rates .rate-free{color:var(--red)}

.community-strip{position:relative;z-index:2;background:var(--paper);border-bottom:1px solid var(--card-border);color:var(--ink)}
.community-strip::after{content:"";position:absolute;left:50%;top:50%;width:min(760px,82vw);height:34px;background:url('../assets/tribal-patterns/02-mirrored-divider.png') center/contain no-repeat;opacity:.16;transform:translate(-50%,-50%);pointer-events:none}
.community-strip .ticker{position:relative;z-index:1}
.community-strip-in{max-width:1180px;margin:0 auto;padding:12px clamp(18px,5vw,40px);display:flex;align-items:center;justify-content:center;gap:12px;font-family:var(--oswald);font-weight:600;letter-spacing:1.6px;text-transform:uppercase;font-size:12px;text-align:center}
.community-strip .woven-mark{width:54px;height:10px;background:repeating-linear-gradient(90deg,var(--red) 0 6px,transparent 6px 10px,var(--ink) 10px 13px,transparent 13px 17px);clip-path:polygon(0 50%,12% 0,24% 50%,36% 0,48% 50%,60% 0,72% 50%,84% 0,100% 50%,84% 100%,72% 50%,60% 100%,48% 50%,36% 100%,24% 50%,12% 100%);flex:0 0 auto}

/* ---------- first-time offer band ---------- */
.offer-band{background:var(--red);color:#fff}
.offer-band{position:relative;overflow:hidden;isolation:isolate}
.offer-in{max-width:1180px;margin:0 auto;padding:clamp(26px,5vw,44px) clamp(18px,5vw,40px);display:flex;flex-wrap:wrap;align-items:center;gap:22px 40px}
.offer-in{position:relative;z-index:1}
.offer-copy{flex:1 1 300px}
.offer-tag{font-family:var(--oswald);font-weight:600;font-size:12px;letter-spacing:3px;opacity:.85;margin-bottom:8px}
.offer-title{font-family:var(--oswald);font-weight:700;font-size:clamp(1.5rem,4vw,2.2rem);line-height:1.05;text-transform:uppercase}
.offer-body{margin:10px 0 0;font-size:1rem;line-height:1.5;max-width:46ch;color:var(--red-tint)}
.offer-price{display:flex;align-items:baseline;gap:14px;flex:0 0 auto}
.offer-now{font-family:var(--oswald);font-weight:700;font-size:clamp(3rem,9vw,4.5rem);line-height:1}

.offer-cta{display:inline-flex;align-items:center;gap:8px;background:#fff;color:var(--ink);font-family:var(--oswald);font-weight:700;font-size:13px;letter-spacing:1.4px;text-transform:uppercase;padding:12px 20px;white-space:nowrap;transition:transform .15s,box-shadow .2s}
.offer-cta:hover{color:var(--ink);transform:translateY(-1px);box-shadow:0 8px 22px rgba(0,0,0,.28)}
.offer-cta::before{content:"\2192";font-size:15px}

/* compact form when the offer rides at the very top, under the nav */
.offer-top .offer-in{max-width:1400px;padding:clamp(12px,2.4vw,18px) clamp(18px,3vw,36px);gap:8px 32px;align-items:center}
.offer-top .offer-tag{font-size:10px;letter-spacing:2.4px;margin-bottom:3px}
.offer-top .offer-title{font-size:clamp(1.05rem,2.6vw,1.45rem)}
.offer-top .offer-body{display:none}
.offer-top .offer-price{gap:10px;margin-left:auto}
.offer-top .offer-now{font-size:clamp(1.8rem,4.5vw,2.5rem)}
.offer-top .offer-was{font-size:1rem}
.offer-top .offer-note{font-size:10px}

/* burnout car doing laps: rolls in, burnout + smoke + skid, launches off the
   right edge, then wraps back in from the left for three cruise laps (short
   off-screen pit pauses between) before the next burnout. step-end holds make
   the right→left wrap invisible — the car never drives backwards. */
.offer-car{position:absolute;left:50%;top:50%;z-index:0;width:clamp(130px,17vw,230px);pointer-events:none;animation:offerDrive 18s cubic-bezier(.45,0,.55,1) 1.2s infinite;transform:translate(calc(-50% - 82vw),-50%)}
.offer-car img{display:block;width:100%;height:auto;filter:brightness(.22) drop-shadow(0 2px 6px rgba(0,0,0,.35))}
.offer-car::before{content:"";position:absolute;left:-34%;bottom:-32%;width:82%;aspect-ratio:1.15/1;opacity:0;filter:blur(5px);transform-origin:72% 88%;background:
  radial-gradient(circle at 66% 80%,rgba(255,255,255,.9) 0 13%,transparent 42%),
  radial-gradient(circle at 46% 68%,rgba(240,238,236,.75) 0 16%,transparent 48%),
  radial-gradient(circle at 58% 48%,rgba(252,251,250,.6) 0 14%,transparent 46%),
  radial-gradient(circle at 30% 78%,rgba(228,226,224,.65) 0 14%,transparent 44%),
  radial-gradient(circle at 40% 34%,rgba(244,242,240,.45) 0 15%,transparent 48%),
  radial-gradient(circle at 18% 58%,rgba(220,218,216,.5) 0 12%,transparent 40%);
  animation:offerSmoke 18s cubic-bezier(.3,.6,.4,1) 1.2s infinite}
.offer-car::after{content:"";position:absolute;left:-16%;bottom:-24%;width:52%;aspect-ratio:1/1;opacity:0;filter:blur(8px);transform-origin:78% 92%;background:
  radial-gradient(circle at 58% 72%,rgba(255,255,255,.75) 0 15%,transparent 48%),
  radial-gradient(circle at 34% 48%,rgba(238,236,234,.6) 0 18%,transparent 54%),
  radial-gradient(circle at 52% 28%,rgba(248,246,244,.4) 0 14%,transparent 46%);
  animation:offerSmokeWisp 18s cubic-bezier(.25,.5,.4,1) 1.2s infinite}
@keyframes offerDrive{
  0%{transform:translate(calc(-50% - 82vw),-50%)}
  10%{transform:translate(-50%,-50%)}
  13%{transform:translate(calc(-50% + .2vw),-50%) rotate(-1.2deg)}
  16%{transform:translate(-50%,-50%) rotate(1deg)}
  19%{transform:translate(calc(-50% + .3vw),-50%) rotate(-1deg)}
  22%{transform:translate(-50%,-50%) rotate(1.1deg)}
  25%{transform:translate(calc(-50% + .2vw),-50%) rotate(-1deg)}
  28%{transform:translate(-50%,-50%) rotate(.8deg)}
  30%{transform:translate(calc(-50% + 1.5vw),-50%) skewX(-5deg)}
  38%{transform:translate(calc(-50% + 75vw),-50%) skewX(-11deg);animation-timing-function:step-end}
  40%{transform:translate(calc(-50% - 82vw),-50%)}
  44%{transform:translate(calc(-50% - 82vw),-50%)}
  58%{transform:translate(calc(-50% + 75vw),-50%) skewX(-8deg);animation-timing-function:step-end}
  60%{transform:translate(calc(-50% - 82vw),-50%)}
  66%{transform:translate(calc(-50% - 82vw),-50%)}
  80%{transform:translate(calc(-50% + 75vw),-50%) skewX(-6deg);animation-timing-function:step-end}
  82%,100%{transform:translate(calc(-50% - 82vw),-50%)}
}
@keyframes offerSmoke{
  0%,10%{opacity:0;transform:scale(.3,.2)}
  13%{opacity:.75;transform:scale(.6,.42) rotate(-3deg)}
  16%{opacity:.95;transform:scale(.85,.68) rotate(2deg) translate(-3%,-2%)}
  19%{opacity:.85;transform:scale(1.02,.9) rotate(-2.5deg) translate(-7%,-6%)}
  22%{opacity:.95;transform:scale(1.18,1.12) rotate(2deg) translate(-11%,-11%)}
  26%{opacity:.8;transform:scale(1.4,1.38) rotate(-2deg) translate(-17%,-17%)}
  33%{opacity:0;transform:scale(2,2.05) rotate(4deg) translate(-32%,-30%)}
  34%,100%{opacity:0;transform:scale(.3,.2)}
}
@keyframes offerSmokeWisp{
  0%,14%{opacity:0;transform:scale(.3,.22)}
  18%{opacity:.7;transform:scale(.7,.6) rotate(5deg)}
  22%{opacity:.8;transform:scale(1,.95) rotate(-4deg) translate(-8%,-14%)}
  27%{opacity:.55;transform:scale(1.3,1.3) rotate(3deg) translate(-15%,-26%)}
  33%{opacity:0;transform:scale(1.8,1.9) rotate(-3deg) translate(-26%,-42%)}
  34%,100%{opacity:0;transform:scale(.3,.22)}
}
.offer-top::before{content:"";position:absolute;left:calc(50% - 14vw);top:64%;z-index:0;height:4px;width:13vw;background:linear-gradient(90deg,transparent,rgba(0,0,0,.45) 35%,rgba(0,0,0,.5) 75%,rgba(0,0,0,.32));opacity:0;animation:offerSkid 18s linear 1.2s infinite;pointer-events:none}
@keyframes offerSkid{
  0%,12%{opacity:0}
  17%{opacity:.4}
  28%{opacity:.55}
  46%{opacity:0}
  47%,100%{opacity:0}
}
/* mobile: park the burnout on the left, below the offer text, instead of
   dead-center where it collides with the wrapped copy. Same choreography,
   wider launch throw so the car fully clears the narrow viewport. */
@media (max-width:720px){
  .offer-car{width:110px;left:48%;top:68%;animation-name:offerDriveM}
  .offer-top::before{left:calc(48% - 15vw);width:14vw;top:84%}
  /* the title already says "— $60"; the big price cluster is redundant here
     and hiding it lets the white CTA ride up beside the copy */
  .offer-top .offer-price{display:none}
  .offer-top .offer-in{gap:6px 20px}
  /* white CTA pinned to the banner's top-right; copy keeps clear of it */
  .offer-top .offer-cta{position:absolute;top:10px;right:12px;z-index:2;padding:9px 13px;font-size:11px}
  .offer-top .offer-copy{padding-right:min(170px,38vw)}
}
@keyframes offerDriveM{
  0%{transform:translate(calc(-50% - 82vw),-50%)}
  10%{transform:translate(-50%,-50%)}
  13%{transform:translate(calc(-50% + .2vw),-50%) rotate(-1.2deg)}
  16%{transform:translate(-50%,-50%) rotate(1deg)}
  19%{transform:translate(calc(-50% + .3vw),-50%) rotate(-1deg)}
  22%{transform:translate(-50%,-50%) rotate(1.1deg)}
  25%{transform:translate(calc(-50% + .2vw),-50%) rotate(-1deg)}
  28%{transform:translate(-50%,-50%) rotate(.8deg)}
  30%{transform:translate(calc(-50% + 1.5vw),-50%) skewX(-5deg)}
  38%{transform:translate(calc(-50% + 110vw),-50%) skewX(-11deg);animation-timing-function:step-end}
  40%{transform:translate(calc(-50% - 82vw),-50%)}
  44%{transform:translate(calc(-50% - 82vw),-50%)}
  58%{transform:translate(calc(-50% + 110vw),-50%) skewX(-8deg);animation-timing-function:step-end}
  60%{transform:translate(calc(-50% - 82vw),-50%)}
  66%{transform:translate(calc(-50% - 82vw),-50%)}
  80%{transform:translate(calc(-50% + 110vw),-50%) skewX(-6deg);animation-timing-function:step-end}
  82%,100%{transform:translate(calc(-50% - 82vw),-50%)}
}
.offer-was-wrap{display:flex;flex-direction:column}
.offer-was{font-family:var(--oswald);text-decoration:line-through;opacity:.7;font-size:1.3rem}
.offer-note{font-family:var(--oswald);font-weight:600;font-size:12px;letter-spacing:1px}

/* ---------- services overview (home) ---------- */
.svc-overview{max-width:1180px;margin:0 auto;padding:clamp(48px,8vw,84px) clamp(18px,5vw,40px)}
.svc-overview-head{display:flex;flex-wrap:wrap;align-items:flex-end;justify-content:space-between;gap:16px;margin-bottom:34px}
.kicker-sm{font-family:var(--oswald);font-weight:600;font-size:12px;letter-spacing:3px;color:var(--red);margin-bottom:8px}
.svc-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px}
.svc-card{position:relative;overflow:hidden;background:var(--ink);border:1px solid var(--dark-line);color:#fff;display:flex;flex-direction:column;min-width:0;transition:border-color .2s,transform .25s cubic-bezier(.2,.7,.2,1),box-shadow .25s}
.svc-card::after{content:"";position:absolute;z-index:3;left:0;top:0;height:4px;width:100%;background:linear-gradient(90deg,var(--red),var(--ember));transform:scaleX(0);transform-origin:left;transition:transform .3s cubic-bezier(.2,.7,.2,1)}
.svc-card:hover{border-color:var(--red);transform:translateY(-6px);box-shadow:0 18px 40px rgba(22,24,28,.25)}
.svc-card:hover::after{transform:scaleX(1)}
.svc-media{position:relative;overflow:hidden;aspect-ratio:3/2;background:#0f1114}
.svc-media::after{content:"";position:absolute;inset:45% 0 0;background:linear-gradient(180deg,transparent,rgba(16,18,22,.58));pointer-events:none}
.svc-media img{display:block;width:100%;height:100%;object-fit:cover;transition:transform .55s cubic-bezier(.2,.7,.2,1),filter .3s}
.svc-card:hover .svc-media img{transform:scale(1.045);filter:contrast(1.04) saturate(1.04)}
.svc-card .num{position:absolute;z-index:2;left:14px;top:14px;display:inline-flex;align-items:center;justify-content:center;min-width:42px;height:32px;padding:0 10px;background:var(--red);color:#fff;font-family:var(--oswald);font-weight:700;font-size:13px;letter-spacing:1.5px;box-shadow:0 5px 18px rgba(0,0,0,.3)}
.svc-card-body{display:flex;flex:1;flex-direction:column;gap:9px;padding:20px 20px 22px;border-top:1px solid var(--dark-line)}
.svc-card .name{font-family:var(--oswald);font-weight:700;font-size:1.2rem;text-transform:uppercase;line-height:1.1;color:#fff}
.svc-card .sample{font-size:.9rem;color:#B5B8BE;line-height:1.5}
@media (max-width:900px){.svc-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:560px){.svc-grid{grid-template-columns:1fr;gap:16px}.svc-card-body{padding:18px}.svc-card .name{font-size:1.15rem}}

/* ---------- why / trust ---------- */
.why-section{background:var(--ink);color:#fff}
.why-in{max-width:1180px;margin:0 auto;padding:clamp(48px,8vw,80px) clamp(18px,5vw,40px)}
.why-in h2{font-family:var(--oswald);font-weight:700;font-size:clamp(1.8rem,5vw,2.8rem);text-transform:uppercase;margin:0 0 30px;line-height:1}
.why-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:1px;background:var(--dark-line);border:1px solid var(--dark-line)}
.why-cell{background:var(--ink);padding:24px 20px}
.why-cell .t{font-family:var(--oswald);font-weight:700;font-size:1.15rem;text-transform:uppercase;color:#fff;margin-bottom:8px;display:flex;align-items:center;gap:9px}
.why-cell p{margin:0;color:var(--gray);font-size:.95rem;line-height:1.5}

/* ---------- hours + location (home) ---------- */
.info-section{max-width:1180px;margin:0 auto;padding:clamp(48px,8vw,80px) clamp(18px,5vw,40px);display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:26px}
.info-card{background:#fff;border:1px solid var(--card-border);padding:clamp(22px,4vw,32px)}
.info-card h3{font-family:var(--oswald);font-weight:700;font-size:1.4rem;text-transform:uppercase;margin:0 0 16px}
.info-card.loc{display:flex;flex-direction:column}
.hours-row{display:flex;justify-content:space-between;gap:16px;padding:10px 0;border-bottom:1px solid var(--hairline-2)}
.hours-row .day{font-family:var(--oswald);font-weight:500;letter-spacing:.5px;text-transform:uppercase;font-size:.95rem}
.hours-row .time{font-weight:600;color:var(--ink)}
.hours-vary{margin:14px 0 0;font-size:.85rem;color:var(--gray);font-style:italic}
.loc-addr{font-family:var(--oswald);font-weight:500;font-size:1.15rem;line-height:1.35;margin-bottom:6px}
.loc-serving{margin:0 0 18px;color:var(--muted);font-size:.95rem}
.loc-actions{display:flex;flex-wrap:wrap;gap:10px;margin-top:auto}

/* ---------- reviews slot ---------- */
.reviews-section{max-width:1180px;margin:0 auto;padding:clamp(44px,7vw,72px) clamp(18px,5vw,40px) clamp(48px,8vw,80px)}
.reviews-section h2{font-family:var(--oswald);font-weight:700;font-size:clamp(1.6rem,4vw,2.3rem);text-transform:uppercase;margin:0 0 18px}
.reviews-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:16px}
.review-card{background:#fff;border:1px solid var(--card-border);border-top:4px solid var(--red);padding:22px;display:flex;flex-direction:column;gap:10px}
.review-stars{color:var(--red);font-size:1.05rem;letter-spacing:3px}
.review-text{margin:0;color:var(--dark-line);line-height:1.55;font-size:.97rem;flex:1}
.review-meta{display:flex;justify-content:space-between;align-items:baseline;gap:10px;border-top:1px solid var(--hairline);padding-top:10px}
.review-name{font-family:var(--oswald);font-weight:600;font-size:.95rem;text-transform:uppercase;letter-spacing:.5px}
.review-src{font-family:var(--oswald);font-size:11px;letter-spacing:1px;color:var(--gray)}
.reviews-foot{margin-top:18px;text-align:center}

.reviews-slot{border:1px solid var(--card-border);background:#fff;padding:clamp(28px,5vw,44px);text-align:center}
.reviews-slot p{margin:0 0 14px;color:var(--muted);font-size:1rem;max-width:52ch;margin-left:auto;margin-right:auto;line-height:1.5}
.slot-note{font-family:var(--oswald);font-size:11px;letter-spacing:1px;color:var(--gray-light);margin-top:16px}

/* ---------- services page ---------- */
.svc-list-section{max-width:1180px;margin:0 auto;padding:clamp(40px,7vw,72px) clamp(18px,5vw,40px)}
.svc-list-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:16px}
.svc-group{background:#fff;border:1px solid var(--card-border);border-top:4px solid var(--red);padding:22px 22px 8px}
.svc-group-head{display:flex;align-items:baseline;gap:10px;margin-bottom:12px}
.svc-group-head .num{font-family:var(--oswald);font-weight:700;font-size:13px;color:var(--gray)}
.svc-group-head h3{font-family:var(--oswald);font-weight:700;font-size:1.25rem;text-transform:uppercase;margin:0;line-height:1.1}
.svc-group ul{list-style:none;margin:0;padding:0}
.svc-group li{display:flex;gap:9px;padding:7px 0;border-top:1px solid var(--hairline);font-size:.95rem;color:var(--dark-line)}
.svc-group li .mark{color:var(--red);font-weight:700}

/* ---------- pricing page ---------- */
.pricing-section{max-width:1180px;margin:0 auto;padding:clamp(40px,7vw,64px) clamp(18px,5vw,40px)}
.rate-banner{display:flex;flex-wrap:wrap;gap:14px;margin-bottom:28px}
.rate-tile{flex:1 1 200px;padding:22px 24px}
.rate-tile.dark{background:var(--ink);color:#fff}
.rate-tile.red{background:var(--red);color:#fff}
.rate-tile.light{background:#fff;border:1px solid var(--card-border)}
.rate-label{font-family:var(--oswald);font-weight:600;font-size:12px;letter-spacing:2px;color:var(--gray)}
.rate-big{font-family:var(--oswald);font-weight:700;font-size:clamp(2rem,6vw,2.8rem);line-height:1;margin-top:4px}
.rate-big .per{font-size:1.1rem;color:var(--red)}
.rate-tile.dark p{margin:8px 0 0;font-size:.85rem;color:var(--gray);line-height:1.4}
.rate-tile-title{font-family:var(--oswald);font-weight:700;font-size:1.3rem;text-transform:uppercase}
.rate-tile.red p{margin:8px 0 0;font-size:.9rem;color:var(--red-tint);line-height:1.4}
.rate-tile.light p{margin:8px 0 0;font-size:.9rem;color:var(--muted);line-height:1.4}

.labor-only{background:#FDF3E7;border:1px solid #E7C99A;color:#7A5A1E;padding:12px 16px;font-family:var(--oswald);font-weight:600;font-size:13px;letter-spacing:.5px;margin-bottom:14px;display:flex;align-items:center;gap:10px}

.price-table{background:#fff;border:1px solid var(--card-border)}
.price-table-head{display:flex;justify-content:space-between;background:var(--ink);color:#fff;padding:12px 18px;font-family:var(--oswald);font-weight:600;font-size:12px;letter-spacing:1.5px;text-transform:uppercase}
.price-row{display:flex;justify-content:space-between;align-items:center;gap:16px;padding:13px 18px;border-top:1px solid var(--hairline)}
.price-row .name{font-size:.98rem;color:var(--dark-line)}
.price-row .price{font-family:var(--oswald);font-weight:700;font-size:1.05rem;color:var(--ink);white-space:nowrap}

.policy-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:16px;margin-top:24px}
.policy-card{background:#fff;border:1px solid var(--card-border);border-left:4px solid var(--ink);padding:22px}
.policy-card h3{font-family:var(--oswald);font-weight:700;font-size:1.2rem;text-transform:uppercase;margin:0 0 10px}
.policy-card p{margin:0;font-size:.95rem;color:var(--muted);line-height:1.55}

/* ---------- about page ---------- */
.about-section{max-width:1180px;margin:0 auto;padding:clamp(40px,7vw,72px) clamp(18px,5vw,40px)}
.about-top{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:26px;align-items:start}
/* ---------- pricing hero (happy drive-off) ---------- */
.pricing-hero{min-height:clamp(400px,42vw,560px);display:flex;align-items:center;background:var(--ink-deep)}
.pricing-hero::before{content:"";position:absolute;inset:0;z-index:0;background-image:linear-gradient(90deg,rgba(9,10,12,.97) 0%,rgba(9,10,12,.89) 32%,rgba(9,10,12,.5) 56%,rgba(9,10,12,.06) 80%),url('../assets/heroes/pricing-woman-driving-happy.webp');background-position:center 35%;background-size:cover;background-repeat:no-repeat}
.pricing-hero::after{opacity:.08}
.pricing-hero .page-hero-in{max-width:1400px;width:100%;padding-left:clamp(18px,3vw,36px)}
.pricing-hero h1{text-shadow:0 3px 20px rgba(0,0,0,.52)}
.pricing-hero .intro{color:#D0D2D6;text-shadow:0 2px 14px rgba(0,0,0,.5)}
.pricing-hero .hero-note{background:rgba(11,13,16,.68);border-color:rgba(255,255,255,.25);color:#E5E6E8;backdrop-filter:blur(4px)}
@media (max-width:720px){
  .pricing-hero{min-height:560px;align-items:flex-end}
  .pricing-hero::before{background-image:linear-gradient(180deg,rgba(9,10,12,.05) 0%,rgba(9,10,12,.22) 40%,rgba(9,10,12,.9) 70%,var(--ink-deep) 88%),url('../assets/heroes/pricing-woman-driving-happy.webp');background-position:80% 85%}
  .pricing-hero .page-hero-in{padding-top:280px;padding-bottom:44px}
}

/* ---------- contact hero (shop welcome) ---------- */
.contact-hero{min-height:clamp(400px,42vw,560px);display:flex;align-items:center;background:var(--ink-deep)}
.contact-hero::before{content:"";position:absolute;inset:0;z-index:0;background-image:linear-gradient(90deg,rgba(9,10,12,.97) 0%,rgba(9,10,12,.89) 32%,rgba(9,10,12,.5) 56%,rgba(9,10,12,.06) 80%),url('../assets/heroes/contact-owner-waving-neat.webp');background-position:center 35%;background-size:cover;background-repeat:no-repeat}
.contact-hero::after{opacity:.08}
.contact-hero .page-hero-in{max-width:1400px;width:100%;padding-left:clamp(18px,3vw,36px)}
.contact-hero h1{text-shadow:0 3px 20px rgba(0,0,0,.52)}
.contact-hero .intro{color:#D0D2D6;text-shadow:0 2px 14px rgba(0,0,0,.5)}
@media (max-width:720px){
  .contact-hero{min-height:560px;align-items:flex-end}
  .contact-hero::before{background-image:linear-gradient(180deg,rgba(9,10,12,.05) 0%,rgba(9,10,12,.22) 40%,rgba(9,10,12,.9) 70%,var(--ink-deep) 88%),url('../assets/heroes/contact-owner-waving-neat.webp');background-position:82% center}
  .contact-hero .page-hero-in{padding-top:280px;padding-bottom:44px}
}

/* ---------- about hero (community photo) ---------- */
.about-hero{min-height:clamp(400px,42vw,560px);display:flex;align-items:center;background:var(--ink-deep)}
.about-hero::before{content:"";position:absolute;inset:0;z-index:0;background-image:linear-gradient(270deg,rgba(9,10,12,.97) 0%,rgba(9,10,12,.88) 30%,rgba(9,10,12,.5) 55%,rgba(9,10,12,.06) 80%),url('../assets/shop-community-family.webp');background-position:center 30%;background-size:cover;background-repeat:no-repeat}
.about-hero::after{opacity:.08}
.about-hero .page-hero-in{width:100%;display:flex;flex-direction:column;align-items:flex-end;text-align:right}
.about-hero h1{text-shadow:0 3px 20px rgba(0,0,0,.52)}
.about-hero .intro{color:#D0D2D6;text-shadow:0 2px 14px rgba(0,0,0,.5)}
@media (max-width:720px){
  .about-hero{min-height:560px;align-items:flex-end}
  .about-hero::before{background-image:linear-gradient(180deg,rgba(9,10,12,.05) 0%,rgba(9,10,12,.22) 40%,rgba(9,10,12,.9) 70%,var(--ink-deep) 88%),url('../assets/shop-community-family.webp');background-position:30% center}
  .about-hero .page-hero-in{align-items:flex-start;text-align:left;padding-top:300px;padding-bottom:44px}
}
.about-top h2{font-family:var(--oswald);font-weight:700;font-size:1.5rem;text-transform:uppercase;margin:0 0 14px}
.owner-story{background:#fff;border:1px solid var(--card-border)}
.owner-story-photo{display:block;width:100%;aspect-ratio:16/9;object-fit:cover;object-position:center 36%;border-bottom:3px solid var(--red)}
.owner-story-copy{padding:22px}
.story-lead{font-size:1.02rem;color:var(--dark-line);line-height:1.6;margin:0 0 14px}
.placeholder-box{border:2px dashed #C7C8CC;background:#fff;padding:20px;color:#8A8D93;font-size:.9rem;line-height:1.5}
.placeholder-label{font-family:var(--oswald);font-size:11px;letter-spacing:1px;color:var(--gray-light);margin-bottom:6px}
.facts-card{background:#F7F6F3;border:1px solid #E4E4E1;padding:22px}
.facts-card h3{font-family:var(--oswald);font-weight:700;font-size:1.2rem;text-transform:uppercase;margin:0 0 12px}
.fact-row{display:flex;justify-content:space-between;gap:14px;padding:10px 0;border-bottom:1px solid #E4E4E1}
.fact-row .k{font-size:.9rem;color:var(--muted)}
.fact-row .v{font-family:var(--oswald);font-weight:600;text-align:right}
.team-title{font-family:var(--oswald);font-weight:700;font-size:1.5rem;text-transform:uppercase;margin:44px 0 6px}
.team-lead{color:var(--muted);margin:0 0 18px;font-size:.98rem}
.team-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:16px}
.team-card{background:#fff;border:1px solid var(--card-border);padding:0}
.team-photo{aspect-ratio:1/1;background:repeating-linear-gradient(135deg,#EDECE9 0 12px,#F5F4F1 12px 24px);display:flex;align-items:center;justify-content:center;border-bottom:1px solid var(--card-border)}
.team-photo span{font-family:var(--oswald);font-size:11px;letter-spacing:1px;color:#A9ABAF}
.team-body{padding:16px}
.team-name{font-family:var(--oswald);font-weight:700;font-size:1.05rem;text-transform:uppercase;color:var(--gray-light)}
.team-role{font-size:.88rem;color:var(--gray);margin-top:2px}
.about-slots{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:16px;margin-top:30px}
.about-slots .placeholder-box{font-size:.92rem}

/* ---------- contact page ---------- */
.contact-section{max-width:1180px;margin:0 auto;padding:clamp(40px,7vw,64px) clamp(18px,5vw,40px)}
.contact-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:26px;align-items:start}

.form-card{background:#fff;border:1px solid var(--card-border);border-top:4px solid var(--red);padding:clamp(22px,4vw,32px)}
.form-card h2{font-family:var(--oswald);font-weight:700;font-size:1.5rem;text-transform:uppercase;margin:0 0 6px}
.form-sub{color:var(--muted);margin:0 0 20px;font-size:.95rem;line-height:1.5}
.estimate-form{display:flex;flex-direction:column;gap:16px}
.estimate-form label{display:flex;flex-direction:column;gap:6px}
.field-label{font-family:var(--oswald);font-weight:600;font-size:12px;letter-spacing:1px;text-transform:uppercase}
.field-label .req{color:var(--red)}
.field-label .opt{color:var(--gray);font-weight:400;text-transform:none;letter-spacing:0}
.estimate-form input,.estimate-form textarea,.estimate-form select{border:1px solid #C7C8CC;padding:12px 14px;font-size:1rem;background:#fff}
.estimate-form textarea{resize:vertical}
.estimate-form .invalid{border-color:var(--red);background:#FDF1F0}
.field-error{color:var(--red);font-size:.82rem}
.form-submit{background:var(--red);color:#fff;border:none;font-family:var(--oswald);font-weight:600;font-size:15px;letter-spacing:1px;text-transform:uppercase;padding:15px;cursor:pointer;margin-top:4px;transition:background .15s}
.form-submit:hover{background:var(--red-dark)}
.form-foot{margin:0;font-size:.8rem;color:var(--gray);line-height:1.5}

.form-fail{border:1px solid var(--red);background:#FDF1F0;color:#8A1812;padding:12px 14px;font-size:.92rem;line-height:1.5}
.form-fail a{font-weight:700;white-space:nowrap}
.form-submit:disabled{opacity:.65;cursor:wait}

.form-success{border:1px solid #1F8A5B;background:#EFF8F2;padding:24px;text-align:left}
.form-success .t{font-family:var(--oswald);font-weight:700;font-size:1.3rem;text-transform:uppercase;color:#166B47;margin-bottom:8px}
.form-success p{margin:0 0 16px;color:var(--dark-line);line-height:1.55;font-size:.98rem}
.form-success .actions{display:flex;flex-wrap:wrap;gap:10px}
.form-success .call{background:var(--red);color:#fff;font-family:var(--oswald);font-weight:600;font-size:13px;letter-spacing:1px;text-transform:uppercase;padding:11px 18px}

.contact-info{display:flex;flex-direction:column;gap:18px}
.reach-card{background:var(--ink);color:#fff;padding:24px}
.reach-card h3{font-family:var(--oswald);font-weight:700;font-size:1.2rem;text-transform:uppercase;margin:0 0 14px}
.reach-phone{display:flex;align-items:center;gap:10px;color:#fff;font-family:var(--oswald);font-weight:700;font-size:1.5rem;margin-bottom:14px}
.reach-phone:hover{color:#fff}
.reach-phone .phone-glyph{color:var(--red);font-size:inherit}
.reach-addr{font-family:var(--oswald);font-weight:500;font-size:1.05rem;line-height:1.4;color:var(--body-dark);margin-bottom:14px}
.reach-directions{display:inline-block;border:1px solid var(--dark-line-3);color:#fff;font-family:var(--oswald);font-weight:600;font-size:12px;letter-spacing:1px;text-transform:uppercase;padding:10px 16px;transition:border-color .15s}
.reach-directions:hover{border-color:#fff;color:#fff}

.contact-card{background:#fff;border:1px solid var(--card-border);padding:22px}
.contact-card h3{font-family:var(--oswald);font-weight:700;font-size:1.1rem;text-transform:uppercase;margin:0 0 12px}
.email-row{padding:9px 0;border-bottom:1px solid var(--hairline)}
.email-use{font-family:var(--oswald);font-weight:600;font-size:11px;letter-spacing:1px;text-transform:uppercase;color:var(--gray)}
.email-row a{font-size:.95rem;word-break:break-all}
.contact-card .hours-row{padding:7px 0;font-size:.92rem;gap:14px}
.contact-card .hours-vary{margin-top:12px;font-size:.82rem}

.reach-card .map-embed{margin-top:16px;border:1px solid var(--dark-line-2)}
.loc-map{margin:0 0 18px;border:1px solid var(--card-border)}
.loc-map iframe{height:210px}
.map-embed iframe{display:block;width:100%;height:240px;border:0}
.map-embed .map-open{display:block;text-align:center;font-family:var(--oswald);font-weight:600;font-size:12px;letter-spacing:1px;text-transform:uppercase;color:#fff;padding:11px;border-top:1px solid var(--dark-line-2);transition:background .15s,color .15s}
.map-embed .map-open:hover{background:var(--red);color:#fff}

/* ---------- info pages (services / service areas) ---------- */
.info-page-section{max-width:820px;margin:0 auto;padding:clamp(40px,7vw,64px) clamp(18px,5vw,40px)}
.info-block{margin-bottom:clamp(24px,4vw,36px)}
.info-block h2{font-family:var(--oswald);font-weight:700;font-size:clamp(1.3rem,3vw,1.7rem);text-transform:uppercase;margin:0 0 10px}
.info-block p{margin:0;color:var(--dark-line);line-height:1.65;font-size:1.02rem}
.info-faq{background:#fff;border:1px solid var(--card-border);border-top:4px solid var(--red);padding:clamp(20px,4vw,30px);margin:clamp(30px,5vw,44px) 0}
.info-faq-item{padding:12px 0;border-top:1px solid var(--hairline)}
.info-faq-item:first-child{border-top:none;padding-top:0}
.info-faq-item h3{font-family:var(--oswald);font-weight:700;font-size:1.05rem;text-transform:uppercase;margin:0 0 6px}
.info-faq-item p{margin:0;color:var(--muted);line-height:1.55;font-size:.97rem}
.info-cta{display:flex;flex-wrap:wrap;gap:10px}
.popular-links{display:flex;flex-wrap:wrap;align-items:center;gap:8px 14px;margin-bottom:22px}
.popular-label{font-family:var(--oswald);font-weight:600;font-size:12px;letter-spacing:2px;text-transform:uppercase;color:var(--muted)}
.popular-links a{font-family:var(--oswald);font-weight:600;font-size:13px;letter-spacing:.8px;text-transform:uppercase;border:1px solid var(--red);color:var(--red);padding:7px 13px;transition:background .15s,color .15s}
.popular-links a:hover{background:var(--red);color:#fff}

/* ---------- FAQ ---------- */
.faq-wrap{margin-top:clamp(40px,6vw,64px)}
.faq-wrap h2{font-family:var(--oswald);font-weight:700;font-size:clamp(1.6rem,4vw,2.3rem);text-transform:uppercase;margin:0 0 18px}
.faq-list{border:1px solid var(--card-border);background:#fff}
.faq-item{border-top:1px solid var(--hairline)}
.faq-q{width:100%;display:flex;justify-content:space-between;align-items:center;gap:16px;background:none;border:none;text-align:left;padding:16px 18px;cursor:pointer}
.faq-q .q{font-family:var(--oswald);font-weight:600;font-size:1.02rem;text-transform:uppercase;letter-spacing:.3px}
.faq-q .sign{font-family:var(--oswald);font-weight:700;font-size:1.4rem;color:var(--red);flex:0 0 auto}
.faq-a{margin:0;padding:0 18px 18px;color:var(--dark-line);line-height:1.6;font-size:.98rem}

/* ---------- CTA band ---------- */
.cta-band{position:relative;isolation:isolate;overflow:hidden;background:var(--ink-deep);color:#fff}
.cta-band::before{content:"";position:absolute;inset:0;z-index:0;background-image:linear-gradient(90deg,rgba(9,10,12,.98) 0%,rgba(9,10,12,.9) 34%,rgba(9,10,12,.56) 54%,rgba(9,10,12,.12) 78%),url('../assets/cta/car-making-noise-woman.webp');background-position:center 25%;background-size:cover;background-repeat:no-repeat}
.cta-band:empty{display:none}
.cta-in{max-width:1180px;min-height:clamp(340px,36vw,470px);margin:0 auto;padding:clamp(48px,7vw,76px) clamp(18px,5vw,40px);display:flex;flex-direction:column;align-items:flex-start;justify-content:center;text-align:left}
.cta-in h2{max-width:12ch;font-family:var(--oswald);font-weight:700;font-size:clamp(2rem,5vw,3.8rem);text-transform:uppercase;margin:0 0 12px;line-height:1.08;text-wrap:balance;text-shadow:0 3px 18px rgba(0,0,0,.45)}
.cta-in h2::before{content:"";display:block;width:56px;height:5px;margin-bottom:16px;background:linear-gradient(90deg,var(--red),var(--ember))}
.cta-in p{margin:0 0 26px;max-width:42ch;font-size:1.05rem;color:#D4D6DA;line-height:1.55;text-shadow:0 2px 12px rgba(0,0,0,.5)}
.cta-actions{display:flex;flex-wrap:wrap;gap:12px;justify-content:flex-start}
.cta-btn-light{background:var(--red);color:#fff;border:1px solid var(--red);font-family:var(--oswald);font-weight:700;font-size:15px;letter-spacing:1px;text-transform:uppercase;padding:15px 28px;cursor:pointer;transition:background .2s,border-color .2s,transform .2s}
.cta-btn-light:hover{background:var(--ember);border-color:var(--ember);transform:translateY(-2px)}
.cta-btn-dark{background:rgba(12,14,17,.72);color:#fff;border:1px solid rgba(255,255,255,.72);font-family:var(--oswald);font-weight:600;font-size:15px;letter-spacing:1px;text-transform:uppercase;padding:15px 28px;transition:background .2s,border-color .2s,transform .2s}
.cta-btn-dark:hover{background:#fff;border-color:#fff;color:var(--ink);transform:translateY(-2px)}
@media (max-width:720px){
  .cta-band::before{background-image:linear-gradient(180deg,rgba(9,10,12,.08) 0%,rgba(9,10,12,.24) 36%,rgba(9,10,12,.88) 62%,var(--ink-deep) 82%),url('../assets/cta/car-making-noise-woman.webp');background-position:60% 65%}
  .cta-in{min-height:610px;justify-content:flex-end;padding-top:300px;padding-bottom:48px}
  .cta-in h2{font-size:clamp(2rem,11vw,3rem)}
}

/* ---------- footer ---------- */
.site-footer{background:var(--ink-deep);color:var(--gray)}

@media (max-width:720px){
  /* photo-first mobile hero: the mechanic shot carries the section; text sits
     at the bottom over a vertical fade like the other page heroes */
  .page-hero::after{right:-28%;width:130vw;opacity:.13}
  .svc-overview::before,.svc-list-section::before,.pricing-section::before,.about-section::before,.contact-section::before,
  .svc-overview::after,.svc-list-section::after,.pricing-section::after,.about-section::after,.contact-section::after{width:50vw;opacity:.035}
  .section-title::after,.why-in h2::after,.reviews-section h2::after,.team-title::after,.faq-wrap h2::after{width:70px;height:20px;margin-left:8px}
  .community-strip .woven-mark{width:34px}
}

@media (prefers-reduced-motion:reduce){
  .js-reveal,.js-reveal.reveal-left,.js-reveal.reveal-right{opacity:1;transform:none;transition:none}
}
.footer-in{max-width:1180px;margin:0 auto;padding:clamp(36px,6vw,56px) clamp(18px,5vw,40px)}
.footer-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:28px}
.footer-logo-wrap{margin-bottom:14px}
.footer-logo{height:84px;width:auto;display:block}
.footer-addr{font-size:.9rem;line-height:1.6;margin:0 0 4px}
.footer-phone{font-family:var(--oswald);font-weight:700;font-size:1.2rem;color:#fff}
.footer-phone:hover{color:#fff}
.footer-langs{font-size:.82rem;margin:10px 0 0;display:flex;align-items:center;gap:8px}
.footer-langs button{background:none;border:none;padding:0;color:var(--gray);font-size:.82rem;cursor:pointer;transition:color .15s}
.footer-langs button:hover{color:#fff}
.footer-langs button.active{color:var(--red);font-weight:600}
.footer-langs .lang-dot{color:var(--dark-line-3)}
.footer-head{font-family:var(--oswald);font-weight:600;font-size:12px;letter-spacing:2px;text-transform:uppercase;color:#fff;margin-bottom:12px}
.footer-links{display:flex;flex-direction:column;gap:8px}
.footer-links button,.footer-links a{display:block;background:none;border:none;color:var(--gray);text-align:left;font-size:.95rem;cursor:pointer;padding:0;transition:color .15s}
.footer-links button:hover,.footer-links a:hover{color:#fff}
.footer-hours-row{display:flex;justify-content:space-between;gap:12px;font-size:.85rem;padding:3px 0}
.footer-hours-row .time{color:var(--body-dark)}
.footer-email{display:block;font-size:.85rem;color:var(--gray);word-break:break-all;padding:3px 0;transition:color .15s}
.footer-email:hover{color:#fff}
.footer-bottom{border-top:1px solid var(--dark-line);margin-top:32px;padding-top:20px;display:flex;flex-wrap:wrap;gap:8px 24px;justify-content:space-between;font-size:.78rem;color:#6B6F76}
.footer-credit{flex-basis:100%;margin-top:14px;display:flex;justify-content:flex-end}
.cc-badge{display:inline-flex;align-items:center;gap:10px;border:1px solid var(--dark-line-2);background:linear-gradient(120deg,#101216,#15181D 60%,#101216);border-radius:3px;padding:9px 14px;position:relative;overflow:hidden;isolation:isolate;transition:border-color .25s,box-shadow .25s,transform .25s}
.cc-badge::before{content:"";position:absolute;inset:0;z-index:0;background:linear-gradient(105deg,transparent 40%,rgba(255,255,255,.07) 50%,transparent 60%);background-size:250% 100%;background-position:120% 0;transition:background-position .7s ease}
.cc-badge:hover{border-color:var(--red);box-shadow:0 0 22px rgba(206,42,34,.28);transform:translateY(-2px)}
.cc-badge:hover::before{background-position:-120% 0}
.cc-badge-label{position:relative;z-index:1;font-family:var(--oswald);font-weight:500;font-size:10px;letter-spacing:2.2px;color:#6B6F76;white-space:nowrap}
.cc-badge-name{position:relative;z-index:1;font-family:var(--oswald);font-weight:700;font-size:13px;letter-spacing:2.6px;white-space:nowrap;background:linear-gradient(90deg,var(--red) 0%,var(--ember) 45%,#FF8A7A 50%,var(--ember) 55%,var(--red) 100%);background-size:200% 100%;-webkit-background-clip:text;background-clip:text;color:transparent;animation:ccShimmer 4.5s linear infinite}
.cc-badge:hover .cc-badge-name{animation-duration:1.6s}
@keyframes ccShimmer{to{background-position:-200% 0}}
@media (prefers-reduced-motion:reduce){.cc-badge-name{background:none;color:var(--red);animation:none}}
@media (max-width:720px){.footer-credit{justify-content:flex-start}.cc-badge{flex-wrap:wrap;gap:4px 10px}.cc-badge-label{flex-basis:100%}}

/* ---------- sticky call ---------- */
.sticky-call{position:fixed;right:16px;bottom:16px;z-index:60;display:inline-flex;align-items:center;gap:9px;background:var(--red);color:#fff;font-family:var(--oswald);font-weight:700;font-size:14px;letter-spacing:1px;text-transform:uppercase;padding:14px 20px;border-radius:40px;box-shadow:0 6px 22px rgba(0,0,0,.35);transition:background .15s}
.sticky-call:hover{background:var(--red-dark);color:#fff}
.sticky-call .phone-glyph{font-size:17px}
.sticky-call::before{content:"";position:absolute;inset:-2px;border-radius:40px;border:2px solid rgba(206,42,34,.65);animation:callPulse 2.6s ease-out infinite;pointer-events:none}
@keyframes callPulse{0%{transform:scale(1);opacity:.75}70%{transform:scale(1.3);opacity:0}100%{transform:scale(1.3);opacity:0}}

/* ---------- chat widget ---------- */
.jm-chat-toggle{position:fixed;right:16px;bottom:82px;z-index:60;width:54px;height:54px;border-radius:50%;background:var(--ink-deep);color:#fff;border:2px solid var(--red);cursor:pointer;display:flex;align-items:center;justify-content:center;box-shadow:0 6px 22px rgba(0,0,0,.35);transition:background .15s,transform .15s}
.jm-chat-toggle:hover{background:var(--red);transform:translateY(-2px)}
.jm-chat-toggle svg{display:block}
.jm-chat-panel{position:fixed;right:16px;bottom:148px;z-index:70;width:min(400px,calc(100vw - 32px));height:min(560px,calc(100vh - 180px));background:var(--paper);border:1px solid var(--ink);border-top:3px solid var(--red);box-shadow:0 18px 50px rgba(0,0,0,.4);display:flex;flex-direction:column;overflow:hidden}
.jm-chat-panel[hidden]{display:none}
.jm-chat-head{background:var(--ink);color:#fff;padding:13px 16px;display:flex;align-items:flex-start;justify-content:space-between;gap:10px}
.jm-chat-head-txt{display:flex;flex-direction:column;gap:2px}
.jm-chat-title{font-family:var(--oswald);font-weight:700;font-size:17px;letter-spacing:2.4px}
.jm-chat-sub{font-size:.82rem;color:#C9CDD3;letter-spacing:.3px}
.jm-chat-close{background:none;border:none;color:#9BA0A8;font-size:24px;line-height:1;cursor:pointer;padding:0 2px;transition:color .15s}
.jm-chat-close:hover{color:#fff}
.jm-chat-log{flex:1;overflow-y:auto;padding:14px;display:flex;flex-direction:column;gap:9px}
.jm-msg{max-width:88%;padding:11px 14px;font-size:1.02rem;line-height:1.55;white-space:pre-wrap;word-wrap:break-word}
.jm-msg.bot{align-self:flex-start;background:#fff;border:1px solid var(--line, #E2E0DB);color:var(--ink);border-left:3px solid var(--red)}
.jm-msg.user{align-self:flex-end;background:var(--ink);color:#fff}
.jm-msg.bot a{color:var(--red);font-weight:600}
.jm-msg.typing::after{content:"•••";letter-spacing:3px;color:var(--red);animation:chatPulse 1.1s ease-in-out infinite}
@keyframes chatPulse{0%,100%{opacity:.25}50%{opacity:1}}
.jm-chat-form{display:flex;gap:0;border-top:1px solid var(--ink)}
.jm-chat-form input{flex:1;border:none;background:#fff;padding:13px 14px;font-size:16px;font-family:inherit;color:var(--ink);min-width:0}
.jm-chat-form input:focus-visible{outline-offset:-3px}
.jm-chat-send{background:var(--red);color:#fff;border:none;font-family:var(--oswald);font-weight:600;font-size:14px;letter-spacing:1px;text-transform:uppercase;padding:0 20px;cursor:pointer;transition:background .15s}
.jm-chat-send:hover{background:var(--red-dark)}
.jm-chat-send:disabled{background:#9BA0A8;cursor:default}
.jm-chat-note{margin:0;padding:8px 14px 10px;font-size:.76rem;color:#6B6F76;background:var(--paper);border-top:1px solid var(--line, #E2E0DB)}
@media (max-width:520px){.jm-chat-panel{right:8px;bottom:146px;width:calc(100vw - 16px);height:min(480px,calc(100vh - 170px))}}
@media (prefers-reduced-motion:reduce){.jm-chat-toggle{transition:none}.jm-msg.typing::after{animation:none}}

/* ============================================================
   MOTION SYSTEM — scroll tachometer, marquee, decal cinema,
   hero choreography. All of it dies under prefers-reduced-motion
   (global animation/transition kill + JS guards).
   ============================================================ */

.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}

/* ---------- scroll tachometer ---------- */
.scroll-progress{position:fixed;top:0;left:0;width:100%;height:3px;z-index:80;background:linear-gradient(90deg,var(--red),var(--ember));transform:scaleX(var(--scroll-progress));transform-origin:0 50%;box-shadow:0 0 14px rgba(240,58,46,.55);pointer-events:none}

/* ---------- marquee ticker (community strip) ---------- */
.ticker{overflow:hidden}
.ticker-track{display:flex;width:max-content;animation:tickerScroll 28s linear infinite}
.ticker:hover .ticker-track{animation-play-state:paused}
.ticker-seg{display:inline-flex;align-items:center;gap:28px;padding:17px 28px 17px 0;flex:0 0 auto}
.tk-item{font-family:var(--oswald);font-weight:600;font-size:13.5px;letter-spacing:2.2px;text-transform:uppercase;white-space:nowrap}
@keyframes tickerScroll{to{transform:translateX(-50%)}}
@media (prefers-reduced-motion:reduce){.ticker-track{animation:none}}

/* ---------- decal cinema (full-bleed band above Services) ---------- */
.tribal-cinema{--p:.42;position:relative;overflow:hidden;isolation:isolate;min-height:clamp(300px,46vw,540px);display:flex;align-items:center;justify-content:center;background:radial-gradient(130% 150% at 50% -10%,#20242B 0%,var(--ink-deep) 55%,#08090B 100%);border-top:3px solid var(--red);border-bottom:3px solid var(--red)}
.cinema-video{position:absolute;inset:0;z-index:0;width:100%;height:100%;object-fit:cover;opacity:0;transition:opacity .9s ease}
.tribal-cinema.has-video .cinema-video{opacity:1}
.tribal-cinema.has-video .cinema-sweep,.tribal-cinema.has-video .cinema-speedlines,.tribal-cinema.has-video .cinema-big{opacity:0;transition:opacity .9s ease}
.cinema-speedlines{position:absolute;inset:8% 0;z-index:1;background:repeating-linear-gradient(180deg,transparent 0 22px,rgba(243,242,239,.045) 22px 23px,transparent 23px 54px);transform:skewY(-2deg) translateX(calc(var(--p) * -9vw));-webkit-mask-image:linear-gradient(90deg,transparent,#000 18% 82%,transparent);mask-image:linear-gradient(90deg,transparent,#000 18% 82%,transparent)}
.cinema-big{position:absolute;inset:0;z-index:2;display:flex;align-items:center;justify-content:center;font-family:var(--oswald);font-weight:700;font-size:clamp(4.2rem,16vw,12.5rem);letter-spacing:.05em;line-height:1;text-transform:uppercase;color:transparent;-webkit-text-stroke:1px rgba(243,242,239,.14);transform:translateX(calc((.5 - var(--p)) * 8vw));user-select:none}
.cinema-sweep{position:absolute;left:50%;top:50%;z-index:3;width:min(1100px,88vw);aspect-ratio:5.55/1;transform:translate(-50%,-50%)}
.cinema-sweep .sweep{position:absolute;inset:0;width:100%;height:100%;object-fit:contain}
.cinema-sweep .main{transform:translateX(calc((var(--p) - .5) * 36vw));filter:drop-shadow(0 0 16px rgba(240,58,46,.5)) drop-shadow(0 0 55px rgba(240,58,46,.25));animation:sweepIdle 5.5s ease-in-out infinite}
.cinema-sweep .ghost-a{opacity:.32;filter:blur(6px) brightness(1.35);transform:translateX(calc((var(--p) - .5) * 27vw)) scale(.995)}
.cinema-sweep .ghost-b{opacity:.14;filter:blur(15px) brightness(1.5);transform:translateX(calc((var(--p) - .5) * 19vw)) scale(.985)}
@keyframes sweepIdle{0%,100%{margin-top:0}50%{margin-top:-10px}}
.cinema-shine{position:absolute;inset:0;z-index:4;background:linear-gradient(105deg,transparent 43%,rgba(255,255,255,.10) 50%,transparent 57%);background-size:240% 100%;background-position:calc(140% - var(--p) * 180%) 0;pointer-events:none}
.cinema-tag{position:absolute;left:clamp(18px,5vw,40px);top:clamp(16px,3vw,26px);z-index:5;display:inline-flex;align-items:center;gap:9px;font-family:var(--oswald);font-weight:600;font-size:12px;letter-spacing:3px;color:var(--gray);text-transform:uppercase}
.cinema-line{position:absolute;left:0;right:0;bottom:clamp(14px,3vw,24px);z-index:5;text-align:center;font-family:var(--oswald);font-weight:500;font-size:clamp(11px,1.6vw,14px);letter-spacing:2.4px;color:var(--body-dark);text-transform:uppercase;padding:0 18px}

/* ---------- hero choreography ---------- */
@keyframes heroRise{from{opacity:0;transform:translateY(26px)}to{opacity:1;transform:none}}
.home-hero .hero-eyebrow{animation:heroRise .6s .05s cubic-bezier(.2,.7,.2,1) both}
.home-hero h1{animation:heroRise .7s .16s cubic-bezier(.2,.7,.2,1) both}
.home-hero .hero-sub{animation:heroRise .7s .28s cubic-bezier(.2,.7,.2,1) both}
.home-hero .hero-actions{animation:heroRise .7s .4s cubic-bezier(.2,.7,.2,1) both}
.home-hero .hero-rates{animation:heroRise .7s .52s cubic-bezier(.2,.7,.2,1) both}

/* ---------- section-title flourish launch ---------- */
.js-reveal.section-title::after{opacity:0;transform:translateX(-18px);transition:opacity .5s .3s,transform .5s .3s cubic-bezier(.2,.7,.2,1)}
.section-title.is-visible::after{opacity:1;transform:none}

@media (max-width:720px){
  .tribal-cinema{min-height:230px}
  .cinema-sweep{width:96vw}
  .cinema-line{letter-spacing:1.4px}
}
