:root {
  --navy: #08253d;
  --navy-2: #0e3857;
  --orange: #f28c18;
  --white: #ffffff;
  --text: #173047;
  --muted: #647584;
  --max-width: 1180px;
}

* {
  box-sizing: border-box;
}

html {
  scroll-behavior: smooth;
}

body {
  margin: 0;
  font-family: Arial, Helvetica, sans-serif;
  color: var(--text);
  background: #f7f9fb;
}

a {
  color: inherit;
  text-decoration: none;
}

.container {
  width: min(calc(100% - 40px), var(--max-width));
  margin-inline: auto;
}

.site-header {
  position: absolute;
  inset: 0 0 auto 0;
  z-index: 20;
  color: var(--white);
}

.header-inner {
  min-height: 96px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 28px;
}

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

.brand-mark {
  font-size: 1.9rem;
  font-weight: 900;
  letter-spacing: .04em;
}

.brand-text {
  max-width: 270px;
  font-size: .72rem;
  line-height: 1.2;
  text-transform: uppercase;
  font-weight: 700;
}

.main-nav {
  display: flex;
  align-items: center;
  gap: 24px;
  font-size: .96rem;
  font-weight: 700;
}

.main-nav a {
  position: relative;
  padding: 12px 0;
}

.main-nav a::after {
  content: "";
  position: absolute;
  left: 0;
  right: 100%;
  bottom: 4px;
  height: 2px;
  background: var(--orange);
  transition: right .2s ease;
}

.main-nav a:hover::after {
  right: 0;
}

.menu-toggle {
  display: none;
}

.hero {
  position: relative;
  min-height: 780px;
  display: grid;
  align-items: center;
  overflow: hidden;
  color: var(--white);
  background:
    radial-gradient(circle at 76% 24%, rgba(242, 140, 24, .22), transparent 28%),
    linear-gradient(120deg, #061c2f 0%, #0a2b46 48%, #124a70 100%);
}

.hero::before {
  content: "";
  position: absolute;
  width: 720px;
  height: 720px;
  right: -180px;
  bottom: -360px;
  border: 1px solid rgba(255,255,255,.12);
  border-radius: 50%;
}

.hero::after {
  content: "";
  position: absolute;
  width: 520px;
  height: 520px;
  right: 30px;
  bottom: -300px;
  border: 1px solid rgba(255,255,255,.08);
  border-radius: 50%;
}

.hero-overlay {
  position: absolute;
  inset: 0;
  background: linear-gradient(90deg, rgba(3,17,29,.28), transparent 70%);
}

.hero-content {
  position: relative;
  z-index: 2;
  padding-top: 90px;
}

.eyebrow {
  margin: 0 0 18px;
  color: var(--orange);
  font-size: .95rem;
  font-weight: 800;
  letter-spacing: .18em;
}

h1 {
  max-width: 820px;
  margin: 0;
  font-size: clamp(3.6rem, 8vw, 7.3rem);
  line-height: .92;
  letter-spacing: -.055em;
}

.hero-copy {
  max-width: 660px;
  margin: 28px 0 0;
  font-size: clamp(1.1rem, 2vw, 1.45rem);
  line-height: 1.55;
  color: rgba(255,255,255,.84);
}

.hero-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 14px;
  margin-top: 34px;
}

.btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 52px;
  padding: 0 24px;
  border-radius: 999px;
  font-weight: 800;
}

.btn-primary {
  background: var(--orange);
  color: #111;
}

.btn-secondary {
  border: 1px solid rgba(255,255,255,.5);
  color: var(--white);
  backdrop-filter: blur(6px);
}

.intro {
  padding: 90px 0;
}

.intro h2 {
  margin: 0 0 16px;
  font-size: clamp(2rem, 4vw, 3.4rem);
  color: var(--navy);
}

.intro p {
  max-width: 780px;
  margin: 0;
  font-size: 1.1rem;
  line-height: 1.75;
  color: var(--muted);
}

.site-footer {
  padding: 30px 0;
  background: var(--navy);
  color: var(--white);
}

.site-footer .container {
  display: flex;
  gap: 14px;
  flex-wrap: wrap;
  justify-content: space-between;
}

@media (max-width: 900px) {
  .brand-text {
    display: none;
  }

  .menu-toggle {
    display: inline-flex;
    padding: 10px 14px;
    border: 1px solid rgba(255,255,255,.35);
    border-radius: 999px;
    background: transparent;
    color: var(--white);
    font-weight: 700;
  }

  .main-nav {
    position: absolute;
    top: 82px;
    left: 20px;
    right: 20px;
    display: none;
    flex-direction: column;
    align-items: stretch;
    gap: 0;
    padding: 16px;
    border-radius: 16px;
    background: rgba(6,28,47,.97);
  }

  .main-nav.is-open {
    display: flex;
  }

  .main-nav a {
    padding: 13px 8px;
  }

  .hero {
    min-height: 700px;
  }
}


/* ===== CIDE WEB V2 — fondo aprobado + cabecera ===== */

.logo-placeholder {
  display: grid;
  place-items: center;
  width: 82px;
  height: 82px;
  border: 2px solid var(--orange);
  border-radius: 50%;
  color: #fff;
  font-size: .78rem;
  font-weight: 900;
  text-align: center;
  line-height: 1.05;
  background: rgba(8, 37, 61, .72);
}

/* El fondo está guardado como archivo independiente.
   Cuando tengamos el logo oficial, solo se sustituirá el placeholder. */
.hero {
  background-image:
    linear-gradient(90deg, rgba(3, 17, 29, .16), rgba(3, 17, 29, .04)),
    url("../assets/img/fondo-cide-aprobado-r2.webp");
  background-size: cover;
  background-position: center top;
  background-repeat: no-repeat;
  position: relative;
  overflow: hidden;
}

.site-header {
  background: linear-gradient(180deg, rgba(4, 21, 36, .74), rgba(4, 21, 36, .12), transparent);
}

.main-nav a {
  text-shadow: 0 1px 8px rgba(0,0,0,.28);
}


/* ===== CIDE WEB V3 — REESTRUCTURACIÓN ===== */

.home-sections {
  padding: 100px 0 110px;
  background: #f5f7f9;
}

.section-heading {
  max-width: 760px;
  margin-bottom: 42px;
}

.section-heading h2 {
  margin: 6px 0 16px;
  font-size: clamp(2.3rem, 5vw, 4rem);
  color: var(--navy);
}

.section-heading p {
  line-height: 1.7;
  color: var(--muted);
}

.eyebrow.dark {
  color: var(--orange);
}

.cards-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 22px;
}

.area-card {
  min-height: 240px;
  padding: 28px;
  border: 1px solid #dfe6ec;
  border-radius: 22px;
  background: #fff;
  box-shadow: 0 12px 32px rgba(8, 37, 61, .06);
  transition: transform .2s ease, box-shadow .2s ease, border-color .2s ease;
}

.area-card:hover {
  transform: translateY(-5px);
  border-color: rgba(242, 140, 24, .55);
  box-shadow: 0 18px 42px rgba(8, 37, 61, .11);
}

.card-number {
  display: block;
  margin-bottom: 34px;
  color: var(--orange);
  font-weight: 900;
  letter-spacing: .08em;
}

.area-card h3 {
  margin: 0 0 12px;
  font-size: 1.45rem;
  color: var(--navy);
}

.area-card p {
  margin: 0;
  line-height: 1.6;
  color: var(--muted);
}

.footer-grid {
  display: grid !important;
  grid-template-columns: 1fr auto;
  align-items: start;
  gap: 30px;
}

.site-footer p {
  margin: 8px 0 0;
  color: rgba(255,255,255,.72);
}

.footer-links {
  display: flex;
  flex-wrap: wrap;
  gap: 18px;
}

.internal-page .site-header {
  position: relative;
  background: var(--navy);
}

.page-hero {
  padding: 110px 0 90px;
  color: #fff;
  background:
    linear-gradient(90deg, rgba(3, 17, 29, .18), rgba(3, 17, 29, .08)),
    url("../assets/img/fondo-cide-aprobado-r2.webp");
  background-size: cover;
  background-position: center;
}

.page-hero h1 {
  max-width: 900px;
  font-size: clamp(3rem, 7vw, 6rem);
}

.page-hero > .container > p:last-child {
  max-width: 700px;
  margin-top: 24px;
  font-size: 1.2rem;
  line-height: 1.65;
  color: rgba(255,255,255,.82);
}

.page-content {
  padding: 90px 0;
}

.content-placeholder {
  padding: 42px;
  border-radius: 22px;
  background: #fff;
  box-shadow: 0 12px 34px rgba(8, 37, 61, .06);
}

.content-placeholder h2 {
  margin-top: 0;
  color: var(--navy);
}

@media (max-width: 980px) {
  .cards-grid {
    grid-template-columns: repeat(2, 1fr);
  }

  .footer-grid {
    grid-template-columns: 1fr;
  }
}

@media (max-width: 640px) {
  .cards-grid {
    grid-template-columns: 1fr;
  }

  .home-sections {
    padding: 70px 0;
  }
}


/* ===== CIDE WEB V4 — AJUSTE DE PORTADA ===== */

.ong-fullname {
  max-width: 760px;
  margin: 0 0 20px;
  color: #ffffff;
  font-size: clamp(.95rem, 1.8vw, 1.25rem);
  line-height: 1.35;
  font-weight: 800;
  letter-spacing: .09em;
  text-transform: uppercase;
}

.hero-slogan {
  max-width: 760px;
  margin: 0;
  color: var(--orange);
  font-size: clamp(2.7rem, 6vw, 5.2rem);
  line-height: .98;
  letter-spacing: -.035em;
}

/* La antigua línea descriptiva de la portada ha sido eliminada. */


/* ===== ÚNICO CAMBIO: INTERCAMBIO DE PROTAGONISMO TIPOGRÁFICO ===== */

.ong-fullname {
  font-size: clamp(2.4rem, 5.2vw, 5.4rem);
  line-height: 1.02;
  max-width: 1100px;
}

.hero-slogan {
  font-size: clamp(1.55rem, 2.8vw, 2.7rem);
  line-height: 1.08;
  max-width: 650px;
}


/* ===== V8 — CAPA ORGÁNICA ELIMINADA ===== */
.hero-content::before,
.hero-content::after {
  display: none !important;
  content: none !important;
}

.ong-fullname,
.hero-slogan,
.hero-actions {
  position: relative;
  z-index: 1;
}


/* ===== V11 — FOTO ENTERA A TODA LA PORTADA, SOLO CON CORTE IZQUIERDO ===== */
.hero-photo-cut {
  position: absolute;
  inset: 0;
  z-index: 0;
  pointer-events: none;

  /* Se muestra la fotografía completa ocupando toda la superficie del hero. */
  background-image: url("../assets/img/portada-cide-cooperacion.jpg");
  background-repeat: no-repeat;
  background-position: center center;
  background-size: 100% 100%;

  /*
    ÚNICO CORTE:
    se elimina un triángulo en la esquina superior izquierda.
    El corte parte del lateral izquierdo y termina aproximadamente
    en la mitad de la parte superior.
    Todo el lateral derecho y todo el resto de la fotografía permanecen.
  */
  clip-path: polygon(
    50% 0,
    100% 0,
    100% 100%,
    0 100%,
    0 28%
  );
}

.hero-overlay {
  z-index: 1;
}

.hero-content {
  z-index: 2;
}

/* En móvil conservamos exactamente la misma idea, con un corte algo menor. */
@media (max-width: 800px) {
  .hero-photo-cut {
    clip-path: polygon(
      55% 0,
      100% 0,
      100% 100%,
      0 100%,
      0 20%
    );
  }
}


/* ===== V13 — CORRECCIÓN REAL DEL AJUSTE ===== */

/* Texto "COOPERACIÓN INTERNACIONAL AL DESARROLLO Y EMERGENCIAS"
   claramente más pequeño que en V11 */
.ong-fullname {
  font-size: clamp(1.75rem, 3.55vw, 3.75rem) !important;
  line-height: 1.04 !important;
  max-width: 900px !important;
}

/* Bajamos mucho más el inicio de la diagonal en el lateral izquierdo:
   ahora el corte arranca aproximadamente a media altura del hero. */
.hero-photo-cut {
  clip-path: polygon(
    50% 0,
    100% 0,
    100% 100%,
    0 100%,
    0 55%
  ) !important;
}

@media (max-width: 800px) {
  .ong-fullname {
    font-size: clamp(1.45rem, 6.8vw, 2.35rem) !important;
  }

  .hero-photo-cut {
    clip-path: polygon(
      55% 0,
      100% 0,
      100% 100%,
      0 100%,
      0 48%
    ) !important;
  }
}


/* ===== V14 — CORTE IZQUIERDO MÁS BAJO ===== */
.hero-photo-cut {
  clip-path: polygon(
    50% 0,
    100% 0,
    100% 100%,
    0 100%,
    0 72%
  ) !important;
}

@media (max-width: 800px) {
  .hero-photo-cut {
    clip-path: polygon(
      55% 0,
      100% 0,
      100% 100%,
      0 100%,
      0 64%
    ) !important;
  }
}


/* ===== V15 — LOGO OFICIAL CIDE ARRIBA A LA IZQUIERDA ===== */
.logo-placeholder.logo-real {
  width: 78px !important;
  height: 78px !important;
  padding: 0 !important;
  border: 0 !important;
  background: transparent !important;
  display: flex !important;
  align-items: center;
  justify-content: center;
  overflow: visible;
}
.logo-placeholder.logo-real img {
  width: 100%;
  height: 100%;
  display: block;
  object-fit: contain;
}
@media (max-width: 800px) {
  .logo-placeholder.logo-real {
    width: 62px !important;
    height: 62px !important;
  }
}


/* ===== V16 — ESCUDO TRANSPARENTE Y MUCHO MÁS GRANDE ===== */
.logo-placeholder.logo-real {
  width: 145px !important;
  height: 145px !important;
  min-width: 145px !important;
  padding: 0 !important;
  border: 0 !important;
  background: transparent !important;
  overflow: visible !important;
}

.logo-placeholder.logo-real img {
  width: 145px !important;
  height: 145px !important;
  object-fit: contain !important;
  display: block !important;
  background: transparent !important;
}

/* Ajuste de cabecera para que el logo crezca sin deformar el resto */
.site-header .container,
.header-inner,
.main-header .container {
  overflow: visible !important;
}

@media (max-width: 800px) {
  .logo-placeholder.logo-real {
    width: 100px !important;
    height: 100px !important;
    min-width: 100px !important;
  }

  .logo-placeholder.logo-real img {
    width: 100px !important;
    height: 100px !important;
  }
}


/* ===== V17 — LOGO MÁS GRANDE, MÁS ABAJO Y PEGADO A LA IZQUIERDA ===== */
.logo-placeholder.logo-real {
  width: 205px !important;
  height: 205px !important;
  min-width: 205px !important;
  margin-left: -3.5vw !important;
  margin-top: 24px !important;
  position: relative !important;
  z-index: 20 !important;
}

.logo-placeholder.logo-real img {
  width: 205px !important;
  height: 205px !important;
  object-fit: contain !important;
}

/* Permitimos que sobresalga hacia el borde sin que la cabecera lo recorte */
.site-header,
.main-header,
.site-header .container,
.main-header .container,
.header-inner,
.navbar,
.nav-wrap {
  overflow: visible !important;
}

@media (max-width: 800px) {
  .logo-placeholder.logo-real {
    width: 135px !important;
    height: 135px !important;
    min-width: 135px !important;
    margin-left: -4vw !important;
    margin-top: 16px !important;
  }

  .logo-placeholder.logo-real img {
    width: 135px !important;
    height: 135px !important;
  }
}


/* ===== V18 — LOGO MÁS PEGADO AL BORDE IZQUIERDO ===== */
.logo-placeholder.logo-real {
  margin-left: -8vw !important;
}

@media (max-width: 800px) {
  .logo-placeholder.logo-real {
    margin-left: -7vw !important;
  }
}


/* ===== V19 — SIN FRASE JUNTO AL ESCUDO + MENÚ MÁS ALTO Y MAYOR ===== */

/* Se elimina visualmente cualquier resto del texto junto al logo */
.brand-text {
  display: none !important;
}

/* El menú se eleva y gana un poco de presencia */
.main-nav {
  position: relative !important;
  top: -24px !important;
  z-index: 50 !important;
  font-size: 1.08rem !important;
  gap: 27px !important;
  font-weight: 800 !important;
}

.main-nav a {
  padding: 10px 0 !important;
  text-shadow: 0 2px 8px rgba(0,0,0,.55);
}

/* La cabecera y navegación quedan siempre por encima de la foto */
.site-header,
.header-inner,
.main-nav {
  z-index: 50 !important;
}

.hero-photo-cut,
.hero-overlay {
  z-index: 0 !important;
}

.hero-content {
  z-index: 2 !important;
}

@media (max-width: 800px) {
  .main-nav {
    top: 0 !important;
    font-size: 1rem !important;
  }
}


/* ===== V20 — MENÚ MÁS ARRIBA + SLOGAN CON MAYOR CONTRASTE ===== */

/* Subimos aún más el menú manteniendo su tamaño de V19 */
.main-nav {
  top: -42px !important;
  z-index: 60 !important;
}

/* "UNIENDO MANOS, SALVANDO VIDAS": blanco luminoso para destacar
   mejor sobre el nuevo fondo fotográfico */
.hero-slogan {
  color: #ffffff !important;
  text-shadow:
    0 2px 4px rgba(0,0,0,.75),
    0 0 14px rgba(0,0,0,.35) !important;
}

/* Por si el slogan utiliza un span/acento interno */
.hero-slogan span,
.hero-slogan strong {
  color: #ffffff !important;
}

@media (max-width: 800px) {
  .main-nav {
    top: 0 !important;
  }
}


/* ===== V21 — NUEVA COMBINACIÓN DE COLOR EN PORTADA ===== */

/* El tratamiento blanco con sombra pasa al nombre completo de la ONG */
.ong-fullname {
  color: #ffffff !important;
  text-shadow:
    0 2px 4px rgba(0,0,0,.78),
    0 0 15px rgba(0,0,0,.34) !important;
}

/* "UNIENDO MANOS, SALVANDO VIDAS" recupera color con un tono turquesa luminoso,
   que contrasta bien con el fondo y armoniza con la identidad visual del logo */
.hero-slogan {
  color: #55d6c2 !important;
  text-shadow:
    0 2px 4px rgba(0,0,0,.82),
    0 0 12px rgba(0,0,0,.30) !important;
}

.hero-slogan span,
.hero-slogan strong {
  color: #55d6c2 !important;
}


/* ===== V22 — PRUEBA: FOTO RESCATISTA + PERRO BAJO EL ESCUDO ===== */
.hero-rescue-inset {
  position: absolute;
  left: 0;
  top: 78px;
  width: 360px;
  height: 255px;
  z-index: 1;
  pointer-events: none;

  background-image: url("../assets/img/rescate-perro.jpg");
  background-repeat: no-repeat;
  background-size: 205% auto;

  /* Reencuadre para centrar al rescatista y al perro */
  background-position: 49% 28%;

  /* Corte moderno para integrarla con la esquina */
  clip-path: polygon(
    0 0,
    100% 0,
    92% 82%,
    72% 100%,
    0 92%
  );

  box-shadow: 0 12px 30px rgba(0,0,0,.22);
  filter: saturate(.98) contrast(1.03);
}

/* El contenido de la portada queda por encima cuando sea necesario */
.hero-content {
  position: relative;
  z-index: 3 !important;
}

@media (max-width: 900px) {
  .hero-rescue-inset {
    width: 250px;
    height: 180px;
    top: 96px;
    background-size: 215% auto;
    background-position: 49% 28%;
    opacity: .92;
  }
}

@media (max-width: 620px) {
  .hero-rescue-inset {
    width: 190px;
    height: 138px;
    top: 110px;
    opacity: .78;
  }
}


/* ===== V23 — REENCUADRE FOTO RESCATISTA + PERRO ===== */
/* Más cuadrada y desplazada a la derecha para mostrar completos
   al rescatista y al perro. */
.hero-rescue-inset {
  left: 105px !important;
  top: 92px !important;
  width: 330px !important;
  height: 300px !important;

  /* Menos zoom para que entren mejor ambos protagonistas */
  background-size: 170% auto !important;
  background-position: 50% 24% !important;

  /* Contorno más equilibrado, manteniendo integración moderna */
  clip-path: polygon(
    3% 0,
    100% 0,
    96% 88%,
    84% 100%,
    0 96%,
    0 8%
  ) !important;
}

@media (max-width: 900px) {
  .hero-rescue-inset {
    left: 70px !important;
    top: 105px !important;
    width: 255px !important;
    height: 230px !important;
    background-size: 175% auto !important;
    background-position: 50% 24% !important;
  }
}

@media (max-width: 620px) {
  .hero-rescue-inset {
    left: 38px !important;
    top: 118px !important;
    width: 205px !important;
    height: 185px !important;
    background-size: 178% auto !important;
  }
}


/* ===== V24 — FOTO MÁS ARRIBA Y MÁS A LA DERECHA ===== */
.hero-rescue-inset {
  left: 185px !important;
  top: 38px !important;
}

@media (max-width: 900px) {
  .hero-rescue-inset {
    left: 125px !important;
    top: 58px !important;
  }
}

@media (max-width: 620px) {
  .hero-rescue-inset {
    left: 72px !important;
    top: 78px !important;
  }
}


/* ===== V25 — FOTO ALGO MÁS GRANDE, MÁS ARRIBA Y SIN DEFORMAR ===== */
.hero-rescue-inset {
  left: 175px !important;
  top: 8px !important;

  /* Aumentamos el contenedor, pero mantenemos la proporción de la imagen */
  width: 390px !important;
  height: 320px !important;

  /* La imagen no se deforma: sigue usando proporciones originales */
  background-size: cover !important;
  background-position: 50% 22% !important;

  /* Recorte solo en los laterales de la zona inferior */
  clip-path: polygon(
    0 0,
    100% 0,
    100% 78%,
    90% 100%,
    10% 100%,
    0 78%
  ) !important;
}

@media (max-width: 900px) {
  .hero-rescue-inset {
    left: 115px !important;
    top: 28px !important;
    width: 300px !important;
    height: 245px !important;
    background-position: 50% 22% !important;
  }
}

@media (max-width: 620px) {
  .hero-rescue-inset {
    left: 62px !important;
    top: 50px !important;
    width: 235px !important;
    height: 192px !important;
  }
}


/* ===== V26 — DOS ESQUINAS INFERIORES RECORTADAS HACIA EL CENTRO ===== */
/* Se mantiene tamaño, posición y proporción de V25.
   Solo cambia la silueta inferior: ambos laterales suben y convergen
   en un único punto central en la parte de abajo. */
.hero-rescue-inset {
  clip-path: polygon(
    0 0,
    100% 0,
    100% 72%,
    50% 100%,
    0 72%
  ) !important;
}


/* ===== V27 — RECORTE INFERIOR MÁS PROFUNDO ===== */
/* Los cortes laterales comienzan casi a mitad de altura de la foto
   y convergen en el centro inferior. */
.hero-rescue-inset {
  clip-path: polygon(
    0 0,
    100% 0,
    100% 53%,
    50% 100%,
    0 53%
  ) !important;
}


/* ===== V28 — BOTONES DE PORTADA MÁS CLAROS Y POTENTES ===== */
.hero-actions {
  display: flex;
  align-items: center;
  gap: 18px !important;
  flex-wrap: wrap;
}

/* CONOCE CIDE: visible, elegante y secundario */
.hero-actions .btn-know {
  min-height: 54px;
  padding: 0 27px !important;
  border: 2px solid rgba(255,255,255,.94) !important;
  background: rgba(4,22,31,.52) !important;
  color: #fff !important;
  font-size: 1rem !important;
  font-weight: 800 !important;
  letter-spacing: .035em;
  border-radius: 999px !important;
  backdrop-filter: blur(5px);
  box-shadow:
    0 8px 20px rgba(0,0,0,.30),
    inset 0 0 0 1px rgba(255,255,255,.10);
  transition: transform .18s ease, background .18s ease, box-shadow .18s ease;
}

/* DONAR A CIDE: botón principal, claramente asociado a una aportación económica */
.hero-actions .btn-donate {
  min-height: 61px;
  padding: 0 32px !important;
  border: 2px solid #fff3df !important;
  background: linear-gradient(135deg, #ec642f 0%, #cf3428 100%) !important;
  color: #ffffff !important;
  font-size: 1.08rem !important;
  font-weight: 900 !important;
  letter-spacing: .04em;
  text-transform: uppercase;
  border-radius: 999px !important;
  box-shadow:
    0 11px 30px rgba(126,20,10,.43),
    0 0 0 4px rgba(255,255,255,.14);
  transition: transform .18s ease, filter .18s ease, box-shadow .18s ease;
}

.hero-actions .btn-donate .donate-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 32px;
  height: 32px;
  margin-right: 9px;
  border-radius: 50%;
  background: #ffffff;
  color: #d6402b;
  font-size: 1.08rem;
  font-weight: 900;
  line-height: 1;
  box-shadow: 0 2px 8px rgba(0,0,0,.18);
}

@media (hover:hover) and (pointer:fine) {
  .hero-actions .btn-know:hover {
    transform: translateY(-2px);
    background: rgba(4,22,31,.70) !important;
    box-shadow: 0 12px 26px rgba(0,0,0,.34);
  }

  .hero-actions .btn-donate:hover {
    transform: translateY(-3px) scale(1.025);
    filter: brightness(1.07);
    box-shadow:
      0 15px 34px rgba(126,20,10,.50),
      0 0 0 5px rgba(255,255,255,.17);
  }
}

@media (max-width: 620px) {
  .hero-actions {
    gap: 12px !important;
  }

  .hero-actions .btn-know,
  .hero-actions .btn-donate {
    min-height: 52px;
    padding-left: 20px !important;
    padding-right: 20px !important;
    font-size: .94rem !important;
  }

  .hero-actions .btn-donate .donate-icon {
    width: 27px;
    height: 27px;
    margin-right: 7px;
  }
}


/* ===== V29 — PÁGINA DONAR A CIDE ===== */
.donation-page {
  background: #f5f7f6;
  color: #17252d;
}

.donation-hero {
  padding: 150px 0 70px;
  background:
    radial-gradient(circle at 82% 20%, rgba(85,214,194,.18), transparent 28%),
    linear-gradient(135deg, #0e2832 0%, #153c45 55%, #0d242c 100%);
  color: #fff;
}

.donation-hero-inner {
  display: grid;
  grid-template-columns: minmax(0, 1.4fr) minmax(260px, .6fr);
  gap: 46px;
  align-items: end;
}

.donation-eyebrow {
  margin: 0 0 12px;
  font-size: .82rem;
  font-weight: 900;
  letter-spacing: .18em;
  color: #55d6c2;
}

.donation-eyebrow.dark {
  color: #168d80;
}

.donation-intro h1 {
  margin: 0;
  max-width: 800px;
  font-size: clamp(2.6rem, 6vw, 5.7rem);
  line-height: .95;
  letter-spacing: -.04em;
  text-transform: uppercase;
}

.donation-intro > p:last-child {
  max-width: 760px;
  margin: 24px 0 0;
  font-size: 1.12rem;
  line-height: 1.65;
  color: rgba(255,255,255,.88);
}

.donation-status {
  padding: 20px 22px;
  border: 1px solid rgba(255,255,255,.22);
  border-radius: 18px;
  background: rgba(255,255,255,.09);
  backdrop-filter: blur(8px);
}

.donation-status strong,
.donation-status span {
  display: block;
}

.donation-status strong {
  margin-bottom: 5px;
  color: #fff;
}

.donation-status span {
  font-size: .9rem;
  line-height: 1.45;
  color: rgba(255,255,255,.76);
}

.donation-section {
  padding: 70px 0 80px;
}

.donation-layout {
  display: grid;
  grid-template-columns: repeat(2, minmax(0,1fr));
  gap: 28px;
  align-items: start;
}

.donation-box {
  padding: 30px;
  background: #fff;
  border: 1px solid #e1e7e5;
  border-radius: 24px;
  box-shadow: 0 18px 50px rgba(25,48,57,.08);
}

.donation-box-head {
  display: flex;
  align-items: flex-start;
  gap: 14px;
  margin-bottom: 25px;
}

.step-badge {
  flex: 0 0 auto;
  width: 38px;
  height: 38px;
  display: grid;
  place-items: center;
  border-radius: 50%;
  background: #153c45;
  color: #fff;
  font-weight: 900;
}

.donation-box h2 {
  margin: 0 0 5px;
  font-size: 1.55rem;
}

.donation-box-head p {
  margin: 0;
  color: #64737a;
}

.donation-frequency {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 10px;
  margin-bottom: 22px;
}

.frequency-btn,
.amount-btn,
.payment-card {
  font: inherit;
  cursor: pointer;
}

.frequency-btn {
  min-height: 48px;
  border: 1px solid #ccd7d4;
  border-radius: 14px;
  background: #f7f9f8;
  color: #33474f;
  font-weight: 800;
}

.frequency-btn.active {
  border-color: #153c45;
  background: #153c45;
  color: #fff;
}

.amount-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0,1fr));
  gap: 10px;
}

.amount-btn {
  min-height: 60px;
  border: 1px solid #ccd7d4;
  border-radius: 15px;
  background: #fff;
  color: #153c45;
  font-size: 1.2rem;
  font-weight: 900;
}

.amount-btn.active {
  border-color: #55d6c2;
  background: #e9fbf7;
  box-shadow: inset 0 0 0 2px #55d6c2;
}

.custom-amount {
  display: block;
  margin-top: 20px;
}

.custom-amount > span,
.donor-form label > span {
  display: block;
  margin-bottom: 7px;
  font-size: .88rem;
  font-weight: 800;
  color: #43565e;
}

.custom-amount-field {
  display: flex;
  align-items: center;
  gap: 10px;
  min-height: 54px;
  padding: 0 16px;
  border: 1px solid #ccd7d4;
  border-radius: 14px;
  background: #fff;
}

.custom-amount-field input {
  width: 100%;
  border: 0;
  outline: 0;
  font: inherit;
  font-size: 1.1rem;
}

.custom-amount-field > span {
  font-size: 1.15rem;
  font-weight: 900;
}

.donation-impact {
  margin-top: 22px;
  padding: 18px;
  border-left: 4px solid #55d6c2;
  border-radius: 0 14px 14px 0;
  background: #f1faf8;
}

.donation-impact strong {
  display: block;
  margin-bottom: 6px;
}

.donation-impact p {
  margin: 0;
  color: #5b6d73;
  line-height: 1.5;
}

.payment-methods {
  display: grid;
  gap: 10px;
}

.payment-card {
  display: flex;
  align-items: center;
  gap: 14px;
  width: 100%;
  min-height: 70px;
  padding: 12px 15px;
  border: 1px solid #d4dcda;
  border-radius: 15px;
  background: #fff;
  text-align: left;
}

.payment-card.active {
  border-color: #55d6c2;
  background: #effbf8;
  box-shadow: inset 0 0 0 2px #55d6c2;
}

.payment-icon {
  width: 42px;
  height: 42px;
  display: grid;
  place-items: center;
  border-radius: 12px;
  background: #153c45;
  color: #fff;
  font-size: 1.05rem;
  font-weight: 900;
}

.payment-card strong,
.payment-card small {
  display: block;
}

.payment-card small {
  margin-top: 2px;
  color: #6d7d82;
}

.donor-form {
  display: grid;
  gap: 14px;
  margin-top: 24px;
}

.form-row {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 12px;
}

.donor-form input[type="text"],
.donor-form input[type="email"] {
  width: 100%;
  min-height: 50px;
  padding: 0 14px;
  border: 1px solid #ccd7d4;
  border-radius: 12px;
  font: inherit;
}

.check-line {
  display: flex !important;
  gap: 10px;
  align-items: flex-start;
  font-size: .9rem;
  color: #5b6d73;
}

.check-line input {
  margin-top: 3px;
}

.check-line span {
  margin: 0 !important;
  font-weight: 500 !important;
}

.donation-total {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-top: 25px;
  padding-top: 20px;
  border-top: 1px solid #e2e8e6;
}

.donation-total span {
  color: #5b6d73;
  font-weight: 700;
}

.donation-total strong {
  font-size: 1.8rem;
  color: #153c45;
}

.donate-now {
  width: 100%;
  min-height: 64px;
  margin-top: 16px;
  border: 2px solid #fff3df;
  border-radius: 999px;
  background: linear-gradient(135deg, #ec642f 0%, #cf3428 100%);
  color: #fff;
  font: inherit;
  font-size: 1.05rem;
  font-weight: 900;
  letter-spacing: .055em;
  cursor: pointer;
  box-shadow: 0 12px 28px rgba(132,35,19,.23);
}

.donate-now-icon {
  display: inline-grid;
  place-items: center;
  width: 30px;
  height: 30px;
  margin-right: 8px;
  border-radius: 50%;
  background: #fff;
  color: #d6402b;
}

.payment-note {
  margin: 13px 6px 0;
  text-align: center;
  font-size: .83rem;
  line-height: 1.45;
  color: #78878c;
}

.payment-note.highlight {
  color: #a63b2b;
  font-weight: 800;
}

.donation-trust {
  padding: 75px 0;
  background: #fff;
}

.trust-heading h2 {
  margin: 5px 0 32px;
  font-size: clamp(2rem, 4vw, 3.5rem);
  color: #153c45;
}

.trust-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0,1fr));
  gap: 16px;
}

.trust-grid article {
  min-height: 190px;
  padding: 24px;
  border-radius: 18px;
  background: #f3f7f6;
}

.trust-grid article > span {
  font-size: .8rem;
  font-weight: 900;
  color: #168d80;
}

.trust-grid h3 {
  margin: 24px 0 8px;
  font-size: 1.25rem;
  color: #153c45;
}

.trust-grid p {
  margin: 0;
  color: #65767b;
  line-height: 1.5;
}

.donation-closing {
  padding: 72px 0;
  text-align: center;
  background: #153c45;
  color: #fff;
}

.donation-closing p {
  margin: 0 0 9px;
  color: #55d6c2;
  font-weight: 900;
  letter-spacing: .17em;
  font-size: .78rem;
}

.donation-closing h2 {
  margin: 0;
  font-size: clamp(2rem, 4vw, 3.7rem);
}

@media (hover:hover) and (pointer:fine) {
  .amount-btn:hover,
  .frequency-btn:hover,
  .payment-card:hover {
    transform: translateY(-1px);
  }

  .donate-now:hover {
    filter: brightness(1.06);
    transform: translateY(-2px);
  }
}

@media (max-width: 900px) {
  .donation-hero {
    padding-top: 125px;
  }

  .donation-hero-inner,
  .donation-layout {
    grid-template-columns: 1fr;
  }

  .trust-grid {
    grid-template-columns: repeat(2, minmax(0,1fr));
  }
}

@media (max-width: 620px) {
  .donation-hero {
    padding: 110px 0 48px;
  }

  .donation-box {
    padding: 20px;
  }

  .amount-grid {
    grid-template-columns: repeat(2, minmax(0,1fr));
  }

  .form-row,
  .trust-grid {
    grid-template-columns: 1fr;
  }

  .donation-intro h1 {
    font-size: 2.65rem;
  }
}


/* ===== V30 — RETOQUE PÁGINA DONAR: TRANSFERENCIA ACTIVA ===== */

/* Bajamos el bloque principal para que visualmente quede bajo la zona del escudo */
.donation-hero {
  padding-top: 205px !important;
}

.donation-intro {
  max-width: 850px;
}

/* Aviso en rojo, muy visible */
.construction-status {
  border-color: rgba(255,255,255,.24) !important;
  background: linear-gradient(135deg, #b92925 0%, #8f1f1c 100%) !important;
  box-shadow: 0 12px 32px rgba(77,9,8,.28);
}

.construction-status strong {
  font-size: 1rem;
  letter-spacing: .08em;
}

.construction-status span {
  color: rgba(255,255,255,.92) !important;
}

/* Métodos no disponibles */
.payment-card.disabled {
  opacity: .46;
  cursor: not-allowed;
  filter: grayscale(.8);
}

.payment-card.disabled:hover {
  transform: none !important;
}

/* Transferencia bancaria */
.bank-transfer-box {
  margin-top: 20px;
  padding: 22px;
  border: 2px solid #55d6c2;
  border-radius: 18px;
  background: linear-gradient(180deg, #f0fcf9 0%, #ffffff 100%);
}

.bank-transfer-head {
  margin-bottom: 18px;
}

.bank-transfer-label {
  display: block;
  margin-bottom: 5px;
  color: #168d80;
  font-size: .75rem;
  font-weight: 900;
  letter-spacing: .14em;
}

.bank-transfer-head strong {
  color: #153c45;
  font-size: 1.06rem;
}

.iban-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 18px;
  padding: 16px 0;
  border-top: 1px solid #d9ebe7;
  border-bottom: 1px solid #d9ebe7;
}

.iban-row > div span,
.iban-row > div strong {
  display: block;
}

.iban-row > div span {
  margin-bottom: 5px;
  font-size: .76rem;
  font-weight: 900;
  color: #6a797e;
  letter-spacing: .09em;
}

.iban-row > div strong {
  color: #153c45;
  font-size: 1.18rem;
  letter-spacing: .04em;
  word-break: break-word;
}

.copy-iban {
  min-height: 42px;
  padding: 0 16px;
  border: 0;
  border-radius: 999px;
  background: #d9dfdd;
  color: #6b7679;
  font: inherit;
  font-size: .85rem;
  font-weight: 800;
}

.transfer-details {
  margin-top: 16px;
}

.transfer-details p {
  margin: 7px 0;
  color: #455a61;
}

.transfer-help {
  margin: 15px 0 0;
  font-size: .88rem;
  line-height: 1.5;
  color: #6a797e;
}

/* CTA como enlace */
.transfer-cta {
  display: flex;
  align-items: center;
  justify-content: center;
  text-decoration: none;
}

/* Más aire al texto final sin hacerlo excesivo */
.trust-grid article {
  min-height: 245px !important;
}

.trust-grid p {
  line-height: 1.62 !important;
}

@media (max-width: 900px) {
  .donation-hero {
    padding-top: 165px !important;
  }
}

@media (max-width: 620px) {
  .donation-hero {
    padding-top: 135px !important;
  }

  .iban-row {
    align-items: flex-start;
    flex-direction: column;
  }
}


/* ===== V31 — IBAN REAL DE CIDE ACTIVO ===== */
.copy-iban {
  background: #153c45 !important;
  color: #ffffff !important;
  cursor: pointer !important;
  transition: transform .15s ease, background .15s ease;
}

@media (hover:hover) and (pointer:fine) {
  .copy-iban:hover {
    transform: translateY(-1px);
    background: #1d525d !important;
  }
}


/* ===== V32 — AJUSTES PÁGINA DONAR ===== */

/* "DONAR A CIDE" centrado y más grande, separado visualmente del escudo */
.donation-title-center {
  width: 100%;
  text-align: center !important;
  font-size: clamp(1.25rem, 2.2vw, 2rem) !important;
  margin: 0 auto 28px !important;
  letter-spacing: .16em !important;
  color: #55d6c2 !important;
  text-shadow: 0 2px 8px rgba(0,0,0,.35);
}

.donation-intro {
  width: 100%;
}

.donation-intro h1,
.donation-intro > p:last-child {
  margin-left: auto;
  margin-right: auto;
}

/* Franja completa de información en verde agua */
.donation-trust {
  background: #dff7f2 !important;
}

.trust-grid article {
  background: rgba(255,255,255,.58) !important;
  border: 1px solid rgba(21,60,69,.08);
}

.trust-heading h2 {
  color: #153c45 !important;
}

.trust-grid p {
  color: #53696f !important;
}

@media (max-width: 620px) {
  .donation-title-center {
    font-size: 1.35rem !important;
    margin-bottom: 20px !important;
  }
}


/* ===== V33 — BOTÓN "CONOCE CIDE" CON MÁS IDENTIDAD ===== */
.hero-actions .btn-know {
  position: relative !important;
  overflow: hidden !important;
  min-height: 58px !important;
  padding: 0 30px 0 26px !important;

  /* Forma algo más personal: redondeado pero no totalmente píldora */
  border-radius: 16px 28px 16px 28px !important;
  border: 2px solid rgba(255,255,255,.95) !important;

  background:
    linear-gradient(135deg, rgba(10,48,57,.88) 0%, rgba(15,78,85,.82) 100%) !important;
  color: #ffffff !important;

  font-size: 1.02rem !important;
  font-weight: 900 !important;
  letter-spacing: .045em !important;
  text-transform: uppercase;

  box-shadow:
    0 9px 24px rgba(0,0,0,.30),
    inset 0 0 0 1px rgba(255,255,255,.09) !important;

  transition:
    transform .18s ease,
    box-shadow .18s ease,
    background .18s ease !important;
}

/* Pequeño detalle visual lateral */
.hero-actions .btn-know::before {
  content: "";
  position: absolute;
  left: 0;
  top: 0;
  bottom: 0;
  width: 7px;
  background: #55d6c2;
}

/* Flecha discreta para reforzar que lleva a descubrir CIDE */
.hero-actions .btn-know::after {
  content: "→";
  display: inline-block;
  margin-left: 12px;
  font-size: 1.1rem;
  font-weight: 900;
  transition: transform .18s ease;
}

@media (hover:hover) and (pointer:fine) {
  .hero-actions .btn-know:hover {
    transform: translateY(-3px) !important;
    background:
      linear-gradient(135deg, rgba(13,61,70,.96) 0%, rgba(20,100,105,.92) 100%) !important;
    box-shadow:
      0 14px 30px rgba(0,0,0,.34),
      inset 0 0 0 1px rgba(255,255,255,.12) !important;
  }

  .hero-actions .btn-know:hover::after {
    transform: translateX(4px);
  }
}

@media (max-width: 620px) {
  .hero-actions .btn-know {
    min-height: 54px !important;
    padding-left: 23px !important;
    padding-right: 24px !important;
    font-size: .94rem !important;
  }
}


/* ===== V34 — PÁGINA "CONOCE CIDE" ===== */
.about-page {
  background: #f5f8f7;
  color: #173039;
}

.about-hero {
  padding: 185px 0 90px;
  background:
    radial-gradient(circle at 82% 30%, rgba(85,214,194,.24), transparent 28%),
    linear-gradient(135deg, #0c2630 0%, #16444d 56%, #0e2b34 100%);
  color: #fff;
}

.about-hero-inner {
  display: grid;
  grid-template-columns: minmax(0, 1.3fr) minmax(280px, .7fr);
  gap: 55px;
  align-items: end;
}

.about-kicker {
  margin: 0 0 12px;
  color: #55d6c2;
  font-size: .8rem;
  font-weight: 900;
  letter-spacing: .18em;
}

.about-kicker.dark {
  color: #168d80;
}

.about-hero h1 {
  margin: 0;
  max-width: 900px;
  font-size: clamp(3.2rem, 7vw, 7rem);
  line-height: .9;
  letter-spacing: -.055em;
  text-transform: uppercase;
}

.about-lead {
  max-width: 760px;
  margin: 26px 0 0;
  color: rgba(255,255,255,.88);
  font-size: 1.18rem;
  line-height: 1.62;
}

.about-hero-note {
  padding: 24px;
  border: 1px solid rgba(255,255,255,.22);
  border-radius: 22px;
  background: rgba(255,255,255,.08);
  backdrop-filter: blur(8px);
}

.about-hero-note span,
.about-hero-note strong {
  display: block;
}

.about-hero-note span {
  margin-bottom: 8px;
  color: #55d6c2;
  font-size: .72rem;
  font-weight: 900;
  letter-spacing: .13em;
}

.about-hero-note strong {
  font-size: 1.08rem;
  line-height: 1.45;
}

.about-intro {
  padding: 90px 0;
  background: #fff;
}

.about-intro-grid {
  display: grid;
  grid-template-columns: minmax(0,.8fr) minmax(0,1.2fr);
  gap: 70px;
  align-items: start;
}

.about-heading h2,
.direct-copy h2,
.second-life-head h2,
.real-example-copy h2,
.about-closing h2 {
  margin: 4px 0 0;
  color: #153c45;
  font-size: clamp(2.15rem, 4vw, 4rem);
  line-height: 1.02;
  letter-spacing: -.035em;
}

.about-copy p,
.direct-copy p,
.second-life-head p,
.real-example-copy p,
.about-closing p {
  color: #5b6c72;
  font-size: 1.02rem;
  line-height: 1.72;
}

.about-copy p:first-child {
  margin-top: 0;
}

.direct-cooperation {
  padding: 90px 0;
  background: #dff7f2;
}

.direct-grid {
  display: grid;
  grid-template-columns: minmax(0,1fr) minmax(0,1fr);
  gap: 55px;
  align-items: center;
}

.direct-copy blockquote {
  margin: 28px 0 0;
  padding: 20px 22px;
  border-left: 5px solid #168d80;
  border-radius: 0 16px 16px 0;
  background: rgba(255,255,255,.66);
  color: #153c45;
  font-size: 1.14rem;
  font-weight: 800;
  line-height: 1.55;
}

.direct-photo {
  position: relative;
}

.direct-photo img {
  display: block;
  width: 100%;
  aspect-ratio: 4 / 3;
  object-fit: cover;
  border-radius: 26px 26px 70px 26px;
  box-shadow: 0 24px 50px rgba(26,67,73,.18);
}

.photo-caption {
  position: absolute;
  left: 22px;
  right: 22px;
  bottom: 20px;
  padding: 15px 18px;
  border-radius: 15px;
  background: rgba(9,35,43,.84);
  color: #fff;
  backdrop-filter: blur(7px);
}

.photo-caption strong,
.photo-caption span {
  display: block;
}

.photo-caption span {
  margin-top: 3px;
  color: rgba(255,255,255,.77);
  font-size: .85rem;
}

.second-life {
  padding: 95px 0;
  background: #fff;
}

.second-life-head {
  max-width: 920px;
  margin-bottom: 42px;
}

.story-collage {
  display: grid;
  grid-template-columns: 1.25fr .75fr;
  grid-template-rows: repeat(2, 280px);
  gap: 16px;
}

.story-photo {
  position: relative;
  margin: 0;
  overflow: hidden;
  border-radius: 22px;
  background: #e7eeec;
}

.story-photo.large {
  grid-row: 1 / 3;
}

.story-photo img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

.story-photo figcaption {
  position: absolute;
  left: 14px;
  right: 14px;
  bottom: 14px;
  padding: 11px 13px;
  border-radius: 12px;
  background: rgba(8,34,42,.82);
  color: #fff;
  font-size: .84rem;
  font-weight: 700;
  backdrop-filter: blur(6px);
}

.real-example {
  padding: 95px 0;
  background: #163b44;
  color: #fff;
}

.real-example-grid {
  display: grid;
  grid-template-columns: minmax(0,.9fr) minmax(0,1.1fr);
  gap: 55px;
  align-items: center;
}

.real-example-photo img {
  display: block;
  width: 100%;
  aspect-ratio: 4 / 3;
  object-fit: cover;
  border-radius: 24px 70px 24px 24px;
  box-shadow: 0 25px 55px rgba(0,0,0,.28);
}

.real-example-copy h2 {
  color: #fff;
}

.real-example-copy p {
  color: rgba(255,255,255,.82);
}

.real-example-copy strong {
  color: #fff;
}

.about-closing {
  padding: 82px 0;
  background:
    linear-gradient(135deg, rgba(224,248,243,.96), rgba(255,255,255,.96));
}

.about-closing-inner {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 40px;
}

.about-closing-inner > div:first-child {
  max-width: 800px;
}

.about-closing-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
}

@media (max-width: 900px) {
  .about-hero {
    padding-top: 150px;
  }

  .about-hero-inner,
  .about-intro-grid,
  .direct-grid,
  .real-example-grid {
    grid-template-columns: 1fr;
  }

  .story-collage {
    grid-template-columns: 1fr 1fr;
    grid-template-rows: 360px 240px;
  }

  .story-photo.large {
    grid-column: 1 / 3;
    grid-row: auto;
  }

  .about-closing-inner {
    align-items: flex-start;
    flex-direction: column;
  }
}

@media (max-width: 620px) {
  .about-hero {
    padding: 125px 0 58px;
  }

  .about-hero h1 {
    font-size: 3.15rem;
  }

  .about-intro,
  .direct-cooperation,
  .second-life,
  .real-example {
    padding: 62px 0;
  }

  .story-collage {
    display: grid;
    grid-template-columns: 1fr;
    grid-template-rows: auto;
  }

  .story-photo,
  .story-photo.large {
    grid-column: auto;
    grid-row: auto;
    min-height: 240px;
  }

  .about-closing {
    padding: 58px 0;
  }
}


/* ===== V35 — CARTA DEL PRESIDENTE ===== */
.president-letter {
  padding: 96px 0;
  background:
    radial-gradient(circle at 12% 18%, rgba(85,214,194,.14), transparent 28%),
    linear-gradient(135deg, #102f38 0%, #183f48 62%, #102b33 100%);
  color: #fff;
}

.president-letter-grid {
  display: grid;
  grid-template-columns: minmax(280px,.72fr) minmax(0,1.28fr);
  gap: 72px;
  align-items: start;
}

.president-side {
  position: sticky;
  top: 120px;
  padding: 8px 0;
}

.president-side h2 {
  margin: 8px 0 34px;
  max-width: 420px;
  font-size: clamp(2.3rem,4vw,4.5rem);
  line-height: .98;
  letter-spacing: -.04em;
  color: #fff;
}

.president-signature {
  padding-top: 24px;
  border-top: 1px solid rgba(255,255,255,.22);
}

.president-signature strong,
.president-signature span,
.president-signature small {
  display: block;
}

.president-signature strong {
  font-size: 1.05rem;
}

.president-signature span {
  margin-top: 4px;
  color: #55d6c2;
  font-weight: 800;
}

.president-signature small {
  margin-top: 5px;
  max-width: 300px;
  color: rgba(255,255,255,.62);
  line-height: 1.45;
}

.president-copy {
  position: relative;
  padding: 34px 38px;
  border: 1px solid rgba(255,255,255,.14);
  border-radius: 28px;
  background: rgba(255,255,255,.07);
  backdrop-filter: blur(7px);
  box-shadow: 0 24px 50px rgba(0,0,0,.16);
}

.president-copy::before {
  content: "“";
  position: absolute;
  top: 6px;
  right: 24px;
  font-size: 7rem;
  line-height: 1;
  color: rgba(85,214,194,.16);
  font-family: Georgia, serif;
}

.president-copy p {
  position: relative;
  margin: 0 0 20px;
  color: rgba(255,255,255,.84);
  font-size: 1.02rem;
  line-height: 1.78;
}

.president-copy strong {
  color: #fff;
}

.president-highlight {
  margin: 30px 0 !important;
  padding: 20px 22px;
  border-left: 5px solid #55d6c2;
  border-radius: 0 16px 16px 0;
  background: rgba(85,214,194,.10);
  color: #fff !important;
  font-size: 1.22rem !important;
  font-weight: 800;
  line-height: 1.55 !important;
}

.president-closing {
  margin-top: 28px !important;
  color: #fff !important;
  font-weight: 700;
}

.president-motto {
  margin: 28px 0 0 !important;
  color: #55d6c2 !important;
  font-size: 1.25rem !important;
  font-weight: 900;
  letter-spacing: .04em;
}

@media (max-width: 900px) {
  .president-letter-grid {
    grid-template-columns: 1fr;
    gap: 36px;
  }

  .president-side {
    position: static;
  }

  .president-copy {
    padding: 28px 26px;
  }
}

@media (max-width: 620px) {
  .president-letter {
    padding: 64px 0;
  }

  .president-side h2 {
    font-size: 2.6rem;
  }

  .president-copy {
    padding: 24px 20px;
    border-radius: 20px;
  }

  .president-copy p {
    font-size: .98rem;
    line-height: 1.7;
  }
}

/* ===== V39 · NUESTRA HISTORIA ===== */
.history-origin{
  padding:92px 0;
  background:linear-gradient(180deg,#eef9f7 0%,#ffffff 100%);
}
.history-origin-grid{
  display:grid;
  grid-template-columns:minmax(0,.92fr) minmax(0,1.18fr);
  gap:clamp(38px,6vw,84px);
  align-items:start;
}
.history-period{
  display:inline-block;
  margin:0 0 16px;
  padding:7px 13px;
  border-radius:999px;
  background:#0d4f4b;
  color:#fff;
  font-size:.82rem;
  font-weight:800;
  letter-spacing:.08em;
}
.history-origin-intro h2{
  margin:0 0 24px;
  color:#0a4744;
  font-size:clamp(2rem,4vw,3.5rem);
  line-height:1.04;
}
.history-origin-intro > p{
  margin:0 0 18px;
  color:#405655;
  font-size:1.05rem;
  line-height:1.82;
}
.history-origin-note{
  margin-top:30px;
  padding:21px 23px;
  border-left:5px solid #55d6c2;
  border-radius:0 16px 16px 0;
  background:#fff;
  box-shadow:0 14px 34px rgba(13,79,75,.08);
  color:#2d4d4a;
  line-height:1.65;
}
.history-timeline{position:relative;padding-left:34px;}
.history-timeline::before{
  content:"";
  position:absolute;
  left:8px; top:5px; bottom:7px;
  width:2px;
  background:linear-gradient(#55d6c2,#0d4f4b);
}
.history-item{
  position:relative;
  margin:0 0 22px;
  padding:20px 22px 20px 24px;
  border-radius:18px;
  background:#fff;
  box-shadow:0 14px 32px rgba(14,73,69,.08);
}
.history-item::before{
  content:"";
  position:absolute;
  left:-33px; top:25px;
  width:14px; height:14px;
  border-radius:50%;
  background:#55d6c2;
  border:4px solid #eef9f7;
  box-shadow:0 0 0 2px #0d4f4b;
}
.history-date{
  display:block;
  margin-bottom:7px;
  color:#168c82;
  font-size:.81rem;
  font-weight:900;
  letter-spacing:.08em;
  text-transform:uppercase;
}
.history-item h3{margin:0 0 7px;color:#123f3d;font-size:1.16rem;}
.history-item p{margin:0;color:#596b69;line-height:1.62;}

/* ===== V39 · 2016 NACE CIDE ===== */
.cide-birth{
  padding:96px 0;
  background:
    radial-gradient(circle at 85% 16%, rgba(85,214,194,.12), transparent 26%),
    linear-gradient(180deg,#ffffff 0%,#f3faf8 100%);
}
.cide-birth-grid{
  display:grid;
  grid-template-columns:minmax(0,1fr) minmax(0,1fr);
  gap:58px;
  align-items:center;
}
.cide-birth-copy h2{
  margin:6px 0 24px;
  color:#153c45;
  font-size:clamp(2.15rem,4vw,4rem);
  line-height:1.02;
  letter-spacing:-.035em;
}
.cide-birth-copy p{
  margin:0 0 18px;
  color:#586b70;
  font-size:1.03rem;
  line-height:1.75;
}
.cide-birth-highlight{
  margin:28px 0 24px;
  padding:20px 22px;
  border-left:5px solid #55d6c2;
  border-radius:0 16px 16px 0;
  background:#fff;
  box-shadow:0 16px 36px rgba(13,79,75,.08);
}
.cide-birth-highlight strong,.cide-birth-highlight span{display:block;}
.cide-birth-highlight strong{color:#153c45;font-size:1.08rem;margin-bottom:6px;}
.cide-birth-highlight span{color:#4f6468;line-height:1.6;}
.cide-birth-visual{display:grid;grid-template-columns:1fr;gap:16px;}
.birth-photo-main,.birth-photo-detail{
  position:relative;
  margin:0;
  overflow:hidden;
  background:#eaf1ef;
  box-shadow:0 22px 46px rgba(17,66,70,.12);
}
.birth-photo-main{border-radius:28px 28px 72px 28px;}
.birth-photo-detail{border-radius:22px;max-width:78%;margin-left:auto;}
.birth-photo-main img,.birth-photo-detail img{display:block;width:100%;height:auto;}
.birth-photo-main figcaption,.birth-photo-detail figcaption{
  position:absolute;
  left:14px; right:14px; bottom:14px;
  padding:12px 14px;
  border-radius:12px;
  background:rgba(8,34,42,.84);
  color:#fff;
  font-size:.84rem;
  font-weight:700;
  backdrop-filter:blur(6px);
}
@media (max-width:900px){
  .history-origin{padding:65px 0;}
  .history-origin-grid,.cide-birth-grid{grid-template-columns:1fr;}
  .history-timeline{padding-left:30px;}
  .cide-birth{padding:70px 0;}
  .birth-photo-detail{max-width:100%;margin-left:0;}
}


/* ===== V42 — AJUSTE "CONOCE CIDE" CENTRADO ===== */
.about-hero-kicker-centered{
  display:block;
  width:100%;
  margin:0 auto 24px !important;
  text-align:center !important;
  font-size:.9rem;
  letter-spacing:.24em;
  position:relative;
  z-index:2;
}

.about-hero-copy{
  position:relative;
  z-index:1;
}

@media (max-width: 620px){
  .about-hero-kicker-centered{
    margin-bottom:18px !important;
    font-size:.82rem;
    letter-spacing:.18em;
  }
}


/* ===== V44 · CIDE HOY + CIERRE ===== */
.cide-today{padding:96px 0;background:linear-gradient(180deg,#f5fbfa 0%,#ffffff 100%);}
.cide-today-grid{display:grid;grid-template-columns:minmax(0,1.25fr) minmax(300px,.75fr);gap:56px;align-items:start;}
.cide-today-copy h2{margin:6px 0 24px;color:#153c45;font-size:clamp(2.1rem,4vw,3.7rem);line-height:1.04;letter-spacing:-.03em;}
.cide-today-copy p{margin:0 0 17px;color:#586b70;font-size:1.03rem;line-height:1.76;}
.cide-today-actions{display:grid;gap:18px;position:sticky;top:110px;}
.cide-today-card{display:block;padding:26px 24px;border-radius:22px;text-decoration:none;background:#0d4f4b;box-shadow:0 18px 38px rgba(13,79,75,.14);transition:transform .2s ease,box-shadow .2s ease;}
.cide-today-card:hover{transform:translateY(-4px);box-shadow:0 24px 46px rgba(13,79,75,.18);}
.cide-today-card span,.cide-today-card strong,.cide-today-card small{display:block;}
.cide-today-card span{color:#9ee8dd;font-size:.78rem;font-weight:800;letter-spacing:.12em;margin-bottom:8px;}
.cide-today-card strong{color:#fff;font-size:1.45rem;letter-spacing:.03em;margin-bottom:8px;}
.cide-today-card small{color:rgba(255,255,255,.82);font-size:.92rem;line-height:1.5;}
@media (max-width:900px){.cide-today{padding:70px 0}.cide-today-grid{grid-template-columns:1fr}.cide-today-actions{position:static}}

/* ===== V45 · HAZTE SOCIO ===== */
.btn-socio{background:linear-gradient(135deg,#0d4f4b,#168c82);color:#fff!important;border:1px solid rgba(255,255,255,.35);box-shadow:0 12px 28px rgba(13,79,75,.2);}
.btn-socio:hover{transform:translateY(-2px);box-shadow:0 18px 34px rgba(13,79,75,.26);}
.member-hero{min-height:62vh;display:flex;align-items:center;padding:120px 0 80px;background:linear-gradient(180deg,#eef9f7 0%,#ffffff 100%);}
.member-hero h1{margin:6px 0 18px;color:#153c45;font-size:clamp(2.3rem,5vw,4.8rem);line-height:1.02;}
.member-hero p{max-width:720px;color:#586b70;font-size:1.08rem;line-height:1.7;}

/* ===== V46 · FORMULARIO HAZTE SOCIO ===== */
.member-hero-grid{display:grid;grid-template-columns:minmax(0,1fr) 260px;gap:48px;align-items:center;}
.member-fee-card{padding:26px 24px;border-radius:24px;background:#0d4f4b;color:#fff;text-align:center;box-shadow:0 20px 42px rgba(13,79,75,.18);}
.member-fee-card span,.member-fee-card strong,.member-fee-card small{display:block;}
.member-fee-card span{font-size:.78rem;letter-spacing:.16em;color:#9ee8dd;font-weight:800;}
.member-fee-card strong{font-size:3.2rem;line-height:1;margin:10px 0;}
.member-fee-card small{color:rgba(255,255,255,.78);}
.member-form-section{padding:80px 0 110px;background:#fff;}
.member-form-wrap{max-width:1050px;}
.member-form-intro{max-width:760px;margin-bottom:34px;}
.member-form-intro h2{margin:6px 0 12px;color:#153c45;font-size:clamp(2rem,4vw,3.4rem);}
.member-form-intro p{color:#5b6d71;line-height:1.7;}
.member-form{display:grid;gap:24px;}
.member-form fieldset{border:1px solid #dceae7;border-radius:22px;padding:26px;background:#f9fcfb;}
.member-form legend{padding:0 10px;color:#0d4f4b;font-size:1.05rem;font-weight:900;}
.form-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px;}
.form-span-2{grid-column:1/-1;}
.member-form label{display:grid;gap:8px;color:#294b4b;font-weight:700;font-size:.94rem;}
.member-form input[type="text"],.member-form input[type="email"],.member-form input[type="tel"],.member-form input[type="date"],.member-form select,.member-form textarea{width:100%;padding:13px 14px;border:1px solid #cbded9;border-radius:12px;background:#fff;color:#244443;font:inherit;outline:none;}
.member-form input:focus,.member-form select:focus,.member-form textarea:focus{border-color:#55d6c2;box-shadow:0 0 0 3px rgba(85,214,194,.15);}
.choice-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px;}
.choice-card{display:flex!important;grid-template-columns:none!important;gap:12px!important;align-items:flex-start;padding:18px;border:1px solid #cfe2dd;border-radius:16px;background:#fff;}
.choice-card input{margin-top:4px}.choice-card span{display:block}.choice-card strong,.choice-card small{display:block}.choice-card strong{color:#153c45;margin-bottom:4px}.choice-card small{color:#6a7a7c;line-height:1.45;font-weight:500;}
.check-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px 18px;}
.check-grid label,.member-consents label{display:flex;grid-template-columns:none;gap:10px;align-items:flex-start;font-weight:600;}
.check-grid input,.member-consents input{margin-top:3px;}
.form-security-note{margin:16px 0 0;padding:14px 16px;border-left:4px solid #55d6c2;background:#edf9f6;color:#516765;line-height:1.55;border-radius:0 12px 12px 0;font-size:.9rem;}
.member-consents{display:grid;gap:12px;padding:4px 4px 0;}
.member-final-message{padding:22px 24px;border-radius:18px;background:#e9f8f5;color:#355654;}
.member-final-message strong{display:block;color:#0d4f4b;font-size:1.12rem;margin-bottom:6px;}
.member-final-message p{margin:0;line-height:1.65;}
.member-submit{justify-self:start;border:0;border-radius:14px;padding:15px 24px;background:#0d4f4b;color:#fff;font-weight:900;letter-spacing:.05em;opacity:.55;cursor:not-allowed;}
.member-form-status{margin:0;color:#768587;font-size:.88rem;line-height:1.5;}
@media (max-width:800px){.member-hero-grid,.form-grid,.choice-grid,.check-grid{grid-template-columns:1fr}.form-span-2{grid-column:auto}.member-fee-card{max-width:280px}}

/* ===== V47 · HAZTE SOCIO SIN SOLAPAMIENTO + PRIVACIDAD ===== */
.member-hero{min-height:auto;padding:205px 0 92px;}
.member-hero-shell{position:relative;}
.member-hero-kicker{display:block;width:100%;margin:0 auto 32px!important;text-align:center!important;letter-spacing:.22em;}
.member-hero-copy{max-width:720px;}
.member-hero-grid{align-items:center;}
.member-consents a,.privacy-first-layer a{color:#0d766f;font-weight:800;text-decoration:underline;text-underline-offset:3px;}
.privacy-first-layer{padding:20px 22px;border:1px solid #cfe4df;border-radius:18px;background:#eef9f7;color:#415b59;line-height:1.55;}
.privacy-first-layer>strong{display:block;margin-bottom:10px;color:#0d4f4b;font-size:1.04rem;}
.privacy-first-layer p{margin:5px 0;font-size:.91rem;}
.member-consents label span{line-height:1.5;}
.privacy-page{background:#fff;}
.privacy-hero{padding:205px 0 82px;background:linear-gradient(180deg,#eaf8f5 0%,#ffffff 100%);}
.privacy-hero-inner{max-width:900px;text-align:center;}
.privacy-hero h1{margin:8px 0 18px;color:#153c45;font-size:clamp(2.4rem,5vw,4.7rem);line-height:1.02;}
.privacy-hero p{margin:0 auto 12px;max-width:760px;color:#5a6f70;font-size:1.06rem;line-height:1.7;}
.privacy-hero small{color:#758687;}
.privacy-content{padding:30px 0 100px;}
.privacy-document{max-width:940px;}
.privacy-document section{padding:26px 0;border-bottom:1px solid #e1ece9;}
.privacy-document h2{margin:0 0 14px;color:#0d4f4b;font-size:1.45rem;}
.privacy-document p,.privacy-document li{color:#526667;line-height:1.75;}
.privacy-document ul{padding-left:22px;}
.privacy-document a{color:#0d766f;font-weight:700;}
.privacy-back{padding-top:36px;}
@media (max-width:800px){.member-hero,.privacy-hero{padding-top:175px;}}

/* ===== V49 · ENVÍO FORMULARIO SOCIOS ===== */
.hp-field{position:absolute!important;left:-10000px!important;width:1px!important;height:1px!important;overflow:hidden!important;}
.member-submit:not([disabled]){opacity:1;cursor:pointer;transition:transform .2s ease,box-shadow .2s ease;}
.member-submit:not([disabled]):hover{transform:translateY(-2px);box-shadow:0 14px 30px rgba(13,79,75,.2);}
.form-result-page{min-height:100vh;display:grid;place-items:center;padding:40px 20px;background:linear-gradient(180deg,#eaf8f5 0%,#fff 100%);}
.form-result-card{width:min(680px,100%);padding:42px;border-radius:26px;text-align:center;background:#fff;box-shadow:0 24px 60px rgba(13,79,75,.14);}
.form-result-card img{width:150px;max-height:130px;object-fit:contain;margin-bottom:18px;}
.form-result-card h1{margin:0 0 14px;color:#153c45;font-size:clamp(2rem,5vw,3.3rem);}
.form-result-card p{margin:0 auto 26px;max-width:570px;color:#5b6d71;line-height:1.7;}
.form-result-card.error{border-top:5px solid #b94b4b}.form-result-card.ok{border-top:5px solid #55d6c2;}


/* ===== V50 · COOPERACIÓN Y PROYECTOS ===== */
.cooperation-page{
  background:#f7fbfa;
}
.coop-hero{
  padding:210px 0 96px;
  background:
    radial-gradient(circle at 80% 10%, rgba(85,214,194,.22), transparent 31%),
    linear-gradient(145deg,#0b3d3b 0%,#0d5650 56%,#14756c 100%);
  color:#fff;
}
.coop-hero-inner{
  max-width:980px;
  text-align:center;
}
.coop-hero .about-kicker{
  color:#9ee8dd;
}
.coop-hero h1{
  margin:8px auto 22px;
  max-width:940px;
  font-size:clamp(2.7rem,6vw,5.8rem);
  line-height:.98;
  letter-spacing:-.045em;
  color:#fff;
}
.coop-hero-lead{
  max-width:820px;
  margin:0 auto;
  font-size:1.13rem;
  line-height:1.75;
  color:rgba(255,255,255,.86);
}
.coop-hero-tags{
  display:flex;
  flex-wrap:wrap;
  justify-content:center;
  gap:10px;
  margin-top:28px;
}
.coop-hero-tags span{
  padding:8px 13px;
  border:1px solid rgba(255,255,255,.22);
  border-radius:999px;
  background:rgba(255,255,255,.08);
  color:#fff;
  font-size:.84rem;
  font-weight:800;
}

.coop-intro{
  padding:88px 0 72px;
  background:#fff;
}
.coop-intro-grid{
  display:grid;
  grid-template-columns:.8fr 1.2fr;
  gap:60px;
  align-items:start;
}
.coop-intro h2{
  margin:6px 0 0;
  max-width:480px;
  color:#153c45;
  font-size:clamp(2.2rem,4vw,4rem);
  line-height:1.03;
  letter-spacing:-.035em;
}
.coop-intro-copy{
  max-width:700px;
}
.coop-intro-copy p{
  margin:0 0 18px;
  color:#566b6d;
  font-size:1.06rem;
  line-height:1.8;
}

.coop-timeline{
  padding:72px 0 104px;
  background:#f4f9f8;
}
.coop-section-heading{
  max-width:900px;
  margin:0 0 48px;
}
.coop-section-heading h2{
  margin:7px 0 0;
  color:#153c45;
  font-size:clamp(2.25rem,4.7vw,4.4rem);
  line-height:1.02;
  letter-spacing:-.04em;
}

.coop-project{
  display:grid;
  grid-template-columns:minmax(0,1.05fr) minmax(0,.95fr);
  gap:48px;
  align-items:center;
  margin:0 0 54px;
  padding:28px;
  border:1px solid #dceae7;
  border-radius:28px;
  background:#fff;
  box-shadow:0 18px 48px rgba(19,70,67,.07);
}
.coop-project-reverse .coop-project-media,
.coop-project-reverse .coop-project-gallery{
  order:2;
}
.coop-project-reverse .coop-project-copy{
  order:1;
}
.coop-project-media{
  display:grid;
  grid-template-columns:1.35fr .65fr;
  gap:12px;
  min-height:420px;
}
.coop-project-media img{
  width:100%;
  height:100%;
  min-height:420px;
  object-fit:cover;
  border-radius:19px;
}
.coop-project-media img+img{
  min-height:420px;
}
.coop-project-gallery{
  display:grid;
  grid-template-columns:1.1fr .9fr;
  grid-template-rows:220px 220px;
  gap:10px;
}
.coop-project-gallery img{
  width:100%;
  height:100%;
  object-fit:cover;
  border-radius:17px;
}
.coop-project-gallery img.large{
  grid-row:1 / 3;
}
.coop-project-copy{
  padding:12px 8px;
}
.coop-meta{
  display:flex;
  flex-wrap:wrap;
  gap:9px;
  margin-bottom:12px;
}
.coop-meta span{
  display:inline-flex;
  padding:7px 11px;
  border-radius:999px;
  background:#e6f6f3;
  color:#0e625c;
  font-size:.79rem;
  font-weight:900;
  letter-spacing:.04em;
}
.coop-project-copy h3{
  margin:0 0 18px;
  color:#173f46;
  font-size:clamp(1.9rem,3vw,3.15rem);
  line-height:1.05;
  letter-spacing:-.035em;
}
.coop-project-copy p{
  margin:0 0 16px;
  color:#596c6f;
  line-height:1.72;
}
.coop-project-copy strong{
  color:#264e50;
}
.coop-pill-row{
  display:flex;
  flex-wrap:wrap;
  gap:8px;
  margin-top:22px;
}
.coop-pill-row span{
  padding:8px 11px;
  border-radius:10px;
  background:#eff6f4;
  color:#446462;
  font-size:.8rem;
  font-weight:800;
}

.coop-training-list{
  display:grid;
  gap:9px;
  margin:20px 0;
}
.coop-training-list div{
  padding:13px 15px;
  border-left:4px solid #55d6c2;
  border-radius:0 12px 12px 0;
  background:#f3faf8;
}
.coop-training-list strong,
.coop-training-list span{
  display:block;
}
.coop-training-list strong{
  margin-bottom:3px;
  color:#174b48;
}
.coop-training-list span{
  color:#667979;
  font-size:.88rem;
  line-height:1.45;
}

.coop-video-placeholder{
  display:flex;
  gap:14px;
  align-items:center;
  margin-top:22px;
  padding:16px 17px;
  border:1px dashed #9accc4;
  border-radius:16px;
  background:#f5fbfa;
}
.coop-video-icon{
  display:grid;
  place-items:center;
  flex:0 0 42px;
  width:42px;
  height:42px;
  border-radius:50%;
  background:#0d5650;
  color:#fff;
}
.coop-video-placeholder strong,
.coop-video-placeholder small{
  display:block;
}
.coop-video-placeholder strong{
  color:#174b48;
}
.coop-video-placeholder small{
  margin-top:3px;
  color:#687a7b;
  line-height:1.45;
}

.coop-highlight{
  margin:22px 0;
  padding:20px;
  border-radius:18px;
  background:linear-gradient(135deg,#0d4f4b,#137269);
  color:#fff;
}
.coop-highlight span{
  display:block;
  margin-bottom:6px;
  color:#9ee8dd;
  font-size:.75rem;
  font-weight:900;
  letter-spacing:.12em;
}
.coop-highlight strong{
  display:block;
  margin-bottom:8px;
  color:#fff;
  font-size:1.27rem;
}
.coop-highlight p{
  margin:0;
  color:rgba(255,255,255,.85);
}

.coop-project-social{
  background:linear-gradient(180deg,#fff 0%,#fffaf4 100%);
  border-color:#efdcc4;
}
.coop-magic-kicker{
  margin:0 0 8px !important;
  color:#b56f2d !important;
  font-size:.76rem;
  font-weight:900;
  letter-spacing:.13em;
}
.coop-numbers{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:10px;
  margin:22px 0;
}
.coop-numbers div{
  padding:17px 12px;
  border-radius:16px;
  text-align:center;
  background:#fff4e7;
  border:1px solid #f1dfc8;
}
.coop-numbers strong{
  display:block;
  color:#a95d22;
  font-size:1.45rem;
}
.coop-numbers span{
  display:block;
  margin-top:3px;
  color:#705d4e;
  font-size:.79rem;
  line-height:1.35;
}
.coop-project blockquote{
  margin:22px 0 0;
  padding:18px 20px;
  border-left:4px solid #e7a354;
  border-radius:0 14px 14px 0;
  background:#fff6ea;
  color:#69513e;
  font-size:1.03rem;
  line-height:1.6;
  font-weight:700;
}

.coop-closing{
  padding:86px 0;
  background:#0d4f4b;
  color:#fff;
}
.coop-closing-grid{
  display:grid;
  grid-template-columns:1fr auto;
  gap:50px;
  align-items:center;
}
.coop-closing .about-kicker{
  color:#9ee8dd;
}
.coop-closing h2{
  margin:5px 0 13px;
  color:#fff;
  font-size:clamp(2.2rem,4vw,4rem);
  line-height:1.02;
}
.coop-closing p{
  max-width:760px;
  margin:0;
  color:rgba(255,255,255,.82);
  line-height:1.7;
}
.coop-closing-actions{
  display:flex;
  flex-wrap:wrap;
  gap:12px;
}
.coop-closing .btn-secondary{
  border:1px solid rgba(255,255,255,.4);
  color:#fff;
  background:transparent;
}

@media (max-width:980px){
  .coop-project,
  .coop-intro-grid,
  .coop-closing-grid{
    grid-template-columns:1fr;
  }
  .coop-project-reverse .coop-project-media,
  .coop-project-reverse .coop-project-gallery,
  .coop-project-reverse .coop-project-copy{
    order:initial;
  }
  .coop-closing-actions{
    justify-content:flex-start;
  }
}
@media (max-width:700px){
  .coop-hero{
    padding-top:175px;
  }
  .coop-project{
    padding:16px;
    border-radius:22px;
  }
  .coop-project-media{
    grid-template-columns:1fr;
    min-height:0;
  }
  .coop-project-media img,
  .coop-project-media img+img{
    min-height:260px;
    max-height:340px;
  }
  .coop-project-gallery{
    grid-template-columns:1fr 1fr;
    grid-template-rows:260px 150px;
  }
  .coop-project-gallery img.large{
    grid-column:1/3;
    grid-row:auto;
  }
  .coop-numbers{
    grid-template-columns:1fr;
  }
}


/* ===== V51 · ENLACES DE VÍDEO EN PROYECTOS ===== */
.coop-video-links{
  margin-top:24px;
  padding:18px;
  border:1px solid #cfe3df;
  border-radius:18px;
  background:#f7fbfa;
}
.coop-video-links-head{
  display:flex;
  gap:13px;
  align-items:center;
  margin-bottom:14px;
}
.coop-video-links-head strong,
.coop-video-links-head small{
  display:block;
}
.coop-video-links-head strong{
  color:#174b48;
  font-size:1.02rem;
}
.coop-video-links-head small{
  margin-top:3px;
  color:#687a7b;
  line-height:1.45;
}
.coop-video-link-grid{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:9px;
}
.coop-video-link{
  display:block;
  padding:11px 12px;
  border-radius:11px;
  text-align:center;
  text-decoration:none;
  font-size:.82rem;
  font-weight:800;
}
.coop-video-link.is-pending{
  border:1px dashed #aacdc7;
  background:#edf6f4;
  color:#78908d;
  pointer-events:none;
  cursor:default;
}
.coop-video-link:not(.is-pending){
  background:#0d5650;
  color:#fff;
}
.coop-video-link:not(.is-pending):hover{
  background:#0a4540;
}
@media (max-width:700px){
  .coop-video-link-grid{grid-template-columns:1fr;}
}


/* ===== V52 · COOPERACIÓN REESTRUCTURADA / SUBPÁGINAS ===== */
.projects-hero-compact{
  padding:190px 0 76px;
  background:linear-gradient(145deg,#0b3d3b,#0f625b 65%,#16897d);
  color:#fff;
}
.projects-hero-compact .container{max-width:1050px;text-align:center;}
.projects-hero-compact .about-kicker{color:#9ee8dd;}
.projects-hero-compact h1{margin:8px auto 18px;max-width:980px;color:#fff;font-size:clamp(2.7rem,5.6vw,5.6rem);line-height:.98;letter-spacing:-.045em;}
.projects-hero-compact p{max-width:790px;margin:0 auto;color:rgba(255,255,255,.84);font-size:1.08rem;line-height:1.7;}

.projects-index{padding:74px 0 96px;background:#f5f9f8;}
.projects-index-head{display:grid;grid-template-columns:1fr .8fr;gap:40px;align-items:end;margin-bottom:34px;}
.projects-index-head h2{margin:6px 0 0;color:#153c45;font-size:clamp(2.2rem,4vw,4rem);line-height:1.02;}
.projects-index-head>p{margin:0;color:#617477;line-height:1.65;}

.project-card-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:22px;}
.project-card{display:grid;grid-template-columns:46% 54%;min-height:300px;text-decoration:none;background:#fff;border:1px solid #dce8e6;border-radius:24px;overflow:hidden;box-shadow:0 16px 38px rgba(19,70,67,.06);transition:transform .2s ease,box-shadow .2s ease;}
.project-card:hover{transform:translateY(-4px);box-shadow:0 22px 48px rgba(19,70,67,.11);}
.project-card img{width:100%;height:100%;min-height:300px;object-fit:cover;}
.project-card-body{padding:24px 24px 22px;display:flex;flex-direction:column;}
.project-card-body span{color:#0d766f;font-size:.76rem;font-weight:900;letter-spacing:.08em;text-transform:uppercase;}
.project-card-body h3{margin:8px 0 11px;color:#183f45;font-size:1.7rem;line-height:1.06;}
.project-card-body p{margin:0;color:#607275;line-height:1.6;}
.project-card-body b{margin-top:auto;padding-top:18px;color:#0d625c;}
.project-card-featured{grid-column:span 2;grid-template-columns:54% 46%;min-height:360px;}
.project-card-featured img{min-height:360px;}

.projects-close{padding:70px 0;background:#0d4f4b;color:#fff;}
.projects-close-grid{display:grid;grid-template-columns:1fr auto;gap:40px;align-items:center;}
.projects-close h2{margin:4px 0 0;color:#fff;font-size:clamp(2rem,3.7vw,3.8rem);}
.projects-close .about-kicker{color:#9ee8dd;}
.projects-close-grid>div:last-child{display:flex;gap:12px;flex-wrap:wrap;}
.projects-close .btn-secondary{border:1px solid rgba(255,255,255,.45);color:#fff;background:transparent;}

.project-detail-hero{padding:185px 0 54px;background:#eef8f6;}
.project-detail-hero-grid{display:grid;grid-template-columns:.88fr 1.12fr;gap:38px;align-items:center;}
.project-detail-hero-copy .about-kicker{color:#0d766f;}
.project-detail-hero-copy h1{margin:8px 0 17px;color:#163e45;font-size:clamp(2.6rem,5.2vw,5.2rem);line-height:.98;letter-spacing:-.045em;}
.project-detail-hero-copy p{margin:0;color:#5c7073;font-size:1.07rem;line-height:1.72;}
.project-detail-hero-media{height:500px;border-radius:26px;overflow:hidden;box-shadow:0 22px 52px rgba(19,70,67,.12);}
.project-detail-hero-media img{width:100%;height:100%;object-fit:cover;}

.project-facts{padding:22px 0;background:#fff;}
.project-facts-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px;}
.project-facts-grid div{padding:16px 17px;border-radius:14px;background:#f4f9f8;border:1px solid #e1ece9;}
.project-facts-grid strong,.project-facts-grid span{display:block;}
.project-facts-grid strong{color:#0d625c;font-size:.77rem;text-transform:uppercase;letter-spacing:.07em;}
.project-facts-grid span{margin-top:4px;color:#425e60;font-weight:800;}

.project-detail-content{padding:56px 0 58px;background:#fff;}
.project-detail-layout{display:grid;grid-template-columns:minmax(0,1fr) 290px;gap:54px;align-items:start;}
.project-story{max-width:790px;}
.project-story h2{margin:0 0 18px;color:#173f46;font-size:clamp(2rem,3.8vw,3.7rem);line-height:1.04;}
.project-story h3{margin:28px 0 10px;color:#0d625c;font-size:1.3rem;}
.project-story p{margin:0 0 17px;color:#5a6d70;line-height:1.75;font-size:1.02rem;}
.project-story blockquote{margin:26px 0;padding:18px 20px;border-left:4px solid #e7a354;background:#fff6ea;border-radius:0 14px 14px 0;color:#6a523e;font-weight:700;line-height:1.6;}
.project-side-note{position:sticky;top:110px;padding:22px;border-radius:18px;background:#0d4f4b;color:#fff;}
.project-side-note strong{display:block;margin-bottom:8px;color:#9ee8dd;font-size:.78rem;letter-spacing:.11em;}
.project-side-note p{margin:0;color:rgba(255,255,255,.83);line-height:1.6;}

.project-gallery-section{padding:60px 0 82px;background:#f4f9f8;}
.project-subhead{margin-bottom:22px;}
.project-subhead h2{margin:5px 0 0;color:#173f46;font-size:clamp(2rem,3.7vw,3.5rem);}
.project-gallery-mosaic{display:grid;grid-template-columns:repeat(12,1fr);grid-auto-rows:115px;gap:10px;}
.project-gallery-mosaic img{width:100%;height:100%;object-fit:cover;border-radius:15px;}
.project-gallery-mosaic img:nth-child(1){grid-column:span 7;grid-row:span 3;}
.project-gallery-mosaic img:nth-child(2){grid-column:span 5;grid-row:span 2;}
.project-gallery-mosaic img:nth-child(3){grid-column:span 5;grid-row:span 2;}
.project-gallery-mosaic img:nth-child(4){grid-column:span 4;grid-row:span 2;}
.project-gallery-mosaic img:nth-child(5){grid-column:span 4;grid-row:span 2;}
.project-gallery-mosaic img:nth-child(6){grid-column:span 4;grid-row:span 2;}
.project-gallery-mosaic img:nth-child(n+7){grid-column:span 6;grid-row:span 2;}

.project-video-section{margin-top:36px;padding:22px;border-radius:18px;background:#fff;border:1px solid #dce8e6;}
.project-video-section .coop-video-link-grid{grid-template-columns:repeat(3,1fr);}

.project-nav-strip{padding:20px 0 50px;background:#f4f9f8;}
.project-nav-strip a{color:#0d625c;font-weight:900;text-decoration:none;}

@media(max-width:980px){
  .projects-index-head,.project-detail-hero-grid,.project-detail-layout,.projects-close-grid{grid-template-columns:1fr;}
  .project-card-grid{grid-template-columns:1fr;}
  .project-card,.project-card-featured{grid-column:auto;grid-template-columns:1fr;}
  .project-card img,.project-card-featured img{height:280px;min-height:280px;}
  .project-detail-hero-media{height:420px;}
  .project-side-note{position:static;}
  .project-facts-grid{grid-template-columns:repeat(2,1fr);}
}
@media(max-width:700px){
  .projects-hero-compact,.project-detail-hero{padding-top:165px;}
  .project-detail-hero-media{height:320px;}
  .project-facts-grid{grid-template-columns:1fr;}
  .project-gallery-mosaic{grid-template-columns:1fr;grid-auto-rows:260px;}
  .project-gallery-mosaic img,.project-gallery-mosaic img:nth-child(n){grid-column:auto;grid-row:auto;}
  .project-video-section .coop-video-link-grid{grid-template-columns:1fr;}
}


/* ===== V60 · BOTÓN PLAYLIST DANA ===== */
.coop-video-playlist{
  grid-column:1 / -1;
  margin-top:6px;
  background:#153f44 !important;
  color:#fff !important;
  border:1px solid #153f44 !important;
  font-size:.9rem;
  padding:14px 16px;
}
.coop-video-playlist:hover{
  background:#0d5650 !important;
}


/* ===== V61 · TIENDA SOLIDARIA INTEGRADA ===== */
.shop-hero{padding:200px 0 80px;background:linear-gradient(145deg,#0c4541,#137369);color:#fff}
.shop-hero-grid{display:grid;grid-template-columns:1fr 380px;gap:70px;align-items:center}
.shop-hero .about-kicker{color:#9de8dd}
.shop-hero h1,.shop-page-head h1{margin:7px 0 18px;font-size:clamp(2.7rem,5vw,5.2rem);line-height:.98;letter-spacing:-.045em;color:#fff}
.shop-hero p{max-width:700px;color:rgba(255,255,255,.85);font-size:1.05rem;line-height:1.7}
.shop-hero-actions{display:flex;gap:12px;align-items:center;flex-wrap:wrap;margin-top:26px}
.shop-cart-link{padding:13px 16px;border:1px solid rgba(255,255,255,.35);border-radius:12px;color:#fff;font-weight:900;text-decoration:none}
.shop-cart-link span{display:inline-grid;place-items:center;min-width:24px;height:24px;margin-left:5px;border-radius:999px;background:#fff;color:#0d5650}
.shop-impact{padding:26px;border:1px solid rgba(255,255,255,.18);border-radius:22px;background:rgba(255,255,255,.09)}
.shop-impact strong{color:#9de8dd;font-size:.78rem;letter-spacing:.12em}
.shop-impact p{margin:10px 0 0;font-size:.95rem}

.shop-catalog{padding:82px 0 96px;background:#f4f9f8}
.shop-section-head{display:grid;grid-template-columns:1fr .8fr;gap:40px;align-items:end;margin-bottom:34px}
.shop-section-head h2{margin:5px 0 0;color:#173f46;font-size:clamp(2.2rem,4vw,4rem)}
.shop-section-head>p{margin:0;color:#647678;line-height:1.65}
.shop-product-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:22px}
.shop-product{overflow:hidden;border:1px solid #dce9e6;border-radius:25px;background:#fff;box-shadow:0 16px 42px rgba(18,72,68,.07)}
.shop-product-visual{height:370px;position:relative;display:flex;flex-direction:column;align-items:center;justify-content:center;overflow:hidden;background:linear-gradient(145deg,#dff4ef,#eef7f5)}
.shop-product-visual>span{position:absolute;bottom:18px;font-size:.68rem;font-weight:900;letter-spacing:.12em;color:#55736f}
.product-mark{position:absolute;left:22px;top:18px;font-size:2rem;font-weight:900;color:#0d625c}
.product-shape{position:relative;background:#214e4b;box-shadow:inset 12px 0 18px rgba(255,255,255,.13),0 20px 35px rgba(19,70,67,.18)}
.bottle-shape{width:115px;height:270px;border-radius:35px 35px 28px 28px}
.bottle-shape:before{content:"";position:absolute;width:66px;height:42px;left:25px;top:-27px;background:#214e4b;border-radius:11px 11px 5px 5px}
.mug-shape{width:185px;height:215px;border-radius:28px 28px 38px 38px}
.mug-shape:after{content:"";position:absolute;right:-54px;top:54px;width:75px;height:85px;border:20px solid #214e4b;border-left:0;border-radius:0 50px 50px 0}
.shop-product-body{padding:25px}
.shop-product-topline{display:flex;justify-content:space-between;gap:15px;align-items:center}
.shop-product-topline span{font-size:.69rem;font-weight:900;letter-spacing:.11em;color:#0e726a}
.shop-product-topline strong{font-size:1.45rem;color:#173f46}
.shop-product h3{margin:10px 0 12px;color:#173f46;font-size:1.8rem}
.shop-product p{color:#607275;line-height:1.65}
.shop-field{display:block;margin-top:20px}
.shop-field span,.shop-qty span{display:block;margin-bottom:6px;font-size:.76rem;font-weight:900;color:#365956}
.shop-field select,.shop-qty input{width:100%;padding:12px;border:1px solid #cddfdb;border-radius:10px;background:#fff;color:#294d4b}
.shop-buy-row{display:grid;grid-template-columns:95px 1fr;gap:11px;align-items:end;margin-top:18px}
.shop-qty input{text-align:center}

.shop-trust{padding:35px 0;background:#fff;border-top:1px solid #dce9e6}
.shop-trust-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}
.shop-trust-grid div{padding:16px 18px;border-left:3px solid #55d6c2}
.shop-trust strong,.shop-trust span{display:block}
.shop-trust strong{color:#173f46}.shop-trust span{margin-top:5px;color:#697b7c;font-size:.88rem;line-height:1.45}

.shop-page-head{padding:190px 0 60px;background:#0d5650;color:#fff}
.shop-page-head .about-kicker{color:#9de8dd}
.shop-page-head p{max-width:720px;color:rgba(255,255,255,.82)}

.cart-section,.checkout-section{padding:60px 0 90px;background:#f4f9f8}
.cart-layout,.checkout-layout{display:grid;grid-template-columns:minmax(0,1fr) 380px;gap:30px;align-items:start}
.cart-items{display:grid;gap:12px}
.cart-item{display:grid;grid-template-columns:1fr auto;gap:25px;padding:22px;border:1px solid #dce9e6;border-radius:18px;background:#fff}
.cart-item-label{font-size:.68rem;font-weight:900;letter-spacing:.1em;color:#0e726a}
.cart-item h3{margin:6px 0;color:#173f46;font-size:1.35rem}.cart-item p{margin:0;color:#6d7d7e}
.cart-item-controls{display:flex;align-items:end;gap:15px}
.cart-item-controls label{font-size:.73rem;font-weight:800;color:#526b69}
.cart-item-controls input{display:block;width:70px;margin-top:5px;padding:9px;border:1px solid #ccddda;border-radius:8px;text-align:center}
.cart-item-controls strong{min-width:75px;text-align:right;color:#173f46}
.cart-item-controls button{border:0;background:transparent;color:#b54c3f;text-decoration:underline;cursor:pointer}
.cart-summary,.checkout-order{position:sticky;top:105px;padding:24px;border:1px solid #dce9e6;border-radius:20px;background:#fff}
.cart-summary h2,.checkout-order h2{margin:0 0 20px;color:#173f46}
.cart-summary-line,.cart-total,.checkout-order-item{display:flex;justify-content:space-between;gap:15px;padding:12px 0;border-bottom:1px solid #e5eeec}
.cart-total{margin-top:8px;border-bottom:0;font-size:1.15rem}.cart-note{font-size:.8rem;color:#72817f;line-height:1.5}
.cart-checkout{width:100%;margin-top:15px}.cart-back{display:block;margin-top:15px;text-align:center;color:#0d625c;font-weight:800}
.cart-empty{padding:38px;border:1px solid #dce9e6;border-radius:20px;background:#fff}

.checkout-form{display:grid;gap:16px}
.checkout-block{padding:24px;border:1px solid #dce9e6;border-radius:20px;background:#fff}
.checkout-block h2{margin:0 0 19px;color:#173f46;font-size:1.45rem}
.checkout-fields{display:grid;grid-template-columns:1fr 1fr;gap:13px}
.checkout-fields label,.checkout-block>label{display:block}
.checkout-fields label.wide{grid-column:1/-1}
.checkout-fields span{display:block;margin-bottom:6px;font-size:.76rem;font-weight:900;color:#3c5c59}
.checkout-fields input,.checkout-block textarea{width:100%;padding:12px;border:1px solid #ccddda;border-radius:10px}
.shipping-choice{display:grid;gap:9px}
.shipping-choice label,.payment-option{display:flex !important;gap:10px;align-items:flex-start;padding:15px;border:1px solid #d5e4e1;border-radius:13px}
.shipping-choice span,.payment-option span{display:block}.shipping-choice strong,.payment-option strong{display:block;color:#234c49}.shipping-choice small,.payment-option small{display:block;margin-top:4px;color:#71827f}
.payment-coming{margin-top:10px;padding:15px;border:1px dashed #bccfcb;border-radius:13px;background:#f6f9f8;color:#74827f}
.payment-coming strong,.payment-coming span{display:block}.payment-coming span{font-size:.83rem;margin-top:4px}
.checkout-consent{display:flex;gap:10px;align-items:flex-start;color:#596e6c;font-size:.85rem;line-height:1.5}
.checkout-consent a{color:#0d625c;font-weight:800}.checkout-submit{justify-self:start;padding-left:26px;padding-right:26px}
.hp-field{position:absolute!important;left:-10000px!important}

@media(max-width:980px){
  .shop-hero-grid,.shop-section-head,.cart-layout,.checkout-layout{grid-template-columns:1fr}
  .shop-product-grid{grid-template-columns:1fr}
  .cart-summary,.checkout-order{position:static}
}
@media(max-width:700px){
  .shop-hero,.shop-page-head{padding-top:165px}
  .shop-trust-grid,.checkout-fields{grid-template-columns:1fr}
  .checkout-fields label.wide{grid-column:auto}
  .cart-item{grid-template-columns:1fr}
  .cart-item-controls{flex-wrap:wrap}
  .shop-buy-row{grid-template-columns:1fr}
}

/* ===== V62 · ÁREA DE SOCIOS ===== */
.home-member-area{padding:76px 0;background:#eef8f6;border-top:1px solid #dceae7}.home-member-area-grid{display:grid;grid-template-columns:1fr auto;gap:40px;align-items:center}.home-member-area h2{margin:5px 0 10px;color:#173f46;font-size:clamp(2rem,4vw,3.6rem)}.home-member-area p{max-width:700px;color:#607275;line-height:1.65}.home-member-area-actions{display:flex;gap:12px;flex-wrap:wrap}.member-shell{min-height:100vh;background:#f4f9f8;padding:170px 20px 70px}.member-card{max-width:760px;margin:0 auto;background:#fff;border:1px solid #dce8e6;border-radius:24px;padding:30px;box-shadow:0 18px 48px rgba(19,70,67,.08)}.member-card.wide{max-width:1050px}.member-card h1{margin:6px 0 10px;color:#173f46;font-size:clamp(2.2rem,4vw,4rem)}.member-card p{color:#617476;line-height:1.65}.member-grid{display:grid;grid-template-columns:1fr 1fr;gap:14px}.member-field span{display:block;margin-bottom:6px;font-size:.78rem;font-weight:900;color:#3d5e5b}.member-field input{width:100%;padding:12px;border:1px solid #cbded9;border-radius:10px}.member-actions{display:flex;gap:12px;flex-wrap:wrap;margin-top:20px}.member-link{color:#0d625c;font-weight:800}.member-alert{padding:14px 16px;border-radius:12px;margin:14px 0;background:#eef8f6;color:#315d58}.member-alert.error{background:#fff1ef;color:#93473d}.member-nav{display:flex;gap:10px;flex-wrap:wrap;margin:18px 0 24px}.member-nav a{padding:10px 12px;border-radius:10px;background:#edf6f4;color:#174b48;font-weight:800}.member-panel-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}.member-panel{padding:20px;border:1px solid #dce8e6;border-radius:16px;background:#fff}.member-panel strong{display:block;color:#173f46;margin-bottom:6px}.member-panel span{color:#6b7e7d;font-size:.9rem}.member-table{width:100%;border-collapse:collapse;margin-top:20px}.member-table th,.member-table td{padding:12px;border-bottom:1px solid #e3ecea;text-align:left;vertical-align:top}.status-pill{display:inline-block;padding:6px 9px;border-radius:999px;font-size:.72rem;font-weight:900}.status-pendiente{background:#fff4d8;color:#8b6a18}.status-activo{background:#e0f5ee;color:#236a58}.status-rechazado,.status-bloqueado{background:#fde9e6;color:#9d473c}.admin-actions{display:flex;gap:8px;flex-wrap:wrap}.admin-actions button{padding:8px 10px;border:0;border-radius:8px;font-weight:800;cursor:pointer}.admin-actions .approve{background:#0d625c;color:#fff}.admin-actions .reject{background:#eee;color:#555}@media(max-width:760px){.home-member-area-grid,.member-grid,.member-panel-grid{grid-template-columns:1fr}.member-shell{padding-top:145px}.member-table{display:block;overflow-x:auto}}

/* CIDE · acceso interno discreto */
.cide-internal-access{margin:14px 0 0;text-align:center;font-size:.78rem;opacity:.58}
.cide-internal-access a{color:inherit;text-decoration:none}
.cide-internal-access a:hover{text-decoration:underline;opacity:1}

/* ===== CIDE PORTADA · PARTE BAJA V2 · 2026-09-22 ===== */
.home-v2-kicker{margin:0 0 10px;color:#0e726a;font-size:.72rem;font-weight:900;letter-spacing:.16em}.home-v2-kicker.light{color:#9de8dd}.home-v2-textlink,.home-v2-lightlink{display:inline-block;margin-top:18px;color:#0d625c;font-size:.78rem;font-weight:900;letter-spacing:.06em;text-decoration:none}.home-v2-lightlink{color:#fff}.home-v2-intro{padding:82px 0;background:#fff}.home-v2-intro-grid{display:grid;grid-template-columns:.82fr 1.18fr;gap:70px}.home-v2-intro h2,.home-v2-heading h2,.home-v2-shop h2,.home-v2-news h2{margin:0;color:#173f46;font-size:clamp(2.2rem,4vw,4rem);line-height:1.02}.home-v2-intro-copy p{margin:0;color:#607275;font-size:1.18rem;line-height:1.75}
.home-v2-feature{background:#082f4a;color:#fff}.home-v2-feature-grid{display:grid;grid-template-columns:1.08fr .92fr;min-height:500px}.home-v2-feature-photo{background:linear-gradient(0deg,rgba(4,27,42,.12),rgba(4,27,42,.12)),url('../assets/img/cide-entrega-material-r2.webp') center/cover no-repeat}.home-v2-feature-copy{padding:76px 20px 76px 70px;align-self:center}.home-v2-feature-copy h2,.home-v2-training h2,.home-v2-community h2{margin:0;font-size:clamp(2.2rem,4vw,4rem);line-height:1.02}.home-v2-feature-copy>p:not(.home-v2-kicker),.home-v2-training-copy>p:not(.home-v2-kicker),.home-v2-community-head>p:not(.home-v2-kicker){color:rgba(255,255,255,.72);line-height:1.75}
.home-v2-areas,.home-v2-projects,.home-v2-shop,.home-v2-news{padding:88px 0;background:#fff}.home-v2-heading{max-width:760px;margin-bottom:36px}.home-v2-heading>p:last-child{color:#6b7d7e}.home-v2-heading-row{max-width:none;display:flex;align-items:end;justify-content:space-between;gap:30px}.home-v2-area-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:16px}.home-v2-area{padding:28px 24px;border-top:3px solid #d6e2e0;background:#f5f8f8;color:inherit;text-decoration:none;transition:.2s}.home-v2-area:hover{transform:translateY(-3px);border-color:#f28c18}.home-v2-area span{color:#0e726a;font-size:.72rem;font-weight:900}.home-v2-area h3{margin:12px 0 8px;color:#173f46;font-size:1.45rem}.home-v2-area p{min-height:70px;color:#687a7b;line-height:1.55}.home-v2-area b{color:#0d625c;font-size:.76rem}
.home-v2-projects{background:#f3f7f6}.home-v2-project-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}.home-v2-project{position:relative;display:flex;align-items:end;min-height:390px;overflow:hidden;border-radius:22px;background-position:center;background-size:cover;color:#fff;text-decoration:none}.home-v2-project:after{content:'';position:absolute;inset:30% 0 0;background:linear-gradient(transparent,rgba(4,24,37,.94))}.home-v2-project>div{position:relative;z-index:1;padding:28px}.home-v2-project small{font-weight:900;letter-spacing:.1em}.home-v2-project h3{margin:9px 0 6px;font-size:1.6rem}.home-v2-project p{margin:0;color:rgba(255,255,255,.72)}.home-v2-project.p-rd{background-image:url('../assets/img/proj-2022-rd-bomberos-r2.webp')}.home-v2-project.p-py{background-image:url('../assets/img/coop-2022-paraguay-camion-frontal-r2.webp')}.home-v2-project.p-va{background-image:url('../assets/img/proj-valencia-bomberos-r2.webp')}
.home-v2-training{padding:88px 0;background:#0b3f5d;color:#fff}.home-v2-training-grid{display:grid;grid-template-columns:.8fr 1.2fr;gap:60px;align-items:center}.home-v2-training-copy .btn{margin-top:16px}.home-v2-access-grid{display:grid;grid-template-columns:1fr 1fr;gap:16px}.home-v2-access{padding:30px;border:1px solid rgba(255,255,255,.18);border-radius:20px;background:rgba(255,255,255,.07);color:#fff;text-decoration:none}.home-v2-access span,.home-v2-community-grid span{font-size:.68rem;font-weight:900;letter-spacing:.12em;color:#9de8dd}.home-v2-access h3{margin:10px 0;font-size:1.65rem}.home-v2-access p{min-height:80px;color:rgba(255,255,255,.68);line-height:1.55}.home-v2-access b{font-size:.75rem}
.home-v2-shop-grid{display:grid;grid-template-columns:.8fr 1.2fr;gap:60px;align-items:center}.home-v2-shop p{color:#657879;line-height:1.65}.home-v2-shop .btn{margin-top:12px}.home-v2-shop-items{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}.home-v2-shop-items div{min-height:160px;padding:22px;border-radius:18px;background:linear-gradient(145deg,#eef5f3,#dceae7);display:flex;flex-direction:column;justify-content:end}.home-v2-shop-items strong{color:#173f46}.home-v2-shop-items span{margin-top:4px;color:#6d7e7d;font-size:.8rem}
.home-v2-community{padding:88px 0;background:#082f4a;color:#fff}.home-v2-community-head{max-width:760px;margin-bottom:32px}.home-v2-community-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:14px}.home-v2-community-grid>a{padding:26px 22px;border-top:2px solid rgba(255,255,255,.22);background:rgba(255,255,255,.05);color:#fff;text-decoration:none}.home-v2-community-grid h3{margin:10px 0 8px;font-size:1.35rem}.home-v2-community-grid p{min-height:72px;color:rgba(255,255,255,.65);line-height:1.5}.home-v2-community-grid b{font-size:.72rem}.home-v2-news{background:#f3f7f6}.home-v2-news-grid{display:grid;grid-template-columns:1fr auto;gap:50px;align-items:center}.home-v2-news p{color:#657879}.home-v2-news-actions{display:flex;align-items:center;gap:22px;flex-wrap:wrap}.home-v2-news-actions .home-v2-textlink{margin:0}
@media(max-width:900px){.home-v2-intro-grid,.home-v2-feature-grid,.home-v2-training-grid,.home-v2-shop-grid,.home-v2-news-grid{grid-template-columns:1fr}.home-v2-feature-photo{min-height:360px}.home-v2-feature-copy{padding:55px 0}.home-v2-area-grid,.home-v2-community-grid{grid-template-columns:1fr 1fr}.home-v2-project-grid{grid-template-columns:1fr}.home-v2-project{min-height:330px}.home-v2-news-actions{justify-content:flex-start}}
@media(max-width:620px){.home-v2-intro,.home-v2-areas,.home-v2-projects,.home-v2-training,.home-v2-shop,.home-v2-community,.home-v2-news{padding:58px 0}.home-v2-intro-grid{gap:28px}.home-v2-area-grid,.home-v2-access-grid,.home-v2-shop-items,.home-v2-community-grid{grid-template-columns:1fr}.home-v2-heading-row{align-items:start;flex-direction:column}.home-v2-area p,.home-v2-access p,.home-v2-community-grid p{min-height:0}.home-v2-feature-photo{min-height:280px}.home-v2-feature-copy{padding:44px 0}}


/* ===== CIDE revisión 2026-09-23: navegación y accesibilidad ===== */
/* Logo íntegro dentro de la cabecera: conserva 205px/135px y su fotografía.
   El margen negativo anterior lo sacaba del viewport. Heroes sin cambios. */
.logo-placeholder.logo-real { margin-left: 0 !important; }
@media (max-width: 1240px) {
  .menu-toggle {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 44px;
    padding: 10px 14px;
    border: 1px solid rgba(255,255,255,.6);
    border-radius: 999px;
    background: #08253d;
    color: #fff;
    font-weight: 700;
    cursor: pointer;
  }
  .main-nav {
    position: absolute !important;
    top: 100% !important;
    left: 20px;
    right: 20px;
    display: none;
    flex-direction: column;
    align-items: stretch;
    gap: 0 !important;
    padding: 16px;
    border-radius: 16px;
    background: #061c2f;
    color: #fff;
    font-size: 1rem !important;
    max-height: max(12rem, calc(100vh - 250px));
    max-height: max(12rem, calc(100dvh - 250px));
    overflow-y: auto;
  }
  .main-nav.is-open { display: flex; }
  .main-nav a { padding: 12px 8px !important; min-height: 44px; }
}
@media (max-width: 800px) {
  .main-nav {
    max-height: max(12rem, calc(100vh - 171px));
    max-height: max(12rem, calc(100dvh - 171px));
  }
}

/* Texto secundario oscuro: supera 4,5:1 en los fondos claros existentes. */
body .home-v2-area p,
body .home-v2-heading > p:last-child,
body .home-v2-shop-items span,
body .cart-note,
body .payment-coming,
body .shipping-choice small { color: #526461; }

/* Dos colores mantienen el foco reconocible en fondos claros y oscuros. */
body :is(a, button, input, select, textarea, summary):focus-visible {
  outline: 3px solid #08253d;
  outline-offset: 3px;
  box-shadow: 0 0 0 6px #fff;
}
.skip-link {
  position: fixed;
  z-index: 1000;
  top: 12px;
  left: 12px;
  padding: 12px 18px;
  background: #fff;
  color: #08253d;
  font-weight: 700;
  text-decoration: underline;
  transform: translateY(calc(-100% - 24px));
}
.skip-link:focus { transform: translateY(0); }

/* CIDE 24/09/2026: cabecera móvil más compacta. Mantiene todos los enlaces. */
@media (max-width: 800px) {
  .logo-placeholder.logo-real {
    width: 116px !important;
    height: 116px !important;
    min-width: 116px !important;
    margin-top: 12px !important;
  }
  .logo-placeholder.logo-real img {
    width: 116px !important;
    height: 116px !important;
  }
  .main-nav {
    padding: 10px !important;
  }
  .main-nav a {
    min-height: 42px;
    padding: 9px 8px !important;
  }
}

/* CIDE R2 20260925: narrow-screen grid may shrink without changing the home. */
@media (max-width: 420px) {
  .about-hero-inner { grid-template-columns: minmax(0, 1fr); }
  .about-hero-copy, .about-hero-note { min-width: 0; max-width: 100%; }
  .about-hero h1 { font-size: clamp(2.5rem, 11vw, 3.2rem); overflow-wrap: break-word; }
}

/* ===== CIDE · MÓVIL CONSOLIDADO FINAL · 2026-09-28 =====
   Un único sistema móvil para la portada.
   Activo hasta 900px: cubre 411x814 y 814x411.
   Escritorio comienza en 901px. */
.mobile-brand{display:none}

@media (max-width:900px){
  .site-header{
    position:absolute!important;inset:0 0 auto 0!important;
    min-height:104px!important;background:#06283e!important;
    box-shadow:0 2px 14px rgba(0,0,0,.18)!important;
  }
  .header-inner{
    width:100%!important;min-height:104px!important;padding:10px 14px!important;
    align-items:center!important;gap:10px!important;
  }
  .brand{min-width:0!important;flex:1 1 auto!important}
  .brand-desktop-logo{display:none!important}
  .mobile-brand{display:flex!important;align-items:center!important;gap:10px!important;min-width:0!important}
  .mobile-brand-logo{display:block!important;flex:0 0 72px!important;width:72px!important;height:72px!important;object-fit:contain!important}
  .mobile-brand-copy{display:block!important;min-width:0!important;color:#fff!important;text-transform:uppercase!important}
  .mobile-brand-copy strong{display:block!important;margin:0 0 2px!important;font-size:1.75rem!important;line-height:.92!important;letter-spacing:.02em!important;font-weight:900!important}
  .mobile-brand-copy span{display:block!important;max-width:220px!important;font-size:.66rem!important;line-height:1.12!important;letter-spacing:.025em!important;font-weight:800!important}
  .menu-toggle{
    display:inline-flex!important;align-items:center!important;justify-content:center!important;
    flex:0 0 auto!important;margin:0!important;min-width:68px!important;min-height:46px!important;
    padding:0 12px!important;border:1px solid rgba(255,255,255,.72)!important;border-radius:12px!important;
    background:rgba(255,255,255,.06)!important;color:#fff!important;font-size:.8rem!important;font-weight:900!important;
    box-shadow:none!important;backdrop-filter:none!important;
  }
  .main-nav{
    top:98px!important;left:10px!important;right:10px!important;max-height:calc(100dvh - 112px)!important;
    padding:12px!important;border-radius:16px!important;background:#061c2f!important;z-index:100!important;
  }

  .hero{
    position:relative!important;min-height:0!important;height:auto!important;display:block!important;
    padding:104px 0 0!important;overflow:hidden!important;background:#06283e!important;
  }
  .hero::before,.hero::after,.hero-rescue-inset{display:none!important}
  .hero-photo-cut{
    position:relative!important;inset:auto!important;display:block!important;width:100%!important;height:auto!important;
    aspect-ratio:9 / 13.2!important;clip-path:none!important;
    background-image:url("../assets/img/portada-cide-rescate-mobile.webp")!important;
    background-size:cover!important;background-position:center 42%!important;background-repeat:no-repeat!important;opacity:1!important;
  }
  .hero-overlay{
    position:absolute!important;left:0!important;right:0!important;top:104px!important;
    height:calc((100vw * 13.2) / 9)!important;max-height:none!important;
    background:linear-gradient(180deg,transparent 54%,rgba(3,22,35,.12) 67%,rgba(6,40,62,.96) 100%)!important;
    z-index:1!important;pointer-events:none!important;
  }
  .hero-content{
    position:relative!important;z-index:3!important;width:100%!important;max-width:none!important;margin:0!important;
    padding:22px 18px 26px!important;border-radius:0!important;background:#06283e!important;box-shadow:none!important;
  }
  .ong-fullname{display:none!important}
  .hero-slogan{
    display:block!important;max-width:none!important;margin:0 0 18px!important;color:#72dfcf!important;
    font-size:clamp(1.45rem,6.3vw,1.9rem)!important;line-height:1.05!important;letter-spacing:-.02em!important;
    text-align:center!important;text-shadow:none!important;
  }
  .hero-slogan br{display:none!important}
  .hero-actions{display:grid!important;grid-template-columns:1fr 1fr!important;gap:10px!important;margin:0!important}
  .hero-actions .btn{
    width:100%!important;min-height:52px!important;margin:0!important;padding:0 12px!important;border-radius:14px!important;
    font-size:.79rem!important;letter-spacing:.01em!important;white-space:nowrap!important;box-shadow:none!important;
  }
  .hero-actions .btn-know{border:1px solid rgba(255,255,255,.9)!important;background:#073a55!important}
  .hero-actions .btn-know::before{width:4px!important}
  .hero-actions .btn-socio{background:linear-gradient(135deg,#0d5d57,#168c82)!important}
  .hero-actions .btn-donate{
    grid-column:1/-1!important;min-height:56px!important;border:1px solid #fff3df!important;border-radius:14px!important;
    background:linear-gradient(135deg,#ec642f,#cf3428)!important;font-size:.88rem!important;
  }

  .home-v2-intro,.home-v2-areas,.home-v2-projects,.home-v2-training,.home-v2-shop,.home-v2-community,.home-v2-news{padding:44px 0!important}
  .home-v2-intro-grid,.home-v2-feature-grid,.home-v2-training-grid,.home-v2-shop-grid,.home-v2-news-grid{grid-template-columns:minmax(0,1fr)!important;gap:24px!important}
  .home-v2-intro h2,.home-v2-heading h2,.home-v2-shop h2,.home-v2-news h2,.home-v2-feature-copy h2,.home-v2-training h2,.home-v2-community h2{
    font-size:clamp(1.85rem,8.4vw,2.42rem)!important;line-height:1.04!important;
  }
  .home-v2-intro-copy p{font-size:1rem!important;line-height:1.62!important}
  .home-v2-feature-grid{min-height:0!important}
  .home-v2-feature-photo{min-height:0!important;aspect-ratio:4/3!important;background-position:center!important}
  .home-v2-feature-copy{padding:30px 18px 36px!important}
  .home-v2-area-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:10px!important}
  .home-v2-area{min-width:0!important;padding:18px 14px!important;border-radius:12px!important}
  .home-v2-area h3{margin:8px 0 0!important;font-size:1.05rem!important}
  .home-v2-area p{display:none!important}.home-v2-area b{display:inline-block!important;margin-top:11px!important}
  .home-v2-project-grid{grid-template-columns:1fr!important;gap:14px!important}
  .home-v2-project{min-height:300px!important;border-radius:16px!important}
  .home-v2-access-grid,.home-v2-shop-items{grid-template-columns:1fr!important;gap:12px!important}
  .home-v2-community-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:10px!important}
  .home-v2-community-grid>a{padding:18px 14px!important}.home-v2-community-grid p{display:none!important}
}

/* Teléfono horizontal: misma identidad móvil, composición apaisada. */
@media (min-width:701px) and (max-width:900px) and (orientation:landscape){
  .site-header{min-height:86px!important}
  .header-inner{min-height:86px!important;padding:7px 16px!important}
  .mobile-brand-logo{flex-basis:62px!important;width:62px!important;height:62px!important}
  .mobile-brand-copy strong{font-size:1.45rem!important}
  .mobile-brand-copy span{font-size:.58rem!important}
  .main-nav{top:82px!important;max-height:calc(100dvh - 94px)!important}

  .hero{
    display:grid!important;grid-template-columns:minmax(0,1.18fr) minmax(300px,.82fr)!important;
    padding:86px 0 0!important;min-height:100dvh!important;
  }
  .hero-photo-cut{
    height:calc(100dvh - 86px)!important;min-height:325px!important;aspect-ratio:auto!important;
    background-position:center 43%!important;
  }
  .hero-overlay{display:none!important}
  .hero-content{
    display:flex!important;flex-direction:column!important;justify-content:center!important;
    padding:22px!important;min-height:calc(100dvh - 86px)!important;
  }
  .hero-slogan{font-size:1.55rem!important;text-align:left!important;margin-bottom:18px!important}
  .hero-actions{grid-template-columns:1fr!important}
  .hero-actions .btn-donate{grid-column:auto!important}
}

@media(max-width:390px){
  .mobile-brand-logo{flex-basis:64px!important;width:64px!important;height:64px!important}
  .mobile-brand-copy strong{font-size:1.5rem!important}
  .mobile-brand-copy span{font-size:.59rem!important}
  .menu-toggle{min-width:62px!important;padding:0 9px!important}
}
@media(max-width:350px){
  .hero-actions,.home-v2-area-grid,.home-v2-community-grid{grid-template-columns:1fr!important}
  .hero-actions .btn-donate{grid-column:auto!important}
}