/* base/base.css */
/* base — generado por refactor modular (verbatim de styles.css) */

*, *::before, *::after { margin: 0; padding: 0; box-sizing: border-box; }
:root {
  --green: #2EE298;
  --green-dark: #0A3524;
  --dark-text: #062217;
  --bg: #03130D;
  --bg-tint: rgba(46, 226, 152, 0.06);
  --white: #FFFFFF;
  --white-75: rgba(255, 255, 255, 0.75);
  --white-50: rgba(255, 255, 255, 0.5);
  --white-10: rgba(255, 255, 255, 0.1);
  --font-sora: 'Sora', sans-serif;
  --font-mont: 'Montserrat', sans-serif;
  --gutter: clamp(20px, 10.76vw, 147px);
}
html { scroll-behavior: smooth; }
body {
  font-family: var(--font-sora);
  background: var(--bg);
  color: var(--white);
  overflow-x: hidden;
}
a { text-decoration: none; color: inherit; }
img { display: block; max-width: 100%; }
ul { list-style: none; }
.text-green { color: var(--green); }
.wrap {
  width: 100%;
  max-width: 1072px;
  margin-left: auto;
  margin-right: auto;
  padding-left: 20px;
  padding-right: 20px;
}
html, body { max-width: 100%; }
.btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
  height: 48px;
  padding: 0 26px;
  border-radius: 8px;
  font-family: var(--font-sora);
  font-weight: 600;
  font-size: 15px;
  border: 1.5px solid transparent;
  cursor: pointer;
  transition: background .25s ease, color .25s ease, border-color .25s ease, transform .15s ease;
  white-space: nowrap;
}
.btn:active { transform: translateY(1px); }
.btn__arrow { flex-shrink: 0; }
.btn--primary {
  background: var(--green);
  color: var(--dark-text);
  border-color: var(--green);
}
.btn--primary:hover { background: #29cd89; }
.btn--ghost {
  background: rgba(255, 255, 255, 0.04);
  color: var(--white);
  border-color: rgba(255, 255, 255, 0.3);
}
.btn--ghost:hover { border-color: var(--green); color: var(--green); }
.img-ph {
  position: relative;
  background: #6f7e7a;
  overflow: hidden;
}
.img-ph::after {
  content: "";
  position: absolute;
  inset: 0;
  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23ffffff' stroke-width='1.2'%3E%3Crect x='3' y='3' width='18' height='18' rx='2'/%3E%3Ccircle cx='8.5' cy='8.5' r='1.8'/%3E%3Cpath d='M21 15l-5-5L4 21'/%3E%3C/svg%3E") center / 52px no-repeat;
  opacity: 0.55;
}
.caro-arrow {
  flex-shrink: 0;
  width: 44px;
  height: 44px;
  border-radius: 50%;
  border: none;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  background: rgba(255, 255, 255, 0.12);
  color: var(--white);
  transition: background .2s, color .2s;
}
.caro-arrow--green { background: var(--green); color: var(--dark-text); }
.caro-arrow:hover { background: var(--green); color: var(--dark-text); }
@media (max-width: 600px) {
  .wrap { padding-left: 16px; padding-right: 16px; }
}
@keyframes spyHalo {
  0%, 100% { opacity: .7; transform: translate(-50%, -50%) scale(1); }
  50% { opacity: 1; transform: translate(-50%, -50%) scale(1.07); }
}
@keyframes spyPlatform {
  0%, 100% { opacity: .65; transform: translateX(-50%) scale(1); }
  50% { opacity: .95; transform: translateX(-50%) scale(1.05); }
}
@keyframes linkFlow { to { stroke-dashoffset: -14; } }
@keyframes spyBreath {
  0%, 100% { transform: translateX(-50%) translateY(0); }
  50% { transform: translateX(-50%) translateY(-9px); }
}
@keyframes spyEyes { 0%, 100% { opacity: .55; } 50% { opacity: 1; } }
@keyframes nodePop { 0% { transform: scale(.84); } 60% { transform: scale(1.12); } 100% { transform: scale(1); } }
@keyframes spyFloat {
  0%, 100% { transform: translate(-50%, calc(-50% - 4px)); }
  50% { transform: translate(-50%, calc(-50% + 4px)); }
}
@keyframes ringPulse { 50% { stroke-opacity: .5; } }
@keyframes enrollPulse {
  0%, 100% { box-shadow: 0 0 0 0 rgba(46, 226, 152, .45); }
  50% { box-shadow: 0 0 24px 2px rgba(46, 226, 152, .55); }
}
@keyframes espiasSwap { 0% { opacity: 0; transform: translateY(12px) scale(1.04); } 100% { opacity: 1; transform: translateY(0) scale(1); } }
@keyframes espiasRise { 0% { opacity: 0; transform: translateY(8px); } 100% { opacity: 1; transform: translateY(0); } }
@keyframes espSpark { 0%, 100% { opacity: .3; } 50% { opacity: .9; } }
@keyframes espDrift { 0%, 100% { transform: translateY(0); } 50% { transform: translateY(-18px); } }

/* base/nav.css */
/* nav — generado por refactor modular (verbatim de styles.css) */

.nav {
  position: fixed;
  inset: 0 0 auto 0;
  z-index: 100;
  height: 80px;
  background: rgba(3, 19, 13, 0.55);
  backdrop-filter: blur(18px);
  -webkit-backdrop-filter: blur(18px);
  border-bottom: 1px solid rgba(255, 255, 255, 0.06);
}
.nav__wrap {
  max-width: 1366px;
  height: 100%;
  margin: 0 auto;
  padding: 0 40px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 24px;
}
.nav__logo { display: flex; align-items: center; }
.nav__logo img { width: 38px; height: 44px; max-width: none; flex-shrink: 0; }
.nav__center {
  position: relative;
  flex: 1;
  align-self: stretch;
  display: flex;
  align-items: center;
  justify-content: center;
}
.nav__links {
  position: absolute;
  inset: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: clamp(16px, 2.5vw, 34px);
  transition: opacity .35s ease, transform .35s ease;
}
.nav__info {
  position: absolute;
  inset: 0;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  padding: 0 8px;
  opacity: 0;
  transform: translateY(10px);
  pointer-events: none;
  transition: opacity .35s ease, transform .35s ease;
}
.nav__info-item { display: flex; align-items: center; gap: 9px; }
.nav__info-icon { width: 30px; height: 30px; flex-shrink: 0; }
.nav__info-text { display: flex; flex-direction: column; line-height: 1.15; white-space: nowrap; }
.nav__info-label { font-family: var(--font-mont); font-weight: 700; font-size: 13px; color: var(--white); }
.nav__info-value { font-family: var(--font-mont); font-weight: 500; font-size: 12px; color: var(--white-75); }
.nav--scrolled .nav__links { opacity: 0; transform: translateY(-10px); pointer-events: none; }
.nav--scrolled .nav__info { opacity: 1; transform: none; pointer-events: auto; }
.nav__link {
  font-family: var(--font-sora);
  font-weight: 600;
  font-size: 13px;
  letter-spacing: 0.5px;
  color: var(--white);
  transition: color .25s ease;
}
.nav__link:hover { color: var(--green); }
.nav__link--active { color: var(--green); }
.nav__cta { font-size: 14px; padding: 0 22px; }
@media (max-width: 900px) {
  .nav__center { display: none; }
}
@media (max-width: 600px) {
  .nav { display: none; }
  .nav__cta { font-size: 12px; padding: 0 14px; height: 42px; }
}

/* base/wsp.css */
/* wsp — generado por refactor modular (verbatim de styles.css) */

.wsp {
  position: fixed;
  right: 24px;
  bottom: 24px;
  z-index: 90;
  width: 56px;
  height: 56px;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  background: #25D366;
  color: #fff;
  box-shadow: 0 8px 24px rgba(0, 0, 0, 0.35);
  transition: transform .2s ease;
}
.wsp:hover { transform: scale(1.06); }

/* sections/hero/hero.css */
/* hero — generado por refactor modular (verbatim de styles.css) */

.hero {
  position: relative;
  width: 100%;
  height: clamp(600px, 56.15vw, 767px);
  overflow: hidden;
}
.hero__bg {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
  z-index: 1;
}
.hero__character {
  position: absolute;
  bottom: 0;
  right: -2%;
  height: 94%;
  width: auto;
  object-fit: contain;
  z-index: 2;
  pointer-events: none;
}
.hero__strip {
  position: absolute;
  bottom: 0;
  left: 0;
  width: 100%;
  height: 200px;
  background: linear-gradient(to bottom, transparent 0%, rgba(3, 19, 13, 0.75) 55%, var(--bg) 100%);
  z-index: 3;
}
.hero__wrap {
  position: relative;
  z-index: 4;
  height: 100%;
  display: flex;
  flex-direction: column;
  padding-top: 80px;
}
.hero__content {
  flex: 1;
  display: flex;
  flex-direction: column;
  justify-content: center;
  gap: 28px;
  max-width: 600px;
}
.hero__title {
  width: 582px;
  max-width: 100%;
  height: auto;
}
.hero__subtitle {
  font-family: var(--font-sora);
  font-weight: 400;
  font-size: 18px;
  line-height: 1.5;
  color: var(--white);
  max-width: 580px;
}
.hero__buttons {
  display: flex;
  gap: 16px;
  flex-wrap: wrap;
}
.hero__buttons .btn { min-width: 240px; }
.hero__info {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 20px;
  padding: 22px 0 30px;
}
.hero__info-item { display: flex; align-items: center; gap: 12px; }
.hero__info-icon { width: 48px; height: 48px; flex-shrink: 0; }
.hero__info-text { display: flex; flex-direction: column; line-height: 1.25; white-space: nowrap; }
.hero__info-label { font-family: var(--font-mont); font-weight: 700; font-size: 16px; }
.hero__info-value { font-family: var(--font-mont); font-weight: 500; font-size: 15px; color: var(--white-75); }
@media (min-width: 601px) {
  .hero__subtitle { display: none; }
}
@media (max-width: 900px) {
  .hero { height: auto; min-height: 600px; }
  .hero__wrap { padding-bottom: 24px; }
  .hero__character { opacity: 0.45; right: -22%; }
  .hero__info { flex-wrap: wrap; gap: 18px 30px; }
}
@media (max-width: 600px) {
  .hero {
    height: auto;
    min-height: 735px;
    overflow: hidden;
    background: #03130D;
  }
  .hero__bg {
    object-position: center 18%;
  }
  .hero__character {
    opacity: 1;
    top: clamp(250px, 66vw, 292px);
    left: 50%;
    right: auto;
    bottom: auto;
    width: min(142vw, 545px);
    height: auto;
    object-fit: contain;
    object-position: center;
    transform: translateX(-50%) scale(1.35);
    transform-origin: center top;
  }
  .hero__strip {
    height: 58%;
    background: linear-gradient(to bottom, transparent 0%, rgba(3, 19, 13, 0.28) 35%, var(--bg) 100%);
  }
  .hero__wrap {
    min-height: 735px;
    padding-top: 54px;
    padding-bottom: 0;
    gap: 0;
  }
  .hero__content {
    flex: none;
    max-width: none;
    gap: 12px;
    align-items: center;
    justify-content: flex-start;
    text-align: left;
  }
  .hero__title { width: min(326px, 100%); max-width: 100%; }
  .hero__subtitle {
    width: min(318px, 100%);
    max-width: none;
    font-size: 14.5px;
    line-height: 1.42;
  }
  .hero__buttons {
    width: min(274px, 100%);
    flex-direction: column;
    gap: 12px;
    margin-top: clamp(408px, 113vw, 480px);
  }
  .hero__buttons .btn {
    position: relative;
    width: 100%;
    min-width: 0;
    height: 56px;
    border-radius: 999px;
    font-size: 15px;
  }
  .hero__buttons .btn__arrow {
    position: absolute;
    right: 28px;
  }
  .hero__buttons .btn--ghost {
    display: inline-flex;
    background: rgba(3, 19, 13, 0.2);
    border-color: rgba(255, 255, 255, 0.9);
    color: var(--white);
  }
  .hero__info {
    display: grid;
    grid-template-columns: 1fr;
    gap: 20px;
    width: 100vw;
    margin: 28px 0 0 calc(50% - 50vw);
    padding: 28px max(36px, calc((100vw - 246px) / 2)) 30px;
    background: #030F0F;
  }
  .hero__info-item:nth-child(1) { order: 1; }
  .hero__info-item:nth-child(2) { order: 3; }
  .hero__info-item:nth-child(3) { order: 2; }
  .hero__info-item:nth-child(4) { order: 4; }
  .hero__info-item { min-width: 0; gap: 18px; align-items: center; }
  .hero__info-icon { width: 42px; height: 42px; }
  .hero__info-text { white-space: normal; min-width: 0; }
  .hero__info-label { font-size: 15px; line-height: 1.1; }
  .hero__info-value { font-size: 14px; color: var(--white); line-height: 1.25; }
}
@media (min-width: 901px) and (max-height: 820px) {
  .hero { height: auto; }
  .hero__wrap { height: auto; padding-top: 86px; padding-bottom: 12px; }
  .hero__content { flex: 0 1 auto; justify-content: flex-start; gap: 14px; }
  .hero__title { width: clamp(360px, 35vw, 500px); }
  .hero__subtitle { font-size: 16px; max-width: 560px; }
  .hero__buttons { gap: 12px; }
  .hero__info { padding: 16px 0 18px; }
  .hero__info-icon { width: 44px; height: 44px; }
}

/* sections/sabias/sabias.css */
/* sabias — generado por refactor modular (verbatim de styles.css) */

.sabias { background: #031A1A; }
.sabias__inner {
  display: flex;
  align-items: center;
  gap: 44px;
  padding: 30px 0;
  min-height: 240px;
}
.sabias__circle {
  width: 180px;
  height: 180px;
  border-radius: 50%;
  border: 1px solid rgba(46, 226, 152, 0.5);
  flex-shrink: 0;
  padding: 0;
  overflow: hidden;
}
.sabias__circle .img-ph,
.sabias__circle-img {
  width: 100%;
  height: 100%;
  border-radius: 50%;
  background: rgba(46, 226, 152, 0.06);
  object-fit: cover;
}
.sabias__divider { width: 2px; align-self: stretch; margin: 24px 0; background: var(--green); flex-shrink: 0; }
.sabias__content { flex: 1; }
.sabias__copy,
.sabias__meta { min-width: 0; }
.sabias__label { font-weight: 700; font-size: 18px; margin-bottom: 14px; }
.sabias__quote { font-size: 18px; line-height: 1.5; margin-bottom: 16px; }
.sabias__dash { display: block; width: 32px; height: 2px; background: var(--green); margin-bottom: 16px; }
.sabias__author { font-weight: 700; font-size: 20px; color: var(--green); }
.sabias__role { font-size: 15px; color: var(--white-75); margin-top: 4px; }
.sabias__explore {
  flex-shrink: 0;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 10px;
  text-align: center;
  color: var(--green);
  background: none;
  border: 0;
  padding: 0;
  cursor: pointer;
  font: inherit;
}
.sabias__arrow {
  width: 64px;
  height: 64px;
  border-radius: 50%;
  border: 2px solid var(--green);
  display: flex;
  align-items: center;
  justify-content: center;
  transition: background .2s, color .2s;
}
.sabias__explore:hover .sabias__arrow { background: var(--green); color: var(--dark-text); }
.sabias__explore-label { font-weight: 600; font-size: 15px; }
.sabias__more { font-size: 13px; color: var(--white-75); text-decoration: underline; }
@media (max-width: 900px) {
  .sabias__inner { flex-direction: column; text-align: center; gap: 24px; padding: 40px 0; }
  .sabias__divider { display: none; }
  .sabias__dash { margin-left: auto; margin-right: auto; }
  .sabias__explore { flex-direction: row; flex-wrap: wrap; justify-content: center; gap: 12px 16px; }
}
@media (max-width: 600px) {
  .sabias {
    background: #031A1A;
    margin-top: 0;
  }
  .sabias__inner {
    display: grid;
    grid-template-columns: clamp(82px, 26vw, 100px) minmax(0, 1fr) clamp(72px, 18vw, 82px);
    grid-template-areas:
      "image copy copy"
      "spacer meta action";
    align-items: center;
    column-gap: 10px;
    row-gap: 8px;
    padding: 14px 28px 18px 18px;
    min-height: 0;
    text-align: left;
  }
  .sabias__circle {
    grid-area: image;
    justify-self: center;
    width: 76px;
    height: 76px;
    margin-bottom: 0;
    border-width: 2px;
    border-color: #0bbd73;
  }
  .sabias__divider { display: none; }
  .sabias__content {
    display: contents;
  }
  .sabias__copy {
    grid-area: copy;
  }
  .sabias__meta {
    grid-area: meta;
  }
  .sabias__label {
    font-size: 16px;
    line-height: 1.1;
    margin-bottom: 7px;
  }
  .sabias__quote {
    max-width: none;
    margin: 0;
    font-size: 12.8px;
    line-height: 1.24;
  }
  .sabias__dash {
    width: 42px;
    height: 2px;
    margin: 0 0 9px;
  }
  .sabias__author {
    font-size: 15px;
    line-height: 1.2;
    text-transform: uppercase;
  }
  .sabias__role {
    font-size: 12.8px;
    margin-top: 3px;
  }
  .sabias__explore {
    grid-area: action;
    width: auto;
    max-width: none;
    margin-top: 0;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 6px;
    text-align: center;
  }
  .sabias__arrow {
    width: 46px;
    height: 46px;
  }
  .sabias__explore-label {
    font-size: 11px;
    white-space: nowrap;
  }
  .sabias__more {
    display: none;
    font-size: 12px;
    color: var(--white);
    white-space: nowrap;
  }
}

/* sections/desafio/desafio.css */
/* desafio — generado por refactor modular (verbatim de styles.css) */

.desafio { background: #EDF3F2; color: var(--dark-text); }
.desafio__inner { display: flex; align-items: center; gap: 80px; padding: 90px 0; }
.desafio__left { flex: 1 1 46%; max-width: 460px; }
.desafio__label { font-weight: 700; font-size: 13px; letter-spacing: 1px; color: #1c8a5c; margin-bottom: 44px; }
.desafio__title { color: #0a3524; line-height: 1.12; margin-bottom: 22px; }
.desafio__title span { font-weight: 800; font-size: 46px; }
.desafio__title strong { font-weight: 800; font-size: 46px; }
.desafio__text { font-family: var(--font-mont); font-size: 16px; line-height: 1.6; color: #20302a; }
.desafio__text strong { font-weight: 700; }
.desafio__text + .desafio__text { margin-top: 18px; }
.desafio__list { list-style: none; display: flex; flex-direction: column; gap: 14px; margin: 24px 0; }
.desafio__list li { font-family: var(--font-mont); font-size: 16px; color: #20302a; line-height: 1.3; padding-left: 34px; position: relative; }
.desafio__list li::before {
  content: "";
  position: absolute; left: 0; top: 50%; transform: translateY(-50%);
  width: 22px; height: 22px; border-radius: 50%;
  background: var(--green) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 12' fill='none'%3E%3Cpath d='M10 3.5L4.7 8.5L2 6' stroke='%23ffffff' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center / 13px no-repeat;
}
.desafio__text--close { margin-top: 24px; }
.desafio__image { flex: 1 1 50%; min-width: 0; max-width: 642px; aspect-ratio: 642 / 668; border-radius: 4px; object-fit: cover; }
.desafio__video { flex: 1 1 50%; min-width: 0; max-width: 642px; aspect-ratio: 16 / 9; border-radius: 8px; overflow: hidden; background: #0a1410; box-shadow: 0 18px 44px rgba(10, 53, 36, .18); }
.desafio__video iframe { display: block; width: 100%; height: 100%; border: 0; }
.desafio__topics { list-style: none; margin: 22px 0; padding: 0; display: grid; grid-template-columns: 1fr 1fr; gap: 11px 22px; }
.desafio__topics li { position: relative; padding-left: 26px; font-family: var(--font-mont); font-weight: 600; font-size: 14.5px; line-height: 1.3; color: #20302a; }
.desafio__topics li::before { content: ""; position: absolute; left: 0; top: 2px; width: 16px; height: 16px; border-radius: 50%; box-shadow: inset 0 0 0 1.5px #1c8a5c; background: rgba(28, 138, 92, .12); }
.desafio__topics li::after { content: ""; position: absolute; left: 6px; top: 8px; width: 4px; height: 4px; border-radius: 50%; background: #1c8a5c; }
@media (max-width: 900px) {
  .desafio__video { width: 100%; max-width: none; }
}
@media (max-width: 900px) {
  .desafio__inner { flex-direction: column; gap: 40px; padding: 60px 0; }
  .desafio__left { max-width: none; }
  .desafio__image { width: 100%; max-width: none; aspect-ratio: 16 / 10; }
}
@media (max-width: 600px) {
  .desafio__topics { grid-template-columns: 1fr; gap: 9px; }
}
@media (max-width: 600px) {
  .desafio__inner {
    gap: 34px;
    padding: 36px 0 42px;
  }
  .desafio .wrap {
    padding-left: 16px;
    padding-right: 16px;
  }
  .desafio__label {
    font-size: 11px;
    line-height: 1.2;
    letter-spacing: 0.6px;
    margin-bottom: 34px;
  }
  .desafio__title {
    margin-bottom: 16px;
    line-height: 1.02;
  }
  .desafio__title span,
  .desafio__title strong {
    font-family: var(--font-sora);
    line-height: 1.02;
  }
  .desafio__title span {
    font-size: 30px;
    font-weight: 700;
  }
  .desafio__title strong {
    font-size: 33px;
    font-weight: 800;
  }
  .desafio__text {
    font-family: var(--font-mont);
    font-size: 15px;
    line-height: 1.58;
    color: #111918;
  }
  .desafio__text + .desafio__text {
    margin-top: 24px;
  }
  .desafio__list { gap: 13px; margin: 22px 0; }
  .desafio__list li { font-size: 15px; padding-left: 32px; }
  .desafio__list li::before { width: 20px; height: 20px; background-size: 12px; }
  .desafio__text--close { margin-top: 22px; }
  .desafio__image {
    aspect-ratio: 16 / 8.5;
    border-radius: 0;
    object-position: center;
  }
  .desafio__title span { font-size: 30px; }
  .desafio__title strong { font-size: 33px; }
}

/* sections/obtendras/obtendras.css */
/* obtendras — generado por refactor modular (verbatim de styles.css) */

.obtendras { background: #03130D url("../assets/images/background/1.webp") center / cover no-repeat; padding: 80px 0 90px; }
.obtendras__label { font-weight: 600; font-size: 14px; color: var(--green); margin-bottom: 26px; }
.obtendras__title { font-weight: 800; font-size: 44px; text-align: center; margin-bottom: 14px; }
.obtendras__subtitle { text-align: center; color: var(--white-75); font-size: 16px; max-width: 640px; margin: 0 auto 50px; line-height: 1.5; }
.obt-item__title { font-family: var(--font-sora); font-weight: 700; font-size: 16px; color: var(--white); margin-bottom: 6px; }
.obtendras__carousel { display: flex; align-items: center; gap: 20px; }
.obtendras__track { flex: 1; display: flex; gap: 40px; overflow: hidden; scroll-behavior: smooth; }
.obt-item { flex: 0 0 calc((100% - 80px) / 3); min-width: 0; }
.obt-item__num { display: block; font-weight: 500; font-size: 28px; color: #2dc295; margin-bottom: 8px; }
.obt-item__line { position: relative; height: 1px; background: rgba(255, 255, 255, 0.22); margin-bottom: 30px; }
.obt-item__dot { position: absolute; right: 0; top: 50%; transform: translate(0, -50%); width: 12px; height: 12px; border-radius: 50%; background: var(--green); }
.obt-item__body { display: flex; align-items: flex-start; gap: 18px; }
.obt-item__icon { width: 48px; height: 48px; flex-shrink: 0; }
.obt-item__icon--svg { display: flex; align-items: center; justify-content: center; color: var(--green); }
.obt-item__text { font-family: var(--font-mont); font-size: 15px; line-height: 1.65; color: #f1f7f7; }
.obtendras__dots { display: none; }
@media (max-width: 1024px) {
  .obt-item { flex-basis: calc((100% - 40px) / 2); }
}
@media (max-width: 900px) {
  .obt-item { flex-basis: calc((100% - 24px) / 2); }
}
@media (max-width: 600px) {
  .obtendras {
    padding: 26px 0 54px;
    background-position: center top;
  }
  .obtendras .wrap {
    padding-left: 16px;
    padding-right: 16px;
  }
  .obtendras__label {
    font-size: 11px;
    letter-spacing: 0.4px;
    margin-bottom: 56px;
  }
  .obtendras__label::before { content: ""; }
  .obtendras__title {
    max-width: 360px;
    margin: 0 0 12px;
    text-align: left;
    font-size: 28px;
    line-height: 1.08;
  }
  .obtendras__subtitle {
    max-width: 340px;
    margin: 0 0 54px;
    text-align: left;
    font-size: 15px;
    line-height: 1.45;
    color: rgba(255, 255, 255, 0.86);
  }
  .obtendras__carousel {
    position: relative;
    display: block;
    padding: 0 38px;
  }
  .obtendras__track {
    gap: 0;
    overflow: hidden;
    min-width: 0;
    scroll-snap-type: x mandatory;
  }
  .obt-item {
    flex: 0 0 100%;
    width: 100%;
    max-width: 100%;
    min-width: 100%;
    padding: 0;
    overflow: hidden;
    scroll-snap-align: start;
  }
  .obt-item__num {
    width: fit-content;
    margin: 0 0 12px;
    font-size: 26px;
    font-weight: 600;
  }
  .obt-item__line {
    margin-bottom: 22px;
    background: rgba(46, 226, 152, 0.42);
  }
  .obt-item__dot {
    width: 9px;
    height: 9px;
  }
  .obt-item__body {
    display: grid;
    grid-template-columns: 38px minmax(0, 1fr);
    gap: 12px;
    align-items: start;
  }
  .obt-item__icon {
    width: 38px;
    height: 38px;
    margin-top: -4px;
  }
  .obt-item__title {
    margin-bottom: 16px;
    font-size: 16px;
    line-height: 1.35;
    letter-spacing: 0.4px;
    text-transform: uppercase;
    color: var(--green);
  }
  .obt-item__text {
    font-size: 15px;
    line-height: 1.45;
    color: rgba(255, 255, 255, 0.84);
  }
  .obtendras__carousel .caro-arrow {
    position: absolute;
    top: 54%;
    width: 32px;
    height: 32px;
    transform: translateY(-50%);
    z-index: 2;
  }
  .obtendras__carousel .caro-arrow--prev {
    left: -2px;
  }
  .obtendras__carousel .caro-arrow--next {
    right: -2px;
  }
  .obtendras__dots {
    display: flex;
    justify-content: center;
    gap: 7px;
    margin-top: 44px;
  }
  .obtendras__dot {
    width: 12px;
    height: 12px;
    border-radius: 50%;
    border: 1.5px solid var(--green);
    background: transparent;
    padding: 0;
  }
  .obtendras__dot--active {
    background: var(--green);
  }
}

/* sections/perfil/perfil.css */
/* perfil — generado por refactor modular (verbatim de styles.css) */

.perfil-sec { overflow: hidden; }
.perfil {
  display: grid;
  grid-template-columns: minmax(0, 0.84fr) minmax(0, 1.16fr);
  gap: 40px;
  align-items: center;
}
.perfil__intro { max-width: 440px; }
.perfil__label { font-weight: 600; font-size: 14px; letter-spacing: .05em; color: var(--green); margin-bottom: 22px; }
.perfil__title { font-family: var(--font-sora); font-weight: 800; font-size: clamp(34px, 4vw, 46px); line-height: 1.06; letter-spacing: -0.01em; margin-bottom: 18px; }
.perfil__title-accent {
  background: linear-gradient(115deg, var(--green) 8%, #8affc9 68%, #ffffff 128%);
  -webkit-background-clip: text; background-clip: text; color: transparent;
}
.perfil__subtitle { color: var(--white-75); font-size: 16px; line-height: 1.6; margin-bottom: 28px; max-width: 400px; }
.perfil__meter { max-width: 320px; margin-bottom: 24px; }
.perfil__meter-top { display: flex; align-items: baseline; gap: 10px; margin-bottom: 10px; }
.perfil__meter-count { font-family: var(--font-sora); font-weight: 800; font-size: 30px; color: var(--green); line-height: 1; }
.perfil__meter-total { font-size: 16px; font-weight: 600; color: var(--white-50); margin-left: 4px; }
.perfil__meter-cap { font-family: var(--font-mont); font-weight: 600; font-size: 11px; letter-spacing: .12em; text-transform: uppercase; color: var(--white-50); }
.perfil__meter-bar { height: 6px; border-radius: 99px; background: rgba(255, 255, 255, 0.08); overflow: hidden; }
.perfil__meter-fill {
  display: block; height: 100%; border-radius: 99px;
  background: linear-gradient(90deg, #1aa872, var(--green));
  box-shadow: 0 0 14px rgba(46, 226, 152, .55);
  transition: width .55s cubic-bezier(.22, 1, .36, 1);
}
.perfil__cta { gap: 10px; margin-bottom: 16px; }
.perfil__hint { font-family: var(--font-mont); font-size: 12.5px; line-height: 1.5; color: var(--white-50); max-width: 330px; }
.perfil__stage { position: relative; width: 100%; max-width: 600px; margin: 0 auto; aspect-ratio: 1 / 1; }
.perfil__scene { position: absolute; inset: 0; }
.perfil__halo {
  position: absolute; left: 50%; top: 44%; transform: translate(-50%, -50%);
  width: 74%; height: 72%; border-radius: 50%; z-index: 0;
  background: radial-gradient(circle, rgba(46, 226, 152, .20), rgba(46, 226, 152, .06) 44%, transparent 70%);
  filter: blur(26px);
  animation: spyHalo 7s ease-in-out infinite;
}
.perfil__platform {
  position: absolute; left: 50%; bottom: 6%; width: 54%; height: 16%; transform: translateX(-50%);
  border-radius: 50%; z-index: 0;
  background: radial-gradient(ellipse at center, rgba(46, 226, 152, .5), rgba(46, 226, 152, .1) 46%, transparent 70%);
  filter: blur(8px);
  animation: spyPlatform 3.8s ease-in-out infinite;
}
.perfil__orbits { position: absolute; inset: 0; width: 100%; height: 100%; overflow: visible; z-index: 1; }
.perfil__ring { fill: none; stroke: var(--green); stroke-opacity: .12; stroke-width: 1.1; stroke-dasharray: 2 11; stroke-linecap: round; }
.perfil__link {
  stroke: var(--green); stroke-width: 1.3; stroke-opacity: .10; stroke-linecap: round;
  transition: stroke-opacity .4s ease;
}
.perfil__link.is-active {
  stroke-opacity: .8; stroke-dasharray: 5 9;
  filter: drop-shadow(0 0 4px rgba(46, 226, 152, .8));
  animation: linkFlow 1.1s linear infinite;
}
.perfil__spy {
  position: absolute; left: 50%; bottom: 0; transform: translateX(-50%);
  width: auto; height: 92%; max-width: 86%; object-fit: contain;
  object-position: bottom center; z-index: 2;
  filter: drop-shadow(0 26px 52px rgba(0, 0, 0, .6));
  -webkit-mask-image: linear-gradient(to bottom, #000 72%, transparent 99%);
  mask-image: linear-gradient(to bottom, #000 72%, transparent 99%);
  animation: spyBreath 7.5s ease-in-out infinite;
}
.perfil__nodes { position: absolute; inset: 0; list-style: none; margin: 0; padding: 0; z-index: 4; }
.skill-node {
  position: absolute; left: var(--x); top: var(--y);
  transform: translate(-50%, -50%); z-index: 2;
  animation: spyFloat 7s ease-in-out infinite;
  animation-delay: calc(var(--i, 0) * -1.25s);
}
.skill-node.is-hovered { z-index: 60; }
.skill-node__btn {
  display: flex; align-items: center; gap: 11px;
  background: none; border: none; padding: 0; margin: 0; cursor: pointer;
  width: max-content; max-width: 162px; text-align: left; font: inherit; color: inherit;
}
.skill-node--r .skill-node__btn { flex-direction: row-reverse; text-align: right; }
.skill-node__icon {
  position: relative; flex-shrink: 0;
  width: 56px; height: 56px; border-radius: 50%;
  display: grid; place-items: center;
  border: 1.5px solid rgba(255, 255, 255, .12);
  background: rgba(255, 255, 255, .03);
  color: rgba(255, 255, 255, .38);
  transition: color .35s ease, border-color .35s ease, background .35s ease, box-shadow .35s ease, transform .25s cubic-bezier(.34, 1.56, .64, 1);
}
.skill-node__icon svg { width: 27px; height: 27px; }
.skill-node__state {
  position: absolute; top: 2px; right: 2px; width: 11px; height: 11px; border-radius: 50%;
  background: rgba(255, 255, 255, .14); border: 2px solid var(--bg);
  transition: background .3s ease, box-shadow .3s ease;
}
.skill-node--r .skill-node__state { right: auto; left: 2px; }
.skill-node__label {
  font-family: var(--font-mont); font-weight: 600; font-size: 13px; line-height: 1.25;
  color: rgba(255, 255, 255, .45); transition: color .35s ease;
}
.skill-node.is-active .skill-node__icon {
  color: #d7ffee; border-color: var(--green);
  background: radial-gradient(circle at 50% 38%, rgba(46, 226, 152, .35), rgba(7, 38, 27, .7));
  box-shadow: 0 0 0 4px rgba(46, 226, 152, .1), 0 0 22px rgba(46, 226, 152, .5);
}
.skill-node.is-active .skill-node__label { color: var(--white); }
.skill-node.is-active .skill-node__state { background: var(--green); box-shadow: 0 0 10px rgba(46, 226, 152, .9); }
.skill-node__btn:hover .skill-node__icon { transform: scale(1.08); border-color: var(--green); color: #eafff6; }
.skill-node__btn:focus-visible { outline: none; }
.skill-node__btn:focus-visible .skill-node__icon { border-color: var(--green); box-shadow: 0 0 0 3px rgba(46, 226, 152, .35); }
.skill-node__pop {
  position: absolute; z-index: 5; width: 224px;
  top: calc(100% + 13px); padding: 14px 15px; border-radius: 12px;
  background: #07140e; border: 1px solid rgba(46, 226, 152, .35);
  -webkit-backdrop-filter: blur(10px); backdrop-filter: blur(10px);
  box-shadow: 0 20px 50px rgba(0, 0, 0, .7);
  opacity: 0; visibility: hidden; pointer-events: none;
  transform: translateY(8px);
  transition: opacity .26s ease, transform .26s ease, visibility .26s;
}
.skill-node:not(.skill-node--r) .skill-node__pop { left: 0; right: auto; }
.skill-node--r .skill-node__pop { left: auto; right: 0; }
.skill-node--up .skill-node__pop { top: auto; bottom: calc(100% + 13px); transform: translateY(-8px); }
.skill-node.is-hovered .skill-node__pop { opacity: 1; visibility: visible; transform: translateY(0); }
.skill-node__pop::after {
  content: ""; position: absolute; top: -6px; left: 28px;
  width: 11px; height: 11px; background: #07140e; transform: rotate(45deg);
  border-left: 1px solid rgba(46, 226, 152, .35); border-top: 1px solid rgba(46, 226, 152, .35);
}
.skill-node--r .skill-node__pop::after { left: auto; right: 28px; }
.skill-node--up .skill-node__pop::after { top: auto; bottom: -6px; border: none; border-right: 1px solid rgba(46, 226, 152, .35); border-bottom: 1px solid rgba(46, 226, 152, .35); }
.skill-node__pop-title { font-family: var(--font-sora); font-weight: 700; font-size: 13px; color: var(--green); margin-bottom: 6px; }
.skill-node__pop-text { font-family: var(--font-mont); font-size: 12.5px; line-height: 1.5; color: var(--white-75); }
.skill-node.just-toggled .skill-node__icon { animation: nodePop .4s cubic-bezier(.34, 1.56, .64, 1); }
.perfil__stage[data-complete="true"] .perfil__halo { background: radial-gradient(circle, rgba(46, 226, 152, .3), rgba(46, 226, 152, .08) 46%, transparent 72%); }
.perfil__stage[data-complete="true"] .perfil__ring { stroke-opacity: .26; animation: ringPulse 2.6s ease-in-out infinite; }
.perfil__enroll-wrap {
  display: grid; grid-template-rows: 0fr; opacity: 0; margin-top: 0;
  transition: grid-template-rows .55s cubic-bezier(.22, 1, .36, 1), opacity .45s ease, margin-top .45s ease;
}
.perfil__enroll-inner { overflow: hidden; min-height: 0; }
.perfil__enroll-note { display: flex; align-items: center; gap: 9px; font-family: var(--font-mont); font-weight: 700; font-size: 12px; letter-spacing: .1em; text-transform: uppercase; color: var(--green); margin-bottom: 12px; }
.perfil__enroll-check { display: grid; place-items: center; width: 18px; height: 18px; border-radius: 50%; background: var(--green); color: var(--bg); font-size: 11px; font-weight: 800; }
.perfil__enroll { transform: translateY(10px) scale(.97); transition: transform .5s cubic-bezier(.22, 1, .36, 1), box-shadow .3s ease; }
.perfil.is-complete .perfil__enroll-wrap { grid-template-rows: 1fr; opacity: 1; margin-top: 26px; }
.perfil.is-complete .perfil__enroll { transform: none; animation: enrollPulse 2.2s ease-in-out .5s infinite; }
.perfil.is-complete .perfil__halo { background: radial-gradient(circle, rgba(46, 226, 152, .32), rgba(46, 226, 152, .09) 46%, transparent 72%); }
.perfil.is-complete .perfil__ring { stroke-opacity: .24; animation: ringPulse 2.6s ease-in-out infinite; }
@media (max-width: 1024px) {
  .perfil { gap: 24px; }
  .skill-node__btn { max-width: 132px; }
  .skill-node__label { font-size: 12px; }
}
@media (max-width: 900px) {
  .perfil { grid-template-columns: 1fr; gap: 34px; }
  .perfil__intro { max-width: 560px; margin: 0 auto; text-align: center; }
  .perfil__subtitle, .perfil__meter, .perfil__hint { margin-left: auto; margin-right: auto; }
  .perfil__stage { max-width: 470px; }
}
@media (max-width: 600px) {
  .perfil__stage { aspect-ratio: auto; display: flex; flex-direction: column; gap: 16px; max-width: 440px; }
  .perfil__scene { position: relative; height: 300px; }
  .perfil__orbits { display: none; }
  .perfil__nodes { position: static; display: grid; grid-template-columns: 1fr; gap: 12px; }
  .skill-node { position: static; left: auto; top: auto; transform: none; animation: none; }
  .skill-node__btn {
    width: 100%; max-width: none; flex-direction: row; text-align: left; gap: 14px;
    padding: 13px 14px; border-radius: 14px; align-items: flex-start;
    border: 1px solid rgba(255, 255, 255, .08); background: rgba(255, 255, 255, .03);
  }
  .skill-node--r .skill-node__btn { flex-direction: row; text-align: left; }
  .skill-node--r .skill-node__state { right: 2px; left: auto; }
  .skill-node.is-active .skill-node__btn { border-color: rgba(46, 226, 152, .4); background: rgba(46, 226, 152, .06); }
  .skill-node__icon { width: 46px; height: 46px; }
  .skill-node__label { font-size: 14px; }
  .skill-node__pop {
    position: static; width: auto; opacity: 1; visibility: visible; pointer-events: auto;
    transform: none !important; margin-top: 10px; background: none; border: none; box-shadow: none;
    -webkit-backdrop-filter: none; backdrop-filter: none; padding: 0;
  }
  .skill-node__pop::after { display: none; }
  .skill-node__pop-title { display: none; }
  .skill-node__pop-text { color: var(--white-50); font-size: 12.5px; }
  .skill-node:not(.is-active) .skill-node__pop-text { color: rgba(255, 255, 255, .3); }
}
@media (max-width: 600px) {
  .skill-node .skill-node__icon {
    color: #d7ffee; border-color: var(--green);
    background: radial-gradient(circle at 50% 38%, rgba(46, 226, 152, .3), rgba(7, 38, 27, .7));
    box-shadow: 0 0 16px rgba(46, 226, 152, .3);
  }
  .skill-node .skill-node__label { color: var(--white); }
  .skill-node .skill-node__btn { border-color: rgba(46, 226, 152, .3); background: rgba(46, 226, 152, .05); }
  .skill-node .skill-node__pop-text { color: var(--white-50); }
}
@media (max-width: 600px) { .perfil__hint { display: none; } }
@media (max-width: 600px) {
  .perfil__enroll-wrap { grid-template-rows: 1fr; opacity: 1; margin-top: 22px; }
  .perfil__enroll { transform: none; }
}
@media (prefers-reduced-motion: reduce) {
  .perfil__platform, .perfil__halo, .perfil__spy, .skill-node, .perfil__link, .perfil__ring, .perfil__meter-fill { animation: none !important; }
}
@media (prefers-reduced-motion: reduce) {
  .perfil.is-complete .perfil__enroll { animation: none !important; }
}

/* sections/evo/evo.css */
/* evo — generado por refactor modular (verbatim de styles.css) */

.evo { background: #04140d url("../assets/images/background/2.webp") center / cover no-repeat; padding: 80px 0 90px; }
.evo__label { font-weight: 600; font-size: 14px; color: var(--green); margin-bottom: 22px; }
.evo__title { font-weight: 500; font-size: 40px; text-align: center; }
.evo__title .text-green { font-weight: 700; }
.evo__subtitle { text-align: center; color: var(--white-75); font-size: 16px; max-width: 640px; margin: 14px auto 50px; line-height: 1.5; }
.evo__carousel { display: flex; align-items: center; gap: 20px; }
.evo__track { flex: 1; display: flex; gap: 24px; overflow: hidden; scroll-behavior: smooth; }
.evo-card {
  flex: 0 0 calc((100% - 24px) / 2);
  min-width: 0;
  border: 1px solid rgba(46, 226, 152, 0.4);
  border-radius: 16px;
  background: rgba(46, 226, 152, 0.04);
  padding: 28px;
}
.evo-card__head { display: flex; align-items: center; gap: 12px; padding-bottom: 14px; border-bottom: 1px solid rgba(255, 255, 255, 0.12); margin-bottom: 16px; }
.evo-card__num { font-family: var(--font-sora); font-weight: 700; font-size: 34px; color: var(--green); }
.evo-card__name { font-family: var(--font-sora); font-weight: 700; font-size: 18px; letter-spacing: 1px; }
.evo-card__heading { font-size: 15px; color: var(--green); margin-bottom: 18px; }
.evo-card__body { display: flex; gap: 20px; align-items: stretch; }
.evo-card__pic { display: contents; }
.evo-card__img { width: 140px; flex-shrink: 0; border-radius: 8px; align-self: stretch; min-height: 190px; object-fit: cover; }
.evo-card__list { display: flex; flex-direction: column; gap: 9px; }
.evo-card__list li { font-family: var(--font-mont); font-size: 14px; color: var(--white-75); line-height: 1.35; }
.evo-card__text { font-family: var(--font-mont); font-size: 14px; color: var(--white-75); line-height: 1.55; }
.evo__dots { display: none; }
@media (max-width: 1024px) {
  .evo-card { flex-basis: calc((100% - 24px) / 2); }
}
@media (max-width: 900px) {
  .evo-card { flex-basis: 100%; }
}
@media (max-width: 600px) {
  .evo {
    padding: 40px 0 50px;
    background-position: center top;
  }
  .evo .wrap {
    padding-left: 16px;
    padding-right: 16px;
  }
  .evo__label {
    display: none;
  }
  .evo__title {
    max-width: 370px;
    margin: 0 0 12px;
    text-align: left;
    font-size: 28px;
    line-height: 1.08;
  }
  .evo__subtitle {
    max-width: 350px;
    margin: 0 0 30px;
    text-align: left;
    font-size: 15px;
    line-height: 1.45;
    color: rgba(255, 255, 255, 0.86);
  }
  .evo__carousel {
    position: relative;
    display: block;
    padding: 0 44px;
  }
  .evo__track {
    gap: 0;
    min-width: 0;
    overflow: hidden;
    scroll-snap-type: x mandatory;
  }
  .evo-card {
    flex: 0 0 100%;
    width: 100%;
    max-width: 100%;
    min-width: 100%;
    padding: 16px 14px 18px;
    border-radius: 10px;
    scroll-snap-align: start;
  }
  .evo-card__head {
    gap: 7px;
    padding-bottom: 13px;
    margin-bottom: 14px;
    border-bottom-color: rgba(46, 226, 152, 0.42);
  }
  .evo-card__num {
    font-size: 28px;
    line-height: 1;
  }
  .evo-card__name {
    font-size: 19px;
    line-height: 1.1;
    text-transform: uppercase;
  }
  .evo-card__heading {
    margin-bottom: 18px;
    font-size: 17px;
    line-height: 1.15;
  }
  .evo-card__body {
    flex-direction: column;
    gap: 18px;
  }
  .evo-card__img {
    width: 100%;
    min-height: 0;
    aspect-ratio: 16 / 9;
    align-self: auto;
    border-radius: 8px;
    object-position: center 18%;
  }
  .evo-card:nth-child(3) .evo-card__img {
    object-position: center 52%;
  }
  .evo-card__text {
    font-size: 15px;
    line-height: 1.38;
    color: rgba(255, 255, 255, 0.86);
  }
  .evo__carousel .caro-arrow {
    position: absolute;
    top: 52%;
    width: 32px;
    height: 32px;
    transform: translateY(-50%);
    z-index: 2;
  }
  .evo__prev { left: -2px; }
  .evo__next { right: -2px; }
  .evo__dots {
    display: flex;
    justify-content: center;
    gap: 7px;
    margin-top: 28px;
  }
  .evo__dot {
    width: 12px;
    height: 12px;
    border-radius: 50%;
    border: 1.5px solid var(--green);
    background: transparent;
    padding: 0;
  }
  .evo__dot--active {
    background: var(--green);
  }
}

/* sections/porque/porque.css */
/* porque — generado por refactor modular (verbatim de styles.css) */

.porque { background: #03130D url("../assets/images/background/3.webp") center / cover no-repeat; padding: 80px 0 90px; }
.porque__title { font-weight: 800; font-size: 44px; text-align: center; line-height: 1.1; margin-bottom: 40px; }
.porque__title .text-green { font-weight: 700; }
.porque__tabs { display: flex; justify-content: center; flex-wrap: wrap; gap: 18px; }
.porque__item { display: contents; }
.porque__tab {
  font-family: var(--font-sora);
  font-size: 14px;
  color: var(--green);
  background: transparent;
  border: 1px solid var(--green);
  border-radius: 30px;
  padding: 12px 28px;
  cursor: pointer;
  transition: background .2s, color .2s;
}
.porque__tab--active { background: var(--green); color: var(--dark-text); font-weight: 600; }
.porque__panel {
  display: none;
  order: 99;
  width: 100%;
  align-items: center;
  gap: 40px;
  background: rgba(46, 226, 152, 0.05);
  border-radius: 16px;
  padding: 40px;
  margin-top: 28px;
}
.porque__panel--active { display: flex; }
.porque__img { width: clamp(280px, 32vw, 380px); aspect-ratio: 1; border-radius: 8px; flex-shrink: 0; object-fit: cover; }
.porque__divider { width: 2px; align-self: stretch; background: var(--green); flex-shrink: 0; }
.porque__content { flex: 1; }
.porque__heading { font-family: var(--font-sora); font-weight: 600; font-size: 28px; color: var(--green); line-height: 1.2; margin-bottom: 18px; }
.porque__text { font-family: var(--font-mont); font-size: 16px; line-height: 1.7; color: var(--white); }
.porque__apply {
  display: flex;
  align-items: flex-start;
  flex-direction: column;
  gap: 20px;
  margin-top: 24px;
}
.porque__content .porque__requirement {
  margin: 0;
  font-family: var(--font-sora);
  font-weight: 900;
  font-size: 16px;
  line-height: 1.45;
  color: var(--white);
}
.porque__content .porque__requirement strong { font-weight: 900; }
.porque__apply-btn {
  flex-shrink: 0;
  margin-top: 0;
}
@media (max-width: 600px) {
  .porque {
    padding: 48px 0 40px;
    background-position: center top;
  }
  .porque .wrap {
    padding-left: 16px;
    padding-right: 16px;
  }
  .porque__title {
    margin-bottom: 34px;
    text-align: left;
    font-size: 26px;
    line-height: 1.06;
  }
  .porque__tabs {
    display: block;
    margin-bottom: 0;
    border-top: 1px solid rgba(46, 226, 152, 0.35);
  }
  .porque__item {
    display: block;
    border-bottom: 1px solid rgba(46, 226, 152, 0.35);
  }
  .porque__tab {
    position: relative;
    width: 100%;
    min-height: 54px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 0 8px;
    border: 0;
    border-radius: 0;
    background: transparent;
    color: var(--green);
    font-size: 15px;
    font-weight: 500;
    text-align: left;
  }
  .porque__tab::after {
    content: "";
    width: 10px;
    height: 10px;
    border-right: 2px solid currentColor;
    border-bottom: 2px solid currentColor;
    transform: rotate(45deg) translateY(-2px);
    transition: transform .2s ease;
  }
  .porque__tab--active {
    background: transparent;
    color: var(--green);
    font-weight: 500;
  }
  .porque__tab--active::after {
    transform: rotate(-135deg) translate(-2px, -1px);
  }
  .porque__panel {
    order: initial;
    width: 100%;
    margin-top: 0;
    padding: 0 8px 28px;
    display: none;
    flex-direction: column;
    gap: 0;
    background: transparent;
    border-radius: 0;
  }
  .porque__panel--active {
    display: flex;
  }
  .porque__img {
    order: 1;
    width: 100%;
    aspect-ratio: 16 / 8.8;
    margin-bottom: 28px;
    border-radius: 0;
  }
  .porque__divider {
    order: 2;
    display: block;
    width: 100%;
    height: 2px;
    margin: 0 0 28px;
    background: var(--green);
  }
  .porque__content {
    order: 3;
  }
  .porque__heading {
    margin-bottom: 16px;
    font-size: 19px;
    line-height: 1.25;
    font-weight: 700;
  }
  .porque__text {
    font-size: 14px;
    line-height: 1.45;
    color: rgba(255, 255, 255, 0.84);
  }
  .porque__apply {
    gap: 18px;
    margin-top: 20px;
  }
  .porque__requirement {
    font-size: 14px;
    line-height: 1.35;
  }
  .porque__apply-btn {
    width: 100%;
  }
}

/* sections/docentes/docentes.css */
/* docentes — generado por refactor modular (verbatim de styles.css) */

.docentes { background: #03130D url("../assets/images/background/4.webp") center / cover no-repeat; padding: 80px 0 90px; }
.docentes__title { font-weight: 800; font-size: 40px; text-align: center; line-height: 1.15; margin-bottom: 50px; }
.docentes__title .text-green { font-weight: 700; }
.docentes__carousel { display: flex; align-items: center; gap: 16px; }
.docentes__track { flex: 1; display: flex; gap: 20px; overflow: hidden; scroll-behavior: smooth; }
.doc-card {
  position: relative;
  flex: 0 0 calc((100% - 40px) / 3);
  min-width: 0;
  background: #03130d;
  border-radius: 12px;
  overflow: hidden;
  cursor: pointer;
  aspect-ratio: 3 / 4;
}
.doc-card__img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; object-position: top center; }
.doc-card__panel {
  position: absolute; inset: 0; z-index: 2;
  display: flex; flex-direction: column; justify-content: flex-end;
  padding: 20px 16px;
  background: linear-gradient(to top, rgba(3, 19, 13, 0.94) 18%, rgba(3, 19, 13, 0) 54%);
}
.doc-card__panel::before {
  content: ''; position: absolute; inset: 0; z-index: -1;
  background: rgba(3, 19, 13, 0.86);
  opacity: 0; transition: opacity .42s ease;
}
.doc-card--open .doc-card__panel::before { opacity: 1; }
.doc-card__flag { display: inline-block; font-family: var(--font-mont); font-weight: 700; font-size: 11px; color: #2ee298; letter-spacing: 1px; }
.doc-card__name { font-family: var(--font-sora); font-weight: 700; font-size: 14px; color: #fff; margin-top: 4px; }
.doc-card__role { font-family: var(--font-mont); font-size: 11px; color: rgba(255, 255, 255, 0.72); margin-top: 4px; }
.doc-card__bio-wrap {
  display: grid; grid-template-rows: 0fr; overflow: hidden;
  transition: grid-template-rows .42s cubic-bezier(.22, .61, .36, 1);
}
.doc-card--open .doc-card__bio-wrap { grid-template-rows: 1fr; }
.doc-card__bio {
  overflow: hidden; min-height: 0; margin: 0; padding-top: 14px;
  font-family: var(--font-mont); font-size: 12.5px; color: rgba(255, 255, 255, 0.9); line-height: 1.6;
}
.doc-card__toggle { display: none; }
.docentes__dots { display: flex; justify-content: center; gap: 8px; margin-top: 40px; }
.docentes__dot {
  width: 34px; height: 5px; border: 0; padding: 0; border-radius: 3px;
  background: rgba(255, 255, 255, 0.22);
  cursor: pointer;
  transition: background .3s ease;
}
.docentes__dot--on { background: #2ee298; }
@media (max-width: 1024px) {
  .docentes__track .doc-card { flex-basis: calc((100% - 40px) / 2); }
}
@media (max-width: 900px) {
  .docentes__track .doc-card { flex-basis: calc((100% - 20px) / 2); }
}
@media (max-width: 600px) {
  .docentes {
    padding: 42px 0 46px;
    background-position: center top;
  }
  .docentes .wrap {
    padding-left: 14px;
    padding-right: 14px;
  }
  .docentes__title {
    margin-bottom: 30px;
    text-align: left;
    font-size: 29px;
    font-weight: 600;
    line-height: 0.97;
    letter-spacing: 0;
  }
  .docentes__title br { display: none; }
  .docentes__title .text-green { font-weight: 600; }
  .docentes__carousel {
    display: block;
  }
  .docentes__track { flex-direction: column; gap: 0; overflow: visible; }
  .docentes__track .doc-card {
    flex: none; width: 100%; aspect-ratio: auto;
    display: grid; grid-template-columns: 108px minmax(0, 1fr) 28px;
    grid-template-areas: "img info toggle" "bio bio bio";
    column-gap: 10px; align-items: center;
    border-radius: 0; overflow: visible; background: transparent;
    border-bottom: 1px solid rgba(46, 226, 152, 0.35);
    padding: 16px 0;
  }
  .docentes__track .doc-card__img { grid-area: img; position: static; width: 108px; height: 116px; border-radius: 0; }
  .docentes__track .doc-card__panel { display: contents; }
  .docentes__track .doc-card__info { grid-area: info; position: static; padding: 0; background: none; }
  .docentes__track .doc-card__flag {
    font-size: 12px;
    font-weight: 500;
    letter-spacing: 0;
    color: var(--white);
  }
  .docentes__track .doc-card__name {
    margin-top: 4px;
    font-size: 13.5px;
    line-height: 1.15;
  }
  .docentes__track .doc-card__role {
    margin-top: 5px;
    font-size: 13.5px;
    line-height: 1.22;
    color: rgba(255, 255, 255, 0.86);
  }
  .docentes__track .doc-card__toggle {
    grid-area: toggle; display: block; align-self: start;
    justify-self: end;
    font-family: var(--font-sora); font-size: 28px; line-height: 1;
    color: var(--green); cursor: pointer; padding-left: 0;
  }
  .docentes__track .doc-card__toggle::before { content: "+"; }
  .docentes__track .doc-card--open .doc-card__toggle::before { content: "\2212"; }
  .docentes__track .doc-card__bio-wrap { grid-area: bio; margin-top: 0; }
  .docentes__track .doc-card__bio {
    padding: 0;
    transition: padding-top .42s cubic-bezier(.22, .61, .36, 1);
    font-size: 14px;
    line-height: 1.28;
    color: #0b1714;
  }
  .docentes__track .doc-card__bio strong {
    font-weight: 700;
  }
  .docentes__track .doc-card--open .doc-card__bio-wrap {
    margin-top: 16px;
  }
  .docentes__track .doc-card--open .doc-card__bio {
    padding: 18px 16px;
    background: #edf3f2;
  }
  .docentes__dots {
    display: flex;
    justify-content: center;
    gap: 7px;
    margin-top: 24px;
  }
  .docentes__dot {
    width: 12px;
    height: 12px;
    border-radius: 50%;
    border: 1.5px solid var(--green);
    background: transparent;
  }
  .docentes__dot--on {
    background: var(--green);
  }
}

/* sections/prog/prog.css */
/* prog — generado por refactor modular (verbatim de styles.css) */

.prog { background: #03130D url("../assets/images/background/5.webp") center / cover no-repeat; padding: 80px 0 90px; }
.prog__title { font-weight: 800; font-size: 44px; text-align: center; margin-bottom: 46px; }
.prog__acc { border: 1px solid rgba(255, 255, 255, 0.12); border-radius: 16px; overflow: hidden; }
.prog-item { border-bottom: 1px solid rgba(255, 255, 255, 0.1); }
.prog-item:last-child { border-bottom: none; }
.prog-item__head {
  width: 100%;
  display: grid;
  grid-template-columns: 1fr 40px;
  align-items: center;
  gap: 24px;
  padding: 24px 28px;
  background: transparent;
  border: none;
  cursor: pointer;
  text-align: left;
}
.prog-item__id { display: flex; flex-direction: column; gap: 4px; }
.prog-item__etapa { font-family: var(--font-sora); font-weight: 700; font-size: 15px; color: var(--green); }
.prog-item__name { font-family: var(--font-sora); font-weight: 600; font-size: 16px; color: var(--white); line-height: 1.3; }
.prog-item__short { font-family: var(--font-mont); font-weight: 600; font-size: 15px; color: var(--white); line-height: 1.4; }
.prog-item__icon { font-size: 26px; color: var(--green); text-align: center; line-height: 1; }
.prog-item__full { display: none; padding: 0 28px 26px; }
.prog-item__full p { font-family: var(--font-mont); font-size: 15px; line-height: 1.65; }
.prog-item--open { background: #eef3f2; }
.prog-item--open .prog-item__head { grid-template-columns: 1fr 40px; }
.prog-item--open .prog-item__name { color: #0a3524; }
.prog-item--open .prog-item__icon { color: #0a3524; }
.prog-item--open .prog-item__short { display: none; }
.prog-item--open .prog-item__full { display: block; }
.prog-item--open .prog-item__full p { color: #20302a; }
@media (max-width: 900px) {
  .prog-item__head { grid-template-columns: 1fr 40px; }
  .prog-item__short { display: none; }
}
@media (max-width: 600px) {
  .prog {
    padding: 34px 0 44px;
    background-position: center top;
  }
  .prog .wrap {
    padding-left: 14px;
    padding-right: 14px;
  }
  .prog__title {
    margin-bottom: 28px;
    text-align: center;
    font-size: 28px;
    line-height: 1.1;
  }
  .prog__acc {
    border: 1px solid var(--green);
    border-radius: 9px;
    overflow: hidden;
    background: rgba(3, 19, 13, 0.72);
  }
  .prog-item {
    border-bottom: 1px solid rgba(46, 226, 152, 0.28);
  }
  .prog-item__head {
    grid-template-columns: minmax(0, 1fr) 32px;
    gap: 12px;
    padding: 17px 14px;
  }
  .prog-item__id {
    gap: 8px;
    min-width: 0;
  }
  .prog-item__etapa {
    font-size: 13px;
    line-height: 1;
  }
  .prog-item__name {
    font-size: 14px;
    line-height: 1.18;
    font-weight: 700;
    text-transform: uppercase;
  }
  .prog-item__icon {
    font-size: 34px;
    line-height: 0.8;
  }
  .prog-item__full {
    padding: 0 14px 20px;
  }
  .prog-item__full p {
    font-size: 14px;
    line-height: 1.55;
  }
  .prog-item--open {
    background: #edf3f2;
  }
  .prog-item--open .prog-item__head {
    grid-template-columns: minmax(0, 1fr) 32px;
    padding-bottom: 8px;
  }
  .prog-item--open .prog-item__etapa {
    color: var(--green);
  }
  .prog-item--open .prog-item__name,
  .prog-item--open .prog-item__icon {
    color: #0b1714;
  }
  .prog-item--open .prog-item__full p {
    color: #25322f;
  }
}

/* sections/espias/espias.css */
/* espias — generado por refactor modular (verbatim de styles.css) */

.espias {
  position: relative; overflow: hidden;
  background: radial-gradient(120% 80% at 50% -8%, rgba(46, 226, 152, .09), transparent 58%), var(--bg);
  padding: 70px 0 78px;
}
.espias__label { font-weight: 600; font-size: 14px; letter-spacing: .05em; color: var(--green); text-align: center; margin-bottom: 12px; }
.espias__title { font-family: var(--font-sora); font-weight: 800; font-size: clamp(28px, 3.6vw, 42px); line-height: 1.08; text-align: center; margin-bottom: 12px; }
.espias__subtitle { text-align: center; color: var(--white-75); font-size: 16px; max-width: 560px; margin: 0 auto 40px; }
.espias__select { display: grid; grid-template-columns: 338px minmax(0, 1fr) 318px; gap: 30px; align-items: center; }
.espias__col-label { font-family: var(--font-mont); font-weight: 700; font-size: 11px; letter-spacing: .14em; text-transform: uppercase; color: var(--white-50); margin-bottom: 12px; }
/* Roster en perspectiva 3D: la grilla se inclina "hacia adentro" — la columna
   izquierda queda más cerca/grande y la derecha recede al fondo. */
.espias__roster-col { perspective: 1050px; perspective-origin: 56% 50%; }
.espias__roster {
  display: grid; grid-template-columns: repeat(3, 1fr); gap: 12px;
  transform-style: preserve-3d;
  transform: rotateY(25deg) rotateX(4deg);
  transform-origin: center center;
}
.espias__pick {
  background: none; border: none; padding: 0; margin: 0; cursor: pointer; display: block;
  transform-style: preserve-3d; transform: translateZ(0);
  transition: transform .45s cubic-bezier(.22, 1, .36, 1), opacity .4s ease;
}
/* Falloff de profundidad: la columna derecha (al fondo) se atenúa. */
.espias__pick:nth-child(3n+2) { opacity: .94; }
.espias__pick:nth-child(3n)   { opacity: .84; }
.espias__pick:hover, .espias__pick:focus-visible, .espias__pick.is-active {
  transform: translateZ(44px); opacity: 1;
}
.espias__thumb {
  display: block; width: 100%;
  position: relative; aspect-ratio: 1 / 1; border-radius: 11px; overflow: hidden;
  border: 1.5px solid var(--white-10);
  background-color: rgba(255, 255, 255, .03);
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 64 64'%3E%3Cg fill='none' stroke='%232EE298' stroke-opacity='0.22' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 24h40'/%3E%3Cpath d='M19 24c0-8 6-13 13-13s13 5 13 13'/%3E%3Ccircle cx='32' cy='36' r='8'/%3E%3Cpath d='M16 58c0-9 7-15 16-15s16 6 16 15'/%3E%3C/g%3E%3C/svg%3E"); background-repeat: no-repeat; background-position: center 36%; background-size: 46%;
  transition: border-color .25s ease, box-shadow .25s ease, transform .25s cubic-bezier(.34, 1.56, .64, 1);
}
.espias__thumb img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; object-position: center top; }
.espias__pick:hover .espias__thumb { transform: translateY(-2px); border-color: rgba(46, 226, 152, .55); }
.espias__pick.is-active .espias__thumb { border-color: var(--green); box-shadow: 0 0 0 2px rgba(46, 226, 152, .18), 0 0 18px rgba(46, 226, 152, .5); }
.espias__pick:focus-visible .espias__thumb { outline: none; border-color: var(--green); box-shadow: 0 0 0 3px rgba(46, 226, 152, .4); }
.espias__stagebox { position: relative; min-height: 430px; display: flex; align-items: flex-end; justify-content: center; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 64 64'%3E%3Cg fill='none' stroke='%232EE298' stroke-opacity='0.16' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 24h40'/%3E%3Cpath d='M19 24c0-8 6-13 13-13s13 5 13 13'/%3E%3Ccircle cx='32' cy='36' r='8'/%3E%3Cpath d='M16 58c0-9 7-15 16-15s16 6 16 15'/%3E%3C/g%3E%3C/svg%3E"); background-repeat: no-repeat; background-position: center 38%; background-size: 26%; }
.espias__hero-glow { position: absolute; left: 50%; top: 42%; transform: translate(-50%, -50%); width: 98%; height: 88%; border-radius: 50%; background: radial-gradient(circle at 50% 42%, rgba(46, 226, 152, .30), rgba(46, 226, 152, .07) 46%, transparent 70%), conic-gradient(from 210deg at 50% 36%, rgba(46, 226, 152, .14), transparent 28%, transparent 72%, rgba(138, 255, 201, .12)); filter: blur(26px); animation: spyHalo 7s ease-in-out infinite; }
.espias__platform { position: absolute; left: 50%; bottom: 7%; transform: translateX(-50%); width: 56%; height: 12%; border-radius: 50%; background: radial-gradient(ellipse at center, rgba(46, 226, 152, .55), rgba(46, 226, 152, .12) 50%, transparent 72%); filter: blur(6px); animation: spyPlatform 3.8s ease-in-out infinite; }
.espias__hero-img {
  position: relative; max-height: 430px; max-width: 94%; width: auto; object-fit: contain;
  filter: drop-shadow(0 22px 44px rgba(0, 0, 0, .6)) drop-shadow(0 0 11px rgba(46, 226, 152, .34));
  -webkit-mask-image: linear-gradient(to bottom, #000 90%, transparent 100%);
  mask-image: linear-gradient(to bottom, #000 90%, transparent 100%);
}
.espias__stagebox.is-switching .espias__hero-img { animation: espiasSwap .5s ease; }
.espias__panel { align-self: center; }
.espias__panel.is-switching { animation: espiasRise .45s ease; }
.espias__emblem { display: block; width: 50px; height: 50px; color: var(--green); margin-bottom: 14px; filter: drop-shadow(0 0 8px rgba(46, 226, 152, .4)); }
.espias__ficha { font-family: var(--font-sora); font-weight: 800; font-size: 13px; letter-spacing: .08em; color: var(--green); margin-bottom: 8px; }
.espias__ficha-total { color: var(--white-50); }
.espias__name { font-family: var(--font-sora); font-weight: 800; font-size: clamp(26px, 2.7vw, 35px); line-height: 1.05; }
.espias__role { font-family: var(--font-mont); font-weight: 600; font-size: 14px; color: var(--green); margin: 5px 0 9px; }
.espias__panel-meta { font-family: var(--font-mont); font-size: 12.5px; color: var(--white-50); margin-bottom: 18px; }
.espias__stats { display: flex; flex-direction: column; gap: 12px; }
.espias__stat-top { font-family: var(--font-mont); font-weight: 700; font-size: 10.5px; letter-spacing: .12em; text-transform: uppercase; color: var(--white-75); margin-bottom: 6px; }
.espias__stat-bar { position: relative; height: 8px; border-radius: 99px; background: rgba(255, 255, 255, .08); overflow: hidden; }
.espias__stat-fill { display: block; height: 100%; border-radius: 99px; background: linear-gradient(90deg, #0f8f5e, var(--green)); box-shadow: 0 0 10px rgba(46, 226, 152, .5); transition: width .7s cubic-bezier(.22, 1, .36, 1); }
.espias__stat-bar::after { content: ""; position: absolute; inset: 0; background: repeating-linear-gradient(90deg, transparent 0 9%, var(--bg) 9% 10.3%); pointer-events: none; }
.espias__hook { font-family: var(--font-mont); font-size: 13.5px; line-height: 1.55; color: #dfeee8; margin-top: 18px; }
.espias__panel-alias { font-family: var(--font-mont); font-size: 12px; color: var(--white-50); margin-top: 10px; }
.espias__panel-alias span { color: var(--white-75); }
.espias__cta { text-align: center; margin-top: 38px; }
.espias .wrap { position: relative; z-index: 1; }
.espias::before,
.espias::after {
  content: ""; position: absolute; top: 0; left: 0; z-index: 0; pointer-events: none; border-radius: 50%;
}
.espias::before {
  width: 2px; height: 2px;
  box-shadow:
    663px 308px 0px rgba(46,226,152,0.75),
    148px 1097px 0px rgba(46,226,152,0.45),
    1193px 118px 0px rgba(46,226,152,0.4),
    76px 176px 1px rgba(46,226,152,0.75),
    143px 492px 1px rgba(46,226,152,0.45),
    121px 253px 0px rgba(46,226,152,0.55),
    1181px 812px 0px rgba(46,226,152,0.45),
    95px 272px 1px rgba(46,226,152,0.65),
    295px 241px 0px rgba(46,226,152,0.4),
    1147px 370px 0px rgba(46,226,152,0.45),
    762px 199px 0px rgba(46,226,152,0.4),
    1155px 122px 0px rgba(46,226,152,0.4),
    1016px 1088px 0px rgba(46,226,152,0.75),
    953px 928px 0px rgba(46,226,152,0.65),
    508px 368px 0px rgba(46,226,152,0.55),
    1176px 614px 1px rgba(46,226,152,0.4),
    1792px 703px 0px rgba(46,226,152,0.75),
    1247px 149px 1px rgba(46,226,152,0.45),
    337px 700px 1px rgba(46,226,152,0.55),
    863px 80px 0px rgba(46,226,152,0.45),
    696px 717px 1px rgba(46,226,152,0.4),
    1187px 934px 0px rgba(46,226,152,0.45),
    552px 970px 0px rgba(46,226,152,0.45),
    1497px 634px 1px rgba(46,226,152,0.4),
    582px 790px 0px rgba(46,226,152,0.65),
    945px 727px 0px rgba(46,226,152,0.55),
    1011px 120px 0px rgba(46,226,152,0.55),
    264px 507px 1px rgba(46,226,152,0.75),
    1877px 1016px 0px rgba(46,226,152,0.45),
    919px 822px 0px rgba(46,226,152,0.4),
    1809px 280px 0px rgba(46,226,152,0.75),
    1446px 850px 1px rgba(46,226,152,0.65),
    472px 309px 0px rgba(46,226,152,0.45),
    309px 475px 0px rgba(46,226,152,0.55),
    993px 373px 0px rgba(46,226,152,0.65),
    8px 298px 0px rgba(46,226,152,0.75),
    1248px 652px 0px rgba(46,226,152,0.55),
    935px 803px 1px rgba(46,226,152,0.75),
    807px 212px 1px rgba(46,226,152,0.75),
    127px 390px 0px rgba(46,226,152,0.45),
    902px 332px 0px rgba(46,226,152,0.45),
    1230px 107px 0px rgba(46,226,152,0.45),
    1160px 309px 0px rgba(46,226,152,0.4),
    744px 52px 0px rgba(46,226,152,0.45),
    1257px 770px 0px rgba(46,226,152,0.55),
    711px 745px 0px rgba(46,226,152,0.75),
    236px 999px 1px rgba(46,226,152,0.75),
    990px 638px 0px rgba(46,226,152,0.45),
    209px 701px 1px rgba(46,226,152,0.65),
    1697px 330px 0px rgba(46,226,152,0.4),
    420px 1081px 0px rgba(46,226,152,0.65),
    1413px 55px 0px rgba(46,226,152,0.4),
    1316px 186px 0px rgba(46,226,152,0.65),
    1860px 342px 0px rgba(46,226,152,0.65),
    1090px 1029px 0px rgba(46,226,152,0.65),
    1255px 399px 1px rgba(46,226,152,0.55);
  animation: espSpark 5s ease-in-out infinite, espDrift 34s ease-in-out infinite;
}
.espias::after {
  width: 1px; height: 1px;
  box-shadow:
    1515px 464px 2px rgba(46,226,152,0.3),
    728px 59px 1px rgba(46,226,152,0.3),
    967px 530px 1px rgba(46,226,152,0.3),
    915px 715px 1px rgba(46,226,152,0.45),
    451px 209px 2px rgba(46,226,152,0.3),
    402px 691px 2px rgba(46,226,152,0.3),
    1278px 3px 1px rgba(46,226,152,0.45),
    1637px 173px 1px rgba(46,226,152,0.55),
    1863px 795px 2px rgba(46,226,152,0.55),
    979px 365px 1px rgba(46,226,152,0.45),
    177px 810px 2px rgba(46,226,152,0.45),
    1522px 173px 2px rgba(46,226,152,0.55),
    348px 260px 2px rgba(46,226,152,0.3),
    1209px 953px 2px rgba(46,226,152,0.55),
    1252px 971px 1px rgba(46,226,152,0.55),
    319px 268px 1px rgba(46,226,152,0.3),
    1637px 210px 2px rgba(46,226,152,0.55),
    888px 398px 1px rgba(46,226,152,0.3),
    515px 435px 2px rgba(46,226,152,0.45),
    1564px 667px 2px rgba(46,226,152,0.45),
    1708px 268px 1px rgba(46,226,152,0.3),
    1838px 938px 2px rgba(46,226,152,0.55),
    1693px 1027px 2px rgba(46,226,152,0.3),
    1072px 1045px 2px rgba(46,226,152,0.3),
    1590px 375px 1px rgba(46,226,152,0.55),
    1589px 306px 2px rgba(46,226,152,0.3),
    969px 246px 1px rgba(46,226,152,0.55),
    667px 1061px 2px rgba(46,226,152,0.55),
    1606px 217px 1px rgba(46,226,152,0.55),
    508px 391px 1px rgba(46,226,152,0.45),
    1581px 200px 2px rgba(46,226,152,0.55),
    1150px 57px 2px rgba(46,226,152,0.3);
  animation: espSpark 7.5s ease-in-out infinite 1.4s, espDrift 56s ease-in-out infinite;
}
@media (max-width: 1024px) {
  .espias__select { grid-template-columns: 280px 1fr 264px; gap: 20px; }
  .espias__stagebox { min-height: 380px; }
  .espias__hero-img { max-height: 380px; }
}
@media (max-width: 900px) {
  .espias__select { grid-template-columns: 1fr; gap: 26px; }
  .espias__stagebox { order: 1; min-height: 330px; }
  .espias__panel { order: 2; text-align: center; }
  .espias__roster-col { order: 3; }
  .espias__emblem { margin-left: auto; margin-right: auto; }
  .espias__stats { max-width: 420px; margin: 0 auto; }
  .espias__hero-img { max-height: 330px; }
  .espias__col-label { text-align: center; }
  /* En stack la grilla se aplana (sin 3D) para thumbs limpios y tappables. */
  .espias__roster-col { perspective: none; }
  .espias__roster { grid-template-columns: repeat(6, 1fr); max-width: 520px; margin: 0 auto; transform: none; }
  .espias__pick { transform: none !important; opacity: 1 !important; }
}
@media (max-width: 600px) {
  .espias__roster { grid-template-columns: repeat(4, 1fr); max-width: 360px; }
  .espias__stagebox { min-height: 290px; }
  .espias__hero-img { max-height: 290px; }
}
@media (prefers-reduced-motion: reduce) {
  .espias__hero-glow, .espias__platform, .espias__stagebox.is-switching .espias__hero-img, .espias__panel.is-switching { animation: none !important; }
  .espias__stat-fill { transition: none; }
}
@media (prefers-reduced-motion: reduce) { .espias::before, .espias::after { animation: none; opacity: .5; } }


/* ============================================================
   FX VIDEOJUEGO — Dirección A "Hangar / Grid-Floor" (panel de diseño)
   ============================================================ */
.espias__fx {
  position: absolute; inset: 0; z-index: 0;       /* sobre el bg, bajo .wrap */
  pointer-events: none; overflow: hidden;
}

/* 1a. GRID FLOOR en perspectiva — receding a punto de fuga 50% / ~58% alto.
   Dos gradientes repetidos (líneas horizontales + verticales) montados en
   un plano rotado en X. Animamos SOLO background-position (GPU-safe) para
   que las líneas "fluyan" hacia el espectador, sutil y lento. */
.espias__grid {
  position: absolute;
  left: 50%; bottom: -2%;
  width: 220%; height: 62%;
  transform: translateX(-50%) perspective(640px) rotateX(74deg);
  transform-origin: 50% 100%;
  /* líneas finas verde a baja alpha; la doble capa da malla */
  background-image:
    repeating-linear-gradient(to right,
      rgba(46,226,152,.14) 0 1px, transparent 1px 7%),
    repeating-linear-gradient(to bottom,
      rgba(46,226,152,.11) 0 1px, transparent 1px 8%);
  background-size: 7% 8%, 7% 8%;
  /* desvanecemos hacia el horizonte (arriba) y los lados → look volumétrico */
  -webkit-mask-image:
    radial-gradient(120% 120% at 50% 100%, #000 18%, transparent 72%);
  mask-image:
    radial-gradient(120% 120% at 50% 100%, #000 18%, transparent 72%);
  opacity: .9;
  animation: espGridFlow 26s linear infinite;
  will-change: background-position;
}
/* glow del horizonte: línea de luz donde "muere" la grilla */
.espias__grid::after {
  content: ""; position: absolute; left: 0; right: 0; top: 0; height: 34%;
  background: linear-gradient(to top,
    rgba(46,226,152,.20), rgba(46,226,152,.05) 55%, transparent);
  filter: blur(10px);
}

/* 1b. GOD-RAYS volumétricos — haces suaves cayendo desde arriba-izquierda.
   conic + linear muy difuminado, animados por opacity/transform (drift). */
.espias__rays {
  position: absolute;
  left: 50%; top: -20%;
  width: 130%; height: 110%;
  transform: translateX(-50%);
  background:
    repeating-conic-gradient(from 200deg at 46% -8%,
      rgba(46,226,152,.05) 0deg 3deg,
      transparent 3deg 11deg);
  -webkit-mask-image: linear-gradient(to bottom, #000 0%, transparent 64%);
  mask-image: linear-gradient(to bottom, #000 0%, transparent 64%);
  filter: blur(7px);
  mix-blend-mode: screen;
  opacity: .55;
  animation: espRays 16s ease-in-out infinite;
  will-change: opacity, transform;
}

/* 1c. VIGNETTE de profundidad — oscurece esquinas, foco al centro/hero. */
.espias__vignette {
  position: absolute; inset: 0;
  background: radial-gradient(120% 90% at 50% 42%,
    transparent 46%, rgba(3,19,13,.55) 100%);
}

/* Parallax sutil del starfield existente: lo empujamos un pelo y lo
   hacemos derivar un poquito más profundo (no rompe sus anims). */
.espias::before { will-change: transform; }
.espias::after  { will-change: transform; }

/* ---- 2. HERO: ILUMINACIÓN CINEMÁTICA + IDLE ------------------------
   La idle anim NO puede ir en .espias__hero-img porque .is-switching
   pone animation: espiasSwap en ese mismo elemento (lo clobbearía).
   Solución: WRAPPER .espias__hero-wrap (markup nuevo) lleva el float;
   el <img> conserva su swap. Las dos animaciones se componen. */

.espias__hero-wrap {
  position: relative;
  display: flex; align-items: flex-end; justify-content: center;
  transform: translateZ(0);                 /* capa propia */
  animation: espHeroFloat 8.5s ease-in-out infinite;
  will-change: transform;
}

/* 2a. KEY LIGHT — reemplaza/realza el hero-glow: radial amplio detrás+arriba.
   Mantenemos spyHalo pero subimos presencia y agregamos un núcleo cálido. */
.espias__hero-glow {
  /* override suave del existente: key más alto y direccional */
  top: 38%;
  background:
    radial-gradient(circle at 50% 30%,
      rgba(173,255,214,.34), rgba(46,226,152,.16) 38%, transparent 66%),
    conic-gradient(from 215deg at 50% 30%,
      rgba(46,226,152,.16), transparent 26%, transparent 74%,
      rgba(138,255,201,.13));
  filter: blur(30px);
  animation: spyHalo 7s ease-in-out infinite, espKeyPulse 9s ease-in-out infinite;
  will-change: opacity, transform, filter;
}

/* 2b. RIM LIGHT — halo verde fino que recorta la silueta del agente.
   Genérico (no asume forma): segundo glow más chico y nítido tras el img,
   posicionado donde suele estar el torso/cabeza. */
.espias__hero-rim {
  position: absolute;
  left: 50%; top: 30%;
  width: 62%; height: 64%;
  transform: translate(-50%, -50%);
  border-radius: 50%;
  background: radial-gradient(circle at 50% 42%,
    rgba(46,226,152,.0) 52%,
    rgba(126,255,200,.22) 60%,
    rgba(46,226,152,.10) 70%,
    transparent 80%);
  filter: blur(6px);
  z-index: -1;                               /* detrás del img dentro del wrap */
  animation: espRimBreath 6.5s ease-in-out infinite;
  will-change: opacity;
}

/* 2c. FLOOR BOUNCE — refuerza .espias__platform con rebote cálido bajo pies. */
.espias__platform {
  background: radial-gradient(ellipse at center,
    rgba(126,255,200,.6), rgba(46,226,152,.16) 48%, transparent 72%);
  filter: blur(7px);
}

/* 2d. SCAN-SWEEP opcional sobre la figura — banda de luz que sube lento.
   Va sobre el img pero recortada al wrap; usa mix-blend para no ensuciar. */
.espias__hero-wrap::after {
  content: ""; position: absolute; inset: 0;
  background: linear-gradient(to top,
    transparent 40%,
    rgba(173,255,214,.10) 49%,
    rgba(173,255,214,.18) 50%,
    rgba(173,255,214,.10) 51%,
    transparent 60%);
  mix-blend-mode: screen;
  opacity: .0;
  animation: espScanSweep 11s ease-in-out infinite;
  pointer-events: none;
  will-change: transform, opacity;
}

/* El img conserva su swap; sólo aseguramos que no herede el float dos veces. */
.espias__hero-img { will-change: transform, filter; }

/* ---- 3. KEYFRAMES NUEVOS ------------------------------------------ */
@keyframes espGridFlow {
  /* fluye la malla hacia el espectador moviendo el patrón vertical */
  0%   { background-position: 0 0, 0 0; }
  100% { background-position: 0 0, 0 8%; }     /* avanza una celda en Y */
}
@keyframes espRays {
  0%,100% { opacity: .45; transform: translateX(-50%) rotate(0deg); }
  50%     { opacity: .62; transform: translateX(-50%) rotate(1.2deg); }
}
@keyframes espHeroFloat {
  /* breathing: float vertical lento + micro-escala. Compone con espiasSwap
     porque vive en el WRAPPER, no en el img. */
  0%,100% { transform: translateY(0)      scale(1);     }
  50%     { transform: translateY(-9px)   scale(1.012); }
}
@keyframes espKeyPulse {
  0%,100% { opacity: .92; }
  50%     { opacity: 1;   }
}
@keyframes espRimBreath {
  0%,100% { opacity: .65; }
  50%     { opacity: 1;   }
}
@keyframes espScanSweep {
  /* la banda nace abajo, sube atravesando la figura, y descansa (opacity 0)
     la mayor parte del ciclo → discreto, no constante. */
  0%, 62%  { transform: translateY(60%);  opacity: 0;   }
  68%      { opacity: .9; }
  88%      { transform: translateY(-64%); opacity: .9;  }
  94%,100% { transform: translateY(-64%); opacity: 0;   }
}

/* ---- 4. RESPONSIVE ------------------------------------------------- */
@media (max-width: 1024px) {
  .espias__grid { height: 56%; transform: translateX(-50%) perspective(560px) rotateX(75deg); }
}
@media (max-width: 900px) {
  /* columnas apiladas: el stage va arriba; achicamos grid y desactivamos
     scan-sweep para no competir con texto. Sin overflow: width<=100%. */
  .espias__grid   { width: 180%; height: 46%; }
  .espias__rays   { opacity: .4; }
  .espias__hero-wrap::after { display: none; }
}
@media (max-width: 600px) {
  .espias__grid   { width: 150%; height: 40%; opacity: .7; }
  .espias__rays   { display: none; }          /* aligera mobile */
  .espias__hero-wrap { animation-duration: 9.5s; }
}

/* ---- 5. REDUCED MOTION — composición estática buena ---------------- */
@media (prefers-reduced-motion: reduce) {
  .espias__grid, .espias__rays, .espias__hero-wrap,
  .espias__hero-rim, .espias__hero-wrap::after {
    animation: none !important;
  }
  .espias__hero-glow { animation: none !important; opacity: 1; }
  .espias__rays { opacity: .4; }              /* rays quietos pero presentes */
  .espias__hero-rim { opacity: .8; }
  .espias__hero-wrap::after { opacity: 0; }   /* sin barrido, limpio */
}


/* sections/metodo/metodo.css */
/* metodo — generado por refactor modular (verbatim de styles.css) */

.metodo { position: relative; z-index: 2; background: #EDF3F2; color: #0a3524; padding: 80px 0 70px; }
.metodo__label { font-weight: 600; font-size: 13px; letter-spacing: 1px; color: #1c8a5c; margin-bottom: 34px; }
.metodo__title { font-family: var(--font-sora); font-weight: 800; font-size: 46px; color: #0a3524; line-height: 1.1; margin-bottom: 18px; }
.metodo__subtitle { font-family: var(--font-sora); font-weight: 600; font-size: 18px; color: #1f2d28; margin-bottom: 64px; }
.metodo__timeline { position: relative; display: flex; justify-content: space-between; gap: 10px; padding-bottom: 30px; }
.metodo__timeline::before { content: ""; position: absolute; top: 32px; left: 7%; right: 7%; height: 1px; background: rgba(10, 53, 36, 0.25); z-index: 0; }
.metodo__step { position: relative; z-index: 1; flex: 1; display: flex; flex-direction: column; align-items: center; text-align: center; outline: none; }
.metodo__node { width: 64px; height: 64px; border-radius: 50%; background: #0a3524; color: var(--green); display: flex; align-items: center; justify-content: center; margin-bottom: 18px; transition: transform .25s ease, box-shadow .25s ease, color .25s ease; }
.metodo__etapa { font-family: var(--font-mont); font-weight: 600; font-size: 11px; letter-spacing: 1px; color: #3a4a44; margin-bottom: 4px; }
.metodo__name { font-family: var(--font-sora); font-weight: 700; font-size: 20px; color: #0a3524; margin-bottom: 14px; }
.metodo__desc {
  position: absolute;
  top: 154px;
  left: 50%;
  width: min(242px, calc(100vw - 40px));
  min-height: 120px;
  padding: 18px 18px 17px;
  border-radius: 8px;
  background: #0a3524;
  border-bottom: 4px solid #ffd012;
  color: rgba(255, 255, 255, 0.9);
  box-shadow: 0 18px 36px rgba(10, 53, 36, 0.18);
  font-family: var(--font-mont);
  font-size: 13px;
  line-height: 1.45;
  text-align: left;
  opacity: 0;
  pointer-events: none;
  transform: translate(-50%, 14px);
  transition: opacity .24s ease, transform .24s ease, visibility .24s ease;
  visibility: hidden;
  z-index: 4;
}
.metodo__desc::before {
  content: "";
  position: absolute;
  top: -7px;
  left: 50%;
  width: 14px;
  height: 14px;
  background: #0a3524;
  border-radius: 2px;
  transform: translateX(-50%) rotate(45deg);
}
.metodo__step:hover,
.metodo__step:focus-visible { z-index: 5; }
.metodo__step:hover .metodo__node,
.metodo__step:focus-visible .metodo__node {
  color: #ffd012;
  transform: translateY(-3px) scale(1.04);
  box-shadow: 0 0 0 7px rgba(255, 208, 18, 0.18);
}
.metodo__step:hover .metodo__desc,
.metodo__step:focus-visible .metodo__desc {
  opacity: 1;
  transform: translate(-50%, 0);
  visibility: visible;
}
@media (max-width: 900px) {
  .metodo__timeline { flex-wrap: wrap; gap: 28px 16px; justify-content: center; padding-bottom: 0; }
  .metodo__timeline::before { display: none; }
  .metodo__step { flex: 0 0 calc((100% - 16px) / 2); min-height: 285px; }
  .metodo__desc { top: 148px; width: min(260px, calc(100vw - 48px)); }
}
@media (max-width: 600px) {
  .metodo {
    padding: 34px 0 48px;
    background: #06352f;
  }
  .metodo .wrap {
    padding-left: 14px;
    padding-right: 14px;
  }
  .metodo .wrap > * {
    background: #edf3f2;
  }
  .metodo__label {
    margin: 0;
    padding: 24px 14px 18px;
    border-radius: 8px 8px 0 0;
    font-size: 10px;
    letter-spacing: 0.5px;
    color: #0a6f55;
  }
  .metodo__title {
    margin: 0;
    padding: 0 14px 12px;
    font-size: 28px;
    line-height: 1.08;
  }
  .metodo__subtitle {
    margin: 0;
    padding: 0 14px 20px;
    font-family: var(--font-mont);
    font-size: 14px;
    font-weight: 400;
    line-height: 1.55;
    color: #243331;
  }
  .metodo__timeline {
    display: block;
    padding: 0 14px 28px;
    border-radius: 0 0 8px 8px;
  }
  .metodo__step {
    min-height: 0;
    display: grid;
    grid-template-columns: 40px minmax(0, 1fr) 18px;
    grid-template-areas:
      "node etapa arrow"
      "node name arrow"
      "desc desc desc";
    align-items: center;
    column-gap: 9px;
    padding: 14px 0;
    border-top: 1px solid rgba(10, 53, 36, 0.22);
    text-align: left;
    cursor: pointer;
  }
  .metodo__step::after {
    content: "";
    grid-area: arrow;
    justify-self: end;
    width: 10px;
    height: 10px;
    border-right: 2px solid #0a6f55;
    border-bottom: 2px solid #0a6f55;
    transform: rotate(-45deg);
    transition: transform .2s ease;
  }
  .metodo__step--open::after {
    transform: rotate(45deg);
  }
  .metodo__node {
    grid-area: node;
    width: 38px;
    height: 38px;
    margin: 0;
    color: var(--green);
  }
  .metodo__node svg {
    width: 22px;
    height: 22px;
  }
  .metodo__etapa {
    grid-area: etapa;
    margin: 0 0 4px;
    font-size: 12px;
    letter-spacing: 0;
    color: #243331;
  }
  .metodo__name {
    grid-area: name;
    margin: 0;
    font-size: 16px;
    line-height: 1.15;
    color: #0b1714;
  }
  .metodo__desc,
  .metodo__step:hover .metodo__desc,
  .metodo__step:focus-visible .metodo__desc {
    grid-area: desc;
    position: static;
    width: auto;
    min-height: 0;
    padding: 0;
    border: 0;
    border-radius: 0;
    background: transparent;
    box-shadow: none;
    color: #243331;
    font-size: 14px;
    line-height: 1.45;
    text-align: left;
    opacity: 1;
    transform: none;
    visibility: visible;
    overflow: hidden;
    max-height: 0;
    transition: max-height .28s ease, margin-top .28s ease;
  }
  .metodo__desc::before { display: none; }
  .metodo__step--open .metodo__desc {
    max-height: 240px;
    margin-top: 14px;
  }
  .metodo__step:hover .metodo__node,
  .metodo__step:focus-visible .metodo__node {
    color: var(--green);
    transform: none;
    box-shadow: none;
  }
}

/* sections/reels/reels.css */
/* reels — Ruleta Coverflow 3D (video principal al frente, los demás atrás en penumbra) */

/* ---- sección base ---- */
.reels { background: linear-gradient(120deg, #04140d 0%, #062a1d 60%, #04140d 100%); overflow: hidden; }
.reels__inner { display: flex; align-items: center; gap: 60px; padding: 80px 0; min-height: 560px; }
.reels__left { flex: 1 1 42%; max-width: 430px; }
.reels__title { font-family: var(--font-sora); font-weight: 800; font-size: 36px; line-height: 1.12; margin-bottom: 16px; }
.reels__subtitle { font-family: var(--font-sora); font-weight: 600; font-size: 18px; margin-bottom: 18px; }
.reels__text { font-family: var(--font-mont); font-size: 13px; line-height: 1.7; color: var(--white-75); margin-bottom: 30px; }
.reels__right { flex: 1 1 55%; position: relative; }
/* glow ambiental verde detrás de la ruleta */
.reels__right::before {
  content: "";
  position: absolute;
  top: 50%; left: 50%;
  width: clamp(340px, 36vw, 480px);
  height: 82%;
  transform: translate(-50%, -50%);
  background: radial-gradient(ellipse at center, rgba(46, 226, 152, 0.30), rgba(46, 226, 152, 0) 70%);
  filter: blur(40px);
  z-index: 0;
  pointer-events: none;
}

/* utilidad para la región aria-live */
.sr-only { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0 0 0 0); clip-path: inset(50%); white-space: nowrap; border: 0; }

/* ============ RULETA COVERFLOW ============ */
/* el clip 3D lo da .reels{overflow:hidden}; .reels__right queda visible para el glow */
.reels__cf {
  position: relative;
  z-index: 1;
  width: 100%;
  /* tunables del coverflow (se sobreescriben por breakpoint) */
  --cf-persp: 1400px;
  --cf-card-w: clamp(258px, 26vw, 300px);
  --n1-x: 58%;   --n1-z: -220px; --n1-rot: 38deg; --n1-scale: .82; --n1-blur: 1.4px; --n1-bri: .45; --n1-op: .92;
  --n2-x: 92%;   --n2-z: -420px; --n2-rot: 42deg; --n2-scale: .66; --n2-blur: 2.4px; --n2-bri: .30; --n2-op: .55;
  --far-x: 112%; --far-z: -560px; --far-rot: 44deg; --far-scale: .60;
}

/* área 3D: alto = alto de la card activa (9/16) + aire */
.reels__cf-stage {
  position: relative;
  width: 100%;
  min-height: calc(var(--cf-card-w) * 1.7778 + 12px);
  perspective: var(--cf-persp);
  perspective-origin: 50% 46%;
  touch-action: pan-y; /* scroll vertical de la página libre; el swipe horizontal lo maneja el JS */
  will-change: transform; /* aísla el subárbol 3D del overflow:hidden ancestro (fix Safari) */
}

/* haz de luz verde cenital (interrogatorio) — capa decorativa, detrás de las cards */
.reels__cf-spot {
  position: absolute;
  left: 50%; top: -6%;
  width: 132%; height: 118%;
  transform: translateX(-50%);
  z-index: 0;
  pointer-events: none;
  background: conic-gradient(from 180deg at 50% 0%,
      transparent 156deg,
      rgba(46, 226, 152, .13) 173deg,
      rgba(46, 226, 152, .26) 180deg,
      rgba(46, 226, 152, .13) 187deg,
      transparent 204deg);
  filter: blur(16px);
  mix-blend-mode: screen;
  opacity: .85;
}
.reels__cf-stage:has(.reels__cf-track.is-settling) .reels__cf-spot { animation: reelsRelight .44s ease; }
@keyframes reelsRelight { 0% { opacity: .85; } 28% { opacity: .55; } 100% { opacity: .85; } }

/* pista 3D: NO se mueve; cada card se coloca sola según data-offset */
.reels__cf-track { position: absolute; inset: 0; transform-style: preserve-3d; }

/* card base (frame 9:16) */
.reels__cf-track .reels__video {
  position: absolute;
  left: 50%; top: 50%;
  width: var(--cf-card-w);
  height: auto;
  aspect-ratio: 9 / 16;
  flex: none;
  border-radius: 18px;
  overflow: hidden;
  background: #04140d;
  border: 1px solid rgba(46, 226, 152, .28);
  box-shadow: 0 18px 44px rgba(0, 0, 0, .45);
  backface-visibility: hidden;
  cursor: pointer;
  transform: translate(-50%, -50%);
  transition: transform .6s cubic-bezier(.34, 1.18, .4, 1),
              filter .5s ease, opacity .5s ease, box-shadow .45s ease;
}
.reels__cf-track .reels__video video {
  display: block; width: 100%; height: 100%;
  object-fit: contain;            /* DURO: nunca cover (cover rompe el fullscreen vertical) */
  border: 0; background: #04140d;
}

/* ---- estados por offset (espejados a izquierda/derecha) ---- */
.reels__cf-track .reels__video[data-offset="0"] {
  transform: translate(-50%, -50%) translateX(0) translateZ(0) rotateY(0deg) scale(1);
  filter: none; opacity: 1; z-index: 30;
  cursor: default;
  border-color: rgba(46, 226, 152, .34);
  box-shadow: 0 28px 70px rgba(0, 0, 0, .55),
              0 0 0 1px rgba(255, 255, 255, .05) inset,
              0 0 56px rgba(46, 226, 152, .20);
}
.reels__cf-track .reels__video[data-offset="1"] {
  transform: translate(-50%, -50%) translateX(var(--n1-x)) translateZ(var(--n1-z)) rotateY(calc(-1 * var(--n1-rot))) scale(var(--n1-scale));
  filter: brightness(var(--n1-bri)) saturate(.85) blur(var(--n1-blur));
  opacity: var(--n1-op); z-index: 20;
}
.reels__cf-track .reels__video[data-offset="-1"] {
  transform: translate(-50%, -50%) translateX(calc(-1 * var(--n1-x))) translateZ(var(--n1-z)) rotateY(var(--n1-rot)) scale(var(--n1-scale));
  filter: brightness(var(--n1-bri)) saturate(.85) blur(var(--n1-blur));
  opacity: var(--n1-op); z-index: 20;
}
.reels__cf-track .reels__video[data-offset="2"] {
  transform: translate(-50%, -50%) translateX(var(--n2-x)) translateZ(var(--n2-z)) rotateY(calc(-1 * var(--n2-rot))) scale(var(--n2-scale));
  filter: brightness(var(--n2-bri)) saturate(.7) blur(var(--n2-blur));
  opacity: var(--n2-op); z-index: 10;
}
.reels__cf-track .reels__video[data-offset="-2"] {
  transform: translate(-50%, -50%) translateX(calc(-1 * var(--n2-x))) translateZ(var(--n2-z)) rotateY(var(--n2-rot)) scale(var(--n2-scale));
  filter: brightness(var(--n2-bri)) saturate(.7) blur(var(--n2-blur));
  opacity: var(--n2-op); z-index: 10;
}
.reels__cf-track .reels__video[data-offset="3"],
.reels__cf-track .reels__video[data-offset="-3"] {
  opacity: 0; pointer-events: none; z-index: 1;
}
.reels__cf-track .reels__video[data-offset="3"] {
  transform: translate(-50%, -50%) translateX(var(--far-x)) translateZ(var(--far-z)) rotateY(calc(-1 * var(--far-rot))) scale(var(--far-scale));
}
.reels__cf-track .reels__video[data-offset="-3"] {
  transform: translate(-50%, -50%) translateX(calc(-1 * var(--far-x))) translateZ(var(--far-z)) rotateY(var(--far-rot)) scale(var(--far-scale));
}

/* SOLO la activa monta play + scrim interactivos; el resto, poster atenuado */
.reels__cf-track .reels__video:not([data-offset="0"]) .reels__scrim,
.reels__cf-track .reels__video:not([data-offset="0"]) .reels__play {
  opacity: 0; pointer-events: none;
}

/* foco visible (teclado) */
.reels__cf-track .reels__video:focus-visible { outline: 2px solid var(--green); outline-offset: 3px; }

/* flare del glow verde al aterrizar (settle 'clack' de ruleta) */
.reels__cf-track.is-settling .reels__video[data-offset="0"] { animation: reelsFlare .5s ease; }
@keyframes reelsFlare {
  0%   { box-shadow: 0 28px 70px rgba(0, 0, 0, .55), 0 0 0 1px rgba(255, 255, 255, .05) inset, 0 0 56px rgba(46, 226, 152, .20); }
  45%  { box-shadow: 0 28px 70px rgba(0, 0, 0, .55), 0 0 0 1px rgba(255, 255, 255, .08) inset, 0 0 86px rgba(46, 226, 152, .38); }
  100% { box-shadow: 0 28px 70px rgba(0, 0, 0, .55), 0 0 0 1px rgba(255, 255, 255, .05) inset, 0 0 56px rgba(46, 226, 152, .20); }
}

/* scanline CRT que recorre la activa una vez al asentar (guiño vigilancia) */
.reels__cf-track .reels__video::after {
  content: ""; position: absolute; left: 0; right: 0; top: 0; height: 42%;
  z-index: 2; pointer-events: none; opacity: 0;
  background: linear-gradient(to bottom, rgba(46, 226, 152, 0) 0%, rgba(46, 226, 152, .16) 50%, rgba(46, 226, 152, 0) 100%);
}
.reels__cf-track.is-settling .reels__video[data-offset="0"]::after { animation: reelsScan .8s ease-out 1; }
@keyframes reelsScan {
  0%   { opacity: 0; transform: translateY(-42%); }
  20%  { opacity: 1; }
  100% { opacity: 0; transform: translateY(260%); }
}

/* ---- flechas prev/next ---- */
.reels__cf-arrow {
  position: absolute; top: 50%; transform: translateY(-50%);
  z-index: 6;
  width: 46px; height: 46px;
  display: grid; place-items: center;
  border-radius: 50%;
  background: rgba(4, 20, 13, .55);
  border: 1px solid rgba(46, 226, 152, .40);
  color: var(--green);
  cursor: pointer;
  opacity: 0;
  -webkit-backdrop-filter: blur(4px); backdrop-filter: blur(4px);
  transition: opacity .3s ease, background .2s ease, transform .2s ease, box-shadow .2s ease;
}
.reels__cf-arrow svg { width: 22px; height: 22px; }
.reels__cf-arrow--prev { left: 2%; }
.reels__cf-arrow--next { right: 2%; }
.reels__cf-stage:hover .reels__cf-arrow,
.reels__cf:focus-within .reels__cf-arrow { opacity: 1; }
.reels__cf-arrow:hover { background: rgba(46, 226, 152, .18); box-shadow: 0 0 22px rgba(46, 226, 152, .30); }
.reels__cf-arrow:active { transform: translateY(-50%) scale(.94); }
.reels__cf-arrow:focus-visible { opacity: 1; outline: 2px solid var(--green); outline-offset: 2px; }

/* ---- dots (horizontales debajo del stage) ---- */
.reels__feed-dots {
  display: flex; flex-direction: row; justify-content: center;
  gap: 9px; margin-top: 22px;
}
.reels__feed-dot {
  width: 8px; height: 8px;
  border-radius: 50%;
  background: rgba(255, 255, 255, .5);
  border: 0;
  padding: 0;
  cursor: pointer;
  box-shadow: 0 1px 3px rgba(0, 0, 0, .5);
  transition: background .25s ease, width .25s ease;
}
.reels__feed-dot--active { background: var(--green); width: 22px; border-radius: 4px; }
.reels__feed-dot:focus-visible { outline: 2px solid var(--green); outline-offset: 3px; }

/* ---- entrada en viewport (zoom-in sutil) ---- */
.reels__cf:not(.is-in) .reels__cf-track .reels__video {
  opacity: 0;
  transform: translate(-50%, -50%) translateZ(-160px) scale(.9);
}

/* ============ click-to-play (compartido entre cards) ============ */
/* scrim sobre el poster para que el botón resalte */
.reels__scrim {
  position: absolute;
  inset: 0;
  z-index: 2;
  background: radial-gradient(circle at center, rgba(4, 20, 13, .12) 0%, rgba(4, 20, 13, .58) 100%);
  transition: opacity .35s ease;
  pointer-events: none;
}
/* botón play custom con glow de marca + pulso */
.reels__play {
  position: absolute;
  inset: 0;
  margin: auto;
  width: 72px; height: 72px;
  display: grid;
  place-items: center;
  z-index: 3;
  border: 0;
  border-radius: 50%;
  background: var(--green);
  color: #04140d;
  cursor: pointer;
  box-shadow: 0 12px 34px rgba(0, 0, 0, .45);
  transition: transform .22s ease, opacity .3s ease, box-shadow .22s ease;
}
.reels__play:hover { transform: scale(1.08); box-shadow: 0 14px 40px rgba(46, 226, 152, .4); }
.reels__play:active { transform: scale(.96); }
.reels__play-icon { width: 28px; height: 28px; margin-left: 4px; }
.reels__play-ring {
  position: absolute;
  inset: 0;
  border-radius: 50%;
  box-shadow: 0 0 0 0 rgba(46, 226, 152, .5);
  animation: reelsPulse 2.6s cubic-bezier(.22, .61, .36, 1) infinite;
}
@keyframes reelsPulse {
  0%   { box-shadow: 0 0 0 0 rgba(46, 226, 152, .45); }
  70%  { box-shadow: 0 0 0 24px rgba(46, 226, 152, 0); }
  100% { box-shadow: 0 0 0 0 rgba(46, 226, 152, 0); }
}
/* estado reproduciendo: oculta scrim + botón, controles nativos toman el control */
.reels__video.is-playing { cursor: default; }
.reels__video.is-playing .reels__scrim { opacity: 0; }
.reels__video.is-playing .reels__play { opacity: 0; transform: scale(.7); pointer-events: none; }

/* ============ responsive ============ */
@media (max-width: 1100px) {
  .reels__cf { --cf-persp: 1200px; --n1-x: 54%; --n1-scale: .80; }
}
@media (max-width: 900px) {
  /* la sección apila columnas */
  .reels__inner { flex-direction: column; gap: 40px; padding: 60px 0; }
  .reels__left { max-width: none; }
  .reels__cf {
    --cf-persp: 1000px;
    --cf-card-w: clamp(220px, 42vw, 280px);
    --n1-x: 50%; --n1-z: -160px; --n1-rot: 32deg; --n1-scale: .84; --n1-blur: 1px;
  }
  /* mostrar solo activa + 1 vecina: ocultar lejanas */
  .reels__cf-track .reels__video[data-offset="2"],
  .reels__cf-track .reels__video[data-offset="-2"] { opacity: 0; pointer-events: none; }
}
@media (max-width: 600px) {
  .reels__title { font-size: 32px; line-height: 1.12; margin-bottom: 18px; }
  .reels__subtitle {
    font-family: var(--font-mont);
    font-weight: 400;
    font-size: 15px;
    line-height: 1.6;
    color: var(--white-75);
    margin-bottom: 26px;
  }
  .reels__cf {
    --cf-persp: 760px;
    --cf-card-w: min(72vw, 290px);
    --n1-x: 46%; --n1-z: -120px; --n1-rot: 26deg; --n1-scale: .86; --n1-blur: 0px; --n1-bri: .40;
  }
  .reels__cf-arrow { display: none; }            /* swipe + dots como gestos primarios */
  .reels__cf-spot { mix-blend-mode: normal; filter: blur(8px); opacity: .5; } /* perf low-end */
  .reels__cf-track .reels__video[data-offset="2"],
  .reels__cf-track .reels__video[data-offset="-2"],
  .reels__cf-track .reels__video[data-offset="3"],
  .reels__cf-track .reels__video[data-offset="-3"] { opacity: 0; pointer-events: none; }
}

/* ============ accesibilidad / motion ============ */
@media (prefers-reduced-motion: reduce) {
  .reels__play-ring { animation: none; }
  .reels__cf-track .reels__video {
    transition: opacity .25s ease, filter .25s ease;
    animation: none;
  }
  /* sin rotateY/translateZ/blur: crossfade + escala leve, todo centrado */
  .reels__cf-track .reels__video[data-offset="0"] { transform: translate(-50%, -50%) scale(1); filter: none; }
  .reels__cf-track .reels__video[data-offset="1"],
  .reels__cf-track .reels__video[data-offset="-1"] { transform: translate(-50%, -50%) scale(.92); filter: brightness(.5); }
  .reels__cf-track .reels__video[data-offset="2"],
  .reels__cf-track .reels__video[data-offset="-2"] { transform: translate(-50%, -50%) scale(.84); filter: brightness(.35); opacity: .4; }
  .reels__cf-track .reels__video[data-offset="0"]::after { animation: none; }
  .reels__cf-spot { animation: none; }
  .reels__cf:not(.is-in) .reels__cf-track .reels__video { opacity: 1; transform: translate(-50%, -50%); }
}

/* sections/cert/cert.css */
/* cert — generado por refactor modular (verbatim de styles.css) */

.cert { background: #03130D; padding: 70px 0 90px; }
.cert__label { display: block; font-weight: 600; font-size: 14px; color: var(--green); margin-bottom: 30px; }
.cert__row { display: flex; align-items: flex-start; gap: 50px; }
/* ===== Visor del diploma: 3 estados (cerrado · hover abre · clic muestra el diploma) ===== */
.cert-viewer {
  flex: 1 1 45%;
  min-width: 0;
  position: relative;
  border-radius: 16px;
  overflow: hidden;
  background:
    radial-gradient(120% 90% at 50% 0%, rgba(46, 226, 152, .08), transparent 60%),
    linear-gradient(160deg, #061a12 0%, #03130d 70%);
  border: 1px solid rgba(46, 226, 152, .16);
  box-shadow: 0 18px 44px rgba(0, 0, 0, .42);
  transition: box-shadow .35s ease, border-color .35s ease;
  /* el marco toma la misma proporción cuadrada que las imágenes (968×938)
     → la foto llena el recuadro borde a borde, sin recorte ni bandas */
  aspect-ratio: 968 / 938;
}
.cert-viewer:hover { box-shadow: 0 26px 64px rgba(0, 0, 0, .55), 0 0 40px rgba(46, 226, 152, .12); border-color: rgba(46, 226, 152, .30); }
/* stage llena el visor (que iguala la altura del panel); las imágenes van contain+centradas */
.cert-viewer__stage { position: absolute; inset: 0; }
.cert-viewer__img {
  position: absolute; inset: 0; margin: auto;
  display: block; width: 100%; height: 100%;
  object-fit: cover;
  opacity: 0;
  transform: scale(.985);
  transition: opacity .5s ease, transform .6s cubic-bezier(.22, 1, .36, 1);
  will-change: opacity, transform;
}
/* estado base: folder cerrado visible */
.cert-viewer__img--closed { opacity: 1; transform: scale(1); }
/* hover (sin revelar): cross-fade al folder abierto */
.cert-viewer:hover:not(.is-revealed) .cert-viewer__img--closed { opacity: 0; transform: scale(1.015); }
.cert-viewer:hover:not(.is-revealed) .cert-viewer__img--open { opacity: 1; transform: scale(1); }
/* revelado (clic): el diploma plano */
.cert-viewer.is-revealed .cert-viewer__img--closed,
.cert-viewer.is-revealed .cert-viewer__img--open { opacity: 0; }
.cert-viewer.is-revealed .cert-viewer__img--diploma { opacity: 1; transform: scale(1); }
/* superficie clickeable (toggle abrir/ampliar) — cubre todo, debajo de los controles */
.cert-viewer__surface { position: absolute; inset: 0; z-index: 3; border: 0; padding: 0; background: transparent; cursor: pointer; }
.cert-viewer:focus-within { outline: none; }
.cert-viewer__surface:focus-visible { outline: 2px solid var(--green); outline-offset: -4px; border-radius: 16px; }
/* hint flotante abajo */
.cert-viewer__hint {
  position: absolute; left: 50%; bottom: 16px; z-index: 4;
  transform: translateX(-50%);
  padding: 9px 20px; border-radius: 100px;
  background: rgba(4, 20, 13, .72); -webkit-backdrop-filter: blur(6px); backdrop-filter: blur(6px);
  border: 1px solid rgba(46, 226, 152, .28);
  color: #eafff5; font-family: var(--font-sora); font-weight: 600; font-size: 13.5px; white-space: nowrap;
  pointer-events: none;
  transition: opacity .3s ease, transform .3s ease;
}
.cert-viewer__hint-rest, .cert-viewer__hint-open, .cert-viewer__hint-revealed { display: none; }
.cert-viewer:not(:hover):not(.is-revealed) .cert-viewer__hint-rest { display: inline; }
.cert-viewer:hover:not(.is-revealed) .cert-viewer__hint-open { display: inline; }
.cert-viewer.is-revealed .cert-viewer__hint-revealed { display: inline; }
/* botones de control (Ampliar / volver) — aparecen al revelar */
.cert-viewer__zoom, .cert-viewer__reset {
  position: absolute; z-index: 5;
  display: inline-flex; align-items: center; gap: 7px;
  border: 1px solid rgba(46, 226, 152, .35);
  background: rgba(4, 20, 13, .72); -webkit-backdrop-filter: blur(6px); backdrop-filter: blur(6px);
  color: var(--green); cursor: pointer;
  font-family: var(--font-sora); font-weight: 600; font-size: 13px;
  opacity: 0; transform: translateY(-6px); pointer-events: none;
  transition: opacity .3s ease, transform .3s ease, background .2s ease;
}
.cert-viewer__zoom { top: 14px; right: 14px; padding: 9px 16px; border-radius: 100px; }
.cert-viewer__reset { top: 14px; left: 14px; width: 38px; height: 38px; padding: 0; justify-content: center; border-radius: 50%; }
.cert-viewer__zoom svg { width: 16px; height: 16px; }
.cert-viewer__reset svg { width: 16px; height: 16px; }
.cert-viewer__zoom:hover, .cert-viewer__reset:hover { background: rgba(46, 226, 152, .18); }
.cert-viewer.is-revealed .cert-viewer__zoom,
.cert-viewer.is-revealed .cert-viewer__reset { opacity: 1; transform: translateY(0); pointer-events: auto; }
.cert-viewer__zoom:focus-visible, .cert-viewer__reset:focus-visible { opacity: 1; transform: translateY(0); pointer-events: auto; outline: 2px solid var(--green); outline-offset: 2px; }
@media (prefers-reduced-motion: reduce) {
  .cert-viewer__img { transition: opacity .25s ease; transform: none !important; }
}
.cert__panel { flex: 1 1 52%; background: #eef3f2; color: #0a3524; border-radius: 20px; padding: 40px; }
.cert__title { font-family: var(--font-sora); line-height: 1.15; margin-bottom: 16px; }
.cert__title span { font-weight: 500; font-size: 20px; color: #3a4a44; }
.cert__title strong { font-weight: 800; font-size: 28px; color: #0a3524; }
.cert__text { font-family: var(--font-mont); font-size: 15px; line-height: 1.6; color: #20302a; margin-bottom: 26px; }
.cert__feats { display: flex; flex-direction: column; gap: 20px; }
.cert__feat { display: flex; gap: 16px; align-items: flex-start; }
.cert__feat-ic { width: 48px; height: 48px; flex-shrink: 0; display: block; }
.cert__feat-title { font-family: var(--font-sora); font-weight: 700; font-size: 15px; color: #0a3524; }
.cert__feat-desc { font-family: var(--font-mont); font-size: 13px; color: #3a4a44; line-height: 1.45; margin-top: 3px; }
@media (max-width: 900px) {
  .cert__row { flex-direction: column; gap: 30px; }
  .cert-viewer { min-height: 340px; }
}
@media (max-width: 600px) {
  .cert__panel { padding: 28px 24px 30px; border-radius: 16px; }
  .cert__title { line-height: 1.18; margin-bottom: 14px; }
  .cert__title span { font-size: 22px; }
  .cert__title strong { font-size: 24px; }
  .cert__text { font-size: 15px; line-height: 1.55; margin-bottom: 24px; }
  .cert__feats { gap: 18px; }
  .cert__feat { gap: 14px; }
  .cert__feat-title { font-size: 13px; letter-spacing: 0; }
  .cert__feat-desc { font-size: 13.5px; line-height: 1.5; }
}

/* sections/inv/inv.css */
/* inv — generado por refactor modular (verbatim de styles.css) */

.inv { background: #03130D; padding: 70px 0 90px; }
.inv__cta { font-family: var(--font-sora); font-weight: 800; font-size: 40px; text-align: center; line-height: 1.15; margin-bottom: 16px; }
.inv__cta-sub { text-align: center; color: var(--white-75); font-size: 16px; line-height: 1.55; max-width: 720px; margin: 0 auto 50px; }
.inv__cards { display: flex; gap: 24px; align-items: stretch; }
.inv__price-card { position: relative; isolation: isolate; overflow: hidden; flex: 1; background: #eef3f2; color: #0a3524; border-radius: 20px; padding: 36px; display: flex; flex-direction: column; }
.inv__price-card::before {
  content: ""; position: absolute; inset: 0; z-index: 0; pointer-events: none;
  background: url("../assets/images/fondo-inversion.webp") center / cover no-repeat;
  opacity: 0.25; mix-blend-mode: multiply;
}
.inv__price-card > * { position: relative; z-index: 1; }
.inv__label { font-weight: 600; font-size: 13px; color: #1c8a5c; margin-bottom: 18px; }
.inv__price { display: flex; align-items: baseline; gap: 10px; margin-bottom: 26px; }
.inv__cur { font-family: var(--font-sora); font-weight: 700; font-size: 18px; }
.inv__amount { font-family: var(--font-sora); font-weight: 800; font-size: 46px; }
.inv__old { font-family: var(--font-sora); font-weight: 600; font-size: 18px; color: #9aa8a3; text-decoration: line-through; }
.inv__list { display: flex; flex-direction: column; gap: 13px; margin-bottom: auto; }
.inv__list li { font-family: var(--font-mont); font-size: 14px; color: #20302a; padding-left: 28px; position: relative; }
.inv__list li::before {
  content: "";
  position: absolute; left: 0; top: 0;
  width: 18px; height: 18px; border-radius: 50%;
  background: var(--green) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 12' fill='none'%3E%3Cpath d='M10 3.5L4.7 8.5L2 6' stroke='%23062217' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center / 11px no-repeat;
}
.inv__boxes { display: flex; gap: 14px; margin-top: 26px; }
.inv__box { flex: 1; border: 1px solid rgba(10, 53, 36, 0.2); border-radius: 10px; padding: 12px 14px; }
.inv__box-label { display: block; font-family: var(--font-sora); font-weight: 700; font-size: 12px; color: #0a3524; margin-bottom: 5px; }
.inv__box-val { display: block; font-family: var(--font-mont); font-size: 12px; color: #3a4a44; line-height: 1.3; }
.inv__pay-card { flex: 1; background: #0c1f18; border: 1px solid rgba(46, 226, 152, 0.2); border-radius: 20px; padding: 36px; display: flex; flex-direction: column; }
.inv__pay-title { font-family: var(--font-sora); font-weight: 700; font-size: 24px; line-height: 1.25; margin-bottom: 14px; }
.inv__start { font-family: var(--font-mont); font-size: 14px; color: var(--white-75); margin-bottom: 18px; }
.inv__start strong { color: var(--white); }
.inv__cost { font-family: var(--font-sora); font-size: 15px; color: var(--white-75); margin-bottom: 18px; }
.inv__cost span { font-weight: 800; font-size: 24px; color: var(--white); margin-left: 8px; }
.inv__cd-label { font-family: var(--font-mont); font-size: 13px; color: var(--white-75); margin-bottom: 10px; }
.inv__cd-label span { color: var(--white-50); }
.countdown--inv { display: flex; gap: 16px; margin-bottom: 24px; }
.countdown--inv .countdown__item { display: flex; flex-direction: column; align-items: center; }
.countdown--inv .countdown__number { font-family: var(--font-sora); font-weight: 800; font-size: 32px; color: var(--white); line-height: 1; }
.countdown--inv .countdown__label { font-family: var(--font-mont); font-size: 11px; color: var(--white-50); margin-top: 4px; }
.countdown--disabled .countdown__number { color: var(--white-50); }
.inv__pay-btn { width: 100%; margin-bottom: 18px; }
.inv__vac { font-family: var(--font-mont); font-size: 13px; color: var(--white-75); margin-bottom: 10px; }
.inv__vac strong { color: var(--white); }
.inv__bar { height: 8px; border-radius: 4px; background: rgba(255, 255, 255, 0.12); overflow: hidden; }
.inv__bar span { display: block; height: 100%; width: 28%; background: linear-gradient(90deg, #ff5b5b, #2ee298); border-radius: 4px; }
@media (max-width: 900px) {
  .inv__cards { flex-direction: column; }
}
@media (max-width: 600px) {
  .inv__cta { font-size: 30px; }
  .inv__boxes { flex-direction: column; }
  .countdown--inv { gap: 12px; }
  .countdown--inv .countdown__number { font-size: 26px; }
  .inv__amount { font-size: 38px; }
}

/* base/footer.css */
/* footer — generado por refactor modular (verbatim de styles.css) */

.footer { background: #02100b; padding: 50px 0 30px; border-top: 1px solid rgba(255, 255, 255, 0.08); }
.footer__inner { display: flex; justify-content: space-between; gap: 40px; flex-wrap: wrap; margin-bottom: 30px; }
.footer__logo { width: 38px; height: 44px; margin-bottom: 12px; }
.footer__tag { font-family: var(--font-mont); font-size: 13px; color: var(--white-75); max-width: 300px; line-height: 1.5; }
.footer__contact p { font-family: var(--font-sora); font-weight: 600; margin-bottom: 10px; }
.footer__contact a { display: block; font-family: var(--font-mont); font-size: 14px; color: var(--white-75); margin-bottom: 6px; }
.footer__contact a:hover { color: var(--green); }
.footer__copy { text-align: center; font-family: var(--font-mont); font-size: 12px; color: var(--white-50); }
@media (max-width: 900px) {
  .footer__inner { flex-direction: column; gap: 24px; }
}

/* base/modal.css */
/* modal — generado por refactor modular (verbatim de styles.css) */

.modal {
  position: fixed;
  inset: 0;
  z-index: 200;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 24px;
  opacity: 0;
  visibility: hidden;
  transition: opacity .3s ease, visibility .3s ease;
}
.modal.is-open { opacity: 1; visibility: visible; }
.modal__backdrop {
  position: absolute;
  inset: 0;
  background: rgba(2, 12, 8, 0.55);
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
}
.modal__card {
  position: relative;
  z-index: 1;
  width: 100%;
  max-width: 560px;
  max-height: 92vh;
  overflow-y: auto;
  background: #0d1714;
  border: 1px solid rgba(46, 226, 152, 0.18);
  border-radius: 16px;
  padding: 44px 40px;
  transform: translateY(12px) scale(0.97);
  transition: transform .3s ease;
}
.modal.is-open .modal__card { transform: none; }
.modal__close {
  position: absolute;
  top: 16px;
  right: 18px;
  width: 34px;
  height: 34px;
  border-radius: 50%;
  background: rgba(255, 255, 255, 0.06);
  border: none;
  color: var(--white);
  font-size: 22px;
  line-height: 1;
  cursor: pointer;
  transition: background .2s, color .2s;
}
.modal__close:hover { background: var(--green); color: var(--dark-text); }
.modal__card--image { max-width: min(1100px, 96vw); width: auto; padding: 0; background: transparent; border: 0; overflow: visible; }
.cert-modal__img { display: block; width: 100%; max-height: 92vh; object-fit: contain; border-radius: 12px; }
.modal__card--image .modal__close { top: 12px; right: 12px; z-index: 3; background: rgba(0, 0, 0, 0.6); }
.historia-modal__text { font-family: var(--font-mont); font-size: 16px; line-height: 1.7; color: var(--white-75); }
.historia-modal__author { font-family: var(--font-sora); font-weight: 600; font-size: 15px; color: var(--white); margin-top: 18px; }
.historia-modal__author strong { color: var(--green); }
.modal__head { text-align: center; margin-bottom: 28px; }
.modal__title { font-family: var(--font-sora); font-weight: 600; font-size: 24px; }
.modal__subtitle { font-family: var(--font-sora); font-size: 16px; color: var(--white-75); margin-top: 5px; }
.mform { display: flex; flex-direction: column; gap: 10px; }
.mform__hp { position: absolute; left: -9999px; width: 1px; height: 1px; overflow: hidden; }
.mform__row { display: flex; gap: 20px; }
.mform__row .mform__field { flex: 1; min-width: 0; }
.mform__field {
  width: 100%;
  height: 44px;
  background: rgba(255, 255, 255, 0.05);
  border: 1px solid rgba(10, 226, 148, 0.5);
  border-radius: 8px;
  padding: 0 14px;
  font-family: var(--font-sora);
  font-size: 16px;
  color: var(--white);
  outline: none;
  transition: border-color .2s ease;
}
.mform__field::placeholder { color: rgba(255, 255, 255, 0.55); }
.mform__field:focus { border-color: var(--green); }
.mform__select {
  appearance: none;
  -webkit-appearance: none;
  cursor: pointer;
  padding-right: 38px;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='none'%3E%3Cpath d='M4 6l4 4 4-4' stroke='%232EE298' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: right 14px center;
}
.mform__select option { background: #0d1714; color: var(--white); }
.mform__actions { display: flex; gap: 20px; margin-top: 14px; }
.mform__actions .btn { flex: 1; height: 50px; }
.mform__privacy { display: flex; gap: 10px; align-items: flex-start; margin-top: 8px; cursor: pointer; }
.mform__privacy input { width: 16px; height: 16px; margin-top: 2px; flex-shrink: 0; accent-color: var(--green); }
.mform__privacy span { font-family: var(--font-mont); font-size: 12px; line-height: 1.5; color: var(--white-75); text-align: justify; }
@media (max-width: 600px) {
  .modal__card { padding: 40px 22px 28px; }
  .mform__row { flex-direction: column; gap: 10px; }
  .mform__row .mform__field { flex: 0 0 auto; }
  .mform__actions { flex-direction: column; gap: 12px; }
  .mform__actions .btn { flex: 0 0 auto; }
  .modal__title { font-size: 20px; }
}