/* Shared mid-page CTA styles extracted from styles.css. */
.cta-mid { --primary-foreground: hsl(0, 0%, 100%); position: relative; padding: 5rem 0; overflow: hidden; text-align: center; }
.cta-mid-bg { position: absolute; inset: 0; background: var(--gradient-ocean); opacity: 1; }
.cta-mid-bg::before { content: ''; position: absolute; inset: 0; background: radial-gradient(ellipse 80% 50% at 20% 40%, hsl(175, 70%, 45%, 0.3) 0%, transparent 60%), radial-gradient(ellipse 60% 60% at 80% 60%, hsl(205, 85%, 55%, 0.3) 0%, transparent 60%); }
.cta-mid-bg::after { content: ''; position: absolute; bottom: 0; left: 0; right: 0; height: 60px; background: url("data:image/svg+xml,%3Csvg viewBox='0 0 1440 60' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M0 60V30C240 10 480 50 720 30C960 10 1200 50 1440 30V60H0Z' fill='white' fill-opacity='0.1'/%3E%3C/svg%3E") no-repeat center bottom; background-size: cover; }
.cta-mid-content { position: relative; z-index: 10; max-width: 700px; margin: 0 auto; }
.cta-mid-title { font-size: clamp(1.75rem, 5vw, 2.75rem); font-weight: 800; color: var(--primary-foreground); margin-bottom: 1rem; text-wrap: balance; }
.cta-mid-subtitle { font-size: clamp(1rem, 2.5vw, 1.125rem); color: hsl(0, 0%, 100%, 0.85); margin: 0 auto 2rem; line-height: 1.7; max-width: 560px; }
.cta-mid .btn { display: inline-flex; align-items: center; justify-content: center; gap: 0.75rem; font-weight: 600; border-radius: 9999px; transition: all 0.2s; padding: 10px; }
.cta-mid .btn-lg { padding: 1rem 2rem; font-size: 1.125rem; }
.cta-mid-btn { background: white; color: var(--primary); box-shadow: 0 8px 24px -4px hsl(205, 85%, 25%, 0.4); }
.cta-mid-btn:hover { background: hsl(0, 0%, 98%); transform: translateY(-2px); box-shadow: 0 12px 32px -4px hsl(205, 85%, 25%, 0.5); }