.elementor-21 .elementor-element.elementor-element-5a5a9c3 > .elementor-element-populated{margin:0px 0px 0px 0px;--e-column-margin-right:0px;--e-column-margin-left:0px;padding:0px 0px 0px 0px;}.elementor-21 .elementor-element.elementor-element-217b393 > .elementor-widget-container{margin:0px 0px 0px 0px;}:root{--page-title-display:none;}@media(max-width:767px){.elementor-21 .elementor-element.elementor-element-217b393 > .elementor-widget-container{margin:40px 0px 0px 0px;}}/* Start custom CSS for html, class: .elementor-element-217b393 *//* =========================================
    SKM CORPORATE BLUE SYSTEM (FINAL)
    ========================================= */
:root {
  /* PALETA SKM OFICIAL MONOCROMÁTICA */
  --skm-blue: #2977BD;        /* Azul Principal SKM */
  --skm-navy: #1E2C56;        /* Azul Oscuro */
  --skm-grey-blue: #506086;  /* Azul Grisáceo */
  --skm-light-blue: #EBF5FF; /* Fondo claro */
  --skm-white: #ffffff;
  
  /* FUENTE & UI */
  --font-corp: 'Raleway', sans-serif;
  --radius-corp: 16px;
  --shadow-corp: 0 8px 24px rgba(30, 44, 86, 0.08);
}

.skm-corporate-home {
  font-family: var(--font-corp);
  color: var(--skm-navy);
  line-height: 1.6;
  background-color: var(--skm-white);
  overflow-x: hidden;
  width: 100%;
}

.skm-container {
  max-width: 1200px;
  margin: 0 auto;
  padding: 0 24px;
}

.skm-section { padding: 90px 0; position: relative; }
.skm-pb-0 { padding-bottom: 0; }
.skm-bg-light { background-color: var(--skm-light-blue); }

.skm-subtitle {
  color: var(--skm-blue);
  font-weight: 700;
  letter-spacing: 2px;
  text-transform: uppercase;
  font-size: 0.8rem;
  display: block;
  margin-bottom: 0.5rem;
}

h2 {
  font-size: 2.5rem;
  font-weight: 700;
  color: var(--skm-navy);
  margin-bottom: 1.5rem;
  line-height: 1.2;
}

/* =========================================
    LINKS COLOR FIX (AZUL)
    ========================================= */
.skm-corporate-home a:not(.skm-btn) {
  color: var(--skm-blue) !important;
  text-decoration: none;
  transition: all 0.3s;
}
.skm-corporate-home a:not(.skm-btn):hover {
  color: var(--skm-navy) !important;
  text-decoration: underline;
}
.skm-hero a:not(.skm-btn),
.skm-fv-section a:not(.skm-btn) {
  color: #ffffff !important; 
}

/* =========================================
    HERO SECTION (AJUSTE DE ALTURA)
    ========================================= */
.skm-hero {
  position: relative;
  /* MÁS ALTO */
  min-height: 95vh; 
  
  /* FORZAMOS CENTRADO */
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  justify-content: center !important;
  text-align: center !important;
  
  /* PADDING AJUSTADO: 260px abajo para separar los botones del blanco */
  padding: 120px 20px 260px 20px; 
  overflow: hidden;
}

.skm-hero__bg {
  position: absolute;
  top: 0; left: 0; width: 100%; height: 100%; z-index: 1;
}
.skm-hero__video {
  width: 100%; height: 100%; object-fit: cover; 
  transform: scale(1.15); 
}

/* OVERLAY (CAPA MUY SUTIL Y TRANSPARENTE FORZADA) */
.skm-hero__overlay {
    position: absolute;
    inset: 0;
    /* Aplicamos una opacidad mínima (0.1 / 0.05) con !important */
    background: linear-gradient( 13deg, 
        rgba(30, 44, 86, 0.1) !important,    
        rgba(30, 44, 86, 0.05) !important
    );
    z-index: 2;
}

/* CONTENIDO */
.skm-hero__content {
  position: relative; 
  z-index: 10; 
  max-width: 900px;
  width: 100%;
  margin: 0 auto;
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
}

.skm-tag {
  display: inline-block;
  font-weight: 700; letter-spacing: 2px; text-transform: uppercase;
  font-size: 0.85rem; color: rgba(255,255,255,0.95);
  border: 1px solid rgba(255,255,255,0.5);
  padding: 8px 24px; border-radius: 50px; 
  margin: 0 auto 2rem auto;
}

/* TÍTULO HERO (ESCALADO) */
.skm-title-hero {
  /* clamp(tamaño_mínimo, tamaño_preferido, tamaño_máximo) */
  font-size: clamp(2.2rem, 5vw, 4.5rem); 
  font-weight: 800; color: #ffffff !important;
  line-height: 1.1; margin-bottom: 1.5rem;
  /* Sombra ajustada para legibilidad sobre vídeo */
  text-shadow: 0 4px 15px rgba(30, 44, 86, 0.7);
  text-align: center; width: 100%;
}

.skm-lead-hero {
  font-size: 1.25rem; color: rgba(255,255,255,0.95) !important;
  margin-bottom: 3rem; font-weight: 400; max-width: 750px; 
  margin-left: auto; margin-right: auto;
  text-align: center;
}

.skm-hero-actions {
  display: flex; justify-content: center; gap: 1rem; flex-wrap: wrap; width: 100%;
}

.skm-curve-hero {
  position: absolute; bottom: -1px; left: 0; width: 100%; z-index: 3; line-height: 0;
  height: 150px; /* Altura fija para la ola */
}
.skm-curve-hero svg {
    fill: var(--skm-white);
    width: 100%;
    height: 100%; 
    display: block; 
}

/* Ajuste para móviles para que la ola no sea tan alta */
@media (max-width: 768px) {
    .skm-curve-hero {
        height: 60px; 
    }
}

/* =========================================
    BOTONES
    ========================================= */
.skm-btn {
  padding: 14px 32px; border-radius: 50px; font-weight: 700;
  display: inline-block; cursor: pointer; transition: all 0.3s;
  font-family: var(--font-corp); text-align: center;
}

.skm-btn--solid {
  background: var(--skm-blue); color: white !important; border: 2px solid var(--skm-blue);
}
.skm-btn--solid:hover {
  background: var(--skm-navy); border-color: var(--skm-navy); transform: translateY(-3px);
}

.skm-btn--outline {
  background: transparent; color: white !important; border: 2px solid rgba(255,255,255,0.6);
}
.skm-btn--outline:hover {
  background: white; color: var(--skm-blue) !important; border-color: white; transform: translateY(-3px);
}

.skm-btn--solid-white {
  background: white; color: var(--skm-blue) !important; border: 2px solid white;
}
.skm-btn--solid-white:hover {
  background: var(--skm-light-blue); color: var(--skm-navy) !important;
}

/* =========================================
    INTRODUCCIÓN & CARDS
    ========================================= */
.skm-intro-grid {
  display: grid; grid-template-columns: 1fr 1fr; gap: 4rem; align-items: flex-start;
}
.skm-intro-text p { color: var(--skm-grey-blue); font-size: 1.1rem; }
.skm-list-blue { margin-top: 1.5rem; padding-left: 20px; list-style: none; }
.skm-list-blue li { margin-bottom: 10px; position: relative; padding-left: 15px; color: var(--skm-navy); }
.skm-list-blue li::before { content: "•"; color: var(--skm-blue); position: absolute; left: 0; font-weight: bold; }

.skm-cards-stack { display: flex; flex-direction: column; gap: 1.5rem; }
.skm-feature-card {
  background: white; padding: 2rem; border-radius: var(--radius-corp);
  box-shadow: var(--skm-shadow-corp); border-left: 5px solid var(--skm-blue);
  display: flex; gap: 1.5rem; align-items: flex-start;
}
.skm-icon-circle {
  min-width: 50px; height: 50px; background: var(--skm-light-blue); color: var(--skm-blue);
  border-radius: 50%; display: flex; align-items: center; justify-content: center;
}
.skm-feature-card h3 { font-size: 1.2rem; margin: 0 0 0.5rem 0; color: var(--skm-navy); }
.skm-feature-card p { margin: 0; font-size: 0.95rem; }

/* =========================================
    DATOS (BARRA AZUL)
    ========================================= */
.skm-stats-section {
  background: var(--skm-navy); color: white; padding: 60px 0; margin-top: 60px;
}
.skm-stats-grid {
  display: flex; justify-content: space-around; align-items: center; text-align: center; flex-wrap: wrap; gap: 2rem;
}
.skm-stat-item h4 { color: white !important; font-size: 1.2rem; margin: 0.5rem 0; }
.skm-stat-item p { color: rgba(255,255,255,0.7) !important; font-size: 0.9rem; max-width: 200px; margin: 0 auto; }
.skm-stat-num { font-size: 2.5rem; font-weight: 800; color: #6FB3FF; display: block; line-height: 1; }
.skm-stat-divider { width: 1px; height: 60px; background: rgba(255,255,255,0.15); display: block; }

/* =========================================
    ÁREAS TERAPÉUTICAS
    ========================================= */
.skm-section-header { text-align: center; max-width: 700px; margin: 0 auto 3rem; }

.skm-areas-grid-blue {
  display: grid; 
  /* Asegura 2 columnas en tablet y 1 en móvil */
  grid-template-columns: repeat(auto-fit, minmax(300px, 1fr)); 
  gap: 1.5rem;
}

.skm-blue-card {
  background: white; border-radius: var(--radius-corp); padding: 2.5rem;
  box-shadow: var(--skm-shadow-corp); display: flex; flex-direction: column; justify-content: space-between;
  border: 1px solid rgba(41, 119, 189, 0.1); 
  transition: transform 0.3s, border-color 0.3s;
}

.skm-blue-card:hover {
  transform: translateY(-8px); border-color: var(--skm-blue);
}

.skm-blue-icon {
  display: inline-block; padding: 6px 14px; background: var(--skm-light-blue);
  color: var(--skm-blue); border-radius: 50px; font-size: 0.75rem; font-weight: 700;
  margin-bottom: 1.5rem; text-transform: uppercase; width: fit-content;
}
.skm-blue-card h3 { font-size: 1.4rem; color: var(--skm-navy); }
.skm-link-blue { font-weight: 700; font-size: 0.9rem; margin-top: 1.5rem; display: inline-block; }

.skm-card-cta {
  background: var(--skm-blue); color: white; border: none; align-items: center; text-align: center; justify-content: center;
}
.skm-card-cta h3, .skm-card-cta p { color: white !important; }

/* NOTA AL PIE (REFERENCIAS) */
.skm-reference-box {
  margin-top: 3rem; /* Separación de las tarjetas */
  padding-top: 1rem;
  border-top: 1px solid rgba(41, 119, 189, 0.1); /* Línea divisoria muy sutil */
}

.skm-reference-box p {
  font-size: 0.75rem; /* Letra pequeña (aprox 12px) */
  color: var(--skm-grey-blue);
  opacity: 0.8; /* Reduce el contraste para que no destaque */
  margin: 0;
  font-style: italic;
}

/* =========================================
    MODELO COMPANY MARKET
    ========================================= */
.skm-market-layout { display: grid; grid-template-columns: 1fr 1fr; gap: 4rem; align-items: center; }
.skm-market-image img { width: 100%; border-radius: 20px; box-shadow: 0 20px 50px rgba(0,0,0,0.1); }
.skm-check-list-blue { list-style: none; padding: 0; margin: 2rem 0; }
.skm-check-list-blue li {
  margin-bottom: 10px; padding-left: 25px; position: relative; color: var(--skm-navy); font-weight: 600;
}
.skm-check-list-blue li::before {
  content: "✓"; position: absolute; left: 0; color: var(--skm-blue); font-weight: 800;
}
.skm-mt-3 { margin-top: 1.5rem; }

/* =========================================
    FARMACOVIGILANCIA
    ========================================= */
.skm-fv-section { margin: 60px 0; padding: 0 20px; }
.skm-fv-box {
  background: linear-gradient(90deg, var(--skm-navy) 0%, var(--skm-blue) 100%);
  border-radius: 20px; padding: 3rem; color: white;
  /* Reducimos el gap para móvil y tablet */
  display: flex; align-items: center; gap: 1rem; box-shadow: 0 20px 40px rgba(41, 119, 189, 0.25);
}
.skm-fv-icon {
  background: rgba(255,255,255,0.15); width: 80px; height: 80px;
  border-radius: 50%; display: flex; align-items: center; justify-content: center;
}
.skm-fv-text { flex: 1; }
.skm-fv-text h3 { color: white !important; margin: 0 0 0.5rem 0; }
.skm-fv-text p { margin: 0 0 1rem 0; opacity: 0.9; color: white !important; }
.skm-fv-contacts { display: flex; gap: 1rem; align-items: center; font-weight: 700; flex-wrap: wrap; }
.skm-fv-action .skm-btn--outline-white { border: 1px solid white; color: white !important; }
.skm-fv-action .skm-btn--outline-white:hover { background: white; color: var(--skm-navy) !important; }

/* =========================================
    RESPONSIVE (Ajustes clave)
    ========================================= */
@media (max-width: 1024px) { 
    /* AJUSTES PARA TABLET */
    .skm-section { padding: 60px 0; }
    h2 { font-size: 2rem; }
    .skm-lead-hero { font-size: 1.1rem; }
    .skm-market-layout { gap: 2rem; }
}

@media (max-width: 768px) {
    /* AJUSTES PARA MÓVIL */
    .skm-intro-grid, .skm-market-layout { 
        grid-template-columns: 1fr; 
        gap: 2rem; 
    }
    
    .skm-hero { 
        /* Aumento de altura mínima en móvil (para ampliar el video y alejar la curva) */
        min-height: 90vh; 
        padding: 80px 20px 140px 20px; 
    } 
    
    .skm-hero__video {
        /* Zoom para asegurar que los subtítulos queden fuera del área visible */
        transform: scale(1.5); 
    }

    .skm-title-hero { 
        /* Título más pequeño en móvil */
        font-size: clamp(1.8rem, 8vw, 2.5rem); 
    }

    .skm-lead-hero { 
        font-size: 1rem; 
    }

    .skm-stats-grid {
        /* Permite que las estadísticas se apilen o se envuelvan fácilmente */
        justify-content: center; 
        gap: 1rem 2rem;
    }
    
    .skm-stat-divider { display: none; }
    
/* =========================================
   SOLO MÓVIL (Max-width: 768px)
   ========================================= */
@media (max-width: 768px) {
    
    /* CAJA AZUL FARMACOVIGILANCIA */
    .skm-fv-box { 
        display: flex !important;
        flex-direction: column !important; 
        text-align: center !important; 
        
        /* AQUÍ ESTÁ EL RELLENO: 
           40px Arriba/Abajo 
           30px Izquierda/Derecha (para que no toque bordes) 
        */
        padding: 40px 30px !important; 
        
        gap: 20px !important; 
        width: 100% !important;
        box-sizing: border-box !important; /* Vital para que el padding no rompa el ancho */
    }

    /* Asegurar que el contenedor padre también respete márgenes */
    .skm-fv-section .skm-container {
        padding-left: 0px !important;
        padding-right: 0px !important;
    }

    /* Ajuste de los textos dentro de la caja para seguridad extra */
    .skm-fv-text {
        width: 100% !important;
        margin: 0 !important;
    }

    /* HERO */
    .skm-hero { 
       min-height: 90vh; padding: 80px 20px 140px 20px; 
    } 
    .skm-hero__video { transform: scale(1.5); }
    .skm-title-hero { font-size: clamp(1.8rem, 8vw, 2.5rem); }
    .skm-lead-hero { font-size: 1rem; }
    .skm-curve-hero { height: 60px; }

    /* GRIDS A UNA COLUMNA */
    .skm-intro-grid, .skm-market-layout, .skm-areas-grid-blue { 
       grid-template-columns: 1fr; gap: 2rem; 
    }

    /* STATS */
    .skm-stats-grid { justify-content: center; gap: 1rem 2rem; }
    .skm-stat-divider { display: none; }
    
    /* CONTACTOS DENTRO DE LA CAJA */
    .skm-fv-contacts { 
       justify-content: center; flex-direction: column; gap: 5px; 
    }
    .skm-fv-contacts span { display: none; } 
    .skm-fv-contacts a { font-size: 0.95rem; }
}
    
    .skm-fv-contacts { 
        justify-content: center; 
        /* FORZAMOS APILAMIENTO VERTICAL en contactos */
        flex-direction: column; 
        gap: 0; 
    }
    .skm-fv-contacts span { /* Ocultamos el separador "•" */
        display: none;
    }

    /* Forzamos que la cuadrícula de áreas terapéuticas use solo 1 columna en móvil */
    .skm-areas-grid-blue {
        grid-template-columns: 1fr;
    }
}/* End custom CSS */
/* Start custom CSS for section, class: .elementor-element-b3f2728 */.skm-hero__overlay {
    position: absolute!important;
    inset: 0!important;
    background: linear-gradient(0deg, rgba(3, 22, 46, 0.5), rgba(4, 47, 95, 0.5), rgba(0, 0, 0, 0.85))!important;
}/* End custom CSS */