/* ════════════════════════════════════════════════════════════════
   MOBILE REDESIGN — Editorial / Premium Visual System (≤768px)
   Used by index.html and all city pages.
   ════════════════════════════════════════════════════════════════ */

.m-shell{display:none;}

/* ── Hide ONLY the legacy chrome + sections that duplicate the new design.
      Keep SEO sections (testimonials, FAQ, areas served, pricing details,
      use cases, features) visible — they're restyled below. ── */
.navbar, .city-hero, .hero-section, .hero-glow,
.site-footer, .wa-float, .mobile-sticky-cta,
body > [id^="mobSticky"],
.stats-strip,
#hero.hero-section,
#calculator.dk-section{display:none !important;}

@media (max-width:768px){
  body{padding-bottom:78px !important; background:#f3ecdb; margin:0;}
  .m-shell{display:block;}
}

/* ── Foundation ── */
.m-shell{
  font-family:'Inter',-apple-system,BlinkMacSystemFont,sans-serif;
  background:#f3ecdb;
  color:#13213f;
  min-height:100vh;
  position:relative;
}
@media (max-width:768px){
  .m-shell{overflow-x:hidden;}
}
.m-shell::before{
  content:'';
  position:fixed;
  inset:0;
  background-image:radial-gradient(circle, rgba(19,33,63,0.06) 1px, transparent 1px);
  background-size:18px 18px;
  pointer-events:none;
  z-index:0;
}
.m-shell > *{position:relative;z-index:1;}
.m-serif{font-family:'Fraunces',Georgia,serif;font-optical-sizing:auto;letter-spacing:-0.02em;}
.m-mono-cap{font-size:10px;font-weight:700;letter-spacing:0.14em;text-transform:uppercase;color:#6b7388;}

/* ── Top bar ── */
.m-topbar{
  display:flex;align-items:center;justify-content:space-between;
  padding:16px 18px 12px;
}
.m-logo{display:flex;align-items:center;text-decoration:none;flex-shrink:0;}
.m-logo svg{width:160px;height:auto;display:block;}
.m-city-chip{
  display:flex;align-items:center;gap:6px;
  padding:7px 13px;background:#fff;border:1px solid rgba(19,33,63,0.1);
  border-radius:999px;font-size:13px;font-weight:600;color:#13213f;
  box-shadow:0 1px 2px rgba(15,23,42,0.04);
  cursor:pointer;font-family:inherit;
}
.m-city-chip svg{width:13px;height:13px;}

/* ── Hero ── */
.m-hero{padding:8px 22px 28px;}
.m-trust-badge{
  display:inline-flex;align-items:center;gap:6px;
  padding:6px 11px;background:rgba(22,163,74,0.08);border:1px solid rgba(22,163,74,0.2);
  border-radius:999px;font-size:11px;font-weight:700;color:#15803d;
  letter-spacing:0.04em;margin-bottom:22px;
}
.m-trust-badge svg{width:13px;height:13px;}
.m-h1{
  font-family:'Fraunces',serif;
  font-size:36px;line-height:1.05;font-weight:700;
  color:#13213f;letter-spacing:-0.025em;
  margin-bottom:18px;
}
.m-h1 em{font-style:italic;font-weight:500;color:#13213f;}
.m-hero-sub{
  font-size:15px;line-height:1.55;color:#5a6280;
  margin-bottom:26px;
  max-width:340px;
}
.m-cta-card{
  display:flex;align-items:center;justify-content:space-between;gap:14px;
  background:#13213f;color:#fff;
  padding:22px 26px;border-radius:16px;
  text-decoration:none;
  box-shadow:0 8px 24px rgba(19,33,63,0.18);
  transition:transform .15s ease, box-shadow .15s ease;
}
.m-cta-card:active{transform:scale(0.985);box-shadow:0 4px 14px rgba(19,33,63,0.22);}
.m-cta-card-left .m-cta-eyebrow{font-size:10px;font-weight:700;letter-spacing:0.16em;color:rgba(255,255,255,0.55);margin-bottom:8px;}
.m-cta-card-left .m-cta-line{font-family:'Fraunces',serif;font-size:18px;font-weight:600;letter-spacing:-0.01em;line-height:1.15;}
.m-cta-arrow{
  width:36px;height:36px;border-radius:50%;border:1px solid rgba(255,255,255,0.18);
  display:flex;align-items:center;justify-content:center;flex-shrink:0;
}
.m-counter{
  margin-top:14px;
  font-size:12px;color:#6b7388;
  display:flex;align-items:center;gap:7px;
}
.m-counter .m-sparkle{color:#d4a437;font-size:14px;}

/* Hero trust strip — inline bullets below CTA */
.m-hero-trust{
  margin-top:18px;
  display:flex;align-items:center;justify-content:center;
  gap:22px;flex-wrap:wrap;
  font-size:12px;color:#5a6280;font-weight:500;
}
.m-hero-trust span{
  display:inline-flex;align-items:center;gap:6px;
}
.m-hero-trust svg{
  width:14px;height:14px;color:#15803d;flex-shrink:0;
}
@media (max-width:768px){
  .m-hero-trust{gap:12px;justify-content:flex-start;}
  .m-hero-trust span{font-size:11px;}
}

/* ── FAQ section (new home FAQ + accordion) ── */
.m-faq{padding:64px 22px 0;max-width:820px;margin:0 auto;}
@media (min-width:769px){
  .m-faq{padding:80px 32px 0;}
}
.m-faq-title{
  font-family:'Fraunces',serif;font-size:30px;line-height:1.1;
  font-weight:600;color:#13213f;letter-spacing:-0.02em;
  margin-bottom:8px;text-align:center;
}
@media (min-width:769px){.m-faq-title{font-size:38px;}}
.m-faq-sub{
  text-align:center;color:#6b7388;font-size:14px;line-height:1.55;
  margin-bottom:32px;
}
.m-faq-list{display:flex;flex-direction:column;gap:10px;}
.m-faq-item{
  background:#fff;border:1px solid rgba(19,33,63,0.08);border-radius:14px;
  overflow:hidden;
}
.m-faq-q{
  width:100%;text-align:left;
  background:none;border:none;
  padding:18px 22px;cursor:pointer;font-family:inherit;
  display:flex;align-items:center;justify-content:space-between;gap:14px;
  font-family:'Fraunces',serif;
  font-size:16px;font-weight:600;color:#13213f;
  letter-spacing:-0.01em;line-height:1.35;
}
.m-faq-q::after{
  content:'';
  width:10px;height:10px;border-right:2px solid #13213f;border-bottom:2px solid #13213f;
  transform:rotate(45deg);transition:transform .2s;flex-shrink:0;
  margin-top:-4px;
}
.m-faq-item.open .m-faq-q::after{transform:rotate(-135deg);margin-top:4px;}
.m-faq-a{
  display:none;
  padding:0 22px 18px;
  color:#5a6280;font-size:14px;line-height:1.65;
}
.m-faq-item.open .m-faq-a{display:block;}

/* ── Stat row ── */
.m-stats{
  margin:18px 22px 0;
  background:#fff;border:1px solid rgba(19,33,63,0.08);border-radius:14px;
  display:grid;grid-template-columns:1fr 1fr 1fr;
  overflow:hidden;
}
.m-stat{padding:18px 8px;text-align:center;border-right:1px solid rgba(19,33,63,0.07);}
.m-stat:last-child{border-right:none;}
.m-stat-num{font-family:'Fraunces',serif;font-size:22px;font-weight:700;color:#13213f;letter-spacing:-0.02em;line-height:1.1;}
.m-stat-num small{font-size:14px;font-weight:600;color:#13213f;margin-left:2px;}
.m-stat-num .m-star{color:#d4a437;}
.m-stat-lbl{font-size:9px;font-weight:700;letter-spacing:0.14em;color:#9ca3af;text-transform:uppercase;margin-top:6px;}

/* ── Section header ── */
.m-sec{padding:36px 22px 0;}
.m-sec-head{display:flex;align-items:flex-end;justify-content:space-between;margin-bottom:18px;}
.m-sec-title{font-family:'Fraunces',serif;font-size:24px;font-weight:600;color:#13213f;letter-spacing:-0.02em;line-height:1.1;}
.m-sec-link{font-size:13px;color:#6b7388;text-decoration:none;font-weight:500;}
.m-sec-link:active{color:#13213f;}

/* ── Service cards ── */
.m-svc-list{display:flex;flex-direction:column;gap:10px;}
.m-svc{
  display:flex;align-items:center;gap:14px;
  background:#fff;border:1px solid rgba(19,33,63,0.07);
  border-radius:16px;padding:16px 18px;
  text-decoration:none;color:inherit;
  transition:border-color .15s, transform .15s;
}
.m-svc:active{transform:scale(0.992);border-color:rgba(19,33,63,0.18);}
.m-svc-icon{
  width:44px;height:44px;flex-shrink:0;
  border-radius:12px;background:#f3ecdb;
  display:flex;align-items:center;justify-content:center;
}
.m-svc-body{flex:1;min-width:0;}
.m-svc-title-row{display:flex;align-items:center;gap:8px;margin-bottom:3px;flex-wrap:wrap;}
.m-svc-title{font-family:'Fraunces',serif;font-size:17px;font-weight:600;color:#13213f;letter-spacing:-0.01em;line-height:1.15;}
.m-svc-popular{font-size:9px;font-weight:800;color:#92400e;background:#fde68a;padding:2px 7px;border-radius:999px;letter-spacing:0.08em;white-space:nowrap;}
.m-svc-sub{font-size:12px;color:#7a8298;line-height:1.4;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
.m-svc-price{text-align:right;flex-shrink:0;}
.m-svc-price-lbl{font-size:9px;font-weight:700;color:#9ca3af;letter-spacing:0.12em;}
.m-svc-price-val{font-family:'Fraunces',serif;font-size:17px;font-weight:700;color:#13213f;margin-top:2px;}
.m-svc.popular{border:1.5px solid rgba(19,33,63,0.18);}

/* ── How it works ── */
.m-steps{position:relative;padding-left:42px;}
.m-steps::before{
  content:'';position:absolute;left:14px;top:14px;bottom:14px;
  border-left:2px dotted rgba(19,33,63,0.18);
}
.m-step{position:relative;padding-bottom:22px;}
.m-step:last-child{padding-bottom:0;}
.m-step-num{
  position:absolute;left:-42px;top:0;
  width:30px;height:30px;border-radius:50%;
  background:#fff;border:1.5px solid rgba(19,33,63,0.16);
  display:flex;align-items:center;justify-content:center;
  font-family:'Fraunces',serif;font-size:13px;font-weight:700;color:#13213f;
}
.m-step-title{font-family:'Fraunces',serif;font-size:18px;font-weight:600;color:#13213f;letter-spacing:-0.01em;line-height:1.15;}
.m-step-sub{font-size:13px;color:#7a8298;margin-top:3px;line-height:1.4;}
.m-sla{
  margin-top:22px;
  background:#13213f;color:#fff;
  border-radius:18px;padding:22px 24px;
}
.m-sla-eyebrow{display:flex;align-items:center;gap:7px;font-size:10px;font-weight:700;letter-spacing:0.14em;color:rgba(255,255,255,0.55);text-transform:uppercase;}
.m-sla-eyebrow svg{width:12px;height:12px;}
.m-sla-num{font-family:'Fraunces',serif;font-size:38px;font-weight:700;letter-spacing:-0.025em;margin-top:14px;line-height:1;}
.m-sla-desc{font-size:13px;color:rgba(255,255,255,0.7);margin-top:10px;line-height:1.5;}
.m-sla-foot{margin-top:14px;padding-top:14px;border-top:1px solid rgba(255,255,255,0.1);font-size:12px;color:rgba(255,255,255,0.75);display:flex;align-items:center;gap:7px;}
.m-sla-foot svg{width:13px;height:13px;}

/* ── Calculator ── */
.m-calc{
  background:#fff;border:1px solid rgba(19,33,63,0.08);border-radius:18px;
  padding:22px 20px;
}
.m-calc-head{display:flex;align-items:center;gap:12px;margin-bottom:18px;}
.m-calc-ico{width:42px;height:42px;border-radius:12px;background:#f3ecdb;display:flex;align-items:center;justify-content:center;flex-shrink:0;}
.m-calc-eyebrow{font-size:10px;font-weight:700;letter-spacing:0.14em;color:#9ca3af;text-transform:uppercase;}
.m-calc-title{font-family:'Fraunces',serif;font-size:18px;font-weight:600;color:#13213f;letter-spacing:-0.01em;margin-top:2px;}
.m-calc-lbl{font-size:10px;font-weight:700;letter-spacing:0.14em;color:#6b7388;text-transform:uppercase;margin-bottom:8px;display:block;}
.m-pills{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-bottom:18px;}
.m-pill{
  padding:14px 12px;border-radius:14px;border:1px solid rgba(19,33,63,0.1);
  background:#fff;color:#13213f;font-size:13px;font-weight:600;
  cursor:pointer;font-family:inherit;text-align:center;line-height:1.25;
  transition:all .15s;text-decoration:none;display:flex;align-items:center;justify-content:center;
}
.m-pill.active{background:#13213f;color:#fff;border-color:#13213f;}
.m-calc-row{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-bottom:18px;}
.m-calc-field label{display:block;font-size:10px;font-weight:700;letter-spacing:0.14em;color:#6b7388;text-transform:uppercase;margin-bottom:8px;}
.m-calc-field input{
  width:100%;padding:13px 16px;border:1px solid rgba(19,33,63,0.12);
  border-radius:999px;background:#fff;font-family:'Inter',sans-serif;
  font-size:15px;font-weight:600;color:#13213f;outline:none;
}
.m-calc-field input:focus{border-color:#13213f;}
.m-calc-slider-wrap{margin-bottom:20px;}
.m-calc-slider-lbl{font-size:10px;font-weight:700;letter-spacing:0.14em;color:#6b7388;text-transform:uppercase;margin-bottom:10px;}
.m-calc-slider{
  -webkit-appearance:none;appearance:none;width:100%;height:4px;
  background:rgba(19,33,63,0.12);border-radius:999px;outline:none;
}
.m-calc-slider::-webkit-slider-thumb{
  -webkit-appearance:none;appearance:none;
  width:18px;height:18px;border-radius:50%;background:#13213f;cursor:pointer;
}
.m-calc-slider::-moz-range-thumb{width:18px;height:18px;border-radius:50%;background:#13213f;cursor:pointer;border:none;}

/* Annual rent increment row — same look as rent/deposit field */
/* ── Variable rent schedule ── */
.m-sched{
  margin-bottom:18px;border:1px solid rgba(19,33,63,0.12);
  border-radius:12px;padding:14px;background:#fbf7ee;
}
.m-sched-head{
  font-size:10px;font-weight:700;letter-spacing:0.14em;
  color:#6b7388;text-transform:uppercase;margin-bottom:12px;
}
.m-sched-row{
  display:flex;align-items:center;gap:8px;margin-bottom:10px;flex-wrap:wrap;
}
.m-sched-no{
  font-size:11px;font-weight:700;color:#13213f;background:#e9e0c9;
  border-radius:6px;padding:3px 7px;flex-shrink:0;
}
.m-sched-range{
  font-size:13px;color:#13213f;display:flex;align-items:center;gap:5px;
}
.m-sched-range b{font-weight:700;}
.m-sched-in{
  width:52px;padding:7px 6px;border:1px solid rgba(19,33,63,0.18);
  border-radius:7px;font-size:13px;font-family:inherit;text-align:center;
  font-weight:600;color:#13213f;background:#fff;
}
.m-sched-in:focus{border-color:#13213f;outline:none;}
.m-sched-lock{font-weight:700;color:#13213f;}
.m-sched-rent{
  margin-left:auto;display:flex;align-items:center;gap:3px;
  font-size:13px;color:#13213f;font-weight:600;
}
.m-sched-rentin{
  width:86px;padding:7px 8px;border:1px solid rgba(19,33,63,0.18);
  border-radius:7px;font-size:13px;font-family:inherit;font-weight:600;
  color:#13213f;background:#fff;
}
.m-sched-rentin:focus{border-color:#13213f;outline:none;}
.m-sched-note{margin-left:auto;font-size:12px;color:#9ca3af;font-style:italic;}
.m-sched-rm{
  width:24px;height:24px;border:none;background:#f0e6d0;color:#b45309;
  border-radius:6px;font-size:15px;cursor:pointer;line-height:1;flex-shrink:0;
}
.m-sched-add{
  margin-top:2px;width:100%;background:none;
  border:1px dashed rgba(19,33,63,0.3);color:#13213f;
  font-family:inherit;font-size:12px;font-weight:600;
  padding:9px 12px;border-radius:8px;cursor:pointer;
}
.m-sched-hint{font-size:11px;color:#9ca3af;margin-top:8px;line-height:1.5;}
.m-pkg{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-bottom:16px;}
.m-pkg-card{
  background:#fff;border:1.5px solid rgba(19,33,63,0.12);border-radius:16px;
  padding:14px 14px 16px;cursor:pointer;position:relative;
  transition:all .15s;
}
.m-pkg-card.active{border-color:#13213f;background:#f8f5ec;}
.m-pkg-card.best{position:relative;}
.m-pkg-badge{
  position:absolute;top:-8px;right:10px;
  font-size:9px;font-weight:800;color:#92400e;background:#fde68a;
  padding:3px 8px;border-radius:999px;letter-spacing:0.08em;
}
.m-pkg-top{display:flex;justify-content:space-between;align-items:baseline;margin-bottom:10px;gap:6px;flex-wrap:wrap;}
.m-pkg-name{font-family:'Fraunces',serif;font-size:18px;font-weight:700;color:#13213f;letter-spacing:-0.01em;}
.m-pkg-price{font-family:'Fraunces',serif;font-size:15px;font-weight:700;color:#13213f;}
.m-pkg-list{list-style:none;font-size:12px;color:#5a6280;line-height:1.6;padding:0;margin:0;}
.m-pkg-list li{display:flex;align-items:flex-start;gap:6px;}
.m-pkg-list li::before{content:'✓';color:#15803d;font-weight:800;flex-shrink:0;font-size:11px;}
#mAddons{display:flex;flex-direction:column;gap:8px;margin-bottom:18px;}
.m-addon{
  display:flex;align-items:center;gap:12px;
  border:1px solid rgba(19,33,63,0.1);border-radius:14px;
  padding:14px 16px;cursor:pointer;
}
.m-addon-radio{width:18px;height:18px;border-radius:50%;border:1.5px solid rgba(19,33,63,0.2);flex-shrink:0;}
.m-addon-radio.on{border-color:#13213f;background:radial-gradient(#13213f 38%, transparent 42%);}
.m-addon-body{flex:1;}
.m-addon-title{font-size:14px;font-weight:600;color:#13213f;display:flex;align-items:center;gap:6px;}
.m-addon-price{font-family:'Fraunces',serif;font-size:15px;font-weight:700;color:#13213f;}
.m-cost-card{
  background:#13213f;color:#fff;border-radius:18px;padding:22px 22px;
}
.m-cost-eyebrow{font-size:10px;font-weight:700;letter-spacing:0.14em;color:rgba(255,255,255,0.55);text-transform:uppercase;}
.m-cost-title{font-family:'Fraunces',serif;font-size:22px;font-weight:600;margin-top:2px;letter-spacing:-0.02em;}
.m-cost-rows{margin-top:18px;display:flex;flex-direction:column;gap:11px;}
.m-cost-row{display:flex;justify-content:space-between;align-items:center;font-size:13px;color:rgba(255,255,255,0.8);}
.m-cost-row b{font-family:'Fraunces',serif;color:#fff;font-weight:600;font-size:14px;}
.m-cost-row.total{padding-top:14px;margin-top:6px;border-top:1px solid rgba(255,255,255,0.15);}
.m-cost-row.total b{font-size:20px;font-weight:700;}
.m-cost-btn{
  display:block;width:100%;margin-top:18px;padding:15px;
  background:#fff;color:#13213f;border:none;border-radius:14px;
  font-family:'Inter',sans-serif;font-size:14px;font-weight:700;letter-spacing:0.02em;
  cursor:pointer;text-align:center;text-decoration:none;box-sizing:border-box;
}

/* ── FAQ ── */
.m-faq-item{
  background:#fff;border:1px solid rgba(19,33,63,0.07);border-radius:14px;
  padding:16px 18px;margin-bottom:8px;
}
.m-faq-q{font-family:'Fraunces',serif;font-size:15px;font-weight:600;color:#13213f;letter-spacing:-0.01em;}
.m-faq-a{font-size:13px;color:#6b7388;margin-top:6px;line-height:1.55;}

/* ── Trust strip (for city pages) ── */
.m-trust-strip{
  margin:18px 22px 0;display:flex;flex-direction:column;gap:8px;
}
.m-trust-row{
  display:flex;align-items:center;gap:10px;
  background:#fff;border:1px solid rgba(19,33,63,0.07);border-radius:12px;
  padding:12px 14px;font-size:13px;color:#13213f;font-weight:500;
}
.m-trust-row svg{width:16px;height:16px;flex-shrink:0;}

/* ── Testimonial card ── */
.m-testi{
  background:#fff;border:1px solid rgba(19,33,63,0.07);border-radius:16px;
  padding:18px 18px;margin-bottom:12px;
}
.m-testi-stars{color:#d4a437;font-size:13px;letter-spacing:1px;margin-bottom:8px;}
.m-testi-text{font-family:'Fraunces',serif;font-size:15px;line-height:1.5;color:#13213f;font-style:italic;font-weight:500;}
.m-testi-author{margin-top:12px;display:flex;align-items:center;gap:10px;}
.m-testi-avatar{width:34px;height:34px;border-radius:50%;background:#13213f;color:#fff;display:flex;align-items:center;justify-content:center;font-family:'Fraunces',serif;font-weight:700;font-size:14px;}
.m-testi-name{font-size:13px;font-weight:700;color:#13213f;}
.m-testi-loc{font-size:11px;color:#9ca3af;}

/* ── Footer (CTA band + columns) ── */
.m-ftr{margin-top:40px;}
.m-ftr-cta{
  position:relative;overflow:hidden;
  background:linear-gradient(135deg,#1b2c4f,#13213f);
  padding:46px 22px;text-align:center;
}
.m-ftr-cta::before{
  content:"";position:absolute;inset:0;pointer-events:none;opacity:.5;
  background-image:radial-gradient(circle,rgba(200,150,47,0.16) 1px,transparent 1px);
  background-size:24px 24px;
}
.m-ftr-cta-eyebrow{
  position:relative;font-size:11px;font-weight:700;letter-spacing:.16em;
  text-transform:uppercase;color:#c8962f;
}
.m-ftr-cta-title{
  position:relative;margin:10px 0 6px;
  font-family:'Fraunces',serif;font-weight:600;font-size:28px;line-height:1.15;color:#fff;
}
.m-ftr-cta-title em{font-style:italic;color:#c8962f;}
.m-ftr-cta-sub{position:relative;font-size:14px;color:#9aa6be;margin-bottom:22px;}
.m-ftr-cta-acts{position:relative;display:flex;flex-direction:column;gap:10px;align-items:center;}
.m-ftr-cta-primary,.m-ftr-cta-ghost{
  display:inline-block;font-size:14px;font-weight:700;
  padding:14px 24px;border-radius:999px;text-decoration:none;
}
.m-ftr-cta-primary{background:#c8962f;color:#13213f;}
.m-ftr-cta-ghost{background:transparent;color:#fff;border:1px solid rgba(255,255,255,0.28);}
.m-ftr-main{background:#f3ecdb;padding:36px 22px 22px;}
.m-ftr-grid{display:grid;grid-template-columns:1fr 1fr;gap:26px 20px;}
.m-ftr-brand{grid-column:1 / -1;}
.m-ftr-wm{font-family:'Fraunces',serif;font-size:21px;font-weight:700;color:#13213f;letter-spacing:-0.01em;}
.m-ftr-wm span{color:#c8962f;}
.m-ftr-tag{font-size:11px;letter-spacing:.1em;text-transform:uppercase;color:#9098a8;margin-top:4px;}
.m-ftr-col h4{font-size:11px;font-weight:700;letter-spacing:.13em;text-transform:uppercase;color:#13213f;margin-bottom:12px;}
.m-ftr-col a{display:block;font-size:13.5px;color:#56607a;text-decoration:none;margin-bottom:9px;}
.m-ftr-col a:active{color:#13213f;}
.m-ftr-bar{
  margin-top:24px;padding-top:18px;border-top:1px solid rgba(19,33,63,0.12);
  display:flex;flex-direction:column;gap:8px;font-size:12.5px;color:#7a8198;
}
.m-ftr-legal a{color:#7a8198;text-decoration:none;margin-right:16px;}

/* ── Bottom nav (sticky tab bar) ── */
.m-tabbar{
  position:fixed;bottom:0;left:0;right:0;z-index:90;
  background:rgba(255,255,255,0.96);
  backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);
  border-top:1px solid rgba(19,33,63,0.08);
  display:grid;grid-template-columns:1fr 1fr 1fr 1fr;
  padding:8px 6px calc(8px + env(safe-area-inset-bottom, 0px));
}
.m-tab{
  display:flex;flex-direction:column;align-items:center;justify-content:center;gap:4px;
  padding:8px 4px;text-decoration:none;color:#9ca3af;font-size:10px;font-weight:700;
  letter-spacing:0.06em;text-transform:uppercase;background:none;border:none;font-family:inherit;cursor:pointer;
}
.m-tab svg{width:22px;height:22px;stroke-width:1.6;}
.m-tab.active{color:#13213f;}

/* ── Chat float ── */
.m-chat-float{
  position:fixed;bottom:88px;right:18px;z-index:80;
  width:48px;height:48px;border-radius:50%;
  background:#16a34a;display:flex;align-items:center;justify-content:center;
  box-shadow:0 6px 18px rgba(22,163,74,0.32);
  color:#fff;text-decoration:none;
}
.m-chat-float svg{width:24px;height:24px;}

/* ── Callback float (desktop only — mobile uses the bottom tab bar) ── */
.m-callback-float{display:none;}
@media (min-width:769px){
  .m-callback-float{
    position:fixed;bottom:96px;right:28px;z-index:80;
    width:56px;height:56px;border-radius:50%;border:none;cursor:pointer;
    background:#13213f;color:#fff;
    display:flex;align-items:center;justify-content:center;
    box-shadow:0 6px 18px rgba(19,33,63,0.32);
  }
  .m-callback-float svg{width:26px;height:26px;}
  .m-callback-float-lbl{
    position:absolute;right:68px;top:50%;transform:translateY(-50%);
    background:#13213f;color:#fff;font-size:13px;font-weight:600;
    padding:7px 12px;border-radius:8px;white-space:nowrap;
    opacity:0;pointer-events:none;transition:opacity .18s ease;
    box-shadow:0 4px 12px rgba(0,0,0,0.18);
  }
  .m-callback-float:hover .m-callback-float-lbl{opacity:1;}
}

/* ════════════════════════════════════════════════════════════════
   FORM-SPECIFIC (agreement_form.html mobile shell)
   ════════════════════════════════════════════════════════════════ */

/* Clearance so the fixed/sticky action bar never hides the last content
   (Download draft + trust line) — keeps the confirm step readable at 100% zoom. */
.m-form-shell{padding-bottom:104px;}
.m-form-top{
  display:flex;align-items:center;justify-content:space-between;
  padding:16px 18px 8px;
}
.m-form-menu{
  width:42px;height:42px;border-radius:50%;
  background:#fff;border:1px solid rgba(19,33,63,0.1);
  display:flex;align-items:center;justify-content:center;
  cursor:pointer;font-family:inherit;color:#13213f;
}
.m-form-menu svg{width:20px;height:20px;}

.m-form-intro{padding:14px 22px 18px;text-align:center;}
.m-form-eyebrow{font-size:10px;font-weight:700;letter-spacing:0.18em;color:#9ca3af;text-transform:uppercase;margin-bottom:10px;}
.m-form-h1{
  font-family:'Fraunces',serif;
  font-size:30px;line-height:1.08;font-weight:600;
  color:#13213f;letter-spacing:-0.02em;
  margin-bottom:12px;
}
.m-form-h1 em{font-style:italic;font-weight:500;}
.m-form-sub{font-size:13px;color:#7a8298;line-height:1.5;}

/* ── Stepper ── */
.m-stepper{
  padding:18px 22px 14px;
  display:flex;align-items:flex-start;justify-content:space-between;
  position:relative;gap:4px;
}
.m-stepper::before{
  content:'';position:absolute;
  top:36px;left:46px;right:46px;height:2px;
  background:rgba(19,33,63,0.1);border-radius:2px;
}
.m-stepper-progress{
  position:absolute;top:36px;left:46px;height:2px;
  background:#13213f;border-radius:2px;
  transition:width .35s ease;z-index:1;
}
.m-step-item{
  flex:1;display:flex;flex-direction:column;align-items:center;gap:8px;
  position:relative;z-index:2;
  cursor:pointer;background:none;border:none;font-family:inherit;padding:0;
}
.m-step-circle{
  width:32px;height:32px;border-radius:50%;
  background:#fff;border:1.5px solid rgba(19,33,63,0.18);
  display:flex;align-items:center;justify-content:center;
  font-family:'Fraunces',serif;font-size:13px;font-weight:700;color:#9ca3af;
  transition:all .2s;
}
.m-step-item.active .m-step-circle{
  background:#13213f;border-color:#13213f;color:#fff;
}
.m-step-item.done .m-step-circle{
  background:#15803d;border-color:#15803d;color:#fff;
}
.m-step-item.done .m-step-circle svg{width:14px;height:14px;}
.m-step-label{font-size:9px;font-weight:700;letter-spacing:0.1em;color:#9ca3af;text-transform:uppercase;}
.m-step-item.active .m-step-label,
.m-step-item.done   .m-step-label{color:#13213f;}

/* ── Step panels ── */
.m-step-panel{
  padding:22px 22px 110px;
  animation:mFade .25s ease;
}
.m-step-panel.hidden{display:none;}
@keyframes mFade{from{opacity:0;transform:translateY(8px);}to{opacity:1;transform:none;}}

.m-panel-card{
  background:#fff;border:1px solid rgba(19,33,63,0.08);border-radius:18px;
  padding:24px 22px;
  margin-bottom:14px;
}
.m-panel-title{
  font-family:'Fraunces',serif;
  font-size:22px;font-weight:600;color:#13213f;letter-spacing:-0.02em;
  margin-bottom:18px;
}
.m-section-card{
  background:#fff;border:1px solid rgba(19,33,63,0.08);border-radius:16px;
  padding:18px 18px 20px;
  margin-bottom:12px;
}
.m-section-eyebrow{
  font-size:10px;font-weight:700;letter-spacing:0.16em;color:#9ca3af;text-transform:uppercase;
  margin-bottom:14px;
}

/* ── Form inputs ── */
.m-field{margin-bottom:14px;}
.m-field:last-child{margin-bottom:0;}
.m-field-label{
  display:block;
  font-size:11px;font-weight:700;letter-spacing:0.12em;color:#6b7388;text-transform:uppercase;
  margin-bottom:7px;
}
.m-field-input,
.m-field-textarea{
  width:100%;
  padding:13px 16px;
  border:1px solid rgba(19,33,63,0.14);
  border-radius:999px;
  background:#fff;font-family:'Inter',sans-serif;
  font-size:15px;color:#13213f;outline:none;
  -webkit-appearance:none;box-sizing:border-box;
  transition:border-color .15s;
}
.m-field-textarea{
  border-radius:14px;
  min-height:90px;resize:vertical;line-height:1.45;
}
.m-field-input:focus,
.m-field-textarea:focus{border-color:#13213f;}
.m-field-input::placeholder,
.m-field-textarea::placeholder{color:#a8aebf;}

.m-pill-group{display:grid;grid-template-columns:1fr 1fr;gap:8px;}
.m-pill-group.cols-2{grid-template-columns:1fr 1fr;}
.m-pill-group.cols-3{grid-template-columns:1fr 1fr 1fr;}
.m-pill-btn{
  padding:13px 10px;border-radius:14px;
  border:1px solid rgba(19,33,63,0.12);
  background:#fff;color:#13213f;
  font-size:13px;font-weight:600;font-family:inherit;
  cursor:pointer;text-align:center;line-height:1.25;
  transition:all .15s;
}
.m-pill-btn.active{
  background:#13213f;color:#fff;border-color:#13213f;
}

.m-field-row{display:grid;grid-template-columns:1fr 1fr;gap:10px;}
.m-field-row .m-field{margin-bottom:14px;}

.m-note{
  background:#fffbeb;border:1px solid rgba(245,158,11,0.3);
  border-radius:12px;padding:12px 14px;
  font-size:12px;color:#92400e;line-height:1.5;
  display:flex;gap:8px;align-items:flex-start;
  margin-bottom:14px;
}
.m-note svg{width:16px;height:16px;flex-shrink:0;margin-top:1px;color:#d97706;}

/* ── Add another owner / tenant ── */
.m-add-party{
  width:100%;margin:2px 0 16px;padding:13px;
  background:#f3f0ff;color:#667eea;
  border:1.5px dashed #b2a8e8;border-radius:12px;
  font-size:14px;font-weight:700;cursor:pointer;
  font-family:inherit;transition:.2s;
}
.m-add-party:hover{background:#e9e3ff;}
.m-extra-party{margin-top:14px;padding-top:14px;border-top:1px dashed #e2dcf5;}
.m-extra-party-head{
  display:flex;justify-content:space-between;align-items:center;margin-bottom:10px;
}
.m-extra-party-head span{
  font-size:12px;font-weight:800;color:#667eea;
  text-transform:uppercase;letter-spacing:.4px;
}
.m-extra-remove{
  background:#fef2f2;color:#ef4444;border:none;border-radius:6px;
  padding:4px 11px;font-size:12px;font-weight:700;cursor:pointer;font-family:inherit;
}
.m-extra-remove:hover{background:#fee2e2;}

/* ── Confirmation cards ── */
.m-summary-card{
  background:#fff;border:1px solid rgba(19,33,63,0.08);border-radius:16px;
  padding:20px 22px;margin-bottom:12px;
}
.m-summary-label{
  font-size:10px;font-weight:800;letter-spacing:0.16em;color:#9ca3af;text-transform:uppercase;
  margin-bottom:14px;
}
.m-summary-row{
  display:flex;align-items:center;justify-content:space-between;
  padding:12px 0;
  border-bottom:1px solid rgba(19,33,63,0.06);
  font-size:14px;color:#5a6280;
}
.m-summary-row:last-child{border-bottom:none;}
.m-summary-row b{
  font-family:'Fraunces',serif;color:#13213f;font-weight:600;font-size:16px;
}
.m-summary-total{
  display:flex;align-items:center;justify-content:space-between;
  margin-top:8px;padding-top:14px;border-top:1px solid rgba(19,33,63,0.1);
}
.m-summary-total span{font-family:'Fraunces',serif;font-size:18px;color:#13213f;font-weight:500;}
.m-summary-total b{font-family:'Fraunces',serif;font-size:24px;color:#13213f;font-weight:700;}

/* ── Bottom action bar ── */
.m-form-actions{
  position:fixed;bottom:0;left:0;right:0;z-index:80;
  background:rgba(243,236,219,0.96);
  backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);
  border-top:1px solid rgba(19,33,63,0.08);
  padding:14px 18px calc(14px + env(safe-area-inset-bottom, 0px));
  display:flex;gap:10px;align-items:center;
}
.m-back-btn{
  display:flex;align-items:center;justify-content:center;gap:8px;
  padding:14px 22px;
  background:#fff;border:1px solid rgba(19,33,63,0.14);
  border-radius:999px;
  font-family:inherit;font-size:14px;font-weight:600;color:#13213f;
  cursor:pointer;flex-shrink:0;
}
.m-back-btn svg{width:14px;height:14px;}
.m-next-btn{
  flex:1;
  display:flex;align-items:center;justify-content:center;gap:10px;
  padding:14px 22px;
  background:#13213f;color:#fff;border:none;border-radius:999px;
  font-family:inherit;font-size:14px;font-weight:700;
  cursor:pointer;text-decoration:none;
}
.m-next-btn svg{width:14px;height:14px;}
.m-pay-btn{
  flex:1;
  display:flex;align-items:center;justify-content:center;gap:10px;
  padding:14px 22px;
  background:linear-gradient(135deg,#d4a437,#b88830);color:#fff;
  border:none;border-radius:999px;
  font-family:inherit;font-size:14px;font-weight:700;
  cursor:pointer;text-decoration:none;
  box-shadow:0 4px 14px rgba(212,164,55,0.32);
}
.m-pay-btn svg{width:14px;height:14px;}
.m-download-btn{
  display:flex;align-items:center;justify-content:center;gap:8px;
  width:100%;
  padding:13px 22px;
  background:#fff;border:1px solid rgba(19,33,63,0.14);
  border-radius:14px;
  font-family:inherit;font-size:13px;font-weight:600;color:#13213f;
  cursor:pointer;text-decoration:none;margin-bottom:10px;
}
.m-download-btn svg{width:14px;height:14px;}

.m-trust-foot{
  text-align:center;font-size:11px;color:#9ca3af;
  padding:14px 22px 18px;line-height:1.5;
}

/* ════════════════════════════════════════════════════════════════
   LEGACY SEO CONTENT — restyled to match editorial palette.
   Kept visible (testimonials, FAQ, areas served, pricing details,
   use cases, features sections) so search engines index them.
   ════════════════════════════════════════════════════════════════ */

/* Wrappers — flatten to cream backdrop, generous padding */
.sec-w, .sec-g, .sec-a,
.dk-section, .dk-section--alt,
.svc-section{
  background:transparent !important;
  border-top:none !important;
  border-bottom:none !important;
  padding:64px 22px !important;
  color:#13213f !important;
  position:relative;
  z-index:1;
}
.sec-a, .dk-section--alt{
  background:rgba(19,33,63,0.035) !important;
}

/* Container width on desktop */
.sec-w .container, .sec-g .container, .sec-a .container,
.dk-section .container, .svc-section .container{
  max-width:1180px;
  margin:0 auto;
  padding:0;
}

/* Headings — Fraunces serif, navy, editorial */
.sec-title, .dk-title, .svc-title,
.sec-w h2, .sec-g h2, .sec-a h2{
  font-family:'Fraunces',Georgia,serif !important;
  font-weight:600 !important;
  letter-spacing:-0.02em !important;
  color:#13213f !important;
  font-size:30px !important;
  line-height:1.1 !important;
  margin-bottom:10px !important;
  text-shadow:none !important;
}
.sec-a .sec-title, .dk-section--alt .dk-title{color:#13213f !important;}
.sec-sub, .dk-sub{
  color:#5a6280 !important;
  font-size:15px !important;
  line-height:1.55 !important;
  margin-bottom:32px !important;
}
.dk-header{margin-bottom:32px !important;}
.dk-eyebrow{
  font-family:'Inter',sans-serif !important;
  color:#9ca3af !important;
  font-size:10px !important;
  font-weight:700 !important;
  letter-spacing:0.14em !important;
  text-transform:uppercase !important;
}

/* Body text inside sections */
.sec-w p, .sec-g p, .sec-a p,
.dk-section p, .svc-section p{
  color:#4a5168 !important;
  line-height:1.65 !important;
}

/* FAQ */
.faq-list{max-width:780px !important;margin:0 auto !important;}
.faq-item{
  background:#fff !important;
  border:1px solid rgba(19,33,63,0.08) !important;
  border-radius:14px !important;
  padding:18px 22px !important;
  margin-bottom:8px !important;
}
.faq-q{
  font-family:'Fraunces',serif !important;
  font-size:16px !important;
  font-weight:600 !important;
  color:#13213f !important;
  letter-spacing:-0.01em !important;
}
.faq-q::after{color:#13213f !important;}
.faq-a{
  color:#5a6280 !important;
  font-size:14px !important;
  line-height:1.65 !important;
  padding-top:10px !important;
}

/* Testimonial cards */
.testi-grid{gap:18px !important;}
.testi-card{
  background:#fff !important;
  border:1px solid rgba(19,33,63,0.08) !important;
  border-radius:16px !important;
  padding:22px !important;
  box-shadow:none !important;
}
.testi-card:hover{
  border-color:rgba(19,33,63,0.18) !important;
  box-shadow:none !important;
}
.testi-stars{color:#d4a437 !important;}
.testi-text{
  font-family:'Fraunces',serif !important;
  font-style:italic;
  font-weight:500 !important;
  color:#13213f !important;
  font-size:14.5px !important;
  line-height:1.55 !important;
}
.testi-avatar{
  background:#13213f !important;
  font-family:'Fraunces',serif !important;
}
.testi-name{color:#13213f !important;}
.testi-loc{color:#9ca3af !important;}

/* Generic cards inside SEO sections */
.sec-w div[style*="background:#fff"],
.sec-w div[style*="background:#f8fafc"],
.sec-g div[style*="background:#fff"],
.sec-g div[style*="background:#f8fafc"]{
  background:#fff !important;
  border:1px solid rgba(19,33,63,0.08) !important;
  border-radius:14px !important;
  box-shadow:none !important;
}

/* Step cards / Area cards / Doc cards / Use cards — invert from dark to light */
.step-card, .area-card, .doc-card, .use-card,
.area-card:hover, .step-card:hover{
  background:#fff !important;
  border:1px solid rgba(19,33,63,0.08) !important;
  box-shadow:none !important;
  transform:none !important;
}
.step-card h3, .step-card h4,
.area-card h3, .area-card h4,
.doc-card h3, .doc-card h4,
.use-card h3, .use-card h4{
  font-family:'Fraunces',serif !important;
  color:#13213f !important;
  font-weight:600 !important;
  letter-spacing:-0.01em !important;
}
.step-card p, .area-card p, .doc-card p, .use-card p{
  color:#5a6280 !important;
}
.step-n{
  background:#13213f !important;
  font-family:'Fraunces',serif !important;
  color:#fff !important;
}
.step-card.active, .area-card.active{
  border-color:#13213f !important;
  background:#f8f5ec !important;
}
/* Highlighted "Agreement Delivered" final step */
.step-card[style*="border:"]:not([style*="rgba"]){
  border-color:rgba(21,128,61,0.4) !important;
  background:#f0fdf4 !important;
}
.step-card .step-n[style*="green"],
.step-card .step-n[style*="#10b981"],
.step-card .step-n[style*="#15"]{
  background:#15803d !important;
}

/* Service grid cards (svc-section on index) */
.svc-grid{gap:18px !important;}
.svc-card{
  background:#fff !important;
  border:1px solid rgba(19,33,63,0.08) !important;
  border-radius:16px !important;
  box-shadow:none !important;
}

/* Buttons inside legacy sections (CTAs) */
.sec-w .btn-pri, .sec-g .btn-pri, .sec-a .btn-pri,
.dk-section .btn-pri, .dk-generate-btn{
  background:#13213f !important;
  color:#fff !important;
  border:none !important;
  border-radius:999px !important;
  font-family:'Inter',sans-serif !important;
  letter-spacing:0.02em !important;
}

/* Hide legacy duplicate-of-new-design sections */
#hero.hero-section,
#calculator.dk-section,
.sec-a#how-it-works,           /* city pages: duplicate of new m-steps */
.dk-section#how-it-works,      /* index: duplicate of new m-steps */
.svc-section#services{display:none !important;}  /* index: duplicate of new m-svc-list */

/* ── Desktop topbar extras (hidden on mobile) ── */
.m-nav-links{display:none;}
.m-topbar-right{display:flex;align-items:center;gap:10px;}
.m-nav-cta{display:none;}

/* Account / Sign-in button injected by mobile-redesign.js into .m-topbar-right.
   Hidden on mobile — m-tabbar's Agreements tab plays the same role there. */
.m-account-btn{display:none;}

/* ════════════════════════════════════════════════════════════════
   DESKTOP (≥769px) — True desktop layout
   ════════════════════════════════════════════════════════════════ */
@media (min-width:769px){
  /* Show m-shell at desktop sizes too */
  .m-shell{display:block !important;}
  body{padding-bottom:0 !important; background:#f3ecdb !important; margin:0;}

  /* (Legacy chrome hides are now at the top-level; SEO content stays visible.) */

  /* No bottom tab bar on desktop */
  .m-tabbar{display:none !important;}
  .m-chat-float{bottom:28px;right:28px;width:56px;height:56px;}
  .m-chat-float svg{width:28px;height:28px;}

  /* Top navbar */
  .m-topbar{
    padding:18px 32px;
    border-bottom:1px solid rgba(19,33,63,0.07);
    max-width:1240px;margin:0 auto;
    position:sticky;top:0;
    background:rgba(243,236,219,0.94);
    backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);
    z-index:50;
  }
  .m-logo svg{width:200px;}
  .m-nav-links{display:flex;align-items:center;gap:32px;}
  .m-nav-links a{
    font-size:14px;font-weight:500;color:#4a5168;text-decoration:none;
    transition:color .15s;
  }
  .m-nav-links a:hover{color:#13213f;}
  .m-nav-cta{
    display:inline-flex;align-items:center;gap:8px;
    padding:10px 18px;background:#13213f;color:#fff;text-decoration:none;
    border-radius:999px;font-size:13px;font-weight:600;
    transition:transform .15s, box-shadow .15s;
  }
  .m-nav-cta:hover{transform:translateY(-1px);box-shadow:0 6px 18px rgba(19,33,63,0.2);}

  /* Desktop: show the Sign in / My Agreements button as a secondary CTA */
  .m-account-btn{
    display:inline-flex;align-items:center;gap:7px;
    padding:9px 14px 9px 12px;
    background:#fff;color:#13213f;
    border:1px solid rgba(19,33,63,0.12);border-radius:999px;
    font-family:inherit;font-size:13px;font-weight:600;
    cursor:pointer;
    transition:border-color .15s, transform .15s, box-shadow .15s;
  }
  .m-account-btn svg{width:14px;height:14px;color:#13213f;flex-shrink:0;}
  .m-account-btn:hover{
    border-color:#13213f;transform:translateY(-1px);
    box-shadow:0 4px 12px rgba(19,33,63,0.10);
  }

  /* Hero — massive editorial centered */
  .m-hero{
    padding:80px 32px 88px;
    text-align:center;
    max-width:920px;margin:0 auto;
  }
  .m-trust-badge{margin-left:auto;margin-right:auto;margin-bottom:32px;}
  .m-h1{
    font-size:88px;line-height:1.0;
    margin-bottom:28px;
    max-width:none;
  }
  .m-hero-sub{
    font-size:19px;line-height:1.55;
    max-width:580px;
    margin:0 auto 40px;
  }
  .m-cta-card{
    max-width:480px;
    margin:0 auto;
    padding:26px 30px;
  }
  .m-cta-card-left .m-cta-line{font-size:20px;}
  .m-counter{
    justify-content:center;margin-top:20px;font-size:13px;
  }

  /* Stat row */
  .m-stats{
    margin:24px auto 0;
    max-width:780px;
    border-radius:18px;
  }
  .m-stat{padding:26px 16px;}
  .m-stat-num{font-size:30px;}
  .m-stat-lbl{font-size:10px;margin-top:8px;}

  /* Trust strip — match the centered stat-row width on desktop */
  .m-trust-strip{
    max-width:1020px;
    margin:18px auto 0;
  }

  /* Section wrapper */
  .m-sec{
    max-width:1180px;
    margin:0 auto;
    padding:80px 32px 0;
  }
  .m-sec-title{font-size:38px;line-height:1.05;}
  .m-sec-head{margin-bottom:32px;}
  .m-mono-cap{font-size:11px;}

  /* Services — 4-column grid */
  .m-svc-list{
    display:grid;
    grid-template-columns:repeat(4,1fr);
    gap:18px;
  }
  .m-svc{
    flex-direction:column;
    align-items:flex-start;
    padding:26px 24px 24px;
    gap:18px;
    min-height:200px;
  }
  .m-svc-icon{width:52px;height:52px;}
  .m-svc-icon svg{width:26px;height:26px;}
  .m-svc-body{width:100%;flex:none;}
  .m-svc-title{font-size:18px;}
  .m-svc-sub{white-space:normal;font-size:13px;}
  .m-svc-price{
    text-align:left;
    margin-top:auto;
    display:flex;align-items:baseline;gap:8px;
  }
  .m-svc-price-lbl{font-size:10px;}
  .m-svc-price-val{font-size:20px;margin-top:0;}

  /* How it works — horizontal 5-step timeline */
  .m-sec h2.m-sec-title{margin-bottom:32px;}
  .m-steps{
    display:grid;
    grid-template-columns:repeat(5,1fr);
    gap:0;
    padding-left:0;
    position:relative;
  }
  .m-steps::before{
    content:'';
    position:absolute;
    top:16px;left:60px;right:60px;bottom:auto;
    border-left:none;
    border-top:2px dotted rgba(19,33,63,0.22);
  }
  .m-step{
    padding:0 14px 0 0;
    padding-bottom:0;
  }
  .m-step-num{
    position:relative;
    left:auto;top:auto;
    margin-bottom:16px;
    background:#f3ecdb;
    width:34px;height:34px;
    font-size:14px;
  }
  .m-step-title{font-size:17px;}
  .m-step-sub{font-size:13px;}

  /* SLA card under timeline */
  .m-sla{
    max-width:580px;
    margin:48px auto 0;
    padding:32px 36px;
    border-radius:20px;
  }
  .m-sla-num{font-size:48px;margin-top:18px;}
  .m-sla-desc{font-size:14px;}

  /* Calculator — 2-col layout (left = inputs stacked, right = sticky cost card) */
  .m-calc{
    display:grid;
    grid-template-columns:minmax(0,1.3fr) minmax(0,1fr);
    column-gap:40px;
    align-items:start;
    padding:36px;
    border-radius:24px;
  }
  /* Force inputs (with or without .m-calc-inputs wrapper) into left column */
  .m-calc > *:not(.m-cost-card){grid-column:1;}
  .m-calc-inputs{display:flex;flex-direction:column;}
  .m-cost-card{
    grid-column:2;
    grid-row:1 / span 99;
    align-self:start;
    position:sticky;
    top:96px;
    padding:28px;
    border-radius:20px;
    max-width:none;
  }
  .m-cost-title{font-size:26px;}
  .m-cost-row{font-size:14px;}
  .m-cost-row b{font-size:15px;}
  .m-cost-row.total b{font-size:24px;}
  .m-cost-btn{padding:16px;font-size:15px;}

  /* Pkg cards a bit bigger */
  .m-pkg-name{font-size:20px;}
  .m-pkg-price{font-size:16px;}

  /* Footer — CTA band + columns */
  .m-ftr{margin-top:72px;}
  .m-ftr-cta{padding:56px 32px;}
  .m-ftr-cta-title{font-size:36px;}
  .m-ftr-cta-acts{flex-direction:row;justify-content:center;}
  .m-ftr-main{padding:48px 32px 26px;}
  .m-ftr-grid{
    grid-template-columns:1.7fr 1fr 1fr 1.2fr;gap:40px;
    max-width:1100px;margin:0 auto;
  }
  .m-ftr-brand{grid-column:auto;}
  .m-ftr-col a:hover{color:#13213f;}
  .m-ftr-cta-primary:hover{background:#d4a437;}
  .m-ftr-legal a:hover{color:#13213f;}
  .m-ftr-bar{
    max-width:1100px;margin:32px auto 0;
    flex-direction:row;justify-content:space-between;align-items:center;
  }

  /* ── Agreement form — centered on desktop ── */
  .m-form-shell .m-form-top,
  .m-form-shell .m-form-intro,
  .m-form-shell .m-stepper,
  .m-form-shell > form,
  .m-form-shell .m-panel-card,
  .m-form-shell .m-summary-card,
  .m-form-shell .m-save-banner,
  .m-form-shell .m-download-btn,
  .m-form-shell .m-trust-foot,
  .m-form-shell .m-form-actions{
    max-width:680px;
    margin-left:auto;
    margin-right:auto;
  }
  /* preserve the banner/button vertical spacing after the auto-centering reset */
  .m-form-shell .m-save-banner{margin-bottom:16px;}
  .m-form-shell .m-download-btn{margin-top:4px;margin-bottom:10px;}
  /* Desktop bar is sticky (in-flow), so it needs far less bottom clearance
     than the mobile fixed bar — keep a small runway, not the full mobile gap. */
  .m-form-shell{padding-bottom:32px;}
  /* Desktop: keep the action bar (Continue / Pay) stuck to the bottom of the
     viewport so it's always visible even on tall forms, but constrained to the
     centered form column. Falls to its natural spot when the page fits. */
  .m-form-shell .m-form-actions{
    position:sticky;
    bottom:16px;
    transform:none;
    left:auto;
    right:auto;
    width:100%;
    max-width:680px;
    margin:16px auto 24px;
    padding:10px 14px;
    background:rgba(247,245,239,0.92);
    backdrop-filter:blur(8px);
    -webkit-backdrop-filter:blur(8px);
    border:1px solid rgba(19,33,63,0.08);
    border-radius:14px;
    box-shadow:0 8px 24px rgba(19,33,63,0.10);
    z-index:50;
  }
  .m-form-shell .m-panel-card{
    border-radius:20px;
    margin-bottom:12px;
  }
  .m-form-shell .m-form-intro{
    padding-top:32px;
    padding-bottom:28px;
  }
  .m-form-shell .m-form-h1{font-size:38px;}
}

/* Wider desktop polish */
@media (min-width:1100px){
  .m-h1{font-size:104px;}
}

/* ── City modal — centered editorial sheet ── */
.m-shell > .m-city-modal,
.m-city-modal{
  position:fixed !important;inset:0;display:none;
  background:rgba(19,33,63,0.55);
  backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px);
  z-index:200;
  align-items:flex-start;justify-content:center;
  padding:80px 20px 20px;
  overflow-y:auto;
}
.m-city-modal.open{display:flex;}
.m-city-sheet{
  background:#f3ecdb;
  width:100%;max-width:560px;
  border-radius:24px;
  padding:32px 32px 28px;
  box-shadow:0 30px 80px rgba(0,0,0,0.25);
  border:1px solid rgba(19,33,63,0.08);
  position:relative;
}
.m-city-handle{display:none;}  /* No drag handle for centered modal */
.m-city-modal .m-sec-title{
  font-size:24px !important;
  margin-bottom:6px !important;
}
.m-city-modal-sub{
  font-size:13px;color:#6b7388;
  margin-bottom:22px;line-height:1.5;
}
.m-city-modal .m-pill{
  padding:16px 12px;
  font-size:14px;
  background:#fff;
}
.m-city-modal .m-pill:hover{
  background:#13213f;color:#fff;border-color:#13213f;
}
.m-city-modal .m-pill.active{
  background:#13213f;color:#fff;border-color:#13213f;
}
.m-city-close{
  position:absolute;top:18px;right:18px;
  width:34px;height:34px;border-radius:50%;
  background:rgba(19,33,63,0.06);border:none;
  display:flex;align-items:center;justify-content:center;
  cursor:pointer;font-family:inherit;
  transition:background .15s;
}
.m-city-close:hover{background:rgba(19,33,63,0.12);}
.m-city-close svg{width:16px;height:16px;color:#13213f;}

/* ===== Callback request modal ===== */
.m-cb-form{display:flex;flex-direction:column;gap:10px;}
.m-cb-input{
  width:100%;padding:13px 14px;
  border:1.5px solid rgba(19,33,63,0.14);border-radius:12px;
  background:#fff;font-family:inherit;font-size:14px;color:#13213f;
  outline:none;transition:border-color .15s;
}
.m-cb-input:focus{border-color:#13213f;}
.m-cb-submit{
  margin-top:4px;padding:14px;border:none;border-radius:12px;
  background:#13213f;color:#fff;font-family:inherit;font-size:15px;
  font-weight:700;cursor:pointer;transition:opacity .15s;
}
.m-cb-submit:hover{opacity:.9;}
.m-cb-submit:disabled{opacity:.6;cursor:default;}
.m-cb-error{
  font-size:13px;color:#b91c1c;background:#fef2f2;
  border:1px solid #fecaca;border-radius:8px;padding:8px 11px;
}
.m-cb-success{text-align:center;padding:14px 0 4px;}
.m-cb-success-ic{
  width:52px;height:52px;margin:0 auto 12px;border-radius:50%;
  background:#dcfce7;color:#15803d;font-size:26px;font-weight:700;
  display:flex;align-items:center;justify-content:center;
}
.m-cb-success-t{font-size:17px;font-weight:700;color:#13213f;margin-bottom:4px;}
.m-cb-success-s{font-size:13px;color:#6b7388;}

/* ===== Accessibility: focus + reduced motion ===== */
a:focus-visible,button:focus-visible,input:focus-visible,select:focus-visible,
textarea:focus-visible,[tabindex]:focus-visible,[role="button"]:focus-visible,
summary:focus-visible{
  outline:2px solid #13213f;
  outline-offset:2px;
}
@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{
    animation-duration:.01ms !important;
    animation-iteration-count:1 !important;
    transition-duration:.01ms !important;
    scroll-behavior:auto !important;
  }
}