/* Portada */
.portada { padding-block: clamp(40px, 7vw, 96px) clamp(56px, 8vw, 112px); background: radial-gradient(90% 70% at 100% 0%, rgba(201, 162, 74, .14), transparent 60%), var(--blanco); }
.portada__fila { display: grid; gap: clamp(40px, 6vw, 72px); grid-template-columns: 1.05fr .95fr; align-items: center; }
.portada__texto { display: grid; gap: 24px; min-width: 0; }
.insignia { display: inline-flex; align-items: center; gap: 10px; width: fit-content; padding: 8px 14px; border: 1px solid var(--linea); border-radius: 999px; font-size: 14px; font-weight: 600; background: var(--blanco); }
.insignia__punto { width: 8px; height: 8px; border-radius: 50%; background: var(--naranja); box-shadow: 0 0 0 4px rgba(242, 92, 5, .15); }
.resalte { color: var(--dorado-oscuro); }
.portada__bajada { font-size: clamp(17px, 1.4vw, 20px); color: var(--gris-texto); max-width: 560px; }
.portada__botones { display: flex; flex-wrap: wrap; gap: 12px; }
.cifras { display: grid; grid-template-columns: repeat(3, auto); justify-content: space-between; gap: 16px; margin: 8px 0 0; padding-top: 24px; border-top: 1px solid var(--linea); }
/* Separadores naranjas entre las cifras de la portada */
.cifras > div { min-width: min-content; }
.cifras > div + div { border-left: 3px solid var(--naranja); padding-left: 16px; }
@media (max-width: 520px) {
  .cifras { grid-template-columns: 1fr; gap: 12px; }
  .cifras > div { border-left: 3px solid var(--naranja); padding-left: 12px; display: flex; align-items: baseline; gap: 10px; flex-wrap: wrap; }
  .cifras dt { font-size: 20px; }
  .cifras dd { margin: 0; }
}
.cifras dt { font: 800 clamp(18px, 1.75vw, 24px)/1.15 var(--fuente-titular); }
.cifras dd { margin: 4px 0 0; font-size: 14px; color: var(--gris-texto); }

.maqueta { position: relative; background: var(--marino); border-radius: 20px; padding: 18px; box-shadow: var(--sombra); color: var(--blanco); min-width: 0; }
.maqueta__barra { display: flex; align-items: center; gap: 6px; font-size: 12px; color: rgba(255, 255, 255, .6); margin-bottom: 14px; }
.maqueta__barra i { width: 9px; height: 9px; border-radius: 50%; background: rgba(255, 255, 255, .25); }
.maqueta__barra span { margin-left: 8px; }
.maqueta__cuerpo { display: grid; gap: 12px; grid-template-columns: 1fr 1fr; }
.maqueta__tarjeta { background: var(--marino-2); border: 1px solid var(--linea-marino); border-radius: 12px; padding: 14px; display: grid; gap: 6px; }
.maqueta__tarjeta--oscura { grid-column: 1 / -1; background: #0A1F36; }
.maqueta__etiqueta { font-size: 11px; letter-spacing: .1em; text-transform: uppercase; color: rgba(255, 255, 255, .6); }
.maqueta__tarjeta strong { font: 800 22px/1.1 var(--fuente-titular); }
.maqueta__tarjeta strong.dorado { color: var(--dorado); }
.maqueta__nota { font-size: 12px; color: rgba(255, 255, 255, .6); }
.maqueta__barras { display: flex; align-items: flex-end; gap: 8px; height: 70px; margin-top: 6px; }
.maqueta__barras i { flex: 1; background: rgba(255, 255, 255, .22); border-radius: 4px 4px 0 0; }
.maqueta__barras i.dorada { background: var(--dorado); }
.maqueta__tarjeta--raipi { grid-column: 1 / -1; gap: 8px; }
.maqueta__chat { font-size: 13px; line-height: 1.4; padding: 8px 12px; border-radius: 12px 12px 12px 4px; background: rgba(255, 255, 255, .1); max-width: 88%; }
.maqueta__chat--yo { justify-self: end; border-radius: 12px 12px 4px 12px; background: var(--dorado); color: var(--negro); font-weight: 600; }
.maqueta__leyenda { margin-top: 10px; font-size: 11px; color: rgba(255, 255, 255, .45); text-align: right; }
.flotante { position: absolute; background: var(--blanco); color: var(--negro); border-radius: 12px; padding: 10px 14px; box-shadow: var(--sombra); display: grid; gap: 2px; font-size: 13px; max-width: 220px; }
.flotante span { font-size: 11px; color: var(--naranja); font-weight: 700; text-transform: uppercase; letter-spacing: .08em; }
.flotante--arriba { top: -18px; right: -14px; }
.flotante--abajo { bottom: -22px; left: -14px; }

/* Marcas */
.encabezado-seccion--centro { margin-inline: auto; text-align: center; justify-items: center; }
.pildora { display: inline-flex; align-items: center; gap: 8px; padding: 6px 14px; border-radius: 999px; background: rgba(201, 162, 74, .16); font-size: 12px; font-weight: 700; letter-spacing: .14em; text-transform: uppercase; }
.marcas__grupos { display: grid; gap: 16px; grid-template-columns: 1.5fr 1fr; }
.marcas__grupo { background: var(--blanco); border: 1px solid var(--linea); border-radius: 20px; padding: 20px; display: grid; gap: 14px; align-content: start; }
.marcas__grupo--marino { background: var(--marino); border-color: var(--marino); }
.marcas__titulo { font-size: 12px; font-weight: 700; letter-spacing: .14em; text-transform: uppercase; color: var(--gris-texto); }
.marcas__grupo--marino .marcas__titulo { color: var(--dorado); }
.marcas__lista { list-style: none; margin: 0; padding: 0; display: grid; gap: 12px; grid-template-columns: repeat(auto-fit, minmax(140px, 1fr)); }
.marcas__lista li { background: var(--blanco); border: 1px solid var(--linea); border-radius: 12px; height: 104px; display: grid; place-items: center; padding: 14px 18px; }
.marcas__lista img { max-height: 72px; max-width: 100%; width: auto; height: auto; object-fit: contain; }
.marcas__lista img[src$="bahia-principe.png"] { max-height: 100px; transform: scale(1.45); }
.marcas__titulo i { font-style: normal; color: var(--naranja); margin: 0 6px; }
/* 6 logos en 3 columnas, cada uno en su tarjeta */
.marcas__grilla { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(3, 1fr); gap: 12px; }
.marcas__grilla li { background: var(--blanco); border: 1px solid var(--linea); border-radius: 12px; height: 104px; display: grid; place-items: center; padding: 14px 18px; }
.marcas__grilla img { max-height: 72px; max-width: 100%; width: auto; height: auto; object-fit: contain; }
.marcas__grilla img[src$="bahia-principe.png"] { max-height: 100px; transform: scale(1.45); }
.marcas__representa { flex: 1; display: grid; place-items: center; background: var(--blanco); border-radius: 12px; padding: 24px; border-top: 4px solid var(--naranja); }
.marcas__representa img { width: 100%; max-width: 300px; height: auto; }
.marcas__grupo--marino { display: flex; flex-direction: column; }
@media (max-width: 520px) { .marcas__grilla { grid-template-columns: repeat(2, 1fr); } }
.marcas__nota { margin-top: 20px; color: var(--gris-texto); font-size: 15px; text-align: center; }
@media (max-width: 760px) { .marcas__grupos { grid-template-columns: 1fr; } }

/* Hablemos claro */
.claro__fila { display: grid; gap: 48px; grid-template-columns: 1.2fr 1fr; align-items: center; }
.claro .encabezado-seccion { margin-bottom: 0; }
.claro__datos { margin: 0; display: grid; gap: 16px; }
.claro__datos div { border-left: 3px solid var(--dorado); padding: 6px 0 6px 18px; }
.claro__datos dt { font: 800 clamp(26px, 3vw, 36px)/1 var(--fuente-titular); }
.claro__datos dd { margin: 6px 0 0; color: var(--gris-texto); }

/* Tarjetas */
.tarjetas { display: grid; gap: 16px; grid-template-columns: repeat(auto-fit, minmax(min(100%, 300px), 1fr)); }
.tarjeta { background: var(--blanco); border: 1px solid var(--linea); border-radius: var(--radio); padding: 28px; display: grid; gap: 10px; align-content: start; }
.tarjeta__num { font-size: 12px; font-weight: 700; letter-spacing: .14em; text-transform: uppercase; color: var(--naranja); }
.tarjeta p { color: var(--gris-texto); font-size: 16px; }

/* Lo que vas a aprender */
.metodo { list-style: none; margin: 0 0 32px; padding: 0; display: flex; flex-wrap: wrap; align-items: center; gap: 12px; }
.metodo li { display: inline-flex; align-items: center; gap: 10px; padding: 10px 18px; border: 1px solid var(--linea-marino); border-radius: 999px; font: 800 18px/1 var(--fuente-titular); }
.metodo li span { font-size: 12px; color: var(--dorado); letter-spacing: .1em; }
.metodo li:not(:last-child)::after { content: "→"; margin-left: 14px; color: var(--dorado); font-family: var(--fuente-texto); }
.modulos { display: grid; gap: 16px; grid-template-columns: repeat(3, 1fr); }
.modulo { background: var(--marino-2); border: 1px solid var(--linea-marino); border-radius: var(--radio); padding: 26px; display: grid; gap: 10px; align-content: start; }
.modulo__num { font-size: 12px; font-weight: 700; letter-spacing: .12em; text-transform: uppercase; color: var(--dorado); }
.modulo p { color: rgba(255, 255, 255, .78); font-size: 16px; }
.kit { margin-top: 24px; background: var(--blanco); color: var(--negro); border-radius: 20px; padding: clamp(22px, 4vw, 36px); display: grid; gap: 24px; grid-template-columns: .9fr 1.1fr; align-items: center; border-left: 6px solid var(--naranja); }
.kit__etiqueta { font-size: 12px; font-weight: 700; letter-spacing: .14em; text-transform: uppercase; color: var(--naranja); }
.kit h3 { font-size: clamp(22px, 2.6vw, 30px); margin: 8px 0; }
.kit__texto p { color: var(--gris-texto); }
.kit__lista { list-style: none; margin: 0; padding: 0; display: grid; gap: 10px 20px; grid-template-columns: 1fr 1fr; }
.kit__lista li { position: relative; padding-left: 26px; font-size: 15px; }
.kit__lista li::before { content: ""; position: absolute; left: 2px; top: .4em; width: 12px; height: 7px; border-left: 3px solid var(--dorado); border-bottom: 3px solid var(--dorado); transform: rotate(-45deg); }

/* Cierre */
.cierre { background: var(--negro); color: var(--blanco); padding-block: clamp(56px, 8vw, 96px); text-align: center; }
.cierre__fila { display: grid; gap: 18px; justify-items: center; }
.cierre h2 { font-size: clamp(32px, 5vw, 56px); }
.cierre__destino { display: block; font-size: .72em; margin-top: 6px; }
@media (min-width: 720px) { .cierre__destino { white-space: nowrap; } }
.cierre p { color: rgba(255, 255, 255, .75); max-width: 56ch; }
.resalte-claro { color: var(--dorado); }

@media (max-width: 960px) { .modulos { grid-template-columns: 1fr; } .kit { grid-template-columns: 1fr; } }
@media (max-width: 520px) { .kit__lista { grid-template-columns: 1fr; } .metodo li:not(:last-child)::after { display: none; } }

/* Comparación */
.sr { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
.comparacion { max-width: 900px; margin-inline: auto; background: var(--blanco); border: 1px solid var(--linea); border-radius: 20px; overflow: hidden; box-shadow: 0 24px 60px -36px rgba(14, 42, 71, .35); }
.comparacion__fila { display: grid; grid-template-columns: .9fr 1.2fr 1.2fr; }
.comparacion__fila > * { padding: 20px 22px; border-top: 1px solid var(--linea); font-size: 15px; display: flex; align-items: center; gap: 12px; }
.comparacion__fila > strong { background: #FAFAF8; font-weight: 700; }
.comparacion__fila > .no { color: var(--gris-texto); align-items: flex-start; }
.comparacion__fila > .si { background: #F7EEDC; color: var(--negro); font-weight: 500; align-items: flex-start; }
.comparacion__cabeza > * { border-top: 0; padding-block: 22px; font-weight: 700; font-size: 15px; color: var(--gris-texto); background: var(--blanco); }
.comparacion__cabeza > :nth-child(3) { background: #F7EEDC; color: var(--negro); }
.no::before, .si::before { content: ""; flex: 0 0 22px; height: 22px; border-radius: 50%; margin-top: 1px; background-repeat: no-repeat; background-position: center; }
.no::before { background-color: #FBE3E1; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='10' viewBox='0 0 10 10'%3E%3Cpath d='M2 2l6 6M8 2l-6 6' stroke='%23C0392B' stroke-width='1.8' stroke-linecap='round'/%3E%3C/svg%3E"); }
.si::before { background-color: var(--dorado); background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='10' viewBox='0 0 12 10'%3E%3Cpath d='M1.5 5.2l3 3L10.5 2' fill='none' stroke='%230B0B0C' stroke-width='1.9' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E"); }
.ico-check-simple { width: 12px; height: 10px; background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='10' viewBox='0 0 12 10'%3E%3Cpath d='M1.5 5.2l3 3L10.5 2' fill='none' stroke='%23A8842F' stroke-width='1.9' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") no-repeat center; }
@media (max-width: 720px) {
  .comparacion__cabeza { display: none; }
  .comparacion__fila { grid-template-columns: 1fr; border-top: 1px solid var(--linea); }
  .comparacion__fila:nth-child(2) { border-top: 0; }
  .comparacion__fila > * { border-top: 0; padding: 10px 18px; }
  .comparacion__fila > strong { padding-top: 18px; background: transparent; }
  .comparacion__fila > .si { margin: 0 12px 16px; border-radius: 12px; }
}

/* Inversión */
.inversion { display: grid; gap: 20px; grid-template-columns: 1fr 1fr; align-items: start; }
.precio { background: var(--blanco); color: var(--negro); border-radius: 20px; padding: clamp(24px, 4vw, 40px); display: grid; gap: 12px; border-top: 6px solid var(--dorado); }
.precio__etiqueta { font-size: 12px; font-weight: 700; letter-spacing: .14em; text-transform: uppercase; color: var(--naranja); }
.precio__etiqueta { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; }
.oferta { background: var(--naranja); color: var(--blanco); padding: 3px 10px; border-radius: 999px; letter-spacing: .08em; }
.precio__antes { display: flex; align-items: baseline; gap: 10px; color: var(--gris-texto); font-size: 15px; margin-bottom: -6px; }
.precio__antes s { font: 700 22px/1 var(--fuente-titular); color: #9A9893; text-decoration-color: var(--naranja); text-decoration-thickness: 2px; }
.precio__monto { font: 800 clamp(40px, 5vw, 60px)/1 var(--fuente-titular); }
.precio__monto small { font-size: .4em; color: var(--gris-texto); }
.precio__alt { color: var(--gris-texto); }
.precio__lista { list-style: none; margin: 8px 0 12px; padding: 0; display: grid; gap: 10px; }
.precio__lista li { position: relative; padding-left: 28px; }
.precio__lista li::before { content: ""; position: absolute; left: 2px; top: .35em; width: 14px; height: 8px; border-left: 3px solid var(--dorado); border-bottom: 3px solid var(--dorado); transform: rotate(-45deg); }
.precio .boton { justify-self: start; }
.inversion__lateral { display: grid; gap: 16px; }
.mini { background: var(--marino-2); border: 1px solid var(--linea-marino); border-radius: var(--radio); padding: 22px; display: grid; gap: 10px; }
.mini p { color: rgba(255, 255, 255, .82); font-size: 16px; }
.mini strong { color: var(--dorado); }
.etiqueta { font: 700 11px/1 var(--fuente-texto); letter-spacing: .1em; text-transform: uppercase; background: rgba(255, 255, 255, .12); padding: 4px 8px; border-radius: 999px; vertical-align: middle; margin-left: 6px; }
.comisiones { width: 100%; border-collapse: collapse; font-size: 15px; font-variant-numeric: tabular-nums; }
.comisiones th, .comisiones td { text-align: left; padding: 8px 6px; border-bottom: 1px solid var(--linea-marino); }
.comisiones th { font-size: 12px; text-transform: uppercase; letter-spacing: .08em; color: rgba(255, 255, 255, .55); }
.comisiones td:nth-child(2) { color: var(--dorado); font-weight: 800; }
.mini--reservado { border-color: rgba(201, 162, 74, .45); }
.mini--reservado h3 { display: flex; align-items: center; flex-wrap: wrap; gap: 8px; }
.candado { width: 16px; height: 18px; background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='18' viewBox='0 0 16 18'%3E%3Crect x='1.5' y='8' width='13' height='9' rx='2' fill='%23C9A24A'/%3E%3Cpath d='M4.5 8V5.5a3.5 3.5 0 0 1 7 0V8' fill='none' stroke='%23C9A24A' stroke-width='2'/%3E%3C/svg%3E") no-repeat center; }
.reservado { display: grid; gap: 8px; filter: blur(3px); opacity: .6; user-select: none; }
.reservado__fila { display: flex; justify-content: space-between; gap: 12px; padding: 6px 0; border-bottom: 1px solid var(--linea-marino); }
.reservado__fila span { height: 10px; width: 62%; border-radius: 6px; background: rgba(255, 255, 255, .35); }
.reservado__fila b { height: 10px; width: 14%; border-radius: 6px; background: var(--dorado); }
.enlace-dorado { color: var(--dorado); font-weight: 700; text-decoration: none; font-size: 15px; }
.enlace-dorado:hover { text-decoration: underline; }
.mini .mini__nota { font-size: 13px; color: rgba(255, 255, 255, .6); }

/* Cómo funciona: 4 pasos */
.pasos { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(4, 1fr); gap: 16px; }
.paso { background: var(--blanco); border: 1px solid var(--linea); border-radius: 20px; padding: 28px 24px; display: grid; gap: 10px; align-content: start; transition: border-color .2s ease, box-shadow .2s ease, transform .2s ease; }
.paso:hover { border-color: var(--dorado); box-shadow: var(--sombra); transform: translateY(-2px); }
.paso__num { font: 800 40px/1 var(--fuente-titular); color: #D8DCE3; transition: color .2s ease; }
.paso:first-child .paso__num, .paso:hover .paso__num { color: var(--dorado); }
.paso p { color: var(--gris-texto); font-size: 15px; }

/* Bootcamps */
.bootcamps { display: grid; gap: 24px 16px; grid-template-columns: repeat(auto-fit, minmax(min(100%, 280px), 1fr)); align-items: start; }
.bootcamps__columna { display: grid; gap: 12px; }
.bootcamps__titulo { font: 800 14px/1.2 var(--fuente-titular); letter-spacing: .12em; text-transform: uppercase; color: var(--dorado); padding-bottom: 10px; border-bottom: 1px solid var(--linea-marino); }
.bootcamp { background: var(--marino-2); border: 1px solid var(--linea-marino); border-radius: var(--radio); padding: 22px; display: grid; gap: 6px; }
.bootcamp__modalidad { font-size: 12px; font-weight: 700; letter-spacing: .12em; text-transform: uppercase; color: var(--dorado); }
.bootcamp__fecha { font: 800 20px/1.2 var(--fuente-titular); }
.bootcamp__lugar, .bootcamp__cupos { font-size: 14px; color: rgba(255, 255, 255, .7); }
.bootcamps__vacio { color: rgba(255, 255, 255, .8); }

/* FAQ */
.faq__fila { display: grid; gap: 48px; grid-template-columns: .8fr 1.2fr; align-items: start; }
.faq__fila .encabezado-seccion { position: sticky; top: 100px; }
.faq details { border-bottom: 1px solid var(--linea); }
.faq summary { cursor: pointer; list-style: none; display: flex; justify-content: space-between; gap: 16px; padding: 20px 0; font-weight: 700; font-size: 17px; }
.faq summary::-webkit-details-marker { display: none; }
.faq summary::after { content: "+"; font: 400 26px/1 var(--fuente-texto); color: var(--dorado-oscuro); transition: transform .2s ease; }
.faq details[open] summary::after { transform: rotate(45deg); }
.faq details p { padding: 0 0 20px; color: var(--gris-texto); max-width: 65ch; }

/* Postular */
.postular__fila { display: grid; gap: 48px; grid-template-columns: .8fr 1.2fr; align-items: start; }
.formulario-caja { background: var(--blanco); border: 1px solid var(--linea); border-radius: 20px; padding: clamp(20px, 4vw, 36px); box-shadow: var(--sombra); min-width: 0; }
.formulario { display: grid; grid-template-columns: 1fr 1fr; gap: 18px 16px; }
.campo { display: grid; gap: 6px; min-width: 0; margin: 0; padding: 0; border: 0; }
.campo--ancho { grid-column: 1 / -1; }
.campo[hidden] { display: none; }
.campo label, .campo legend { font-size: 14px; font-weight: 700; padding: 0; }
.campo input[type="text"], .campo input[type="tel"], .campo input[type="email"], .campo select, .campo textarea { width: 100%; font: 16px/1.4 var(--fuente-texto); color: var(--negro); background: var(--blanco); border: 1.5px solid var(--linea); border-radius: 10px; padding: 12px 14px; transition: border-color .15s ease; }
.campo input:focus, .campo select:focus, .campo textarea:focus { outline: none; border-color: var(--dorado); box-shadow: 0 0 0 3px rgba(201, 162, 74, .2); }
.campo [aria-invalid="true"] { border-color: #C0392B; }
.campo textarea { resize: vertical; }
.campo__ayuda { font-size: 13px; color: var(--gris-texto); }
.campo__error { font-size: 13px; color: #C0392B; font-weight: 600; min-height: 0; }
.campo__error:empty { display: none; }
.opciones { display: flex; flex-wrap: wrap; gap: 8px 18px; }
.opciones legend { margin-bottom: 8px; width: 100%; }
.opciones label { font-weight: 500; display: inline-flex; align-items: center; gap: 8px; cursor: pointer; }
.opciones .campo__error { width: 100%; }
.casilla { display: flex !important; gap: 10px; align-items: flex-start; font-weight: 500 !important; cursor: pointer; }
.casilla input { margin-top: 4px; }
input[type="radio"], input[type="checkbox"] { accent-color: var(--negro); width: 18px; height: 18px; }
.campo--trampa { position: absolute; left: -9999px; width: 1px; height: 1px; overflow: hidden; }
.boton--bloque { width: 100%; min-height: 54px; font-size: 16px; }
.boton:disabled { opacity: .6; cursor: progress; transform: none; }
.formulario__error { margin-top: 10px; padding: 12px 14px; border-radius: 10px; background: #FDECEA; color: #8E2A1F; font-size: 14px; }
.exito { text-align: center; display: grid; gap: 12px; justify-items: center; padding: 24px 8px; }
.exito:focus { outline: none; }
.exito__icono { width: 64px; height: 64px; border-radius: 50%; background: var(--dorado); position: relative; }
.exito__icono::after { content: ""; position: absolute; left: 22px; top: 18px; width: 16px; height: 26px; border-right: 4px solid var(--negro); border-bottom: 4px solid var(--negro); transform: rotate(45deg); }
@media (max-width: 600px) { .formulario { grid-template-columns: 1fr; } }

@media (max-width: 960px) {
  .portada__fila, .claro__fila, .inversion, .faq__fila, .postular__fila { grid-template-columns: 1fr; }
  .faq__fila .encabezado-seccion { position: static; }
  .pasos { grid-template-columns: repeat(2, 1fr); }
  .flotante--arriba { right: 8px; }
  .flotante--abajo { left: 8px; }
}
@media (max-width: 520px) {
  .pasos { grid-template-columns: 1fr; }
  .cifras { gap: 10px; }
  .maqueta__cuerpo { grid-template-columns: 1fr; }
  .flotante { display: none; }
}
