/* ICYLAB — shared viewport containment, v0.7.4. */

html,
body {
  max-inline-size: 100%;
}

/* Canonical browser scrollbar. Legacy modules used to hide it completely;
   v0.7.4 restores orientation/progress with a narrow ICYLAB acid-green rail. */
html,
body {
  scrollbar-width: thin !important;
  scrollbar-color: #00ff30 #080808 !important;
  -ms-overflow-style: auto !important;
}

html::-webkit-scrollbar,
body::-webkit-scrollbar {
  display: block !important;
  width: 6px !important;
  height: 6px !important;
}

html::-webkit-scrollbar-track,
body::-webkit-scrollbar-track { background: #080808 !important; }

html::-webkit-scrollbar-thumb,
body::-webkit-scrollbar-thumb {
  min-height: 36px;
  border-radius: 999px;
  background: #00ff30 !important;
}

html::-webkit-scrollbar-thumb:hover,
body::-webkit-scrollbar-thumb:hover { background: #00e72c !important; }

/* Chapter rails remain horizontally swipeable, but their native horizontal
   scrollbar is intentionally hidden. The persistent green line in the UI is
   reserved for the active chapter indicator; otherwise Chromium/Android can
   expose a long green scrollbar thumb directly beneath the active label and
   make the state cue look incorrectly stretched. The main page scrollbar
   above remains thin + acid green. */
.icy-bloom-subnav .icy-bloom-shell,
.icy-interior-subnav .icy-interior-shell {
  scrollbar-width: none !important;
  -ms-overflow-style: none !important;
}

.icy-bloom-subnav .icy-bloom-shell::-webkit-scrollbar,
.icy-interior-subnav .icy-interior-shell::-webkit-scrollbar {
  display: none !important;
  width: 0 !important;
  height: 0 !important;
}

body.icy-full-home,
body.icy-bloom-page,
body.icy-solutions-page,
body.icy-results-page,
body.icy-lab-page,
body.icy-pilotea-page,
body.icy-editorial-page {
  overflow-x: clip;
}

.icy-home-container > *,
.icy-interior-shell > *,
.icy-interior-section > *,
.icy-bloom-shell > *,
.icy-bloom-section > *,
.icy-editorial-shell > *,
.icy-editorial-grid > * {
  min-inline-size: 0;
}

.icy-home-hero-copy,
.icy-home-problem-copy,
.icy-home-product-copy,
.icy-home-calculator-copy,
.icy-home-results-head,
.icy-home-tools-copy,
.icy-home-lab-copy,
.icy-interior-copy,
.icy-bloom-copy,
.icy-editorial-copy {
  min-inline-size: 0;
  max-inline-size: 100%;
}

.icy-home-hero h1,
.icy-home-section h2,
.icy-home-final h2,
.icy-interior-display,
.icy-bloom-section h1,
.icy-bloom-section h2,
.icy-bloom-final h2,
.icy-editorial-title,
.icy-editorial-card h2,
.icy-editorial-card h3 {
  max-inline-size: 100%;
  overflow-wrap: break-word;
  word-break: normal;
  text-wrap: balance;
}

.icy-home-actions,
.icy-home-final-actions,
.icy-interior-actions,
.icy-bloom-actions,
.icy-bloom-final-actions,
.icy-bloom-portfolio-actions,
.icy-holding-actions {
  min-inline-size: 0;
  max-inline-size: 100%;
  flex-wrap: wrap;
}

.icy-home-button,
.icy-interior-btn,
.icy-bloom-btn,
.icy-holding-action,
.icy-lab-quality-action,
.icy-editorial-read,
.icy-editorial-cta a {
  box-sizing: border-box;
  min-inline-size: 0;
  max-inline-size: 100%;
  white-space: normal;
  overflow-wrap: anywhere;
}

.icy-home-button > span,
.icy-interior-btn > span,
.icy-bloom-btn > span {
  flex: 0 0 auto;
}

.icy-home-tools-grid,
.icy-home-case-grid,
.icy-bloom-benefit-grid,
.icy-bloom-variety-grid,
.icy-lab-rd-board,
.icy-lab-team-grid,
.icy-pilotea-kit-grid,
.icy-pilotea-product-grid,
.icy-results-adoption-grid,
.icy-results-library-grid,
.icy-results-measure-grid,
.icy-solutions-flow-compare,
.icy-solutions-matrix,
.icy-solutions-operation-board,
.icy-solutions-profile-board,
.icy-solutions-route-grid {
  box-sizing: border-box;
  min-inline-size: 0;
  max-inline-size: 100%;
}

.icy-home-tools-grid > *,
.icy-home-case-grid > *,
.icy-bloom-benefit-grid > *,
.icy-bloom-variety-grid > *,
.icy-lab-rd-board > *,
.icy-lab-team-grid > *,
.icy-pilotea-kit-grid > *,
.icy-pilotea-product-grid > *,
.icy-results-adoption-grid > *,
.icy-results-library-grid > *,
.icy-results-measure-grid > *,
.icy-solutions-flow-compare > *,
.icy-solutions-matrix > *,
.icy-solutions-operation-board > *,
.icy-solutions-profile-board > *,
.icy-solutions-route-grid > * {
  min-inline-size: 0;
  overflow-wrap: break-word;
}

input,
select,
textarea,
button,
table {
  box-sizing: border-box;
  max-inline-size: 100%;
}

@media (max-width: 1024px) {
  /* Tablets are touch-first: use natural page scrolling and remove tiny
     lateral dot navigation instead of keeping the desktop snap model. */
  .icy-hybrid-screen-nav,
  .icy-interior-screen-nav,
  .icy-home-screen-nav {
    display: none !important;
  }

  html.icy-bloom-scroll,
  html.icy-bloom-scroll.icy-hybrid-scroll,
  html.icy-hybrid-scroll,
  html.icy-interior-scroll {
    scroll-snap-type: none !important;
  }
}

@media (max-width: 860px) {
  .icy-home-actions,
  .icy-home-final-actions,
  .icy-interior-actions,
  .icy-bloom-actions,
  .icy-bloom-final-actions,
  .icy-bloom-portfolio-actions,
  .icy-holding-actions {
    inline-size: 100%;
  }

  .icy-home-button,
  .icy-interior-btn,
  .icy-bloom-btn,
  .icy-holding-action,
  .icy-lab-quality-action {
    inline-size: 100%;
    min-block-size: 46px;
    justify-content: space-between;
  }

  .icy-interior-display {
    font-size: clamp(2.05rem, min(9.3vw, 6.3svh), 3.55rem) !important;
    line-height: .88 !important;
  }

  .icy-bloom-section h1,
  .icy-bloom-section h2,
  .icy-bloom-final h2 {
    font-size: clamp(2.1rem, min(9.4vw, 6.3svh), 3.6rem) !important;
    line-height: .88 !important;
  }

  body.icy-bloom-page #bloom-portfolio .icy-bloom-variety-card h3,
  body.icy-bloom-page #bloom-portfolio .icy-bloom-variety-grid.is-expanded .icy-bloom-variety-card h3 {
    max-inline-size: 100% !important;
    font-size: clamp(1.18rem, 5.2vw, 1.8rem) !important;
    white-space: normal !important;
    overflow-wrap: anywhere;
  }

  table {
    display: block;
    inline-size: 100%;
    overflow-x: auto;
    overscroll-behavior-inline: contain;
    -webkit-overflow-scrolling: touch;
  }
}

@media (max-width: 370px) {
  .icy-interior-display,
  .icy-bloom-section h1,
  .icy-bloom-section h2,
  .icy-bloom-final h2 {
    font-size: clamp(1.88rem, 9vw, 2.65rem) !important;
  }
}


/* ==========================================================================
   ICYLAB v0.7.7 — Canonical active-page hero scale
   Bloom Hopper is the visual reference. The mobile and desktop endpoints
   match Bloom; the middle range is deliberately smoothed so the 860/861px
   legacy breakpoint cannot create a sudden type-size drop on tablets. Only
   primary heroes are affected; chapter headings keep their page-owned scale.
   ========================================================================== */
@media (min-width: 1025px) {
  body.icy-bloom-page .icy-bloom-hero h1,
  body.icy-interior-page [data-icy-interior-hero] .icy-interior-display,
  body.icy-editorial-page .icy-editorial-hero h1,
  body.icy-editorial-page .icy-editorial-archive-hero h1,
  body.icy-editorial-page .icy-article-hero h1 {
    font-size: clamp(5.5rem, 6.8vw, 8rem) !important;
  }
}

@media (min-width: 481px) and (max-width: 1024px) {
  body.icy-bloom-page .icy-bloom-hero h1,
  body.icy-interior-page [data-icy-interior-hero] .icy-interior-display,
  body.icy-editorial-page .icy-editorial-hero h1,
  body.icy-editorial-page .icy-editorial-archive-hero h1,
  body.icy-editorial-page .icy-article-hero h1 {
    font-size: clamp(4.2rem, 8.6vw, 5.5rem) !important;
  }
}

@media (max-width: 480px) {
  body.icy-bloom-page .icy-bloom-hero h1,
  body.icy-interior-page [data-icy-interior-hero] .icy-interior-display,
  body.icy-editorial-page .icy-editorial-hero h1,
  body.icy-editorial-page .icy-editorial-archive-hero h1,
  body.icy-editorial-page .icy-article-hero h1 {
    font-size: clamp(3.05rem, 14vw, 4.2rem) !important;
  }
}


/* ==========================================================================
   ICYLAB v0.7.11 — Internal hero intrinsic-width contract
   The Home v0.7.10 incident showed why a visual child must never participate
   in the intrinsic minimum of a responsive hero track. Interior page heroes
   now share the same constraint: the centered shell remains the source of
   truth, every hero child may shrink, and touch/tablet layouts use a zero-min
   single grid track where the page previously kept a desktop split.
   ========================================================================== */
@media (max-width: 1024px) {
  body.icy-interior-page:not(.icy-home-v2-page) [data-icy-interior-hero] > .icy-interior-shell {
    min-inline-size: 0;
  }

  body.icy-interior-page:not(.icy-home-v2-page) [data-icy-interior-hero] > .icy-interior-shell > * {
    min-inline-size: 0;
    max-inline-size: 100%;
  }

  /* Soluciones and Resultados were the two remaining interior heroes that
     kept a desktop split through part of the touch/tablet range. A single
     minmax(0,1fr) track prevents either the copy or visual from widening the
     centered shell and matches LAB/Pilotea's existing <=1024px contract. */
  body.icy-solutions-page .icy-solutions-hero > .icy-interior-shell,
  body.icy-results-page .icy-results-hero > .icy-interior-shell {
    grid-template-columns: minmax(0, 1fr) !important;
  }

  /* Visual systems stay contained by their hero track. These selectors do not
     change their designed maximum size; they only remove intrinsic-width risk. */
  body.icy-solutions-page .icy-solutions-router,
  body.icy-results-page .icy-results-cover-stage,
  body.icy-lab-page .icy-lab-hero-system,
  body.icy-pilotea-page .icy-pilotea-product-stage {
    min-inline-size: 0;
    max-inline-size: 100%;
  }
}
