/*
Theme Name: materiaimpresa Child
Theme URI: http://underscores.me/
Template: materiaimpresa
Author: Underscores.me
Author URI: http://underscores.me/
Description: Description
Tags: custom-background,custom-logo,custom-menu,featured-images,threaded-comments,translation-ready
Version: 1.0.0.1776129192
Updated: 2026-04-14 03:13:12

*/

@font-face {
  font-family: 'ABCSocialPlusVariable';
  src: url('ABCSocialPlusVariable.woff2') format('woff2');
  font-display: swap;
}

body {
	font-family: 'ABCSocialPlusVariable'!important;
}
.ditty-ticker__items {
	overflow: visible!important;
}
.ditty[data-display="20"] .ditty-item__elements h3,
.ditty[data-display="25"] .ditty-item__elements h3,
.ditty[data-display="28"] .ditty-item__elements .ditty-item__content {
	margin: 0;
	font-weight: 400!important;
	font-size: 2rem!important;
	-webkit-font-smoothing: none; /* Chrome / Safari */
  	-moz-osx-font-smoothing: grayscale; /* Firefox Mac */
}
.ditty[data-display="25"] .ditty-item__elements h3 {
	margin-bottom: 10px;
}
.ditty[data-display="28"] .ditty-item__elements .ditty-item__content {
	padding-bottom: 4px;
}
.brand {
    position: relative;
	display: flex;
	justify-content: center;
    overflow: hidden;
}
.brand img {
	width: 500px;
	margin-top: -50px;
	display: block;
}
.footer {
	margin: 0;
	padding: 0;
	list-style-type: none;
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 100px;
}
.footer li {
	display: flex;
	align-items: center;
}
.footer li span {
	margin-right: 10px;
	font-weight: 400!important;
	font-size: 2rem!important;
	color: #000;
}
.footer li img {
	height: 40px;
}


.logoLink {
  position: relative;
}

/* Contenedor clickeable */
#aplainau {
  width: 130px;
  cursor: pointer;
  transition: transform 0.25s ease, opacity 0.25s ease, filter 0.25s ease;
  transform-origin: center center;
  transform-box: view-box;
  position: absolute;
  right: 70px;
  top: 50%;
  transform: translateY(-50%);
}

/* Hover del SVG completo */
#aplainau:hover {
  opacity: 0.9;
  filter: brightness(1.05);
  transform: translateY(-50%) scale(1.04);
}

/* Giro del círculo */
#circle {
  transform-origin: center center;
  transform-box: fill-box;
  animation: giroHorario var(--velocidad-giro, 20s) linear infinite;
}

@keyframes giroHorario {
  from {
    transform: rotate(0deg);
  }
  to {
    transform: rotate(360deg);
  }
}

/* Opcional: si quieres que el texto no reciba eventos del mouse */
#text {
  pointer-events: none;
}
#aplainau #circle path {
  fill: #fff;
}
#aplainau #text path {
  fill: #e20613;
}



/* Tablet */
    @media (max-width: 1024px) {

      .ditty[data-display="20"] .ditty-item__elements h3,
      .ditty[data-display="25"] .ditty-item__elements h3,
      .ditty[data-display="28"] .ditty-item__elements .ditty-item__content,
      .footer li span {
        font-size: 1.5rem !important;
      }

      .brand .logo {
        width: min(420px, 88vw);
        margin-top: -30px;
      }

      .footer {
        gap: 28px 40px;
      }

    }

    /* Mobile */
    @media (max-width: 767px) {
      .entry-content {
        padding: 8px 12px 18px;
      }

      .ditty[data-display="20"] .ditty-item__elements h3,
      .ditty[data-display="25"] .ditty-item__elements h3,
      .ditty[data-display="28"] .ditty-item__elements .ditty-item__content,
      .footer li span {
        font-size: 1.2rem !important;
      }

      .ditty[data-display="25"] .ditty-item__elements h3 {
        margin-bottom: 6px;
      }

      .brand img,
      .brand .logo {
        width: min(300px, 85vw);
        margin-top: -10px;
      }

      .footer {
        flex-direction: column;
        gap: 18px;
      }

      .footer li {
        width: 100%;
        flex-direction: column;
        gap: 8px;
      }

      .footer li span {
        margin-right: 0;
      }
      #aplainau {
        width: 90px;
        right: 35px;
        margin-top: 10px;
      }

    }

    /* Mobile pequeño */
    @media (max-width: 480px) {
      .ditty[data-display="20"] .ditty-item__elements h3,
      .ditty[data-display="25"] .ditty-item__elements h3,
      .ditty[data-display="28"] .ditty-item__elements .ditty-item__content,
      .footer li span {
        font-size: 1.2rem !important;
      }

      .brand img,
      .brand .logo {
        width: min(240px, 82vw);
      }

    }