/* ════════════════════════════════════════
   CEDELEF INNER — Estilos páginas internas
════════════════════════════════════════ */

/* ── Hero reducido ── */
.inner-hero-main {
  position: relative; z-index: 3;
  display: flex; flex-direction: column;
  align-items: center; justify-content: center;
  gap: 8px; padding: 0 30px;
  text-align: center;
}
/* El "sangrado" hacia la izquierda solo cabe en pantallas anchas; por
   debajo de 1300px empuja el logo fuera del viewport (queda cortado,
   ver .inner-hero{overflow:hidden}) */
@media (min-width: 1300px) {
  .inner-hero-main { margin-left: -200px }
}
.inner-hero-text { display: flex; flex-direction: column; align-items: center; gap: 4px; text-align: center }
.inner-hero-art img { width: 95px; height: auto }
.hero-titulo { margin: 0 auto !important }
.inner-hero-main .hero-titulo .xii,
.inner-hero-main .hero-titulo .cedelef { font-size: clamp(16px,4vw,22px) }
.inner-hero-main .hero-convencion { font-size: clamp(9px,1.1vw,14px); letter-spacing: 1px; margin: 0; padding: 0 }
.inner-hero-main .hero-cusco-text { font-size: 12px; letter-spacing: 2px }
.inner-hero-main .hero-cusco-line-img { height: 10px; max-width: 32px }
.inner-hero-main .hero-meta { gap: 16px }
.inner-hero-main .hero-meta-icon-img { width: 28px; height: 28px }
.inner-hero-main .hero-meta-vline { height: 28px }
.inner-hero-main .hero-meta-top { font-size: 12px }
.inner-hero-main .hero-meta-bot { font-size: 10px }

/* ── Inner Hero ── */
.inner-hero {
  position: relative;
  height: 38vh; min-height: 280px; max-height: 380px;
  display: flex; align-items: center;
  overflow: hidden; padding-top: var(--nav-h); z-index: 1;
}
.inner-hero-bg { position: absolute; inset: 0; background: url('source/sede_cusco_foto03.jpg') center 30% / cover no-repeat; animation: subtle-zoom 18s ease-out forwards }
.inner-hero-grad { position: absolute; inset: 0; background: linear-gradient(to right, rgba(0,27,68,0.97) 0%, rgba(0,27,68,0.92) 40%, rgba(0,27,68,0.55) 65%, rgba(0,27,68,0.10) 85%, transparent 100%) }
.inner-hero-grad2 { position: absolute; inset: 0; background: radial-gradient(ellipse 45% 40% at 100% 0%, rgba(0,27,68,0.55) 0%, transparent 100%), linear-gradient(to top, rgba(0,27,68,0.85) 0%, transparent 50%) }
.inner-hero-deco-izq { position: absolute; left: 0; top: 50%; transform: translateY(-50%); height: 60%; width: auto; object-fit: contain; z-index: 2; pointer-events: none }
.inner-hero-deco-tr { position: absolute; top: calc(var(--nav-h) + 10px); right: 0; width: 140px; height: auto; object-fit: contain; z-index: 2; pointer-events: none; opacity: 0.45 }
.inner-hero-row { position: relative; z-index: 3; width: 100%; max-width: 960px; margin: 0 auto; padding: 0 32px; display: flex; flex-direction: row; align-items: center; gap: 48px }
.inner-hero-content { flex: 1; position: relative; z-index: 3; padding: 0 }
.inner-hero-eyebrow { font-family: var(--font-cuerpo); font-size: 10px; font-weight: 700; letter-spacing: 4px; text-transform: uppercase; color: var(--dorado); display: flex; align-items: center; gap: 10px; margin-bottom: 10px }
.inner-hero-eyebrow::before { content: ''; height: 1px; width: 32px; background: var(--dorado); opacity: 0.6 }
.inner-hero-title { font-family: var(--font-principal); font-weight: 700; font-stretch: condensed; font-size: clamp(28px,5vw,58px); color: var(--blanco); text-transform: uppercase; letter-spacing: 2px; line-height: 0.95; margin-bottom: 12px }
.inner-hero-title span { color: var(--dorado) }
.inner-hero-sub { font-family: var(--font-aditional); font-size: 17px; color: rgba(255,255,255,0.6); max-width: 540px; line-height: 1.55 }
.inner-hero-divider { height: 4px; background: var(--azul); display: block; position: relative; z-index: 1; margin: 8px 15px }

/* ── Inner Body ── */
.inner-body { position: relative; background: #fff; z-index: 1 }
.inner-deco-corner-tr { position: absolute; top: 0; right: 0; width: 140px; height: 140px; object-fit: contain; pointer-events: none; z-index: 2; opacity: 0.9 }
.inner-deco-corner-bl { position: absolute; bottom: 0; left: -20px; width: 140px; height: 140px; object-fit: contain; pointer-events: none; z-index: 2; opacity: 0.9 }

/* ── Títulos de sección ── */
.sec-title { text-align: center; font-family: var(--font-principal); font-weight: 700; font-stretch: condensed; font-size: clamp(22px,3.5vw,40px); text-transform: uppercase; letter-spacing: 2px; color: var(--azul); margin-bottom: 8px }
.sec-title .hl-dorado { color: var(--dorado) }
.sec-title .hl-verde  { color: var(--verde) }
.sec-subtitle { text-align: center; font-family: var(--font-cuerpo); font-size: 22px; color: rgba(0,27,68,0.45); margin-bottom: 48px; line-height: 1.6 }
.sec-divider { height: 4px; background: var(--azul); margin: 0 15px; display: block }

/* ── Bloques con sello de agua ── */
.bloque-inner { position: relative; overflow: hidden; padding: 64px 0 56px }
.bloque-inner::before { content: ''; position: absolute; top: 50%; left: 50%; transform: translate(-50%,-50%); width: 460px; height: 460px; background: url('source/logo-cedelef.svg') center / contain no-repeat; opacity: 0.08; filter: grayscale(100%); pointer-events: none; z-index: 0 }
.bloque-inner > * { position: relative; z-index: 1 }
.bloque-inner.bg-blanco { background: #fff }
.bloque-inner.bg-gris   { background: var(--gris) }
.bloque-inner.bg-azul   { background: var(--azul) }
.bloque-inner.bg-azul::before { opacity: 0.05 }

/* ── CTA final ── */
.bloque-cta { background: var(--azul); padding: 64px 0; text-align: center; position: relative; overflow: hidden }
.bloque-cta::before { content: ''; position: absolute; top: 50%; left: 50%; transform: translate(-50%,-50%); width: 460px; height: 460px; background: url('source/logo-cedelef.svg') center / contain no-repeat; opacity: 0.05; filter: grayscale(100%); pointer-events: none }
.cta-title { font-family: var(--font-principal); font-weight: 700; font-stretch: condensed; font-size: clamp(24px,4vw,48px); text-transform: uppercase; letter-spacing: 2px; color: var(--blanco); margin-bottom: 14px; position: relative; z-index: 1 }
.cta-title span { color: var(--dorado) }
.cta-body { font-size: 18px; color: rgba(255,255,255,0.5); max-width: 500px; margin: 0 auto 32px; line-height: 1.6; position: relative; z-index: 1 }
.cta-btns { display: flex; align-items: center; justify-content: center; gap: 16px; flex-wrap: wrap; position: relative; z-index: 1 }
.btn-cta-prim { display: inline-flex; align-items: center; gap: 8px; padding: 13px 30px; font-family: var(--font-principal); font-weight: 700; font-stretch: condensed; font-size: 16px; letter-spacing: 1px; text-transform: uppercase; text-decoration: none; background: var(--dorado); color: var(--azul); border: 2px solid var(--dorado); box-shadow: 0 4px 20px rgba(224,189,11,0.3); transition: all .25s }
.btn-cta-prim:hover { background: #c9aa09; border-color: #c9aa09; transform: translateY(-2px) }
.btn-cta-sec { display: inline-flex; align-items: center; gap: 8px; padding: 13px 30px; font-family: var(--font-principal); font-weight: 700; font-stretch: condensed; font-size: 16px; letter-spacing: 1px; text-transform: uppercase; text-decoration: none; background: transparent; color: rgba(255,255,255,0.7); border: 2px solid rgba(255,255,255,0.2); transition: all .25s }
.btn-cta-sec:hover { border-color: rgba(255,255,255,0.5); color: #fff }

/* ════════════════════════════════════════
   AUSPICIO — Bloques
════════════════════════════════════════ */
.bloque-categorias  { background: #fff; position: relative; overflow: hidden; padding: 64px 0 56px }
.bloque-categorias::before { content: ''; position: absolute; top: 50%; left: 50%; transform: translate(-50%,-50%); width: 480px; height: 480px; background: url('source/logo-cedelef.svg') center / contain no-repeat; opacity: 0.08; filter: grayscale(100%); pointer-events: none; z-index: 0 }
.bloque-categorias > * { position: relative; z-index: 1 }
.bloque-tabla { background: var(--gris); position: relative; overflow: hidden; padding: 64px 0 56px }
.bloque-tabla::before { content: ''; position: absolute; top: 50%; left: 50%; transform: translate(-50%,-50%); width: 420px; height: 420px; background: url('source/logo-cedelef.svg') center / contain no-repeat; opacity: 0.08; filter: grayscale(100%); pointer-events: none; z-index: 0 }
.bloque-tabla > * { position: relative; z-index: 1 }
.bloque-adicionales { background: #fff; position: relative; overflow: hidden; padding: 64px 0 56px }
.bloque-adicionales::before { content: ''; position: absolute; top: 50%; left: 50%; transform: translate(-50%,-50%); width: 420px; height: 420px; background: url('source/logo-cedelef.svg') center / contain no-repeat; opacity: 0.08; filter: grayscale(100%); pointer-events: none; z-index: 0 }
.bloque-adicionales > * { position: relative; z-index: 1 }
.categorias-grid { display: flex; flex-direction: column; gap: 24px }

/* ════════════════════════════════════════
   CAT-CARD-OUTER — Variables de color
════════════════════════════════════════ */
.cat-card-outer.inti      { --color-cat: var(--dorado); --shadow-cat: rgba(224,189,11,0.6) }
.cat-card-outer.illapa    { --color-cat: var(--verde);  --shadow-cat: rgba(58,148,164,0.6) }
.cat-card-outer.pachamama { --color-cat: var(--azul);   --shadow-cat: rgba(0,27,68,0.5) }
.cat-card-outer { position: relative; isolation: isolate }

.cat-card-outer .deco-v-izq { position: absolute; left: 0; top: 0; width: 2px; height: 100%; background: var(--color-cat); box-shadow: 0 0 4px var(--shadow-cat), 2px 0 4px rgba(0,0,0,0.2); z-index: 10 }
.cat-card-outer .deco-v-izq::before { content: ''; position: absolute; top: -6px; left: 50%; transform: translateX(-50%); width: 11px; height: 11px; border-radius: 50%; background: var(--color-cat); box-shadow: 0 0 6px var(--shadow-cat) }
.cat-card-outer .deco-h-inf { position: absolute; left: 0; bottom: 0; width: 100%; height: 2px; background: var(--color-cat); box-shadow: 0 0 4px var(--shadow-cat), 0 2px 4px rgba(0,0,0,0.2); z-index: 10 }
.cat-card-outer .deco-h-inf::after { content: ''; position: absolute; right: -6px; top: 50%; transform: translateY(-50%); width: 11px; height: 11px; border-radius: 50%; background: var(--color-cat); box-shadow: 0 0 6px var(--shadow-cat) }
.cat-card-outer .deco-h-sup { position: absolute; top: -1px; right: 0; width: 50%; height: 1px; background: var(--color-cat); box-shadow: 0 0 4px var(--shadow-cat); z-index: 10 }
.cat-card-outer .deco-h-sup::after { content: ''; position: absolute; left: 0; top: 50%; transform: translate(-50%,-50%); width: 11px; height: 11px; border-radius: 50%; border: 1px solid var(--color-cat); background: #fff; box-shadow: 0 0 4px var(--shadow-cat) }
.cat-card-outer .deco-v-der { position: absolute; top: 0; right: -1px; height: 50%; width: 1px; background: var(--color-cat); box-shadow: 0 0 4px var(--shadow-cat); z-index: 10 }
.cat-card-outer .deco-v-der::after { content: ''; position: absolute; bottom: -6px; left: 50%; transform: translateX(-50%); width: 11px; height: 11px; border-radius: 50%; border: 1px solid var(--color-cat); background: #fff; box-shadow: 0 0 4px var(--shadow-cat) }

/* ── cat-card base ── */
.cat-card { display: grid; grid-template-columns: 280px 1fr; grid-template-rows: auto auto; overflow: hidden; box-shadow: 0 4px 24px rgba(0,27,68,0.10); transition: transform .3s, box-shadow .3s; background: #fff; border-left: 4px solid var(--color-cat); position: relative; z-index: 1 }
.cat-card:hover { transform: translateY(-3px); box-shadow: 0 16px 48px rgba(0,27,68,0.16) }
.cat-card-header {
  grid-column: 1; grid-row: 1 / 3;
  background: var(--azul); padding: 28px 24px;
  position: relative; overflow: hidden;
  display: flex; flex-direction: column;
  align-items: center;       /* ← centra horizontalmente */
  justify-content: flex-start; /* ← pega arriba */
  gap: 12px;
}

.cat-card-header::after { content: ''; position: absolute; bottom: -30px; right: -30px; width: 120px; height: 120px; border-radius: 50%; opacity: 0.12; background: var(--color-cat) }
.cat-header-img { width: 240px; height:240px; object-fit: contain; display: block; margin-bottom: 12px }
.cat-badge { display: inline-flex; align-items: center; gap: 6px; padding: 3px 10px; border-radius: 20px; font-size: 9px; font-weight: 700; letter-spacing: 2px; text-transform: uppercase; margin-bottom: 12px; font-family: var(--font-cuerpo); align-self: flex-start; background: rgba(255,255,255,0.1); color: var(--color-cat); border: 1px solid rgba(255,255,255,0.2) }
.cat-nombre { font-family: var(--font-principal); font-weight: 700; font-stretch: condensed; font-size: 42px; text-transform: uppercase; letter-spacing: 3px; line-height: 1; display: block; color: var(--color-cat) }
.cat-card.pachamama .cat-nombre { color: rgba(255,255,255,0.65) }
.cat-slogan { font-size: 12px; color: rgba(255,255,255,0.4); margin-top: 8px; line-height: 1.5; font-style: italic }

/* ── cat-body base ── */
.cat-body { grid-column: 2; grid-row: 1; padding: 20px 28px; border-bottom: 1px solid rgba(0,0,0,0.06) }
.cat-desc { font-size: 14px; line-height: 1.7; color: var(--texto); margin-bottom: 12px }
.cat-benefits { list-style: none; display: flex; flex-direction: column }
.cat-benefits li { display: flex; align-items: flex-start; gap: 8px; font-size: 22px; color: var(--texto); line-height: 1.4; padding: 4px 0; border-bottom: 1px solid rgba(0,0,0,0.04) }
.cat-benefits li:last-child { border-bottom: none }
.cat-benefit-dot { width: 7px; height: 7px; border-radius: 50%; flex-shrink: 0; margin-top: 4px; background: var(--color-cat) }

/* ── foto de portada (hoteles, lado izquierdo de la tarjeta) ── */
.cat-card-header.hotel-photo .cat-nombre,
.cat-card-header.hotel-photo .cat-slogan { text-shadow: 0 1px 6px rgba(0,0,0,0.5) }

/* ── nota informativa (hoteles, sobre fondo claro) ── */
.hoteles-nota-card {
  display: flex; align-items: center; gap: 16px;
  background: rgba(0,27,68,0.04); border: 1px solid rgba(0,27,68,0.08);
  border-left: 3px solid var(--verde); padding: 16px 20px; width: 100%;
}
.hoteles-nota-icon  { font-size: 24px; flex-shrink: 0 }
.hoteles-nota-texto { display: flex; flex-direction: column; gap: 3px; text-align: left }
.hoteles-nota-label {
  font-size: 9px; font-weight: 700; letter-spacing: 2px; text-transform: uppercase;
  color: var(--verde); font-family: var(--font-cuerpo);
}
.hoteles-nota-valor {
  font-family: var(--font-cuerpo); font-weight: 500;
  font-size: 15px; letter-spacing: 0.2px; color: var(--texto); line-height: 1.5;
}

/* ── nota de convenio (hoteles) ── */
.hotel-convenio-nota { margin-top: 14px; padding: 12px 16px; background: rgba(0,27,68,0.04); border-left: 3px solid var(--color-cat); font-family: var(--font-cuerpo); font-size: 14px; line-height: 1.6; color: var(--texto) }
.hotel-convenio-nota strong { color: var(--color-cat) }

/* ── etiqueta de estrellas (hoteles) ──
   Sobre la foto (col. izquierda): fondo dorado translúcido, para que
   se note pero deje ver la imagen detrás.
   Junto al nombre (col. derecha, fondo blanco): dorado sólido, porque
   ahí no hay nada detrás que se necesite dejar ver. ── */
.hotel-stars {
  display: inline-flex; align-items: center; gap: 6px; padding: 4px 10px;
  border-radius: 20px; background: rgba(224,189,11,0.32); border: 1px solid rgba(224,189,11,0.6);
  backdrop-filter: blur(2px);
  box-shadow: 0 2px 6px rgba(0,0,0,0.25); align-self: flex-start; margin-bottom: 6px;
}
.hotel-stars-icons { color: #F4D35E; font-size: 13px; letter-spacing: 1px; line-height: 1 }
.hotel-stars-icons .off { color: rgba(255,255,255,0.35) }
.hotel-stars-label { font-family: var(--font-cuerpo); font-size: 10px; font-weight: 700; letter-spacing: 1.5px; text-transform: uppercase; color: #fff; line-height: 1 }

/* Segunda etiqueta de estrellas, junto al nombre del hotel (columna derecha,
   sobre fondo blanco): fondo dorado sólido y texto/estrellas en azul. */
.cat-titulo-row { display: flex; align-items: flex-start; justify-content: space-between; gap: 12px; flex-wrap: wrap }
.cat-titulo-row .cat-titulo { flex: 1 1 auto; margin-bottom: 0 }
.cat-titulo-row .hotel-stars {
  margin-bottom: 0; margin-top: 2px; flex-shrink: 0; box-shadow: none; backdrop-filter: none;
  background: var(--dorado); border-color: rgba(0,27,68,0.15);
}
.cat-titulo-row .hotel-stars-icons { color: var(--azul) }
.cat-titulo-row .hotel-stars-icons .off { color: rgba(0,27,68,0.35) }
.cat-titulo-row .hotel-stars-label { color: var(--azul) }
/* Sobre la foto (col. izquierda): solo texto, sin gráfico de estrellas.
   Junto al nombre (col. derecha): solo gráfico, sin texto. */
.cat-card-header .hotel-stars-icons { display: none }
.cat-titulo-row .hotel-stars-label { display: none }
/* Al quitar el gráfico, la etiqueta de texto se reubica como badge flotante
   en la esquina superior derecha de la foto, en vez de apilarse en el flujo
   vertical y empujar hacia abajo el nombre del hotel. */
.cat-card-header .hotel-stars {
  position: absolute; top: 14px; right: 14px; margin: 0; z-index: 2;
  padding: 5px 12px;
}
.hotel-icon-header { width: 46px; height: 46px; border-radius: 50%; background: rgba(255,255,255,0.14); display: flex; align-items: center; justify-content: center; font-size: 22px; margin-bottom: 2px }

/* ── hoteles: una columna, tarjetas comprimidas en espacios (paddings/márgenes), casi sin tocar el tamaño de letra ── */
#hoteles-lista .categorias-grid { display: flex; flex-direction: column; gap: 16px }
#hoteles-lista .cat-card.has-main { grid-template-columns: 210px 1fr; min-height: 0 }
#hoteles-lista .cat-card-header { padding: 16px 18px; gap: 5px }
#hoteles-lista .cat-slogan { font-size: 12px; margin-top: 2px; line-height: 1.3 }
#hoteles-lista .cat-card.has-main .cat-main { padding: 14px 22px; gap: 8px }
#hoteles-lista .cat-titulo { font-size: 1.7rem; margin-bottom: 0 }
#hoteles-lista .cat-subtitle { font-size: 18px; padding-left: 10px; margin-bottom: 2px; line-height: 1.35 }
#hoteles-lista .cat-benefits li { font-size: 17px; padding: 3px 0; gap: 7px; line-height: 1.35 }
#hoteles-lista .cat-benefit-dot { width: 6px; height: 6px; margin-top: 6px }
#hoteles-lista .hotel-convenio-nota { margin-top: 6px; padding: 8px 14px; font-size: 13.5px; line-height: 1.4 }

@media (max-width: 640px) {
  #hoteles-lista .cat-card.has-main { grid-template-columns: 1fr; grid-template-rows: auto auto }
  #hoteles-lista .cat-card-header { grid-column: 1; grid-row: 1 }
  #hoteles-lista .cat-card.has-main .cat-main { grid-column: 1; grid-row: 2 }
}

/* ── cat-precio base ── */
.cat-precio { grid-column: 2; grid-row: 2; margin: 20px; padding: 4px 8px 16px; border-bottom: 1px solid rgba(0,0,0,0.06); background: #fff; display: flex; align-items: baseline; gap: 16px; flex-wrap: wrap }
.cat-precio-soles { font-family: var(--font-principal); font-weight: 700; font-stretch: condensed; font-size: 42px; line-height: 1; display: block; color: var(--color-cat) }
.cat-precio-usd { font-size: 14px; color: rgba(0,27,68,0.38); font-family: var(--font-cuerpo) }

/* Textos INTI */
.cat-titulo { text-transform: uppercase; font-family: var(--font-principal); font-weight: 800; font-stretch: condensed; font-size: 2rem; line-height: 1.2; margin-bottom: 1px }
.energia-de { color: var(--azul) }
.sol        { color: var(--dorado) }
.cat-subtitle { font-family: var(--font-cuerpo); font-size: 24px; font-weight: 500; color: #3a6b8c; margin-top: 0; margin-bottom: 10px; border-left: 3px solid var(--color-cat); padding-left: 12px; letter-spacing: 0.3px }

/* ── .has-main ── */
.cat-card.has-main { grid-template-columns: 280px 1fr; grid-template-rows: 1fr }
.cat-card.has-main .cat-card-header { grid-column: 1; grid-row: 1 }
.cat-card.has-main .cat-main { grid-column: 2; grid-row: 1; display: flex; flex-direction: column; padding: 12px 18px; background: #fff; gap: 16px }
.cat-card.has-main .cat-body { flex: 1; display: flex; flex-direction: column; gap: 12px; padding: 0; border: none; grid-column: unset; grid-row: unset; margin-bottom: -10px; }
.cat-card.has-main .cat-precio { align-self: flex-end; display: flex; flex-direction: column; align-items: center; justify-content: center; background: var(--color-cat); padding: 10px 75px; border-radius: 12px; min-width: 160px; text-align: center; box-shadow: 0 6px 14px var(--shadow-cat); gap: 2px; grid-column: unset; grid-row: unset; border: none; margin: 0 }
.cat-card.has-main .cat-precio-soles { font-family: var(--font-principal); font-weight: 800; font-stretch: condensed; font-size: 45px; color: #fff; line-height: 1; display: block;letter-spacing: 2px; }
.cat-card.has-main .cat-precio-usd { font-size: 25px; color: rgba(255,255,255,0.85); margin-top: 0; display: block; font-family: var(--font-cuerpo); line-height: 1;letter-spacing: 2px; }

/* ── Tabla de beneficios ── */
.tabla-wrap { overflow-x: auto; box-shadow: 0 4px 32px rgba(0,27,68,0.08) }
table { width: 100%; border-collapse: collapse; background: #fff }
thead th { padding: 18px 16px; text-align: center; font-family: var(--font-principal); font-weight: 700; font-stretch: condensed; font-size: 18px; text-transform: uppercase; letter-spacing: 1px }
thead th:first-child { text-align: left; padding-left: 28px }
thead th.col-inti      { color: var(--dorado); background: var(--gris) }
thead th.col-illapa    { color: #fff;  background: var(--gris) }
thead th.col-pachamama { color: #fff; background: var(--gris) }
thead th.col-beneficio { color: var(--azul); background: var(--gris); font-size: 15px; letter-spacing: 2px }
tbody tr.tr-sep td { background: rgba(0,27,68,0.03); font-family: var(--font-principal); font-weight: 700; font-stretch: condensed; font-size: 10px; letter-spacing: 2px; text-transform: uppercase; color: rgba(0,27,68,0.35); padding: 8px 28px; border-top: 1px solid rgba(0,0,0,0.06) }
tbody tr:nth-child(even):not(.tr-sep) { background: rgba(0,27,68,0.015) }
tbody tr:hover:not(.tr-sep) { background: rgba(58,148,164,0.05) }
tbody td { padding: 11px 16px; text-align: center; font-size: 13px; color: var(--texto); border-bottom: 1px solid rgba(0,0,0,0.04) }
tbody td:first-child { text-align: left; padding-left: 28px; font-weight: 600; color: var(--azul) }
.check { font-size: 17px; font-weight: 700 }
.check.inti { color: var(--dorado) } .check.illapa { color: var(--verde) } .check.pachamama { color: var(--azul) }
.dash { color: rgba(0,0,0,0.18); font-size: 15px }
.tag { display: inline-block; padding: 2px 8px; border-radius: 4px; font-size: 10px; font-weight: 700; letter-spacing: 1px; text-transform: uppercase; font-family: var(--font-cuerpo) }
.tag.dorado { background: rgba(224,189,11,0.12); color: var(--dorado) }
.tag.verde  { background: rgba(58,148,164,0.12); color: var(--verde) }
.tag.azul   { background: rgba(0,27,68,0.08);    color: var(--azul) }
tfoot td { padding: 18px 16px; text-align: center; background: var(--azul); font-family: var(--font-principal); font-weight: 700; font-stretch: condensed; font-size: 22px; text-transform: uppercase }
tfoot td:first-child { text-align: left; padding-left: 28px; color:#FFF; font-size: 13px; letter-spacing: 2px }
tfoot td.col-inti { color: var(--dorado) } tfoot td.col-illapa { color: var(--verde) } tfoot td.col-pachamama { color: rgba(255,255,255,0.6) }
.td-usd { display: block; font-size: 24px;  font-weight: 400; letter-spacing: 0; margin-top: 2px }

/* ── Opciones adicionales ── */
.adicionales-grid { display: grid; grid-template-columns: repeat(3,1fr); gap: 16px }
.adic-last-row { grid-column: 1 / -1; display: flex; justify-content: center; gap: 16px }
.adic-last-row .adic-card { width: calc((100% - 32px) / 3) }
.adic-card { border: 1.5px solid rgba(0,0,0,0.08); padding: 22px 18px; background: #fff; display: flex; flex-direction: column; align-items: center; text-align: center; gap: 10px; transition: all .28s; position: relative; overflow: hidden; border-top: 3px solid transparent }
.adic-card:hover { border-top-color: var(--dorado); border-color: rgba(224,189,11,0.25); box-shadow: 0 8px 28px rgba(0,27,68,0.10); transform: translateY(-4px) }
.adic-icon { width: 80px; height: 80px; border-radius: 50%; background: rgba(224,189,11,0.10); border: 2px solid rgba(224,189,11,0.35); display: flex; align-items: center; justify-content: center; font-size: 22px }
.adic-name { font-family: var(--font-principal); font-weight: 700; font-stretch: condensed; font-size: 20px; text-transform: uppercase; letter-spacing: 0.5px; color: var(--azul); line-height: 1.2 }
.adic-price { font-family: var(--font-principal); font-weight: 700; font-stretch: condensed; font-size: 28px; color: var(--azul) }

.adic-name-dorado { font-family: var(--font-principal); font-weight: 700; font-stretch: condensed; font-size: 20px; text-transform: uppercase; letter-spacing: 0.5px; color: var(--dorado); line-height: 1.2 }
.adic-price-dorado { font-family: var(--font-principal); font-weight: 700; font-stretch: condensed; font-size: 28px; color: var(--dorado) }

.adic-name-verde { font-family: var(--font-principal); font-weight: 700; font-stretch: condensed; font-size: 20px; text-transform: uppercase; letter-spacing: 0.5px; color: var(--verde); line-height: 1.2 }
.adic-price-verde { font-family: var(--font-principal); font-weight: 700; font-stretch: condensed; font-size: 28px; color: var(--verde) }
.adic-line { height: 2px; width: 100%; background: var(--dorado); opacity: 0.3; border-radius: 2px }

.adic-line-azul { height: 2px; width: 100%; background: var(--azul); opacity: 0.3; border-radius: 2px }


.adic-benefits { list-style: none; width: 100%; text-align: left }
.adic-benefits li { display: flex; align-items: flex-start; gap: 7px; font-size: 20px; color: var(--texto); line-height: 1.5; padding: 3px 0; border-bottom: 1px solid rgba(0,0,0,0.04) }
.adic-benefits li:last-child { border-bottom: none }
.adic-benefits li::before { content: '·'; color: var(--dorado); font-weight: 700; flex-shrink: 0 }

/* ════════════════════════════════════════
   FERIA — Distribución y Simulación
════════════════════════════════════════ */
.bloque-distribucion { position: relative; overflow: hidden; padding: 64px 0 56px; background: #fff }
.bloque-distribucion::before { content: ''; position: absolute; top: 50%; left: 50%; transform: translate(-50%,-50%); width: 480px; height: 480px; background: url('source/logo-cedelef.svg') center / contain no-repeat; opacity: 0.08; filter: grayscale(100%); pointer-events: none; z-index: 0 }
.bloque-distribucion > * { position: relative; z-index: 1 }
.bloque-simulacion { position: relative; overflow: hidden; padding: 64px 0 56px; background: var(--gris) }
.bloque-simulacion::before { content: ''; position: absolute; top: 50%; left: 50%; transform: translate(-50%,-50%); width: 420px; height: 420px; background: url('source/logo-cedelef.svg') center / contain no-repeat; opacity: 0.08; filter: grayscale(100%); pointer-events: none; z-index: 0 }
.bloque-simulacion > * { position: relative; z-index: 1 }

/* ── Mapa wrap ── */
.mapa-wrap { border-top: 4px solid var(--dorado); padding: 32px; margin-bottom: 40px; position: relative; overflow: hidden }
.mapa-wrap::before { content: ''; position: absolute; inset: 0; background: url('source/logo-cedelef.svg') center / 300px no-repeat; opacity: 0.06; filter: grayscale(100%); pointer-events: none }
.mapa-header { text-align: center; margin-bottom: 28px; position: relative; z-index: 1 }
.mapa-numero { display: inline-block; font-family: var(--font-principal); font-weight: 700; font-stretch: condensed; font-size: 13px; letter-spacing: 2px; color: var(--dorado); border: 1px solid rgba(224,189,11,0.3); padding: 2px 10px; margin-bottom: 10px }
.mapa-title { font-family: var(--font-principal); font-weight: 700; font-stretch: condensed; font-size: clamp(20px,3vw,34px); text-transform: uppercase; letter-spacing: 2px; color: var(--blanco); line-height: 1 }
.mapa-title span { color: var(--dorado) }
.mapa-sub { font-family: var(--font-cuerpo); font-size: 12px; color: rgba(255,255,255,0.45); letter-spacing: 2px; text-transform: uppercase; margin-top: 6px }

/* ── Imagen + leyenda en fila ── */
.mapa-layout {
  display: grid;
  grid-template-columns: 1fr 260px;
  gap: 24px;
  align-items: start;
  position: relative; z-index: 1;
}

.mapa-img-wrap { background: rgba(255,255,255,0.04); border: 1px solid rgba(255,255,255,0.08); padding: 16px }
.mapa-img-wrap img {  height: auto; display: block }
.mapa-img-placeholder { width: 100%; aspect-ratio: 16/9; max-height: 420px; background: rgba(255,255,255,0.06); border: 2px dashed rgba(224,189,11,0.25); display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 12px }
.mapa-img-placeholder span { font-family: var(--font-principal); font-stretch: condensed; font-size: 14px; color: rgba(255,255,255,0.3); text-transform: uppercase; letter-spacing: 2px }

/* ── Leyenda lateral (clase independiente, sin conflicto) ── */
.mapa-leyenda {
  display: flex;
  flex-direction: column;
  gap: 8px;
  position: relative; z-index: 1;
}
.mapa-leyenda .leyenda-item {
  display: flex;
  align-items: flex-start;
  gap: 10px;
  background: var(--azul);
  border: 1px solid rgba(255,255,255,0.1);
  padding: 10px 12px;
}
.mapa-leyenda .leyenda-dot { width: 14px; height: 14px; border-radius: 2px; flex-shrink: 0; margin-top: 3px }
.mapa-leyenda .leyenda-info { display: flex; flex-direction: column; gap: 3px }
.mapa-leyenda .leyenda-nombre { font-family: var(--font-principal); font-weight: 700; font-stretch: condensed; font-size: 16px; text-transform: uppercase; letter-spacing: 1px; color: var(--blanco) }
.mapa-leyenda .leyenda-detalle { font-size: 14px; color: rgba(255,255,255,0.7); line-height: 1.4 }

/* ── Características ── */
.caract-grid { display: grid; grid-template-columns: repeat(4,1fr); gap: 16px; margin-top: 40px }
.caract-card { border: 1.5px solid rgba(0,0,0,0.08); border-top: 3px solid var(--dorado); padding: 20px 16px; text-align: center; background: #fff; transition: all .28s ; font-size: 21px; }
.caract-card:hover { box-shadow: 0 8px 28px rgba(0,27,68,0.10); transform: translateY(-4px) }
.caract-icon { width: 48px; height: 48px; border-radius: 50%; background: rgba(224,189,11,0.10); border: 2px solid rgba(224,189,11,0.3); display: flex; align-items: center; justify-content: center; font-size: 20px; margin: 0 auto 12px }
.caract-valor { font-family: var(--font-principal); font-weight: 700; font-stretch: condensed; font-size: 28px; color: var(--dorado); display: block; line-height: 1 }
.caract-label { font-family: var(--font-principal); font-weight: 700; font-stretch: condensed; font-size: 17px; color: var(--azul); text-transform: uppercase; letter-spacing: 0.5px; margin-top: 4px; display: block }

/* ── Stands ── */
.stands-resumen { display: grid; grid-template-columns: repeat(5,1fr); gap: 12px; margin-top: 32px }
.stand-item { border: 1.5px solid rgba(0,0,0,0.08); padding: 16px 12px; text-align: center; background: #fff; display: flex; flex-direction: column; gap: 6px; align-items: center }
.stand-color { width: 16px; height: 16px; border-radius: 2px; flex-shrink: 0 }
.stand-nombre { font-family: var(--font-principal); font-weight: 700; font-stretch: condensed; font-size: 19px; color: var(--azul); text-transform: uppercase; letter-spacing: 1px }
.stand-cant { font-family: var(--font-principal); font-weight: 700; font-stretch: condensed; font-size: 22px; line-height: 1 }
.stand-medidas { font-size: 17px; color: rgba(0,27,68,0.5); line-height: 1.4 }

/* ── Video ── */
.video-wrap { position: relative; aspect-ratio: 16/9; overflow: hidden; background: var(--azul); border-top: 4px solid var(--dorado); margin-bottom: 32px }
.video-wrap img   { width: 100%; height: 100%; object-fit: cover; opacity: 0.85 }
.video-wrap video { width: 100%; height: 100%; object-fit: cover }
.video-wrap iframe { position: absolute; top: 0; left: 0; width: 100%; height: 100%; border: none }
.video-placeholder { width: 100%; height: 100%; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 16px; min-height: 360px }
.video-play-btn { width: 72px; height: 72px; border-radius: 50%; background: rgba(224,189,11,0.15); border: 2px solid rgba(224,189,11,0.4); display: flex; align-items: center; justify-content: center; font-size: 28px; cursor: pointer; transition: all .3s }
.video-play-btn:hover { background: var(--dorado); color: var(--azul) }
.video-label { font-family: var(--font-principal); font-weight: 700; font-stretch: condensed; font-size: 16px; color: rgba(255,255,255,0.5); text-transform: uppercase; letter-spacing: 2px }
.video-overlay { position: absolute; bottom: 0; left: 0; right: 0; background: linear-gradient(to top, rgba(0,27,68,0.85) 0%, transparent 60%); padding: 24px 28px; display: flex; align-items: flex-end; justify-content: space-between; flex-wrap: wrap; gap: 12px }
.video-overlay-title { font-family: var(--font-principal); font-weight: 700; font-stretch: condensed; font-size: clamp(16px,2.5vw,28px); color: var(--blanco); text-transform: uppercase; letter-spacing: 1px; line-height: 1.1 }
.video-overlay-title span { color: var(--dorado) }
.video-overlay-badge { background: var(--dorado); color: var(--azul); font-family: var(--font-principal); font-weight: 700; font-stretch: condensed; font-size: 12px; letter-spacing: 2px; text-transform: uppercase; padding: 6px 14px }

/* ── Sim features ── */
.sim-features { display: grid; grid-template-columns: repeat(3,1fr); gap: 20px }
.sim-feature { background: #fff; border: 1.5px solid rgba(0,0,0,0.07); border-top: 3px solid var(--verde); padding: 24px 20px; display: flex; align-items: flex-start; gap: 14px; transition: all .28s }
.sim-feature:hover { box-shadow: 0 8px 28px rgba(0,27,68,0.08); transform: translateY(-3px) }
.sim-feature-icon { width: 48px; height: 48px; min-width: 48px; border-radius: 50%; background: rgba(58,148,164,0.10); border: 2px solid rgba(58,148,164,0.3); display: flex; align-items: center; justify-content: center; font-size: 20px }
.sim-feature-info { display: flex; flex-direction: column; gap: 5px }
.sim-feature-title { font-family: var(--font-principal); font-weight: 700; font-stretch: condensed; font-size: 20px; text-transform: uppercase; letter-spacing: 0.5px; color: var(--azul) }
.sim-feature-desc { font-size: 18px; color: var(--texto); line-height: 1.2 }

/* ════════════════════════════════════════
   TABLA CIRCUITO
════════════════════════════════════════ */
.tabla-circuit-wrap { position: relative; padding: 0 }
.tabla-circuit-wrap::before { content: ''; position: absolute; left: -20px; top: 0; bottom: 0; width: 2px; background: linear-gradient(to bottom, var(--dorado) 0%, rgba(224,189,11,0.3) 60%, transparent 100%); pointer-events: none; z-index: 2 }
.tabla-circuit-wrap::after { content: ''; position: absolute; left: -26px; top: -6px; width: 14px; height: 14px; border-radius: 50%; background: var(--dorado); box-shadow: 0 0 8px rgba(224,189,11,0.7); pointer-events: none; z-index: 2 }
.tabla-circuit-node-bl { position: absolute; left: -26px; bottom: -6px; width: 14px; height: 14px; border-radius: 50%; border: 2px solid var(--dorado); background: #fff; box-shadow: 0 0 6px rgba(224,189,11,0.4); pointer-events: none; z-index: 2 }
.tabla-circuit-top { position: absolute; top: -3px; left: -20px; right: 0; height: 2px; background: linear-gradient(to right, var(--dorado) 0%, rgba(224,189,11,0.4) 70%, transparent 100%); pointer-events: none; z-index: 2 }
.tabla-circuit-top::after { content: ''; position: absolute; right: 40px; top: 50%; transform: translateY(-50%); width: 10px; height: 10px; border-radius: 50%; border: 2px solid var(--dorado); background: #fff; box-shadow: 0 0 5px rgba(224,189,11,0.4) }
.tabla-circuit-wrap thead th { position: relative }
.tabla-circuit-wrap thead th.col-inti::before,
.tabla-circuit-wrap thead th.col-illapa::before,
.tabla-circuit-wrap thead th.col-pachamama::before { content: ''; position: absolute; top: -6px; left: 50%; transform: translateX(-50%); width: 10px; height: 10px; border-radius: 50%; z-index: 3 }
.tabla-circuit-wrap thead th.col-inti::before      { background: var(--dorado); box-shadow: 0 0 6px rgba(224,189,11,0.7) }
.tabla-circuit-wrap thead th.col-illapa::before    { background: var(--verde);  box-shadow: 0 0 6px rgba(58,148,164,0.7) }
.tabla-circuit-wrap thead th.col-pachamama::before { background: rgba(255,255,255,0.3) }
.tabla-circuit-wrap tbody tr.tr-sep td { background: rgba(0,27,68,0.03); padding: 8px 28px; font-family: var(--font-principal); font-weight: 700; font-stretch: condensed; font-size: 20px; letter-spacing: 4px; text-transform: uppercase; color: rgba(0,27,68,0.4); position: relative; border-top: none }
.tabla-circuit-wrap tbody tr.tr-sep td::before { content: ''; position: absolute; bottom: 0; left: 12px; right: 12px; height: 1px; background: linear-gradient(to right, var(--dorado) 0%, rgba(224,189,11,0.3) 50%, transparent 100%) }
.tabla-circuit-wrap tbody tr.tr-sep td::after { content: ''; position: absolute; bottom: -4px; left: 6px; width: 8px; height: 8px; border-radius: 50%; background: var(--dorado); box-shadow: 0 0 5px rgba(224,189,11,0.6) }
.tr-sep-node { position: absolute; bottom: -4px; right: 6px; width: 8px; height: 8px; border-radius: 50%; border: 1.5px solid var(--dorado); background: #fff; box-shadow: 0 0 4px rgba(224,189,11,0.4); display: inline-block }
.tabla-circuit-wrap tbody td { font-size: 15px; text-transform: uppercase; letter-spacing: 0.5px }
.tabla-circuit-wrap tbody td:first-child { font-size: 18px; text-transform: uppercase; letter-spacing: 0.5px }
.tabla-circuit-wrap thead th { font-size: 20px;padding: 5px; }
.tabla-circuit-wrap thead th.col-beneficio { font-size: 32px;text-align: center; }
.tabla-circuit-wrap tfoot td { font-size: 28px }
.tabla-circuit-wrap tfoot td:first-child { font-size: 25px; text-transform: uppercase; letter-spacing: 2px }
.tabla-circuit-wrap .tag { font-size: 16px; letter-spacing: 1px }
.tabla-circuit-wrap .check { font-size: 20px }

/* ════════════════════════════════════════
   RESPONSIVE
════════════════════════════════════════ */
@media (max-width: 900px) {
  .inner-deco-corner-tr, .inner-deco-corner-bl { width: 90px; height: 90px }
  .inner-hero-deco-tr  { width: 110px }
  .cat-card, .cat-card.has-main { grid-template-columns: 200px 1fr }
  .adicionales-grid    { grid-template-columns: repeat(2,1fr) }
  thead th, tbody td, tfoot td { padding: 10px 8px }
  tbody td:first-child, thead th:first-child { padding-left: 14px }
  .caract-grid         { grid-template-columns: repeat(2,1fr) }
  .stands-resumen      { grid-template-columns: repeat(3,1fr) }
  .sim-features        { grid-template-columns: 1fr }
  .mapa-layout         { grid-template-columns: 1fr }
}

@media (max-width: 860px) {
  .inner-hero           { height: auto; min-height: 0; max-height: none; padding-bottom: 28px }
  .inner-hero-row       { flex-direction: column; gap: 20px }
  .inner-hero-content   { text-align: center }
  .inner-hero-sub       { max-width: 100%; margin: 0 auto }
}

@media (max-width: 640px) {
  .inner-hero-main     { margin-left: 0 }
  .inner-hero-title    { font-size: 28px }
  .inner-hero-deco-izq { display: none }
  .inner-hero-deco-tr  { width: 80px }
  .cat-card, .cat-card.has-main { grid-template-columns: 1fr; grid-template-rows: auto auto auto }
  .cat-card-header     { grid-column: 1; grid-row: 1 }
  .cat-card.has-main .cat-main { grid-column: 1; grid-row: 2 }
  .cat-precio          { grid-column: 1; grid-row: 2 }
  .cat-body            { grid-column: 1; grid-row: 3 }
  .cat-card.has-main .cat-precio { align-self: stretch; border-radius: 0 }
  .adicionales-grid    { grid-template-columns: 1fr }
  .adic-last-row .adic-card { width: 100% }
  table                { font-size: 11px }
  thead th, tbody td, tfoot td { padding: 9px 8px }
  tbody td:first-child, thead th:first-child { padding-left: 12px }
  tfoot td:first-child { padding-left: 12px }
  .caract-grid         { grid-template-columns: repeat(2,1fr) }
  .stands-resumen      { grid-template-columns: repeat(2,1fr) }
  .video-overlay       { padding: 16px }
}

@media (max-width: 380px) {
  .caract-grid    { grid-template-columns: 1fr }
  .stands-resumen { grid-template-columns: 1fr }
}

/* ════════════════════════════════════════
   CONTACTO
════════════════════════════════════════ */
.bloque-contacto { background: #fff; position: relative; overflow: hidden; padding: 64px 0 56px }
.bloque-contacto::before { content: ''; position: absolute; top: 50%; left: 50%; transform: translate(-50%,-50%); width: 480px; height: 480px; background: url('source/logo-cedelef.svg') center / contain no-repeat; opacity: 0.06; filter: grayscale(100%); pointer-events: none; z-index: 0 }
.bloque-contacto > * { position: relative; z-index: 1 }

/* Eyebrow decorativo */
.contacto-eyebrow {
  display: flex; align-items: center; justify-content: center;
  gap: 16px; margin-bottom: 16px;
  font-family: var(--font-cuerpo); font-size: 11px; font-weight: 700;
  letter-spacing: 3px; text-transform: uppercase; color: var(--dorado);
}
.contacto-eyebrow-line {
  height: 1px; width: 60px;
  background: linear-gradient(to right, transparent, var(--dorado));
}
.contacto-eyebrow-line:last-child {
  background: linear-gradient(to left, transparent, var(--dorado));
}

/* Card principal secretario */
.contacto-card {
  max-width: 780px; margin: 0 auto;
  background: var(--azul);
  border-top: 4px solid var(--dorado);
  border-bottom: 2px solid rgba(224,189,11,0.2);
  position: relative; overflow: hidden;
  padding: 40px 18px 0;
}
/* Deco circuito top */
.contacto-card-deco-top {
  position: absolute; top: 0; left: 40px; right: 40px; height: 1px;
  background: linear-gradient(to right, transparent, rgba(224,189,11,0.3), transparent);
}
.contacto-card-deco-top::before,
.contacto-card-deco-top::after {
  content: ''; position: absolute; top: 50%; transform: translateY(-50%);
  width: 8px; height: 8px; border-radius: 50%;
  background: var(--dorado); box-shadow: 0 0 6px rgba(224,189,11,0.7);
}
.contacto-card-deco-top::before { left: 0 }
.contacto-card-deco-top::after  { right: 0 }

/* Deco circuito izq */
.contacto-card-deco-left {
  position: absolute; left: 0; top: 0; bottom: 0; width: 3px;
  background: linear-gradient(to bottom, var(--dorado), rgba(224,189,11,0.1));
}
.contacto-card-deco-left::after {
  content: ''; position: absolute; bottom: -5px; left: 50%; transform: translateX(-50%);
  width: 10px; height: 10px; border-radius: 50%;
  border: 2px solid var(--dorado); background: var(--azul);
  box-shadow: 0 0 5px rgba(224,189,11,0.4);
}

.contacto-card-inner {
  display: flex; align-items: center; gap: 32px;
  padding-bottom: 32px;
  border-bottom: 1px solid rgba(255,255,255,0.08);
}

/* Avatar */
.contacto-avatar {
  flex-shrink: 0; width: 96px; height: 96px;
  border-radius: 50%; border: 2px solid var(--dorado);
  background: rgba(224,189,11,0.08);
  display: flex; align-items: center; justify-content: center;
  box-shadow: 0 0 20px rgba(224,189,11,0.15);
}

/* Persona */
.contacto-cargo {
  font-family: var(--font-cuerpo); font-size: 14px; font-weight: 700;
  letter-spacing: 3px; text-transform: uppercase; color: var(--dorado);
  display: block; margin-bottom: 8px;
}
.contacto-nombre {
  font-family: var(--font-principal); font-weight: 700; font-stretch: condensed;
  font-size: clamp(22px,3vw,32px); text-transform: uppercase; letter-spacing: 1px;
  color: var(--blanco); line-height: 1.1; margin-bottom: 10px;
}
.contacto-desc {
  font-size: 15px; color: rgba(255,255,255,0.45); line-height: 1.6;
}

/* Canales de contacto */
.contacto-canales {
  display: grid; grid-template-columns: 1fr 1fr 1fr;
  gap: 0;
}
.contacto-canal {
  display: flex; align-items: center; gap: 14px;
  padding: 10px 14px;
  text-decoration: none;
  border-top: 1px solid rgba(255,255,255,0.06);
  border-right: 1px solid rgba(255,255,255,0.06);
  transition: background .25s;
}
.contacto-canal:last-child { border-right: none }
.contacto-canal:hover { background: rgba(255,255,255,0.04) }

.contacto-canal-icon {
  width: 44px; height: 44px; flex-shrink: 0; border-radius: 50%;
  background: rgba(255,255,255,0.05); border: 1px solid rgba(255,255,255,0.1);
  display: flex; align-items: center; justify-content: center;
}
.contacto-canal-info { display: flex; flex-direction: column; gap: 3px; min-width: 0 }
.contacto-canal-label {
  font-size: 12px; font-weight: 700; letter-spacing: 2px; text-transform: uppercase;
  color: rgba(255,255,255,0.35); font-family: var(--font-cuerpo);
}
.contacto-canal-value {
  font-family: var(--font-principal); font-weight: 700; font-stretch: condensed;
  font-size: 20px; color: var(--blanco); letter-spacing: 0.5px;
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}

/* ── Sede ── */
.bloque-sede { background: var(--gris); position: relative; overflow: hidden; padding: 64px 0 56px }
.bloque-sede::before { content: ''; position: absolute; top: 50%; left: 50%; transform: translate(-50%,-50%); width: 420px; height: 420px; background: url('source/logo-cedelef.svg') center / contain no-repeat; opacity: 0.06; filter: grayscale(100%); pointer-events: none; z-index: 0 }
.bloque-sede > * { position: relative; z-index: 1 }

.sede-layout {
  display: grid; grid-template-columns: 1fr 1fr;
  gap: 32px; align-items: stretch;
}

.sede-info {
  background: var(--azul); padding: 36px;
  border-top: 4px solid var(--dorado);
  display: flex; flex-direction: column; gap: 20px;
}
.sede-icon { font-size: 40px; line-height: 1 }
.sede-nombre {
  font-family: var(--font-principal); font-weight: 700; font-stretch: condensed;
  font-size: clamp(20px,2.5vw,28px); text-transform: uppercase; letter-spacing: 1px;
  color: var(--blanco); line-height: 1.1;
}
.sede-nombre span { color: var(--dorado) }

.sede-detalle-list { display: flex; flex-direction: column; gap: 12px }
.sede-detalle-item {
  display: flex; align-items: flex-start; gap: 12px;
  padding-bottom: 12px; border-bottom: 1px solid rgba(255,255,255,0.06);
}
.sede-detalle-item:last-child { border-bottom: none }
.sede-detalle-dot {
  width: 8px; height: 8px; border-radius: 50%; flex-shrink: 0;
  margin-top: 4px; background: var(--dorado);
  box-shadow: 0 0 6px rgba(224,189,11,0.5);
}
.sede-detalle-label {
  font-size: 9px; font-weight: 700; letter-spacing: 2px; text-transform: uppercase;
  color: var(--dorado); display: block; margin-bottom: 2px; font-family: var(--font-cuerpo);
}
.sede-detalle-valor {
  font-family: var(--font-principal); font-weight: 700; font-stretch: condensed;
  font-size: 16px; color: var(--blanco); text-transform: uppercase; letter-spacing: 0.5px;
}

.sede-organiza { margin-top: auto; padding-top: 20px; border-top: 1px solid rgba(255,255,255,0.08) }
.sede-organiza-label {
  display: flex; align-items: center; gap: 10px;
  font-size: 9px; font-weight: 700; letter-spacing: 3px; text-transform: uppercase;
  color: rgba(255,255,255,0.4); font-family: var(--font-cuerpo);
  margin-bottom: 16px;
}
.sede-organiza-logos {
  display: flex; align-items: center; gap: 24px; flex-wrap: wrap;
}

.sede-mapa {
  min-height: 360px; overflow: hidden;
  border: 2px solid rgba(224,189,11,0.2);
  border-top: 4px solid var(--verde);
}
.sede-mapa iframe { width: 100%; height: 100%; min-height: 360px; display: block }

/* ── Resumen categorías ── */
.bloque-resumen-cats { background: #fff; position: relative; overflow: hidden; padding: 64px 0 56px }
.bloque-resumen-cats::before { content: ''; position: absolute; top: 50%; left: 50%; transform: translate(-50%,-50%); width: 460px; height: 460px; background: url('source/logo-cedelef.svg') center / contain no-repeat; opacity: 0.06; filter: grayscale(100%); pointer-events: none; z-index: 0 }
.bloque-resumen-cats > * { position: relative; z-index: 1 }

.resumen-cats-grid { display: grid; grid-template-columns: repeat(3,1fr); gap: 20px }

.resumen-cat-card {
  display: flex; flex-direction: column;
  background: var(--azul);
  border-top: 4px solid transparent;
  padding: 28px 24px;
  transition: transform .3s, box-shadow .3s;
  position: relative; overflow: hidden;
}
.resumen-cat-card::after {
  content: ''; position: absolute; bottom: -30px; right: -30px;
  width: 100px; height: 100px; border-radius: 50%; opacity: 0.08;
}
.resumen-cat-card.inti      { border-top-color: var(--dorado) }
.resumen-cat-card.illapa    { border-top-color: var(--verde) }
.resumen-cat-card.pachamama { border-top-color: rgba(255,255,255,0.3) }
.resumen-cat-card.inti::after      { background: var(--dorado) }
.resumen-cat-card.illapa::after    { background: var(--verde) }
.resumen-cat-card.pachamama::after { background: #fff }
.resumen-cat-card:hover { transform: translateY(-4px); box-shadow: 0 16px 40px rgba(0,27,68,0.3) }

.resumen-cat-header {
  display: flex; align-items: center; gap: 16px; margin-bottom: 16px;
  padding-bottom: 16px; border-bottom: 1px solid rgba(255,255,255,0.08);
}
.resumen-cat-titulo {
  font-family: var(--font-cuerpo); font-size: 11px; font-weight: 600;
  letter-spacing: 1px; text-transform: uppercase;
  color: rgba(255,255,255,0.45); display: block; margin-bottom: 4px;
}
.resumen-cat-card.inti    .resumen-cat-titulo span { color: var(--dorado) }
.resumen-cat-card.illapa  .resumen-cat-titulo span { color: var(--verde) }
.resumen-cat-card.pachamama .resumen-cat-titulo span { color: rgba(255,255,255,0.6) }

.resumen-cat-nombre {
  font-family: var(--font-principal); font-weight: 700; font-stretch: condensed;
  font-size: 28px; text-transform: uppercase; letter-spacing: 3px;
  display: block; line-height: 1;
}
.resumen-cat-card.inti      .resumen-cat-nombre { color: var(--dorado) }
.resumen-cat-card.illapa    .resumen-cat-nombre { color: var(--verde) }
.resumen-cat-card.pachamama .resumen-cat-nombre { color: rgba(255,255,255,0.65) }

.resumen-cat-lista {
  list-style: none; flex: 1; display: flex; flex-direction: column; gap: 8px; margin-bottom: 20px;
}
.resumen-cat-lista li {
  display: flex; align-items: flex-start; gap: 8px;
  font-size: 13px; color: rgba(255,255,255,0.55); line-height: 1.5;
  padding-bottom: 8px; border-bottom: 1px solid rgba(255,255,255,0.05);
}
.resumen-cat-lista li:last-child { border-bottom: none }
.resumen-cat-lista li::before { content: '→'; flex-shrink: 0; font-size: 11px }
.resumen-cat-card.inti      .resumen-cat-lista li::before { color: var(--dorado) }
.resumen-cat-card.illapa    .resumen-cat-lista li::before { color: var(--verde) }
.resumen-cat-card.pachamama .resumen-cat-lista li::before { color: rgba(255,255,255,0.3) }

.resumen-cat-precio {
  display: flex; flex-direction: column; align-items: flex-end;
  padding: 12px 0; border-top: 1px solid rgba(255,255,255,0.08); margin-bottom: 16px;
}
.resumen-precio-soles {
  font-family: var(--font-principal); font-weight: 800; font-stretch: condensed;
  font-size: 28px; line-height: 1;
}
.resumen-cat-card.inti      .resumen-precio-soles { color: var(--dorado) }
.resumen-cat-card.illapa    .resumen-precio-soles { color: var(--verde) }
.resumen-cat-card.pachamama .resumen-precio-soles { color: rgba(255,255,255,0.65) }
.resumen-precio-usd { font-size: 11px; color: rgba(255,255,255,0.3); font-family: var(--font-cuerpo) }

.resumen-cat-btn {
  display: inline-flex; align-items: center; justify-content: center;
  padding: 10px 20px; text-decoration: none;
  font-family: var(--font-principal); font-weight: 700; font-stretch: condensed;
  font-size: 13px; letter-spacing: 1px; text-transform: uppercase;
  border: 1.5px solid rgba(255,255,255,0.15); color: rgba(255,255,255,0.6);
  transition: all .25s; margin-top: auto;
}
.resumen-cat-card.inti    .resumen-cat-btn:hover { border-color: var(--dorado); color: var(--dorado) }
.resumen-cat-card.illapa  .resumen-cat-btn:hover { border-color: var(--verde);  color: var(--verde) }
.resumen-cat-card.pachamama .resumen-cat-btn:hover { border-color: rgba(255,255,255,0.4); color: #fff }

/* ── Responsive contacto ── */
@media (max-width: 900px) {
  .contacto-canales  { grid-template-columns: 1fr }
  .contacto-canal    { border-right: none; border-bottom: 1px solid rgba(255,255,255,0.06) }
  .sede-layout       { grid-template-columns: 1fr }
  .resumen-cats-grid { grid-template-columns: 1fr }
}
@media (max-width: 640px) {
  .contacto-card         { padding: 28px 20px 0 }
  .contacto-card-inner   { flex-direction: column; text-align: center }
  .contacto-nombre       { font-size: 22px }
  .contacto-canal-value  { font-size: 13px }
}

/* ════════════════════════════════════════
   CONTACTO — versión limpia
════════════════════════════════════════ */
.bloque-contacto-main {
  background: #fff; position: relative;
  overflow: hidden; padding: 64px 0 56px;
}
.bloque-contacto-main::before {
  content: ''; position: absolute; top: 50%; left: 50%;
  transform: translate(-50%,-50%);
  width: 480px; height: 480px;
  background: url('source/logo-cedelef.svg') center / contain no-repeat;
  opacity: 0.06; filter: grayscale(100%); pointer-events: none; z-index: 0;
}
.bloque-contacto-main > * { position: relative; z-index: 1 }

/* Eyebrow */
.ctc-eyebrow {
  display: flex; align-items: center; justify-content: center;
  gap: 16px; margin-bottom: 16px;
  font-family: var(--font-cuerpo); font-size: 10px; font-weight: 700;
  letter-spacing: 3px; text-transform: uppercase; color: var(--dorado);
}
.ctc-eyebrow-line {
  height: 1px; width: 56px;
  background: linear-gradient(to right, transparent, var(--dorado));
}
.ctc-eyebrow-line:last-child {
  background: linear-gradient(to left, transparent, var(--dorado));
}

/* ── Card principal ── */
.ctc-card {
  max-width: 820px; margin: 0 auto 48px;
  background: var(--azul);
  border-top: 4px solid var(--dorado);
  position: relative; overflow: hidden;
}

/* Deco top — línea con nodos en extremos */
.ctc-deco-top {
  position: absolute; top: 0; left: 0; right: 0; height: 1px;
  background: linear-gradient(to right, rgba(224,189,11,0.5) 0%, rgba(224,189,11,0.15) 50%, rgba(224,189,11,0.5) 100%);
}
.ctc-deco-node {
  position: absolute; top: 50%; transform: translateY(-50%);
  width: 8px; height: 8px; border-radius: 50%;
  background: var(--dorado); box-shadow: 0 0 6px rgba(224,189,11,0.8);
  left: 0;
}
.ctc-deco-node-right { left: unset; right: 0 }

/* Deco lateral izq */
.ctc-deco-left {
  position: absolute; left: 0; top: 0; bottom: 0; width: 3px;
  background: linear-gradient(to bottom, var(--dorado) 0%, rgba(224,189,11,0.15) 100%);
}
.ctc-deco-left::after {
  content: ''; position: absolute; bottom: -5px; left: 50%;
  transform: translateX(-50%);
  width: 10px; height: 10px; border-radius: 50%;
  border: 2px solid var(--dorado); background: var(--azul);
  box-shadow: 0 0 5px rgba(224,189,11,0.4);
}

/* Deco lateral der */
.ctc-deco-right {
  position: absolute; right: 0; top: 0; height: 60%; width: 1px;
  background: linear-gradient(to bottom, var(--dorado), transparent);
}
.ctc-deco-right::after {
  content: ''; position: absolute; bottom: -5px; left: 50%;
  transform: translateX(-50%);
  width: 8px; height: 8px; border-radius: 50%;
  border: 1.5px solid var(--dorado); background: var(--azul);
  box-shadow: 0 0 4px rgba(224,189,11,0.3);
}

/* Persona */
.ctc-persona {
  display: flex; align-items: center; gap: 32px;
  padding: 40px 48px 32px;
  border-bottom: 1px solid rgba(255,255,255,0.07);
}
.ctc-avatar {
  flex-shrink: 0; width: 96px; height: 96px; border-radius: 50%;
  border: 2px solid rgba(224,189,11,0.4);
  background: rgba(224,189,11,0.06);
  display: flex; align-items: center; justify-content: center;
  box-shadow: 0 0 24px rgba(224,189,11,0.12);
}
.ctc-cargo {
  font-family: var(--font-cuerpo); font-size: 9px; font-weight: 700;
  letter-spacing: 3px; text-transform: uppercase; color: var(--dorado);
  display: block; margin-bottom: 10px;
}
.ctc-nombre {
  font-family: var(--font-principal); font-weight: 700; font-stretch: condensed;
  font-size: clamp(22px,3vw,34px); text-transform: uppercase; letter-spacing: 1px;
  color: var(--blanco); line-height: 1.05; margin-bottom: 12px;
}
.ctc-desc {
  font-size: 13px; color: rgba(255,255,255,0.4); line-height: 1.7; max-width: 440px;
}

/* Separador trazo eléctrico */
.ctc-sep {
  display: flex; align-items: center; gap: 0;
  padding: 0 48px;
}
.ctc-sep-line {
  flex: 1; height: 1px;
  background: linear-gradient(to right, rgba(224,189,11,0.4), rgba(224,189,11,0.1));
}
.ctc-sep-line:last-child {
  background: linear-gradient(to left, rgba(224,189,11,0.4), rgba(224,189,11,0.1));
}
.ctc-sep-node {
  width: 10px; height: 10px; border-radius: 50%; flex-shrink: 0;
  background: var(--dorado); box-shadow: 0 0 8px rgba(224,189,11,0.6);
}

/* Canales */
.ctc-canales {
  display: grid; grid-template-columns: 1fr 1fr 1fr;
  padding: 0 48px; gap: 0;
}
.ctc-canal {
  display: flex; align-items: center; gap: 14px;
  padding: 24px 20px;
  text-decoration: none;
  border-right: 1px solid rgba(255,255,255,0.06);
  transition: background .25s;
}
.ctc-canal:last-child { border-right: none }
.ctc-canal:hover { background: rgba(255,255,255,0.04) }

.ctc-canal-icon {
  width: 44px; height: 44px; flex-shrink: 0; border-radius: 50%;
  border: 1.5px solid rgba(255,255,255,0.1);
  background: rgba(255,255,255,0.04);
  display: flex; align-items: center; justify-content: center;
  transition: all .25s;
}
.ctc-icon-dorado { color: var(--dorado) }
.ctc-icon-verde  { color: var(--verde) }
.ctc-canal:hover .ctc-canal-icon { transform: scale(1.1) }
.ctc-icon-dorado:hover,
.ctc-canal:hover .ctc-icon-dorado { border-color: rgba(224,189,11,0.4); background: rgba(224,189,11,0.1) }
.ctc-canal:hover .ctc-icon-verde  { border-color: rgba(58,148,164,0.4); background: rgba(58,148,164,0.1) }

.ctc-canal-info { display: flex; flex-direction: column; gap: 3px; min-width: 0 }
.ctc-canal-label {
  font-size: 9px; font-weight: 700; letter-spacing: 2px; text-transform: uppercase;
  color: rgba(255,255,255,0.3); font-family: var(--font-cuerpo);
}
.ctc-canal-valor {
  font-family: var(--font-principal); font-weight: 700; font-stretch: condensed;
  font-size: 15px; color: var(--blanco); letter-spacing: 0.5px;
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
.ctc-telefono {
  font-size: 22px; color: var(--dorado); letter-spacing: 1px;
}

/* Nota */
.ctc-nota {
  display: flex; align-items: flex-start; gap: 10px;
  margin: 0 48px; padding: 16px 0;
  border-top: 1px solid rgba(255,255,255,0.06);
  font-size: 12px; color: rgba(255,255,255,0.3);
  font-family: var(--font-cuerpo); line-height: 1.6;
  font-style: italic;
}

/* ── Sede ── */
.ctc-sede {
  max-width: 820px; margin: 0 auto;
  background: var(--azul);
  border-top: 4px solid var(--verde);
  display: flex; align-items: center; gap: 24px;
  padding: 28px 48px;
}
.ctc-sede-icon { font-size: 36px; flex-shrink: 0 }
.ctc-sede-text { display: flex; flex-direction: column; gap: 4px }
.ctc-sede-label {
  font-size: 9px; font-weight: 700; letter-spacing: 3px; text-transform: uppercase;
  color: var(--verde); font-family: var(--font-cuerpo);
}
.ctc-sede-nombre {
  font-family: var(--font-principal); font-weight: 700; font-stretch: condensed;
  font-size: clamp(16px,2.5vw,22px); text-transform: uppercase; letter-spacing: 1px;
  color: var(--blanco); line-height: 1.1;
}
.ctc-sede-detalle {
  font-size: 12px; color: rgba(255,255,255,0.4);
  font-family: var(--font-cuerpo);
}
.ctc-sede-detalle em { color: var(--dorado); font-style: normal; font-weight: 600 }

/* ── Responsive ── */
@media (max-width: 900px) {
  .ctc-canales { grid-template-columns: 1fr; padding: 0 24px }
  .ctc-canal { border-right: none; border-bottom: 1px solid rgba(255,255,255,0.06) }
  .ctc-canal:last-child { border-bottom: none }
  .ctc-persona { padding: 28px 24px 24px }
  .ctc-sep { padding: 0 24px }
  .ctc-nota { margin: 0 24px }
  .ctc-sede { padding: 24px 24px; flex-direction: column; text-align: center }
}
@media (max-width: 640px) {
  .ctc-persona { flex-direction: column; text-align: center }
  .ctc-desc { max-width: 100% }
  .ctc-nombre { font-size: 22px }
  .ctc-canal-valor { font-size: 13px }
  .ctc-telefono { font-size: 18px }
}

/* ════════════════════════════════════════
   CONTACTO v2 — UX mejorado
════════════════════════════════════════ */
.bloque-contacto-main {
  background: #fff; position: relative;
  overflow: hidden; padding: 64px 0 72px;
}
.bloque-contacto-main::before {
  content: ''; position: absolute; top: 50%; left: 50%;
  transform: translate(-50%,-50%);
  width: 500px; height: 500px;
  background: url('source/logo-cedelef.svg') center / contain no-repeat;
  opacity: 0.05; filter: grayscale(100%); pointer-events: none; z-index: 0;
}
.bloque-contacto-main > * { position: relative; z-index: 1 }

/* Eyebrow */
.ctc-eyebrow {
  display: flex; align-items: center; justify-content: center;
  gap: 16px; margin-bottom: 16px;
  font-family: var(--font-cuerpo); font-size: 10px; font-weight: 700;
  letter-spacing: 3px; text-transform: uppercase; color: var(--dorado);
}
.ctc-eyebrow-line {
  height: 1px; width: 56px;
  background: linear-gradient(to right, transparent, var(--dorado));
}
.ctc-eyebrow-line:last-child { background: linear-gradient(to left, transparent, var(--dorado)) }

/* ── Layout 2 columnas ── */
.ctc-layout {
  display: grid;
  grid-template-columns: 340px 1fr;
  gap: 28px;
  align-items: start;
  margin-top: 8px;
}

/* ── COL IZQUIERDA: tarjeta persona ── */
.ctc-card-outer {
  position: relative;
}
.ctc-deco-v-izq {
  position: absolute; left: 0; top: 0; bottom: 0; width: 3px;
  background: linear-gradient(to bottom, var(--dorado) 0%, rgba(224,189,11,0.1) 100%);
  z-index: 2;
}
.ctc-deco-v-izq::before {
  content: ''; position: absolute; top: -5px; left: 50%;
  transform: translateX(-50%);
  width: 10px; height: 10px; border-radius: 50%;
  background: var(--dorado); box-shadow: 0 0 8px rgba(224,189,11,0.7);
}
.ctc-deco-v-izq::after {
  content: ''; position: absolute; bottom: -5px; left: 50%;
  transform: translateX(-50%);
  width: 10px; height: 10px; border-radius: 50%;
  border: 2px solid var(--dorado); background: #fff;
  box-shadow: 0 0 5px rgba(224,189,11,0.4);
}
.ctc-deco-h-inf {
  position: absolute; bottom: 0; left: 0; right: 0; height: 2px;
  background: linear-gradient(to right, var(--dorado), rgba(224,189,11,0.1));
  z-index: 2;
}
.ctc-deco-h-inf::after {
  content: ''; position: absolute; right: -5px; top: 50%;
  transform: translateY(-50%);
  width: 10px; height: 10px; border-radius: 50%;
  background: var(--dorado); box-shadow: 0 0 6px rgba(224,189,11,0.6);
}

.ctc-persona-card {
  background: var(--azul);
  border-top: 4px solid var(--dorado);
  padding: 36px 32px 32px;
  display: flex; flex-direction: column; align-items: center;
  text-align: center; gap: 0;
  position: relative; overflow: hidden;
}
.ctc-persona-card::after {
  content: ''; position: absolute; bottom: -40px; right: -40px;
  width: 140px; height: 140px; border-radius: 50%;
  background: var(--dorado); opacity: 0.06;
}

.ctc-avatar {
  width: 100px; height: 100px; border-radius: 50%; flex-shrink: 0;
  border: 2px solid rgba(224,189,11,0.35);
  background: rgba(224,189,11,0.06);
  display: flex; align-items: center; justify-content: center;
  margin-bottom: 20px;
  box-shadow: 0 0 28px rgba(224,189,11,0.12);
}
.ctc-cargo {
  font-family: var(--font-cuerpo); font-size: 9px; font-weight: 700;
  letter-spacing: 3px; text-transform: uppercase; color: var(--dorado);
  display: block; margin-bottom: 10px;
}
.ctc-nombre {
  font-family: var(--font-principal); font-weight: 700; font-stretch: condensed;
  font-size: clamp(20px,2.5vw,26px); text-transform: uppercase; letter-spacing: 1px;
  color: var(--blanco); line-height: 1.1; margin-bottom: 16px;
}
.ctc-divider-name {
  display: flex; align-items: center; gap: 8px; margin-bottom: 16px; width: 100%;
}
.ctc-divider-line { flex: 1; height: 1px; background: rgba(255,255,255,0.1) }
.ctc-divider-dot  { width: 5px; height: 5px; border-radius: 50%; background: var(--dorado); flex-shrink: 0 }
.ctc-desc {
  font-size: 12.5px; color: rgba(255,255,255,0.4); line-height: 1.75;
}

/* ── COL DERECHA: canales ── */
.ctc-col-canales { display: flex; flex-direction: column; gap: 16px }

/* Teléfono — hero element */
.ctc-tel-hero {
  display: flex; align-items: center; justify-content: space-between;
  gap: 20px; padding: 28px 32px;
  background: var(--dorado);
  text-decoration: none;
  border-left: 5px solid rgba(0,0,0,0.15);
  transition: all .25s;
  position: relative; overflow: hidden;
}
.ctc-tel-hero::before {
  content: ''; position: absolute; top: -20px; right: -20px;
  width: 100px; height: 100px; border-radius: 50%;
  background: rgba(255,255,255,0.1);
}
.ctc-tel-hero:hover { background: #c9aa09; transform: translateX(4px) }
.ctc-tel-hero-left { display: flex; align-items: center; gap: 20px }
.ctc-tel-icon-wrap {
  width: 56px; height: 56px; flex-shrink: 0; border-radius: 50%;
  background: rgba(0,0,0,0.15);
  display: flex; align-items: center; justify-content: center;
}
.ctc-tel-label {
  display: block; font-size: 10px; font-weight: 700; letter-spacing: 2px;
  text-transform: uppercase; color: rgba(0,27,68,0.65);
  font-family: var(--font-cuerpo); margin-bottom: 6px;
}
.ctc-tel-number {
  display: block;
  font-family: var(--font-principal); font-weight: 800; font-stretch: condensed;
  font-size: clamp(32px,5vw,52px); color: var(--azul);
  letter-spacing: 2px; line-height: 1;
}
.ctc-tel-cta {
  font-family: var(--font-principal); font-weight: 700; font-stretch: condensed;
  font-size: 14px; letter-spacing: 1px; text-transform: uppercase;
  color: rgba(0,27,68,0.7); white-space: nowrap;
}

/* Emails */
.ctc-emails-wrap {
  background: var(--azul);
  border-top: 4px solid var(--verde);
  overflow: hidden;
}
.ctc-emails-header {
  padding: 14px 24px;
  border-bottom: 1px solid rgba(255,255,255,0.07);
}
.ctc-emails-title {
  display: flex; align-items: center; gap: 8px;
  font-size: 9px; font-weight: 700; letter-spacing: 3px; text-transform: uppercase;
  color: rgba(255,255,255,0.3); font-family: var(--font-cuerpo);
}

.ctc-email-item {
  display: flex; align-items: center; gap: 16px;
  padding: 20px 24px;
  text-decoration: none;
  border-bottom: 1px solid rgba(255,255,255,0.05);
  transition: background .25s;
  position: relative;
}
.ctc-email-item:last-child { border-bottom: none }
.ctc-email-item:hover { background: rgba(255,255,255,0.04) }
.ctc-email-item:hover .ctc-email-arrow { opacity: 1; transform: translateX(4px) }

.ctc-email-badge {
  flex-shrink: 0;
  font-family: var(--font-cuerpo); font-size: 8px; font-weight: 700;
  letter-spacing: 2px; text-transform: uppercase;
  padding: 3px 8px;
  background: rgba(224,189,11,0.15); color: var(--dorado);
  border: 1px solid rgba(224,189,11,0.25);
}
.ctc-badge-alt {
  background: rgba(58,148,164,0.15); color: var(--verde);
  border-color: rgba(58,148,164,0.25);
}

.ctc-email-body { flex: 1; min-width: 0 }
.ctc-email-label {
  display: block; font-size: 9px; font-weight: 700; letter-spacing: 2px;
  text-transform: uppercase; color: rgba(255,255,255,0.3);
  font-family: var(--font-cuerpo); margin-bottom: 4px;
}
.ctc-email-valor {
  display: block;
  font-family: var(--font-principal); font-weight: 700; font-stretch: condensed;
  font-size: 18px; color: var(--blanco); letter-spacing: 0.5px;
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
.ctc-email-arrow {
  font-size: 18px; color: rgba(255,255,255,0.2);
  opacity: 0; transition: all .25s; flex-shrink: 0;
}

/* ── Sede ── */
.ctc-sede {
  margin-top: 28px;
}
.ctc-sede-inner {
  background: var(--azul);
  border-top: 4px solid rgba(224,189,11,0.3);
  border-left: 4px solid var(--dorado);
  display: flex; align-items: center; gap: 24px;
  padding: 24px 32px;
  position: relative; overflow: hidden;
}
.ctc-sede-deco-left {
  position: absolute; left: 0; top: 0; bottom: 0; width: 4px;
  background: var(--dorado);
}
.ctc-sede-icon { font-size: 32px; flex-shrink: 0; opacity: 0.8 }
.ctc-sede-text { display: flex; flex-direction: column; gap: 4px }
.ctc-sede-label {
  font-size: 9px; font-weight: 700; letter-spacing: 3px; text-transform: uppercase;
  color: rgba(255,255,255,0.3); font-family: var(--font-cuerpo);
}
.ctc-sede-nombre {
  font-family: var(--font-principal); font-weight: 700; font-stretch: condensed;
  font-size: clamp(16px,2vw,22px); text-transform: uppercase; letter-spacing: 1px;
  color: var(--blanco); line-height: 1.1; display: block;
}
.ctc-sede-detalle {
  font-size: 12px; color: rgba(255,255,255,0.35); font-family: var(--font-cuerpo);
}
.ctc-sede-detalle em { color: var(--dorado); font-style: normal; font-weight: 700 }

/* ── Responsive ── */
@media (max-width: 900px) {
  .ctc-layout { grid-template-columns: 1fr }
  .ctc-persona-card { flex-direction: row; text-align: left; align-items: flex-start }
  .ctc-divider-name { display: none }
}
@media (max-width: 640px) {
  .ctc-persona-card { flex-direction: column; text-align: center }
  .ctc-divider-name { display: flex }
  .ctc-tel-hero { flex-direction: column; align-items: flex-start; gap: 12px }
  .ctc-tel-number { font-size: 36px }
  .ctc-tel-cta { display: none }
  .ctc-email-valor { font-size: 14px }
  .ctc-sede-inner { flex-direction: column; text-align: center }
}

/* ════════════════════════════════════════
   CONTACTO — bloque protagonista
════════════════════════════════════════ */
.bloque-contacto-hero {
  position: relative; overflow: hidden;
  padding: 72px 0 64px;
  background: var(--azul);
}
/* Foto de fondo con overlay fuerte */
.contacto-hero-bg {
  position: absolute; inset: 0;
  background: url('sede_cusco_foto03.jpg') center 40% / cover no-repeat;
  opacity: 0.12; pointer-events: none;
}
.contacto-hero-grad {
  position: absolute; inset: 0;
  background:
    url('source/logo-cedelef.svg') center / 420px no-repeat,
    linear-gradient(135deg, rgba(0,27,68,0.97) 0%, rgba(0,27,68,0.85) 100%);
  background-repeat: no-repeat;
  opacity: 1; pointer-events: none;
  /* solo el logo como marca de agua */
  --logo-op: 0.06;
}
/* Marca de agua logo */
.bloque-contacto-hero::before {
  content: '';
  position: absolute; top: 50%; left: 50%;
  transform: translate(-50%,-50%);
  width: 500px; height: 500px;
  background: url('source/logo-cedelef.svg') center / contain no-repeat;
  opacity: 0.05; filter: grayscale(100%); pointer-events: none; z-index: 1;
}

/* Eyebrow */
.contacto-eyebrow {
  display: flex; align-items: center; justify-content: center;
  gap: 16px; margin-bottom: 16px;
  font-family: var(--font-cuerpo); font-size: 16px; font-weight: 700;
  letter-spacing: 3px; text-transform: uppercase; color: var(--dorado);
}
.contacto-eyebrow-line {
  height: 1px; width: 60px;
  background: linear-gradient(to right, transparent, var(--dorado));
}
.contacto-eyebrow-line:last-child {
  background: linear-gradient(to left, transparent, var(--dorado));
}

/* Título protagonista */
.contacto-titulo-hero {
  font-family: var(--font-principal); font-weight: 700; font-stretch: condensed;
  font-size: clamp(32px,5vw,62px); text-transform: uppercase; letter-spacing: 2px;
  color: var(--blanco); text-align: center; line-height: 0.95; margin-bottom: 12px;
}
.contacto-titulo-hero span { color: var(--dorado) }

.contacto-subtitulo {
  text-align: center; font-family: var(--font-cuerpo);
  font-size: 15px; color: rgba(255,255,255,0.5);
  line-height: 1.7; margin-bottom: 40px;
}
.contacto-subtitulo strong { color: rgba(255,255,255,0.8); font-weight: 600 }

/* Card secretario */
.contacto-secretario {
  max-width: 720px; margin: 0 auto 32px;
  background: rgba(255,255,255,0.04);
  border: 1px solid rgba(224,189,11,0.2);
  border-top: 3px solid var(--dorado);
  padding: 32px 36px;
  position: relative;
}

/* Deco circuito top */
.ctc-deco-top { position: absolute; top: 0; left: 0; right: 0; height: 0; pointer-events: none }
.ctc-deco-top-line {
  position: absolute; top: 0; left: 40px; right: 40px; height: 1px;
  background: linear-gradient(to right, transparent, rgba(224,189,11,0.3), transparent);
}
.ctc-deco-top-node {
  position: absolute; top: -5px;
  width: 10px; height: 10px; border-radius: 50%;
  background: var(--dorado); box-shadow: 0 0 8px rgba(224,189,11,0.6);
}
.ctc-deco-top-node.left  { left: 32px }
.ctc-deco-top-node.right { right: 32px }

/* Deco izq */
.ctc-deco-izq {
  position: absolute; left: 0; top: 0; bottom: 0; width: 3px;
  background: linear-gradient(to bottom, var(--dorado) 0%, rgba(224,189,11,0.1) 100%);
}
.ctc-deco-izq::after {
  content: ''; position: absolute; bottom: -5px; left: 50%; transform: translateX(-50%);
  width: 10px; height: 10px; border-radius: 50%;
  border: 2px solid var(--dorado); background: var(--azul);
}

/* Persona */
.ctc-persona { display: flex; align-items: center; gap: 28px }
.ctc-avatar {
  flex-shrink: 0; width: 100px; height: 100px; border-radius: 50%;
  border: 2px solid rgba(224,189,11,0.4);
  background: rgba(224,189,11,0.06);
  display: flex; align-items: center; justify-content: center;
  box-shadow: 0 0 30px rgba(224,189,11,0.1);
}
.ctc-cargo {
  font-size: 9px; font-weight: 700; letter-spacing: 3px;
  text-transform: uppercase; color: var(--dorado);
  display: block; margin-bottom: 6px; font-family: var(--font-cuerpo);
}
.ctc-nombre {
  font-family: var(--font-principal); font-weight: 700; font-stretch: condensed;
  font-size: clamp(20px,2.5vw,30px); text-transform: uppercase;
  letter-spacing: 1px; color: var(--blanco); line-height: 1.1; margin-bottom: 8px;
}
.ctc-desc { font-size: 13px; color: rgba(255,255,255,0.4); line-height: 1.6 }

/* Canales prominentes */
.contacto-canales-hero {
  max-width: 720px; margin: 0 auto;
  display: grid; grid-template-columns: 1fr auto 1fr auto 1fr;
  align-items: stretch;
  background: var(--dorado);
  border-bottom: 3px solid rgba(224,189,11,0.4);
}
.ctc-canal {
  display: flex; align-items: center; gap: 14px;
  padding: 20px 24px; text-decoration: none;
  background: rgba(0,27,68,0.55);
  transition: background .25s;
  border: none;
}
.ctc-canal:hover { background: rgba(0,27,68,0.8) }

/* Canal teléfono con fondo dorado */
.ctc-canal-tel {
  background: var(--dorado);
  border: none;
}
.ctc-canal-tel:hover { background: #c9aa09 }
.ctc-tel-icono {
  background: rgba(0,27,68,0.2) !important;
  border-color: rgba(0,27,68,0.2) !important;
}

.ctc-canal-sep {
  width: 1px;
  background: rgba(224,189,11,0.2);
  flex-shrink: 0;
}

.ctc-canal-icono {
  width: 48px; height: 48px; flex-shrink: 0; border-radius: 50%;
  background: rgba(255,255,255,0.06); border: 1px solid rgba(255,255,255,0.1);
  display: flex; align-items: center; justify-content: center;
}
.ctc-canal-texto { display: flex; flex-direction: column; gap: 3px; min-width: 0 }
.ctc-canal-label {
  font-size: 9px; font-weight: 700; letter-spacing: 2px; text-transform: uppercase;
  color: rgba(255,255,255,0.35); font-family: var(--font-cuerpo);
}
.ctc-canal-valor {
  font-family: var(--font-principal); font-weight: 700; font-stretch: condensed;
  font-size: 15px; color: var(--blanco); letter-spacing: 0.5px;
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}

/* Nota final */
.contacto-nota {
  max-width: 720px; margin: 20px auto 0;
  text-align: center; font-size: 12px; letter-spacing: 1px;
  color: rgba(255,255,255,0.3); font-family: var(--font-cuerpo);
  text-transform: uppercase;
  padding-top: 16px;
  border-top: 1px solid rgba(255,255,255,0.06);
}

/* ── Sede (secundaria) ── */
.bloque-sede { background: var(--gris); position: relative; overflow: hidden; padding: 56px 0 48px }
.bloque-sede::before { content: ''; position: absolute; top: 50%; left: 50%; transform: translate(-50%,-50%); width: 360px; height: 360px; background: url('source/logo-cedelef.svg') center / contain no-repeat; opacity: 0.05; filter: grayscale(100%); pointer-events: none; z-index: 0 }
.bloque-sede > * { position: relative; z-index: 1 }

.sede-layout { display: grid; grid-template-columns: 1fr 1fr; gap: 28px; align-items: stretch }

.sede-info { background: var(--azul); padding: 32px; border-top: 4px solid var(--dorado); display: flex; flex-direction: column; gap: 18px }
.sede-icon { font-size: 36px; line-height: 1 }
.sede-nombre { font-family: var(--font-principal); font-weight: 700; font-stretch: condensed; font-size: clamp(18px,2.2vw,24px); text-transform: uppercase; letter-spacing: 1px; color: var(--blanco); line-height: 1.1 }
.sede-detalle-list { display: flex; flex-direction: column; gap: 10px }
.sede-detalle-item { display: flex; align-items: flex-start; gap: 12px; padding-bottom: 10px; border-bottom: 1px solid rgba(255,255,255,0.06) }
.sede-detalle-item:last-child { border-bottom: none }
.sede-detalle-dot { width: 8px; height: 8px; border-radius: 50%; flex-shrink: 0; margin-top: 4px; background: var(--dorado); box-shadow: 0 0 6px rgba(224,189,11,0.5) }
.sede-detalle-label { font-size: 9px; font-weight: 700; letter-spacing: 2px; text-transform: uppercase; color: var(--dorado); display: block; margin-bottom: 2px; font-family: var(--font-cuerpo) }
.sede-detalle-valor { font-family: var(--font-principal); font-weight: 700; font-stretch: condensed; font-size: 15px; color: var(--blanco); text-transform: uppercase; letter-spacing: 0.5px }
.sede-organiza { margin-top: auto; padding-top: 18px; border-top: 1px solid rgba(255,255,255,0.08) }
.sede-organiza-label { display: flex; align-items: center; gap: 10px; font-size: 9px; font-weight: 700; letter-spacing: 3px; text-transform: uppercase; color: rgba(255,255,255,0.4); font-family: var(--font-cuerpo); margin-bottom: 14px }
.sede-organiza-logos { display: flex; align-items: center; gap: 20px; flex-wrap: wrap }
.sede-mapa { min-height: 320px; overflow: hidden; border: 2px solid rgba(224,189,11,0.2); border-top: 4px solid var(--verde) }
.sede-mapa iframe { width: 100%; height: 100%; min-height: 320px; display: block }

/* ── Responsive contacto ── */
@media (max-width: 900px) {
  .contacto-canales-hero { grid-template-columns: 1fr; grid-template-rows: auto }
  .ctc-canal-sep { width: 100%; height: 1px }
  .sede-layout { grid-template-columns: 1fr }
}
@media (max-width: 640px) {
  .contacto-secretario { padding: 24px 20px }
  .ctc-persona { flex-direction: column; text-align: center }
  .ctc-nombre { font-size: 20px }
  .ctc-canal { padding: 16px 18px }
  .ctc-canal-valor { font-size: 13px }
}

/* ════════════════════════════════════════
   ORGANIZADORES
════════════════════════════════════════ */

/* ── Bloque Nosotros ── */
.bloque-nosotros {
  background: #fff; position: relative; overflow: hidden; padding: 64px 0 56px;
}
.bloque-nosotros::before {
  content: ''; position: absolute; top: 50%; left: 50%;
  transform: translate(-50%,-50%); width: 460px; height: 460px;
  background: url('source/logo-cedelef.svg') center / contain no-repeat;
  opacity: 0.06; filter: grayscale(100%); pointer-events: none; z-index: 0;
}
.bloque-nosotros > * { position: relative; z-index: 1 }

.nosotros-layout {
  display: grid; grid-template-columns: 100px 1fr;
  gap: 32px; align-items: start;
}

/* Columna icono lateral con línea circuito */
.nosotros-icon-col { display: flex; flex-direction: column; align-items: center; gap: 0 }
.nosotros-icon-wrap {
  width: 90px; height: 90px; border-radius: 50%;
  background: rgba(224,189,11,0.08); border: 2px solid rgba(224,189,11,0.3);
  display: flex; align-items: center; justify-content: center;
  flex-shrink: 0; box-shadow: 0 0 20px rgba(224,189,11,0.1);
}
.nosotros-icon-line {
  width: 2px; flex: 1; min-height: 60px;
  background: linear-gradient(to bottom, var(--dorado), transparent);
  margin-top: 8px;
}

/* Contenido */
.nosotros-contenido { padding-top: 4px }
.nosotros-tag {
  display: inline-block;
  font-family: var(--font-cuerpo); font-size: 9px; font-weight: 700;
  letter-spacing: 3px; text-transform: uppercase;
  color: var(--dorado); background: rgba(224,189,11,0.08);
  border: 1px solid rgba(224,189,11,0.25); padding: 4px 12px;
  margin-bottom: 12px;
}
.nosotros-titulo {
  font-family: var(--font-principal); font-weight: 700; font-stretch: condensed;
  font-size: clamp(24px,3.5vw,44px); text-transform: uppercase; letter-spacing: 2px;
  color: var(--azul); line-height: 1; margin-bottom: 14px;
}
.nosotros-titulo span { color: var(--dorado) }
.nosotros-lead {
  font-family: var(--font-principal); font-weight: 700; font-stretch: condensed;
  font-size: clamp(16px,2vw,22px); color: var(--azul); margin-bottom: 12px;
  text-transform: uppercase; letter-spacing: 0.5px;
}
.nosotros-texto {
  font-size: 15px; color: rgba(0,27,68,0.6); line-height: 1.75;
  margin-bottom: 10px;
}

/* ── Bloque ¿Qué es? ── */
.bloque-que-es {
  background: var(--gris); position: relative; overflow: hidden; padding: 64px 0 56px;
}
.bloque-que-es::before {
  content: ''; position: absolute; top: 50%; left: 50%;
  transform: translate(-50%,-50%); width: 420px; height: 420px;
  background: url('source/logo-cedelef.svg') center / contain no-repeat;
  opacity: 0.05; filter: grayscale(100%); pointer-events: none; z-index: 0;
}
.bloque-que-es > * { position: relative; z-index: 1 }

.que-es-header { margin-bottom: 28px }
.que-es-textos { max-width: 820px }
.que-es-p {
  color: rgba(0,27,68,0.65); 
  margin-bottom: 16px;
}
.que-es-destacado {
  display: flex; gap: 20px; align-items: flex-start;
  margin-top: 24px; padding: 20px 24px;
  background: var(--azul); border-left: 4px solid var(--dorado);
}
.que-es-destacado-linea {
  width: 3px; flex-shrink: 0; background: var(--dorado);
  border-radius: 2px; min-height: 100%; display: none;
}
.que-es-destacado p {
  font-family: var(--font-principal); font-weight: 700; font-stretch: condensed;
  font-size: clamp(16px,2vw,20px); text-transform: uppercase; letter-spacing: 0.5px;
  color: var(--blanco); line-height: 1.5; margin: 0;
}

/* ── Bloque Visión Misión Propósito ── */
.bloque-vmp {
  background: #fff; position: relative; overflow: hidden; padding: 64px 0 56px;
}
.bloque-vmp::before {
  content: ''; position: absolute; top: 50%; left: 50%;
  transform: translate(-50%,-50%); width: 460px; height: 460px;
  background: url('source/logo-cedelef.svg') center / contain no-repeat;
  opacity: 0.06; filter: grayscale(100%); pointer-events: none; z-index: 0;
}
.bloque-vmp > * { position: relative; z-index: 1 }

.vmp-grid {
  display: grid; grid-template-columns: repeat(3,1fr);
  gap: 24px;
}

.vmp-card {
  background: var(--azul); padding: 32px 28px;
  position: relative; overflow: hidden;
  border-top: 4px solid transparent;
  transition: transform .3s, box-shadow .3s;
}
.vmp-card.vision   { border-top-color: var(--dorado) }
.vmp-card.mision   { border-top-color: var(--verde) }
.vmp-card.proposito{ border-top-color: var(--dorado) }
.vmp-card:hover { transform: translateY(-4px); box-shadow: 0 16px 40px rgba(0,27,68,0.3) }

/* Decos circuito en la card */
.vmp-card-outer { position: absolute; inset: 0; pointer-events: none }
.vmp-deco-top {
  position: absolute; top: 0; left: 24px; right: 24px; height: 1px;
  background: linear-gradient(to right, transparent, rgba(255,255,255,0.06), transparent);
}
.vmp-deco-izq {
  position: absolute; left: 0; top: 0; bottom: 0; width: 2px;
  background: linear-gradient(to bottom, rgba(255,255,255,0.06), transparent);
}

.vmp-icon {
  width: 60px; height: 60px; border-radius: 50%;
  background: rgba(255,255,255,0.05); border: 1px solid rgba(255,255,255,0.1);
  display: flex; align-items: center; justify-content: center;
  margin-bottom: 16px;
}
.vmp-label {
  font-family: var(--font-principal); font-weight: 700; font-stretch: condensed;
  font-size: clamp(18px,2vw,24px); text-transform: uppercase; letter-spacing: 1.5px;
  color: var(--blanco); display: block; margin-bottom: 12px; line-height: 1;
}
.vmp-card.vision   .vmp-label { color: var(--dorado) }
.vmp-card.mision   .vmp-label { color: var(--verde) }
.vmp-card.proposito .vmp-label{ color: var(--dorado) }
.vmp-texto {
  font-size: 18px; color: rgba(255,255,255,0.75); line-height: 1.7; text-align: justify;
}

/* ── Bloque Enfoque ── */
.bloque-enfoque {
  background: var(--gris); position: relative; overflow: hidden; padding: 64px 0 56px;
}
.bloque-enfoque::before {
  content: ''; position: absolute; top: 50%; left: 50%;
  transform: translate(-50%,-50%); width: 420px; height: 420px;
  background: url('source/logo-cedelef.svg') center / contain no-repeat;
  opacity: 0.05; filter: grayscale(100%); pointer-events: none; z-index: 0;
}
.bloque-enfoque > * { position: relative; z-index: 1 }

.enfoque-layout {
  display: grid; grid-template-columns: 100px 1fr;
  gap: 32px; align-items: start;
}

.enfoque-items {
  display: flex; flex-direction: column; gap: 12px;
  margin-top: 20px; padding-top: 20px;
  border-top: 1px solid rgba(0,27,68,0.08);
}
.enfoque-item {
  display: flex; align-items: flex-start; gap: 12px;
  font-size: 14px; color: rgba(0,27,68,0.65); line-height: 1.5;
}
.enfoque-dot {
  width: 8px; height: 8px; border-radius: 50%; flex-shrink: 0;
  margin-top: 5px; background: var(--verde);
  box-shadow: 0 0 6px rgba(58,148,164,0.5);
}

/* ── Bloque Organizadores cards ── */
.bloque-organizadores-cards {
  background: #fff; position: relative; overflow: hidden; padding: 64px 0 56px;
}
.bloque-organizadores-cards::before {
  content: ''; position: absolute; top: 50%; left: 50%;
  transform: translate(-50%,-50%); width: 460px; height: 460px;
  background: url('source/logo-cedelef.svg') center / contain no-repeat;
  opacity: 0.06; filter: grayscale(100%); pointer-events: none; z-index: 0;
}
.bloque-organizadores-cards > * { position: relative; z-index: 1 }

.org-cards-grid {
  display: grid; grid-template-columns: repeat(3,1fr); gap: 20px;
}

.org-card {
  display: flex; flex-direction: column; align-items: center;
  text-align: center; gap: 20px;
  background: var(--azul); padding: 36px 24px;
  border-top: 4px solid var(--dorado);
  transition: transform .3s, box-shadow .3s;
  position: relative; overflow: hidden;
}
.org-card::after {
  content: ''; position: absolute; bottom: -20px; right: -20px;
  width: 80px; height: 80px; border-radius: 50%;
  background: var(--dorado); opacity: 0.06;
}
.org-card:hover { transform: translateY(-4px); box-shadow: 0 16px 40px rgba(0,27,68,0.25) }

.org-card-logo {
  width: 140px; height: 80px;
  display: flex; align-items: center; justify-content: center;
  background: rgba(255,255,255,0.05); border: 1px solid rgba(255,255,255,0.08);
  padding: 16px;
}
.org-card-nombre {
  font-family: var(--font-principal); font-weight: 700; font-stretch: condensed;
  font-size: 20px; text-transform: uppercase; letter-spacing: 1px;
  color: var(--dorado); display: block; line-height: 1.1;
}
.org-card-desc {
  font-size: 12px; color: rgba(255,255,255,0.4); line-height: 1.6;
}

/* ── Responsive organizadores ── */
@media (max-width: 900px) {
  .vmp-grid          { grid-template-columns: 1fr }
  .org-cards-grid    { grid-template-columns: 1fr }
  .nosotros-layout,
  .enfoque-layout    { grid-template-columns: 1fr }
  .nosotros-icon-col { display: none }
}
@media (max-width: 640px) {
  .vmp-grid          { grid-template-columns: 1fr }
  .que-es-destacado  { flex-direction: column; gap: 12px }
}

/* ════════════════════════════════════════
   ORGANIZADORES — estilos adicionales
════════════════════════════════════════ */

/* ── ¿Qué es CEDELEF? dos columnas ── */
.bloque-que-es {
  background: var(--gris); position: relative; overflow: hidden; padding: 64px 0 56px;
}
.bloque-que-es::before {
  content: ''; position: absolute; top: 50%; left: 50%;
  transform: translate(-50%,-50%); width: 420px; height: 420px;
  background: url('source/logo-cedelef.svg') center / contain no-repeat;
  opacity: 0.05; filter: grayscale(100%); pointer-events: none; z-index: 0;
}
.bloque-que-es > * { position: relative; z-index: 1 }

.que-es-grid {
  display: grid; grid-template-columns: 1fr 1fr;
  gap: 56px; align-items: center;
}
.que-es-linea-dec {
  width: 48px; height: 3px; background: var(--dorado);
  margin: 12px 0 20px;
}
.que-es-p {
   color: rgba(0,27,68,0.65); margin-bottom: 14px; text-align: justify;
}
.que-es-destacado {
  margin-top: 20px; padding: 20px 24px;
  background: var(--azul); border-left: 4px solid var(--dorado);
}
.que-es-destacado p {
  font-family: var(--font-principal); font-weight: 700; font-stretch: condensed;
  font-size: clamp(15px,1.8vw,17px); text-transform: uppercase; letter-spacing: 0.5px;
  color: var(--blanco); line-height: 1.5; margin: 0;
}

/* Imagen derecha con overlay */
.que-es-img-frame {
  position: relative; overflow: hidden;
  margin-top: 55px;
  border-top: 4px solid var(--dorado);
  border-bottom: 2px solid rgba(224,189,11,0.2);
}
.que-es-img-placeholder {
  position: relative; width: 100%;
  background: var(--azul); overflow: hidden;
}
.que-es-img-overlay {
  position: absolute; bottom: 0; left: 0; right: 0;
  background: linear-gradient(to top, rgba(0,27,68,0.9) 0%, transparent 70%);
  padding: 20px 20px 16px;
}
.que-es-img-badge {
  font-family: var(--font-principal); font-weight: 700; font-stretch: condensed;
  font-size: 13px; letter-spacing: 2px; text-transform: uppercase;
  color: var(--dorado); background: rgba(224,189,11,0.15);
  border: 1px solid rgba(224,189,11,0.3); padding: 3px 10px;
  display: inline-block; margin-bottom: 6px;
}
.que-es-img-caption {
  font-size: 13px; color: rgba(255,255,255,0.5); font-family: var(--font-cuerpo); margin: 0;
}

/* ── Enfoque Estratégico — fondo azul oscuro ── */
.bloque-enfoque-estrategico {
  background: var(--azul); position: relative; overflow: hidden; padding: 72px 0 64px;
}
.bloque-enfoque-estrategico::before {
  content: ''; position: absolute; top: 50%; left: 50%;
  transform: translate(-50%,-50%); width: 500px; height: 500px;
  background: url('source/logo-cedelef.svg') center / contain no-repeat;
  opacity: 0.05; filter: grayscale(100%); pointer-events: none; z-index: 0;
}
.bloque-enfoque-estrategico > * { position: relative; z-index: 1 }

.enfoque-bloques {
  display: grid; grid-template-columns: 1fr auto 1fr auto 1fr;
  gap: 0; align-items: start;
  margin-top: 8px;
}

.enfoque-bloque {
  background: rgba(255,255,255,0.04);
  border: 1px solid rgba(255,255,255,0.07);
  border-top: 3px solid var(--dorado);
  padding: 28px 24px;
  transition: background .25s;
}
.enfoque-bloque:hover { background: rgba(255,255,255,0.07) }
.enfoque-bloque:nth-child(3) { border-top-color: var(--verde) }
.enfoque-bloque:nth-child(3) .enfoque-bloque-titulo span { color: var(--verde) }
.enfoque-bloque:nth-child(5) .enfoque-bloque-titulo span { color: var(--dorado) }

.enfoque-bloque-icon {
  width: 60px; height: 60px; border-radius: 50%;
  background: rgba(255,255,255,0.05); border: 1px solid rgba(255,255,255,0.1);
  display: flex; align-items: center; justify-content: center;
  margin-bottom: 16px;
}
.enfoque-bloque-titulo {
  font-family: var(--font-principal); font-weight: 700; font-stretch: condensed;
  font-size: clamp(16px,1.8vw,20px); text-transform: uppercase; letter-spacing: 1px;
  color: var(--blanco); margin-bottom: 14px; line-height: 1.1;
}
.enfoque-bloque-titulo span { color: var(--dorado) }
.enfoque-bloque-lista {
  list-style: none; display: flex; flex-direction: column; gap: 8px;
}
.enfoque-bloque-lista li {
  display: flex; align-items: flex-start; gap: 8px;
  font-size: 13px; color: rgba(255,255,255,0.5); line-height: 1.5;
  padding-bottom: 8px; border-bottom: 1px solid rgba(255,255,255,0.05);
}
.enfoque-bloque-lista li:last-child { border-bottom: none }
.enfoque-bloque-lista li::before {
  content: ''; width: 6px; height: 6px; border-radius: 50%; flex-shrink: 0;
  margin-top: 6px; background: var(--dorado);
}
.enfoque-bloque:nth-child(3) .enfoque-bloque-lista li::before { background: var(--verde) }

/* Separadores circuito entre bloques */
.enfoque-sep {
  display: flex; flex-direction: column; align-items: center;
  justify-content: center; padding: 28px 0; gap: 6px;
}
.enfoque-sep-line { width: 1px; flex: 1; background: rgba(224,189,11,0.2) }
.enfoque-sep-node {
  width: 10px; height: 10px; border-radius: 50%; flex-shrink: 0;
  border: 1.5px solid var(--dorado); background: var(--azul);
  box-shadow: 0 0 6px rgba(224,189,11,0.4);
}

/* ── CEDELEF en Cifras ── */
.bloque-cifras {
  background: #fff; position: relative; overflow: hidden; padding: 64px 0 56px;
}
.bloque-cifras::before {
  content: ''; position: absolute; top: 50%; left: 50%;
  transform: translate(-50%,-50%); width: 460px; height: 460px;
  background: url('source/logo-cedelef.svg') center / contain no-repeat;
  opacity: 0.06; filter: grayscale(100%); pointer-events: none; z-index: 0;
}
.bloque-cifras > * { position: relative; z-index: 1 }

.cifras-grid {
  display: grid; grid-template-columns: repeat(4,1fr); gap: 20px;
}
.cifra-card {
  background: var(--azul); padding: 32px 24px; text-align: center;
  position: relative; overflow: hidden;
  transition: transform .3s, box-shadow .3s;
}
.cifra-card:hover { transform: translateY(-4px); box-shadow: 0 16px 40px rgba(0,27,68,0.2) }
.cifra-deco-top {
  position: absolute; top: 0; left: 0; right: 0; height: 3px;
  background: linear-gradient(to right, var(--dorado), rgba(224,189,11,0.2));
}
.cifra-numero {
  font-family: var(--font-principal); font-weight: 800; font-stretch: condensed;
  font-size: clamp(36px,4vw,56px); color: var(--dorado); display: block;
  line-height: 1; margin-bottom: 6px;
}
.cifra-unidad {
  font-family: var(--font-principal); font-weight: 700; font-stretch: condensed;
  font-size: 14px; text-transform: uppercase; letter-spacing: 1.5px;
  color: var(--blanco); display: block; margin-bottom: 10px;
}
.cifra-desc {
  font-size: 12px; color: rgba(255,255,255,0.4); line-height: 1.6;
}

/* ── Galería ── */
.bloque-galeria {
  background: var(--gris); position: relative; overflow: hidden; padding: 64px 0 56px;
}
.bloque-galeria::before {
  content: ''; position: absolute; top: 50%; left: 50%;
  transform: translate(-50%,-50%); width: 420px; height: 420px;
  background: url('source/logo-cedelef.svg') center / contain no-repeat;
  opacity: 0.05; filter: grayscale(100%); pointer-events: none; z-index: 0;
}
.bloque-galeria > * { position: relative; z-index: 1 }

.galeria-grid {
  display: grid;
  grid-template-columns: 2fr 1fr 1fr;
  grid-template-rows: 220px 220px;
  gap: 8px;
}
.galeria-item { overflow: hidden; position: relative }
.galeria-large { grid-row: 1 / 3 }   /* ocupa 2 filas */
.galeria-item:nth-child(2) { grid-column: 2; grid-row: 1 }
.galeria-item:nth-child(3) { grid-column: 3; grid-row: 1 }
.galeria-item:nth-child(4) { grid-column: 2; grid-row: 2 }
.galeria-item:nth-child(5) { grid-column: 3; grid-row: 2 }

.galeria-placeholder {
  width: 100%; height: 100%;
  background: var(--azul); position: relative; overflow: hidden;
  cursor: pointer; transition: transform .3s;
}
.galeria-placeholder:hover { transform: scale(1.02) }
.galeria-inner-placeholder {
  width: 100%; height: 100%;
  display: flex; flex-direction: column; align-items: center; justify-content: center;
  gap: 8px; background: rgba(0,27,68,0.6);
  border: 1px solid rgba(255,255,255,0.06);
}
.galeria-inner-placeholder span:first-child { font-size: 28px }
.galeria-inner-placeholder span:last-child {
  font-family: var(--font-principal); font-weight: 700; font-stretch: condensed;
  font-size: 12px; text-transform: uppercase; letter-spacing: 2px;
  color: rgba(255,255,255,0.3);
}
.galeria-overlay {
  position: absolute; bottom: 0; left: 0; right: 0;
  background: linear-gradient(to top, rgba(0,27,68,0.85) 0%, transparent 60%);
  padding: 16px; z-index: 2;
}
.galeria-overlay span {
  font-family: var(--font-principal); font-weight: 700; font-stretch: condensed;
  font-size: 15px; letter-spacing: 1px; text-transform: uppercase; color: var(--blanco);
}

/* ── Responsive organizadores ── */
@media (max-width: 900px) {
  .que-es-grid       { grid-template-columns: 1fr }
  .enfoque-bloques   { grid-template-columns: 1fr; grid-template-rows: auto }
  .enfoque-sep       { flex-direction: row; padding: 0 0 16px; height: 20px }
  .enfoque-sep-line  { width: auto; height: 1px; flex: 1 }
  .cifras-grid       { grid-template-columns: repeat(2,1fr) }
  .galeria-grid      { grid-template-columns: 1fr 1fr; grid-template-rows: 200px 200px 200px }
  .galeria-large     { grid-row: 1; grid-column: 1 / 3 }
}
@media (max-width: 640px) {
  .cifras-grid       { grid-template-columns: 1fr }
  .galeria-grid      { grid-template-columns: 1fr; grid-template-rows: repeat(5,180px) }
  .galeria-large     { grid-column: 1; grid-row: 1 }
  .galeria-item:nth-child(2), .galeria-item:nth-child(3),
  .galeria-item:nth-child(4), .galeria-item:nth-child(5) { grid-column: 1 }
}

/* ════════════════════════════════════════
   SEDE
════════════════════════════════════════ */

/* ── Bloque ciudad ── */
.bloque-sede-ciudad {
  background: #fff; position: relative; overflow: hidden; padding: 64px 0 56px;
}
.bloque-sede-ciudad::before {
  content: ''; position: absolute; top: 50%; left: 50%;
  transform: translate(-50%,-50%); width: 480px; height: 480px;
  background: url('source/logo-cedelef.svg') center / contain no-repeat;
  opacity: 0.06; filter: grayscale(100%); pointer-events: none; z-index: 0;
}
.bloque-sede-ciudad > * { position: relative; z-index: 1 }

/* Layout: texto izq + fotos der */
.sede-ciudad-grid {
  display: grid; grid-template-columns: 1fr 300px;
  gap: 48px; align-items: start;
}
.sede-ciudad-texto { display: flex; flex-direction: column; gap: 0 }

/* ¿Por qué Cusco? */
.sede-porq-grid {
  display: grid; grid-template-columns: 1fr 1fr; gap: 12px;
  margin-top: 24px; padding-top: 20px;
  border-top: 1px solid rgba(0,27,68,0.08);
}
.sede-porq-item {
  display: flex; align-items: flex-start; gap: 12px;
  padding: 14px 16px; background: var(--gris);
  border-left: 3px solid var(--dorado);
  transition: border-color .25s;
}
.sede-porq-item:hover { border-left-color: var(--verde) }
.sede-porq-icon { font-size: 22px; flex-shrink: 0; line-height: 1 }
.sede-porq-titulo {
  font-family: var(--font-principal); font-weight: 700; font-stretch: condensed;
  font-size: 14px; text-transform: uppercase; letter-spacing: 0.5px;
  color: var(--azul); display: block; margin-bottom: 3px;
}
.sede-porq-desc { font-size: 12px; color: rgba(0,27,68,0.5); line-height: 1.5; margin: 0 }

/* ── Columna de fotos 3 en vertical (compartida) ── */
.sede-fotos-col {
  display: flex; flex-direction: column; gap: 8px;
  position: relative;
}
.sede-foto-item {
  position: relative; overflow: hidden;
  height: 250px; background: var(--azul);
  border-left: 3px solid var(--dorado);
  transition: transform .3s;
}
.sede-foto-item.sede-foto-main { height: 250px }
.sede-foto-item:hover { transform: scale(1.02) }
.sede-foto-item img {
  width: 100%; height: 100%; object-fit: cover;
  display: block; transition: transform .4s;
}
.sede-foto-item:hover img { transform: scale(1.05) }
/* Placeholder cuando no hay imagen */
.sede-foto-item.sede-foto-placeholder {
  border: 2px dashed rgba(224,189,11,0.3);
  border-left: 3px solid var(--dorado);
  display: flex; align-items: center; justify-content: center;
}
.sede-foto-item.sede-foto-placeholder::after {
  content: '📷';
  font-size: 28px; opacity: 0.3;
}
.sede-foto-overlay {
  position: absolute; bottom: 0; left: 0; right: 0;
  background: linear-gradient(to top, rgba(0,27,68,0.75) 0%, transparent 70%);
  padding: 8px 12px; z-index: 2;
}
.sede-foto-overlay span {
  font-family: var(--font-principal); font-weight: 700; font-stretch: condensed;
  font-size: 12px; letter-spacing: 1px; text-transform: uppercase;
  color: rgba(255,255,255,0.8);
}

/* ── Centro de Convenciones ── */
.bloque-centro-conv {
  background: var(--gris); position: relative; overflow: hidden; padding: 64px 0 56px;
}
.bloque-centro-conv::before {
  content: ''; position: absolute; top: 50%; left: 50%;
  transform: translate(-50%,-50%); width: 420px; height: 420px;
  background: url('source/logo-cedelef.svg') center / contain no-repeat;
  opacity: 0.05; filter: grayscale(100%); pointer-events: none; z-index: 0;
}
.bloque-centro-conv > * { position: relative; z-index: 1 }

.conv-layout {
  display: grid; grid-template-columns: 1fr 300px;
  gap: 48px; align-items: start; margin-bottom: 40px;
}
.conv-info-tag {
  display: flex; align-items: center; gap: 10px;
  font-family: var(--font-cuerpo); font-size: 9px; font-weight: 700;
  letter-spacing: 3px; text-transform: uppercase; color: var(--dorado);
  margin-bottom: 14px;
}
.conv-info-tag-dot {
  width: 8px; height: 8px; border-radius: 50%; flex-shrink: 0;
  background: var(--dorado); box-shadow: 0 0 6px rgba(224,189,11,0.6);
}
.conv-nombre {
  font-family: var(--font-principal); font-weight: 700; font-stretch: condensed;
  font-size: clamp(20px,2.5vw,28px); text-transform: uppercase; letter-spacing: 1px;
  color: var(--azul); line-height: 1.1; margin-bottom: 14px;
}
.conv-desc {
   color: rgba(0,27,68,0.65);  margin-bottom: 10px;
}
.conv-desc strong { color: var(--azul); font-weight: 700 }

.conv-accesos { margin-top: 20px; padding-top: 20px; border-top: 1px solid rgba(0,27,68,0.08) }
.conv-accesos-label {
  font-family: var(--font-principal); font-weight: 700; font-stretch: condensed;
  text-transform: uppercase; letter-spacing: 1px;
  color: var(--azul); display: block; margin-bottom: 12px;
}
.conv-accesos-grid { display: flex; flex-direction: column; gap: 8px; margin-bottom: 12px }
.conv-acceso-item {
  font-size: 19px;
  display: flex; align-items: center; gap: 10px;
 color: rgba(0,27,68,0.65); line-height: 1.4;
}
.conv-acceso-dot {
  width: 6px; height: 6px; border-radius: 50%; flex-shrink: 0;
  background: var(--verde); box-shadow: 0 0 4px rgba(58,148,164,0.5);
}
.conv-accesos-nota {
  font-size: 16px; color: rgba(0,27,68,0.4); font-style: italic; margin: 0;
}
.conv-link {
  display: inline-flex; align-items: center; gap: 8px; margin-top: 20px;
  font-family: var(--font-principal); font-weight: 700; font-stretch: condensed;
  
   text-transform: uppercase; letter-spacing: 0.5px;
  text-decoration: none; color: var(--verde);
  border-bottom: 1px solid rgba(58,148,164,0.3);
  padding-bottom: 2px; transition: color .25s, border-color .25s;
}
.conv-link:hover { color: var(--dorado); border-bottom-color: rgba(224,189,11,0.5) }

/* Mapa */
.conv-mapa { background: var(--azul); border-top: 4px solid var(--dorado); overflow: hidden }
.conv-mapa-header {
  display: flex; align-items: center; gap: 16px; padding: 14px 20px;
  border-bottom: 1px solid rgba(255,255,255,0.06);
}
.conv-mapa-label {
  font-family: var(--font-principal); font-weight: 700; font-stretch: condensed;
  font-size: 14px; text-transform: uppercase; letter-spacing: 1px; color: var(--dorado);
}
.conv-mapa-dir { font-size: 13px; color: rgba(255,255,255,0.4); font-family: var(--font-cuerpo) }
.conv-mapa-frame { position: relative }

/* ── Lugares cercanos ── */
.bloque-lugares {
  background: #fff; position: relative; overflow: hidden; padding: 64px 0 56px;
}
.bloque-lugares::before {
  content: ''; position: absolute; top: 50%; left: 50%;
  transform: translate(-50%,-50%); width: 460px; height: 460px;
  background: url('source/logo-cedelef.svg') center / contain no-repeat;
  opacity: 0.06; filter: grayscale(100%); pointer-events: none; z-index: 0;
}
.bloque-lugares > * { position: relative; z-index: 1 }

.lugares-grid {
  display: grid; grid-template-columns: 1fr 1fr 280px;
  gap: 32px; align-items: start;
}
.lugar-grupo {
  background: var(--azul); padding: 28px 24px;
  border-top: 4px solid transparent;
  height: 100%;
}
.lugar-grupo:first-child { border-top-color: var(--verde) }
.lugar-grupo:nth-child(2){ border-top-color: var(--dorado) }

.lugar-grupo-header {
  display: flex; align-items: center; gap: 12px; margin-bottom: 18px;
  padding-bottom: 14px; border-bottom: 1px solid rgba(255,255,255,0.08);
}
.lugar-grupo-icono { font-size: 28px; line-height: 1 }
.lugar-grupo-titulo {
  font-family: var(--font-principal); font-weight: 700; font-stretch: condensed;
  font-size: 18px; text-transform: uppercase; letter-spacing: 1px; color: var(--blanco);
}
.lugar-lista { list-style: none; display: flex; flex-direction: column; gap: 10px }
.lugar-lista li {
  display: flex; align-items: center; gap: 10px;
  font-size: 18px; color: rgba(255,255,255,0.55); line-height: 1.4;
  padding-bottom: 10px; border-bottom: 1px solid rgba(255,255,255,0.05);
}
.lugar-lista li:last-child { border-bottom: none }
.lugar-dot {
  width: 7px; height: 7px; border-radius: 50%; flex-shrink: 0;
  background: var(--verde);
}

/* ── Cita final ── */
.bloque-sede-cita {
  background: var(--azul); padding: 64px 0; position: relative; overflow: hidden;
}
.bloque-sede-cita::before {
  content: ''; position: absolute; top: 50%; left: 50%;
  transform: translate(-50%,-50%); width: 460px; height: 460px;
  background: url('source/logo-cedelef.svg') center / contain no-repeat;
  opacity: 0.04; filter: grayscale(100%); pointer-events: none;
}
.sede-cita {
  max-width: 760px; margin: 0 auto; text-align: center;
  display: flex; flex-direction: column; align-items: center; gap: 20px;
  position: relative; z-index: 1;
}
.sede-cita-linea { width: 80px; height: 2px; background: var(--dorado); opacity: 0.5 }
.sede-cita-texto {
  font-family: var(--font-principal); font-weight: 700; font-stretch: condensed;
  font-size: clamp(18px,2.5vw,26px); text-transform: uppercase; letter-spacing: 1px;
  color: var(--blanco); line-height: 1.5; margin: 0; font-style: normal;
}
.sede-cita-firma {
  font-size: 21px; letter-spacing: 3px; text-transform: uppercase;
  color: var(--dorado); font-family: var(--font-cuerpo); margin: 0;
}

/* ── Responsive sede ── */
@media (max-width: 900px) {
  .sede-ciudad-grid { grid-template-columns: 1fr }
  .conv-layout      { grid-template-columns: 1fr }
  .lugares-grid     { grid-template-columns: 1fr }
  .sede-porq-grid   { grid-template-columns: 1fr }
  /* Las fotos en responsive van en fila cuando están solas */
  .sede-fotos-col   { flex-direction: row }
  .sede-foto-item   { flex: 1; height: 180px }
  .sede-foto-item.sede-foto-main { flex: 1.2 }
}
@media (max-width: 640px) {
  .sede-fotos-col   { flex-direction: column }
  .sede-foto-item   { height: 180px; flex: none }
  .sede-foto-item.sede-foto-main { height: 220px }
}

/* ════════════════════════════════════════
   TEMÁTICA
════════════════════════════════════════ */

/* ── Tema central ── */
.bloque-tema-central {
  background: var(--azul); position: relative; overflow: hidden; padding: 64px 0 56px;
}
.bloque-tema-central::before {
  content: ''; position: absolute; top: 50%; left: 50%;
  transform: translate(-50%,-50%); width: 500px; height: 500px;
  background: url('source/logo-cedelef.svg') center / contain no-repeat;
  opacity: 0.05; filter: grayscale(100%); pointer-events: none; z-index: 0;
}
.bloque-tema-central > * { position: relative; z-index: 1 }

/* Card del tema central */
.tema-central-wrap {
  max-width: 820px; margin: 0 auto 48px;
  position: relative;
  background: rgba(255,255,255,0.04);
  border: 1px solid rgba(224,189,11,0.2);
  border-top: 4px solid var(--dorado);
  padding: 40px 48px;
  text-align: center;
}
.tema-central-deco-top { position: absolute; top: 0; left: 0; right: 0; height: 0; pointer-events: none }
.tema-central-deco-line {
  position: absolute; top: -2px; left: 40px; right: 40px; height: 1px;
  background: linear-gradient(to right, transparent, rgba(224,189,11,0.4), transparent);
}
.tema-central-deco-node {
  position: absolute; top: -7px;
  width: 12px; height: 12px; border-radius: 50%;
  background: var(--dorado); box-shadow: 0 0 10px rgba(224,189,11,0.7);
}
.tema-central-deco-node.left  { left: 32px }
.tema-central-deco-node.right { right: 32px }
.tema-central-deco-izq {
  position: absolute; left: 0; top: 0; bottom: 0; width: 3px;
  background: linear-gradient(to bottom, var(--dorado), rgba(224,189,11,0.1));
}
.tema-central-deco-izq::after {
  content: ''; position: absolute; bottom: -5px; left: 50%; transform: translateX(-50%);
  width: 10px; height: 10px; border-radius: 50%;
  border: 2px solid var(--dorado); background: var(--azul);
}

.tema-central-inner { position: relative; z-index: 1 }
.tema-central-tag {
  display: inline-block; font-family: var(--font-cuerpo); font-size: 9px; font-weight: 700;
  letter-spacing: 3px; text-transform: uppercase; color: var(--dorado);
  background: rgba(224,189,11,0.08); border: 1px solid rgba(224,189,11,0.25);
  padding: 4px 14px; margin-bottom: 16px;
}
.tema-central-titulo {
  font-family: var(--font-principal); font-weight: 700; font-stretch: condensed;
  font-size: clamp(30px,5vw,64px); text-transform: uppercase; letter-spacing: 2px;
  color: var(--blanco); line-height: 0.95; margin-bottom: 10px;
}
.tema-central-titulo span { color: var(--dorado) }
.tema-central-subtitulo {
  font-family: var(--font-cuerpo); font-size: clamp(14px,1.8vw,18px);
  color: rgba(255,255,255,0.5); letter-spacing: 1px; margin: 0;
}

/* Enfoque estratégico */
.tema-enfoque {
  max-width: 820px; margin: 0 auto;
  background: rgba(255,255,255,0.03); border: 1px solid rgba(255,255,255,0.07);
  padding: 32px 40px;
}
.tema-enfoque-titulo {
  font-family: var(--font-principal); font-weight: 700; font-stretch: condensed;
  font-size: 20px; text-transform: uppercase; letter-spacing: 2px;
  color: var(--dorado); margin-bottom: 10px;
}
.tema-enfoque-texto {
  font-size: 14px; color: rgba(255,255,255,0.5); line-height: 1.7; margin-bottom: 20px;
}
.tema-pilares {
  display: flex; align-items: center; gap: 16px; flex-wrap: wrap;
}
.tema-pilar {
  display: flex; align-items: center; gap: 10px;
  background: rgba(255,255,255,0.05); border: 1px solid rgba(255,255,255,0.08);
  padding: 10px 16px; flex: 1; min-width: 180px;
}
.tema-pilar-icon {
  width: 40px; height: 40px; flex-shrink: 0; border-radius: 50%;
  background: rgba(255,255,255,0.04); border: 1px solid rgba(255,255,255,0.08);
  display: flex; align-items: center; justify-content: center;
}
.tema-pilar span {
  font-family: var(--font-principal); font-weight: 700; font-stretch: condensed;
  font-size: 14px; text-transform: uppercase; letter-spacing: 0.5px; color: var(--blanco);
  line-height: 1.2;
}
.tema-pilar-sep { color: rgba(224,189,11,0.3); font-size: 20px; flex-shrink: 0 }

/* ── Ejes temáticos ── */
.bloque-ejes {
  background: #fff; position: relative; overflow: hidden; padding: 64px 0 56px;
}
.bloque-ejes::before {
  content: ''; position: absolute; top: 50%; left: 50%;
  transform: translate(-50%,-50%); width: 480px; height: 480px;
  background: url('source/logo-cedelef.svg') center / contain no-repeat;
  opacity: 0.06; filter: grayscale(100%); pointer-events: none; z-index: 0;
}
.bloque-ejes > * { position: relative; z-index: 1 }

.ejes-grid {
  display: grid; grid-template-columns: repeat(3,1fr); gap: 20px;
}

.eje-card {
  background: var(--azul); padding: 28px 24px;
  position: relative; overflow: hidden;
  border-top: 4px solid transparent;
  transition: transform .3s, box-shadow .3s;
}
/* Alterna colores borde por eje */
.eje-card:nth-child(1) { border-top-color: var(--dorado) }
.eje-card:nth-child(2) { border-top-color: var(--verde) }
.eje-card:nth-child(3) { border-top-color: var(--dorado) }
.eje-card:nth-child(4) { border-top-color: var(--verde) }
.eje-card:nth-child(5) { border-top-color: var(--dorado) }
.eje-card:nth-child(6) { border-top-color: var(--verde) }
.eje-card:hover { transform: translateY(-4px); box-shadow: 0 16px 40px rgba(0,27,68,0.3) }

/* Número y línea circuito en la card */
.eje-card-outer { position: absolute; top: 0; left: 0; right: 0; bottom: 0; pointer-events: none }
.eje-num {
  position: absolute; top: 12px; right: 16px;
  font-family: var(--font-principal); font-weight: 800; font-stretch: condensed;
  font-size: 48px; line-height: 1; color: rgba(255,255,255,0.05);
  letter-spacing: -2px; user-select: none;
}
.eje-deco-v {
  position: absolute; left: 0; top: 0; bottom: 0; width: 2px;
  background: linear-gradient(to bottom, rgba(255,255,255,0.06), transparent);
}

.eje-icon {
  width: 64px; height: 64px; border-radius: 50%;
  background: rgba(255,255,255,0.05); border: 1px solid rgba(255,255,255,0.1);
  display: flex; align-items: center; justify-content: center;
  margin-bottom: 16px; position: relative; z-index: 1;
}
.eje-titulo {
  font-family: var(--font-principal); font-weight: 700; font-stretch: condensed;
  font-size: clamp(17px,2vw,21px); text-transform: uppercase; letter-spacing: 1px;
  color: var(--blanco); margin-bottom: 14px; line-height: 1.1;
  position: relative; z-index: 1;
}
.eje-tags {
  display: flex; flex-wrap: wrap; gap: 6px;
  position: relative; z-index: 1;
  padding-top: 12px; border-top: 1px solid rgba(255,255,255,0.06);
}
.eje-tags span {
  font-family: var(--font-cuerpo); font-size: 10px; font-weight: 700;
  letter-spacing: 1px; text-transform: uppercase;
  color: rgba(255,255,255,0.45);
  background: rgba(255,255,255,0.05); border: 1px solid rgba(255,255,255,0.08);
  padding: 3px 8px;
}
/* Tags de ejes dorados */
.eje-card:nth-child(1) .eje-tags span,
.eje-card:nth-child(3) .eje-tags span,
.eje-card:nth-child(5) .eje-tags span {
  color: rgba(224,189,11,0.6);
  background: rgba(224,189,11,0.06); border-color: rgba(224,189,11,0.15);
}
/* Tags de ejes verdes */
.eje-card:nth-child(2) .eje-tags span,
.eje-card:nth-child(4) .eje-tags span,
.eje-card:nth-child(6) .eje-tags span {
  color: rgba(58,148,164,0.7);
  background: rgba(58,148,164,0.06); border-color: rgba(58,148,164,0.15);
}

/* ── Responsive temática ── */
@media (max-width: 900px) {
  .ejes-grid { grid-template-columns: repeat(2,1fr) }
  .tema-pilares { flex-direction: column }
  .tema-pilar { width: 100%; min-width: unset }
  .tema-pilar-sep { display: none }
  .tema-central-wrap, .tema-enfoque { padding: 28px 24px }
}
@media (max-width: 640px) {
  .ejes-grid { grid-template-columns: 1fr }
  .tema-central-titulo { font-size: 28px }
}

/* ════════════════════════════════════════
   ORGANIZADORES — cards reutilizando patrones
════════════════════════════════════════ */

/* ── Card principal NOSOTROS
   Layout: icono izq (azul) + contenido der (blanco)
   Mismo sistema que cat-card ── */
.org-nosotros-card {
  display: grid;
  grid-template-columns: 320px 1fr;
  background: #fff;
  box-shadow: 0 4px 24px rgba(0,27,68,0.10);
  overflow: hidden;
}
.org-nosotros-izq {
  background: var(--azul);
  display: flex; flex-direction: column;
  align-items: center; gap: 16px;
  position: relative; overflow: hidden;
}
.org-nosotros-izq::after {
  content: ''; position: absolute; bottom: -20px; right: -20px;
  width: 80px; height: 80px; border-radius: 50%;
  background: var(--dorado); opacity: 0.1;
}
.org-nosotros-icon {
  width: 90px; height: 90px; border-radius: 50%;
  background: rgba(224,189,11,0.1); border: 2px solid rgba(224,189,11,0.3);
  display: flex; align-items: center; justify-content: center;
}
.org-nosotros-badge {
  font-family: var(--font-cuerpo); font-size: 9px; font-weight: 700;
  letter-spacing: 2px; text-transform: uppercase;
  color: var(--dorado); background: rgba(224,189,11,0.1);
  border: 1px solid rgba(224,189,11,0.25); padding: 4px 10px;
  text-align: center;
}
.org-nosotros-linea {
  width: 2px; flex: 1; background: linear-gradient(to bottom, var(--dorado), transparent);
  min-height: 40px;
}
.org-nosotros-der { padding: 32px 36px; display: flex; flex-direction: column; gap: 10px ;text-align: justify;}
.org-nosotros-titulo {
  font-family: var(--font-principal); font-weight: 700; font-stretch: condensed;
  font-size: clamp(22px,3vw,36px); text-transform: uppercase; letter-spacing: 2px;
  color: var(--azul); line-height: 1;
}
.org-nosotros-titulo span { color: var(--dorado) }
.org-nosotros-lead {
  font-family: var(--font-principal); font-weight: 700; font-stretch: condensed;
  font-size: clamp(14px,1.8vw,18px); color: var(--azul); text-transform: uppercase;
  letter-spacing: 0.5px; border-left: 3px solid var(--dorado); padding-left: 12px;
}
.org-nosotros-texto { color: rgba(0,27,68,0.6)}

/* ── Grid enfoque — 3 columnas usando cat-card-outer ── */
.org-enfoque-grid {
  display: grid; grid-template-columns: repeat(3,1fr); gap: 24px;
}
.org-enfoque-card {
  background: rgba(255,255,255,0.05);
  border: 1px solid rgba(255,255,255,0.07);
  padding: 28px 24px;
  height: 100%;
}
.org-enfoque-icon {
  width: 56px; height: 56px; border-radius: 50%;
  background: rgba(255,255,255,0.05); border: 1px solid rgba(255,255,255,0.1);
  display: flex; align-items: center; justify-content: center; margin-bottom: 16px;
}
.org-enfoque-titulo {
  font-family: var(--font-principal); font-weight: 700; font-stretch: condensed;
  font-size: clamp(17px,2vw,21px); text-transform: uppercase; letter-spacing: 1px;
  color: var(--blanco); margin-bottom: 14px; line-height: 1.1;
}
.org-enfoque-titulo span { color: var(--dorado) }
.org-enfoque-lista { list-style: none; display: flex; flex-direction: column; gap: 8px }
.org-enfoque-lista li {
  display: flex; align-items: flex-start; gap: 10px;
  font-size: 17px; color: rgba(255,255,255,0.7); line-height: 1.5;
  padding-bottom: 8px; border-bottom: 1px solid rgba(255,255,255,0.05);
}
.org-enfoque-lista li:last-child { border-bottom: none }
.org-enfoque-lista li::before {
  content: ''; width: 6px; height: 6px; border-radius: 50%; flex-shrink: 0;
  margin-top: 5px; background: var(--color-cat, var(--dorado));
}

/* Responsive organizadores cards */
@media (max-width: 900px) {
  .org-nosotros-card  { grid-template-columns: 1fr }
  .org-nosotros-izq   { flex-direction: row; padding: 20px 24px }
  .org-nosotros-linea { display: none }
  .org-enfoque-grid   { grid-template-columns: 1fr }
}
@media (max-width: 640px) {
  .org-nosotros-izq   { flex-direction: column }
}

/* ── Temática: número e ícono en cat-card-header ── */
.eje-num-header {
  font-family: var(--font-principal); font-weight: 800; font-stretch: condensed;
  font-size: 40px; line-height: 1; color: var(--dorado); opacity: 0.6;
  display: block; margin-bottom: 0px;
}
.eje-icon-small {
  width: 90px;
  height: 90px;
  border-radius: 50%;
  background: rgba(255,255,255,0.05);
  border: 1px solid rgba(255,255,255,0.1);
  display: flex;
  align-items: center;
  justify-content: center;
  
  margin: 0 auto;        /* ← centra horizontalmente */
}
.eje-icon-small svg {
  width: 60px;           /* ← SVG más grande dentro del círculo */
  height: 60px;
}

/* ── Modal carrusel galería ── */
.galeria-placeholder { cursor: zoom-in }

.galeria-modal {
  display: none;
  position: fixed; inset: 0;
  background: rgba(0,10,30,0.95);
  z-index: 99999; overflow-y: auto; padding: 20px;
  backdrop-filter: blur(8px);
}
.galeria-modal.open { display: block }

.galeria-modal-inner {
  position: relative;
  width: min(960px, 96vw);
  margin: 40px auto;
  background: var(--azul);
  border: 2px solid rgba(224,189,11,0.25);
  border-top: 4px solid var(--dorado);
  padding: 20px;
  box-shadow: 0 0 60px rgba(224,189,11,0.15), 0 24px 80px rgba(0,0,0,0.7);
  animation: slideUp .25s ease;
}

.galeria-modal-close {
  position: absolute; top: 12px; right: 12px; z-index: 2;
  background: var(--dorado); color: var(--azul);
  border: none; cursor: pointer;
  width: 36px; height: 36px; border-radius: 50%;
  font-size: 16px; font-weight: 700;
  display: flex; align-items: center; justify-content: center;
  transition: all .2s;
}
.galeria-modal-close:hover { background: #c9aa09; transform: scale(1.1) }

/* Navegación prev/next */
.galeria-nav {
  position: absolute; top: 50%; transform: translateY(-50%);
  background: rgba(0,27,68,0.7); color: var(--blanco);
  border: 1.5px solid rgba(224,189,11,0.3); cursor: pointer;
  width: 44px; height: 44px; border-radius: 50%;
  font-size: 20px; display: flex; align-items: center; justify-content: center;
  transition: all .2s; z-index: 3;
}
.galeria-nav:hover { background: var(--dorado); color: var(--azul); border-color: var(--dorado) }
.galeria-nav-prev { left: -22px }
.galeria-nav-next { right: -22px }

/* Imagen */
.galeria-modal-img-wrap {
  width: 100%; aspect-ratio: 16/9; overflow: hidden;
  background: rgba(0,0,0,0.4);
  display: flex; align-items: center; justify-content: center;
}
.galeria-modal-img-wrap img {
  width: 100%; height: 100%; object-fit: contain;
  transition: opacity .3s;
}

/* Caption */
.galeria-modal-caption {
  font-family: var(--font-principal); font-weight: 700; font-stretch: condensed;
  font-size: 16px; text-transform: uppercase; letter-spacing: 1px;
  color: var(--blanco); text-align: center;
  padding: 12px 0 8px;
}

/* Dots */
.galeria-dots {
  display: flex; align-items: center; justify-content: center; gap: 8px;
  padding-top: 8px;
}
.galeria-dot {
  width: 8px; height: 8px; border-radius: 50%;
  background: rgba(255,255,255,0.2); border: 1.5px solid rgba(255,255,255,0.2);
  cursor: pointer; transition: all .2s;
}
.galeria-dot.active {
  background: var(--dorado); border-color: var(--dorado);
  box-shadow: 0 0 8px rgba(224,189,11,0.6);
}

@media (max-width: 640px) {
  .galeria-nav-prev { left: 4px }
  .galeria-nav-next { right: 4px }
}


/* ── Modal mapa ── */
.mapa-modal {
  display: none;
  position: fixed; inset: 0;
  background: rgba(0,15,40,0.88);
  z-index: 99999;
  overflow-y: auto;                    /* ← scroll en el overlay */
  padding: 32px 24px;
  backdrop-filter: blur(6px);
  /* Patrón de puntos para que se note que es un overlay */
  background-image:
    radial-gradient(rgba(224,189,11,0.08) 1px, transparent 1px);
  background-size: 28px 28px;
  background-color: rgba(0,15,40,0.92);
}
.mapa-modal.open { display: block }    /* ← block, no flex */

/* Hint para cerrar */
.mapa-modal::before {
  content: 'Haz clic fuera para cerrar  ✕';
  display: block;
  text-align: center;
  font-family: var(--font-cuerpo);
  font-size: 11px; letter-spacing: 2px;
  color: rgba(224,189,11,0.5);
  text-transform: uppercase;
  margin-bottom: 12px;
}

.mapa-modal-inner {
  position: relative;
  background: #FFF;
  border: 2px solid var(--dorado);
  border-top: 5px solid var(--dorado);
  width: min(1200px, 96vw);           /* ← tan ancho como quepa */
  margin: 0 auto;                     /* ← centrado horizontal siempre */
  padding: 35px 24px 24px;
  box-shadow: 0 0 60px rgba(250, 250, 248, 0.2), 0 24px 80px rgba(0,0,0,0.6);
  animation: slideUp .25s ease;
}

@keyframes fadeIn  { from { opacity: 0 }                      to { opacity: 1 } }
@keyframes slideUp { from { transform: translateY(24px); opacity: 0 } to { transform: translateY(0); opacity: 1 } }

.mapa-modal-close {
  position: absolute; top: 13px; right: 5px;
  background: var(--dorado); color: var(--azul);
  border: none; cursor: pointer;
  width: 40px; height: 40px; border-radius: 50%;
  font-size: 20px; font-weight: 700;
  display: flex; align-items: center; justify-content: center;
  transition: all .2s; z-index: 2;
  box-shadow: 0 4px 12px rgba(0,0,0,0.3);
}
.mapa-modal-close:hover { background: #c9aa09; transform: scale(1.12) }

.mapa-modal-layout {
  display: grid;
  grid-template-columns: 1fr 240px;
  gap: 28px; align-items: start;
}
.mapa-modal-img {
  width: 100%; height: auto; display: block;
  box-shadow: 0 8px 32px rgba(0,0,0,0.4);
}

@media (max-width: 768px) {
  .mapa-modal { padding: 20px 12px }
  .mapa-modal-layout { grid-template-columns: 1fr }
  .mapa-modal-inner { padding: 40px 16px 20px }
}

/* Lugares: texto 2 col arriba + fotos 3 col abajo */
.lugares-grid-top {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 20px;
  margin-bottom: 20px;
}

.lugares-fotos-row {
  display: grid;
  grid-template-columns: 1fr 1fr 1fr;
  gap: 12px;
}
.lugares-fotos-row .sede-foto-item {
  height: 220px;
}

@media (max-width: 768px) {
  .lugares-grid-top  { grid-template-columns: 1fr }
  .lugares-fotos-row { grid-template-columns: 1fr }
}

.tabla-cat-header {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 8px;
}

.tabla-cat-img {
  width: 150px;
  height: 150px;
  object-fit: contain;
  filter: drop-shadow(0 2px 6px rgba(0,0,0,0.4));
}

.org-nosotros-foto {
  width: 100%;
  height: 100%;          /* ← ocupa toda la altura de la columna izq */
  overflow: hidden;
  border: none;
  min-height: 240px;
}
.org-nosotros-foto img {
  width: 100%; height: 100%;
  object-fit: cover; display: block;
  transition: transform .4s;
}
.org-nosotros-foto:hover img { transform: scale(1.04) }


/* ════════════════════════════════════════
   EN CONSTRUCCIÓN — hoteles
════════════════════════════════════════ */
.wip-section {
  position: relative; min-height: 60vh;
  background: var(--azul);
  display: flex; align-items: center; justify-content: center;
  padding: 80px 24px; overflow: hidden;
}
.wip-section::before {
  content: ''; position: absolute; top: 50%; left: 50%;
  transform: translate(-50%,-50%); width: 500px; height: 500px;
  background: url('source/logo-cedelef.svg') center / contain no-repeat;
  opacity: 0.04; filter: grayscale(100%); pointer-events: none;
}
.wip-deco-izq {
  position: absolute; left: 0; top: 0; bottom: 0; width: 3px;
  background: linear-gradient(to bottom, var(--dorado), rgba(224,189,11,0.1));
}
.wip-deco-izq::before {
  content: ''; position: absolute; top: 40px; left: 50%; transform: translateX(-50%);
  width: 12px; height: 12px; border-radius: 50%;
  background: var(--dorado); box-shadow: 0 0 10px rgba(224,189,11,0.7);
}
.wip-deco-der {
  position: absolute; right: 0; top: 0; bottom: 0; width: 3px;
  background: linear-gradient(to bottom, var(--verde), rgba(58,148,164,0.1));
}
.wip-deco-der::before {
  content: ''; position: absolute; top: 40px; left: 50%; transform: translateX(-50%);
  width: 12px; height: 12px; border-radius: 50%;
  background: var(--verde); box-shadow: 0 0 10px rgba(58,148,164,0.7);
}
.wip-content {
  position: relative; z-index: 2;
  display: flex; flex-direction: column;
  align-items: center; text-align: center;
  gap: 20px; max-width: 560px;
}
.wip-icon-wrap {
  width: 120px; height: 120px; border-radius: 50%;
  background: rgba(255,255,255,0.05); border: 2px solid rgba(224,189,11,0.25);
  display: flex; align-items: center; justify-content: center;
  box-shadow: 0 0 30px rgba(224,189,11,0.12);
  animation: wip-float 3s ease-in-out infinite;
}
@keyframes wip-float {
  0%, 100% { transform: translateY(0) }
  50%       { transform: translateY(-8px) }
}
.wip-icon { width: 80px; height: 80px }
.wip-dot-1 { animation: wip-blink 1.4s ease-in-out infinite 0s }
.wip-dot-2 { animation: wip-blink 1.4s ease-in-out infinite .3s }
.wip-dot-3 { animation: wip-blink 1.4s ease-in-out infinite .6s }
@keyframes wip-blink {
  0%, 100% { opacity: 0.3 }
  50%       { opacity: 1 }
}
.wip-tag {
  display: flex; align-items: center; gap: 8px;
  font-family: var(--font-cuerpo); font-size: 9px; font-weight: 700;
  letter-spacing: 3px; text-transform: uppercase; color: var(--dorado);
  background: rgba(224,189,11,0.08); border: 1px solid rgba(224,189,11,0.25);
  padding: 5px 14px;
}
.wip-tag-dot {
  width: 7px; height: 7px; border-radius: 50%;
  background: var(--dorado); box-shadow: 0 0 6px rgba(224,189,11,0.7);
  animation: wip-blink 1.4s ease-in-out infinite;
}
.wip-titulo {
  font-family: var(--font-principal); font-weight: 700; font-stretch: condensed;
  font-size: clamp(32px,5vw,56px); text-transform: uppercase; letter-spacing: 2px;
  color: var(--blanco); line-height: 0.95; margin: 0;
}
.wip-titulo span { color: var(--dorado) }
.wip-subtitulo {
  font-family: var(--font-cuerpo); font-size: 15px;
  color: rgba(255,255,255,0.45); line-height: 1.7; max-width: 460px; margin: 0;
}
.wip-linea-circ { display: flex; align-items: center; width: 100%; max-width: 360px }
.wip-linea-izq  { flex: 1; height: 1px; background: linear-gradient(to right, transparent, rgba(224,189,11,0.3)) }
.wip-linea-der  { flex: 1; height: 1px; background: linear-gradient(to left,  transparent, rgba(224,189,11,0.3)) }
.wip-nodo {
  width: 10px; height: 10px; border-radius: 50%; flex-shrink: 0;
  border: 2px solid var(--dorado); background: var(--azul);
  box-shadow: 0 0 8px rgba(224,189,11,0.4);
}
.wip-info-card {
  display: flex; align-items: center; gap: 16px;
  background: rgba(255,255,255,0.04); border: 1px solid rgba(255,255,255,0.07);
  border-left: 3px solid var(--verde); padding: 16px 20px; width: 100%;
}
.wip-info-icon  { font-size: 24px; flex-shrink: 0 }
.wip-info-texto { display: flex; flex-direction: column; gap: 3px; text-align: left }
.wip-info-label {
  font-size: 9px; font-weight: 700; letter-spacing: 2px; text-transform: uppercase;
  color: var(--verde); font-family: var(--font-cuerpo);
}
.wip-info-valor {
  font-family: var(--font-principal); font-weight: 700; font-stretch: condensed;
  font-size: 15px; text-transform: uppercase; letter-spacing: 0.5px; color: var(--blanco);
}
.wip-ctas {
  display: flex; align-items: center; gap: 14px;
  flex-wrap: wrap; justify-content: center; margin-top: 8px;
}

/* ── Hotspots interactivos sobre imagen feria ── */
.stand-hotspot {
  position: absolute;
  border-radius: 3px;
  cursor: pointer;
  border: 2px solid transparent;
  transition: background .2s, border-color .2s, box-shadow .2s;
  background: transparent;
}
.stand-hotspot:hover {
  box-shadow: 0 0 0 3px rgba(255,255,255,0.4);
}

/* Efecto hover: crece, brilla y cambia a dorado */
.stand-hotspot:hover .hs-img {
  transform: translate(-50%, -50%) scale(1.35);
  border-color: var(--dorado);
  box-shadow: 0 0 20px rgba(224, 189, 11, 0.7),
              0 0 40px rgba(224, 189, 11, 0.3);
  background: #fff;                   /* fondo completamente blanco */
  z-index: 5;                         /* se superpone a otros elementos cercanos */
}



.stand-hotspot.inti:hover    { background: rgba(224,189,11,0.35); border-color: #E0BD0B }
.stand-hotspot.illapa:hover  { background: rgba(58,148,164,0.35); border-color: #3A94A4 }
.stand-hotspot.pachama:hover { background: rgba(90,127,168,0.35); border-color: #5a7fa8 }
.stand-hotspot.estandar:hover{ background: rgba(139,165,196,0.35);border-color: #8ba5c4 }
.stand-hotspot.cubo:hover    { background: rgba(130,80,180,0.35); border-color: #9B59D9 }

/* ── Modal stand ── */
.stand-modal-overlay {
  display: none;
  position: fixed;
  top: 0; left: 0;        /* ← explícito, no shorthand inset */
  width: 100vw;
  height: 100vh;
  background: rgba(0,10,30,0.9);
  z-index: 999999;
  backdrop-filter: blur(8px);

  /* Centrado que funciona en todos los browsers */
  display: none;
  align-items: center;
  justify-content: center;
  padding: 20px;
  align-items: flex-start;      /* ← empieza desde arriba */
  overflow-y: auto;             /* ← scroll en el overlay */
  padding: 70px 20px 40px;      /* ← padding-top deja espacio para no quedar bajo el nav */
}

.stand-modal-overlay.open { display: flex }
.stand-modal-overlay::before {
   display: flex; text-align: center;
  font-family: var(--font-principal); font-size: 10px; letter-spacing: 2px;
  text-transform: uppercase; color: rgba(255,255,255,0.25); margin-bottom: 12px;
}
.stand-modal-box {
  width: min(540px,96vw); margin: 0 auto;
  background: var(--azul); border: 2px solid rgba(255,255,255,0.08);
  position: relative; animation: slideUp .25s ease;
}
.stand-modal-box.inti    { border-top: 4px solid #E0BD0B }
.stand-modal-box.illapa  { border-top: 4px solid #3A94A4 }
.stand-modal-box.pachama { border-top: 4px solid #5a7fa8 }
.stand-modal-box.estandar{ border-top: 4px solid #8ba5c4 }
.stand-modal-box.cubo    { border-top: 4px solid #9B59D9 }

.stand-modal-header {
  padding: 24px 28px 18px; border-bottom: 1px solid rgba(255,255,255,0.07); position: relative;
}
.stand-modal-tag {
  font-size: 9px; font-weight: 700; letter-spacing: 3px; text-transform: uppercase;
  display: inline-block; padding: 3px 10px; margin-bottom: 10px;
  border-radius: 0;
}
.stand-modal-tag.inti    { background:rgba(224,189,11,0.12); color:#E0BD0B; border:1px solid rgba(224,189,11,0.3) }
.stand-modal-tag.illapa  { background:rgba(58,148,164,0.12); color:#3A94A4; border:1px solid rgba(58,148,164,0.3) }
.stand-modal-tag.pachama { background:rgba(90,127,168,0.12); color:#5a7fa8; border:1px solid rgba(90,127,168,0.3) }
.stand-modal-tag.estandar{ background:rgba(139,165,196,0.12);color:#8ba5c4; border:1px solid rgba(139,165,196,0.3)}
.stand-modal-tag.cubo    { background:rgba(155,89,217,0.12); color:#9B59D9; border:1px solid rgba(155,89,217,0.3) }

.stand-modal-titulo {
  font-family: var(--font-principal); font-weight: 800; font-stretch: condensed;
  font-size: clamp(20px,3.5vw,30px); text-transform: uppercase; letter-spacing: 2px;
  color: var(--blanco); line-height: 1;
}
.stand-modal-close {
  position: absolute; top: 14px; right: 14px; width: 30px; height: 30px; border-radius: 50%;
  background: rgba(255,255,255,0.07); border: none; cursor: pointer;
  color: rgba(255,255,255,0.5); font-size: 14px;
  display: flex; align-items: center; justify-content: center; transition: background .2s;
}
.stand-modal-close:hover { background: rgba(255,255,255,0.15); color: #fff }
.stand-modal-body { padding: 22px 28px }
.stand-modal-specs { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; margin-bottom: 18px }
.stand-modal-spec {
  background: rgba(255,255,255,0.04); border: 1px solid rgba(255,255,255,0.06); padding: 11px 13px;
}
.stand-modal-spec-label {
  font-size: 8px; font-weight: 700; letter-spacing: 2px; text-transform: uppercase;
  color: rgba(255,255,255,0.3); display: block; margin-bottom: 3px; font-family: var(--font-cuerpo);
}
.stand-modal-spec-valor {
  font-family: var(--font-principal); font-weight: 700; font-stretch: condensed;
  font-size: 14px; text-transform: uppercase; letter-spacing: 0.5px; color: var(--blanco);
}
.stand-modal-desc {
  font-family: var(--font-cuerpo); font-size: 13px;
  color: rgba(255,255,255,0.45); line-height: 1.7; margin-bottom: 18px;
}
.stand-modal-cta {
  display: inline-flex; align-items: center; gap: 8px; padding: 10px 22px;
  text-decoration: none; font-family: var(--font-principal); font-weight: 700;
  font-stretch: condensed; font-size: 13px; letter-spacing: 1px; text-transform: uppercase;
  background: var(--dorado); color: var(--azul); transition: background .2s;
}
.stand-modal-cta:hover { background: #c9aa09 }
/* 
.hs-img {
  position: absolute;
  width: 30px; height: 28px;
  object-fit: contain;
  pointer-events: none;   
  filter: drop-shadow(0 2px 6px rgba(0,0,0,0.6));
} */
/* ── Variables de color por categoría ── */
.stand-hotspot.inti    { --color-cat: var(--dorado); --shadow-cat: rgba(224,189,11,0.7); }
.stand-hotspot.illapa  { --color-cat: var(--verde);  --shadow-cat: rgba(58,148,164,0.7); }
.stand-hotspot.pachama { --color-cat: var(--azul);   --shadow-cat: rgba(0,27,68,0.6); }
.stand-hotspot.libre   { --color-cat: #8ba5c4;       --shadow-cat: rgba(139,165,196,0.6); }
.stand-hotspot.estandar{ --color-cat: #8ba5c4;       --shadow-cat: rgba(139,165,196,0.6); }

/* ── MAPA NORMAL: tamaño base pequeño, hover moderado ── */
.stand-hotspot[data-img] .hs-img {
  position: absolute;
  width: 30px;               /* tamaño base en mapa normal */
  height: auto;
  max-width: 90%;
  max-height: 90%;
  object-fit: contain;
  border: 2px solid rgba(0, 27, 68, 0.25);
  border-radius: 6px;
  background: rgba(255, 255, 255, 0.95);
  padding: 0px;
  box-shadow: 0 0 10px rgba(0, 27, 68, 0.15);
  pointer-events: none;
  transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
  z-index: 1;
}

/* ── Posición y origen de crecimiento por categoría (ambos mapas) ── */
.stand-hotspot.inti[data-img] .hs-img {
  top: 72%;
  left: 50%;
  transform: translate(-50%, -50%);
  transform-origin: top center;
}
.stand-hotspot.illapa[data-img] .hs-img {
  top: 50%;
  left: 18%;
  transform: translate(-50%, -50%);
  transform-origin: right center;
}
.stand-hotspot.illapa[data-cat="illapa-corner"][data-img] .hs-img {
  top: 40%;                       /* nivelado con Delcrosa (Libre 02) en mapa normal */
  left: 50%;
  transform-origin: bottom center;   /* crece hacia arriba, borde inferior fijo */
}
.mapa-modal .stand-hotspot.illapa[data-cat="illapa-corner"][data-img] .hs-img {
  top: 33.5%;                        /* nivelado con Delcrosa en mapa modal */
}
.stand-hotspot.libre[data-img*="Delcrosa"] .hs-img {
  top: 34%;
}
.stand-hotspot.pachama[data-img] .hs-img {
  top: 50%;
  left: 82%;
  transform: translate(-50%, -50%);
  transform-origin: left center;
}
.stand-hotspot.libre[data-img] .hs-img,
.stand-hotspot.estandar[data-img] .hs-img {
  top: 28%;
  left: 50%;
  transform: translate(-50%, -50%);
  transform-origin: bottom center;
}

/* ── Hover en mapa normal: crece 1.8x ── */
.stand-hotspot[data-img]:hover .hs-img {
  transform: translate(-50%, -50%) scale(2.2);
  border-color: var(--color-cat);
  box-shadow: 0 0 25px var(--shadow-cat),
              0 0 50px var(--shadow-cat);
  background: #ffffff;
  z-index: 10;
}

/* ── MAPA MODAL: tamaño base más grande, hover más pronunciado ── */
.mapa-modal .stand-hotspot[data-img] .hs-img {
  width: 58px;               /* tamaño base más grande en el modal */
  border-width: 2.5px;
  border-radius: 8px;
  box-shadow: 0 0 16px rgba(0, 27, 68, 0.25);
}

.mapa-modal .stand-hotspot[data-img]:hover .hs-img {
  transform: translate(-50%, -50%) scale(2.5);  /* crece más en el modal */
  box-shadow: 0 0 40px var(--shadow-cat),
              0 0 80px var(--shadow-cat);
}

/* ── Contenedores sin recorte ── */
.mapa-img-wrap,
.mapa-modal-inner {
  overflow: visible !important;
}

.stand-hotspot {
  overflow: visible !important;
}
.mapa-modal .hs-img {
  width: 60px;
  height: 60px;
}


.stand-modal-header-top {
  display: flex; align-items: flex-start;
  justify-content: space-between; gap: 16px;
}

.stand-modal-estado {
  display: flex; flex-direction: column;
  align-items: center; gap: 6px; flex-shrink: 0;
  padding: 12px; background: rgba(255,255,255,0.04);
  border: 1px solid rgba(255,255,255,0.08);
  min-width: 90px;
}
.stand-modal-estado img {
  width: 72px; height: 72px;
  object-fit: contain;
  filter: drop-shadow(0 2px 8px rgba(0,0,0,0.4));
}
.estado-libre {
  font-family: var(--font-cuerpo); font-size: 9px; font-weight: 700;
  letter-spacing: 2px; text-transform: uppercase;
  color: var(--verde); background: rgba(58,148,164,0.12);
  border: 1px solid rgba(58,148,164,0.3); padding: 2px 8px;
}
.estado-auspiciado {
  font-family: var(--font-cuerpo); font-size: 9px; font-weight: 700;
  letter-spacing: 2px; text-transform: uppercase;
  color: var(--dorado); background: rgba(224,189,11,0.12);
  border: 1px solid rgba(224,189,11,0.3); padding: 2px 8px;
}
.estado-reservado {
  font-family: var(--font-cuerpo); font-size: 9px; font-weight: 700;
  letter-spacing: 2px; text-transform: uppercase;
  color: #E67E22; background: rgba(230,126,34,0.12);
  border: 1px solid rgba(230,126,34,0.35); padding: 2px 8px;
}

.hs-libre-label {
  position: absolute;
  /* top: 50%; left: 50%; */
  transform: translate(-50%, -50%);
  font-family: var(--font-principal);
  font-weight: 700; font-stretch: condensed;
  font-size: 9px; letter-spacing: 2px;
  text-transform: uppercase;
  white-space: nowrap;
  pointer-events: none;
  padding: 2px 6px;
}

.hs-libre-inti {
  top :50%; 
  left: 50%;
  color: #FFF;
  /* background: rgba(224,189,11,0.5); */
  /* border: 1px solid rgba(224,189,11,0.3); */
}

.hs-libre-inti-vertical {
  color: #fff;
  top: 50%;
  left: 80%;
  transform: translate(-50%, -50%);
}

.hs-libre-illapa {
  top: 50%;
  left: 22%;
  color: #fff;
  transform: translate(-50%, -50%);
}

/* ILLAPA 05: único hotspot ajustado solo a la franja (barra) de la esquina
   inferior del plano, del mismo tamaño que ese elemento en la imagen (como
   los stands "libre"), no a toda la fila bar+ícono+texto; la etiqueta va
   centrada sobre esa franja. */
.hs-libre-illapa-corner {
  top: 50%;
  left: 50%;
  color: #fff;
  transform: translate(-50%, -50%);
}

/* Fuera del modal (plano en línea) baja un poco respecto al centro vertical
   pero queda centrada en el ancho del hotspot. */
.mapa-img-wrap .hs-libre-illapa-corner {
  top: 42%;
  left: 50%;
}

/* Dentro del modal ampliado, un poco más arriba que el centro (50%). */
.mapa-modal .hs-libre-illapa-corner {
  top: 38%;
}

.hs-libre-pachama {
  color: #fff;
  top: 50%;
  left: 80%;
  transform: translate(-50%, -50%);
}

.hs-libre-libre {
  color: #FFF;
      top: 36%;
  left: 50%;



}

.mapa-modal .hs-libre-label {
  font-size: 16px;
  letter-spacing: 3px;
  padding: 4px 10px;
}

.mapa-modal .hs-reservado {
  letter-spacing: 1px;
  padding: 4px 6px;
  transform: translate(-50%, -50%) scaleX(0.72);
}

.hs-reservado-wrap {
  display: flex;
  flex-direction: column;
  align-items: center;
  line-height: 1.2;
}

.hs-reservado-empresa {
  display: block;
  font-size: 6.5px;
  font-weight: 700;
  letter-spacing: 0.2px;
  text-transform: none;
  color: #FFFFFF !important;
  text-shadow: 0 1px 2px rgba(0,0,0,0.9), 0 0 4px rgba(0,0,0,0.75);
  background: rgba(0,0,0,0.4);
  border-radius: 3px;
  padding: 1px 4px;
  margin-top: 2px;
  white-space: nowrap;
}

.mapa-modal .hs-reservado-empresa {
  font-size: 14px;
  padding: 3px 8px;
  margin-top: 3px;
}

/* Stand reservado: en negociación, ya no está libre pero aún no hay
   auspiciador confirmado. Reutiliza el posicionamiento de .hs-libre-*
   por categoría, solo cambia el color a ámbar. */
.hs-reservado {
  color: #FFA733 !important;
  text-shadow: 0 1px 3px rgba(0,0,0,0.65), 0 0 1px rgba(0,0,0,0.4);
  letter-spacing: 0.5px;
  padding: 2px 3px;
  transform: translate(-50%, -50%) scaleX(0.8);
}

.stand-modal-header-info {
  display: flex; align-items: center; gap: 14px;
}

.stand-modal-cat-img {
  width: 120px; height: 120px;
  object-fit: contain; flex-shrink: 0;
  filter: drop-shadow(0 2px 10px rgba(0,0,0,0.4));
}

.stand-modal-banner {
  width: 100%;
  display: none;
  background: rgba(0,27,68,0.3);
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 16px;
}

.stand-modal-banner img {
  width: auto;
  height: 380px;        /* ← altura fija, ancho automático */
  object-fit: contain;  /* ← muestra la imagen completa sin recortar */
  display: block;
   margin: 0 auto;       /* ← centra horizontalmente */
}.stand-modal-content {
  display: grid;
  grid-template-columns: 320px 1fr;
  gap: 0;
  min-height: 200px;
}

/* Imagen izquierda */
.stand-modal-banner {
  display: none;                 /* se activa por JS */
  background: rgba(0,0,0,0.2);
  align-items: center;
  justify-content: center;
  padding: 8px;
  border-right: 1px solid rgba(255,255,255,0.07);
}
.stand-modal-banner img {
  width: 100%;
  height: auto;

  object-fit: contain;
  display: block;
  margin: 0 auto;
}

/* Columna derecha */
.stand-modal-body {
  padding: 11px 12px;
  display: flex;
  flex-direction: column;
  gap: 14px;
}

/* Specs en lista vertical */
.stand-modal-specs {
  display: flex;
  flex-direction: column;    /* ← vertical */
  gap: 8px;
}
.stand-modal-spec {
  background: rgba(255,255,255,0.04);
  border: 1px solid rgba(255,255,255,0.06);
  border-left: 3px solid rgba(255,255,255,0.1);
  padding: 10px 14px;
  display: flex;
  flex-direction: column;
  gap: 2px;
}

/* Color borde izq según categoría */
.stand-modal-box.inti    .stand-modal-spec { border-left-color: var(--dorado) }
.stand-modal-box.illapa  .stand-modal-spec { border-left-color: #3A94A4 }
.stand-modal-box.pachama .stand-modal-spec { border-left-color: #5a7fa8 }
.stand-modal-box.libre   .stand-modal-spec { border-left-color: #C4748A }

@media (max-width: 520px) {
  .stand-modal-content { grid-template-columns: 1fr }
  .stand-modal-banner  { border-right: none; border-bottom: 1px solid rgba(255,255,255,0.07) }
}


/* Modal más ancho cuando banner es horizontal */
.stand-modal-box.banner-horizontal {
  width: min(860px, 58vw);      /* ← más ancho */
}

.stand-modal-box.banner-horizontal .stand-modal-content {
  grid-template-columns: 1fr 240px;  /* ← imagen ocupa más, specs a la derecha */
}

.stand-modal-box.banner-horizontal .stand-modal-banner img {
  width: 100%;
  height: auto;
  
  object-fit: cover;             /* ← cubre el espacio horizontal */
  object-position: center;
}

.stand-modal-box.banner-horizontal .stand-modal-banner {
  padding: 0;                    /* ← sin padding para que ocupe todo */
  overflow: hidden;
}