/* Partiu Esperto — estilos */
:root {
  --ceu: #13294B;        /* azul de cabine */
  --ceu-2: #1E3D6E;
  --pista: #F2B705;      /* amarelo de sinalização de aeroporto */
  --papel: #F7F9FC;
  --tinta: #1F2937;
  --cinza: #5B6474;
  --linha: #DCE2EC;
  --link: #0B6E78;
  --ok: #1F7A4D;
  --alerta: #A33A1E;
  --maxw: 68rem;
  --texto: 40rem;
  --raio: 10px;
}

* { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; }
body {
  margin: 0;
  background: var(--papel);
  color: var(--tinta);
  font-family: "Atkinson Hyperlegible", system-ui, -apple-system, "Segoe UI", sans-serif;
  font-size: 1.0625rem;
  line-height: 1.6;
}
img { max-width: 100%; display: block; }
a { color: var(--link); text-underline-offset: 3px; }
a:hover { color: var(--ceu); }
:focus-visible { outline: 3px solid var(--pista); outline-offset: 2px; border-radius: 4px; }

h1, h2, h3 {
  font-family: "Bricolage Grotesque", system-ui, sans-serif;
  color: var(--ceu);
  line-height: 1.15;
  letter-spacing: -0.01em;
}
h1 { font-size: clamp(2rem, 5vw, 3.25rem); font-weight: 800; margin: 0 0 1rem; }
h2 { font-size: clamp(1.4rem, 3vw, 1.9rem); font-weight: 700; margin: 2.5rem 0 0.75rem; }
h3 { font-size: 1.2rem; font-weight: 700; margin: 1.75rem 0 0.5rem; }

.wrap { max-width: var(--maxw); margin: 0 auto; padding: 0 1rem; }

/* Topo */
.topo { background: var(--ceu); color: #fff; }
.topo .wrap { display: flex; align-items: center; justify-content: space-between; gap: 1rem; padding-top: 0.9rem; padding-bottom: 0.9rem; flex-wrap: wrap; }
.marca { color: #fff; text-decoration: none; font-family: "Bricolage Grotesque", sans-serif; font-weight: 800; font-size: 1.35rem; display: flex; align-items: center; gap: 0.5rem; }
.marca:hover { color: #fff; }
.marca .selo { background: var(--pista); color: var(--ceu); border-radius: 6px; padding: 0.05rem 0.45rem; font-size: 1rem; }
.menu { display: flex; gap: 1.25rem; flex-wrap: wrap; }
.menu a { color: #E6ECF5; text-decoration: none; font-size: 0.98rem; }
.menu a:hover, .menu a[aria-current="page"] { color: var(--pista); }

/* Hero com painel de embarque */
.hero { background: var(--ceu); color: #fff; padding: 2.5rem 0 3.5rem; }
.hero .wrap { display: grid; gap: 2.5rem; grid-template-columns: 1fr; align-items: center; }
@media (min-width: 900px) { .hero .wrap { grid-template-columns: 1fr 1.1fr; } }
.hero h1 { color: #fff; }
.hero p.lead { color: #D5DEEC; font-size: 1.15rem; max-width: 32rem; margin: 0 0 1.5rem; }
.botao { display: inline-block; background: var(--pista); color: var(--ceu); font-weight: 700; text-decoration: none; padding: 0.8rem 1.2rem; border-radius: var(--raio); border: 0; font-size: 1rem; cursor: pointer; }
.botao:hover { background: #FFC928; color: var(--ceu); }
.botao.secundario { background: transparent; color: #fff; border: 1.5px solid #8FA3C2; margin-left: 0.5rem; }
.botao.secundario:hover { border-color: #fff; color: #fff; }

.painel { background: #0A1730; border-radius: 14px; padding: 1rem; font-family: "Bricolage Grotesque", sans-serif; box-shadow: inset 0 0 0 1px #24406B; }
.painel-titulo { display: flex; justify-content: space-between; color: var(--pista); font-weight: 700; font-size: 0.95rem; padding: 0.25rem 0.5rem 0.75rem; border-bottom: 1px solid #24406B; }
.painel table { width: 100%; border-collapse: collapse; }
.painel th { text-align: left; color: #7F92B3; font-weight: 500; font-size: 0.8rem; padding: 0.6rem 0.5rem 0.3rem; }
.painel td { padding: 0.55rem 0.5rem; border-top: 1px solid #1A2F52; font-size: 0.98rem; color: #fff; }
.painel td.destino { font-weight: 700; letter-spacing: 0.02em; }
.painel td.status { color: var(--pista); font-weight: 700; white-space: nowrap; }
.painel td.status.ok { color: #6FDBA0; }
.flap { display: inline-block; animation: flap 0.6s steps(6) both; }
@media (prefers-reduced-motion: reduce) { .flap { animation: none; } }
@keyframes flap { from { opacity: 0; transform: rotateX(90deg); } to { opacity: 1; transform: none; } }

/* Seções */
.secao { padding: 3rem 0; }
.secao.clara { background: #fff; border-top: 1px solid var(--linha); border-bottom: 1px solid var(--linha); }
.intro { max-width: var(--texto); color: var(--cinza); margin-top: -0.25rem; }

.resolva { display: grid; gap: 1rem; grid-template-columns: 1fr; margin-top: 1.5rem; }
@media (min-width: 720px) { .resolva { grid-template-columns: repeat(3, 1fr); } }
.item { border-left: 4px solid var(--pista); padding: 0.25rem 0 0.25rem 1rem; }
.item h3 { margin-top: 0; }
.item p { margin: 0.25rem 0 0; color: var(--cinza); }

.guias { list-style: none; padding: 0; margin: 1.5rem 0 0; border-top: 1px solid var(--linha); }
.guias li { border-bottom: 1px solid var(--linha); }
.guias a { display: flex; justify-content: space-between; gap: 1rem; padding: 1rem 0.25rem; text-decoration: none; color: var(--tinta); }
.guias a:hover { background: #EEF3FA; }
.guias strong { font-family: "Bricolage Grotesque", sans-serif; color: var(--ceu); font-size: 1.1rem; }
.guias span { color: var(--cinza); font-size: 0.95rem; }
.guias .em-breve { color: var(--cinza); display: flex; justify-content: space-between; padding: 1rem 0.25rem; }
.tag { font-size: 0.8rem; border: 1px solid var(--linha); border-radius: 999px; padding: 0.1rem 0.6rem; white-space: nowrap; align-self: center; }

.quem { display: grid; gap: 1.5rem; grid-template-columns: 1fr; max-width: 52rem; }
@media (min-width: 720px) { .quem { grid-template-columns: 1fr 2fr; } }
.quem .numero { font-family: "Bricolage Grotesque", sans-serif; font-size: 3.5rem; font-weight: 800; color: var(--ceu); line-height: 1; }
.quem .numero small { display: block; font-size: 1rem; font-weight: 500; color: var(--cinza); margin-top: 0.4rem; }

/* Artigo */
.artigo { max-width: var(--texto); margin: 0 auto; padding: 2.5rem 1rem 3rem; }
.artigo .meta { color: var(--cinza); font-size: 0.95rem; margin-bottom: 1.5rem; }
.resposta { background: #fff; border: 1px solid var(--linha); border-left: 5px solid var(--ok); border-radius: var(--raio); padding: 1rem 1.25rem; }
.resposta strong { color: var(--ok); }
.aviso-afiliado { font-size: 0.92rem; color: var(--cinza); background: #EEF3FA; border-radius: var(--raio); padding: 0.75rem 1rem; margin: 1.25rem 0; }
.artigo table { width: 100%; border-collapse: collapse; margin: 1rem 0; background: #fff; font-size: 0.98rem; }
.artigo th, .artigo td { text-align: left; padding: 0.6rem 0.75rem; border-bottom: 1px solid var(--linha); vertical-align: top; }
.artigo th { background: var(--ceu); color: #fff; font-weight: 600; }
.cotar { display: grid; gap: 0.75rem; grid-template-columns: 1fr; margin: 1rem 0; }
@media (min-width: 560px) { .cotar { grid-template-columns: 1fr 1fr; } }
.cotar a { display: block; text-align: center; background: var(--ceu); color: #fff; text-decoration: none; padding: 0.9rem; border-radius: var(--raio); font-weight: 700; }
.cotar a:hover { background: var(--ceu-2); color: #fff; }
.dica-caio { background: #FFF8DB; border-radius: var(--raio); padding: 1rem 1.25rem; border: 1px solid #F2D675; }
.fontes { font-size: 0.92rem; color: var(--cinza); }

.pagina { max-width: var(--texto); margin: 0 auto; padding: 2.5rem 1rem 3rem; }

/* Rodapé */
.rodape { background: var(--ceu); color: #C9D4E6; font-size: 0.92rem; padding: 2rem 0; }
.rodape a { color: #fff; }
.rodape .wrap { display: grid; gap: 1rem; }
.rodape nav { display: flex; gap: 1.25rem; flex-wrap: wrap; }
