/* Azume News — tokens e componentes comuns do visual novo (alinhado ao site comercial do Azume).
   Carregado em todas as páginas que têm o cabeçalho/rodapé novos (inclusive as ainda no tema antigo,
   ao lado do styles.css). Por isso: só @font-face, variáveis --az-* e classes com prefixo az-
   (nada de seletor de elemento solto aqui, para não mexer nas páginas antigas).
   Fontes hospedadas em /vendor/fonts (OFL-1.1); nada de CDN. */

@font-face {
  font-family: "Archivo";
  src: url("/vendor/fonts/archivo-var-latin.woff2") format("woff2");
  font-weight: 100 900;
  font-stretch: 62% 125%;
  font-style: normal;
  font-display: swap;
  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: "Noto Sans";
  src: url("/vendor/fonts/notosans-var-latin.woff2") format("woff2");
  font-weight: 300 800;
  font-style: normal;
  font-display: swap;
  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;
}

:root {
  /* paleta do site comercial (mesmos valores de --lpd-*) */
  --az-abyss: #00293b; --az-ink: #043a50; --az-navy: #05445e; --az-deep: #001e2c;
  --az-teal: #189ab4; --az-teal-l: #08a9c9; --az-aqua: #75e6da; --az-mist: #d4f1f4; --az-mist-2: #eef9fa;
  --az-sun: #ffb400; --az-orange: #ff9100; --az-green: #55c57a;
  --az-muted: #3f6475; --az-line: #cfe5eb; --az-white: #ffffff;
  --az-link: #0e7490;   /* teal escuro: 5,4:1 no branco (o teal da marca dá 3,3:1, só para ícones/linhas) */
  --az-wa: #177a41;     /* WhatsApp com texto branco: 5,4:1 */
  /* tipografia */
  --az-display: "Archivo", "Helvetica Neue", Arial, sans-serif;
  --az-body: "Noto Sans", system-ui, -apple-system, "Segoe UI", sans-serif;
  --az-h1: clamp(38px, 4.6vw, 66px);
  --az-h2: clamp(28px, 3.5vw, 52px);
  --az-h3: clamp(19px, 1.7vw, 23px);
  /* layout */
  --az-max: 1320px; --az-pad: 40px;
  --az-r-btn: 8px; --az-r-card: 14px; --az-r-pill: 999px;
  --az-shadow: 0 30px 60px -30px rgba(0, 41, 59, .35);
  --az-shadow-sm: 0 1px 2px rgba(0, 41, 59, .06), 0 8px 24px -12px rgba(0, 41, 59, .18);
  --az-ease: cubic-bezier(.22, 1, .36, 1);
}
/* transição entre páginas do site (Chrome/Edge/Safari recentes; nos outros a troca é normal). As duas páginas precisam
   carregar este arquivo. O cabeçalho fica parado e só o conteúdo troca. Desligada com "reduzir movimento". */
@media (prefers-reduced-motion: no-preference) {
  @view-transition { navigation: auto }
  .az-header { view-transition-name: az-header }
  ::view-transition-old(root) { animation: az-page-out .22s ease-in both }
  ::view-transition-new(root) { animation: az-page-in .38s cubic-bezier(.22, 1, .36, 1) both }
}
@keyframes az-page-out { to { opacity: 0; transform: translateY(-10px) } }
@keyframes az-page-in { from { opacity: 0; transform: translateY(14px) } }

@media (max-width: 1023px) { :root { --az-pad: 28px } }
@media (max-width: 599px) { :root { --az-pad: 16px } }

.az-wrap { box-sizing: border-box; max-width: var(--az-max); margin: 0 auto; padding-left: max(var(--az-pad), env(safe-area-inset-left, 0px)); padding-right: max(var(--az-pad), env(safe-area-inset-right, 0px)) }
.az-sr { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap }
.az-ico { width: 1.1em; height: 1.1em; flex: none; fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round }
.az-skip { position: absolute; left: 12px; top: -60px; z-index: 100; background: var(--az-sun); color: var(--az-ink); padding: 10px 16px; border-radius: 8px; font: 700 15px/1 var(--az-body); text-decoration: none }
.az-skip:focus { top: 12px }

/* ---------- tipografia de marca ---------- */
.az-display { font-family: var(--az-display); font-weight: 800; font-stretch: 112%; letter-spacing: -.012em; line-height: 1.04; text-wrap: balance; margin: 0 }
.az-kicker { font: 700 13px/1.3 var(--az-display); font-stretch: 112%; letter-spacing: .12em; text-transform: uppercase; color: var(--az-teal) }
.az-tag { justify-self: start; display: inline-flex; align-items: center; font: 700 11.5px/1 var(--az-display); font-stretch: 110%; letter-spacing: .08em; text-transform: uppercase; color: var(--az-navy); background: var(--az-mist); padding: 5px 8px; border-radius: 6px }
.az-tag--sun { background: #fff1cc; color: #6b4700 }
.az-tag--dark { background: rgba(117, 230, 218, .14); color: var(--az-aqua) }

/* ---------- botões (= .lpd-btn do site comercial) ---------- */
.az-btn { box-sizing: border-box; display: inline-flex; align-items: center; justify-content: center; gap: 10px; min-height: 50px; padding: 0 24px; border: 0; border-radius: var(--az-r-btn);
  font: 750 16px/1.1 var(--az-display); font-stretch: 110%; text-decoration: none; cursor: pointer; white-space: nowrap;
  transition: transform .25s var(--az-ease), box-shadow .25s, background-color .25s, color .25s }
.az-btn--sun { background: var(--az-sun); color: var(--az-ink) !important; box-shadow: inset 0 -3px rgba(4, 58, 80, .18) }
.az-btn--sun:hover { transform: translateY(-2px); box-shadow: inset 0 -3px rgba(4, 58, 80, .18), 0 10px 24px -8px rgba(255, 180, 0, .6) }
.az-btn--line { background: rgba(0, 41, 59, .35); color: #fff !important; box-shadow: inset 0 0 0 1.5px rgba(117, 230, 218, .55) }
.az-btn--line:hover { box-shadow: inset 0 0 0 1.5px var(--az-aqua) }
.az-btn--outline { background: transparent; color: var(--az-navy) !important; box-shadow: inset 0 0 0 1.5px var(--az-navy) }
.az-btn--outline:hover { background: var(--az-navy); color: #fff !important }
.az-btn--wa { background: var(--az-wa); color: #fff !important; box-shadow: inset 0 -3px rgba(0, 0, 0, .15) }
.az-btn--sm { min-height: 40px; padding: 0 16px; font-size: 14px }
.az-btn:focus-visible, .az-header a:focus-visible, .az-footer a:focus-visible, .az-menu-btn:focus-visible { outline: 2px solid var(--az-teal-l); outline-offset: 3px }

/* ---------- selo do prêmio ---------- */
.az-award { display: inline-flex; align-items: center; gap: 10px; padding: 8px 14px 8px 10px; border-radius: 12px; text-decoration: none;
  background: linear-gradient(135deg, rgba(255, 180, 0, .16), rgba(255, 180, 0, .04) 55%, rgba(255, 214, 120, .12));
  box-shadow: inset 0 0 0 1px rgba(255, 196, 64, .45) }
.az-award svg { width: 34px; height: 34px; flex: none }
.az-award b { display: block; font: 800 15px/1.1 var(--az-display); font-stretch: 112%; color: #ffd36b; letter-spacing: .01em }
.az-award span span { display: block; font: 400 12.5px/1.3 var(--az-body); color: var(--az-mist) }

/* ---------- cabeçalho ---------- */
.az-header { position: sticky; top: env(safe-area-inset-top, 0px); z-index: 40; background: rgba(0, 41, 59, .97); border-bottom: 1px solid rgba(117, 230, 218, .12); font-family: var(--az-body) }
.az-header > .az-wrap { display: flex; align-items: center; gap: 28px; min-height: 72px }
.az-brand { display: inline-flex; flex: none }
.az-brand img { display: block; width: 128px; height: auto }
.az-nav { display: flex; align-items: center; gap: 4px; margin-left: 8px }
.az-nav a { color: var(--az-mist); text-decoration: none; font: 600 15px/1 var(--az-body); padding: 10px 12px; border-radius: 6px }
.az-nav a:hover { color: #fff; background: rgba(117, 230, 218, .08) }
.az-nav a[aria-current="page"] { color: #fff; box-shadow: inset 0 -2px 0 var(--az-sun); border-radius: 0 }
.az-head-actions { margin-left: auto; display: flex; align-items: center; gap: 12px }
.az-login { display: inline-flex; align-items: center; gap: 8px; color: #fff; text-decoration: none; font: 600 15px/1 var(--az-body); padding: 10px 6px; white-space: nowrap }
.az-login:hover, .az-login[aria-current="page"] { color: var(--az-aqua) }
.az-menu-btn { display: none; background: none; border: 0; color: #fff; width: 44px; height: 44px; align-items: center; justify-content: center; border-radius: 8px; cursor: pointer; padding: 0 }
.az-menu-btn .az-ico { width: 24px; height: 24px }
.az-menu-btn .az-i-close, .az-menu-btn[aria-expanded="true"] .az-i-open { display: none }
.az-menu-btn[aria-expanded="true"] .az-i-close { display: block }
.az-drawer { display: none }
@media (max-width: 980px) {
  .az-nav, .az-head-actions .az-btn, .az-head-actions .az-login { display: none }
  .az-menu-btn { display: inline-flex }
  .az-header > .az-wrap { min-height: 64px }
  .az-brand img { width: 112px }
  .az-drawer { border-top: 1px solid rgba(117, 230, 218, .12); background: var(--az-abyss) }
  .az-drawer.open { display: block }
  .az-drawer nav { display: grid; padding: 8px 0 20px }
  .az-drawer a:not(.az-btn) { color: var(--az-mist); text-decoration: none; font: 600 17px/1 var(--az-body); padding: 14px 0; border-bottom: 1px solid rgba(207, 229, 235, .08) }
  .az-drawer a[aria-current="page"] { color: #fff; box-shadow: inset 3px 0 0 var(--az-sun); padding-left: 12px }
  .az-drawer .az-btn { margin-top: 16px; justify-self: start }
}

/* ---------- rodapé ---------- */
.az-footer { background: var(--az-deep); color: rgba(212, 241, 244, .82); padding-block: 56px 28px; font: 400 15px/1.55 var(--az-body); margin-top: clamp(48px, 8vw, 80px) }
.az-footer-grid { display: grid; grid-template-columns: minmax(0, 1.4fr) repeat(2, minmax(0, 1fr)); gap: 32px }
.az-footer h2 { margin: 0 0 12px; font: 700 13px/1 var(--az-display); font-stretch: 112%; letter-spacing: .1em; text-transform: uppercase; color: var(--az-aqua) }
.az-footer ul { list-style: none; margin: 0; padding: 0; display: grid; gap: 9px }
.az-footer a { color: rgba(212, 241, 244, .92); text-decoration: none }
.az-footer a:hover { color: #fff; text-decoration: underline }
.az-footer p { margin: 14px 0 18px; max-width: 36ch }
.az-footer img { display: block }
.az-footer-bottom { margin-top: 40px; padding-top: 20px; border-top: 1px solid rgba(207, 229, 235, .12); display: flex; flex-wrap: wrap; gap: 8px 24px; justify-content: space-between; font-size: 13.5px; color: rgba(212, 241, 244, .72) }
@media (max-width: 760px) { .az-footer-grid { grid-template-columns: 1fr 1fr } .az-footer-grid > :first-child { grid-column: 1 / -1 } }
