/*!
 * GPMH Experience — Light styles (activated via html.is-lite)
 * Shared across home, Inside, Our Team, jornadas and landings.
 * Light = static page: no motion, no decorative video decode.
 */

/* ── Toggle control (both modes) ── */
.gpmh-exp{
  position:fixed;z-index:85;right:max(14px,env(safe-area-inset-right));
  bottom:max(14px,env(safe-area-inset-bottom));
  font-family:inherit;pointer-events:none;
}
.gpmh-exp-fab,.gpmh-exp-panel{pointer-events:auto}
.gpmh-exp-fab{
  display:inline-flex;align-items:center;gap:8px;
  min-height:40px;padding:0 14px;border-radius:999px;
  border:1px solid rgba(245,241,234,.18);
  background:rgba(5,5,5,.78);color:rgba(245,241,234,.72);
  font-size:10px;letter-spacing:.16em;text-transform:uppercase;font-weight:950;
  cursor:pointer;
  opacity:.55;
}
.gpmh-exp:hover .gpmh-exp-fab,.gpmh-exp:focus-within .gpmh-exp-fab,
.gpmh-exp-fab[aria-expanded="true"]{
  opacity:1;color:#f5f1ea;border-color:rgba(255,0,107,.55);background:rgba(5,5,5,.92);
}
.gpmh-exp-fab:focus-visible{outline:2px solid #ff006b;outline-offset:3px}
.gpmh-exp-panel{
  position:absolute;right:0;bottom:calc(100% + 8px);
  width:min(220px,calc(100vw - 28px));
  padding:12px;border-radius:2px;
  border:1px solid rgba(245,241,234,.16);
  background:rgba(5,5,5,.94);box-shadow:0 24px 60px rgba(0,0,0,.45);
  display:grid;gap:6px;
}
.gpmh-exp-panel[hidden]{display:none!important}
.gpmh-exp-hint{
  margin:0 0 4px;font-size:10px;letter-spacing:.14em;text-transform:uppercase;
  color:rgba(245,241,234,.45);font-weight:700;
}
.gpmh-exp-panel [data-exp]{
  min-height:40px;padding:0 12px;border-radius:2px;border:1px solid transparent;
  background:transparent;color:rgba(245,241,234,.78);
  font-size:12px;letter-spacing:.06em;text-align:left;font-weight:800;cursor:pointer;
}
.gpmh-exp-panel [data-exp]:hover{background:rgba(255,255,255,.04);color:#fff}
.gpmh-exp-panel [data-exp].is-active,
.gpmh-exp-panel [data-exp][aria-pressed="true"]{
  border-color:rgba(255,0,107,.55);color:#fff;background:rgba(255,0,107,.12);
}
.gpmh-exp-panel [data-exp]:focus-visible{outline:2px solid #ff006b;outline-offset:2px}
@media(max-width:640px){
  .gpmh-exp{right:12px;bottom:12px}
  .gpmh-exp-fab{opacity:.7;min-height:36px;padding:0 12px}
}

/* ── Light: kill ALL motion ── */
html.is-lite{
  scroll-behavior:auto!important;
}
html.is-lite,
html.is-lite body{
  cursor:auto!important;
}
html.is-lite *,
html.is-lite *::before,
html.is-lite *::after{
  animation:none!important;
  animation-duration:0s!important;
  animation-delay:0s!important;
  transition:none!important;
  transition-duration:0s!important;
  scroll-behavior:auto!important;
}

html.is-lite a,
html.is-lite button,
html.is-lite .btn,
html.is-lite .wa,
html.is-lite summary,
html.is-lite label,
html.is-lite select,
html.is-lite [role="button"],
html.is-lite .gpmh-exp-fab,
html.is-lite .gpmh-exp-panel [data-exp]{
  cursor:pointer!important;
}
html.is-lite .cursor,
html.is-lite .cursor-dot{
  display:none!important;
  visibility:hidden!important;
  opacity:0!important;
}
html.is-lite .grain:before{display:none!important;content:none!important;opacity:0!important}

/* Full safety: native cursor until JS opts into custom cursor */
html:not(.has-custom-cursor),
html:not(.has-custom-cursor) body{
  cursor:auto!important;
}
html:not(.has-custom-cursor) .cursor,
html:not(.has-custom-cursor) .cursor-dot{display:none!important}
html:not(.has-custom-cursor) .door-close{cursor:pointer!important}

/* Nav / chrome — no backdrop blur */
html.is-lite .nav,
html.is-lite header.top{
  -webkit-backdrop-filter:none!important;backdrop-filter:none!important;
  background:rgba(5,5,5,.9);
}
html.is-lite .nav.scrolled{background:rgba(5,5,5,.94)}
html.is-lite .back{
  -webkit-backdrop-filter:none!important;backdrop-filter:none!important;
  background:rgba(5,5,5,.72);
}

/* Drop expensive decorative paint layers */
html.is-lite .hero::before,
html.is-lite .aura,
html.is-lite .bc-iris,
html.is-lite .hero-iris,
html.is-lite .bc-grain,
html.is-lite .mit-motion-loop:after,
html.is-lite .premium-mit:after,
html.is-lite .scroll-cue,
html.is-lite .team-media:after{display:none!important}

/* Everything starts fully visible — no reveal choreography */
html.is-lite .reveal,
html.is-lite .hero-grid .reveal,
html.is-lite .split-word > span,
html.is-lite .hero-grid .split-word > span,
html.is-lite .hero-copy > *,
html.is-lite .hero-meta,
html.is-lite .story-reel-line,
html.is-lite .story-reel-eyebrow,
html.is-lite .devglow,
html.is-lite .hero .seg,
html.is-lite .pillar-ticks i,
html.is-lite .kwx,
html.is-lite .spine-node,
html.is-lite .mod-gains li,
html.is-lite .cmp-row,
html.is-lite .pool li,
html.is-lite .shot,
html.is-lite .frame,
html.is-lite .reel-card{
  opacity:1!important;
  transform:none!important;
  filter:none!important;
  clip-path:none!important;
  will-change:auto!important;
}
html.is-lite .hero .wrap{filter:none!important}
html.is-lite .story-reel-line,
html.is-lite .story-reel-eyebrow{text-shadow:0 12px 40px rgba(0,0,0,.4)}

/* Logos — no CSS filter stacks */
html.is-lite .company-logo,
html.is-lite .company-logo.brand-sap{
  filter:none!important;
  mix-blend-mode:normal;
  opacity:.88;
}
html.is-lite .company-logo:hover{filter:none!important;opacity:1}
html.is-lite .journey-logo{filter:none!important}

/* ── Videos: never show / decode in Light (posters become <img.gpmh-lite-poster>) ── */
html.is-lite video{
  display:none!important;
  visibility:hidden!important;
  pointer-events:none!important;
}
html.is-lite .gpmh-lite-poster{
  display:block!important;
  width:100%;
  height:100%;
  object-fit:cover;
  position:absolute;
  inset:0;
  z-index:0;
  pointer-events:none;
}
/* Empty MIT / umbrella media wells stay as solid surfaces */
html.is-lite .mit-motion-loop,
html.is-lite .umbrella{
  background:#090909!important;
}
html.is-lite .umbrella-video,
html.is-lite .hero-loop,
html.is-lite .stage__video,
html.is-lite #hero-video,
html.is-lite #bgv{display:none!important}

/* Cards / glass */
html.is-lite .glass:before{opacity:.55}
html.is-lite .card,
html.is-lite .section-index,
html.is-lite .chip{
  -webkit-backdrop-filter:none!important;backdrop-filter:none!important;
  background:rgba(5,5,5,.72)!important;
}
html.is-lite .cc-hub span{
  background:none;-webkit-text-fill-color:currentColor;
}

/* Inside GPMH */
html.is-lite .frame:after,
html.is-lite .reel-card:after{mix-blend-mode:normal;opacity:.4}
html.is-lite .frame,html.is-lite .reel-card{cursor:auto}
html.is-lite .team-media{transform:none!important}
html.is-lite .team-card{will-change:auto}

/* Freeze marquees / hover motion */
html.is-lite .ticker-track,
html.is-lite .logo-track,
html.is-lite .logo-marquee,
html.is-lite .team-band{
  animation:none!important;
  transform:none!important;
}
html.is-lite .mark-card:hover .journey-logo,
html.is-lite .glass:hover,
html.is-lite .card:hover,
html.is-lite .btn:hover,
html.is-lite .wa:hover{transform:none!important}
html.is-lite .hero-bg,
html.is-lite .mark-card,
html.is-lite .hero-title-roll,
html.is-lite .parallax .bg img{
  transform:none!important;
  will-change:auto!important;
}
html.is-lite .parallax .bg img{transform:scale(1.08)!important}

/* Flatten sticky film panels */
html.is-lite .scroll-panel{height:auto!important}
html.is-lite .scroll-panel>.section{
  position:relative!important;height:auto!important;min-height:auto!important;
}
/* Hero film must not stay sticky in Light — otherwise mobile gets ~170vh of dead scroll */
html.is-lite .hero-film{height:auto!important}
html.is-lite .hero-film .hero{
  position:relative!important;
  height:auto!important;
  min-height:100svh!important;
  overflow:visible!important;
}
html.is-lite .hero .wrap{
  transform:none!important;
  opacity:1!important;
  filter:none!important;
}
html.is-lite .bc-film,
html.is-lite .hero-film,
html.is-lite .story-reel{
  content-visibility:auto;
  contain-intrinsic-size:800px;
}
/* Light keeps a static readable pillar list (no sticky film scrub) */
html.is-lite .bc-film{height:auto!important}
html.is-lite .bc-sticky{display:none!important}
html.is-lite .bc-fallback{
  display:block!important;
  padding-bottom:max(120px,calc(88px + env(safe-area-inset-bottom)))!important;
}
html.is-lite .bc-constellation{display:none!important}

/* Veil / door — never trap the user */
html.is-lite #veil,
html.is-lite .veil{display:none!important}

/* ── Mobile headline readability (full + lite) ──
   Weight-950 + any negative tracking stacks Archivo glyphs on narrow screens.
   Prefer neutral tracking; JS keeps plain text (no split masks) on mobile. */
@media(max-width:700px){
  .h1,.h2,.h3,.statement,.quote,.ato-t,.bc-headline,.bc-bridge-line,
  .conc-title,.journey-combo,.story-reel-line,.hero-nr1-card h2,
  .pc-title,.pc-hook,.pc-closer,.spine-close,.umbrella-body h3,.menu-overlay a{
    letter-spacing:.05em!important;
    line-height:1.18!important;
    font-kerning:none;
    overflow-wrap:break-word;
    word-break:normal;
    hyphens:manual;
  }
  .h1,.hero .h1,.hero-title-roll{
    font-size:clamp(34px,9.6vw,52px)!important;
    max-width:100%;
    transform:none!important;
    opacity:1!important;
  }
  .h2{font-size:clamp(30px,8vw,46px)!important}
  /* Pillar film: keep titles inside the sticky stage (no horizontal clip) */
  .bc-stage{padding:0 22px!important;width:100%;box-sizing:border-box}
  .bc-chapter{max-width:100%!important;width:100%;min-width:0;box-sizing:border-box}
  .bc-headline{
    max-width:100%!important;
    font-size:clamp(32px,8.8vw,56px)!important;
    text-wrap:balance;
  }
  .bc-chapter:not(.bc-outro):not(.bc-chapter--phrase):not(.bc-bridge) .bc-headline{
    font-size:clamp(30px,8.4vw,48px)!important;
    max-width:min(16ch,100%)!important;
    margin-inline:auto;
    letter-spacing:.02em!important;
    padding-inline:2px;
  }
  .bc-chapter{transform:none!important}
  .bc-chapter--phrase .bc-headline{
    font-size:clamp(28px,7.8vw,48px)!important;
    max-width:14ch!important;
  }
  .bc-chapter:not(.bc-outro):not(.bc-chapter--phrase):not(.bc-bridge){
    padding-bottom:min(22vh,160px);
  }
  .bc-chapter:not(.bc-outro):not(.bc-chapter--phrase):not(.bc-bridge) .bc-sub{
    font-size:clamp(20px,5.8vw,32px)!important;
    max-width:18ch!important;
    letter-spacing:-.02em!important;
    opacity:1!important;
    transform:none!important;
  }
  .bc-node-tag{
    white-space:normal!important;
    max-width:11ch;
    line-height:1.15;
    letter-spacing:.08em!important;
  }
  .conc-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:10px}
  .conc-card{padding:12px 10px 14px!important;gap:8px;min-width:0}
  .conc-card img{width:82%;margin-inline:auto}
  .conc-card span{font-size:10px;letter-spacing:.06em;line-height:1.25}
  .conc-card:last-child{grid-column:1/-1;max-width:200px;justify-self:center;width:100%}
  .story-reel-line{max-width:min(14ch,100%)!important}
  .premium-mit h3{
    font-size:clamp(40px,11vw,72px)!important;
    letter-spacing:.02em!important;
    max-width:100%!important;
  }
  .pc-title{font-size:clamp(34px,9vw,56px)!important;max-width:100%}
  .spine-close{max-width:100%;overflow-wrap:break-word}
  .split-word,
  .bc-headline .bcw{
    display:inline!important;
    overflow:visible!important;
    padding:0!important;
    margin:0!important;
    vertical-align:baseline!important;
  }
  .split-word > span,
  .split-word span,
  .bc-headline .bcw > i{
    display:inline!important;
    transform:none!important;
    opacity:1!important;
    filter:none!important;
    transition:none!important;
    will-change:auto!important;
  }
}