/* ============================================================
   We Love Chile · peças novas da home (2026-09-28)
   v2 em 2026-09-29: os 13 ajustes do vídeo de revisão da Laise.
   Cabeçalho e aviso iguais aos da página do Valle Nevado, nuvens
   de verdade, países em vídeo, faixa amarela de confiança, catálogo
   em polaroides, estrada horizontal, figurinhas e van no "Como
   funciona", depoimentos em polaroide e ticket, FAQ em chat, CTA em
   cartão de scrapbook e rodapé amarelo.
   Carregar depois de wlc-scrapbook.css. A home usa variáveis
   --wlc-*, então as do scrapbook são declaradas aqui de novo.
   Regras fixas: nada na diagonal; acento nunca em Chalkiez;
   número sempre em Lufga. Preço nunca anima (pedido de 09/10).
   v3 em 2026-10-09 (revisão em vídeo): esta folha agora é da página
   do Chile (/chile/). As nuvens e os países foram para a home da
   We Love Company (/index.html, estilos dentro dela).
   ============================================================ */
:root {
  --cream: #F3E8D5; --cream-soft: #FAF3E6; --red: #DB3A3D; --red-deep: #B02026; --red-label: #C93033;
  --yellow: #F5B71C; --yellow-deep: #D99512; --on-yellow: #5C3D06; --blue: #1E55B5; --navy: #1B2A5E;
  --teal: #0E6A6C; --purple: #5A2246; --ink: #1B2A5E; --muted: #4A5D8A; --muted-dark: #D9E1F5;
  --eyebrow: #B02E2F; --line: rgba(27,42,94,.14); --font-sans-fb: ui-sans-serif, system-ui, sans-serif;
}
.btn { display: inline-flex; align-items: center; justify-content: center; gap: 8px; min-height: 48px; padding: 14px 26px; border-radius: 999px; font-size: 15px; font-weight: 700; text-align: center; transition: transform .15s, background .2s; font-family: 'Lufga', var(--font-sans-fb); }
.btn:hover { transform: translateY(-2px); }
.btn--principal { background: var(--yellow); color: var(--navy); box-shadow: 0 4px 0 var(--yellow-deep); }
.btn--contorno { color: var(--cream); box-shadow: inset 0 0 0 2px var(--cream); }
.btn--navy { background: var(--navy); color: var(--cream); box-shadow: 0 4px 0 #10173A; }
.btn--navy:hover { background: var(--blue); color: var(--cream); }
.btn--bloco { width: 100%; }

/* ---------- cabeçalho: o mesmo da página do Valle Nevado. A base do .topo vinha do
   wlc-paginas.css, que a home não carrega, então ela é declarada aqui. Na home ele
   fica fixo no topo, como o antigo. ---------- */
.topo { background: var(--cream); border-bottom: 1px solid var(--line); z-index: 80; }
.topo--home { position: fixed; top: 0; left: 0; right: 0; transition: top .35s ease, transform .35s ease; }
/* durante o cinema da van o cabeçalho fica fora da tela (pedido B2); quem navega pelo teclado e cai
   nele ainda o vê descer, porque ele só sai do lugar, não fica invisível */
body:not(.passou-cinema) .topo--home:not(:focus-within) { transform: translateY(-110%); }
.topo__inner { display: flex; align-items: center; justify-content: space-between; gap: 16px; min-height: 74px; }
.topo__marca { display: inline-flex; line-height: 1; padding: 10px 0; }
.topo__marca img { height: 40px; width: auto; display: block; }
body > [id] { scroll-margin-top: 92px; }
/* no menu aberto do celular o template pinta todos os links de papel; o Reservar continua vermelho */
.topo.menu-aberto .menu > a.topo__cta { background: var(--red-label); color: #fff; }

/* ---------- faixa de aviso: fixa, aparece depois do vídeo da van e empurra o cabeçalho ---------- */
/* escondido de verdade enquanto não aparece (visibility), senão o Tab caía em links invisíveis */
.aviso--home { position: fixed; top: 0; left: 0; right: 0; z-index: 101; transform: translateY(-110%); visibility: hidden; transition: transform .35s ease, visibility .35s; }
.aviso--home.mostra { transform: none; visibility: visible; }
body.com-aviso .topo--home { top: var(--aviso-h, 45px); }

/* ---------- faixa amarela de confiança, logo depois do cinema ---------- */
.faixa--confianca { z-index: 2; }
.faixa--confianca b { font-weight: 900; }

/* ---------- rolo de filme com os destinos (agora logo antes do FAQ) ---------- */
.rolo { background: var(--yellow); color: var(--navy); padding: 72px 0 64px; overflow: hidden; }
.rolo__cab { text-align: center; }
.rolo .section-title { color: var(--navy); }
.rolo .section-eyebrow { color: var(--on-yellow); }
.rolo .section-subtitle { color: var(--on-yellow); }
.rolo__abas { display: flex; gap: 8px; justify-content: center; margin-top: 18px; flex-wrap: wrap; }
.rolo__aba { border: 2px solid var(--navy); color: var(--navy); border-radius: 999px; padding: 8px 16px; font-family: 'Lufga', var(--font-sans-fb); font-size: 13px; font-weight: 800; background: none; }
.rolo__aba[aria-pressed="true"] { background: var(--navy); color: var(--cream); border-color: var(--navy); }
.rolo__fita { position: relative; margin-top: 34px; background: #0d1330; padding: 16px 0; }
.rolo__furos { height: 16px; margin: 0 20px; background: repeating-linear-gradient(90deg, transparent 0 12px, #F3E8D5 12px 26px, transparent 26px 38px); border-radius: 2px; opacity: .9; }
.rolo__quadros { display: flex; gap: 16px; overflow-x: auto; scroll-snap-type: x mandatory; padding: 16px 40px; scrollbar-width: none; }
.rolo__quadros::-webkit-scrollbar { display: none; }
.quadro { flex: none; width: min(440px, 78vw); aspect-ratio: 16 / 10; border-radius: 10px; overflow: hidden; position: relative; scroll-snap-align: center; background: #222; border: 4px solid #F3E8D5; display: block; color: inherit; }
.quadro img, .quadro video { width: 100%; height: 100%; object-fit: cover; display: block; background: #0d1330; }
.quadro__legenda { position: absolute; left: 12px; bottom: 12px; background: rgba(27,42,94,.86); color: var(--cream); font-family: 'Lufga', var(--font-sans-fb); font-size: 12px; font-weight: 800; letter-spacing: .1em; text-transform: uppercase; padding: 6px 10px; border-radius: 999px; }
.quadro__tag { position: absolute; right: 12px; top: 12px; background: var(--yellow); color: var(--navy); font-family: 'Lufga', var(--font-sans-fb); font-size: 11px; font-weight: 800; padding: 4px 10px; border-radius: 999px; }
.quadro[hidden] { display: none; }
.rolo__setas { display: flex; gap: 14px; justify-content: center; margin-top: 18px; }
.rolo__seta { background: none; width: 64px; height: 44px; }
.rolo__seta img { width: 100%; height: 100%; object-fit: contain; }
.rolo__seta--esq img { transform: scaleX(-1); }

/* ---------- divisor em silhueta de cordilheira ---------- */
.divisor-cordilheira { display: block; width: 100%; height: 90px; margin-top: -1px; }

/* ---------- corrente de destinos, com respiro antes e depois ---------- */
.corrente { background: var(--cream); margin: 56px 0 48px; padding: 0; overflow: hidden; }
.passeios { padding-top: 48px; }
.corrente__linha { overflow: hidden; border-top: 3px solid var(--navy); border-bottom: 3px solid var(--navy); }
.corrente__linha--1 { background: var(--red-deep); color: #fff; }
.corrente__linha--2 { background: var(--yellow); color: var(--navy); margin-top: 8px; }
.corrente__fita { display: flex; width: max-content; animation: corre 42s linear infinite; }
.corrente__linha--2 .corrente__fita { animation-direction: reverse; animation-duration: 50s; }
.corrente ul { display: flex; align-items: center; gap: 28px; list-style: none; margin: 0; padding: 12px 28px 12px 0; flex: none; }
.corrente li { display: flex; align-items: center; gap: 24px; font: 900 clamp(24px, 3.2vw, 40px)/1 'Lufga', var(--font-sans-fb); white-space: nowrap; letter-spacing: -.01em; }
.corrente li img { width: 40px; height: 40px; }
.corrente:hover .corrente__fita { animation-play-state: paused; }

/* ---------- catálogo: abas e filtros em pílulas coloridas, cada passeio numa polaroide ---------- */
.passeios__tabs .passeios__tab, .passeios__subtabs .passeios__subtab { --cor: var(--navy); background: #FFFDF8; border: 2px solid var(--cor); color: var(--cor); font-family: 'Lufga', var(--font-sans-fb); font-weight: 800; box-shadow: 3px 3px 0 var(--cor); transition: transform .16s ease, background .16s ease, color .16s ease; }
.passeios__tabs .passeios__tab:hover, .passeios__subtabs .passeios__subtab:hover { transform: translateY(-2px); color: var(--cor); border-color: var(--cor); }
.passeios__tabs .passeios__tab:nth-child(1) { --cor: var(--red); }
.passeios__tabs .passeios__tab:nth-child(2) { --cor: #E67A1C; }
.passeios__tabs .passeios__tab .passeios__tab-icon, .passeios__tabs .passeios__tab.active .passeios__tab-icon { filter: drop-shadow(0 2px 2px rgba(27,42,94,.25)); width: 40px; height: 34px; object-fit: contain; vertical-align: middle; margin: -6px 6px -6px -6px; }
/* cores das categorias com contraste AA no papel e no branco do rótulo ativo (o amarelo e o laranja saíram) */
.passeios__subtabs .passeios__subtab:nth-child(2) { --cor: var(--red-label); }
.passeios__subtabs .passeios__subtab:nth-child(3) { --cor: var(--teal); }
.passeios__subtabs .passeios__subtab:nth-child(4) { --cor: var(--blue); }
.passeios__subtabs .passeios__subtab:nth-child(5) { --cor: #2F7D4F; }
.passeios__subtabs .passeios__subtab:nth-child(6) { --cor: var(--purple); }
.passeios__subtabs .passeios__subtab:nth-child(7) { --cor: var(--red-deep); }
/* nas abas de região o texto fica navy (o vermelho e o laranja puros não passam AA em 14 px); a cor fica na borda */
.passeios__tabs .passeios__tab:not(.active) { color: var(--navy); }
.passeios__tabs .passeios__tab.active, .passeios__subtabs .passeios__subtab.active { background: var(--cor); color: #fff; border-color: var(--cor); box-shadow: 3px 3px 0 var(--navy); }
.passeios__subtabs { justify-content: center; margin-bottom: 40px; }
.passeios__grid { gap: 34px 26px; align-items: stretch; }
.tour-card.polaroid { display: flex; flex-direction: column; overflow: visible; border-radius: 4px; background: #FFFDF8; padding: 10px 10px 16px; box-shadow: 0 2px 3px rgba(60,40,20,.18), 0 10px 22px rgba(60,40,20,.20); transition: transform .25s ease, box-shadow .25s ease; }
.tour-card.polaroid:hover { transform: translateY(-8px); box-shadow: 0 4px 6px rgba(60,40,20,.18), 0 24px 44px rgba(60,40,20,.24); }
.tour-card.polaroid .tour-card__img { aspect-ratio: 4 / 3; border-radius: 2px; background: #cfd8e6; }
.tour-card.polaroid .tour-card__img--sem-foto { background: #A5D6D1; }
.tour-card.polaroid .tour-card__badge { top: 10px; left: 10px; background: var(--red); color: #fff; border: 2px solid #FFFDF8; box-shadow: 0 3px 8px rgba(0,0,0,.25); font-size: 10px; letter-spacing: .12em; padding: 6px 12px; }
.tour-card.polaroid .tour-card__body { padding: 12px 4px 0; display: flex; flex-direction: column; flex: 1; }
.tour-card.polaroid .tour-card__meta { gap: 4px 12px; margin-bottom: 8px; }
.tour-card.polaroid .tour-card__meta span { font-size: 11.5px; }
.tour-card.polaroid .tour-card__title { font-family: 'Lufga', var(--font-sans-fb); font-weight: 800; font-size: 19px; line-height: 1.15; color: var(--purple); margin-bottom: 6px; }
.tour-card.polaroid .tour-card__desc { font-size: 13.5px; color: #4A4357; margin-bottom: 14px; }
.tour-card.polaroid .tour-card__footer { border-top: 1px dashed var(--line); padding-top: 12px; flex-wrap: wrap; gap: 10px; margin-top: auto; }
.tour-card.polaroid .polaroid__preco { margin-top: 0; }
.tour-card.polaroid .polaroid__preco b { font-weight: 900; }
.tour-card.polaroid .tour-card__btn { background: var(--navy); color: var(--cream); }
.tour-card.polaroid .tour-card__btn:hover { background: var(--blue); }

/* ---------- modalidades: cards coloridos e a van andando na estrada da base ---------- */
.modalidades { position: relative; overflow: hidden; padding-bottom: 110px; }
.modalidades__grid { max-width: 900px; }
.modalidade-card { animation: none; border-radius: 26px; border: 3px solid var(--navy); box-shadow: 10px 10px 0 var(--navy); background: #CFE3F2; position: relative; overflow: visible; }
.modalidade-card--destaque { background: var(--red); color: #fff; border-top: 3px solid var(--navy); box-shadow: 10px 10px 0 var(--yellow), 10px 10px 0 3px var(--navy); }
.modalidade-card:hover, .modalidade-card--destaque:hover { animation: none; transform: translateY(-8px); box-shadow: 14px 14px 0 var(--navy); }
.modalidade-card--destaque:hover { box-shadow: 14px 14px 0 var(--yellow), 14px 14px 0 3px var(--navy); }
.modalidade-card__top { display: none; }
.modalidade-card .mod-pill { border: 2px solid var(--navy); background: transparent; color: var(--navy); }
.modalidade-card--destaque .mod-pill { border-color: #fff; color: #fff; background: transparent; }
.modalidade-card .mod-title { font-family: 'Chalkiez', 'Lufga', var(--font-sans-fb); font-weight: 400; font-size: 46px; line-height: 1; }
.modalidade-card--destaque .mod-title { color: #fff; }
.modalidade-card .feat-icon { width: 26px; height: 26px; border-radius: 50%; display: grid; place-items: center; font-size: 13px; color: #fff; margin-top: 0; }
.modalidade-card .feat-ok { background: var(--teal); }
.modalidade-card .feat-no { background: var(--red-deep); }
.modalidade-card--destaque .feat-ok { background: var(--yellow); color: var(--navy); }
.modalidade-card--destaque .feat-item, .modalidade-card--destaque p { color: #fff !important; }
.mod-upgrade { position: absolute; top: -18px; right: 16px; background: var(--yellow); color: var(--navy); border: 3px solid var(--navy); border-radius: 999px; padding: 6px 14px; font-family: 'Lufga', var(--font-sans-fb); font-size: 12px; font-weight: 800; z-index: 3; }
.modalidades__cards { position: relative; padding-top: 70px; }
.mod-van { position: absolute; left: 50%; width: 100vw; transform: translateX(-50%); top: -42px; height: 150px; pointer-events: none; z-index: 5; }
.mod-van svg { display: block; width: 100%; height: 100%; overflow: visible; }
#mod-caminho { fill: none; stroke: var(--navy); stroke-opacity: .35; stroke-width: 3; stroke-dasharray: 14 12; stroke-linecap: round; }
#mod-van { filter: drop-shadow(0 6px 6px rgba(27,42,94,.35)); }
.section-eyebrow--pilula { background: var(--yellow); color: var(--on-yellow) !important; border: 2px solid var(--navy); border-radius: 999px; padding: 8px 18px; box-shadow: 3px 3px 0 var(--navy); letter-spacing: .2em; }

/* ---------- como funciona: uma figurinha por passo e a van indo do 1 ao 3 ---------- */
.como__step { position: relative; z-index: 2; }
.como__estrada { position: absolute; inset: 0; width: 100%; height: 100%; overflow: visible; pointer-events: none; z-index: 1; }
.como__asfalto { fill: none; stroke: rgba(243,232,213,.14); stroke-width: 26; stroke-linecap: round; }
.como__faixa { fill: none; stroke: var(--yellow); stroke-width: 3; stroke-dasharray: 14 12; stroke-linecap: round; }
.como__figurinha { width: 150px; height: 150px; margin: 0 auto 18px; display: grid; place-items: center; position: relative; z-index: 3; transition: transform .35s ease; }
.como__figurinha img { width: 100%; height: 100%; object-fit: contain; display: block; filter: drop-shadow(0 12px 16px rgba(0,0,0,.35)); }
.como__step:hover .como__figurinha { transform: scale(1.08); }

/* ---------- depoimentos e FAQ: componentes do template, sem a onda de topo (na home a seção de cima é creme) ---------- */
.avaliacoes-scrap::before, .faq-chat::before { content: none; }
.avaliacoes-scrap { background: var(--cream); }
.avaliacoes-scrap__cab { max-width: 920px; }
.avaliacoes-scrap__cab .h-chalk { font-size: clamp(36px, 4.4vw, 58px); }
.faq-chat__cab { margin: 0 auto; text-align: center; }
.faq-chat__cab .paragrafo { margin-left: auto; margin-right: auto; }

/* ---------- guias em cartões por pessoa ---------- */
.guias { list-style: none; display: grid; grid-template-columns: repeat(4, 1fr); gap: 18px; margin: 44px 0 0; padding: 0; }
.guia { background: var(--cor); color: var(--navy); border-radius: 22px; padding: 18px 18px 20px; border: 3px solid var(--navy); transition: transform .2s; }
.guia:hover { transform: translateY(-6px); }
.guia:nth-child(1) { --cor: #F6D5C9; } .guia:nth-child(2) { --cor: #FFE9A8; } .guia:nth-child(3) { --cor: #CFEAE6; } .guia:nth-child(4) { --cor: #DCE4F7; }
.guia__foto { aspect-ratio: 4 / 5; border-radius: 999px 999px 18px 18px; background: #FFFDF8; border: 3px solid var(--navy); overflow: hidden; margin-bottom: 14px; }
.guia__foto img { width: 100%; height: 100%; object-fit: cover; display: block; }
.guia h3 { font: 900 22px/1.1 'Lufga', var(--font-sans-fb); margin: 0 0 4px; color: var(--navy); }
.guia__funcao { font-family: 'Lufga', var(--font-sans-fb); font-size: 11px; font-weight: 800; letter-spacing: .14em; text-transform: uppercase; opacity: .75; }
.guia blockquote { margin: 12px 0 0; font-family: 'Lufga', var(--font-sans-fb); font-size: 14px; line-height: 1.5; }
.guia cite { display: block; margin-top: 8px; font-size: 12px; font-style: normal; font-weight: 700; opacity: .8; }
.sobre__titulo-guias { font-family: 'Lufga', var(--font-sans-fb); font-weight: 900; font-size: 22px; color: var(--cream); margin-top: 48px; }
.sobre__nota-guias { font-family: 'Lufga', var(--font-sans-fb); font-size: 13px; color: var(--muted-dark); margin-top: 6px; }

/* ---------- CTA final: um cartão de scrapbook sobre o vermelho ---------- */
.cta-scrap { position: relative; background: var(--red); padding: clamp(72px, 9vw, 120px) 0; overflow: hidden; }
.cta-scrap__padrao { position: absolute; inset: 0; background: url(../assets/scrapbook/main-pattern.webp) center / 900px repeat; opacity: .06; pointer-events: none; }
.cta-cartao { position: relative; max-width: 960px; margin: 0 auto; background: #FFFDF8; border-radius: 26px; box-shadow: 0 24px 60px rgba(0,0,0,.28); padding: clamp(28px, 4vw, 48px); display: grid; grid-template-columns: 1.15fr .85fr; gap: 28px; align-items: center; }
.cta-cartao .washi { position: absolute; left: 50%; top: -18px; width: 190px; transform: translateX(-50%); filter: drop-shadow(0 2px 3px rgba(60,40,20,.25)); z-index: 2; }
.cta-cartao .paragrafo { margin-top: 12px; }
.cta-cartao__acoes { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 24px; }
.cta-cartao__van { width: 100%; max-width: 380px; height: auto; margin: 0 auto; filter: drop-shadow(0 16px 24px rgba(27,42,94,.3)); animation: flutua 6s ease-in-out infinite; }
.cta-cartao .lacre { right: -18px; bottom: -30px; }

/* ---------- rodapé: desde 2026-10-09 mora em paginas/wlc-site.css, igual em todas as páginas ---------- */

/* ---------- botão da mala nos cards do catálogo ---------- */
.tour-card .btn--mala { margin-top: 12px; min-height: 40px; padding: 8px 14px; font-size: 13px; width: 100%; }

@media (max-width: 900px) {
  .guias { grid-template-columns: repeat(2, 1fr); }
  .nuvens__sol { width: 90px; height: 90px; }
  .mod-van { height: 110px; top: -6px; }
  .cta-cartao { grid-template-columns: 1fr; }
  .cta-cartao__van { max-width: 260px; }
}
@media (max-width: 768px) {
  .como__figurinha { width: 120px; height: 120px; }
}
@media (max-width: 600px) {
  .guias { grid-template-columns: 1fr; }
  .modalidade-card .mod-title { font-size: 38px; }
}

/* ---------- mapa ilustrado do Chile (v2 do mapa, 2026-09-29): a referência é o mapa de Laos do awwwards ---------- */
.mapa-vivo { margin: 56px auto 0; max-width: 1100px; }
.mapa-vivo__cabeca { text-align: center; margin-bottom: 26px; }
.mapa-vivo__cabeca .section-title { font-size: clamp(36px, 4.4vw, 56px); }
.mapa-vivo__cabeca .section-subtitle { max-width: 640px; margin: 0 auto; }
.mapa-vivo__moldura { position: relative; }
.mapa-vivo__washi { position: absolute; left: 50%; top: -16px; width: 190px; transform: translateX(-50%); filter: drop-shadow(0 2px 3px rgba(27,42,94,.28)); z-index: 5; pointer-events: none; }
.mapa-vivo__quadro { position: relative; aspect-ratio: 1000 / 840; border-radius: 26px; overflow: hidden; background: #79C3E6; box-shadow: 0 0 0 7px #FFFDF8, 0 0 0 8px rgba(27,42,94,.25), 0 30px 60px rgba(27,42,94,.28); }
.mapa-vivo__svg { position: absolute; inset: 0; width: 100%; height: 100%; display: block; }
.mapa-vivo__ondas { animation: mv-ondas 7s linear infinite; }
@keyframes mv-ondas { to { transform: translateX(60px); } }
.mapa-vivo__baleia { transform-box: fill-box; transform-origin: center; animation: mv-boia 4.5s ease-in-out infinite; }
.mapa-vivo__barco { transform-box: fill-box; transform-origin: center; animation: mv-boia 3.6s ease-in-out infinite reverse; }
@keyframes mv-boia { 0%, 100% { transform: translateY(0); } 50% { transform: translateY(-7px); } }
.mapa-vivo__rotulos text { font-family: 'Lufga', var(--font-sans-fb); font-weight: 800; text-anchor: middle; }
.mapa-vivo__rotulos .mv-pais { font-size: 13px; letter-spacing: .32em; fill: #9C8256; }
.mapa-vivo__rotulos .mv-mar { font-size: 14px; letter-spacing: .34em; fill: #FFFDF8; opacity: .9; }
.mapa-vivo__rotulos .mv-chile-nome { font-family: 'Chalkiez', 'Lufga', var(--font-sans-fb); font-weight: 400; font-size: 104px; fill: #FFFDF8; stroke: #1B2A5E; stroke-width: 2; paint-order: stroke fill; letter-spacing: .02em; }
.mv-rapa { font: 800 13px 'Lufga', var(--font-sans-fb); fill: #FFFDF8; }
.mv-rosa { font: 800 14px 'Lufga', var(--font-sans-fb); fill: #1B2A5E; }
.mapa-vivo__inset-nome { font-family: 'Chalkiez', 'Lufga', var(--font-sans-fb); font-size: 22px; fill: #1B2A5E; }
.mapa-vivo__andes { opacity: .95; }
.mapa-vivo__matinho image { filter: hue-rotate(125deg) saturate(.75) brightness(.85); }
.mapa-vivo__van { filter: drop-shadow(0 2px 2px rgba(27,42,94,.35)); }
/* marcos: cada passeio é um adesivo clicável em cima do lugar dele */
.marco { cursor: pointer; outline: none; }
.marco__entra { transform-box: fill-box; transform-origin: 50% 90%; }
.mapa-vivo--espera .marco__entra { transform: scale(0); }
.mapa-vivo--vivo .marco__entra { animation: mv-entra .75s cubic-bezier(.2, 1.5, .4, 1) both; animation-delay: calc(var(--i, 0) * 110ms + 120ms); }
@keyframes mv-entra { from { transform: scale(0); } to { transform: scale(1); } }
.marco__corpo { transform-box: fill-box; transform-origin: 50% 85%; transition: transform .35s cubic-bezier(.2, 1.4, .4, 1); }
.marco:hover .marco__corpo, .marco:focus-visible .marco__corpo, .marco.marco--acesa .marco__corpo { transform: scale(1.12); }
.marco__sombra { fill: #1B2A5E; opacity: .16; }
.marco__halo { fill: #F5B71C; opacity: 0; transform-box: fill-box; transform-origin: center; }
.marco:hover .marco__halo, .marco:focus-visible .marco__halo, .marco.marco--acesa .marco__halo { animation: mv-halo 1.6s ease-out infinite; }
@keyframes mv-halo { 0% { transform: scale(.6); opacity: .75; } 100% { transform: scale(1.8); opacity: 0; } }
.marco__fig { filter: drop-shadow(0 5px 4px rgba(27,42,94,.28)); }
.marco__rotulo rect { fill: #1B2A5E; transition: fill .2s; }
.marco__rotulo text { font: 800 12px 'Lufga', var(--font-sans-fb); fill: #F3E8D5; text-anchor: middle; transition: fill .2s; }
.marco:hover .marco__rotulo rect, .marco:focus-visible .marco__rotulo rect, .marco.marco--acesa .marco__rotulo rect { fill: #F5B71C; }
.marco:hover .marco__rotulo text, .marco:focus-visible .marco__rotulo text, .marco.marco--acesa .marco__rotulo text { fill: #1B2A5E; }
.marco__breve rect { fill: #F5B71C; stroke: #1B2A5E; stroke-width: 1.5; }
.marco__breve text { font: 800 10px 'Lufga', var(--font-sans-fb); fill: #1B2A5E; text-anchor: middle; }
[data-destino="patagonia"] .marco__fig { filter: drop-shadow(0 5px 4px rgba(27,42,94,.28)) saturate(.7); }
/* Lucillama mostrando o mapa, no canto do quadro */
.mapa-vivo__lucillama { position: absolute; right: 2.4%; bottom: -2%; width: 15%; margin: 0; z-index: 3; pointer-events: none; }
.mapa-vivo__lucillama img { display: block; width: 100%; height: auto; filter: drop-shadow(0 8px 8px rgba(27,42,94,.3)); }
.mapa-vivo__lucillama figcaption { position: absolute; right: 82%; top: 14%; width: 150px; background: #FFFDF8; color: #1B2A5E; border: 2px solid #1B2A5E; border-radius: 16px 16px 4px 16px; padding: 9px 12px; font: 700 13px/1.3 'Lufga', var(--font-sans-fb); box-shadow: 4px 4px 0 #1B2A5E; }
/* legenda: um papel colado por cima da Argentina, onde o mapa está vazio */
.mapa-vivo__legenda { position: absolute; right: 2.2%; top: 33%; width: 27%; background: #FFFDF8; border-radius: 16px; padding: 22px 18px 16px; box-shadow: 0 12px 28px rgba(27,42,94,.28); z-index: 4; }
.mapa-vivo__washi--legenda { width: 130px; top: -13px; }
.mapa-vivo__legenda h4 { font: 900 17px 'Lufga', var(--font-sans-fb); color: #1B2A5E; margin: 0 0 10px; }
.mapa-vivo__legenda ul { list-style: none; margin: 0; padding: 0; display: grid; gap: 4px; }
.mapa-vivo__legenda a { display: grid; grid-template-columns: 14px 1fr auto; align-items: center; gap: 10px; padding: 7px 8px; border-radius: 10px; color: #1B2A5E; font: 700 14px 'Lufga', var(--font-sans-fb); text-decoration: none; transition: background .2s; }
.mapa-vivo__legenda a i { width: 14px; height: 14px; border-radius: 50%; background: var(--c, #F5B71C); border: 2px solid #1B2A5E; }
.mapa-vivo__legenda a small { font-size: 12px; font-weight: 600; opacity: .7; white-space: nowrap; }
.mapa-vivo__legenda a small b { font-weight: 800; }
.mapa-vivo__legenda a:hover, .mapa-vivo__legenda a.acesa, .mapa-vivo__legenda a:focus-visible { background: #F5B71C; }
@media (max-width: 1100px) {
  .mapa-vivo__legenda { width: 30%; padding: 18px 12px 12px; }
  .mapa-vivo__legenda a { font-size: 13px; gap: 8px; padding: 6px; }
  .mapa-vivo__lucillama figcaption { font-size: 12px; width: 130px; }
}
@media (max-width: 760px) {
  .mapa-vivo { margin-top: 40px; }
  .mapa-vivo__quadro { aspect-ratio: 10 / 17; border-radius: 20px; box-shadow: 0 0 0 5px #FFFDF8, 0 0 0 6px rgba(27,42,94,.25), 0 20px 40px rgba(27,42,94,.28); }
  .mapa-vivo__so-largo, .mapa-vivo__lucillama { display: none; }
  .mapa-vivo__legenda { position: static; width: auto; margin-top: 26px; box-shadow: 0 10px 24px rgba(27,42,94,.16); }
  .mapa-vivo__legenda ul { grid-template-columns: 1fr 1fr; }
  .mapa-vivo__legenda a { grid-template-columns: 12px 1fr; gap: 8px; }
  .mapa-vivo__legenda a small { grid-column: 2; }
  .mapa-vivo__washi { width: 140px; top: -12px; }
}
@media (prefers-reduced-motion: reduce) {
  .mapa-vivo__ondas, .mapa-vivo__baleia, .mapa-vivo__barco, .marco__halo, .cta-cartao__van { animation: none !important; }
  .mapa-vivo--vivo .marco__entra { animation: none; transform: none; }
}

/* ============================================================
   v3, revisão em vídeo de 09/10/2026
   ============================================================ */

/* ---------- B4: Patagônia com foto real atrás do arco, e o crédito que a licença exige ---------- */
.destino-card-3d--patagonia .destino-card__veu { position: absolute; inset: 0; background: linear-gradient(180deg, rgba(27,42,94,0) 28%, rgba(27,42,94,.9) 76%); pointer-events: none; }
.destino-card-3d--patagonia .destino-card__content { position: relative; z-index: 2; }
.destino-card__credito { position: absolute; z-index: 3; left: 50%; bottom: 10px; transform: translateX(-50%); font-size: 10px; font-weight: 500; color: var(--muted-dark); white-space: nowrap; text-decoration: underline; text-underline-offset: 2px; }

/* ---------- B12: filtro por estação, acima das categorias ---------- */
.passeios__estacoes { display: flex; flex-wrap: wrap; align-items: center; justify-content: center; gap: 8px; margin: -28px auto 22px; }
.passeios__estacoes-rotulo { font-family: 'Lufga', var(--font-sans-fb); font-size: 13px; font-weight: 800; color: var(--navy); margin-right: 4px; }
.passeios__estacao { font-family: 'Lufga', var(--font-sans-fb); font-size: 13px; font-weight: 800; color: var(--navy); background: var(--yellow); border: 2px solid var(--navy); border-radius: 999px; padding: 8px 14px; min-height: 40px; display: inline-flex; align-items: baseline; gap: 6px; transition: transform .16s ease, background .16s ease, color .16s ease; }
.passeios__estacao small { font-size: 11px; font-weight: 600; color: var(--on-yellow); }
.passeios__estacao:hover { transform: translateY(-2px); }
.passeios__estacao[aria-pressed="true"] { background: var(--navy); color: var(--cream); box-shadow: 3px 3px 0 var(--yellow-deep); }
.passeios__estacao[aria-pressed="true"] small { color: var(--muted-dark); }
.passeios__vazio { text-align: center; font-family: 'Lufga', var(--font-sans-fb); font-size: 15px; font-weight: 700; color: var(--navy); background: #FFFDF8; border: 2px dashed var(--navy); border-radius: 20px; padding: 22px; max-width: 560px; margin: 8px auto 0; }

/* ---------- B20: as figurinhas 3D de pagamento em cada aba ---------- */
.payment-item__fig { width: 84px; height: 84px; object-fit: contain; filter: drop-shadow(0 8px 10px rgba(27,42,94,.22)); transition: transform .3s ease; }
.payment-item:hover .payment-item__fig { transform: translateY(-4px) rotate(-4deg); }
.payment-item { gap: 10px; }

/* ---------- B32: quem somos centralizado, cada número num cartão com a sua figurinha ---------- */
.sobre__inner { max-width: 1040px; text-align: center; }
.sobre .section-title, .sobre .section-subtitle { text-align: center; margin-left: auto; margin-right: auto; }
.sobre .section-subtitle { max-width: 720px; }
.numeros { list-style: none; display: grid; grid-template-columns: repeat(4, 1fr); gap: 22px; margin: 48px 0 0; padding: 0; }
.numero { position: relative; background: #FFFDF8; color: var(--navy); border: 3px solid var(--navy); border-radius: 24px; padding: 18px 14px 20px; display: flex; flex-direction: column; align-items: center; gap: 4px; box-shadow: 6px 6px 0 var(--cor, var(--yellow)); transition: transform .3s ease; }
.numero:nth-child(odd) { transform: rotate(-2deg); }
.numero:nth-child(even) { transform: rotate(1.6deg); margin-top: 18px; }
.numero:hover { transform: rotate(0) translateY(-6px); }
.numero--carimbo { --cor: var(--red); } .numero--estrela { --cor: var(--yellow); } .numero--cracha { --cor: var(--teal); } .numero--cartao { --cor: var(--blue); }
.numero__fig { width: 116px; height: 104px; object-fit: contain; margin-top: -48px; filter: drop-shadow(0 10px 12px rgba(0,0,0,.28)); animation: numero-bole 5s ease-in-out infinite; }
.numero:nth-child(2) .numero__fig { animation-delay: -1.2s; } .numero:nth-child(3) .numero__fig { animation-delay: -2.4s; } .numero:nth-child(4) .numero__fig { animation-delay: -3.6s; }
@keyframes numero-bole { 0%, 100% { transform: translateY(0) rotate(-3deg); } 50% { transform: translateY(-7px) rotate(3deg); } }
.numero__val { font-family: 'Lufga', var(--font-sans-fb); font-weight: 900; font-size: 46px; line-height: 1; color: var(--navy); margin-top: 6px; }
.numero__rotulo { font-family: 'Lufga', var(--font-sans-fb); font-size: 12px; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; color: var(--muted); line-height: 1.4; }
.numero__rotulo b { font-weight: 900; color: var(--navy); }
.sobre__titulo-guias { text-align: center; margin-top: 64px; }
.sobre__nota-guias { text-align: center; }
.guias { text-align: left; }
@media (max-width: 900px) { .numeros { grid-template-columns: repeat(2, 1fr); gap: 56px 18px; margin-top: 64px; } }
@media (max-width: 420px) { .numero__val { font-size: 38px; } .numero__rotulo { font-size: 11px; } }

/* ---------- B7: o mapa ampliado de cada região, num diálogo ---------- */
.marco[data-regiao] .marco__rotulo rect { fill: var(--red-label); }
.mapa-regiao { width: min(1240px, 96vw); max-width: none; max-height: 96vh; margin: auto; padding: 0; border: 0; background: transparent; overflow: visible; }
.mapa-regiao::backdrop { background: rgba(27,42,94,.62); }
.mapa-regiao__papel { position: relative; background: var(--cream-soft); border: 3px solid var(--navy); border-radius: 28px; box-shadow: 10px 10px 0 var(--navy); padding: 26px 26px 22px; max-height: calc(96vh - 16px); overflow-y: auto; overscroll-behavior: contain; }
.mapa-regiao__washi { position: absolute; left: 50%; top: -16px; width: 170px; transform: translateX(-50%); pointer-events: none; z-index: 2; }
.mapa-regiao__fechar { position: absolute; right: 14px; top: 12px; width: 44px; height: 44px; border-radius: 50%; background: var(--navy); color: var(--cream); font-size: 26px; line-height: 1; z-index: 3; }
.mapa-regiao__fechar:hover { background: var(--red-label); }
.mapa-regiao__corpo { display: grid; grid-template-columns: minmax(0, 2.2fr) minmax(0, 1fr); grid-template-areas: 'titulo titulo' 'sub sub' 'mapa lista'; gap: 6px 22px; align-items: start; }
.mapa-regiao__titulo { grid-area: titulo; font-family: 'Lufga', var(--font-sans-fb); font-weight: 900; font-size: clamp(24px, 3vw, 34px); color: var(--navy); padding-right: 56px; }
.mapa-regiao__sub { grid-area: sub; font-family: 'Lufga', var(--font-sans-fb); font-size: 14px; color: var(--muted); margin-bottom: 10px; max-width: 640px; }
.mapa-regiao__svg { grid-area: mapa; justify-self: center; width: min(100%, calc(96vh - 170px)); height: auto; aspect-ratio: 1; border-radius: 20px; box-shadow: 0 0 0 5px #FFFDF8, 0 0 0 6px rgba(27,42,94,.25), 0 16px 34px rgba(27,42,94,.22); display: block; }
.mapa-regiao__svg text { font-family: 'Lufga', var(--font-sans-fb); font-weight: 800; text-anchor: middle; pointer-events: none; }
.mapa-regiao__svg .mr-mar { font-size: 22px; letter-spacing: .34em; fill: #FFFDF8; }
.mapa-regiao__svg .mr-pais { font-size: 20px; letter-spacing: .3em; fill: #9C8256; }
.mapa-regiao__svg .mr-cidade { font-size: 24px; fill: var(--navy); paint-order: stroke fill; stroke: #FFFDF8; stroke-width: 6px; stroke-linejoin: round; }
.mapa-regiao__svg .mr-lugar { font-size: 18px; fill: var(--navy); opacity: .75; paint-order: stroke fill; stroke: #FFFDF8; stroke-width: 5px; stroke-linejoin: round; }
.figurinha { cursor: pointer; outline: none; }
.figurinha__linha { stroke: var(--navy); stroke-width: 2.5; stroke-dasharray: 3 5; stroke-linecap: round; opacity: .7; }
.figurinha__pino { fill: var(--red); stroke: #FFFDF8; stroke-width: 3; }
.figurinha__corpo { transition: transform .25s cubic-bezier(.2, 1.4, .4, 1); filter: drop-shadow(0 6px 5px rgba(27,42,94,.32)); }
.figurinha__borda { fill: #FFFDF8; }
.figurinha__nome { opacity: 0; transition: opacity .18s ease; pointer-events: none; }
.figurinha__nome rect { fill: var(--navy); }
.figurinha__nome text { font-size: 14px; fill: var(--cream); }
.figurinha:hover .figurinha__nome, .figurinha:focus-visible .figurinha__nome { opacity: 1; }
.figurinha:hover .figurinha__borda, .figurinha:focus-visible .figurinha__borda { fill: var(--yellow); }
/* a figurinha em foco sobe por cima das vizinhas */
.mapa-regiao__figurinhas:hover .figurinha:not(:hover) { opacity: .85; }
.mapa-regiao__lista { grid-area: lista; list-style: none; margin: 0; padding: 0; display: grid; gap: 12px; }
.mapa-regiao__lista li { display: flex; flex-wrap: wrap; gap: 6px; }
.mapa-regiao__lista span { width: 100%; font-family: 'Lufga', var(--font-sans-fb); font-size: 11px; font-weight: 800; letter-spacing: .14em; text-transform: uppercase; color: var(--eyebrow); }
.mapa-regiao__lista a { font-family: 'Lufga', var(--font-sans-fb); font-size: 12.5px; font-weight: 700; color: var(--navy); background: #FFFDF8; border: 2px solid var(--navy); border-radius: 999px; padding: 6px 12px; line-height: 1.2; }
.mapa-regiao__lista a:hover, .mapa-regiao__lista a:focus-visible { background: var(--yellow); }
@media (max-width: 860px) {
  .mapa-regiao__corpo { grid-template-columns: 1fr; grid-template-areas: 'titulo' 'sub' 'mapa' 'lista'; }
  .mapa-regiao__papel { padding: 22px 14px 18px; box-shadow: 6px 6px 0 var(--navy); }
  .mapa-regiao__lista { margin-top: 14px; }
}

@media (prefers-reduced-motion: reduce) {
  .numero__fig { animation: none; }
  .figurinha__corpo { transition: none; }
}
