/* ==========================================================================
   Hospital 9 de Julho — Fontes hospedadas no próprio site
   Archivo e Newsreader (SIL Open Font License 1.1), subconjunto latino,
   baixados do Google Fonts. Newsreader itálico fixado no tamanho óptico de
   títulos (opsz 72, peso 400), que é o único uso no site.
   As fontes "Fallback" imitam as medidas das fontes reais enquanto elas
   carregam, para o texto não pular de lugar (reduz o CLS).
   ========================================================================== */

@font-face {
  font-family: "Archivo";
  font-style: normal;
  font-weight: 300 900;
  font-stretch: 62% 125%;
  font-display: swap;
  src: url("../fonts/archivo-latin.woff2") format("woff2");
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: "Newsreader";
  font-style: italic;
  font-weight: 300 500;
  font-display: swap;
  src: url("../fonts/newsreader-italic-latin.woff2") format("woff2");
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

@font-face {
  font-family: "Archivo Fallback";
  src: local("Arial"), local("Liberation Sans"), local("Helvetica");
  size-adjust: 99%;
  ascent-override: 88.7%;
  descent-override: 21.2%;
  line-gap-override: 0%;
}
@font-face {
  font-family: "Newsreader Fallback";
  font-style: italic;
  src: local("Times New Roman Italic"), local("TimesNewRomanPS-ItalicMT"), local("Liberation Serif Italic"), local("Georgia Italic");
  size-adjust: 101%;
  ascent-override: 72.8%;
  descent-override: 26.2%;
  line-gap-override: 0%;
}
/* ==========================================================================
   Hospital 9 de Julho — Design Tokens
   Fonte única de verdade para cor, tipografia, espaço, forma e movimento.
   ========================================================================== */

:root {
  /* ── Cor · Marca ───────────────────────────────────────────── */
  --blue-500: #045CBC;   /* azul institucional */
  --blue-500b: #085CBC;  /* variação institucional (estados, detalhes) */
  --blue-600: #034EA2;
  --blue-700: #033F85;
  --blue-800: #052F63;
  --navy: #06264D;       /* superfícies profundas */
  --navy-950: #031630;
  --blue-400: #2F7DD1;
  --blue-300: #7FB0E8;
  --blue-200: #BCD5F2;
  --blue-100: #E2EDFA;
  --blue-50: #F1F6FD;
  --sky: #9CCBFF;        /* destaque sobre fundos escuros */

  /* ── Cor · Neutros ─────────────────────────────────────────── */
  --white: #FFFFFF;
  --ice: #F3F6FA;        /* branco gelo */
  --ice-2: #E8EDF3;
  --linen: #F5F2ED;      /* neutro quente — usado com parcimônia */
  --ink: #0A1A2F;
  --ink-2: #33445B;
  --ink-3: #5B6A7E;
  --line: #D5DDE7;
  --line-soft: #E5EAF0;
  --line-strong: #7D8BA0; /* borda de campos: 3,5:1 sobre branco (WCAG 1.4.11) */
  --black: #000000;
  --ice-soft: #F4F7FB;   /* fundo de itens sobre o branco */
  --on-dark: #C9D6E6;
  --on-dark-2: #9FB2C9;
  --on-blue: #DCE8F7;    /* texto secundário sobre o azul institucional */
  --on-dark-soft: #C4D8F0; /* notas e legendas sobre o marinho */
  --sky-soft: #CFE4FF;   /* itálicos e destaques sobre o azul */
  --blue-450: #0A67CC;   /* azul vivo de ícones e realces */

  /* ── Cor · Semânticas ──────────────────────────────────────── */
  --emergency: #C8102E;  /* exclusivo para urgência/emergência */
  --emergency-strong: #94101F; /* estado pressionado/hover da urgência */
  --success: #0E7A48;
  --success-bg: #E5F4EC;
  --error: #B42318;
  --error-bg: #FDECEA;
  --warning: #8A5300;
  --warning-bg: #FFF4CC;
  --warning-line: #E8B500;
  --amber: #F59E0B;      /* selos e estrelas sobre fundos escuros */
  --error-line: #C62828; /* borda de campo inválido */
  --error-soft: #E57373; /* erro sobre fundos escuros */
  --live: #3DDC97;

  /* ── Tipografia ────────────────────────────────────────────── */
  --font-sans: "Archivo", "Archivo Fallback", ui-sans-serif, system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
  --font-serif: "Newsreader", "Newsreader Fallback", "Iowan Old Style", Georgia, serif;

  --fs-2xs: 0.75rem;
  --fs-xs: 0.8125rem;
  --fs-sm: 0.9375rem;
  --fs-base: 1.0625rem;
  --fs-md: 1.25rem;
  --fs-lg: clamp(1.375rem, 1.1rem + 0.9vw, 1.75rem);
  --fs-xl: clamp(1.75rem, 1.2rem + 1.8vw, 2.75rem);
  --fs-2xl: clamp(2.25rem, 1.3rem + 3.4vw, 4.5rem);
  --fs-3xl: clamp(2.75rem, 1rem + 6.4vw, 7.75rem);

  /* pesos da Archivo (fonte variável): os intermediários são do desenho original */
  --fw-light: 300;
  --fw-regular: 400;
  --fw-medium: 500;
  --fw-medium-plus: 550;  /* links do menu */
  --fw-semibold: 600;
  --fw-semibold-plus: 650; /* botões, rótulos */
  --fw-bold: 700;
  --fw-extrabold: 750;    /* títulos */
  --fw-heavy: 800;
  --fw-black: 900;

  --lh-tight: 1.02;
  --lh-snug: 1.18;
  --lh-body: 1.6;

  /* ── Espaço ────────────────────────────────────────────────── */
  --space-1: 0.25rem;
  --space-2: 0.5rem;
  --space-3: 0.75rem;
  --space-4: 1rem;
  --space-5: 1.5rem;
  --space-6: 2rem;
  --space-7: 3rem;
  --space-8: 4rem;
  --space-9: 6rem;
  --space-10: 8rem;
  --section-y: clamp(3.5rem, 2rem + 4vw, 6.5rem);
  --gutter: clamp(1rem, 0.3rem + 2.8vw, 3.5rem);
  --container: 1440px;
  --header-h: 76px;

  /* ── Forma ─────────────────────────────────────────────────── */
  --r-sign: 4px;         /* placas e sinalização */
  --r-xs: 6px;
  --r-sm: 10px;
  --r-md: 18px;
  --r-card: 20px;        /* cartões e painéis */
  --r-lg: 28px;
  --r-pill: 999px;

  /* ── Elevação (contida) ────────────────────────────────────── */
  --sh-1: 0 1px 2px rgba(6, 38, 77, 0.06);
  --sh-2: 0 18px 40px -22px rgba(6, 38, 77, 0.35);
  --sh-3: 0 40px 80px -36px rgba(3, 22, 48, 0.55);
  --ring-line: inset 0 0 0 1px var(--line);       /* borda desenhada por sombra */
  --ring-blue: inset 0 0 0 1px var(--blue-100);
  --backdrop: rgba(3, 22, 48, 0.62);              /* fundo atrás de diálogos */

  /* ── Movimento ─────────────────────────────────────────────── */
  --ease-out: cubic-bezier(0.16, 1, 0.3, 1);
  --ease-in-out: cubic-bezier(0.65, 0, 0.35, 1);
  --dur-1: 180ms;
  --dur-2: 360ms;
  --dur-3: 600ms;
  --dur-4: 900ms;

  /* ── Camadas (z-index), da mais baixa para a mais alta ───── */
  --z-raised: 5;          /* acima do conteúdo da própria seção */
  --z-nav-mark: 40;       /* marcador do item atual do menu */
  --z-header: 50;         /* cabeçalho; barra de utilidade = +1 */
  --z-float: 55;          /* assistente e botões flutuantes; +1 para o seguinte */
  --z-consent: 70;        /* aviso de cookies */
  --z-float-open: 75;     /* assistente aberto */
  --z-progress: 80;       /* barra de progresso de leitura (no Clube, +10) */
  --z-consent-panel: 95;
  --z-sheet: 110;         /* painéis deslizantes; a sombra fica 5 abaixo */
  --z-menu: 120;
  --z-skip: 300;          /* link "pular para o conteúdo" */
  --z-intro: 400;         /* abertura da página inicial */

  /* ── Pontos de quebra (só referência: CSS não aceita var() em @media)
     celular ≤ 599px · tablet ≤ 899px · notebook ≤ 1023px · desktop ≥ 1024px
     extras permitidos: 399px (celular pequeno) e 1279px (tela larga) */

  /* ── Foco ──────────────────────────────────────────────────── */
  --focus: var(--blue-400);
}
