/* ============ CORES E FONTES ============
   Mude aqui para trocar as cores do site inteiro */
:root {
  --fundo: #fffdf9;
  --texto: #1e1e1c;
  --texto-suave: #3a3936;
  --cinza: #717570;
  --turquesa: #2de1e1;
  --lilas: #DDCCFF;
  --roxo: #8f5cf7;        /* roxo dos botões ao passar o mouse */
  --lilas-forte: #b48cff; /* lilás da logo, para textos sobre fundo claro */
  --azul-menu: #12b8b8;   /* turquesa um pouco mais fechado, legível no fundo claro */
  --escuro: #1e1e1c;
  --largura: 1240px;
  --serifada: "Playfair Display", Georgia, serif;
  --sans: Inter, -apple-system, "Segoe UI", sans-serif;
  --redonda: Fredoka, "Nunito", var(--sans);
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body {
  margin: 0;
  background: var(--fundo);
  color: var(--texto);
  font-family: var(--sans);
  font-size: 17px;
  line-height: 1.6;
}
img { display: block; max-width: 100%; }
/* Dificulta salvar as fotos: sem arrastar, sem selecionar e sem o menu "Salvar imagem" do celular */
img { -webkit-user-drag: none; user-select: none; -webkit-user-select: none; -webkit-touch-callout: none; }
a { color: inherit; }
h1, h2, h3, h4 { font-family: var(--serifada); font-weight: 600; line-height: 1.2; margin: 0; }
h2 { font-size: 36px; margin-bottom: 28px; }
h2 em { color: var(--turquesa); font-style: italic; font-weight: 500; }
h2.grande { font-size: 40px; }

/* Títulos das seções ("Escolhidos por nós", "Da nossa loja"…): grandes e em negrito.
   No fundo branco ficam azul-claro; no fundo lilás ficam brancos com contorno */
.titulo-secao {
  font-family: var(--sans); font-size: 28px; font-weight: 800; letter-spacing: .04em; line-height: 1.15;
  text-transform: uppercase; color: var(--turquesa); margin: 0 0 6px;
}
.faixa-lilas .titulo-secao { color: #fff; -webkit-text-stroke: 1.5px var(--texto); paint-order: stroke fill; }
#mes-nome { -webkit-text-stroke: 1px var(--texto); paint-order: stroke fill; }
h2.subtitulo-secao { font-size: 21px; font-weight: 700; margin-bottom: 24px; }
/* Título principal de página logo abaixo de um .titulo-secao (ex.: Sobre nós) */
.titulo-pagina.menor { font-size: 32px; font-weight: 700; }
.centro { text-align: center; }

/* Texto pequeno em maiúsculas acima dos títulos */
.sobretitulo {
  color: var(--turquesa);
  font-size: 14px;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  margin: 0 0 8px;
}
.sobretitulo.claro { color: #fff; }

/* Botões */
.botao {
  display: inline-block;
  background: var(--turquesa);
  color: var(--fundo);
  font-size: 15px;
  font-weight: 600;
  text-decoration: none;
  padding: 13px 28px;
  border-radius: 999px;
  border: 2px solid var(--turquesa);
  transition: transform .15s, opacity .15s;
}
.botao:hover { transform: translateY(-2px); opacity: .9; }
.botao.contorno { background: transparent; color: var(--texto); border-color: var(--texto); }

/* Largura padrão das seções */
.secao { max-width: var(--largura); margin: 0 auto; padding: 64px 24px; }
.faixa-lilas { background: var(--lilas); }

/* ============ CABEÇALHO ============ */
.topo {
  position: sticky; top: 0; z-index: 10;
  display: flex; align-items: center; justify-content: space-between;
  gap: 24px;
  padding: 14px 24px;
  background: var(--fundo);
}
.logo { text-decoration: none; display: flex; flex-direction: column; align-items: center; line-height: 1.2; flex-shrink: 0; }
.logo-imagem { height: 58px; width: auto; }
.logo-sub { font-size: 11px; letter-spacing: .1em; text-transform: uppercase; color: var(--texto-suave); }

.menu { display: flex; align-items: center; gap: 28px; font-size: 15px; }
/* Palavras do menu em azul; ficam lilás ao passar o mouse */
.menu a, .menu .sanfona > summary { text-decoration: none; color: var(--azul-menu); font-weight: 600; transition: color .15s; }
.menu > a:hover, .submenu > a:hover, .submenu-itens a:hover, .menu-celular a:hover, .menu .sanfona > summary:hover { color: var(--lilas-forte); }
.menu .mega a { font-weight: 500; }
.seta { font-size: 12px; }
.submenu { position: relative; }
.submenu-itens {
  display: none;
  position: absolute; top: 100%; left: 0;
  min-width: 220px;
  background: #fff;
  padding: 10px 0;
  border-radius: 6px;
  box-shadow: 0 8px 24px rgba(0,0,0,.12);
}
.submenu-itens a { display: block; padding: 6px 18px; }
.submenu-itens a:hover { background: var(--fundo); color: var(--turquesa); }
.submenu:hover .submenu-itens, .submenu:focus-within .submenu-itens { display: block; }

.redes { display: flex; gap: 14px; align-items: center; }
.redes svg { width: 24px; height: 24px; fill: currentColor; display: block; }

.menu-botao { display: none; background: none; border: 0; padding: 8px; cursor: pointer; }
.menu-botao span { display: block; width: 18px; height: 1.5px; background: var(--texto); margin: 5px 0; }

/* ============ CAPA ============ */
.capa { position: relative; height: 680px; overflow: hidden; display: grid; place-items: end center; padding-bottom: 56px; }
.capa-foto { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; object-position: 50% 90%; }
.capa::after { content: ""; position: absolute; inset: 0; background: linear-gradient(rgba(0,0,0,.08) 20%, rgba(0,0,0,.5) 75%); }
.capa-texto { position: relative; z-index: 1; text-align: center; color: #fff; padding: 0 24px; }
.capa h1 { font-family: Oswald, "Arial Narrow", var(--sans); font-size: 96px; font-weight: 700; letter-spacing: .01em; line-height: 1.05; margin: 8px 0 20px; text-shadow: 0 2px 18px rgba(0,0,0,.25); }
.capa-sub { font-size: 20px; margin: 0 0 28px; }

/* ============ DESTINOS ESCOLHIDOS ============ */
.grade-destinos { display: grid; grid-template-columns: repeat(5, 1fr); gap: 20px 18px; }
.destino { text-decoration: none; }
.destino img { aspect-ratio: 4 / 3; width: 100%; object-fit: cover; border-radius: 6px; transition: transform .2s; }
.destino:hover img { transform: scale(1.02); }
/* Destino ainda sem foto: mostra a bandeira grande */
.destino-sem-foto {
  aspect-ratio: 4 / 3; border-radius: 6px; display: grid; place-items: center;
  background: linear-gradient(160deg, #e3fbfb, #f7effc);
}
.destino-sem-foto img { width: 40%; height: auto; aspect-ratio: auto; border-radius: 4px; box-shadow: 0 6px 18px rgba(0,0,0,.15); }
.destino h3 { font-size: 20px; margin: 12px 0 2px; }
.destino p { font-size: 14px; color: var(--texto-suave); margin: 0; line-height: 1.5; }

.pilulas { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 36px; }
.pilulas a {
  font-size: 14px; text-decoration: none;
  padding: 7px 16px;
  border: 1px solid #ddd; border-radius: 999px;
}
.pilulas a:hover { border-color: var(--turquesa); }

/* ============ MESES ============ */
.meses { display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 24px; }
.meses button {
  font: 500 14px var(--sans);
  background: #fff; color: var(--texto);
  border: 0; border-radius: 999px;
  padding: 7px 14px; cursor: pointer;
}
.meses button[aria-selected="true"] { background: var(--turquesa); color: #fff; }
.dicas-mes { display: grid; grid-template-columns: repeat(3, 1fr); gap: 16px; }
.dicas-mes a {
  background: #fff; border-radius: 6px;
  padding: 16px 20px;
  text-decoration: none; font-size: 15px;
}
.dicas-mes strong { font-weight: 600; }
.dicas-mes .sem-dicas { grid-column: 1 / -1; margin: 0; opacity: .75; }

/* ============ CARTÕES (Comece aqui / posts) ============ */
.grade-3 { display: grid; grid-template-columns: repeat(3, 1fr); gap: 24px; }
.cartao { text-decoration: none; }
.cartao img { aspect-ratio: 4 / 3; width: 100%; object-fit: cover; border-radius: 6px; margin-bottom: 14px; }
.comece-aqui .cartao img { aspect-ratio: 4 / 5; }
.cartao h3 { font-size: 22px; text-decoration: underline; text-underline-offset: 4px; margin-bottom: 8px; }
.cartao h3.sem-sublinhado { text-decoration: none; }
.cartao p { font-size: 15px; color: var(--texto-suave); margin: 0; }
.cartao .sobretitulo { margin-bottom: 4px; }
#comece-aqui h2 { margin-bottom: 36px; }

/* ============ LOJA ============ */
.grade-loja { display: grid; grid-template-columns: repeat(4, 1fr); gap: 20px; margin-bottom: 32px; }
.produto { position: relative; text-decoration: none; }
.produto img { aspect-ratio: 1 / 1; width: 100%; object-fit: cover; border-radius: 6px; margin-bottom: 12px; }
.produto h3 { font-size: 20px; margin-bottom: 6px; }
.produto p { font-size: 14px; color: var(--texto-suave); margin: 0 0 8px; }
.preco { font-weight: 600; }
.selo {
  position: absolute; top: 10px; left: 10px; z-index: 1;
  background: var(--turquesa); color: #fff;
  font-size: 12px; font-weight: 600; text-transform: uppercase;
  padding: 3px 10px; border-radius: 999px;
}

/* ============ QUEM SOMOS ============ */
.quem-somos { display: grid; grid-template-columns: 1fr 1fr; align-items: center; }
.quem-somos-texto { padding: 64px 48px 64px max(24px, calc((100vw - var(--largura)) / 2 + 24px)); }
.quem-somos-texto > p:not([class]) { font-size: 16px; max-width: 460px; }
.quem-somos-texto > .titulo-contorno, .titulo-contorno {
  font-family: var(--redonda); font-size: 34px; font-weight: 600; letter-spacing: .06em; text-transform: uppercase;
  color: var(--turquesa); margin: 0 0 6px;
  -webkit-text-stroke: 2px var(--texto); paint-order: stroke fill;
}
.quem-somos-foto { width: 100%; height: 100%; max-height: 720px; object-fit: cover; }
.numeros { display: flex; gap: 32px; margin: 24px 0; }
.numeros strong { display: block; font-family: var(--serifada); font-size: 28px; color: var(--turquesa); }
.numeros span { font-size: 13px; color: var(--texto-suave); }
/* Sobre nós: número em preto e negrito, centralizado em cima do texto */
.numeros-centro { flex-wrap: wrap; gap: 20px 12px; text-align: center; }
.numeros-centro > div { flex: 1 1 84px; }
.numeros-centro span { display: block; line-height: 1.3; }
.numeros-centro strong { color: #000; font-weight: 700; }
.botoes { display: flex; flex-wrap: wrap; gap: 12px; margin-bottom: 24px; }
/* Foto em pé mostrada inteira, sem recorte */
.quem-somos-foto.foto-inteira { object-fit: contain; }

/* ============ PAÍSES ============ */
.grade-paises { display: grid; grid-template-columns: repeat(5, 1fr); gap: 16px; }
.pais { position: relative; text-decoration: none; color: #fff; border-radius: 6px; overflow: hidden; }
.pais img { aspect-ratio: 1 / 0.8; width: 100%; object-fit: cover; }
.pais::after { content: ""; position: absolute; inset: 0; background: linear-gradient(transparent 40%, rgba(0,0,0,.55)); }
.pais strong, .pais span { position: absolute; left: 14px; z-index: 1; }
.pais strong { bottom: 26px; font-family: var(--serifada); font-size: 18px; }
.pais span { bottom: 10px; font-size: 12px; }

/* ============ CHAMADA INSTAGRAM ============ */
.chamada h2 { margin-bottom: 12px; }
.chamada p { margin: 0 0 24px; color: var(--texto-suave); }

/* ============ RODAPÉ ============ */
.rodape { background: var(--escuro); color: #e9e7e2; padding: 56px 24px 24px; font-size: 14px; }
.rodape-colunas { max-width: var(--largura); margin: 0 auto; display: grid; grid-template-columns: 1.3fr 1fr 1fr; gap: 40px; }
.rodape-logo { display: block; height: 90px; width: auto; margin: 0 0 12px; }
.rodape h4 { font-size: 16px; color: #fff; margin-bottom: 14px; }
.rodape-colunas a { display: block; text-decoration: none; margin-bottom: 6px; }
.rodape-colunas a:hover { color: var(--turquesa); }
.rodape .redes a { margin: 0; }
.copyright { max-width: var(--largura); margin: 40px auto 0; padding-top: 20px; border-top: 1px solid #3a3936; color: #a9a7a2; }


/* ============ LUPA E PESQUISA ============ */
.topo-acoes { display: flex; align-items: center; gap: 4px; }
.lupa { background: none; border: 0; padding: 8px; cursor: pointer; color: var(--texto); }
.lupa svg { width: 20px; height: 20px; fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; display: block; }
.lupa:hover { color: var(--turquesa); }
.busca {
  position: fixed; inset: 0; z-index: 50;
  background: rgba(30, 30, 28, .55);
  display: flex; justify-content: center; align-items: flex-start;
  padding: 80px 16px 16px;
}
.busca[hidden] { display: none; }
.busca-caixa {
  position: relative;
  width: 100%; max-width: 720px; max-height: calc(100vh - 120px); overflow-y: auto;
  background: var(--fundo); border-radius: 12px;
  padding: 28px 28px 20px;
  --pagefind-ui-primary: var(--texto);
  --pagefind-ui-text: var(--texto);
  --pagefind-ui-background: #fff;
  --pagefind-ui-border: #ddd;
  --pagefind-ui-tag: var(--lilas);
  --pagefind-ui-border-radius: 8px;
  --pagefind-ui-font: var(--sans);
}
.busca-fechar { position: absolute; top: 10px; right: 14px; background: none; border: 0; font-size: 30px; line-height: 1; cursor: pointer; color: var(--texto); }
.sem-rolagem { overflow: hidden; }

/* ============ TOPO DAS PÁGINAS ============ */
.pagina-topo { max-width: var(--largura); margin: 0 auto; padding: 64px 24px 8px; }
.pagina-topo h1, .titulo-pagina { font-size: 52px; margin-bottom: 12px; }
.pagina-topo p { font-size: 19px; color: var(--texto-suave); max-width: 640px; margin: 0; }
.pagina-topo.com-foto { position: relative; max-width: none; height: 380px; padding: 0; display: flex; align-items: flex-end; color: #fff; }
.pagina-topo.com-foto img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.pagina-topo.com-foto::after { content: ""; position: absolute; inset: 0; background: linear-gradient(transparent 30%, rgba(0,0,0,.6)); }
.pagina-topo.com-foto > div { position: relative; z-index: 1; width: 100%; max-width: var(--largura); margin: 0 auto; padding: 0 24px 40px; }
.pagina-topo.com-foto p { color: #fff; }
.link-titulo { text-decoration: none; }
.link-titulo:hover { color: var(--turquesa); }
.vazio { color: var(--cinza); }
.espaco-topo { margin-top: 32px; }
.texto-estreito { max-width: 760px; }
.duas-colunas { display: grid; grid-template-columns: 1.2fr 1fr; gap: 48px; align-items: center; }
.foto-arredondada { border-radius: 8px; width: 100%; aspect-ratio: 4 / 3; object-fit: cover; }
.lista-simples { list-style: none; padding: 0; }
.lista-simples li { margin-bottom: 6px; }
.caixa-branca { background: #fff; border: 1px solid #eee; border-radius: 8px; padding: 24px; text-decoration: none; }
.caixa-branca h3 { font-size: 20px; margin-bottom: 6px; }
.caixa-branca p { margin: 0; color: var(--texto-suave); }
.paginacao { display: flex; justify-content: center; gap: 12px; margin-top: 40px; }
.botao.pequeno { padding: 8px 18px; font-size: 13px; margin-top: 16px; cursor: pointer; font-family: var(--sans); }

/* ============ POST ============ */
.post { max-width: 760px; margin: 0 auto; padding: 56px 24px 64px; }
.post-topo .sobretitulo { text-decoration: none; display: inline-block; }
.post h1 { font-size: 52px; margin-bottom: 12px; }
.post-info { font-size: 14px; color: var(--cinza); margin: 0 0 24px; }
.post-capa { width: 100%; border-radius: 8px; margin-bottom: 24px; aspect-ratio: 16 / 9; object-fit: cover; }
.post-capa.capa-inteira { aspect-ratio: auto; height: auto; }
.aviso-afiliados { font-size: 14px; font-style: italic; color: var(--cinza); }

.indice { border-left: 3px solid var(--turquesa); background: #fff; padding: 18px 24px; margin: 28px 0; border-radius: 0 8px 8px 0; }
.indice ol { columns: 2; margin: 0; padding-left: 20px; font-size: 15px; }
.indice a { text-decoration: none; }
.indice a:hover { color: var(--turquesa); }

.post-conteudo { font-size: 18px; line-height: 1.75; }
.post-conteudo h2 { font-size: 32px; margin: 48px 0 16px; scroll-margin-top: 90px; }
.post-conteudo h3 { font-size: 22px; margin: 28px 0 8px; }
.post-conteudo img { border-radius: 8px; margin: 24px auto; width: auto; max-width: 100%; max-height: 640px; height: auto; }
.post-conteudo figure { margin: 28px 0; }
.post-conteudo figure img { margin: 0; }
.post-conteudo figcaption { font-size: 14px; color: var(--cinza); text-align: center; margin-top: 8px; }
.post-conteudo a { color: #0aa9a9; }
.post-conteudo .botao { color: var(--fundo); }
.post-conteudo table { width: 100%; border-collapse: collapse; font-size: 15px; margin: 16px 0; display: block; overflow-x: auto; }
.post-conteudo th, .post-conteudo td { padding: 8px 12px; border-bottom: 1px solid #eee; text-align: left; white-space: nowrap; }
.post-conteudo th { background: #fff; font-weight: 600; }
.post-conteudo blockquote { border-left: 3px solid var(--lilas); margin: 24px 0; padding: 4px 20px; font-style: italic; color: var(--texto-suave); }
.post-conteudo details { background: #fff; border: 1px solid #eee; border-radius: 8px; padding: 12px 18px; margin-bottom: 8px; }
.post-conteudo summary { font-weight: 600; cursor: pointer; }
.post-conteudo details p { margin: 8px 0 0; }

/* Vídeo do YouTube (tamanho certo em qualquer tela) */
.video { position: relative; aspect-ratio: 16 / 9; margin: 28px 0; border-radius: 8px; overflow: hidden; background: #000; }
.video iframe { position: absolute; inset: 0; width: 100%; height: 100%; border: 0; }

/* Caixas coloridas dentro do post */
.caixa { border-radius: 8px; padding: 20px 24px; margin: 28px 0; }
.caixa h3 { margin-top: 0; }
.caixa p { margin: 6px 0 14px; }
.caixa p:last-child { margin-bottom: 0; }
.caixa.lilas { background: var(--lilas); }
.caixa.dica { background: #e3fbfb; border-left: 4px solid var(--turquesa); }
.caixa.aviso { background: #fff6e0; border-left: 4px solid #f2b928; }

.hoteis { display: grid; grid-template-columns: repeat(3, 1fr); gap: 14px; margin: 20px 0; }
.hoteis > div { background: #fff; border: 1px solid #eee; border-radius: 8px; padding: 18px; font-size: 15px; line-height: 1.5; }
.hoteis h3 { font-size: 17px; margin: 6px 0; }
.hoteis p { margin: 0 0 10px; color: var(--texto-suave); }
.faixa-preco { color: var(--turquesa); font-weight: 600; }

.compartilhar { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; margin: 48px 0 24px; padding-top: 24px; border-top: 1px solid #eee; }
.compartilhar strong { margin-right: 6px; }
.compartilhar a, .compartilhar button {
  font: 600 14px var(--sans); text-decoration: none; color: #fff; cursor: pointer;
  border: 0; border-radius: 999px; padding: 8px 16px;
}
.compartilhar .whatsapp { background: #25d366; }
.compartilhar .instagram { background: linear-gradient(45deg, #f9a825, #e1306c 45%, #833ab4); color: #fff; border: 0; }
.compartilhar .facebook { background: #1877f2; }
.compartilhar .pinterest { background: #e60023; }
.compartilhar .x { background: #000; }
.compartilhar .copiar-link { background: #fff; color: var(--texto); border: 1px solid #ccc; }

.post-tags { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; font-size: 14px; }
.post-tags p { margin: 0 6px 0 0; color: var(--cinza); }
.post-tags a { text-decoration: none; border: 1px solid #ddd; border-radius: 999px; padding: 4px 12px; }

.autores { display: flex; gap: 20px; align-items: center; background: var(--lilas); border-radius: 8px; padding: 20px; margin: 32px 0; }
.autores img { width: 96px; height: 96px; border-radius: 50%; object-fit: cover; flex-shrink: 0; }
.autores h3 { font-size: 20px; margin-bottom: 4px; }
.autores p { margin: 0; font-size: 15px; }
.autores .sobretitulo { color: var(--texto); margin-bottom: 2px; }

.comentarios { margin-top: 40px; }
.comentarios h2 { font-size: 28px; margin-bottom: 16px; }
.comentarios h3 { font-size: 22px; margin: 32px 0 4px; }
.comentarios .nota { font-size: 14px; color: var(--cinza); margin: 0 0 16px; }
.comentario { border-bottom: 1px solid #eee; padding: 16px 0; }
.comentario-topo { margin: 0 0 4px; font-size: 15px; }
.comentario-topo span { color: var(--cinza); font-size: 13px; margin-left: 6px; }
.comentario-texto { margin: 0; white-space: pre-line; }
.comentario.resposta { border: 0; border-left: 3px solid var(--turquesa); background: #fff; border-radius: 0 8px 8px 0; padding: 12px 16px; margin: 12px 0 0 20px; }
.selo-autor { background: var(--turquesa); color: #fff; font-style: normal; font-size: 11px; font-weight: 600; text-transform: uppercase; padding: 2px 8px; border-radius: 999px; }

/* Formulários (comentários e administração) */
.form-comentario { display: grid; gap: 14px; }
.form-comentario label, .admin-login label { display: grid; gap: 6px; font-size: 14px; font-weight: 500; }
.form-linha { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; }
input, textarea {
  font: 16px var(--sans); color: var(--texto);
  background: #fff; border: 1px solid #ccc; border-radius: 8px; padding: 10px 12px; width: 100%;
}
input:focus, textarea:focus { outline: 2px solid var(--turquesa); border-color: transparent; }
.form-comentario .botao { justify-self: start; cursor: pointer; font-family: var(--sans); }
.botao:disabled { opacity: .5; cursor: wait; }
.form-mensagem { margin: 0; font-size: 15px; }
.form-mensagem.sucesso { color: #12805c; }
.form-mensagem.erro { color: #c0392b; }
.form-comentario label.check { display: flex; align-items: center; gap: 10px; font-weight: 400; cursor: pointer; }
.check input { width: 18px; height: 18px; accent-color: var(--turquesa); margin: 0; flex-shrink: 0; }
/* Estrelas (avaliações) */
.estrelas { border: 0; padding: 0; margin: 0; display: inline-flex; flex-direction: row-reverse; justify-content: flex-end; gap: 2px; }
.estrelas legend { font-size: 14px; font-weight: 500; margin-bottom: 4px; width: 100%; }
.estrelas input { position: absolute; opacity: 0; width: 1px; height: 1px; }
.estrelas label { font-size: 36px; line-height: 1; color: #d6d2c8; cursor: pointer; transition: color .1s, transform .1s; }
.estrelas label:hover, .estrelas label:hover ~ label,
.estrelas input:checked ~ label { color: #f2b928; }
.estrelas label:hover { transform: scale(1.12); }
.estrelas input:focus-visible + label { outline: 2px solid var(--turquesa); border-radius: 4px; }
.estrelas-nota { color: #f2b928; letter-spacing: 2px; margin-left: 8px; }
.media-avaliacoes { font-size: 18px; margin: -12px 0 20px; }
.media-avaliacoes .estrelas-nota.grande { font-size: 26px; margin-left: 0; }
.avaliacoes .comentario { background: #fff; border: 0; border-radius: 10px; padding: 16px 20px; margin-bottom: 12px; }
.avaliacoes .comentario.resposta { background: var(--fundo); }
.caixa-avaliar { background: #fff; border-radius: 12px; padding: 24px; margin: 28px auto 0; max-width: 760px; }
.caixa-avaliar h3 { margin-top: 0; }
.escondido { position: absolute; left: -9999px; width: 1px; height: 1px; overflow: hidden; }

/* ============ ADMINISTRAÇÃO DOS COMENTÁRIOS ============ */
.admin { max-width: 900px; margin: 0 auto; padding: 48px 24px; }
/* Depoimentos de clientes (Sobre nós) — vêm de _data/depoimentos.json */
.depoimentos { display: grid; grid-template-columns: repeat(auto-fill, minmax(280px, 1fr)); gap: 20px; }
.depoimento { background: #fff; border: 1px solid #eee; border-radius: 12px; padding: 24px; margin: 0; display: flex; flex-direction: column; gap: 14px; }
.depoimento blockquote { margin: 0; font-size: 16px; line-height: 1.6; }
.depoimento blockquote::before { content: "“"; display: block; font-family: var(--serifada); font-size: 48px; line-height: .6; color: var(--turquesa); }
.depoimento figcaption { font-size: 14px; color: var(--texto-suave); margin-top: auto; }
.depoimento figcaption strong { display: block; color: var(--texto); font-size: 15px; }
.admin h1 { font-size: 40px; margin-bottom: 8px; }
.admin-login { display: grid; gap: 12px; max-width: 360px; margin-top: 24px; }
.admin-login[hidden], .admin-painel[hidden] { display: none; }
.admin-login .botao { cursor: pointer; font-family: var(--sans); justify-self: start; }
.admin-filtros { display: flex; flex-wrap: wrap; gap: 8px; margin: 24px 0; }
.admin-filtros button { font: 500 14px var(--sans); background: #fff; border: 1px solid #ddd; border-radius: 999px; padding: 7px 16px; cursor: pointer; }
.admin-filtros button[aria-pressed="true"] { background: var(--texto); color: #fff; border-color: var(--texto); }
.admin-item { background: #fff; border: 1px solid #eee; border-radius: 8px; padding: 18px 20px; margin-bottom: 12px; }
.admin-item.pendente { border-left: 4px solid #f2b928; }
.admin-item.aprovado { border-left: 4px solid #25b37a; }
.admin-meta { font-size: 13px; color: var(--cinza); margin: 0 0 8px; }
.admin-meta a { color: inherit; }
.pediu-aviso { color: #8a4fb0; font-weight: 600; }
.admin-item .comentario-texto { margin-bottom: 12px; }
.admin-acoes { display: flex; flex-wrap: wrap; gap: 8px; }
.admin-acoes button { font: 600 13px var(--sans); border: 1px solid #ccc; background: #fff; border-radius: 999px; padding: 6px 14px; cursor: pointer; }
.admin-acoes .aprovar { background: #25b37a; border-color: #25b37a; color: #fff; }
.admin-acoes .apagar { color: #c0392b; border-color: #e7b3ad; }
.admin-resposta { display: grid; gap: 8px; margin-top: 12px; }
.admin-resposta[hidden] { display: none; }

.aviso-flutuante {
  position: fixed; bottom: 24px; left: 50%; transform: translateX(-50%); z-index: 60;
  background: var(--escuro); color: #fff; padding: 10px 20px; border-radius: 999px; font-size: 14px;
}


/* ============ MENU GRANDE DE DESTINOS ============ */
.tem-mega { position: static; }
.mega {
  position: absolute; top: 100%; left: 50%;
  width: min(1180px, calc(100vw - 48px));
  transform: translate(-50%, 8px);
  background: #fff; border-radius: 16px; overflow: hidden;
  box-shadow: 0 24px 60px rgba(30, 30, 28, .18);
  opacity: 0; visibility: hidden;
  transition: opacity .18s, transform .18s, visibility 0s linear .18s;
}
/* "ponte" invisível para o mouse não perder o menu no caminho */
.mega::before { content: ""; position: absolute; left: 0; right: 0; top: -24px; height: 24px; }
.tem-mega:hover .mega, .tem-mega:focus-within .mega, .tem-mega.aberto .mega {
  opacity: 1; visibility: visible; transform: translate(-50%, 0);
  transition-delay: 0s;
}
.mega-corpo { display: grid; grid-template-columns: 210px 1fr 300px; gap: 0; padding: 24px; }
.mega-regioes { list-style: none; margin: 0; padding: 0 16px 0 0; border-right: 1px solid #f0eee9; }
.mega-regioes button {
  width: 100%; display: flex; justify-content: space-between; align-items: center;
  font: 600 16px var(--sans); color: var(--texto); text-align: left;
  background: none; border: 0; border-radius: 10px; padding: 14px 16px; cursor: pointer;
}
.mega-regioes button span { opacity: 0; color: var(--cinza); }
.mega-regioes button[aria-current="true"] { background: #f5f2ec; }
.mega-regioes button[aria-current="true"] span { opacity: 1; }
.mega-lugares { padding: 0 24px; border-right: 1px solid #f0eee9; }
.mega-grupo[hidden] { display: none; }
.mega-titulo {
  display: flex; justify-content: space-between; align-items: center;
  font: 600 18px var(--serifada); text-decoration: none;
  padding-bottom: 12px; margin: 4px 0 16px; border-bottom: 1px solid #f0eee9;
}
a.mega-titulo:hover { color: var(--turquesa); }
.mega-grade { display: grid; grid-template-columns: repeat(3, 1fr); gap: 12px; }
.mega-lugar {
  position: relative; display: flex; align-items: center; justify-content: center; gap: 8px;
  background: #f5f2ec; border-radius: 999px; padding: 11px 14px;
  font-weight: 600; font-size: 15px; text-decoration: none; text-align: center;
  transition: background .15s, transform .15s;
}
.mega-lugar:hover { background: #e3fbfb; transform: translateY(-1px); }
.mega-lugar span { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.mega-lugar.sub { font-weight: 500; }
.bandeira { width: 20px; height: 14px; object-fit: cover; border-radius: 2px; box-shadow: 0 0 0 1px rgba(0,0,0,.08); flex-shrink: 0; }
.mega-selo {
  position: absolute; top: -8px; right: 12px;
  background: #fde7d6; color: #b45a1c;
  font-style: normal; font-size: 10px; font-weight: 700; letter-spacing: .04em; text-transform: uppercase;
  padding: 2px 7px; border-radius: 999px;
}
.mega-selo.novo { background: var(--lilas); color: #5b2d7a; }
.mega-lado { padding-left: 24px; }
.mega-chips { display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 20px; }
.mega-chips a { background: #e3fbfb; color: #0b7f7f; font-weight: 600; font-size: 14px; text-decoration: none; padding: 7px 14px; border-radius: 10px; }
.mega-chips a:hover { background: var(--turquesa); color: #fff; }
.mega-cartao { background: #f7effc; border-radius: 12px; padding: 20px; }
.mega-cartao h4 { font-size: 19px; margin: 0 0 6px; }
.mega-cartao p:not(.sobretitulo) { font-size: 14px; color: var(--texto-suave); margin: 0 0 10px; line-height: 1.5; }
.mega-cartao a { font-size: 14px; font-weight: 600; color: #8a4fb0; text-decoration: none; }
.mega-cartao .sobretitulo { color: #8a4fb0; font-size: 11px; }
.mega-rodape {
  display: block; text-align: center; background: #f5f2ec; text-decoration: none;
  font: 600 17px var(--serifada); padding: 16px;
}
.mega-rodape:hover { color: var(--turquesa); }

/* ============ BARRA DE PESQUISA DA CAPA ============ */
.capa-busca {
  display: flex; align-items: center; gap: 8px;
  width: min(720px, 100%); margin: 0 auto;
  background: #fff; border-radius: 999px; padding: 8px 8px 8px 22px;
  box-shadow: 0 12px 40px rgba(0,0,0,.25);
}
.capa-busca svg { width: 22px; height: 22px; fill: none; stroke: var(--cinza); stroke-width: 2; stroke-linecap: round; flex-shrink: 0; }
.capa-busca input {
  flex: 1; min-width: 0; border: 0; outline: 0; background: transparent; padding: 10px 4px;
  font: 400 20px var(--serifada); color: var(--texto);
}
.capa-busca input:focus { outline: 0; }
.capa-busca input::placeholder { color: var(--cinza); }
.capa-busca button {
  display: flex; align-items: center; gap: 8px;
  background: var(--turquesa); color: #fff; border: 0; border-radius: 999px;
  font: 700 15px var(--sans); letter-spacing: .08em; text-transform: uppercase;
  padding: 15px 26px; cursor: pointer; transition: transform .15s, background .15s;
}
.capa-busca button:hover { background: #1fc9c9; transform: translateY(-1px); }
.capa-alta { display: flex; flex-wrap: wrap; justify-content: center; align-items: center; gap: 10px; margin-top: 20px; }
.capa-alta span { font-size: 15px; font-weight: 500; text-shadow: 0 1px 6px rgba(0,0,0,.4); }
.capa-alta a {
  color: #fff; text-decoration: none; font-weight: 600; font-size: 15px;
  background: rgba(255,255,255,.18); border: 1px solid rgba(255,255,255,.55);
  backdrop-filter: blur(6px); -webkit-backdrop-filter: blur(6px);
  padding: 8px 18px; border-radius: 999px; transition: background .15s;
}
.capa-alta a:hover { background: rgba(255,255,255,.35); }

/* ============ TABLET ============ */
@media (max-width: 1024px) {
  .grade-destinos { grid-template-columns: repeat(4, 1fr); }
  .grade-loja { grid-template-columns: repeat(2, 1fr); }
  .grade-paises { grid-template-columns: repeat(3, 1fr); }
}

/* ============ CELULAR / MENU RECOLHIDO ============ */
/* Menu do celular (grupos que abrem e fecham) — escondido no computador */
.menu-celular { display: none; }

@media (max-width: 1100px) {
  .menu-botao { display: block; }
  /* O menu ocupa a tela abaixo do cabeçalho e rola sozinho */
  .menu {
    display: none;
    position: fixed; top: var(--altura-topo, 64px); left: 0; right: 0; bottom: 0;
    flex-direction: column; align-items: stretch; gap: 0;
    background: var(--fundo);
    padding: 8px 24px 40px;
    overflow-y: auto; overscroll-behavior: contain; -webkit-overflow-scrolling: touch;
    border-top: 1px solid #eee;
  }
  .menu.aberto { display: flex; }
  .menu > a { display: block; padding: 14px 0; font-size: 17px; border-bottom: 1px solid #eee; }
  .menu .submenu { display: none; } /* versão do computador */
  .menu .redes { margin-top: 20px; gap: 22px; }
  .menu .redes svg { width: 28px; height: 28px; }

  .menu-celular { display: block; }
  .sanfona > summary {
    list-style: none; cursor: pointer;
    display: flex; align-items: center; gap: 8px;
    padding: 14px 0; font-size: 17px; border-bottom: 1px solid #eee;
    -webkit-tap-highlight-color: transparent;
  }
  .sanfona > summary::-webkit-details-marker { display: none; }
  .sanfona > summary::after {
    content: ""; margin-left: auto; margin-right: 4px; width: 8px; height: 8px;
    border-right: 2px solid var(--cinza); border-bottom: 2px solid var(--cinza);
    transform: translateY(-3px) rotate(45deg); transition: transform .2s;
  }
  .sanfona[open] > summary::after { transform: translateY(2px) rotate(-135deg); border-color: #0b9c9c; }
  .sanfona[open] > summary { color: #0b9c9c; font-weight: 600; }
  .sanfona-corpo { padding-left: 16px; border-left: 2px solid var(--lilas); margin: 4px 0 8px 4px; }
  .sanfona-corpo > a, .sanfona-corpo .sanfona > summary {
    display: flex; align-items: center; gap: 10px;
    padding: 12px 0; font-size: 16px; text-decoration: none; border-bottom: 1px solid #f2f0eb;
  }
  .sanfona-corpo a.ver-todos { color: #0b9c9c; font-weight: 600; font-size: 15px; }
  .duas-colunas { grid-template-columns: 1fr; }
}

@media (max-width: 700px) {
  h2, h2.grande { font-size: 28px; }
  .titulo-secao { font-size: 22px; }
  h2.subtitulo-secao { font-size: 18px; }
  .titulo-pagina.menor { font-size: 26px; }
  .secao { padding: 48px 16px; }
  .topo { padding: 10px 16px; }
  .logo-imagem { height: 46px; }
  .logo-sub { font-size: 9px; }
  .capa-guia { min-height: 560px; }
  .capa-guia h1 { font-size: 52px; }
  .capa-guia-sub { font-size: 17px; }
  .nesse-guia a { padding: 9px 14px; font-size: 14px; }
  .capa { height: 640px; padding-bottom: 36px; }
  /* No celular, aproxima a foto pela parte de baixo para o casal ficar acima do título */
  .capa-foto { transform: scale(1.35); transform-origin: 50% 100%; }
  .capa h1 { font-size: 46px; }
  .capa-sub { font-size: 17px; }
  .capa-busca { padding: 6px 6px 6px 16px; }
  .capa-busca svg { display: none; }
  .capa-busca input { font-size: 17px; }
  .capa-busca button { padding: 12px 16px; font-size: 13px; }
  .capa-busca button .seta-texto { display: none; }
  .capa-alta { gap: 8px; }
  .capa-alta a { padding: 6px 14px; font-size: 14px; }
  .grade-destinos { grid-template-columns: repeat(2, 1fr); gap: 20px 12px; }
  .destino h3 { font-size: 18px; }
  .dicas-mes, .grade-3 { grid-template-columns: 1fr; }
  .grade-loja { grid-template-columns: repeat(2, 1fr); }
  .grade-paises { grid-template-columns: repeat(2, 1fr); }
  .quem-somos { grid-template-columns: 1fr; }
  .quem-somos-texto { padding: 48px 16px; }
  .quem-somos-foto { max-height: 520px; }
  .rodape { padding: 48px 16px 24px; }
  .rodape-colunas { grid-template-columns: 1fr; gap: 28px; }
  .pagina-topo { padding: 40px 16px 0; }
  .pagina-topo h1, .titulo-pagina, .post h1 { font-size: 36px; }
  .pagina-topo.com-foto { height: 300px; }
  .pagina-topo.com-foto > div { padding: 0 16px 28px; }
  .post { padding: 36px 16px 48px; }
  .post-conteudo { font-size: 17px; }
  .post-conteudo h2 { font-size: 26px; }
  .indice ol { columns: 1; }
  .hoteis { grid-template-columns: 1fr; }
  .autores { flex-direction: column; text-align: center; }
  .form-linha { grid-template-columns: 1fr; }
  .comentario.resposta { margin-left: 8px; }
}

/* ============ CAPA DAS PÁGINAS DE DESTINO (estilo guia de viagem) ============ */
.capa-guia { position: relative; min-height: 620px; display: flex; align-items: flex-end; color: #fff; overflow: hidden;
  clip-path: ellipse(120% 100% at 50% 0); }
.capa-guia > img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.capa-guia::after { content: ""; position: absolute; inset: 0; background: linear-gradient(90deg, rgba(0,0,0,.55), rgba(0,0,0,.15) 65%), linear-gradient(transparent 50%, rgba(0,0,0,.35)); }
.capa-guia-texto { position: relative; z-index: 1; width: 100%; max-width: var(--largura); margin: 0 auto; padding: 0 24px 90px; }
.capa-guia h1 { font-family: Oswald, "Arial Narrow", var(--sans); font-size: 96px; font-weight: 700; line-height: 1; margin: 6px 0 16px; text-shadow: 0 2px 18px rgba(0,0,0,.25); }
.capa-guia-sub { font-size: 20px; max-width: 620px; margin: 0 0 26px; }
/* Capa das outras páginas: a foto segue presa embaixo para a marca d'água não ser cortada */
.capa-pagina > img { object-position: 50% 100%; }
.capa-pagina .capa-guia-texto { padding-bottom: 48px; }
@media (max-width: 900px) {
  .capa-guia.capa-pagina { min-height: 420px; }
  .capa-pagina h1 { font-size: 52px; }
  .capa-pagina .capa-guia-sub { font-size: 17px; }
}
.nesse-guia-titulo { font-size: 13px; letter-spacing: .14em; text-transform: uppercase; margin: 0 0 10px; opacity: .9; }
.nesse-guia { display: flex; flex-wrap: wrap; gap: 10px; }
.nesse-guia a { display: inline-flex; align-items: center; gap: 8px; background: #fff; color: var(--texto); font-weight: 700; font-size: 16px;
  text-decoration: none; padding: 11px 20px; border-radius: 10px; box-shadow: 0 2px 10px rgba(0,0,0,.12); transition: transform .15s; }
.nesse-guia a:hover { transform: translateY(-2px); }
.selo-em-breve { display: inline-block; background: var(--lilas); color: var(--texto); font-weight: 700; letter-spacing: .08em; text-transform: uppercase; font-size: 14px; padding: 8px 18px; border-radius: 999px; margin: 0; }

/* ============ DESTINOS SEM POSTS AINDA ("Em breve", sem link) ============ */
.em-breve { cursor: default; }
.em-breve:hover { transform: none !important; }
.em-breve:not(.destino):not(.pais):not(.cartao)::after { content: "em breve"; margin-left: 6px; font-size: 10px; font-weight: 700; letter-spacing: .06em; text-transform: uppercase;
  background: var(--lilas); color: #5b2d7a; padding: 2px 6px; border-radius: 999px; vertical-align: middle; white-space: nowrap; }
.menu .em-breve, .mega .em-breve { opacity: .75; }
.destino.em-breve, .cartao.em-breve { position: relative; display: block; }
.destino.em-breve::before, .cartao.em-breve::before { content: "Em breve"; position: absolute; top: 12px; left: 12px; z-index: 1;
  background: var(--lilas); color: #3d1d5c; font-size: 12px; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; padding: 5px 12px; border-radius: 999px; }
.destino.em-breve img, .destino.em-breve .destino-sem-foto { filter: saturate(.75); }
.post-topo .sobretitulo.post-lugar { display: block; margin-top: 2px; color: var(--texto); }

/* ============ POSTS: destino em destaque + "Nesse guia" ============ */
.post-destino { display: block; font-family: Oswald, "Arial Narrow", var(--sans); font-size: 72px; font-weight: 700; line-height: 1; color: var(--texto); text-decoration: none; }
.post-topo .sobretitulo.post-regiao { display: block; margin: 8px 0 14px; font-size: 16px; font-weight: 700; }
.post h1.post-titulo-menor { font-size: 32px; font-weight: 600; }
.nesse-guia-post { margin: 0 0 28px; }
.nesse-guia-post .nesse-guia-titulo { color: var(--texto-suave); font-weight: 700; }
.nesse-guia-post .nesse-guia a { border: 1px solid #ece8e0; box-shadow: 0 2px 8px rgba(0,0,0,.06); font-size: 15px; padding: 9px 16px; }
@media (max-width: 700px) {
  .post-destino { font-size: 48px; }
  .post h1.post-titulo-menor { font-size: 24px; }
  .nesse-guia-post .nesse-guia { gap: 8px; }
  .nesse-guia-post .nesse-guia a { font-size: 13px; padding: 7px 12px; }
}

/* ============ PASSAR O MOUSE: botões crescem um pouco e ficam roxos; fotos só dão um zoom leve ============ */
.botao, .nesse-guia a, .pilulas a, .capa-alta a, .mega-chips a, .compartilhar a, .compartilhar button, .capa-busca button,
.redes a, .mega-lugar, .meses button, .dicas-mes a, .copiar-link, .compartilhar-blog {
  transition: transform .2s ease, background-color .2s ease, color .2s ease, border-color .2s ease;
}
.botao:not(.em-breve):hover, .capa-busca button:hover, .compartilhar a:hover, .compartilhar button:hover {
  transform: scale(1.05); background: var(--roxo); border-color: var(--roxo); color: #fff; opacity: 1;
}
.botao.contorno:hover { background: var(--roxo); border-color: var(--roxo); color: #fff; }
.nesse-guia a:not(.em-breve):hover, .pilulas a:not(.em-breve):hover, .mega-chips a:not(.em-breve):hover,
.dicas-mes a:not(.em-breve):hover, .meses button:hover, .mega-lugar:not(.em-breve):hover {
  transform: scale(1.05); color: var(--roxo); border-color: var(--roxo);
}
.capa-alta a:not(.em-breve):hover { transform: scale(1.05); background: var(--roxo); border-color: var(--roxo); color: #fff; }
.redes a:hover { transform: scale(1.15); color: var(--roxo); }
.redes a:hover svg { fill: var(--roxo); }

.foto-zoom { display: block; overflow: hidden; border-radius: 6px; }
.foto-zoom img { display: block; border-radius: 0; margin: 0; transition: transform .35s ease; }
.cartao .foto-zoom, .produto .foto-zoom { margin-bottom: 14px; }
a:hover > .foto-zoom img, a:hover .foto-zoom img, .pais:not(.em-breve):hover img { transform: scale(1.05); }
.em-breve:hover .foto-zoom img { transform: none; }
.pais img { transition: transform .35s ease; }

/* ============ TERMÔMETRO DO CLIMA ({% clima "lugar" %} nos posts) ============ */
.clima { --melhor: #4e8a4f; --boa: #9cc98a; --mista: #f0b85a; --evitar: #e3796c;
  background: #f4f2ee; border-radius: 16px; padding: 22px 22px 16px; margin: 24px 0 32px; font-family: var(--sans); }
.clima-topo { display: flex; flex-wrap: wrap; align-items: center; gap: 10px 16px; margin-bottom: 18px; }
.clima-titulo { font-weight: 800; font-size: 18px; margin: 0; }
.clima-seletor { font: inherit; font-weight: 700; font-size: 15px; padding: 8px 34px 8px 14px; border: 0; border-radius: 999px; background: #e7e3dc; cursor: pointer; }
.clima-legenda { display: flex; gap: 14px; margin: 0 0 0 auto; font-size: 13px; color: var(--texto-suave); }
.clima-legenda span::before { content: ""; display: inline-block; width: 10px; height: 10px; border-radius: 50%; margin-right: 5px; background: var(--c); }
.clima-legenda .melhor { --c: var(--melhor); } .clima-legenda .boa { --c: var(--boa); }
.clima-legenda .mista { --c: var(--mista); } .clima-legenda .evitar { --c: var(--evitar); }
.clima-grafico { display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); gap: 6px; }
.clima-grafico[hidden] { display: none; }
.clima-mes { --c: var(--boa); display: flex; flex-direction: column; align-items: center; gap: 6px; }
.clima-melhor { --c: var(--melhor); } .clima-mista { --c: var(--mista); } .clima-evitar { --c: var(--evitar); }
.clima-icone { font-size: 20px; line-height: 1; }
.clima-coluna { position: relative; width: 100%; height: 190px; border-radius: 999px; background: color-mix(in srgb, var(--c) 18%, #fff);
  display: flex; flex-direction: column; justify-content: flex-end; align-items: center; padding: 0 22% 0; }
.clima-barra { width: 100%; border-radius: 999px 999px 0 0; background: var(--c); }
.clima-temp { font-size: 12px; font-weight: 600; margin-bottom: 4px; white-space: nowrap; }
.clima-nome { font-weight: 800; font-size: 14px; }
.clima-rodape { display: flex; align-items: center; gap: 14px; margin-top: 14px; }
.clima-rodape p { margin: 0; font-size: 13px; color: var(--texto-suave); }
.clima-unidade { display: inline-flex; background: #e7e3dc; border-radius: 999px; padding: 3px; }
.clima-unidade button { border: 0; background: none; font: inherit; font-weight: 700; font-size: 13px; padding: 5px 12px; border-radius: 999px; cursor: pointer; color: var(--texto-suave); }
.clima-unidade button[aria-pressed="true"] { background: #fff; color: var(--texto); box-shadow: 0 1px 4px rgba(0,0,0,.08); }
@media (max-width: 700px) {
  .clima { padding: 16px 10px 12px; margin-left: -6px; margin-right: -6px; }
  .clima-legenda { margin-left: 0; width: 100%; }
  .clima-grafico { gap: 3px; }
  .clima-icone { font-size: 14px; }
  .clima-coluna { height: 140px; padding: 0 12%; }
  .clima-temp { font-size: 9px; letter-spacing: -.02em; }
  .clima-nome { font-size: 10px; }
}

/* ============ PÁGINA DE CARREGAMENTO DOS LINKS DE AFILIADOS ============ */
.pagina-obrigado {
  min-height: 100vh; margin: 0; padding: 24px 16px; box-sizing: border-box;
  display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 28px;
  background: linear-gradient(180deg, #f1ebff 0%, #e7dcff 55%, #d9f3f3 100%);
}
.obrigado-caixa {
  background: #fff; border-radius: 18px; padding: 32px 28px; max-width: 440px; width: 100%;
  text-align: center; box-shadow: 0 12px 40px rgba(143, 92, 247, .15); box-sizing: border-box;
}
.obrigado-caixa h1 { font-family: "Fredoka", sans-serif; font-size: 1.9rem; margin: 0 0 12px; }
.obrigado-caixa p { margin: 0 0 22px; line-height: 1.6; }
.obrigado-barra { height: 10px; border: 1px solid #d6c8fb; border-radius: 99px; overflow: hidden; max-width: 260px; margin: 0 auto; }
.obrigado-barra span { display: block; height: 100%; width: 0; background: var(--roxo); border-radius: 99px; animation: obrigado-carregar 2.5s linear forwards; }
@keyframes obrigado-carregar { to { width: 100%; } }
.obrigado-continuar { font-size: .85rem; color: var(--texto); opacity: .7; }
.obrigado-logo { width: 110px; height: auto; margin-top: 24px; opacity: .85; }

/* Título menor do "Quem somos" no Início */
.quem-somos h2.grande { font-size: 20px; }

/* ============ MAPA "ONDE JÁ ESTIVEMOS" ============ */
#mapa-mundi { position: relative; z-index: 0; height: 520px; margin-top: 16px; border-radius: 6px; background: #dff1f2; font: inherit; }
#mapa-mundi .leaflet-popup-content { font-size: 14px; text-align: center; margin: 10px 16px; }
#mapa-mundi .leaflet-popup-content strong { display: block; font-size: 15px; }
.pin-mapa { display: block; position: relative; width: 20px; height: 20px; background: var(--roxo); border: 2px solid #fff; border-radius: 50% 50% 50% 0; transform: rotate(-45deg); box-shadow: 0 1px 3px rgba(0, 0, 0, .35); }
.pin-mapa::after { content: ""; position: absolute; inset: 4px; border-radius: 50%; background: #fff; }
.mapa-dica { margin: 10px 0 0; font-size: 13px; color: var(--texto-suave); }
@media (max-width: 700px) {
  #mapa-mundi { height: 340px; }
}

/* Com 4 números, no celular ficam 2 em cima e 2 embaixo */
@media (max-width: 500px) {
  .numeros-centro > div { flex-basis: 40%; }
}

/* Escolhidos por nós: descrição menor */
.escolhidos .destino p { font-size: 13px; }

/* Quem somos (Início): texto colado no título e justificado */
.quem-somos-inicio h2.grande { margin-bottom: 0; }
.quem-somos-inicio h2.grande + p { margin-top: 2px; }
.quem-somos-inicio > p:not([class]) { text-align: justify; }

/* Ícones acima dos números */
.numeros span.numero-icone { display: block; font-size: 24px; line-height: 1.2; position: relative; top: 6px; margin-bottom: 4px; }
.numero-icone img { display: inline-block; width: 30px; height: 22px; object-fit: cover; border-radius: 2px; margin: 0; vertical-align: middle; }


/* No celular os pins ficam menores para deixar ver as cores dos países */
@media (max-width: 700px) {
  .pin-mapa { transform: rotate(-45deg) scale(.7); }
}

/* Quem somos (Início): textos e números na mesma largura, terminando na mesma reta */
@media (min-width: 701px) {
  .quem-somos-inicio > * { max-width: 520px; }
  .quem-somos-inicio > p:not([class]) { max-width: 520px; }
  .quem-somos-inicio .numeros-centro { justify-content: space-between; gap: 12px; }
  .quem-somos-inicio .numeros-centro > div { flex: 0 1 auto; }
  .quem-somos-inicio .numeros-centro > div:last-child span:last-child { max-width: 96px; }
}

/* Página Destinos: metade do espaço entre os continentes */
.secao.continente { padding-top: 32px; padding-bottom: 32px; }

/* ============ SOBRE NÓS: texto e fotos lado a lado ============ */
.sobre-bloco { display: grid; grid-template-columns: 1fr 1fr; gap: 48px; align-items: center; }
.sobre-bloco.fotos-esquerda .sobre-fotos { order: -1; }
.sobre-texto p { text-align: justify; }
.sobre-texto h1 { margin-top: 0; }
.sobre-texto h2 { margin-top: 0; }
/* Fotos em fileiras de duas, do mesmo tamanho: em pé (3:4) ou deitadas (3:2) */
.sobre-fotos { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
.sobre-fotos img { width: 100%; height: auto; object-fit: cover; border-radius: 6px; }
.sobre-fotos .retrato { aspect-ratio: 3 / 4; }
.sobre-fotos .deitada { aspect-ratio: 3 / 2; }
@media (max-width: 900px) {
  .sobre-bloco { grid-template-columns: 1fr; gap: 24px; }
  .sobre-bloco.fotos-esquerda .sobre-fotos { order: 0; }
}

/* ============ INÍCIO E SOBRE NÓS: ESPAÇO MENOR ENTRE OS TÓPICOS ============ */
.inicio .secao, .sobre-faixa .secao { padding-top: 32px; padding-bottom: 32px; }
.inicio .quem-somos-texto { padding-top: 32px; padding-bottom: 32px; }
.sobre-texto h1 { font-size: 72px; line-height: 1.05; }
@media (max-width: 700px) {
  .inicio .secao, .sobre-faixa .secao, .inicio .quem-somos-texto { padding-top: 24px; padding-bottom: 24px; }
  .sobre-texto h1 { font-size: 48px; }
}

/* ============ EXPEDIÇÕES ============ */
.capa-expedicoes > img { object-position: 50% 74%; }
@media (min-width: 901px) { .capa-guia.capa-pagina.capa-expedicoes { min-height: 760px; } }
.expedicoes-intro p { max-width: 820px; }
.numeros-expedicoes { max-width: 820px; margin: 32px auto 0; }
.numeros-expedicoes .numero-icone img { height: 32px; width: auto; }
.numero-mapa-pin { position: relative; width: 40px; margin: 0 auto; font-size: 30px; }
.numeros span.numero-mapa-pin > span { position: absolute; left: 12px; top: -7px; font-size: 16px; }
.quadro-cenas { columns: 5; column-gap: 6px; margin-top: 24px; }
.quadro-cenas img { width: 100%; height: auto; margin: 0 0 6px; break-inside: avoid; display: block; }
@media (max-width: 900px) { .quadro-cenas { columns: 3; } }
@media (max-width: 600px) { .quadro-cenas { columns: 2; } }
/* Coluna do meio: a foto alta e duas mais baixas, para as colunas terminarem na mesma linha */
@media (min-width: 901px) { .quadro-cenas img:nth-child(8), .quadro-cenas img:nth-child(9) { aspect-ratio: 9 / 10; object-fit: cover; object-position: 50% 100%; } }

/* ============ MENU DO CELULAR: Roteiros sem subitens ============ */
.menu .menu-celular-link { display: block; padding: 14px 0; font-size: 17px; border-bottom: 1px solid #eee; }

/* ============ CONTATO: ícones e roxo ao passar o mouse ============ */
.contato-link h3 { display: flex; align-items: center; gap: 10px; }
.contato-link svg { width: 24px; height: 24px; fill: currentColor; flex-shrink: 0; }
.contato-link h3, .contato-link p { transition: color .15s; }
.contato-link:hover h3, .contato-link:hover p { color: var(--roxo); }

/* ============ BLOG: título sem capa ============ */
.blog-topo { padding-bottom: 0; }
.blog-topo h1 { color: var(--lilas-forte); margin-bottom: 12px; }
.blog-topo p { color: #000; margin: 0; }

/* ============ INÍCIO: celular com o perfil do Instagram ============ */
.chamada-instagram { display: grid; grid-template-columns: 1fr auto; gap: 48px; align-items: center; }
.celular-instagram { display: block; width: 270px; padding: 10px; border-radius: 38px; background: #14141a; text-decoration: none; color: #111; box-shadow: 0 16px 40px rgba(0,0,0,.22); transition: transform .2s ease; }
.celular-instagram:hover { transform: translateY(-4px); }
.celular-tela { display: block; padding: 22px 12px 0; border-radius: 28px; background: #fff; overflow: hidden; font-size: 11px; line-height: 1.35; }
.celular-tela img { display: block; width: 100%; aspect-ratio: 1 / 1; object-fit: cover; }
.ig-usuario { display: block; font-size: 15px; font-weight: 800; margin-bottom: 10px; }
.ig-perfil { display: flex; align-items: center; gap: 12px; margin-bottom: 10px; }
.celular-tela .ig-avatar { width: 60px; height: 60px; flex-shrink: 0; border-radius: 50%; border: 2px solid var(--roxo); padding: 2px; object-position: 50% 20%; }
.ig-numeros { display: flex; flex: 1; justify-content: space-between; text-align: center; color: #333; }
.ig-numeros b { display: block; font-size: 14px; color: #111; }
.ig-bio b { display: block; }
.ig-seguir { display: block; margin: 10px 0; padding: 6px; border-radius: 7px; background: var(--roxo); color: #fff; font-weight: 700; text-align: center; }
.ig-grade { display: grid; grid-template-columns: repeat(3, 1fr); gap: 2px; margin: 0 -12px; }
@media (max-width: 800px) {
  .chamada-instagram { grid-template-columns: 1fr; justify-items: center; gap: 28px; }
}

/* Expedições: título e subtítulo no alto da foto, centralizados, longe dos rostos */
.capa-guia.capa-expedicoes { align-items: flex-start; }
.capa-expedicoes::after { background: linear-gradient(rgba(0,0,0,.5), rgba(0,0,0,.25) 30%, transparent 50%); }
.capa-expedicoes .capa-guia-texto { padding-top: 40px; padding-bottom: 0; text-align: center; }
.capa-expedicoes .capa-guia-sub { margin-left: auto; margin-right: auto; }
@media (max-width: 900px) { .capa-expedicoes .capa-guia-texto { padding-top: 24px; } }

/* ============ ROTEIROS ============ */
.roteiros-destaque { font-family: var(--serifada); font-size: 22px; font-weight: 600; margin-bottom: 8px; }
.roteiros-maps { display: grid; grid-template-columns: repeat(2, minmax(0, 300px)); gap: 20px; margin: 24px 0; }
.roteiros-map { text-decoration: none; }
.roteiros-map img { width: 100%; height: auto; }
.roteiros-map strong { display: block; margin-top: 10px; font-family: var(--serifada); font-size: 20px; }
.grade-capas { display: grid; grid-template-columns: repeat(5, 1fr); gap: 16px; margin-top: 24px; align-items: start; }
.grade-capas > img, .cartao-roteiro img { width: 100%; height: auto; border-radius: 6px; margin: 0; }
.roteiro-dias { display: flex; gap: 16px; margin: 10px 0 4px; font-size: 15px; }
.cartao-roteiro strong { display: block; font-size: 15px; line-height: 1.3; }

/* ============ PÁGINA DE MAPAS ============ */
.mapas-titulo { font-size: 44px; margin: 0 0 24px; }
.mapas-filtros { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: center; gap: 16px; margin-bottom: 24px; }
.mapas-botoes { display: flex; flex-wrap: wrap; gap: 8px; }
.mapas-botoes button { padding: 10px 18px; border: 0; border-radius: 999px; background: #eeecf5; color: var(--texto); font: 600 15px var(--sans); cursor: pointer; }
.mapas-botoes button.ativo { background: var(--lilas-forte); color: #fff; }
.mapas-busca { display: flex; align-items: center; gap: 10px; flex: 0 1 320px; padding: 11px 18px; background: #fff; border: 1px solid #e4e1ee; border-radius: 999px; }
.mapas-busca svg { width: 18px; height: 18px; flex: none; fill: none; stroke: currentColor; stroke-width: 2; }
.mapas-busca input { width: 100%; border: 0; outline: 0; background: transparent; font: 15px var(--sans); }
.mapas-grupo { margin-bottom: 32px; }
.mapas-grupo h2 { font-size: 26px; margin: 0 0 16px; }
.mapas-grupo h2 small { margin-left: 8px; font: 400 14px var(--sans); color: var(--texto-suave); }
.mapas-mais-vendidos { padding: 20px; background: var(--lilas); border-radius: 12px; }
.mapas-mais-vendidos h2 small { color: var(--texto); }
.grade-mapas { display: grid; grid-template-columns: repeat(5, 1fr); gap: 16px; }
.cartao-mapa { display: block; background: #fff; border: 1px solid #e4e1ee; border-radius: 10px; overflow: hidden; text-decoration: none; color: inherit; }
.cartao-mapa[hidden] { display: none; }
.cartao-mapa .foto-zoom { border-radius: 0; }
.cartao-mapa img { width: 100%; height: auto; }
.cartao-mapa-texto { display: block; padding: 12px; }
.cartao-mapa strong { display: block; margin-bottom: 8px; font-size: 16px; }
.cartao-mapa-pe { display: flex; justify-content: space-between; align-items: center; gap: 8px; font-size: 14px; }
.cartao-mapa-ver { color: var(--texto-suave); font-weight: 600; }
@media (max-width: 1024px) {
  .grade-mapas, .grade-capas { grid-template-columns: repeat(3, 1fr); }
}
@media (max-width: 600px) {
  .grade-mapas, .grade-capas { grid-template-columns: repeat(2, 1fr); }
  .mapas-titulo { font-size: 34px; }
  .mapas-busca { flex: 1 1 100%; }
  .mapas-mais-vendidos { padding: 14px; }
}

/* Sobre nós: foto deitada que sobra sozinha na fileira ocupa a largura toda */
.sobre-fotos .deitada:last-child:nth-child(odd) { grid-column: 1 / -1; }

/* Início: Blog em lilás e menos espaço entre o Instagram e as Avaliações */
.inicio .chamada-instagram { padding-bottom: 16px; }
.inicio .chamada-instagram + .faixa-lilas .secao { padding-top: 16px; }

/* Expedições: títulos centralizados e mais perto do texto */
.expedicoes-centro { text-align: center; }
.expedicoes-centro h2 { font-size: 30px; margin-bottom: 14px; }
.expedicoes-centro p { margin-left: auto; margin-right: auto; }
.expedicoes-centro .numeros-expedicoes { margin-top: 16px; }
.titulo-perto { margin-bottom: 14px; }
.fotos-pequenas { display: flex; flex-wrap: wrap; justify-content: center; gap: 10px; margin-top: 20px; }
.fotos-pequenas img { width: 120px; height: 120px; object-fit: cover; border-radius: 8px; }
.capa-guia-sub .bandeira-texto { display: inline-block; height: .8em; width: auto; vertical-align: baseline; margin: 0 2px; border-radius: 2px; }
.saidas { grid-template-columns: repeat(3, 1fr); }
.saida { padding: 0; overflow: hidden; }
.saida img { width: 100%; aspect-ratio: 4 / 3; object-fit: cover; display: block; }
.saida h3, .saida p { padding: 0 18px; }
.saida h3 { margin-top: 14px; }
.saida p { padding-bottom: 18px; }
@media (max-width: 900px) { .saidas { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 600px) {
  .saidas { grid-template-columns: 1fr; }
  .fotos-pequenas img { width: 90px; height: 90px; }
  .expedicoes-centro h2 { font-size: 26px; }
}

/* Roteiros: capas dos guias todas do mesmo tamanho */
.capas-guias > img { aspect-ratio: 1414 / 2000; object-fit: cover; object-position: 50% 0; }