/* Navbar (topbar sticky + side dock + reading progress) — PT / ES / EN */

/* ---------- TOPBAR (sticky em todos os tamanhos) ---------- */
.nav{
  position:sticky;top:0;z-index:100;
  background:rgba(4,44,83,.98);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);
  padding:10px 22px;
  display:flex;align-items:center;justify-content:space-between;gap:12px;
  flex-wrap:nowrap;
}
.nav-brand{
  font-size:13px;font-weight:700;color:#fff;text-decoration:none;
  letter-spacing:-.3px;flex-shrink:1;min-width:0;
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis;
}
.nav-brand span{color:#7EC8F8}

.nav-links{
  display:flex;align-items:center;gap:6px 16px;flex-wrap:nowrap;
}
.nav-links > a,
.nav-more > summary{
  font-size:11.5px;color:rgba(255,255,255,.78);text-decoration:none;font-weight:500;
  white-space:nowrap;transition:color .2s;
}
.nav-links > a:hover{color:#fff}
.nav-links > a.nav-cta{
  background:rgba(126,200,248,.22);border:1px solid rgba(126,200,248,.45);
  color:#fff;font-weight:700;padding:6px 14px;border-radius:20px;font-size:11px;
}
.nav-links > a.nav-cta:hover{background:rgba(126,200,248,.4);color:#fff}

.nav-more{position:relative}
.nav-more > summary{
  list-style:none;cursor:pointer;padding:6px 10px;border-radius:8px;
  display:flex;align-items:center;gap:4px;
}
.nav-more > summary::-webkit-details-marker{display:none}
.nav-more > summary::after{
  content:"";width:0;height:0;border-left:4px solid transparent;border-right:4px solid transparent;
  border-top:5px solid rgba(255,255,255,.55);margin-top:2px;
}
.nav-more[open] > summary{background:rgba(255,255,255,.1);color:#fff}
.nav-more-panel{
  position:absolute;top:calc(100% + 8px);right:0;min-width:210px;
  background:#fff;border-radius:12px;box-shadow:0 12px 40px rgba(0,0,0,.22);
  padding:8px;display:flex;flex-direction:column;z-index:200;
}
.nav-more-panel a{
  font-size:12.5px;color:var(--texto,#1a1a18);text-decoration:none;
  padding:10px 12px;border-radius:8px;font-weight:500;
}
.nav-more-panel a:hover{background:var(--azul-bg,#E6F1FB);color:var(--azul2,#185FA5)}

.nav-actions{display:flex;align-items:center;gap:8px;flex-shrink:0}
.lang-switch{display:flex;gap:4px;align-items:center}
.lang-switch a{
  font-size:10px;color:rgba(255,255,255,.65);text-decoration:none;
  padding:4px 8px;border-radius:12px;border:1px solid rgba(255,255,255,.16);
}
.lang-switch a:hover,.lang-switch a.active{background:rgba(255,255,255,.14);color:#fff}

.nav-menu-btn{
  display:none;background:none;border:none;cursor:pointer;padding:6px;
  flex-direction:column;gap:5px;align-items:center;justify-content:center;
  width:36px;height:36px;flex-shrink:0;
}
.nav-menu-btn span{
  display:block;width:22px;height:2px;background:#fff;border-radius:2px;transition:all .3s;
}
.nav-lang-mobile{display:none}

/* ---------- BREAKPOINT INTERMEDIÁRIO: ainda cabe muita coisa (≤1099px) ---------- */
@media(max-width:1099px){
  .nav-brand{font-size:12px;max-width:46%}
  .nav-links > a{font-size:10.5px}
  .nav-links{gap:4px 12px}
}

/* ---------- MOBILE (≤768px): logo + cadastro + hambúrguer; tudo o mais no drawer ---------- */
@media(max-width:768px){
  .nav{padding:9px 14px;position:sticky;top:0}
  .nav-brand{font-size:12px;max-width:calc(100% - 130px)}
  .nav-menu-btn{display:flex!important}
  .nav-actions{gap:6px}
  .lang-switch.nav-lang-desk{display:none}

  /* Botão Cadastro compacto na topbar mobile (sempre visível) */
  .nav-cta-mobile{
    display:inline-flex!important;align-items:center;justify-content:center;
    background:var(--azul3,#378ADD);color:#fff;font-size:11px;font-weight:700;
    padding:7px 12px;border-radius:999px;text-decoration:none;letter-spacing:.2px;
    border:none;
  }
  .nav-cta-mobile:hover{background:var(--azul2,#185FA5);color:#fff}

  /* Drawer: links empilhados (esconde só na topbar; aparece quando .open) */
  .nav-links{
    display:none!important;
    position:absolute;top:100%;left:0;right:0;
    background:rgba(4,44,83,.99);
    flex-direction:column;align-items:stretch;
    padding:8px 16px 16px;gap:0;
    border-top:1px solid rgba(255,255,255,.1);
    max-height:min(80vh,560px);overflow-y:auto;
  }
  .nav-links.open{display:flex!important}
  .nav-links > a{
    padding:12px 0;font-size:14px;border-bottom:1px solid rgba(255,255,255,.08);
    color:rgba(255,255,255,.92)!important;
  }
  .nav-links > a.nav-cta{
    margin-top:8px;text-align:center;border-bottom:none;
    background:var(--azul2,#185FA5);border-color:transparent;font-size:13px;padding:12px;
  }

  .nav-more{display:block;width:100%}
  .nav-more > summary{
    padding:12px 0;font-size:14px;border-bottom:1px solid rgba(255,255,255,.08);
    color:rgba(255,255,255,.92);width:100%;
  }
  .nav-more-panel{
    position:static;box-shadow:none;background:transparent;padding:0 0 8px 12px;
    min-width:0;
  }
  .nav-more-panel a{
    color:rgba(255,255,255,.82);padding:10px 0;border-radius:0;font-size:13px;
    border-bottom:1px solid rgba(255,255,255,.06);
  }
  .nav-more-panel a:hover{background:transparent;color:#fff}

  .nav-lang-mobile{
    display:flex;gap:8px;padding-top:12px;margin-top:4px;
    border-top:1px solid rgba(255,255,255,.12);
  }
  .nav-lang-mobile a{
    flex:1;text-align:center;padding:8px;border-radius:8px;
    font-size:12px;font-weight:600;color:rgba(255,255,255,.8);
    text-decoration:none;border:1px solid rgba(255,255,255,.2);
  }
  .nav-lang-mobile a.active{background:rgba(255,255,255,.15);color:#fff}
}

/* Em desktop o botão mobile-cta não existe */
.nav-cta-mobile{display:none}

/* ================== SIDE DOCK (desktop only) ================== */
.side-dock{
  position:fixed;top:50%;right:18px;transform:translateY(-50%);
  z-index:90;opacity:0;pointer-events:none;transition:opacity .25s ease;
}
.side-dock.show{opacity:1;pointer-events:auto}
.side-dock ol{
  list-style:none;margin:0;padding:10px 8px;
  background:rgba(255,255,255,.82);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);
  border:1px solid rgba(12,68,124,.12);
  border-radius:24px;box-shadow:0 10px 30px rgba(8,15,28,.12);
  display:flex;flex-direction:column;gap:2px;
}
.side-dock a{
  position:relative;display:flex;align-items:center;justify-content:center;
  width:28px;height:28px;text-decoration:none;border-radius:14px;
  transition:background .2s;
}
.side-dock .sd-dot{
  width:6px;height:6px;border-radius:50%;
  background:rgba(12,68,124,.35);transition:all .25s ease;
  display:block;
}
.side-dock a:hover .sd-dot{background:var(--azul,#0C447C);transform:scale(1.3)}
.side-dock a.active .sd-dot{
  background:var(--azul,#0C447C);transform:scale(1.5);
  box-shadow:0 0 0 4px rgba(12,68,124,.14);
}
.side-dock .sd-lbl{
  position:absolute;right:calc(100% + 10px);top:50%;transform:translateY(-50%) translateX(6px);
  background:#0C447C;color:#fff;font-size:11px;font-weight:600;letter-spacing:.2px;
  padding:6px 12px;border-radius:8px;white-space:nowrap;
  opacity:0;pointer-events:none;transition:opacity .2s ease, transform .2s ease;
  box-shadow:0 6px 18px rgba(0,0,0,.18);
}
.side-dock .sd-lbl::after{
  content:"";position:absolute;left:100%;top:50%;transform:translateY(-50%);
  border:5px solid transparent;border-left-color:#0C447C;
}
.side-dock a:hover .sd-lbl,
.side-dock a:focus-visible .sd-lbl{opacity:1;transform:translateY(-50%) translateX(0)}
@media(max-width:1099px){ .side-dock{display:none} }

/* ================== READING PROGRESS BAR (mobile only) ================== */
.read-progress{
  position:fixed;left:0;right:0;top:0;height:3px;z-index:200;
  background:transparent;pointer-events:none;display:none;
}
.read-progress-fill{
  height:100%;background:linear-gradient(90deg,#4ADE80 0%,#7EC8F8 100%);width:0;
  transition:width .12s linear;
  box-shadow:0 0 8px rgba(126,200,248,.55);
}
@media(max-width:768px){
  .read-progress{display:block}
}