/* ============================================================
   LaundryLink Rentals — shared stylesheet
   Palette: laundry bluing + appliance enamel, red rock used once.
   Type: Archivo (display) / Instrument Sans (body) / JetBrains Mono (data)
   ============================================================ */

:root{
  color-scheme:light;

  --enamel:#F4F7F9;--enamel-deep:#E4EBF0;--bluing:#12305C;--bluing-ink:#0A1E3D;
  --agitate:#2560C4;--slate:#2B333C;--slate-mid:#5C6873;--redrock:#933C23;
  --line:rgba(18,48,92,.16);
  --shadow:0 1px 2px rgba(10,30,61,.06),0 12px 32px -18px rgba(10,30,61,.28);
  --display:'Archivo',system-ui,sans-serif;
  --body:'Instrument Sans',system-ui,sans-serif;
  --data:'JetBrains Mono',ui-monospace,monospace;
  --wrap:1140px;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:var(--enamel);color:var(--slate);font-family:var(--body);
  font-size:17px;line-height:1.64;-webkit-font-smoothing:antialiased}
h1,h2,h3,h4{font-family:var(--display);color:var(--bluing-ink);margin:0;line-height:1.09;letter-spacing:-.022em}
h1{font-size:clamp(2.1rem,4.9vw,3.4rem);font-weight:800}
h2{font-size:clamp(1.55rem,3vw,2.2rem);font-weight:700}
h3{font-size:1.14rem;font-weight:700}
p{margin:0 0 1.1rem}
a{color:var(--agitate)}
img{max-width:100%}
.wrap{max-width:var(--wrap);margin:0 auto;padding:0 24px}
.narrow{max-width:820px;margin:0 auto;padding:0 24px}
.article{max-width:760px;margin:0 auto;padding:0 24px}

.eyebrow{font-family:var(--data);font-size:.7rem;font-weight:700;letter-spacing:.19em;
  text-transform:uppercase;color:var(--agitate);display:flex;align-items:center;gap:10px;margin-bottom:18px}
.eyebrow::before{content:"";width:22px;height:2px;background:var(--agitate);flex:none}

/* buttons */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:9px;font-family:var(--display);
  font-weight:700;font-size:1rem;letter-spacing:-.01em;padding:15px 26px;border-radius:4px;
  text-decoration:none;border:2px solid transparent;cursor:pointer;
  transition:transform .14s ease,background .14s ease}
.btn-primary{background:var(--bluing);color:#fff;box-shadow:var(--shadow)}
.btn-primary:hover{background:var(--bluing-ink);transform:translateY(-1px)}
.btn-ghost{background:transparent;color:var(--bluing);border-color:var(--line)}
.btn-ghost:hover{border-color:var(--bluing);background:rgba(18,48,92,.04)}
.btn-light{background:#fff;color:var(--bluing-ink)}
.btn-light:hover{background:var(--enamel-deep)}
.btn:focus-visible,a:focus-visible,input:focus-visible,button:focus-visible,
summary:focus-visible,select:focus-visible,textarea:focus-visible{outline:3px solid var(--agitate);outline-offset:3px}

/* header */
.masthead{position:sticky;top:0;z-index:60;background:rgba(244,247,249,.93);
  backdrop-filter:blur(12px);border-bottom:1px solid var(--line)}
.masthead .wrap{display:flex;align-items:center;justify-content:space-between;gap:20px;height:70px}
.brand{display:flex;align-items:center;gap:11px;text-decoration:none}
.brand-mark{width:34px;height:34px;border-radius:50%;flex:none;border:3px solid var(--bluing);
  position:relative;background:#fff}
.brand-mark::after{content:"";position:absolute;inset:6px;border-radius:50%;border:2px solid var(--agitate);
  border-top-color:transparent;border-right-color:transparent}
.brand-name{font-family:var(--display);font-weight:800;font-size:1.12rem;color:var(--bluing-ink);letter-spacing:-.03em}
.masthead nav{display:flex;align-items:center;gap:26px}
.masthead nav a:not(.btn){font-family:var(--display);font-weight:600;font-size:.94rem;color:var(--slate);text-decoration:none}
.masthead nav a:not(.btn):hover{color:var(--agitate)}
.masthead nav a.btn{text-decoration:none}
.masthead .btn{padding:11px 20px;font-size:.94rem}
@media(max-width:900px){.masthead nav a:not(.btn){display:none}}

/* sections */
section{padding:76px 0}
.band{background:#fff;border-block:1px solid var(--line)}
.band-deep{background:var(--bluing-ink);color:rgba(255,255,255,.82)}
.band-deep h2,.band-deep h3{color:#fff}
.band-deep .eyebrow{color:#8FB8F5}
.band-deep .eyebrow::before{background:#8FB8F5}
.sec-head{max-width:46rem;margin-bottom:44px}
.sec-head p{font-size:1.07rem;color:var(--slate-mid);margin-top:16px}
.band-deep .sec-head p{color:rgba(255,255,255,.72)}
.note{border-left:3px solid var(--agitate);padding:2px 0 2px 20px;margin:30px 0;font-size:.95rem;color:var(--slate-mid)}
.band-deep .note{border-color:#8FB8F5;color:rgba(255,255,255,.78)}
.lede,.hero-lede,.hero-sub{font-size:1.19rem;color:var(--slate-mid);margin-top:22px}
.hero-sub{max-width:33rem}
.meta{font-family:var(--data);font-size:.73rem;letter-spacing:.1em;text-transform:uppercase;
  color:var(--slate-mid);margin-top:26px;padding-top:20px;border-top:1px solid var(--line)}
.cta{text-align:center;max-width:40rem;margin:0 auto}
.cta .btn{margin-top:10px}
.scroller{overflow-x:auto;-webkit-overflow-scrolling:touch}

/* hero */
.hero{padding:72px 0 66px;position:relative;overflow:hidden}
.hero::before{content:"";position:absolute;top:-175px;right:-155px;width:600px;height:600px;border-radius:50%;
  background:radial-gradient(circle,rgba(46,111,217,.09),transparent 68%);pointer-events:none}
.hero-grid{display:grid;grid-template-columns:1.03fr .97fr;gap:56px;align-items:center;position:relative}
@media(max-width:940px){.hero-grid{grid-template-columns:1fr;gap:40px}.hero{padding:48px 0 56px}}
.accent{color:var(--agitate)}
.hero-cta{display:flex;flex-wrap:wrap;gap:13px;margin-top:30px}
.hero-trust{display:flex;flex-wrap:wrap;gap:22px;margin-top:30px;padding-top:24px;border-top:1px solid var(--line);
  font-family:var(--data);font-size:.76rem;letter-spacing:.07em;text-transform:uppercase;color:var(--slate-mid)}

/* control panel — homepage calculator */
.panel{background:#fff;border:1px solid var(--line);border-radius:8px;box-shadow:var(--shadow);overflow:hidden}
.panel-top{background:var(--bluing);color:#fff;padding:15px 24px;display:flex;align-items:center;justify-content:space-between;gap:12px}
.panel-title{font-family:var(--data);font-size:.72rem;font-weight:700;letter-spacing:.17em;text-transform:uppercase}
.panel-lamp{display:flex;align-items:center;gap:8px;font-family:var(--data);font-size:.66rem;letter-spacing:.13em;color:rgba(255,255,255,.72)}
.lamp{width:8px;height:8px;border-radius:50%;background:#5BE08E;box-shadow:0 0 9px #5BE08E;animation:pulse 2.6s ease-in-out infinite}
@keyframes pulse{0%,100%{opacity:1}50%{opacity:.35}}
.panel-body{padding:26px 24px 24px}
.dial-label{display:flex;align-items:baseline;justify-content:space-between;gap:12px;margin-bottom:12px}
.dial-label span:first-child{font-family:var(--display);font-weight:700;font-size:.97rem;color:var(--bluing-ink)}
.dial-value{font-family:var(--data);font-weight:700;font-size:1.5rem;color:var(--agitate)}
input[type=range]{-webkit-appearance:none;appearance:none;width:100%;height:34px;background:transparent;cursor:pointer;margin:0}
input[type=range]::-webkit-slider-runnable-track{height:8px;border-radius:4px;background:var(--enamel-deep);border:1px solid var(--line)}
input[type=range]::-moz-range-track{height:8px;border-radius:4px;background:var(--enamel-deep);border:1px solid var(--line)}
input[type=range]::-webkit-slider-thumb{-webkit-appearance:none;width:28px;height:28px;border-radius:50%;
  background:#fff;border:4px solid var(--bluing);margin-top:-11px;box-shadow:0 2px 7px rgba(10,30,61,.3)}
input[type=range]::-moz-range-thumb{width:22px;height:22px;border-radius:50%;background:#fff;
  border:4px solid var(--bluing);box-shadow:0 2px 7px rgba(10,30,61,.3)}
.tick-row{display:flex;justify-content:space-between;font-family:var(--data);font-size:.66rem;
  color:var(--slate-mid);letter-spacing:.06em;margin-top:-2px}
.readout{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-top:26px}
.cell{border:1px solid var(--line);border-radius:6px;padding:16px 15px;background:var(--enamel)}
.cell.rent{background:var(--bluing);border-color:var(--bluing)}
.cell-k{font-family:var(--data);font-size:.63rem;letter-spacing:.15em;text-transform:uppercase;
  color:var(--slate-mid);display:block;margin-bottom:7px;line-height:1.45}
.cell.rent .cell-k{color:rgba(255,255,255,.66)}
.cell-v{font-family:var(--data);font-weight:700;font-size:1.85rem;color:var(--slate);letter-spacing:-.03em;display:block}
.cell.rent .cell-v{color:#fff}
.cell-n{font-size:.79rem;color:var(--slate-mid);display:block;margin-top:4px;line-height:1.4}
.cell.rent .cell-n{color:rgba(255,255,255,.72)}
.verdict{margin-top:16px;padding:15px 17px;border-radius:6px;background:rgba(46,111,217,.08);
  border:1px solid rgba(46,111,217,.24);font-size:.94rem;line-height:1.52}
.verdict strong{font-family:var(--data);color:var(--redrock);font-size:1.06rem}
.panel-foot{padding:13px 24px;border-top:1px solid var(--line);background:var(--enamel);
  font-size:.78rem;color:var(--slate-mid);line-height:1.5}

/* ledger — landlords */
.ledger{background:#fff;border:1px solid var(--line);border-radius:8px;box-shadow:var(--shadow);overflow:hidden}
.ledger-top{background:var(--bluing);color:#fff;padding:15px 22px;display:flex;justify-content:space-between;align-items:center;gap:12px}
.ledger-title{font-family:var(--data);font-size:.7rem;font-weight:700;letter-spacing:.16em;text-transform:uppercase}
.ledger-sub{font-family:var(--data);font-size:.64rem;letter-spacing:.11em;color:rgba(255,255,255,.66)}
.ledger-row{display:flex;justify-content:space-between;align-items:center;gap:14px;padding:14px 22px;
  border-bottom:1px solid var(--line);font-size:.94rem}
.ledger-row:last-of-type{border-bottom:none}
.lr-label{color:var(--slate);line-height:1.35}
.lr-label small{display:block;color:var(--slate-mid);font-size:.79rem;margin-top:2px}
.lr-val{font-family:var(--data);font-weight:700;white-space:nowrap;font-size:1rem;color:var(--slate)}
.lr-val.ours{color:var(--agitate)}
.ledger-sum{background:var(--enamel);padding:18px 22px;border-top:2px solid var(--bluing);
  display:flex;justify-content:space-between;align-items:baseline;gap:14px}
.ls-k{font-family:var(--data);font-size:.66rem;letter-spacing:.14em;text-transform:uppercase;color:var(--slate-mid)}
.ls-v{font-family:var(--data);font-weight:700;font-size:1.9rem;color:var(--redrock);letter-spacing:-.03em}
.ledger-foot{padding:13px 22px;background:var(--enamel);border-top:1px solid var(--line);
  font-size:.78rem;color:var(--slate-mid);line-height:1.5}

/* cards, steps, audience */
.cards{display:grid;grid-template-columns:repeat(auto-fit,minmax(238px,1fr));gap:18px}
.card{background:var(--enamel);border:1px solid var(--line);border-radius:7px;padding:26px 22px}
.card h3{margin-bottom:9px}
.card p{font-size:.95rem;color:var(--slate-mid);margin:0}
.card-icon{font-family:var(--data);font-weight:700;font-size:.68rem;letter-spacing:.14em;
  color:var(--agitate);display:block;margin-bottom:13px}
.steps{display:grid;grid-template-columns:repeat(auto-fit,minmax(215px,1fr));border:1px solid var(--line);
  border-radius:7px;overflow:hidden;background:#fff}
.step{padding:28px 24px;border-right:1px solid var(--line)}
.step:last-child{border-right:none}
@media(max-width:820px){.step{border-right:none;border-bottom:1px solid var(--line)}.step:last-child{border-bottom:none}}
.step-n{font-family:var(--data);font-weight:700;font-size:.78rem;color:#fff;background:var(--bluing);
  width:30px;height:30px;border-radius:50%;display:flex;align-items:center;justify-content:center;margin-bottom:16px}
.step h3{margin-bottom:8px}
.step p{font-size:.94rem;color:var(--slate-mid);margin:0}
.aud{display:grid;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));gap:18px}
.aud-item{border-left:3px solid var(--agitate);padding:4px 0 4px 20px}
.aud-item h3{margin-bottom:7px}
.aud-item p{font-size:.95rem;color:var(--slate-mid);margin:0}

/* pricing blocks */
.price-grid{display:grid;grid-template-columns:1fr 1fr;gap:44px;align-items:start}
@media(max-width:860px){.price-grid{grid-template-columns:1fr;gap:32px}}
.price-tag{display:flex;align-items:baseline;gap:8px;margin:8px 0 20px}
.price-num{font-family:var(--data);font-weight:700;font-size:4.4rem;letter-spacing:-.05em;color:#fff;line-height:1}
.price-per{font-family:var(--display);font-weight:600;font-size:1.15rem;color:rgba(255,255,255,.66)}
.incl{list-style:none;padding:0;margin:0}
.incl li{padding:12px 0;border-bottom:1px solid rgba(255,255,255,.14);display:flex;gap:13px;align-items:flex-start;font-size:1rem}
.incl li:last-child{border-bottom:none}
.incl .yes{color:#5BE08E;font-family:var(--data);font-weight:700;flex:none}
.terms{border:1px solid rgba(255,255,255,.18);border-radius:7px;padding:26px 24px;background:rgba(255,255,255,.05)}
.terms dt{font-family:var(--data);font-size:.66rem;letter-spacing:.15em;text-transform:uppercase;color:#8FB8F5;margin-bottom:5px}
.terms dd{margin:0 0 18px;font-size:.98rem;color:rgba(255,255,255,.88)}
.terms dd:last-child{margin-bottom:0}
.pricebox{display:grid;grid-template-columns:1fr 1fr;background:#fff;border:1px solid var(--line);
  border-radius:8px;overflow:hidden;box-shadow:var(--shadow);margin-top:44px}
@media(max-width:800px){.pricebox{grid-template-columns:1fr}}
.pb-main{padding:36px 34px;background:var(--bluing);color:#fff}
.pb-side{padding:36px 34px}
.pb-tag{display:flex;align-items:baseline;gap:9px;margin:6px 0}
.pb-num{font-family:var(--data);font-weight:700;font-size:4.6rem;letter-spacing:-.05em;line-height:1}
.pb-per{font-family:var(--display);font-weight:600;font-size:1.15rem;color:rgba(255,255,255,.66)}
.pb-what{font-size:1rem;color:rgba(255,255,255,.78);margin-bottom:26px}
.pb-side dl{margin:0}
.pb-side dt{font-family:var(--data);font-size:.64rem;letter-spacing:.15em;text-transform:uppercase;color:var(--agitate);margin-bottom:5px}
.pb-side dd{margin:0 0 17px;font-size:.97rem}
.pb-side dd:last-child{margin-bottom:0}

/* tables */
table,.rates,.compare{width:100%;border-collapse:collapse;background:#fff;border:1px solid var(--line);
  border-radius:7px;overflow:hidden;font-size:.95rem;margin:24px 0}
th{font-family:var(--data);font-size:.63rem;letter-spacing:.12em;text-transform:uppercase;text-align:left;
  padding:14px 16px;background:var(--bluing);color:#fff;font-weight:700}
td{padding:14px 16px;border-top:1px solid var(--line);vertical-align:top}
td:last-child{font-family:var(--data);white-space:nowrap}
.compare tr.us td{background:rgba(46,111,217,.07);font-weight:500}
.compare tr.us td:first-child{box-shadow:inset 3px 0 0 var(--agitate)}
.num{font-family:var(--data);white-space:nowrap}

/* cities */
.cities{display:flex;flex-wrap:wrap;gap:9px;margin-top:8px}
.city{font-family:var(--data);font-size:.81rem;letter-spacing:.03em;border:1px solid var(--line);
  border-radius:100px;padding:8px 16px;background:#fff;color:var(--bluing-ink)}

/* laundromat guide */
.toc{background:#fff;border:1px solid var(--line);border-radius:7px;padding:22px 24px;margin:36px 0 8px}
.toc h3{font-size:.7rem;font-family:var(--data);letter-spacing:.16em;text-transform:uppercase;color:var(--slate-mid);margin-bottom:12px}
.toc ol{margin:0;padding-left:20px}
.toc li{margin-bottom:6px}
.toc a{text-decoration:none}
.toc a:hover{text-decoration:underline}
.mat{background:#fff;border:1px solid var(--line);border-radius:7px;padding:24px;margin-bottom:16px}
.mat-head{display:flex;justify-content:space-between;align-items:flex-start;gap:16px;flex-wrap:wrap;margin-bottom:6px}
.stars{font-family:var(--data);font-weight:700;font-size:.95rem;color:var(--bluing);white-space:nowrap}
.stars small{font-weight:400;color:var(--slate-mid);font-size:.78rem}
.addr{font-size:.94rem;color:var(--slate-mid);margin:0 0 16px}
.specs{display:grid;grid-template-columns:repeat(auto-fit,minmax(140px,1fr));gap:14px;padding:16px 0;
  border-top:1px solid var(--line);border-bottom:1px solid var(--line);margin-bottom:16px}
.spec-k{font-family:var(--data);font-size:.62rem;letter-spacing:.14em;text-transform:uppercase;
  color:var(--slate-mid);display:block;margin-bottom:4px}
.spec-v{font-size:.93rem;font-weight:500;display:block;line-height:1.4}
.mat p{font-size:.96rem}
.mat p:last-child{margin-bottom:0}
.flag{font-family:var(--data);font-size:.68rem;letter-spacing:.1em;text-transform:uppercase;padding:4px 10px;
  border-radius:100px;background:rgba(147,60,35,.1);color:var(--redrock);display:inline-block;margin-bottom:12px}
.flag.good{background:rgba(46,111,217,.1);color:var(--agitate)}
.callout{background:var(--bluing-ink);color:rgba(255,255,255,.85);border-radius:8px;padding:32px 30px;margin:48px 0}
.callout h3{color:#fff;font-size:1.4rem;margin-bottom:12px}
.callout p{color:rgba(255,255,255,.78)}
.callout .btn{margin-top:8px;background:#fff;color:var(--bluing-ink)}
.callout .btn:hover{background:var(--enamel-deep)}

/* faq */
.faq{max-width:50rem}
details{border-bottom:1px solid var(--line)}
summary{cursor:pointer;list-style:none;padding:19px 34px 19px 0;position:relative;
  font-family:var(--display);font-weight:700;font-size:1.02rem;color:var(--bluing-ink)}
summary::-webkit-details-marker{display:none}
summary::after{content:"+";position:absolute;right:6px;top:50%;transform:translateY(-50%);
  font-family:var(--data);font-size:1.35rem;color:var(--agitate);font-weight:400}
details[open] summary::after{content:"–"}
details p{padding:0 0 20px;color:var(--slate-mid);margin:0;max-width:46rem}

/* forms */
.form-grid{display:grid;grid-template-columns:1fr 1fr;gap:16px}
@media(max-width:700px){.form-grid{grid-template-columns:1fr}}
.field{display:flex;flex-direction:column;gap:7px}
.field.full{grid-column:1/-1}
label{font-family:var(--data);font-size:.67rem;letter-spacing:.14em;text-transform:uppercase;color:var(--slate-mid)}
input[type=text],input[type=tel],input[type=email],input[type=date],select,textarea{
  font-family:var(--body);font-size:1rem;padding:13px 14px;border:1px solid var(--line);
  border-radius:5px;background:#fff;color:var(--slate);width:100%}
textarea{min-height:94px;resize:vertical}
.form-note{font-size:.86rem;color:var(--slate-mid);margin-top:14px}

/* footer + mobile call bar */
footer{background:var(--bluing-ink);color:rgba(255,255,255,.62);padding:52px 0 28px;font-size:.93rem}
.foot-grid{display:grid;grid-template-columns:1.5fr 1fr 1fr;gap:40px;margin-bottom:36px}
@media(max-width:760px){.foot-grid{grid-template-columns:1fr;gap:28px}}
footer h4{font-family:var(--data);font-size:.68rem;letter-spacing:.15em;text-transform:uppercase;color:#8FB8F5;margin-bottom:14px}
footer a{color:rgba(255,255,255,.82);text-decoration:none}
.foot-grid a{display:block;margin-bottom:9px}
footer a:hover{color:#fff;text-decoration:underline}
.foot-bottom{border-top:1px solid rgba(255,255,255,.14);padding-top:20px;margin-top:28px;
  font-size:.83rem;color:rgba(255,255,255,.45)}
.callbar{position:fixed;bottom:0;left:0;right:0;z-index:70;display:none;background:var(--bluing);
  border-top:1px solid rgba(255,255,255,.16)}
.callbar a{flex:1;display:flex;align-items:center;justify-content:center;gap:8px;padding:15px 8px;
  font-family:var(--display);font-weight:700;font-size:.97rem;text-decoration:none;color:#fff}
.callbar a+a{border-left:1px solid rgba(255,255,255,.2);background:var(--agitate)}
@media(max-width:760px){.callbar{display:flex}body{padding-bottom:56px}}

@media(prefers-reduced-motion:reduce){
  *{animation-duration:.01ms!important;transition-duration:.01ms!important}
  html{scroll-behavior:auto}
}

/* ============================================================
   DARK-CONTEXT SAFETY
   Anything sitting on a dark background (.band-deep, .callout,
   footer, .callbar) gets readable colors here, structurally,
   rather than relying on per-element inline overrides.
   ============================================================ */

.band-deep, .callout, footer{--fg:rgba(255,255,255,.86);--fg-mid:rgba(255,255,255,.68);--fg-link:#9DC2F7}

.band-deep, .callout, footer{color:var(--fg)}
.band-deep h1,.band-deep h2,.band-deep h3,.band-deep h4,
.callout h1,.callout h2,.callout h3,.callout h4,
footer h1,footer h2,footer h3{color:#fff}
.band-deep p,.band-deep li,.band-deep dd,.band-deep span,.band-deep small,
.callout p,.callout li,.callout dd{color:var(--fg)}
.band-deep .sec-head p,.callout .sec-head p{color:var(--fg-mid)}
.band-deep a:not(.btn),.callout a:not(.btn){color:var(--fg-link)}
.band-deep strong,.callout strong{color:#fff}

/* cards and steps on dark */
.band-deep .card,.callout .card{background:rgba(255,255,255,.06);border-color:rgba(255,255,255,.18)}
.band-deep .card h3{color:#fff}
.band-deep .card p,.band-deep .card span{color:var(--fg-mid)}
.band-deep .card-icon{color:#9DC2F7}
.band-deep .steps{background:rgba(255,255,255,.05);border-color:rgba(255,255,255,.18)}
.band-deep .step{border-right-color:rgba(255,255,255,.18);border-bottom-color:rgba(255,255,255,.18)}
.band-deep .step h3{color:#fff}
.band-deep .step p{color:var(--fg-mid)}
.band-deep .step-n{background:#9DC2F7;color:var(--bluing-ink)}
.band-deep .aud-item{border-left-color:#9DC2F7}
.band-deep .aud-item h3{color:#fff}
.band-deep .aud-item p{color:var(--fg-mid)}

/* tables and notes on dark */
.band-deep table,.band-deep .rates,.band-deep .compare,
.callout table{background:rgba(255,255,255,.05);border-color:rgba(255,255,255,.18)}
.band-deep td,.callout td{border-top-color:rgba(255,255,255,.16);color:var(--fg)}
.band-deep th{background:rgba(255,255,255,.12);color:#fff}
.band-deep .note,.callout .note{border-left-color:#9DC2F7;color:var(--fg-mid)}
.band-deep .city{background:rgba(255,255,255,.1);border-color:rgba(255,255,255,.24);color:#fff}
.band-deep a.city:hover{background:rgba(255,255,255,.18)}

/* details/FAQ on dark */
.band-deep details{border-bottom-color:rgba(255,255,255,.18)}
.band-deep summary{color:#fff}
.band-deep summary::after{color:#9DC2F7}
.band-deep details p{color:var(--fg-mid)}

/* forms on dark */
.band-deep label{color:var(--fg-mid)}
.band-deep .form-note{color:var(--fg-mid)}

/* the logo mark was a navy ring on a navy footer — invisible */
footer .brand-mark,.band-deep .brand-mark{border-color:#9DC2F7;background:transparent}
footer .brand-mark::after,.band-deep .brand-mark::after{border-color:rgba(255,255,255,.55);
  border-top-color:transparent;border-right-color:transparent}
footer .brand-name,.band-deep .brand-name{color:#fff}
footer p{color:var(--fg-mid)}
footer .foot-bottom{color:rgba(255,255,255,.5)}

/* buttons on dark */
.band-deep .btn-ghost,.callout .btn-ghost{color:#fff;border-color:rgba(255,255,255,.42)}
.band-deep .btn-ghost:hover,.callout .btn-ghost:hover{border-color:#fff;background:rgba(255,255,255,.1)}
.band-deep .btn-primary,.callout .btn-primary{background:#fff;color:var(--bluing-ink)}
.band-deep .btn-primary:hover,.callout .btn-primary:hover{background:var(--enamel-deep)}

/* ============================================================
   BUTTON COLOUR PRECEDENCE
   Contextual link rules (.masthead nav a, footer a, etc.) are
   two-part selectors and outrank single-class .btn-primary.
   These restate button colours at higher specificity so a button
   can never inherit a link colour meant for plain text links.
   ============================================================ */
.masthead .btn-primary,footer .btn-primary,nav .btn-primary{color:#fff}
.masthead .btn-ghost,nav .btn-ghost{color:var(--bluing)}
.band-deep .btn-primary,.callout .btn-primary{color:var(--bluing-ink)}
.band-deep .btn-ghost,.callout .btn-ghost{color:#fff}
.callbar a{color:#fff}
.callout .btn{color:var(--bluing-ink)}