/* ========================================
   Connie Health Partnerships — Shared Styles
   ======================================== */

/* Reset */
*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }

/* Default Variables (DM Sans pages — standard purple/navy palette) */
:root {
  --navy: #252542; --navy-mid: #45457F; --navy-light: #6A6A9F;
  --purple: #652AD0; --purple-light: #787FF6; --purple-bg: #D6D2FB;
  --purple-pale: #EEEDFB; --pink: #F9B7FF; --pink-soft: #FDE8FF;
  --body-text: #4F5B6D; --white: #fff; --off-white: #F7F7FC;
  --border: #E5E5EF; --green: #9FD96F;
  --gradient: linear-gradient(135deg, #45457F 0%, #652AD0 60%, #787FF6 100%);
}

html { scroll-behavior: smooth; }
body { font-family: 'DM Sans', sans-serif; color: var(--body-text); line-height: 1.6; background: var(--white); -webkit-font-smoothing: antialiased; }
a { text-decoration: none; color: inherit; }
.container { max-width: 1140px; margin: 0 auto; padding: 0 28px; }

/* ===== HEADER ===== */
.header { background: var(--white); border-bottom: 1px solid var(--border); position: sticky; top: 0; z-index: 100; }
.header-top { display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: 8px 16px; padding: 14px 28px; max-width: 1140px; margin: 0 auto; }
.logo { display: flex; align-items: center; gap: 9px; font-size: 1.3rem; font-weight: 700; color: var(--navy); flex-shrink: 0; }
.logo-img { height: 56px; width: auto; }
.footer-logo { height: 40px; width: auto; margin-bottom: 14px; }
.header-right { font-size: 0.83rem; color: var(--body-text); text-align: right; }
.header-right a { color: var(--purple); font-weight: 600; }

/* ===== NAV ===== */
.nav { background: var(--navy-mid); }
.nav-inner { max-width: 1140px; margin: 0 auto; display: flex; }
.nav a { color: rgba(255,255,255,.85); font-size: .88rem; font-weight: 500; padding: 13px 22px; border-bottom: 3px solid transparent; transition: .2s; }
.nav a:hover, .nav a.on { color: #fff; background: rgba(255,255,255,.07); border-bottom-color: var(--purple-light); }

/* ===== HERO ===== */
.hero { background: var(--gradient); padding: 56px 0 64px; position: relative; overflow: hidden; }
.hero::before { content:''; position: absolute; top:-80px; right:-80px; width:420px; height:420px; border-radius:50%; background:rgba(120,127,246,.14); filter:blur(70px); }
.hero .container { position:relative; z-index:2; }
.badge { display:inline-flex; align-items:center; gap:7px; background:rgba(255,255,255,.11); border:1px solid rgba(255,255,255,.18); border-radius:80px; padding:5px 14px 5px 9px; font-size:.77rem; font-weight:500; color:rgba(255,255,255,.88); margin-bottom:20px; }
.badge-dot { width:7px; height:7px; border-radius:50%; background:var(--green); }
.hero h1 { font-size:2.1rem; line-height:1.15; font-weight:700; color:#fff; margin-bottom:16px; letter-spacing:-.02em; }
.hero p { font-size:1.02rem; line-height:1.55; color:rgba(255,255,255,.78); margin-bottom:28px; }
.btn-p { display:inline-flex; align-items:center; gap:7px; background:var(--pink); color:var(--navy); font-weight:600; font-size:.93rem; padding:13px 26px; border-radius:7px; transition:.25s; cursor:pointer; border:none; }
.btn-p:hover { background:#FCC8FF; transform:translateY(-1px); box-shadow:0 6px 18px rgba(249,183,255,.28); }
.btn-s { display:inline-flex; align-items:center; gap:7px; background:rgba(255,255,255,.11); border:1px solid rgba(255,255,255,.28); color:#fff; font-weight:500; font-size:.93rem; padding:13px 26px; border-radius:7px; transition:.25s; cursor:pointer; }
.btn-s:hover { background:rgba(255,255,255,.18); }

/* ===== SECTIONS ===== */
.section { padding: 64px 0; }
.section-alt { background: var(--off-white); }
.eyebrow { font-size:.73rem; text-transform:uppercase; letter-spacing:.11em; color:var(--purple); font-weight:600; margin-bottom:10px; }
.section h2 { font-size:1.85rem; font-weight:700; color:var(--navy); line-height:1.2; margin-bottom:14px; }
.section h2 em { color:var(--purple); font-style:normal; }
.section p { font-size:.96rem; line-height:1.65; }

/* ===== CTA ===== */
.cta { background:var(--gradient); padding:56px 0; text-align:center; position:relative; overflow:hidden; }
.cta::before { content:''; position:absolute; top:-60px; left:50%; transform:translateX(-50%); width:400px; height:200px; border-radius:50%; background:rgba(249,183,255,.1); filter:blur(70px); }
.cta .container { position:relative; z-index:2; }
.cta h2 { font-size:1.8rem; color:#fff; margin-bottom:12px; font-weight:700; }
.cta p { font-size:.99rem; color:rgba(255,255,255,.78); max-width:520px; margin:0 auto 28px; }
.cta-btns { display:flex; gap:12px; justify-content:center; flex-wrap:wrap; }

/* ===== FOOTER ===== */
.footer { background:var(--navy-mid); padding:40px 0 28px; }
.footer-row { display:flex; justify-content:space-between; align-items:start; gap:32px; flex-wrap:wrap; }
.footer-brand { max-width:360px; }
.footer-brand .logo { color:#fff; margin-bottom:12px; }
.footer-brand .logo span { color:rgba(255,255,255,.55); }
.footer-brand p { font-size:.82rem; color:rgba(255,255,255,.45); line-height:1.55; }
.footer-cols { display:flex; gap:40px; }
.footer-col h4 { font-size:.74rem; text-transform:uppercase; letter-spacing:.1em; color:rgba(255,255,255,.35); font-weight:600; margin-bottom:10px; }
.footer-col a { display:block; font-size:.85rem; color:rgba(255,255,255,.65); padding:3px 0; transition:.2s; }
.footer-col a:hover { color:#fff; }
.footer-bottom { margin-top:28px; padding-top:20px; border-top:1px solid rgba(255,255,255,.08); text-align:center; }
.footer-bottom p { font-size:.74rem; color:rgba(255,255,255,.3); }

/* ===== RESPONSIVE ===== */
@media(max-width:900px){
  .footer-row { flex-direction:column; }
  .footer-cols { flex-direction:column; gap:20px; }
  .logo-img { height: 38px; }
  .header-top { padding: 10px 16px; }
  .header-right { font-size: .76rem; }
  .nav-inner { overflow-x: auto; -webkit-overflow-scrolling: touch; }
  .nav a { padding: 10px 12px; font-size: .81rem; }
  .section { padding: 40px 0; }
  .container { padding: 0 16px; }
  .section h2 { font-size: 1.5rem; }
  .cta h2 { font-size: 1.5rem; }
}
