/* =====================================================================
   NORTECH Soluções: site institucional
   © 2026 NORTECH Soluções. Todos os direitos reservados.
   Fonte da marca: Montserrat (SIL OFL). Texto: Inter (SIL OFL). Números: JetBrains Mono (SIL OFL).
   ===================================================================== */

@font-face { font-family: 'Montserrat'; src: url('../fontes/montserrat.woff2') format('woff2'); font-weight: 100 900; font-style: normal; font-display: swap; }
@font-face { font-family: 'Inter'; src: url('../fontes/inter.woff2') format('woff2'); font-weight: 100 900; font-style: normal; font-display: swap; }
@font-face { font-family: 'JetBrains Mono'; src: url('../fontes/jetbrains-mono-500.woff2') format('woff2'); font-weight: 500; font-style: normal; font-display: swap; }
@font-face { font-family: 'JetBrains Mono'; src: url('../fontes/jetbrains-mono-700.woff2') format('woff2'); font-weight: 700; font-style: normal; font-display: swap; }

:root {
  /* marca */
  --azul: #14365A;
  --azul-prof: #0B2440;
  --azul-noite: #071A2E;
  --oceano: #215F9C;
  --verde: #1E8A8B;
  --verde-acao: #157A7B;
  --verde-escuro: #0F6667;
  --verde-claro: #5FC6BC;
  --verde-suave: #E4F3F1;
  --dourado: #C9A766;
  --dourado-claro: #E7D39C;
  /* neutros */
  --tinta: #0E1C2B;
  --tinta-2: #3D4B5E;
  --tinta-3: #5F6E83;
  --linha: #E3E8EF;
  --linha-2: #CFD8E3;
  --papel: #FFFFFF;
  --papel-2: #F4F7FA;
  --papel-3: #EAF0F5;
  /* estados */
  --ok: #1F9D6B;
  --ambar: #C9781F;
  --perigo: #C93D3D;
  /* forma */
  --raio: 14px;
  --raio-g: 22px;
  --sombra-1: 0 1px 2px rgba(11, 36, 64, .06), 0 6px 18px rgba(11, 36, 64, .06);
  --sombra-2: 0 18px 50px rgba(11, 36, 64, .16);
  --sombra-3: 0 30px 80px rgba(3, 12, 24, .45);
  --f-marca: 'Montserrat', 'Segoe UI', system-ui, -apple-system, sans-serif;
  --f-texto: 'Inter', 'Segoe UI', system-ui, -apple-system, sans-serif;
  --f-num: 'JetBrains Mono', ui-monospace, 'Cascadia Mono', Consolas, monospace;
  --topo: 72px;
  color-scheme: light;
}

/* ------------------------------------------------------------------ base */
*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; text-size-adjust: 100%; scroll-padding-top: calc(var(--topo) + 12px); }
@media (prefers-reduced-motion: no-preference) { html { scroll-behavior: smooth; } }
body { margin: 0; font: 400 16px/1.6 var(--f-texto); color: var(--tinta); background: var(--papel); -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; overflow-x: hidden; }
img, svg { display: block; max-width: 100%; }
img { height: auto; }
button, input, textarea, select { font: inherit; color: inherit; }
button { cursor: pointer; background: none; border: 0; padding: 0; }
a { color: var(--verde-acao); text-decoration-thickness: 1px; text-underline-offset: 3px; }
h1, h2, h3 { margin: 0; font-family: var(--f-marca); color: var(--azul-prof); }
p { margin: 0; }
ul, ol { margin: 0; padding: 0; list-style: none; }
::selection { background: rgba(95, 198, 188, .35); }
:focus-visible { outline: 3px solid var(--verde-claro); outline-offset: 2px; border-radius: 6px; }
[hidden] { display: none !important; }
.sprite { position: absolute; width: 0; height: 0; overflow: hidden; }
.i { width: 20px; height: 20px; flex: 0 0 auto; }
.sr { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0, 0, 0, 0); white-space: nowrap; border: 0; }
.mut { color: var(--tinta-3); }
.caixa { width: 100%; max-width: 1200px; margin: 0 auto; padding: 0 24px; }
.caixa-est { max-width: 880px; }
.pular { position: absolute; left: 12px; top: -60px; z-index: 200; background: var(--azul-prof); color: #fff; padding: 10px 16px; border-radius: 10px; font-weight: 600; text-decoration: none; }
.pular:focus { top: 12px; }
.sem-js { position: fixed; left: 12px; right: 12px; bottom: 12px; z-index: 300; margin: 0; padding: 12px 16px; border-radius: 12px; background: var(--azul-prof); color: #fff; font-size: 14px; }

/* ------------------------------------------------------------------ botões */
.bt { display: inline-flex; align-items: center; justify-content: center; gap: 10px; min-height: 46px; padding: 12px 20px; border-radius: 12px; font: 600 15px/1.2 var(--f-texto); text-decoration: none; white-space: nowrap; transition: transform .15s ease, box-shadow .2s ease, background-color .2s ease, filter .2s ease; }
.bt .i { width: 18px; height: 18px; }
.bt:hover { transform: translateY(-1px); }
.bt:active { transform: translateY(0); }
.bt-g { min-height: 54px; padding: 14px 24px; font-size: 16px; border-radius: 14px; }
.bt-pri { color: #fff; background: linear-gradient(180deg, #1D9592 0%, #127170 100%); box-shadow: 0 8px 22px rgba(21, 122, 123, .32), inset 0 1px 0 rgba(255, 255, 255, .18); }
.bt-pri:hover { filter: brightness(1.06); box-shadow: 0 12px 28px rgba(21, 122, 123, .38), inset 0 1px 0 rgba(255, 255, 255, .2); }
.bt-vidro { color: #fff; background: rgba(255, 255, 255, .07); border: 1px solid rgba(255, 255, 255, .24); backdrop-filter: blur(6px); }
.bt-vidro:hover { background: rgba(255, 255, 255, .12); }
.bt-cla { color: var(--azul-prof); background: #fff; border: 1px solid var(--linha-2); box-shadow: var(--sombra-1); }
.bt-cla:hover { border-color: var(--verde-acao); color: var(--verde-escuro); }
.bt-ouro { color: var(--azul-noite); background: linear-gradient(180deg, #EEDDAA 0%, #C9A766 100%); box-shadow: 0 10px 26px rgba(201, 167, 102, .3), inset 0 1px 0 rgba(255, 255, 255, .5); }
.bt-ouro:hover { filter: brightness(1.04); }
.bt-ic { width: 46px; padding: 0; }
.lk { color: inherit; text-decoration: underline; text-underline-offset: 3px; font-size: inherit; }

/* ------------------------------------------------------------------ topo */
.topo { position: fixed; inset: 0 0 auto 0; z-index: 60; height: var(--topo); transition: background-color .25s ease, box-shadow .25s ease; }
.topo-in { height: 100%; display: flex; align-items: center; gap: 24px; }
.logo { display: block; position: relative; width: 150px; height: 56px; flex: 0 0 auto; }
.logo img { position: absolute; inset: 0; width: 100%; height: 100%; transition: opacity .25s ease; }
.logo .lg-cor { opacity: 0; }
.nav { margin-left: auto; display: flex; align-items: center; gap: 4px; }
.nav a { color: rgba(255, 255, 255, .86); text-decoration: none; font: 500 15px/1 var(--f-texto); padding: 10px 12px; border-radius: 10px; transition: color .2s, background-color .2s; }
.nav a:hover { color: #fff; background: rgba(255, 255, 255, .08); }
.nav a.atual { color: #fff; box-shadow: inset 0 -2px 0 var(--verde-claro); border-radius: 0; }
.bt-nav { margin-left: 10px; min-height: 42px; padding: 10px 16px; font-size: 14px; }
.menu-bt { display: none; margin-left: auto; width: 46px; height: 46px; border-radius: 12px; color: #fff; align-items: center; justify-content: center; border: 1px solid rgba(255, 255, 255, .22); }
.menu-bt .i { width: 22px; height: 22px; }
.topo.rolou, .pg-int .topo { background: rgba(255, 255, 255, .94); box-shadow: 0 1px 0 var(--linha), 0 8px 30px rgba(11, 36, 64, .06); backdrop-filter: saturate(1.4) blur(12px); }
.topo.rolou .lg-cor, .pg-int .topo .lg-cor { opacity: 1; }
.topo.rolou .lg-neg, .pg-int .topo .lg-neg { opacity: 0; }
.topo.rolou .nav a, .pg-int .topo .nav a { color: var(--tinta-2); }
.topo.rolou .nav a:hover, .pg-int .topo .nav a:hover { color: var(--azul-prof); background: var(--papel-2); }
.topo.rolou .nav a.atual { color: var(--azul-prof); box-shadow: inset 0 -2px 0 var(--verde-acao); }
.topo.rolou .menu-bt, .pg-int .topo .menu-bt { color: var(--azul-prof); border-color: var(--linha-2); }

/* ------------------------------------------------------------------ herói */
.heroi { position: relative; overflow: hidden; color: #fff; padding: calc(var(--topo) + 64px) 0 72px;
  background:
    radial-gradient(1100px 620px at 78% 18%, rgba(33, 95, 156, .42), transparent 62%),
    radial-gradient(900px 520px at 8% 92%, rgba(30, 138, 139, .22), transparent 62%),
    linear-gradient(180deg, #0B2440 0%, #091F37 70%, #081B31 100%); }
.heroi::before { content: ''; position: absolute; inset: 0; pointer-events: none;
  background-image: linear-gradient(rgba(255, 255, 255, .045) 1px, transparent 1px), linear-gradient(90deg, rgba(255, 255, 255, .045) 1px, transparent 1px);
  background-size: 56px 56px; -webkit-mask-image: radial-gradient(ellipse 70% 60% at 60% 35%, #000 25%, transparent 75%); mask-image: radial-gradient(ellipse 70% 60% at 60% 35%, #000 25%, transparent 75%); }
.heroi-simbolo { position: absolute; width: 760px; height: 760px; right: -220px; top: -120px; opacity: .06; pointer-events: none; }
.heroi-grade { position: relative; display: grid; grid-template-columns: minmax(0, 0.92fr) minmax(0, 1.08fr); gap: 56px; align-items: center; }
.selo-topo { display: inline-flex; align-items: center; gap: 10px; padding: 8px 14px; border-radius: 999px; background: rgba(255, 255, 255, .06); border: 1px solid rgba(255, 255, 255, .14); font: 600 12.5px/1 var(--f-marca); letter-spacing: .06em; color: var(--dourado-claro); }
.selo-topo .pt { width: 8px; height: 8px; border-radius: 50%; background: var(--verde-claro); box-shadow: 0 0 0 4px rgba(95, 198, 188, .2); }
.heroi h1 { margin: 22px 0 0; color: #fff; font-weight: 800; font-size: clamp(38px, 5.1vw, 66px); line-height: 1.04; letter-spacing: -.025em; text-wrap: balance; }
.heroi h1 em { font-style: normal; background: linear-gradient(90deg, #7FE0D5, #5FC6BC 45%, #E7D39C); -webkit-background-clip: text; background-clip: text; color: transparent; }
.heroi-sub { margin-top: 22px; max-width: 560px; font-size: 18px; line-height: 1.65; color: rgba(255, 255, 255, .8); }
.heroi-cta { display: flex; flex-wrap: wrap; gap: 14px; margin-top: 32px; }
.heroi-prova { display: flex; flex-wrap: wrap; gap: 10px 22px; margin-top: 30px; font-size: 14px; color: rgba(255, 255, 255, .78); }
.heroi-video { display: inline-flex; align-items: center; gap: 12px; margin-top: 22px; padding: 4px 8px 4px 4px; border: 0; border-radius: 999px; background: none; color: #fff; font: 600 15px/1.25 var(--f-texto); text-align: left; cursor: pointer; }
.heroi-video .hv-play { flex: none; width: 42px; height: 42px; display: grid; place-items: center; border-radius: 50%; color: var(--azul-prof); background: var(--verde-claro); box-shadow: 0 0 0 6px rgba(95, 198, 188, .18); transition: transform .15s ease, box-shadow .2s ease; }
.heroi-video .hv-play .i { width: 16px; height: 16px; margin-left: 2px; }
.heroi-video:hover .hv-play { transform: scale(1.06); box-shadow: 0 0 0 9px rgba(95, 198, 188, .22); }
.heroi-video .hv-txt { display: flex; flex-direction: column; }
.heroi-video small { font-weight: 400; font-size: 13px; color: rgba(255, 255, 255, .7); }
.lb-video video { display: block; width: auto; max-width: 100%; max-height: calc(100vh - 170px); aspect-ratio: 16 / 9; border-radius: 12px; background: #000; box-shadow: 0 30px 80px rgba(0, 0, 0, .5); }
.lb-video.vertical video { aspect-ratio: 9 / 16; max-height: calc(100vh - 150px); }
.heroi-prova li { display: flex; align-items: center; gap: 8px; }
.heroi-prova .i { width: 16px; height: 16px; color: var(--verde-claro); }
.heroi-vis { position: relative; }
.palco { position: relative; aspect-ratio: 16 / 11.2; }
.note { position: absolute; right: 3%; top: 0; width: 89%; }
.note-tela { padding: 10px 10px 0; border-radius: 16px 16px 0 0; background: linear-gradient(180deg, #13263D, #0B1829); border: 1px solid rgba(255, 255, 255, .12); border-bottom: 0; box-shadow: var(--sombra-3); }
.note-vis { position: relative; aspect-ratio: 16 / 10; overflow: hidden; border-radius: 6px 6px 0 0; background: #F4F6F9; }
.note-vis img, .cel-vis img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; object-position: top left; }
.palco .note-vis img, .palco .cel-vis img { opacity: 0; transition: opacity .9s ease; }
.palco .note-vis img.on, .palco .cel-vis img.on { opacity: 1; }
.note-base { position: relative; height: 16px; margin: 0 -3.5%; border-radius: 2px 2px 16px 16px; background: linear-gradient(180deg, #D9DFE7 0%, #A7B1BF 60%, #7E8999 100%); box-shadow: 0 18px 40px rgba(0, 0, 0, .35); }
.note-base::before { content: ''; position: absolute; left: 50%; top: 0; width: 18%; height: 6px; transform: translateX(-50%); border-radius: 0 0 8px 8px; background: #8B95A4; }
.cel { position: relative; display: block; padding: 7px; border-radius: 34px; background: linear-gradient(160deg, #1D2F45, #0A1524); border: 1px solid rgba(255, 255, 255, .16); box-shadow: var(--sombra-3); }
.cel-vis { position: relative; display: block; aspect-ratio: 780 / 1688; overflow: hidden; border-radius: 27px; background: #F4F6F9; }
.cel-vis::before { content: ''; position: absolute; z-index: 2; left: 50%; top: 9px; width: 30%; height: 18px; transform: translateX(-50%); border-radius: 12px; background: #0A1524; }
.cel-palco { position: absolute; left: 0; bottom: -2%; width: 24%; }
.al { position: absolute; z-index: 3; display: grid; grid-template-columns: 38px minmax(0, 1fr); gap: 12px; align-items: center; width: min(320px, 58%); padding: 12px 14px; border-radius: 16px; background: rgba(255, 255, 255, .97); color: var(--tinta); box-shadow: 0 16px 40px rgba(3, 12, 24, .35); transition: opacity .45s ease, transform .45s ease; }
.al b { display: block; font: 700 14px/1.3 var(--f-texto); color: var(--azul-prof); }
.al small { display: block; margin-top: 2px; font-size: 12.5px; line-height: 1.4; color: var(--tinta-3); }
.al-a { right: -3%; top: 9%; }
.al-b { right: 7%; bottom: 7%; }
.al.saindo { opacity: 0; transform: translateY(8px); }
.al-ic { width: 38px; height: 38px; border-radius: 12px; display: grid; place-items: center; }
.al-ic .i { width: 20px; height: 20px; }
.al-ic.ng { background: #FBE7E5; color: var(--perigo); }
.al-ic.am { background: #FBF0DD; color: var(--ambar); }
.al-ic.ok { background: var(--verde-suave); color: var(--verde-acao); }
.al-ic.az { background: #E3EEF9; color: var(--oceano); }
.heroi-prod { display: flex; flex-wrap: wrap; justify-content: center; gap: 8px; margin-top: 34px; }
.chip { padding: 8px 14px; border-radius: 999px; font: 600 13px/1.2 var(--f-texto); color: rgba(255, 255, 255, .78); background: rgba(255, 255, 255, .06); border: 1px solid rgba(255, 255, 255, .14); transition: background-color .2s, color .2s, border-color .2s; }
.chip:hover { color: #fff; border-color: rgba(255, 255, 255, .3); }
.chip[aria-pressed="true"] { color: #fff; background: rgba(95, 198, 188, .18); border-color: rgba(95, 198, 188, .55); }
.heroi-nota { margin-top: 12px; text-align: center; font-size: 12.5px; color: rgba(255, 255, 255, .55); }

.faixa-seg { background: var(--azul-noite); color: rgba(255, 255, 255, .72); border-top: 1px solid rgba(255, 255, 255, .06); }
.faixa-in { display: flex; flex-wrap: wrap; align-items: center; justify-content: center; gap: 8px 14px; padding-top: 18px; padding-bottom: 18px; font-size: 14.5px; text-align: center; }
.faixa-in b { color: #fff; font-weight: 600; }
.faixa-in i { width: 5px; height: 5px; border-radius: 50%; background: var(--dourado); }

/* ------------------------------------------------------------------ seções */
.sec { padding: clamp(76px, 9vw, 124px) 0; }
.sec.cinza { background: var(--papel-2); }
.sec.escura { color: #fff; background: radial-gradient(900px 500px at 85% 0%, rgba(33, 95, 156, .35), transparent 60%), linear-gradient(180deg, #0B2440, #0A2039); }
.sec.escura h2, .sec.escura h3 { color: #fff; }
.cab { max-width: 780px; margin: 0 auto 56px; text-align: center; }
.olho { display: inline-flex; align-items: center; gap: 10px; font: 700 12.5px/1 var(--f-marca); letter-spacing: .14em; text-transform: uppercase; color: var(--verde-acao); }
.olho::before { content: ''; width: 22px; height: 2px; border-radius: 2px; background: var(--dourado); }
.escura .olho { color: var(--verde-claro); }
.olho.ouro { color: var(--dourado-claro); }
.cab h2, .app-txt h2, .sob-txt h2 { margin-top: 16px; font-weight: 800; font-size: clamp(30px, 3.7vw, 46px); line-height: 1.1; letter-spacing: -.02em; text-wrap: balance; }
.cab p:not(.olho) { margin-top: 18px; font-size: 18px; color: var(--tinta-2); text-wrap: pretty; }

/* ------------------------------------------------------------------ onde o dinheiro escapa */
.dores { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 24px; }
.dor { display: flex; flex-direction: column; overflow: hidden; border-radius: var(--raio-g); background: #fff; border: 1px solid var(--linha); box-shadow: var(--sombra-1); transition: transform .25s ease, box-shadow .25s ease; }
.dor:hover { transform: translateY(-3px); box-shadow: var(--sombra-2); }
.dor-img { position: relative; display: block; aspect-ratio: 16 / 9; overflow: hidden; background: var(--papel-3); border-bottom: 1px solid var(--linha); }
.dor-img img { width: 100%; height: 100%; object-fit: cover; object-position: top left; transition: transform .6s ease; }
.dor:hover .dor-img img { transform: scale(1.04); }
.zoom { position: absolute; right: 12px; bottom: 12px; width: 38px; height: 38px; display: grid; place-items: center; border-radius: 12px; color: #fff; background: rgba(11, 36, 64, .78); backdrop-filter: blur(4px); opacity: .92; transition: opacity .2s, transform .2s; }
.zoom .i { width: 18px; height: 18px; }
.dor-img:hover .zoom, .gal-prin:hover .zoom { opacity: 1; transform: scale(1.06); }
.dor-c { display: flex; flex-direction: column; gap: 14px; padding: 22px 24px 26px; flex: 1; }
.dor h3 { display: flex; align-items: center; gap: 12px; font-size: 19px; font-weight: 700; }
.dor-ic { width: 40px; height: 40px; flex: 0 0 auto; display: grid; place-items: center; border-radius: 12px; color: #fff; background: linear-gradient(145deg, var(--oceano), var(--azul)); }
.dor-ic .i { width: 20px; height: 20px; }
.dor p { font-size: 15px; line-height: 1.6; color: var(--tinta-2); }
.dor p b { display: block; margin-bottom: 4px; font: 700 11.5px/1.2 var(--f-marca); letter-spacing: .1em; text-transform: uppercase; }
.dor .hoje b { color: var(--perigo); }
.dor .com b { color: var(--verde-acao); }
.dor-outra { background: linear-gradient(160deg, #fff 0%, #F3F8F8 100%); border-style: dashed; border-color: var(--linha-2); }
.dor-outra .dor-c { justify-content: center; }
.dor-outra .dor-ic { background: linear-gradient(145deg, var(--dourado), #A9853F); }
.dor-outra .bt { align-self: flex-start; margin-top: 6px; }

/* ------------------------------------------------------------------ serviços */
.servicos { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 22px; }
.serv { position: relative; padding: 30px 28px; border-radius: var(--raio-g); background: #fff; border: 1px solid var(--linha); box-shadow: var(--sombra-1); transition: transform .25s ease, box-shadow .25s ease, border-color .25s; }
.serv:hover { transform: translateY(-3px); box-shadow: var(--sombra-2); border-color: rgba(21, 122, 123, .35); }
.serv::after { content: ''; position: absolute; left: 28px; right: 28px; top: 0; height: 3px; border-radius: 0 0 3px 3px; background: linear-gradient(90deg, var(--verde), var(--dourado)); opacity: 0; transition: opacity .25s; }
.serv:hover::after { opacity: 1; }
.serv-ic { width: 52px; height: 52px; display: grid; place-items: center; border-radius: 16px; color: var(--verde-acao); background: var(--verde-suave); border: 1px solid #C9E8E4; }
.serv-ic .i { width: 24px; height: 24px; }
.serv h3 { margin-top: 20px; font-size: 19px; font-weight: 700; line-height: 1.3; }
.serv p { margin-top: 10px; font-size: 15px; color: var(--tinta-2); }

/* ------------------------------------------------------------------ sistemas */
.pr-abas { display: flex; justify-content: center; flex-wrap: wrap; gap: 10px; margin-bottom: 44px; }
.pr-aba { display: inline-flex; align-items: center; gap: 9px; padding: 12px 18px; border-radius: 999px; font: 600 15px/1.2 var(--f-texto); color: var(--tinta-2); background: #fff; border: 1px solid var(--linha-2); transition: color .2s, background-color .2s, border-color .2s, box-shadow .2s; }
.pr-aba .i { width: 18px; height: 18px; color: var(--verde-acao); }
.pr-aba:hover { border-color: var(--verde-acao); color: var(--azul-prof); }
.pr-aba[aria-selected="true"] { color: #fff; background: var(--azul-prof); border-color: var(--azul-prof); box-shadow: 0 10px 24px rgba(11, 36, 64, .22); }
.pr-aba[aria-selected="true"] .i { color: var(--verde-claro); }
.pr-painel { display: grid; grid-template-columns: minmax(0, .82fr) minmax(0, 1.18fr); gap: 52px; align-items: start; }
.pr-painel:focus-visible { outline-offset: 8px; }
.pr-nome { font-size: clamp(26px, 2.6vw, 34px); font-weight: 800; letter-spacing: -.015em; line-height: 1.12; }
.pr-nome span { display: block; color: var(--verde-acao); }
.pr-para { margin-top: 14px; font-size: 17px; color: var(--tinta-2); }
.pr-lista { display: grid; gap: 16px; margin: 26px 0 30px; }
.pr-lista li { display: grid; grid-template-columns: 36px minmax(0, 1fr); gap: 14px; align-items: start; font-size: 15.5px; color: var(--tinta-2); }
.pr-lista .i { width: 36px; height: 36px; padding: 8px; border-radius: 11px; color: var(--verde-acao); background: var(--verde-suave); }
.pr-lista b { color: var(--azul-prof); }
.gal { min-width: 0; }
.gal-prin { position: relative; display: block; width: 100%; aspect-ratio: 16 / 10; overflow: hidden; border-radius: 18px; background: var(--papel-3); border: 1px solid var(--linha); box-shadow: var(--sombra-2); }
.gal-prin img { width: 100%; height: 100%; object-fit: cover; object-position: top left; }
.gal-leg { min-height: 48px; margin-top: 14px; font-size: 14.5px; color: var(--tinta-2); }
.gal-mini { display: flex; gap: 10px; margin-top: 10px; overflow-x: auto; padding: 4px 2px 10px; scroll-snap-type: x proximity; scrollbar-width: thin; }
.gal-mini button { flex: 0 0 auto; width: 112px; aspect-ratio: 16 / 10; overflow: hidden; border-radius: 10px; border: 2px solid transparent; background: var(--papel-3); box-shadow: 0 0 0 1px var(--linha); scroll-snap-align: start; opacity: .78; transition: opacity .2s, border-color .2s, transform .2s; }
.gal-mini button:hover { opacity: 1; transform: translateY(-1px); }
.gal-mini button[aria-current="true"] { opacity: 1; border-color: var(--verde-acao); }
.gal-mini img { width: 100%; height: 100%; object-fit: cover; object-position: top left; }
.comuns { margin-top: 72px; padding: 34px 36px; border-radius: var(--raio-g); background: linear-gradient(160deg, #0B2440, #12345A); color: #fff; box-shadow: var(--sombra-2); }
.comuns h3 { color: #fff; font-size: 20px; font-weight: 700; }
.comuns ul { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 14px 22px; margin-top: 22px; }
.comuns li > button, .comuns .li-s { display: flex; align-items: flex-start; gap: 12px; width: 100%; text-align: left; font-size: 14.5px; line-height: 1.45; color: rgba(255, 255, 255, .78); border-radius: 12px; }
.comuns li > button { padding: 0; }
.comuns li > button:hover b { text-decoration: underline; text-underline-offset: 3px; }
.comuns .i { width: 34px; height: 34px; padding: 7px; border-radius: 10px; color: var(--verde-claro); background: rgba(95, 198, 188, .12); border: 1px solid rgba(95, 198, 188, .25); }
.comuns b { color: #fff; font-weight: 600; }

/* ------------------------------------------------------------------ celular */
.app { overflow: hidden; }
.app-grade { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 56px; align-items: center; }
.app-sub { margin-top: 18px; font-size: 18px; color: rgba(255, 255, 255, .8); }
.app-lista { display: grid; gap: 16px; margin: 28px 0 32px; }
.app-lista li { display: grid; grid-template-columns: 36px minmax(0, 1fr); gap: 14px; font-size: 15.5px; color: rgba(255, 255, 255, .78); }
.app-lista .i { width: 36px; height: 36px; padding: 8px; border-radius: 11px; color: var(--verde-claro); background: rgba(95, 198, 188, .12); border: 1px solid rgba(95, 198, 188, .25); }
.app-lista b { color: #fff; font-weight: 600; }
.app-vis { position: relative; display: flex; justify-content: center; align-items: center; min-height: 600px; }
.app-vis::before { content: ''; position: absolute; width: 70%; aspect-ratio: 1; border-radius: 50%; background: radial-gradient(circle, rgba(95, 198, 188, .28), transparent 65%); filter: blur(10px); }
.cel-centro { position: relative; z-index: 2; width: 250px; }
.cel-lado { position: absolute; z-index: 1; width: 210px; opacity: .92; }
.cel-e { left: 2%; transform: rotate(-7deg) translateY(30px); }
.cel-d { right: 2%; transform: rotate(7deg) translateY(30px); }
.cel-lado:hover, .cel-centro:hover { opacity: 1; }
.app-selos { position: absolute; z-index: 3; bottom: -6px; left: 50%; transform: translateX(-50%); display: flex; gap: 8px; }
.app-selos span { padding: 7px 14px; border-radius: 999px; font: 600 12.5px/1 var(--f-texto); color: #fff; background: rgba(11, 36, 64, .9); border: 1px solid rgba(255, 255, 255, .18); }

/* ------------------------------------------------------------------ laboratório */
.lab-abas { display: flex; justify-content: center; flex-wrap: wrap; gap: 8px; margin-bottom: 28px; }
.lab-aba { display: inline-flex; align-items: center; gap: 8px; padding: 11px 16px; border-radius: 12px; font: 600 14.5px/1.2 var(--f-texto); color: var(--tinta-2); background: #fff; border: 1px solid var(--linha-2); transition: color .2s, background-color .2s, border-color .2s; }
.lab-aba .i { width: 18px; height: 18px; color: var(--verde-acao); }
.lab-aba:hover { border-color: var(--verde-acao); }
.lab-aba[aria-selected="true"] { color: #fff; background: var(--verde-acao); border-color: var(--verde-acao); }
.lab-aba[aria-selected="true"] .i { color: #fff; }
.lab-painel { border-radius: 26px; background: #fff; border: 1px solid var(--linha); box-shadow: var(--sombra-2); padding: clamp(22px, 3.4vw, 40px); }
.lab-calc { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 40px; }
.lc-form h3, .lt-cab h3 { font-size: 23px; font-weight: 800; line-height: 1.2; letter-spacing: -.01em; }
.lc-form > .mut, .lt-cab .mut { margin-top: 8px; font-size: 15px; }
.campos { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px 18px; margin-top: 26px; }
.campo { display: grid; gap: 7px; font-size: 13.5px; font-weight: 600; color: var(--tinta-2); }
.campo.largo { grid-column: 1 / -1; }
.cx { display: flex; align-items: center; height: 50px; border-radius: 12px; background: var(--papel-2); border: 1px solid var(--linha-2); transition: border-color .2s, box-shadow .2s, background-color .2s; }
.cx:focus-within { border-color: var(--verde-acao); background: #fff; box-shadow: 0 0 0 4px rgba(21, 122, 123, .14); }
.cx input { flex: 1; min-width: 0; height: 100%; padding: 0 14px; border: 0; background: transparent; outline: none; font: 600 16px/1 var(--f-num); color: var(--azul-prof); }
.cx i { padding: 0 14px 0 0; font-style: normal; font-size: 13px; font-weight: 600; color: var(--tinta-3); white-space: nowrap; }
.cx i.pre { padding: 0 0 0 14px; }
.cx.erro { border-color: var(--perigo); box-shadow: 0 0 0 4px rgba(201, 61, 61, .12); }
.lc-res { display: flex; flex-direction: column; gap: 18px; }
.res-dest { padding: 24px 26px; border-radius: 20px; color: #fff; background: radial-gradient(400px 200px at 90% 0%, rgba(95, 198, 188, .35), transparent 70%), linear-gradient(150deg, #0B2440, #14365A); box-shadow: 0 16px 40px rgba(11, 36, 64, .25); }
.res-dest small { display: block; font-size: 13.5px; color: rgba(255, 255, 255, .72); }
.res-dest output { display: block; margin-top: 6px; font: 700 clamp(30px, 3.4vw, 42px)/1.1 var(--f-num); letter-spacing: -.02em; color: #fff; }
.res-dest span { display: block; margin-top: 8px; font-size: 14px; color: var(--dourado-claro); }
.res-grade { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }
.res-grade div { padding: 14px 16px; border-radius: 14px; background: var(--papel-2); border: 1px solid var(--linha); }
.res-grade small { display: block; font-size: 12.5px; line-height: 1.35; color: var(--tinta-3); }
.res-grade output { display: block; margin-top: 6px; font: 700 18px/1.2 var(--f-num); color: var(--azul-prof); }
.res-msg { padding: 14px 16px; border-radius: 14px; font-size: 15px; line-height: 1.55; color: var(--tinta); background: #FBF5E6; border: 1px solid #EEDCAE; }
.res-msg:empty { display: none; }
.lc-nota { font-size: 12.5px; line-height: 1.55; color: var(--tinta-3); }
.lc-res .bt { align-self: flex-start; }
.lt-cab { display: flex; flex-wrap: wrap; align-items: flex-end; justify-content: space-between; gap: 16px; }
.seg { display: inline-flex; padding: 4px; border-radius: 12px; background: var(--papel-2); border: 1px solid var(--linha); }
.seg button { display: inline-flex; align-items: center; gap: 7px; padding: 9px 14px; border-radius: 9px; font: 600 14px/1 var(--f-texto); color: var(--tinta-2); }
.seg button .i { width: 16px; height: 16px; }
.seg button[aria-pressed="true"] { color: #fff; background: var(--azul-prof); box-shadow: 0 6px 14px rgba(11, 36, 64, .2); }
.lt-quadro { margin: 22px auto 0; max-width: 660px; border-radius: 18px; overflow: hidden; border: 1px solid var(--linha); background: #FAFBFC; }
.lt-quadro img { width: 100%; height: auto; background: #fff; }
.lt-ctrl { display: flex; align-items: center; gap: 16px; max-width: 660px; margin: 20px auto 0; }
.lt-ctrl input[type="range"] { flex: 1; }
.lt-info { display: flex; flex-wrap: wrap; justify-content: center; gap: 8px; max-width: 660px; margin: 16px auto 0; }
.lt-info span { padding: 7px 12px; border-radius: 999px; font: 600 13.5px/1.2 var(--f-texto); background: var(--papel-2); border: 1px solid var(--linha); color: var(--tinta-2); }
.lt-info span b { font-family: var(--f-num); color: var(--azul-prof); }
.lt-info .dn { color: var(--perigo); background: #FDF0EF; border-color: #F3C9C5; }
.lt-info .up { color: var(--ok); background: #EAF7F1; border-color: #BFE6D4; }
.lt-nota { margin-top: 14px; text-align: center; font-size: 12.5px; color: var(--tinta-3); }
input[type="range"] { -webkit-appearance: none; appearance: none; height: 30px; background: transparent; cursor: pointer; }
input[type="range"]::-webkit-slider-runnable-track { height: 8px; border-radius: 8px; background: linear-gradient(90deg, var(--verde-acao) var(--p, 100%), var(--linha-2) var(--p, 100%)); }
input[type="range"]::-moz-range-track { height: 8px; border-radius: 8px; background: var(--linha-2); }
input[type="range"]::-moz-range-progress { height: 8px; border-radius: 8px; background: var(--verde-acao); }
input[type="range"]::-webkit-slider-thumb { -webkit-appearance: none; width: 24px; height: 24px; margin-top: -8px; border-radius: 50%; background: #fff; border: 3px solid var(--verde-acao); box-shadow: 0 4px 10px rgba(11, 36, 64, .2); }
input[type="range"]::-moz-range-thumb { width: 18px; height: 18px; border-radius: 50%; background: #fff; border: 3px solid var(--verde-acao); box-shadow: 0 4px 10px rgba(11, 36, 64, .2); }

/* ------------------------------------------------------------------ sob medida */
.sob { background: radial-gradient(900px 500px at 10% 0%, rgba(201, 167, 102, .16), transparent 60%), radial-gradient(800px 500px at 95% 100%, rgba(30, 138, 139, .22), transparent 60%), linear-gradient(180deg, #0A2039, #0B2440); }
.sob-grade { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, .95fr); gap: 56px; align-items: start; }
.sob-sub { margin-top: 18px; font-size: 18px; color: rgba(255, 255, 255, .8); }
.passos { counter-reset: p; display: grid; gap: 14px; margin-top: 32px; }
.passos li { counter-increment: p; position: relative; display: grid; gap: 2px; padding-left: 56px; }
.passos li::before { content: counter(p); position: absolute; left: 0; top: 0; width: 38px; height: 38px; display: grid; place-items: center; border-radius: 50%; font: 800 15px/1 var(--f-marca); color: var(--dourado-claro); border: 1.5px solid rgba(231, 211, 156, .55); background: rgba(201, 167, 102, .1); }
.passos b { font: 700 16.5px/1.3 var(--f-marca); color: #fff; padding-top: 2px; }
.passos span { font-size: 15px; color: rgba(255, 255, 255, .72); }
.ex-tit { margin-top: 32px; font: 700 12.5px/1 var(--f-marca); letter-spacing: .12em; text-transform: uppercase; color: rgba(255, 255, 255, .6); }
.exemplos { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 14px; }
.exemplos li { padding: 8px 13px; border-radius: 999px; font-size: 13.5px; color: rgba(255, 255, 255, .86); background: rgba(255, 255, 255, .06); border: 1px solid rgba(255, 255, 255, .14); }
.pedido { padding: 30px; border-radius: 24px; background: #fff; color: var(--tinta); box-shadow: 0 30px 70px rgba(2, 10, 20, .4); border-top: 4px solid var(--dourado); }
.sec.escura .pedido h3, .pedido h3 { font-size: 21px; font-weight: 800; color: var(--azul-prof); }
.pedido fieldset { margin: 20px 0 0; padding: 0; border: 0; min-width: 0; }
.pedido legend { padding: 0; margin-bottom: 10px; font-size: 14px; font-weight: 700; color: var(--tinta-2); }
.op { display: flex; flex-wrap: wrap; gap: 8px; }
.op label { position: relative; }
.op input { position: absolute; opacity: 0; width: 1px; height: 1px; }
.op span { display: inline-block; padding: 9px 13px; border-radius: 10px; font-size: 14px; font-weight: 500; color: var(--tinta-2); background: var(--papel-2); border: 1px solid var(--linha-2); cursor: pointer; transition: background-color .15s, color .15s, border-color .15s; }
.op span:hover { border-color: var(--verde-acao); }
.op input:checked + span { color: #fff; background: var(--verde-acao); border-color: var(--verde-acao); }
.op input:focus-visible + span { outline: 3px solid var(--verde-claro); outline-offset: 2px; }
.campo-txt { display: grid; gap: 8px; margin-top: 20px; font-size: 14px; font-weight: 700; color: var(--tinta-2); }
.campo-txt small { font-weight: 500; color: var(--tinta-3); }
.campo-txt textarea { width: 100%; resize: vertical; min-height: 92px; padding: 12px 14px; border-radius: 12px; border: 1px solid var(--linha-2); background: var(--papel-2); font: 400 15px/1.5 var(--f-texto); color: var(--tinta); outline: none; }
.campo-txt textarea:focus { border-color: var(--verde-acao); background: #fff; box-shadow: 0 0 0 4px rgba(21, 122, 123, .14); }
.campo-txt .cont { justify-self: end; font-weight: 500; }
.pedido-bts { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 22px; }
.pedido-nota { margin-top: 14px; font-size: 12.5px; color: var(--tinta-3); }
.pedido .falta { margin-top: 12px; font-size: 14px; font-weight: 600; color: var(--perigo); }

/* ------------------------------------------------------------------ como começa */
.trilha { position: relative; display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 24px; }
.trilha::before { content: ''; position: absolute; left: 12%; right: 12%; top: 27px; height: 2px; background: repeating-linear-gradient(90deg, var(--linha-2) 0 8px, transparent 8px 16px); }
.trilha li { position: relative; text-align: center; padding: 0 8px; }
.tn { position: relative; z-index: 1; width: 56px; height: 56px; margin: 0 auto; display: grid; place-items: center; border-radius: 50%; font: 800 20px/1 var(--f-marca); color: var(--azul-prof); background: #fff; border: 2px solid var(--dourado); box-shadow: 0 0 0 8px var(--papel); }
.trilha h3 { margin-top: 20px; font-size: 18px; font-weight: 700; }
.trilha p { margin-top: 8px; font-size: 15px; color: var(--tinta-2); }

/* ------------------------------------------------------------------ segurança e sobre */
.seg-grade { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 20px; }
.seg-grade article { padding: 26px; border-radius: 20px; background: #fff; border: 1px solid var(--linha); }
.seg-ic { width: 46px; height: 46px; display: grid; place-items: center; border-radius: 14px; color: var(--azul-prof); background: #E6EEF7; }
.seg-ic .i { width: 22px; height: 22px; }
.seg-grade h3 { margin-top: 16px; font-size: 18px; font-weight: 700; }
.seg-grade p { margin-top: 8px; font-size: 15px; color: var(--tinta-2); }
.sobre { display: grid; grid-template-columns: 240px minmax(0, 1fr); gap: 44px; align-items: center; margin-top: 56px; padding: 36px 40px; border-radius: var(--raio-g); background: #fff; border: 1px solid var(--linha); box-shadow: var(--sombra-1); }
.sobre img { width: 220px; height: auto; margin: 0 auto; }
.sobre h3 { margin-top: 12px; font-size: 28px; font-weight: 800; letter-spacing: -.01em; }
.sobre p:not(.olho) { margin-top: 12px; font-size: 16px; color: var(--tinta-2); }
.sobre p.mut { font-size: 14px; color: var(--tinta-3); }

/* ------------------------------------------------------------------ dúvidas */
.faq { display: grid; gap: 12px; }
.faq details { border-radius: 16px; background: #fff; border: 1px solid var(--linha); box-shadow: var(--sombra-1); transition: border-color .2s; }
.faq details[open] { border-color: rgba(21, 122, 123, .4); }
.faq summary { position: relative; list-style: none; cursor: pointer; padding: 20px 56px 20px 24px; font: 700 17px/1.35 var(--f-marca); color: var(--azul-prof); }
.faq summary::-webkit-details-marker { display: none; }
.faq summary::after { content: ''; position: absolute; right: 22px; top: 50%; width: 12px; height: 12px; margin-top: -8px; border-right: 2.5px solid var(--verde-acao); border-bottom: 2.5px solid var(--verde-acao); transform: rotate(45deg); transition: transform .25s ease, margin-top .25s ease; }
.faq details[open] summary::after { transform: rotate(-135deg); margin-top: -2px; }
.faq details p { padding: 0 24px 22px; font-size: 16px; color: var(--tinta-2); }

/* ------------------------------------------------------------------ final */
.final { text-align: center; background: radial-gradient(700px 400px at 50% 0%, rgba(95, 198, 188, .2), transparent 65%), linear-gradient(180deg, #0B2440, #081B31); }
.final-in { max-width: 860px; }
.final-simbolo { width: 84px; height: 84px; margin: 0 auto 22px; }
.final h2 { font-size: clamp(30px, 4vw, 50px); font-weight: 800; line-height: 1.08; letter-spacing: -.02em; text-wrap: balance; }
.final p { margin-top: 18px; font-size: 18px; color: rgba(255, 255, 255, .78); }
.final-cta { display: flex; flex-wrap: wrap; justify-content: center; gap: 14px; margin-top: 34px; }
.final-canais { display: flex; flex-wrap: wrap; justify-content: center; gap: 10px 26px; margin-top: 32px; font-size: 15px; color: rgba(255, 255, 255, .8); }
.final-canais li { display: flex; align-items: center; gap: 8px; }
.final-canais .i { width: 18px; height: 18px; color: var(--verde-claro); }
.final-canais a { color: #fff; text-decoration: none; }
.final-canais a:hover { text-decoration: underline; }

/* ------------------------------------------------------------------ rodapé */
.rodape { color: rgba(255, 255, 255, .72); background: var(--azul-noite); padding: 64px 0 28px; font-size: 14.5px; }
.rod-grade { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 2fr); gap: 48px; }
.rod-marca img { width: 200px; height: auto; }
.rod-marca p { margin-top: 14px; color: rgba(255, 255, 255, .78); }
.rod-marca p.mut { margin-top: 6px; color: rgba(255, 255, 255, .55); }
.rod-links { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 28px; }
.rod-links div { display: flex; flex-direction: column; gap: 10px; }
.rod-links b { font: 700 12.5px/1 var(--f-marca); letter-spacing: .12em; text-transform: uppercase; color: var(--dourado-claro); margin-bottom: 4px; }
.rod-links a, .rod-links .lk { color: rgba(255, 255, 255, .74); text-decoration: none; text-align: left; }
.rod-links a:hover, .rod-links .lk:hover { color: #fff; text-decoration: underline; }
.rod-base { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 10px 24px; margin-top: 48px; padding-top: 24px; border-top: 1px solid rgba(255, 255, 255, .1); font-size: 13px; }
.rod-base .mut { color: rgba(255, 255, 255, .5); max-width: 560px; }

/* ------------------------------------------------------------------ atendimento */
.atd-bt { position: fixed; z-index: 70; right: 20px; bottom: 20px; display: inline-flex; align-items: center; gap: 10px; height: 56px; padding: 0 20px 0 18px; border-radius: 999px; color: #fff; font: 600 15px/1 var(--f-texto); background: linear-gradient(180deg, #1D9592, #127170); box-shadow: 0 14px 34px rgba(11, 36, 64, .35); transition: transform .2s, filter .2s; }
.atd-bt:hover { transform: translateY(-2px); filter: brightness(1.05); }
.atd-bt .i { width: 22px; height: 22px; }
.atd-convite { position: fixed; z-index: 70; right: 20px; bottom: 88px; display: flex; align-items: flex-start; gap: 4px; max-width: 280px; padding: 12px 8px 12px 16px; border-radius: 16px 16px 4px 16px; background: #fff; box-shadow: var(--sombra-2); border: 1px solid var(--linha); animation: subir .45s ease both; }
.atd-cv-txt { text-align: left; font-size: 14.5px; line-height: 1.45; color: var(--tinta); }
.atd-cv-x { width: 28px; height: 28px; flex: 0 0 auto; display: grid; place-items: center; border-radius: 8px; color: var(--tinta-3); }
.atd-cv-x:hover { background: var(--papel-2); }
.atd-cv-x .i { width: 16px; height: 16px; }
.atd-jan { position: fixed; z-index: 80; right: 20px; bottom: 88px; width: 380px; max-height: min(620px, calc(100vh - 120px)); display: flex; flex-direction: column; overflow: hidden; border-radius: 22px; background: #fff; box-shadow: 0 30px 80px rgba(3, 12, 24, .35); border: 1px solid var(--linha); animation: subir .3s ease both; }
.atd-jan[hidden] { display: none; }
.atd-cab { display: grid; grid-template-columns: 36px minmax(0, 1fr) 36px; gap: 12px; align-items: center; padding: 16px 16px 14px; color: #fff; background: linear-gradient(150deg, #0B2440, #14365A); }
.atd-cab b { display: block; font: 700 16px/1.2 var(--f-marca); }
.atd-cab small { display: block; margin-top: 3px; font-size: 12px; line-height: 1.4; color: rgba(255, 255, 255, .7); }
.atd-x { width: 36px; height: 36px; display: grid; place-items: center; border-radius: 10px; color: #fff; }
.atd-x:hover { background: rgba(255, 255, 255, .12); }
.atd-msgs { flex: 1; overflow-y: auto; padding: 16px; display: flex; flex-direction: column; gap: 10px; background: var(--papel-2); min-height: 160px; }
.msg { max-width: 86%; padding: 10px 13px; border-radius: 14px 14px 14px 4px; font-size: 14.5px; line-height: 1.5; background: #fff; border: 1px solid var(--linha); color: var(--tinta); white-space: pre-line; animation: subir .25s ease both; }
.msg.eu { align-self: flex-end; border-radius: 14px 14px 4px 14px; color: #fff; background: var(--verde-acao); border-color: var(--verde-acao); }
.msg a { color: var(--verde-acao); font-weight: 600; }
.atd-ops { display: flex; flex-wrap: wrap; gap: 6px; padding: 10px 12px; border-top: 1px solid var(--linha); background: #fff; }
.atd-ops:empty { display: none; }
.atd-ops button { padding: 8px 12px; border-radius: 999px; font-size: 13.5px; font-weight: 600; color: var(--verde-escuro); background: var(--verde-suave); border: 1px solid #C2E5E0; }
.atd-ops button:hover { background: #D5EEEA; }
.atd-ops button.zap { color: #fff; background: var(--verde-acao); border-color: var(--verde-acao); }
.atd-form { display: flex; gap: 8px; padding: 10px 12px 12px; border-top: 1px solid var(--linha); background: #fff; }
.atd-form input { flex: 1; min-width: 0; height: 44px; padding: 0 14px; border-radius: 12px; border: 1px solid var(--linha-2); background: var(--papel-2); outline: none; font-size: 15px; }
.atd-form input:focus { border-color: var(--verde-acao); background: #fff; }
.atd-form button { width: 44px; height: 44px; display: grid; place-items: center; border-radius: 12px; color: #fff; background: var(--verde-acao); }

/* ------------------------------------------------------------------ imagem ampliada */
.lb { position: fixed; inset: 0; z-index: 100; display: grid; place-items: center; padding: 56px 72px 72px; background: rgba(4, 13, 24, .94); backdrop-filter: blur(6px); animation: aparecer .2s ease both; }
.lb[hidden] { display: none; }
.lb-fig { margin: 0; max-width: 1400px; width: 100%; display: flex; flex-direction: column; align-items: center; gap: 14px; }
.lb-fig img { max-width: 100%; max-height: calc(100vh - 170px); width: auto; border-radius: 12px; box-shadow: 0 30px 80px rgba(0, 0, 0, .5); background: #fff; }
.lb-fig figcaption { max-width: 860px; text-align: center; font-size: 15px; line-height: 1.5; color: rgba(255, 255, 255, .86); }
.lb-bt { position: absolute; width: 48px; height: 48px; display: grid; place-items: center; border-radius: 14px; color: #fff; background: rgba(255, 255, 255, .1); border: 1px solid rgba(255, 255, 255, .18); }
.lb-bt:hover { background: rgba(255, 255, 255, .18); }
.lb-bt .i { width: 22px; height: 22px; }
.lb-x { top: 16px; right: 16px; }
.lb-ant { left: 14px; top: 50%; transform: translateY(-50%); }
.lb-prox { right: 14px; top: 50%; transform: translateY(-50%); }
.lb-bt[hidden] { display: none; }
.lb-cont { position: absolute; top: 26px; left: 50%; transform: translateX(-50%); font: 600 13px/1 var(--f-texto); color: rgba(255, 255, 255, .6); }

/* ------------------------------------------------------------------ avisos */
.aviso-modal { position: fixed; inset: 0; z-index: 110; display: grid; place-items: center; padding: 20px; background: rgba(4, 13, 24, .6); }
.aviso-modal[hidden] { display: none; }
.am-caixa { max-width: 420px; padding: 28px; border-radius: 20px; background: #fff; box-shadow: var(--sombra-2); }
.am-caixa h3 { font-size: 20px; font-weight: 800; }
.am-caixa p { margin: 10px 0 20px; color: var(--tinta-2); }
.ck { position: fixed; z-index: 90; left: 20px; bottom: 20px; max-width: 460px; padding: 18px 20px; border-radius: 18px; background: #fff; border: 1px solid var(--linha); box-shadow: var(--sombra-2); font-size: 14px; color: var(--tinta-2); }
.ck[hidden] { display: none; }
.ck-bts { display: flex; gap: 10px; margin-top: 14px; }
.ck-bts .bt { flex: 1; min-height: 42px; }
.aviso-dev { position: fixed; z-index: 95; left: 12px; bottom: 12px; max-width: 420px; padding: 12px 14px; border-radius: 12px; font-size: 13px; line-height: 1.45; color: #5B3B00; background: #FFF4D6; border: 1px solid #F0D58A; box-shadow: var(--sombra-1); }

/* ------------------------------------------------------------------ animações */
@keyframes subir { from { opacity: 0; transform: translateY(10px); } to { opacity: 1; transform: none; } }
@keyframes aparecer { from { opacity: 0; } to { opacity: 1; } }
.js .rv { opacity: 0; transform: translateY(22px); transition: opacity .75s ease, transform .75s cubic-bezier(.2, .7, .2, 1); }
.js .rv.vis { opacity: 1; transform: none; }
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { animation-duration: .01ms !important; animation-iteration-count: 1 !important; transition-duration: .01ms !important; }
  .js .rv { opacity: 1; transform: none; }
}

/* ------------------------------------------------------------------ páginas internas (privacidade, termos, 404) */
.pg-int main { padding: calc(var(--topo) + 56px) 0 80px; }
.doc { max-width: 820px; }
.doc h1 { font-size: clamp(30px, 4vw, 42px); font-weight: 800; letter-spacing: -.02em; line-height: 1.1; }
.doc .atual { margin-top: 10px; font-size: 14px; color: var(--tinta-3); }
.doc h2 { margin-top: 40px; font-size: 22px; font-weight: 700; }
.doc p, .doc li { margin-top: 12px; font-size: 16px; color: var(--tinta-2); }
.doc ul { padding-left: 22px; list-style: disc; }
.doc .caixa-dest { margin-top: 24px; padding: 18px 20px; border-radius: 14px; background: var(--papel-2); border: 1px solid var(--linha); }
.erro404 { min-height: 70vh; display: grid; place-items: center; text-align: center; }
.erro404 img { width: 120px; margin: 0 auto 24px; }
.erro404 h1 { font-size: clamp(32px, 5vw, 52px); font-weight: 800; }
.erro404 p { margin: 14px auto 28px; max-width: 520px; color: var(--tinta-2); }

/* ------------------------------------------------------------------ telas menores */
@media (max-width: 1180px) {
  .nav a { padding: 10px 9px; font-size: 14.5px; }
  .comuns ul { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 1080px) {
  .heroi-grade { grid-template-columns: minmax(0, 1fr); gap: 48px; }
  .heroi-txt { text-align: center; }
  .heroi-sub { margin-left: auto; margin-right: auto; }
  .heroi-cta, .heroi-prova { justify-content: center; }
  .heroi-vis { max-width: 760px; width: 100%; margin: 0 auto; }
  .dores, .servicos { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .pr-painel { grid-template-columns: minmax(0, 1fr); gap: 32px; }
  .pr-txt { order: 2; }
  .app-grade, .sob-grade { grid-template-columns: minmax(0, 1fr); }
  .app-txt { text-align: center; }
  .app-lista { text-align: left; max-width: 620px; margin-left: auto; margin-right: auto; }
  .lab-calc { grid-template-columns: minmax(0, 1fr); }
  .seg-grade { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .rod-grade { grid-template-columns: minmax(0, 1fr); }
}
@media (max-width: 960px) {
  .menu-bt { display: inline-flex; }
  .nav { position: fixed; inset: var(--topo) 0 auto 0; display: none; flex-direction: column; align-items: stretch; gap: 2px; padding: 12px 20px 22px; background: #fff; box-shadow: 0 20px 40px rgba(11, 36, 64, .18); border-top: 1px solid var(--linha); max-height: calc(100vh - var(--topo)); overflow-y: auto; }
  .nav.aberto { display: flex; }
  .nav a, .topo.rolou .nav a { color: var(--tinta); font-size: 17px; padding: 14px 8px; border-radius: 10px; }
  .nav a.atual, .topo.rolou .nav a.atual { box-shadow: none; color: var(--verde-acao); }
  .bt-nav { margin: 10px 0 0; min-height: 50px; font-size: 16px; }
  .topo.menu-aberto { background: #fff; }
  .topo.menu-aberto .lg-cor { opacity: 1; }
  .topo.menu-aberto .lg-neg { opacity: 0; }
  .topo.menu-aberto .menu-bt { color: var(--azul-prof); border-color: var(--linha-2); }
  .trilha { grid-template-columns: repeat(2, minmax(0, 1fr)); row-gap: 40px; }
  .trilha::before { display: none; }
  .sobre { grid-template-columns: minmax(0, 1fr); text-align: center; gap: 24px; padding: 30px 24px; }
}
@media (max-width: 720px) {
  :root { --topo: 64px; }
  .caixa { padding: 0 18px; }
  .logo { width: 132px; height: 49px; }
  .heroi { padding-top: calc(var(--topo) + 40px); padding-bottom: 56px; }
  .heroi-sub { font-size: 16.5px; }
  .selo-topo { gap: 8px; padding: 7px 12px; font-size: 11px; letter-spacing: .02em; white-space: nowrap; }
  .faixa-in { font-size: 13.5px; gap: 6px 10px; }
  .heroi-cta .bt { width: 100%; }
  .heroi-prova { flex-direction: column; align-items: center; gap: 8px; }
  .palco { aspect-ratio: 16 / 12.6; }
  .note { width: 94%; right: 3%; }
  .bt { white-space: normal; text-align: center; line-height: 1.25; }
  .cel-palco { width: 27%; bottom: 0; left: -1%; }
  .al { width: 66%; padding: 10px 12px; grid-template-columns: 32px minmax(0, 1fr); gap: 10px; }
  .al-ic { width: 32px; height: 32px; border-radius: 10px; }
  .al b { font-size: 13px; }
  .al small { font-size: 11.5px; }
  .al-a { right: -1%; top: 6%; }
  .al-b { display: none; }
  .dores, .servicos, .seg-grade { grid-template-columns: minmax(0, 1fr); }
  .pr-abas { flex-wrap: nowrap; justify-content: flex-start; overflow-x: auto; margin: 0 -18px 32px; padding: 4px 18px 8px; scrollbar-width: none; }
  .pr-abas::-webkit-scrollbar { display: none; }
  .pr-aba { flex: 0 0 auto; }
  .gal-mini button { width: 96px; }
  .comuns { padding: 26px 20px; }
  .comuns ul { grid-template-columns: minmax(0, 1fr); }
  .app-vis { min-height: 480px; }
  .cel-centro { width: 200px; }
  .cel-lado { width: 160px; }
  .cel-e { left: -4%; }
  .cel-d { right: -4%; }
  .lab-abas { flex-wrap: nowrap; justify-content: flex-start; overflow-x: auto; margin: 0 -18px 22px; padding: 4px 18px 8px; scrollbar-width: none; }
  .lab-abas::-webkit-scrollbar { display: none; }
  .lab-aba { flex: 0 0 auto; }
  .lab-painel { border-radius: 20px; }
  .campos { grid-template-columns: minmax(0, 1fr); }
  .res-grade { grid-template-columns: minmax(0, 1fr); }
  .lc-res .bt { align-self: stretch; white-space: normal; text-align: center; }
  .pedido { padding: 22px 18px; }
  .pedido-bts .bt { width: 100%; }
  .trilha { grid-template-columns: minmax(0, 1fr); }
  .rod-links { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 28px 18px; }
  .rod-links div:last-child { grid-column: 1 / -1; }
  .final-cta .bt { width: 100%; }
  .atd-bt { right: 14px; bottom: 14px; width: 56px; padding: 0; justify-content: center; }
  .atd-bt span { display: none; }
  .atd-jan { right: 0; left: 0; bottom: 0; width: auto; max-height: 88vh; border-radius: 22px 22px 0 0; }
  .atd-convite { display: none; }
  .lb { padding: 64px 10px 64px; }
  .lb-ant, .lb-prox { top: auto; bottom: 12px; transform: none; }
  .lb-ant { left: calc(50% - 60px); }
  .lb-prox { right: calc(50% - 60px); }
  .lb-fig img { max-height: calc(100vh - 220px); }
  .ck { left: 10px; right: 10px; bottom: 10px; max-width: none; }
}
@media (max-width: 400px) {
  .heroi h1 { font-size: 34px; }
  .cab h2, .app-txt h2, .sob-txt h2 { font-size: 28px; }
  .pr-nome { font-size: 25px; }
}
@media print {
  .topo, .atd, .lb, .ck, .heroi-vis, .pular, .heroi-video { display: none !important; }
  .heroi { padding: 20px 0; color: #000; background: none; }
  .heroi h1, .heroi-sub { color: #000; }
  .js .rv { opacity: 1; transform: none; }
}