/* Yujju design system — secciones de páginas Elementor (Home 3180, Negocio, FAQ, Contacto…).
   Títulos en Playfair, eyebrows en label pequeño, tarjetas planas y ritmo vertical común.
   Solo afecta al contenido de página (data-elementor-type="wp-page"), no a header/footer.
   Elementor fija fuente y sombra por elemento, por eso esas propiedades llevan !important. */

.yj-ds .elementor[data-elementor-type="wp-page"] {
    --yj-page: var(--yj-white);
}

/* ── Bandas a sangre ──────────────────────────────────────────────────────────
   En la plantilla por defecto el tema envuelve el contenido en .main-page.col-xs-12
   (15px de padding): las bandas blush/ink de Contacto o Sobre nosotros quedaban con
   un margen blanco a los lados. Las páginas con secciones yj-* ya traen su propio
   padding lateral, así que el envoltorio se anula solo para ellas. */
.yj-ds .container-fluid.inner > .row > .main-page:has(> .site-main > .elementor[data-elementor-type="wp-page"] > .yj-section) {
    padding-inline: 0;
}

/* ── Bandas vacías ────────────────────────────────────────────────────────────
   Qué eran: secciones clásicas (.elementor-top-section) de ~81 px, fondo blush y
   padding 40/40, con una columna sin ningún widget. Se usaban como separadores
   entre bloques y dejaban franjas rosadas sin contenido. Se colapsan solo si no
   tienen widgets ni imagen de fondo; el ritmo lo da --yj-section-y.
   Sin soporte de :has() (navegadores antiguos) simplemente se siguen viendo. */
.yj-ds .elementor[data-elementor-type="wp-page"] > .elementor-top-section:not(:has(.elementor-widget)):not(:has(.elementor-background-video-container)):not(:has(.elementor-background-slideshow)),
.yj-ds .elementor[data-elementor-type="wp-page"] > .e-con.e-parent:not(:has(.elementor-widget)):not(:has(.elementor-background-video-container)) {
    display: none;
}

/* ── Títulos ──────────────────────────────────────────────────────────────── */
.yj-ds .elementor[data-elementor-type="wp-page"] .elementor-widget-heading .elementor-heading-title {
    font-family: var(--yj-font-display) !important;
    font-weight: 500 !important;
    letter-spacing: -0.01em !important;
    line-height: var(--yj-leading-tight) !important;
    text-transform: none !important;
}

/* Párrafos, negritas o spans dentro del título heredan la familia y el peso del título */
.yj-ds .elementor[data-elementor-type="wp-page"] .elementor-heading-title * {
    font-family: inherit !important;
    font-weight: inherit !important;
    font-size: inherit !important;
    color: inherit;
    margin: 0;
}

.yj-ds .elementor[data-elementor-type="wp-page"] h2.elementor-heading-title,
.yj-ds .elementor[data-elementor-type="wp-page"] h1.elementor-heading-title {
    font-size: var(--yj-h2) !important;
}

.yj-ds .elementor[data-elementor-type="wp-page"] h3.elementor-heading-title {
    font-size: var(--yj-h3) !important;
}

/* Eyebrow: texto corto de ancho automático sobre un título (p. ej. «¿CÓMO FUNCIONA?») */
.yj-ds .elementor[data-elementor-type="wp-page"] .elementor-widget-text-editor.elementor-widget__width-auto {
    border-bottom: 0 !important;
    padding-bottom: 0 !important;
    margin-bottom: var(--yj-space-3) !important;
}

.yj-ds .elementor[data-elementor-type="wp-page"] .elementor-widget-text-editor.elementor-widget__width-auto,
.yj-ds .elementor[data-elementor-type="wp-page"] .elementor-widget-text-editor.elementor-widget__width-auto p {
    font-family: var(--yj-font-body) !important;
    font-size: var(--yj-text-xs) !important;
    font-weight: 600 !important;
    letter-spacing: var(--yj-tracking-caps) !important;
    text-transform: uppercase !important;
    line-height: 1.4 !important;
    color: var(--yj-primary) !important;
    margin: 0;
}

/* Cuerpo de texto */
.yj-ds .elementor[data-elementor-type="wp-page"] .elementor-widget-text-editor:not(.elementor-widget__width-auto) {
    font-family: var(--yj-font-body) !important;
    color: var(--yj-text);
}

/* ── Tarjetas ─────────────────────────────────────────────────────────────── */
/* Sin sombra en ningún contenedor hijo; las sombras de Elementor van por elemento. */
.yj-ds .elementor[data-elementor-type="wp-page"] .e-con.e-child,
.yj-ds .elementor[data-elementor-type="wp-page"] .elementor-widget-icon-box > .elementor-widget-container {
    box-shadow: none !important;
}

/* Tarjeta = contenedor hijo que trae icon-box, o que contiene solo botones */
.yj-ds .elementor[data-elementor-type="wp-page"] .e-con.e-child:not(.yj-section *):has(> .elementor-widget-icon-box),
.yj-ds .elementor[data-elementor-type="wp-page"] .e-con.e-child.e-transform:has(.elementor-widget-icon-box) {
    background: var(--yj-white) !important;
    border: var(--yj-border) !important;
    border-radius: var(--yj-radius) !important;
    transform: none !important;
    transition: border-color var(--yj-transition);
}

.yj-ds .elementor[data-elementor-type="wp-page"] .e-con.e-child:not(.yj-section *):has(> .elementor-widget-icon-box):hover,
.yj-ds .elementor[data-elementor-type="wp-page"] .e-con.e-child.e-transform:has(.elementor-widget-icon-box):hover {
    border-color: var(--yj-line-strong) !important;
}

.yj-ds .elementor[data-elementor-type="wp-page"] .elementor-widget-icon-box .elementor-icon-box-title,
.yj-ds .elementor[data-elementor-type="wp-page"] .elementor-widget-icon-box .elementor-icon-box-title a {
    font-family: var(--yj-font-display) !important;
    font-weight: 500 !important;
    font-size: var(--yj-h4) !important;
    color: var(--yj-ink) !important;
    text-transform: none !important;
}

.yj-ds .elementor[data-elementor-type="wp-page"] .elementor-widget-icon-box .elementor-icon-box-description {
    font-family: var(--yj-font-body) !important;
    font-size: var(--yj-text-sm) !important;
    line-height: var(--yj-leading) !important;
    color: var(--yj-muted) !important;
}

.yj-ds .elementor[data-elementor-type="wp-page"] .elementor-widget-icon-box .elementor-icon {
    color: var(--yj-primary) !important;
    fill: var(--yj-primary) !important;
}

/* ── Banners de colección (lindo_banner) ───────────────────────────────────── */
.yj-ds .elementor[data-elementor-type="wp-page"] .elementor-widget-lindo_banner .sub-title {
    font-family: var(--yj-font-body) !important;
    font-size: var(--yj-text-xs) !important;
    font-weight: 600 !important;
    letter-spacing: var(--yj-tracking-caps) !important;
    line-height: 1.5 !important;
}

.yj-ds .elementor[data-elementor-type="wp-page"] .elementor-widget-lindo_banner .title1 {
    font-family: var(--yj-font-display) !important;
    font-weight: 500 !important;
}

.yj-ds .elementor[data-elementor-type="wp-page"] .elementor-widget-lindo_banner .widget-banner {
    border-radius: var(--yj-radius);
    overflow: hidden;
}

/* Subtítulo pegado a un título: respiro de un paso */
.yj-ds .elementor[data-elementor-type="wp-page"] > .e-con.e-parent:has(h2.elementor-heading-title) + .e-con.e-parent:has(> .e-con-inner > .elementor-widget-text-editor:only-child) {
    padding-top: var(--yj-space-3) !important;
    padding-bottom: var(--yj-space-5) !important;
}

/* Home: columna de texto junto a la foto («Más de 9 años impulsando negocios»):
   su párrafo atómico está oculto, así que se centra en vertical para no dejar un hueco abajo. */
.yj-ds .elementor-3180 .elementor-element-a6ed994 .elementor-element-dc71d55 {
    justify-content: center !important;
    gap: var(--yj-space-5);
}

/* ── Grupos de CTA ─────────────────────────────────────────────────────────
   Contenedores cuyos únicos widgets visibles son botones (Home: «Crear cuenta mayorista /
   semi-mayorista», «Quiero comenzar / Quiero mayoreo»; en las segundas, las tarjetas solo
   tenían un botón porque sus textos atómicos están ocultos). Sin aspecto de tarjeta y
   los botones agrupados al centro, a ancho natural. */
.yj-ds .elementor[data-elementor-type="wp-page"] .e-con.e-child:not(.yj-section *):has(.elementor-widget-button):not(:has(.elementor-widget:not(.elementor-widget-button):not(.elementor-widget-e-heading):not(.elementor-widget-e-paragraph))) {
    background: transparent !important;
    border: 0 !important;
    box-shadow: none !important;
    min-height: 0 !important;
    padding: 0 !important;
}

.yj-ds .elementor[data-elementor-type="wp-page"] .e-con.e-parent > .e-con-inner:has(.elementor-widget-button):not(:has(.elementor-widget:not(.elementor-widget-button):not(.elementor-widget-e-heading):not(.elementor-widget-e-paragraph))),
.yj-ds .elementor[data-elementor-type="wp-page"] .e-con.e-child:not(.yj-section *):has(.elementor-widget-button):not(:has(.elementor-widget:not(.elementor-widget-button):not(.elementor-widget-e-heading):not(.elementor-widget-e-paragraph))) {
    flex-direction: row !important;
    flex-wrap: wrap !important;
    justify-content: center !important;
    align-items: center !important;
    gap: var(--yj-space-4) !important;
}

.yj-ds .elementor[data-elementor-type="wp-page"] .e-con.e-parent > .e-con-inner:has(.elementor-widget-button):not(:has(.elementor-widget:not(.elementor-widget-button):not(.elementor-widget-e-heading):not(.elementor-widget-e-paragraph))) > .e-con.e-child,
.yj-ds .elementor[data-elementor-type="wp-page"] .e-con.e-child:not(.yj-section *):has(.elementor-widget-button):not(:has(.elementor-widget:not(.elementor-widget-button):not(.elementor-widget-e-heading):not(.elementor-widget-e-paragraph))) > .e-con.e-child {
    width: auto !important;
    max-width: 100%;
    flex: 0 0 auto !important;
    --width: auto;
    margin: 0 !important;
}

.yj-ds .elementor[data-elementor-type="wp-page"] .e-con:has(.elementor-widget-button):not(:has(.elementor-widget:not(.elementor-widget-button):not(.elementor-widget-e-heading):not(.elementor-widget-e-paragraph))) .elementor-widget-button {
    width: auto;
    margin: 0 !important;
}

/* ── Ritmo vertical ────────────────────────────────────────────────────────── */
/* Bloques con fondo de color: padding de sección uniforme */
.yj-ds .elementor[data-elementor-type="wp-page"] > .e-con.e-parent:not(:first-child):not(.yj-section) {
    --padding-top: 0px;
    --padding-bottom: 0px;
}

.yj-ds .elementor[data-elementor-type="wp-page"] > .e-con.e-parent:has(h1.elementor-heading-title, h2.elementor-heading-title):not(:first-child):not(.yj-hero):not(.yj-section) {
    padding-top: var(--yj-section-y) !important;
}

/* Fila de botones que cierra una sección: separación de un paso grande, no de sección entera */
.yj-ds .elementor[data-elementor-type="wp-page"] > .e-con.e-parent:not(.yj-section):has(.elementor-widget-button):not(:has(.elementor-widget:not(.elementor-widget-button):not(.elementor-widget-e-heading):not(.elementor-widget-e-paragraph))) {
    padding-top: var(--yj-space-6) !important;
    padding-bottom: 0 !important;
}

/* ── Hero (Revolution Slider): solo armonizar botones ─────────────────────── */
.yj-ds .elementor-widget-lindo_revslider rs-layer.rev-btn,
.yj-ds .elementor-widget-lindo_revslider .rev-btn {
    border-radius: var(--yj-radius) !important;
    font-family: var(--yj-font-body) !important;
    letter-spacing: var(--yj-tracking-caps) !important;
}

/* ── Móvil ─────────────────────────────────────────────────────────────────── */
@media (max-width: 767px) {
    .yj-ds .elementor[data-elementor-type="wp-page"] .e-con.e-parent > .e-con-inner:has(.elementor-widget-button):not(:has(.elementor-widget:not(.elementor-widget-button):not(.elementor-widget-e-heading):not(.elementor-widget-e-paragraph))) {
        flex-direction: column !important;
        align-items: stretch !important;
    }

    .yj-ds .elementor[data-elementor-type="wp-page"] .e-con.e-parent > .e-con-inner:has(.elementor-widget-button):not(:has(.elementor-widget:not(.elementor-widget-button):not(.elementor-widget-e-heading):not(.elementor-widget-e-paragraph))) .e-con.e-child,
    .yj-ds .elementor[data-elementor-type="wp-page"] .e-con.e-parent > .e-con-inner:has(.elementor-widget-button):not(:has(.elementor-widget:not(.elementor-widget-button):not(.elementor-widget-e-heading):not(.elementor-widget-e-paragraph))) .elementor-button {
        width: 100% !important;
    }
}
