/* ===========================================
   Refúgios do Centro — Folha de estilos partilhada
   Usada por todas as páginas do site.
   =========================================== */

:root{
  --castanho-escuro:#4A2C1A; --castanho-medio:#6B4630; --castanho-suave:#8a6a52;
  --creme:#F5EFE5; --creme-profundo:#EDE3D2; --branco:#FFFFFF; --verde-natureza:#5C783B;
  --serif:'Fraunces','Georgia',serif; --sans:'Jost','Helvetica Neue',Arial,sans-serif; --label-font:'El Messiri', var(--sans);
  --max-w:1240px; --transicao:420ms cubic-bezier(.22,.61,.36,1);
  --espaco-xl: clamp(4rem, 8vw, 9rem);
  --espaco-lg: clamp(2.5rem, 5vw, 5rem);
  --espaco-md: clamp(1.5rem, 3vw, 2.5rem);
}
*{ box-sizing:border-box; }
html{ scroll-behavior:smooth; }
body{ margin:0; font-family:var(--sans); color:var(--castanho-escuro); background:var(--creme); line-height:1.6; -webkit-font-smoothing:antialiased; }
h1,h2,h3,h4{ font-family:var(--serif); font-weight:500; margin:0; }
a{ color:inherit; text-decoration:none; }
img{ max-width:100%; display:block; }
.container{ max-width:var(--max-w); margin:0 auto; padding:0 clamp(1.5rem,5vw,3.5rem); }
section{ padding:clamp(2.5rem,5vw,4.5rem) 0; }
.eyebrow{ font-family:var(--label-font); font-weight:600; letter-spacing:.16em; text-transform:uppercase; font-size:.72rem; color:var(--castanho-medio); }

@media (prefers-reduced-motion: reduce){
  *{ animation:none !important; transition:none !important; scroll-behavior:auto !important; }
}
a:focus-visible, button:focus-visible{ outline:2px solid var(--castanho-medio); outline-offset:3px; }

.skip-link{
  position:absolute; top:-3rem; left:.6rem; z-index:1000;
  background:var(--castanho-escuro); color:var(--creme);
  padding:.7rem 1.2rem; font-family:var(--sans); font-size:.85rem; font-weight:500;
  transition:top .2s ease;
}
.skip-link:focus{ top:.6rem; }

/* ===== CABEÇALHO — versão sólida (maioria das páginas) ===== */
header{ position:fixed; top:0; left:0; right:0; z-index:100; background:var(--creme); box-shadow:0 1px 0 rgba(74,44,26,.08); padding:.9rem 0; transition:background var(--transicao), padding var(--transicao); }
.header-inner{ display:grid; grid-template-columns:auto 1fr auto; align-items:center; gap:1.5rem; }
.marca{ font-family:var(--serif); font-size:1.2rem; }
nav.menu-principal{ display:flex; justify-content:center; gap:2rem; font-size:.9rem; }
.header-acoes{ display:flex; align-items:center; gap:1.1rem; }
.lang-switcher{ position:relative; display:flex; align-items:center; padding-left:.9rem; border-left:1px solid rgba(74,44,26,.2); }
.lang-toggle{ display:flex; align-items:center; justify-content:center; width:1.9rem; height:1.9rem; padding:0; background:none; border:none; cursor:pointer; color:rgba(74,44,26,.7); }
.lang-toggle svg{ width:19px; height:19px; }
.lang-toggle:hover{ color:var(--castanho-escuro); }
.lang-menu{
  position:absolute; top:calc(100% + .7rem); right:0; z-index:110;
  display:flex; flex-direction:column; min-width:84px;
  background:var(--branco); border:1px solid rgba(74,44,26,.12); box-shadow:0 14px 30px -16px rgba(74,44,26,.4); padding:.4rem 0;
  opacity:0; visibility:hidden; transform:translateY(-6px);
  transition:opacity var(--transicao), transform var(--transicao), visibility 0s var(--transicao);
}
.lang-switcher.aberto .lang-menu{ opacity:1; visibility:visible; transform:translateY(0); transition:opacity var(--transicao), transform var(--transicao), visibility 0s; }
.lang-menu .lang-link{ padding:.5rem 1.1rem; }
.lang-menu .lang-link:hover{ background:var(--creme); }
.lang-link{ font-family:var(--label-font); font-size:.72rem; font-weight:600; color:rgba(74,44,26,.55); }
.lang-link.ativo{ color:var(--castanho-escuro); }
.btn{ font-family:var(--sans); font-size:.85rem; font-weight:500; padding:.72rem 1.5rem; border-radius:2px; display:inline-block; border:1px solid var(--castanho-escuro); cursor:pointer; }
.btn-primario{ background:var(--castanho-escuro); color:var(--creme); }
.btn-contorno{ background:transparent; }
.menu-toggle{ display:none; background:none; border:none; color:var(--castanho-escuro); font-size:1.6rem; cursor:pointer; }
.menu-toggle .icon-fechar{ display:none; }
.menu-toggle.aberto .icon-abrir{ display:none; }
.menu-toggle.aberto .icon-fechar{ display:inline; }

/* ===== CABEÇALHO — versão transparente-sobre-foto (Início, Casa Pregueira) ===== */
header.header-hero{ background:linear-gradient(to bottom, rgba(30,17,10,.5), transparent); box-shadow:none; padding:1.1rem 0; }
header.header-hero .marca,
header.header-hero nav.menu-principal,
header.header-hero .lang-toggle{ color:var(--branco); }
header.header-hero .lang-switcher{ border-left-color:rgba(245,239,229,.3); }
header.header-hero .menu-toggle{ color:var(--branco); }
header.header-hero.scrolled{ background:var(--creme); box-shadow:0 1px 0 rgba(74,44,26,.08); padding:.7rem 0; }
header.header-hero.scrolled .marca,
header.header-hero.scrolled nav.menu-principal,
header.header-hero.scrolled .lang-toggle,
header.header-hero.scrolled .menu-toggle{ color:var(--castanho-escuro); }
header.header-hero.scrolled .lang-switcher{ border-left-color:rgba(74,44,26,.2); }

/* ===== MENU MOBILE (ecrã inteiro) ===== */
.menu-mobile-overlay{
  position:fixed; inset:0; height:100dvh; background:var(--creme); z-index:105;
  display:flex; flex-direction:column; justify-content:safe center;
  overflow-y:auto; -webkit-overflow-scrolling:touch;
  padding:calc(5rem + env(safe-area-inset-top, 0px)) clamp(1.5rem, 8vw, 4rem) calc(2rem + env(safe-area-inset-bottom, 0px));
  transform:translateY(-100%); opacity:0; visibility:hidden;
  transition:transform var(--transicao), opacity var(--transicao), visibility 0s var(--transicao);
}
.menu-mobile-overlay.aberto{ transform:translateY(0); opacity:1; visibility:visible; transition:transform var(--transicao), opacity var(--transicao), visibility 0s; }
.menu-mobile-overlay nav{ display:flex; flex-direction:column; gap:1.3rem; }
.menu-mobile-overlay nav a{ font-family:var(--serif); font-size:1.9rem; font-weight:400; color:var(--castanho-escuro); border-bottom:1px solid rgba(74,44,26,0.12); padding-bottom:1rem; }
.menu-mobile-overlay .lang-switcher{ margin:2rem 0 0; padding:0; border-left:none; gap:1.2rem; }
.menu-mobile-overlay .lang-link{ color:var(--castanho-medio); font-size:0.8rem; }
.menu-mobile-overlay .lang-link.ativo{ color:var(--castanho-escuro); }
.menu-mobile-overlay .btn{ margin-top:2rem; align-self:flex-start; }

/* ===== BREADCRUMB ===== */
.breadcrumb{ font-size:.8rem; color:var(--castanho-medio); margin-bottom:.9rem; }
.breadcrumb a{ color:var(--castanho-medio); text-decoration:underline; }
.breadcrumb span{ margin:0 .4rem; opacity:.5; }
header.header-hero .breadcrumb{ color:rgba(245,239,229,.75); position:relative; z-index:2; }
header.header-hero .breadcrumb a{ color:rgba(245,239,229,.9); }

/* ===== MOTIVO VISUAL — camadas de pedra ===== */
.divisor-pedra{ display:flex; align-items:center; gap:6px; width:100%; max-width:220px; margin:var(--espaco-md) auto; }
.divisor-pedra span{ display:block; height:2px; background:var(--castanho-medio); opacity:.55; flex:1; }
.divisor-pedra span:nth-child(1){ height:1px; opacity:.35; }
.divisor-pedra span:nth-child(2){ height:3px; opacity:.6; }
.divisor-pedra span:nth-child(3){ height:1px; opacity:.4; }
.divisor-pedra span:nth-child(4){ height:2px; opacity:.5; }
.divisor-pedra.esquerda{ margin:var(--espaco-md) 0; }

/* ===== RODAPÉ ===== */
footer{ background:var(--castanho-escuro); color:rgba(245,239,229,.85); padding:3rem 0 1.6rem; font-size:.85rem; text-align:center; }
footer .marca{ color:var(--creme); }
footer a{ color:rgba(245,239,229,.75); }
.rodape-legal{ margin-top:1rem; font-size:.75rem; color:rgba(245,239,229,.55); display:flex; justify-content:center; gap:1rem; flex-wrap:wrap; }

/* ===== WHATSAPP FLUTUANTE + BARRA MOBILE ===== */
.whatsapp-flutuante{ position:fixed; bottom:1.6rem; right:1.6rem; z-index:90; width:56px; height:56px; border-radius:50%; background:var(--castanho-escuro); color:var(--creme); display:flex; align-items:center; justify-content:center; box-shadow:0 10px 26px -10px rgba(0,0,0,.5); }
/* Número visível para copiar (desktop) — em mobile mostra-se antes um botão "Ligar" na app-bar */
.telefone-flutuante{ position:fixed; bottom:1.85rem; right:5.6rem; z-index:90; background:var(--branco); color:var(--castanho-escuro); font-family:var(--label-font); font-size:.8rem; font-weight:600; padding:.55rem .9rem; border-radius:999px; box-shadow:0 10px 26px -10px rgba(0,0,0,.35); user-select:all; white-space:nowrap; }
.app-bar-mobile{ display:none; position:fixed; bottom:0; left:0; right:0; z-index:95; background:var(--branco); border-top:1px solid rgba(74,44,26,.12); padding:.6rem 1rem calc(.6rem + env(safe-area-inset-bottom,0px)); justify-content:space-around; align-items:center; }
.app-bar-mobile a{ display:flex; flex-direction:column; align-items:center; gap:.3rem; font-family:var(--label-font); font-size:.62rem; text-transform:uppercase; font-weight:600; color:var(--castanho-medio); }
.app-bar-mobile a.reservar{ color:var(--castanho-escuro); }
.app-bar-mobile svg{ width:20px; height:20px; }

/* ===== CARDS DA COLEÇÃO — mini-slideshow ao passar o rato ===== */
.imagem-cartao{ position:relative; overflow:hidden; }
.card-slide{ position:absolute; inset:0; width:100%; height:100%; object-fit:cover; opacity:0; transition:opacity .7s ease; }
.card-slide.ativo{ opacity:1; }

/* ===== WISHLIST (favoritos) — localStorage, sem conta nem backend ===== */
.favorito-btn{ position:absolute; top:.8rem; right:.8rem; z-index:6; width:38px; height:38px; border-radius:50%; border:none; cursor:pointer; background:rgba(20,12,7,.45); color:var(--branco); display:flex; align-items:center; justify-content:center; transition:background var(--transicao), transform var(--transicao); }
.favorito-btn:hover{ transform:scale(1.08); }
.favorito-btn svg{ width:20px; height:20px; }
.favorito-btn.ativo{ color:#e0574c; }
.favorito-btn.ativo svg{ fill:currentColor; }

/* ===== BOTÃO "VOLTAR AO TOPO" ===== */
.botao-topo{
  position:fixed; right:1.6rem; bottom:5.4rem; z-index:94;
  width:44px; height:44px; border-radius:50%; border:none; cursor:pointer;
  background:var(--castanho-escuro); color:var(--creme);
  display:flex; align-items:center; justify-content:center;
  box-shadow:0 10px 26px -10px rgba(0,0,0,.5);
  opacity:0; visibility:hidden; transform:translateY(10px);
  transition:opacity var(--transicao), transform var(--transicao), visibility 0s var(--transicao), background var(--transicao);
}
.botao-topo.visivel{ opacity:1; visibility:visible; transform:translateY(0); transition:opacity var(--transicao), transform var(--transicao), visibility 0s, background var(--transicao); }
.botao-topo:hover{ background:var(--castanho-medio); }
@media (max-width:1180px){
  .botao-topo{ right:1rem; bottom:calc(74px + env(safe-area-inset-bottom,0px) + .8rem); }
}

/* ===== MODAL DE RESERVA / CONTACTO ===== */
.modal-overlay{ position:fixed; inset:0; background:rgba(20,12,7,.85); display:none; align-items:center; justify-content:center; z-index:200; padding:1.5rem; }
.modal-overlay.aberto{ display:flex; }
.modal-conteudo{ background:var(--branco); padding:2.2rem; max-width:480px; width:100%; max-height:90vh; overflow-y:auto; position:relative; }
.modal-fechar{ position:absolute; top:.9rem; right:1.1rem; font-size:1.8rem; cursor:pointer; color:var(--castanho-medio); }
.campo{ margin-bottom:1rem; text-align:left; }
.campo label{ display:block; font-family:var(--label-font); font-size:.68rem; text-transform:uppercase; letter-spacing:.08em; font-weight:600; margin-bottom:.4rem; }
.campo input, .campo select, .campo textarea{ width:100%; padding:.7rem; border:1px solid #ddd; font-family:var(--sans); font-size:.95rem; }
.duas-colunas{ display:grid; grid-template-columns:1fr 1fr; gap:1rem; align-items:start; }
.modal-conteudo .consent-newsletter{ display:flex; gap:.5rem; align-items:flex-start; margin:0 0 1rem; font:400 .82rem/1.4 var(--sans); text-transform:none; letter-spacing:0; color:var(--castanho-medio); cursor:pointer; }
.modal-conteudo .consent-newsletter input{ width:auto; margin:.15rem 0 0; padding:0; flex-shrink:0; }
.btn-whatsapp{ background:#25D366; border-color:#25D366; color:#fff; }
.btn-whatsapp:hover{ background:#1fb959; }

/* "O que acontece a seguir" — passos após o pedido de reserva, para
   reduzir a hesitação antes de carregar em enviar. */
.proximos-passos{ margin:.4rem 0 1.2rem; padding:1rem 1.1rem; background:var(--creme); border:1px solid rgba(74,44,26,.1); text-align:left; }
.proximos-passos h4{ font-family:var(--label-font); font-size:.68rem; text-transform:uppercase; letter-spacing:.08em; color:var(--castanho-medio); margin:0 0 .6rem; }
.proximos-passos ol{ margin:0; padding-left:1.1rem; font-size:.86rem; line-height:1.55; color:var(--castanho-escuro); }
.proximos-passos li{ margin-bottom:.25rem; }
.proximos-passos li:last-child{ margin-bottom:0; }

/* ===== RESPONSIVO ===== */
@media (max-width:1180px){
  nav.menu-principal, .header-acoes .btn-primario{ display:none; }
  .menu-toggle{ display:block; }
  .whatsapp-flutuante{ display:none; }
  .telefone-flutuante{ display:none; }
  .app-bar-mobile{ display:flex; }
  body{ padding-bottom:74px; }
}

/* ===== CALENDÁRIO DE DISPONIBILIDADE ===== */
.calendario-disp{ background:var(--branco); border:1px solid rgba(74,44,26,.12); padding:1.6rem; max-width:340px; }
.calendario-cabecalho{ display:flex; align-items:center; justify-content:space-between; margin-bottom:1rem; }
.calendario-cabecalho button{ background:none; border:1px solid rgba(74,44,26,.2); width:30px; height:30px; border-radius:50%; cursor:pointer; color:var(--castanho-escuro); font-size:.9rem; }
.calendario-cabecalho button:disabled{ opacity:.3; cursor:not-allowed; }
#calendario-titulo{ font-family:var(--serif); font-size:1.05rem; text-transform:capitalize; }
.calendario-dias-semana{ display:grid; grid-template-columns:repeat(7,1fr); gap:2px; margin-bottom:.3rem; }
.calendario-dias-semana span{ text-align:center; font-family:var(--label-font); font-size:.65rem; color:var(--castanho-medio); text-transform:uppercase; }
.calendario-grelha{ display:grid; grid-template-columns:repeat(7,1fr); gap:2px; }
.calendario-grelha .dia{ aspect-ratio:1; display:flex; align-items:center; justify-content:center; font-size:.8rem; border-radius:3px; }
.calendario-grelha .dia.vazio{ visibility:hidden; }
.calendario-grelha .dia.disponivel{ background:var(--creme-profundo); color:var(--castanho-escuro); }
.calendario-grelha .dia.ocupado{ background:rgba(74,44,26,.85); color:var(--creme); text-decoration:line-through; opacity:.7; }
.calendario-grelha .dia.passado{ color:rgba(74,44,26,.25); }
.calendario-legenda{ display:flex; gap:1.2rem; margin-top:1rem; font-size:.75rem; color:var(--castanho-medio); }
.calendario-legenda .ponto{ display:inline-block; width:10px; height:10px; border-radius:2px; margin-right:.4rem; vertical-align:middle; }
.calendario-legenda .ponto.disponivel{ background:var(--creme-profundo); border:1px solid rgba(74,44,26,.2); }
.calendario-legenda .ponto.ocupado{ background:rgba(74,44,26,.85); }
.calendario-erro{ font-size:.82rem; color:var(--castanho-medio); margin-top:1rem; padding-top:1rem; border-top:1px solid rgba(74,44,26,.1); }

/* ===== Otimização de render =====
   "content-visibility:auto" faz o browser saltar o trabalho de desenhar
   secções que ainda não estão visíveis no ecrã, acelerando o primeiro
   render de páginas compridas. O "contain-intrinsic-size" dá uma estimativa
   da altura para a barra de scroll não saltar; o valor "auto" faz o browser
   memorizar a altura real depois de a secção ser desenhada uma vez. */
.cv-auto{ content-visibility:auto; contain-intrinsic-size:auto 500px; }
