/* ══════════════════════════════════════════════════
   GRUPO RECOVERY — style.css
   Paleta: Creme (#efece9) · Azul (#277fe4 / #0d4d96) · Verde (#41be60)
   Tipografia: Cormorant Garamond + Outfit
   ══════════════════════════════════════════════════ */

*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }

:root {
  --bg:        #efece9;
  --bg2:       #e4e0dc;
  --bg3:       #d8d3cd;
  --green:     #277fe4;
  --green-d:   #0d4d96;
  --green-dd:  #083572;
  --green-p:   rgba(39,127,228,.08);
  --accent:    #41be60;
  --accent-d:  #1f4b21;
  --gold:      #277fe4;
  --dark:      #0d1a2e;
  --dark2:     #162240;
  --muted:     #5a6880;
  --border:    rgba(39,127,228,.12);
  --border2:   rgba(13,26,46,.09);
  --font-d:    'Cormorant Garamond', serif;
  --font-b:    'Outfit', sans-serif;
  --ease:      cubic-bezier(.16,1,.3,1);
  --ease2:     cubic-bezier(.4,0,.2,1);
  --shadow:    0 4px 24px rgba(13,77,150,.12);
  --shadow-lg: 0 16px 48px rgba(13,77,150,.18);
}

body.menu-open { overflow: hidden; }

html { scroll-behavior: smooth; overflow-x: hidden; font-size: clamp(16px, 1.1vw + 11px, 20px); scroll-padding-top: 80px; }

body {
  font-family: var(--font-b);
  background: var(--bg);
  color: var(--dark);
  overflow-x: hidden;
}

a { color: inherit; text-decoration: none; }
img { max-width: 100%; display: block; }
button { cursor: pointer; border: none; background: none; font-family: var(--font-b); }
input, textarea, select { font-family: var(--font-b); }
ul { list-style: none; }
.hidden { display: none !important; }

::-webkit-scrollbar { width: 4px; }
::-webkit-scrollbar-track { background: var(--bg2); }
::-webkit-scrollbar-thumb { background: var(--green); border-radius: 2px; }
::selection { background: var(--green); color: #fff; }



/* ─── NAV ─────────────────────────────────────────── */
#nav {
  position: fixed; top: 0; left: 0; right: 0; z-index: 900;
  display: flex; align-items: center; justify-content: space-between;
  padding: 0 48px; height: 68px;
  background: rgba(239,236,233,.72);
  backdrop-filter: blur(28px) saturate(2) brightness(1.04);
  -webkit-backdrop-filter: blur(28px) saturate(2) brightness(1.04);
  border-bottom: 1px solid rgba(239,236,233,.5);
  box-shadow: 0 1px 0 rgba(255,255,255,.6), 0 4px 32px rgba(13,26,46,.07);
  transition: height .3s var(--ease), padding .3s var(--ease), box-shadow .3s, background .3s;
}
#nav.scrolled { height: 56px; box-shadow: 0 2px 32px rgba(13,26,46,.13); }
#nav.scrolled .nav-logo img { height: 32px !important; }
#nav.scrolled #site-logo-img { height: 32px !important; }
#nav .nav-logo img { background: transparent; }
footer .nav-logo img { mix-blend-mode: normal; }

.nav-logo {
  display: flex; align-items: center;
  line-height: 0; /* remove text baseline gap */
  outline: none;
}

/* Right group: contact + burger — always visible */
.nav-right { display: flex; align-items: center; gap: 10px; position: relative; }

/* Contact button */
.nav-contact-btn {
  display: flex; align-items: center; gap: 6px;
  font-family: var(--font-b); font-size: .82rem; font-weight: 600;
  color: var(--green); background: rgba(39,127,228,.08);
  border: 1.5px solid rgba(39,127,228,.25); border-radius: 6px;
  padding: 8px 16px; cursor: pointer;
  transition: background .25s, color .25s, border-color .25s, box-shadow .25s;
}
.nav-contact-btn:hover {
  background: var(--green); color: #fff;
  border-color: var(--green); box-shadow: 0 4px 16px rgba(39,127,228,.3);
}
.nav-contact-drop {
  position: absolute; top: calc(100% + 12px); right: 40px;
  background: var(--dark); border-radius: 10px;
  padding: 8px; min-width: 180px;
  box-shadow: 0 8px 32px rgba(13,26,46,.24);
  opacity: 0; visibility: hidden; transform: translateY(-8px);
  transition: opacity .25s, visibility .25s, transform .25s var(--ease);
  z-index: 910;
}
.nav-contact-drop.open {
  opacity: 1; visibility: visible; transform: translateY(0);
}
.ncd-item {
  display: flex; align-items: center; gap: 10px;
  padding: 10px 14px; border-radius: 7px;
  color: rgba(255,255,255,.75); font-size: .82rem; font-weight: 500;
  transition: background .2s, color .2s; width: 100%; text-align: left;
  border: none; background: none; font-family: var(--font-b); cursor: pointer;
}
.ncd-item:hover { background: rgba(255,255,255,.08); color: #fff; }
.ncd-item svg { flex-shrink: 0; opacity: .7; }

/* ─── NAV DESKTOP ─────────────────────────────────────────── */
.nav-desktop {
  display: flex; align-items: center; gap: 4px;
  flex: 1; justify-content: center;
}
.nav-dd { position: relative; }
.nav-dd-btn {
  display: flex; align-items: center; gap: 5px;
  font-family: var(--font-b); font-size: .82rem; font-weight: 600;
  color: var(--dark); background: none; border: none; cursor: pointer;
  padding: 8px 12px; border-radius: 8px;
  transition: color .22s, background .22s;
  letter-spacing: .01em;
}
.nav-dd-btn:hover, .nav-dd:hover .nav-dd-btn { color: var(--green); background: rgba(39,127,228,.07); }
.nav-dd-chev {
  transition: transform .25s var(--ease);
  flex-shrink: 0;
}
.nav-dd:hover .nav-dd-chev { transform: rotate(180deg); }
.nav-dd-panel {
  position: absolute; top: 100%; left: 50%;
  /* padding-top cria ponte invisível entre botão e painel — elimina o gap onde o hover se perde */
  padding-top: 8px;
  transform: translateX(-50%) translateY(-6px);
  min-width: 180px;
  opacity: 0; visibility: hidden;
  transition: opacity .22s var(--ease), transform .22s var(--ease), visibility .22s;
  z-index: 920;
  pointer-events: none;
}
/* conteúdo visual do painel num elemento filho para não conflitar com o padding-top */
.nav-dd-panel::before {
  content: none;
}
.nav-dd-inner {
  background: #fff;
  border-radius: 12px; padding: 6px;
  box-shadow: 0 8px 32px rgba(13,26,46,.14), 0 1px 0 rgba(13,26,46,.06);
  border: 1px solid rgba(13,26,46,.07);
}
.nav-dd:hover .nav-dd-panel, .nav-dd:focus-within .nav-dd-panel {
  opacity: 1; visibility: visible;
  transform: translateX(-50%) translateY(0);
  pointer-events: auto;
}
.nav-dd-item {
  display: block; padding: 9px 14px; border-radius: 8px;
  font-family: var(--font-b); font-size: .81rem; font-weight: 500;
  color: var(--dark); transition: background .18s, color .18s;
  white-space: nowrap;
}
.nav-dd-item:hover { background: rgba(39,127,228,.08); color: var(--green); }
.nav-direct-link {
  font-family: var(--font-b); font-size: .82rem; font-weight: 600;
  color: var(--dark); padding: 8px 12px; border-radius: 8px;
  transition: color .22s, background .22s; letter-spacing: .01em;
}
.nav-direct-link:hover { color: var(--green); background: rgba(39,127,228,.07); }

/* ─── Selos de certificação — seção Sobre ─────────────────── */
.sobre-certs {
  display: flex; align-items: center; justify-content: center;
  gap: 32px; margin-top: 48px; flex-wrap: wrap;
}
.hero-cert-img {
  height: 200px; width: auto; object-fit: contain;
  filter: drop-shadow(0 4px 16px rgba(0,0,0,.12));
  transition: transform .28s var(--ease), filter .28s;
  border-radius: 10px;
}
.hero-cert-img:hover { transform: scale(1.06); filter: drop-shadow(0 8px 24px rgba(0,0,0,.2)); }

/* Hamburger */
#nav-burger {
  display: flex; flex-direction: column; justify-content: center;
  gap: 5px; padding: 10px; cursor: pointer;
  background: none; border: none; width: 40px; height: 40px;
}
#nav-burger span {
  display: block; width: 22px; height: 1.8px;
  background: var(--dark); border-radius: 2px;
  transition: transform .3s var(--ease), opacity .25s, background .3s;
}
#nav-burger.open span { background: #fff; }
#nav-burger.open span:nth-child(1) { transform: translateY(6.8px) rotate(45deg); }
#nav-burger.open span:nth-child(2) { opacity: 0; }
#nav-burger.open span:nth-child(3) { transform: translateY(-6.8px) rotate(-45deg); }

/* hide old inline nav-links */
.nav-links { display: none !important; }

/* ═══════════════════════════════════════════════════
   NAV DRAWER — slide-in lateral com accordions
   ═══════════════════════════════════════════════════ */
#nav-drawer {
  position: fixed; inset: 0; z-index: 895;
  pointer-events: none;
}
#nav-drawer.open { pointer-events: auto; }

/* Backdrop */
#nav-drawer-backdrop {
  position: absolute; inset: 0;
  background: rgba(13,26,46,.55);
  backdrop-filter: blur(4px);
  opacity: 0; transition: opacity .32s var(--ease);
}
#nav-drawer.open #nav-drawer-backdrop { opacity: 1; }

/* Panel */
.nd-panel {
  position: absolute; top: 0; right: 0; bottom: 0;
  width: min(360px, 88vw);
  background: var(--dark);
  display: flex; flex-direction: column;
  transform: translateX(100%);
  transition: transform .36s var(--ease);
  box-shadow: -16px 0 48px rgba(13,26,46,.3);
  overflow: hidden;
}
#nav-drawer.open .nd-panel { transform: translateX(0); }

/* Head */
.nd-head {
  display: flex; align-items: center; justify-content: space-between;
  padding: 20px 24px;
  border-bottom: 1px solid rgba(255,255,255,.06);
  flex-shrink: 0;
}
.nd-brand {
  font-family: var(--font-b); font-size: .62rem; font-weight: 600;
  letter-spacing: .22em; text-transform: uppercase;
  color: rgba(255,255,255,.25);
}
.nd-close-btn {
  display: flex; align-items: center; justify-content: center;
  width: 36px; height: 36px; border-radius: 8px;
  color: rgba(255,255,255,.4);
  transition: background .2s, color .2s;
}
.nd-close-btn:hover { background: rgba(255,255,255,.08); color: #fff; }

/* Body — scrollable */
.nd-body { flex: 1; overflow-y: auto; padding: 12px 0; }

/* Accordion group */
.nd-group { border-bottom: 1px solid rgba(255,255,255,.05); }

.nd-toggle {
  display: flex; align-items: center; justify-content: space-between;
  width: 100%; padding: 16px 24px;
  font-family: var(--font-b); font-size: .95rem; font-weight: 600;
  color: rgba(255,255,255,.72);
  transition: color .2s, background .2s;
  text-align: left;
}
.nd-toggle:hover { color: #fff; background: rgba(255,255,255,.04); }
.nd-toggle[aria-expanded="true"] { color: #fff; }

.nd-chev {
  flex-shrink: 0;
  color: rgba(255,255,255,.3);
  transition: transform .28s var(--ease), color .2s;
}
.nd-toggle[aria-expanded="true"] .nd-chev {
  transform: rotate(180deg);
  color: var(--green);
}

/* Links container — height animated */
.nd-links {
  overflow: hidden;
  max-height: 0;
  transition: max-height .32s var(--ease), opacity .25s;
  opacity: 0;
}
.nd-links.open {
  max-height: 320px;
  opacity: 1;
}

.nd-link {
  display: block; padding: 11px 24px 11px 32px;
  font-family: var(--font-b); font-size: .88rem; font-weight: 400;
  color: rgba(255,255,255,.5);
  border-left: 2px solid transparent;
  transition: color .18s, border-color .18s, background .18s, padding-left .18s;
}
.nd-link:hover {
  color: #fff; border-left-color: var(--green);
  background: rgba(39,127,228,.06); padding-left: 36px;
}
.nd-link.active-nav { color: var(--green); border-left-color: var(--green); }

/* Footer CTA */
.nd-foot {
  padding: 20px 24px;
  border-top: 1px solid rgba(255,255,255,.06);
  flex-shrink: 0;
}
.nd-cta {
  display: flex; align-items: center; gap: 10px;
  width: 100%; padding: 13px 20px; border-radius: 10px;
  background: var(--accent); color: #fff;
  font-family: var(--font-b); font-size: .88rem; font-weight: 600;
  justify-content: center;
  transition: background .2s, transform .15s var(--ease), box-shadow .2s;
}
.nd-cta:hover {
  background: var(--accent-d);
  transform: translateY(-1px);
  box-shadow: 0 8px 24px rgba(65,190,96,.3);
}

/* Burger span color reset (panel is dark, burger stays dark on nav) */
#nav-burger.open span { background: var(--dark); }

/* ─── LOGOS BAR ───────────────────────────────────── */
#logos-bar {
  background: var(--bg); padding: 36px 0 32px;
  border-bottom: 1px solid var(--border2); overflow: hidden;
}
.lb-label {
  text-align: center;
  font-family: var(--font-b); font-size: .6rem; font-weight: 600;
  letter-spacing: .22em; text-transform: uppercase;
  color: rgba(13,26,46,.3); margin-bottom: 28px;
}
.lb-mask { overflow: hidden; position: relative; }
.lb-mask::before, .lb-mask::after {
  content: ''; position: absolute; top: 0; bottom: 0; width: 120px; z-index: 2;
}
.lb-mask::before { left: 0; background: linear-gradient(to right, var(--bg), transparent); }
.lb-mask::after  { right: 0; background: linear-gradient(to left,  var(--bg), transparent); }
.lb-track {
  display: flex; align-items: center; gap: 64px;
  width: max-content; animation: lbScroll 30s linear infinite; user-select: none;
}
.lb-track:hover { animation-play-state: paused; }
.lb-item {
  display: flex; align-items: center; gap: 10px;
  opacity: .55; transition: opacity .3s; flex-shrink: 0;
}
.lb-item:hover { opacity: 1; }
.lb-item img {
  height: 40px; object-fit: contain; max-width: 160px;
  filter: grayscale(1); transition: filter .3s;
}
.lb-item:hover img { filter: grayscale(0); }
.lb-item:hover img { opacity: 1; }
.lb-logo { display: block; }

@keyframes lbScroll { from { transform: translateX(0) } to { transform: translateX(-50%) } }

/* ─── PARCEIROS CAROUSEL COLORIDO (#parceiros) ────── */
.pc-mask {
  overflow: hidden; position: relative;
  margin: 48px 0 64px;
}
.pc-mask::before, .pc-mask::after {
  content: ''; position: absolute; top: 0; bottom: 0; width: 80px; z-index: 2; pointer-events: none;
}
.pc-mask::before { left: 0;  background: linear-gradient(to right, var(--dark), transparent); }
.pc-mask::after  { right: 0; background: linear-gradient(to left,  var(--dark), transparent); }
.pc-track {
  display: flex; align-items: center; gap: 56px;
  width: max-content; animation: lbScroll 32s linear infinite; user-select: none;
}
.pc-track:hover { animation-play-state: paused; }
.pc-item {
  display: flex; align-items: center; flex-shrink: 0;
  background: rgba(255,255,255,0.96); border-radius: 10px;
  padding: 10px 20px;
  opacity: .88; transition: opacity .3s, box-shadow .3s;
  box-shadow: 0 2px 12px rgba(0,0,0,0.18);
}
.pc-item:hover { opacity: 1; box-shadow: 0 4px 20px rgba(0,0,0,0.28); }
.pc-item img {
  height: 40px; object-fit: contain; max-width: 140px;
}

/* ─── MÉTRICAS ────────────────────────────────────── */
#metricas {
  background: var(--dark); padding: 88px 0;
  position: relative; overflow: hidden;
}
#metricas::before {
  content: ''; position: absolute; top: -40%; left: -10%;
  width: 600px; height: 600px;
  background: radial-gradient(circle, rgba(39,127,228,.07), transparent 70%);
  border-radius: 50%; pointer-events: none;
}
.met-head { text-align: center; margin-bottom: 60px; }
.met-head .stag { color: rgba(255,255,255,.45); }
.met-head .stag::before { background: rgba(255,255,255,.25); }
.met-head .stitle { color: #fff; }
.met-grid {
  display: grid; grid-template-columns: repeat(4, 1fr);
  border-top: 1px solid rgba(255,255,255,.06);
  border-left: 1px solid rgba(255,255,255,.06);
}
.met-cell {
  padding: 48px 28px 40px; text-align: center;
  border-right: 1px solid rgba(255,255,255,.06);
  border-bottom: 1px solid rgba(255,255,255,.06);
  transition: background .35s;
}
.met-cell:hover { background: rgba(255,255,255,.025); }
.met-num {
  font-family: var(--font-d); font-size: clamp(2.4rem, 3.2vw, 3.2rem);
  font-weight: 700; color: var(--green); line-height: 1; margin-bottom: 10px;
}
.met-num em { color: var(--green); font-style: normal; font-size: inherit; }
.met-lbl {
  font-size: .72rem; text-transform: uppercase;
  letter-spacing: .1em; color: rgba(255,255,255,.38); line-height: 1.6;
}
.met-src { font-size: .6rem; color: rgba(255,255,255,.18); margin-top: 10px; }
@media(max-width: 768px) { .met-grid { grid-template-columns: repeat(2, 1fr); } }
@media(max-width: 400px) { .met-grid { grid-template-columns: 1fr 1fr; } }

/* ─── CONTAINER ─────────────────────────────────── */
.container { max-width: 1220px; margin: 0 auto; padding: 0 48px; }

/* ─── TYPE & TAGS ─────────────────────────────────── */
.stag {
  display: inline-flex; align-items: center; gap: 10px;
  font-family: var(--font-b); font-size: .68rem; font-weight: 600;
  letter-spacing: .2em; color: var(--green);
  text-transform: uppercase; margin-bottom: 16px;
}
.stag::before {
  content: ''; display: inline-block;
  width: 22px; height: 2px;
  background: var(--green); border-radius: 1px;
}
.stitle {
  font-family: var(--font-d);
  font-size: clamp(2.6rem, 5.5vw, 4.4rem);
  font-weight: 700; line-height: 1.05;
  color: var(--dark); margin-bottom: 20px;
}
.stitle em { font-style: italic; color: var(--green); }
.ssub { color: var(--muted); font-size: 1.05rem; line-height: 1.75; max-width: 560px; margin-bottom: 48px; }
.sec-head { margin-bottom: 60px; }
.sec-head.centered { text-align: center; }
.sec-head.centered .ssub { margin-left: auto; margin-right: auto; }

/* ─── REVEAL ─────────────────────────────────────── */
[data-reveal] {
  /* 32px de subida com .8s dava um empurrao visivel a cada bloco.
     18px em .95s entra devagar e chama menos atencao para si. */
  opacity: 0; transform: translateY(18px);
  transition: opacity .95s var(--ease), transform .95s var(--ease);
  will-change: opacity, transform;
}
[data-reveal].revealed { will-change: auto; }
[data-reveal].revealed { opacity: 1; transform: none; }
[data-d="80"]  { transition-delay: .08s !important; }
[data-d="160"] { transition-delay: .16s !important; }

/* ─── BUTTONS ─────────────────────────────────────── */
.btn-p {
  display: inline-flex; align-items: center; gap: 8px;
  background: var(--accent); color: #fff;
  font-weight: 600; font-size: .85rem; letter-spacing: .03em;
  padding: 13px 28px; border-radius: 10px;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.22), 0 4px 16px rgba(65,190,96,.25);
  transition: background .25s, transform .25s var(--ease), box-shadow .25s;
  cursor: pointer;
}
.btn-p:hover { background: var(--accent-d); transform: translateY(-2px); box-shadow: inset 0 1px 0 rgba(255,255,255,.22), 0 12px 28px rgba(65,190,96,.38); }

.btn-g {
  display: inline-flex; align-items: center; gap: 8px;
  color: #fff; font-weight: 500; font-size: .85rem;
  padding: 13px 28px; border-radius: 10px;
  border: 1px solid rgba(255,255,255,.28);
  background: rgba(255,255,255,.10);
  backdrop-filter: blur(16px) saturate(1.4);
  -webkit-backdrop-filter: blur(16px) saturate(1.4);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.18), 0 4px 16px rgba(13,26,46,.18);
  transition: border-color .25s, background .25s, box-shadow .25s, transform .25s var(--ease);
  cursor: pointer;
}
.btn-g:hover {
  border-color: rgba(255,255,255,.55);
  background: rgba(255,255,255,.18);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.28), 0 8px 28px rgba(13,26,46,.22);
  transform: translateY(-2px);
}
.btn-g:active { transform: translateY(0); }

/* ─── PARALLAX LAYER ─────────────────────────────── */
.parallax-layer { position: absolute; inset: -20%; z-index: 0; pointer-events: none; will-change: transform; }

/* ─── ORBS ─────────────────────────────────────── */
.orb { position: absolute; border-radius: 50%; filter: blur(100px); pointer-events: none; }
.ob1 { width: 600px; height: 600px; background: radial-gradient(circle, rgba(39,127,228,.10) 0%, transparent 70%); top: -10%; left: -5%; }
.ob2 { width: 400px; height: 400px; background: radial-gradient(circle, rgba(39,127,228,.07) 0%, transparent 70%); bottom: -10%; right: 5%; }

/* ─── HERO VIDEO BACKGROUND ─────────────────────── */
#hero-video-bg {
  position: absolute; inset: 0; z-index: 0; overflow: hidden;
  /* Primeiro quadro do vídeo como imagem: aparece na hora, enquanto o
     mp4 ainda carrega, e continua servindo em prefers-reduced-motion. */
  background: #0b1a33 url('assets/fotos/hero-poster.jpg') center/cover no-repeat;
}
#hero-video-bg[hidden] { display: none !important; }
/* Vídeo local — loop nativo do browser, fade-in quando pronto para reproduzir */
#hero-vid {
  position: absolute; inset: 0;
  width: 100%; height: 100%;
  object-fit: cover; object-position: center;
  opacity: 0; transition: opacity 1.4s ease;
  pointer-events: none;
}
#hero-vid.ready { opacity: 1; }
@media (prefers-reduced-motion: reduce) { #hero-vid { display: none !important; } }
.hero-video-overlay {
  position: absolute; inset: 0;
  background: linear-gradient(150deg,
    rgba(5,14,31,.04) 0%,
    rgba(10,32,64,.03) 50%,
    rgba(6,21,48,.05) 100%);
}

/* ══════════════════════════════════════════════════
   HERO
   ══════════════════════════════════════════════════ */
#hero {
  height: 100vh; min-height: 700px;
  display: flex; align-items: center;
  position: relative; overflow: hidden;
  padding-top: 80px; /* compensar nav 80px */
  background: #0d1a2e;
}

#hero::before, #hero::after { content: none; }
@keyframes morphOrb {
  0%,100% { border-radius: 60% 40% 50% 60% / 50% 60% 40% 55%; transform: scale(1); }
  33%      { border-radius: 50% 60% 40% 55% / 40% 50% 60% 45%; transform: scale(1.05); }
  66%      { border-radius: 40% 55% 60% 45% / 55% 45% 50% 60%; transform: scale(.97); }
}

.hero-grid { display: none; }
.hero-content { position: relative; z-index: 2; padding: 0 80px; max-width: 820px; }
.eyebrow {
  display: flex; align-items: center; gap: 10px;
  font-family: var(--font-b); font-size: .7rem; font-weight: 500;
  letter-spacing: .15em; color: rgba(130,190,255,.8);
  text-transform: uppercase; margin-bottom: 28px;
}
.pulse { width: 8px; height: 8px; border-radius: 50%; background: #41be60; animation: pulse 2s infinite; }
@keyframes pulse {
  0%,100% { box-shadow: 0 0 0 0 rgba(65,190,96,.5); }
  50%      { box-shadow: 0 0 0 8px rgba(65,190,96,0); }
}
#hero h1 {
  font-family: var(--font-d);
  font-size: clamp(3.5rem, 7vw, 6rem);
  font-weight: 700; line-height: .95;
  color: #fff; margin-bottom: 32px; overflow: hidden;
}
#hero h1 .line { display: block; animation: lineIn 1s var(--ease) both; }
#hero h1 .line:nth-child(2) { animation-delay: .1s; }
#hero h1 .line:nth-child(3) { animation-delay: .2s; }
#hero h1 .it { font-style: italic; color: #7fc4ff; }
@keyframes lineIn { from { transform: translateY(100%); opacity: 0; } to { transform: none; opacity: 1; } }

.hero-sub { color: rgba(255,255,255,.58); font-size: 1.05rem; line-height: 1.7; margin-bottom: 40px; }
.hero-btns { display: flex; gap: 16px; flex-wrap: wrap; }

.hero-scroll { position: absolute; bottom: 12px; left: 80px; z-index: 2; display: flex; flex-direction: column; align-items: center; gap: 10px; }
.hs-line {
  width: 1px; height: 60px;
  background: linear-gradient(to bottom, rgba(65,190,96,.7), transparent);
  animation: lineDown 2s ease-in-out infinite;
}
@keyframes lineDown {
  0%,100% { transform: scaleY(0); transform-origin: top; }
  50%      { transform: scaleY(1); }
}
.hero-scroll span { font-family: var(--font-b); font-size: .6rem; letter-spacing: .15em; color: rgba(255,255,255,.3); writing-mode: vertical-rl; }
.hero-wm {
  position: absolute; right: -2%; top: 50%;
  transform: translateY(-50%) rotate(90deg);
  font-family: var(--font-d); font-size: 8rem; font-weight: 700;
  letter-spacing: .08em; color: transparent;
  -webkit-text-stroke: 1px rgba(255,255,255,.04);
  white-space: nowrap; z-index: 1; pointer-events: none; user-select: none;
}

/* ══════════════════════════════════════════════════
   SOBRE
   ══════════════════════════════════════════════════ */
#sobre { padding: 120px 0; background: var(--bg); position: relative; overflow: hidden; }
.sobre-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 80px 80px; align-items: start; position: relative; z-index: 1; }
/* Impactômetro spans both columns on desktop */
.sobre-grid .sobre-impacto-row { grid-column: 1 / -1; margin-top: 0; }
.txt p { color: rgba(28,36,25,.7); line-height: 1.8; font-size: .95rem; margin-bottom: 20px; }
.txt p strong { color: var(--dark); font-weight: 600; }
.txt p:last-child { margin-bottom: 0; }
.pills { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 28px; }
.pills span {
  font-family: var(--font-b); font-size: .65rem; letter-spacing: .08em; font-weight: 500;
  color: var(--green); border: 1px solid rgba(39,127,228,.25);
  padding: 5px 14px; border-radius: 20px;
  transition: background .2s, border-color .2s;
}
.pills span:hover { background: var(--green-p); border-color: var(--green); }

/* ══════════════════════════════════════════════════
   LINHA DO TEMPO COMPACTA — #sobre
   ══════════════════════════════════════════════════ */
.sobre-timeline {
  margin-top: 72px;
  position: relative; z-index: 1;
}
.stl-label {
  font-family: var(--font-b); font-size: .62rem; font-weight: 600;
  letter-spacing: .22em; text-transform: uppercase;
  color: rgba(13,26,46,.32); margin-bottom: 40px;
  display: flex; align-items: center; gap: 12px;
}
.stl-label::before, .stl-label::after {
  content: ''; flex: 1; height: 1px;
  background: linear-gradient(to right, transparent, rgba(13,26,46,.12), transparent);
}

/* ── Trilho horizontal ──────────────────────────── */
.stl-track {
  position: relative;
  display: flex;
  align-items: flex-start;
  gap: 0;
  padding-top: 36px;
  overflow-x: auto;
  scrollbar-width: none;
  padding-bottom: 8px;
}
.stl-track::-webkit-scrollbar { display: none; }

/* Linha central correndo pelo topo */
.stl-line {
  position: absolute;
  top: 14px; left: 0; right: 0;
  height: 1.5px;
  background: linear-gradient(to right,
    transparent 0%,
    rgba(39,127,228,.20) 8%,
    rgba(39,127,228,.35) 50%,
    rgba(39,127,228,.20) 92%,
    transparent 100%);
  pointer-events: none;
  z-index: 0;
}

/* ── Cada item da timeline ──────────────────────── */
.stl-item {
  flex: 1;
  min-width: 160px;
  max-width: 220px;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 0;
  position: relative;
  padding: 0 8px;
}

/* Ponto no eixo */
.stl-dot {
  width: 11px; height: 11px;
  border-radius: 50%;
  background: var(--bg);
  border: 2px solid rgba(39,127,228,.40);
  position: relative; z-index: 1;
  flex-shrink: 0;
  transition: border-color .3s, background .3s, box-shadow .3s;
  margin-bottom: 18px;
}
.stl-item:hover .stl-dot {
  border-color: var(--green);
  background: var(--green);
  box-shadow: 0 0 0 4px rgba(39,127,228,.15);
}
.stl-dot-active {
  background: var(--accent) !important;
  border-color: var(--accent) !important;
  box-shadow: 0 0 0 5px rgba(65,190,96,.18) !important;
}

/* Ano acima do ponto (hover only) — inline label */
.stl-year {
  position: absolute;
  top: -22px;
  font-family: var(--font-b); font-size: .62rem; font-weight: 700;
  letter-spacing: .1em; color: var(--green);
  opacity: 0;
  transform: translateY(4px);
  transition: opacity .25s, transform .25s;
  white-space: nowrap;
  pointer-events: none;
}
.stl-item:hover .stl-year { opacity: 1; transform: none; }

/* ── Card de evento ─────────────────────────────── */
.stl-card {
  background: rgba(255,255,255,.62);
  backdrop-filter: blur(18px) saturate(1.5);
  -webkit-backdrop-filter: blur(18px) saturate(1.5);
  border: 1px solid rgba(255,255,255,.78);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.90), 0 2px 16px rgba(13,77,150,.08);
  border-radius: 14px;
  padding: 18px 16px 14px;
  width: 100%;
  cursor: default;
  transition: background .3s, box-shadow .3s, transform .3s var(--ease);
}
.stl-item:hover .stl-card {
  background: rgba(255,255,255,.82);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.92), 0 8px 32px rgba(13,77,150,.13);
  transform: translateY(-3px);
}
.stl-card-active {
  border-color: rgba(65,190,96,.35) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.90), 0 4px 20px rgba(65,190,96,.12) !important;
}
.stl-item:hover .stl-card-active {
  box-shadow: inset 0 1px 0 rgba(255,255,255,.90), 0 10px 36px rgba(65,190,96,.18) !important;
}

.stl-card-year {
  font-family: var(--font-b); font-size: .62rem; font-weight: 700;
  letter-spacing: .14em; color: var(--green);
  margin-bottom: 6px;
}
.stl-card-active .stl-card-year { color: var(--accent); }

.stl-card h4 {
  font-family: var(--font-d); font-size: .95rem; font-weight: 700;
  color: var(--dark); line-height: 1.25; margin-bottom: 6px;
}
.stl-card p {
  font-size: .72rem; color: var(--muted); line-height: 1.6; margin-bottom: 10px;
}
.stl-tags {
  display: flex; flex-wrap: wrap; gap: 4px;
}
.stl-tags span {
  font-size: .6rem; font-weight: 600; letter-spacing: .06em;
  background: rgba(39,127,228,.07);
  color: var(--green);
  border: 1px solid rgba(39,127,228,.18);
  padding: 2px 8px; border-radius: 20px;
  font-family: var(--font-b);
}
.stl-card-active .stl-tags span {
  background: rgba(65,190,96,.08);
  color: var(--accent-d);
  border-color: rgba(65,190,96,.25);
}

/* ── Responsive ─────────────────────────────────── */
@media (max-width: 900px) {
  .stl-track { gap: 0; padding-top: 40px; }
  .stl-item { min-width: 140px; }
}
@media (max-width: 600px) {
  .stl-track {
    flex-direction: column;
    align-items: stretch;
    padding-top: 0;
    gap: 0;
  }
  .stl-line {
    top: 0; left: 20px; right: auto;
    width: 1.5px; height: 100%;
    background: linear-gradient(to bottom,
      transparent 0%, rgba(39,127,228,.25) 8%,
      rgba(39,127,228,.35) 50%,
      rgba(39,127,228,.25) 92%, transparent 100%);
  }
  .stl-item {
    flex-direction: row;
    align-items: flex-start;
    max-width: 100%;
    gap: 16px;
    padding: 0 0 28px 0;
  }
  .stl-dot {
    flex-shrink: 0;
    margin-top: 10px;
    margin-bottom: 0;
    margin-left: 15px;
  }
  .stl-year { display: none; }
  .stl-card { flex: 1; }
}

/* ══════════════════════════════════════════════════
   GRUPO — STICKY SIDEBAR + ANIMATED PANELS
   ══════════════════════════════════════════════════ */
#grupo { padding: 120px 0; background: var(--bg2); position: relative; overflow: hidden; }
#grupo-canvas { position: absolute; inset: 0; width: 100%; height: 100%; z-index: 0; opacity: .12; }
#grupo .container { position: relative; z-index: 1; }

/* ── Layout wrapper ─────────────────────────────── */
.grupo-wrap { display: flex; gap: 28px; align-items: flex-start; margin-top: 56px; }

/* ── Sticky sidebar (Blueprint position:sticky pattern) ── */
.grupo-sidebar { width: 248px; flex-shrink: 0; position: sticky; top: 90px; }
.gs-tabs { display: flex; flex-direction: column; gap: 3px; }
.gs-tab {
  display: flex; align-items: center; gap: 12px;
  padding: 13px 14px; border-radius: 12px;
  border: 1px solid var(--border2); background: var(--bg);
  cursor: pointer; text-align: left; color: var(--dark);
  transition: all .22s; position: relative; overflow: hidden; width: 100%;
}
.gs-tab::before {
  content: ''; position: absolute; left: 0; top: 0; bottom: 0;
  width: 0; background: var(--green); transition: width .22s;
}
.gs-tab.active::before { width: 3px; }
.gs-tab:hover:not(.active) { background: rgba(39,127,228,.05); border-color: rgba(39,127,228,.3); }
.gs-tab.active { background: var(--dark); border-color: var(--dark); box-shadow: 0 6px 24px rgba(13,26,46,.2); }
.gs-tab-num { font-family: var(--font-b); font-size: .68rem; font-weight: 700; color: var(--green); flex-shrink: 0; letter-spacing: .04em; transition: color .22s; min-width: 22px; }
.gs-tab.active .gs-tab-num { color: var(--accent); }
.gs-tab-body { flex: 1; min-width: 0; }
.gs-tab-name { font-size: .78rem; font-weight: 600; line-height: 1.3; transition: color .22s; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.gs-tab.active .gs-tab-name { color: #fff; }
.gs-tab-tag { font-size: .6rem; color: var(--muted); margin-top: 2px; transition: color .22s; }
.gs-tab.active .gs-tab-tag { color: rgba(255,255,255,.42); }
.gs-tab-arr { width: 14px; height: 14px; flex-shrink: 0; opacity: 0; color: var(--accent); transition: opacity .22s, transform .22s; }
.gs-tab.active .gs-tab-arr { opacity: 1; transform: translateX(2px); }

/* ── Panels container ───────────────────────────── */
.grupo-panels { flex: 1; position: relative; min-height: 440px; border-radius: 20px; overflow: hidden; }
.grupo-panel {
  position: absolute; inset: 0; display: flex;
  border-radius: 20px; overflow: hidden;
  opacity: 0; pointer-events: none;
  transform: translateX(28px);
  transition: opacity .38s ease, transform .38s ease;
  box-shadow: 0 24px 64px rgba(13,26,46,.18);
}
.grupo-panel.active { opacity: 1; pointer-events: auto; transform: none; z-index: 2; }
.grupo-panel.gp-exit { z-index: 1; transform: translateX(-28px) !important; opacity: 0 !important; pointer-events: none; }

/* Photo half */
.gp-photo {
  width: 42%; flex-shrink: 0;
  background: linear-gradient(145deg, #0d1a2e 0%, #1a2d4a 100%);
  background-size: cover; background-position: center;
  position: relative; display: flex; align-items: center; justify-content: center;
}
.gp-photo::after {
  content: ''; position: absolute; inset: 0;
  background: linear-gradient(135deg, rgba(13,26,46,.2) 0%, transparent 50%, rgba(13,26,46,.6) 100%);
  pointer-events: none;
}
.gp-photo-icon { width: 64px; height: 64px; color: rgba(255,255,255,.14); z-index: 1; transition: opacity .3s; }
.gp-photo[style*="background-image"] .gp-photo-icon { opacity: 0; }

/* Content half */
.gp-content {
  flex: 1; background: var(--dark);
  padding: 44px 48px;
  display: flex; flex-direction: column; justify-content: center; gap: 16px;
  color: #fff; position: relative; overflow: hidden;
}
.gp-content::before {
  content: attr(data-num); position: absolute; right: 28px; bottom: -18px;
  font-family: var(--font-d); font-size: 9rem; font-weight: 900; line-height: 1;
  opacity: .04; pointer-events: none; color: #fff; user-select: none;
}
.gp-eyebrow { display: flex; align-items: center; gap: 10px; }
.gp-num { font-family: var(--font-b); font-size: .68rem; font-weight: 700; color: var(--accent); letter-spacing: .05em; }
.gp-tag {
  font-size: .6rem; font-weight: 600; letter-spacing: .06em; text-transform: uppercase;
  color: rgba(255,255,255,.38); border: 1px solid rgba(255,255,255,.16);
  border-radius: 20px; padding: 3px 10px;
}
.gp-title { font-family: var(--font-d); font-size: 2.2rem; font-weight: 700; color: #fff; line-height: 1.1; }
.gp-title em { font-style: italic; color: var(--accent); }
.gp-desc { font-size: .9rem; line-height: 1.72; color: rgba(255,255,255,.58); max-width: 400px; }

/* Saiba mais button */
.cc-saiba {
  display: inline-flex; align-items: center; gap: 6px;
  background: var(--accent); color: #fff;
  font-family: var(--font-b); font-size: .78rem; font-weight: 600;
  padding: 10px 22px; border-radius: 8px;
  border: none; cursor: pointer; align-self: flex-start; margin-top: 4px;
  transition: background .2s, transform .2s;
}
.cc-saiba:hover { background: var(--accent-d); transform: translateY(-1px); }

/* ══════════════════════════════════════════════════
   SOLUÇÕES — SLIDER
   ══════════════════════════════════════════════════ */
#solucoes { height: 100vh; position: relative; overflow: hidden; }
#sol-sticky { position: relative; height: 100%; overflow: hidden; }
#sol-track { display: flex; flex-direction: row; width: 500%; height: 100%; transition: transform .7s var(--ease); }

.sp { width: 20%; height: 100%; display: flex; align-items: center; position: relative; flex-shrink: 0; background: var(--bg); overflow: hidden; }

/* Dot grid background pattern */
#solucoes::before {
  content: ''; position: absolute; inset: 0; z-index: 0; pointer-events: none;
  background-image: radial-gradient(circle, rgba(39,127,228,.13) 1px, transparent 1px);
  background-size: 28px 28px;
  mask-image: linear-gradient(to right, transparent 0%, black 20%, black 80%, transparent 100%);
  -webkit-mask-image: linear-gradient(to right, transparent 0%, black 20%, black 80%, transparent 100%);
}

.sp-bg { position: absolute; inset: 0; z-index: 0; }
.sp-bg-0 { background: radial-gradient(ellipse 60% 80% at 15% 50%, rgba(39,127,228,.04) 0%, transparent 65%); }
.sp-bg-1 { background: radial-gradient(ellipse 60% 80% at 85% 50%, rgba(65,190,96,.03) 0%, transparent 65%); }
.sp-bg-2 { background: radial-gradient(ellipse 60% 80% at 15% 50%, rgba(39,127,228,.04) 0%, transparent 65%); }
.sp-bg-3 { background: radial-gradient(ellipse 60% 80% at 85% 50%, rgba(65,190,96,.03) 0%, transparent 65%); }
.sp-bg-4 { background: radial-gradient(ellipse 60% 80% at 15% 50%, rgba(39,127,228,.04) 0%, transparent 65%); }

/* Large decorative background number */
.sp-num-bg {
  position: absolute; right: -0.02em; bottom: -0.15em; z-index: 0;
  font-family: var(--font-d); font-size: clamp(14rem, 22vw, 22rem); font-weight: 700;
  line-height: 1; color: transparent;
  -webkit-text-stroke: 1px rgba(39,127,228,.08);
  user-select: none; pointer-events: none; letter-spacing: -.02em;
}

.sp-txt { position: relative; z-index: 2; width: 46%; padding-left: 10%; display: flex; flex-direction: column; gap: 18px; }
/* Left accent line */
.sp-txt::before {
  content: ''; position: absolute; left: calc(10% - 20px); top: 0; bottom: 0;
  width: 3px; border-radius: 2px;
  background: linear-gradient(to bottom, var(--green), transparent);
}
.sp-n { font-family: var(--font-b); font-size: .7rem; letter-spacing: .15em; color: var(--green); font-weight: 600; display: flex; align-items: center; gap: 8px; }
.sp-n-dot { width: 6px; height: 6px; border-radius: 50%; background: var(--green); display: inline-block; animation: dotBlink 2s ease-in-out infinite; }
@keyframes dotBlink { 0%,100%{opacity:1;} 50%{opacity:.3;} }
.sp h3 { font-family: var(--font-d); font-size: clamp(2rem, 4vw, 3rem); font-weight: 700; line-height: 1.1; color: var(--dark); }
.sp h3 em { font-style: italic; color: var(--green); }
.sp p { color: rgba(28,36,25,.65); font-size: .88rem; line-height: 1.75; max-width: 38ch; }
.sp ul { display: flex; flex-direction: column; gap: 6px; }
.sp ul li { font-size: .8rem; color: var(--muted); padding-left: 0; position: relative; display: flex; align-items: center; gap: 8px; }
.sp ul li::before {
  content: ''; flex-shrink: 0;
  width: 18px; height: 18px; border-radius: 4px;
  background: rgba(39,127,228,.1); border: 1px solid rgba(39,127,228,.2);
  background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 10 10' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M2 5l2 2 4-4' stroke='%23277fe4' stroke-width='1.4' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
  background-repeat: no-repeat; background-position: center; background-size: 10px;
}

/* Photo container — portrait card, flex item pushed right */
.sp-vis {
  position: relative; z-index: 1;
  width: 420px; height: 560px; flex-shrink: 0;
  margin-left: auto; margin-right: 15%;
  display: flex; align-items: center; justify-content: center;
}
/* Decorative offset frame */
.sp-frame {
  position: absolute; inset: 14px -10px -14px 10px;
  border: 2px solid rgba(39,127,228,.18); border-radius: 22px;
  z-index: 0; pointer-events: none;
}
.rings { position: absolute; inset: 0; }
.rg { position: absolute; border-radius: 50%; border: 1px solid rgba(42,92,32,.12); top: 50%; left: 50%; transform: translate(-50%,-50%); animation: ringPulse 4s ease-in-out infinite; }
.rg.r1 { width: 100%; height: 100%; animation-delay: 0s; }
.rg.r2 { width: 75%; height: 75%; animation-delay: .5s; }
.rg.r3 { width: 50%; height: 50%; animation-delay: 1s; }
@keyframes ringPulse {
  0%,100% { opacity: .12; transform: translate(-50%,-50%) scale(1); }
  50%      { opacity: .35; transform: translate(-50%,-50%) scale(1.04); }
}
.sp-svg { width: 220px; height: 220px; position: relative; z-index: 1; animation: floatSvg 5s ease-in-out infinite; color: var(--green); }
@keyframes floatSvg { 0%,100% { transform: translateY(0); } 50% { transform: translateY(-12px); } }

/* Photo replaces animated icon when uploaded via admin */
.sp-photo { display: none; position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; border-radius: 18px; z-index: 3; box-shadow: 0 20px 60px rgba(13,26,46,.22), 0 4px 16px rgba(13,26,46,.12); }
.sp-vis.has-photo .sp-photo { display: block; }
.sp-vis.has-photo .rings { opacity: 0; pointer-events: none; }
.sp-vis.has-photo .sp-svg { opacity: 0; animation: none; }

/* Floating badge on photo */
.sp-badge {
  display: none; position: absolute; bottom: -14px; left: 50%; transform: translateX(-50%);
  z-index: 5; background: var(--dark); color: #fff;
  font-family: var(--font-b); font-size: .7rem; font-weight: 500; letter-spacing: .06em;
  padding: 6px 16px; border-radius: 20px; white-space: nowrap;
  box-shadow: 0 4px 16px rgba(13,26,46,.25);
}
.sp-vis.has-photo .sp-badge { display: block; }

/* Second photo — layered card stack effect */
.sp-photo-b { display: none; position: absolute; z-index: 2; object-fit: cover; border-radius: 14px; box-shadow: 0 12px 40px rgba(13,26,46,.18); width: 72%; height: 72%; bottom: 4%; left: -6%; transform: rotate(-5deg); opacity: .88; }
.sp-vis.has-photo-b .sp-photo-b { display: block; }
/* When both photos: shift primary to top-right */
.sp-vis.has-photo.has-photo-b .sp-photo { inset: auto; top: 0; right: -5%; bottom: auto; left: auto; width: 78%; height: 78%; border-radius: 18px; }

#sol-dots { position: absolute; bottom: 36px; left: 50%; transform: translateX(-50%); display: flex; gap: 4px; z-index: 10; }
/* O ponto continua com 8px; quem cresce e a area de toque do botao, para
   chegar aos 24x24 do WCAG 2.2 AA sem os alvos se sobreporem. */
.sd {
  width: 24px; height: 24px; padding: 0; border: none; background: none;
  display: grid; place-items: center; cursor: pointer;
}
.sd::before {
  content: ''; width: 8px; height: 8px; border-radius: 50%;
  background: rgba(42,92,32,.2);
  transition: background .3s, transform .3s;
}
.sd.active::before { background: var(--green); transform: scale(1.3); }

/* ══════════════════════════════════════════════════
   TECNOLOGIAS
   ══════════════════════════════════════════════════ */
/* overflow:hidden porque .parallax-layer usa inset:-20% e por definicao
   passa 20% para fora de cada lado; sem o recorte a camada renderiza
   fora da area util (288px no desktop). */
#tecnologias { padding: 120px 0; background: var(--bg); position: relative; overflow: hidden; }
.tech-mesh {
  position: absolute; inset: 0;
  background-image:
    radial-gradient(circle at 20% 80%, rgba(39,127,228,.07) 0%, transparent 50%),
    radial-gradient(circle at 80% 20%, rgba(39,127,228,.05) 0%, transparent 50%);
}
.tgrid { display: grid; grid-template-columns: repeat(3,1fr); gap: 2px; }
.tc {
  background: var(--bg);
  border: 1px solid var(--border2);
  padding: 36px 32px; position: relative;
  transition: border-color .3s, background .3s, box-shadow .3s;
  overflow: hidden;
}
.tc:hover { border-color: rgba(42,92,32,.3); background: var(--bg2); box-shadow: var(--shadow); }
.tc-l { position: absolute; left: 0; top: 0; bottom: 0; width: 3px; background: linear-gradient(to bottom, transparent, var(--green), transparent); opacity: 0; transition: opacity .4s; }
.tc:hover .tc-l { opacity: 1; }
.tc-i { width: 48px; height: 48px; color: var(--green); margin-bottom: 20px; }
.tc-i svg { width: 100%; height: 100%; }
.tc h4 { font-family: var(--font-d); font-size: 1.2rem; font-weight: 600; margin-bottom: 12px; line-height: 1.2; color: var(--dark); }
.tc p { font-size: .82rem; color: var(--muted); line-height: 1.7; }
.tc p + p { margin-top: 12px; }
.tc-compliance p strong { color: var(--dark); }

/* ══════════════════════════════════════════════════
   AMBIENTAL — CMS
   ══════════════════════════════════════════════════ */
#ambiental { padding: 120px 0; background: var(--bg2); position: relative; overflow: hidden; }
.amb-grad { position: absolute; inset: 0; z-index: 0; background: radial-gradient(ellipse 60% 50% at 30% 50%, rgba(42,92,32,.07) 0%, transparent 60%); pointer-events: none; }
#ambiental .container { position: relative; z-index: 1; }


/* Os filtros de Documentos vem em degraus: a empresa em cima, o que se
   quer dela logo abaixo e, dentro de Artigos, o ano. O degrau se le pelo
   recuo e pelo peso da pilula — nao por outro componente. */
.doc-filtros { margin-bottom: 36px; }
.doc-filtros .emp-filter-bar { margin-bottom: 0; }

.emp-filter-bar { display: flex; gap: 6px; overflow-x: auto; scrollbar-width: none; padding-bottom: 4px; margin-bottom: 14px; }
.emp-filter-bar::-webkit-scrollbar { display: none; }
.efb { flex-shrink: 0; font-family: var(--font-b); font-size: .66rem; letter-spacing: .1em; text-transform: uppercase; padding: 6px 14px; border: 1px solid var(--border2); border-radius: 20px; transition: all .25s; cursor: pointer; font-weight: 500; color: var(--muted); background: transparent; }
.efb.active, .efb:hover { color: var(--green); border-color: var(--border); background: var(--green-p); }

.sub-filter-bar { display: flex; flex-wrap: wrap; align-items: center; gap: 6px; margin-top: 10px; padding-left: 2px; }
.sub-filter-bar.anos { margin-left: 16px; padding-left: 14px; border-left: 1px solid var(--border2); }
.sfb { flex-shrink: 0; font-family: var(--font-b); font-size: .62rem; letter-spacing: .1em; text-transform: uppercase; padding: 5px 13px; border: 1px solid transparent; border-radius: 20px; background: rgba(13,26,46,.04); color: var(--muted); transition: all .25s; cursor: pointer; font-weight: 500; }
.sfb.active, .sfb:hover { color: var(--green); border-color: var(--border2); background: var(--green-p); }
.cbadge.emp-b { background: rgba(65,190,96,.1); color: #1a7236; margin-left: 5px; }
.cbadge.cat-b { background: rgba(65,190,96,.1); color: #1a7236; margin-left: 5px; }
.empresa-row { display: flex; align-items: center; gap: 10px; padding: 10px 14px; background: var(--bg); border: 1px solid var(--border2); border-radius: 10px; margin: 10px 0; font-size: .82rem; color: var(--dark); }
.empresa-row label { flex-shrink: 0; font-weight: 500; }
.empresa-row select { font-family: var(--font-b); font-size: .82rem; border: 1px solid var(--border2); border-radius: 8px; padding: 5px 10px; background: var(--bg2); color: var(--dark); cursor: pointer; flex: 1; }

#cgrid { display: grid; grid-template-columns: repeat(3,1fr); gap: 20px; }
.ccard { background: var(--bg); border: 1px solid var(--border2); border-radius: 16px; overflow: hidden; box-shadow: 0 2px 12px rgba(28,36,25,.05); transition: border-color .3s, transform .3s var(--ease), box-shadow .3s; cursor: pointer; }
.ccard:hover { border-color: rgba(39,127,228,.3); transform: translateX(4px); box-shadow: -4px 8px 32px rgba(13,77,150,.18); }

.cthumb { height: 140px; display: flex; align-items: center; justify-content: center; }
/* Capa do PDF: preenche a faixa inteira, alinhada pelo alto — o topo da
   pagina e onde esta o titulo. */
.cthumb.com-capa { padding: 0; overflow: hidden; }
.cthumb.com-capa img { width: 100%; height: 100%; object-fit: cover; object-position: top center; display: block; }
.pdf-t { background: rgba(39,127,228,.05); }
.img-t { background: rgba(39,127,228,.04); }
.ppt-t { background: rgba(65,190,96,.06); }

.cinfo { padding: 18px 20px 20px; }
.cbadge { font-family: var(--font-b); font-size: .58rem; letter-spacing: .12em; padding: 3px 10px; border-radius: 20px; display: inline-block; margin-bottom: 10px; font-weight: 600; }
.pdf-b { background: var(--green-p); color: var(--green); }
.img-b { background: rgba(39,127,228,.06); color: var(--green-d); }
.ppt-b { background: rgba(65,190,96,.12); color: var(--accent-d); }

.cinfo h4 { font-family: var(--font-d); font-size: 1.1rem; font-weight: 700; margin-bottom: 8px; line-height: 1.2; color: var(--dark); }
.cinfo p { font-size: .78rem; color: var(--muted); line-height: 1.6; margin-bottom: 14px; }
.cacts { display: flex; gap: 8px; }
.bv, .bd { font-size: .72rem; font-weight: 600; padding: 6px 16px; border-radius: 20px; transition: all .2s; cursor: pointer; }
.bv { background: var(--green-p); color: var(--green); border: 1px solid rgba(42,92,32,.2); }
.bv:hover { background: var(--green); color: #fff; border-color: var(--green); }
.bd { color: var(--muted); border: 1px solid var(--border2); }
.bd:hover { color: var(--dark); border-color: rgba(28,36,25,.25); }

#c-empty { grid-column: 1/-1; text-align: center; color: var(--muted); padding: 60px; font-size: .9rem; }

#lightbox { position: fixed; inset: 0; z-index: 2000; display: flex; align-items: center; justify-content: center; }
#lb-ov { position: absolute; inset: 0; background: rgba(28,36,25,.7); backdrop-filter: blur(12px); cursor: pointer; }
.lb-box { position: relative; z-index: 1; max-width: 90vw; max-height: 90vh; background: var(--bg); border: 1px solid var(--border2); border-radius: 14px; overflow: hidden; display: flex; flex-direction: column; animation: lbIn .3s var(--ease); box-shadow: 0 32px 80px rgba(28,36,25,.2); }
@keyframes lbIn { from { opacity: 0; transform: scale(.95); } to { opacity: 1; transform: none; } }
#lb-close { position: absolute; top: 12px; right: 16px; color: var(--muted); font-size: 1.1rem; z-index: 2; transition: color .2s; cursor: pointer; }
#lb-close:hover { color: var(--dark); }
#lb-body { flex: 1; overflow: auto; display: flex; align-items: center; justify-content: center; padding: 48px 40px 40px; min-width: 0; min-height: 300px; }
#lb-body img { max-width: 80vw; max-height: 80vh; border-radius: 8px; }
#lb-body iframe { width: 75vw; height: 80vh; border: none; border-radius: 4px; }
.lb-placeholder { text-align: center; color: var(--muted); }
.lb-placeholder h4 { font-family: var(--font-d); font-size: 1.4rem; color: var(--dark); margin-bottom: 12px; }
.lb-placeholder p { font-size: .85rem; margin-bottom: 20px; }

/* ══════════════════════════════════════════════════
   IMPACTO / NÚMEROS
   ══════════════════════════════════════════════════ */
#impacto { padding: 120px 0; background: var(--dark); position: relative; overflow: hidden; }
#impacto::before {
  content: '';
  position: absolute; inset: 0; z-index: 0;
  background:
    radial-gradient(ellipse 60% 80% at 15% 50%, rgba(39,127,228,.18) 0%, transparent 60%),
    radial-gradient(ellipse 40% 60% at 85% 30%, rgba(13,77,150,.12) 0%, transparent 60%);
}
#imp-canvas { position: absolute; inset: 0; width: 100%; height: 100%; z-index: 0; opacity: .15; }
#impacto .container { position: relative; z-index: 1; }
#impacto .stag { color: #41be60; }
#impacto .stag::before { background: #41be60; }
#impacto .stitle { color: #fff; }
#impacto .stitle em { color: #7fc4ff; }

.ngrid { display: grid; grid-template-columns: repeat(4,1fr); gap: 0; margin-bottom: 80px; border: 1px solid rgba(255,255,255,.08); border-radius: 12px; overflow: hidden; }
.ni { padding: 40px 32px; border-right: 1px solid rgba(255,255,255,.08); transition: background .3s; }
.ni:last-child { border-right: none; }
.ni:hover { background: rgba(42,92,32,.15); }
.nv { font-family: var(--font-d); font-size: 3.5rem; font-weight: 700; color: #7fc4ff; line-height: 1; margin-bottom: 12px; }
.nb { height: 2px; background: rgba(255,255,255,.07); border-radius: 1px; margin-bottom: 12px; overflow: hidden; }
.nf { height: 100%; background: #277fe4; width: 0; border-radius: 1px; transition: width 1.5s var(--ease); }
.nl { font-size: .82rem; color: rgba(255,255,255,.45); line-height: 1.5; }

.impactometro { background: rgba(255,255,255,.04); border: 1px solid rgba(255,255,255,.08); border-radius: 16px; padding: 48px; }
.imp-hd { margin-bottom: 40px; }
.imp-hd h3 { font-family: var(--font-d); font-size: 2rem; font-weight: 700; color: #fff; margin-bottom: 8px; }
.imp-hd h3 em { font-style: italic; color: #7fc4ff; }
.imp-hd p { font-size: .85rem; color: rgba(255,255,255,.4); }
#imp-edit { color: #7fc4ff; font-size: .78rem; text-decoration: underline; cursor: pointer; background: none; border: none; font-family: var(--font-b); }
.imp-grid { display: grid; grid-template-columns: repeat(3,1fr); gap: 40px; }
.ii { display: flex; flex-direction: column; gap: 12px; }
.ii-ico { width: 40px; height: 40px; }
.ii-ico svg { width: 100%; height: 100%; }
.ii-v { font-family: var(--font-d); font-size: 2.8rem; font-weight: 700; color: #7fc4ff; line-height: 1; }
.ii-l { font-size: .78rem; color: rgba(255,255,255,.4); line-height: 1.5; }

#imp-ed { margin-top: 32px; padding-top: 32px; border-top: 1px solid rgba(255,255,255,.08); display: flex; flex-wrap: wrap; gap: 16px; align-items: flex-end; }
.ied-row { display: flex; flex-direction: column; gap: 6px; }
.ied-row label { font-family: var(--font-b); font-size: .65rem; letter-spacing: .1em; color: rgba(255,255,255,.4); text-transform: uppercase; font-weight: 600; }
.ied-row input { background: rgba(255,255,255,.07); border: 1px solid rgba(255,255,255,.1); border-radius: 6px; padding: 10px 14px; color: #fff; font-size: .9rem; width: 180px; transition: border-color .25s; }
.ied-row input:focus { outline: none; border-color: #86c874; }

/* ══════════════════════════════════════════════════
   MAPA
   ══════════════════════════════════════════════════ */
#mapa { padding: 120px 0; background: var(--bg); position: relative; overflow: hidden; }
.mgrid { display: grid; grid-template-columns: 1fr 1.4fr; gap: 60px; align-items: start; }
.minfo p { color: rgba(28,36,25,.65); font-size: .9rem; line-height: 1.8; margin-bottom: 32px; }
.addr-list { display: flex; flex-direction: column; gap: 16px; }
.ai { display: flex; align-items: flex-start; gap: 14px; }
.ad { width: 8px; height: 8px; border-radius: 50%; flex-shrink: 0; margin-top: 5px; }
.ad1 { background: var(--green); }
.ad2 { background: #5498e8; }
.ad3 { background: #277fe4; }
.ad4 { background: #a3c8f5; }
.ad5 { background: #41be60; }
.ad6 { background: #0d4d96; }
.ai strong { display: block; font-size: .88rem; color: var(--dark); margin-bottom: 2px; }
.ai small { font-size: .75rem; color: var(--muted); }
.membed { border-radius: 14px; overflow: hidden; border: 1px solid var(--border2); box-shadow: var(--shadow); }
.membed iframe { display: block; filter: grayscale(20%) contrast(105%) hue-rotate(40deg); border-radius: 14px; }

/* ══════════════════════════════════════════════════
   CONTATO
   ══════════════════════════════════════════════════ */
#contato { padding: 120px 0; background: var(--bg2); position: relative; overflow: hidden; }
.ct-bg { position: absolute; inset: 0; z-index: 0; }
.ct-orb { position: absolute; border-radius: 50%; filter: blur(100px); pointer-events: none; }
.ct-orb.o1 { width: 600px; height: 600px; background: radial-gradient(circle, rgba(39,127,228,.1) 0%, transparent 70%); left: -15%; top: -20%; }
.ct-orb.o2 { width: 400px; height: 400px; background: radial-gradient(circle, rgba(39,127,228,.07) 0%, transparent 70%); right: 5%; bottom: -10%; }
#contato .container { position: relative; z-index: 1; }
.ct-grid { display: grid; grid-template-columns: 1fr 1.2fr; gap: 80px; align-items: start; }
.channels { display: flex; flex-direction: column; gap: 12px; margin-top: 40px; }
.ch { display: flex; align-items: center; gap: 12px; font-size: .88rem; color: rgba(28,36,25,.6); padding: 12px 16px; border: 1px solid var(--border2); border-radius: 10px; transition: all .25s; background: var(--bg); box-shadow: 0 1px 6px rgba(28,36,25,.05); }
.ch svg { flex-shrink: 0; color: var(--green); }
.ch:hover { border-color: rgba(42,92,32,.3); color: var(--dark); box-shadow: var(--shadow); transform: translateX(4px); }

form { display: flex; flex-direction: column; gap: 16px; }
.fr { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; }
.fg { display: flex; flex-direction: column; gap: 8px; }
.fg label { font-family: var(--font-b); font-size: .65rem; letter-spacing: .12em; color: var(--muted); text-transform: uppercase; font-weight: 600; }
.fg input, .fg select, .fg textarea { background: var(--bg); border: 1.5px solid var(--border2); border-radius: 8px; color: var(--dark); font-size: .88rem; padding: 12px 16px; transition: border-color .25s, box-shadow .25s; }
.fg input::placeholder, .fg textarea::placeholder { color: rgba(107,120,96,.4); }
.fg input:focus, .fg select:focus, .fg textarea:focus { outline: none; border-color: var(--green); box-shadow: 0 0 0 3px rgba(42,92,32,.1); }
.fg select { cursor: pointer; }
.fg select option { background: var(--bg); }
.fg textarea { resize: vertical; min-height: 120px; }
.btn-sub { display: flex; align-items: center; justify-content: center; gap: 10px; background: var(--accent); color: #fff; font-weight: 600; font-size: .88rem; letter-spacing: .03em; padding: 15px 32px; border-radius: 8px; transition: background .25s, transform .25s var(--ease), box-shadow .25s; cursor: pointer; }
.btn-sub:hover { background: var(--accent-d); transform: translateY(-2px); box-shadow: 0 14px 30px rgba(65,190,96,.3); }

/* ══════════════════════════════════════════════════
   NOSSOS SERVIÇOS
   ══════════════════════════════════════════════════ */
#servicos { padding: 120px 0; background: var(--bg); overflow: hidden; }
.srv-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 2px; margin-top: 60px; }
.srv-card {
  background: var(--bg2); border: 1px solid var(--border2);
  padding: 40px 36px; position: relative; overflow: hidden;
  display: flex; flex-direction: column; gap: 14px;
  transition: border-color .3s, box-shadow .3s, background .3s;
}
.srv-card::before { content: ''; position: absolute; top: 0; left: 0; right: 0; height: 2px; background: linear-gradient(90deg, var(--green), var(--accent)); transform: scaleX(0); transform-origin: left; transition: transform .4s ease; }
.srv-card:hover::before { transform: scaleX(1); }
.srv-card:hover { border-color: rgba(39,127,228,.3); box-shadow: var(--shadow); background: var(--bg); }
.srv-icon { width: 44px; height: 44px; color: var(--green); }
.srv-icon svg { width: 100%; height: 100%; }
.srv-tag { font-size: .65rem; letter-spacing: .12em; text-transform: uppercase; color: var(--accent); font-weight: 600; font-family: var(--font-b); }
.srv-card h3 { font-family: var(--font-d); font-size: 1.35rem; font-weight: 600; color: var(--dark); line-height: 1.2; margin: 0; }
.srv-card p { font-size: .83rem; color: var(--muted); line-height: 1.75; flex: 1; margin: 0; }
.srv-bullets { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 4px; }
.srv-bullets span { font-size: .75rem; background: rgba(39,127,228,.08); color: var(--green); padding: 3px 10px; border-radius: 20px; font-family: var(--font-b); letter-spacing: .06em; }
.srv-cta {
  display: inline-block; margin-top: 8px;
  background: var(--accent); color: #fff; text-decoration: none;
  font-size: .8rem; font-weight: 600; font-family: var(--font-b);
  padding: 12px 22px; border-radius: 4px; text-align: center;
  transition: background .2s, transform .2s;
  letter-spacing: .04em;
}
.srv-cta:hover { background: #35a853; transform: translateY(-1px); }
.srv-cta-group { display: flex; gap: 8px; margin-top: 8px; flex-wrap: wrap; }
.srv-cta-group .srv-cta { flex: 1; margin-top: 0; min-width: 0; }
.srv-cta-wa { background: #0d1a2e !important; }
.srv-cta-wa:hover { background: #1a2f4a !important; }

/* ══════════════════════════════════════════════════
   PARCEIROS & DEPOIMENTOS
   ══════════════════════════════════════════════════ */
#parceiros { padding: 120px 0; background: var(--dark); overflow: hidden; }
#parceiros .sec-head .stag { color: rgba(255,255,255,.4); }
#parceiros .stitle { color: #fff; }
#parceiros .stitle em { color: var(--accent); }
#parceiros .ssub { color: rgba(255,255,255,.45); }
.parceiros-logos {
  display: flex; flex-wrap: wrap; justify-content: center; align-items: center;
  gap: 32px; margin: 56px 0 72px;
}
.parc-logo { height: 40px; opacity: .55; filter: brightness(0) invert(1); transition: opacity .3s, filter .3s; }
.parc-logo:hover { opacity: 1; filter: brightness(0) invert(1) drop-shadow(0 0 8px rgba(255,255,255,.3)); }
.parc-logo-empty, .dep-empty { text-align: center; color: rgba(255,255,255,.3); font-size: .85rem; padding: 40px; width: 100%; }
.depoimentos-wrap { display: grid; grid-template-columns: repeat(3,1fr); gap: 24px; margin-top: 8px; }
.dep-card {
  background: rgba(255,255,255,.04); border: 1px solid rgba(255,255,255,.08);
  border-radius: 8px; padding: 32px; position: relative;
}
.dep-card::before { content: '"'; font-family: var(--font-d); font-size: 5rem; line-height: 1; color: var(--accent); opacity: .25; position: absolute; top: 12px; left: 24px; }
.dep-text { font-size: .87rem; color: rgba(255,255,255,.65); line-height: 1.75; margin-bottom: 20px; position: relative; z-index: 1; }
.dep-author { font-size: .75rem; font-family: var(--font-b); color: var(--accent); letter-spacing: .06em; }
.dep-company { font-size: .72rem; color: rgba(255,255,255,.35); margin-top: 2px; }

/* ══════════════════════════════════════════════════
   EVENTOS & GALERIA
   ══════════════════════════════════════════════════ */
#eventos { padding: 120px 0; background: var(--bg2); overflow: hidden; }
/* A linha de contadores de eventos saiu na revisao do cliente; sobrou
   o link do perfil, que e caminho e nao numero. */
.ev-insta-row {
  display: flex; justify-content: center;
  border: 1px solid var(--border2); border-radius: 14px;
  padding: 20px; margin: 56px 0;
}
.ev-cnt {
  flex: 1; min-width: 160px; padding: 36px 28px;
  border-right: 1px solid var(--border2); text-align: center;
}
.ev-cnt:last-child { border-right: none; }
.ev-cnt-v { font-family: var(--font-d); font-size: 2.8rem; font-weight: 700; color: var(--green); line-height: 1; }
.ev-cnt-l { font-size: .75rem; color: var(--muted); margin-top: 8px; line-height: 1.5; font-family: var(--font-b); letter-spacing: .04em; }
.ev-cnt-sub { font-size: .65rem; color: var(--accent); margin-top: 4px; font-family: var(--font-b); }
.ev-insta-btn {
  display: flex; flex-direction: column; align-items: center; gap: 8px;
  color: var(--green); text-decoration: none; font-family: var(--font-b);
  font-size: .78rem; transition: color .2s;
}
.ev-insta-btn:hover { color: var(--accent); }
.ev-ig-widget {
  margin: 0 0 56px; border-radius: 12px; overflow: hidden;
}
.ev-ig-widget iframe { display: block; }

/* ─── INSTAGRAM CARDS ───────────────────────────── */
.ev-ig-header {
  display: flex; align-items: center; gap: 10px;
  margin-bottom: 24px;
  font-family: var(--font-b); font-size: .78rem; font-weight: 600;
  color: var(--muted);
}
.ev-ig-handle {
  color: var(--green);
  transition: color .2s;
}
.ev-ig-handle:hover { color: var(--green-d); }

.ev-ig-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 16px;
  margin-bottom: 56px;
}
/* 1 post: centraliza com largura máxima */
.ev-ig-grid:has(.ig-embed-wrap:only-child) {
  grid-template-columns: minmax(0, 540px);
  justify-content: center;
}
/* Card clicável */
.ig-card {
  display: block; text-decoration: none;
  border-radius: 12px; overflow: hidden;
  background: var(--bg2);
  border: 1px solid var(--border2);
  transition: transform .28s var(--ease), box-shadow .28s var(--ease);
}
.ig-card:hover { transform: translateX(4px); box-shadow: -4px 8px 28px rgba(13,26,46,.14); }

.ig-card-img {
  position: relative;
  aspect-ratio: 1 / 1;
  overflow: hidden;
  background: var(--dark);
}
.ig-card-img img {
  width: 100%; height: 100%;
  object-fit: cover;
  transition: transform .4s var(--ease);
}
.ig-card:hover .ig-card-img img { transform: scale(1.05); }

.ig-card-placeholder {
  width: 100%; height: 100%;
  display: flex; align-items: center; justify-content: center;
  flex-direction: column; gap: 8px;
  color: rgba(255,255,255,.2);
  background: linear-gradient(135deg, #0d1a2e, #162240);
}
.ig-reel-badge {
  font-family: var(--font-b); font-size: .6rem; font-weight: 700;
  letter-spacing: .12em; text-transform: uppercase;
  color: rgba(255,255,255,.5);
  border: 1px solid rgba(255,255,255,.15);
  padding: 3px 8px; border-radius: 4px;
}

.ig-card-overlay {
  position: absolute; inset: 0;
  background: rgba(13,26,46,.6);
  display: flex; flex-direction: column;
  align-items: center; justify-content: center; gap: 8px;
  opacity: 0; transition: opacity .25s;
  color: #fff; font-family: var(--font-b);
  font-size: .78rem; font-weight: 600;
}
.ig-card:hover .ig-card-overlay { opacity: 1; }

.ig-card-caption {
  padding: 10px 14px;
  font-size: .78rem; color: var(--muted); line-height: 1.5;
  display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical;
  overflow: hidden;
}
.ev-ig-empty {
  grid-column: 1/-1; text-align: center;
  padding: 60px; color: var(--muted);
}
.ev-ig-empty svg { color: var(--border2); display: block; margin: 0 auto 16px; }
.ev-ig-empty p { font-size: .85rem; line-height: 1.6; }

@media (max-width: 768px) {
  .ev-ig-grid { grid-template-columns: 1fr; gap: 12px; }
  .ig-embed-wrap { min-height: 0; }
}
@media (max-width: 480px) {
  .ev-ig-grid { grid-template-columns: 1fr; }
}

/* ══════════════════════════════════════════════════
   FOOTER
   ══════════════════════════════════════════════════ */
footer { background: var(--dark); border-top: 1px solid rgba(255,255,255,.06); padding: 72px 0 0; }
.fg-grid { display: grid; grid-template-columns: 2fr 1fr 1fr 1.2fr; gap: 48px; margin-bottom: 60px; }
.fb-brand .nav-logo { margin-bottom: 14px; font-size: 1.15rem; gap: 12px; }
.fb-brand .nav-logo span { color: #fff; }
.fb-brand p { font-size: .82rem; color: rgba(255,255,255,.4); line-height: 1.7; max-width: 260px; margin-bottom: 20px; }
.f-soc { display: flex; gap: 12px; }
.f-soc a { color: rgba(255,255,255,.35); border: 1px solid rgba(255,255,255,.1); width: 34px; height: 34px; border-radius: 6px; display: flex; align-items: center; justify-content: center; transition: all .25s; }
.f-soc a:hover { color: #7fc4ff; border-color: rgba(127,196,255,.4); }
footer h5 { font-family: var(--font-b); font-size: .65rem; letter-spacing: .15em; color: rgba(255,255,255,.3); text-transform: uppercase; margin-bottom: 18px; font-weight: 600; }
footer ul li { font-size: .82rem; color: rgba(255,255,255,.35); line-height: 1.9; }
footer ul li a { color: rgba(255,255,255,.35); transition: color .2s; }
footer ul li a:hover { color: #7fc4ff; }
.f-bot { border-top: 1px solid rgba(255,255,255,.06); padding: 20px 0; display: flex; justify-content: space-between; font-family: var(--font-b); font-size: .62rem; letter-spacing: .08em; color: rgba(255,255,255,.2); }

/* ══════════════════════════════════════════════════
   TOAST & MODALS
   ══════════════════════════════════════════════════ */
#toast { position: fixed; bottom: 28px; left: 50%; transform: translateX(-50%) translateY(80px); background: var(--dark); border: 1px solid rgba(42,92,32,.4); color: #fff; font-size: .84rem; padding: 12px 24px; border-radius: 8px; backdrop-filter: blur(16px); z-index: 5000; transition: transform .4s var(--ease), opacity .4s; opacity: 0; pointer-events: none; }
#toast.show { transform: translateX(-50%) translateY(0); opacity: 1; }

#pwd-modal { position: fixed; inset: 0; z-index: 3000; display: flex; align-items: center; justify-content: center; background: rgba(28,36,25,.6); backdrop-filter: blur(16px); }
.pwd-box { background: var(--bg); border: 1px solid var(--border2); border-radius: 14px; padding: 36px; max-width: 360px; width: 100%; animation: lbIn .3s var(--ease); box-shadow: var(--shadow-lg); }
.pwd-box h4 { font-family: var(--font-d); font-size: 1.5rem; margin-bottom: 20px; color: var(--dark); }
#pwd-in { width: 100%; background: var(--bg2); border: 1.5px solid var(--border2); border-radius: 6px; padding: 12px 16px; color: var(--dark); font-size: .9rem; margin-bottom: 16px; transition: border-color .25s; }
#pwd-in:focus { outline: none; border-color: var(--green); box-shadow: 0 0 0 3px rgba(42,92,32,.1); }
.pwd-actions { display: flex; gap: 10px; justify-content: flex-end; }
#pwd-cancel { font-size: .83rem; color: var(--muted); padding: 10px 18px; border: 1px solid var(--border2); border-radius: 6px; transition: all .2s; cursor: pointer; }
#pwd-cancel:hover { color: var(--dark); border-color: rgba(28,36,25,.25); }

/* ══════════════════════════════════════════════════
   EMPRESAS — 6 EMPRESAS DO GRUPO
   ══════════════════════════════════════════════════ */
#empresas { padding: 120px 0; background: var(--bg); position: relative; overflow: hidden; }
#empresas .container { position: relative; z-index: 1; }
.emp-mesh {
  position: absolute; inset: 0;
  background-image:
    radial-gradient(circle at 10% 30%, rgba(39,127,228,.07) 0%, transparent 50%),
    radial-gradient(circle at 90% 70%, rgba(13,77,150,.05) 0%, transparent 50%);
}

/* Tab navigation */
.emp-tabs { display: flex; gap: 0; margin-bottom: 48px; border: 1px solid var(--border2); border-radius: 12px; overflow: hidden; overflow-x: auto; background: var(--bg2); flex-wrap: nowrap; scrollbar-width: none; }
.emp-tabs::-webkit-scrollbar { display: none; }
.emp-tab {
  flex: 1; min-width: 130px; padding: 14px 16px; font-family: var(--font-b);
  font-size: .72rem; font-weight: 600; letter-spacing: .06em;
  color: var(--muted); background: transparent; border: none;
  cursor: pointer; transition: all .25s; text-align: center;
  border-right: 1px solid var(--border2); white-space: nowrap;
}
.emp-tab:last-child { border-right: none; }
.emp-tab:hover { color: var(--green); background: rgba(39,127,228,.05); }
.emp-tab.active { color: #fff; background: var(--green); }

/* Panel */
.emp-panels { position: relative; }
.emp-panel { display: none; animation: panelIn .4s var(--ease); }
.emp-panel.active { display: block; }
@keyframes panelIn { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: none; } }

.emp-grid { display: grid; grid-template-columns: 1fr 1.5fr; gap: 60px; align-items: start; }

.emp-l { position: sticky; top: 90px; }
.emp-badge { display: inline-flex; align-items: center; gap: 8px; font-size: .62rem; font-weight: 700; letter-spacing: .15em; text-transform: uppercase; color: #fff; background: var(--green); padding: 5px 14px; border-radius: 20px; margin-bottom: 20px; }
.emp-l h3 { font-family: var(--font-d); font-size: clamp(2rem, 4vw, 3rem); font-weight: 700; line-height: 1.05; color: var(--dark); margin-bottom: 20px; }
.emp-l h3 em { font-style: italic; color: var(--green); }
.emp-l > p { color: var(--muted); font-size: .92rem; line-height: 1.8; margin-bottom: 32px; }

.emp-nums { display: grid; grid-template-columns: 1fr 1fr; gap: 20px; margin-bottom: 32px; }
.en { background: var(--bg2); border: 1px solid var(--border2); border-radius: 12px; padding: 20px; }
.en-v { font-family: var(--font-d); font-size: 2.2rem; font-weight: 700; color: var(--green); line-height: 1; margin-bottom: 6px; }
.en-l { font-size: .72rem; color: var(--muted); line-height: 1.4; }

.emp-r { display: flex; flex-direction: column; gap: 28px; }

.emp-block { background: var(--bg2); border: 1px solid var(--border2); border-radius: 14px; padding: 28px; transition: border-color .3s, box-shadow .3s; }
.emp-block:hover { border-color: rgba(39,127,228,.3); box-shadow: var(--shadow); }
.emp-block-head { display: flex; align-items: center; gap: 12px; margin-bottom: 18px; }
.emp-block-ico { width: 40px; height: 40px; background: var(--green-p); border-radius: 10px; display: flex; align-items: center; justify-content: center; color: var(--green); flex-shrink: 0; }
.emp-block-ico svg { width: 22px; height: 22px; }
.emp-block h4 { font-family: var(--font-d); font-size: 1.15rem; font-weight: 700; color: var(--dark); }
.emp-block ul { display: flex; flex-direction: column; gap: 10px; }
.emp-block ul li { font-size: .84rem; color: rgba(13,26,46,.65); padding-left: 20px; position: relative; line-height: 1.5; }
.emp-block ul li::before {
  content: ''; position: absolute; left: 0; top: 8px;
  width: 6px; height: 6px; border-radius: 50%;
  background: var(--accent); opacity: .7;
}

.tech-tags { display: flex; flex-wrap: wrap; gap: 8px; }
.tech-tag { font-size: .65rem; font-weight: 600; letter-spacing: .06em; color: var(--green); border: 1px solid rgba(39,127,228,.25); background: var(--green-p); padding: 5px 14px; border-radius: 20px; transition: all .2s; }
.tech-tag:hover { background: var(--green); color: #fff; }

/* ══════════════════════════════════════════════════
   VÍDEO EM DESTAQUE
   ══════════════════════════════════════════════════ */
#video-destaque { padding: 100px 0; background: var(--dark); position: relative; overflow: hidden; }
#video-destaque::before {
  content: '';
  position: absolute; inset: 0; z-index: 0;
  background:
    radial-gradient(ellipse 70% 80% at 50% 50%, rgba(39,127,228,.15) 0%, transparent 65%);
}
#video-destaque .container { position: relative; z-index: 1; }
#video-destaque .sec-head { text-align: center; }
#video-destaque .sec-head .ssub { margin: 0 auto; }
#video-destaque .stag { color: #7fc4ff; }
#video-destaque .stag::before { background: #7fc4ff; }
#video-destaque .stitle { color: #fff; }
#video-destaque .stitle em { color: #7fc4ff; }

.video-wrap {
  position: relative; border-radius: 20px; overflow: hidden;
  box-shadow: 0 32px 80px rgba(0,0,0,.5), 0 0 0 1px rgba(39,127,228,.3);
  background: #000; max-width: 960px; margin: 0 auto;
}
.video-wrap::before {
  content: '';
  position: absolute; inset: -2px;
  background: linear-gradient(135deg, rgba(39,127,228,.5), rgba(13,77,150,.3), rgba(65,190,96,.2));
  border-radius: 22px; z-index: -1;
  animation: borderGlow 4s ease-in-out infinite;
}
@keyframes borderGlow {
  0%,100% { opacity: .6; }
  50% { opacity: 1; }
}
.video-wrap iframe {
  width: 100%; aspect-ratio: 16/9;
  display: block; border: none;
}
.video-fallback {
  text-align: center; padding: 12px 0 4px;
}
.video-fallback p { font-size: .8rem; color: rgba(255,255,255,.35); }
.video-fallback a { color: #7fc4ff; text-decoration: underline; transition: color .2s; }
.video-fallback a:hover { color: #fff; }

/* ══════════════════════════════════════════════════
   MOBILE — MELHORIAS
   ══════════════════════════════════════════════════ */
/* ══════════════════════════════════════════════════
   RESPONSIVE
   ══════════════════════════════════════════════════ */
@media (max-width: 1024px) {
  .container { padding: 0 32px; }
  .sobre-grid { grid-template-columns: 1fr; gap: 48px; }
  .sobre-grid .sl  { order: 1; }
  .sobre-grid .sobre-impacto-row { order: 2; grid-column: 1; margin-top: 8px; }
  .sobre-grid .sr  { order: 3; }
  .tgrid { grid-template-columns: repeat(2,1fr); }
  .ngrid { grid-template-columns: repeat(2,1fr); }
  #cgrid { grid-template-columns: repeat(2,1fr); }
  .fg-grid { grid-template-columns: 1fr 1fr; }
  .mgrid { grid-template-columns: 1fr; }
  .ct-grid { grid-template-columns: 1fr; gap: 48px; }
  .imp-grid { grid-template-columns: 1fr 1fr; }
  .emp-grid { grid-template-columns: 1fr; gap: 40px; }
  .emp-l { position: static; }
  /* Soluções: ajuste tablet */
  .sp-vis { width: 280px; height: 380px; margin-right: 4%; }
  .sp-txt::before { left: calc(10% - 16px); }
  .sp h3 { font-size: clamp(1.8rem, 3.2vw, 2.6rem); }
  .sp-txt { width: 52%; }
  .sp-num-bg { font-size: 16rem; }
  /* Novas seções tablet */
  .srv-grid { grid-template-columns: repeat(2, 1fr); }
  .depoimentos-wrap { grid-template-columns: 1fr 1fr; }
}
@media (max-width: 768px) {
  .container { padding: 0 20px; }
  #nav { padding: 0 20px; backdrop-filter: none; -webkit-backdrop-filter: none; background: var(--bg); }
  .nav-links { display: none; position: fixed; top: 70px; left: 0; right: 0; bottom: 0; background: var(--bg); flex-direction: column; align-items: stretch; justify-content: flex-start; gap: 0; z-index: 895; overflow-y: auto; }
  .nav-links.open { display: flex; animation: mnuIn .22s ease; }
  .nav-links li { border-bottom: 1px solid var(--border2); }
  .nav-links li:last-child { border-bottom: none; padding-bottom: 24px; }
  .nav-links a { display: block; font-size: 1rem; font-weight: 500; color: var(--dark); padding: 17px 28px; letter-spacing: .01em; }
  .nav-links a::after { display: none; }
  #nav-burger { display: flex; }
  .nav-desktop { display: none; }
  .sobre-certs { gap: 20px; margin-top: 32px; }
  .hero-cert-img { height: 160px; }
  #hero { height: auto; min-height: 100svh; padding: 100px 0 80px; }
  .hero-content { padding: 0 20px; }
  #hero h1 { font-size: 3rem; }
  .hero-wm { display: none; }
  .hero-scroll { left: 20px; }
  /* ── Grupo mobile ── */
  .grupo-wrap { flex-direction: column; gap: 12px; }
  .grupo-sidebar { width: 100%; position: static; }
  .gs-tabs { flex-direction: row; overflow-x: auto; scrollbar-width: none; gap: 6px; padding-bottom: 2px; }
  .gs-tabs::-webkit-scrollbar { display: none; }
  .gs-tab { flex-direction: column; align-items: flex-start; min-width: 96px; max-width: 130px; padding: 9px 11px; gap: 2px; flex-shrink: 0; width: auto; white-space: normal; }
  .gs-tab::before { display: none; }
  .gs-tab-name { white-space: normal; font-size: .72rem; }
  .gs-tab-arr { display: none; }
  /* Fix: on mobile panels are NOT absolutely stacked — use display:none/flex to let height be natural */
  .grupo-panels { min-height: 0; overflow: visible; border-radius: 16px; }
  .grupo-panel { position: relative; inset: auto; display: none; opacity: 1 !important; transform: none !important; transition: none !important; border-radius: 16px; box-shadow: 0 8px 32px rgba(13,26,46,.18); }
  .grupo-panel.active { display: flex !important; flex-direction: column; }
  .grupo-panel.gp-exit { display: none; }
  .gp-photo { width: 100%; height: 200px; flex-shrink: 0; }
  .gp-content { flex: 1; padding: 26px 22px; gap: 12px; justify-content: flex-start; overflow: hidden; }
  .gp-content::before { font-size: 5.5rem; right: 16px; bottom: -10px; }
  .gp-title { font-size: 1.6rem; }
  .gp-desc { max-width: none; font-size: .85rem; line-height: 1.65; }
  #solucoes { height: 100vh; height: 100svh; }
  #sol-sticky { position: relative; height: 100%; overflow: hidden; }
  #sol-track { flex-direction: row; width: 500%; transition: transform .7s cubic-bezier(.16,1,.3,1); }
  .sp { width: 20%; height: 100%; flex-direction: column; justify-content: center; align-items: flex-start; padding: 80px 24px 72px; gap: 18px; overflow: hidden; }
  .sp-txt { width: 100%; padding-left: 0; gap: 14px; }
  .sp h3 { font-size: clamp(1.6rem, 6vw, 2.2rem); }
  .sp p { font-size: .82rem; line-height: 1.65; }
  .sp ul { display: none; }
  .sp-vis { position: relative; right: auto; top: auto; bottom: auto; transform: none; width: 220px; height: 300px; padding: 0; margin: 0 auto; flex-shrink: 0; }
  .sp-num-bg { font-size: 10rem; right: 50%; transform: translateX(50%); bottom: -0.05em; opacity: .6; }
  .sp-frame { display: none; }
  .sp-txt::before { display: none; }
  #sol-dots { display: flex; }
  .tgrid { grid-template-columns: 1fr; }
  .ngrid { grid-template-columns: 1fr 1fr; }
  .imp-grid { grid-template-columns: 1fr; gap: 24px; }
  #cgrid { grid-template-columns: 1fr; }
  .fr { grid-template-columns: 1fr; }
  .fg-grid { grid-template-columns: 1fr; }
  .f-bot { flex-direction: column; gap: 8px; }
  .impactometro { padding: 24px; }
  #imp-ed { flex-direction: column; }
  /* Empresas mobile */
  .emp-tabs { gap: 0; flex-wrap: nowrap; overflow-x: auto; }
  .emp-tab { min-width: 120px; font-size: .65rem; padding: 12px 10px; }
  .emp-grid { grid-template-columns: 1fr; gap: 32px; }
  .emp-l { position: static; }
  .emp-nums { grid-template-columns: 1fr 1fr; gap: 12px; }
  .en-v { font-size: 1.6rem; }
  .emp-block { padding: 20px; }
  /* Video mobile */
  .video-wrap { border-radius: 12px; }
  /* Sobre mobile */
  .sobre-grid { gap: 36px; }
  /* Contato mobile */
  .ch { font-size: .82rem; }
  /* Mapa mobile */
  .membed iframe { height: 280px; }
  /* Section padding */
  #empresas { padding: 80px 0; }
  #video-destaque { padding: 72px 0; }
  #sobre, #grupo, #tecnologias, #ambiental, #impacto, #mapa, #contato { padding: 80px 0; }
  /* Sobre pills wrap */
  .pills { gap: 6px; }
  /* Sobre — mobile grid: sl(order:1) → impacto(order:2) → sr(order:3) */
  .sobre-grid { grid-template-columns: 1fr; gap: 36px; }
  .sobre-grid .sl  { order: 1; }
  .sobre-grid .sobre-impacto-row { order: 2; grid-column: 1; margin-top: 8px; }
  .sobre-grid .sr  { order: 3; }
  .pills span { font-size: .6rem; padding: 4px 10px; }
  .nav-links a.nav-cta { border: 1.5px solid rgba(39,127,228,.35); border-radius: 8px; text-align: center; color: var(--green); padding: 14px 28px; background: rgba(39,127,228,.04); margin: 16px 20px 0; display: block; }
  /* Novas seções mobile */
  .srv-grid { grid-template-columns: 1fr; }
  .srv-card { padding: 32px 24px; }
  .depoimentos-wrap { grid-template-columns: 1fr; }
  .ev-insta-row { padding: 16px; }
  .ev-cnt { border-right: none; border-bottom: 1px solid var(--border2); }
  .ev-cnt:last-child { border-bottom: none; }
  .parceiros-logos { gap: 24px; }
  .parc-logo { height: 30px; }
}
@media (max-width: 480px) {
  #hero h1 { font-size: 2.4rem; }
  .stitle { font-size: 1.9rem; }
  .nv { font-size: 2.2rem; }
  .emp-nums { grid-template-columns: 1fr; }
  /* Lightbox padding mobile */
  #lb-body { padding: 24px 16px; }
  #lb-body img { max-width: 96vw; max-height: 75vh; }
  #lb-body iframe { width: 94vw; height: 56vw; }
  /* Logos bar gap reduzido */
  .lb-track { gap: 36px; }
  .emp-tab { min-width: 100px; font-size: .6rem; padding: 10px 8px; }
  .ngrid { grid-template-columns: 1fr; }
  .hero-btns { flex-direction: column; align-items: flex-start; }
  .hero-btns .btn-p, .hero-btns .btn-g { width: 100%; justify-content: center; }
  /* Grupo small screen */
  .gp-photo { height: 160px; }
  .gp-content { padding: 22px 18px; gap: 10px; }
  .gp-content::before { font-size: 4rem; }
  .gp-title { font-size: 1.4rem; }
  .gs-tab { min-width: 84px; padding: 8px 10px; }
  .gs-tab-num { font-size: .62rem; }
  .gs-tab-name { font-size: .66rem; }
}

/* ── Mobile menu animation ─────────────────── */
@keyframes mnuIn { from { opacity: 0; } to { opacity: 1; } }

/* ── Touch: disable sticky hover states ─────────── */
@media (hover: none) {
  .cc:not(.is-touching):hover { transform: none; border-color: var(--border2); box-shadow: 0 2px 16px rgba(13,26,46,.12); }
  .ccard:hover, .mh-equiv-card:hover { transform: none; }
  .cc:not(.is-touching):hover .cc-photo { transform: none; }
  .cc:not(.is-touching):hover .cc-overlay { background: linear-gradient(to top, rgba(8,53,114,.92) 0%, rgba(8,53,114,.55) 50%, rgba(8,53,114,.18) 100%); }
  /* Grupo sidebar tabs */
  .gs-tab:hover:not(.active) { background: var(--bg); border-color: var(--border2); }
  .cc-saiba:hover { background: var(--accent); transform: none; }
}

/* ── Progress bar for soluções ─────────────── */
.sol-progress-bar {
  position: absolute; bottom: 0; left: 0;
  width: 100%; height: 2px;
  background: rgba(42,92,32,.1);
  z-index: 10;
}
.sol-progress-fill {
  height: 100%; background: var(--green);
  width: 0%; will-change: width;
  opacity: .7;
}

/* ══════════════════════════════════════════════════
   SECTION BACKGROUND PHOTOS
   ══════════════════════════════════════════════════ */
.has-photo {
  background-size: cover !important;
  background-position: center !important;
  background-attachment: fixed !important;
  position: relative;
}
.photo-bg-overlay {
  position: absolute; inset: 0;
  background: rgba(4, 10, 26, 0.58);
  z-index: 1; pointer-events: none;
}
/* Hero: overlay mais leve — vídeo deve aparecer */
#hero .photo-bg-overlay,
#hero .hero-video-overlay { background: rgba(4, 10, 26, 0.10); }
@media (max-width: 768px) {
  #hero .hero-video-overlay { background: rgba(5,14,31,.55); }
}
.has-photo > .container,
.has-photo > canvas,
.has-photo > .amb-grad,
.has-photo > .parallax-layer { position: relative; z-index: 2; }
.has-photo .stag { color: #7fc4ff !important; }
.has-photo .stag::before { background: #7fc4ff !important; }
.has-photo .stitle { color: #fff !important; }
.has-photo .stitle em { color: #7fc4ff !important; }
.has-photo .ssub { color: rgba(255,255,255,.72) !important; }

/* ── Boxes internos legíveis sobre foto ── */
.has-photo .ngrid {
  background: rgba(255,255,255,.06);
  border-color: rgba(255,255,255,.18) !important;
  backdrop-filter: blur(10px);
}
.has-photo .ni { border-right-color: rgba(255,255,255,.15) !important; }
.has-photo .ni:hover { background: rgba(255,255,255,.08) !important; }
.has-photo .impactometro {
  background: rgba(255,255,255,.07) !important;
  border-color: rgba(255,255,255,.18) !important;
  backdrop-filter: blur(10px);
}
/* Seções claras (sobre, grupo, etc.) com foto — caixas com fundo escuro semi-trans */
.has-photo .sobre-grid,
.has-photo .tgrid .tc,
.has-photo .emp-block,
.has-photo .en,
.has-photo .ccard { background: rgba(4,10,26,.55) !important; border-color: rgba(255,255,255,.14) !important; backdrop-filter: blur(8px); }
.has-photo .txt p,
.has-photo .tc p,
.has-photo .tc h4,
.has-photo .emp-block h4,
.has-photo .emp-block ul li,
.has-photo .en-l { color: rgba(255,255,255,.75) !important; }
.has-photo .sii-v { color: rgba(255,255,255,.9) !important; }
.has-photo .sii-l { color: rgba(255,255,255,.7) !important; }

@media (max-width: 768px) { .has-photo { background-attachment: scroll !important; } }

/* ─── Mobile: drawer ocupa largura total em telas pequenas ─── */
@media (max-width: 420px) {
  .nd-panel { width: 100%; }
  .nd-toggle { font-size: .9rem; padding: 14px 20px; }
  .nd-link { padding: 12px 20px 12px 28px; font-size: .85rem; }
  .nd-foot { padding: 16px 20px; }
  /* Nav mobile: logo menor */
  #site-logo-img { height: 30px !important; }
  /* Contact button compacto */
  .nav-contact-btn { padding: 7px 12px; font-size: .78rem; }
  /* Hero scroll hint oculto */
  .hero-scroll { display: none; }
}

/* ─── Acessibilidade: touch targets mínimos 44px ─── */
.nd-toggle, .nd-link, .nd-cta, .nd-close-btn,
.nav-contact-btn, #nav-burger { min-height: 44px; }

/* ══════════════════════════════════════════════════
   MODAL SYSTEM
   ══════════════════════════════════════════════════ */
.modal-overlay { display: none; }
.modal-overlay:not([hidden]) {
  display: flex;
  position: fixed; inset: 0; z-index: 2000;
  background: rgba(8,18,40,.72);
  backdrop-filter: blur(12px);
  align-items: stretch; justify-content: center;
}
body.modal-open { overflow: hidden; }

.modal-box {
  position: relative;
  width: 100vw; height: 100vh;
  background: var(--bg);
  overflow-y: auto;
  animation: modalIn .35s var(--ease) both;
}
@keyframes modalIn {
  from { transform: translateY(32px); opacity: 0; }
  to   { transform: none; opacity: 1; }
}

.modal-close {
  position: fixed; top: 20px; right: 24px; z-index: 10;
  width: 48px; height: 48px; border-radius: 50%;
  background: rgba(13,26,46,.82);
  border: 2px solid rgba(255,255,255,.22);
  color: #fff; font-size: 1.2rem; font-weight: 700;
  display: flex; align-items: center; justify-content: center;
  cursor: pointer; transition: background .2s, transform .2s, border-color .2s;
  box-shadow: 0 4px 16px rgba(0,0,0,.4);
  backdrop-filter: blur(8px);
}
.modal-close:hover { background: #dc2626; border-color: rgba(220,38,38,.5); transform: rotate(90deg); }

/* ─── Contact Modal ─── */
.modal-contato-box {
  display: flex; align-items: stretch;
}
.modal-contato-inner {
  width: 100%; padding: 80px 0;
  position: relative; overflow: hidden;
}
@media (max-width: 768px) {
  .modal-contato-box { display: block; height: auto; min-height: 100vh; }
  .modal-contato-inner { overflow: visible; padding: 72px 0 48px; }
  .ct-grid { gap: 36px; }
  .fr { grid-template-columns: 1fr; }
}
.modal-contato-inner .ct-bg { position: absolute; inset: 0; }

/* ─── Company Modals ─── */
.modal-emp-box {
  background: var(--bg);
  display: flex; flex-direction: column;
}
.memp-header {
  padding: 80px 60px 60px;
  color: #fff; position: relative;
  overflow: hidden;
  background-size: cover !important;
  background-position: center !important;
}
/* Overlay escuro quando há foto de fundo no modal */
.memp-header.has-photo::before {
  content: '';
  position: absolute; inset: 0;
  background: linear-gradient(135deg, rgba(13,26,46,.78) 0%, rgba(10,20,40,.65) 100%);
  z-index: 0;
}
.memp-header.has-photo > * { position: relative; z-index: 1; }
.memp-header::after {
  content: '';
  position: absolute; right: -60px; top: -60px;
  width: 300px; height: 300px; border-radius: 50%;
  background: rgba(255,255,255,.04);
}
.memp-num {
  font-family: var(--font-d);
  font-size: 6rem; font-weight: 700; line-height: 1;
  opacity: .12; position: absolute; right: 60px; top: 40px;
  letter-spacing: -.02em;
}
.memp-tag {
  display: inline-flex; align-items: center; gap: 8px;
  font-size: .7rem; font-weight: 600; letter-spacing: .2em;
  text-transform: uppercase; color: rgba(255,255,255,.6);
  margin-bottom: 16px;
}
.memp-tag::before {
  content: ''; display: inline-block;
  width: 20px; height: 1.5px;
  background: var(--green); border-radius: 1px;
}
.memp-title {
  font-family: var(--font-d);
  font-size: clamp(2.4rem, 5vw, 4rem);
  font-weight: 700; line-height: 1.05;
  color: #fff; margin-bottom: 16px;
}
.memp-title em { font-style: italic; color: #7fc4ff; }
.memp-sub { color: rgba(255,255,255,.65); font-size: 1.05rem; max-width: 560px; }

.memp-body { padding: 60px; flex: 1; }
.memp-grid { display: grid; grid-template-columns: 240px 1fr; gap: 48px; }

.memp-nums { display: flex; flex-direction: column; gap: 24px; }
.memp-n {
  padding: 20px; border-radius: 12px;
  background: #fff; border: 1px solid var(--border);
  box-shadow: var(--shadow);
}
.memp-nv {
  font-family: var(--font-d); font-size: 1.8rem; font-weight: 700;
  color: var(--green); line-height: 1; margin-bottom: 6px;
}
.memp-nl { font-size: .78rem; color: var(--muted); line-height: 1.4; }

.memp-content h4 {
  font-family: var(--font-d); font-size: 1.4rem; font-weight: 700;
  color: var(--dark); margin-bottom: 20px;
}
.memp-content ul { display: flex; flex-direction: column; gap: 12px; margin-bottom: 32px; }
.memp-content ul li {
  padding: 14px 18px; border-radius: 8px;
  background: #fff; border: 1px solid var(--border2);
  font-size: .92rem; color: var(--dark);
  display: flex; align-items: center; gap: 12px;
}
.memp-content ul li::before {
  content: ''; width: 6px; height: 6px; border-radius: 50%;
  background: var(--green); flex-shrink: 0;
}
.memp-tags { display: flex; flex-wrap: wrap; gap: 8px; }
.memp-tags span {
  padding: 6px 14px; border-radius: 20px;
  background: var(--green-p);
  border: 1px solid rgba(39,127,228,.2);
  font-size: .78rem; font-weight: 600;
  color: var(--green); letter-spacing: .02em;
}

/* Nav Contact — estilos movidos para o bloco #nav acima */
.nav-contact-item { position: relative; }
.ncd-form { width: 100%; }


@media (max-width: 768px) {
  .memp-header { padding: 80px 24px 40px; }
  .memp-body { padding: 32px 24px; }
  .memp-grid { grid-template-columns: 1fr; gap: 28px; }
  .memp-nums { flex-direction: row; flex-wrap: wrap; }
  .memp-n { flex: 1; min-width: 120px; }
}

/* ─────────────────────────────────────────
   FEATURES 6-12 ADDITIONS
───────────────────────────────────────── */

/* ─── Sobre Impacto (feature 11) ─── */
.sobre-impacto { margin-top: 64px; }

/* Compact impactômetro row inside Sobre */
.sobre-impacto-row {
  display: flex; flex-wrap: nowrap; gap: 0;
  margin-top: 48px;
  border-top: 1px solid var(--border2);
  border-bottom: 1px solid var(--border2);
}
.sii {
  flex: 1; padding: 22px 20px;
  border-right: 1px solid var(--border2);
  display: flex; flex-direction: column; gap: 5px;
}
.sii:last-child { border-right: none; }
/* [hidden] precisa de !important aqui: .sii declara display:flex */
.sii[hidden], .ev-cnt[hidden] { display: none !important; }
/* Divisor visual entre os dois grupos de 3 */
.sii.sii-accent { background: rgba(39,127,228,.03); }
.sii:nth-child(3) { border-right: 2px solid rgba(39,127,228,.25); }
.sii-v {
  font-family: var(--font-d); font-size: 1.9rem; font-weight: 700;
  color: var(--green); line-height: 1;
}
.sii-l { font-size: .72rem; color: var(--muted); line-height: 1.4; }

/* Mobile: 3+3 wrap */
@media (max-width: 768px) {
  .sobre-impacto-row { flex-wrap: wrap; }
  .sii { flex: 0 0 33.333%; min-width: 0; padding: 14px 8px; text-align: center; box-sizing: border-box; }
  /* linha de separação entre as duas triplas */
  .sii:nth-child(3) { border-right: 1px solid var(--border2); }
  .sii:nth-child(4) { border-top: 1px solid var(--border2); }
  .sii:nth-child(5) { border-top: 1px solid var(--border2); }
  .sii:nth-child(6) { border-top: 1px solid var(--border2); border-right: none; }
  .sii-v { font-size: 1.45rem; }
  .sii-l { font-size: .63rem; line-height: 1.3; }
}

/* ─── Sobre btn row (feature 9) ─── */
.sobre-btn-row { margin-top: 48px; }
.btn-historia {
  display: inline-flex; align-items: center; gap: 10px;
  padding: 14px 28px; border-radius: 8px;
  background: var(--green); color: #fff;
  font-family: var(--font-b); font-size: .9rem; font-weight: 600;
  border: none; cursor: pointer;
  transition: background .25s, transform .25s var(--ease), box-shadow .25s;
  box-shadow: 0 4px 20px rgba(39,127,228,.3);
}
.btn-historia:hover {
  background: var(--green-d); transform: translateY(-2px);
  box-shadow: 0 8px 28px rgba(39,127,228,.4);
}

/* ─── Historia Modal (feature 9) ─── */
#mh-bg-canvas { position: absolute; inset: 0; z-index: 0; pointer-events: none; width: 100%; height: 100%; }
.modal-historia-box { position: relative; }
.mh-hero {
  position: relative; min-height: 60vh;
  display: flex; align-items: center;
  overflow: hidden;
  background: linear-gradient(150deg, #050e1f 0%, #0a2040 50%, #061530 100%);
  background-size: cover !important;
  background-position: center !important;
}
/* Overlay quando há foto de fundo */
.mh-hero.has-mh-photo::after {
  content: '';
  position: absolute; inset: 0;
  background: linear-gradient(150deg, rgba(5,14,31,.75) 0%, rgba(10,32,64,.55) 100%);
  z-index: 1;
}
.mh-hero.has-mh-photo .mh-hero-bg,
.mh-hero.has-mh-photo .mh-hero-content,
.mh-hero.has-mh-photo .mh-scroll-hint { position: relative; z-index: 2; }
.mh-hero-bg {
  position: absolute; inset: 0;
  background-image: radial-gradient(rgba(255,255,255,.025) 1px, transparent 1px);
  background-size: 44px 44px;
  mask-image: radial-gradient(ellipse 70% 70% at 50% 50%, black, transparent);
}
.mh-hero::before {
  content: '';
  position: absolute; right: -8%; top: -25%;
  width: 500px; height: 500px;
  background: radial-gradient(ellipse, rgba(39,127,228,.22) 0%, transparent 65%);
  border-radius: 60% 40% 50% 60% / 50% 60% 40% 55%;
  animation: morphOrb 14s ease-in-out infinite;
}
.mh-hero-content {
  position: relative; z-index: 2;
  padding: 120px 80px 80px;
  max-width: 700px;
}
.mh-eyebrow {
  display: flex; align-items: center; gap: 10px;
  font-size: .7rem; font-weight: 500; letter-spacing: .15em;
  color: rgba(130,190,255,.8); text-transform: uppercase;
  margin-bottom: 24px;
}
.mh-title {
  font-family: var(--font-d);
  font-size: clamp(2.8rem, 5vw, 4.8rem);
  font-weight: 700; line-height: .95;
  color: #fff; margin-bottom: 24px;
}
.mh-title em { font-style: italic; color: #7fc4ff; }
.mh-sub { color: rgba(255,255,255,.55); font-size: 1.05rem; line-height: 1.7; max-width: 500px; }
.mh-scroll-hint {
  position: absolute; bottom: 32px; left: 80px; z-index: 2;
  display: flex; flex-direction: column; align-items: center; gap: 10px;
  color: rgba(255,255,255,.4); font-size: .68rem; letter-spacing: .1em;
}

/* Timeline */
.mh-timeline-section { padding: 80px 0; }
.mh-tl { position: relative; }
.mh-tl::before {
  content: '';
  position: absolute; left: 50%; top: 0; bottom: 0;
  width: 2px; background: linear-gradient(to bottom, transparent, var(--border), transparent);
  transform: translateX(-50%);
}
.mh-tl-item {
  display: grid; grid-template-columns: 1fr 40px 1fr;
  gap: 0; margin-bottom: 64px; align-items: start;
  opacity: 0; transform: translateY(32px);
  transition: opacity .8s var(--ease), transform .8s var(--ease);
}
.mh-tl-item.tl-revealed { opacity: 1; transform: none; }
.mh-tl-item:nth-child(even) { direction: rtl; }
.mh-tl-item:nth-child(even) > * { direction: ltr; }

.mh-tl-year {
  font-family: var(--font-d); font-size: 3rem; font-weight: 700;
  color: var(--green); line-height: 1;
  text-align: right; padding-right: 28px; padding-top: 20px;
}
.mh-tl-item.mh-tl-right .mh-tl-year { text-align: left; padding-right: 0; padding-left: 28px; }

.mh-tl-dot {
  width: 16px; height: 16px; border-radius: 50%;
  background: var(--green); border: 3px solid var(--bg);
  box-shadow: 0 0 0 3px var(--green);
  margin: 28px auto 0;
  position: relative; z-index: 2;
  flex-shrink: 0;
}

.mh-tl-card {
  background: #fff; border-radius: 16px;
  border: 1px solid var(--border2);
  box-shadow: var(--shadow);
  overflow: hidden;
  margin-left: 28px;
  transition: box-shadow .3s;
}
.mh-tl-card:hover { box-shadow: var(--shadow-lg); }
.mh-tl-item.mh-tl-right .mh-tl-card { margin-left: 0; margin-right: 28px; }

.mh-tl-photo {
  height: 140px; display: flex; align-items: center; justify-content: center;
  position: relative; overflow: hidden;
}
.mh-tl-photo-img { display: none; position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; border-radius: inherit; z-index: 1; }
.mh-tl-photo.has-tl-photo .mh-tl-photo-img { display: block; }
.mh-tl-photo.has-tl-photo svg { opacity: 0; }
.mh-tl-body { padding: 24px; }
.mh-tl-body h3 {
  font-family: var(--font-d); font-size: 1.3rem; font-weight: 700;
  color: var(--dark); margin-bottom: 10px;
}
.mh-tl-body p { font-size: .9rem; color: var(--muted); line-height: 1.65; margin-bottom: 16px; }
.mh-tl-tags { display: flex; flex-wrap: wrap; gap: 6px; }
.mh-tl-tags span {
  padding: 4px 12px; border-radius: 20px;
  background: var(--green-p); border: 1px solid rgba(39,127,228,.15);
  font-size: .72rem; font-weight: 600; color: var(--green);
}

/* Mapa inside modal */
.mh-mapa-section {
  padding: 60px 0 80px;
  background: var(--bg2);
}

@media (max-width: 900px) {
  .mh-tl::before { left: 20px; }
  .mh-tl-item { grid-template-columns: 40px 1fr; direction: ltr !important; }
  .mh-tl-year { display: none; }
  .mh-tl-dot { margin: 20px 0 0; }
  .mh-tl-card { margin-left: 16px !important; margin-right: 0 !important; }
  .mh-hero-content { padding: 100px 24px 60px; }
  .mh-scroll-hint { left: 24px; }
}

/* ══════════════════════════════════════════════════
   NOSSA HISTÓRIA — EQUIVALÊNCIAS, GRÁFICO, FLIP CARDS
   ══════════════════════════════════════════════════ */

/* Equivalências visuais */
.mh-equiv-section {
  background: #040c1c;
  padding: 80px 0 60px;
  border-bottom: 1px solid rgba(39,127,228,.1);
}
.mh-equiv-eyebrow {
  font-size: .6rem; letter-spacing: .22em; text-transform: uppercase;
  font-weight: 700; color: rgba(39,127,228,.6); margin-bottom: 40px;
  text-align: center;
}
.mh-equiv-grid {
  display: grid; grid-template-columns: repeat(3,1fr); gap: 24px;
}
.mh-equiv-card {
  background: rgba(255,255,255,.03);
  border: 1px solid rgba(255,255,255,.07);
  border-radius: 20px; padding: 36px 28px;
  text-align: center;
  transition: border-color .3s, background .3s, transform .3s var(--ease);
  cursor: default; position: relative; overflow: hidden;
}
.mh-equiv-card::before {
  content: '';
  position: absolute; inset: 0;
  background: radial-gradient(ellipse 60% 50% at 50% 0%, rgba(39,127,228,.08), transparent);
  opacity: 0; transition: opacity .4s;
}
.mh-equiv-card:hover { border-color: rgba(39,127,228,.3); background: rgba(39,127,228,.04); transform: translateX(4px); }
.mh-equiv-card:hover::before { opacity: 1; }
.mh-equiv-icon-wrap { position: relative; display: inline-flex; margin-bottom: 20px; }
.mh-equiv-ripple {
  position: absolute; inset: -8px;
  border-radius: 50%; border: 1.5px solid rgba(39,127,228,.25);
  animation: mhRipple 2s ease-out infinite;
}
.mh-equiv-ripple--green { border-color: rgba(65,190,96,.25); animation: mhRippleG 2s ease-out infinite; }
.mh-equiv-card:hover .mh-equiv-ripple { animation-duration: .8s; }
@keyframes mhRipple {
  0%   { transform: scale(.85); opacity: .8; }
  100% { transform: scale(1.6); opacity: 0; }
}
@keyframes mhRippleG {
  0%   { transform: scale(.85); opacity: .8; border-color: rgba(65,190,96,.3); }
  100% { transform: scale(1.6); opacity: 0; }
}
.mh-equiv-num {
  font-family: var(--font-d); font-size: 3.4rem; font-weight: 700;
  color: #fff; line-height: 1; margin-bottom: 6px;
  transition: color .3s;
}
.mh-equiv-card:hover .mh-equiv-num { color: #277fe4; }
.mh-equiv-unit {
  font-size: .88rem; font-weight: 600; color: rgba(255,255,255,.7);
  margin-bottom: 4px;
}
.mh-equiv-desc { font-size: .76rem; color: rgba(255,255,255,.35); margin-bottom: 16px; }
.mh-equiv-base {
  display: inline-block;
  font-size: .65rem; letter-spacing: .08em; font-weight: 600;
  color: #277fe4; background: rgba(39,127,228,.1);
  border: 1px solid rgba(39,127,228,.2); border-radius: 20px;
  padding: 4px 14px;
}

/* Gráfico de crescimento */
.mh-chart-section {
  background: #040c1c;
  padding: 60px 0 70px;
  border-bottom: 1px solid rgba(39,127,228,.1);
}
.mh-chart-head { text-align: center; margin-bottom: 40px; }
.mh-chart-title {
  font-family: var(--font-d); font-size: 1.6rem; font-weight: 700;
  color: #fff; margin-bottom: 6px;
}
.mh-chart-sub { font-size: .78rem; color: rgba(255,255,255,.35); }
.mh-chart-wrap { position: relative; }
.mh-chart-bars {
  display: flex; align-items: flex-end; gap: 20px;
  height: 220px; padding: 0 0 0 0;
  border-bottom: 1px solid rgba(255,255,255,.08);
  position: relative;
}
/* Grid lines */
.mh-chart-bars::before {
  content: '';
  position: absolute; inset: 0;
  background: repeating-linear-gradient(
    to bottom,
    transparent 0px,
    transparent calc(25% - 1px),
    rgba(255,255,255,.04) calc(25% - 1px),
    rgba(255,255,255,.04) 25%
  );
  pointer-events: none;
}
.mh-bar-wrap {
  flex: 1; display: flex; flex-direction: column;
  align-items: center; gap: 8px; height: 100%;
  justify-content: flex-end; position: relative;
}
.mh-bar {
  width: 100%; border-radius: 8px 8px 0 0;
  background: linear-gradient(to top, #0d4d96, #277fe4);
  transform-origin: bottom;
  transform: scaleY(0);
  transition: transform .7s cubic-bezier(.16,1,.3,1), background .3s;
  cursor: pointer; position: relative;
}
.mh-bar::after {
  content: attr(data-tip);
  position: absolute; bottom: calc(100% + 8px); left: 50%;
  transform: translateX(-50%) scale(.9);
  background: #0d1a2e; color: #fff;
  font-size: .72rem; white-space: nowrap;
  padding: 6px 12px; border-radius: 8px;
  border: 1px solid rgba(39,127,228,.3);
  opacity: 0; pointer-events: none;
  transition: opacity .2s, transform .2s;
  font-family: var(--font);
}
.mh-bar:hover { background: linear-gradient(to top, #0a3a73, #41be60); }
.mh-bar:hover::after { opacity: 1; transform: translateX(-50%) scale(1); }
.mh-bar.animate { transform: scaleY(1); }
.mh-bar-label {
  font-size: .65rem; color: rgba(255,255,255,.3);
  margin-top: 4px; font-weight: 600; letter-spacing: .04em;
}
.mh-chart-axis {
  display: flex; justify-content: space-around;
  padding: 10px 0 0;
}
.mh-chart-axis span {
  font-size: .72rem; color: rgba(255,255,255,.25);
  font-weight: 600; letter-spacing: .06em;
}

/* Flip Cards "Você sabia?" */
.mh-sabia-section {
  background: #040c1c;
  padding: 70px 0 80px;
  border-bottom: 1px solid rgba(39,127,228,.1);
}
.mh-sabia-eyebrow {
  font-family: var(--font-d); font-size: 1.8rem; font-weight: 700;
  color: #fff; text-align: center; margin-bottom: 40px;
}
.mh-sabia-eyebrow::after {
  content: ' ?'; color: #277fe4;
}
.mh-sabia-grid {
  display: grid; grid-template-columns: repeat(3, 1fr); gap: 20px;
}
.mh-flip-card {
  height: 200px; perspective: 800px; cursor: pointer;
  outline: none;
}
.mh-flip-inner {
  position: relative; width: 100%; height: 100%;
  transform-style: preserve-3d;
  transition: transform .55s cubic-bezier(.16,1,.3,1);
}
.mh-flip-card:hover .mh-flip-inner,
.mh-flip-card:focus .mh-flip-inner,
.mh-flip-card.flipped .mh-flip-inner {
  transform: rotateY(180deg);
}
.mh-flip-front, .mh-flip-back {
  position: absolute; inset: 0;
  border-radius: 16px; padding: 28px 24px;
  backface-visibility: hidden;
  display: flex; flex-direction: column;
  align-items: center; justify-content: center;
  text-align: center; gap: 10px;
}
.mh-flip-front {
  background: rgba(255,255,255,.03);
  border: 1px solid rgba(255,255,255,.08);
  transition: border-color .3s;
}
.mh-flip-card:hover .mh-flip-front { border-color: rgba(39,127,228,.3); }
.mh-flip-front h4 {
  font-family: var(--font-d); font-size: 1.1rem; color: #fff; font-weight: 700;
}
.mh-flip-hint { font-size: .65rem; color: rgba(255,255,255,.25); letter-spacing: .08em; margin-top: 2px; }
.mh-flip-back {
  background: linear-gradient(135deg, #0d3060 0%, #0a2040 100%);
  border: 1px solid rgba(39,127,228,.3);
  transform: rotateY(180deg);
}
.mh-flip-back p {
  font-size: .84rem; color: rgba(255,255,255,.85); line-height: 1.65;
}
.mh-flip-back strong { color: #41be60; font-weight: 700; }

/* Mobile */
@media (max-width: 900px) {
  .mh-equiv-grid { grid-template-columns: 1fr; gap: 16px; }
  .mh-sabia-grid { grid-template-columns: 1fr 1fr; gap: 14px; }
  .mh-chart-bars { gap: 10px; }
}
@media (max-width: 600px) {
  .mh-sabia-grid { grid-template-columns: 1fr; }
  .mh-flip-card { height: 170px; }
  .mh-equiv-num { font-size: 2.6rem; }
}

/* ─── PDF Slideshow (feature 10) ─── */
#publicacoes {
  padding: 100px 0;
  background: linear-gradient(150deg, #050e1f 0%, #0a2040 50%, #061530 100%);
}
#publicacoes .stag { color: rgba(130,190,255,.8) !important; }
#publicacoes .stag::before { background: rgba(130,190,255,.8) !important; }
#publicacoes .stitle { color: #fff !important; }
#publicacoes .stitle em { color: #7fc4ff !important; }
#publicacoes .ssub { color: rgba(255,255,255,.55) !important; }
.pdf-slide-wrap { max-width: 900px; margin: 0 auto; }

/* PDF layout: viewer + list sidebar */
.pdf-layout { display: flex; gap: 20px; max-width: 1100px; margin: 0 auto; align-items: flex-start; }
.pdf-viewer-col { flex: 1; min-width: 0; }
.pdf-list-col {
  width: 220px; flex-shrink: 0;
  background: rgba(255,255,255,.07); border: 1px solid rgba(255,255,255,.12);
  border-radius: 12px; overflow: hidden;
}
.pdf-list-head {
  padding: 14px 16px; font-size: .75rem; font-weight: 700;
  letter-spacing: .12em; text-transform: uppercase;
  color: rgba(255,255,255,.45);
  border-bottom: 1px solid rgba(255,255,255,.08);
}
.pdf-list { padding: 8px; display: flex; flex-direction: column; gap: 4px; max-height: 400px; overflow-y: auto; }
.pdf-list li {
  padding: 10px 12px; border-radius: 8px; cursor: pointer;
  font-size: .82rem; color: rgba(255,255,255,.65);
  transition: background .18s, color .18s;
  display: flex; align-items: center; gap: 8px;
  line-height: 1.3;
}
.pdf-list li::before { content: ''; width: 6px; height: 6px; border-radius: 50%; background: rgba(255,255,255,.25); flex-shrink: 0; }
.pdf-list li:hover { background: rgba(255,255,255,.1); color: #fff; }
.pdf-list li.active { background: var(--green); color: #fff; }
.pdf-list li.active::before { background: rgba(255,255,255,.7); }

/* Loading spinner */
.pdf-slide-loading {
  position: absolute; inset: 0; display: flex; align-items: center; justify-content: center;
  background: #0a2040;
}
.pdf-spinner {
  width: 40px; height: 40px; border-radius: 50%;
  border: 3px solid rgba(255,255,255,.1);
  border-top-color: var(--green);
  animation: spin .8s linear infinite;
}
@keyframes spin { to { transform: rotate(360deg); } }

/* Fullscreen button on viewer */
.psc-fullscreen-btn {
  position: absolute; top: 12px; right: 12px; z-index: 5;
  width: 36px; height: 36px; border-radius: 8px;
  background: rgba(13,26,46,.7); border: 1px solid rgba(255,255,255,.15);
  color: #fff; display: flex; align-items: center; justify-content: center;
  cursor: pointer; transition: background .2s, transform .2s;
  backdrop-filter: blur(8px);
}
.psc-fullscreen-btn:hover { background: var(--green); transform: scale(1.1); }

/* Fullscreen overlay */
.pdf-fs-overlay {
  position: fixed; inset: 0; z-index: 3000;
  background: #020a14;
  display: none;
  flex-direction: column;
  align-items: center; justify-content: center;
}
.pdf-fs-overlay:not([hidden]) {
  display: flex;
  animation: fsIn .4s cubic-bezier(.16,1,.3,1) both;
}
@keyframes fsIn {
  from { opacity: 0; transform: scale(.92); }
  to   { opacity: 1; transform: scale(1); }
}
@keyframes fsSlideNext {
  from { opacity: 0; transform: translateX(48px) scale(.97); }
  to   { opacity: 1; transform: none; }
}
@keyframes fsSlidePrev {
  from { opacity: 0; transform: translateX(-48px) scale(.97); }
  to   { opacity: 1; transform: none; }
}
.pdf-fs-overlay canvas.anim-next {
  animation: fsSlideNext .35s cubic-bezier(.16,1,.3,1) both;
}
.pdf-fs-overlay canvas.anim-prev {
  animation: fsSlidePrev .35s cubic-bezier(.16,1,.3,1) both;
}
.pdf-fs-close {
  position: absolute; top: 20px; right: 24px;
  width: 44px; height: 44px; border-radius: 50%;
  background: rgba(255,255,255,.1); border: 1px solid rgba(255,255,255,.15);
  color: #fff; display: flex; align-items: center; justify-content: center;
  cursor: pointer; transition: background .2s, transform .2s;
}
.pdf-fs-close:hover { background: rgba(255,255,255,.2); transform: rotate(90deg); }
.pdf-fs-overlay canvas {
  max-width: 95vw; max-height: 85vh;
  object-fit: contain; border-radius: 4px;
  box-shadow: 0 0 80px rgba(0,0,0,.5);
  transition: opacity .3s ease, transform .35s cubic-bezier(.16,1,.3,1);
}
.pdf-fs-controls {
  position: absolute; bottom: 24px; left: 50%;
  transform: translateX(-50%);
  display: flex; align-items: center; gap: 16px;
  background: rgba(0,0,0,.5); backdrop-filter: blur(12px);
  padding: 10px 20px; border-radius: 40px;
  border: 1px solid rgba(255,255,255,.1);
}

@media (max-width: 768px) {
  .pdf-layout { flex-direction: column; }
  .pdf-list-col { width: 100%; }
}
.pdf-slide-viewer {
  position: relative; background: #0d1a2e;
  border-radius: 16px; overflow: hidden;
  aspect-ratio: 16/9;
  display: flex; align-items: center; justify-content: center;
  box-shadow: var(--shadow-lg);
  cursor: pointer;
}
.pdf-slide-viewer canvas {
  width: 100% !important; height: 100% !important;
  object-fit: contain;
  transition: opacity .35s ease;
}
.pdf-slide-empty {
  display: flex; flex-direction: column; align-items: center; gap: 16px;
  color: rgba(255,255,255,.3); text-align: center; padding: 40px;
}
.pdf-slide-empty p { font-size: .9rem; max-width: 260px; line-height: 1.5; }
.pdf-slide-controls {
  display: flex; align-items: center; gap: 12px;
  padding: 16px 0; justify-content: center;
}
.psc-btn {
  width: 38px; height: 38px; border-radius: 50%;
  background: var(--bg2); border: 1px solid var(--border2);
  display: flex; align-items: center; justify-content: center;
  color: var(--dark); cursor: pointer;
  transition: background .2s, transform .2s;
}
.psc-btn:hover { background: var(--green); color: #fff; transform: scale(1.1); }
.psc-info { font-size: .85rem; color: var(--muted); min-width: 60px; text-align: center; }
.psc-progress-wrap {
  flex: 1; max-width: 200px; height: 3px;
  background: var(--bg3); border-radius: 2px; overflow: hidden;
}
.psc-progress {
  height: 100%; background: var(--green);
  width: 0%; transition: width .15s linear;
}
.psc-pause-btn {
  width: 38px; height: 38px; border-radius: 50%;
  background: var(--green); color: #fff; border: none;
  display: flex; align-items: center; justify-content: center;
  cursor: pointer; transition: background .2s;
}
.psc-pause-btn:hover { background: var(--green-d); }

/* ─── WhatsApp Float Wrap + Tooltip (feature 8) ─── */
#whatsapp-float-wrap {
  position: fixed; bottom: 32px; right: 32px; z-index: 1500;
  display: flex; flex-direction: column; align-items: flex-end; gap: 12px;
  transition: opacity .22s, transform .22s var(--ease), visibility .22s;
}
body.menu-open #whatsapp-float-wrap {
  opacity: 0; transform: scale(.8) translateX(8px);
  pointer-events: none; visibility: hidden;
}
.wf-float {
  width: 58px; height: 58px; border-radius: 50%;
  background: #25d366;
  display: flex; align-items: center; justify-content: center;
  box-shadow: 0 4px 24px rgba(37,211,102,.4);
  transition: transform .25s var(--ease), box-shadow .25s;
  flex-shrink: 0;
}
.wf-float:hover { transform: scale(1.1); box-shadow: 0 8px 32px rgba(37,211,102,.5); }
.wf-tooltip {
  background: #0d1a2e;
  color: #fff;
  border-radius: 12px;
  padding: 14px 16px 14px 16px;
  font-size: .85rem;
  max-width: 220px;
  position: relative;
  box-shadow: 0 8px 32px rgba(0,0,0,.3);
  display: none;
  animation: tooltipIn .3s var(--ease) both;
}
@keyframes tooltipIn {
  from { opacity: 0; transform: translateY(8px) scale(.95); }
  to   { opacity: 1; transform: none; }
}
.wf-tooltip strong { display: block; margin-bottom: 4px; font-size: .9rem; color: #25d366; }
.wf-tooltip span { color: rgba(255,255,255,.75); line-height: 1.4; }
.wf-tooltip-close {
  position: absolute; top: 8px; right: 8px;
  background: none; border: none; color: rgba(255,255,255,.5);
  font-size: .85rem; cursor: pointer; padding: 4px;
  line-height: 1;
}
.wf-tooltip-close:hover { color: #fff; }
.wf-tooltip::after {
  content: '';
  position: absolute; bottom: -8px; right: 20px;
  border: 8px solid transparent;
  border-top-color: #0d1a2e;
  border-bottom: none;
}
/* Only show tooltip on mobile */
@media (max-width: 768px) {
  .wf-tooltip { display: block; }
}

/* ─── Publicações Tabs (video + PDF) ─── */
.pub-tabs {
  display: flex; gap: 8px; justify-content: center;
  margin-bottom: 32px;
}
.pub-tab {
  display: inline-flex; align-items: center; gap: 8px;
  padding: 10px 24px; border-radius: 8px;
  font-family: var(--font-b); font-size: .88rem; font-weight: 600;
  color: var(--muted); background: var(--bg2);
  border: 1.5px solid var(--border2); cursor: pointer;
  transition: background .2s, color .2s, border-color .2s, box-shadow .2s;
}
.pub-tab:hover { color: var(--green); border-color: rgba(39,127,228,.3); }
.pub-tab.active {
  background: var(--green); color: #fff;
  border-color: var(--green);
  box-shadow: 0 4px 16px rgba(39,127,228,.3);
}
.pub-panel { display: none; }
.pub-panel.active { display: block; }

/* ══════════════════════════════════════════════════
   REFINAMENTOS ESTÉTICOS v2
   Micro-interações · Acessibilidade · Tipografia
   ══════════════════════════════════════════════════ */

/* ─── Renderização de texto ─────────────────────── */
body {
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  text-rendering: optimizeLegibility;
}

/* ─── Focus visível (acessibilidade) ───────────── */
:focus-visible {
  outline: 2px solid var(--green);
  outline-offset: 3px;
  border-radius: 4px;
}
button:focus-visible,
a:focus-visible { border-radius: 6px; }

/* ─── Botões — sombra e escala mais refinadas ───── */
.btn-p {
  box-shadow: 0 2px 8px rgba(65,190,96,.15);
  letter-spacing: .04em;
}
.btn-p:hover {
  transform: translateY(-3px) scale(1.01);
  box-shadow: 0 14px 32px rgba(65,190,96,.32);
}
.btn-p:active { transform: translateY(-1px) scale(1); }

.btn-g:active { background: rgba(255,255,255,.05); }

/* ─── Nav contact button ────────────────────────── */
.nav-contact-btn {
  transition: background .2s, color .2s, border-color .2s,
              box-shadow .2s, transform .15s var(--ease);
}
.nav-contact-btn:hover { transform: translateY(-1px); }
.nav-contact-btn:active { transform: none; }

/* ─── Cards — hover lateral ──────────────────────── */
.cc {
  transition: transform .32s var(--ease), box-shadow .32s var(--ease);
}
.cc:hover {
  transform: translateX(5px);
  box-shadow: -6px 8px 32px rgba(13,26,46,.18);
}

/* ─── Pills — transição de cor + escala ─────────── */
.pills span {
  transition: background .2s, border-color .2s, transform .15s var(--ease);
  cursor: default;
}
.pills span:hover {
  background: var(--green-p);
  border-color: var(--green);
  transform: scale(1.03);
}

/* ─── Métricas — número com brilho no hover ─────── */
.met-cell {
  transition: background .35s, transform .28s var(--ease);
}
.met-cell:hover {
  background: rgba(255,255,255,.04);
  transform: translateX(3px);
}
.met-cell:hover .met-num { color: var(--green); }
.met-num { transition: color .28s; }

/* ─── Pub tabs — easing mais suave ──────────────── */
.pub-tab {
  transition: background .22s var(--ease), color .22s,
              border-color .22s, box-shadow .22s, transform .15s var(--ease);
}
.pub-tab:hover { transform: translateY(-1px); }
.pub-tab:active { transform: none; }

/* ─── Scrollbar refinada ────────────────────────── */
::-webkit-scrollbar { width: 5px; }
::-webkit-scrollbar-track { background: var(--bg2); }
::-webkit-scrollbar-thumb {
  background: linear-gradient(to bottom, var(--green), var(--green-d));
  border-radius: 3px;
}
::-webkit-scrollbar-thumb:hover { background: var(--green-d); }

/* ─── Imagens — fade-in suave ao carregar ───────── */
img { opacity: 0; transition: opacity .4s ease; }
img.loaded, img[src=""], img:not([src]) { opacity: 1; }

/* ─── Selection refinada ────────────────────────── */
::selection {
  background: var(--green);
  color: #fff;
  text-shadow: none;
}

/* ─── Stitle — sublinhado decorativo sutil ───────── */
.stitle em {
  position: relative;
}
.stitle em::after {
  content: '';
  position: absolute;
  left: 0; bottom: -2px;
  width: 100%; height: 2px;
  background: linear-gradient(to right, var(--green), transparent);
  border-radius: 1px;
  opacity: .45;
}

/* ─── Desktop: esconder burger, mostrar nav horizontal ─── */
@media (min-width: 769px) {
  #nav-burger { display: none !important; }
  .nav-desktop { display: flex !important; }
}

/* ══════════════════════════════════════════════════════════════
   PISO DE LEGIBILIDADE NO MOBILE
   Abaixo de 12px o texto deixa de ser confortavelmente legivel em
   tela pequena. Estes seletores desciam ate 9,3px. O piso vale so
   no mobile: no desktop os mesmos tamanhos funcionam, porque a
   distancia de leitura e outra.
   ══════════════════════════════════════════════════════════════ */
@media (max-width: 768px) {
  .stl-tags span,
  .pills span,
  .f-bot span,
  .memp-tags span,
  .cbadge,
  .efb,
  .sfb,
  .gs-tab-num,
  .gp-num,
  .gp-tag,
  .bv,
  .bd,
  .ig-reel-badge,
  .nd-brand,
  .ev-cnt-sub,
  .met-src,
  .stl-card p,
  footer h5,
  h5 {
    font-size: 12px;
  }
}


/* ══════════════════════════════════════════════════════════════
   ÁLBUM DE EVENTO
   Pedido da revisão: cada quadradinho de evento pode abrir um álbum
   de fotos. Reaproveita o #lightbox da seção de documentos.
   ══════════════════════════════════════════════════════════════ */
.ig-card { display: block; width: 100%; text-align: left; border: none; background: none; padding: 0; font: inherit; color: inherit; cursor: pointer; }

.alb { position: relative; margin: 0; }
.alb img {
  display: block; width: 100%; max-height: 78vh;
  object-fit: contain; border-radius: 10px; background: var(--dark);
}
.alb-cap {
  display: flex; align-items: center; justify-content: space-between; gap: 16px;
  margin-top: 12px; font-family: var(--font-b); font-size: .82rem; color: var(--muted);
}
.alb-cont { font-variant-numeric: tabular-nums; color: var(--green); }
.alb-nav {
  position: absolute; top: 50%; transform: translateY(-50%);
  width: 44px; height: 44px; border-radius: 50%;
  display: grid; place-items: center;
  font-size: 1.6rem; line-height: 1; color: #fff;
  background: rgba(13,26,46,.55); border: 1px solid rgba(255,255,255,.25);
  cursor: pointer; transition: background .2s;
}
.alb-nav:hover { background: rgba(13,26,46,.8); }
.alb-prev { left: 10px; }
.alb-next { right: 10px; }
