/*
 Theme Name:   Kadence Child
 Theme URI:    https://example.com/kadence-child/
 Description:  Kadence Child Theme
 Author:       Your Name
 Author URI:   https://example.com
 Template:     kadence
 Version:      1.0.2
 Tags:         customizable, modern, responsive-layout, gutenberg, header builder, footer builder
 Text Domain:  kadencechild
*/

/* Theme customization starts here
-------------------------------------------------------------- */

/* =============================
   HEADER
   ============================= */

/* Línea blanca delgada en home (header transparente) */
.transparent-header .site-main-header-inner-wrap {
  border-bottom: 1px solid rgba(255,255,255,0.5);
}

/* Línea roja en páginas internas */
.site-main-header-inner-wrap {
  border-bottom: 3px solid var(--global-palette1);
}

/* Evitar que se duplique en transparente */
.transparent-header .site-main-header-inner-wrap {
  border-bottom: 1px solid rgba(255,255,255,0.5);
}
.main-navigation .primary-menu-container > ul > li.menu-item.current-menu-item > a,
.current-page-ancestor a{
    color: var(--global-palette1) !important;
}


/* =============================
   SIDEBAR MENU DYNAMIC (FINAL DESIGN)
   ============================= */
.sidebar-menu-custom {
    min-height: 400px !important; /* Puedes subirlo a 500px o 550px si quieres emparejarlo aún más al menú de 7 opciones */
    display: flex;
    flex-direction: column;
}

.sidebar-menu-custom ul.menu {
    list-style: none;
    padding: 0;
    margin: 0;
    width: 100%;
    padding-left: 10px;
}

.sidebar-menu-custom ul.menu li {
    width: 100%;
    padding-right: 30px;
    box-sizing: border-box;
}

.sidebar-menu-custom ul.menu li a {
    display: flex;
    align-items: center;
    width: 100%;
    padding: 5px 0;
    border-bottom: none !important;
    color: #333333 !important;
    text-decoration: none;
    transition: all 0.3s ease;
    font-size: 14px;
}

/* Base icono */
.sidebar-menu-custom ul.menu li a::before {
    content: "";
    display: block;
    margin-right: 10px;
    width: 32px; 
    height: 32px; 
    background-size: 16px; 
    background-repeat: no-repeat;
    background-position: center;
    border: 2px solid #333333 !important;
    border-radius: 50%;
    transition: all 0.3s ease;
    flex-shrink: 0;
}

/* Chevron automático */
.sidebar-menu-custom ul.menu li a::after {
    content: "▷";
    margin-left: auto;
    font-size: 8px;
    color: #333333 !important;
    font-weight: bold;
    transition: all 0.3s ease;
}

/* Iconos */
.menu-audio a::before { background-image: url('data:image/svg+xml;utf8,<svg viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg" fill="none" stroke="%23333333" stroke-width="2"><path d="M11 5L6 9H2v6h4l5 4V5zM15.5 8.4a5 5 0 0 1 0 7.1"/></svg>'); }
.menu-light a::before { background-image: url('data:image/svg+xml;utf8,<svg viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg" fill="none" stroke="%23333333" stroke-width="2"><path d="M12 2l2 4h4l-3 3 1 4-4-2-4 2 1-4-3-3h4l2-4z"/></svg>'); }
.menu-camera a::before { background-image: url('data:image/svg+xml;utf8,<svg viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg" fill="none" stroke="%23333333" stroke-width="2"><rect x="2" y="7" width="20" height="12" rx="2"/><path d="M16 7V5a2 2 0 0 0-2-2H8a2 2 0 0 0-2 2v2"/></svg>'); }
.menu-lock a::before { background-image: url('data:image/svg+xml;utf8,<svg viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg" fill="none" stroke="%23333333" stroke-width="2"><rect x="3" y="11" width="18" height="11" rx="2"/><path d="M7 11V7a5 5 0 0 1 10 0v4"/></svg>'); }
.menu-screen a::before { background-image: url('data:image/svg+xml;utf8,<svg viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg" fill="none" stroke="%23333333" stroke-width="2"><rect x="2" y="3" width="20" height="14" rx="2"/><path d="M8 21h8M12 17v4"/></svg>'); }
.menu-wifi a::before { background-image: url('data:image/svg+xml;utf8,<svg viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg" fill="none" stroke="%23333333" stroke-width="2"><path d="M5 12.5a10 10 0 0 1 14 0M8.5 16a5 5 0 0 1 7 0M12 19a1 1 0 1 0 0-2 1 1 0 0 0 0 2z"/></svg>'); }
.menu-cog a::before { background-image: url('data:image/svg+xml;utf8,<svg viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg" fill="none" stroke="%23333333" stroke-width="2"><circle cx="12" cy="12" r="3"/><path d="M19.4 15a1.65 1.65 0 0 0 .33 1.82l.06.06a2 2 0 0 1 0 2.83 2 2 0 0 1-2.83 0l-.06-.06a1.65 1.65 0 0 0-1.82-.33 1.65 1.65 0 0 0-1 1.51V21a2 2 0 0 1-2 2 2 2 0 0 1-2-2v-.09A1.65 1.65 0 0 0 9 19.4a1.65 1.65 0 0 0-1.82.33l-.06.06a2 2 0 0 1-2.83 0 2 2 0 0 1 0-2.83l.06-.06a1.65 1.65 0 0 0 .33-1.82 1.65 1.65 0 0 0-1.51-1H3a2 2 0 0 1-2-2 2 2 0 0 1 2-2h.09A1.65 1.65 0 0 0 4.6 9a1.65 1.65 0 0 0-.33-1.82l-.06-.06a2 2 0 0 1 0-2.83 2 2 0 0 1 2.83 0l.06.06a1.65 1.65 0 0 0 1.82.33H9a1.65 1.65 0 0 0 1-1.51V3a2 2 0 0 1 2-2 2 2 0 0 1 2 2v.09a1.65 1.65 0 0 0 1 1.51 1.65 1.65 0 0 0 1.82-.33l.06-.06a2 2 0 0 1 2.83 0 2 2 0 0 1 0 2.83l-.06.06a1.65 1.65 0 0 0-.33 1.82V9a1.65 1.65 0 0 0 1.51 1H21a2 2 0 0 1 2 2 2 2 0 0 1-2 2h-.09a1.65 1.65 0 0 0-1.51 1z"/></svg>'); }
.menu-bell a::before { background-image: url('data:image/svg+xml;utf8,<svg viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg" fill="none" stroke="%23333333" stroke-width="2"><path d="M18 8A6 6 0 1 0 6 8c0 7-3 9-3 9h18s-3-2-3-9"/><path d="M13.73 21a2 2 0 0 1-3.46 0"/></svg>'); }
.menu-phone a::before { background-image: url('data:image/svg+xml;utf8,<svg viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg" fill="none" stroke="%23333333" stroke-width="2"><path d="M22 16.92v3a2 2 0 0 1-2.18 2 19.79 19.79 0 0 1-8.63-3.07 19.5 19.5 0 0 1-6-6 19.79 19.79 0 0 1-3.07-8.67A2 2 0 0 1 4.11 2h3a2 2 0 0 1 2 1.72 12.84 12.84 0 0 0 .7 2.81 2 2 0 0 1-.45 2.11L8.09 9.91a16 16 0 0 0 6 6l1.27-1.27a2 2 0 0 1 2.11-.45 12.84 12.84 0 0 0 2.81.7A2 2 0 0 1 22 16.92z"/></svg>'); }
.menu-graph a::before { background-image: url('data:image/svg+xml;utf8,<svg viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg" fill="none" stroke="%23333333" stroke-width="2"><path d="M18 20V10M12 20V4M6 20v-6"/></svg>'); }
.menu-wrench a::before { background-image: url('data:image/svg+xml;utf8,<svg viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg" fill="none" stroke="%23333333" stroke-width="2"><path d="M14.7 6.3a1 1 0 0 0 0 1.4l1.6 1.6a1 1 0 0 0 1.4 0l3.77-3.77a6 6 0 0 1-7.94 7.94l-6.91 6.91a2.12 2.12 0 0 1-3-3l6.91-6.91a6 6 0 0 1 7.94-7.94l-3.76 3.76z"/></svg>'); }
.menu-building a::before { background-image: url('data:image/svg+xml;utf8,<svg viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg" fill="none" stroke="%23333333" stroke-width="2"><rect x="4" y="2" width="16" height="20" rx="2"/><path d="M9 22v-4h6v4M8 6h.01M12 6h.01M16 6h.01M8 10h.01M12 10h.01M16 10h.01"/></svg>'); }
.menu-home a::before { background-image: url('data:image/svg+xml;utf8,<svg viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg" fill="none" stroke="%23333333" stroke-width="2"><path d="M3 9l9-7 9 7v11a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2z"/><path d="M9 22V12h6v10"/></svg>'); }

/* Estado activo y Hover (Rojo) */
.sidebar-menu-custom ul.menu li:hover a,
.sidebar-menu-custom ul.menu li.current-menu-item a {
    color: #e51937 !important;
}

/* Borde y SVG rojo */
.sidebar-menu-custom ul.menu li:hover a::before,
.sidebar-menu-custom ul.menu li.current-menu-item a::before {
    border-color: #e51937 !important;
    filter: invert(15%) sepia(87%) saturate(6543%) hue-rotate(345deg) brightness(95%) contrast(97%);
}

.sidebar-menu-custom ul.menu li:hover a::after,
.sidebar-menu-custom ul.menu li.current-menu-item a::after {
    color: #e51937 !important;
}
/* ============================================================
   AJUSTES RESPONSIVE: MENÚ DE SOLUCIONES EN MÓVIL (CORREGIDO)
   ============================================================ */
@media (max-width: 767px) {
    /* 1. Forzar la remoción del background y bordes SOLAMENTE en la columna del menú lateral en esta fila */
    .kt-row-layout-right-golden .kt-row-column-wrap > .wp-block-kadence-column:last-child .kt-inside-inner-col {
        background-image: none !important;
        background: transparent !important;
        border-right: none !important;
        border-bottom: none !important;
        min-height: auto !important; /* Resetea los 400px en móvil */
        padding-left: 0 !important;
        padding-right: 0 !important;
    }

    /* 3. El contenedor global (UL) lleva el borde completo y esquinas redondeadas */
    .sidebar-menu-custom ul.menu {
        padding-left: 0 !important;
        margin: 0 !important;
        display: flex;
        flex-direction: column;
        background-color: #ffffff !important; /* Totalmente blanco (o transparent si prefieres) */
        border: 1px solid #e51937 !important;   /* Borde general rojo */
        border-radius: 8px !important;         /* Bordes redondeados del contenedor completo */
        overflow: hidden;                       /* Esencial para que las esquinas del UL corten los li de los extremos */
    }

    /* Elementos del menú sin background gris, pegados uno debajo del otro */
    .sidebar-menu-custom ul.menu li {
        padding-right: 0 !important;
        background-color: transparent !important; /* Eliminado el gris, se queda limpio */
        border-bottom: 1px solid #e51937 !important; /* Línea divisoria roja entre elementos */
        border-radius: 0 !important; /* Reseteamos para que no se redondeen individualmente */
    }

    /* El último elemento (último hijo) no lleva borde inferior */
    .sidebar-menu-custom ul.menu li:last-child {
        border-bottom: none !important;
    }

    /* 2. Textos, iconos y chevrones en el rojo de acento de forma nativa */
    .sidebar-menu-custom ul.menu li a {
        padding: 12px 15px !important; /* Área de toque cómoda */
        color: #e51937 !important;
        font-weight: 600;
    }

    /* Forzar iconos circulares en rojo */
    .sidebar-menu-custom ul.menu li a::before {
        border-color: #e51937 !important;
        filter: invert(15%) sepia(87%) saturate(6543%) hue-rotate(345deg) brightness(95%) contrast(97%) !important;
    }

    /* Forzar chevron en rojo */
    .sidebar-menu-custom ul.menu li a::after {
        color: #e51937 !important;
    }
    .sidebar-menu-custom ul.menu li.current-menu-item,
    .sidebar-menu-custom ul.menu li.current_page_item {
        background-color: #e51937 !important;
    }

    /* 2. Texto del enlace en blanco */
    .sidebar-menu-custom ul.menu li.current-menu-item a,
    .sidebar-menu-custom ul.menu li.current_page_item a {
        color: #ffffff !important;
    }

    /* 3. Forzar los iconos circulares y el chevron derecho a blanco */
    .sidebar-menu-custom ul.menu li.current-menu-item a::before,
    .sidebar-menu-custom ul.menu li.current_page_item a::before {
        border-color: #ffffff !important;
        filter: brightness(0) invert(1) !important; /* Pasa el icono SVG/imagen a blanco puro */
    }

    .sidebar-menu-custom ul.menu li.current-menu-item a::after,
    .sidebar-menu-custom ul.menu li.current_page_item a::after {
        color: #ffffff !important; /* El chevron se vuelve blanco */
    }
}
/* =============================
   HERO interno
   ============================= */
.alignfull .kt-inside-inner-col h1,
.alignfull .kt-inside-inner-col h2,
.alignfull .kt-inside-inner-col p{
    color: #fff !important;
    text-shadow: 0px 0px 5px rgba(0, 0, 0, 0.7);
    letter-spacing: -0.035em;
}
/* =============================
   FOOTER
   ============================= */
/* margen caja roja*/   
.site-middle-footer-wrap{
    margin-top: 45px;
    margin-bottom: 10px;
}
/* tono de rojo para la última columna - no fuunciona en móvil*/
/*.site-middle-footer-wrap .site-footer-middle-section-3 {
    background-color: hsl(351, 80%, 42%) !important;
    margin: -30px -23px -30px 0 !important;
    padding: 45px 30px 10px 30px !important;
}*/
.entry-content-wrap {
    padding: 0;
}

/* ==========================
   GRID SERVICIOS MISMA ALTURA BOTÓN ABAJO
   ========================== */
/* Equal height + botón abajo en servicios-grid */
.servicios-grid .kt-row-column-wrap {
  align-items: stretch !important;
}

.servicios-grid .wp-block-kadence-column {
  display: flex !important;
  flex-direction: column !important;
}

.servicios-grid .kt-inside-inner-col {
  display: flex !important;
  flex-direction: column !important;
  height: 100% !important;
}

.servicios-grid .kt-inside-inner-col .wp-block-kadence-advancedbtn {
  margin-top: auto !important;
}

/* ==========================
   ENCABEZADO DE LOS TABS DE SERVICIOS
   ========================== */
.servicios-wrap .kt-tabs-title-list {
  display: flex;
  align-items: center;
  gap: 0;
  border-bottom: 1px solid #9d9d9d;
  padding: 0;
  justify-content: flex-start;
}

.servicios-wrap .kt-title-item-1,
.servicios-wrap .kt-title-item-2 {
  display: flex !important;
  flex-direction: row !important;
  align-items: center !important;
  white-space: nowrap;
}

.servicios-wrap .kt-title-item-1::before {
  content: "SERVICIOS";
  font-size: 13px;
  font-weight: 700;
  letter-spacing: 0.08em;
  color: #999;
  margin-right: 6px;
  white-space: nowrap;
  flex-shrink: 0;
}

.servicios-wrap .kt-title-item-2::before {
  content: "SOLUCIONES";
  font-size: 13px;
  font-weight: 700;
  letter-spacing: 0.08em;
  color: #999;
  margin-right: 6px;
  margin-left: 16px;
  white-space: nowrap;
  border-left: 1px solid #ccc;
  padding-left: 16px;
  flex-shrink: 0;
}

.servicios-wrap .kt-tab-title {
  font-size: 14px;
  color: #999;
  padding: 12px 10px;
  display: flex;
  align-items: center;
  gap: 6px;
  border-bottom: 3px solid transparent;
  transition: all 0.2s;
  white-space: nowrap;
}

.servicios-wrap .kt-tab-title-active .kt-tab-title,
.servicios-wrap .kt-tab-title:hover {
  color: #e51937;
  border-bottom-color: #e51937;
}

.servicios-wrap .kt-tab-title .kadence-dynamic-icon {
  width: 16px;
  height: 16px;
}

/* Bordes redondeados en íconos de tabs */
.servicios-wrap .kt-tab-title .kb-svg-icon-wrap {
  width: 16px;
  height: 16px;
  border: 2px solid #9d9d9d;
  border-radius: 50%;
  padding: 4px;
  box-sizing: content-box;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
}

/* Hover */
.servicios-wrap .kt-tab-title:hover .kb-svg-icon-wrap {
  border-color: #000000;
}

/* Active */
.servicios-wrap .kt-tab-title-active .kt-tab-title .kb-svg-icon-wrap {
  border-color: #e51937;
}

/* Reducir espacio entre título y tabs */
.servicios-wrap {
  margin-top: -10px;
}

/* Mobile */
@media (max-width: 767px) {
  .servicios-wrap .kt-tabs-title-list {
    display: none !important;
  }
  .servicios-wrap .kt-tab-inner-content:not(.kt-inner-tab-1) {
    display: none !important;
  }
  .servicios-wrap .kt-inner-tab-1 {
    display: block !important;
  }
}

/* efectos galería de imagenes en detalle */
.kb-gallery-magnific-init .kadence-blocks-gallery-item {
    position: relative;
    overflow: hidden;
    cursor: pointer;
}

/* overlay más limpio */
.kb-gallery-magnific-init .kadence-blocks-gallery-item::before {
    content: "";
    position: absolute;
    inset: 0;
    background: #e51937; /* un poco más suave */
    opacity: 0;
    transition: all 0.35s cubic-bezier(0.4, 0, 0.2, 1);
    z-index: 1;
}

/* icono PRO (sin emoji) */
.kb-gallery-magnific-init .kadence-blocks-gallery-item::after {
    content: "+";
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%) scale(0.6);
    color: #e51937;
    font-size: 42px;
    font-weight: 300;
    opacity: 0;
    transition: all 0.35s ease;
    z-index: 2;
}

/* hover */
.kb-gallery-magnific-init .kadence-blocks-gallery-item:hover::before {
    opacity: 1;
}

.kb-gallery-magnific-init .kadence-blocks-gallery-item:hover::after {
    opacity: 1;
    transform: translate(-50%, -50%) scale(1);
}

/* 🔥 extra clave: efecto "card" */
.kb-gallery-magnific-init .kadence-blocks-gallery-item:hover {
    transform: translateY(0px);
}

/* opcional: borde sutil como en tu screenshot */
.kb-gallery-magnific-init .kadence-blocks-gallery-item:hover {
    outline: 0px solid #e51937;
}

/* 1. El contenedor NO crece */
.wp-block-kadence-tabs 
.kb-section-has-link.kb-section-has-overlay {
    overflow: hidden;
}

/* 2. Importante: crear un contexto */
.wp-block-kadence-tabs 
.kb-section-has-link.kb-section-has-overlay 
.kt-inside-inner-col {
    will-change: transform;
    transition: transform 0.8s cubic-bezier(0.4, 0, 0.2, 1);
}

/* 3. Hover */
.wp-block-kadence-tabs 
.kb-section-has-link.kb-section-has-overlay:hover 
.kt-inside-inner-col {
    transform: scale(1.08);
}

/* ============================================================
   AJUSTES RESPONSIVE: CABECERA Y LOGO MÓVIL (FILTRO Y FONDO)
   ============================================================ */
@media (max-width: 1024px) {
    /* 1. Fondo negro en cabecera móvil y remover bordes rojos divisores en todos los niveles */
    #masthead,
    .site-header,
    .site-mobile-header-wrap,
    .site-mobile-header-inner-wrap,
    .site-main-header-inner-wrap,
    .site-header-row,
    .site-header-row-container,
    .mobile-transparent-header #masthead {
        background-color: #000000 !important;
        background: #000000 !important;
        border-bottom: none !important;
    }

    /* 2. Invertir logotipo de negro a blanco puro mediante filtros (bajo cualquier clase/contenedor) */
    #masthead .site-branding img,
    #masthead .custom-logo,
    #masthead .mobile-logo img,
    #masthead a.brand img,
    .site-header .site-branding img,
    .site-mobile-header-inner-wrap .site-branding img,
    .site-mobile-header-inner-wrap .custom-logo,
    .site-mobile-header-inner-wrap .mobile-logo img,
    #mobile-header .site-branding img,
    .site-mobile-header-inner-wrap a.brand img {
        filter: brightness(0) invert(1) !important;
    }

    /* 3. Forzar que las líneas del menú hamburguesa sean blancas (SVG, spans y toggles) */
    #masthead .menu-toggle,
    #masthead .menu-toggle-icon,
    #masthead svg,
    #masthead .ham-box span,
    .site-mobile-header-inner-wrap .menu-toggle,
    .site-mobile-header-inner-wrap .menu-toggle .menu-toggle-icon,
    .site-mobile-header-inner-wrap .menu-toggle-icon,
    .site-mobile-header-inner-wrap .menu-toggle svg,
    .site-mobile-header-inner-wrap .menu-toggle .ham-box span,
    #mobile-header .menu-toggle svg,
    .mobile-toggle-open-container .menu-toggle {
        color: #ffffff !important;
        stroke: #ffffff !important;
    }
}

/* ============================================================
   AJUSTES HOME: EVITAR SCROLL EN ESCRITORIO
   ============================================================ */
@media (min-width: 1025px) {
    body.home {
        overflow-y: hidden !important;
    }
}