@import url("styles.css");

:root {
  --navy: #4a2868;
  --blue: #6e3d91;
  --blue-dark: #512c6e;
  --orange: #ef6b86;
  --ink: #2d2335;
  --muted: #706579;
  --line: #ddd5e2;
  --paper: #fffdfb;
  --wash: #f5f0f7;
  --success: #258267;
  --shadow: 0 24px 64px rgba(74,40,104,.15);
  --radius: 28px;
}

body { color: var(--ink); background: var(--paper); font-family: Verdana, Arial, sans-serif; }
h1, h2, h3 { color: var(--ink); font-family: "Trebuchet MS", Arial, sans-serif; letter-spacing: -.04em; }
.topbar { color: #523d5e; background: #dff5eb; }
.topbar a { color: var(--navy); }
.site-header { background: rgba(255,253,251,.97); border: 0; box-shadow: 0 4px 24px rgba(74,40,104,.07); }
.nav-wrap { min-height: 88px; }
.brand { color: var(--navy); font-size: 1.08rem; }
.brand-mark { color: #fff; background: var(--navy); border-radius: 18px 18px 18px 5px; }
.nav-links > a, .nav-drop > button { color: #4e3e57; font-size: .84rem; }
.phone-btn, .primary-btn { color: #fff; background: var(--orange); border-radius: 999px; box-shadow: 0 10px 25px rgba(239,107,134,.22); }
.phone-btn:hover, .primary-btn:hover { background: #d64c6c; }
.secondary-btn { color: var(--navy); border-color: var(--navy); border-radius: 999px; }

.hero { color: var(--ink); background: #eff9f4; }
.hero::before { background: radial-gradient(circle at 10% 12%, rgba(239,107,134,.14), transparent 34%); }
.hero::after { content: ""; position: absolute; z-index: 0; width: 280px; height: 280px; left: -100px; bottom: -130px; background: #e9d8f2; border-radius: 50%; }
.hero-bg { left: auto; right: 4%; top: 8%; bottom: 8%; width: 43%; height: 84%; border-radius: 40% 12% 40% 12%; box-shadow: var(--shadow); }
.hero .container { grid-template-columns: 55% 45%; min-height: 625px; }
.hero.compact .container { min-height: 560px; }
.hero h1 { color: var(--navy); font-size: clamp(2.8rem, 5vw, 5.15rem); }
.hero.compact h1 { font-size: clamp(2.45rem, 4.3vw, 4.2rem); }
.hero-copy { color: #64576c; }
.eyebrow { color: #b53f61; }
.hero-points { color: #5f5365; }
.hero-points li::before { color: var(--success); }
.hero .secondary-btn { color: var(--navy); background: transparent; border-color: var(--navy); border-radius: 999px; }

.trust-strip { background: var(--navy); border: 0; }
.trust-item { border-color: rgba(255,255,255,.16); }
.trust-item strong { color: #fff; }
.trust-item span { color: #e5dcec; }
.section { padding-block: 96px; }
.section.alt { background: var(--wash); }
.section-intro { max-width: 760px; }
.service-card, .info-card, .step-card { border: 0; border-radius: 24px; box-shadow: 0 10px 35px rgba(74,40,104,.08); }
.service-card img { border-radius: 24px 24px 0 0; }
.info-card { background: #fff; }
.icon-box { color: #fff; background: var(--navy); border-radius: 16px 16px 16px 4px; }
.split-image { border-radius: 70px 20px; box-shadow: var(--shadow); }
.check-list li::before { background: var(--success); }
.step-card::before { background: var(--orange); }
.faq summary::after { color: var(--orange); }
.call-panel { background: linear-gradient(120deg, #4a2868, #7a4d9b); border-radius: 30px; }
.page-banner { background: linear-gradient(115deg, #4a2868, #774d92); }
.site-footer { background: #33213f; }
.site-footer .brand-mark { background: var(--orange); }
.mobile-call { background: var(--orange); border-radius: 999px; }

.home-split-hero { display: grid; grid-template-columns: 1.12fr .88fr; min-height: 690px; background: #e4f5ed; }
.home-split-photo { min-height: 690px; height: 100%; object-fit: cover; }
.home-split-copy { position: relative; overflow: hidden; display: flex; align-items: center; padding: 70px max(35px, calc((100vw - 1140px)/2)); padding-left: 65px; background: var(--navy); }
.home-split-copy::before { content: ""; position: absolute; width: 360px; height: 360px; right: -190px; top: -160px; background: var(--orange); border-radius: 50%; opacity: .65; }
.home-split-copy > div { position: relative; z-index: 1; max-width: 570px; }
.home-split-copy h1 { color: #fff; font-size: clamp(3rem, 5vw, 5.4rem); }
.home-split-copy .hero-copy { color: #e8daef; }
.home-split-copy .eyebrow { color: #8ce1bf; }
.home-split-copy .hero-points { color: #e7dced; }

.call-ribbon { display: grid; grid-template-columns: auto 1fr auto; gap: 26px; align-items: center; padding: 30px 36px; background: #dff5eb; border-radius: 24px; }
.call-ribbon-icon { width: 64px; height: 64px; display: grid; place-items: center; color: #fff; background: var(--success); border-radius: 22px 22px 22px 5px; font-size: 1.6rem; }
.call-ribbon h2 { margin: 0 0 5px; font-size: 1.75rem; }
.call-ribbon p { margin: 0; color: #536b62; }

.service-stage { display: grid; grid-template-columns: .82fr 1.18fr; min-height: 600px; overflow: hidden; background: #fff; border-radius: 32px; box-shadow: var(--shadow); }
.service-stage.reverse { grid-template-columns: 1.18fr .82fr; }
.service-stage.reverse .stage-panel { order: 2; }
.stage-panel { position: relative; overflow: hidden; min-height: 100%; padding: 48px; color: #fff; background: var(--navy); }
.stage-panel.mint { color: var(--ink); background: #dff5eb; }
.stage-panel img { position: absolute; inset: 0; height: 100%; object-fit: cover; opacity: .33; }
.stage-panel::after { content: ""; position: absolute; inset: 0; background: linear-gradient(transparent 15%, rgba(55,27,73,.88)); }
.stage-panel.mint::after { background: linear-gradient(transparent 15%, rgba(223,245,235,.94)); }
.stage-panel-content { position: relative; z-index: 2; display: flex; height: 100%; flex-direction: column; justify-content: flex-end; }
.stage-panel h2 { color: inherit; font-size: 2.7rem; }
.stage-panel p { color: inherit; opacity: .88; }
.stage-list { display: grid; align-content: center; padding: 34px 48px; }
.stage-link { display: grid; grid-template-columns: 52px 1fr auto; gap: 20px; align-items: center; padding: 24px 0; border-bottom: 1px solid var(--line); text-decoration: none; }
.stage-link:last-child { border-bottom: 0; }
.stage-link:hover h3 { color: var(--orange); }
.stage-badge { width: 46px; height: 46px; display: grid; place-items: center; color: #fff; background: var(--orange); border-radius: 50%; font-weight: 900; }
.stage-link h3 { margin: 0 0 4px; font-size: 1.28rem; transition: color .2s ease; }
.stage-link p { margin: 0; color: var(--muted); font-size: .92rem; }
.stage-arrow { color: var(--navy); font-size: 1.5rem; }

.coverage-stack { display: grid; gap: 16px; }
.coverage-link { display: grid; grid-template-columns: 90px 1fr auto; align-items: center; gap: 28px; min-height: 140px; padding: 26px 32px; color: #fff; background: var(--navy); border-radius: 26px; text-decoration: none; }
.coverage-link:nth-child(2) { background: #6e3d91; }
.coverage-link:nth-child(3) { color: var(--ink); background: #dff5eb; }
.coverage-link h3 { margin: 0 0 6px; color: inherit; font-size: 1.55rem; }
.coverage-link p { margin: 0; color: inherit; opacity: .84; }
.coverage-symbol { font-size: 2.5rem; font-weight: 900; opacity: .7; }
.coverage-arrow { font-size: 1.7rem; }

.guide-card { padding: 24px; background: #fff; border-radius: 24px; box-shadow: 0 10px 30px rgba(74,40,104,.07); }
.guide-card img { height: 190px; margin-bottom: 20px; object-fit: cover; border-radius: 18px; }
.guide-card p { color: var(--muted); }
.article-meta { color: #b53f61; font-size: .76rem; font-weight: 900; letter-spacing: .08em; text-transform: uppercase; }
.prose blockquote { margin: 28px 0; padding: 22px 26px; background: #eef8f3; border-left: 5px solid var(--success); border-radius: 0 16px 16px 0; }

@media (max-width: 920px) {
  .home-split-hero { grid-template-columns: 1fr 1fr; }
  .home-split-copy { padding-inline: 38px; }
  .call-ribbon { grid-template-columns: auto 1fr; }
  .call-ribbon .phone-btn { grid-column: 1 / -1; }
  .service-stage, .service-stage.reverse { grid-template-columns: .72fr 1.28fr; }
}

@media (max-width: 640px) {
  .home-split-hero { grid-template-columns: 1fr; }
  .home-split-photo { min-height: 330px; }
  .home-split-copy { min-height: 560px; padding: 55px 25px; }
  .hero-bg { right: 0; top: 0; width: 100%; height: 100%; opacity: .16; border-radius: 0; }
  .hero .container { grid-template-columns: 1fr; }
  .call-ribbon { grid-template-columns: 1fr; text-align: center; }
  .call-ribbon-icon { margin: 0 auto; }
  .service-stage, .service-stage.reverse { grid-template-columns: 1fr; }
  .service-stage.reverse .stage-panel { order: 0; }
  .stage-panel { min-height: 330px; padding: 28px; }
  .stage-list { padding: 15px 24px; }
  .stage-link { grid-template-columns: 42px 1fr auto; gap: 13px; }
  .stage-link p { display: none; }
  .coverage-link { grid-template-columns: 52px 1fr auto; gap: 15px; padding: 24px 20px; }
  .coverage-link p { display: none; }
}