*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
:root{
  --blue:#0047f9;
  --cyan:#02bcfb;
  --navy:#00056f;
  --navy-dark: #000440;
  --dark:#222;
  --white:#fff;
  --gray:#f4f6fb;
  --gray-light: #f4f5f7;
  --gray-mid: #e8eaed;
  --gray-text: #6b7280;
  --text-dark: #0d1b3e;
  --mid:#555b6e;
  --border:#dde3f0;
  --blue-lt:rgba(0,71,249,.08);
  --ease:cubic-bezier(.4,0,.2,1);
  --r:14px;
  --sh:0 4px 28px rgba(0,71,249,.1);
  --sh2:0 14px 48px rgba(0,71,249,.18);
  --box:1140px;
  --pad:clamp(1.2rem,4vw,3rem);
}
html{scroll-behavior:smooth}
body{background:var(--white);color:var(--dark);font-family:'Exo 2',sans-serif;font-weight:400;line-height:1.6;overflow-x:hidden}

p {
	text-align: justify;
}

/* ── BOX ── */
.nav-top,
.hero-body,.strip,.section,.grafismo-band,.dica,.nums-section,footer{
  padding-left:max(var(--pad),calc((100% - var(--box))/2 + var(--pad)));
  padding-right:max(var(--pad),calc((100% - var(--box))/2 + var(--pad)));
}
.nav-top{max-width:none}

/* ════════════════════════════════════════
   NAV — 2 camadas: barra superior navy +
   barra de itens azul brilhante
════════════════════════════════════════ */
.nav-wrap{position:sticky;top:0;z-index:200;transition:box-shadow .3s}
.nav-wrap.sc{box-shadow:0 4px 28px rgba(0,5,111,.22)}

/* Camada 1 — topo navy escuro */
.nav-top{
  background:var(--navy);
  display:flex;align-items:center;justify-content:space-between;
  height:52px;gap:1rem;
}
.nav-logo{display:flex;align-items:center;text-decoration:none;flex-shrink:0}
.nav-logo svg{height:26px;width:auto}
.nav-utils{display:flex;align-items:center;gap:.6rem;flex-shrink:0}
.nav-search-btn{
  display:flex;align-items:center;gap:7px;
  padding:6px 14px;border:1px solid rgba(255,255,255,.2);
  border-radius:20px;background:transparent;cursor:pointer;
  font-size:11.5px;font-family:'Exo 2',sans-serif;font-weight:500;
  color:rgba(255,255,255,.65);transition:all .2s;white-space:nowrap;
}
.nav-search-btn:hover{border-color:var(--cyan);color:var(--cyan)}
.nav-search-btn svg{width:12px;height:12px;flex-shrink:0}
.nav-portal-btn{
  display:flex;align-items:center;gap:6px;
  padding:7px 16px;background:var(--cyan);color:var(--navy);
  border-radius:8px;font-size:12px;font-weight:800;
  letter-spacing:.04em;text-transform:uppercase;
  text-decoration:none;white-space:nowrap;transition:background .18s;
}
.nav-portal-btn:hover{background:#01a8e0}
.nav-portal-btn svg{width:13px;height:13px}
.nav-burger{
  display:none;flex-direction:column;justify-content:center;gap:5px;
  width:38px;height:38px;border-radius:8px;
  border:1px solid rgba(255,255,255,.25);background:transparent;cursor:pointer;
  padding:6px;transition:background .2s;flex-shrink:0;
}
.nav-burger:hover{background:rgba(255,255,255,.1)}
.bl{display:block;height:2px;background:white;border-radius:2px;transition:transform .25s,opacity .25s,width .25s}
.bl:nth-child(1){width:100%}.bl:nth-child(2){width:70%}.bl:nth-child(3){width:100%}
.nav-wrap.mob-open .bl:nth-child(1){transform:translateY(7px) rotate(45deg)}
.nav-wrap.mob-open .bl:nth-child(2){opacity:0;width:0}
.nav-wrap.mob-open .bl:nth-child(3){transform:translateY(-7px) rotate(-45deg)}

/* Camada 2 — itens azul */
.nav-items-bar{
  background:#0047f9;
  display:flex;align-items:stretch;
  padding-left:max(var(--pad),calc((100% - var(--box))/2 + var(--pad)));
  padding-right:max(var(--pad),calc((100% - var(--box))/2 + var(--pad)));
  overflow-x:auto;scrollbar-width:none;
}
.nav-items-bar::-webkit-scrollbar{display:none}
.ni{
  display:flex;align-items:center;gap:5px;
  padding:0 14px;height:46px;
  font-size:11.5px;font-weight:700;letter-spacing:.05em;text-transform:uppercase;
  color:rgba(255,255,255,.75);cursor:pointer;
  border-bottom:3px solid transparent;
  transition:color .18s,border-color .18s,background .18s;
  position:relative;white-space:nowrap;user-select:none;flex-shrink:0;
}
.ni:hover,.ni.on{color:var(--white);border-color:var(--cyan)}
.ni.on{background:rgba(255,255,255,.08)}
.ni .chev{width:9px;height:9px;flex-shrink:0;transition:transform .22s;opacity:.6}
.ni.open .chev{transform:rotate(180deg)}

.ni a{
	color: rgba(255, 255, 255, .75);
	text-decoration: none;
}

.ni a:hover, .ni.on a {
	color: #fff;
}

/* ── Mega painel ── */
.mega{
  position:absolute;top:100%;left:0;right:0;
  background:var(--white);
  border-top:3px solid var(--cyan);
  border-bottom:1px solid var(--border);
  box-shadow:0 20px 60px rgba(0,5,111,.16);
  display:none;z-index:300;
}
.mega.show{display:block;animation:mslide .18s var(--ease)}
@keyframes mslide{from{opacity:0;transform:translateY(-6px)}to{opacity:1;transform:translateY(0)}}
.mega-in{
  display:flex;
  max-width:var(--box);margin:0 auto;
  padding:0 var(--pad);
}
.mega-side{
  width:210px;flex-shrink:0;
  background:linear-gradient(160deg,var(--navy) 0%,var(--blue) 100%);
  border-radius:12px;margin:1.2rem 1.5rem 1.2rem 0;
  padding:1.6rem 1.4rem;
  display:flex;flex-direction:column;justify-content:space-between;
}
.ms-label{font-size:9px;font-weight:700;letter-spacing:.18em;text-transform:uppercase;color:rgba(255,255,255,.4);margin-bottom:.35rem}
.ms-title{font-size:1.2rem;font-weight:900;color:var(--white);line-height:1.2}
.ms-desc{font-size:11px;color:rgba(255,255,255,.55);line-height:1.6;margin-top:.45rem}
.ms-stat{margin-top:1.2rem}
.ms-n{font-size:1.6rem;font-weight:900;color:var(--cyan);line-height:1}
.ms-l{font-size:9px;font-weight:700;text-transform:uppercase;letter-spacing:.1em;color:rgba(255,255,255,.4);margin-top:2px}
.mega-links{flex:1;padding:.8rem 0;display:grid;gap:2px;align-content:start}
.mega-links.c2{grid-template-columns:1fr 1fr}
.mega-links.c3{grid-template-columns:1fr 1fr 1fr}
.ml{
  display:flex;align-items:flex-start;gap:10px;
  padding:9px 10px;border-radius:9px;
  cursor:pointer;text-decoration:none;color:inherit;transition:background .15s;
}
.ml:hover{background:var(--gray)}
.ml-ico{
  width:30px;height:30px;border-radius:7px;
  background:var(--blue-lt);
  display:flex;align-items:center;justify-content:center;
  flex-shrink:0;transition:background .15s;
}
.ml:hover .ml-ico{background:#dde7ff}
.ml-ico svg{width:13px;height:13px}
.ml-num{font-size:9px;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:var(--blue);margin-bottom:1px}
.ml-t{font-size:12.5px;font-weight:700;color:var(--dark);line-height:1.2}
.ml-s{font-size:11px;color:#8899aa;margin-top:1px;line-height:1.4}

/* Simple dropdown */
.sdrop{
  position:absolute;top:calc(100% + 4px);left:0;
  background:var(--white);
  border:1px solid var(--border);border-top:3px solid var(--cyan);
  border-radius:0 0 12px 12px;
  box-shadow:0 12px 32px rgba(0,71,249,.1);
  min-width:230px;display:none;z-index:300;padding:6px 0;
}
.sdrop.show{display:block;animation:mslide .18s var(--ease)}
.sd{
  display:flex;align-items:center;gap:10px;
  padding:10px 16px;font-size:12px;font-weight:600;
  color:var(--dark);text-decoration:none;
  transition:background .15s,color .15s;
}
.sd:hover{background:var(--gray);color:var(--blue)}
.sd svg{width:13px;height:13px;opacity:.4;flex-shrink:0}
.sd-sep{height:1px;background:var(--border);margin:5px 0}

/* Progress bar */
.nav-prog{height:3px;background:rgba(255,255,255,.15);position:relative}
.nav-prog-fill{height:100%;width:0;background:linear-gradient(90deg,var(--cyan),#7dd8ff);border-radius:0 2px 2px 0;transition:width .25s}
.pdot{position:absolute;top:-4px;width:10px;height:10px;border-radius:50%;border:2px solid var(--blue);cursor:pointer;transition:transform .2s;z-index:2}
.pdot:hover{transform:scale(1.5)}
.pdot.done{background:var(--cyan)}
.pdot.cur{background:#fff;box-shadow:0 0 0 3px rgba(2,188,251,.5)}
.pdot.nxt{background:rgba(255,255,255,.25)}

/* ── MOBILE DRAWER ── */
.mob-overlay{display:none;position:fixed;inset:0;background:rgba(0,5,111,.5);z-index:400;backdrop-filter:blur(2px)}
.mob-overlay.show{display:block}
.mob-drawer{
  position:fixed;top:0;right:-100%;bottom:0;
  width:min(340px,94vw);background:var(--white);
  z-index:500;overflow-y:auto;
  transition:right .3s var(--ease);
  display:flex;flex-direction:column;
  box-shadow:-8px 0 40px rgba(0,5,111,.2);
}
.mob-drawer.open{right:0}
.mob-head{
  display:flex;align-items:center;justify-content:space-between;
  padding:0 1.2rem;height:60px;
  background:var(--navy);flex-shrink:0;
}
.mob-head svg{height:22px;width:auto}
.mob-x{
  width:36px;height:36px;border-radius:8px;
  border:1px solid rgba(255,255,255,.2);background:transparent;
  cursor:pointer;display:flex;align-items:center;justify-content:center;
  transition:background .2s;
}
.mob-x:hover{background:rgba(255,255,255,.1)}
.mob-x svg{width:14px;height:14px}
.mob-nav{flex:1;padding:.4rem 0}
.mob-r{
  display:flex;align-items:center;justify-content:space-between;
  padding:0 1.2rem;height:50px;
  font-size:12.5px;font-weight:700;letter-spacing:.04em;text-transform:uppercase;
  color:var(--dark);cursor:pointer;
  border-bottom:1px solid var(--border);
  transition:background .15s,color .15s;text-decoration:none;
}
.mob-r a{
	font-size:12.5px;font-weight:700;letter-spacing:.04em;text-transform:uppercase;
  color:var(--dark);cursor:pointer;text-decoration: none;	
}
.mob-r:hover,.mob-r.mob-r-on, .mob-r a:hover{background:var(--gray);color:var(--blue)}
.mob-r.mob-r-open{color:var(--blue);background:#eef3ff}
.mob-r svg.mc{width:10px;height:10px;transition:transform .22s;flex-shrink:0;opacity:.5}
.mob-r.mob-r-open svg.mc{transform:rotate(180deg)}
.mob-sub{display:none;background:#f8faff;border-bottom:1px solid var(--border)}
.mob-sub.open{display:block}
.mob-sub-hd{
  display:flex;align-items:center;justify-content:space-between;
  padding:9px 1.2rem;
  background:linear-gradient(90deg,var(--navy),var(--blue));
}
.msh-t{font-size:10.5px;font-weight:800;color:white;text-transform:uppercase;letter-spacing:.06em}
.msh-s{font-size:11px;font-weight:900;color:var(--cyan)}
.mob-si{
  display:flex;align-items:center;gap:10px;
  padding:10px 1.2rem 10px 1.8rem;
  font-size:12px;font-weight:600;color:var(--mid);
  text-decoration:none;transition:background .15s,color .15s;
  border-bottom:1px solid rgba(0,71,249,.06);
}
.mob-si:last-child{border-bottom:none}
.mob-si:hover{background:#eef3ff;color:var(--blue)}
.mob-si svg{width:13px;height:13px;opacity:.45;flex-shrink:0}
.mob-si-lbl{font-size:9px;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:var(--blue);display:block;margin-bottom:1px}
.mob-foot{padding:1.2rem;border-top:1px solid var(--border);display:flex;flex-direction:column;gap:10px;flex-shrink:0}
.mob-p{
  display:flex;align-items:center;justify-content:center;gap:8px;
  padding:13px;background:var(--blue);color:white;
  border-radius:10px;font-size:13px;font-weight:800;
  text-decoration:none;transition:background .2s;
}
.mob-p:hover{background:var(--navy)}
.mob-p svg{width:14px;height:14px}
.mob-sf{
  display:flex;align-items:center;gap:10px;
  padding:11px 14px;border:1px solid var(--border);
  border-radius:10px;font-size:12px;font-family:'Exo 2',sans-serif;
  color:#9ab;background:var(--gray);cursor:pointer;
}
.mob-sf svg{width:14px;height:14px;flex-shrink:0}

/* ════════════════════════════
   HERO
════════════════════════════ */
.hero{
	min-height:calc(100vh - 98px);
	background: #0099e8;
	background-image: url("../../imagens/familia2.png");
	background-position: right bottom;
	background-size: contain;
	background-repeat: no-repeat;
	position:relative;
	overflow:hidden;
	display:flex;
	flex-direction:column
}


.hero-gfx{position:absolute;inset:0;pointer-events:none;overflow:hidden}
.hero-body{flex:1;display:grid;grid-template-columns:1fr 1fr;align-items:center;padding-top:4rem;padding-bottom:3rem;position:relative;z-index:2}
.hero-left{color:var(--white)}
.htag{display:inline-flex;align-items:center;gap:8px;background:rgba(255,255,255,.12);border:1px solid rgba(255,255,255,.25);border-radius:100px;padding:5px 14px;margin-bottom:1.8rem}
.htag-dot{width:7px;height:7px;border-radius:50%;background:var(--cyan)}
.htag-t{font-size:11px;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:var(--cyan)}
.htitle{font-size:clamp(2.8rem,5.5vw,4.8rem);font-weight:900;line-height:1.02;letter-spacing:-.025em;margin-bottom:1.4rem}
.htitle .hl{color:var(--cyan)}
.htitle .thin{font-weight:300;display:block;font-size:.5em;letter-spacing:.08em;text-transform:uppercase;margin-bottom:.2em;opacity:.8}
.hdesc{font-size:1rem;line-height:1.75;opacity:.82;max-width:420px;margin-bottom:2.2rem}
.hbtns{display:flex;gap:12px;flex-wrap:wrap}
.btn{display:inline-flex;align-items:center;gap:8px;padding:12px 24px;font-family:'Exo 2',sans-serif;font-size:12.5px;font-weight:700;letter-spacing:.05em;text-transform:uppercase;border-radius:8px;text-decoration:none;transition:all .22s var(--ease)}
.btn-w{background:var(--white);color:var(--blue)}.btn-w:hover{background:var(--cyan);color:var(--navy);transform:translateY(-2px)}
.btn-o{background:transparent;border:2px solid rgba(255,255,255,.4);color:var(--white)}.btn-o:hover{border-color:var(--cyan);color:var(--cyan)}
.hstats{display:flex;gap:0;margin-top:2.5rem;padding-top:2rem;border-top:1px solid rgba(255,255,255,.18)}
.hs{flex:1;padding-right:0;border-right:1px solid rgba(255,255,255,.15);margin-right:2rem}
.hs:last-child{border-right:none;margin-right:0;padding-right:0}
.hs-n{font-size:1.8rem;font-weight:800;color:var(--white);line-height:1;letter-spacing:-.02em}
.hs-n span{color:var(--cyan)}
.hs-l{font-size:10px;font-weight:600;letter-spacing:.1em;text-transform:uppercase;opacity:.55;margin-top:3px}
.hero-rp{display:flex;align-items:center;justify-content:center;padding:2rem 1rem 2rem 2rem;position:relative;z-index:2}
.hcard{background:rgba(255,255,255,.11);backdrop-filter:blur(12px);border:1px solid rgba(255,255,255,.2);border-radius:20px;padding:2rem;width:100%;max-width:420px}
.hct{font-size:10px;font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:var(--cyan);margin-bottom:1.4rem}
.hcc{display:flex;align-items:center;gap:1.5rem}
.hcc svg{flex-shrink:0}
.hcl{}
.hcli{display:flex;align-items:center;gap:10px;margin-bottom:.9rem}
.hcli:last-child{margin-bottom:0}
.hcd{width:10px;height:10px;border-radius:3px;flex-shrink:0}
.hcln{font-size:12px;font-weight:600;color:rgba(255,255,255,.7);flex:1}
.hclv{font-size:16px;font-weight:800;color:var(--white)}
.hcdiv{border:none;border-top:1px solid rgba(255,255,255,.15);margin:1.4rem 0}
.hcb{display:flex;justify-content:space-between;align-items:flex-end}
.hcp{font-size:10px;font-weight:600;letter-spacing:.1em;text-transform:uppercase;color:rgba(255,255,255,.45)}
.hcpv{font-size:1.3rem;font-weight:900;color:var(--white);margin-top:2px}
.hcpv span{font-size:.7em;font-weight:400;opacity:.55}

/* Strip */
.strip{background:var(--navy);padding-top:16px;padding-bottom:16px;display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:1rem;border-top:1px solid rgba(2,188,251,.2);position:relative;z-index:2}
.si{display:flex;align-items:center;gap:9px}
.si-ico{width:30px;height:30px;background:rgba(2,188,251,.15);border-radius:7px;display:flex;align-items:center;justify-content:center;flex-shrink:0}
.si-ico svg{width:14px;height:14px}
.si-n{font-size:1.7rem;font-weight:800;color:var(--white);line-height:1}
.si-l{font-size:9px;font-weight:600;text-transform:uppercase;letter-spacing:.1em;color:rgba(255,255,255,.4);margin-top:1px}

/* ════════════════════════════
   SEÇÃO / CARDS
════════════════════════════ */
.section{padding-top:80px;padding-bottom:80px}
.sec-tag{display:inline-flex;align-items:center;gap:8px;font-size:11px;font-weight:700;letter-spacing:.15em;text-transform:uppercase;color:var(--blue);margin-bottom:1rem}
.sec-tag::before{content:'';display:block;width:20px;height:3px;background:var(--blue);border-radius:2px}
.sec-title{font-size:clamp(1.9rem,3.5vw,2.8rem);font-weight:800;letter-spacing:-.02em;line-height:1.1;color:var(--dark);margin-bottom:.8rem}
.sec-title .hl{
	color:var(--blue);
	font-family: "Style Script", cursive;
	font-size: 4rem;
}
.section-navy .sec-title { color: #fff; }
.sec-sub{font-size:.95rem;color:var(--mid);max-width:520px;line-height:1.75}
.ghd{display:flex;align-items:flex-end;justify-content:space-between;margin-bottom:2.5rem;gap:1.5rem;flex-wrap:wrap}
.gcnt{font-size:12px;color:#aaa;font-weight:600;letter-spacing:.05em}

/* ════ BENTO GRID — navegação de capítulos ════ */
.bento{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:14px;
}
.bc{
  border-radius:20px;padding:1.8rem;
  position:relative;overflow:hidden;
  cursor:pointer;
  transition:transform .28s var(--ease),box-shadow .28s var(--ease);
  display:flex;flex-direction:column;justify-content:space-between;
  min-height:200px;
}
.bc:hover{transform:translateY(-4px) scale(1.01);box-shadow:0 20px 56px rgba(0,5,111,.16)}
.bc-2{grid-column:span 2}
.bc-3{grid-column:span 3}
/* Temas */
.bc-light{background:var(--white);border:1px solid var(--border)}
.bc-blue{background:var(--blue);color:white}
.bc-navy{background:var(--navy);color:white}
.bc-soft{background:#eef3ff;border:1px solid rgba(0,71,249,.12)}
.bc-cyan{background:var(--cyan)}
.bc-gray{background:#f0f2f8;border:1px solid var(--border)}
/* Número decorativo de fundo */
.bc-bg-num{
  position:absolute;right:-8px;bottom:-20px;
  font-size:9rem;font-weight:900;line-height:1;
  opacity:.06;letter-spacing:-.05em;
  user-select:none;pointer-events:none;color:currentColor;
}
.bc-blue .bc-bg-num,.bc-navy .bc-bg-num{opacity:.15;color:white}
.bc-soft .bc-bg-num,.bc-gray .bc-bg-num{color:var(--blue)}
/* Label */
.bc-lbl{font-size:9px;font-weight:700;letter-spacing:.18em;text-transform:uppercase;opacity:.5;margin-bottom:.5rem}
.bc-blue .bc-lbl,.bc-navy .bc-lbl{color:white}
.bc-soft .bc-lbl,.bc-light .bc-lbl,.bc-gray .bc-lbl{color:var(--blue);opacity:.65}
.bc-cyan .bc-lbl{color:var(--navy)}
/* Título */
.bc-title{font-size:1.25rem;font-weight:800;line-height:1.15;letter-spacing:-.02em;margin-bottom:.55rem}
.bc-light .bc-title,.bc-soft .bc-title,.bc-gray .bc-title{color:var(--dark)}
.bc-blue .bc-title,.bc-navy .bc-title{color:white}
.bc-cyan .bc-title{color:var(--navy)}
.bc-2 .bc-title{font-size:1.55rem}
/* Descrição */
.bc-desc{font-size:.8rem;line-height:1.65;flex:1;margin-bottom:1rem}
.bc-light .bc-desc,.bc-soft .bc-desc,.bc-gray .bc-desc{color:var(--mid)}
.bc-blue .bc-desc,.bc-navy .bc-desc{color:rgba(255,255,255,.65)}
.bc-cyan .bc-desc{color:rgba(0,5,111,.6)}
/* Stat */
.bc-stat{font-size:2.8rem;font-weight:900;line-height:1;letter-spacing:-.04em;margin-bottom:.3rem}
.bc-stat-l{font-size:.72rem;font-weight:600;opacity:.55;text-transform:uppercase;letter-spacing:.1em}
/* Botão */
.bc-btn{
  display:inline-flex;align-items:center;gap:7px;align-self:flex-start;
  padding:8px 16px;border-radius:100px;
  font-family:'Exo 2',sans-serif;font-size:11px;font-weight:800;
  letter-spacing:.06em;text-transform:uppercase;
  border:none;cursor:pointer;
  transition:gap .18s,transform .18s;
  text-decoration: none;
}
.bc-light .bc-btn,.bc-soft .bc-btn,.bc-gray .bc-btn{background:var(--blue);color:white}
.bc-blue .bc-btn{background:white;color:var(--blue)}
.bc-navy .bc-btn{background:var(--cyan);color:var(--navy)}
.bc-cyan .bc-btn{background:var(--navy);color:white}
.bc-btn:hover{gap:11px;transform:translateX(2px)}
.bc-btn svg{width:10px;height:10px;flex-shrink:0}
.bc-foot{display:flex;align-items:flex-end;justify-content:space-between;gap:1rem;margin-top:auto}
/* Responsive */
@media(max-width:900px){
  .bento{grid-template-columns:1fr 1fr}
  .bc-2,.bc-3{grid-column:span 2}
}
@media(max-width:560px){
  .bento{grid-template-columns:1fr}
  .bc-2,.bc-3{grid-column:span 1}
  .bc{min-height:160px;padding:1.4rem}
  .bc-bg-num{font-size:6rem}
}

/* ── POPUP OVERLAY ── */
.pop-overlay{
  display:none;position:fixed;inset:0;
  background:rgba(0,5,111,.55);
  z-index:1000;
  backdrop-filter:blur(4px);
  align-items:center;justify-content:center;
  padding:1.5rem;
}
.pop-overlay.show{display:flex;animation:popFade .2s var(--ease)}
@keyframes popFade{from{opacity:0}to{opacity:1}}
.pop-box{
  background:var(--white);
  border-radius:16px;
  box-shadow:0 24px 80px rgba(0,5,111,.3);
  width:100%;max-width:640px;
  max-height:90vh;overflow:hidden;
  display:flex;flex-direction:column;
  animation:popUp .22s var(--ease);
}
@keyframes popUp{from{opacity:0;transform:translateY(16px)}to{opacity:1;transform:translateY(0)}}
.pop-head{
  background:linear-gradient(100deg,var(--navy),var(--blue));
  padding:1.4rem 1.6rem;
  display:flex;align-items:center;justify-content:space-between;gap:1rem;
  flex-shrink:0;
}
.pop-head-left{}
.pop-cap-lbl{font-size:9px;font-weight:700;letter-spacing:.18em;text-transform:uppercase;color:rgba(255,255,255,.45);margin-bottom:.25rem}
.pop-title{font-size:1.3rem;font-weight:900;color:var(--white);line-height:1.15}
.pop-x{
  width:32px;height:32px;border-radius:8px;flex-shrink:0;
  border:1px solid rgba(255,255,255,.25);background:rgba(255,255,255,.1);
  cursor:pointer;display:flex;align-items:center;justify-content:center;
  transition:background .18s;
}
.pop-x:hover{background:rgba(255,255,255,.22)}
.pop-x svg{width:13px;height:13px}
.pop-body{overflow-y:auto;padding:.5rem 0}
.pop-item{
  display:flex;align-items:center;gap:12px;
  padding:12px 1.6rem;
  text-decoration:none;color:var(--dark);
  border-bottom:1px solid var(--border);
  transition:background .15s,color .15s;
}
.pop-item:last-child{border-bottom:none}
.pop-item:hover{background:var(--gray);color:var(--blue)}
.pop-num{font-size:9px;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:var(--blue);opacity:.55;flex-shrink:0;width:28px}
.pop-item-t{font-size:13px;font-weight:700;flex:1}
.pop-item-s{font-size:11px;color:#8899aa;margin-top:1px}
.pop-arr{font-size:14px;color:var(--blue);opacity:0;transition:opacity .15s,transform .15s}
.pop-item:hover .pop-arr{opacity:1;transform:translateX(3px)}

/* Tag pills */
.tpill{display:inline-block;padding:4px 11px;background:var(--blue-lt);border-radius:100px;font-size:11px;font-weight:700;color:var(--blue);margin:0 4px 4px 0}

/* ── MENSAGEM DE ABERTURA ── */
.ab-wrap{display:grid;grid-template-columns:260px 1fr;gap:4rem;align-items:start}
.ab-text p{font-size:1rem;line-height:1.85;color:var(--mid);margin-bottom:1.4rem}
.ab-text p:last-child{margin-bottom:0}
.ab-text p:first-child{font-size:1.06rem;color:var(--dark);font-weight:500}
@media(max-width:860px){.ab-wrap{grid-template-columns:1fr;gap:1.5rem}}

/* ── DICA CARROSSEL ── */
.dica{background:var(--cyan);padding-top:40px;padding-bottom:40px;display:flex;align-items:center;gap:2.5rem;flex-wrap:wrap;position:relative;overflow:hidden}
.dica-ico{width:54px;height:54px;flex-shrink:0;background:rgba(0,5,111,.15);border-radius:12px;display:flex;align-items:center;justify-content:center}
.dica-ico svg{width:27px;height:27px}
.dica-content{flex:1;min-width:0;position:relative}
.dica-lbl{font-size:10px;font-weight:700;letter-spacing:.15em;text-transform:uppercase;color:var(--navy);opacity:.65;margin-bottom:.4rem}
.dica-track{position:relative;overflow:hidden}
.dica-slide{opacity:0;position:absolute;top:0;left:0;right:0;transition:opacity .5s var(--ease);pointer-events:none}
.dica-slide.active{opacity:1;position:relative;pointer-events:auto}
.dica-t{font-size:1.3rem;font-weight:800;color:var(--navy);line-height:1.3}
.dica-dots{display:flex;gap:6px;margin-top:1rem}
.dica-dot{width:7px;height:7px;border-radius:50%;background:rgba(0,5,111,.2);cursor:pointer;transition:background .3s,transform .2s;border:none;padding:0;flex-shrink:0}
.dica-dot.on{background:var(--navy);transform:scale(1.3)}

/* ── GRAFISMO BAND ── */
.grafismo-band{background:linear-gradient(135deg,var(--navy),var(--blue) 60%,#0088dd);padding-top:60px;padding-bottom:60px;position:relative;overflow:hidden}
.gb-waves{position:absolute;inset:0;opacity:.16;pointer-events:none}
.gb-waves svg{width:100%;height:100%}
.gb-in{position:relative;z-index:2;display:grid;grid-template-columns:1fr 1fr;gap:4rem;align-items:center}
.gb-title{font-size:clamp(1.8rem,3vw,2.5rem);font-weight:800;color:var(--white);line-height:1.15;letter-spacing:-.02em;margin-bottom:1rem}
.gb-title .hl{
	color:var(--cyan);
	font-family: "Style Script";
	font-size: 3rem;
}
.gb-desc{font-size:.93rem;color:rgba(255,255,255,.75);line-height:1.75;margin-bottom:1.6rem}
.gb-nums{display:grid;grid-template-columns:1fr 1fr;gap:2px;border-radius:12px;overflow:hidden;background:rgba(255,255,255,.08)}
.gbn{background:rgba(255,255,255,.05);padding:1.6rem;transition:background .25s}
.gbn:hover{background:rgba(255,255,255,.1)}
.gbn-n{font-size:2.2rem;font-weight:900;color:var(--cyan);line-height:1;letter-spacing:-.03em}
.gbn-n sup{font-size:.42em;vertical-align:top;margin-top:7px;display:inline-block}
.gbn-l{font-size:.8rem;font-weight:700;color:var(--white);margin-top:.3rem}
.gbn-d{font-size:.72rem;color:rgba(255,255,255,.45);margin-top:.15rem;line-height:1.5}


/* ─── FOOTER ─── */
  footer { 
	background: var(--navy-dark); 
	color: rgba(255,255,255,0.6); 
	padding-top: 3rem;
	padding-bottom 2rem;
  }
  .footer-stats {
    border-bottom: 1px solid rgba(255,255,255,0.07);
    background: rgba(255,255,255,0.03);
  }
  .footer-stats-inner {
    max-width: 1020px;
    margin: 0 auto;
    padding: 32px 2rem;
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 24px;
  }
  @media (max-width: 700px) { .footer-stats-inner { grid-template-columns: repeat(2, 1fr); } }
  .footer-stat-item { text-align: center; }
  .footer-stat-num { font-size: 22px; font-weight: 800; color: #fff; letter-spacing: -0.02em; margin-bottom: 4px; }
  .footer-stat-num span { color: var(--cyan); }
  .footer-stat-label { font-size: 10px; font-weight: 600; letter-spacing: 0.1em; text-transform: uppercase; color: rgba(255,255,255,0.35); }
  .footer-main { max-width: 1020px; margin: 0 auto; padding: 48px 2rem 36px; display: grid; grid-template-columns: 1.8fr 1fr 1fr 1fr; gap: 40px; }
  @media (max-width: 860px) { .footer-main { grid-template-columns: 1fr 1fr; gap: 32px; } }
  @media (max-width: 500px) { .footer-main { grid-template-columns: 1fr; } }
  .footer-brand-logo { height: 28px; margin-bottom: 16px; filter: brightness(0) invert(1) opacity(0.85); }
  .footer-brand-desc { font-size: 13px; line-height: 1.7; color: rgba(255,255,255,0.4); max-width: 260px; }
  .footer-brand-links { display: flex; gap: 12px; margin-top: 20px; flex-wrap: wrap; }
  .footer-brand-link {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    font-size: 11px;
    color: rgba(255,255,255,0.45);
    text-decoration: none;
    border: 1px solid rgba(255,255,255,0.12);
    border-radius: 20px;
    padding: 5px 12px;
    transition: color 0.2s, border-color 0.2s;
  }
  .footer-brand-link:hover { color: var(--cyan); border-color: rgba(2,188,251,0.4); }
  .footer-col-title { font-size: 10px; font-weight: 700; letter-spacing: 0.14em; text-transform: uppercase; color: rgba(255,255,255,0.28); margin-bottom: 14px; }
  .footer-col a { display: block; font-size: 13px; color: rgba(255,255,255,0.45); text-decoration: none; margin-bottom: 8px; transition: color 0.2s; }
  .footer-col a:hover { color: var(--cyan); }
  .footer-bottom { border-top: 1px solid rgba(255,255,255,0.07); }
  .footer-bottom-inner { max-width: 1020px; margin: 0 auto; padding: 16px 2rem; display: block; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: 10px; }
  .footer-bottom-left { font-size: 11px; color: rgba(255,255,255,0.22); }
  .footer-bottom-right { display: flex; align-items: center; gap: 16px; }
  .footer-bottom-right a { font-size: 11px; color: rgba(255,255,255,0.28); text-decoration: none; transition: color 0.2s; }
  .footer-bottom-right a:hover { color: var(--cyan); }

/* ── REVEAL ── */
.rv{opacity:0;transform:translateY(22px);transition:opacity .6s var(--ease),transform .6s var(--ease)}
.rv.vis{opacity:1;transform:none}
.d1{transition-delay:.08s}.d2{transition-delay:.16s}.d3{transition-delay:.24s}

/* ── RESPONSIVE ── */
@media(max-width:1080px){
  .nav-items-bar,.nav-utils .nav-search-btn{display:none}
  .nav-burger{display:flex}
  .hero-body{grid-template-columns:1fr}
  .hero-rp{display:none}
  .hdesc{max-width:100%}
  .strip{padding-top:14px;padding-bottom:14px}
  .grafismo-band{padding-top:3rem;padding-bottom:3rem}
  .gb-in{grid-template-columns:1fr;gap:2rem}
  .dica{padding-top:2rem;padding-bottom:2rem}
  footer{padding-top:2.5rem;padding-bottom:1.5rem}
  .cg{columns:2}
}
@media(max-width:640px){
  .hero-body{padding-top:2rem;padding-bottom:1.5rem}
  .cg{columns:1}
  .gb-nums{grid-template-columns:1fr 1fr}
  .hstats{flex-direction:column;gap:1rem}
  .hs{border-right:none;margin-right:0;padding-right:0;border-bottom:1px solid rgba(255,255,255,.12);padding-bottom:1rem;margin-bottom:0}
  .hs:last-child{border-bottom:none}
  .mega-links.c3,.mega-links.c2{grid-template-columns:1fr}
}



.two-col {
  display: flex;
  gap: 24px;
  align-items: flex-start;
}

.two-col > * {
  flex: 1;
  min-width: 0; /* evita que imagens "estourem" o flex item */
}

.two-col img {
  width: 100%;
  height: auto;
  display: block;
}

@media (max-width: 768px) {
  .two-col {
    flex-direction: column;
    gap: 16px;
  }
}