@font-face{font-family:"Big Shoulders";src:url(fonts/big-shoulders-900.woff2) format("woff2");font-weight:900;font-display:swap}
@font-face{font-family:Barlow;src:url(fonts/barlow-500.woff2) format("woff2");font-weight:500;font-display:swap}
@font-face{font-family:Barlow;src:url(fonts/barlow-700.woff2) format("woff2");font-weight:700;font-display:swap}

:root{
  --ground:#0e0f10; --raised:#1a1b1d; --line:#33353a;
  --text:#f2efe6; --muted:#b4b6b9; --sign:#ff7a1a;
  --blue:#1d5fd4; --paper:#f7f8fa;
  --foam:#ff5aa8; --rinse:#35c8ff; --wax:#ffb020; --dry:#f4f7fa;
  --gutter:clamp(16px,4vw,56px); --bar:0px;
  --display:"Big Shoulders",Haettenschweiler,"Arial Narrow",sans-serif;
}
*{box-sizing:border-box;margin:0}
html{background:var(--ground);scrollbar-color:var(--line) var(--ground)}
html.lenis,html.lenis body{height:auto}
.lenis.lenis-smooth{scroll-behavior:auto!important}
body{background:var(--ground);color:var(--text);font:500 1.125rem/1.5 Barlow,system-ui,sans-serif;padding-bottom:var(--bar);overflow-x:clip}
::selection{background:var(--sign);color:var(--ground)}
h1,h2,h3{font-family:var(--display);font-weight:900;text-transform:uppercase;line-height:.92;letter-spacing:.005em;text-wrap:balance}
h2{font-size:clamp(3.2rem,9vw,7.5rem)}
ul,ol{list-style:none;padding:0}
address{font-style:normal}
a{color:inherit}
:focus-visible{outline:3px solid var(--rinse);outline-offset:3px}
svg{display:block}



.btn{display:inline-flex;align-items:center;justify-content:center;gap:.55rem;min-height:56px;padding:.5rem 1.4rem;border:3px solid var(--text);color:var(--text);background:transparent;font-family:var(--display);font-weight:900;font-size:1.65rem;line-height:1;text-transform:uppercase;text-decoration:none;transition:background-color .18s,color .18s,border-color .18s}
.btn svg{width:24px;height:24px;flex:none}
.btn:hover{background:var(--text);color:var(--ground)}
.btn-main{background:var(--sign);border-color:var(--sign);color:var(--ground)}
.btn-main:hover{background:var(--text);border-color:var(--text)}
.actions{display:flex;flex-wrap:wrap;gap:.75rem}
.plain{text-underline-offset:.2em}

/* hero */
.hero{position:relative;isolation:isolate;min-height:calc(100svh - var(--bar));display:flex;flex-direction:column;justify-content:flex-end;gap:clamp(1.25rem,3vh,2.5rem);padding:clamp(4.5rem,11vh,7rem) var(--gutter) clamp(1.5rem,4vh,3rem);overflow:hidden;touch-action:pan-y}
.hero-photo{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:62% 50%;z-index:-2;filter:grayscale(1) contrast(1.15) brightness(.42)}
.hero::before{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(90deg,rgba(14,15,16,.82),rgba(14,15,16,.25) 75%),linear-gradient(0deg,#0e0f10 2%,transparent 45%)}
.hero-canvas{position:absolute;inset:0;width:100%;height:100%;z-index:-1}
.canopy{position:absolute;inset:0 0 auto;height:clamp(14px,2vh,22px);background:var(--text);box-shadow:0 18px 60px 8px rgba(255,240,205,.32)}
.canopy::before{content:"";position:absolute;inset:100% 0 auto;height:55vh;background:linear-gradient(rgba(255,236,200,.17),transparent)}
.canopy::after{content:"";position:absolute;inset:100% 0 auto;height:6px;background:linear-gradient(90deg,var(--blue) 0 36%,var(--sign) 36%)}
.sign{position:relative;font-size:min(19.5vw,29svh);line-height:.84;white-space:nowrap;color:var(--text);--lx:30%;--ly:40%}
.sign-lit{position:absolute;inset:0;color:#fffaf0;opacity:0;pointer-events:none}
.motion .sign-base{color:#d8d5cb}
.lite .sign-lit{display:none}
.lite .sign-base{color:var(--text)}
.motion .sign-lit{opacity:1;text-shadow:0 0 34px rgba(255,214,150,.65);-webkit-mask-image:radial-gradient(circle 26vw at var(--lx) var(--ly),#000 30%,transparent 100%);mask-image:radial-gradient(circle 26vw at var(--lx) var(--ly),#000 30%,transparent 100%)}
.hero-info{display:grid;grid-template-columns:1fr auto;gap:1.25rem 3rem;align-items:end}
.hero-info>:first-child{grid-column:1/-1}
.hero .actions{justify-content:flex-end}
.tagline{font-family:var(--display);font-weight:900;font-size:clamp(1.9rem,3.6vw,3.2rem);line-height:1;text-transform:uppercase;text-wrap:balance}
.sub{color:var(--muted);margin-top:.35rem}
.facts{font-weight:700}

/* promo */
.promo{background:var(--sign);color:var(--ground);display:grid;grid-template-columns:1.1fr 1fr 1.25fr}
.promo-item{padding:clamp(1.75rem,4vw,3.25rem) var(--gutter);display:flex;flex-direction:column;justify-content:space-between;gap:1.25rem;align-items:flex-start}
.promo-item+.promo-item{border-left:3px solid var(--ground)}
.promo-ic{width:52px;height:52px;color:var(--ground)}
.punch{display:flex;gap:6px;align-items:center}
.punch i{width:22px;height:22px;border-radius:50%;background:var(--ground)}
.punch b{display:grid;place-items:center;height:30px;padding:0 8px;margin-left:4px;border:3px dashed var(--ground)}
.punch b svg{width:44px;height:18px;color:var(--ground)}
.promo h2{font-size:clamp(3rem,5.6vw,5.5rem)}
.promo-note{font-weight:700}
.promo h2 span{display:block;font-size:.5em;line-height:1.02;margin-top:.15em}

/* E85 */
.e85{background:var(--paper);color:var(--ground);display:grid;grid-template-columns:1.3fr 1fr;gap:clamp(1.5rem,4vw,4rem);align-items:center;padding:clamp(4rem,10vh,7rem) var(--gutter)}
.e85 h2{font-size:clamp(2.4rem,5vw,4.5rem)}
.e85-big{display:block;width:max-content;font-size:clamp(8rem,24vw,20rem);line-height:.8;border-bottom:clamp(8px,1.2vw,16px) solid var(--sign);padding-bottom:.04em;margin-bottom:.12em}
.e85 p{max-width:52ch;margin-top:1rem}
.e85 .btn{margin-top:1.75rem}
.e85-photo{display:block;width:100%;height:auto;aspect-ratio:4/5;object-fit:cover;object-position:50% 62%}

.e85-head{display:flex;align-items:center;gap:clamp(1rem,3vw,2.5rem);flex-wrap:wrap}
.e85-ring{width:clamp(110px,13vw,170px);height:auto;flex:none}
.e85-check{display:flex;gap:.6rem;align-items:center;font-weight:700}
.e85-check svg{width:26px;height:26px;flex:none;color:#2f9e55}
.e85-save{margin-top:1.75rem;max-width:30rem}
.save-title{font-weight:700;margin:0 0 .6rem!important}
.save-steps{display:flex;align-items:flex-end;gap:.5rem;height:150px}
.save-steps span{flex:1;height:calc(34% + var(--h) * 22%);background:var(--ground);color:var(--paper);display:flex;flex-direction:column;justify-content:flex-end;padding:.6rem .7rem;font-weight:700;font-size:.95rem;transform-origin:bottom}
.save-steps span:nth-child(3){background:var(--sign);color:var(--ground)}
.save-steps b{font-family:var(--display);font-weight:900;font-size:clamp(2rem,3.4vw,2.8rem);line-height:1}

/* tunnel */
.tunnel{padding:clamp(3rem,8vh,6rem) var(--gutter) 0;background:var(--ground);overflow:hidden}
.tunnel-text{display:grid;gap:clamp(1rem,3vh,2rem)}
.tunnel h2{font-size:clamp(2.6rem,min(6vw,9vh),5.5rem)}
.stages{display:grid;grid-template-columns:repeat(4,1fr);gap:0 1rem}
.stages li{--c:var(--text);border-top:5px solid var(--c);padding-top:.6rem;display:flex;flex-direction:column;transition:color .25s,border-color .25s}
.stages li[data-color=foam]{--c:var(--foam)}.stages li[data-color=rinse]{--c:var(--rinse)}.stages li[data-color=wax]{--c:var(--wax)}.stages li[data-color=dry]{--c:var(--dry)}
.stages strong{font-family:var(--display);font-weight:900;font-size:clamp(2.2rem,5vw,4.6rem);line-height:1;text-transform:uppercase;color:var(--c);transition:color .25s}
.scene-wrap{margin:1.5rem calc(var(--gutter)*-1) 0;overflow:hidden}
.scene{width:100%;height:auto}
.gantry .lamp{opacity:.5;transition:opacity .25s}
.pin-on .tunnel{height:100svh;padding-bottom:var(--bar);display:flex;flex-direction:column}
.pin-on .scene-wrap{flex:1;min-height:0}
.pin-on .scene{height:100%}
.pin-on .fx{opacity:0;transition:opacity .2s}
.pin-on .gantry .lamp{opacity:.08}
.pin-on .gantry.is-on .lamp{opacity:1}
.pin-on .gantry .bar{opacity:.3}
.pin-on .gantry.is-on .bar{opacity:1}
.pin-on .gantry.is-on .fx{opacity:1}
.pin-on .stages li{border-color:var(--line)}
.pin-on .stages strong{color:#85878c}
.pin-on .stages li.is-on{border-color:var(--c)}
.pin-on .stages li.is-on strong{color:var(--c)}
.gantry.is-on .fx-foam circle{animation:fall .9s linear infinite}
.gantry.is-on .fx-foam circle:nth-child(even){animation-delay:-.45s}
.gantry.is-on .fx-wax ellipse{animation:fall .7s linear infinite}
.gantry.is-on .fx-wax ellipse:nth-child(even){animation-delay:-.35s}
.gantry.is-on .fx-rinse{animation:dash .35s linear infinite}
.gantry.is-on .fx-dry{animation:dash-side .3s linear infinite}
@keyframes fall{from{transform:translateY(-14px);opacity:0}20%{opacity:1}75%{opacity:.9}to{transform:translateY(70px);opacity:0}}
@keyframes dash{to{stroke-dashoffset:-48}}
@keyframes dash-side{to{stroke-dashoffset:-104}}
#car-foam{opacity:0}
.glint{transform-box:fill-box;transform-origin:center}
html:not(.pin-on) .glint{opacity:0}

/* sections */
.packages,.gas{padding:clamp(5rem,12vh,9rem) var(--gutter) 0}
.contact{background:var(--blue)}
.contact .phone{color:var(--paper)}
.contact .phone:hover{color:var(--sign)}
.sec-head{display:flex;flex-wrap:wrap;gap:1rem 2rem;align-items:flex-end;margin-bottom:clamp(1.5rem,4vh,3rem)}

/* packages: navy wash-bay tiles */
.packages{--navy:#0b1a33;--navy-2:#11264a;--navy-line:#24426f;--navy-ink:#9fb6dc;position:relative;isolation:isolate;overflow:hidden;background:var(--navy) radial-gradient(rgba(120,170,255,.1) 1.5px,transparent 1.7px) 0 0/22px 22px;padding-top:clamp(6rem,14vh,10rem);padding-bottom:clamp(4rem,10vh,7rem)}
.pk-wave{position:absolute;top:-1px;left:0;width:100%;height:clamp(24px,4vw,48px);color:var(--ground);z-index:-1}
.pk-bubbles i{position:absolute;z-index:-1;border:2px solid rgba(140,190,255,.2);border-radius:50%;animation:bob 9s ease-in-out infinite}
.pk-bubbles i:nth-child(1){width:180px;height:180px;right:6%;top:8%}
.pk-bubbles i:nth-child(2){width:70px;height:70px;right:22%;top:20%;animation-delay:-2s}
.pk-bubbles i:nth-child(3){width:34px;height:34px;right:16%;top:5%;animation-delay:-4s}
.pk-bubbles i:nth-child(4){width:120px;height:120px;left:-40px;top:55%;animation-delay:-1s}
.pk-bubbles i:nth-child(5){width:48px;height:48px;left:7%;bottom:6%;animation-delay:-5s}
.pk-bubbles i:nth-child(6){width:260px;height:260px;right:-90px;bottom:-80px;animation-delay:-3s}
@keyframes bob{50%{transform:translateY(-18px)}}
.pk-hint{color:var(--navy-ink);font-weight:700;font-size:1.2rem}
.cards{display:grid;grid-template-columns:repeat(4,1fr);gap:1rem}
.card{position:relative;overflow:hidden;background:var(--navy-2);border:3px solid var(--navy-line);padding:1.25rem 1.4rem 1.4rem;cursor:pointer;transition:transform .3s cubic-bezier(.2,.8,.2,1),border-color .2s,background-color .2s}
.card:hover{transform:translateY(-6px);border-color:#4f78b8}
.card.is-on{background:#15305c;border-color:var(--sign);transform:translateY(-6px)}
.card::before{content:"";position:absolute;inset:0 0 auto;height:6px;background:var(--sign);transform:scaleX(0);transform-origin:left;transition:transform .4s cubic-bezier(.2,.8,.2,1)}
.card.is-on::before{transform:none}
.card-sweep{position:absolute;inset:0;visibility:hidden;pointer-events:none;background:linear-gradient(100deg,transparent,rgba(255,90,168,.3) 25%,rgba(53,200,255,.35) 55%,rgba(255,176,32,.3) 80%,transparent)}
.card-top{display:flex;justify-content:space-between;align-items:flex-start;margin-bottom:.9rem}
.card-car{width:92px;height:38px;color:#5f7aa6;transition:color .2s}
.card.is-on .card-car{color:var(--sign)}
.card-check{display:grid;place-items:center;width:34px;height:34px;border:2px solid var(--navy-line);color:transparent;font-weight:700;transition:background-color .2s,border-color .2s,color .2s}
.card.is-on .card-check{background:var(--sign);border-color:var(--sign);color:var(--ground)}
.card h3{font-size:clamp(2.2rem,3vw,3.2rem);color:var(--paper);min-height:2em;display:flex;align-items:flex-end}
.card-btn{all:unset;cursor:pointer}
.card-btn::after{content:"";position:absolute;inset:0}
.card-btn:focus-visible::after{outline:3px solid var(--rinse);outline-offset:-3px}
.price{font-family:var(--display);font-weight:900;text-transform:uppercase;font-size:1.5rem;line-height:1;color:var(--navy-ink);margin:.6rem 0 1rem;min-height:1.6em;display:flex;align-items:center}
.price-set{font-size:clamp(2.6rem,3.6vw,3.4rem);color:var(--sign)}
.meter{height:8px;background:var(--navy);margin-bottom:.9rem}
.meter span{display:block;height:100%;width:calc(var(--lvl) * 20%);background:linear-gradient(90deg,#6fa8ff,var(--foam),var(--rinse),var(--wax),var(--dry));background-size:calc(500% / var(--lvl)) 100%;transform-origin:left;transition:opacity .2s}
.steps li{display:flex;align-items:center;gap:.7rem;padding:.5rem 0;border-top:1px solid var(--navy-line);color:#8ea3c8}
.steps svg{width:22px;height:22px;flex:none;transform-origin:center}
.steps li:not(.in){text-decoration:line-through;text-decoration-color:rgba(142,163,200,.7)}
.steps li.in{color:var(--paper);font-weight:700}
.steps li.in svg{color:var(--c)}
.steps [data-step=wash]{--c:#6fa8ff}.steps [data-step=foam]{--c:var(--foam)}.steps [data-step=rinse]{--c:var(--rinse)}.steps [data-step=wax]{--c:var(--wax)}.steps [data-step=dry]{--c:var(--dry)}
.motion .card.is-on .steps li.in svg{animation:pop .6s cubic-bezier(.3,1.8,.5,1) backwards}
.steps li:nth-child(2) svg{animation-delay:.12s}.steps li:nth-child(3) svg{animation-delay:.24s}.steps li:nth-child(4) svg{animation-delay:.36s}.steps li:nth-child(5) svg{animation-delay:.48s}
@keyframes pop{from{transform:scale(.4) rotate(-40deg)}}
.js .card:not(.is-on) .steps li.in{color:#c9d5ea;font-weight:500}
.js .card:not(.is-on) .steps li.in svg{color:#8fa6cc}
.js .card:not(.is-on) .meter span{opacity:.4}
/* bay status light: set data-status="on" or "off" on the figure */
.bay-photos figure{position:relative}
.bay-light{position:absolute;top:.75rem;left:.75rem;z-index:1;display:flex;align-items:center;gap:.55rem;padding:.45rem .85rem .45rem .65rem;background:rgba(11,26,51,.9);color:var(--paper);font-weight:700;font-size:1rem;line-height:1.2}
.lamp-dot{width:14px;height:14px;border-radius:50%;background:#2fd36b;box-shadow:0 0 0 3px rgba(47,211,107,.28)}
[data-status=off] .lamp-dot{background:#ff3b30;box-shadow:0 0 0 3px rgba(255,59,48,.3)}
[data-status=on] .off-txt,[data-status=off] .on-txt{display:none}
@media (prefers-reduced-motion:reduce){.pk-bubbles i{animation:none}}
.bay-photos{display:grid;grid-template-columns:1fr 1fr;gap:1rem}
.bay-photos figure{margin:0}
.bays-grid{display:grid;grid-template-columns:minmax(0,1.2fr) 1fr;gap:clamp(1.5rem,4vw,4rem);align-items:center;margin-top:clamp(4.5rem,11vh,8rem);padding-top:clamp(3rem,7vh,5rem);border-top:3px solid var(--navy-line)}
.bays-text h3{font-size:clamp(2.4rem,4.5vw,4rem);margin-bottom:1rem}
.bays-text p{margin-top:1.25rem;max-width:44ch}
.ticks li{display:flex;align-items:center;gap:.75rem;padding:.6rem 0;border-top:2px solid rgba(247,248,250,.3);font-size:1.3rem;font-weight:700}
.ticks li::before{content:"";width:14px;height:14px;background:var(--paper);flex:none}
.bay-photos img{display:block;width:100%;height:auto;aspect-ratio:4/5;object-fit:cover}
.bay-photos figcaption{font-family:var(--display);font-weight:900;font-size:clamp(1.8rem,3vw,2.6rem);text-transform:uppercase;margin-top:.4rem}
.motion .photo-wash{filter:grayscale(1) brightness(.6);transition:filter 1.4s cubic-bezier(.16,1,.3,1)}
.motion .photo-wash.is-clean{filter:none}

.gas-grid{display:grid;grid-template-columns:1.5fr 1fr;gap:clamp(1.5rem,4vw,4rem);align-items:start}
.rows li{display:flex;justify-content:space-between;align-items:center;gap:1rem;padding:.55rem 0;border-top:3px solid var(--line)}
.rows b svg.row-ic{width:.62em;height:.62em;flex:none;color:var(--sign);margin-right:.35em}
.row-link{font-family:var(--display);font-weight:900;font-size:2rem;text-decoration:none;display:grid;place-items:center;width:48px;height:48px;border:3px solid var(--sign);transition:background-color .2s,color .2s}
.row-link:hover{background:var(--sign);color:var(--ground)}
.rows li{transition:padding-left .25s}
.rows li:hover{padding-left:.6rem}
.rows b{display:flex;align-items:center;font-family:var(--display);font-weight:900;font-size:clamp(2.4rem,5.5vw,5rem);line-height:1;text-transform:uppercase}
.photo{display:block;width:100%;height:auto;aspect-ratio:4/5;object-fit:cover;object-position:30% 50%}

/* store */
.store{position:relative;overflow:hidden;padding:0 0 clamp(4rem,10vh,7rem);background:var(--ground)}
.store-marquee{background:var(--sign);color:var(--ground);overflow:hidden;border-block:3px solid var(--ground);transform:rotate(-1.5deg);margin:clamp(2rem,5vh,3.5rem) -2% clamp(3rem,8vh,5rem);width:104%}
.marquee-track{display:flex;width:max-content;animation:marquee 26s linear infinite}
.marquee-track span{font-family:var(--display);font-weight:900;font-size:clamp(2rem,4vw,3.4rem);text-transform:uppercase;line-height:1;padding:.6rem 1.4rem;white-space:nowrap;display:flex;align-items:center;gap:2.8rem}
.marquee-track span::after{content:"";width:.45em;height:.45em;background:var(--ground);border-radius:50%}
@keyframes marquee{to{transform:translateX(-50%)}}
.store-grid{display:grid;grid-template-columns:1fr 1.6fr;gap:clamp(2rem,5vw,5rem);align-items:center;padding:0 var(--gutter)}
.store-lead{font-size:1.4rem;font-weight:700;margin-top:1.25rem;max-width:30ch}
.store-list{margin-top:2rem}
.store-list li{display:flex;gap:1rem;align-items:flex-start;padding:1.1rem 0;border-top:3px solid var(--line);transition:border-color .25s}
.store-list li:hover{border-color:var(--sign)}
.store-list svg{width:48px;height:48px;flex:none;padding:10px;background:var(--raised);color:var(--sign);transition:background-color .25s,color .25s}
.store-list li:hover svg{background:var(--sign);color:var(--ground)}
.store-list b{display:block;font-family:var(--display);font-weight:900;text-transform:uppercase;font-size:clamp(1.9rem,3vw,2.6rem);line-height:1}
.store-list span{color:var(--muted)}
.store-photos{position:relative;display:grid;grid-template-columns:repeat(12,1fr);align-items:start;padding-bottom:3rem}
.sp{margin:0;overflow:hidden;background:var(--raised)}
.sp img{display:block;width:100%;height:100%;object-fit:cover;transition:transform .8s cubic-bezier(.2,.8,.2,1)}
.sp:hover img{transform:scale(1.05)}
.sp-1{grid-column:1/11;grid-row:1;aspect-ratio:4/3}
.sp-2{grid-column:7/13;grid-row:1;margin-top:42%;aspect-ratio:3/4;border:6px solid var(--ground);z-index:1}
.price-chip{font-style:normal;display:inline-block;vertical-align:.15em;margin-left:.4rem;padding:.3rem .6rem;background:var(--sign);color:var(--ground);font-size:.6em}
.ice-bag{position:absolute;right:-6px;top:-28px;width:clamp(110px,12vw,160px);height:auto;z-index:3;transform:rotate(8deg);animation:icebob 5s ease-in-out infinite}
.ice-tag{transform-box:fill-box;transform-origin:50% 0;animation:swing 2.6s ease-in-out infinite}
.ice-spark{animation:twinkle 1.8s ease-in-out infinite}
@keyframes icebob{50%{transform:rotate(4deg) translateY(-10px)}}
@keyframes swing{50%{transform:rotate(-10deg)}}
@keyframes twinkle{50%{opacity:.2}}
.sp-badge{position:absolute;left:-28px;bottom:0;width:clamp(96px,11vw,140px);height:auto;z-index:2}
.badge-ring{transform-box:fill-box;transform-origin:center;animation:spin 16s linear infinite}
@keyframes spin{to{transform:rotate(1turn)}}
@media (prefers-reduced-motion:reduce){.marquee-track,.badge-ring,.ice-bag,.ice-tag,.ice-spark{animation:none}}

.visit{display:grid;grid-template-columns:1fr 1.4fr;gap:clamp(1.5rem,4vw,4rem);padding:clamp(5rem,12vh,9rem) var(--gutter) 0;align-items:stretch}
.hours{margin:1.75rem 0 0;max-width:30rem}
.hours div{display:flex;justify-content:space-between;align-items:baseline;gap:1rem;padding:.6rem 0;border-top:3px solid var(--line);font-family:var(--display);font-weight:900;text-transform:uppercase;line-height:1}
.hours dt{font-size:clamp(1.6rem,2.6vw,2.2rem);color:var(--muted)}
.hours dd{margin:0;font-size:clamp(2.2rem,4vw,3.4rem);color:var(--wax)}
.open-now{display:inline-flex;align-items:center;gap:.55rem;margin-top:.6rem;padding:.35rem .8rem .35rem .65rem;border:2px solid currentColor;font-weight:700;color:#2fd36b}
.open-now::before{content:"";width:12px;height:12px;border-radius:50%;background:currentColor}
.open-now.is-closed{color:#ff6b5e}
.visit .open-now{margin-top:1.25rem}
.visit .btn{margin-top:1.75rem}
.visit address{margin-top:1.5rem;font-size:1.5rem;font-weight:700;line-height:1.25}
.map{min-height:clamp(320px,50vh,520px);background:var(--raised);border:3px solid var(--line)}
.map iframe{display:block;width:100%;height:100%;min-height:inherit;border:0}

.contact{padding:clamp(5rem,12vh,9rem) var(--gutter) clamp(3rem,8vh,5rem)}
.contact{position:relative;overflow:hidden}
.road{position:relative;height:70px;margin:clamp(2.5rem,6vh,4rem) calc(var(--gutter) * -1) 0;border-top:3px solid rgba(247,248,250,.35);background:linear-gradient(90deg,var(--paper) 50%,transparent 0) 0 50%/60px 4px repeat-x}
.road-car{position:absolute;left:0;bottom:12px;width:120px;height:49px;color:var(--sign)}
.road-pin{position:absolute;right:var(--gutter);bottom:14px;width:40px;height:40px;color:var(--paper)}
.phone{display:block;font-family:var(--display);font-weight:900;font-size:min(19vw,15rem);line-height:1;color:var(--sign);text-decoration:none;margin:.25rem 0 1.5rem}
.phone:hover{color:var(--text)}
.foot{display:flex;flex-wrap:wrap;gap:.4rem 2rem;padding:1.75rem var(--gutter);border-top:6px solid var(--sign);color:var(--muted);font-size:1rem}
.foot strong{color:var(--text)}
.foot a{text-underline-offset:.2em}

.bar-fixed{display:none}

@media (max-width:1100px){
  .cards{grid-template-columns:1fr 1fr}
}
@media (max-width:900px){
  .hero-info{grid-template-columns:1fr}
  .promo{grid-template-columns:1fr}
  .promo-item+.promo-item{border-left:0;border-top:3px solid var(--ground)}
  .gas-grid,.visit,.e85,.bays-grid,.store-grid{grid-template-columns:1fr}
  .hero .actions{justify-content:flex-start}
  .e85-photo{max-width:460px}
  .photo{max-width:460px}
}
@media (max-width:719px){
  :root{--bar:calc(68px + env(safe-area-inset-bottom))}
  .hero{justify-content:flex-start;padding-top:3.75rem;min-height:0}
  .hero .actions{display:none}
  .stages{grid-template-columns:1fr 1fr;gap:.6rem 1rem}
  .bar-fixed{display:grid;grid-template-columns:1fr 1fr;gap:8px;position:fixed;inset:auto 0 0;z-index:50;background:var(--ground);padding:6px 8px calc(6px + env(safe-area-inset-bottom));height:var(--bar);border-top:2px solid var(--line)}
  .bar-fixed .btn{min-height:0;padding:.25rem}
  .cards{grid-template-columns:none;grid-auto-flow:column;grid-auto-columns:80%;overflow-x:auto;scroll-snap-type:x mandatory;margin:0 calc(var(--gutter) * -1);padding:10px var(--gutter) 1rem;scroll-padding-inline:var(--gutter);scrollbar-width:none}
  .card{scroll-snap-align:start}
  .sp-badge{left:0}
  .store-photos{padding-bottom:1rem}
}