/* Carneiro Hotel — landing · v1.0311 (WhatsApp, Kira e «Minha área» no mesmo padrão: pílula chapada sem sombra, mesma medida, recolhe ao rolar) · v1.0260 (acesso: Proprietário e Gerência em 2 botões grandes) · v1.0242 (abertura liga/desliga + 4ª abertura 24 horas na porta) · v1.0241 (3ª abertura Hotel 100% digital, plana) · v1.0240 (abertura A luz do Carneiro) · v1.0229 (abas proprietário/gerência na janela de acesso) · v1.0228 (ENTRAR · Minha área no topo do celular) · v1.0227 (janela de acesso: hóspede, proprietário e gerência) · v1.0207 (Como chegar) · v1.0206 (botões de rota com ícone de cada app) · v1.0204 (Área do hóspede igual ao Reservar) · v1.0203 (Área do hóspede sem sombra) · v1.0202 (Área do hóspede em destaque no topo, idioma em menu, WhatsApp chamativo) · v1.0199 (foto real em todos os cartões do guia e dos restaurantes) · v1.0177 · mobile first · v1.0184 (celular antigo: lados físicos, max/min no lugar de clamp, -webkit-sticky; partida rápida; telas de 320–390 px; barra da frase e brilho dos cartões por transform: CLS 0 ao rolar no celular) · v1.0185 (portal de notícias "Acontece em Itatiba") · v1.0189 (jornal em largura inteira, vitrines com setas, Onde comer) · v1.0190 (Site/Maps/Waze nos cartões e a ficha) · v1.0191 (link e resumo da página) · v1.0192 (Guia do Carneiro Hotel: capa, sugestão de hoje, filtros) */
*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; scroll-behavior: smooth; scroll-padding-top: 92px; -webkit-tap-highlight-color: transparent; -webkit-touch-callout: none; user-select: none; -webkit-user-select: none; }
body { margin: 0; background: var(--ch-paper); color: var(--ch-ink); font: 400 1.0625rem/1.6 var(--ch-body); -webkit-font-smoothing: antialiased; text-rendering: optimizeLegibility; overflow-x: clip; -webkit-user-select: none; user-select: none; }
/* permitir seleção em inputs e áreas editáveis */
input, textarea, [contenteditable="true"], .allow-select, .chb-input, .chb-f__t b, .chb-cat__x, .chb-over__a { -webkit-user-select: text; user-select: text; }
img { display: block; max-width: 100%; height: auto; -webkit-user-drag: none; user-drag: none; pointer-events: none; -webkit-touch-callout: none; }
a { color: inherit; -webkit-touch-callout: none; }
h1, h2, h3, p, ul, ol, dl, dd, figure { margin: 0; padding: 0; -webkit-user-select: none; user-select: none; }
ul, ol { list-style: none; }
button { font-family: inherit; -webkit-touch-callout: none; }
.wrap { width: 100%; max-width: 1200px; margin-left: auto; margin-right: auto; padding-left: 20px; padding-right: 20px; }
.skip { position: absolute; left: -999px; top: 8px; z-index: 2000; background: var(--ch-ink); color: #fff; padding: 12px 18px; border-radius: 12px; }
.skip:focus { left: 8px; }
a:focus-visible, summary:focus-visible, .fan:focus-visible, .fan__b:focus-visible, .room__a:focus-visible, .wk__l button:focus-visible, .tabbar :focus-visible { outline: 3px solid var(--ch-red); outline-offset: 3px; border-radius: 10px; }

/* ---------- tipografia ---------- */
.eyebrow { font-size: .75rem; font-weight: 700; letter-spacing: .22em; text-transform: uppercase; color: var(--ch-red); margin-bottom: 14px; }
.eyebrow--light { color: #ff6166; }
.h2 { font: 800 max(2.25rem, min(8.5vw, 4.25rem))/1.04 var(--ch-display); letter-spacing: -.03em; text-wrap: balance; }
.h2--xl { font-size: max(2.25rem, min(7.5vw, 4.75rem)); max-width: 14em; }
.mega { font: 900 max(3.5rem, min(17vw, 9rem))/.96 var(--ch-display); letter-spacing: -.035em; word-spacing: .04em; }
.mega em { font-style: normal; color: var(--ch-red); }
.dot { color: var(--ch-red); }
.dot--w { color: #fff; }
.lead { margin-top: 18px; max-width: 32em; color: var(--ch-muted); font-size: 1.1875rem; line-height: 1.5; font-weight: 500; }
.lead--dim { color: rgba(255, 255, 255, .7); }
.sec { padding: 84px 0; }
.sec__h { margin-bottom: 36px; }

/* ---------- topo: cápsula de vidro claro, sempre — o logotipo aparece nas cores oficiais em qualquer seção ---------- */
.top { position: fixed; z-index: 2300; top: 0; right: 0; bottom: auto; left: 0; padding: calc(10px + env(safe-area-inset-top)) 10px 0; color: var(--ch-ink); pointer-events: none; }
.top::before { content: ""; position: absolute; top: 0; right: 0; bottom: 0; left: 0; z-index: -1; background: rgba(255, 255, 255, .96); }
.top__in { pointer-events: auto; display: flex; align-items: center; gap: 12px; height: 64px; max-width: 1180px; margin-left: auto; margin-right: auto; padding: 0 8px 0 16px; border-radius: 999px;
  background: rgba(255, 255, 255, .92); border: 1px solid rgba(255, 255, 255, .95); -webkit-backdrop-filter: blur(24px) saturate(190%); backdrop-filter: blur(24px) saturate(190%);
  box-shadow: 0 18px 40px -22px rgba(0, 0, 0, .55), 0 0 0 1px rgba(11, 11, 13, .05), inset 0 1px 0 #fff; }
.top__wa { display: grid; place-items: center; width: 46px; height: 46px; border-radius: 50%; background: rgba(11, 11, 13, .06); text-decoration: none; }
.top__book { min-height: 46px; padding: 0 20px; font-size: .9375rem; }
.brand { display: inline-flex; align-items: center; text-decoration: none; margin-right: auto; }
.brand__logo { display: block; height: 50px; width: auto; }
.nav { display: none; }

/* ---------- cena de abertura ---------- */
.scene { position: relative; background: #000; color: #fff; } /* altura = capa + frases (fluxo normal); a foto fica pinada atrás */
.scene__pin { position: -webkit-sticky; position: sticky; top: 0; z-index: 0; height: 100vh; height: 100svh; overflow: hidden; }
.scene__flow { position: relative; z-index: 1; margin-top: -100vh; margin-top: -100svh; }
.scene__img { position: absolute; top: 0; right: 0; bottom: 0; left: 0; transform-origin: 74% 46%; transform: scale(var(--z, 1)); will-change: transform; }
.scene__img img { width: 100%; height: 100%; object-fit: cover; object-position: 66% 50%; }
.scene__shade { position: absolute; top: 0; right: 0; bottom: 0; left: 0; background: rgba(0, 0, 0, .75); }
.scene__dim { position: absolute; top: 0; right: 0; bottom: 0; left: 0; background: #000; opacity: var(--dim, 0); will-change: opacity; } /* só a opacidade muda na rolagem: nada de repintar a tela inteira */
.scene__a { position: relative; min-height: 100vh; min-height: 100svh; display: flex; align-items: flex-end; padding: 120px 0 calc(104px + env(safe-area-inset-bottom)); }
.scene__a[inert] { pointer-events: none; }
.scene__a .wrap { position: relative; }
.scene .kicker { text-shadow: 0 1px 2px rgba(0, 0, 0, .7), 0 3px 12px rgba(0, 0, 0, .6); }
.kicker { display: inline-flex; align-items: center; gap: 10px; font-size: .75rem; font-weight: 700; letter-spacing: .2em; text-transform: uppercase; margin-bottom: 16px; }
.kicker__dot { width: 8px; height: 8px; border-radius: 50%; background: #2fd47a; box-shadow: 0 0 0 0 rgba(47, 212, 122, .7); animation: pulse 2s infinite; flex: none; }
@media (max-width: 359px) { .kicker__w span { display: none; } }
a.kicker__w { color: inherit; text-decoration: underline; text-decoration-color: rgba(255, 255, 255, .45); text-underline-offset: 4px; }
.kicker__w { padding-left: 10px; border-left: 1px solid rgba(255, 255, 255, .4); letter-spacing: .06em; }
@keyframes pulse { to { box-shadow: 0 0 0 12px rgba(47, 212, 122, 0); } }
.scene .mega { animation: rise 1s var(--ch-ease) both; font-size: max(2.25rem, min(13.4vw, 8rem)); overflow-wrap: anywhere; text-shadow: none; }
.scene .mega > span, .scene .mega > em { display: block; }
.scene .mega .dot { font-style: normal; }
.scene .mega.is-fit > span, .scene .mega.is-fit > em { white-space: nowrap; overflow-wrap: normal; }
/* título com emoção (site.js): máscara por palavra, letras de "hospedagem" acendendo, ponto que cai e pulsa */
.scene .mega.is-split { animation: none; }
.mega .mw, .mega .mw__i, .mega .ml { display: inline-block; }
.mega.is-split:not(.is-in) .mw { clip-path: inset(-.5em -.4em -.3em -.4em); }
.mega .mw__i { transform-origin: 0 100%; }
.mega .ml { will-change: transform, filter; }
.mega.is-in .ml { will-change: auto; }
.scene .mega .dot { position: relative; display: inline-block; }
.mega__ring { position: absolute; left: .03em; bottom: .125em; width: .2em; height: .2em; border-radius: 50%; border: .028em solid #ff4d52; box-shadow: 0 0 .12em rgba(234, 32, 37, .8); opacity: 0; pointer-events: none; }
/* v1.0100: sombra e brilho do título ficam numa cópia POR BAIXO das letras (ver site.js) — acaba a emenda entre as letras de "hospedagem" */
.scene .mega.is-split { position: relative; isolation: isolate; text-shadow: none; }
.scene .mega > .mega__under { position: absolute; left: 0; top: 0; right: 0; z-index: -1; display: block; pointer-events: none; -webkit-user-select: none; user-select: none; }
.scene .mega > .mega__under > span, .scene .mega > .mega__under > em { display: block; }
.scene .mega .mega__under, .scene .mega .mega__under * { color: transparent !important; }
.scene .mega.is-split ~ .scene__sub { animation-delay: .95s; }
.scene .mega.is-split ~ .trust { animation-delay: 1.1s; }
.scene .mega.is-split ~ .quick { animation-delay: 1.2s; }
.scene .mega.is-split ~ .scene__book { animation-delay: 1.3s; }
.scene__sub { margin-top: 18px; max-width: 24em; font-size: 1.125rem; line-height: 1.45; font-weight: 500; color: #fff; animation: rise 1s .12s var(--ch-ease) both; }
.scene__book { margin-top: 24px; animation: rise 1s .22s var(--ch-ease) both; }
@keyframes rise { from { opacity: 0; transform: translateY(26px); } }
.scene__book .chb-shell { grid-template-columns: 1fr 1fr; }
.scene__book .chb-f[data-ch-guests] { display: none; }
.scene__book .chb-go { grid-column: 1 / -1; }
.scene__book .chb-f { min-height: 60px; padding-left: 12px; padding-right: 12px; gap: 10px; }
.scene__line { position: relative; min-height: 66vh; min-height: 66svh; padding: 0 20px; text-align: center; font: 900 max(2.75rem, min(13vw, 7.5rem))/.96 var(--ch-display); letter-spacing: -.035em; opacity: var(--o, 1); transform: translateY(var(--y, 0px)) scale(var(--s, 1)); pointer-events: none; text-shadow: 0 10px 50px rgba(0, 0, 0, .6); }
.scene__line--end { min-height: 90vh; min-height: 90svh; }
.scene__line { overflow: hidden; } /* v1.0184: a sombra atrás da frase (.sl__h::before, 20% para cada lado) empurrava a página 47 px para a direita — só o "overflow-x: clip" do body escondia, e iPhone com iOS < 16 não conhece clip */
.scene__hint { position: absolute; z-index: 2; left: 50%; bottom: calc(86px + env(safe-area-inset-bottom)); transform: translateX(-50%); display: none; }

/* ---------- acomodações ---------- */
.rooms { background: var(--ch-mist); padding-bottom: 72px; }
.rooms__l { display: flex; gap: 14px; padding: 4px 20px 24px; overflow-x: auto; scroll-snap-type: x mandatory; scrollbar-width: none; -webkit-overflow-scrolling: touch; }
.rooms__l::-webkit-scrollbar { display: none; }
.room { flex: none; width: min(82vw, 380px); scroll-snap-align: center; }
.room__a { position: relative; display: block; width: 100%; aspect-ratio: 3 / 4; padding: 0; border: 0; border-radius: 30px; overflow: hidden; cursor: pointer; background: #222; color: #fff; text-align: left; isolation: isolate; box-shadow: 0 30px 60px -36px rgba(11, 11, 13, .6); transition: transform .5s var(--ch-ease), box-shadow .5s; -webkit-tap-highlight-color: transparent; }
.room__a img { position: absolute; top: 0; right: 0; bottom: 0; left: 0; z-index: -2; width: 100%; height: 100%; object-fit: cover; transition: transform 1.2s var(--ch-ease); }
.room__a::after { content: ""; position: absolute; top: 0; right: 0; bottom: 0; left: 0; z-index: -1; background: linear-gradient(180deg, rgba(0, 0, 0, 0) 30%, rgba(0, 0, 0, .55) 58%, rgba(0, 0, 0, .92) 100%); }
.room__b { position: absolute; top: auto; right: 0; bottom: 0; left: 0; display: grid; gap: 16px; padding: 22px; }
.room__t { display: grid; gap: 4px; }
.room__t b { font: 800 1.625rem/1.1 var(--ch-display); letter-spacing: -.025em; text-shadow: 0 2px 18px rgba(0, 0, 0, .55); }
.room__t small { font-size: .9375rem; color: rgba(255, 255, 255, .78); line-height: 1.35; }
.room__f { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 10px 10px 10px 18px; border-radius: 999px; background: rgba(255, 255, 255, .16); border: 1px solid rgba(255, 255, 255, .28); -webkit-backdrop-filter: blur(18px) saturate(170%); backdrop-filter: blur(18px) saturate(170%); box-shadow: inset 0 1px 0 rgba(255, 255, 255, .3); }
.room__p { display: flex; align-items: baseline; gap: 8px; flex-wrap: wrap; }
.room__p small { font-size: .8125rem; color: rgba(255, 255, 255, .78); }
.room__p strong { font: 900 1.375rem/1 var(--ch-display); letter-spacing: -.02em; font-variant-numeric: tabular-nums; }
.room__go { display: grid; place-items: center; width: 44px; height: 44px; flex: none; border-radius: 50%; background: var(--ch-red); box-shadow: inset 0 1px 0 rgba(255, 255, 255, .4); transition: transform .4s var(--ch-ease); }
.room__a:hover { transform: translateY(-6px); box-shadow: 0 44px 70px -36px rgba(11, 11, 13, .7); }
.room__a:hover img { transform: scale(1.06); }
.room__a:hover .room__go { transform: rotate(-45deg); }

/* ---------- check-in digital ---------- */
.access { background: #000; color: #fff; overflow: hidden; }
.access__in { display: grid; gap: 44px; }
.steps { margin: 30px 0 32px; display: grid; }
.steps li { display: grid; grid-template-columns: 44px 1fr; gap: 16px; padding-bottom: 24px; position: relative; }
.steps li:not(:last-child)::before { content: ""; position: absolute; left: 21.5px; top: 46px; bottom: 2px; width: 1px; background: linear-gradient(rgba(255, 255, 255, .35), rgba(255, 255, 255, .08)); }
.steps span { display: grid; place-items: center; width: 44px; height: 44px; border-radius: 50%; font: 800 1.0625rem/1 var(--ch-display); border: 1px solid rgba(255, 255, 255, .3); background: rgba(255, 255, 255, .08); box-shadow: inset 0 1px 0 rgba(255, 255, 255, .25); }
.steps li:last-child span { background: var(--ch-red); border-color: transparent; }
.steps b { display: block; font: 800 1.1875rem/1.3 var(--ch-display); letter-spacing: -.01em; padding-top: 8px; }
.steps p { color: rgba(255, 255, 255, .66); font-size: 1rem; line-height: 1.5; margin-top: 2px; }
.access .glass { width: 100%; }
.access__v { position: relative; border-radius: 32px; overflow: hidden; aspect-ratio: 4 / 5; background: #222; }
.access__v img { width: 100%; height: 100%; object-fit: cover; object-position: 60% 40%; filter: saturate(.9) contrast(1.05); }
.access__v::after { content: ""; position: absolute; top: 0; right: 0; bottom: 0; left: 0; background: linear-gradient(transparent 55%, rgba(0, 0, 0, .7)); }
.scan { position: absolute; z-index: 2; left: 71%; top: 49%; width: 30%; aspect-ratio: 1; transform: translate(-50%, -50%); }
.scan i { position: absolute; width: 26%; height: 26%; border: 3px solid #fff; filter: drop-shadow(0 2px 6px rgba(0, 0, 0, .5)); }
.scan i:nth-child(1) { left: 0; top: 0; border-right: 0; border-bottom: 0; border-radius: 14px 0 0 0; }
.scan i:nth-child(2) { right: 0; top: 0; border-left: 0; border-bottom: 0; border-radius: 0 14px 0 0; }
.scan i:nth-child(3) { left: 0; bottom: 0; border-right: 0; border-top: 0; border-radius: 0 0 0 14px; }
.scan i:nth-child(4) { right: 0; bottom: 0; border-left: 0; border-top: 0; border-radius: 0 0 14px 0; }
.scan b { position: absolute; left: 6%; right: 6%; height: 2px; top: 10%; background: linear-gradient(90deg, rgba(255, 59, 63, 0), var(--ch-red-bright), rgba(255, 59, 63, 0)); box-shadow: 0 0 18px 4px rgba(234, 32, 37, .7); animation: scan 2.8s ease-in-out infinite alternate; }
@keyframes scan { to { top: 90%; } }
.access__v figcaption { position: absolute; z-index: 3; left: 16px; bottom: 16px; display: inline-flex; align-items: center; gap: 10px; padding: 10px 16px; border-radius: 999px; font-size: .9375rem; font-weight: 600; background: rgba(255, 255, 255, .16); border: 1px solid rgba(255, 255, 255, .3); -webkit-backdrop-filter: blur(14px); backdrop-filter: blur(14px); }
.pulse { width: 10px; height: 10px; border-radius: 50%; background: #2fd47a; animation: pulse 2s infinite; }

/* ---------- Itatiba agora (bento) ---------- */
.city { background: var(--ch-mist); }
.bento { display: grid; gap: 14px; }
.bento > * { border-radius: 30px; overflow: hidden; min-width: 0; }
.tile__h { font: 800 1.125rem/1.2 var(--ch-display); letter-spacing: -.02em; margin-bottom: 14px; }
.wx { position: relative; isolation: isolate; color: #fff; min-height: 420px; display: grid; grid-template-rows: 1fr auto; padding: 24px; --sky: linear-gradient(170deg, #0b1026 0%, #1b2a55 55%, #41386e 100%); background: var(--sky); transition: background 1s; }
.wx[data-sky="day"] { --sky: linear-gradient(170deg, #1e7fe0 0%, #57b2f5 55%, #b8e2ff 100%); }
.wx[data-sky="dusk"] { --sky: linear-gradient(170deg, #27315f 0%, #b0577a 60%, #f6a15f 100%); }
.wx[data-sky="cloud"] { --sky: linear-gradient(170deg, #4d5f78 0%, #8093ab 60%, #b9c5d3 100%); }
.wx[data-sky="rain"] { --sky: linear-gradient(170deg, #27313f 0%, #475669 60%, #6f8196 100%); }
.wx[data-sky="storm"] { --sky: linear-gradient(170deg, #14161d 0%, #2c3140 60%, #4a4f63 100%); }
.wx__sky { position: absolute; top: 0; right: 0; bottom: 0; left: 0; z-index: -1; overflow: hidden; pointer-events: none; }
.wx__sky i { position: absolute; display: none; }
.wx__sun { right: -60px; top: -60px; width: 260px; height: 260px; border-radius: 50%; background: radial-gradient(circle, #fff6c8 0 22%, rgba(255, 221, 110, .9) 23% 30%, rgba(255, 221, 110, 0) 31%), repeating-conic-gradient(rgba(255, 236, 160, .5) 0 6deg, transparent 6deg 15deg); -webkit-mask-image: radial-gradient(circle, #000 0 45%, transparent 70%); mask-image: radial-gradient(circle, #000 0 45%, transparent 70%); animation: spin 60s linear infinite; }
.wx__moon { right: 34px; top: 34px; width: 74px; height: 74px; border-radius: 50%; background: #f4f1e6; box-shadow: 0 0 60px 10px rgba(244, 241, 230, .35), inset -14px -8px 0 0 rgba(180, 176, 160, .45); }
.wx__stars { top: 0; right: 0; bottom: 0; left: 0; background-image: radial-gradient(1.5px 1.5px at 12% 22%, #fff, rgba(255, 255, 255, 0)), radial-gradient(1px 1px at 30% 60%, #fff, rgba(255, 255, 255, 0)), radial-gradient(1.5px 1.5px at 48% 14%, #fff, rgba(255, 255, 255, 0)), radial-gradient(1px 1px at 62% 40%, #fff, rgba(255, 255, 255, 0)), radial-gradient(1.5px 1.5px at 22% 80%, #fff, rgba(255, 255, 255, 0)), radial-gradient(1px 1px at 84% 66%, #fff, rgba(255, 255, 255, 0)), radial-gradient(1px 1px at 70% 84%, #fff, rgba(255, 255, 255, 0)); animation: twinkle 4s ease-in-out infinite alternate; }
.wx__cloud { height: 70px; border-radius: 70px; background: rgba(255, 255, 255, .78); filter: blur(10px); animation: drift 38s linear infinite; }
.wx__cloud--1 { top: 60px; left: -40%; width: 240px; }
.wx__cloud--2 { top: 130px; left: -70%; width: 320px; height: 84px; opacity: .6; animation-duration: 56s; animation-delay: -20s; }
.wx__rain { position: absolute; top: 0; right: 0; bottom: 0; left: 0; display: none; width: 100%; height: 100%; } /* chuva de verdade: canvas (site.js) */
.wx[data-sky="day"] .wx__sun, .wx[data-sky="dusk"] .wx__sun, .wx[data-sky="night"] .wx__moon, .wx[data-sky="night"] .wx__stars,
.wx[data-clouds="1"] .wx__cloud, .wx[data-sky="cloud"] .wx__cloud, .wx[data-sky="rain"] .wx__cloud, .wx[data-sky="storm"] .wx__cloud, .wx[data-sky="rain"] .wx__rain, .wx[data-sky="storm"] .wx__rain { display: block; }
.wx[data-sky="rain"] .wx__cloud, .wx[data-sky="storm"] .wx__cloud { background: rgba(200, 210, 222, .5); }
@keyframes spin { to { transform: rotate(360deg); } }
@keyframes twinkle { from { opacity: .45; } to { opacity: 1; } }
@keyframes drift { to { transform: translateX(240vw); } }
@keyframes rain { to { background-position: -40px 120px; } }
.wx__place { display: flex; align-items: center; gap: 10px; font-size: .75rem; font-weight: 700; letter-spacing: .18em; text-transform: uppercase; }
.wx__place small { font-weight: 500; letter-spacing: .04em; opacity: .7; text-transform: none; font-size: .8125rem; }
.wx__t { font: 900 max(6.5rem, min(30vw, 10rem))/.9 var(--ch-display); letter-spacing: -.07em; margin: 14px 0 6px -4px; font-variant-numeric: tabular-nums; text-shadow: 0 10px 40px rgba(0, 0, 0, .25); }
.wx__t sup { font-size: .45em; font-weight: 500; vertical-align: top; position: relative; top: .12em; margin-left: .02em; opacity: .8; }
.wx__d { font: 800 1.5rem/1.2 var(--ch-display); letter-spacing: -.02em; }
.wx__m { margin-top: 6px; font-size: .9375rem; color: rgba(255, 255, 255, .82); }
.wx__hours { display: grid; grid-template-columns: repeat(6, 1fr); gap: 4px; margin-top: 22px; padding: 12px 6px; border-radius: 22px; background: rgba(255, 255, 255, .14); border: 1px solid rgba(255, 255, 255, .22); -webkit-backdrop-filter: blur(16px) saturate(160%); backdrop-filter: blur(16px) saturate(160%); }
.wx__hours li { display: grid; justify-items: center; gap: 6px; font-size: .8125rem; font-weight: 600; min-height: 74px; align-content: center; }
.wx__hours small { opacity: .8; font-weight: 500; }
.wx__hours svg, .wk__l svg { width: 24px; height: 24px; fill: none; stroke: currentColor; stroke-width: 1.7; stroke-linecap: round; stroke-linejoin: round; }
/* os próximos 3 dias: cada dia é um céu vivo com a curva de 24 h */
.bento > .d3 { border-radius: 0; overflow: visible; }
.d3__h { display: grid; gap: 4px; margin: 10px 4px 16px; } .d3__h .tile__h { margin: 0; font-size: 1.375rem; } .d3__h p { color: var(--ch-muted); font-size: .9375rem; }
.d3__l { display: grid; gap: 14px; }
.d3__sk { height: 380px; border-radius: 30px; background: linear-gradient(100deg, #ececf0 40%, #f7f7f9 50%, #ececf0 60%) 0 0 / 300% 100%; animation: sk 1.4s linear infinite; }
.day { position: relative; isolation: isolate; display: grid; gap: 10px; width: 100%; height: 100%; padding: 18px 18px 14px; border: 0; border-radius: 30px; overflow: hidden; text-align: left; color: #fff; cursor: pointer; font: inherit; background: var(--sky); --sky: linear-gradient(165deg, #1668d8 0%, #3f9df0 55%, #9fd6ff 100%); box-shadow: 0 30px 60px -34px rgba(16, 60, 130, .55); transition: transform .5s var(--ch-ease), box-shadow .5s var(--ch-ease); -webkit-tap-highlight-color: transparent; }
.day[data-k="part"] { --sky: linear-gradient(165deg, #2a72cf 0%, #5aa6e8 55%, #b5d8f2 100%); }
.day[data-k="cloud"], .day[data-k="fog"] { --sky: linear-gradient(165deg, #46566e 0%, #74879f 58%, #a9b7c7 100%); }
.day[data-k="rain"] { --sky: linear-gradient(165deg, #1f2a3a 0%, #3c4d63 58%, #63788f 100%); }
.day[data-k="storm"] { --sky: linear-gradient(165deg, #101219 0%, #272c3a 58%, #474c60 100%); }
.day:hover { transform: translateY(-4px); box-shadow: 0 40px 70px -34px rgba(16, 60, 130, .7); } .day:active { transform: scale(.985); }
.day:focus-visible { outline: 3px solid var(--ch-red); outline-offset: 3px; }
.day__sky { position: absolute; top: 0; right: 0; bottom: 0; left: 0; z-index: -1; overflow: hidden; pointer-events: none; } .day__sky i { position: absolute; display: none; }
.day__orb { right: -46px; top: -46px; width: 190px; height: 190px; border-radius: 50%; background: radial-gradient(circle, #fff6c8 0 22%, rgba(255, 221, 110, .9) 23% 30%, rgba(255, 221, 110, 0) 31%), repeating-conic-gradient(rgba(255, 236, 160, .5) 0 6deg, transparent 6deg 15deg); -webkit-mask-image: radial-gradient(circle, #000 35%, transparent 70%); mask-image: radial-gradient(circle, #000 35%, transparent 70%); animation: spin 70s linear infinite; }
.day__cl { height: 54px; border-radius: 54px; background: rgba(255, 255, 255, .7); filter: blur(9px); animation: drift-s 34s linear infinite; }
.day__cl--1 { top: 26px; left: -220px; width: 190px; } .day__cl--2 { top: 84px; left: -300px; width: 260px; height: 64px; opacity: .55; animation-duration: 52s; animation-delay: -24s; }
.day__rn { position: absolute; top: 0; right: 0; bottom: 0; left: 0; display: none; width: 100%; height: 100%; } /* chuva de verdade: canvas (site.js) */
.day__fl { top: 0; right: 0; bottom: 0; left: 0; background: #fff; opacity: 0; animation: flash 7s linear infinite; }
@keyframes drift-s { to { transform: translateX(1100px); } }
@keyframes flash { 0%, 91%, 94%, 100% { opacity: 0; } 92%, 95% { opacity: .35; } }
.day[data-k="sun"] .day__orb, .day[data-k="part"] .day__orb, .day[data-k="part"] .day__cl, .day[data-k="cloud"] .day__cl, .day[data-k="fog"] .day__cl, .day[data-k="rain"] .day__cl, .day[data-k="storm"] .day__cl, .day[data-k="rain"] .day__rn, .day[data-k="storm"] .day__rn, .day[data-k="storm"] .day__fl { display: block; }
.day[data-k="rain"] .day__cl, .day[data-k="storm"] .day__cl { background: rgba(200, 210, 222, .45); }
.day__top { display: flex; align-items: flex-start; justify-content: space-between; gap: 12px; }
.day__n { display: grid; gap: 3px; } .day__n b { font: 900 1.5rem/1 var(--ch-display); letter-spacing: -.035em; } .day__n small { font-size: .8125rem; font-weight: 600; letter-spacing: .04em; opacity: .85; text-transform: capitalize; }
.day__t { font: 900 3.25rem/.9 var(--ch-display); letter-spacing: -.06em; font-variant-numeric: tabular-nums; text-shadow: 0 8px 30px rgba(0, 0, 0, .25); white-space: nowrap; } .day__t small { font-size: .42em; font-weight: 600; letter-spacing: -.02em; opacity: .75; margin-left: 6px; }
.day__w { display: grid; gap: 2px; min-height: 0; align-content: start; } .day__w b { font: 800 1.0625rem/1.2 var(--ch-display); letter-spacing: -.015em; } .day__w em { font-style: normal; font-size: .875rem; line-height: 1.35; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; color: rgba(255, 255, 255, .88); }
.day__c { position: relative; display: block; height: 64px; margin: 0 -18px; }
.day__c svg { position: absolute; top: 0; right: 0; bottom: 0; left: 0; width: 100%; height: 100%; overflow: visible; }
.day__sunband { fill: rgba(255, 255, 255, .1); }
.day__line { fill: none; stroke: #fff; stroke-width: 2.5; stroke-linecap: round; stroke-linejoin: round; vector-effect: non-scaling-stroke; stroke-dasharray: 100; stroke-dashoffset: 100; }
.rv.is-in .day__line, .d3__l .day__line { animation: draw 1.6s var(--ch-ease) calc(var(--i) * .18s + .2s) forwards; }
@keyframes draw { to { stroke-dashoffset: 0; } }
.day__bars rect { fill: #8fd0ff; opacity: .85; }
.day__max, .day__now { position: absolute; width: 0; height: 0; font-style: normal; }
.day__max::before, .day__now::before { content: ""; position: absolute; left: -5px; top: -5px; width: 10px; height: 10px; border-radius: 50%; background: #fff; box-shadow: 0 0 0 4px rgba(255, 255, 255, .25); }
.day__max b { position: absolute; left: 0; bottom: 10px; transform: translateX(-50%); font: 800 .8125rem/1 var(--ch-display); white-space: nowrap; }
.day__now::before { background: var(--ch-red); box-shadow: 0 0 0 4px rgba(234, 32, 37, .35); animation: pulse-r 1.6s infinite; }
.day__now b { position: absolute; left: 0; top: 12px; transform: translateX(-50%); padding: 3px 7px; border-radius: 999px; background: rgba(0, 0, 0, .45); font: 700 .6875rem/1 var(--ch-body); letter-spacing: .04em; white-space: nowrap; }
.day__p { display: grid; grid-template-columns: repeat(4, 1fr); gap: 4px; padding: 8px 4px; border-radius: 16px; background: rgba(255, 255, 255, .14); border: 1px solid rgba(255, 255, 255, .22); -webkit-backdrop-filter: blur(14px) saturate(160%); backdrop-filter: blur(14px) saturate(160%); }
.day__p span { display: grid; justify-items: center; gap: 2px; } .day__p svg { width: 18px; height: 18px; fill: none; stroke: currentColor; stroke-width: 1.7; stroke-linecap: round; stroke-linejoin: round; } .day__p b { font: 800 .9375rem/1 var(--ch-display); font-variant-numeric: tabular-nums; } .day__p small { font-size: .625rem; font-weight: 600; opacity: .85; }
.day__f { display: flex; flex-wrap: wrap; gap: 4px 12px; font-size: .75rem; font-weight: 600; min-height: 20px; } .day__f span { display: inline-flex; align-items: center; gap: 5px; white-space: nowrap; } .day__f svg { width: 15px; height: 15px; fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; opacity: .9; }
.day__go { display: flex; align-items: center; justify-content: space-between; gap: 10px; min-height: 48px; margin-top: 2px; padding: 0 8px 0 18px; border-radius: 999px; background: #fff; color: var(--ch-ink); font: 700 .9375rem/1.2 var(--ch-body); }
.day__go { min-height: 52px; } .day__cta { display: grid; gap: 3px; min-width: 0; } .day__cta b { font-weight: 800; } .day__cta small { font-size: .8125rem; font-weight: 700; color: var(--ch-red); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; } .day__cta small.is-full { color: var(--ch-muted); }
.day__go svg { flex: none; width: 34px; height: 34px; padding: 8px; border-radius: 50%; background: var(--ch-red); color: #fff; fill: none; stroke: currentColor; stroke-width: 2.4; stroke-linecap: round; stroke-linejoin: round; transition: transform .4s var(--ch-ease); } .day:hover .day__go svg { transform: translateX(3px); }
.wk, .ev, .loc { background: #fff; padding: 24px; }
.wk__l { display: grid; }
.wk__l button { display: grid; grid-template-columns: 3.4em 24px 2.6em 1fr auto; align-items: center; gap: 10px; width: 100%; min-height: 56px; padding: 0 8px; margin: 0 -8px; width: calc(100% + 16px); border: 0; border-top: 1px solid var(--ch-line); background: none; text-align: left; font: inherit; color: var(--ch-ink); cursor: pointer; border-radius: 0; transition: background .2s; }
.wk__l li:first-child button { border-top: 0; }
.wk__l button:hover { background: var(--ch-mist); border-radius: 14px; }
.wk__d { font-weight: 700; text-transform: capitalize; }
.wk__r { font-size: .75rem; font-weight: 700; color: #2f7fd6; }
.wk__bar { position: relative; height: 6px; border-radius: 3px; background: var(--ch-mist); }
.wk__bar i { position: absolute; top: 0; bottom: 0; left: var(--l); right: var(--r); border-radius: 3px; background: linear-gradient(90deg, #58b7ff, #ffc83d 55%, var(--ch-red)); }
.wk__mm { font-variant-numeric: tabular-nums; font-weight: 700; white-space: nowrap; font-size: .9375rem; }
.wk__mm small { color: var(--ch-muted); font-weight: 500; font-size: 1em; margin-right: 6px; }
.wk__go { display: none; }
@keyframes sk { to { background-position: -200% 0; } }
/* localização: mapa real das ruas do Centro (OpenStreetMap) com o hotel pulsando */
.loc { position: relative; display: grid; overflow: hidden; padding: 0; color: #fff; background: #0d0d0f; isolation: isolate; }
.loc__map { position: relative; height: 210px; overflow: hidden; background: radial-gradient(120% 90% at 50% 50%, #1b1b1f 0%, #0d0d0f 70%); }
.loc__map svg { position: absolute; top: 0; right: 0; bottom: 0; left: 0; width: 100%; height: 100%; }
.loc__map path { fill: none; stroke-linecap: round; stroke-linejoin: round; }
.loc__map .r { stroke: rgba(255, 255, 255, .13); } .loc__map .s { stroke: rgba(255, 255, 255, .07); } .loc__map .t { stroke: rgba(255, 255, 255, .2); } .loc__map .m { stroke: rgba(255, 255, 255, .3); }
.loc__map .p { fill: rgba(47, 212, 122, .12); stroke: rgba(47, 212, 122, .25); stroke-width: 2; }
.loc__map::after { content: ""; position: absolute; top: 0; right: 0; bottom: 0; left: 0; pointer-events: none; background: linear-gradient(180deg, rgba(13, 13, 15, 0) 55%, #0d0d0f 100%); }
.loc .pin__c { fill: var(--ch-red); } .loc .pin__d { fill: #fff; } .loc .pin__h { fill: rgba(234, 32, 37, .35); }
.loc .pin__r { fill: none; stroke: var(--ch-red); stroke-width: 3; transform-box: fill-box; transform-origin: center; animation: loc-pulse 2.6s var(--ch-ease) infinite; }
.loc .pin__r--2 { animation-delay: 1.3s; }
@keyframes loc-pulse { from { transform: scale(.4); opacity: .9; } to { transform: scale(3.2); opacity: 0; } }
.loc .lbl rect { fill: #fff; } .loc .lbl text { font: 800 17px/1 var(--ch-body); fill: #101010; letter-spacing: -.01em; }
.loc__c { position: relative; z-index: 1; display: grid; align-content: start; gap: 10px; padding: 4px 22px 24px; }
.loc__k { display: inline-flex; align-items: center; gap: 8px; margin: 0; font: 800 .6875rem/1 var(--ch-body); letter-spacing: .16em; text-transform: uppercase; color: rgba(255, 255, 255, .7); }
.loc__h { margin: 0; font: 800 max(1.625rem, min(5.6vw, 2.125rem))/1.05 var(--ch-display); letter-spacing: -.03em; color: #fff; }
.loc__a { display: grid; gap: 3px; margin: 2px 0 0; font: 700 1.125rem/1.3 var(--ch-body); color: #fff; }
.loc__a small { font-size: .875rem; font-weight: 600; color: rgba(255, 255, 255, .62); }
.loc__near { margin: 0; font-size: .9375rem; line-height: 1.45; color: rgba(255, 255, 255, .78); max-width: 28em; }
.loc__near b { color: #fff; }
.loc__b { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 8px; }
.loc__btn { display: inline-flex; align-items: center; gap: 8px; min-height: 48px; padding: 0 20px; border-radius: 999px; border: 1px solid rgba(255, 255, 255, .28); background: rgba(255, 255, 255, .08); color: #fff; font: 700 .9375rem/1 var(--ch-body); text-decoration: none; -webkit-backdrop-filter: blur(10px); backdrop-filter: blur(10px); transition: background .2s, transform .2s; }
.loc__btn:hover { background: rgba(255, 255, 255, .18); } .loc__btn:active { transform: scale(.97); }
.loc__btn--w { background: #fff; color: #101010; border-color: #fff; } .loc__btn--w:hover { background: #f1f1f3; }
.loc__btn svg { width: 18px; height: 18px; flex: none; fill: none; stroke: currentColor; stroke-width: 2.2; stroke-linecap: round; stroke-linejoin: round; }
.loc__btn--w svg { color: var(--ch-red); }
.loc__btn:focus-visible { outline: 3px solid #fff; outline-offset: 3px; }
.loc__osm { position: absolute; z-index: 2; right: 14px; top: 10px; font-size: .625rem; color: rgba(255, 255, 255, .4); }
@media (min-width: 1024px) {
  .loc { min-height: 290px; }
  .loc__map { position: absolute; top: 0; right: 0; bottom: 0; left: 32%; height: auto; }
  .loc__map::after { background: linear-gradient(90deg, #0d0d0f 0%, rgba(13, 13, 15, .6) 22%, rgba(13, 13, 15, 0) 50%); }
  .loc__c { align-content: center; max-width: 420px; padding: 30px 32px; }
  .loc__osm { top: auto; bottom: 10px; }
}
@media (prefers-reduced-motion: reduce) { .loc .pin__r { animation: none; opacity: .35; transform: scale(1.6); } }

/* ---------- comodidades ---------- */
.amen__l { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }
/* cada comodidade é um cartão de verdade (v1.0065): borda visível, leve degradê, sombra em camadas e holofote que segue o dedo/mouse.
   O cartão no centro da tela ganha foco sozinho no celular (site.js: .is-focus); no computador é o :hover. */
.amen__i { position: relative; isolation: isolate; overflow: hidden; min-width: 0; display: grid; grid-template-columns: minmax(0, 1fr); row-gap: 10px; align-content: start; min-height: 92px; padding: 16px 16px 18px; border-radius: 24px;
  background: linear-gradient(180deg, #fff 0%, #f3f3f6 100%); border: 1px solid rgba(11, 11, 13, .09);
  box-shadow: 0 1px 0 rgba(255, 255, 255, .9) inset, 0 2px 4px -3px rgba(11, 11, 13, .3), 0 18px 34px -30px rgba(11, 11, 13, .55);
  transition: transform .5s var(--ch-ease), box-shadow .5s var(--ch-ease), border-color .4s, background .4s; }
.amen__i > * { position: relative; z-index: 3; }
/* holofote vermelho que segue o ponteiro (--mx/--my vêm do site.js) */
.amen__i::before { content: ''; position: absolute; top: -1px; right: -1px; bottom: -1px; left: -1px; z-index: 1; pointer-events: none; opacity: 0; transition: opacity .45s ease;
  background: radial-gradient(180px 180px at var(--mx, 50%) var(--my, 50%), rgba(234, 32, 37, .16), rgba(234, 32, 37, 0) 70%); }
.amen__i.is-focus::before, .amen__i:hover::before { opacity: 1; }
/* um brilho varre o cartão no instante em que ele entra em foco */
.amen__i::after { content: ''; position: absolute; top: -20%; bottom: -20%; left: -60%; width: 45%; z-index: 2; pointer-events: none; opacity: 0; transform: skewX(-14deg);
  background: linear-gradient(105deg, rgba(255, 255, 255, 0), rgba(255, 255, 255, .85), rgba(255, 255, 255, 0)); }
.amen__i.is-focus::after, .amen__i:hover::after { animation: amenSheen .95s var(--ch-ease) 1; }
@keyframes amenSheen { 0% { transform: translateX(0) skewX(-14deg); opacity: .9; } 100% { transform: translateX(388.89%) skewX(-14deg); opacity: 0; } } /* v1.0184: anda por transform (de -60% a 115% do cartão = 175/45 da largura do brilho) — antes "left" recalculava a página a cada quadro e contava como "layout shift" */
.amen__ic { position: relative; overflow: hidden; display: grid; place-items: center; width: 42px; height: 42px; border-radius: 50%; background: #fff; border: 1px solid rgba(11, 11, 13, .07);
  box-shadow: 0 1px 0 rgba(11, 11, 13, .04), 0 8px 16px -10px rgba(11, 11, 13, .45); transition: background .35s, transform .5s var(--ch-ease), box-shadow .5s, border-color .35s; }
.amen__ic svg { width: 22px; height: 22px; fill: none; stroke: var(--ch-ink); stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; transition: stroke .35s, transform .5s var(--ch-ease); }
.amen__t { display: grid; gap: 3px; min-width: 0; } .amen__t b { font: 700 .9375rem/1.2 var(--ch-body); letter-spacing: -.015em; -webkit-hyphens: auto; hyphens: auto; } .amen__t small { font-size: .75rem; line-height: 1.35; color: var(--ch-muted); }
.amen__i.is-focus, .amen__i:hover { background: linear-gradient(180deg, #fff 0%, #fff 100%); border-color: rgba(234, 32, 37, .22); transform: translateY(-5px);
  box-shadow: 0 1px 0 rgba(255, 255, 255, .9) inset, 0 4px 10px -6px rgba(11, 11, 13, .25), 0 34px 54px -34px rgba(11, 11, 13, .6); }
.amen__i.is-focus .amen__ic, .amen__i:hover .amen__ic { background: var(--ch-red); border-color: transparent; transform: scale(1.08); box-shadow: 0 10px 24px -12px rgba(234, 32, 37, .85), 0 0 0 6px rgba(234, 32, 37, .12); }
.amen__i.is-focus .amen__ic svg, .amen__i:hover .amen__ic svg { stroke: #fff; }
@media (prefers-reduced-motion: reduce) { .amen__i.is-focus::after, .amen__i:hover::after { animation: none; } }

/* ===== o cartão da INTERNET (v1.0065): fibra óptica de verdade correndo por dentro do cartão, sempre viva quando está na tela =====
   A luz corre nos 2 links, o texto fica num véu escuro (legível no celular e no computador) e a borda tem um anel que gira devagar. */
@property --ang { syntax: '<angle>'; inherits: false; initial-value: 0deg; }
.amen__hi { --ang: 0deg; grid-column: 1 / -1; grid-template-columns: 44px minmax(0, 1fr); column-gap: 14px; align-items: center; min-height: 184px; padding: 18px 18px 46px; color: #fff;
  border: 1px solid transparent;
  background-image: radial-gradient(130% 150% at 6% 0%, #191b20 0%, #0b0b0d 52%, #000 100%), conic-gradient(from var(--ang), rgba(234, 32, 37, .95), rgba(110, 200, 255, .75), rgba(234, 32, 37, .35), rgba(234, 32, 37, .95));
  background-origin: border-box; background-clip: padding-box, border-box;
  box-shadow: 0 1px 0 rgba(255, 255, 255, .07) inset, 0 40px 70px -44px rgba(0, 0, 0, .95); animation: amenRing 9s linear infinite; }
@keyframes amenRing { to { --ang: 360deg; } }
@media (prefers-reduced-motion: reduce) { .amen__hi { animation: none; } }
.amen__hi.is-focus, .amen__hi:hover { border-color: transparent; background-image: radial-gradient(130% 150% at 6% 0%, #202228 0%, #0b0b0d 52%, #000 100%), conic-gradient(from var(--ang), rgba(234, 32, 37, 1), rgba(110, 200, 255, .9), rgba(234, 32, 37, .45), rgba(234, 32, 37, 1)); transform: translateY(-5px); box-shadow: 0 1px 0 rgba(255, 255, 255, .1) inset, 0 50px 80px -48px rgba(234, 32, 37, .6), 0 40px 70px -44px rgba(0, 0, 0, .95); }
.amen__hi::before { background: radial-gradient(200px 200px at var(--mx, 50%) var(--my, 50%), rgba(234, 32, 37, .28), rgba(234, 32, 37, 0) 70%); }
.amen__hi .amen__ic { background: var(--ch-red); border-color: transparent; box-shadow: 0 12px 26px -12px rgba(234, 32, 37, .9), 0 0 0 6px rgba(234, 32, 37, .14); }
.amen__hi .amen__ic svg { stroke: #fff; animation: amenWave 2.4s var(--ch-ease) infinite; }
@keyframes amenWave { 0%, 60%, 100% { transform: scale(1); } 30% { transform: scale(1.12); } }
/* o ícone emite sinal: dois anéis saem do Wi-Fi sem parar */
.amen__hi .amen__ic { overflow: visible; }
.amen__hi .amen__ic::before, .amen__hi .amen__ic::after { content: ''; position: absolute; top: 0; right: 0; bottom: 0; left: 0; border-radius: 50%; border: 2px solid rgba(255, 74, 82, .6); pointer-events: none; animation: amenPing 2.6s var(--ch-ease) infinite; }
.amen__hi .amen__ic::after { animation-delay: 1.3s; }
@keyframes amenPing { 0% { transform: scale(1); opacity: .75; } 75% { transform: scale(2.1); opacity: 0; } 100% { transform: scale(2.1); opacity: 0; } }
@media (prefers-reduced-motion: reduce) { .amen__hi .amen__ic::before, .amen__hi .amen__ic::after { animation: none; opacity: 0; } }
.amen__hi .amen__t b { font-size: 1.0625rem; letter-spacing: -.02em; } .amen__hi .amen__t small { color: rgba(255, 255, 255, .82); font-size: .8125rem; }
.amen__hi .amen__t { text-shadow: 0 2px 6px rgba(0, 0, 0, .95), 0 0 18px rgba(0, 0, 0, .85); }
/* a fibra (canvas) e o véu que garante a leitura do texto por cima dela */
.amen__fx { position: absolute !important; top: 0; right: 0; bottom: 0; left: 0; z-index: 0 !important; width: 100%; height: 100%; opacity: 0; transition: opacity .6s ease; pointer-events: none;
  -webkit-mask-image: linear-gradient(180deg, rgba(0, 0, 0, .2) 0%, rgba(0, 0, 0, .34) 40%, #000 66%, #000 100%); mask-image: linear-gradient(180deg, rgba(0, 0, 0, .2) 0%, rgba(0, 0, 0, .34) 40%, #000 66%, #000 100%); }
.amen__hi.is-fx .amen__fx { opacity: 1; }
.amen__veil { position: absolute; top: 0; right: 0; bottom: 0; left: 0; z-index: 1; pointer-events: none; background: linear-gradient(180deg, rgba(0, 0, 0, .88) 0%, rgba(0, 0, 0, .74) 44%, rgba(0, 0, 0, .3) 74%, rgba(0, 0, 0, 0) 100%); }
/* selos: fibra óptica e os 2 links, com o ponto vivo pulsando */
.amen__tags { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 10px; }
.amen__tag { display: inline-flex; align-items: center; gap: 6px; padding: 5px 10px; border-radius: 999px; font: 800 .625rem/1 var(--ch-body); font-style: normal; letter-spacing: .1em; text-transform: uppercase; white-space: nowrap;
  background: rgba(255, 255, 255, .08); border: 1px solid rgba(255, 255, 255, .18); color: #fff; text-shadow: none; }
.amen__tag--fiber { background: var(--ch-red); border-color: transparent; box-shadow: 0 8px 18px -10px rgba(234, 32, 37, .9); }
.amen__tag em { width: 7px; height: 7px; border-radius: 50%; background: #2fd47a; box-shadow: 0 0 0 0 rgba(47, 212, 122, .75); animation: amenLive 1.9s ease-out infinite; }
.amen__tag:nth-of-type(3) em { animation-delay: .6s; }
@keyframes amenLive { 0% { box-shadow: 0 0 0 0 rgba(47, 212, 122, .7); } 70% { box-shadow: 0 0 0 7px rgba(47, 212, 122, 0); } 100% { box-shadow: 0 0 0 0 rgba(47, 212, 122, 0); } }
@media (prefers-reduced-motion: reduce) { .amen__tag em { animation: none; } .amen__hi .amen__ic svg { animation: none; } }
/* as cenas mínimas dentro do círculo dos outros ícones */
.amen__fx2 { position: absolute; top: 0; right: 0; bottom: 0; left: 0; opacity: 0; transition: opacity .45s ease; pointer-events: none; }
.amen__i:hover .amen__fx2, .amen__i.is-focus .amen__fx2, .amen__i.is-fx .amen__fx2 { opacity: 1; }
/* entram em cascata: um cartão atrás do outro (a cascata usa --i do markup) */
.amen__i.rv { transition-delay: calc(var(--i, 0) * 55ms); }

/* ---------- coworking: foto inteira à mostra; cartões embaixo — no celular deslizam (arraste), no computador viram fileira ---------- */
/* ===== COWORKING (v1.0068): tour por dentro. Fotos PARADAS (nada de zoom automático); quem troca é o hóspede. ===== */
.cow { position: relative; isolation: isolate; color: #fff; padding: 84px 0 calc(84px + env(safe-area-inset-bottom)); background: #0b0b0d; overflow: hidden; }
.cow__bg { position: absolute; top: 0; right: 0; bottom: 0; left: 0; z-index: -2; }
.cow__bg img { width: 100%; height: 100%; object-fit: cover; object-position: 50% 55%; filter: blur(26px) saturate(115%) brightness(.42); transform: scale(1.12); }
.cow::after { content: ""; position: absolute; top: 0; right: 0; bottom: 0; left: 0; z-index: -1; background: radial-gradient(90% 70% at 20% 10%, rgba(0, 0, 0, .55), rgba(0, 0, 0, .86) 60%, rgba(0, 0, 0, .95) 100%); }
.cow__in { width: 100%; max-width: 1200px; margin-left: auto; margin-right: auto; padding-left: 20px; padding-right: 20px; display: grid; grid-template-columns: minmax(0, 1fr); gap: 26px; }
.cow__head .lead { max-width: 24em; }
/* no celular a foto vem logo depois do título — é ela que chama a atenção */
.cow__in > .cow__head { order: 1; } .cow__in > .cow__tour { order: 2; } .cow__in > .cow__meta { order: 3; }
/* números que dão o tamanho do espaço num olhar */
.cow__spec { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); grid-auto-rows: 1fr; gap: 10px; } /* 1fr: as quatro caixas ficam exatamente da mesma altura */
.cow__spec li { min-height: 66px; padding: 14px 16px; border-radius: 18px; background: rgba(255, 255, 255, .07); border: 1px solid rgba(255, 255, 255, .14); -webkit-backdrop-filter: blur(10px); backdrop-filter: blur(10px); }
.cow__spec b { display: block; font: 900 1.75rem/1 var(--ch-display); letter-spacing: -.04em; }
.cow__spec--ic b { display: grid; place-items: center; width: 30px; height: 28px; } /* v1.0070: item com ícone (projetor) no lugar do número */
.cow__spec--ic svg { width: 28px; height: 28px; fill: none; stroke: #fff; stroke-width: 1.7; stroke-linecap: round; stroke-linejoin: round; }
.cow__spec span { display: block; margin-top: 3px; font-size: .8125rem; line-height: 1.3; color: rgba(255, 255, 255, .72); }
/* a internet, que é o diferencial */
.cow__net { display: grid; grid-template-columns: 44px minmax(0, 1fr); gap: 14px; align-items: center; margin-top: 12px; padding: 16px 18px; border-radius: 22px; background: rgba(255, 255, 255, .08); border: 1px solid rgba(255, 255, 255, .16); -webkit-backdrop-filter: blur(12px); backdrop-filter: blur(12px); box-shadow: inset 0 1px 0 rgba(255, 255, 255, .2); }
.cow__net-i { display: grid; place-items: center; width: 44px; height: 44px; border-radius: 14px; background: var(--ch-red); color: #fff; box-shadow: 0 12px 26px -12px rgba(234, 32, 37, .95), inset 0 1px 0 rgba(255, 255, 255, .4); }
.cow__net-i svg { width: 25px; height: 25px; fill: none; stroke: currentColor; stroke-width: 2.1; stroke-linecap: round; }
.cow__net-t { display: grid; gap: 3px; min-width: 0; } .cow__net-t b { font: 800 1.0625rem/1.2 var(--ch-display); letter-spacing: -.02em; } .cow__net-t b i { font-style: normal; color: #ff6166; } .cow__net-t small { font-size: .875rem; line-height: 1.4; color: rgba(255, 255, 255, .8); }
.cow__go { margin-top: 18px; }
/* v1.0130 — coworking: picker de pessoas */
.cow__book { margin-top: 18px; display: grid; gap: 14px; }
.cow__book .cow__go { margin-top: 0; justify-self: start; } .cow__price { margin: 0; font-size: .8125rem; line-height: 1.4; color: rgba(255, 255, 255, .72); } /* v1.0177 */
.cow__book-hd { display: flex; justify-content: space-between; align-items: center; font-size: .875rem; color: rgba(255,255,255,.6); }
.cow__book-hd b { color: #ff6166; font-weight: 800; font-size: .9375rem; }
.cow__pax { display: inline-flex; align-items: center; gap: 0; background: rgba(255,255,255,.08); border: 1px solid rgba(255,255,255,.18); border-radius: 999px; padding: 5px; -webkit-backdrop-filter: blur(10px); backdrop-filter: blur(10px); }
.cow__pax-btn { width: 46px; height: 46px; border-radius: 50%; background: rgba(255,255,255,.12); color: #fff; font-size: 1.5rem; font-weight: 300; display: grid; place-items: center; cursor: pointer; transition: background .18s; border: 0; line-height: 1; }
.cow__pax-btn:hover:not(:disabled) { background: rgba(255,255,255,.25); }
.cow__pax-btn:disabled { opacity: .22; cursor: default; }
.cow__pax-n { min-width: 88px; text-align: center; padding: 0 4px; }
.cow__pax-n b { display: block; font: 900 2.25rem/1 var(--ch-display); letter-spacing: -.04em; color: #fff; }
.cow__pax-n span { display: block; font-size: .8125rem; color: rgba(255,255,255,.6); margin-top: 2px; }
.cow__pax-total { font-size: .9375rem; color: rgba(255,255,255,.72); }
.cow__pax-total b { color: #fff; font-weight: 800; font-size: 1.125rem; }
.cow__book .cow__go { margin-top: 6px; }
/* o palco: a foto escolhida, em tamanho grande e nítida */
.cow__stage { position: relative; aspect-ratio: 4 / 5; border-radius: 30px; overflow: hidden; background: #111; border: 1px solid rgba(255, 255, 255, .16); box-shadow: 0 60px 110px -60px rgba(0, 0, 0, 1), inset 0 1px 0 rgba(255, 255, 255, .14); }
.cow__v { position: absolute; top: 0; right: 0; bottom: 0; left: 0; margin: 0; opacity: 0; visibility: hidden; transition: opacity .6s ease, visibility .6s; }
.cow__v.is-on { opacity: 1; visibility: visible; }
.cow__v img { width: 100%; height: 100%; object-fit: cover; }
.cow__v figcaption { position: absolute; left: 0; right: 0; bottom: 0; display: grid; gap: 3px; padding: 44px 20px 20px; background: linear-gradient(180deg, rgba(0, 0, 0, 0), rgba(0, 0, 0, .82) 60%, rgba(0, 0, 0, .92)); }
.cow__v figcaption b { font: 800 1.375rem/1.1 var(--ch-display); letter-spacing: -.025em; }
.cow__v figcaption small { font-size: .875rem; line-height: 1.4; color: rgba(255, 255, 255, .8); }
.cow__step { position: absolute; top: 14px; right: 14px; padding: 7px 12px; border-radius: 999px; background: rgba(0, 0, 0, .5); -webkit-backdrop-filter: blur(10px); backdrop-filter: blur(10px); border: 1px solid rgba(255, 255, 255, .18); font: 800 .75rem/1 var(--ch-body); letter-spacing: .04em; }
.cow__step i { font-style: normal; opacity: .55; }
/* as miniaturas */
.cow__thumbs { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); grid-auto-rows: 1fr; gap: 8px; margin-top: 10px; } /* uma coluna por foto do passeio: mudou o nº de fotos, mude aqui junto */
.cow__th { position: relative; overflow: hidden; display: grid; grid-template-rows: 74px minmax(0, 1fr); padding: 0; border: 1px solid rgba(255, 255, 255, .16); border-radius: 18px; background: rgba(255, 255, 255, .06); cursor: pointer; transition: border-color .35s, transform .4s var(--ch-ease), box-shadow .4s; -webkit-tap-highlight-color: transparent; }
.cow__th img { width: 100%; height: 74px; object-fit: cover; opacity: .55; transition: opacity .4s ease; }
.cow__th span { display: flex; align-items: center; justify-content: center; text-align: center; min-height: 38px; padding: 8px 6px; font: 700 .6875rem/1.2 var(--ch-body); color: rgba(255, 255, 255, .72); transition: color .35s; }
.cow__th:hover { transform: translateY(-3px); } .cow__th:hover img { opacity: .85; }
.cow__th.is-on { border-color: var(--ch-red); box-shadow: 0 0 0 1px var(--ch-red), 0 22px 40px -26px rgba(234, 32, 37, .9); }
.cow__th.is-on img { opacity: 1; } .cow__th.is-on span { color: #fff; }
.cow__th:focus-visible { outline: 3px solid var(--ch-red); outline-offset: 3px; }
@media (min-width: 700px) {
  .cow__spec { grid-template-columns: repeat(4, minmax(0, 1fr)); }
  .cow__in { padding-left: 36px; padding-right: 36px; } /* mesmo eixo do .wrap */
  .cow__stage { aspect-ratio: 16 / 11; }
  .cow__th { grid-template-rows: 92px minmax(0, 1fr); } .cow__th img { height: 92px; }
}
@media (min-width: 1024px) {
  .cow { padding: 140px 0; }
  .cow__in { grid-template-columns: minmax(0, 1fr) minmax(0, 1.05fr); grid-template-areas: "head tour" "meta tour"; gap: 26px 56px; align-content: center; padding-left: 36px; padding-right: 36px; }
  .cow__in > .cow__head { grid-area: head; align-self: end; } .cow__in > .cow__meta { grid-area: meta; align-self: start; } .cow__in > .cow__tour { grid-area: tour; align-self: center; }
  .cow__spec { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }
  .cow__stage { aspect-ratio: 4 / 3; }
  .cow__th img { height: 104px; }
}
@media (prefers-reduced-motion: reduce) { .cow__v { transition: none; } }


/* ---------- galeria em leque ---------- */
/* carrossel em leque: as fotos giram em torno de um ponto, como os raios do logotipo */
.fan { position: relative; margin-top: 56px; outline-offset: -4px; -webkit-user-select: none; user-select: none; }
.fan__stage { display: flex; gap: 14px; padding: 4px 20px 20px; overflow-x: auto; scroll-snap-type: x mandatory; scrollbar-width: none; }
.fan__stage::-webkit-scrollbar { display: none; }
.fan__c { position: relative; flex: none; width: min(68vw, 340px); aspect-ratio: 3 / 4; border-radius: 28px; overflow: hidden; scroll-snap-align: center; background: #ddd; }
.fan__c img { width: 100%; height: 100%; object-fit: cover; pointer-events: none; }
.fan__ui, .fan__rays { display: none; }
.fan.is-live { --w: min(66vw, 330px); --h: calc(var(--w) * 4 / 3); touch-action: pan-y; cursor: grab; }
.fan.is-live.is-drag { cursor: grabbing; }
.fan.is-live .fan__stage { display: block; position: relative; height: calc(var(--h) + 70px); padding: 0; overflow: visible; }
.fan.is-live .fan__c { position: absolute; left: 50%; top: 18px; width: var(--w); margin-left: calc(var(--w) / -2); transform-origin: 50% 245%; transform: rotate(calc(var(--d, 0) * 12.5deg)) scale(calc(1 - var(--ad, 0) * .045)); opacity: var(--o, 1); z-index: var(--zi, 1);
  filter: brightness(calc(1 - var(--ad, 0) * .16)) saturate(calc(1 - var(--ad, 0) * .12)); box-shadow: 0 40px 70px -40px rgba(11, 11, 13, .7), 0 0 0 1px rgba(11, 11, 13, .06); will-change: transform; }
.fan.is-live .fan__c.is-front { box-shadow: 0 50px 80px -36px rgba(11, 11, 13, .75), 0 0 0 1px rgba(11, 11, 13, .06); }
.fan.is-live .fan__ui { display: flex; align-items: center; justify-content: center; gap: 18px; margin-top: 8px; padding-left: 20px; padding-right: 20px; }
.fan__b { display: grid; place-items: center; width: 52px; height: 52px; flex: none; border-radius: 50%; border: 0; background: var(--ch-mist); color: var(--ch-ink); cursor: pointer; transition: background .2s, transform .2s; }
.fan__b:hover { background: var(--ch-ink); color: #fff; }
.fan__b:active { transform: scale(.92); }
.fan__t { display: grid; justify-items: center; gap: 2px; min-width: 11.5em; text-align: center; }
.fan__t b { font: 800 1.25rem/1.2 var(--ch-display); letter-spacing: -.02em; }
.fan__t span { font-size: .8125rem; font-weight: 700; letter-spacing: .14em; color: var(--ch-muted); font-variant-numeric: tabular-nums; }
.fan__t i { font-style: normal; color: var(--ch-red); }
.fan.is-live .fan__rays { display: flex; justify-content: center; align-items: flex-end; gap: 0; height: 34px; margin-top: 14px; }
.fan__rays i { width: 3px; height: 22px; margin: 0 5px; border-radius: 2px; background: rgba(11, 11, 13, .16); transform-origin: 50% 300%; transform: rotate(calc(var(--k) * 9deg)); transition: background .3s, height .3s; }
.fan__rays i.is-on { background: var(--ch-red); height: 30px; }

/* ---------- bom saber ---------- */
.know { background: var(--ch-mist); }
.know__in { display: grid; gap: 36px; }
.times { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; margin-top: 28px; }
.times div { padding: 18px 20px; border-radius: 22px; background: #fff; }
.times dt { font-size: .75rem; font-weight: 700; letter-spacing: .18em; text-transform: uppercase; color: var(--ch-red); }
.times dd { font: 800 1.875rem/1.2 var(--ch-display); letter-spacing: -.03em; margin-top: 6px; white-space: nowrap; }
.times small { font-size: 1rem; font-weight: 500; color: var(--ch-muted); letter-spacing: 0; }
.faq { display: grid; gap: 10px; align-content: start; }
.faq details { background: #fff; border-radius: 22px; padding: 0 20px; }
.faq summary { list-style: none; display: flex; align-items: center; justify-content: space-between; gap: 16px; min-height: 68px; padding: 12px 0; cursor: pointer; font-weight: 700; font-size: 1.0625rem; line-height: 1.35; }
.faq summary::-webkit-details-marker { display: none; }
.faq summary::after { content: ""; flex: none; width: 32px; height: 32px; border-radius: 50%; background: linear-gradient(var(--ch-ink), var(--ch-ink)) center / 12px 2px no-repeat, linear-gradient(var(--ch-ink), var(--ch-ink)) center / 2px 12px no-repeat, var(--ch-mist); transition: transform .3s var(--ch-ease); }
.faq details[open] summary::after { transform: rotate(45deg); }
.faq p { padding: 0 0 20px; color: var(--ch-ink-2); max-width: 38em; }

/* ---------- contato ---------- */
.contact__in { display: grid; gap: 32px; }
.contact address { font-style: normal; display: grid; margin-top: 24px; }
.contact address a { display: flex; align-items: center; min-height: 56px; font-size: 1.125rem; font-weight: 500; text-decoration: none; border-bottom: 1px solid var(--ch-line); padding: 8px 0; line-height: 1.4; }
.contact address a:hover { color: var(--ch-red); }
.contact__a { display: grid; gap: 12px; margin-top: 28px; }
.contact__map { border-radius: 30px; overflow: hidden; min-height: 340px; background: #e9e6e4; }
/* mapa próprio (v1.0041): zoom na quadra, sem comércios, só o pino do hotel */
.map { position: relative; isolation: isolate; min-height: 380px; background: #eef0f1; }
.map__tiles { position: absolute; left: 50%; top: 50%; width: 1280px; height: 1280px; transform: translate(calc(var(--cx) * -1), calc(var(--cy) * -1)); filter: grayscale(.6) contrast(1.04) brightness(1.03); } /* tom sóbrio, no padrão do site */
.map__tiles img { position: absolute; width: 256px; height: 256px; }
.map::after { content: ""; position: absolute; top: 0; right: 0; bottom: 0; left: 0; pointer-events: none; box-shadow: inset 0 0 0 1px rgba(11, 11, 13, .06), inset 0 0 80px rgba(11, 11, 13, .06); }
.map__pin { position: absolute; left: 50%; top: 50%; z-index: 2; display: grid; justify-items: center; gap: 6px; transform: translate(-50%, -100%); pointer-events: none; text-align: center; }
.map__pin i { order: 3; width: 18px; height: 18px; border-radius: 50%; background: var(--ch-red); border: 3px solid #fff; box-shadow: 0 0 0 4px rgba(234, 32, 37, .28), 0 8px 18px -6px rgba(0, 0, 0, .5); position: relative; }
.map__pin i::after { content: ""; position: absolute; top: -12px; right: -12px; bottom: -12px; left: -12px; border-radius: 50%; border: 2px solid rgba(234, 32, 37, .55); animation: pulse-r 1.8s ease-out infinite; }
@keyframes pulse-r { from { transform: scale(.5); opacity: 1; } to { transform: scale(1.6); opacity: 0; } }
.map__pin b { display: block; padding: 8px 12px 6px; border-radius: 16px; background: #fff; box-shadow: 0 10px 30px -14px rgba(0, 0, 0, .45), 0 0 0 1px rgba(11, 11, 13, .06); } .map__pin b img { height: 34px; width: auto; display: block; }
.map__pin span { font-size: .75rem; font-weight: 700; color: var(--ch-ink); background: rgba(255, 255, 255, .92); padding: 3px 8px; border-radius: 8px; }
.map__go { position: absolute; left: 14px; right: 14px; bottom: 14px; z-index: 2; display: flex; gap: 8px; flex-wrap: wrap; } .map__go .glass { flex: 1 1 auto; min-height: 46px; padding: 0 16px; font-size: .9375rem; text-decoration: none; justify-content: center; }
.map__cr { position: absolute; right: 10px; top: 8px; z-index: 2; font-size: .625rem; color: rgba(11, 11, 13, .55); background: rgba(255, 255, 255, .7); padding: 2px 6px; border-radius: 6px; }

/* ---------- fecho ---------- */
.end { position: relative; overflow: hidden; isolation: isolate; padding: 110px 0; color: #fff; background: var(--ch-red-deep); text-align: center; }
.end__rays { display: none; }
.mega--end { font-size: max(3rem, min(13vw, 8rem)); }
.end__cta { margin-top: 36px; min-height: 64px; padding: 0 36px; font-size: 1.125rem; --g-tint: rgba(255, 255, 255, .96); }

/* ---------- rodapé ---------- */
.foot { padding: 40px 0 calc(120px + env(safe-area-inset-bottom)); }
.foot__in { display: grid; gap: 22px; }
.foot .brand { margin: 0; }
.foot .brand__logo { height: 84px; }
.foot__nav { display: flex; flex-wrap: wrap; gap: 0 22px; }
.foot__nav a { display: inline-flex; align-items: center; min-height: 44px; text-decoration: none; color: var(--ch-ink-2); }
.foot__nav a:hover { color: var(--ch-red); }
/* v1.0146: rodapé vertical premium — empilhado, centralizado, compacto e super responsivo */
.foot__b {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: max(4px, min(0.8vw, 8px));
  margin-top: max(14px, min(2vw, 22px));
  padding: max(12px, min(2vw, 20px)) max(12px, min(3vw, 24px)) 0;
  border-top: 1px solid var(--ch-line);
  color: var(--ch-muted);
  text-align: center;
  box-sizing: border-box;
  max-width: 100%;
}
.foot__b p, .foot__b a, .foot__b small {
  font-size: max(0.625rem, min(1.3vw, 0.8125rem));
  line-height: 1.4;
  letter-spacing: 0.01em;
  margin: 0;
  max-width: 100%;
}
.foot__b a { text-underline-offset: 3px; }

/* Linha 1: copyright/CNPJ */
.foot__copy {
  font-variant-numeric: tabular-nums;
  text-wrap: balance;
  word-break: normal;
  overflow-wrap: anywhere;
  -webkit-hyphens: auto;
  hyphens: auto;
  max-width: min(100%, 60ch);
}

/* Linha 2: links (separados por ponto) */
.foot__links {
  display: inline-flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: center;
  gap: max(2px, min(0.6vw, 4px)) max(8px, min(2vw, 14px));
  font-weight: 600;
}
.foot__links span[aria-hidden] {
  color: var(--ch-line-strong);
  font-weight: 400;
  font-size: 0.85em;
}
.foot__links .foot__v {
  font-variant-numeric: tabular-nums;
  letter-spacing: 0.04em;
  opacity: 0.8;
}

/* Separador elegante entre links e assinatura */
.dev-sign--premium {
  margin-top: max(1px, min(0.3vw, 2px));
  padding-top: max(6px, min(1vw, 10px));
  border-top: 1px dashed var(--ch-line-strong);
  position: relative;
  max-width: 100%;
}
.dev-sign--premium::before {
  content: "";
  position: absolute;
  top: -3px;
  left: 50%;
  transform: translateX(-50%);
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background: var(--ch-red);
  box-shadow: 0 0 0 3px var(--ch-paper), 0 0 0 4px var(--ch-red-soft);
}

.dev-sign {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  font-size: inherit;
  letter-spacing: 0.02em;
  opacity: 0.82;
  color: inherit;
  transition: opacity 0.2s;
  white-space: nowrap;
}
.dev-sign:hover { opacity: 1; }

.dev-sign--premium {
  display: inline-flex;
  flex-direction: column;
  align-items: center;
  gap: max(1px, min(0.3vw, 3px));
  padding: max(1px, min(0.3vw, 3px)) max(4px, min(1vw, 8px));
  text-decoration: none;
  color: inherit;
  letter-spacing: 0.01em;
  transition: transform 0.2s;
  max-width: 100%;
}
.dev-sign--premium:hover { transform: translateY(-1px); }

.dev-sign__by {
  font: 600 max(0.5625rem, min(1vw, 0.625rem))/1 var(--ch-body);
  letter-spacing: 0.18em;
  text-transform: uppercase;
  color: var(--ch-muted);
  opacity: 0.75;
  white-space: nowrap;
}
.dev-sign__co {
  font: 800 max(0.75rem, min(1.8vw, 0.9375rem))/1 var(--ch-display);
  letter-spacing: -0.015em;
  color: var(--ch-ink);
  white-space: nowrap;
  position: relative;
  text-align: center;
}
.dev-sign__co::after {
  content: "";
  position: absolute;
  left: -8px;
  right: -8px;
  bottom: -3px;
  height: 1.5px;
  background: linear-gradient(90deg, rgba(234, 32, 37, 0) 0%, var(--ch-red) 50%, rgba(234, 32, 37, 0) 100%);
  transform: scaleX(0.5);
  transition: transform 0.3s;
}
.dev-sign--premium:hover .dev-sign__co::after { transform: scaleX(1); }
.dev-sign__pe {
  font: 500 max(0.625rem, min(1.2vw, 0.75rem))/1 var(--ch-body);
  color: var(--ch-muted);
  font-style: italic;
  white-space: nowrap;
}

/* WhatsApp em chip dedicado na linha de baixo */
.dev-sign__wa {
  display: inline-flex;
  align-items: center;
  gap: max(5px, min(1vw, 7px));
  padding: max(3px, min(0.8vw, 5px)) max(10px, min(2vw, 14px)) max(3px, min(0.8vw, 5px)) max(7px, min(1.5vw, 9px));
  margin-top: max(2px, min(0.5vw, 3px));
  border-radius: 999px;
  background: linear-gradient(135deg, #25d366 0%, #1ebe57 100%);
  color: #fff !important;
  font: 700 max(0.6875rem, min(1.5vw, 0.8125rem))/1 var(--ch-body);
  letter-spacing: 0.01em;
  box-shadow: 0 4px 14px -3px rgba(37, 211, 102, 0.55), inset 0 1px 0 rgba(255, 255, 255, 0.22);
  transition: transform 0.2s, box-shadow 0.2s;
  white-space: nowrap;
  max-width: 100%;
}
.dev-sign--premium:hover .dev-sign__wa {
  transform: translateY(-1px) scale(1.04);
  box-shadow: 0 8px 20px -4px rgba(37, 211, 102, 0.7), inset 0 1px 0 rgba(255, 255, 255, 0.28);
}
.dev-sign__wa svg {
  flex: none;
  display: block;
  width: max(12px, min(2vw, 14px));
  height: max(12px, min(2vw, 14px));
}
.dev-sign__ph { font-variant-numeric: tabular-nums; }

@media (max-width: 380px) {
  .foot__b { gap: 4px; padding: 10px 8px 0; }
  .foot__links { gap: 2px 6px; }
  .dev-sign__by { letter-spacing: 0.14em; }
  .dev-sign__wa { letter-spacing: 0; }
}
@media (max-width: 360px) {
  .foot__copy { font-size: 0.625rem; }
  .dev-sign__co { font-size: 0.75rem; }
  .dev-sign__pe { font-size: 0.625rem; }
  .dev-sign__wa { font-size: 0.6875rem; padding: 3px 9px 3px 6px; }
}

/* ========== Rodapé: Assinatura SRMAX (v1.0233+) ========== */
.lp-rodape__credito {
  display: inline-flex;
  flex-wrap: wrap;
  align-items: center;
  column-gap: 8px;
  row-gap: 2px;
  min-height: 44px;
  color: #000;
  font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
  font-size: 13px;
  line-height: 1.5;
}

.lp-rodape__credito b {
  color: #000;
  font-weight: 600;
}

.lp-rodape__credito-zap {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  white-space: nowrap;
}

.lp-rodape__credito-zap svg {
  flex: none;
}

/* v1.0288: SO o nome da SRMAX e clicavel (abre o site). O WhatsApp e apenas informacao. */
.lp-rodape__credito .lp-rodape__site {
  color: #000;
  font-size: inherit;
  font-weight: 600;
  text-decoration: underline;
  text-decoration-thickness: 1px;
  text-underline-offset: 3px;
  text-decoration-color: rgba(0, 0, 0, .45);
  cursor: pointer;
  pointer-events: auto;
  -webkit-touch-callout: none;
  transition: color .2s, text-decoration-color .2s;
}

.lp-rodape__credito .lp-rodape__site:hover,
.lp-rodape__credito .lp-rodape__site:focus-visible {
  color: var(--ch-red);
  text-decoration-color: var(--ch-red);
}

.lp-rodape__credito-zap,
.lp-rodape__credito-zap * {
  pointer-events: none;
  -webkit-touch-callout: none;
}

.lp-rodape__credito-zap a {
  color: inherit;
  text-decoration: none;
  cursor: default;
}

@media (max-width: 779.98px) {
  .lp-rodape__credito {
    justify-content: center;
  }
}

/* ---------- barra de abas (celular) ---------- */
.tabbar { position: fixed; z-index: 120; left: 10px; right: 10px; bottom: calc(10px + env(safe-area-inset-bottom)); display: grid; grid-template-columns: 1fr 1fr 1.25fr 1fr 1fr; align-items: center; height: 68px; padding: 0 6px; border-radius: 34px; background: rgba(22, 22, 24, .72); border: 1px solid rgba(255, 255, 255, .16); -webkit-backdrop-filter: blur(26px) saturate(190%); backdrop-filter: blur(26px) saturate(190%); box-shadow: 0 24px 50px -18px rgba(0, 0, 0, .6), inset 0 1px 0 rgba(255, 255, 255, .18); transition: transform .45s var(--ch-ease); }
.tabbar a, .tabbar button { display: grid; justify-items: center; gap: 3px; min-height: 56px; align-content: center; border: 0; background: none; padding: 0; border-radius: 22px; text-decoration: none; color: rgba(255, 255, 255, .66); font: 600 .625rem/1 var(--ch-body); letter-spacing: .02em; cursor: pointer; -webkit-tap-highlight-color: transparent; transition: color .25s; }
.tabbar svg { width: 24px; height: 24px; fill: none; stroke: currentColor; stroke-width: 1.7; stroke-linecap: round; stroke-linejoin: round; }
.tabbar a.is-on { color: #fff; }
.tabbar a.is-on svg { stroke: var(--ch-red-bright); }
.tabbar__go { position: relative; top: -14px; width: 66px; height: 66px; min-height: 66px !important; margin-left: auto; margin-right: auto; border-radius: 50% !important; color: #fff !important; background: linear-gradient(180deg, rgba(255, 255, 255, .3), rgba(255, 255, 255, 0) 50%, rgba(0, 0, 0, .14)), var(--ch-red) !important; box-shadow: 0 14px 28px -8px rgba(234, 32, 37, .8), inset 0 1px 0 rgba(255, 255, 255, .55), 0 0 0 5px rgba(22, 22, 24, .72); gap: 1px !important; }
.tabbar__go svg { width: 26px; height: 26px; }
.tabbar__go span { font-size: .5625rem; }
.tabbar__go:active { transform: scale(.94); }
html.chb-lock .tabbar { transform: translateY(160%); }

/* ---------- aparição ao rolar ---------- */
.rv { opacity: 0; transform: translateY(28px); transition: opacity .9s var(--ch-ease), transform .9s var(--ch-ease); transition-delay: var(--d, 0s); }
.rv.is-in { opacity: 1; transform: none; }

/* =================== ≥ 700px =================== */
@media (min-width: 700px) {
  .wrap { padding-left: 36px; padding-right: 36px; }
  .sec { padding: 110px 0; }
  .cow { padding: 110px 0 calc(110px + env(safe-area-inset-bottom)); } .story__pin { padding: 110px 0; } /* mesmo respiro das seções irmãs */
  .rooms__l { padding-left: 36px; padding-right: 36px; gap: 20px; }
  .amen__l { grid-template-columns: repeat(3, minmax(0, 1fr)); } .amen__hi { grid-column: span 2; }
  .amen__i { grid-template-columns: 42px minmax(0, 1fr); column-gap: 12px; align-items: center; padding: 16px 16px 16px 14px; } .amen__hi { min-height: 168px; padding-bottom: 42px; }
  .contact__a { grid-template-columns: auto auto; justify-content: start; }
  .access .glass { width: auto; }
  .scene__line { padding: 0 36px; }
  .scene__book .chb-shell { grid-template-columns: 1fr 1fr 1fr; }
  .scene__book .chb-f[data-ch-guests] { display: flex; }
  .bento { grid-template-columns: 1fr 1fr; }
  .wx, .d3, .loc { grid-column: 1 / -1; } /* v1.0189: sem o jornal na grade, o mapa ocupa a linha inteira */
  .d3__l { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .day__n { min-width: 0; }
}

/* =================== ≥ 1024px =================== */
@media (min-width: 1024px) {
  html { scroll-padding-top: 96px; }
  .top { padding-top: 14px; }
  .top__in { height: 74px; gap: 28px; padding: 0 12px 0 26px; }
  .brand__logo { height: 58px; }
  .nav { display: flex; gap: 2px; margin-left: auto; margin-right: auto; }
  .nav a { display: inline-flex; align-items: center; min-height: 40px; padding: 0 16px; border-radius: 999px; font: 600 .9375rem/1 var(--ch-body); text-decoration: none; transition: background .2s; }
  .nav a:hover { background: rgba(11, 11, 13, .07); }
  .nav a.is-active { background: var(--ch-ink); color: #fff; }
  .top__wa { display: none; }
  .brand { margin-right: 0; }
  .tabbar { display: none; }
  .foot { padding-bottom: 40px; }
  .foot__in { grid-template-columns: auto 1fr; align-items: center; gap: 48px; }
  .foot__nav { justify-content: flex-end; }

  .scene__line { min-height: 80vh; } .scene__line--end { min-height: 100vh; }
  .scene__img { transform-origin: 78% 47%; }
  .scene__img img { object-position: 50% 42%; }
  .scene__shade { background: rgba(0, 0, 0, .7); }
  .scene__a { padding-bottom: 64px; padding-top: 120px; }
  .scene .mega { font-size: max(4.25rem, min(7.4vw, 8.25rem)); }
  .scene__sub { font-size: 1.375rem; margin-top: 26px; }
  .scene__book { margin-top: 40px; max-width: 1040px; }
  .scene__book .chb-shell { grid-template-columns: 1fr 1fr 1fr auto; }
  .scene__book .chb-go { grid-column: auto; }
  .scene__book .chb-f { min-height: 60px; padding-left: 22px; padding-right: 22px; gap: 14px; }
  .scene__hint { display: block; bottom: 22px; left: auto; right: 36px; transform: none; font-size: .6875rem; font-weight: 700; letter-spacing: .24em; text-transform: uppercase; color: rgba(255, 255, 255, .7); opacity: var(--a, 1); writing-mode: vertical-rl; }
  .scene__hint::after { content: ""; display: block; width: 1px; height: 46px; margin: 12px auto 0; background: linear-gradient(#fff, rgba(255, 255, 255, 0)); animation: hint 1.8s ease-in-out infinite; transform-origin: top; }
  @keyframes hint { 0% { transform: scaleY(0); } 60% { transform: scaleY(1); opacity: 1; } 100% { transform: scaleY(1); opacity: 0; } }

  .sec { padding: 140px 0; }
  .story__pin { padding: 140px 0; }
  .sec__h { margin-bottom: 56px; }
  .rooms { padding-bottom: 120px; }
  .rooms__l { display: grid; grid-template-columns: repeat(auto-fit, minmax(0, 1fr)); grid-auto-flow: column; grid-auto-columns: minmax(0, 1fr); max-width: 1200px; margin-left: auto; margin-right: auto; overflow: visible; padding: 0 36px; gap: 22px; }
  .room { width: auto; }
  .room__t b { font-size: 1.875rem; }
  .access__in { grid-template-columns: 1fr minmax(0, 460px); gap: 90px; align-items: center; }
  .bento { grid-template-columns: 1.25fr 1fr 1fr; grid-template-rows: auto auto; gap: 18px; }
  /* computador: clima (altura natural) e localização na coluna da esquerda; a agenda, que é alta, ocupa as duas linhas da direita */
  .wx { grid-column: 1; grid-row: 1; align-self: start; min-height: 540px; padding: 32px; }
  /* v1.0189: o jornal saiu da grade (largura inteira, logo abaixo) — o mapa ocupa as duas colunas ao lado do clima, com a mesma altura */
  .loc { grid-column: 2 / 4; grid-row: 1; align-self: stretch; }
  .d3 { grid-column: 1 / -1; grid-row: 2; margin-top: 18px; }
  .d3__l { gap: 18px; } .day { padding: 22px 22px 18px; gap: 12px; } .day__c { margin: 0 -22px; height: 76px; } .day__n b { font-size: 1.625rem; } .day__t { font-size: 3.75rem; }
  .wx__t { font-size: 11rem; }
  .amen__l { grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 12px; } .amen__hi { grid-column: span 2; }
  .amen__i { min-height: 104px; padding: 18px 20px 18px 16px; grid-template-columns: 46px minmax(0, 1fr); } .amen__ic { width: 46px; height: 46px; } .amen__t b { font-size: 1rem; } .amen__t small { font-size: .8125rem; }
  /* no computador o texto fica à esquerda: o véu escurece esse lado e a fibra corre livre à direita */
  .amen__hi { min-height: 186px; padding: 22px 24px 48px; grid-template-columns: 52px minmax(0, 1fr); column-gap: 16px; } .amen__hi .amen__ic { width: 52px; height: 52px; } .amen__hi .amen__ic svg { width: 26px; height: 26px; }
  .amen__hi .amen__t b { font-size: 1.1875rem; } .amen__hi .amen__t small { font-size: .875rem; max-width: 34em; }
  .amen__veil { background: radial-gradient(115% 150% at 0% 42%, rgba(0, 0, 0, .95) 0%, rgba(0, 0, 0, .88) 36%, rgba(0, 0, 0, .4) 60%, rgba(0, 0, 0, 0) 84%); }
  .amen__fx { -webkit-mask-image: radial-gradient(115% 150% at 0% 42%, rgba(0, 0, 0, .22) 0%, rgba(0, 0, 0, .34) 38%, rgba(0, 0, 0, .8) 62%, #000 82%); mask-image: radial-gradient(115% 150% at 0% 42%, rgba(0, 0, 0, .22) 0%, rgba(0, 0, 0, .34) 38%, rgba(0, 0, 0, .8) 62%, #000 82%); }
  .about__c { grid-template-columns: 1fr 1fr; gap: 48px; margin-top: 28px; }
  .about__c .lead { max-width: none; }
  .fan { margin-top: 90px; }
  .fan.is-live { --w: 380px; }
  .fan.is-live .fan__c { transform-origin: 50% 270%; transform: rotate(calc(var(--d, 0) * 11deg)) scale(calc(1 - var(--ad, 0) * .04)); }
  .know__in, .contact__in { grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); gap: 80px; }
  .contact__in { align-items: stretch; }
  .end { padding: 180px 0; }
}

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after { animation: none !important; transition: none !important; }
  .rv { opacity: 1; transform: none; }
  .scene__hint { display: none; }
}
html.no-scene .scene__hint { display: none; }

/* ---------- atendimento + status ao vivo ---------- */
.desk__in { display: grid; gap: 36px; }
.desk__v { position: relative; border-radius: 32px; overflow: hidden; aspect-ratio: 4 / 5; background: #e9e6e4; }
.desk__v img { width: 100%; height: 100%; object-fit: cover; object-position: 50% 62%; }
.desk__v figcaption { position: absolute; left: 14px; bottom: 14px; display: inline-flex; align-items: center; gap: 10px; padding: 10px 16px; border-radius: 999px; font-size: .9375rem; font-weight: 600; color: #fff; background: rgba(11, 11, 13, .5); border: 1px solid rgba(255, 255, 255, .28); -webkit-backdrop-filter: blur(14px); backdrop-filter: blur(14px); }
.st__dot { flex: none; width: 10px; height: 10px; border-radius: 50%; background: #b9b9be; }
.is-on > .st__dot, .is-on .st__dot { background: #2fd47a; animation: pulse 2s infinite; }
.hours { display: grid; gap: 10px; margin: 28px 0 30px; }
.hours li { display: grid; grid-template-columns: auto minmax(0, 1fr) auto; align-items: center; gap: 14px; min-height: 76px; padding: 12px 18px; border-radius: 22px; background: var(--ch-mist); }
.hours b { display: block; font: 800 1.0625rem/1.3 var(--ch-display); letter-spacing: -.01em; }
.hours small { color: var(--ch-muted); font-size: .9375rem; }
.hours em { font-style: normal; font-size: .75rem; font-weight: 800; letter-spacing: .1em; text-transform: uppercase; color: var(--ch-muted); white-space: nowrap; }
.hours li.is-on em { color: #12804a; }
.desk .glass { width: 100%; }
/* WhatsApp fora do horário: cinza em todo o site (continua clicável; a resposta vem quando voltar) */
html.wa-off .glass--wa { --g-tint: rgba(128, 128, 134, .92); --g-glow: rgba(60, 60, 66, .35); }
html.wa-off .top__wa, html.wa-off .tabbar a[data-wa] { color: #9a9aa0; }
html:not(.wa-off) .top__wa { color: #1faa55; }
html:not(.wa-off) .tabbar a[data-wa] svg { stroke: #25d366; }
@media (min-width: 700px) { .desk .glass { width: auto; } }
@media (min-width: 1024px) { .desk__in { grid-template-columns: minmax(0, 440px) 1fr; gap: 90px; align-items: center; } }
.fan { overflow-x: clip; padding-bottom: 8px; }
.fan.is-live .fan__ui { position: relative; z-index: 200; width: max-content; max-width: calc(100% - 24px); margin: 14px auto 0; padding: 8px; border-radius: 999px; background: rgba(255, 255, 255, .86); -webkit-backdrop-filter: blur(18px) saturate(180%); backdrop-filter: blur(18px) saturate(180%); box-shadow: 0 20px 40px -24px rgba(11, 11, 13, .5), 0 0 0 1px rgba(11, 11, 13, .06); }
.fan.is-live .fan__rays { position: relative; z-index: 200; }
@media (min-width: 1024px) { .fan.is-live .fan__stage { height: calc(var(--h) + 110px); } }

/* ---------- entrada: a porta da rua abre com o rosto ---------- */
/* ================= ENTRADA v1.0041: a porta real do hotel — o rosto é escaneado, a porta abre e você entra no corredor =================
 * Toda a geometria (enquadramento da foto, porta, scanner, feixe e o "caminhar" para dentro) é calculada em JS a cada tela:
 * o corredor visto pela porta termina alinhado pixel a pixel com a foto da capa, então a entrada emenda no site sem corte. */
.gate { position: fixed; top: 0; right: 0; bottom: 0; left: 0; z-index: 3000; overflow: hidden; background: #050506; color: #fff; cursor: pointer; transition: opacity .55s ease, visibility 0s linear .55s; --sz: 260px; --sx: 50vw; --sy: 45vh; --ok: #2fd47a; --scan: #ea2025; }
html.no-gate .gate { display: none; }
.gate.is-gone { opacity: 0; visibility: hidden; pointer-events: none; }
.gate__bg { position: absolute; top: -8%; right: -8%; bottom: -8%; left: -8%; background-position: center; background-size: cover; filter: blur(34px) brightness(var(--bgb, .4)) saturate(1.1); opacity: 0; transition: opacity 1.2s ease; }
.gate.is-live .gate__bg { opacity: 1; }
.gate__frame { position: absolute; left: 0; top: 0; width: 100px; height: 100px; perspective: 1400px; opacity: 0; transform: scale(1.05); transition: opacity 1s ease, transform 2.6s cubic-bezier(.2, .6, .2, 1); will-change: transform; }
.gate.is-live .gate__frame { opacity: 1; transform: none; }
.gate__frame.is-narrow { -webkit-mask-image: linear-gradient(90deg, transparent, #000 12%, #000 88%, transparent); mask-image: linear-gradient(90deg, transparent, #000 12%, #000 88%, transparent); }
.gate__frame.is-short:not(.is-narrow) { -webkit-mask-image: linear-gradient(180deg, transparent, #000 14%); mask-image: linear-gradient(180deg, transparent, #000 14%); }
.gate__frame.is-narrow.is-short { -webkit-mask-image: linear-gradient(90deg, transparent, #000 12%, #000 88%, transparent), linear-gradient(180deg, transparent, #000 14%); -webkit-mask-composite: source-in; mask-image: linear-gradient(90deg, transparent, #000 12%, #000 88%, transparent), linear-gradient(180deg, transparent, #000 14%); mask-composite: intersect; }
.gate__wall { position: absolute; top: 0; right: 0; bottom: 0; left: 0; background-position: center; background-size: 100% 100%; background-repeat: no-repeat; filter: brightness(var(--w0, .62)); transition: filter 1s ease; }
.gate.is-live .gate__wall { filter: brightness(var(--w1, .78)); }
.gate.is-open .gate__wall { filter: brightness(var(--w2, .9)); }
/* v1.0100: cada fase do dia tem a sua exposição — de dia a foto aparece CLARA como o dia (antes toda foto era escurecida igual, e manhã parecia fim de tarde) */
.gate--f-manha, .gate--f-tarde { --w0: .82; --w1: 1; --w2: 1.04; --bgb: .5; }
.gate--f-entardecer { --w0: .8; --w1: .98; --w2: 1.02; --bgb: .46; }
.gate--f-amanhecer, .gate--f-por-do-sol { --w0: .78; --w1: .96; --w2: 1.02; --bgb: .44; }
.gate--f-anoitecer { --w0: .8; --w1: 1; --w2: 1.06; }
.gate__way, .gate__leaf { position: absolute; left: var(--ll); top: var(--lt); width: var(--lw); height: var(--lh); -webkit-clip-path: var(--clip); clip-path: var(--clip); }
.gate__way { background-color: #000; overflow: hidden; filter: brightness(.12) saturate(1.1); transition: filter 1.2s ease; }
/* o corredor da capa, do tamanho da tela: visto pela porta e mantido parado enquanto a porta cresce (paralaxe real: perto corre, longe fica) */
.gate__far { position: absolute; left: 0; top: 0; width: 100px; height: 100px; max-width: none; object-fit: cover; transform-origin: 0 0; will-change: transform; pointer-events: none; }
.gate__way::after { content: ""; position: absolute; top: 0; right: 0; bottom: 0; left: 0; background: radial-gradient(70% 55% at 55% 45%, rgba(255, 200, 130, .32), rgba(255, 200, 130, 0) 70%), linear-gradient(90deg, rgba(0, 0, 0, .55), transparent 30%); transition: opacity 1.2s ease; }
.gate.is-open .gate__way { filter: brightness(1) saturate(1); }
.gate.is-in .gate__way::after { opacity: 0; }
.gate__leaf { background-repeat: no-repeat; background-color: #111; background-position: var(--bx) 100%; background-size: var(--bs) auto; transform-origin: 0 50%; transform: rotateY(0deg); transition: transform 1.35s cubic-bezier(.45, 0, .15, 1), filter 1.35s ease, opacity .45s ease; box-shadow: inset -6px 0 12px rgba(0, 0, 0, .35); }
.gate.is-open .gate__leaf { transform: rotateY(-80deg); filter: brightness(.5); }
.gate.is-in .gate__leaf { opacity: 0; }
.gate__spill { position: absolute; left: calc(var(--ll) - var(--lw) * .85); top: var(--lt); width: calc(var(--lw) * 2.7); height: var(--lh); pointer-events: none; mix-blend-mode: screen; opacity: 0; background: radial-gradient(50% 58% at 50% 64%, rgba(255, 196, 120, .5), rgba(255, 170, 90, .14) 46%, rgba(255, 170, 90, 0) 72%); transition: opacity 1.4s ease .15s; }
.gate--dia .gate__spill { background: radial-gradient(50% 58% at 50% 64%, rgba(255, 220, 170, .32), rgba(255, 220, 170, 0) 70%); }
/* v1.0100: com o sol baixo ou já posto, a luz do corredor volta a ser a quente da noite (a de dia é mais fraca porque compete com o sol) */
.gate--f-amanhecer .gate__spill, .gate--f-por-do-sol .gate__spill, .gate--f-anoitecer .gate__spill { background: radial-gradient(50% 58% at 50% 64%, rgba(255, 196, 120, .5), rgba(255, 170, 90, .14) 46%, rgba(255, 170, 90, 0) 72%); }
.gate.is-open .gate__spill { opacity: 1; } .gate.is-in .gate__spill { opacity: 0; transition-duration: .6s; }
.gate__term { position: absolute; left: var(--tx); top: var(--ty); width: 12px; height: 12px; margin: -6px 0 0 -6px; border-radius: 50%; background: #ff4a4a; box-shadow: 0 0 14px 5px rgba(255, 74, 74, .8); opacity: 0; transition: opacity .4s, background .3s, box-shadow .3s; }
.gate__term::after { content: ""; position: absolute; top: -10px; right: -10px; bottom: -10px; left: -10px; border-radius: 50%; border: 2px solid #ff6b6b; animation: gate-ping 1.2s ease-out infinite; }
@keyframes gate-ping { from { transform: scale(.4); opacity: .9; } to { transform: scale(2); opacity: 0; } }
.gate.is-scan .gate__term { opacity: 1; }
.gate.is-ok .gate__term { background: var(--ok); box-shadow: 0 0 18px 7px rgba(47, 212, 122, .85); } .gate.is-ok .gate__term::after { border-color: var(--ok); }
.gate.is-in .gate__term { opacity: 0; }
/* feixe de luz entre o terminal facial (na foto) e o scanner */
.gate__beam { position: absolute; top: 0; right: 0; bottom: 0; left: 0; width: 100%; height: 100%; pointer-events: none; opacity: 0; transition: opacity .5s ease; }
.gate__beam line { stroke: url(#gateBeamG); stroke-width: 2; stroke-linecap: round; stroke-dasharray: 6 8; animation: gate-flow .7s linear infinite; }
@keyframes gate-flow { to { stroke-dashoffset: -14; } }
.gate.is-scan .gate__beam { opacity: 1; } .gate.is-open .gate__beam { opacity: 0; }
.gate.is-ok .gate__beam stop { stop-color: var(--ok); }
.gate__vig { position: absolute; top: 0; right: 0; bottom: 0; left: 0; pointer-events: none; background: linear-gradient(180deg, rgba(5, 5, 6, .7), transparent 26%, transparent 64%, rgba(5, 5, 6, .8)); transition: opacity .8s ease; }
.gate.is-in .gate__vig { opacity: 0; }
.gate__sh { opacity: 0; transition: opacity 1s ease .55s; pointer-events: none; }
.gate.is-in .gate__sh { opacity: 1; }
.gate__place { position: absolute; z-index: 3; left: max(18px, env(safe-area-inset-left)); right: 96px; top: calc(18px + env(safe-area-inset-top)); margin: 0; display: flex; align-items: center; gap: 8px; font: 600 .8125rem/1.2 var(--ch-body); color: rgba(255, 255, 255, .88); opacity: 0; transition: opacity .6s ease .2s; }
.gate.is-live .gate__place { opacity: 1; }
.gate__place svg { flex: none; width: 16px; height: 16px; fill: none; stroke: currentColor; stroke-width: 2; }
.gate__place span { min-width: 0; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; } .gate__place i { font-style: normal; }
@media (max-width: 419px) { .gate__place i { display: none; } }
.gate__place b { flex: none; margin-left: 4px; padding: 5px 9px; border-radius: 999px; background: rgba(255, 255, 255, .14); font-weight: 700; font-variant-numeric: tabular-nums; -webkit-backdrop-filter: blur(10px); backdrop-filter: blur(10px); }
.gate__hi { position: absolute; z-index: 3; left: max(20px, 5vw); right: 20px; top: calc(62px + env(safe-area-inset-top)); margin: 0; display: grid; gap: 8px; font: 900 max(2.2rem, min(min(11vw, 7vh), 4.5rem))/1 var(--ch-display); font: 900 max(2.2rem, min(min(11vw, 7svh), 4.5rem))/1 var(--ch-display); letter-spacing: -.045em; text-shadow: 0 2px 30px rgba(0, 0, 0, .7); opacity: 0; transform: translateY(14px); transition: opacity .8s ease .15s, transform 1s var(--ch-ease) .15s; }
.gate__hi small { font: 700 1rem/1.3 var(--ch-body); letter-spacing: 0; color: rgba(255, 255, 255, .8); }
.gate.is-live .gate__hi { opacity: 1; transform: none; }
.gate.is-in .gate__hi { opacity: 0; transform: translateY(-10px); transition-duration: .5s; transition-delay: 0s; }
/* scanner: nasce sobre a porta, como uma projeção */
.gate__scan { position: absolute; z-index: 2; left: var(--sx); top: var(--sy); width: var(--sz); aspect-ratio: 1; opacity: 0; transform: translate(-50%, -50%) scale(.84); transition: opacity .6s ease, transform 1s var(--ch-ease); }
.gate__scan::before { content: ""; position: absolute; top: 6%; right: 6%; bottom: 6%; left: 6%; border-radius: 50%; background: radial-gradient(circle, rgba(10, 10, 12, .62), rgba(10, 10, 12, .38) 64%, transparent 72%); -webkit-backdrop-filter: blur(5px); backdrop-filter: blur(5px); }
.gate.is-scan .gate__scan { opacity: 1; transform: translate(-50%, -50%) scale(1); }
.gate.is-open .gate__scan { opacity: 0; transform: translate(-50%, -50%) scale(1.12); transition: opacity .55s ease, transform .8s var(--ch-ease); }
.gs { position: relative; display: block; width: 100%; height: 100%; overflow: visible; }
.gs-halo { fill: rgba(10, 10, 12, .35); }
.gs-t { stroke: rgba(255, 255, 255, .22); stroke-width: 2.4; stroke-linecap: round; transition: stroke .25s ease; }
.gs-t.on { stroke: #fff; }
.gate.is-ok .gs-t { stroke: var(--ok); transition: stroke .35s ease; }
.gs-b { fill: none; stroke: #fff; stroke-width: 3.4; stroke-linecap: round; stroke-linejoin: round; transform-origin: 150px 150px; transform: scale(1.12); opacity: .5; transition: transform .8s var(--ch-ease) .3s, opacity .5s ease .3s, stroke .3s; }
.gate.is-scan .gs-b { transform: none; opacity: 1; }
.gate.is-ok .gs-b { stroke: var(--ok); }
.gs-c0 { fill: none; stroke: rgba(255, 255, 255, .16); stroke-width: 1.3; stroke-dasharray: 3 5; }
.gs-c { fill: rgba(234, 32, 37, .06); stroke: rgba(255, 255, 255, .85); stroke-width: 1.6; }
.gs-l { fill: none; stroke: rgba(255, 255, 255, .22); stroke-width: .7; }
.gs-fx { fill: none; stroke: #fff; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
.gs-i circle { fill: #fff; } .gs-d circle { fill: rgba(255, 255, 255, .9); }
.gate.is-ok .gs-c { fill: rgba(47, 212, 122, .08); stroke: var(--ok); } .gate.is-ok .gs-l { stroke: rgba(47, 212, 122, .35); } .gate.is-ok .gs-fx, .gate.is-ok .gs-i circle, .gate.is-ok .gs-d circle { stroke: var(--ok); fill: var(--ok); } .gate.is-ok .gs-fx { fill: none; }
.gs-c, .gs-l, .gs-fx, .gs-d circle, .gs-i circle { transition: stroke .35s ease, fill .35s ease; }
.gs-beam { fill: var(--scan); filter: drop-shadow(0 0 6px rgba(234, 32, 37, .95)); }
.gs-laser { opacity: 0; transition: opacity .3s ease; }
.gate.is-scan .gs-laser { opacity: 1; } .gate.is-ok .gs-laser { opacity: 0; }
.gs-ok { fill: none; stroke: var(--ok); stroke-width: 10; stroke-linecap: round; stroke-linejoin: round; stroke-dasharray: 100; stroke-dashoffset: 100; filter: drop-shadow(0 0 10px rgba(47, 212, 122, .7)); }
.gate.is-done .gs-ok { stroke-dashoffset: 0; transition: stroke-dashoffset .5s cubic-bezier(.65, 0, .35, 1); }
.gate.is-done .gs-face, .gate.is-done .gs-c0 { opacity: .18; transition: opacity .4s ease; }
.gate__msg { position: absolute; z-index: 3; left: var(--sx); top: calc(var(--sy) + var(--sz) / 2 + 12px); transform: translateX(-50%); margin: 0; display: inline-flex; align-items: center; gap: 10px; min-height: 44px; max-width: calc(100vw - 32px); padding: 0 18px 0 14px; border-radius: 999px; background: rgba(12, 12, 14, .55); border: 1px solid rgba(255, 255, 255, .18); -webkit-backdrop-filter: blur(14px); backdrop-filter: blur(14px); font: 700 1rem/1.2 var(--ch-body); white-space: nowrap; opacity: 0; transition: opacity .5s ease, background .3s, border-color .3s; }
.gate.is-scan .gate__msg { opacity: 1; }
.gate.is-ok .gate__msg { background: rgba(20, 60, 38, .6); border-color: rgba(47, 212, 122, .5); }
.gate.is-open .gate__msg { opacity: 0; transition-delay: .35s; }
.gate__msg [data-gate-t] { transition: opacity .2s; } .gate__msg.is-swap [data-gate-t] { opacity: 0; }
.gate__pct { min-width: 3.2ch; font-variant-numeric: tabular-nums; color: rgba(255, 255, 255, .65); text-align: right; }
.gate__pct:empty { display: none; } .gate.is-ok .gate__pct { display: none; }
.gate__dot { flex: none; width: 10px; height: 10px; border-radius: 50%; background: var(--scan); animation: pulse-r 1.2s infinite; }
.gate.is-ok .gate__dot { background: var(--ok); animation: none; box-shadow: 0 0 0 5px rgba(47, 212, 122, .22); }
.gate__skip { position: absolute; z-index: 5; right: 16px; top: calc(12px + env(safe-area-inset-top)); min-height: 44px; padding: 0 16px; border: 1px solid rgba(255, 255, 255, .22); border-radius: 999px; background: rgba(255, 255, 255, .08); color: #fff; font: 600 .8125rem/1 var(--ch-body); cursor: pointer; -webkit-backdrop-filter: blur(10px); backdrop-filter: blur(10px); transition: opacity .4s; }
.gate.is-in .gate__place, .gate.is-in .gate__skip { opacity: 0; }
/* computador e celular deitado: saudação à esquerda, porta à direita */
.gate.is-wide .gate__hi { top: 50%; right: auto; max-width: min(40vw, 560px); transform: translateY(-50%); }
.gate.is-wide.is-live .gate__hi { transform: translateY(-50%); }
.gate.is-wide.is-in .gate__hi { transform: translateY(-54%); }
@media (min-width: 900px) { .gate__place { font-size: .875rem; } .gate__msg { font-size: 1.0625rem; min-height: 50px; } .gate.is-wide .gate__hi { font-size: max(3rem, min(5.6vw, 5.5rem)); } }
@media (prefers-reduced-motion: reduce) { .gate__term::after, .gate__dot, .gate__beam line { animation: none; } .gate__frame, .gate.is-live .gate__frame { transform: none; } }
/* ---------- v1.0169 · a apresentação nos 3 idiomas: o idioma da visita em destaque (português, por padrão) e os outros dois
   logo abaixo, como legenda de filme — com a bandeira de cada um. A pílula da varredura e o "Pular" também legendam. ---------- */
.gate__oi { display: block; }
.gate__cc { display: grid; gap: 7px; margin-top: 4px; }
.gate__c { display: block; max-width: 30em; font: 600 .875rem/1.35 var(--ch-body); letter-spacing: 0; color: rgba(255, 255, 255, .8); text-shadow: 0 1px 14px rgba(0, 0, 0, .8); opacity: 0; transform: translateY(8px); transition: opacity .7s ease, transform .9s var(--ch-ease); }
.gate__c b { font-weight: 800; color: #fff; }
.gate__c .flag { width: 20px; height: 14px; margin-top: 2px; border-radius: 3px; box-shadow: 0 1px 8px rgba(0, 0, 0, .45); }
.gate__c .flag::after { box-shadow: inset 0 0 0 1px rgba(255, 255, 255, .28); }
.gate.is-live .gate__c { opacity: 1; transform: none; transition-delay: .75s; }
.gate.is-live .gate__c + .gate__c { transition-delay: 1s; }
.gate__msg { width: max-content; min-height: 52px; padding: 7px 18px 7px 14px; } /* max-content: a pílula tem a largura da frase (a legenda só quebra se passar da tela) */
.gate__mt { display: grid; gap: 3px; min-width: 0; }
.gate__mc { font: 600 .6875rem/1.25 var(--ch-body); letter-spacing: .01em; color: rgba(255, 255, 255, .68); white-space: normal; transition: opacity .2s; }
.gate__mc:empty { display: none; }
.gate__msg.is-swap .gate__mc { opacity: 0; }
.gate__skip { display: grid; place-items: center; align-content: center; gap: 2px; padding: 5px 16px; line-height: 1.1; }
.gate__skip small { font: 600 .625rem/1.1 var(--ch-body); letter-spacing: .02em; color: rgba(255, 255, 255, .68); }
.gate__place { right: 124px; } /* o "Pular" ganhou a legenda e ficou mais largo: o endereço e o relógio não passam por baixo dele */
@media (min-width: 900px) {
  .gate__c { font-size: 1rem; gap: 10px; }
  .gate__c .flag { width: 22px; height: 15.5px; margin-top: 3px; }
  .gate__msg { min-height: 58px; }
  .gate__mc { font-size: .75rem; }
}
@media (max-width: 359px) { .gate__c { font-size: .8125rem; } }
@media (prefers-reduced-motion: reduce) { .gate__c { transition: opacity .4s ease; transform: none; } }
/* v1.0240: ABERTURA "A LUZ DO CARNEIRO" (gate--luz) — sem câmera e sem rosto. A mesma porta real na luz de agora; no lugar do scanner, a
   placa de acrílico da porta (logotipo oficial, cores oficiais): ela desce balançando, o sol nasce atrás do logo, os raios acendem em pares
   do horizonte ao topo, o nome se escreve, a borda fica verde, a placa volta voando para a placa de verdade da foto e a porta abre. */
.gate--luz .gate__scan { width: calc(var(--sz) * .96); height: calc(var(--sz) * .98); aspect-ratio: auto; perspective: 900px; transform: translate(-50%, -50%); transition: opacity .45s ease, transform .75s cubic-bezier(.65, 0, .35, 1); }
.gate--luz .gate__scan::before { display: none; }
.gate--luz.is-scan .gate__scan { transform: translate(-50%, -50%); }
.gate--luz.is-done .gate__scan, .gate--luz.is-open .gate__scan { transform: translate(-50%, -50%) translate(var(--gx, 0px), var(--gy, -40px)) scale(var(--gs, .6)); }
.gate--luz.is-open .gate__scan { opacity: 0; transition: opacity .5s ease .1s, transform .75s cubic-bezier(.65, 0, .35, 1); }
.gate__pl { position: absolute; top: 0; right: 0; bottom: 0; left: 0; display: grid; place-items: center; border-radius: calc(var(--sz) * .028); background: linear-gradient(158deg, #fff 0%, #fafaf8 48%, #efeeeb 100%); box-shadow: inset 0 0 0 1px rgba(255, 255, 255, .95), inset 0 -3px 8px rgba(0, 0, 0, .07), 0 0 0 1.5px rgba(234, 32, 37, 0), 0 22px 60px rgba(0, 0, 0, .5); overflow: hidden; opacity: 0; transform-origin: 50% 0; transform: rotateX(-84deg); transition: transform 1.15s cubic-bezier(.3, 1.55, .5, 1), opacity .2s ease, box-shadow .4s ease; }
.gate--luz.is-scan .gate__pl { opacity: 1; transform: none; box-shadow: inset 0 0 0 1px rgba(255, 255, 255, .95), inset 0 -3px 8px rgba(0, 0, 0, .07), 0 0 0 1.5px rgba(234, 32, 37, .85), 0 0 26px 2px rgba(234, 32, 37, .35), 0 22px 60px rgba(0, 0, 0, .5); }
.gate--luz.is-ok .gate__pl { box-shadow: inset 0 0 0 1px rgba(255, 255, 255, .95), inset 0 -3px 8px rgba(0, 0, 0, .07), 0 0 0 2px var(--ok), 0 0 30px 4px rgba(47, 212, 122, .45), 0 22px 60px rgba(0, 0, 0, .5); }
.gate--luz.is-done .gate__pl { box-shadow: inset 0 0 0 1px rgba(255, 255, 255, .95), inset 0 -3px 8px rgba(0, 0, 0, .07), 0 0 0 0 rgba(47, 212, 122, 0), 0 8px 20px rgba(0, 0, 0, .3); }
.gate--luz.gate--f-anoitecer .gate__pl, .gate--luz.gate--f-noite .gate__pl { background: radial-gradient(120% 70% at 50% -8%, #fff8ea 0%, #fbf4e8 40%, #ece6dc 100%); } /* à noite a placa fica sob a luz quente da arandela, como na porta */
.gate__bolt { position: absolute; z-index: 2; width: calc(var(--sz) * .042); height: calc(var(--sz) * .042); border-radius: 50%; background: radial-gradient(circle at 35% 30%, #fff 0 18%, #c9ccd1 38%, #7d8289 72%, #5d6168 100%); box-shadow: 0 1px 2px rgba(0, 0, 0, .35); }
.gate__bolt:nth-child(1) { left: 5.5%; top: 5.5%; } .gate__bolt:nth-child(2) { right: 5.5%; top: 5.5%; } .gate__bolt:nth-child(3) { left: 5.5%; bottom: 5.5%; } .gate__bolt:nth-child(4) { right: 5.5%; bottom: 5.5%; }
.gate__pl .gl { position: relative; z-index: 1; display: block; width: 84%; height: auto; overflow: hidden; }
.gl-sun { opacity: calc(var(--gp, 0) * .78); transform-box: view-box; transform-origin: 548.5px 543.4px; transform: translateY(calc((1 - var(--gp, 0)) * 150px)) scale(calc(.35 + var(--gp, 0) * .65)); } /* o sol nasce: sobe do horizonte (a base do logo) enquanto cresce */
.gate--luz.is-ok .gl-sun { opacity: .35; transition: opacity .6s ease; } .gate--luz.is-done .gl-sun { opacity: 0; }
.gate--luz.gate--f-amanhecer .gl-s, .gate--luz.gate--f-por-do-sol .gl-s { stop-color: #ff9d52; }
.gate--luz.gate--f-entardecer .gl-s { stop-color: #ffb062; }
.gate--luz.gate--f-manha .gl-s, .gate--luz.gate--f-tarde .gl-s { stop-color: #ffd47e; }
.gate--luz.gate--f-anoitecer .gl-s, .gate--luz.gate--f-noite .gl-s { stop-color: #ffbb6e; }
.gl-r { opacity: 0; transform-box: view-box; transform-origin: 548.5px 543.4px; transform: scale(.35); stroke: #ffe3a6; stroke-width: 0; stroke-linejoin: round; transition: opacity .3s ease, transform .6s cubic-bezier(.2, 1.45, .4, 1); }
.gl-r--k { fill: #0d0d0d; } .gl-r--r { fill: #e91d22; }
.gl-r.on { opacity: 1; transform: none; animation: gl-flash .75s ease-out; }
@keyframes gl-flash { from { stroke-width: 16px; } to { stroke-width: 0; } }
.gl-dot { fill: #0d0d0d; transform-box: view-box; transform-origin: 548.5px 543.4px; transform: scale(0); }
.gate--luz.is-scan .gl-dot { animation: gl-dot .9s cubic-bezier(.2, 1.4, .4, 1) .15s forwards; }
@keyframes gl-dot { 0% { transform: scale(0); } 60% { transform: scale(1.6); } 100% { transform: scale(1); } }
.gl-wk { fill: #0d0d0d; } .gl-wr { fill: #e91d22; }
.gate--luz.is-ok .gl-rays { animation: gl-pulse .6s ease-out; transform-box: view-box; transform-origin: 548.5px 543.4px; }
@keyframes gl-pulse { 50% { transform: scale(1.045); } }
@media (prefers-reduced-motion: reduce) { .gate__pl { transition: opacity .3s ease; transform: none; } .gl-r { transition: opacity .3s ease; transform: none; } .gl-r.on, .gate--luz.is-ok .gl-rays, .gate--luz.is-scan .gl-dot { animation: none; } .gate--luz.is-scan .gl-dot { transform: none; } }
.gate--luz.is-done .gate__beam { opacity: 0; }
.gate--luz.is-done:not(.is-wide) .gate__hi { opacity: 0; transition: opacity .4s ease; } /* celular: a placa de verdade fica atrás da saudação — a saudação sai para a placa pousar limpa */
@supports not (aspect-ratio: 1 / 1) { .gate--luz .gate__scan { height: calc(var(--sz) * .98); } }
/* v1.0241: 3ª ABERTURA — HOTEL 100% DIGITAL (gate--digital). PLANA de propósito: nenhuma sombra, nenhum 3D, nenhum halo, nenhuma porcentagem.
   Folha branca com o logo oficial (assets/img/marca-digital.svg) + a frase que sai do código binário (.gate__dg); a folha é uma máscara:
   cada raio que "apaga" vira janela para a porta real da foto. Letras grandes, cores do logo (#0d0d0d / #e91d22). */
.gate__lq { position: absolute; top: 0; left: 0; z-index: 4; display: block; width: 100%; height: 100%; pointer-events: none; }
.lq-r--k, .lq-dot, .lq-wk { fill: #0d0d0d; } .lq-r--r, .lq-wr { fill: #e91d22; }
.gate__dg { position: absolute; z-index: 5; left: 16px; right: 16px; top: 72%; margin: 0; text-align: center; pointer-events: none; opacity: 0; } /* o JS mostra (já com as letras montadas) */
.gate__dg-h { margin: 0; font: 900 clamp(1.875rem, min(8vw, 7.2vh), 4.25rem)/1.05 var(--ch-display); letter-spacing: -.035em; color: #0d0d0d; white-space: nowrap; }
.gate__dg-s { margin: 14px 0 0; font: 700 clamp(1rem, min(3.9vw, 3vh), 1.625rem)/1.3 var(--ch-body); letter-spacing: 0; color: #2c2c31; }
.dgc { position: relative; } .dgc.is-red { color: #e91d22; }
.dgc.is-w { color: transparent; }
.dgc.is-b { color: transparent; }
.dgc.is-b::after { content: attr(data-b); position: absolute; left: 0; right: 0; top: 0; text-align: center; color: #e91d22; font-variant-numeric: tabular-nums; }
.gate--digital:not(.is-win) .gate__bg, .gate--digital:not(.is-win) .gate__frame, .gate--digital:not(.is-win) .gate__vig, .gate--digital:not(.is-win) .gate__beam { visibility: hidden; } /* debaixo da folha branca nada precisa ser pintado */
.gate--digital { background: #fff; } /* a 1ª pintura já é a folha branca (nada de piscar preto) */
.gate--digital.is-paper .gate__skip { border-color: rgba(13, 13, 13, .2); background: rgba(13, 13, 13, .04); color: #0d0d0d; -webkit-backdrop-filter: none; backdrop-filter: none; }
.gate--digital.is-paper .gate__skip small { color: rgba(13, 13, 13, .6); }
.gate--digital:not(.is-shown) .gate__hi, .gate--digital:not(.is-shown) .gate__place, .gate--digital:not(.is-shown) .gate__c { opacity: 0; transition: none; }
/* v1.0242: 4ª ABERTURA — 24 HORAS NA PORTA (gate--horas). Plana: nada de 3D, halo ou porcentagem. As 7 fotos reais da porta passam como um
   time-lapse (.gate__tl, uma camada por fase, cada uma no enquadramento da sua foto) enquanto o relógio grande gira um dia inteiro até agora. */
.gate__tl { position: absolute; top: 0; right: 0; bottom: 0; left: 0; z-index: 1; overflow: hidden; pointer-events: none; transition: opacity .25s ease; }
.gate__tl.is-gone { opacity: 0; visibility: hidden; }
.gate__tlbg { position: absolute; top: -8%; right: -8%; bottom: -8%; left: -8%; background: #050506 center / cover no-repeat; filter: blur(34px) brightness(.4) saturate(1.1); }
.gate__tli { position: absolute; background-position: center; background-size: 100% 100%; background-repeat: no-repeat; opacity: 0; transition: opacity .3s ease; }
.gate__tli.on { opacity: 1; }
.gate__tli.is-narrow { -webkit-mask-image: linear-gradient(90deg, transparent, #000 12%, #000 88%, transparent); mask-image: linear-gradient(90deg, transparent, #000 12%, #000 88%, transparent); }
.gate__tli.is-short:not(.is-narrow) { -webkit-mask-image: linear-gradient(180deg, transparent, #000 14%); mask-image: linear-gradient(180deg, transparent, #000 14%); }
.gate__clk { position: absolute; z-index: 3; left: max(20px, 5vw); right: 20px; top: calc(58px + env(safe-area-inset-top)); margin: 0; display: grid; justify-items: start; gap: 6px; color: #fff; text-shadow: 0 2px 30px rgba(0, 0, 0, .7); opacity: 0; transition: opacity .6s ease .1s; }
.gate.is-live .gate__clk { opacity: 1; }
.gate--horas.is-shown .gate__clk { opacity: 0; transition: opacity .3s ease; }
.gate__clk-t { font: 900 clamp(4rem, 22vw, 7.5rem)/.9 var(--ch-display); letter-spacing: -.05em; font-variant-numeric: tabular-nums; }
.gate__clk-t small { margin-left: .12em; font-size: .32em; letter-spacing: 0; vertical-align: .9em; }
.gate__clk-f { font: 800 clamp(1.125rem, 5vw, 1.5rem)/1.1 var(--ch-body); color: #fff; text-transform: lowercase; }
.gate__clk-f::first-letter { text-transform: uppercase; }
.gate__clk-s { display: inline-block; margin-top: 4px; padding: 8px 14px; border-radius: 999px; background: #e91d22; color: #fff; font: 800 clamp(.875rem, 3.6vw, 1rem)/1.2 var(--ch-body); text-shadow: none; }
.gate.is-wide .gate__clk { top: 50%; right: auto; max-width: min(40vw, 560px); transform: translateY(-50%); }
@media (min-width: 900px) { .gate.is-wide .gate__clk-t { font-size: max(5.5rem, min(9vw, 9.5rem)); } }
.gate--horas:not(.is-shown) .gate__hi, .gate--horas:not(.is-shown) .gate__c { opacity: 0; transition: none; }
.gate--horas:not(.is-shown) .gate__place b { visibility: hidden; } /* um relógio só na tela: o grande */
html:not(.no-gate):not(.gate-done) .scene .mega, html:not(.no-gate):not(.gate-done) .scene__sub, html:not(.no-gate):not(.gate-done) .scene__book { animation-play-state: paused; }
html:not(.no-gate):not(.gate-done) .top, html:not(.no-gate):not(.gate-done) .tabbar { opacity: 0; }
.top, .tabbar { transition: opacity .8s ease, transform .45s var(--ch-ease); }
/* telas estreitas (320–360 px): nada força a largura */
.access__in > *, .desk__in > *, .contact__in > *, .cow__in > *, .sui__in > *, .bento > * { min-width: 0; }
.glass:not(.top__book) { max-width: 100%; white-space: normal; text-align: center; line-height: 1.25; padding-top: 12px; padding-bottom: 12px; } /* o .glass nasce com white-space:nowrap; só o botão da barra do topo (texto curto) fica de fora */
@media (max-width: 359px) { .wrap, .cow__in { padding-left: 16px; padding-right: 16px; } .rooms__l { padding-left: 16px; padding-right: 16px; } .scene__line { padding: 0 16px; } .top__book { padding: 0 14px; } .brand__logo { height: 44px; } .tabbar a span, .tabbar button span { font-size: .5625rem; } .wx__hours { grid-template-columns: repeat(5, 1fr); } .wx__hours li:nth-child(6) { display: none; } }

/* ---------- selos (pills): banheiro e ar-condicionado sempre explícitos ---------- */
.pill { display: inline-flex; align-items: center; gap: 7px; min-height: 34px; padding: 0 13px 0 10px; border-radius: 999px; font: 700 .8125rem/1 var(--ch-body); letter-spacing: .01em; white-space: nowrap; }
.pill svg { width: 17px; height: 17px; flex: none; fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }
.room__pills { position: absolute; z-index: 2; left: 14px; right: 14px; top: 14px; display: flex; flex-wrap: wrap; gap: 8px; }
.room__pills .pill { color: #fff; background: rgba(11, 11, 13, .46); border: 1px solid rgba(255, 255, 255, .3); -webkit-backdrop-filter: blur(16px) saturate(170%); backdrop-filter: blur(16px) saturate(170%); box-shadow: inset 0 1px 0 rgba(255, 255, 255, .25); }
.room__pills .pill--on svg { color: #4ee28f; }
.room__pills .pill--warn { background: rgba(255, 190, 60, .92); border-color: rgba(255, 255, 255, .5); color: #2b1d00; }
.faq__l { display: grid; gap: 8px; padding: 0 0 20px; color: var(--ch-ink-2); }
.faq__l li { padding: 12px 14px; border-radius: 14px; background: var(--ch-mist); line-height: 1.4; }

/* ================= v1.0041 · menu claro, WhatsApp flutuante, passeio em fotos, hall na entrada ================= */
/* botão Menu (topo) */
.top__menu { display: inline-flex; align-items: center; gap: 8px; min-height: 46px; padding: 0 16px 0 12px; border: 1px solid rgba(11, 11, 13, .12); border-radius: 999px; background: rgba(11, 11, 13, .05); color: var(--ch-ink); font: 700 .9375rem/1 var(--ch-body); cursor: pointer; -webkit-tap-highlight-color: transparent; }
.top__menu svg { width: 22px; height: 22px; fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; }
.top__menu:hover { background: rgba(11, 11, 13, .1); }
/* v1.0130 — chave proprietário no topo */
.top__own { display: inline-flex; align-items: center; gap: 7px; min-height: 46px; padding: 0 15px 0 11px; border-radius: 999px; background: #1c0606; color: #fff; text-decoration: none; font: 700 .875rem/1 var(--ch-body); border: 1px solid rgba(234,32,37,.35); transition: background .2s, box-shadow .2s; white-space: nowrap; flex-shrink: 0; -webkit-tap-highlight-color: transparent; }
.top__own svg { width: 20px; height: 20px; flex-shrink: 0; stroke: #ff6166; }
.top__own-t { display: none; }
.top__own:hover { background: #2c0808; box-shadow: 0 0 0 2px rgba(234,32,37,.45); }
/* v1.0131 - proprietário: ícone, texto no hover */
/* ---------- v1.0169 · idiomas: só as 3 bandeiras no topo, no celular e no computador ----------
   Bandeira em SVG (ch_flag, inc/i18n.php): o Windows não desenha emoji de bandeira. A do idioma da visita fica acesa, com o anel
   vermelho; as outras ficam um pouco apagadas e acendem ao passar o mouse. Um toque troca o idioma (lang.js). */
.flag { position: relative; display: inline-block; flex: none; width: 24px; height: 17px; border-radius: 3.5px; overflow: hidden; vertical-align: middle; }
.flag svg { display: block; width: 100%; height: 100%; }
.flag::after { content: ""; position: absolute; top: 0; right: 0; bottom: 0; left: 0; border-radius: inherit; box-shadow: inset 0 0 0 1px rgba(11, 11, 13, .18); pointer-events: none; }
.flags { display: inline-flex; flex: none; align-items: center; gap: 2px; height: 44px; padding: 0 3px; border-radius: 999px; background: rgba(11, 11, 13, .045); border: 1px solid rgba(11, 11, 13, .09); }
.flags__a { position: relative; display: grid; place-items: center; width: 36px; height: 36px; border-radius: 999px; text-decoration: none; -webkit-tap-highlight-color: transparent; transition: background .2s, box-shadow .2s; }
.flags__a::after { content: ""; position: absolute; left: -1px; right: -1px; top: -4px; bottom: -4px; } /* alvo de toque com a altura inteira da cápsula (44 px) */
.flags__a .flag { opacity: .74; filter: saturate(.8); transition: opacity .2s, filter .2s, transform .25s var(--ch-ease); }
.flags__a:hover .flag { opacity: 1; filter: none; transform: scale(1.08); }
.flags__a:focus-visible .flag { opacity: 1; filter: none; transform: scale(1.08); }
.flags__a.is-on { background: #fff; box-shadow: 0 1px 4px rgba(11, 11, 13, .16), 0 0 0 1.5px var(--ch-red); }
.flags__a.is-on .flag { opacity: 1; filter: none; transform: none; }
.flags__a:focus-visible { outline: 3px solid rgba(234, 32, 37, .45); outline-offset: 2px; }
.flags.is-going .flags__a { pointer-events: none; }
.flags__a.is-going { background: #fff; box-shadow: 0 0 0 1.5px rgba(234, 32, 37, .5); }
.flags__a.is-going .flag { opacity: 1; filter: none; animation: flag-go .55s ease-in-out infinite alternate; }
@keyframes flag-go { to { transform: scale(.84); } }
@media (prefers-reduced-motion: reduce) { .flags__a.is-going .flag { animation: none; } }
.brand { flex: none; } /* v1.0169: o logotipo nunca encolhe (com o seletor antigo ele chegava a 7 px de largura em 1024 px) */
/* celular: logotipo · bandeiras · chave do proprietário · Reservar. O Menu fica na barra de baixo (sempre à vista no celular) */
@media (max-width: 559.98px) {
  .top__in { gap: 8px; }
  .top .brand__logo { height: 44px; }
  .top__menu { display: none; }
  .top__own { width: 44px; min-height: 44px; height: 44px; padding: 0; justify-content: center; }
  .flags { height: 42px; padding: 0 2px; gap: 1px; }
  .flags__a { width: 33px; height: 36px; }
  .flags__a::after { top: -3px; bottom: -3px; }
  .flags .flag { width: 23px; height: 16px; }
  .top__book { padding: 0 15px; }
}
@media (max-width: 359px) {
  .top__in { gap: 6px; }
  .top .brand__logo { height: 38px; }
  .flags__a { width: 29px; }
  .flags .flag { width: 20px; height: 14px; }
  .top__own { width: 40px; min-height: 40px; height: 40px; }
  .top__book { padding: 0 12px; font-size: .875rem; }
}
/* computador estreito (1024–1279): o Menu vira só o ícone e os links do topo ficam mais juntos, para caber bandeiras + chave + Reservar */
@media (min-width: 1024px) {
  .top__in { gap: 18px; }
}
@media (min-width: 1024px) and (max-width: 1279.98px) {
  .top__in { gap: 10px; padding: 0 10px 0 20px; }
  .nav a { padding: 0 8px; font-size: .875rem; }
  .top__menu { padding: 0; width: 46px; justify-content: center; }
  .top__menu span { display: none; }
  .top .brand__logo { height: 48px; }
  .flags__a { width: 34px; }
}
.top__menu, .top__book { flex: none; }

@media (min-width: 860px) {
  .top__own-t { display: inline; max-width: 0; overflow: hidden; opacity: 0; white-space: nowrap;
    transition: max-width .28s ease, opacity .22s ease; vertical-align: middle; }
  .top__own:hover .top__own-t { max-width: 180px; opacity: 1; }
  .top__own:focus-visible .top__own-t { max-width: 180px; opacity: 1; }
}
@media (max-width: 359px) { .top__menu { padding: 0 12px 0 10px; } .top__menu span { display: none; } }
@media (min-width: 1280px) { .nav a { padding: 0 13px; } }
/* barra do celular: clara, legível, palavra por palavra */
.tabbar { background: rgba(255, 255, 255, .94); border: 1px solid rgba(11, 11, 13, .08); box-shadow: 0 18px 40px -14px rgba(0, 0, 0, .45), 0 2px 0 rgba(255, 255, 255, .8) inset; }
.tabbar a, .tabbar button { color: #3a3a40; font: 700 .71875rem/1 var(--ch-body); letter-spacing: 0; gap: 5px; }
.tabbar a.is-on { color: var(--ch-red); } .tabbar a.is-on svg { stroke: var(--ch-red); }
.tabbar svg { stroke-width: 1.9; }
.tabbar__go span { font-size: .65625rem; font-weight: 800; }
@media (max-width: 359px) { .tabbar a span, .tabbar button span { font-size: .65625rem; } }
/* a tela do menu */
/* v1.0066: o menu é um MODAL por cima da landing — a página continua visível atrás, escurecida e desfocada. Nunca parece outra página. */
.menu { position: fixed; top: 0; right: 0; bottom: 0; left: 0; z-index: 2400; /* v1.0122: acima da barra do site (2300) — no computador o cartão do menu ficava atrás da barra e o X de fechar sumia */ display: grid; align-items: end; background: rgba(8, 8, 10, .55); -webkit-backdrop-filter: blur(14px) saturate(140%); backdrop-filter: blur(14px) saturate(140%); overscroll-behavior: contain; opacity: 0; transition: opacity .32s ease; }
.menu[hidden] { display: none; } .menu.is-open { opacity: 1; }
/* no celular vira uma folha que sobe de baixo; no computador, um cartão centralizado */
.menu__in { position: relative; width: 100%; max-width: 680px; margin-left: auto; margin-right: auto; max-height: 92vh; max-height: 92svh; overflow-y: auto; overscroll-behavior: contain; -webkit-overflow-scrolling: touch;
  padding: 14px 18px calc(24px + env(safe-area-inset-bottom)); border-radius: 30px 30px 0 0; background: rgba(250, 250, 252, .97); -webkit-backdrop-filter: blur(30px) saturate(180%); backdrop-filter: blur(30px) saturate(180%);
  box-shadow: 0 -2px 0 rgba(255, 255, 255, .8) inset, 0 -40px 90px -30px rgba(0, 0, 0, .7); transform: translateY(22px); opacity: .6; transition: transform .42s var(--ch-ease), opacity .32s ease; }
.menu.is-open .menu__in { transform: none; opacity: 1; }
/* alça da folha (celular) */
.menu__in::before { content: ''; display: block; width: 44px; height: 5px; margin: 2px auto 8px; border-radius: 3px; background: rgba(11, 11, 13, .18); }
@media (prefers-reduced-motion: reduce) { .menu__in { transition: none; transform: none; } }
.menu__h { display: flex; align-items: center; justify-content: space-between; gap: 12px; height: 64px; }
.menu__x { display: inline-flex; align-items: center; gap: 8px; min-height: 48px; padding: 0 14px 0 18px; border: 0; border-radius: 999px; background: var(--ch-ink); color: #fff; font: 700 .9375rem/1 var(--ch-body); cursor: pointer; }
.menu__x svg { width: 20px; height: 20px; fill: none; stroke: currentColor; stroke-width: 2.2; stroke-linecap: round; }
.menu__g { display: grid; gap: 22px; }
.menu__k { margin: 18px 4px 14px; font: 900 max(1.75rem, min(7vw, 2.5rem))/1.05 var(--ch-display); letter-spacing: -.035em; }
/* reservar: o cartão vermelho, sempre primeiro */
.menu__go { display: flex; align-items: center; justify-content: space-between; gap: 16px; width: 100%; min-height: 84px; padding: 16px 20px 16px 22px; border: 0; border-radius: 26px; text-align: left; cursor: pointer; color: #fff; font: inherit;
  background: linear-gradient(135deg, #ff3b3f, var(--ch-red) 55%, #c4151b); box-shadow: 0 22px 44px -18px rgba(234, 32, 37, .75), inset 0 1px 0 rgba(255, 255, 255, .35); transition: transform .35s var(--ch-ease); -webkit-tap-highlight-color: transparent; }
.menu__go:hover { transform: translateY(-2px); } .menu__go:active { transform: scale(.985); }
.menu__go-t { display: grid; gap: 4px; min-width: 0; } .menu__go-t b { font: 800 1.375rem/1.1 var(--ch-display); letter-spacing: -.02em; } .menu__go-t small { font-size: .875rem; color: rgba(255, 255, 255, .88); }
.menu__go > svg { flex: none; width: 24px; height: 24px; }
/* agora no hotel: o que está aberto */
.menu__live { display: grid; gap: 4px; margin-top: 14px; padding: 6px 4px; }
.menu__live li { display: flex; align-items: center; gap: 12px; min-height: 40px; font-size: .9375rem; }
.menu__live li > span:last-child { display: flex; flex-wrap: wrap; gap: 0 8px; min-width: 0; align-items: baseline; }
.menu__live b { font-weight: 700; } .menu__live em { font-style: normal; color: var(--ch-muted); font-size: .875rem; }
.menu__live .is-on em, .menu__live li.is-on em { color: #1a8a4b; }
.menu__own { display: flex; align-items: center; gap: 14px; margin-top: 18px; min-height: 72px; padding: 12px 16px 12px 14px; border-radius: 20px; background: var(--ch-ink); color: #fff; text-decoration: none; transition: transform .2s var(--ch-ease); }
.menu__own:hover { transform: translateY(-2px); }
.menu__own-k { flex: none; display: grid; place-items: center; width: 44px; height: 44px; border-radius: 14px; background: var(--ch-red); color: #fff; }
.menu__own-k svg { width: 22px; height: 22px; }
.menu__own-t { display: grid; gap: 2px; min-width: 0; } .menu__own-t b { font: 800 1.0625rem/1.15 var(--ch-display); letter-spacing: -.015em; } .menu__own-t small { font-size: .8125rem; color: rgba(255, 255, 255, .7); line-height: 1.3; }
.menu__own > svg { flex: none; width: 20px; height: 20px; opacity: .6; }
.foot__own { display: inline-flex !important; align-items: center; gap: 8px; padding: 0 14px; border-radius: 999px; background: var(--ch-ink); color: #fff !important; }
.foot__own svg { width: 16px; height: 16px; } .foot__own:hover { background: var(--ch-red); color: #fff !important; }
.menu__addr { margin: 6px 4px 0; font-size: .875rem; color: var(--ch-muted); line-height: 1.5; } .menu__addr a { color: inherit; text-decoration: none; } .menu__addr a:hover { color: var(--ch-red); }
/* os lugares do site, com foto */
.menu__l { display: grid; gap: 10px; }
.menu__i { display: grid; grid-template-columns: 64px 1fr 20px; align-items: center; gap: 14px; width: 100%; min-height: 84px; padding: 10px 18px 10px 10px; border: 0; border-radius: 24px; background: #fff; color: var(--ch-ink); text-align: left; text-decoration: none; font: inherit; cursor: pointer; box-shadow: 0 1px 0 rgba(11, 11, 13, .05), 0 14px 30px -24px rgba(0, 0, 0, .35); transition: transform .35s var(--ch-ease), box-shadow .35s; opacity: 0; transform: translateY(14px); -webkit-tap-highlight-color: transparent; }
.menu.is-open .menu__i { opacity: 1; transform: none; transition: opacity .45s ease calc(var(--i, 0) * 45ms + 60ms), transform .55s var(--ch-ease) calc(var(--i, 0) * 45ms + 60ms), box-shadow .35s; }
.menu__i:hover { transform: translateX(4px); box-shadow: 0 1px 0 rgba(11, 11, 13, .05), 0 22px 40px -22px rgba(0, 0, 0, .45); } .menu__i:active { transform: scale(.985); }
.menu__p { width: 64px; height: 64px; border-radius: 18px; object-fit: cover; background: var(--ch-mist); }
.menu__t { display: grid; gap: 3px; min-width: 0; } .menu__t b { font: 800 1.0625rem/1.2 var(--ch-display); letter-spacing: -.015em; } .menu__t small { color: var(--ch-muted); font-size: .8125rem; line-height: 1.35; overflow-wrap: anywhere; }
.menu__i > svg { color: var(--ch-muted); }
@media (min-width: 700px) { .menu__l { grid-template-columns: repeat(2, minmax(0, 1fr)); } .menu__l li { display: grid; } .menu__i { height: 100%; } }
@media (min-width: 700px) {
  .menu { align-items: center; padding: 24px; }
  .menu__in { max-height: 88vh; max-height: 88svh; border-radius: 34px; padding: 18px 24px 26px; box-shadow: 0 1px 0 rgba(255, 255, 255, .9) inset, 0 60px 120px -40px rgba(0, 0, 0, .8); }
  .menu__in::before { display: none; }
}
@media (min-width: 1024px) {
  .menu__in { max-width: 1120px; padding: 10px 30px 30px; }
  .menu__h { height: 84px; }
  .menu__g { grid-template-columns: 380px minmax(0, 1fr); grid-template-rows: auto 1fr; gap: 22px 56px; align-items: start; margin-top: 12px; }
  .menu__side { grid-row: 1; } .menu__l { grid-column: 2; grid-row: 1 / span 2; } .menu__own { margin-top: 0; } .menu__acc { grid-column: 1; grid-row: 2; margin-top: 0; align-content: start; } /* v1.0194: as duas contas (hóspede e proprietário) juntas */
  .menu__k { margin-top: 6px; font-size: 2.75rem; }
  /* computador: cartões com a foto em cima, como um guia do hotel */
  .menu__l { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px; } .menu__l li { display: grid; } .menu__i { height: 100%; }
  .menu__i { position: relative; grid-template-columns: 1fr; grid-template-rows: 150px auto; align-content: start; gap: 12px; min-height: 0; padding: 8px 8px 16px; border-radius: 26px; }
  .menu__i:hover { transform: translateY(-4px); }
  .menu__p { width: 100%; height: 150px; border-radius: 20px; }
  .menu__t { padding: 0 10px; } .menu__t b { font-size: 1.125rem; } .menu__t small { font-size: .875rem; }
  .menu__i > svg { position: absolute; top: 20px; right: 20px; width: 36px; height: 36px; padding: 8px; border-radius: 50%; background: rgba(255, 255, 255, .92); color: var(--ch-ink); box-shadow: 0 6px 16px -6px rgba(0, 0, 0, .5); }
}
@media (min-width: 1280px) { .menu__l { grid-template-columns: repeat(3, minmax(0, 1fr)); } } /* v1.0066: 3 colunas só em tela larga — abaixo disso o título quebrava demais */
/* v1.0311: OS 3 FLUTUANTES (Kira · WhatsApp · «Minha área») NO MESMO PADRÃO — pílula CHAPADA (sem sombra, 3D, brilho nem contorno) do tamanho da Kira (56×198px no celular · 60×202px de 768px em diante),
 * 10px entre eles, todos presos na borda direita e TODOS recolhem no círculo ao rolar a página (html.fab-min, ligado pelo assets/js/kira.js; a Kira recolhe junto, pelo assets/css/kira.css).
 * As medidas moram nestas variáveis — a Kira se posiciona por elas. --fab-b: no celular/tablet o WhatsApp fica 10px acima do anel do botão Reservar da barra (anel termina a 96px do chão). */
:root { --fab-h: 56px; --fab-w: 198px; --fab-i: 28px; --fab-gap: 10px; --fab-r: 14px; --fab-b: 106px; }
@media (min-width: 768px) { :root { --fab-h: 60px; --fab-w: 202px; --fab-i: 30px; } }
@media (min-width: 1024px) { :root { --fab-r: 22px; --fab-b: 22px; } }
.wa-fab { position: fixed; z-index: 110; right: var(--fab-r); bottom: calc(var(--fab-b) + env(safe-area-inset-bottom)); display: inline-flex; align-items: center; width: var(--fab-w); height: var(--fab-h); padding: 0 0 0 calc((var(--fab-h) - var(--fab-i)) / 2); overflow: hidden; border-radius: 999px; background: #25d366; color: #fff; text-decoration: none; font: 700 .8125rem/1 var(--ch-body); transition: opacity .4s ease, transform .4s var(--ch-ease), background .3s, width .35s cubic-bezier(.3, .8, .3, 1); -webkit-tap-highlight-color: transparent; }
.wa-fab svg { flex: none; width: var(--fab-i); height: var(--fab-i); }
.wa-fab span { flex: 1 1 auto; min-width: 0; padding: 0 4px; text-align: center; white-space: nowrap; overflow: hidden; opacity: 1; transition: opacity .2s ease .12s; } /* o nome fica SEMPRE escrito, centrado no que sobra da pílula (como na Kira) */
html:is(.fab-min, .fab-capa) .wa-fab { width: var(--fab-h); } /* rolando (fab-min) ou com o quadro de reserva da capa embaixo (fab-capa, site.js): só o círculo */
html:is(.fab-min, .fab-capa) .wa-fab span { opacity: 0; transition: opacity .12s ease; }
html.wa-off .wa-fab { background: #8e8e93; }
html.wa-off .wa-fab span { white-space: pre-line; font-size: .75rem; line-height: 1.2; } /* "WhatsApp offline / volta às 08:00" em 2 linhas dentro da mesma pílula */
@media (prefers-reduced-motion: reduce) { .wa-fab, .wa-fab span { transition-duration: .01s; transition-delay: 0s; } }
html.chb-lock .wa-fab, html:not(.no-gate):not(.gate-done) .wa-fab { /* v1.0202: o WhatsApp fica SEMPRE à vista (antes só aparecia depois de rolar a página) */ opacity: 0; pointer-events: none; transform: translateY(10px); }
/* v1.0195: ÁREA DO HÓSPEDE — botão flutuante logo acima do WhatsApp (v1.0311: mesma altura da pílula, 10px de respiro, tinta da Kira e chapado) */
.gx-fab { position: fixed; z-index: 110; right: var(--fab-r); bottom: calc(var(--fab-b) + var(--fab-h) + var(--fab-gap) + env(safe-area-inset-bottom)); display: inline-flex; flex-direction: row-reverse; align-items: center; height: var(--fab-h); min-width: var(--fab-h); padding: 0 5px; border-radius: 999px; background: #0b0b0c; color: #fff; text-decoration: none; transition: opacity .4s ease .08s, transform .4s var(--ch-ease) .08s, background .3s; -webkit-tap-highlight-color: transparent; }
.gx-fab__i { position: relative; display: grid; place-items: center; flex: none; width: calc(var(--fab-h) - 10px); height: calc(var(--fab-h) - 10px); border-radius: 50%; background: var(--ch-red); }
.gx-fab__i svg { width: 22px; height: 22px; }
.gx-fab__b { position: absolute; top: -7px; right: -7px; display: grid; place-items: center; min-width: 22px; height: 22px; padding: 0 6px; border-radius: 999px; background: #fff; color: var(--ch-ink); font: 900 .6875rem/1 var(--ch-display); font-variant-numeric: tabular-nums; box-shadow: 0 0 0 2px rgba(14, 14, 17, .9); }
.gx-fab__b.is-star { background: #ffc233; color: var(--ch-ink); font-size: .75rem; } /* v1.0196: convite para avaliar */
.gx-fab__b.is-dot { min-width: 14px; width: 14px; height: 14px; top: -2px; right: -2px; padding: 0; background: #1faa55; }
.gx-fab__b.is-dot::after { content: ""; position: absolute; inset: -4px; border-radius: 50%; border: 2px solid #1faa55; opacity: 0; animation: gx-ping 2.2s ease-out infinite; }
@keyframes gx-ping { 0% { transform: scale(.6); opacity: .9; } 100% { transform: scale(1.5); opacity: 0; } }
.gx-fab__t { display: grid; gap: 0; max-width: 0; overflow: hidden; white-space: nowrap; opacity: 0; text-align: right; transition: max-width .45s var(--ch-ease), opacity .3s, margin .45s var(--ch-ease); }
.gx-fab__t b, .gx-fab__t small { overflow: hidden; text-overflow: ellipsis; }
.gx-fab__t b { font: 700 .875rem/1.25 var(--ch-body); }
.gx-fab__t small { font: 800 .625rem/1.3 var(--ch-body); letter-spacing: .08em; text-transform: uppercase; color: rgba(255, 255, 255, .6); }
.gx-fab.is-peek .gx-fab__t { max-width: min(260px, calc(100vw - 100px)); opacity: 1; margin: 0 10px 0 12px; }
@media (hover: hover) { .gx-fab:hover .gx-fab__t, .gx-fab:focus-visible .gx-fab__t { max-width: min(260px, calc(100vw - 100px)); opacity: 1; margin: 0 10px 0 12px; } .gx-fab:hover { background: rgba(11, 11, 13, .96); } }
html.chb-lock .gx-fab, .gx-fab:not(.is-in), html:not(.no-gate):not(.gate-done) .gx-fab { opacity: 0; pointer-events: none; transform: translateY(10px); }
/* v1.0311: «Minha área» chapado como o WhatsApp e a Kira — sem anel, sem onda (a antiga gx-halo) nem sombra; rolando, o nome recolhe no círculo */
html:is(.fab-min, .fab-capa) .gx-fab .gx-fab__t { max-width: 0; opacity: 0; margin: 0; }
@media (prefers-reduced-motion: reduce) { .gx-fab__b.is-dot::after { animation: none; } }
/* passeio em fotos: do portão à suíte, no ritmo de um story */
.tour { position: relative; isolation: isolate; width: 100%; max-width: 460px; margin-left: auto; margin-right: auto; aspect-ratio: 3 / 4.35; border-radius: 34px; overflow: hidden; background: #111; color: #fff; outline: 0; box-shadow: 0 50px 90px -50px rgba(234, 32, 37, .55), 0 0 0 1px rgba(255, 255, 255, .1); -webkit-user-select: none; user-select: none; touch-action: pan-y; }
.tour:focus-visible { box-shadow: 0 0 0 3px var(--ch-red); }
.tour__stage { position: absolute; top: 0; right: 0; bottom: 0; left: 0; }
.tour__s { position: absolute; top: 0; right: 0; bottom: 0; left: 0; margin: 0; opacity: 0; transform: scale(.94); transition: opacity .7s ease, transform 1.1s var(--ch-ease); will-change: opacity, transform; }
.tour__s img { width: 100%; height: 100%; object-fit: cover; transform: scale(1.02); transition: transform 6s linear; pointer-events: none; }
.tour__s.is-on { opacity: 1; transform: none; z-index: 2; } .tour__s.is-on img { transform: scale(1.12); }
.tour__s.is-out { opacity: 0; transform: scale(1.22); z-index: 3; transition: opacity .6s ease, transform .9s cubic-bezier(.5, 0, .8, .4); }
.tour__s::after { content: ""; position: absolute; top: 0; right: 0; bottom: 0; left: 0; background: linear-gradient(180deg, rgba(0, 0, 0, .55), transparent 22%, transparent 52%, rgba(0, 0, 0, .78)); }
.tour__s figcaption { position: absolute; z-index: 1; left: 22px; right: 22px; bottom: 96px; font: 800 max(1.375rem, min(5.6vw, 1.75rem))/1.28 var(--ch-display); letter-spacing: -.02em; text-shadow: 0 2px 14px rgba(0, 0, 0, .6); opacity: 0; transform: translateY(14px); transition: opacity .6s ease .25s, transform .8s var(--ch-ease) .25s; }
.tour__s.is-on figcaption { opacity: 1; transform: none; }
.tour__s mark { background: var(--ch-red); color: #fff; padding: .04em .32em .08em; border-radius: .28em; -webkit-box-decoration-break: clone; box-decoration-break: clone; text-shadow: none; }
.tour__bars { position: absolute; z-index: 5; left: 16px; right: 16px; top: 14px; display: flex; gap: 4px; }
.tour__bars i { flex: 1; height: 3px; border-radius: 3px; background: rgba(255, 255, 255, .32); overflow: hidden; } .tour__bars b { display: block; height: 100%; width: 0; background: #fff; border-radius: 3px; }
.tour__head { position: absolute; z-index: 5; left: 18px; right: 18px; top: 30px; display: flex; align-items: center; gap: 10px; margin: 0; font-size: .9375rem; text-shadow: 0 1px 10px rgba(0, 0, 0, .6); } .tour__head b { font: 800 1rem/1 var(--ch-display); } .tour__head small { margin-left: auto; font-weight: 600; opacity: .85; font-variant-numeric: tabular-nums; } .tour__head i { font-style: normal; }
.tour__ui { position: absolute; z-index: 6; left: 16px; right: 16px; bottom: 16px; display: flex; align-items: center; gap: 10px; }
.tour__b, .tour__p { display: inline-flex; align-items: center; justify-content: center; gap: 6px; height: 56px; min-width: 56px; padding: 0; border: 1px solid rgba(255, 255, 255, .3); border-radius: 999px; background: rgba(255, 255, 255, .16); color: #fff; font: 800 1rem/1 var(--ch-body); cursor: pointer; -webkit-backdrop-filter: blur(16px) saturate(170%); backdrop-filter: blur(16px) saturate(170%); -webkit-tap-highlight-color: transparent; transition: transform .25s, background .2s; }
.tour__b:active, .tour__p:active { transform: scale(.94); }
.tour__b svg, .tour__p svg { width: 22px; height: 22px; fill: none; stroke: currentColor; stroke-width: 2.4; stroke-linecap: round; stroke-linejoin: round; }
.tour__b--next { flex: 1; background: #fff; color: var(--ch-ink); border-color: #fff; padding: 0 18px 0 24px; justify-content: space-between; }
.tour__p .i-play { display: none; fill: currentColor; stroke: none; } .tour.is-paused .tour__p .i-play { display: block; } .tour.is-paused .tour__p .i-pause { display: none; }
@media (min-width: 1024px) { .tour { max-width: 460px; margin: 0; } }
@media (prefers-reduced-motion: reduce) { .tour .tour__s, .tour .tour__s figcaption { transition: opacity .5s ease !important; transform: none !important; } .tour .tour__s img { transform: none !important; } }
/* agenda: mais notícia, com resumo */
/* estrelas (preenchimento parcial por --f, ex.: 4,8) */
.stars { display: inline-flex; gap: .12em; vertical-align: middle; }
.stars i { flex: none; width: 1em; height: 1em; background: linear-gradient(90deg, #fbbc04 var(--f, 100%), var(--star-off, rgba(255, 255, 255, .38)) 0); -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12 2.6l2.9 5.9 6.5.9-4.7 4.6 1.1 6.5L12 17.4l-5.8 3.1 1.1-6.5L2.6 9.4l6.5-.9z'/%3E%3C/svg%3E") center / contain no-repeat; mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12 2.6l2.9 5.9 6.5.9-4.7 4.6 1.1 6.5L12 17.4l-5.8 3.1 1.1-6.5L2.6 9.4l6.5-.9z'/%3E%3C/svg%3E") center / contain no-repeat; }
/* capa: selo de confiança (nota real do Google) */
.trust { display: inline-flex; align-items: center; gap: 8px; margin-top: 14px; min-height: 32px; color: #fff; text-decoration: none; font: 600 .9375rem/1.2 var(--ch-body); text-shadow: 0 1px 2px rgba(0, 0, 0, .7), 0 4px 14px rgba(0, 0, 0, .6); animation: rise 1s .15s var(--ch-ease) both; -webkit-tap-highlight-color: transparent; }
.trust .stars { font-size: 1.0625rem; filter: drop-shadow(0 1px 2px rgba(0, 0, 0, .5)); }
.trust b { font: 800 1.0625rem/1 var(--ch-display); }
.trust span { color: rgba(255, 255, 255, .88); text-decoration: underline; text-decoration-color: rgba(255, 255, 255, .35); text-underline-offset: 3px; }
.trust:hover span { text-decoration-color: #fff; }
.trust i { font-style: normal; }
@media (max-width: 359px) { .trust i { display: none; } }
html:not(.no-gate):not(.gate-done) .trust { animation-play-state: paused; }
/* capa: reserva em 1 toque — rótulo, atalho e preço alinhados no mesmo eixo */
.quick { display: none; align-items: center; gap: 12px; margin-top: 16px; animation: rise 1s .18s var(--ch-ease) both; }
@media (min-height: 760px), (min-width: 1024px) { .quick { display: flex; } .quick + .scene__book { margin-top: 14px; } }
.quick__k { flex: none; font: 800 .6875rem/1 var(--ch-body); letter-spacing: .14em; text-transform: uppercase; color: rgba(255, 255, 255, .82); text-shadow: 0 1px 8px rgba(0, 0, 0, .7); }
.quick__l { display: flex; align-items: center; gap: 8px; min-width: 0; overflow-x: auto; scrollbar-width: none; margin-right: -20px; padding: 4px 20px 4px 0; scroll-snap-type: x proximity; }
.quick__l::-webkit-scrollbar { display: none; }
.quick button { flex: none; scroll-snap-align: start; display: inline-flex; align-items: center; gap: 8px; height: 44px; margin: 0; padding: 0 18px; border-radius: 999px; border: 1px solid rgba(255, 255, 255, .32); background: rgba(255, 255, 255, .14); color: #fff; cursor: pointer; font: inherit; line-height: 1; white-space: nowrap; -webkit-backdrop-filter: blur(16px) saturate(170%); backdrop-filter: blur(16px) saturate(170%); -webkit-tap-highlight-color: transparent; transition: background .2s, border-color .2s, transform .25s var(--ch-ease); }
.quick button.has-p { padding-right: 6px; }
.quick button:hover { background: rgba(255, 255, 255, .24); border-color: rgba(255, 255, 255, .55); }
.quick button:active { transform: scale(.96); }
.quick button:focus-visible { outline: 3px solid #fff; outline-offset: 2px; }
.quick b { font: 700 .9375rem/1 var(--ch-body); letter-spacing: -.005em; }
.quick .q-1 { order: 0; } .quick .q-hoje, .quick .q-amanha, .quick .q-vaga { order: 1; } .quick .q-1 { order: 0; } .quick .q-fds { order: 2; }
.quick .q-d { font: 500 .8125rem/1 var(--ch-body); color: rgba(255, 255, 255, .74); }
.quick em { display: inline-flex; align-items: center; height: 32px; padding: 0 12px; border-radius: 999px; background: var(--ch-red); color: #fff; font: 800 .8125rem/1 var(--ch-body); font-style: normal; font-variant-numeric: tabular-nums; }
.quick em[hidden] { display: none; }
.quick.is-wait .quick__l { opacity: 0; pointer-events: none; } .quick__l { transition: opacity .35s; }
html:not(.no-gate):not(.gate-done) .quick { animation-play-state: paused; }
@media (max-width: 699.98px) { /* celular: 2 atalhos do mesmo tamanho, nada cortado na borda */
  .quick { flex-wrap: wrap; gap: 8px; }
  .quick__k { flex-basis: 100%; }
  .quick__l { flex: 1 1 100%; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; margin: 0; padding: 0; overflow: visible; }
  .quick button { order: 0 !important; flex-wrap: wrap; justify-content: center; align-content: center; gap: 5px 6px; height: 58px; padding: 0 8px; border-radius: 18px; }
  .quick button.has-p { padding-right: 8px; }
  .quick button:nth-child(n+3) { display: none; }
  .quick b { flex-basis: 100%; text-align: center; font-size: .875rem; }
  .quick .q-d { font-size: .75rem; }
  .quick em { height: 22px; padding: 0 9px; font-size: .75rem; }
}
/* capa (celular): nº de pessoas sempre à vista, ao lado do Buscar */
.chb-who-m { display: none; }
@media (max-width: 699.98px) {
  .scene__book .chb-shell { grid-template-columns: repeat(6, minmax(0, 1fr)); }
  .scene__book .chb-f[data-ch-in], .scene__book .chb-f[data-ch-out] { grid-column: span 3; }
  .scene__book .chb-go { grid-column: span 4; }
  .scene__book .chb-who-m { grid-column: span 2; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 3px; min-height: 60px; padding: 6px 4px; border-radius: 22px; border: 1px solid rgba(255, 255, 255, .22); background: rgba(255, 255, 255, .1); color: #fff; cursor: pointer; font: inherit; -webkit-tap-highlight-color: transparent; transition: background .2s; }
  .scene__book .chb-who-m:active { background: rgba(255, 255, 255, .2); }
  .chb-who-m svg { display: none; }
  .chb-who-m b { font: 800 1.375rem/1 var(--ch-display); font-variant-numeric: tabular-nums; }
  .chb-who-m small { font: 700 .6875rem/1 var(--ch-body); letter-spacing: .06em; text-transform: uppercase; color: rgba(255, 255, 255, .78); }
}
/* avaliações do Google */
.rev { background: var(--ch-mist); }
.rev__g { display: grid; gap: 26px; } .rev__g > * { min-width: 0; }
.rev__sum { display: grid; gap: 18px; align-content: start; }
.rev__sum .h2 em { font-style: normal; color: var(--ch-red); }
.rev__big { display: flex; align-items: center; gap: 18px; padding: 20px 22px; border-radius: 26px; background: #fff; box-shadow: 0 24px 50px -38px rgba(0, 0, 0, .4); }
.rev__big strong { font: 900 3.75rem/.9 var(--ch-display); letter-spacing: -.045em; font-variant-numeric: tabular-nums; }
.rev__big .stars { --star-off: #e3e3e8; font-size: 1.375rem; }
.rev__big small { display: flex; align-items: center; gap: 6px; margin-top: 8px; color: var(--ch-muted); font-size: .875rem; font-weight: 600; }
.rev__big small svg { width: 16px; height: 16px; flex: none; }
.rev__dist { display: grid; gap: 7px; margin: 0; padding: 0; list-style: none; }
.rev__dist li { display: grid; grid-template-columns: 34px 1fr 26px; align-items: center; gap: 10px; font: 700 .8125rem/1 var(--ch-body); color: var(--ch-muted); font-variant-numeric: tabular-nums; }
.rev__dist li span:last-child { text-align: right; }
.rev__dist i { position: relative; height: 8px; border-radius: 99px; background: #e3e3e8; overflow: hidden; }
.rev__dist i::after { content: ""; position: absolute; top: 0; right: auto; bottom: 0; left: 0; width: var(--w); border-radius: inherit; background: #fbbc04; }
.rev__pk { margin: 4px 0 0; font: 800 .6875rem/1 var(--ch-body); letter-spacing: .14em; text-transform: uppercase; color: var(--ch-muted); }
.rev__praise { display: flex; flex-wrap: wrap; gap: 8px; margin: 0; padding: 0; list-style: none; }
.rev__praise li { display: inline-flex; align-items: center; gap: 6px; min-height: 36px; padding: 0 14px 0 10px; border-radius: 999px; background: #fff; font: 600 .875rem/1 var(--ch-body); box-shadow: 0 0 0 1px rgba(11, 11, 13, .06); }
.rev__praise svg { width: 16px; height: 16px; flex: none; fill: none; stroke: #12a85c; stroke-width: 2.6; stroke-linecap: round; stroke-linejoin: round; }
.rev__all { justify-self: start; }
.rev__l { display: flex; gap: 14px; margin: 0 -20px; padding: 4px 20px 18px; list-style: none; overflow-x: auto; scroll-snap-type: x mandatory; scrollbar-width: none; }
@media (min-width: 700px) { .rev__l { margin: 0 -36px; padding-left: 36px; padding-right: 36px; } } /* mesmo eixo do .wrap (16 / 20 / 36) */
.rev__l::-webkit-scrollbar { display: none; }
@media (max-width: 359px) { .rev__l { margin: 0 -16px; padding-left: 16px; padding-right: 16px; } }
.rv-card { position: relative; flex: 0 0 min(84vw, 360px); scroll-snap-align: center; display: grid; grid-template-rows: auto 1fr auto; gap: 12px; margin: 0; padding: 24px 24px 22px; border-radius: 26px; background: #fff; box-shadow: 0 24px 50px -38px rgba(0, 0, 0, .4); }
.rv-card::before { content: ""; position: absolute; top: 18px; right: 20px; width: 34px; height: 34px; background: rgba(234, 32, 37, .16); pointer-events: none; -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M9.6 5.5C5.9 7 4 9.8 4 13.8V19h6.4v-6.4H7.3c.1-2.4 1.1-4 3.3-5.1zM19.6 5.5C15.9 7 14 9.8 14 13.8V19h6.4v-6.4h-3.1c.1-2.4 1.1-4 3.3-5.1z'/%3E%3C/svg%3E") center / contain no-repeat; mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M9.6 5.5C5.9 7 4 9.8 4 13.8V19h6.4v-6.4H7.3c.1-2.4 1.1-4 3.3-5.1zM19.6 5.5C15.9 7 14 9.8 14 13.8V19h6.4v-6.4h-3.1c.1-2.4 1.1-4 3.3-5.1z'/%3E%3C/svg%3E") center / contain no-repeat; }
.rv-card .stars { --star-off: #e3e3e8; font-size: 1.0625rem; }
.rv-card blockquote { margin: 0; font-size: 1.0625rem; line-height: 1.5; color: var(--ch-ink); }
.rv-card footer { display: flex; align-items: center; gap: 12px; padding-top: 4px; }
.rv-card footer i { flex: none; display: grid; place-items: center; width: 40px; height: 40px; border-radius: 50%; background: hsl(var(--h, 0) 42% 38%); color: #fff; font: 800 .9375rem/1 var(--ch-display); font-style: normal; }
.rv-card footer span { display: grid; gap: 3px; min-width: 0; }
.rv-card footer b { font-weight: 700; }
.rv-card footer small { display: flex; align-items: center; gap: 5px; color: var(--ch-muted); font-size: .8125rem; }
.rv-card footer small svg { width: 13px; height: 13px; flex: none; }
.rev__more { display: none; }
.rev__src { margin: 14px 0 0; color: var(--ch-muted); font-size: .8125rem; line-height: 1.45; }
.rev__src a { color: inherit; }
@media (min-width: 1024px) {
  .rev__g { grid-template-columns: 360px minmax(0, 1fr); gap: 48px; align-items: start; }
  .rev__sum { position: -webkit-sticky; position: sticky; top: 110px; }
  .rev__l { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; margin: 0; padding: 0; overflow: visible; }
  .rv-card { flex: none; }
  .rev:not(.is-all) .rv-card:nth-child(n+7) { display: none; }
  .rev__more { display: flex; justify-self: center; margin-top: 18px; }
  .rev.is-all .rev__more { display: none; }
}
/* agenda v1.0041: destaque com foto + linhas que convidam ao toque */

/* ---------- Conheça os quartos (v1.0019): mais conforto primeiro, econômico explícito, comparação num olhar ---------- */
.sr { position: absolute !important; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
.room__t .room__tag { justify-self: start; margin-bottom: 8px; }
.room__tag { display: inline-flex; align-items: center; gap: 7px; min-height: 34px; padding: 0 14px; border-radius: 999px; font: 800 .75rem/1 var(--ch-body); letter-spacing: .1em; text-transform: uppercase; white-space: nowrap; }
.room__tag svg { width: 15px; height: 15px; fill: currentColor; }
.room__tag--top { color: #fff; background: var(--ch-red); box-shadow: inset 0 1px 0 rgba(255, 255, 255, .35), 0 10px 22px -10px rgba(234, 32, 37, .9); }
.room__tag--eco { color: #101010; background: rgba(255, 255, 255, .92); box-shadow: 0 8px 18px -10px rgba(0, 0, 0, .5); }
.room__note { display: block; margin-top: 4px; font-style: normal; font-size: .875rem; line-height: 1.35; color: rgba(255, 255, 255, .7); }
.room__note--eco { color: #ffd27a; font-weight: 600; }
.room--top .room__a { box-shadow: 0 0 0 2px var(--ch-red), 0 36px 70px -34px rgba(234, 32, 37, .55), 0 30px 60px -36px rgba(11, 11, 13, .6); }
.room--top .room__a:hover { box-shadow: 0 0 0 2px var(--ch-red), 0 50px 80px -36px rgba(234, 32, 37, .6), 0 44px 70px -36px rgba(11, 11, 13, .7); }

.cmp { margin-top: 26px; overflow-x: auto; overscroll-behavior-x: contain; scrollbar-width: none; padding: 18px 14px 14px; border-radius: 28px; background: #fff; box-shadow: 0 0 0 1px rgba(11, 11, 13, .05), 0 30px 60px -48px rgba(11, 11, 13, .5); }
.cmp__h { margin: 0 6px 12px; font: 800 .75rem/1 var(--ch-body); letter-spacing: .2em; text-transform: uppercase; color: var(--ch-muted); }
.cmp__g { display: grid; grid-template-columns: 30px repeat(var(--n, 3), minmax(82px, 1fr)); width: max-content; min-width: 100%; }
.cmp::-webkit-scrollbar { display: none; }
.cmp__r { display: contents; }
.cmp__k, .cmp__c { display: flex; align-items: center; justify-content: center; min-height: 52px; padding: 8px 4px; border-top: 1px solid rgba(11, 11, 13, .07); text-align: center; font-size: .8125rem; font-weight: 600; line-height: 1.2; color: var(--ch-ink); }
.cmp__r--head > * { border-top: 0; min-height: 44px; }
.cmp__k { justify-content: flex-start; color: var(--ch-muted); }
.cmp__k svg { width: 20px; height: 20px; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
.cmp__c { flex-direction: column; gap: 5px; }
.cmp__c.is-top { background: rgba(234, 32, 37, .06); }
.cmp__r--head .cmp__c.is-top { border-radius: 16px 16px 0 0; }
.cmp__r--go .cmp__c.is-top { border-radius: 0 0 16px 16px; }
.cmp__r--go > * { border-top: 0; min-height: 0; padding-top: 2px; padding-bottom: 14px; }
.cmp__go { display: inline-flex; align-items: center; justify-content: center; gap: 6px; width: 100%; max-width: 180px; min-height: 46px; padding: 0 10px; border: 0; border-radius: 999px; background: var(--ch-ink); color: #fff; font: 700 .8125rem/1 var(--ch-body); cursor: pointer; transition: transform .2s var(--ch-ease), background .2s; -webkit-tap-highlight-color: transparent; }
.cmp__go svg { width: 15px; height: 15px; flex: none; fill: none; stroke: currentColor; stroke-width: 2.4; stroke-linecap: round; stroke-linejoin: round; transition: transform .25s var(--ch-ease); }
.cmp__c.is-top .cmp__go { background: var(--ch-red); box-shadow: 0 10px 20px -10px rgba(234, 32, 37, .8); }
.cmp__go:hover svg { transform: translateX(3px); } .cmp__go:active { transform: scale(.96); }
.cmp__go:focus-visible, .cmp__n button:focus-visible { outline: 3px solid var(--ch-red); outline-offset: 2px; }
.cmp__n button { transition: color .2s; } .cmp__n button:hover { color: var(--ch-red); }
.cmp__n button { width: 100%; min-height: 44px; padding: 0 4px; border: 0; background: none; font: 800 .875rem/1.15 var(--ch-display); letter-spacing: -.01em; color: var(--ch-ink); cursor: pointer; }
.cmp__n.is-top button { color: var(--ch-red); }
.cmp__c i { width: 18px; height: 18px; border-radius: 50%; flex: none; background: center / 12px no-repeat; }
.cmp__c.is-y i { background-color: #12a85c; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23fff' stroke-width='3.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 12.5l4.5 4.5L19 7.5'/%3E%3C/svg%3E"); }
.cmp__c.is-n i { background-color: #c9c9cf; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23fff' stroke-width='3.2' stroke-linecap='round'%3E%3Cpath d='M7 7l10 10M17 7L7 17'/%3E%3C/svg%3E"); }
.cmp__c.is-w i { background-color: #f5a524; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23fff' stroke-width='3.4' stroke-linecap='round'%3E%3Cpath d='M12 6v7M12 17.5v.5'/%3E%3C/svg%3E"); }
.cmp__c.is-n { color: var(--ch-muted); }
/* Wi-Fi: uma célula só atravessando todos os tipos — é igual para todo mundo; mesma altura e mesma letra das outras linhas (v1.0041) */
.cmp__wifi { grid-column: 2 / -1; display: flex; align-items: center; justify-content: center; flex-wrap: wrap; gap: 6px 8px; min-height: 52px; padding: 8px 10px; border-top: 1px solid rgba(11, 11, 13, .07); background: rgba(18, 168, 92, .07); font-size: .8125rem; font-weight: 700; line-height: 1.2; color: var(--ch-ink); text-align: center; }
.cmp__wifi i { width: 18px; height: 18px; border-radius: 50%; flex: none; background: #12a85c center / 12px no-repeat url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23fff' stroke-width='3.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 12.5l4.5 4.5L19 7.5'/%3E%3C/svg%3E"); }
.cmp__wifi em { font-style: normal; padding: 3px 8px; border-radius: 999px; background: #12a85c; color: #fff; font-size: .625rem; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; }
.cmp__r--p .cmp__c small { font-size: .6875rem; font-weight: 600; color: var(--ch-muted); }
.cmp__r--p .cmp__c b { font: 900 .9375rem/1 var(--ch-display); letter-spacing: -.02em; font-variant-numeric: tabular-nums; white-space: nowrap; }
@media (max-width: 359px) { .cmp__go svg { display: none; } .cmp__go { font-size: .75rem; padding: 0 6px; } .cmp { padding-left: 8px; padding-right: 8px; } .cmp__g { grid-template-columns: 24px repeat(var(--n, 3), minmax(74px, 1fr)); } .cmp__c { font-size: .75rem; } .cmp__r--p .cmp__c b { font-size: .8125rem; } .cmp__n button { font-size: .8125rem; } }
@media (min-width: 700px) {
  .cmp { margin-top: 34px; padding: 22px 24px 18px; }
  .cmp__g { grid-template-columns: 44px repeat(var(--n, 3), minmax(110px, 1fr)); }
  .cmp__k, .cmp__c { min-height: 58px; font-size: .9375rem; }
  .cmp__c { flex-direction: row; gap: 8px; }
  .cmp__r--p .cmp__c { flex-direction: row; align-items: center; }
  .cmp__r--p .cmp__c small { font-size: .8125rem; }
  .cmp__r--p .cmp__c b { font-size: 1.25rem; }
  .cmp__n button { font-size: 1.0625rem; }
  .cmp__go { min-height: 46px; font-size: .9375rem; }
}
/* computador: a suíte com ar em destaque, grande à esquerda; as outras empilhadas à direita */
@media (min-width: 1024px) {
  .rooms__l.rooms__l--top { grid-template-columns: 1.3fr 1fr; grid-auto-flow: row; grid-template-rows: repeat(2, max(330px, min(25vw, 340px))); grid-auto-rows: max(330px, min(25vw, 340px)); gap: 22px; }
  .rooms__l.rooms__l--top .room { min-width: 0; }
  .rooms__l.rooms__l--top .room--top { grid-row: span 2; }
  .rooms__l.rooms__l--top .room__a { aspect-ratio: auto; height: 100%; }
  .rooms__l.rooms__l--top .room--top .room__b { padding: 32px; gap: 20px; }
  .rooms__l.rooms__l--top .room--top .room__t b { font-size: 2.75rem; letter-spacing: -.035em; }
  .rooms__l.rooms__l--top .room--top .room__p strong { font-size: 1.75rem; }
  .rooms__l.rooms__l--top .room--top .room__pills { left: 22px; top: 22px; }
  .rooms__l.rooms__l--top .room--top .room__tag { min-height: 38px; padding: 0 16px; font-size: .8125rem; margin-bottom: 12px; }
  .rooms__l.rooms__l--top .room:not(.room--top) .room__t b { font-size: 1.625rem; }
  .rooms__l.rooms__l--top .room:not(.room--top) .room__b { gap: 14px; padding: 20px 22px; }
  .rooms__l.rooms__l--top .room:not(.room--top) .room__a img { object-position: 50% 58%; }
  .rooms__l.rooms__l--top .room:not(.room--top) .room__pills .pill:nth-child(n+3) { display: none; } /* cartões menores: o selo que decide (ar ou banheiro) + o tamanho em m² */
  .cmp { max-width: 1200px; margin-left: auto; margin-right: auto; }
}
@media (max-width: 379px) { .rooms__l .room__a { aspect-ratio: 3 / 4.7; } .room__b { padding: 18px; gap: 14px; } }

/* ---------- destaque das suítes 126 e 136 (v1.0075): painel escuro dentro de Acomodações — foto grande parada, nº da suíte sempre à vista ---------- */
.sui { position: relative; isolation: isolate; overflow: hidden; margin-top: 30px; padding: 34px 0; border-radius: 34px; background: #0b0b0d; color: #fff; box-shadow: 0 60px 110px -60px rgba(0, 0, 0, .9), 0 0 0 1px rgba(11, 11, 13, .08); }
.sui__bg { position: absolute; top: 0; right: 0; bottom: 0; left: 0; z-index: -2; }
.sui__bg img { width: 100%; height: 100%; object-fit: cover; object-position: 50% 45%; filter: blur(30px) saturate(115%) brightness(.4); transform: scale(1.15); }
.sui::after { content: ""; position: absolute; top: 0; right: 0; bottom: 0; left: 0; z-index: -1; background: radial-gradient(95% 75% at 18% 8%, rgba(0, 0, 0, .5), rgba(0, 0, 0, .86) 58%, rgba(0, 0, 0, .95) 100%); }
.sui__in { display: grid; grid-template-columns: minmax(0, 1fr); gap: 24px; padding-left: 20px; padding-right: 20px; } /* minmax(0,1fr): sem isso a coluna automática assume a largura máxima do palco (460px) e vaza no celular */
/* no celular a foto vem logo depois do título — é ela que convence */
.sui__in > .sui__head { order: 1; } .sui__in > .sui__tour { order: 2; } .sui__in > .sui__meta { order: 3; }
.sui__h { font: 800 max(1.875rem, min(6.8vw, 2.75rem))/1.06 var(--ch-display); letter-spacing: -.03em; text-wrap: balance; }
.sui__head .lead { max-width: 27em; }
.sui__head .lead b { color: #fff; font-weight: 800; }
/* o que essas duas suítes têm — quatro ícones do mesmo tamanho, alturas idênticas */
.sui__spec { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); grid-auto-rows: 1fr; gap: 10px; } /* 1fr: as quatro caixas ficam exatamente da mesma altura mesmo quando um texto quebra em duas linhas */
.sui__spec li { display: grid; }
.sui__spec button { display: grid; grid-template-columns: 34px minmax(0, 1fr); align-items: center; gap: 12px; width: 100%; min-height: 66px; margin: 0; padding: 12px 14px; border-radius: 18px; background: rgba(255, 255, 255, .07); border: 1px solid rgba(255, 255, 255, .14); -webkit-backdrop-filter: blur(10px); backdrop-filter: blur(10px); color: inherit; font: inherit; text-align: left; cursor: pointer; -webkit-tap-highlight-color: transparent; transition: background .3s ease, border-color .3s ease, transform .3s var(--ch-ease); } /* v1.0100: o selo virou botão e mostra a foto dele */
.sui__spec button:hover { background: rgba(255, 255, 255, .12); border-color: rgba(255, 255, 255, .3); }
.sui__spec button:active { transform: scale(.98); }
.sui__spec button:focus-visible { outline: 2px solid #fff; outline-offset: 2px; }
.sui__spec button.is-on { background: rgba(234, 32, 37, .2); border-color: rgba(255, 106, 109, .6); }
.sui__spec button.is-on i { background: var(--ch-red); }
/* v1.0108: destaque visual no ar quente e frio — primeiro selo da lista */
.sui__spec li:first-child button { background: rgba(234, 32, 37, .12); border-color: rgba(234, 32, 37, .35); }
.sui__spec li:first-child button i { background: rgba(234, 32, 37, .25); }
.sui__spec li:first-child button:hover { background: rgba(234, 32, 37, .18); border-color: rgba(234, 32, 37, .5); }
.sui__spec li:first-child button.is-on { background: rgba(234, 32, 37, .3); border-color: var(--ch-red); }
.sui__spec i { transition: background .3s ease; }
.sui__spec i { display: grid; place-items: center; width: 34px; height: 34px; border-radius: 11px; background: rgba(255, 255, 255, .1); }
.sui__spec svg { width: 20px; height: 20px; fill: none; stroke: #fff; stroke-width: 1.7; stroke-linecap: round; stroke-linejoin: round; }
.sui__spec span { font: 700 .8125rem/1.25 var(--ch-body); color: rgba(255, 255, 255, .84); }
.sui__go { margin-top: 18px; width: 100%; }
/* o palco: a foto da suíte, parada e grande */
.sui__tour { width: 100%; max-width: 460px; margin-left: auto; margin-right: auto; }
.sui__stage { position: relative; aspect-ratio: 3 / 4; border-radius: 28px; overflow: hidden; background: #111; border: 1px solid rgba(255, 255, 255, .16); box-shadow: 0 50px 90px -50px rgba(0, 0, 0, 1), inset 0 1px 0 rgba(255, 255, 255, .14); -webkit-user-select: none; user-select: none; touch-action: pan-y; }
.sui__v { position: absolute; top: 0; right: 0; bottom: 0; left: 0; margin: 0; opacity: 0; visibility: hidden; transition: opacity .55s ease, visibility .55s; }
.sui__v.is-on { opacity: 1; visibility: visible; }
.sui__v img { width: 100%; height: 100%; object-fit: cover; }
.sui__v figcaption { position: absolute; left: 0; right: 0; bottom: 0; display: grid; gap: 4px; padding: 56px 18px 18px; background: linear-gradient(180deg, rgba(0, 0, 0, 0), rgba(0, 0, 0, .82) 58%, rgba(0, 0, 0, .93)); }
.sui__v figcaption b { font: 800 1.25rem/1.15 var(--ch-display); letter-spacing: -.025em; }
.sui__v figcaption small { font-size: .8125rem; line-height: 1.45; color: rgba(255, 255, 255, .82); }
/* a etiqueta com o número da suíte e o contador: mesma altura, mesma distância do topo */
.sui__tag { position: absolute; top: 14px; left: 14px; z-index: 1; display: inline-flex; align-items: center; gap: 7px; height: 32px; padding: 0 13px; border-radius: 999px; background: rgba(234, 32, 37, .94); border: 1px solid rgba(255, 255, 255, .24); font: 700 .75rem/1 var(--ch-body); letter-spacing: .02em; box-shadow: 0 16px 32px -18px rgba(234, 32, 37, .95), inset 0 1px 0 rgba(255, 255, 255, .28); }
.sui__tag b { font: 800 .9375rem/1 var(--ch-display); letter-spacing: .01em; }
.sui__step { position: absolute; top: 14px; right: 14px; z-index: 1; display: inline-flex; align-items: center; height: 32px; padding: 0 13px; border-radius: 999px; background: rgba(0, 0, 0, .5); -webkit-backdrop-filter: blur(10px); backdrop-filter: blur(10px); border: 1px solid rgba(255, 255, 255, .18); font: 800 .75rem/1 var(--ch-body); letter-spacing: .04em; }
.sui__step i { font-style: normal; opacity: .55; }
/* as miniaturas: 3 colunas, linhas de altura igual (grid-auto-rows) */
.sui__thumbs { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); grid-auto-rows: 1fr; gap: 8px; margin-top: 10px; }
.sui__th { position: relative; overflow: hidden; display: grid; grid-template-rows: 64px minmax(0, 1fr); padding: 0; border: 1px solid rgba(255, 255, 255, .16); border-radius: 16px; background: rgba(255, 255, 255, .06); cursor: pointer; transition: border-color .35s, transform .4s var(--ch-ease), box-shadow .4s; -webkit-tap-highlight-color: transparent; }
.sui__th img { width: 100%; height: 64px; object-fit: cover; opacity: .5; transition: opacity .4s ease; }
.sui__th span { display: flex; align-items: center; justify-content: center; gap: 6px; min-height: 38px; padding: 7px 6px; font: 700 .6875rem/1.15 var(--ch-body); color: rgba(255, 255, 255, .72); transition: color .35s; text-align: center; }
.sui__th i { flex: none; padding: 4px 6px; border-radius: 6px; background: rgba(255, 255, 255, .14); color: #fff; font: 800 .625rem/1 var(--ch-display); font-style: normal; letter-spacing: .04em; transition: background-color .35s; }
.sui__th:hover { transform: translateY(-3px); } .sui__th:hover img { opacity: .85; }
.sui__th.is-on { border-color: var(--ch-red); box-shadow: 0 0 0 1px var(--ch-red), 0 22px 40px -26px rgba(234, 32, 37, .9); }
.sui__th.is-on img { opacity: 1; } .sui__th.is-on span { color: #fff; } .sui__th.is-on i { background: var(--ch-red); }
.sui__th:focus-visible { outline: 3px solid var(--ch-red); outline-offset: 3px; }
@media (min-width: 700px) {
  .sui { padding: 46px 0; border-radius: 40px; }
  .sui__in { gap: 28px; padding-left: 32px; padding-right: 32px; }
  .sui__spec { grid-template-columns: repeat(4, minmax(0, 1fr)); }
  .sui__go { width: auto; }
  .sui__th { grid-template-rows: 88px minmax(0, 1fr); } .sui__th img { height: 88px; }
  .sui__v figcaption { padding: 60px 22px 20px; } .sui__v figcaption b { font-size: 1.375rem; } .sui__v figcaption small { font-size: .875rem; }
}
@media (min-width: 1024px) {
  .sui { padding: 56px 0; }
  .sui__in { grid-template-columns: minmax(0, 1fr) minmax(0, .95fr); grid-template-areas: "head tour" "meta tour"; gap: 26px 48px; align-content: center; padding-left: 44px; padding-right: 44px; }
  .sui__in > .sui__head { grid-area: head; align-self: end; } .sui__in > .sui__meta { grid-area: meta; align-self: start; } .sui__in > .sui__tour { grid-area: tour; align-self: center; }
  .sui__spec { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }
  .sui__tour { max-width: 470px; margin-left: 0; margin-right: 0; justify-self: end; }
}
@media (prefers-reduced-motion: reduce) { .sui__v { transition: none; } .sui__th { transition: none; } }

/* ---------- Sem letra miúda (v1.0020): horários em destaque, "Tem / Não tem" em palavras simples ---------- */
.rooms__wait { display: flex; flex-wrap: wrap; align-items: center; gap: 14px; margin: 0 0 8px; color: var(--ch-muted); font-weight: 600; }
.know__h .h2 { max-width: 12em; }
.clock { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 1px; overflow: hidden; border-radius: 28px; background: rgba(255, 255, 255, .12); color: #fff; background-color: #101010; box-shadow: 0 34px 70px -44px rgba(11, 11, 13, .8); }
.clock__i { display: grid; align-content: start; gap: 6px; padding: 22px 18px 20px; background: #101010; }
.clock__i + .clock__i { border-left: 1px solid rgba(255, 255, 255, .12); }
.clock__i small { font-size: .75rem; font-weight: 800; letter-spacing: .2em; text-transform: uppercase; color: #ff5a5f; }
.clock__i b { font: 900 max(1.875rem, min(9vw, 3.75rem))/1 var(--ch-display); letter-spacing: -.04em; white-space: nowrap; font-variant-numeric: tabular-nums; }
.clock__i b i { font-style: normal; font-size: .45em; font-weight: 600; letter-spacing: 0; color: rgba(255, 255, 255, .6); }
.clock__i span { font-size: .875rem; line-height: 1.4; color: rgba(255, 255, 255, .72); }
.clock__n { grid-column: 1 / -1; display: flex; align-items: center; gap: 10px; margin: 0; padding: 14px 18px; background: var(--ch-red); font-weight: 700; font-size: .9375rem; line-height: 1.35; }
.clock__n svg { flex: none; width: 22px; height: 22px; fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }
/* ===== "Sem letra miúda" (v1.0066): um painel só, filtrável. Cada linha tem ícone, selo e uma frase — verde = tem, grafite = não tem. ===== */
/* ===== CARTA AO HÓSPEDE (v1.0073) — o "sem letra miúda" é uma folha de papel creme com a margem vermelha do caderno.
   Tinta quente (#3a322c), nada de preto; o vermelho da marca só no visto, na margem e no carimbo. ===== */
.ct { --pa: #f9f2e4; --pa2: #f0e7d6; --tint: #38302a; --tint-2: #877c70; --rule: rgba(56, 48, 42, .16); margin-top: 18px; }
.ct__p { position: relative; overflow: hidden; padding: 30px 22px 26px 30px; border-radius: 22px 6px 6px 22px; color: var(--tint);
  background: linear-gradient(180deg, var(--pa) 0%, var(--pa2) 100%);
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='140' height='140'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='4'/%3E%3C/filter%3E%3Crect width='140' height='140' filter='url(%23n)' opacity='.07'/%3E%3C/svg%3E"), linear-gradient(180deg, var(--pa) 0%, var(--pa2) 100%);
  box-shadow: 0 0 0 1px rgba(58, 50, 44, .1), 0 30px 60px -48px rgba(58, 50, 44, .85); }
/* a margem vermelha do caderno */
.ct__p::before { content: ''; position: absolute; left: 14px; top: 0; bottom: 0; width: 1.5px; background: rgba(234, 32, 37, .55); }
.ct__p::after { content: ''; position: absolute; top: 0; right: 0; bottom: 0; left: 0; pointer-events: none; border-radius: inherit; box-shadow: inset 0 0 40px rgba(120, 96, 64, .09); } /* leve sombra de papel nas bordas */
.ct__holes { position: absolute; left: 3px; top: 12%; bottom: 12%; width: 8px; display: grid; align-content: space-between; }
.ct__holes i { display: block; width: 7px; height: 7px; border-radius: 50%; background: rgba(58, 50, 44, .1); box-shadow: inset 0 1px 1px rgba(58, 50, 44, .18); }
/* timbre */
.ct__h { display: flex; flex-wrap: wrap; align-items: flex-end; justify-content: space-between; gap: 12px; padding-bottom: 14px; border-bottom: 1.5px solid rgba(234, 32, 37, .35); }
.ct__brand { font: 900 1.3125rem/1 var(--ch-display); letter-spacing: -.03em; }
.ct__brand small { display: block; margin-top: 6px; font: 700 .625rem/1 var(--ch-body); letter-spacing: .24em; text-transform: uppercase; color: var(--tint-2); }
.ct__n { display: flex; align-items: baseline; gap: 8px; }
.ct__n b { font: 900 1.625rem/1 var(--ch-display); letter-spacing: -.04em; color: var(--ch-red); font-variant-numeric: tabular-nums; }
.ct__n span { font: 700 .625rem/1.3 var(--ch-body); letter-spacing: .16em; text-transform: uppercase; color: var(--tint-2); max-width: 7em; }
.ct__lede { margin: 18px 0 4px; max-width: 46em; font-size: 1rem; line-height: 1.6; color: #554c45; }
/* as duas colunas escritas na folha */
.ct__b { display: grid; gap: 4px; }
.ct__col { padding: 14px 0 2px; }
.ct__k { margin-bottom: 4px; font: 800 .6875rem/1 var(--ch-body); letter-spacing: .2em; text-transform: uppercase; color: var(--ch-red); }
.ct__col--n .ct__k { color: var(--tint-2); }
.ct__col li { display: grid; grid-template-columns: 30px minmax(0, 1fr); gap: 0 12px; align-items: start; padding: 13px 0; border-bottom: 1px solid var(--rule); }
.ct__col li:last-child { border-bottom: 0; }
.ct__v { margin-top: 3px; display: block; width: 30px; }
.ct__v svg { display: block; width: 26px; height: 20px; fill: none; stroke: var(--ch-red); stroke-width: 2.6; stroke-linecap: round; stroke-linejoin: round; }
.ct__col--n .ct__v svg { stroke: rgba(58, 50, 44, .32); stroke-width: 2.2; }
/* v1.0131 — sob consulta */
.ct__col--ask .ct__k { color: #b06000; }
.ct__v--ask svg { stroke: #b06000 !important; stroke-width: 2 !important; }
.ct__col--ask li b { color: #5c3a00; }

.ct__col li b { display: block; font: 700 1.0625rem/1.3 var(--ch-body); letter-spacing: -.02em; text-wrap: pretty; }
.ct__col--n li b { color: #665c54; }
.ct__col li small { display: block; margin-top: 4px; font-size: .875rem; line-height: 1.5; color: var(--tint-2); text-wrap: pretty; }
/* rodapé da carta: horários e assinatura */
.ct__f { display: grid; gap: 22px; margin-top: 20px; padding-top: 20px; border-top: 1.5px solid rgba(234, 32, 37, .28); }
.ct__times { display: grid; grid-template-columns: repeat(auto-fit, minmax(84px, 1fr)); gap: 14px 10px; align-items: end; }
.ct__times dt { font: 800 .625rem/1 var(--ch-body); letter-spacing: .14em; text-transform: uppercase; color: var(--tint-2); }
.ct__times dd { margin: 6px 0 0; font: 900 max(.9375rem, min(4.2vw, 1.0625rem))/1 var(--ch-display); letter-spacing: -.02em; white-space: nowrap; }
.ct__times dd i { font-style: normal; font-weight: 700; font-size: .75rem; color: var(--tint-2); }
.ct__sign { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 16px 18px; }
/* QR de verdade: aponta a câmera e cai na reserva (v1.0074) */
.ct__qr { display: inline-flex; align-items: center; gap: 12px; padding: 10px 14px 10px 10px; border-radius: 16px; text-decoration: none; color: inherit; background: rgba(255, 255, 255, .55); border: 1px solid rgba(56, 48, 42, .14); transition: transform .4s var(--ch-ease), box-shadow .4s, border-color .3s; -webkit-tap-highlight-color: transparent; }
.ct__qr img { width: 72px; height: 72px; display: block; }
.ct__qr b { display: block; font: 700 .9375rem/1.2 var(--ch-body); letter-spacing: -.01em; }
.ct__qr small { display: block; margin-top: 3px; font-size: .8125rem; color: var(--tint-2); }
.ct__qr:hover { transform: translateY(-2px); border-color: rgba(234, 32, 37, .35); box-shadow: 0 18px 30px -24px rgba(56, 48, 42, .9); }
@media (min-width: 700px) { .ct__qr img { width: 84px; height: 84px; } }
.ct__by { display: grid; gap: 8px; font: 700 .75rem/1.3 var(--ch-body); letter-spacing: .04em; color: var(--tint-2); }
.ct__rule { display: block; width: 168px; height: 1.5px; background: rgba(58, 50, 44, .35); }
.ct__seal { flex: none; display: grid; justify-items: center; gap: 3px; padding: 11px 16px; border: 2.5px solid rgba(234, 32, 37, .45); border-radius: 12px; color: var(--ch-red); transform: rotate(-6deg); }
.ct__seal b { font: 900 .875rem/1 var(--ch-display); letter-spacing: .16em; text-transform: uppercase; }
.ct__seal small { font: 700 .5rem/1 var(--ch-body); letter-spacing: .14em; text-transform: uppercase; opacity: .7; }
.ct__foot { margin-top: 16px; padding-left: 4px; padding-right: 4px; font-size: .875rem; line-height: 1.5; color: var(--ch-muted); max-width: 46em; }
@media (min-width: 700px) {
  .ct__p { padding: 38px 34px 30px 46px; border-radius: 26px 8px 8px 26px; }
  .ct__p::before { left: 26px; }
  .ct__holes { left: 10px; }
  .ct__b { grid-template-columns: 1fr 1fr 1fr; gap: 0 30px; }
  .ct__b--2 { grid-template-columns: 1fr 1fr; } .ct__b--1 { grid-template-columns: minmax(0, 1fr); } /* v1.0173: coluna sem itens some (lista editável no painel) */
  .ct__col + .ct__col { padding-left: 18px; border-left: 1px solid var(--rule); margin-left: -18px; }
  .ct__times { grid-template-columns: repeat(3, auto); justify-content: start; gap: 40px; }
  .ct__sign { justify-content: flex-end; }
  .ct__f { grid-template-columns: minmax(0, auto) minmax(0, 1fr); align-items: end; gap: 30px; }
}
@media (min-width: 1024px) {
  .ct__p { padding: 44px 44px 34px 58px; }
  .ct__p::before { left: 34px; } .ct__holes { left: 16px; }
  .ct__brand { font-size: 1.5rem; }
  .ct__lede { font-size: 1.0625rem; max-width: 52em; }
}
.facts { display: grid; gap: 14px; margin-top: 14px; }
.fact { display: grid; gap: 6px; padding: 20px 20px 22px; border-radius: 24px; background: #fff; box-shadow: 0 0 0 1px rgba(11, 11, 13, .05); }
.fact small { font-size: .75rem; font-weight: 800; letter-spacing: .18em; text-transform: uppercase; color: var(--ch-red); }
.fact b { font: 900 1.5rem/1.1 var(--ch-display); letter-spacing: -.03em; }
.fact span { font-size: .9375rem; line-height: 1.5; color: var(--ch-ink-2, #3a3a40); }
.fact a { color: inherit; font-weight: 700; display: inline-block; padding: 9px 2px; margin: -9px -2px; } /* v1.0184: área de toque de 36 px sem mexer no texto (antes 18 px de altura) */
@media (max-width: 359px) { .clock__i { padding: 18px 14px; } .clock__i span { font-size: .8125rem; } }
@media (min-width: 700px) {
  .clock__i { padding: 30px 32px 28px; gap: 10px; }
  .clock__i span { font-size: 1rem; max-width: 26em; }
  .clock__n { padding: 16px 32px; font-size: 1.0625rem; }
  .facts { grid-template-columns: 1fr 1fr; gap: 18px; margin-top: 18px; }
  .fact { padding: 24px 28px 26px; }
}
/* dia do "a partir de" (v1.0041): o preço da vitrine é o menor com vaga, ao vivo da Stays */
.room__when, .cmp__when { display: inline-flex; align-items: center; gap: 5px; font-style: normal; font-weight: 700; white-space: nowrap; }
.room__when { flex-basis: 100%; margin-top: 2px; font-size: .75rem; color: #ffd27a; }
.room__when svg, .cmp__when svg { width: 13px; height: 13px; flex: none; fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; }
.cmp__when { font-size: .6875rem; color: var(--ch-red); }
.cmp__r--p .cmp__c { flex-wrap: wrap; row-gap: 3px; }
@media (min-width: 700px) { .cmp__when { flex-basis: 100%; justify-content: center; font-size: .75rem; } }

/* ================= v1.0041 · computador: barra de reserva sempre no topo ================= */
.tbk { display: none; }
@media (min-width: 1024px) {
  html.tbk-on .nav, html.tbk-on .top__book { display: none; }
  html.tbk-on .tbk { display: flex; }
  html.tbk-on .top__in { box-shadow: 0 22px 48px -24px rgba(0, 0, 0, .6), 0 0 0 1px rgba(11, 11, 13, .06), inset 0 1px 0 #fff; }
  .tbk { flex: 0 1 760px; min-width: 0; align-items: center; height: 58px; margin-left: auto; margin-right: auto; padding: 5px 5px 5px 6px; border-radius: 999px; background: #fff; box-shadow: 0 0 0 1px rgba(11, 11, 13, .09), 0 12px 26px -18px rgba(11, 11, 13, .45); }
  .tbk__f { position: relative; flex: 1 1 0; min-width: 0; display: flex; align-items: center; gap: 10px; height: 48px; padding: 0 16px; border: 0; border-radius: 999px; background: transparent; color: var(--ch-ink); text-align: left; cursor: pointer; transition: background .2s; }
  .tbk__f + .tbk__f::before { content: ""; position: absolute; left: 0; top: 12px; bottom: 12px; width: 1px; background: rgba(11, 11, 13, .1); }
  .tbk__f:hover { background: rgba(11, 11, 13, .05); }
  .tbk__f svg, .tbk__go svg { flex: none; width: 20px; height: 20px; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
  .tbk__f svg { color: var(--ch-red); }
  .tbk__f > span { display: grid; min-width: 0; line-height: 1.2; }
  .tbk__f small { font: 700 .75rem/1.2 var(--ch-body); color: var(--ch-ink); }
  .tbk__f b { font: 500 .875rem/1.3 var(--ch-body); color: var(--ch-muted); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
  .tbk__f b.is-filled { color: var(--ch-ink); font-weight: 700; }
  .tbk__go { flex: none; display: inline-flex; align-items: center; gap: 8px; height: 48px; margin-left: 6px; padding: 0 22px 0 18px; border: 0; border-radius: 999px; background: linear-gradient(160deg, var(--ch-red-bright), var(--ch-red) 45%, var(--ch-red-deep)); color: #fff; font: 700 .9375rem/1 var(--ch-body); cursor: pointer; box-shadow: inset 0 1px 0 rgba(255, 255, 255, .3), 0 10px 22px -12px rgba(234, 32, 37, .9); transition: filter .2s, transform .2s; }
  .tbk__go:hover { filter: brightness(1.06); transform: translateY(-1px); }
  .tbk__go:active { transform: scale(.97); }
  .tbk__f:focus-visible, .tbk__go:focus-visible { outline: 3px solid rgba(234, 32, 37, .45); outline-offset: 2px; }
}
@media (min-width: 1024px) and (max-width: 1179px) { .tbk__f { padding: 0 12px; gap: 8px; } .tbk__f svg { display: none; } .tbk__go { padding: 0 18px 0 14px; } }

/* ---------- nossa história: o corredor — cada porta abre um capítulo (v1.0041) ----------
 * Tudo é movido por variáveis CSS que o site.js grava (--open: porta 0→1, --tx: texto 0→1, --walk: caminhada pelo corredor),
 * por isso funciona igual com "reduzir movimento" ligado. No computador a rolagem prende a cena e abre porta por porta; no celular cada porta abre ao aparecer. */
.story { position: relative; padding: 0; background: #0b0b0d; color: #fff; overflow: clip; isolation: isolate; }
.story__pin { position: relative; padding: 84px 0 72px; }
.story__bg { position: absolute; top: 0; right: 0; bottom: 0; left: 0; z-index: 0; overflow: hidden; background: #0b0b0d; }
.story__bg img { width: 100%; height: 100%; object-fit: cover; object-position: 50% 42%; opacity: .34; filter: saturate(.55); transform-origin: 50% 44%; transform: scale(calc(1.02 + var(--walk, 0) * .1)); will-change: transform; }
.story__bg::after { content: ""; position: absolute; top: 0; right: 0; bottom: 0; left: 0; background: linear-gradient(180deg, rgba(11, 11, 13, .6) 0%, rgba(11, 11, 13, .3) 38%, rgba(11, 11, 13, .55) 70%, rgba(11, 11, 13, .96) 100%); }
/* partículas de poeira flutuando no corredor (efeito cinematográfico) */
.story__dust { position: absolute; top: 0; right: 0; bottom: 0; left: 0; pointer-events: none; z-index: 1; }
.story__dust i { position: absolute; background: rgba(255, 255, 240, .55); border-radius: 50%; box-shadow: 0 0 6px rgba(255, 240, 200, .55); animation: dustFloat 18s linear infinite, dustGlow 2.4s ease-in-out infinite; }
@keyframes dustFloat { from { transform: translate(0, 0); } to { transform: translate(40px, -120px); } }
@keyframes dustGlow { 0%, 100% { opacity: 0.15; } 50% { opacity: 0.9; } }
/* vinheta sutil que aprofunda as bordas */
.story__vignette { position: absolute; top: 0; right: 0; bottom: 0; left: 0; background: radial-gradient(ellipse at center, transparent 40%, rgba(0, 0, 0, .55) 100%); pointer-events: none; }

.story__in { position: relative; z-index: 2; }
.story__t { max-width: 11em; }
.story__l { max-width: 26em; }
.story__rail, .story__hint, .story__progress { display: none; }
.story__stage { display: grid; gap: 64px; margin-top: 52px; }
.story__ch { --tx: 1; display: grid; gap: 24px; }
.story__ch { --p: 1; --q: 0; --vx: 0px; --vy: 0px; }
.story__v { display: block; width: min(100%, 340px); aspect-ratio: 3 / 4; }
.story__card { position: relative; display: block; width: 100%; height: 100%; border-radius: 28px; overflow: hidden; background: #111; box-shadow: 0 50px 90px -40px rgba(0, 0, 0, .95), 0 0 0 1px rgba(255, 255, 255, .1);
  transform: translateY(calc((1 - var(--p)) * 22px)) scale(calc(1 + (1 - var(--p)) * .04 - var(--q) * .03)); opacity: min(var(--p), calc(1 - var(--q))); will-change: transform, opacity; }
.story__card img { width: 100%; height: 100%; object-fit: cover; filter: brightness(calc(.55 + var(--p) * .45)) blur(calc((1 - var(--p)) * 7px + var(--q) * 5px)); transform: scale(1.06); }
.story__card::after { content: ""; position: absolute; top: 0; right: 0; bottom: 0; left: 0; background: linear-gradient(180deg, rgba(0, 0, 0, 0) 58%, rgba(0, 0, 0, .6) 100%); pointer-events: none; }
.story__cap { position: absolute; left: 16px; right: 16px; bottom: 16px; z-index: 1; display: flex; align-items: center; gap: 10px; color: #fff; font: 700 .875rem/1.2 var(--ch-body); text-shadow: 0 1px 2px rgba(0, 0, 0, .6); }
.story__cap b { display: grid; place-items: center; min-width: 40px; height: 28px; padding: 0 8px; border-radius: 6px; background: #38363a; color: #fff; font: 800 .8125rem/1 var(--ch-display); letter-spacing: .06em; box-shadow: inset 0 1px 0 rgba(255, 255, 255, .14); }
.story__term { position: absolute; z-index: 1; width: 10px; height: 10px; margin: -5px 0 0 -5px; border-radius: 50%; background: #2fd47a; box-shadow: 0 0 10px 3px rgba(47, 212, 122, .85); opacity: max(0, min(calc((var(--p) - .8) / .2), 1)); animation: pulse 1.6s infinite; }
.story__text { opacity: var(--tx); transform: translateY(calc((1 - var(--tx)) * 26px)); }
.story__k { display: flex; align-items: center; gap: 14px; font-size: .75rem; font-weight: 700; letter-spacing: .2em; text-transform: uppercase; color: rgba(255, 255, 255, .62); }
.story__k b { font: 900 2.5rem/1 var(--ch-display); letter-spacing: -.045em; color: var(--ch-red); font-variant-numeric: tabular-nums; }
.story__ht { margin-top: 12px; font: 800 max(1.75rem, min(6.6vw, 2.5rem))/1.06 var(--ch-display); letter-spacing: -.03em; text-wrap: balance; max-width: 13em; }
.story__p { margin-top: 16px; max-width: 30em; font-size: 1.125rem; line-height: 1.55; font-weight: 500; color: rgba(255, 255, 255, .8); }
.story__cta { margin-top: 26px; }

/* === barra de progresso superior (sempre visível) === */
.story__progress { position: relative; display: flex; align-items: center; gap: 14px; margin: 36px 0 12px; max-width: 320px; }
.story__progress-bar { position: relative; flex: 1; height: 3px; border-radius: 2px; background: rgba(255, 255, 255, .12); overflow: hidden; }
.story__progress-bar i { display: block; height: 100%; width: calc(100% * var(--p, 0)); background: linear-gradient(90deg, var(--ch-red) 0%, #ff5e5e 100%); box-shadow: 0 0 8px rgba(234, 32, 37, .6); transition: width .4s cubic-bezier(0.16, 1, 0.3, 1); }
.story__progress-num { display: flex; align-items: baseline; gap: 4px; font: 800 0.875rem/1 var(--ch-display); letter-spacing: .04em; color: #fff; font-variant-numeric: tabular-nums; }
.story__progress-num b { color: var(--ch-red); }
.story__progress-num em { font-style: normal; color: rgba(255, 255, 255, .45); font-size: 0.75rem; }

/* === chip do capítulo (com barra de progresso própria no item ativo) === */
.story__chip { position: relative; display: flex; align-items: center; gap: 12px; width: 100%; padding: 8px 10px 8px 8px; border: 0; border-radius: 14px; background: transparent; color: rgba(255, 255, 255, .45); font: 600 .875rem/1.2 var(--ch-body); text-align: left; cursor: pointer; overflow: hidden; transition: color 0.3s var(--ch-ease), background 0.3s; }
.story__chip::before { content: ""; position: absolute; left: 0; top: 0; bottom: 0; width: 3px; background: var(--ch-red); border-radius: 0 2px 2px 0; transform: scaleY(0); transform-origin: center; transition: transform 0.3s var(--ch-ease); }
.story__chip i { display: grid; place-items: center; flex: none; width: 42px; height: 30px; border-radius: 4px; background: #38363a; color: #fff; font: 800 .8125rem/1 var(--ch-display); letter-spacing: .06em; font-style: normal; box-shadow: inset 0 1px 0 rgba(255, 255, 255, .12); transition: all 0.3s var(--ch-ease); }
.story__chip b { position: absolute; right: 8px; top: 50%; transform: translateY(-50%); width: 6px; height: 6px; border-radius: 50%; background: var(--ch-red); box-shadow: 0 0 8px var(--ch-red); opacity: 0; transition: opacity 0.3s; }
.story__chip span { flex: 1; transition: transform 0.3s var(--ch-ease); }
.story__chip:hover { background: rgba(255, 255, 255, .07); color: #fff; }
.story__chip:hover i { background: #444; }
.story__chip:hover span { transform: translateX(2px); }
.story__chip.is-past { color: rgba(255, 255, 255, .65); }
.story__chip.is-past i { background: #3a3a3f; }
.story__chip.is-on { color: #fff; background: rgba(234, 32, 37, .08); }
.story__chip.is-on::before { transform: scaleY(1); }
.story__chip.is-on i { background: var(--ch-red); box-shadow: 0 0 0 4px rgba(234, 32, 37, .22), 0 0 12px rgba(234, 32, 37, .5); transform: scale(1.06); }
.story__chip.is-on b { opacity: 1; animation: chipPulse 1.6s ease-in-out infinite; }
.story__chip.is-on span { transform: translateX(4px); font-weight: 700; }
@keyframes chipPulse { 0%, 100% { transform: translateY(-50%) scale(1); opacity: 1; } 50% { transform: translateY(-50%) scale(1.4); opacity: 0.6; } }

/* === efeito de "depth of field": o card não-em-foco desfoca === */
html.story-desk .story__ch { filter: blur(calc(var(--vis, 0) > 0.5 ? 0px : 6px)) saturate(calc(var(--vis, 0) > 0.5 ? 1 : 0.7)); opacity: calc(var(--vis, 0) * 0.3); transition: filter 0.5s var(--ch-ease), opacity 0.5s var(--ch-ease); }
html.story-desk .story__ch.is-on { filter: blur(0) saturate(1); opacity: 1; }

@media (min-width: 700px) {
  .story__ch { grid-template-columns: minmax(0, 300px) minmax(0, 1fr); gap: 40px; align-items: center; }
  .story__v { width: 100%; }
}
@media (min-width: 1024px) {
  html.story-desk .story { height: calc((var(--n, 5) + 1) * 100vh); }
  html.story-desk .story__pin { position: -webkit-sticky; position: sticky; top: 0; height: 100vh; padding: 0; overflow: hidden; }
  html.story-desk .story__in { max-width: 1320px; display: grid; grid-template-columns: 230px minmax(0, 1fr); grid-template-rows: auto auto 1fr; column-gap: 56px; row-gap: 16px; height: 100%; padding: 96px 56px 80px; }
  html.story-desk .story__h { grid-column: 1 / -1; display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 30em); align-items: end; column-gap: 56px; }
  html.story-desk .story__h .eyebrow { grid-column: 1 / -1; margin-bottom: 10px; }
  html.story-desk .story__progress { grid-column: 1 / -1; max-width: none; margin: 0 0 4px; }
  html.story-desk .story__t { font-size: max(2rem, min(3.1vw, 2.875rem)); max-width: 13em; }
  html.story-desk .story__l { margin-top: 0; font-size: 1.0625rem; }
  html.story-desk .story__rail { display: grid; align-content: start; gap: 6px; }
  html.story-desk .story__ch { position: absolute; top: 0; right: 0; bottom: 0; left: 0; display: grid; grid-template-columns: minmax(280px, 46%) minmax(0, 1fr); align-items: center; gap: 72px; opacity: var(--vis, 0); visibility: hidden; }
  html.story-desk .story__ch.is-on { visibility: visible; }
  html.story-desk .story__v { width: min(100%, calc((100vh - 360px) * .75)); justify-self: end; }
  html.story-desk .story__ht { font-size: max(2rem, min(3.3vw, 3.25rem)); max-width: 12em; }
  html.story-desk .story__p { font-size: 1.1875rem; max-width: 28em; }
  html.story-desk .story__k b { font-size: 3rem; }
  html.story-desk .story__hint { position: absolute; left: 0; right: 0; bottom: 22px; display: flex; align-items: center; justify-content: center; gap: 10px; font-size: .75rem; font-weight: 700; letter-spacing: .18em; text-transform: uppercase; color: rgba(255, 255, 255, .5); }
  html.story-desk .story__hint span { width: 8px; height: 8px; border-radius: 50%; background: var(--ch-red); box-shadow: 0 0 0 5px rgba(234, 32, 37, .22); }
  html.story-desk .story.is-end .story__hint { opacity: 0; }
}
/* v1.0184: aqui havia uma chave "}" sobrando — o navegador jogava fora a regra seguinte (.scene__line nunca ia para a GPU) */
/* celular: vidro mais leve (menos desfoque = rolagem mais lisa sobre a cena) e as frases da cena compostas na GPU */
.scene__line { will-change: opacity, transform; }
@media (max-width: 1023.98px) {
  .top__in { -webkit-backdrop-filter: blur(14px) saturate(160%); backdrop-filter: blur(14px) saturate(160%); }
  .tabbar { -webkit-backdrop-filter: blur(14px) saturate(160%); backdrop-filter: blur(14px) saturate(160%); }
}
/* ===== a caminhada do hóspede (v1.0041): 4 passos por cima do corredor; cada um mostra a coisa real acontecendo. Tudo por variáveis CSS: --p (0→1 do passo), --r/--k/--c (texto) ===== */
.scene__line { display: grid; align-content: center; justify-items: center; gap: 28px; }
.sl__h { position: relative; display: grid; justify-items: center; gap: 16px; padding: 24px 8px; }
.sl__h::before { content: ""; position: absolute; top: -10%; right: -20%; bottom: -10%; left: -20%; z-index: -1; background: radial-gradient(60% 60% at 50% 50%, rgba(0, 0, 0, .62), rgba(0, 0, 0, 0) 100%); pointer-events: none; } /* sombra suave atrás do texto: lê em cima de qualquer trecho da foto */
.sl__k { display: inline-flex; align-items: center; gap: 10px; padding: 9px 16px 9px 13px; border-radius: 999px; background: rgba(0, 0, 0, .55); border: 1px solid rgba(143, 245, 181, .35); font: 800 .875rem/1 var(--ch-body); letter-spacing: .08em; text-transform: uppercase; color: #8ff5b5; opacity: var(--k, 1); transform: translateY(calc((1 - var(--k, 1)) * 12px)); }
.sl__k--ok b { width: 9px; height: 9px; border-radius: 50%; background: #2fd47a; box-shadow: 0 0 0 0 rgba(47, 212, 122, .7); animation: pulse 1.6s infinite; }
.sl__w { position: relative; display: inline-block; max-width: 100%; }
.sl__t { display: block; text-transform: uppercase; letter-spacing: -.02em; -webkit-clip-path: inset(-.2em calc((1 - var(--r, 1)) * 100%) -.2em -.1em); clip-path: inset(-.2em calc((1 - var(--r, 1)) * 100%) -.2em -.1em); }
.sl__bar { position: absolute; top: -.06em; bottom: -.04em; left: 0; right: 0; opacity: var(--b, 0); pointer-events: none; transform: translateX(calc(var(--r, 1) * 100%)); } /* v1.0184: a barra que acompanha a frase anda por transform (antes "left", recalculando a página a cada quadro da rolagem — o Google contava como "layout shift" no celular) */
.sl__bar::before { content: ""; position: absolute; top: 0; bottom: 0; left: -1px; width: 3px; border-radius: 2px; background: #ff4a4a; box-shadow: 0 0 10px 2px rgba(255, 74, 74, .85), 0 0 30px 8px rgba(255, 74, 74, .35); }
.sl__c { max-width: 18em; font: 600 1.1875rem/1.4 var(--ch-body); letter-spacing: 0; color: #fff; text-shadow: 0 1px 2px rgba(0, 0, 0, .9), 0 3px 14px rgba(0, 0, 0, .8); opacity: var(--c, 1); transform: translateY(calc((1 - var(--c, 1)) * 14px)); }
.sl__brand { display: inline-flex; align-items: center; vertical-align: middle; margin-left: .5em; padding: 0; border-radius: 0; background: none; box-shadow: none; } .sl__brand img { display: block; height: 4.5em; width: auto; filter: brightness(0) invert(1); } /* v1.0041: "Bem-vindo ao" + logotipo oficial num chip branco, legível em cima da foto */
.sl__v { --p: 1; --ok: max(0, min(calc((var(--p) - .88) / .12), 1)); display: grid; justify-items: center; font: 500 .875rem/1.3 var(--ch-body); letter-spacing: 0; text-align: center; opacity: var(--v, 1); transform: translateY(calc((1 - var(--v, 1)) * 30px)) scale(calc(.94 + var(--v, 1) * .06)); }
/* 1) o celular: reserva confirmada, Pix pago e a senha da suíte */
.ph { width: 196px; aspect-ratio: 9 / 18.6; padding: 9px; border-radius: 36px; background: #0c0c0f; border: 1px solid rgba(255, 255, 255, .22); box-shadow: 0 40px 70px -30px rgba(0, 0, 0, .9), inset 0 0 0 1px rgba(0, 0, 0, .8), 0 0 0 1px rgba(255, 255, 255, .06); }
.ph__scr { position: relative; display: grid; align-content: center; justify-items: center; gap: 10px; height: 100%; padding: 22px 14px; border-radius: 28px; background: linear-gradient(180deg, #1a1a1f, #0d0d10); overflow: hidden; }
.ph__scr::before { content: ""; position: absolute; top: 10px; left: 50%; width: 64px; height: 18px; margin-left: -32px; border-radius: 10px; background: #000; }
.ph__ok { width: 64px; height: 64px; fill: none; stroke: #2fd47a; stroke-width: 3.5; stroke-linecap: round; stroke-linejoin: round; }
.ph__ok circle { stroke-dasharray: 170; stroke-dashoffset: calc(170 * (1 - max(0, min(calc(var(--p) / .4), 1)))); transform: rotate(-90deg); transform-origin: 50% 50%; }
.ph__ok path { stroke-dasharray: 40; stroke-dashoffset: calc(40 * (1 - max(0, min(calc((var(--p) - .35) / .25), 1)))); }
.ph__t { font: 800 1.0625rem/1.15 var(--ch-display); letter-spacing: -.02em; color: #fff; opacity: max(0, min(calc((var(--p) - .45) / .15), 1)); transform: translateY(calc((1 - max(0, min(calc((var(--p) - .45) / .15), 1))) * 8px)); }
.ph__r { display: grid; gap: 2px; color: rgba(255, 255, 255, .7); font-size: .8125rem; opacity: max(0, min(calc((var(--p) - .55) / .15), 1)); } .ph__r em { font-style: normal; }
.ph__pix { display: inline-flex; align-items: center; gap: 7px; padding: 6px 12px 6px 9px; border-radius: 999px; background: rgba(47, 212, 122, .16); color: #8ff5b5; font-weight: 700; font-size: .75rem; letter-spacing: .06em; text-transform: uppercase; opacity: max(0, min(calc((var(--p) - .65) / .15), 1)); }
.ph__pix i { width: 8px; height: 8px; border-radius: 50%; background: #2fd47a; }
.ph__code { display: grid; gap: 2px; margin-top: 4px; padding: 10px 14px; border-radius: 14px; background: rgba(255, 255, 255, .08); border: 1px solid rgba(255, 255, 255, .12); opacity: max(0, min(calc((var(--p) - .78) / .2), 1)); transform: translateY(calc((1 - max(0, min(calc((var(--p) - .78) / .2), 1))) * 8px)); }
.ph__code small { font-size: .625rem; font-weight: 700; letter-spacing: .18em; text-transform: uppercase; color: rgba(255, 255, 255, .55); }
.ph__code b { display: flex; gap: .12em; font: 900 1.375rem/1 var(--ch-display); color: #fff; } .ph__code b i { font-style: normal; opacity: max(0, min(calc((var(--p) - .8 - var(--i) * .045) / .04), 1)); transform: translateY(calc((1 - max(0, min(calc((var(--p) - .8 - var(--i) * .045) / .04), 1))) * 6px)); } /* a senha chega dígito a dígito */
/* 2) o rosto: os traços do anel acendem em volta, a linha varre o rosto e o anel fica verde */
.fc { display: grid; justify-items: center; gap: 12px; width: 220px; }
.fc svg { width: 220px; height: 220px; overflow: visible; }
.fc__ring line { stroke: rgb(calc(255 - 208 * var(--ok)), calc(255 - 43 * var(--ok)), calc(255 - 133 * var(--ok))); stroke-width: 2.6; stroke-linecap: round; opacity: calc(.14 + .86 * max(0, min(calc(var(--p) * 44 - var(--i)), 1))); }
.fc__face circle, .fc__face path { fill: none; stroke: rgba(255, 255, 255, .9); stroke-width: 2.4; stroke-linecap: round; }
.fc__scan rect { fill: #ff4a4a; filter: drop-shadow(0 0 6px rgba(255, 74, 74, .9)); opacity: calc(1 - var(--ok)); transform: translateY(calc(40px + max(0, min(calc(var(--p) / .85), 1)) * 140px)); }
.fc__ok { fill: none; stroke: #2fd47a; stroke-width: 6; stroke-linecap: round; stroke-linejoin: round; stroke-dasharray: 70; stroke-dashoffset: calc(70 * (1 - var(--ok))); filter: drop-shadow(0 0 8px rgba(47, 212, 122, .8)); }
.fc__l { display: inline-flex; align-items: center; gap: 8px; padding: 8px 14px 8px 11px; border-radius: 999px; background: rgba(47, 212, 122, .16); color: #8ff5b5; font: 700 .75rem/1 var(--ch-body); letter-spacing: .1em; text-transform: uppercase; opacity: var(--ok); }
.fc__l i { width: 8px; height: 8px; border-radius: 50%; background: #2fd47a; box-shadow: 0 0 0 0 rgba(47, 212, 122, .7); animation: pulse 1.6s infinite; }
/* 3) a fechadura: as teclas da senha acendem uma a uma, os pontos preenchem, o cadeado abre e o LED fica verde */
.kp { position: relative; display: grid; justify-items: center; gap: 12px; width: 184px; padding: 18px 16px 16px; border-radius: 22px; background: linear-gradient(180deg, #1f1f23, #0a0a0c); border: 1px solid rgba(255, 255, 255, .16); box-shadow: 0 40px 70px -30px rgba(0, 0, 0, .9), inset 0 1px 0 rgba(255, 255, 255, .12); }
.kp__led { display: grid; place-items: center; width: 100%; height: 10px; } .kp__led i { width: 34px; height: 5px; border-radius: 3px; background: rgb(calc(255 - 208 * var(--ok)), calc(74 + 138 * var(--ok)), calc(74 + 48 * var(--ok))); box-shadow: 0 0 10px 2px rgba(calc(255 - 208 * var(--ok)), calc(74 + 138 * var(--ok)), calc(74 + 48 * var(--ok)), .8); }
.kp__dots { display: flex; gap: 10px; } .kp__dots i { width: 10px; height: 10px; border-radius: 50%; border: 1.5px solid rgba(255, 255, 255, .5); background: rgba(255, 255, 255, var(--d, 0)); }
.kp__dots i:nth-child(1) { --d: max(0, min(calc(var(--p) * 5 - 0), 1)); } .kp__dots i:nth-child(2) { --d: max(0, min(calc(var(--p) * 5 - 1), 1)); } .kp__dots i:nth-child(3) { --d: max(0, min(calc(var(--p) * 5 - 2), 1)); } .kp__dots i:nth-child(4) { --d: max(0, min(calc(var(--p) * 5 - 3), 1)); }
.kp__g { display: grid; grid-template-columns: repeat(3, 42px); gap: 8px; }
.kp__g i { display: grid; place-items: center; height: 38px; border-radius: 10px; background: rgba(255, 255, 255, .07); border: 1px solid rgba(255, 255, 255, .1); color: #fff; font: 700 .9375rem/1 var(--ch-display); font-style: normal; }
[data-step="1"] .kp__g i[data-k="1"], [data-step="2"] .kp__g i[data-k="4"], [data-step="3"] .kp__g i[data-k="5"], [data-step="4"] .kp__g i[data-k="2"] { background: #fff; color: #0b0b0d; box-shadow: 0 0 0 3px rgba(255, 255, 255, .25), 0 0 18px rgba(255, 255, 255, .5); transform: scale(.9); } /* a tecla afunda ao ser pressionada */
.kp__g i { transition: transform .12s ease, background .12s ease; }
.sl__card img { animation: none; transform: scale(1.06); } /* v1.0064: a foto da suíte fica parada — o zoom contínuo somado à rolagem dava sensação de tremor */
.kp__lock { width: 30px; height: 30px; fill: none; stroke: #fff; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; margin-top: 2px; }
.kp__sh { transform: translate(calc(var(--ok) * -2px), calc(var(--ok) * -3px)) rotate(calc(var(--ok) * -14deg)); transform-origin: 8px 10px; }
.kp__l { position: absolute; left: 50%; bottom: -34px; transform: translateX(-50%); white-space: nowrap; padding: 6px 12px; border-radius: 999px; background: rgba(47, 212, 122, .16); color: #8ff5b5; font: 700 .75rem/1 var(--ch-body); letter-spacing: .1em; text-transform: uppercase; opacity: var(--ok); }
/* 4) a porta real da suíte abre (mesma porta da "Nossa história") */
.sl__v { --q: 0; --vx: 0px; --vy: 0px; } .sl__v .story__v { width: 230px; }
.scene__line--end .sl__v { --p: 1; }
@media (min-width: 700px) { .sl__k { font-size: .9375rem; } .sl__bar::before { width: 4px; } .sl__c { font-size: 1.375rem; } .ph { width: 220px; } .fc, .fc svg { width: 250px; } .fc svg { height: 250px; } .kp { width: 200px; } .sl__v .story__v { width: 270px; } }
@media (min-width: 1024px) {
  .scene__line { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); align-items: center; gap: 60px; width: 100%; max-width: 1180px; margin-left: auto; margin-right: auto; text-align: left; }
  .sl__h { justify-items: start; padding: 24px 0; } .sl__h::before { top: -20%; right: -30%; bottom: -20%; left: -30%; background: radial-gradient(60% 60% at 40% 50%, rgba(0, 0, 0, .72), rgba(0, 0, 0, 0) 100%); } /* v1.0041: sombra um pouco mais forte atrás das frases — detalhes claros da foto (interruptor, moldura) não aparecem colados nas letras */ .sl__c { max-width: 20em; }
  .sl__v { justify-self: center; }
  .ph { width: 236px; } .fc, .fc svg { width: 280px; } .fc svg { height: 280px; } .kp { width: 210px; } .sl__v .story__v { width: 300px; }
}
/* ===== Termos e Privacidade num modal por cima da landing (v1.0041): o hóspede lê e volta sem sair da página ===== */
.legal { position: fixed; top: 0; right: 0; bottom: 0; left: 0; z-index: 5000; display: grid; align-items: end; justify-items: center; opacity: 0; transition: opacity .25s ease; }
.legal[hidden] { display: none; } .legal.is-open { opacity: 1; }
.legal__bg { position: absolute; top: 0; right: 0; bottom: 0; left: 0; background: rgba(11, 11, 13, .55); -webkit-backdrop-filter: blur(6px); backdrop-filter: blur(6px); }
.legal__sheet { position: relative; width: 100%; max-height: calc(100vh - 20px); max-height: calc(100svh - 20px); display: grid; grid-template-rows: auto minmax(0, 1fr); background: #fff; color: var(--ch-ink); border-radius: 28px 28px 0 0; box-shadow: 0 -20px 60px rgba(0, 0, 0, .35); transform: translateY(28px); transition: transform .35s var(--ch-ease); }
.legal.is-open .legal__sheet { transform: none; }
.legal__h { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 12px 12px 12px 22px; border-bottom: 1px solid var(--ch-line); }
.legal__k { font: 800 1rem/1.2 var(--ch-display); letter-spacing: -.01em; }
.legal__x { display: inline-flex; align-items: center; gap: 8px; min-height: 44px; padding: 0 12px 0 16px; border: 0; border-radius: 999px; background: var(--ch-ink); color: #fff; font: 700 .9375rem/1 var(--ch-body); cursor: pointer; }
.legal__x svg { width: 18px; height: 18px; fill: none; stroke: currentColor; stroke-width: 2.4; stroke-linecap: round; }
.legal__b { overflow-y: auto; overscroll-behavior: contain; -webkit-overflow-scrolling: touch; padding: 6px 22px calc(30px + env(safe-area-inset-bottom)); }
.legal__b h1 { font: 900 max(1.75rem, min(6.5vw, 2.5rem))/1.05 var(--ch-display); letter-spacing: -.035em; margin: 16px 0 8px; } .legal__b h1 i { color: var(--ch-red); font-style: normal; }
.legal__b h2 { font: 800 1.125rem/1.25 var(--ch-display); letter-spacing: -.02em; margin: 26px 0 6px; }
.legal__b p, .legal__b li { color: var(--ch-ink-2); font-size: 1rem; line-height: 1.6; } .legal__b ul { padding-left: 1.2em; list-style: disc; } .legal__b li { margin: 6px 0; }
.legal__b .lead { color: var(--ch-muted); } .legal__b a { color: var(--ch-red); font-weight: 600; }
.legal__b .card { background: var(--ch-mist); border-radius: 20px; padding: 16px 18px; margin: 14px 0; }
.legal__b table { width: 100%; border-collapse: collapse; } .legal__b td { padding: 9px 0; border-top: 1px solid rgba(11, 11, 13, .08); } .legal__b tr:first-child td { border-top: 0; } .legal__b td:last-child { text-align: right; font-weight: 700; white-space: nowrap; }
.legal__f { display: block; margin-top: 28px; font-size: .8125rem; line-height: 1.5; color: var(--ch-muted); }
.legal__wait { padding: 48px 0; text-align: center; color: var(--ch-muted); }
html.legal-lock, html.legal-lock body { overflow: hidden; }
@media (min-width: 700px) { .legal { align-items: center; padding: 24px; } .legal__sheet { max-width: 720px; max-height: min(86vh, 900px); max-height: min(86dvh, 900px); border-radius: 28px; transform: translateY(16px) scale(.98); } .legal__b, .legal__h { padding-left: 32px; } .legal__b { padding-right: 32px; } }
/* celular: o topo é uma faixa branca inteira (do alto da tela, atrás do relógio, até abaixo da cápsula) — nada da página aparece por cima do menu */
/* celular: o topo é uma "ilha" branca pendurada do alto da tela (atrás do relógio), com os cantos de baixo bem arredondados; logotipo, Menu e Reservar dentro dela */
@media (max-width: 1023.98px) {
  .top { pointer-events: auto; padding: calc(4px + env(safe-area-inset-top)) 14px 10px; border-radius: 0 0 30px 30px; background: rgba(255, 255, 255, .96); -webkit-backdrop-filter: blur(16px) saturate(160%); backdrop-filter: blur(16px) saturate(160%); box-shadow: 0 18px 40px -22px rgba(0, 0, 0, .55), inset 0 -1px 0 rgba(11, 11, 13, .05); }
  .top::before { display: none; }
  .top__in { height: 60px; padding: 0 0 0 4px; background: transparent; border: 0; border-radius: 0; -webkit-backdrop-filter: none; backdrop-filter: none; box-shadow: none; }
  html:not(.no-gate):not(.gate-done) .top { opacity: 0; }

  /* mobile: melhor responsividade da landing */
  .scene__a { padding-bottom: calc(80px + env(safe-area-inset-bottom)); padding-top: 100px; }
  .scene .mega { font-size: max(2rem, min(11.5vw, 5rem)); line-height: 1.05; }
  .scene__sub { font-size: 1rem; line-height: 1.4; margin-top: 16px; }
  .scene__book { margin-top: 24px; }
  .scene__book .chb-shell { gap: 8px; padding: 8px; }
  .scene__book .chb-f { min-height: 58px; padding: 6px 14px; }
  .scene__book .chb-go { min-height: 52px; font-size: 1rem; }
}
/* celular: a página não anda para os lados (só os carrosséis, com o próprio gesto) */
@media (max-width: 1023.98px) {
  html { overflow-x: hidden; overscroll-behavior-x: none; } /* só no html: no body viraria um scroller próprio e quebraria os sticky */
  body { touch-action: pan-y pinch-zoom; }
  .rooms__l, .fan__stage, .quick__l, .rev__l, .chb-presets, .chr-steps, .chr-filters, .wx__hours, .np-l { touch-action: pan-x pan-y pinch-zoom; }
}
/* ===== caminhada no COMPUTADOR (v1.0041): tipografia em movimento — "SEM" entra pela esquerda, a palavra pela direita, o ponto vermelho pula,
   um brilho varre as letras, o número gigante do passo flutua atrás e o objeto (celular, rosto, fechadura, suíte) inclina com a rolagem ===== */
.sl__w1, .sl__w2 { display: inline-block; font-style: normal; }
.sl__n { display: none; }
@media (min-width: 1024px) {
  .scene__line { perspective: 1200px; }
  .sl__h { position: relative; }
  .sl__n { display: block; position: absolute; left: -.08em; top: 50%; z-index: -1; font: 900 20vw/1 var(--ch-display); letter-spacing: -.06em; color: rgba(255, 255, 255, .045); pointer-events: none; transform: translateY(calc(-50% + (1 - var(--tx, 1)) * 120px)); opacity: var(--o, 1); }
  .sl__w1 { transform: translateX(calc((1 - var(--r, 1)) * -70px)); }
  .sl__w2 { transform: translateX(calc((1 - var(--r, 1)) * 90px)); }
  .sl__t { -webkit-clip-path: none; clip-path: none; opacity: calc(.15 + var(--r, 1) * .85); font-size: max(2.75rem, min(4.6vw, 5.75rem)); max-width: 100%; }
  .sl__w1, .sl__w2 { max-width: 100%; } .sl__nb { white-space: nowrap; } /* a última palavra e o ponto vermelho ficam sempre juntos; o resto quebra a linha se precisar */
  .sl__t .dot { position: relative; top: calc((1 - max(0, min(calc((var(--r, 1) - .75) / .25), 1))) * -.35em); opacity: max(0, min(calc((var(--r, 1) - .75) / .25), 1)); } /* v1.0041: o ponto cai de cima e acende — sem inline-block/transform dentro do texto com brilho (no Chrome do Windows isso pintava uma bolinha branca colada na 1ª letra) */
  .sl__bar { display: none; }
  .sl__c { transform: translateY(calc((1 - var(--c, 1)) * 20px)) translateX(calc((1 - var(--c, 1)) * -20px)); }
  /* brilho que varre as letras conforme a frase chega */
  .sl__w1, .sl__w2 { padding: .2em .1em .08em; margin: -.2em -.1em -.08em; background: linear-gradient(105deg, #fff 0 40%, #ffd3d4 50%, #fff 60% 100%); background-size: 280% 100%; background-position: calc(100% - var(--r, 1) * 100%) 0; -webkit-background-clip: text; background-clip: text; color: transparent; -webkit-text-fill-color: transparent; text-shadow: none; } /* v1.0041: folga em cima e nos lados — o brilho recorta pelo texto e os acentos (Ó, Ê, Ç, Í) não ficam mais cortados */
  .sl__w2 .dot { color: var(--ch-red); -webkit-text-fill-color: var(--ch-red); }
  /* v1.0065: EIXO X TRAVADO no computador — nada de scale/rotate no card nem na linha.
     O scale da linha inteira (.scene__line) empurrava a foto para os lados, porque ela fica fora do centro; o scale do próprio card fazia o mesmo.
     Sobrou só o movimento vertical, que é o único que a rolagem justifica. */
  .scene__line { transform: translateY(var(--y, 0px)); }
  .sl__v { transform: translateY(calc((1 - var(--v, 1)) * 40px)); transform-style: flat; will-change: transform, opacity; }
  .sl__v, .sl__v .story__v, .sl__v .story__card { transform-origin: center center; }
}
.cmp__c--area b { font: 800 .9375rem/1 var(--ch-display); letter-spacing: -.01em; font-variant-numeric: tabular-nums; } /* tamanho (m²) no Compare num olhar */

/* ---------- v1.0077 · acertos de alinhamento e responsividade ---------- */
/* de 820px (iPad retrato) a 1023px a barra de busca já vira cápsula (booking.css) —
   sem isto o botão Buscar caía para uma 2ª linha dentro do oval */
@media (min-width: 820px) and (max-width: 1023.98px) {
  .scene__book .chb-shell { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) minmax(0, 1fr) auto; }
  /* 140px: abaixo disso o rótulo "Hóspedes e suítes" quebra em 2 linhas e o campo fica 13px mais alto que os vizinhos */
  .scene__book .chb-go { grid-column: auto; min-width: 140px; }
}
/* "Em 1 toque": entre 700 e 1023px os 3 cartões precisam de 713px e só há 662 — o último ficava cortado na borda */
@media (min-width: 700px) and (max-width: 1023.98px) {
  .quick__l { flex-wrap: wrap; justify-content: center; overflow-x: visible; }
}
/* folha de resultados aberta: esconde os flutuantes, como o painel de reserva já faz */
html.chr-lock .tabbar { transform: translateY(160%); }
html.chr-lock .wa-fab, html.chr-lock .gx-fab { opacity: 0; pointer-events: none; }

/* ---------- v1.0169 · celular: textos que não cabiam (em português já cortava; em inglês e espanhol cortava mais) ---------- */
@media (max-width: 699.98px) {
  .cmp__g { width: auto; } /* Compare num olhar: com 3 tipos de quarto cabe na tela (os textos quebram); com 4+, arrasta como antes */
  .clock__i b { white-space: normal; font-size: max(1.5rem, min(7vw, 2.5rem)); line-height: 1.04; } /* check-in/check-out: "A partir das 14h" era cortado */
}

/* v1.0177: seção fora da tela = animações pausadas (site.js); voltam de onde pararam ao aparecer */
.is-idle, .is-idle *, .is-idle *::before, .is-idle *::after { animation-play-state: paused !important; }
/* v1.0177: troca de idioma — esmaecer suave entre as duas páginas, já no mesmo ponto */
@media (prefers-reduced-motion: no-preference) {
  @view-transition { navigation: auto; }
  ::view-transition-old(root), ::view-transition-new(root) { animation-duration: .32s; animation-timing-function: cubic-bezier(.2, .8, .2, 1); }
}
html.lang-in body { opacity: 0; }
html.lang-ok body { animation: chLangIn .32s cubic-bezier(.2, .8, .2, 1); }
@keyframes chLangIn { from { opacity: 0; } to { opacity: 1; } }
/* v1.0177: celular estreito — o ícone sobe para a linha do rótulo e a data ("Adicionar data", "Agregar fecha", "Add date") aparece inteira */
@media (max-width: 459.98px) {
  .scene__book .chb-f { display: grid; grid-template-columns: auto minmax(0, 1fr); align-items: center; column-gap: 8px; row-gap: 3px; }
  .scene__book .chb-f > svg { width: 20px; height: 20px; }
  .scene__book .chb-f__t { display: contents; }
  .scene__book .chb-f__t small { grid-column: 2; }
  .scene__book .chb-f__t b { grid-column: 1 / -1; }
}
@media (max-width: 339.98px) { .scene__book .chb-f { padding-left: 10px; padding-right: 10px; } }
/* v1.0177: preço do dia (previsão de 3 dias) inteiro em qualquer idioma — quebra linha em vez de cortar com "…" */
.day__cta small { white-space: normal; overflow: visible; text-overflow: clip; line-height: 1.25; text-wrap: balance; }
.day__go { padding-top: 7px; padding-bottom: 7px; }
/* v1.0184: RESPONSIVO — achados da auditoria em 22 tamanhos de tela (320 → 2560 px e celular deitado) */
/* horários do atendimento: no celular o status ("FECHADO · VOLTA ÀS 13H") ia do lado e espremia o texto numa coluna de uma palavra por linha
   (320–390 px); agora ele desce para baixo do horário e o bolinha acompanha a 1ª linha */
@media (max-width: 479.98px) {
  .hours li { grid-template-columns: auto minmax(0, 1fr); align-items: start; row-gap: 6px; padding: 14px 18px; }
  .hours .st__dot { margin-top: 7px; }
  .hours em { grid-column: 2; justify-self: start; white-space: normal; line-height: 1.35; }
}
/* "16 ITENS CONFERIDOS": a palavra mais longa passava da largura máxima (7em) e o "S" era cortado na borda do cartão (360–430 px) —
   agora a largura é a da maior palavra, em qualquer idioma ("VERIFICADOS", "CHECKED") */
.ct__n span { max-width: none; width: -webkit-min-content; width: min-content; }
/* selos das suítes 126/136 ("Decoración de autor", "Dois ambientes"): até 374 px o ícone ao lado deixava 45–59 px para o texto e a
   palavra passava da caixa — o ícone sobe e o texto ganha a largura toda */
@media (max-width: 374.98px) {
  .sui__spec button { grid-template-columns: minmax(0, 1fr); justify-items: start; row-gap: 8px; padding: 12px; }
}
/* check-in · check-out · entrada: no celular cada item tem a largura do próprio texto e desce para a linha de baixo quando não cabe
   (em espanhol, "con tu rostro" passava 4 px da coluna fixa e era cortado em 390 px). Espaço por margem: igual em iPhone antigo */
@media (max-width: 699.98px) {
  .ct__times { display: flex; flex-wrap: wrap; align-items: flex-end; gap: 0; margin-bottom: -14px; }
  .ct__times > * { margin: 0 26px 14px 0; }
}
/* miniaturas das suítes 126/136: em tela estreita o número + o nome não cabiam lado a lado ("Banhei…", "Ambie…") — o número sobe */
@media (max-width: 389.98px) {
  .sui__th span { flex-direction: column; gap: 0; padding: 7px 4px 8px; text-align: center; }
  .sui__th i { margin: 0 0 4px; } /* margem (não gap): igual em iPhone antigo */
}
/* v1.0184: iPhone com iOS 12 a 14 não conhece aspect-ratio. Nas caixas em que TUDO fica por cima (posição absoluta: cartões dos quartos,
   fotos das suítes, coworking, passeio, marcação do rosto), a caixa ficava com altura zero e sumia. Um espaçador invisível dá a mesma
   proporção (padding em % = da largura da própria caixa). Navegador atual nem lê este bloco. */
@supports not (aspect-ratio: 1 / 1) {
  .room__a::before, .sui__stage::before, .cow__stage::before, .tour::before, .scan::before { content: ""; display: block; }
  .room__a::before, .sui__stage::before { padding-top: 133.333%; }
  .cow__stage::before { padding-top: 125%; }
  .tour::before { padding-top: 145%; }
  .scan::before { padding-top: 100%; }
  .gate__scan { height: var(--sz); }
  @media (max-width: 379px) { .rooms__l .room__a::before { padding-top: 156.667%; } }
  @media (min-width: 700px) { .cow__stage::before { padding-top: 68.75%; } }
  @media (min-width: 1024px) { .cow__stage::before { padding-top: 75%; } }
}
/* v1.0184: PARTIDA RÁPIDA — com html.cv (ligado no <head>), seção fora da tela só é montada quando chega perto; o site.js libera todas
   logo depois de carregar (.cv-on). A altura estimada evita que a barra de rolagem "encolha"; depois de montada, vale a altura real. */
html.cv main > section:not(.scene):not(.chr):not(.cv-on), html.cv body > .foot:not(.cv-on) { content-visibility: auto; contain-intrinsic-size: 900px; contain-intrinsic-size: auto 900px; }
/* ---------- v1.0185: "Acontece em Itatiba" vira PORTAL DE NOTÍCIAS (inc/events.php) ----------
   Cabeçalho de jornal (ao vivo · título · data de hoje) → manchete com foto → cartões com foto → "Mais da cidade" em lista.
   Sem foto, a notícia ganha a arte da casa (ícone + data). Toda foto nasce numa caixa de proporção fixa (padding-top): nada muda de
   altura quando a imagem chega (CLS 0) e funciona em iPhone antigo (sem aspect-ratio). Animação só com transform/opacity. */
.np-box { display: grid; gap: 18px; align-content: start; }
.np-h { display: grid; gap: 6px; padding-bottom: 16px; border-bottom: 2px solid var(--ch-ink); }
.np-h__k { display: flex; align-items: center; flex-wrap: wrap; gap: 6px 10px; margin: 0; font: 800 .6875rem/1.3 var(--ch-body); letter-spacing: .16em; text-transform: uppercase; color: var(--ch-red); }
.np-h__live { position: relative; flex: none; width: 8px; height: 8px; border-radius: 50%; background: var(--ch-red); }
.np-h__live::after { content: ""; position: absolute; top: -5px; right: -5px; bottom: -5px; left: -5px; border-radius: 50%; border: 2px solid var(--ch-red); opacity: 0; animation: np-live 2.2s ease-out infinite; }
@keyframes np-live { 0% { transform: scale(.4); opacity: .7; } 100% { transform: scale(1.3); opacity: 0; } }
.np-h__at { font-weight: 600; letter-spacing: .02em; text-transform: none; color: var(--ch-muted); font-size: .75rem; }
.np-h__at::before { content: "·"; margin-right: 10px; color: var(--ch-muted); }
.np-h__at:empty { display: none; }
.np-h__t { margin: 0; font: 900 max(1.625rem, min(6.4vw, 2.25rem))/1.02 var(--ch-display); letter-spacing: -.04em; color: var(--ch-ink); }
.np-h__d { margin: 0; color: var(--ch-muted); font-size: .875rem; font-weight: 600; }
.np-h__d::first-letter { text-transform: uppercase; }
.np-l { display: grid; grid-template-columns: minmax(0, 1fr); gap: 16px; margin: 0; padding: 0; list-style: none; }
.np { min-width: 0; }
.np__a { display: grid; min-width: 0; color: inherit; text-decoration: none; border-radius: 18px; -webkit-tap-highlight-color: transparent; }
.np__a:focus-visible { outline: 3px solid var(--ch-red); outline-offset: 4px; }
.np__img { position: relative; display: block; overflow: hidden; border-radius: 16px; background: var(--ch-mist); isolation: isolate; }
.np__img::before { content: ""; display: block; padding-top: 75%; }
.np__img img { position: absolute; top: 0; left: 0; width: 100%; height: 100%; object-fit: cover; transition: transform .7s var(--ch-ease); }
a.np__a:hover .np__img img { transform: scale(1.045); }
.np__img--art { color: #fff; }
.np__img--art svg, .np__img--art b { position: absolute; left: 50%; transform: translate(-50%, -50%); }
.np__img--art svg { top: 42%; width: 30px; height: 30px; fill: none; stroke: currentColor; stroke-width: 1.7; stroke-linecap: round; stroke-linejoin: round; opacity: .92; }
.np__img--art b { top: 72%; width: 92%; font: 800 .75rem/1.15 var(--ch-display); letter-spacing: -.01em; text-align: center; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.np .np__img.np__img--nob svg { top: 50%; }
.np__img--ev { background: linear-gradient(150deg, #16161b 0%, #34343e 100%); }
.np__img--nw { background: linear-gradient(150deg, #2a2e37 0%, #5b6271 100%); }
.np__img--tip { background: linear-gradient(150deg, #9f0f16 0%, var(--ch-red) 100%); }
.np__b { display: grid; gap: 6px; align-content: start; min-width: 0; }
.np__m { display: flex; align-items: center; flex-wrap: wrap; gap: 2px 8px; font: 700 .75rem/1.25 var(--ch-body); }
.np__cat { font-style: normal; font-size: .6875rem; font-weight: 800; letter-spacing: .12em; text-transform: uppercase; color: var(--ch-red); }
.np__cat--nw { color: var(--ch-ink); }
.np__w { color: var(--ch-muted); }
.np__w::before { content: "·"; margin-right: 8px; }
.np__t { display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; font: 800 1rem/1.28 var(--ch-display); letter-spacing: -.012em; color: var(--ch-ink); transition: color .2s; }
a.np__a:hover .np__t { color: var(--ch-red); }
.np__d { display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; font-size: .875rem; line-height: 1.45; color: var(--ch-ink-2); }
.np__s { display: flex; align-items: center; gap: 6px; min-width: 0; font-size: .75rem; font-weight: 600; color: var(--ch-muted); }
.np__go { flex: none; width: 13px; height: 13px; fill: none; stroke: currentColor; stroke-width: 2.4; stroke-linecap: round; stroke-linejoin: round; transition: transform .3s var(--ch-ease); }
a.np__a:hover .np__go { transform: translate(2px, -2px); }
/* manchete */
.np--lead .np__a { gap: 14px; }
.np--lead .np__img { border-radius: 22px; }
.np--lead .np__img::before { padding-top: 60%; }
.np--lead .np__img--art svg { width: 46px; height: 46px; top: 40%; }
.np--lead .np__img--art b { top: 68%; font-size: 1.0625rem; }
.np--lead .np__t { font-size: max(1.25rem, min(5.2vw, 1.625rem)); line-height: 1.16; letter-spacing: -.025em; }
.np--lead .np__d { -webkit-line-clamp: 3; font-size: .9375rem; }
/* cartões: foto pequena ao lado (celular e computador) */
.np--card .np__a { grid-template-columns: 104px minmax(0, 1fr); gap: 14px; align-items: start; min-height: 108px; }
.np--card .np__d { display: none; }
.np--card .np__img--art b { font-size: .6875rem; }
/* "Mais da cidade": manchetes em lista, sem foto */
.np-more { display: flex; align-items: center; gap: 12px; margin-top: 4px; font: 800 .6875rem/1 var(--ch-body); letter-spacing: .16em; text-transform: uppercase; color: var(--ch-ink); }
.np-more::after { content: ""; flex: 1; height: 1px; background: var(--ch-line, rgba(11, 11, 13, .1)); }
.np--line .np__a { padding: 12px 0 2px; border-top: 1px solid var(--ch-line, rgba(11, 11, 13, .08)); border-radius: 0; min-height: 60px; }
.np--line .np__b { gap: 4px; }
.np--line .np__t { -webkit-line-clamp: 2; font-size: .9375rem; }
.np-more + .np--line .np__a { border-top: 0; padding-top: 0; }
.np-sk { height: 92px; border-radius: 16px; background: linear-gradient(100deg, var(--ch-mist) 30%, #fff 50%, var(--ch-mist) 70%) 0 0 / 200% 100%; animation: sk 1.2s linear infinite; }
.np-sk--lead { height: 240px; border-radius: 22px; }
@media (max-width: 359px) { .np--card .np__a { grid-template-columns: 88px minmax(0, 1fr); gap: 12px; } }
@media (min-width: 1024px) {
  .np-l { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 18px 22px; }
  .np--lead, .np-more, .np-sk--lead { grid-column: 1 / -1; }
  .np--lead .np__a { grid-template-columns: minmax(0, 1.12fr) minmax(0, 1fr); gap: 24px; align-items: center; }
  .np--lead .np__img::before { padding-top: 72%; }
  .np--lead .np__t { font-size: 1.625rem; -webkit-line-clamp: 4; }
  .np--card .np__a { grid-template-columns: 112px minmax(0, 1fr); }
  .np-more + .np--line + .np--line .np__a { border-top: 0; padding-top: 0; }
}
@media (prefers-reduced-motion: reduce) { .np-h__live::after { animation: none; } .np__img img, .np__go { transition: none; } }
/* v1.0186: vitrine "Dicas do Carneiro" — cartões em pé com a foto do lugar (enviada no painel, capa do link ou Google), o título
   por cima da foto e a data em selo vermelho; rola com o dedo (e com a roda do mouse no computador, site.js). Caixas de proporção fixa: CLS 0. */
.np-tips { display: grid; gap: 12px; min-width: 0; }
.np-more--tip { margin: 0; color: var(--ch-red); }
.np-rail { display: flex; gap: 12px; margin: 0 -24px; padding: 2px 24px 8px; list-style: none; overflow-x: auto; scroll-snap-type: x mandatory; scroll-padding: 0 24px; scrollbar-width: none; overscroll-behavior-x: contain; -webkit-overflow-scrolling: touch; }
.np-rail::-webkit-scrollbar { display: none; }
.npt { flex: 0 0 62%; max-width: 240px; scroll-snap-align: start; min-width: 0; }
.npt__a { position: relative; display: block; overflow: hidden; border-radius: 22px; background: #16161b; color: #fff; text-decoration: none; isolation: isolate; -webkit-tap-highlight-color: transparent; transition: transform .45s var(--ch-ease), box-shadow .45s var(--ch-ease); }
.npt__a:focus-visible { outline: 3px solid var(--ch-red); outline-offset: 3px; }
.npt__a:hover { transform: translateY(-4px); box-shadow: 0 26px 40px -24px rgba(11, 11, 13, .55); }
.npt__img { position: relative; display: block; }
.npt__img::before { content: ""; display: block; padding-top: 128%; }
.npt__img img { position: absolute; top: 0; left: 0; width: 100%; height: 100%; object-fit: cover; transition: transform .9s var(--ch-ease); }
.npt__a:hover .npt__img img { transform: scale(1.06); }
.npt__art { position: absolute; top: 0; right: 0; bottom: 0; left: 0; display: grid; place-items: center; background: radial-gradient(120% 90% at 20% 0%, rgba(234, 32, 37, .9), transparent 60%), linear-gradient(160deg, #3a0a0e, #121216); }
.npt__art .npt__svg { position: absolute; top: 0; left: 0; width: 100%; height: 100%; } /* v1.0189: ilustração do tema da dica (inc/events.php → ch_tip_art) */
.npt__sh { position: absolute; top: 0; right: 0; bottom: 0; left: 0; background: linear-gradient(180deg, rgba(0, 0, 0, 0) 38%, rgba(0, 0, 0, .55) 62%, rgba(0, 0, 0, .9)); }
.npt__w { position: absolute; top: 12px; left: 12px; max-width: calc(100% - 24px); padding: 6px 11px; border-radius: 999px; background: var(--ch-red); color: #fff; font: 800 .75rem/1.1 var(--ch-body); font-style: normal; letter-spacing: .01em; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; box-shadow: 0 8px 18px -8px rgba(234, 32, 37, .9); }
.npt__b { position: absolute; left: 0; right: 0; bottom: 0; display: grid; gap: 4px; padding: 14px 14px 13px; }
.npt__b b { display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; font: 800 1.0625rem/1.18 var(--ch-display); letter-spacing: -.015em; text-shadow: 0 2px 12px rgba(0, 0, 0, .45); }
.npt__d { display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; font-size: .8125rem; line-height: 1.35; color: rgba(255, 255, 255, .85); }
.npt__b small { display: flex; align-items: center; gap: 5px; margin-top: 2px; font-size: .75rem; font-weight: 700; color: rgba(255, 255, 255, .8); }
.npt__cr { position: absolute; right: 10px; bottom: 100%; font-style: normal; font-size: .5625rem; letter-spacing: .04em; color: rgba(255, 255, 255, .6); }
@media (min-width: 700px) { .npt { flex-basis: 40%; } }
@media (min-width: 1024px) { .np-tips { grid-column: 1 / -1; } .np-rail { margin: 0 -28px; padding-left: 28px; padding-right: 28px; scroll-padding: 0 28px; } .npt { flex-basis: calc((100% - 36px) / 3.3); max-width: none; } }
@media (prefers-reduced-motion: reduce) { .npt__a, .npt__img img { transition: none; } }

/* =================== v1.0189: O JORNAL DA CIDADE, EM LARGURA INTEIRA ===================
   Fora da grade do clima: no computador cabe tudo — manchete grande à esquerda e 4 cartões à direita, a vitrine "Dicas do
   Carneiro Hotel" com setas (4 cartões por vez), "Onde comer perto do hotel" (os 10 mais bem avaliados no Google, 5 por linha)
   e "Mais da cidade" em 3 colunas. Atalhos no cabeçalho levam a cada parte. Celular: tudo rola com o dedo, setas também. */
.ev.np-box { margin-top: 14px; border-radius: 30px; overflow: hidden; min-width: 0; }
.np-go { display: flex; gap: 8px; margin: 10px -24px 0; padding: 2px 24px 2px; overflow-x: auto; scrollbar-width: none; -webkit-overflow-scrolling: touch; }
.np-go::-webkit-scrollbar { display: none; }
.np-go a { flex: none; display: inline-flex; align-items: center; gap: 7px; min-height: 40px; padding: 0 15px 0 12px; border-radius: 999px; border: 1px solid var(--ch-line, rgba(11, 11, 13, .12)); background: #fff; color: var(--ch-ink); font: 700 .8125rem/1 var(--ch-body); text-decoration: none; white-space: nowrap; transition: background .2s, border-color .2s, transform .2s var(--ch-ease); }
.np-go a:hover { border-color: var(--ch-ink); } .np-go a:active { transform: scale(.97); }
.np-go a[hidden] { display: none; }
.np-go svg { width: 16px; height: 16px; flex: none; fill: none; stroke: var(--ch-red); stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }
.np-go a:focus-visible { outline: 3px solid var(--ch-red); outline-offset: 2px; }
.np-tips, .np-eat { scroll-margin-top: 110px; } #np-mais { scroll-margin-top: 110px; }
/* cabeçalho de vitrine: nome · contador · setas */
.np-rh { display: flex; align-items: center; gap: 12px; min-width: 0; }
.np-rh .np-more { flex: 1; min-width: 0; margin: 0; }
.np-more--tip em { font-style: normal; display: inline-grid; place-items: center; min-width: 22px; height: 22px; padding: 0 6px; margin-left: -4px; border-radius: 999px; background: rgba(234, 32, 37, .1); color: var(--ch-red); letter-spacing: 0; font-size: .6875rem; }
.np-nav { flex: none; display: inline-flex; gap: 8px; }
.np-nav__b { display: grid; place-items: center; width: 40px; height: 40px; padding: 0; border-radius: 50%; border: 1px solid var(--ch-line, rgba(11, 11, 13, .14)); background: #fff; color: var(--ch-ink); cursor: pointer; transition: background .2s, color .2s, opacity .2s, transform .2s var(--ch-ease); -webkit-tap-highlight-color: transparent; }
.np-nav__b svg { width: 18px; height: 18px; fill: none; stroke: currentColor; stroke-width: 2.4; stroke-linecap: round; stroke-linejoin: round; }
.np-nav__b:hover:not(:disabled) { background: var(--ch-ink); color: #fff; border-color: var(--ch-ink); }
.np-nav__b:active:not(:disabled) { transform: scale(.94); }
.np-nav__b:disabled { opacity: .32; cursor: default; }
.np-nav__b:focus-visible { outline: 3px solid var(--ch-red); outline-offset: 2px; }
.np-rh.is-fit .np-nav { display: none; } /* tudo já cabe na tela: sem setas */
/* ilustração das dicas sem foto: cada tema com o seu céu */
.npt__art { background: linear-gradient(165deg, #ea2025, #7a0c10); }
.npt__art--festa { background: linear-gradient(170deg, #ff6b3d 0%, #d61f3a 55%, #6d0a1c 100%); }
.npt__art--fruta { background: linear-gradient(170deg, #ffc15e 0%, #f08a24 55%, #a0400b 100%); }
.npt__art--parque { background: linear-gradient(180deg, #8fdcf0 0%, #5cc0a0 55%, #1b6b45 100%); }
.npt__art--corrida { background: linear-gradient(170deg, #3a3d4a 0%, #1a1b22 55%, #07070a 100%); }
.npt__art--cultura { background: linear-gradient(175deg, #2b2566 0%, #4b3a8f 50%, #1a1433 100%); }
.npt__art--comida { background: linear-gradient(170deg, #e2573a 0%, #b53a1c 55%, #5c1a0a 100%); }
.npt__art--lugar { background: linear-gradient(170deg, #f0444a 0%, #c0141b 55%, #5e070b 100%); }
/* ONDE COMER — os mais bem avaliados no Google perto do hotel */
.np-eat { display: grid; gap: 10px; min-width: 0; }
.np-more--eat { color: var(--ch-red); }
.np-eat__sub { display: flex; flex-wrap: wrap; align-items: center; gap: 4px 8px; margin: -2px 0 2px; font: 700 .875rem/1.35 var(--ch-body); color: var(--ch-ink); }
.np-eat__sub small { flex-basis: 100%; font-size: .75rem; font-weight: 600; color: var(--ch-muted); }
.np-eat__g { display: inline-grid; place-items: center; width: 22px; height: 22px; border-radius: 50%; background: conic-gradient(#ea4335 0 25%, #fbbc05 0 50%, #34a853 0 75%, #4285f4 0); color: #fff; font: 900 .75rem/1 Arial, sans-serif; position: relative; }
.np-eat__g::after { content: ""; position: absolute; top: 4px; left: 4px; right: 4px; bottom: 4px; border-radius: 50%; background: #fff; }
.np-eat__g { color: transparent; }
.np-eatl { display: flex; gap: 12px; margin: 0 -24px; padding: 2px 24px 10px; list-style: none; overflow-x: auto; scroll-snap-type: x mandatory; scroll-padding: 0 24px; scrollbar-width: none; overscroll-behavior-x: contain; -webkit-overflow-scrolling: touch; }
.np-eatl::-webkit-scrollbar { display: none; }
.nex { flex: 0 0 72%; max-width: 270px; min-width: 0; scroll-snap-align: start; }
.nex__a { position: relative; display: grid; align-content: start; gap: 8px; height: 100%; padding: 16px 16px 14px; border-radius: 20px; background: #fff; border: 1px solid var(--ch-line, rgba(11, 11, 13, .1)); color: var(--ch-ink); text-decoration: none; transition: transform .35s var(--ch-ease), box-shadow .35s var(--ch-ease), border-color .2s; -webkit-tap-highlight-color: transparent; }
.nex__a:hover { transform: translateY(-3px); border-color: rgba(11, 11, 13, .2); box-shadow: 0 22px 36px -26px rgba(11, 11, 13, .45); }
.nex__a:focus-visible { outline: 3px solid var(--ch-red); outline-offset: 3px; }
.nex__img { position: relative; display: block; margin: -16px -16px 4px; overflow: hidden; border-radius: 19px 19px 0 0; background: var(--ch-mist); }
.nex__img::before { content: ""; display: block; padding-top: 58%; }
.nex__img img { position: absolute; top: 0; left: 0; width: 100%; height: 100%; object-fit: cover; }
.nex__img img { transition: transform .9s var(--ch-ease); } .nex__a:hover .nex__img img { transform: scale(1.05); }
/* v1.0199: o crédito da foto e, sem foto publicada, a NOTA do Google em destaque na mesma faixa (todas as linhas com a mesma altura) */
.nex__img::after { content: ""; position: absolute; left: 0; right: 0; bottom: 0; height: 42%; background: linear-gradient(180deg, rgba(0, 0, 0, 0), rgba(0, 0, 0, .45)); pointer-events: none; }
.nex__cr { position: absolute; right: 9px; bottom: 7px; z-index: 1; font-style: normal; font-size: .5625rem; letter-spacing: .04em; color: rgba(255, 255, 255, .78); text-shadow: 0 1px 2px rgba(0, 0, 0, .5); }
.nex__img--score { background: radial-gradient(90% 90% at 50% 10%, #2a2a33, #0d0d11); color: #fff; }
.nex__img--score::after { display: none; }
.nex__sc { position: absolute; top: 0; right: 0; bottom: 0; left: 0; display: grid; place-content: center; justify-items: center; gap: 6px; text-align: center; }
.nex__sc em { font: 800 .625rem/1 var(--ch-body); font-style: normal; letter-spacing: .14em; text-transform: uppercase; color: #f6b400; }
.nex__sc b { font: 900 2.75rem/1 var(--ch-display); letter-spacing: -.04em; font-variant-numeric: tabular-nums; }
.nex__sc .nex__st { background: linear-gradient(90deg, #f6b400 var(--r, 0%), rgba(255, 255, 255, .22) var(--r, 0%)); }
.nex--top .nex__img--score { background: radial-gradient(90% 90% at 50% 10%, #3a1416, #16090a); box-shadow: inset 0 -1px 0 rgba(255, 255, 255, .08); }
.nex__top { display: flex; align-items: center; gap: 8px; min-width: 0; }
.nex__n { flex: none; display: grid; place-items: center; width: 28px; height: 28px; border-radius: 50%; background: var(--ch-mist); color: var(--ch-ink); font: 800 .8125rem/1 var(--ch-display); font-style: normal; }
.nex__p { flex: none; margin-left: auto; padding: 3px 8px; border-radius: 999px; background: var(--ch-mist); font-size: .6875rem; font-weight: 800; color: var(--ch-ink-2); font-variant-numeric: tabular-nums; }
.nex--top .nex__p { background: rgba(255, 255, 255, .12); color: #fff; }
.nex__k { display: block; margin-top: 3px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font: 700 .75rem/1.2 var(--ch-body); letter-spacing: 0; color: var(--ch-muted); }
.nex__t { display: grid; min-height: 3.6em; font: 800 1.0625rem/1.2 var(--ch-display); letter-spacing: -.015em; align-content: start; }
.nex__t > span { display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.nex__r { display: flex; align-items: center; gap: 6px; min-width: 0; }
.nex__st { flex: none; width: 82px; height: 15px; background: linear-gradient(90deg, #f6b400 var(--r, 0%), #dcdce1 var(--r, 0%));
  -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 15'%3E%3Cpath d='M8 0l2.35 4.76 5.25.77-3.8 3.7.9 5.23L8 11.99l-4.7 2.47.9-5.23L.4 5.53l5.25-.77z'/%3E%3C/svg%3E") 0 0 / 16.4px 15px repeat-x;
          mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 15'%3E%3Cpath d='M8 0l2.35 4.76 5.25.77-3.8 3.7.9 5.23L8 11.99l-4.7 2.47.9-5.23L.4 5.53l5.25-.77z'/%3E%3C/svg%3E") 0 0 / 16.4px 15px repeat-x; }
.nex__r b { font: 800 .9375rem/1 var(--ch-display); font-variant-numeric: tabular-nums; }
.nex__r small { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: .75rem; color: var(--ch-muted); font-variant-numeric: tabular-nums; }
.nex__d { display: flex; align-items: center; gap: 6px; min-width: 0; font-size: .8125rem; font-weight: 600; color: var(--ch-ink-2); } .nex__d > span:not(.nex__p) { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.nex__d svg { width: 15px; height: 15px; flex: none; fill: none; stroke: var(--ch-red); stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }
.nex__go { display: flex; align-items: center; gap: 5px; margin-top: 2px; padding-top: 10px; border-top: 1px solid var(--ch-line, rgba(11, 11, 13, .08)); font-size: .75rem; font-weight: 700; color: var(--ch-muted); transition: color .2s; }

/* o nº 1 ganha destaque (fundo escuro) */
.nex--top .nex__a { background: #111116; border-color: #111116; color: #fff; }
.nex--top .nex__n { background: var(--ch-red); color: #fff; }
.nex--top .nex__k, .nex--top .nex__r small, .nex--top .nex__go { color: rgba(255, 255, 255, .66); }
.nex--top .nex__d { color: rgba(255, 255, 255, .86); }
.nex--top .nex__st { background: linear-gradient(90deg, #f6b400 var(--r, 0%), rgba(255, 255, 255, .22) var(--r, 0%)); }
.nex--top .nex__go { border-top-color: rgba(255, 255, 255, .12); }

@media (min-width: 700px) { .nex { flex-basis: 38%; } }
@media (max-width: 559.98px) { .np-rh .np-more { letter-spacing: .06em; line-height: 1.35; gap: 8px; } .np-rh .np-more::after { display: none; } .np-rh { gap: 8px; } .np-nav__b { width: 38px; height: 38px; } } /* nome inteiro sempre (quebra em 2 linhas se precisar) */
@media (min-width: 1024px) {
  .ev.np-box { margin-top: 18px; padding: 36px 40px 40px; }
  .np-h { grid-template-columns: minmax(0, 1fr) auto; column-gap: 24px; }
  .np-h > * { grid-column: 1; }
  .np-h .np-go { grid-column: 2; grid-row: 1 / 4; align-self: end; margin: 0; padding: 0; }
  .np-l { grid-template-columns: repeat(12, minmax(0, 1fr)); gap: 22px 28px; }
  .np--lead, .np-sk--lead { grid-column: 1 / 8; grid-row: 1 / span var(--nc, 2); }
  .np--lead.np--solo { grid-column: 1 / -1; } .np--solo .np__a { grid-template-columns: minmax(0, 1.2fr) minmax(0, 1fr); align-items: center; gap: 28px; }
  .np--card, .np-sk { grid-column: 8 / 13; }
  .np--card { display: grid; min-height: 136px; } .np--card .np__a { align-content: center; } /* todas as linhas da coluna com a mesma altura */
  .np--card + .np--card { position: relative; } .np--card + .np--card::before { content: ""; position: absolute; left: 0; right: 0; top: -11px; height: 1px; background: var(--ch-line, rgba(11, 11, 13, .08)); }
  .np-tips, .np-eat, .np-more { grid-column: 1 / -1; }
  .np--line { grid-column: span 4; }
  .np--lead .np__a { grid-template-columns: minmax(0, 1fr); gap: 16px; align-items: start; }
  .np--lead .np__img::before { padding-top: 56%; }
  .np--lead .np__t { font-size: 2rem; line-height: 1.1; -webkit-line-clamp: 3; }
  .np--lead .np__d { -webkit-line-clamp: 3; font-size: 1rem; }
  .np--card .np__a { grid-template-columns: 124px minmax(0, 1fr); min-height: 0; }
  .np--card .np__img::before { padding-top: 78%; }
  .np-more + .np--line + .np--line .np__a, .np-more + .np--line + .np--line + .np--line .np__a { border-top: 0; padding-top: 0; }
  .np-rail, .np-eatl { margin: 0 -40px; padding-left: 40px; padding-right: 40px; scroll-padding: 0 40px; }
  .npt { flex-basis: calc((100% - 48px) / 4); max-width: none; }
  .np-eatl { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 14px; overflow: visible; margin: 0; padding: 2px 0 0; scroll-snap-type: none; }
  .nex { max-width: none; }
  .np-eat .np-nav { display: none; }
  .np-eat__sub small { flex-basis: auto; } .np-eat__sub small::before { content: "·"; margin-right: 8px; }
}
@media (min-width: 1280px) { .npt { flex-basis: calc((100% - 48px) / 4); } }
@media (prefers-reduced-motion: reduce) { .nex__a, .np-nav__b, .np-go a, .nex__img img { transition: none; } }
@media (max-width: 379.98px) { .np-more--tip em { display: none; } }

/* =================== v1.0190: SITE · MAPS · WAZE em cada cartão + a FICHA (toque no cartão) ===================
   O cartão inteiro é um botão (abre a ficha); por cima dele, os três atalhos de verdade: o site indicado no painel, o Google Maps
   e o Waze. A ficha: foto grande com legenda, distância do hotel, os mesmos botões e compartilhar; passa para a próxima com o dedo,
   setas ou teclado; fecha no ×, no Esc ou arrastando para baixo (site.js). */
.npt__a, .nex__a { position: relative; }
.npt__open { position: absolute; top: 0; right: 0; bottom: 0; left: 0; z-index: 1; width: 100%; height: 100%; padding: 0; border: 0; border-radius: inherit; background: transparent; cursor: pointer; -webkit-tap-highlight-color: transparent; }
.npt__open:focus-visible { outline: 3px solid var(--ch-red); outline-offset: 3px; }
.npt__acts, .nex__go { position: relative; z-index: 2; }
.npt__acts { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 6px; }
.npt__x { display: inline-flex; align-items: center; gap: 5px; min-height: 32px; padding: 0 11px 0 9px; border-radius: 999px; border: 1px solid rgba(255, 255, 255, .28); background: rgba(255, 255, 255, .14); -webkit-backdrop-filter: blur(10px); backdrop-filter: blur(10px); color: #fff; font: 800 .75rem/1 var(--ch-body); text-decoration: none; transition: background .2s, color .2s, transform .2s var(--ch-ease); }
.npt__x svg, .nex__x svg, .npt__km svg { width: 14px; height: 14px; flex: none; fill: none; stroke: currentColor; stroke-width: 2.2; stroke-linecap: round; stroke-linejoin: round; }
.npt__x:hover { background: #fff; color: var(--ch-ink); } .npt__x:active { transform: scale(.95); }
.npt__x--site { background: #fff; border-color: #fff; color: var(--ch-ink); } .npt__x--site svg { color: var(--ch-red); }
.npt__x--site:hover { background: var(--ch-red); border-color: var(--ch-red); color: #fff; } .npt__x--site:hover svg { color: #fff; }
.npt__x:focus-visible, .nex__x:focus-visible { outline: 3px solid var(--ch-red); outline-offset: 2px; }
.npt__km { display: flex; align-items: center; gap: 5px; font-size: .75rem; font-weight: 700; color: rgba(255, 255, 255, .86); }
.npt__more { position: absolute; top: 12px; right: 12px; display: grid; place-items: center; width: 32px; height: 32px; border-radius: 50%; background: rgba(0, 0, 0, .38); -webkit-backdrop-filter: blur(8px); backdrop-filter: blur(8px); opacity: 0; transform: scale(.8); transition: opacity .25s, transform .25s var(--ch-ease); }
.npt__more svg { width: 16px; height: 16px; fill: none; stroke: #fff; stroke-width: 2.2; stroke-linecap: round; stroke-linejoin: round; }
.npt__a:hover .npt__more, .npt__open:focus-visible ~ .npt__img .npt__more { opacity: 1; transform: none; }
@media (hover: none) { .npt__more { opacity: 1; transform: none; } }
.npt__cr { bottom: calc(100% + 2px); }
/* Onde comer: Maps e Waze no pé do cartão */
.nex__go { gap: 8px; }
.nex__x { display: inline-flex; align-items: center; gap: 5px; min-height: 30px; padding: 0 11px 0 9px; border-radius: 999px; border: 1px solid var(--ch-line, rgba(11, 11, 13, .12)); background: #fff; color: var(--ch-ink); font: 800 .75rem/1 var(--ch-body); text-decoration: none; transition: background .2s, color .2s, border-color .2s; }
.nex__x svg { color: var(--ch-red); }
.nex__x:hover { background: var(--ch-ink); border-color: var(--ch-ink); color: #fff; } .nex__x:hover svg { color: #fff; }
.nex--top .nex__x { background: rgba(255, 255, 255, .1); border-color: rgba(255, 255, 255, .2); color: #fff; } .nex--top .nex__x svg { color: #fff; }
.nex--top .nex__x:hover { background: #fff; color: var(--ch-ink); } .nex--top .nex__x:hover svg { color: var(--ch-red); }
.nex__d svg { width: 15px; height: 15px; flex: none; fill: none; stroke: var(--ch-red); stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }

/* ---------- a FICHA ---------- */
html.npd-on { overflow: hidden; }
.npd { position: fixed; top: 0; right: 0; bottom: 0; left: 0; z-index: 9000; display: grid; align-items: end; justify-items: center; }
.npd[hidden] { display: none; }
.npd__bg { position: absolute; top: 0; right: 0; bottom: 0; left: 0; background: rgba(8, 8, 10, .62); -webkit-backdrop-filter: blur(6px); backdrop-filter: blur(6px); opacity: 0; transition: opacity .3s; }
.npd.is-on .npd__bg { opacity: 1; }
.npd__card { position: relative; display: grid; grid-template-rows: auto minmax(0, 1fr); width: 100%; max-height: 92vh; max-height: 92dvh; overflow: hidden; border-radius: 26px 26px 0 0; background: #fff; color: var(--ch-ink); box-shadow: 0 -30px 60px -30px rgba(0, 0, 0, .5); transform: translateY(100%); transition: transform .42s var(--ch-ease); }
.npd.is-on .npd__card { transform: none; }
.npd__card.is-drag { transition: none; }
.npd__grab { position: absolute; z-index: 3; top: 8px; left: 50%; width: 42px; height: 5px; margin-left: -21px; border-radius: 3px; background: rgba(255, 255, 255, .7); box-shadow: 0 1px 4px rgba(0, 0, 0, .3); }
.npd__media { position: relative; overflow: hidden; background: #16161b; color: #fff; }
.npd__media::before { content: ""; display: block; padding-top: 62%; }
.npd__media > img, .npd__media > .npt__art { position: absolute; top: 0; left: 0; width: 100%; height: 100%; object-fit: cover; }
.npd__media::after { content: ""; position: absolute; left: 0; right: 0; bottom: 0; height: 45%; background: linear-gradient(180deg, rgba(0, 0, 0, 0), rgba(0, 0, 0, .6)); pointer-events: none; }
.npd__w { position: absolute; z-index: 2; top: 16px; left: 16px; padding: 7px 12px; border-radius: 999px; background: var(--ch-red); color: #fff; font: 800 .8125rem/1 var(--ch-body); font-style: normal; box-shadow: 0 8px 18px -8px rgba(234, 32, 37, .9); }
.npd__w:empty { display: none; }
.npd__cap { position: absolute; z-index: 2; left: 16px; right: 16px; bottom: 12px; margin: 0; font-size: .75rem; line-height: 1.35; color: rgba(255, 255, 255, .9); text-shadow: 0 1px 6px rgba(0, 0, 0, .5); }
.npd__cap:empty { display: none; }
.npd__cap b { font-weight: 800; }
.npd__cap i { font-style: normal; opacity: .7; }
/* nota do Google (restaurante sem foto) */
.npd__score { position: absolute; z-index: 1; top: 0; right: 0; bottom: 0; left: 0; display: grid; place-content: center; justify-items: center; gap: 8px; background: radial-gradient(90% 80% at 50% 20%, #2a2a33, #0d0d11); text-align: center; }
.npd__score b { font: 900 4.5rem/1 var(--ch-display); letter-spacing: -.04em; }
.npd__score .nex__st { width: 124px; height: 22px; -webkit-mask-size: 24.8px 22px; mask-size: 24.8px 22px; background: linear-gradient(90deg, #f6b400 var(--r, 0%), rgba(255, 255, 255, .22) var(--r, 0%)); }
.npd__score small { font-size: .8125rem; font-weight: 700; color: rgba(255, 255, 255, .7); }
.npd__score em { font-style: normal; font: 800 .6875rem/1 var(--ch-body); letter-spacing: .14em; text-transform: uppercase; color: #f6b400; }
.npd__body { display: grid; align-content: start; gap: 12px; padding: 20px 20px calc(20px + env(safe-area-inset-bottom)); overflow-y: auto; -webkit-overflow-scrolling: touch; overscroll-behavior: contain; }
.npd__k { display: flex; align-items: center; gap: 8px; margin: 0; font: 800 .6875rem/1.2 var(--ch-body); letter-spacing: .14em; text-transform: uppercase; color: var(--ch-red); }
.npd__k span { color: var(--ch-muted); letter-spacing: .04em; }
.npd__t { margin: 0; font: 900 max(1.5rem, min(6.4vw, 2.125rem))/1.08 var(--ch-display); letter-spacing: -.03em; }
.npd__d { margin: 0; font-size: 1rem; line-height: 1.5; color: var(--ch-ink-2); }
.npd__d:empty, .npd__km:empty, .npd__meta:empty { display: none; }
.npd__meta { margin: -4px 0 0; font-size: .875rem; font-weight: 700; color: var(--ch-muted); }
.npd__km { display: flex; align-items: center; gap: 8px; margin: 0; padding: 12px 14px; border-radius: 14px; background: var(--ch-mist); font-size: .9375rem; font-weight: 700; }
.npd__km svg { width: 18px; height: 18px; flex: none; fill: none; stroke: var(--ch-red); stroke-width: 2.2; stroke-linecap: round; stroke-linejoin: round; }
.npd__acts { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; margin-top: 2px; }
.npd__b { display: inline-flex; align-items: center; justify-content: center; gap: 9px; min-height: 54px; padding: 0 16px; border-radius: 16px; border: 1px solid var(--ch-line, rgba(11, 11, 13, .12)); background: #fff; color: var(--ch-ink); font: 800 .9375rem/1 var(--ch-body); text-decoration: none; cursor: pointer; transition: background .2s, color .2s, border-color .2s, transform .2s var(--ch-ease); -webkit-tap-highlight-color: transparent; }
.npd__b svg { width: 20px; height: 20px; flex: none; fill: none; stroke: currentColor; stroke-width: 2.1; stroke-linecap: round; stroke-linejoin: round; }
.npd__b:active { transform: scale(.97); }
.npd__b:focus-visible { outline: 3px solid var(--ch-red); outline-offset: 2px; }
.npd__b[hidden] { display: none; }
.npd__b--site { grid-column: 1 / -1; background: var(--ch-red); border-color: var(--ch-red); color: #fff; box-shadow: 0 14px 26px -16px rgba(234, 32, 37, .9); }
.npd__b--site:hover { background: #c8151b; }
.npd__b--maps svg { color: var(--ch-red); } .npd__b--waze svg { color: #0a9fd6; }
.npd__b--maps:hover, .npd__b--waze:hover, .npd__b--share:hover { border-color: var(--ch-ink); }
.npd__b--share { grid-column: 1 / -1; min-height: 46px; border-style: dashed; color: var(--ch-ink-2); font-size: .875rem; }
.npd__nav { display: flex; align-items: center; justify-content: space-between; gap: 10px; margin-top: 4px; padding-top: 14px; border-top: 1px solid var(--ch-line, rgba(11, 11, 13, .08)); }
.npd__nav button { display: inline-flex; align-items: center; gap: 6px; min-height: 44px; padding: 0 14px; border-radius: 999px; border: 1px solid var(--ch-line, rgba(11, 11, 13, .12)); background: #fff; color: var(--ch-ink); font: 700 .875rem/1 var(--ch-body); cursor: pointer; }
.npd__nav button:disabled { opacity: .35; cursor: default; }
.npd__nav button svg { width: 16px; height: 16px; fill: none; stroke: currentColor; stroke-width: 2.4; stroke-linecap: round; stroke-linejoin: round; }
.npd__nav[hidden] { display: none; }
.npd__nav span { font: 800 .8125rem/1 var(--ch-body); color: var(--ch-muted); font-variant-numeric: tabular-nums; }
.npd__x { position: absolute; z-index: 4; top: 12px; right: 12px; display: grid; place-items: center; width: 42px; height: 42px; padding: 0; border: 0; border-radius: 50%; background: rgba(0, 0, 0, .45); -webkit-backdrop-filter: blur(8px); backdrop-filter: blur(8px); color: #fff; cursor: pointer; }
.npd__x svg { width: 20px; height: 20px; fill: none; stroke: currentColor; stroke-width: 2.4; stroke-linecap: round; }
.npd__x:focus-visible { outline: 3px solid #fff; outline-offset: 2px; }
.npd__toast { position: absolute; z-index: 5; left: 50%; bottom: 20px; transform: translate(-50%, 20px); padding: 10px 16px; border-radius: 999px; background: var(--ch-ink); color: #fff; font: 700 .8125rem/1 var(--ch-body); opacity: 0; pointer-events: none; transition: opacity .25s, transform .25s; }
.npd__toast.is-on { opacity: 1; transform: translate(-50%, 0); }
.npd__card.is-swap .npd__media > *, .npd__card.is-swap .npd__body > * { animation: npd-in .35s var(--ch-ease); }
@keyframes npd-in { from { opacity: 0; transform: translateX(var(--sx, 18px)); } to { opacity: 1; transform: none; } }
@media (min-width: 760px) {
  .npd { align-items: center; padding: 32px; }
  .npd__card { grid-template-columns: minmax(0, 1.05fr) minmax(0, 1fr); grid-template-rows: none; width: min(980px, 100%); max-height: min(640px, calc(100vh - 64px)); border-radius: 28px; transform: translateY(24px) scale(.97); opacity: 0; transition: transform .35s var(--ch-ease), opacity .3s; }
  .npd.is-on .npd__card { transform: none; opacity: 1; }
  .npd__grab { display: none; }
  .npd__media::before { padding-top: 0; height: 100%; }
  .npd__media { min-height: 520px; }
  .npd__body { padding: 36px 34px 28px; align-content: center; }
  .npd__x { background: rgba(255, 255, 255, .92); color: var(--ch-ink); box-shadow: 0 6px 18px -8px rgba(0, 0, 0, .4); }
}
@media (prefers-reduced-motion: reduce) { .npd__card, .npd__bg, .npt__more, .npt__x, .nex__x { transition: none; } .npd__card.is-swap .npd__media > *, .npd__card.is-swap .npd__body > * { animation: none; } }
@media (max-width: 699.98px) { .npt { flex-basis: 76%; max-width: 290px; } .npt__x { min-height: 30px; padding: 0 10px 0 8px; } } /* v1.0190: cabe Site · Maps · Waze numa linha */
/* v1.0190: cartão estreito — Maps e Waze viram só o ícone (o nome continua para o leitor de tela) e tudo cabe numa linha */
.npt__a { container-type: inline-size; }
.npt__acts { flex-wrap: nowrap; }
@container (max-width: 252px) {
  .npt__x:not(.npt__x--site) { width: 32px; padding: 0; justify-content: center; font-size: 0; gap: 0; }
  .npt__x:not(.npt__x--site) svg { width: 16px; height: 16px; }
}
@container (max-width: 190px) { .npt__x--site { padding: 0 9px 0 8px; } .npt__acts { gap: 5px; } }
/* v1.0191: o link da página com o endereço embaixo e a fonte do resumo */
.npd__b--site { flex-direction: row; flex-wrap: wrap; row-gap: 2px; }
.npd__b--site small { flex-basis: 100%; text-align: center; font: 600 .75rem/1.1 var(--ch-body); color: rgba(255, 255, 255, .8); }
.npd__b--site small:empty { display: none; }
.npd__b--site:has(small:not(:empty)) { min-height: 62px; }
.npd__src { margin: -6px 0 0; font-size: .75rem; font-weight: 600; color: var(--ch-muted); }
.npd__src:empty { display: none; }
.npd__src::before { content: "↳ "; }
/* =================== v1.0192: GUIA DO CARNEIRO HOTEL (as "Dicas do Carneiro Hotel" em formato de revista) ===================
   Capa com Itatiba no fim de tarde · a SUGESTÃO DE HOJE em destaque (foto grande, texto do hotel e a "Dica do Carneiro") ·
   filtros por categoria (um toque; site.js) · uma vitrine só com os destaques do painel + os lugares do guia (inc/guide.php). */
.ng { grid-column: 1 / -1; display: grid; gap: 16px; min-width: 0; scroll-margin-top: 110px; }
.ng__cover { position: relative; display: grid; align-items: end; min-height: 214px; overflow: hidden; border-radius: 24px; background: #1b1413; color: #fff; isolation: isolate; }
.ng__cover > img { position: absolute; top: 0; left: 0; z-index: -2; width: 100%; height: 100%; object-fit: cover; object-position: 50% 62%; }
.ng__cover::before { content: ""; position: absolute; top: 0; right: 0; bottom: 0; left: 0; z-index: -1; background: linear-gradient(180deg, rgba(10, 8, 8, .05) 0%, rgba(10, 8, 8, .45) 45%, rgba(10, 8, 8, .88) 100%); }
.ng__cv { display: grid; justify-items: start; gap: 8px; padding: 46px 20px 20px; }
.ng__k { display: inline-flex; align-items: center; gap: 6px; padding: 6px 11px 6px 9px; border-radius: 999px; background: var(--ch-red); font: 800 .6875rem/1.1 var(--ch-body); letter-spacing: .12em; text-transform: uppercase; box-shadow: 0 8px 18px -8px rgba(234, 32, 37, .9); }
.ng__k svg { width: 13px; height: 13px; flex: none; fill: #fff; }
.ng__t { max-width: 17em; font: 900 max(1.5rem, min(6.6vw, 2.5rem))/1.06 var(--ch-display); letter-spacing: -.035em; text-shadow: 0 2px 18px rgba(0, 0, 0, .35); }
.ng__d { max-width: 40em; font-size: .875rem; line-height: 1.45; font-weight: 600; color: rgba(255, 255, 255, .86); }
.ng__cr, .ngf__cr { position: absolute; top: 10px; right: 12px; font-style: normal; font-size: .5625rem; letter-spacing: .04em; color: rgba(255, 255, 255, .7); text-shadow: 0 1px 4px rgba(0, 0, 0, .5); }
/* a sugestão de hoje */
.ngf { display: grid; overflow: hidden; border-radius: 24px; background: var(--ch-mist, #f5f5f7); min-width: 0; }
.ngf__img { position: relative; display: block; overflow: hidden; background: #16161b; }
.ngf__img::before { content: ""; display: block; padding-top: 62%; }
.ngf__img > img, .ngf__img > .npt__art { position: absolute; top: 0; left: 0; width: 100%; height: 100%; object-fit: cover; }
.ngf__tag { position: absolute; top: 14px; left: 14px; display: inline-flex; align-items: center; gap: 6px; padding: 7px 12px 7px 9px; border-radius: 999px; background: #fff; color: var(--ch-ink); font: 800 .75rem/1 var(--ch-body); font-style: normal; letter-spacing: .02em; box-shadow: 0 10px 24px -12px rgba(0, 0, 0, .6); }
.ngf__tag svg { width: 16px; height: 16px; flex: none; fill: none; stroke: #f0a30a; stroke-width: 2.2; stroke-linecap: round; }
.ngf__cr { top: auto; bottom: 10px; }
.ngf__b { display: grid; align-content: center; gap: 10px; min-width: 0; padding: 20px 20px 22px; }
.ngf__b > p { margin: 0; }
.ngf__k { font: 800 .6875rem/1.3 var(--ch-body); letter-spacing: .12em; text-transform: uppercase; color: var(--ch-red); }
.ngf__t { margin: 0; font: 900 max(1.5rem, min(6.4vw, 2.125rem))/1.06 var(--ch-display); letter-spacing: -.03em; color: var(--ch-ink); }
.ngf__s { margin-top: -4px !important; font: 700 1rem/1.35 var(--ch-body); color: var(--ch-ink); }
.ngf__x { font-size: .9375rem; line-height: 1.55; color: var(--ch-ink-2); }
.ngf__tip, .npd__tip { position: relative; padding: 12px 14px 12px 16px; border-radius: 14px; background: #fff; border-left: 4px solid var(--ch-red); font-size: .875rem; line-height: 1.5; color: var(--ch-ink); box-shadow: 0 10px 24px -20px rgba(11, 11, 13, .5); }
.ngf__tip b, .npd__tip b { display: block; margin-bottom: 3px; font: 800 .6875rem/1.2 var(--ch-body); letter-spacing: .12em; text-transform: uppercase; color: var(--ch-red); }
.ngf__acts { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; margin-top: 4px; }
.ngf__more { display: inline-flex; align-items: center; justify-content: center; gap: 8px; min-height: 46px; padding: 0 18px; border: 0; border-radius: 999px; background: var(--ch-ink); color: #fff; font: 800 .875rem/1 var(--ch-body); cursor: pointer; transition: background .2s, transform .2s var(--ch-ease); }
.ngf__more svg { width: 16px; height: 16px; fill: none; stroke: currentColor; stroke-width: 2.4; stroke-linecap: round; stroke-linejoin: round; transition: transform .25s var(--ch-ease); }
.ngf__more:hover { background: var(--ch-red); } .ngf__more:hover svg { transform: translateX(3px); } .ngf__more:active { transform: scale(.97); }
.ngf__more:focus-visible { outline: 3px solid var(--ch-red); outline-offset: 2px; }
.ngf .npt__acts { margin: 0; gap: 8px; }
.ngf .npt__x { min-height: 46px; padding: 0 15px 0 13px; border-color: var(--ch-line, rgba(11, 11, 13, .12)); background: #fff; -webkit-backdrop-filter: none; backdrop-filter: none; color: var(--ch-ink); font-size: .8125rem; }
.ngf .npt__x svg { color: var(--ch-red); } .ngf .npt__x:hover { border-color: var(--ch-ink); background: #fff; color: var(--ch-ink); }
.ngf .npt__x--site:hover { background: #fff; }
/* filtros */
.ng__bar { align-items: center; }
.ng__cats { flex: 1; min-width: 0; display: flex; gap: 8px; margin: 0 0 0 -24px; padding: 2px 4px 2px 24px; overflow-x: auto; scrollbar-width: none; -webkit-overflow-scrolling: touch; overscroll-behavior-x: contain; }
.ng__cats::-webkit-scrollbar { display: none; }
.ng__cat { flex: none; display: inline-flex; align-items: center; gap: 7px; min-height: 40px; padding: 0 10px 0 14px; border-radius: 999px; border: 1px solid var(--ch-line, rgba(11, 11, 13, .12)); background: #fff; color: var(--ch-ink); font: 700 .8125rem/1 var(--ch-body); white-space: nowrap; text-decoration: none; cursor: pointer; transition: background .2s, color .2s, border-color .2s, transform .2s var(--ch-ease); -webkit-tap-highlight-color: transparent; }
.ng__cat em { display: inline-grid; place-items: center; min-width: 22px; height: 22px; padding: 0 6px; border-radius: 999px; background: var(--ch-mist, #f5f5f7); font: 800 .6875rem/1 var(--ch-body); font-style: normal; color: var(--ch-muted); }
.ng__cat:hover { border-color: var(--ch-ink); } .ng__cat:active { transform: scale(.96); }
.ng__cat[aria-pressed="true"] { background: var(--ch-ink); border-color: var(--ch-ink); color: #fff; }
.ng__cat[aria-pressed="true"] em { background: rgba(255, 255, 255, .16); color: #fff; }
.ng__cat:focus-visible { outline: 3px solid var(--ch-red); outline-offset: 2px; }
.ng__cat--go { padding: 0 12px 0 14px; border-style: dashed; color: var(--ch-red); }
.ng__cat--go[hidden] { display: none; }
.ng__cat--go svg { width: 15px; height: 15px; fill: none; stroke: currentColor; stroke-width: 2.4; stroke-linecap: round; stroke-linejoin: round; }
.npt[hidden] { display: none; }
/* o selo da categoria em cada cartão */
.npt__c { justify-self: start; max-width: 100%; padding: 4px 8px; border-radius: 999px; background: rgba(255, 255, 255, .18); -webkit-backdrop-filter: blur(8px); backdrop-filter: blur(8px); font: 800 .625rem/1.1 var(--ch-body); letter-spacing: .1em; text-transform: uppercase; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.npt[data-cat="hotel"] .npt__c { background: var(--ch-red); }
.npt--g .npt__b b { -webkit-line-clamp: 2; }
.ng__rail { padding-top: 2px; }
/* a ficha: a dica do Carneiro e para quem é */
.npd__meta.is-kick { margin: -4px 0 0; font: 700 1rem/1.35 var(--ch-body); color: var(--ch-ink); }
.npd__tip:empty, .npd__ideal:empty { display: none; }
.npd__tip { margin: 0; }
.npd__ideal { display: flex; flex-wrap: wrap; align-items: center; gap: 6px; margin: 0; }
.npd__ideal b { margin-right: 4px; font: 800 .6875rem/1.2 var(--ch-body); letter-spacing: .12em; text-transform: uppercase; color: var(--ch-muted); }
.npd__ideal span { display: inline-flex; align-items: center; min-height: 28px; padding: 0 11px; border-radius: 999px; background: var(--ch-mist, #f5f5f7); font: 700 .8125rem/1 var(--ch-body); color: var(--ch-ink); }
@media (max-width: 699.98px) { .ng__bar .np-nav { display: none; } .ng__cats { margin: 0 -24px; padding: 2px 24px; } } /* celular: os filtros de ponta a ponta (a vitrine anda com o dedo) */
@media (max-width: 559.98px) {
  .ngf__more { flex: 1 1 100%; }
  .ngf .npt__acts { flex: 1 1 100%; }
  .ngf .npt__x { flex: 1 1 0; justify-content: center; padding: 0 8px; }
}
@media (min-width: 700px) {
  .ng__cover { min-height: 250px; }
  .ng__cv { padding: 60px 28px 26px; }
  .ngf { grid-template-columns: minmax(0, 1.1fr) minmax(0, 1fr); }
  .ngf__img::before { padding-top: 0; height: 100%; min-height: 340px; }
  .ngf__b { padding: 26px 28px; }
}
@media (min-width: 1024px) {
  .ng { gap: 18px; }
  .ng__cover { min-height: 280px; border-radius: 26px; }
  .ng__cv { padding: 70px 36px 32px; }
  .ng__d { font-size: .9375rem; }
  .ngf { grid-template-columns: minmax(0, 1.25fr) minmax(0, 1fr); border-radius: 26px; }
  .ngf__img::before { min-height: 420px; }
  .ngf__b { padding: 34px 38px; gap: 12px; }
  .ngf__t { font-size: 2.25rem; }
  .ng__cats { margin-left: 0; padding-left: 2px; flex-wrap: wrap; overflow: visible; }
  .ng__cat--go { display: none; } /* no computador o atalho "Onde comer" já está no cabeçalho do jornal */
}
@media (prefers-reduced-motion: reduce) { .ng__cat, .ngf__more, .ngf__more svg { transition: none; } }
.npd__k span { white-space: nowrap; }
@media (min-width: 760px) { .npd__k { padding-right: 44px; } }
@media (min-width: 700px) and (max-width: 1023.98px) { .ng__cats { -webkit-mask-image: linear-gradient(90deg, #000 calc(100% - 28px), transparent); mask-image: linear-gradient(90deg, #000 calc(100% - 28px), transparent); padding-right: 24px; } }

/* v1.0193: assinatura só com o nome e a empresa (sem link): não levanta no mouse e o nome aparece em qualquer largura */
.dev-sign--premium:not(a):hover { transform: none; }
.dev-sign--premium:not(a) { cursor: default; row-gap: 5px; }
@media (max-width: 380px) { .dev-sign--premium .dev-sign__pe { display: inline; } }

/* v1.0194: MINHA RESERVA — no topo (computador e tablet), no menu e no rodapé */
.top__res { background: #fff; color: var(--ch-ink); border-color: rgba(11, 11, 13, .14); }
.top__res svg { stroke: var(--ch-red); }
.top__res:hover { background: #fff; box-shadow: 0 0 0 2px rgba(11, 11, 13, .18); }
@media (max-width: 719.98px) { .top__res { display: none; } } /* celular e tablet estreito: fica no Menu e no rodapé (no topo não cabe junto com Reservar) */
.menu__acc { display: grid; gap: 10px; margin-top: 18px; }
.menu__acc .menu__own { margin-top: 0; }
.menu__res { background: #fff; color: var(--ch-ink); box-shadow: inset 0 0 0 1.5px rgba(11, 11, 13, .12); }
.menu__res .menu__own-t small { color: var(--ch-muted); }
.foot__res { background: #fff !important; color: var(--ch-ink) !important; box-shadow: inset 0 0 0 1.5px rgba(11, 11, 13, .14); }
.foot__res svg { stroke: var(--ch-red); }
.foot__res:hover { background: var(--ch-ink) !important; color: #fff !important; }

/* ================= v1.0202 · o hóspede ENXERGA: Área do hóspede em destaque no topo fixo, idioma por último num menu, WhatsApp chamativo ================= */
/* Área do hóspede: pílula vermelha com o boneco num círculo branco — celular e computador (antes era um ícone de prédio perdido no topo) */
.top__res { position: relative; gap: 9px; min-height: 46px; padding: 0 16px 0 6px; border: 0; background: linear-gradient(180deg, #f0373c 0%, #d3161c 100%); color: #fff; box-shadow: 0 10px 22px -10px rgba(214, 22, 28, .8), inset 0 1px 0 rgba(255, 255, 255, .32), inset 0 -1px 0 rgba(0, 0, 0, .12); transition: transform .2s var(--ch-ease), box-shadow .2s, filter .2s; }
.top__res:hover { background: linear-gradient(180deg, #f0373c 0%, #d3161c 100%); filter: brightness(1.06); transform: translateY(-1px); box-shadow: 0 14px 26px -10px rgba(214, 22, 28, .9), inset 0 1px 0 rgba(255, 255, 255, .32); }
.top__res:focus-visible { outline: 3px solid rgba(234, 32, 37, .45); outline-offset: 3px; }
.top__res-i { position: relative; display: grid; place-items: center; flex: none; width: 34px; height: 34px; border-radius: 50%; background: #fff; }
.top__res .top__res-i svg { width: 20px; height: 20px; stroke: var(--ch-red); }
.top__res-b { position: absolute; top: -6px; right: -8px; display: grid; place-items: center; min-width: 20px; height: 20px; padding: 0 5px; border-radius: 999px; background: var(--ch-ink); color: #fff; font: 900 .625rem/1 var(--ch-display); font-variant-numeric: tabular-nums; box-shadow: 0 0 0 2px #fff; }
.top__res-b.is-star { background: #ffc233; color: var(--ch-ink); font-size: .6875rem; }
.top__res-b.is-dot { min-width: 12px; width: 12px; height: 12px; top: -2px; right: -2px; padding: 0; background: #1faa55; }
.top__res-l { font: 800 .9375rem/1 var(--ch-body); letter-spacing: -.005em; white-space: nowrap; }
.top__res-t { display: none; }
/* v1.0203: sem sombra e sem brilho em volta (nada de halo) — só a pílula vermelha, limpa */
.top__res, .top__res:hover { box-shadow: none; }
.top__res::after { content: none; }
/* v1.0204: IGUAL ao botão Reservar — mesmo vermelho, mesma sombra, mesma letra, mesmo toque (sem o brilho no mouse) */
.top__res, .top__res:hover { background: var(--ch-red-deep); filter: none; transform: none; box-shadow: 0 14px 28px -12px rgba(234, 32, 37, .5), 0 2px 6px -2px rgba(0, 0, 0, .18); transition: transform .25s var(--ch-ease); }
.top__res:active { transform: scale(.97); }
.top__res-l { font: 600 .9375rem/1 var(--ch-body); letter-spacing: .01em; }
.top__res-t b { font-weight: 600; letter-spacing: .01em; }
@media (max-width: 719.98px) { .top__res { display: inline-flex; } .top__key { display: none; } .top__menu { padding: 0; width: 46px; justify-content: center; } .top__menu span { display: none; } }
/* celular: logotipo · Área do hóspede · Reservar · idioma (o Menu está na barra de baixo; a chave do proprietário fica no Menu e no rodapé) */
@media (max-width: 559.98px) {
  .top__res { width: auto; height: 46px; min-height: 46px; padding: 0 12px 0 5px; gap: 7px; justify-content: flex-start; flex: 0 1 auto; min-width: 0; }
  .top__res-i { width: 32px; height: 32px; }
  .top__res-b { right: auto; left: -7px; } /* o selo vai para o lado de fora, sem cobrir o "ÁREA DO" */
  .top__res-l { display: none; }
  .top__res-t { display: grid; min-width: 0; text-align: left; }
  .top__res-t small { font: 800 .5625rem/1.15 var(--ch-body); letter-spacing: .08em; text-transform: uppercase; color: rgba(255, 255, 255, .85); white-space: nowrap; }
  .top__res-t b { font: 800 .875rem/1.1 var(--ch-body); white-space: nowrap; }
  .top__in { gap: 7px; }
  .top__book { padding: 0 14px; }
}
@media (max-width: 374.98px) {
  .top__in { gap: 5px; }
  .top__res { padding: 0 9px 0 4px; gap: 6px; }
  .top__book { padding: 0 11px; font-size: .875rem; }
  .top .brand__logo { height: 40px; }
}
/* computador estreito com a barra de busca no topo: tudo cabe, a Área do hóspede nunca some */
@media (min-width: 1024px) and (max-width: 1279.98px) { .top__res { padding: 0 14px 0 6px; } .top__res-l { font-size: .875rem; } .top__key .top__own-t { display: none; } }

/* idioma: o ÚLTIMO item da barra, como um menu — bandeira atual ▾ → lista com as 3 bandeiras e o nome de cada idioma */
.langdd { position: relative; flex: none; }
.langdd__btn { display: inline-flex; align-items: center; gap: 6px; height: 46px; padding: 0 10px 0 11px; border-radius: 999px; border: 1px solid rgba(11, 11, 13, .12); background: rgba(11, 11, 13, .05); color: var(--ch-ink); font: 800 .75rem/1 var(--ch-body); letter-spacing: .04em; cursor: pointer; list-style: none; -webkit-user-select: none; user-select: none; -webkit-tap-highlight-color: transparent; transition: background .2s, box-shadow .2s; }
.langdd__btn::-webkit-details-marker { display: none; }
.langdd__btn::marker { content: ""; }
.langdd__btn:hover { background: rgba(11, 11, 13, .1); }
.langdd__btn:focus-visible { outline: 3px solid rgba(234, 32, 37, .45); outline-offset: 2px; }
.langdd__btn .flag { width: 24px; height: 17px; }
.langdd__chev { width: 14px; height: 14px; fill: none; stroke: currentColor; stroke-width: 2.4; stroke-linecap: round; stroke-linejoin: round; opacity: .6; transition: transform .25s var(--ch-ease); }
.langdd[open] .langdd__btn { background: #fff; box-shadow: 0 0 0 1.5px var(--ch-red); border-color: transparent; }
.langdd[open] .langdd__chev { transform: rotate(180deg); }
.langdd__pop { position: absolute; z-index: 20; top: calc(100% + 12px); right: 0; display: grid; gap: 2px; min-width: 196px; padding: 6px; border-radius: 18px; background: #fff; box-shadow: 0 24px 50px -18px rgba(0, 0, 0, .45), 0 0 0 1px rgba(11, 11, 13, .07); animation: langdd-in .22s var(--ch-ease); }
@keyframes langdd-in { from { opacity: 0; transform: translateY(-6px) scale(.98); } to { opacity: 1; transform: none; } }
.langdd__a { display: flex; align-items: center; gap: 12px; min-height: 48px; padding: 0 12px; border-radius: 12px; color: var(--ch-ink); text-decoration: none; font: 700 .9375rem/1 var(--ch-body); -webkit-tap-highlight-color: transparent; transition: background .15s; }
.langdd__a:hover, .langdd__a:focus-visible { background: rgba(11, 11, 13, .05); outline: 0; }
.langdd__a.is-on { background: rgba(234, 32, 37, .07); }
.langdd__a .flag { width: 26px; height: 18px; }
.langdd__ok { width: 18px; height: 18px; margin-left: auto; fill: none; stroke: var(--ch-red); stroke-width: 2.6; stroke-linecap: round; stroke-linejoin: round; }
.langdd__pop.is-going .langdd__a { pointer-events: none; }
.langdd__a.is-going .flag { animation: flag-go .55s ease-in-out infinite alternate; }
.langdd__code { display: none; } /* só a bandeira + ▾ (o nome do idioma aparece na lista) */
@media (max-width: 559.98px) { .langdd__btn { gap: 4px; padding: 0 8px 0 10px; } }
/* computador: a barra ganha largura para a Área do hóspede e o idioma caberem sem apertar os links nem a busca */
@media (min-width: 1280px) { .top__in { max-width: min(1320px, calc(100% - 20px)); } }
@media (max-width: 374.98px) { .langdd__btn { padding: 0 6px 0 8px; } .langdd__btn .flag { width: 22px; height: 15.5px; } }
@media (prefers-reduced-motion: reduce) { .langdd__pop { animation: none; } .langdd__a.is-going .flag { animation: none; } }

/* WhatsApp: maior, verde vivo, com o nome escrito (no computador sempre; no celular aparece ao abrir e de tempos em tempos) e uma onda que chama o olho */
.wa-fab::before { content: none; } /* v1.0311: sem onda, brilho nem contorno — chapado */
html.fab-esc .wa-fab, html.fab-esc .gx-fab { opacity: 0; pointer-events: none; transform: translateY(10px); } /* v1.0311: a pilha inteira (Kira, «Minha área», WhatsApp) some só enquanto estiver em cima do quadro de reserva da capa — site.js põe html.fab-esc */

/* ================= v1.0206 · botões de ROTA (Google Maps / Waze): ícone colorido de cada app e alvo de toque grande no celular ================= */
svg.navic { flex: none; overflow: visible; }
.npt__x svg.navic, .nex__x svg.navic { width: 16px; height: 16px; }
.npd__b svg.navic { width: 22px; height: 22px; }
.loc__btn svg.navic { width: 20px; height: 20px; }
.map__go .glass svg.navic { width: 20px; height: 20px; }
.map__go .glass { gap: 8px; }
@media (pointer: coarse) {
  .npt__x, .nex__x { min-height: 40px; padding: 0 14px 0 11px; gap: 6px; }
  .npt__x svg.navic, .nex__x svg.navic { width: 18px; height: 18px; }
  @container (max-width: 252px) { .npt__x:not(.npt__x--site) { width: 40px; padding: 0; } } /* cartão estreito: o botão só com o ícone fica um círculo de 40 px */
}

/* ================= v1.0207 · COMO CHEGAR — a janela com Waze e Google Maps (barra de baixo, menu, rodapé e /chegar) ================= */
.go { position: fixed; top: 0; right: 0; bottom: 0; left: 0; z-index: 5200; display: grid; align-items: end; justify-items: center; }
.go[hidden] { display: none; }
.go__bg { position: absolute; top: 0; right: 0; bottom: 0; left: 0; background: rgba(8, 8, 10, .62); -webkit-backdrop-filter: blur(6px); backdrop-filter: blur(6px); opacity: 0; transition: opacity .3s; }
.go.is-open .go__bg { opacity: 1; }
.go__card { position: relative; width: 100%; max-height: 92vh; max-height: 92dvh; overflow-y: auto; overscroll-behavior: contain; padding: 26px 20px calc(20px + env(safe-area-inset-bottom)); border-radius: 26px 26px 0 0; background: #fff; color: var(--ch-ink); box-shadow: 0 -30px 60px -30px rgba(0, 0, 0, .5); transform: translateY(100%); transition: transform .42s var(--ch-ease); }
.go.is-open .go__card { transform: none; }
.go__card.is-drag { transition: none; }
.go__grab { position: absolute; top: 8px; left: 50%; width: 42px; height: 5px; margin-left: -21px; border-radius: 3px; background: rgba(11, 11, 13, .16); }
.go__x { position: absolute; top: 14px; right: 14px; display: grid; place-items: center; width: 44px; height: 44px; border: 0; border-radius: 50%; background: rgba(11, 11, 13, .06); color: var(--ch-ink); cursor: pointer; }
.go__x svg { width: 20px; height: 20px; fill: none; stroke: currentColor; stroke-width: 2.2; stroke-linecap: round; }
.go__x:hover { background: rgba(11, 11, 13, .1); }
.go__k { display: flex; align-items: center; gap: 6px; margin: 0 56px 6px 0; font: 800 .6875rem/1.2 var(--ch-body); letter-spacing: .12em; text-transform: uppercase; color: var(--ch-red); }
.go__k svg { width: 15px; height: 15px; fill: none; stroke: currentColor; stroke-width: 2.2; stroke-linecap: round; stroke-linejoin: round; }
.go__t { margin: 0 56px 10px 0; font: 800 1.75rem/1.1 var(--ch-display); letter-spacing: -.02em; }
.go__a { display: grid; gap: 2px; margin: 0 0 8px; font-size: 1rem; line-height: 1.35; }
.go__a span { color: var(--ch-muted); font-size: .9375rem; }
.go__d { margin: 0 0 16px; color: var(--ch-muted); font-size: .9375rem; line-height: 1.45; }
.go__apps { display: grid; grid-template-columns: 1fr; gap: 10px; } /* celular: um aplicativo por linha, botão grande */
.go__app { display: flex; align-items: center; gap: 12px; min-height: 72px; padding: 12px 14px; border-radius: 20px; border: 1.5px solid rgba(11, 11, 13, .12); background: #fff; color: var(--ch-ink); text-decoration: none; transition: border-color .2s, background .2s, transform .15s; -webkit-tap-highlight-color: transparent; }
.go__app svg.navic { width: 34px; height: 34px; }
.go__app span { display: grid; gap: 3px; min-width: 0; }
.go__app b { font: 800 1.0625rem/1.1 var(--ch-body); }
.go__app small { font: 600 .75rem/1.2 var(--ch-body); color: var(--ch-muted); }
.go__app--waze { border-color: rgba(51, 204, 255, .55); background: rgba(51, 204, 255, .08); }
.go__app--maps { border-color: rgba(234, 67, 53, .4); background: rgba(234, 67, 53, .05); }
.go__app:hover { border-color: var(--ch-ink); } .go__app:active { transform: scale(.97); }
.go__app:focus-visible, .go__apple:focus-visible, .go__copy:focus-visible, .go__x:focus-visible { outline: 3px solid var(--ch-red); outline-offset: 2px; }
.go__apple { display: flex; align-items: center; justify-content: center; gap: 8px; min-height: 48px; margin-top: 10px; border-radius: 16px; background: rgba(11, 11, 13, .05); color: var(--ch-ink); text-decoration: none; font: 700 .9375rem/1 var(--ch-body); }
.go__apple[hidden] { display: none; }
.go__apple svg, .go__copy svg { width: 18px; height: 18px; flex: none; fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }
.go__copy { display: flex; align-items: center; justify-content: center; gap: 8px; width: 100%; min-height: 48px; margin-top: 10px; border: 1.5px dashed rgba(11, 11, 13, .18); border-radius: 16px; background: none; color: var(--ch-ink); font: 700 .9375rem/1 var(--ch-body); cursor: pointer; }
.go__copy.is-ok { border-style: solid; border-color: #1faa55; color: #13803f; background: rgba(31, 170, 85, .08); }
.go__info { display: grid; gap: 10px; margin: 16px 0 0; padding: 14px 0 0; border-top: 1px solid rgba(11, 11, 13, .08); list-style: none; }
.go__info li { display: flex; align-items: flex-start; gap: 10px; font-size: .875rem; line-height: 1.4; color: var(--ch-muted); }
.go__info svg { width: 20px; height: 20px; flex: none; margin-top: 1px; fill: none; stroke: var(--ch-red); stroke-width: 1.9; stroke-linecap: round; stroke-linejoin: round; }
.go__info b { display: block; color: var(--ch-ink); font-weight: 700; }
html.go-lock, html.go-lock body { overflow: hidden; }
html.go-lock .tabbar { transform: translateY(160%); }
html.go-lock .wa-fab { opacity: 0; pointer-events: none; }
@media (max-width: 359.98px) { .go__t { font-size: 1.5rem; } }
@media (min-width: 700px) {
  .go { align-items: center; padding: 24px; }
  .go__card { max-width: 460px; padding: 30px 28px 26px; border-radius: 28px; transform: translateY(16px) scale(.98); opacity: 0; transition: transform .35s var(--ch-ease), opacity .25s; }
  .go.is-open .go__card { opacity: 1; }
  .go__grab { display: none; }
  .go__apps { grid-template-columns: 1fr 1fr; }
}
@media (prefers-reduced-motion: reduce) { .go__card, .go__bg { transition: none; } }
/* o "Chegar" da barra de baixo e o cartão do menu */
.tabbar__to { color: inherit; }
.menu__go-to { background: #fff; color: var(--ch-ink); box-shadow: inset 0 0 0 1.5px rgba(11, 11, 13, .12); }
.menu__go-to .menu__own-t small { color: var(--ch-muted); }

/* ================= v1.0227 · ACESSO — hóspede, proprietário e gerência numa janela só (usa o cartão do "Como chegar": .go/.go__*) ================= */
.acs .go__d { margin-bottom: 18px; }
.acs__i { display: grid; grid-template-columns: 48px minmax(0, 1fr) 20px; align-items: center; column-gap: 14px; height: 84px; padding: 0 16px 0 14px; border-radius: 20px; border: 1.5px solid rgba(11, 11, 13, .12); background: #fff; color: var(--ch-ink); text-decoration: none; transition: border-color .2s, transform .15s; -webkit-tap-highlight-color: transparent; }
.acs__i:hover { border-color: var(--ch-ink); } .acs__i:active { transform: scale(.98); }
.acs__i:focus-visible { outline: 3px solid var(--ch-red); outline-offset: 2px; }
.acs__i > svg { color: var(--ch-muted); }
.acs__ic { position: relative; display: grid; place-items: center; width: 48px; height: 48px; border-radius: 14px; background: rgba(234, 32, 37, .08); color: var(--ch-red); }
.acs__ic svg { width: 24px; height: 24px; }
.acs__t { display: grid; gap: 3px; min-width: 0; }
.acs__t b { font: 800 1.0625rem/1.15 var(--ch-display); letter-spacing: -.015em; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.acs__t small { display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; overflow: hidden; font: 600 .8125rem/1.3 var(--ch-body); color: var(--ch-muted); }
.acs__i--me { border-color: transparent; background: var(--ch-red-deep); color: #fff; }
.acs__i--me:hover { border-color: transparent; background: var(--ch-red-deep); }
.acs__i--me .acs__ic { background: #fff; }
.acs__i--me .acs__t small, .acs__i--me > svg { color: rgba(255, 255, 255, .88); }
.acs__i--me .top__res-b { right: auto; left: -7px; }
.acs__s { margin: 20px 4px 10px; font: 800 .6875rem/1.2 var(--ch-body); letter-spacing: .12em; text-transform: uppercase; color: var(--ch-muted); }
.acs__l { display: grid; gap: 10px; }
@media (max-width: 374.98px) { /* celular pequeno: o texto ganha a largura do ícone e das margens, sem cortar nada */
  .acs__i { grid-template-columns: 40px minmax(0, 1fr) 18px; column-gap: 11px; padding: 0 12px 0 11px; }
  .acs__ic { width: 40px; height: 40px; border-radius: 12px; } .acs__ic svg { width: 21px; height: 21px; }
  .acs__t b { font-size: 1rem; } .acs__t small { font-size: .78125rem; }
}

/* ================= v1.0228 · botão ENTRAR · Minha área no celular: o texto nunca é espremido nem encosta na borda ================= */
@media (max-width: 559.98px) {
  .top__res { flex: none; padding: 0 14px 0 5px; }
  .top__res-t b { font-size: .8125rem; }
  .top .langdd__chev { display: none; }
  .top .langdd__btn { width: 46px; padding: 0; justify-content: center; }
}
@media (max-width: 389.98px) { .top__in { gap: 5px; } .top__res { padding: 0 12px 0 4px; } }
@media (max-width: 359.98px) { /* celular muito estreito: sem o círculo do ícone, logotipo um pouco menor */
  .top__res { padding: 0 12px; } .top__res-i { display: none; }
  .top .brand__logo { height: 34px; } .top__book { padding: 0 10px; }
}

/* ================= v1.0260 · janela de acesso: PROPRIETÁRIO e GERÊNCIA em 2 BOTÕES GRANDES lado a lado (mesma altura, mesma borda do cartão, sem sombra) ================= */
.acs__duo { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; margin-top: 10px; }
.acs__big { position: relative; display: flex; flex-direction: column; justify-content: space-between; height: 148px; min-width: 0; padding: 16px; border-radius: 20px; border: 1.5px solid rgba(11, 11, 13, .12); background: #fff; color: var(--ch-ink); text-decoration: none; transition: border-color .2s, background .2s, transform .15s; -webkit-tap-highlight-color: transparent; }
.acs__big:hover { border-color: var(--ch-ink); } .acs__big:active { transform: scale(.98); }
.acs__big:focus-visible { outline: 3px solid var(--ch-red); outline-offset: 2px; }
.acs__go { position: absolute; top: 16px; right: 16px; display: grid; place-items: center; width: 32px; height: 32px; border-radius: 50%; background: rgba(11, 11, 13, .06); color: var(--ch-muted); transition: background .2s, color .2s; }
.acs__go svg { width: 18px; height: 18px; }
.acs__big:hover .acs__go { background: var(--ch-red); color: #fff; }
.acs__bt { display: grid; gap: 4px; min-width: 0; }
.acs__bt b { font: 800 1.1875rem/1.1 var(--ch-display); letter-spacing: -.02em; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.acs__bt small { display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; overflow: hidden; height: 2.6em; font: 600 .8125rem/1.3 var(--ch-body); color: var(--ch-muted); }
@media (max-width: 374.98px) { /* celular pequeno: mesmo desenho, um pouco mais justo */
  .acs__duo { gap: 8px; }
  .acs__big { height: 140px; padding: 13px; border-radius: 18px; }
  .acs__go { top: 13px; right: 13px; width: 28px; height: 28px; } .acs__go svg { width: 16px; height: 16px; }
  .acs__bt b { font-size: 1.0625rem; } .acs__bt small { font-size: .75rem; }
}