/* MATEQ — "a régua da locação" */
:root{
  --azul:#174180; --noite:#0C2348; --amarelo:#FFC21A; --verde:#0A7F3F; --concreto:#EEF0F2; --tinta:#14213A;
  --linha:#CDD3DC; --suave:#4A5568; --branco:#fff;
  --fc:'Barlow Condensed','Arial Narrow',sans-serif; --f:'Barlow',system-ui,sans-serif;
}
@view-transition{navigation:auto}
*,*::before,*::after{box-sizing:border-box}
[hidden]{display:none!important}
html{-webkit-text-size-adjust:100%;scroll-padding-top:5rem}
body{margin:0;font-family:var(--f);font-size:1rem;line-height:1.55;color:var(--tinta);background:var(--concreto);overflow-x:hidden}
img,svg{max-width:100%;display:block}
a{color:var(--azul)}
h1,h2,h3{font-family:var(--fc);font-weight:800;line-height:1.02;color:var(--azul);margin:0 0 .45em;text-wrap:balance;letter-spacing:-.005em}
h1{font-size:clamp(2.4rem,6vw,3.815rem)}
h2{font-size:clamp(1.953rem,4vw,2.441rem)}
h3{font-size:1.5625rem}
small{font-family:var(--f);font-weight:600;font-size:.55em;color:var(--suave);vertical-align:middle}
p{margin:0 0 1em;max-width:66ch}
.lead{font-size:1.25rem;line-height:1.45;color:var(--suave)}
.small{font-size:.875rem;color:var(--suave)}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}
.wrap{width:min(1200px,100% - 2rem);margin-inline:auto}
.narrow{width:min(720px,100% - 2rem)}
.sec{padding:clamp(3rem,7vw,5rem) 0}
.skip{position:absolute;left:-999px}.skip:focus{left:1rem;top:1rem;z-index:99;background:#fff;padding:.5rem 1rem}
:focus-visible{outline:3px solid var(--amarelo);outline-offset:3px}
mark.tbc{background:#FFF0B8;color:#5A4300;padding:0 .25em;font-size:.88em;font-weight:600}
.plain{list-style:none;margin:0;padding:0}
.nofoto{display:grid;place-items:center;gap:.3rem;color:#8792A3;font-size:.75rem;font-weight:600;text-align:center;width:100%;height:100%;padding:1rem}
.nofoto svg{width:48px}
.nofoto.wide{aspect-ratio:600/282;background:repeating-linear-gradient(135deg,#E2E6EC 0 12px,#E9ECF1 12px 24px)}

/* Botões */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:.5rem;min-height:48px;padding:.7rem 1.25rem;border:2px solid transparent;border-radius:6px;font:inherit;font-weight:700;font-size:1rem;line-height:1.15;text-decoration:none;cursor:pointer;text-align:center;transition:background-color .15s,color .15s,transform .1s,border-color .15s}
.btn:active{transform:translateY(2px) scale(.98)}
.btn .ico{width:1.3em;height:1.3em;flex:none}
.btn-wa{background:var(--verde);color:#fff}.btn-wa:hover{background:#086332}
.btn-blue{background:var(--azul);color:#fff}.btn-blue:hover{background:var(--noite)}
.btn-line{border-color:#fff;color:#fff;background:transparent}.btn-line:hover{background:#fff;color:var(--azul)}
.btn-line.dark{border-color:var(--azul);color:var(--azul)}.btn-line.dark:hover{background:var(--azul);color:#fff}
.btn-ghost{background:transparent;border-color:var(--linha);color:var(--tinta)}.btn-ghost:hover{border-color:var(--azul)}

/* Cabeçalho inteligente */
.hdr{position:sticky;top:0;z-index:50;background:rgba(23,65,128,.94);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);transition:transform .25s ease}
.hdr.hide{transform:translateY(-100%)}
.hdr-in{display:flex;align-items:center;gap:1rem;height:72px;transition:height .2s}
.hdr.scrolled .hdr-in{height:58px}
.logo{margin-right:auto;display:block}
.logo img{height:44px;width:auto;transition:height .2s}
.hdr.scrolled .logo img{height:36px}
.nav ul{list-style:none;margin:0;padding:0;display:flex;gap:.25rem}
.nav a,.sub-btn{display:flex;align-items:center;min-height:44px;padding:0 .8rem;color:#fff;text-decoration:none;font:inherit;font-weight:600;background:none;border:0;cursor:pointer}
.nav a:hover,.sub-btn:hover{text-decoration:underline;text-underline-offset:5px;text-decoration-color:var(--amarelo)}
.has-sub{position:relative}
.sub-btn::after{content:"";width:.45em;height:.45em;border:solid currentColor;border-width:0 2px 2px 0;transform:rotate(45deg);margin:-.25em 0 0 .5em}
.sub{position:absolute;top:100%;left:0;min-width:270px;background:#fff;border-top:4px solid var(--amarelo);padding:.4rem!important;display:none!important;flex-direction:column;box-shadow:0 12px 24px rgba(12,35,72,.18)}
.sub a{color:var(--tinta)}
.has-sub.open .sub,.has-sub:focus-within .sub{display:flex!important}
.menu-btn{display:none}
.hdr-cta{min-height:44px;padding:.5rem 1rem;white-space:nowrap}
@media (max-width:920px){
  .hdr-in{height:62px;gap:.5rem}.logo img{height:36px}
  .hdr-cta{font-size:.875rem;padding:.4rem .7rem}
  .menu-btn{display:grid;place-items:center;width:44px;height:44px;background:none;border:0;cursor:pointer}
  .menu-btn span,.menu-btn span::before,.menu-btn span::after{display:block;width:22px;height:2px;background:#fff;position:relative;content:""}
  .menu-btn span::before{position:absolute;top:-7px}.menu-btn span::after{position:absolute;top:7px}
  .nav{position:absolute;top:100%;left:0;right:0;background:var(--azul);display:none;padding:.5rem 1rem 1rem}
  .nav.open{display:block}.nav ul{flex-direction:column}
  .sub{position:static;display:flex!important;background:none;border:0;box-shadow:none;padding:0 0 0 1rem!important}
  .sub a{color:#fff}.sub-btn::after{display:none}
}
@media (max-width:400px){.logo img{height:30px}}

/* Hero com a régua */
.hero{background:var(--noite);color:#fff;padding:clamp(2.5rem,6vw,4.5rem) 0}
.hero h1{color:#fff;font-size:clamp(2.5rem,5.6vw,4.2rem);line-height:.98}
.hero .lead{color:#C9D3E6}
.hero-grid{display:grid;grid-template-columns:1.05fr 1fr;gap:clamp(1.5rem,4vw,3.5rem);align-items:center}
.actions{display:flex;flex-wrap:wrap;gap:.75rem;margin-top:1.4rem}
.hero-sm{padding:clamp(2.5rem,5vw,3.5rem) 0}
.hero-sm h1{font-size:clamp(2.2rem,5vw,3.4rem)}
.hero-calc{background:#fff;color:var(--tinta);border-radius:10px;padding:1.25rem;border-top:6px solid var(--amarelo)}
.hc-top{display:flex;gap:1rem;align-items:center;margin-bottom:.5rem}
.hc-foto{width:96px;height:96px;flex:none;background:var(--concreto);border-radius:8px;padding:.4rem}
.hc-foto img{width:100%;height:100%;object-fit:contain}
.hc-nome{font-family:var(--fc);font-weight:800;font-size:1.6rem;color:var(--azul);margin:0;line-height:1}
.hero-calc .btn{width:100%;margin-top:.5rem}
@media (max-width:820px){.hero-grid{grid-template-columns:1fr}.actions .btn{flex:1 1 100%}}

/* Preço */
.preco{display:flex;align-items:baseline;gap:.3rem;flex-wrap:wrap;margin:0;font-variant-numeric:tabular-nums}
.preco span{font-size:.875rem;color:var(--suave)}
.preco strong{font-family:var(--fc);font-size:1.75rem;font-weight:800;color:var(--tinta);background:linear-gradient(transparent 58%,var(--amarelo) 58%);padding:0 .1em;line-height:1.1}
.preco.big strong{font-size:2.6rem}

/* Régua */
.regua{margin:.75rem 0 0}
.reg-var{display:flex;flex-wrap:wrap;gap:.4rem;margin-bottom:.75rem}
.reg-var button{min-height:40px;padding:.3rem .8rem;border:2px solid var(--linha);background:#fff;border-radius:999px;font:inherit;font-weight:600;font-size:.9rem;cursor:pointer;color:var(--tinta)}
.reg-var button[aria-checked=true]{border-color:var(--azul);background:var(--azul);color:#fff}
.pacotes{width:100%;border-collapse:collapse;text-align:center;font-variant-numeric:tabular-nums;margin-bottom:.9rem}
.pacotes th{font-size:.8rem;color:var(--suave);font-weight:600;padding:.25rem}
.pacotes td{font-family:var(--fc);font-weight:700;font-size:1.25rem;padding:.4rem .2rem;border:2px solid var(--linha);background:#fff;transition:background .2s,border-color .2s}
.pacotes td.win{background:var(--amarelo);border-color:#E0A800}
.reg-ctrl label{display:flex;justify-content:space-between;font-weight:700;gap:1rem}
.reg-ctrl output{font-family:var(--fc);font-size:1.3rem;color:var(--azul)}
.reg-dias{width:100%;min-height:44px;accent-color:var(--azul);margin:0}
.reg-faixas{position:relative;height:22px;margin-top:-4px}
.reg-faixas span{position:absolute;top:0;height:100%;left:calc((var(--a) / 30) * 100%);width:calc(((var(--b) - var(--a)) / 30) * 100%);border-left:2px solid #fff;background:#DCE2EA;font-size:.7rem;font-weight:700;color:var(--suave);display:grid;place-items:center;overflow:hidden;white-space:nowrap;transition:background .2s,color .2s}
.reg-faixas span.win{background:var(--amarelo);color:var(--tinta)}
.reg-q{margin-top:.6rem;display:flex!important;align-items:center;gap:.75rem;font-weight:700}
.reg-q input{max-width:110px}
.reg-res{margin:.8rem 0 .3rem;font-size:1.05rem;min-height:3.2em}
.reg-res strong{font-family:var(--fc);font-size:1.6rem;color:var(--tinta)}
.reg-res s{color:var(--suave)}
.reg-nota{font-size:.82rem;color:var(--suave);margin:0}

/* Faixa de garantias */
.faixa{background:var(--azul);color:#fff;padding:1.5rem 0}
.garantias{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(3,1fr);gap:1.5rem}
.garantias li{display:flex;flex-direction:column;gap:.2rem;padding-left:1rem;border-left:4px solid var(--amarelo)}
.garantias strong{font-family:var(--fc);font-size:1.5rem;line-height:1.05}
.garantias span{color:#D3DCEC;font-size:.95rem}
.prod + .garantias{background:var(--azul);padding:1.5rem;border-radius:10px;color:#fff;margin-bottom:1rem}
@media (max-width:760px){.garantias{grid-template-columns:1fr;gap:1rem}}

/* Plaqueta de patrimônio */
.grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(250px,1fr));gap:1.25rem;margin-bottom:2rem}
.plq{display:flex;flex-direction:column;background:#fff;border-radius:10px;overflow:hidden;border:1px solid var(--linha);transition:border-color .15s}
.plq:hover{border-color:var(--azul)}
.plq-link{display:block;color:inherit;text-decoration:none;flex:1}
.plq-foto{aspect-ratio:4/3;position:relative;background:#fff;border-bottom:1px dashed var(--linha)}
.plq-foto img{position:absolute;inset:.75rem;width:calc(100% - 1.5rem);height:calc(100% - 1.5rem);object-fit:contain}
.plq-body{padding:.9rem 1rem .5rem;position:relative}
.plq-nome{font-size:1.45rem;margin:0 0 .2rem}
.plq-link:hover .plq-nome{text-decoration:underline;text-underline-offset:4px}
.plq-var{font-size:.85rem;color:var(--suave);margin:0 0 .6rem;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.plq .btn{margin:.75rem 1rem 1rem}
.selo{display:inline-block;background:var(--noite);color:#fff;font-size:.72rem;font-weight:700;padding:.15rem .5rem;border-radius:3px;margin-bottom:.35rem}
.selo.novo{background:var(--verde)}

/* Categorias */
.cats{display:grid;grid-template-columns:repeat(4,1fr);gap:1rem}
.cat{display:flex;flex-direction:column;background:#fff;border-radius:10px;padding:1rem;text-decoration:none;color:var(--tinta);border:1px solid var(--linha);transition:border-color .15s}
.cat:hover{border-color:var(--azul)}
.cat-foto{aspect-ratio:3/2;display:block;margin-bottom:.6rem}
.cat-foto img{width:100%;height:100%;object-fit:contain}
.cat strong{font-family:var(--fc);font-size:1.4rem;color:var(--azul);line-height:1.05}
.cat span:last-child{font-size:.85rem;color:var(--suave)}
@media (max-width:900px){.cats{grid-template-columns:repeat(2,1fr)}}

/* Linha a bateria */
.bat{background:var(--noite);color:#fff}
.bat h2{color:#fff}.bat .lead{color:#C9D3E6}
.bat-in{display:grid;grid-template-columns:1fr 1fr;gap:2rem;align-items:center}
.bat-fotos{display:grid;grid-template-columns:1fr 1fr;gap:.75rem}
.bat-fotos span{background:#fff;border-radius:10px;aspect-ratio:1;padding:.75rem}
.bat-fotos img{width:100%;height:100%;object-fit:contain}
@media (max-width:760px){.bat-in{grid-template-columns:1fr}}

/* Como alugar */
.how-list{list-style:none;padding:0;margin:0 0 1rem;display:grid;grid-template-columns:repeat(4,1fr);gap:1.5rem;counter-reset:h}
.how-list li{counter-increment:h;display:flex;flex-direction:column;gap:.3rem;border-top:4px solid var(--azul);padding-top:.8rem}
.how-list li::before{content:counter(h);font-family:var(--fc);font-weight:800;font-size:3rem;line-height:.9;color:var(--azul)}
.how-list strong{font-family:var(--fc);font-size:1.4rem;color:var(--tinta);line-height:1.1}
.how-list span{color:var(--suave);font-size:.95rem}
@media (max-width:760px){.how-list{grid-template-columns:1fr 1fr}}
@media (max-width:440px){.how-list{grid-template-columns:1fr}}

/* Lojas */
.lojas{display:grid;grid-template-columns:1fr 1fr;gap:1.5rem}
.loja{background:#fff;border-radius:10px;padding:1rem;border:1px solid var(--linha)}
.loja img,.loja .nofoto{border-radius:6px;margin-bottom:.8rem;width:100%;height:auto}
.loja address{font-style:normal;margin-bottom:.6rem}
.atende{margin-top:1.5rem}
.lojas.full{padding-bottom:3rem}
.map{min-height:300px;background:#E2E6EC;display:grid;place-items:center;margin-top:1rem;border-radius:6px;overflow:hidden}
.map iframe{width:100%;height:300px;border:0}
@media (max-width:760px){.lojas{grid-template-columns:1fr}}

/* Faixa final */
.band{background:var(--azul);color:#fff;padding:clamp(3rem,7vw,5rem) 0;text-align:center;border-top:8px solid var(--amarelo)}
.band h2{color:#fff;font-size:clamp(2rem,5vw,3.2rem);max-width:20ch;margin-inline:auto}
.band-in{display:flex;flex-direction:column;align-items:center}
.band p{margin:1rem 0 0;color:#C9D3E6;font-size:.95rem;max-width:none}

/* Rodapé */
.ftr{background:var(--noite);color:#C9D3E6;padding:3rem 0 6rem}
.ftr a{color:#fff}
.ftr h2{color:#fff;font-size:1.4rem}.ftr h2 small{color:#9FB0CC}
.ftr address{font-style:normal;margin-bottom:.6rem}
.ftr li{margin-bottom:.35rem}.ftr li a{display:inline-block;padding:.2rem 0}
.ftr-logo{width:180px;height:auto;margin-bottom:1rem}
.ftr-grid{display:grid;grid-template-columns:1.2fr 1fr 1fr 1fr;gap:2rem}
.ftr mark.tbc{font-size:.8em}
@media (max-width:900px){.ftr-grid{grid-template-columns:1fr 1fr}}
@media (max-width:560px){.ftr-grid{grid-template-columns:1fr}}

/* WhatsApp flutuante */
.wa-float{position:fixed;right:16px;bottom:16px;z-index:60;width:58px;height:58px;border-radius:50%;background:var(--verde);color:#fff;display:grid;place-items:center;box-shadow:0 6px 18px rgba(5,40,20,.35);transform:translateY(120px);transition:transform .45s cubic-bezier(.34,1.56,.64,1),background .15s}
.wa-float .ico{width:30px;height:30px}
.wa-float.in{transform:none}.wa-float:hover{background:#086332}
.wa-float.pulse{animation:pulse 1.4s ease-out 1}
@keyframes pulse{0%{box-shadow:0 0 0 0 rgba(10,127,63,.6)}100%{box-shadow:0 0 0 22px rgba(10,127,63,0)}}
.wa-tip{position:absolute;right:70px;white-space:nowrap;background:#fff;color:var(--azul);font-weight:700;padding:.45rem .8rem;border-radius:6px;border:2px solid var(--azul);opacity:0;transform:translateX(8px);transition:opacity .3s,transform .3s;pointer-events:none}
.wa-float.tip .wa-tip{opacity:1;transform:none}
html:not(.js) .wa-float{transform:none}

/* Cookies */
.cookie{position:fixed;left:16px;right:90px;bottom:16px;z-index:70;background:#fff;border:2px solid var(--azul);border-radius:10px;padding:1rem;display:flex;gap:1rem;align-items:center;flex-wrap:wrap;max-width:720px}
.cookie p{margin:0;flex:1 1 280px;font-size:.875rem}
.cookie div{display:flex;gap:.5rem}
@media (max-width:560px){.cookie{right:16px;bottom:84px}}

/* Páginas internas */
.page-head{padding:2.5rem 0 1.5rem}
.crumbs{padding-top:1.2rem;font-size:.875rem;color:var(--suave)}
.prose h2{margin-top:2rem;font-size:1.953rem}
.exemplo{width:100%;border-collapse:collapse;margin:1rem 0 1.5rem;font-variant-numeric:tabular-nums;background:#fff}
.exemplo caption{text-align:left;font-weight:700;margin-bottom:.4rem}
.exemplo th,.exemplo td{border:1px solid var(--linha);padding:.6rem;text-align:left}
.exemplo td:last-child{font-weight:700}

/* Catálogo */
.cat-grid{display:grid;grid-template-columns:250px 1fr;gap:2rem;align-items:start;padding-bottom:3rem}
.filters{position:sticky;top:5rem;display:flex;flex-direction:column;gap:1rem}
.search{display:flex;flex-direction:column;gap:.3rem;font-weight:700;font-size:.875rem}
input,select{font:inherit;min-height:48px;padding:.5rem .75rem;border:2px solid var(--linha);background:#fff;color:var(--tinta);border-radius:6px;width:100%}
input:focus,select:focus{border-color:var(--azul)}
.fbox summary{font-family:var(--fc);font-weight:800;font-size:1.4rem;cursor:pointer;min-height:44px;display:flex;align-items:center;color:var(--azul)}
fieldset{border:0;padding:0;margin:0 0 1rem}
legend{font-weight:700;margin-bottom:.3rem}
.chk{display:flex;align-items:center;gap:.6rem;min-height:36px;cursor:pointer}
.chk input{width:20px;height:20px;min-height:0;accent-color:var(--azul)}
.result{font-weight:700;color:var(--suave);margin-bottom:1rem}
.empty{padding:2rem;background:#fff;border:2px dashed var(--linha);border-radius:10px}
@media (max-width:900px){.cat-grid{grid-template-columns:1fr}.filters{position:static}}

/* Equipamento */
.prod{display:grid;grid-template-columns:1fr 1.05fr;gap:clamp(1.5rem,4vw,3rem);padding:1.5rem 0 2rem;align-items:start}
.prod-foto{background:#fff;border-radius:10px;border:1px solid var(--linha);aspect-ratio:1;padding:2rem;position:sticky;top:5.5rem}
.prod-foto img{width:100%;height:100%;object-fit:contain}
.prod-cat{font-size:.9rem;margin-bottom:.4rem}
.prod-info .regua{background:#fff;border-radius:10px;padding:1rem;border:1px solid var(--linha);margin:1rem 0}
.pedido{display:grid;grid-template-columns:1fr 1fr;gap:.75rem;align-items:end;margin-bottom:.75rem}
.pedido label,.cid{display:flex;flex-direction:column;gap:.3rem;font-weight:700;font-size:.875rem}
.pedido .btn{grid-column:1/-1;min-height:56px;font-size:1.15rem}
@media (max-width:760px){.prod{grid-template-columns:1fr}.prod-foto{position:static;max-width:420px;padding:1.25rem}}

/* Orçamento */
.quote{display:flex;flex-direction:column;gap:1.1rem;margin-top:1.5rem}
.quote>label,.quote .cid{display:flex;flex-direction:column;gap:.3rem;font-weight:700;font-size:1rem}
.quote .radio label{display:flex;gap:.6rem;align-items:center;min-height:44px}
.quote .radio input{width:20px;min-height:0}
.err{color:#B3161E;font-weight:600;font-size:.875rem}
.quote .invalid input{border-color:#B3161E}
.quote .btn{min-height:56px;font-size:1.15rem}
.search.inline{flex-direction:row;align-items:end;gap:.5rem;margin-bottom:1.5rem}
.search.inline label{flex:1;display:flex;flex-direction:column}

@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation:none!important;transition:none!important}
  .wa-float{transform:none}
  @view-transition{navigation:none}
}
.reg-fds{font-size:.9rem;margin:0 0 .4rem;padding:.5rem .7rem;border-radius:8px;background:#fff6d6;border:1px solid #f0d77a}

.quote .itens{display:flex;flex-direction:column;gap:1rem}
.quote .item{display:grid;grid-template-columns:1fr 7rem;gap:.6rem;align-items:end;padding:.8rem;border:1px solid var(--linha);border-radius:10px;background:#fff}
.quote .item>label{display:flex;flex-direction:column;gap:.3rem;font-weight:700}
.quote .item-x{grid-column:1/-1;justify-self:end;background:none;border:0;color:#B3161E;font-weight:700;cursor:pointer;padding:.2rem .4rem}
.quote .add-item{align-self:flex-start;background:#fff;border:2px dashed var(--azul);color:var(--azul);font-weight:700;border-radius:10px;padding:.7rem 1rem;cursor:pointer;min-height:44px}