/* Inkaterra Asociación · sitio web · tipografía, botones, cabecera, menú móvil, pie */

/* redes sociales: cada icono es una máscara que se tiñe del color del texto (pie y panel móvil) */
.redes .ico{display:block;width:18px;height:18px;background:currentColor;-webkit-mask:center/contain no-repeat;mask:center/contain no-repeat}
.redes .ico.instagram{-webkit-mask-image:url("../img/red-instagram.png");mask-image:url("../img/red-instagram.png")}
.redes .ico.facebook{-webkit-mask-image:url("../img/red-facebook.png");mask-image:url("../img/red-facebook.png")}
.redes .ico.linkedin{-webkit-mask-image:url("../img/red-linkedin.png");mask-image:url("../img/red-linkedin.png")}
.redes .ico.youtube{-webkit-mask-image:url("../img/red-youtube.png");mask-image:url("../img/red-youtube.png")}
.redes .ico.tiktok{-webkit-mask-image:url("../img/red-tiktok.png");mask-image:url("../img/red-tiktok.png")}
.redes .ico.x{-webkit-mask-image:url("../img/red-x.png");mask-image:url("../img/red-x.png")}

/* rótulos: la línea corta se despliega al entrar la sección en pantalla (js/revela.js) */
section .rotulo i,footer .rotulo i{transform:scaleX(0);transform-origin:left;transition:transform .7s cubic-bezier(.2,.7,.2,1) .15s}
section.visto .rotulo i,footer.visto .rotulo i{transform:none}


@media (max-width:960px){
  section{padding:72px 0}
}
@media (max-width:560px){
  .wrap{width:calc(100% - 56px)}
}
@media (prefers-reduced-motion:reduce){*{transition:none!important}html{scroll-behavior:auto}}
/* el navegador del móvil no agranda el texto por su cuenta (Chrome Android «font boosting» / iOS al girar): la escala es la
   que marca el CSS, igual que en la vista previa (Rodrigo, 11 oct). El zoom con los dedos sigue funcionando */
html{-webkit-text-size-adjust:100%;text-size-adjust:100%}
/* al subir, sin entradas: lo que llega desde arriba ya está en su sitio (js/subir.js) */
html.subiendo *,html.subiendo *::before,html.subiendo *::after{transition-duration:0s!important;transition-delay:0s!important}