/* ==========================================================================
   ADELITA — variante de color sobre natcom.css
   Solo redefine los tokens: toda la maquetación se hereda de natcom.css.
   Paleta tomada del logotipo de Adelita (púrpura / orquídea).
   ========================================================================== */

body.theme-adelita {
    --nc-indigo: #472063;
    --nc-indigo-dark: #35164B;
    --nc-purple: #8E3E9E;
    --nc-magenta: #B94FA8;
    --nc-pink: #C77DC0;

    --nc-grad: linear-gradient(135deg, #C77DC0 0%, #9A45A6 52%, #472063 100%);
    --nc-grad-soft: linear-gradient(135deg, rgba(199, 125, 192, .14) 0%, rgba(142, 62, 158, .12) 55%, rgba(71, 32, 99, .10) 100%);

    --nc-ink: #2A1438;
    --nc-wash: #FAF6FB;
    --nc-line: #EDE3EF;
}

/* Sombras de acento: el token base es indigo, aquí van en púrpura */
body.theme-adelita .nc-btn--primary { box-shadow: 0 10px 26px -10px rgba(142, 62, 158, .6); }
body.theme-adelita .nc-btn--primary:hover,
body.theme-adelita .nc-btn--primary:focus { box-shadow: 0 16px 34px -10px rgba(142, 62, 158, .72); }
body.theme-adelita .nc-ico-tile { box-shadow: 0 10px 24px -12px rgba(142, 62, 158, .8); }
body.theme-adelita .nc-fcard-body .nc-ico-badge { box-shadow: 0 8px 20px -10px rgba(142, 62, 158, .8); }
body.theme-adelita #header #main-navbar .nav > li.nc-nav-cta > a { box-shadow: 0 8px 20px -9px rgba(142, 62, 158, .65); }
body.theme-adelita .nc-btn--ghost:hover,
body.theme-adelita .nc-btn--ghost:focus { border-color: rgba(142, 62, 158, .35); }
body.theme-adelita .nc-fcard:hover,
body.theme-adelita .nc-service:hover,
body.theme-adelita .nc-line-card:hover { border-color: rgba(142, 62, 158, .24); }
body.theme-adelita .nc-field input:focus {
    border-color: var(--nc-purple);
    box-shadow: 0 0 0 4px rgba(142, 62, 158, .13);
}
body.theme-adelita :focus-visible { outline-color: var(--nc-magenta); }

/* Hero: mismo lavado radial, en tonos Adelita */
body.theme-adelita .nc-hero {
    background:
        radial-gradient(900px 520px at 88% -8%, rgba(199, 125, 192, .22), transparent 62%),
        radial-gradient(760px 480px at 4% 8%, rgba(142, 62, 158, .14), transparent 60%),
        linear-gradient(180deg, #FCF9FD 0%, #FFFFFF 72%);
}
body.theme-adelita .nc-stats::before,
body.theme-adelita .nc-cta::before {
    background:
        radial-gradient(700px 340px at 15% 10%, rgba(199, 125, 192, .34), transparent 62%),
        radial-gradient(640px 320px at 88% 96%, rgba(142, 62, 158, .48), transparent 64%);
}
body.theme-adelita .nc-contact-panel::before {
    background: radial-gradient(520px 300px at 100% 0%, rgba(199, 125, 192, .32), transparent 62%);
}

/* --------------------------------- Elementos propios de esta página ----- */

/* Enlace "volver a Natcom" en el navbar */
.ad-back {
    display: inline-flex !important;
    align-items: center;
    gap: 7px;
}
.ad-back svg { transition: transform .2s var(--nc-ease); }
.ad-back:hover svg { transform: translateX(-3px); }

/* Hero centrado: la captura del producto va debajo, a todo el ancho */
.ad-hero-center { max-width: 860px; margin: 0 auto 56px; text-align: center; }
.ad-hero-center .nc-hero-sub { margin-left: auto; margin-right: auto; }
.ad-hero-center .nc-hero-actions { justify-content: center; margin-bottom: 0; }

body.theme-adelita .nc-hero h1 {
    font: 600 clamp(21px, 2.7vw, 31px)/1.35 "Poppins", sans-serif;
    letter-spacing: -.02em;
    color: var(--nc-ink);
    margin: 0 0 22px;
}

/* Los indicadores de esta página son texto, no cifras: van más discretos */
body.theme-adelita .nc-stat-num { font-size: clamp(19px, 2.2vw, 26px); }

/* Wordmark de Adelita en el hero */
.ad-wordmark {
    font: 300 clamp(38px, 6vw, 74px)/1 "Poppins", sans-serif;
    letter-spacing: .16em;
    text-transform: uppercase;
    margin: 0 0 14px;
}
.ad-tagline {
    display: block;
    font: 400 clamp(13px, 1.3vw, 16px)/1.4 "Poppins", sans-serif;
    letter-spacing: .22em;
    text-transform: uppercase;
    color: var(--nc-purple);
    margin-bottom: 26px;
}

/* Captura grande del producto */
.ad-shot {
    border-radius: var(--nc-radius);
    overflow: hidden;
    box-shadow: var(--nc-shadow-lg);
    border: 1px solid var(--nc-line);
    background: var(--nc-wash);
}
.ad-shot img { width: 100%; height: auto; display: block; }

/* --------------------------- El problema que resuelve ------------------- */

.ad-pains {
    list-style: none;
    padding: 0;
    margin: 0 0 44px;
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 18px 36px;
}
.ad-pains li {
    display: flex;
    align-items: flex-start;
    gap: 13px;
    font: 300 15px/1.7 "Poppins", sans-serif;
    color: var(--nc-body);
}
.ad-pains svg { flex: none; width: 19px; height: 19px; margin-top: 4px; color: #C0566B; }
.ad-pains strong { font-weight: 600; color: var(--nc-ink); }

.ad-solution {
    max-width: 830px;
    margin: 0 auto;
    padding: 26px 32px;
    border-left: 4px solid var(--nc-purple);
    border-radius: 0 var(--nc-radius-sm) var(--nc-radius-sm) 0;
    background: #fff;
    box-shadow: var(--nc-shadow);
    font: 500 clamp(15.5px, 1.6vw, 18.5px)/1.65 "Poppins", sans-serif;
    color: var(--nc-ink);
}

/* ------------------------------- Rejilla de funcionalidades ------------- */

.ad-features { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 20px; }
.ad-module {
    display: flex;
    align-items: flex-start;
    gap: 16px;
    padding: 24px 22px;
    border: 1px solid var(--nc-line);
    border-radius: var(--nc-radius-sm);
    background: #fff;
    transition: transform .3s var(--nc-ease), box-shadow .3s var(--nc-ease), border-color .3s var(--nc-ease);
}
.ad-module:hover {
    transform: translateY(-4px);
    border-color: rgba(142, 62, 158, .24);
    box-shadow: var(--nc-shadow);
}
.ad-module .nc-ico-badge { width: 42px; height: 42px; border-radius: 12px; }
.ad-module .nc-ico-badge svg { width: 20px; height: 20px; }
.ad-module h3 { font: 600 16.5px/1.35 "Poppins", sans-serif; margin: 0 0 7px; }
.ad-module p { font: 300 14px/1.68 "Poppins", sans-serif; color: var(--nc-body); margin: 0; }
.ad-module p strong { font-weight: 600; color: var(--nc-ink); }

/* -------------------------------- Comparativa Antes / Con Adelita ------ */

.ad-compare {
    border: 1px solid var(--nc-line);
    border-radius: var(--nc-radius);
    background: #fff;
    box-shadow: var(--nc-shadow);
    overflow: hidden;
}
.ad-compare-heads { display: grid; grid-template-columns: 1fr 1fr; border-bottom: 1px solid var(--nc-line); }
.ad-compare-heads span {
    padding: 17px 26px;
    font: 600 11.5px/1 "Poppins", sans-serif;
    letter-spacing: .14em;
    text-transform: uppercase;
}
.ad-h-before { color: var(--nc-muted); }
.ad-h-after {
    color: var(--nc-purple);
    border-left: 1px solid var(--nc-line);
}

.ad-compare ul { list-style: none; padding: 0; margin: 0; }
.ad-compare li { display: grid; grid-template-columns: 1fr 1fr; }
.ad-compare li + li { border-top: 1px solid var(--nc-line); }

.ad-before, .ad-after {
    display: flex;
    align-items: flex-start;
    gap: 12px;
    padding: 20px 26px;
    font: 400 14.5px/1.6 "Poppins", sans-serif;
}
.ad-before { color: var(--nc-muted); }
.ad-before svg { flex: none; width: 18px; height: 18px; margin-top: 3px; color: #C0566B; }
.ad-after {
    color: var(--nc-ink);
    font-weight: 500;
    border-left: 1px solid var(--nc-line);
}
.ad-after svg { flex: none; width: 18px; height: 18px; margin-top: 3px; color: var(--nc-purple); }

/* Bloque "para quién es" */
.ad-audience { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 20px; }
.ad-aud-item {
    text-align: center;
    padding: 30px 20px;
    border-radius: var(--nc-radius);
    background: #fff;
    border: 1px solid var(--nc-line);
}
.ad-aud-item .nc-ico-badge { margin: 0 auto 16px; }
.ad-aud-item h3 { font: 600 16px/1.35 "Poppins", sans-serif; margin: 0 0 8px; }
.ad-aud-item p { font: 300 14px/1.65 "Poppins", sans-serif; color: var(--nc-body); margin: 0; }

/* Aviso de que Adelita es un producto de Natcom */
.ad-parent {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: center;
    gap: 18px;
    padding: 26px 30px;
    border: 1px dashed rgba(142, 62, 158, .3);
    border-radius: var(--nc-radius);
    background: var(--nc-wash);
    text-align: center;
}
.ad-parent img { height: 34px; width: auto; }
.ad-parent p { font: 400 14.5px/1.6 "Poppins", sans-serif; color: var(--nc-body); margin: 0; }
.ad-parent a { color: var(--nc-purple); font-weight: 600; text-decoration: none; }
.ad-parent a:hover, .ad-parent a:focus { color: var(--nc-magenta); text-decoration: underline; }

@media (max-width: 991px) {
    .ad-features { grid-template-columns: 1fr; }
    .ad-audience { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .ad-pains { gap: 16px 28px; }
}
@media (max-width: 767px) {
    .ad-hero-center { margin-bottom: 40px; }
    .ad-pains { grid-template-columns: 1fr; margin-bottom: 34px; }
    .ad-solution { padding: 22px 24px; }
    .ad-audience { grid-template-columns: 1fr; }
    .ad-parent { flex-direction: column; gap: 12px; }

    /* La comparativa se apila: el icono y el color distinguen antes / después */
    .ad-compare-heads { display: none; }
    .ad-compare li { grid-template-columns: 1fr; }
    .ad-before, .ad-after { padding: 16px 22px; }
    .ad-after { border-left: 0; border-top: 1px dashed var(--nc-line); }
}