/* ═══════════════════════════════════════════════════
   SBV — Exit Planning Page (exit.html)
   ═══════════════════════════════════════════════════ */

/* ── Hero: Light Split ── */
.hero-light { padding: 5rem 0; background: hsl(var(--card)); border-bottom: 1px solid hsl(var(--border)); position: relative; overflow: hidden; }
@media (min-width: 768px) { .hero-light { padding: 7rem 0; } }
.hero-light::before { content: ''; position: absolute; top: -200px; right: -200px; width: 600px; height: 600px; border-radius: 50%; background: hsl(var(--accent) / 0.04); pointer-events: none; }
.hero-light::after { content: ''; position: absolute; bottom: -100px; left: -100px; width: 400px; height: 400px; border-radius: 50%; background: hsl(var(--color-deep-water-hsl) / 0.03); pointer-events: none; }
.hero-light .container { position: relative; z-index: 10; }
.hero-light-inner { display: grid; gap: 3rem; align-items: center; max-width: 72rem; margin: 0 auto; }
@media (min-width: 1024px) { .hero-light-inner { grid-template-columns: 1.2fr 1fr; gap: 5rem; } }
.hero-light .eyebrow span:not(.line) { color: hsl(var(--accent)); }
.hero-light h1 { font-size: 2.25rem; color: hsl(var(--foreground)); margin-bottom: 1.25rem; }
@media (min-width: 768px) { .hero-light h1 { font-size: 3rem; } }
@media (min-width: 1024px) { .hero-light h1 { font-size: 3.5rem; } }
.hero-light .lead { font-size: 1.125rem; font-family: var(--font-body); color: hsl(var(--muted-foreground)); line-height: 1.625; }
@media (min-width: 768px) { .hero-light .lead { font-size: 1.25rem; } }
.hero-light .hero-img { border-radius: 0.75rem; overflow: hidden; box-shadow: 0 25px 50px -12px rgba(0, 0, 0, 0.15); }
.hero-light .hero-img img { width: 100%; height: auto; display: block; }

/* CTA group (replaces hero inline styles) */
.hero-cta-group { margin-top: 2rem; display: flex; flex-wrap: wrap; gap: 1rem; align-items: center; }
.hero-cta-inner { display: flex; flex-direction: column; align-items: center; gap: 0.375rem; }
.hero-cta-note { font-size: 11px; font-family: var(--font-body); letter-spacing: 0.15em; text-transform: uppercase; color: hsl(var(--muted-foreground) / 0.5); }

/* ── Proven Process ── */
.proven-process { display: grid; grid-template-columns: 1fr; gap: 0; max-width: 64rem; margin: 0 auto; }
@media (min-width: 768px) { .proven-process { grid-template-columns: repeat(4, 1fr); } }
.pp-step { text-align: center; padding: 1.5rem 1rem; position: relative; }
@media (min-width: 768px) {
  .pp-step { border-right: 1px solid hsl(var(--border)); }
  .pp-step:last-child { border-right: none; }
}
.pp-step .num { font-family: var(--font-headline); font-size: 2.5rem; font-weight: 600; color: hsl(var(--accent) / 0.3); margin-bottom: 0.5rem; }
.pp-step h3 { font-size: 1.125rem; color: hsl(var(--foreground)); margin-bottom: 0.5rem; }
.pp-step p { font-size: 0.8125rem; font-family: var(--font-body); color: hsl(var(--muted-foreground)); line-height: 1.5; }

/* ── Two-col Content ── */
.two-col { display: grid; gap: 4rem; max-width: 72rem; margin: 0 auto; align-items: center; }
@media (min-width: 1024px) { .two-col { grid-template-columns: 1fr 1fr; } }
.two-col .content h2 { font-size: 1.875rem; margin-bottom: 1rem; line-height: 1.25; }
@media (min-width: 768px) { .two-col .content h2 { font-size: 2.25rem; } }
.two-col .content p { font-size: 1rem; font-family: var(--font-body); line-height: 1.625; margin-bottom: 1rem; }
.dark-text h2 { color: rgb(245, 242, 237) !important; }
.dark-text p { color: rgb(139, 157, 184) !important; }
.highlight-list { display: flex; flex-direction: column; gap: 1rem; }
.highlight-list li { display: flex; align-items: flex-start; gap: 0.75rem; font-size: 0.9375rem; font-family: var(--font-body); line-height: 1.5; }
.highlight-list li svg { width: 1.25rem; height: 1.25rem; flex-shrink: 0; margin-top: 2px; }
.highlight-list.dark li { color: rgb(217, 205, 184); }

/* ── Engagement Cards ── */
.eng-grid { display: grid; grid-template-columns: 1fr; gap: 1.5rem; max-width: 72rem; margin: 0 auto; }
@media (min-width: 640px) { .eng-grid { grid-template-columns: repeat(2, 1fr); } }
@media (min-width: 1024px) { .eng-grid { grid-template-columns: repeat(4, 1fr); } }
.eng-card { background: hsl(var(--card)); border: 1px solid hsl(var(--border)); border-radius: var(--radius); padding: 2rem 1.5rem; display: flex; flex-direction: column; transition: transform 0.2s, box-shadow 0.2s; }
.eng-card:hover { transform: translateY(-4px); box-shadow: 0 12px 32px rgba(10, 22, 40, 0.1); }
.eng-card .label { font-size: 0.75rem; font-family: var(--font-body); font-weight: 700; letter-spacing: 0.15em; text-transform: uppercase; color: hsl(var(--accent)); margin-bottom: 0.5rem; }
.eng-card .name { font-size: 1.125rem; color: hsl(var(--foreground)); margin-bottom: 0.5rem; }
.eng-card .cadence { font-size: 0.8125rem; font-family: var(--font-body); color: hsl(var(--accent)); font-weight: 600; margin-bottom: 1rem; padding-bottom: 1rem; border-bottom: 1px solid hsl(var(--border)); }
.eng-card .features { display: flex; flex-direction: column; gap: 0.75rem; flex: 1; }
.eng-card .features li { display: flex; align-items: flex-start; gap: 0.5rem; font-size: 0.8125rem; font-family: var(--font-body); color: hsl(var(--foreground) / 0.85); line-height: 1.4; }
.eng-card .card-cta { margin-top: 1.5rem; }
.eng-card .card-cta a { display: block; text-align: center; padding: 0.75rem 1rem; font-size: 0.8125rem; font-family: var(--font-body); font-weight: 600; border-radius: calc(var(--radius) - 2px); border: 1.5px solid hsl(var(--border)); color: hsl(var(--foreground)); transition: all 0.15s; text-decoration: none; }
.eng-card .card-cta a:hover { border-color: hsl(var(--accent)); color: hsl(var(--accent)); }

/* ── Misc ── */
.disclaimer { font-size: 0.75rem; font-family: var(--font-body); color: hsl(var(--muted-foreground)); text-align: center; margin-top: 2rem; font-style: italic; }
