/* FITROAI — matched CSS + JS, all screens, two responsive cards, no nested scrolling. */
/* ================================================================
   FITROAI INTELLIGENCE — COMPLETE STYLESHEET
   Brand: steel blue / ice blue / slate / navy
   Left: Three.js robot | Right: FitroAI content
   Sticky robot zoom -> full-screen reveal -> next section
   Replace the previous fitroAI.css; do not append it.
================================================================ */

.fitro-ai-section {
  --scan-accent: #4268A5;
  --scan-ice: #A9DDFC;
  --scan-muted: #64748B;
  --ai-navy: #0B1A30;
  --ai-ink: #162A45;
  --ai-surface: #F5F9FD;
  --ai-line: #DCE8F3;
  --ai-white: #FFFFFF;
  position: relative;
  width: 100%;
  height: 320vh;
  padding: 0;
  isolation: isolate;
  background: var(--ai-surface);
  color: var(--ai-ink);
  overflow: clip;
  font-family: "Inter", Arial, sans-serif;
}
.fitro-ai-section *, .fitro-ai-section *::before, .fitro-ai-section *::after { box-sizing: border-box; }
.fitro-ai-section button, .fitro-ai-section a { -webkit-tap-highlight-color: transparent; }

/* Pinned scene occupies only this chapter of the page */

.fitro-ai-sticky {
    position: sticky;
    top: 0;
    width: 100%;
    height: 100vh;
    height: 100svh;
    overflow: hidden;
    isolation: isolate;

    background-image: url("../images/fitro/features/FitroAiBG.png");
    background-position: center center;
    background-size: cover;
    background-repeat: no-repeat;
}
/*.fitro-ai-sticky::before {*/
/*  content: "";*/
/*  position: absolute;*/
/*  inset: 0;*/
/*  z-index: 0;*/
/*  opacity: .42;*/
/*  pointer-events: none;*/
/*  background-image: linear-gradient(rgba(66,104,165,.045) 1px,transparent 1px),linear-gradient(90deg,rgba(66,104,165,.045) 1px,transparent 1px);*/
/*  background-size: 76px 76px;*/
/*  mask-image: linear-gradient(90deg,#000,transparent 85%);*/
/*}*/
/*.fitro-ai-ambient {*/
/*  position: absolute;*/
/*  inset: 0;*/
/*  z-index: 0;*/
/*  pointer-events: none;*/
/*  background: radial-gradient(ellipse 45% 60% at 27% 47%,rgba(169,221,252,.44),transparent 78%),radial-gradient(ellipse 32% 52% at 93% 25%,rgba(66,104,165,.065),transparent 80%);*/
/*}*/

/* The actual WebGL canvas is viewport-sized during the sticky animation. */
.fitro-ai-section .fitro-ai-robot-scene,
.fitro-ai-section #fitroAiRobotCanvas {
  position: absolute;
  inset: 0;
  z-index: 1;
  width: 100%;
  height: 100%;
  display: block;
  pointer-events: none;
  touch-action: auto;
}
.fitro-ai-section .fitro-ai-robot-scene canvas,
.fitro-ai-section #fitroAiRobotCanvas canvas { display: block; width: 100% !important; height: 100% !important; }
.fitro-ai-section .fitro-ai-robot-visual {
  position: relative;
  grid-column: 1;
  grid-row: 1;
  min-width: 0;
  min-height: 1px;
}
.fitro-ai-robot-glow {
  position: absolute;
  z-index: 0;
  inset: 14% 5%;
  background: radial-gradient(ellipse,rgba(169,221,252,.45),transparent 70%);
  filter: blur(32px);
  pointer-events: none;
}
.fitro-ai-robot-fallback { display: none; position: absolute; inset: 0; align-items: center; justify-content: center; color: var(--scan-accent); font-size: 22px; text-align: center; }
.fitro-ai-section.is-fallback .fitro-ai-robot-fallback,
.fitro-ai-robot-visual.is-fallback .fitro-ai-robot-fallback { display: flex; }
.fitro-ai-robot-status {
  position: absolute;
  bottom: 44px;
  left: 21%;
  z-index: 2;
  display: inline-flex;
  align-items: center;
  gap: 10px;
  color: var(--scan-muted);
  font-size: 10px;
  font-weight: 700;
  letter-spacing: .16em;
  white-space: nowrap;
  pointer-events: none;
}
.fitro-ai-robot-status-dot {
  width: 7px;
  height: 7px;
  border-radius: 50%;
  background: var(--scan-accent);
  box-shadow: 0 0 0 5px rgba(66,104,165,.11);
  animation: fitroAiPulse 2.4s ease-in-out infinite;
}
@keyframes fitroAiPulse { 50% { opacity: .52; transform: scale(.83); } }

/* Foreground editorial two-column layout */
.fitro-ai-section .fitro-ai-container {
  position: relative;
  padding-top:70px;
  z-index: 2;
  display: grid;
  grid-template-columns: minmax(0,1.06fr) minmax(0,.94fr);
  align-items: center;
  gap: 0;
  width: min(1340px,calc(100% - 100px));
  max-width: 1340px;
  height: 100%;
  margin: 0 auto;
  pointer-events: none;
}
.fitro-ai-section .fitro-ai-model-space { grid-column: 1; grid-row: 1; min-height: 1px; }
.fitro-ai-section .fitro-ai-copy {
  position: relative;
  grid-column: 2;
  grid-row: 1;
  min-width: 0;
  max-width: 560px;
  pointer-events: auto;
  will-change: opacity, transform;
}
.fitro-ai-eyebrow {
  display: inline-flex;
  align-items: center;
  gap: 11px;
  margin-bottom: 22px;
  color: var(--scan-accent);
  font: 700 11px/1.3 "Inter",Arial,sans-serif;
  letter-spacing: .19em;
  text-transform: uppercase;
}
.fitro-ai-eyebrow::before, .fitro-ai-pulse {
  content: "";
  width: 8px;
  height: 8px;
  flex: 0 0 8px;
  border-radius: 50%;
  background: var(--scan-accent);
  box-shadow: 0 0 0 5px rgba(66,104,165,.11);
}
/* Avoid a duplicated dot if the Blade already includes .fitro-ai-pulse */
.fitro-ai-eyebrow:has(.fitro-ai-pulse)::before { display: none; }
.fitro-ai-copy h2 {
  margin: 0 0 24px;
  color: var(--ai-ink);
  font-family: "Cormorant Garamond",Georgia,"Times New Roman",serif;
  font-size: clamp(60px,5.35vw,91px);
  font-weight: 600;
  line-height: .94;
  letter-spacing: -.046em;
}
.fitro-ai-copy h2 em { color: var(--scan-accent); font-style: normal; }
.fitro-ai-description {
  max-width: 490px;
  margin: 0;
  color: var(--scan-muted);
  font: 400 15px/1.85 "Inter",Arial,sans-serif;
}

/* Functional feature tabs */
.fitro-ai-selector { display: flex; flex-wrap: wrap; gap: 9px; margin-top: 30px; }
.fitro-ai-tab {
  min-height: 40px;
  padding: 0 16px;
  border: 1px solid #C9D9E9;
  border-radius: 999px;
  background: rgba(255,255,255,.78);
  color: #48617D;
  font: 600 12px/1.2 "Inter",Arial,sans-serif;
  cursor: pointer;
  transition: background .24s ease, color .24s ease, border-color .24s ease, transform .24s ease, box-shadow .24s ease;
}
.fitro-ai-tab:hover { transform: translateY(-2px); border-color: var(--scan-accent); }
.fitro-ai-tab.active, .fitro-ai-tab[aria-pressed="true"] {
  background: var(--scan-accent);
  border-color: var(--scan-accent);
  color: #fff;
  box-shadow: 0 9px 22px rgba(66,104,165,.15);
}
.fitro-ai-tab:focus-visible, .fitro-ai-cta:focus-visible, .fitro-ai-reveal-cta:focus-visible { outline: 3px solid var(--scan-accent); outline-offset: 4px; }

/* Compact, editorial insight with a brand-rule instead of a floating card */
.fitro-ai-insight {
  min-height: 133px;
  margin-top: 27px;
  padding: 3px 0 3px 20px;
  border-left: 2px solid var(--scan-ice);
}
.fitro-ai-insight-label { display: block; color: var(--scan-accent); font: 700 10px/1.5 "Inter",Arial,sans-serif; letter-spacing: .17em; }
.fitro-ai-insight h3 { margin: 9px 0 7px; color: #1B3454; font: 600 clamp(18px,1.65vw,23px)/1.3 "Inter",Arial,sans-serif; letter-spacing: -.025em; }
.fitro-ai-insight p { max-width: 470px; margin: 0; color: var(--scan-muted); font: 400 13px/1.75 "Inter",Arial,sans-serif; }
.fitro-ai-cta {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 27px;
  min-height: 50px;
  margin-top: 25px;
  padding: 0 24px;
  border-radius: 999px;
  background: var(--scan-accent);
  color: #fff !important;
  font: 650 12px/1 "Inter",Arial,sans-serif;
  text-decoration: none;
  box-shadow: 0 12px 25px rgba(66,104,165,.19);
  transition: transform .25s ease, background .25s ease, box-shadow .25s ease;
}
.fitro-ai-cta:hover { transform: translateY(-2px); background: #31568F; box-shadow: 0 16px 30px rgba(66,104,165,.23); }
.fitro-ai-scroll-cue {
  position: absolute;
  bottom: 23px;
  left: 50%;
  z-index: 3;
  display: flex;
  align-items: center;
  gap: 12px;
  transform: translateX(-50%);
  color: #607B99;
  font: 700 10px/1.2 "Inter",Arial,sans-serif;
  letter-spacing: .17em;
  text-transform: uppercase;
  white-space: nowrap;
  pointer-events: none;
}
.fitro-ai-scroll-cue span { font-size: 18px; font-weight: 400; }

/* Full-screen scene revealed once the robot display fills the viewport */
.fitro-ai-reveal {
  position: absolute;
  inset: 0;
  z-index: 4;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 36px 24px;
  background: radial-gradient(ellipse 55% 60% at 50% 35%,#163354 0%,#0B1A30 82%);
  color: #fff;
  text-align: center;
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
  will-change: opacity;
}
.fitro-ai-reveal.is-active { visibility: visible; pointer-events: auto; }
.fitro-ai-reveal-inner { width: min(760px,100%); transform: translateY(32px); will-change: transform; }
.fitro-ai-reveal-label { display: block; color: var(--scan-ice); font: 700 11px/1.4 "Inter",Arial,sans-serif; letter-spacing: .23em; text-transform: uppercase; }
.fitro-ai-reveal h2 { margin: 20px 0 18px; color: #fff; font: 600 clamp(52px,6.4vw,99px)/.98 "Cormorant Garamond",Georgia,serif; letter-spacing: -.045em; }
.fitro-ai-reveal h2 em { color: var(--scan-ice); font-style: normal; }
.fitro-ai-reveal p { max-width: 590px; margin: 0 auto 29px; color: #BDCBDB; font: 400 clamp(14px,1.2vw,17px)/1.85 "Inter",Arial,sans-serif; }
.fitro-ai-reveal-cta {
  display: inline-flex;
  align-items: center;
  gap: 24px;
  min-height: 51px;
  padding: 0 25px;
  border-radius: 999px;
  background: var(--scan-ice);
  color: #13304F !important;
  font: 700 12px/1 "Inter",Arial,sans-serif;
  text-decoration: none;
  transition: background .2s ease, transform .2s ease;
}
.fitro-ai-reveal-cta:hover { background: #D4ECFC; transform: translateY(-2px); }

/* The next normal-flow section after the pinned sequence */
.fitro-ai-next {
  position: relative;
  z-index: 1;
  padding: clamp(85px,9vw,135px) max(24px,5vw) clamp(95px,10vw,145px);
  background: #0B1A30;
  color: #fff;
  font-family: "Inter",Arial,sans-serif;
}
.fitro-ai-next-inner { width: min(1220px,100%); margin: 0 auto; }
.fitro-ai-next h2 { max-width: 800px; margin: 16px 0 47px; color: #fff; font: 600 clamp(49px,5vw,76px)/1.02 "Cormorant Garamond",Georgia,serif; letter-spacing: -.035em; }
.fitro-ai-next-grid { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 17px; }
.fitro-ai-next-grid > div {
  min-width: 0;
  padding: clamp(24px,3vw,34px);
  border: 1px solid rgba(169,221,252,.17);
  border-radius: 19px;
  background: linear-gradient(145deg,rgba(169,221,252,.075),rgba(255,255,255,.025));
  transition: transform .3s ease, border-color .3s ease, background .3s ease;
}
.fitro-ai-next-grid > div:hover { transform: translateY(-5px); border-color: rgba(169,221,252,.37); background: rgba(169,221,252,.09); }
.fitro-ai-next-grid span { color: var(--scan-ice, #A9DDFC); font: 700 10px/1.4 "Inter",Arial,sans-serif; letter-spacing: .16em; }
.fitro-ai-next-grid h3 { margin: 23px 0 12px; color: #F2F7FD; font: 600 21px/1.25 "Inter",Arial,sans-serif; }
.fitro-ai-next-grid p { margin: 0; color: #AEBFD1; font: 400 14px/1.8 "Inter",Arial,sans-serif; }



/* =====================================================
   FITROAI — FLOATING AI INSIGHT CARD
   Above the 3D robot
===================================================== */

.fitro-ai-floating-card {
    position: absolute;
    z-index: 3;
    top: clamp(90px, 12vh, 135px);
    left: 28%;
    width: min(305px, 30vw);
    padding: 12px 22px;
    border: 1px solid rgba(255,255,255,.92);
    border-radius: 20px;
    background: rgba(245, 250, 255, .82);
    -webkit-backdrop-filter: blur(20px);
    backdrop-filter: blur(20px);
    box-shadow: 0 16px 42px rgba(42,76,130,.15), inset 0 1px 0 rgba(255,255,255,.8);
    pointer-events: none;
    animation: fitroAiCardFloat 5s ease-in-out infinite;
}

.fitro-ai-float-header {
    display: flex;
    align-items: center;
    gap: 11px;
}

.fitro-ai-float-icon {
    width: 38px;
    height: 38px;
    flex-shrink: 0;

    display: grid;
    place-items: center;

    border-radius: 12px;

    background: #4268A5;
    color: #fff;

    font-size: 23px;
}

.fitro-ai-float-heading {
    display: flex;
    flex-direction: column;
    gap: 5px;
    min-width: 0;
}

.fitro-ai-float-heading strong {
    color: #19304D;
    font-family: "Inter", sans-serif;
    font-size: 13px;
    font-weight: 700;
}

.fitro-ai-float-heading small {
    color: #72849C;
    font-family: "Inter", sans-serif;
    font-size: 8px;
    font-weight: 700;
    letter-spacing: .08em;
}

.fitro-ai-float-live {
    width: 7px;
    height: 7px;
    flex-shrink: 0;
    margin-left: auto;

    border-radius: 50%;

    background: #4268A5;
    box-shadow: 0 0 0 5px rgba(66,104,165,.10);
}

.fitro-ai-float-divider {
    height: 1px;
    margin: 17px 0;
    background: rgba(66,104,165,.12);
}

.fitro-ai-floating-card p {
    margin: 0;
    color: #64748B;
    font-size: 12px;
    line-height: 1.7;
}

.fitro-ai-floating-card p strong {
    color: #263F62;
    font-weight: 700;
}

.fitro-ai-float-footer {
    display: flex;
    align-items: center;
    gap: 9px;
    margin-top: 17px;

    color: #4268A5;
    font-size: 10px;
    font-weight: 700;
}

.fitro-ai-float-check {
    display: grid;
    place-items: center;

    width: 20px;
    height: 20px;

    border-radius: 50%;
    background: #E2EFFB;
    color: #4268A5;
}

.fitro-ai-float-sparkle {
    margin-left: auto;
    font-size: 20px;
    color: #4268A5;
}

/* Gentle floating movement */

@keyframes fitroAiCardFloat {
    0%, 100% {
        transform: translateY(0);
    }

    50% {
        transform: translateY(-10px);
    }
}

/* TABLET */



/* MOBILE */



/* SHORT MOBILE SCREENS */



/* REDUCED MOTION */



/* =====================================================
   FITROAI — SECOND FLOATING CARD
   Bottom of robot area
===================================================== */

.fitro-ai-bottom-card {
    position: absolute;
    z-index: 3;
    left: 8%;
    bottom: clamp(0px, 6vh, 30px);
    width: min(300px, 29vw);
    padding: 19px 21px;
    border: 1px solid rgba(255, 255, 255, .85);
    border-radius: 20px;
    background: rgb(190 209 239 / 34%);
    -webkit-backdrop-filter: blur(20px);
    backdrop-filter: blur(20px);
    box-shadow: 0 20px 50px rgba(66, 104, 165, .11), inset 0 1px 0 rgba(255, 255, 255, .85);
    pointer-events: none;
    animation: fitroAiBottomFloat 5.5s ease-in-out infinite;
    animation-delay: -1.5s;
}

.fitro-ai-bottom-card-top {
    display: flex;
    align-items: center;
    gap: 11px;
}

.fitro-ai-bottom-icon {
    width: 37px;
    height: 37px;
    flex-shrink: 0;

    display: grid;
    place-items: center;

    border-radius: 12px;
    background: #4268A5;
    color: #fff;
    font-size: 20px;
}

.fitro-ai-bottom-heading {
    display: flex;
    flex-direction: column;
    gap: 5px;
    min-width: 0;
}

.fitro-ai-bottom-heading strong {
    color: #19304D;
    font-family: "Inter", sans-serif;
    font-size: 13px;
    font-weight: 700;
}

.fitro-ai-bottom-heading small {
    color: #72849C;
    font-family: "Inter", sans-serif;
    font-size: 8px;
    font-weight: 700;
    letter-spacing: .08em;
}

.fitro-ai-bottom-indicator {
    width: 7px;
    height: 7px;
    flex-shrink: 0;
    margin-left: auto;

    border-radius: 50%;
    background: #4268A5;
    box-shadow: 0 0 0 5px rgba(66,104,165,.10);
}

.fitro-ai-bottom-card-body {
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    gap: 10px;

    margin-top: 17px;
    padding-top: 15px;
    border-top: 1px solid rgba(66,104,165,.12);
}

.fitro-ai-bottom-label {
    display: block;
    margin-bottom: 8px;
    color: #6480A5;
    font-size: 9px;
    font-weight: 700;
    letter-spacing: .12em;
}

.fitro-ai-bottom-card-body h3 {
    margin: 0 0 7px;
    color: #243E60;
    font-family: "Inter", sans-serif;
    font-size: 15px;
    font-weight: 700;
}

.fitro-ai-bottom-card-body p {
    margin: 0;
    max-width: 180px;
    color: #64748B;
    font-size: 11px;
    line-height: 1.6;
}

/* Decorative waveform */

.fitro-ai-bottom-wave {
    display: flex;
    align-items: center;
    gap: 3px;
    height: 36px;
    flex-shrink: 0;
}

.fitro-ai-bottom-wave i {
    width: 3px;
    height: 35%;
    border-radius: 4px;
    background: #4268A5;
    animation: fitroAiWave 1.4s ease-in-out infinite alternate;
}

.fitro-ai-bottom-wave i:nth-child(3n) {
    height: 80%;
    animation-delay: .2s;
}

.fitro-ai-bottom-wave i:nth-child(4n) {
    height: 55%;
    animation-delay: .5s;
}

.fitro-ai-bottom-wave i:nth-child(5n) {
    height: 95%;
    animation-delay: .7s;
}

@keyframes fitroAiWave {
    to {
        transform: scaleY(.45);
        opacity: .65;
    }
}

@keyframes fitroAiBottomFloat {
    0%, 100% {
        transform: translateY(0);
    }

    50% {
        transform: translateY(-9px);
    }
}

/* Tablet */



/* Mobile — compact card below robot */



/* Short screens — avoid overlap */



/* Reduced motion */


/* ===== FITRO AI: CONSOLIDATED RESPONSIVE LAYOUT ===== */
.fitro-ai-section { height: 320svh; overflow:clip; }
.fitro-ai-sticky {height:100svh;background: #f5f9fd url('../images/fitro/features/FitroAiBG.png') center/cover no-repeat;}
.fitro-ai-section .fitro-ai-container { width:min(1340px,calc(100% - 88px));height:100%;padding:74px 0 25px;grid-template-columns:minmax(0,53%) minmax(0,47%);gap:0; }
.fitro-ai-section .fitro-ai-copy {min-width:0; min-height:0;max-height:none;overflow:visible; padding-left:12px;}
.fitro-ai-section .fitro-ai-insight {min-height:0;}
.fitro-ai-section .fitro-ai-robot-scene,.fitro-ai-section #fitroAiRobotCanvas {z-index:1;}
.fitro-ai-section .fitro-ai-container {z-index:2;}
.fitro-ai-section .fitro-ai-floating-card,.fitro-ai-section .fitro-ai-bottom-card {z-index:3;background:rgba(244,249,255,.86);border:1px solid rgba(255,255,255,.9);backdrop-filter:blur(15px);-webkit-backdrop-filter:blur(15px);box-shadow:0 12px 36px rgba(37,72,120,.13);}
.fitro-ai-section .fitro-ai-floating-card {top:clamp(92px,12svh,145px);left:clamp(240px,27vw,470px);width:clamp(240px,20vw,300px);padding:15px 18px;}
.fitro-ai-section .fitro-ai-bottom-card {left:clamp(35px,7vw,150px);bottom:clamp(24px,5svh,65px);width:clamp(230px,20vw,290px);padding:16px;}
.fitro-ai-section.fitro-ai-is-zooming #fitroAiRobotCanvas {z-index:4;}
.fitro-ai-section .fitro-ai-reveal {z-index:5;}
@media (min-width:901px) and (max-height:760px) {
  .fitro-ai-section .fitro-ai-container {padding-top:46px;}
  .fitro-ai-section .fitro-ai-copy h2 {font-size:clamp(49px,4.7vw,72px);margin-bottom:14px;}
  .fitro-ai-section .fitro-ai-eyebrow {margin-bottom:10px;}
  .fitro-ai-section .fitro-ai-selector,.fitro-ai-section .fitro-ai-insight,.fitro-ai-section .fitro-ai-cta {margin-top:14px;}
}
@media (min-width:701px) and (max-width:1100px) {
 .fitro-ai-section .fitro-ai-container {width:calc(100% - 52px);grid-template-columns:minmax(0,47%) minmax(0,53%);padding-top:65px;}
 .fitro-ai-section .fitro-ai-copy h2 {font-size:clamp(43px,5.6vw,67px);}
 .fitro-ai-section .fitro-ai-description {font-size:13px;line-height:1.6;}
 .fitro-ai-section .fitro-ai-floating-card {left:12%;top:91px;width:220px;padding:12px;}
 .fitro-ai-section .fitro-ai-bottom-card {left:3%;bottom:28px;width:220px;padding:12px;}
}
@media (min-width:701px) and (max-width:850px) {
 .fitro-ai-section .fitro-ai-container {width:calc(100% - 36px);grid-template-columns:minmax(0,43%) minmax(0,57%);}
 .fitro-ai-section .fitro-ai-copy h2 {font-size:clamp(38px,5.5vw,53px);margin-bottom:13px;}
 .fitro-ai-section .fitro-ai-eyebrow {margin-bottom:10px;font-size:10px;}
 .fitro-ai-section .fitro-ai-selector,.fitro-ai-section .fitro-ai-insight,.fitro-ai-section .fitro-ai-cta {margin-top:13px;}
 .fitro-ai-section .fitro-ai-tab {min-height:34px;padding:0 10px;font-size:10px;}
 .fitro-ai-section .fitro-ai-floating-card {top:92px;left:5%;width:185px;padding:10px;}
 .fitro-ai-section .fitro-ai-bottom-card {bottom:22px;left:3%;width:185px;padding:10px;}
 .fitro-ai-section .fitro-ai-floating-card p,.fitro-ai-section .fitro-ai-float-divider,.fitro-ai-section .fitro-ai-bottom-card-body p,.fitro-ai-section .fitro-ai-bottom-wave {display:none;}
 .fitro-ai-section .fitro-ai-float-footer,.fitro-ai-section .fitro-ai-bottom-card-body {margin-top:7px;padding-top:6px;}
}

/* Mobile: upper robot stage + lower non-scrollable copy. Card height is content-driven,
   never stretch its contents into an insufficient grid track. */
@media (max-width:700px) {
 .fitro-ai-section {height:300svh;overflow:clip;}
 .fitro-ai-section .fitro-ai-sticky {height:100svh;min-height:0;overflow:hidden;background-position:44% center;}
 .fitro-ai-section .fitro-ai-container {
   width:min(100% - 24px,520px);height:100%;margin-inline:auto;
   display:grid;grid-template-columns:minmax(0,1fr);
   grid-template-rows:minmax(0,27%) minmax(0,73%);
   padding:clamp(55px,10svh,80px) 0 clamp(10px,2svh,18px);
   gap:0;align-items:stretch;
 }
 .fitro-ai-section .fitro-ai-model-space {grid-column:1;grid-row:1;min-height:0;}
 .fitro-ai-section .fitro-ai-copy {
   grid-column:1;grid-row:2;position:relative;align-self:center;
   display:flex;flex-direction:column;align-items:stretch;justify-content:center;
   width:100%;max-width:none;min-width:0;min-height:0;max-height:none;
   overflow:visible!important;overflow-y:visible!important;
   padding:clamp(14px,3vw,23px) clamp(14px,4vw,23px) clamp(14px,3vw,22px);
   margin:0;border-radius:23px;
   border:1px solid rgba(255,255,255,.93);
   background:linear-gradient(160deg,rgba(250,253,255,.96),rgba(241,247,254,.94));
   box-shadow:0 10px 28px rgba(46,86,140,.1);
   backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);
 }
 .fitro-ai-section .fitro-ai-copy > * {flex-shrink:0;}
 .fitro-ai-section .fitro-ai-eyebrow {font-size:9px;letter-spacing:.12em;margin:0 0 8px;line-height:1.2;}
 .fitro-ai-section .fitro-ai-copy h2 {font-size:clamp(32px,9.4vw,48px);line-height:.92;letter-spacing:-.045em;margin:0 0 11px;}
 .fitro-ai-section .fitro-ai-description {font-size:clamp(11px,2.95vw,13px);line-height:1.48;max-width:440px;margin:0;}
 .fitro-ai-section .fitro-ai-selector {display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:5px;margin:14px 0 0;padding:4px;background:rgba(224,236,251,.58);border:1px solid rgba(66,104,165,.10);border-radius:13px;}
 .fitro-ai-section .fitro-ai-tab {min-width:0;width:100%;min-height:34px;padding:5px 2px;border:0;border-radius:9px;font-size:clamp(9px,2.6vw,11px);white-space:nowrap;}
 .fitro-ai-section .fitro-ai-insight {min-height:0;margin:13px 0 0;padding:9px 11px 9px 13px;border:0;border-left:3px solid #4268a5;border-radius:0 11px 11px 0;background:rgba(221,235,251,.5);}
 .fitro-ai-section .fitro-ai-insight-label {font-size:8px;letter-spacing:.13em;}
 .fitro-ai-section .fitro-ai-insight h3 {font-size:clamp(15px,4.2vw,19px);line-height:1.22;margin:4px 0;}
 .fitro-ai-section .fitro-ai-insight p {font-size:clamp(10px,2.7vw,12px);line-height:1.42;margin:0;}
 .fitro-ai-section .fitro-ai-cta {align-self:flex-start;position:relative;flex-shrink:0;min-height:40px;margin:13px 0 0;padding:0 17px;font-size:11px;gap:13px;z-index:2;}
 .fitro-ai-section .fitro-ai-scroll-cue,.fitro-ai-section .fitro-ai-robot-status {display:none;}
 /* two compact cards stay above the robot, not on the content panel */
 .fitro-ai-section .fitro-ai-floating-card,.fitro-ai-section .fitro-ai-bottom-card {
   position:absolute;top:clamp(70px,12svh,99px);bottom:auto;
   width:calc((100% - 36px)/2);max-width:190px;min-height:47px;
   padding:8px 9px;border-radius:12px;
   animation:none!important;transform:none!important;
 }
 .fitro-ai-section .fitro-ai-floating-card {left:12px;right:auto;}
 .fitro-ai-section .fitro-ai-bottom-card {left:auto;right:12px;}
 .fitro-ai-section .fitro-ai-float-header,.fitro-ai-section .fitro-ai-bottom-card-top {gap:6px;}
 .fitro-ai-section .fitro-ai-float-icon,.fitro-ai-section .fitro-ai-bottom-icon {width:26px;height:26px;border-radius:8px;font-size:15px;}
 .fitro-ai-section .fitro-ai-float-heading strong,.fitro-ai-section .fitro-ai-bottom-heading strong {font-size:10px;line-height:1.2;}
 .fitro-ai-section .fitro-ai-float-heading small,.fitro-ai-section .fitro-ai-bottom-heading small {font-size:6.5px;letter-spacing:0;line-height:1.2;}
 .fitro-ai-section .fitro-ai-float-live,.fitro-ai-section .fitro-ai-bottom-indicator {width:5px;height:5px;box-shadow:none;}
 .fitro-ai-section .fitro-ai-floating-card p,.fitro-ai-section .fitro-ai-float-divider,.fitro-ai-section .fitro-ai-float-footer,.fitro-ai-section .fitro-ai-bottom-card-body {display:none;}
 .fitro-ai-reveal {padding:22px 18px;}
 .fitro-ai-reveal h2 {font-size:clamp(41px,10vw,67px);}
 .fitro-ai-next {padding:70px 18px 90px;}
 .fitro-ai-next-grid {grid-template-columns:1fr;gap:12px;}
 .fitro-ai-next h2 {font-size:clamp(38px,9vw,60px);}
}

/* 320–380px: extra compact, keep CTA below insight. */
@media (max-width:380px) {
 .fitro-ai-section .fitro-ai-container {width:calc(100% - 18px);padding-top:64px;grid-template-rows:minmax(0,23%) minmax(0,77%);}
 .fitro-ai-section .fitro-ai-copy {padding:12px 12px 13px;border-radius:19px;}
 .fitro-ai-section .fitro-ai-eyebrow {margin-bottom:6px;font-size:8px;}
 .fitro-ai-section .fitro-ai-copy h2 {font-size:clamp(29px,9.3vw,35px);margin-bottom:8px;}
 .fitro-ai-section .fitro-ai-description {font-size:10.5px;line-height:1.36;}
 .fitro-ai-section .fitro-ai-selector {margin-top:9px;padding:3px;}
 .fitro-ai-section .fitro-ai-tab {min-height:30px;font-size:9px;}
 .fitro-ai-section .fitro-ai-insight {margin-top:9px;padding:7px 9px 7px 10px;}
 .fitro-ai-section .fitro-ai-insight h3 {font-size:14px;margin:3px 0;}
 .fitro-ai-section .fitro-ai-insight p {font-size:10px;line-height:1.32;}
 .fitro-ai-section .fitro-ai-cta {min-height:36px;margin-top:9px;padding:0 15px;}
 .fitro-ai-section .fitro-ai-floating-card,.fitro-ai-section .fitro-ai-bottom-card {top:73px;max-width:165px;padding:6px;}
 .fitro-ai-section .fitro-ai-floating-card {left:7px;}
 .fitro-ai-section .fitro-ai-bottom-card {right:7px;}
}
/* Phones with low viewport height, including landscape: stronger compact layout */
@media (max-width:700px) and (max-height:660px) {
 .fitro-ai-section .fitro-ai-container {padding-top:54px;padding-bottom:6px;grid-template-rows:minmax(0,19%) minmax(0,81%);}
 .fitro-ai-section .fitro-ai-copy {padding:9px 12px 10px;border-radius:17px;}
 .fitro-ai-section .fitro-ai-eyebrow {margin-bottom:4px;font-size:8px;}
 .fitro-ai-section .fitro-ai-copy h2 {font-size:clamp(27px,7.7vw,36px);margin-bottom:6px;}
 .fitro-ai-section .fitro-ai-description {font-size:10px;line-height:1.32;}
 .fitro-ai-section .fitro-ai-selector {margin-top:7px;padding:3px;}
 .fitro-ai-section .fitro-ai-tab {min-height:28px;padding:3px 2px;font-size:9px;}
 .fitro-ai-section .fitro-ai-insight {margin-top:7px;padding:6px 9px 6px 10px;}
 .fitro-ai-section .fitro-ai-insight-label {font-size:7px;}
 .fitro-ai-section .fitro-ai-insight h3 {font-size:14px;margin:2px 0;}
 .fitro-ai-section .fitro-ai-insight p {font-size:9.5px;line-height:1.28;}
 .fitro-ai-section .fitro-ai-cta {min-height:34px;margin-top:8px;font-size:10px;}
 .fitro-ai-section .fitro-ai-floating-card,.fitro-ai-section .fitro-ai-bottom-card {top:64px;}
}
@media (max-width:700px) and (max-height:490px) {
 .fitro-ai-section .fitro-ai-container {grid-template-rows:minmax(0,10%) minmax(0,90%);padding-top:48px;}
 .fitro-ai-section .fitro-ai-copy {padding:7px 10px;}
 .fitro-ai-section .fitro-ai-copy h2 {font-size:clamp(23px,6vw,29px);}
 .fitro-ai-section .fitro-ai-floating-card,.fitro-ai-section .fitro-ai-bottom-card {top:47px;padding:4px;min-height:31px;}
 .fitro-ai-section .fitro-ai-float-heading small,.fitro-ai-section .fitro-ai-bottom-heading small {display:none;}
}
@media (prefers-reduced-motion:reduce) {
 .fitro-ai-section {height:auto;overflow:visible;}
 .fitro-ai-sticky {position:relative;height:auto;min-height:780px;}
 .fitro-ai-section .fitro-ai-container {min-height:780px;}
 .fitro-ai-section .fitro-ai-floating-card,.fitro-ai-section .fitro-ai-bottom-card {animation:none!important;}
 .fitro-ai-section .fitro-ai-reveal,.fitro-ai-section .fitro-ai-scroll-cue {display:none;}
}

/* ================================================================
   FITRO DESIGN SYSTEM — HERO-MATCHED FITRO AI UI (2026)
   Pure CSS adaptation for the current home.blade.php markup.
   Original robot/sticky/scroll/insight styles above remain untouched.
================================================================ */
.fitro-ai-section .fitro-ai-copy h2,
.fitro-ai-section .fitro-ai-reveal h2,
.fitro-ai-next h2 {
  font-family: Georgia, "Times New Roman", serif;
  font-weight: 500;
  letter-spacing: -.055em;
}
.fitro-ai-section .fitro-ai-description,
.fitro-ai-section .fitro-ai-reveal p,
.fitro-ai-section .fitro-ai-insight p,
.fitro-ai-next p {
  font-family: "Inter", Arial, sans-serif;
}
/* Category selectors: compact version of hero rounded-rectangle system. */
.fitro-ai-section .fitro-ai-selector { gap: 9px; }
.fitro-ai-section .fitro-ai-tab {
  display: inline-flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  min-height: 47px;
  padding: 5px 6px 5px 15px;
  border: 1px solid #B4C3D4;
  border-radius: 15px;
  background: rgba(255,255,255,.48);
  color: #203655;
  font-family: "Inter", Arial, sans-serif;
  font-size: 11px;
  font-weight: 650;
  letter-spacing: -.01em;
  box-shadow: none;
}
.fitro-ai-section .fitro-ai-tab::after {
  content: "→";
  display: grid;
  flex: 0 0 33px;
  place-items: center;
  width: 33px;
  height: 33px;
  border: 1px solid rgba(115,136,161,.35);
  border-radius: 10px;
  background: #E9EFF6;
  color: #203655;
  font-size: 15px;
  line-height: 1;
}
.fitro-ai-section .fitro-ai-tab.active,
.fitro-ai-section .fitro-ai-tab[aria-pressed="true"] {
  background: #FCFBF7;
  border-color: #E7EAF0;
  color: #192943;
  box-shadow: 0 9px 24px rgba(24,43,72,.10);
}
.fitro-ai-section .fitro-ai-tab.active::after,
.fitro-ai-section .fitro-ai-tab[aria-pressed="true"]::after {
  content: "↗";
  background: #203655;
  border-color: #203655;
  color: #fff;
}
.fitro-ai-section .fitro-ai-tab:hover { background: #fff; border-color: #889DB7; }
/* Main CTA and zoom-reveal CTA: original button markup already contains arrow spans. */
.fitro-ai-section .fitro-ai-cta,
.fitro-ai-section .fitro-ai-reveal-cta {
  position: relative;
  display: inline-flex;
  align-items: center;
  justify-content: space-between;
  gap: 22px;
  min-height: 58px;
  padding: 7px 7px 7px 24px;
  border: 1px solid #E3E8EF;
  border-radius: 16px;
  background: #FCFBF7;
  color: #192943 !important;
  font-family: "Inter", Arial, sans-serif;
  font-size: 12px;
  font-weight: 650;
  letter-spacing: -.01em;
  line-height: 1.2;
  text-decoration: none;
  box-shadow: 0 12px 26px rgba(28,51,79,.12);
  transition: transform .25s ease, box-shadow .25s ease, border-color .25s ease;
}
.fitro-ai-section .fitro-ai-cta > span,
.fitro-ai-section .fitro-ai-reveal-cta > span {
  display: grid;
  place-items: center;
  flex: 0 0 42px;
  width: 42px;
  height: 42px;
  border-radius: 12px;
  background: #203655;
  color: #fff;
  font: 500 19px/1 "Inter", Arial, sans-serif;
}
.fitro-ai-section .fitro-ai-cta:hover,
.fitro-ai-section .fitro-ai-reveal-cta:hover {
  transform: translateY(-3px);
  background: #FCFBF7;
  color: #192943 !important;
  border-color: #BFCBDC;
  box-shadow: 0 16px 32px rgba(28,51,79,.17);
}
.fitro-ai-section .fitro-ai-cta:focus-visible,
.fitro-ai-section .fitro-ai-reveal-cta:focus-visible,
.fitro-ai-section .fitro-ai-tab:focus-visible {
  outline: 3px solid #4A76B6;
  outline-offset: 3px;
}
@media (max-width: 700px) {
  .fitro-ai-section .fitro-ai-selector { gap: 5px; }
  .fitro-ai-section .fitro-ai-tab {
    gap: 4px;
    min-width: 0;
    min-height: 38px;
    padding: 4px 4px 4px 7px;
    border: 1px solid rgba(66,104,165,.17);
    border-radius: 11px;
    font-size: clamp(8px, 2.15vw, 10px);
    white-space: nowrap;
  }
  .fitro-ai-section .fitro-ai-tab::after {
    width: 22px;
    height: 26px;
    flex-basis: 22px;
    border-radius: 7px;
    font-size: 12px;
  }
  .fitro-ai-section .fitro-ai-cta,
  .fitro-ai-section .fitro-ai-reveal-cta {
    min-height: 45px;
    padding: 5px 5px 5px 14px;
    gap: 10px;
    border-radius: 12px;
    font-size: 11px;
  }
  .fitro-ai-section .fitro-ai-cta > span,
  .fitro-ai-section .fitro-ai-reveal-cta > span {
    width: 33px;
    height: 33px;
    flex-basis: 33px;
    border-radius: 9px;
    font-size: 16px;
  }
}
@media (max-width: 380px) {
  .fitro-ai-section .fitro-ai-tab { font-size: 8px; padding-left: 5px; gap: 2px; }
  .fitro-ai-section .fitro-ai-tab::after { width: 19px; height: 23px; flex-basis: 19px; }
  .fitro-ai-section .fitro-ai-cta { min-height: 42px; }
}
@media (prefers-reduced-motion: reduce) {
  .fitro-ai-section .fitro-ai-cta,
  .fitro-ai-section .fitro-ai-reveal-cta,
  .fitro-ai-section .fitro-ai-tab { transition: none; }
}