/* Smooth dark/light transition — only after first paint, never during initial render */ html.theme-ready, html.theme-ready body, html.theme-ready .car-card, html.theme-ready .vh-nav, html.theme-ready .mbn, html.theme-ready footer, html.theme-ready [class*="modal"], html.theme-ready [class*="drawer"], html.theme-ready .calc-modal, html.theme-ready .ac-panel, html.theme-ready .ac-bub, html.theme-ready .ac-car, html.theme-ready input, html.theme-ready textarea, html.theme-ready select, html.theme-ready button, html.theme-ready a { transition: background-color .28s var(--ease-out, ease), color .28s var(--ease-out, ease), border-color .28s var(--ease-out, ease), box-shadow .28s var(--ease-out, ease); } /* But don't transition on hover/transform changes (would lag the hover feel) */ html.theme-ready *:hover { transition-duration: .15s; } /* ═══════ VDP FAST-FIRST-PAINT (Ángel 2026-06-08) ════════ When the URL is /v/, hide the home hero + chips + CTAs IMMEDIATELY so the buyer doesn't see the giant H1 "2024 Toyota 4RUNNER" overlaying the home layout while JS finishes hydrating the VDP tab. Instead, show a slim skeleton until showVehicleDetail swaps in the real gallery. The body.is-vdp-deep-link class is added by the inline script below before any paint. */ body.is-vdp-deep-link section.section[data-tab="home"], body.is-vdp-deep-link #home-live-inventory, body.is-vdp-deep-link .hero, body.is-vdp-deep-link #location-banner, body.is-vdp-deep-link #auttiv-top-seller-section, body.is-vdp-deep-link #city-dealers-list-wrapper, /* Pre-paint (Angel 2026-06-12): el atributo en existe ANTES del primer paint — mata el flash del home-con-nombre-de-carro que la clase del body (que llega en DOMContentLoaded) no alcanzaba a tapar. openCarVdp borra el atributo al abrir, asi el home se libera solo. */ html[data-deep-link-vin] section.section[data-tab="home"], html[data-deep-link-vin] #home-live-inventory, html[data-deep-link-vin] .hero, html[data-deep-link-vin] #location-banner, html[data-deep-link-vin] #auttiv-top-seller-section, html[data-deep-link-vin] #city-dealers-list-wrapper { display: none !important; } body.is-vdp-deep-link::before { content: ''; display: block; width: min(96vw, 900px); margin: 30px auto 0; height: 360px; background: linear-gradient(90deg, var(--tint-1) 0%, var(--bg-card) 50%, var(--tint-1) 100%); background-size: 200% 100%; border-radius: 18px; animation: vdpSkelShimmer 1.4s linear infinite; } @keyframes vdpSkelShimmer { to { background-position: -200% 0; } } body.is-vdp-deep-link.is-vdp-loaded::before { display: none; }