@charset "utf-8";
/* =====================================================================
   Jandaia Hotel — camada de correcoes sobre o tema "Diamant"
   ---------------------------------------------------------------------
   Carregada DEPOIS de plugins.css e style.css, entao sobrescreve sem
   precisar editar os 700 KB de CSS do tema.

   Cobre: contraste (WCAG AA), foco visivel, alvos de toque, zoom no iOS,
   conteudo inalcancavel no touch, prefers-reduced-motion e o widget de
   reserva.

   Contrastes conferidos com calculo, nao no olho:
     #cfcbb0 sobre #fff .......... 1,64:1  REPROVA  (era o texto do site)
     #6b6544 sobre #fff .......... 5,88:1  passa AA (substituto)
     #6b6544 sobre #f9f9f9 ....... 5,59:1  passa AA
     #cfcbb0 sobre #155377 ....... 5,06:1  passa AA (uso original do tema)
     #1e1e1e sobre #cfcbb0 ....... 10,18:1 passa AAA (texto do CTA)
     #b3261e sobre #fff .......... 6,54:1  passa AA (erro em fundo claro)
     #ffd2cc sobre #155377 ....... 6,05:1  passa AA (erro em fundo escuro)
   ===================================================================== */

:root {
    /* O bege da marca foi desenhado para fundo ESCURO. Em fundo claro
       ele precisa de uma versao com mais tinta — mesmo matiz, mesma
       identidade, contraste legivel. */
    --brand-blue: #155377;
    --brand-gold: #cfcbb0;
    --brand-gold-ink: #6b6544;
    --ink: #1e1e1e;
    --ink-muted: #5e646a;
    --danger-on-light: #b3261e;
    --danger-on-dark: #ffd2cc;
    --focus-ring: #155377;
}

/* =====================================================================
   1. Conteudo visivel sem depender de JavaScript
   ---------------------------------------------------------------------
   style.css:184 punha #main{opacity:0} e so o JS devolvia a visibilidade,
   depois de ~1,6s de timers encadeados. Se jquery ou plugins.js falhasse,
   a pagina ficava permanentemente em branco (azul, na verdade).
   ===================================================================== */
#main { opacity: 1 !important; }

.loader-wrap {
    position: fixed;
    inset: 0;
    z-index: 100;
    /* Rede de seguranca em CSS puro: some sozinho mesmo sem JS. */
    animation: jandaia-loader-out 0s linear 2.5s forwards;
}
@keyframes jandaia-loader-out {
    to { opacity: 0; visibility: hidden; pointer-events: none; }
}

/* =====================================================================
   2. Foco visivel
   ---------------------------------------------------------------------
   plugins.css:3 zera o outline no reset e nada no projeto o substituia:
   grep ":focus" em style.css retornava zero. Navegar por teclado era
   navegar as cegas (WCAG 2.4.7 e 2.4.11).
   ===================================================================== */
:where(a, button, input, textarea, select, summary, [tabindex]):focus-visible {
    outline: 3px solid var(--focus-ring);
    outline-offset: 3px;
    border-radius: 3px;
}
.main-footer :focus-visible,
.hero-section :focus-visible,
.dark-bg :focus-visible,
.content-front :focus-visible,
.fw-search-wrap :focus-visible,
.jbook :focus-visible {
    outline-color: #fff;
}
.subcribe-form input.enteremail:focus-visible,
.subcribe-form .subscribe-button:focus-visible {
    outline: 3px solid #fff;
    outline-offset: 2px;
}

.skip-link {
    position: absolute;
    left: -9999px;
    top: 0;
    z-index: 10000;
    padding: 14px 22px;
    background: var(--brand-blue);
    color: #fff;
    font-family: var(--secondary-font);
    font-weight: 600;
    font-size: 15px;
    text-decoration: none;
}
.skip-link:focus {
    left: 0;
    outline: 3px solid #fff;
    outline-offset: -6px;
}

.visually-hidden {
    position: absolute;
    width: 1px; height: 1px;
    margin: -1px; padding: 0;
    overflow: hidden;
    clip: rect(0 0 0 0);
    clip-path: inset(50%);
    white-space: nowrap;
    border: 0;
}

/* =====================================================================
   3. Contraste
   ===================================================================== */

/* =====================================================================
   3b. Hierarquia de titulos
   ---------------------------------------------------------------------
   O tema usava <h4> como "olho" acima do <h2>, e o site nao tinha nenhum
   <h1>. Agora o olho e' um <p class="section-kicker"> — mesma aparencia,
   sem ocupar um nivel de heading — e cada pagina tem um <h1>.
   ===================================================================== */
.section-title .section-kicker,
.section-title h4 {
    display: block;
    margin: 0;
    padding-bottom: 10px;
    position: relative;
    font-family: var(--secondary-font);
    font-size: 18px;
    font-style: italic;
    font-weight: 500;
    text-align: inherit;
    /* 5,88:1 sobre branco. O bege original dava 1,64:1 — texto invisivel. */
    color: var(--brand-gold-ink) !important;
}

/* O h1 herda exatamente o visual que o h2 tinha no tema, para a mudanca
   ser so semantica: nada muda na tela. */
.section-title h1 {
    font-size: 3.5em;
    color: #323246;
    font-family: var(--main-font);
    font-weight: 400;
}

/* Sobre fundo escuro (heros), o olho e os titulos voltam ao claro. */
.hero-section .section-title .section-kicker,
.dark-bg .section-title .section-kicker { color: var(--brand-gold) !important; }
.hero-section .section-title h1,
.hero-section .section-title h2,
.dark-bg .section-title h1 { color: #fff; }

/* Nome de comodidade nos flip cards: era <h2>, competindo com o titulo
   da secao. Agora <h3>, com o mesmo tamanho de antes. */
.content-front .inner h3,
.aminites-card-item h3 {
    font-family: var(--main-font);
    font-size: 2em;
    font-weight: 400;
    color: inherit;
    padding-bottom: 6px;
}
.card-subtitle {
    font-family: var(--secondary-font);
    font-size: 15px;
    font-weight: 400;
    opacity: .85;
    margin: 0;
}

.has-drop-cap:first-letter { color: var(--brand-gold-ink); }

.breadcrumbs-wrap span,
.breadcrumbs-wrap a { color: var(--ink-muted) !important; }

/* Contato: os links do endereco, telefone e e-mail estavam em 1,56:1
   sobre #f9f9f9 e sem sublinhado — invisiveis e nao identificaveis. */
.contacts-card-item a {
    color: var(--brand-blue) !important;
    text-decoration: underline;
    text-underline-offset: 3px;
}
.contacts-card-item a:hover { color: var(--ink); }

/* CTA principal: o tema nao declarava color no estado normal (herdava o
   default do navegador) e no hover punha bege sobre branco = 1,64:1. */
.searchform-submit,
.jbook__submit {
    background: var(--brand-gold) !important;
    color: var(--ink) !important;
    font-weight: 600;
}
.searchform-submit:hover,
.jbook__submit:hover {
    background: #e3dfc8 !important;
    color: var(--ink) !important;
}
.searchform-submit:active,
.jbook__submit:active { background: #bdb99e !important; }

/* Bordas de campo: 1px rgba(255,255,255,.1) sobre o azul dava ~1,3:1,
   abaixo do minimo de 3:1 para controle de formulario (WCAG 1.4.11). */
.subcribe-form input.enteremail { border-color: rgba(255,255,255,.45) !important; }

/* =====================================================================
   4. Movimento reduzido
   ---------------------------------------------------------------------
   O site tinha loader girando em loop, autoplay do hero a cada 2,5s,
   parallax e flip 3D com overshoot elastico — e nenhuma regra de
   prefers-reduced-motion fora do proprio Font Awesome.
   ===================================================================== */
@media (prefers-reduced-motion: reduce) {
    *, *::before, *::after {
        animation-duration: .01ms !important;
        animation-iteration-count: 1 !important;
        transition-duration: .01ms !important;
        scroll-behavior: auto !important;
    }
    .loader-wrap { display: none !important; }
    .content-inner:hover .content-front,
    .content-inner:hover .content-back { transform: none !important; }
}

/* =====================================================================
   5. Conteudo que so existia no :hover
   ---------------------------------------------------------------------
   Os 6 cards de comodidades da home guardam a descricao no verso, e o
   verso so aparecia com mouse. No celular — a maioria do trafego — metade
   da secao simplesmente nao existia.
   ===================================================================== */
.content-inner:focus-within .content-front { transform: rotateY(-180deg); }
.content-inner:focus-within .content-back  { transform: rotateY(0deg); }

@media (hover: none) {
    /* Sem mouse: mostra frente e verso empilhados, sem 3D. */
    .content-inner { display: flex; flex-direction: column; }
    .content-inner .content-front,
    .content-inner .content-back {
        transform: none !important;
        position: static !important;
        backface-visibility: visible !important;
    }
    .content-front { cursor: default; }

    /* Lightbox das galerias: o gatilho ficava em right:-50px e opacity:0,
       revelado so no hover — nenhuma foto de quarto ampliava no toque. */
    .box-media-zoom {
        right: 12px !important;
        bottom: 12px !important;
        opacity: 1 !important;
        width: 44px; height: 44px;
        line-height: 44px;
        display: flex; align-items: center; justify-content: center;
    }
}

/* =====================================================================
   6. Alvos de toque e zoom no iOS
   ===================================================================== */

/* O Safari amplia a pagina ao focar campo com fonte < 16px, e o site
   estava com 12-13px. Como o zoom tambem estava bloqueado, o usuario
   ficava preso numa pagina ampliada sem conseguir desfazer. */
input, select, textarea,
.custom-form input[type="text"],
.custom-form textarea,
.quantity input.qty,
.enteremail {
    font-size: max(16px, 1rem) !important;
}

@media (max-width: 1063px) {
    .nav-button-wrap,
    .serach-header-btn,
    .to-top,
    .slider-button,
    .fw-carousel-button-prev,
    .fw-carousel-button-next {
        min-width: 44px;
        min-height: 44px;
    }
    /* Links sociais eram inline: a area real de toque era a caixa da
       fonte (~16px), nao o line-height. */
    .header-social li a {
        display: inline-flex;
        align-items: center;
        justify-content: center;
        min-width: 44px;
        min-height: 44px;
    }
    .menusb a { padding: 12px 5px !important; }

    /* -----------------------------------------------------------------
       Cabecalho no celular: logo | Reservar | menu
       -----------------------------------------------------------------
       O tema posicionava os dois botoes com float mais deslocamentos
       relativos herdados (.nav-button-wrap tinha left:24px residual), e o
       resultado era o hamburger caindo por cima do botao Reservar — 44px
       de sobreposicao a 375px, ou seja, o hamburger inteiro.

       Flex resolve de forma previsivel. Da para usar sem medo porque o
       painel do menu (.main-menu) e' position:absolute no mobile, entao
       nao participa do fluxo do flex. */
    .nav-holder-wrap {
        display: flex;
        align-items: center;
        gap: 10px;
    }
    .nav-holder-wrap > .logo-holder {
        margin-right: auto;   /* empurra os dois botoes para a direita */
        flex: 0 1 auto;
    }
    .nav-holder-wrap > .logo-holder img { max-width: 150px; height: auto; }

    .serach-header-btn_wrap,
    .nav-button-wrap {
        float: none !important;
        position: static !important;
        left: auto !important;
        right: auto !important;
        margin: 0 !important;
        flex: 0 0 auto;
    }

    /* O CTA de reserva virava uma lupa cinza indistinguivel do hamburger.
       Volta a ser botao com rotulo.

       inline-flex + nowrap sao essenciais: o tema deixava o link como
       display:block com line-height:60px, entao icone e texto eram tratados
       como duas linhas — a palavra "RESERVAR" quebrava para baixo e, com
       overflow:visible, ia parar em cima da imagem do hero. */
    .serach-header-btn {
        display: inline-flex !important;
        align-items: center;
        justify-content: center;
        gap: 8px;
        width: auto !important;
        line-height: 1 !important;
        top: 0 !important;
        padding: 0 14px !important;
        white-space: nowrap;
        background: var(--brand-gold) !important;
        border-radius: 4px;
    }
    .serach-header-btn span {
        display: inline !important;
        height: auto !important;
        line-height: 1 !important;
        margin: 0 !important;
        white-space: nowrap;
        color: var(--ink) !important;
        font-size: 13px;
        font-weight: 600;
    }
    .serach-header-btn i { color: var(--ink) !important; }

    /* As barras do hamburger eram position:absolute com left:180px fixo:
       ficavam desenhadas ao lado do logo enquanto a area clicavel estava
       na outra ponta do cabecalho. */
    .nav-button-wrap {
        width: 44px;
        height: 44px;
        display: flex !important;
        align-items: center;
        justify-content: center;
    }
    .nav-button {
        position: relative !important;
        top: auto !important;
        left: auto !important;
        margin: 0 !important;
        width: 24px;
        height: 18px;
        background: transparent !important;
    }
    /* Sem isto as barras ficam brancas sobre o cabecalho branco. */
    .nav-button span { background: var(--brand-blue) !important; }
}

/* O botao flutuante do WhatsApp (88x88, z-index 9000) cobria exatamente
   o "Voltar ao topo" no canto inferior direito. */
.footer-bottom {
    padding-bottom: calc(90px + env(safe-area-inset-bottom, 0px));
    height: auto !important;
    overflow: visible !important;
}
@media (max-width: 575px) {
    .footer-bottom .copyright,
    .footer-bottom .to-top {
        float: none !important;
        display: block;
        text-align: center;
        margin: 8px 0;
    }
}

/* =====================================================================
   7. Widget de reserva
   ===================================================================== */
/* ---------------------------------------------------------------------
   Cliques bloqueados nas paginas de quarto
   ---------------------------------------------------------------------
   O tema desenha uma moldura decorativa em .fw-search-wrap::before:
   position:absolute, inset:15px, z-index:1 — um retangulo transparente de
   ~833x391px cobrindo TODA a area do widget. Como os elementos do widget
   sao position:static (z-index auto), eles ficam abaixo dele na ordem de
   pintura, e o pseudo-elemento engolia todo clique: nao so o botao
   "Ver disponibilidade", mas tambem as datas e os contadores.

   Na home isso nao acontecia porque la o container e' .fw-search-wrap_hero,
   que nao tem esse ::before — por isso o problema so aparecia nas paginas
   de categoria.

   Decoracao nao deve capturar ponteiro; o widget sobe para um nivel acima. */
.fw-search-wrap::before,
.fw-search-wrap::after,
.fw-search-wrap_hero::before,
.fw-search-wrap_hero::after {
    pointer-events: none;
}

.jbook {
    position: relative;
    z-index: 3;
    background: var(--brand-blue);
    border-radius: 10px;
    padding: 22px;
    text-align: left;
    font-family: var(--secondary-font);
}

/* O numero de colunas segue a largura do CONTAINER, nao a da janela.
   Antes eu usava media query de viewport: numa tela grande o widget montava
   5 colunas mesmo quando estava dentro da coluna estreita das paginas de
   quarto (col-lg-4), e os campos estouravam para fora do painel azul.

   auto-fit + minmax(min(100%,170px),1fr) resolve sem container query:
   no hero largo da 5 colunas, na barra lateral da 1.
   O min() e o min-width:0 sao o que impede o item de crescer alem da caixa
   (por padrao um item de grid nao encolhe abaixo do proprio min-content). */
.jbook__fields {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(min(100%, 170px), 1fr));
    gap: 14px;
    align-items: end;
}
.jbook__fields > * { min-width: 0; }

.jbook__label {
    display: block;
    color: #fff;
    font-size: 13px;
    font-weight: 500;
    letter-spacing: .04em;
    text-transform: uppercase;
    margin-bottom: 6px;
}
.jbook__label--inline { text-transform: none; letter-spacing: 0; }
.jbook__optional { opacity: .65; font-weight: 400; text-transform: none; }

.jbook__input {
    width: 100%;
    height: 48px;
    padding: 0 12px;
    border: 1px solid rgba(255,255,255,.45);
    border-radius: 4px;
    background: #fff;
    color: var(--ink);
    font-family: var(--secondary-font);
}

.jbook__stepper {
    display: flex;
    align-items: stretch;
    background: #fff;
    border-radius: 4px;
    overflow: hidden;
    height: 48px;
}
.jbook__step {
    flex: 0 0 44px;
    min-width: 44px;
    border: 0;
    background: #f0efe8;
    color: var(--ink);
    font-size: 20px;
    line-height: 1;
    cursor: pointer;
    transition: background .2s ease;
}
.jbook__step:hover { background: var(--brand-gold); }
.jbook__num {
    flex: 1 1 auto;
    width: 100%;
    min-width: 0;
    border: 0;
    text-align: center;
    color: var(--ink);
    font-weight: 600;
    /* Esconde as setinhas nativas: os steppers ja fazem esse papel. */
    -moz-appearance: textfield;
}
.jbook__num::-webkit-outer-spin-button,
.jbook__num::-webkit-inner-spin-button { -webkit-appearance: none; margin: 0; }

.jbook__submit {
    display: flex;
    align-items: center;
    justify-content: center;
    height: 48px;
    padding: 0 18px;
    border-radius: 4px;
    text-decoration: none;
    text-align: center;
    transition: background .2s ease;
}

.jbook__ages { margin-top: 16px; }
.jbook__ages-title {
    display: block;
    color: #fff;
    font-size: 13px;
    font-weight: 500;
    margin-bottom: 8px;
}
.jbook__ages-list { display: flex; flex-wrap: wrap; gap: 10px; }
.jbook__age { display: flex; align-items: center; gap: 8px; }
.jbook__age-label { color: rgba(255,255,255,.85); font-size: 13px; }
.jbook__age-input {
    width: 72px;
    height: 44px;
    text-align: center;
    border: 1px solid rgba(255,255,255,.45);
    border-radius: 4px;
}
.jbook__hint {
    color: rgba(255,255,255,.75);
    font-size: 12px;
    line-height: 18px;
    padding-top: 8px;
    margin: 0;
}

/* Cupom recolhido */
.jbook__coupon { margin-top: 14px; }
.jbook__coupon > summary {
    list-style: none;
    cursor: pointer;
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 6px 0;
    color: rgba(255,255,255,.9);
    font-size: 13px;
    text-decoration: underline;
    text-underline-offset: 3px;
}
.jbook__coupon > summary::-webkit-details-marker { display: none; }
/* plugins.css traz o normalize antigo do HTML5 Boilerplate
   (article,aside,details,...{display:block}), que atropela o mecanismo
   nativo de esconder o conteudo do <details> fechado. Sem esta regra o
   campo de cupom continuava aparecendo com o painel recolhido. */
.jbook__coupon:not([open]) > .jbook__coupon-body { display: none; }
.jbook__coupon > summary:hover { color: var(--brand-gold); }
.jbook__coupon > summary i { color: var(--brand-gold); }
.jbook__coupon[open] > summary { margin-bottom: 8px; }
.jbook__coupon-body { max-width: 340px; }
.jbook__input--code { height: 44px; }

.jbook__error {
    margin: 12px 0 0;
    padding: 8px 12px;
    border-left: 3px solid #ff6b5b;
    border-radius: 4px;
    background: rgba(180,30,20,.35);
    color: var(--danger-on-dark);
    font-size: 14px;
}

.jbook__trust {
    margin: 16px 0 0;
    padding: 0;
    color: rgba(255,255,255,.85);
    font-size: 13px;
    line-height: 20px;
}
.jbook__trust i { color: var(--brand-gold); margin-right: 6px; }

/* Validadores do WebForms: vermelho puro sobre o azul dava 2,07:1 —
   o hospede clicava em reservar e nao via o motivo da recusa. */
.form-error,
.custom-form .small {
    display: block;
    margin-top: 6px;
    padding: 6px 10px;
    border-left: 3px solid #ff6b5b;
    border-radius: 4px;
    background: rgba(180,30,20,.35);
    color: var(--danger-on-dark) !important;
    font-size: 13px;
}

/* =====================================================================
   8. Barra fixa de reserva no celular
   ---------------------------------------------------------------------
   Abaixo de 1064px o formulario do hero fica inteiramente sob a dobra.
   Esta barra garante um caminho para reservar e para ligar em qualquer
   ponto da pagina.
   ===================================================================== */
.jbook-bar {
    position: fixed;
    left: 0; right: 0; bottom: 0;
    z-index: 8000;
    display: none;
    gap: 8px;
    padding: 10px 12px calc(10px + env(safe-area-inset-bottom, 0px));
    background: var(--brand-blue);
    box-shadow: 0 -6px 20px rgba(0,0,0,.25);
}
.jbook-bar a {
    flex: 1 1 auto;
    min-height: 46px;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    border-radius: 4px;
    font-family: var(--secondary-font);
    font-weight: 600;
    font-size: 15px;
    text-decoration: none;
}
.jbook-bar__book { background: var(--brand-gold); color: var(--ink); }
.jbook-bar__call {
    flex: 0 0 46px;
    background: transparent;
    border: 1px solid rgba(255,255,255,.5);
    color: #fff;
}
@media (max-width: 1063px) {
    .jbook-bar { display: flex; }
    /* O FAB do WhatsApp precisa subir para nao ficar sobre a barra. */
    .joinchat { bottom: 78px !important; }
}

/* =====================================================================
   8b. Rodape
   ---------------------------------------------------------------------
   Problemas corrigidos aqui:

   a) A faixa de baixo usava #7b7a7a, um cinza que nao existe na paleta do
      hotel. Branco sobre ele da 4,28:1 e o bege da 2,61:1 — os dois
      reprovam em WCAG AA. Trocado por #0e3b55, que e' o proprio azul da
      marca mais escuro: 11,83:1 no branco e 7,22:1 no bege.

   b) O rodape era position:fixed e so nao cobria o conteudo porque um
      .height-emulator recebia altura via JavaScript. Com o JS fora do ar,
      ele engolia o fim da pagina. Agora e' estatico.

   c) A sombra do conteudo era rgba(0,0,0,.8) espalhada por 74px — 16x mais
      forte que o resto do sistema (que usa .05) e deixava uma faixa preta
      pesada na borda.
   ===================================================================== */

.main-footer {
    position: relative !important;
    background: #155377;
}
.height-emulator { display: none !important; }

.content {
    box-shadow: 0 -6px 28px rgba(12, 48, 73, .10) !important;
}

.footer-bottom {
    background: #0e3b55 !important;
    height: auto !important;
    line-height: 1.5 !important;
    padding-top: 20px;
    border-top: 1px solid rgba(255, 255, 255, .12);
}
.footer-bottom .container {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
}
.footer-bottom .footer-logo { float: none !important; }
.footer-bottom .footer-logo img { display: block; }

.copyright {
    color: rgba(255, 255, 255, .92) !important;
    font-size: 13px !important;
    text-transform: none !important;
    letter-spacing: .01em;
}

.to-top {
    float: none !important;
    display: inline-flex;
    align-items: center;
    gap: 8px;
    min-height: 44px;
    padding: 0 4px;
    color: var(--brand-gold) !important;
    font-size: 13px !important;
    letter-spacing: .06em;
    transition: color .2s ease;
}
.to-top:hover { color: #fff !important; }
.to-top i { margin-left: 0 !important; }

/* Titulos das colunas: 2.3em sobre base 12px saia gigante e desalinhado
   do peso do resto da pagina. */
.footer-widget-title {
    color: var(--brand-gold) !important;
    font-size: 20px !important;
    letter-spacing: .02em;
    padding-bottom: 18px !important;
}

.footer-widget-content p,
.footer-contacts li,
.footer-list li a {
    font-size: 14px;
    line-height: 24px;
}

/* Links do rodape: sem sublinhado global do tema, so o hover mudava a cor
   levemente. Agora tem alvo claro e estado de hover legivel. */
.footer-list li a,
.footer-contacts li a {
    color: rgba(255, 255, 255, .88) !important;
    text-decoration: none;
    transition: color .2s ease;
}
.footer-list li a:hover,
.footer-contacts li a:hover {
    color: var(--brand-gold) !important;
    text-decoration: underline;
    text-underline-offset: 3px;
}
.footer-contacts li span { color: var(--brand-gold) !important; }

/* O tema tem body{text-align:center}, entao tudo que nao redefine alinhamento
   sai centralizado — era o que deixava "Sobre nos" e "Fale conosco" soltos no
   meio da coluna, desalinhados do texto acima deles. */
.footer-widget,
.footer-widget-content,
.footer-widget-content p,
.footer-contacts,
.footer-list { text-align: left; }

.footer-widget-content-link {
    display: inline-flex;
    align-items: center;
    min-height: 40px;
    margin-top: 6px;
    color: var(--brand-gold) !important;
    text-decoration: underline;
    text-underline-offset: 4px;
}
.footer-widget-content-link:hover { color: #fff !important; }

/* Marca d'agua "Jandaia Hotel" no fundo do rodape: ficava no mesmo plano do
   texto das colunas e atravessava as palavras. Agora fica atras de tudo e
   mais discreta; some de vez no celular, onde so atrapalhava. */
.footer-title-dec {
    z-index: 0 !important;
    color: rgba(255, 255, 255, .035) !important;
    pointer-events: none;
    user-select: none;
    white-space: nowrap;
}
.footer-widget-wrap { position: relative; z-index: 2; }

@media (max-width: 991px) {
    .footer-title-dec { display: none; }
}

/* O rodape ocupava altura demais para a quantidade de conteudo. */
.footer-inner { padding: 60px 0 30px !important; }
.footer-separator-wrap { padding-bottom: 30px; }
.footer-widget { margin-bottom: 26px; }

/* Logo do rodape em branco: precisa de um respiro para nao colar na faixa. */
.footer-bottom .footer-logo img { max-width: 170px; height: auto; }

/* =====================================================================
   9. Ajustes finais de legibilidade
   ===================================================================== */
.jbook a, .jbook button, .content-front, .to-top, .nav-button { cursor: pointer; }

/* Imagens nunca estouram o container (varias galerias nao tinham respimg). */
.content img, .jbook img { max-width: 100%; height: auto; }

/* Tabelas e blocos largos rolam dentro de si, nao na pagina inteira. */
.table-scroll { overflow-x: auto; -webkit-overflow-scrolling: touch; }