/* home-defer.css — below-fold / story / rails. Loaded non-blocking from index.html. */

/* <<< concepts.css >>> */
.concepts{padding-left:0;padding-right:0}
.concept-intro{padding-left:6vw;padding-right:6vw;align-items:start}
.concept-intro .story-instruction{grid-column:1 / 3;align-self:start;width:100%;max-width:36rem;margin:1.2rem 0 0!important;justify-self:start}
@media(min-width:821px){
  .concept-intro .concept-lead{
    position:sticky;
    top:calc(82px + 2.75rem);
    align-self:start;
    z-index:5;
    margin:0;
    font-size:1rem;
    line-height:1.55;
    color:#d0d0d0;
  }
  .home-story.story-active .concept-intro .concept-lead{
    top:calc(82px + 72px + 1.35rem);
  }
}
@media(max-width:820px){
  .concepts{
    padding-left:0!important;
    padding-right:0!important;
  }
  .concept-intro{
    display:grid!important;
    grid-template-columns:1fr!important;
    gap:1.1rem;
    align-items:start;
    padding:0 5vw 10vw!important;
    box-sizing:border-box;
    max-width:100%;
  }
  .concept-intro > span,
  .concept-intro > h2,
  .concept-intro > p,
  .concept-intro .story-instruction{
    grid-column:1!important;
    width:100%;
    max-width:none;
    justify-self:stretch;
  }
  .concept-intro .concept-lead{
    position:static;
    color:#cfcfcf;
    margin:0;
  }
  .concept-intro .story-instruction{
    margin-top:.4rem!important;
  }
}
.concept-nav{position:sticky;top:82px;z-index:6;height:72px;background:rgba(11,12,10,.94);backdrop-filter:blur(14px);border-bottom:1px solid #3a3a3a;display:grid;grid-template-columns:repeat(3,1fr);padding:0 6vw}.concept-nav a{
  display:flex;
  align-items:center;
  justify-content:center;
  gap:.8rem;
  color:#777;
  font:500 .82rem "Space Grotesk";
  text-transform:uppercase;
  letter-spacing:.08em;
  border-bottom:3px solid transparent;
  transition:color .25s,border-color .25s;
}
.concept-nav a.active{
  color:var(--grade-color,var(--lime));
  border-color:var(--grade-color,var(--lime));
}
.home-story{--grade-color:#df3b2f}.concept-card{max-width:none;margin:0;min-height:92vh;padding:0!important;display:grid!important;grid-template-columns:1fr 1fr!important;align-items:stretch}.concept-card .concept-visual{min-height:92vh;overflow:hidden}.concept-card .concept-visual picture{display:block;width:100%;height:100%}.concept-card .concept-visual img{width:100%;height:100%;object-fit:cover;display:block}.concept-card .concept-body{padding:8vw 6vw!important;display:block!important;align-self:center}.concept-card .concept-body .eyebrow{color:var(--lime)}.concept-card h3,.concept-card .concept-title{font-size:clamp(3.2rem,5.6vw,7rem)!important;margin:2rem 0 2.5rem;font-family:"Space Grotesk",sans-serif;font-weight:500;line-height:.98;letter-spacing:-.045em}.concept-card .concept-body>p:not(.eyebrow){max-width:720px}.concept-card ul{grid-column:auto!important;max-width:580px;margin-top:3rem}.concept-card.sustainable .concept-visual{order:2}.concept-card.sustainable .concept-body{order:1}.concept-card .number{font-size:1rem}@media(max-width:820px){.concept-nav{top:66px;height:60px;padding:0 2vw}.concept-nav a{font-size:.68rem;gap:.35rem}.concept-nav a span{display:none}.concept-card{grid-template-columns:1fr!important;min-height:0;padding:0!important;width:100%;max-width:100%;box-sizing:border-box}.concept-card .concept-visual{min-height:55vh}.concept-card .concept-body{padding:14vw 5vw!important;box-sizing:border-box;max-width:100%}.concept-card.sustainable .concept-visual{order:0}.concept-card.sustainable .concept-body{order:1}.concept-card h3,.concept-card .concept-title{font-size:clamp(2.6rem,11vw,4.4rem)!important;max-width:100%}}

.passivhaus-cred{
  display:flex;
  align-items:center;
  gap:1.1rem;
  margin-top:2.4rem;
  max-width:520px;
  padding-top:1.4rem;
  border-top:1px solid #444;
}
.passivhaus-cred__logo{
  flex:0 0 auto;
  width:88px;
  height:88px;
  display:block;
  line-height:0;
}
.passivhaus-cred__logo svg{
  display:block;
  width:88px;
  height:88px;
}
.passivhaus-cred__text{
  display:grid;
  gap:.35rem;
}
.passivhaus-cred__text strong{
  font:600 .78rem "Space Grotesk",sans-serif;
  letter-spacing:.08em;
  text-transform:uppercase;
  color:var(--lime);
}
.passivhaus-cred__text span{
  font-size:.88rem;
  line-height:1.45;
  color:#cfcfcf;
}
@media(max-width:820px){
  .passivhaus-cred{max-width:none}
}


/* <<< advantages.css >>> */
.advantages{background:var(--lime);padding:10vw 6vw}
.advantages-head,
.proof-copy{
  display:grid;
  grid-template-columns:.3fr 1.1fr .7fr;
  gap:4vw;
  align-items:start;
  padding-bottom:6vw;
  border-bottom:1px solid rgba(0,0,0,.25);
}
.proof-copy{border-bottom:0;padding-bottom:0}
.advantages-head > .eyebrow,
.proof-copy > .eyebrow{grid-column:1}
.advantages-head > h2,
.proof-copy > h2{grid-column:2;min-width:0;margin:0}
.advantages-head > .advantages-aside,
.proof-copy > .proof-aside{grid-column:3;margin:0}
.advantages-sticky,
.proof-sticky{
  position:sticky;
  top:calc(82px + 1.5rem);
  align-self:start;
  height:fit-content;
  z-index:2;
}
.advantages-aside,
.proof-aside{
  font-size:.95rem;
  line-height:1.55;
  max-width:390px;
}
.advantages-punch{
  padding:6vw 0 5vw;
  max-width:52rem;
}
.advantages-punch__lead{
  margin:0 0 1rem;
  font:500 clamp(2.2rem,4.2vw,4.2rem)/1.05 "Space Grotesk",sans-serif;
  letter-spacing:-.045em;
}
.advantages-punch__sub{
  margin:0;
  font-size:clamp(1.05rem,1.4vw,1.35rem);
  line-height:1.4;
  max-width:36rem;
}
.advantages-star{
  display:inline-block;
  margin-right:.12em;
  font-weight:500;
}
.advantages-head h2,
.proof-copy h2,
.proof h2{
  font-size:clamp(3.5rem,6vw,7.5rem);
  font-weight:500;
}
.advantage-grid{display:grid;grid-template-columns:repeat(3,1fr);width:100%}
.advantage-grid article{padding:4vw 3vw 4vw 0;border-bottom:1px solid rgba(0,0,0,.25);min-height:330px}
.advantage-grid article:not(:nth-child(3n+1)){padding-left:3vw;border-left:1px solid rgba(0,0,0,.25)}
.advantage-grid article>span{display:block;font:500 2.5rem "Space Grotesk";margin-bottom:4rem}
.advantage-grid h3{font-size:clamp(1.8rem,2.5vw,3rem);margin-bottom:1.2rem}
.advantage-grid p{font-size:.9rem;max-width:390px}
.proof{background:var(--paper);padding:10vw 6vw}
.counter-featured{
  margin-top:8vw;
  padding-top:4vw;
  border-top:1px solid var(--black);
  display:flex;
  flex-direction:column;
  align-items:flex-start;
  gap:0;
  max-width:52rem;
}
.counter-featured .counter-icon{
  display:block;
  width:clamp(4.5rem,7vw,7rem);
  height:auto;
  margin:0 0 1.4rem;
  object-fit:contain;
}
.counter-featured__text{
  display:flex;
  flex-direction:column;
  align-items:flex-start;
  min-width:0;
}
.counter-featured strong{
  font:500 clamp(6rem,14vw,12rem)/.9 "Space Grotesk",sans-serif;
  letter-spacing:-.07em;
  display:block;
  transform:translate3d(0,18px,0) scale(.92);
  opacity:.35;
  filter:blur(2px);
  transition:transform .9s cubic-bezier(.16,1,.3,1),opacity .9s ease,filter .9s ease;
}
.counter-featured strong.is-counting,
.counter-featured strong.is-done{
  transform:none;
  opacity:1;
  filter:none;
}
.counter-featured span{
  margin-top:1.2rem;
  font:600 clamp(.95rem,1.4vw,1.15rem) Raleway,sans-serif;
  text-transform:uppercase;
  letter-spacing:.1em;
}
@media(min-width:821px){
  .counter-featured{
    flex-direction:row;
    align-items:center;
    gap:clamp(2rem,4vw,4.5rem);
    max-width:none;
  }
  .counter-featured .counter-icon{
    width:clamp(9rem,14vw,14rem);
    margin:0;
    flex:0 0 auto;
  }
  .counter-featured strong{
    font-size:clamp(7rem,12vw,11rem);
  }
  .counter-featured span{
    margin-top:.9rem;
  }
}
@media(max-width:820px){
  .advantages,.proof{padding:18vw 7vw}
  .advantages-head,
  .proof-copy{grid-template-columns:1fr;gap:1.4rem;padding-bottom:10vw}
  .advantages-head > .eyebrow,
  .advantages-head > h2,
  .advantages-head > .advantages-aside,
  .proof-copy > .eyebrow,
  .proof-copy > h2,
  .proof-copy > .proof-aside{grid-column:1}
  .advantages-sticky,
  .proof-sticky{position:static}
  .advantages-aside,
  .proof-aside{max-width:none}
  .advantage-grid{grid-template-columns:1fr}
  .advantage-grid article,
  .advantage-grid article:not(:nth-child(3n+1)){padding:3rem 0;border-left:0;min-height:0}
  .advantage-grid article>span{margin-bottom:2rem}
  .contact h2{font-size:clamp(4rem,16vw,7rem)}
}


/* <<< narrative.css >>> */
.manifest{align-items:start;overflow-x:clip}
.manifest .sticky-title{
  position:sticky;
  top:calc(82px + 1.5rem);
  align-self:start;
  height:fit-content;
  z-index:2;
  max-width:100%;
  min-width:0;
  container-type:inline-size;
  container-name:manifest-title;
}
.manifest .sticky-title h2{
  /*
    Tamaño máximo acotado por “autosuficientes” (~7.9em con letter-spacing).
    100cqi / 7.9 ≈ 12.66cqi → la palabra llena la columna sin partirse.
  */
  font-size:clamp(2.75rem, 12.66cqi, 7rem)!important;
  max-width:100%;
  overflow-wrap:normal;
  word-break:normal;
  hyphens:manual;
  line-height:1.02;
  letter-spacing:-.04em;
}
.manifest .sticky-title .nowrap{
  white-space:nowrap;
}
@media(max-width:820px){
  .manifest .sticky-title{position:static}
  .manifest.lime-section{
    padding-left:7vw!important;
    padding-right:7vw!important;
    box-sizing:border-box;
    width:100%;
    max-width:100vw;
  }
  .manifest .sticky-title h2{
    font-size:clamp(2.4rem, 12.66cqi, 7rem)!important;
    letter-spacing:-.035em;
    line-height:1.02;
  }
}
.home-story .conclusion{
  max-width:900px;
  width:100%;
  margin:8vw auto 0;
  padding:0 1.5rem 8vw;
  box-sizing:border-box;
  text-align:center;
  font-size:clamp(1.25rem, 1.1rem + 0.4vw, 1.45rem);
}
.home-story .conclusion strong{
  display:block;
  margin-top:1rem;
  max-width:none;
}
.home-story .conclusion-cta{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-width:min(22rem, 100%);
  padding:1.15rem 2.2rem;
  margin-top:2.75rem;
  opacity:0;
  transform:translateY(28px);
  pointer-events:none;
  transition:opacity .7s ease,transform .85s cubic-bezier(0.16,1,0.3,1);
}
.home-story.is-complete .conclusion-cta{
  opacity:1;
  transform:none;
  pointer-events:auto;
  transition-delay:.12s;
}
@media(prefers-reduced-motion:reduce){
  .home-story .conclusion-cta{
    transition:none;
    transform:none;
  }
  .home-story.is-complete .conclusion-cta{opacity:1}
}
@media(max-width:820px){
  .home-story .conclusion{
    margin:12vw auto 0;
    padding:0 7vw 14vw;
    text-align:center;
    font-size:1.15rem;
  }
  .home-story .conclusion-cta{
    margin-top:2.2rem;
    width:100%;
    max-width:22rem;
    min-width:0;
  }
}
.proof-bridge{font:500 clamp(3rem,7vw,8rem)/1 "Space Grotesk";letter-spacing:-.06em;margin-top:8vw;padding-top:3vw;border-top:1px solid var(--black)}.counter.pending strong{opacity:.28}@media(max-width:820px){.proof-bridge{font-size:clamp(3rem,14vw,5rem);margin-top:14vw}}


/* <<< v2-experience.css >>> */
.home-story{--story-progress:0;position:relative;isolation:isolate}
.story-instruction{margin-top:1.5rem!important;color:#a5a5a5!important;font-size:clamp(1rem,1.25vw,1.25rem)!important;max-width:42rem;line-height:1.45}

/* —— Rail lateral (original) —— */
.energy-rail{
  position:fixed;
  z-index:7;
  display:none;
  background:rgba(8,9,7,.82);
  border:1px solid rgba(255,255,255,.22);
  backdrop-filter:blur(14px);
  color:#fff;
  font:600 .68rem "Space Grotesk",sans-serif;
  text-transform:uppercase;
  letter-spacing:.09em;
  pointer-events:none;
  opacity:1;
  box-sizing:border-box;
}
.energy-rail--side{
  right:1.25rem;
  top:50%;
  transform:translateY(-50%);
  width:6.5rem;
  padding:.8rem;
  flex-direction:column;
  align-items:stretch;
  z-index:8;
}
.energy-rail--foot{
  --rail-fill:14.286%;
  z-index:40; /* por encima del manifiesto lima (z-index:5) y el resto */
  top:auto;
  bottom:0;
  left:0;
  right:0;
  width:100%;
  transform:none;
  flex-direction:row;
  align-items:center;
  gap:clamp(1rem,2vw,1.75rem);
  padding:.4rem clamp(1.2rem,4vw,3.5rem);
  border-left:0;
  border-right:0;
  border-bottom:0;
  border-radius:0;
  min-height:0;
}
.home-story.story-active .energy-rail--side{display:flex}
.grade-scale{flex-direction:column;align-items:stretch;gap:.7rem}
.grade-scale ol{display:flex;flex-direction:column;gap:3px;margin:0;padding:0;list-style:none}
.grade-scale li{--grade:#fff;display:grid;grid-template-columns:1.4rem 1fr;align-items:center;gap:.45rem;opacity:.33;transition:opacity .25s ease,transform .25s ease}
.grade-scale li b{display:grid;place-items:center;width:1.4rem;height:1.4rem;background:var(--grade);color:#0b0c0a;font-size:.72rem;font-weight:800}
.grade-scale li i{display:block;width:52%;height:.34rem;background:var(--grade);transition:width .3s ease}
.grade-scale li[data-grade="A"]{--grade:var(--lime,#cfff81)}.grade-scale li[data-grade="B"]{--grade:#73bb44}.grade-scale li[data-grade="C"]{--grade:#c4d82e}.grade-scale li[data-grade="D"]{--grade:#f4df24}.grade-scale li[data-grade="E"]{--grade:#f6ad2f}.grade-scale li[data-grade="F"]{--grade:#ee7330}.grade-scale li[data-grade="G"]{--grade:#df3b2f}
.energy-rail--side li.active{opacity:1;transform:translateX(-.25rem)}
.energy-rail--side li.active i{width:100%}
.grade-brand{display:block;max-height:0;margin-top:0;overflow:hidden;opacity:0;color:#fff;font:500 1.05rem/1 "Space Grotesk",sans-serif;text-transform:none;letter-spacing:-.04em;transition:max-height .35s ease,margin .35s ease,opacity .35s ease,max-width .35s ease,padding .35s ease}
.grade-brand em{display:block;margin-top:.28rem;color:var(--lime);font:600 .5rem/1 "Space Grotesk",sans-serif;text-transform:uppercase;letter-spacing:.12em}
.energy-rail--side.reached-a .grade-brand{max-height:3rem;margin-top:.8rem;opacity:1}

/* —— Rail pie: meter + fill (z-index ya en .energy-rail--foot) —— */
.energy-rail--foot .energy-rail__meter{
  position:relative;
  flex:1 1 auto;
  min-width:0;
  display:flex;
  flex-direction:column;
  gap:.28rem;
  container-type:inline-size;
}
.energy-rail--foot ol{
  position:relative;
  z-index:2;
  display:flex;
  flex-direction:row;
  align-items:center;
  justify-content:space-between;
  gap:0;
  margin:0;
  padding:0 .1rem;
  list-style:none;
  width:100%;
}
.energy-rail--foot li{
  display:flex;
  align-items:center;
  justify-content:center;
  flex:0 0 auto;
  opacity:.38;
  grid-template-columns:none;
  transition:opacity .25s ease,transform .25s ease;
}
.energy-rail--foot li b{
  width:1.15rem;
  height:1.15rem;
  font-size:.6rem;
  box-shadow:0 0 0 2px rgba(8,9,7,.65);
}
.energy-rail--foot li i{display:none}
.energy-rail--foot li.active{
  opacity:1;
  transform:scale(1.1);
}
.energy-rail--foot .energy-rail__track{
  position:relative;
  width:100%;
  height:.38rem;
  border-radius:999px;
  overflow:hidden;
  background:rgba(255,255,255,.14);
  box-shadow:inset 0 0 0 1px rgba(255,255,255,.08);
}
.energy-rail--foot .energy-rail__fill{
  display:block;
  position:absolute;
  inset:0 auto 0 0;
  width:var(--rail-fill);
  height:100%;
  border-radius:inherit;
  background-image:linear-gradient(
    90deg,
    #df3b2f 0%,
    #ee7330 16.6%,
    #f6ad2f 33.3%,
    #f4df24 50%,
    #c4d82e 66.6%,
    #73bb44 83.3%,
    var(--lime,#cfff81) 100%
  );
  background-repeat:no-repeat;
  background-position:left center;
  background-size:100cqi 100%;
  transition:width .35s ease;
}
.energy-rail--foot .grade-brand{
  position:relative;
  z-index:2;
  flex:0 0 auto;
  max-height:none!important;
  max-width:none!important;
  margin:0!important;
  padding:0!important;
  opacity:1!important;
  overflow:visible;
  white-space:nowrap;
  text-align:right;
  font-size:1.05rem;
  line-height:1;
  color:#fff;
  transition:color .3s ease,text-shadow .3s ease;
}
.energy-rail--foot .grade-brand em{
  margin-top:.16rem;
  font-size:.46rem;
  color:var(--lime);
}
.energy-rail--foot.reached-a .grade-brand{
  color:var(--lime);
  text-shadow:0 0 16px rgba(207,255,129,.35);
}
.energy-rail--foot.reached-a .grade-brand em{
  color:#fff;
}

@media(min-width:821px){
  .home-story{
    /* Rail lateral ~6.5rem + right 1.25rem + aire */
    --rail-gutter:8.5rem;
  }
  .energy-rail--foot{
    display:flex!important;
  }
  body{
    padding-bottom:3.1rem;
  }
  /* Hueco reservado desde el inicio (sin recolocar al activar el rail) */
  .home-story .concept-intro,
  .home-story .concept-nav{
    padding-right:calc(6vw + var(--rail-gutter))!important;
    box-sizing:border-box;
  }
  /* Conclusión centrada: en pantallas estrechas sí respeta el rail; en ancho no hace falta (márgenes naturales) */
  .home-story .conclusion{
    padding-right:1.5rem!important;
    padding-left:1.5rem!important;
  }
  /* El gutter va al copy (el cred hereda el ancho; no volver a restar el rail) */
  .home-story .concept-card.passive .concept-body-copy,
  .home-story .concept-card.self .concept-body-copy{
    padding-right:var(--rail-gutter);
    box-sizing:border-box;
    max-width:100%;
  }
  .home-story .concept-card.passive .passivhaus-cred,
  .home-story .concept-card.self .passivhaus-cred{
    max-width:100%;
    width:100%;
    box-sizing:border-box;
  }
  .home-story .concept-card.passive .passivhaus-cred__text,
  .home-story .concept-card.self .passivhaus-cred__text{
    flex:1 1 auto;
    min-width:0;
  }
  .home-story .concept-card.passive .concept-title-stack,
  .home-story .concept-card.self .concept-title-stack{
    /* Invade más la imagen; deja hueco del rail a la derecha */
    margin-left:-72%!important;
    width:calc(100% + 72% - var(--rail-gutter))!important;
    max-width:none!important;
    box-sizing:border-box;
  }
  .home-story .concept-card.passive .concept-title-stack h3,
  .home-story .concept-card.self .concept-title-stack h3{
    max-width:none!important;
    width:100%;
  }
}
@media(min-width:821px) and (max-width:1100px){
  .home-story{
    /* Rail tablet: 5.6rem + right .5rem + aire */
    --rail-gutter:7rem;
  }
  .passivhaus-cred{
    max-width:none;
    gap:.85rem;
    align-items:flex-start;
  }
  .passivhaus-cred__logo{
    width:72px;
    height:72px;
  }
  .passivhaus-cred__logo svg{
    width:72px;
    height:72px;
  }
  .passivhaus-cred__text{
    flex:1 1 auto;
    min-width:0;
  }
  .passivhaus-cred__text span{
    font-size:.84rem;
    line-height:1.45;
  }
}
@media(min-width:821px) and (max-width:1200px){
  .home-story .conclusion{
    padding-right:calc(1.5rem + var(--rail-gutter))!important;
    padding-left:1.5rem!important;
  }
}

.concept-visual{position:relative;background:#111}
.concept-visual img{transform:scale(calc(1.07 - (var(--story-progress) * .035)));filter:saturate(calc(1.18 - (var(--story-progress) * .18))) contrast(1.02);transition:filter .6s ease;will-change:transform}
.visual-caption{position:absolute;left:clamp(1rem,3vw,3rem);right:clamp(1rem,3vw,3rem);bottom:clamp(1rem,3vw,2.5rem);z-index:2;padding-top:.8rem;border-top:1px solid rgba(255,255,255,.72);color:#fff;font:500 clamp(.78rem,1vw,1rem) "Space Grotesk",sans-serif;text-transform:uppercase;letter-spacing:.08em;text-shadow:0 1px 10px rgba(0,0,0,.65)}
.concept-visual:after{content:none;display:none}
.home-story .concept-body{transition:background-color .5s ease,color .5s ease}
.home-story .concept-card:nth-of-type(1) .concept-body{background:#0b0c0a}
.home-story .concept-card:nth-of-type(2) .concept-body{background:#10110e}
.home-story .concept-card:nth-of-type(3) .concept-body{background:#151712}
.home-story .conclusion small{display:block;margin-top:1.25rem;color:var(--lime);font:600 .75rem "Space Grotesk",sans-serif;text-transform:uppercase;letter-spacing:.12em}
@media(max-width:1100px){
  .energy-rail--side{right:.5rem;width:5.6rem;padding:.65rem}
  .energy-rail--side li{grid-template-columns:1.25rem 1fr}
  .energy-rail--side li b{width:1.25rem;height:1.25rem}
}
@media(max-width:820px){
  .home-story{
    --rail-gutter: calc(2.2rem + max(.35rem, env(safe-area-inset-right, 0px)));
  }
  .energy-rail--foot{display:none!important}
  .home-story.story-active .energy-rail--side{display:flex}
  .energy-rail--side{
    right:max(.35rem, env(safe-area-inset-right, 0px));
    left:auto;
    top:50%;
    width:2rem;
    max-width:calc(100vw - .7rem);
    padding:.28rem .14rem .35rem;
    border-radius:0;
    backdrop-filter:blur(8px);
    overflow:visible;
    box-sizing:border-box;
    transform:translateY(-50%);
  }
  .energy-rail--side.reached-a{
    width:2rem;
    padding:.28rem .14rem .35rem;
  }
  .energy-rail--side.grade-scale{gap:.22rem}
  .energy-rail--side li{grid-template-columns:1fr;gap:0}
  .energy-rail--side li b{
    width:1.05rem;
    height:1.05rem;
    margin:auto;
    font-size:.55rem;
  }
  .energy-rail--side li i{display:none}
  .energy-rail--side li.active{transform:scale(1.06)}
  .energy-rail--side .grade-brand{
    position:absolute;
    top:100%;
    right:0;
    bottom:auto;
    width:3.6rem;
    max-width:none;
    max-height:0;
    margin:.22rem 0 0;
    padding:0 .28rem;
    overflow:hidden;
    opacity:0;
    text-align:center;
    font-size:.5rem;
    line-height:1.05;
    letter-spacing:-.03em;
    white-space:nowrap;
    box-sizing:border-box;
    background:rgba(8,9,7,.92);
    border:1px solid rgba(255,255,255,.2);
    pointer-events:none;
  }
  .energy-rail--side.reached-a .grade-brand{
    max-height:2.8rem;
    margin-top:.22rem;
    padding:.3rem .32rem;
    opacity:1;
    overflow:visible;
  }
  .energy-rail--side .grade-brand em{
    display:block;
    font-size:.3rem;
    margin-top:.1rem;
    letter-spacing:.04em;
  }
  .story-instruction{margin-top:1rem!important}
  .visual-caption{font-size:.72rem}
  .concept-visual img{transform:none}

  .home-story .concept-intro,
  .home-story .conclusion{
    padding-right:calc(5vw + var(--rail-gutter))!important;
    padding-left:5vw!important;
    box-sizing:border-box;
    max-width:100%;
  }
  .home-story .concept-card .concept-body{
    padding:14vw 5vw 14vw 5vw!important;
    padding-right:calc(5vw + var(--rail-gutter))!important;
    box-sizing:border-box;
  }
  .home-story .concept-card .concept-title-stack,
  .home-story .concept-card .concept-body-copy,
  .home-story .concept-card .concept-body-copy > p,
  .home-story .concept-card .concept-body-copy > ul{
    max-width:100%!important;
    width:100%;
    box-sizing:border-box;
    padding-right:0!important;
  }
}
@media(prefers-reduced-motion:reduce){.concept-visual img{transform:none!important;transition:none}.grade-scale li,.grade-scale li i{transition:none}}
.advantages-head h2{font-size:clamp(2.6rem,4.35vw,5.4rem);line-height:.98;max-width:18ch}
.proof-copy h2{font-size:clamp(2.6rem,4.35vw,5.4rem);line-height:.98;max-width:18ch}


/* <<< passive-rise.css >>> */
/* Rise + máscara: pasiva (invade izq) y sostenible (invade der) */
@media (min-width: 821px) {
  .concept-card--rise {
    position: relative;
    isolation: auto;
  }

  .concept-card--rise .concept-visual {
    z-index: 2;
    overflow: hidden;
    background: transparent !important;
  }

  .concept-card--rise .concept-visual:after {
    content: none;
    display: none;
  }

  .concept-card--rise .concept-visual picture {
    display: block;
    width: 100%;
    height: 100%;
  }

  .concept-card--rise .concept-visual img {
    transform: translate3d(0, var(--rise, 100%), 0) !important;
    filter: none !important;
    will-change: transform;
    transition: none !important;
    object-position: center center;
  }

  .concept-card--rise.is-risen .concept-visual img {
    transform: translate3d(0, 0, 0) !important;
    will-change: auto;
  }

  .concept-card--rise .visual-caption {
    z-index: 2;
    opacity: calc(1 - (var(--rise-n, 1)));
    transition: opacity 0.2s ease;
  }

  .concept-card--rise .concept-body {
    position: relative;
    z-index: auto;
    display: block !important;
  }

  .concept-card--rise .concept-title-stack {
    position: relative;
    max-width: none;
  }

  /* Pasiva / autosuficiente: textos invaden la columna izquierda (imagen) */
  .concept-card--rise.passive .concept-title-stack,
  .concept-card--rise.self .concept-title-stack {
    margin-left: -72%;
    width: calc(100% + 72%);
  }

  /* Sostenible: textos invaden la columna derecha (imagen) */
  .concept-card--rise.sustainable .concept-title-stack {
    margin-right: -53%;
    width: calc(100% + 53%);
    text-align: right;
  }

  .concept-card--rise .concept-title-base {
    position: relative;
    z-index: 1;
  }

  .concept-card--rise .concept-title-base .eyebrow,
  .concept-card--rise .concept-title-base h3 {
    color: #fff !important;
  }

  .concept-card--rise .concept-title-reveal {
    position: absolute;
    inset: 0;
    z-index: 3;
    color: var(--grade-color, #df3b2f);
    clip-path: inset(100% 0 0 0);
    pointer-events: none;
  }

  .concept-card--rise .concept-title-reveal .eyebrow,
  .concept-card--rise .concept-title-reveal .concept-title {
    color: inherit !important;
  }

  .concept-card--rise .concept-title-reveal .concept-title {
    font-family: "Space Grotesk", sans-serif;
    font-size: clamp(3.2rem, 5.6vw, 7rem);
    font-weight: 500;
    line-height: 0.98;
    letter-spacing: -0.045em;
    margin: 2rem 0 2.5rem;
  }

  .concept-card--rise .concept-body-copy {
    position: relative;
    z-index: 1;
    max-width: 720px;
  }

  .concept-card--rise.sustainable .concept-body-copy {
    margin-left: auto;
    text-align: right;
  }

  .concept-card--rise.sustainable .concept-body-copy ul {
    margin-left: auto;
  }

  .concept-card--rise .concept-body-copy ul {
    margin-top: 3rem;
  }
}

@media (max-width: 820px) {
  .concept-card--rise .concept-title-stack {
    margin-left: 0;
    margin-right: 0;
    width: auto;
  }
  .concept-card--rise .concept-title-reveal {
    display: none;
  }
  .concept-card--rise .concept-visual img {
    transform: none !important;
  }
  .concept-card--rise.sustainable .concept-body-copy,
  .concept-card--rise.sustainable .concept-body-copy ul {
    margin-left: 0;
    text-align: left;
  }
}

@media (prefers-reduced-motion: reduce) {
  .concept-card--rise .concept-visual img {
    transform: none !important;
  }
  .concept-card--rise .concept-title-reveal {
    display: none;
  }
}


/* <<< scroll-progress.css >>> */
/* Barra de progreso de scroll en el header (desktop) */
.energy-rail--top,
[data-scroll-progress]{
  --rail-fill:0%;
}
.topbar-center{
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  gap:.35rem;
  min-width:0;
  flex:1 1 auto;
  max-width:min(34rem, 42vw);
}
.energy-rail--top{
  position:relative;
  top:auto;
  bottom:auto;
  left:auto;
  right:auto;
  width:100%;
  max-width:100%;
  transform:none;
  display:none;
  flex-direction:row;
  align-items:center;
  gap:.55rem;
  padding:.2rem .15rem 0;
  margin:0;
  background:transparent;
  border:0;
  backdrop-filter:none;
  z-index:1;
  pointer-events:none;
  color:var(--black);
  font:600 .68rem "Space Grotesk",sans-serif;
  text-transform:uppercase;
  letter-spacing:.09em;
  box-sizing:border-box;
}
.energy-rail--top .energy-rail__meter{
  flex:1 1 auto;
  min-width:0;
  display:flex;
  flex-direction:column;
  gap:0;
  container-type:inline-size;
}
.energy-rail--top ol{display:none}
.energy-rail--top .energy-rail__track{
  position:relative;
  width:100%;
  height:.28rem;
  border-radius:999px;
  overflow:hidden;
  background:rgba(11,12,10,.12);
}
.energy-rail--top .energy-rail__fill{
  display:block;
  position:absolute;
  inset:0 auto 0 0;
  width:var(--rail-fill);
  height:100%;
  border-radius:inherit;
  background-image:linear-gradient(
    90deg,
    #df3b2f 0%,
    #ee7330 16.6%,
    #f6ad2f 33.3%,
    #f4df24 50%,
    #c4d82e 66.6%,
    #73bb44 83.3%,
    var(--lime,#cfff81) 100%
  );
  background-repeat:no-repeat;
  background-position:left center;
  background-size:100cqi 100%;
  transition:width .2s linear;
}
.energy-rail--top .grade-brand{
  position:relative;
  flex:0 0 auto;
  display:flex;
  flex-direction:column;
  align-items:flex-end;
  max-height:none!important;
  max-width:none!important;
  margin:0!important;
  padding:0!important;
  opacity:1!important;
  overflow:visible;
  white-space:nowrap;
  text-align:right;
  font-size:.72rem;
  line-height:1;
  color:var(--black);
  text-transform:none;
  letter-spacing:-.04em;
  font-weight:500;
}
.energy-rail--top .grade-brand__a{
  position:absolute;
  right:100%;
  top:50%;
  margin-right:.4rem;
  transform:translateY(-50%) scale(.85);
  display:grid;
  place-items:center;
  width:1rem;
  height:1rem;
  background:var(--lime,#cfff81);
  color:#0b0c0a;
  font-size:.55rem;
  font-weight:800;
  opacity:0;
  pointer-events:none;
  transition:opacity .3s ease,transform .3s ease;
}
.energy-rail--top.reached-a .grade-brand__a{
  opacity:1;
  transform:translateY(-50%) scale(1);
}
.energy-rail--top .grade-brand em{
  display:block;
  margin-top:.08rem;
  font-size:.34rem;
  color:#3a3a3a;
  font-style:normal;
  font-weight:600;
  text-transform:uppercase;
  letter-spacing:.12em;
}
.energy-rail--top.reached-a .grade-brand{
  color:var(--black);
  text-shadow:none;
}
.energy-rail--top.reached-a .grade-brand em{
  color:var(--black);
}

@media(min-width:821px){
  .energy-rail--top{
    display:flex!important;
  }
  .topbar{
    height:auto;
    min-height:82px;
    padding-top:.65rem;
    padding-bottom:.55rem;
  }
}
@media(max-width:820px){
  .energy-rail--top{display:none!important}
  .topbar-center{max-width:none;flex:1}
}
@media(prefers-reduced-motion:reduce){
  .energy-rail--top .energy-rail__fill{transition:none}
}


