/*
 Theme Name:     Veronica Tolosa Child Theme
 Theme URI:      https://www.elegantthemes.com/gallery/divi/
 Description:    Divi Child Theme
 Author:         Nicolás Bonfil
 Author URI:     https://www.veronicatolosa.com/
 Template:       Divi
 Version:        1.0.2
*/

/* =========================================================================
   IMPORTACIÓN DE FUENTES
   ========================================================================= */
/* Fraunces (titulares), Inter (párrafos) y Lato (botones) — todo en un import. */
@import url('https://fonts.googleapis.com/css2?family=Fraunces:ital,opsz,wght@0,9..144,100..900;1,9..144,100..900&family=Inter:wght@300;400;500;600;700&family=Lato:wght@300;400;700&display=swap');


/* =========================================================================
   ████████████████████████████████████████████████████████████████████████
   PARTE 1 — ESTILOS GLOBALES DEL SITIO (los que ya tenías)
   ████████████████████████████████████████████████████████████████████████
   Estos afectan TODO el sitio (Divi). No modifiqué reglas, solo arreglé
   los 3 bugs (h4 sin font-family, llave } extra, "Helvatica") y reformateé.
   ========================================================================= */
   
 /* MENU */
   a:has(#menu-whatsapp) {
    width: 55% !important;
  }
  
  a:has(#menu-email) {
    width: 48% !important;
  }


/* GENERAL SECCIONES */
body{
    background-color: #FCFAF5 !important;
}

.et_pb_section{
    background-color: #FCFAF5 !important;
}

/* FUENTES */
p, ul li{
    font-family: "Inter", Helvetica, sans-serif !important;
    font-size: 18px !important;
    color: #2E3A52 !important;
}

h1{
    font-size: 39px !important;
    font-family: "Fraunces", Georgia, serif !important;
    margin-bottom: 20px;
}

.subtitle1 h1{
    font-size: 34px !important;
}

h2{
    font-weight: 500 !important;
    font-size: 31px !important;
    font-family: "Fraunces", Georgia, serif !important;
    margin-bottom: 15px;
}

.subtitle2 h2{
    font-weight: 300 !important;
    font-size: 25px !important;
}

h3{
    font-weight: 300;
    font-size: 24px !important;
    font-family: "Fraunces", Georgia, serif !important;
}

.subtitle3 h3{
    font-size: 21px !important;
}

h4{
    font-weight: 300;
    font-size: 20px !important;
    font-family: "Fraunces", Georgia, serif !important;
}

.subtitle4 h4{
    font-size: 17px !important;
}

/* BOTONES */
.btn-1{
    color: white;
    font-family: 'Lato', Helvetica, Arial, Lucida, sans-serif;
    padding: 7px 20px 7px 20px;
    background-color: #00a9d4;
    border: 0;
    box-shadow: 6px 6px 18px 0px rgba(0, 0, 0, 0.36);
    border-radius: 16px;
}

.btn-2{
    color: white;
    font-family: 'Lato', Helvetica, Arial, Lucida, sans-serif;
    padding: 7px 20px 7px 20px;
    background-color: #1b263b;
    border: 0;
    box-shadow: 6px 6px 18px 0px rgba(0, 0, 0, 0.36);
    border-radius: 16px;
}

.btn-3{
    color: white;
    font-family: 'Lato', Helvetica, Arial, Lucida, sans-serif;
    padding: 7px 20px 7px 20px;
    background-color: #466;
    border: 0;
    box-shadow: 6px 6px 18px 0px rgba(0, 0, 0, 0.36);
    border-radius: 16px;
}

/* BLURB */
.blurb p{
    font-size: 15px !important;
    text-align: center !important;
}
.blurb h4{
    font-family: "Fraunces", Georgia, serif !important;
    text-align: center !important;
    font-weight: 500 !important;
}

/* TESTIMONIOS */
.testimonios p{
    font-size: 27px !important;
    text-align: center !important;
}

/* TOGGLE */
.et_pb_toggle_title::before{
    display: none !important;
}

/* INFO */
.info h3{
    font-weight: 500 !important;
    padding-bottom: 0px !important;
    margin-bottom: 0px !important;
}

/* FOOTER */
.footer p a{
    color: #2E3A52 !important;
    font-weight: 300 !important;
}

/* MEDIA — TABLET */
@media(max-width:1024px){
    p{ font-size: 17px !important; }
    h1{ font-size: 36px !important; }
    .subtitle1 h1{ font-size: 31px !important; }
    h2{ font-size: 28px !important; }
    .subtitle2 h2{ font-size: 22px !important; }
    h3{ font-size: 21px !important; }
    .subtitle3 h3{ font-size: 18px !important; }
    h4{ font-size: 17px !important; }
    .subtitle4 h4{ font-size: 14px !important; }
}

/* MEDIA — MOBILE */
@media(max-width:768px){
    p{ font-size: 16px !important; }
    h1{ font-size: 35px !important; }
    .subtitle1 h1{ font-size: 30px !important; }
    h2{ font-size: 27px !important; }
    .subtitle2 h2{ font-size: 21px !important; }
    h3{ font-size: 20px !important; }
    .subtitle3 h3{ font-size: 17px !important; }
    h4{ font-size: 16px !important; }
    .subtitle4 h4{ font-size: 14px !important; }
}


/* =========================================================================
   ████████████████████████████████████████████████████████████████████████
   PARTE 2 — ESTILOS DE LOS ARTÍCULOS DE BLOG
   ████████████████████████████████████████████████████████████████████████
   TODO está encerrado dentro de .vt-articulo para que ningún estilo se
   filtre al resto del sitio. Para activarlos, en cada artículo de Divi
   pegá el HTML dentro de un contenedor con la clase "vt-articulo":

       <div class="vt-articulo">
         ... contenido del artículo ...
       </div>

   Las clases internas (.post, .toc, .pull-quote, etc) NO se aplican a
   nada que no esté dentro de .vt-articulo. 100% seguro.
   ========================================================================= */

/* ROMPER EL CONTAINER DE DIVI — solo cuando envuelve un .vt-articulo
   Esto hace que el módulo de código ocupe todo el ancho de la fila,
   sin afectar a otros .container del sitio. */
.container:has(> .vt-articulo),
.container:has(.vt-articulo),
.et_pb_row:has(.vt-articulo) .et_pb_column,
.et_pb_row:has(.vt-articulo){
    width: 100% !important;
    max-width: 100% !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
    margin-top: 0 !important;
    margin-bottom: 0 !important;
    padding-left: 0 !important;
    padding-right: 0 !important;
    padding-top: 0 !important;
    padding-bottom: 0 !important;
}

/* También quitar padding lateral del módulo de código y de la sección */
.et_pb_section:has(.vt-articulo),
.et_pb_code:has(.vt-articulo),
.et_pb_code_inner:has(.vt-articulo){
    padding-left: 0 !important;
    padding-right: 0 !important;
    padding-top: 0 !important;
    padding-bottom: 0 !important;
    margin-top: 0 !important;
    margin-bottom: 0 !important;
}

/* Matar el padding/margin que Divi le mete al <article.et_pb_post>
   y al wrapper del meta de post — solo si contiene un .vt-articulo */
article.et_pb_post:has(.vt-articulo),
.single .post:has(.vt-articulo),
.et_pb_post:has(.vt-articulo){
    padding-bottom: 0 !important;
    padding-top: 0 !important;
    margin-bottom: 0 !important;
    margin-top: 0 !important;
}
article.et_pb_post:has(.vt-articulo) .entry-content,
.single .post:has(.vt-articulo) .entry-content{
    padding-bottom: 0 !important;
    margin-bottom: 0 !important;
}
article.et_pb_post:has(.vt-articulo) .et_post_meta_wrapper:empty,
.single .post:has(.vt-articulo) + .et_post_meta_wrapper{
    display: none !important;
}

/* Matar padding/margin de #left-area, #content-area y #main-content
   solo cuando contienen un .vt-articulo (Divi blog single page) */
#left-area:has(.vt-articulo),
#content-area:has(.vt-articulo),
#main-content:has(.vt-articulo) .container{
    padding: 0 !important;
    margin: 0 !important;
    width: 100% !important;
    max-width: 100% !important;
}
#main-content:has(.vt-articulo){
    padding: 0 !important;
}

/* TOKENS — variables solo para el blog */
.vt-articulo{
    --brand:#1B263B;
    --brand-2:#446666;
    --brand-soft:#E4ECEC;
    --brand-navy-soft:#DDE2EC;
    --ink:#1B263B;
    --ink-2:#2E3A52;
    --slate:#5E6A7F;
    --slate-soft:#8E97A8;
    --coral:#E55A47;
    --coral-soft:#FBE0DB;
    --gold:#C9942E;
    --gold-soft:#F6E8C3;
    --green-wa:#1FA855;
    --bg:#FCFAF5;
    --paper:#FFFFFF;
    --line:#E4DECE;
    --line-soft:#EFE9D9;
    --serif:"Fraunces", Georgia, serif;
    --sans:"Inter", system-ui, -apple-system, "Helvetica Neue", Arial, sans-serif;
    --measure: 100%;
    --wide: 100%;

    /* Reset interno: que el contenedor del artículo no herede line-height raros */
    font-family: var(--sans) !important;
    font-size: 18px !important;
    line-height: 1.65 !important;
    color: var(--ink-2) !important;
    -webkit-font-smoothing: antialiased !important;
    text-rendering: optimizeLegibility !important;
}

/* Box-sizing solo dentro del artículo */
.vt-articulo *,
.vt-articulo *::before,
.vt-articulo *::after{
    box-sizing: border-box !important;
}

/* Imágenes dentro del artículo */
.vt-articulo img{
    max-width: 100% !important;
    display: block !important;
}

/* Selección dentro del artículo */
.vt-articulo ::selection{
    background: var(--brand-2) !important;
    color: #fff !important;
}

/* Links del artículo (con resalte amarillo) */
.vt-articulo a{
    color: var(--brand-2) !important;
    text-decoration: none !important;
    background-image: linear-gradient(transparent 60%, var(--gold-soft) 60%) !important;
    background-size: 100% 100% !important;
    background-repeat: no-repeat !important;
    transition: background .2s, color .2s !important;
}
.vt-articulo a:hover{
    color: var(--brand) !important;
    background-image: linear-gradient(transparent 0%, var(--gold-soft) 0%) !important;
}

/* LAYOUT */
.vt-articulo .post{
    max-width: var(--wide) !important;
    margin: 0 auto !important;
    padding: 60px 100px 60px !important;
}
@media (max-width: 1024px){
    .vt-articulo .post{ padding: 48px 40px 48px !important; }
}
.vt-articulo .post-header,
.vt-articulo .post-section,
.vt-articulo .toc,
.vt-articulo .author-bio{
    max-width: var(--measure) !important;
    margin-left: auto !important;
    margin-right: auto !important;
}
.vt-articulo .post-section{ margin-top: 80px !important; }
.vt-articulo .post-section + .post-section{ margin-top: 96px !important; }

.vt-articulo .pull-quote,
.vt-articulo .cta,
.vt-articulo .callout,
.vt-articulo .caso-real,
.vt-articulo .interlink,
.vt-articulo .table-wrapper,
.vt-articulo .steps,
.vt-articulo .hero-image{
    max-width: var(--wide) !important;
    margin-left: auto !important;
    margin-right: auto !important;
}

/* TOPBAR */
.vt-articulo .top-strip{
    height: 6px !important;
    background: linear-gradient(90deg,
        var(--brand) 0% 40%,
        var(--brand-2) 40% 70%,
        var(--gold) 70% 90%,
        var(--coral) 90% 100%) !important;
}

/* BREADCRUMB */
.vt-articulo .breadcrumb{ font-size: 13px !important; color: var(--slate) !important; margin: 0 0 28px !important; }
.vt-articulo .breadcrumb ol{ list-style: none !important; padding: 0 !important; margin: 0 !important; display: flex !important; flex-wrap: wrap !important; gap: 6px !important; }
.vt-articulo .breadcrumb li + li::before{ content: "/" !important; margin-right: 6px !important; color: var(--slate-soft) !important; }
.vt-articulo .breadcrumb a{ color: var(--slate) !important; background: none !important; }
.vt-articulo .breadcrumb a:hover{ color: var(--brand-2) !important; background: none !important; }
.vt-articulo .breadcrumb [aria-current]{ color: var(--ink) !important; font-weight: 500 !important; }

/* POST META */
.vt-articulo .post-meta{
    display: flex !important; flex-wrap: wrap !important; align-items: center !important; gap: 10px !important;
    margin-bottom: 32px !important;
    font-size: 13px !important;
}
.vt-articulo .post-tags{ list-style: none !important; padding: 0 !important; margin: 0 !important; display: flex !important; flex-wrap: wrap !important; gap: 8px !important; }
.vt-articulo .tag{
    display: inline-flex !important; align-items: center !important; gap: 6px !important;
    padding: 5px 12px !important;
    border-radius: 999px !important;
    font-weight: 500 !important;
    font-size: 12px !important;
    letter-spacing: .04em !important;
    text-transform: uppercase !important;
    font-family: var(--sans) !important;
}
.vt-articulo .tag::before{ content: "" !important; width: 6px !important; height: 6px !important; border-radius: 999px !important; background: currentColor !important; }
.vt-articulo .tag--plum{ background: var(--brand-navy-soft) !important; color: var(--brand) !important; }
.vt-articulo .tag--coral{ background: var(--brand-soft) !important; color: var(--brand-2) !important; }
.vt-articulo .reading-time{
    display: inline-flex !important; align-items: center !important; gap: 6px !important;
    color: var(--slate) !important; font-size: 13px !important;
    margin-left: 6px !important;
}
.vt-articulo .reading-time::before{ content: "" !important; display: inline-block !important; width: 14px !important; height: 1px !important; background: var(--slate-soft) !important; }

/* HEADER (H1 + LEAD) */
.vt-articulo .post-header{ margin-bottom: 48px !important; }
.vt-articulo .post-header h1{
    font-family: var(--serif) !important;
    font-weight: 600 !important;
    font-size: clamp(38px, 6vw, 64px) !important;
    line-height: 1.02 !important;
    letter-spacing: -0.02em !important;
    color: var(--ink) !important;
    margin: 0 0 28px !important;
    text-wrap: balance !important;
}
.vt-articulo .post-header h1 em{
    font-style: italic !important;
    font-weight: 500 !important;
    color: var(--brand-2) !important;
}
.vt-articulo .post-lead{
    font-size: clamp(19px, 2vw, 22px) !important;
    line-height: 1.55 !important;
    color: var(--ink-2) !important;
    margin: 0 !important;
    text-wrap: pretty !important;
    position: relative !important;
    padding-left: 20px !important;
    font-family: var(--sans) !important;
}
.vt-articulo .post-lead::before{
    content: "" !important;
    position: absolute !important;
    left: 0 !important; top: 8px !important; bottom: 8px !important;
    width: 4px !important;
    background: linear-gradient(180deg, var(--brand), var(--brand-2)) !important;
    border-radius: 2px !important;
}

/* ÍNDICE */
.vt-articulo .toc{
    background: var(--paper) !important;
    border: 1px solid var(--line) !important;
    border-radius: 14px !important;
    padding: 30px 36px !important;
    margin: 56px auto !important;
    position: relative !important;
    overflow: hidden !important;
}
.vt-articulo .toc::before{
    content: "" !important;
    position: absolute !important; top: 0 !important; left: 0 !important; right: 0 !important; height: 4px !important;
    background: linear-gradient(90deg, var(--brand) 0%, var(--brand-2) 60%, var(--gold) 100%) !important;
}
.vt-articulo .toc-title{
    font-family: var(--sans) !important;
    font-size: 11px !important;
    font-weight: 700 !important;
    letter-spacing: .22em !important;
    text-transform: uppercase !important;
    color: var(--brand-2) !important;
    margin: 0 0 18px !important;
    display: flex !important; align-items: center !important; gap: 10px !important;
}
.vt-articulo .toc-title::after{ content: "" !important; flex: 1 !important; height: 1px !important; background: var(--line) !important; }
.vt-articulo .toc-list{ list-style: none !important; padding: 0 !important; margin: 0 !important; display: flex !important; flex-direction: column !important; }
.vt-articulo .toc-list a{
    display: flex !important; align-items: baseline !important; gap: 18px !important;
    padding: 14px 0 !important;
    border-bottom: 1px solid var(--line-soft) !important;
    color: var(--ink) !important;
    font-size: 17px !important;
    font-weight: 500 !important;
    background: none !important;
    transition: color .15s, padding .15s !important;
    font-family: var(--sans) !important;
}
.vt-articulo .toc-list li:last-child a{ border-bottom: none !important; }
.vt-articulo .toc-list a:hover{ color: var(--brand-2) !important; background: none !important; padding-left: 8px !important; }
.vt-articulo .toc-num{
    font-family: var(--serif) !important;
    font-style: italic !important;
    font-weight: 600 !important;
    color: var(--brand-2) !important;
    min-width: 36px !important;
    font-size: 22px !important;
}
.vt-articulo .post-section[id]{ scroll-margin-top: 24px !important; }

/* IMAGEN HERO */
.vt-articulo .hero-image{ margin: 48px auto !important; }
.vt-articulo .hero-image .placeholder{
    position: relative !important;
    aspect-ratio: 16/9 !important;
    border-radius: 16px !important;
    overflow: hidden !important;
    background:
        radial-gradient(circle at 22% 30%, var(--brand-2) 0%, transparent 45%),
        radial-gradient(circle at 78% 28%, var(--gold) 0%, transparent 36%),
        radial-gradient(circle at 65% 82%, var(--coral) 0%, transparent 38%),
        radial-gradient(circle at 25% 85%, var(--brand) 0%, transparent 50%),
        var(--brand) !important;
    display: flex !important; align-items: center !important; justify-content: center !important;
}
.vt-articulo .hero-image .placeholder::after{
    content: "" !important;
    position: absolute !important; inset: 0 !important;
    background: repeating-linear-gradient(0deg, rgba(255,255,255,.04) 0 1px, transparent 1px 3px) !important;
    mix-blend-mode: overlay !important;
}
.vt-articulo .hero-image .placeholder span{
    position: relative !important; z-index: 1 !important;
    font-family: ui-monospace, "SFMono-Regular", Menlo, Consolas, monospace !important;
    font-size: 13px !important;
    color: #fff !important;
    background: rgba(15,27,45,.55) !important;
    backdrop-filter: blur(6px) !important;
    padding: 12px 20px !important;
    border: 1px solid rgba(255,255,255,.18) !important;
    border-radius: 8px !important;
    letter-spacing: .02em !important;
}
.vt-articulo .hero-image figcaption{
    margin-top: 16px !important;
    font-family: var(--serif) !important;
    font-style: italic !important;
    font-size: 15px !important;
    color: var(--slate) !important;
    text-align: center !important;
}

/* SECCIONES */
.vt-articulo .post-section{ position: relative !important; }
.vt-articulo .post-section h2{
    font-family: var(--serif) !important;
    font-weight: 600 !important;
    font-size: clamp(28px, 4vw, 40px) !important;
    line-height: 1.1 !important;
    letter-spacing: -0.015em !important;
    color: var(--ink) !important;
    margin: 0 0 28px !important;
    text-wrap: balance !important;
    position: relative !important;
    padding-top: 22px !important;
}
.vt-articulo .post-section h2::before{
    content: "" !important;
    position: absolute !important;
    top: 0 !important; left: 0 !important;
    width: 64px !important; height: 5px !important;
    border-radius: 3px !important;
}
.vt-articulo .post-section--01 h2::before{ background: var(--brand) !important; }
.vt-articulo .post-section--02 h2::before{ background: var(--brand-2) !important; }
.vt-articulo .post-section--03 h2::before{ background: linear-gradient(90deg, var(--brand), var(--brand-2)) !important; width: 84px !important; }
.vt-articulo .post-section--04 h2::before{ background: var(--gold) !important; }
.vt-articulo .post-section--05 h2::before{ background: var(--coral) !important; }

.vt-articulo .post-section h3{
    font-family: var(--serif) !important;
    font-weight: 600 !important;
    font-size: 24px !important;
    line-height: 1.25 !important;
    color: var(--ink) !important;
    margin: 40px 0 16px !important;
}
.vt-articulo .post-section p{
    font-size: 18px !important;
    line-height: 1.7 !important;
    color: var(--ink-2) !important;
    margin: 0 0 22px !important;
    text-wrap: pretty !important;
    font-family: var(--sans) !important;
}
.vt-articulo .post-section p:last-child{ margin-bottom: 0 !important; }

/* PULL QUOTE */
.vt-articulo .pull-quote{
    margin: 48px auto !important;
    padding: 36px 40px !important;
    background: linear-gradient(135deg, var(--brand) 0%, var(--brand-2) 100%) !important;
    border-radius: 16px !important;
    position: relative !important;
    overflow: hidden !important;
}
.vt-articulo .pull-quote::before{
    content: "\201C" !important;
    position: absolute !important;
    top: -30px !important; right: 24px !important;
    font-family: var(--serif) !important;
    font-size: 200px !important;
    line-height: 1 !important;
    color: var(--gold) !important;
    opacity: .4 !important;
}
.vt-articulo .pull-quote p{
    font-family: var(--serif) !important;
    font-style: italic !important;
    font-weight: 500 !important;
    font-size: clamp(22px, 2.6vw, 28px) !important;
    line-height: 1.35 !important;
    color: #fff !important;
    margin: 0 !important;
    text-wrap: pretty !important;
    position: relative !important; z-index: 1 !important;
}

/* TABLA COMPARATIVA */
.vt-articulo .table-wrapper{
    margin: 36px auto !important;
    display: grid !important;
    grid-template-columns: repeat(3, 1fr) !important;
    gap: 16px !important;
}
.vt-articulo .modality-card{
    background: var(--paper) !important;
    border: 1px solid var(--line) !important;
    border-radius: 14px !important;
    padding: 24px !important;
    position: relative !important;
    overflow: hidden !important;
    transition: transform .2s, box-shadow .2s !important;
}
.vt-articulo .modality-card::before{
    content: "" !important;
    position: absolute !important; top: 0 !important; left: 0 !important; right: 0 !important; height: 4px !important;
}
.vt-articulo .modality-card--consec::before{ background: var(--brand-2) !important; }
.vt-articulo .modality-card--enlace::before{ background: var(--gold) !important; }
.vt-articulo .modality-card--simul::before{ background: var(--brand) !important; }
.vt-articulo .modality-card:hover{ transform: translateY(-2px) !important; box-shadow: 0 8px 24px rgba(15,27,45,.06) !important; }
.vt-articulo .modality-name{
    font-family: var(--serif) !important;
    font-weight: 600 !important;
    font-size: 22px !important;
    color: var(--ink) !important;
    margin: 6px 0 14px !important;
}
.vt-articulo .modality-block{
    margin-top: 14px !important;
    padding-top: 14px !important;
    border-top: 1px solid var(--line-soft) !important;
}
.vt-articulo .modality-label{
    display: block !important;
    font-size: 11px !important;
    font-weight: 700 !important;
    letter-spacing: .16em !important;
    text-transform: uppercase !important;
    color: var(--slate) !important;
    margin-bottom: 6px !important;
    font-family: var(--sans) !important;
}
.vt-articulo .modality-text{
    font-size: 15px !important;
    line-height: 1.55 !important;
    color: var(--ink-2) !important;
    font-family: var(--sans) !important;
}

/* GRID DOCUMENTOS */
.vt-articulo .docs-grid{
    display: grid !important;
    grid-template-columns: repeat(2, 1fr) !important;
    gap: 16px !important;
    margin: 36px auto !important;
}
.vt-articulo .doc-card{
    background: var(--paper) !important;
    border: 1px solid var(--line) !important;
    border-radius: 14px !important;
    padding: 24px 26px !important;
    position: relative !important;
    overflow: hidden !important;
}
.vt-articulo .doc-card::before{
    content: "" !important;
    position: absolute !important; top: 0 !important; left: 0 !important; right: 0 !important; height: 4px !important;
}
.vt-articulo .doc-card--migra::before{ background: var(--brand-2) !important; }
.vt-articulo .doc-card--estudio::before{ background: var(--gold) !important; }
.vt-articulo .doc-card--legal::before{ background: var(--brand) !important; }
.vt-articulo .doc-card--orga::before{ background: var(--coral) !important; }
.vt-articulo .doc-card h3{
    font-family: var(--serif) !important;
    font-weight: 600 !important;
    font-size: 20px !important;
    color: var(--ink) !important;
    margin: 6px 0 14px !important;
    line-height: 1.25 !important;
}
.vt-articulo .doc-card ul{
    list-style: none !important; padding: 0 !important; margin: 0 !important;
    display: flex !important; flex-direction: column !important; gap: 8px !important;
}
.vt-articulo .doc-card li{
    display: flex !important; align-items: flex-start !important; gap: 10px !important;
    font-size: 15px !important;
    line-height: 1.5 !important;
    color: var(--ink-2) !important;
    font-family: var(--sans) !important;
}
.vt-articulo .doc-card li::before{
    content: "" !important;
    flex: none !important;
    width: 5px !important; height: 5px !important;
    border-radius: 999px !important;
    background: var(--slate-soft) !important;
    margin-top: 9px !important;
}

/* LISTA NO APLICA */
.vt-articulo .no-list{
    list-style: none !important; padding: 0 !important;
    margin: 32px auto !important;
    display: flex !important; flex-direction: column !important; gap: 10px !important;
}
.vt-articulo .no-list li{
    display: flex !important; align-items: flex-start !important; gap: 14px !important;
    padding: 18px 22px !important;
    background: var(--paper) !important;
    border: 1px solid var(--line) !important;
    border-radius: 12px !important;
    font-size: 16px !important;
    line-height: 1.55 !important;
    color: var(--ink-2) !important;
    font-family: var(--sans) !important;
}
.vt-articulo .no-list-icon{
    flex: none !important;
    width: 28px !important; height: 28px !important;
    border-radius: 999px !important;
    background: #FBE0DB !important;
    color: var(--coral) !important;
    display: inline-flex !important; align-items: center !important; justify-content: center !important;
    margin-top: -2px !important;
}
.vt-articulo .no-list-icon svg{ display: block !important; }

/* LISTA CHECK */
.vt-articulo .check-list{
    list-style: none !important; padding: 0 !important;
    margin: 32px auto !important;
    display: flex !important; flex-direction: column !important; gap: 10px !important;
}
.vt-articulo .check-list li{
    display: flex !important; align-items: flex-start !important; gap: 14px !important;
    padding: 18px 22px !important;
    background: var(--paper) !important;
    border: 1px solid var(--line) !important;
    border-radius: 12px !important;
    font-size: 16px !important;
    line-height: 1.55 !important;
    color: var(--ink-2) !important;
    font-family: var(--sans) !important;
}
.vt-articulo .check-list-icon{
    flex: none !important;
    width: 28px !important; height: 28px !important;
    border-radius: 999px !important;
    background: var(--brand-soft) !important;
    color: var(--brand-2) !important;
    display: inline-flex !important; align-items: center !important; justify-content: center !important;
    margin-top: -2px !important;
}
.vt-articulo .check-list-icon svg{ display: block !important; }

/* CONTRAST GRID */
.vt-articulo .contrast-grid{
    display: grid !important;
    grid-template-columns: repeat(2, 1fr) !important;
    gap: 16px !important;
    margin: 36px auto !important;
}
.vt-articulo .contrast-card{
    padding: 28px 30px !important;
    border-radius: 14px !important;
    position: relative !important;
    overflow: hidden !important;
}
.vt-articulo .contrast-card--neg{ background: #FBE0DB !important; border: 1px solid #FFB5AB !important; }
.vt-articulo .contrast-card--pos{ background: var(--brand-soft) !important; border: 1px solid #B7CACA !important; }
.vt-articulo .contrast-eyebrow{
    display: inline-flex !important; align-items: center !important; gap: 8px !important;
    font-size: 11px !important;
    font-weight: 700 !important;
    letter-spacing: .18em !important;
    text-transform: uppercase !important;
    margin-bottom: 14px !important;
    font-family: var(--sans) !important;
}
.vt-articulo .contrast-card--neg .contrast-eyebrow{ color: var(--coral) !important; }
.vt-articulo .contrast-card--pos .contrast-eyebrow{ color: var(--brand-2) !important; }
.vt-articulo .contrast-eyebrow-icon{
    width: 22px !important; height: 22px !important;
    border-radius: 999px !important;
    display: inline-flex !important; align-items: center !important; justify-content: center !important;
    color: #fff !important;
}
.vt-articulo .contrast-card--neg .contrast-eyebrow-icon{ background: var(--coral) !important; }
.vt-articulo .contrast-card--pos .contrast-eyebrow-icon{ background: var(--brand-2) !important; }
.vt-articulo .contrast-card p{
    font-family: var(--serif) !important;
    font-size: 17px !important;
    line-height: 1.5 !important;
    color: var(--ink) !important;
    margin: 0 !important;
    font-style: italic !important;
    text-wrap: pretty !important;
}

/* PASOS NUMERADOS */
.vt-articulo .steps{
    list-style: none !important;
    padding: 0 !important;
    margin: 36px auto !important;
    display: grid !important;
    gap: 12px !important;
}
.vt-articulo .steps li{
    display: flex !important; align-items: flex-start !important; gap: 20px !important;
    padding: 22px 26px !important;
    background: var(--paper) !important;
    border: 1px solid var(--line) !important;
    border-radius: 12px !important;
    font-size: 17px !important;
    line-height: 1.5 !important;
    color: var(--ink-2) !important;
    transition: border-color .2s, transform .2s !important;
    font-family: var(--sans) !important;
}
.vt-articulo .steps li:hover{ border-color: var(--gold) !important; transform: translateX(4px) !important; }
.vt-articulo .step-num{
    flex: none !important;
    width: 40px !important; height: 40px !important;
    border-radius: 12px !important;
    font-family: var(--serif) !important;
    font-weight: 600 !important;
    font-size: 18px !important;
    display: inline-flex !important; align-items: center !important; justify-content: center !important;
    margin-top: -2px !important;
    color: #fff !important;
}
.vt-articulo .steps li:nth-child(1) .step-num{ background: var(--brand) !important; }
.vt-articulo .steps li:nth-child(2) .step-num{ background: var(--brand-2) !important; }
.vt-articulo .steps li:nth-child(3) .step-num{ background: var(--gold) !important; color: var(--ink) !important; }
.vt-articulo .steps li:nth-child(4) .step-num{ background: var(--brand-2) !important; }
.vt-articulo .steps li:nth-child(5) .step-num{ background: var(--brand) !important; }

/* CALLOUTS */
.vt-articulo .callout{
    display: flex !important; align-items: flex-start !important; gap: 18px !important;
    padding: 24px 28px !important;
    margin: 36px auto !important;
    border-radius: 14px !important;
    border: 1px solid !important;
}
.vt-articulo .callout p{
    margin: 0 !important;
    font-size: 17px !important;
    line-height: 1.55 !important;
    color: var(--ink) !important;
    text-wrap: pretty !important;
    font-weight: 500 !important;
    font-family: var(--sans) !important;
}
.vt-articulo .callout-icon{
    flex: none !important;
    width: 40px !important; height: 40px !important;
    border-radius: 12px !important;
    display: inline-flex !important; align-items: center !important; justify-content: center !important;
}
.vt-articulo .callout-icon svg{ display: block !important; }
.vt-articulo .callout--info{ background: var(--brand-soft) !important; border-color: #B7CACA !important; }
.vt-articulo .callout--info .callout-icon{ background: var(--brand-2) !important; color: #fff !important; }
.vt-articulo .callout--warn{ background: var(--coral-soft) !important; border-color: #FFB5AB !important; }
.vt-articulo .callout--warn .callout-icon{ background: var(--coral) !important; color: #fff !important; }

/* CASO REAL */
.vt-articulo .caso-real{
    margin: 36px auto !important;
    padding: 32px 36px !important;
    background: var(--ink) !important;
    border-radius: 14px !important;
    position: relative !important;
}
.vt-articulo .caso-real::before{
    content: "" !important;
    position: absolute !important; left: 0 !important; top: 24px !important; bottom: 24px !important;
    width: 4px !important;
    background: var(--gold) !important;
    border-radius: 0 4px 4px 0 !important;
}
.vt-articulo .caso-real-eyebrow{
    display: inline-block !important;
    font-size: 11px !important;
    font-weight: 700 !important;
    letter-spacing: .22em !important;
    text-transform: uppercase !important;
    color: var(--gold) !important;
    margin-bottom: 14px !important;
    font-family: var(--sans) !important;
}
.vt-articulo .caso-real p{
    margin: 0 !important;
    font-family: var(--serif) !important;
    font-size: 19px !important;
    line-height: 1.5 !important;
    color: #FFFCF7 !important;
    font-style: italic !important;
}

/* CTAs */
.vt-articulo .cta{ margin: 44px auto !important; }
.vt-articulo .cta--contacto{
    padding: 32px 36px !important;
    border-radius: 14px !important;
    border: 1px solid !important;
}
.vt-articulo .cta--whatsapp{ background: #E8F7EF !important; border-color: #B5E2C5 !important; }
.vt-articulo .cta--mail{ background: var(--brand-navy-soft) !important; border-color: #BFC8D6 !important; }
.vt-articulo .cta-title{
    font-family: var(--serif) !important;
    font-weight: 600 !important;
    font-size: 24px !important;
    line-height: 1.25 !important;
    color: var(--ink) !important;
    margin: 0 0 10px !important;
    text-wrap: balance !important;
}
.vt-articulo .cta-subtitle{
    font-size: 16px !important;
    line-height: 1.55 !important;
    color: var(--ink-2) !important;
    margin: 0 0 22px !important;
    max-width: 54ch !important;
    font-family: var(--sans) !important;
}

/* CTA BLOCK PRINCIPAL */
.vt-articulo .cta--block{
    padding: 48px 44px !important;
    background:
        radial-gradient(circle at 100% 0%, rgba(224,168,46,.35) 0%, transparent 50%),
        radial-gradient(circle at 0% 100%, rgba(255,91,73,.25) 0%, transparent 50%),
        var(--ink) !important;
    color: #fff !important;
    border-radius: 18px !important;
    position: relative !important;
    overflow: hidden !important;
}
.vt-articulo .cta--block::before{
    content: "" !important;
    position: absolute !important; top: 0 !important; left: 0 !important; right: 0 !important; height: 4px !important;
    background: linear-gradient(90deg, var(--brand-2), var(--gold), var(--coral)) !important;
}
.vt-articulo .cta--block .cta-eyebrow{
    display: inline-flex !important; align-items: center !important; gap: 10px !important;
    font-size: 11px !important;
    font-weight: 700 !important;
    letter-spacing: .22em !important;
    text-transform: uppercase !important;
    color: var(--gold) !important;
    margin-bottom: 18px !important;
    font-family: var(--sans) !important;
}
.vt-articulo .cta--block .cta-eyebrow::before{ content: "" !important; width: 24px !important; height: 2px !important; background: var(--gold) !important; }
.vt-articulo .cta--block .cta-title{
    font-size: clamp(26px, 3.4vw, 36px) !important;
    color: #fff !important;
    margin: 0 0 16px !important;
    font-weight: 600 !important;
}
.vt-articulo .cta--block .cta-subtitle{
    font-size: 17px !important;
    line-height: 1.55 !important;
    color: rgba(255,252,247,.85) !important;
    max-width: 54ch !important;
    margin: 0 0 32px !important;
}

/* BOTONES (del blog, no de tu sitio — son distintos a .btn-1/.btn-2/.btn-3) */
.vt-articulo .btn{
    display: inline-flex !important; align-items: center !important; gap: 10px !important;
    padding: 15px 28px !important;
    font-family: var(--sans) !important;
    font-size: 15px !important;
    font-weight: 600 !important;
    letter-spacing: .005em !important;
    border-radius: 999px !important;
    border: 1px solid transparent !important;
    transition: transform .15s, background .15s, color .15s, box-shadow .15s !important;
    line-height: 1 !important;
    background: none !important;
    cursor: pointer !important;
}
.vt-articulo .btn-icon{ display: inline-flex !important; align-items: center !important; justify-content: center !important; }
.vt-articulo .btn-icon svg{ display: block !important; }
.vt-articulo .btn--whatsapp{ background: var(--green-wa) !important; color: #fff !important; }
.vt-articulo .btn--whatsapp:hover{ background: #178343 !important; transform: translateY(-1px) !important; box-shadow: 0 6px 16px rgba(31,168,85,.3) !important; color: #fff !important; }
.vt-articulo .btn--plum{ background: var(--brand) !important; color: #fff !important; }
.vt-articulo .btn--plum:hover{ background: #0F1825 !important; transform: translateY(-1px) !important; box-shadow: 0 6px 16px rgba(27,38,59,.3) !important; color: #fff !important; }
.vt-articulo .btn--coral{ background: var(--coral) !important; color: #fff !important; }
.vt-articulo .btn--coral:hover{ background: #E84B3A !important; transform: translateY(-1px) !important; box-shadow: 0 8px 20px rgba(255,91,73,.35) !important; color: #fff !important; }
.vt-articulo .btn--lg{ padding: 18px 34px !important; font-size: 16px !important; }

/* INTERLINKS */
.vt-articulo .interlink{ margin: 56px auto !important; }
.vt-articulo .interlink-eyebrow{
    display: inline-flex !important; align-items: center !important; gap: 10px !important;
    font-size: 11px !important;
    font-weight: 700 !important;
    letter-spacing: .22em !important;
    text-transform: uppercase !important;
    color: var(--brand-2) !important;
    margin-bottom: 14px !important;
    font-family: var(--sans) !important;
}
.vt-articulo .interlink-eyebrow::before{ content: "" !important; width: 20px !important; height: 2px !important; background: var(--brand-2) !important; }
.vt-articulo .interlink--final .interlink-eyebrow{ color: var(--brand) !important; }
.vt-articulo .interlink--final .interlink-eyebrow::before{ background: var(--brand) !important; }
.vt-articulo .interlink-card{
    display: flex !important; align-items: center !important; justify-content: space-between !important; gap: 24px !important;
    padding: 26px 30px !important;
    background: var(--paper) !important;
    border: 1px solid var(--line) !important;
    border-radius: 14px !important;
    color: var(--ink) !important;
    background-image: none !important;
    transition: border-color .2s, transform .2s, box-shadow .2s !important;
    position: relative !important;
    overflow: hidden !important;
}
.vt-articulo .interlink-card::before{
    content: "" !important;
    position: absolute !important; left: 0 !important; top: 0 !important; bottom: 0 !important; width: 4px !important;
    background: var(--brand-2) !important;
    transform: scaleY(0) !important; transform-origin: top !important;
    transition: transform .25s !important;
}
.vt-articulo .interlink--final .interlink-card::before{ background: var(--brand) !important; }
.vt-articulo .interlink-card:hover{ transform: translateY(-2px) !important; box-shadow: 0 10px 28px rgba(15,27,45,.08) !important; border-color: transparent !important; }
.vt-articulo .interlink-card:hover::before{ transform: scaleY(1) !important; }
.vt-articulo .interlink-card:hover .interlink-arrow{ transform: translateX(6px) !important; }
.vt-articulo .interlink-title{
    font-family: var(--serif) !important;
    font-weight: 600 !important;
    font-size: 21px !important;
    line-height: 1.3 !important;
    color: var(--ink) !important;
    margin: 0 !important;
    text-wrap: balance !important;
    flex: 1 !important;
}
.vt-articulo .interlink-arrow{
    flex: none !important;
    width: 44px !important; height: 44px !important;
    border-radius: 999px !important;
    background: var(--brand-soft) !important;
    color: var(--brand-2) !important;
    display: inline-flex !important; align-items: center !important; justify-content: center !important;
    transition: transform .2s, background .2s !important;
}
.vt-articulo .interlink--final .interlink-arrow{ background: var(--brand-navy-soft) !important; color: var(--brand) !important; }
.vt-articulo .interlink-arrow svg{ display: block !important; }

/* AUTORA */
.vt-articulo .author-bio{
    display: flex !important; align-items: center !important; gap: 20px !important;
    margin: 80px auto 0 !important;
    padding: 28px !important;
    background: var(--paper) !important;
    border: 1px solid var(--line) !important;
    border-radius: 14px !important;
}
.vt-articulo .author-avatar{
    flex: none !important;
    width: 72px !important; height: 72px !important;
    border-radius: 999px !important;
    background: linear-gradient(135deg, var(--brand), var(--brand-2)) !important;
    color: #fff !important;
    font-family: var(--serif) !important;
    font-weight: 600 !important;
    font-size: 24px !important;
    letter-spacing: .04em !important;
    display: inline-flex !important; align-items: center !important; justify-content: center !important;
}
.vt-articulo .author-info p{ margin: 0 !important; line-height: 1.4 !important; font-family: var(--sans) !important; }
.vt-articulo .author-name{
    font-family: var(--serif) !important;
    font-size: 20px !important;
    font-weight: 600 !important;
    color: var(--ink) !important;
}
.vt-articulo .author-role{
    font-size: 14px !important;
    color: var(--slate) !important;
    margin-top: 4px !important;
}
.vt-articulo .author-site{
    font-size: 14px !important;
    margin-top: 6px !important;
}
.vt-articulo .author-site a{ color: var(--brand-2) !important; background: none !important; }
.vt-articulo .author-site a:hover{ color: var(--brand) !important; background: none !important; }

/* RESPONSIVE — solo dentro del artículo */
@media (max-width: 760px){
    .vt-articulo .post{ padding: 36px 18px 36px !important; }
    .vt-articulo .toc{ padding: 24px 22px !important; }
    .vt-articulo .cta--contacto{ padding: 24px !important; }
    .vt-articulo .cta--block{ padding: 32px 24px !important; }
    .vt-articulo .caso-real{ padding: 26px 24px !important; }
    .vt-articulo .pull-quote{ padding: 28px 26px !important; }
    .vt-articulo .pull-quote::before{ font-size: 140px !important; top: -20px !important; right: 14px !important; }
    .vt-articulo .interlink-card{ flex-direction: column !important; align-items: flex-start !important; padding: 22px !important; }
    .vt-articulo .table-wrapper{ grid-template-columns: 1fr !important; }
    .vt-articulo .docs-grid{ grid-template-columns: 1fr !important; }
    .vt-articulo .contrast-grid{ grid-template-columns: 1fr !important; }
    .vt-articulo .author-bio{ flex-direction: column !important; text-align: center !important; padding: 28px 22px !important; }
    .vt-articulo .post-section h2{ font-size: 30px !important; }
}
