/* ── How it works page (single-screen sales layout) ───────────────────────── */

/* Bigger, readable hero sub (overrides the .75rem global). */
.hiw-hero{padding:32px 32px 28px}
.hiw-hero h1{margin-bottom:12px}
.hiw-hero .hero-sub{font-size:1rem;line-height:1.5;color:#C4A4E8;
  max-width:640px;margin:0 auto}
.hiw-hero .hiw-hero-sub-2{margin-top:8px;color:#9B8AB0;font-size:.92rem}

.hiw-wrap{max-width:920px;padding:28px 16px 40px}

/* Trust strip (compact, one row) */
.hiw-trust{list-style:none;padding:0;margin:0 0 28px;
  display:flex;flex-wrap:wrap;justify-content:center;gap:10px 26px}
.hiw-trust li{font-size:.92rem;color:#3D2D52;display:flex;align-items:center;gap:8px;
  letter-spacing:.01em;font-weight:500}
.hiw-tick{color:#8B5CF6;font-weight:600}
.hiw-trust-upsell{color:#8B5CF6;text-decoration:none;font-weight:500;
  font-size:.82rem;margin-left:4px;transition:color .15s}
.hiw-trust-upsell:hover{color:#542C9E;text-decoration:underline}

/* 3-step row */
.hiw-steps{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin:0 0 24px}
.hiw-step{background:#fff;border:1px solid #E8E0F2;border-radius:14px;
  padding:22px 20px;
  box-shadow:0 1px 2px rgba(30,10,46,.04),0 4px 16px rgba(30,10,46,.04)}
.hiw-step-num{font-size:10px;letter-spacing:.16em;text-transform:uppercase;
  color:#7C3AED;font-weight:600;margin-bottom:10px}
.hiw-step-h{font-family:'DM Sans',sans-serif;font-size:1.1rem;font-weight:500;
  color:#1A1140;letter-spacing:-.01em;line-height:1.3;margin:0 0 10px}
.hiw-step-body{font-size:.92rem;line-height:1.5;color:#3D2D52;margin:0}

/* CTA row under the steps */
.hiw-cta-row{text-align:center;margin:0 0 28px}
.hiw-btn-primary{display:inline-block;background:#1A1140;color:#FAF8FF;
  font-size:.98rem;font-weight:500;letter-spacing:.01em;
  padding:14px 32px;border-radius:10px;text-decoration:none;
  transition:background .15s ease,transform .15s ease;
  box-shadow:0 2px 8px rgba(30,10,46,.18)}
.hiw-btn-primary:hover{background:#3D1F5F;transform:translateY(-1px)}

/* Capability chip block (label above, chips wrapping below) */
.hiw-depth-row{margin:0 0 22px;text-align:center}
.hiw-depth-label{font-size:10px;letter-spacing:.16em;text-transform:uppercase;
  color:#8B5CF6;font-weight:600;margin-bottom:12px}
.hiw-chips{list-style:none;padding:0;margin:0;display:flex;flex-wrap:wrap;
  gap:6px;justify-content:center}
.hiw-chips li{font-size:.78rem;color:#3D2D52;background:#F6F1FB;
  border:1px solid #E8E0F2;border-radius:999px;padding:6px 12px;
  letter-spacing:.01em;font-weight:500}

/* Closing positioning line */
.hiw-positioning{text-align:center;font-size:.95rem;color:#3D2D52;
  margin:0;line-height:1.5;font-weight:500}
.hiw-positioning-2{margin-top:6px}

/* Founder section ("Why I built this") - the story, in reading mode */
.hiw-founder{display:flex;gap:26px;align-items:flex-start;
  background:#fff;border:1px solid #E8E0F2;border-radius:16px;
  padding:28px 30px;margin:8px 0 0;
  box-shadow:0 1px 2px rgba(30,10,46,.04),0 4px 16px rgba(30,10,46,.05)}
.hiw-founder-photo{flex-shrink:0;width:120px;height:120px;border-radius:50%;
  overflow:hidden;display:flex;align-items:center;justify-content:center;
  background:linear-gradient(135deg,#542C9E 0%,#3D1E7A 100%);border:3px solid #C4A4E8}
.hiw-founder-photo img{width:100%;height:100%;object-fit:cover;display:block}
.hiw-founder-monogram{width:100%;height:100%;display:flex;align-items:center;
  justify-content:center;color:#FAF8FF;font-family:'DM Serif Display',serif;
  font-style:italic;font-size:3rem}
.hiw-founder-body{min-width:0}
.hiw-founder-eyebrow{font-size:10px;letter-spacing:.16em;text-transform:uppercase;
  color:#8B5CF6;font-weight:600;margin-bottom:8px}
.hiw-founder-name{font-family:'DM Serif Display',serif;font-style:italic;
  font-weight:400;font-size:1.5rem;color:#1A1140;margin:0 0 12px;line-height:1.1}
.hiw-founder-text{font-size:.95rem;line-height:1.6;color:#3D2D52;margin:0 0 12px}
.hiw-founder-text:last-of-type{margin-bottom:18px}
.hiw-founder-link{display:inline-flex;align-items:center;gap:8px;
  background:#542C9E;color:#FAF8FF;font-size:.9rem;font-weight:500;
  letter-spacing:.01em;padding:11px 20px;border-radius:10px;text-decoration:none;
  transition:background .15s,transform .15s}
.hiw-founder-link svg{color:#A9E5B8}
.hiw-founder-link:hover{background:#3D1F5F;transform:translateY(-1px)}

/* Closing CTA */
.hiw-cta-row-2{margin-top:32px}

/* Link out to the dedicated FAQ page */
.hiw-faq-link{text-align:center;font-size:.9rem;color:#6B5A80;
  margin:18px 0 0}
.hiw-faq-link a{color:#542C9E;font-weight:500;text-decoration:underline;
  text-underline-offset:2px}

/* Tablet */
@media (max-width:880px){
  .hiw-steps{grid-template-columns:1fr;gap:12px}
}

/* Mobile */
@media (max-width:640px){
  .hiw-hero{padding:24px 20px 22px}
  .hiw-wrap{padding-top:20px}
  .hiw-trust{gap:8px 16px;margin-bottom:22px}
  .hiw-trust li{font-size:.85rem}
  .hiw-step{padding:18px 18px}
  .hiw-step-h{font-size:1.05rem}
  .hiw-btn-primary{display:block;text-align:center}
  .hiw-founder{flex-direction:column;align-items:center;text-align:center;
    padding:24px 20px;gap:18px}
  .hiw-founder-photo{width:96px;height:96px}
}
