/* ===== Linguagem visual inspirada no Grupo XEPA: Anton em caixa-alta nos títulos, DM Sans no texto,
   Fraunces itálico como acento, botões em pílula com texto em caixa-alta e contornos finos. Cores = tema do REBOSS. ===== */
:root{--font:"DM Sans",system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;--brandfont:Anton,Impact,sans-serif;--display:Anton,Impact,"Arial Narrow",sans-serif;--serif:Fraunces,Georgia,serif}
body{font-family:var(--font);font-size:15px;line-height:1.55;letter-spacing:0}

/* Títulos */
.page-title,h1,h2,.hero2 h2,.login-card h2,.rh-head h2{font-family:var(--display);font-weight:400;text-transform:uppercase;letter-spacing:.01em;line-height:1.05}
.page-title{font-size:1.9rem;margin:0}
.hero2 h2{font-size:clamp(2.2rem,5vw,3.4rem);letter-spacing:.005em;line-height:1;margin:.5rem 0 .35rem}
.rh-head h2{font-size:1.9rem}
h3{font-family:var(--font);font-weight:700;letter-spacing:-.005em}
.wordmark{font-family:var(--display);font-weight:400;letter-spacing:.04em}
.stat b{font-family:var(--display);font-weight:400;letter-spacing:.01em}
.hero2 p{font-family:var(--serif);font-style:italic;font-size:1.25rem;opacity:1;color:var(--accent)}
.hero2-date{display:inline-flex;align-items:center;gap:.7rem;font-size:.78rem;letter-spacing:.14em;font-weight:700;color:var(--accent);opacity:1}
.hero2-date::before{content:"";width:34px;height:2px;background:var(--accent)}
.sec-title{font-family:var(--display);font-weight:400;font-size:1.35rem;letter-spacing:.02em;text-transform:uppercase;color:var(--text);margin:2.2rem 0 .9rem}
.mod h3{font-family:var(--display);font-weight:400;text-transform:uppercase;font-size:1.35rem;letter-spacing:.015em}

/* Botões em pílula */
.btn{height:44px;padding:0 1.5rem;border-radius:999px;font-family:var(--font);font-weight:700;font-size:.8rem;letter-spacing:.06em;text-transform:uppercase;box-shadow:none;
  background:transparent;border:1.5px solid color-mix(in srgb,var(--text) 38%,transparent);color:var(--text)}
.btn:hover{background:color-mix(in srgb,var(--text) 7%,transparent);border-color:var(--text);color:var(--text)}
.btn.primary{background:var(--primary);border:1.5px solid var(--primary);color:#fff;box-shadow:none;transform:none}
.btn.primary:hover{background:var(--primary-h);border-color:var(--primary-h);color:#fff;box-shadow:none;transform:none}
a.btn.primary::after{content:"→";margin-left:.1rem;font-weight:700}
.btn.danger{color:var(--err);border-color:color-mix(in srgb,var(--err) 55%,transparent)}.btn.danger:hover{background:color-mix(in srgb,var(--err) 10%,transparent);border-color:var(--err);color:var(--err)}
.btn.sm{height:34px;padding:0 1rem;font-size:.72rem}
.btn.block{height:50px}
.btn:active{transform:translateY(1px)}
.btn:focus-visible{outline:2px solid var(--accent);outline-offset:2px}
/* botão sobre o painel escuro do início: pílula clara cheia */
.hero2-btn{background:var(--bg-base);color:#1c1917;border:1.5px solid var(--bg-base);backdrop-filter:none}
.hero2-btn:hover{background:#fff;color:#1c1917;border-color:#fff}
.hero2-btn kbd{background:rgba(28,25,23,.08);border-color:rgba(28,25,23,.18);color:#1c1917}

/* Abas e filtros em pílula */
.tabs{background:none;padding:0;border-radius:0;gap:.5rem;width:100%;flex-wrap:wrap}
.tabs .tab{border:1.5px solid color-mix(in srgb,var(--text) 22%,transparent);border-radius:999px;padding:.5rem 1.1rem;font-weight:700;font-size:.78rem;letter-spacing:.05em;text-transform:uppercase;color:var(--text);background:transparent}
.tabs .tab:hover{background:color-mix(in srgb,var(--text) 6%,transparent);border-color:var(--text)}
.tabs .tab.active{background:var(--text);border-color:var(--text);color:var(--surface);box-shadow:none}
.tabs.sub{border-bottom:0}
.tabs.sub .tab{border-radius:999px;border-bottom:1.5px solid color-mix(in srgb,var(--text) 22%,transparent);margin-bottom:0}
.tabs.sub .tab.active{background:var(--text)!important;color:var(--surface);border-color:var(--text)}
.unit-pills .pill{border:1.5px solid color-mix(in srgb,var(--text) 22%,transparent);background:transparent;color:var(--text);font-weight:700;font-size:.78rem;letter-spacing:.05em;text-transform:uppercase;padding:.5rem 1.1rem}
.unit-pills .pill:hover{border-color:var(--text);color:var(--text)}
.unit-pills .pill.active{background:var(--text);border-color:var(--text);color:var(--surface);box-shadow:none}
.chip{font-weight:700;letter-spacing:.05em;text-transform:uppercase;font-size:.7rem}

/* Menu lateral */
.nav-item{border-radius:999px;font-weight:600;font-size:.82rem;letter-spacing:.05em;text-transform:uppercase;padding:.65rem 1rem}
.nav-item.active{box-shadow:none}
.nav-cap{font-weight:700;letter-spacing:.14em}
.msb-item,.msb a{border-radius:999px}

/* Cartões: cantos menos "SaaS", sem sombra pesada */
.card{border-radius:18px;box-shadow:none;border:1.5px solid color-mix(in srgb,var(--text) 10%,transparent)}
.card.mod:hover{box-shadow:none;border-color:var(--primary)}
.hero2{border-radius:22px}
.badge,.badge.warn,.badge.ok{font-weight:700;letter-spacing:.04em}
@media(max-width:700px){.page-title{font-size:1.5rem}.btn{height:46px}.btn.sm{height:38px}}
@media(prefers-reduced-motion:reduce){*{transition:none!important}}
/* controles em linha (opções da folha, filtros): não deixar selects e campos espremidos */
.rh-row select,.toolbar select{min-width:13rem}.rh-row input[type=number]{min-width:5rem}
form.rh-row{flex-wrap:wrap;gap:.8rem 1.4rem;align-items:flex-end}
.btn{white-space:nowrap}
/* Logo REBOSS (marca + letras desenhadas) */
.rb-logo{display:inline-block;line-height:0;color:inherit}.rb-logo svg{display:block;height:40px;width:auto}
.rb-logo.xl svg{height:auto;width:min(440px,100%)}
.login-slogan{font-family:var(--serif);font-style:italic;font-size:1.5rem!important;opacity:1!important;color:var(--accent);margin:1.4rem 0 0}
.brand .rb-logo svg{height:46px}

/* REBOSS script logo: .rb-l (claro: fundo claro) / .rb-d (escuro: fundo escuro) */
.rb-logo .rb-d{display:none}
.sidebar .rb-logo .rb-l,.login-art .rb-logo .rb-l{display:none}
.sidebar .rb-logo .rb-d,.login-art .rb-logo .rb-d{display:block}
html[data-sbstyle=light] .sidebar .rb-logo .rb-l{display:block}html[data-sbstyle=light] .sidebar .rb-logo .rb-d{display:none}
html[data-theme=dark][data-sbstyle=light] .sidebar .rb-logo .rb-l{display:none}html[data-theme=dark][data-sbstyle=light] .sidebar .rb-logo .rb-d{display:block}
.rb-logo.xl svg{width:min(380px,100%)}
