/* =====================================================
   BASE – BANCO SOL (TIPOGRAFIA + RESET)
   ===================================================== */

:root {
  --sol-yellow: #f5c400;

  --text-primary: #111111;
  --text-secondary: #4a4a4a;
  --text-muted: #6f6f6f;

  /* Myriad Pro é a tipografia da marca. Sendo licenciada pela Adobe, não pode
     ser alojada aqui: quem a tem instalada (Creative Cloud) vê-a, os restantes
     recebem Source Sans 3 — a humanista livre metricamente mais próxima, do
     mesmo desenhador.

     Para a servir a todos os visitantes, uma de duas vias:
       a) Adobe Fonts — criar um Web Project em fonts.adobe.com com Myriad Pro
          e colar o <link> de use.typekit.net em site/partials/head.blade.php;
       b) licença de webfont — colocar os .woff2 em /site/fonts/ e declarar
          aqui os @font-face correspondentes.
     Em qualquer dos casos esta lista não muda: Myriad Pro já vem à frente. */
  --font-base: "Myriad Pro", "MyriadPro-Regular", "Source Sans 3",
               "Source Sans Pro", system-ui, -apple-system,
               BlinkMacSystemFont, "Segoe UI", Roboto, Arial, sans-serif;

  /* Escala do manual de marca. Em rem (1rem = 12 pt) para acompanhar a
     preferência de tamanho de letra do visitante. */
  --fs-institucional: 0.9167rem; /* 11 pt — informação oficial e institucional */
  --fs-conteudo-sm:   1.1667rem; /* 14 pt — notícias e publicidade, nível 3 */
  --fs-conteudo-md:   1.3333rem; /* 16 pt — notícias e publicidade, nível 2 */
  --fs-conteudo-lg:   1.5rem;    /* 18 pt — notícias e publicidade, nível 1 */
}

/* RESET */
*,
*::before,
*::after {
  box-sizing: border-box;
}

body {
  margin: 0;
  font-family: var(--font-base);
  font-size: 16px;
  line-height: 1.6;
  color: var(--text-primary);
  background-color: #ffffff;
  -webkit-font-smoothing: antialiased;
}

html,
body {
  overflow-x: hidden;
  overflow-x: clip;
  max-width: 100%;
}

/* HEADINGS */
h1 { font-size: 2.25rem; font-weight: 700; }
h2 { font-size: 1.75rem; font-weight: 600; }
h3 { font-size: 1.4rem; font-weight: 600; }
h4 { font-size: 1.15rem; font-weight: 600; }
h5 { font-size: 1rem; font-weight: 600; }
h6 {
  font-size: 0.85rem;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  color: var(--text-muted);
}

p {
  color: var(--text-secondary);
}

/* Cabeçalhos de secção — padrão das páginas institucionais */
.sec-head {
  margin-bottom: 38px;
}

.sec-title {
  margin: 0 0 14px;
  font-size: clamp(24px, 2.8vw, 34px);
  line-height: 1.18;
  font-weight: 800;
  color: #0b1220;
  text-wrap: balance;
}

.sec-title::after {
  content: "";
  display: block;
  width: 54px;
  height: 4px;
  border-radius: 99px;
  background: linear-gradient(90deg, #FECB00, #f0b200);
  margin-top: 12px;
}

.sec-lead {
  max-width: 760px;
  margin: 0;
  font-size: 16px;
  line-height: 1.7;
  color: #5b6b84;
}

/* ESCALA TIPOGRÁFICA DA MARCA — utilitárias
   Aplicar nos blocos de conteúdo, não em botões nem navegação. */
.texto-institucional { font-size: var(--fs-institucional); line-height: 1.7; }
.texto-conteudo-sm   { font-size: var(--fs-conteudo-sm);   line-height: 1.75; }
.texto-conteudo-md   { font-size: var(--fs-conteudo-md);   line-height: 1.6; }
.texto-conteudo-lg   { font-size: var(--fs-conteudo-lg);   line-height: 1.45; }

/* LINKS */
a {
  color: var(--text-primary);
  text-decoration: none;
}

a:hover {
  text-decoration: underline;
}

/* ACCESSIBILITY */
a:focus-visible,
button:focus-visible {
  outline: 2px solid var(--sol-yellow);
  outline-offset: 2px;
}

/* RESPONSIVO */
@media (max-width: 768px) {
  h1 { font-size: 1.8rem; }
  h2 { font-size: 1.45rem; }
  h3 { font-size: 1.2rem; }
}

/* =========================================================
   VARIÁVEIS GLOBAIS DE LAYOUT
   ========================================================= */
:root {
  --header-height-desktop: 72px;
  --header-height-mobile: 64px;
}


/* FIX: hero mobile nunca aparece no desktop */
.hero-mobile,
.hero-mobile-slider{
  display:none !important;
}

/* Só aparece em mobile */
@media(max-width:768px){
  .hero-mobile,
  .hero-mobile-slider{
    display:block !important;
  }

  .hero-desktop,
  .hero-slider{
    display:none !important;
  }
}

/* =====================================================
   A11Y – SKIP-LINK (T33)
   Oculto visualmente até receber foco; visível no foco.
   ===================================================== */
.sol-skip-link {
  position: absolute;
  left: -9999px;
  top: 8px;
  z-index: 99999;
  padding: 12px 24px;
  background: #101828;
  color: #ffffff;
  font-weight: 600;
  font-size: 15px;
  border-radius: 8px;
  text-decoration: none;
  border: 2px solid var(--sol-yellow, #f5c400);
}

.sol-skip-link:focus-visible,
.sol-skip-link:focus {
  left: 12px;
  width: auto;
  height: auto;
  clip: auto;
  outline: none;
  box-shadow: 0 0 0 4px rgba(245, 196, 0, 0.45);
}

/* Estado vazio de páginas públicas sem conteúdo — site.partials.empty-state */
.site-empty-state {
  max-width: 520px;
  margin: 0 auto;
  padding: 80px 24px;
  text-align: center;
}

.site-empty-state__icon {
  width: 64px;
  height: 64px;
  margin: 0 auto 20px;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 50%;
  background: #fff8db;
  color: #b38f00;
  font-size: 26px;
}

.site-empty-state__title {
  margin: 0 0 10px;
  font-size: 22px;
  font-weight: 800;
  color: #222222;
}

.site-empty-state__text {
  margin: 0 0 22px;
  color: #6d675f;
  line-height: 1.7;
}

.site-empty-state__cta {
  display: inline-flex;
  align-items: center;
  padding: 12px 22px;
  border-radius: 10px;
  background: #ffd200;
  color: #111111;
  font-weight: 700;
  text-decoration: none;
}

.site-empty-state__cta:hover {
  background: #e6be00;
}

/* ── Modais do site, acima do cabeçalho ──────────────────────────────────
   O cabeçalho é fixed com z-index 999999, e o banner de cookies anda pela
   mesma escala (999999, e 1000000 no painel de preferências). As modais do
   Bootstrap ficam nos valores de origem — 1050 no backdrop e 1055 na caixa
   —, por isso o menu e o banner desenhavam-se por cima da modal de perfil
   do Corpo Directivo e dos Órgãos Sociais, em qualquer resolução: o fundo
   escuro não cobria o topo e o menu continuava clicável.

   Os valores acompanham a escala que o lightbox dos Órgãos Sociais já usava
   (2000000). Quem acrescentar uma modal nova ao site herda isto. */
.modal-backdrop {
  z-index: 2000000;
}

.modal {
  z-index: 2000001;
}
