/*
Theme Name: Divi Child Theme
Theme URI: https://www.elegantthemes.com/
Description: Tema hijo personalizado para Divi - Landing Kit Digital IA 2026
Author: MEDIACOM 360 / Antigravity
Template: Divi
Version: 2.0.1
*/

/* ==========================================================================
   ESTILOS LANDING KIT DIGITAL IA 2026 – MEDIACOM 360
   Basados en la identidad visual de mediacom360marketinginteractivo.com
   ========================================================================== */

/* ── VARIABLES ────────────────────────────────────────────────── */
:root {
    --mc-blue:        #0f4c81;   /* Azul corporativo Mediacom */
    --mc-blue-dark:   #0a3357;
    --mc-blue-light:  #1869aa;
    --mc-cyan:        #2ea3f2;   /* Azul Divi de acento */
    --mc-cyan-light:  #e5f4fd;
    --mc-dark:        #0b1d33;   /* Fondo oscuro hero */
    --mc-white:       #ffffff;
    --mc-light-bg:    #f4f6f8;
    --mc-text:        #1f2937;   /* Slate oscuro para máximo contraste */
    --mc-text-muted:  #4b5563;   /* Gris oscuro para cumplir WCAG AA */
    --mc-border:      #e2e8f0;
    --mc-success:     #28a745;
    --mc-error:       #dc3545;
    --mc-font:        'Open Sans', Arial, sans-serif;
    --mc-radius:      6px;
    --mc-radius-lg:   12px;
    --mc-shadow:      0 4px 20px rgba(15,76,129,0.10);
    --mc-shadow-lg:   0 10px 40px rgba(15,76,129,0.18);
    --mc-transition:  all 0.28s cubic-bezier(0.4,0,0.2,1);
}

/* ── RESET BASE ───────────────────────────────────────────────── */
.landing-kit-ia-body {
    margin: 0; padding: 0;
    font-family: var(--mc-font);
    font-size: 14px;
    color: var(--mc-text);
    background: var(--mc-white);
    line-height: 1.7em;
    -webkit-font-smoothing: antialiased;
    overflow-x: hidden;
}
.landing-kit-ia-body *, .landing-kit-ia-body *::before, .landing-kit-ia-body *::after { box-sizing: border-box; }
.landing-kit-ia-body a { color: var(--mc-cyan); text-decoration: none; }
.landing-kit-ia-body a:hover { text-decoration: underline; }
.landing-kit-ia-body h1, .landing-kit-ia-body h2, .landing-kit-ia-body h3,
.landing-kit-ia-body h4, .landing-kit-ia-body h5 {
    font-weight: 700;
    line-height: 1.25em;
    color: var(--mc-text);
    margin-top: 0;
}
.landing-kit-ia-body p { margin-top: 0; margin-bottom: 1em; }

/* ── LAYOUT ───────────────────────────────────────────────────── */
.lkd-container {
    width: 80%;
    max-width: 1080px;
    margin: 0 auto;
    position: relative;
}
.lkd-container--narrow { max-width: 760px; }

/* ── BUTTONS ──────────────────────────────────────────────────── */
.lkd-btn {
    display: inline-block;
    font-family: var(--mc-font);
    font-weight: 600;
    font-size: 14px;
    padding: 12px 24px;
    border-radius: var(--mc-radius);
    text-decoration: none !important;
    cursor: pointer;
    transition: var(--mc-transition);
    border: 2px solid transparent;
    text-align: center;
    white-space: nowrap;
}
.lkd-btn--primary {
    background: var(--mc-cyan);
    color: var(--mc-white) !important;
    border-color: var(--mc-cyan);
}
.lkd-btn--primary:hover {
    background: var(--mc-blue);
    border-color: var(--mc-blue);
}
.lkd-btn--outline {
    background: transparent;
    color: var(--mc-white) !important;
    border-color: rgba(255,255,255,0.6);
}
.lkd-btn--outline:hover {
    background: rgba(255,255,255,0.15);
    border-color: var(--mc-white);
}
.lkd-btn--outline-dark {
    background: transparent;
    color: var(--mc-blue) !important;
    border-color: var(--mc-blue);
}
.lkd-btn--outline-dark:hover {
    background: var(--mc-blue);
    color: var(--mc-white) !important;
}
.lkd-btn--sm { padding: 8px 16px; font-size: 13px; }
.lkd-btn--lg { padding: 16px 32px; font-size: 16px; font-weight: 700; }
.lkd-btn--submit {
    display: block;
    width: 100%;
    background: var(--mc-cyan);
    color: var(--mc-white) !important;
    border-color: var(--mc-cyan);
    font-size: 16px;
    font-weight: 700;
    padding: 18px;
    border-radius: var(--mc-radius);
    box-shadow: 0 6px 20px rgba(46,163,242,0.3);
    margin-top: 8px;
    cursor: pointer;
    border: none;
    font-family: var(--mc-font);
}
.lkd-btn--submit:hover {
    background: var(--mc-blue);
    box-shadow: 0 8px 25px rgba(15,76,129,0.35);
    transform: translateY(-1px);
}

/* ── TEXT ACCENT ──────────────────────────────────────────────── */
.lkd-text-accent { color: var(--mc-cyan); }

/* ── SECTIONS ─────────────────────────────────────────────────── */
.lkd-section { padding: 70px 0; }
.lkd-section--white { background: var(--mc-white); }
.lkd-section--light { background: var(--mc-light-bg); }
.lkd-section--dark { background: var(--mc-dark); }
.lkd-section--blue-gradient {
    background: linear-gradient(135deg, var(--mc-blue) 0%, var(--mc-dark) 100%);
}
.lkd-section--form {
    background: linear-gradient(135deg, var(--mc-blue-dark) 0%, var(--mc-blue) 100%);
}

/* ── SECTION HEADERS ──────────────────────────────────────────── */
.lkd-section-header { text-align: center; margin-bottom: 50px; }
.lkd-section-header h2 { font-size: 28px; color: var(--mc-blue); margin-bottom: 12px; }
.lkd-section-header p { font-size: 15px; color: var(--mc-text-muted); max-width: 620px; margin: 0 auto; }
.lkd-section-header__label {
    display: inline-block;
    background: var(--mc-cyan-light);
    color: var(--mc-blue);
    font-size: 11px;
    font-weight: 700;
    letter-spacing: 1.5px;
    text-transform: uppercase;
    padding: 5px 12px;
    border-radius: 50px;
    margin-bottom: 12px;
}
.lkd-section-header--white h2 { color: var(--mc-white) !important; }
.lkd-section-header--white p { color: rgba(255,255,255,0.95) !important; }
.lkd-section-header--white .lkd-section-header__label {
    background: rgba(255,255,255,0.15);
    color: var(--mc-white);
}

/* ── HEADER ───────────────────────────────────────────────────── */
.lkd-header {
    background: var(--mc-white);
    box-shadow: 0 1px 0 rgba(0,0,0,0.1);
    position: sticky;
    top: 0;
    z-index: 100;
    padding: 14px 0;
}
.lkd-header__inner {
    display: flex;
    align-items: center;
    justify-content: space-between;
}
.lkd-header__logo img {
    max-height: 48px;
    width: auto;
    display: block;
}
.lkd-header__nav {
    display: flex;
    align-items: center;
    gap: 28px;
}
.lkd-header__nav a {
    color: rgba(0,0,0,0.6);
    font-size: 14px;
    font-weight: 500;
    text-decoration: none;
    transition: var(--mc-transition);
}
.lkd-header__nav a:hover { color: var(--mc-cyan); }

/* ── HERO ─────────────────────────────────────────────────────── */
.lkd-hero {
    background: radial-gradient(ellipse at 70% 0%, #153258 0%, var(--mc-dark) 70%);
    color: var(--mc-white);
    padding: 90px 0 80px;
    text-align: center;
}
.lkd-hero__badge {
    display: inline-block;
    background: rgba(46,163,242,0.2);
    color: var(--mc-cyan);
    font-size: 11px;
    font-weight: 700;
    letter-spacing: 1.5px;
    text-transform: uppercase;
    padding: 6px 16px;
    border-radius: 50px;
    border: 1px solid rgba(46,163,242,0.35);
    margin-bottom: 20px;
}
.lkd-hero__title {
    font-size: 36px;
    font-weight: 800;
    color: var(--mc-white) !important;
    line-height: 1.2em;
    margin-bottom: 20px;
    padding-bottom: 0;
}
.lkd-hero__lead {
    font-size: 16px;
    color: rgba(255,255,255,0.95) !important;
    max-width: 680px;
    margin: 0 auto 32px;
    line-height: 1.7em;
}
.lkd-hero__actions {
    display: flex;
    justify-content: center;
    gap: 16px;
    flex-wrap: wrap;
    margin-bottom: 50px;
}
.lkd-hero__bonos {
    display: flex;
    justify-content: center;
    gap: 16px;
    flex-wrap: wrap;
}
.lkd-bono-pill {
    background: rgba(255,255,255,0.1);
    border: 1px solid rgba(255,255,255,0.2);
    border-radius: var(--mc-radius);
    padding: 16px 24px;
    text-align: center;
    min-width: 140px;
    backdrop-filter: blur(6px);
    transition: var(--mc-transition);
}
.lkd-bono-pill:hover {
    background: rgba(255,255,255,0.18);
    transform: translateY(-3px);
}
.lkd-bono-pill--accent { border-color: var(--mc-cyan); background: rgba(46,163,242,0.15); }
.lkd-bono-pill__amount { display: block; font-size: 22px; font-weight: 800; color: var(--mc-white); }
.lkd-bono-pill--accent .lkd-bono-pill__amount { color: var(--mc-cyan); }
.lkd-bono-pill__desc { display: block; font-size: 11px; color: rgba(255,255,255,0.65); margin-top: 4px; }

/* ── DOS COLUMNAS ─────────────────────────────────────────────── */
.lkd-two-col {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 40px;
    align-items: start;
}
.lkd-two-col--50-50 { align-items: stretch; }
.lkd-two-col__text { font-size: 15px; color: var(--mc-text-muted); }
.lkd-two-col__text p { margin-bottom: 16px; }
.lkd-two-col__cards { display: flex; flex-direction: column; gap: 16px; }

/* ── INFO CARDS ───────────────────────────────────────────────── */
.lkd-info-card {
    background: var(--mc-white);
    border-radius: var(--mc-radius-lg);
    padding: 24px;
    box-shadow: var(--mc-shadow);
    border-left: 4px solid var(--mc-cyan);
    transition: var(--mc-transition);
}
.lkd-info-card:hover { transform: translateX(4px); box-shadow: var(--mc-shadow-lg); }
.lkd-info-card__icon { font-size: 28px; margin-bottom: 10px; }
.lkd-info-card h3 { font-size: 14px; font-weight: 700; color: var(--mc-blue); margin-bottom: 8px; padding-bottom: 0; }
.lkd-info-card p { font-size: 13px; color: var(--mc-text-muted); margin: 0; }

/* ── SERVICES GRID ────────────────────────────────────────────── */
.lkd-services-grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 24px;
    align-items: stretch;
}
.lkd-service-card {
    background: rgba(255,255,255,0.06);
    border: 1px solid rgba(255,255,255,0.12);
    border-radius: var(--mc-radius-lg);
    padding: 24px;
    text-align: center;
    transition: var(--mc-transition);
    color: var(--mc-white);
    display: flex;
    flex-direction: column;
    height: 100%;
}
.lkd-service-card:hover {
    background: rgba(255,255,255,0.12);
    transform: translateY(-4px);
    border-color: var(--mc-cyan);
}
.lkd-service-card__icon { font-size: 36px; margin-bottom: 14px; display: block; }
.lkd-service-card h3 { font-size: 15px; font-weight: 700; color: var(--mc-white); margin-bottom: 10px; padding-bottom: 0; }
.lkd-service-card p { font-size: 13px; color: rgba(255,255,255,0.9); margin: 0; }

/* ── BONOS GRID ───────────────────────────────────────────────── */
.lkd-bonos-grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 24px;
    align-items: stretch;
}
.lkd-bono-card {
    background: var(--mc-white);
    border: 2px solid var(--mc-border);
    border-radius: var(--mc-radius-lg);
    padding: 28px 20px;
    text-align: center;
    position: relative;
    transition: var(--mc-transition);
    box-shadow: var(--mc-shadow);
    display: flex;
    flex-direction: column;
    height: 100%;
}
.lkd-bono-card:hover { transform: translateY(-4px); box-shadow: var(--mc-shadow-lg); border-color: var(--mc-cyan); }
.lkd-bono-card--featured {
    border-color: var(--mc-blue);
    box-shadow: var(--mc-shadow-lg);
    transform: scale(1.04);
}
.lkd-bono-card--featured:hover { transform: scale(1.04) translateY(-4px); }
.lkd-bono-card__badge {
    position: absolute;
    top: -12px;
    left: 50%;
    transform: translateX(-50%);
    background: var(--mc-blue);
    color: var(--mc-white);
    font-size: 10px;
    font-weight: 700;
    letter-spacing: 1px;
    padding: 4px 12px;
    border-radius: 50px;
    white-space: nowrap;
}
.lkd-bono-card__segment { font-size: 11px; font-weight: 700; color: var(--mc-text-muted); text-transform: uppercase; letter-spacing: 1px; margin-bottom: 10px; }
.lkd-bono-card__amount { font-size: 36px; font-weight: 800; color: var(--mc-blue); line-height: 1; margin-bottom: 8px; }
.lkd-bono-card--featured .lkd-bono-card__amount { color: var(--mc-blue); }
.lkd-bono-card__range { font-size: 14px; font-weight: 600; color: var(--mc-text); margin-bottom: 14px; }
.lkd-bono-card p { font-size: 13px; color: var(--mc-text-muted); margin-bottom: 20px; }
.lkd-bono-card .lkd-btn { width: 100%; margin-top: auto; }

/* ── STEPS (NOS ENCARGAMOS) ───────────────────────────────────── */
.lkd-steps-grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 24px;
    margin-bottom: 36px;
}
.lkd-step {
    background: rgba(255,255,255,0.08);
    border: 1px solid rgba(255,255,255,0.15);
    border-radius: var(--mc-radius-lg);
    padding: 28px 20px;
    text-align: center;
    color: var(--mc-white);
    transition: var(--mc-transition);
}
.lkd-step:hover { background: rgba(255,255,255,0.14); transform: translateY(-3px); }
.lkd-step__num {
    width: 48px;
    height: 48px;
    background: var(--mc-cyan);
    color: var(--mc-white);
    font-size: 18px;
    font-weight: 800;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    margin: 0 auto 16px;
}
.lkd-step h3 { font-size: 15px; color: var(--mc-white); margin-bottom: 10px; padding-bottom: 0; }
.lkd-step p { font-size: 13px; color: rgba(255,255,255,0.9); margin: 0; }
.lkd-gratuito-banner {
    background: rgba(255,255,255,0.12);
    border: 1px solid rgba(255,255,255,0.25);
    border-radius: var(--mc-radius-lg);
    padding: 20px 28px;
    text-align: center;
    color: var(--mc-white);
    font-size: 15px;
}
.lkd-gratuito-banner strong { font-size: 16px; }

/* ── INFO BLOCKS (BASES Y CONSIDERACIONES) ────────────────────── */
.lkd-card-info-block {
    background: var(--mc-white);
    border-radius: var(--mc-radius-lg);
    padding: 32px;
    box-shadow: var(--mc-shadow);
    height: 100%;
}
.lkd-card-info-block h2 { font-size: 20px; color: var(--mc-blue); margin-bottom: 20px; padding-bottom: 12px; border-bottom: 2px solid var(--mc-border); }
.lkd-check-list { list-style: none; padding: 0; margin: 0; }
.lkd-check-list li {
    padding: 10px 0 10px 28px;
    position: relative;
    font-size: 14px;
    color: var(--mc-text-muted);
    border-bottom: 1px solid var(--mc-border);
}
.lkd-check-list li:last-child { border-bottom: none; }
.lkd-check-list li::before {
    content: "✓";
    position: absolute;
    left: 0;
    color: var(--mc-cyan);
    font-weight: 700;
}

/* ── ROADMAP ──────────────────────────────────────────────────── */
.lkd-roadmap { position: relative; max-width: 700px; margin: 0 auto; }
.lkd-roadmap::before {
    content: '';
    position: absolute;
    left: 20px;
    top: 0;
    bottom: 0;
    width: 2px;
    background: var(--mc-border);
}
.lkd-roadmap__step {
    display: flex;
    gap: 28px;
    align-items: flex-start;
    margin-bottom: 32px;
    position: relative;
}
.lkd-roadmap__dot {
    width: 40px;
    height: 40px;
    border-radius: 50%;
    background: var(--mc-cyan);
    flex-shrink: 0;
    border: 3px solid var(--mc-white);
    box-shadow: 0 0 0 3px var(--mc-cyan);
    z-index: 1;
}
.lkd-roadmap__content {
    padding-top: 8px;
    font-size: 14px;
}
.lkd-roadmap__content strong { font-size: 16px; color: var(--mc-blue); display: block; margin-bottom: 4px; }
.lkd-roadmap__content p { margin: 0; color: var(--mc-text-muted); }

/* ── FORM ─────────────────────────────────────────────────────── */
.lkd-form-card {
    background: var(--mc-white);
    border-radius: var(--mc-radius-lg);
    padding: 40px;
    box-shadow: var(--mc-shadow-lg);
}
.lkd-form-row {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 20px;
    margin-bottom: 20px;
}
.lkd-form-group { display: flex; flex-direction: column; gap: 6px; margin-bottom: 4px; }
.lkd-form-group label { font-size: 13px; font-weight: 600; color: var(--mc-text); }
.lkd-form-group input,
.lkd-form-group select,
.lkd-form-group textarea {
    font-family: var(--mc-font);
    font-size: 14px;
    padding: 10px 14px;
    border: 1px solid #bbb;
    border-radius: var(--mc-radius);
    background: var(--mc-white);
    color: var(--mc-text);
    transition: var(--mc-transition);
}
.lkd-form-group input:focus,
.lkd-form-group select:focus,
.lkd-form-group textarea:focus {
    outline: none;
    border-color: var(--mc-cyan);
    box-shadow: 0 0 0 3px rgba(46,163,242,0.15);
}
.lkd-form-group input.is-invalid,
.lkd-form-group select.is-invalid {
    border-color: var(--mc-error);
}
.lkd-error {
    display: none;
    color: var(--mc-error);
    font-size: 12px;
    font-weight: 600;
    margin-top: 2px;
}
.lkd-checkboxes {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 10px;
    background: var(--mc-light-bg);
    border: 1px solid var(--mc-border);
    border-radius: var(--mc-radius);
    padding: 16px;
    margin-top: 4px;
}
.lkd-checkbox-label {
    display: flex;
    align-items: center;
    gap: 8px;
    font-size: 13px;
    color: var(--mc-text-muted);
    cursor: pointer;
    font-weight: 400 !important;
}
.lkd-checkbox-label input[type=checkbox] { accent-color: var(--mc-cyan); width: 15px; height: 15px; }
.lkd-form-group--rgpd {
    background: var(--mc-light-bg);
    border: 1px solid var(--mc-border);
    border-radius: var(--mc-radius);
    padding: 16px;
    margin-bottom: 20px;
    margin-top: 8px;
}
.lkd-rgpd-text { font-size: 11px; color: var(--mc-text-muted); margin: 8px 0 0; line-height: 1.5; }
.lkd-rgpd-text a { color: var(--mc-blue); text-decoration: underline; }
.lkd-success {
    display: none;
    background: #e9f8ee;
    border: 1px solid #b7dfc5;
    border-radius: var(--mc-radius);
    padding: 20px 24px;
    margin-top: 20px;
    color: #1a6933;
}
.lkd-success strong { display: block; font-size: 16px; margin-bottom: 6px; }
.lkd-success p { margin: 0; font-size: 13px; }
.lkd-disclaimer-form { font-size: 11px; color: rgba(255,255,255,0.55); text-align: center; margin-top: 20px; }

/* ── MINI CARDS OTROS SERVICIOS ───────────────────────────────── */
.lkd-services-mini {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 24px;
}
.lkd-mini-card {
    background: var(--mc-white);
    border: 1px solid var(--mc-border);
    border-radius: var(--mc-radius-lg);
    padding: 28px;
    text-align: center;
    display: flex;
    flex-direction: column;
    gap: 10px;
    text-decoration: none !important;
    color: var(--mc-text);
    transition: var(--mc-transition);
    box-shadow: var(--mc-shadow);
}
.lkd-mini-card:hover { transform: translateY(-4px); box-shadow: var(--mc-shadow-lg); border-color: var(--mc-cyan); color: var(--mc-text); }
.lkd-mini-card__icon { font-size: 36px; }
.lkd-mini-card strong { font-size: 16px; color: var(--mc-blue); }
.lkd-mini-card span { font-size: 13px; color: var(--mc-text-muted); }

/* ── FOOTER ───────────────────────────────────────────────────── */
.lkd-footer {
    background: #1a1a2e;
    color: rgba(255,255,255,0.65);
    padding: 50px 0 30px;
}
.lkd-footer__inner {
    display: grid;
    grid-template-columns: 1.5fr 1fr;
    gap: 48px;
    margin-bottom: 32px;
}
.lkd-footer__logo img {
    background: #ffffff;
    padding: 8px 16px;
    border-radius: var(--mc-radius);
    display: inline-block;
    margin-bottom: 16px;
    max-height: 48px;
    width: auto;
}
.lkd-footer__logo p { font-size: 13px; line-height: 1.7; }
.lkd-footer__logo a { color: rgba(255,255,255,0.65); }
.lkd-footer__links { display: flex; flex-direction: column; gap: 10px; }
.lkd-footer__links a { color: rgba(255,255,255,0.55); font-size: 13px; }
.lkd-footer__links a:hover { color: var(--mc-cyan); }
.lkd-footer__copy { border-top: 1px solid rgba(255,255,255,0.08); padding-top: 24px; }
.lkd-footer__copy p { font-size: 12px; color: rgba(255,255,255,0.35); margin: 0; text-align: center; }

/* ── RESPONSIVE ───────────────────────────────────────────────── */
@media (max-width: 980px) {
    .lkd-container { width: 90%; }
    .lkd-hero__title { font-size: 28px; }
    .lkd-header__nav a:not(.lkd-btn) { display: none; }
    .lkd-services-grid { grid-template-columns: repeat(2, 1fr); }
    .lkd-bonos-grid { grid-template-columns: repeat(2, 1fr); }
    .lkd-bono-card--featured { transform: none; }
    .lkd-steps-grid { grid-template-columns: repeat(2, 1fr); }
    .lkd-two-col { grid-template-columns: 1fr; }
    .lkd-two-col--50-50 { grid-template-columns: 1fr; }
    .lkd-form-card { padding: 24px; }
}

@media (max-width: 640px) {
    .lkd-section { padding: 50px 0; }
    .lkd-hero { padding: 60px 0; }
    .lkd-hero__title { font-size: 22px; }
    .lkd-hero__actions { flex-direction: column; align-items: center; }
    .lkd-hero__bonos { flex-direction: column; align-items: center; }
    .lkd-services-grid { grid-template-columns: 1fr; }
    .lkd-bonos-grid { grid-template-columns: 1fr; }
    .lkd-steps-grid { grid-template-columns: 1fr; }
    .lkd-services-mini { grid-template-columns: 1fr; }
    .lkd-footer__inner { grid-template-columns: 1fr; }
    .lkd-form-row { grid-template-columns: 1fr; }
    .lkd-checkboxes { grid-template-columns: 1fr; }
    .lkd-roadmap::before { display: none; }
}