/* Inercia Valor — mejoras de UX/UI (6 oct 2026).
   Hoja aparte, cargada después de layout.css: para revertir basta quitar su <link> en layouts/master.blade.php. */

/* Texto gris con contraste suficiente (#818181 sobre #f5f5f5 daba ~3,5:1; #5c5c5c da ~6,1:1) */
:root {
    --gc-txt: #5c5c5c;
}

/* Interlineado legible en el texto corrido (el body trae line-height:1) */
p,
.b_bi1-txt li {
    line-height: 1.55;
}

/* Sin justificado: dejaba «ríos» de espacio en blanco */
.b_i7_blq-txt p,
.b_bi1-txt p,
.b_exp1_b p,
.b_cnt3_pgscu-r {
    text-align: left;
}

/* Imágenes del contenido de los artículos: nunca más anchas que la pantalla (desbordaban en móvil) */
.b_bi1-txt img {
    max-width: 100%;
    height: auto;
}

/* Foco visible al navegar con teclado (el tema lo quitaba en todo el sitio) */
a:focus-visible,
button:focus-visible,
input:focus-visible,
textarea:focus-visible,
select:focus-visible,
[role="button"]:focus-visible {
    outline: 2px solid #2b4a8b !important;
    outline-offset: 2px;
}

/* Formulario de contacto: campos táctiles de 44 px, placeholder distinguible y casilla clicable */
.b_cnt1-b input:not([type="checkbox"]):not([type="hidden"]) {
    height: 44px;
}

.b_cnt1-b textarea {
    min-height: 120px;
}

.b_cnt1-b input::placeholder,
.b_cnt1-b textarea::placeholder {
    color: #767676;
    opacity: 1;
}

.b_cnt1-chkb {
    width: 100%;
    min-height: 44px;
    height: auto;
}

.b_cnt1-b .b_cnt1-chkb input {
    width: 22px;
    height: 22px;
    flex: 0 0 22px;
}

.b_cnt1-b .b_cnt1-chkb label {
    margin: 0;
    color: var(--go-txt);
    font-size: 14px;
    line-height: 1.4;
    cursor: pointer;
}

.b_cnt1-b .b_cnt1-chkb label a {
    color: inherit;
    text-decoration: underline;
}

.ux-recaptcha-legal {
    width: 100%;
    margin: 4px 0 0;
    font-size: 12px;
    color: #767676;
}

.ux-recaptcha-legal a {
    color: inherit;
    text-decoration: underline;
}

/* El sello flotante de reCAPTCHA tapaba enlaces; Google permite ocultarlo si se muestra el aviso legal (arriba) */
.grecaptcha-badge {
    visibility: hidden;
}

/* Artículo: el antiguo bloque de formulario es ahora una llamada a la acción */
.ux-bi2-cta {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 16px;
}

.ux-bi2-cta p {
    margin: 0;
}

.ux-bi2-cta .b_bi2-env {
    text-decoration: none;
}

/* Botón de WhatsApp: el mismo de sectorial.co (mu-plugin sectorial-whatsapp-flotante.php).
   Sustituye al antiguo .btn_wspp, que flotaba a media pantalla y en móvil tapaba texto. */
a.iv-wa {
    position: fixed;
    bottom: 24px;
    right: 24px;
    z-index: 9999;
    background: #25D366;
    color: #fff !important;
    border-radius: 50px;
    padding: 13px 20px;
    display: flex;
    align-items: center;
    gap: 9px;
    text-decoration: none;
    font-family: var(--b-fnte, "Barlow", sans-serif);
    font-size: 14px;
    font-weight: 600;
    line-height: 1;
    box-shadow: 0 4px 18px rgba(37, 211, 102, .45);
    transition: transform .2s, box-shadow .2s;
}

a.iv-wa:hover {
    transform: translateY(-2px);
    box-shadow: 0 6px 24px rgba(37, 211, 102, .55);
    color: #fff !important;
    text-decoration: none;
}

a.iv-wa svg {
    width: 23px;
    height: 23px;
    flex-shrink: 0;
}

/* En móvil, solo el icono: el texto ocupaba media pantalla y competía con el contenido */
@media (max-width: 600px) {
    a.iv-wa span {
        display: none;
    }

    a.iv-wa {
        padding: 13px;
        border-radius: 50%;
        bottom: 16px;
        right: 16px;
    }
}

@media (prefers-reduced-motion: reduce) {
    a.iv-wa {
        transition: none;
    }

    a.iv-wa:hover {
        transform: none;
    }
}

@media (max-width: 768px) {
    .b_cnt1-b input:not([type="checkbox"]):not([type="hidden"]) {
        width: 100%;
    }
}

/* Home: menos aire (6 oct 2026). La página medía 4.219 px a 1745 de ancho y queda en ~3.690.
   - Las tres tarjetas de servicios medían lo que la más larga (Fusiones y adquisiciones, ~20 líneas):
     el texto se recorta a 8 líneas; la tarjeta entera enlaza al servicio, donde está completo.
   - Los rellenos de 100 px por arriba y por abajo se sumaban entre secciones (170-190 px vacíos).
   - Antes del pie había ~350 px: margen del blog + 250 px reservados para la curva del pie (le bastan 170). */
.b_i3 {
    padding-top: 40px;
}

.b_i3_blq p {
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 8;
    line-clamp: 8;
    overflow: hidden;
}

.b_i4 {
    padding: 50px 0 40px;
}

.b_i4 .container {
    padding-top: 30px;
}

.b_i6 {
    margin-bottom: 40px;
}

.b_i7 {
    margin: 40px 0 0;
}

.footer .container_sd {
    padding-top: 170px;
    min-height: 0;
}

/* Pie en escritorio (≥1200 px usa img/bg_footer1.png, 1282×571): la imagen trae ~140 px transparentes encima
   de la curva azul, donde solo está el aro decorativo (los 128 px de la derecha). En vez de recortar la imagen
   (cortaba el aro), el pie entero sube 100 px y esa franja transparente se monta sobre el blanco del final de
   la sección anterior. La franja no captura clics (pointer-events), así que los enlaces que queden debajo
   siguen funcionando. Por debajo de 1200 px se usa otra imagen (img/footer.jpg) y no se toca. */
@media (min-width: 1200px) {
    .footer {
        margin-top: -100px;
        pointer-events: none;
    }

    .footer .container_sd > * {
        pointer-events: auto;
    }

    /* «Quiénes somos» terminaba a 16 px del pie: sin este aire, el aro pisaba el final de dos párrafos */
    .b_qsms1 {
        padding-bottom: 110px;
    }
}

/* ---------- /contacto (6 oct 2026) ---------- */

/* Nombre a todo el ancho y Email + Teléfono juntos. La regla original (input:nth-child(1)) nunca se aplicaba:
   el primer hijo del formulario es el campo oculto _token. */
#formContact #name {
    width: 100%;
}

/* Servicio de interés (columna subject, que existía y el formulario no usaba) */
.b_cnt1-b select {
    width: 100%;
    height: 44px;
    margin: 0 0 10px 0;
    border: 1px solid var(--gc-bg);
    font-family: inherit;
    font-size: 16px;
    padding: 0 10px;
    background: #fff;
    color: #000;
}

.b_cnt1-b select:has(option[value=""]:checked) {
    color: #767676;
}

/* Errores visibles */
.b_cnt1-b .not-valid:not([type="checkbox"]) {
    border-color: #9a0404 !important;
}

.b_cnt1-chkb input.not-valid {
    outline: 2px solid #9a0404;
    outline-offset: 2px;
}

.b_cnt1-chkb input.not-valid + label {
    color: #9a0404;
}

.ux-form-errores {
    width: 100%;
    margin: 6px 0 4px;
    padding: 10px 14px;
    border-left: 4px solid #9a0404;
    background: #fdf1f1;
    color: #6b0303;
    font-size: 14px;
    line-height: 1.5;
}

.ux-form-errores ul {
    margin: 4px 0 0;
    padding-left: 18px;
}

.ux-recaptcha-legal {
    font-size: 13px;
}

/* Botón de envío: 44 px de alto mínimo (medía 38) */
.b_cnt1-btnenv {
    min-height: 44px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
}

/* Título del banner de las páginas interiores, ahora <h1> (mismos estilos que tenía el <h2>) */
.bnnr_ppal h1 {
    width: 100%;
    margin: 0;
    text-align: center;
    color: var(--b-txt);
    font-size: 40px;
    font-weight: 400;
    line-height: 1;
    z-index: 2;
}

@media (min-width: 1200px) {
    .bnnr_ppal h1 {
        font-size: 52px;
    }
}

/* Móvil: banner más bajo para que el formulario de contacto no empiece a ~500 px */
@media (max-width: 767px) {
    .bnnr_ppal .container {
        height: 140px;
    }
}