/* Academia HIPNOPORTO. Desenho aprovado a 4 Nov 2026 (proposta/maquetas2). */
@font-face { font-family: 'Lato'; font-style: normal; font-weight: 300; font-display: swap; src: url(fonts/lato-300.woff2) format('woff2'); }
@font-face { font-family: 'Lato'; font-style: normal; font-weight: 400; font-display: swap; src: url(fonts/lato-400.woff2) format('woff2'); }
@font-face { font-family: 'Lato'; font-style: italic; font-weight: 400; font-display: swap; src: url(fonts/lato-400i.woff2) format('woff2'); }
@font-face { font-family: 'Lato'; font-style: normal; font-weight: 700; font-display: swap; src: url(fonts/lato-700.woff2) format('woff2'); }

:root { --fundo:#F4EEE3; --fundo2:#EAE2D2; --azul:#1B2266; --texto:#1B2266; --cinza:#575B70; --linha:#CFC4AE; --ouro:#B8913A; --ouro-claro:#E2C27A; }
* { box-sizing:border-box; margin:0; padding:0; }
html { -webkit-text-size-adjust:100%; }
body { background:var(--fundo); color:var(--texto); font:400 18px/1.6 'Lato', Arial, sans-serif; }
img { display:block; max-width:100%; height:auto; }
a { color:inherit; }
:focus-visible { outline:2px solid var(--ouro); outline-offset:3px; }
.wrap { max-width:1320px; margin:0 auto; padding:0 40px; }
h1, h2, h3 { font-weight:400; letter-spacing:-0.01em; }
.saltar { position:absolute; left:-9999px; top:0; background:var(--azul); color:#fff; padding:10px 16px; z-index:100; }
.saltar:focus { left:12px; top:12px; }
.escondido { position:absolute !important; left:-9999px !important; width:1px; height:1px; overflow:hidden; }
.opc:empty, .so-editar { display:none; }
.ahp-editando .opc:empty, .ahp-editando .so-editar { display:block; }
.so-editar { font-size:15px; color:var(--cinza); margin-top:8px; }

/* cabeçalho */
.cab { border-bottom:1px solid var(--texto); position:relative; }
.cab .wrap { display:flex; align-items:center; height:84px; }
.marca { display:flex; align-items:center; gap:14px; text-decoration:none; font-size:24px; min-height:48px; }
.marca img { width:44px; height:44px; }
.cab nav { margin-left:auto; display:flex; gap:34px; font-size:18px; }
.cab nav a { text-decoration:none; padding-bottom:4px; border-bottom:2px solid transparent; }
.cab nav a.on { border-bottom-color:var(--ouro); }
.cab nav a:hover { border-bottom-color:var(--linha); }
.menu { display:none; margin-left:auto; font:inherit; font-size:19px; background:none; border:0; color:var(--texto); min-height:44px; min-width:44px; cursor:pointer; }

/* botões e ligações */
.btn { display:inline-block; background:var(--azul); color:#fff; text-decoration:none; font-weight:700; font-size:17px; line-height:1.3; padding:13px 24px; border:1.5px solid var(--azul); min-height:48px; text-align:center; cursor:pointer; font-family:inherit; }
.btn.claro { background:transparent; color:var(--azul); }
.btn.largo { display:block; width:100%; }
.ligacao { text-decoration:underline; text-underline-offset:4px; }
.volta { display:inline-block; margin-top:22px; font-size:16px; color:var(--cinza); min-height:44px; line-height:44px; }

/* barra de factos */
.barra-w { background:var(--azul); color:#fff; display:flex; align-items:stretch; }
.barra { display:flex; align-items:stretch; flex:1 1 auto; flex-wrap:wrap; }
.barra > div { padding:12px 18px; font-size:16px; line-height:1.35; }
.barra b { display:block; font-weight:400; color:var(--ouro-claro); font-size:14px; }
.barra-w .acc { margin-left:auto; display:flex; align-items:center; padding:10px 12px; flex:0 0 auto; }
.barra-w .btn { background:var(--ouro-claro); color:var(--azul); border-color:var(--ouro-claro); }
.estado { font-size:16px; margin-top:10px; color:var(--cinza); }

/* capas */
.capa { background:var(--azul); color:#fff; aspect-ratio:4/3; padding:26px 28px; display:flex; flex-direction:column; position:relative; overflow:hidden; }
.capa .d { font-size:96px; line-height:.9; font-weight:300; letter-spacing:-0.03em; position:relative; }
.capa.longo .d { font-size:72px; }
.capa .m { font-size:20px; color:var(--ouro-claro); margin-top:10px; position:relative; }
.capa .t { margin-top:auto; font-size:24px; line-height:1.15; font-weight:700; max-width:11em; position:relative; }
.capa .l { font-size:15px; color:#C9CDE6; margin-top:8px; position:relative; }
.capa .circ { position:absolute; right:-70px; top:-70px; width:260px; height:260px; border:1.5px solid var(--ouro-claro); border-radius:50%; opacity:.55; }
.capa .circ.b { right:-20px; top:-110px; width:220px; height:220px; opacity:.35; }
.capa.ouro { background:var(--ouro-claro); color:var(--azul); }
.capa.ouro .m, .capa.ouro .l { color:var(--azul); }
.capa.ouro .circ { border-color:var(--azul); opacity:.3; }
.capa.creme { background:var(--fundo2); color:var(--azul); }
.capa.creme .m { color:var(--ouro); }
.capa.creme .l { color:var(--cinza); }
.capa.creme .circ { border-color:var(--ouro); }
.capa-l { display:block; text-decoration:none; }
.capa.larga { flex-direction:row; align-items:flex-end; gap:40px; aspect-ratio:16/5; padding:34px 40px; margin-top:40px; }
.capa.larga .d { font-size:150px; line-height:.85; letter-spacing:-0.04em; }
.capa.larga.longo .d { font-size:110px; }
.capa.larga .m { font-size:24px; padding-bottom:10px; }
.capa.larga .circ { right:-80px; top:-120px; width:420px; height:420px; opacity:.5; }
.capa.larga .circ.b { right:60px; top:-200px; width:380px; height:380px; opacity:.3; }
.capa.larga.ouro .circ { opacity:.3; }

/* página inicial */
.abre { padding:72px 0 56px; }
.abre h1 { font-size:76px; line-height:1.02; max-width:12em; font-weight:300; }
.abre p { font-size:22px; color:var(--cinza); margin-top:22px; max-width:30em; }
.turmas { display:grid; grid-template-columns:repeat(3,1fr); gap:12px; margin-top:48px; }
.turmas .foto { aspect-ratio:2/1; background:var(--fundo2) center/cover; }
.agenda { border-top:1px solid var(--texto); padding-top:40px; }
.agenda h2, .bloco h2 { font-size:56px; font-weight:300; margin-bottom:28px; }
.ed { display:grid; grid-template-columns:1fr 380px; gap:48px; padding:36px 0 40px; border-top:1px solid var(--linha); }
.ed .quando { font-weight:700; font-size:18px; }
.ed h3 { font-size:38px; line-height:1.15; margin:6px 0 12px; font-weight:400; }
/* O título da agenda é uma ligação: com uma linha só, fica com pelo menos 44 px de altura para o dedo. */
.ed h3 a { text-decoration:none; display:inline-block; min-height:44px; padding:2px 0; }
.ed h3 a:hover { text-decoration:underline; text-underline-offset:6px; text-decoration-thickness:1px; }
.ed p.frase { font-size:19px; color:var(--cinza); max-width:36em; margin-bottom:22px; }
.bloco { border-top:1px solid var(--texto); padding:44px 0 60px; }
.dupla { display:grid; grid-template-columns:1fr 1fr; gap:48px; }
.pessoa { display:grid; grid-template-columns:180px 1fr; gap:28px; align-items:start; }
.pessoa .foto { width:180px; height:180px; background:var(--fundo2) center 20% / cover; }
.pessoa h3 { font-size:30px; margin:0 0 8px; }
.pessoa p { color:var(--cinza); font-size:18px; max-width:30em; }
.opinioes { display:grid; grid-template-columns:repeat(3,1fr); gap:48px; }
.op blockquote { font-size:19px; line-height:1.55; }
.op .quem { margin-top:14px; font-size:15px; color:var(--cinza); }
.onde { display:grid; grid-template-columns:7fr 5fr; gap:48px; align-items:start; }
.onde .foto { aspect-ratio:4/3; background:var(--fundo2) center/cover; }
.onde p { font-size:19px; margin-bottom:12px; }

/* página de uma formação */
.topo { padding:26px 0 44px; }
.topo .quando { font-weight:700; }
.topo h1 { font-size:72px; line-height:1.03; font-weight:300; margin:8px 0 18px; max-width:12em; }
.topo p.frase { font-size:22px; color:var(--cinza); max-width:30em; margin-bottom:28px; }
.bloco .sub { color:var(--cinza); margin:-12px 0 22px; max-width:46em; }
.bloco .nota { color:var(--cinza); margin-top:18px; max-width:46em; }
.texto p { font-size:19px; max-width:40em; margin-bottom:14px; }
.inclui { list-style:none; columns:2; column-gap:48px; font-size:19px; max-width:900px; }
.inclui li { padding:10px 0; border-bottom:1px solid var(--linha); break-inside:avoid; }
.itens { list-style:none; max-width:900px; }
.itens li { padding:16px 0; border-bottom:1px solid var(--linha); }
.itens li:first-child { border-top:1px solid var(--linha); }
.itens h3 { font-size:22px; line-height:1.3; }
.itens p { color:var(--cinza); margin-top:4px; }
details { border-top:1px solid var(--linha); max-width:900px; }
.mods details:last-child, .perguntas details:last-child { border-bottom:1px solid var(--linha); }
summary { list-style:none; cursor:pointer; display:flex; justify-content:space-between; align-items:center; gap:20px; padding:18px 0; font-size:24px; line-height:1.25; min-height:60px; }
summary::-webkit-details-marker { display:none; }
summary::after { content:'+'; font-size:28px; font-weight:300; flex:0 0 auto; }
details[open] > summary::after { content:'\2013'; }
details dl { padding:0 0 22px; }
details dt { font-weight:700; margin-top:12px; }
details dt:empty + dd { margin-top:8px; }
details dd { color:var(--cinza); }
.perguntas summary { font-size:21px; }
.perguntas details > p { color:var(--cinza); padding:0 0 22px; max-width:46em; }
.tabela { max-width:900px; }
.tabela > div { display:flex; justify-content:space-between; gap:24px; padding:14px 0; border-bottom:1px solid var(--linha); font-size:19px; }
.tabela > div:first-child { border-top:1px solid var(--linha); }
.tabela dd { white-space:nowrap; }
.b-formadores .pessoa { grid-template-columns:140px 1fr; gap:24px; margin-bottom:28px; max-width:900px; }
.b-formadores .pessoa .foto { width:140px; height:140px; }
.b-formadores .pessoa h3 { font-size:26px; margin-bottom:6px; }
.b-formadores .texto p { font-size:18px; color:var(--cinza); }
.fixa { display:none; }

/* formadores e contactos */
.formadores { margin-top:24px; }
.pessoa.grande { grid-template-columns:280px 1fr; gap:40px; padding:36px 0; border-top:1px solid var(--linha); }
.pessoa.grande .foto { width:280px; height:280px; }
.pessoa.grande h2 { font-size:40px; font-weight:300; margin-bottom:14px; }
.pessoa.grande .texto p { color:var(--texto); }
.contactos { margin-top:12px; max-width:900px; }
.contactos > div { display:grid; grid-template-columns:180px 1fr; gap:24px; padding:16px 0; border-bottom:1px solid var(--linha); font-size:20px; }
.contactos > div:first-child { border-top:1px solid var(--linha); }
.contactos dt { color:var(--cinza); font-size:17px; padding-top:3px; }
.contactos a { text-decoration-thickness:1px; }
.contactos small { display:block; font-size:14px; color:var(--cinza); }

/* texto corrido */
.corrido .conteudo { max-width:46em; font-size:18px; }
.corrido .conteudo > * + * { margin-top:14px; }
.corrido .conteudo h2 { font-size:30px; font-weight:300; margin-top:34px; }
.corrido .conteudo h3 { font-size:22px; margin-top:24px; }
.corrido .conteudo ul, .corrido .conteudo ol { padding-left:1.3em; }

/* pedido de aviso */
.caixa { max-width:620px; margin:0 auto; padding:24px 18px 90px; }
.caixa h1 { font-size:42px; font-weight:300; line-height:1.1; margin:8px 0 12px; }
.caixa h2 { font-size:26px; font-weight:400; margin:6px 0 10px; }
.caixa .quando { color:var(--cinza); margin-bottom:22px; }
.caixa p { margin-bottom:14px; }
.aviso label { display:block; font-size:16px; margin-top:16px; }
.aviso input[type=text], .aviso input[type=email], .aviso input[type=tel] { display:block; width:100%; height:52px; margin-top:6px; border:0; border-bottom:1.5px solid var(--azul); background:transparent; font:inherit; font-size:19px; color:var(--texto); padding:0 2px; border-radius:0; }
.aviso input:focus { outline:none; border-bottom-width:2.5px; }
.aviso .aceito { display:flex; gap:12px; font-size:15px; color:var(--cinza); margin:22px 0 4px; align-items:flex-start; line-height:1.5; cursor:pointer; }
.aviso .aceito { min-height:44px; padding:6px 0; }
.aviso .aceito input { flex:0 0 26px; width:26px; height:26px; margin:0; accent-color:var(--azul); }
.aviso .btn { margin-top:22px; }
.aviso .btn[disabled] { opacity:.6; cursor:wait; }
.erro { color:#8E1F1F; font-size:15px; margin:6px 0 0 !important; }
.feito { border-top:1px solid var(--texto); padding-top:18px; margin-top:6px; }

/* rodapé */
.rodape { border-top:1px solid var(--texto); padding:40px 0 60px; font-size:16px; color:var(--cinza); }
.rodape .wrap { display:flex; justify-content:space-between; gap:40px; }
.rodape p + p { margin-top:8px; }
.rodape .pequeno { font-size:14px; }

@media (max-width:1000px) {
  .abre h1 { font-size:60px; }
  .ed { grid-template-columns:1fr 300px; gap:32px; }
  .barra-w { flex-wrap:wrap; }
  .barra-w .acc { margin:0; padding:0 18px 14px; flex:1 1 100%; }
}

@media (max-width:700px) {
  body { font-size:17px; }
  .wrap { padding:0 18px; }
  .cab .wrap { height:66px; }
  .marca { font-size:19px; gap:10px; }
  .marca img { width:36px; height:36px; }
  .menu { display:block; }
  .cab nav { display:none; position:absolute; left:0; right:0; top:66px; z-index:50; background:var(--fundo); border-bottom:1px solid var(--texto); flex-direction:column; gap:0; padding:6px 18px 14px; font-size:20px; }
  .cab.aberto nav { display:flex; }
  .cab nav a { padding:12px 0; min-height:48px; border-bottom:1px solid var(--linha); }
  .cab nav a:last-child { border-bottom:0; }
  .cab nav a.on { border-bottom-color:var(--linha); color:var(--ouro); }

  .barra > div { flex:1 1 50%; padding:10px 14px; font-size:15px; }
  .barra-w .acc { padding:0 14px 14px; }
  .barra-w .acc .btn { width:100%; }

  .abre { padding:36px 0 30px; }
  .abre h1 { font-size:44px; }
  .abre p { font-size:18px; margin-top:14px; }
  .turmas { grid-template-columns:1fr 1fr; gap:6px; margin-top:28px; }
  .turmas > div:nth-child(3) { display:none; }
  .agenda h2, .bloco h2 { font-size:38px; margin-bottom:18px; }
  .ed { grid-template-columns:1fr; gap:18px; padding:26px 0 30px; }
  .ed .capa-l { order:-1; }
  .ed .capa { aspect-ratio:auto; padding:18px 20px; }
  .ed .capa .t, .ed .capa .l { display:none; }
  .capa .d { font-size:72px; }
  .capa.longo .d { font-size:56px; }
  .ed h3 { font-size:28px; }
  .ed p.frase { font-size:17px; margin-bottom:16px; }
  .dupla, .opinioes, .onde { grid-template-columns:1fr; gap:30px; }
  .pessoa { grid-template-columns:96px 1fr; gap:16px; }
  .pessoa .foto { width:96px; height:96px; }
  .pessoa h3 { font-size:24px; }

  .topo h1 { font-size:42px; }
  .topo p.frase { font-size:18px; }
  .capa.larga { aspect-ratio:auto; padding:22px; margin-top:28px; gap:16px; }
  .capa.larga .d { font-size:84px; }
  .capa.larga.longo .d { font-size:64px; }
  .capa.larga .m { font-size:18px; padding-bottom:4px; }
  .bloco h2 { font-size:34px; }
  .inclui { columns:1; font-size:17px; }
  summary { font-size:20px; }
  .perguntas summary { font-size:19px; }
  .texto p { font-size:17px; }
  .tabela > div { font-size:17px; }
  .tabela dd { white-space:normal; text-align:right; }
  .b-formadores .pessoa { grid-template-columns:90px 1fr; gap:14px; }
  .b-formadores .pessoa .foto { width:90px; height:90px; }
  .b-formadores .pessoa h3 { font-size:22px; }
  .pessoa.grande { grid-template-columns:1fr; gap:18px; }
  .pessoa.grande .foto { width:100%; height:auto; aspect-ratio:1/1; max-width:360px; }
  .pessoa.grande h2 { font-size:32px; }
  .contactos > div { grid-template-columns:1fr; gap:2px; font-size:18px; }

  .page-template-template-formacao { padding-bottom:84px; }
  .fixa { display:flex; position:fixed; left:0; right:0; bottom:0; z-index:40; background:var(--azul); color:#fff; align-items:center; gap:14px; padding:12px 18px calc(12px + env(safe-area-inset-bottom)); }
  .fixa div { flex:1; line-height:1.25; min-width:0; }
  .fixa b { font-size:20px; font-weight:400; display:block; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
  .fixa span { font-size:14px; color:var(--ouro-claro); display:block; }
  .fixa .btn { background:var(--ouro-claro); color:var(--azul); border-color:var(--ouro-claro); flex:0 0 auto; }

  .caixa h1 { font-size:36px; }
  .rodape .wrap { flex-direction:column; gap:14px; }
}