/*
Theme Name: the7dtchild
Author: Dream-Theme
Author URI: http://dream-theme.com/
Description: The7 is perfectly scalable, performance and SEO optimized, responsive, retina ready multipurpose WordPress theme. It will fit every site – big or small. From huge corporate portals to studio or personal sites – The7 will become a great foundation for your next project!
Version: 1.0.0
License: This WordPress theme is comprised of two parts: (1) The PHP code and integrated HTML are licensed under the GPL license as is WordPress itself.  You will find a copy of the license text in the same directory as this text file. Or you can read it here: http://wordpress.org/about/gpl/ (2) All other parts of the theme including, but not limited to the CSS code, images, and design are licensed according to the license purchased. Read about licensing details here: http://themeforest.net/licenses/regular_extended
Template: dt-the7
*/
#menu-principal .menu-text:hover,
#menu-principal .current-menu-item .menu-text,
#menu-principal .current-menu-ancestor .menu-text,
#menu-principal .current-menu-parent .menu-text {
    font-weight: 500 !important;
}

.elementor-counter .elementor-counter-number-suffix {
    color: #E29883 !important;
}

/* photo scroll icons position */
.elementor-40959 .elementor-element.elementor-element-c76b70e .btn-cntr {
    margin-bottom: -72px!important;
}



/* FORMAS INTRO CON TEXTO */


.circulo,
.cuadrado,
.rectangulo {
    display: inline-block;
    vertical-align: middle;
    flex: 0 0 auto;
    margin-left: 0.14em;
    margin-right: 0.14em;
    background-repeat: no-repeat;
    background-position: center;
    background-size: contain;
}

/* Círculo: más pequeño, conservando la alineación */
.circulo {
    width: 0.48em;
    height: 0.48em;
    vertical-align: -0.02em;
    background-image: url("https://escuelademusicafernandoremacha.com/wp-content/uploads/2026/08/circulo.svg");
}

/* Cuadrado: bajado 20 píxeles */
.cuadrado {
    width: 0.72em;
    height: 0.72em;
    position: relative;
    top: -5px;
    background-image: url("https://escuelademusicafernandoremacha.com/wp-content/uploads/2026/08/cuadrado.svg");
}

/* Rectángulo: 10 píxeles más ancho que el cuadrado y bajado 20 píxeles */
.rectangulo {
    width: calc(0.72em + 10px);
    height: 1.18em;
    position: relative;
    top: -25px;
    background-image: url("https://escuelademusicafernandoremacha.com/wp-content/uploads/2026/08/rectangulo.svg");
}


/* Responsive: tablet  */
@media (min-width: 768px) and (max-width: 1024px) {
    .circulo,
    .cuadrado,
    .rectangulo {
        margin-left: 0.10em;
        margin-right: 0.10em;
    }

    /* Círculo proporcionalmente más pequeño */
    .circulo {
        width: 0.42em;
        height: 0.42em;
        vertical-align: -0.02em;
    }

    /* Cuadrado: se mantiene ligeramente elevado */
    .cuadrado {
        width: 0.65em;
        height: 0.65em;
        top: -2px;
    }

    /* Rectángulo: conserva 10 px más de anchura que el cuadrado */
    .rectangulo {
        width: calc(0.65em + 10px);
        height: 1.08em;
        top: -14px;
    }
}


/* Responsive: movil  */
@media (max-width: 767px) {
    .circulo,
    .cuadrado,
    .rectangulo {
        margin-left: 0.10em;
        margin-right: 0.10em;
    }

    /* Círculo proporcionalmente más pequeño */
    .circulo {
        width: 0.42em;
        height: 0.42em;
        vertical-align: 3px;
    }

    /* Cuadrado: se mantiene ligeramente elevado */
    .cuadrado {
        width: 0.65em;
        height: 0.65em;
        top: -2px;
    }

    /* Rectángulo: conserva 10 px más de anchura que el cuadrado */
    .rectangulo {
        width: calc(0.65em + 10px);
        height: 1.08em;
        top: -8px;
    }
}


/* =========================================
   ANIMACIONES LENTAS PARA TODOS LOS DISPOSITIVOS
   ========================================= */

.circulo {
    animation: animar-circulo 2.20s ease-out both;
    transform-origin: center center;
}

.cuadrado {
    animation: animar-cuadrado 1.80s cubic-bezier(0.22, 0.75, 0.25, 1) 1.05s both;
    transform-origin: center center;
}

.rectangulo {
    animation: animar-rectangulo 1.50s ease-out 2.35s both;
    transform-origin: center center;
}

/* Círculo: aparece primero y rebota suavemente */
@keyframes animar-circulo {
    0% {
        opacity: 0;
        transform: scale(0.20) translateY(-0.25em);
    }

    45% {
        opacity: 1;
        transform: scale(1.10) translateY(0.07em);
    }

    68% {
        transform: scale(0.95) translateY(-0.04em);
    }

    84% {
        transform: scale(1.03) translateY(0.02em);
    }

    100% {
        opacity: 1;
        transform: scale(1) translateY(0);
    }
}

/* Cuadrado: aparece pequeño, gira y aumenta de tamaño */
@keyframes animar-cuadrado {
    0% {
        opacity: 0;
        transform: scale(0.08) rotate(-180deg);
    }

    65% {
        opacity: 1;
        transform: scale(1.08) rotate(12deg);
    }

    84% {
        transform: scale(0.97) rotate(-3deg);
    }

    100% {
        opacity: 1;
        transform: scale(1) rotate(0deg);
    }
}

/* Rectángulo: aparece pequeño y crece suavemente */
@keyframes animar-rectangulo {
    0% {
        opacity: 0;
        transform: scale(0.12);
    }

    100% {
        opacity: 1;
        transform: scale(1);
    }
}

/* Respeta las preferencias de accesibilidad */
@media (prefers-reduced-motion: reduce) {
    .circulo,
    .cuadrado,
    .rectangulo {
        animation: none;
        opacity: 1;
        transform: none;
    }
}


/* FORMAS FINAL */



/* =========================================================
   MENÚ INSTRUMENTOS
   Hover + elemento actual → cuadrado-on.svg
   ========================================================= */

/* Icono del menú */
#menuinstrumentos .dt-nav-menu > li > a .item-content > svg {
    background-repeat: no-repeat;
    background-position: center;
    background-size: contain;
}

/* HOVER */
#menuinstrumentos .dt-nav-menu > li > a:hover .item-content > svg {
    background-image: url("https://escuelademusicafernandoremacha.com/wp-content/uploads/2026/09/cuadrado-on.svg");
}

/* CURRENT / ACTIVO */
#menuinstrumentos .dt-nav-menu > li.current-menu-item > a .item-content > svg,
#menuinstrumentos .dt-nav-menu > li.current_page_item > a .item-content > svg,
#menuinstrumentos .dt-nav-menu > li > a.active-item .item-content > svg {
    background-image: url("https://escuelademusicafernandoremacha.com/wp-content/uploads/2026/09/cuadrado-on.svg");
}

/* Ocultamos el dibujo original del SVG cuando está
   en hover o activo para que se vea el nuevo icono */
#menuinstrumentos .dt-nav-menu > li > a:hover .item-content > svg path,
#menuinstrumentos .dt-nav-menu > li.current-menu-item > a .item-content > svg path,
#menuinstrumentos .dt-nav-menu > li.current_page_item > a .item-content > svg path,
#menuinstrumentos .dt-nav-menu > li > a.active-item .item-content > svg path {
    opacity: 0;
}