/* ============================================================================
   LattIQ · T4 colour morph - morph.css  (return package v2)
   ----------------------------------------------------------------------------
   v2 per design review: NO feathered self-paint, no masks, no ::before
   overlays - the runs are monotonic and the fixed backdrop is the only
   background layer, so nothing can produce a seam or notch.

   2026-07-23: the engine now runs on mobile too (Akash: colour-morph on mobile
   at full quality). So the legibility rules (border kills, light-green text
   retune, decorative-pseudo kills) are keyed only on html[data-morph="full"]
   and apply at EVERY width - the engine sets that attribute wherever it runs.
   The 100vh flex "chapter" layout stays desktop-only (mobile keeps natural
   section heights so the page doesn't balloon).
   ========================================================================== */

/* ---- 1 · Full-viewport chapters (desktop only) --------------------------- */
@media (min-width: 1000px) {
  #personas, #signals, .hb-band,
  .plat-intel, .plat-config, .plat-privacy {
    min-height: 100vh;
    display: flex;
    flex-direction: column;
    justify-content: center;
    box-sizing: border-box;
    padding-block: calc(64px + clamp(24px, 3vh, 56px)) clamp(64px, 7vh, 120px);
  }
  /* the chapter is a flex column; force the flow wrapper to full cross-axis
     width so the container clamp + fluid grid resolve correctly. */
  html[data-morph="full"] #personas > .wrap,
  html[data-morph="full"] #signals > .wrap,
  html[data-morph="full"] .plat-intel > .wrap,
  html[data-morph="full"] .plat-config > .wrap,
  html[data-morph="full"] .plat-privacy > .wrap {
    width: 100%;
    align-self: center;
  }
}

/* ---- 2 · Legibility under morph (ALL widths - engine sets data-morph) ----- */
/* Kill EVERY border/shadow on managed sections - the backdrop is one
   continuous field, so any section-edge border reads as a visible seam. */
html[data-morph="full"] #personas,
html[data-morph="full"] #signals,
html[data-morph="full"] .hb-band,
html[data-morph="full"] .plat-intel,
html[data-morph="full"] .plat-config,
html[data-morph="full"] .plat-privacy {
  border-top: none !important;
  border-bottom: none !important;
  box-shadow: none !important;
}

/* Foreground retune on the light-green chapters (#signals, .plat-config): the
   default light-on-tint accents need darkening for contrast on the tinted backdrop. */
html[data-morph="full"] #signals .sec-title .gt   { background:none; -webkit-background-clip:initial; background-clip:initial; color:#0A5440; -webkit-text-fill-color:#0A5440; }
html[data-morph="full"] #signals .ecm .counter    { color:#063A2B; }
html[data-morph="full"] #signals .stats-lbl       { color:#223B31; }
html[data-morph="full"] #signals .sigcard         { border:1px solid rgba(6,58,43,.16);
                                                    box-shadow:0 26px 52px -22px rgba(4,36,27,.5); }
html[data-morph="full"] #signals .section-cta .btn-primary { background:#063A2B; border-color:#063A2B; }

html[data-morph="full"] .plat-config .plat-eyebrow   { color:#063A2B !important; }
html[data-morph="full"] .plat-config .plat-h2 .g     { color:#063A2B !important; }
html[data-morph="full"] .plat-config #platFlex > div { border:1px solid rgba(6,58,43,.16) !important;
                                                       box-shadow:0 26px 52px -22px rgba(4,36,27,.5) !important; }
html[data-morph="full"] .plat-config #platFlex [data-abbr],
html[data-morph="full"] .plat-config .plat-abbr      { color:#0A5440 !important; }

/* Kill decorative pseudo-tints + glows that keep painting under the transparent
   morph sections and create shade-step "lines" at the seams. */
html[data-morph="full"] #personas::before,
html[data-morph="full"] #personas::after,
html[data-morph="full"] #signals::before,
html[data-morph="full"] #signals::after,
html[data-morph="full"] .hb-band::before,
html[data-morph="full"] .hb-band::after,
html[data-morph="full"] #personas .pux-bg {
  display: none !important;
}

/* ---- 3 · No-JS fallback (<1000px): if the engine never runs, these keep the
   recoloured chapters readable. When the engine DOES run it makes the sections
   transparent (background:transparent!important), overriding these. ---------- */
@media (max-width: 999px) {
  .hb-band { background: #FFFFFF; }
  #signals { background: #E6F8F0; }
  .plat-config { background: #E6F8F0; }
}

/* Reduced motion: nothing to declare - colour is a 1:1 pure function of scroll. */
