/*
 * Fuselight Landing Page
 * Standalone stylesheet — intentionally outside the webpack build.
 * Only loaded on the front page (see lib/assets.php).
 */

:root {
    --fl-navy: #071650;
    --fl-blue-deep: #0b1f6b;
    --fl-blue-mid: #1436a8;
    --fl-blue: #2053e0;
    --fl-blue-bright: #2e6bff;
    --fl-cyan: #4fd1ff;
    --fl-orange: #ff8a3d;
    --fl-ink: #0d1b4c;
    --fl-body: #46527a;
    --fl-pill-bg: #e3efff;
    --fl-pill-text: #1436a8;
    --fl-radius: 16px;
}

.fl-landing,
.fl-landing * {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}

.fl-landing {
    font-family: 'Outfit', 'Poppins', -apple-system, BlinkMacSystemFont, sans-serif;
    background: #fff;
    color: var(--fl-body);
    scroll-behavior: smooth;
}

.fl-landing img { max-width: 100%; height: auto; }

.fl-container {
    max-width: 1200px;
    margin: 0 auto;
    padding: 0 15px;
}

.fl-section { padding: 72px 0; }

/* ---------- Type ---------- */
.fl-landing h1,
.fl-landing h2,
.fl-landing h3,
.fl-landing h4 {
    color: var(--fl-ink);
    line-height: 1.2;
    letter-spacing: -0.5px;
}

.fl-landing h2 { font-size: clamp(28px, 3.4vw, 40px); font-weight: 600; }
.fl-h2--center { text-align: center; max-width: 22ch; margin: 0 auto; }

.fl-eyebrow {
    color: #05F;
    font-family: 'Outfit', 'Poppins', -apple-system, BlinkMacSystemFont, sans-serif;
    font-size: 16px;
    font-weight: 700;
    line-height: 125%;
    text-transform: uppercase;
    letter-spacing: 3.2px;
    margin-bottom: 16px;
}

.fl-eyebrow--light { color: #9fd9ff; }
.fl-eyebrow--center { text-align: center; }

.fl-lede {
    font-size: 17px;
    line-height: 1.7;
    margin-top: 18px;
    max-width: 72ch;
}

.fl-lede--center { text-align: center; margin-left: auto; margin-right: auto; }
.fl-lede--light { color: rgba(255, 255, 255, 0.85); }

/* ---------- Buttons ---------- */
.fl-btn {
    display: inline-block;
    padding: 13px 30px;
    border-radius: 8px;
    border: 0;
    font-family: inherit;
    font-size: 15px;
    font-weight: 600;
    text-decoration: none;
    cursor: pointer;
    transition: transform 0.15s ease, box-shadow 0.15s ease;
}

.fl-btn:hover { transform: translateY(-1px); box-shadow: 0 8px 24px rgba(7, 22, 80, 0.2); }
.fl-btn--white {
    background: #fff;
    color: #05F;
    text-align: center;
    font-family: 'Outfit', 'Poppins', -apple-system, BlinkMacSystemFont, sans-serif;
    font-size: 18px;
    font-weight: 700;
    line-height: 125%;
}
.fl-btn--blue { background: var(--fl-blue); color: #fff; text-transform: uppercase; font-size: 13.5px; letter-spacing: 1px; }
.fl-btn--full { width: 100%; }
.fl-btn--outline {
    background: #05F;
    color: #FFF;
    border: 0;
    border-radius: 5px;
    text-align: center;
    font-family: 'Outfit', 'Poppins', -apple-system, BlinkMacSystemFont, sans-serif;
    font-size: 16px;
    font-weight: 700;
    line-height: 125%;
    text-transform: uppercase;
}

/* ---------- Spark (asterisk) marks ---------- */
.fl-spark { width: 54px; height: 54px; flex-shrink: 0; }
.fl-spark--blue path { fill: var(--fl-blue-bright); }
.fl-spark--cyan path { fill: var(--fl-cyan); }
.fl-spark--orange path { fill: #ffc23d; }
.fl-spark--gradient path { fill: var(--fl-blue-bright); }

/* ========================== STICKY HEADER ========================== */
.fl-sticky {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    z-index: 100;
    background: #fff;
    box-shadow: 0 2px 16px rgba(7, 22, 80, 0.08);
    transform: translateY(-100%);
    transition: transform 0.35s ease;
}

.fl-sticky.is-visible { transform: translateY(0); }

.fl-sticky__inner {
    max-width: 1200px;
    margin: 0 auto;
    padding: 12px 15px;
    display: flex;
    align-items: center;
    gap: 24px;
}

.fl-sticky__inner .fl-logo { margin-right: auto; }

/* Dark text/button for contrast on the white bar */
.fl-sticky .fl-nav__links a:not(.fl-btn) { color: #001133; }
.fl-sticky .fl-btn--white { background: #05F; color: #fff; }

/* ===================== MOBILE MENU + HAMBURGER ===================== */
.fl-nav__toggle {
    display: none; /* shown at <= 860px */
    flex-direction: column;
    justify-content: center;
    gap: 5px;
    width: 44px;
    height: 44px;
    padding: 10px;
    background: transparent;
    border: 0;
    cursor: pointer;
}

.fl-nav__toggle span {
    display: block;
    height: 3px;
    border-radius: 2px;
    background: #05F; /* blue — the toggle only shows on white bars */
}

.fl-mobile-menu {
    position: fixed;
    inset: 0;
    z-index: 200;
    padding: 20px 24px 40px;
    background: linear-gradient(180deg, #001133 0%, #0055FF 100%);
    display: flex;
    flex-direction: column;
    opacity: 0;
    visibility: hidden;
    transform: translateY(-12px);
    transition: opacity 0.28s ease, transform 0.28s ease, visibility 0.28s;
}

.fl-mobile-menu.is-open {
    opacity: 1;
    visibility: visible;
    transform: translateY(0);
}

.fl-mobile-menu__top {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
}

.fl-mobile-menu__actions { display: flex; align-items: center; gap: 14px; }

.fl-mobile-menu__close {
    background: transparent;
    border: 0;
    color: #05F;
    font-size: 34px;
    line-height: 1;
    cursor: pointer;
}

.fl-mobile-menu__links {
    display: flex;
    flex-direction: column;
    margin-top: 36px;
}

.fl-mobile-menu__links a {
    padding: 18px 0;
    color: #fff;
    text-align: center;
    text-decoration: none;
    font-family: 'Outfit', 'Poppins', -apple-system, BlinkMacSystemFont, sans-serif;
    font-size: 20px;
    font-weight: 700;
    border-bottom: 2px solid;
    border-image: linear-gradient(90deg, #FF8B00 0%, #00EDFF 100%) 1;
}

.fl-mobile-menu__cta { margin-top: 32px; }

/* ============================== HERO ============================== */
.fl-hero {
    position: relative;
    min-height: 100vh;
    overflow: visible;
    background: #fff;
}

#fl-wave-canvas {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 120vh;
    display: block;
    background-color: #fff;
    background-image: radial-gradient(100.01% 100% at 49.17% 0%, #013 0%, #05F 50%, #FFF 100%);
    background-size: max(3000px, 100%) 100%;
    background-position: center top;
    background-repeat: no-repeat;
}

.fl-hero__content {
    position: relative;
    z-index: 2;
    display: flex;
    flex-direction: column;
    min-height: 100vh;
    pointer-events: none;
}

.fl-hero__content a,
.fl-hero__content button { pointer-events: auto; }

/* ---------- Nav ---------- */
.fl-nav {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 32px 56px;
    max-width: 1440px;
    width: 100%;
    margin: 0 auto;
}

.fl-logo {
    display: flex;
    align-items: center;
    gap: 12px;
    color: #fff;
    font-size: 28px;
    font-weight: 600;
    letter-spacing: -0.5px;
    text-decoration: none;
}

.fl-logo__mark {
    width: 40px;
    height: 40px;
    border-radius: 10px;
    background: linear-gradient(135deg, #2e6bff, var(--fl-cyan));
    display: grid;
    place-items: center;
    flex-shrink: 0;
}

.fl-logo__mark svg { width: 22px; height: 22px; }
.fl-logo__bang { color: var(--fl-cyan); font-style: normal; }
.fl-logo__img { width: 200px; height: 47px; display: block; }
.fl-logo__img--footer { width: 350px; height: 81px; }
.fl-logo__img--dark { display: none; } /* shown only on the white mobile nav bar */

.fl-nav__links { display: flex; align-items: center; gap: 40px; }

.fl-nav__links a:not(.fl-btn) {
    color: #fff;
    text-align: right;
    text-decoration: none;
    font-family: 'Outfit', 'Poppins', -apple-system, BlinkMacSystemFont, sans-serif;
    font-size: 18px;
    font-weight: 600;
    line-height: 125%;
    opacity: 0.95;
    transition: opacity 0.2s;
}

.fl-nav__links a:not(.fl-btn):hover { opacity: 1; text-decoration: underline; text-underline-offset: 6px; }

/* ---------- Hero copy ---------- */
.fl-hero__body {
    flex: 1;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    text-align: center;
    padding: 20px 24px 140px;
    max-width: 1060px;
    margin: 0 auto;
}

.fl-hero__chip {
    width: 105px;
    height: 100px;
    margin-bottom: 36px;
    animation: fl-float 5s ease-in-out infinite;
}

@keyframes fl-float {
    0%, 100% { transform: translateY(0); }
    50% { transform: translateY(-10px); }
}

.fl-hero h1 {
    color: #fff;
    text-align: center;
    font-family: 'Outfit', 'Poppins', -apple-system, BlinkMacSystemFont, sans-serif;
    font-size: 48px;
    font-weight: 600;
    line-height: 125%;
    max-width: 970px;
    text-shadow: 0 2px 24px rgba(7, 22, 80, 0.35);
}

.fl-hero__divider {
    width: min(970px, 100%);
    height: 5px;
    margin: 42px auto 38px;
    border-radius: 2px;
    background: linear-gradient(90deg, #FF8B00 0%, #00EDFF 100%);
}

.fl-hero__sub {
    color: #fff;
    text-align: center;
    font-family: 'Outfit', 'Poppins', -apple-system, BlinkMacSystemFont, sans-serif;
    font-size: 22px;
    font-weight: 400;
    line-height: 125%;
    max-width: 970px;
    text-shadow: 0 1px 12px rgba(7, 22, 80, 0.3);
}

/* ========================= PROVEN OUTCOMES ========================= */
.fl-outcomes { padding-bottom: 0; position: relative; }

.fl-outcomes__row {
    display: flex;
    align-items: flex-start;
    gap: 28px;
}

.fl-outcomes__icon { width: 110px; height: 150px; flex-shrink: 0; }

.fl-outcomes h2 {
    color: #000;
    font-family: 'Outfit', 'Poppins', -apple-system, BlinkMacSystemFont, sans-serif;
    font-size: 48px;
    font-weight: 600;
    line-height: 125%;
}

.fl-outcomes .fl-lede {
    color: #666;
    font-family: 'Outfit', 'Poppins', -apple-system, BlinkMacSystemFont, sans-serif;
    font-size: 20px;
    font-weight: 400;
    line-height: 125%;
}

.fl-rule {
    height: 5px;
    margin-top: 40px;
    border: 0;
    border-radius: 2px;
    background: linear-gradient(90deg, #FF8B00 0%, #00EDFF 100%);
}

/* =========================== CASE STUDY =========================== */
.fl-case { margin-top: 0; padding-top: 60px; }

/* Case study carousel — each slide holds the case grid + its stats. */
.fl-case-carousel__track {
    display: flex;
    overflow-x: auto;
    scroll-snap-type: x mandatory;
    scrollbar-width: none;
}

.fl-case-carousel__track::-webkit-scrollbar { display: none; }

.fl-case-slide {
    flex: 0 0 100%;
    scroll-snap-align: start;
}

.fl-case-carousel__dots {
    justify-content: center;
    margin-top: 40px;
}

.fl-case__grid {
    display: grid;
    grid-template-columns: 1.1fr 1fr;
    gap: 56px;
    align-items: center;
}

.fl-case__photo {
    width: 100%;
    aspect-ratio: 4 / 3;
    border-radius: var(--fl-radius);
    object-fit: cover;
    display: block;
}

.fl-case__client {
    color: #000;
    font-family: 'Outfit', 'Poppins', -apple-system, BlinkMacSystemFont, sans-serif;
    font-size: 24px;
    font-weight: 700;
    line-height: 125%;
    margin-bottom: 10px;
}

.fl-case__body h3 {
    color: #000;
    font-family: 'Outfit', 'Poppins', -apple-system, BlinkMacSystemFont, sans-serif;
    font-size: 36px;
    font-weight: 400;
    line-height: 125%;
    margin-bottom: 26px;
}

.fl-case__block { margin-bottom: 20px; }

.fl-case__block h4 {
    color: #05F;
    font-family: 'Outfit', 'Poppins', -apple-system, BlinkMacSystemFont, sans-serif;
    font-size: 16px;
    font-weight: 700;
    line-height: 125%;
    text-transform: uppercase;
    margin-bottom: 6px;
}

.fl-case__block p {
    color: #000;
    font-family: 'Outfit', 'Poppins', -apple-system, BlinkMacSystemFont, sans-serif;
    font-size: 24px;
    font-weight: 400;
    line-height: 125%;
}

.fl-case__logo {
    margin-top: 28px;
    width: 239px;
    height: 69px;
    display: block;
}

.fl-case__logo--epe { width: 142px; height: 100px; }

/* ---------- Stats ---------- */
.fl-stats {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 32px;
    margin-top: 60px;
    padding-top: 0;
}

.fl-stat__value {
    color: #000;
    font-family: 'Outfit', 'Poppins', -apple-system, BlinkMacSystemFont, sans-serif;
    font-size: 48px;
    font-weight: 700;
    line-height: 125%;
}

.fl-stat__value span { color: var(--fl-blue-bright); }

.fl-stat__label {
    color: #000;
    font-family: 'Outfit', 'Poppins', -apple-system, BlinkMacSystemFont, sans-serif;
    font-size: 21px;
    font-weight: 400;
    line-height: 125%;
    margin-top: 12px;
    padding-top: 12px;
    border-top: 4px solid #05F;
}

/* =========================== THE CHALLENGE =========================== */
.fl-challenge .fl-container { max-width: 1400px; }

.fl-challenge__panel {
    border-radius: 20px;
    padding: 100px;
    text-align: center;
    color: #fff;
    background:
        url(../images/challenge-bg.webp) 50% / cover no-repeat padding-box,
        linear-gradient(180deg, #0055FF 0%, #00EDFF 100%) border-box;
    border: 10px solid transparent;
}

.fl-challenge__panel .fl-eyebrow--light {
    color: #05F;
    text-align: center;
}

.fl-challenge__panel h2 {
    color: #000;
    text-align: center;
    font-family: 'Outfit', 'Poppins', -apple-system, BlinkMacSystemFont, sans-serif;
    font-size: 48px;
    font-weight: 600;
    line-height: 125%;
}

.fl-challenge__sub {
    max-width: 1166px;
    margin: 18px auto 0;
    color: #000;
    text-align: center;
    font-family: 'Outfit', 'Poppins', -apple-system, BlinkMacSystemFont, sans-serif;
    font-size: 18px;
    font-weight: 400;
    line-height: 125%;
}

.fl-challenge__cards {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 24px;
    margin-top: 44px;
}

.fl-challenge__card {
    background: #fff;
    border-radius: 25px;
    padding: 28px 26px 22px;
    text-align: left;
    display: flex;
    flex-direction: column;
    min-height: 220px;
}

.fl-challenge__card--orange { border: 5px solid #FF8B00; }
.fl-challenge__card--cyan { border: 5px solid #00EDFF; }
.fl-challenge__card--blue { border: 5px solid #05F; }

.fl-challenge__card h3 {
    color: #000;
    font-family: 'Outfit', 'Poppins', -apple-system, BlinkMacSystemFont, sans-serif;
    font-size: 32px;
    font-weight: 700;
    line-height: 125%;
    margin-bottom: 10px;
}
.fl-challenge__card p {
    color: #666;
    font-family: 'Outfit', 'Poppins', -apple-system, BlinkMacSystemFont, sans-serif;
    font-size: 22px;
    font-weight: 400;
    line-height: 125%;
}
.fl-challenge__card-icon { width: 73px; height: 100px; margin-top: auto; padding-top: 56px; align-self: flex-end; }

/* ============================ HOW WE HELP ============================ */
.fl-solutions { background: #fff; position: relative; }

/* Decorative floating background icons — positioned against the container
   box and clipped to it, sitting behind the container content. */
.fl-solutions__bg {
    position: absolute;
    inset: 0;
    overflow: visible;
    pointer-events: none;
    z-index: -1;
}

.fl-solutions__bg-icon {
    position: absolute;
    width: 234px;
    height: 319px;
}

.fl-solutions__bg-icon--orange { top: 215px; left: -80px; }
.fl-solutions__bg-icon--blue { bottom: 10%; right: -78px; }
.fl-solutions__bg-icon--teal { bottom: -230px; left: 50%; transform: translateX(-50%); }

.fl-solutions > .fl-container { position: relative; z-index: 1; }

.fl-solutions h2 {
    color: #000;
    text-align: center;
    font-family: 'Outfit', 'Poppins', -apple-system, BlinkMacSystemFont, sans-serif;
    font-size: 48px;
    font-weight: 600;
    line-height: 125%;
    max-width: 1170px;
}

.fl-solutions .fl-lede {
    color: #666;
    text-align: center;
    font-family: 'Outfit', 'Poppins', -apple-system, BlinkMacSystemFont, sans-serif;
    font-size: 24px;
    font-weight: 400;
    line-height: 125%;
    max-width: 1170px;
}

.fl-carousel { margin-top: 48px; }

.fl-carousel__controls {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 20px;
}

.fl-carousel__dots { display: flex; align-items: center; gap: 5px; }

.fl-carousel__dots span {
    width: 20px;
    height: 20px;
    border-radius: 10px;
    background: #D9D9D9;
    cursor: pointer;
    transition: background 0.2s, width 0.2s;
}

.fl-carousel__dots span.is-active { width: 40px; background: #05F; }

.fl-carousel__arrows { display: flex; gap: 10px; }

.fl-carousel__arrow {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    gap: 10px;
    width: 50px;
    height: 50px;
    padding: 5px 3px;
    border-radius: 5px;
    border: 3px solid #05F;
    background: #05F;
    color: #fff;
    font-size: 17px;
    cursor: pointer;
    transition: background 0.2s;
}

.fl-carousel__arrow:hover { background: var(--fl-blue-mid); }
.fl-carousel__arrow:disabled { cursor: default; opacity: 0.45; }

.fl-carousel__track {
    display: flex;
    gap: 24px;
    overflow-x: auto;
    scroll-snap-type: x mandatory;
    scrollbar-width: none;
    padding: 4px;
    /* Bleed the scroll window to the right viewport edge so trailing
       cards peek instead of being clipped at the container edge. */
    margin-right: calc(50% - 50vw);
    padding-right: 15px;
}

.fl-carousel__track::-webkit-scrollbar { display: none; }

.fl-solution {
    /* Exactly one-third of the 1170px container (minus the two 24px gaps),
       regardless of the wider bled track. */
    flex: 0 0 calc((min(1170px, 100vw - 30px) - 48px) / 3);
    scroll-snap-align: start;
    background: #fff;
    border-radius: 25px;
    padding: 28px 26px;
    border: 5px solid #05F;
}

.fl-solution--orange { border-color: #FF8B00; }
.fl-solution--cyan { border-color: #00EDFF; }
.fl-solution--blue { border-color: #05F; }

.fl-solution h3 {
    color: #000;
    font-family: 'Outfit', 'Poppins', -apple-system, BlinkMacSystemFont, sans-serif;
    font-size: 24px;
    font-weight: 700;
    line-height: 125%;
    margin-bottom: 10px;
}

.fl-solution__tagline {
    color: #000;
    font-family: 'Outfit', 'Poppins', -apple-system, BlinkMacSystemFont, sans-serif;
    font-size: 20px;
    font-weight: 400;
    line-height: 125%;
    margin-bottom: 10px;
}

.fl-solution__desc {
    color: #666;
    font-family: 'Outfit', 'Poppins', -apple-system, BlinkMacSystemFont, sans-serif;
    font-size: 16px;
    font-weight: 400;
    line-height: 125%;
    margin-bottom: 18px;
}

.fl-solution .fl-pills li {
    color: #000;
    text-align: center;
    font-family: 'Outfit', 'Poppins', -apple-system, BlinkMacSystemFont, sans-serif;
    font-size: 16px;
    font-weight: 700;
    line-height: 125%;
    border-radius: 20px;
}

.fl-solution .fl-pills--orange li { background: rgba(255, 139, 0, 0.20); }
.fl-solution .fl-pills--teal li { background: rgba(0, 237, 255, 0.20); }
.fl-solution .fl-pills--blue li { background: rgba(0, 85, 255, 0.20); }

.fl-pills { list-style: none; display: flex; flex-wrap: wrap; gap: 8px; }

.fl-pills li {
    background: var(--fl-pill-bg);
    color: var(--fl-pill-text);
    font-size: 12.5px;
    font-weight: 500;
    padding: 6px 12px;
    border-radius: 999px;
}

.fl-pills--orange li { background: #ffedde; color: #b35311; }

/* ---------- Specialized CTA ---------- */
.fl-specialized {
    margin-top: 72px;
    max-width: 970px;
    margin-left: auto;
    margin-right: auto;
    border-radius: 25px;
    padding: 56px 48px;
    text-align: center;
    background: linear-gradient(180deg, rgba(0, 237, 255, 0.15) 0%, rgba(255, 255, 255, 0.15) 100%), #FFF;
    border: 10px solid #05F;
}

.fl-specialized h2 { font-size: 32px; margin-bottom: 16px; }

.fl-specialized p:not(.fl-eyebrow) {
    max-width: 64ch;
    margin: 0 auto 28px;
    color: #666;
    text-align: center;
    font-family: 'Outfit', 'Poppins', -apple-system, BlinkMacSystemFont, sans-serif;
    font-size: 24px;
    font-weight: 400;
    line-height: 125%;
}

/* ============================ INDUSTRIES ============================ */
.fl-industries {
    position: relative;
    z-index: 1;
    overflow: hidden;
    background:
        linear-gradient(180deg, rgba(0, 85, 255, 0.80) 0%, rgba(0, 237, 255, 0.80) 100%),
        url(../images/industries-bg.webp) 50% / cover no-repeat;
    color: rgba(255, 255, 255, 0.85);
    padding: 88px 0;
}

/* Decorative floating background icons, positioned against the container. */
.fl-industries > .fl-container { position: relative; z-index: 1; }

.fl-industries__bg {
    position: absolute;
    inset: 0;
    overflow: visible;
    pointer-events: none;
    z-index: -1;
}

.fl-industries__bg-icon {
    position: absolute;
    width: 234px;
    height: 319px;
    transform: translateY(-50%);
}

.fl-industries__bg-icon--left { left: -140px; top: 42%; }
.fl-industries__bg-icon--right { right: -110px; top: 76%; }

.fl-industries .fl-eyebrow {
    color: #FFF;
    text-align: center;
    font-family: 'Outfit', 'Poppins', -apple-system, BlinkMacSystemFont, sans-serif;
    font-size: 16px;
    font-weight: 700;
    line-height: 125%;
    letter-spacing: 3.2px;
    text-transform: uppercase;
}

.fl-industries h2 {
    color: #FFF;
    text-align: center;
    font-family: 'Outfit', 'Poppins', -apple-system, BlinkMacSystemFont, sans-serif;
    font-size: 40px;
    font-weight: 600;
    line-height: 125%;
    max-width: 1170px;
}

.fl-industries .fl-lede {
    color: #FFF;
    text-align: center;
    font-family: 'Outfit', 'Poppins', -apple-system, BlinkMacSystemFont, sans-serif;
    font-size: 20px;
    font-weight: 400;
    line-height: 125%;
    max-width: 1170px;
}

.fl-industries__cards {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 24px;
    margin-top: 52px;
}

.fl-industry {
    border-radius: 25px;
    padding: 30px 26px;
}

.fl-industry:nth-child(1) {
    background: radial-gradient(64.85% 70.71% at 100% 100%, #BC6700 0%, #0F242C 100%);
}

.fl-industry:nth-child(2) {
    background: radial-gradient(71.36% 70.71% at 100% 100%, #00A7B3 0%, #0F242C 100%);
}

.fl-industry:nth-child(3) {
    background: radial-gradient(75.72% 70.71% at 100% 100%, #05F 0%, #0F242C 100%);
    backdrop-filter: blur(2px);
}

.fl-industry__icon {
    display: block;
    width: 50px;
    height: 50px;
    margin-bottom: 18px;
}

.fl-industry h3 { color: #fff; font-size: 19px; font-weight: 700; margin-bottom: 10px; }
.fl-industry > p {
    color: #FFF;
    font-family: 'Outfit', 'Poppins', -apple-system, BlinkMacSystemFont, sans-serif;
    font-size: 18px;
    font-weight: 400;
    line-height: 125%;
    margin-bottom: 18px;
}

.fl-pills--dark-orange li { background: #FF8B00; border-radius: 20px; }
.fl-pills--dark-cyan li { background: #00A7B3; border-radius: 20px; }
.fl-pills--dark-blue li { background: #05F; border-radius: 20px; }

.fl-industry .fl-pills li {
    color: #FFF;
    font-family: 'Outfit', 'Poppins', -apple-system, BlinkMacSystemFont, sans-serif;
    font-size: 18px;
    font-weight: 700;
    line-height: 125%;
}

/* =============================== WHY =============================== */
.fl-why { padding-top: 88px; }

.fl-why h2 {
    color: #000;
    font-family: 'Outfit', 'Poppins', -apple-system, BlinkMacSystemFont, sans-serif;
    font-size: 48px;
    font-weight: 600;
    line-height: 125%;
}

.fl-why .fl-lede {
    color: #666;
    font-family: 'Outfit', 'Poppins', -apple-system, BlinkMacSystemFont, sans-serif;
    font-size: 22px;
    font-weight: 400;
    line-height: 125%;
    max-width: none;
}

.fl-why__cols {
    display: grid;
    grid-template-columns: repeat(5, 1fr);
    gap: 24px;
    margin-top: 48px;
}

.fl-why__col {
    background: linear-gradient(180deg, rgba(0, 237, 255, 0.20) 0%, rgba(0, 237, 255, 0.06) 100%);
    border-radius: 10px;
    padding: 22px 20px;
}

.fl-why__col h3 {
    color: #000;
    font-family: 'Outfit', 'Poppins', -apple-system, BlinkMacSystemFont, sans-serif;
    font-size: 20px;
    font-weight: 700;
    line-height: 125%;
    margin-bottom: 10px;
}
.fl-why__col p {
    color: #666;
    font-family: 'Outfit', 'Poppins', -apple-system, BlinkMacSystemFont, sans-serif;
    font-size: 18px;
    font-weight: 400;
    line-height: 125%;
}

/* ============================= CONTACT ============================= */
.fl-contact { padding-bottom: 96px; }

.fl-contact h2 {
    color: #000;
    font-family: 'Outfit', 'Poppins', -apple-system, BlinkMacSystemFont, sans-serif;
    font-size: 48px;
    font-weight: 600;
    line-height: 125%;
}

.fl-contact .fl-lede {
    color: #666;
    font-family: 'Outfit', 'Poppins', -apple-system, BlinkMacSystemFont, sans-serif;
    font-size: 18px;
    font-weight: 400;
    line-height: 125%;
}

.fl-contact__grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 64px;
    align-items: start;
}

.fl-contact__icon {
    width: 146px;
    height: 200px;
    margin-top: 40px;
}

.fl-contact__card {
    background:
        linear-gradient(#fff, #fff) padding-box,
        linear-gradient(180deg, #0055FF 0%, #00EDFF 100%) border-box;
    border: 10px solid transparent;
    border-radius: 25px;
    padding: 36px 32px;
    box-shadow: 0 24px 60px rgba(7, 22, 80, 0.08);
}

.fl-form label { display: block; margin-bottom: 18px; }

.fl-form label span {
    display: block;
    font-size: 14px;
    font-weight: 600;
    color: var(--fl-ink);
    margin-bottom: 8px;
}

.fl-form input,
.fl-form textarea {
    width: 100%;
    font-family: inherit;
    font-size: 15px;
    color: var(--fl-ink);
    padding: 12px 14px;
    border: 1.5px solid #ccd9f2;
    border-radius: 8px;
    background: #fbfdff;
    transition: border-color 0.2s;
}

.fl-form input:focus,
.fl-form textarea:focus {
    outline: none;
    border-color: var(--fl-blue-bright);
}

.fl-form textarea { resize: vertical; }

.fl-form__status {
    margin-top: 14px;
    font-size: 15px;
    line-height: 1.5;
}
.fl-form__status:empty { display: none; }

/* Honeypot — off-screen (not display:none, which bots skip) */
.fl-form__hp {
    position: absolute;
    left: -9999px;
    width: 1px;
    height: 1px;
    overflow: hidden;
}
.fl-form__status.is-success { color: #0a7d34; }
.fl-form__status.is-error { color: #c0341d; }

/* ============================== FOOTER ============================== */
.fl-footer {
    background:
        url(../images/vector-wave.svg) left top / cover no-repeat,
        linear-gradient(180deg, #013 0%, #004BE1 100%);
    text-align: center;
    padding: 110px 0 0;
    color: rgba(255, 255, 255, 0.75);
}

.fl-footer > .fl-container { padding-bottom: 80px; }

.fl-footer__bar {
    background: #001133;
    padding: 50px 0;
    margin-top: 0;
}

.fl-logo--footer { justify-content: center; margin-bottom: 14px; }

.fl-footer__tagline {
    color: #FFF;
    text-align: center;
    font-family: 'Outfit', 'Poppins', -apple-system, BlinkMacSystemFont, sans-serif;
    font-size: 32px;
    font-weight: 700;
    line-height: 125%;
    margin-bottom: 30px;
}

.fl-footer__actions {
    display: flex;
    justify-content: center;
    gap: 16px;
    flex-wrap: wrap;
    margin-bottom: 110px;
}

.fl-footer__legal {
    color: #FFF;
    text-align: center;
    font-family: 'Outfit', 'Poppins', -apple-system, BlinkMacSystemFont, sans-serif;
    font-size: 16px;
    font-weight: 400;
    line-height: 125%;
}

.fl-footer__legal a {
    color: #FFF;
    text-decoration: underline;
}

/* ============================ RESPONSIVE ============================ */
@media (max-width: 1024px) {
    .fl-why__cols { grid-template-columns: repeat(3, 1fr); }
    .fl-stats { grid-template-columns: repeat(2, 1fr); }

    /* Switch the hero nav to the mobile bar early to avoid the links
       compressing against the logo. */
    .fl-nav__links a:not(.fl-btn) { display: none; }
    .fl-nav__toggle { display: flex; }

    .fl-nav {
        background: #fff;
        padding: 16px 24px;
        gap: 14px;
    }
    .fl-nav .fl-logo { margin-right: auto; }
    .fl-nav .fl-logo__img--light { display: none; }
    .fl-nav .fl-logo__img--dark { display: block; }
    .fl-nav .fl-btn--white { background: #05F; color: #fff; }
}

@media (max-width: 860px) {
    .fl-hero__chip { width: 72px; height: 72px; }

    .fl-section { padding: 56px 0; }
    .fl-case__grid,
    .fl-contact__grid { grid-template-columns: 1fr; gap: 36px; }
    .fl-challenge__panel { padding: 40px 22px; border-width: 6px; }
    .fl-challenge__cards,
    .fl-industries__cards { grid-template-columns: 1fr; }
    .fl-why__cols { grid-template-columns: 1fr 1fr; }
    .fl-outcomes__row { flex-direction: column; gap: 16px; }

    /* ---- Typography scaling ---- */
    .fl-hero h1 { font-size: 30px; }
    .fl-hero__sub { font-size: 16px; }

    .fl-outcomes h2,
    .fl-challenge__panel h2,
    .fl-solutions h2,
    .fl-why h2,
    .fl-contact h2 { font-size: 30px; }
    .fl-industries h2 { font-size: 26px; }
    .fl-specialized h2 { font-size: 24px; }

    .fl-outcomes .fl-lede,
    .fl-solutions .fl-lede,
    .fl-why .fl-lede,
    .fl-contact .fl-lede,
    .fl-challenge__sub,
    .fl-industries .fl-lede,
    .fl-specialized p:not(.fl-eyebrow) { font-size: 16px; }

    /* Case study */
    .fl-case__body h3 { font-size: 24px; }
    .fl-case__block p { font-size: 17px; }
    .fl-stat__value { font-size: 34px; }
    .fl-stat__label { font-size: 16px; }

    /* Challenge / solution / industry / why cards */
    .fl-challenge__card h3 { font-size: 22px; }
    .fl-challenge__card p { font-size: 16px; }
    .fl-solution h3 { font-size: 22px; }
    .fl-solution__tagline { font-size: 16px; }
    .fl-solution__desc { font-size: 15px; }
    .fl-industry > p,
    .fl-industry .fl-pills li { font-size: 16px; }

    /* Footer */
    .fl-footer__tagline { font-size: 24px; }
    .fl-logo__img--footer { width: 260px; height: auto; }

    /* One solution card at a time, with the next peeking */
    .fl-solution { flex: 0 0 82%; }

    /* Hide decorative floating icons on mobile */
    .fl-solutions__bg,
    .fl-industries__bg { display: none; }

    /* Outcomes — center the icon (73x100) and the text */
    .fl-outcomes__row { align-items: center; text-align: center; }
    .fl-outcomes__icon { width: 73px; height: 100px; }

    /* Challenge — smaller card icons */
    .fl-challenge__card-icon { width: 37px; height: 50px; }

    /* Solutions — left-align the carousel pills */
    .fl-solution .fl-pills { justify-content: flex-start; }
    .fl-solution .fl-pills li { text-align: left; }

    /* Contact — no icon on mobile */
    .fl-contact__icon { display: none; }
}

@media (max-width: 540px) {
    .fl-stats { grid-template-columns: 1fr; gap: 24px; }
    .fl-why__cols { grid-template-columns: 1fr; }

    /* Keep logo + Let's Talk + hamburger/close from crowding on narrow phones */
    .fl-nav .fl-logo__img,
    .fl-sticky .fl-logo__img,
    .fl-mobile-menu .fl-logo__img { width: 150px; height: auto; }
    .fl-nav { padding: 14px 16px; gap: 10px; }
    .fl-sticky__inner { gap: 12px; }
    .fl-mobile-menu__actions { gap: 10px; }
    .fl-nav .fl-btn--white,
    .fl-sticky .fl-btn--white,
    .fl-mobile-menu__top .fl-btn--white { padding: 10px 16px; font-size: 15px; }

    /* Tighten headings further on the narrowest phones */
    .fl-hero h1 { font-size: 26px; }
    .fl-outcomes h2,
    .fl-challenge__panel h2,
    .fl-solutions h2,
    .fl-why h2,
    .fl-contact h2 { font-size: 26px; }
    .fl-industries h2 { font-size: 24px; }

    /* Thinner gradient borders read better at small sizes */
    .fl-challenge__panel,
    .fl-contact__card { border-width: 5px; }
    .fl-specialized { border-width: 6px; }

    /* Footer buttons — equal width when stacked */
    .fl-footer__actions { flex-direction: column; align-items: center; }
    .fl-footer__actions .fl-btn { width: 280px; max-width: 100%; }
}

@media (prefers-reduced-motion: reduce) {
    .fl-hero__chip { animation: none; }
    .fl-landing { scroll-behavior: auto; }
}