body.inner-page { background: var(--Royal-Blue-Blue-900,#051A3C); color: var(--Base-White,#fcfcfc); }

/* Container — matches index.html breakpoint ladder (capped at 1320px) */
.container { width: 100%; max-width: 100%; margin-right: auto; margin-left: auto; padding-right: 1rem; padding-left: 1rem; }
@media (min-width: 576px)  { .container { max-width: 540px; } }
@media (min-width: 768px)  { .container { max-width: 720px; } }
@media (min-width: 992px)  { .container { max-width: 960px; } }
@media (min-width: 1200px) { .container { max-width: 1140px; } }
@media (min-width: 1400px) { .container { max-width: 1320px; } }

/* ── INTRO (plain, light — no hero banner) ── */
.sff-intro__inner { text-align:center; display:flex; flex-direction:column; align-items:center; gap:16px; max-width:720px; margin:0 auto 72px; position:relative; z-index:1; }
.sff-intro__title { font-family:'Space Grotesk',sans-serif; font-weight:300; font-size:56px; line-height:64px; letter-spacing:-0.8px; color:var(--Royal-Blue-Blue-900,#051A3C); margin:8px 0 0; }
.pr-gradient { font-style:normal; background:linear-gradient(110deg,#2863C3 0%,#4075C9 25%,#7747b6 55%,#2863C3 80%,#4075C9 100%); background-size:260% auto; -webkit-background-clip:text; background-clip:text; -webkit-text-fill-color:transparent; color:transparent; animation:heroShimmer 5s linear infinite; }
@keyframes heroShimmer { 0% { background-position:0% center; } 100% { background-position:260% center; } }
.sff-intro__copy { display:flex; flex-direction:column; gap:8px; max-width:560px; margin-top:4px; }
.sff-intro__trustline { font-family:'Inter',sans-serif; font-size:13px; font-weight:600; letter-spacing:.02em; color:var(--Violet-Violet-450,#7747b6); margin:0; }
.sff-intro__sub { font-family:'Inter',sans-serif; font-size:17px; line-height:27px; color:#4a5568; margin:0; }
.sff-intro__ctas { display:flex; align-items:center; gap:14px; flex-wrap:wrap; justify-content:center; margin-top:16px; }

.sff-intro__demo { font-family:'Inter',sans-serif; font-size:14px; font-weight:500; color:#4a5568; margin-top:-6px; }
.sff-intro__demo-link { color:var(--Violet-Violet-500,#55298e); font-weight:600; text-decoration:underline; text-underline-offset:2px; }
.sff-intro__demo-link:hover { color:var(--Violet-Violet-450,#7747b6); }

/* ── WHAT HAPPENS NEXT (3-step, sits above the sign-up CTA) ── */
.sff-steps { width:100%; max-width:620px; margin-top:20px; padding:24px 28px; border-radius:16px; background:rgba(119,71,182,.05); border:1px solid rgba(119,71,182,.16); display:flex; flex-direction:column; align-items:center; gap:18px; }
.sff-steps__eyebrow { font-family:'Inter',sans-serif; font-size:11px; font-weight:700; letter-spacing:.16em; text-transform:uppercase; color:var(--Violet-Violet-450,#7747b6); margin:0; }
.sff-steps__list { display:grid; grid-template-columns:repeat(3,1fr); gap:10px 12px; width:100%; position:relative; }
.sff-steps__list::before { content:''; position:absolute; top:13px; left:16.6667%; right:16.6667%; height:1px; background:rgba(119,71,182,.30); z-index:0; }
.sff-step { display:flex; flex-direction:column; align-items:center; gap:9px; text-align:center; position:relative; z-index:1; padding:0 4px; }
.sff-step__num { display:inline-flex; align-items:center; justify-content:center; flex-shrink:0; width:26px; height:26px; border-radius:50%; background:#efe7f8; border:1px solid rgba(119,71,182,.35); font-family:'Space Grotesk',sans-serif; font-weight:600; font-size:13px; color:var(--Violet-Violet-500,#55298e); }
.sff-step__text { font-family:'Inter',sans-serif; font-size:13.5px; font-weight:500; line-height:1.4; color:#4a5568; margin:0; }

@media (max-width: 767px) {
    .sff-steps { padding:20px 24px; }
    .sff-steps__list { grid-template-columns:1fr; gap:16px; }
    .sff-steps__list::before { display:none; }
    .sff-step { flex-direction:row; align-items:flex-start; text-align:left; gap:10px; }
    .sff-step__text { text-align:left; }
}

/* ── EYEBROW (light sections) ── */
.pr-eyebrow { display:inline-flex; align-items:center; gap:8px; padding:7px 16px; border-radius:50px; border:1px solid rgba(14,72,165,.14); background:rgba(14,72,165,.08); font-family:'Inter',sans-serif; font-size:11px; font-weight:500; letter-spacing:1.6px; text-transform:uppercase; color:var(--Royal-Blue-Blue-500,#0e48a5); margin-bottom:0; }

/* ── PRODUCT TRIO ── */
.sff-products {
    background:#fcfcfc;
    padding:96px 0;
    position:relative;
    overflow:hidden;
}
.sff-products::before {
    content:'';
    position:absolute;
    inset:0;
    background-image:radial-gradient(rgba(40,99,195,.14) 1px,transparent 1px);
    background-size:24px 24px;
    z-index:0;
    pointer-events:none;
}
.sff-products__head { text-align:center; margin-bottom:60px; position:relative; z-index:1; padding-top:48px; border-top:1px solid rgba(14,72,165,.10); }
.sff-products__title { font-family:'Space Grotesk',sans-serif; font-weight:300; font-size:34px; line-height:44px; letter-spacing:-0.5px; color:var(--Royal-Blue-Blue-900,#051A3C); margin:0 0 14px; }
.sff-products__sub { font-family:'Inter',sans-serif; font-size:16px; line-height:26px; color:#4a5568; margin:0 auto; max-width:560px; }

.sff-cards { display:grid; grid-template-columns:repeat(3,1fr); gap:24px; position:relative; z-index:1; }

.sff-card {
    --sff-accent:#7747b6;
    --sff-text:#55298e;
    --sff-soft:rgba(119,71,182,.10);
    --sff-border:rgba(119,71,182,.30);
    --sff-media-bg:#f3edfb;
    background:#fff;
    border:1px solid rgba(119,71,182,.22);
    border-radius:20px;
    padding:0;
    display:flex;
    flex-direction:column;
    align-items:stretch;
    overflow:hidden;
    box-shadow:0 4px 16px -8px rgba(20,20,40,.10);
    transition:transform .3s cubic-bezier(.22,.61,.36,1),box-shadow .3s,border-color .3s;
}
.sff-card:hover { transform:translateY(-6px); box-shadow:0 16px 36px -10px var(--sff-border); border-color:var(--sff-accent); }

/* Distinct accent per product, mirroring the pattern already used for
   testimonial tabs / persona tabs: Insights → Royal Blue, Ask Me → Violet,
   Data Magnet → Turquoise (see final-home-bundle.css). */
.sff-cards .sff-card:nth-child(1){ --sff-accent:#2863c3; --sff-text:#0e48a5; --sff-soft:rgba(40,99,195,.10); --sff-border:rgba(40,99,195,.30); --sff-media-bg:#eef3fb; }
.sff-cards .sff-card:nth-child(2){ --sff-accent:#7747b6; --sff-text:#55298e; --sff-soft:rgba(119,71,182,.10); --sff-border:rgba(119,71,182,.30); --sff-media-bg:#f3edfb; }
.sff-cards .sff-card:nth-child(3){ --sff-accent:#1ca9c9; --sff-text:#0f7a8c; --sff-soft:rgba(28,169,201,.10); --sff-border:rgba(28,169,201,.30); --sff-media-bg:#eaf7f9; }

.sff-card__media { width:100%; aspect-ratio:16/10; background:var(--sff-media-bg); border-bottom:1px solid rgba(20,20,40,.06); display:flex; align-items:center; justify-content:center; padding:20px; }
.sff-card__media img { width:auto; height:auto; max-width:72%; max-height:72%; object-fit:contain; display:block; }

.sff-card__body { display:flex; flex-direction:column; align-items:flex-start; gap:4px; padding:32px 32px 36px; flex:1; }

.sff-card__tagline { font-family:'Inter',sans-serif; font-size:11px; font-weight:700; letter-spacing:.16em; text-transform:uppercase; color:var(--sff-text); margin:0 0 6px; }
.sff-card__title { font-family:'Space Grotesk',sans-serif; font-weight:500; font-size:22px; line-height:30px; letter-spacing:-0.2px; color:var(--Royal-Blue-Blue-900,#051A3C); margin:0 0 12px; }
.sff-card__desc { font-family:'Inter',sans-serif; font-size:15px; line-height:26px; color:#4a5568; margin:0 0 20px; }

.sff-chips { display:flex; flex-wrap:wrap; gap:8px; margin-top:auto; }
.sff-chip { display:inline-flex; align-items:center; padding:6px 14px; border-radius:50px; background:var(--sff-soft); border:1px solid var(--sff-border); font-family:'Inter',sans-serif; font-size:12px; font-weight:500; color:var(--sff-text); }

/* ── DARK FAQ ── */
.sff-dark-faq {
    position:relative;
    background:linear-gradient(160deg,#1d0b42 0%,#0d1e49 45%,#051A3C 100%);
    padding:96px 0;
    overflow:hidden;
    color:#fcfcfc;
}
.sff-dark-faq::before {
    content:'';
    position:absolute;
    inset:0;
    background:radial-gradient(ellipse 70% 80% at 15% 50%,rgba(85,41,142,.40) 0%,transparent 65%);
    pointer-events:none;
}

/* ── RESPONSIVE ── */
@media (max-width:1199px) {
    .sff-cards { grid-template-columns:1fr; max-width:480px; margin:0 auto; }
}
@media (max-width:991px) {
    .sff-intro__title { font-size:44px; line-height:54px; }
    .sff-products__title { font-size:28px; line-height:38px; }
    .sff-products { padding:72px 0; }
    .sff-dark-faq { padding:72px 0; }
    .sff-intro__inner { margin-bottom:56px; }
    .sff-products__head { margin-bottom:40px; }
}
@media (max-width:575px) {
    .sff-intro__title { font-size:34px; line-height:44px; }
    .sff-intro__sub { font-size:15.5px; line-height:25px; }
    .sff-products__title { font-size:24px; line-height:34px; }
    .sff-card__body { padding:26px 24px 30px; }
}