/* Identidad de LE Clear AutoLab según el brandbook, octubre de 2026. */
@font-face{font-family:Lato;src:url('assets/fonts/Lato-Regular.ttf') format('truetype');font-weight:400;font-style:normal;font-display:swap}
@font-face{font-family:Lato;src:url('assets/fonts/Lato-Bold.ttf') format('truetype');font-weight:700;font-style:normal;font-display:swap}
@font-face{font-family:Lato;src:url('assets/fonts/Lato-Black.ttf') format('truetype');font-weight:900;font-style:normal;font-display:swap}
body{font-family:Lato,Arial,sans-serif}
h1,h2{font-family:Lato,Arial,sans-serif;font-weight:900;letter-spacing:-.055em}
h3{font-weight:700}
em{font-family:inherit;font-style:normal;font-weight:inherit;color:var(--accent)}
.commitment em{color:var(--paper)}
.eyebrow{font-weight:700}
.brand-image{width:180px;height:81px;object-fit:contain}
.brand-symbol{display:none}
.site-header{height:118px}
.button-dark{background:var(--accent);color:#FFFFFF}
.button-dark:hover{background:var(--ink)}
.header-contact{font-weight:700}
.commitment{background:#3A3A3A}
.seal{gap:18px;font-family:Lato,Arial,sans-serif}
.seal img{width:90px;height:auto}
.seal span{font-family:Lato,Arial,sans-serif}
.step-number{font-family:Lato,Arial,sans-serif;font-weight:900;font-style:normal}
.footer-brand{min-width:180px}
.footer-brand .brand-symbol{display:none}
.site-footer>p{font-family:Lato,Arial,sans-serif;font-weight:700;font-style:normal;font-size:18px}
.before-after{padding-top:0;padding-bottom:85px;display:grid;grid-template-columns:.8fr 1.4fr;gap:70px;align-items:center}
.comparison-intro h2{font-size:clamp(40px,3.7vw,56px);margin:22px 0}
.comparison-intro>p:not(.eyebrow){font-size:15px;line-height:1.75;max-width:300px;color:var(--muted)}
.comparison-instruction{margin-top:23px;display:flex;gap:12px;align-items:center}
.comparison-instruction>span{font-size:28px;color:var(--accent);line-height:1}
.comparison-intro .text-link{margin-top:25px;font-weight:700}
.comparison{--position:50%;position:relative;width:100%;aspect-ratio:3/2;overflow:hidden;background:#3A3A3A;isolation:isolate}
.comparison img{width:100%;height:100%;object-fit:cover}
.comparison-after{position:absolute;inset:0}
.comparison-before{position:absolute;inset:0;clip-path:inset(0 calc(100% - var(--position)) 0 0)}
.comparison-tag{position:absolute;z-index:2;top:18px;background:#3A3A3AE6;color:#fff;padding:9px 13px;font-size:11px;letter-spacing:.15em;font-weight:700;pointer-events:none}
.tag-before{left:18px}.tag-after{right:18px}
.comparison-divider{position:absolute;z-index:3;inset:0 auto 0 var(--position);width:2px;background:#fff;transform:translateX(-1px);pointer-events:none}
.comparison-divider>span{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:48px;height:48px;border:2px solid #fff;border-radius:50%;background:var(--accent);color:#fff;display:grid;place-items:center;font-size:23px;font-family:Arial,sans-serif}
.comparison input[type=range]{position:absolute;z-index:4;inset:0;width:100%;height:100%;margin:0;cursor:ew-resize;opacity:0;touch-action:pan-y}
.comparison:focus-within{outline:3px solid var(--accent);outline-offset:5px}
.comparison-figure figcaption{margin-top:14px;font-size:12px;line-height:1.65;color:var(--muted);max-width:650px}
.comparison-figure figcaption strong{font-weight:700}
.visually-hidden{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap;border:0}
@media(max-width:1100px){.before-after{gap:40px}.desktop-nav{gap:22px}.comparison-intro h2{font-size:43px}}
@media(max-width:760px){.site-header{height:86px}.site-header .brand-image{display:none}.site-header .brand-symbol{display:block;width:100px;height:auto}.footer-brand .brand-image{display:block;width:180px;height:81px}.before-after{display:block;padding-bottom:55px}.comparison-intro h2{font-size:43px}.comparison-intro>p:not(.eyebrow){max-width:100%}.comparison-intro .text-link{margin-top:20px}.comparison-figure{margin-top:25px}.comparison-tag{top:12px;padding:8px 11px;font-size:10px}.tag-before{left:12px}.tag-after{right:12px}.comparison-divider>span{width:42px;height:42px}.comparison-figure figcaption{font-size:12px}.site-footer>p{font-size:16px}h1{font-size:clamp(59px,12.2vw,86px)}}
@media(max-width:370px){h1{font-size:56px}}
@media(max-width:900px){.desktop-nav{display:none}.menu-toggle{display:block}.header-contact{margin-left:auto}}