/* Casa Jardim 21 — cores tiradas da própria casa:
   cal amarela das paredes, cantaria cor-de-rosa das janelas, telha de barro,
   calçada de basalto, verde da floresta, azul do Atlântico. */
@font-face{font-family:"Fraunces";src:url(fonts/fraunces-latin-600-normal.woff2) format("woff2");font-weight:600;font-display:swap}
@font-face{font-family:"Fraunces";src:url(fonts/fraunces-latin-400-italic.woff2) format("woff2");font-weight:400;font-style:italic;font-display:swap}
@font-face{font-family:"Source Serif 4";src:url(fonts/source-serif-4-latin-400-normal.woff2) format("woff2");font-weight:400;font-display:swap}
@font-face{font-family:"Source Serif 4";src:url(fonts/source-serif-4-latin-400-italic.woff2) format("woff2");font-weight:400;font-style:italic;font-display:swap}
@font-face{font-family:"Source Serif 4";src:url(fonts/source-serif-4-latin-600-normal.woff2) format("woff2");font-weight:600;font-display:swap}

:root{
  --papel:#FBF5E6;
  --cal:#F2E4BC;
  --rosa:#C9737B;
  --rosa-escuro:#9E4652;
  --telha:#A8471F;
  --basalto:#2A2623;
  --pedra:#5E5750;
  --verde:#33502E;
  --mar:#22475C;
  --linha:#E3D3A8;
  --max:1180px;
  --serif:"Source Serif 4",Georgia,serif;
  --titulo:"Fraunces",Georgia,serif;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}
body{margin:0;background:var(--papel);color:var(--basalto);font:400 1.0625rem/1.65 var(--serif)}
img{display:block;max-width:100%;height:auto}
a{color:var(--rosa-escuro)}
h1,h2,h3{font-family:var(--titulo);font-weight:600;line-height:1.12;margin:0 0 .5em;letter-spacing:-.01em}
h1{font-size:clamp(2.2rem,5.6vw,4rem)}
h2{font-size:clamp(1.8rem,4vw,2.8rem)}
h3{font-size:1.35rem}
p{margin:0 0 1em}
.wrap{max-width:var(--max);margin:0 auto;padding:0 20px}
.over{display:block;font:italic 400 1.125rem/1.3 var(--titulo);color:var(--rosa-escuro);margin-bottom:.4em}
.lead{font-size:1.2rem;max-width:40em}
section{padding:72px 0;scroll-margin-top:110px}
.skip{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
a.skip:focus{width:auto;height:auto;clip:auto;left:12px;top:12px;z-index:99;background:#fff;padding:8px 12px}

/* Faixa de pré-visualização */
.previa{background:var(--basalto);color:var(--cal);font-size:.875rem;text-align:center;padding:8px 16px}

/* Topo */
.topo{position:sticky;top:0;z-index:20;background:rgba(251,245,230,.96);border-bottom:1px solid var(--linha);backdrop-filter:blur(6px)}
.topo .wrap{display:flex;align-items:center;gap:16px;min-height:64px}
.marca{font:600 1.3rem/1 var(--titulo);color:var(--basalto);text-decoration:none;white-space:nowrap}
.marca span{color:var(--rosa-escuro)}
.menu{display:flex;gap:6px;overflow-x:auto;scrollbar-width:none;padding:0 20px 10px;max-width:var(--max);margin:0 auto}
.menu::-webkit-scrollbar{display:none}
.menu a{flex:none;padding:8px 14px;border:1px solid var(--linha);border-radius:999px;font-size:.95rem!important;background:var(--papel)}
.menu a{color:var(--basalto);text-decoration:none;font-size:1rem}
.menu a:hover{color:var(--rosa-escuro)}
.linguas{margin-left:auto;position:relative}
.linguas select{appearance:none;font:600 .9rem var(--serif);background:transparent;border:1px solid var(--linha);border-radius:6px;padding:8px 26px 8px 10px;color:var(--basalto);min-height:44px;cursor:pointer}
.linguas::after{content:"▾";position:absolute;right:9px;top:50%;transform:translateY(-50%);pointer-events:none;font-size:.8rem}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:48px;padding:12px 22px;border-radius:8px;font:600 1rem/1.2 var(--serif);text-decoration:none;border:2px solid transparent;cursor:pointer;transition:background .2s,color .2s,border-color .2s}
.btn-rosa{background:var(--rosa-escuro);color:#fff}
.btn-rosa:hover{background:#863945}
.btn-linha{border-color:var(--basalto);color:var(--basalto);background:transparent}
.btn-linha:hover{background:var(--basalto);color:var(--papel)}
.btn-verde{background:var(--verde);color:#fff}
.btn-verde:hover{background:#26401f}
.topo .btn{min-height:44px;padding:8px 16px}


/* A moldura de cantaria: as fotos aparecem como as janelas da casa */
.janela{background:var(--rosa);padding:12px;border-radius:4px;box-shadow:0 1px 0 rgba(0,0,0,.08)}
.janela img{border-radius:2px;width:100%;height:auto;aspect-ratio:4/3;object-fit:cover}

/* Entrada */
.entrada{padding:40px 0 64px;background:linear-gradient(var(--cal),var(--papel))}
.entrada .wrap{display:grid;gap:36px;align-items:center}
.entrada .janela{order:-1}
.entrada{padding-top:20px}
.entrada .acoes{display:flex;flex-wrap:wrap;gap:12px;margin:26px 0 22px}
.nota{display:inline-flex;align-items:center;gap:10px;font-size:.95rem;color:var(--pedra)}
.nota b{display:inline-grid;place-items:center;width:40px;height:40px;border-radius:8px 8px 8px 0;background:var(--mar);color:#fff;font:600 1.05rem var(--serif)}
@media (min-width:900px){.entrada .wrap{grid-template-columns:1fr 1.1fr;gap:56px}.entrada{padding:64px 0 88px}.entrada .janela{order:0}}

/* Fita de fotos */
.fita{display:grid;grid-auto-flow:column;grid-auto-columns:minmax(220px,30%);gap:12px;overflow-x:auto;padding:0 20px 8px;scroll-snap-type:x mandatory;max-width:var(--max);margin:0 auto}
.fita img{aspect-ratio:3/4;height:auto;object-fit:cover;border-radius:4px;scroll-snap-align:start;width:100%}

/* A casa */
.casa .wrap{display:grid;gap:40px}
.factos{list-style:none;padding:0;margin:8px 0 0;display:grid;grid-template-columns:1fr 1fr;gap:10px 18px}
.factos li{padding:10px 0 10px 18px;border-top:1px solid var(--linha);position:relative}
.factos li::before{content:"";position:absolute;left:0;top:20px;width:8px;height:8px;background:var(--rosa);border-radius:2px}
.casa-fotos{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.casa-fotos img{border-radius:4px;width:100%;height:auto;object-fit:cover;aspect-ratio:3/4}
.casa-fotos img:first-child{grid-column:span 2;aspect-ratio:4/3}
@media (min-width:900px){.casa .wrap{grid-template-columns:1fr 1fr;gap:64px;align-items:start}}

/* Quartos */
.quartos{background:var(--cal)}
.quartos-grelha{display:grid;gap:28px;margin-top:28px}
.quarto .janela{margin-bottom:16px}
@media (min-width:760px){.quartos-grelha{grid-template-columns:1fr 1fr;gap:40px}}

/* Jardim */
.jardim .wrap{display:grid;gap:36px;align-items:center}
.mosaico{display:grid;grid-template-columns:repeat(6,1fr);grid-auto-rows:110px;gap:10px}
.mosaico img{width:100%;height:100%;min-height:0;object-fit:cover;border-radius:4px}
.mosaico .a{grid-column:span 6;grid-row:span 2}
.mosaico .b{grid-column:span 3;grid-row:span 2}
.mosaico .c{grid-column:span 3;grid-row:span 2}
@media (min-width:900px){.jardim .wrap{grid-template-columns:1fr 1.2fr;gap:64px}.mosaico{grid-auto-rows:130px}.mosaico .a{grid-column:span 4}.mosaico .b{grid-column:span 2}.mosaico .c{grid-column:span 2}}

/* Galeria */
.galeria{background:var(--basalto);color:var(--cal)}
.galeria .over{color:var(--rosa)}
.filtros{display:flex;flex-wrap:wrap;gap:8px;margin:20px 0 26px}
.filtros button{font:600 .95rem var(--serif);background:transparent;color:var(--cal);border:1px solid #6b625a;border-radius:999px;padding:10px 18px;min-height:44px;cursor:pointer}
.filtros button[aria-pressed="true"]{background:var(--cal);color:var(--basalto);border-color:var(--cal)}
.grelha{columns:2 160px;column-gap:10px}
.grelha button{display:block;width:100%;padding:0;margin:0 0 10px;border:0;background:none;cursor:zoom-in;break-inside:avoid;border-radius:4px;overflow:hidden}
.grelha button[hidden]{display:none}
.mais{display:none;margin:6px auto 0;background:transparent;color:var(--cal);border:1px solid var(--cal)}
@media (max-width:759px){.grelha:not(.toda) button:nth-of-type(n+9){display:none}.grelha:not(.toda)~.mais{display:flex}}
.grelha img{width:100%;transition:transform .4s ease}
.grelha button:hover img{transform:scale(1.03)}
@media (min-width:760px){.grelha{columns:3}}
@media (min-width:1100px){.grelha{columns:4}}

/* Visor */
.visor{position:fixed;inset:0;z-index:50;background:rgba(20,18,16,.95);display:none;align-items:center;justify-content:center;padding:56px 12px}
.visor.aberto{display:flex}
.visor img{max-height:100%;max-width:100%;object-fit:contain;border-radius:4px}
.visor button{position:absolute;background:rgba(251,245,230,.12);color:#fff;border:0;width:48px;height:48px;border-radius:50%;font-size:1.5rem;cursor:pointer}
.visor .fechar{top:12px;right:12px}
.visor .ant{left:8px;top:50%;transform:translateY(-50%)}
.visor .seg{right:8px;top:50%;transform:translateY(-50%)}

/* Comentários */
.comentarios .wrap{max-width:900px}
.citacoes{display:grid;gap:22px;margin-top:22px}
blockquote{margin:0;padding:24px 26px;background:#fff;border-left:6px solid var(--rosa);border-radius:4px}
blockquote p{font:italic 400 1.2rem/1.5 var(--titulo)}
blockquote footer{font-size:.9rem;color:var(--pedra)}
@media (min-width:760px){.citacoes{grid-template-columns:1fr 1fr}}

/* Os Prazeres */
.prazeres{background:var(--verde);color:#F4EDD8}
.prazeres .over{color:#F0B9BE}
.prazeres a{color:#fff}
.sitio{display:grid;gap:22px;padding:44px 0;border-top:1px solid rgba(244,237,216,.22)}
.sitio:first-of-type{margin-top:28px}
.sitio .etiqueta{display:inline-block;font-size:.85rem;font-weight:600;background:rgba(244,237,216,.14);padding:4px 10px;border-radius:4px;margin-bottom:12px}
.sitio-fotos{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}
.sitio-fotos img{width:100%;height:auto;aspect-ratio:1;object-fit:cover;border-radius:4px}
.sitio-fotos.duas{grid-template-columns:1fr 1fr}
.sitio-fotos.duas img{aspect-ratio:4/5}
.sitio-fotos.uma{grid-template-columns:1fr}
.sitio-fotos.uma img{aspect-ratio:16/10}
.falta-foto{display:grid;place-items:center;aspect-ratio:16/10;border:2px dashed rgba(244,237,216,.5);border-radius:4px;text-align:center;padding:16px;font-size:.95rem}
@media (min-width:900px){.sitio{grid-template-columns:1fr 1.25fr;gap:56px;align-items:center}.sitio:nth-of-type(even) .sitio-texto{order:2}}
.perto{display:grid;gap:12px;margin-top:40px;grid-template-columns:1fr 1fr}
.perto div{background:rgba(244,237,216,.1);border-radius:6px;padding:16px}
.perto b{display:block;font:600 1.5rem/1.1 var(--titulo);color:#fff}
@media (min-width:900px){.perto{grid-template-columns:repeat(4,1fr)}}

/* Chegar */
.chegar .wrap{display:grid;gap:32px}
.mapa{aspect-ratio:4/3;border-radius:6px;overflow:hidden;background:var(--cal);border:1px solid var(--linha)}
.mapa iframe{width:100%;height:100%;border:0}
@media (min-width:900px){.chegar .wrap{grid-template-columns:1fr 1.3fr;gap:56px;align-items:center}}

/* Pedido de datas */
.pedido{background:var(--cal)}
.pedido .wrap{max-width:820px}
form{display:grid;gap:16px;margin-top:22px}
.campos{display:grid;gap:16px}
@media (min-width:640px){.campos{grid-template-columns:1fr 1fr}}
label{display:grid;gap:6px;font-weight:600;font-size:.95rem}
input,textarea{font:400 1rem var(--serif);padding:12px 14px;border:1px solid #cdb98a;border-radius:6px;background:#fff;color:var(--basalto);min-height:48px;width:100%}
input:focus,textarea:focus,select:focus,button:focus-visible,a:focus-visible{outline:3px solid var(--mar);outline-offset:2px}
textarea{min-height:110px;resize:vertical}
.enviar{display:flex;flex-wrap:wrap;gap:12px}
.aviso{font-size:.95rem;color:var(--pedra)}

/* Bom saber */
.saber ul{list-style:none;padding:0;margin:20px 0 0;display:grid;gap:0}
.saber li{padding:14px 0;border-top:1px solid var(--linha)}
@media (min-width:760px){.saber ul{grid-template-columns:1fr 1fr;column-gap:40px}}

/* Rodapé */
.rodape{background:var(--basalto);color:#d9cfb8;padding:48px 0 96px;font-size:.95rem}
.rodape a{color:#fff}
.rodape .wrap{display:grid;gap:20px}
.rodape .marca{color:var(--cal)}
@media (min-width:760px){.rodape .wrap{grid-template-columns:2fr 1fr 1fr}.rodape{padding-bottom:48px}}

/* Barra fixa no telemóvel */
.barra{position:fixed;left:0;right:0;bottom:0;z-index:30;display:flex;gap:8px;padding:10px 12px calc(10px + env(safe-area-inset-bottom));background:rgba(251,245,230,.97);border-top:1px solid var(--linha)}
.barra .btn{flex:1;padding:10px}
@media (min-width:760px){.barra{display:none}}

@media (prefers-reduced-motion:reduce){*{transition:none!important;scroll-behavior:auto!important}}

/* Menu: no PC fica na barra, no telemóvel numa fila por baixo que desliza */
.menu-pc{display:none}
@media (min-width:960px){
  .topo{display:block}
  .menu-tel{display:none}
  .menu-pc{display:flex;gap:22px;margin-left:auto;padding:0;overflow:visible}
  .menu-pc a{border:0;padding:0;background:none;font-size:1rem!important}
  .linguas{margin-left:8px}
}

/* Botão do mapa (carrega o Google Maps só quando a pessoa pede) */
.ver-mapa{width:100%;height:100%;display:grid;place-content:center;gap:6px;border:0;background:var(--cal);cursor:pointer;font:600 1.1rem var(--serif);color:var(--verde)}
.ver-mapa small{font:400 .85rem var(--serif);color:var(--pedra)}
.ver-mapa:hover{background:#efdfb0}

/* Reservar no Booking, em destaque por baixo do formulário */
.ja-booking{margin-top:18px;padding:22px;background:var(--papel);border:2px solid var(--rosa);border-radius:8px;display:grid;gap:12px;justify-items:start}
.ja-booking p{margin:0;font:600 1.35rem/1.2 var(--titulo)}
.ja-booking .btn{font-size:1.1rem;min-height:56px;padding:14px 28px}
@media (max-width:639px){.ja-booking .btn{width:100%}}