/*
Theme Name: Tesla Sabana
Version: 0.1.2
Description: Catálogo y blog de Baterías Automotrices Tesla.
Text Domain: tesla
Update URI: https://bateriastesla-sabana.com/tema-tesla/
*/
:root{--yellow:#ffbf20;--ink:#171b20;--muted:#697079;--paper:#f6f5f1}*{box-sizing:border-box}body{margin:0;font-family:Arial,Helvetica,sans-serif;color:var(--ink);background:#fff;line-height:1.6}a{color:inherit;text-decoration:none}button,input,select,textarea{font:inherit}img{max-width:100%;height:auto}button,a,input,select,textarea{outline-offset:5px}:focus-visible{outline:3px solid #d28b00}.wrap{width:min(1180px,90%);margin:auto}.topline{background:var(--yellow);font-size:12px;text-align:center;padding:7px 12px;font-weight:700}.header{background:#15191c;color:#fff;position:sticky;top:0;z-index:20}.nav{display:flex;align-items:center;justify-content:space-between;gap:24px;padding:18px 0}.logo{width:178px;display:block}.navlinks{display:flex;gap:27px;align-items:center;font-size:14px}.navlinks a.active{color:var(--yellow)}.btn{display:inline-flex;justify-content:center;align-items:center;gap:8px;padding:12px 23px;border:0;border-radius:7px;background:var(--yellow);color:#16191c;font-weight:700;cursor:pointer;font-size:14px;transition:transform .2s}.btn:hover{transform:translateY(-2px);background:#ffd267}.btn.outline{background:transparent;border:1px solid #b9bdc0;color:inherit}.menu{display:none;background:none;border:1px solid #777;color:#fff;padding:8px 13px;border-radius:5px}.hero{background:#171b20;color:#fff;position:relative;overflow:hidden}.hero:before{content:'';position:absolute;inset:0;background:linear-gradient(90deg,rgba(12,15,17,.96),rgba(12,15,17,.66) 52%,rgba(12,15,17,.06)),url('assets/hero.png') center/cover}.hero .wrap{position:relative;padding:85px 0 80px}.eyebrow{font-size:12px;text-transform:uppercase;letter-spacing:2px;font-weight:700;color:#a66800}.hero .eyebrow{color:var(--yellow)}h1,h2,h3,p{margin-top:0}h1{font-size:clamp(36px,4.6vw,64px);line-height:1.05;letter-spacing:-2px;max-width:740px;margin-bottom:22px}h1 em{color:var(--yellow);font-style:normal}.hero p{max-width:520px;color:#ddd}.actions{display:flex;flex-wrap:wrap;gap:12px;margin-top:28px}.trust{display:flex;gap:27px;font-size:13px;color:#eee;margin-top:35px}.brands{border-bottom:1px solid #ececec;background:#fff}.brandlist{display:flex;justify-content:space-between;gap:22px;overflow:auto;padding:22px 0;font-weight:700;white-space:nowrap}.section{padding:65px 0}.soft{background:var(--paper)}h2{font-size:clamp(27px,3vw,38px);line-height:1.15;letter-spacing:-1px;margin-bottom:16px}.sectionhead{display:flex;justify-content:space-between;align-items:end;gap:20px;margin-bottom:28px}.sectionhead p{color:var(--muted);margin:0}.grid{display:grid;grid-template-columns:repeat(3,1fr);gap:22px}.card{border:1px solid #e7e7e5;background:#fff;border-radius:12px;padding:26px;display:flex;flex-direction:column;align-items:flex-start}.card h3{font-size:21px;margin:12px 0}.card p{font-size:14px;color:var(--muted)}.card .btn{margin-top:auto}.icon{font-size:24px;border-radius:50%;background:#fff0bf;width:54px;height:54px;display:grid;place-items:center}.battery{height:110px;width:150px;background:linear-gradient(140deg,#30363b,#101215);border-radius:8px;border-top:10px solid #4b5258;box-shadow:7px 9px 0 #eee;position:relative;margin:22px 0 24px;display:grid;place-items:center;color:var(--yellow);font-size:22px;font-weight:900}.battery:before,.battery:after{content:'';position:absolute;top:-20px;width:25px;height:12px;background:#999;border-radius:2px}.battery:before{left:17px}.battery:after{right:17px;background:#d6a322}.tag{font-size:11px;text-transform:uppercase;letter-spacing:1px;color:#8c6417}.link{font-size:14px;font-weight:700;border-bottom:2px solid var(--yellow)}.coverage{background:#171b20;color:#fff;border-radius:14px;padding:34px;display:flex;justify-content:space-between;align-items:center;gap:25px}.coverage p{margin:0;color:#c9cdd0}.payments{display:flex;align-items:center;justify-content:space-between;gap:20px;flex-wrap:wrap}.payment{display:flex;flex-direction:column;align-items:center;min-width:100px;font-size:12px;gap:5px}.payment strong{font-size:25px}.visa{font-style:italic;color:#173787}.siste{color:#126536}.master{display:flex;padding:4px}.master i{width:28px;height:28px;background:#ea231c;border-radius:50%}.master i+i{background:#f5a900;margin-left:-10px;opacity:.85}.footer{background:#111619;color:#d2d5d7;padding:42px 0}.footercols{display:grid;grid-template-columns:2fr 1fr 1fr;gap:35px}.footer h3{color:#fff}.footer a{display:block;margin:8px 0;font-size:14px}.footer small{color:#9aa1a7}.bottom{border-top:1px solid #34383c;margin-top:25px;padding-top:20px;font-size:12px}.wa{position:fixed;right:25px;bottom:24px;background:#098c43;color:white;box-shadow:0 6px 28px #0003;z-index:30}.filters{display:flex;gap:12px;flex-wrap:wrap;margin:25px 0}.filters select,.filters input{padding:13px;border:1px solid #ccd0d3;border-radius:6px;background:#fff;min-width:180px}.filters input{flex:1}.intro{padding:55px 0 35px;background:var(--paper)}.intro h1{font-size:44px}.intro p{max-width:720px;color:var(--muted)}.notice{border-left:3px solid var(--yellow);padding:15px 20px;background:#fff8e6;font-size:13px;margin:20px 0}.contact{display:grid;grid-template-columns:1fr 1fr;gap:40px}.contact a{overflow-wrap:anywhere}.form label{display:block;margin-bottom:16px;font-weight:700;font-size:14px}.form input,.form textarea{display:block;width:100%;padding:12px;border:1px solid #ccd0d3;border-radius:5px}.form button:disabled{opacity:.5;cursor:not-allowed}.article{max-width:800px}.article p{font-size:18px;line-height:1.8}.empty{padding:25px;background:#fff8e6}.skip{position:fixed;top:-60px;z-index:90;background:white;padding:10px}.skip:focus{top:0}[hidden]{display:none!important}.preview{font-size:11px;background:#edf0f2;color:#434c55;text-align:center;padding:5px}.articlevisual{height:110px;border-radius:7px;width:100%;background:linear-gradient(120deg,#21272c,#444d54);display:flex;align-items:center;justify-content:center;color:var(--yellow);font-size:28px;font-weight:700}
@media(max-width:800px){.navlinks{display:none;position:absolute;top:100%;left:0;right:0;background:#171b20;padding:25px;flex-direction:column;align-items:stretch}.navlinks.open{display:flex}.menu{display:block}.nav>.btn{display:none}.logo{width:145px}.hero .wrap{padding:55px 0}.hero:before{background:linear-gradient(90deg,#111e,#1118),url('assets/hero.png') 60%/cover}h1{letter-spacing:-1px}.grid{grid-template-columns:repeat(2,1fr)}.contact{grid-template-columns:1fr}.footercols{grid-template-columns:1fr 1fr}.footercols>div:first-child{grid-column:1/-1}.section{padding:42px 0}.sectionhead,.coverage{align-items:start;flex-direction:column}.trust{gap:12px;flex-wrap:wrap}.wa{left:15px;right:15px;bottom:12px}.footer{padding-bottom:95px}.payments{justify-content:center}.payments h3{width:100%;text-align:center}.intro h1{font-size:36px}}
@media(max-width:480px){.grid{grid-template-columns:1fr}.card{padding:23px}.filters select,.filters input{min-width:0;width:100%}.actions .btn{width:100%}.brandlist{font-size:14px}.topline{font-size:10px}.hero h1{font-size:40px}}

@font-face{font-family:Orbitron;src:url('assets/fonts/Orbitron.ttf') format('truetype');font-style:normal;font-weight:400 900;font-display:swap}
@font-face{font-family:Outfit;src:url('assets/fonts/Outfit.ttf') format('truetype');font-style:normal;font-weight:100 900;font-display:swap}
body{font-family:Outfit,Arial,sans-serif}
h1,h2,h3,.navlinks,.eyebrow,.btn,.menu,.tag{font-family:Orbitron,Outfit,sans-serif}
h1{font-weight:800;font-size:clamp(34px,4.2vw,58px);line-height:1.16;letter-spacing:-.035em}
h2{font-weight:700;font-size:clamp(25px,2.6vw,34px);line-height:1.3;letter-spacing:-.025em}
h3,.card h3{font-size:19px;line-height:1.4;letter-spacing:-.02em}
.navlinks{font-size:11px;font-weight:700;letter-spacing:.09em;text-transform:uppercase;gap:22px}
.btn{font-size:11px;font-weight:700;letter-spacing:.025em;line-height:1.6}
.eyebrow,.tag{font-size:10px;letter-spacing:.13em;line-height:1.7}
.card p{font-size:15px}.hero p{font-size:18px}.footer h3{font-size:16px}
@media(max-width:1000px) and (min-width:801px){.nav{gap:14px}.navlinks{gap:13px;font-size:10px}.nav>.btn{padding:12px}.logo{width:150px}}
@media(max-width:480px){.hero h1{font-size:34px}.intro h1{font-size:30px}h2{font-size:25px}.coverage{padding:25px}.navlinks{font-size:12px}}

.navlinks>a{position:relative;transition:color .18s ease}
.navlinks>a::after{content:'';position:absolute;left:50%;bottom:-12px;width:8px;height:8px;border-radius:50%;background:#ff7900;opacity:0;transform:translateX(-50%) scale(.5);transition:opacity .18s ease,transform .18s ease;pointer-events:none}
.navlinks>a:hover,.navlinks>a:focus-visible{color:var(--yellow)}
.navlinks>a.active::after,.navlinks>a:hover::after,.navlinks>a:focus-visible::after{opacity:1;transform:translateX(-50%) scale(1)}
@media(max-width:800px){.navlinks>a{align-self:flex-start}}
@media(prefers-reduced-motion:reduce){.navlinks>a,.navlinks>a::after{transition:none}}


.brandlist{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:14px;overflow:visible;padding:28px 0;white-space:normal}
.brand-button{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:15px;min-width:0;min-height:126px;padding:18px 16px 13px;background:#fff;border:1px solid #e3e5e7;border-radius:12px;box-shadow:0 3px 10px #171b2005;transition:border-color .2s,box-shadow .2s,transform .2s}
.brand-button img{display:block;width:100%;height:64px;object-fit:contain}
.brand-button>span{font-family:Outfit,Arial,sans-serif;font-size:12px;font-weight:500;color:#697079;line-height:1.4}
.brand-button>span>span{color:#aa6500;margin-left:6px}
.brand-button.brand-magna,.brand-button.brand-duncan{background:#20262b;border-color:#20262b}
.brand-button.brand-magna>span,.brand-button.brand-duncan>span{color:#d9dde0}
.brand-button.brand-magna>span>span,.brand-button.brand-duncan>span>span{color:var(--yellow)}
.brand-button.brand-magna img{height:64px;object-fit:cover}
.brand-button:hover,.brand-button:focus-visible{border-color:var(--yellow);box-shadow:0 7px 22px #171b2014;transform:translateY(-3px)}
@media(max-width:800px){.brandlist{grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}.brand-button{padding:14px 12px;min-height:116px}.brand-button img{height:55px}}
@media(max-width:480px){.brandlist{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;padding:22px 0}.brand-button{min-height:116px}}
@media(prefers-reduced-motion:reduce){.brand-button{transition:none}.brand-button:hover,.brand-button:focus-visible{transform:none}}

body{padding-bottom:var(--payment-dock-height,110px)}
.payment-dock{position:fixed;inset:auto 0 0;z-index:40;background:#fff;border-top:2px solid var(--yellow);box-shadow:0 -8px 30px #0002;padding:12px 0 max(12px,env(safe-area-inset-bottom))}
.dock-inner{display:flex;align-items:center;justify-content:space-between;gap:24px}
.payment-dock .payments{flex:1;gap:18px;flex-wrap:nowrap}
.payment-heading{font-family:Orbitron,Arial,sans-serif;font-size:11px;font-weight:700;max-width:180px}
.payment-heading small{display:block;font-family:Outfit,Arial,sans-serif;font-size:10px;color:#697079;font-weight:400;margin-top:5px}
.payment-dock .payment{min-width:0;gap:2px;white-space:nowrap;font-size:10px}
.payment-dock .payment strong{font-size:21px}
.payment-dock .master i{width:23px;height:23px}
.payment-dock .wa{position:static;flex-shrink:0;box-shadow:none;margin:0;min-height:44px}
.battery-discovery{background:radial-gradient(ellipse at 90% 0%,#ffbf2012,transparent 55%),#14191d;color:#f7f8f9;border-top:1px solid #31383d}
.battery-discovery .eyebrow{color:var(--yellow)}
.battery-discovery .sectionhead p{color:#bdc6cc}
.battery-discovery .card{background:linear-gradient(145deg,#262e34,#1c2328);border-color:#3b444b;border-top:3px solid #ffbf20;box-shadow:0 12px 28px #0002}
.battery-discovery .card p{color:#c2cbd1}
.battery-discovery .battery{background:linear-gradient(140deg,#414b53,#151b20);box-shadow:7px 9px 0 #ffffff0a}
@media(max-width:1050px){.payment-heading{display:none}.dock-inner{gap:18px}.payment-dock .payments{gap:12px}}
@media(max-width:650px){.dock-inner{flex-direction:column;gap:9px;width:94%}.payment-dock{padding-top:9px}.payment-dock .payments{width:100%;justify-content:space-between;gap:6px}.payment-dock .payment{font-size:9px}.payment-dock .payment strong{font-size:16px}.payment-dock .master{padding:2px}.payment-dock .master i{width:19px;height:19px}.payment-dock .wa{width:100%;min-height:40px;padding:10px}.footer{padding-bottom:35px}body{padding-bottom:var(--payment-dock-height,132px)}}

.coverage-band{background:#171b20;color:#fff;border-top:1px solid #333a40;border-bottom:1px solid #333a40}
.coverage-band .coverage{background:transparent;border-radius:0;padding:30px 0;gap:30px}
.coverage-band .coverage h2{font-size:clamp(21px,2.3vw,29px);margin:8px 0 10px;line-height:1.3}
.coverage-band .coverage p{font-size:14px}
.coverage-band .coverage>.btn{flex-shrink:0}
@media(max-width:800px){.coverage-band .coverage{padding:26px 0;gap:20px}}

.brand-controls{display:flex;align-items:center;justify-content:space-between;padding-top:20px;gap:15px}.slide-toggle{border:1px solid #ccd0d3;background:#fff;border-radius:6px;padding:8px 12px;font-size:12px;cursor:pointer;min-height:40px}
.brand-viewport{overflow-x:auto;padding:0 0 14px}.brandlist{display:flex;width:max-content;gap:14px;margin:0;padding:22px 14px}.brandlist .brand-button{width:210px;flex:0 0 210px}.brands.is-moving .brand-viewport{overflow:hidden}.brands.is-moving .brandlist{animation:brand-flow 65s linear infinite;will-change:transform}.brands.is-paused .brandlist,.brands.is-offscreen .brandlist,.brands:hover .brandlist{animation-play-state:paused}
@keyframes brand-flow{from{transform:translateX(var(--brand-distance))}to{transform:translateX(0)}}
.btn{transition:transform .18s ease,background-color .18s ease,box-shadow .18s ease}.btn:hover{box-shadow:0 6px 18px #0002}.btn:active{transform:translateY(0) scale(.98)}
.reveal-pending{opacity:0;transform:translateY(18px)}.reveal-ready{transition:opacity .5s ease,transform .5s ease;opacity:1;transform:translateY(0)}
.local-faq details{padding:20px 0;border-bottom:1px solid #ddd}.local-faq summary{font-weight:600;cursor:pointer}.local-faq details p{margin:12px 0 0;color:var(--muted)}
@media(max-width:480px){.brandlist .brand-button{width:170px;flex-basis:170px}.hero h1{font-size:30px;line-height:1.25}}
@media(prefers-reduced-motion:reduce){.brands.is-moving .brandlist{animation:none!important;transform:none!important}.reveal-pending,.reveal-ready{opacity:1;transform:none;transition:none}.btn{transition:none}.btn:hover,.btn:active{transform:none}}

.brand-viewport{overflow-x:auto;overscroll-behavior-x:contain;scrollbar-width:none;touch-action:pan-x pan-y pinch-zoom}.brand-viewport::-webkit-scrollbar{display:none}.brandlist{animation:none!important;transform:none!important}

.product-card{padding:20px;overflow:hidden}.product-photo{width:100%;height:210px;background:#f2f0ea;border-radius:8px;overflow:hidden;margin-bottom:20px}.product-photo svg{display:block;width:100%;height:100%}.product-card h2{font-size:20px;line-height:1.4;margin:10px 0}.product-card .reference-note{font-size:12px;color:#875600;background:#fff4d5;padding:8px 10px;border-radius:5px}.product-card .btn{width:100%;margin-top:auto}.product-card p{margin-bottom:16px}
.contact-map{margin-top:45px}.contact-map iframe{display:block;border-radius:12px;background:#eceeea}.contact-map>p{font-size:13px;margin-top:15px}@media(max-width:650px){.contact-map iframe{height:320px}}
.contact-map:first-child{margin-top:0;margin-bottom:45px}

.locations{margin-bottom:55px}.locations-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:26px}.location-card{border:1px solid #dedfe0;border-radius:14px;overflow:hidden;background:#fff;display:flex;flex-direction:column}.location-info{padding:28px;flex:1;border-top:4px solid var(--yellow)}.location-info h3{font-size:29px;margin:8px 0 16px}.location-info h4{margin:22px 0 12px}.location-address{color:#59636b}.location-hours{margin:0;font-size:14px}.location-hours>div{display:flex;justify-content:space-between;gap:16px;padding:9px 0;border-bottom:1px solid #eee}.location-hours dt{font-weight:600}.location-hours dd{margin:0;text-align:right}.location-card iframe{display:block;border:0;background:#edf0ed}.location-actions{display:flex;gap:12px;padding:22px;flex-wrap:wrap}.location-actions .btn{flex:1}.location-actions .btn+ .btn{background:#20272c;color:#fff}@media(max-width:800px){.locations-grid{grid-template-columns:1fr}.location-info{padding:22px}.location-hours>div{flex-wrap:wrap;gap:4px}.location-hours dd{text-align:left}.location-actions{padding:18px}.location-card iframe{height:280px}}

/* Customer reviews entry point */
.tesla-reviews{background:#171d21;color:#fff;border-top:3px solid #ffbf18}
.reviews-intro{display:flex;align-items:center;justify-content:space-between;gap:36px}
.tesla-reviews h2{color:#fff;margin:12px 0 18px}
.tesla-reviews p{color:#d5dadd;max-width:690px;margin:0;line-height:1.7}
.reviews-intro>.btn{flex-shrink:0}
@media(max-width:800px){.reviews-intro{flex-direction:column;align-items:flex-start;gap:24px}.tesla-reviews h2{font-size:clamp(24px,6vw,34px)}}
.reviews-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px;margin-top:36px}
.review-card{background:#222a2f;border:1px solid #364047;border-radius:16px;padding:26px;min-width:0}
.review-author{display:flex;gap:12px;align-items:center}
.review-avatar{display:grid;place-items:center;width:44px;height:44px;flex-shrink:0;border-radius:50%;background:#ffbf18;color:#171d21;font-weight:700;font-size:20px}
.review-card h3{font-family:inherit;font-size:17px;color:#fff;margin:0 0 3px}
.review-source{font-size:12px;color:#b7c0c7}
.review-stars{color:#ffbf18;letter-spacing:3px;margin:18px 0 12px;font-size:20px}
.review-card blockquote{font-size:15px;line-height:1.75;color:#e0e5e8;margin:0;overflow-wrap:anywhere}
@media(max-width:1000px){.reviews-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:600px){.reviews-grid{grid-template-columns:1fr}.review-card{padding:23px}}
.reviews-viewport{overflow-x:auto;scrollbar-width:none;margin-top:36px;overscroll-behavior-x:contain}
.reviews-viewport::-webkit-scrollbar{display:none}
.reviews-viewport .reviews-grid{display:flex;gap:20px;margin-top:0;padding:2px 0 12px}
.reviews-viewport .review-card{flex:0 0 370px;box-sizing:border-box}
.reviews-viewport:focus-visible{outline:2px solid #ffbf18;outline-offset:5px}
@media(max-width:600px){.reviews-viewport .review-card{flex-basis:calc(100vw - 64px)}}
@media(min-width:1024px){
 .tesla-reviews>.wrap{width:calc(100% - 96px);max-width:1760px;margin-inline:auto}
 .reviews-viewport .review-card{flex-basis:clamp(370px,28vw,460px);padding:30px}
}
@media(min-width:1800px){.tesla-reviews>.wrap{width:calc(100% - 128px)}}
@media(max-width:600px){
 .reviews-viewport .review-card{flex-basis:100%;padding:24px}
 .reviews-viewport{scroll-snap-type:x mandatory}
 .reviews-viewport .review-card{scroll-snap-align:start}
 .review-card blockquote{font-size:15px;line-height:1.7}
}

.footer .footercols a{position:relative;width:fit-content;max-width:100%;transition:color .22s ease,transform .22s ease;text-decoration:none}
.footer .footercols a::after{content:"";position:absolute;left:0;bottom:-4px;width:100%;height:2px;background:linear-gradient(90deg,#ffbf18,#ff7518);transform:scaleX(0);transform-origin:left;transition:transform .22s ease;border-radius:2px}
.footer .footercols a:hover,.footer .footercols a:focus-visible{color:#ffbf18;transform:translateX(5px)}
.footer .footercols a:hover::after,.footer .footercols a:focus-visible::after{transform:scaleX(1)}
.footer .footercols a:focus-visible{outline:2px solid #ffbf18;outline-offset:7px;border-radius:2px}
@media(prefers-reduced-motion:reduce){.footer .footercols a,.footer .footercols a::after{transition:none}.footer .footercols a:hover,.footer .footercols a:focus-visible{transform:none}}
.payment .payment-qr{width:32px;height:32px;object-fit:contain;display:block;border-radius:4px}

@media(max-width:800px){
 .header .nav{flex-wrap:wrap;justify-content:center;gap:14px;padding:14px 0 18px}
 .header .menu{display:none}
 .header .navlinks,.header .navlinks.open{display:grid;position:static;width:100%;grid-template-columns:repeat(6,minmax(0,1fr));gap:8px;padding:0;background:transparent;flex-direction:initial;font-size:10px;letter-spacing:.02em}
 .header .navlinks>a{grid-column:span 2;align-self:stretch;display:flex;align-items:center;justify-content:center;min-height:44px;padding:10px 4px 14px;border:1px solid #3a4248;border-radius:7px;background:#20272c;text-align:center}
 .header .navlinks>a:nth-last-child(-n+2){grid-column:span 3}
 .header .navlinks>a.active{border-color:#ffbf20;background:#302b1c}
 .header .navlinks>a::after{bottom:4px;width:5px;height:5px}
 .header .navlinks>a:hover,.header .navlinks>a:focus-visible{border-color:#ffbf20;background:#302b1c}
}

.header{position:relative;top:auto}
