/* ============================================================
   STAMPA ACADEMIA FLEXO — Hoja de estilos del sitio
   Manual de Identidad V1 · Glacial Indifference · #D22730
   ============================================================ */

/* ---------- Fuentes ---------- */
@font-face {
  font-family: 'Glacial Indifference';
  src: url('../fonts/GlacialIndifference-Regular.woff2') format('woff2');
  font-weight: 400; font-style: normal; font-display: swap;
}
@font-face {
  font-family: 'Glacial Indifference';
  src: url('../fonts/GlacialIndifference-Bold.woff2') format('woff2');
  font-weight: 700; font-style: normal; font-display: swap;
}
@font-face {
  font-family: 'Glacial Indifference';
  src: url('../fonts/GlacialIndifference-Italic.woff2') format('woff2');
  font-weight: 400; font-style: italic; font-display: swap;
}

/* ---------- Variables — Manual V1 (nunca usar #C8141E · #595959 · #1A1A1A) ---------- */
:root {
  --rojo:         #D22730;
  --rojo-vino:    #76232F;
  --negro-logo:   #101820;
  --blanco-hueso: #F0EFEE;
  --texto:        #303031;
  --gris:         #B6B5B5;
  --gris-claro:   #E7EAE7;
  --rojo-txt:     #98151F;
  --oro:          #C6A15B;          /* identidad propia del Summit */
  --sombra:       0 10px 30px rgba(16,24,32,.10);
  --radio:        14px;
  --ancho:        1180px;
}

/* ---------- Reset básico ---------- */
*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
html { scroll-behavior: smooth; -webkit-text-size-adjust: 100%; }
@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after { animation: none !important; transition: none !important; }
}
body {
  font-family: 'Glacial Indifference', Arial, sans-serif;
  color: var(--texto);
  background: #fff;
  line-height: 1.65;
  font-size: 19px;
}
img { max-width: 100%; height: auto; display: block; }
a { color: var(--rojo-txt); text-decoration: none; }
a:hover { text-decoration: underline; }
ul { list-style: none; }

.contenedor { max-width: var(--ancho); margin: 0 auto; padding: 0 24px; }

/* ---------- Tipografía ---------- */
h1, h2, h3, h4 { font-weight: 700; line-height: 1.15; color: var(--negro-logo); }
h1 { font-size: clamp(2rem, 5vw, 3.4rem); }
h2 { font-size: clamp(1.6rem, 3.6vw, 2.4rem); }
h3 { font-size: 1.25rem; }
.kicker {
  display: inline-block;
  color: var(--rojo);
  font-weight: 700;
  letter-spacing: .14em;
  text-transform: uppercase;
  font-size: .85rem;
  margin-bottom: .8rem;
}
.kicker::before {
  content: '';
  display: inline-block;
  width: 26px; height: 3px;
  background: var(--rojo);
  vertical-align: middle;
  margin-right: 10px;
  border-radius: 2px;
}
.sub { color: var(--texto); opacity: .85; max-width: 640px; }

/* ---------- Botones ---------- */
.btn {
  display: inline-block;
  padding: 14px 30px;
  border-radius: 999px;
  font-weight: 700;
  font-size: 1rem;
  letter-spacing: .02em;
  transition: transform .15s ease, box-shadow .15s ease, background .15s ease;
  cursor: pointer;
  border: 2px solid transparent;
  text-align: center;
}
.btn:hover { text-decoration: none; transform: translateY(-2px); }
.btn-rojo { background: var(--rojo); color: #fff; box-shadow: 0 6px 18px rgba(210,39,48,.35); }
.btn-rojo:hover { background: var(--rojo-vino); color: #fff; }
.btn-borde { border-color: var(--negro-logo); color: var(--negro-logo); background: transparent; }
.btn-borde:hover { background: var(--negro-logo); color: #fff; }
.btn-blanco { background: #fff; color: var(--negro-logo); }
.btn-blanco:hover { background: var(--blanco-hueso); }
.btn-wa { background: #1faa55; color: #fff; }
.btn-wa:hover { background: #178a45; color: #fff; }
.btn-oro { background: var(--oro); color: var(--negro-logo); }
.btn-oro:hover { background: #b18e4b; color: var(--negro-logo); }

/* ---------- Header ---------- */
.header {
  position: sticky; top: 0; z-index: 50;
  background: rgba(255,255,255,.96);
  backdrop-filter: blur(8px);
  border-bottom: 1px solid var(--gris-claro);
}
.header-inner {
  display: flex; align-items: center; justify-content: space-between;
  gap: 24px; padding: 14px 24px;
  max-width: var(--ancho); margin: 0 auto;
}
.logo img { height: 52px; width: auto; }
.nav { display: flex; align-items: center; gap: 28px; }
.nav a {
  color: var(--texto); font-weight: 700; font-size: .98rem;
  padding: 6px 2px; border-bottom: 2px solid transparent;
}
.nav a:hover, .nav a.activo { color: var(--rojo); text-decoration: none; border-bottom-color: var(--rojo); }
.nav .btn { padding: 10px 22px; font-size: .92rem; }
.menu-btn {
  display: none; background: none; border: 0; cursor: pointer;
  width: 44px; height: 44px; position: relative;
}
.menu-btn span, .menu-btn span::before, .menu-btn span::after {
  content: ''; position: absolute; left: 8px; right: 8px; height: 3px;
  background: var(--negro-logo); border-radius: 2px; transition: transform .2s ease, opacity .2s ease;
}
.menu-btn span { top: 21px; }
.menu-btn span::before { top: -9px; }
.menu-btn span::after { top: 9px; }

@media (max-width: 900px) {
  .menu-btn { display: block; }
  .nav {
    position: absolute; top: 100%; left: 0; right: 0;
    background: #fff; flex-direction: column; align-items: stretch;
    padding: 12px 24px 22px; gap: 4px;
    border-bottom: 1px solid var(--gris-claro);
    box-shadow: var(--sombra);
    display: none;
  }
  .nav.abierto { display: flex; }
  .nav a { padding: 12px 4px; border-bottom: 1px solid var(--gris-claro); }
  .nav .btn { margin-top: 12px; }
  .logo img { height: 44px; }
}

/* ---------- Hero ---------- */
.hero {
  position: relative;
  min-height: min(88vh, 760px);
  display: flex; align-items: center;
  color: #fff;
  isolation: isolate;
  overflow: hidden;
}
.hero-fondo {
  position: absolute; inset: 0; z-index: -2;
  background-size: cover; background-position: center;
}
.hero::after {
  content: ''; position: absolute; inset: 0; z-index: -1;
  background: linear-gradient(100deg, rgba(16,24,32,.80) 0%, rgba(16,24,32,.52) 45%, rgba(16,24,32,.20) 100%);
}
.hero-contenido { max-width: 720px; padding: 90px 0; }
.hero h1 { color: #fff; margin-bottom: 1.1rem; }
.hero h1 .acento { color: var(--rojo); }
.hero p { font-size: 1.22rem; color: var(--blanco-hueso); max-width: 600px; margin-bottom: 2rem; }
.hero-ctas { display: flex; flex-wrap: wrap; gap: 14px; margin-bottom: 2.4rem; }
.hero-sellos { display: flex; flex-wrap: wrap; gap: 10px; }
.sello {
  border: 1px solid rgba(240,239,238,.35);
  color: var(--blanco-hueso);
  border-radius: 999px;
  padding: 6px 16px;
  font-size: .85rem; font-weight: 700; letter-spacing: .05em;
  background: rgba(16,24,32,.35);
}

/* ---------- Barra de cifras ---------- */
.cifras { background: var(--negro-logo); color: #fff; padding: 34px 0; }
.cifras-grid {
  display: grid; grid-template-columns: repeat(4, 1fr); gap: 20px;
  text-align: center;
}
.cifra strong { display: block; font-size: 2.1rem; color: #fff; line-height: 1.1; }
.cifra span { color: var(--gris); font-size: .9rem; letter-spacing: .04em; }
@media (max-width: 760px) { .cifras-grid { grid-template-columns: repeat(2, 1fr); gap: 26px 12px; } }

/* ---------- Secciones ---------- */
.seccion { padding: 90px 0; }
.seccion-gris { background: var(--blanco-hueso); }
.seccion-oscura { background: var(--negro-logo); color: var(--blanco-hueso); }
.seccion-oscura h2, .seccion-oscura h3 { color: #fff; }
.encabezado-seccion { max-width: 680px; margin-bottom: 3rem; }
.encabezado-seccion.centrado { margin-left: auto; margin-right: auto; text-align: center; }
.encabezado-seccion.centrado .kicker::before { display: none; }

/* ---------- Split (imagen + contenido) ---------- */
.split {
  display: grid; grid-template-columns: 1fr 1fr;
  gap: 60px; align-items: center;
}
.split-img {
  border-radius: var(--radio);
  overflow: hidden;
  box-shadow: var(--sombra);
}
.split-img img { width: 100%; height: 100%; object-fit: cover; }
@media (max-width: 900px) { .split { grid-template-columns: 1fr; gap: 34px; } }

.lista-check { margin: 1.4rem 0 2rem; }
.lista-check li {
  padding-left: 34px; position: relative; margin-bottom: .75rem;
}
.lista-check li::before {
  content: ''; position: absolute; left: 0; top: 5px;
  width: 20px; height: 20px; border-radius: 50%;
  background: var(--rojo);
  -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='3'%3E%3Cpath d='M20 6L9 17l-5-5'/%3E%3C/svg%3E") center/14px no-repeat, linear-gradient(#000,#000);
  mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='3'%3E%3Cpath d='M20 6L9 17l-5-5'/%3E%3C/svg%3E") center/14px no-repeat, linear-gradient(#000,#000);
  -webkit-mask-composite: xor; mask-composite: exclude;
  background: var(--rojo);
}
.lista-check li::after {
  content: '✓'; position: absolute; left: 4px; top: 3px;
  color: #fff; font-size: .8rem; font-weight: 700;
}

.dato-clave { display: flex; gap: 26px; flex-wrap: wrap; margin: 1.6rem 0 2rem; }
.dato-clave div strong { display: block; font-size: 1.7rem; color: var(--rojo); line-height: 1.1; }
.dato-clave div span { font-size: .88rem; color: var(--texto); opacity: .75; }

/* ---------- Tarjetas ---------- */
.tarjetas { display: grid; grid-template-columns: repeat(auto-fit, minmax(230px, 1fr)); gap: 22px; }
.tarjeta {
  background: #fff; border: 1px solid var(--gris-claro);
  border-radius: var(--radio); padding: 30px 26px;
  transition: transform .18s ease, box-shadow .18s ease;
}
.tarjeta:hover { transform: translateY(-5px); box-shadow: var(--sombra); }
.tarjeta .icono {
  width: 48px; height: 48px; border-radius: 12px;
  background: rgba(210,39,48,.09);
  display: flex; align-items: center; justify-content: center;
  margin-bottom: 18px;
}
.tarjeta .icono svg { width: 26px; height: 26px; stroke: var(--rojo); }
.tarjeta h3 { margin-bottom: .5rem; font-size: 1.2rem; }
.tarjeta p { font-size: 1.02rem; opacity: .85; }
.seccion-gris .tarjeta { border-color: transparent; box-shadow: 0 3px 14px rgba(16,24,32,.06); }

/* ---------- Summit ---------- */
.summit {
  background: #2d2b2a;               /* empata con el fondo del logo del evento */
  color: var(--blanco-hueso);
  position: relative; overflow: hidden;
}
.summit::before {
  content: ''; position: absolute; inset: 0;
  background:
    radial-gradient(600px 300px at 85% 20%, rgba(198,161,91,.16), transparent 70%),
    radial-gradient(500px 260px at 10% 90%, rgba(198,161,91,.10), transparent 70%);
}
.summit-logo img {
  width: 100%; max-width: 520px; margin: 0 auto; display: block;
  filter: drop-shadow(0 14px 34px rgba(0,0,0,.45));
  border-radius: 6px;
}
.summit .contenedor { position: relative; }
.summit .kicker { color: var(--oro); }
.summit .kicker::before { background: var(--oro); }
.summit h2 { color: #fff; letter-spacing: .06em; }
.summit .fecha-summit {
  color: var(--oro); font-weight: 700; font-size: 1.15rem;
  letter-spacing: .12em; text-transform: uppercase; margin: .8rem 0 1.2rem;
}
.summit p { max-width: 620px; opacity: .9; }

/* ---------- Testimonios ---------- */
.testimonios-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 22px; }
.testimonio {
  background: #fff; border-radius: var(--radio); padding: 34px 30px;
  box-shadow: 0 3px 14px rgba(16,24,32,.06);
  display: flex; flex-direction: column; gap: 18px;
}
.testimonio blockquote { font-size: 1.12rem; font-style: italic; color: var(--texto); }
.testimonio blockquote::before { content: '“'; color: var(--rojo); font-size: 2.6rem; line-height: 0; vertical-align: -14px; margin-right: 6px; font-style: normal; }
.testimonio .autor strong { display: block; color: var(--negro-logo); }
.testimonio .autor span { font-size: .88rem; color: var(--texto); opacity: .7; }
.testimonio .metricas { display: flex; gap: 16px; flex-wrap: wrap; border-top: 1px solid var(--gris-claro); padding-top: 16px; }
.testimonio .metricas div strong { color: var(--rojo); font-size: 1.25rem; display: block; line-height: 1.1; }
.testimonio .metricas div span { font-size: .78rem; opacity: .7; }
@media (max-width: 860px) { .testimonios-grid { grid-template-columns: 1fr; } }

/* ---------- CTA franja ---------- */
.franja-cta { background: var(--rojo); color: #fff; padding: 70px 0; }
.franja-cta h2 { color: #fff; margin-bottom: .6rem; }
.franja-cta p { color: var(--blanco-hueso); margin-bottom: 1.8rem; max-width: 620px; }
.franja-cta .contenedor { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 30px; }

/* ---------- Formulario ---------- */
.form-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; }
.form-grid .campo-full { grid-column: 1 / -1; }
label { font-weight: 700; font-size: .88rem; display: block; margin-bottom: 6px; color: var(--negro-logo); }
input, select, textarea {
  width: 100%; padding: 13px 16px;
  border: 1.5px solid var(--gris);
  border-radius: 10px;
  font-family: inherit; font-size: 1rem; color: var(--texto);
  background: #fff;
}
input:focus, select:focus, textarea:focus {
  outline: none; border-color: var(--rojo);
  box-shadow: 0 0 0 3px rgba(210,39,48,.14);
}
@media (max-width: 700px) { .form-grid { grid-template-columns: 1fr; } }

/* ---------- Footer ---------- */
.footer { background: var(--negro-logo); color: var(--gris); padding: 70px 0 30px; }
.footer-grid {
  display: grid; grid-template-columns: 1.3fr 1fr 1fr; gap: 44px;
  padding-bottom: 44px; border-bottom: 1px solid rgba(182,181,181,.18);
}
.footer h4 { color: #fff; font-size: 1rem; letter-spacing: .1em; text-transform: uppercase; margin-bottom: 1.1rem; }
.footer a { color: var(--gris); }
.footer a:hover { color: #fff; }
.footer li { margin-bottom: .65rem; }
.marca-footer { font-size: 1.5rem; font-weight: 700; color: #fff; letter-spacing: .04em; }
.marca-footer .s { color: var(--rojo); }
.marca-footer small { display: block; font-size: .8rem; color: var(--rojo); font-weight: 400; letter-spacing: .3em; }
.footer .contacto-item { display: flex; gap: 10px; align-items: flex-start; margin-bottom: .8rem; }
.footer .contacto-item svg { width: 18px; height: 18px; stroke: var(--rojo); flex-shrink: 0; margin-top: 4px; }
.redes { display: flex; gap: 12px; margin-top: 1.2rem; }
.redes a {
  width: 40px; height: 40px; border-radius: 50%;
  border: 1px solid rgba(182,181,181,.35);
  display: flex; align-items: center; justify-content: center;
  transition: border-color .15s ease, background .15s ease;
}
.redes a:hover { border-color: var(--rojo); background: rgba(210,39,48,.12); }
.redes svg { width: 18px; height: 18px; fill: var(--gris); }
.redes a:hover svg { fill: #fff; }
.footer-legal {
  padding-top: 26px; text-align: center; font-size: .82rem; opacity: .7;
}
@media (max-width: 860px) { .footer-grid { grid-template-columns: 1fr; gap: 34px; } }

/* ---------- Botón WhatsApp flotante ---------- */
.wa-flotante {
  position: fixed; right: 22px; bottom: 22px; z-index: 60;
  display: flex; align-items: center; gap: 10px;
  background: #1faa55; color: #fff;
  padding: 13px 20px; border-radius: 999px;
  font-weight: 700; box-shadow: 0 8px 24px rgba(16,24,32,.3);
  transition: transform .15s ease;
}
.wa-flotante:hover { transform: scale(1.05); text-decoration: none; color: #fff; }
.wa-flotante svg { width: 22px; height: 22px; fill: #fff; }
@media (max-width: 700px) { .wa-flotante span { display: none; } .wa-flotante { padding: 14px; } }

/* ---------- Animación de aparición ---------- */
.aparece { opacity: 0; transform: translateY(16px); transition: opacity .55s ease, transform .55s ease; }
.aparece.visible { opacity: 1; transform: none; }
@media (prefers-reduced-motion: reduce) { .aparece { opacity: 1; transform: none; } }

/* ============================================================
   LANDING DIPLOMADO
   ============================================================ */
.hero-dip::after {
  background: linear-gradient(100deg, rgba(16,24,32,.94) 0%, rgba(118,35,47,.82) 55%, rgba(16,24,32,.55) 100%);
}
.badge-cupo {
  display: inline-flex; align-items: center; gap: 8px;
  background: rgba(210,39,48,.92); color: #fff;
  padding: 8px 18px; border-radius: 999px;
  font-weight: 700; font-size: .85rem; letter-spacing: .06em;
  margin-bottom: 1.4rem;
}
.badge-cupo::before {
  content: ''; width: 8px; height: 8px; border-radius: 50%;
  background: #fff; animation: pulso 1.6s infinite;
}
@keyframes pulso { 0%,100% { opacity: 1; } 50% { opacity: .3; } }

/* Problemas numerados */
.problemas { display: grid; grid-template-columns: 1fr 1fr; gap: 22px; }
.problema {
  background: #fff; border-radius: var(--radio); padding: 30px;
  border-top: 4px solid var(--rojo);
  box-shadow: 0 3px 14px rgba(16,24,32,.06);
}
.problema .num { font-size: 2rem; font-weight: 700; color: var(--gris); line-height: 1; }
.problema h3 { margin: .6rem 0 .4rem; font-size: 1.16rem; }
.problema p { font-size: 1.02rem; opacity: .8; margin-bottom: .8rem; }
.problema ul { font-size: .96rem; opacity: .75; }
.problema ul li { padding-left: 18px; position: relative; margin-bottom: .35rem; }
.problema ul li::before { content: '·'; position: absolute; left: 4px; color: var(--rojo); font-weight: 700; }
@media (max-width: 820px) { .problemas { grid-template-columns: 1fr; } }

/* Calculadora ROI */
.roi-caja {
  background: #fff; border-radius: var(--radio);
  box-shadow: var(--sombra); overflow: hidden;
  max-width: 760px; margin: 0 auto;
}
.roi-caja table { width: 100%; border-collapse: collapse; }
.roi-caja th, .roi-caja td { padding: 16px 24px; text-align: left; border-bottom: 1px solid var(--gris-claro); }
.roi-caja th { background: var(--negro-logo); color: #fff; font-size: .85rem; letter-spacing: .08em; text-transform: uppercase; }
.roi-caja td:last-child { text-align: right; font-weight: 700; white-space: nowrap; }
.roi-caja tr.total td { background: rgba(210,39,48,.07); color: var(--rojo-txt); font-size: 1.05rem; }
.roi-resumen {
  display: grid; grid-template-columns: repeat(3, 1fr);
  background: var(--negro-logo); color: #fff; text-align: center;
}
.roi-resumen div { padding: 22px 10px; }
.roi-resumen strong { display: block; font-size: 1.9rem; color: var(--oro); }
.roi-resumen span { font-size: .8rem; color: var(--gris); letter-spacing: .05em; }
.tabla-scroll { overflow-x: auto; }

/* Programa - módulos */
.modulos { display: grid; gap: 16px; }
.modulo {
  background: #fff; border: 1px solid var(--gris-claro); border-radius: var(--radio);
  padding: 26px 30px;
  display: grid; grid-template-columns: 64px 1fr auto; gap: 22px; align-items: center;
  transition: box-shadow .18s ease, transform .18s ease;
}
.modulo:hover { box-shadow: var(--sombra); transform: translateY(-3px); }
.modulo .rom {
  width: 64px; height: 64px; border-radius: 14px;
  background: var(--negro-logo); color: #fff;
  display: flex; align-items: center; justify-content: center;
  font-weight: 700; font-size: 1.2rem;
}
.modulo h3 { font-size: 1.2rem; margin-bottom: .25rem; }
.modulo p { font-size: 1.02rem; opacity: .8; }
.modulo .horas {
  text-align: right; white-space: nowrap;
  color: var(--rojo); font-weight: 700; font-size: 1.05rem;
}
.modulo .horas small { display: block; color: var(--texto); opacity: .6; font-weight: 400; font-size: .75rem; }
@media (max-width: 700px) {
  .modulo { grid-template-columns: 48px 1fr; }
  .modulo .rom { width: 48px; height: 48px; font-size: 1rem; }
  .modulo .horas { grid-column: 2; text-align: left; }
}

/* Modalidad */
.modalidad { display: grid; grid-template-columns: repeat(3, 1fr); gap: 22px; }
@media (max-width: 820px) { .modalidad { grid-template-columns: 1fr; } }

/* Inversión */
.inversion-caja {
  background: #fff; border-radius: var(--radio); box-shadow: var(--sombra);
  display: grid; grid-template-columns: 1.2fr 1fr; overflow: hidden;
}
.inversion-izq { padding: 44px 40px; }
.inversion-der {
  background: var(--negro-logo); color: var(--blanco-hueso);
  padding: 44px 40px;
  display: flex; flex-direction: column; justify-content: center; gap: 6px;
}
.inversion-der .precio { font-size: 2.8rem; font-weight: 700; color: #fff; line-height: 1.1; }
.inversion-der .precio small { font-size: 1rem; color: var(--gris); font-weight: 400; }
.inversion-der ul { margin: 1.2rem 0 1.6rem; }
.inversion-der li { font-size: 1.02rem; margin-bottom: .55rem; padding-left: 24px; position: relative; }
.inversion-der li::before { content: '✓'; position: absolute; left: 0; color: var(--oro); font-weight: 700; }
@media (max-width: 820px) { .inversion-caja { grid-template-columns: 1fr; } }

/* FAQ */
.faq { max-width: 780px; margin: 0 auto; }
.faq details {
  background: #fff; border: 1px solid var(--gris-claro);
  border-radius: 12px; margin-bottom: 12px;
  overflow: hidden;
}
.faq summary {
  padding: 20px 24px; font-weight: 700; cursor: pointer;
  list-style: none; position: relative; padding-right: 56px;
  color: var(--negro-logo);
}
.faq summary::-webkit-details-marker { display: none; }
.faq summary::after {
  content: '+'; position: absolute; right: 22px; top: 50%;
  transform: translateY(-50%);
  width: 28px; height: 28px; border-radius: 50%;
  background: var(--blanco-hueso); color: var(--rojo);
  display: flex; align-items: center; justify-content: center;
  font-size: 1.2rem; transition: transform .2s ease;
}
.faq details[open] summary::after { content: '–'; transform: translateY(-50%); background: var(--rojo); color: #fff; }
.faq details p { padding: 0 24px 22px; opacity: .85; font-size: 1.05rem; }
