
/* ============================================================
   MANKO MOBILE AUTO -- STYLE SHEET
   Optimized for Netscape Navigator 4.0 / MSIE 4 at 800x600
   Palette: the blue and yellow of the flag Rani supplied --
   flag blue #0057B7 / flag yellow #FFD700 on deep navy #00234D.
   Var names are inherited and no longer describe their hue: --gold is
   the yellow, --purple the blue, --hot the blue accent, --lime the
   yellow-on-dark accent. The graph-paper tile stays, grid lines in blue.
   ============================================================ */
:root{
  --gold:#FFD700; --gold2:#F0B400; --purple:#0057B7; --purple2:#00234D;
  --chrome:#C0C0C0; --cream:#FFFFCC; --link:#0000EE; --vlink:#274690;
  --hot:#0057B7; --navy:#00234D; --lime:#FFD700;
  --star:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='90' height='90'%3E%3Crect width='90' height='90' fill='%2300234D'/%3E%3Ccircle cx='8' cy='12' r='1' fill='%23fff'/%3E%3Ccircle cx='44' cy='7' r='1.4' fill='%23FFD700'/%3E%3Ccircle cx='71' cy='23' r='1' fill='%23fff'/%3E%3Ccircle cx='19' cy='38' r='1.2' fill='%23fff'/%3E%3Ccircle cx='58' cy='47' r='1' fill='%23A8CBF0'/%3E%3Ccircle cx='83' cy='61' r='1.3' fill='%23fff'/%3E%3Ccircle cx='31' cy='68' r='1' fill='%23FFD700'/%3E%3Ccircle cx='63' cy='80' r='1.1' fill='%23fff'/%3E%3Ccircle cx='6' cy='84' r='1' fill='%23A8CBF0'/%3E%3C/svg%3E");
  --wave:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24'%3E%3Crect width='24' height='24' fill='%23FFFFCC'/%3E%3Cpath d='M0 12h24M12 0v24' stroke='%239FB8DC' stroke-width='1'/%3E%3C/svg%3E");
}
*{margin:0;padding:0;box-sizing:border-box}
body{
  font-family:'Times New Roman',Times,serif;
  font-size:15px;line-height:1.5;color:#000000;
  background-color:#00234D;background-image:var(--star);
  text-align:center;
}
img{border:0}
a{color:var(--link);text-decoration:underline}
a:visited{color:var(--vlink)}
a:hover{color:var(--hot)}
a:active{color:var(--hot)}

/* the whole page lives in one centered 760px table, like God intended */
.wrap{width:100%;max-width:760px;margin:0 auto;text-align:left;padding:0 10px}

h1,h2,h3,h4{font-family:Arial,Helvetica,sans-serif;line-height:1.2}
.ic{width:16px;height:16px;vertical-align:middle}

a:focus-visible,button:focus-visible,summary:focus-visible{outline:3px solid var(--hot);outline-offset:2px}
@media(prefers-reduced-motion:reduce){
  .blink,.rule,.util .wrap{animation:none}
  .util,.util .wrap{white-space:normal}
  .util .wrap{display:block;text-align:center;padding:0 10px}
}

/* ---------- BLINK (yes, really) */
@keyframes blink{0%,49%{visibility:visible}50%,100%{visibility:hidden}}
.blink{animation:blink 1s steps(1) infinite}

/* ---------- rainbow divider, the 1999 <hr> */
.rule{height:8px;border:0;margin:16px 0;
  background:linear-gradient(90deg,#0057B7,#2E6DB4,#7FB2F0,#FFD700,#7FB2F0,#2E6DB4,#0057B7);
  background-size:200% 100%;animation:slide 4s linear infinite}
@keyframes slide{to{background-position:-200% 0}}

/* ---------- beveled Win95 buttons */
.btn{display:inline-block;font-family:Arial,Helvetica,sans-serif;font-weight:bold;
  font-size:13px;padding:5px 14px;text-decoration:none!important;cursor:pointer;
  background:var(--chrome);color:#000;border:3px outset #E8E8E8;border-radius:0}
.btn:active{border-style:inset}
.btn:hover{color:var(--hot)}
.btn-y{background:var(--gold);border-color:#FFE97A;color:#000}
.btn-r{background:var(--purple);border-color:#3E86D6;color:#FFD700}
.btn-r:hover{color:#FFFFFF}
.btn-dark{background:#000;border-color:#666;color:var(--gold)}
.btn-ghost{background:var(--chrome);color:#000;border:3px outset #E8E8E8}
.btn-lg{font-size:15px;padding:7px 18px}
.btn .ic{width:14px;height:14px;margin-right:4px}

/* ---------- top marquee bar */
.util{background:#000000;border-top:2px solid var(--gold);border-bottom:2px solid var(--gold);
  overflow:hidden;white-space:nowrap;padding:3px 0}
.util .wrap{width:auto;padding:0;display:inline-block;white-space:nowrap;
  animation:marq 22s linear infinite}
@keyframes marq{from{transform:translateX(100vw)}to{transform:translateX(-110%)}}
.util .badge{font-family:'Courier New',Courier,monospace;font-size:14px;font-weight:bold;
  color:var(--gold);letter-spacing:1px}
.util .badge:after{content:" \2605\2605\2605 "}
.util .ic{color:var(--gold);width:14px;height:14px}
.util a{color:var(--lime);font-weight:bold}

/* ---------- header: gray toolbar */
.hdr{background:#FFFFFF;border-bottom:4px ridge var(--gold);position:static}
.hdr .wrap{padding:8px 10px;text-align:center}
.brand{display:inline-block;text-decoration:none!important}
.brand img{height:96px;width:auto;display:block}
.ftlogo{display:inline-block;background:#FFFFFF;border:3px ridge var(--gold);
  padding:5px 10px;margin-bottom:10px}
.ftlogo img{height:78px;width:auto;display:block}
.nav{display:block;margin-top:8px;text-align:center;font-size:0}
.nav>a,.nav .nav-top{display:inline-block;font-family:Arial,Helvetica,sans-serif;
  font-weight:bold;font-size:12px;color:#00234D;background:#DFDFDF;
  border:2px outset #F0F0F0;padding:4px 9px;margin:2px;text-decoration:none!important}
.nav>a:hover,.nav .nav-top:hover{color:var(--hot);background:var(--gold)}
.nav .caret{width:10px;height:10px}
.nav-item{position:relative;display:inline-block}
.dropdown{position:absolute;top:100%;left:0;background:#DFDFDF;border:3px outset #F0F0F0;
  min-width:250px;padding:3px;display:none;z-index:70;text-align:left}
.nav-item:hover .dropdown,.nav-item:focus-within .dropdown{display:block}
.dropdown a{display:block;padding:3px 8px;color:#00234D;font-family:Arial,sans-serif;
  font-size:12px;font-weight:bold;text-decoration:none!important}
.dropdown a:hover{background:#00234D;color:#FFFFFF}
.dropdown .drop-all{color:var(--hot);border-bottom:2px groove #B0B0B0;margin-bottom:3px}
.hdr .btn-call{display:inline-block;margin-top:8px;background:var(--gold);
  border:3px outset #FFE97A;color:#000;font-size:15px;font-family:'Courier New',monospace}
.burger{display:none;background:#DFDFDF;border:3px outset #F0F0F0;color:#00234D;
  cursor:pointer;padding:4px 8px;margin-top:8px}
.burger .ic{width:22px;height:22px}

/* mobile drawer, styled like a Win95 dialog */
.mnav{display:none;position:fixed;inset:0;background:var(--chrome);z-index:100;
  padding:14px;overflow:auto;text-align:left}
.mnav.open{display:block}
.mnav .x{display:block;margin:0 0 10px auto;background:#DFDFDF;border:3px outset #F0F0F0;
  color:#00234D;cursor:pointer;padding:3px 7px}
.mnav .x .ic{width:20px;height:20px}
.mnav a{display:block;font-family:Arial,Helvetica,sans-serif;font-weight:bold;font-size:14px;
  color:#00234D;background:#DFDFDF;border:2px outset #F0F0F0;padding:8px 10px;
  margin-bottom:5px;text-decoration:none!important}
.mnav a:hover{background:var(--gold);color:var(--hot)}
.mnav .mdrop summary{font-family:Arial,Helvetica,sans-serif;font-weight:bold;font-size:14px;
  color:#00234D;background:#DFDFDF;border:2px outset #F0F0F0;padding:8px 10px;
  margin-bottom:5px;cursor:pointer;list-style:none}
.mnav .mdrop summary::-webkit-details-marker{display:none}
.mnav .mdrop summary:before{content:"[+] ";font-family:'Courier New',monospace;color:var(--hot)}
.mnav .mdrop[open] summary:before{content:"[-] "}
.mnav .msub{padding-left:12px}
.mnav .msub a{font-size:13px}
.mnav .btn-call{display:block;text-align:center;margin-top:12px}

/* sticky call bar, every width: the phone never scrolls away */
.mcall{display:block;position:fixed;left:0;right:0;bottom:0;z-index:80}
body{padding-bottom:54px}
.mcall a{display:flex;align-items:center;justify-content:center;gap:8px;
  background:var(--gold);border-top:3px ridge #FFE97A;color:#000;
  font-family:Arial,Helvetica,sans-serif;font-weight:bold;font-size:15px;padding:11px;
  text-transform:uppercase;text-decoration:none!important}

/* ---------- hero: starfield + WordArt */
.hero{background-image:var(--star);background-color:var(--purple2);
  border-bottom:4px ridge var(--gold);color:#FFFFFF}
.hero .wrap{padding:26px 10px 24px;text-align:center}
.hero-inner{max-width:none;margin:0}
.hero .kicker{font-family:'Comic Sans MS','Comic Sans',cursive;font-size:14px;
  font-weight:bold;color:var(--lime);margin-bottom:10px;display:block}
.hero .kicker .ic{width:16px;height:16px}
.hero h1{font-family:Impact,'Arial Black',Charcoal,sans-serif;font-weight:normal;
  font-size:40px;line-height:1.05;color:var(--gold);text-transform:uppercase;
  letter-spacing:1px;
  text-shadow:3px 3px 0 #000000,-2px -2px 0 #00336E,2px -2px 0 #00336E,-2px 2px 0 #00336E,5px 5px 8px rgba(0,0,0,.9)}
.hero h1 .hl{color:#FFFFFF}
.hero .sub{margin:14px auto 8px;font-size:16px;color:#FFFFCC;max-width:620px;
  font-family:'Times New Roman',serif}
.hero .checks{list-style:none;margin:16px auto;max-width:620px;text-align:left;
  display:grid;grid-template-columns:1fr 1fr;gap:4px 20px}
.hero .checks li{font-family:Arial,sans-serif;font-size:13px;font-weight:bold;color:#FFFFFF}
.hero .checks li:before{content:"\27A4 ";color:var(--lime);font-weight:bold}
.hero .checks .ic{display:none}
.hero .ctas{margin-top:14px}
.hero .ctas .btn{margin:0 5px}

/* ---------- badge strip */
.strip{background:var(--gold);border-top:3px ridge #FFE97A;border-bottom:3px ridge #B8930B}
.strip .wrap{padding:8px 10px;text-align:center}
.strip .b{display:inline-block;font-family:'Comic Sans MS','Comic Sans',cursive;
  font-size:12px;font-weight:bold;color:#000;margin:2px 8px}
.strip .b:before{content:"\2605 "}
.strip .ic{width:16px;height:16px}

/* ---------- sections: cream panels with ridge borders */
.sec{background:#FFFFFF;padding:18px 0;border-bottom:2px groove #C0C0C0}
.sec .wrap{padding:0 14px}
.sec.alt{background-image:var(--wave);background-color:var(--cream)}
.sec.dark{background-image:var(--star);background-color:var(--purple2);color:#FFFFFF}
.sec.dark p,.sec.dark li{color:#FFFFCC}
.eyebrow{display:block;font-family:'Comic Sans MS','Comic Sans',cursive;font-size:12px;
  font-weight:bold;color:var(--hot);margin-bottom:4px}
.eyebrow:before{content:"\25BA "}
.sec.dark .eyebrow,.on-dark{color:var(--lime)}
.sec-head{max-width:none;margin-bottom:14px;text-align:center}
.sec-head h2{font-family:Arial,Helvetica,sans-serif;font-weight:bold;font-size:26px;
  color:var(--navy);margin:6px 0 8px;text-transform:uppercase;
  text-shadow:1px 1px 0 #FFFFFF,2px 2px 0 #C0C0C0}
.sec.dark .sec-head h2{color:var(--gold);text-shadow:2px 2px 0 #000000}
.sec-head p{font-size:15px;color:#000000}
.sec.dark .sec-head p{color:#FFFFCC}

/* fake tables */
.grid{display:grid;gap:10px}
.g2{grid-template-columns:1fr 1fr}
.g3{grid-template-columns:1fr 1fr 1fr}
.g4{grid-template-columns:1fr 1fr}

/* feature + service boxes: beveled gray */
.feat,.card,.step,.review{background:var(--chrome);border:3px outset #E8E8E8;
  border-radius:0;padding:10px;color:#000;display:block}
.feat{display:flex;gap:8px;align-items:flex-start}
.sec.dark .feat,.sec.dark .card,.sec.dark .review{background:#083C74;border:3px outset #2E6DB4;color:#FFFFCC}
.feat h3,.card h3,.step h3{font-family:Arial,Helvetica,sans-serif;font-size:14px;
  font-weight:bold;color:var(--navy);text-transform:uppercase;margin-bottom:5px}
.sec.dark .feat h3,.sec.dark .card h3{color:var(--gold)}
.feat p,.card p,.step p{font-size:14px;color:#000}
.sec.dark .feat p,.sec.dark .card p{color:#FFFFCC}
.ibox{width:34px;height:34px;background:var(--purple);color:var(--gold);
  border:2px outset #3E86D6;display:flex;align-items:center;justify-content:center;flex:none}
.ibox .ic{width:20px;height:20px}
.card{text-decoration:none!important}
.card .ibox{margin-bottom:6px}
.card:hover{border-style:inset;background:#D8D8D8}
.card .more{display:inline-block;margin-top:6px;font-family:Arial,sans-serif;
  font-size:12px;font-weight:bold;color:#00336E;text-decoration:underline}
.card .more:before{content:"\00BB "}
.card .more .ic{display:none}

/* steps */
.steps{display:grid;grid-template-columns:1fr 1fr;gap:10px;counter-reset:step}
.step{counter-increment:step}
.step:before{content:"STEP " counter(step);font-family:'Courier New',monospace;
  font-weight:bold;font-size:15px;color:var(--hot);display:block;margin-bottom:4px}

/* split feature */
.split{display:grid;grid-template-columns:1fr 1fr;gap:16px;align-items:flex-start}
.split .checks{list-style:none;margin:10px 0}
.split .checks li{font-size:14px;font-weight:bold;margin-bottom:4px}
.split .checks li:before{content:"\2714 ";color:#0057B7}
.split .checks .ic{display:none}
.panel{background:var(--purple);color:#FFFFFF;border:4px ridge var(--gold);padding:14px}
.panel .big{font-family:Impact,'Arial Black',sans-serif;font-size:34px;color:var(--gold);
  line-height:1;text-shadow:2px 2px 0 #000}
.panel p{color:#FFFFCC}

/* banners */
.banners{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.banner{border:4px ridge var(--gold);padding:12px;color:#FFFFFF;background:var(--purple)}
.banner.red{background:#003C7D;border-color:#7FB2F0}
.banner .tag{display:block;font-family:'Comic Sans MS',cursive;font-size:11px;
  font-weight:bold;color:var(--lime);margin-bottom:5px}
.banner h3{font-family:Arial,sans-serif;font-size:18px;color:var(--gold);margin-bottom:6px}
.banner p{color:#FFFFCC;font-size:14px;margin-bottom:8px}

/* coupons: classic dashed clip-out */
.coupons{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.coupon{background:var(--cream);border:3px dashed var(--hot);text-align:center;
  display:flex;flex-direction:column}
.coupon .top{background:var(--hot);color:#FFFF00;font-family:'Courier New',monospace;
  font-weight:bold;font-size:12px;padding:4px;letter-spacing:1px}
.coupon .amt{font-family:Impact,'Arial Black',sans-serif;font-size:36px;color:#0057B7;
  line-height:1;padding:10px 8px 2px;text-shadow:2px 2px 0 #C0C0C0}
.coupon .what{font-family:'Comic Sans MS',cursive;font-weight:bold;font-size:14px;padding:2px 10px 6px}
.coupon .fine{font-size:11px;padding:0 10px 8px;margin-top:auto;color:#333}
.coupon .cta{display:block;background:var(--chrome);border-top:3px outset #E8E8E8;
  color:var(--navy);font-family:Arial,sans-serif;font-weight:bold;font-size:12px;
  padding:6px;text-decoration:none!important}
.coupon .cta:hover{background:var(--gold);color:var(--hot)}

/* reviews */
.stars{display:block;margin-bottom:6px}
.stars .ic{width:16px;height:16px;fill:var(--gold);stroke:#B8930B;display:inline-block}
.review p{font-size:14px;font-style:italic}
.review .who{margin-top:8px;font-family:Arial,sans-serif;font-weight:bold;font-size:13px;color:var(--navy)}
.sec.dark .review .who{color:var(--gold)}
.review .who span{display:block;font-weight:normal;font-size:11px;color:#333}
.sec.dark .review .who span{color:#A8CBF0}
.scorebox{background:#000000;border:4px ridge var(--gold);padding:12px;margin-bottom:14px;
  text-align:center;color:#FFFFFF}
.scorebox .n{font-family:'Courier New',monospace;font-weight:bold;font-size:44px;
  color:var(--lime);line-height:1;display:block}
.scorebox p{color:#FFFFCC;font-size:13px}

/* areas */
.areas{text-align:center}
.area-chip{display:inline-block;background:#DFDFDF;border:2px outset #F0F0F0;
  padding:3px 8px;margin:3px;font-family:Arial,sans-serif;font-size:12px;font-weight:bold;
  color:var(--navy);text-decoration:none!important}
.area-chip:hover{background:var(--gold);color:var(--hot);border-style:inset}
.area-chip .ic{width:11px;height:11px;color:var(--hot)}
.area-chip .st{color:#555;font-weight:normal}

/* photo gallery: thumbnails in beveled frames */
.shots{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.shot{background:var(--chrome);border:4px ridge #E8E8E8;padding:5px}
.shot a{display:block;border:2px inset #909090;aspect-ratio:1/1}
.shot img{width:100%;height:100%;object-fit:cover;display:block}
.shot figcaption{padding:5px 2px 0;font-size:12px;color:#000;font-family:Arial,sans-serif}
.sec.dark .shot figcaption{color:#000}

/* the "java applet" map */
#svcmap{height:400px;border:4px inset #909090;z-index:1}
.svcpin{display:block;width:12px;height:12px;background:var(--gold);border:2px solid #000}
.svcpin.home{width:18px;height:18px;background:var(--hot);border-color:#FFFF00}
.maplegend{margin-top:8px;font-family:Arial,sans-serif;font-size:12px;font-weight:bold;text-align:center}
.maplegend span{display:inline-block;margin:0 12px}
.pin-demo{display:inline-block;width:11px;height:11px;background:var(--gold);border:2px solid #000}
.pin-demo.home{background:var(--hot)}
#svcmap .leaflet-popup-content{font-family:Arial,sans-serif;font-size:12px}
#svcmap .leaflet-popup-content b{color:var(--hot)}

/* faq */
.faq{max-width:none}
.faq details{background:var(--cream);border:2px groove #C0C0C0;margin-bottom:6px}
.faq summary{cursor:pointer;padding:6px 10px;font-family:Arial,sans-serif;font-weight:bold;
  font-size:14px;color:var(--navy);list-style:none;background:#DFDFDF;border-bottom:2px groove #C0C0C0}
.faq summary::-webkit-details-marker{display:none}
.faq summary:before{content:"[+] ";font-family:'Courier New',monospace;color:var(--hot)}
.faq details[open] summary:before{content:"[-] "}
.faq details p{padding:8px 10px;font-size:14px}

/* cta band */
.ctaband{background:var(--gold);border:5px ridge #FFE97A;padding:14px;text-align:center;color:#000}
.ctaband h2{font-family:Impact,'Arial Black',sans-serif;font-weight:normal;font-size:26px;
  color:var(--hot);text-transform:uppercase;text-shadow:2px 2px 0 #FFFFFF}
.ctaband p{margin-top:6px;font-size:14px;font-weight:bold}
.ctaband .num{display:block;margin:8px 0;font-family:'Courier New',monospace;
  font-weight:bold;font-size:26px;color:var(--navy)}

/* inner page headers */
.pagehero{background-image:var(--star);background-color:var(--purple2);
  border-bottom:4px ridge var(--gold);color:#FFFFFF;padding:18px 0;text-align:center}
.pagehero .eyebrow{color:var(--lime)}
.pagehero h1{font-family:Impact,'Arial Black',sans-serif;font-weight:normal;font-size:32px;
  color:var(--gold);text-transform:uppercase;margin:4px 0 8px;
  text-shadow:3px 3px 0 #000000,-1px -1px 0 #00336E}
.pagehero p{color:#FFFFCC;font-size:15px;max-width:620px;margin:0 auto}
.crumb{font-family:Arial,sans-serif;font-size:11px;color:#333;padding:6px 0 0}
.crumb a{color:var(--link)}
.pagehero .crumb,.pagehero .crumb a{color:#A8CBF0}

/* prose */
.prose h2{font-family:Arial,Helvetica,sans-serif;font-weight:bold;color:var(--navy);
  font-size:20px;margin:16px 0 8px;border-bottom:2px groove #C0C0C0;text-transform:uppercase}
.prose h3{font-family:Arial,sans-serif;font-size:16px;font-weight:bold;color:var(--hot);margin:12px 0 6px}
.prose p{margin-bottom:10px;color:#000000;font-size:15px}
.prose ul{margin:0 0 12px 24px;color:#000}
.prose li{margin-bottom:4px}
.prose li::marker{color:var(--hot)}
.aside{position:static;display:block}
.aside .box{background:var(--chrome);border:3px outset #E8E8E8;padding:9px;margin-bottom:10px}
.aside .box.dark{background:var(--purple);border:3px outset #3E86D6;color:#FFFFCC}
.aside h3{font-family:Arial,sans-serif;font-size:13px;font-weight:bold;color:var(--navy);
  text-transform:uppercase;margin-bottom:6px;border-bottom:2px groove #909090}
.aside .box.dark h3{color:var(--gold);border-bottom-color:#3E86D6}
.aside a.sl{display:block;padding:2px 0;font-size:13px;color:var(--link);
  font-family:Arial,sans-serif;font-weight:bold}
.aside a.sl:before{content:"\00BB "}
.aside .box.dark p{color:#FFFFCC;font-size:13px}
.aside .callnum{display:block;font-family:'Courier New',monospace;font-weight:bold;
  font-size:16px;color:var(--gold);margin:4px 0 6px;letter-spacing:0}
.aside .box.dark .btn{display:block;width:100%;font-size:11px;padding:5px 4px;text-align:center}

/* symptom table */
.symp{border:3px outset #E8E8E8;margin:12px 0;background:var(--chrome)}
.symp .r{display:grid;grid-template-columns:200px 1fr;border-bottom:2px groove #909090}
.symp .r:last-child{border-bottom:0}
.symp .k{background:#DFDFDF;padding:6px 8px;font-family:Arial,sans-serif;font-weight:bold;font-size:13px}
.symp .k .ic{width:14px;height:14px;color:var(--hot)}
.symp .v{padding:6px 8px;font-size:13px;background:#FFFFFF}

/* forms */
.form{display:block}
.form label{display:block;font-family:Arial,sans-serif;font-weight:bold;font-size:13px;
  color:var(--navy);margin-bottom:8px;text-transform:uppercase}
.form input,.form select,.form textarea{width:100%;padding:3px 4px;border:2px inset #909090;
  font-family:'Courier New',monospace;font-size:14px;background:#FFFFFF;margin-top:3px}
.form input:focus,.form select:focus,.form textarea:focus{background:var(--cream)}
.hoursrow{display:flex;justify-content:space-between;border-bottom:1px dotted #909090;
  padding:3px 0;font-size:14px}
.hoursrow b{font-family:Arial,sans-serif;color:var(--navy)}

/* ---------- 1999 furniture ---------- */
.oldbar{background:#000000;border-top:3px ridge var(--gold);border-bottom:3px ridge var(--gold);
  padding:12px 0;text-align:center;color:#FFFFFF;font-family:Arial,sans-serif;font-size:12px}
.counter{display:inline-block;background:#000;border:3px inset #666;padding:3px 6px;
  font-family:'Courier New',Courier,monospace;font-size:20px;font-weight:bold;
  color:var(--lime);letter-spacing:4px;margin:0 6px;vertical-align:middle}
.badge99{display:inline-block;background:var(--chrome);border:2px outset #E8E8E8;
  padding:3px 7px;margin:4px;font-family:Arial,sans-serif;font-size:10px;
  font-weight:bold;color:#00234D;text-decoration:none!important;line-height:1.3}
.badge99 b{color:#00336E}
.ft a.badge99{display:inline-block}
.hazard{height:14px;background:repeating-linear-gradient(45deg,#000 0 12px,#FFD700 12px 24px)}

/* ---------- footer ---------- */
.ft{background:var(--chrome);border-top:4px ridge #909090;padding:16px 0 10px;
  font-size:12px;color:#000;font-family:Arial,Helvetica,sans-serif;text-align:center}
.ft .cols{display:grid;grid-template-columns:1fr 1fr 1fr 1fr;gap:12px;
  margin-bottom:12px;text-align:left}
.ft h4{font-family:Arial,sans-serif;font-weight:bold;font-size:12px;color:var(--navy);
  text-transform:uppercase;margin-bottom:6px;border-bottom:2px groove #909090}
.ft a{display:block;color:var(--link);padding:1px 0;text-decoration:underline;font-size:12px}
.ft a:visited{color:var(--vlink)}
.ft a:hover{color:var(--hot)}
.ft p{margin-bottom:6px;font-size:12px}
.ft .brand img{height:60px}
.ft .ftphone a{display:inline;font-family:'Courier New',monospace;font-weight:bold;
  font-size:18px;color:#00336E}
.ft .allcities{border-top:2px groove #909090;padding-top:8px;font-size:11px;line-height:1.7}
.ft .allcities a{display:inline}
.ft .legal{border-top:2px groove #909090;margin-top:10px;padding-top:8px;font-size:11px}
.ft .legal span{display:block;margin-bottom:3px}
.ft .legal a{display:inline}

/* ---------- split / panel typography ---------- */
.bighead{font-family:Arial,Helvetica,sans-serif;font-weight:bold;font-size:22px;
  color:var(--navy);text-transform:uppercase;margin:6px 0 10px;line-height:1.15;
  border-bottom:2px groove #C0C0C0}
.sec.dark .bighead{color:var(--gold);text-shadow:2px 2px 0 #000000;border-bottom-color:#2E6DB4}
.split p{font-size:14px;margin-bottom:10px}
.panel h3{font-family:Arial,Helvetica,sans-serif;font-size:15px;font-weight:bold;
  color:var(--gold);text-transform:uppercase;margin:6px 0 10px}
.oldlist{margin-left:22px;font-size:14px;color:#FFFFCC}
.oldlist li{margin-bottom:6px}
.oldlist li::marker{color:var(--gold);font-weight:bold}

/* legacy aliases: a few inline styles in the page templates still ask for
   the old Express Lube variable names. keep them resolving. */
:root{
  --heebo:Arial,Helvetica,sans-serif; --cairo:Arial,Helvetica,sans-serif;
  --yellow:#FFD700; --ink:#000000; --red:#0057B7; --mute:#333333;
  --ondark:#FFFFCC; --line:#909090; --alt:#FFFFCC; --paper:#FFFFFF;
}

/* narrow right-hand sidebar, the way every 1999 content page did it */
.split.sidebar{grid-template-columns:1fr 200px;gap:18px;align-items:start}
.split.sidebar .prose p,.split.sidebar .prose li{font-size:14.5px}
.symp .r{grid-template-columns:150px 1fr}

/* ---------- bite / snack / meal ---------- */
.bite{background:var(--cream);border:4px ridge var(--gold);padding:9px 12px;margin:0 0 12px;
  font-size:15px;color:#000;line-height:1.5}
.bite:before{content:"\27A4  QUICK ANSWER";display:block;font-family:'Courier New',Courier,monospace;
  font-size:11px;font-weight:bold;color:var(--navy);letter-spacing:1px;margin-bottom:4px}
.bite b{color:var(--hot)}
.snackbox{background:var(--chrome);border:3px outset #E8E8E8;padding:9px 12px;margin:0 0 16px}
.snackbox h3{font-family:Arial,Helvetica,sans-serif;font-size:12px;font-weight:bold;color:var(--navy);
  text-transform:uppercase;letter-spacing:1px;margin-bottom:6px;border-bottom:2px groove #909090;
  padding-bottom:3px}
.snackbox ul{margin:0 0 0 20px;font-size:14px}
.snackbox li{margin-bottom:4px}
.snackbox li::marker{color:var(--hot)}

/* ---------- owner credentials ---------- */
.creds{background:var(--cream);border:3px ridge var(--gold);padding:10px 12px;margin:12px 0}
.creds h3{font-family:'Courier New',Courier,monospace;font-size:13px;font-weight:bold;color:var(--hot);
  text-transform:uppercase;letter-spacing:1px;margin-bottom:6px;text-align:center}
.creds ul{margin:0 0 0 20px;font-size:14px}
.creds li{margin-bottom:4px}
.creds li::marker{color:var(--navy)}
.ownwords{background:var(--chrome);border-left:8px ridge var(--gold);padding:10px 14px;margin:14px 0;
  font-style:italic;font-size:15px;color:#000}
.ownwords cite{display:block;margin-top:6px;font-style:normal;font-family:Arial,Helvetica,sans-serif;
  font-size:12px;font-weight:bold;color:var(--navy)}

/* ============================================================
   1999 look, 2026 screens. the layout still behaves like a
   fixed-width table -- it just picks a narrower table.
   ============================================================ */
@media(max-width:820px){
  .nav{display:none}
  .burger{display:inline-block}
  .hdr .btn-call{font-size:14px}
  .g3,.g4,.steps,.banners,.coupons,.shots{grid-template-columns:1fr 1fr}
  .split,.split.sidebar{grid-template-columns:1fr;gap:14px}
  .aside{margin-top:14px}
  .aside .box{padding:10px}
  .aside .callnum{font-size:19px}
  .ft .cols{grid-template-columns:1fr 1fr}
  .hero h1{font-size:30px}
  .pagehero h1{font-size:26px}
  .sec-head h2{font-size:22px}
  .symp .r{grid-template-columns:1fr}
  .symp .k{padding-bottom:2px}
  .symp .v{padding-top:2px}
  .scorebox .n{font-size:38px}
}
@media(max-width:560px){
  body{font-size:15px}
  .g2,.g3,.g4,.steps,.banners,.coupons,.shots{grid-template-columns:1fr}
  .hero .checks{grid-template-columns:1fr}
  .hero h1{font-size:25px;letter-spacing:0}
  .hero .wrap{padding:18px 10px}
  .pagehero h1{font-size:22px}
  .ctaband h2{font-size:20px}
  .ctaband .num{font-size:21px}
  .panel .big{font-size:28px}
  .coupon .amt{font-size:32px}
  .ft .cols{grid-template-columns:1fr}
  .brand img{height:70px}
  .util .badge{font-size:12px}
  .counter{font-size:16px;letter-spacing:2px}
  .sec{padding:14px 0}
  .sec .wrap{padding:0 10px}
}

