




/* =========================================================
   CORE
========================================================= */

#flosenso-ai-hero-v3,
#flosenso-ai-hero-v3 * {
    box-sizing: border-box;
}


#flosenso-ai-hero-v3 {

    --blue: #0686E8;
    --blue2: #31A6F7;
    --blueDark: #1858A6;
    --black: #272727;
    --green: #15803D;

    position: relative;

    width: 100%;
    height: 600px;

    overflow: hidden;

    background: #fff;

    font-family:
        "DM Sans",
        Arial,
        sans-serif;
}



#flosenso-ai-hero-v3 .fh-stage {

    position: absolute;

    width: 1400px;
    height: 600px;

    top: 0;
    left: 50%;

    transform:
        translateX(-50%)
        scale(var(--fh-scale, 1));

    transform-origin:
        top center;
}



/* =========================================================
   LEFT CONTENT
========================================================= */

#flosenso-ai-hero-v3 .fh-copy {

    position: absolute;

    z-index: 30;

    left: 100px;
    top: 50%;

    width: 510px;

    transform:
        translateY(-50%);

}



/* =========================================================
   INTRO STATES
========================================================= */

/*
Important fix:

Entrance now uses transitions instead of CSS `animation`.

This means the AI badge can have its own continuous
animations without overriding the entrance.
*/

#flosenso-ai-hero-v3 .fh-intro {

    opacity: 0;

    transform:
        translateY(24px);

    transition:

        opacity .75s
        cubic-bezier(.16,.84,.25,1),

        transform .75s
        cubic-bezier(.16,.84,.25,1);

}


#flosenso-ai-hero-v3 .fh-intro.fh-visible {

    opacity: 1;

    transform:
        translateY(0);

}



/* =========================================================
   AI BADGE
========================================================= */

#flosenso-ai-hero-v3 .fh-ai-badge {

    position: relative;

    display: inline-flex;

    align-items: center;

    gap: 8px;

    height: 47px;

    padding:
        0 16px 0 14px;

    overflow: hidden;

    border:
        1px solid rgba(6,134,232,.26);

    border-radius:
        12px;

    color:
        var(--blueDark);

    font-size:
        20px;

    font-weight:
        500;

    letter-spacing:
        .2px;

    isolation:
        isolate;

    box-shadow:
        0 4px 15px
        rgba(6,134,232,.08);

}


/*
Animated background exists on its own child,
NOT on the badge itself.
*/

#flosenso-ai-hero-v3 .fh-ai-badge-bg {

    position: absolute;

    inset: 0;

    z-index: -2;

    background:

        linear-gradient(
            115deg,
            #DDEEFF,
            #F6FBFF,
            #CFE8FF,
            #EDF7FF,
            #DDEEFF
        );

    background-size:
        280% 100%;

    animation:
        fhBadgeGradient
        5s
        ease-in-out
        infinite;

}



/* subtle breathing border */

#flosenso-ai-hero-v3 .fh-ai-badge::after {

    content: "";

    position: absolute;

    inset: 0;

    z-index: -1;

    border-radius:
        inherit;

    border:
        1px solid
        rgba(6,134,232,.28);

    animation:
        fhBadgeAura
        3.1s
        ease-in-out
        infinite;

}



/* shimmer */

#flosenso-ai-hero-v3 .fh-ai-sheen {

    position: absolute;

    top: -40%;

    left: -70px;

    width: 42px;
    height: 180%;

    opacity: 0;

    transform:
        skewX(-23deg);

    background:

        linear-gradient(
            90deg,
            transparent,
            rgba(255,255,255,.9),
            transparent
        );

    animation:
        fhBadgeSweep
        4s
        ease-in-out
        1.3s
        infinite;

}



/* icon */

#flosenso-ai-hero-v3 .fh-ai-icon {

    position: relative;

    z-index: 2;

    display: grid;

    place-items: center;

    width: 25px;
    height: 25px;

}


#flosenso-ai-hero-v3 .fh-ai-icon svg {

    width: 25px;
    height: 25px;

    overflow: visible;

    fill: none;

    stroke:
        currentColor;

    stroke-width:
        1.4;

    stroke-linejoin:
        round;

}


#flosenso-ai-hero-v3 .fh-ai-star-one {

    transform-box:
        fill-box;

    transform-origin:
        center;

    animation:
        fhSparkOne
        2.5s
        ease-in-out
        infinite;

}


#flosenso-ai-hero-v3 .fh-ai-star-two {

    transform-box:
        fill-box;

    transform-origin:
        center;

    animation:
        fhSparkTwo
        2.5s
        ease-in-out
        .55s
        infinite;

}


#flosenso-ai-hero-v3 .fh-ai-text {

    position: relative;

    z-index: 2;

}



/* live pulse */

#flosenso-ai-hero-v3 .fh-ai-dot {

    position: relative;

    z-index: 2;

    width: 6px;
    height: 6px;

    margin-left: 1px;

    border-radius: 50%;

    background:
        var(--blue);

    animation:
        fhLivePulse
        2s
        ease-out
        infinite;

}



/* =========================================================
   HEADLINE
========================================================= */

#flosenso-ai-hero-v3 .fh-heading {

    margin:
        8px 0 0;

    color:
        var(--black);

    font-size:
        62.8px;

    line-height:
        1.15;

    font-weight:
        600;

    letter-spacing:
        .1px;

}


#flosenso-ai-hero-v3 .fh-line {

    display: block;

}


#flosenso-ai-hero-v3 .fh-blue {

    color:
        var(--blue);

}



/* =========================================================
   DESCRIPTION
========================================================= */

#flosenso-ai-hero-v3 .fh-description {

    width: 410px;

    margin:
        13px 0 0;

    color:
        var(--black);

    font-size:
        24px;

    line-height:
        1.29;

    letter-spacing:
        .3px;

}


#flosenso-ai-hero-v3 .fh-description span {

    font-weight: 500;

}



/* =========================================================
   CTA
========================================================= */

#flosenso-ai-hero-v3 .fh-buy {

    display: inline-flex;

    align-items: center;

    gap: 7px;

    margin-top: 32px;

    padding:
        12px 31px;

    border-radius: 12px;

    background:

        linear-gradient(
            135deg,
            #0686E8,
            #1397F5
        );

    color:
        #fff !important;

    text-decoration:
        none !important;

    font-size: 24px;

    font-weight: 600;

    box-shadow:
        0 8px 22px
        rgba(6,134,232,.16);

}


#flosenso-ai-hero-v3 .fh-buy:hover {

    box-shadow:
        0 14px 30px
        rgba(6,134,232,.28);

}


#flosenso-ai-hero-v3 .fh-buy-arrow {

    display: inline-block;

    transition:
        transform .25s ease;

}


#flosenso-ai-hero-v3 .fh-buy:hover
#flosenso-ai-hero-v3 .fh-buy-arrow {

    transform:
        translateX(4px);

}



/* =========================================================
   RIGHT VISUAL
========================================================= */

#flosenso-ai-hero-v3 .fh-visual {

    position: absolute;

    left: 600px;
    top: 0;

    width: 800px;
    height: 600px;

}



/* =========================================================
   DEVICE GLOW
========================================================= */

#flosenso-ai-hero-v3 .fh-device-glow {

    position: absolute;

    left: 165px;
    top: 78px;

    width: 480px;
    height: 480px;

    border-radius: 50%;

    opacity: 0;

    transform:
        scale(.75);

    background:

        radial-gradient(
            circle,
            rgba(6,134,232,.20),
            rgba(6,134,232,.07) 39%,
            transparent 70%
        );

    transition:

        opacity 1.2s ease,
        transform 1.25s ease;

}


#flosenso-ai-hero-v3 .fh-device-glow.fh-visible {

    opacity: 1;

    transform:
        scale(1);

}



/* =========================================================
   ORBITS
========================================================= */

#flosenso-ai-hero-v3 .fh-orbits {

    position: absolute;

    inset: 0;

    z-index: 1;

    width: 800px;
    height: 600px;

}


#flosenso-ai-hero-v3 .fh-orbit {

    fill: none;

    stroke:
        rgba(6,134,232,.20);

    stroke-width: 2;

    stroke-dasharray:
        1800;

    stroke-dashoffset:
        1800;

}


#flosenso-ai-hero-v3 .fh-orbit-two {

    stroke:
        rgba(6,134,232,.095);

    stroke-width:
        1.4;

}


#flosenso-ai-hero-v3 .fh-orbit.fh-draw {

    animation:
        fhOrbitDraw
        1.5s
        cubic-bezier(.25,.7,.2,1)
        forwards;

}


#flosenso-ai-hero-v3.fh-hero.fh-diagnostics-running
#flosenso-ai-hero-v3 .fh-orbit {

    stroke-dashoffset:
        0;

}


#flosenso-ai-hero-v3.fh-hero.fh-diagnostics-running
#flosenso-ai-hero-v3 .fh-orbit-one {

    animation:
        fhOrbitBreathe
        5.3s
        ease-in-out
        infinite;

}


#flosenso-ai-hero-v3.fh-hero.fh-diagnostics-running
#flosenso-ai-hero-v3 .fh-orbit-two {

    animation:
        fhOrbitBreathe
        5.3s
        ease-in-out
        .8s
        infinite;

}




/* Full-width atmosphere; composition is independently centered. */
#flosenso-ai-hero-v3 {
  background: radial-gradient(ellipse at 72% 48%,rgba(6,134,232,.14),transparent 62%),linear-gradient(180deg,#fff 25%,#f5fbff 52%,#e5f4ff 76%,#d4ecfb);
  isolation:isolate;
}
#flosenso-ai-hero-v3::before {content:"";position:absolute;inset:0;pointer-events:none;opacity:.45;background-image:linear-gradient(rgba(6,134,232,.027) 1px,transparent 1px),linear-gradient(90deg,rgba(6,134,232,.027) 1px,transparent 1px);background-size:54px 54px;mask-image:linear-gradient(90deg,transparent 25%,#000 100%)}
#flosenso-ai-hero-v3 .fh-stage {z-index:1}
#flosenso-ai-hero-v3 .fh-visual {z-index:2}
#flosenso-ai-hero-v3 .fh-product-wrap {position:absolute;z-index:10;left:88px;top:92px;width:613px;height:508px;opacity:0;transform:translateY(28px) scale(.96);transition:opacity 1s ease,transform 1s ease}
#flosenso-ai-hero-v3 .fh-product-wrap.fh-visible {opacity:1;transform:none}
#flosenso-ai-hero-v3 .fh-product {display:block;width:100%;height:100%;object-fit:contain}
#flosenso-ai-hero-v3 .fh-main-health,#flosenso-ai-hero-v3 .fh-card {background:rgba(255,255,255,.88);backdrop-filter:blur(9px);border:1px solid rgba(6,134,232,.16);box-shadow:0 3px 14px rgba(20,55,80,.12);border-radius:7px}
#flosenso-ai-hero-v3 .fh-main-health {position:absolute;z-index:45;left:292px;top:38px;width:215px;height:108px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:5px;border-color:rgba(6,134,232,.45);opacity:0;transform:scale(.95);transition:opacity .6s ease,transform .7s ease}
#flosenso-ai-hero-v3 .fh-main-health.fh-visible {opacity:1;transform:scale(1)}
#flosenso-ai-hero-v3 .fh-health-logo {position:relative;width:34px;height:30px}
#flosenso-ai-hero-v3 .fh-main-health:not(.fh-complete) .fh-health-logo {animation:fhHealthLogoBreathe 1.8s ease-in-out infinite}
#flosenso-ai-hero-v3 .fh-main-title {font-size:20px;font-weight:600;color:var(--black);line-height:1.25}
#flosenso-ai-hero-v3 .fh-main-state {display:flex;align-items:center;gap:5px;font-size:10px;font-weight:700;color:var(--blueDark);height:16px}
#flosenso-ai-hero-v3 .fh-main-loader,#flosenso-ai-hero-v3 .fh-spinner {display:block;width:15px;height:15px;border:2px solid rgba(6,134,232,.22);border-top-color:var(--blue);border-radius:50%;animation:fhSpin .8s linear infinite}
#flosenso-ai-hero-v3 .fh-main-loader {width:10px;height:10px;border-width:1.6px}
#flosenso-ai-hero-v3 .fh-main-check,#flosenso-ai-hero-v3 .fh-success {display:none;color:var(--green);font-weight:700}
#flosenso-ai-hero-v3 .fh-complete .fh-main-loader,#flosenso-ai-hero-v3 .fh-resolved .fh-spinner {display:none}
#flosenso-ai-hero-v3 .fh-complete .fh-main-check,#flosenso-ai-hero-v3 .fh-resolved .fh-success {display:block;animation:fhCheckPop .35s ease}
#flosenso-ai-hero-v3 .fh-complete .fh-main-text,#flosenso-ai-hero-v3 .fh-resolved .fh-card-status {color:var(--green)}
#flosenso-ai-hero-v3 .fh-card {position:absolute;z-index:35;display:flex;align-items:flex-start;gap:7px;padding:10px 12px;opacity:0;transform:translateY(12px) scale(.97);transition:opacity .6s ease,transform .6s ease;white-space:nowrap}
#flosenso-ai-hero-v3 .fh-card.fh-visible {opacity:1;transform:none}
#flosenso-ai-hero-v3 .fh-card-icon {width:16px;min-width:16px;height:18px;display:grid;place-items:center}
#flosenso-ai-hero-v3 .fh-card-copy {display:flex;flex-direction:column;gap:4px}
#flosenso-ai-hero-v3 .fh-card-copy strong {font-size:12px;line-height:1.25;font-weight:600;color:var(--black)}
#flosenso-ai-hero-v3 .fh-card-status {font-size:10px;line-height:1.3;font-weight:600;color:var(--blueDark)}
#flosenso-ai-hero-v3 .fh-controller-connectivity {left:42px;top:119px}
#flosenso-ai-hero-v3 .fh-controller-health {left:18px;top:238px}
#flosenso-ai-hero-v3 .fh-device {left:54px;top:361px}
#flosenso-ai-hero-v3 .fh-sensor-connectivity {left:535px;top:117px}
#flosenso-ai-hero-v3 .fh-sensor-health {left:604px;top:238px}
#flosenso-ai-hero-v3 .fh-wifi {left:613px;top:363px;min-width:125px}
#flosenso-ai-hero-v3 .fh-wifi strong {white-space:nowrap}
#flosenso-ai-hero-v3 .fh-orbit-light {position:absolute;z-index:4;width:7px;height:7px;border-radius:50%;background:var(--blue);box-shadow:0 0 16px rgba(6,134,232,.5);opacity:.5;animation:fhOrbitBreathe 4s ease-in-out infinite}
#flosenso-ai-hero-v3 .fh-light-one {left:158px;top:207px}
#flosenso-ai-hero-v3 .fh-light-two {left:617px;top:440px}
#flosenso-ai-hero-v3 a:focus-visible,#flosenso-ai-hero-v3 button:focus-visible {outline:3px solid var(--blueDark);outline-offset:4px}
#flosenso-ai-hero-v3.fh-paused *,#flosenso-ai-hero-v3.fh-paused *::after {animation-play-state:paused!important}
@keyframes fhSpin {to{transform:rotate(360deg)}}
@keyframes fhCheckPop {0%{transform:scale(.7)}60%{transform:scale(1.15)}100%{transform:scale(1)}}
@keyframes fhHealthLogoBreathe {50%{transform:scale(1.06);filter:drop-shadow(0 0 6px rgba(6,134,232,.24))}}
@keyframes fhBadgeGradient {50%{background-position:100% 50%}}
@keyframes fhBadgeAura {50%{opacity:.3}}
@keyframes fhBadgeSweep {0%,65%{left:-70px;opacity:0}72%{opacity:.7}95%,100%{left:110%;opacity:0}}
@keyframes fhSparkOne {50%{transform:scale(1.12) rotate(8deg);opacity:.7}}
@keyframes fhSparkTwo {50%{transform:scale(.8) rotate(-12deg);opacity:.55}}
@keyframes fhLivePulse {0%{box-shadow:0 0 0 0 rgba(6,134,232,.3)}100%{box-shadow:0 0 0 7px rgba(6,134,232,0)}}
@keyframes fhOrbitDraw {to{stroke-dashoffset:0}}
@keyframes fhOrbitBreathe {50%{opacity:.4}}
/* Visible fallback when inline scripts are disabled. */
#flosenso-ai-hero-v3:not(.fh-enhanced) .fh-intro,#flosenso-ai-hero-v3:not(.fh-enhanced) .fh-card,#flosenso-ai-hero-v3:not(.fh-enhanced) .fh-main-health,#flosenso-ai-hero-v3:not(.fh-enhanced) .fh-product-wrap {opacity:1;transform:none}
/* Layout responds to the Elementor widget width, including boxed parents. */
#flosenso-ai-hero-v3 {container:fhHero / inline-size;height:auto;min-height:0;width:100%;font-weight:400;line-height:1.5}
#flosenso-ai-hero-v3 .fh-stage {position:relative;inset:auto;width:100%;max-width:1400px;height:auto;min-height:600px;margin:0 auto;padding:32px 48px 48px;display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1.35fr);align-items:center;gap:20px;transform:none}
#flosenso-ai-hero-v3 .fh-copy {position:relative;inset:auto;width:100%;min-width:0;transform:none}
#flosenso-ai-hero-v3 .fh-heading {font-size:clamp(40px,4.45cqi,62.8px);line-height:1.12;overflow-wrap:normal}
#flosenso-ai-hero-v3 .fh-description {width:100%;font-size:clamp(20px,1.72cqi,24px);line-height:1.4}
#flosenso-ai-hero-v3 .fh-ai-badge {max-width:100%;font-size:clamp(16px,1.43cqi,20px);height:auto;min-height:45px;padding:9px 14px;line-height:1.3}
#flosenso-ai-hero-v3 .fh-ai-icon,#flosenso-ai-hero-v3 .fh-ai-dot {flex-shrink:0}
#flosenso-ai-hero-v3 .fh-ai-text {white-space:nowrap}
#flosenso-ai-hero-v3 .fh-buy {font-size:22px;margin-top:28px;min-height:48px}
#flosenso-ai-hero-v3 .fh-visual {position:relative;inset:auto;width:100%;min-width:0;height:auto;aspect-ratio:4 / 3}
#flosenso-ai-hero-v3 .fh-product-wrap {left:11%;top:15.33%;width:76.625%;height:84.67%}
#flosenso-ai-hero-v3 .fh-main-health {left:calc(50% - 107.5px);top:3%;margin:0}
#flosenso-ai-hero-v3 .fh-card {padding:10px 12px;min-height:56px;max-width:45%;white-space:normal}
#flosenso-ai-hero-v3 .fh-card-copy {min-width:0}
#flosenso-ai-hero-v3 .fh-card-copy strong {font-size:13px;line-height:1.3}
#flosenso-ai-hero-v3 .fh-card-status {font-size:12px;line-height:1.35}
#flosenso-ai-hero-v3 .fh-main-state {font-size:12px;height:18px}
#flosenso-ai-hero-v3 .fh-controller-connectivity {left:2%;top:24%}
#flosenso-ai-hero-v3 .fh-controller-health {left:0;top:46%}
#flosenso-ai-hero-v3 .fh-device {left:4%;top:69%}
#flosenso-ai-hero-v3 .fh-sensor-connectivity {left:auto;right:2%;top:24%}
#flosenso-ai-hero-v3 .fh-sensor-health {left:auto;right:0;top:46%}
#flosenso-ai-hero-v3 .fh-wifi {left:auto;right:3%;top:69%;min-width:0}
#flosenso-ai-hero-v3 .fh-orbits {width:100%;height:100%}
#flosenso-ai-hero-v3 .fh-device-glow {left:20%;top:13%;width:60%;height:80%}
#flosenso-ai-hero-v3 .fh-light-one {left:19.75%;top:34.5%}
#flosenso-ai-hero-v3 .fh-light-two {left:77.12%;top:73.33%}
@container fhHero (max-width:1100px) {
  #flosenso-ai-hero-v3 .fh-stage {grid-template-columns:minmax(0,1fr);gap:28px;padding:40px 32px 52px;min-height:0;max-width:820px}
  #flosenso-ai-hero-v3 .fh-copy {max-width:680px;margin:0 auto}
  #flosenso-ai-hero-v3 .fh-heading {font-size:clamp(38px,6.2cqi,58px)}
  #flosenso-ai-hero-v3 .fh-description {font-size:22px}
  #flosenso-ai-hero-v3 .fh-ai-badge {font-size:19px}
  #flosenso-ai-hero-v3 .fh-visual {max-width:760px;margin:0 auto}
}
@container fhHero (max-width:600px) {
  #flosenso-ai-hero-v3 .fh-stage {padding:28px 16px 56px;gap:26px}
  #flosenso-ai-hero-v3 .fh-heading {font-size:clamp(30px,8.4cqi,46px);margin-top:14px;letter-spacing:-.3px}
  #flosenso-ai-hero-v3 .fh-description {font-size:18px;letter-spacing:0;margin-top:14px}
  #flosenso-ai-hero-v3 .fh-description br {display:none}
  #flosenso-ai-hero-v3 .fh-description span {display:block}
  #flosenso-ai-hero-v3 .fh-ai-badge {font-size:16px;min-height:42px;padding:8px 10px;gap:6px}
  #flosenso-ai-hero-v3 .fh-buy {font-size:20px;margin-top:22px;padding:12px 26px}
  #flosenso-ai-hero-v3 .fh-visual {aspect-ratio:auto;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;align-items:stretch}
  #flosenso-ai-hero-v3 .fh-main-health {position:relative;inset:auto;grid-column:1 / -1;grid-row:1;justify-self:center;margin:0}
  #flosenso-ai-hero-v3 .fh-product-wrap {position:relative;inset:auto;grid-column:1 / -1;grid-row:2;justify-self:center;width:100%;max-width:400px;height:auto;aspect-ratio:613 / 508;transform:scale(.96)}
  #flosenso-ai-hero-v3 .fh-product-wrap.fh-visible,#flosenso-ai-hero-v3:not(.fh-enhanced) .fh-product-wrap {transform:none}
  #flosenso-ai-hero-v3 .fh-card {position:relative;inset:auto;width:100%;max-width:none;min-width:0;min-height:74px;padding:11px 8px;gap:6px}
  #flosenso-ai-hero-v3 .fh-card-copy strong {font-size:13px}
  #flosenso-ai-hero-v3 .fh-card-icon {width:15px;min-width:15px}
  #flosenso-ai-hero-v3 .fh-orbits {top:118px;height:auto;aspect-ratio:613 / 508}
  #flosenso-ai-hero-v3 .fh-device-glow {left:0;top:118px;width:100%;height:auto;aspect-ratio:613 / 508}
  #flosenso-ai-hero-v3 .fh-orbit-light {display:none}
}
@media(prefers-reduced-motion:reduce) {
  #flosenso-ai-hero-v3 *,#flosenso-ai-hero-v3 *::after {animation:none!important;transition:none!important}
  #flosenso-ai-hero-v3 .fh-orbit {stroke-dashoffset:0}
}

/* The official mnemonic keeps its original proportions; no recreated logo shapes. */
#flosenso-ai-hero-v3 .fh-health-logo {width:34px;height:34px;display:grid;place-items:center;flex-shrink:0}
#flosenso-ai-hero-v3 .fh-brand-logo {display:block;width:34px;height:34px;object-fit:contain;margin:0;padding:0;border:0}
#flosenso-ai-hero-v3 .fh-main-health {gap:6px;text-align:center}
#flosenso-ai-hero-v3 .fh-main-state {justify-content:center;white-space:nowrap}
@container fhHero (max-width:600px) {
  #flosenso-ai-hero-v3 .fh-main-health {width:215px;height:112px;justify-self:center}
  #flosenso-ai-hero-v3 .fh-product-wrap {margin:0 auto;max-width:440px}
  #flosenso-ai-hero-v3 .fh-product {object-position:center center}
}
@container fhHero (max-width:1100px) {
  #flosenso-ai-hero-v3 .fh-copy {text-align:center}
  #flosenso-ai-hero-v3 .fh-heading,#flosenso-ai-hero-v3 .fh-description {text-align:center}
  #flosenso-ai-hero-v3 .fh-description {margin-left:auto;margin-right:auto}
}

/* Reference check icons: blue squares on diagnostic cards, green circle on summary. */
#flosenso-ai-hero-v3 .fh-card-icon {width:24px;min-width:24px;height:24px;align-self:center}
#flosenso-ai-hero-v3 .fh-success {width:24px;height:24px;background:#329EF0;color:#fff;border-radius:2px;line-height:0}
#flosenso-ai-hero-v3 .fh-success svg {display:block;width:24px;height:24px}
#flosenso-ai-hero-v3 .fh-main-check {width:12px;height:12px;background:var(--green);color:#fff;border-radius:50%;line-height:0}
#flosenso-ai-hero-v3 .fh-main-check svg {display:block;width:12px;height:12px}

/* Keep the summary above the diagnostic rows at intermediate desktop widths. */
#flosenso-ai-hero-v3 .fh-visual {min-height:560px}
#flosenso-ai-hero-v3 .fh-controller-connectivity,#flosenso-ai-hero-v3 .fh-sensor-connectivity {top:max(150px,26%)}
#flosenso-ai-hero-v3 .fh-controller-health,#flosenso-ai-hero-v3 .fh-sensor-health {top:49%}
#flosenso-ai-hero-v3 .fh-device,#flosenso-ai-hero-v3 .fh-wifi {top:72%}
@container fhHero (max-width:1100px) {
  #flosenso-ai-hero-v3 .fh-stage {padding-bottom:32px}
}
@container fhHero (max-width:600px) {
  #flosenso-ai-hero-v3 .fh-stage {padding:28px 16px 28px}
  #flosenso-ai-hero-v3 .fh-visual {min-height:0;gap:12px}
  #flosenso-ai-hero-v3 .fh-card {inset:auto;align-items:center;min-height:74px;padding:12px 10px;gap:8px}
  #flosenso-ai-hero-v3 .fh-card-copy strong {overflow-wrap:normal;word-break:normal}
  #flosenso-ai-hero-v3 .fh-wifi .fh-card-copy strong {white-space:nowrap}
}
@container fhHero (max-width:400px) {
  #flosenso-ai-hero-v3 .fh-visual {grid-template-columns:minmax(0,1fr);gap:10px}
  #flosenso-ai-hero-v3 .fh-card {min-height:62px;padding:12px 16px;gap:12px}
  #flosenso-ai-hero-v3 .fh-card-copy strong {font-size:14px}
  #flosenso-ai-hero-v3 .fh-card-status {font-size:12px}
}
