/* =========================================
   ESTILOS ESPECÍFICOS PARA CITA DE SERVICIO
   Prefijo: .cita-servicio-*
   ========================================= */

/* Título Principal */
.cita-servicio-main-title {
    margin-bottom: 2rem;
    padding-left: 0;
    max-width: 100%;
}

.cita-servicio-title-h1 {
    font-size: 63px;
    font-weight: 700;
    color: #000;
    margin-bottom: 1.5rem;
    font-family: var(--font-primary);
    letter-spacing: -0.02em;
    line-height: 1.2;
}

.cita-servicio-intro-text {
    font-size: 16px;
    color: #333;
    line-height: 1.7;
    margin: 0;
    font-weight: 400;
}

/* Subtítulo */
.cita-servicio-subtitle-section {
    margin-bottom: 2rem;
}

.cita-servicio-subtitle-h2 {
    font-size: 36px;
    font-weight: 700;
    color: #000;
    margin: 0;
}

/* Form Section */
.cita-servicio-form-section {
    background-color: #fff;
    padding: 60px 0;
}

    .cita-servicio-form-section .container {
        max-width: 1200px;
    }

    /* Alineación: título y párrafo más a la izquierda */
    .cita-servicio-form-section .form-box-wrap {
        padding-left: 0;
    }

.cita-servicio-main-title {
    padding-left: 0;
    max-width: 100%;
    margin-left: 0;
}

.cita-servicio-subtitle-section {
    padding-left: 0;
    max-width: 100%;
    margin-top: 2.5rem;
}

/* A partir de los pasos, el contenido tiene el padding normal del container */
.cita-servicio-steps-nav {
    margin-left: 0;
    padding-left: 0;
}

/* Navegación de Pasos */
.cita-servicio-steps-nav {
    display: flex;
    gap: 2rem;
    margin-bottom: 3rem;
    border-bottom: 2px solid #e0e0e0;
    padding-bottom: 1rem;
}

.cita-servicio-step {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    cursor: pointer;
    padding: 0.5rem 0;
    color: #999;
    font-weight: 400;
    transition: color 0.3s ease;
    position: relative;
}

    .cita-servicio-step.active {
        color: #000;
        font-weight: 700;
    }

        .cita-servicio-step.active::after {
            content: '';
            position: absolute;
            bottom: -1rem;
            left: 0;
            right: 0;
            height: 2px;
            background-color: var(--mitsubishi-red);
        }

    .cita-servicio-step .step-number {
        font-weight: 700;
    }

    .cita-servicio-step .step-text {
        font-size: 18px;
        text-transform: uppercase;
        letter-spacing: 0.5px;
    }

/* Form Steps */
.cita-servicio-form-step {
    display: none;
}

    .cita-servicio-form-step.active {
        display: block;
    }

/* Floating Label Input Groups */
.form-input.floating-label {
    position: relative;
    margin-bottom: 26px;
    background: transparent;
}

.floating-input {
    width: 100%;
    padding: 8px 0;
    border: none;
    border-bottom: 1px solid #cfcfcf !important;
    border-radius: 0;
    font-size: 16px;
    background-color: #fff !important;
    transition: all 0.3s ease;
    font-family: var(--font-primary);
    outline: none;
    text-shadow: none;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    color: #222;
}

    .floating-input:focus {
        border-bottom-color: var(--mitsubishi-red) !important;
        border-bottom-width: 2px;
    }

        /* Highlight solo visible en focus, NO en error */
        .floating-input:focus + .highlight {
            width: 100%;
        }

    /* Fondo blanco: anular autofill del navegador (evita gris/azul al escribir) */
    .floating-input:-webkit-autofill,
    .floating-input:-webkit-autofill:hover,
    .floating-input:-webkit-autofill:focus,
    .floating-input:-webkit-autofill:active {
        -webkit-box-shadow: 0 0 0 30px #fff inset !important;
        box-shadow: 0 0 0 30px #fff inset !important;
        background-color: #fff !important;
    }

/* Highlight para select (debe estar después del selectarrow) */
.floating-select:focus ~ .selectarrow ~ .highlight,
.floating-select:focus ~ .highlight {
    width: 100%;
}

/* Highlight (subrayado animado) - Solo para elementos dentro de formularios */
.form-input .highlight,
.form-section .highlight:not(.car-links-inline a),
.cita-servicio-form-section .highlight:not(.car-links-inline a) {
    position: absolute;
    bottom: 0;
    left: 0;
    height: 2px;
    width: 0;
    background-color: var(--mitsubishi-red);
    transition: width 0.3s ease;
}

/* Excepción: los links del megamenu con clase highlight NO deben tener position absolute */
.megamenu-card .car-links-inline a.highlight,
.car-links-inline a.highlight {
    position: static !important;
    bottom: auto !important;
    left: auto !important;
    height: auto !important;
    width: auto !important;
    background-color: transparent !important;
}

/* POSICIÓN INICIAL DEL LABEL (ABAJO) */
.form-input.floating-label .input-label {
    position: absolute;
    left: 0;
    top: 12px;
    font-size: 16px;
    color: #9b9b9b;
    letter-spacing: 0.04em;
    text-transform: uppercase;
    pointer-events: none;
    transition: all 0.25s ease;
    font-family: var(--font-primary);
    font-weight: 400;
    text-shadow: none;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    background: transparent;
    backdrop-filter: none;
}

/* ESTADO ACTIVO (FOCUS O CON VALOR → LABEL SUBE) */
/* Para inputs: focus, has-value, placeholder-shown (solo si tiene placeholder), o is-focused en wrapper */
.form-input.floating-label .floating-input:focus + .highlight + .input-label,
.form-input.floating-label .floating-input.has-value + .highlight + .input-label,
.form-input.floating-label .floating-input[placeholder]:not(:placeholder-shown) + .highlight + .input-label,
.form-input.floating-label.is-focused .input-label,
/* Para selects: focus, has-value, o is-focused en wrapper */
.form-input.floating-label .floating-select:focus + .selectarrow + .highlight + .input-label,
.form-input.floating-label .floating-select.has-value + .selectarrow + .highlight + .input-label,
/* Para inputs date: focus, has-value */
.form-input.floating-label input[type="date"]:focus + .highlight + .input-label,
.form-input.floating-label input[type="date"].has-value + .highlight + .input-label,
/* Para Flatpickr: focus, has-value */
.form-input.floating-label .flatpickr-wrapper:has(.floating-input.has-value[placeholder]:not(:placeholder-shown)) + .highlight + .input-label {
    top: -14px;
    font-size: 12px;
    color: #b8b8b8;
}

/* PLACEHOLDER (SOLO VISIBLE EN FOCUS) */
.form-input.floating-label .floating-input::placeholder {
    color: transparent;
    transition: color 0.2s ease;
}

.form-input.floating-label .floating-input:focus::placeholder {
    color: #666;
}


.asterisk {
    color: var(--mitsubishi-red);
}

/* SELECT (GÉNERO) – MISMO EFECTO */
.form-input.floating-label .floating-select {
    appearance: none;
    -webkit-appearance: none;
    -moz-appearance: none;
    background: transparent;
    border: none;
    border-bottom: 1px solid #cfcfcf !important;
    padding: 8px 24px 8px 0;
    width: 100%;
    font-size: 16px;
    color: transparent;
    cursor: pointer;
    border-radius: 0;
    transition: all 0.3s ease;
    font-family: var(--font-primary);
    outline: none;
    text-shadow: none;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

    /* OCULTO EN IDLE, VISIBLE EN FOCUS O CON VALOR */
    .form-input.floating-label .floating-select:focus,
    .form-input.floating-label .floating-select.has-value,
    .form-input.floating-label .floating-select:valid {
        color: #222;
    }

.floating-select:focus {
    border-bottom-color: var(--mitsubishi-red) !important;
    border-bottom-width: 2px;
}

/* Flecha personalizada para select */
.selectarrow {
    position: absolute;
    right: 8px;
    top: 50%;
    transform: translateY(-50%);
    pointer-events: none;
    font-size: 1rem;
    color: #333;
    transition: color 0.3s ease;
    z-index: 1;
}

    .selectarrow.mim-icon-down-chevron::before {
        content: '▼';
        font-size: 0.75rem;
    }

/* Ajustar color del selectarrow cuando el select tiene foco */
.form-input.floating-label .floating-select:focus ~ .selectarrow {
    color: var(--mitsubishi-red);
}

/* Contenedor dropdown-input para posicionar la flecha */
.form-input.floating-label.dropdown-input {
    position: relative;
}

    /* Select deshabilitado */
    .form-input.floating-label.dropdown-input .floating-select:disabled {
        opacity: 0.6;
        cursor: not-allowed;
        background-color: #f5f5f5;
    }

    /* El label de selects usa el mismo comportamiento que inputs: solo sube con focus o has-value (reglas en líneas 219-220) */

    .form-input.floating-label.dropdown-input .floating-select {
        padding-right: 13px;
    }

/* Asterisk en rojo */
.asterisk {
    color: var(--mitsubishi-red);
}

/* Ocultar flechas en inputs numéricos (Chrome, Safari, Edge) */
input.numeric::-webkit-outer-spin-button,
input.numeric::-webkit-inner-spin-button {
    -webkit-appearance: none;
    margin: 0;
}

/* Ocultar flechas en inputs numéricos (Firefox) */
input.numeric {
    -moz-appearance: textfield;
}

/* Asegurar que los inputs numéricos no muestren flechas */
input[type="text"].numeric,
input[type="tel"].numeric {
    -webkit-appearance: none;
    -moz-appearance: textfield;
}

/* Textarea */
.floating-textarea {
    resize: vertical;
    min-height: 80px;
}

    .floating-textarea:focus ~ .input-label,
    .floating-textarea:not(:placeholder-shown) ~ .input-label {
        top: 0;
        font-size: 0.75rem;
        color: var(--mitsubishi-red);
        font-weight: 500;
    }

/* Estado de error  */
.floating-input.is-invalid,
.floating-select.is-invalid {
    border-bottom: 1px solid #cfcfcf !important;
}

    .floating-input.is-invalid ~ .input-label,
    .floating-select.is-invalid ~ .input-label {
        color: #b8b8b8;
    }

/* Forzar que la línea NUNCA sea roja, incluso con error */
.form-input.floating-label input,
.form-input.floating-label select {
    border-bottom: 1px solid #cfcfcf !important;
}

.form-input.floating-label.has-error input,
.form-input.floating-label.has-error select,
.form-input.floating-label.error input,
.form-input.floating-label.error select {
    border-bottom: 1px solid #cfcfcf !important;
}

/* Highlight NO debe ser rojo en error, solo en focus */
.form-input.floating-label.has-error .highlight {
    width: 0 !important;
    background-color: transparent !important;
}

/* Mensajes de error - SOLO texto rojo */
.cita-servicio-error-message {
    display: none;
    color: #e60012;
    font-size: 12px;
    margin-top: 6px;
    line-height: 1.2;
    font-weight: 400;
}

.form-input.floating-label.has-error .cita-servicio-error-message,
.form-input.floating-label.error .cita-servicio-error-message {
    display: block;
}

/* Mensajes de error para checkboxes */
.checkbox-group .cita-servicio-error-message {
    display: none;
    color: #e60012;
    font-size: 12px;
    margin-top: 6px;
    line-height: 1.2;
    font-weight: 400;
}

.checkbox-group.has-error .cita-servicio-error-message {
    display: block;
}

/* Botones de Navegación */
.cita-servicio-step-actions {
    display: flex;
    /*justify-content: space-between;*/
    align-items: center;
    margin-top: 2rem;
    padding-top: 2rem;
}


.cita-servicio-step-actions {
    justify-content: flex-start;
    gap: 1.5rem;
}

.cita-servicio-btn-next,
.cita-servicio-btn-back,
.cita-servicio-btn-submit {
    background: none;
    border: none;
    color: #000;
    font-weight: 700;
    font-size: 1rem;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    padding: 0.75rem 0rem;
    cursor: pointer;
    transition: color 0.3s ease;
    text-decoration: underline;
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

    .cita-servicio-btn-next:hover,
    .cita-servicio-btn-back:hover {
        color: var(--mitsubishi-red);
    }

.cita-servicio-btn-submit {
    background-color: var(--mitsubishi-red);
    color: #fff;
    text-decoration: none;
    border-radius: 4px;
    padding: 0.75rem 2rem;
}

    .cita-servicio-btn-submit:hover {
        background-color: #000;
        color: #fff;
    }

/* Privacy Section */
.cita-servicio-privacy-section {
    margin: 2rem 0;
    padding: 1.5rem;
    background-color: #f8f9fa;
    border-radius: 4px;
}

    .cita-servicio-privacy-section .form-check-label {
        font-size: 0.9rem;
        color: #333;
    }

        .cita-servicio-privacy-section .form-check-label a {
            color: var(--mitsubishi-red);
            text-decoration: underline;
        }



/* Responsive */
@media (max-width: 768px) {
    .cita-servicio-title-h1 {
        font-size: 3.5rem;
    }

    .cita-servicio-intro-text {
        font-size: 0.95rem;
    }

    .cita-servicio-subtitle-h2 {
        font-size: 1.5rem;
    }

    .cita-servicio-form-section {
        padding: 40px 0;
    }

    .cita-servicio-steps-nav {
        flex-direction: column;
        gap: 1rem;
    }

    .cita-servicio-step {
        width: 100%;
    }

        .cita-servicio-step.active::after {
            bottom: -0.5rem;
        }

    .cita-servicio-step-actions {
        flex-direction: column;
        gap: 1rem;
    }

    .cita-servicio-btn-next,
    .cita-servicio-btn-back,
    .cita-servicio-btn-submit {
        width: 100%;
    }
}

@media (max-width: 576px) {
    .cita-servicio-title-h1 {
        font-size: 1.75rem;
    }

    .cita-servicio-intro-text {
        font-size: 0.9rem;
    }

    .cita-servicio-subtitle-h2 {
        font-size: 1.25rem;
    }

    .cita-servicio-form-section {
        padding: 30px 0;
    }

    .cita-servicio-step .step-text {
        font-size: 0.8rem;
        font-weight: 700;
    }
}

/* =========================================
   LAYOUT PARA INFORMACIÓN DEL VEHÍCULO
   ========================================= */

.vehicle-row {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 32px;
    width: 100%;
}

.vehicle-col {
    width: 100%;
}

/* Responsive: apilar campos en pantallas pequeñas */
@media (max-width: 768px) {
    .vehicle-row {
        grid-template-columns: 1fr;
        gap: 20px;
    }
}

/* =========================================
   LAYOUT PARA DETALLE DEL SERVICIO
   ========================================= */

.service-row {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 32px;
    width: 100%;
    margin-bottom: 32px;
}

.service-col.single {
    grid-column: span 1;
}

/* Responsive: apilar campos en pantallas pequeñas */
@media (max-width: 768px) {
    .service-row {
        grid-template-columns: 1fr;
        gap: 20px;
    }
}

/* =========================================
   ESTILOS PARA CAMPO DE FECHA (DATE) con Flatpickr
   ========================================= */

.form-input.floating-label .flatpickr-wrapper {
    width: 100%;
    position: relative;
}

    .form-input.floating-label .flatpickr-wrapper input.floating-input {
        width: 100%;
        padding: 8px 0;
        border: none;
        border-bottom: 1px solid #cfcfcf !important;
        border-radius: 0;
        font-size: 16px;
        background-color: #fff !important;
        transition: all 0.3s ease;
        font-family: var(--font-primary);
        outline: none;
        -webkit-font-smoothing: antialiased;
        -moz-osx-font-smoothing: grayscale;
        color: #222;
        cursor: pointer;
    }

        .form-input.floating-label .flatpickr-wrapper input.floating-input:focus {
            border-bottom-color: var(--mitsubishi-red) !important;
            border-bottom-width: 2px;
        }

.form-input.floating-label .flatpickr-calendar {
    font-family: var(--font-primary);
}

.form-input.floating-label .flatpickr-day.disabled {
    color: #ccc !important;
    background: #f5f5f5 !important;
    text-decoration: line-through;
}

    .form-input.floating-label .flatpickr-day.disabled:hover {
        background: #f5f5f5 !important;
    }

}

/* =========================================
   ESTILOS PARA CHECKBOXES Y PRIVACIDAD
   ========================================= */

.cita-servicio-privacy-section {
    margin-top: 2rem;
    margin-bottom: 2rem;
}

    .cita-servicio-privacy-section h4 {
        font-size: 1rem;
        font-weight: 600;
        color: #333;
        margin-bottom: 0.75rem;
        margin-top: 1.5rem;
        text-transform: uppercase;
        letter-spacing: 0.05em;
    }

        .cita-servicio-privacy-section h4:first-child {
            margin-top: 0;
        }

.checkbox-row {
    display: flex;
    align-items: flex-start;
    gap: 0.75rem;
    margin-bottom: 0.5rem;
    cursor: pointer;
}

    .checkbox-row input[type="checkbox"] {
        appearance: none;
        -webkit-appearance: none;
        -moz-appearance: none;
        margin-top: 0.25rem;
        width: 1.25rem;
        height: 1.25rem;
        min-width: 1.25rem;
        background-color: #fff;
        border: 2px solid #cfcfcf;
        border-radius: 0.25rem;
        cursor: pointer;
        flex-shrink: 0;
    }

        .checkbox-row input[type="checkbox"]:checked {
            background-color: var(--mitsubishi-red);
            border-color: var(--mitsubishi-red);
            background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 16 16'%3E%3Cpath fill='%23ffffff' d='M13.854 3.646a.5.5 0 0 1 0 .708l-7 7a.5.5 0 0 1-.708 0l-3.5-3.5a.5.5 0 1 1 .708-.708L6.5 10.293l6.646-6.647a.5.5 0 0 1 .708 0z'/%3E%3C/svg%3E");
            background-repeat: no-repeat;
            background-position: center;
            background-size: 14px 14px;
        }

        .checkbox-row input[type="checkbox"]:focus {
            border-color: var(--mitsubishi-red);
            box-shadow: 0 0 0 0.2rem rgba(230, 0, 18, 0.25);
            outline: none;
        }

    .checkbox-row span {
        font-size: 0.95rem;
        color: #333;
        line-height: 1.6;
        flex: 1;
        font-weight: 400;
    }

    .checkbox-row a {
        color: var(--mitsubishi-red);
        text-decoration: underline;
        font-weight: 400;
    }

        .checkbox-row a:hover {
            text-decoration: none;
        }

.checkbox-helper {
    font-size: 0.875rem;
    color: #666;
    line-height: 1.7;
    margin-top: 0.5rem;
    margin-bottom: 1rem;
    margin-left: 2rem;
    font-weight: 400;
}

    .checkbox-helper strong {
        font-weight: 600;
        color: #333;
        text-decoration: underline;
    }

/* =========================================
   ESTILOS PARA BOTONES EN STEP 3
   ========================================= */

.cita-servicio-step-actions-regresar {
    margin-top: 1.5rem;
    margin-bottom: 2rem;
}

.cita-servicio-step-actions-enviar {
    margin-top: 2rem;
    display: flex;
    justify-content: flex-start;
}

    .cita-servicio-step-actions-regresar .cita-servicio-btn-back,
    .cita-servicio-step-actions-enviar .cita-servicio-btn-submit {
        font-size: 1rem;
        font-weight: 500;
        padding: 0.75rem 1.5rem;
        border: none;
        cursor: pointer;
        transition: all 0.3s ease;
    }

.cita-servicio-step-actions-regresar .cita-servicio-btn-back {
    background: transparent;
    color: #333;
    text-decoration: underline;
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    font-weight: 700;
    font-size: 1rem;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    padding: 0;
    border: none;
}

    .cita-servicio-step-actions-regresar .cita-servicio-btn-back:hover {
        color: var(--mitsubishi-red);
    }

.cita-servicio-step-actions-enviar .cita-servicio-btn-submit {
    background-color: var(--mitsubishi-red);
    color: #fff;
    border-radius: 4px;
    text-transform: uppercase;
    letter-spacing: 0.05em;
}

    .cita-servicio-step-actions-enviar .cita-servicio-btn-submit:hover {
        background-color: #000;
    }


/* =========================================
   ESTILOS PARA AVISO DE PRIVACIDAD
   ========================================= */

.privacy-table-wrapper {
    margin: 30px 0;
    overflow-x: auto;
}

.privacy-table {
    width: 100%;
    border-collapse: collapse;
    font-size: 15px;
    color: #000;
}

    .privacy-table th,
    .privacy-table td {
        border: 1px solid #000;
        padding: 12px 14px;
        vertical-align: top;
    }

    .privacy-table th {
        font-weight: 700;
        text-align: left;
        background-color: #fff;
    }

    .privacy-table td strong {
        font-weight: 700;
    }

.privacy-subtitle {
    font-size: 26px;
    font-weight: 700;
    margin-top: 40px;
    margin-bottom: 15px;
}

.text-highlight {
    color: #e60012;
    font-style: italic;
}

/* ==============================
   MAPA DEL SITIO – HERO Y CONTENIDO
   ============================== */

.sitemap-hero {
    position: relative;
    height: 350px;
    min-height: 280px;
    overflow: hidden;
}

.sitemap-hero-img {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}

    .sitemap-hero-img img {
        width: 100%;
        height: 100%;
        object-fit: cover;
    }

.sitemap-hero-overlay {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(0,0,0,0.4);
}

.sitemap-hero-content {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    z-index: 1;
    text-align: center;
    width: 100%;
    max-width: 1170px;
}

.sitemap-hero-title {
    margin: 0;
    font-size: 84px;
    font-weight: 700;
    color: #fff;
    line-height: 1.15;
    letter-spacing: 0;
}

.sitemap-content {
    background-color: #fff;
    padding: 40px 0 60px;
}

.container1240 {
    max-width: 1240px;
    margin: 0 auto;
    padding: 0 20px;
    box-sizing: border-box;
}

.container1170 {
    max-width: 1170px;
    margin: 0 auto;
    padding: 0 20px;
    box-sizing: border-box;
}

/* ========== Cotizar Seminuevos / Prueba de Manejo Seminuevos (mismo layout) ========== */
body.page-cotizar-seminuevos .content-without-image.inventory_form_pages,
body.page-prueba-manejo-seminuevos .content-without-image.inventory_form_pages {
    padding-top: 0;
    padding-bottom: 60px;
    background-color: #fff;
}

body.page-cotizar-seminuevos .inventory_title,
body.page-prueba-manejo-seminuevos .inventory_title {
    margin-bottom: 25px;
}

    body.page-cotizar-seminuevos .inventory_title h1,
    body.page-cotizar-seminuevos h1.small-h1,
    body.page-prueba-manejo-seminuevos .inventory_title h1,
    body.page-prueba-manejo-seminuevos h1.small-h1 {
        font-size: 50px;
        line-height: 55px;
        font-weight: 700;
        color: #181818;
        margin: 25px 0 25px;
    }

body.page-cotizar-seminuevos .title-desc,
body.page-prueba-manejo-seminuevos .title-desc {
    font-size: 16px;
    line-height: 28px;
    color: var(--body-color, #000);
    margin: 0;
}

body.page-cotizar-seminuevos .inventory_form_data,
body.page-prueba-manejo-seminuevos .inventory_form_data {
    display: flex;
    flex-wrap: wrap;
    margin: 0 -12px;
}

body.page-cotizar-seminuevos .form-left-wrapper,
body.page-prueba-manejo-seminuevos .form-left-wrapper {
    padding-left: 0;
}

body.page-cotizar-seminuevos .vehicle-detail-box-wrap,
body.page-prueba-manejo-seminuevos .vehicle-detail-box-wrap {
    margin-bottom: 24px;
}

body.page-cotizar-seminuevos .vehicle-detail-box,
body.page-prueba-manejo-seminuevos .vehicle-detail-box {
    margin-bottom: 16px;
}

body.page-cotizar-seminuevos .vehicle-detail-box-title,
body.page-prueba-manejo-seminuevos .vehicle-detail-box-title {
    font-size: 36px;
    line-height: 40px;
    font-weight: 700;
    color: #181818;
    margin: 0 0 8px;
}

body.page-cotizar-seminuevos .vehicle-detail-box .vehicle_box_price,
body.page-prueba-manejo-seminuevos .vehicle-detail-box .vehicle_box_price {
    font-size: 24px;
    line-height: 28px;
    font-weight: 700;
    color: #181818;
    margin: 0 0 8px;
}

body.page-cotizar-seminuevos .vehicle_box_year,
body.page-prueba-manejo-seminuevos .vehicle_box_year {
    font-size: 0.95rem;
    color: #5A646E;
    margin: 0 0 16px;
}

body.page-cotizar-seminuevos .vehicle_box_img,
body.page-prueba-manejo-seminuevos .vehicle_box_img {
    margin-top: 12px;
}

    body.page-cotizar-seminuevos .vehicle_box_img .imgboxwithiframe,
    body.page-prueba-manejo-seminuevos .vehicle_box_img .imgboxwithiframe {
        display: block;
        overflow: hidden;
        border-radius: 4px;
    }

    body.page-cotizar-seminuevos .vehicle_box_img img,
    body.page-prueba-manejo-seminuevos .vehicle_box_img img {
        display: block;
        width: 100%;
        height: auto;
        max-width: 295px;
        object-fit: cover;
    }

body.page-cotizar-seminuevos .vehicle-detail-box-placeholder,
body.page-prueba-manejo-seminuevos .vehicle-detail-box-placeholder {
    padding: 24px;
    border: 1px dashed #c8c8c8;
    border-radius: 4px;
    color: #5A646E;
}

body.page-cotizar-seminuevos .vehicle-box-type-wrap,
body.page-prueba-manejo-seminuevos .vehicle-box-type-wrap {
    display: none;
}

/* Cotizar seminuevos / Prueba de manejo seminuevos – Mobile */
@media (max-width: 767px) {
    body.page-cotizar-seminuevos .inventory_title,
    body.page-prueba-manejo-seminuevos .inventory_title {
        margin-bottom: 0;
    }

        body.page-cotizar-seminuevos .inventory_title h1,
        body.page-cotizar-seminuevos h1.small-h1,
        body.page-prueba-manejo-seminuevos .inventory_title h1,
        body.page-prueba-manejo-seminuevos h1.small-h1 {
            font-size: 28px;
            line-height: 34px;
        }

    body.page-cotizar-seminuevos .vehicle-detail-box-title,
    body.page-prueba-manejo-seminuevos .vehicle-detail-box-title {
        font-size: 21px;
        line-height: 26px;
    }

    body.page-cotizar-seminuevos .inventory_form_data,
    body.page-prueba-manejo-seminuevos .inventory_form_data {
        margin: 0;
    }

    body.page-cotizar-seminuevos .cita-servicio-step-actions-enviar,
    body.page-prueba-manejo-seminuevos .cita-servicio-step-actions-enviar {
        justify-content: center;
    }

        body.page-cotizar-seminuevos .cita-servicio-step-actions-enviar .cita-servicio-btn-submit,
        body.page-prueba-manejo-seminuevos .cita-servicio-step-actions-enviar .cita-servicio-btn-submit {
            display: flex;
            align-items: center;
            justify-content: center;
            text-align: center;
        }
}

.sitemaplinks h2 {
    margin: 0;
    padding: 15px 0 0;
    border-top: 1px solid var(--border-color, #ddd);
    font-size: 2rem;
    line-height: 1.2;
    font-weight: 700;
    color: #181818;
}

    .sitemaplinks h2:first-child {
        border-top: none;
        padding-top: 0;
        margin-top: 30px;
    }

.sitemap-grid {
    display: flex;
    flex-wrap: wrap;
    margin: 20px 0;
    gap: 0 40px;
}

    .sitemap-grid > ul {
        flex: 1 1 200px;
        min-width: 150px;
    }

ul.ul-common {
    margin: 0;
    padding: 0;
    list-style: none;
}

    ul.ul-common li {
        padding: 4px 0 4px 15px;
        position: relative;
        list-style: none;
    }

        ul.ul-common li::before {
            content: '';
            position: absolute;
            left: 0;
            top: 12px;
            width: 4px;
            height: 4px;
            background: #000;
            border-radius: 50%;
        }

    ul.ul-common a {
        color: #000;
        text-decoration: none;
        font-size: 1rem;
        line-height: 1.6;
        transition: color 0.3s;
    }

        ul.ul-common a:hover {
            color: var(--mitsubishi-red);
        }

@media (max-width: 767px) {
    .sitemap-hero {
        height: 280px;
    }

    .sitemap-hero-title {
        font-size: 28px;
    }

    .sitemaplinks h2 {
        font-size: 1.35rem;
    }
}

@media (min-width: 768px) and (max-width: 1199px) {
    .sitemap-hero-title {
        font-size: 40px;
    }

    .sitemaplinks h2 {
        font-size: 1.6rem;
    }
}

/* ==============================
   POLÍTICA DE COOKIES – LAYOUT Y CONTENIDO
   ============================== */

.sub_pages-desc {
    margin-top: 20px;
}

.politica-cookies {
    background-color: #fff;
}

    .politica-cookies h1 {
        font-size: 63px;
        font-weight: 700;
        color: #000;
        line-height: 1.15;
        margin-bottom: 20px;
    }

    .politica-cookies .sub_pages-desc p,
    .politica-cookies .sub_pages-desc .cookies-table-wrapper {
        margin: 20px 0 0 0;
        color: #000;
        font-size: 1rem;
        line-height: 1.6;
    }

        .politica-cookies .sub_pages-desc p:first-of-type {
            margin-top: 0;
        }

.privacymain table td {
    padding-left: 8px;
}

.cookies-table-wrapper {
    margin: 25px 0;
    overflow-x: auto;
}

.cookies-table {
    min-width: 500px;
}

@media (max-width: 767px) {
    .politica-cookies h1 {
        font-size: 1.5rem;
        margin-bottom: 16px;
    }
}

@media (min-width: 768px) and (max-width: 1199px) {
    .politica-cookies h1 {
        font-size: 2.2rem;
        margin-bottom: 18px;
    }
}

@media (min-width: 1200px) {
    .politica-cookies h1 {
        font-size: 3.9rem;
        margin-bottom: 24px;
    }
}

/* ==============================
   AVISO LEGAL – LAYOUT Y CONTENIDO
   ============================== */

.container1280 {
    max-width: 1280px;
    margin: 0 auto;
    padding: 20px 0;
    box-sizing: border-box;
}

ul.ckbullet {
    margin: 0;
    padding: 0 0 0 20px;
    list-style: disc;
}

    ul.ckbullet li {
        margin-bottom: 10px;
        line-height: 1.6;
    }

.aviso-legal {
    background-color: #fff;
}

    .aviso-legal h1 {
        font-size: 3.2rem;
        font-weight: 700;
        color: #000;
        line-height: 1.15;
        margin-bottom: 30px;
    }

    .aviso-legal p,
    .aviso-legal ul {
        margin: 20px 0 0 0;
        color: #000;
        font-size: 1rem;
        line-height: 1.6;
    }

        .aviso-legal p:first-of-type {
            margin-top: 0;
        }

    .aviso-legal strong {
        font-weight: 700;
    }

@media (max-width: 767px) {
    .aviso-legal h1 {
        font-size: 1.5rem;
        margin-bottom: 20px;
    }

    .container1280 {
        padding-left: 16px;
        padding-right: 16px;
    }
}

@media (min-width: 768px) and (max-width: 1199px) {
    .aviso-legal h1 {
        font-size: 2.2rem;
        margin-bottom: 26px;
    }

    .container1280 {
        padding-left: 16px;
        padding-right: 16px;
    }
}

@media (min-width: 1200px) {
    .aviso-legal h1 {
        font-size: 4rem;
        margin-bottom: 32px;
    }
}

/* ==============================
   TÉRMINOS Y CONDICIONES – H1
   ============================== */

.terminos-y-condiciones h1 {
    font-size: 3.2rem;
    line-height: 1.15;
    margin-bottom: 30px;
}

/* =================================================
   TÉRMINOS Y CONDICIONES – H1 RESPONSIVO
   ================================================= */

/*  Mobile (hasta 767px) */
@media (max-width: 767px) {
    .terminos-y-condiciones h1 {
        font-size: 1.5rem;
        line-height: 1.2;
        margin-bottom: 20px;
    }
}

/*  Tablet (768px a 1199px) */
@media (min-width: 768px) and (max-width: 1199px) {
    .terminos-y-condiciones h1 {
        font-size: 2.2rem;
        line-height: 1.15;
        margin-bottom: 26px;
    }
}

/* Desktop (1200px en adelante) */
@media (min-width: 1200px) {
    .terminos-y-condiciones h1 {
        font-size: 3.5rem;
        line-height: 1.1;
        margin-bottom: 32px;
    }
}


/* =========================================
   ESTILOS PARA HERO DE CONTACTO
   ========================================= */

.contact-hero {
    height: 50vh;
    min-height: 400px;
    max-height: 500px;
}

/* Evitar que el botón CONTACTO se recorte: el hero crece con el contenido en móvil */
@media (max-width: 768px) {
    .contact-hero {
        height: auto !important;
        min-height: 320px;
        max-height: none !important;
    }
}

body.page-contacto .hero-section.contact-hero {
    overflow-x: hidden;
    overflow-y: visible !important;
}

body.page-contacto #contacto-form .container {
    max-width: 100%;
    padding-left: 16px;
    padding-right: 16px;
}

.contact-hero .cita-servicio-btn-submit {
    background-color: var(--mitsubishi-red);
    color: #fff;
    border-radius: 4px;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    font-size: 1rem;
    font-weight: 500;
    padding: 0.75rem 1.5rem;
    border: none;
    cursor: pointer;
    transition: all 0.3s ease;
    text-decoration: none;
    display: inline-block;
}

    .contact-hero .cita-servicio-btn-submit:hover {
        background-color: #000;
        color: #fff;
        text-decoration: none;
    }

/* =========================================
   ESTILOS PARA BOTÓN CONTÁCTANOS
   ========================================= */

.btn-contactanos {
    display: inline-block;
    background-color: #fff;
    border: 2px solid #000;
    color: #000;
    padding: 12px 35px;
    font-family: 'MMCOFFICE', sans-serif;
    font-weight: 700;
    font-size: 0.85rem;
    text-transform: uppercase;
    text-decoration: none;
    transition: all 0.3s ease;
    cursor: pointer;
}

    .btn-contactanos:hover {
        background-color: var(--mitsubishi-red);
        color: #fff;
        border-color: var(--mitsubishi-red);
        text-decoration: none;
    }

.btn-contactanos-dark {
    display: inline-block;
    background-color: #fff;
    border: 2px solid #000;
    color: #000;
    padding: 12px 35px;
    font-family: 'MMCOFFICE', sans-serif;
    font-weight: 700;
    font-size: 0.85rem;
    text-transform: uppercase;
    text-decoration: none;
    transition: all 0.3s ease;
    cursor: pointer;
}

    .btn-contactanos-dark:hover {
        background-color: #000;
        color: #fff;
        border-color: #000;
        text-decoration: none;
    }

/* ============================
FAQ Tabs - Corrección color texto
============================ */


.faq-section .faq-tabs .nav-link {
    color: #000 !important; /* negro por defecto */
    font-weight: 500;
}


    .faq-section .faq-tabs .nav-link.active {
        color: #000 !important;
        background-color: transparent;
        border-bottom: 3px solid var(--mitsubishi-red);
    }


    .faq-section .faq-tabs .nav-link:hover {
        color: var(--mitsubishi-red) !important;
    }

/* =========================================
   FAQ – RESPONSIVE MÓVIL (preguntas-frecuentes)
   ========================================= */
body.page-preguntas-frecuentes .faq-section .faq-main-title,
body.page-preguntas-frecuentes .faq-section .guarantee-title {
    line-height: 1.2;
    word-wrap: break-word;
    overflow-wrap: break-word;
}

body.page-preguntas-frecuentes .faq-section .container {
    max-width: 100%;
    width: 100%;
    padding-left: 16px;
    padding-right: 16px;
    box-sizing: border-box;
}

body.page-preguntas-frecuentes .faq-section {
    overflow-x: hidden;
    width: 100%;
}

body.page-preguntas-frecuentes .custom-faq {
    max-width: 100%;
    min-width: 0;
}

    body.page-preguntas-frecuentes .custom-faq .accordion-button {
        padding-right: 2rem;
        word-wrap: break-word;
        white-space: normal;
        text-align: left;
    }

/* Título principal desktop */
body.page-preguntas-frecuentes .faq-section .faq-main-title {
    font-size: 63px;
    margin-bottom: 20px;
}

@media (max-width: 768px) {
    body.page-preguntas-frecuentes .faq-section {
        padding: 100px 0 60px 0 !important;
    }

        body.page-preguntas-frecuentes .faq-section .faq-main-title,
        body.page-preguntas-frecuentes .faq-section .guarantee-title {
            font-size: 24px !important;
        }

        body.page-preguntas-frecuentes .faq-section .faq-tabs {
            flex-direction: column;
            flex-wrap: nowrap;
            display: flex;
        }

            body.page-preguntas-frecuentes .faq-section .faq-tabs .nav-item {
                width: 100%;
                margin: 0;
            }

            body.page-preguntas-frecuentes .faq-section .faq-tabs .nav-link {
                font-size: 13px;
                padding: 12px 16px;
                white-space: normal;
                word-wrap: break-word;
            }

    body.page-preguntas-frecuentes .custom-faq .accordion-button {
        font-size: 14px;
    }

    body.page-preguntas-frecuentes .custom-faq .accordion-body {
        font-size: 13px;
    }
}

@media (max-width: 480px) {
    body.page-preguntas-frecuentes .faq-section .container {
        padding-left: 12px;
        padding-right: 12px;
    }

    body.page-preguntas-frecuentes .faq-section .faq-main-title,
    body.page-preguntas-frecuentes .faq-section .guarantee-title {
        font-size: 20px !important;
    }

    body.page-preguntas-frecuentes .custom-faq .accordion-button {
        font-size: 13px;
    }
}

/* =========================================
   ESTILOS PARA HORARIOS Y UBICACIÓN
   ========================================= */

/* Contenedor del mapa con margen superior para alineación */

.map-wrapper {
    position: relative;
    margin-top: 4rem;
    width: 100%;
}

    .map-wrapper iframe {
        width: 100%;
        height: 720px;
        border: 0;
        border-radius: 4px;
    }

/* Lista de teléfonos con iconos y sangría */
.phone-list-horarios {
    list-style: none;
    padding-left: 0;
    margin: 0;
}

.phone-item-horarios {
    font-family: 'MMCOFFICE', sans-serif;
    font-size: 1rem;
    color: #333;
    margin-bottom: 12px;
    display: flex;
    align-items: center;
    padding-left: 0.5rem;
}

    .phone-item-horarios i {
        color: #000;
        font-size: 1.1rem;
        margin-right: 10px;
        flex-shrink: 0;
    }

    .phone-item-horarios span {
        flex: 1;
    }

    .phone-item-horarios a {
        color: #333;
        text-decoration: none;
        transition: color 0.3s ease;
    }

        .phone-item-horarios a:hover {
            color: var(--mitsubishi-red);
            text-decoration: underline;
        }

/* Responsive: ajustar margen del mapa en móvil */
@media (max-width: 991px) {
    .map-wrapper {
        margin-top: 2rem;
    }
}

@media (max-width: 768px) {
    .map-wrapper iframe {
        height: 380px;
    }
}

/* =========================================
   ESTILOS PARA PÁGINA DE MANTENIMIENTO
   ========================================= */

/* Hero Video Mantenimiento */
.hero-video-mantenimiento {
    height: 90vh;
    min-height: 600px;
}

    .hero-video-mantenimiento .hero-overlay {
        background: rgba(0,0,0,0.5);
    }

    .hero-video-mantenimiento .hero-content {
        text-align: center;
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: center;
        width: 100%;
    }

    .hero-video-mantenimiento .hero-title {
        font-size: 84px;
        font-weight: 700;
        color: #fff;
        margin-bottom: 20px;
        text-transform: uppercase;
        letter-spacing: 2px;
        white-space: normal;
        word-wrap: break-word;
        text-align: center;
    }

    .hero-video-mantenimiento .hero-text {
        font-size: 21px;
        color: #fff;
        max-width: 800px;
        margin: 0 auto;
    }

/* Títulos y Subtítulos */
.mantenimiento-main-title {
    font-size: 63px;
    font-weight: 700;
    color: #000;
    margin-bottom: 20px;
    font-family: 'MMCOFFICE', sans-serif;
    text-align: left;
}

.mantenimiento-subtitle {
    font-size: 16px;
    color: #333;
    margin-bottom: 40px;
    font-family: 'MMCOFFICE', sans-serif;
    font-weight: 400;
    text-align: left;
}

.mantenimiento-section-title {
    font-size: 42px;
    font-weight: 700;
    color: #000;
    margin-bottom: 20px;
    margin-top: 50px;
    font-family: 'MMCOFFICE', sans-serif;
}

/* ===============================
   MANTENIMIENTO – TABLAS
   =============================== */

/* Tablas de Mantenimiento - Override Bootstrap */
table.mantenimiento-table.table {
    width: 100%;
    border-collapse: collapse;
    margin-bottom: 30px;
    font-family: 'MMCOFFICE', sans-serif;
    box-shadow: none !important;
}

/* BORDES GENERALES (SUAVES) */
table.mantenimiento-table th,
table.mantenimiento-table td {
    border: 1px solid #d9d9d9 !important; /* gris claro sutil */
    box-shadow: none !important;
}

/* ENCABEZADOS ROJOS (SIN DIVISIONES VISIBLES) */
table.mantenimiento-table thead th.table-header-red {
    background-color: #e60012 !important; /* Rojo Mitsubishi exacto */
    color: #ffffff !important;
    border: none !important;
    border-left: none !important;
    border-right: none !important;
    border-top: none !important;
    border-bottom: none !important;
    font-weight: 500; /* Suavizado para apariencia más elegante */
    padding: 14px 12px;
    text-align: center;
    font-size: 0.9rem;
    vertical-align: middle;
    line-height: 1.3;
    text-shadow: none !important;
}

/* Eliminar bordes entre encabezados rojos adyacentes */
table.mantenimiento-table thead tr th.table-header-red + th.table-header-red {
    border-left: none !important;
}

/* ENCABEZADOS NEGROS (KILOMETRAJE / PÓLIZA) */
table.mantenimiento-table thead th.table-header-km {
    background-color: #000000 !important;
    color: #ffffff !important;
    border: none !important;
    border-left: none !important;
    border-right: none !important;
    border-top: none !important;
    border-bottom: none !important;
    font-weight: 500; /* Suavizado para apariencia más elegante */
    padding: 14px 12px;
    text-align: center;
    font-size: 13px;
    vertical-align: middle;
    line-height: 1.3;
    text-shadow: none !important;
}

/* COLUMNA IZQUIERDA KILOMETRAJE */
table.mantenimiento-table tbody td:first-child {
    background: #5f6a72 !important; /* gris exacto similar al original */
    color: #ffffff !important;
    font-weight: 500; /* Suavizado para apariencia más limpia y ligera */
    border-right: 1px solid #d9d9d9 !important;
    border-left: 1px solid #d9d9d9 !important;
    border-top: 1px solid #d9d9d9 !important;
    border-bottom: 1px solid #d9d9d9 !important;
    padding: 14px 12px;
    text-align: center;
    vertical-align: middle;
    line-height: 1.3;
    text-shadow: none !important;
}

/* FILAS ALTERNADAS */
table.mantenimiento-table tbody tr:nth-child(odd) td:not(:first-child) {
    background: #ffffff !important;
}

table.mantenimiento-table tbody tr:nth-child(even) td:not(:first-child) {
    background: #ededed !important; /* gris claro plano */
}

/* Celdas de datos generales */
table.mantenimiento-table tbody td {
    padding: 14px 12px;
    line-height: 1.3;
    text-align: center;
    vertical-align: middle;
    font-size: 0.95rem;
    color: #000;
    font-weight: 400;
    border: 1px solid #d9d9d9 !important;
    text-shadow: none !important;
}

/* Override para filas con clases específicas (mantener compatibilidad) */
table.mantenimiento-table tbody tr.table-row-dark td:not(:first-child) {
    background: #ffffff !important;
}

table.mantenimiento-table tbody tr.table-row-light td:not(:first-child) {
    background: #ededed !important;
}

/* Asegurar que no haya bordes en el thead */
table.mantenimiento-table thead tr {
    border: none !important;
}

table.mantenimiento-table thead th {
    border: none !important;
}

/* Eliminar cualquier borde del contenedor de tabla */
.table-responsive .mantenimiento-table {
    border: none !important;
}

/* ===============================
   MANTENIMIENTO – FONDO TABLA GAMA NO ACTUAL
   =============================== */

/* Fondo gris claro para la última tabla (Modelos gama no actual) - Full Width */
.mantenimiento-gama-no-actual-wrapper {
    background: #f5f5f5;
    padding: 40px 0;
    margin-top: 50px;
    width: 100%;
}

    /* Mantener el contenido centrado internamente */
    .mantenimiento-gama-no-actual-wrapper .mb-5 {
        max-width: 1200px;
        margin-left: auto;
        margin-right: auto;
        padding-left: 15px;
        padding-right: 15px;
    }

    /* Asegurar que la tabla también esté centrada */
    .mantenimiento-gama-no-actual-wrapper .table-responsive {
        margin-left: auto;
        margin-right: auto;
    }

/* Responsive: ajustar padding en móvil */
@media (max-width: 768px) {
    .mantenimiento-gama-no-actual-wrapper {
        padding: 30px 0;
    }

        .mantenimiento-gama-no-actual-wrapper .mb-5 {
            padding-left: 15px;
            padding-right: 15px;
        }
}

/* Página Mantenimiento: evitar desbordamiento y rectángulo blanco */
body.page-mantenimiento .form-section.mantenimiento-section {
    overflow-x: hidden;
    width: 100%;
}

body.page-mantenimiento .mantenimiento-section .container {
    max-width: 100%;
    width: 100%;
    padding-left: 16px;
    padding-right: 16px;
    box-sizing: border-box;
}

@media (max-width: 480px) {
    body.page-mantenimiento .mantenimiento-section .container {
        padding-left: 12px;
        padding-right: 12px;
    }

    body.page-mantenimiento .mantenimiento-main-title {
        font-size: 1.25rem !important;
    }
}

body.page-mantenimiento .mantenimiento-main-title,
body.page-mantenimiento .mantenimiento-subtitle,
body.page-mantenimiento .mantenimiento-section-title {
    word-wrap: break-word;
    overflow-wrap: break-word;
}

body.page-mantenimiento .hero-section.hero-video-mantenimiento {
    overflow-x: hidden;
}

/* Responsive para tablas */
@media (max-width: 768px) {
    body.page-mantenimiento .mantenimiento-main-title {
        font-size: 1.5rem !important;
    }

    body.page-mantenimiento .mantenimiento-subtitle {
        font-size: 1rem;
    }

    body.page-mantenimiento .mantenimiento-section-title {
        font-size: 1.25rem !important;
    }

    table.mantenimiento-table {
        font-size: 0.85rem;
    }

        table.mantenimiento-table thead th.table-header-km,
        table.mantenimiento-table thead th.table-header-red {
            font-size: 0.75rem;
            padding: 10px 8px;
            border: none !important;
        }

        table.mantenimiento-table tbody td {
            font-size: 0.8rem;
            padding: 8px 6px;
            border: 1px solid #d9d9d9 !important;
        }

            table.mantenimiento-table tbody td:first-child {
                background: #5f6a72 !important;
                color: #ffffff !important;
                border: 1px solid #d9d9d9 !important;
            }

    .hero-video-mantenimiento .hero-title {
        font-size: 1.5rem !important;
        white-space: normal;
    }

    .hero-video-mantenimiento .hero-text {
        font-size: 1rem;
    }
}

/* ===============================
   FORMULARIOS - FONDO BLANCO
   =============================== */
.form-page .form-section {
    background-color: #ffffff;
}

/* =========================================
   MANTENIMIENTO – CTA FINAL
========================================= */

.mantenimiento-cta-section {
    padding: 80px 0 100px;
    background-color: #ffffff;
}

.mantenimiento-cta-box {
    max-width: 100%;
}

    /* Botón principal */
    .mantenimiento-cta-box .btn-agendar-cita {
        display: inline-block;
        padding: 14px 42px;
        border: 2px solid #000;
        background-color: transparent;
        color: #000;
        font-weight: 700;
        letter-spacing: 0.15em;
        text-transform: uppercase;
        text-decoration: none;
        margin-bottom: 28px;
        transition: all 0.25s ease;
    }

        /* Hover EXACTO al objetivo */
        .mantenimiento-cta-box .btn-agendar-cita:hover {
            background-color: #000;
            color: #fff;
        }

/* Texto legal */
.mantenimiento-cta-text {
    font-size: 16px;
    line-height: 1.8;
    color: #000;
    margin-bottom: 18px;
}

    /* Links dentro del texto */
    .mantenimiento-cta-text a {
        color: #000;
        text-decoration: underline;
    }

        .mantenimiento-cta-text a:hover {
            color: var(--mitsubishi-red);
        }

/* ==============================
   RESPONSIVE
============================== */

@media (max-width: 768px) {

    .mantenimiento-cta-section {
        padding: 50px 20px 70px;
    }

    .mantenimiento-cta-box {
        max-width: 100%;
    }

        .mantenimiento-cta-box .btn-agendar-cita {
            width: 100%;
            text-align: center;
            padding: 16px 0;
            letter-spacing: 0.12em;
        }

    .mantenimiento-cta-text {
        font-size: 13px;
        line-height: 1.75;
    }
}

/* =========================================
   HERO VIDEO – MOBILE FIX (MANTENIMIENTO)
========================================= */

@media (max-width: 768px) {

    /* Contenedor del hero */
    .hero-section.hero-video-mantenimiento {
        height: 65vh; /* clave: reduce altura */
        min-height: 420px;
        max-height: 520px;
    }

        /* Video */
        .hero-section.hero-video-mantenimiento video {
            width: 100%;
            height: 100%;
            object-fit: cover; /* mantiene encuadre correcto */
            object-position: center;
        }

        /* Overlay (si existe) */
        .hero-section.hero-video-mantenimiento .hero-overlay {
            background: rgba(0, 0, 0, 0.55); /* igual al original */
        }

        /* Contenido del hero */
        .hero-section.hero-video-mantenimiento .hero-content {
            padding: 0 16px;
            text-align: center;
            width: 100%;
            max-width: 100%;
            box-sizing: border-box;
        }

        /* Título - permite salto de línea para evitar desbordamiento */
        .hero-section.hero-video-mantenimiento .hero-title {
            white-space: normal;
            word-wrap: break-word;
        }

        .hero-section.hero-video-mantenimiento h1 {
            font-size: 1.5rem;
            line-height: 1.2;
            margin-bottom: 10px;
        }

        /* Texto */
        .hero-section.hero-video-mantenimiento p {
            font-size: 0.95rem;
            line-height: 1.4;
        }
}


/* Por defecto: desktop/tablet -> se ve el botón de abajo, se oculta el de arriba */
body.page-mantenimiento .btn-agendar-cita--top {
    display: none !important;
}

body.page-mantenimiento .btn-agendar-cita--bottom {
    display: inline-flex;
}

/* Móvil: se muestra el botón de arriba y se oculta el del final */
@media (max-width: 768px) {
    body.page-mantenimiento .btn-agendar-cita--top {
        display: inline-flex !important;
        align-items: center;
        justify-content: center;
        margin: 16px 0 0; /* ajusta a gusto */

        font-size: 12px;
    }

    body.page-mantenimiento .btn-agendar-cita--bottom {
        display: none !important;
    }
}



/* =========================================
   ESTILOS PROMOCIONES (prefijo .promociones-*)
   ========================================= */

/* --- Banner principal --- */
.promociones-banner {
    position: relative;
    width: 100%;
    height: 500px;
    display: flex;
    align-items: center;
    justify-content: center;
    overflow: hidden;
}

.promociones-banner-bg {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 1;
}

    .promociones-banner-bg img {
        width: 100%;
        height: 100%;
        object-fit: cover;
        object-position: center;
    }

@media (min-width: 960px) {
    .promociones-banner {
        height: 550px;
    }

    .promociones-banner-bg img {
        height: 550px;
        object-fit: cover;
    }
}

.promociones-banner-overlay {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(0, 0, 0, 0.4);
    z-index: 2;
}

.promociones-banner-content {
    position: relative;
    z-index: 3;
    width: 100%;
    text-align: center;
    color: #fff;
}

.promociones-banner-inner {
    max-width: 800px;
    margin: 0 auto;
}

.promociones-banner-title {
    font-family: var(--font-primary);
    font-weight: 700;
    font-size: 84px;
    margin-bottom: 20px;
    text-transform: capitalize;
}

.promociones-banner-desc {
    font-family: var(--font-primary);
    font-weight: 400;
    font-size: 24px;
    line-height: 1.5;
    margin-bottom: 0;
    padding: 0 10px;
}

/* --- Sección de contenido --- */
.promociones-content-section {
    background-color: #fff;
    padding: 60px 0 80px;
}

    .promociones-content-section .container {
        max-width: 1240px;
    }

.promociones-page-title {
    font-family: var(--font-primary);
    font-weight: 700;
    font-size: 63px;
    color: var(--mitsubishi-black);
    margin-bottom: 1.25rem;
}

/* --- Intro y LEER MÁS --- */
.promo-leer-mas-text {
    font-weight: 700 !important;
}

.promociones-intro {
    margin-bottom: 25px;
}

.promociones-intro-p {
    font-family: var(--font-primary);
    font-weight: 400;
    font-size: 1rem;
    color: var(--mitsubishi-black);
    line-height: 1.6;
    margin-bottom: 1rem;
}

.promociones-intro-extra {
    display: none;
    margin-bottom: 1rem;
}

    .promociones-intro-extra.is-visible {
        display: block;
    }

.promociones-leer-mas-wrap {
    margin-top: 0.5rem;
}

.promociones-leer-mas-btn {
    background: none;
    border: none;
    padding: 0;
    font-family: var(--font-primary);
    font-weight: 700;
    font-size: 0.95rem;
    color: var(--mitsubishi-black);
    text-decoration: underline;
    cursor: pointer;
    display: inline-flex;
    align-items: center;
    gap: 0.25rem;
}

    .promociones-leer-mas-btn:hover {
        color: var(--mitsubishi-red);
    }

    .promociones-leer-mas-btn .promo-leer-mas-icon {
        font-size: 0.85em;
        transition: transform 0.2s ease;
    }

        .promociones-leer-mas-btn .promo-leer-mas-icon.promo-icon-up {
            transform: rotate(-90deg);
        }

/* --- Grid de cards (2 cols desktop) --- */
.promociones-grid {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 2.5rem;
}

.promociones-card {
    background: #fff;
    overflow: hidden;
    display: flex;
    flex-direction: column;
}

.promociones-card-banner {
    position: relative;
    width: 100%;
    overflow: hidden;
    background: #f0f0f0;
}

    .promociones-card-banner img {
        width: 100%;
        height: auto;
        display: block;
        object-fit: cover;
        aspect-ratio: 610 / 311;
    }

.promociones-card-body {
    padding: 1.5rem 0 0;
    flex: 1;
    display: flex;
    flex-direction: column;
}

.promociones-card-title {
    font-family: var(--font-primary);
    font-weight: 700;
    font-size: 36px;
    color: var(--mitsubishi-black);
    margin-bottom: 0.75rem;
    line-height: 1.3;
}

.promociones-card-desc {
    font-family: var(--font-primary);
    font-weight: 400;
    font-size: 16px;
    color: #333;
    line-height: 1.55;
    margin-bottom: 1rem;
}

.promociones-card-mas-detalles {
    font-family: var(--font-primary);
    font-weight: 700;
    font-size: 14px;
    color: var(--mitsubishi-black);
    text-decoration: underline;
    margin-bottom: 1.25rem;
    align-self: flex-start;
}

    .promociones-card-mas-detalles:hover {
        color: var(--mitsubishi-red);
    }

    .promociones-card-mas-detalles .bi {
        font-size: 0.85em;
    }

.promociones-card-ctas {
    display: flex;
    flex-wrap: wrap;
    gap: 0.75rem;
}

.promociones-card-cta,
.promociones-card-cta-outline {
    display: inline-block;
    font-family: var(--font-primary);
    font-weight: 700;
    font-size: 15px;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    padding: 12px 24px;
    text-align: center;
    transition: all 0.25s ease;
    text-decoration: none;
}

.promociones-card-cta {
    background-color: var(--mitsubishi-red);
    color: #fff;
    border: 2px solid var(--mitsubishi-red);
}

    .promociones-card-cta:hover {
        background-color: #000;
        border-color: #000;
        color: #fff;
    }

.promociones-card-cta-outline {
    background: #fff;
    color: var(--mitsubishi-black);
    border: 2px solid var(--mitsubishi-black);
}

    .promociones-card-cta-outline:hover {
        background: #000;
        color: #fff;
        border-color: #000;
    }

/* --- Responsive promociones --- */
@media (max-width: 768px) {
    .promociones-banner {
        height: 400px;
    }

    .promociones-banner-title {
        font-size: 2rem;
    }

    .promociones-banner-desc {
        font-size: 1rem;
    }

    .promociones-content-section {
        padding: 40px 0 60px;
    }

    .promociones-page-title {
        font-size: 1.5rem;
        margin-bottom: 1rem;
    }

    .promociones-intro {
        margin-bottom: 2rem;
    }

    .promociones-intro-p {
        font-size: 0.95rem;
    }

    .promociones-grid {
        grid-template-columns: 1fr;
        gap: 2rem;
    }

    .promociones-card-body {
        padding: 1.25rem 0 0;
    }

    .promociones-card-title {
        font-size: 1.1rem;
    }

    .promociones-card-desc {
        font-size: 0.9rem;
    }

    .promociones-card-ctas {
        flex-direction: column;
    }

    .promociones-card-cta,
    .promociones-card-cta-outline {
        width: 100%;
        text-align: center;
    }
}

@media (min-width: 769px) and (max-width: 991px) {
    .promociones-grid {
        grid-template-columns: repeat(2, 1fr);
        gap: 1.75rem;
    }
}

/* =========================================
   MODAL PROMOCIONES (MÁS DETALLES)
   ========================================= */

.promo-modal-overlay {
    position: fixed;
    inset: 0;
    z-index: 9999;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 40px;
    background: rgba(0,0,0,.7);
    overflow-y: auto;
}

.promo-modal-overlay--hidden {
    display: none !important;
}

.promo-modal {
    position: relative;
    width: 100%;
    max-width: 1200px;
    max-height: 90vh;
    margin: auto;
    background: #fff;
    border-radius: 10px;
    box-shadow: 0 12px 40px rgba(0, 0, 0, 0.25);
    overflow: hidden;
    display: flex;
    flex-direction: column;
}

.promo-modal__close {
    position: absolute;
    top: 22px;
    right: 26px;
    z-index: 2;
    width: 48px;
    height: 48px;
    padding: 0;
    border: none;
    background: transparent;
    font-size: 44px;
    line-height: 44px;
    font-weight: 700;
    color: #000;
    cursor: pointer;
    flex-shrink: 0;
    opacity: .9;
}

    .promo-modal__close:hover {
        color: var(--mitsubishi-red);
    }

.promo-modal__body {
    padding: 48px 64px 56px 64px;
    overflow-y: auto;
    flex: 1;
    min-height: 0;
}

.promo-modal__title {
    font-family: var(--font-primary);
    font-size: 11pt;
    line-height: 1.4;
    color: #000;
    margin: 0 0 24px 0;
}

.promo-modal__p {
    font-family: var(--font-primary);
    font-size: 11pt;
    font-weight: 400;
    line-height: 1.6;
    color: #000;
    margin: 0 0 16px 0;
}

    .promo-modal__p:last-child {
        margin-bottom: 0;
    }

.promo-modal__list {
    font-family: var(--font-primary);
    font-size: 16px;
    font-weight: 400;
    line-height: 1.6;
    color: #000;
    margin: 0 0 16px 0;
    padding-left: 1.5em;
}

    .promo-modal__list li {
        margin-bottom: 12px;
    }

        .promo-modal__list li:last-child {
            margin-bottom: 0;
        }

@media (max-width: 768px) {
    .promo-modal {
        max-width: 100%;
        max-height: 85vh;
    }

    .promo-modal__body {
        padding: 60px 24px 32px 24px;
    }

    .promo-modal-overlay {
        padding: 10px
    }

    .promo-modal__title {
        font-size: 18px;
        margin-bottom: 20px;
    }

    .promo-modal__p,
    .promo-modal__list {
        font-size: 15px;
    }
}

/* =========================================
   MODAL COTIZA ESTA OFERTA (PROMOCIONES)
   ========================================= */
.promo-modal--form.cotiza-promo-modal {
    max-width: 1240px;
    max-height: 92vh;
}

.cotiza-promo-modal-div {
    padding: 15px 0 0 0;
}

.cotiza-promo-modal__heading {
    font-family: var(--font-primary);
    font-size: 36px;
    font-weight: 700;
    color: #000;
    margin: 0 0 24px 0;
    text-transform: uppercase;
    letter-spacing: 0.05em;
}

.cotiza-promo-modal__body {
    padding: 48px 48px 40px 48px;
}

.cotiza-promo-form .form-input.floating-label {
    margin-bottom: 0;
}

.cotiza-promo-privacy {
    margin: 1.5rem 0 1rem 0;
    padding: 1.25rem;
}

.cotiza-promo-actions {
    margin-top: 2.5rem;
}

/* Botón ENVIAR del modal Cotiza y Cotizar Accesorios */
#cotizaPromoModalOverlay .cotiza-promo-actions .cita-servicio-btn-submit,
#cotizaAccesoriosModalOverlay .cotiza-promo-actions .cita-servicio-btn-submit {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    max-width: 180px;
    min-height: 54px;
    padding: 14px 40px;
    background-color: var(--mitsubishi-red) !important;
    color: #fff !important;
    border: 2px solid var(--mitsubishi-red) !important;
    border-radius: 0;
    font-weight: 700;
    font-size: 1rem;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    text-decoration: none;
    cursor: pointer;
    transition: background-color 0.2s ease, color 0.2s ease, border-color 0.2s ease;
}

    #cotizaPromoModalOverlay .cotiza-promo-actions .cita-servicio-btn-submit:hover,
    #cotizaAccesoriosModalOverlay .cotiza-promo-actions .cita-servicio-btn-submit:hover {
        background-color: #000 !important;
        color: #fff !important;
        border-color: #000 !important;
    }

/* Modal Cotizar Accesorios  */
.cotiza-accesorios-modal__heading {
    text-transform: none;
}

#cotizaAccesoriosModalOverlay .cotiza-promo-form .row.g-3 + .row.g-3,
#cotizaAccesoriosModalOverlay .cotiza-promo-form .cotiza-promo-modal-div {
    margin-top: 1.5rem;
}

#cotizaAccesoriosModalOverlay .cotiza-promo-form .cotiza-promo-modal-div {
    padding-top: 0;
}

@media (max-width: 768px) {
    .cotiza-promo-modal__body {
        padding: 48px 24px 32px 24px;
    }

    .cotiza-promo-modal__heading {
        font-size: 18px;
        margin-bottom: 20px;
    }
}

/* =========================================================
   FINANCIAMIENTO – HERO
   ========================================================= */

.hero-financiamiento {
    position: relative;
    height: 550px;
    width: 100%;
    overflow: hidden;
    background-position: center 80%;
}

    .hero-financiamiento .hero-bg {
        position: absolute;
        inset: 0;
        width: 100%;
        height: 100%;
        object-fit: cover;
    }

    .hero-financiamiento .hero-overlay {
        position: absolute;
        inset: 0;
        background: rgba(0, 0, 0, 0.55);
        z-index: 1;
    }

    .hero-financiamiento .hero-content {
        position: absolute;
        left: 50%;
        top: 40%;
        transform: translate(-50%, -52%);
        z-index: 2;
        max-width: 900px;
        width: min(92%, 980px);
        margin: 0;
        padding: 0 20px;
        text-align: center;
        color: #fff;
    }

    .hero-financiamiento h1 {
        font-size: 84px;
        font-weight: 700;
        margin-bottom: 24px;
    }

    .hero-financiamiento p {
        font-size: 21px;
        line-height: 1.6;
        margin-bottom: 32px;
    }


/* =========================================================
   SPLIT SECTIONS (ZIG-ZAG)
   ========================================================= */

.split-section {
    display: flex;
    min-height: 550px;
    width: 100%;
}

    .split-section.reverse {
        flex-direction: row-reverse;
    }

.split-image,
.split-content {
    width: 50%;
}

    .split-image img {
        width: 100%;
        height: 100%;
        object-fit: cover;
    }

/* =========================================================
   CONTENT BLOCKS
   ========================================================= */

.split-content {
    padding: 80px 80px;
    display: flex;
    flex-direction: column;
    justify-content: center;
}

    .split-content h2 {
        font-size: 42px;
        font-weight: 700;
        margin-bottom: 20px;
    }

    .split-content p {
        font-size: 16px;
        line-height: 1.7;
        margin-bottom: 16px;
    }

    .split-content ul {
        padding-left: 18px;
        margin-bottom: 28px;
    }

        .split-content ul li {
            font-size: 16px;
            line-height: 1.6;
            margin-bottom: 10px;
        }

    /* =========================================================
   DARK / LIGHT VARIANTS
   ========================================================= */

    .split-content.dark {
        background: #000;
        color: #fff;
    }

        .split-content.dark h2,
        .split-content.dark p,
        .split-content.dark li {
            color: #fff;
        }

    .split-content.light {
        background: #fff;
        color: #000;
    }

        .split-content.light h2,
        .split-content.light p,
        .split-content.light li {
            color: #000;
        }

/* =========================================================
   BUTTONS & LINKS
   ========================================================= */

.btn-outline {
    display: inline-block;
    padding: 14px 34px;
    border: 2px solid #000;
    background: transparent;
    color: #000;
    text-decoration: none;
    font-size: 14px;
    font-weight: 600;
    letter-spacing: 1px;
    width: fit-content;
    transition: background-color .25s ease, color .25s ease, border-color .25s ease;
}

    /* Hover en fondo claro */
    .btn-outline:hover {
        background-color: #000;
        color: #fff;
        border-color: #000;
    }

/* ===== CONTENEDOR OSCURO ===== */

.split-content.dark .btn-outline {
    border-color: #fff;
    color: #fff;
    background: transparent;
}

    /* Hover en fondo oscuro */
    .split-content.dark .btn-outline:hover {
        background-color: #fff;
        color: #000;
        border-color: #fff;
    }

/* =========================================================
   RESPONSIVE
   ========================================================= */

@media (max-width: 1024px) {
    .split-content {
        padding: 60px 40px;
    }

    .hero-financiamiento h1,
    .hero-financiamiento .hero-title {
        font-size: 48px !important;
    }

    .hero-financiamiento p,
    .hero-financiamiento .hero-text {
        font-size: 18px !important;
    }
}

@media (max-width: 768px) {

    /* Móvil: imagen reducida arriba (solo título "Financiamiento" encima),
       texto + LEER MÁS en bloque negro debajo */
    .hero-financiamiento {
        height: auto !important;
        min-height: 0 !important;
        padding-top: 280px !important;
        position: relative;
        overflow: hidden;
    }

        /* Imagen fija en la parte superior, altura fija */
        .hero-financiamiento .hero-bg {
            position: absolute !important;
            top: 0 !important;
            left: 0 !important;
            right: 0 !important;
            width: 100% !important;
            height: 280px !important;
            object-fit: cover !important;
            object-position: center 60%;
        }

        .hero-financiamiento .hero-overlay {
            position: absolute !important;
            top: 0 !important;
            left: 0 !important;
            right: 0 !important;
            height: 280px !important;
        }

        /* Bloque negro debajo: párrafo + LEER MÁS */
        .hero-financiamiento .hero-content {
            position: relative !important;
            left: auto !important;
            top: auto !important;
            transform: none !important;
            width: 100% !important;
            padding: 24px 20px !important;
            margin: 0 !important;
            background: #000 !important;
            color: #fff;
            text-align: center;
        }

        /* Título "Financiamiento" superpuesto solo en la imagen (centrado en el área 0–280px) */
        .hero-financiamiento .hero-title {
            position: absolute !important;
            top: -140px !important;
            left: 50% !important;
            transform: translate(-50%, -50%) !important;
            width: 100% !important;
            padding: 0 20px !important;
            margin: 0 !important;
            font-size: 32px !important;
            line-height: 1.15 !important;
            text-align: center;
            z-index: 2;
        }

        .hero-financiamiento p,
        .hero-financiamiento .hero-text {
            font-size: 16px !important;
            line-height: 1.5 !important;
        }

        .hero-financiamiento .hero-text--extra {
            font-size: 15px !important;
        }

        .hero-financiamiento .hero-link {
            margin-top: 16px;
        }

        /* Expandido: el título sigue en la imagen, el extra en el bloque negro */
        .hero-financiamiento.is-expanded .hero-content {
            transform: none !important;
        }

    .split-section,
    .split-section.reverse {
        flex-direction: column;
    }

    /* Zigzag en desktop: en móvil imagen arriba, texto abajo (reverse para secciones donde el texto va primero en DOM) */
    .split-section-reverse-mobile {
        flex-direction: column-reverse;
    }

    .split-image,
    .split-content {
        width: 100%;
    }

    .split-image {
        height: 260px;
        min-height: 220px;
    }

    .split-content {
        padding: 40px 20px !important;
    }

        .split-content h2 {
            font-size: 26px !important;
            margin-bottom: 16px !important;
        }

        .split-content p {
            font-size: 15px !important;
            line-height: 1.6 !important;
        }

        .split-content ul li {
            font-size: 14px !important;
            line-height: 1.55 !important;
        }

        .split-content .btn-outline {
            font-size: 13px;
            padding: 12px 28px;
        }

    /* Botones COTIZAR expandidos y centrados solo en móvil – Financiamiento */
    body.page-financiamiento .split-content .btn-outline {
        width: 100%;
        display: flex;
        align-items: center;
        justify-content: center;
        text-align: center;
    }

    .cita-servicio-step-actions {
        display: flex !important;
        flex-direction: row !important;
        align-items: center;
        gap: 20px;
    }

    .cita-servicio-btn-back,
    .cita-servicio-btn-next {
        display: inline-flex !important;
        width: auto !important;
        white-space: nowrap;
    }
}

/* Financiamiento – pantallas muy pequeñas */
@media (max-width: 576px) {
    .hero-financiamiento {
        padding-top: 240px !important;
    }

        .hero-financiamiento .hero-bg {
            height: 240px !important;
        }

        .hero-financiamiento .hero-overlay {
            height: 240px !important;
        }

        .hero-financiamiento .hero-title {
            top: -120px !important;
        }

        .hero-financiamiento .hero-content {
            padding: 20px 16px !important;
        }

        .hero-financiamiento h1,
        .hero-financiamiento .hero-title {
            font-size: 26px !important;
        }

        .hero-financiamiento p,
        .hero-financiamiento .hero-text {
            font-size: 14px !important;
        }

    .split-content {
        padding: 32px 16px !important;
    }

        .split-content h2 {
            font-size: 22px !important;
        }

        .split-content p,
        .split-content ul li {
            font-size: 14px !important;
        }
}

/* =========================
   HERO FINANCIAMIENTO (DESKTOP)
   ========================= */

.hero-financiamiento {
    position: relative;
    height: 600px;
    background-size: cover;
    background-position: center 60%;
    background-repeat: no-repeat;
    overflow: hidden;
}

    .hero-financiamiento .hero-overlay {
        position: absolute;
        inset: 0;
        background: rgba(0,0,0,.50);
    }

    .hero-financiamiento .hero-content {
        position: absolute;
        left: 50%;
        top: 40%;
        transform: translate(-50%, -52%);
        width: min(980px, 92%);
        text-align: center;
        color: #fff;
        z-index: 2;
        transition: transform .35s ease;
    }

    .hero-financiamiento .hero-title {
        font-size: 92px;
        font-weight: 800;
        letter-spacing: .5px;
        margin: 0 0 10px 0;
        line-height: 1.02;
    }

    .hero-financiamiento .hero-text {
        font-size: 22px;
        line-height: 1.6;
        margin: 0 auto;
        max-width: 980px;
        text-shadow: 0 1px 2px rgba(0,0,0,.35);
    }

    .hero-financiamiento .hero-link {
        display: inline-flex;
        align-items: center;
        justify-content: center;
        gap: 8px;
        margin-top: 22px;
        color: #fff;
        text-decoration: none;
        font-weight: 700;
        letter-spacing: .5px;
        cursor: pointer;
        user-select: none;
    }

        .hero-financiamiento .hero-link:hover {
            opacity: 1 !important;
            text-decoration: underline;
        }

    .hero-financiamiento .hero-chevron {
        font-size: 18px;
        transform: translateY(1px);
        transition: transform 0.6s ease;
    }

    /* TEXTO EXTRA: */
    .hero-financiamiento .hero-extra {
        max-height: 0;
        opacity: 0;
        overflow: hidden;
        transition: max-height 0.9s cubic-bezier(0.4, 0, 0.2, 1), opacity 0.6s ease;
    }

    .hero-financiamiento .hero-text--extra {
        margin-top: 18px;
        font-size: 22px;
        line-height: 1.6;
    }

    /* ESTADO EXPANDIDO */
    .hero-financiamiento.is-expanded .hero-extra {
        max-height: 260px;
        opacity: 1;
    }

    .hero-financiamiento.is-expanded .hero-content {
        transform: translate(-50%, -58%);
    }

    .hero-financiamiento.is-expanded .hero-chevron {
        transform: rotate(180deg) translateY(-1px);
    }

    .hero-financiamiento .hero-bg {
        position: absolute;
        inset: 0;
        width: 100%;
        height: 100%;
        object-fit: cover;
        object-position: center 90%;
        z-index: 0;
    }


    /* -------------------------
   HERO CTA "LEER MÁS" FIXES
   ------------------------- */

    /* Quita subrayado y cualquier pseudo-elemento global que esté dibujando líneas */
    .hero-financiamiento .hero-link,
    .hero-financiamiento .hero-link:hover,
    .hero-financiamiento .hero-link:focus,
    .hero-financiamiento .hero-link:active {
        text-decoration: none !important;
    }

        .hero-financiamiento .hero-link::before,
        .hero-financiamiento .hero-link::after {
            content: none !important;
        }

    /* Ajuste visual del link */
    .hero-financiamiento .hero-link {
        display: inline-flex;
        align-items: center;
        justify-content: center;
        gap: 10px;
        margin-top: 22px;
        color: #fff;
        font-weight: 700;
        letter-spacing: .5px;
        cursor: pointer;
        user-select: none;
    }

        /* Texto del link */
        .hero-financiamiento .hero-link .hero-link-text {
            display: inline-block;
            padding-bottom: 2px;
            font-weight: 700;
        }

    /* Flecha grande hecha con CSS */
    .hero-financiamiento .hero-chevron {
        width: 12px;
        height: 12px;
        display: inline-block;
        border-right: 3px solid rgba(255,255,255,.95);
        border-bottom: 3px solid rgba(255,255,255,.95);
        position: relative;
        top: -3px;
        transform: rotate(45deg) translateY(-1px);
        transition: transform .55s ease; /* más suave */
    }

    /* Transiciones MÁS LENTAS / suaves */
    .hero-financiamiento .hero-content {
        transition: transform .70s cubic-bezier(.22, .61, .36, 1);
    }

    .hero-financiamiento .hero-extra {
        transition: max-height .75s cubic-bezier(.22, .61, .36, 1), opacity .55s ease;
    }

    /* Estado expandido */
    .hero-financiamiento.is-expanded .hero-chevron {
        transform: rotate(-135deg) translateY(1px); /* apunta hacia arriba */
    }

    .hero-financiamiento .hero-link-text {
        line-height: .5;
    }

    .hero-financiamiento .hero-link:hover .hero-link-text {
        border-bottom-color: #fff; /* BLANCO */
    }

    /* =========================
   HERO CTA – UNDERLINE EN HOVER
   ========================= */

    /* Texto base */
    .hero-financiamiento .hero-link-text {
        position: relative;
        display: inline-block;
    }

        /* Línea (oculta por defecto) */
        .hero-financiamiento .hero-link-text::after {
            content: "";
            position: absolute;
            left: 0;
            right: 0;
            bottom: -6px; /* separación elegante */
            height: 2px;
            background-color: #fff;
            transform: scaleX(0);
            transform-origin: center;
            opacity: 0;
            transition: transform .35s ease, opacity .25s ease;
        }

    /* SOLO en hover */
    .hero-financiamiento .hero-link:hover .hero-link-text::after {
        transform: scaleX(1);
        opacity: 1;
    }

/* =========================
   PLAN REESTRENO – LEER MÁS
   ========================= */

.plan-reestreno-extra {
    max-height: 0;
    overflow: hidden;
    opacity: 0;
    transition: max-height 1s cubic-bezier(.22,.61,.36,1), opacity .6s ease .15s, transform .6s ease;
}

.plan-reestreno.is-expanded .plan-reestreno-extra {
    max-height: 1000px;
    opacity: 1;
}

/* Link */
.plan-reestreno-link {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    margin-top: 18px;
    color: #fff;
    font-weight: 700;
    letter-spacing: .5px;
    text-decoration: none;
    cursor: pointer;
}

/* Texto */
.plan-reestreno-text {
    position: relative;
    font-weight: 700;
}

    /* Línea solo en hover */
    .plan-reestreno-text::after {
        content: "";
        position: absolute;
        left: 0;
        right: 0;
        bottom: -6px;
        height: 2px;
        background: #fff;
        transform: scaleX(0);
        opacity: 0;
        transition: transform .35s ease, opacity .25s ease;
    }

.plan-reestreno-link:hover .plan-reestreno-text::after {
    transform: scaleX(1);
    opacity: 1;
}

/* Flecha */
.plan-reestreno-chevron {
    width: 12px;
    height: 12px;
    border-right: 3px solid #fff;
    border-bottom: 3px solid #fff;
    transform: rotate(45deg);
    transition: transform .45s ease;
}

/* Flecha en expandido */
.plan-reestreno.is-expanded .plan-reestreno-chevron {
    transform: rotate(-135deg);
}

/* =========================
   PLAN TAXI – LEER MÁS (SMOOTH)
   ========================= */

.plan-taxi-extra {
    max-height: 0;
    opacity: 0;
    overflow: hidden;
    transform: translateY(-6px);
    transition: max-height 1s cubic-bezier(.22,.61,.36,1), opacity .6s ease .15s, transform .6s ease;
}

.plan-taxi.is-expanded .plan-taxi-extra {
    max-height: 1200px;
    opacity: 1;
    transform: translateY(0);
}

/* Link */
.plan-taxi-link {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    margin-top: 22px;
    color: #fff;
    font-weight: 700;
    letter-spacing: .5px;
    text-decoration: none;
    cursor: pointer;
}

/* Texto */
.plan-taxi-text {
    position: relative;
    font-weight: 700;
}

    /* Línea solo en hover */
    .plan-taxi-text::after {
        content: "";
        position: absolute;
        left: 0;
        right: 0;
        bottom: -6px;
        height: 2px;
        background: #fff;
        transform: scaleX(0);
        opacity: 0;
        transition: transform .35s ease, opacity .25s ease;
    }

.plan-taxi-link:hover .plan-taxi-text::after {
    transform: scaleX(1);
    opacity: 1;
}

/* Flecha */
.plan-taxi-chevron {
    width: 12px;
    height: 12px;
    border-right: 3px solid #fff;
    border-bottom: 3px solid #fff;
    transform: rotate(45deg);
    transition: transform .45s ease;
}

/* Flecha en expandido */
.plan-taxi.is-expanded .plan-taxi-chevron {
    transform: rotate(-135deg) translateY(1px);
}

/* =====================================================
   PAGE GARANTÍA – FULL WIDTH LAYOUT
   ===================================================== */

/* ---------- HERO ---------- */

.page-garantia .garantia-hero {
    position: relative;
    width: 100vw;
    margin-left: calc(-50vw + 50%);
}

    .page-garantia .garantia-hero img {
        width: 100%;
        height: 80vh;
        object-fit: cover;
        display: block;
    }

.page-garantia .section-title-center {
    width: 100vw;
    margin-left: calc(-50vw + 50%);
    background: #fff;
    text-align: center;
    padding: 60px 20px 80px;
    margin-top: -1px; /* evita línea blanca */
}

    .page-garantia .section-title-center h2 {
        font-size: 63px;
    }

.page-garantia .garantia-hero-content {
    position: absolute;
    inset: 0;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    text-align: center;
    color: #fff;
    padding: 0 20px;
    background: rgba(0, 0, 0, 0.35);
}

    .page-garantia .garantia-hero-content h1 {
        font-size: 3.5rem;
        margin-bottom: 15px;
    }

    .page-garantia .garantia-hero-content p {
        max-width: 800px;
        font-size: 1.1rem;
    }

/* ---------- SECCIONES IMAGEN / TEXTO ---------- */

.page-garantia .garantia-section {
    display: flex;
    width: 100vw;
    margin-left: calc(-50vw + 50%);
}

.page-garantia .garantia-img,
.page-garantia .garantia-text {
    width: 50%;
}

    .page-garantia .garantia-img img {
        width: 100%;
        height: 100%;
        object-fit: cover;
        display: block;
    }

.page-garantia .garantia-text {
    padding: 80px;
    display: flex;
    flex-direction: column;
    justify-content: center;
}

    .page-garantia .garantia-text h2 {
        font-size: 2.62rem;
        margin-bottom: 15px;
    }

    .page-garantia .garantia-text p {
        font-size: 1rem;
        line-height: 1.6;
    }

/* ---------- BOTONES ---------- */

.page-garantia .btn-outline {
    display: inline-block;
    border: 1px solid #000;
    padding: 12px 32px;
    margin-top: 25px;
    text-transform: uppercase;
    font-weight: 600;
    letter-spacing: 1px;
    color: #000;
    background: transparent;
    text-decoration: none;
    transition: all 0.3s ease;
}

    .page-garantia .btn-outline:hover {
        background: #000;
        color: #fff;
    }

/* =====================================================
   RESPONSIVE
   ===================================================== */

/*  Mobile */
@media (max-width: 767px) {

    .page-garantia .garantia-hero {
        height: auto;
    }

        .page-garantia .garantia-hero img {
            height: 22vh;
            object-fit: cover;
            object-position: center center;
        }

    .page-garantia .garantia-hero-content h1 {
        font-size: 2.2rem;
    }

    .page-garantia .garantia-section {
        flex-direction: column;
    }

    .page-garantia .section-title-center {
        text-align: left;
    }

        .page-garantia .section-title-center h2,
        .page-garantia .section-title-center p {
            text-align: left;
        }

        .page-garantia .section-title-center h2 {
            font-size: 28px;
            line-height: 33px;
        }

    .page-garantia .garantia-img,
    .page-garantia .garantia-text {
        width: 100%;
    }

    .page-garantia .garantia-text {
        padding: 40px 20px;
        text-align: left;
    }

        .page-garantia .garantia-text h2,
        .page-garantia .garantia-text p {
            text-align: left;
        }

        .page-garantia .garantia-text h2 {
            font-size: 28px !important;
            margin-bottom: 15px;
        }

    .page-garantia .btn-outline {
        display: block;
        width: 100%;
        text-align: center;
    }

    body.page-garantia .garantia-section.garantia-invert-mobile {
        flex-direction: column-reverse !important;
    }
}

/*  Tablet */
@media (min-width: 768px) and (max-width: 1199px) {

    .page-garantia .garantia-hero img {
        height: 65vh;
    }

    .page-garantia .garantia-hero-content h1 {
        font-size: 2.8rem;
    }

    .page-garantia .section-title-center h2 {
        font-size: 43px;
        line-height: 33px;
    }

    .page-garantia .garantia-text {
        padding: 60px;
    }
}

/*  Desktop */
@media (min-width: 1200px) {

    .page-garantia .garantia-hero img {
        height: 80vh;
    }

    .page-garantia .garantia-hero-content h1 {
        font-size: 3.5rem;
    }
}



/* =========================
   ZIG ZAG CONTENT
========================= */
.content-zigzag {
    width: 100%;
    padding: 80px 0;
}

.zigzag-row {
    display: flex;
    align-items: center;
    max-width: 1400px;
    margin: 0 auto;
}

.zigzag-image,
.zigzag-content {
    width: 50%;
}

    .zigzag-image img {
        width: 100%;
        height: auto;
        display: block;
    }

.zigzag-content {
    padding: 0 60px;
}

    .zigzag-content h3 {
        font-size: 36px;
        margin-bottom: 20px;
    }

    .zigzag-content p {
        font-size: 16px;
        line-height: 1.6;
        margin-bottom: 30px;
    }

.content-zigzag.reverse .zigzag-row {
    flex-direction: row-reverse;
}

@media (max-width: 991px) {

    .hero-section {
        height: 450px;
    }

        .hero-section h1 {
            font-size: 42px;
        }

        .hero-section p {
            font-size: 16px;
        }

    .zigzag-row {
        flex-direction: column;
    }

    .zigzag-image,
    .zigzag-content {
        width: 100%;
    }

    .zigzag-content {
        padding: 40px 20px 0;
    }
}



@media (max-width: 768px) {
    .privacy-email-box-tool {
        font-size: 13px !important;
        line-height: 1.4 !important;
    }
}

@media (max-width: 480px) {
    .privacy-email-box-tool {
        font-size: 12px !important;
        line-height: 1.35 !important;
    }
}

/* =====================================
   MOBILE – REDUCIR ESPACIO HEADER / TÍTULO
   ===================================== */

@media (max-width: 767px) {

    /* Reduce el margen superior del contenido */
    .form-section .form-box-wrap {
        margin-top: 1rem !important; /* antes 3rem */
    }
}

/* =====================================
   HEADER – ACTIVO CITA DE SERVICIO (FIX)
   ===================================== */

/* Link principal del menú: <a class="nav-link" href="/cita-de-servicio"> */
body.page-cita-servicio nav.navbar .navbar-nav .nav-link[href*="/cita-de-servicio"] {
    color: var(--mitsubishi-red) !important;
}

/* Toggle PROPIETARIOS ( */
body.page-cita-servicio nav.navbar .navbar-nav .nav-link.nav-propietarios {
    color: var(--mitsubishi-red) !important;
}

/* Item dentro del dropdown Propietarios */
body.page-cita-servicio .dropdown-menu a.dropdown-item[href*="/cita-de-servicio"] {
    color: var(--mitsubishi-red) !important;
    font-weight: 700 !important;
    background-color: rgba(230, 0, 18, 0.06);
}

/* En móvil tu CSS fuerza .navbar-nav .nav-link { color:#000 !important; }
   Aquí garantizamos que el activo siga en rojo */
@media (max-width: 1199px) {
    body.page-cita-servicio nav.navbar .navbar-nav .nav-link[href*="/cita-de-servicio"],
    body.page-cita-servicio nav.navbar .navbar-nav .nav-link.nav-propietarios {
        color: var(--mitsubishi-red) !important;
    }
}

/* =====================================
   BOTTOM NAV – ACTIVO CITA DE SERVICIO
   ===================================== */

body.page-cita-servicio
.bottom-nav-bar
.nav-item-link[href*="/cita-de-servicio"] {
    background-color: #000 !important;
}

    /* Asegurar texto e ícono blancos */
    body.page-cita-servicio
    .bottom-nav-bar
    .nav-item-link[href*="/cita-de-servicio"] i,
    body.page-cita-servicio
    .bottom-nav-bar
    .nav-item-link[href*="/cita-de-servicio"] span {
        color: #fff !important;
    }

body.page-cita-servicio
.dropdown-menu a.dropdown-item[href*="cita-de-servicio"] {
    color: var(--mitsubishi-red) !important;
    font-weight: 700;
    background-color: rgba(230, 0, 18, 0.06);
}

body.page-cita-servicio a.nav-link[href*="cita-de-servicio"] {
    color: var(--mitsubishi-red) !important;
}
/* =====================================
   HEADER – ACTIVO PRUEBA DE MANEJO
   ===================================== */

/* Link principal del menú */
body.page-prueba-manejo
nav.navbar
.navbar-nav
.nav-link[href*="prueba-de-manejo"] {
    color: var(--mitsubishi-red) !important;
}

/* Toggle COMPRAR */
body.page-prueba-manejo
nav.navbar
.navbar-nav
.nav-link#comprarDropdown {
    color: var(--mitsubishi-red) !important;
}



/* =====================================
   SUBMENU ACTIVO – PRUEBA DE MANEJO
   ===================================== */

body.page-prueba-manejo
.dropdown-menu
a.dropdown-item[href*="prueba-de-manejo"] {
    color: var(--mitsubishi-red) !important;
    font-weight: 700;
}

/* =====================================
   BOTTOM NAV – ACTIVO PRUEBA DE MANEJO
   ===================================== */

body.page-prueba-manejo
.bottom-nav-bar
.nav-item-link[href*="prueba-de-manejo"] {
    background-color: #000 !important;
}

    body.page-prueba-manejo
    .bottom-nav-bar
    .nav-item-link[href*="prueba-de-manejo"] i,
    body.page-prueba-manejo
    .bottom-nav-bar
    .nav-item-link[href*="prueba-de-manejo"] span {
        color: #fff !important;
    }

/* Botón ENVIAR centrado solo en móvil – Prueba de Manejo, Cita de Servicio, Solicitud de Cotización y Solicitud de Financiamiento */
@media (max-width: 768px) {
    body.page-prueba-manejo .cita-servicio-step-actions-enviar .cita-servicio-btn-submit,
    body.page-cita-servicio .cita-servicio-step-actions-enviar .cita-servicio-btn-submit,
    body.page-cotizacion .cita-servicio-step-actions-enviar .cita-servicio-btn-submit,
    body.page-solicitud-financiamiento .cita-servicio-step-actions-enviar .cita-servicio-btn-submit {
        display: flex;
        align-items: center;
        justify-content: center;
        text-align: center;
    }
}

/* =====================================
   HEADER – ACTIVO SOLICITA UNA COTIZACIÓN
   ===================================== */

/* Link del submenu */
body.page-cotizacion
.dropdown-menu
a.dropdown-item[href*="solicita-una-cotizacion"] {
    color: var(--mitsubishi-red) !important;
    font-weight: 700;
}

/* Toggle COMPRAR */
body.page-cotizacion
nav.navbar
.navbar-nav
.nav-link#comprarDropdown {
    color: var(--mitsubishi-red) !important;
}

/* Mobile */
@media (max-width: 1199px) {
    body.page-cotizacion
    nav.navbar
    .navbar-nav
    .nav-link#comprarDropdown {
        color: var(--mitsubishi-red) !important;
    }
}

/* =====================================
   BOTTOM NAV – ACTIVO COTIZAR
   ===================================== */

body.page-cotizacion
.bottom-nav-bar
.nav-item-link[href*="solicita-una-cotizacion"] {
    background-color: #000 !important;
}

    body.page-cotizacion
    .bottom-nav-bar
    .nav-item-link[href*="solicita-una-cotizacion"] i,
    body.page-cotizacion
    .bottom-nav-bar
    .nav-item-link[href*="solicita-una-cotizacion"] span {
        color: #fff !important;
    }


/* ===============================
   HEADER – ACTIVO CONTACTO 
================================ */

/* Texto rojo SOLO para Contacto */
body.page-contacto
#contactoDropdown {
    color: var(--mitsubishi-red) !important;
    font-weight: 700 !important;
}

    /* Flechita del dropdown en rojo */
    body.page-contacto
    #contactoDropdown::after {
        border-top-color: var(--mitsubishi-red) !important;
    }

/* Item activo dentro del dropdown */
body.page-contacto
.dropdown-menu
.dropdown-item[href*="/contactanos"] {
    color: var(--mitsubishi-red) !important;
    font-weight: 700 !important;
    background-color: rgba(230, 0, 18, 0.06);
}


@media (max-width: 1199px) {
    body.page-contacto
    nav.navbar
    .navbar-nav
    .nav-item.dropdown > .nav-link {
        color: var(--mitsubishi-red) !important;
    }
}

/* ===========================
   MENU MOVIL – ACTIVO CORRECTO
   =========================== */

body.page-contacto .mobile-menu a {
    color: #000 !important; /* reset */
}

    body.page-contacto .mobile-menu a.active {
        color: var(--mitsubishi-red) !important;
        font-weight: 700;
    }

    /* evita que otros se marquen por hover heredado */
    body.page-contacto .mobile-menu a:not(.active):hover {
        color: #000 !important;
    }

/* ==================================
   HEADER – ACTIVO HORARIOS Y UBICACIÓN
=================================== */

/* Dropdown CONTACTO en rojo */
body.page-horarios-ubicacion
#contactoDropdown {
    color: var(--mitsubishi-red) !important;
    font-weight: 700 !important;
}

    /* Flecha roja */
    body.page-horarios-ubicacion
    #contactoDropdown::after {
        border-top-color: var(--mitsubishi-red) !important;
    }

/* Item activo: Horarios y Ubicación */
body.page-horarios-ubicacion
.dropdown-menu
.dropdown-item[href*="horarios-y-ubicacion"] {
    color: var(--mitsubishi-red) !important;
    font-weight: 700 !important;
    background-color: rgba(230, 0, 18, 0.06);
}

/* Mobile */
@media (max-width: 1199px) {
    body.page-horarios-ubicacion
    #contactoDropdown {
        color: var(--mitsubishi-red) !important;
    }
}


/* ==================================
   HEADER – ACTIVO PREGUNTAS FRECUENTES
=================================== */

/* CONTACTO (dropdown padre) en rojo */
body.page-preguntas-frecuentes
#contactoDropdown {
    color: var(--mitsubishi-red) !important;
    font-weight: 700 !important;
}

    /* Flecha roja */
    body.page-preguntas-frecuentes
    #contactoDropdown::after {
        border-top-color: var(--mitsubishi-red) !important;
    }

/* Item activo: Preguntas Frecuentes */
body.page-preguntas-frecuentes
.dropdown-menu
.dropdown-item[href*="preguntas-frecuentes"] {
    color: var(--mitsubishi-red) !important;
    font-weight: 700 !important;
    background-color: rgba(230, 0, 18, 0.06);
}

/* Mobile */
@media (max-width: 1199px) {
    body.page-preguntas-frecuentes
    #contactoDropdown {
        color: var(--mitsubishi-red) !important;
    }
}


/* ==================================
   HEADER – ACTIVO MANTENIMIENTO
=================================== */

/* PROPIETARIOS (dropdown padre) */
body.page-mantenimiento
#propietariosDropdown {
    color: var(--mitsubishi-red) !important;
    font-weight: 700 !important;
}

    /* Flecha roja */
    body.page-mantenimiento
    #propietariosDropdown::after {
        border-top-color: var(--mitsubishi-red) !important;
    }

/* Item activo: Mantenimiento */
body.page-mantenimiento
.dropdown-menu
.dropdown-item[href*="mantenimiento"] {
    color: var(--mitsubishi-red) !important;
    font-weight: 700 !important;
    background-color: rgba(230, 0, 18, 0.06);
}

/* Mobile */
@media (max-width: 1199px) {
    body.page-mantenimiento
    #propietariosDropdown {
        color: var(--mitsubishi-red) !important;
    }
}


/* ==================================
   HEADER – ACTIVO PROMOCIONES
=================================== */

/* COMPRAR (dropdown padre) */
body.page-promociones
#comprarDropdown {
    color: var(--mitsubishi-red) !important;
    font-weight: 700 !important;
}

    /* Flecha roja */
    body.page-promociones
    #comprarDropdown::after {
        border-top-color: var(--mitsubishi-red) !important;
    }

/* Item activo: Promociones */
body.page-promociones
.dropdown-menu
.dropdown-item[href*="promociones"] {
    color: var(--mitsubishi-red) !important;
    font-weight: 700 !important;
    background-color: rgba(230, 0, 18, 0.06);
}

/* Mobile */
@media (max-width: 1199px) {
    body.page-promociones
    #comprarDropdown {
        color: var(--mitsubishi-red) !important;
    }
}

/* =====================================
   BOTTOM NAV – ACTIVO PROMOCIONES
   ===================================== */

body.page-promociones
.bottom-nav-bar
.nav-item-link[href*="promociones"] {
    background-color: #000 !important;
}

    body.page-promociones
    .bottom-nav-bar
    .nav-item-link[href*="promociones"] i,
    body.page-promociones
    .bottom-nav-bar
    .nav-item-link[href*="promociones"] span {
        color: #fff !important;
    }



/* ==================================
   HEADER – ACTIVO FINANCIAMIENTO
=================================== */

/* COMPRAR (dropdown padre) */
body.page-financiamiento
#comprarDropdown {
    color: var(--mitsubishi-red) !important;
    font-weight: 700 !important;
}

    /* Flecha roja */
    body.page-financiamiento
    #comprarDropdown::after {
        border-top-color: var(--mitsubishi-red) !important;
    }

/* Item activo: Financiamiento */
body.page-financiamiento
.dropdown-menu
.dropdown-item[href*="financiamiento"] {
    color: var(--mitsubishi-red) !important;
    font-weight: 700 !important;
    background-color: rgba(230, 0, 18, 0.06);
}

/* Mobile */
@media (max-width: 1199px) {
    body.page-financiamiento
    #comprarDropdown {
        color: var(--mitsubishi-red) !important;
    }
}

/* =========================================
   MENÚ ACTIVO – GARANTÍA
========================================= */

/* PROPIETARIOS (dropdown padre) */
body.page-garantia
#propietariosDropdown {
    color: var(--mitsubishi-red) !important;
    font-weight: 700 !important;
}

    /* Flecha roja */
    body.page-garantia
    #propietariosDropdown::after {
        border-top-color: var(--mitsubishi-red) !important;
    }

/* Item activo: Mantenimiento */
body.page-garantia
.dropdown-menu
.dropdown-item[href*="garantia"] {
    color: var(--mitsubishi-red) !important;
    font-weight: 700 !important;
    background-color: rgba(230, 0, 18, 0.06);
}

/* Mobile */
@media (max-width: 1199px) {
    body.page-mantenimiento
    #propietariosDropdown {
        color: var(--mitsubishi-red) !important;
    }
}



/* =========================================
   CONTACTO – FIX ALINEACIÓN (SOLO ESTA PÁGINA)
   ========================================= */

body.page-contacto .hero-section,
body.page-contacto .hero-content,
body.page-contacto .hero-container {
    text-align: left !important;
    align-items: flex-start !important;
}

/* Título */
body.page-contacto .hero-title {
    text-align: left !important;
    margin-left: 0 !important;
}

/* Texto descriptivo */
body.page-contacto .hero-text {
    text-align: left !important;
    margin-left: 0 !important;
}

@media (max-width: 1199px) {
    body.page-contacto nav.navbar .navbar-nav .nav-item.dropdown > .nav-link {
        color: #000 !important;
    }
}


/* =========================================
   CONTACTO – TAMAÑOS HERO (TÍTULO + TEXTO)
   ========================================= */

body.page-contacto .hero-title {
    font-size: 84px !important;
    line-height: 1.05; /* look Mitsubishi */
    font-weight: 700;
}

body.page-contacto .hero-text {
    font-size: 21px !important;
    line-height: 1.5;
    max-width: 780px;
}

/* =========================================
   CONTACTO – POSICIÓN HERO CONTENT
   ========================================= */

body.page-contacto .hero-section .hero-content {
    position: relative !important;
    top: auto !important;
    left: auto !important;
    transform: none !important;
    padding-top: 80px;
    text-align: left !important;
}

body.page-contacto .hero-section .hero-content {
    padding-left: 0 !important;
    padding-right: 0 !important;
}

/* =========================================
   CONTACTO – BOTÓN "CONTACTO" (HOVER ORIGINAL)
   ========================================= */

body.page-contacto .cita-servicio-btn-submit {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background: var(--mitsubishi-red) !important;
    color: #fff !important;
    border: 2px solid var(--mitsubishi-red) !important;
    border-radius: 0 !important;
    padding: 14px 46px !important;
    font-weight: 700 !important;
    letter-spacing: .12em !important;
    text-transform: uppercase !important;
    text-decoration: none !important;
    transition: background-color .2s ease, color .2s ease, border-color .2s ease, box-shadow .2s ease;
}

    body.page-contacto .cita-servicio-btn-submit:hover {
        background: #fff !important; /* hover blanco */
        color: #000 !important; /* texto negro */
        border-color: #000 !important; /* borde negro */
        text-decoration: none !important;
    }

    body.page-contacto .cita-servicio-btn-submit:focus,
    body.page-contacto .cita-servicio-btn-submit:focus-visible {
        outline: none !important;
        box-shadow: 0 0 0 3px rgba(255,255,255,.35) !important;
    }


/* =========================================
   CONTACTO – TEXTO "Contáctanos"
   ========================================= */

body.page-contacto
#contacto-form
.cita-servicio-intro-text {
    font-size: 24px !important;
    line-height: 1.4;
    color: #333;
    margin-bottom: 20px;
    font-weight: 700;
}


/* =========================================
   CONTACTO – BOTÓN "CONTACTO" (HOVER ORIGINAL)
   ========================================= */

body.page-contacto .cita-servicio-btn-submit-dark {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background: var(--mitsubishi-red) !important;
    color: #fff !important;
    border: 2px solid var(--mitsubishi-red) !important;
    border-radius: 0 !important;
    padding: 14px 46px !important;
    font-weight: 700 !important;
    letter-spacing: .12em !important;
    text-transform: uppercase !important;
    text-decoration: none !important;
    transition: background-color .2s ease, color .2s ease, border-color .2s ease, box-shadow .2s ease;
}

    body.page-contacto .cita-servicio-btn-submit-dark:hover {
        background: #000 !important; /* hover negro */
        color: #fff !important; /* texto blanco */
        border-color: #000 !important; /* borde negro */
        text-decoration: none !important;
    }

    body.page-contacto .cita-servicio-btn-submit-dark:focus,
    body.page-contacto .cita-servicio-btn-submit-dark:focus-visible {
        outline: none !important;
        box-shadow: 0 0 0 3px rgba(255,255,255,.35) !important;
    }

/* ===========================
   CONTACTO – VERSION MOVIL (FIX)
   =========================== */
@media (max-width: 768px) {

    body.page-contacto .hero-section.contact-hero {
        min-height: 320px;
        height: auto !important;
        max-height: none !important;
        padding-bottom: 40px;
        overflow: visible !important;
        background-size: 170% auto !important;
        background-repeat: no-repeat;
        background-position: top !important;
        background-color: #000;
    }

        body.page-contacto .hero-section.contact-hero .hero-content {
            padding: 60px 24px 24px;
            width: 100%;
            max-width: 100%;
            box-sizing: border-box;
        }

    body.page-contacto .hero-title {
        text-align: center !important;
        margin-left: auto !important;
        margin-right: auto !important;
        font-size: 26px !important;
        line-height: 1.2 !important;
        max-width: 100%;
        word-wrap: break-word;
    }

    body.page-contacto .hero-content {
        align-items: center;
        text-align: center;
    }

    /* Separación título–texto 40px y márgenes laterales (solo móvil, solo Contacto) */
    body.page-contacto .hero-text {
        font-size: 16px !important;
        line-height: 1.5;
        max-width: 100%;
        margin: 40px auto 0;
        padding: 0 8px 20px;
    }

    body.page-contacto .hero-content .d-flex.mt-4 {
        margin-top: 20px !important;
    }

    body.page-contacto .hero-content .cita-servicio-btn-submit {
        width: 100%;
        max-width: 280px;
        display: flex !important;
        justify-content: center;
        align-items: center;
        margin: 0 auto;
    }

    /* En móvil el CTA del formulario debe ser full width y visible (solo en Contacto) */
    body.page-contacto #contacto-form .cita-servicio-step-actions-enviar {
        display: flex;
        justify-content: center;
        padding-bottom: 20px;
    }

        body.page-contacto #contacto-form .cita-servicio-step-actions-enviar .cita-servicio-btn-submit-dark {
            width: 100% !important;
            max-width: 100%;
            margin: 0;
            display: flex;
            justify-content: center;
            align-items: center;
        }

    /* Títulos del formulario en móvil */
    body.page-contacto #contacto-form .cita-servicio-title-h1 {
        font-size: 28px;
        line-height: 1.15;
    }

    body.page-contacto #contacto-form .cita-servicio-intro-text {
        font-size: 18px !important;
        line-height: 1.35;
        margin-bottom: 12px;
    }

    body.page-contacto .hero-section .hero-content {
        padding-top: 60px;
    }

    /* Espacio extra para que el botón ENVIAR no quede oculto por la barra inferior */
    body.page-contacto #contacto-form {
        padding-bottom: 90px !important;
    }
}

@media (max-width: 480px) {
    body.page-contacto .hero-section.contact-hero {
        min-height: 320px;
        padding-bottom: 32px;
    }

        body.page-contacto .hero-section.contact-hero .hero-content {
            padding-left: 20px !important;
            padding-right: 20px !important;
        }

    body.page-contacto .hero-title {
        font-size: 22px !important;
    }

    body.page-contacto .hero-text {
        font-size: 15px !important;
        margin-top: 40px !important;
        padding-left: 8px !important;
        padding-right: 8px !important;
    }

    body.page-contacto .hero-content .cita-servicio-btn-submit {
        max-width: 100%;
    }

    body.page-contacto #contacto-form {
        padding-bottom: 100px !important;
    }
}

/* Resoluciones muy estrechas (ej. 283px, 343px): garantizar que el botón CONTACTO siempre se vea */
@media (max-width: 380px) {
    body.page-contacto .hero-section.contact-hero {
        min-height: 280px;
        padding-bottom: 28px;
    }

        body.page-contacto .hero-section.contact-hero .hero-content {
            padding: 50px 20px 20px !important;
        }

    body.page-contacto .hero-title {
        font-size: 20px !important;
    }

    body.page-contacto .hero-text {
        font-size: 14px !important;
        margin-top: 40px !important;
        padding: 0 8px 16px !important;
    }

    body.page-contacto .hero-content .d-flex.mt-4 {
        margin-top: 16px !important;
    }

    body.page-contacto .hero-content .cita-servicio-btn-submit {
        padding: 12px 24px !important;
        font-size: 0.9rem !important;
        flex-shrink: 0;
    }
}

/* ===========================
   CONTACTO – TABLET (AJUSTES)
   =========================== */
@media (min-width: 769px) and (max-width: 1199px) {
    /* Hero: el título 84px se sale en tablet */
    body.page-contacto .hero-title {
        font-size: 40px !important;
        line-height: 1.06;
    }

    body.page-contacto .hero-text {
        font-size: 18px !important;
        line-height: 34px;
        max-width: 720px;
        text-align: center !important;
    }

    body.page-contacto .hero-section .hero-content {
        padding-top: 64px;
        text-align: center;
    }

    /* Formulario: bajar tamaños para que respire */
    body.page-contacto #contacto-form .cita-servicio-title-h1 {
        font-size: 44px;
        line-height: 1.12;
    }

    body.page-contacto #contacto-form .cita-servicio-intro-text {
        font-size: 20px !important;
        line-height: 1.4;
    }

    body.page-contacto #contacto-form .form-box-wrap {
        margin-top: 2rem !important;
    }

    body.page-contacto #contacto-form .cita-servicio-step-actions-enviar .cita-servicio-btn-submit-dark {
        width: 100%;
        max-width: 420px;
    }
}


/* ===========================
   HORARIOS / UBICACIÓN
   TÍTULO DE SEDE (H2)
   =========================== */

/* Desktop */
body.page-contacto
.contacto-main-title
.contacto-title-h1 {
    font-size: 36px !important;
    line-height: 1.2;
    font-weight: 700;
}

/* Tablet */
@media (max-width: 991px) {
    body.page-contacto
    .contacto-main-title
    .contacto-title-h1 {
        font-size: 28px !important;
    }
}

/* Mobile */
@media (max-width: 768px) {
    body.page-contacto
    .contacto-main-title
    .contacto-title-h1 {
        font-size: 21px !important;
        text-align: center;
    }
}

/* =========================================
   ESTILOS PÁGINA MANUALES (prefijo .manuales-*)
   ========================================= */

/* --- Hero --- */
.manuales-hero {
    position: relative;
    width: 100%;
    height: 500px;
    display: flex;
    align-items: center;
    justify-content: center;
    overflow: hidden;
}

.manuales-hero-bg {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 1;
}

    .manuales-hero-bg img {
        width: 100%;
        height: 100%;
        object-fit: cover;
        object-position: center;
    }

.manuales-hero-overlay {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(0, 0, 0, 0.5);
    z-index: 2;
}

.manuales-hero-content {
    position: relative;
    z-index: 3;
    width: 100%;
    text-align: center;
    color: #fff;
}

.manuales-hero-inner {
    max-width: 900px;
    margin: 0 auto;
    padding: 0 20px;
}

.manuales-hero-inner-large {
    max-width: 1200px;
    margin: 0 auto;
    padding: 0 20px;
}

.manuales-hero-title {
    font-family: var(--font-primary);
    font-weight: 700;
    font-size: 52px;
    margin-bottom: 20px;
    line-height: 1.2;
    text-transform: none;
}

.manuales-hero-desc {
    font-family: var(--font-primary);
    font-weight: 400;
    font-size: 20px;
    line-height: 1.6;
    margin: 0;
}

/* --- Sección de Contenido --- */
.manuales-content-section {
    background-color: #fff;
    padding: 60px 0 80px;
}

.manuales-container {
    max-width: 1240px;
}

.manuales-page-subtitle {
    font-family: var(--font-primary);
    font-weight: 700;
    font-size: 63px;
    line-height: 70px;
    letter-spacing: 0;
    color: #181818;
    margin: 0 0 2rem 0;
}

.manuales-section-desc {
    font-family: var(--font-primary);
    font-weight: 400;
    font-size: 1rem;
    line-height: 1.6;
    color: #333;
    margin: 0 0 2.5rem 0;
}

/* --- Título + Combo en misma línea (dropwith-cattitle) --- */
.manuales-section-block {
    margin-bottom: 4rem;
}

    .manuales-section-block:last-child {
        margin-bottom: 0;
    }

.manuales-dropwith-cattitle {
    position: relative;
    margin-bottom: 2rem;
    padding-right: 320px;
    min-height: 44px;
}

.manuales-section-title {
    font-family: var(--font-primary);
    font-weight: 700;
    font-size: 42px;
    color: var(--mitsubishi-black);
    margin: 0;
    line-height: 1.2;
}

.manuales-dropwith-cattitle .manuales-filter-select {
    position: absolute;
    right: 0;
    left: auto;
    top: 0;
    width: 300px;
    height: 44px;
    margin: 0;
    padding: 0 30px 0 15px;
    border: 1px solid #c8c8c8;
    border-radius: 0;
    font-family: var(--font-primary);
    font-weight: 700;
    font-size: 14px;
    color: var(--mitsubishi-black);
    background-color: #fff;
    cursor: pointer;
    appearance: none;
    -webkit-appearance: none;
    -moz-appearance: none;
    -ms-appearance: none;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 12 12'%3E%3Cpath fill='%23333' d='M6 8L1 3h10z'/%3E%3C/svg%3E");
    background-repeat: no-repeat;
    background-position: right 12px center;
}

    .manuales-dropwith-cattitle .manuales-filter-select:focus {
        border-color: var(--mitsubishi-red);
        outline: none;
    }

/* --- Grid de Cards (4 cols desktop, 3 tablet, 2 small, 1 mobile) --- */
.manuales-grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 1.5rem;
    list-style: none;
    padding: 0;
    margin: 0;
}

.manuales-card {
    background: #fff;
    transition: box-shadow 0.3s ease;
}

    .manuales-card:hover {
        /* box-shadow: 0 8px 24px rgba(0, 0, 0, 0.08);*/
    }

/* Imagen superior de la tarjeta --- */
.manuales-card-img {
    width: 100%;
    overflow: hidden;
    background: #f0f0f0;
}

    .manuales-card-img img {
        width: 100%;
        height: auto;
        display: block;
        object-fit: cover;
        aspect-ratio: 376 / 183;
    }

.manuales-card-body {
    padding: 1rem 0 0;
}

.manuales-card-title {
    font-family: var(--font-primary);
    font-weight: 700;
    font-size: 24px;
    color: var(--mitsubishi-black);
    margin: 0 0 0.5rem 0;
    line-height: 1.3;
}

.manuales-card-link {
    display: inline-flex;
    align-items: center;
    gap: 0.35rem;
    font-family: var(--font-primary);
    font-weight: 600;
    font-size: 0.95rem;
    color: #181818;
    text-decoration: underline;
    transition: color 0.3s ease;
}

    .manuales-card-link:hover {
        color: var(--mitsubishi-red);
    }

    .manuales-card-link i {
        font-size: 1rem;
        color: inherit;
    }

/* =========================================
   MANUALES – RESPONSIVE
   ========================================= */

/* Tablet (768px a 1199px) */
@media (min-width: 768px) and (max-width: 1199px) {
    .manuales-hero {
        height: 450px;
    }

    .manuales-hero-title {
        font-size: 38px;
    }

    .manuales-hero-desc {
        font-size: 18px;
    }

    .manuales-page-subtitle {
        font-size: 42px;
        line-height: 48px;
    }

    .manuales-section-desc {
        font-size: 0.95rem;
    }

    .manuales-section-title {
        font-size: 32px;
    }

    .manuales-dropwith-cattitle {
        padding-right: 280px;
    }

        .manuales-dropwith-cattitle .manuales-filter-select {
            width: 260px;
        }

    .manuales-grid {
        grid-template-columns: repeat(3, 1fr);
        gap: 1.25rem;
    }
}

/* Mobile (hasta 767px) */
@media (max-width: 767px) {
    .manuales-hero {
        height: 400px;
    }

    .manuales-hero-title {
        font-size: 1.75rem;
        line-height: 1.25;
    }

    .manuales-hero-desc {
        font-size: 1rem;
        line-height: 1.5;
    }

    .manuales-page-subtitle {
        font-size: 1.5rem;
        line-height: 1.35;
    }

    .manuales-section-desc {
        font-size: 0.9rem;
    }

    .manuales-content-section {
        padding: 40px 0 60px;
    }

    .manuales-section-block {
        margin-bottom: 3rem;
    }

    .manuales-dropwith-cattitle {
        padding-right: 0;
        padding-bottom: 20px;
        margin-bottom: 1.5rem;
    }

    .manuales-section-title {
        font-size: 1.5rem;
        margin-bottom: 1rem;
    }

    .manuales-dropwith-cattitle .manuales-filter-select {
        position: static;
        width: 100%;
        max-width: 100%;
        margin-top: 1rem;
    }

    .manuales-grid {
        grid-template-columns: 1fr;
        gap: 1.25rem;
    }

    .manuales-card-title {
        font-size: 1rem;
    }
}

/* Small (480px a 767px) - 2 columnas */
@media (min-width: 480px) and (max-width: 767px) {
    .manuales-grid {
        grid-template-columns: repeat(2, 1fr);
    }
}

/* Desktop (1200px en adelante) */
@media (min-width: 1200px) {
    .manuales-hero {
        height: 550px;
    }

    .manuales-hero-title {
        font-size: 84px;
    }

    .manuales-hero-desc {
        font-size: 21px;
    }
}

/* =========================================
   HEADER – ACTIVO MANUALES
========================================= */

body.page-manuales #propietariosDropdown {
    color: var(--mitsubishi-red) !important;
    font-weight: 700 !important;
}

    body.page-manuales #propietariosDropdown::after {
        border-top-color: var(--mitsubishi-red) !important;
    }

body.page-manuales .dropdown-menu .dropdown-item[href*="manuales"] {
    color: var(--mitsubishi-red) !important;
    font-weight: 700 !important;
    background-color: rgba(230, 0, 18, 0.06);
}

@media (max-width: 1199px) {
    body.page-manuales #propietariosDropdown {
        color: var(--mitsubishi-red) !important;
    }
}

/* =========================================
   FICHAS TÉCNICAS – Contenedor expandido 
========================================= */

body.page-descargar-fichas-tecnicas .manuales-content-section .manuales-container,
body.page-descargar-fichas-tecnicas .manuales-content-section .container.manuales-container {
    max-width: 96%;
    margin-left: auto;
    margin-right: auto;
    padding: 0 20px;
    box-sizing: border-box;
}

/* =========================================
   FICHAS TÉCNICAS – Imágenes más altas (255x331)
========================================= */

body.page-descargar-fichas-tecnicas .manuales-card-img {
    background: #f6f6f6;
    padding: 0px 40px 0;
    overflow: visible !important;
    position: relative;
}

    body.page-descargar-fichas-tecnicas .manuales-card-img img {
        aspect-ratio: 255 / 331;
        width: 100%;
        display: block;
        position: relative;
        bottom: -40px;
    }

body.page-descargar-fichas-tecnicas .manuales-card-body {
    margin-top: 40px;
}
/* =========================================
   HEADER – ACTIVO FICHAS TÉCNICAS
========================================= */

body.page-descargar-fichas-tecnicas #comprarDropdown {
    color: var(--mitsubishi-red) !important;
    font-weight: 700 !important;
}

    body.page-descargar-fichas-tecnicas #comprarDropdown::after {
        border-top-color: var(--mitsubishi-red) !important;
    }

body.page-descargar-fichas-tecnicas .dropdown-menu .dropdown-item[href*="/descargar-fichas-tecnicas"] {
    color: var(--mitsubishi-red) !important;
    font-weight: 700 !important;
    background-color: rgba(230, 0, 18, 0.06);
}

@media (max-width: 1199px) {
    body.page-descargar-fichas-tecnicas #comprarDropdown {
        color: var(--mitsubishi-red) !important;
    }
}

/* =========================================
   Ajuste de espacion  – DESCARGA FICHAS TÉCNICAS
========================================= */



/* Desktop (default) */
body.page-descargar-fichas-tecnicas
section.manuales-content-section {
    padding: 40px 0 0 !important;
}

/* Movil */
@media (max-width: 767px) {
    body.page-descargar-fichas-tecnicas
    section.manuales-content-section {
        padding: 20px 0 0 0 !important;
    }
}

/* Tablets */
@media (max-width: 1199px) and (min-width: 768px) {
    body.page-descargar-fichas-tecnicas
    section.manuales-content-section {
        padding: 25px 0 0 !important;
    }
}

/* =========================================
   PÁGINA DE MODELOS (XPANDER, etc.)
   ========================================= */

/* --- HERO SECTION --- */
.modelo-hero {
    position: relative;
    width: 100%;
    height: 100vh;
    min-height: 600px;
    display: flex;
    align-items: center;
    justify-content: center;
    overflow: hidden;
}

.modelo-hero-media-wrap {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 1;
}

.modelo-hero-media {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 1;
}

.modelo-hero-video,
.modelo-hero-img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.modelo-hero-img {
    display: none;
}

.modelo-hero-video-play {
    width: 56px;
    height: 56px;
    border: none;
    border-radius: 0;
    background: var(--mitsubishi-red);
    color: #fff;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    transition: background 0.3s ease;
}

    .modelo-hero-video-play:hover {
        background: #c40000;
    }

    .modelo-hero-video-play .modelo-hero-play-icon,
    .modelo-hero-video-play .modelo-hero-pause-icon {
        font-size: 1.5rem;
    }

.modelo-hero-overlay {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: linear-gradient(to bottom, rgba(0,0,0,0.3) 0%, rgba(0,0,0,0.5) 100%);
    z-index: 2;
}

.modelo-hero-content {
    position: relative;
    z-index: 3;
    text-align: center;
    color: #fff;
    padding: 0 20px;
}

.modelo-hero-title {
    font-family: var(--font-primary);
    font-weight: 700;
    font-size: 96px;
    font-style: italic;
    margin: 0 0 10px;
    line-height: 1;
    text-shadow: 0 2px 10px rgba(0,0,0,0.3);
}

.modelo-hero-year {
    font-family: var(--font-primary);
    font-weight: 400;
    font-size: 28px;
    margin: 0 0 8px;
}

.modelo-hero-claim-titulo {
    font-family: var(--font-primary);
    font-weight: 400;
    font-size: 21px;
    margin: 0 0 8px;
}

.modelo-hero-price {
    font-family: var(--font-primary);
    font-weight: 400;
    font-size: 24px;
    margin: 0 0 30px;
}

.modelo-hero-actions {
    display: flex;
    gap: 20px;
    justify-content: center;
    flex-wrap: wrap;
}

/* Menú de navegación lateral (scroll-nav) - visible a partir del video */
.modelo-scroll-nav {
    position: fixed;
    left: 20px;
    top: 45%;
    transform: translateY(-50%);
    z-index: 100;
    opacity: 0;
    visibility: hidden;
    transition: opacity 0.3s, visibility 0.3s;
}

    .modelo-scroll-nav.is-visible {
        opacity: 1;
        visibility: visible;
    }

    .modelo-scroll-nav ul {
        margin: 0;
        padding: 0;
        list-style: none;
    }

    .modelo-scroll-nav li {
        margin-bottom: -4px;
    }

    .modelo-scroll-nav .modelo-scroll-link {
        display: inline-block;
        position: relative;
        height: 40px;
        width: 24px;
        background: linear-gradient(to right, #6c6c6c 0, #6c6c6c 2px, transparent 2px);
        transition: width 0.4s, background 0.4s;
        text-decoration: none;
        overflow: hidden;
    }

        .modelo-scroll-nav .modelo-scroll-link:hover {
            width: 124px;
            background: #f0f0f0;
        }

        .modelo-scroll-nav .modelo-scroll-link span {
            display: inline-block;
            position: absolute;
            left: 2px;
            top: 0;
            min-width: 110px;
            min-height: 40px;
            padding: 0 15px;
            color: #333;
            font-size: 12px;
            line-height: 40px;
            letter-spacing: 0.12px;
            text-align: center;
            opacity: 0;
            width: 0;
            overflow: hidden;
            transition: opacity 0.4s, width 0.4s;
            white-space: nowrap;
        }

        .modelo-scroll-nav .modelo-scroll-link:hover span {
            opacity: 1;
            width: 110px;
        }

@media (max-width: 991px) {
    .modelo-scroll-nav {
        display: none !important;
    }
}

.page-modelos section[id] {
    scroll-margin-top: calc(var(--header-height, 90px) + 20px);
}

.btn-modelo {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 14px 40px;
    font-family: var(--font-primary);
    font-weight: 700;
    font-size: 14px;
    letter-spacing: 1px;
    text-transform: uppercase;
    text-decoration: none;
    border: 2px solid;
    transition: all 0.3s ease;
    cursor: pointer;
}

.btn-modelo-outline {
    color: #fff;
    border-color: #fff;
    background: transparent;
}

    .btn-modelo-outline:hover {
        background: #fff;
        color: #000;
    }

.btn-modelo-outline-dark {
    color: #000;
    border-color: #000;
    background: transparent;
}

    .btn-modelo-outline-dark:hover {
        background: #000;
        color: #fff;
    }

.btn-modelo-red {
    color: #fff;
    border-color: var(--mitsubishi-red);
    background: var(--mitsubishi-red);
}

    .btn-modelo-red:hover {
        background: #c20000;
        border-color: #c20000;
        color: #fff;
    }

/* --- INTRO SECTION --- */
.modelo-intro-section {
    padding: 10px 0 0;
    background: #fff;
    text-align: center;
}

.modelo-container {
    max-width: 1200px;
    margin: 0 auto;
    padding: 0 20px;
}

.modelo-intro-title {
    font-family: var(--font-primary);
    font-weight: 700;
    font-size: 63px;
    color: #000;
    margin: 20px 0 24px;
}

.modelo-intro-desc {
    font-family: var(--font-primary);
    font-weight: 400;
    font-size: 15px;
    color: #333;
    max-width: 900px;
    margin: 0 auto;
    line-height: 1.6;
}

/* --- FEATURES SECTIONS (Exterior, Interior, etc.) --- */
.modelo-features-section {
    padding: 60px 0 0;
    background: #fff;
    text-align: center;
}

.modelo-section-title {
    font-family: var(--font-primary);
    font-weight: 700;
    font-size: 63px;
    color: #000;
    margin: 0 0 16px;
}

.modelo-section-subtitle {
    font-family: var(--font-primary);
    font-weight: 700;
    font-size: 20px;
    color: #666;
    margin: 0 0 8px;
}

.modelo-section-desc {
    font-family: var(--font-primary);
    font-weight: 400;
    font-size: 16px;
    color: #000;
    margin: 0 0 40px;
}

/* --- CAROUSEL --- */
/* Igual que en fichas técnicas: el gris no cubre toda la tarjeta, solo la zona inferior izquierda */
.modelo-carousel-wrapper {
    position: relative;
    max-width: 100%;
    padding: 0 60px;
    background: transparent;
}

    /* Fondo gris solo en la zona del recuadro (abajo-izquierda): captions + controles, ~45% ancho */
    .modelo-carousel-wrapper::before {
        content: '';
        position: absolute;
        bottom: 0;
        left: 0;
        width: 48%;
        height: 55%;
        background: #f8f8f8;
        z-index: 0;
        pointer-events: none;
    }

    /* Media tira gris que cubre botones y mitad inferior de las imágenes */
    .modelo-carousel-wrapper::after {
        content: '';
        position: absolute;
        bottom: 0;
        left: 0;
        right: 0;
        height: 55%;
        background: linear-gradient(to top, rgba(200, 200, 200, 0.35), rgba(220, 220, 220, 0.15) 40%, transparent);
        pointer-events: none;
        z-index: 1;
    }

.modelo-carousel {
    overflow: hidden;
    position: relative;
    z-index: 0;
    width: 100%;
}

.modelo-carousel-track {
    display: flex;
    gap: 24px;
    overflow: visible;
    padding: 0 20px;
    transition: transform 0.6s cubic-bezier(.22,.61,.36,1);
    will-change: transform;
    flex-wrap: nowrap;
}


    .modelo-carousel-track::-webkit-scrollbar {
        display: none;
    }

.modelo-carousel-item {
    flex: 0 0 var(--carousel-item-width, 300px);
    min-width: 0;
    width: var(--carousel-item-width, 300px);
}

.modelo-carousel-img {
    width: 100%;
    overflow: hidden;
    margin-bottom: 16px;
}

    .modelo-carousel-img img {
        width: 100%;
        height: auto;
        aspect-ratio: 588 / 288;
        object-fit: cover;
        display: block;
    }

.modelo-carousel-title {
    font-family: var(--font-primary);
    font-weight: 700;
    font-size: 21px;
    color: #000;
    text-align: left;
    margin: 0;
    text-transform: uppercase;
    position: relative;
    z-index: 2;
}

.modelo-carousel-controls {
    display: flex;
    align-items: center;
    gap: 20px;
    padding: 20px 20px 24px;
    position: relative;
    z-index: 2;
    width: 70%;
    margin-left: 18%;
}

.modelo-carousel-buttons {
    display: flex;
    gap: 12px;
    flex-shrink: 0;
}

/* Barra indicadora de posición del carrusel (línea negra con segmento rojo) */
.modelo-carousel-indicator {
    display: flex;
    align-items: center;
    gap: 0;
    flex: 1;
    margin: 0 0 0 12px;
    padding: 0;
    list-style: none;
}

    .modelo-carousel-indicator li {
        flex: 1;
        height: 2px;
        background: #000;
        transition: background 0.2s ease;
        cursor: pointer;
    }

        .modelo-carousel-indicator li.filled,
        .modelo-carousel-indicator li.active {
            background: var(--mitsubishi-red);
        }

.modelo-carousel-btn {
    width: 48px;
    height: 48px;
    border-radius: 50%;
    background: var(--mitsubishi-red);
    color: #fff;
    border: none;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 20px;
    transition: background 0.3s ease;
}

    .modelo-carousel-btn:hover {
        /*background: #c20000;*/
        background: #000;
    }

/* --- COLOR SECTION --- */
.modelo-color-section {
    background: #fff;
    overflow: hidden;
}

.modelo-color-wrapper {
    display: flex;
    min-height: 600px;
}

.modelo-color-left {
    flex: 0 0 35%;
    background: #fff;
    display: flex;
    flex-direction: column;
    justify-content: center;
    padding: 60px;
}

.modelo-color-title {
    font-family: var(--font-primary);
    font-weight: 700;
    font-size: 56px;
    font-style: italic;
    color: #000;
    margin: 0 0 40px;
}

.modelo-color-slogan {
    font-family: var(--font-primary);
    font-weight: 700;
    font-size: 32px;
    color: #000;
    line-height: 1.3;
    margin: 0;
}

.modelo-color-right {
    flex: 1;
    /*background: linear-gradient(135deg, #f5f5f5 0%, #e0e0e0 100%);*/
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    padding: 40px;
    position: relative;
}

.modelo-color-car {
    max-width: 100%;
    position: relative;
}

.modelo-color-car-inner {
    position: relative;
}

.modelo-color-car-img {
    max-width: 100%;
    height: auto;
    display: block;
    transition: opacity 0.5s ease;
}

    .modelo-color-car-img.active {
        position: relative;
        opacity: 1;
        z-index: 1;
    }

    .modelo-color-car-img:not(.active) {
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        opacity: 0;
        z-index: 0;
    }

.modelo-color-selector {
    text-align: center;
    position: absolute;
    bottom: 20px;
    left: 50%;
    transform: translateX(-50%);
    z-index: 10;
    background: transparent;
    padding: 16px 24px;
    border-radius: 8px;
}

.modelo-color-nav {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 16px;
    margin-bottom: 16px;
}

.modelo-color-arrow {
    background: none;
    border: none;
    font-size: 18px;
    color: #fff;
    cursor: pointer;
    padding: 4px;
    text-shadow: 0 1px 2px rgba(0, 0, 0, 0.5);
}

.modelo-color-selector.modelo-color-text-dark .modelo-color-arrow {
    color: #000;
    text-shadow: none;
}

.modelo-color-counter {
    font-family: var(--font-primary);
    font-weight: 400;
    font-size: 14px;
    color: #fff;
    text-shadow: 0 1px 2px rgba(0, 0, 0, 0.5);
}

.modelo-color-selector.modelo-color-text-dark .modelo-color-counter {
    color: #000;
    text-shadow: none;
}

.modelo-color-options {
    display: flex;
    align-items: center;
    gap: 8px;
    justify-content: center;
    margin-bottom: 12px;
}

.modelo-color-dot {
    width: 28px;
    height: 28px;
    border-radius: 50%;
    border: 2px solid transparent;
    cursor: pointer;
    transition: all 0.3s ease;
}

    .modelo-color-dot:hover {
        border-color: rgba(0,0,0,0.3);
    }

    .modelo-color-dot.active {
        width: 40px;
        height: 40px;
        border-color: transparent;
        box-shadow: 0 4px 12px rgba(0,0,0,0.25);
    }

.modelo-color-name {
    font-family: var(--font-primary);
    font-weight: 700;
    font-size: 14px;
    color: #fff;
    text-transform: uppercase;
    letter-spacing: 1px;
    margin: 0;
    text-shadow: 0 1px 2px rgba(0, 0, 0, 0.5);
}

.modelo-color-selector.modelo-color-text-dark .modelo-color-name {
    color: #000;
    text-shadow: none;
}

/* --- VERSIONES SECTION --- */
.modelo-versiones-section {
    padding: 80px 0;
}

.modelo-versiones-wrapper {
    display: grid;
    grid-template-columns: 45% 1fr;
    grid-template-rows: auto 1fr;
    gap: 0 40px;
    max-width: 1400px;
    margin: 40px auto 0;
    padding: 0 20px;
    position: relative;
}

/* Desktop: tabs arriba full-width, info abajo-izq, car abajo-der */
.modelo-versiones-tabs-cell {
    grid-column: 1 / -1;
    grid-row: 1;
}

.modelo-versiones-info-cell {
    grid-column: 1;
    grid-row: 2;
}

.modelo-versiones-car-cell {
    grid-column: 2;
    grid-row: 2;
}

/* Fondo gris: se corta un poco en el lado izquierdo, se extiende hasta el borde derecho del viewport */
.modelo-versiones-wrapper::after {
    content: '';
    position: absolute;
    top: 0;
    bottom: 0;
    left: 65%;
    right: calc(-50vw + 50%);
    background: #f6f6f6;
    z-index: 0;
}

.modelo-versiones-content {
    position: relative;
    z-index: 1;
}

.modelo-version-tabs {
    margin-bottom: 20px;
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    gap: 24px;
}

.modelo-version-tab {
    background: none;
    border: none;
    border-bottom: 3px solid transparent;
    padding: 6px 0;
    font-family: var(--font-primary);
    font-weight: 700;
    font-size: 21px;
    color: #999;
    cursor: pointer;
    transition: color 0.2s, border-color 0.2s;
}
    .modelo-version-tab.active {
        color: #000;
        border-bottom-color: #ED0000;
    }

    .modelo-version-tab:hover {
        color: #000;
        border-bottom-color: #ED0000;
    }
.modelo-version-info {
    text-align: left;
}

.modelo-version-title {
    font-family: var(--font-primary);
    font-weight: 700;
    font-size: 42px;
    color: #000;
    margin: 0 0 12px;
}

.modelo-version-desc {
    font-family: var(--font-primary);
    font-weight: 400;
    font-size: 21px;
    color: #666;
    margin: 0 0 16px;
    line-height: 1.5;
}

.modelo-version-price {
    font-family: var(--font-primary);
    font-weight: 700;
    font-size: 21px;
    color: #000;
    margin: 0 0 24px;
}

.modelo-version-specs-title {
    font-family: var(--font-primary);
    font-weight: 700;
    font-size: 21px;
    color: #000;
    margin: 0 0 12px;
}

.modelo-version-specs {
    list-style: none;
    padding: 0;
    margin: 0 0 16px;
}

    .modelo-version-specs li {
        font-family: var(--font-primary);
        font-weight: 400;
        font-size: 14px;
        color: #333;
        padding: 6px 0;
    }

.modelo-version-specs-extra {
    display: none;
}

.modelo-version-specs-wrap.is-expanded .modelo-version-specs-extra {
    display: list-item;
}

.modelo-version-more {
    background: none;
    border: none;
    font-family: var(--font-primary);
    font-weight: 700 !important;
    font-size: 14px;
    color: #000;
    cursor: pointer;
    padding: 10px 0;
    display: inline-flex;
    align-items: center;
    gap: 8px;
    text-decoration: underline;
}

.modelo-version-more-text {
    font-weight: 700;
}

.modelo-version-more:hover {
    color: var(--mitsubishi-red);
}

.modelo-version-more .modelo-version-more-icon {
    font-size: 1em;
}

.modelo-version-actions {
    display: flex;
    gap: 16px;
    margin-top: 30px;
    flex-wrap: wrap;
}

.modelo-versiones-car {
    flex: 1;
    display: flex;
    align-items: center;
    justify-content: center;
    position: relative;
    z-index: 1;
}

    .modelo-versiones-car img {
        max-width: 100%;
        height: auto;
    }

/* --- ACCESORIOS SECTION --- */
.modelo-accesorios-section {
    padding: 80px 0;
    background: #fff;
}

.modelo-accesorios-title {
    font-family: var(--font-primary);
    font-weight: 700;
    font-size: 48px;
    color: #000;
    margin: 0 0 16px;
    text-align: center;
}

.modelo-accesorios-desc {
    font-family: var(--font-primary);
    font-weight: 400;
    font-size: 16px;
    color: #666;
    text-align: center;
    margin: 0 0 40px;
}

.modelo-accesorios-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 30px;
    margin-bottom: 30px;
}

.modelo-accesorio-card {
    background: #fff;
}

.modelo-accesorio-img {
    width: 100%;
    overflow: hidden;
    margin-bottom: 16px;
}

    .modelo-accesorio-img img {
        width: 100%;
        height: auto;
        aspect-ratio: 3 / 2;
        object-fit: cover;
        display: block;
    }

.modelo-accesorio-body {
    padding: 0;
}

.modelo-accesorio-name {
    font-family: var(--font-primary);
    font-weight: 700;
    font-size: 36px;
    color: #000;
    margin: 0 0 8px;
}

.modelo-accesorio-price {
    font-family: var(--font-primary);
    font-weight: 700;
    font-size: 21px;
    color: #000;
    margin: 0 0 12px;
}

.modelo-accesorio-desc {
    font-family: var(--font-primary);
    font-weight: 400;
    font-size: 16px;
    color: #333;
    line-height: 1.5;
}

/* Botones COTIZAR expandidos al ancho de la tarjeta */
.modelo-accesorio-card .btn-modelo.btn-modelo-red {
    width: 100%;
}

.modelo-accesorios-disclaimer {
    font-family: var(--font-primary);
    font-weight: 400;
    font-size: 16px;
    /*color: #999;*/
    text-align: left;
    margin: 0;
}

/* --- RESPONSIVE MODELOS --- */
@media (max-width: 1199px) {
    .modelo-hero-title {
        font-size: 72px;
    }

    .modelo-section-title,
    .modelo-color-title {
        font-size: 42px;
    }

    .modelo-intro-title {
        font-size: 63px;
    }

    .modelo-carousel-item {
        flex: 0 0 var(--carousel-item-width, 300px);
        width: var(--carousel-item-width, 300px);
    }

    .modelo-versiones-wrapper {
        display: flex;
        flex-direction: column;
        grid-template-columns: none;
        grid-template-rows: none;
    }

    .modelo-versiones-tabs-cell,
    .modelo-versiones-info-cell,
    .modelo-versiones-car-cell {
        grid-column: auto;
        grid-row: auto;
    }

    .modelo-versiones-content {
        flex: 1;
    }

    .modelo-version-tabs {
        flex-wrap: nowrap;
        overflow-x: auto;
        -webkit-overflow-scrolling: touch;
        scrollbar-width: none;
        padding-bottom: 4px;
    }

        .modelo-version-tabs::-webkit-scrollbar {
            display: none;
        }

    .modelo-version-tab {
        flex-shrink: 0;
        white-space: nowrap;
    }
    .modelo-accesorios-grid {
        grid-template-columns: repeat(2, 1fr);
    }
}

@media (max-width: 767px) {
    .modelo-hero {
        height: auto;
        min-height: auto;
        flex-direction: column;
        align-items: stretch;
    }

    .modelo-hero-media-wrap {
        position: relative;
        flex: 0 0 auto;
        height: 32vh;
        min-height: 180px;
    }

    .modelo-hero-video {
        display: block !important;
    }

    .modelo-hero-img {
        display: none !important;
    }

    .modelo-hero-overlay {
        display: none;
    }

    .modelo-hero-content {
        position: relative;
        background: #000;
        padding: 24px 20px 28px;
        text-align: center;
        order: 2;
    }

    .modelo-hero-title {
        font-size: 36px;
        margin-bottom: 6px;
    }

    .modelo-hero-year {
        font-size: 18px;
        margin-bottom: 4px;
    }

    .modelo-hero-claim-titulo {
        font-size: 16px;
    }

    .modelo-hero-price {
        font-size: 16px;
        margin-bottom: 20px;
    }

    .modelo-hero-actions {
        flex-direction: row;
        gap: 12px;
        justify-content: center;
        flex-wrap: wrap;
    }

    .modelo-hero .btn-modelo-outline {
        color: #fff;
        border-color: #fff;
    }

        .modelo-hero .btn-modelo-outline:hover {
            background: #fff;
            color: #000;
        }

    /* Controles de video (Funciones de vídeo) en mobile */
    .modelo-hero-media-wrap .home-video_actions {
        bottom: 12px;
        right: 12px;
    }

    .modelo-hero-media-wrap .home-video_trigger {
        width: 44px;
        height: 44px;
        min-width: 44px;
        min-height: 44px;
    }

        .modelo-hero-media-wrap .home-video_trigger:hover {
            width: 70px;
            height: 70px;
            min-width: 70px;
            min-height: 70px;
        }

    .modelo-hero-media-wrap .home-video_btn {
        width: 60px;
        height: 60px;
    }

    .btn-modelo {
        padding: 12px 24px;
        font-size: 12px;
    }

    .modelo-intro-section,
    .modelo-features-section,
    .modelo-versiones-section,
    .modelo-accesorios-section {
        padding: 20px 0;
    }

    .modelo-intro-title {
        font-size: 28px;
    }

    .modelo-intro-desc {
        font-size: 12px;
    }

    .modelo-section-title,
    .modelo-color-title {
        font-size: 32px;
    }

    .modelo-section-subtitle {
        font-size: 24px;
    }

    .modelo-carousel-wrapper {
        padding: 0 12px;
    }

    .modelo-carousel-controls {
        width: 100%;
        margin-left: 0;
        padding: 16px 8px 20px;
        gap: 16px;
        box-sizing: border-box;
    }

    .modelo-carousel-item {
        flex: 0 0 var(--carousel-item-width, 280px);
        width: var(--carousel-item-width, 280px);
    }

    .modelo-color-wrapper {
        flex-direction: column;
        min-height: auto;
    }

    .modelo-color-left {
        flex: none;
        padding: 8px 20px 40px;
        text-align: center;
    }

    .modelo-color-title {
        margin-bottom: 20px;
    }

    .modelo-color-slogan {
        font-size: 24px;
    }

    .modelo-color-right {
        padding: 30px 20px;
    }

    .modelo-color-selector {
        bottom: 10px;
        padding: 6px 10px;
    }

    .modelo-color-nav {
        gap: 6px;
        margin-bottom: 6px;
    }

    .modelo-color-arrow {
        font-size: 12px;
        padding: 2px;
    }

    .modelo-color-counter {
        font-size: 10px;
    }

    .modelo-color-options {
        gap: 4px;
        margin-bottom: 4px;
    }

    .modelo-color-dot {
        width: 18px;
        height: 18px;
    }

        .modelo-color-dot.active {
            width: 24px;
            height: 24px;
        }

    .modelo-color-name {
        font-size: 9px;
        letter-spacing: 0.3px;
    }

    .modelo-version-title {
        font-size: 36px;
        padding: 20px 0 0;
    }

    .modelo-version-actions {
        flex-direction: column;
    }

    .modelo-accesorio-name {
        font-size: 24px;
    }
    /* En mobile: fondo gris en el contenedor de la imagen del auto */
    .modelo-versiones-wrapper::after {
        display: none;
    }

    .modelo-versiones-car {
        background: #f6f6f6;
        padding: 24px 20px;
        margin-left: -20px;
        margin-right: -20px;
        display: flex;
        align-items: center;
        justify-content: center;
    }

        .modelo-versiones-car img {
            max-width: 100%;
            height: auto;
        }

    .modelo-accesorios-grid {
        grid-template-columns: 1fr;
    }

    .modelo-accesorios-title {
        font-size: 32px;
    }
}

/* Elige tu color - resoluciones ≤368px: botones más pequeños */
@media (max-width: 368px) {
    .modelo-color-selector {
        padding: 4px 8px;
        bottom: 8px;
    }

    .modelo-color-nav {
        gap: 4px;
        margin-bottom: 4px;
    }

    .modelo-color-arrow {
        font-size: 10px;
    }

    .modelo-color-counter {
        font-size: 9px;
    }

    .modelo-color-options {
        gap: 3px;
        margin-bottom: 3px;
    }

    .modelo-color-dot {
        width: 14px;
        height: 14px;
    }

        .modelo-color-dot.active {
            width: 20px;
            height: 20px;
        }

    .modelo-color-name {
        font-size: 8px;
    }
}

/* Elige tu color - resoluciones ≤320px: botones aún más pequeños */
@media (max-width: 320px) {
    .modelo-color-selector {
        padding: 3px 6px;
        bottom: 6px;
    }

    .modelo-color-nav {
        gap: 3px;
        margin-bottom: 3px;
    }

    .modelo-color-arrow {
        font-size: 9px;
    }

    .modelo-color-counter {
        font-size: 8px;
    }

    .modelo-color-options {
        gap: 2px;
        margin-bottom: 2px;
    }

    .modelo-color-dot {
        width: 12px;
        height: 12px;
    }

        .modelo-color-dot.active {
            width: 16px;
            height: 16px;
        }

    .modelo-color-name {
        font-size: 7px;
    }
}

/* --- HEADER ACTIVO MODELOS --- */
body.page-modelos #autosNuevosDropdown {
    color: var(--mitsubishi-red) !important;
    font-weight: 700 !important;
}

    body.page-modelos #autosNuevosDropdown::after {
        border-top-color: var(--mitsubishi-red) !important;
    }

@media (max-width: 1199px) {
    body.page-modelos #autosNuevosDropdown {
        color: var(--mitsubishi-red) !important;
    }
}

.modelo-line {
    border-bottom: 1px solid #c8c8c8;
    padding: 20px
}

/* =========================================
   PÁGINA DE RESULTADOS DE BÚSQUEDA
   ========================================= */
.search-results-container {
    max-width: 1200px;
    margin: 0 auto;
    padding: 0 20px;
}

.search-results-hero {
    background: #fff;
    padding: 80px 0 0 0;
    text-align: center;
}

    .search-results-hero h1 {
        color: #000;
        font-size: 50px;
        font-weight: 700;
        margin-bottom: 30px;
    }

        .search-results-hero h1 span {
            color: var(--mitsubishi-red, #ED0000);
        }

        .search-results-hero h1 .search-term {
            color: #000;
            font-weight: 400;
        }

.search-results-count {
    color: rgba(0,0,0,0.7);
    font-size: 0.9rem;
    text-align: right;
    padding-bottom: 16px;
    font-weight: 700;
}

@media (max-width: 1199px) {
    .search-results-hero h1 {
        font-size: 28px;
    }
}

.search-results-content {
    padding: 0 0 80px;
}

.search-result-item {
    background: #fff;
    border-top: 1px solid #e5e5e5;
    border-left: none;
    border-right: none;
    border-bottom: none;
    padding: 24px 0 24px 0;
    transition: border-color 0.3s;
}

    .search-result-item:first-child {
        border-top: 1px solid #e5e5e5;
    }

    .search-result-item:hover {
        border-top-color: var(--mitsubishi-red, #ED0000);
    }

    .search-result-item h2 {
        font-size: 36px;
        font-weight: 700;
        color: #000;
        margin-bottom: 12px;
    }

    .search-result-item .search-learn-more {
        display: inline-flex;
        align-items: center;
        gap: 6px;
        font-family: 'MMCOFFICE', sans-serif;
        font-weight: 700;
        font-size: 14px;
        letter-spacing: 0.5px;
        color: #000;
        text-decoration: none;
        transition: color 0.3s, gap 0.3s;
    }

        .search-result-item .search-learn-more:hover {
            color: var(--mitsubishi-red, #ED0000);
            gap: 10px;
        }

.search-no-results {
    text-align: center;
    padding: 60px 20px;
    color: #666;
}

    .search-no-results h2 {
        font-size: 1.25rem;
        margin-bottom: 16px;
        color: #333;
    }

/* =========================================
   AUTOS SEMINUEVOS - PÁGINA DE INVENTARIO
   ========================================= */
.page-autos-seminuevos .inventory-content {
    padding-top: 0;
    padding-bottom: 60px;
    margin-top: 0;
}

.page-autos-seminuevos .inventory-page-wrapper {
    min-height: calc(100vh - var(--header-height, 90px));
}

.page-autos-seminuevos .inventory-container {
    max-width: 100%;
    margin: 0;
}

    .page-autos-seminuevos .inventory-container .row {
        align-items: flex-start;
    }

.inventory-sidebar {
    background: #f6f6f6;
    padding: 0;
    height: calc(100vh - var(--header-height, 90px));
    position: sticky;
    top: var(--header-height, 90px);
    display: flex;
    flex-direction: column;
    flex: 0 0 15%;
    max-width: 15%;
}

.inventory-left-inner {
    display: flex;
    flex-direction: column;
    height: 100%;
    min-height: 0;
    padding: 16px 0px 16px 16px;
}

.inventory-left-inner-scroll {
    flex: 1;
    min-height: 0;
    overflow-y: auto;
    overflow-x: hidden;
    padding-right: 4px;
}

.inventory-sidebar-footer {
    flex-shrink: 0;
    padding: 16px 0 60px 0;
    border-top: 1px solid #e5e5e5;
}

.side-nav-title {
    font-size: 1rem;
    font-weight: 700;
    text-transform: uppercase;
    margin-bottom: 16px;
    color: #000;
    flex-shrink: 0;
}

.side-filter-box {
    padding: 15px 0 25px;
    border-top: 1px solid #e5e5e5;
}

    .side-filter-box:first-of-type {
        border-top: none;
    }

.filter-section-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    font-weight: 700;
    font-size: 0.75rem;
    text-transform: uppercase;
    color: #000;
    cursor: pointer;
    margin-bottom: 10px;
}

.filter-years-grid {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 8px;
}

.page-autos-seminuevos .filter-year,
.page-autos-seminuevos .filter-year-all {
    background-color: #fff !important;
    color: #000 !important;
    padding: 12px;
    font-weight: 100 !important;
}

    .page-autos-seminuevos .filter-year.selected,
    .page-autos-seminuevos .filter-year-all.selected {
        border-color: var(--mitsubishi-red);
        border-width: 2px;
    }

.seminuevos-filter-select {
    font-size: 0.9rem;
}

.seminuevos-btn-filtrar {
    display: inline-block;
    padding: 17.2px 30px !important;
    background: var(--mitsubishi-red, #ED0000) !important;
    color: #fff !important;
    font-weight: 700;
    text-align: center;
    box-sizing: border-box;
    text-transform: uppercase;
    font-size: 15px;
    line-height: 24px;
    height: auto;
    text-decoration: none;
    cursor: pointer;
    transition-duration: 0.3s;
    border-radius: 0;
    z-index: 99;
    border: none;
}

/* Dual range slider (PRECIO / KILOMETRAJE) - una barra con dos manijas */
.page-autos-seminuevos .seminuevos-dual-range {
    position: relative;
    width: 100%;
    padding: 0 9px;
    overflow: visible;
    box-sizing: border-box;
}

    .page-autos-seminuevos .seminuevos-dual-range .range-track {
        overflow: visible;
        position: relative;
        height: 3px;
        background-color: #e0e0e0;
        border-radius: 4px;
        cursor: pointer;
    }

    .page-autos-seminuevos .seminuevos-dual-range .range-fill {
        position: absolute;
        top: 0;
        bottom: 0;
        left: 0;
        width: 0;
        background: linear-gradient(90deg, #181818 0%, #FB0937 100%);
        border-radius: 4px;
        pointer-events: none;
        z-index: 1;
    }

    .page-autos-seminuevos .seminuevos-dual-range .range-handle {
        position: absolute;
        top: 50%;
        transform: translate(-50%, -50%);
        width: 18px;
        height: 18px;
        border-radius: 50%;
        cursor: grab;
        z-index: 2;
        touch-action: none;
    }

        .page-autos-seminuevos .seminuevos-dual-range .range-handle:active {
            cursor: grabbing;
        }

    .page-autos-seminuevos .seminuevos-dual-range .range-handle-min {
        left: 0;
        background-color: #333;
    }

    .page-autos-seminuevos .seminuevos-dual-range .range-handle-max {
        left: 100%;
        background-color: var(--mitsubishi-red);
    }

    .page-autos-seminuevos .seminuevos-dual-range .range-display-min,
    .page-autos-seminuevos .seminuevos-dual-range .range-display-max {
        font-size: 0.9rem;
        text-align: center;
    }

.page-autos-seminuevos .inventory-main {
    padding: 25px 100px 40px 50px;
}

/* Autos Seminuevos activo en el header (dropdown Comprar) */
.dropdown-item.dropdown-item-seminuevos-active {
    color: var(--mitsubishi-red) !important;
    font-weight: 600;
}

body.page-autos-seminuevos #comprarDropdown {
    color: var(--mitsubishi-red) !important;
    font-weight: 700 !important;
}

    body.page-autos-seminuevos #comprarDropdown::after {
        border-top-color: var(--mitsubishi-red) !important;
    }

@media (max-width: 1199px) {
    body.page-autos-seminuevos #comprarDropdown {
        color: var(--mitsubishi-red) !important;
    }
}

/* Multiselect marcas (autos seminuevos) */
.page-autos-seminuevos .seminuevos-multiselect {
    position: relative;
}

.page-autos-seminuevos .multiselect-toggle {
    width: 100%;
    padding: 10px 36px 10px 12px;
    border: 1px solid #dedede;
    background-color: #fff;
    display: flex;
    align-items: center;
    justify-content: space-between;
    font-size: 0.9rem;
    text-align: left;
    position: relative;
}

    .page-autos-seminuevos .multiselect-toggle i {
        position: absolute;
        right: 12px;
        top: 50%;
        transform: translateY(-50%);
        font-size: 0.9rem;
        flex-shrink: 0;
    }

.page-autos-seminuevos .seminuevos-multiselect.has-selection .multiselect-label {
    color: #000;
    font-weight: 700;
}

.page-autos-seminuevos .multiselect-toggle:hover .multiselect-label {
    color: var(--mitsubishi-red);
}

.page-autos-seminuevos .multiselect-menu {
    position: absolute;
    left: 0;
    right: 0;
    top: 100%;
    margin-top: 2px;
    background-color: #fff;
    border: 1px solid #dedede;
    box-shadow: 0 4px 8px rgba(0,0,0,0.08);
    max-height: 220px;
    overflow-y: auto;
    z-index: 1050;
    display: none;
}

.page-autos-seminuevos .seminuevos-multiselect.multiselect-open .multiselect-menu {
    display: block;
}

.page-autos-seminuevos .multiselect-option {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 4px 12px;
    font-size: 0.9rem;
}

    .page-autos-seminuevos .multiselect-option input[type="checkbox"] {
        width: 16px;
        height: 16px;
        appearance: none;
        -webkit-appearance: none;
        border: 2px solid #ccc;
        border-radius: 2px;
        background: #fff;
    }

        .page-autos-seminuevos .multiselect-option input[type="checkbox"]:checked {
            background: #fff;
            border-color: var(--mitsubishi-red);
            background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%23ED0000'%3E%3Cpath d='M9 16.17L4.83 12l-1.42 1.41L9 19 21 7l-1.41-1.41z'/%3E%3C/svg%3E");
            background-size: 12px;
            background-position: center;
        }

        .page-autos-seminuevos .multiselect-option input[type="checkbox"]:hover {
            border-color: var(--mitsubishi-red);
        }

/* Forzar proporciones 15% / 85% solo en autos seminuevos desktop (sobrescribiendo .col-lg-3 / .col-lg-9) */
@media (min-width: 1200px) {
    .page-autos-seminuevos .inventory-sidebar.col-lg-3 {
        flex: 0 0 18% !important;
        max-width: 18% !important;
    }

    .page-autos-seminuevos .inventory-main.col-lg-9 {
        flex: 0 0 82% !important;
        max-width: 82% !important;
    }
}

.inventory-page-title {
    padding-bottom: 30px;
}

.seminuevos-title {
    font-size: 50px;
    line-height: 55px;
    font-weight: 700;
    color: #181818;
    margin-bottom: 16px;
}

.inv_desc {
    font-size: 16px;
    color: #333;
    line-height: 1.7;
}

.inventory-search-filter {
    margin-bottom: 30px;
}

.seminuevos-search-form label {
    display: block;
    font-weight: 600;
    margin-bottom: 8px;
    font-size: 0.9rem;
}

/* Label "Buscar Vehículo" - clase dedicada para autos seminuevos */
.label-buscar-vehiculo {
    font-size: 21px !important;
    font-weight: 900 !important;
}

.search-input-wrap {
    position: relative;
}

.seminuevos-search-form .search-input-wrap .form-control {
    padding-right: 70px;
    /*border-color: #000;*/
    border: 1px solid #ccc;
    padding: 12px;
}

    .seminuevos-search-form .search-input-wrap .form-control:focus {
        border-color: #000;
        box-shadow: none;
        outline: none;
    }

.seminuevos-search-form .seminuevos-search-submit {
    position: absolute;
    right: 12px;
    top: 50%;
    transform: translateY(-50%);
    background: none;
    border: none;
    color: #000;
    font-size: 1.2rem;
    cursor: pointer;
}

.seminuevos-search-form .seminuevos-search-clear {
    position: absolute;
    right: 38px;
    top: 50%;
    transform: translateY(-50%);
    background: none;
    border: none;
    color: #000;
    font-size: 1.1rem;
    cursor: pointer;
    padding: 0;
    line-height: 1;
}

    .seminuevos-search-form .seminuevos-search-clear:hover {
        color: #333;
    }

.home-product-inner.card-view {
    background: #f6f6f6;
    border: 1px solid #e5e5e5;
    border-radius: 4px;
    overflow: hidden;
    height: 100%;
    display: flex;
    flex-direction: column;
}

.two-column-snippet-info {
    display: block;
}

.twocolumn-snippet-img img {
    width: 100%;
    height: 200px;
    object-fit: cover;
}

.twocolumn-snippet-content {
    padding: 16px;
}

    .twocolumn-snippet-content h4 {
        font-size: 14px;
        font-weight: 700;
        color: #000;
        margin-bottom: 8px;
        text-transform: uppercase;
    }

.product-details {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 0 6px;
}

    .product-details .kmspan {
        display: inline;
        font-size: 14px;
        color: #666;
    }

        .product-details .kmspan:not(:last-child)::after {
            content: " • ";
            margin-left: 6px;
        }

.price-section-inve .product-price {
    font-size: 24px;
    font-weight: 700;
    color: #000;
    margin-top: 8px;
}

.features-wrapinn {
    padding: 12px 16px;
    border-top: 1px solid #c8c8c8;
    margin: 0 6px;
}

.features-cars .seminuevos-tooltip-wrap {
    position: relative;
    cursor: pointer;
}

.features-cars .seminuevos-feature-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    margin-right: 10px;
}

    .features-cars .seminuevos-feature-icon img {
        width: 23px;
        height: 23px;
        display: block;
    }

.features-cars .seminuevos-tooltiptext {
    visibility: hidden;
    width: 120px;
    min-width: 120px;
    background: #fff;
    color: #000;
    text-align: center;
    border-radius: 6px;
    padding: 5px 8px 8px;
    position: absolute;
    z-index: 10;
    box-shadow: 0 3px 6px rgba(0,0,0,0.16);
    bottom: 35px;
    left: 50%;
    transform: translateX(-50%);
    font-size: 13px;
}
/* Primer icono: alinear a la izquierda para evitar que se corte */
.features-cars li:first-child .seminuevos-tooltiptext {
    left: 0;
    transform: none;
}
/* Último icono: alinear a la derecha si hay 3 */
.features-cars li:last-child .seminuevos-tooltiptext {
    left: auto;
    right: 0;
    transform: none;
}

.features-cars .seminuevos-tooltip-wrap:hover .seminuevos-tooltiptext {
    visibility: visible;
}

.tooltip-title {
    font-weight: 600;
}

.home-prod-cotiza-btn {
    padding: 12px 16px 16px;
    border-top: 1px solid #c8c8c8;
    margin: 0 6px;
}

.link-with-arrow {
    color: var(--body-color, #000);
    text-transform: uppercase;
    text-decoration: underline;
    font-weight: 700;
    font-size: 14px;
    letter-spacing: 0.7px;
}

    .link-with-arrow:hover {
        color: var(--mitsubishi-red);
    }

.nodata {
    text-align: center;
    padding: 40px 20px;
}

.no-data-found {
    font-size: 1.1rem;
}

.similer-data-msg {
    margin-top: 20px;
    color: #666;
}

.pagination-wrapper {
    width: 100%;
    text-align: center;
    padding: 20px 0 40px;
}

.pagination {
    display: inline-flex;
    align-items: center;
    list-style: none;
    margin: 0;
    padding: 0;
    gap: 8px;
}

    .pagination .page-link {
        padding: 8px 14px;
        border: 1px solid #ddd;
        background: #fff;
        color: #000;
        text-decoration: none;
        border-radius: 4px;
        transition: background-color 0.2s, border-color 0.2s, color 0.2s;
    }

        .pagination .page-link:focus,
        .pagination .page-link:focus-visible {
            box-shadow: none !important;
            outline: none !important;
        }

    .pagination .page-item:not(.disabled):not(.active) .page-link:hover {
        background: var(--mitsubishi-red);
        border-color: var(--mitsubishi-red);
        color: #fff;
    }
    /* Flechas prev/next circulares - anular estilos Bootstrap (D-shaped) */
    .pagination .page-item:first-child,
    .pagination .page-item:last-child {
        flex-shrink: 0;
    }

        .pagination .page-item:first-child .page-link,
        .pagination .page-item:last-child .page-link {
            min-width: 56px;
            width: 56px;
            height: 56px;
            min-height: 56px;
            padding: 0;
            display: flex;
            justify-content: center;
            align-items: center;
            border-radius: 50% !important;
            border-top-left-radius: 50% !important;
            border-top-right-radius: 50% !important;
            border-bottom-left-radius: 50% !important;
            border-bottom-right-radius: 50% !important;
            margin: 0 10px !important;
            box-sizing: border-box;
            aspect-ratio: 1;
        }

        .pagination .page-item:first-child:not(.disabled) .page-link,
        .pagination .page-item:last-child:not(.disabled) .page-link {
            background: #fff;
            border: 1px solid #000;
            color: #000;
        }

        .pagination .page-item:first-child.disabled .page-link,
        .pagination .page-item:last-child.disabled .page-link {
            background: #ddd;
            border: 1px solid #ddd;
            color: #888;
            opacity: 1;
        }

    .pagination .page-item.active .page-link {
        background: var(--mitsubishi-red);
        border-color: var(--mitsubishi-red);
        color: #fff;
    }

    .pagination .page-item.disabled .page-link {
        opacity: 0.5;
        cursor: not-allowed;
    }

.seminuevos-disclaimer {
    font-size: 16px;
    color: #000;
    line-height: 28px;
    margin-top: 32px;
}

@media (max-width: 1199px) {
    .page-autos-seminuevos .seminuevos-title {
        font-size: 28px;
        line-height: 34px;
    }

    .page-autos-seminuevos .inv_desc {
        font-size: 16px;
        line-height: 1.6;
    }
    /* Barra FILTRAR móvil: visible debajo del header, pegada al header, sticky al hacer scroll */
    .page-autos-seminuevos .seminuevos-mobile-filter-bar {
        position: sticky;
        top: 60px;
        z-index: 1000;
        display: flex;
        align-items: center;
        justify-content: space-between;
        width: 100%;
        padding: 12px 20px;
        margin-top: -1px;
        background: var(--mitsubishi-red, #ED0000);
        color: #fff;
        font-weight: 700 !important;
        text-transform: uppercase;
        font-size: 12px;
        line-height: 1;
        cursor: pointer;
        -webkit-tap-highlight-color: transparent;
    }

    .page-autos-seminuevos .seminuevos-mobile-filter-bar-text {
        flex: 1;
        font-weight: 700 !important;
    }

    .page-autos-seminuevos .seminuevos-mobile-filter-bar-btn {
        background: none;
        border: none;
        color: #fff;
        padding: 0;
        font-size: 20px;
        cursor: pointer;
        display: flex;
        align-items: center;
        justify-content: center;
        line-height: 1;
    }
    /* Sidebar: oculto del flujo, se convierte en overlay entre header y footer */
    /* Animación: expande desde la barra FILTRAR (top: 60px), no desde arriba del header */
    .page-autos-seminuevos .inventory-sidebar {
        position: fixed !important;
        top: 60px !important;
        left: 0 !important;
        right: 0 !important;
        width: 100vw !important;
        max-width: none !important;
        flex: none !important;
        order: unset;
        z-index: 9999;
        max-height: 0;
        overflow: hidden;
        transition: max-height 0.3s ease;
        background: #f6f6f6;
        display: flex;
        flex-direction: column;
        box-sizing: border-box;
    }

    body.page-autos-seminuevos.seminuevos-mobile-filters-open .inventory-sidebar {
        height: auto !important;
        max-height: 100vh !important;
        bottom: 0 !important;
    }
    /* Cabecera overlay: FILTROS + X (solo visible cuando overlay abierto) */
    .page-autos-seminuevos .seminuevos-mobile-filter-overlay-header {
        display: flex;
        align-items: center;
        justify-content: space-between;
        flex-shrink: 0;
        width: 100%;
        padding: 14px 20px;
        background: var(--mitsubishi-red, #ED0000);
        color: #fff;
    }

    .page-autos-seminuevos .seminuevos-mobile-filter-overlay-title {
        font-weight: 700;
        text-transform: uppercase;
        font-size: 15px;
    }

    .page-autos-seminuevos .seminuevos-mobile-filter-overlay-close {
        background: none;
        border: none;
        color: #fff;
        padding: 4px;
        font-size: 22px;
        cursor: pointer;
        display: flex;
        align-items: center;
        justify-content: center;
        line-height: 1;
        -webkit-tap-highlight-color: transparent;
    }

    .page-autos-seminuevos .inventory-left-inner {
        height: auto;
        flex: 1;
        min-height: 0;
        padding: 16px;
    }

    .page-autos-seminuevos .inventory-sidebar .side-nav-title {
        display: none;
    }

    .page-autos-seminuevos .inventory-left-inner-scroll {
        max-height: none;
        overflow-y: auto;
        overflow-x: hidden;
        flex: 1;
        min-height: 0;
    }

    .page-autos-seminuevos .inventory-sidebar-footer {
        padding: 16px;
    }

    .page-autos-seminuevos .inventory-page-wrapper {
        min-height: auto;
    }

    .page-autos-seminuevos .inventory-main {
        order: 1;
        flex: 0 0 100%;
        max-width: 100%;
        padding: 15px;
    }
}

body.seminuevos-mobile-filters-open {
    overflow: hidden;
}
/* Ocultar barra FILTRAR cuando overlay está abierto: solo se ve FILTROS (efecto de reemplazo) */
body.page-autos-seminuevos.seminuevos-mobile-filters-open .seminuevos-mobile-filter-bar {
    display: none !important;
}
/* Barra FILTRAR móvil: oculta en desktop */
@media (min-width: 1200px) {
    .page-autos-seminuevos .seminuevos-mobile-filter-bar {
        display: none;
    }

    .page-autos-seminuevos .seminuevos-mobile-filter-overlay-header {
        display: none;
    }
}

/* ===== PÁGINA DETALLE DEL VEHÍCULO ===== */
.page-detalle-vehiculo .detalle-vehiculo-section {
    background-color: #fff;
    padding: 30px 0 60px;
}
/* Grid: galería izquierda + info derecha (misma fila desde 768px) */
.page-detalle-vehiculo .detalle-vehiculo-grid {
    display: flex;
    flex-wrap: wrap;
    margin: 0 -12px;
    align-items: flex-start;
}

    .page-detalle-vehiculo .detalle-vehiculo-grid > [class*="col-"] {
        padding: 0 12px;
        box-sizing: border-box;
    }

.page-detalle-vehiculo .detalle-gallery-col {
    width: 100%;
    flex: 0 0 100%;
}

.page-detalle-vehiculo .detalle-info-col {
    width: 100%;
    flex: 0 0 100%;
}

@media (min-width: 768px) {
    .page-detalle-vehiculo .detalle-vehiculo-grid {
        flex-wrap: nowrap;
    }

    .page-detalle-vehiculo .detalle-gallery-col {
        width: 58.333333%;
        flex: 0 0 58.333333%;
        max-width: 58.333333%;
    }

    .page-detalle-vehiculo .detalle-info-col {
        width: 41.666667%;
        flex: 0 0 41.666667%;
        max-width: 41.666667%;
    }
}

.page-detalle-vehiculo .inventory-detail-top {
    margin-bottom: 0;
}

    .page-detalle-vehiculo .inventory-detail-top .link-with-arrow {
        display: inline-block;
        margin-bottom: 10px;
        padding-left: 0;
        color: #000;
        font-size: 14px;
        text-decoration: underline;
    }

        .page-detalle-vehiculo .inventory-detail-top .link-with-arrow:hover {
            color: var(--mitsubishi-red, #e60012);
            text-decoration: none;
        }

.page-detalle-vehiculo .inv_detail-title {
    font-size: 63px;
    line-height: 70px;
    font-weight: 700;
    color: #181818;
    margin: 0;
    padding: 25px 0 40px;
    text-align: left;
}

.page-detalle-vehiculo .detalle-gallery {
    position: relative;
    margin-bottom: 15px;
}

    .page-detalle-vehiculo .detalle-gallery .carousel {
        background: #f5f5f5;
        border-radius: 4px;
        overflow: hidden;
        position: relative;
    }

    .page-detalle-vehiculo .detalle-gallery .carousel-inner {
        position: relative;
        width: 100%;
        overflow: hidden;
        aspect-ratio: 4/3;
        max-height: 440px;
    }
    /* Forzar carrusel: solo mostrar slide activo */
    .page-detalle-vehiculo .detalle-gallery .carousel-item {
        display: none !important;
        position: relative;
        float: left;
        width: 100%;
        margin-right: -100%;
        transition: transform 0.6s ease-in-out;
    }

        .page-detalle-vehiculo .detalle-gallery .carousel-item.active,
        .page-detalle-vehiculo .detalle-gallery .carousel-item.carousel-item-next,
        .page-detalle-vehiculo .detalle-gallery .carousel-item.carousel-item-prev {
            display: block !important;
            z-index: 1;
        }

    .page-detalle-vehiculo .detalle-gallery .carousel-item {
        height: 100%;
    }

        .page-detalle-vehiculo .detalle-gallery .carousel-item img {
            width: 100%;
            height: 100%;
            object-fit: cover;
            display: block;
        }

    .page-detalle-vehiculo .detalle-gallery .detalle-img-link {
        position: absolute;
        inset: 0;
        display: block;
    }

    .page-detalle-vehiculo .detalle-gallery .detalle-img-zoom {
        position: absolute;
        bottom: 16px;
        left: 16px;
        width: 44px;
        height: 44px;
        background: var(--mitsubishi-red, #e60012);
        color: #fff;
        border: none;
        border-radius: 4px;
        display: flex;
        align-items: center;
        justify-content: center;
        z-index: 10;
        cursor: pointer;
    }

        .page-detalle-vehiculo .detalle-gallery .detalle-img-zoom:hover {
            opacity: 0.9;
        }

        .page-detalle-vehiculo .detalle-gallery .detalle-img-zoom i {
            font-size: 1.2rem;
        }
/* Lightbox pantalla completa */
.detalle-lightbox {
    position: fixed;
    inset: 0;
    z-index: 9999;
    display: flex;
    align-items: center;
    justify-content: center;
    opacity: 0;
    visibility: hidden;
    transition: opacity 0.3s, visibility 0.3s;
}

    .detalle-lightbox.is-open {
        opacity: 1;
        visibility: visible;
    }

.detalle-lightbox-backdrop {
    position: absolute;
    inset: 0;
    background: rgba(0,0,0,1);
}

.detalle-lightbox-img {
    position: relative;
    z-index: 1;
    max-width: 95vw;
    max-height: 95vh;
    object-fit: contain;
}

.detalle-lightbox-prev,
.detalle-lightbox-next,
.detalle-lightbox-close {
    position: absolute;
    z-index: 2;
    width: 48px;
    height: 48px;
    border: none;
    background: rgba(255,255,255,0.15);
    color: #fff;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    opacity: 0;
    transition: opacity 0.2s;
}

.detalle-lightbox:hover .detalle-lightbox-prev,
.detalle-lightbox:hover .detalle-lightbox-next,
.detalle-lightbox:hover .detalle-lightbox-close {
    opacity: 1;
}

.detalle-lightbox-prev:hover,
.detalle-lightbox-next:hover,
.detalle-lightbox-close:hover {
    background: rgba(255,255,255,0.25);
}

.detalle-lightbox-prev {
    left: 24px;
    top: 50%;
    transform: translateY(-50%);
}

    .detalle-lightbox-prev i {
        font-size: 1.5rem;
    }

.detalle-lightbox-next {
    right: 24px;
    top: 50%;
    transform: translateY(-50%);
}

    .detalle-lightbox-next i {
        font-size: 1.5rem;
    }

.detalle-lightbox-close {
    top: 24px;
    right: 24px;
}

    .detalle-lightbox-close i {
        font-size: 1.5rem;
    }

.page-detalle-vehiculo .detalle-thumbnails-wrap {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 12px 0;
}

.page-detalle-vehiculo .detalle-thumb-nav {
    flex: 0 0 32px;
    width: 32px;
    height: 32px;
    padding: 0;
    border: none;
    background: var(--mitsubishi-red, #e60012);
    color: #fff;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    transition: opacity 0.2s;
}

    .page-detalle-vehiculo .detalle-thumb-nav:hover {
        opacity: 0.9;
    }

.page-detalle-vehiculo .detalle-thumbnails-wrap .detalle-thumbnails {
    flex: 1;
    min-width: 0;
    padding: 0;
}

.page-detalle-vehiculo .detalle-gallery .carousel-control-prev,
.page-detalle-vehiculo .detalle-gallery .carousel-control-next {
    width: 44px;
    height: 44px;
    background: var(--mitsubishi-red, #e60012);
    border-radius: 50%;
    opacity: 1;
    top: 50%;
    transform: translateY(-50%);
    border: none;
}

.page-detalle-vehiculo .detalle-gallery .carousel-control-prev {
    left: 10px;
}

.page-detalle-vehiculo .detalle-gallery .carousel-control-next {
    right: 10px;
}

    .page-detalle-vehiculo .detalle-gallery .carousel-control-prev i,
    .page-detalle-vehiculo .detalle-gallery .carousel-control-next i {
        font-size: 1.2rem;
        color: #fff;
    }

    .page-detalle-vehiculo .detalle-gallery .carousel-control-prev .carousel-control-prev-icon,
    .page-detalle-vehiculo .detalle-gallery .carousel-control-next .carousel-control-next-icon {
        display: none;
    }

.page-detalle-vehiculo .detalle-thumbnails {
    display: flex;
    gap: 8px;
    flex-wrap: nowrap;
    overflow-x: auto;
    padding: 8px 0;
    scroll-behavior: smooth;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: none;
    -ms-overflow-style: none;
}

    .page-detalle-vehiculo .detalle-thumbnails::-webkit-scrollbar {
        display: none;
    }

.page-detalle-vehiculo .detalle-thumb {
    flex: 0 0 100px;
    min-width: 100px;
    width: 100px;
    height: 75px;
    padding: 0;
    border: 2px solid transparent;
    border-radius: 4px;
    overflow: hidden;
    cursor: pointer;
    background: none;
    transition: border-color 0.2s;
}

    .page-detalle-vehiculo .detalle-thumb.active,
    .page-detalle-vehiculo .detalle-thumb:hover {
        border-color: var(--mitsubishi-red, #e60012);
    }

    .page-detalle-vehiculo .detalle-thumb img {
        width: 100%;
        height: 100%;
        object-fit: cover;
    }

.page-detalle-vehiculo .detalle-product-details {
    max-width: 470px;
    display: block;
}

    .page-detalle-vehiculo .detalle-marca,
    .page-detalle-vehiculo .detalle-product-details .detalle-marca {
        font-size: 12px !important;
        line-height: 18px;
        color: #5A646E !important;
        margin: 0 0 4px;
        font-weight: 500;
        text-transform: uppercase;
    }

.page-detalle-vehiculo .detalle-modelo {
    font-size: 42px;
    line-height: 45px;
    font-weight: 700;
    color: #181818;
    margin: 0 0 8px;
}

.page-detalle-vehiculo .detalle-anio-km {
    font-size: 0.95rem;
    font-weight: 500;
    color: #181818;
    margin: 0 0 16px;
}

/* Detalle vehículo – Tablet (intermedio entre mobile y desktop) */
@media (min-width: 768px) and (max-width: 991px) {
    .page-detalle-vehiculo .inventory-detail-top .link-with-arrow {
        font-size: 15px;
    }

    .page-detalle-vehiculo .inv_detail-title {
        font-size: 40px;
        line-height: 46px;
    }

    .page-detalle-vehiculo .detalle-modelo {
        font-size: 34px;
        line-height: 38px;
    }

    .page-detalle-vehiculo .detalle-anio-km {
        font-size: 17px;
    }
}

/* Detalle vehículo – Mobile */
@media (max-width: 767px) {
    .page-detalle-vehiculo .inventory-detail-top .link-with-arrow {
        font-size: 14px;
    }

    .page-detalle-vehiculo .inv_detail-title {
        font-size: 28px;
        line-height: 34px;
        padding: 25px 0 10px;
    }

    .page-detalle-vehiculo .detalle-modelo {
        font-size: 28px;
        line-height: 32px;
    }

    .page-detalle-vehiculo .detalle-anio-km {
        font-size: 16px;
    }

    .page-detalle-vehiculo .detalle-price h3 {
        font-size: 21px !important;
    }

    .page-detalle-vehiculo .detail-cotiza-btn,
    .page-detalle-vehiculo .detail-agenda-btn {
        font-size: 12px;
    }

    .page-detalle-vehiculo .detalle-feature-item {
        font-size: 14px !important;
    }

    .page-detalle-vehiculo .detalle-ubicacion {
        max-width: 100% !important;
    }

        .page-detalle-vehiculo .detalle-ubicacion .accordion-button,
        .page-detalle-vehiculo .detalle-ubicacion .accordion-button.detalle-ubicacion-title {
            font-size: 21px !important;
        }

        .page-detalle-vehiculo .detalle-ubicacion .detalle-ubicacion-horario-col {
            margin-top: 40px;
        }

        .page-detalle-vehiculo .detalle-ubicacion .detalle-ubicacion-horario-fila {
            margin-left: 20px;
        }

        .page-detalle-vehiculo .detalle-ubicacion .btn-danger.detalle-ubicacion-btn-cotiza {
            width: 100%;
            display: block;
            box-sizing: border-box;
            font-size: 12px;
        }
    /* Banner "Visita nuestro piso de venta": icono arriba, texto debajo, botón ancho completo */
    .page-detalle-vehiculo .detalle-info-banner {
        flex-direction: column;
        align-items: center;
        text-align: center;
        flex-wrap: wrap-reverse !important;
    }

    .page-detalle-vehiculo .detalle-info-banner-icon {
        margin-left: 0;
    }

    .page-detalle-vehiculo .detalle-info-banner-text {
        margin-left: 0;
        width: 100%;
        align-items: center;
    }

    .page-detalle-vehiculo .detalle-banner-contactanos {
        width: 100%;
        display: block;
        box-sizing: border-box;
        margin-left: 0;
        text-align: center;
    }
}

.page-detalle-vehiculo .location-data-wrap {
    margin-bottom: 0;
    padding-left: 22px;
    position: relative;
}

    .page-detalle-vehiculo .location-data-wrap::before {
        content: "";
        position: absolute;
        left: 0;
        top: 2px;
        width: 16px;
        height: 16px;
        background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='%23e60012' viewBox='0 0 16 16'%3E%3Cpath d='M8 16s6-5.686 6-10A6 6 0 0 0 2 6c0 4.314 6 10 6 10zm0-7a3 3 0 1 1 0-6 3 3 0 0 1 0 6z'/%3E%3C/svg%3E") no-repeat center;
        background-size: contain;
    }

.page-detalle-vehiculo .agency-location {
    font-size: 16px;
    color: #181818;
    margin: 0 0 4px;
}

.page-detalle-vehiculo .agency-label {
    display: block;
    font-size: 0.9rem;
    color: #181818;
    margin: 0 0 16px;
    text-transform: uppercase;
}
/* Nombre de la distribuidora en mayúsculas (sección Ubicación) - columna es col-md-7 */
.page-detalle-vehiculo .detalle-ubicacion .accordion-body .row > .col-md-7 > p.fw-bold {
    text-transform: uppercase !important;
}

.page-detalle-vehiculo .detalle-price-separator {
    display: block;
    border: none;
    border-top: 1px solid #c8c8c8;
    margin: 16px 0 16px;
    height: 0;
    overflow: hidden;
}

.page-detalle-vehiculo .detalle-price {
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    align-items: baseline;
    gap: 6px 10px;
    margin-bottom: 24px;
}

.page-detalle-vehiculo .detalle-price-label {
    font-size: 12px;
    color: #181818;
    text-transform: uppercase;
    font-weight: 600;
    letter-spacing: 0.02em;
}

.page-detalle-vehiculo .detalle-price h3 {
    font-size: 36px;
    font-weight: 700;
    color: #181818;
    margin: 0;
}

.page-detalle-vehiculo .detalle-caracteristicas {
    margin-top: 24px;
    padding-top: 20px;
    border-top: 1px solid #c8c8c8;
}

.page-detalle-vehiculo .detail-page-btns {
    display: flex;
    flex-direction: column;
    gap: 12px;
}

.page-detalle-vehiculo .detail-cotiza-btn {
    background-color: var(--mitsubishi-red, #e60012) !important;
    border: none !important;
    border-radius: 4px;
    color: #fff !important;
    font-weight: 700;
    text-transform: uppercase;
    padding: 12px 24px;
}

    .page-detalle-vehiculo .detail-cotiza-btn:hover {
        background-color: #000 !important;
        color: #fff !important;
    }

.page-detalle-vehiculo .detail-agenda-btn {
    border: 2px solid #000;
    background: #fff !important;
    color: #000 !important;
    font-weight: 700;
    text-transform: uppercase;
    padding: 12px 24px;
    border-radius: 4px;
}

    .page-detalle-vehiculo .detail-agenda-btn:hover {
        background: #000 !important;
        color: #fff !important;
        border-color: #000;
    }

.page-detalle-vehiculo .charasteristic-title {
    font-size: 24px;
    font-weight: 700;
    margin-bottom: 16px;
    color: #181818;
}

.page-detalle-vehiculo .detalle-caracteristicas .features-used,
.page-detalle-vehiculo .detalle-features-grid {
    display: grid !important;
    grid-template-columns: repeat(3, 1fr);
    gap: 32px 24px;
}

.page-detalle-vehiculo .detalle-feature-item {
    display: flex;
    align-items: flex-start;
    gap: 10px;
    font-size: 16px;
    color: #000;
}

    .page-detalle-vehiculo .detalle-feature-item img,
    .page-detalle-vehiculo .detalle-feature-item i {
        flex-shrink: 0;
    }

    .page-detalle-vehiculo .detalle-feature-item i {
        color: var(--mitsubishi-red, #e60012);
    }
    /* SVG como <img> se pinta de rojo con filter */
    .page-detalle-vehiculo .detalle-feature-item img {
        filter: brightness(0) saturate(100%) invert(27%) sepia(98%) saturate(5000%) hue-rotate(350deg);
    }

.page-detalle-vehiculo .detalle-ubicacion {
    margin-top: 24px;
    max-width: 80%;
    width: 100%;
    margin-left: auto;
    margin-right: auto;
}

    .page-detalle-vehiculo .detalle-ubicacion .accordion-item {
        border: none;
        border-top: 1px solid #c8c8c8;
        border-radius: 0;
        overflow: hidden;
        background: transparent;
    }

    .page-detalle-vehiculo .detalle-ubicacion .accordion-button,
    .page-detalle-vehiculo .detalle-ubicacion .accordion-button.detalle-ubicacion-title {
        font-weight: 700;
        font-size: 36px;
        line-height: 1.4;
        color: #333;
        border: none;
        background: transparent;
        box-shadow: none;
        padding-left: 0;
    }

        .page-detalle-vehiculo .detalle-ubicacion .accordion-button:not(.collapsed),
        .page-detalle-vehiculo .detalle-ubicacion .accordion-button.detalle-ubicacion-title:not(.collapsed) {
            background: transparent;
            box-shadow: none;
        }

    .page-detalle-vehiculo .detalle-ubicacion .accordion-body {
        padding: 10px 0 12px;
    }

        .page-detalle-vehiculo .detalle-ubicacion .accordion-body .row > .col-md-7 > p.fw-bold {
            color: #000;
            font-size: 16px;
            font-weight: normal !important;
            text-transform: uppercase !important;
        }

        .page-detalle-vehiculo .detalle-ubicacion .accordion-body .row > .col-md-5 > p.fw-bold {
            color: #000;
            font-size: 16px;
            font-weight: normal !important;
            text-transform: uppercase;
        }

        .page-detalle-vehiculo .detalle-ubicacion .accordion-body p {
            color: #000;
            margin-bottom: 0.35rem;
            font-weight: normal !important;
        }

    .page-detalle-vehiculo .detalle-ubicacion .detalle-ubicacion-address {
        display: flex;
        align-items: flex-start;
        gap: 8px;
    }

    .page-detalle-vehiculo .detalle-ubicacion .detalle-ubicacion-address-link {
        color: #000;
        text-decoration: none;
        cursor: pointer;
        transition: color 0.2s ease;
    }

        .page-detalle-vehiculo .detalle-ubicacion .detalle-ubicacion-address-link:hover {
            color: var(--mitsubishi-red, #e60012);
        }

    .page-detalle-vehiculo .detalle-ubicacion .detalle-ubicacion-pin {
        color: #e60012;
        font-size: 1rem;
        flex-shrink: 0;
        margin-top: 2px;
    }

    .page-detalle-vehiculo .detalle-ubicacion .col-md-6:last-child {
        display: flex;
        flex-direction: column;
        align-items: flex-start;
    }

    .page-detalle-vehiculo .detalle-ubicacion .detalle-ubicacion-horario-col {
        align-items: flex-start;
    }

        .page-detalle-vehiculo .detalle-ubicacion .detalle-ubicacion-horario-col .detalle-ubicacion-btn-cotiza {
            align-self: flex-start;
        }

    .page-detalle-vehiculo .detalle-ubicacion .detalle-ubicacion-horario-titulo {
        text-align: left;
        width: 100%;
        margin-bottom: 0.5rem;
    }

    .page-detalle-vehiculo .detalle-ubicacion .detalle-ubicacion-horario-lista {
        width: 100%;
        margin-bottom: 0.25rem;
    }

    .page-detalle-vehiculo .detalle-ubicacion .detalle-ubicacion-horario-fila {
        display: flex;
        justify-content: space-between;
        align-items: baseline;
        gap: 24px;
        margin-bottom: 0.35rem;
    }

    .page-detalle-vehiculo .detalle-ubicacion .detalle-ubicacion-horario-dia,
    .page-detalle-vehiculo .detalle-ubicacion .detalle-ubicacion-horario-horas {
        color: #000;
        font-size: 14px;
        font-weight: normal;
    }

    .page-detalle-vehiculo .detalle-ubicacion .btn-danger.detalle-ubicacion-btn-cotiza {
        border-radius: 0;
        font-weight: 700;
        text-transform: uppercase;
        margin-top: 12px;
        padding: 0 30px;
        height: 50px;
        line-height: 50px;
        background-color: #e60012;
        border: 1px solid #e60012;
        color: #fff;
        text-align: center;
        display: inline-block;
        box-sizing: border-box;
    }

        .page-detalle-vehiculo .detalle-ubicacion .btn-danger.detalle-ubicacion-btn-cotiza:hover {
            background-color: #000;
            border-color: #000;
            color: #fff;
        }

.page-detalle-vehiculo .detalle-info-banner {
    background: #000;
    color: #fff;
    padding: 40px 24px;
    margin-top: 32px;
    display: flex;
    align-items: center;
    gap: 16px;
    flex-wrap: wrap;
}

.page-detalle-vehiculo .detalle-info-banner-icon {
    width: 70px;
    height: 70px;
    background: transparent;
    color: #fff;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
}

    .page-detalle-vehiculo .detalle-info-banner-icon i {
        font-size: 4rem;
        color: #fff;
    }

.page-detalle-vehiculo .detalle-info-banner-text {
    flex: 1;
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: 4px;
    margin-left: 20px;
}

.page-detalle-vehiculo .detalle-info-banner-titulo {
    font-size: 24px;
    font-weight: 700;
    color: #fff;
}

.page-detalle-vehiculo .detalle-info-banner-desc {
    font-size: 16px;
    font-weight: normal;
    color: #fff;
}

.page-detalle-vehiculo .detalle-banner-contactanos {
    background: #000 !important;
    border: 1px solid #fff !important;
    color: #fff !important;
    font-weight: 700;
    text-transform: uppercase;
    padding: 15px 60px;
    border-radius: 4px;
    margin-left: auto;
}

    .page-detalle-vehiculo .detalle-banner-contactanos:hover {
        background: #e60012 !important;
        border-color: #e60012 !important;
        color: #fff !important;
    }

.page-detalle-vehiculo .detalle-similares {
    margin-top: 40px;
}

.page-detalle-vehiculo .detalle-similar-card {
    border: 1px solid #e0e0e0;
    border-radius: 4px;
    overflow: hidden;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.08);
}

.page-detalle-vehiculo .detalle-section-title {
    font-size: 1.25rem;
    font-weight: 700;
    margin-bottom: 20px;
}

.page-detalle-vehiculo .detalle-similar-card .card-body {
    padding: 16px;
}

.page-detalle-vehiculo .detalle-similar-card .detalle-similar-precio {
    color: #000;
    font-size: 1.25rem;
    font-weight: 700;
    margin-bottom: 0px !important;
}

.page-detalle-vehiculo .detalle-similar-card .detalle-similar-titulo {
    color: #5A646E;
    font-size: 12px;
    font-weight: normal;
    text-transform: uppercase;
    margin-bottom: 0.25rem;
}

.page-detalle-vehiculo .detalle-similar-card .detalle-similar-info {
    color: #000;
    font-size: 14px;
    font-weight: normal;
    margin-bottom: 0;
    margin-top: 12px;
}

.page-detalle-vehiculo .detalle-similar-links {
    display: flex;
    gap: 40px;
    margin-top: 12px;
    font-weight: 700;
}

.page-detalle-vehiculo .detalle-similar-link {
    color: #000;
    font-size: 0.9rem;
    text-decoration: none;
}

    .page-detalle-vehiculo .detalle-similar-link:hover {
        color: #e60012;
        text-decoration: none;
    }

    .page-detalle-vehiculo .detalle-similar-link .bi {
        font-size: 0.75rem;
    }

.page-detalle-vehiculo .detalle-info-adicional {
    margin-top: 40px;
    padding-top: 24px;
    border-top: 1px solid #e0e0e0;
}

.page-detalle-vehiculo .detalle-info-adicional-grid {
    margin: 0;
}

.page-detalle-vehiculo .detalle-info-adicional-title-col {
    padding-left: 15px;
    padding-right: 15px;
}

.page-detalle-vehiculo .detalle-info-adicional-title {
    font-size: 1.25rem;
    font-weight: 700;
    color: #000;
    margin-bottom: 0;
}

.page-detalle-vehiculo .detalle-info-adicional-content-col {
    padding-left: 15px;
    padding-right: 0;
}

.page-detalle-vehiculo .detalle-info-adicional-content {
    margin-bottom: 60px;
}

.page-detalle-vehiculo .detalle-info-adicional-intro,
.page-detalle-vehiculo .detalle-info-adicional-nota {
    color: #000;
    font-size: 1rem;
    font-weight: normal;
    line-height: 1.6;
    margin-bottom: 1rem;
}

    .page-detalle-vehiculo .detalle-info-adicional-nota strong {
        font-weight: 700;
        color: #000;
    }

@media (min-width: 1200px) {
    .page-detalle-vehiculo .detalle-info-adicional-title-col,
    .page-detalle-vehiculo .detalle-info-adicional-content-col {
        padding-left: 40px;
    }
}

@media (min-width: 768px) {
    .page-detalle-vehiculo .detalle-vehiculo-grid .detalle-info-col {
        margin-left: 0;
    }
}