.hiw-page { --brand:#D64A2B; --ink:#1a1a1a; --muted:#6b7280; --bg:#fff; --card:#ffffff; --line:#ececec; --chip:#faf7f6;}
.hiw-page { font-family: Inter, system-ui, -apple-system, Segoe UI, Roboto, "Helvetica Neue", Arial, "Noto Sans", "Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol"; color:var(--ink); background:var(--bg); line-height:1.6; }
.hiw-page * { box-sizing: border-box; }

.hiw-wrap { max-width: 1100px; margin: 0 auto; padding: 24px; }

/* HERO */
.hiw-hero { position: relative; padding: 56px 0 28px; text-align: center; }
.hiw-logo { height: 56px; width:auto; margin: 0 auto 18px; display:block; }
.hiw-badge { display:inline-flex; align-items:center; gap:.5rem; padding:.35rem .65rem; border-radius:999px; background:var(--chip); color:var(--brand); border:1px solid #f0e7e5; font-weight:600; font-size:.82rem; }
.hiw-title { font-size: clamp(1.6rem, 2.4vw + 1rem, 2.8rem); line-height:1.15; margin:14px 0 10px; font-weight:800; letter-spacing:-.02em; }
.hiw-sub { color:var(--muted); font-size:1.05rem; max-width: 760px; margin: 0 auto; }
.hiw-ctaRow { margin-top: 22px; display:flex; justify-content:center; gap:12px; flex-wrap:wrap; }
.hiw-btn { appearance:none; border:none; cursor:pointer; font-weight:700; border-radius:14px; padding:12px 18px; }
.hiw-btn.primary { background:var(--brand); color:#fff; }
.hiw-btn.ghost { background:#fff; color:var(--brand); border:1px solid #f0e7e5; }

/* SECTION HEADER */
.hiw-section { padding: 28px 0; }
.hiw-section + .hiw-section { border-top:1px solid var(--line); }
.hiw-h2 { font-size:1.5rem; margin:0 0 10px; letter-spacing:-.01em; }
.hiw-lead { color:var(--muted); margin:0 0 18px; }

/* 3-UP audience cards */
.hiw-grid { display:grid; grid-template-columns: repeat(3, 1fr); gap:16px; }
@media (max-width: 960px){ .hiw-grid { grid-template-columns: 1fr; } }
.hiw-card { background:var(--card); border:1px solid var(--line); border-radius:18px; padding:18px; }
.hiw-chip { display:inline-block; font-weight:700; font-size:.78rem; letter-spacing:.02em; color:var(--brand); background:var(--chip); border:1px solid #f0e7e5; padding:.35rem .6rem; border-radius:999px; }
.hiw-card h3 { margin:10px 0 8px; font-size:1.15rem; letter-spacing:-.01em; }
.hiw-card ul { margin: 10px 0 0 1rem; padding:0; }
.hiw-card li { margin: .4rem 0; }

/* Steps */
.hiw-steps { counter-reset: step; display:grid; gap:12px; }
.hiw-step { display:flex; gap:12px; align-items:flex-start; padding:14px; background:#fff; border:1px dashed var(--line); border-radius:14px; }
.hiw-step:before { counter-increment: step; content: counter(step); width:34px; height:34px; display:grid; place-items:center; border-radius:999px; background:var(--brand); color:#fff; font-weight:800; }
.hiw-step h4 { margin:0 0 4px; font-size:1.05rem; }

/* Benefits row */
.hiw-benefits { display:grid; grid-template-columns: repeat(3, 1fr); gap:12px; }
@media (max-width: 960px){ .hiw-benefits { grid-template-columns: 1fr; } }
.hiw-benefit { border:1px solid var(--line); border-radius:14px; padding:16px; background:linear-gradient(180deg, #fff, #fff 60%, #fff0); }
.hiw-benefit img { width: 100px; height: auto; display: block; margin-bottom: 15px; }
.hiw-benefit strong { color:var(--brand); }

/* FAQ (scoped accordion) */
.hiw-faq { border:1px solid var(--line); border-radius:16px; overflow:hidden; }
.hiw-faq-item + .hiw-faq-item { border-top:1px solid var(--line); }
.hiw-faq-btn { width:100%; text-align:left; padding:14px 16px; font-weight:600; background:#fff; border:0; cursor:pointer; display:flex; justify-content:space-between; align-items:center; }
.hiw-faq-btn span { color:var(--muted); font-weight:500; }
.hiw-faq-content { display:none; padding:0 16px 16px; color:#333; }
.hiw-faq-item.is-open .hiw-faq-content { display:block; }

/* Final CTA */
.hiw-cta { margin-top: 10px; background: radial-gradient(600px 200px at 50% -50%, #f8e7e3 0%, transparent 70%) #fff; border:1px solid var(--line); border-radius:18px; padding:22px; text-align:center; }
.hiw-cta h3 { margin:0 0 6px; font-size:1.3rem; }
.hiw-cta p { margin:0 0 14px; color:var(--muted); }

/* --- HIW: full-width hero (scoped) --- */
.hiw-page .hiw-hero-banner{
  position:relative;
  width:100%;
  min-height: clamp(280px, 48vh, 560px);
  display:grid;
  place-items:center;
  overflow:hidden;
  isolation:isolate;
}
.hiw-page .hiw-hero-media{
  position:absolute; inset:0;
}
.hiw-page .hiw-hero-media picture,
.hiw-page .hiw-hero-media img{
  position:absolute; inset:0;
  width:100%; height:100%;
  object-fit:cover;
}
.hiw-page .hiw-hero-overlay{
  position:absolute; inset:0;
  background:
    linear-gradient(180deg, #ffffffcc 0%, #ffffffb0 28%, #ffffff88 55%, #ffffff40 75%, #ffffff1a 100%);
  /* subtle brand tint in corners */
  box-shadow: inset 0 -120px 220px -80px rgba(214,74,43,.18);
}
.hiw-page .hiw-hero-content{
  position:relative; z-index:1;
  text-align:center;
  padding: clamp(16px, 4vw, 36px);
  max-width: min(1100px, 92vw);
  margin-inline:auto;
  color:#1a1a1a;
}
.hiw-page .hiw-hero-logo{
  height: clamp(40px, 8vw, 72px);
  width:auto; margin: 0 auto 10px; display:block;
}
.hiw-page .hiw-hero-title{
  font-weight:800; letter-spacing:-.02em;
  font-size: clamp(1.4rem, 3.6vw, 2.6rem);
  margin: 6px 0 6px;
}
.hiw-page .hiw-hero-sub{
  font-size: clamp(.95rem, 1.6vw, 1.1rem);
  color:#4b5563; /* muted */
  margin:0 auto;
  max-width: 68ch;
}
.hiw-page .hiw-hero-chip{
  display:inline-block;
  margin-bottom:10px;
  font-weight:700; font-size:.8rem; letter-spacing:.02em;
  color:#D64A2B;
  background:#faf7f6;
  border:1px solid #f0e7e5;
  padding:.35rem .6rem; border-radius:999px;
}