
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
:root{--bg:#080808;--surface:#111;--surface2:#161616;--border:#1e1e1e;--text:#f0ede8;--muted:#888;--gold:#708238;--gold-dk:#566830;--r:28px;--fh:"Barlow Condensed",sans-serif;--fb:"Barlow",sans-serif;--ease:cubic-bezier(.25,.46,.45,.94)}
html{scroll-behavior:smooth}
body{font-family:var(--fb);background:var(--bg);color:var(--text);line-height:1.6;-webkit-font-smoothing:antialiased}
a{color:inherit;text-decoration:none}
img{display:block;max-width:100%}
.container{width:min(1180px,92%);margin:auto}
section{padding:90px 0}
section[id]{scroll-margin-top:84px}
.section-divider{width:100%;height:2px;background:linear-gradient(to right,transparent,var(--gold),transparent);opacity:.55}
.btn{display:inline-flex;align-items:center;gap:8px;background:var(--gold);color:#0a0a0a;padding:14px 26px;border-radius:999px;font-family:var(--fh);font-size:17px;font-weight:700;letter-spacing:.03em;text-transform:uppercase;transition:background .2s,transform .15s;cursor:pointer;border:none}
.btn:hover{background:var(--gold-dk);transform:translateY(-1px)}
.btn.outline{background:transparent;color:var(--text);border:1px solid #3a3a3a}
.btn.outline:hover{border-color:var(--gold);color:var(--gold);background:transparent}
header{position:-webkit-sticky;position:sticky;top:0;z-index:1000;background:rgba(30,30,30,.97);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);border-bottom:1px solid var(--border);width:100%}
nav{height:76px;display:flex;justify-content:space-between;align-items:center;gap:24px}
.logo-link{display:flex;align-items:center;gap:0;flex-shrink:0;text-decoration:none;cursor:pointer}
.logo-wordmark{display:flex;flex-direction:column;line-height:1;gap:4px;align-items:stretch}
.logo-vista{font-family:"Cormorant Garamond","Georgia",serif;font-size:26px;font-weight:700;letter-spacing:.18em;color:#fff;text-transform:uppercase;text-align:center;text-indent:.09em}
.logo-divider{width:100%;height:1px;background:rgba(112,130,56,.5);margin:1px 0}
.logo-sub{font-family:"Cormorant Garamond","Georgia",serif;font-size:10px;font-weight:600;letter-spacing:.22em;color:var(--gold);text-transform:uppercase;text-align:center;text-indent:.11em}
.nav-links{display:flex;align-items:center;gap:2px;list-style:none}
.nav-links>li{position:relative}
.nav-links>li>a{display:flex;align-items:center;gap:5px;padding:8px 14px;color:var(--muted);font-size:15px;font-weight:500;transition:color .18s;white-space:nowrap;border-radius:6px;cursor:pointer}
.nav-links>li>a:hover{color:var(--text)}
.nav-links>li.has-dd>a::after{content:"";width:6px;height:6px;border-right:1.5px solid currentColor;border-bottom:1.5px solid currentColor;transform:rotate(45deg) translateY(-2px);transition:transform .2s;flex-shrink:0}
.nav-links>li.has-dd.open>a::after{transform:rotate(-135deg) translateY(-2px)}
.dropdown{display:none;position:absolute;top:calc(100% + 4px);left:0;background:#111;border:1px solid var(--border);border-radius:14px;padding:8px;min-width:210px;box-shadow:0 16px 40px rgba(0,0,0,.6);z-index:200}
.nav-links>li.has-dd.open .dropdown{display:block}
.dropdown a{display:block;padding:9px 14px;border-radius:8px;color:var(--muted);font-size:13.5px;font-weight:500;transition:color .15s,background .15s;white-space:nowrap;cursor:pointer}
.dropdown a:hover{color:var(--text);background:rgba(255,255,255,.06)}
.nav-actions{display:flex;align-items:center;gap:10px;flex-shrink:0}
.nav-phone{font-size:14px;font-weight:700;color:var(--text);white-space:nowrap;transition:color .18s}
.nav-phone:hover{color:var(--gold)}
.btn-sm{display:inline-flex;align-items:center;padding:11px 20px;border-radius:999px;font-family:var(--fh);font-size:14px;font-weight:700;letter-spacing:.04em;text-transform:uppercase;background:var(--gold);color:#0a0a0a;transition:background .2s,transform .15s;cursor:pointer}
.btn-sm:hover{background:var(--gold-dk);transform:translateY(-1px)}
.section-title{font-family:var(--fh);font-size:clamp(34px,4.5vw,54px);font-weight:900;text-transform:uppercase;letter-spacing:-.01em;line-height:.95;margin-bottom:14px}
.muted{color:var(--muted);max-width:620px;font-size:17px}
.eyebrow{font-family:var(--fh);font-size:12px;font-weight:700;letter-spacing:.2em;text-transform:uppercase;color:var(--gold);margin-bottom:14px;display:flex;align-items:center;gap:8px}
.eyebrow::before{content:"";width:20px;height:2px;background:var(--gold);flex-shrink:0}
.card{background:var(--surface);border:1px solid var(--border);border-radius:var(--r);padding:28px;transition:border-color .2s,transform .2s}
.card:hover{border-color:#2e2e2e;transform:translateY(-2px)}
.card h3{font-family:var(--fh);font-size:22px;font-weight:700;text-transform:uppercase;letter-spacing:.02em;margin-bottom:8px}
.card p{color:var(--muted);font-size:15px}
.grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin-top:40px}
.icon{font-size:26px;margin-bottom:12px;display:block}
.split{display:grid;grid-template-columns:1fr 1fr;gap:40px;align-items:center}
.checklist{list-style:none;margin:20px 0 28px;display:flex;flex-direction:column;gap:12px}
.checklist li{display:flex;align-items:flex-start;gap:12px;color:#ccc;font-size:16px}
.checklist li::before{content:"✓";color:var(--gold);font-weight:900;font-size:10px;width:18px;height:18px;border:1.5px solid var(--gold);border-radius:50%;display:flex;align-items:center;justify-content:center;flex-shrink:0;margin-top:3px}
.stats-bar{background:var(--surface2);border-top:1px solid var(--border);border-bottom:1px solid var(--border);padding:28px 0}
.stats-row{display:flex;justify-content:center;gap:60px;flex-wrap:wrap}
.stat{text-align:center}
.stat-num{font-family:var(--fh);font-size:40px;font-weight:900;color:var(--gold);line-height:1}
.stat-label{font-size:13px;color:var(--muted);font-weight:500;letter-spacing:.04em;margin-top:4px}
.reviews{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin-top:36px}
.stars{color:var(--gold);font-size:15px;letter-spacing:2px;margin-bottom:12px}
.qt{font-size:16px;color:#ddd;margin-bottom:16px;line-height:1.55}
.reviewer{font-size:12px;color:var(--muted);font-weight:600;letter-spacing:.06em;text-transform:uppercase}
.areas{display:flex;flex-wrap:wrap;gap:10px;margin-top:28px}
.pill{border:1px solid #2a2a2a;padding:9px 16px;border-radius:999px;color:var(--muted);font-size:14px;font-weight:600;letter-spacing:.04em;transition:border-color .18s,color .18s;cursor:pointer}
.pill:hover{border-color:var(--gold);color:var(--gold)}
.steps{display:grid;grid-template-columns:repeat(4,1fr);gap:16px;margin-top:36px}
.step-num{font-family:var(--fh);font-size:44px;font-weight:900;color:var(--gold);line-height:1;margin-bottom:12px;opacity:.85}
.ba-card{position:relative;min-height:440px;border-radius:var(--r);border:1px solid var(--border);overflow:hidden;cursor:col-resize;user-select:none}
.ba-after{position:absolute;top:0;left:0;width:100%;height:100%;object-fit:cover}
.ba-bw{position:absolute;top:0;left:0;width:50%;height:100%;overflow:hidden}
.ba-before{width:auto;min-width:100%;max-width:none;height:100%;object-fit:cover;object-position:left center}
.ba-handle{position:absolute;top:0;left:50%;transform:translateX(-50%);height:100%;width:44px;display:flex;flex-direction:column;align-items:center;justify-content:center;z-index:10;pointer-events:none}
.ba-line{flex:1;width:2px;background:rgba(255,255,255,.7)}
.ba-circle{width:40px;height:40px;border-radius:50%;background:var(--gold);color:#0a0a0a;font-size:13px;font-weight:900;display:flex;align-items:center;justify-content:center;flex-shrink:0;gap:2px}
.ba-lbl{position:absolute;bottom:18px;z-index:10;font-family:var(--fh);font-size:12px;font-weight:700;letter-spacing:.1em;text-transform:uppercase;padding:5px 12px;border-radius:999px;backdrop-filter:blur(4px)}
.ba-lbl-b{left:18px;background:rgba(0,0,0,.55);color:#fff;border:1px solid rgba(255,255,255,.15)}
.ba-lbl-a{right:18px;background:rgba(112,130,56,.7);color:#fff;border:1px solid rgba(112,130,56,.4)}
.quote-section{background:#141414;border-top:2px solid var(--gold)}
.quote-grid{display:grid;grid-template-columns:1fr 1fr;gap:60px;align-items:start}
.qfc{background:#1c1c1c;border:1px solid #2e2e2e;border-radius:var(--r);padding:32px 28px}
.qft{font-family:var(--fh);font-size:18px;font-weight:700;text-transform:uppercase;letter-spacing:.06em;color:var(--text);margin-bottom:20px;padding-bottom:16px;border-bottom:1px solid #2e2e2e}
.fg{display:flex;flex-direction:column;gap:5px;margin-bottom:14px}
.fl{font-size:11px;font-weight:600;letter-spacing:.06em;text-transform:uppercase;color:#aaa}
.fi{background:#2e2e2e;border:1px solid #444;border-radius:10px;padding:11px 13px;color:var(--text);font-family:var(--fb);font-size:15px;outline:none;transition:border-color .18s;width:100%}
.fi:focus{border-color:var(--gold)}
.fi::placeholder{color:#777}
.fta{resize:vertical;min-height:80px}
.fsel{appearance:none;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath d='M1 1l5 5 5-5' stroke='%23888' stroke-width='1.5' fill='none' stroke-linecap='round'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 14px center;background-color:#2e2e2e;cursor:pointer}
.fsub{width:100%;justify-content:center;font-size:15px;padding:14px 24px;margin-top:4px}
.qsuccess{text-align:center;padding:28px 0}
.qsuccess-icon{width:52px;height:52px;border-radius:50%;background:var(--gold);color:#0a0a0a;font-size:22px;font-weight:900;display:flex;align-items:center;justify-content:center;margin:0 auto 14px}
.qsuccess h3{font-family:var(--fh);font-size:24px;font-weight:700;text-transform:uppercase;color:var(--text);margin-bottom:6px}
.qsuccess p{color:var(--muted);font-size:14px}
footer{padding:40px 0;color:#555;border-top:1px solid var(--border);font-size:14px}
/* Picker overlay */
#picker-overlay{display:none;position:fixed;inset:0;background:rgba(0,0,0,.85);z-index:999;align-items:center;justify-content:center;padding:24px;backdrop-filter:blur(8px)}
#picker-overlay.show{display:flex}
.picker-box{background:#111;border:1px solid #2a2a2a;border-radius:28px;padding:40px 32px;max-width:580px;width:100%;text-align:center;display:flex;flex-direction:column;align-items:center;gap:20px}
.picker-box h2{font-family:var(--fh);font-size:32px;font-weight:900;text-transform:uppercase}
.picker-box p{color:var(--muted);font-size:15px;max-width:380px}
.picker-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:10px;width:100%}
.pcity{background:#161616;border:1px solid #222;border-radius:12px;padding:14px 8px;color:var(--text);font-family:var(--fh);font-size:15px;font-weight:700;text-transform:uppercase;letter-spacing:.04em;cursor:pointer;transition:border-color .18s,background .18s,transform .15s;text-align:center}
.pcity:hover{border-color:var(--gold);color:var(--gold);background:#1a1a1a;transform:translateY(-2px)}
.pclose{font-family:var(--fh);font-size:13px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--muted);cursor:pointer;background:none;border:none;padding:4px;transition:color .18s}
.pclose:hover{color:var(--text)}
.use-location-btn{width:100%;justify-content:center;margin-top:2px;background:var(--gold);color:#0a0a0a;border:none;border-radius:999px;padding:13px 20px;font-family:var(--fh);font-size:15px;font-weight:700;letter-spacing:.04em;text-transform:uppercase;cursor:pointer;transition:background .2s,transform .15s}
.use-location-btn:hover{background:var(--gold-dk);transform:translateY(-1px)}
.use-location-btn:disabled{opacity:.65;cursor:wait;transform:none}

@media(max-width:480px){.picker-grid{grid-template-columns:repeat(2,1fr)}}
/* Hero */
.city-hero{position:relative;height:auto;min-height:560px;overflow:hidden}
.city-hero-bg{position:absolute;inset:0;background-size:cover;background-position:center;opacity:.38}
.city-hero-ov{position:absolute;inset:0;background:linear-gradient(to right,rgba(8,8,8,.92) 40%,rgba(8,8,8,.4))}
.city-hero-inner{position:relative;z-index:2;height:100%;display:flex;flex-direction:column;justify-content:center}
.badge{display:inline-flex;align-items:center;gap:8px;border:1px solid #2a2a2a;background:rgba(255,255,255,.04);padding:8px 16px;border-radius:999px;font-size:13px;font-weight:600;letter-spacing:.08em;text-transform:uppercase;color:var(--gold);margin-bottom:20px}
.badge::before{content:"";width:6px;height:6px;border-radius:50%;background:var(--gold);animation:pulse 2s infinite}
@keyframes pulse{0%,100%{opacity:1}50%{opacity:.4}}
h1{font-family:var(--fh);font-size:clamp(48px,7vw,86px);font-weight:900;text-transform:uppercase;line-height:.9;max-width:780px;margin-bottom:22px;letter-spacing:-.02em}
h1 em{font-style:normal;color:var(--gold)}
.city-hero p{max-width:560px;color:#bbb;font-size:18px;margin-bottom:32px}
.hero-actions{display:flex;gap:14px;flex-wrap:wrap}
/* Main hero carousel */
.hero{position:relative;height:92vh;min-height:600px;overflow:hidden}
.hero-track{display:flex;height:100%;transition:transform .9s cubic-bezier(.77,0,.18,1);will-change:transform}
.hero-slide{min-width:100%;height:100%;position:relative;flex-shrink:0}
.hero-slide img{width:100%;height:100%;object-fit:cover;object-position:center}
.hero-slide::after{content:"";position:absolute;inset:0;background:linear-gradient(to right,rgba(8,8,8,.78) 35%,rgba(8,8,8,.22) 70%,rgba(8,8,8,.24)),linear-gradient(to bottom,transparent 58%,rgba(8,8,8,.88))}
.hero-inner{position:absolute;inset:0;z-index:10;display:flex;flex-direction:column;justify-content:center}
.hero-arrow{position:absolute;top:50%;transform:translateY(-50%);z-index:20;background:rgba(0,0,0,.35);border:1px solid rgba(255,255,255,.12);color:#fff;width:48px;height:48px;border-radius:50%;display:flex;align-items:center;justify-content:center;cursor:pointer;font-size:18px;transition:background .2s;backdrop-filter:blur(6px)}
.hero-arrow:hover{background:rgba(112,130,56,.6);border-color:var(--gold)}
.hero-arrow.next{right:24px}
.hero-dots{position:absolute;bottom:32px;left:50%;transform:translateX(-50%);z-index:20;display:flex;gap:8px}
.hero-dot{width:8px;height:8px;border-radius:999px;background:rgba(255,255,255,.3);cursor:pointer;transition:background .3s,width .3s}
.hero-dot.active{background:var(--gold);width:28px}
.hero-counter{position:absolute;top:18px;right:22px;z-index:20;font-family:var(--fh);font-size:12px;font-weight:700;letter-spacing:.1em;color:rgba(255,255,255,.58);background:rgba(8,8,8,.28);padding:4px 8px;border-radius:999px;line-height:1;backdrop-filter:blur(3px);-webkit-backdrop-filter:blur(3px)}
.hero-counter span{color:rgba(255,255,255,.8)}
.main-hero-text h1{font-family:var(--fh);font-size:clamp(52px,8vw,96px)}
@media(max-width:900px){
  .nav-links,.nav-phone{display:none}
  .grid,.steps,.reviews{grid-template-columns:1fr 1fr}
  .split,.quote-grid{grid-template-columns:1fr}
  section{padding:60px 0}
  .city-hero,.hero{height:70vh}
  .stats-row{gap:30px}
  .picker-grid{grid-template-columns:repeat(2,1fr)}
}
@media(max-width:540px){.grid,.steps,.reviews{grid-template-columns:1fr}}

.hero-quote-card{background:rgba(15,15,15,.94);border:1px solid #2a2a2a;border-radius:20px;padding:24px 22px;backdrop-filter:blur(14px);}
.hero-quote-title{font-family:var(--fh);font-size:20px;font-weight:700;text-transform:uppercase;letter-spacing:.06em;color:var(--text);margin-bottom:16px;padding-bottom:14px;border-bottom:1px solid #2e2e2e;}
.hero-quote-card .fg{margin-bottom:10px;}
.hero-quote-card .fi{background:#1e1e1e;border:1px solid #3a3a3a;padding:10px 12px;font-size:14px;}
.city-hero-grid{display:grid;grid-template-columns:1fr 400px;gap:44px;align-items:center;}
@media(max-width:960px){.city-hero-grid{grid-template-columns:1fr;}.hero-quote-card{margin-top:24px;}}


/* ===== Mobile / tablet responsive hardening ===== */
html,body{max-width:100%;overflow-x:hidden}
.page{width:100%;max-width:100%;overflow:visible}
.city-hero-grid>* ,.split>* ,.quote-grid>* ,.grid>* ,.reviews>* ,.steps>*{min-width:0}
.btn,.btn-sm,.nav-phone{max-width:100%}

@media(max-width:960px){
  nav{height:68px;gap:12px}
  .logo-vista{font-size:23px}
  .logo-sub{font-size:9px}
  .nav-actions{gap:8px}
  .btn-sm{padding:10px 17px;font-size:13px}

  section{padding:56px 0}
  .city-hero{height:auto!important;min-height:0;overflow:hidden}
  .city-hero-inner{height:auto;min-height:0;padding:48px 0!important}
  .city-hero-grid{grid-template-columns:minmax(0,1fr);gap:28px;align-items:start}
  .hero-quote-card{width:100%;max-width:620px;margin-top:4px}
  .city-hero-bg{background-position:center center}
  .city-hero-ov{background:linear-gradient(to bottom,rgba(8,8,8,.80),rgba(8,8,8,.88))}
  .city-hero p{font-size:17px;line-height:1.55}

  h1{font-size:clamp(42px,8vw,64px);line-height:.94;max-width:100%}
  .main-hero-text{font-size:clamp(48px,9vw,72px)!important;line-height:.92}

  .hero{height:calc(100svh - 68px);min-height:620px;max-height:820px}
  .hero-inner{padding:34px 0 78px}
  .hero-arrow{width:42px;height:42px}
  .hero-arrow.next{right:14px}
  .hero-counter{top:12px;right:12px}
  .hero-dots{bottom:22px}
}

@media(max-width:600px){
  :root{--r:22px}
  .container{width:calc(100% - 32px)}
  nav{height:64px}
  .logo-vista{font-size:21px;letter-spacing:.14em}
  .logo-sub{font-size:8px;letter-spacing:.18em}
  .btn-sm{padding:9px 14px;font-size:12px;letter-spacing:.03em}

  section{padding:48px 0}
  .section-title{font-size:clamp(32px,9vw,42px);line-height:1}
  .muted{font-size:16px}
  .eyebrow{font-size:11px;letter-spacing:.16em}
  .card{padding:22px}
  .grid,.steps,.reviews{grid-template-columns:1fr;gap:12px;margin-top:28px}
  .split,.quote-grid{gap:30px}

  .badge{font-size:11px;letter-spacing:.06em;padding:7px 12px;margin-bottom:16px;max-width:100%;white-space:normal;line-height:1.35}
  h1{font-size:clamp(38px,11vw,50px);line-height:.94;margin-bottom:18px;letter-spacing:-.015em}
  .city-hero-inner{padding:38px 0!important}
  .city-hero-grid{gap:24px}
  .city-hero p{font-size:16px;line-height:1.5;margin-bottom:22px!important}
  .hero-quote-card{padding:20px 16px;border-radius:18px;margin-top:0}
  .hero-quote-title{font-size:18px;margin-bottom:14px;padding-bottom:12px}
  .hero-quote-card .fi,.fi{font-size:16px;min-width:0}
  .fsub{min-height:46px}

  .hero{height:calc(100svh - 64px);min-height:610px;max-height:760px}
  .hero-inner{padding:28px 0 72px}
  .main-hero-text{font-size:clamp(42px,12.5vw,56px)!important;line-height:.9;margin-bottom:18px}
  .hero-inner p{font-size:16px;line-height:1.5;max-width:88%;margin-bottom:24px}
  .hero-actions{gap:10px;width:100%}
  .hero-actions .btn{width:100%;justify-content:center;text-align:center;padding:13px 18px;font-size:16px}
  .hero-arrow{width:38px;height:38px;font-size:16px}
  .hero-arrow.next{right:10px}
  .hero-counter{top:10px;right:10px;font-size:11px;padding:3px 7px}
  .hero-dots{bottom:18px;gap:6px}
  .hero-dot.active{width:22px}

  .stats-bar{padding:24px 0}
  .stats-row{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:22px 14px}
  .stat-num{font-size:32px}
  .stat-label{font-size:12px}

  .ba-card{min-height:0;height:auto;aspect-ratio:4/3;border-radius:22px}
  .ba-circle{width:36px;height:36px}
  .ba-lbl{bottom:12px;font-size:11px;padding:4px 10px}
  .ba-lbl-b{left:12px}
  .ba-lbl-a{right:12px}

  .qfc{padding:24px 18px}
  .areas{gap:8px;margin-top:22px}
  .pill{padding:8px 13px;font-size:13px}
  footer{padding:30px 0}
  footer .container{align-items:flex-start!important;flex-direction:column}

  #picker-overlay{padding:12px}
  .picker-box{padding:26px 18px;border-radius:22px;max-height:calc(100dvh - 24px);overflow-y:auto}
  .picker-box h2{font-size:28px}
  .picker-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}
  .pcity{padding:12px 6px;font-size:14px}
}

@media(max-width:380px){
  .container{width:calc(100% - 24px)}
  .logo-vista{font-size:19px}
  .logo-sub{font-size:7px}
  .btn-sm{padding:9px 11px;font-size:11px}
  h1{font-size:36px}
  .main-hero-text{font-size:40px!important}
  .hero{min-height:590px}
  .card{padding:20px}
  .stats-row{gap:18px 10px}
  .stat-num{font-size:29px}
}

@media(max-width:900px) and (orientation:landscape){
  .city-hero{height:auto!important;min-height:0}
  .city-hero-inner{padding:34px 0!important}
  .hero{height:auto;min-height:560px;max-height:none}
}



/* Tune-up promotion popup */
#tuneup-promo{display:none;position:fixed;inset:0;z-index:3000;background:rgba(0,0,0,.76);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);align-items:center;justify-content:center;padding:18px;}
#tuneup-promo.show{display:flex;}
.promo-card{position:relative;width:min(470px,100%);max-height:calc(100dvh - 36px);overflow-y:auto;background:#121212;border:1px solid #2b2b2b;border-radius:26px;padding:34px 30px 28px;box-shadow:0 24px 80px rgba(0,0,0,.68);text-align:center;}
.promo-close{position:absolute;top:12px;right:12px;width:38px;height:38px;border-radius:50%;border:1px solid #363636;background:#1b1b1b;color:#fff;font-size:23px;line-height:1;display:flex;align-items:center;justify-content:center;cursor:pointer;z-index:2;transition:border-color .18s,background .18s,color .18s;}
.promo-close:hover,.promo-close:focus{border-color:var(--gold);color:var(--gold);background:#202020;outline:none;}
.promo-eyebrow{font-family:var(--fh);font-size:12px;font-weight:700;letter-spacing:.18em;text-transform:uppercase;color:var(--gold);margin-bottom:12px;}
.promo-card h2{font-family:var(--fh);font-size:clamp(34px,8vw,48px);font-weight:900;text-transform:uppercase;line-height:.92;margin:0 22px 12px;letter-spacing:-.01em;}
.promo-copy{color:#aaa;font-size:15px;line-height:1.5;max-width:360px;margin:0 auto 18px;}
.promo-price{display:flex;align-items:flex-end;justify-content:center;gap:12px;margin:12px 0 22px;}
.promo-old{font-family:var(--fh);font-size:22px;font-weight:700;color:#777;text-decoration:line-through;text-decoration-thickness:2px;margin-bottom:7px;}
.promo-new{font-family:var(--fh);font-size:58px;font-weight:900;color:var(--gold);line-height:.8;letter-spacing:-.03em;}
.promo-per{font-family:var(--fh);font-size:17px;font-weight:700;text-transform:uppercase;color:#ddd;margin-bottom:4px;}
.promo-form{text-align:left;margin-top:6px;}
.promo-form .fg{margin-bottom:10px;}
.promo-form .fi{font-size:16px;background:#1f1f1f;}
.promo-claim-btn{width:100%;justify-content:center;margin-top:4px;}
.promo-error{display:none;color:#e06b6b;font-size:13px;margin:9px 0 0;text-align:center;}
.promo-note{font-size:11px;color:#727272;line-height:1.45;margin-top:11px;text-align:center;}
.promo-success{display:none;padding:18px 4px 8px;}
.promo-success .qsuccess-icon{margin-bottom:16px;}
.promo-success h3{font-family:var(--fh);font-size:28px;text-transform:uppercase;margin-bottom:8px;}
.promo-success p{color:#aaa;font-size:15px;line-height:1.5;max-width:350px;margin:0 auto;}
body.promo-open{overflow:hidden;}
@media(max-width:540px){
  #tuneup-promo{padding:12px;align-items:center;}
  .promo-card{border-radius:22px;padding:30px 18px 22px;max-height:calc(100dvh - 24px);}
  .promo-close{top:9px;right:9px;width:36px;height:36px;}
  .promo-card h2{font-size:36px;margin-left:28px;margin-right:28px;}
  .promo-new{font-size:50px;}
  .promo-old{font-size:20px;}
  .promo-per{font-size:15px;}
}


/* Floating phone call button: visible on all pages and screen sizes */
.floating-call-now {
  position: fixed;
  right: max(20px, env(safe-area-inset-right));
  bottom: max(20px, env(safe-area-inset-bottom));
  z-index: 950;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
  min-height: 54px;
  padding: 13px 22px;
  background: var(--gold);
  color: #101509;
  border: 1px solid rgba(255,255,255,.16);
  border-radius: 999px;
  box-shadow: 0 8px 30px rgba(0,0,0,.45);
  font-family: var(--fh);
  font-weight: 900;
  font-size: 18px;
  letter-spacing: .04em;
  line-height: 1;
  text-transform: uppercase;
  white-space: nowrap;
  text-decoration: none;
  cursor: pointer;
  transition: transform .2s ease, background-color .2s ease, box-shadow .2s ease;
}
.floating-call-now svg {
  width: 21px;
  height: 21px;
  flex-shrink: 0;
}
.floating-call-now:hover {
  background: #8a9c4f;
  transform: translateY(-3px);
  box-shadow: 0 12px 36px rgba(0,0,0,.5);
}
.floating-call-now:focus-visible {
  outline: 3px solid #fff;
  outline-offset: 4px;
}
@media (max-width: 600px) {
  .floating-call-now {
    right: max(14px, env(safe-area-inset-right));
    bottom: max(14px, env(safe-area-inset-bottom));
    min-height: 50px;
    padding: 12px 18px;
    font-size: 16px;
  }
}
@media (prefers-reduced-motion: reduce) {
  .floating-call-now { transition: none; }
}


/* Site-wide Schedule Myself booking CTA — paired with existing Call Now */
.floating-schedule-now {
  position: fixed;
  right: max(20px, env(safe-area-inset-right));
  bottom: calc(max(20px, env(safe-area-inset-bottom)) + 66px);
  z-index: 950;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
  min-height: 54px;
  padding: 13px 21px;
  border-radius: 999px;
  background: #1c2818;
  color: #f8fbf3;
  border: 1px solid #9aaf63;
  box-shadow: 0 9px 28px rgba(0,0,0,.5);
  font-family: var(--fh);
  font-weight: 800;
  font-size: 17px;
  letter-spacing: .035em;
  line-height: 1.1;
  text-transform: uppercase;
  text-decoration: none;
  white-space: nowrap;
  cursor: pointer;
  transition: transform .2s ease, background-color .2s ease, box-shadow .2s ease;
}
.floating-schedule-now svg { width: 20px; height: 20px; flex-shrink: 0; }
.floating-schedule-now:hover { background: #314621; transform: translateY(-3px); box-shadow: 0 12px 36px rgba(0,0,0,.5); }
.floating-schedule-now:focus-visible { outline: 3px solid #fff; outline-offset: 4px; }
@media (max-width: 600px) {
  .floating-schedule-now {
    right: max(14px, env(safe-area-inset-right));
    bottom: calc(max(14px, env(safe-area-inset-bottom)) + 62px);
    min-height: 50px;
    padding: 11px 16px;
    font-size: 15px;
  }
}
@media (prefers-reduced-motion: reduce) {
  .floating-schedule-now { transition: none; }
}


/* Thanksgiving promotional offer details — original site styling retained */
.promo-card { width: min(510px, 100%); background: linear-gradient(152deg,#172016 0%,#121512 30%,#121212 67%); border-color: #40502c; }
.promo-eyebrow { letter-spacing: .12em; font-size: 12px; margin: 0 24px 10px; }
.promo-card h2 { font-size: clamp(35px, 8vw, 49px); margin-bottom: 12px; }
.promo-copy { max-width: 440px; color: #d1d0cb; margin-bottom: 16px; }
.promo-copy strong { color: #f5f3e7; font-weight: 700; }
.promo-deals { display:grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 10px; margin: 0 0 18px; }
.promo-deal { display:flex; flex-direction: column; align-items:center; justify-content:center; min-height: 152px; padding: 14px 11px 12px; border: 1px solid #38452f; border-radius: 16px; background: rgba(24,32,22,.88); }
.promo-deal-free { border-color: #69833f; background: linear-gradient(150deg,rgba(58,80,41,.37),rgba(18,27,17,.85)); }
.promo-deal-label { font-family: var(--fh); text-transform:uppercase; font-size: 14px; line-height: 1.1; letter-spacing: .035em; font-weight: 700; min-height: 32px; color: #f2f1e7; display: flex; align-items: center; justify-content:center; }
.promo-deal-price { font-family: var(--fh); font-weight:900; line-height:1; font-size: 47px; letter-spacing: -.02em; color: #a8c576; margin: 8px 0 5px; }
.promo-deal-detail { font-size: 12px; line-height: 1.3; color: #c9cbbf; }
.promo-claim-btn { font-size:18px; }
@media (max-width: 600px) {
  .promo-card { padding: 28px 16px 19px; }
  .promo-card h2 { margin-left: 24px; margin-right: 24px; font-size: 37px; }
  .promo-deals { gap: 8px; margin-bottom: 13px; }
  .promo-deal { padding: 11px 7px; min-height: 146px; }
  .promo-deal-label { font-size: 12px; min-height: 39px; }
  .promo-deal-price { font-size: 43px; }
  .promo-deal-detail { font-size: 11px; }
  .promo-copy { font-size: 14px; margin-bottom: 12px; }
}
@media (max-height: 720px) {
  .promo-card { padding-top: 17px; padding-bottom: 13px; }
  .promo-eyebrow { font-size: 11px; margin-bottom: 5px; }
  .promo-card h2 { font-size: 32px; margin-bottom: 8px; }
  .promo-copy { font-size: 13px; line-height: 1.3; margin-bottom: 9px; }
  .promo-deals { margin-bottom: 9px; }
  .promo-deal { min-height: 112px; padding: 9px 6px; }
  .promo-deal-label { font-size: 11px; min-height: 29px; }
  .promo-deal-price { font-size: 37px; margin: 4px 0 3px; }
  .promo-deal-detail { font-size: 10px; }
  .promo-form .fg { margin-bottom: 6px; }
  .promo-form .fi { font-size: 14px; padding: 8px 10px; }
  .promo-claim-btn { font-size: 16px; padding: 10px 13px; }
  .promo-note { font-size: 10px; line-height: 1.3; margin-top: 6px; }
}



/* SEO additions retain the original Vista Garage Co. visual system */
.seo-promo-banner{background:#121811;border-bottom:1px solid #354522;color:#eee;display:flex;gap:12px;align-items:center;justify-content:center;flex-wrap:wrap;padding:10px 18px;text-align:center;font-size:13px}
.seo-promo-banner strong{color:#ced9ab}
.seo-promo-banner button{border:1px solid #708238;background:#708238;color:#080808;border-radius:30px;padding:6px 14px;font-family:var(--fb);font-weight:700;cursor:pointer}
.seo-intro,.seo-faqs,.seo-where,.seo-services,.seo-content{background:#0c0d0b;border-top:1px solid #1c261b}
.seo-content .container,.seo-intro .container,.seo-faqs .container,.seo-where .container,.seo-services .container{max-width:1140px}
.seo-eyebrow{font-weight:700;color:#aaba7e;letter-spacing:.14em;text-transform:uppercase;font-size:13px;margin-bottom:15px}
.seo-h2{font-family:var(--fh);font-size:clamp(30px,4vw,48px);font-weight:900;line-height:1.02;text-transform:uppercase;margin-bottom:18px}
.seo-lead,.seo-prose{color:#c3c3c0;max-width:790px;line-height:1.85;font-size:16px;margin:0 0 15px}
.seo-list{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:15px;margin:24px 0 6px}
.seo-tile,.seo-faq{border:1px solid #333b2d;background:#141713;border-radius:18px;padding:22px}
.seo-tile h3,.seo-faq h3{font-family:var(--fh);font-size:22px;font-weight:700;text-transform:uppercase;line-height:1.15;margin-bottom:11px}
.seo-tile p,.seo-faq p{font-size:15px;color:#bbb;line-height:1.75}
.seo-link{color:#bfd58c;text-decoration:underline;text-underline-offset:3px}
.seo-crumbs{display:block;height:auto;min-height:0;background:#101110;padding:12px max(4%,calc((100% - 1180px)/2));font-size:13px;color:#bbb}
.seo-crumbs a{color:#b5d06f}
.seo-content-hero{background:linear-gradient(110deg,rgba(0,0,0,.93),rgba(0,0,0,.65)),url('/assets/garage-image-01-a53db52a9f01.jpg') center/cover; padding:100px 0 92px}
.seo-content-hero h1{font-family:var(--fh);font-size:clamp(40px,6vw,74px);font-weight:900;line-height:1;text-transform:uppercase;max-width:800px;margin-bottom:22px}
.seo-content-hero h1 em{font-style:normal;color:#b0c57b}
.seo-content-hero p{font-size:18px;max-width:700px;color:#dfdfdf;margin-bottom:22px}
.seo-cta-row{display:flex;align-items:center;gap:12px;flex-wrap:wrap;margin-top:24px}
.seo-area-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(190px,1fr));gap:12px;margin-top:28px}
.seo-area-grid a{display:flex;justify-content:space-between;gap:8px;background:#171817;border:1px solid #30392d;border-radius:12px;padding:14px;color:#f0ede8;font-weight:600}
.seo-area-grid a:hover{border-color:#93a75e;background:#1c2118}
.seo-area-grid a span{color:#aabf83}
.seo-footer-nav{padding:14px 0;border-top:1px solid #283020;background:#101110;font-size:13px;color:#b6c39b}
.seo-footer-nav .container{display:flex;gap:14px;flex-wrap:wrap}
.seo-footer-nav a:hover{color:#fff;text-decoration:underline}
#picker-overlay .picker-grid{max-height:45vh;overflow:auto}
#picker-overlay .pcity{cursor:pointer}
.seo-internal-links{display:flex;gap:10px;flex-wrap:wrap;margin:20px 0 8px}
.seo-internal-links a{padding:9px 13px;border:1px solid #394331;border-radius:30px;color:#b0cf7b;font-size:14px}
.seo-internal-links a:hover{background:#1b2514}
.seo-ribbon{padding:10px 0;color:#aaa;font-size:13px}
@media(max-width:700px){.seo-content-hero{padding:63px 0}.seo-list{grid-template-columns:1fr}.seo-area-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.seo-area-grid a{font-size:12px;padding:12px}.seo-promo-banner{font-size:12px}.seo-promo-banner button{padding:6px 10px}}
@media(max-width:390px){.seo-area-grid{grid-template-columns:1fr}}

/* 2026-11-11 stability and SEO readability patch */
/* Display-block prevents the large fallback heading from flashing before Barlow Condensed loads. */
html{scrollbar-gutter:stable;}
.seo-more-heading{margin-top:42px;}
.card h3 a{display:inline-block;text-decoration:none;color:inherit;}
.card h3 a:hover,.card h3 a:focus-visible{color:#bfd58c;text-decoration:underline;text-underline-offset:4px;}
@media(max-width:700px){.seo-more-heading{margin-top:32px;}}



/* Vista Garage Co. specialty services — supplements original typography and layout. */
.specialty-section{background:linear-gradient(140deg,#0f160e 0%,#101210 56%,#0b0e0b 100%);border-top:1px solid #273023;border-bottom:1px solid #273023}
.specialty-section .section-title{max-width:950px}
.specialty-amp{color:var(--gold)}
.specialty-intro{color:var(--muted);font-size:16px;line-height:1.7;max-width:750px;margin-top:14px}
.specialty-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px;margin-top:34px}
.specialty-card{background:#171a15;border:1px solid #30382b;border-radius:var(--r);padding:30px 27px;display:flex;flex-direction:column;min-width:0;transition:border-color .2s,transform .2s}
.specialty-card:hover{border-color:#778e54;transform:translateY(-3px)}
.specialty-symbol{display:flex;align-items:center;justify-content:center;width:58px;height:58px;border-radius:16px;border:1px solid #526545;background:#212a1e;color:#b4c98b;margin-bottom:22px}
.specialty-symbol svg{width:36px;height:36px}
.specialty-label{font-size:11px;letter-spacing:.14em;font-weight:700;text-transform:uppercase;color:#b4c98b;margin-bottom:10px}
.specialty-card h3{font-family:var(--fh);font-size:clamp(23px,2.1vw,29px);font-weight:700;text-transform:uppercase;line-height:1.08;margin:0 0 15px}
.specialty-card p{color:#bfc3bb;font-size:15px;line-height:1.68;flex:1;margin:0 0 24px}
.specialty-link{color:#c9e5a6;font-size:14px;font-weight:700;text-decoration:none;display:inline-flex;gap:8px;align-items:center;line-height:1.4}
.specialty-link:hover,.specialty-link:focus-visible{text-decoration:underline;text-underline-offset:4px}
.specialty-cta{display:flex;gap:22px;justify-content:space-between;align-items:center;padding:25px 28px;background:#192219;border:1px solid #334431;border-radius:var(--r);margin-top:22px}
.specialty-cta p{margin:0;color:#d0d7c9;line-height:1.5;max-width:650px}
.specialty-cta .btn{white-space:nowrap}
@media(max-width:950px){.specialty-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.specialty-card:last-child{grid-column:1 / -1}}
@media(max-width:650px){.specialty-grid{grid-template-columns:1fr}.specialty-card:last-child{grid-column:auto}.specialty-card{padding:25px 23px}.specialty-cta{flex-direction:column;align-items:stretch}.specialty-cta .btn{text-align:center;justify-content:center}.specialty-section .section-title{overflow-wrap:break-word}}


/* 2026-11-11 — synchronized service-photo cards; original service copy and card layout preserved. */
.specialty-card{position:relative;isolation:isolate;overflow:hidden;min-height:490px;background:#141914;border-color:rgba(184,204,160,.3);transform:translateZ(0)}
.specialty-card:hover{border-color:#a5c77b}
.specialty-photos,.service-photo-rotator{position:absolute;inset:0;overflow:hidden}
.specialty-photos{z-index:-2}
.specialty-photo{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center;opacity:0;transition:opacity 1050ms ease-in-out;will-change:opacity}
.specialty-photo.is-active{opacity:1}
.specialty-card::after{content:"";position:absolute;inset:0;z-index:-1;pointer-events:none;background:linear-gradient(180deg,rgba(5,8,5,.41) 0%,rgba(6,10,6,.72) 34%,rgba(6,9,7,.86) 76%,rgba(4,7,5,.94) 100%)}
.specialty-card .specialty-label{margin-top:95px;color:#d5f0a4;text-shadow:0 1px 8px rgba(0,0,0,.75)}
.specialty-card h3,.specialty-card p,.specialty-card .specialty-link{text-shadow:0 1px 9px rgba(0,0,0,.82)}
.specialty-card h3{color:#fff}
.specialty-card p{color:#f0f2ed}
.specialty-card .specialty-link{color:#d9ffac}
.specialty-card:focus-within{border-color:#cde49c}
.specialty-card .specialty-link:focus-visible{outline:2px solid #d5f0a4;outline-offset:5px;border-radius:3px}
/* Additional photos are shown on each matching detail page, not just the homepage. */
.service-photo-showcase{padding-top:38px;padding-bottom:40px;background:#0e130f}
.service-photo-showcase .seo-h2{margin-bottom:8px}
.service-photo-note{color:#bdc6b8;line-height:1.6;font-size:15px;margin:0 0 22px;max-width:760px}
.service-photo-rotator{position:relative;border-radius:22px;aspect-ratio:16/7;max-height:560px;min-height:290px;background:#192119;border:1px solid #364334}
.service-photo-rotator::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(3,8,5,.05),rgba(4,9,4,.10));pointer-events:none}
@media(max-width:950px){.specialty-card{min-height:480px}}
@media(max-width:650px){.specialty-card{min-height:475px}.specialty-card .specialty-label{margin-top:70px}.service-photo-showcase{padding:30px 0}.service-photo-rotator{aspect-ratio:4/3;min-height:265px;border-radius:18px}}
@media(prefers-reduced-motion:reduce){.specialty-photo{transition:none}.specialty-card:hover{transform:none}}

/* Horizontal motion (rather than fades), synchronized across all three cards. */
.specialty-photo-track{position:absolute;inset:0;display:flex;height:100%;width:100%;transform:translate3d(0,0,0);transition:transform 900ms cubic-bezier(.55,.08,.32,.99);will-change:transform}
.specialty-photo-track .specialty-photo{position:relative;inset:auto;display:block;width:100%;height:100%;flex:0 0 100%;object-fit:cover;opacity:1;transition:none;will-change:auto}
@media(prefers-reduced-motion:reduce){.specialty-photo-track{transition:none}}


/* Vista Garage Co.: trustworthy reviews and accessible left-to-right continuous motion */
.review-section{overflow:hidden}
.vista-review-mount{margin-top:32px}
.vista-review-viewport{position:relative;overflow:hidden;max-width:100%;border-radius:14px;outline-offset:4px;mask-image:linear-gradient(to right,transparent,#000 4%,#000 96%,transparent)}
.vista-review-track{display:flex;width:max-content;will-change:transform;animation:vista-review-rightward var(--review-duration,42s) linear infinite}
.vista-review-group{display:flex;gap:16px;padding-right:16px;flex:none}
.vista-review-card{box-sizing:border-box;width:clamp(252px,29vw,370px);flex:none;padding:28px;border:1px solid rgba(129,153,106,.32);background:#171c16;color:#f4f4ee;border-radius:18px;min-height:222px;display:flex;flex-direction:column;gap:12px}
.vista-review-card .stars{font-size:18px;letter-spacing:2px;color:#c2df82}
.vista-review-quote{margin:0;color:#f1f2e9;font-size:16px;line-height:1.6;flex:1;white-space:normal}
.vista-review-byline{font-size:12px;letter-spacing:.02em;color:#c3cbb6;display:flex;gap:12px;align-items:center;justify-content:space-between}
.vista-review-byline a{color:#cbe698;text-decoration:underline;text-underline-offset:3px}
.vista-review-viewport:hover .vista-review-track,.vista-review-viewport:focus-within .vista-review-track{animation-play-state:paused}
@keyframes vista-review-rightward{from{transform:translate3d(-50%,0,0)}to{transform:translate3d(0,0,0)}}
.vista-review-empty{border:1px solid rgba(129,153,106,.38);border-radius:18px;padding:28px;background:#171c16;max-width:690px}
.vista-review-empty p{color:#bfc5b9;margin:8px 0 18px;line-height:1.65}
.vista-review-empty a{display:inline-flex;align-items:center;color:#d6eea8;text-decoration:underline;text-underline-offset:4px}
.review-section .review-note{font-size:13px;color:#a6b19e;margin-top:14px}
@media(max-width:650px){.vista-review-card{width:min(80vw,310px);min-height:215px;padding:22px}.vista-review-viewport{mask-image:linear-gradient(to right,transparent,#000 5%,#000 95%,transparent)}}
@media(prefers-reduced-motion:reduce){.vista-review-viewport{mask-image:none;overflow-x:auto}.vista-review-track{animation:none!important;transform:none!important}.vista-review-group[aria-hidden="true"]{display:none}}
