/* Tire Super Center of Apopka: asphalt + safety yellow, lane-stripe system. */
:root{--asphalt:#17181a;--asphalt-2:#222428;--yellow:#ffd400;--concrete:#e9e6df;--paper:#f7f5f0;--ink:#17181a;--mute:#5a5d62}
body{font-family:Rubik,system-ui,sans-serif;font-size:1.0625rem;line-height:1.6;background:var(--paper);color:var(--ink)}
h1,h2,h3{font-family:Anton,Impact,sans-serif;font-weight:400;line-height:1.02;letter-spacing:.01em;margin:0 0 .4em}
h2{font-size:clamp(2.1rem,6vw,3.6rem)}
h3{font-size:1.5rem}
p{margin:0 0 1em}
a{text-decoration-thickness:2px;text-underline-offset:3px}

/* top line */
.topline{background:var(--yellow);color:var(--asphalt);display:flex;flex-wrap:wrap;justify-content:space-between;gap:4px 16px;padding:8px clamp(16px,4vw,40px);font-size:.85rem;font-weight:500}
.topline p{margin:0}
.topline a{font-weight:700}

/* masthead */
.masthead{position:sticky;top:0;z-index:50;background:var(--asphalt);color:#fff;display:flex;align-items:center;justify-content:space-between;gap:16px;padding:12px clamp(16px,4vw,40px);border-bottom:6px solid var(--yellow)}
.wordmark{text-decoration:none;display:flex;flex-direction:column;line-height:1}
.wm-big{font-family:Anton,Impact,sans-serif;font-size:1.5rem;letter-spacing:.02em}
.wm-small{font-size:.8rem;color:var(--yellow);font-weight:700;margin-top:3px}
.navlinks{display:none;list-style:none;margin:0;padding:0;gap:28px}
.navlinks a{text-decoration:none;font-weight:500;padding:6px 0;border-bottom:3px solid transparent}
.navlinks a:hover{border-color:var(--yellow)}
.nav-toggle{background:none;border:2px solid var(--yellow);width:46px;height:42px;display:grid;place-content:center;gap:6px;cursor:pointer}
.nav-toggle .bar{display:block;width:22px;height:3px;background:var(--yellow)}
.mobile-menu{position:absolute;top:100%;left:0;right:0;background:var(--asphalt);border-bottom:6px solid var(--yellow);max-height:calc(100dvh - 100%);overflow:auto}
.mobile-menu ul{list-style:none;margin:0;padding:8px clamp(16px,4vw,40px) 16px}
.mobile-menu a{display:block;padding:12px 0;text-decoration:none;font-size:1.15rem;border-bottom:1px dashed #3a3d42}
@media (min-width:900px){.navlinks{display:flex}.nav-toggle{display:none}.mobile-menu{display:none!important}}

/* buttons: square, yellow block with dark bottom edge */
.btn-yellow,.btn-line{display:inline-block;font-weight:700;text-decoration:none;padding:14px 22px;border:0;cursor:pointer;font-size:1rem}
.btn-yellow{background:var(--yellow);color:var(--asphalt);box-shadow:inset 0 -5px 0 rgba(0,0,0,.25)}
.btn-yellow:hover{filter:brightness(1.05)}
.btn-line{color:#fff;border-bottom:3px solid var(--yellow);padding-left:4px;padding-right:4px}

/* hero */
.hero{background:var(--asphalt);color:#fff;display:grid;gap:32px;padding:48px clamp(16px,4vw,40px) 56px;overflow:hidden;position:relative}
.hero::after{content:"";position:absolute;left:0;right:0;bottom:22px;height:6px;background:repeating-linear-gradient(90deg,var(--yellow) 0 48px,transparent 48px 84px);opacity:.9}
.hero h1{font-size:clamp(2.6rem,9vw,5.4rem);max-width:12ch}
.hero h1 span{color:var(--yellow);display:block}
.lead{font-size:1.15rem;max-width:44ch;color:#dcdcdc}
.hero-actions{display:flex;flex-wrap:wrap;gap:18px 24px;align-items:center;margin-top:8px}
.sidewall{max-width:340px;width:80%;justify-self:center}
.sidewall svg{animation:roll 40s linear infinite}
.sw-text{font-family:Rubik,sans-serif;font-weight:700;font-size:15px;letter-spacing:3px;fill:#c9c9c9}
@keyframes roll{to{transform:rotate(360deg)}}
@media (min-width:900px){.hero{grid-template-columns:minmax(0,1.25fr) minmax(0,1fr);align-items:center;padding-top:72px;padding-bottom:96px}.sidewall{width:100%;max-width:420px}}

/* today strip */
.today{background:var(--concrete);padding:18px clamp(16px,4vw,40px);display:flex;flex-wrap:wrap;gap:4px 24px;align-items:baseline;border-bottom:2px solid var(--asphalt)}
.today p{margin:0}
.today-status{font-weight:700;font-size:1.1rem}
.today-hours{color:var(--mute);font-size:.95rem}

/* clock board */
.clock{padding:64px clamp(16px,4vw,40px);max-width:1200px;margin:0 auto}
.clock-intro{max-width:52ch;color:var(--mute)}
.times{list-style:none;margin:28px 0 12px;padding:0;display:grid;gap:0}
.times li{display:grid;grid-template-columns:minmax(0,9rem) minmax(0,1fr);gap:16px;align-items:center;padding:18px 0;border-top:3px solid var(--asphalt)}
.times li:last-child{border-bottom:3px solid var(--asphalt)}
.times .t{font-family:Anton,Impact,sans-serif;font-size:clamp(2.6rem,9vw,4.4rem);line-height:1;font-variant-numeric:tabular-nums}
.times small{font-family:Rubik,sans-serif;font-size:.9rem;font-weight:700;margin-left:4px;background:var(--yellow);padding:2px 6px;vertical-align:middle}
.times .what{font-size:1.1rem}
.src{font-size:.9rem;color:var(--mute)}
@media (min-width:900px){.times{grid-template-columns:repeat(3,minmax(0,1fr));gap:0 32px}.times li{grid-template-columns:1fr;border-bottom:3px solid var(--asphalt)}}

/* photo band */
.photo-band{position:relative;background:#333;height:clamp(200px,38vw,480px);overflow:hidden}
.photo-band img{width:100%;height:100%;object-fit:cover}
.photo-note{display:inline-block;background:#fff3b0;color:#4a3a00;font:500 .78rem/1.3 Rubik,sans-serif;padding:3px 8px}
.photo-band .photo-note{position:absolute;right:12px;bottom:12px}

/* pull in */
.pull-in{background:var(--asphalt);color:#fff;padding:64px clamp(16px,4vw,40px)}
.pull-head{max-width:1200px;margin:0 auto 24px}
.pull-head p{color:#cfcfcf;max-width:50ch}
.lanes{list-style:none;margin:0 auto;padding:0;max-width:1200px;display:grid;grid-template-columns:minmax(0,1fr);gap:0}
.lanes li{padding:20px 0 20px 22px;border-left:6px solid var(--yellow);border-bottom:1px dashed #44474c}
.lanes h3{color:var(--yellow);margin-bottom:.2em}
.lanes p{margin:0;color:#e2e2e2}
@media (min-width:768px){.lanes{grid-template-columns:repeat(2,minmax(0,1fr));column-gap:40px}}
@media (min-width:1100px){.lanes{grid-template-columns:repeat(3,minmax(0,1fr))}}

/* nas */
.nas{display:grid;gap:28px;padding:72px clamp(16px,4vw,40px);max-width:1200px;margin:0 auto}
.nas-photo{margin:0;position:relative;background:#c9c6bf}
.nas-photo img{width:100%;aspect-ratio:4/3;object-fit:cover}
.nas-photo .photo-note{position:absolute;left:10px;bottom:10px}
.said{list-style:none;padding:0;margin:0 0 16px}
.said li{padding:10px 0 10px 28px;position:relative;border-bottom:1px solid #d6d2c9}
.said li::before{content:"";position:absolute;left:0;top:18px;width:14px;height:6px;background:var(--yellow);box-shadow:0 0 0 1px var(--asphalt)}
@media (min-width:900px){.nas{grid-template-columns:minmax(0,5fr) minmax(0,6fr);align-items:center;gap:56px}}

/* find */
.find{display:grid;background:var(--concrete)}
.find-card{padding:48px clamp(16px,4vw,40px)}
.find-card h2{font-size:clamp(2rem,6vw,3rem)}
.hours{border-collapse:collapse;margin:16px 0 8px;min-width:240px}
.hours th,.hours td{text-align:left;padding:8px 24px 8px 0;border-bottom:2px solid var(--asphalt)}
.small{font-size:.9rem;color:var(--mute)}
.map{min-height:320px;background:#cfcac0}
.map iframe{width:100%;height:100%;min-height:320px;border:0}
@media (min-width:900px){.find{grid-template-columns:minmax(0,1fr) minmax(0,1.6fr)}.map iframe{min-height:460px}}

/* ask */
.ask{display:grid;gap:24px;padding:64px clamp(16px,4vw,40px);max-width:1000px;margin:0 auto}
.demo-chip{display:inline-block;background:#fff3b0;color:#4a3a00;font-size:.8rem;font-weight:700;padding:3px 8px}
.ask-form .field{margin-bottom:14px}
.ask-form label{display:block;font-weight:700;margin-bottom:4px}
.ask-form input{width:100%;padding:12px;border:2px solid var(--asphalt);background:#fff;border-radius:0}
.ask-form input:focus{outline:3px solid var(--yellow);outline-offset:0}
.form-success{border-left:6px solid var(--yellow);padding:16px 20px;background:#fff}
@media (min-width:800px){.ask{grid-template-columns:minmax(0,1fr) minmax(0,1.2fr);align-items:start}}

/* footer */
.lane-foot{background:var(--asphalt);color:#fff;padding:0 0 28px}
.lane{height:10px;background:repeating-linear-gradient(90deg,var(--yellow) 0 60px,var(--asphalt) 60px 100px)}
.foot-row{padding:24px clamp(16px,4vw,40px) 0;display:flex;flex-wrap:wrap;gap:6px 28px;align-items:baseline}
.foot-row p{margin:0}
.foot-name{font-family:Anton,Impact,sans-serif;font-size:1.4rem;color:var(--yellow)}
.foot-small{color:#aaa;font-size:.85rem}