/* web.css de pi-one.app · solo variables del kit (lo comprueba pione-web-verificar) */
.mosaico { padding: 18px; border-radius: var(--radio-l); background: linear-gradient(var(--fondo), var(--fondo)) padding-box, var(--pione-degradado) border-box;
  border: 3px solid transparent; box-shadow: var(--sombra-alta); }
.mosaico-rejilla { display: grid; grid-template-columns: repeat(3, 1fr); gap: 14px; }
.mosaico-rejilla a { display: grid; place-items: center; aspect-ratio: 1; border-radius: var(--radio); background: var(--fondo-alt); transition: transform .15s; }
.mosaico-rejilla a:hover { transform: scale(1.04); }
.mosaico-rejilla img { width: 72%; height: auto; }
.nota-planes { text-align: center; color: var(--gris); font-size: 15px; margin-top: 18px; }
.aviso-compra { margin: 28px auto 0; max-width: 760px; padding: 18px 22px; border-radius: var(--radio); background: var(--app-suave); border: 1px solid var(--linea); font-size: 15px; color: var(--tinta); text-align: center; }
.legal-texto { max-width: 780px; }
.legal-texto h1 { font-size: clamp(30px, 4vw, 42px); }
.legal-texto h2 { font-size: 22px; margin-top: 1.6em; }
.legal-texto p, .legal-texto li { color: var(--gris); }
.legal-texto dl { display: grid; grid-template-columns: max-content 1fr; gap: 6px 18px; }
.legal-texto dt { font-weight: 600; }
.legal-texto dd { margin: 0; color: var(--gris); overflow-wrap: anywhere; }