/* wifi-page.css — clean Apple-style design for wifi-broadband-provider village pages */

:root{
  --wp-blue:#2563eb;
  --wp-blue-dark:#1d4ed8;
  --wp-blue-light:#eff6ff;
  --wp-blue-lighter:#dbeafe;
  --wp-ink:#0f172a;
  --wp-ink-soft:#334155;
  --wp-muted:#64748b;
  --wp-border:#e2e8f0;
  --wp-bg:#f8fafc;
  --wp-white:#ffffff;
  --wp-radius:16px;
  --wp-shadow:0 4px 24px rgba(15,23,42,0.06);
  --wp-shadow-lg:0 12px 40px rgba(15,23,42,0.10);
}

.wp-hero,.wp-why,.wp-plans-section,.wp-faq,.wp-nearby,.wp-cta{font-family:inherit;}

/* ---------- HERO ---------- */
.wp-hero{background:linear-gradient(180deg,var(--wp-blue-light) 0%,var(--wp-white) 100%);padding:150px 0 40px;}
.wp-hero-grid{display:grid;grid-template-columns:1.1fr 0.9fr;gap:48px;align-items:center;}
.wp-badge{display:inline-flex;align-items:center;gap:8px;background:var(--wp-blue-lighter);color:var(--wp-blue-dark);font-size:0.8rem;font-weight:600;padding:7px 16px;border-radius:50px;margin-bottom:20px;}
.wp-hero h1{font-size:clamp(2rem,4.2vw,3rem);font-weight:800;color:var(--wp-ink);line-height:1.15;margin:0 0 18px;}
.wp-hero h1 .wp-accent{color:var(--wp-blue);}
.wp-hero-sub{font-size:1.05rem;color:var(--wp-muted);line-height:1.7;max-width:520px;margin:0 0 28px;}
.wp-hero-actions{display:flex;gap:14px;flex-wrap:wrap;margin-bottom:24px;}
.wp-btn-primary{display:inline-flex;align-items:center;gap:8px;background:var(--wp-blue);color:#fff;font-weight:700;font-size:0.95rem;padding:14px 26px;border-radius:12px;text-decoration:none;transition:transform .22s ease,box-shadow .22s ease,background-color .22s ease;box-shadow:0 8px 20px rgba(37,99,235,0.25);}
.wp-btn-primary:hover{transform:translateY(-2px);box-shadow:0 12px 28px rgba(37,99,235,0.32);background:var(--wp-blue-dark);color:#fff;}
.wp-btn-outline{display:inline-flex;align-items:center;gap:8px;background:#fff;color:var(--wp-ink);font-weight:700;font-size:0.95rem;padding:14px 26px;border-radius:12px;border:1.5px solid var(--wp-border);text-decoration:none;transition:transform .22s ease,box-shadow .22s ease,border-color .22s ease;}
.wp-btn-outline:hover{transform:translateY(-2px);box-shadow:var(--wp-shadow);border-color:var(--wp-blue);color:var(--wp-blue);}
.wp-breadcrumb ol{list-style:none;display:flex;gap:6px;flex-wrap:wrap;padding:0;margin:0;}
.wp-breadcrumb a{color:var(--wp-blue);text-decoration:none;font-size:12.5px;}
.wp-breadcrumb li{color:var(--wp-muted);font-size:12.5px;}
.wp-breadcrumb li[aria-current]{color:var(--wp-ink);font-weight:600;}

/* Hero decorative visual (no product photo available -> CSS/icon illustration) */
.wp-hero-visual{display:flex;align-items:center;justify-content:center;position:relative;min-height:340px;}
.wp-visual-blob{position:relative;width:320px;height:320px;display:flex;align-items:center;justify-content:center;}
.wp-visual-blob::before{content:'';position:absolute;inset:0;border-radius:50%;background:radial-gradient(circle at 35% 30%,#dbeafe,transparent 70%);}
.wp-visual-ring{position:absolute;border-radius:50%;border:1.5px solid rgba(37,99,235,0.18);}
.wp-ring-1{inset:20px;}
.wp-ring-2{inset:60px;}
.wp-visual-router{position:relative;width:150px;height:150px;background:var(--wp-white);border-radius:28px;box-shadow:var(--wp-shadow-lg);display:flex;align-items:center;justify-content:center;}
.wp-visual-router i{font-size:56px;color:var(--wp-blue);}
.wp-router-body{position:absolute;bottom:-14px;width:90px;height:14px;background:var(--wp-blue-lighter);border-radius:8px;left:50%;transform:translateX(-50%);}

/* ---------- STATS STRIP ---------- */
.wp-stats-strip{margin-top:44px;background:var(--wp-white);border:1px solid var(--wp-border);border-radius:var(--wp-radius);box-shadow:var(--wp-shadow);padding:22px 28px;display:grid;grid-template-columns:repeat(4,1fr);gap:20px;}
.wp-stat{display:flex;align-items:center;gap:12px;}
.wp-stat-icon{flex-shrink:0;width:44px;height:44px;border-radius:50%;background:var(--wp-blue-light);color:var(--wp-blue);display:flex;align-items:center;justify-content:center;font-size:1.1rem;}
.wp-stat-num{font-weight:700;color:var(--wp-ink);font-size:0.92rem;}
.wp-stat-lbl{color:var(--wp-muted);font-size:0.8rem;}

/* ---------- WHY CHOOSE ---------- */
.wp-why{padding:80px 0;}
.wp-section-head{text-align:center;max-width:600px;margin:0 auto 48px;}
.wp-section-badge{display:inline-block;background:var(--wp-blue-lighter);color:var(--wp-blue-dark);font-size:0.78rem;font-weight:700;padding:5px 16px;border-radius:50px;margin-bottom:14px;}
.wp-section-head h2{font-size:clamp(1.6rem,3vw,2.2rem);font-weight:800;color:var(--wp-ink);margin:0 0 12px;}
.wp-section-sub{color:var(--wp-muted);font-size:0.98rem;line-height:1.6;margin:0;}
.wp-why-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:22px;}
.wp-why-card{background:var(--wp-white);border:1px solid var(--wp-border);border-radius:var(--wp-radius);padding:30px 24px;text-align:center;transition:transform .26s ease,box-shadow .26s ease,border-color .26s ease;}
.wp-why-card:hover{transform:translateY(-6px);box-shadow:var(--wp-shadow-lg);border-color:var(--wp-blue-lighter);}
.wp-why-icon{width:54px;height:54px;border-radius:50%;background:var(--wp-blue-light);color:var(--wp-blue);display:flex;align-items:center;justify-content:center;font-size:1.3rem;margin:0 auto 18px;}
.wp-why-card h3{font-size:1.02rem;font-weight:700;color:var(--wp-ink);margin:0 0 10px;}
.wp-why-card p{color:var(--wp-muted);font-size:0.88rem;line-height:1.6;margin:0;}

/* ---------- LOCAL CONTEXT ---------- */
.wp-local{padding:70px 0;}
.wp-local-grid{display:grid;grid-template-columns:3fr 2fr;gap:48px;align-items:start;}
.wp-local-grid h2{font-size:clamp(1.3rem,2.6vw,1.7rem);font-weight:800;color:var(--wp-ink);margin:14px 0 16px;}
.wp-local-grid h3{font-size:1.02rem;font-weight:700;color:var(--wp-ink);margin:18px 0 8px;}
.wp-local-grid p{color:var(--wp-muted);font-size:0.95rem;line-height:1.75;margin:0 0 6px;}
.wp-local-card{background:var(--wp-blue-light);border:1px solid var(--wp-blue-lighter);border-radius:var(--wp-radius);padding:26px;}
.wp-local-card h4{font-size:0.95rem;font-weight:700;color:var(--wp-ink);margin:0 0 14px;}
.wp-local-card ul{list-style:none;padding:0;margin:0;}
.wp-local-card li{display:flex;align-items:center;gap:10px;font-size:0.88rem;color:var(--wp-ink-soft);padding:8px 0;border-bottom:1px solid rgba(37,99,235,0.1);}
.wp-local-card li:last-child{border-bottom:none;}
.wp-local-card li i{color:var(--wp-blue);width:16px;flex-shrink:0;}
@media(max-width:900px){.wp-local-grid{grid-template-columns:1fr;}}

/* ---------- PLANS + SIDEBAR ---------- */
.wp-plans-section{padding:20px 0 80px;background:var(--wp-bg);}
.wp-plans-layout{display:grid;grid-template-columns:2.1fr 1fr;gap:32px;align-items:start;}
.wp-plans-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:24px;flex-wrap:wrap;gap:10px;}
.wp-plans-header h2{font-size:1.5rem;font-weight:800;color:var(--wp-ink);margin:0;}
.wp-view-all{color:var(--wp-blue);font-weight:600;font-size:0.88rem;text-decoration:none;display:inline-flex;align-items:center;gap:6px;transition:gap .2s ease;}
.wp-view-all:hover{gap:10px;color:var(--wp-blue-dark);}
.wp-plan-cards{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;}
.wp-plan-card{background:var(--wp-white);border:1px solid var(--wp-border);border-radius:var(--wp-radius);padding:26px 22px;position:relative;transition:transform .26s ease,box-shadow .26s ease;}
.wp-plan-card:hover{transform:translateY(-5px);box-shadow:var(--wp-shadow-lg);}
.wp-plan-popular{border-color:var(--wp-blue);box-shadow:0 8px 28px rgba(37,99,235,0.14);}
.wp-plan-badge{position:absolute;top:-12px;left:50%;transform:translateX(-50%);background:var(--wp-blue);color:#fff;font-size:0.68rem;font-weight:700;padding:4px 14px;border-radius:20px;white-space:nowrap;}
.wp-plan-name{font-size:1rem;font-weight:700;color:var(--wp-ink);margin:6px 0 4px;}
.wp-plan-desc{color:var(--wp-muted);font-size:0.82rem;margin:0 0 14px;}
.wp-plan-icon{width:40px;height:40px;border-radius:10px;background:var(--wp-blue-light);color:var(--wp-blue);display:flex;align-items:center;justify-content:center;font-size:1rem;margin-bottom:16px;}
.wp-plan-price{font-size:1.7rem;font-weight:800;color:var(--wp-ink);margin-bottom:18px;}
.wp-plan-price span{font-size:0.8rem;font-weight:500;color:var(--wp-muted);}
.wp-plan-btn{display:block;text-align:center;background:var(--wp-white);color:var(--wp-blue);border:1.5px solid var(--wp-blue);font-weight:700;font-size:0.88rem;padding:11px;border-radius:10px;text-decoration:none;transition:transform .2s ease,box-shadow .2s ease,background-color .2s ease,color .2s ease;}
.wp-plan-btn:hover{transform:translateY(-2px);background:var(--wp-blue-light);color:var(--wp-blue-dark);}
.wp-plan-btn-filled{background:var(--wp-blue);color:#fff;border-color:var(--wp-blue);}
.wp-plan-btn-filled:hover{background:var(--wp-blue-dark);color:#fff;box-shadow:0 10px 22px rgba(37,99,235,0.3);}

.wp-sidebar{display:flex;flex-direction:column;gap:16px;}
.wp-coverage-card,.wp-call-card{background:var(--wp-white);border:1px solid var(--wp-border);border-radius:var(--wp-radius);padding:24px;}
.wp-coverage-card h3{font-size:1rem;font-weight:700;color:var(--wp-ink);margin:0 0 10px;display:flex;align-items:center;gap:8px;}
.wp-coverage-card h3 i{color:var(--wp-blue);}
.wp-coverage-addr{color:var(--wp-muted);font-size:0.85rem;margin:0 0 16px;}
.wp-coverage-list{list-style:none;padding:0;margin:0;}
.wp-coverage-list li{display:flex;align-items:center;gap:10px;font-size:0.86rem;color:var(--wp-ink-soft);padding:7px 0;border-bottom:1px solid var(--wp-bg);}
.wp-coverage-list li:last-child{border-bottom:none;}
.wp-coverage-list i{color:var(--wp-blue);font-size:0.8rem;}
.wp-call-card{display:flex;gap:14px;align-items:center;}
.wp-call-icon{flex-shrink:0;width:46px;height:46px;border-radius:50%;background:var(--wp-blue-light);color:var(--wp-blue);display:flex;align-items:center;justify-content:center;font-size:1.1rem;}
.wp-call-lbl{font-size:0.8rem;color:var(--wp-muted);font-weight:600;}
.wp-call-num{display:block;font-size:1.15rem;font-weight:800;color:var(--wp-ink);text-decoration:none;margin:2px 0;}
.wp-call-num:hover{color:var(--wp-blue);}
.wp-call-note{font-size:0.78rem;color:var(--wp-muted);margin:0;}
.wp-whatsapp-card{display:flex;align-items:center;justify-content:center;gap:10px;background:#25D366;color:#fff;font-weight:700;font-size:0.92rem;padding:14px;border-radius:var(--wp-radius);text-decoration:none;transition:transform .22s ease,box-shadow .22s ease;}
.wp-whatsapp-card:hover{transform:translateY(-2px);box-shadow:0 10px 24px rgba(37,211,102,0.32);color:#fff;}

/* ---------- FAQ ---------- */
.wp-faq{padding:70px 0;}

/* ---------- NEARBY ---------- */
.wp-nearby{padding:50px 0;background:var(--wp-bg);text-align:center;}
.wp-nearby h2{font-size:1.35rem;font-weight:800;color:var(--wp-ink);margin:0 0 26px;}
.wp-nearby-pills{display:flex;gap:10px;flex-wrap:wrap;justify-content:center;}
.wp-pill{background:var(--wp-white);border:1.5px solid var(--wp-border);color:var(--wp-ink-soft);padding:8px 18px;border-radius:50px;text-decoration:none;font-weight:600;font-size:0.85rem;transition:transform .2s ease,background-color .2s ease,border-color .2s ease,color .2s ease;}
.wp-pill:hover{transform:translateY(-2px);border-color:var(--wp-blue);color:var(--wp-blue);}
.wp-pill-filled{background:var(--wp-blue);border-color:var(--wp-blue);color:#fff;}
.wp-pill-filled:hover{background:var(--wp-blue-dark);color:#fff;}

/* ---------- CTA ---------- */
.wp-cta{background:linear-gradient(135deg,var(--wp-blue),var(--wp-blue-dark));padding:64px 0;text-align:center;}
.wp-cta h2{color:#fff;font-size:clamp(1.4rem,3vw,2rem);font-weight:800;margin:0 0 12px;}
.wp-cta p{color:rgba(255,255,255,0.85);font-size:0.98rem;max-width:520px;margin:0 auto 28px;}
.wp-cta-actions{display:flex;gap:14px;justify-content:center;flex-wrap:wrap;}
.wp-cta-btn{display:inline-flex;align-items:center;gap:8px;background:#fff;color:var(--wp-blue);font-weight:700;font-size:0.95rem;padding:14px 26px;border-radius:12px;text-decoration:none;transition:transform .22s ease,box-shadow .22s ease;}
.wp-cta-btn:hover{transform:translateY(-2px);box-shadow:0 10px 26px rgba(0,0,0,0.18);color:var(--wp-blue-dark);}
.wp-cta-btn-ghost{background:transparent;color:#fff;border:1.5px solid rgba(255,255,255,0.5);}
.wp-cta-btn-ghost:hover{background:rgba(255,255,255,0.1);color:#fff;}

/* ---------- VILLAGES GRID (hub page) ---------- */
.wp-villages{padding:70px 0;background:var(--wp-bg);}
.wp-villages-grid{display:grid;grid-template-columns:repeat(6,1fr);gap:14px;margin-top:44px;}
.wp-village-card{background:var(--wp-white);border:1px solid var(--wp-border);border-radius:14px;padding:18px;transition:transform .24s ease,box-shadow .24s ease,border-color .24s ease;}
.wp-village-card:hover{transform:translateY(-4px);box-shadow:var(--wp-shadow);border-color:var(--wp-blue-lighter);}
.wp-village-icon{width:32px;height:32px;border-radius:9px;background:var(--wp-blue-light);color:var(--wp-blue);display:flex;align-items:center;justify-content:center;font-size:0.8rem;margin-bottom:10px;}
.wp-village-card h3{font-size:0.88rem;font-weight:700;color:var(--wp-ink);margin:0 0 3px;}
.wp-village-card .wp-village-dist{font-size:0.72rem;color:var(--wp-muted);margin:0 0 2px;}
.wp-village-card .wp-village-tag{font-size:0.68rem;color:#94a3b8;margin:0 0 10px;}
.wp-village-card a{color:var(--wp-blue);font-size:0.72rem;font-weight:700;text-decoration:none;display:inline-flex;align-items:center;gap:4px;}
.wp-village-card a:hover{gap:7px;}

/* ---------- IMPACT CARDS (hub page) ---------- */
.wp-impact{padding:70px 0;}
.wp-impact-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;margin-top:44px;}
.wp-impact-card{background:var(--wp-white);border:1px solid var(--wp-border);border-left:4px solid var(--wp-blue);border-radius:14px;padding:22px;transition:transform .24s ease,box-shadow .24s ease;}
.wp-impact-card:hover{transform:translateY(-4px);box-shadow:var(--wp-shadow);}
.wp-impact-icon{font-size:1.5rem;color:var(--wp-blue);margin-bottom:10px;}
.wp-impact-card h4{font-size:0.95rem;font-weight:700;color:var(--wp-ink);margin:0 0 8px;}
.wp-impact-card p{font-size:0.85rem;color:var(--wp-muted);line-height:1.6;margin:0;}

/* ---------- STEPS (hub page) ---------- */
.wp-steps{padding:70px 0;background:var(--wp-bg);}
.wp-steps-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:18px;margin-top:44px;text-align:center;}
.wp-step-card{background:var(--wp-white);border:1px solid var(--wp-border);border-radius:14px;padding:24px 18px;transition:transform .24s ease,box-shadow .24s ease;}
.wp-step-card:hover{transform:translateY(-4px);box-shadow:var(--wp-shadow);}
.wp-step-num{width:40px;height:40px;border-radius:50%;background:linear-gradient(135deg,var(--wp-blue),var(--wp-blue-dark));color:#fff;font-weight:800;display:flex;align-items:center;justify-content:center;margin:0 auto 12px;}
.wp-step-card h5{font-size:0.88rem;font-weight:700;color:var(--wp-ink);margin:0 0 6px;}
.wp-step-card p{font-size:0.78rem;color:var(--wp-muted);margin:0;}

/* ---------- RESPONSIVE ---------- */
@media(max-width:900px){
  .wp-hero-grid{grid-template-columns:1fr;text-align:center;}
  .wp-hero-copy{order:1;}
  .wp-hero-visual{order:0;min-height:220px;}
  .wp-hero-actions{justify-content:center;}
  .wp-hero-sub{margin-left:auto;margin-right:auto;}
  .wp-breadcrumb ol{justify-content:center;}
  .wp-stats-strip{grid-template-columns:repeat(2,1fr);}
  .wp-why-grid{grid-template-columns:repeat(2,1fr);}
  .wp-plans-layout{grid-template-columns:1fr;}
  .wp-plan-cards{grid-template-columns:1fr;}
}
@media(max-width:900px){
  .wp-villages-grid{grid-template-columns:repeat(3,1fr);}
  .wp-impact-grid{grid-template-columns:repeat(2,1fr);}
  .wp-steps-grid{grid-template-columns:repeat(2,1fr);}
}
@media(max-width:520px){
  .wp-stats-strip{grid-template-columns:1fr;}
  .wp-why-grid{grid-template-columns:1fr;}
  .wp-villages-grid{grid-template-columns:repeat(2,1fr);}
  .wp-impact-grid{grid-template-columns:1fr;}
  .wp-steps-grid{grid-template-columns:1fr;}
}