/*
Theme Name: Blockskit Construction
Theme URI: https://blockskit.com/blockskit-construction/
Author: BlockskitDev
Author URI: https://blockskit.com
Description: Blockskit Construction is a modern and versatile WordPress theme designed for various types of websites including advertising, agency, blog, business, corporate, creative, design, finance, investments, management, marketing, portfolio, smm, startup, web design and more. It offers full-site-editing, allowing easy customization of all aspects of your site. With multiple templates, patterns, and style variations, it's suitable for different aesthetics. The theme is also compatible with popular plugins like Elementor, WooCommerce, and Spectra – WordPress Gutenberg Blocks, adding extra functionality to your site.
Template: blockskit-base
Version: 1.0.1
Requires at least: 6.0
Tested up to: 6.7
Requires PHP: 5.6
License: GPLv3 or later
License URI: http://www.gnu.org/licenses/gpl-3.0.html
Text Domain: blockskit-construction
Tags: one-column, custom-colors, custom-menu, custom-logo, editor-style, featured-images, full-site-editing, block-patterns, rtl-language-support, threaded-comments, translation-ready, wide-blocks, block-styles, blog, portfolio, education

Blockskit Construction WordPress Theme, Copyright 2024 BlockskitDev
Blockskit Construction is distributed under the terms of the GNU General Public License v3
*/

/* ==========================================================================
   Estilos personalizados - Constructora MDV
   ========================================================================== */

/* Navegación en una sola línea */
/* .wp-block-navigation__container {
    display: flex !important;
    flex-wrap: nowrap !important;
    white-space: nowrap;
}

.wp-block-navigation-item {
    flex-shrink: 0;
} */

/* Hover para enlaces de navegación del header - Solo desktop */
@media screen and (min-width: 769px) {
    .wp-block-navigation .wp-block-navigation-item__content.wp-block-navigation-item__content {
        /* color: var(--wp--preset--color--foreground) !important; */
        text-decoration: none;
        transition: color 0.3s ease, text-decoration 0.3s ease;
    }

    .wp-block-navigation .wp-block-navigation-item__content.wp-block-navigation-item__content:hover {
        color: var(--wp--preset--color--primary) !important;
        text-decoration: underline;
    }

    /* Hover para enlaces en la sección principal del footer (Title, Navigation, etc.) - Mantener color blanco */
    footer .wp-block-cover a:not(.wp-element-button):hover {
        color: var(--wp--preset--color--white) !important;
        text-decoration: underline;
    }

    .wp-block-navigation .wp-block-navigation-item__content.wp-block-navigation-item__content:focus {
        color: var(--wp--preset--color--primary) !important;
        outline: 2px solid var(--wp--preset--color--primary);
        outline-offset: 2px;
    }
}

/* Hover para header transparente - Fondo blanco, letras azules, borde inferior highlight */
@media screen and (min-width: 769px) {
    .bk-header-transparent:hover {
        background-color: var(--wp--preset--color--white) !important;
        border-bottom: 5px solid var(--wp--preset--color--highlight) !important;
        transition: background-color 0.3s ease, border-bottom 0.3s ease;
    }
    
    .bk-header-transparent:hover .wp-block-navigation-item__content {
        color: var(--wp--preset--color--primary) !important;
        text-decoration: none !important;
    }
    
    .bk-header-transparent:hover .wp-block-navigation-item__content:hover {
        color: var(--wp--preset--color--primary-hover) !important;
        text-decoration: underline !important;
    }
    
    .bk-header-transparent:hover .wp-block-button__link {
        background-color: var(--wp--preset--color--primary) !important;
        color: var(--wp--preset--color--white) !important;
        border-color: var(--wp--preset--color--primary) !important;
        transition: all 0.3s ease;
    }
    
    .bk-header-transparent:hover .wp-block-button__link:hover {
        background-color: var(--wp--preset--color--primary-hover) !important;
        transform: translateY(-1px);
    }
}

/* Botones - Estilos de hover */
/* Hover para botones primarios (cambio de fondo) */
.wp-block-button:not(.is-style-bk-button-secondary) .wp-block-button__link:hover,
.wp-block-button:not(.is-style-bk-button-secondary) .wp-element-button:hover {
    background-color: #0D2035 !important;
    transition: background-color 0.3s ease, transform 0.2s ease;
}

.wp-block-button:not(.is-style-bk-button-secondary) .wp-block-button__link:focus,
.wp-block-button:not(.is-style-bk-button-secondary) .wp-element-button:focus {
    background-color: #0D2035 !important;
    outline: 2px solid #0D2035;
    outline-offset: 2px;
}

/* Hover para botones secundarios (solo cambio de color de texto) */
.wp-block-button.is-style-bk-button-secondary .wp-block-button__link:hover,
.wp-block-button.is-style-bk-button-secondary .wp-element-button:hover {
    color: var(--wp--preset--color--primary-hover) !important;
    background-color: transparent !important;
    transition: color 0.3s ease;
}

.wp-block-button.is-style-bk-button-secondary .wp-block-button__link:focus,
.wp-block-button.is-style-bk-button-secondary .wp-element-button:focus {
    color: var(--wp--preset--color--primary-hover) !important;
    background-color: transparent !important;
    outline: 2px solid var(--wp--preset--color--primary);
    outline-offset: 2px;
}

/* Header transparente - position absolute */
.bk-header-transparent {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    width: 100%;
    z-index: 999;
}

/* Header sticky - position fixed */
.bk-header-sticky {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    width: 100%;
    z-index: 999;
    transition: top 0.3s ease;
}

/* Header centrado con bordes redondeados */
.is-style-bk-header-centered.bk-header-transparent {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    width: fit-content;
    z-index: 999;
    margin: 0 auto;
    border-radius: 12px;
}

/* Ajuste de headers para barra de administración de WordPress */
.logged-in.admin-bar .bk-header-sticky {
    top: 32px !important;
}

/* Logo responsive para móviles */
@media screen and (max-width: 768px) {

    .wp-block-site-logo img,
    .custom-logo {
        width: 120px !important;
        height: auto !important;
        max-width: 120px;
    }
}

@media screen and (max-width: 480px) {

    .wp-block-site-logo img,
    .custom-logo {
        width: 100px !important;
        height: auto !important;
        max-width: 100px;
    }
}

/* Responsive: Admin bar en móviles (menos de 783px) */
@media screen and (max-width: 782px) {}

/* ==========================================================================
   Iconos SVG en Navegación usando CSS Masks
   ========================================================================== */

/* Regla base para items de menú con iconos */
.wp-block-navigation-item[class*="menu-icon-"] a::before {
    content: '';
    display: inline-block;
    width: 1.2em;
    height: 1.2em;
    background-color: currentColor;
    mask-size: contain;
    mask-repeat: no-repeat;
    mask-position: center;
    -webkit-mask-size: contain;
    -webkit-mask-repeat: no-repeat;
    -webkit-mask-position: center;
    vertical-align: middle;
}

/* Layout Flexbox para alinear icono y texto */
.wp-block-navigation-item[class*="menu-icon-"] a {
    display: inline-flex;
    align-items: center;
    gap: 0.5em;
}

/* Icono Home/Inicio - Casa */
.wp-block-navigation-item.menu-icon-home a::before {
    mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='currentColor'%3E%3Cpath d='M10 20v-6h4v6h5v-8h3L12 3 2 12h3v8z'/%3E%3C/svg%3E");
    -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='currentColor'%3E%3Cpath d='M10 20v-6h4v6h5v-8h3L12 3 2 12h3v8z'/%3E%3C/svg%3E");
}

/* Icono Services/Servicios - Maletín */
.wp-block-navigation-item.menu-icon-services a::before {
    mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='currentColor'%3E%3Cpath d='M20 6h-4V4c0-1.11-.89-2-2-2h-4c-1.11 0-2 .89-2 2v2H4c-1.11 0-1.99.89-1.99 2L2 19c0 1.11.89 2 2 2h16c1.11 0 2-.89 2-2V8c0-1.11-.89-2-2-2zm-6 0h-4V4h4v2z'/%3E%3C/svg%3E");
    -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='currentColor'%3E%3Cpath d='M20 6h-4V4c0-1.11-.89-2-2-2h-4c-1.11 0-2 .89-2 2v2H4c-1.11 0-1.99.89-1.99 2L2 19c0 1.11.89 2 2 2h16c1.11 0 2-.89 2-2V8c0-1.11-.89-2-2-2zm-6 0h-4V4h4v2z'/%3E%3C/svg%3E");
}

/* Icono Contact/Contacto - Sobre/Email */
.wp-block-navigation-item.menu-icon-contact a::before {
    mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='currentColor'%3E%3Cpath d='M20 4H4c-1.1 0-1.99.9-1.99 2L2 18c0 1.1.9 2 2 2h16c1.1 0 2-.9 2-2V6c0-1.1-.9-2-2-2zm0 4l-8 5-8-5V6l8 5 8-5v2z'/%3E%3C/svg%3E");
    -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='currentColor'%3E%3Cpath d='M20 4H4c-1.1 0-1.99.9-1.99 2L2 18c0 1.1.9 2 2 2h16c1.1 0 2-.9 2-2V6c0-1.1-.9-2-2-2zm0 4l-8 5-8-5V6l8 5 8-5v2z'/%3E%3C/svg%3E");
}

/* Icono About/Sobre Nosotros - Info Circle */
.wp-block-navigation-item.menu-icon-about a::before {
    mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='currentColor'%3E%3Cpath d='M12 2C6.48 2 2 6.48 2 12s4.48 10 10 10 10-4.48 10-10S17.52 2 12 2zm1 15h-2v-6h2v6zm0-8h-2V7h2v2z'/%3E%3C/svg%3E");
    -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='currentColor'%3E%3Cpath d='M12 2C6.48 2 2 6.48 2 12s4.48 10 10 10 10-4.48 10-10S17.52 2 12 2zm1 15h-2v-6h2v6zm0-8h-2V7h2v2z'/%3E%3C/svg%3E");
}

/* Icono Projects/Proyectos - Carpeta */
.wp-block-navigation-item.menu-icon-projects a::before {
    mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='currentColor'%3E%3Cpath d='M10 4H4c-1.1 0-1.99.9-1.99 2L2 18c0 1.1.9 2 2 2h16c1.1 0 2-.9 2-2V8c0-1.1-.9-2-2-2h-8l-2-2z'/%3E%3C/svg%3E");
    -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='currentColor'%3E%3Cpath d='M10 4H4c-1.1 0-1.99.9-1.99 2L2 18c0 1.1.9 2 2 2h16c1.1 0 2-.9 2-2V8c0-1.1-.9-2-2-2h-8l-2-2z'/%3E%3C/svg%3E");
}

/* Icono Blog - Documento/Artículo */
.wp-block-navigation-item.menu-icon-blog a::before {
    mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='currentColor'%3E%3Cpath d='M14 2H6c-1.1 0-1.99.9-1.99 2L4 20c0 1.1.89 2 1.99 2H18c1.1 0 2-.9 2-2V8l-6-6zm2 16H8v-2h8v2zm0-4H8v-2h8v2zm-3-5V3.5L18.5 9H13z'/%3E%3C/svg%3E");
    -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='currentColor'%3E%3Cpath d='M14 2H6c-1.1 0-1.99.9-1.99 2L4 20c0 1.1.89 2 1.99 2H18c1.1 0 2-.9 2-2V8l-6-6zm2 16H8v-2h8v2zm0-4H8v-2h8v2zm-3-5V3.5L18.5 9H13z'/%3E%3C/svg%3E");
}

/* Icono WhatsApp */
.wp-block-navigation-item.menu-icon-whatsapp a::before {
    mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='currentColor'%3E%3Cpath d='M17.472 14.382c-.297-.149-1.758-.867-2.03-.967-.273-.099-.471-.148-.67.15-.197.297-.767.966-.94 1.164-.173.199-.347.223-.644.075-.297-.15-1.255-.463-2.39-1.475-.883-.788-1.48-1.761-1.653-2.059-.173-.297-.018-.458.13-.606.134-.133.298-.347.446-.52.149-.174.198-.298.298-.497.099-.198.05-.371-.025-.52-.075-.149-.669-1.612-.916-2.207-.242-.579-.487-.5-.669-.51-.173-.008-.371-.01-.57-.01-.198 0-.52.074-.792.372-.272.297-1.04 1.016-1.04 2.479 0 1.462 1.065 2.875 1.213 3.074.149.198 2.096 3.2 5.077 4.487.709.306 1.262.489 1.694.625.712.227 1.36.195 1.871.118.571-.085 1.758-.719 2.006-1.413.248-.694.248-1.289.173-1.413-.074-.124-.272-.198-.57-.347m-5.421 7.403h-.004a9.87 9.87 0 01-5.031-1.378l-.361-.214-3.741.982.998-3.648-.235-.374a9.86 9.86 0 01-1.51-5.26c.001-5.45 4.436-9.884 9.888-9.884 2.64 0 5.122 1.03 6.988 2.898a9.825 9.825 0 012.893 6.994c-.003 5.45-4.437 9.884-9.885 9.884m8.413-18.297A11.815 11.815 0 0012.05 0C5.495 0 .16 5.335.157 11.892c0 2.096.547 4.142 1.588 5.945L.057 24l6.305-1.654a11.882 11.882 0 005.683 1.448h.005c6.554 0 11.89-5.335 11.893-11.893a11.821 11.821 0 00-3.48-8.413z'/%3E%3C/svg%3E");
    -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='currentColor'%3E%3Cpath d='M17.472 14.382c-.297-.149-1.758-.867-2.03-.967-.273-.099-.471-.148-.67.15-.197.297-.767.966-.94 1.164-.173.199-.347.223-.644.075-.297-.15-1.255-.463-2.39-1.475-.883-.788-1.48-1.761-1.653-2.059-.173-.297-.018-.458.13-.606.134-.133.298-.347.446-.52.149-.174.198-.298.298-.497.099-.198.05-.371-.025-.52-.075-.149-.669-1.612-.916-2.207-.242-.579-.487-.5-.669-.51-.173-.008-.371-.01-.57-.01-.198 0-.52.074-.792.372-.272.297-1.04 1.016-1.04 2.479 0 1.462 1.065 2.875 1.213 3.074.149.198 2.096 3.2 5.077 4.487.709.306 1.262.489 1.694.625.712.227 1.36.195 1.871.118.571-.085 1.758-.719 2.006-1.413.248-.694.248-1.289.173-1.413-.074-.124-.272-.198-.57-.347m-5.421 7.403h-.004a9.87 9.87 0 01-5.031-1.378l-.361-.214-3.741.982.998-3.648-.235-.374a9.86 9.86 0 01-1.51-5.26c.001-5.45 4.436-9.884 9.888-9.884 2.64 0 5.122 1.03 6.988 2.898a9.825 9.825 0 012.893 6.994c-.003 5.45-4.437 9.884-9.885 9.884m8.413-18.297A11.815 11.815 0 0012.05 0C5.495 0 .16 5.335.157 11.892c0 2.096.547 4.142 1.588 5.945L.057 24l6.305-1.654a11.882 11.882 0 005.683 1.448h.005c6.554 0 11.89-5.335 11.893-11.893a11.821 11.821 0 00-3.48-8.413z'/%3E%3C/svg%3E");
}

/* Icono Teléfono */
.wp-block-navigation-item.menu-icon-phone a::before {
    mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='currentColor'%3E%3Cpath d='M6.62 10.79c1.44 2.83 3.76 5.14 6.59 6.59l2.2-2.2c.27-.27.67-.36 1.02-.24 1.12.37 2.33.57 3.57.57.55 0 1 .45 1 1V20c0 .55-.45 1-1 1-9.39 0-17-7.61-17-17 0-.55.45-1 1-1h3.5c.55 0 1 .45 1 1 0 1.25.2 2.45.57 3.57.11.35.03.74-.25 1.02l-2.2 2.2z'/%3E%3C/svg%3E");
    -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='currentColor'%3E%3Cpath d='M6.62 10.79c1.44 2.83 3.76 5.14 6.59 6.59l2.2-2.2c.27-.27.67-.36 1.02-.24 1.12.37 2.33.57 3.57.57.55 0 1 .45 1 1V20c0 .55-.45 1-1 1-9.39 0-17-7.61-17-17 0-.55.45-1 1-1h3.5c.55 0 1 .45 1 1 0 1.25.2 2.45.57 3.57.11.35.03.74-.25 1.02l-2.2 2.2z'/%3E%3C/svg%3E");
}

/* Icono Ubicación/Location */
.wp-block-navigation-item.menu-icon-location a::before {
    mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='currentColor'%3E%3Cpath d='M12 2C8.13 2 5 5.13 5 9c0 5.25 7 13 7 13s7-7.75 7-13c0-3.87-3.13-7-7-7zm0 9.5c-1.38 0-2.5-1.12-2.5-2.5s1.12-2.5 2.5-2.5 2.5 1.12 2.5 2.5-1.12 2.5-2.5 2.5z'/%3E%3C/svg%3E");
    -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='currentColor'%3E%3Cpath d='M12 2C8.13 2 5 5.13 5 9c0 5.25 7 13 7 13s7-7.75 7-13c0-3.87-3.13-7-7-7zm0 9.5c-1.38 0-2.5-1.12-2.5-2.5s1.12-2.5 2.5-2.5 2.5 1.12 2.5 2.5-1.12 2.5-2.5 2.5z'/%3E%3C/svg%3E");
}

/* Icono Email (alternativo al de Contact) */
.wp-block-navigation-item.menu-icon-email a::before {
    mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='currentColor'%3E%3Cpath d='M20 4H4c-1.1 0-1.99.9-1.99 2L2 18c0 1.1.9 2 2 2h16c1.1 0 2-.9 2-2V6c0-1.1-.9-2-2-2zm0 4l-8 5-8-5V6l8 5 8-5v2z'/%3E%3C/svg%3E");
    -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='currentColor'%3E%3Cpath d='M20 4H4c-1.1 0-1.99.9-1.99 2L2 18c0 1.1.9 2 2 2h16c1.1 0 2-.9 2-2V6c0-1.1-.9-2-2-2zm0 4l-8 5-8-5V6l8 5 8-5v2z'/%3E%3C/svg%3E");
}


/* Estilo base para todos los items de la lista */
.icon-item {
    display: flex;
    /* Alinea el icono al lado del texto */
    align-items: flex-start;
    /* Alinea el icono arriba si el texto es largo */
    margin-bottom: 20px;
    /* Espacio entre parrafos */
    position: relative;
    padding-left: 0;
}

/* Configuración común del icono */
.icon-item::before {
    content: "";
    flex-shrink: 0;
    /* Evita que el icono se aplaste */
    width: 24px;
    /* Tamaño del icono */
    height: 24px;
    margin-right: 12px;
    /* Espacio entre icono y texto */
    margin-top: 3px;
    /* Pequeño ajuste visual vertical */
    background-color: #1a3c6d;
    /* COLOR AZUL DE TU MARCA (Cámbialo si quieres) */

    /* Configuración de mascara para SVG */
    mask-repeat: no-repeat;
    -webkit-mask-repeat: no-repeat;
    mask-position: center;
    -webkit-mask-position: center;
    mask-size: contain;
    -webkit-mask-size: contain;
}

/* --- ICONOS ESPECÍFICOS --- */

/* 1. Seguridad (Escudo) */
.icon-seguridad::before {
    mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='currentColor'%3E%3Cpath d='M12 1L3 5v6c0 5.55 3.84 10.74 9 12 5.16-1.26 9-6.45 9-12V5l-9-4z'/%3E%3C/svg%3E");
    -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='currentColor'%3E%3Cpath d='M12 1L3 5v6c0 5.55 3.84 10.74 9 12 5.16-1.26 9-6.45 9-12V5l-9-4z'/%3E%3C/svg%3E");
}

/* 2. Calidad (Estrella/Medalla) */
.icon-calidad::before {
    mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='currentColor'%3E%3Cpath d='M12 17.27L18.18 21l-1.64-7.03L22 9.24l-7.19-.61L12 2 9.19 8.63 2 9.24l5.46 4.73L5.82 21z'/%3E%3C/svg%3E");
    -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='currentColor'%3E%3Cpath d='M12 17.27L18.18 21l-1.64-7.03L22 9.24l-7.19-.61L12 2 9.19 8.63 2 9.24l5.46 4.73L5.82 21z'/%3E%3C/svg%3E");
}

/* 3. Cliente (Cara feliz / Satisfacción) */
.icon-cliente::before {
    mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='currentColor'%3E%3Cpath d='M11.99 2C6.47 2 2 6.48 2 12s4.47 10 9.99 10C17.52 22 22 17.52 22 12S17.52 2 11.99 2zM12 20c-4.42 0-8-3.58-8-8s3.58-8 8-8 8 3.58 8 8-3.58 8-8 8zm3.5-9c.83 0 1.5-.67 1.5-1.5S16.33 8 15.5 8 14 8.67 14 9.5s.67 1.5 1.5 1.5zm-7 0c.83 0 1.5-.67 1.5-1.5S9.33 8 8.5 8 7 8.67 7 9.5 7.67 11 8.5 11zm3.5 6.5c2.33 0 4.31-1.46 5.11-3.5H6.89c.8 2.04 2.78 3.5 5.11 3.5z'/%3E%3C/svg%3E");
    -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='currentColor'%3E%3Cpath d='M11.99 2C6.47 2 2 6.48 2 12s4.47 10 9.99 10C17.52 22 22 17.52 22 12S17.52 2 11.99 2zM12 20c-4.42 0-8-3.58-8-8s3.58-8 8-8 8 3.58 8 8-3.58 8-8 8zm3.5-9c.83 0 1.5-.67 1.5-1.5S16.33 8 15.5 8 14 8.67 14 9.5s.67 1.5 1.5 1.5zm-7 0c.83 0 1.5-.67 1.5-1.5S9.33 8 8.5 8 7 8.67 7 9.5 7.67 11 8.5 11zm3.5 6.5c2.33 0 4.31-1.46 5.11-3.5H6.89c.8 2.04 2.78 3.5 5.11 3.5z'/%3E%3C/svg%3E");
}

/* 4. Desarrollo (Gráfica ascendente) */
.icon-desarrollo::before {
    mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='currentColor'%3E%3Cpath d='M16 6l2.29 2.29-4.88 4.88-4-4L2 16.59 3.41 18l6-6 4 4 6.3-6.29L22 12V6z'/%3E%3C/svg%3E");
    -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='currentColor'%3E%3Cpath d='M16 6l2.29 2.29-4.88 4.88-4-4L2 16.59 3.41 18l6-6 4 4 6.3-6.29L22 12V6z'/%3E%3C/svg%3E");
}

/* 5. Sostenibilidad (Hoja) */
.icon-sostenibilidad::before {
    mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='currentColor'%3E%3Cpath d='M17,8C8,10,5.9,16.17,3.82,21.34L5.71,22l0.95-2.3c0.48,0.17,1.01,0.25,1.54,0.25c2.4,0,4.36-1.77,4.77-4.08 c0.16-0.93,0.02-1.89-0.39-2.73c0.99,0.16,1.99,0.12,2.96-0.13c2.1-0.53,3.73-2.14,4.29-4.22c0.28-1.04,0.28-2.11,0-3.15L19.82,5.64 c0.21,0.78,0.21,1.58,0,2.37c-0.41,1.54-1.63,2.73-3.19,3.12c-0.73,0.18-1.48,0.21-2.22,0.09L13.92,12.57c0.18,0.34,0.25,0.72,0.19,1.1 c-0.31,1.72-1.77,3.05-3.56,3.05c-0.4,0-0.8-0.06-1.18-0.18L7.38,18C8.76,14.53,10.25,10.1,17,8z'/%3E%3C/svg%3E");
    -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='currentColor'%3E%3Cpath d='M17,8C8,10,5.9,16.17,3.82,21.34L5.71,22l0.95-2.3c0.48,0.17,1.01,0.25,1.54,0.25c2.4,0,4.36-1.77,4.77-4.08 c0.16-0.93,0.02-1.89-0.39-2.73c0.99,0.16,1.99,0.12,2.96-0.13c2.1-0.53,3.73-2.14,4.29-4.22c0.28-1.04,0.28-2.11,0-3.15L19.82,5.64 c0.21,0.78,0.21,1.58,0,2.37c-0.41,1.54-1.63,2.73-3.19,3.12c-0.73,0.18-1.48,0.21-2.22,0.09L13.92,12.57c0.18,0.34,0.25,0.72,0.19,1.1 c-0.31,1.72-1.77,3.05-3.56,3.05c-0.4,0-0.8-0.06-1.18-0.18L7.38,18C8.76,14.53,10.25,10.1,17,8z'/%3E%3C/svg%3E");
}

/* ==========================================================================
   Ajustes de tipografía responsive para móviles
   ========================================================================== */

/* Tablets y móviles grandes (hasta 768px) */
@media screen and (max-width: 768px) {
    :root {
        --wp--preset--font-size--xxx-large: 36px !important;
        --wp--preset--font-size--xx-large: 32px !important;
        --wp--preset--font-size--x-large: 26px !important;
        --wp--preset--font-size--large: 22px !important;
        --wp--preset--font-size--medium: 18px !important;
        --wp--preset--font-size--small: 16px !important;
        --wp--preset--font-size--x-small: 14px !important;
    }

    /* Ajustes específicos para headings */
    h1,
    .wp-block-heading h1,
    .has-xxx-large-font-size {
        font-size: 36px !important;
    }

    h2,
    .wp-block-heading h2,
    .has-xx-large-font-size {
        font-size: 32px !important;
    }

    h3,
    .wp-block-heading h3,
    .has-x-large-font-size {
        font-size: 26px !important;
    }

    h4,
    .wp-block-heading h4,
    .has-large-font-size {
        font-size: 22px !important;
    }

    h5,
    .wp-block-heading h5,
    .has-medium-font-size {
        font-size: 18px !important;
    }

    h6,
    .wp-block-heading h6,
    .has-small-font-size {
        font-size: 16px !important;
    }
}

/* Móviles pequeños (hasta 480px) */
@media screen and (max-width: 480px) {
    :root {
        --wp--preset--font-size--xxx-large: 30px !important;
        --wp--preset--font-size--xx-large: 26px !important;
        --wp--preset--font-size--x-large: 22px !important;
        --wp--preset--font-size--large: 18px !important;
        --wp--preset--font-size--medium: 16px !important;
        --wp--preset--font-size--small: 14px !important;
        --wp--preset--font-size--x-small: 12px !important;
    }

    /* Ajustes específicos para headings en móviles pequeños */
    h1,
    .wp-block-heading h1,
    .has-xxx-large-font-size {
        font-size: 28px !important;
    }

    h2,
    .wp-block-heading h2,
    .has-xx-large-font-size {
        font-size: 24px !important;
    }

    h3,
    .wp-block-heading h3,
    .has-x-large-font-size {
        font-size: 22px !important;
    }

    h4,
    .wp-block-heading h4,
    .has-large-font-size {
        font-size: 18px !important;
    }

    h5,
    .wp-block-heading h5,
    .has-medium-font-size {
        font-size: 16px !important;
    }

    h6,
    .wp-block-heading h6,
    .has-small-font-size {
        font-size: 14px !important;
    }
}


/* --- 1. Contenedor Principal --- */
.mdv-form-container {
    background-color: var(--wp--preset--color--surface);
    /* Color Surface del theme.json */
    padding: var(--wp--preset--spacing--medium);
    /* Espaciado del theme */
    border-radius: 15px;
    max-width: 600px;
    margin: 0 auto;
    box-sizing: border-box;
    font-family: var(--wp--preset--font-family--body);
    /* Fuente Inter */
}

/* --- 2. Correcciones de estructura (Fix WP) --- */
.mdv-form-container p {
    margin: 0;
    padding: 0;
}

.mdv-form-container br {
    display: none;
}

.mdv-form-group {
    margin-bottom: var(--wp--preset--spacing--small);
}

/* Etiquetas */
.mdv-form-container label {
    font-family: var(--wp--preset--font-family--heading);
    /* Fuente Oswald para títulos */
    font-weight: 500;
    margin-bottom: 5px;
    display: block;
    color: var(--wp--preset--color--heading);
    /* Color Heading */
    letter-spacing: 0.5px;
}

/* --- 3. Estilos compartidos (Inputs, Select, Textarea) --- */
.mdv-input,
.mdv-textarea,
.mdv-select {
    width: 100%;
    padding: 12px;
    margin-top: 5px;
    border: 1px solid var(--wp--preset--color--secondary);
    /* Color Secondary */
    border-radius: 8px;
    background-color: var(--wp--preset--color--white);
    font-size: var(--wp--preset--font-size--small);
    font-family: var(--wp--preset--font-family--body);
    color: var(--wp--preset--color--body);
    box-sizing: border-box;
    transition: border-color 0.3s ease;
}

/* Estado Focus (Clic) */
.mdv-input:focus,
.mdv-select:focus,
.mdv-textarea:focus {
    border-color: var(--wp--preset--color--primary);
    /* Se ilumina con el azul Primary */
    outline: none;
    box-shadow: 0 0 0 1px var(--wp--preset--color--primary);
}

/* --- 4. Personalización del Select --- */
.mdv-select {
    cursor: pointer;
    padding-right: 40px;
    appearance: none;
    -webkit-appearance: none;
    -moz-appearance: none;
    /* Flecha SVG coloreada con el tono Heading (#102942) */
    background-image: url("data:image/svg+xml;charset=UTF-8,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23102942' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3e%3cpolyline points='6 9 12 15 18 9'%3e%3c/polyline%3e%3c/svg%3e");
    background-repeat: no-repeat;
    background-position: right 15px center;
    background-size: 16px;
}

/* --- 5. Área de texto --- */
.mdv-textarea {
    height: 120px;
    resize: vertical;
}

/* --- 6. Botón de Enviar --- */
.mdv-btn {
    width: 100%;
    padding: 12px 25px;
    margin-top: 10px;
    background-color: var(--wp--preset--color--primary);
    /* Azul Primary */
    color: var(--wp--preset--color--white);
    border: none;
    border-radius: 8px;
    font-size: var(--wp--preset--font-size--small);
    font-family: var(--wp--preset--font-family--heading);
    /* Fuente Oswald en botón */
    font-weight: 500;
    text-transform: uppercase;
    letter-spacing: 1px;
    cursor: pointer;
    transition: background-color 0.3s ease;
}

.mdv-btn:hover {
    background-color: var(--wp--preset--color--primary-hover);
    /* Azul más oscuro al pasar mouse */
}

/* Spinner de carga */
.wpcf7-spinner {
    margin: 0;
    float: none;
}