/* FPIESwise Waitlist landing page styles. Everything is scoped under .fpiesw-landing so this never leaks into the rest of the active theme. */ /* ---------- full-bleed breakout ---------- * * Most themes wrap page content in a narrower, padded/boxed content * column (visible as a card with margins around it). This forces the * landing page edge-to-edge regardless of that wrapper's width, so it * always reads as a real full-width page rather than a boxed section * inside one. It only affects .fpiesw-landing itself - nothing else on * the page - and doesn't touch the theme's own header/title/sidebar * chrome above or below it (see the plugin README for how to remove * those via a blank/full-width page template, if your theme offers one). */ body:has(.fpiesw-landing) { overflow-x: hidden; } .fpiesw-landing { width: 100vw; max-width: 100vw; margin-left: calc(50% - 50vw); margin-right: calc(50% - 50vw); } .fpiesw-landing { --paper: #FAF9FE; --surface: #F1EEF9; --surface-2: #FFFFFF; --ink: #18142B; --ink-soft: #5B5570; --accent: #7C5CFC; --accent-deep: #4B3A8F; --safe: #2FAE64; --trial: #C98A17; --trigger: #D8433F; --border: #E3DEF3; --shadow: 0 20px 40px -24px rgba(45, 27, 105, 0.35); background: var(--paper); color: var(--ink); font-family: "Nunito Sans", "Segoe UI", Arial, sans-serif; -webkit-font-smoothing: antialiased; line-height: 1.4; } @media (prefers-color-scheme: dark) { .fpiesw-landing { --paper: #110D1F; --surface: #1B1730; --surface-2: #221C3A; --ink: #F3F0FA; --ink-soft: #B6AED2; --accent: #9B82FF; --accent-deep: #6A52D6; --safe: #4BC97F; --trial: #F0B93E; --trigger: #FF6E68; --border: #2E2850; --shadow: 0 20px 40px -20px rgba(0, 0, 0, 0.6); } } .fpiesw-landing, .fpiesw-landing *, .fpiesw-landing *::before, .fpiesw-landing *::after { box-sizing: border-box; } .fpiesw-landing [hidden] { display: none !important; } .fpiesw-landing img { max-width: 100%; } .fpiesw-landing h1, .fpiesw-landing h2, .fpiesw-landing h3, .fpiesw-landing .logo, .fpiesw-landing .btn, .fpiesw-landing .stat-num, .fpiesw-landing .phone-caption strong { font-family: "Poppins", "Nunito Sans", sans-serif; } /* Every heading gets an explicit, forced color - never left to inherit. Themes often carry their own dark/light heading color (separate from body text) that otherwise wins the cascade and can turn invisible against one of this plugin's own backgrounds (e.g. a dark card in dark mode). Section-specific rules further down (e.g. .mission h2, .highlight-banner h3) are more specific and override this safely. */ .fpiesw-landing h1, .fpiesw-landing h2, .fpiesw-landing h3 { color: var(--ink) !important; } .fpiesw-landing h1, .fpiesw-landing h2 { text-wrap: balance; margin: 0; } .fpiesw-landing h3 { margin: 0; } .fpiesw-landing p { margin: 0; } .fpiesw-landing a { text-decoration: none; } .fpiesw-landing .wrap { max-width: 1120px; margin: 0 auto; padding: 0 28px; } .fpiesw-landing section { padding: 88px 0; } @media (max-width: 640px) { .fpiesw-landing section { padding: 56px 0; } } /* ---------- header ---------- */ .fpiesw-landing .site-header { position: sticky; top: 0; z-index: 20; background: color-mix(in srgb, var(--paper) 88%, transparent); backdrop-filter: blur(10px); border-bottom: 1px solid var(--border); } .fpiesw-landing .header-inner { display: flex; align-items: center; justify-content: space-between; padding: 16px 28px; } .fpiesw-landing .logo { display: inline-flex; align-items: center; gap: 9px; font-weight: 700; font-size: 1.3rem; color: var(--ink); letter-spacing: 0.01em; } .fpiesw-landing .logo-text { display: inline-block; } .fpiesw-landing .logo-accent { color: var(--accent); } .fpiesw-landing .logo img { width: 30px; height: 30px; border-radius: 8px; display: block; } /* ---------- buttons & form ---------- * * Pro/Cornerstone (and most page-builder themes) apply their own global * styling to bare