/* violetainteractive.com: portada y landings de público (usa interactive.css) */

/* Entradas por público: toda la tarjeta es el enlace */
a.puerta { text-decoration: none; color: var(--berenjena); transition: border-color .15s, transform .15s; }
a.puerta:hover { border-color: var(--violeta); transform: translateY(-3px); }
a.puerta .area-enlace { margin-top: auto; }

/* Departamentos (marketing / RRHH) o públicos (escuelas / museos): dos tarjetas */
.departamentos { display: grid; grid-template-columns: 1fr 1fr; gap: 24px; }
@media (max-width: 760px) { .departamentos { grid-template-columns: 1fr; } }

/* Sectores */
.sectores .tarjeta-sector { background: var(--blanco); border: 1px solid var(--linea); border-radius: var(--radio); padding: 24px; }
.sectores .icono { width: 40px; height: 40px; margin-bottom: 10px; }
.sectores h3 { margin-bottom: .3em; }
.sectores p { margin: 0; color: var(--berenjena-suave); font-size: 1rem; }
@media (max-width: 560px) { .rejilla-4.sectores { grid-template-columns: 1fr; gap: 12px; } }

/* Un ejemplo: tres capturas reales del juego */
.ejemplo-capturas { display: grid; gap: 12px; }
.ejemplo-capturas img { width: 100%; height: auto; border-radius: 10px; box-shadow: var(--sombra); }
.ejemplo-capturas > div { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }

/* Quién está detrás */
.quien { max-width: 760px; text-align: center; }
.quien p { color: var(--berenjena-suave); font-size: 1.1rem; }