/* La página que elige entre las tres propuestas */
:root { --titulos: 'Gloock', Georgia, serif; }
body { font-family: 'Figtree', system-ui, sans-serif; font-size: 17px; line-height: 1.55; }
.portada { max-width: 1180px; margin-inline: auto; padding: clamp(24px, 5vw, 56px) clamp(16px, 4vw, 40px) 48px; }
.p-logo { width: 120px; }
.portada h1 { margin-top: 28px; max-width: 15em; font-family: var(--titulos); font-weight: 400; font-size: clamp(38px, 6vw, 72px); line-height: 1.03; }
.p-intro { margin-top: 16px; max-width: 38em; font-size: clamp(17px, 1.6vw, 20px); }
.p-tarjetas { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: clamp(14px, 2.4vw, 28px); margin-top: 36px; }
.p-tarjeta { display: grid; gap: 8px; align-content: start; text-decoration: none; }
.p-tarjeta img { width: 100%; aspect-ratio: 4 / 3; object-fit: cover; object-position: top; border: 1px solid var(--linea); transition: transform .2s ease; }
.p-tarjeta:hover img { transform: translateY(-4px); }
.p-tarjeta h2 { display: flex; align-items: baseline; gap: 9px; font-family: var(--titulos); font-weight: 400; font-size: clamp(28px, 3vw, 36px); line-height: 1.1; margin-top: 4px; }
.p-tarjeta h2 span { font-family: 'Figtree', sans-serif; font-size: 14px; font-weight: 600; padding: 2px 8px; background: var(--tinta); color: var(--crema); }
.p-tarjeta p { color: var(--suave); font-size: 16px; }
.p-prueba { margin-top: 44px; padding-top: 22px; border-top: 1px solid var(--tinta); display: grid; gap: 12px; max-width: 46em; }
.p-prueba h2 { font-family: var(--titulos); font-weight: 400; font-size: 28px; }
.p-prueba ol { list-style: decimal; padding-left: 22px; }
.p-prueba > p { color: var(--suave); font-size: 15px; }
.p-firma { margin-top: 28px; font-weight: 600; }
@media (max-width: 760px) { .p-tarjetas { grid-template-columns: 1fr; } }