/* Portada interna para comparar las tres propuestas.
   No forma parte de la landing: es la pantalla desde la que se elige dirección
   y desaparece cuando haya una elegida. */

body.v-indice{
  background:
    radial-gradient(48% 40% at 12% 8%,var(--rosa-soft) 0%,transparent 60%),
    radial-gradient(42% 36% at 88% 14%,var(--azul-soft) 0%,transparent 58%),
    var(--crema);
  min-height:100svh;
}

.idx{ padding:clamp(46px,7vw,90px) clamp(20px,4vw,32px) clamp(60px,8vw,110px); text-align:center }
.idx .logo{ width:min(420px,74%); height:auto; color:var(--vino); margin-bottom:26px }
.idx .pill{
  display:inline-block; margin:0 0 26px; padding:10px 20px; border-radius:999px;
  background:var(--vino); color:var(--crema);
  font-weight:700; font-size:12px; letter-spacing:.18em; text-transform:uppercase;
}
.idx h1{ font-size:clamp(34px,6vw,74px); max-width:16ch; margin:0 auto .4em }
.idx .lead{ margin:0 auto 52px; max-width:60ch }

.p-grid{ display:grid; grid-template-columns:repeat(auto-fit,minmax(290px,1fr)); gap:22px; text-align:left }

.p-card{
  border-radius:var(--r); padding:clamp(26px,3vw,38px);
  display:flex; flex-direction:column; gap:12px;
  border:2px solid var(--vino);
  box-shadow:8px 8px 0 var(--vino);
  transition:transform .3s cubic-bezier(.2,.7,.3,1),box-shadow .3s;
}
.p-card:hover{ transform:translate(-3px,-3px); box-shadow:12px 12px 0 var(--vino) }
.p-card .btn{ align-self:flex-start; margin-top:auto }
.p-n{ font-size:11.5px; font-weight:800; letter-spacing:.2em; text-transform:uppercase; opacity:.6; margin:0 }
.p-card h2{ font-size:clamp(28px,3.4vw,44px); margin:0 }
.p-card p{ font-size:15.5px }

/* Cada tarjeta anticipa el ambiente de su propuesta: al abrirla no hay sorpresa. */
.p-1{ background:var(--crema) }
.p-1 .btn-pri{ background:var(--vino); color:var(--crema); border-color:var(--vino) }
.p-2{ background:#fff; border-radius:4px; box-shadow:8px 8px 0 var(--rosa) }
.p-2:hover{ box-shadow:12px 12px 0 var(--rosa) }
.p-2 .btn{ border-radius:0 }
.p-3{ background:#2A0207; color:#F6EDE8; border-color:#2A0207 }
.p-3 h2{ color:#F6EDE8 }
.p-3 p{ color:rgba(246,237,232,.8) }
.p-3 .btn-pri{ background:var(--rosa); color:#2A0207; border-color:var(--rosa) }
.p-4{ background:#FBF7F4; box-shadow:8px 8px 0 var(--azul) }
.p-4:hover{ box-shadow:12px 12px 0 var(--azul) }
.p-4 .btn-pri{ background:var(--vino); color:var(--crema); border-color:var(--vino) }

.nota-idx{
  margin:48px auto 0; max-width:62ch; font-size:14px; opacity:.65;
  border-top:1px solid var(--linea); padding-top:20px;
}