/* Wash & Whirl — styles for the October 2026 rebuild (loaded after styles.css and expansion.css) */
.nav-contact{display:none}
.nav-links .active{color:var(--blue)}
.nav-links .active:after{right:0}
.page-hero.compact{padding-bottom:28px}
.center{text-align:center}
.center-link{text-align:center;margin:34px 0 0}
.fine{color:var(--muted);font-size:13px;margin-top:22px}
.coming-pill.left{margin:0 0 18px}
.soon{font-size:30px!important;color:#9db3d6!important}

/* How it works */
.how3-grid{list-style:none;margin:0 auto;padding:0;max-width:1180px;display:grid;grid-template-columns:repeat(3,1fr);gap:22px}
.how3-grid li{position:relative;padding:34px 30px 30px;border-radius:18px;background:#fff;border:1px solid var(--line);box-shadow:0 10px 35px rgba(13,50,110,.06)}
.how3-grid h3{margin:18px 0 8px;color:var(--navy);font-size:21px}
.how3-grid p{margin:0;color:var(--muted);font-size:15px}
.how3-num{display:inline-grid;place-items:center;width:44px;height:44px;border-radius:50%;background:var(--blue);color:#fff;font-weight:800;font-size:18px;box-shadow:0 0 0 6px #e2edff}

/* Pricing notes */
.price-notes{max-width:1180px;margin:34px auto 0;display:grid;grid-template-columns:repeat(3,1fr);gap:18px}
.price-notes div{padding:24px 26px;border-radius:15px;background:var(--pale)}
.price-notes h3{margin:0 0 6px;color:var(--navy);font-size:17px}
.price-notes p{margin:0;color:var(--muted);font-size:14px}

/* Pay by phone steps */
.paysteps-list{list-style:none;margin:0 auto;padding:0;max-width:1080px;display:grid;gap:26px}
.paysteps-list li{display:grid;grid-template-columns:1fr 250px;gap:50px;align-items:center;padding:34px 46px;border-radius:22px;background:#fff;border:1px solid var(--line);box-shadow:0 10px 35px rgba(13,50,110,.06)}
.paysteps-list li:nth-child(even){background:var(--pale)}
.paystep-copy h2{margin:16px 0 8px;color:var(--navy);font-size:clamp(24px,2.4vw,32px);line-height:1.15}
.paystep-copy p{margin:0;color:var(--muted);font-size:16px;max-width:560px}
.good-to-know{text-align:left;padding:26px}
.good-to-know ul{margin:10px 0 0;padding-left:18px;color:var(--muted);font-size:14px;display:grid;gap:9px}
.good-to-know b{color:var(--navy)}

/* Mini phones (match the real customer pages) */
.mini-phone{position:relative;width:230px;height:440px;margin:auto;padding:12px;border-radius:38px;background:#0f1729;box-shadow:0 24px 50px rgba(6,27,80,.25),inset 0 0 0 2px #2b3650}
.mini-notch{position:absolute;top:18px;left:50%;width:70px;height:18px;margin-left:-35px;border-radius:12px;background:#0f1729;z-index:2}
.mini-screen{height:100%;border-radius:28px;background:#f4f7fc;overflow:hidden;padding:44px 14px 14px;display:flex;flex-direction:column;gap:8px;font-size:12px;color:var(--ink)}
.mini-top{position:absolute;top:12px;left:12px;right:12px;height:44px;padding-top:24px;border-radius:28px 28px 0 0;background:var(--blue);color:#fff;font-size:9px;font-weight:800;letter-spacing:.14em;text-align:center}
.mini-card{margin-top:8px;padding:10px 12px;border-radius:12px;background:#fff;border:1px solid var(--line)}
.mini-card b{display:block;color:var(--navy);font-size:14px}
.mini-card small{color:var(--muted)}
.mini-h{margin:4px 0 0;font-weight:800;color:var(--navy)}
.mini-opt{display:flex;justify-content:space-between;padding:9px 12px;border-radius:10px;background:#fff;border:1.5px solid var(--line);font-weight:700}
.mini-opt small{color:var(--muted);font-weight:600}
.mini-opt.on{border-color:var(--blue);background:#eaf1ff}
.mini-btn{margin-top:auto;padding:11px;border-radius:10px;background:var(--blue);color:#fff;font-weight:800;text-align:center}
.mini-btn.dark{background:#000}
.mini-btn.gpay{margin-top:0;background:#fff;color:#3c4043;border:1px solid #dadce0}
.mini-cardbox{padding:10px 12px;border-radius:10px;background:#fff;border:1px solid var(--line);display:grid;gap:7px;color:var(--muted)}
.mini-cardbox i{display:block;height:9px;border-radius:4px;background:#e6ecf5}
.mini-cardbox i.short{width:55%}
.mini-ok{margin-top:8px;padding:8px;border-radius:10px;background:#e3f6ea;color:#11743b;font-weight:800;text-align:center}
.mini-wifi{padding:10px 12px;border-radius:10px;background:#fff;border:1px dashed #b9cbe6;color:var(--muted)}
.mini-wifi b{color:var(--navy);letter-spacing:.12em}
.mini-cam{flex:1;margin:-44px -14px -14px;padding:60px 18px 18px;background:radial-gradient(circle at 50% 42%,#4b5568,#1b2131);display:flex;flex-direction:column;align-items:center;justify-content:center;gap:16px;color:#fff;text-align:center;font-size:11px}
.mini-qr{width:120px;height:120px;border-radius:6px;box-shadow:0 0 0 3px #ffd84a,0 0 0 9px rgba(255,216,74,.25);background:repeating-conic-gradient(#000 0 25%,#fff 0 50%) 0 0/16px 16px,#fff;border:8px solid #fff}

/* Location */
.address{font-size:18px;font-weight:700;color:var(--navy)}
.loc-facts{margin:16px 0 26px;padding-left:20px;color:var(--muted);display:grid;gap:6px}

@media(max-width:1050px){.how3-grid,.price-notes{grid-template-columns:1fr}.paysteps-list li{grid-template-columns:1fr 220px;gap:28px;padding:28px}}
@media(max-width:760px){
  .nav-contact{display:block;text-align:left;padding:12px 0;font:inherit;font-weight:650;color:var(--navy);background:none;border:0}
  .paysteps-list li{grid-template-columns:1fr;padding:26px 22px}
  .mini-phone{width:210px;height:400px}
  .how3-grid li{padding:26px 22px}
}
