/* El pie, uno solo para la portada y las páginas de contenido: franja carbón, el logo, tres columnas
   de enlaces y lo legal en letra chica al final. */
.pie { margin-top: clamp(4rem, 8vw, 7rem); background: #2E3134; color: rgb(231 241 238 / .72); font-size: .875rem; }
.pie a { color: #fff; text-decoration: none; }
.pie a:hover, .pie a:focus-visible { color: var(--mint); }
.pie .eyebrow { color: rgb(231 241 238 / .5); margin: 0 0 1rem; }
.pie .pie-rejilla { display: grid; grid-template-columns: 1.4fr repeat(3, 1fr); gap: 2rem; padding-block: clamp(3rem, 6vw, 4.5rem); }
.pie-rejilla > * { display: flex; flex-direction: column; gap: .6rem; align-items: flex-start; }
.pie-logo { height: 30px; width: auto; display: block; }
.pie .pie-legal { border-top: 1px solid rgb(231 241 238 / .12); padding-block: 1.5rem 2rem; font-size: .75rem; line-height: 1.6; }
.pie-legal p { margin: 0 0 .35rem; max-width: 60rem; }
@media (max-width: 56rem) { .pie-rejilla { grid-template-columns: 1fr 1fr; } .pie-rejilla > :first-child { grid-column: 1 / -1; } }