/* Cónclave CEO · estilo. Sin fuentes ni recursos externos. */
:root {
  --noche: #262731;
  --noche-2: #1d1e27;
  --oro: #A9955C;
  --oro-claro: #EAD8A5;
  --oro-tinta: #7A6A2E;        /* oro oscuro, legible sobre papel */
  --rojo: #C2112E;
  --rojo-hover: #a30e27;
  --papel: #F4F0E6;
  --papel-2: #EAE4D4;
  --tinta: #262731;
  --apagado: #575965;
  --serif: "Iowan Old Style", "Palatino Linotype", Palatino, "Book Antiqua", Georgia, serif;
  --sans: system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
  --ancho: 1120px;
}

*, *::before, *::after { box-sizing: border-box; }
html { scroll-behavior: smooth; scroll-padding-top: 76px; -webkit-text-size-adjust: 100%; }
body { margin: 0; font: 17px/1.65 var(--sans); color: var(--tinta); background: var(--papel); }
img { max-width: 100%; display: block; }
a { color: inherit; }
h1, h2, h3, h4 { font-family: var(--serif); font-weight: 600; line-height: 1.12; margin: 0; letter-spacing: -.01em; }
p { margin: 0 0 1em; }

:focus-visible { outline: 3px solid var(--oro); outline-offset: 3px; }
.saltar { position: absolute; left: -999px; top: 8px; background: var(--oro-claro); color: var(--noche); padding: 10px 14px; z-index: 100; }
.saltar:focus { left: 8px; }

.ancho { width: min(100% - 32px, var(--ancho)); margin-inline: auto; }
.estrecho { max-width: 760px; }
.centro { text-align: center; }

/* ---------- Cabecera ---------- */
.cabecera { position: sticky; top: 0; z-index: 50; background: rgba(38,39,49,.96); border-bottom: 1px solid rgba(234,216,165,.18); backdrop-filter: blur(6px); }
.cabecera-in { width: min(100% - 32px, var(--ancho)); margin-inline: auto; display: flex; align-items: center; justify-content: space-between; min-height: 64px; gap: 16px; }
.marca { text-decoration: none; color: var(--oro-claro); display: flex; flex-direction: column; line-height: 1.1; }
.marca-nombre { font-family: var(--serif); font-size: 1.35rem; font-weight: 600; letter-spacing: .01em; }
.marca-nombre em { font-style: normal; color: var(--oro); letter-spacing: .18em; font-size: .8em; margin-left: .1em; }
.marca-sub { font-size: .68rem; letter-spacing: .2em; text-transform: uppercase; color: var(--oro); margin-top: 3px; }
#menu { display: flex; align-items: center; gap: 26px; }
#menu a { color: #e9e5d8; text-decoration: none; font-size: .93rem; }
#menu a:hover { color: var(--oro-claro); }
#menu .menu-cta { background: var(--rojo); color: #fff; padding: 9px 18px; border-radius: 3px; font-weight: 600; }
#menu .menu-cta:hover { background: var(--rojo-hover); color: #fff; }
.menu-boton { display: none; background: none; border: 1px solid var(--oro); color: var(--oro-claro); padding: 8px 14px; font: inherit; font-size: .9rem; border-radius: 3px; cursor: pointer; }

/* ---------- Botones y enlaces ---------- */
.boton { display: inline-block; background: var(--rojo); color: #fff; text-decoration: none; padding: 15px 28px; font-weight: 600; letter-spacing: .01em; border-radius: 3px; transition: background .2s, transform .2s; }
.boton:hover { background: var(--rojo-hover); transform: translateY(-1px); }
.grande-boton { padding: 18px 36px; font-size: 1.1rem; }
.enlace-claro { color: var(--oro-claro); text-underline-offset: 4px; text-decoration-thickness: 1px; }
.enlace { color: var(--oro-tinta); font-weight: 600; text-underline-offset: 4px; }
.botones { display: flex; flex-wrap: wrap; align-items: center; gap: 14px 28px; margin-top: 28px; }

/* ---------- Bloques ---------- */
.bloque { padding: clamp(64px, 9vw, 120px) 0; }
.papel { background: var(--papel); }
.papel2 { background: var(--papel-2); }
.noche { background: var(--noche); color: #e9e5d8; }
.noche h2, .noche h3 { color: var(--oro-claro); }
.rotulo { font-size: .78rem; letter-spacing: .22em; text-transform: uppercase; color: var(--oro-tinta); margin-bottom: 18px; font-weight: 600; }
.noche .rotulo { color: var(--oro); }
h2 { font-size: clamp(1.9rem, 4.2vw, 3.1rem); margin-bottom: .6em; }
.grande { font-family: var(--serif); font-size: clamp(1.25rem, 2.4vw, 1.6rem); line-height: 1.5; }
.intro { max-width: 720px; font-size: 1.1rem; color: var(--apagado); margin-bottom: 2.2rem; }
.ancho-texto { max-width: 760px; }
.pequeno { font-size: .86rem; color: var(--apagado); }
.noche .pequeno { color: #b9b6a8; }
.subtitulo { font-size: 1.4rem; margin: 3.2rem 0 1.2rem; }
.falta { color: #9a6a00; }

/* ---------- Portada ---------- */
.portada { background: radial-gradient(1100px 600px at 85% 20%, rgba(169,149,92,.18), transparent 60%), var(--noche); color: #e9e5d8; padding: clamp(48px, 8vw, 104px) 0; border-bottom: 3px solid var(--oro); }
.portada-in { display: grid; grid-template-columns: 1.15fr .85fr; gap: clamp(32px, 6vw, 80px); align-items: center; }
.portada h1 { font-size: clamp(3rem, 9vw, 6.4rem); color: var(--oro-claro); font-weight: 600; letter-spacing: -.025em; line-height: 1; }
.portada-sub { font-family: var(--serif); font-size: clamp(1.2rem, 2.4vw, 1.6rem); margin: 28px 0 14px; max-width: 30ch; line-height: 1.35; color: #f4f0e6; }
.portada-apoyo { color: #b9b6a8; max-width: 44ch; font-size: 1rem; }

/* ---------- Fotos (con hueco marcado si falta) ---------- */
.foto { position: relative; overflow: hidden; background: var(--noche-2); aspect-ratio: 4 / 3; border: 1px solid rgba(169,149,92,.5); }
.foto img { width: 100%; height: 100%; object-fit: cover; filter: contrast(1.04) saturate(.92); }
.foto.vacia { display: flex; align-items: flex-end; background:
  repeating-linear-gradient(135deg, rgba(169,149,92,.10) 0 10px, rgba(169,149,92,.03) 10px 20px), var(--noche-2); border-style: dashed; }
.foto-etiqueta { font-size: .72rem; color: var(--oro); padding: 10px 12px; letter-spacing: .04em; word-break: break-all; }
.portada-foto .foto { aspect-ratio: 4 / 5; }
.retrato { aspect-ratio: 1 / 1; }
.retrato img { object-position: 50% 18%; }

/* ---------- Pacto ---------- */
.pacto { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0; border-top: 2px solid var(--noche); }
.pacto article { padding: 26px 24px 8px 0; margin-right: 24px; border-right: 1px solid rgba(38,39,49,.18); }
.pacto article:last-child { border-right: 0; margin-right: 0; }
.pacto h3 { font-size: 1.35rem; margin-bottom: 14px; }
.lema { font-family: var(--serif); font-style: italic; font-size: 1.12rem; color: var(--oro-tinta); line-height: 1.35; }
.pacto p:last-child { color: var(--apagado); font-size: .97rem; }

/* ---------- Método ---------- */
.etiquetas { list-style: none; margin: 2.2rem 0 0; padding: 0; display: flex; flex-wrap: wrap; gap: 12px; }
.etiquetas li { border: 1px solid var(--oro); color: var(--oro-claro); padding: 10px 20px; border-radius: 999px; font-family: var(--serif); font-size: 1.1rem; }

/* ---------- Jornada ---------- */
.momentos { list-style: none; margin: 2.2rem 0 3rem; padding: 0; display: grid; grid-template-columns: repeat(4, 1fr); gap: 28px; counter-reset: m; }
.momentos li { border-top: 0; padding-top: 0; }
.momentos img { width: 100%; height: auto; aspect-ratio: 3 / 2; object-fit: cover; margin-bottom: 16px; filter: contrast(1.04) saturate(.92); }
.num { font-family: var(--serif); font-size: 2.6rem; color: var(--oro); line-height: 1; display: block; margin-bottom: 10px; }
.momentos h3 { font-size: 1.25rem; margin-bottom: 8px; }
.momentos p { color: var(--apagado); font-size: .97rem; margin: 0; }

/* ---------- Vídeo (solo carga al pulsar) ---------- */
.video { position: relative; display: flex; align-items: center; justify-content: center; flex-direction: column; gap: 14px; width: 100%; aspect-ratio: 16 / 9; border: 0; cursor: pointer; color: var(--oro-claro); font: inherit;
  background: radial-gradient(600px 300px at 70% 30%, rgba(169,149,92,.22), transparent 65%), var(--noche); }
.video.vertical { aspect-ratio: 9 / 16; }
.video:hover .video-play { transform: scale(1.08); background: var(--rojo); }
.video-play { width: 68px; height: 68px; border-radius: 50%; background: rgba(194,17,46,.92); position: relative; transition: transform .2s, background .2s; }
.video-play::after { content: ""; position: absolute; left: 27px; top: 21px; border-left: 20px solid #fff; border-top: 13px solid transparent; border-bottom: 13px solid transparent; }
.video-txt { font-family: var(--serif); font-size: 1.1rem; padding: 0 12px; text-align: center; }
iframe { width: 100%; aspect-ratio: 16 / 9; border: 0; display: block; background: #000; }
.testimonios iframe, .testimonios .video { aspect-ratio: 9 / 16; }
.video-ancho { max-width: 900px; margin-inline: auto; }
.nota-video { text-align: center; font-size: .82rem; color: var(--apagado); margin-top: 12px; }

/* ---------- Líderes ---------- */
.lideres { display: grid; grid-template-columns: repeat(4, 1fr); gap: 28px; }
.lideres h3 { font-size: 1.25rem; margin: 18px 0 4px; }
.cargo { font-size: .8rem; letter-spacing: .1em; text-transform: uppercase; color: var(--oro-tinta); font-weight: 600; margin-bottom: 10px; }
.bio { font-size: .93rem; color: var(--apagado); line-height: 1.55; }

/* ---------- Cifras ---------- */
.cifras { display: grid; grid-template-columns: repeat(4, 1fr); gap: 24px; margin: 3.2rem 0 0; border-top: 1px solid rgba(234,216,165,.3); padding-top: 2rem; }
.cifras dt { font-family: var(--serif); font-size: clamp(2.4rem, 5vw, 3.6rem); color: var(--oro-claro); line-height: 1; }
.cifras dd { margin: 8px 0 0; color: #b9b6a8; font-size: .95rem; }

/* ---------- Testimonios ---------- */
.testimonios { display: grid; grid-template-columns: repeat(4, 1fr); gap: 20px; }
.testimonios figure { margin: 0; }
.testimonios figcaption { display: flex; flex-direction: column; padding-top: 10px; font-size: .92rem; line-height: 1.35; }

/* ---------- Grupos y reuniones ---------- */
.grupos { display: grid; grid-template-columns: repeat(2, 1fr); gap: 28px; }
.grupo { background: var(--papel); border: 1px solid rgba(38,39,49,.15); border-top: 3px solid var(--noche); padding: 22px 22px 24px; }
.grupo-cab { display: flex; flex-wrap: wrap; align-items: baseline; justify-content: space-between; gap: 6px 14px; margin-bottom: 18px; }
.grupo-cab h3 { font-size: 1.55rem; }
.grupo-meta { margin: 0; font-size: .86rem; color: var(--apagado); display: flex; gap: 14px; align-items: center; }
.estado { color: var(--oro-tinta); font-weight: 600; }
.grupo-meta .estado::before { content: ""; display: inline-block; width: 8px; height: 8px; border-radius: 50%; background: var(--oro); margin-right: 7px; }
.reuniones { display: grid; grid-template-columns: repeat(2, 1fr); gap: 14px; }
.reunion .foto { aspect-ratio: 16 / 9; }
.reuniones.una { grid-template-columns: 1fr; }
.reunion-datos { padding-top: 10px; }
.codigo { font-family: var(--serif); font-size: 1.5rem; color: var(--oro-tinta); margin: 0 0 2px; line-height: 1; letter-spacing: .02em; cursor: help; }
.fecha { display: block; font-size: .9rem; font-weight: 600; }
.lugar, .lugar.falta { margin: 0; font-size: .86rem; color: var(--apagado); }
.lugar.falta { font-style: italic; color: #9a6a00; }
.reunion .foto.vacia { align-items: center; justify-content: center; border-style: solid; border-color: rgba(169,149,92,.35); }
.foto-codigo { font-family: var(--serif); font-size: clamp(2rem, 4vw, 2.8rem); color: var(--oro); letter-spacing: .04em; }
.linkedin { display: inline-block; margin-top: 10px; font-size: .88rem; font-weight: 600; color: var(--oro-tinta); text-underline-offset: 4px; }
.lideres .linkedin { align-self: start; }
.testimonios figcaption:empty { display: none; }
.sin-reuniones { grid-column: 1 / -1; color: #9a6a00; font-style: italic; margin: 0; }

.nuevos { display: grid; grid-template-columns: repeat(3, 1fr); gap: 24px; }
.nuevo { background: var(--noche); color: #e9e5d8; padding: 26px 24px; }
.nuevo h4 { color: var(--oro-claro); font-size: 1.4rem; margin: 6px 0 12px; }
.nuevo .estado { color: var(--oro); font-size: .78rem; letter-spacing: .12em; text-transform: uppercase; margin: 0; }
.nuevo p { font-size: .96rem; }
.nuevo .lider { color: #b9b6a8; font-size: .9rem; }
.nuevo .enlace { color: var(--oro-claro); }

/* ---------- Intercónclaves / entrar ---------- */
.dos-col { display: grid; grid-template-columns: 1fr 1fr; gap: clamp(28px, 5vw, 64px); align-items: center; }
.dos-col.arriba { align-items: start; }
.videos-par { display: flex; gap: 18px; align-items: center; justify-content: center; }
.v-wrap { flex: 0 0 auto; width: min(100%, 260px); }
.h-wrap { flex: 1 1 0; min-width: 0; }
iframe.vertical { aspect-ratio: 9 / 16; }
.videos-par .video { border: 1px solid rgba(169,149,92,.45); }
.perfil, .pasos { margin: 0; padding: 0 0 0 1.2em; }
.perfil li, .pasos li { margin-bottom: .9em; padding-left: .3em; }
.perfil { list-style: none; padding-left: 0; }
.perfil li { border-left: 3px solid var(--oro); padding-left: 16px; }
.pasos { counter-reset: p; list-style: none; padding: 0; }
.pasos li { counter-increment: p; position: relative; padding-left: 46px; }
.pasos li::before { content: counter(p); position: absolute; left: 0; top: -4px; font-family: var(--serif); font-size: 1.8rem; color: var(--oro); }
.cuota { margin-top: 3.4rem; background: var(--noche); color: #e9e5d8; padding: 30px clamp(22px, 4vw, 44px); display: grid; grid-template-columns: auto 1fr; gap: 20px 48px; align-items: center; }
.cuota-importe { margin: 0; font-size: 1.05rem; }
.cuota-importe strong { display: block; font-family: var(--serif); font-size: clamp(2.4rem, 5vw, 3.4rem); color: var(--oro-claro); line-height: 1; }
.cuota ul { margin: 0; padding-left: 1.1em; columns: 2; column-gap: 32px; font-size: .96rem; }
.cuota li { margin-bottom: .4em; break-inside: avoid; }

/* ---------- Cierre y pie ---------- */
.cierre { padding: clamp(80px, 11vw, 150px) 0; background: radial-gradient(900px 400px at 50% 0%, rgba(169,149,92,.2), transparent 70%), var(--noche); }
.cierre h2 { font-size: clamp(2.4rem, 6vw, 4.2rem); }
.cierre .grande { margin-bottom: 2rem; }
.pie { background: var(--noche-2); color: #b9b6a8; padding: 44px 0; border-top: 3px solid var(--oro); }
.pie-in { display: grid; gap: 22px; }
.pie .pequeno { color: #b9b6a8; margin: 0; }
.pie .marca-nombre { color: var(--oro-claro); margin: 0; }
.lema-pie { font-family: var(--serif); font-style: italic; margin: 6px 0 0; }
.pie-enlaces { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: 8px 24px; font-size: .92rem; }
.pie-enlaces a { color: #e9e5d8; text-underline-offset: 4px; }

/* ---------- Pantallas pequeñas ---------- */
@media (max-width: 960px) {
  .portada-in { grid-template-columns: 1fr; }
  .portada-foto .foto { aspect-ratio: 16 / 10; }
  .pacto, .lideres, .cifras, .momentos, .testimonios { grid-template-columns: repeat(2, 1fr); }
  .pacto article { border-right: 0; margin-right: 0; border-bottom: 1px solid rgba(38,39,49,.18); padding-bottom: 20px; }
  .grupos, .nuevos, .dos-col { grid-template-columns: 1fr; }
  .videos-par { flex-wrap: wrap; }
  .v-wrap { flex-basis: 220px; }
  .h-wrap { flex: 1 1 100%; }
  .cuota { grid-template-columns: 1fr; }
}
@media (max-width: 760px) {
  .menu-boton { display: block; }
  #menu { display: none; position: absolute; left: 0; right: 0; top: 100%; background: var(--noche); flex-direction: column; align-items: stretch; gap: 0; padding: 8px 16px 18px; border-bottom: 1px solid rgba(234,216,165,.25); }
  #menu.abierto { display: flex; }
  #menu a { padding: 14px 4px; border-bottom: 1px solid rgba(234,216,165,.12); }
  #menu .menu-cta { margin-top: 14px; text-align: center; border: 0; }
}
@media (max-width: 560px) {
  body { font-size: 16.5px; }
  .pacto, .lideres, .cifras, .momentos, .testimonios, .reuniones { grid-template-columns: 1fr; }
  .testimonios .video, .testimonios iframe { max-width: 320px; margin-inline: auto; }
  .testimonios figcaption { max-width: 320px; margin-inline: auto; }
  .cuota ul { columns: 1; }
  .lideres { gap: 26px; }
  .lideres article { display: grid; grid-template-columns: 104px 1fr; gap: 0 16px; align-items: start; }
  .lideres .retrato { grid-row: 1 / span 3; width: 104px; }
  .lideres h3 { margin-top: 0; }
  .lideres .bio { grid-column: 1 / -1; margin-top: 12px; }
  .lideres .linkedin { grid-column: 1 / -1; }
  .botones { flex-direction: column; align-items: flex-start; }
}
@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  * { transition: none !important; }
}

/* ---------- El Espejo ---------- */
.espejo { display: grid; grid-template-columns: 1.05fr 1fr; gap: clamp(28px, 5vw, 64px); align-items: center; }
.espejo-tarjeta { background: var(--noche); color: #ece8dc; padding: clamp(28px, 4vw, 48px); border-top: 3px solid var(--oro); }
.espejo-tarjeta .ambitos li::before { background: var(--oro); color: var(--noche); }
.ambitos { margin: 0 0 1.2rem; padding: 0; list-style: none; counter-reset: a; }
.ambitos li { counter-increment: a; padding: 6px 0 6px 2.2rem; position: relative; }
.ambitos li::before { content: counter(a); position: absolute; left: 0; top: 4px; width: 1.5rem; height: 1.5rem; border-radius: 50%; background: var(--oro-tinta); color: #fff; font-size: .82rem; font-weight: 600; display: grid; place-items: center; }
.espejo-tarjeta .remate { font-family: var(--serif); font-size: 1.4rem; color: var(--oro-claro, #EAD8A5); margin: 1.4rem 0 0; padding-top: 1.2rem; border-top: 1px solid rgba(169,149,92,.4); }
@media (max-width: 760px) { .espejo { grid-template-columns: 1fr; } }

.espejo .pregunta { font-family: var(--serif); font-size: clamp(1.25rem, 2.2vw, 1.6rem); color: var(--oro-tinta); margin: -.2em 0 1.4rem; line-height: 1.3; }

.precio-anio { display: block; font-size: .85rem; letter-spacing: .04em; color: var(--oro-claro); margin-top: 2px; }

.video.con-imagen .video-txt { text-shadow: 0 1px 6px rgba(0,0,0,.7); color: #fff; }

.video.con-imagen.vertical .video-txt { display: none; }
.video.con-imagen:not(.vertical) .video-txt { position: absolute; left: 0; right: 0; bottom: 16px; }

/* ---------- Página de Perú ---------- */
.portada .rotulo { color: var(--oro); }
.puente-svg { width: 100%; height: auto; display: block; }
.etiquetas-papel li { border-color: var(--oro-tinta); color: var(--noche); }
.lider-uno { display: grid; grid-template-columns: minmax(200px, 300px) 1fr; gap: clamp(24px, 5vw, 56px); align-items: start; margin-top: 2rem; }
.lider-uno h3 { font-size: 1.7rem; margin: 0 0 4px; }
.lider-uno .cargo { margin-bottom: 1rem; }
.tres { display: grid; grid-template-columns: repeat(3, 1fr); gap: 28px; margin: 2.4rem 0; }
.tres article { border-top: 2px solid var(--oro); padding-top: 18px; }
.tres h3 { color: var(--oro-claro); font-size: 1.3rem; margin-bottom: 8px; }
.tres p { margin: 0; color: #d9d5c6; }
.remate-puente { font-family: var(--serif); font-size: clamp(1.25rem, 2.4vw, 1.6rem); color: var(--oro-claro); border-left: 3px solid var(--oro); padding-left: 18px; margin: 2rem 0 0; max-width: 760px; }
@media (max-width: 760px) { .lider-uno, .tres { grid-template-columns: 1fr; } .lider-uno .retrato { max-width: 260px; } }

.estrecho-izq { max-width: 760px; }
.subtitulo-jornada { margin: 3rem 0 0; }
