/* =========================================================
CDM · CÓDIGO DE INTEGRIDAD · PREMIUM EVOLUTION V3
Microsoft Power Pages
HTML/CSS/Vanilla JS · sin dependencias externas
========================================================= */

.sgas-page.integridad28{
  --i28-green-950:#001f18;
  --i28-green-900:#003f2f;
  --i28-green-800:#075b42;
  --i28-green:#0b7a35;
  --i28-lime:#8bd936;
  --i28-lime-soft:#b7ee79;
  --i28-paper:#f3f1eb;
  --i28-paper-2:#ebe7dd;
  --i28-mint:#dfece4;
  --i28-ink:#061f18;
  --i28-text:#485650;
  --i28-muted:#74817c;
  --i28-white:#ffffff;
  --i28-line:rgba(0,63,47,.14);
  --i28-line-light:rgba(255,255,255,.14);
  --i28-shadow-soft:0 20px 55px rgba(0,31,24,.10);
  --i28-shadow-card:0 24px 65px rgba(0,31,24,.12);
  --i28-radius-sm:14px;
  --i28-radius-md:22px;
  --i28-radius-lg:30px;
  --i28-max:1440px;
  --i28-gutter:clamp(18px,5vw,72px);
  --i28-gutter-desktop:32px;
  --i28-gutter-tablet:24px;
  --i28-gutter-mobile:18px;
  --i28-section:clamp(84px,10vw,148px);
  --i28-ease:cubic-bezier(.2,.72,.2,1);

  width:100%;
  max-width:100%;
  margin:0;
  padding:0;
  overflow-x:hidden;
  background:var(--i28-white);
  color:var(--i28-ink);
  font-family:"Segoe UI Variable","Segoe UI",Arial,sans-serif;
  -webkit-font-smoothing:antialiased;
  text-rendering:optimizeLegibility;
}

.sgas-page.integridad28,
.sgas-page.integridad28 *,
.sgas-page.integridad28 *::before,
.sgas-page.integridad28 *::after{
  box-sizing:border-box;
}

.sgas-page.integridad28 img,
.sgas-page.integridad28 video,
.sgas-page.integridad28 svg{
  max-width:100%;
}

.sgas-page.integridad28 a{
  text-decoration:none!important;
}

.sgas-page.integridad28 button{
  font:inherit;
}

.sgas-page.integridad28 .container.integridad28-shell{
  width:100%;
  margin-inline:auto;
  padding-left:var(--i28-gutter-desktop);
  padding-right:var(--i28-gutter-desktop);
}

/*
Bootstrap conserva su comportamiento responsive de .container.
.integridad28-shell añade un gutter institucional controlado para
evitar que el contenido quede visualmente pegado a los extremos.
*/

.integridad28-skip{
  position:fixed;
  z-index:100000;
  left:14px;
  top:12px;
  transform:translateY(-160%);
  padding:10px 14px;
  border-radius:8px;
  background:#fff;
  color:var(--i28-ink)!important;
  box-shadow:0 10px 30px rgba(0,0,0,.15);
  font-weight:800;
}

.integridad28-skip:focus{
  transform:none;
}

/* =========================================================
NAVIGATION
========================================================= */

.integridad28-chapters{
  position:fixed;
  z-index:9900;
  right:18px;
  top:50%;
  display:flex;
  flex-direction:column;
  gap:8px;
  transform:translateY(-50%);
}

.integridad28-chapters a{
  display:flex;
  align-items:center;
  justify-content:flex-end;
  gap:8px;
  min-height:32px;
  color:#fff!important;
}

.integridad28-chapters a span{
  width:32px;
  height:32px;
  display:grid;
  place-items:center;
  border:1px solid rgba(255,255,255,.22);
  border-radius:50%;
  background:rgba(0,31,24,.58);
  color:#fff;
  backdrop-filter:blur(10px);
  -webkit-backdrop-filter:blur(10px);
  font-size:7px;
  font-weight:900;
  transition:
    background .25s ease,
    color .25s ease,
    transform .25s ease,
    border-color .25s ease;
}

.integridad28-chapters a b{
  max-width:0;
  overflow:hidden;
  opacity:0;
  white-space:nowrap;
  color:#fff;
  font-size:8px;
  font-weight:800;
  letter-spacing:.4px;
  transition:max-width .25s ease,opacity .25s ease;
}

.integridad28-chapters a:hover b,
.integridad28-chapters a[aria-current="true"] b{
  max-width:100px;
  opacity:1;
}

.integridad28-chapters a[aria-current="true"] span{
  background:var(--i28-lime);
  border-color:var(--i28-lime);
  color:var(--i28-ink);
  transform:scale(1.08);
}

/* =========================================================
SHARED TYPE
========================================================= */

.integridad28-display{
  margin:0;
  color:var(--i28-ink);
  font-size:clamp(48px,5.25vw,86px);
  font-weight:720;
  line-height:.92;
  letter-spacing:clamp(-4px,-.25vw,-2px);
}

.integridad28-display em{
  color:var(--i28-green);
  font-style:normal;
  font-weight:310;
}

.integridad28-display--light{
  color:#fff;
}

.integridad28-display--light em{
  color:var(--i28-lime);
}

.integridad28-chapter{
  display:flex;
  align-items:center;
  gap:11px;
  margin-bottom:28px;
  color:var(--i28-ink);
  font-size:9px;
  font-weight:900;
  letter-spacing:1.5px;
  text-transform:uppercase;
}

.integridad28-chapter span{
  color:var(--i28-green);
}

.integridad28-chapter i{
  width:42px;
  height:1px;
  background:currentColor;
  opacity:.24;
}

.integridad28-chapter--light{
  color:#fff;
}

.integridad28-chapter--light span{
  color:var(--i28-lime);
}

/* =========================================================
HERO
========================================================= */

.integridad28-hero{
  position:relative;
  min-height:clamp(760px,92vh,920px);
  overflow:hidden;
  background:var(--i28-green-950);
  color:#fff;
  isolation:isolate;
}

.integridad28-mesh{
  position:absolute;
  inset:0;
  z-index:-6;
  overflow:hidden;
  background:
    linear-gradient(130deg,#001b15 0%,#003427 48%,#001611 100%);
}

.integridad28-mesh__blob{
  position:absolute;
  border-radius:50%;
  filter:blur(78px);
  opacity:.74;
  mix-blend-mode:screen;
  will-change:transform;
}

.integridad28-mesh__blob--a{
  width:52vw;
  height:52vw;
  left:-15vw;
  top:-18vw;
  background:
    radial-gradient(circle,
      rgba(139,217,54,.82) 0%,
      rgba(11,122,53,.25) 44%,
      transparent 70%);
  animation:i28MeshA 16s ease-in-out infinite alternate;
}

.integridad28-mesh__blob--b{
  width:46vw;
  height:46vw;
  right:-8vw;
  top:1vw;
  background:
    radial-gradient(circle,
      rgba(61,140,255,.26) 0%,
      rgba(36,213,168,.15) 43%,
      transparent 72%);
  animation:i28MeshB 19s ease-in-out infinite alternate;
}

.integridad28-mesh__blob--c{
  width:42vw;
  height:42vw;
  left:38%;
  bottom:-20vw;
  background:
    radial-gradient(circle,
      rgba(178,242,71,.36) 0%,
      rgba(0,104,74,.20) 45%,
      transparent 74%);
  animation:i28MeshC 22s ease-in-out infinite alternate;
}

@keyframes i28MeshA{
  from{transform:translate3d(-2%,0,0) scale(.96)}
  to{transform:translate3d(9%,8%,0) scale(1.06)}
}

@keyframes i28MeshB{
  from{transform:translate3d(4%,-3%,0) scale(1)}
  to{transform:translate3d(-7%,8%,0) scale(.92)}
}

@keyframes i28MeshC{
  from{transform:translate3d(-4%,5%,0) scale(.94)}
  to{transform:translate3d(7%,-8%,0) scale(1.06)}
}

.integridad28-mesh__noise{
  position:absolute;
  inset:0;
  opacity:.10;
  background-image:
    radial-gradient(circle at 12% 18%,rgba(255,255,255,.16) 0 1px,transparent 1.2px),
    radial-gradient(circle at 76% 22%,rgba(139,217,54,.16) 0 1px,transparent 1.2px);
  background-size:48px 48px,72px 72px;
  mask-image:linear-gradient(180deg,#000 0%,rgba(0,0,0,.7) 72%,transparent 100%);
}

.integridad28-mesh__vignette{
  position:absolute;
  inset:0;
  background:
    radial-gradient(circle at 67% 47%,transparent 0 24%,rgba(0,18,13,.11) 55%,rgba(0,18,13,.66) 100%),
    linear-gradient(90deg,rgba(0,18,13,.52),transparent 46%,rgba(0,18,13,.08));
}

.integridad28-orbit-scene{
  position:absolute;
  z-index:-2;
  right:1%;
  top:7%;
  width:min(60vw,840px);
  height:78%;
  pointer-events:none;
  opacity:.86;
  will-change:transform;
}

.integridad28-orbit-scene svg{
  width:100%;
  height:100%;
  overflow:visible;
}

.integridad28-orbits ellipse{
  stroke:rgba(139,217,54,.17);
  stroke-width:1.05;
  transform-origin:650px 350px;
}

.integridad28-orbits ellipse:nth-child(1){
  animation:i28Orbit 22s linear infinite;
}

.integridad28-orbits ellipse:nth-child(2){
  animation:i28OrbitR 30s linear infinite;
}

.integridad28-orbits ellipse:nth-child(3){
  animation:i28Orbit 40s linear infinite;
}

@keyframes i28Orbit{
  to{transform:rotate(360deg)}
}

@keyframes i28OrbitR{
  to{transform:rotate(-360deg)}
}

.integridad28-connections path{
  stroke-dasharray:12 17;
  animation:i28Dash 13s linear infinite;
}

@keyframes i28Dash{
  to{stroke-dashoffset:-280}
}

.integridad28-nodes circle{
  transform-box:fill-box;
  transform-origin:center;
  animation:i28Pulse 3.8s ease-in-out infinite;
}

@keyframes i28Pulse{
  0%,100%{transform:scale(.82);opacity:.5}
  50%{transform:scale(1.35);opacity:1}
}

.integridad28-hero__ghost{
  position:absolute;
  z-index:-1;
  left:-1%;
  bottom:3%;
  color:rgba(255,255,255,.035);
  font-size:clamp(100px,14vw,245px);
  font-weight:900;
  line-height:.8;
  letter-spacing:-12px;
  white-space:nowrap;
  will-change:transform;
}

.integridad28-hero__shell{
  min-height:clamp(760px,92vh,920px);
  display:flex;
  flex-direction:column;
  padding-top:32px;
  padding-bottom:34px;
}

.integridad28-hero__top{
  display:grid;
  grid-template-columns:1fr auto auto;
  gap:30px;
  align-items:start;
}

.integridad28-hero__top .integridad28-chapter{
  margin:0;
}

.integridad28-brand{
  display:flex;
  align-items:center;
  gap:12px;
}

.integridad28-brand strong{
  color:var(--i28-lime);
  font-size:20px;
  letter-spacing:-.6px;
}

.integridad28-brand span{
  color:rgba(255,255,255,.58);
  font-size:7px;
  font-weight:900;
  line-height:1.45;
  letter-spacing:1px;
}

.integridad28-hero__meta{
  text-align:right;
}

.integridad28-hero__meta span,
.integridad28-hero__meta strong{
  display:block;
}

.integridad28-hero__meta span{
  color:rgba(255,255,255,.38);
  font-size:7px;
  font-weight:900;
  letter-spacing:1px;
}

.integridad28-hero__meta strong{
  margin-top:2px;
  color:var(--i28-lime);
  font-size:12px;
}

.integridad28-hero__main{
  flex:1;
  display:grid;
  grid-template-columns:minmax(0,1.08fr) minmax(340px,.62fr);
  gap:clamp(38px,6vw,82px);
  align-items:center;
  padding:54px 0 32px;
}

.integridad28-hero__copy{
  max-width:860px;
}

.integridad28-kicker{
  margin:0 0 18px;
  color:var(--i28-lime);
  font-size:9px;
  font-weight:900;
  letter-spacing:2px;
}

.integridad28-hero__title{
  max-width:900px;
  margin:0;
  color:#fff;
  font-size:clamp(64px,6.5vw,108px);
  font-weight:730;
  line-height:.84;
  letter-spacing:clamp(-6px,-.35vw,-3px);
}

.integridad28-mask{
  display:block;
  overflow:hidden;
  padding-bottom:.07em;
}

.integridad28-mask>b{
  display:block;
}

.integridad28-hero__title-soft{
  color:rgba(255,255,255,.34);
  font-weight:310!important;
}

.integridad28-hero__title-lime{
  color:var(--i28-lime);
  font-style:normal;
  font-weight:340!important;
}

.integridad28-hero__intro{
  max-width:650px;
  margin-top:28px;
}

.integridad28-hero__intro>p{
  max-width:590px;
  margin:0;
  color:rgba(255,255,255,.70);
  font-size:15px;
  line-height:1.72;
}

.integridad28-hero__actions{
  display:flex;
  flex-wrap:wrap;
  gap:16px;
  align-items:center;
  margin-top:28px;
}

.integridad28-doc{
  position:relative;
  min-height:66px;
  min-width:340px;
  display:grid;
  grid-template-columns:48px 1fr 34px;
  gap:12px;
  align-items:center;
  padding:9px 12px;
  overflow:hidden;
  border:1px solid rgba(139,217,54,.38);
  border-radius:999px;
  background:
    linear-gradient(135deg,rgba(255,255,255,.10),rgba(255,255,255,.035));
  color:#fff!important;
  backdrop-filter:blur(16px);
  -webkit-backdrop-filter:blur(16px);
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.08),
    0 16px 45px rgba(0,0,0,.16);
  transition:
    transform .22s ease,
    border-color .22s ease,
    box-shadow .22s ease,
    background .22s ease;
}

.integridad28-doc::before{
  content:"";
  position:absolute;
  inset:-50% auto -50% -32%;
  width:26%;
  transform:skewX(-18deg);
  background:linear-gradient(90deg,transparent,rgba(255,255,255,.13),transparent);
  transition:transform .65s ease;
}

.integridad28-doc:hover{
  border-color:var(--i28-lime);
  background:
    linear-gradient(135deg,rgba(255,255,255,.13),rgba(255,255,255,.045));
  box-shadow:
    0 20px 55px rgba(0,0,0,.22),
    0 0 30px rgba(139,217,54,.06);
}

.integridad28-doc:hover::before{
  transform:translateX(540%) skewX(-18deg);
}

.integridad28-doc.is-disabled{
  opacity:.5;
  pointer-events:none;
}

.integridad28-doc__badge{
  width:48px;
  height:48px;
  display:grid;
  place-items:center;
  border-radius:50%;
  background:var(--i28-lime);
  color:var(--i28-ink);
  font-size:8px;
  font-weight:900;
}

.integridad28-doc__copy small,
.integridad28-doc__copy strong{
  display:block;
}

.integridad28-doc__copy small{
  color:rgba(255,255,255,.45);
  font-size:7px;
  font-weight:900;
  letter-spacing:1px;
}

.integridad28-doc__copy strong{
  margin-top:3px;
  color:#fff;
  font-size:11px;
}

.integridad28-doc__arrow{
  width:32px;
  height:32px;
  display:grid;
  place-items:center;
  border:1px solid rgba(255,255,255,.14);
  border-radius:50%;
  color:var(--i28-lime);
}

.integridad28-explore{
  display:inline-flex;
  align-items:center;
  min-height:52px;
  padding:0 6px;
  color:#fff!important;
  font-size:9px;
  font-weight:900;
  letter-spacing:.5px;
  text-transform:uppercase;
}

.integridad28-explore span{
  margin-left:9px;
  color:var(--i28-lime);
  font-size:17px;
}

/* hero visual module */
.integridad28-console{
  position:relative;
  min-height:430px;
  padding:22px;
  overflow:hidden;
  border:1px solid rgba(255,255,255,.14);
  border-radius:var(--i28-radius-lg);
  background:
    linear-gradient(145deg,rgba(255,255,255,.09),rgba(255,255,255,.025));
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.08),
    0 28px 75px rgba(0,0,0,.22);
  backdrop-filter:blur(20px);
  -webkit-backdrop-filter:blur(20px);
  isolation:isolate;
}

.integridad28-console::before{
  content:"";
  position:absolute;
  inset:0;
  z-index:-1;
  background:
    radial-gradient(circle at var(--i28-mx,68%) var(--i28-my,28%),
      rgba(139,217,54,.13),
      transparent 30%);
}

.integridad28-console__top{
  display:flex;
  align-items:center;
  gap:10px;
  color:rgba(255,255,255,.44);
  font-size:7px;
  font-weight:900;
  letter-spacing:1px;
}

.integridad28-console__top i{
  flex:1;
  height:1px;
  background:rgba(255,255,255,.12);
}

.integridad28-console__top b{
  color:var(--i28-lime);
}

.integridad28-console__core{
  position:relative;
  min-height:250px;
  display:grid;
  place-items:center;
}

.integridad28-console__halo{
  position:absolute;
  width:220px;
  height:220px;
  border:1px solid rgba(139,217,54,.17);
  border-radius:50%;
  box-shadow:
    0 0 0 34px rgba(139,217,54,.022),
    0 0 0 66px rgba(139,217,54,.014);
  animation:i28Halo 8s ease-in-out infinite alternate;
}

@keyframes i28Halo{
  from{transform:scale(.96)}
  to{transform:scale(1.05)}
}

.integridad28-console__center{
  position:relative;
  z-index:2;
  width:132px;
  height:132px;
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  border:1px solid rgba(139,217,54,.38);
  border-radius:50%;
  background:
    radial-gradient(circle at 38% 30%,
      rgba(255,255,255,.14),
      rgba(139,217,54,.06) 42%,
      rgba(0,31,24,.46) 72%);
}

.integridad28-console__center small{
  color:rgba(255,255,255,.48);
  font-size:8px;
  font-weight:900;
}

.integridad28-console__center strong{
  margin-top:2px;
  color:var(--i28-lime);
  font-size:29px;
  letter-spacing:-1px;
}

.integridad28-console__center span{
  margin-top:2px;
  color:rgba(255,255,255,.40);
  font-size:6px;
  font-weight:900;
  letter-spacing:.7px;
}

.integridad28-console__wave{
  position:absolute!important;
  left:7%;
  right:7%;
  bottom:86px;
}

.integridad28-console__wave svg{
  width:100%;
  height:82px;
}

.integridad28-console__wave path{
  fill:none;
  stroke:rgba(139,217,54,.78);
  stroke-width:1.7;
  stroke-linecap:round;
  stroke-dasharray:390;
  stroke-dashoffset:390;
  filter:drop-shadow(0 0 5px rgba(139,217,54,.30));
  animation:i28Spark 4.5s ease-in-out infinite alternate;
}

@keyframes i28Spark{
  to{stroke-dashoffset:0}
}

.integridad28-console__status{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:7px;
}

.integridad28-console__status div{
  min-height:66px;
  padding:10px;
  border-top:1px solid rgba(255,255,255,.12);
}

.integridad28-console__status span,
.integridad28-console__status small,
.integridad28-console__status b{
  display:block;
}

.integridad28-console__status span{
  color:var(--i28-lime);
  font-size:7px;
  font-weight:900;
}

.integridad28-console__status small{
  margin-top:8px;
  color:rgba(255,255,255,.34);
  font-size:6px;
  font-weight:900;
}

.integridad28-console__status b{
  margin-top:2px;
  color:#fff;
  font-size:8px;
}

.integridad28-hero__bottom{
  display:flex;
  align-items:end;
  justify-content:space-between;
  gap:28px;
}

.integridad28-principles{
  display:flex;
  flex-wrap:wrap;
  gap:16px;
}

.integridad28-principles span{
  position:relative;
  padding-left:9px;
  color:rgba(255,255,255,.38);
  font-size:7px;
  font-weight:900;
  letter-spacing:1px;
}

.integridad28-principles span::before{
  content:"";
  position:absolute;
  left:0;
  top:50%;
  width:4px;
  height:4px;
  transform:translateY(-50%);
  border-radius:50%;
  background:var(--i28-lime);
}

.integridad28-scrollcue{
  display:flex;
  align-items:center;
  gap:10px;
}

.integridad28-scrollcue small{
  color:rgba(255,255,255,.36);
  font-size:7px;
  font-weight:900;
  letter-spacing:1px;
}

.integridad28-scrollcue>span{
  position:relative;
  width:64px;
  height:1px;
  overflow:hidden;
  background:rgba(255,255,255,.12);
}

.integridad28-scrollcue i{
  position:absolute;
  left:-32px;
  top:0;
  width:32px;
  height:1px;
  background:var(--i28-lime);
  animation:i28Cue 1.9s ease-in-out infinite;
}

@keyframes i28Cue{
  to{transform:translateX(96px)}
}

/* =========================================================
STATS
========================================================= */

.integridad28-stats{
  background:var(--i28-paper);
  border-bottom:1px solid var(--i28-line);
}

.integridad28-stats__inner{
  display:grid;
  grid-template-columns:repeat(4,1fr);
}

.integridad28-stats article{
  position:relative;
  min-height:215px;
  display:flex;
  flex-direction:column;
  justify-content:flex-end;
  padding:28px;
  border-right:1px solid var(--i28-line);
  transition:
    background .25s ease,
    transform .25s ease;
}

.integridad28-stats article:last-child{
  border-right:0;
}

.integridad28-stats article:hover{
  background:#fff;
  transform:translateY(-3px);
}

.integridad28-stats article>span{
  position:absolute;
  left:28px;
  top:24px;
  color:var(--i28-green);
  font-size:8px;
  font-weight:900;
}

.integridad28-stats strong{
  color:var(--i28-ink);
  font-size:clamp(54px,5vw,72px);
  line-height:.84;
  letter-spacing:-4px;
}

.integridad28-stats b,
.integridad28-stats small{
  display:block;
}

.integridad28-stats b{
  margin-top:16px;
  color:var(--i28-green);
  font-size:10px;
  text-transform:uppercase;
}

.integridad28-stats small{
  margin-top:4px;
  color:var(--i28-muted);
  font-size:8px;
  font-weight:800;
  letter-spacing:.5px;
  text-transform:uppercase;
}

.integridad28-stats__accent{
  background:var(--i28-lime)!important;
}

/* =========================================================
VIDEO
========================================================= */

.integridad28-film{
  padding:var(--i28-section) 0;
  background:#fff;
}

.integridad28-film__head{
  display:flex;
  align-items:end;
  justify-content:space-between;
  gap:34px;
  margin-bottom:32px;
}

.integridad28-film__head span{
  color:var(--i28-green);
  font-size:8px;
  font-weight:900;
  letter-spacing:1.3px;
}

.integridad28-film__head h2{
  max-width:780px;
  margin:0;
  color:var(--i28-ink);
  font-size:clamp(34px,4vw,58px);
  line-height:.98;
  letter-spacing:-2.8px;
}

.integridad28-film__head em{
  color:var(--i28-green);
  font-style:normal;
  font-weight:320;
}

.integridad28-film__frame{
  overflow:hidden;
  border-radius:var(--i28-radius-md);
  background:var(--i28-green-950);
  box-shadow:var(--i28-shadow-soft);
}

.integridad28-film video{
  display:block;
  width:100%;
  aspect-ratio:16/9;
  background:var(--i28-green-950);
}

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

.integridad28-intro{
  position:relative;
  overflow:hidden;
  padding:var(--i28-section) 0;
  background:#fff;
}

.integridad28-intro__ghost{
  position:absolute;
  left:-1%;
  top:4%;
  color:rgba(0,63,47,.038);
  font-size:clamp(160px,21vw,390px);
  font-weight:900;
  line-height:.8;
  letter-spacing:-22px;
  pointer-events:none;
}

.integridad28-intro__layout{
  position:relative;
  z-index:2;
  display:grid;
  grid-template-columns:minmax(300px,.72fr) minmax(0,1.28fr);
  gap:clamp(55px,7vw,95px);
  align-items:start;
}

.integridad28-intro__sticky{
  position:sticky;
  top:34px;
  padding-top:28px;
}

.integridad28-intro__sticky>p{
  max-width:490px;
  margin:26px 0 0;
  color:var(--i28-text);
  font-size:15px;
  line-height:1.75;
}

.integridad28-intro__story{
  display:grid;
  gap:20px;
  padding-top:72px;
}

.integridad28-story{
  min-height:290px;
  display:flex;
  flex-direction:column;
  justify-content:flex-end;
  padding:34px;
  border-radius:var(--i28-radius-sm);
  box-shadow:var(--i28-shadow-soft);
}

.integridad28-story>span{
  margin-bottom:10px;
  font-size:8px;
  font-weight:900;
  letter-spacing:1.2px;
}

.integridad28-story h3{
  max-width:720px;
  margin:0;
  font-size:clamp(30px,3vw,48px);
  line-height:1;
  letter-spacing:-2.2px;
}

.integridad28-story p{
  max-width:760px;
  margin:20px 0 0;
  font-size:15px;
  line-height:1.72;
}

.integridad28-story--dark{
  background:var(--i28-green-950);
  color:#fff;
}

.integridad28-story--dark p{
  color:rgba(255,255,255,.68);
}

.integridad28-story--dark strong{
  color:var(--i28-lime);
}

.integridad28-story--paper{
  margin-left:5%;
  background:var(--i28-paper);
}

.integridad28-story--mint{
  margin-left:10%;
  background:var(--i28-mint);
}

.integridad28-quote{
  position:relative;
  margin:0;
  padding:46px;
  overflow:hidden;
  border-radius:var(--i28-radius-sm);
  background:var(--i28-lime);
  color:var(--i28-ink);
}

.integridad28-quote>span{
  position:absolute;
  right:20px;
  top:-32px;
  color:rgba(0,31,24,.10);
  font-family:Georgia,serif;
  font-size:180px;
}

.integridad28-quote>p{
  position:relative;
  z-index:2;
  max-width:850px;
  margin:0;
  font-size:clamp(20px,2.2vw,26px);
  line-height:1.42;
  letter-spacing:-.8px;
}

.integridad28-quote footer{
  position:relative;
  z-index:2;
  margin-top:28px;
  padding-top:18px;
  border-top:1px solid rgba(0,31,24,.18);
}

.integridad28-quote strong,
.integridad28-quote small{
  display:block;
}

.integridad28-quote small{
  margin-top:4px;
  color:rgba(0,31,24,.58);
  font-size:7px;
  font-weight:900;
}

/* =========================================================
TYPEBAND
========================================================= */

.integridad28-typeband{
  overflow:hidden;
  padding:28px 0;
  background:var(--i28-lime);
}

.integridad28-typeband>div{
  width:max-content;
  display:flex;
  align-items:center;
  white-space:nowrap;
}

.integridad28-typeband span{
  margin:0 18px;
  color:var(--i28-ink);
  font-size:clamp(34px,3.6vw,56px);
  font-weight:780;
  letter-spacing:-1.8px;
}

.integridad28-typeband i{
  color:var(--i28-green-900);
  font-size:13px;
}

/* =========================================================
SECTION HEAD
========================================================= */

.integridad28-section-head{
  display:grid;
  grid-template-columns:minmax(0,1.15fr) minmax(280px,.52fr);
  gap:clamp(34px,6vw,72px);
  align-items:end;
  margin-bottom:58px;
}

.integridad28-section-head>p{
  margin:0;
  color:var(--i28-text);
  font-size:15px;
  line-height:1.72;
}

.integridad28-section-head--light>p{
  color:rgba(255,255,255,.60);
}

/* =========================================================
VALUES
========================================================= */

.integridad28-values{
  padding:var(--i28-section) 0 100px;
  overflow:hidden;
  background:var(--i28-paper);
}

.integridad28-values__viewport{
  width:100%;
  margin-inline:auto;
}

.integridad28-values__rail{
  display:flex;
  gap:16px;
  overflow-x:auto;
  overscroll-behavior-x:contain;
  padding:0 0 32px;
  scroll-snap-type:x mandatory;
  scrollbar-width:none;
  cursor:grab;
}

.integridad28-values__rail::-webkit-scrollbar{
  display:none;
}

.integridad28-values__rail.is-dragging{
  cursor:grabbing;
  scroll-snap-type:none;
}

.integridad28-value{
  position:relative;
  flex:0 0 min(430px,82vw);
  min-height:620px;
  display:flex;
  flex-direction:column;
  padding:30px;
  border-radius:var(--i28-radius-md);
  scroll-snap-align:center;
  color:var(--i28-ink);
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.18),
    0 12px 35px rgba(0,31,24,.06);
  transition:
    transform .3s var(--i28-ease),
    box-shadow .3s ease;
}

.integridad28-value::after{
  content:"";
  position:absolute;
  inset:0;
  border-radius:inherit;
  pointer-events:none;
  background:
    radial-gradient(circle at 80% 12%,rgba(255,255,255,.22),transparent 28%);
  opacity:.8;
}

.integridad28-value:hover{
  transform:translateY(-7px);
  box-shadow:var(--i28-shadow-card);
}

.integridad28-value__head{
  position:relative;
  z-index:1;
  display:flex;
  justify-content:space-between;
  align-items:flex-start;
}

.integridad28-value__head>span{
  font-size:64px;
  font-weight:850;
  line-height:.9;
  letter-spacing:-4px;
}

.integridad28-value__head svg{
  width:78px;
  height:78px;
  fill:none;
  stroke:currentColor;
  stroke-width:2.25;
  stroke-linecap:round;
  stroke-linejoin:round;
  opacity:.70;
  transition:transform .35s var(--i28-ease),opacity .35s ease;
}

.integridad28-value:hover .integridad28-value__head svg{
  transform:scale(1.06) rotate(2deg);
  opacity:.92;
}

.integridad28-value>small{
  position:relative;
  z-index:1;
  margin-top:auto;
  font-size:8px;
  font-weight:900;
  letter-spacing:1.3px;
}

.integridad28-value h3{
  position:relative;
  z-index:1;
  margin:8px 0 0;
  font-size:38px;
  line-height:.98;
  letter-spacing:-2px;
}

.integridad28-value__desc{
  position:relative;
  z-index:1;
  margin:12px 0 0;
  font-size:15px;
  line-height:1.55;
}

.integridad28-value__lists{
  position:relative;
  z-index:1;
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:12px;
  margin-top:24px;
}

.integridad28-value__lists>div{
  padding:14px;
  border-top:1px solid rgba(0,31,24,.16);
  background:rgba(255,255,255,.12);
}

.integridad28-value__lists b{
  display:inline-block;
  margin-bottom:8px;
  font-size:8px;
  font-weight:900;
  letter-spacing:1px;
  text-transform:uppercase;
}

.integridad28-value__lists .is-no b{
  color:#932c2c;
}

.integridad28-value__lists ul{
  margin:0;
  padding-left:16px;
}

.integridad28-value__lists li{
  margin:4px 0;
  font-size:11px;
  line-height:1.5;
}

.integridad28-value--green{
  background:#0a543f;
  color:#fff;
}

.integridad28-value--green .integridad28-value__lists>div{
  border-top-color:rgba(255,255,255,.18);
  background:rgba(255,255,255,.045);
}

.integridad28-value--cream{background:#f4e9cf}
.integridad28-value--lime{background:var(--i28-lime)}
.integridad28-value--blue{background:#8294d2}
.integridad28-value--gold{background:#e1bd43}
.integridad28-value--mint{background:#bfe4d3}
.integridad28-value--orange{background:#ed7c49}
.integridad28-value--violet{background:#a999d0}
.integridad28-value--red{background:#dc7a7a}

.integridad28-values__controls{
  display:flex;
  align-items:center;
  gap:28px;
  margin-top:10px;
}

.integridad28-values__progress{
  flex:1;
  height:2px;
  overflow:hidden;
  background:rgba(0,31,24,.12);
}

.integridad28-values__progress span{
  display:block;
  width:0;
  height:100%;
  background:var(--i28-green);
}

.integridad28-values__buttons{
  display:flex;
  gap:8px;
}

.integridad28-values__buttons button{
  width:46px;
  height:46px;
  border:1px solid rgba(0,31,24,.16);
  border-radius:50%;
  background:rgba(255,255,255,.18);
  color:var(--i28-ink);
  cursor:pointer;
  transition:
    background .2s ease,
    color .2s ease,
    transform .2s ease;
}

.integridad28-values__buttons button:hover{
  transform:translateY(-2px);
  background:var(--i28-green-950);
  color:#fff;
}

/* =========================================================
FOLLOW UP
========================================================= */

.integridad28-follow{
  position:relative;
  overflow:hidden;
  padding:var(--i28-section) 0;
  background:var(--i28-green-950);
  color:#fff;
}

.integridad28-follow::before{
  content:"";
  position:absolute;
  right:-15%;
  bottom:-35%;
  width:65vw;
  height:65vw;
  border-radius:50%;
  background:
    radial-gradient(circle,rgba(139,217,54,.08),transparent 65%);
}

.integridad28-follow__ghost{
  position:absolute;
  left:-3%;
  top:3%;
  color:rgba(255,255,255,.035);
  font-size:clamp(90px,13vw,230px);
  font-weight:900;
  letter-spacing:-12px;
  white-space:nowrap;
}

.integridad28-follow__layout{
  position:relative;
  z-index:2;
  display:grid;
  grid-template-columns:minmax(300px,.78fr) minmax(0,1.22fr);
  gap:clamp(55px,7vw,92px);
}

.integridad28-follow__lead{
  position:sticky;
  top:42px;
  padding-top:150px;
}

.integridad28-follow__lead p{
  max-width:550px;
  margin:20px 0 0;
  color:rgba(255,255,255,.63);
  font-size:15px;
  line-height:1.72;
}

.integridad28-timeline{
  position:relative;
  padding-top:64px;
}

.integridad28-timeline::before{
  content:"";
  position:absolute;
  left:24px;
  top:88px;
  bottom:34px;
  width:1px;
  background:
    linear-gradient(180deg,var(--i28-lime),rgba(139,217,54,.08));
}

.integridad28-timeline article{
  position:relative;
  min-height:175px;
  display:grid;
  grid-template-columns:58px 1fr;
  gap:22px;
  align-items:start;
  padding:28px 0;
  border-top:1px solid rgba(255,255,255,.16);
}

.integridad28-timeline article:last-child{
  border-bottom:1px solid rgba(255,255,255,.16);
}

.integridad28-timeline>article>span{
  position:relative;
  z-index:2;
  width:48px;
  height:48px;
  display:grid;
  place-items:center;
  border:1px solid rgba(139,217,54,.34);
  border-radius:50%;
  background:var(--i28-green-950);
  color:var(--i28-lime);
  font-size:9px;
  font-weight:900;
}

.integridad28-timeline small{
  color:var(--i28-lime);
  font-size:7px;
  font-weight:900;
  letter-spacing:1px;
}

.integridad28-timeline h3{
  margin:7px 0 0;
  color:#fff;
  font-size:25px;
  line-height:1.05;
  letter-spacing:-1px;
}

.integridad28-timeline p{
  max-width:690px;
  margin:12px 0 0;
  color:rgba(255,255,255,.63);
  font-size:14px;
  line-height:1.65;
}

/* =========================================================
CHANNELS
========================================================= */

.integridad28-channels{
  padding:var(--i28-section) 0;
  background:#071f19;
  color:#fff;
}

.integridad28-channels__grid{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:14px;
}

.integridad28-channel{
  position:relative;
  min-height:315px;
  display:flex;
  flex-direction:column;
  padding:28px;
  overflow:hidden;
  border:1px solid rgba(255,255,255,.13);
  border-radius:var(--i28-radius-md);
  background:
    linear-gradient(145deg,rgba(255,255,255,.045),rgba(255,255,255,.015));
  transition:
    transform .25s var(--i28-ease),
    border-color .25s ease,
    background .25s ease,
    box-shadow .25s ease;
}

.integridad28-channel::before{
  content:"";
  position:absolute;
  right:-90px;
  top:-90px;
  width:180px;
  height:180px;
  border-radius:50%;
  background:
    radial-gradient(circle,rgba(139,217,54,.12),transparent 70%);
  opacity:0;
  transform:scale(.7);
  transition:opacity .3s ease,transform .3s ease;
}

.integridad28-channel--wide{
  grid-column:span 2;
}

.integridad28-channel:hover{
  transform:translateY(-5px);
  border-color:rgba(139,217,54,.36);
  background:
    linear-gradient(145deg,rgba(255,255,255,.065),rgba(255,255,255,.022));
  box-shadow:0 20px 50px rgba(0,0,0,.16);
}

.integridad28-channel:hover::before{
  opacity:1;
  transform:scale(1);
}

.integridad28-channel>span{
  position:absolute;
  right:24px;
  top:22px;
  color:rgba(255,255,255,.28);
  font-size:8px;
  font-weight:900;
}

.integridad28-channel svg{
  width:56px;
  height:56px;
  margin-bottom:auto;
  fill:none;
  stroke:var(--i28-lime);
  stroke-width:1.9;
  stroke-linecap:round;
  stroke-linejoin:round;
  transition:transform .3s var(--i28-ease);
}

.integridad28-channel:hover svg{
  transform:translateY(-3px) scale(1.04);
}

.integridad28-channel>small{
  color:var(--i28-lime);
  font-size:7px;
  font-weight:900;
  letter-spacing:1.2px;
}

.integridad28-channel h3{
  margin:9px 0 0;
  color:#fff;
  font-size:30px;
  line-height:1;
  letter-spacing:-1.3px;
}

.integridad28-channel p{
  max-width:620px;
  margin:14px 0 0;
  color:rgba(255,255,255,.60);
  font-size:12px;
  line-height:1.62;
}

.integridad28-channel strong{
  margin-top:20px;
  color:#fff;
  font-size:11px;
  line-height:1.55;
  word-break:break-word;
}

.integridad28-channel--lime{
  background:var(--i28-lime);
  color:var(--i28-ink);
  border-color:var(--i28-lime);
}

.integridad28-channel--lime svg{
  stroke:var(--i28-ink);
}

.integridad28-channel--lime>small,
.integridad28-channel--lime h3,
.integridad28-channel--lime strong{
  color:var(--i28-ink);
}

.integridad28-channel--lime p{
  color:rgba(0,31,24,.67);
}

/* =========================================================
FOOTER
========================================================= */

.integridad28-end{
  position:relative;
  min-height:560px;
  display:flex;
  align-items:center;
  overflow:hidden;
  background:var(--i28-paper);
}

.integridad28-end__ghost{
  position:absolute;
  left:-1%;
  bottom:-2%;
  color:rgba(0,31,24,.038);
  font-size:clamp(105px,15vw,270px);
  font-weight:900;
  letter-spacing:-14px;
  white-space:nowrap;
}

.integridad28-end__top{
  display:flex;
  justify-content:space-between;
  gap:30px;
  padding-bottom:26px;
  margin-bottom:66px;
  border-bottom:1px solid var(--i28-line);
}

.integridad28-end__top span{
  color:var(--i28-green);
  font-size:8px;
  font-weight:900;
  letter-spacing:1px;
}

.integridad28-end__top a{
  color:var(--i28-ink)!important;
  font-size:9px;
  font-weight:900;
}

.integridad28-end__content{
  position:relative;
  z-index:2;
}

.integridad28-end__content>a{
  display:inline-flex;
  align-items:center;
  gap:12px;
  margin-top:34px;
  padding-bottom:7px;
  border-bottom:1px solid var(--i28-ink);
  color:var(--i28-ink)!important;
  font-size:11px;
  font-weight:900;
}

/* =========================================================
PROGRESS / BACK TO TOP
========================================================= */

.integridad28-progress{
  position:fixed;
  z-index:9998;
  left:0;
  right:0;
  top:0;
  height:3px;
  pointer-events:none;
}

.integridad28-progress span{
  display:block;
  width:0;
  height:100%;
  background:var(--i28-lime);
  will-change:width;
}

.integridad28-backtop{
  position:fixed;
  z-index:9999;
  right:18px;
  bottom:18px;
  width:46px;
  height:46px;
  border:0;
  border-radius:50%;
  background:var(--i28-ink);
  color:#fff;
  cursor:pointer;
  opacity:0;
  visibility:hidden;
  transform:translateY(8px);
  box-shadow:0 12px 30px rgba(0,0,0,.15);
  transition:
    opacity .2s ease,
    visibility .2s ease,
    transform .2s ease;
}

.integridad28-backtop.is-visible{
  opacity:1;
  visibility:visible;
  transform:none;
}

/* =========================================================
MOTION
========================================================= */

.integridad28.integridad28-motion-ready [data-i28-reveal]{
  opacity:0;
  transform:translateY(30px);
  transition:
    opacity .72s var(--i28-ease),
    transform .72s var(--i28-ease);
}

.integridad28.integridad28-motion-ready [data-i28-reveal].is-visible{
  opacity:1;
  transform:none;
}

[data-i28-hero-line]{
  transform:translateY(105%);
  opacity:0;
  transition:
    transform .88s cubic-bezier(.2,.75,.2,1),
    opacity .64s ease;
}

.integridad28-mask:nth-child(2) [data-i28-hero-line]{
  transition-delay:.07s;
}

.integridad28-mask:nth-child(3) [data-i28-hero-line]{
  transition-delay:.14s;
}

[data-i28-hero-reveal]{
  transform:translateY(16px);
  opacity:0;
  transition:
    transform .70s ease,
    opacity .70s ease;
}

.integridad28.integridad28-hero-ready [data-i28-hero-line],
.integridad28.integridad28-hero-ready [data-i28-hero-reveal]{
  transform:none;
  opacity:1;
}

/* =========================================================
RESPONSIVE · 1200
========================================================= */

@media(max-width:1200px){
  .integridad28-hero__main{
    grid-template-columns:minmax(0,1fr) minmax(310px,.52fr);
    gap:42px;
  }

  .integridad28-hero__title{
    font-size:clamp(60px,6.8vw,90px);
  }

  .integridad28-orbit-scene{
    right:-8%;
    width:68vw;
    opacity:.72;
  }
}

/* =========================================================
RESPONSIVE · 992
========================================================= */

@media(max-width:992px){
  .sgas-page.integridad28 .container.integridad28-shell{
    padding-left:var(--i28-gutter-tablet);
    padding-right:var(--i28-gutter-tablet);
  }

  .integridad28-values__viewport.container{
    padding-left:var(--i28-gutter-tablet);
    padding-right:var(--i28-gutter-tablet);
  }

  .integridad28-chapters{
    display:none;
  }

  .integridad28-hero{
    min-height:1080px;
  }

  .integridad28-hero__shell{
    min-height:1080px;
  }

  .integridad28-hero__main{
    display:block;
    padding-top:72px;
  }

  .integridad28-hero__copy{
    max-width:760px;
  }

  .integridad28-console{
    width:min(100%,600px);
    min-height:390px;
    margin:48px 0 0 auto;
  }

  .integridad28-orbit-scene{
    right:-20%;
    top:36%;
    width:95vw;
    height:55%;
    opacity:.48;
  }

  .integridad28-stats__inner{
    grid-template-columns:repeat(2,1fr);
  }

  .integridad28-intro__layout,
  .integridad28-follow__layout{
    grid-template-columns:1fr;
    gap:48px;
  }

  .integridad28-intro__sticky,
  .integridad28-follow__lead{
    position:relative;
    top:auto;
    padding-top:0;
  }

  .integridad28-intro__story{
    padding-top:0;
  }

  .integridad28-section-head{
    grid-template-columns:1fr;
    gap:22px;
  }

  .integridad28-channels__grid{
    grid-template-columns:1fr 1fr;
  }

  .integridad28-channel--wide{
    grid-column:span 1;
  }
}

/* =========================================================
RESPONSIVE · 768
========================================================= */

@media(max-width:768px){
  .sgas-page.integridad28 .container.integridad28-shell{
    padding-left:var(--i28-gutter-mobile);
    padding-right:var(--i28-gutter-mobile);
  }

  .integridad28-values__viewport.container{
    padding-left:var(--i28-gutter-mobile);
    padding-right:var(--i28-gutter-mobile);
  }

  .integridad28-display{
    font-size:clamp(40px,10vw,54px);
    line-height:.96;
    letter-spacing:-2.5px;
  }

  .integridad28-hero{
    min-height:1040px;
  }

  .integridad28-hero__shell{
    min-height:1040px;
    padding-top:24px;
    padding-bottom:26px;
  }

  .integridad28-hero__top{
    grid-template-columns:1fr auto;
  }

  .integridad28-brand{
    display:none;
  }

  .integridad28-hero__main{
    padding-top:62px;
  }

  .integridad28-hero__title{
    font-size:clamp(46px,12vw,62px);
    line-height:.88;
    letter-spacing:-3px;
  }

  .integridad28-hero__intro>p{
    font-size:14px;
  }

  .integridad28-doc{
    width:100%;
    min-width:0;
  }

  .integridad28-console{
    min-height:360px;
    margin-top:42px;
    padding:18px;
    border-radius:22px;
  }

  .integridad28-console__core{
    min-height:220px;
  }

  .integridad28-console__halo{
    width:190px;
    height:190px;
  }

  .integridad28-console__center{
    width:116px;
    height:116px;
  }

  .integridad28-orbit-scene{
    top:45%;
    right:-48%;
    width:145vw;
    height:48%;
    opacity:.34;
  }

  .integridad28-hero__bottom{
    display:block;
  }

  .integridad28-scrollcue{
    margin-top:18px;
  }

  .integridad28-stats__inner{
    grid-template-columns:1fr;
  }

  .integridad28-stats article{
    min-height:170px;
    border-right:0;
    border-bottom:1px solid var(--i28-line);
  }

  .integridad28-film,
  .integridad28-intro,
  .integridad28-values,
  .integridad28-follow,
  .integridad28-channels{
    padding-top:78px;
    padding-bottom:78px;
  }

  .integridad28-film__head{
    display:block;
  }

  .integridad28-film__head h2{
    margin-top:8px;
  }

  .integridad28-film__frame{
    border-radius:16px;
  }

  .integridad28-story,
  .integridad28-story--paper,
  .integridad28-story--mint{
    min-height:0;
    margin-left:0;
    padding:26px 22px;
    border-radius:14px;
  }

  .integridad28-story h3{
    font-size:32px;
  }

  .integridad28-quote{
    padding:30px 22px;
  }

  .integridad28-value{
    flex-basis:min(86vw,400px);
    min-height:610px;
  }

  .integridad28-value__lists{
    grid-template-columns:1fr;
  }

  .integridad28-values__buttons{
    display:none;
  }

  .integridad28-timeline{
    padding-top:22px;
  }

  .integridad28-timeline article{
    grid-template-columns:50px 1fr;
    min-height:145px;
  }

  .integridad28-timeline::before{
    left:24px;
    top:46px;
  }

  .integridad28-channels__grid{
    grid-template-columns:1fr;
  }

  .integridad28-channel{
    min-height:290px;
  }

  .integridad28-end{
    min-height:500px;
  }

  .integridad28-end__top{
    margin-bottom:52px;
  }
}

/* =========================================================
RESPONSIVE · 576
========================================================= */

@media(max-width:576px){
  .integridad28-hero{
    min-height:1080px;
  }

  .integridad28-hero__shell{
    min-height:1080px;
  }

  .integridad28-hero__title{
    font-size:clamp(42px,12.5vw,54px);
  }

  .integridad28-kicker{
    letter-spacing:1.4px;
  }

  .integridad28-hero__actions{
    display:block;
  }

  .integridad28-explore{
    margin-top:10px;
  }

  .integridad28-console__status{
    grid-template-columns:1fr;
  }

  .integridad28-console__status div{
    min-height:0;
    display:grid;
    grid-template-columns:24px 1fr auto;
    align-items:center;
    gap:6px;
  }

  .integridad28-console__status small{
    margin-top:0;
  }

  .integridad28-console__status b{
    margin-top:0;
  }

  .integridad28-principles{
    gap:10px 14px;
  }

  .integridad28-value{
    flex-basis:min(100%,400px);
    padding:24px;
  }

  .integridad28-value__head>span{
    font-size:55px;
  }

  .integridad28-value h3{
    font-size:34px;
  }

  .integridad28-typeband span{
    font-size:30px;
  }

  .integridad28-end__top{
    display:block;
  }

  .integridad28-end__top a{
    display:inline-block;
    margin-top:10px;
  }
}

/* =========================================================
RESPONSIVE · 414 / 390 / 375 / 320
========================================================= */

@media(max-width:414px){
  .sgas-page.integridad28 .container.integridad28-shell,
  .integridad28-values__viewport.container{
    padding-left:14px;
    padding-right:14px;
  }

  .integridad28-hero{
    min-height:1100px;
  }

  .integridad28-hero__shell{
    min-height:1100px;
  }

  .integridad28-hero__title{
    font-size:46px;
    letter-spacing:-2.7px;
  }

  .integridad28-doc{
    grid-template-columns:44px 1fr 30px;
  }

  .integridad28-doc__badge{
    width:44px;
    height:44px;
  }
}

@media(max-width:375px){
  .integridad28-hero__title{
    font-size:42px;
  }

  .integridad28-doc__copy strong{
    font-size:10px;
  }

  .integridad28-value{
    min-height:630px;
  }
}

@media(max-width:320px){
  .sgas-page.integridad28 .container.integridad28-shell,
  .integridad28-values__viewport.container{
    padding-left:12px;
    padding-right:12px;
  }

  .integridad28-hero{
    min-height:1120px;
  }

  .integridad28-hero__shell{
    min-height:1120px;
  }

  .integridad28-hero__title{
    font-size:38px;
    letter-spacing:-2px;
  }

  .integridad28-doc{
    min-height:62px;
    grid-template-columns:40px 1fr 28px;
    gap:9px;
  }

  .integridad28-doc__badge{
    width:40px;
    height:40px;
  }

  .integridad28-value{
    flex-basis:100%;
    padding:20px;
  }
}

/* =========================================================
ACCESSIBILITY
========================================================= */

.sgas-page.integridad28 :focus-visible{
  outline:3px solid var(--i28-lime);
  outline-offset:4px;
}

@media(prefers-reduced-motion:reduce){
  .integridad28 *,
  .integridad28 *::before,
  .integridad28 *::after{
    animation:none!important;
    transition:none!important;
    scroll-behavior:auto!important;
  }

  .integridad28.integridad28-motion-ready [data-i28-reveal],
  [data-i28-hero-line],
  [data-i28-hero-reveal]{
    opacity:1!important;
    transform:none!important;
  }
}


/* =========================================================
BOOTSTRAP CONTAINER INTEGRATION · FINAL RESPONSIVE GUARD
========================================================= */

.sgas-page.integridad28 .integridad28-values__viewport.container{
  width:100%;
  max-width:var(--i28-max);
  margin-inline:auto;
  padding-left:var(--i28-gutter-desktop);
  padding-right:var(--i28-gutter-desktop);
}

@media(max-width:992px){
  .sgas-page.integridad28 .integridad28-values__viewport.container{
    padding-left:var(--i28-gutter-tablet);
    padding-right:var(--i28-gutter-tablet);
  }
}

@media(max-width:768px){
  .sgas-page.integridad28 .integridad28-values__viewport.container{
    padding-left:var(--i28-gutter-mobile);
    padding-right:var(--i28-gutter-mobile);
  }
}

@media(max-width:414px){
  .sgas-page.integridad28 .integridad28-values__viewport.container{
    padding-left:14px;
    padding-right:14px;
  }
}

@media(max-width:320px){
  .sgas-page.integridad28 .integridad28-values__viewport.container{
    padding-left:12px;
    padding-right:12px;
  }
}