@charset "UTF-8";
/* ================================================================
   custom.css — VELIT MOTÉIS (skin por-cliente)
   Aplicado APÓS o style.css do Canvas 7 e o or-hospitalidade.css.
   ----------------------------------------------------------------
   O tema EDITORIAL (dark/light alternado por seção) vive no
   or-hospitalidade.css (core). Aqui fica só a PELE do cliente:
   fontes, header/footer escuros do Canvas, botões e acabamento.
   Cores de marca vêm de admin > Empresa > Cores (config_cores):
     var(--marca-primaria) → dourado #C9A84C
   ================================================================ */

@import url('https://fonts.googleapis.com/css2?family=Cormorant+Garamond:ital,wght@0,300;0,400;0,500;0,600;1,400&family=Inter:wght@300;400;500;600&family=Montserrat:wght@300;400;500;600&display=swap');

:root {
    /* Acento Canvas = dourado da marca */
    --cnvs-themecolor: var(--marca-primaria, #C9A84C);

    /* Fontes Velit (consumidas pelo or-hospitalidade.css via --or-font-*) */
    --cnvs-font-family: 'Inter', system-ui, -apple-system, sans-serif;            /* corpo */
    --or-font-heading:  'Cormorant Garamond', Georgia, 'Times New Roman', serif;  /* títulos */
    --or-font-label:    'Montserrat', system-ui, -apple-system, sans-serif;       /* labels / CTA */

    /* Header do Canvas sempre escuro (o corpo é claro; a home é escura via or-hospitalidade) */
    --cnvs-header-bg:        #0A0A0A;
    --cnvs-header-sticky-bg: #0A0A0A;
}

/* ================= Base ================= */
body { font-family: var(--cnvs-font-family); }
p, li, td, th, input, textarea, select { font-family: var(--cnvs-font-family); }

h1, h2, h3, h4, h5, h6,
.display-1, .display-2, .display-3, .display-4 {
    font-family: var(--or-font-heading);
    color: inherit;
    font-weight: 500;
    letter-spacing: .005em;
}
h1, .display-1, .display-2 { font-weight: 400; }

a { color: var(--marca-primaria, #C9A84C); transition: color .15s ease; }
a:hover { color: var(--marca-secundaria, #A88B3C); }

/* ================= Header / Nav (Canvas) — escuro, links Montserrat ================= */
#header, #header.sticky-header, #header.sticky-header:not(.dark) {
    background: #0A0A0A !important;
    border-bottom: 1px solid #2A2A2A;
}
/* Ao rolar, o Canvas pinta o fundo no #header-wrap (e pode injetar .not-dark que o clareia).
   Força o #header-wrap escuro no estado sticky — redefine as variáveis no PRÓPRIO elemento. */
#header.sticky-header #header-wrap,
#header #header-wrap.not-dark {
    background-color: #0A0A0A !important;
    --cnvs-header-bg: #0A0A0A;
    --cnvs-header-sticky-bg: #0A0A0A;
}
#header .primary-menu > ul > li > .menu-link > div {
    font-family: var(--or-font-label);
    text-transform: uppercase;
    letter-spacing: .16em;
    font-size: .82rem;
    font-weight: 400;
    color: #FFFFFF;
    white-space: nowrap;
}
#header .primary-menu > ul > li > .menu-link > div:hover,
#header .primary-menu > ul > li.current-menu-item > .menu-link > div {
    color: var(--marca-primaria, #C9A84C);
}
/* Dropdown (caso haja submenu) sobre header escuro */
#header .dropdown-nav { background: #111111; border: 1px solid #2A2A2A; }
#header .dropdown-nav-link { color: #FFFFFF; }
#header .dropdown-nav-link:hover { color: var(--marca-primaria, #C9A84C); }
/* Hambúrguer mobile claro */
#header .cnvs-hamburger-inner,
#header .cnvs-hamburger-inner::before,
#header .cnvs-hamburger-inner::after { background-color: #FFFFFF; }

/* ================= Botões ================= */
.button {
    font-family: var(--or-font-label);
    text-transform: uppercase;
    letter-spacing: .14em;
    font-weight: 500;
    border-radius: 2px;
    transition: background-color .2s ease, border-color .2s ease, color .2s ease, transform .1s ease;
}
.button:active { transform: scale(.98); }
/* Primário = dourado com texto escuro */
.button:not(.button-border):not([class*="bg-"]):not(.button-light):not(.button-dark):not(.or-btn-wa) {
    background-color: var(--marca-primaria, #C9A84C) !important;
    border-color:     var(--marca-primaria, #C9A84C) !important;
    color: var(--texto-invertido, #0A0A0A) !important;
}
.button:not(.button-border):not([class*="bg-"]):not(.button-light):not(.button-dark):not(.or-btn-wa):hover {
    background-color: var(--marca-secundaria, #A88B3C) !important;
    border-color:     var(--marca-secundaria, #A88B3C) !important;
    color: var(--texto-invertido, #0A0A0A) !important;
}

/* CTA de WhatsApp (CTA banner, lightbox, contato) — verde WhatsApp */
.or-btn-wa.button,
a.or-btn-wa {
    background-color: #25D366 !important;
    border-color: #25D366 !important;
    color: #FFFFFF !important;
    display: inline-flex; align-items: center; gap: .5rem;
}
.or-btn-wa.button:hover,
a.or-btn-wa:hover {
    background-color: #1ebe57 !important;
    border-color: #1ebe57 !important;
    color: #FFFFFF !important;
}

/* ================= Galeria da suíte no lightbox (Magnific do Canvas) ================= */
.mfp-bg { background: #0A0A0A; opacity: .96; }
.mfp-container { padding: 0 12px; }

/* ================= Go-to-top na cor da marca ================= */
/* right:22px alinha o botão ao mesmo eixo do WhatsApp e do cookies (dock coeso à direita) */
#gotoTop { background-color: var(--marca-primaria, #C9A84C); color: #0A0A0A; right: 22px; }

/* ================= Dock de botões flutuantes — canto inferior direito ================= */
/* Botão de cookies (LGPD) empilhado ACIMA do WhatsApp, alinhado à mesma borda direita, com
   respiro consistente. WhatsApp: right:22px, bottom:104px, altura 52px → topo em 156px; o
   cookies fica 16px acima disso. (era canto esquerdo, bottom:76px)
   NB: o seletor `body #...` (especificidade 0,1,1) é obrigatório — o <style> do cookie_banner.php
   é injetado no rodapé (depois deste arquivo), então um `#or-lgpd-reabrir` simples perderia por
   ordem e o `left:20px` original voltaria a valer (botão esticava de ponta a ponta). O `left:auto`
   com maior especificidade encolhe o botão ao conteúdo, ancorado à direita. */
body #or-lgpd-reabrir { left: auto; right: 22px; bottom: 172px; width: auto; max-width: max-content; }