/* ===== Páginas de área ===== */
.crumbs { font-size: .88rem; color: rgba(255,255,255,.6); margin-bottom: 1.4rem; }
.crumbs a { color: rgba(255,255,255,.85); text-decoration: none; }
.crumbs a:hover { color: var(--gold); }
.crumbs span { margin: 0 .5rem; }

.area-hero { background: radial-gradient(900px 400px at 90% 0%, rgba(164,215,237,.12), transparent 60%), linear-gradient(180deg, var(--navy) 0%, var(--navy-3) 100%); color: #fff; padding: 56px 0 72px; }
.area-hero-grid { display: grid; grid-template-columns: 1.15fr .85fr; gap: 3rem; align-items: start; }
.area-hero h1 { color: #fff; font-size: clamp(2.1rem, 4.4vw, 3.3rem); margin: 1rem 0 1.2rem; }
.area-hero h1 em { font-style: italic; color: var(--gold); font-weight: 400; }
.area-hero .lede { color: rgba(255,255,255,.78); }
.area-hero .hero-proof { padding-bottom: 0; }
.answer { background: var(--white); color: var(--text); border-radius: 18px; padding: 1.7rem 1.6rem; box-shadow: 0 30px 60px -30px rgba(0,0,0,.5); border-top: 4px solid var(--gold); }
.answer .eyebrow { color: var(--navy-2); }
.answer p { margin-top: .8rem; font-size: 1rem; line-height: 1.6; }
.answer ul { list-style: none; margin-top: 1rem; display: grid; gap: .55rem; }
.answer li { display: grid; grid-template-columns: 84px 1fr; gap: .8rem; align-items: baseline; font-size: .95rem; border-top: 1px solid var(--line); padding-top: .55rem; }
.answer li > b { font-family: var(--serif); font-size: 1.25rem; color: var(--navy); }
.answer small { display: block; margin-top: 1rem; color: var(--soft); font-size: .8rem; }
@media (max-width: 900px) { .area-hero-grid { grid-template-columns: 1fr; } }

.cases { display: grid; grid-template-columns: repeat(3, 1fr); gap: 18px; margin-top: 2.5rem; }
.case { background: var(--white); border: 1px solid var(--line); border-radius: var(--radius); padding: 1.5rem; }
.case .ic { width: 46px; height: 46px; border-radius: 12px; background: var(--cream); color: var(--navy); display: grid; place-items: center; margin-bottom: 1rem; }
.case .ic svg { width: 24px; height: 24px; }
.case h3 { font-size: 1.2rem; margin-bottom: .4rem; }
.case p { font-size: .95rem; color: var(--soft); }
@media (max-width: 900px) { .cases { grid-template-columns: 1fr 1fr; } }
@media (max-width: 560px) { .cases { grid-template-columns: 1fr; } }

.timeline { margin-top: 2.5rem; display: grid; grid-template-columns: repeat(3, 1fr); gap: 0; border: 1px solid var(--line); border-radius: var(--radius); overflow: hidden; background: var(--white); }
.tl { padding: 1.6rem 1.5rem; border-right: 1px solid var(--line); position: relative; }
.tl:last-child { border-right: 0; }
.tl .when { font-family: var(--serif); font-size: 2.2rem; font-weight: 600; color: var(--navy); line-height: 1; }
.tl .when small { font-size: 1rem; color: var(--gold); font-family: var(--sans); font-weight: 600; margin-left: .2rem; }
.tl h3 { font-size: 1.1rem; margin: .8rem 0 .35rem; }
.tl p { font-size: .94rem; color: var(--soft); }
.tl::after { content: ''; position: absolute; left: 1.5rem; right: 1.5rem; top: 0; height: 3px; background: linear-gradient(90deg, var(--gold), transparent); }
.note { margin-top: 1.2rem; font-size: .9rem; color: var(--soft); }
@media (max-width: 800px) { .timeline { grid-template-columns: 1fr; } .tl { border-right: 0; border-bottom: 1px solid var(--line); } .tl:last-child { border-bottom: 0; } }

.split { display: grid; grid-template-columns: 1fr 1fr; gap: 4rem; align-items: start; }
@media (max-width: 900px) { .split { grid-template-columns: 1fr; gap: 2rem; } }
.checklist { list-style: none; display: grid; gap: .75rem; margin-top: 1.5rem; }
.checklist li { display: grid; grid-template-columns: 28px 1fr; gap: .7rem; align-items: start; background: var(--white); border: 1px solid var(--line); border-radius: 12px; padding: .9rem 1rem; font-size: .98rem; }
.checklist li::before { content: ''; width: 22px; height: 22px; border-radius: 6px; background: var(--navy) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23C9A15E' stroke-width='3'%3E%3Cpath d='M5 12l5 5 9-10'/%3E%3C/svg%3E") center/14px no-repeat; margin-top: 2px; }
.checklist b { color: var(--navy); }

.facts { display: grid; gap: 14px; margin-top: 1.5rem; }
.fact { background: var(--cream); border-radius: 12px; padding: 1.2rem 1.3rem; border-left: 3px solid var(--gold); }
.fact b { display: block; font-family: var(--serif); font-size: 1.15rem; color: var(--navy); margin-bottom: .25rem; }
.fact p { font-size: .95rem; color: var(--text); }
.fact .src { display: block; margin-top: .45rem; font-size: .8rem; color: var(--soft); }

.honest { margin-top: 2.5rem; background: var(--navy); color: rgba(255,255,255,.82); border-radius: 18px; padding: 2rem; display: grid; grid-template-columns: 56px 1fr; gap: 1.2rem; }
.honest svg { width: 44px; height: 44px; color: var(--gold); }
.honest h3 { color: #fff; font-size: 1.35rem; margin-bottom: .4rem; }
@media (max-width: 560px) { .honest { grid-template-columns: 1fr; } }

.related { display: flex; flex-wrap: wrap; gap: .6rem; margin-top: 1.5rem; }
.related a { text-decoration: none; border: 1px solid var(--line); background: var(--white); border-radius: 999px; padding: .55rem 1rem; font-size: .92rem; font-weight: 500; color: var(--navy); }
.related a:hover { border-color: var(--gold); }
.byline { display: flex; align-items: center; gap: .9rem; margin-top: 2rem; font-size: .9rem; color: var(--soft); }
.byline img { width: 48px; height: 48px; border-radius: 50%; object-fit: cover; object-position: center 15%; }
.byline b { color: var(--navy); display: block; }

.steps-1 { list-style: none; grid-template-columns: 1fr !important; margin-top: 1.5rem; }
.steps-1 .step { padding: 1.2rem 1.3rem; display: grid; grid-template-columns: 52px 1fr; column-gap: .9rem; }
.steps-1 .step::before { grid-row: span 2; margin: 0; font-size: 2rem; }
.facts-row .fact { margin: 0; }

.answer-art { margin: -1.7rem -1.6rem 1.2rem; padding: 1rem 1.2rem .4rem; background: linear-gradient(180deg, var(--cream), #fff); border-radius: 14px 14px 0 0; }
.answer-art svg { display: block; width: 100%; max-width: 320px; height: auto; margin: 0 auto; }
@media (max-width: 560px) { .answer-art svg { max-width: 260px; } }

.brands { display: flex; flex-wrap: wrap; gap: .5rem; margin-top: 1.6rem; }
.brands span { display: inline-flex; align-items: center; gap: .4rem; padding: .45rem .85rem; border-radius: 999px; background: #fff; border: 1px solid var(--line); font-size: .9rem; font-weight: 600; color: var(--navy); }
.brands span::before { content: ''; width: 7px; height: 7px; border-radius: 50%; background: var(--gold); }
.brands-note { margin-top: .8rem; font-size: .78rem; color: var(--soft); }

/* formulário de verificação (aéreo) */
.qz-wrap { padding: 72px 0 24px; }
.qz { background: #fff; border: 1px solid var(--line); border-top: 4px solid var(--gold); border-radius: 20px; padding: 2.2rem; box-shadow: var(--shadow); max-width: 860px; margin: 0 auto; }
.qz h2 { font-size: clamp(1.5rem, 2.8vw, 2.1rem); }
.qz-bar { height: 6px; background: var(--cream); border-radius: 99px; margin: 1.4rem 0 1.6rem; overflow: hidden; }
.qz-bar span { display: block; height: 100%; background: var(--gold); border-radius: 99px; transition: width .3s; }
.qz-step { border: 0; padding: 0; margin: 0; display: none; }
.qz-step.is-active { display: block; animation: qzin .25s ease; }
@keyframes qzin { from { opacity: 0; transform: translateY(6px); } to { opacity: 1; transform: none; } }
.qz-step legend { font-family: var(--serif); font-size: 1.3rem; font-weight: 600; color: var(--navy); margin-bottom: 1rem; }
.qz-opts { display: grid; grid-template-columns: 1fr 1fr; gap: .7rem; }
.qz-opts button { font: inherit; font-weight: 500; text-align: left; padding: 1rem 1.1rem; min-height: 54px; border-radius: 12px; border: 1.5px solid var(--line); background: var(--paper); color: var(--navy); cursor: pointer; transition: border-color .15s, background .15s; }
.qz-opts button:hover { border-color: var(--gold); background: #fff; }
.qz-opts button[aria-pressed="true"] { border-color: var(--navy); background: var(--navy); color: #fff; }
.qz-back { margin-top: 1rem; background: none; border: 0; color: var(--soft); font: inherit; font-size: .9rem; cursor: pointer; padding: .4rem 0; }
.qz-fields { display: grid; grid-template-columns: 2fr 1fr; gap: .9rem; margin-bottom: 1.2rem; }
.qz-fields label { display: grid; gap: .35rem; font-size: .9rem; font-weight: 600; color: var(--navy); }
.qz-fields input, .qz-fields select { font: inherit; font-weight: 400; padding: .85rem 1rem; border-radius: 10px; border: 1.5px solid var(--line); background: #fff; color: var(--text); min-height: 50px; }
.qz-fields input:focus, .qz-fields select:focus { outline: 3px solid var(--sky); border-color: var(--navy); }
.qz-note { background: var(--cream); border-left: 3px solid var(--gold); padding: .8rem 1rem; border-radius: 8px; font-size: .92rem; margin-bottom: 1rem; }
.qz-note.qz-ok { background: #E8F3EC; border-left-color: #1F6B3A; }
.qz-note h4 { margin: 0 0 .35rem; font-family: var(--serif); font-size: 1.05rem; color: var(--navy); display: flex; flex-wrap: wrap; gap: .4rem .6rem; align-items: center; }
.qz-note p { margin: 0; }
.qz-note .rt-ctx { cursor: default; }
.qz-legal { font-size: .8rem; color: var(--soft); margin-top: .9rem; }
.qz-legal a { color: var(--navy-2); }
@media (max-width: 640px) { .qz { padding: 1.5rem 1.2rem; } .qz-opts, .qz-fields { grid-template-columns: 1fr; } .qz-send { width: 100%; } }

/* ---- Consulta de voo (#consultar-voo) ---- */
.cv-wrap { padding: 64px 0 0; }
.cv-wrap + .qz-wrap { padding-top: 28px; }
.cv { background: var(--white); border: 1px solid var(--line); border-top: 4px solid var(--navy); border-radius: 20px; padding: 2.2rem; box-shadow: var(--shadow); max-width: 860px; margin: 0 auto; }
.cv h2 { font-size: clamp(1.5rem, 2.8vw, 2.1rem); margin: .4rem 0 .6rem; }
.cv-form { display: grid; grid-template-columns: 1.4fr 1fr auto; gap: .9rem; align-items: end; margin-top: 1.4rem; }
.cv-form label { display: grid; gap: .35rem; font-size: .88rem; font-weight: 600; color: var(--navy); }
.cv-form input { font: inherit; padding: .8rem .9rem; border: 1.5px solid var(--line); border-radius: 12px; background: var(--paper); min-height: 50px; color: var(--text); }
.cv-form input:focus { outline: 3px solid var(--sky); outline-offset: 2px; border-color: var(--navy); }
.cv-btn[disabled] { opacity: .6; cursor: progress; transform: none; }
.cv-hint { margin-top: .7rem; font-size: .82rem; color: var(--soft); }
/* ler cartão de embarque (assets/cartao-embarque.js) */
.cv-cartao { display: grid; grid-template-columns: auto 1fr; gap: .4rem 1rem; align-items: center; margin-top: 1rem; padding: .9rem 1rem; border: 1.5px dashed var(--line); border-radius: 14px; background: var(--paper); }
.cv-cartao-btn { display: inline-flex; align-items: center; gap: .55rem; padding: .7rem 1.1rem; border-radius: 999px; background: var(--navy); color: #fff; font-weight: 600; font-size: .92rem; cursor: pointer; transition: background .15s, transform .15s; white-space: nowrap; }
.cv-cartao-btn:hover { background: var(--navy-2); transform: translateY(-1px); }
.cv-cartao-btn:focus-within { outline: 3px solid var(--sky); outline-offset: 2px; }
.cv-cartao-btn svg { width: 20px; height: 20px; color: var(--gold); }
.cv-cartao small { font-size: .82rem; color: var(--soft); line-height: 1.45; }
.cv-cartao-out { grid-column: 1 / -1; }
.cv-cartao-out:empty { display: none; }
.cv-cartao.lendo .cv-cartao-btn { opacity: .6; pointer-events: none; }
.cv-cartao-pernas { display: flex; flex-wrap: wrap; gap: .5rem; margin-top: .7rem; }
.cv-cartao-pernas button { font: inherit; font-size: .9rem; font-weight: 600; padding: .55rem .9rem; border-radius: 10px; border: 1.5px solid var(--line); background: #fff; color: var(--navy); cursor: pointer; }
.cv-cartao-pernas button:hover { border-color: var(--gold); }
@media (max-width: 560px) { .cv-cartao { grid-template-columns: 1fr; } .cv-cartao-btn { justify-content: center; } }
.cv-out { margin-top: 1.4rem; }
.cv-out:empty { display: none; }
.cv-msg { background: var(--cream); border-radius: 12px; padding: 1rem 1.1rem; font-size: .95rem; }
.cv-msg.erro { border-left: 3px solid #B5443C; }
.cv-msg a { color: var(--navy); font-weight: 600; }
.cv-card { border: 1px solid var(--line); border-radius: 16px; padding: 1.4rem; background: var(--paper); }
.cv-top { display: flex; flex-wrap: wrap; gap: .5rem .7rem; align-items: center; font-size: .95rem; color: var(--soft); }
.cv-top b { font-family: var(--serif); font-size: 1.3rem; color: var(--navy); }
.cv-tag { font-size: .72rem; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; padding: .2rem .55rem; border-radius: 999px; background: var(--gold-soft); color: var(--navy); }
.cv-route { display: grid; grid-template-columns: 1fr 40px 1fr; gap: .8rem; margin: 1.1rem 0; align-items: center; }
.cv-route > div { display: grid; }
.cv-route small { font-size: .75rem; text-transform: uppercase; letter-spacing: .1em; color: var(--soft); }
.cv-route b { font-family: var(--serif); font-size: 1.7rem; color: var(--navy); line-height: 1.1; }
.cv-route span { font-size: .9rem; color: var(--text); }
.cv-route em { font-style: normal; font-size: .85rem; color: var(--soft); margin-top: .15rem; }
.cv-route em strong { font-weight: 600; color: var(--text); }
.cv-arrow { text-align: center; color: var(--gold); font-size: 1.4rem; }
.cv-status { font-family: var(--serif); font-size: 1.25rem; font-weight: 600; color: var(--navy); padding: .8rem 1rem; border-radius: 12px; background: #fff; border: 1px solid var(--line); }
.cv-atraso .cv-status, .cv-cancelado .cv-status, .cv-desviado .cv-status { border-color: var(--gold); background: #FFF8EA; }
.cv-pontual .cv-status { border-color: #BFE3CC; background: #F1FAF4; }
.cv-diagwrap { margin-top: 1rem; }
.cv-diagwrap p { font-size: .95rem; margin: .5rem 0; }
.cv-diag { list-style: none; padding: 0; margin: .6rem 0; display: grid; gap: .5rem; }
.cv-diag li { display: grid; grid-template-columns: 56px 1fr; gap: .7rem; align-items: baseline; font-size: .93rem; color: var(--soft); }
.cv-diag li b { font-family: var(--serif); font-size: 1.1rem; color: var(--soft); }
.cv-diag li.ok { color: var(--text); }
.cv-diag li.ok b { color: var(--wa); }
.cv-go { margin-top: 1.1rem; }
.cv-legal { margin-top: .9rem; font-size: .78rem; color: var(--soft); }
.cv-more { margin-top: .8rem; font-size: .88rem; color: var(--soft); }
.cv-more button { font: inherit; background: none; border: 0; color: var(--navy); text-decoration: underline; cursor: pointer; padding: 0 .2rem; }
@media (max-width: 720px) {
  .cv { padding: 1.5rem 1.2rem; }
  .cv-form { grid-template-columns: 1fr; }
  .cv-route { grid-template-columns: 1fr; gap: 1rem; }
  .cv-arrow { transform: rotate(90deg); }
}
.cv-cod { display: block; margin-top: .4rem; font-size: .74rem; color: var(--soft); }

/* ---- Painel de voos (/voos) ---- */
.pv-wrap { padding: 48px 0 72px; }
.pv-mini { padding: 24px 0 8px; } .pv-mini h2 { margin: .3rem 0 1rem; }

/* ---- Página de rota (/voos/{cia}/{rota}) ---- */
.rt-resumo { display: grid; grid-template-columns: repeat(5, 1fr); gap: .8rem; margin-top: 1.6rem; }
.rt-resumo div { background: rgba(255,255,255,.06); border: 1px solid rgba(255,255,255,.12); border-radius: 12px; padding: .9rem 1rem; }
.rt-resumo b { display: block; font-family: var(--serif); font-size: 1.8rem; color: var(--gold); line-height: 1.1; }
.rt-resumo span { font-size: .82rem; color: rgba(255,255,255,.8); }
.rt-dados, .rt-faq, .rt-cta, .rt-recl, .rt-porto { padding: 56px 0; }
.rt-porto { background: var(--paper); border-top: 1px solid var(--line); }
.pt-portos { display: grid; grid-template-columns: repeat(auto-fit, minmax(260px, 1fr)); gap: .8rem; margin: 1rem 0 1.2rem; max-width: 900px; }
.pt-porto { background: var(--cream); border-left: 3px solid var(--gold); border-radius: 12px; padding: .9rem 1rem; display: grid; gap: .25rem; }
.pt-porto b { font-family: var(--serif); font-size: 1.05rem; color: var(--navy); }
.pt-porto span { font-size: .9rem; color: var(--soft); }
.pt-texto { max-width: 820px; margin: 0 0 1.2rem; }
.pt-texto a { color: var(--navy); font-weight: 600; }
.vo-cruzeiro { margin-top: 1rem; padding: .9rem 1rem; border-radius: 12px; background: #E8F3EC; border-left: 3px solid #1F6B3A; font-size: .95rem; }
.vo-cruzeiro b { color: #1F6B3A; }
.vo-cruzeiro a { color: var(--navy); font-weight: 600; }
.rt-tabela { overflow-x: auto; margin-top: 1.2rem; border: 1px solid var(--line); border-radius: 12px; background: #fff; }
.rt-tabela table { width: 100%; border-collapse: collapse; font-size: .92rem; font-variant-numeric: tabular-nums; }
.rt-tabela th, .rt-tabela td { padding: .65rem .8rem; text-align: right; border-bottom: 1px solid var(--line); white-space: nowrap; }
.rt-tabela th:first-child, .rt-tabela td:first-child { text-align: left; }
.rt-tabela th { background: var(--cream); font-size: .78rem; text-transform: uppercase; letter-spacing: .06em; color: var(--soft); }
.rt-direcoes { list-style: none; padding: 0; margin: 1rem 0 0; display: grid; gap: .6rem; grid-template-columns: 1fr 1fr; }
.rt-direcoes li { background: var(--paper); border: 1px solid var(--line); border-radius: 12px; padding: .8rem 1rem; display: grid; gap: .2rem; }
.rt-direcoes b { font-family: var(--serif); color: var(--navy); }
.rt-direcoes span { font-size: .88rem; color: var(--soft); }
.rt-problemas { list-style: none; padding: 0; margin: 1rem 0 0; display: grid; gap: .6rem; }
.rt-problemas li { display: grid; grid-template-columns: 72px 1fr; gap: .8rem; align-items: baseline; background: #fff; border: 1px solid var(--line); border-radius: 12px; padding: .8rem 1rem; }
.rt-problemas b { font-family: var(--serif); font-size: 1.3rem; color: var(--navy); }
.rt-problemas small { color: var(--soft); }
.rt-cta { background: var(--navy); color: #fff; text-align: center; }
.rt-cta h2 { color: #fff; }
/* a página termina na faixa escura: sem o vão claro antes do rodapé */
body:has(main > .rt-cta:last-child) footer.site { margin-top: 0; }
.rt-cta .lede { margin: .6rem auto 1.4rem; color: rgba(255,255,255,.8); }
.rt-cta .related { justify-content: center; margin-top: 1.4rem; display: flex; gap: .6rem; flex-wrap: wrap; }
.rt-cta .related a { color: #fff; background: transparent; border-color: rgba(255,255,255,.35); }
.rt-cta .related a:hover { border-color: var(--gold); color: var(--gold); background: transparent; }
.rt-cta .brands-note { color: rgba(255,255,255,.55); margin-top: 1.4rem; }
.rt-faqlist details { border-bottom: 1px solid var(--line); padding: .9rem 0; }
.rt-faqlist summary { font-weight: 600; color: var(--navy); cursor: pointer; }
.rt-faqlist p { margin: .6rem 0 0; color: var(--text); }
@media (max-width: 760px) { .rt-resumo { grid-template-columns: 1fr 1fr; } .rt-direcoes { grid-template-columns: 1fr; } }

.rt-resumo a { text-decoration: none; color: inherit; transition: border-color .15s; } .rt-resumo a:hover { border-color: var(--gold); }
.rt-graves { margin-top: 1rem; border: 1px solid var(--line); border-radius: 12px; background: #fff; overflow: hidden; }
.rt-graves details { border-bottom: 1px solid var(--line); } .rt-graves details:last-child { border-bottom: 0; }
.rt-graves summary { padding: .8rem 1rem; font-weight: 600; color: var(--navy); cursor: pointer; background: var(--paper); }
.rt-graves ul { list-style: none; margin: 0; padding: .4rem 1rem .8rem; display: grid; gap: .35rem; }
.rt-graves li { display: grid; grid-template-columns: 90px 1fr 1.4fr 1.6fr; gap: .6rem; font-size: .9rem; align-items: baseline; }
.rt-graves li b { color: var(--navy); } .rt-graves li em { font-style: normal; color: #8A4A2B; font-weight: 600; }
.rt-graves > details > p { padding: .6rem 1rem .9rem; color: var(--soft); font-size: .9rem; }
.rt-ctx { display: inline-block; font-style: normal; font-size: .7rem; font-weight: 700; letter-spacing: .04em; text-transform: uppercase; padding: .12rem .5rem; border-radius: 999px; white-space: nowrap; vertical-align: middle; cursor: help; }
.rt-ctx-isolado { background: #E8F3EC; color: #1F6B3A; border: 1px solid #BFE3CC; }
.rt-ctx-generalizado { background: #EEF1F4; color: #4A5560; border: 1px solid #D5DBE1; }
.rt-graves li em + .rt-ctx { margin-left: .3rem; }
.rt-ctx-legenda { font-size: .85rem; color: var(--soft); margin: .4rem 0 0; line-height: 1.7; }
.rt-ctx-legenda .rt-ctx { margin-right: .25rem; cursor: default; }
@media (max-width: 760px) { .rt-graves li { grid-template-columns: 80px 1fr; } .rt-graves li em { grid-column: 1 / -1; } }
.cv-ctx { margin-top: 1rem; padding: .9rem 1rem; border-radius: 12px; background: var(--cream); border-left: 3px solid var(--gold); }
.cv-ctx h4 { margin: 0 0 .4rem; font-family: var(--serif); font-size: 1.05rem; color: var(--navy); display: flex; flex-wrap: wrap; gap: .4rem .6rem; align-items: center; }
.cv-ctx p { margin: .3rem 0 0; font-size: .95rem; }
.cv-ctx small { display: block; margin-top: .5rem; font-size: .78rem; color: var(--soft); }
.cv-ctx .rt-ctx { cursor: default; }
.cv-ctx-pendente { margin-top: .8rem; font-size: .85rem; color: var(--soft); }
@media (max-width: 760px) { .rt-graves li { grid-template-columns: 1fr 1fr; } }

/* ---- Vídeos (/videos e bloco nas rotas) ---- */
.vd-wrap, .rt-videos { padding: 56px 0; }
.vd-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(280px, 1fr)); gap: 1.2rem; margin-top: 1.2rem; }
.vd-grid article { background: #fff; border: 1px solid var(--line); border-radius: 14px; overflow: hidden; }
.vd-grid iframe { width: 100%; aspect-ratio: 9 / 16; border: 0; display: block; background: var(--navy); }
.vd-grid h3 { font-size: 1.05rem; padding: .8rem 1rem 0; }
.vd-grid p { padding: .3rem 1rem 1rem; font-size: .9rem; color: var(--soft); }

/* ---- Painel no estilo do criativo "registro oficial da ANAC" (/voos, /voos/<companhia> e bloco em /direito-aereo) ----
   Cartão escuro, código em dourado, situação em selo colorido. Desktop em grade; no celular cada linha vira um cartão. */
.pn { background: #0E1A22; color: #fff; border-radius: 20px; padding: .6rem 1.4rem 1rem; box-shadow: 0 20px 50px -24px rgba(10,37,51,.6); border: 1px solid rgba(255,255,255,.06); font-variant-numeric: tabular-nums; margin: 1rem 0 1.4rem; }
.pn-cab, .pn-linha { display: grid; grid-template-columns: minmax(0,2.4fr) repeat(4, minmax(0,.7fr)) minmax(0,1.6fr) 20px; gap: .8rem; align-items: center; }
.pn-voos .pn-cab, .pn-voos .pn-linha { grid-template-columns: minmax(0,1fr) minmax(0,1.8fr) minmax(0,.8fr) minmax(0,1.2fr); }
.pn-cab { padding: 1rem .2rem .8rem; border-bottom: 1px solid rgba(255,255,255,.1); font-size: .72rem; font-weight: 600; letter-spacing: .16em; text-transform: uppercase; color: rgba(255,255,255,.55); }
.pn-lista { list-style: none; margin: 0; padding: 0; }
.pn-lista li + li { border-top: 1px solid rgba(255,255,255,.08); }
.pn-linha { position: relative; padding: 1rem .2rem; color: inherit; text-decoration: none; border-radius: 10px; transition: background .15s; }
a.pn-linha:hover, a.pn-linha:focus-visible { background: rgba(255,255,255,.05); }
a.pn-linha:focus-visible { outline: 2px solid var(--sky); outline-offset: 2px; }
.pn-rota b { display: block; font-size: 1.15rem; font-weight: 700; letter-spacing: .04em; }
.pn-rota b i { font-style: normal; color: #F2C14E; margin-right: .35rem; }
.pn-rota small { display: block; margin-top: .15rem; font-size: .8rem; letter-spacing: .03em; color: rgba(255,255,255,.6); }
.pn-voo { font-size: 1.3rem; font-weight: 700; letter-spacing: .04em; color: #F2C14E; white-space: nowrap; }
.pn-voo small { display: block; margin-top: .15rem; font-size: .78rem; font-weight: 500; letter-spacing: .03em; color: rgba(255,255,255,.7); white-space: normal; }
.pn-rota small .pn-cia { color: rgba(255,255,255,.85); font-weight: 600; }
.pn-data { font-size: 1.15rem; font-weight: 600; letter-spacing: .04em; color: rgba(255,255,255,.85); }
.pn-n { text-align: right; font-weight: 600; color: rgba(255,255,255,.8); }
.pn-cab .pn-n { text-align: right; }
.pn-forte { color: #fff; font-weight: 800; }
.pn-sit { display: flex; align-items: center; gap: .45rem; flex-wrap: wrap; }
.pn-selo { font-style: normal; display: inline-block; padding: .42rem .95rem; border-radius: 999px; font-size: .72rem; font-weight: 800; letter-spacing: .14em; text-transform: uppercase; white-space: nowrap; }
.pn-verm { background: #9E2B2B; color: #fff; }
.pn-lar { background: #8C6A1C; color: #FCEBC0; }
.pn-verde { background: #1E5E3E; color: #CDEFD9; }
.pn-apagado .pn-selo { background: #34414A; color: #B8C2C8; }
.pn-apagado .pn-rota b, .pn-apagado .pn-n { color: rgba(255,255,255,.45); }
.pn-tend { font-style: normal; font-size: .8rem; font-weight: 700; }
.pn-tend-alta { color: #F2A2A2; } .pn-tend-baixa { color: #9FE0B6; } .pn-tend-igual { color: rgba(255,255,255,.45); }
.pn-ir { color: #F2C14E; font-size: 1.4rem; font-weight: 700; line-height: 1; text-align: right; transition: transform .15s; }
a.pn-linha:hover .pn-ir { transform: translateX(3px); }
.pn-rodape { margin: .9rem .2rem 0; font-size: .78rem; line-height: 1.5; color: rgba(255,255,255,.55); }
.pn-resumo { display: none; }
.pn-sr { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }
.pn-ajuda { display: flex; align-items: center; gap: .55rem; margin: .4rem 0 0; font-size: .95rem; font-weight: 500; color: var(--soft); }
.pn-ajuda svg { width: 22px; height: 22px; flex: none; color: var(--gold); }
.pv-sub { margin: 1.6rem 0 0; font-size: 1.2rem; }
.pv-cias { margin: .3rem 0 0; font-weight: 600; } .pv-cias a { color: var(--navy); }
@media (prefers-reduced-motion: no-preference) {
  .pn.in .pn-lista li { animation: pnsobe .45s cubic-bezier(.2,.8,.2,1) both; }
  .pn.in .pn-lista li:nth-child(2) { animation-delay: 50ms; } .pn.in .pn-lista li:nth-child(3) { animation-delay: 100ms; } .pn.in .pn-lista li:nth-child(4) { animation-delay: 150ms; }
  .pn.in .pn-lista li:nth-child(n+5) { animation-delay: 200ms; }
  @keyframes pnsobe { from { opacity: 0; transform: translateY(8px); } to { opacity: 1; transform: none; } }
}
@media (max-width: 760px) {
  .pn { padding: .3rem .9rem .8rem; border-radius: 16px; }
  .pn-cab { display: none; }
  .pn-linha, .pn-voos .pn-linha { grid-template-columns: minmax(0,1fr) auto; grid-template-areas: "rota sit" "nums nums"; gap: .35rem .6rem; padding: .9rem .1rem; }
  .pn-linha .pn-rota { grid-area: rota; }
  .pn-linha .pn-sit { grid-area: sit; justify-content: flex-end; }
  .pn-linha .pn-n { display: none; }
  .pn-resumo { display: block; grid-area: nums; font-size: .8rem; color: rgba(255,255,255,.7); }
  .pn-linha .pn-ir { display: none; }
  .pn-rota b { font-size: 1.02rem; }
  .pn-selo { padding: .36rem .7rem; font-size: .64rem; letter-spacing: .1em; }
  .pn-voos .pn-linha { grid-template-columns: auto minmax(0,1fr) auto; grid-template-areas: "voo data sit" "rota rota rota"; }
  .pn-voos .pn-voo { grid-area: voo; font-size: 1.1rem; } .pn-voos .pn-data { grid-area: data; font-size: .95rem; }
  .pn-voos .pn-rota { grid-area: rota; } .pn-voos .pn-sit { grid-area: sit; }
}
.btn-ghost { background: transparent; color: #fff; border: 1.5px solid rgba(255,255,255,.45); }
.btn-ghost:hover { border-color: #fff; }

/* pagina por companhia (/voos/american-airlines) */
.co-horas { list-style: none; margin: 1.2rem 0 1rem; padding: 0; display: grid; grid-template-columns: repeat(auto-fit, minmax(210px, 1fr)); gap: .9rem; }
.co-horas li { background: var(--white); border: 1px solid var(--line); border-top: 4px solid var(--gold); border-radius: 14px; padding: 1rem 1.1rem; display: grid; gap: .35rem; align-content: start; }
.co-horas b { font-family: var(--serif); font-size: 1.15rem; color: var(--navy); }
.co-horas span { font-size: .95rem; color: var(--text); }
.co-direitos, .co-provas { padding: 56px 0; }
.co-provas { background: var(--paper); }
.co-lista { margin: 1rem 0; padding-left: 1.2rem; display: grid; gap: .6rem; max-width: 820px; }
.co-lista li::marker { color: var(--gold); }
.co-lista a { color: var(--navy); font-weight: 600; }
/* Opinião do advogado: janela flutuante de vídeo nas páginas por voo */
.op-box { position: fixed; left: 14px; bottom: 14px; z-index: 49; width: 120px; border-radius: 14px; overflow: hidden; background: #000; box-shadow: 0 14px 30px -10px rgba(0,0,0,.5); animation: opsobe .5s cubic-bezier(.2,.8,.2,1) both; }
.op-box[hidden] { display: none; }
.op-abrir { display: block; width: 100%; padding: 0; border: 0; background: none; cursor: pointer; text-align: left; }
.op-abrir video { display: block; width: 100%; aspect-ratio: 9 / 14; object-fit: cover; }
.op-rotulo { display: flex; align-items: center; gap: .3rem; padding: .45rem .55rem; font-size: .74rem; font-weight: 600; color: #fff; background: var(--navy); line-height: 1.15; }
.op-fechar { position: absolute; top: 4px; right: 4px; width: 24px; height: 24px; border-radius: 50%; border: 0; background: rgba(0,0,0,.6); color: #fff; font-size: 16px; line-height: 1; cursor: pointer; z-index: 1; }
.op-abrir:focus-visible, .op-fechar:focus-visible, .op-modal-fechar:focus-visible { outline: 3px solid var(--sky); outline-offset: 2px; }
.op-modal { position: fixed; inset: 0; z-index: 60; background: rgba(5,15,22,.82); display: grid; place-items: center; padding: 16px; }
.op-modal-caixa { position: relative; width: min(420px, 100%); background: var(--paper); border-radius: 18px; padding: 14px; display: grid; gap: .7rem; }
.op-modal-caixa video { width: 100%; max-height: 70vh; border-radius: 12px; background: #000; }
.op-modal-fechar { position: absolute; top: -12px; right: -12px; width: 36px; height: 36px; border-radius: 50%; border: 0; background: var(--navy); color: #fff; font-size: 20px; cursor: pointer; }
.op-modal-nota { margin: 0; font-size: .78rem; color: var(--soft); }
@keyframes opsobe { from { opacity: 0; transform: translateY(16px); } to { opacity: 1; transform: none; } }
@media (prefers-reduced-motion: reduce) { .op-box { animation: none; } }
@media (max-width: 760px) { .op-box { width: 96px; left: 10px; bottom: 10px; } .op-rotulo { font-size: .66rem; } }

/* paginas por tema (/direito-aereo/overbooking, /bagagem) */
.tm-texto { max-width: 760px; margin-top: 1rem; }
.tm-texto p { margin: .8rem 0; color: var(--text); }
.tm-texto ol, .tm-texto ul { margin: .8rem 0 .8rem 1.3rem; padding: 0; display: grid; gap: .5rem; color: var(--text); }
.tm-texto li::marker { color: var(--gold); font-weight: 700; }
.tm-passos { list-style: none; counter-reset: passo; margin: 1rem 0 0; padding: 0; display: grid; gap: .6rem; }
.tm-passos li { counter-increment: passo; display: grid; grid-template-columns: 40px 1fr; gap: .7rem; align-items: start; background: var(--white); border: 1px solid var(--line); border-radius: 12px; padding: .9rem 1rem; font-size: .98rem; color: var(--text); }
.tm-passos li::before { content: counter(passo); font-family: var(--serif); font-size: 1.3rem; font-weight: 600; color: var(--gold); line-height: 1; }


/* "Ler com IA": abre ChatGPT, Claude, Perplexity ou o Modo IA do Google com a pergunta pronta sobre a página */
.ia-ler { display: flex; flex-wrap: wrap; align-items: center; gap: .4rem .5rem; margin: 1.1rem 0 .2rem; font-size: .85rem; color: var(--soft); }
.ia-ler span { margin-right: .2rem; }
.ia-ler a { display: inline-flex; align-items: center; padding: .32rem .75rem; border: 1px solid var(--line); border-radius: 999px; color: var(--navy); font-weight: 600; text-decoration: none; background: var(--white); transition: border-color .15s, color .15s; }
.ia-ler a:hover { border-color: var(--gold); color: var(--gold); }
.area-hero .ia-ler { color: rgba(255,255,255,.7); }
.area-hero .ia-ler a { background: transparent; color: #fff; border-color: rgba(255,255,255,.3); }
.area-hero .ia-ler a:hover { border-color: var(--gold); color: var(--gold); }

/* situações comuns (página da companhia) */
.co-casos { padding: 56px 0; background: var(--cream); }
.co-casos-grade { display: grid; grid-template-columns: repeat(auto-fit, minmax(260px, 1fr)); gap: 1rem; margin-top: 1.2rem; }
.co-casos article { background: var(--white); border: 1px solid var(--line); border-radius: 14px; padding: 1.2rem 1.3rem; }
.co-casos h3 { font-size: 1.12rem; margin: 0 0 .5rem; color: var(--navy); }
.co-casos p { margin: 0; font-size: .95rem; color: var(--text); }

/* páginas por aeroporto (/aeroportos/<slug>) */
.ae-duas { display: grid; grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)); gap: 1rem; margin: 1.2rem 0 .4rem; }
.ae-card { background: var(--white); border: 1px solid var(--line); border-top: 4px solid var(--navy); border-radius: 14px; padding: 1.1rem 1.2rem; }
.ae-card h3 { margin: 0 0 .6rem; font-size: 1.1rem; }
.ae-card ul { list-style: none; margin: 0; padding: 0; display: grid; gap: .45rem; font-size: .95rem; color: var(--text); }
.ae-card b { font-family: var(--serif); font-size: 1.15rem; color: var(--navy); margin-right: .2rem; }
.ae-obs { font-size: .88rem; color: var(--soft); margin: .6rem 0 0; }
.ae-sub { margin: 2.2rem 0 .6rem; font-size: 1.25rem; }
.ae-horas { display: grid; grid-template-columns: repeat(24, 1fr); gap: 4px; align-items: end; height: 170px; margin: 1rem 0 .4rem; padding: 12px 12px 0; background: #0E1A22; border-radius: 16px; }
.ae-barra { display: flex; flex-direction: column; justify-content: flex-end; align-items: center; height: 100%; gap: 4px; }
.ae-barra i { display: block; width: 100%; height: var(--h); min-height: 2px; border-radius: 4px 4px 0 0; background: rgba(242,193,78,.45); }
.ae-barra.ae-pior i { background: #F2C14E; }
.ae-barra small { font-size: .62rem; color: rgba(255,255,255,.6); padding-bottom: 6px; }
.pn-ae .pn-cab, .pn-ae .pn-linha { grid-template-columns: minmax(0,2fr) repeat(4, minmax(0,.8fr)) 20px; }
@media (max-width: 760px) {
  .ae-horas { gap: 2px; padding: 8px 6px 0; height: 140px; }
  .ae-barra small { font-size: .5rem; }
  .ae-barra:nth-child(odd) small { visibility: hidden; }
  .pn-ae .pn-linha { grid-template-columns: minmax(0,1fr) auto; grid-template-areas: "rota rota" "nums nums"; }
}

/* atalhos de aeroporto no topo de /direito-aereo */
.ae-atalhos { display: flex; flex-wrap: wrap; align-items: center; gap: .45rem .5rem; margin: .9rem 0 0; font-size: .85rem; color: rgba(255,255,255,.7); }
.ae-atalhos a { display: inline-flex; gap: .35rem; align-items: baseline; padding: .34rem .8rem; border-radius: 999px; background: rgba(255,255,255,.08); border: 1px solid rgba(255,255,255,.18); color: #fff; font-weight: 600; text-decoration: none; transition: border-color .15s, background .15s; }
.ae-atalhos a b { color: #F2C14E; font-weight: 800; letter-spacing: .04em; }
.ae-atalhos a:hover { border-color: var(--gold); background: rgba(255,255,255,.12); }
.ae-atalhos a.ae-todos { background: var(--gold); border-color: var(--gold); color: var(--navy); }