/* GS Transportes v3 — preto, amarelo da logo e branco */
:root{--bg:#000;--s1:#0b0b0b;--card:#141414;--line:#262626;--y:#fbba07;--w:#fff;--mut:#b5b5b5;--wa:#25d366;--wa-h:#1ebe5a;
 --fh:"Inter Tight",Arial,Helvetica,sans-serif;--fb:Inter,Arial,Helvetica,sans-serif;--r:16px;--wrap:1200px}
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;text-size-adjust:100%;scroll-behavior:smooth;scroll-padding-top:80px;overflow-x:hidden}
body{margin:0;background:var(--bg);color:var(--w);font:400 16px/1.55 var(--fb);min-width:0}
/* rede de segurança: nada passa da largura da tela (clip não cria área de rolagem e não quebra o cabeçalho sticky) */
@supports (overflow:clip){html,body{overflow-x:clip}}
main,section,header,footer,.wrap{max-width:100%}
img{max-width:100%;height:auto;display:block}
a{color:inherit}
h1,h2,h3{font-family:var(--fh);font-weight:800;line-height:1.05;letter-spacing:-.02em;margin:0}
p{margin:0}
.y{color:var(--y)}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.skip{position:absolute;left:-999px;top:8px;background:var(--y);color:#000;padding:10px 14px;z-index:100;font-weight:600}
.skip:focus{left:8px}
:focus-visible{outline:3px solid var(--y);outline-offset:3px}
.wrap{width:100%;max-width:var(--wrap);margin:0 auto;padding:0 20px}
.ico{flex:none}

/* botões */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:10px;min-height:52px;padding:0 26px;border-radius:999px;font:700 15px/1 var(--fh);letter-spacing:.04em;text-transform:uppercase;text-decoration:none;border:2px solid transparent;cursor:pointer;transition:background .15s,color .15s,border-color .15s}
.btn-y{background:var(--y);color:#000}.btn-y:hover{background:#ffcb3d}
.btn-wa{background:var(--wa);color:#000}.btn-wa:hover{background:var(--wa-h)}
.btn-line{border-color:#fff;color:#fff;background:transparent}.btn-line:hover{background:#fff;color:#000}
.btn-sm{min-height:42px;padding:0 18px;font-size:13px}
.btn-block{width:100%}
.lnk{color:var(--w);font-weight:600;text-decoration:underline;text-decoration-color:var(--y);text-decoration-thickness:2px;text-underline-offset:4px}
.lnk:hover{color:var(--y)}

/* topo */
.top{position:sticky;top:0;z-index:50;width:100%;background:#000;border-bottom:1px solid #1a1a1a}
.top-in{display:flex;align-items:center;gap:16px;height:68px}
.brand{display:flex;align-items:center;gap:10px;text-decoration:none;margin-right:auto}
.brand img{width:50px;height:auto}
.brand span{font:800 15px/1 var(--fh);letter-spacing:.08em;text-transform:uppercase}
.brand b{font-weight:600;color:var(--mut)}
.nav ul{list-style:none;margin:0;padding:0;display:flex;gap:28px}
.nav a{text-decoration:none;font-weight:500;font-size:15px;color:#e6e6e6}
.nav a:hover,.nav a[aria-current]{color:var(--y)}
.menu-btn{display:none}
@media (max-width:759px){
 .top-cta{display:none}
 .menu-btn{display:flex;align-items:center;justify-content:center;width:44px;height:44px;background:none;border:1px solid #6b6b6b;border-radius:10px;cursor:pointer;color:#fff}
 .menu-btn i,.menu-btn i::before,.menu-btn i::after{display:block;width:18px;height:2px;background:currentColor;position:relative;transition:transform .2s}
 .menu-btn i::before,.menu-btn i::after{content:"";position:absolute;left:0}
 .menu-btn i::before{top:-6px}.menu-btn i::after{top:6px}
 .menu-btn[aria-expanded=true] i{background:transparent}
 .menu-btn[aria-expanded=true] i::before{transform:translateY(6px) rotate(45deg)}
 .menu-btn[aria-expanded=true] i::after{transform:translateY(-6px) rotate(-45deg)}
 .nav ul{display:none;position:absolute;left:0;right:0;top:68px;background:#000;border-bottom:1px solid #1a1a1a;flex-direction:column;gap:0;padding:8px 20px 16px}
 .menu-open .nav ul{display:flex}
 .nav li a{display:block;padding:14px 0;font-size:18px;border-bottom:1px solid #1a1a1a}
}

/* hero */
.hero{position:relative;overflow:hidden;isolation:isolate;padding:40px 0 36px;background:radial-gradient(120% 70% at 85% 40%,#1a1a1a 0,#000 60%)}
/* traço amarelo girado: fica dentro de um wrapper do tamanho do hero com overflow hidden, então nunca aumenta a largura da página */
.hero-deco{position:absolute;inset:0;overflow:hidden;pointer-events:none;z-index:-1;contain:paint}
.hero-deco::before{content:"";position:absolute;right:-10%;top:58%;width:90%;height:8px;background:var(--y);transform:rotate(-24deg);transform-origin:right center;opacity:.9}
.hero-in{position:relative;display:grid;grid-template-columns:minmax(0,1fr);gap:28px}
.hero-txt,.hero-media{min-width:0}
.hero-logo{width:96px;margin-bottom:24px}
.hero h1{font-size:clamp(40px,10.5vw,76px);max-width:12ch}
.lead{color:var(--mut);font-size:18px;margin-top:16px;max-width:42ch}
.cta-row{display:flex;flex-wrap:wrap;gap:12px;margin-top:28px}
.cta-row .btn{flex:1 1 220px}
.hero-media{position:relative}
.hero-media img{width:100%;height:auto;max-width:620px;margin:0 auto;filter:drop-shadow(0 30px 30px rgba(0,0,0,.6))}
.stats{list-style:none;margin:32px 0 0;padding:24px 0 0;display:flex;flex-wrap:wrap;gap:20px 36px;border-top:1px solid var(--line)}
.stats li{display:flex;flex-direction:column}
.stats b{font:800 34px/1 var(--fh);color:var(--y)}
.stats span{color:var(--mut);font-size:14px;margin-top:6px}
@media (min-width:960px){
 .hero{padding:72px 0 48px}
 .hero-in{grid-template-columns:minmax(0,1.1fr) minmax(0,1fr);align-items:center;gap:40px}
 .hero-deco::before{top:40%;right:-2%;width:50%;height:6px;opacity:.85}
 .hero h1{font-size:clamp(50px,4.6vw,66px);max-width:14ch}
 .cta-row .btn{flex:0 0 auto}
}

/* faixa de diferenciais */
.band{background:var(--s1);border-top:1px solid #1a1a1a;border-bottom:1px solid #1a1a1a}
.difs{list-style:none;margin:0;padding:0;display:grid}
.difs li{padding:22px 0 22px 20px;border-bottom:1px solid #1a1a1a;position:relative}
.difs li:last-child{border-bottom:0}
.difs li::before{content:"";position:absolute;left:0;top:26px;width:4px;height:36px;background:var(--y)}
.difs b{display:block;font:700 18px/1.2 var(--fh)}
.difs span{display:block;color:var(--mut);font-size:15px;margin-top:4px}
@media (min-width:760px){.difs{grid-template-columns:repeat(3,minmax(0,1fr));gap:32px}.difs li{border-bottom:0;padding:32px 0 32px 20px}.difs li::before{top:36px}}

/* seções */
.sec{padding:72px 0}
.sec-alt{background:var(--s1);border-top:1px solid #1a1a1a}
.sec-h{margin-bottom:32px}
.sec-h h1,.sec-h h2{font-size:clamp(34px,8vw,56px)}
.sec-h p{color:var(--mut);margin-top:12px;font-size:17px}
.page{padding-top:28px}
.bc{font-size:14px;color:var(--mut);margin-bottom:28px}
.bc a{color:var(--mut)}.bc a:hover{color:var(--y)}
.bc [aria-current]{color:#fff}
.kicker{font:700 13px/1.2 var(--fh);letter-spacing:.14em;text-transform:uppercase;color:var(--y);margin-bottom:14px}

/* filtros */
.filters{display:flex;gap:8px;margin-top:24px;flex-wrap:wrap}
.chip{font:600 14px/1 var(--fb);color:#fff;background:transparent;border:1px solid #6b6b6b;border-radius:999px;padding:11px 18px;cursor:pointer;min-height:44px}
.chip[aria-pressed=true]{background:var(--y);border-color:var(--y);color:#000}

/* cards da frota (padrão da referência) */
.grid{display:grid;gap:20px;grid-template-columns:minmax(0,1fr)}
@media (min-width:600px){.grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (min-width:900px){.grid{grid-template-columns:repeat(3,minmax(0,1fr))}}
.eq{background:var(--card);border-radius:var(--r);padding:20px 20px 22px;display:flex;flex-direction:column;border:1px solid #1c1c1c;min-width:0;overflow:hidden}
.eq[hidden]{display:none}
/* área de imagem com altura FIXA (sem aspect-ratio, que no Safari do iPhone fazia o card crescer além da tela) */
.eq-img{display:block;height:240px;margin:0 0 16px;min-width:0}
.eq-img img{width:100%;height:100%;max-width:100%;object-fit:contain;object-position:center;transition:transform .3s}
@media (min-width:600px){.eq-img{height:200px}}
@media (min-width:1100px){.eq-img{height:230px}}
@media (max-width:374px){.eq-img{height:200px}}
.eq:hover .eq-img img{transform:scale(1.04)}
.eq-name{font-size:clamp(24px,2.2vw,28px);overflow-wrap:anywhere;font-weight:700;letter-spacing:-.015em}
.eq-name a{text-decoration:none}
.eq-name a:hover{color:var(--y)}
.eq-txt{color:#e9e9e9;font-size:16px;margin:8px 0 18px;flex:1}
.eq-cta{min-height:54px;white-space:nowrap;padding:0 18px}
@media (min-width:900px) and (max-width:1100px){.eq-cta{font-size:13px;letter-spacing:.02em}}
@media (max-width:374px){.eq{padding:20px 16px 18px}.eq-cta{font-size:13px;letter-spacing:.01em;gap:8px;padding:0 12px}.btn{padding:0 16px}}
.disc{color:var(--mut);font-size:14px;margin-top:24px}

/* como funciona */
.steps{list-style:none;margin:0;padding:0;display:grid;gap:16px;counter-reset:s}
.steps li{counter-increment:s;background:var(--card);border-radius:var(--r);padding:26px 24px;border:1px solid #1c1c1c}
.steps li::before{content:"0" counter(s);display:block;font:800 40px/1 var(--fh);color:var(--y);margin-bottom:16px}
.steps b{display:block;font:700 20px/1.2 var(--fh)}
.steps span{display:block;color:var(--mut);margin-top:6px}
@media (min-width:760px){.steps{grid-template-columns:repeat(3,minmax(0,1fr));gap:20px}}

/* orçamento */
.orc{display:grid;grid-template-columns:minmax(0,1fr);gap:36px}
.orc>*{min-width:0}
.orc-h h1,.orc-h h2{font-size:clamp(34px,8vw,56px)}
.orc-h>p{color:var(--mut);margin-top:12px;font-size:17px;max-width:40ch}
.orc-h .btn{margin-top:24px}
.contacts{list-style:none;margin:28px 0 0;padding:0;display:grid;gap:18px}
.contacts small{display:block;color:var(--mut);font-size:13px;letter-spacing:.06em;text-transform:uppercase}
.contacts a,.contacts span{font:700 19px/1.3 var(--fh);text-decoration:none;word-break:break-word}
.contacts a:hover{color:var(--y)}
@media (min-width:960px){.orc{grid-template-columns:minmax(0,.85fr) minmax(0,1.15fr);gap:56px;align-items:start}}
.quote{background:var(--card);border-radius:var(--r);padding:24px 20px;border:1px solid #1c1c1c;display:grid;gap:18px}
@media (min-width:600px){.quote{padding:32px}}
.quote label,.fl{display:block;font-weight:600;font-size:14px;color:#e6e6e6}
.quote input[type=text],.quote input[type=date],.quote textarea{display:block;width:100%;margin-top:8px;background:#0a0a0a;border:1px solid #6b6b6b;border-radius:10px;color:#fff;font:400 16px/1.4 var(--fb);padding:13px 14px;min-height:50px}
.quote input::placeholder{color:#8a8a8a}
.quote input:focus,.quote textarea:focus{border-color:var(--y);outline:none;box-shadow:0 0 0 3px rgba(251,186,7,.25)}
.quote [aria-invalid=true]{border-color:#ff6b6b}
.quote input[type=date]{color-scheme:dark}
.row2{display:grid;gap:18px}
@media (min-width:600px){.row2{grid-template-columns:repeat(2,minmax(0,1fr))}}
.fl{margin-bottom:-8px}
.chks{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}
.chk{position:relative}
.chk input{position:absolute;opacity:0;inset:0;margin:0;cursor:pointer}
.chk span{display:flex;align-items:center;min-height:46px;padding:8px 12px;border:1px solid #6b6b6b;border-radius:10px;font-size:14px;font-weight:500;line-height:1.25}
.chk input:checked+span{border-color:var(--y);background:rgba(251,186,7,.12);color:#fff;box-shadow:inset 3px 0 0 var(--y)}
.chk input:focus-visible+span{outline:3px solid var(--y);outline-offset:2px}
.chk-help{grid-column:1/-1}
@media (min-width:760px){.chks{grid-template-columns:repeat(3,minmax(0,1fr))}}
.err{color:#ff8a8a;font-size:14px;min-height:0}
.err:empty{display:none}
.resumo{display:grid;gap:14px;border-top:1px solid var(--line);padding-top:18px}
.resumo[hidden]{display:none}
.resumo .lnk{justify-self:center;font-size:15px}

/* ficha */
.eqp{display:grid;grid-template-columns:minmax(0,1fr);gap:32px}
.eqp>*{min-width:0}
.eqp-img{margin:0;background:var(--card);border-radius:var(--r);padding:28px;border:1px solid #1c1c1c}
.eqp-img img{margin:0 auto;width:100%;height:280px;max-width:100%;object-fit:contain}
@media (min-width:960px){.eqp-img img{height:400px}}
.eqp-img figcaption{color:var(--mut);font-size:13px;margin-top:16px;text-align:center}
.eqp-txt h1{font-size:clamp(36px,8vw,60px)}
.eqp-txt .lead+.lead{margin-top:10px}
.tags{list-style:none;margin:22px 0 0;padding:0;display:flex;flex-wrap:wrap;gap:8px}
.tags li{border:1px solid #3a3a3a;border-radius:999px;padding:8px 14px;font-size:14px}
.avail{color:var(--mut);font-size:14px;margin:22px 0 16px}
.eqp-txt .btn{max-width:420px}
.eqp-txt .lnk{display:inline-block;margin-top:18px}
@media (min-width:960px){.eqp{grid-template-columns:minmax(0,1.1fr) minmax(0,1fr);gap:56px;align-items:center}}
.more{margin-top:28px}
.cta-band{display:flex;flex-direction:column;gap:20px;align-items:flex-start}
.cta-band h2{font-size:clamp(28px,6vw,44px);max-width:20ch}
@media (min-width:760px){.cta-band{flex-direction:row;align-items:center;justify-content:space-between}}
.nf{padding:40px 20px 80px}
.nf h1{font-size:clamp(40px,9vw,72px)}

/* rodapé */
.foot{border-top:3px solid var(--y);background:#000;padding:56px 0 24px}
.foot-grid{display:grid;gap:32px}
.foot-brand img{width:72px;height:auto;margin-bottom:14px}
.foot-brand p,.foot-list{color:var(--mut);font-size:15px}
.foot-h{font:700 13px/1 var(--fh);letter-spacing:.14em;text-transform:uppercase;color:#fff;margin-bottom:14px}
.foot-list{list-style:none;margin:0;padding:0;display:grid;gap:10px}
.foot-list a{color:#e6e6e6;text-decoration:none;word-break:break-word}
.foot-list a:hover{color:var(--y)}
.foot-base{display:flex;flex-wrap:wrap;gap:8px 24px;justify-content:space-between;color:#8f8f8f;font-size:13px;margin-top:40px;padding-top:20px;border-top:1px solid #1a1a1a}
@media (min-width:760px){.foot-grid{grid-template-columns:minmax(0,1.4fr) minmax(0,1fr) minmax(0,1fr)}}

/* barra fixa de WhatsApp no celular */
.dock{position:fixed;left:0;right:0;bottom:0;z-index:60;padding:10px 14px calc(10px + env(safe-area-inset-bottom));background:linear-gradient(to top,rgba(0,0,0,.95) 60%,rgba(0,0,0,0))}
@media (max-width:759px){body{padding-bottom:76px}}
@media (min-width:760px){.dock{display:none}}
@media (prefers-reduced-motion:reduce){*{transition:none!important;scroll-behavior:auto!important}}
