/* Partilhado pelos posts, pelo blog e pelos cursos (08/10/2026): o salto para o conteúdo,
   o foco visível, a página atual no menu, o menu no telemóvel, a barra de leitura, a data e o
   tempo de leitura, o artigo anterior e o seguinte, e a seta das ligações para fora do site. */
.skip-link{position:absolute;top:-100px;left:1rem;background:var(--gold);color:#0B0B09;padding:.5rem 1rem;border-radius:3px;font-size:.85rem;font-weight:500;z-index:300;text-decoration:none}
.skip-link:focus{top:1rem}
a:focus-visible,button:focus-visible{outline:2px solid var(--gold);outline-offset:2px;border-radius:2px}
.nav-links a[aria-current]{color:var(--text)}

.menu-btn{display:none;align-items:center;justify-content:center;flex-direction:column;gap:4px;background:none;border:1px solid var(--border-md);border-radius:3px;padding:.45rem .5rem;cursor:pointer;margin-left:.5rem}
.menu-btn span{display:block;width:18px;height:1.5px;background:var(--muted);border-radius:2px;transition:transform .25s,opacity .25s}
.menu-btn[aria-expanded="true"] span:nth-child(1){transform:translateY(5.5px) rotate(45deg)}
.menu-btn[aria-expanded="true"] span:nth-child(2){opacity:0}
.menu-btn[aria-expanded="true"] span:nth-child(3){transform:translateY(-5.5px) rotate(-45deg)}
.menu-painel{position:fixed;left:0;right:0;top:var(--menu-topo,64px);background:var(--bg);border-bottom:1px solid var(--border-md);z-index:120;padding:.5rem 1.25rem 1rem}
.menu-painel[hidden]{display:none}
.menu-painel ul{list-style:none;margin:0;padding:0}
.menu-painel a{display:block;padding:.9rem 0;border-bottom:1px solid var(--border);color:var(--muted);text-decoration:none;font-size:1rem}
.menu-painel a[aria-current]{color:var(--text)}
/* No telemóvel (08/10/2026): o topo leva o nome, EN/PT e o menu, com alvos de toque de 44 px;
   o botão do tema passa para dentro do menu, para o topo caber em 375 px. */
.menu-tema{display:flex;align-items:center;gap:.6rem;width:100%;min-height:48px;background:none;border:0;border-bottom:1px solid var(--border);color:var(--muted);font:inherit;font-size:1rem;text-align:left;cursor:pointer;padding:0}
@media(max-width:640px){
  .menu-btn{display:flex;width:44px;height:44px}
  nav .wrap{padding-left:1.25rem;padding-right:1.25rem}
  #nav,#nav.scrolled{padding-top:.5rem;padding-bottom:.5rem}
  .nav-inner{gap:.6rem}
  .lang-toggle{margin-left:auto}
  .lang-btn{min-height:44px;min-width:40px}
  .theme-btn{display:none}
  .menu-painel a{min-height:48px;display:flex;align-items:center}
  .post-back{display:inline-block;padding:.75rem 0}
}

.leitura-barra{position:fixed;top:0;left:0;height:2px;width:0;background:var(--gold);z-index:250;pointer-events:none}

.post-meta{font-size:.78rem;color:var(--faint);letter-spacing:.04em;margin:0 0 1.25rem}
.post-item-meta{font-size:.72rem;color:var(--faint);letter-spacing:.04em;margin-top:.5rem}
.post-nav{position:static;padding:0;border:0;background:none;z-index:auto;transition:none;display:grid;grid-template-columns:1fr 1fr;gap:1rem;margin-top:3rem}
.post-nav a{display:block;padding:1rem 1.25rem;border:1px solid var(--border-md);border-radius:4px;text-decoration:none;color:var(--text);transition:border-color .2s}
.post-nav a:hover{border-color:var(--gold)}
.post-nav .pn-seguinte{grid-column:2;text-align:right}
.pn-rotulo{display:block;font-size:.68rem;letter-spacing:.08em;text-transform:uppercase;color:var(--faint)}
.pn-titulo{display:block;font-family:var(--font-ser);font-size:1.1rem;line-height:1.3;margin-top:.3rem}
@media(max-width:640px){.post-nav{grid-template-columns:1fr}.post-nav .pn-seguinte{grid-column:1}}
.page-rss{margin-top:1rem;font-size:.75rem;letter-spacing:.06em}
.page-rss a{color:var(--faint)}

a[target="_blank"]::after{content:"\00a0\2197";font-size:.85em}

/* No telemóvel, tudo o que se toca tem pelo menos 44 px e nenhum texto fica abaixo de 12 px.
   O logótipo ganha uma área de toque invisível à volta, sem mudar o desenho do topo. */
@media(max-width:640px){
  .nav-logo{position:relative}
  .nav-logo::before{content:"";position:absolute;left:-4px;right:-4px;top:50%;height:44px;transform:translateY(-50%)}
  .course-back{min-height:44px}
  .skip-link{padding:.8rem 1rem}
  .related-link{display:inline-flex;align-items:center;min-height:44px}
  .lang-btn,.section-label,.post-item-tag,.post-item-meta,.post-meta,.post-eyebrow,.related-courses-label,
  .related-course-card .rc-tag,.pn-rotulo,.footer-copy,.course-tag,.course-facts b,.course-section-label,
  .course-cta-label,.course-meta-block h4,.related-courses h4,.page-rss{font-size:.75rem}
}
