/* ============================================================
   Lirotweb — ajustes propios sobre el theme
   Este archivo se carga DESPUÉS de main.css para sobrescribirlo.
   No editar main.css: al actualizar el theme se perderían los cambios.
   ============================================================ */

/* --- Tipografía en español ---------------------------------
   El theme aplica text-transform: capitalize, que en inglés es
   correcto para títulos pero en español pone en mayúscula las
   preposiciones ("Agente De IA Para WhatsApp"). Se respeta el
   texto tal como está escrito en el HTML.
   ----------------------------------------------------------- */

/* Menú de escritorio */
.tgmenu__navbar-wrap ul li a,
.tgmenu__navbar-wrap ul li .sub-menu li a,
/* Menú móvil */
.tgmobile__menu .navigation li > a,
.tgmobile__menu .navigation ul li ul li > a,
/* Migas de pan */
.breadcrumb__content .breadcrumb span,
.breadcrumb__content .breadcrumb a,
/* Antetítulos de sección */
.section__title .sub-title,
.slider__content .sub-title,
.slider__content-two .sub-title,
.banner__content .sub-title {
    text-transform: none;
}

/* --- Calculadora de respuesta en WhatsApp -------------------
   Las reglas van prefijadas con #liro-seo-section porque el theme
   define ese id con especificidad alta (incluido "#liro-seo-section *").
   ----------------------------------------------------------- */

#liro-seo-section .lw-calc-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 16px 18px;
    margin: 26px 0 18px;
}
#liro-seo-section .lw-calc-field label {
    color: rgba(255,255,255,.85);
    display: block;
    font-size: 13px;
    line-height: 1.4;
    margin-bottom: 7px;
    opacity: .85;
}
#liro-seo-section .lw-calc-field label span { opacity: .6; }
#liro-seo-section .lw-calc-field .ls-input-box { width: 100%; }
#liro-seo-section .lw-calc-field input {
    color: #fff;
    width: 100%;
    background: transparent;
    border: none;
    outline: none;
    font-size: 15px;
}
/* Oculta las flechas del input numérico */
#liro-seo-section .lw-calc-field input::-webkit-outer-spin-button,
#liro-seo-section .lw-calc-field input::-webkit-inner-spin-button { -webkit-appearance: none; margin: 0; }
#liro-seo-section .lw-calc-field input[type=number] { -moz-appearance: textfield; }

#liro-seo-section .lw-calc-actions { margin-bottom: 6px; }
/* El botón mantiene el tamaño estándar del theme, no se estira */
#liro-seo-section .lw-calc-actions { justify-content: flex-start; }

#liro-seo-section .lw-calc-hero {
    text-align: center;
    padding: 22px 10px 18px;
}
#liro-seo-section .lw-calc-hero-label {
    color: rgba(255,255,255,.65);
    display: block;
    font-size: 12px;
    letter-spacing: .06em;
    text-transform: uppercase;
    opacity: .65;
    margin-bottom: 6px;
}
#liro-seo-section .lw-calc-hero-num {
    color: #fff;
    display: block;
    font-size: 40px;
    font-weight: 800;
    line-height: 1.1;
}
#liro-seo-section .lw-calc-hero-sub {
    color: rgba(255,255,255,.75);
    display: block;
    font-size: 13px;
    opacity: .7;
    margin-top: 6px;
}
#liro-seo-section .ls-bar-fill { transition: width .8s ease; }

@media (max-width: 575px) {
    #liro-seo-section .lw-calc-grid { grid-template-columns: 1fr; }
    #liro-seo-section .lw-calc-hero-num { font-size: 32px; }
}

/* Botón de la calculadora: forma y tamaño del theme (tg-btn white-btn)
   pero con el morado de la sección en lugar del fondo blanco. */
#liro-seo-section .lw-calc-btn,
#liro-seo-section .lw-calc-btn:hover,
#liro-seo-section .lw-calc-btn:focus {
    background: linear-gradient(135deg, #7C3AFF 0%, #4F1FCC 100%);
    color: #fff;
    padding: 15px 26px 17px;
    display: inline-flex;
    align-items: center;
}
#liro-seo-section .lw-calc-btn svg {
    stroke: currentColor;
    margin-right: 8px;
}

/* Resalta durante 2s la pregunta a la que se llega por enlace */
.faq-card.faq-destacada {
    box-shadow: 0 0 0 2px #7C3AFF;
    transition: box-shadow .3s ease;
}