/* ============================================================
   home.css — apex homepage (helpsenteres.in) only.
   Loaded from head.php when $ctx['mode'] === 'hub'.
   Everything is scoped under body.is-hub so brand subdomains
   (body.is-brand) are completely unaffected.
   Palette: Dark Gray #1F2937 / Red #DC2626 / Amber #F59E0B
   Type: Poppins (headings) + Inter (body)
   ============================================================ */

body.is-hub{
  --h-ink:#1F2937;--h-ink-2:#111827;--h-red:#DC2626;--h-red-d:#B91C1C;
  --h-amber:#F59E0B;--h-paper:#ffffff;--h-mist:#F9FAFB;--h-mist-2:#F3F4F6;
  --h-line:#E5E7EB;--h-muted:#6B7280;
  --h-shadow:0 10px 30px -12px rgba(17,24,39,.18);
  --h-shadow-lg:0 24px 50px -20px rgba(17,24,39,.28);
  --h-radius:16px;
  background:var(--h-paper);color:var(--h-ink);
  font-family:Inter,-apple-system,"Segoe UI",Roboto,Arial,sans-serif;
}
body.is-hub h1,body.is-hub h2,body.is-hub h3,body.is-hub h4,body.is-hub .brand-logo{
  font-family:Poppins,Inter,-apple-system,"Segoe UI",Roboto,Arial,sans-serif;
  letter-spacing:-.02em;color:var(--h-ink-2);
}
/* dark-background regions: headings must stay light */
body.is-hub .hero h1,body.is-hub .hero h2,body.is-hub .hero h3,
body.is-hub .factband .fact b,
body.is-hub .site-footer h4{color:#fff}
body.is-hub h2{font-size:clamp(1.5rem,3.6vw,2.15rem);font-weight:700}
body.is-hub h3{font-size:1.06rem;font-weight:600}
body.is-hub .section{padding:clamp(44px,7vw,84px) 0}
body.is-hub .section.alt{background:var(--h-mist)}
body.is-hub .lead{color:var(--h-muted);font-size:1.06rem;max-width:60ch}
body.is-hub .wrap{max-width:1160px}

/* ---- section heading helper ---- */
body.is-hub .sec-head{max-width:64ch;margin-bottom:34px}
body.is-hub .sec-head .kicker{
  display:inline-block;font-family:Inter;font-weight:700;font-size:.74rem;
  letter-spacing:.13em;text-transform:uppercase;color:var(--h-red);
  padding:5px 11px;border:1px solid #F3C9C9;border-radius:999px;background:#FEF2F2;margin-bottom:12px;
}
body.is-hub .sec-head.center{margin-left:auto;margin-right:auto;text-align:center}

/* ---- buttons (override global, keep .btn-* tracking classes) ---- */
body.is-hub .btn{border-radius:12px;font-weight:600;transition:transform .12s ease,box-shadow .18s ease,background .18s ease}
body.is-hub .btn:hover{transform:translateY(-2px);filter:none}
body.is-hub .btn svg{width:17px;height:17px;flex:none}
body.is-hub .btn-book{background:var(--h-red);color:#fff;box-shadow:0 8px 20px -8px rgba(220,38,38,.6)}
body.is-hub .btn-book:hover{background:var(--h-red-d)}
body.is-hub .btn-call{background:var(--h-ink);color:#fff}
body.is-hub .btn-call:hover{background:var(--h-ink-2)}
body.is-hub .btn-wa{background:#25d366;color:#0a2a15}
body.is-hub .btn-ghost{background:transparent;color:#fff;border:1.5px solid rgba(255,255,255,.55)}
body.is-hub .btn-ghost:hover{background:rgba(255,255,255,.12)}

/* ---- header ---- */
body.is-hub .site-header{background:rgba(255,255,255,.92);backdrop-filter:saturate(1.4) blur(8px);border-bottom:1px solid var(--h-line)}
body.is-hub .header-inner{height:66px}
body.is-hub .brand-logo{font-size:1.15rem;font-weight:700;color:var(--h-ink-2)}
body.is-hub .brand-logo::before{content:"";width:12px;height:12px;border-radius:3px;background:var(--h-red);display:inline-block;transform:rotate(45deg)}
body.is-hub .header-nav a{color:var(--h-ink);font-weight:500;font-size:.95rem;position:relative;padding:4px 0}
body.is-hub .header-nav a:hover{color:var(--h-red)}
body.is-hub .header-nav a::after{content:"";position:absolute;left:0;right:100%;bottom:-2px;height:2px;background:var(--h-red);transition:right .2s ease}
body.is-hub .header-nav a:hover::after{right:0}
body.is-hub .header-call{background:var(--h-red);color:#fff;box-shadow:0 8px 18px -8px rgba(220,38,38,.6)}
body.is-hub .nav-toggle{display:inline-flex;flex-direction:column;gap:4px;background:none;border:0;padding:8px;margin-left:auto;cursor:pointer}
body.is-hub .nav-toggle span{width:22px;height:2px;background:var(--h-ink);border-radius:2px;transition:.2s}
body.is-hub .nav-toggle[aria-expanded="true"] span:nth-child(1){transform:translateY(6px) rotate(45deg)}
body.is-hub .nav-toggle[aria-expanded="true"] span:nth-child(2){opacity:0}
body.is-hub .nav-toggle[aria-expanded="true"] span:nth-child(3){transform:translateY(-6px) rotate(-45deg)}

/* ---- hero ---- */
body.is-hub .hub-hero,body.is-hub .hero.hub-hero{
  background:
    linear-gradient(180deg,rgba(17,24,39,.72),rgba(17,24,39,.86)),
    var(--hero-img,linear-gradient(135deg,#1F2937,#111827));
  background-size:cover;background-position:center;
  padding:clamp(56px,9vw,110px) 0 clamp(52px,8vw,96px);
}
body.is-hub .hero-inner{max-width:1160px}
body.is-hub .hero .eyebrow{color:var(--h-amber);opacity:1}
body.is-hub .hero h1{font-weight:800;font-size:clamp(2rem,5.4vw,3.35rem);line-height:1.1;max-width:16ch}
body.is-hub .hero .hero-sub{font-size:clamp(1rem,2vw,1.18rem);max-width:54ch;opacity:.92}
body.is-hub .hero-cta{margin-top:26px;gap:12px}
body.is-hub .hero-cta .btn{min-height:52px;padding:15px 24px}
body.is-hub .hero-strip{
  list-style:none;display:flex;flex-wrap:wrap;gap:10px 26px;margin-top:30px;
  padding-top:22px;border-top:1px solid rgba(255,255,255,.16);
  color:#E5E7EB;font-size:.92rem;font-weight:500;
}
body.is-hub .hero-strip li{display:flex;align-items:center;gap:8px}
body.is-hub .hero-strip li svg{width:18px;height:18px;flex:none;color:var(--h-amber)}

/* ---- stat / trust band ---- */
body.is-hub .factband{background:var(--h-ink);color:#fff}
body.is-hub .factband .wrap{display:grid;grid-template-columns:repeat(2,1fr);gap:22px 16px;padding-top:38px;padding-bottom:38px}
body.is-hub .fact{text-align:center}
body.is-hub .fact b{display:block;font-family:Poppins;font-weight:700;font-size:clamp(1.5rem,4vw,2.1rem);color:#fff}
body.is-hub .fact span{display:block;font-size:.86rem;color:#9CA3AF;margin-top:4px}
body.is-hub .fact b em{color:var(--h-amber);font-style:normal}
body.is-hub .fact b svg{width:34px;height:34px;vertical-align:middle}

/* ---- feature cards ---- */
body.is-hub .feat-grid{display:grid;grid-template-columns:1fr;gap:16px}
body.is-hub .feat{
  background:var(--h-paper);border:1px solid var(--h-line);border-radius:var(--h-radius);
  padding:22px;box-shadow:var(--h-shadow);transition:transform .16s ease,box-shadow .16s ease;
}
body.is-hub .feat:hover{transform:translateY(-4px);box-shadow:var(--h-shadow-lg)}
body.is-hub .feat .ic{
  width:46px;height:46px;border-radius:12px;display:grid;place-items:center;margin-bottom:14px;
  background:#FEF2F2;color:var(--h-red);
}
body.is-hub .feat .ic svg{width:24px;height:24px}
body.is-hub .feat h3{margin-bottom:6px}
body.is-hub .feat p{color:var(--h-muted);font-size:.95rem;margin:0}

/* ---- service cards ---- */
body.is-hub #services .grid-3{gap:22px}
body.is-hub .service-card{
  border:1px solid var(--h-line);border-radius:var(--h-radius);box-shadow:var(--h-shadow);
  transition:transform .16s ease,box-shadow .16s ease;overflow:hidden;
}
body.is-hub .service-card:hover{transform:translateY(-4px);box-shadow:var(--h-shadow-lg)}
body.is-hub .service-card .card-media{background:var(--h-mist-2);position:relative}
body.is-hub .service-card .card-media img{aspect-ratio:16/10}
body.is-hub .service-card .card-media::after{
  content:"";position:absolute;inset:0;background:linear-gradient(180deg,transparent 55%,rgba(17,24,39,.14));
}
body.is-hub .service-card .card-body h3{font-size:1.12rem}
body.is-hub .service-card .card-body>p{color:var(--h-muted);font-size:.95rem}
body.is-hub .service-card details{margin-top:10px;font-size:.9rem}
body.is-hub .service-card summary{color:var(--h-red);font-weight:600}
body.is-hub .service-card .card-actions{gap:8px;margin-top:16px}
body.is-hub .service-card .card-actions{grid-template-columns:1fr 1fr}
body.is-hub .service-card .card-actions .btn-book{grid-column:1/-1}

/* ---- appliance tiles ---- */
body.is-hub .tile{border:1px solid var(--h-line);border-radius:14px;box-shadow:var(--h-shadow);transition:transform .16s ease}
body.is-hub .tile:hover{transform:translateY(-3px)}
body.is-hub .tile img{aspect-ratio:4/3;border-radius:10px}
body.is-hub .tile h3{font-size:1rem;margin-top:4px}
body.is-hub .tile .chip{background:var(--h-mist-2);border-color:var(--h-line);color:var(--h-muted)}

/* ---- steps / how it works ---- */
body.is-hub .steps{counter-reset:s;gap:16px}
body.is-hub .steps li{
  background:var(--h-paper);border:1px solid var(--h-line);border-radius:14px;
  padding:20px 20px 20px 66px;box-shadow:var(--h-shadow);
}
body.is-hub .steps li .step-n{
  left:18px;top:18px;width:34px;height:34px;background:var(--h-red);color:#fff;font-family:Poppins;
}
body.is-hub .steps li strong{font-family:Poppins;font-weight:600;font-size:1.02rem}
body.is-hub .steps li p{color:var(--h-muted);font-size:.94rem;margin:2px 0 0}

/* ---- why-choose feature list ---- */
body.is-hub #why .feature{
  background:var(--h-paper);border:1px solid var(--h-line);border-radius:14px;padding:20px;
  box-shadow:var(--h-shadow);
}
body.is-hub #why .feature h3{color:var(--h-ink-2);display:flex;align-items:center;gap:8px}
body.is-hub #why .feature h3::before{content:"";width:8px;height:8px;border-radius:2px;background:var(--h-amber);transform:rotate(45deg);flex:none}
body.is-hub #why .feature p{color:var(--h-muted);font-size:.95rem}

/* ---- areas ---- */
body.is-hub .area-list li{
  background:var(--h-paper);border:1px solid var(--h-line);border-radius:10px;padding:11px 13px;
  font-size:.93rem;box-shadow:0 4px 14px -10px rgba(17,24,39,.2);
}
body.is-hub .trust-grid li{background:var(--h-paper);border-color:var(--h-line)}

/* ---- about ---- */
body.is-hub #about p{color:var(--h-muted)}
body.is-hub #about .disclaimer{border-left:3px solid var(--h-line);padding-left:12px}

/* ---- FAQ accordion ---- */
body.is-hub .faq{border:1px solid var(--h-line);border-radius:12px;box-shadow:0 4px 14px -10px rgba(17,24,39,.2);transition:box-shadow .16s ease}
body.is-hub .faq[open]{box-shadow:var(--h-shadow)}
body.is-hub .faq summary{font-family:Poppins;font-weight:600;font-size:1rem;list-style:none;display:flex;justify-content:space-between;align-items:center;gap:12px}
body.is-hub .faq summary::-webkit-details-marker{display:none}
body.is-hub .faq summary::after{content:"+";font-size:1.35rem;color:var(--h-red);line-height:1;flex:none;transition:transform .2s ease}
body.is-hub .faq[open] summary::after{transform:rotate(45deg)}
body.is-hub .faq .prose{color:var(--h-muted)}

/* ---- lead form ---- */
body.is-hub #book{background:var(--h-mist);position:relative}
body.is-hub .lead-form{border:1px solid var(--h-line);border-radius:var(--h-radius);box-shadow:var(--h-shadow-lg);padding:24px}
body.is-hub .lead-form .field input,body.is-hub .lead-form .field select,body.is-hub .lead-form .field textarea{
  border:1.5px solid var(--h-line);border-radius:10px;
}
body.is-hub .lead-form .field input:focus,body.is-hub .lead-form .field select:focus,body.is-hub .lead-form .field textarea:focus{
  outline:3px solid rgba(220,38,38,.18);border-color:var(--h-red);
}
body.is-hub .lead-form .btn-book.btn-lg{width:100%;background:var(--h-red)}
body.is-hub .form-trust{display:flex;flex-wrap:wrap;gap:8px 16px;margin:0 0 16px;padding:0;list-style:none;font-size:.85rem;color:var(--h-muted)}
body.is-hub .form-trust li{display:flex;align-items:center;gap:6px}
body.is-hub .form-trust li svg{width:15px;height:15px;color:#16A34A;flex:none}

/* ---- testimonials / reviews ---- */
body.is-hub #reviews .review-grid{gap:20px}
body.is-hub .review-card{
  margin:0;background:var(--h-paper);border:1px solid var(--h-line);border-radius:var(--h-radius);
  box-shadow:var(--h-shadow);padding:24px;display:flex;flex-direction:column;gap:12px;
  transition:transform .16s ease,box-shadow .16s ease;
}
body.is-hub .review-card:hover{transform:translateY(-4px);box-shadow:var(--h-shadow-lg)}
body.is-hub .review-card .stars{color:var(--h-amber);font-size:1rem;letter-spacing:3px;line-height:1}
body.is-hub .review-card .stars .off{color:var(--h-line)}
body.is-hub .review-card blockquote{margin:0;color:var(--h-ink);font-size:.98rem;line-height:1.6}
body.is-hub .review-card blockquote::before{content:"\201C";color:var(--h-red);font-family:Poppins;font-weight:700;font-size:1.5rem;line-height:0;margin-right:1px}
body.is-hub .review-card figcaption{margin-top:auto;padding-top:6px;font-family:Poppins;font-weight:600;font-size:.92rem;color:var(--h-ink-2)}
body.is-hub .review-card figcaption .r-area{color:var(--h-muted);font-weight:500}

/* ---- footer (shared partial — light touch via is-hub hook) ---- */
body.is-hub .site-footer{background:var(--h-ink-2)}

/* ---- scroll reveal ---- */
body.is-hub [data-reveal]{opacity:0;transform:translateY(18px);transition:opacity .5s ease,transform .5s ease}
body.is-hub [data-reveal].in{opacity:1;transform:none}
@media(prefers-reduced-motion:reduce){body.is-hub [data-reveal]{opacity:1;transform:none}}

/* ---- responsive ---- */
@media(max-width:699px){
  body.is-hub .header-nav{
    position:absolute;top:66px;left:0;right:0;background:#fff;border-bottom:1px solid var(--h-line);
    flex-direction:column;gap:0;padding:6px 18px 14px;box-shadow:var(--h-shadow);
    display:none;
  }
  body.is-hub .header-nav.open{display:flex}
  body.is-hub .header-nav a{padding:12px 0;border-bottom:1px solid var(--h-mist-2);font-size:1rem}
  body.is-hub .header-nav a::after{display:none}
  body.is-hub .header-call{display:none}
}
@media(min-width:700px){
  body.is-hub .nav-toggle{display:none}
  body.is-hub .feat-grid{grid-template-columns:repeat(3,1fr)}
  body.is-hub .factband .wrap{grid-template-columns:repeat(4,1fr);gap:24px}
  body.is-hub .hero-cta .btn{padding:15px 28px}
}
@media(min-width:1000px){
  body.is-hub .feat-grid{gap:22px}
  body.is-hub .hero h1{font-size:clamp(2.4rem,4.6vw,3.5rem)}
}