:root {
  --navy-950: #04172a;
  --navy-900: #07223a;
  --navy-850: #0a2b47;
  --navy-800: #103b5e;
  --blue: #25a9d8;
  --cyan: #4fd7e5;
  --green: #23672b;
  --green-2: #4f973d;
  --gold: #d69a16;
  --gold-2: #f3bf38;
  --cream: #f7f7f2;
  --ink: #142033;
  --muted: #5e6877;
  --line: rgba(7, 34, 58, 0.15);
  --shadow: 0 20px 55px rgba(4, 23, 42, 0.18);
  --radius: 18px;
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body {
  margin: 0;
  color: var(--ink);
  background: #fff;
  font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  overflow-x: hidden;
}
img { display: block; max-width: 100%; }
a { color: inherit; text-decoration: none; }
button, a { -webkit-tap-highlight-color: transparent; }
button { font: inherit; }

.skip-link {
  position: fixed;
  top: 10px;
  left: 10px;
  z-index: 1000;
  transform: translateY(-140%);
  background: #fff;
  color: var(--navy-950);
  padding: 10px 14px;
  border-radius: 8px;
}
.skip-link:focus { transform: translateY(0); }

.site-header {
  position: sticky;
  top: 0;
  z-index: 80;
  background: rgba(255,255,255,0.96);
  backdrop-filter: blur(18px);
  border-bottom: 1px solid rgba(7, 34, 58, 0.08);
}
.header-shell {
  width: min(1480px, calc(100% - 32px));
  min-height: 104px;
  margin: 0 auto;
  display: grid;
  grid-template-columns: minmax(270px, 390px) 1fr auto;
  align-items: center;
  gap: 28px;
}
.brand { display: block; align-self: stretch; }
.brand img { height: 100%; width: auto; max-width: 390px; object-fit: contain; object-position: left center; }
.main-nav { display: flex; justify-content: center; gap: clamp(20px, 2.5vw, 44px); align-items: center; }
.main-nav a { position: relative; padding: 15px 0; color: #172033; font-size: 15px; white-space: nowrap; }
.main-nav a::after {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  bottom: 7px;
  height: 2px;
  background: var(--gold);
  transform: scaleX(0);
  transform-origin: center;
  transition: transform .22s ease;
}
.main-nav a:hover::after, .main-nav a.active::after { transform: scaleX(1); }
.main-nav a.active { color: #9d6a00; }
.header-actions { display: flex; gap: 14px; align-items: center; }

.button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
  border-radius: 14px;
  border: 1px solid transparent;
  padding: 13px 21px;
  font-weight: 700;
  cursor: pointer;
  transition: transform .22s ease, box-shadow .22s ease, background .22s ease, border-color .22s ease;
}
.button:hover { transform: translateY(-2px); }
.button:focus-visible { outline: 3px solid rgba(79, 215, 229, .45); outline-offset: 3px; }
.button-outline { border-color: #24542b; color: #244a28; background: #fff; }
.button-outline:hover { background: #f1f8f1; box-shadow: 0 12px 25px rgba(35,103,43,.15); }
.button-primary { color: #fff; background: linear-gradient(135deg, #326f29, #155522); box-shadow: 0 12px 28px rgba(28, 93, 37, .25); }
.button-primary:hover { box-shadow: 0 16px 34px rgba(28, 93, 37, .35); }
.button-icon { font-size: 20px; line-height: 1; }
.mobile-menu-button { display: none; }

.hero {
  position: relative;
  min-height: 535px;
  overflow: hidden;
  background: var(--navy-950);
}
.hero-backdrop {
  position: absolute;
  inset: 0;
  background:
    linear-gradient(90deg, rgba(3,24,44,.98) 0%, rgba(4,28,50,.92) 43%, rgba(4,28,50,.43) 72%, rgba(4,28,50,.12) 100%),
    url("assets/hero-landscape.jpg") center/cover no-repeat;
  transform: scale(1.02);
}
.hero::after {
  content: "";
  position: absolute;
  left: 0; right: 0; bottom: 0;
  height: 110px;
  background: linear-gradient(180deg, transparent, rgba(3,23,42,.78));
  pointer-events: none;
}
.hero-shell {
  position: relative;
  z-index: 2;
  width: min(1380px, calc(100% - 64px));
  margin: 0 auto;
  min-height: 535px;
  display: grid;
  grid-template-columns: 47% 53%;
  align-items: center;
}
.hero-copy { padding: 55px 0 54px; max-width: 680px; color: #fff; }
.eyebrow {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  margin-bottom: 18px;
  color: var(--cyan);
  font-size: 12px;
  font-weight: 800;
  letter-spacing: .13em;
  text-transform: uppercase;
}
.eyebrow::before { content: ""; width: 28px; height: 2px; background: currentColor; }
.eyebrow.dark { color: #1a7e93; }
.hero h1 {
  margin: 0;
  font-size: clamp(42px, 4.1vw, 67px);
  line-height: 1.06;
  letter-spacing: -.035em;
  font-weight: 860;
  text-shadow: 0 4px 20px rgba(0,0,0,.18);
}
.hero h1 span { color: var(--gold-2); }
.hero p { max-width: 620px; margin: 22px 0 0; color: #eff8ff; font-size: 18px; line-height: 1.55; }
.hero-actions { display: flex; flex-wrap: wrap; gap: 17px; margin-top: 28px; }
.button-hero {
  min-width: 260px;
  flex-direction: column;
  align-items: flex-start;
  gap: 1px;
  color: #fff;
  background: linear-gradient(135deg, #4a8d35, #246828);
  border-color: rgba(255,255,255,.85);
  padding: 14px 24px;
  box-shadow: 0 15px 35px rgba(0,0,0,.24);
}
.button-hero .button-icon { position: absolute; opacity: 0; }
.button-hero strong { font-size: 15px; text-transform: uppercase; letter-spacing: .02em; }
.button-hero small, .button-video small { font-size: 13px; font-weight: 500; opacity: .88; }
.button-video {
  min-width: 250px;
  color: #fff;
  background: rgba(4, 25, 47, .62);
  border-color: rgba(255,255,255,.8);
  padding: 12px 20px;
}
.button-video span:last-child { display: flex; flex-direction: column; align-items: flex-start; }
.play-icon { width: 36px; height: 36px; border: 2px solid #fff; border-radius: 50%; display: grid; place-items: center; font-size: 14px; }
.hero-links { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 20px; }
.hero-links a {
  padding: 8px 12px;
  border-radius: 999px;
  color: #d9f7ff;
  background: rgba(24, 104, 126, .2);
  border: 1px solid rgba(79,215,229,.26);
  font-size: 12px;
  font-weight: 700;
}
.hero-links a:hover { background: rgba(79,215,229,.18); }

.hero-visual {
  position: relative;
  align-self: stretch;
  min-height: 535px;
  display: flex;
  align-items: center;
  justify-content: flex-end;
}
.hero-visual img {
  position: relative;
  z-index: 2;
  width: min(760px, 100%);
  height: 510px;
  object-fit: cover;
  object-position: center;
  filter: saturate(1.08) contrast(1.04);
  mask-image: linear-gradient(90deg, transparent 0, #000 13%, #000 100%);
}
.visual-orbit { position: absolute; border: 1px solid rgba(75,215,229,.35); border-radius: 50%; animation: orbit 18s linear infinite; }
.orbit-one { width: 470px; height: 470px; right: 70px; top: 32px; }
.orbit-two { width: 580px; height: 260px; right: 5px; bottom: 36px; transform: rotate(-8deg); animation-direction: reverse; animation-duration: 24s; }
@keyframes orbit { to { transform: rotate(360deg); } }
.central-platform-link {
  position: absolute;
  z-index: 4;
  right: 42px;
  bottom: 34px;
  padding: 12px 16px;
  border-radius: 13px;
  color: #fff;
  background: rgba(2, 24, 43, .82);
  border: 1px solid rgba(79,215,229,.5);
  box-shadow: 0 12px 28px rgba(0,0,0,.24);
  font-size: 12px;
  text-align: right;
}
.central-platform-link strong { color: var(--cyan); }

.apps-section { background: #f8f8f5; padding: 0 30px 24px; }
.section-heading {
  max-width: 1120px;
  margin: 0 auto;
  display: grid;
  grid-template-columns: 1fr auto 1fr;
  align-items: center;
  gap: 20px;
  transform: translateY(-2px);
}
.section-heading span { height: 2px; background: linear-gradient(90deg, transparent, var(--gold)); position: relative; }
.section-heading span:last-child { background: linear-gradient(90deg, var(--gold), transparent); }
.section-heading span::after { content: "◆"; position: absolute; right: -4px; top: -10px; color: var(--gold); }
.section-heading span:last-child::after { left: -4px; right: auto; }
.section-heading h2 { margin: 10px 0; color: var(--navy-950); font-size: clamp(22px, 2.3vw, 32px); text-transform: uppercase; letter-spacing: .06em; }
.apps-grid {
  max-width: 1460px;
  margin: 0 auto;
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 15px;
}
.apps-grid-3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.app-card {
  display: flex;
  flex-direction: column;
  min-height: 265px;
  padding: 14px;
  border: 1px solid rgba(7, 34, 58, .12);
  border-radius: 14px;
  background: #fff;
  box-shadow: 0 7px 18px rgba(3, 25, 43, .08);
  transition: transform .24s ease, box-shadow .24s ease, border-color .24s ease;
}
.app-card:hover { transform: translateY(-8px); box-shadow: 0 18px 38px rgba(3,25,43,.16); border-color: rgba(30,130,151,.32); }
.card-header { min-height: 64px; display: grid; grid-template-columns: 44px 36px 1fr; gap: 8px; align-items: start; }
.app-number { width: 42px; height: 42px; display: grid; place-items: center; color: #fff; font-size: 22px; font-weight: 850; border-radius: 50%; box-shadow: inset 0 -5px 12px rgba(0,0,0,.12); }
.app-number.green { background: linear-gradient(145deg, #438841, #1c5b2b); }
.app-number.gold { background: linear-gradient(145deg, #dba827, #b87906); }
.app-number.navy { background: linear-gradient(145deg, #244e7e, #09274e); }
.app-symbol { color: #174f28; font-size: 27px; line-height: 1.4; text-align: center; }
.app-card h3 { margin: 0; color: #13202c; font-size: 16px; line-height: 1.22; text-transform: uppercase; }
.app-card > p { flex: 1; margin: 10px 0 12px; color: #23303d; font-size: 14px; line-height: 1.35; }
.card-media { position: relative; overflow: hidden; border-radius: 10px; background: var(--navy-950); }
.card-media img { width: 100%; height: 122px; object-fit: cover; transition: transform .32s ease, opacity .32s ease; }
.card-media span {
  position: absolute; inset: auto 0 0;
  display: flex; align-items: center; justify-content: center;
  min-height: 38px;
  padding: 8px;
  color: #fff;
  background: linear-gradient(180deg, transparent, rgba(2,20,36,.94));
  font-size: 12px; font-weight: 800;
  transform: translateY(100%);
  transition: transform .24s ease;
}
.card-media:hover img { transform: scale(1.06); opacity: .76; }
.card-media:hover span, .card-media:focus-visible span { transform: translateY(0); }

.integration-band { background: linear-gradient(90deg, #061b31, #082845 52%, #061b31); color: #fff; }
.integration-shell { max-width: 1460px; margin: 0 auto; display: grid; grid-template-columns: repeat(6, 1fr); }
.integration-item { display: flex; align-items: center; gap: 15px; min-height: 104px; padding: 20px 28px; border-right: 1px solid rgba(255,255,255,.18); transition: background .2s ease; }
.integration-item:last-child { border-right: 0; }
.integration-item:hover { background: rgba(44, 145, 165, .14); }
.integration-icon { flex: 0 0 54px; width: 54px; height: 54px; display: grid; place-items: center; border: 2px solid var(--gold); border-radius: 50%; font-size: 26px; }
.integration-item span:last-child { display: flex; flex-direction: column; gap: 4px; }
.integration-item strong { font-size: 15px; }
.integration-item small { color: #dbe9f3; font-size: 13px; line-height: 1.4; }

.impact-section { padding: 82px 32px; background: #fff; }
.impact-shell { max-width: 1260px; margin: 0 auto; display: grid; grid-template-columns: 1.05fr .95fr; gap: 70px; align-items: center; }
.impact-copy h2, .about-section h2 { margin: 0 0 18px; color: var(--navy-950); font-size: clamp(34px, 4vw, 57px); line-height: 1.03; letter-spacing: -.035em; }
.impact-copy p, .about-section p { color: var(--muted); font-size: 18px; line-height: 1.65; }
.impact-copy .button { margin-top: 12px; }
.impact-metrics { display: grid; grid-template-columns: repeat(2, 1fr); gap: 18px; }
.metric { min-height: 175px; padding: 26px; display: flex; flex-direction: column; justify-content: center; border: 1px solid var(--line); border-radius: var(--radius); background: linear-gradient(145deg, #f7fbfc, #fff); box-shadow: 0 14px 34px rgba(5,37,61,.08); }
.metric strong { color: var(--green); font-size: 52px; line-height: 1; }
.metric span { margin-top: 12px; color: var(--navy-800); font-weight: 700; }

.about-section { padding: 70px 32px; background: #f6f7f3; border-top: 1px solid var(--line); }
.about-shell { max-width: 1260px; margin: 0 auto; display: grid; grid-template-columns: 1fr 1fr auto; gap: 44px; align-items: center; }
.about-section h2 { font-size: clamp(31px, 3.5vw, 49px); }
.about-section p { font-size: 16px; }
.button-outline-dark { border-color: var(--navy-800); color: var(--navy-900); background: #fff; white-space: nowrap; }
.button-outline-dark:hover { background: var(--navy-900); color: #fff; }

.site-footer { padding: 22px 28px; background: #fff; border-top: 1px solid var(--line); }
.footer-shell { max-width: 1460px; margin: 0 auto; display: grid; grid-template-columns: 1fr 1fr auto; gap: 30px; align-items: center; color: #4a5360; font-size: 13px; }
.footer-tags { text-transform: uppercase; letter-spacing: .08em; }
.footer-tags span { margin: 0 8px; }
.footer-credit { text-align: center; }
.footer-links { display: flex; gap: 15px; }
.footer-links a:hover { color: var(--green); }

.modal { width: min(680px, calc(100% - 28px)); border: 0; padding: 0; border-radius: 22px; box-shadow: 0 30px 90px rgba(2,18,31,.38); }
.modal::backdrop { background: rgba(2, 17, 30, .72); backdrop-filter: blur(6px); }
.modal-card { position: relative; padding: 34px; }
.modal-close { position: absolute; top: 14px; right: 14px; width: 40px; height: 40px; border: 0; border-radius: 50%; background: #eef4f5; color: var(--navy-900); font-size: 28px; cursor: pointer; }
.modal-card h2 { margin: 4px 0 20px; color: var(--navy-950); font-size: 36px; line-height: 1.05; }
.modal-steps { display: grid; gap: 10px; }
.modal-steps div { display: grid; grid-template-columns: 38px 1fr; gap: 12px; align-items: center; padding: 12px; border-radius: 12px; background: #f3f7f7; }
.modal-steps strong { width: 34px; height: 34px; display: grid; place-items: center; border-radius: 50%; color: #fff; background: var(--green); }
.modal-actions { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 24px; }

.reveal { opacity: 0; transform: translateY(20px); transition: opacity .75s ease, transform .75s ease; }
.reveal.visible { opacity: 1; transform: translateY(0); }
.reveal-delay { transition-delay: .13s; }
.reveal-delay-1 { transition-delay: .08s; }
.reveal-delay-2 { transition-delay: .16s; }
.reveal-delay-3 { transition-delay: .24s; }
.reveal-delay-4 { transition-delay: .32s; }

@media (max-width: 1240px) {
  .header-shell { grid-template-columns: 285px 1fr; min-height: 88px; }
  .brand img { max-width: 285px; }
  .header-actions { display: none; }
  .apps-grid, .apps-grid-3 { grid-template-columns: repeat(2, 1fr); }
  .about-shell { grid-template-columns: 1fr 1fr; }
  .about-shell .button { grid-column: 1 / -1; justify-self: start; }
}

@media (max-width: 980px) {
  .header-shell { grid-template-columns: 1fr auto; }
  .mobile-menu-button {
    display: inline-flex;
    width: 46px; height: 46px;
    border: 1px solid var(--line);
    border-radius: 12px;
    background: #fff;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 5px;
    cursor: pointer;
  }
  .mobile-menu-button span { width: 22px; height: 2px; background: var(--navy-900); }
  .main-nav {
    position: fixed;
    left: 16px; right: 16px; top: 82px;
    display: none;
    flex-direction: column;
    gap: 2px;
    align-items: stretch;
    padding: 14px;
    border: 1px solid var(--line);
    border-radius: 16px;
    background: #fff;
    box-shadow: var(--shadow);
  }
  .main-nav.open { display: flex; }
  .main-nav a { padding: 13px 12px; border-radius: 10px; }
  .main-nav a:hover { background: #eef6f6; }
  .main-nav a::after { display: none; }
  .hero-shell { grid-template-columns: 1fr; width: min(760px, calc(100% - 36px)); }
  .hero-copy { max-width: none; padding-bottom: 10px; }
  .hero-visual { min-height: 420px; justify-content: center; }
  .hero-visual img { height: 420px; width: 100%; object-fit: contain; mask-image: linear-gradient(90deg, transparent 0, #000 6%, #000 94%, transparent 100%); }
  .central-platform-link { right: 18px; bottom: 18px; }
  .apps-grid, .apps-grid-3 { grid-template-columns: repeat(2, 1fr); }
  .integration-shell { grid-template-columns: repeat(2, 1fr); }
  .integration-item:nth-child(2n) { border-right: 0; }
  .impact-shell { grid-template-columns: 1fr; }
  .about-shell { grid-template-columns: 1fr; }
  .footer-shell { grid-template-columns: 1fr; text-align: center; }
  .footer-links { justify-content: center; }
}

@media (max-width: 640px) {
  .header-shell { width: calc(100% - 20px); min-height: 74px; }
  .brand img { max-width: 245px; height: 72px; object-fit: cover; object-position: left center; }
  .hero { min-height: auto; }
  .hero-shell { width: calc(100% - 28px); min-height: auto; }
  .hero-copy { padding: 42px 0 12px; }
  .eyebrow { font-size: 10px; }
  .hero h1 { font-size: clamp(36px, 11vw, 50px); }
  .hero p { font-size: 16px; }
  .hero-actions { flex-direction: column; }
  .button-hero, .button-video { width: 100%; min-width: 0; }
  .hero-visual { min-height: 300px; }
  .hero-visual img { height: 300px; }
  .visual-orbit { display: none; }
  .central-platform-link { left: 14px; right: 14px; bottom: 10px; text-align: center; }
  .apps-section { padding: 0 14px 18px; }
  .section-heading { grid-template-columns: 1fr; text-align: center; }
  .section-heading span { display: none; }
  .section-heading h2 { font-size: 21px; }
  .apps-grid { grid-template-columns: 1fr; }
  .app-card { min-height: 0; }
  .card-media img { height: 155px; }
  .integration-shell { grid-template-columns: 1fr; }
  .integration-item { border-right: 0; border-bottom: 1px solid rgba(255,255,255,.14); }
  .impact-section { padding: 58px 18px; }
  .impact-metrics { grid-template-columns: 1fr 1fr; gap: 10px; }
  .metric { min-height: 130px; padding: 18px; }
  .metric strong { font-size: 42px; }
  .about-section { padding: 50px 18px; }
  .site-footer { padding: 22px 16px; }
  .footer-tags { line-height: 1.9; }
  .modal-card { padding: 28px 20px; }
  .modal-card h2 { font-size: 30px; }
}

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after { animation-duration: .01ms !important; animation-iteration-count: 1 !important; transition-duration: .01ms !important; }
  .reveal { opacity: 1; transform: none; }
}


/* ================================================================
   CATÁLOGO DE VISORES
   Añadidos para que la portada funcione como entrada a los diez
   visores: entradilla de sección, datos de cada tarjeta y el estado
   de los que aún no tienen dirección publicada.
   ================================================================ */

.section-lead {
  max-width: 78ch;
  margin: -6px auto 26px;
  padding: 0 18px;
  text-align: center;
  color: #46525f;
  font-size: 15px;
  line-height: 1.6;
}
.section-lead strong { color: var(--navy-900); }

/* Los tres datos que distinguen a cada visor de un vistazo. */
.card-facts {
  list-style: none;
  display: flex;
  flex-wrap: wrap;
  gap: 5px;
  margin: 0 0 12px;
  padding: 0;
}
.card-facts li {
  padding: 3px 9px;
  border-radius: 999px;
  border: 1px solid rgba(7, 34, 58, .14);
  background: #f4f7f3;
  color: #2c4a34;
  font-size: 11px;
  font-weight: 600;
  letter-spacing: .01em;
}

/* Sección territorial: se separa visualmente sin cambiar de lenguaje. */
.territorial-section {
  background: linear-gradient(180deg, #f5f8f4, #ffffff);
  border-top: 1px solid rgba(7, 34, 58, .08);
}
.territorial-section .app-number {
  font-size: 17px;
  background: linear-gradient(145deg, #2c7f8f, #10485c);
}
.territorial-section .app-number.gold { background: linear-gradient(145deg, #dba827, #b87906); }
.territorial-section .app-number.navy { background: linear-gradient(145deg, #244e7e, #09274e); }
.territorial-section .app-card h3 { font-size: 15px; }

/* Visor sin dirección publicada: se dice, no se enlaza a la nada. */
.app-card { position: relative; }
.card-badge {
  position: absolute;
  top: 10px;
  right: 10px;
  padding: 3px 10px;
  border-radius: 999px;
  background: rgba(214, 154, 22, .16);
  border: 1px solid rgba(214, 154, 22, .4);
  color: #8a6208;
  font-size: 10.5px;
  font-weight: 700;
  letter-spacing: .03em;
}
.card-media.proximamente { cursor: default; filter: grayscale(.55); }
.card-media.proximamente img { opacity: .55; }
.card-media.proximamente span { transform: translateY(0); background: rgba(2, 20, 36, .8); }
.card-media.proximamente:hover img { transform: none; }

@media (max-width: 1240px) {
  .integration-shell { grid-template-columns: repeat(3, 1fr); }
  .integration-item:nth-child(3n) { border-right: 0; }
}

@media (max-width: 760px) {
  .apps-grid, .apps-grid-3 { grid-template-columns: 1fr; }
  .integration-shell { grid-template-columns: 1fr; }
  .integration-item { border-right: 0; border-bottom: 1px solid rgba(255, 255, 255, .18); }
  .integration-item:last-child { border-bottom: 0; }
  .section-lead { font-size: 14px; text-align: left; }
  .card-facts li { font-size: 10.5px; }
}


/* ================================================================
   IDENTIDAD OFICIAL FEJUC + CELESTE Y AUTENTICACIÓN
   ================================================================ */
.header-shell { grid-template-columns: minmax(360px, 480px) 1fr auto; min-height: 96px; }
.brand-cluster { display:flex; align-items:center; gap:14px; min-width:0; }
.brand-fejuc, .brand-celeste { display:flex; align-items:center; transition:transform .2s ease, filter .2s ease; }
.brand-fejuc:hover, .brand-celeste:hover { transform:translateY(-2px); filter:drop-shadow(0 8px 14px rgba(4,23,42,.16)); }
.brand-fejuc img { width:78px; height:78px; object-fit:contain; }
.brand-divider { width:1px; height:58px; background:linear-gradient(transparent, rgba(7,34,58,.28), transparent); }
.brand-celeste { min-height:60px; padding:7px 12px; border-radius:14px; background:#061f32; box-shadow:0 9px 24px rgba(4,23,42,.16); }
.brand-celeste img { width:min(278px, 100%); height:auto; }
.header-actions button { white-space:nowrap; }

.about-shell { grid-template-columns:minmax(360px, .9fr) 1.1fr; gap:55px; }
.about-identity { display:grid; grid-template-columns:112px 1fr; gap:24px; align-items:center; }
.about-logo { width:112px; height:112px; border-radius:50%; background:#fff; box-shadow:0 16px 38px rgba(4,23,42,.14); }
.about-logo img { width:100%; height:100%; object-fit:contain; }
.about-content p { margin:0 0 14px; line-height:1.72; }
.about-actions { display:flex; flex-wrap:wrap; gap:12px; margin-top:24px; }
.footer-credit a { color:#fff; font-weight:800; text-decoration:underline; text-underline-offset:3px; }

.auth-modal { width:min(590px, calc(100% - 24px)); }
.auth-card { padding:34px; }
.auth-brandline { display:flex; align-items:center; gap:14px; margin-bottom:18px; padding-right:40px; }
.auth-brandline img:first-child { width:58px; height:58px; border-radius:50%; }
.auth-brandline span { width:1px; height:40px; background:var(--line); }
.auth-brandline img:last-child { width:230px; max-width:calc(100% - 82px); border-radius:9px; }
.auth-intro { color:#536171; line-height:1.6; margin:-8px 0 20px; }
.auth-status { min-height:0; margin:0 0 14px; padding:0; border-radius:10px; font-size:13px; line-height:1.45; }
.auth-status:not(:empty) { padding:11px 13px; background:#edf5f7; color:#17485a; border:1px solid #cce2e8; }
.auth-status[data-type="warning"] { background:#fff7df; color:#775a0b; border-color:#f0d68b; }
.auth-status[data-type="error"] { background:#fff0f0; color:#8b2222; border-color:#efb8b8; }
.auth-status[data-type="success"] { background:#edf8ef; color:#1d652a; border-color:#b8dfbf; }
.auth-google { width:100%; min-height:50px; display:flex; justify-content:center; align-items:center; gap:12px; border:1px solid #cbd5df; border-radius:12px; background:#fff; color:#1d2938; font-weight:800; cursor:pointer; }
.auth-google:hover { background:#f7fafc; box-shadow:0 8px 22px rgba(4,23,42,.08); }
.google-mark { width:26px; height:26px; display:grid; place-items:center; border-radius:50%; color:#fff; background:conic-gradient(#4285f4 0 25%,#34a853 0 50%,#fbbc05 0 75%,#ea4335 0); font-weight:900; }
.auth-separator { display:flex; align-items:center; gap:12px; margin:18px 0; color:#738091; font-size:12px; }
.auth-separator::before,.auth-separator::after { content:""; height:1px; flex:1; background:#d9e1e7; }
.auth-form { display:grid; gap:14px; }
.auth-form label { display:grid; gap:7px; color:#24364a; font-size:13px; font-weight:800; }
.auth-form input { width:100%; min-height:48px; padding:0 14px; border:1px solid #c8d4dd; border-radius:11px; color:#13263a; background:#fff; outline:none; }
.auth-form input:focus { border-color:#27a7c8; box-shadow:0 0 0 4px rgba(39,167,200,.13); }
.auth-submit { width:100%; margin-top:2px; }
.auth-secondary { display:flex; justify-content:space-between; gap:12px; margin-top:14px; }
.auth-secondary button { border:0; padding:4px 0; background:transparent; color:#176b82; font-size:12px; font-weight:800; cursor:pointer; }
.auth-secondary button:hover { text-decoration:underline; }
.auth-setup-note { margin:18px 0 0; padding:12px; border-radius:10px; background:#f5f7f9; color:#667382; font-size:11px; line-height:1.5; }
.auth-setup-note code { color:#0c5268; }

@media (max-width: 1240px) {
  .header-shell { grid-template-columns:minmax(330px, 430px) 1fr; }
  .brand-fejuc img { width:68px; height:68px; }
  .brand-celeste img { width:245px; }
}
@media (max-width: 980px) {
  .header-shell { grid-template-columns:1fr auto; }
  .brand-cluster { gap:9px; }
  .brand-fejuc img { width:58px; height:58px; }
  .brand-divider { height:44px; }
  .brand-celeste { min-height:50px; padding:5px 9px; }
  .brand-celeste img { width:210px; }
  .about-shell { grid-template-columns:1fr; }
}
@media (max-width: 640px) {
  .brand-fejuc img { width:48px; height:48px; }
  .brand-divider { height:36px; }
  .brand-celeste img { width:165px; }
  .brand-celeste { min-height:43px; border-radius:10px; }
  .about-identity { grid-template-columns:78px 1fr; gap:16px; }
  .about-logo { width:78px; height:78px; }
  .auth-card { padding:26px 18px; }
  .auth-brandline img:last-child { width:190px; }
  .auth-secondary { flex-direction:column; align-items:flex-start; }
}


/* ================================================================
   ECOSISTEMA CENTRAL CON IA, VISORES TERRITORIALES Y PIE INSTITUCIONAL
   ================================================================ */
.ecosystem-central-link {
  width: min(370px, calc(100% - 42px));
  right: 28px;
  bottom: 24px;
  display: grid;
  gap: 4px;
  padding: 19px 22px 17px;
  border-radius: 20px;
  text-align: left;
  color: #fff;
  background:
    linear-gradient(135deg, rgba(8, 55, 75, .96), rgba(11, 112, 91, .95)),
    radial-gradient(circle at 85% 15%, rgba(94, 245, 224, .32), transparent 35%);
  border: 1px solid rgba(116, 246, 226, .72);
  box-shadow: 0 20px 50px rgba(0, 0, 0, .38), inset 0 1px 0 rgba(255,255,255,.18);
  overflow: hidden;
}
.ecosystem-central-link::after {
  content: "→";
  position: absolute;
  right: 18px;
  top: 16px;
  width: 36px;
  height: 36px;
  display: grid;
  place-items: center;
  border-radius: 50%;
  background: rgba(255,255,255,.15);
  font-size: 22px;
  transition: transform .22s ease, background .22s ease;
}
.ecosystem-central-link:hover { transform: translateY(-4px); border-color: #bafff3; box-shadow: 0 26px 60px rgba(0,0,0,.46); }
.ecosystem-central-link:hover::after { transform: translateX(4px); background: rgba(255,255,255,.24); }
.ecosystem-central-link .ecosystem-kicker { color: #adfff2; font-size: 10px; font-weight: 900; letter-spacing: .13em; text-transform: uppercase; }
.ecosystem-central-link strong { max-width: 285px; color: #fff; font-size: 22px; line-height: 1.08; }
.ecosystem-central-link small { max-width: 290px; color: #e8fffb; font-size: 12px; line-height: 1.45; }
.ecosystem-central-link .ecosystem-url { margin-top: 7px; color: #8ff7e9; font-size: 13px; font-weight: 900; }
.button-central-ai {
  margin-left: 10px;
  color: #fff;
  background: linear-gradient(135deg, #0b6a72, #087a50);
  border-color: rgba(7, 92, 83, .55);
  box-shadow: 0 12px 28px rgba(6, 95, 78, .2);
}
.button-central-ai:hover { box-shadow: 0 17px 34px rgba(6,95,78,.3); }

.territorial-section .app-card { overflow: hidden; padding: 16px; border-color: rgba(9, 57, 77, .16); }
.territorial-section .card-media { margin-top: 3px; border: 1px solid rgba(34, 137, 161, .22); box-shadow: 0 10px 24px rgba(4,31,50,.12); }
.territorial-section .card-media img { height: 220px; object-fit: cover; object-position: center; }
.territorial-section .card-media::before {
  content: "Visor territorial · IGJC 250 m";
  position: absolute;
  z-index: 3;
  top: 10px;
  left: 10px;
  padding: 6px 9px;
  border-radius: 999px;
  color: #fff;
  background: rgba(2,24,43,.82);
  border: 1px solid rgba(255,255,255,.22);
  font-size: 9px;
  font-weight: 850;
  letter-spacing: .05em;
  text-transform: uppercase;
  backdrop-filter: blur(5px);
}

.site-footer { padding: 0; color: #e8f4fa; background: #061d31; border-top: 4px solid #c99113; }
.footer-main {
  max-width: 1460px;
  margin: 0 auto;
  padding: 42px 32px 34px;
  display: grid;
  grid-template-columns: minmax(330px, 1.1fr) 1.9fr;
  gap: 56px;
  align-items: start;
}
.footer-brand-panel { display: grid; gap: 18px; }
.footer-brand-lockup { display: flex; align-items: center; gap: 16px; }
.footer-brand-lockup > span { width: 1px; height: 56px; background: linear-gradient(transparent, rgba(255,255,255,.35), transparent); }
.footer-fejuc-logo { width: 76px; height: 76px; object-fit: contain; border-radius: 50%; background: #fff; }
.footer-celeste-logo { width: min(275px, 100%); padding: 8px 12px; border-radius: 12px; background: #082940; }
.footer-brand-panel p { max-width: 590px; margin: 0; color: #bfd0dc; font-size: 14px; line-height: 1.65; }
.footer-ai-cta {
  display: grid;
  gap: 3px;
  max-width: 560px;
  padding: 16px 18px;
  border-radius: 15px;
  color: #fff;
  background: linear-gradient(135deg, rgba(10,101,104,.8), rgba(12,119,68,.88));
  border: 1px solid rgba(112,241,216,.42);
  transition: transform .22s ease, box-shadow .22s ease;
}
.footer-ai-cta:hover { transform: translateY(-3px); box-shadow: 0 15px 32px rgba(0,0,0,.23); }
.footer-ai-cta span { color: #a9f6ea; font-size: 10px; font-weight: 850; letter-spacing: .1em; text-transform: uppercase; }
.footer-ai-cta strong { font-size: 16px; line-height: 1.25; }
.footer-ai-cta small { color: #b8fff3; font-weight: 800; }
.footer-nav-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 26px; }
.footer-nav-grid > div { display: grid; align-content: start; gap: 10px; }
.footer-nav-grid h3 { margin: 0 0 5px; color: #fff; font-size: 13px; letter-spacing: .06em; text-transform: uppercase; }
.footer-nav-grid a { color: #bfd0dc; font-size: 13px; line-height: 1.35; transition: color .2s ease, transform .2s ease; }
.footer-nav-grid a:hover { color: #6ce8da; transform: translateX(3px); }
.footer-bottom {
  padding: 20px 32px;
  display: grid;
  grid-template-columns: .8fr 1.2fr;
  gap: 30px;
  align-items: center;
  background: #041522;
  border-top: 1px solid rgba(255,255,255,.1);
}
.footer-bottom > * { max-width: 1460px; }
.footer-tags { color: #a9bdc9; font-size: 11px; line-height: 1.65; text-transform: uppercase; letter-spacing: .09em; }
.footer-copyright { display: grid; gap: 4px; text-align: right; }
.footer-copyright strong { color: #fff; font-size: 12px; }
.footer-copyright span { color: #a9bdc9; font-size: 11px; line-height: 1.5; }

@media (max-width: 1120px) {
  .footer-main { grid-template-columns: 1fr; }
  .footer-nav-grid { grid-template-columns: repeat(4, 1fr); }
  .button-central-ai { margin-left: 0; margin-top: 10px; }
}
@media (max-width: 760px) {
  .ecosystem-central-link { left: 12px; right: 12px; bottom: 8px; width: auto; padding: 15px 17px; }
  .ecosystem-central-link strong { font-size: 18px; }
  .territorial-section .card-media img { height: 205px; }
  .footer-main { padding: 34px 20px 28px; gap: 34px; }
  .footer-nav-grid { grid-template-columns: repeat(2, 1fr); }
  .footer-bottom { grid-template-columns: 1fr; padding: 18px 20px; text-align: center; }
  .footer-copyright { text-align: center; }
  .footer-brand-lockup { align-items: center; }
  .footer-fejuc-logo { width: 62px; height: 62px; }
  .footer-celeste-logo { width: 210px; }
}
@media (max-width: 480px) {
  .footer-nav-grid { grid-template-columns: 1fr; }
  .footer-brand-lockup { gap: 10px; }
  .footer-brand-lockup > span { height: 42px; }
  .footer-fejuc-logo { width: 50px; height: 50px; }
  .footer-celeste-logo { width: 175px; }
}


/* Refinamiento institucional: cabecera y pie de página */
.button-open-platform {
  position: relative;
  min-width: 198px;
  min-height: 64px;
  padding: 10px 18px 10px 12px;
  gap: 12px;
  overflow: hidden;
  color: #fff;
  border: 1px solid rgba(115, 255, 221, .48);
  border-radius: 17px;
  background:
    radial-gradient(circle at 18% 18%, rgba(111,255,222,.32), transparent 30%),
    linear-gradient(135deg, #0a8f78 0%, #08715f 46%, #064d43 100%);
  box-shadow: 0 15px 34px rgba(4, 105, 87, .28), inset 0 1px 0 rgba(255,255,255,.22);
  isolation: isolate;
}
.button-open-platform::after {
  content: "";
  position: absolute;
  inset: -80% auto -80% -45%;
  width: 42%;
  transform: rotate(18deg);
  background: linear-gradient(90deg, transparent, rgba(255,255,255,.28), transparent);
  transition: left .5s ease;
  z-index: -1;
}
.button-open-platform:hover {
  transform: translateY(-3px) scale(1.015);
  border-color: rgba(172,255,236,.75);
  box-shadow: 0 20px 42px rgba(4, 105, 87, .38), 0 0 0 4px rgba(14,164,139,.10);
}
.button-open-platform:hover::after { left: 115%; }
.open-platform-icon {
  display: grid;
  place-items: center;
  width: 39px;
  height: 39px;
  flex: 0 0 39px;
  border-radius: 12px;
  color: #083f37;
  background: linear-gradient(145deg, #d8fff5, #7cebd2);
  box-shadow: 0 7px 18px rgba(0,0,0,.18);
  font-size: 22px;
  font-weight: 900;
}
.open-platform-copy { display: grid; gap: 1px; text-align: left; line-height: 1.05; }
.open-platform-copy strong { font-size: 15px; letter-spacing: .01em; }
.open-platform-copy small { color: #c8fff2; font-size: 10px; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; }

.footer-brand-panel { gap: 16px; }
.footer-brand-lockup { gap: 18px; min-height: 106px; }
.footer-fejuc-link {
  display: grid;
  place-items: center;
  width: 106px;
  height: 106px;
  flex: 0 0 106px;
  padding: 4px;
  border-radius: 50%;
  background: #fff;
  border: 2px solid rgba(214,154,22,.72);
  box-shadow: 0 15px 34px rgba(0,0,0,.28), 0 0 0 5px rgba(255,255,255,.06);
  transition: transform .22s ease, box-shadow .22s ease;
}
.footer-fejuc-link:hover { transform: translateY(-3px) rotate(-1deg); box-shadow: 0 20px 40px rgba(0,0,0,.34), 0 0 0 6px rgba(79,215,229,.10); }
.footer-fejuc-logo {
  width: 96px;
  height: 96px;
  object-fit: contain;
  border-radius: 50%;
  background: transparent;
}
.footer-brand-lockup > span { height: 72px; opacity: .88; }
.footer-celeste-logo { width: min(300px, 100%); padding: 10px 14px; border: 1px solid rgba(79,215,229,.16); box-shadow: 0 12px 27px rgba(0,0,0,.16); }
.footer-brand-panel p { max-width: 625px; }

@media (max-width: 1180px) {
  .button-open-platform { min-width: 176px; min-height: 58px; padding-right: 14px; }
  .open-platform-icon { width: 36px; height: 36px; flex-basis: 36px; }
}
@media (max-width: 760px) {
  .button-open-platform { width: 100%; min-width: 0; justify-content: center; }
  .footer-brand-lockup { min-height: 90px; }
  .footer-fejuc-link { width: 86px; height: 86px; flex-basis: 86px; }
  .footer-fejuc-logo { width: 78px; height: 78px; }
  .footer-celeste-logo { width: 230px; }
}
@media (max-width: 480px) {
  .footer-brand-lockup { align-items: center; }
  .footer-fejuc-link { width: 72px; height: 72px; flex-basis: 72px; padding: 3px; }
  .footer-fejuc-logo { width: 65px; height: 65px; }
  .footer-celeste-logo { width: min(205px, calc(100vw - 132px)); }
}

/* =========================================================
   Plataformas complementarias: IECSSB + Climate & Nature Exchange
   ========================================================= */
.complementary-platforms {
  position: relative;
  padding: 34px max(22px, calc((100vw - 1480px) / 2)) 46px;
  overflow: hidden;
  background:
    radial-gradient(circle at 78% 20%, rgba(214,154,22,.08), transparent 28%),
    linear-gradient(180deg, #f8fbfa 0%, #eef5f3 100%);
  border-top: 1px solid rgba(7,34,58,.08);
  border-bottom: 1px solid rgba(7,34,58,.1);
}
.complementary-platforms::before {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  opacity: .32;
  background-image:
    linear-gradient(rgba(7,34,58,.025) 1px, transparent 1px),
    linear-gradient(90deg, rgba(7,34,58,.025) 1px, transparent 1px);
  background-size: 32px 32px;
}
.complementary-heading, .complementary-lead, .complementary-grid { position: relative; z-index: 1; }
.complementary-heading { margin-top: 0; }
.complementary-heading h2 { font-size: clamp(26px, 2.35vw, 39px); }
.complementary-lead { max-width: 1000px; margin-bottom: 26px; }
.complementary-grid {
  width: min(1480px, 100%);
  margin: 0 auto;
  display: grid;
  grid-template-columns: minmax(390px, .82fr) minmax(650px, 1.55fr);
  gap: 20px;
  align-items: stretch;
}
.complementary-card {
  position: relative;
  min-height: 410px;
  overflow: hidden;
  border-radius: 22px;
  isolation: isolate;
  box-shadow: 0 20px 48px rgba(4,23,42,.17);
  transition: transform .28s ease, box-shadow .28s ease, border-color .28s ease;
}
.complementary-card:hover { transform: translateY(-5px); }
.complementary-content { position: relative; z-index: 3; }
.platform-badge {
  display: inline-flex;
  align-items: center;
  min-height: 28px;
  padding: 6px 12px;
  border-radius: 7px;
  font-size: 10px;
  font-weight: 900;
  letter-spacing: .08em;
  text-transform: uppercase;
}
.platform-badge-teal {
  color: #d7fff7;
  background: rgba(17,137,124,.55);
  border: 1px solid rgba(100,244,222,.2);
}
.platform-badge-gold {
  color: #0b2133;
  background: linear-gradient(135deg, #ffe17d, #f2ae1e);
  box-shadow: 0 8px 24px rgba(242,174,30,.24);
}
.platform-kicker {
  margin-top: 12px;
  color: #71ddd0;
  font-size: 11px;
  font-weight: 850;
  letter-spacing: .08em;
  text-transform: uppercase;
}
.complementary-card h3 {
  margin: 9px 0 10px;
  font-size: clamp(25px, 2vw, 34px);
  line-height: 1.08;
  letter-spacing: -.025em;
}
.complementary-card p {
  margin: 0;
  max-width: 690px;
  font-size: 14px;
  line-height: 1.55;
}

/* IECSSB */
.iecssb-card {
  display: grid;
  grid-template-columns: 190px minmax(0, 1fr);
  gap: 4px;
  padding: 26px 24px 24px 20px;
  color: #effffb;
  border: 1px solid rgba(59,226,209,.45);
  background:
    radial-gradient(circle at 15% 48%, rgba(26,194,170,.14), transparent 34%),
    linear-gradient(135deg, #062c31 0%, #04363a 48%, #073f3d 100%);
}
.iecssb-card::after {
  content: "";
  position: absolute;
  inset: auto 0 0 0;
  height: 5px;
  background: linear-gradient(90deg, #30c8d1, #0f8f85, #54d391);
  opacity: .8;
}
.iecssb-card:hover { box-shadow: 0 24px 56px rgba(0,81,80,.28); }
.iecssb-visual {
  position: relative;
  z-index: 2;
  align-self: center;
  min-height: 290px;
  display: grid;
  place-items: center;
}
.iecssb-visual::before {
  content: "";
  position: absolute;
  width: 170px;
  height: 170px;
  border-radius: 50%;
  background: radial-gradient(circle, rgba(43,235,207,.14), transparent 68%);
  filter: blur(2px);
}
.iecssb-visual img {
  position: relative;
  z-index: 1;
  width: 185px;
  max-width: none;
  border-radius: 18px;
  mix-blend-mode: screen;
  filter: saturate(1.12) contrast(1.04);
  mask-image: linear-gradient(180deg, #000 0%, #000 78%, transparent 100%);
}
.iecssb-card h3 { color: #fff; font-size: clamp(23px, 1.75vw, 30px); }
.iecssb-card h3 strong { color: #9ff3df; white-space: nowrap; }
.iecssb-card p { color: #c9e5e2; }
.platform-pill-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 8px;
  margin: 16px 0 18px;
}
.platform-pill-grid span {
  display: flex;
  align-items: center;
  gap: 8px;
  min-height: 45px;
  padding: 9px 10px;
  border-radius: 10px;
  color: #dffaf5;
  background: rgba(2,28,34,.48);
  border: 1px solid rgba(59,226,209,.2);
  font-size: 11px;
}
.platform-pill-grid b { font-weight: 750; }

/* CTA comunes */
.platform-cta {
  position: relative;
  display: grid;
  grid-template-columns: 32px auto 1fr 28px;
  align-items: center;
  gap: 10px;
  min-height: 52px;
  overflow: hidden;
  border-radius: 13px;
  padding: 6px 9px 6px 10px;
  font-size: 13px;
  font-weight: 800;
  transition: transform .22s ease, box-shadow .22s ease, filter .22s ease;
}
.platform-cta:hover { transform: translateY(-2px); filter: brightness(1.06); }
.platform-cta-icon {
  display: grid;
  place-items: center;
  width: 32px;
  height: 32px;
  border-radius: 50%;
  font-size: 18px;
}
.platform-domain { justify-self: stretch; text-align: center; font-size: 14px; letter-spacing: .01em; }
.platform-arrow { font-size: 20px; text-align: center; }
.platform-cta-teal {
  color: #eafffb;
  border: 1px solid rgba(66,233,219,.6);
  background: linear-gradient(90deg, #168e9e 0 39%, rgba(2,37,42,.7) 39% 100%);
  box-shadow: 0 12px 25px rgba(0,0,0,.16);
}
.platform-cta-teal .platform-cta-icon { color: #083e3b; background: #a6f3e3; }

/* Exchange — componente de mayor jerarquía */
.exchange-card {
  min-height: 410px;
  padding: 26px 36% 24px 28px;
  color: #fff;
  border: 2px solid #e6a419;
  background:
    radial-gradient(circle at 75% 50%, rgba(0,126,178,.25), transparent 36%),
    linear-gradient(112deg, #061a2d 0%, #051b2e 52%, #031625 100%);
  box-shadow:
    0 0 0 4px rgba(230,164,25,.08),
    0 0 28px rgba(236,174,36,.54),
    0 24px 62px rgba(3,19,34,.34),
    inset 0 0 28px rgba(25,127,173,.12);
}
.exchange-card::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 0;
  background:
    linear-gradient(90deg, rgba(2,19,33,.98) 0%, rgba(2,19,33,.94) 50%, rgba(2,19,33,.32) 72%, rgba(2,19,33,.08) 100%),
    repeating-linear-gradient(0deg, transparent 0 29px, rgba(48,194,229,.035) 29px 30px);
}
.exchange-card::after {
  content: "";
  position: absolute;
  inset: -2px;
  z-index: -1;
  border-radius: inherit;
  background: linear-gradient(90deg, #efb432, #ffd96b 43%, #e08c0a 72%, #ffe689);
  filter: blur(10px);
  opacity: .55;
}
.exchange-card:hover {
  transform: translateY(-7px) scale(1.004);
  box-shadow:
    0 0 0 5px rgba(230,164,25,.11),
    0 0 42px rgba(236,174,36,.68),
    0 30px 70px rgba(3,19,34,.42);
}
.exchange-glow {
  position: absolute;
  right: 6%;
  top: 12%;
  width: 360px;
  height: 360px;
  border-radius: 50%;
  background: radial-gradient(circle, rgba(26,166,232,.18), rgba(255,192,55,.04) 44%, transparent 72%);
  filter: blur(5px);
  z-index: 1;
}
.exchange-copy { z-index: 4; }
.exchange-kicker { color: #f4bd37; }
.exchange-card h3 {
  margin-top: 8px;
  color: #fff;
  font-size: clamp(28px, 2.35vw, 42px);
  text-shadow: 0 2px 18px rgba(0,0,0,.35);
}
.exchange-card p { color: #d7e5ee; max-width: 760px; }
.exchange-visual {
  position: absolute;
  z-index: 2;
  top: 12px;
  right: -10px;
  bottom: 8px;
  width: 40%;
  display: flex;
  align-items: center;
  justify-content: flex-end;
  overflow: hidden;
  pointer-events: none;
}
.exchange-visual img {
  width: 100%;
  height: 100%;
  max-width: none;
  object-fit: cover;
  object-position: 58% center;
  opacity: .96;
  mix-blend-mode: screen;
  mask-image: linear-gradient(90deg, transparent 0%, #000 18%, #000 100%);
  filter: saturate(1.1) contrast(1.08);
}
.exchange-capabilities {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin: 16px 0 13px;
  max-width: 790px;
}
.exchange-capabilities span {
  display: inline-grid;
  grid-template-columns: 30px auto;
  align-items: center;
  gap: 7px;
  min-height: 42px;
  padding: 6px 10px 6px 6px;
  border-radius: 999px;
  color: #e9f4fa;
  background: rgba(3,28,45,.68);
  border: 1px solid rgba(238,183,51,.34);
  backdrop-filter: blur(6px);
  font-size: 10px;
}
.exchange-capabilities i {
  display: grid;
  place-items: center;
  width: 30px;
  height: 30px;
  border-radius: 50%;
  color: #f6cd62;
  border: 1px solid rgba(246,205,98,.55);
  font-style: normal;
  font-weight: 900;
}
.exchange-capabilities b { font-weight: 760; }
.exchange-status {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 8px;
  margin-bottom: 14px;
  max-width: 690px;
}
.exchange-status span {
  display: grid;
  gap: 1px;
  padding: 9px 11px;
  border-radius: 10px;
  background: rgba(2,23,39,.58);
  border: 1px solid rgba(67,185,219,.18);
}
.exchange-status strong { color: #72e6dd; font-size: 12px; }
.exchange-status small { color: #aebfcb; font-size: 9px; line-height: 1.25; }
.platform-cta-gold {
  max-width: 640px;
  color: #fff7dc;
  border: 1px solid rgba(246,189,45,.72);
  background: linear-gradient(90deg, #c98b12 0 39%, rgba(3,24,40,.82) 39% 100%);
  box-shadow: 0 13px 30px rgba(0,0,0,.26), inset 0 1px 0 rgba(255,255,255,.12);
}
.platform-cta-gold .platform-cta-icon { color: #503500; background: linear-gradient(145deg, #ffdf71, #e2a115); }
.platform-cta-gold .platform-domain { color: #ffd563; font-size: 15px; }

@media (max-width: 1180px) {
  .complementary-grid { grid-template-columns: 1fr; }
  .iecssb-card { grid-template-columns: 210px 1fr; }
  .exchange-card { min-height: 430px; padding-right: 38%; }
}
@media (max-width: 760px) {
  .complementary-platforms { padding: 28px 16px 34px; }
  .complementary-grid { gap: 16px; }
  .complementary-card { min-height: 0; border-radius: 18px; }
  .iecssb-card { grid-template-columns: 1fr; padding: 20px; }
  .iecssb-visual { min-height: 180px; order: 2; }
  .iecssb-visual img { width: 180px; }
  .platform-pill-grid { grid-template-columns: 1fr 1fr; }
  .exchange-card { padding: 22px 20px 22px; }
  .exchange-card::before { background: linear-gradient(180deg, rgba(2,19,33,.97), rgba(2,19,33,.9) 68%, rgba(2,19,33,.7)); }
  .exchange-visual { position: relative; top: auto; right: auto; bottom: auto; width: calc(100% + 40px); height: 210px; margin: 14px -20px -22px; opacity: .7; }
  .exchange-visual img { object-position: center; mask-image: linear-gradient(180deg, transparent, #000 24%, #000 100%); }
  .exchange-status { grid-template-columns: 1fr; }
  .platform-cta { grid-template-columns: 32px auto 1fr 26px; }
  .platform-domain { font-size: 12px; }
}
@media (max-width: 480px) {
  .platform-pill-grid { grid-template-columns: 1fr; }
  .exchange-capabilities { gap: 6px; }
  .exchange-capabilities span { width: calc(50% - 3px); border-radius: 10px; grid-template-columns: 28px 1fr; }
  .platform-cta { grid-template-columns: 30px 1fr 22px; }
  .platform-cta .platform-domain { grid-column: 2 / 3; text-align: left; font-size: 11px; }
  .platform-cta .platform-arrow { grid-column: 3; grid-row: 1 / span 2; }
  .platform-cta strong { align-self: end; }
}

/* =========================================================
   2026-08-07 · Plataformas complementarias compactas
   Proporción horizontal y fina según referencia aprobada
   ========================================================= */
.sr-only{position:absolute!important;width:1px!important;height:1px!important;padding:0!important;margin:-1px!important;overflow:hidden!important;clip:rect(0,0,0,0)!important;white-space:nowrap!important;border:0!important}
.complementary-platforms{
  padding:16px max(20px,calc((100vw - 1750px)/2)) 22px!important;
  background:#f5f7f6!important;
  border-top:0!important;
  border-bottom:1px solid rgba(7,34,58,.10)!important;
  overflow:visible!important;
}
.complementary-platforms::before{display:none!important}
.compact-platform-grid{
  width:min(1750px,100%)!important;
  margin:0 auto!important;
  display:grid!important;
  grid-template-columns:minmax(500px,.72fr) minmax(850px,1.28fr)!important;
  gap:18px!important;
  align-items:stretch!important;
}
.compact-platform-card{
  position:relative;
  height:350px;
  min-height:350px!important;
  overflow:hidden;
  border-radius:18px;
  box-shadow:0 12px 30px rgba(2,25,39,.16);
  transform:none!important;
  transition:transform .24s ease,box-shadow .24s ease,border-color .24s ease;
}
.compact-platform-card:hover{transform:translateY(-3px)!important}

/* IECSSB compacto */
.iecssb-compact{
  display:grid;
  grid-template-columns:38% 62%;
  border:1px solid rgba(34,185,169,.55);
  background:linear-gradient(112deg,#053539 0%,#063d3e 56%,#08453f 100%);
}
.iecssb-compact::after{
  content:"";position:absolute;inset:0;pointer-events:none;
  background:radial-gradient(circle at 18% 45%,rgba(47,232,202,.10),transparent 38%);
}
.compact-visual{position:relative;z-index:1;overflow:hidden;display:flex;align-items:center;justify-content:center}
.iecssb-compact-visual{padding:18px 0 18px 18px}
.iecssb-compact-visual img{
  width:100%;height:100%;object-fit:contain;object-position:center;max-width:none;
  mix-blend-mode:screen;filter:saturate(1.08) contrast(1.04);
  mask-image:linear-gradient(90deg,#000 0%,#000 84%,transparent 100%);
}
.compact-copy{position:relative;z-index:2;padding:20px 20px 18px 8px;display:flex;flex-direction:column;min-width:0}
.compact-badge{
  align-self:flex-start;display:inline-flex;align-items:center;height:28px;padding:0 12px;border-radius:7px;
  text-transform:uppercase;letter-spacing:.06em;font-size:10px;font-weight:900;line-height:1;
}
.compact-badge-teal{color:#dffff9;background:#117f78;border:1px solid rgba(117,247,226,.24)}
.iecssb-compact h3{margin:12px 0 6px;color:#fff;font-size:clamp(20px,1.45vw,27px);line-height:1.08;letter-spacing:-.02em}
.iecssb-compact h3 strong{color:#91f1df;white-space:nowrap}
.iecssb-compact p{margin:0;color:#c9e4e1;font-size:12.5px;line-height:1.45;max-width:440px}
.compact-feature-row{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:7px;margin:13px 0 12px}
.compact-feature-row span{display:flex;align-items:center;gap:7px;min-height:38px;padding:6px 9px;border-radius:8px;background:rgba(2,30,34,.48);border:1px solid rgba(56,204,190,.20);color:#e8faf7;font-size:10.5px;font-weight:720}
.compact-feature-row i{font-style:normal;color:#7fe3cf;font-size:15px}
.compact-cta{margin-top:auto;display:grid;grid-template-columns:32px auto 1fr 24px;align-items:center;gap:8px;min-height:48px;padding:5px 8px;border-radius:11px;text-decoration:none;font-weight:850;transition:transform .2s ease,filter .2s ease,box-shadow .2s ease}
.compact-cta:hover{transform:translateY(-2px);filter:brightness(1.06)}
.compact-cta-icon{width:32px;height:32px;border-radius:50%;display:grid;place-items:center;font-size:17px}
.compact-domain{text-align:center;font-size:13px;font-weight:850;letter-spacing:.01em}.compact-arrow{text-align:center;font-size:18px}
.compact-cta-teal{color:#eafffb;border:1px solid rgba(67,234,219,.70);background:linear-gradient(90deg,#1b9fad 0 38%,rgba(3,39,43,.78) 38% 100%)}
.compact-cta-teal .compact-cta-icon{color:#06443f;background:#a9f0e3}

/* Exchange compacto y premium */
.exchange-compact{
  display:grid;
  grid-template-columns:minmax(0,62%) minmax(360px,38%);
  color:#fff;
  border:2px solid #e6a51a;
  background:linear-gradient(112deg,#061b2e 0%,#041a2c 61%,#031522 100%);
  box-shadow:0 0 0 3px rgba(232,165,26,.06),0 0 24px rgba(236,174,36,.45),0 15px 38px rgba(3,19,34,.26);
}
.exchange-compact::before{content:"";position:absolute;inset:0;pointer-events:none;z-index:0;background:radial-gradient(circle at 72% 48%,rgba(14,119,177,.19),transparent 34%)}
.exchange-compact-copy{position:relative;z-index:3;padding:18px 4px 16px 26px;display:flex;flex-direction:column;min-width:0}
.exchange-title-row{display:grid;grid-template-columns:64px 1fr;gap:14px;align-items:center}
.exchange-mark{width:60px;height:60px;border-radius:50%;display:grid;place-items:center;color:#ffd45b;border:2px solid rgba(243,187,45,.72);background:radial-gradient(circle,rgba(242,180,38,.16),rgba(3,27,45,.62));box-shadow:inset 0 0 0 5px rgba(242,180,38,.06)}
.exchange-mark span{font-size:34px;transform:rotate(-22deg)}
.compact-badge-gold{color:#092238;background:linear-gradient(135deg,#ffdd68,#efac1c);box-shadow:0 5px 16px rgba(239,172,28,.20)}
.exchange-compact h3{margin:5px 0 2px;color:#fff;font-size:clamp(25px,1.9vw,34px);line-height:1.04;letter-spacing:-.025em;text-shadow:0 1px 14px rgba(0,0,0,.35)}
.exchange-subtitle{color:#ffc844;font-size:11.5px;font-weight:900;line-height:1.2}
.exchange-compact-copy>p{margin:10px 0 0;max-width:780px;color:#d7e5ee;font-size:12.5px;line-height:1.42}
.exchange-icon-row{display:flex;gap:7px;align-items:flex-start;margin:12px 0 10px;min-width:0}
.exchange-icon-row span{flex:1 1 0;min-width:0;display:grid;justify-items:center;gap:4px;text-align:center;color:#dfeef6;font-size:8.7px;line-height:1.15;font-weight:700}
.exchange-icon-row i{width:38px;height:38px;border-radius:50%;display:grid;place-items:center;color:#f5cf62;border:1px solid rgba(245,207,98,.60);background:rgba(1,25,41,.68);font-style:normal;font-size:12px;font-weight:900}
.exchange-icon-row b{font-weight:720;max-width:82px}
.compact-cta-gold{max-width:730px;color:#fff7dc;border:1px solid rgba(247,190,46,.80);background:linear-gradient(90deg,#d39513 0 37%,rgba(3,25,41,.86) 37% 100%);box-shadow:0 9px 20px rgba(0,0,0,.20)}
.compact-cta-gold .compact-cta-icon{color:#543600;background:linear-gradient(145deg,#ffe37b,#e1a016)}
.compact-cta-gold .compact-domain{color:#ffd55d;font-size:14px}
.exchange-compact-visual{position:relative;z-index:2;overflow:hidden}
.exchange-compact-visual::before{content:"";position:absolute;z-index:2;inset:0;pointer-events:none;background:linear-gradient(90deg,#041a2c 0%,rgba(4,26,44,.45) 14%,transparent 36%)}
.exchange-compact-visual img{width:100%;height:100%;object-fit:cover;object-position:55% center;max-width:none;filter:saturate(1.1) contrast(1.05)}
.exchange-mini-stats{position:absolute;right:12px;top:18px;bottom:18px;z-index:3;width:130px;display:flex;flex-direction:column;justify-content:center;gap:8px}
.exchange-mini-stats span{display:grid;gap:1px;padding:8px 9px;border-radius:8px;background:rgba(1,24,39,.86);border:1px solid rgba(52,197,223,.38);backdrop-filter:blur(5px)}
.exchange-mini-stats small{color:#d8e6ec;font-size:8px}.exchange-mini-stats strong{color:#55d3e8;font-size:12px;line-height:1.1}
.exchange-mini-stats span:last-child strong{color:#f5c94e}

@media(max-width:1320px){
  .compact-platform-grid{grid-template-columns:minmax(430px,.8fr) minmax(680px,1.2fr)!important}
  .compact-platform-card{height:360px;min-height:360px!important}
  .exchange-icon-row span:nth-child(6){display:none}
}
@media(max-width:1060px){
  .compact-platform-grid{grid-template-columns:1fr!important}
  .compact-platform-card{height:330px;min-height:330px!important}
  .iecssb-compact{grid-template-columns:34% 66%}
  .exchange-compact{grid-template-columns:64% 36%}
}
@media(max-width:720px){
  .complementary-platforms{padding:12px 12px 18px!important}
  .compact-platform-grid{gap:12px!important}
  .compact-platform-card{height:auto;min-height:0!important;border-radius:15px}
  .iecssb-compact{grid-template-columns:112px 1fr}
  .iecssb-compact-visual{padding:14px 0 14px 10px;min-height:240px}
  .compact-copy{padding:16px 14px 14px 4px}
  .iecssb-compact h3{font-size:20px}.iecssb-compact p{font-size:11.5px}.compact-feature-row{grid-template-columns:1fr 1fr;gap:5px;margin:10px 0}.compact-feature-row span{font-size:9.5px;min-height:34px;padding:5px 7px}
  .exchange-compact{display:block;padding-bottom:0}
  .exchange-compact-copy{padding:16px 14px 14px}.exchange-title-row{grid-template-columns:50px 1fr;gap:9px}.exchange-mark{width:46px;height:46px}.exchange-mark span{font-size:27px}.exchange-compact h3{font-size:24px}.exchange-subtitle{font-size:10px}
  .exchange-icon-row{overflow-x:auto;padding-bottom:4px;justify-content:flex-start}.exchange-icon-row span{flex:0 0 66px}.exchange-icon-row span:nth-child(6){display:grid}
  .exchange-compact-visual{height:165px}.exchange-mini-stats{display:none}.exchange-compact-visual::before{background:linear-gradient(180deg,#041a2c 0%,transparent 35%)}
  .compact-cta{grid-template-columns:30px auto 1fr 20px;min-height:44px}.compact-domain{font-size:11px}.compact-cta-gold .compact-domain{font-size:12px}
}
@media(max-width:480px){
  .iecssb-compact{grid-template-columns:1fr}.iecssb-compact-visual{height:145px;min-height:145px;padding:8px 12px 0}.compact-copy{padding:10px 14px 14px}.compact-feature-row{grid-template-columns:1fr 1fr}
  .compact-cta{grid-template-columns:28px 1fr 20px}.compact-domain{grid-column:2;grid-row:2;text-align:left}.compact-arrow{grid-column:3;grid-row:1/span 2}.compact-cta strong{align-self:end}
}
\n\n/* =========================================================\n   TARJETAS COMPLEMENTARIAS — REPRODUCCIÓN PIXEL-FIEL\n   Basadas en la referencia gráfica aprobada por el usuario.\n   ========================================================= */\n.exact-reference-platforms{\n  padding:14px 20px 22px!important;\n  background:#f5f7f6!important;\n  border-top:0!important;\n  border-bottom:1px solid rgba(7,34,58,.10)!important;\n  overflow:hidden!important;\n}\n.exact-reference-platforms::before{display:none!important}\n.exact-reference-grid{\n  width:min(1715px,100%);\n  margin:0 auto;\n  display:grid;\n  grid-template-columns:minmax(0,615fr) minmax(0,1090fr);\n  gap:16px;\n  align-items:stretch;\n}\n.exact-reference-card{\n  position:relative;\n  display:block;\n  width:100%;\n  overflow:hidden;\n  border-radius:0;\n  background:transparent;\n  box-shadow:none;\n  isolation:isolate;\n  line-height:0;\n  transition:transform .22s ease,filter .22s ease;\n}\n.exact-reference-card:hover{transform:translateY(-2px);filter:brightness(1.025)}\n.exact-reference-card>img{\n  display:block;\n  width:100%;\n  height:auto;\n  max-width:none;\n  object-fit:contain;\n  object-position:center;\n  user-select:none;\n  -webkit-user-drag:none;\n}\n.exact-card-link{\n  position:absolute;\n  z-index:3;\n  left:3.2%;\n  right:3.2%;\n  bottom:2.3%;\n  height:14.5%;\n  border-radius:12px;\n  cursor:pointer;\n  outline:none;\n}\n.exact-exchange-card .exact-card-link{left:2.8%;right:42.2%;bottom:2.1%;height:14.7%}\n.exact-card-link:focus-visible{outline:3px solid #fff;outline-offset:-4px}\n\n/* La banda funcional debe ir antes de las dos plataformas, como en la referencia */\n.integration-band + .exact-reference-platforms{margin-top:0!important}\n\n@media(max-width:1100px){\n  .exact-reference-grid{grid-template-columns:1fr;gap:14px;max-width:900px}\n  .exact-reference-card{border-radius:12px}\n}\n@media(max-width:720px){\n  .exact-reference-platforms{padding:10px 10px 16px!important}\n  .exact-reference-grid{gap:10px}\n  .exact-reference-card{border-radius:10px}\n}\n
/* =========================================================
   PLATAFORMAS COMPLEMENTARIAS VIVAS
   HTML/CSS real: cada dato, botón, gráfico e icono es un
   elemento independiente. No se usan screenshots de tarjetas.
   ========================================================= */
.live-platforms{
  padding:16px 20px 22px!important;
  background:#f5f7f6!important;
  border-top:0!important;
  border-bottom:1px solid rgba(7,34,58,.10)!important;
}
.live-platforms::before{display:none!important}
.live-platform-grid{
  width:min(1715px,100%);
  margin:0 auto;
  display:grid;
  grid-template-columns:minmax(0,615fr) minmax(0,1090fr);
  gap:16px;
  align-items:stretch;
}
.live-platform-card{
  position:relative;
  min-width:0;
  height:360px;
  overflow:hidden;
  border-radius:22px;
  transform:translateZ(0);
  transition:transform .22s ease,box-shadow .22s ease;
}
.live-platform-card:hover{transform:translateY(-3px)}
.live-iecssb-card{
  display:grid;
  grid-template-columns:38% 62%;
  background:
    radial-gradient(circle at 12% 50%,rgba(50,229,191,.11),transparent 35%),
    linear-gradient(108deg,#023f3e 0%,#004846 54%,#063c32 100%);
  border:1px solid rgba(50,206,184,.62);
  box-shadow:0 15px 35px rgba(0,73,67,.18),inset 0 0 0 1px rgba(255,255,255,.025);
}
.iecssb-symbol-pane{
  position:relative;
  display:flex;
  align-items:center;
  justify-content:center;
  overflow:hidden;
  min-width:0;
}
.iecssb-symbol-pane::after{
  content:"";
  position:absolute;
  right:0;top:10%;bottom:10%;width:1px;
  background:linear-gradient(transparent,rgba(123,240,216,.26),transparent);
}
.iecssb-symbol-pane img{
  width:94%;
  height:auto;
  max-height:305px;
  object-fit:contain;
  object-position:center;
  filter:saturate(1.05) contrast(1.02);
}
.iecssb-live-copy{
  min-width:0;
  display:flex;
  flex-direction:column;
  padding:22px 26px 18px 18px;
  color:#fff;
}
.live-badge{
  display:inline-flex;
  align-items:center;
  align-self:flex-start;
  min-height:30px;
  padding:6px 15px;
  border-radius:7px;
  font-size:11px;
  line-height:1;
  font-weight:900;
  letter-spacing:.035em;
  white-space:nowrap;
}
.live-badge-teal{background:#0d827c;color:#eafffb;border:1px solid rgba(73,231,216,.25)}
.iecssb-live-copy h3{
  margin:13px 0 8px;
  color:#fff;
  font-size:clamp(21px,1.46vw,27px);
  line-height:1.07;
  letter-spacing:-.025em;
  font-weight:850;
}
.iecssb-live-copy h3 strong{color:#89f1df;font-weight:900}
.iecssb-live-copy p{
  margin:0;
  color:#d9efec;
  font-size:13px;
  line-height:1.45;
  max-width:390px;
}
.iecssb-feature-grid{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:8px;
  margin:13px 0 12px;
}
.iecssb-feature-grid span{
  display:grid;
  grid-template-columns:28px 1fr;
  align-items:center;
  min-height:47px;
  padding:7px 10px;
  border-radius:9px;
  border:1px solid rgba(40,200,185,.28);
  background:rgba(0,45,45,.52);
  color:#e7f7f4;
  font-size:10.5px;
  font-weight:760;
  line-height:1.15;
}
.iecssb-feature-grid b{
  display:grid;
  place-items:center;
  width:24px;height:24px;
  color:#83e6d1;
  font-size:16px;
}
.platform-live-cta{
  margin-top:auto;
  min-height:55px;
  display:grid;
  grid-template-columns:auto 1fr 32px;
  align-items:center;
  border-radius:13px;
  overflow:hidden;
  text-decoration:none!important;
  font-weight:900;
  transition:transform .18s ease,filter .18s ease,box-shadow .18s ease;
}
.platform-live-cta:hover{transform:translateY(-1px);filter:brightness(1.06)}
.cta-lead{height:100%;display:flex;align-items:center;gap:9px;padding:0 17px;font-size:16px;white-space:nowrap}
.cta-lead i{display:grid;place-items:center;width:32px;height:32px;border-radius:50%;font-style:normal;font-size:19px;background:rgba(255,255,255,.72);color:#005f5e}
.cta-domain{text-align:center;font-size:15px;letter-spacing:.01em;white-space:nowrap}
.cta-arrow{display:grid;place-items:center;font-size:22px}
.iecssb-live-cta{border:1px solid #2ad0c3;color:#dffbf7;background:#003f42}
.iecssb-live-cta .cta-lead{background:linear-gradient(90deg,#17aebe,#28b6b3);color:#fff}
.iecssb-live-cta .cta-domain{color:#8ce8d6}
.iecssb-live-cta:hover{box-shadow:0 10px 24px rgba(34,208,194,.2)}

.live-exchange-card{
  display:grid;
  grid-template-columns:minmax(0,58%) minmax(230px,27%) 15%;
  background:
    radial-gradient(circle at 76% 38%,rgba(33,145,221,.18),transparent 28%),
    linear-gradient(104deg,#021729 0%,#041e31 58%,#02131f 100%);
  border:2px solid #efad13;
  box-shadow:0 0 0 1px rgba(255,226,114,.18),0 0 28px rgba(242,170,25,.62),inset 0 0 24px rgba(242,170,25,.07);
}
.live-exchange-card::before{
  content:"";
  position:absolute;
  left:1%;right:1%;top:0;height:5px;
  background:linear-gradient(90deg,transparent,#ffc02e 18%,#fff3a3 50%,#ffc02e 82%,transparent);
  filter:blur(.4px);
  opacity:.92;
}
.exchange-live-copy{
  position:relative;
  z-index:3;
  min-width:0;
  display:flex;
  flex-direction:column;
  padding:18px 8px 14px 22px;
  color:#fff;
}
.exchange-live-heading{
  display:grid;
  grid-template-columns:80px minmax(0,1fr);
  gap:11px;
  align-items:center;
}
.exchange-live-logo{
  width:74px;height:74px;
  object-fit:cover;
  border-radius:18px;
  box-shadow:0 0 24px rgba(244,189,55,.15);
}
.live-badge-gold{background:#f6ba33;color:#071524;border:1px solid rgba(255,222,117,.55)}
.exchange-live-copy h3{
  margin:7px 0 2px;
  color:#fff;
  font-size:clamp(23px,1.65vw,31px);
  line-height:1.03;
  letter-spacing:-.03em;
  font-weight:870;
  white-space:nowrap;
}
.exchange-live-subtitle{
  color:#ffc632;
  font-size:11.4px;
  line-height:1.2;
  font-weight:900;
  white-space:nowrap;
}
.exchange-live-description{
  margin:8px 0 0;
  color:#e6eef5;
  font-size:12.4px;
  line-height:1.35;
  max-width:650px;
}
.exchange-capability-grid{
  display:grid;
  grid-template-columns:repeat(7,minmax(0,1fr));
  align-items:start;
  gap:4px;
  margin:10px 0 9px;
}
.exchange-capability-grid span{
  min-width:0;
  display:grid;
  justify-items:center;
  align-content:start;
  gap:3px;
  text-align:center;
  color:#fff;
  font-size:8.6px;
  line-height:1.1;
  font-weight:760;
}
.exchange-capability-grid img{
  width:47px;height:47px;
  object-fit:cover;
  border-radius:50%;
  filter:saturate(1.08) contrast(1.03);
}
.exchange-capability-grid b{font-weight:760;max-width:78px}
.exchange-live-cta{
  width:min(610px,97%);
  min-height:49px;
  border:1px solid #d99e15;
  color:#ffd558;
  background:#031a2b;
  border-radius:11px;
}
.exchange-live-cta .cta-lead{background:linear-gradient(90deg,#cf8a08,#e5a51f);color:#fff;font-size:14px}
.exchange-live-cta .cta-lead i{background:#ffd966;color:#9d6a00;width:28px;height:28px;font-size:16px}
.exchange-live-cta .cta-domain{font-size:14px;color:#ffd54b}
.exchange-live-cta:hover{box-shadow:0 10px 25px rgba(223,158,23,.24)}
.exchange-globe-pane{
  position:relative;
  z-index:1;
  overflow:hidden;
  min-width:0;
}
.exchange-globe-pane::before{
  content:"";
  position:absolute;
  inset:0;
  z-index:2;
  pointer-events:none;
  background:linear-gradient(90deg,#041c2e 0%,rgba(4,28,46,.14) 22%,transparent 46%),linear-gradient(180deg,rgba(255,174,24,.08),transparent 15%);
}
.exchange-globe-pane img{
  width:100%;height:100%;
  object-fit:cover;
  object-position:50% 50%;
  filter:saturate(1.12) contrast(1.04);
  animation:exchange-globe-breathe 7s ease-in-out infinite alternate;
}
@keyframes exchange-globe-breathe{from{transform:scale(1.00)}to{transform:scale(1.035)}}
.exchange-live-stats{
  position:relative;
  z-index:4;
  display:flex;
  flex-direction:column;
  justify-content:center;
  gap:8px;
  padding:18px 12px 18px 2px;
}
.exchange-stat-card{
  position:relative;
  min-height:82px;
  padding:10px 11px;
  border-radius:9px;
  border:1px solid rgba(33,171,205,.42);
  background:rgba(2,23,38,.9);
  box-shadow:inset 0 0 12px rgba(33,171,205,.04);
  overflow:hidden;
}
.exchange-stat-card small{display:block;color:#e9f3f6;font-size:8.6px;line-height:1.15}
.exchange-stat-card strong{display:block;margin-top:3px;color:#43c9e9;font-size:17px;line-height:1.05;white-space:nowrap}
.exchange-stat-finance strong,.exchange-stat-impact strong{color:#f4b81f;font-size:15px}
.exchange-stat-impact{min-height:76px}
.exchange-stat-impact strong sub{font-size:.6em}
.impact-leaf{position:absolute;right:10px;bottom:7px;color:#75d055;font-size:27px;transform:rotate(-10deg)}
.mini-bars{height:27px;margin-top:4px;display:flex;align-items:flex-end;gap:3px}
.mini-bars i{display:block;flex:1 1 0;min-width:2px;background:#24bddd;border-radius:1px 1px 0 0;animation:bar-rise 1.1s ease both}
.mini-bars i:nth-child(1){height:18%}.mini-bars i:nth-child(2){height:22%}.mini-bars i:nth-child(3){height:20%}.mini-bars i:nth-child(4){height:27%}.mini-bars i:nth-child(5){height:32%}.mini-bars i:nth-child(6){height:44%}.mini-bars i:nth-child(7){height:58%}.mini-bars i:nth-child(8){height:78%}.mini-bars i:nth-child(9){height:100%}
@keyframes bar-rise{from{transform:scaleY(.15);transform-origin:bottom;opacity:.35}to{transform:scaleY(1);transform-origin:bottom;opacity:1}}
.mini-line{display:block;width:100%;height:30px;margin-top:5px;color:#26c5df;overflow:visible}

/* Se eliminan completamente las antiguas tarjetas-imagen */
.exact-reference-platforms{display:none!important}

@media(max-width:1380px){
  .live-platform-card{height:350px}
  .iecssb-live-copy{padding-right:18px}
  .exchange-live-heading{grid-template-columns:68px 1fr}.exchange-live-logo{width:62px;height:62px}
  .exchange-live-copy h3{font-size:25px}.exchange-live-subtitle{font-size:10.4px}
  .exchange-capability-grid img{width:43px;height:43px}
  .exchange-live-stats{padding-right:8px}.exchange-stat-card{padding:8px}.exchange-stat-card strong{font-size:15px}.exchange-stat-finance strong,.exchange-stat-impact strong{font-size:13.5px}
}
@media(max-width:1100px){
  .live-platform-grid{grid-template-columns:1fr;max-width:1000px}
  .live-platform-card{height:auto;min-height:350px}
  .live-exchange-card{grid-template-columns:minmax(0,58%) minmax(230px,27%) 15%}
}
@media(max-width:760px){
  .live-platforms{padding:10px!important}
  .live-iecssb-card{grid-template-columns:34% 66%;min-height:330px;border-radius:17px}
  .iecssb-live-copy{padding:16px 14px 14px 8px}.iecssb-live-copy h3{font-size:20px}.iecssb-live-copy p{font-size:11.5px}.iecssb-feature-grid{gap:5px}.iecssb-feature-grid span{font-size:9.2px;padding:5px;grid-template-columns:23px 1fr}.platform-live-cta{min-height:48px}.cta-lead{padding:0 10px;font-size:12px}.cta-domain{font-size:11px}
  .live-exchange-card{display:grid;grid-template-columns:1fr;min-height:0;height:auto;border-radius:17px}
  .exchange-live-copy{padding:16px 14px 12px}.exchange-live-heading{grid-template-columns:54px 1fr}.exchange-live-logo{width:50px;height:50px}.exchange-live-copy h3{font-size:21px;white-space:normal}.exchange-live-subtitle{font-size:9.6px;white-space:normal}.exchange-live-description{font-size:11px}.exchange-capability-grid{overflow-x:auto;grid-template-columns:repeat(7,64px);justify-content:start}.exchange-capability-grid img{width:42px;height:42px}.exchange-globe-pane{height:170px}.exchange-live-stats{display:grid;grid-template-columns:repeat(3,1fr);gap:6px;padding:8px 10px 12px}.exchange-stat-card{min-height:70px}.exchange-stat-card small{font-size:7.5px}.exchange-stat-card strong{font-size:13px}.exchange-stat-finance strong,.exchange-stat-impact strong{font-size:11px}.mini-bars{height:20px}.mini-line{height:22px}.impact-leaf{display:none}.exchange-live-cta{width:100%}
}
@media(max-width:520px){
  .live-iecssb-card{grid-template-columns:1fr}.iecssb-symbol-pane{height:130px}.iecssb-symbol-pane img{height:125px;width:auto}.iecssb-symbol-pane::after{display:none}.iecssb-live-copy{padding:10px 13px 13px}.iecssb-feature-grid{grid-template-columns:1fr 1fr}
  .exchange-live-stats{grid-template-columns:1fr}.exchange-stat-card{min-height:64px}
}


/* =========================================================
   AJUSTE FINO 2026-08-07 — IECSSB fiel a referencia +
   iconografía Exchange centrada + métrica actualizada.
   ========================================================= */
.live-iecssb-card{
  display:grid!important;
  grid-template-columns:39% 61%!important;
  grid-template-rows:minmax(0,1fr) 58px 58px!important;
  grid-template-areas:
    "symbol copy"
    "features features"
    "cta cta"!important;
  height:360px!important;
  padding:0!important;
  border-radius:18px!important;
  background:
    radial-gradient(circle at 17% 42%,rgba(44,217,192,.10),transparent 34%),
    linear-gradient(112deg,#003f3e 0%,#004542 57%,#04362f 100%)!important;
}
.iecssb-symbol-pane{
  grid-area:symbol!important;
  align-self:stretch!important;
  padding:16px 0 0 14px!important;
  overflow:visible!important;
}
.iecssb-symbol-pane::after{display:none!important}
.iecssb-symbol-pane img{
  width:92%!important;
  max-width:225px!important;
  max-height:210px!important;
  object-fit:contain!important;
  object-position:center!important;
}
.iecssb-live-copy{
  grid-area:copy!important;
  padding:18px 18px 4px 4px!important;
  justify-content:flex-start!important;
}
.iecssb-live-copy .live-badge{
  min-height:28px!important;
  padding:6px 14px!important;
  font-size:10.5px!important;
  border-radius:6px!important;
}
.iecssb-live-copy h3{
  margin:11px 0 7px!important;
  font-size:23px!important;
  line-height:1.03!important;
  letter-spacing:-.025em!important;
  font-weight:850!important;
}
.iecssb-live-copy p{
  margin:0!important;
  max-width:350px!important;
  font-size:12.4px!important;
  line-height:1.42!important;
}
.iecssb-feature-grid{
  grid-area:features!important;
  display:grid!important;
  grid-template-columns:repeat(4,1fr)!important;
  gap:10px!important;
  margin:0 18px 9px!important;
  align-items:stretch!important;
}
.iecssb-feature-grid span{
  display:grid!important;
  grid-template-columns:33px 1fr!important;
  align-items:center!important;
  min-height:48px!important;
  padding:6px 8px!important;
  border-radius:9px!important;
  border:1px solid rgba(31,197,183,.34)!important;
  background:rgba(0,44,46,.58)!important;
  color:#f1fbf9!important;
  font-size:10.4px!important;
  line-height:1.12!important;
  font-weight:760!important;
}
.iecssb-feature-grid img{
  display:block!important;
  width:29px!important;
  height:29px!important;
  object-fit:cover!important;
  border-radius:5px!important;
  justify-self:center!important;
}
.iecssb-feature-grid b{display:none!important}
.iecssb-live-cta{
  grid-area:cta!important;
  margin:0 18px 9px!important;
  min-height:49px!important;
  height:49px!important;
  align-self:end!important;
  grid-template-columns:230px 1fr 38px!important;
  border-radius:11px!important;
}
.iecssb-live-cta .cta-lead{
  font-size:15px!important;
  padding:0 17px!important;
  justify-content:flex-start!important;
}
.iecssb-live-cta .cta-lead i{
  width:31px!important;height:31px!important;font-size:17px!important;
}
.iecssb-live-cta .cta-domain{
  font-size:15px!important;
  color:#72dfca!important;
}

/* Las imágenes de capacidad se recortaron desde la referencia exacta,
   por lo que deben renderizarse completas y centradas, sin crop adicional. */
.exchange-capability-grid span{
  display:grid!important;
  grid-template-rows:49px auto!important;
  justify-items:center!important;
  align-items:start!important;
  justify-content:center!important;
  text-align:center!important;
}
.exchange-capability-grid img{
  width:49px!important;
  height:49px!important;
  object-fit:contain!important;
  object-position:center!important;
  border-radius:50%!important;
  margin:0 auto!important;
  transform:none!important;
}
.exchange-capability-grid span:nth-child(5) img,
.exchange-capability-grid span:nth-child(6) img,
.exchange-capability-grid span:nth-child(7) img{
  justify-self:center!important;
  margin-left:auto!important;
  margin-right:auto!important;
}
.exchange-capability-grid b{
  display:block!important;
  width:100%!important;
  max-width:86px!important;
  text-align:center!important;
  margin:0 auto!important;
}
.exchange-stat-finance small{
  font-size:8.0px!important;
  line-height:1.08!important;
}

@media(max-width:1380px){
  .live-iecssb-card{height:350px!important;grid-template-rows:minmax(0,1fr) 56px 55px!important}
  .iecssb-live-copy h3{font-size:21px!important}
  .iecssb-live-copy p{font-size:11.7px!important}
  .iecssb-feature-grid{margin-left:14px!important;margin-right:14px!important;gap:7px!important}
  .iecssb-live-cta{margin-left:14px!important;margin-right:14px!important;grid-template-columns:205px 1fr 34px!important}
}
@media(max-width:760px){
  .live-iecssb-card{
    height:auto!important;
    min-height:0!important;
    grid-template-columns:34% 66%!important;
    grid-template-rows:auto auto auto!important;
  }
  .iecssb-symbol-pane{padding:12px 0 0 8px!important}
  .iecssb-symbol-pane img{max-height:180px!important}
  .iecssb-live-copy{padding:14px 10px 4px 4px!important}
  .iecssb-live-copy h3{font-size:18px!important}
  .iecssb-live-copy p{font-size:10.8px!important}
  .iecssb-feature-grid{grid-template-columns:repeat(2,1fr)!important;margin:8px 10px!important}
  .iecssb-live-cta{margin:0 10px 10px!important;grid-template-columns:150px 1fr 32px!important}
}
@media(max-width:520px){
  .live-iecssb-card{
    grid-template-columns:1fr!important;
    grid-template-rows:140px auto auto auto!important;
    grid-template-areas:"symbol" "copy" "features" "cta"!important;
  }
  .iecssb-symbol-pane{padding:6px!important}
  .iecssb-symbol-pane img{height:128px!important;max-height:128px!important;width:auto!important}
  .iecssb-live-copy{padding:8px 13px 4px!important}
  .iecssb-feature-grid{grid-template-columns:1fr 1fr!important}
  .iecssb-live-cta{grid-template-columns:145px 1fr 30px!important}
  .iecssb-live-cta .cta-domain{font-size:11px!important}
}
.iecssb-live-copy h3 strong{color:#fff!important}

/* === Visor Nacional de Acueductos Rurales · Proyecto Agua Común === */
.acueductos-national-section{
  padding:36px 22px 42px;
  background:linear-gradient(180deg,#f7faf9 0%,#ffffff 100%);
  border-top:1px solid rgba(7,57,76,.08);
}
.acueductos-shell{
  width:min(1660px,100%);
  margin:0 auto;
  display:grid;
  grid-template-columns:minmax(410px,.36fr) minmax(0,.64fr);
  gap:28px;
  align-items:stretch;
}
.acueductos-copy-card{
  min-height:505px;
  padding:36px 38px 30px;
  border:1px solid rgba(9,57,77,.14);
  border-radius:18px;
  background:#fff;
  box-shadow:0 16px 38px rgba(3,37,55,.10);
  display:flex;
  flex-direction:column;
}
.acueductos-eyebrow{
  display:flex;align-items:center;gap:14px;
  color:#0e829d;font-size:12px;font-weight:900;letter-spacing:.18em;
  margin-bottom:22px;
}
.acueductos-eyebrow span{width:28px;height:2px;background:#20a4c7;display:inline-block}
.acueductos-copy-card h2{
  margin:0 0 18px;
  color:#071f36;
  font-size:clamp(34px,3.1vw,58px);
  line-height:.98;
  letter-spacing:-.045em;
  font-weight:900;
}
.agua-comun-brand{display:flex;align-items:center;gap:12px;margin:6px 0 14px;color:#269eb6}
.agua-comun-brand strong{font-size:clamp(20px,1.7vw,30px);font-weight:850;letter-spacing:-.025em}
.agua-comun-symbol{width:43px;height:52px;color:#1d9fd0;display:grid;place-items:center;flex:0 0 auto}
.agua-comun-symbol svg{width:100%;height:100%}
.acueductos-copy-card p{
  margin:0;
  color:#334657;
  font-size:16px;
  line-height:1.65;
  max-width:95%;
}
.acueductos-cta{
  margin-top:auto;
  min-height:62px;
  border-radius:12px;
  display:grid;
  grid-template-columns:minmax(190px,1.05fr) minmax(180px,.95fr) 48px;
  align-items:stretch;
  overflow:hidden;
  color:#fff;
  background:#082a45;
  border:1px solid #0e5970;
  text-decoration:none;
  box-shadow:0 10px 24px rgba(2,35,54,.14);
  transition:.2s ease;
}
.acueductos-cta:hover{transform:translateY(-2px);box-shadow:0 16px 30px rgba(2,35,54,.20)}
.acueductos-cta-lead,.acueductos-cta-domain,.acueductos-cta-arrow{display:flex;align-items:center}
.acueductos-cta-lead{padding:0 20px;font-weight:850;font-size:15px;background:linear-gradient(90deg,#0d3754,#123f5d);border-right:1px solid rgba(255,255,255,.18)}
.acueductos-cta-domain{padding:0 18px;font-weight:750;font-size:14px;justify-content:center}
.acueductos-cta-arrow{justify-content:center;font-size:20px;color:#bfe9f2}
.acueductos-visual-card{
  position:relative;
  min-height:505px;
  border-radius:18px;
  overflow:hidden;
  background:#061f32;
  box-shadow:0 18px 38px rgba(3,30,47,.15);
  border:1px solid rgba(12,91,113,.20);
  text-decoration:none;
}
.acueductos-visual-card img{width:100%;height:100%;display:block;object-fit:cover;object-position:center}
.acueductos-visual-hover{
  position:absolute;right:22px;top:22px;
  padding:10px 14px;border-radius:999px;
  background:rgba(3,33,51,.82);color:#fff;border:1px solid rgba(79,205,230,.45);
  font-size:12px;font-weight:800;letter-spacing:.02em;
  opacity:0;transform:translateY(-4px);transition:.2s ease;backdrop-filter:blur(8px)
}
.acueductos-visual-card:hover .acueductos-visual-hover{opacity:1;transform:none}
@media(max-width:1050px){
  .acueductos-shell{grid-template-columns:1fr;gap:18px}
  .acueductos-copy-card{min-height:auto;padding:28px}
  .acueductos-visual-card{min-height:430px}
  .acueductos-copy-card h2{font-size:42px}
  .acueductos-cta{margin-top:28px}
}
@media(max-width:650px){
  .acueductos-national-section{padding:22px 12px 28px}
  .acueductos-copy-card{padding:22px 18px;border-radius:15px}
  .acueductos-copy-card h2{font-size:34px}
  .agua-comun-brand strong{font-size:21px}
  .acueductos-copy-card p{font-size:14px;max-width:none}
  .acueductos-cta{grid-template-columns:1fr 42px;min-height:56px}
  .acueductos-cta-domain{display:none}
  .acueductos-visual-card{min-height:290px;border-radius:15px}
  .acueductos-visual-card img{object-position:56% center}
}


/* === Acueductos · imagen cartográfica HD sin recorte === */
.acueductos-shell{
  grid-template-columns:minmax(410px,.355fr) minmax(0,.645fr)!important;
  align-items:stretch!important;
}
.acueductos-visual-card{
  min-height:0!important;
  height:auto!important;
  aspect-ratio:1007 / 544!important;
  align-self:center!important;
  background:#fff!important;
  border:0!important;
  border-radius:18px!important;
  overflow:hidden!important;
  box-shadow:0 18px 38px rgba(3,30,47,.15)!important;
}
.acueductos-visual-card img{
  width:100%!important;
  height:100%!important;
  max-width:none!important;
  display:block!important;
  object-fit:contain!important;
  object-position:center center!important;
  image-rendering:auto!important;
}
.acueductos-visual-hover{display:none!important}
@media(max-width:1050px){
  .acueductos-shell{grid-template-columns:1fr!important}
  .acueductos-visual-card{width:100%!important;min-height:0!important;aspect-ratio:1007 / 544!important}
}
@media(max-width:650px){
  .acueductos-visual-card{min-height:0!important;aspect-ratio:1007 / 544!important;border-radius:14px!important}
  .acueductos-visual-card img{object-fit:contain!important;object-position:center!important}
}

/* === AJUSTE FINAL · ACUEDUCTOS · PROPORCIONES DE LA REFERENCIA === */
@media (min-width:1051px){
  .acueductos-national-section{
    padding:36px 24px 42px!important;
  }
  .acueductos-shell{
    width:min(1594px,100%)!important;
    grid-template-columns:minmax(0,35.65%) minmax(0,64.35%)!important;
    gap:28px!important;
    align-items:center!important;
  }
  .acueductos-copy-card{
    height:auto!important;
    min-height:0!important;
    aspect-ratio:568 / 532!important;
    box-sizing:border-box!important;
    padding:38px 42px 34px!important;
    justify-content:flex-start!important;
  }
  .acueductos-eyebrow{
    margin:0 0 27px!important;
    font-size:12px!important;
    line-height:1!important;
    letter-spacing:.18em!important;
  }
  .acueductos-copy-card h2{
    margin:0 0 14px!important;
    font-size:clamp(42px,2.75vw,50px)!important;
    line-height:1.045!important;
    letter-spacing:-.042em!important;
    font-weight:900!important;
  }
  .agua-comun-brand{
    gap:12px!important;
    margin:3px 0 14px!important;
    min-height:49px!important;
  }
  .agua-comun-symbol{
    width:42px!important;
    height:49px!important;
  }
  .agua-comun-brand strong{
    font-size:clamp(23px,1.52vw,28px)!important;
    line-height:1.05!important;
    white-space:nowrap!important;
  }
  .acueductos-copy-card p{
    margin:0!important;
    max-width:100%!important;
    font-size:15.5px!important;
    line-height:1.52!important;
    letter-spacing:0!important;
  }
  .acueductos-cta{
    margin-top:25px!important;
    min-height:58px!important;
    height:58px!important;
    flex:0 0 58px!important;
    grid-template-columns:minmax(205px,1.05fr) minmax(185px,.95fr) 46px!important;
    border-radius:10px!important;
  }
  .acueductos-cta-lead{
    padding:0 18px!important;
    font-size:15px!important;
    line-height:1.15!important;
  }
  .acueductos-cta-domain{
    padding:0 14px!important;
    font-size:14px!important;
  }
  .acueductos-visual-card{
    width:100%!important;
    height:auto!important;
    min-height:0!important;
    aspect-ratio:1007 / 544!important;
    align-self:center!important;
    border-radius:18px!important;
  }
}

@media (min-width:1051px) and (max-width:1360px){
  .acueductos-shell{gap:22px!important}
  .acueductos-copy-card{padding:31px 32px 29px!important}
  .acueductos-eyebrow{margin-bottom:20px!important}
  .acueductos-copy-card h2{font-size:39px!important;margin-bottom:10px!important}
  .agua-comun-brand{margin-bottom:10px!important}
  .agua-comun-brand strong{font-size:22px!important}
  .acueductos-copy-card p{font-size:14px!important;line-height:1.45!important}
  .acueductos-cta{margin-top:18px!important;min-height:54px!important;height:54px!important;flex-basis:54px!important}
}

@media (max-width:1050px){
  .acueductos-copy-card{
    aspect-ratio:auto!important;
    padding:30px 30px 28px!important;
  }
  .acueductos-copy-card h2{
    line-height:1.04!important;
    margin-bottom:14px!important;
  }
  .acueductos-copy-card p{
    line-height:1.55!important;
  }
  .acueductos-cta{
    margin-top:24px!important;
  }
}

@media (max-width:650px){
  .acueductos-copy-card{padding:24px 20px 22px!important}
  .acueductos-eyebrow{margin-bottom:18px!important}
  .acueductos-copy-card h2{font-size:33px!important;line-height:1.03!important}
  .agua-comun-brand{margin:4px 0 12px!important;align-items:center!important}
  .agua-comun-symbol{width:36px!important;height:43px!important}
  .agua-comun-brand strong{font-size:20px!important;white-space:normal!important}
  .acueductos-copy-card p{font-size:14px!important;line-height:1.5!important}
  .acueductos-cta{margin-top:20px!important}
}

/* ============================================================
   HOTFIX RESPONSIVE 2026-08-07 · ACUEDUCTOS / AGUA COMÚN
   Corrige expansión del SVG, CTA sin caja y mapa sobredimensionado
   en Safari/Chrome móvil. No altera el layout de escritorio.
   ============================================================ */
@media (max-width: 720px){
  .acueductos-national-section{
    padding:18px 12px 26px!important;
    overflow:hidden!important;
  }
  .acueductos-shell{
    width:100%!important;
    max-width:100%!important;
    display:grid!important;
    grid-template-columns:minmax(0,1fr)!important;
    gap:14px!important;
    align-items:start!important;
    overflow:visible!important;
  }
  .acueductos-copy-card{
    width:100%!important;
    min-width:0!important;
    min-height:0!important;
    height:auto!important;
    aspect-ratio:auto!important;
    box-sizing:border-box!important;
    padding:22px 18px 18px!important;
    border-radius:16px!important;
    display:block!important;
    overflow:hidden!important;
  }
  .acueductos-eyebrow{
    display:flex!important;
    align-items:center!important;
    gap:10px!important;
    margin:0 0 14px!important;
    font-size:10px!important;
    line-height:1.2!important;
    letter-spacing:.15em!important;
    white-space:normal!important;
  }
  .acueductos-eyebrow span{
    width:22px!important;
    min-width:22px!important;
    height:2px!important;
  }
  .acueductos-copy-card h2{
    margin:0 0 14px!important;
    padding:0!important;
    font-size:clamp(28px,8.2vw,34px)!important;
    line-height:1.02!important;
    letter-spacing:-.035em!important;
    overflow-wrap:normal!important;
    word-break:normal!important;
  }
  .acueductos-copy-card h2 br{
    display:none!important;
  }
  .agua-comun-brand{
    display:flex!important;
    align-items:center!important;
    gap:10px!important;
    margin:0 0 14px!important;
    min-height:46px!important;
    width:100%!important;
    overflow:hidden!important;
  }
  .agua-comun-symbol{
    display:block!important;
    width:38px!important;
    height:46px!important;
    min-width:38px!important;
    min-height:46px!important;
    max-width:38px!important;
    max-height:46px!important;
    flex:0 0 38px!important;
    overflow:hidden!important;
    contain:strict!important;
  }
  .agua-comun-symbol svg{
    display:block!important;
    width:38px!important;
    height:46px!important;
    min-width:38px!important;
    min-height:46px!important;
    max-width:38px!important;
    max-height:46px!important;
    margin:0!important;
    transform:none!important;
  }
  .agua-comun-brand strong{
    display:block!important;
    min-width:0!important;
    margin:0!important;
    font-size:21px!important;
    line-height:1.08!important;
    letter-spacing:-.02em!important;
    white-space:normal!important;
    overflow-wrap:normal!important;
    word-break:normal!important;
  }
  .acueductos-copy-card p{
    display:block!important;
    width:100%!important;
    max-width:none!important;
    margin:0!important;
    padding:0!important;
    color:#334657!important;
    font-size:15px!important;
    line-height:1.48!important;
    letter-spacing:0!important;
    text-wrap:pretty!important;
  }
  .acueductos-cta{
    position:relative!important;
    display:grid!important;
    grid-template-columns:minmax(0,1fr) 40px!important;
    width:100%!important;
    min-width:0!important;
    min-height:56px!important;
    height:auto!important;
    margin:18px 0 0!important;
    padding:0!important;
    box-sizing:border-box!important;
    border:1px solid #0e5970!important;
    border-radius:11px!important;
    overflow:hidden!important;
    color:#fff!important;
    background:#082a45!important;
    text-decoration:none!important;
    box-shadow:0 8px 18px rgba(2,35,54,.13)!important;
  }
  .acueductos-cta-lead{
    display:flex!important;
    align-items:center!important;
    min-width:0!important;
    padding:12px 14px!important;
    border:0!important;
    background:linear-gradient(90deg,#0d3754,#123f5d)!important;
    color:#fff!important;
    font-size:14px!important;
    font-weight:850!important;
    line-height:1.2!important;
    white-space:normal!important;
  }
  .acueductos-cta-domain{
    display:none!important;
  }
  .acueductos-cta-arrow{
    display:flex!important;
    align-items:center!important;
    justify-content:center!important;
    width:40px!important;
    color:#bfe9f2!important;
    font-size:19px!important;
    background:#082a45!important;
  }
  .acueductos-visual-card{
    display:block!important;
    width:100%!important;
    max-width:100%!important;
    height:auto!important;
    min-height:0!important;
    aspect-ratio:auto!important;
    margin:0!important;
    padding:0!important;
    border-radius:14px!important;
    overflow:hidden!important;
    background:#061f32!important;
    box-shadow:0 12px 26px rgba(3,30,47,.14)!important;
  }
  .acueductos-visual-card img{
    display:block!important;
    width:100%!important;
    max-width:100%!important;
    height:auto!important;
    min-height:0!important;
    max-height:none!important;
    aspect-ratio:auto!important;
    object-fit:contain!important;
    object-position:center!important;
    margin:0!important;
    padding:0!important;
  }
}

@media (max-width: 390px){
  .acueductos-copy-card{padding:20px 16px 16px!important}
  .acueductos-copy-card h2{font-size:29px!important}
  .agua-comun-brand strong{font-size:19px!important}
  .acueductos-copy-card p{font-size:14.5px!important;line-height:1.46!important}
}


/* ============================================================
   CELESTE LANGUAGE SWITCHER · ES / EN / PT
   ============================================================ */
.language-switcher{
  display:inline-flex;
  align-items:center;
  gap:3px;
  padding:4px;
  border:1px solid rgba(7,34,58,.16);
  border-radius:13px;
  background:#f5faf9;
  box-shadow:0 6px 18px rgba(4,23,42,.07);
  white-space:nowrap;
}
.language-globe{
  display:grid;
  place-items:center;
  width:27px;
  height:27px;
  font-size:14px;
  opacity:.8;
}
.language-switcher button{
  min-width:31px;
  height:31px;
  padding:0 7px;
  border:0;
  border-radius:9px;
  background:transparent;
  color:#536171;
  font-size:11px;
  line-height:1;
  font-weight:850;
  letter-spacing:.04em;
  cursor:pointer;
  transition:background .18s ease,color .18s ease,box-shadow .18s ease,transform .18s ease;
}
.language-switcher button:hover{
  color:#075f56;
  background:#e7f5f2;
}
.language-switcher button.active,
.language-switcher button[aria-pressed="true"]{
  color:#fff;
  background:linear-gradient(135deg,#169b8a,#087064);
  box-shadow:0 5px 12px rgba(8,112,100,.22);
}
.language-switcher button:focus-visible{
  outline:3px solid rgba(46,190,173,.30);
  outline-offset:2px;
}
.language-switcher-nav{display:none;}

@media (max-width:1240px) and (min-width:981px){
  .main-nav{gap:12px!important;}
  .main-nav a{font-size:13px!important;}
  .language-switcher-nav{display:inline-flex;}
  .language-switcher-desktop{display:none;}
}
@media (max-width:980px){
  .language-switcher-nav{
    display:flex;
    width:max-content;
    margin:8px 10px 2px;
    align-self:flex-start;
  }
}
@media (max-width:480px){
  .language-switcher-nav{
    margin:8px 8px 3px;
    padding:3px;
  }
  .language-globe{width:25px;height:25px;}
  .language-switcher button{min-width:30px;height:30px;}
}
