/* Ting — shared chrome for every rent-calculation variant.
   Single source of truth for the header + button system, so all 12 pages
   stay identical. Loaded AFTER each page's own <style>, so it wins. */
:root{
  --y:#FFCC00;        /* brand yellow  */
  --ys:#F8D86D;       /* brand yellow soft — the header/CTA fill */
  --yb:#FFD700;       /* brand yellow bright — hover */
  --ink:#1A1A1A;
  --ok:#009F4E; --info:#4183F2; --err:#FF3D3D;
}

/* ── Header ──────────────────────────────────────────────────────────────── */
nav{position:fixed;top:0;left:0;right:0;z-index:90;display:flex;align-items:center;
  justify-content:space-between;padding:15px 30px;backdrop-filter:blur(20px);
  background:rgba(0,0,0,.55);border-bottom:1px solid rgba(255,255,255,.06)}
.logo{display:flex;align-items:center;text-decoration:none;gap:0}
.logo img{height:40px;width:84.571px;object-fit:contain;display:block}
.logo i{display:none}          /* kills the old CSS-drawn mark */

/* ── Buttons — the header-right button IS the button ─────────────────────── */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;border:0;
  cursor:pointer;font-family:inherit;font-size:16px;font-weight:600;color:var(--ink);
  background:var(--ys);height:50px;padding:0 20px;border-radius:15px;
  box-shadow:inset 0 0 10px rgba(0,0,0,.05);transition:background .15s;
  text-decoration:none;white-space:nowrap}
.btn:hover{background:var(--yb)}
.btn img{width:18px;height:18px;object-fit:contain;flex:0 0 auto}
.btn.nav{height:45px;padding:0 18px;font-size:14px}
.btn.ghost{background:rgba(255,255,255,.06);color:#fff;border:1px solid rgba(255,255,255,.14)}
.btn.ghost:hover{background:rgba(255,255,255,.12)}
.btn.dark{background:rgba(255,255,255,.08);color:#fff}
.btn.dark:hover{background:rgba(255,255,255,.14)}
.btn.lg{height:50px;padding:0 20px;font-size:16px}   /* no oversized variant */
.btn.sm{height:45px;padding:0 18px;font-size:14px}
