/* =====================================================================
   Theme gaivotas — Gaivota Suítes (fonte: docs/psd/_site/Pagina_Principal.psd, 1920px)
   Medidas do PSD (1920px) reduzidas ~0,78x p/ desktop e conteúdo limitado a 1320px — ver docs/04-psd-layout.md
   ===================================================================== */
@font-face{font-family:"Recoleta";src:url("fonts/Recoleta-Medium.woff") format("woff");font-weight:400;font-display:swap}
@font-face{font-family:"Lufga";src:url("fonts/Lufga-Light.otf") format("opentype");font-weight:300;font-display:swap}
@font-face{font-family:"Lufga";src:url("fonts/Lufga-Regular.otf") format("opentype");font-weight:400;font-display:swap}
@font-face{font-family:"Lufga";src:url("fonts/Lufga-Medium.otf") format("opentype");font-weight:500;font-display:swap}

:root{
  --primary:#0e3977; --surface:#e6e3dd; --accent:#b55d39; --gold:#c88844;
  --ink:#233346; --cta:#e75738; --white:#fff;
  --serif:"Recoleta",Georgia,serif; --sans:"Lufga",system-ui,sans-serif;
  --pad:max(20px,5vw,calc((100vw - 1320px)/2));   /* conteúdo ≤ 1320px, centrado */
  --h2:clamp(32px,3.2vw,56px);
  --body:clamp(16px,1.15vw,20px);
}
*,*::before,*::after{box-sizing:border-box}
html{scroll-behavior:smooth;scroll-padding-top:90px}
body{margin:0;background:var(--surface);color:var(--primary);font-family:var(--sans);font-weight:400;font-size:var(--body);line-height:1.2;-webkit-font-smoothing:antialiased}
img{max-width:100%;display:block}
a{color:inherit}
h1,h2,h3,p{margin:0}
h2{font-family:var(--serif);font-weight:400;font-size:var(--h2);line-height:1.1}

/* ---------- HEADER ---------- */
.site-header{background:var(--primary);height:clamp(76px,6.4vw,118px);position:relative;z-index:20}
.header-inner{height:100%;display:flex;align-items:center;justify-content:space-between;padding:0 var(--pad)}
.brand img{width:clamp(120px,11.5vw,220px);height:auto}
.nav{display:flex;align-items:center;gap:clamp(14px,2.07vw,40px);font-family:var(--serif);font-size:clamp(14px,1.05vw,20px);color:var(--white)}
.nav a{text-decoration:none;white-space:nowrap}
.nav a:not(.btn-reservar):hover{color:var(--gold)}
.btn-reservar{display:inline-flex;align-items:center;justify-content:center;width:clamp(96px,7.57vw,145px);height:clamp(40px,3.04vw,58px);margin-left:clamp(4px,1.17vw,22px);border:3px solid var(--cta);border-radius:999px;transition:background .2s}
.btn-reservar:hover{background:var(--cta)}
.nav-toggle{display:none;background:none;border:0;padding:8px;cursor:pointer}
.nav-toggle span{display:block;width:26px;height:3px;background:var(--white);margin:5px 0;border-radius:2px}

/* ---------- HERO ---------- */
.hero{position:relative;height:clamp(320px,36vw,690px);overflow:hidden}
.hero-img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:50% 62%}
.reserva{position:absolute;left:50%;bottom:clamp(20px,3.9vw,75px);transform:translateX(-50%);width:min(960px,92%);background:rgba(255,255,255,.71);padding:clamp(14px,1.64vw,31px) clamp(14px,1.01vw,20px)}
.reserva form{display:flex;flex-wrap:wrap;align-items:center;gap:10px 14px;font:400 clamp(12px,0.65vw,12px)/1.2 system-ui,sans-serif;color:#222;justify-content:center}
.reserva label{display:flex;align-items:center;gap:8px}
.reserva input,.reserva select{font:inherit;padding:8px 10px;border:1px solid #ccd;background:#fff;border-radius:2px}
.reserva button{font:inherit;padding:10px 16px;border:0;border-radius:3px;background:#3a3a3a;color:#fff;cursor:pointer}
.reserva button:hover{background:#000}

/* ---------- QUARTOS ---------- */
.quartos{padding:clamp(48px,4.84vw,94px) 0 clamp(40px,3.9vw,75px);text-align:center;position:relative}
.quartos h2{margin-bottom:clamp(32px,3.43vw,66px)}
.quartos-viewport{padding:0 var(--pad)}
.quartos-track{display:flex;gap:clamp(12px,2.03vw,20px);overflow-x:auto;scroll-snap-type:x mandatory;scrollbar-width:none}
.quartos-track::-webkit-scrollbar{display:none}
.quartos-track{cursor:grab;scroll-behavior:auto}
.quartos-track.arrastando{cursor:grabbing;scroll-snap-type:none;user-select:none}
.quartos-track:focus-visible{outline:2px solid var(--gold);outline-offset:-4px}
.quarto{flex:0 0 calc((100% - 2*clamp(12px,2.03vw,20px))/3);scroll-snap-align:start}
.quarto-foto{aspect-ratio:487/418;border-radius:999px 999px 0 0;overflow:hidden;background:var(--ink)}
.quarto-foto img{width:100%;height:100%;object-fit:cover}
.quarto-nome{background:var(--primary);color:var(--surface);font-family:var(--sans);font-weight:400;font-size:var(--body);letter-spacing:.2em;height:clamp(52px,3.9vw,75px);display:flex;align-items:center;justify-content:center}
.quartos-viewport{position:relative}
.seta{position:absolute;top:36%;transform:translateY(-50%);width:var(--pad);height:clamp(40px,4vw,64px);padding:0;background:no-repeat center/auto 70%;border:0;cursor:pointer;opacity:.6;z-index:2}
.seta-esq{left:0;background-image:url(assets/seta-esq.png)}
.seta-dir{right:0;background-image:url(assets/seta-dir.png)}
.seta:hover{opacity:1}

/* ---------- SOBRE ---------- */
.sobre{padding:clamp(28px,2.5vw,48px) 0 0}
.sobre-top{display:flex;align-items:center;justify-content:space-between;padding:0 var(--pad);margin-bottom:clamp(20px,2vw,40px)}
.sobre-top .ornamento{width:clamp(220px,46vw,860px);max-width:66%;height:auto}
.sobre-texto{padding:0 var(--pad)}
.sobre-texto p{max-width:62em}
.sobre-texto p+p{margin-top:1.2em}
.sobre-foto{margin-top:clamp(40px,4.06vw,78px)}
.sobre-foto img{width:100%;height:clamp(200px,30vw,560px);object-fit:cover}

/* ---------- LOCALIDADE ---------- */
.localidade{position:relative;padding:clamp(48px,5vw,96px) var(--pad) 0;height:clamp(470px,39.5vw,760px);overflow:hidden}
.localidade-texto{width:50%;position:relative;z-index:1;margin-top:clamp(24px,3.9vw,74px)}
.localidade-texto p+p{margin-top:1.2em}
.praia-wrap{position:absolute;left:-2vw;top:2.2vw;width:104.5vw;pointer-events:none}
.praia-wrap img{width:100%;max-width:none;height:auto}

/* ---------- GALERIA ---------- */
.galeria{background:var(--primary);color:var(--surface);padding:clamp(48px,3.5vw,67px) var(--pad) clamp(56px,7.8vw,148px)}
.galeria h2{margin-bottom:clamp(32px,4.91vw,94px)}
.galeria-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(12px,2.85vw,55px) clamp(12px,2.77vw,53px)}
.galeria-item{aspect-ratio:477/416;background:var(--surface);overflow:hidden}
.galeria-item img{width:100%;height:100%;object-fit:cover}
.galeria-item img[src=""],.galeria-item img:not([src]){display:none}

/* ---------- SERVIÇOS ---------- */
.servicos{position:relative;padding:clamp(48px,3.59vw,69px) var(--pad) clamp(60px,7.8vw,148px);overflow:hidden}
.servicos-corpo{width:calc((100vw - 2*var(--pad))*.56);position:relative;z-index:1}
.servicos-texto{margin-top:clamp(24px,2.65vw,51px)}
.servicos hr{border:0;height:3px;background:var(--primary);margin:clamp(32px,4.13vw,78px) 0 clamp(28px,3.28vw,62px)}
.servicos-lista{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(3,max-content);justify-content:space-between;gap:clamp(20px,2.4vw,44px) clamp(16px,2vw,40px);font-weight:500;font-size:clamp(16px,1.3vw,24px);color:var(--accent)}
.servicos-lista li{display:flex;align-items:center;gap:.5em;white-space:nowrap}
.servicos-lista li::after{content:"";flex:none;width:1.15em;height:1em;background:url(assets/check.png) no-repeat center/contain}
.casa{position:absolute;right:0;bottom:clamp(40px,5.3vw,100px);width:min(42vw,800px);height:auto}

/* ---------- CONTATO ---------- */
.contato{background:var(--accent);color:var(--surface);padding:clamp(40px,3.6vw,68px) var(--pad) clamp(44px,4vw,76px)}
.contato h2{margin-bottom:clamp(28px,2.8vw,52px)}
.contato-grid{display:grid;grid-template-columns:1fr 1fr;gap:clamp(28px,2.8vw,52px) 4%}
.contato h3{font-weight:500;font-size:clamp(20px,1.55vw,28px);line-height:1.1;margin-bottom:.6em}
.contato-dado{font-weight:300;font-size:clamp(15px,1.15vw,20px);line-height:1.6;white-space:pre-line}
.contato a{text-decoration:none}
.contato .redes{display:flex;flex-direction:column}
.contato .redes a:hover{text-decoration:underline}

.site-footer{background:var(--ink);color:var(--surface);text-align:center;padding:20px;font-size:14px}

/* ---------- PÁGINA QUARTOS ---------- */
.quarto-link{display:block;text-decoration:none;color:inherit}
.pg-topo{background:var(--primary);color:var(--surface);text-align:center;padding:clamp(48px,4.68vw,90px) var(--pad) 0;position:relative}
.pg-topo h1{font-family:var(--serif);font-weight:400;font-size:var(--h2);line-height:1.1}
.pg-topo p{max-width:min(900px,100%);margin:clamp(16px,1.4vw,27px) auto 0}
.ondas{height:clamp(46px,3.9vw,75px);margin:clamp(32px,3.12vw,59px) calc(-1*var(--pad)) 0;background:
  radial-gradient(circle at 50% 0,var(--gold) 0 46%,transparent 47%) 0 0/clamp(48px,3.86vw,74px) clamp(24px,1.95vw,37px) repeat-x,
  radial-gradient(circle at 50% 0,var(--gold) 0 46%,transparent 47%) 0 clamp(22px,1.79vw,34px)/clamp(48px,3.86vw,74px) clamp(24px,1.95vw,37px) repeat-x}
.suite{display:grid;grid-template-columns:minmax(0,430px) minmax(0,1fr);gap:clamp(24px,4.68vw,90px);align-items:center;justify-content:center;padding:clamp(40px,4.29vw,82px) var(--pad)}
.suite+.suite{padding-top:0}
.suite-inv{grid-template-columns:minmax(0,1fr) minmax(0,430px)}
.suite-inv .suite-foto{order:2}
.suite-foto .quarto-nome{font-size:var(--body);margin:0}
.suite-desc{font-size:var(--body);line-height:1.3;max-width:34em}
.suite-ficha{list-style:none;margin:clamp(20px,1.87vw,36px) 0;padding:0;display:grid;gap:clamp(12px,1.09vw,20px);font-weight:500;font-size:clamp(16px,1.33vw,25px);color:var(--accent)}
.suite-ficha li{display:flex;align-items:center;gap:.5em}
.suite-ficha li::after{content:"";flex:none;width:1.15em;height:1em;background:url(assets/check.png) no-repeat center/contain}
.btn-pill{display:inline-flex;align-items:center;justify-content:center;font-family:var(--serif);font-size:clamp(16px,1.05vw,20px);color:var(--primary);text-decoration:none;border:3px solid var(--cta);border-radius:999px;padding:.55em 2.2em;transition:background .2s,color .2s}
.btn-pill:hover{background:var(--cta);color:var(--white)}
.btn-pill-claro{color:var(--surface);border-color:var(--surface)}
.btn-pill-claro:hover{background:var(--surface);color:var(--accent)}
.pg-cta{background:var(--accent);color:var(--surface);text-align:center;padding:clamp(48px,4.68vw,90px) var(--pad)}
.pg-cta h2{margin-bottom:.4em}
.pg-cta p{margin-bottom:clamp(20px,1.87vw,36px)}
@media (max-width:900px){
  .suite,.suite-inv{grid-template-columns:1fr}
  .suite-inv .suite-foto{order:0}
}

/* ---------- PÁGINA SOBRE NÓS ---------- */
.historia{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,430px);gap:clamp(24px,4.68vw,90px);align-items:center;padding:clamp(40px,4.68vw,90px) var(--pad)}
.historia-texto h2{margin-bottom:.6em}
.historia-texto p+p{margin-top:1.2em}
.historia-foto .quarto-foto{border-radius:999px 999px 0 0;aspect-ratio:487/560}
.valores{background:var(--primary);color:var(--surface);padding:clamp(48px,3.51vw,67px) var(--pad) clamp(56px,4.68vw,90px)}
.valores h2{margin-bottom:clamp(28px,3.12vw,59px)}
.valores-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(24px,2.81vw,54px)}
.valor h3{font-weight:500;font-size:clamp(22px,2.18vw,42px);line-height:1.1;margin-bottom:.5em;color:var(--gold)}
.valor p{font-size:clamp(16px,1.25vw,23px);line-height:1.3}
.foto-larga img{width:100%;height:37.5vw;object-fit:cover}
/* ---------- PÁGINA SERVIÇOS ---------- */
.servicos-pg{position:relative;padding:clamp(40px,3.9vw,75px) var(--pad) clamp(60px,7.8vw,148px);overflow:hidden}
.servicos-pg-corpo{position:relative;z-index:1;width:calc((100vw - 2*var(--pad))*.56)}
.servicos-pg hr{border:0;height:3px;background:var(--primary);margin:clamp(28px,3.12vw,59px) 0}
.servicos-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:clamp(24px,2.34vw,45px) clamp(20px,2.34vw,45px)}
.servico h3{display:flex;align-items:center;gap:.5em;font-weight:500;font-size:clamp(18px,1.47vw,28px);color:var(--accent);margin-bottom:.35em}
.servico h3::after{content:"";flex:none;width:1.15em;height:1em;background:url(assets/check.png) no-repeat center/contain}
.servico p{font-size:clamp(15px,1.01vw,20px);line-height:1.3}
.servicos-pg .casa{bottom:clamp(40px,5.3vw,101px)}
@media (max-width:900px){
  .historia{grid-template-columns:1fr}
  .valores-grid{grid-template-columns:1fr}
  .foto-larga img{height:56vw}
  .servicos-pg-corpo{width:100%}
  .servicos-grid{grid-template-columns:1fr}
}

/* ---------- PÁGINA ATRAÇÕES ---------- */
.atracoes{padding:clamp(40px,3.9vw,75px) var(--pad) clamp(48px,5.46vw,101px)}
.atracoes-intro{max-width:min(1100px,100%);margin-bottom:clamp(28px,3.12vw,59px)}
.atracoes-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:clamp(24px,2.81vw,54px)}
.atracao{border-top:3px solid var(--gold);padding-top:clamp(16px,1.4vw,27px)}
.atracao-num{display:block;font-family:var(--serif);font-size:clamp(28px,2.34vw,45px);color:var(--gold);line-height:1;margin-bottom:.3em}
.atracao h2{font-size:clamp(26px,2.18vw,42px)}
.atracao-dist{font-weight:500;color:var(--accent);margin:.5em 0 .8em;font-size:clamp(16px,1.25vw,23px)}
/* ---------- PÁGINA COMO CHEGAR ---------- */
.chegar{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:clamp(24px,3.9vw,75px);align-items:start;padding:clamp(40px,3.9vw,75px) var(--pad) clamp(48px,5.46vw,101px)}
.chegar-end{font-weight:500;color:var(--accent);margin:.6em 0 clamp(20px,1.87vw,36px);font-size:clamp(18px,1.47vw,28px)}
.modo+.modo{margin-top:clamp(16px,1.4vw,27px)}
.modo h3{font-weight:500;font-size:clamp(20px,1.56vw,30px);margin-bottom:.3em}
.chegar .btn-pill{margin-top:clamp(24px,2.34vw,44px)}
.mapa{position:relative;aspect-ratio:4/3;background:#d8d4cb;overflow:hidden}
.mapa iframe{position:absolute;inset:0;width:100%;height:100%;border:0;z-index:1}
.mapa iframe[src=""],.mapa iframe:not([src]){display:none}
.mapa-vazio{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;text-align:center;padding:24px;font-size:clamp(14px,0.94vw,17px)}
/* ---------- PÁGINA CONTATO ---------- */
.contato-pg{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,.9fr);gap:clamp(32px,4.68vw,90px);padding:clamp(40px,3.9vw,75px) var(--pad) clamp(56px,6.24vw,117px)}
.contact-form{display:flex;flex-direction:column;gap:clamp(14px,1.09vw,20px);position:relative}
.contact-form h2,.contato-lateral h2{font-size:clamp(28px,2.34vw,45px);margin-bottom:.2em}
.cf-field{display:flex;flex-direction:column;gap:6px}
.cf-label{font-weight:500;font-size:clamp(14px,0.94vw,17px)}
.cf-input{font:inherit;font-size:clamp(15px,1.01vw,19px);padding:.7em .9em;border:2px solid var(--primary);background:transparent;color:var(--primary);border-radius:0}
.cf-input::placeholder{color:rgba(14,57,119,.5)}
.cf-input:focus{outline:none;border-color:var(--cta);background:#fff}
.cf-textarea{resize:vertical;min-height:160px}
.cf-submit{align-items:flex-start}
.cf-submit .btn-pill{background:none;cursor:pointer}
.cf-submit .btn-pill:hover{background:var(--cta);color:var(--white)}
.cf-submit .btn-pill:disabled{opacity:.6;cursor:wait}
.cf-status{padding:14px 18px;font-size:clamp(14px,0.94vw,17px)}
.cf-ok{background:#edf7ed;color:#256325;border:1px solid #b2dfb2}
.cf-error{background:#fdecea;color:#8b1a1a;border:1px solid #f5c6c6}
.contato-lateral{background:var(--accent);color:var(--surface);padding:clamp(24px,2.34vw,45px);align-self:start}
.contato-bloco{margin-top:clamp(18px,1.72vw,33px)}
.contato-bloco h3{font-weight:500;font-size:clamp(20px,1.56vw,30px);margin-bottom:.3em}
.contato-bloco p{font-size:clamp(15px,1.17vw,22px);line-height:1.5}
.contato-bloco a{text-decoration:none}
.contato-bloco .redes{display:flex;flex-direction:column}
.contato-bloco a:hover{text-decoration:underline}
@media (max-width:900px){
  .atracoes-grid,.chegar,.contato-pg{grid-template-columns:1fr}
}

/* ---------- RESPONSIVO ---------- */
@media (max-width:900px){
  .nav-toggle{display:block}
  .nav{display:none;position:absolute;top:100%;left:0;right:0;flex-direction:column;align-items:flex-start;gap:0;background:var(--primary);padding:8px 20px 20px;font-size:20px}
  .nav.open{display:flex}
  .nav a{padding:12px 0;width:100%}
  .btn-reservar{margin:8px 0 0;width:150px;height:50px}
  /* carrossel: sangra até a borda da tela e deixa o próximo card aparecer inteiro (sem corte no padding) */
  .quartos-viewport{padding:0}
  .quartos-track{padding:0 var(--pad);scroll-padding:0 var(--pad);gap:14px}
  .quarto{flex-basis:78%}
  .seta{display:none}
  .sobre-top{display:flex;align-items:center;justify-content:space-between;padding:0 11.35vw 0 var(--pad);margin-bottom:clamp(20px,2.03vw,39px)}
  .sobre-top .ornamento{max-width:100%}
  .localidade-texto,.servicos-corpo{width:100%}
  .casa{position:static;width:110%;margin:32px 0 -80px auto}
  .galeria-grid{grid-template-columns:repeat(2,1fr)}
  .servicos-lista{grid-template-columns:1fr 1fr}
  .contato-grid{grid-template-columns:1fr}
  .reserva{position:static;transform:none;width:100%;background:var(--surface);padding:20px var(--pad) 8px}
  /* barra de reserva em grade: datas em linhas inteiras, adultos/crianças lado a lado, botão largo */
  .reserva form{display:grid;grid-template-columns:1fr 1fr;gap:12px;font-size:14px}
  .reserva label{flex-direction:column;align-items:stretch;gap:4px;font-weight:500}
  .reserva label:nth-child(1),.reserva label:nth-child(2){grid-column:1/-1}
  .reserva input,.reserva select{width:100%;min-height:44px;font-size:16px}
  .reserva button{grid-column:1/-1;min-height:48px;font-size:16px;margin-top:4px}
  .hero{height:auto}
  .hero-img{position:static;width:100%;height:clamp(220px,46.8vw,328px);object-fit:cover}
  .localidade{height:auto;padding-bottom:0}
  .praia-wrap{position:static;width:112vw;margin:24px 0 0 calc(-6vw - var(--pad) + 0px)}
}