:root{color-scheme:light;--branco:#fff;--tinta:#1F3A2D;--mata:#1F3A2D;--verde:#1C7558;--verde-forte:#155E47;--veperia:#4F46E5;--veperia-forte:#4338CA;--areia:#F1E4D3;--areia-clara:#FAF4EC;--areia-media:#E6DCCC;--areia-forte:#DDBE92;--cinza:#5A5F4E;--linha:#E6DCCC;--seco:#B5873A;--chuva:#00875F;--titulo:Figtree,"Helvetica Neue",Arial,sans-serif;--texto:Figtree,"Helvetica Neue",Arial,sans-serif;--destino:"DM Serif Display",Georgia,serif;--larg:1120px;--topo:70px}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}}
body{margin:0;background:var(--branco);color:var(--tinta);font-family:var(--texto);font-size:17px;line-height:1.6;overflow-x:clip}
h1,h2,h3,p,figure{margin:0}
h2{font-size:clamp(30px,3.6vw,42px);line-height:1.08}
h3{font-size:22px;line-height:1.16}
a{color:inherit}
a:focus-visible,button:focus-visible{outline:3px solid var(--verde);outline-offset:3px}
img{display:block}
.faixa{padding-left:max(18px,env(safe-area-inset-left,0px));padding-right:max(18px,env(safe-area-inset-right,0px))}
.miolo{max-width:var(--larg);margin-inline:auto}
.foto{display:block;overflow:hidden;background:var(--linha)}
.foto img{width:100%;height:100%;object-fit:cover;transition:transform .7s cubic-bezier(.2,.7,.2,1)}
a.foto:hover img{transform:scale(1.06)}
.ler{display:inline-block;padding-block:8px;font-family:var(--titulo);font-weight:700;font-size:13.5px;text-underline-offset:4px}


/* Base do visual Areia e verde */
h1,h2,h3{font-family:var(--destino);font-weight:400;text-wrap:balance}
.l1{fill:var(--logo1,var(--mata))}
.l2{fill:var(--logo2,var(--verde))}
.botao{display:inline-flex;align-items:center;justify-content:center;gap:9px;min-height:50px;padding:10px 24px;border:0;border-radius:6px;background:var(--verde);color:#fff;font-family:var(--titulo);font-weight:700;font-size:15px;line-height:1.25;text-decoration:none;text-align:center;transition:background .2s}
.botao:hover{background:var(--verde-forte)}
.botao.veperia{background:var(--veperia)}
.botao.veperia:hover{background:var(--veperia-forte)}
body::before{content:"";position:fixed;inset:0 0 auto;height:env(safe-area-inset-top,0px);z-index:10;background:var(--areia)}
#topo{position:sticky;z-index:9;top:env(safe-area-inset-top,0px);background:var(--areia);color:var(--mata);box-shadow:0 1px 0 rgba(31,58,45,.1)}
#topo .miolo{display:flex;align-items:center;justify-content:space-between;gap:12px;min-height:var(--topo)}
#topo .logo{display:block;flex:none;width:clamp(150px,19vw,200px);aspect-ratio:1570/260}
#topo .logo svg,footer .marca svg{display:block;width:100%;height:100%}
#topo nav{display:flex;gap:clamp(10px,2vw,26px);font-family:var(--titulo);font-weight:600;font-size:clamp(12.5px,1.4vw,14.5px)}
#topo nav a{padding-block:12px;text-decoration:none;white-space:nowrap}
#topo nav a:hover{text-decoration:underline;text-decoration-color:var(--verde);text-decoration-thickness:2px;text-underline-offset:5px}
#capa{position:relative;display:grid;place-items:center;min-height:clamp(500px,78vh,700px);background:var(--mata);color:#fff;isolation:isolate}
#capa .foto{position:absolute;inset:0;z-index:-1;overflow:hidden;background:var(--mata)}
#capa .foto::after{content:"";position:absolute;inset:0;background:radial-gradient(ellipse 70% 60% at 50% 48%,rgba(12,26,19,.5),rgba(12,26,19,0) 75%),linear-gradient(180deg,rgba(12,26,19,.35) 0%,rgba(12,26,19,.2) 40%,rgba(12,26,19,.45) 100%)}
#capa .foto img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
#capa .texto{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:18px;max-width:760px;text-align:center;text-shadow:0 2px 18px rgba(0,0,0,.45),0 1px 3px rgba(0,0,0,.35);padding:64px max(18px,env(safe-area-inset-right,0px)) 92px max(18px,env(safe-area-inset-left,0px))}
#capa h1{font-size:clamp(42px,5.4vw,68px);line-height:1.03}
#capa p{font-size:clamp(17px,1.7vw,21px);line-height:1.42;max-width:34ch}
.curva{position:absolute;left:0;top:0;display:block;width:100%;height:clamp(14px,2.4vw,34px);transform:translateY(-98%);fill:var(--branco);pointer-events:none}
footer{background:var(--mata);color:var(--areia);padding-block:34px;font-size:14px;--logo1:#fff;--logo2:var(--areia-forte)}
footer .miolo{display:flex;flex-wrap:wrap;gap:14px 28px;align-items:center;justify-content:space-between}
footer .marca{display:block;width:170px;aspect-ratio:1570/260}
footer nav{display:flex;flex-wrap:wrap;gap:4px 20px;font-family:var(--titulo);font-weight:600;font-size:13.5px}
footer nav a{padding-block:7px;text-decoration:none;color:#fff}
footer p{width:100%;font-size:13px}
#veperia{background:var(--areia-clara);padding-block:56px}
#veperia .miolo{display:grid;gap:26px;align-items:center}
#veperia .foto{aspect-ratio:3/2}
#veperia .txt{display:flex;flex-direction:column;align-items:flex-start;gap:12px;min-width:0}
@media (max-width:520px){
  #topo .logo{width:150px}
  #topo nav{gap:9px;font-size:12px}
}
@media (min-width:760px){
  #capa .texto{padding:80px 40px 120px}
  #veperia .miolo{grid-template-columns:minmax(0,1.1fr) minmax(0,1fr);gap:44px}
}
#capa small{font-weight:400;font-size:clamp(16px,1.7vw,19px)}
#capa h1{margin-top:-10px}
#capa .foto img{object-position:50% 50%}

mark{padding:1px 7px;border-radius:4px;background:var(--areia-forte);color:var(--mata);font-size:12px;font-weight:700;white-space:nowrap}
section{scroll-margin-top:calc(var(--topo) + 14px)}
.link{font-weight:700;text-underline-offset:4px;text-decoration-color:var(--verde);text-decoration-thickness:2px}
#capa small{font-weight:400;font-size:clamp(16px,1.7vw,19px)}
#capa h1{margin-top:-10px}
#capa p{text-wrap:balance}
/* Post do acervo: capa da identidade, coluna de leitura, sumário, bloco do guia. */
.capa-post{min-height:clamp(340px,52vh,500px)}
#capa.capa-post h1{font-size:clamp(32px,4.4vw,56px);line-height:1.06}
#capa.capa-post .texto{max-width:880px;gap:14px}

.artigo{position:relative;background:var(--branco);padding-block:30px 60px}
.coluna{max-width:760px;margin-inline:auto}
.assinatura{margin-bottom:22px;color:var(--cinza);font-size:13.5px;line-height:1.5}
.volta-guia{display:block;margin-bottom:22px;padding:12px 0;border-block:1px solid var(--linha);font-size:15.5px;line-height:1.4;text-decoration:none}
.volta-guia b{font-weight:700;text-decoration:underline;text-decoration-color:var(--verde);text-decoration-thickness:2px;text-underline-offset:4px}

.sumario{margin-bottom:30px;background:var(--areia-clara);border-radius:6px}
.sumario summary{padding:14px 18px;font-weight:700;font-size:15.5px;cursor:pointer;list-style-position:inside}
.sumario ol{margin:0;padding:0 18px 16px 36px;font-size:15px;line-height:1.4}
.sumario li{padding-block:5px}
.sumario a{text-decoration:none}
.sumario a:hover{text-decoration:underline;text-decoration-color:var(--verde);text-underline-offset:3px}

.conteudo{overflow-wrap:break-word}
.conteudo>*+*{margin-top:18px}
.conteudo p,.conteudo li{font-size:17px;line-height:1.65}
.conteudo h2{margin-top:44px;font-size:clamp(27px,3.2vw,36px);line-height:1.12;scroll-margin-top:calc(var(--topo) + 14px)}
.conteudo h3{margin-top:32px;font-size:clamp(22px,2.4vw,26px);scroll-margin-top:calc(var(--topo) + 14px)}
.conteudo h4,.conteudo h5{margin:26px 0 0;font-family:var(--texto);font-weight:700;font-size:18px;line-height:1.3;scroll-margin-top:calc(var(--topo) + 14px)}
.conteudo a{text-decoration-color:var(--verde);text-decoration-thickness:1.5px;text-underline-offset:3px}
.conteudo ul,.conteudo ol{padding-left:24px}
.conteudo li+li{margin-top:6px}
.conteudo img{display:block;max-width:100%;height:auto;margin-inline:auto;border-radius:4px}
.conteudo figure{margin-block:24px}
.conteudo figcaption{margin-top:6px;color:var(--cinza);font-size:14px;line-height:1.4;text-align:center}
.conteudo hr{height:1px;margin-block:30px;border:0;background:var(--linha)}
.conteudo video{display:block;width:100%;height:auto;border-radius:4px}
.conteudo blockquote{margin:24px 0;padding:4px 0 4px 18px;border-left:3px solid var(--areia-forte)}
.conteudo pre{margin:0;padding:14px 18px;background:var(--areia-clara);border-radius:6px;font:inherit;font-size:16px;line-height:1.5;white-space:normal}
.conteudo pre code{font:inherit}

/* Tabelas: rolagem própria no celular, sem empurrar a página. */
.conteudo .wp-block-table{max-width:100%;overflow-x:auto}
.conteudo table{width:100%;min-width:480px;border-collapse:collapse;font-size:15px;line-height:1.4}
.conteudo th,.conteudo td{padding:10px 12px;border-bottom:1px solid var(--linha);text-align:left;vertical-align:top}
.conteudo th{background:var(--areia-clara);font-weight:700}
.conteudo td p,.conteudo th p{font-size:inherit;line-height:inherit}

/* Galerias, vídeos e mapas do WordPress. */
.conteudo .wp-block-gallery{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
.conteudo .wp-block-gallery figure{margin:0}
.conteudo .wp-block-embed__wrapper{position:relative;aspect-ratio:16/9}
.conteudo .wp-block-embed__wrapper iframe{position:absolute;inset:0;width:100%;height:100%;border:0}
.conteudo iframe{display:block;max-width:100%;border:0}
.conteudo iframe[src*="youtube.com"],.conteudo iframe[src*="google.com/maps"]{width:100%;aspect-ratio:16/9;height:auto}
.conteudo .civitatis-iframe{width:100%;min-height:340px}

.chamada-veperia{background:var(--areia-clara);padding-block:44px}
.chamada-veperia .coluna{display:flex;flex-direction:column;align-items:flex-start;gap:12px}
.chamada-veperia h2{font-size:clamp(27px,3.2vw,36px)}

/* Páginas de destino: cartões dos posts e índice de destinos. */
#capa.capa-post p{max-width:40ch}
.cartoes{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(100%,300px),1fr));gap:34px 26px}
.cartao{display:flex;flex-direction:column;gap:12px;min-width:0;text-decoration:none}
.cartao .foto{aspect-ratio:16/10;border-radius:4px}
.cartao:hover img{transform:scale(1.06)}
.cartao .txt{display:flex;flex-direction:column;gap:5px}
.cartao h3{font-size:clamp(21px,2.1vw,24px)}
.cartao:hover h3{text-decoration:underline;text-decoration-color:var(--verde);text-decoration-thickness:2px;text-underline-offset:4px}
.cartao small{color:var(--cinza);font-size:13px}
.cartao p{color:var(--cinza);font-size:15px;line-height:1.45}

.lugares{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(100%,240px),1fr));gap:28px 22px}
.lugar{display:flex;flex-direction:column;gap:9px;min-width:0;text-decoration:none}
.lugar .foto{aspect-ratio:4/3;border-radius:4px}
.lugar:hover img{transform:scale(1.06)}
.lugar span{display:flex;flex-direction:column-reverse;gap:1px}
.lugar b{font-family:var(--destino);font-weight:400;font-size:clamp(21px,2.2vw,26px);line-height:1.12}
.lugar small{color:var(--cinza);font-weight:300;font-size:13.5px;line-height:1.2}

.indice{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,300px),1fr));gap:34px 40px;margin-top:56px;padding-top:40px;border-top:1px solid var(--linha)}
.indice h2{margin-bottom:14px;font-size:clamp(26px,3vw,32px)}
.indice ul{columns:2 150px;column-gap:24px;margin:0;padding:0;list-style:none}
.indice li{break-inside:avoid;padding-block:7px;border-bottom:1px solid var(--linha);font-size:16px}
.indice a{text-decoration:none;font-weight:600}
.indice a:hover{text-decoration:underline;text-decoration-color:var(--verde);text-underline-offset:3px}
.indice small{color:var(--cinza);font-size:13px}

/* Página Resorts: blocos, resorts por lugar e listas de onde ficar. */
.bloco+.bloco{margin-top:60px}
.bloco>h2{margin-bottom:24px}
.lugar-resorts{margin:34px 0 16px;font-size:clamp(22px,2.4vw,26px)}
.bloco>h2+.lugar-resorts{margin-top:0}
.resort{display:flex;flex-direction:column;gap:8px;min-width:0}
.tambem{color:var(--cinza);font-size:14.5px;line-height:1.5}
.tambem a{color:var(--tinta);font-weight:600;text-decoration-color:var(--verde);text-underline-offset:3px}
.onde-ficar ul{columns:1}
.onde-ficar li{display:flex;flex-direction:column;gap:1px}
.onde-ficar li small{font-size:12.5px}
.onde-ficar a{font-weight:600;line-height:1.35}

/* Quem somos: foto da família ao lado da apresentação e botões. */
.nos-pagina{display:flex;align-items:center;gap:22px;margin-bottom:8px}
.nos-pagina img{flex:none;width:clamp(130px,26vw,210px);aspect-ratio:1;border-radius:50%;object-fit:cover}
.nos-pagina p{font-size:clamp(18px,2vw,21px);line-height:1.5}
.quem-somos .botoes,.erro .botoes{display:flex;flex-wrap:wrap;gap:12px;margin-top:20px}
.botao.claro{background:var(--areia);color:var(--tinta)}
.botao.claro:hover{background:var(--areia-media)}

/* Página de erro (404). */
.erro,.simples{padding-top:clamp(56px,9vw,110px);padding-bottom:clamp(20px,4vw,40px);background:var(--areia-clara)}
.erro small,.simples small{color:var(--verde);font-weight:700;font-size:14px;letter-spacing:.04em;text-transform:uppercase}
.erro h1,.simples h1{margin:8px 0 14px;font-family:var(--destino);font-weight:400;font-size:clamp(36px,5vw,56px);line-height:1.06}
.erro p,.simples p{font-size:18px}
.erro+.artigo{background:var(--areia-clara);padding-bottom:70px}