/* marketing.css — shared styles for the public marketing pages (index, partners…).
   Brand palette lives in /style_guide.css. */

h1, h2, h3, h4 {
    font-family: "Stack Sans Headline", "Nunito", sans-serif;
    font-weight: 700;
    letter-spacing: -0.01em;
    line-height: 1.1;
}

/* ── NAVBAR: transparent over hero at top, solid white once scrolled ── */
#navbar { transition: background-color .3s ease, box-shadow .3s ease; }
#navbar:not(.active) { background-color: transparent; box-shadow: none; }
#navbar:not(.active) .nav-link { color: #fff; }
#navbar:not(.active) .nav-link:hover { color: var(--brand-accent); }
#navbar:not(.active) .nav-link .fw-bold { color: #fff !important; }
#navbar .zfs-logo-color { display: none; }
#navbar .zfs-logo-reverse { display: inline-block; }
#navbar.active .zfs-logo-reverse { display: none; }
#navbar.active .zfs-logo-color { display: inline-block; }
#navbar:not(.active) .navbar-toggler { color: #fff; border-color: rgba(255,255,255,.5); }
#navbar:not(.active) .navbar-toggler .fa-bars { color: #fff; }
#navbar.active { background-color: #fff; box-shadow: 0 2px 18px rgba(0,0,0,.08); }
#navbar.active .nav-link { color: var(--brand-navy); }
#navbar.active .nav-link:hover { color: var(--brand-primary); }
@media (max-width: 991px) {
    #navbar:not(.active) .navbar-collapse.show,
    #navbar:not(.active) .navbar-collapse.collapsing { background: rgba(26,37,53,.96); border-radius: 10px; padding: 12px 16px; margin-top: 8px; }
}

/* ── HERO ── */
.zfs-hero {
    background: linear-gradient(135deg, var(--brand-navy) 0%, #172a44 55%, var(--brand-primary-dark) 100%);
    padding: 150px 0 90px;
    position: relative;
    overflow: hidden;
}
.zfs-hero::before {
    content: '';
    position: absolute; inset: 0;
    background: radial-gradient(ellipse 65% 60% at 78% 45%, rgba(61,132,230,0.18), transparent);
    pointer-events: none;
}
.zfs-hero .container { position: relative; z-index: 2; }
.zfs-hero h1 { color: #fff; font-size: clamp(2.2rem, 5vw, 3.6rem); margin-bottom: 18px; max-width: 780px; }
.zfs-hero h1 em { color: var(--brand-accent); font-style: normal; }
.zfs-hero p  { color: rgba(255,255,255,0.72); font-size: 1.08rem; max-width: 560px; margin: 0 0 30px; line-height: 1.7; }
.zfs-eyebrow-light {
    display: inline-flex; align-items: center; gap: 8px;
    font-size: 0.7rem; font-weight: 700; letter-spacing: 0.16em; text-transform: uppercase;
    color: var(--brand-accent);
    background: rgba(61,132,230,0.12); border: 1px solid rgba(61,132,230,0.25);
    padding: 5px 14px 5px 10px; border-radius: 99px; margin-bottom: 20px;
}
.zfs-eyebrow-light::before { content: ''; width: 6px; height: 6px; background: var(--brand-accent); border-radius: 50%; flex-shrink: 0; }

/* ── SECTIONS ── */
.zfs-section { padding: 80px 0; scroll-margin-top: 72px; }
.zfs-section.gray { background: var(--zag-gray); }
.zfs-eyebrow {
    font-size: 0.7rem; font-weight: 700; letter-spacing: 0.18em;
    text-transform: uppercase; color: var(--brand-primary);
    display: flex; align-items: center; gap: 10px; margin-bottom: 12px;
}
.zfs-eyebrow.center { justify-content: center; }
.zfs-eyebrow::before { content: ''; width: 20px; height: 2px; background: var(--brand-primary); }
.zfs-h2 { font-size: clamp(1.7rem, 3vw, 2.5rem); color: var(--brand-navy); margin-bottom: 16px; }
.zfs-h2 .accent { color: var(--brand-primary); }
.zfs-lead { font-size: 1rem; color: var(--brand-muted); line-height: 1.8; }

/* ── STAT CARD ── */
.zfs-statcard { background: var(--brand-primary-light); border-radius: 14px; padding: 36px 32px; }
.zfs-statcard .lbl { font-size:0.68rem;font-weight:700;text-transform:uppercase;letter-spacing:.12em;color:var(--brand-primary);margin-bottom:20px; }
.zfs-stat { margin-bottom: 24px; }
.zfs-stat:last-child { margin-bottom: 0; }
.zfs-stat .num { font-size:2.7rem;font-weight:800;color:var(--brand-primary);line-height:1; }
.zfs-stat .cap { font-size:0.82rem;color:var(--brand-muted); }

/* ── FEATURE CARDS (strengths / services) ── */
.zfs-card {
    background:#fff; border:1px solid var(--brand-border); border-radius:12px;
    padding:30px 28px; height:100%; transition: all .25s;
}
.zfs-card:hover { box-shadow:0 10px 34px rgba(39,84,180,0.10); transform: translateY(-3px); border-color: var(--brand-primary); }
.zfs-card .ico {
    width:48px;height:48px;border-radius:12px;display:flex;align-items:center;justify-content:center;
    background:var(--brand-primary-light);color:var(--brand-primary);font-size:1.35rem;margin-bottom:18px;
}
.zfs-card h4 { font-size:1.08rem;color:var(--brand-navy);margin-bottom:9px; }
.zfs-card p  { font-size:0.9rem;color:var(--brand-muted);line-height:1.7;margin:0; }

/* ── REGULATORY LOGOS ── */
.zfs-reg-logos { display:flex;flex-wrap:wrap;align-items:center;justify-content:center;gap:38px 54px; }
.zfs-reg-logos img { height:58px;width:auto;filter:grayscale(1);opacity:.65;transition:all .25s; }
.zfs-reg-logos img:hover { filter:grayscale(0);opacity:1; }

/* ── CONTACT / DARK CTA ── */
.zfs-contact { background: linear-gradient(135deg, var(--brand-navy) 0%, var(--brand-primary-dark) 100%); }
.zfs-contact h2 { color:#fff; }
.zfs-contact .zfs-lead { color: rgba(255,255,255,.72); }
.zfs-contact-item { color:#fff; }
.zfs-contact-item .k { font-size:.72rem;font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:var(--brand-accent);margin-bottom:6px; }
.zfs-contact-item a { color:#fff; text-decoration:none; }
.zfs-contact-item a:hover { color: var(--brand-accent); }

/* ── REVEAL ── */
.zfs-reveal { opacity:0; transform:translateY(20px); transition: opacity .55s ease, transform .55s ease; }
.zfs-reveal.visible { opacity:1; transform:translateY(0); }
.zfs-d1 { transition-delay:.1s; } .zfs-d2 { transition-delay:.2s; } .zfs-d3 { transition-delay:.3s; }