/* ============================================================
   HOME PAGE — page-specific styles
   home-page.css
   ============================================================ */

/* HERO */
.hp-hero { background: linear-gradient(160deg, #07152b 0%, #0d2d5e 55%, #1e3a8a 100%)!important; position: relative!important; overflow: hidden!important; padding: 48px 5% 0!important; max-width: 100%!important; }
.hp-hero::before { content: ''!important; position: absolute!important; inset: 0!important; background: radial-gradient(ellipse at 75% 40%, rgba(59,130,246,.15) 0%, transparent 60%)!important; pointer-events: none!important; }
.hp-hero-inner { max-width: 1440px!important; margin: 0 auto!important; position: relative!important; z-index: 1!important; }

.hp-hero-body { display: grid!important; grid-template-columns: 1fr min(380px, 32%)!important; gap: 48px!important; align-items: start!important; }

/* LEFT */
.hp-hero-left { padding-bottom: 40px!important; }
.hp-hero-pill { display: inline-flex!important; align-items: center!important; gap: 8px!important; background: rgba(255,255,255,.12)!important; border: 1px solid rgba(255,255,255,.2)!important; border-radius: 999px!important; padding: 5px 14px!important; font-family: 'DM Sans', sans-serif!important; font-size: .78rem!important; font-weight: 600!important; color: rgba(255,255,255,.85)!important; letter-spacing: .06em!important; text-transform: uppercase!important; margin: 0 0 18px!important; }
.hp-hero-pill-dot { width: 7px!important; height: 7px!important; border-radius: 50%!important; background: #60a5fa!important; flex-shrink: 0!important; animation: msPillPulse 2s ease-in-out infinite!important; }
@keyframes msPillPulse { 0%,100%{opacity:1!important;transform:scale(1)} 50%{opacity:.5!important;transform:scale(.85)} }

.hp-hero-h1 { text-transform: none!important; font-family: 'Cormorant Garamond', Georgia, serif !important; font-size: 3.2rem!important; font-weight: 600 !important; color: #fff !important; line-height: 1.15!important; margin: 0 0 18px!important; }
.hp-hero-h1 em { font-style: italic !important; color: #fff !important; }
.hp-hero-h1-gold { color: #c9a84c !important; font-style: normal !important; }

.hp-hero-text { font-family: 'DM Sans', sans-serif!important; font-size: 1.05rem!important; color: rgba(255,255,255,.7)!important; line-height: 1.7!important; margin: 0 0 24px!important; max-width: 540px!important; }
.hp-hero-text strong { color: #fff!important; font-weight: 600!important; }

.hp-hero-btns { display: flex!important; align-items: center!important; gap: 12px!important; flex-wrap: wrap!important; margin-bottom: 28px!important; }
.hp-hero-btn-ghost { display: inline-flex!important; align-items: center!important; gap: 8px!important; padding: 12px 22px!important; border-radius: 8px!important; font-family: 'DM Sans', sans-serif!important; font-size: 0.95rem!important; font-weight: 500!important; color: rgba(255,255,255,.85) !important; text-decoration: none !important; background: rgba(255,255,255,.08)!important; border: 1px solid rgba(255,255,255,.2)!important; transition: background .2s!important; white-space: nowrap!important; }
.hp-hero-btn-ghost:hover { background: rgba(255,255,255,.15)!important; color: #fff !important; }

/* STATS — horizontal row with dividers */
.hp-hero-stats { display: flex!important; flex-direction: row!important; flex-wrap: nowrap!important; gap: 0!important; border-top: 1px solid rgba(255,255,255,.1)!important; padding-top: 24px!important; justify-content: center!important; }
.hp-hero-stat { display: flex!important; flex-direction: column!important; gap: 3px!important; padding-right: 20px!important; margin-right: 20px!important; border-right: 1px solid rgba(255,255,255,.12)!important; }
.hp-hero-stat:last-child { border-right: none!important; padding-right: 0!important; margin-right: 0!important; }
.hp-hero-stat-val { font-family: 'DM Sans', sans-serif!important; font-size: 1.4rem!important; font-weight: 700!important; color: #fff!important; line-height: 1!important; white-space: nowrap!important; }
.hp-hero-stat-desc { font-family: 'DM Sans', sans-serif!important; font-size: 0.68rem!important; font-weight: 600!important; text-transform: uppercase!important; letter-spacing: .07em!important; color: rgba(255,255,255,.4)!important; white-space: normal!important; }

/* RIGHT */
.hp-hero-right { position: relative!important; align-self: start!important; display: flex!important; flex-direction: column!important; }
.hp-hero-photo-wrap { position: relative!important; border-radius: 16px 16px 0 0!important; overflow: hidden!important; flex: 1!important; min-height: 0!important; }
.hp-hero-photo-wrap img { width: 100%!important; height: 100%!important; object-fit: cover!important; object-position: top center!important; display: block!important; border-radius: 16px 16px 0 0!important; max-height: 440px!important; }
.hp-hero-badge-top { position: absolute!important; top: 14px!important; right: 14px!important; background: rgba(34,197,94,.2)!important; border: 1px solid rgba(34,197,94,.45)!important; backdrop-filter: blur(8px)!important; -webkit-backdrop-filter: blur(8px)!important; color: #14532d!important; text-shadow: none!important; font-family: 'DM Sans', sans-serif!important; font-size: 0.75rem!important; font-weight: 700!important; padding: 6px 12px!important; border-radius: 999px!important; white-space: nowrap!important; }

.hp-hero-card { background: rgba(255,255,255,.12)!important; border: 1px solid rgba(255,255,255,.2)!important; backdrop-filter: blur(12px)!important; -webkit-backdrop-filter: blur(12px)!important; border-radius: 0 0 14px 14px!important; padding: 10px 14px!important; position: relative!important; z-index: 2!important; }
.hp-hero-card-name { font-family: 'Cormorant Garamond', Georgia, serif!important; font-size: 1.15rem!important; font-weight: 600!important; color: #fff!important; margin: 0 0 2px!important; }
.hp-hero-card-creds { font-family: 'DM Sans', sans-serif!important; font-size: 0.75rem!important; color: #93c5fd!important; font-weight: 600!important; margin: 0 0 2px!important; word-break: break-word!important; overflow-wrap: break-word!important; }
.hp-hero-card-role { font-family: 'DM Sans', sans-serif!important; font-size: 0.8rem!important; color: rgba(255,255,255,.7)!important; margin: 0 0 2px!important; }
.hp-hero-card-stars { font-family: 'DM Sans', sans-serif!important; font-size: 0.8rem!important; color: #FFB400!important; margin: 6px 0 0!important; display: flex!important; align-items: center!important; gap: 6px!important; }
.hp-hero-card-stars span { color: rgba(255,255,255,.6)!important; }
.hp-hero-card-note { font-family: 'DM Sans', sans-serif!important; font-size: 0.75rem!important; color: rgba(255,255,255,.6)!important; margin: 3px 0 0!important; display: flex!important; align-items: center!important; gap: 5px!important; }
.hp-hero-card-note::before { content: '✓'!important; color: #4ade80!important; font-weight: 700!important; }

/* REASONS BAR */
.hp-hero-reasons-bar { display: flex!important; align-items: center!important; flex-wrap: wrap!important; gap: 8px!important; padding: 20px 0 32px!important; border-top: 1px solid rgba(255,255,255,.1)!important; margin-top: 12px!important; }
.hp-hero-reasons-label { font-family: 'DM Sans', sans-serif!important; font-size: 0.75rem!important; font-weight: 700!important; text-transform: uppercase!important; letter-spacing: .08em!important; color: rgba(255,255,255,.45)!important; white-space: nowrap!important; margin-right: 4px!important; }
.hp-hero-chip { font-family: 'DM Sans', sans-serif!important; font-size: 0.82rem!important; color: rgba(255,255,255,.75) !important; text-decoration: none !important; background: rgba(255,255,255,.08)!important; border: 1px solid rgba(255,255,255,.15)!important; border-radius: 999px!important; padding: 4px 12px!important; transition: background .2s, color .2s!important; white-space: nowrap!important; }
.hp-hero-chip:hover { background: rgba(255,255,255,.16)!important; color: #fff !important; }

/* CREDENTIALS BAR */
.hp-hero-creds-bar { display: flex!important; align-items: center!important; flex-wrap: wrap!important; gap: 6px 24px!important; padding: 16px 0!important; border-top: 1px solid rgba(255,255,255,.08)!important; justify-content: center!important; }
.hp-hero-creds-bar span { font-family: 'DM Sans', sans-serif!important; font-size: 0.78rem!important; color: rgba(255,255,255,.5)!important; display: flex!important; align-items: center!important; gap: 6px!important; }
.hp-hero-creds-bar svg { flex-shrink: 0!important; color: rgba(255,255,255,.4)!important; }

/* RESPONSIVE */
@media (max-width: 1024px) {
  .hp-hero-right { display: none!important; }
  .hp-hero-body { grid-template-columns: 1fr!important; }
}
@media (max-width: 600px) {
  .hp-hero-body { grid-template-columns: 1fr!important; }
  .hp-hero-right { flex-direction: row!important; align-items: flex-end!important; gap: 20px!important; }
  .hp-hero-photo-wrap { max-width: 260px!important; border-radius: 16px!important; }
  .hp-hero-photo-wrap img { border-radius: 16px!important; max-height: 300px!important; }
  .hp-hero-card { border-radius: 14px!important; flex: 1!important; }
  .hp-hero-h1 { font-size: 2.8rem!important; }
  .hp-hero-stat-desc { white-space: normal!important; }
}
@media (max-width: 600px) {
  .hp-hero { padding: 40px 4% 24px!important; }
  .hp-hero-photo-wrap { display: none!important; }
  .hp-hero-right { display: block!important; }
  .hp-hero-card { display: none!important; }
  .hp-hero-btns { flex-direction: column!important; align-items: stretch!important; }
  .hp-hero-btns .ms-btn-orange, .hp-hero-btns .hp-hero-btn-ghost { width: 100%!important; justify-content: center!important; }
  .hp-hero-reasons-bar { flex-wrap: wrap!important; }
  .hp-hero-creds-bar { display: none!important; }
  .hp-hero-stats { display: grid!important; grid-template-columns: 1fr 1fr!important; gap: 12px!important; padding-top: 16px!important; margin-bottom: 0!important; }
  .hp-hero-stat { padding-right: 0 !important; margin-right: 0 !important; border-right: none !important; align-items: center!important; text-align: center!important; }
  .hp-hero-stat-val { font-size: 1.2rem!important; }
  .hp-hero-left { padding-bottom: 0!important; }
  .hp-hero-right { margin-top: 0!important; }
  .hp-hero-card { margin-top: 0!important; }
  .hp-hero-creds-bar { gap: 6px 16px!important; }

  /* ALL buttons full width on mobile */
  .hp-loc-btns { flex-direction: column!important; }
  .ms-btn-orange,
  .ms-btn-navy,
  .ms-btn-white,
  .ms-btn-outline,
  .ms-btn-outline-light,
  .ms-btn-whatsapp,
  .hp-hero-btn-ghost { width: 100% !important; box-sizing: border-box!important; justify-content: center!important; text-align: center!important; }

  /* Exceptions — buttons inside symptom checker JS widget stay auto */
  .sc-cta-btns .ms-btn-navy { width: auto !important; }

  /* about / second opinion inline buttons */
  a.ms-btn-navy[style*="display:inline-flex"],
  a.ms-btn-white[style*="display:inline-flex"],
  a.ms-btn-outline-light[style*="display:inline-flex"] { display: flex !important; }
}

/* ABOUT GRID */
.hp-about-grid { display: grid!important; grid-template-columns: 480px 1fr!important; gap: 56px!important; align-items: start!important; }
.hp-about-photo { position: relative!important; }
.hp-about-photo img { width: 100%!important; border-radius: 16px!important; display: block!important; }
.hp-about-badge { position: absolute!important; bottom: 20px!important; right: -16px!important; background: var(--ms-navy)!important; color: white!important; border-radius: 12px!important; padding: 14px 20px!important; text-align: center!important; box-shadow: 0 8px 24px rgba(30,58,138,0.3)!important; }
.hp-ab-num { font-family: 'Cormorant Garamond', serif!important; font-size: 2rem!important; font-weight: 700!important; display: block!important; line-height: 1!important; }
.hp-ab-lbl { font-family: 'DM Sans', sans-serif!important; font-size: 0.72rem!important; color: rgba(255,255,255,0.75)!important; display: block!important; margin-top: 4px!important; }
.hp-cred-tags { display: flex!important; flex-wrap: wrap!important; gap: 8px!important; margin-top: 20px!important; }
.hp-cred-tags .ms-badge { background: var(--ms-bg)!important; color: var(--ms-navy)!important; border: 1px solid var(--ms-border)!important; }

/* WHO IS THIS FOR — white cards, equal height */
.hp-who-grid { display: grid!important; grid-template-columns: repeat(3, 1fr)!important; gap: 24px!important; margin-top: 36px!important; }
.hp-who-card { background: #fff!important; border: 1.5px solid var(--ms-border)!important; border-radius: 16px!important; padding: 28px 24px!important; display: flex!important; flex-direction: column!important; transition: border-color 0.2s, box-shadow 0.2s, transform 0.15s!important; }
.hp-who-card:hover { border-color: var(--ms-navy)!important; box-shadow: 0 4px 18px rgba(30,58,138,0.1)!important; transform: translateY(-2px)!important; }
.hp-who-icon { font-size: 2rem!important; margin-bottom: 16px!important; }
.hp-who-card h3 { text-transform: none!important; font-family: 'DM Sans', sans-serif!important; font-size: 1.05rem!important; font-weight: 700!important; color: var(--ms-navy)!important; margin: 0 0 10px!important; }
/* Global card body text size — change here to affect all hp-* cards */
.hp-who-card p,
.hp-diff-item p,
.hp-cond-card p,
.hp-pf-item span { font-size: 1rem!important; line-height: 1.65!important; }
.hp-who-card p { font-family: 'DM Sans', sans-serif!important; color: var(--ms-text)!important; margin: 0!important; flex: 1!important; }
.hp-who-link { display: inline-block!important; margin-top: 20px!important; font-family: 'DM Sans', sans-serif!important; font-size: 0.88rem!important; font-weight: 700!important; color: var(--ms-navy)!important; text-decoration: none!important; }
.hp-who-link:hover { text-decoration: underline!important; }

/* SECOND OPINION BANNER */
.hp-so-grid { display: grid!important; grid-template-columns: 1fr 280px!important; gap: 56px!important; align-items: center!important; }
.hp-so-stat-box { background: rgba(255,255,255,0.06)!important; border: 1px solid rgba(255,255,255,0.12)!important; border-radius: 16px!important; padding: 36px 28px!important; text-align: center!important; display: flex!important; flex-direction: column!important; align-items: center!important; }
.hp-so-stat { font-family: 'Cormorant Garamond', serif!important; font-size: 3.5rem!important; font-weight: 700!important; color: white!important; line-height: 1!important; display: block!important; }
.hp-so-stat-lbl { font-family: 'DM Sans', sans-serif!important; font-size: 0.85rem!important; color: rgba(255,255,255,0.65)!important; line-height: 1.5!important; margin-top: 10px!important; display: block!important; }

/* PROMISE SECTION — white background */
.hp-promise-grid { display: grid!important; grid-template-columns: 1fr 1fr!important; gap: 56px!important; align-items: start!important; }
.hp-promise-eyebrow { display: flex!important; align-items: center!important; gap: 12px!important; margin-bottom: 16px!important; }
.hp-promise-line { width: 28px!important; height: 2px!important; background: var(--ms-border)!important; flex-shrink: 0!important; }
.hp-promise-eyebrow span { font-family: 'DM Sans', sans-serif!important; font-size: 0.71rem!important; letter-spacing: 0.16em!important; text-transform: uppercase!important; color: var(--ms-navy)!important; font-weight: 700!important; opacity: 0.6!important; }
.hp-promise-items { display: flex!important; flex-direction: column!important; gap: 10px!important; margin: 24px 0!important; }
.hp-promise-item { display: flex!important; align-items: flex-start!important; gap: 12px!important; padding: 12px 16px!important; background: var(--ms-bg)!important; border-radius: 9px!important; border-left: 3px solid var(--ms-border)!important; }
.hp-promise-item--no { background: #fff1f2!important; border-left-color: #fca5a5!important; border-radius: 0!important; }
.hp-pi-cross { font-family: 'Cormorant Garamond', serif!important; font-size: 1.2rem!important; font-weight: 700!important; color: #dc2626!important; opacity: 0.7!important; flex-shrink: 0!important; }
.hp-promise-item span { font-family: 'DM Sans', sans-serif!important; font-size: 0.9rem!important; color: var(--ms-text)!important; line-height: 1.55!important; }
.hp-promise-item span strong { color: #dc2626!important; }
.hp-promise-features { display: flex!important; flex-direction: column!important; gap: 16px!important; margin-top: 0!important; }
.hp-pf-box { background: var(--ms-bg)!important; border: 1.5px solid var(--ms-border)!important; border-radius: 14px!important; padding: 28px!important; }
.hp-pf-item { display: flex!important; gap: 14px!important; align-items: flex-start!important; }
.hp-pf-icon { background: #eff6ff!important; border: 1px solid #bfdbfe!important; border-radius: 8px!important; padding: 8px!important; font-size: 1.1rem!important; flex-shrink: 0!important; }
.hp-pf-item strong { font-family: 'DM Sans', sans-serif!important; font-size: 0.88rem!important; font-weight: 600!important; color: var(--ms-navy)!important; display: block!important; margin-bottom: 3px!important; }
.hp-pf-item span { font-family: 'DM Sans', sans-serif!important; color: var(--ms-text)!important; }

/* DIFF ITEMS */
.hp-diff-item { display: flex!important; gap: 16px!important; align-items: flex-start!important; padding: 20px!important; background: var(--ms-bg)!important; border-radius: 12px!important; border: 1px solid var(--ms-border)!important; }
.hp-di-icon { font-size: 1.5rem!important; flex-shrink: 0!important; margin-top: 2px!important; }
.hp-diff-item h3 { text-transform: none!important; font-family: 'DM Sans', sans-serif!important; font-size: 0.95rem!important; font-weight: 700!important; color: var(--ms-navy)!important; margin: 0 0 6px!important; }
.hp-diff-item p { font-family: 'DM Sans', sans-serif!important; color: var(--ms-text)!important; margin: 0!important; }

/* CONDITIONS GRID */
.hp-cond-grid { display: grid!important; grid-template-columns: repeat(4, 1fr)!important; gap: 12px!important; margin-top: 36px!important; }
.hp-cond-card { display: flex!important; align-items: center!important; gap: 12px!important; padding: 16px!important; background: white!important; border: 1.5px solid var(--ms-border)!important; border-radius: 12px!important; text-decoration: none!important; transition: border-color 0.2s, box-shadow 0.2s, transform 0.15s!important; }
.hp-cond-card:hover { border-color: var(--ms-navy)!important; box-shadow: 0 4px 14px rgba(30,58,138,0.1)!important; transform: translateY(-2px)!important; }
.hp-cond-featured { border-color: var(--ms-navy)!important; background: #f0f4ff!important; }
.hp-cond-dark { background: var(--ms-navy)!important; border-color: var(--ms-navy)!important; }
.hp-cond-card.hp-cond-dark h3, .hp-cond-card.hp-cond-dark p { text-transform: none!important; color: white !important; }
.hp-cc-icon { font-size: 1.3rem!important; flex-shrink: 0!important; }
.hp-cond-card h3 { font-family: 'DM Sans', sans-serif!important; font-size: 0.95rem!important; font-weight: 700!important; color: var(--ms-navy)!important; margin: 0 0 4px!important; text-transform: none;}
.hp-cond-card p { font-family: 'DM Sans', sans-serif!important; color: var(--ms-text)!important; margin: 0!important; }
.hp-cc-arrow { font-size: 0.9rem!important; color: var(--ms-navy)!important; margin-left: auto!important; flex-shrink: 0!important; }
.hp-cond-dark .hp-cc-arrow { color: white!important; }

/* CONTACT FORM */
.hp-form-group { display: flex!important; flex-direction: column!important; gap: 5px!important; }
.hp-form-group label { font-family: 'DM Sans', sans-serif!important; font-size: 0.85rem!important; font-weight: 600!important; color: var(--ms-navy)!important; }
.hp-form-group input, .hp-form-group select, .hp-form-group textarea { font-family: 'DM Sans', sans-serif!important; font-size: 0.9rem!important; color: var(--ms-text)!important; border: 1.5px solid var(--ms-border)!important; border-radius: 8px!important; padding: 10px 14px!important; background: var(--ms-bg)!important; outline: none!important; transition: border-color 0.15s!important; width: 100%!important; }
.hp-form-group input:focus, .hp-form-group select:focus, .hp-form-group textarea:focus { border-color: var(--ms-navy)!important; background: white!important; }
.hp-form-group textarea { resize: vertical!important; }
.hp-form-consent { display: flex!important; gap: 10px!important; align-items: flex-start!important; }
.hp-form-consent input { margin-top: 3px!important; flex-shrink: 0!important; accent-color: var(--ms-navy)!important; }
.hp-form-consent label { font-family: 'DM Sans', sans-serif!important; font-size: 0.8rem!important; color: #6b7280!important; line-height: 1.5!important; }

/* CTA BAR BUTTONS */
.hp-cta-btns { display: flex!important; gap: 10px!important; flex-wrap: wrap!important; flex-shrink: 0!important; }

/* HOW IT WORKS — 5 steps in one row */
.hp-hiw5 { display: grid!important; grid-template-columns: repeat(5, 1fr)!important; gap: 0!important; position: relative!important; }
.hp-hiw5::before { content: ''!important; position: absolute!important; top: 30px!important; left: calc(100% / 10)!important; right: calc(100% / 10)!important; height: 2px!important; background: linear-gradient(90deg, #6ee7b7, #93c5fd, #fcd34d, #6ee7b7, #93c5fd)!important; z-index: 0!important; }
.hp-hiw5 .ms-hiw-step { padding: 0 10px!important; }

/* RESPONSIVE */
@media (max-width: 1024px) {
  .hp-about-grid { grid-template-columns: 300px 1fr!important; gap: 36px!important; }
  .hp-cond-grid { grid-template-columns: repeat(3, 1fr)!important; }
}
@media (max-width: 900px) {
  .hp-so-grid { grid-template-columns: 1fr!important; }
  .hp-promise-grid { grid-template-columns: 1fr!important; }
  .hp-cond-grid { grid-template-columns: repeat(2, 1fr)!important; }
  .hp-who-grid { grid-template-columns: 1fr!important; }
  .hp-hiw5 { grid-template-columns: 1fr 1fr!important; }
  .hp-hiw5::before { display: none!important; }
}
@media (max-width: 700px) {
  .hp-hiw5 { grid-template-columns: 1fr!important; }
  .hp-hiw5 .ms-hiw-step { align-items: flex-start!important; text-align: left!important; flex-direction: row!important; gap: 16px!important; padding: 0 0 28px!important; }
  .hp-hiw5 .ms-hiw-num { margin-bottom: 0!important; flex-shrink: 0!important; }
  .hp-hiw5 .ms-hiw-step > div { display: flex!important; flex-direction: column!important; }
}
@media (max-width: 700px) {
  .hp-about-grid { grid-template-columns: 1fr!important; }
  .hp-about-badge { right: 16px!important; }
  .hp-cond-grid { grid-template-columns: 1fr 1fr!important; }
  .hp-cta-btns { flex-direction: column!important; width: 100%!important; }
  .hp-cta-btns .ms-btn-white { width: 100%!important; justify-content: center!important; }
}
@media (max-width: 480px) {
  .hp-cond-grid { grid-template-columns: 1fr!important; }
  .hp-who-grid { grid-template-columns: 1fr!important; }
}

/* PJ CHIP — two-line redesign */
.pj-chip {
  display: inline-flex !important;
  flex-direction: column!important;
  border-radius: 10px !important;
  padding: 6px 14px !important;
}
.pj-chip-label {
  font-family: 'DM Sans', sans-serif!important;
  font-size: 0.62rem!important;
  font-weight: 700!important;
  letter-spacing: 0.12em!important;
  text-transform: uppercase!important;
  color: rgba(255,255,255,0.4)!important;
  line-height: 1!important;
  margin-bottom: 3px!important;
}
.pj-chip-val {
  font-family: 'DM Sans', sans-serif!important;
  font-size: 0.82rem!important;
  font-weight: 700!important;
  color: rgba(255,255,255,0.85)!important;
  line-height: 1!important;
  white-space: nowrap!important;
}

.hp-hero-reasons-bar { min-height: 118px !important; }