:root{
  --grafito:#16191C;
  --aco:#29414F;
  --papel:#E7E5DF;
  --painel:#F2F0E9;
  --sinal:#E8590C;
  --texto:#16191C;
  --cinza:#5B5F5A;
  --branco:#FBFAF6;
}
*{box-sizing:border-box; margin:0; padding:0;}
html{scroll-behavior:smooth;}
body{background:var(--papel); color:var(--texto); font-family:'IBM Plex Sans', sans-serif; font-size:17px; line-height:1.6; -webkit-font-smoothing:antialiased;}
h1,h2,h3{font-family:'IBM Plex Sans'; font-weight:600; letter-spacing:-0.01em; line-height:1.05; color:var(--texto);}
.mono{font-family:'IBM Plex Mono', monospace;}
a{color:inherit; text-decoration:none;}
img{max-width:100%; display:block;}
button{font-family:inherit; cursor:pointer;}
.wrap{max-width:1200px; margin:0 auto; padding:0 32px;}
@media(max-width:640px){.wrap{padding:0 20px;}}
a:focus-visible, button:focus-visible, select:focus-visible, input:focus-visible{outline:3px solid var(--sinal); outline-offset:2px;}
@media (prefers-reduced-motion: reduce){ *{animation:none !important; transition:none !important;} }

.hazard{height:6px; background:repeating-linear-gradient(-45deg, var(--sinal) 0 14px, var(--grafito) 14px 28px); opacity:0.9;}

.utility{background:var(--grafito); color:#9AA3A8; font-size:13px;}
.utility .wrap{display:flex; justify-content:space-between; padding:9px 32px; flex-wrap:wrap; gap:6px;}
.utility a:hover{color:var(--branco);}
.utility .u-right{display:flex; gap:18px; align-items:center;}
.utility .u-right a.client-link{color:#D6DADC; font-weight:500;}
.utility .u-right a.client-link:hover{color:var(--sinal);}
@media(max-width:640px){.utility{display:none;}}

/* ---------- ÁREA DE CLIENTES ---------- */
.auth-wrap{display:flex; justify-content:center; padding:40px 0;}
.auth-card{background:var(--branco); border:1px solid rgba(22,25,28,0.14); padding:40px; width:100%; max-width:420px;}
.auth-card h2{font-size:23px; margin-bottom:8px;}
.auth-card .auth-sub{font-size:14.5px; color:var(--cinza); margin-bottom:28px;}
.auth-tabs{display:flex; border:1px solid rgba(22,25,28,0.2); margin-bottom:26px;}
.auth-tab{flex:1; background:none; border:none; padding:11px; font-size:14px; color:var(--cinza); border-right:1px solid rgba(22,25,28,0.2);}
.auth-tab:last-child{border-right:none;}
.auth-tab.active{background:var(--grafito); color:var(--branco);}
.auth-msg{font-size:13.5px; margin-top:14px; text-align:center; min-height:16px;}
.auth-msg.err{color:var(--sinal);}
.auth-msg.ok{color:#3E7A4D;}
.auth-config-warning{background:#FDECE0; border:1px solid rgba(232,89,12,0.35); padding:14px 16px; font-size:13px; color:#8A3B0F; margin-bottom:24px;}

.client-header{display:flex; justify-content:space-between; align-items:center; flex-wrap:wrap; gap:14px; margin-bottom:40px;}
.client-header .who{font-size:14.5px; color:var(--cinza);}
.client-header .who b{color:var(--texto);}
.btn-logout{border:1px solid rgba(22,25,28,0.2); background:var(--branco); color:var(--texto); padding:10px 18px; font-size:14px; font-weight:500;}
.btn-logout:hover{border-color:var(--sinal); color:var(--sinal);}

.readings-layout{display:grid; grid-template-columns:0.85fr 1.15fr; gap:32px; align-items:start;}
@media(max-width:900px){.readings-layout{grid-template-columns:1fr;}}
.readings-table{width:100%; border-collapse:collapse; background:var(--branco); border:1px solid rgba(22,25,28,0.14);}
.readings-table th{text-align:left; font-size:12px; color:var(--cinza); font-weight:500; padding:12px 16px; border-bottom:1px solid rgba(22,25,28,0.14); background:var(--painel);}
.readings-table td{padding:13px 16px; font-size:14.5px; border-bottom:1px dashed rgba(22,25,28,0.14);}
.readings-table tr:last-child td{border-bottom:none;}
.readings-empty{padding:30px 16px; text-align:center; color:var(--cinza); font-size:14px; background:var(--branco); border:1px solid rgba(22,25,28,0.14);}

header{position:sticky; top:0; z-index:50; background:rgba(231,229,223,0.94); backdrop-filter:blur(8px); border-bottom:1px solid rgba(22,25,28,0.12);}
.nav{display:flex; align-items:center; justify-content:space-between; height:76px;}
.brand{display:flex; align-items:center; gap:11px;}
.brand-mark{height:40px; width:auto; display:block; flex-shrink:0;}
.brand-name{font-weight:600; font-size:19.5px; letter-spacing:-0.01em;}
.brand-name b{color:var(--sinal); font-weight:600;}
nav.links{display:flex; gap:30px; font-size:15px; font-weight:500;}
nav.links a{padding:6px 0; opacity:0.7; border-bottom:2px solid transparent;}
nav.links a:hover, nav.links a.active{opacity:1; border-color:var(--sinal);}
.nav-cta{background:var(--sinal); color:var(--branco); padding:11px 20px; font-weight:600; font-size:14.5px;}
.nav-cta:hover{background:var(--grafito);}
@media(max-width:900px){ nav.links{display:none;} .nav-cta{padding:9px 16px; font-size:13.5px;} }

.hero{background:var(--grafito); color:var(--branco);}
.hero-inner{padding:76px 0 56px; display:grid; grid-template-columns:1.1fr 0.9fr; gap:48px; align-items:start;}
.hero-tag{display:inline-flex; align-items:center; gap:8px; font-size:13px; color:#9AA3A8; margin-bottom:24px; padding-bottom:8px; border-bottom:1px solid rgba(255,255,255,0.18);}
.hero-tag .mono{color:var(--sinal);}
.hero h1{font-size:clamp(34px,4.6vw,54px); max-width:13ch; color:var(--branco);}
.hero p.lead{margin-top:20px; max-width:42ch; font-size:17.5px; color:#B7BEC1;}
.hero-actions{display:flex; gap:12px; margin-top:30px; flex-wrap:wrap;}
.btn-primary{background:var(--sinal); color:var(--branco); font-weight:600; padding:14px 24px; font-size:15px; border:none; display:inline-block;}
.btn-primary:hover{background:#C94B09;}
.btn-ghost{border:1px solid rgba(255,255,255,0.24); color:var(--branco); padding:14px 24px; font-size:15px; font-weight:500; background:none; display:inline-block;}
.btn-ghost:hover{border-color:rgba(255,255,255,0.55);}

.panel{background:#0F1214; border:1px solid rgba(255,255,255,0.1); position:relative; overflow:hidden;}
.panel::before{content:""; position:absolute; inset:0; background-image:radial-gradient(rgba(255,255,255,0.05) 1px, transparent 1px); background-size:6px 6px; pointer-events:none;}
.panel-head{display:flex; justify-content:space-between; align-items:center; padding:14px 18px; border-bottom:1px solid rgba(255,255,255,0.1); font-size:12.5px; color:#8A9296; position:relative; z-index:1;}
.panel-head .d{width:6px; height:6px; border-radius:50%; background:var(--sinal); display:inline-block; margin-right:7px;}
.panel-rows{padding:6px 18px 18px; position:relative; z-index:1;}
.panel-row{display:flex; justify-content:space-between; align-items:baseline; padding:14px 0; border-bottom:1px dashed rgba(255,255,255,0.12);}
.panel-row:last-child{border-bottom:none;}
.panel-row .lbl{font-size:14px; color:#9AA3A8;}
.panel-row .val{font-size:22px; font-weight:600; color:var(--branco); letter-spacing:0.02em; text-align:right; max-width:60%;}
.panel-row .val .u{font-size:14px; color:var(--sinal); margin-left:3px;}
.panel-row.total{background:rgba(232,89,12,0.08); margin:0 -18px; padding:14px 18px;}
.panel-row.total .val{color:var(--sinal); font-size:26px;}

@media(max-width:900px){ .hero-inner{grid-template-columns:1fr; padding-top:48px;} }

/* internal page banner */
.page-banner{background:var(--grafito); color:var(--branco); padding:60px 0;}
.page-banner .kicker{color:var(--sinal); font-size:13px; margin-bottom:10px;}
.page-banner h1{font-size:clamp(28px,3.8vw,44px); color:var(--branco); max-width:22ch;}
.page-banner p{margin-top:14px; color:#B7BEC1; max-width:56ch; font-size:16px;}

section{padding:96px 0;}
@media(max-width:640px){section{padding:60px 0;}}
.sec-head{max-width:600px; margin-bottom:52px;}
.sec-head .kicker{font-size:13px; color:var(--sinal); margin-bottom:12px;}
.sec-head h2{font-size:clamp(27px,3.4vw,38px);}
.sec-head p{margin-top:14px; font-size:16.5px; color:var(--cinza); max-width:50ch;}

.products{background:var(--branco);}
.ticket-row{display:grid; grid-template-columns:repeat(3,1fr); gap:24px;}
.ticket{background:var(--painel); border:1px solid rgba(22,25,28,0.14); position:relative;}
.ticket-head{display:flex; justify-content:space-between; align-items:center; padding:14px 20px; border-bottom:1px dashed rgba(22,25,28,0.28);}
.ticket-head .no{font-size:12px; color:var(--cinza);}
.ticket-brand-logo{height:13px; width:auto; display:block;}
.ticket-body{padding:20px 20px 8px;}
.ticket-icon-img{height:44px; width:auto; border-radius:4px; margin-bottom:14px; display:block;}
.ticket-body h3{font-size:19px; margin-bottom:4px;}
.ticket-sub{font-size:13px; color:var(--cinza); margin-bottom:14px;}
.ticket-tag{font-size:13px; color:var(--sinal); margin-bottom:14px;}
.ticket-body p{color:var(--cinza); font-size:14px; margin-bottom:16px;}
.ticket-specs{border-top:1px solid rgba(22,25,28,0.12);}
.ticket-specs div{display:flex; justify-content:space-between; padding:10px 0; border-bottom:1px dashed rgba(22,25,28,0.16); font-size:13px;}
.ticket-specs div span:first-child{color:var(--cinza);}
.ticket-specs div span:last-child{font-weight:600;}
.ticket-stub{position:relative; height:22px; margin-top:4px;}
.ticket-stub::before{content:""; position:absolute; left:-11px; top:-11px; width:22px; height:22px; border-radius:50%; background:var(--branco); border:1px solid rgba(22,25,28,0.14); border-left:none;}
.ticket-stub::after{content:""; position:absolute; right:-11px; top:-11px; width:22px; height:22px; border-radius:50%; background:var(--branco); border:1px solid rgba(22,25,28,0.14); border-right:none;}
@media(max-width:900px){.ticket-row{grid-template-columns:1fr;}}

.ticket-row.compact{grid-template-columns:repeat(3,1fr);}
.mini-link{display:inline-block; margin-top:16px; font-size:13.5px; color:var(--sinal); font-weight:600; border-bottom:1px solid var(--sinal); padding-bottom:2px;}

.pedido{background:var(--painel);}
.order-grid{display:grid; grid-template-columns:1.15fr 0.85fr; gap:44px; align-items:start;}
.order-form{background:var(--branco); border:1px solid rgba(22,25,28,0.12); padding:34px;}
.field-group{margin-bottom:24px;}
.field-group label{display:block; font-size:13.5px; color:var(--cinza); margin-bottom:10px; font-weight:500;}
.seg-select{display:flex; border:1px solid rgba(22,25,28,0.2);}
.seg-opt{flex:1; background:none; border:none; padding:12px 8px; font-size:13.5px; color:var(--cinza); border-right:1px solid rgba(22,25,28,0.2);}
.seg-opt:last-child{border-right:none;}
.seg-opt.active{background:var(--grafito); color:var(--branco);}
select, input[type="text"], input[type="number"]{
  width:100%; padding:13px 14px; border:1px solid rgba(22,25,28,0.2); background:var(--branco);
  font-family:'IBM Plex Sans'; font-size:15px; color:var(--texto);
}
.zone-status{display:flex; align-items:center; gap:8px; font-size:13.5px; color:var(--sinal); margin-top:10px;}
.zone-status .d{width:6px; height:6px; border-radius:50%; background:var(--sinal);}
.qty-presets{display:flex; gap:10px; margin-bottom:10px;}
.qty-opt{flex:1; padding:12px 8px; border:1px solid rgba(22,25,28,0.2); background:var(--branco); font-size:14.5px; color:var(--cinza);}
.qty-opt.active{background:var(--grafito); color:var(--branco); border-color:var(--grafito);}
.two-col{display:grid; grid-template-columns:1fr 1fr; gap:16px;}
.order-hint{font-size:13px; color:var(--cinza); margin-top:12px; text-align:center;}
.order-status{font-size:13.5px; color:var(--sinal); margin-top:10px; text-align:center; min-height:16px;}
.price-note{font-size:12px; color:#8A9296; margin-top:16px; text-align:center;}
@media(max-width:900px){.order-grid{grid-template-columns:1fr;} .two-col{grid-template-columns:1fr;}}

.segments{background:var(--papel);}
.grid3{display:grid; grid-template-columns:repeat(3,1fr); gap:1px; background:rgba(22,25,28,0.16); border:1px solid rgba(22,25,28,0.16);}
.seg-card{background:var(--branco); padding:32px 28px;}
.seg-card .tagn{font-size:12px; color:var(--sinal); margin-bottom:16px;}
.seg-card h3{font-size:20px; margin-bottom:9px;}
.seg-card p{color:var(--cinza); font-size:14.5px;}
@media(max-width:900px){.grid3{grid-template-columns:1fr;}}

.coverage{background:var(--grafito); color:var(--branco);}
.coverage .sec-head p{color:#B7BEC1;}
.coverage .sec-head h2{color:var(--branco);}
.map-panel{background:#0F1214; border:1px solid rgba(255,255,255,0.1); padding:20px; position:relative;}
.map-panel svg{width:100%; height:auto; display:block;}
.map-legend{display:flex; gap:26px; margin-top:24px; flex-wrap:wrap; font-size:13.5px; color:#9AA3A8;}
.map-legend span{display:flex; align-items:center; gap:8px;}
.map-legend .dot{width:8px; height:8px; border-radius:50%;}
.cov-note{margin-top:26px; font-size:14px; color:#8A9296;}

.about .wrap{display:grid; grid-template-columns:1.1fr 0.9fr; gap:60px; align-items:center;}
.about-figures{display:flex; gap:38px; margin-top:30px; flex-wrap:wrap;}
.about-figures .f-num{font-size:36px; font-weight:600; color:var(--sinal);}
.about-figures .f-cap{font-size:13px; color:var(--cinza); max-width:15ch; margin-top:4px;}
.partner-strip{display:flex; align-items:center; gap:18px; margin-top:34px; padding-top:26px; border-top:1px solid rgba(22,25,28,0.14);}
.partner-strip .plabel{font-size:12.5px; color:var(--cinza);}
.partner-badge{display:flex; align-items:center; gap:8px; border:1px solid rgba(22,25,28,0.2); padding:8px 14px;}
.partner-badge img{height:20px; width:auto;}
.stamp-wrap{display:flex; justify-content:center;}
.stamp{width:200px; height:200px; border-radius:50%; border:2.5px solid var(--sinal); display:flex; align-items:center; justify-content:center; position:relative; transform:rotate(-8deg);}
.stamp-inner{width:168px; height:168px; border-radius:50%; border:1px dashed rgba(232,89,12,0.55); display:flex; align-items:center; justify-content:center; text-align:center; padding:18px;}
.stamp-inner .t1{font-size:11px; color:var(--sinal); letter-spacing:0.03em; margin-bottom:6px;}
.stamp-inner .t2{font-size:15px; font-weight:600; line-height:1.3;}
.stamp-inner .t3{font-size:10.5px; color:var(--cinza); margin-top:8px;}
@media(max-width:900px){.about .wrap{grid-template-columns:1fr; gap:36px;} .stamp-wrap{order:-1;}}

/* contact block (used on sobre.html) */
.contact-grid{display:grid; grid-template-columns:1fr 1fr; gap:1px; background:rgba(22,25,28,0.16); border:1px solid rgba(22,25,28,0.16); margin-top:20px;}
.contact-card{background:var(--branco); padding:30px 28px;}
.contact-card .k{font-size:12px; color:var(--sinal); margin-bottom:10px;}
.contact-card .v{font-size:17px; font-weight:600;}
.contact-card .v2{font-size:14.5px; color:var(--cinza); margin-top:4px;}
@media(max-width:760px){.contact-grid{grid-template-columns:1fr;}}

.cta{background:var(--sinal); color:var(--branco);}
.cta .wrap{display:flex; justify-content:space-between; align-items:center; gap:36px; flex-wrap:wrap; padding-top:72px; padding-bottom:72px;}
.cta h2{color:var(--branco); font-size:clamp(25px,3.2vw,36px); max-width:16ch;}
.cta .btn-primary{background:var(--grafito);}
.cta .btn-primary:hover{background:#000;}

footer{background:#0F1214; color:#9AA3A8; padding:52px 0 30px;}
.plate{border:1px solid rgba(255,255,255,0.14); padding:34px; position:relative; margin-bottom:36px;}
.plate::before,.plate::after{content:""; position:absolute; width:6px; height:6px; border-radius:50%; background:rgba(255,255,255,0.25); top:14px;}
.plate::before{left:14px;} .plate::after{right:14px;}
.plate-grid{display:grid; grid-template-columns:1.4fr 1fr 1fr 1fr; gap:28px;}
.plate-brand{display:flex; align-items:center; gap:10px;}
.plate-brand img{height:32px; width:auto;}
.plate-grid .brand-name{color:var(--branco); font-size:18px;}
.plate-grid p{margin-top:12px; font-size:13.5px; color:#7C848A; max-width:30ch;}
.plate-col .k{font-size:11px; color:#7C848A; margin-bottom:8px;}
.plate-col .v{font-size:14px; color:#D6DADC;}
.plate-col a.v:hover{color:var(--sinal);}
@media(max-width:760px){.plate-grid{grid-template-columns:1fr 1fr; row-gap:24px;}}
.foot-bottom{display:flex; justify-content:space-between; font-size:12.5px; flex-wrap:wrap; gap:10px; color:#6E767B;}
