/* =========================================
   Figma hero + landing sections
   ========================================= */

/* Kill accidental horizontal scrolling from full-bleed effects.
   Use clip (not hidden) so position:sticky on the landing nav still works. */
html, body {
    overflow-x: clip;
}

:root {
    --fomo-hero-bg: #0a0a0a;
    --fomo-hero-text: #ffffff;
    --fomo-hero-muted: #bdbdbd;
    --fomo-hero-mint: #d4ffe6;

    /* overridable via index.php inline variables */
    --fomo-accent: #00c769;
    --fomo-accent-soft: #08db7a;
    --fomo-accent-glow: rgba(0, 199, 105, 0.35);
    --fomo-accent-tint: rgba(0, 199, 105, 0.08);
    --fomo-accent-border: rgba(0, 199, 105, 0.22);

    --fomo-hero-accent: var(--fomo-accent);
    --fomo-hero-accent-soft: var(--fomo-accent-soft);

    --fomo-nav-height: 122px;
}

/* ================= HERO (Figma 1291:30003) ================= */
.fomo-index-hero {
    position: relative;
    overflow: hidden;
    isolation: isolate;
    background: var(--fomo-hero-bg);
    color: var(--fomo-hero-text);
    padding-bottom: clamp(80px, 8vw, 110px);
}

/* Figma "gradient-background" (1291:30005) — the two large green ellipse
   wings on the left and right sides of the hero. Native SVG is 2347x1972
   with the design's 1440-wide canvas centered inside it (so the wings
   already overflow ~453px on each side of the design). We center it on
   the hero and scale wide enough that the wings reach the viewport edges
   on common breakpoints. */
.fomo-index-hero__backdrop {
    position: absolute;
    top: -76%;
    left: 50%;
    width: max(2347px, 163vw);
    aspect-ratio: 2347 / 1972;
    transform: translateX(-50%);
    pointer-events: none;
    z-index: 0;
    background: url('../images/fomo_boost/gradient-background.svg') center top / 100% 100% no-repeat;
}

/* Figma "Sparkles" (1291:30056) — soft noise/grain over the upper hero. */
.fomo-index-hero__sparkles {
    position: absolute;
    left: 0;
    right: 0;
    top: 0;
    height: 912px;
    pointer-events: none;
    z-index: 1;
    mix-blend-mode: screen;
    opacity: 0.45;
    background-image:
        radial-gradient(ellipse at 50% 55%, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0.9) 88%),
        url('../images/index/hero-sparkles.png');
    background-repeat: no-repeat, repeat;
    background-size: 100% 100%, 760px 760px;
    background-position: center, center;
}

/* Figma "lines" (1291:30039) — radial / curving line vector centered above
   the hero text. */
.fomo-index-hero__lines {
    position: absolute;
    left: 50%;
    top: 0;
    width: min(1240px, 92vw);
    aspect-ratio: 1157 / 760;
    transform: translateX(-50%);
    pointer-events: none;
    z-index: 1;
    opacity: 0.55;
    mix-blend-mode: screen;
    background: url('../images/fomo_boost/lines.svg') center top / 100% 100% no-repeat;
}

/* The Figma design has no horizontal accent beam — keeping the element
   in markup for backwards compat but visually disabled. */
.fomo-index-hero__beam {
    display: none;
}

.fomo-index-hero__inner {
    position: relative;
    z-index: 5;
    max-width: 1240px;
    margin: 0 auto;
    padding: var(--fomo-nav-height) 24px 0;
}

.fomo-index-nav-bar {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    z-index: 10000;
    width: 100%;
    pointer-events: none;
    transition: background-color .2s ease, backdrop-filter .2s ease, border-color .2s ease;
}

.fomo-index-nav-bar.is-scrolled {
    background: rgba(10, 10, 10, 0.6);
    backdrop-filter: blur(14px);
    -webkit-backdrop-filter: blur(14px);
    border-bottom: 1px solid rgba(255, 255, 255, 0.06);
}

.fomo-index-nav-bar__inner {
    position: relative;
    z-index: 1;
    max-width: 1440px;
    margin: 0 auto;
    padding: 0 clamp(24px, 6.94vw, 100px);
    pointer-events: auto;
}

.fomo-index-nav-bar--index .fomo-index-nav-bar__inner {
    max-width: 1240px;
    padding: 0 24px;
}

.fomo-index-nav-bar--about,
.fomo-index-nav-bar--pricing {
    --fomo-nav-height: 96px;
}

.fomo-index-nav-bar--about .fomo-index-nav,
.fomo-index-nav-bar--pricing .fomo-index-nav {
    height: auto;
    min-height: 0;
    padding: 32px 0;
}

.fomo-index-nav {
    height: 90px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 2rem;
}

.fomo-index-brand {
    display: inline-flex;
    align-items: center;
    gap: 12px;
    text-decoration: none !important;
    color: var(--fomo-hero-mint);
}

.fomo-index-brand__logo {
   width: 205px;
height: 63.262px;
    object-fit: contain;
    border-radius: 12px;
}

.fomo-index-brand__emblem {
    width: 56px;
    height: 56px;
    border-radius: 14px;
    background: linear-gradient(145deg, var(--fomo-hero-accent), var(--fomo-hero-accent-soft));
    color: #03110a;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    box-shadow: 0 8px 24px rgba(0, 199, 105, .35);
}

.fomo-index-brand__text {
    font-size: 32px;
    line-height: 1;
    font-weight: 600;
    letter-spacing: -0.01em;
    color: var(--fomo-hero-mint);
}

.fomo-index-nav__menu {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 40px;
    flex: 1;
    min-width: 0;
    margin: 0 24px;
}

/* Dropdown */
.fomo-index-nav__dropdown {
    position: relative;
    display: inline-flex;
    align-items: center;
}

.fomo-index-nav__dropdown .dropdown-toggle {
    background: transparent;
    border: 0;
    color: var(--fomo-hero-muted);
    font-size: 16px;
    line-height: 26px;
    cursor: pointer;
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 0;
}

/* Remove any default caret inserted via library (eg. Bootstrap) */
.fomo-index-nav__dropdown .dropdown-toggle::after {
    display: none !important;
    content: none !important;
}

.fomo-index-nav__dropdown:hover .dropdown-toggle,
.fomo-index-nav__dropdown .dropdown-toggle:focus {
    color: #ffffff;
}
.fomo-index-nav__dropdown:hover .dropdown-toggle i{
    rotate: 180deg;
}

.fomo-index-nav__dropdown .dropdown-menu {
    display: none;
    position: absolute;
    top: calc(100% - 6px);
    right: 0;
    min-width: 200px;
    padding: 10px 10px 8px;
    background: rgba(6, 6, 6, 0.6);
    border-radius: 12px;
    box-shadow: 0 12px 40px rgba(0, 0, 0, 0.6);
    border: 1px solid rgba(255, 255, 255, 0.04);
    backdrop-filter: blur(12px);
    z-index: 40;
}

.fomo-index-nav__dropdown:hover .dropdown-menu {
    display: block;
}

.fomo-index-nav__dropdown .dropdown-menu a {
    display: block;
    padding: 10px 12px;
    color: var(--fomo-hero-muted);
    text-decoration: none !important;
    border-radius: 8px;
    font-size: 15px;
}

.fomo-index-nav__dropdown .dropdown-menu a:hover {
    background: rgba(255,255,255,0.02);
    color: #ffffff;
}

.fomo-index-nav__dropdown .dropdown-menu a.is-active {
    color: #ffffff;
    background: rgba(255, 255, 255, 0.06);
}

/* Rotate chevron icon on hover/focus/open */
.fomo-index-nav__dropdown .dropdown-toggle i,
.fomo-index-nav__dropdown .dropdown-toggle svg {
    display: inline-block;
    transition: transform .18s ease;
    transform-origin: center;
}

.fomo-index-nav__dropdown:hover .dropdown-toggle i,
.fomo-index-nav__dropdown:hover .dropdown-toggle svg,
.fomo-index-nav__dropdown .dropdown-toggle:focus i,
.fomo-index-nav__dropdown .dropdown-toggle:focus svg,
.fomo-index-nav__dropdown .dropdown-toggle[aria-expanded="true"] i,
.fomo-index-nav__dropdown .dropdown-toggle[aria-expanded="true"] svg {
    transform: rotate(180deg);
}

.fomo-index-nav__menu a {
    color: var(--fomo-hero-muted);
    font-size: 16px;
    line-height: 26px;
    text-decoration: none !important;
    font-weight: 400;
    white-space: nowrap;
    transition: color .15s ease;
}

.fomo-index-nav__menu a.is-active,
.fomo-index-nav__menu a:hover {
    color: #ffffff;
}

.fomo-index-nav__menu a.is-active { font-weight: 600; }

.fomo-index-nav__cta {
    border-radius: 80px;
    background: var(--fomo-hero-accent);
    color: #f7f7f7 !important;
    text-decoration: none !important;
    padding: 12px 28px;
    font-size: 16px;
    line-height: 26px;
    font-weight: 600;
    white-space: nowrap;
    transition: background .15s ease, transform .15s ease, box-shadow .15s ease;
    box-shadow: 0 8px 24px rgba(0, 199, 105, .25);
}

.fomo-index-nav__cta:hover {
    background: color-mix(in srgb, var(--fomo-hero-accent) 92%, #000 8%);
    transform: translateY(-1px);
    box-shadow: 0 10px 28px rgba(0, 199, 105, .35);
}

.fomo-index-hero__content {
    margin: 40px auto 0;
    text-align: center;
}

.fomo-index-pill {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 10px 18px;
    border: 1px solid rgba(255, 255, 255, 0.18);
    border-radius: 999px;
    background: linear-gradient(180deg, rgba(0, 199, 105, .18) 0%, rgba(0, 0, 0, .25) 100%);
    color: var(--fomo-hero-mint);
    font-size: 16px;
    line-height: 26px;
    font-weight: 500;
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, .08);
}

.fomo-index-pill__icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 22px;
    height: 22px;
    border-radius: 50%;
    background: linear-gradient(145deg, #ffd166, #ff8c42);
    color: #1a0d00;
    font-size: 11px;
}

.fomo-index-hero__title {
    margin: 24px auto 24px;
    color: #ffffff;
    font-size: clamp(2.4rem, 5.4vw, 80px);
    line-height: 1.1;
    letter-spacing: -0.035em;
    font-weight: 600;
    text-shadow: 0 4px 24px rgba(0, 0, 0, 0.45);
    max-width: 854px;
}

.fomo-index-hero__subtitle {
    color: var(--fomo-hero-muted);
    font-size: 16px;
    line-height: 26px;
    max-width: 784px;
    margin: 0 auto;
    text-shadow: 0 2px 8px rgba(0, 0, 0, 0.45);
}

/* Scalient-style hero text reveal (GSAP word mask) */
.fomo-hero-split {
    display: inline-block;
    overflow: hidden;
    vertical-align: top;
    line-height: inherit;
    padding-bottom: 0.08em;
}

.fomo-hero-split__inner {
    display: inline-block;
    will-change: transform, opacity, filter;
}

.fomo-index-hero__actions {
    margin-top: 56px;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 24px;
    flex-wrap: wrap;
}

.fomo-index-btn {
    border-radius: 80px;
    text-decoration: none !important;
    padding: 12px 24px;
    height: 50px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 12px;
    font-size: 16px;
    line-height: 26px;
    font-weight: 600;
    white-space: nowrap;
    transition: background .15s ease, transform .15s ease, box-shadow .15s ease, border-color .15s ease;
}

.fomo-index-btn--primary {
    background: var(--fomo-hero-accent);
    color: #f7f7f7 !important;
    min-width: 272px;
    box-shadow: 0 12px 28px rgba(0, 199, 105, .3);
}

.fomo-index-btn--ghost {
    background: rgba(255, 255, 255, .04);
    color: #ffffff !important;
    border: 1px solid rgba(255, 255, 255, .22);
    min-width: 286px;
}

.fomo-index-hero__showcase {
    position: relative;
    width: 100%;
    max-width: 1200px;
    min-height: 497px;
    margin: 56px auto 0;
    z-index: 4;
}

.fomo-index-hero__showcase-visual {
    position: relative;
    width: 871px;
    max-width: calc(100% - 40px);
    margin: 0 auto;
    border-radius: 24px;
    border: 1px solid rgba(0, 199, 105, 0.22);
    background: #0a0f0d;
    box-shadow: 0 30px 80px rgba(0, 0, 0, .65);
    overflow: hidden;
}

.fomo-index-hero__showcase-img,
.fomo-index-hero__showcase-video {
    display: block;
    width: 100%;
    height: auto;
    vertical-align: top;
}

.fomo-index-hero__showcase-video {
    aspect-ratio: 871 / 497;
    object-fit: cover;
    pointer-events: none;
    min-height: 280px;
    background: #0a0f0d;
}

.fomo-index-hero__play {
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
    z-index: 2;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 120px;
    height: 120px;
    text-decoration: none !important;
    transition: transform 0.2s ease;
}

.fomo-index-hero__play:hover {
    transform: translate(-50%, -50%) scale(1.04);
}

.fomo-index-hero__play-rings {
    position: absolute;
    inset: 0;
    border-radius: 50%;
    background: radial-gradient(circle, rgba(0, 199, 105, 0.35) 0%, rgba(0, 199, 105, 0) 70%);
    animation: fomo-hero-play-pulse 2.4s ease-out infinite;
}

.fomo-index-hero__play-rings::before,
.fomo-index-hero__play-rings::after {
    content: '';
    position: absolute;
    inset: -18px;
    border-radius: 50%;
    border: 1px solid rgba(0, 199, 105, 0.35);
    animation: fomo-hero-play-ring 2.4s ease-out infinite;
}

.fomo-index-hero__play-rings::after {
    inset: -36px;
    animation-delay: 0.6s;
    opacity: 0.6;
}

.fomo-index-hero__play img {
    position: relative;
    z-index: 1;
    width: 72px;
    height: 72px;
    display: block;
    filter: drop-shadow(0 0 24px rgba(0, 199, 105, 0.55));
}

@keyframes fomo-hero-play-pulse {
    0%, 100% { transform: scale(1); opacity: 0.85; }
    50% { transform: scale(1.08); opacity: 1; }
}

@keyframes fomo-hero-play-ring {
    0% { transform: scale(0.85); opacity: 0.7; }
    100% { transform: scale(1.2); opacity: 0; }
}

.fomo-index-stat {
    position: absolute;
    width: 336px;
    height: 92px;
    padding: 14px 20px;
    border-radius: 18px;
    border: 1px solid rgba(0, 199, 105, .22);
    background: linear-gradient(180deg, rgba(255, 255, 255, .04) 0%, rgba(0, 0, 0, .35) 100%), rgba(10, 12, 11, .82);
    backdrop-filter: blur(12px);
    -webkit-backdrop-filter: blur(12px);
    box-shadow: 0 24px 60px rgba(0, 0, 0, .55);
    display: flex;
    align-items: center;
    gap: 16px;
    z-index: 6;
}

.fomo-index-hero__stats {
    position: absolute;
    inset: 0;
    pointer-events: none;
    z-index: 5;
}

.fomo-index-hero__stats .fomo-index-stat {
    pointer-events: auto;
}

.fomo-index-stat--left { left: 0; bottom: 36px; }
.fomo-index-stat--right { right: 0; top: 13px; }

.fomo-index-hero__showcase-picture,
.fomo-index-hero__showcase-visual picture {
    display: block;
    width: 100%;
}

.fomo-index-stat__icon {
    width: 56px;
    height: 56px;
    border-radius: 14px;
    background: linear-gradient(145deg, var(--fomo-hero-accent), var(--fomo-hero-accent-soft));
    color: #03110a;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-size: 22px;
    box-shadow: 0 8px 22px rgba(0, 199, 105, .35);
}

.fomo-index-stat__value {
    color: #ffffff;
    font-size: 28px;
    line-height: 1.1;
    font-weight: 700;
}

.fomo-index-stat__label {
    color: var(--fomo-hero-muted);
    font-size: 14px;
    line-height: 20px;
}

/* Hero stat cards — bounce entrance + gentle float */
:root {
    --fomo-stat-bounce-dur: 700ms;
    --fomo-stat-float-dur: 3.2s;
    --fomo-slide-dur: 1200ms;
    --fomo-slide-ease: cubic-bezier(0.22, 1, 0.36, 1);
}

.fomo-index-hero__stats.fomo-hero-stats-ready .fomo-index-stat:not(.is-bouncing):not(.is-floating):not(.is-visible) {
    opacity: 0;
    transform: translateY(28px) scale(0.9);
}

@keyframes fomo-stat-bounce-in {
    0% {
        opacity: 0;
        transform: translateY(28px) scale(0.9);
    }
    55% {
        opacity: 1;
        transform: translateY(-10px) scale(1.03);
    }
    75% {
        transform: translateY(5px) scale(0.985);
    }
    100% {
        opacity: 1;
        transform: translateY(0) scale(1);
    }
}

@keyframes fomo-stat-float {
    0%, 100% { transform: translateY(0); }
    50% { transform: translateY(-7px); }
}

.fomo-index-hero__stats .fomo-index-stat.is-bouncing {
    animation: fomo-stat-bounce-in var(--fomo-stat-bounce-dur) cubic-bezier(0.34, 1.45, 0.64, 1) both;
    animation-delay: var(--fomo-stat-bounce-delay, 0ms);
}

.fomo-index-hero__stats .fomo-index-stat.is-floating {
    animation: fomo-stat-float var(--fomo-stat-float-dur) ease-in-out infinite;
}

.fomo-index-hero__stats .fomo-index-stat--left.is-floating {
    animation-delay: 0s;
}

.fomo-index-hero__stats .fomo-index-stat--right.is-floating {
    animation-delay: 1.6s;
}

/* Sliding number counter — rolls from 0 to target value */
.fomo-slide-number {
    display: inline-flex;
    align-items: baseline;
    font-variant-numeric: tabular-nums;
}

.fomo-slide-number__col {
    display: inline-block;
    height: 1.1em;
    overflow: hidden;
    vertical-align: baseline;
}

.fomo-slide-number__track {
    display: flex;
    flex-direction: column;
    transform: translateY(0);
    will-change: transform;
}

.fomo-slide-number__track.is-sliding {
    transition: transform var(--fomo-slide-dur, 1200ms) var(--fomo-slide-ease);
    transform: translateY(calc(var(--fomo-slide-to, 0) * -1.1em));
}

.fomo-slide-number__cell {
    height: 1.1em;
    line-height: 1.1em;
    display: block;
    white-space: nowrap;
    text-align: center;
}

@media (prefers-reduced-motion: reduce) {
    .fomo-index-hero__stats .fomo-index-stat {
        opacity: 1 !important;
        animation: none !important;
        transform: none !important;
    }

    .fomo-slide-number__track {
        transition: none !important;
    }
}

/* ================= HOME PAGE SCROLL REVEAL (titles + subtitles) ================= */
.fomo-reveal {
    --fomo-reveal-delay: 0ms;
    --fomo-reveal-distance: 28px;
    opacity: 0;
    transform: translateY(var(--fomo-reveal-distance));
    filter: blur(6px);
    transition:
        opacity 0.65s cubic-bezier(0.22, 1, 0.36, 1),
        transform 0.65s cubic-bezier(0.22, 1, 0.36, 1),
        filter 0.65s cubic-bezier(0.22, 1, 0.36, 1);
    transition-delay: var(--fomo-reveal-delay);
    will-change: opacity, transform, filter;
}

.fomo-reveal.is-visible {
    opacity: 1;
    transform: translateY(0);
    filter: blur(0);
}

@media (prefers-reduced-motion: reduce) {
    .fomo-reveal {
        opacity: 1;
        transform: none;
        filter: none;
        transition: none;
    }
}

/* ================= DESIGN SYSTEM (sections) ================= */
:root {
    --fomo-radius-card: 20px;
    --fomo-radius-pill: 999px;
    --fomo-section-py: clamp(72px, 9vw, 128px);
    --fomo-container: 1240px;

    --fomo-dark-bg: #060606;
    --fomo-dark-card: rgba(255, 255, 255, 0.03);
    --fomo-dark-card-border: rgba(255, 255, 255, 0.08);
    --fomo-dark-text: #ffffff;
    --fomo-dark-mute: #bdbdbd;

    --fomo-light-bg: #ffffff;
    --fomo-light-bg-2: #f6f8f7;
    --fomo-light-card-border: rgba(10, 20, 16, 0.08);
    --fomo-light-text: #0a1410;
    --fomo-light-mute: #5b6661;
}

[data-theme-style="dark"] {
    --fomo-light-bg: #0d0d0d;
    --fomo-light-bg-2: #111212;
    --fomo-light-card-border: rgba(255, 255, 255, 0.08);
    --fomo-light-text: #ffffff;
    --fomo-light-mute: #bdbdbd;
}

.fomo-section {
    position: relative;
    padding: var(--fomo-section-py) 0;
    overflow: hidden;
}

.fomo-section--dark {
    background: var(--fomo-dark-bg);
    color: var(--fomo-dark-text);
}

.fomo-section--tinted {
    background: var(--fomo-light-bg-2);
    color: var(--fomo-light-text);
}

.fomo-section__inner {
    position: relative;
    z-index: 1;
    max-width: var(--fomo-container);
    margin: 0 auto;
    padding: 0 24px;
}

.fomo-section__header {
    text-align: center;
    max-width: 760px;
    margin: 0 auto 56px;
}

.fomo-section__eyebrow {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 6px 14px;
    border: 1px solid var(--fomo-accent-border);
    background: var(--fomo-accent-tint);
    border-radius: var(--fomo-radius-pill);
    color: var(--fomo-accent);
    font-size: 13px;
    line-height: 22px;
    font-weight: 600;
    letter-spacing: 0.02em;
    text-transform: uppercase;
}

.fomo-section__title {
    margin: 16px auto 14px;
    font-size: clamp(2rem, 3.4vw, 48px);
    line-height: 1.15;
    letter-spacing: -0.025em;
    font-weight: 700;
}

.fomo-section__subtitle {
    margin: 0 auto;
    font-size: 17px;
    line-height: 28px;
    color: var(--fomo-light-mute);
    max-width: 680px;
}

.fomo-section--dark .fomo-section__subtitle { color: var(--fomo-dark-mute); }

.fomo-feature-icon {
    width: 56px;
    height: 56px;
    border-radius: 14px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-size: 22px;
    background: linear-gradient(145deg, var(--fomo-accent), var(--fomo-accent-soft));
    color: #03110a;
    box-shadow: 0 8px 22px var(--fomo-accent-glow);
}

/* Stats */
.fomo-stats__grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 20px;
}

/* Figma background vector (home page after Trusted section) */
.fomo-stats {
    position: relative;
    isolation: isolate;
}

.fomo-stats::before {
    content: '';
    position: absolute;
    inset: -220px -220px -260px -220px;
    pointer-events: none;
    z-index: 0;
    background:
        radial-gradient(60% 42% at 50% 30%, rgba(38, 220, 114, 0.22) 0%, rgba(38, 220, 114, 0) 70%),
        url('../images/fomo_boost/trusted-bg-vector.svg');
    background-repeat: no-repeat, no-repeat;
    background-position: center, center;
    background-size: cover, 1440px 1404px;
    opacity: .85;
    mix-blend-mode: screen;
    filter: blur(0.2px);
}

.fomo-stats .fomo-section__inner {
    position: relative;
    z-index: 1;
}

.fomo-stat-card {
    border-radius: var(--fomo-radius-card);
    padding: 28px;
    border: 1px solid var(--fomo-dark-card-border);
    background: linear-gradient(180deg, rgba(255,255,255,.04) 0%, rgba(0,0,0,.4) 100%);
    backdrop-filter: blur(14px);
    -webkit-backdrop-filter: blur(14px);
}

.fomo-stat-card__icon {
    width: 48px;
    height: 48px;
    border-radius: 12px;
    background: linear-gradient(145deg, var(--fomo-accent), var(--fomo-accent-soft));
    color: #03110a;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-size: 18px;
    margin-bottom: 18px;
    box-shadow: 0 6px 18px var(--fomo-accent-glow);
}

.fomo-stat-card__value { color: var(--fomo-dark-text); font-size: 40px; line-height: 1; font-weight: 700; margin-bottom: 6px; }
.fomo-stat-card__label { color: var(--fomo-dark-mute); font-size: 14px; line-height: 22px; }

/* Steps */
.fomo-steps {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 24px;
    counter-reset: fomo-step;
}

.fomo-step-card {
    position: relative;
    padding: 32px 28px;
    border-radius: var(--fomo-radius-card);
    border: 1px solid var(--fomo-dark-card-border);
    background: var(--fomo-dark-card);
}

.fomo-step-card__num {
    counter-increment: fomo-step;
    position: absolute;
    top: 24px;
    right: 24px;
    color: var(--fomo-accent);
    font-size: 56px;
    line-height: 1;
    font-weight: 700;
    opacity: .25;
}
.fomo-step-card__num::before { content: '0' counter(fomo-step); }
.fomo-step-card__title { color: var(--fomo-dark-text); font-size: 22px; font-weight: 700; margin: 18px 0 10px; }
.fomo-step-card__text { color: var(--fomo-dark-mute); font-size: 15px; line-height: 24px; margin: 0; }

/* Notifications */
.fomo-notify-preview {
    margin-bottom: 40px;
    padding: 24px;
    border-radius: var(--fomo-radius-card);
    border: 1px solid var(--fomo-light-card-border);
    background: var(--fomo-light-bg);
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 24px;
    flex-wrap: wrap;
}
.fomo-notify-preview__heading { font-size: 18px; font-weight: 600; margin: 0; color: var(--fomo-light-text); }
.fomo-notify-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 20px; }
.fomo-notify-radio { display: block; cursor: pointer; }
.fomo-notify-radio input { position: absolute; opacity: 0; pointer-events: none; }
.fomo-notify-card { border-radius: var(--fomo-radius-card); border: 1px solid var(--fomo-light-card-border); background: var(--fomo-light-bg); padding: 22px; height: 100%; }
.fomo-notify-card__head { display: flex; gap: 16px; }
.fomo-notify-card__avatar { width: 48px; height: 48px; border-radius: 14px; display: inline-flex; align-items: center; justify-content: center; font-size: 18px; }
.fomo-notify-card__title { font-size: 16px; font-weight: 600; margin: 0 0 6px; color: var(--fomo-light-text); }
.fomo-notify-card__desc { font-size: 14px; line-height: 22px; color: var(--fomo-light-mute); margin: 0; }
.fomo-notify-radio input:checked ~ .fomo-notify-card { border-color: var(--fomo-accent); box-shadow: 0 0 0 3px var(--fomo-accent-tint); }

/* Blog */
.fomo-blog-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 28px; }
.fomo-blog-card { border-radius: var(--fomo-radius-card); overflow: hidden; border: 1px solid var(--fomo-light-card-border); background: var(--fomo-light-bg); }
.fomo-blog-card__image-wrap { aspect-ratio: 16 / 9; overflow: hidden; background: var(--fomo-light-bg-2); }
.fomo-blog-card__image { width: 100%; height: 100%; object-fit: cover; }
.fomo-blog-card__body { padding: 24px; }
.fomo-blog-card__title { font-size: 18px; font-weight: 600; color: var(--fomo-light-text); margin: 0 0 10px; }
.fomo-blog-card__desc { font-size: 14px; line-height: 22px; color: var(--fomo-light-mute); margin: 0; }

@media (max-width: 991.98px) {
    .fomo-index-hero { border-radius: 0; }
    .fomo-index-nav { height: auto; padding: 24px 0; flex-wrap: wrap; justify-content: center; gap: 16px; }
    .fomo-index-nav__menu { flex: 0 0 100%; flex-wrap: wrap; margin: 0; gap: 12px 20px; }
    .fomo-index-hero__beam { display: none; }
    .fomo-index-hero__showcase {
        min-height: 0;
        margin-top: 40px;
    }

    .fomo-index-hero__showcase-visual {
        width: 100%;
        max-width: 100%;
    }

    .fomo-index-hero__play {
        width: 88px;
        height: 88px;
    }

    .fomo-index-hero__play img {
        width: 56px;
        height: 56px;
    }

    .fomo-index-hero__stats {
        position: static;
        display: grid;
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 16px;
        width: 100%;
        max-width: 720px;
        margin: 20px auto 0;
        pointer-events: auto;
    }

    .fomo-index-hero__stats .fomo-index-stat {
        position: relative;
        width: 100%;
        max-width: none;
        margin: 0;
        left: auto;
        right: auto;
        top: auto;
        bottom: auto;
    }

    .fomo-index-hero__play {
        display: none;
    }

    .fomo-stats__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .fomo-steps { grid-template-columns: 1fr; }
    .fomo-notify-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .fomo-blog-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (max-width: 575.98px) {
    .fomo-index-hero__title { font-size: clamp(2rem, 8vw, 2.8rem); }
    .fomo-stats__grid { grid-template-columns: 1fr; }
    .fomo-notify-grid { grid-template-columns: 1fr; }
    .fomo-blog-grid { grid-template-columns: 1fr; }
}

/* ================= PARTNERS (Figma: 2144:31889 logo-container) ================= */
.fomo-partners {
    background: #0d0d0d;
    color: #ffffff;
}

.fomo-partners__inner {
    max-width: 100%;
    margin: 0 auto;
    padding: 120px 0;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 64px;
}

.fomo-partners__title {
    margin: 0;
    font-family: 'Poppins', system-ui, -apple-system, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
    font-weight: 500;
    font-size: 32px;
    line-height: 40px;
    letter-spacing: -0.64px;
    text-align: center;
    color: #ffffff;
}

.fomo-partners__marquee {
    position: relative;
    width: 100%;
    overflow: hidden;
    --fomo-partners-gap: 100px;
}

.fomo-partners__track {
    display: flex;
    align-items: center;
    width: max-content;
    animation: fomo-partners-marquee 25s linear infinite;
    will-change: transform;
}

.fomo-partners__group {
    display: flex;
    align-items: center;
    gap: var(--fomo-partners-gap);
    flex-shrink: 0;
    padding-right: var(--fomo-partners-gap);
}

@keyframes fomo-partners-marquee {
    from {
        transform: translate3d(0, 0, 0);
    }
    to {
        transform: translate3d(calc(var(--fomo-partners-shift, 50%) * -1), 0, 0);
    }
}

.fomo-partners__mask {
    position: absolute;
    top: 0;
    height: 100%;
    pointer-events: none;
    z-index: 2;
}

.fomo-partners__mask--left {
    left: 0;
    width: 233px;
    background: linear-gradient(90deg, #0d0d0d 0%, rgba(13, 13, 13, 0) 100%);
}

.fomo-partners__mask--right {
    right: 0;
    width: 124px;
    background: linear-gradient(270deg, #0d0d0d 0%, rgba(13, 13, 13, 0) 100%);
}

.fomo-partners__logo {
    height: 58px;
    width: auto;
    max-width: 162px;
    display: block;
    flex: 0 0 auto;
    object-fit: contain;
}

@media (prefers-reduced-motion: reduce) {
    .fomo-partners__track {
        animation: none;
    }
}

@media (max-width: 991.98px) {
    .fomo-partners__inner {
        padding-top: 88px;
        padding-bottom: 88px;
        gap: 44px;
    }

    .fomo-partners__marquee {
        --fomo-partners-gap: 56px;
    }
}

@media (max-width: 575.98px) {
    .fomo-partners__title {
        font-size: 22px;
        line-height: 30px;
        letter-spacing: -0.3px;
        white-space: normal;
    }

    .fomo-partners__marquee {
        --fomo-partners-gap: 40px;
    }

    .fomo-partners__track {
        gap: 0;
    }

    .fomo-partners__mask--left { width: 80px; }
    .fomo-partners__mask--right { width: 56px; }
}

/* ================= ABOUT-US / FEATURES (Figma: about-us) ================= */
.fomo-about-us {
    background: #0d0d0d;
    /* Prevent horizontal scrollbar from any decorative layers */
    overflow: hidden;
}

.fomo-about-us__bg {
    position: absolute;
    inset: 0;
    pointer-events: none;
    z-index: 0;
    background:
        radial-gradient(55% 45% at 82% 32%, rgba(38, 220, 114, 0.24) 0%, rgba(38, 220, 114, 0) 85%),
        url('../images/fomo_boost/trusted-bg-vector.svg');
    background-repeat: no-repeat, no-repeat;
    /* Keep glow near top-right, push vector down to bottom */
    background-position: 112% 84%, 61% -73%;
    /* Glow scales responsively, vector stays full-bleed but bottom-anchored */
    background-size: min(900px, 70vw) min(900px, 70vw), max(1440px, 120vw) auto;
    opacity: .9;
    mix-blend-mode: screen;
    overflow: clip;
}

.fomo-about-us .fomo-section__inner {
    position: relative;
    z-index: 1;
}

.fomo-about-us__header {
    text-align: center;
    margin: 0 auto 64px;
}

.fomo-about-us__pill {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 6px 16px 8px;
    border-radius: 24px;
    border: 1px solid #00952a;
    background: rgba(41, 255, 130, 0.25);
    color: #ffffff;
    font-family: 'Poppins', system-ui, -apple-system, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
    font-size: 16px;
    line-height: 26px;
    font-weight: 400;
}

.fomo-about-us__title {
    margin: 24px auto 24px;
    font-family: 'Poppins', system-ui, -apple-system, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
    font-weight: 500;
    font-size: 56px;
    line-height: 72px;
    letter-spacing: -2.24px;
    text-transform: capitalize;
    background: linear-gradient(180deg, #ffffff 25.5%, #999999 118.5%);
    -webkit-background-clip: text;
    background-clip: text;
    color: transparent;
}

.fomo-about-us__subtitle {
    max-width: 886px;
    margin: 0 auto;
    color: #bdbdbd;
    font-family: 'Poppins', system-ui, -apple-system, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
    font-size: 24px;
    line-height: 32px;
}

.fomo-about-us__grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 32px;
}

.fomo-about-us__card {
    height: 430px;
    border-radius: 40px;
    background: #1a1a1a;
    border: 1px solid rgba(74, 74, 74, 0.7);
    padding: 40px 32px;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: flex-end;
    gap: 32px;
    text-align: center;
}

.fomo-about-us__icon {
    width: 170px;
    height: 170px;
    flex-shrink: 0;
    display: flex;
    align-items: center;
    justify-content: center;
}

.fomo-about-us__icon img {
    width: 170px;
    height: 170px;
    object-fit: contain;
    display: block;
}

.fomo-about-us__card-title {
    margin: 0;
    color: #ffffff;
    font-family: 'Poppins', system-ui, -apple-system, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
    font-size: 24px;
    line-height: 32px;
    font-weight: 600;
    text-transform: capitalize;
}

.fomo-about-us__card-text {
    margin: 0;
    color: #bdbdbd;
    font-family: 'Poppins', system-ui, -apple-system, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
    font-size: 16px;
    line-height: 26px;
    font-weight: 400;
}

@media (max-width: 991.98px) {
    .fomo-about-us__title { font-size: 40px; line-height: 52px; letter-spacing: -1.2px; }
    .fomo-about-us__subtitle { font-size: 18px; line-height: 28px; }
    .fomo-about-us__grid { grid-template-columns: 1fr; }
    .fomo-about-us__card { height: auto; min-height: 380px; }
}

@media (max-width: 575.98px) {
    .fomo-about-us__title { font-size: 30px; line-height: 40px; }
    .fomo-about-us__icon { width: 140px; height: 140px; }
    .fomo-about-us__icon img { width: 140px; height: 140px; }
}

/* ================= WORKFLOW (Figma: workflow) ================= */
.fomo-workflow {
    background: #0d0d0d;
    overflow: hidden;
}

.fomo-workflow__bg {
    position: absolute;
    inset: 0;
    pointer-events: none;
    z-index: 0;
    background: radial-gradient(55% 55% at 11% 51%, rgba(38, 220, 114, 0.22) 0%, rgba(38, 220, 114, 0) 65%);
    background-repeat: no-repeat;
    background-position: 0% 45%;
    /* background-size: min(900px, 70vw) min(900px, 70vw); */
    overflow: clip;
    opacity: .85;
    mix-blend-mode: screen;
}

.fomo-workflow__bg::after {
    content: '';
    position: absolute;
    inset: 0;
    background: url('../images/fomo_boost/trusted-bg-vector.svg') no-repeat 50% calc(10% + 240px) / max(1440px, 120vw) auto;
    transform: scaleX(-1);
    transform-origin: center center;
    pointer-events: none;
}

.fomo-workflow .fomo-section__inner {
    position: relative;
    z-index: 1;
}

.fomo-workflow__wrap {
    display: grid;
    grid-template-columns: 520px 1fr;
    gap: 56px;
    align-items: start;
}

.fomo-workflow__heading {
    padding-top: 6px;
}

.fomo-workflow__pill {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 6px 16px 7px;
    border-radius: 24px;
    border: 1px solid #01c853;
    background: rgba(41, 255, 130, 0.25);
    color: #ffffff;
    font-family: 'Poppins', system-ui, -apple-system, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
    font-size: 14px;
    line-height: 16px;
    font-weight: 400;
    text-transform: capitalize;
}

.fomo-workflow__title {
    margin: 22px 0 18px;
    font-family: 'Poppins', system-ui, -apple-system, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
    font-weight: 500;
    font-size: 56px;
    line-height: 72px;
    letter-spacing: -2.24px;
    text-transform: capitalize;
    background: linear-gradient(180deg, #ffffff 25.5%, #999999 118.5%);
    -webkit-background-clip: text;
    background-clip: text;
    color: transparent;
}

.fomo-workflow__subtitle {
    margin: 0;
    color: #bdbdbd;
    font-family: 'Poppins', system-ui, -apple-system, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
    font-size: 24px;
    line-height: 32px;
    font-weight: 400;
}

.fomo-workflow__timeline {
    position: relative;
    display: flex;
    flex-direction: column;
    gap: 80px;
    padding-left: 0;
}

.fomo-workflow__line {
    position: absolute;
    left: 36px;
    top: 0;
    width: 8px;
    height: 100%;
    background: rgba(212, 255, 230, 0.35);
    border-radius: 10px;
    overflow: hidden;
    z-index: 0;
    pointer-events: none;
}

.fomo-workflow__line-fill {
    display: block;
    width: 100%;
    height: 100%;
    background: linear-gradient(180deg, #29ff82 0%, #01c853 55%, #00a844 100%);
    border-radius: 10px;
    transform: scaleY(var(--fomo-workflow-fill, 0));
    transform-origin: top center;
    will-change: transform;
    box-shadow: 0 0 20px rgba(41, 255, 130, calc(var(--fomo-workflow-fill, 0) * 0.35));
}

.fomo-workflow__step {
    --fomo-step-fill: 0;
    position: relative;
    z-index: 1;
    display: grid;
    grid-template-columns: 80px 1fr;
    gap: 40px;
    align-items: start;
}

.fomo-workflow__step:first-of-type {
    --fomo-step-fill: 1;
}

.fomo-workflow__num {
    position: relative;
    width: 80px;
    height: 80px;
    border-radius: 120px;
    padding: 8px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: color-mix(
        in srgb,
        rgba(212, 255, 230, 0.12) calc((1 - var(--fomo-step-fill, 0)) * 100%),
        rgba(212, 255, 230, 0.55) calc(var(--fomo-step-fill, 0) * 100%)
    );
    box-shadow: 0 0 0 calc((1 - var(--fomo-step-fill, 0)) * 0px) rgba(41, 255, 130, 0);
}

.fomo-workflow__num::after {
    content: '';
    position: absolute;
    inset: 4px;
    border-radius: 999px;
    border: 2px solid rgba(41, 255, 130, 0.55);
    opacity: calc(var(--fomo-step-fill, 0) * (1 - var(--fomo-step-fill, 0)) * 4);
    transform: scale(calc(0.88 + var(--fomo-step-fill, 0) * 0.12));
    pointer-events: none;
}

.fomo-workflow__step.is-current .fomo-workflow__num::after {
    animation: fomo-workflow-marker-pulse 1.4s ease-out infinite;
}

.fomo-workflow__num > span {
    position: relative;
    z-index: 1;
    width: 64px;
    height: 64px;
    border-radius: 120px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: color-mix(
        in srgb,
        transparent calc((1 - var(--fomo-step-fill, 0)) * 100%),
        #01c853 calc(var(--fomo-step-fill, 0) * 100%)
    );
    border: 2px solid color-mix(
        in srgb,
        rgba(1, 200, 83, 0.22) calc((1 - var(--fomo-step-fill, 0)) * 100%),
        #01c853 calc(var(--fomo-step-fill, 0) * 100%)
    );
    color: color-mix(
        in srgb,
        rgba(255, 255, 255, 0.4) calc((1 - var(--fomo-step-fill, 0)) * 100%),
        #ffffff calc(var(--fomo-step-fill, 0) * 100%)
    );
    font-family: 'Poppins', system-ui, -apple-system, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
    font-size: 24px;
    line-height: 32px;
    font-weight: 500;
    transform: scale(calc(0.92 + (var(--fomo-step-fill, 0) * 0.08)));
    box-shadow: 0 0 calc(var(--fomo-step-fill, 0) * 18px) rgba(1, 200, 83, calc(var(--fomo-step-fill, 0) * 0.45));
}

.fomo-workflow__step.is-complete .fomo-workflow__num {
    background: rgba(212, 255, 230, 0.5);
    box-shadow: none;
}

.fomo-workflow__step.is-complete .fomo-workflow__num > span {
    background: #01c853;
    border-color: #01c853;
    color: #ffffff;
    transform: scale(1);
    box-shadow: 0 0 12px rgba(1, 200, 83, 0.35);
}

.fomo-workflow__step.is-current .fomo-workflow__num > span {
    box-shadow: 0 0 22px rgba(41, 255, 130, 0.55);
}

@keyframes fomo-workflow-marker-pulse {
    0% {
        transform: scale(0.9);
        opacity: 0.75;
    }
    100% {
        transform: scale(1.18);
        opacity: 0;
    }
}

.fomo-workflow__content {
    display: flex;
    flex-direction: column;
    gap: 16px;
    min-width: 0;
    opacity: calc(0.38 + (var(--fomo-step-fill, 0) * 0.62));
    transform: translateY(calc(16px * (1 - var(--fomo-step-fill, 0))));
    filter: blur(calc((1 - var(--fomo-step-fill, 0)) * 2px));
}

.fomo-workflow__step.is-active .fomo-workflow__content {
    filter: blur(0);
}

.fomo-workflow__step:first-of-type .fomo-workflow__content {
    opacity: 1;
    transform: translateY(0);
    filter: blur(0);
}

.fomo-workflow__step:first-of-type .fomo-workflow__num {
    background: rgba(212, 255, 230, 0.5);
}

.fomo-workflow__step:first-of-type .fomo-workflow__num > span {
    background: #01c853;
    border-color: #01c853;
    color: #ffffff;
    transform: scale(1);
    box-shadow: 0 0 12px rgba(1, 200, 83, 0.35);
}

@media (prefers-reduced-motion: reduce) {
    .fomo-workflow__line-fill {
        transform: scaleY(1) !important;
        box-shadow: none;
    }

    .fomo-workflow__step {
        --fomo-step-fill: 1;
    }

    .fomo-workflow__num::after {
        animation: none !important;
        opacity: 0 !important;
    }

    .fomo-workflow__step .fomo-workflow__content,
    .fomo-workflow__step.is-active .fomo-workflow__content {
        opacity: 1;
        transform: none;
        filter: none;
    }

    .fomo-workflow__step .fomo-workflow__num > span,
    .fomo-workflow__step.is-complete .fomo-workflow__num > span {
        background: #01c853;
        border-color: #01c853;
        color: #ffffff;
        transform: none;
        box-shadow: none;
    }
}

.fomo-workflow__icon {
    width: 56px;
    height: 56px;
    border-radius: 12px;
    display: flex;
    align-items: center;
    justify-content: center;
    /* background: rgba(255,255,255,0.02); */
    /* border: 1px solid rgba(255,255,255,0.08); */
    color: #ffffff;
    font-size: 22px;
}

.fomo-workflow__step-title {
    margin: 0;
    color: #ffffff;
    font-family: 'Poppins', system-ui, -apple-system, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
    font-size: 24px;
    line-height: 32px;
    font-weight: 500;
}

.fomo-workflow__step-text {
    margin: 0;
    color: #ffffff;
    font-family: 'Poppins', system-ui, -apple-system, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
    font-size: 16px;
    line-height: 26px;
    font-weight: 400;
    opacity: .92;
}

.fomo-workflow__hint {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 6px 12px;
    border-radius: 10px;
    background: #162416;
    color: #ffffff;
    font-family: 'Poppins', system-ui, -apple-system, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
    font-size: 12px;
    line-height: 18px;
    font-weight: 500;
    width: fit-content;
}

.fomo-workflow__dot {
    width: 6px;
    height: 6px;
    border-radius: 999px;
    background: #00c769;
    flex: 0 0 auto;
}

@media (max-width: 1199.98px) {
    .fomo-workflow__wrap { grid-template-columns: 1fr; gap: 44px; }
    .fomo-workflow__line { left: 22px; }
    .fomo-workflow__step { grid-template-columns: 80px 1fr; gap: 24px; }
}

@media (max-width: 575.98px) {
    .fomo-workflow__title { font-size: 32px; line-height: 42px; letter-spacing: -1px; }
    .fomo-workflow__subtitle { font-size: 18px; line-height: 28px; }
    .fomo-workflow__line { left: 18px; }
    .fomo-workflow__step { grid-template-columns: 64px 1fr; }
    .fomo-workflow__num { width: 64px; height: 64px; }
    .fomo-workflow__num > span { width: 52px; height: 52px; font-size: 18px; }
}

/* ================= INTEGRATION / NOTIFICATION TYPES (Figma: integration) ================= */
.fomo-integration {
    background: #0d0d0d;
}

.fomo-integration.fomo-integration--stack {
    overflow: visible;
}

.fomo-section.fomo-integration--stack {
    overflow: visible;
    position: relative;
    z-index: 2;
}

.fomo-integration__header {
    text-align: center;
    max-width: 1042px;
    margin: 0 auto 32px;
}

.fomo-integration__pill {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 6px 16px 8px;
    border-radius: 24px;
    border: 1px solid #00952a;
    background: rgba(41, 255, 130, 0.25);
    color: #ffffff;
    font-family: 'Poppins', system-ui, -apple-system, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
    font-size: 16px;
    line-height: 26px;
    font-weight: 400;
    text-transform: lowercase;
}

.fomo-integration__title {
    margin: 24px auto 24px;
    font-family: 'Poppins', system-ui, -apple-system, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
    font-weight: 500;
    font-size: 56px;
    line-height: 72px;
    letter-spacing: -2.24px;
    text-transform: capitalize;
    background: linear-gradient(180deg, #ffffff 25.5%, #999999 118.5%);
    -webkit-background-clip: text;
    background-clip: text;
    color: transparent;
}

.fomo-integration__subtitle {
    margin: 0 auto;
    max-width: 546px;
    color: #bdbdbd;
    font-family: 'Poppins', system-ui, -apple-system, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
    font-size: 24px;
    line-height: 32px;
}

.fomo-integration__list {
    display: flex;
    flex-direction: column;
    gap: 32px;
}

@media (min-width: 1200px) and (prefers-reduced-motion: no-preference) {
    .fomo-integration__stack {
        --fomo-integration-stack-pull: 360px;
        position: relative;
        gap: 0;
        height: 504px;
        min-height: 504px;
        overflow: visible;
        perspective: 1100px;
        perspective-origin: 50% 100%;
    }

    .fomo-integration__stack.is-stack-active {
        margin-top: calc(-1 * var(--fomo-integration-stack-pull));
        margin-bottom: var(--fomo-integration-stack-pull);
    }

    .fomo-integration__stack .fomo-integration__card-wrap {
        --fomo-stack-top: calc(var(--fomo-nav-height, 122px) + 20px);
        position: absolute;
        top: 0;
        left: 0;
        right: 0;
        height: 504px;
        z-index: 1;
        overflow: visible;
        transform-style: preserve-3d;
    }

    .fomo-integration__stack .fomo-integration__card-wrap.is-stack-front {
        z-index: 10;
    }

    .fomo-integration__stack .fomo-integration__card-wrap.is-stack-waiting {
        z-index: 0;
        pointer-events: none;
        visibility: hidden;
    }

    .fomo-integration__stack .fomo-integration__card-wrap.is-stack-entering {
        z-index: 11;
        visibility: visible;
    }

    .fomo-integration__stack .fomo-integration__card-wrap.is-stack-buried {
        z-index: 2;
        visibility: visible;
    }

    .fomo-integration__stack .fomo-integration__card {
        height: 504px;
        padding: 0;
        background: transparent;
        border: none;
        display: block;
        transform-style: preserve-3d;
    }

    .fomo-integration__stack .fomo-integration__card-inner {
        transform-origin: 50% 0%;
        transform-style: preserve-3d;
        box-shadow: 0 24px 64px rgba(0, 0, 0, 0.35);
        will-change: transform;
    }
}

.fomo-integration__card {
    height: 504px;
}

.fomo-integration__card-inner {
    display: grid;
    grid-template-columns: 515px 1fr;
    gap: 40px;
    padding: 32px;
    height: 100%;
    border-radius: 40px;
    background: #1a1a1a;
    border: 1px solid rgba(74, 74, 74, 0.7);
    align-items: start;
    box-sizing: border-box;
}

.fomo-integration__card--reverse .fomo-integration__card-inner {
    grid-template-columns: 1fr 515px;
}

.fomo-integration__media {
    height: 440px;
    border-radius: 20px;
    overflow: hidden;
    border: 1px solid rgba(74, 74, 74, 0.7);
    background: #1a1a1a;
}

.fomo-integration__media img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
}

.fomo-integration__content {
    height: 440px;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    min-width: 0;
}

.fomo-integration__tag {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 6px 16px 7px;
    border-radius: 24px;
    border: 1px solid #01c853;
    background: rgba(41, 255, 130, 0.25);
    color: #ffffff;
    font-family: 'Poppins', system-ui, -apple-system, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
    font-size: 14px;
    line-height: 16px;
    font-weight: 400;
    text-transform: capitalize;
    width: fit-content;
}

.fomo-integration__card-title {
    margin: 16px 0 0;
    font-family: 'Poppins', system-ui, -apple-system, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
    font-weight: 600;
    font-size: 32px;
    line-height: 40px;
    letter-spacing: -0.64px;
    background: linear-gradient(180deg, #ffffff 25.5%, #999999 118.5%);
    -webkit-background-clip: text;
    background-clip: text;
    color: transparent;
    max-width: 534px;
}

.fomo-integration__text {
    margin: 12px 0 0;
    color: #bdbdbd;
    font-family: 'Poppins', system-ui, -apple-system, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
    font-size: 16px;
    line-height: 26px;
    max-width: 560px;
}

.fomo-integration__bullets {
    list-style: none;
    padding: 0;
    margin: 24px 0 0;
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 16px 54px;
    max-width: 460px;
}

.fomo-integration__bullets li {
    position: relative;
    padding-left: 14px;
    font-family: 'Poppins', system-ui, -apple-system, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
    font-size: 14px;
    line-height: 16px;
    font-weight: 600;
    color: #ffffff;
}

.fomo-integration__bullets li::before {
    content: '';
    width: 6px;
    height: 6px;
    border-radius: 999px;
    background: #00e676;
    position: absolute;
    left: 0;
    top: 5px;
}

.fomo-integration__btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 12px;
    padding: 12px 24px;
    border-radius: 80px;
    background: #01c853;
    color: #0d0d0d !important;
    text-decoration: none !important;
    font-family: 'Poppins', system-ui, -apple-system, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
    font-size: 16px;
    line-height: 26px;
    font-weight: 500;
    width: fit-content;
    transition: transform .15s ease, background .15s ease;
}

.fomo-integration__btn:hover {
    transform: translateY(-1px);
    background: color-mix(in srgb, #01c853 92%, #000 8%);
}
.fomo-integration__btn:hover svg {
    transform: translateX(4px);
}

.fomo-integration__btn-icon {
    width: 24px;
    height: 24px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    color: #000;
}


@media (max-width: 1199.98px) {
    .fomo-integration__card-wrap {
        display: contents;
    }

    .fomo-integration__card {
        height: auto;
    }

    .fomo-integration__card-inner,
    .fomo-integration__card--reverse .fomo-integration__card-inner {
        grid-template-columns: 1fr;
        height: auto;
    }

    .fomo-integration__content {
        height: auto;
        gap: 18px;
    }

    .fomo-integration__media {
        width: 100%;
        max-width: 720px;
    }
}

@media (max-width: 575.98px) {
    .fomo-integration__title { font-size: 32px; line-height: 42px; letter-spacing: -1px; }
    .fomo-integration__subtitle { font-size: 18px; line-height: 28px; }
    .fomo-integration__bullets { grid-template-columns: 1fr; gap: 14px; }
}

/* ================= NUMBERS / KEY METRICS (Figma: number) ================= */
.fomo-numbers {
    background: #0d0d0d;
    position: relative;
    z-index: 1;
}

.fomo-numbers__grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 40px;
    padding: 80px 0;
}

.fomo-numbers__item {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 16px;
    text-align: center;
    min-width: 0;
}

.fomo-numbers__value {
    font-family: 'Poppins', system-ui, -apple-system, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
    font-weight: 600;
    font-size: 56px;
    line-height: 72px;
    letter-spacing: -1.12px;
    background: linear-gradient(180deg, #ffffff 25.5%, #999999 118.5%);
    -webkit-background-clip: text;
    background-clip: text;
    color: transparent;
}

.fomo-numbers__label {
    font-family: 'Poppins', system-ui, -apple-system, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
    font-weight: 400;
    font-size: 20px;
    line-height: 32px;
    color: #bdbdbd;
    white-space: nowrap;
}

@media (max-width: 991.98px) {
    .fomo-numbers__grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 28px 24px;
        padding: 64px 0;
    }

    .fomo-numbers__label {
        white-space: normal;
    }
}

@media (max-width: 575.98px) {
    .fomo-numbers__grid {
        grid-template-columns: 1fr;
        gap: 24px;
        padding: 56px 0;
    }

    .fomo-numbers__value {
        font-size: 40px;
        line-height: 52px;
    }
}

/* ================= COMPARISON (Figma: testimonial) ================= */
.fomo-comparison {
    position: relative;
    background: #0d0d0d;
    padding: 120px 0;
    overflow: hidden;
}

.fomo-comparison .fomo-section__inner {
    max-width: 1240px;
}

.fomo-comparison__heading {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 24px;
    margin: 0 auto 64px;
    text-align: center;
}

.fomo-comparison__pill {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 6px 16px 8px;
    border-radius: 24px;
    border: 1px solid #00952a;
    background: rgba(41, 255, 130, 0.25);
    color: #ffffff;
    font-family: 'Poppins', system-ui, -apple-system, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
    font-size: 16px;
    line-height: 26px;
    font-weight: 400;
    text-transform: capitalize;
}

.fomo-comparison__title {
    margin: 0;
    max-width: 628px;
    font-family: 'Poppins', system-ui, -apple-system, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
    font-weight: 500;
    font-size: 56px;
    line-height: 72px;
    letter-spacing: -2.24px;
    text-transform: capitalize;
    background: linear-gradient(180deg, #ffffff 25.5%, #999999 118.5%);
    -webkit-background-clip: text;
    background-clip: text;
    color: transparent;
}

.fomo-comparison__table-wrap {
    position: relative;
    border: 1px solid #252525;
    border-radius: 40px;
    overflow: hidden;
    background: #0f1110;
}

.fomo-comparison__table-wrap::before,
.fomo-comparison__table-wrap::after {
    content: '';
    position: absolute;
    top: 0;
    bottom: 0;
    width: 150px;
    pointer-events: none;
    z-index: 3;
}

.fomo-comparison__table-wrap::before {
    left: 0;
    /* background: linear-gradient(90deg, #0d0d0d 5.875%, rgba(13, 13, 13, 0) 100%); */
}

.fomo-comparison__table-wrap::after {
    right: 0;
    background: linear-gradient(270deg, #0d0d0d 9.333%, rgba(13, 13, 13, 0) 100%);
}

.fomo-comparison__table {
    width: 100%;
    color: #ffffff;
    position: relative;
}

.fomo-comparison__head {
    position: relative;
    height: 64px;
    background: #000000;
    z-index: 4;
}

.fomo-comparison__head-inner {
    position: absolute;
    left: 38px;
    top: 15.91px;
    width: 791.188px;
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.fomo-comparison__feature-head {
    font-family: 'Poppins', system-ui, -apple-system, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
    font-size: 24px;
    line-height: 32px;
    font-weight: 600;
}

.fomo-comparison__plans {
    display: inline-flex;
    align-items: center;
    gap: 50px;
}

.fomo-comparison__plan-chip {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 4px 12px;
    border-radius: 10px;
    background: rgba(0, 230, 118, 0.1);
    color: #00e676;
    font-family: 'Poppins', system-ui, -apple-system, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
    font-size: 14px;
    line-height: 16px;
    font-weight: 600;
}

.fomo-comparison__plan-label {
    color: #666666;
    font-family: 'Inter', 'Poppins', system-ui, -apple-system, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
    font-size: 13.12px;
    line-height: 19.68px;
    font-weight: 500;
}

.fomo-comparison__body {
    position: relative;
    z-index: 2;
}

.fomo-comparison__row {
    display: grid;
    grid-template-columns: 518px 180px 180px;
    align-items: center;
    height: 65px;
    background: #0f1110;
    border-top: 1px solid #1a1a1a;
}

.fomo-comparison__feature-cell {
    padding: 0 24px 0 33px;
    color: #ffffff;
    font-family: 'Poppins', system-ui, -apple-system, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
    font-size: 14px;
    line-height: 16px;
    font-weight: 500;
}

.fomo-comparison__status-cell {
    display: flex;
    align-items: center;
    justify-content: center;
}

.fomo-comparison__status {
    width: 24px;
    height: 24px;
    border-radius: 999px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
}

.fomo-comparison__status img {
    width: 14px;
    height: 14px;
    display: block;
}

.fomo-comparison__status--check {
    background: rgba(0, 230, 118, 0.15);
}

.fomo-comparison__status--cross {
    background: rgba(68, 90, 71, 0.15);
}

.fomo-comparison__status--minus {
    background: rgba(68, 90, 71, 0.3);
}

@media (max-width: 991.98px) {
    .fomo-comparison {
        padding: 88px 0;
    }

    .fomo-comparison__title {
        font-size: 40px;
        line-height: 52px;
        letter-spacing: -1.2px;
    }

    .fomo-comparison__table-wrap {
        overflow-x: auto;
        border-radius: 28px;
    }

    .fomo-comparison__table {
        min-width: 980px;
    }

    .fomo-comparison__head-inner {
        width: 848.188px;
    }
}

@media (max-width: 575.98px) {
    .fomo-comparison__title {
        font-size: 32px;
        line-height: 42px;
        letter-spacing: -1px;
    }

    .fomo-comparison__feature-head {
        font-size: 18px;
        line-height: 24px;
    }

    .fomo-comparison__feature-cell {
        font-size: 13px;
    }
}

/* ================= INTEGRATION STACK (Figma: integration 1291-30515) ================= */
.fomo-stack {
    position: relative;
    background: #0d0d0d;
    padding: 120px 0;
    overflow: hidden;
}

.fomo-stack .fomo-section__inner {
    max-width: 1240px;
}

.fomo-stack__heading {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 24px;
    margin: 0 auto 64px;
    text-align: center;
}

.fomo-stack__pill {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 6px 16px 8px;
    border-radius: 24px;
    border: 1px solid #29ff82;
    background: rgba(41, 255, 130, 0.25);
    color: #ffffff;
    font-family: 'Poppins', system-ui, -apple-system, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
    font-size: 16px;
    line-height: 26px;
    font-weight: 400;
}

.fomo-stack__title {
    margin: 0 auto;
    max-width: 1034px;
    font-family: 'Poppins', system-ui, -apple-system, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
    font-weight: 500;
    font-size: 56px;
    line-height: 72px;
    letter-spacing: -1.12px;
    text-transform: capitalize;
    text-align: center;
    background: linear-gradient(180deg, #ffffff 25.5%, #999999 118.5%);
    -webkit-background-clip: text;
    background-clip: text;
    color: transparent;
}

.fomo-stack__subtitle {
    margin: 0 auto;
    max-width: 801px;
    color: #bdbdbd;
    font-family: 'Poppins', system-ui, -apple-system, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
    font-size: 24px;
    line-height: 32px;
    font-weight: 400;
    text-align: center;
}

.fomo-stack__diagram {
    position: relative;
    width: 100%;
    max-width: 1240px;
    margin: 0 auto;
    aspect-ratio: 1240 / 600;
}

.fomo-stack__lines {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    overflow: visible;
    pointer-events: none;
    transform: translateZ(0);
    contain: layout style;
}

.fomo-stack__line-base {
    stroke: rgba(41, 255, 130, 0.12);
    stroke-width: 1.5;
    vector-effect: non-scaling-stroke;
}

.fomo-stack__line-glow {
    stroke: url(#fomoStackBeamGrad0);
    stroke-width: 2.5;
    stroke-linecap: round;
    stroke-linejoin: round;
    vector-effect: non-scaling-stroke;
    opacity: 0;
    filter: drop-shadow(0 0 4px rgba(41, 255, 130, 0.55)) drop-shadow(0 0 9px rgba(41, 255, 130, 0.35));
}

.fomo-stack__diagram::before {
    content: '';
    position: absolute;
    left: 50%;
    top: 50%;
    width: 42%;
    aspect-ratio: 1 / 1;
    transform: translate(-50%, -50%);
    border-radius: 50%;
    background: radial-gradient(circle, rgba(41, 255, 130, 0.34) 0%, rgba(41, 255, 130, 0.12) 42%, rgba(41, 255, 130, 0) 72%);
    pointer-events: none;
    z-index: 1;
}

.fomo-stack.is-lines-animated .fomo-stack__center {
    animation: fomo-stack-hub-pulse 4.5s ease-in-out infinite;
}

@keyframes fomo-stack-hub-pulse {
    0%, 100% {
        box-shadow:
            inset 0 1px 0 rgba(255, 255, 255, 0.06),
            0 30px 80px rgba(0, 0, 0, 0.55),
            0 0 40px rgba(41, 255, 130, 0.28);
    }

    50% {
        box-shadow:
            inset 0 1px 0 rgba(255, 255, 255, 0.06),
            0 30px 80px rgba(0, 0, 0, 0.55),
            0 0 110px rgba(41, 255, 130, 0.5),
            0 0 45px rgba(41, 255, 130, 0.45);
    }
}

@media (prefers-reduced-motion: reduce) {
    .fomo-stack.is-lines-animated .fomo-stack__center {
        animation: none;
    }
}

.fomo-stack__lines--mobile {
    display: none;
}

/* Central FOMO logo bubble (400 x 400) */
.fomo-stack__center {
    position: absolute;
    left: 50%;
    top: 50%;
    width: 33.33%;
    aspect-ratio: 1 / 1;
    transform: translate(-50%, -50%);
    border-radius: 50%;
    background:
        radial-gradient(circle at 35% 30%, rgba(255, 255, 255, 0.08) 0%, rgba(255, 255, 255, 0) 60%),
        radial-gradient(circle at 50% 50%, #1a1a1a 0%, #0d0d0d 75%);
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.06),
        0 30px 80px rgba(0, 0, 0, 0.55);
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 2;
}

.fomo-stack__center-inner {
    width: 49%;
    aspect-ratio: 1 / 1;
    display: flex;
    align-items: center;
    justify-content: center;
}

.fomo-stack__center-inner img {
    width: 100%;
    height: 100%;
    object-fit: contain;
    display: block;
    filter: drop-shadow(0 8px 24px rgba(0, 199, 105, 0.35));
}

/* Logo bubbles — 104.7px @ 1240px container */
.fomo-stack__node {
    position: absolute;
    width: 8.44%;
    aspect-ratio: 1 / 1;
    transform: translate(-50%, -50%);
    background: #fcfcfc;
    border: 1px solid rgba(41, 255, 130, 0.7);
    border-radius: 50%;
    z-index: 3;
    overflow: hidden;
    transition: box-shadow 0.55s ease, border-color 0.55s ease;
}

/* Beam arrival feedback — node briefly lights up as a beam reaches it */
.fomo-stack__node.is-active {
    border-color: #29ff82;
    box-shadow:
        0 0 0 1px rgba(41, 255, 130, 0.85),
        0 0 24px rgba(41, 255, 130, 0.6);
}

@media (prefers-reduced-motion: reduce) {
    .fomo-stack__node {
        transition: none;
    }

    .fomo-stack__node.is-active {
        box-shadow: none;
        border-color: rgba(41, 255, 130, 0.7);
    }
}

.fomo-stack__node-inner {
    position: absolute;
    inset: 18%;
    display: flex;
    align-items: center;
    justify-content: center;
}

.fomo-stack__node-inner img {
    max-width: 100%;
    max-height: 100%;
    width: auto;
    height: auto;
    object-fit: contain;
    display: block;
}

/* Positions: x = (center_px / 1240), y = (center_px / 600) */
.fomo-stack__node--lt { left: 19.11%; top: 16.67%; }   /* 237, 100  */
.fomo-stack__node--lm { left: 6.05%;  top: 50%;     }   /*  75, 300  */
.fomo-stack__node--lb { left: 19.11%; top: 83.33%; }   /* 237, 500  */
.fomo-stack__node--rt { left: 80.89%; top: 16.67%; }   /* 1003, 100 */
.fomo-stack__node--rm { left: 93.95%; top: 50%;     }   /* 1165, 300 */
.fomo-stack__node--rb { left: 80.89%; top: 83.33%; }   /* 1003, 500 */

@media (max-width: 991.98px) {
    .fomo-stack {
        padding: 88px 0;
    }

    .fomo-stack__title {
        font-size: 40px;
        line-height: 52px;
        letter-spacing: -0.8px;
    }

    .fomo-stack__subtitle {
        font-size: 18px;
        line-height: 28px;
    }
}

@media (max-width: 575.98px) {
    .fomo-stack__title {
        font-size: 28px;
        line-height: 38px;
        letter-spacing: -0.6px;
    }

    .fomo-stack__subtitle {
        font-size: 16px;
        line-height: 26px;
    }
}

/* ================= PRICING (Figma 1291:57405) ================= */
.fomo-pricing {
    position: relative;
    background: #0a0a0a;
    color: #ffffff;
    padding: 80px 0;
    overflow: visible;
}

.fomo-pricing__inner {
    width: 100%;
    max-width: 1240px;
    margin: 0 auto;
    padding: 0 24px;
    overflow: visible;
}

/* ----- Header (pill, title, subtitle, toggle) ----- */
.fomo-pricing__header {
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
    margin-bottom: 53px;
}

.fomo-pricing__pill {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 7px 19px 9px;
    margin-bottom: 53px;
    border: 1.161px solid #29ff82;
    background: rgba(41, 255, 130, 0.25);
    border-radius: 28px;
    box-shadow: 0 0 0 4.65px rgba(41, 255, 130, 0.06);
    color: #ffffff;
    font-family: 'Poppins', system-ui, -apple-system, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
    font-weight: 400;
    font-size: 18.581px;
    line-height: 30.194px;
}

.fomo-pricing__title {
    margin: 0 0 24px;
    font-family: 'Poppins', system-ui, -apple-system, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
    font-weight: 600;
    font-size: 56px;
    line-height: 72px;
    letter-spacing: -1.12px;
    overflow-wrap: anywhere;
    color: #ffffff;
}

.fomo-pricing__subtitle {
    margin: 0 0 53px;
    max-width: 593px;
    font-family: 'Poppins', system-ui, -apple-system, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
    font-weight: 400;
    font-size: 24px;
    line-height: 32px;
    overflow-wrap: anywhere;
    color: #bdbdbd;
}

/* ----- Frequency Toggle (Figma 1753:34185) ----- */
.fomo-pricing__toggle {
    position: relative;
    display: grid;
    grid-template-columns: 1fr 1fr;
    align-items: center;
    width: 100%;
    max-width: 369px;
    min-height: 48.782px;
    background: #1a1a1a;
    border: 0.871px solid #22c55e;
    border-radius: 45.728px;
    padding: 0;
    overflow: hidden;
    isolation: isolate;
}

/* Sliding green pill — inset radius smaller than track (40px vs 45.728px) */
.fomo-pricing__toggle::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 50%;
    height: 100%;
    background: #22c55e;
    border-radius: 40px;
    backdrop-filter: blur(8.711px);
    -webkit-backdrop-filter: blur(8.711px);
    transition: transform 0.25s cubic-bezier(0.4, 0, 0.2, 1);
    z-index: 0;
    pointer-events: none;
}

.fomo-pricing__toggle[data-active='monthly']::before {
    transform: translateX(100%);
}

.fomo-pricing__toggle--single::before {
    width: 100%;
    transform: none;
}

.fomo-pricing__toggle-option {
    position: relative;
    z-index: 1;
    appearance: none;
    -webkit-appearance: none;
    border: 0;
    outline: 0;
    background: transparent;
    margin: 0;
    padding: 13.938px 20.907px;
    min-width: 0;
    border-radius: 0;
    color: #d7d7d7;
    font-family: 'Plus Jakarta Sans', 'Poppins', system-ui, -apple-system, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
    font-weight: 600;
    font-size: 15.68px;
    line-height: 1.4;
    cursor: pointer;
    transition: color 0.2s ease;
}

.fomo-pricing__toggle-option:focus-visible {
    outline: 2px solid var(--fomo-accent);
    outline-offset: 2px;
}

.fomo-pricing__toggle-option.is-active {
    color: #ffffff;
}

/* ----- Pricing Card Grid ----- */
.fomo-pricing__grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 28px;
    align-items: stretch;
    width: 100%;
    padding-top: 14px;
}

/* ----- Card (Figma PricingCard — max 289px content width) ----- */
.fomo-pricing__card {
    position: relative;
    display: flex;
    flex-direction: column;
    align-items: stretch;
    gap: 22px;
    width: 100%;
    min-width: 0;
    padding: 48px 42px;
    background: #1a1a1a;
    border: 1.286px solid rgba(255, 255, 255, 0.08);
    border-radius: 18.581px;
    color: #ffffff;
    overflow: visible;
    transition: transform 0.25s ease, border-color 0.25s ease, box-shadow 0.25s ease;
}

.fomo-pricing__card:hover {
    transform: translateY(-4px);
    border-color: rgba(34, 197, 94, 0.4);
}

/* Highlighted plan when admin Tag field is set (e.g. Most Popular) */
.fomo-pricing__card--popular {
    border: 1.286px solid #00c769 !important;
    box-shadow: 0 0 18.581px rgba(34, 197, 94, 0.24);
    z-index: 2;
}

.fomo-pricing__card--popular:hover {
    border-color: #00c769 !important;
    box-shadow: 0 0 22px rgba(34, 197, 94, 0.32);
}

.fomo-pricing__badge {
    position: absolute;
    top: -11.29px;
    left: calc(50% + 0.5px);
    transform: translateX(-50%);
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background: #22c55e;
    color: #ffffff;
    font-family: 'Poppins', system-ui, -apple-system, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
    font-weight: 600;
    font-size: 14px;
    line-height: 16px;
    padding: 10px 20px;
    border-radius: 999px;
    white-space: nowrap;
    letter-spacing: 0;
    z-index: 1;
}

.fomo-pricing__card-head {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 22px;
    width: 100%;
}

.fomo-pricing__plan-name {
    margin: 0;
    font-family: 'Poppins', system-ui, -apple-system, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
    font-weight: 600;
    font-size: 32px;
    line-height: 40px;
    letter-spacing: -0.64px;
    overflow-wrap: anywhere;
    color: #ffffff;
}

.fomo-pricing__price {
    display: flex;
    align-items: baseline;
    flex-wrap: wrap;
    color: #ffffff;
    font-family: 'Poppins', system-ui, -apple-system, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
    line-height: 1;
    min-height: 65px;
}

.fomo-pricing__price-block {
    display: inline-flex;
    align-items: baseline;
    flex-wrap: nowrap;
    line-height: 1;
}

.fomo-pricing__price-block[hidden] {
    display: none !important;
}

.fomo-pricing__price-currency {
    font-weight: 500;
    font-size: 66px;
    line-height: 65.033px;
    letter-spacing: -1px;
    color: #ffffff;
}

.fomo-pricing__price-value {
    font-weight: 500;
    font-size: 65.033px;
    line-height: 65.033px;
    letter-spacing: -1px;
    color: #ffffff;
}

.fomo-pricing__price-block .fomo-pricing__price-value {
    font-size: 66px;
    line-height: 65.033px;
}

.fomo-pricing__price-suffix {
    margin-left: 0;
    font-family: 'Poppins', system-ui, -apple-system, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
    font-weight: 400;
    font-size: 20px;
    line-height: 32px;
    color: #acacac;
}

.fomo-pricing__plan-desc {
    margin: 0;
    font-family: 'Poppins', system-ui, -apple-system, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
    font-weight: 400;
    font-size: 16px;
    line-height: 26px;
    color: #bdbdbd;
    min-height: 78px;
    max-height: 78px;
    overflow: hidden;
    overflow-wrap: break-word;
    word-break: break-word;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 3;
    text-overflow: ellipsis;
}

/* ----- CTA Button (Figma Button) ----- */
.fomo-pricing__cta {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    padding: 12px 38px;
    border: 1.286px solid rgba(255, 255, 255, 0.9);
    border-radius: 13.936px;
    background: transparent;
    color: #ffffff;
    font-family: 'Poppins', system-ui, -apple-system, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
    font-weight: 600;
    font-size: 20px;
    line-height: 32px;
    text-decoration: none;
    transition: background 0.2s ease, color 0.2s ease, border-color 0.2s ease;
    cursor: pointer;
    box-sizing: border-box;
}

.fomo-pricing__cta:hover,
.fomo-pricing__cta:focus-visible {
    background: rgba(255, 255, 255, 0.06);
    color: #ffffff;
    text-decoration: none;
    border-color: #ffffff;
}

.fomo-pricing__cta--solid {
    background: #ffffff;
    color: #000000;
    border-color: rgba(255, 255, 255, 0.9);
}

.fomo-pricing__cta--solid span {
    color: #000000;
}

.fomo-pricing__cta--solid:hover,
.fomo-pricing__cta--solid:focus-visible {
    background: #f3f3f3;
    color: #000000;
    border-color: #ffffff;
}

/* ----- Divider ----- */
.fomo-pricing__divider {
    display: block;
    width: 100%;
    height: 1.146px;
    background: rgba(255, 255, 255, 0.08);
}

/* ----- Features list ----- */
.fomo-pricing__features {
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
    flex-direction: column;
    gap: 13.93px;
}

/* The included partial uses .pricing-feature-list / .pricing-feature classes — restyle them inside our card */
.fomo-pricing__features .pricing-feature-list,
.fomo-pricing__card .pricing-feature-list {
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
    flex-direction: column;
    gap: 13.93px;
}

.fomo-pricing__features-wrap {
    width: 100%;
}

/* Figma FeatureRow (icon left, label right) */
.fomo-pricing__card .fomo-pricing-feature {
    display: flex;
    align-items: flex-start;
    gap: 11.598px;
    padding: 0;
    margin: 0;
    font-family: 'Poppins', system-ui, -apple-system, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
    font-weight: 400;
    font-size: 16px;
    line-height: 26px;
    color: #ffffff;
    border: 0;
    background: transparent;
    list-style: none;
}

.fomo-pricing-feature__status {
    flex: 0 0 auto;
    width: 20.885px;
    height: 20.885px;
    padding: 4.06px;
    box-sizing: border-box;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 10.442px;
    margin-top: 2px;
}

.fomo-pricing-feature__status--yes {
    background: rgba(34, 197, 94, 0.12);
}

.fomo-pricing-feature__status--no {
    background: rgba(255, 255, 255, 0.04);
}

.fomo-pricing-feature__status img {
    width: 12.764px;
    height: 12.764px;
    display: block;
}

.fomo-pricing-feature__label {
    flex: 1 1 auto;
    min-width: 0;
    text-align: left;
    color: #ffffff;
}

.fomo-pricing-feature__label .small.text-muted {
    color: #6b6b6b;
    font-size: inherit;
    line-height: inherit;
    background: none !important;
    background-image: none !important;
}

.fomo-pricing-feature__label strong {
    color: #ffffff;
    font-weight: 600;
}

.fomo-pricing-feature__info {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    margin-left: 6px;
    vertical-align: middle;
    line-height: 0;
    cursor: help;
}

.fomo-pricing-feature__info img {
    display: block;
    width: 14px;
    height: 14px;
}

.fomo-pricing-feature--view-all {
    list-style: none;
}

.fomo-pricing-feature__view-all {
    width: 100%;
    margin-top: 6px;
    padding: 8px 12px;
    background: transparent;
    border: 1px dashed rgba(255, 255, 255, 0.18);
    color: #bdbdbd;
    border-radius: 10px;
    font-family: 'Poppins', system-ui, -apple-system, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
    font-weight: 500;
    font-size: 13px;
    line-height: 20px;
    cursor: pointer;
}

.fomo-pricing-feature__view-all:hover {
    color: #ffffff;
    border-color: rgba(255, 255, 255, 0.3);
}

.fomo-pricing__card .pricing-feature strong {
    color: #ffffff;
    font-weight: 600;
}

/* Custom-rendered features (free + custom plans direct closure render) */
.fomo-pricing__feature {
    display: flex;
    align-items: flex-start;
    gap: 11.6px;
    color: #ffffff;
    font-family: 'Poppins', system-ui, -apple-system, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
    font-weight: 400;
    font-size: 16px;
    line-height: 26px;
}

.fomo-pricing__feature--disabled .fomo-pricing__feature-text {
    color: #6b6b6b;
}

.fomo-pricing__feature-icon {
    flex: 0 0 auto;
    width: 20.885px;
    height: 20.885px;
    padding: 4.06px;
    box-sizing: border-box;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background: rgba(34, 197, 94, 0.12);
    border-radius: 10.442px;
    margin-top: 2px;
}

.fomo-pricing__feature-icon img {
    width: 12.764px;
    height: 12.764px;
    display: block;
}

.fomo-pricing__feature--disabled .fomo-pricing__feature-icon {
    background: rgba(255, 255, 255, 0.04);
}

.fomo-pricing__feature-text {
    flex: 1 1 auto;
    min-width: 0;
}

/* "View all" collapse button inside cards (from partial) */
.fomo-pricing__card .btn[data-toggle="collapse"] {
    margin-top: 6px;
    padding: 8px 12px;
    background: transparent;
    border: 1px dashed rgba(255, 255, 255, 0.18);
    color: #bdbdbd;
    border-radius: 10px;
    font-family: 'Poppins', system-ui, -apple-system, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
    font-weight: 500;
    font-size: 13px;
    line-height: 20px;
}

.fomo-pricing__card .btn[data-toggle="collapse"]:hover {
    color: #ffffff;
    border-color: rgba(255, 255, 255, 0.3);
}

/* ----- Footer (footnote + detail CTA) ----- */
.fomo-pricing__footer {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 28px;
    margin-top: 53px;
    text-align: center;
}

.fomo-pricing__footnote {
    margin: 0;
    color: #bdbdbd;
    font-family: 'Poppins', system-ui, -apple-system, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
    font-weight: 400;
    font-size: 16.258px;
    line-height: 24.387px;
}

.fomo-pricing__detail-btn {
    display: inline-flex;
    align-items: center;
    gap: 12px;
    padding: 12px 24px;
    background: #00c769;
    color: #f7f7f7;
    border-radius: 80px;
    font-family: 'Poppins', system-ui, -apple-system, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
    font-weight: 600;
    font-size: 16px;
    line-height: 26px;
    text-decoration: none;
    transition: transform 0.2s ease, box-shadow 0.2s ease, background 0.2s ease;
    box-shadow: 0 12px 30px rgba(0, 199, 105, 0.28);
}

.fomo-pricing__detail-btn:hover,
.fomo-pricing__detail-btn:focus-visible {
    background: #00d672;
    color: #ffffff;
    text-decoration: none;
    transform: translateY(-2px);
    box-shadow: 0 16px 36px rgba(0, 199, 105, 0.45);
}

.fomo-pricing__detail-btn img {
    width: 24px;
    height: 24px;
    display: block;
}

/* ----- Responsive ----- */
@media (max-width: 1199.98px) {
    .fomo-pricing__grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        max-width: 720px;
        margin: 0 auto;
    }
}

@media (max-width: 991.98px) {
    .fomo-pricing {
        padding: 64px 0;
    }

    .fomo-pricing__title {
        font-size: 40px;
        line-height: 52px;
        letter-spacing: -0.8px;
    }

    .fomo-pricing__subtitle {
        font-size: 18px;
        line-height: 28px;
    }

    .fomo-pricing__pill {
        margin-bottom: 32px;
    }

    .fomo-pricing__title {
        margin-bottom: 18px;
    }

    .fomo-pricing__subtitle {
        margin-bottom: 32px;
    }

    .fomo-pricing__header {
        margin-bottom: 40px;
    }

    .fomo-pricing__card {
        padding: 36px 28px;
    }

    .fomo-pricing__plan-name {
        font-size: 28px;
        line-height: 36px;
    }

    .fomo-pricing__price-value {
        font-size: 52px;
        line-height: 52px;
    }
}

@media (max-width: 575.98px) {
    .fomo-pricing__grid {
        grid-template-columns: minmax(0, 1fr);
        max-width: 360px;
        margin: 0 auto;
    }

    .fomo-pricing__title {
        font-size: 30px;
        line-height: 40px;
        letter-spacing: -0.6px;
    }

    .fomo-pricing__subtitle {
        font-size: 16px;
        line-height: 26px;
    }

    .fomo-pricing__toggle-option {
        min-width: 0;
        padding: 12px 22px;
        font-size: 15px;
    }
}

/* ================= TESTIMONIALS (Figma 1291:31593) ================= */
.fomo-testimonials {
    position: relative;
    background: #0d0d0d;
    color: #ffffff;
    padding: 120px 0;
    overflow: hidden;
}

.fomo-testimonials__inner {
    width: 100%;
    max-width: 1240px;
    margin: 0 auto 64px;
    padding: 0 24px;
}

.fomo-testimonials__header {
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
    gap: 24px;
    margin: 0;
}

.fomo-testimonials__pill {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 6px 16px 8px;
    border: 1px solid #29ff82;
    background: rgba(41, 255, 130, 0.25);
    border-radius: 24px;
    box-shadow: 0 0 0 4px rgba(41, 255, 130, 0.06);
    color: #ffffff;
    font-family: 'Poppins', system-ui, -apple-system, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
    font-weight: 400;
    font-size: 16px;
    line-height: 26px;
}

.fomo-testimonials__title {
    margin: 0;
    max-width: 900px;
    font-family: 'Poppins', system-ui, -apple-system, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
    font-weight: 500;
    font-size: 56px;
    line-height: 72px;
    letter-spacing: -2.24px;
    text-transform: capitalize;
    background: linear-gradient(180deg, #ffffff 25.5%, #999999 118.5%);
    -webkit-background-clip: text;
    background-clip: text;
    color: transparent;
}

.fomo-testimonials__viewport {
    position: relative;
    display: flex;
    flex-direction: column;
    gap: 24px;
}

.fomo-testimonials__fade {
    position: absolute;
    top: 0;
    bottom: 0;
    width: min(150px, 16vw);
    z-index: 2;
    pointer-events: none;
}

.fomo-testimonials__fade--left {
    left: 0;
    background: linear-gradient(to right, #0d0d0d 0%, rgba(13, 13, 13, 0) 100%);
}

.fomo-testimonials__fade--right {
    right: 0;
    background: linear-gradient(to left, #0d0d0d 0%, rgba(13, 13, 13, 0) 100%);
}

.fomo-testimonials__marquee {
    position: relative;
    z-index: 1;
    overflow: hidden;
    width: 100%;
}

.fomo-testimonials__marquee:hover .fomo-testimonials__track {
    animation-play-state: paused;
}

.fomo-testimonials__track {
    display: flex;
    flex-direction: row;
    align-items: stretch;
    gap: 24px;
    width: max-content;
    animation-timing-function: linear;
    animation-iteration-count: infinite;
}

.fomo-testimonials__marquee--left .fomo-testimonials__track {
    animation-name: fomo-testimonials-marquee-left;
    animation-duration: 52s;
}

.fomo-testimonials__marquee--right .fomo-testimonials__track {
    animation-name: fomo-testimonials-marquee-right;
    animation-duration: 56s;
}

@keyframes fomo-testimonials-marquee-left {
    from {
        transform: translateX(0);
    }
    to {
        transform: translateX(-50%);
    }
}

@keyframes fomo-testimonials-marquee-right {
    from {
        transform: translateX(-50%);
    }
    to {
        transform: translateX(0);
    }
}

.fomo-testimonials__card {
    flex: 0 0 auto;
    width: min(480px, 85vw);
    box-sizing: border-box;
    display: flex;
    flex-direction: column;
    gap: 40px;
    padding: 32px;
    border-radius: 40px;
    background: #1a1a1a;
    border: 2px solid transparent;
    transition: border-color 0.3s ease;
}

.fomo-testimonials__card:hover {
    border-color: rgba(41, 255, 130, 0.7);
}

.fomo-testimonials__quote {
    margin: 0;
    font-family: 'Poppins', system-ui, -apple-system, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
    font-weight: 400;
    font-size: 16px;
    line-height: 26px;
    color: #ffffff;
}

.fomo-testimonials__profile {
    display: flex;
    align-items: center;
    gap: 20px;
    width: 100%;
}

.fomo-testimonials__avatar {
    flex-shrink: 0;
    width: 56px;
    height: 56px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    background: linear-gradient(145deg, #29ff82 0%, var(--fomo-hero-accent, #00c769) 100%);
}

.fomo-testimonials__avatar span {
    font-family: 'Poppins', system-ui, -apple-system, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
    font-weight: 600;
    font-size: 20px;
    line-height: 1;
    color: #0d0d0d;
}

.fomo-testimonials__meta {
    flex: 1;
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: 4px;
}

.fomo-testimonials__name {
    margin: 0;
    font-family: 'Poppins', system-ui, -apple-system, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
    font-weight: 500;
    font-size: 24px;
    line-height: 32px;
    background: linear-gradient(180deg, #ffffff 25.5%, #999999 118.5%);
    -webkit-background-clip: text;
    background-clip: text;
    color: transparent;
}

.fomo-testimonials__role {
    margin: 0;
    font-family: 'Poppins', system-ui, -apple-system, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
    font-weight: 400;
    font-size: 14px;
    line-height: 16px;
    color: #bdbdbd;
}

@media (prefers-reduced-motion: reduce) {
    .fomo-testimonials__track {
        animation: none !important;
        transform: none !important;
    }
}

@media (max-width: 991px) {
    .fomo-testimonials {
        padding: 80px 0;
    }

    .fomo-testimonials__title {
        font-size: 40px;
        line-height: 52px;
        letter-spacing: -1.4px;
    }

    .fomo-testimonials__inner {
        margin-bottom: 48px;
    }
}

@media (max-width: 575px) {
    .fomo-testimonials__title {
        font-size: 32px;
        line-height: 42px;
        letter-spacing: -0.9px;
    }

    .fomo-testimonials__card {
        padding: 24px;
        gap: 28px;
    }

    .fomo-testimonials__name {
        font-size: 20px;
        line-height: 28px;
    }
}

/* ================= CALL TO ACTION (Figma 1362:12183) ================= */
.fomo-cta {
    position: relative;
    isolation: isolate;
    background: #0d0d0d;
    padding: 80px 100px;
}

/* Figma node 1362:12107 — Ellipse 115 + 113 as exported SVGs, same transforms
   as dev handoff (scaleY(-1) rotate(180°); 113 at top 57px, hard-light, inset). */
.fomo-cta__ambient {
    position: absolute;
    left: 50%;
    /* top: 0; */
    width: 100vw;
    height: min(72vw, 900px);
    transform: translateX(-50%);
    pointer-events: none;
    z-index: 0;
    overflow: hidden;
}

.fomo-cta__ambient-layer {
    position: absolute;
    left: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    width: max(4000px, 278vw);
    aspect-ratio: 4000 / 2000;
    transform: translateX(-50%) rotate(180deg) scaleY(-1);
}

.fomo-cta__ambient-layer--115 {
    top: 0;
}

.fomo-cta__ambient-layer--113 {
    top: 57px;
    width: max(4240px, 295vw);
    aspect-ratio: 4240 / 2240;
    mix-blend-mode: hard-light;
}

.fomo-cta__ambient-flip {
    position: relative;
    width: 100%;
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
}

.fomo-cta__ambient-inset {
    position: absolute;
    inset: -6% -3%;
    display: flex;
    align-items: center;
    justify-content: center;
}

.fomo-cta__ambient-img {
    display: block;
    width: 100%;
    height: 100%;
    max-width: none;
    object-fit: fill;
}

.fomo-cta__inner {
    position: relative;
    z-index: 1;
    width: 100%;
    max-width: 1240px;
    margin: 0 auto;
    padding: 120px 40px 80px;
    border-radius: 40px;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: flex-end;
    gap: 56px;
}

.fomo-cta__content {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 24px;
    text-align: center;
    width: 100%;
}

.fomo-cta__title {
    margin: 0;
    max-width: 896px;
    font-family: 'Poppins', system-ui, -apple-system, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
    font-weight: 600;
    font-size: 56px;
    line-height: 72px;
    letter-spacing: -1.12px;
    text-transform: capitalize;
    color: #ffffff;
}

.fomo-cta__subtitle {
    margin: 0;
    max-width: 846px;
    font-family: 'Poppins', system-ui, -apple-system, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
    font-weight: 400;
    font-size: 20px;
    line-height: 32px;
    color: #ffffff;
}

.fomo-cta__actions {
    display: flex;
    gap: 24px;
    align-items: center;
    justify-content: center;
    flex-wrap: wrap;
}

.fomo-cta .fomo-cta__btn {
    min-width: 0;
    text-transform: capitalize;
}

.fomo-cta .fomo-index-btn--primary.fomo-cta__btn {
    background: #00c769;
    box-shadow: none;
}

.fomo-cta .fomo-index-btn--ghost.fomo-cta__btn {
    background: transparent;
    border: 1px solid #ffffff;
    font-weight: 500;
}

.fomo-cta__btn-icon {
    flex-shrink: 0;
    display: block;
}

@media (max-width: 1199px) {
    .fomo-cta {
        padding: 64px 40px;
    }
}

@media (max-width: 991px) {
    .fomo-cta {
        padding: 56px 24px;
    }

    .fomo-cta__inner {
        padding: 100px 24px 64px;
        gap: 40px;
    }

    .fomo-cta__title {
        font-size: 40px;
        line-height: 52px;
        letter-spacing: -0.8px;
    }

    .fomo-cta__subtitle {
        font-size: 18px;
        line-height: 28px;
    }
}

@media (max-width: 575px) {
    .fomo-cta__inner {
        padding: 80px 20px 56px;
        border-radius: 32px;
    }

    .fomo-cta__title {
        font-size: 30px;
        line-height: 40px;
        letter-spacing: -0.6px;
    }

    .fomo-cta__subtitle {
        font-size: 16px;
        line-height: 26px;
    }

    .fomo-cta__actions {
        flex-direction: column;
        width: 100%;
    }

    .fomo-cta .fomo-cta__btn {
        width: 100%;
        max-width: 320px;
    }
}

/* ================= FOOTER (Figma 1291:31630) ================= */

/* Strip all padding / margin from the Bootstrap .container that wraps
   the footer in wrapper.php, and remove the white background it inherits
   from custom.css. Scoped tightly so other .container instances are safe. */
.container:has(> .footer > .fomo-footer),
.container:has(> .footer > .fomo-footer) > .footer {
    padding: 0 !important;
    margin: 0 !important;
    max-width: 100% !important;
    background: transparent !important;
}

/* Break out of .container so the Figma full-bleed design paints edge-to-edge. */
.fomo-footer {
    position: relative;
    left: 50%;
    margin-left: -50vw;
    width: 100vw;
    background: #0d0d0d;
    color: #ffffff;
    padding: 0 100px 32px;
    box-sizing: border-box;
}

.fomo-footer__inner {
    width: 100%;
    max-width: 1240px;
    margin: 0 auto;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 32px;
}

.fomo-footer__content {
    width: 100%;
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 64px;
    padding: 120px 0 56px;
    border-top: 0.5px solid #666666;
    border-bottom: 0.5px solid #666666;
}

.fomo-footer__newsletter {
    display: flex;
    flex-direction: column;
    gap: 56px;
    flex: 0 0 auto;
}

.fomo-footer__brand {
    display: inline-flex;
    align-items: center;
    gap: 12px;
    text-decoration: none !important;
    color: #ffffff;
}

.fomo-footer__brand-logo {
    width: 205px;
    height: 63.262px;
    flex-shrink: 0;
    object-fit: contain;
}

.fomo-footer__brand-name {
    font-family: 'Poppins', system-ui, -apple-system, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
    font-weight: 500;
    font-size: 28px;
    line-height: 40px;
    text-transform: capitalize;
    color: #ffffff;
    white-space: nowrap;
}

.fomo-footer__signup {
    display: flex;
    flex-direction: column;
    gap: 24px;
    margin: 0;
}

.fomo-footer__signup-text {
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.fomo-footer__signup-title {
    margin: 0;
    font-family: 'Poppins', system-ui, -apple-system, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
    font-weight: 600;
    font-size: 24px;
    line-height: 32px;
    color: #ffffff;
}

.fomo-footer__signup-desc {
    margin: 0;
    font-family: 'Poppins', system-ui, -apple-system, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
    font-weight: 400;
    font-size: 16px;
    line-height: 26px;
    color: #9e9e9e;
    max-width: 330px;
}

.fomo-footer__field {
    display: flex;
    align-items: center;
    justify-content: space-between;
    width: 330px;
    max-width: 100%;
    background: #1a1a1a;
    border: 1px solid rgba(74, 74, 74, 0.7);
    border-radius: 80px;
    padding: 6px 8px 8px 24px;
    gap: 12px;
    transition: border-color 0.2s ease;
}

.fomo-footer__field:focus-within {
    border-color: rgba(0, 199, 105, 0.7);
}

.fomo-footer__input {
    flex: 1;
    min-width: 0;
    background: transparent;
    border: 0;
    outline: none;
    color: #ffffff;
    font-family: 'Poppins', system-ui, -apple-system, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
    font-weight: 400;
    font-size: 16px;
    line-height: 26px;
    padding: 0;
}

.fomo-footer__input::placeholder {
    color: #757575;
    opacity: 1;
}

.fomo-footer__send {
    flex-shrink: 0;
    appearance: none;
    -webkit-appearance: none;
    border: 0;
    background: #01c853;
    color: #1a1a1a;
    border-radius: 80px;
    padding: 8px 16px;
    font-family: 'Poppins', system-ui, -apple-system, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
    font-weight: 500;
    font-size: 14px;
    line-height: 16px;
    cursor: pointer;
    transition: background 0.2s ease, transform 0.15s ease;
}

.fomo-footer__send:hover,
.fomo-footer__send:focus-visible {
    background: color-mix(in srgb, #01c853 92%, #ffffff 8%);
    outline: none;
}

.fomo-footer__links {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 48px;
    flex: 1 1 710px;
    max-width: 710px;
}

.fomo-footer__col {
    display: flex;
    flex-direction: column;
    gap: 24px;
    flex: 0 0 auto;
}

.fomo-footer__col-title {
    margin: 0;
    font-family: 'Poppins', system-ui, -apple-system, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
    font-weight: 500;
    font-size: 20px;
    line-height: 32px;
    color: #ffffff;
}

.fomo-footer__col-list {
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
    flex-direction: column;
    gap: 16px;
}

.fomo-footer__link {
    text-decoration: none !important;
    font-family: 'Poppins', system-ui, -apple-system, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
    font-weight: 400;
    font-size: 16px;
    line-height: 26px;
    color: #acacac;
    transition: color 0.15s ease;
    white-space: nowrap;
}

.fomo-footer__link:hover,
.fomo-footer__link:focus-visible {
    color: #ffffff;
    outline: none;
}

.fomo-footer__copyright {
    margin: 0;
    font-family: 'Poppins', system-ui, -apple-system, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
    font-weight: 500;
    font-size: 16px;
    line-height: 26px;
    color: #bdbdbd;
    opacity: 0.7;
    text-align: center;
}

@media (max-width: 1199px) {
    .fomo-footer {
        padding: 0 40px 32px;
    }

    .fomo-footer__content {
        gap: 48px;
        padding: 96px 0 48px;
    }

    .fomo-footer__links {
        gap: 32px;
    }
}

@media (max-width: 991px) {
    .fomo-footer {
        padding: 0 24px 32px;
    }

    .fomo-footer__content {
        flex-direction: column;
        gap: 56px;
        padding: 80px 0 48px;
    }

    .fomo-footer__newsletter {
        gap: 40px;
        width: 100%;
    }

    .fomo-footer__links {
        flex: 1 1 auto;
        max-width: 100%;
        width: 100%;
        gap: 32px;
        flex-wrap: wrap;
    }

    .fomo-footer__col {
        flex: 1 1 calc(50% - 16px);
        min-width: 140px;
    }
}

@media (max-width: 575px) {
    .fomo-footer__content {
        padding: 64px 0 40px;
    }

    .fomo-footer__brand-name {
        font-size: 22px;
        line-height: 32px;
    }

    .fomo-footer__signup-title {
        font-size: 20px;
        line-height: 28px;
    }

    .fomo-footer__field {
        width: 100%;
    }

    .fomo-footer__col {
        flex: 1 1 100%;
    }
}

/* ================= ABOUT PAGE HERO (Figma 1291:31632 — frame "top" 1440×826; wash aligned to 1291:35467 dev) =================
   Background from design export: diagonal green wash on #0d0d0d, tiled noise (1024², soft-light 30%),
   centered vignette SVG; trust row uses Figma badge SVG + Inter caps. */
.fomo-about-hero {
    position: relative;
    overflow: hidden;
    isolation: isolate;
    background: #0d0d0d;
    color: #ffffff;
    min-height: 826px;
}

.fomo-about-hero__bg {
    position: absolute;
    inset: 0;
    z-index: 0;
    pointer-events: none;
    overflow: hidden;
}

.fomo-about-hero__wash {
    position: absolute;
    inset: 0;
    z-index: 0;
    background: linear-gradient(
        74.837316deg,
        rgba(41, 255, 155, 0.7) 0.7473%,
        #0d0d0d 30.505%,
        #0d0d0d 69.72%,
        rgba(41, 255, 155, 0.7) 99.191%
    );
}

.fomo-about-hero__noise {
    position: absolute;
    inset: 0;
    z-index: -1;
    scale: 1.1;
    opacity: 0.3;
    mix-blend-mode: soft-light;
    background-image: url('../images/fomo_boost/about/hero-noise.png');
    background-repeat: repeat;
    background-size: 1024px 1024px;
    background-position: top left;
}

/* Large blurred #0D0D0D orbs anchored at bottom corners (matches Figma gradient layer circles). */
.fomo-about-hero__bottom-blur {
    position: absolute;
    width: 1852px;
    height: 1852px;
    border-radius: 1852px;
    background: radial-gradient(50% 50% at 50% 50%, #0d0d0d 0%, #0d0d0d 100%);
    filter: blur(100px);
    overflow: hidden;
    pointer-events: none;
    z-index: 1;
}

.fomo-about-hero__bottom-blur--left {
    left: -40%;
    bottom: -177%;
}

.fomo-about-hero__bottom-blur--right {
    right: -41%;
    bottom: -163%;
}

.fomo-about-hero__circle-wrap {
    position: absolute;
    left: 50%;
    top: 34%;
    transform: translate(-50%, -50%);
    width: min(1400px, 115vw);
    pointer-events: none;
    z-index: 3;
}

.fomo-about-hero__circle-img {
    display: block;
    width: 100%;
    height: auto;
}

.fomo-about-hero__inner {
    position: relative;
    z-index: 5;
    max-width: 1440px;
    margin: 0 auto;
    padding: var(--fomo-nav-height) clamp(24px, 6.94vw, 100px) 0;
    min-height: 826px;
    display: flex;
    flex-direction: column;
}

.fomo-about-hero__content {
    flex: 1;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    text-align: center;
    padding: 80px 0 72px;
    gap: 24px;
}

.fomo-about-hero__title {
    margin: 0;
    max-width: 586px;
    font-family: 'Poppins', system-ui, -apple-system, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
    font-weight: 500;
    font-size: clamp(2.75rem, 7vw, 100px);
    line-height: 1.1;
    letter-spacing: -0.04em;
    overflow-wrap: anywhere;
    background: linear-gradient(180deg, #ffffff 25.5%, #999999 118.5%);
    -webkit-background-clip: text;
    background-clip: text;
    color: transparent;
    filter: drop-shadow(0 4px 4px rgba(0, 0, 0, 0.4));
}

.fomo-about-hero__title-line {
    display: block;
}

.fomo-about-hero__subtitle {
    margin: 0;
    max-width: 920px;
    font-family: 'Poppins', system-ui, -apple-system, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
    font-weight: 600;
    font-size: clamp(18px, 2vw, 24px);
    line-height: 33px;
    overflow-wrap: anywhere;
    color: #ffffff;
}

.fomo-about-hero__body {
    margin: 0;
    max-width: 532px;
    font-family: 'Poppins', system-ui, -apple-system, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
    font-weight: 400;
    font-size: 16px;
    line-height: 26px;
    overflow-wrap: anywhere;
    color: #ffffff;
}

.fomo-about-hero__trust {
    margin: 0;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
}

.fomo-about-hero__trust-badge {
    flex-shrink: 0;
    width: 22px;
    height: 21px;
    display: block;
}

.fomo-about-hero__trust-text {
    font-family: 'Inter', 'Poppins', system-ui, -apple-system, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
    font-weight: 500;
    font-size: 14px;
    line-height: 21px;
    letter-spacing: 0.7px;
    text-transform: uppercase;
    color: #ffffff;
}

@media (max-width: 991px) {
    .fomo-about-hero__content {
        padding: 48px 0 56px;
    }

    .fomo-about-hero__circle-wrap {
        top: 30%;
        width: min(1400px, 140vw);
    }
}

@media (max-width: 767px) {
    .fomo-about-hero,
    .fomo-about-hero__inner {
        min-height: 0;
    }

    .fomo-index-nav-bar--about .fomo-index-nav,
    .fomo-index-nav-bar--pricing .fomo-index-nav {
        padding: 24px 0;
    }

    .fomo-about-hero__subtitle {
        line-height: 1.37;
    }
}

/* ================= FEATURES PAGE HERO (Figma 1291:38976 — frame "top" 1440×865) =================
   Background layers match About hero (shared .fomo-about-hero__*). Typography + trust pills per design. */
.fomo-features-hero.fomo-about-hero {
    min-height: 865px;
}

.fomo-features-hero.fomo-about-hero .fomo-about-hero__inner {
    min-height: 865px;
}

.fomo-features-hero__content.fomo-about-hero__content {
    padding: 64px 0 96px;
    gap: 20px;
}

.fomo-features-hero__title {
    margin: 0;
    max-width: 1040px;
    font-family: 'Poppins', system-ui, -apple-system, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
    font-weight: 600;
    font-size: clamp(2rem, 4.2vw, 56px);
    line-height: 1.12;
    letter-spacing: -0.02em;
    text-align: center;
    overflow-wrap: anywhere;
    color: #ffffff;
    text-shadow: 0 2px 28px rgba(0, 0, 0, 0.45);
}

.fomo-features-hero__subtitle {
    margin: 0;
    max-width: 920px;
    font-family: 'Poppins', system-ui, -apple-system, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
    font-weight: 600;
    font-size: clamp(18px, 2vw, 24px);
    line-height: 33px;
    overflow-wrap: anywhere;
    color: #ffffff;
}

.fomo-features-hero__body {
    margin: 0;
    max-width: 640px;
    font-family: 'Poppins', system-ui, -apple-system, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
    font-weight: 400;
    font-size: 16px;
    line-height: 26px;
    overflow-wrap: anywhere;
    color: #b0b0b0;
}

.fomo-features-hero__badges {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: center;
    gap: 16px;
    margin-top: 8px;
}

.fomo-features-hero__badge {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    padding: 12px 22px;
    border-radius: 999px;
    border: 1px solid rgba(255, 255, 255, 0.22);
    background: rgba(13, 13, 13, 0.35);
    font-family: 'Poppins', system-ui, -apple-system, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
    font-weight: 500;
    font-size: 15px;
    line-height: 24px;
    color: #ffffff;
}

.fomo-features-hero__badge-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    color: var(--fomo-hero-accent);
    font-size: 16px;
}

.fomo-features-hero__cta {
    margin-top: 16px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 80px;
    background: var(--fomo-hero-accent);
    color: #f7f7f7 !important;
    text-decoration: none !important;
    padding: 14px 36px;
    font-family: 'Poppins', system-ui, -apple-system, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
    font-size: 18px;
    line-height: 28px;
    font-weight: 600;
    white-space: nowrap;
    transition: background 0.15s ease, transform 0.15s ease, box-shadow 0.15s ease;
    box-shadow: 0 8px 24px rgba(0, 199, 105, 0.28);
}

.fomo-features-hero__cta:hover {
    background: color-mix(in srgb, var(--fomo-hero-accent) 92%, #000 8%);
    transform: translateY(-1px);
    color: #ffffff !important;
    box-shadow: 0 10px 28px rgba(0, 199, 105, 0.38);
}

@media (max-width: 991px) {
    .fomo-features-hero__content.fomo-about-hero__content {
        padding: 48px 0 72px;
    }
}

@media (max-width: 767px) {
    .fomo-features-hero.fomo-about-hero,
    .fomo-features-hero.fomo-about-hero .fomo-about-hero__inner {
        min-height: 0;
    }

    .fomo-features-hero__title {
        font-size: clamp(1.75rem, 6.5vw, 2.25rem);
    }

    .fomo-features-hero__subtitle {
        line-height: 1.37;
    }

    .fomo-features-hero__cta {
        width: 100%;
        max-width: 360px;
    }
}

/* ================= FEATURES — NOTIFICATIONS GRID (Figma 1291:39008 “values”) ================= */
.fomo-features-notifications {
    background: #0d0d0d;
    padding: 120px clamp(24px, 6.94vw, 100px);
}

.fomo-features-notifications__shell {
    max-width: 1440px;
    margin: 0 auto;
}

.fomo-features-notifications__inner {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 64px;
    max-width: 1240px;
    margin: 0 auto;
}

.fomo-features-notifications__head {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 24px;
    width: 100%;
    text-align: center;
}

.fomo-features-notifications__title {
    margin: 0;
    max-width: 100%;
    font-family: 'Poppins', system-ui, -apple-system, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
    font-weight: 500;
    font-size: clamp(2rem, 4.6vw, 56px);
    line-height: 72px;
    letter-spacing: -2.24px;
    text-transform: capitalize;
    overflow-wrap: anywhere;
    background: linear-gradient(180deg, #ffffff 25.5%, #999999 118.5%);
    -webkit-background-clip: text;
    background-clip: text;
    color: transparent;
}

.fomo-features-notifications__intro {
    margin: 0;
    max-width: 546px;
    font-family: 'Poppins', system-ui, -apple-system, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
    font-weight: 400;
    font-size: 16px;
    line-height: 26px;
    overflow-wrap: anywhere;
    color: #ebebeb;
}

.fomo-features-notifications__grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 32px;
    width: 100%;
}

.fomo-features-notifications__card {
    box-sizing: border-box;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    justify-content: center;
    gap: 32px;
    padding: 40px 32px 40px 40px;
    background: #1a1a1a;
    border: 1px solid rgba(74, 74, 74, 0.7);
    border-radius: 40px;
    overflow: hidden;
}

.fomo-features-notifications__icon-wrap {
    flex-shrink: 0;
}

.fomo-features-notifications__icon-box {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 72px;
    height: 72px;
    flex-shrink: 0;
    border-radius: 10px;
    background: #29ff82;
    box-sizing: border-box;
}

.fomo-features-notifications__icon-fa {
    font-size: 24px;
    line-height: 1;
    color: #0d0d0d;
}

.fomo-features-notifications__text {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 12px;
    width: 100%;
}

.fomo-features-notifications__card-title {
    margin: 0;
    font-family: 'Poppins', system-ui, -apple-system, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
    font-weight: 600;
    font-size: 24px;
    line-height: 32px;
    overflow-wrap: anywhere;
    color: #ffffff;
}

.fomo-features-notifications__card-body {
    margin: 0;
    font-family: 'Poppins', system-ui, -apple-system, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
    font-weight: 400;
    font-size: 16px;
    line-height: 26px;
    overflow-wrap: anywhere;
    color: #bdbdbd;
}

@media (max-width: 1199px) {
    .fomo-features-notifications__grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .fomo-features-notifications__title {
        line-height: 1.2;
    }
}

@media (max-width: 767px) {
    .fomo-features-notifications {
        padding: 80px clamp(20px, 5vw, 32px);
    }

    .fomo-features-notifications__inner {
        gap: 48px;
    }

    .fomo-features-notifications__grid {
        grid-template-columns: 1fr;
    }

    .fomo-features-notifications__title {
        font-size: clamp(1.75rem, 7vw, 2.5rem);
        letter-spacing: -0.06em;
    }
}

/* ================= FEATURES — SPLIT COLUMNS (Figma 1291:39022 “values”) ================= */
.fomo-features-split {
    background: #0d0d0d;
    padding: 120px clamp(24px, 6.94vw, 100px);
}

.fomo-features-split__shell {
    max-width: 1440px;
    margin: 0 auto;
}

.fomo-features-split__grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 86.96px;
    width: 100%;
    max-width: 1240px;
    margin: 0 auto;
    align-items: start;
}

.fomo-features-split__col {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 52.176px;
    min-width: 0;
}

.fomo-features-split__head {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 8.696px;
    width: 100%;
}

.fomo-features-split__title {
    margin: 0;
    font-family: 'Poppins', system-ui, -apple-system, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
    font-weight: 600;
    font-size: 32px;
    line-height: 40px;
    letter-spacing: -0.64px;
    overflow-wrap: anywhere;
    color: #ffffff;
}

.fomo-features-split__lead {
    margin: 0;
    font-family: 'Poppins', system-ui, -apple-system, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
    font-weight: 400;
    font-size: 16px;
    line-height: 26px;
    overflow-wrap: anywhere;
    color: rgba(255, 255, 255, 0.8);
}

.fomo-features-split__list {
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 26.088px;
    width: 100%;
}

.fomo-features-split__item {
    display: flex;
    flex-direction: row;
    align-items: flex-start;
    gap: 17.392px;
    width: 100%;
}

.fomo-features-split__icon-pill {
    flex-shrink: 0;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 8.696px;
    border-radius: 34.784px;
    background: rgba(117, 255, 158, 0.1);
    box-sizing: border-box;
}

.fomo-features-split__icon-fa {
    display: block;
    width: 24px;
    height: 24px;
    font-size: 14px;
    line-height: 24px;
    text-align: center;
    color: var(--fomo-hero-accent, #00c769);
}

.fomo-features-split__text {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 0;
    min-width: 0;
    flex: 1;
}

.fomo-features-split__item-title {
    margin: 0;
    font-family: 'Poppins', system-ui, -apple-system, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
    font-weight: 700;
    font-size: 16px;
    line-height: 26px;
    overflow-wrap: anywhere;
    color: #ffffff;
}

.fomo-features-split__item-body {
    margin: 0;
    font-family: 'Poppins', system-ui, -apple-system, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
    font-weight: 400;
    font-size: 16px;
    line-height: 26px;
    overflow-wrap: anywhere;
    color: rgba(255, 255, 255, 0.8);
}

@media (max-width: 991px) {
    .fomo-features-split__grid {
        grid-template-columns: 1fr;
        gap: 56px;
    }
}

@media (max-width: 767px) {
    .fomo-features-split {
        padding: 80px clamp(20px, 5vw, 32px);
    }

    .fomo-features-split__col {
        gap: 40px;
    }

    .fomo-features-split__title {
        font-size: clamp(1.5rem, 5vw, 2rem);
        line-height: 1.25;
        letter-spacing: -0.03em;
    }
}

/* ================= FEATURES — INTEGRATIONS GRID (Figma 1291:39102 “values”) ================= */
.fomo-features-integrations {
    background: #0d0d0d;
    padding: 120px clamp(24px, 6.94vw, 100px);
}

.fomo-features-integrations__shell {
    max-width: 1440px;
    margin: 0 auto;
}

.fomo-features-integrations__inner {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 64px;
    max-width: 1240px;
    margin: 0 auto;
    width: 100%;
}

.fomo-features-integrations__head {
    width: 100%;
    text-align: center;
}

.fomo-features-integrations__title {
    margin: 0 auto;
    max-width: 100%;
    font-family: 'Poppins', system-ui, -apple-system, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
    font-weight: 500;
    font-size: clamp(2rem, 4.6vw, 56px);
    line-height: 72px;
    letter-spacing: -2.24px;
    text-transform: capitalize;
    text-align: center;
    overflow-wrap: anywhere;
    background: linear-gradient(180deg, #ffffff 25.5%, #999999 118.5%);
    -webkit-background-clip: text;
    background-clip: text;
    color: transparent;
}

.fomo-features-integrations__grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 24px;
    width: 100%;
}

.fomo-features-integrations__card {
    box-sizing: border-box;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 16px;
    min-height: 128px;
    padding: 24px;
    background: #1a1a1a;
    border: 1px solid rgba(74, 74, 74, 0.7);
    border-radius: 24px;
}

.fomo-features-integrations__icon-wrap {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 34px;
    height: 34px;
    flex-shrink: 0;
}

.fomo-features-integrations__icon-fa {
    font-size: 22px;
    line-height: 1;
    color: var(--fomo-hero-accent, #00c769);
}

.fomo-features-integrations__label {
    margin: 0;
    font-family: 'Poppins', system-ui, -apple-system, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
    font-weight: 700;
    font-size: 16px;
    line-height: 26px;
    color: #ffffff;
    text-align: center;
    overflow-wrap: anywhere;
}

@media (max-width: 1199px) {
    .fomo-features-integrations__title {
        line-height: 1.2;
    }

    .fomo-features-integrations__grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 767px) {
    .fomo-features-integrations {
        padding: 80px clamp(20px, 5vw, 32px);
    }

    .fomo-features-integrations__inner {
        gap: 48px;
    }

    .fomo-features-integrations__title {
        font-size: clamp(1.75rem, 7vw, 2.5rem);
        letter-spacing: -0.06em;
    }
}

@media (max-width: 479px) {
    .fomo-features-integrations__grid {
        grid-template-columns: 1fr;
    }
}

/* ================= FEATURES — COMPARISON TABLE (Figma 1291:39139 “roadmap”) ================= */
.fomo-features-compare {
    background: #0d0d0d;
    padding: 120px clamp(24px, 6.94vw, 100px);
}

.fomo-features-compare__shell {
    max-width: 1440px;
    margin: 0 auto;
}

.fomo-features-compare__card {
    width: 100%;
    max-width: 1240px;
    margin: 0 auto;
    background: #1a1a1a;
    border: 1px solid rgba(74, 74, 74, 0.7);
    border-radius: 24.65px;
    overflow: hidden;
    box-sizing: border-box;
}

.fomo-features-compare__table-wrap {
    position: relative;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    overscroll-behavior-x: contain;
}

.fomo-features-compare__caption--vh {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    white-space: nowrap;
    border: 0;
}

.fomo-features-compare__table {
    width: 100%;
    min-width: 720px;
    border-collapse: collapse;
    border-spacing: 0;
    table-layout: fixed;
    font-family: 'Poppins', system-ui, -apple-system, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
}

.fomo-features-compare__col--feature {
    width: 32.39%;
}

.fomo-features-compare__col--fomo {
    width: 22.6%;
}

.fomo-features-compare__col--saas {
    width: 21.06%;
}

.fomo-features-compare__col--other {
    width: 23.95%;
}

.fomo-features-compare__table thead tr {
    background: #0f0f0f;
}

.fomo-features-compare__table thead {
    border-bottom: 1px solid rgba(255, 255, 255, 0.1);
}

.fomo-features-compare__th {
    padding: 24.65px;
    text-align: left;
    vertical-align: middle;
    font-weight: 700;
    font-size: 20px;
    line-height: 32px;
    color: #ffffff;
}

.fomo-features-compare__th--fomo {
    text-align: center;
    color: var(--fomo-hero-accent, #29ff82);
}

.fomo-features-compare__th--saas,
.fomo-features-compare__th--other {
    text-align: center;
}

.fomo-features-compare__tr:nth-child(odd) {
    background: #000000;
}

.fomo-features-compare__tr:nth-child(even) {
    background: rgba(0, 0, 0, 0.5);
}

.fomo-features-compare__tr {
    border-top: 1px solid rgba(255, 255, 255, 0.1);
}

.fomo-features-compare__table tbody .fomo-features-compare__tr:first-child {
    border-top: none;
}

.fomo-features-compare__rowhead {
    padding: 26px 24.65px;
    text-align: left;
    vertical-align: middle;
    font-weight: 600;
    font-size: 16px;
    line-height: 26px;
    overflow-wrap: anywhere;
    color: #ffffff;
}

.fomo-features-compare__td {
    padding: 25px 24.65px;
    text-align: center;
    vertical-align: middle;
    font-size: 16px;
    line-height: 26px;
}

.fomo-features-compare__td--fomo,
.fomo-features-compare__td--saas,
.fomo-features-compare__td--other {
    text-align: center;
}

.fomo-features-compare__badge {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 28px;
    height: 28px;
    border-radius: 50%;
    font-size: 12px;
    line-height: 1;
}

.fomo-features-compare__badge--check {
    background: var(--fomo-hero-accent, #29ff82);
    color: #0d0d0d;
}

.fomo-features-compare__badge--cross {
    background: #2a2a2a;
    color: #8a8a8a;
}

.fomo-features-compare__dash {
    display: inline-block;
    font-size: 18px;
    line-height: 26px;
    color: rgba(255, 255, 255, 0.45);
    font-weight: 400;
}

.fomo-features-compare__cell-text {
    display: inline-block;
    font-weight: 400;
    font-size: 16px;
    line-height: 26px;
    overflow-wrap: anywhere;
    color: #ffffff;
}

.fomo-features-compare__cell-text--strong {
    font-weight: 600;
    color: #ffffff;
}

.fomo-features-compare__cell-text--muted {
    color: rgba(255, 255, 255, 0.8);
}

@media (max-width: 767px) {
    .fomo-features-compare {
        padding: 80px clamp(20px, 5vw, 32px);
    }

    .fomo-features-compare__th,
    .fomo-features-compare__rowhead,
    .fomo-features-compare__td {
        padding: 18px 14px;
        font-size: 14px;
    }

    .fomo-features-compare__th {
        font-size: 15px;
        line-height: 1.35;
    }
}

/* ================= ABOUT PAGE QUOTE (Figma 1291:31658 — “features-card”) ================= */
.fomo-about-quote {
    background: #0d0d0d;
    padding: 80px clamp(24px, 6.94vw, 100px);
}

.fomo-about-quote__inner {
    max-width: 1440px;
    margin: 0 auto;
    display: flex;
    justify-content: center;
}

.fomo-about-quote__card {
    margin: 0;
    width: 100%;
    max-width: 1164px;
    padding: 40px 32px;
    background: #1a1a1a;
    border: 1px solid rgba(74, 74, 74, 0.7);
    border-radius: 40px;
    overflow: hidden;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 32px;
    box-sizing: border-box;
    font-style: normal;
}

.fomo-about-quote__text {
    margin: 0;
    max-width: 1040px;
    font-family: 'Poppins', system-ui, -apple-system, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
    font-weight: 500;
    font-size: 24px;
    line-height: 32px;
    text-align: center;
    overflow-wrap: anywhere;
    color: #ffffff;
}

.fomo-about-quote__divider {
    width: 96px;
    height: 1px;
    background: #00ff87;
    opacity: 0.5;
    flex-shrink: 0;
}

@media (max-width: 767px) {
    .fomo-about-quote {
        padding: 56px 24px;
    }

    .fomo-about-quote__card {
        padding: 32px 24px;
        border-radius: 28px;
        gap: 24px;
    }

    .fomo-about-quote__text {
        font-size: clamp(18px, 4.6vw, 22px);
        line-height: 1.45;
    }
}

/* ================= ABOUT PAGE VALUES (Figma 1291:31663) ================= */
.fomo-about-values {
    background: #0d0d0d;
    padding: 120px clamp(24px, 6.94vw, 100px);
}

.fomo-about-values__shell {
    max-width: 1440px;
    margin: 0 auto;
}

.fomo-about-values__inner {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 64px;
    max-width: 1240px;
    margin: 0 auto;
}

.fomo-about-values__intro {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 24px;
    width: 100%;
    text-align: center;
}

.fomo-about-values__title {
    margin: 0;
    font-family: 'Poppins', system-ui, -apple-system, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
    font-weight: 500;
    font-size: clamp(2rem, 4.6vw, 56px);
    line-height: 1.285714;
    letter-spacing: -2.24px;
    text-transform: capitalize;
    background: linear-gradient(180deg, #ffffff 25.5%, #999999 118.5%);
    -webkit-background-clip: text;
    background-clip: text;
    color: transparent;
}

.fomo-about-values__subtitle {
    margin: 0;
    max-width: 920px;
    font-family: 'Poppins', system-ui, -apple-system, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
    font-weight: 400;
    font-size: 16px;
    line-height: 26px;
    color: #bdbdbd;
}

.fomo-about-values__row {
    display: flex;
    flex-wrap: wrap;
    gap: 32px;
    width: 100%;
    align-items: stretch;
}

.fomo-about-values__card {
    flex: 1 1 calc(33.333% - 22px);
    min-width: 260px;
    box-sizing: border-box;
    background: #1a1a1a;
    border: 1px solid rgba(74, 74, 74, 0.7);
    border-radius: 40px;
    overflow: hidden;
    padding: 40px 32px;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 32px;
}

.fomo-about-values__illus {
    position: relative;
    width: 130px;
    height: 130px;
    flex-shrink: 0;
}

.fomo-about-values__circles {
    display: block;
    width: 130px;
    height: 130px;
}

.fomo-about-values__icon-wrap {
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
    width: 79.529px;
    height: 79.529px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.fomo-about-values__icon {
    width: 52px;
    height: 52px;
    display: block;
}

.fomo-about-values__text {
    width: 100%;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 12px;
    text-align: center;
    min-height: 148px;
}

.fomo-about-values__card-title {
    margin: 0;
    width: 100%;
    font-family: 'Poppins', system-ui, -apple-system, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
    font-weight: 600;
    font-size: 24px;
    line-height: 32px;
    color: #ffffff;
}

.fomo-about-values__card-body {
    margin: 0;
    flex: 1 1 auto;
    width: 100%;
    font-family: 'Poppins', system-ui, -apple-system, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
    font-weight: 400;
    font-size: 16px;
    line-height: 26px;
    color: #bdbdbd;
}

@media (max-width: 1100px) {
    .fomo-about-values__card {
        flex: 1 1 calc(50% - 16px);
    }
}

@media (max-width: 767px) {
    .fomo-about-values {
        padding: 72px 24px;
    }

    .fomo-about-values__inner {
        gap: 48px;
    }

    .fomo-about-values__title {
        line-height: 1.25;
    }

    .fomo-about-values__card {
        flex: 1 1 100%;
        min-width: 0;
        border-radius: 28px;
        padding: 32px 24px;
    }

    .fomo-about-values__text {
        min-height: 0;
    }
}

/* ================= ABOUT PAGE COMPARE TABLE (Figma 1291:31706) ================= */
.fomo-about-compare {
    background: #0d0d0d;
    padding: 120px clamp(24px, 6.94vw, 100px);
}

.fomo-about-compare__shell {
    max-width: 1461px;
    margin: 0 auto;
}

.fomo-about-compare__card {
    max-width: 1261px;
    margin: 0 auto;
    background: #1a1a1a;
    border: 1px solid rgba(74, 74, 74, 0.7);
    border-radius: 35px;
    overflow: hidden;
    box-sizing: border-box;
}

.fomo-about-compare__head {
    padding: 34px 35px 36px;
    border-bottom: 1px solid rgba(255, 255, 255, 0.05);
}

.fomo-about-compare__title {
    margin: 0;
    font-family: 'Poppins', system-ui, -apple-system, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
    font-weight: 600;
    font-size: 32px;
    line-height: 40px;
    letter-spacing: -0.64px;
    color: #ffffff;
}

.fomo-about-compare__table-wrap {
    position: relative;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    overscroll-behavior-x: contain;
}

.fomo-about-compare__caption--vh {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    white-space: nowrap;
    border: 0;
}

.fomo-about-compare__table {
    width: 100%;
    min-width: 680px;
    border-collapse: collapse;
    border-spacing: 0;
    table-layout: fixed;
    font-family: 'Poppins', system-ui, -apple-system, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
}

.fomo-about-compare__col--feature {
    width: 28.12%;
}

.fomo-about-compare__col--saas {
    width: 37.96%;
}

.fomo-about-compare__col--fomo {
    width: 33.92%;
}

.fomo-about-compare__table thead {
    border-bottom: 1px solid rgba(255, 255, 255, 0.05);
}

.fomo-about-compare__table thead tr {
    background: rgba(255, 255, 255, 0.05);
}

.fomo-about-compare__th {
    padding: 26px;
    text-align: left;
    vertical-align: middle;
    font-weight: 600;
    font-size: 16px;
    line-height: 26px;
}

.fomo-about-compare__th--feature {
    color: #ffffff;
}

.fomo-about-compare__th--saas {
    font-weight: 700;
    text-transform: uppercase;
    color: #acacac;
}

.fomo-about-compare__th--fomo {
    font-weight: 700;
    text-transform: uppercase;
    color: var(--fomo-hero-accent);
}

.fomo-about-compare__table tbody tr:not(:first-child) {
    border-top: 1px solid rgba(255, 255, 255, 0.05);
}

.fomo-about-compare__rowhead {
    padding: 26px;
    text-align: left;
    vertical-align: middle;
    font-weight: 600;
    font-size: 16px;
    line-height: 26px;
    color: #ffffff;
}

.fomo-about-compare__td {
    padding: 26px;
    vertical-align: middle;
    font-size: 20px;
    line-height: 32px;
}

.fomo-about-compare__td--saas {
    font-weight: 400;
    color: #acacac;
}

.fomo-about-compare__td--fomo {
    font-weight: 500;
    color: var(--fomo-hero-accent);
}

.fomo-about-compare__cell-inline {
    display: inline-flex;
    align-items: center;
    gap: 9px;
}

.fomo-about-compare__icon {
    flex-shrink: 0;
    width: 9px;
    height: 9px;
    display: block;
}

.fomo-about-compare__icon--check {
    width: 11px;
    height: 9px;
}

@media (max-width: 767px) {
    .fomo-about-compare {
        padding: 72px 24px;
    }

    .fomo-about-compare__card {
        border-radius: 28px;
    }

    .fomo-about-compare__head {
        padding: 28px 24px;
    }

    .fomo-about-compare__title {
        font-size: clamp(1.375rem, 5vw, 32px);
        line-height: 1.25;
    }

    .fomo-about-compare__th,
    .fomo-about-compare__rowhead,
    .fomo-about-compare__td {
        padding: 18px 16px;
        font-size: 14px;
        line-height: 22px;
    }

    .fomo-about-compare__td {
        font-size: 15px;
        line-height: 24px;
    }
}

/* About — key metrics (Figma 1291:31752) */
.fomo-about-metrics {
    background: #0d0d0d;
    padding: 80px clamp(24px, 6.94vw, 100px);
}

.fomo-about-metrics__shell {
    position: relative;
    max-width: 1461px;
    margin: 0 auto;
}

.fomo-about-metrics__heading--vh {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    white-space: nowrap;
    border: 0;
}

.fomo-about-metrics__grid {
    list-style: none;
    margin: 0;
    padding: 0;
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 40px;
    align-items: start;
}

.fomo-about-metrics__item {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 16px;
    min-width: 0;
    text-align: center;
}

.fomo-about-metrics__stat {
    margin: 0;
    max-width: 100%;
    font-family: 'Poppins', system-ui, -apple-system, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
    font-weight: 600;
    font-size: 56px;
    line-height: 72px;
    letter-spacing: -1.12px;
    text-align: center;
    background-image: linear-gradient(180deg, #ffffff 25.5%, #999999 100%);
    background-clip: text;
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    color: transparent;
}

.fomo-about-metrics__label {
    margin: 0;
    max-width: 100%;
    font-family: 'Poppins', system-ui, -apple-system, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
    font-weight: 400;
    font-size: 20px;
    line-height: 32px;
    color: #acacac;
    text-align: center;
}

@media (max-width: 991px) {
    .fomo-about-metrics__grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 40px 28px;
    }
}

@media (max-width: 767px) {
    .fomo-about-metrics {
        padding: 56px 24px;
    }

    .fomo-about-metrics__stat {
        font-size: clamp(2rem, 9vw, 56px);
        line-height: 1.25;
        letter-spacing: -0.06em;
    }

    .fomo-about-metrics__label {
        font-size: clamp(1rem, 3.8vw, 20px);
        line-height: 1.5;
    }
}

@media (max-width: 479px) {
    .fomo-about-metrics__grid {
        grid-template-columns: 1fr;
        gap: 32px;
    }
}

/* About — origin story card (Figma 1291:31765) */
.fomo-about-origin {
    background: #0d0d0d;
    padding: 120px clamp(24px, 6.94vw, 100px);
}

.fomo-about-origin__shell {
    position: relative;
    max-width: 1261px;
    margin: 0 auto;
}

.fomo-about-origin__heading--vh {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    white-space: nowrap;
    border: 0;
}

.fomo-about-origin__card {
    display: flex;
    flex-wrap: wrap;
    gap: 36px;
    align-items: flex-start;
    width: 100%;
    padding: 81px 89px;
    border-radius: 20px;
    border: 1px solid rgba(74, 74, 74, 0.7);
    background: #1a1a1a;
    box-sizing: border-box;
}

.fomo-about-origin__col {
    flex: 1 1 calc(50% - 18px);
    min-width: min(100%, 280px);
    display: flex;
    flex-direction: column;
    gap: 34.652px;
}

.fomo-about-origin__title {
    margin: 0;
    font-family: 'Poppins', system-ui, -apple-system, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
    font-weight: 700;
    font-size: 36px;
    line-height: 44px;
    letter-spacing: -0.72px;
    color: #ffffff;
}

.fomo-about-origin__body {
    display: flex;
    flex-direction: column;
    gap: 25.989px;
}

.fomo-about-origin__text {
    margin: 0;
    font-family: 'Poppins', system-ui, -apple-system, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
    font-weight: 400;
    font-size: 16px;
    line-height: 26px;
    color: #ffffff;
}

@media (max-width: 767px) {
    .fomo-about-origin {
        padding: 72px 24px;
    }

    .fomo-about-origin__card {
        padding: 40px 28px;
        gap: 48px;
    }

    .fomo-about-origin__col {
        flex: 1 1 100%;
        min-width: 0;
        gap: 28px;
    }

    .fomo-about-origin__title {
        font-size: clamp(1.625rem, 5vw, 36px);
        line-height: 1.22;
        letter-spacing: -0.04em;
    }

    .fomo-about-origin__text {
        font-size: 15px;
        line-height: 24px;
    }
}

@media (max-width: 479px) {
    .fomo-about-origin__card {
        padding: 32px 20px;
    }
}

/* ================= INTEGRATION PAGE (Figma 1291:32924) ================= */
.fomo-integration-hero.fomo-about-hero {
    /* min-height: 702px; */
}

.fomo-integration-hero.fomo-about-hero .fomo-about-hero__inner {
    min-height: 702px;
}

.fomo-integration-hero__content.fomo-about-hero__content {
    padding: 64px 0 80px;
    gap: 24px;
}

.fomo-integration-hero.fomo-about-hero .fomo-about-hero__title {
    max-width: 1040px;
    margin: 0;
    background: none;
    -webkit-background-clip: initial;
    background-clip: initial;
    color: #ffffff;
    filter: none;
    font-family: 'Poppins', system-ui, -apple-system, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
    font-weight: 600;
    font-size: clamp(2rem, 4.2vw, 56px);
    line-height: 72px;
    letter-spacing: -1.12px;
    text-shadow: 0 2px 28px rgba(0, 0, 0, 0.45);
    overflow-wrap: anywhere;
}

.fomo-integration-hero__lead {
    margin: 0;
    max-width: 640px;
    font-family: 'Poppins', system-ui, -apple-system, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
    font-weight: 400;
    font-size: 16px;
    line-height: 26px;
    color: #bdbdbd;
    text-align: center;
    overflow-wrap: anywhere;
}

@media (max-width: 767px) {
    .fomo-integration-hero.fomo-about-hero,
    .fomo-integration-hero.fomo-about-hero .fomo-about-hero__inner {
        min-height: 0;
    }

    .fomo-integration-hero.fomo-about-hero .fomo-about-hero__title {
        line-height: 1.15;
    }

    .fomo-integration-hero__content.fomo-about-hero__content {
        padding: 48px 0 56px;
    }
}

/* ================= USE CASES PAGE HERO (tighter shell than default about hero) ================= */

.fomo-use-cases-hero.fomo-about-hero .fomo-about-hero__inner {
    min-height: 0;
}

.fomo-use-cases-hero.fomo-about-hero .fomo-about-hero__content {
    flex: 0 0 auto;
}

.fomo-use-cases-hero__content.fomo-about-hero__content {
    align-items: center;
    justify-content: flex-start;
    padding: 80px 0 80px;
    gap: 24px;
}

.fomo-use-cases-hero__title,
.fomo-compare-hero__title {
    margin: 0;
    max-width: 1156px;
    font-family: 'Poppins', system-ui, -apple-system, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
    font-weight: 500;
    font-size: clamp(2.25rem, 5.55vw, 80px);
    line-height: 1.1;
    letter-spacing: -3.2px;
    text-align: center;
    text-wrap: balance;
    overflow-wrap: anywhere;
    background: linear-gradient(180deg, #ffffff 25.5%, #999999 118.5%);
    -webkit-background-clip: text;
    background-clip: text;
    color: transparent;
    filter: drop-shadow(0 4px 4px rgba(0, 0, 0, 0.4));
}
.fomo-compare-hero__title{
    width: 85%;
}

.fomo-compare-hero__title-line {
    display: block;
}

.fomo-use-cases-hero__subtitle,
.fomo-compare-hero__subtitle {
    margin: 0;
    max-width: 532px;
    width: 100%;
    font-family: 'Poppins', system-ui, -apple-system, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
    font-weight: 400;
    font-size: 16px;
    line-height: 26px;
    letter-spacing: 0;
    text-align: center;
    overflow-wrap: anywhere;
    color: #ffffff;
}

@media (max-width: 991px) {
    .fomo-use-cases-hero__content.fomo-about-hero__content {
        padding: 64px 0 72px;
    }

    .fomo-terms-hero__content.fomo-about-hero__content {
        padding: 64px 0 80px;
    }

    .fomo-use-cases-hero__title,
    .fomo-compare-hero__title {
        letter-spacing: -0.04em;
    }
}

@media (max-width: 767px) {
    .fomo-use-cases-hero__content.fomo-about-hero__content {
        padding: 48px 0 56px;
        gap: 20px;
    }

    .fomo-terms-hero__content.fomo-about-hero__content {
        padding: 48px 0 64px;
        gap: 20px;
    }

    .fomo-use-cases-hero__title,
    .fomo-compare-hero__title {
        font-size: clamp(1.875rem, 7vw, 2.75rem);
        line-height: 1.12;
    }

    .fomo-use-cases-hero__subtitle,
    .fomo-compare-hero__subtitle {
        font-size: 15px;
        line-height: 24px;
    }
}

/* ================= USE CASES — post-hero shell (always #0d0d0d) ================= */
.fomo-use-cases-body {
    background: #0d0d0d;
}

/* ================= COMPARE — post-hero shell ================= */
.fomo-compare-body {
    background: #0d0d0d;
}

/* ================= TERMS & CONDITIONS + PRIVACY (Figma 1291:36711, 1291:37843) ================= */
.fomo-terms-hero.fomo-about-hero .fomo-about-hero__inner {
    min-height: 0;
}

.fomo-terms-hero.fomo-about-hero .fomo-about-hero__content {
    flex: 0 0 auto;
}

.fomo-terms-hero__content.fomo-about-hero__content {
    align-items: center;
    justify-content: flex-start;
    padding: 80px 0 96px;
    gap: 24px;
}

.fomo-terms-hero__title.fomo-compare-hero__title {
    width: 100%;
    max-width: 960px;
}

/* ================= BLOG (Figma 1645:23384 hero; about-us background stack) ================= */


.fomo-blog-hero.fomo-about-hero .fomo-about-hero__inner {
    min-height: 660px;
}

.fomo-blog-hero__content.fomo-about-hero__content {
    padding: 40px 0 88px;
    gap: 20px;
}

.fomo-blog-hero__title {
    margin: 0;
    max-width: 1100px;
    width: 100%;
    font-family: 'Poppins', system-ui, -apple-system, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
    font-weight: 600;
    font-size: clamp(2.25rem, 4.6vw, 64px);
    line-height: 1.12;
    letter-spacing: -0.03em;
    text-align: center;
    text-wrap: balance;
    overflow-wrap: anywhere;
    color: #ffffff;
}

.fomo-blog-hero__subtitle {
    margin: 0;
    max-width: 820px;
    width: 100%;
    font-family: 'Poppins', system-ui, -apple-system, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
    font-weight: 400;
    font-size: clamp(16px, 1.35vw, 18px);
    line-height: 1.55;
    letter-spacing: 0;
    text-align: center;
    overflow-wrap: anywhere;
    color: rgba(255, 255, 255, 0.68);
}

.fomo-blog-hero__rss {
    margin-top: 4px;
    display: inline-flex;
    align-items: center;
    gap: 8px;
    font-family: 'Poppins', system-ui, -apple-system, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
    font-weight: 500;
    font-size: 14px;
    line-height: 1;
    color: var(--fomo-accent, #00c769);
    text-decoration: none;
}

.fomo-blog-hero__rss:hover {
    color: color-mix(in srgb, var(--fomo-accent, #00c769) 85%, #ffffff 15%);
    text-decoration: none;
}

.fomo-blog-body {
    background: #0d0d0d;
    color: rgba(255, 255, 255, 0.88);
    padding-bottom: 96px;
}

.fomo-blog-body__shell {
    max-width: 1440px;
    margin: 0 auto;
    padding: 40px clamp(24px, 6.94vw, 100px) 0;
}

.fomo-blog-body__breadcrumbs a {
    color: rgba(255, 255, 255, 0.75);
}

.fomo-blog-body__breadcrumbs .active {
    color: rgba(255, 255, 255, 0.95);
}

.fomo-blog-body__search-title {
    margin: 0 0 8px;
    font-family: 'Poppins', system-ui, sans-serif;
    font-size: 1.25rem;
    font-weight: 600;
    color: #ffffff;
}

.fomo-blog-card {
    background: #1a1a1a;
    border: 1px solid rgba(74, 74, 74, 0.7);
    border-radius: 24px;
    color: rgba(255, 255, 255, 0.92);
}

.fomo-blog-card .card-body {
    padding: clamp(20px, 3vw, 28px);
}

.fomo-blog-card__title {
    color: #ffffff;
}

.fomo-blog-card__title-link:hover .fomo-blog-card__title {
    color: var(--fomo-accent, #00c769);
}

.fomo-blog-card__meta {
    color: rgba(255, 255, 255, 0.55);
}

.fomo-blog-card__meta-link {
    color: rgba(255, 255, 255, 0.62);
    text-decoration: none;
}

.fomo-blog-card__meta-link:hover {
    color: var(--fomo-accent, #00c769);
}

.fomo-blog-card__excerpt {
    color: rgba(255, 255, 255, 0.78);
}

.fomo-blog-card__image {
    border-radius: 16px;
}

.fomo-blog-card__widget-heading {
    color: #ffffff;
}

.fomo-blog-card__list-link {
    color: rgba(255, 255, 255, 0.9);
    text-decoration: none;
}

.fomo-blog-card__list-link:hover {
    color: var(--fomo-accent, #00c769);
}

.fomo-blog-card__meta-sep {
    color: rgba(255, 255, 255, 0.45);
}

.fomo-blog-card__rank {
    font-size: 1.5rem;
    font-weight: 800;
    line-height: 1;
    color: rgba(255, 255, 255, 0.22);
}

.fomo-blog-card__input {
    background: #111111;
    border: 1px solid rgba(74, 74, 74, 0.8);
    color: #ffffff;
}

.fomo-blog-card__search-btn {
    background: rgba(255, 255, 255, 0.08);
    border: 1px solid rgba(74, 74, 74, 0.8);
    color: rgba(255, 255, 255, 0.85);
}

.fomo-blog-card__thumb-placeholder {
    background: #222222;
}

.fomo-blog-body .text-muted {
    color: rgba(255, 255, 255, 0.55) !important;
}

.fomo-blog-body .blog-post-content {
    color: rgba(255, 255, 255, 0.86);
}

.fomo-blog-body .blog-post-content h1,
.fomo-blog-body .blog-post-content h2,
.fomo-blog-body .blog-post-content h3 {
    color: #ffffff;
}

.fomo-blog-share__btn {
    background: rgba(255, 255, 255, 0.08);
    border: 1px solid rgba(74, 74, 74, 0.8);
    color: rgba(255, 255, 255, 0.9);
}

.fomo-blog-share__btn:hover {
    background: rgba(255, 255, 255, 0.14);
    color: #ffffff;
}

/* ----- Blog body (Figma 1645:25984) — featured, grid cards, filters, must-read ----- */
.fomo-blog-featured {
    display: flex;
    flex-wrap: wrap;
    gap: 40px;
    align-items: stretch;
    justify-content: center;
    width: 100%;
    padding: 32px;
    margin-bottom: 80px;
    background: #1a1a1a;
    border: 1px solid rgba(74, 74, 74, 0.7);
    border-radius: 40px;
    box-sizing: border-box;
}

.fomo-blog-featured__media {
    display: block;
    flex: 0 1 680px;
    max-width: 100%;
    min-height: 280px;
    border-radius: 20px;
    overflow: hidden;
    border: 1px solid rgba(74, 74, 74, 0.7);
    text-decoration: none;
}

.fomo-blog-featured__img {
    display: block;
    width: 100%;
    height: 100%;
    min-height: 280px;
    object-fit: cover;
}

.fomo-blog-featured__img-placeholder {
    display: block;
    width: 100%;
    min-height: 320px;
    background: linear-gradient(135deg, #1f2a24 0%, #0d0d0d 50%, #142018 100%);
}

.fomo-blog-featured__content {
    flex: 1 1 280px;
    min-width: 0;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    gap: 24px;
}

.fomo-blog-featured__label-outer {
    display: inline-flex;
    padding: 4px;
    border-radius: 40px;
    background: rgba(41, 255, 155, 0.25);
    align-self: flex-start;
}

.fomo-blog-featured__label {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 6px 16px 7px;
    border-radius: 24px;
    border: 1px solid #29ff9b;
    font-family: 'Poppins', system-ui, sans-serif;
    font-size: 14px;
    line-height: 16px;
    font-weight: 400;
    color: #ffffff;
    text-decoration: none;
}

.fomo-blog-featured__label:hover {
    color: #ffffff;
    text-decoration: none;
    filter: brightness(1.08);
}

.fomo-blog-featured__text {
    display: flex;
    flex-direction: column;
    gap: 12px;
}

.fomo-blog-featured__title {
    margin: 0;
    font-family: 'Poppins', system-ui, sans-serif;
    font-weight: 500;
    font-size: clamp(1.5rem, 2.8vw, 2rem);
    line-height: 1.25;
    letter-spacing: -0.02em;
    overflow-wrap: anywhere;
}

.fomo-blog-featured__title a {
    color: transparent;
    background: linear-gradient(180deg, #ffffff 25.5%, #999999 118.5%);
    -webkit-background-clip: text;
    background-clip: text;
    text-decoration: none;
}

.fomo-blog-featured__title a:hover {
    text-decoration: none;
    filter: brightness(1.05);
}

.fomo-blog-featured__byline {
    margin: 0;
    font-family: 'Poppins', system-ui, sans-serif;
    font-size: 16px;
    line-height: 26px;
    overflow-wrap: anywhere;
    color: #ffffff;
}

.fomo-blog-featured__excerpt {
    margin: 0;
    font-family: 'Poppins', system-ui, sans-serif;
    font-size: 16px;
    line-height: 26px;
    overflow-wrap: anywhere;
    color: #bdbdbd;
}

.fomo-blog-featured__cta {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 12px;
    align-self: flex-start;
    padding: 12px 24px;
    border-radius: 80px;
    background: #29ff9b;
    font-family: 'Poppins', system-ui, sans-serif;
    font-weight: 500;
    font-size: 16px;
    line-height: 26px;
    color: #0d0d0d;
    text-decoration: none;
    transition: filter 0.2s ease, transform 0.2s ease;
}

.fomo-blog-featured__cta:hover {
    color: #0d0d0d;
    text-decoration: none;
    filter: brightness(1.05);
    transform: translateY(-1px);
}

/* Single post: Figma 1645:25985 featured lead + compact insights (26000/26001) + must-read (26037) */
.fomo-blog-post-hero.fomo-about-hero.fomo-terms-hero {
    min-height: 0;
}

.fomo-blog-post-hero .fomo-about-hero__inner.fomo-blog-post-hero__inner {
    min-height: 0;
    padding-bottom: 40px;
}

.fomo-blog-featured--post-lead {
    margin-bottom: 32px;
}

.fomo-blog-featured--post-lead .fomo-blog-featured__media {
    min-height: 320px;
    max-height: 440px;
}

.fomo-blog-featured--post-lead .fomo-blog-featured__img,
.fomo-blog-featured--post-lead .fomo-blog-featured__img-placeholder {
    min-height: 320px;
    max-height: 440px;
}

.fomo-blog-featured--post-lead .fomo-blog-featured__title {
    font-size: clamp(1.75rem, 3vw, 2rem);
    line-height: 1.25;
    letter-spacing: -0.02em;
    font-weight: 500;
    color: transparent;
    background: linear-gradient(180deg, #ffffff 25.5%, #999999 118.5%);
    -webkit-background-clip: text;
    background-clip: text;
    filter: drop-shadow(0 4px 4px rgba(0, 0, 0, 0.35));
}

.fomo-blog-featured__profile {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 16px;
}

.fomo-blog-featured__avatar {
    width: 40px;
    height: 40px;
    border-radius: 50%;
    object-fit: cover;
    flex-shrink: 0;
}

.fomo-blog-featured__avatar--letter {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background: rgba(41, 255, 155, 0.18);
    border: 1px solid rgba(41, 255, 155, 0.45);
    font-family: 'Poppins', system-ui, sans-serif;
    font-weight: 600;
    font-size: 16px;
    line-height: 1;
    color: #ffffff;
}

.fomo-blog-featured__profile .fomo-blog-featured__byline {
    margin: 0;
}

.fomo-blog-featured__meta-line {
    margin: 0;
    font-family: 'Poppins', system-ui, sans-serif;
    font-size: 15px;
    line-height: 1.5;
    color: rgba(255, 255, 255, 0.55);
}

.fomo-blog-featured__meta-sep {
    opacity: 0.7;
}

.fomo-blog-insights--compact {
    margin-bottom: 48px;
}

.fomo-blog-insights--compact .fomo-blog-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
}

@media (max-width: 575px) {
    .fomo-blog-insights--compact .fomo-blog-grid {
        grid-template-columns: 1fr;
    }
}

/* Blog detail (Figma 1645:22939) — stacked header, article tags, actions, sidebar */
.fomo-blog-detail__container {
    width: 100%;
    max-width: 100%;
    margin: 0;
    padding-left: 0;
    padding-right: 0;
}

.fomo-blog-detail-body .fomo-blog-body__shell {
    padding-bottom: 80px;
}

.fomo-blog-detail__lead {
    width: 100%;
    margin-bottom: 48px;
}

.fomo-blog-detail__row {
    align-items: flex-start;
}

@media (min-width: 992px) {
    .fomo-blog-detail__row {
        --bs-gutter-x: 3rem;
    }

    .fomo-blog-detail__aside {
        position: sticky;
        top: 96px;
    }
}

.fomo-blog-detail__header {
    text-align: center;
    margin-bottom: 24px;
}

.fomo-blog-detail__meta {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: center;
    gap: 8px 12px;
    margin-bottom: 16px;
    font-family: 'Poppins', system-ui, sans-serif;
    font-size: 16px;
    line-height: 32px;
    color: rgba(255, 255, 255, 0.85);
}

.fomo-blog-detail__meta-author {
    font-weight: 500;
    color: #ffffff;
}

.fomo-blog-detail__meta-dot {
    color: rgba(255, 255, 255, 0.45);
    user-select: none;
}

.fomo-blog-detail__meta-chip {
    display: inline-flex;
    align-items: center;
    padding: 4px 12px;
    border-radius: 80px;
    border: 0.5px solid #70ffbc;
    font-size: 14px;
    line-height: 22px;
    font-weight: 400;
    color: #70ffbc;
    text-decoration: none;
    transition: background-color 0.2s ease, color 0.2s ease;
}

.fomo-blog-detail__meta-chip:hover {
    background: rgba(112, 255, 188, 0.12);
    color: #9fffd8;
    text-decoration: none;
}

.fomo-blog-detail__meta-chip--muted {
    border-color: rgba(255, 255, 255, 0.25);
    color: rgba(255, 255, 255, 0.55);
}

.fomo-blog-detail__meta-date {
    color: rgba(255, 255, 255, 0.85);
}

.fomo-blog-detail__title {
    font-family: 'Poppins', system-ui, sans-serif;
    font-weight: 500;
    font-size: clamp(1.75rem, 3.2vw, 2.25rem);
    line-height: 1.25;
    letter-spacing: -0.02em;
    color: transparent;
    background: linear-gradient(180deg, #ffffff 25.5%, #999999 118.5%);
    -webkit-background-clip: text;
    background-clip: text;
    filter: drop-shadow(0 4px 4px rgba(0, 0, 0, 0.35));
}

.fomo-blog-detail__hero {
    margin-bottom: 0;
    border-radius: 24px;
    overflow: hidden;
    background: #1a1a1a;
    min-height: 200px;
}

.fomo-blog-detail__hero-img {
    display: block;
    width: 100%;
    height: auto;
    min-height: 280px;
    max-height: min(520px, 56vw);
    object-fit: cover;
}

.fomo-blog-detail__hero-placeholder {
    display: block;
    min-height: 320px;
    background: linear-gradient(145deg, #1f1f1f, #0d0d0d);
}

.fomo-blog-post-article.card.fomo-blog-card,
.fomo-blog-detail__article.card.fomo-blog-card {
    border-radius: 40px;
    margin-bottom: 32px;
}

.fomo-blog-detail__lead-text {
    font-family: 'Poppins', system-ui, sans-serif;
    font-size: 17px;
    line-height: 1.6;
    color: rgba(255, 255, 255, 0.78);
    margin: 0 0 1.25rem;
}

.fomo-blog-detail__feedback {
    margin-top: 1.5rem;
    padding-top: 1.25rem;
    border-top: 1px solid rgba(255, 255, 255, 0.08);
}

/* Post footer: share + stats (Figma engage row) */
.fomo-blog-detail__engage {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    width: 100%;
    margin-top: 8px;
    margin-bottom: 32px;
    min-height: 32px;
}

.fomo-blog-detail__engage-left {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 8px;
    min-height: 40px;
}

.fomo-blog-detail__engage-sharebtns {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 8px;
}

.fomo-blog-detail__engage-sharebtn {
    width: 40px;
    height: 40px;
    padding: 0 !important;
    display: inline-flex !important;
    align-items: center;
    justify-content: center;
    border-radius: 10px !important;
    border: none !important;
    box-sizing: border-box;
    background: rgba(255, 255, 255, 0.06) !important;
    color: #eeeeee !important;
    text-decoration: none !important;
    transition: background-color 0.2s ease, color 0.2s ease;
}

.fomo-blog-detail__engage-sharebtn:hover {
    background: rgba(255, 255, 255, 0.12) !important;
    color: #ffffff !important;
}

.fomo-blog-detail__engage-sharebtn.is-copied {
    color: var(--fomo-accent, #00c769) !important;
}

.fomo-blog-detail__engage-sharebtn .svg-sm {
    width: 18px;
    height: 18px;
}

.fomo-blog-detail__engage-sharebtn .svg-sm svg {
    fill: currentColor;
}

.fomo-blog-detail__engage-share {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 40px;
    height: 40px;
    padding: 0;
    border: none;
    border-radius: 10px;
    background: transparent;
    color: #eeeeee;
    font-size: 18px;
    cursor: pointer;
    transition: color 0.2s ease, background-color 0.2s ease;
}

.fomo-blog-detail__engage-share:hover {
    color: #ffffff;
    background: rgba(255, 255, 255, 0.06);
}

.fomo-blog-detail__engage-share.is-copied {
    color: var(--fomo-accent, #00c769);
}

.fomo-blog-detail__engage-right {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: flex-end;
    gap: 8px 20px;
}

.fomo-blog-detail__engage-stat {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    color: #eeeeee;
    font-family: 'Poppins', system-ui, sans-serif;
    font-size: 16px;
    line-height: 26px;
}

.fomo-blog-detail__engage-stat > .fas {
    font-size: 18px;
    opacity: 0.95;
}

.fomo-blog-detail__engage-stat--link {
    text-decoration: none;
    transition: color 0.2s ease;
}

.fomo-blog-detail__engage-stat--link:hover {
    color: #ffffff;
    text-decoration: none;
}

.fomo-blog-detail__engage-stat-text {
    display: inline-flex;
    align-items: baseline;
    gap: 6px;
    white-space: nowrap;
}

.fomo-blog-detail__engage-num {
    font-weight: 600;
    color: #eeeeee;
}

.fomo-blog-detail__engage-label {
    font-weight: 400;
    color: #eeeeee;
}

/* Author card (Figma team-card) */
.fomo-blog-detail__author-card {
    width: 100%;
    margin-bottom: 40px;
    padding: 32px 28px;
    border-radius: 20px;
    background: #1a1a1a;
    border: 1px solid rgba(74, 74, 74, 0.7);
    box-sizing: border-box;
}

@media (min-width: 768px) {
    .fomo-blog-detail__author-card {
        padding: 40px;
    }
}

.fomo-blog-detail__author-head {
    display: flex;
    flex-wrap: wrap;
    align-items: flex-end;
    gap: 20px 24px;
    width: 100%;
}

.fomo-blog-detail__author-avatar-wrap {
    flex-shrink: 0;
}

.fomo-blog-detail__author-avatar {
    display: block;
    width: 84px;
    height: 84px;
    border-radius: 50%;
    object-fit: cover;
    background: #d9d9d9;
}

.fomo-blog-detail__author-avatar--placeholder {
    background: linear-gradient(145deg, rgba(255, 255, 255, 0.12), rgba(255, 255, 255, 0.04));
}

.fomo-blog-detail__author-text {
    flex: 1 1 200px;
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: 12px;
}

.fomo-blog-detail__author-name {
    margin: 0;
    font-family: 'Poppins', system-ui, sans-serif;
    font-size: clamp(22px, 4vw, 32px);
    font-weight: 500;
    line-height: 1.25;
    letter-spacing: -0.02em;
    color: #ffffff;
}

.fomo-blog-detail__author-role {
    margin: 0;
    font-family: 'Poppins', system-ui, sans-serif;
    font-size: clamp(16px, 2.5vw, 20px);
    font-weight: 400;
    line-height: 1.6;
    color: #bdbdbd;
}

.fomo-blog-detail__author-socials {
    display: flex;
    align-items: center;
    gap: 24px;
    margin-left: auto;
}

@media (max-width: 600px) {
    .fomo-blog-detail__author-socials {
        margin-left: 0;
        width: 100%;
        justify-content: flex-start;
    }
}

.fomo-blog-detail__author-social {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 32px;
    height: 32px;
    border-radius: 999px;
    background: #fcfcfc;
    color: var(--fomo-accent, #009f54);
    text-decoration: none;
    font-size: 14px;
    transition: transform 0.2s ease, box-shadow 0.2s ease;
}

.fomo-blog-detail__author-social:hover {
    color: var(--fomo-accent, #009f54);
    text-decoration: none;
    transform: translateY(-1px);
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.25);
}

.fomo-blog-detail__author-bio {
    margin: 32px 0 0;
    font-family: 'Poppins', system-ui, sans-serif;
    font-size: 16px;
    line-height: 26px;
    font-weight: 400;
    color: #9e9e9e;
}

/* Star ratings below author */
.fomo-blog-detail__rating {
    margin-top: 0;
    padding-top: 1.25rem;
    border-top: 1px solid rgba(255, 255, 255, 0.08);
}

.fomo-blog-detail__rating .text-muted {
    color: rgba(255, 255, 255, 0.55) !important;
}

.fomo-blog-detail__rating .rating-star {
    cursor: pointer;
    color: #f6c343;
}

.fomo-blog-detail__article-tags {
    margin-bottom: 24px;
}

.fomo-blog-detail__article-tags-inner {
    display: flex;
    flex-wrap: wrap;
    gap: 12px 16px;
    align-items: center;
    justify-content: center;
}

.fomo-blog-detail__tag-pill {
    display: inline-flex;
    align-items: center;
    padding: 6px 14px;
    border-radius: 80px;
    background: #ffffff;
    border: 1px solid rgba(255, 255, 255, 0.2);
    font-family: 'Poppins', system-ui, sans-serif;
    font-size: 14px;
    line-height: 16px;
    font-weight: 400;
    color: var(--fomo-accent, #00c769);
    text-decoration: none;
    transition: filter 0.2s ease, transform 0.2s ease, box-shadow 0.2s ease;
}

.fomo-blog-detail__tag-pill:hover {
    filter: brightness(1.05);
    text-decoration: none;
    transform: translateY(-1px);
    box-shadow: 0 4px 16px rgba(0, 0, 0, 0.2);
}

.fomo-blog-detail__tag-pill.is-current {
    box-shadow: 0 0 0 2px var(--fomo-accent, #00c769);
}

.fomo-blog-detail__actions {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    margin-bottom: 48px;
    min-height: 32px;
}

.fomo-blog-detail__icon-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 44px;
    height: 44px;
    padding: 0;
    border: none;
    border-radius: 12px;
    background: rgba(255, 255, 255, 0.06);
    color: rgba(255, 255, 255, 0.85);
    cursor: pointer;
    transition: background-color 0.2s ease, color 0.2s ease;
}

.fomo-blog-detail__icon-btn:hover {
    background: rgba(255, 255, 255, 0.12);
    color: #ffffff;
}

.fomo-blog-detail__icon-btn.is-copied {
    color: var(--fomo-accent, #00c769);
}

.fomo-blog-detail__responses {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    font-family: 'Poppins', system-ui, sans-serif;
    font-size: 16px;
    line-height: 26px;
    font-weight: 400;
    color: rgba(255, 255, 255, 0.88);
    text-decoration: none;
    transition: color 0.2s ease;
}

.fomo-blog-detail__responses:hover {
    color: #70ffbc;
    text-decoration: none;
}

.fomo-blog-detail__sidebar .card-body.fomo-blog-detail__sidebar-body {
    padding: 32px;
}

.fomo-blog-detail__search {
    display: flex;
    align-items: center;
    gap: 12px;
    width: 100%;
    padding: 12px 16px;
    border-radius: 80px;
    border: 0.5px solid rgba(189, 189, 189, 0.45);
    background: rgba(13, 13, 13, 0.6);
    margin-bottom: 40px;
    box-sizing: border-box;
}

.fomo-blog-detail__search-icon {
    flex-shrink: 0;
    font-size: 16px;
    color: rgba(255, 255, 255, 0.45);
}

.fomo-blog-detail__search-input {
    flex: 1;
    min-width: 0;
    border: none;
    background: transparent;
    font-family: 'Poppins', system-ui, sans-serif;
    font-size: 16px;
    line-height: 26px;
    color: #ffffff;
    outline: none;
}

.fomo-blog-detail__search-input::placeholder {
    color: rgba(189, 189, 189, 0.85);
}

.fomo-blog-detail__sidebar-block {
    margin-bottom: 32px;
}

.fomo-blog-detail__sidebar-block--latest {
    margin-bottom: 0;
}

.fomo-blog-detail__sidebar-heading {
    margin: 0 0 24px;
    font-family: 'Poppins', system-ui, sans-serif;
    font-weight: 600;
    font-size: 18px;
    line-height: 40px;
    color: #ffffff;
}

.fomo-blog-detail__sidebar-tags {
    display: flex;
    flex-wrap: wrap;
    gap: 12px 16px;
}

.fomo-blog-detail__sidebar-tag {
    display: inline-flex;
    align-items: center;
    padding: 5px 12px 6px;
    border-radius: 80px;
    border: 0.5px solid #70ffbc;
    font-family: 'Poppins', system-ui, sans-serif;
    font-size: 14px;
    line-height: 16px;
    font-weight: 400;
    color: #70ffbc;
    text-decoration: none;
    transition: background-color 0.2s ease, color 0.2s ease;
}

.fomo-blog-detail__sidebar-tag:hover {
    background: rgba(112, 255, 188, 0.12);
    color: #9fffd8;
    text-decoration: none;
}

.fomo-blog-detail__sidebar-tag--inline {
    pointer-events: none;
    flex-shrink: 0;
}

.fomo-blog-detail__latest-list {
    display: flex;
    flex-direction: column;
    gap: 32px;
}

.fomo-blog-detail__latest-item {
    display: flex;
    flex-direction: column;
    gap: 12px;
    text-decoration: none;
    color: inherit;
    transition: opacity 0.2s ease;
}

.fomo-blog-detail__latest-item:hover {
    opacity: 0.92;
    text-decoration: none;
}

.fomo-blog-detail__latest-title {
    font-family: 'Poppins', system-ui, sans-serif;
    font-weight: 500;
    font-size: 16px;
    line-height: 24px;
    color: #ffffff;
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

.fomo-blog-detail__latest-meta {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 10px 12px;
    font-family: 'Poppins', system-ui, sans-serif;
    font-size: 13px;
    line-height: 16px;
    color: rgba(189, 189, 189, 0.95);
}

.fomo-blog-post-article .blog-post-content,
.fomo-blog-detail__article .blog-post-content {
    font-family: 'Poppins', system-ui, sans-serif;
    font-size: 16px;
    line-height: 1.65;
}

.fomo-blog-insights {
    margin-bottom: 80px;
}

.fomo-blog-insights__heading,
.fomo-blog-mustread__heading {
    margin: 0 0 32px;
    text-align: center;
    font-family: 'Poppins', system-ui, sans-serif;
    font-weight: 500;
    font-size: clamp(2rem, 4vw, 3.5rem);
    line-height: 1.15;
    letter-spacing: -0.04em;
    color: transparent;
    background: linear-gradient(180deg, #ffffff 25.5%, #999999 118.5%);
    -webkit-background-clip: text;
    background-clip: text;
}

.fomo-blog-filter {
    display: flex;
    flex-wrap: nowrap;
    gap: 16px;
    align-items: center;
    justify-content: flex-start;
    padding: 8px 16px 8px 8px;
    margin: 0 auto 32px;
    max-width: 100%;
    width: 100%;
    background: #1a1a1a;
    border: 0.5px solid rgba(74, 74, 74, 0.7);
    border-radius: 80px;
    box-sizing: border-box;
    overflow-x: auto;
    overflow-y: hidden;
    -webkit-overflow-scrolling: touch;
    overscroll-behavior-x: contain;
    scrollbar-width: none;
}

.fomo-blog-filter::-webkit-scrollbar {
    display: none;
}

.fomo-blog-filter--category {
    justify-content: flex-start;
}

.fomo-blog-filter__pill {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    padding: 8px 16px;
    border-radius: 80px;
    font-family: 'Poppins', system-ui, sans-serif;
    font-size: 16px;
    line-height: 26px;
    font-weight: 400;
    color: #fcfcfc;
    text-decoration: none;
    white-space: nowrap;
    transition: background-color 0.2s ease, color 0.2s ease;
}

button.fomo-blog-filter__pill {
    border: none;
    background: transparent;
    cursor: pointer;
    font: inherit;
    box-sizing: border-box;
    -webkit-appearance: none;
    appearance: none;
}

.fomo-blog-filter__pill:hover {
    color: #ffffff;
    text-decoration: none;
    background: rgba(255, 255, 255, 0.06);
}

.fomo-blog-filter__pill.is-active {
    background: #29ff9b;
    color: #000000;
    font-weight: 500;
}

.fomo-blog-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 24px;
    width: 100%;
}

@media (max-width: 991px) {
    .fomo-blog-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 600px) {
    .fomo-blog-grid {
        grid-template-columns: 1fr;
    }
}

.fomo-blog-card.fomo-blog-card--post {
    display: flex;
    flex-direction: column;
    gap: 24px;
    padding: 16px 16px 32px;
    margin: 0;
    border-radius: 40px;
    border: 2px solid rgba(74, 74, 74, 0.45);
    background: #1a1a1a;
    box-sizing: border-box;
    transition:
        border-color 0.22s ease,
        background-color 0.22s ease,
        box-shadow 0.22s ease,
        transform 0.22s ease;
}

.fomo-blog-card.fomo-blog-card--post:hover {
    border-color: rgba(41, 255, 155, 0.7);
    background: #0d0d0d;
    box-shadow: 0 0 32px rgba(41, 255, 155, 0.12);
    transform: translateY(-3px);
}

@media (prefers-reduced-motion: reduce) {
    .fomo-blog-card.fomo-blog-card--post:hover {
        transform: none;
    }

    .fomo-blog-featured__cta:hover {
        transform: none;
    }
}

.fomo-blog-card--post__media {
    display: block;
    width: 100%;
    height: 300px;
    border-radius: 20px;
    overflow: hidden;
    text-decoration: none;
}

.fomo-blog-card--post__img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.fomo-blog-card--post__img-placeholder {
    display: block;
    width: 100%;
    height: 100%;
    background: linear-gradient(145deg, #1a2420 0%, #0d0d0d 55%, #16261c 100%);
}

.fomo-blog-card--post__body {
    display: flex;
    flex-direction: column;
    gap: 16px;
    width: 100%;
    padding: 0 16px;
    box-sizing: border-box;
}

.fomo-blog-card--post__date {
    margin: 0;
    width: 100%;
    text-align: right;
    font-family: 'Poppins', system-ui, sans-serif;
    font-size: 16px;
    line-height: 26px;
    color: #bdbdbd;
}

.fomo-blog-card--post__text {
    display: flex;
    flex-direction: column;
    gap: 12px;
    align-items: flex-start;
    width: 100%;
}

.fomo-blog-card__chip {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 5px 12px 6px;
    border-radius: 80px;
    border: 0.5px solid #70ffbc;
    font-family: 'Poppins', system-ui, sans-serif;
    font-size: 14px;
    line-height: 16px;
    font-weight: 400;
    color: #70ffbc;
    text-decoration: none;
    transition: background-color 0.2s ease, color 0.2s ease;
    width: fit-content;
}

a.fomo-blog-card__chip:hover {
    color: #0d0d0d;
    background: rgba(112, 255, 188, 0.95);
    text-decoration: none;
}

.fomo-blog-card--post__title {
    margin: 0;
    font-family: 'Poppins', system-ui, sans-serif;
    font-weight: 500;
    font-size: 20px;
    line-height: 32px;
    overflow-wrap: anywhere;
    color: #ffffff;
}

.fomo-blog-card--post__title a {
    color: inherit;
    text-decoration: none;
}

.fomo-blog-card--post__title a:hover {
    color: #70ffbc;
    text-decoration: none;
}

.fomo-blog-card--post__excerpt {
    margin: 0;
    font-family: 'Poppins', system-ui, sans-serif;
    font-size: 15px;
    line-height: 24px;
    color: rgba(255, 255, 255, 0.72);
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
    overflow: hidden;
    overflow-wrap: anywhere;
}

.fomo-blog-card--post__views {
    margin: 0;
    font-size: 13px;
    line-height: 1.4;
    color: rgba(255, 255, 255, 0.45);
}

.fomo-blog-insights__footer {
    display: flex;
    justify-content: center;
    margin-top: 64px;
}

.fomo-blog-explore {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 12px 24px;
    border-radius: 80px;
    border: 1px solid #70ffbc;
    font-family: 'Poppins', system-ui, sans-serif;
    font-weight: 500;
    font-size: 16px;
    line-height: 26px;
    color: #70ffbc;
    text-decoration: none;
    transition: background-color 0.2s ease, color 0.2s ease;
    background-color: #0d0d0d;
}

.fomo-blog-explore:hover {
    background: rgba(112, 255, 188, 0.12);
    color: #9fffd8;
    text-decoration: none;
}

button.fomo-blog-explore {
    cursor: pointer;
    font: inherit;
    -webkit-appearance: none;
    appearance: none;
}

.fomo-blog-explore.is-loading {
    pointer-events: none;
    opacity: 0.65;
}

.fomo-blog-mustread {
    margin-bottom: 24px;
}

.fomo-blog-mustread__row {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 40px;
    width: 100%;
}

@media (max-width: 767px) {
    .fomo-blog-mustread__row {
        grid-template-columns: 1fr;
    }

    .fomo-blog-featured {
        flex-direction: column;
    }

    .fomo-blog-featured__media {
        flex: 1 1 auto;
        width: 100%;
    }
}

.fomo-blog-text-card {
    display: flex;
    flex-direction: column;
    min-height: 240px;
    padding: 32px;
    border-radius: 20px;
    background: #1a1a1a;
    border: 1px solid rgba(74, 74, 74, 0.7);
    text-decoration: none;
    color: inherit;
    box-sizing: border-box;
    transition:
        border-color 0.22s ease,
        background-color 0.22s ease,
        box-shadow 0.22s ease,
        transform 0.22s ease;
}

.fomo-blog-text-card:hover {
    border-color: rgba(41, 255, 155, 0.55);
    background: #0d0d0d;
    box-shadow: 0 0 28px rgba(41, 255, 155, 0.1);
    transform: translateY(-2px);
    text-decoration: none;
    color: inherit;
}

.fomo-blog-text-card__inner {
    display: flex;
    flex-direction: column;
    gap: 16px;
    height: 100%;
}

.fomo-blog-text-card__title {
    font-family: 'Poppins', system-ui, sans-serif;
    font-weight: 500;
    font-size: 24px;
    line-height: 32px;
    color: transparent;
    overflow-wrap: anywhere;
    background: linear-gradient(180deg, #ffffff 25.5%, #999999 118.5%);
    -webkit-background-clip: text;
    background-clip: text;
}

.fomo-blog-text-card__excerpt {
    font-family: 'Poppins', system-ui, sans-serif;
    font-size: 16px;
    line-height: 26px;
    color: #bdbdbd;
    display: -webkit-box;
    -webkit-line-clamp: 4;
    -webkit-box-orient: vertical;
    overflow: hidden;
    overflow-wrap: anywhere;
}

.fomo-blog-text-card__date {
    margin-top: auto;
    font-family: 'Poppins', system-ui, sans-serif;
    font-size: 16px;
    line-height: 26px;
    color: #bdbdbd;
}

@media (max-width: 991px) {
    .fomo-blog-featured {
        margin-bottom: 56px;
    }

    .fomo-blog-insights {
        margin-bottom: 56px;
    }

    .fomo-blog-hero.fomo-about-hero,
    .fomo-blog-hero.fomo-about-hero .fomo-about-hero__inner {
        min-height: 560px;
    }

    .fomo-blog-hero__content.fomo-about-hero__content {
        padding: 32px 0 72px;
    }
}

@media (max-width: 767px) {
    .fomo-blog-insights__footer {
        margin-top: 40px;
    }

    .fomo-blog-hero__content.fomo-about-hero__content {
        padding: 24px 0 56px;
        gap: 16px;
    }
}

.fomo-terms-body {
    background: #0d0d0d;
    color: #ffffff;
}

.fomo-terms__shell {
    max-width: 1440px;
    margin: 0 auto;
    padding: 0 clamp(24px, 6.94vw, 100px) 120px;
}

.fomo-terms__card {
    position: relative;
    margin-top: -300px;
    padding: 40px clamp(24px, 4vw, 40px);
    border-radius: 40px;
    background: #1a1a1a;
    border: 1px solid rgba(74, 74, 74, 0.7);
    box-sizing: border-box;
}

.fomo-terms__vh {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    white-space: nowrap;
    border: 0;
}

.fomo-terms__prose {
    max-width: 1140px;
    margin: 0 auto;
}

.fomo-terms__prose a,
.fomo-terms__prose p,
.fomo-terms__prose li {
    overflow-wrap: anywhere;
}

.fomo-terms__section-title {
    margin: 2.25rem 0 0.75rem;
    font-family: 'Poppins', system-ui, -apple-system, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
    font-weight: 600;
    font-size: 24px;
    line-height: 1.6;
    overflow-wrap: anywhere;
    color: #ffffff;
}

.fomo-terms__section-title:first-child {
    margin-top: 0;
}

.fomo-terms__section-title--medium {
    font-weight: 500;
}

.fomo-terms__list {
    margin: 0;
    padding: 0;
    list-style-position: outside;
    font-family: 'Poppins', system-ui, -apple-system, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
    font-weight: 400;
    font-size: 18px;
    line-height: 1.6;
    overflow-wrap: anywhere;
    color: #ffffff;
}

.fomo-terms__list--root {
    padding-left: 1.35em;
    list-style-type: disc;
}

.fomo-terms__list--nested {
    margin-top: 0.35em;
    margin-bottom: 0.35em;
    padding-left: 1.35em;
    list-style-type: disc;
}

.fomo-terms__list li {
    margin: 0.15em 0;
}

.fomo-terms__strong {
    font-weight: 600;
}

@media (max-width: 991px) {
    .fomo-terms__card {
        margin-top: -64px;
        border-radius: 28px;
        padding: 32px 24px;
    }
}

@media (max-width: 767px) {
    .fomo-terms__card {
        margin-top: -48px;
        border-radius: 24px;
        padding: 28px 20px;
    }

    .fomo-terms__section-title {
        font-size: 20px;
    }

    .fomo-terms__list {
        font-size: 16px;
    }
}

/* ================= COMPARE — master matrix (Figma 1291:35487 “Section - Master Matrix”) ================= */
.fomo-compare-matrix {
    background: #0d0d0d;
    color: #ffffff;
}

.fomo-compare-matrix__inner {
    max-width: 1296px;
    margin: 0 auto;
    padding: 144px clamp(24px, 7.5vw, 108px);
    display: flex;
    flex-direction: column;
    align-items: stretch;
    gap: 72px;
}

.fomo-compare-matrix__head {
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
    gap: 24px;
    width: 100%;
}

.fomo-compare-matrix__pill-outer {
    display: inline-flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 4px;
    border-radius: 40px;
    background: rgba(41, 255, 130, 0.25);
}

.fomo-compare-matrix__pill-inner {
    border: 1px solid #00952a;
    border-radius: 24px;
    padding: 6px 16px 8px;
}

.fomo-compare-matrix__pill-text {
    font-family: 'Poppins', system-ui, -apple-system, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
    font-weight: 400;
    font-size: 16px;
    line-height: 26px;
    color: #ffffff;
}

.fomo-compare-matrix__title {
    margin: 0;
    max-width: 1042px;
    width: 100%;
    font-family: 'Poppins', system-ui, -apple-system, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
    font-weight: 500;
    font-size: clamp(2rem, 4vw, 56px);
    line-height: 1.286;
    letter-spacing: -2.24px;
    text-transform: uppercase;
    text-align: center;
    text-wrap: balance;
    overflow-wrap: anywhere;
    background: linear-gradient(180deg, #ffffff 25.5%, #999999 118.5%);
    -webkit-background-clip: text;
    background-clip: text;
    color: transparent;
    filter: drop-shadow(0 4px 4px rgba(0, 0, 0, 0.25));
}

.fomo-compare-matrix__lead {
    margin: 0;
    max-width: 546px;
    width: 100%;
    font-family: 'Poppins', system-ui, -apple-system, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
    font-weight: 400;
    font-size: 16px;
    line-height: 26px;
    overflow-wrap: anywhere;
    color: #bdbdbd;
}

.fomo-compare-matrix__table-wrap {
    width: 100%;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    overscroll-behavior-x: contain;
    padding-bottom: 2px;
}

.fomo-compare-matrix__table {
    display: flex;
    flex-direction: column;
    width: 100%;
    min-width: 680px;
    max-width: 1223px;
    margin: 0 auto;
}

.fomo-compare-matrix__row {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(0, 1.55fr) minmax(0, 1.49fr);
    align-items: stretch;
}

.fomo-compare-matrix__cell {
    box-sizing: border-box;
    padding: 36px 36px 37px;
    border-bottom: 1.125px solid rgba(59, 74, 61, 0.1);
    font-family: 'Poppins', system-ui, -apple-system, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
    font-size: 20px;
    line-height: 32px;
    text-align: left;
}

.fomo-compare-matrix__cell--head {
    font-weight: 500;
    color: #b0e1ca;
    padding-bottom: 37px;
}

.fomo-compare-matrix__cell--head.fomo-compare-matrix__cell--fomo {
    color: var(--fomo-accent, #00c769);
    background: rgba(27, 33, 27, 0.5);
    border: 2.25px solid color-mix(in srgb, var(--fomo-accent, #00c769) 40%, transparent);
    border-bottom: 1.125px solid color-mix(in srgb, var(--fomo-accent, #00c769) 40%, transparent);
    border-radius: 14px 14px 0 0;
}

.fomo-compare-matrix__cell--body.fomo-compare-matrix__cell--feature {
    font-weight: 600;
    color: #ffffff;
}

.fomo-compare-matrix__feature-label {
    white-space: nowrap;
}

.fomo-compare-matrix__saas-plain {
    font-weight: 400;
    color: #acacac;
}

.fomo-compare-matrix__inline {
    display: flex;
    align-items: center;
    gap: 9px;
}

.fomo-compare-matrix__saas-neg {
    font-weight: 400;
    color: #ff5252;
    white-space: nowrap;
}

.fomo-compare-matrix__x-ico {
    flex-shrink: 0;
}

.fomo-compare-matrix__cell--body.fomo-compare-matrix__cell--fomo {
    border-color: color-mix(in srgb, var(--fomo-accent, #00c769) 40%, transparent);
    border-left-width: 2.25px;
    border-right-width: 2.25px;
    border-left-style: solid;
    border-right-style: solid;
    border-bottom-style: solid;
    border-bottom-width: 1.125px;
    background: color-mix(in srgb, var(--fomo-accent, #00c769) 5%, transparent);
}

.fomo-compare-matrix__row:nth-child(2) .fomo-compare-matrix__cell--fomo {
    border-top: none;
}

.fomo-compare-matrix__fomo-plain {
    font-weight: 500;
    color: #acacac;
}

.fomo-compare-matrix__fomo-plain--muted {
    font-weight: 500;
}

.fomo-compare-matrix__inline--fomo-pos {
    color: var(--fomo-accent, #00c769);
}

.fomo-compare-matrix__check-ico {
    flex-shrink: 0;
    color: var(--fomo-accent, #00c769);
}

.fomo-compare-matrix__fomo-pos {
    font-weight: 500;
    color: var(--fomo-accent, #00c769);
    white-space: nowrap;
}

.fomo-compare-matrix__row--last .fomo-compare-matrix__cell--feature,
.fomo-compare-matrix__row--last .fomo-compare-matrix__cell--saas {
    border-bottom: none;
    padding-bottom: 36px;
}

.fomo-compare-matrix__row--last .fomo-compare-matrix__cell--fomo {
    border-bottom-width: 2px;
    border-bottom-style: solid;
    border-radius: 0 0 14px 14px;
    padding-bottom: 38px;
}

@media (max-width: 991px) {
    .fomo-compare-matrix__inner {
        padding: 96px clamp(24px, 6.94vw, 100px) 80px;
        gap: 56px;
    }

    .fomo-compare-matrix__table {
        min-width: 680px;
    }

    .fomo-compare-matrix__feature-label,
    .fomo-compare-matrix__saas-neg,
    .fomo-compare-matrix__fomo-pos {
        white-space: normal;
    }
}

@media (max-width: 767px) {
    .fomo-compare-matrix__inner {
        padding: 72px clamp(20px, 5vw, 32px) 64px;
        gap: 48px;
    }

    .fomo-compare-matrix__cell {
        padding: 24px 16px 26px;
        font-size: 16px;
        line-height: 26px;
    }

    .fomo-compare-matrix__cell--head {
        font-size: 15px;
        line-height: 24px;
        padding: 20px 16px 22px;
    }

    .fomo-compare-matrix__table {
        min-width: 560px;
    }

    .fomo-compare-matrix__check-ico {
        width: 20px;
        height: 20px;
    }
}

/* ================= USE CASES TRAFFIC TRAP / Z-PATTERN (Figma 1291:35556 “Section - Hidden Costs”) ================= */
.fomo-compare-traffic {
    background: #0d0d0d;
    color: #ffffff;
}

.fomo-compare-traffic__inner {
    max-width: 1440px;
    margin: 0 auto;
    padding: 144px clamp(24px, 7.5vw, 108px) 288px;
}

.fomo-compare-traffic__row {
    display: flex;
    flex-direction: row;
    align-items: center;
    gap: 72px;
    width: 100%;
}

.fomo-compare-traffic__copy {
    flex: 1 1 0;
    min-width: 0;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 26px;
}

.fomo-compare-traffic__pill-outer {
    display: inline-flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 4px;
    border-radius: 40px;
    background: rgba(41, 255, 130, 0.25);
}

.fomo-compare-traffic__pill-inner {
    border: 1px solid #00952a;
    border-radius: 24px;
    padding: 6px 16px 8px;
}

.fomo-compare-traffic__pill-text {
    font-family: 'Poppins', system-ui, -apple-system, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
    font-weight: 400;
    font-size: 16px;
    line-height: 26px;
    color: #ffffff;
    text-align: center;
    text-transform: uppercase;
}

.fomo-compare-traffic__title {
    margin: 0;
    width: 100%;
    font-family: 'Poppins', system-ui, -apple-system, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
    font-weight: 600;
    font-size: clamp(2rem, 4vw, 56px);
    line-height: 1.286;
    letter-spacing: -1.12px;
    text-transform: capitalize;
    overflow-wrap: anywhere;
    color: #ffffff;
}

.fomo-compare-traffic__lead {
    margin: 0;
    width: 100%;
    max-width: 52ch;
    font-family: 'Poppins', system-ui, -apple-system, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
    font-weight: 400;
    font-size: 20px;
    line-height: 32px;
    overflow-wrap: anywhere;
    color: rgba(255, 255, 255, 0.9);
}

.fomo-compare-traffic__figure {
    flex: 1 1 0;
    min-width: 0;
    margin: 0;
    display: block;
}

.fomo-compare-traffic__card {
    position: relative;
    padding: 0;
    border-radius: 20px;
    filter: drop-shadow(0 28px 64px rgba(0, 0, 0, 0.55));
}

.fomo-compare-traffic__card::before {
    content: '';
    position: absolute;
    inset: 28px -26px -26px 28px;
    border-radius: 20px;
    background: rgba(26, 26, 26, 0.3);
    z-index: 0;
    pointer-events: none;
}

.fomo-compare-traffic__card-shell {
    position: relative;
    z-index: 1;
    padding: 36px;
    border-radius: 20px;
    border: 1.125px solid rgba(74, 74, 74, 0.7);
    background: #1a1a1a;
    box-sizing: border-box;
}

.fomo-compare-traffic__dots {
    display: flex;
    align-items: center;
    gap: 9px;
    margin-bottom: 36px;
}

.fomo-compare-traffic__dot {
    width: 13.5px;
    height: 13.5px;
    border-radius: 999px;
    flex-shrink: 0;
}

.fomo-compare-traffic__dot--red {
    background: #ffb4ab;
}

.fomo-compare-traffic__dot--cyan {
    background: #bdf4ff;
}

.fomo-compare-traffic__dot--green {
    background: #3b4a3d;
}

.fomo-compare-traffic__alert {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 9px;
    padding: 56px 38px;
    border: 2.25px dashed rgba(255, 180, 171, 0.3);
    background: rgba(147, 0, 10, 0.05);
    box-sizing: border-box;
    text-align: center;
}

.fomo-compare-traffic__alert-icon {
    display: block;
    width: 62px;
    height: auto;
    margin-top: 2px;
}

.fomo-compare-traffic__alert-title {
    margin: 0;
    padding-top: 9px;
    font-family: 'Poppins', system-ui, -apple-system, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
    font-weight: 600;
    font-size: clamp(1.5rem, 2.8vw, 32px);
    line-height: 1.25;
    letter-spacing: -0.64px;
    color: #dee4da;
}

.fomo-compare-traffic__alert-body {
    margin: 0;
    max-width: 428px;
    width: 100%;
    padding-bottom: 18px;
    font-family: 'Poppins', system-ui, -apple-system, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
    font-weight: 400;
    font-size: 16px;
    line-height: 26px;
    color: #bacbb9;
}

.fomo-compare-traffic__alert-cta {
    width: 100%;
    padding: 13.5px 12px;
    background: #ff7767;
    font-family: 'Poppins', system-ui, -apple-system, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
    font-weight: 700;
    font-size: 13.5px;
    line-height: 18px;
    letter-spacing: 1.35px;
    text-transform: uppercase;
    text-align: center;
    color: #690005;
    user-select: none;
    pointer-events: none;
}

@media (max-width: 991px) {
    .fomo-compare-traffic__inner {
        padding: 96px clamp(24px, 6.94vw, 100px) 160px;
    }

    .fomo-compare-traffic__row {
        flex-direction: column;
        align-items: stretch;
        gap: 48px;
    }

    .fomo-compare-traffic__figure {
        max-width: 560px;
        margin: 0 auto;
        width: 100%;
    }
}

@media (max-width: 767px) {
    .fomo-compare-traffic__inner {
        padding: 72px clamp(20px, 5vw, 32px) 120px;
    }

    .fomo-compare-traffic__title {
        font-size: clamp(1.75rem, 6vw, 2.5rem);
    }

    .fomo-compare-traffic__lead {
        font-size: 17px;
        line-height: 28px;
    }

    .fomo-compare-traffic__card {
        padding: 0;
    }

    .fomo-compare-traffic__card-shell {
        padding: 24px 20px;
    }

    .fomo-compare-traffic__alert {
        padding: 40px 20px;
    }
}

/* ================= USE CASES VALUES (Figma 1291:35585 “values”) ================= */
.fomo-compare-values {
    background: #0d0d0d;
    color: #ffffff;
}

.fomo-compare-values__inner {
    max-width: 1440px;
    margin: 0 auto;
    padding: 120px clamp(24px, 6.94vw, 100px);
}

.fomo-compare-values__row {
    display: flex;
    flex-direction: row;
    align-items: stretch;
    gap: 32px;
    width: 100%;
    max-width: 1240px;
    margin: 0 auto;
}

.fomo-compare-values__card {
    flex: 1 1 0;
    min-width: 0;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    justify-content: center;
    gap: 32px;
    min-height: 332px;
    padding: 40px 32px 40px 40px;
    border-radius: 40px;
    border: 1px solid rgba(74, 74, 74, 0.7);
    background: #1a1a1a;
    box-sizing: border-box;
    overflow: hidden;
}

.fomo-compare-values__card--wide-gap {
    gap: 42px;
}

.fomo-compare-values__icon-bad {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    flex-shrink: 0;
    padding: 16px;
    border-radius: 10px;
    background: #29ff82;
}

.fomo-compare-values__icon-bad > img {
    display: block;
    width: 40px;
    height: 40px;
    object-fit: contain;
}

.fomo-compare-values__hand-stack {
    position: relative;
    display: block;
    width: 40px;
    height: 40px;
}

.fomo-compare-values__hand-img {
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
    display: block;
    height: auto;
    max-width: 100%;
}

.fomo-compare-values__hand-img--a {
    top: 8%;
    width: 72%;
}

.fomo-compare-values__hand-img--b {
    bottom: 4%;
    width: 84%;
}

.fomo-compare-values__text {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 12px;
    width: 100%;
}

.fomo-compare-values__title {
    margin: 0;
    width: 100%;
    font-family: 'Poppins', system-ui, -apple-system, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
    font-weight: 600;
    font-size: 24px;
    line-height: 32px;
    overflow-wrap: anywhere;
    color: #ffffff;
}

.fomo-compare-values__body {
    margin: 0;
    width: 100%;
    font-family: 'Poppins', system-ui, -apple-system, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
    font-weight: 400;
    font-size: 14px;
    line-height: 26px;
    overflow-wrap: anywhere;
    color: #bdbdbd;
}

@media (max-width: 991px) {
    .fomo-compare-values__inner {
        padding: 96px clamp(24px, 6.94vw, 100px);
    }

    .fomo-compare-values__row {
        flex-direction: column;
        gap: 24px;
    }

    .fomo-compare-values__card {
        flex: 0 0 auto;
        width: 100%;
        min-height: 0;
        height: auto;
        justify-content: flex-start;
        overflow: visible;
    }
}

@media (max-width: 767px) {
    .fomo-compare-values__inner {
        padding: 72px clamp(20px, 5vw, 32px);
    }

    .fomo-compare-values__card {
        gap: 24px;
        padding: 32px 24px;
        border-radius: 28px;
    }

    .fomo-compare-values__card--wide-gap {
        gap: 24px;
    }

    .fomo-compare-values__title {
        font-size: 20px;
        line-height: 28px;
    }

    .fomo-compare-values__body {
        font-size: 15px;
        line-height: 24px;
    }
}

/* ================= USE CASES SPOTLIGHT (Figma 1291:34266 “about-us”) ================= */
.fomo-use-cases-spotlight {
    background: #0d0d0d;
    color: #ffffff;
}

.fomo-use-cases-spotlight__inner {
    max-width: 1440px;
    margin: 0 auto;
    padding: 120px clamp(24px, 6.94vw, 100px) 80px;
}

.fomo-use-cases-spotlight__row {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 64px;
}

.fomo-use-cases-spotlight__copy {
    flex: 1 1 0;
    min-width: 0;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 27px;
}

.fomo-use-cases-spotlight__eyebrow {
    margin: 0;
    font-family: 'Poppins', system-ui, -apple-system, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
    font-weight: 600;
    font-size: 16px;
    line-height: 26px;
    letter-spacing: 0;
    text-transform: uppercase;
    color: var(--fomo-hero-accent, #00c769);
}

.fomo-use-cases-spotlight__title {
    margin: 0;
    max-width: 720px;
    font-family: 'Poppins', system-ui, -apple-system, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
    font-weight: 600;
    font-size: clamp(1.625rem, 2.5vw, 36px);
    line-height: 44px;
    letter-spacing: -0.72px;
    overflow-wrap: anywhere;
    color: #ffffff;
}

.fomo-use-cases-spotlight__lead {
    margin: 0;
    max-width: 720px;
    font-family: 'Poppins', system-ui, -apple-system, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
    font-weight: 400;
    font-size: clamp(18px, 1.67vw, 24px);
    line-height: 32px;
    letter-spacing: 0;
    overflow-wrap: anywhere;
    color: rgba(255, 255, 255, 0.8);
}

.fomo-use-cases-spotlight__cta {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 12px;
    padding: 12px 24px;
    border-radius: 80px;
    background: var(--fomo-hero-accent, #00c769);
    color: #f7f7f7 !important;
    text-decoration: none !important;
    font-family: 'Poppins', system-ui, -apple-system, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
    font-weight: 600;
    font-size: 16px;
    line-height: 26px;
    white-space: nowrap;
    transition: background 0.15s ease, transform 0.15s ease, box-shadow 0.15s ease;
    box-shadow: 0 8px 24px rgba(0, 199, 105, 0.28);
}

.fomo-use-cases-spotlight__cta:hover {
    background: color-mix(in srgb, var(--fomo-hero-accent, #00c769) 92%, #000 8%);
    transform: translateY(-1px);
    color: #ffffff !important;
    box-shadow: 0 10px 28px rgba(0, 199, 105, 0.38);
}

.fomo-use-cases-spotlight__visual {
    flex: 0 0 auto;
    width: min(592px, 100%);
}

.fomo-use-cases-spotlight__frame {
    position: relative;
    width: 100%;
    aspect-ratio: 592 / 680;
    border-radius: 40px;
    border: 1px solid rgba(74, 74, 74, 0.7);
    background: #1a1a1a;
    -webkit-backdrop-filter: blur(4px);
    backdrop-filter: blur(4px);
    overflow: hidden;
    isolation: isolate;
}

.fomo-use-cases-spotlight__frame-grid {
    position: absolute;
    left: 50%;
    top: calc(50% - 7.16px);
    transform: translate(-50%, -50%);
    width: 618px;
    max-width: 120%;
    height: 958.329px;
    max-height: 150%;
    display: flex;
    align-items: center;
    justify-content: center;
    pointer-events: none;
    z-index: 0;
    opacity: 0.35;
}

.fomo-use-cases-spotlight__frame-grid-rot {
    flex: none;
    transform: rotate(90deg);
    width: 958.329px;
    height: 618px;
}

.fomo-use-cases-spotlight__frame-grid-rot img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.fomo-use-cases-spotlight__frame-glow {
    position: absolute;
    pointer-events: none;
    z-index: 1;
    opacity: 0.55;
}

.fomo-use-cases-spotlight__frame-glow img {
    display: block;
    width: 100%;
    height: auto;
}

.fomo-use-cases-spotlight__frame-glow--tl {
    width: min(800px, 135%);
    aspect-ratio: 1;
    right: calc(100% * 219 / 592);
    top: calc(-100% * 361 / 680);
}

.fomo-use-cases-spotlight__frame-glow--br {
    width: min(400px, 68%);
    aspect-ratio: 1;
    left: calc(100% * 279 / 592);
    top: calc(100% * 409 / 680);
}

.fomo-use-cases-spotlight__frame-shot-wrap {
    position: absolute;
    left: 50%;
    top: 17px;
    z-index: 2;
    width: calc(100% * 522 / 592);
    height: calc(100% * 975 / 680);
    max-height: calc(100% - 12px);
    transform: translateX(-50%);
    overflow: hidden;
    pointer-events: none;
}

.fomo-use-cases-spotlight__frame-shot {
    position: absolute;
    width: 173.37%;
    height: 105.03%;
    left: -37.74%;
    top: -2.26%;
    max-width: none;
    object-fit: cover;
    object-position: center top;
}

@media (max-width: 1199px) {
    .fomo-use-cases-spotlight__title {
        line-height: 1.22;
    }

    .fomo-use-cases-spotlight__lead {
        max-width: none;
    }
}

@media (max-width: 991px) {
    .fomo-use-cases-spotlight__inner {
        padding: 96px clamp(24px, 6.94vw, 100px) 64px;
    }

    .fomo-use-cases-spotlight__row {
        flex-direction: column;
        gap: 48px;
    }

    .fomo-use-cases-spotlight__visual {
        width: 100%;
        max-width: 592px;
        margin: 0 auto;
    }

    .fomo-use-cases-spotlight__copy {
        max-width: 640px;
        margin: 0 auto;
        align-items: center;
        text-align: center;
    }

    .fomo-use-cases-spotlight__cta {
        align-self: center;
    }

    .fomo-use-cases-spotlight__title {
        max-width: none;
    }
}

@media (max-width: 767px) {
    .fomo-use-cases-spotlight__inner {
        padding: 72px clamp(20px, 5vw, 32px) 56px;
    }

    .fomo-use-cases-spotlight__copy {
        align-items: stretch;
        text-align: left;
    }

    .fomo-use-cases-spotlight__cta {
        align-self: flex-start;
        width: auto;
        max-width: none;
    }

    .fomo-use-cases-spotlight__frame {
        border-radius: 28px;
    }
}

/* ================= USE CASES SUCCESS GRID (Figma 1291:34280 “Section 3: Success Grid”) ================= */
.fomo-use-cases-success {
    background: #0d0d0d;
    color: #ffffff;
}

.fomo-use-cases-success__inner {
    max-width: 1440px;
    margin: 0 auto;
    padding: 144px clamp(24px, 2.5vw, 36px) 144px;
    display: flex;
    flex-direction: column;
    align-items: stretch;
    gap: 72px;
}

.fomo-use-cases-success__head {
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
    gap: 24px;
    width: 100%;
    max-width: 1240px;
    margin: 0 auto;
}

.fomo-use-cases-success__pill-outer {
    display: inline-flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 4px;
    border-radius: 40px;
    background: rgba(41, 255, 130, 0.25);
}

.fomo-use-cases-success__pill-inner {
    border: 1px solid #00952a;
    border-radius: 24px;
    padding: 6px 16px 8px;
}

.fomo-use-cases-success__pill-text {
    font-family: 'Poppins', system-ui, -apple-system, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
    font-weight: 400;
    font-size: 16px;
    line-height: 26px;
    color: #ffffff;
    text-align: center;
}

.fomo-use-cases-success__title {
    margin: 0;
    max-width: 630px;
    width: 100%;
    font-family: 'Poppins', system-ui, -apple-system, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
    font-weight: 500;
    font-size: clamp(2rem, 4vw, 56px);
    line-height: 1.286;
    letter-spacing: -2.24px;
    text-transform: capitalize;
    text-align: center;
    text-wrap: balance;
    overflow-wrap: anywhere;
    background: linear-gradient(180deg, #ffffff 25.5%, #999999 118.5%);
    -webkit-background-clip: text;
    background-clip: text;
    color: transparent;
    filter: drop-shadow(0 4px 4px rgba(0, 0, 0, 0.25));
}

.fomo-use-cases-success__grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 666px));
    gap: 36px;
    justify-content: center;
    width: 100%;
    max-width: 1368px;
    margin: 0 auto;
}

.fomo-use-cases-success__card {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 18px;
    min-height: 297px;
    padding: 36px;
    border-radius: 18px;
    border: 1.125px solid rgba(74, 74, 74, 0.7);
    background: #1a1a1a;
    box-sizing: border-box;
}

.fomo-use-cases-success__tag {
    margin: 0;
    width: 100%;
    font-family: 'Inter', 'Poppins', system-ui, -apple-system, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
    font-weight: 600;
    font-size: 13.5px;
    line-height: 18px;
    letter-spacing: 1.35px;
    text-transform: uppercase;
    color: #22c55e;
}

.fomo-use-cases-success__card-title {
    margin: 0;
    width: 100%;
    font-family: 'Poppins', system-ui, -apple-system, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
    font-weight: 600;
    font-size: 24px;
    line-height: 32px;
    overflow-wrap: anywhere;
    color: #ffffff;
}

.fomo-use-cases-success__card-body {
    margin: 0;
    width: 100%;
    flex: 1 1 auto;
    font-family: 'Inter', 'Poppins', system-ui, -apple-system, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
    font-weight: 400;
    font-size: 18px;
    line-height: 27px;
    overflow-wrap: anywhere;
    color: rgba(255, 255, 255, 0.8);
}

.fomo-use-cases-success__card-footer {
    display: flex;
    align-items: center;
    padding-top: 17.438px;
    width: 100%;
}

.fomo-use-cases-success__card-cta {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 12px;
    padding: 12px 24px;
    border-radius: 80px;
    background: var(--fomo-hero-accent, #00c769);
    color: #f7f7f7 !important;
    text-decoration: none !important;
    font-family: 'Poppins', system-ui, -apple-system, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
    font-weight: 600;
    font-size: 16px;
    line-height: 26px;
    white-space: nowrap;
    transition: background 0.15s ease, transform 0.15s ease, box-shadow 0.15s ease;
    box-shadow: 0 8px 24px rgba(0, 199, 105, 0.28);
}

.fomo-use-cases-success__card-cta:hover {
    background: color-mix(in srgb, var(--fomo-hero-accent, #00c769) 92%, #000 8%);
    transform: translateY(-1px);
    color: #ffffff !important;
    box-shadow: 0 10px 28px rgba(0, 199, 105, 0.38);
}

.fomo-use-cases-success__card-cta img {
    flex-shrink: 0;
    display: block;
    width: 24px;
    height: 24px;
}

@media (max-width: 1420px) {
    .fomo-use-cases-success__grid {
        grid-template-columns: 1fr;
        max-width: 666px;
    }
}

@media (max-width: 991px) {
    .fomo-use-cases-success__inner {
        padding-top: 112px;
        padding-bottom: 112px;
        gap: 56px;
    }
}

@media (max-width: 767px) {
    .fomo-use-cases-success__inner {
        padding: 96px clamp(20px, 5vw, 32px) 88px;
        gap: 48px;
    }

    .fomo-use-cases-success__title {
        font-size: clamp(1.75rem, 6vw, 2.25rem);
        letter-spacing: -0.04em;
    }

    .fomo-use-cases-success__card {
        min-height: 0;
        padding: 28px 24px;
    }

    .fomo-use-cases-success__card-cta {
        width: 100%;
        max-width: 360px;
    }
}

/* ================= USE CASES FAQ (Figma 1451:34145) ================= */
.fomo-use-cases-faq {
    background: #0d0d0d;
    color: #ffffff;
}

.fomo-use-cases-faq__inner {
    max-width: 1440px;
    margin: 0 auto;
    padding: 120px clamp(24px, 6.94vw, 100px) 120px;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 64px;
}

.fomo-use-cases-faq__head {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 16px;
    text-align: center;
    width: 100%;
}

.fomo-use-cases-faq__pill-outer {
    display: inline-flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 4px;
    border-radius: 40px;
    background: rgba(41, 255, 130, 0.25);
}

.fomo-use-cases-faq__pill-inner {
    border: 1px solid #29ff82;
    border-radius: 24px;
    padding: 6px 16px 8px;
}

.fomo-use-cases-faq__pill-text {
    font-family: 'Poppins', system-ui, -apple-system, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
    font-weight: 400;
    font-size: 16px;
    line-height: 26px;
    color: #ffffff;
    white-space: nowrap;
}

.fomo-use-cases-faq__title {
    margin: 0;
    max-width: 920px;
    width: 100%;
    font-family: 'Poppins', system-ui, -apple-system, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
    font-weight: 500;
    font-size: clamp(2rem, 4vw, 56px);
    line-height: 1.286;
    letter-spacing: -2.24px;
    text-transform: capitalize;
    text-align: center;
    text-wrap: balance;
    overflow-wrap: anywhere;
    background: linear-gradient(180deg, #ffffff 25.5%, #999999 118.5%);
    -webkit-background-clip: text;
    background-clip: text;
    color: transparent;
    filter: drop-shadow(0 4px 4px rgba(0, 0, 0, 0.25));
}

.fomo-use-cases-faq__rows {
    display: flex;
    flex-direction: column;
    gap: 40px;
    width: 100%;
    max-width: 1240px;
}

.fomo-use-cases-faq__row {
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    gap: 40px;
    width: 100%;
    align-items: stretch;
}

.fomo-use-cases-faq__card {
    flex: 1 1 0;
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: 24px;
    align-items: flex-start;
    justify-content: center;
    min-height: 204px;
    padding: 32px;
    border-radius: 20px;
    border: 1px solid rgba(74, 74, 74, 0.7);
    background: #1a1a1a;
    box-sizing: border-box;
}

.fomo-use-cases-faq__question {
    margin: 0;
    max-width: 100%;
    font-family: 'Poppins', system-ui, -apple-system, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
    font-weight: 500;
    font-size: 24px;
    line-height: 32px;
    overflow-wrap: anywhere;
    color: #fcfcfc;
}

.fomo-use-cases-faq__answer {
    margin: 0;
    width: 100%;
    font-family: 'Poppins', system-ui, -apple-system, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
    font-weight: 400;
    font-size: 16px;
    line-height: 26px;
    overflow-wrap: anywhere;
    color: #bdbdbd;
}

@media (max-width: 991px) {
    .fomo-use-cases-faq__inner {
        padding-top: 96px;
        padding-bottom: 96px;
        gap: 48px;
    }

    .fomo-use-cases-faq__title {
        letter-spacing: -0.04em;
    }

    .fomo-use-cases-faq__row {
        flex-direction: column;
    }

    .fomo-use-cases-faq__card {
        flex: 1 1 100%;
        min-height: 0;
    }
}

@media (max-width: 767px) {
    .fomo-use-cases-faq__inner {
        padding: 88px clamp(20px, 5vw, 32px) 88px;
        gap: 40px;
    }

    .fomo-use-cases-faq__pill-text {
        white-space: normal;
        text-align: center;
    }

    .fomo-use-cases-faq__rows {
        gap: 24px;
    }

    .fomo-use-cases-faq__row {
        gap: 24px;
    }

    .fomo-use-cases-faq__card {
        padding: 24px 20px;
    }

    .fomo-use-cases-faq__question {
        font-size: clamp(1.125rem, 4vw, 1.375rem);
        line-height: 1.35;
    }
}

/* E-commerce row */
.fomo-integration-ecom {
    background: #0d0d0d;
    padding: 120px clamp(24px, 6.94vw, 100px);
}

.fomo-integration-ecom__shell {
    max-width: 1440px;
    margin: 0 auto;
}

.fomo-integration-ecom__heading--vh {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    white-space: nowrap;
    border: 0;
}

.fomo-integration-ecom__row {
    display: flex;
    flex-wrap: wrap;
    gap: 32px;
    max-width: 1240px;
    margin: 0 auto;
}

.fomo-integration-ecom__card {
    flex: 1 1 calc(25% - 24px);
    min-width: min(100%, 260px);
    box-sizing: border-box;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 40px;
    min-height: 332px;
    padding: 40px 32px 40px 40px;
    border-radius: 40px;
    border: 1px solid rgba(74, 74, 74, 0.7);
    background: #1a1a1a;
}

.fomo-integration-ecom__icon-pill {
    flex-shrink: 0;
}

.fomo-integration-ecom__icon-box {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 72px;
    height: 72px;
    border-radius: 10px;
    background: #29ff82;
    color: #1c274c;
}

.fomo-integration-ecom__icon-fa {
    font-size: 22px;
    line-height: 1;
}

.fomo-integration-ecom__text {
    display: flex;
    flex-direction: column;
    gap: 12px;
    width: 100%;
}

.fomo-integration-ecom__card-title {
    margin: 0;
    font-family: 'Poppins', system-ui, -apple-system, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
    font-weight: 600;
    font-size: 24px;
    line-height: 32px;
    color: #ffffff;
}

.fomo-integration-ecom__card-body {
    margin: 0;
    font-family: 'Poppins', system-ui, -apple-system, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
    font-weight: 400;
    font-size: 16px;
    line-height: 26px;
    color: #bdbdbd;
}

@media (max-width: 1199px) {
    .fomo-integration-ecom__card {
        flex: 1 1 calc(50% - 16px);
    }
}

@media (max-width: 639px) {
    .fomo-integration-ecom {
        padding: 72px 24px;
    }

    .fomo-integration-ecom__card {
        flex: 1 1 100%;
        min-height: 0;
    }
}

/* CRM & marketing */
.fomo-integration-crm {
    background: #0d0d0d;
    padding: 108px clamp(24px, 6.94vw, 100px) 120px;
}

.fomo-integration-crm__shell {
    max-width: 1440px;
    margin: 0 auto;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 72px;
}

.fomo-integration-crm__head {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 32px;
    text-align: center;
    max-width: 1240px;
    width: 100%;
}

.fomo-integration-crm__label {
    padding: 4px;
    border-radius: 40px;
    background: rgba(41, 255, 130, 0.25);
}

.fomo-integration-crm__label-inner {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 6px 16px 8px;
    border-radius: 24px;
    border: 1px solid #00952a;
    font-family: 'Poppins', system-ui, -apple-system, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
    font-weight: 400;
    font-size: 16px;
    line-height: 26px;
    color: #ffffff;
}

.fomo-integration-crm__title {
    margin: 0;
    font-family: 'Poppins', system-ui, -apple-system, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
    font-weight: 600;
    font-size: clamp(2rem, 4.2vw, 56px);
    line-height: 72px;
    letter-spacing: -1.12px;
    overflow-wrap: anywhere;
    color: #ffffff;
}

.fomo-integration-crm__subtitle {
    margin: 0;
    max-width: 826px;
    font-family: 'Poppins', system-ui, -apple-system, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
    font-weight: 400;
    font-size: 24px;
    line-height: 32px;
    overflow-wrap: anywhere;
    color: rgba(255, 255, 255, 0.8);
}

.fomo-integration-crm__grid {
    display: flex;
    flex-wrap: wrap;
    gap: 20px;
    width: 100%;
    max-width: 1240px;
}

.fomo-integration-crm__card {
    flex: 1 1 calc(25% - 15px);
    min-width: min(100%, 220px);
    box-sizing: border-box;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 16.762px;
    padding: 37px;
    border-radius: 36px;
    border: 1.125px solid rgba(0, 0, 0, 0.2);
    background: #1a1a1a;
}

.fomo-integration-crm__icon-pill {
    flex-shrink: 0;
}

.fomo-integration-crm__icon-box {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 72px;
    height: 72px;
    border-radius: 10px;
    background: #29ff82;
    color: #1c274c;
}

.fomo-integration-crm__icon-fa {
    font-size: 22px;
    line-height: 1;
}

.fomo-integration-crm__card-title {
    margin: 0;
    padding-top: 10.238px;
    font-family: 'Poppins', system-ui, -apple-system, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
    font-weight: 600;
    font-size: 24px;
    line-height: 32px;
    overflow-wrap: anywhere;
    color: #f0fff4;
}

.fomo-integration-crm__card-body {
    margin: 0;
    font-family: 'Poppins', system-ui, -apple-system, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
    font-weight: 400;
    font-size: 16px;
    line-height: 26px;
    overflow-wrap: anywhere;
    color: #bdbdbd;
}

@media (max-width: 1199px) {
    .fomo-integration-crm__card {
        flex: 1 1 calc(50% - 10px);
    }
}

@media (max-width: 639px) {
    .fomo-integration-crm {
        padding: 72px 24px 80px;
    }

    .fomo-integration-crm__shell {
        gap: 48px;
    }

    .fomo-integration-crm__title {
        line-height: 1.2;
    }

    .fomo-integration-crm__subtitle {
        font-size: 18px;
        line-height: 28px;
    }

    .fomo-integration-crm__card {
        flex: 1 1 100%;
    }
}

/* Webhooks + terminal */
.fomo-integration-webhooks {
    background: #0d0d0d;
    padding: 144px clamp(24px, 6.94vw, 100px) 120px;
}

.fomo-integration-webhooks__shell {
    max-width: 1440px;
    margin: 0 auto;
}

.fomo-integration-webhooks__grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 72px;
    align-items: center;
    max-width: 1240px;
    margin: 0 auto;
}

.fomo-integration-webhooks__col--copy {
    display: flex;
    flex-direction: column;
    gap: 27px;
    align-items: flex-start;
}

.fomo-integration-webhooks__label {
    padding: 4px;
    border-radius: 40px;
    background: rgba(41, 255, 130, 0.25);
}

.fomo-integration-webhooks__label-inner {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 6px 16px 8px;
    border-radius: 24px;
    border: 1px solid #00952a;
    font-family: 'Poppins', system-ui, -apple-system, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
    font-weight: 400;
    font-size: 16px;
    line-height: 26px;
    color: #ffffff;
}

.fomo-integration-webhooks__title {
    margin: 0;
    font-family: 'Poppins', system-ui, -apple-system, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
    font-weight: 700;
    font-size: clamp(2rem, 4.2vw, 56px);
    line-height: 72px;
    letter-spacing: -1.12px;
    overflow-wrap: anywhere;
}

.fomo-integration-webhooks__title-white {
    color: #ffffff;
}

.fomo-integration-webhooks__title-accent {
    color: #b0e1ca;
}

.fomo-integration-webhooks__body {
    margin: 0;
    padding-top: 9px;
    font-family: 'Poppins', system-ui, -apple-system, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
    font-weight: 400;
    font-size: 20px;
    line-height: 32px;
    overflow-wrap: anywhere;
    color: rgba(255, 255, 255, 0.8);
}

.fomo-integration-webhooks__cta-wrap {
    padding-top: 9px;
}

.fomo-integration-webhooks__cta {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 12px;
    padding: 12px 24px;
    border-radius: 80px;
    background: var(--fomo-hero-accent, #00c769);
    color: #f7f7f7 !important;
    text-decoration: none !important;
    font-family: 'Poppins', system-ui, -apple-system, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
    font-weight: 600;
    font-size: 16px;
    line-height: 26px;
    white-space: nowrap;
    transition: background 0.15s ease, transform 0.15s ease;
}

.fomo-integration-webhooks__cta:hover {
    background: color-mix(in srgb, var(--fomo-hero-accent, #00c769) 90%, #000 10%);
    color: #ffffff !important;
}

.fomo-integration-webhooks__cta-icon {
    font-size: 14px;
}

.fomo-integration-terminal {
    position: relative;
    border-radius: 18px;
    border: 1.125px solid rgba(74, 74, 74, 0.7);
    background: #1a1a1a;
    box-shadow: 0 28.125px 56.25px -13.5px rgba(0, 0, 0, 0.25);
    padding: 37px;
    box-sizing: border-box;
}

.fomo-integration-terminal__chrome {
    display: flex;
    align-items: center;
    gap: 0;
    margin-bottom: 27px;
}

.fomo-integration-terminal__dot {
    width: 13.5px;
    height: 13.5px;
    border-radius: 999px;
    flex-shrink: 0;
}

.fomo-integration-terminal__dot--r {
    background: #ff5f56;
}

.fomo-integration-terminal__dot--y {
    margin-left: 9px;
    background: #ffbd2e;
}

.fomo-integration-terminal__dot--g {
    margin-left: 9px;
    background: #27c93f;
}

.fomo-integration-terminal__code {
    margin: 0;
    font-family: 'Liberation Mono', 'Roboto Mono', ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace;
    font-size: 15.75px;
    line-height: 25.594px;
    color: #ffffff;
    white-space: pre-wrap;
    word-break: break-word;
}

.fomo-integration-terminal__line {
    display: block;
}

.fomo-integration-terminal__line--indent1 {
    padding-left: 18px;
}

.fomo-integration-terminal__line--indent2 {
    padding-left: 36px;
    color: #e5e5e5;
    text-shadow: 0 0 11.25px rgba(0, 229, 255, 0.5);
}

@media (max-width: 991px) {
    .fomo-integration-webhooks__grid {
        grid-template-columns: 1fr;
        gap: 48px;
    }

    .fomo-integration-webhooks {
        padding: 96px 24px 80px;
    }

    .fomo-integration-webhooks__cta {
        white-space: normal;
        text-align: center;
    }
}

/* Dual-column story (Figma roadmap frame) */
.fomo-integration-story {
    background: #0d0d0d;
    padding: 120px clamp(24px, 6.94vw, 100px);
}

.fomo-integration-story__heading--vh {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    white-space: nowrap;
    border: 0;
}

.fomo-integration-story__shell {
    position: relative;
    max-width: 1440px;
    margin: 0 auto;
}

.fomo-integration-story__card {
    display: flex;
    flex-wrap: wrap;
    gap: 36px;
    align-items: flex-start;
    width: 100%;
    max-width: 1240px;
    margin: 0 auto;
    padding: 81px 89px;
    border-radius: 20px;
    border: 1.083px solid rgba(74, 74, 74, 0.7);
    background: #1a1a1a;
    box-sizing: border-box;
}

.fomo-integration-story__col {
    flex: 1 1 calc(50% - 18px);
    min-width: min(100%, 280px);
    display: flex;
    flex-direction: column;
    gap: 34.652px;
}

.fomo-integration-story__title {
    margin: 0;
    font-family: 'Poppins', system-ui, -apple-system, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
    font-weight: 700;
    font-size: 36px;
    line-height: 44px;
    letter-spacing: -0.72px;
    overflow-wrap: anywhere;
    color: #ffffff;
}

.fomo-integration-story__body {
    display: flex;
    flex-direction: column;
    gap: 25.989px;
}

.fomo-integration-story__text {
    margin: 0;
    font-family: 'Poppins', system-ui, -apple-system, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
    font-weight: 400;
    font-size: 16px;
    line-height: 26px;
    overflow-wrap: anywhere;
    color: #ffffff;
}

@media (max-width: 767px) {
    .fomo-integration-story {
        padding: 72px 24px;
    }

    .fomo-integration-story__card {
        padding: 40px 28px;
        gap: 48px;
    }

    .fomo-integration-story__col {
        flex: 1 1 100%;
        gap: 28px;
    }

    .fomo-integration-story__title {
        font-size: clamp(1.625rem, 5vw, 36px);
        line-height: 1.22;
    }

    .fomo-integration-story__text {
        font-size: 15px;
        line-height: 24px;
    }
}

/* FAQ grid */
.fomo-integration-faq {
    background: #0d0d0d;
    padding: 120px clamp(24px, 6.94vw, 100px);
}

.fomo-integration-faq__shell {
    max-width: 1440px;
    margin: 0 auto;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 64px;
}

.fomo-integration-faq__head {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 16px;
    text-align: center;
    max-width: 1240px;
    width: 100%;
}

.fomo-integration-faq__label {
    padding: 4px;
    border-radius: 40px;
    background: rgba(41, 255, 130, 0.25);
}

.fomo-integration-faq__label-inner {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 6px 16px 8px;
    border-radius: 24px;
    border: 1px solid #29ff82;
    font-family: 'Poppins', system-ui, -apple-system, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
    font-weight: 400;
    font-size: 16px;
    line-height: 26px;
    color: #ffffff;
}

.fomo-integration-faq__title {
    margin: 0;
    max-width: 920px;
    font-family: 'Poppins', system-ui, -apple-system, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
    font-weight: 500;
    font-size: clamp(2rem, 4.6vw, 56px);
    line-height: 72px;
    letter-spacing: -2.24px;
    text-transform: capitalize;
    overflow-wrap: anywhere;
    background: linear-gradient(180deg, #ffffff 25.5%, #999999 118.5%);
    -webkit-background-clip: text;
    background-clip: text;
    color: transparent;
}

.fomo-integration-faq__rows {
    display: flex;
    flex-direction: column;
    gap: 40px;
    width: 100%;
    max-width: 1240px;
}

.fomo-integration-faq__row {
    display: flex;
    flex-wrap: wrap;
    gap: 40px;
}

.fomo-integration-faq__card {
    flex: 1 1 calc(50% - 20px);
    min-width: min(100%, 280px);
    box-sizing: border-box;
    min-height: 204px;
    padding: 32px;
    border-radius: 20px;
    border: 1px solid rgba(74, 74, 74, 0.7);
    background: #1a1a1a;
    display: flex;
    flex-direction: column;
    gap: 24px;
    justify-content: center;
}

.fomo-integration-faq__q {
    margin: 0;
    font-family: 'Poppins', system-ui, -apple-system, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
    font-weight: 500;
    font-size: 24px;
    line-height: 32px;
    overflow-wrap: anywhere;
    color: #fcfcfc;
}

.fomo-integration-faq__a {
    margin: 0;
    font-family: 'Poppins', system-ui, -apple-system, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
    font-weight: 400;
    font-size: 16px;
    line-height: 26px;
    overflow-wrap: anywhere;
    color: #bdbdbd;
}

@media (max-width: 767px) {
    .fomo-integration-faq {
        padding: 72px 24px;
    }

    .fomo-integration-faq__shell {
        gap: 40px;
    }

    .fomo-integration-faq__title {
        line-height: 1.2;
    }

    .fomo-integration-faq__card {
        flex: 1 1 100%;
        min-height: 0;
    }
}

/* ================= CONTACT PAGE (Figma 1291:40315–40418) ================= */
.fomo-contact-hero__content.fomo-about-hero__content {
    flex: 1;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    text-align: center;
    padding: 40px 0 80px;
    gap: 24px;
    max-width: 720px;
    margin: 0 auto;
    width: 100%;
}

/* Hero title — Figma 1291:40333 (80 / 88, Poppins Medium, -3.2px, gradient + shadow) */
.fomo-contact-hero__title {
    margin: 0;
    max-width: 658px;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 0;
    font-family: 'Poppins', system-ui, -apple-system, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
    font-weight: 500;
    font-style: normal;
    text-align: center;
    filter: drop-shadow(0 4px 4px rgba(0, 0, 0, 0.4));
    overflow-wrap: anywhere;
}

.fomo-contact-hero__title-line {
    display: block;
    width: 100%;
    font-size: clamp(2.25rem, 6vw, 80px);
    line-height: calc(88 / 80);
    letter-spacing: -0.04em;
}

.fomo-contact-hero__title-line--lead {
    color: #ffffff;
}

.fomo-contact-hero__title-line--brand {
    text-transform: uppercase;
    background: linear-gradient(180deg, #ffffff 25.5%, #999999 118.5%);
    -webkit-background-clip: text;
    background-clip: text;
    color: transparent;
}

.fomo-contact-hero__subtitle {
    margin: 0;
    max-width: 720px;
    font-family: 'Poppins', system-ui, -apple-system, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
    font-weight: 400;
    font-size: 16px;
    line-height: 26px;
    color: #bdbdbd;
    text-shadow: 0 4px 4px rgba(0, 0, 0, 0.4);
    overflow-wrap: anywhere;
}

.fomo-contact-paths {
    background: #0d0d0d;
    padding: 120px clamp(24px, 6.94vw, 100px);
}

.fomo-contact-paths__shell {
    max-width: 1240px;
    margin: 0 auto;
    display: flex;
    flex-direction: column;
    gap: 64px;
}

.fomo-contact-paths__head {
    text-align: center;
}

.fomo-contact-paths__title {
    margin: 0;
    display: inline-block;
    font-family: 'Poppins', system-ui, -apple-system, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
    font-weight: 500;
    font-size: clamp(2rem, 4.6vw, 56px);
    line-height: 72px;
    letter-spacing: -0.04em;
    text-transform: capitalize;
    overflow-wrap: anywhere;
    background: linear-gradient(180deg, #ffffff 25.5%, #999999 118.5%);
    -webkit-background-clip: text;
    background-clip: text;
    color: transparent;
}

.fomo-contact-paths__row {
    display: flex;
    flex-wrap: wrap;
    gap: 32px;
    justify-content: center;
}

.fomo-contact-paths__card {
    flex: 1 1 300px;
    max-width: 392px;
    box-sizing: border-box;
    padding: 40px 32px 40px 40px;
    border-radius: 40px;
    border: 1px solid rgba(74, 74, 74, 0.7);
    background: #1a1a1a;
    display: flex;
    flex-direction: column;
    gap: 32px;
}

.fomo-contact-paths__icon-wrap {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    align-self: flex-start;
    padding: 16px;
    border-radius: 10px;
    background: #29ff82;
}

.fomo-contact-paths__icon {
    display: block;
    width: 40px;
    height: 40px;
}

.fomo-contact-paths__text {
    display: flex;
    flex-direction: column;
    gap: 12px;
}

.fomo-contact-paths__card-title {
    margin: 0;
    font-family: 'Poppins', system-ui, -apple-system, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
    font-weight: 600;
    font-size: 24px;
    line-height: 32px;
    color: #ffffff;
    overflow-wrap: anywhere;
}

.fomo-contact-paths__card-body {
    margin: 0;
    font-family: 'Poppins', system-ui, -apple-system, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
    font-weight: 400;
    font-size: 16px;
    line-height: 26px;
    overflow-wrap: anywhere;
    color: #bdbdbd;
}

.fomo-contact-connect {
    background: #0d0d0d;
    padding: 120px clamp(24px, 6.94vw, 100px) 120px;
}

.fomo-contact-connect__shell {
    max-width: 1240px;
    margin: 0 auto;
    display: flex;
    flex-direction: column;
    gap: 24px;
}

.fomo-contact-connect__label {
    padding: 4px;
    border-radius: 40px;
    background: rgba(41, 255, 130, 0.25);
    align-self: flex-start;
}

.fomo-contact-connect__label-inner {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 6px 16px 8px;
    border-radius: 24px;
    border: 1px solid #29ff82;
    font-family: 'Poppins', system-ui, -apple-system, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
    font-weight: 400;
    font-size: 16px;
    line-height: 26px;
    color: #ffffff;
}

.fomo-contact-connect__grid {
    display: flex;
    flex-wrap: wrap;
    gap: 64px;
    align-items: flex-start;
    justify-content: center;
}

.fomo-contact-connect__intro {
    flex: 1 1 320px;
    max-width: 620px;
    display: flex;
    flex-direction: column;
    gap: 40px;
}

.fomo-contact-connect__intro-text {
    display: flex;
    flex-direction: column;
    gap: 24px;
}

.fomo-contact-connect__heading {
    margin: 0;
    font-family: 'Poppins', system-ui, -apple-system, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
    font-weight: 600;
    font-size: clamp(2rem, 4.6vw, 56px);
    line-height: 72px;
    letter-spacing: -0.02em;
    overflow-wrap: anywhere;
    background: linear-gradient(180deg, #ffffff 25.5%, #999999 118.5%);
    -webkit-background-clip: text;
    background-clip: text;
    color: transparent;
}

.fomo-contact-connect__p {
    margin: 0;
    font-family: 'Poppins', system-ui, -apple-system, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
    font-weight: 400;
    font-size: 16px;
    line-height: 26px;
    overflow-wrap: anywhere;
    color: #bdbdbd;
}

.fomo-contact-connect__stats {
    display: flex;
    align-items: center;
    justify-content: space-between;
    flex-wrap: wrap;
    gap: 16px;
    padding: 25px;
    border-radius: 16px;
    border: 1px solid #162416;
    background: #080f08;
}

.fomo-contact-connect__stat {
    display: flex;
    align-items: center;
    gap: 12px;
}

.fomo-contact-connect__stat-dot {
    width: 8px;
    height: 8px;
    border-radius: 9999px;
    background: #00ff7f;
    flex-shrink: 0;
}

.fomo-contact-connect__stat-text {
    font-family: 'Poppins', system-ui, -apple-system, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
    font-weight: 600;
    font-size: 16px;
    line-height: 26px;
    overflow-wrap: anywhere;
    color: #00ff7f;
}

.fomo-contact-connect__form-card {
    flex: 1 1 360px;
    max-width: 620px;
    box-sizing: border-box;
    padding: 32px 28px;
    border-radius: 20px;
    border: 0.5px solid rgba(74, 74, 74, 0.7);
    background: #1a1a1a;
    display: flex;
    flex-direction: column;
    gap: 24px;
}

.fomo-contact-connect__form-lead {
    margin: 0;
    font-family: 'Poppins', system-ui, -apple-system, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
    font-weight: 400;
    font-size: 20px;
    line-height: 32px;
    overflow-wrap: anywhere;
    color: #fcfcfc;
}

.fomo-contact-form-disabled {
    margin: 0;
    font-family: 'Poppins', system-ui, -apple-system, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
    font-weight: 400;
    font-size: 16px;
    line-height: 26px;
    overflow-wrap: anywhere;
    color: #bdbdbd;
}

.fomo-contact-connect__form-card--disabled {
    gap: 16px;
}

.fomo-contact-form {
    display: flex;
    flex-direction: column;
    gap: 16px;
    width: 100%;
}

.fomo-contact-form__row {
    display: flex;
    flex-wrap: wrap;
    gap: 16px;
}

.fomo-contact-form__field {
    flex: 1 1 90px;
    display: flex;
    flex-direction: column;
    gap: 8px;
    min-width: 0;
}

.fomo-contact-form__label {
    font-family: 'Poppins', system-ui, -apple-system, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
    font-weight: 600;
    font-size: 16px;
    line-height: 26px;
    color: #eeeeee;
}

.fomo-contact-form__input,
.fomo-contact-form__textarea {
    box-sizing: border-box;
    width: 100%;
    padding: 14px 16px;
    border-radius: 6px;
    border: 0.5px solid rgba(74, 74, 74, 0.7);
    background: #000000;
    color: #f5f5f5;
    font-family: 'Poppins', system-ui, -apple-system, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
    font-weight: 500;
    font-size: 14px;
    line-height: 16px;
}

.fomo-contact-form__input::placeholder,
.fomo-contact-form__textarea::placeholder {
    color: #616161;
}

.fomo-contact-form__textarea {
    min-height: 120px;
    resize: vertical;
}

.fomo-contact-form__select-wrap {
    position: relative;
}

.fomo-contact-form__select {
    box-sizing: border-box;
    width: 100%;
    padding: 14px 42px 14px 16px;
    border-radius: 6px;
    border: 1px solid rgba(255, 255, 255, 0.45);
    background: #000000;
    color: #f5f5f5;
    font-family: 'Poppins', system-ui, -apple-system, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
    font-weight: 500;
    font-size: 14px;
    line-height: 16px;
    appearance: none;
    -webkit-appearance: none;
}

.fomo-contact-form__select:focus {
    outline: none;
    border-color: rgba(255, 255, 255, 0.85);
}

.fomo-contact-form__select option[disabled] {
    color: #616161;
}

.fomo-contact-form__select-chevron {
    position: absolute;
    right: 14px;
    top: 50%;
    transform: translateY(-50%);
    pointer-events: none;
    color: #bdbdbd;
    font-size: 14px;
}

.fomo-contact-form__submit {
    width: 100%;
    margin-top: 0;
    padding: 12px 24px;
    border: none;
    border-radius: 80px;
    background: var(--fomo-hero-accent, #00c769);
    color: #ffffff;
    font-family: 'Poppins', system-ui, -apple-system, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
    font-weight: 600;
    font-size: 16px;
    line-height: 26px;
    cursor: pointer;
    transition: background 0.15s ease, transform 0.15s ease, box-shadow 0.15s ease;
    box-shadow: 0 8px 24px rgba(0, 199, 105, 0.28);
}

.fomo-contact-form__submit:hover {
    background: color-mix(in srgb, var(--fomo-hero-accent, #00c769) 92%, #000 8%);
    transform: translateY(-1px);
}

.fomo-contact-faq.fomo-integration-faq {
    background: #0d0d0d;
}

@media (max-width: 991px) {
    .fomo-contact-hero__content.fomo-about-hero__content {
        padding: 32px 0 64px;
    }

    .fomo-contact-paths,
    .fomo-contact-connect {
        padding: 72px 24px;
    }

    .fomo-contact-paths__title {
        line-height: 1.15;
    }

    .fomo-contact-connect__heading {
        line-height: 1.15;
    }

    .fomo-contact-connect__form-card {
        gap: 20px;
    }
}

@media (max-width: 767px) {
    .fomo-contact-paths__card {
        max-width: none;
    }
}


/* ========================================================================
   PRICING PAGE – HERO WRAPPER
   ======================================================================== */

.fomo-pricing-page-hero {
    position: relative;
    background: #0a0a0a;
    color: #ffffff;
    overflow: hidden;
}

.fomo-pricing-page-hero__bg {
    position: absolute;
    inset: 0;
    z-index: 0;
    pointer-events: none;
    overflow: clip;
}

/* Radial green glow — same as homepage features section */
.fomo-pricing-page-hero__glow {
    position: absolute;
    inset: 0;
    background: radial-gradient(55% 45% at 82% 32%, rgba(38, 220, 114, 0.24) 0%, rgba(38, 220, 114, 0) 85%);
    opacity: .9;
    mix-blend-mode: screen;
}

/* Decorative vector — same SVG used on homepage features section */
.fomo-pricing-page-hero__vector {
    position: absolute;
    inset: 0;
    background-image: url('../images/fomo_boost/trusted-bg-vector.svg');
    background-repeat: no-repeat;
    background-position: 61% -73%;
    background-size: max(1440px, 120vw) auto;
    opacity: .9;
    mix-blend-mode: screen;
}

.fomo-pricing-page-hero__inner {
    position: relative;
    z-index: 1;
    width: 100%;
    max-width: 1440px;
    margin: 0 auto;
    padding: var(--fomo-nav-height) 100px 120px;
}

/* Override header spacing when inside page hero (already has nav) */
.fomo-pricing-page-hero__inner .fomo-pricing__header {
    margin-bottom: 84px;
}

.fomo-pricing-page-hero__inner .fomo-pricing__grid {
    width: 100%;
    max-width: 1240px;
    margin: 0 auto;
}

.fomo-pricing-page-hero__inner .fomo-pricing__footer {
    max-width: 1240px;
    margin-left: auto;
    margin-right: auto;
}


/* ========================================================================
   PRICING PAGE – COMPARISON TABLE
   ======================================================================== */

.fomo-pricing-table {
    background: #0a0a0a;
    color: #ffffff;
    padding: 120px 0;
    overflow: hidden;
}

.fomo-pricing-table__inner {
    width: 100%;
    max-width: 1440px;
    margin: 0 auto;
    padding: 0 100px;
}

/* Header */
.fomo-pricing-table__head {
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
    margin-bottom: 64px;
    gap: 20px;
}

.fomo-pricing-table__pill {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 6px 18px;
    border: 1px solid #29ff82;
    background: rgba(41, 255, 130, 0.15);
    border-radius: 24px;
    color: #29ff82;
    font-family: 'Poppins', system-ui, sans-serif;
    font-weight: 500;
    font-size: 14px;
    line-height: 24px;
    letter-spacing: 0.02em;
}

.fomo-pricing-table__title {
    margin: 0;
    max-width: 800px;
    font-family: 'Poppins', system-ui, sans-serif;
    font-weight: 600;
    font-size: 40px;
    line-height: 52px;
    letter-spacing: -0.8px;
    color: #ffffff;
}

.fomo-pricing-table__subtitle {
    margin: 0;
    max-width: 580px;
    font-family: 'Poppins', system-ui, sans-serif;
    font-weight: 400;
    font-size: 16px;
    line-height: 26px;
    color: #bdbdbd;
}

/* Table wrapper */
.fomo-pricing-table__wrap {
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    overscroll-behavior-x: contain;
    border-radius: 16px;
    border: 1px solid rgba(255, 255, 255, 0.08);
}

.fomo-pricing-table__table {
    width: 100%;
    min-width: 920px;
    border-collapse: collapse;
    table-layout: fixed;
}

/* Header row */
.fomo-pricing-table__head-row {
    background: #111111;
}

.fomo-pricing-table__th {
    padding: 20px 16px;
    text-align: center;
    vertical-align: middle;
    border-bottom: 1px solid rgba(255, 255, 255, 0.08);
    width: 18.5%;
}

.fomo-pricing-table__th--features {
    text-align: left;
    width: 26%;
    font-family: 'Poppins', system-ui, sans-serif;
    font-weight: 600;
    font-size: 16px;
    color: #bdbdbd;
    padding-left: 24px;
}

.fomo-pricing-table__plan-name {
    display: block;
    font-family: 'Poppins', system-ui, sans-serif;
    font-weight: 600;
    font-size: 20px;
    line-height: 28px;
    color: #ffffff;
    margin-bottom: 4px;
}

.fomo-pricing-table__plan-price {
    display: block;
    font-family: 'Poppins', system-ui, sans-serif;
    font-weight: 500;
    font-size: 24px;
    line-height: 32px;
    color: #ffffff;
    margin-bottom: 12px;
}

.fomo-pricing-table__plan-price small {
    font-size: 14px;
    font-weight: 400;
    color: #acacac;
}

.fomo-pricing-table__btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 8px 20px;
    background: transparent;
    border: 1.2px solid rgba(255, 255, 255, 0.5);
    border-radius: 10px;
    color: #ffffff;
    font-family: 'Poppins', system-ui, sans-serif;
    font-weight: 600;
    font-size: 14px;
    line-height: 20px;
    text-decoration: none;
    transition: background 0.2s ease, border-color 0.2s ease;
}

.fomo-pricing-table__btn:hover,
.fomo-pricing-table__btn:focus-visible {
    background: rgba(255, 255, 255, 0.06);
    border-color: #ffffff;
    color: #ffffff;
    text-decoration: none;
}

/* Section heading rows */
.fomo-pricing-table__section-row {
    background: rgba(34, 197, 94, 0.05);
}

.fomo-pricing-table__section-cell {
    padding: 12px 24px;
    font-family: 'Poppins', system-ui, sans-serif;
    font-weight: 600;
    font-size: 14px;
    line-height: 24px;
    letter-spacing: 0.03em;
    text-transform: uppercase;
    color: #22c55e;
    border-bottom: 1px solid rgba(255, 255, 255, 0.06);
}

/* Data rows */
.fomo-pricing-table__row {
    border-bottom: 1px solid rgba(255, 255, 255, 0.05);
    transition: background 0.15s ease;
}

.fomo-pricing-table__row:hover {
    background: rgba(255, 255, 255, 0.02);
}

.fomo-pricing-table__row-label {
    padding: 13px 24px;
    font-family: 'Poppins', system-ui, sans-serif;
    font-weight: 400;
    font-size: 14px;
    line-height: 22px;
    color: #e0e0e0;
    text-align: left;
    white-space: nowrap;
    overflow-wrap: anywhere;
}

.fomo-pricing-table__cell {
    padding: 13px 16px;
    text-align: center;
    vertical-align: middle;
}

.fomo-pricing-table__check {
    display: inline-flex;
    align-items: center;
    justify-content: center;
}

.fomo-pricing-table__dash {
    color: #4a4a4a;
    font-size: 18px;
    font-weight: 500;
    line-height: 1;
}

.fomo-pricing-table__text {
    font-family: 'Poppins', system-ui, sans-serif;
    font-weight: 400;
    font-size: 14px;
    line-height: 22px;
    color: #bdbdbd;
}

/* Visually hidden utility if not already defined */
.visually-hidden {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    white-space: nowrap;
    border: 0;
}


/* ========================================================================
   RESPONSIVE – PRICING PAGE
   ======================================================================== */

@media (max-width: 1200px) {
    .fomo-pricing-page-hero__inner {
        padding: 0 40px 100px;
    }

    .fomo-pricing-table__inner {
        padding: 0 40px;
    }
}

@media (max-width: 992px) {
    .fomo-pricing-page-hero__inner {
        padding: 0 24px 80px;
    }

    .fomo-pricing-table__inner {
        padding: 0 24px;
    }

    .fomo-pricing-table__title {
        font-size: 28px;
        line-height: 38px;
    }

    .fomo-pricing-table__row-label {
        white-space: normal;
    }
}

@media (max-width: 768px) {
    .fomo-pricing-page-hero__inner {
        padding: 0 16px 64px;
    }

    /* Inline style in `themes/altum/views/pricing/index.php` sets 120px; override for mobile. */
    .fomo-pricing-page-hero__inner .fomo-pricing__header {
        padding-top: 72px !important;
    }

    .fomo-pricing-table {
        padding: 80px 0;
    }

    .fomo-pricing-table__inner {
        padding: 0 16px;
    }

    .fomo-pricing-table__title {
        font-size: 24px;
        line-height: 32px;
    }

    .fomo-pricing-table__th {
        min-width: 140px;
        padding: 16px 12px;
    }

    .fomo-pricing-table__th--features {
        min-width: 180px;
    }

    .fomo-pricing-table__plan-name {
        font-size: 16px;
    }

    .fomo-pricing-table__plan-price {
        font-size: 20px;
    }
}

@media (max-width: 479px) {
    .fomo-pricing-page-hero__inner .fomo-pricing__header {
        padding-top: 56px !important;
    }
}

/* ================= 404 NOT FOUND (Figma: top 1654:26197, 404 type 1654:31301, card 1654:31303) ================= */
.fomo-notfound-hero.fomo-about-hero {
    min-height: 680px;
}

.fomo-notfound-hero.fomo-about-hero .fomo-about-hero__inner {
    min-height: 680px;
}

.fomo-notfound-hero__content {
    flex: 1;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    text-align: center;
    width: 100%;
    max-width: 1280px;
    margin: 0 auto;
}

.fomo-notfound-hero__code {
    margin: 0;
    font-family: 'Poppins', system-ui, -apple-system, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
    font-weight: 500;
    font-size: clamp(100px, 22vw, 400px);
    line-height: 1.2;
    text-align: center;
    background: linear-gradient(111.65deg, #ffffff 4%, #00140b 86.5%);
    -webkit-background-clip: text;
    background-clip: text;
    color: transparent;
    -webkit-text-fill-color: transparent;
    width: 100%;
    padding: 0 16px;
    user-select: none;
}

.fomo-notfound-card {
    margin-top: -80px;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 40px;
    width: 100%;
    max-width: 640px;
    padding: 40px;
    border-radius: 24px;
    border: 1px solid rgba(255, 255, 255, 0.1);
    background-color: var(--fomo-notfound-card-tint, rgba(0, 255, 135, 0.05));
    backdrop-filter: blur(24px);
    -webkit-backdrop-filter: blur(24px);
}

.fomo-notfound-card__text {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 16px;
    width: 100%;
    text-align: center;
}

.fomo-notfound-card__title {
    margin: 0;
    font-family: 'Inter', 'Poppins', system-ui, -apple-system, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
    font-weight: 500;
    font-size: clamp(24px, 4vw, 32px);
    line-height: 1.2;
    letter-spacing: -1px;
    color: #ffffff;
}

.fomo-notfound-card__subtitle {
    margin: 0;
    font-family: 'Inter', 'Poppins', system-ui, -apple-system, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
    font-weight: 400;
    font-size: 16px;
    line-height: 1.6;
    letter-spacing: -0.24px;
    color: #818089;
}

.fomo-notfound-card__btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 12px;
    padding: 12px 24px;
    border-radius: 80px;
    font-family: 'Poppins', system-ui, -apple-system, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
    font-weight: 600;
    font-size: 16px;
    line-height: 26px;
    color: #f7f7f7;
    background: var(--fomo-accent, #00c769);
    text-decoration: none;
    transition: filter 0.2s ease, transform 0.2s ease;
    white-space: nowrap;
}

.fomo-notfound-card__btn:hover {
    color: #f7f7f7;
    text-decoration: none;
    filter: brightness(1.06);
}

.fomo-notfound-card__btn:focus-visible {
    outline: 2px solid var(--fomo-accent, #00c769);
    outline-offset: 3px;
}

@media (max-width: 768px) {
    .fomo-notfound-hero.fomo-about-hero,
    .fomo-notfound-hero.fomo-about-hero .fomo-about-hero__inner {
        min-height: min(100vh, 680px);
    }

    .fomo-notfound-card {
        padding: 32px 24px;
    }

    .fomo-notfound-card__btn {
        white-space: normal;
        text-align: center;
    }
}

/* =============================================================================
   MOBILE RESPONSIVE — Figma home frame 393px (≤ 767.98px)
   ============================================================================= */

/* ----- Mobile nav toggle + drawer ----- */
.fomo-nav-toggle {
    display: none;
    flex-shrink: 0;
    width: 40px;
    height: 40px;
    padding: 0;
    border: 0;
    border-radius: 12px;
    background: rgba(255, 255, 255, 0.08);
    color: #ffffff;
    cursor: pointer;
    align-items: center;
    justify-content: center;
    transition: background 0.2s ease, transform 0.2s ease;
    z-index: 2;
}

.fomo-nav-toggle:active {
    transform: scale(0.96);
}

.fomo-nav-toggle:hover,
.fomo-nav-toggle:focus-visible {
    background: rgba(255, 255, 255, 0.12);
    outline: none;
}

.fomo-nav-toggle__icon {
    display: flex;
    flex-direction: column;
    justify-content: center;
    gap: 5px;
    width: 20px;
    height: 16px;
}

.fomo-nav-toggle__icon span {
    display: block;
    height: 2px;
    width: 100%;
    border-radius: 2px;
    background: #ffffff;
    transition: transform 0.2s ease, opacity 0.2s ease;
}

body.fomo-nav-open .fomo-nav-toggle__icon span:nth-child(1) {
    transform: translateY(7px) rotate(45deg);
}

body.fomo-nav-open .fomo-nav-toggle__icon span:nth-child(2) {
    opacity: 0;
}

body.fomo-nav-open .fomo-nav-toggle__icon span:nth-child(3) {
    transform: translateY(-7px) rotate(-45deg);
}

.fomo-nav-overlay {
    position: fixed;
    inset: 0;
    z-index: 10050;
    pointer-events: none;
    visibility: hidden;
    opacity: 0;
    transition: opacity 0.3s ease, visibility 0.3s ease;
}

.fomo-nav-overlay.is-open {
    pointer-events: auto;
    visibility: visible;
    opacity: 1;
}

.fomo-nav-overlay__backdrop {
    position: absolute;
    inset: 0;
    background: rgba(0, 0, 0, 0.75);
    opacity: 0;
    transition: opacity 0.35s cubic-bezier(0.4, 0, 0.2, 1);
}

.fomo-nav-overlay.is-open .fomo-nav-overlay__backdrop {
    opacity: 1;
}

.fomo-nav-overlay__panel {
    position: absolute;
    top: 0;
    right: 0;
    width: min(100%, 360px);
    height: 100%;
    padding: 24px 20px 32px;
    background: #0d0d0d;
    border-left: 1px solid rgba(74, 74, 74, 0.7);
    display: flex;
    flex-direction: column;
    gap: 24px;
    overflow-y: auto;
    transform: translateX(105%);
    transition: transform 0.4s cubic-bezier(0.22, 1, 0.36, 1);
    will-change: transform;
    box-shadow: -24px 0 80px rgba(0, 0, 0, 0.55);
}

.fomo-nav-overlay.is-open .fomo-nav-overlay__panel {
    transform: translateX(0);
}

.fomo-nav-overlay.is-open .fomo-nav-overlay__menu a {
    animation: fomo-nav-link-in 0.45s cubic-bezier(0.22, 1, 0.36, 1) backwards;
}

.fomo-nav-overlay.is-open .fomo-nav-overlay__menu a:nth-child(1) { animation-delay: 0.05s; }
.fomo-nav-overlay.is-open .fomo-nav-overlay__menu a:nth-child(2) { animation-delay: 0.08s; }
.fomo-nav-overlay.is-open .fomo-nav-overlay__menu a:nth-child(3) { animation-delay: 0.11s; }
.fomo-nav-overlay.is-open .fomo-nav-overlay__menu a:nth-child(4) { animation-delay: 0.14s; }
.fomo-nav-overlay.is-open .fomo-nav-overlay__menu a:nth-child(5) { animation-delay: 0.17s; }
.fomo-nav-overlay.is-open .fomo-nav-overlay__menu a:nth-child(6) { animation-delay: 0.2s; }
.fomo-nav-overlay.is-open .fomo-nav-overlay__menu a:nth-child(7) { animation-delay: 0.23s; }
.fomo-nav-overlay.is-open .fomo-nav-overlay__menu a:nth-child(8) { animation-delay: 0.26s; }
.fomo-nav-overlay.is-open .fomo-nav-overlay__menu a:nth-child(9) { animation-delay: 0.29s; }
.fomo-nav-overlay.is-open .fomo-nav-overlay__menu a:nth-child(10) { animation-delay: 0.32s; }
.fomo-nav-overlay.is-open .fomo-nav-overlay__menu a:nth-child(11) { animation-delay: 0.35s; }

.fomo-nav-overlay.is-open .fomo-nav-overlay__cta {
    animation: fomo-nav-link-in 0.45s cubic-bezier(0.22, 1, 0.36, 1) 0.38s backwards;
}

@keyframes fomo-nav-link-in {
    from {
        opacity: 0;
        transform: translateX(16px);
    }
    to {
        opacity: 1;
        transform: translateX(0);
    }
}

.fomo-nav-overlay__close {
    align-self: flex-end;
    width: 40px;
    height: 40px;
    padding: 0;
    border: 0;
    border-radius: 10px;
    background: rgba(255, 255, 255, 0.06);
    color: #ffffff;
    font-size: 18px;
    cursor: pointer;
}

.fomo-nav-overlay__menu {
    display: flex;
    flex-direction: column;
    gap: 4px;
}

.fomo-nav-overlay__menu a {
    display: block;
    padding: 12px 8px;
    font-family: 'Poppins', system-ui, -apple-system, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
    font-size: 16px;
    line-height: 26px;
    font-weight: 400;
    color: #bdbdbd;
    text-decoration: none !important;
    border-radius: 8px;
    transition: color 0.15s ease, background 0.15s ease;
}

.fomo-nav-overlay__menu a:hover,
.fomo-nav-overlay__menu a.is-active {
    color: #ffffff;
    background: rgba(41, 255, 130, 0.08);
}

.fomo-nav-overlay__menu a.is-active {
    font-weight: 600;
}

.fomo-nav-overlay__group-label {
    margin-top: 12px;
    padding: 8px 8px 4px;
    font-family: 'Poppins', system-ui, -apple-system, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
    font-size: 12px;
    line-height: 18px;
    font-weight: 600;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    color: #01c853;
}

.fomo-nav-overlay__cta {
    margin-top: auto;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 12px 24px;
    border-radius: 80px;
    background: var(--fomo-accent, #01c853);
    color: #0d0d0d !important;
    font-family: 'Poppins', system-ui, -apple-system, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
    font-size: 16px;
    font-weight: 600;
    line-height: 26px;
    text-decoration: none !important;
    box-shadow: 0 10px 28px rgba(0, 199, 105, 0.35);
}

body.fomo-nav-open {
    overflow: hidden;
}

@media (max-width: 767.98px) {
    :root {
        --fomo-nav-height: 64px;
    }

    /* ----- Navbar (Figma 1744:35375) ----- */
    .fomo-index-nav-bar--about,
    .fomo-index-nav-bar--pricing {
        --fomo-nav-height: 64px;
    }

    .fomo-index-nav-bar--about .fomo-index-nav,
    .fomo-index-nav-bar--pricing .fomo-index-nav {
        height: 64px;
        padding: 0;
    }

    .fomo-index-nav {
        height: 64px;
        padding: 0;
        flex-wrap: nowrap;
        justify-content: space-between;
        gap: 12px;
    }

    .fomo-index-brand__logo {
        width: 108.33px;
        height: 33.43px;
    }

    .fomo-index-brand__emblem {
        width: 32px;
        height: 32px;
    }

    .fomo-index-brand__text {
        font-size: 18px;
    }

    .fomo-index-nav__menu,
    .fomo-index-nav__cta {
        display: none !important;
    }

    .fomo-nav-toggle {
        display: inline-flex;
    }

    /* ----- Hero (Figma 1744:35315) ----- */
    .fomo-index-hero {
        padding-bottom: 48px;
    }

    .fomo-index-hero__inner {
        padding-left: 20px;
        padding-right: 20px;
    }

    .fomo-index-hero__beam {
        display: none !important;
    }

    .fomo-index-hero__content {
        margin-top: 40px;
        text-align: center;
    }

    .fomo-index-hero__showcase {
        margin-top: 40px;
        min-height: 0;
        width: 100%;
    }

    .fomo-index-hero__showcase-visual {
        position: relative;
        width: calc(100% - 32px);
        max-width: 361px;
        margin: 0 auto;
        border-radius: 20px;
        overflow: hidden;
        border: 1px solid rgba(0, 199, 105, 0.22);
        box-shadow: 0 20px 60px rgba(0, 0, 0, 0.6);
    }

    .fomo-index-hero__showcase-img,
    .fomo-index-hero__showcase-video {
        display: block;
        width: 100%;
        height: auto;
    }

    /* Play control hidden on small screens — artwork already contains it */
    .fomo-index-hero__play {
        display: none;
    }

    /* Stat cards hidden on mobile — not present in Figma mobile design */
    .fomo-index-hero__stats {
        display: none;
    }

    .fomo-index-pill {
        font-size: 14px;
        line-height: 22px;
        padding: 8px 14px;
    }

    .fomo-index-hero__title {
        font-size: 40px;
        line-height: 48px;
        letter-spacing: -0.8px;
        margin-top: 24px;
        margin-bottom: 24px;
    }

    .fomo-index-hero__subtitle {
        font-size: 16px;
        line-height: 26px;
    }

    .fomo-index-hero__actions {
        margin-top: 32px;
        flex-direction: column;
        align-items: stretch;
        gap: 14px;
        width: 100%;
        max-width: 288px;
        margin-left: auto;
        margin-right: auto;
    }

    .fomo-index-btn {
        width: 100%;
        min-width: 0 !important;
    }

    /* ----- Partners (Figma 2144:31889) ----- */
    .fomo-partners__inner {
        padding: 80px 20px;
        gap: 64px;
    }

    .fomo-partners__title {
        font-size: 20px;
        line-height: 32px;
        font-weight: 400;
        letter-spacing: 0;
        padding: 0 4px;
    }

    .fomo-partners__marquee {
        width: 100%;
        --fomo-partners-gap: 56px;
    }

    .fomo-partners__logo {
        height: 41px;
    }

    .fomo-partners__mask--left {
        width: 80px;
    }

    .fomo-partners__mask--right {
        width: 56px;
    }

    /* ----- Shared section spacing ----- */
    .fomo-section__inner,
    .fomo-section--dark .fomo-section__inner {
        padding-left: 20px;
        padding-right: 20px;
    }

    .fomo-section.fomo-about-us,
    .fomo-section.fomo-workflow,
    .fomo-section.fomo-integration,
    .fomo-section.fomo-comparison,
    .fomo-section--dark.fomo-stack,
    .fomo-pricing {
        padding-top: 80px;
        padding-bottom: 80px;
    }

    /* ----- Features / Why switch (Figma 1744:43990) ----- */
    .fomo-about-us__header {
        margin-bottom: 64px;
        padding: 0;
    }

    .fomo-about-us__title {
        font-size: 40px;
        line-height: 48px;
        letter-spacing: -0.8px;
    }

    .fomo-about-us__subtitle {
        font-size: 16px;
        line-height: 26px;
    }

    .fomo-about-us__grid {
        grid-template-columns: 1fr;
        gap: 24px;
    }

    .fomo-about-us__card {
        min-height: 330px;
        height: auto;
        border-radius: 30px;
        border-width: 0.767px;
        padding: 30px 24px;
        gap: 24px;
    }

    .fomo-about-us__icon {
        width: 130px;
        height: 130px;
    }

    .fomo-about-us__icon img {
        width: 130px;
        height: 130px;
    }

    .fomo-about-us__card-title {
        font-size: 20px;
        line-height: 32px;
    }

    .fomo-about-us__card-text {
        font-size: 12px;
        line-height: 18px;
    }

    /* ----- Workflow (Figma 1744:44114) ----- */
    .fomo-workflow__wrap {
        gap: 64px;
    }

    .fomo-workflow__heading {
        padding: 0;
    }

    .fomo-workflow__title {
        font-size: 40px;
        line-height: 48px;
        letter-spacing: -0.8px;
    }

    .fomo-workflow__subtitle {
        display: none;
    }

    .fomo-workflow__timeline {
        gap: 230px;
    }

    .fomo-workflow__line {
        left: 36px;
        width: 8px;
        background: rgba(212, 255, 230, 0.35);
    }

    .fomo-workflow__line-fill {
        width: 100%;
        height: 100%;
        background: linear-gradient(180deg, #29ff82 0%, #01c853 100%);
        display: block;
    }

    .fomo-workflow__step {
        grid-template-columns: 80px 1fr;
        gap: 40px;
        align-items: flex-start;
    }

    .fomo-workflow__num {
        width: 80px;
        height: 80px;
        padding: 8px;
        border-radius: 120px;
        background: rgba(212, 255, 230, 0.15);
        display: flex;
        align-items: center;
        justify-content: center;
    }

    .fomo-workflow__num > span {
        width: 64px;
        height: 64px;
        font-size: 24px;
        line-height: 32px;
        border-radius: 120px;
    }

    .fomo-workflow__hint {
        display: none;
    }

    .fomo-workflow__step-text {
        font-weight: 300;
        line-height: 24px;
        opacity: 1;
    }

    /* ----- Notification types (Figma 1752:27640) ----- */
    .fomo-integration__header {
        margin-bottom: 32px;
    }

    .fomo-integration__title {
        font-size: 40px;
        line-height: 48px;
        letter-spacing: -0.8px;
    }

    .fomo-integration__subtitle {
        font-size: 16px;
        line-height: 26px;
    }

    .fomo-integration__list {
        gap: 20px;
    }

    .fomo-integration__card,
    .fomo-integration__card--reverse {
        display: flex;
        flex-direction: column;
        grid-template-columns: none;
        height: auto;
        padding: 20px;
        border-radius: 25px;
        gap: 24px;
    }

    .fomo-integration__card--reverse .fomo-integration__media {
        order: -1;
    }

    .fomo-integration__media {
        height: 268px;
        max-width: none;
        border-radius: 12px;
    }

    .fomo-integration__content {
        height: auto;
        gap: 16px;
    }

    .fomo-integration__card-title {
        font-size: 20px;
        line-height: 25px;
        letter-spacing: -0.4px;
    }

    .fomo-integration__text {
        font-size: 10px;
        line-height: 16px;
    }

    .fomo-integration__bullets {
        display: flex;
        flex-wrap: wrap;
        gap: 10px 24px;
        grid-template-columns: none;
    }

    .fomo-integration__bullets li {
        font-size: 9px;
        line-height: 13px;
    }

    .fomo-integration__btn {
        align-self: flex-start;
        padding: 7px 15px;
        font-size: 10px;
        line-height: 16px;
        background: #01c853;
        color: #0d0d0d !important;
        border-radius: 80px;
    }

    /* ----- Key metrics (Figma 1752:27661) ----- */
    .fomo-numbers__grid {
        display: flex;
        flex-direction: column;
        gap: 40px;
        padding: 80px 20px;
    }

    .fomo-numbers__value {
        font-size: 56px;
        line-height: 72px;
        letter-spacing: -2.24px;
        font-weight: 500;
    }

    .fomo-numbers__label {
        font-size: 20px;
        line-height: 32px;
        white-space: normal;
    }

    /* ----- WordPress stack diagram (Figma 1753:33099 — radial hub) ----- */
    .fomo-stack {
        padding: 80px 20px;
    }

    .fomo-stack__heading {
        margin-bottom: 40px;
    }

    .fomo-stack__title {
        font-size: 40px;
        line-height: 48px;
        letter-spacing: -0.8px;
    }

    .fomo-stack__subtitle {
        font-size: 16px;
        line-height: 26px;
    }

    /* ----- Diagram: matches Figma Group 1295 (369 × 981 px) ----- */
    .fomo-stack__diagram {
        max-width: 369px;
        margin: 0 auto;
        aspect-ratio: 369 / 981;   /* portrait — hub-and-spoke layout */
        min-height: 0;
    }

    /* On mobile: hide desktop horizontal SVG, show portrait SVG */
    .fomo-stack__lines--desktop {
        display: block;
        rotate: 90deg;
        width: 100%;
        scale: 2.7;
    }

    /* Hub: 292px = 79.13% of 369 */
    .fomo-stack__center {
        width: 79.13%;
    }

    /* Icon nodes: 76px = 20.72% of 369 */
    .fomo-stack__node {
        width: 20.72%;
        min-width: 0;
    }

    /*
     * Node centres as % of 369×981 (from Figma screenshot).
     * transform:translate(-50%,-50%) is already on .fomo-stack__node,
     * so left/top here are the CENTRE of each icon.
     *
     * Hub at 50% / 50% = (184.5, 490.5 px).
     * lm = Elementor  (top-centre)
     * rm = Webflow    (top-left)
     * lt = WordPress  (top-right)
     * rb = Globe      (bottom-left — at hub's lateral edge)
     * rt = Shopify    (bottom-right — at hub's lateral edge)
     * lb = WooCommerce(bottom-centre)
     */
    .fomo-stack__node--lm { left: 50%;    top: 8.3%;  }
    .fomo-stack__node--rm { left: 6.5%;  top: 17.1%; }
    .fomo-stack__node--lt { left: 93.5%;  top: 17.1%; }
    .fomo-stack__node--rb { left: 6.5%;  top: 80.5%; }
    .fomo-stack__node--rt { left: 93.5%;  top: 80.5%; }
    .fomo-stack__node--lb { left: 50%;    top: 92.9%; }

    /* ----- Testimonials — hidden on mobile ----- */
    .fomo-testimonials {
        display: none !important;
    }

    /* ----- Comparison — hidden on mobile ----- */
    .fomo-comparison {
        display: none !important;
    }

    /* ----- Pricing (Figma 1755:34405) ----- */
    .fomo-pricing {
        padding: 80px 0;
    }

    .fomo-pricing__inner {
        padding: 0 20px;
    }

    .fomo-pricing__title {
        font-size: 40px;
        line-height: 48px;
        letter-spacing: -0.8px;
    }

    .fomo-pricing__subtitle {
        font-size: 16px;
        line-height: 26px;
    }

    .fomo-pricing__toggle {
        width: 100%;
        max-width: 369px;
    }

    .fomo-pricing__toggle-option {
        padding: 13.938px 16px;
        font-size: 15.68px;
    }

    .fomo-pricing__grid {
        grid-template-columns: minmax(0, 1fr);
        max-width: 100%;
        gap: 24px;
    }

    .fomo-pricing__card {
        border-radius: 24px;
    }

    .fomo-pricing__cta {
        width: 100%;
        text-align: center;
    }

    /* ----- CTA (Figma 1756:34600) ----- */
    .fomo-cta {
        padding: 40px 20px;
    }

    .fomo-cta__inner {
        padding: 80px 0 40px;
        gap: 56px;
        border-radius: 32px;
    }

    .fomo-cta__title {
        font-size: 40px;
        line-height: 48px;
        letter-spacing: -0.8px;
    }

    .fomo-cta__subtitle {
        font-size: 20px;
        line-height: 32px;
    }

    .fomo-cta__actions {
        flex-direction: column;
        width: 100%;
        max-width: 287px;
        gap: 24px;
    }

    .fomo-cta .fomo-cta__btn {
        width: 100%;
        max-width: none;
        min-height: 50px;
    }

    /* ----- Footer (Figma 1756:39234) ----- */
    .fomo-footer {
        padding: 0 20px 32px;
    }

    .fomo-footer__content {
        flex-direction: column;
        gap: 80px;
        padding: 80px 0 56px;
    }

    .fomo-footer__newsletter {
        width: 100%;
        gap: 40px;
    }

    .fomo-footer__signup-desc {
        font-size: 16px;
        line-height: 26px;
    }

    .fomo-footer__field {
        width: 100%;
        max-width: 353px;
    }

    .fomo-footer__links {
        display: grid;
        grid-template-columns: 1fr 1fr;
        gap: 48px 24px;
        width: 100%;
        max-width: 100%;
        flex: none;
    }

    .fomo-footer__col {
        flex: none;
        min-width: 0;
    }

    .fomo-footer__link {
        white-space: normal;
    }

    .fomo-footer__copyright {
        text-align: center;
        width: 100%;
        font-size: 16px;
        line-height: 26px;
    }
}