.elementor-964 .elementor-element.elementor-element-ec3355b{--display:flex;}.elementor-964 .elementor-element.elementor-element-9c8bfad{--display:flex;--margin-top:0px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;--padding-top:160px;--padding-bottom:96px;--padding-left:32px;--padding-right:32px;}.elementor-964 .elementor-element.elementor-element-9c8bfad:not(.elementor-motion-effects-element-type-background), .elementor-964 .elementor-element.elementor-element-9c8bfad > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-color:var( --e-global-color-aba32a1 );}.elementor-964 .elementor-element.elementor-element-c165c3f{--display:flex;}.elementor-964 .elementor-element.elementor-element-c165c3f:not(.elementor-motion-effects-element-type-background), .elementor-964 .elementor-element.elementor-element-c165c3f > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-color:var( --e-global-color-aba32a1 );}.elementor-964 .elementor-element.elementor-element-3d593d4{--display:flex;--flex-direction:row;--container-widget-width:initial;--container-widget-height:100%;--container-widget-flex-grow:1;--container-widget-align-self:stretch;--flex-wrap-mobile:wrap;--gap:96px 96px;--row-gap:96px;--column-gap:96px;--margin-top:0px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;--padding-top:96px;--padding-bottom:96px;--padding-left:32px;--padding-right:32px;}.elementor-964 .elementor-element.elementor-element-3d593d4:not(.elementor-motion-effects-element-type-background), .elementor-964 .elementor-element.elementor-element-3d593d4 > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-color:var( --e-global-color-aba32a1 );}.elementor-964 .elementor-element.elementor-element-00d767c{--display:flex;--gap:0px 0px;--row-gap:0px;--column-gap:0px;}.elementor-964 .elementor-element.elementor-element-1c7f365 > .elementor-widget-container{padding:0px 0px 0px 0px;}.elementor-964 .elementor-element.elementor-element-015d0db > .elementor-widget-container{padding:0px 0px 0px 0px;}.elementor-964 .elementor-element.elementor-element-b83bd36{--display:flex;--justify-content:center;--gap:00px 00px;--row-gap:00px;--column-gap:00px;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-964 .elementor-element.elementor-element-ecf5f01 > .elementor-widget-container{margin:0px 0px 0px 0px;padding:0px 0px 0px 0px;}.elementor-964 .elementor-element.elementor-element-ddceb37{--display:flex;--flex-direction:row;--container-widget-width:initial;--container-widget-height:100%;--container-widget-flex-grow:1;--container-widget-align-self:stretch;--flex-wrap-mobile:wrap;--gap:96px 96px;--row-gap:96px;--column-gap:96px;--margin-top:0px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;--padding-top:96px;--padding-bottom:96px;--padding-left:32px;--padding-right:32px;}.elementor-964 .elementor-element.elementor-element-ddceb37:not(.elementor-motion-effects-element-type-background), .elementor-964 .elementor-element.elementor-element-ddceb37 > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-color:var( --e-global-color-aba32a1 );}.elementor-964 .elementor-element.elementor-element-b581bb9{--display:flex;--gap:00px 00px;--row-gap:00px;--column-gap:00px;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-964 .elementor-element.elementor-element-de1810c > .elementor-widget-container{padding:0px 0px 0px 0px;}.elementor-964 .elementor-element.elementor-element-8113962{--display:flex;--justify-content:center;--gap:0px 0px;--row-gap:0px;--column-gap:0px;}.elementor-964 .elementor-element.elementor-element-5e2f343 > .elementor-widget-container{margin:0px 0px 0px 0px;padding:0px 0px 0px 0px;}.elementor-964 .elementor-element.elementor-element-c715b66 > .elementor-widget-container{margin:0px 0px 0px 0px;padding:0px 0px 0px 0px;}.elementor-964 .elementor-element.elementor-element-d6f7e11{--display:flex;--flex-direction:row;--container-widget-width:initial;--container-widget-height:100%;--container-widget-flex-grow:1;--container-widget-align-self:stretch;--flex-wrap-mobile:wrap;--gap:96px 96px;--row-gap:96px;--column-gap:96px;--margin-top:0px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;--padding-top:96px;--padding-bottom:96px;--padding-left:32px;--padding-right:32px;}.elementor-964 .elementor-element.elementor-element-d6f7e11:not(.elementor-motion-effects-element-type-background), .elementor-964 .elementor-element.elementor-element-d6f7e11 > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-color:var( --e-global-color-aba32a1 );}.elementor-964 .elementor-element.elementor-element-78ffd0c{--display:flex;--gap:00px 00px;--row-gap:00px;--column-gap:00px;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-964 .elementor-element.elementor-element-1229f45 > .elementor-widget-container{padding:0px 0px 0px 0px;}.elementor-964 .elementor-element.elementor-element-3440809{--display:flex;--justify-content:center;--gap:0px 0px;--row-gap:0px;--column-gap:0px;}.elementor-964 .elementor-element.elementor-element-3440809.e-con{--order:-99999 /* order start hack */;}.elementor-964 .elementor-element.elementor-element-4f8ec85 > .elementor-widget-container{margin:0px 0px 0px 0px;padding:0px 0px 0px 0px;}.elementor-964 .elementor-element.elementor-element-7272f64 > .elementor-widget-container{margin:0px 0px 0px 0px;padding:0px 0px 0px 0px;}.elementor-964 .elementor-element.elementor-element-db27ee9{--display:flex;--flex-direction:row;--container-widget-width:initial;--container-widget-height:100%;--container-widget-flex-grow:1;--container-widget-align-self:stretch;--flex-wrap-mobile:wrap;--gap:96px 96px;--row-gap:96px;--column-gap:96px;--margin-top:0px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;--padding-top:96px;--padding-bottom:96px;--padding-left:32px;--padding-right:32px;}.elementor-964 .elementor-element.elementor-element-db27ee9:not(.elementor-motion-effects-element-type-background), .elementor-964 .elementor-element.elementor-element-db27ee9 > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-color:var( --e-global-color-aba32a1 );}.elementor-964 .elementor-element.elementor-element-db86549{--display:flex;--gap:00px 00px;--row-gap:00px;--column-gap:00px;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-964 .elementor-element.elementor-element-4680187 > .elementor-widget-container{padding:0px 0px 0px 0px;}.elementor-964 .elementor-element.elementor-element-1d89a32{--display:flex;--justify-content:center;--gap:0px 0px;--row-gap:0px;--column-gap:0px;}.elementor-964 .elementor-element.elementor-element-9a7a20f > .elementor-widget-container{margin:0px 0px 0px 0px;padding:0px 0px 0px 0px;}.elementor-964 .elementor-element.elementor-element-f4dee04 > .elementor-widget-container{margin:0px 0px 0px 0px;padding:0px 0px 0px 0px;}.elementor-964 .elementor-element.elementor-element-a937560{--display:flex;--flex-direction:row;--container-widget-width:initial;--container-widget-height:100%;--container-widget-flex-grow:1;--container-widget-align-self:stretch;--flex-wrap-mobile:wrap;--gap:96px 96px;--row-gap:96px;--column-gap:96px;--margin-top:0px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;--padding-top:96px;--padding-bottom:96px;--padding-left:32px;--padding-right:32px;}.elementor-964 .elementor-element.elementor-element-a937560:not(.elementor-motion-effects-element-type-background), .elementor-964 .elementor-element.elementor-element-a937560 > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-color:var( --e-global-color-aba32a1 );}.elementor-964 .elementor-element.elementor-element-2bc8a5c{--display:flex;--gap:0px 0px;--row-gap:0px;--column-gap:0px;}.elementor-964 .elementor-element.elementor-element-8a30a22 > .elementor-widget-container{padding:0px 0px 0px 0px;}.elementor-964 .elementor-element.elementor-element-8ad8a48 > .elementor-widget-container{padding:0px 0px 0px 0px;}.elementor-964 .elementor-element.elementor-element-fdf01da{--display:flex;--justify-content:center;--gap:00px 00px;--row-gap:00px;--column-gap:00px;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-964 .elementor-element.elementor-element-b550692 > .elementor-widget-container{margin:0px 0px 0px 0px;padding:0px 0px 0px 0px;}.elementor-964 .elementor-element.elementor-element-6d844ce{--display:flex;--margin-top:0px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;--padding-top:96px;--padding-bottom:96px;--padding-left:32px;--padding-right:32px;}.elementor-964 .elementor-element.elementor-element-6d844ce:not(.elementor-motion-effects-element-type-background), .elementor-964 .elementor-element.elementor-element-6d844ce > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-color:var( --e-global-color-aba32a1 );}.elementor-964 .elementor-element.elementor-element-e34d1ff{--display:flex;--gap:0px 0px;--row-gap:0px;--column-gap:0px;}.elementor-964 .elementor-element.elementor-element-8f24d80{--display:flex;--flex-direction:row;--container-widget-width:initial;--container-widget-height:100%;--container-widget-flex-grow:1;--container-widget-align-self:stretch;--flex-wrap-mobile:wrap;--gap:96px 96px;--row-gap:96px;--column-gap:96px;--margin-top:0px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;--padding-top:96px;--padding-bottom:96px;--padding-left:32px;--padding-right:32px;}.elementor-964 .elementor-element.elementor-element-8f24d80:not(.elementor-motion-effects-element-type-background), .elementor-964 .elementor-element.elementor-element-8f24d80 > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-color:var( --e-global-color-aba32a1 );}.elementor-964 .elementor-element.elementor-element-35d447a{--display:flex;--gap:0px 0px;--row-gap:0px;--column-gap:0px;}.elementor-964 .elementor-element.elementor-element-a55c009 > .elementor-widget-container{padding:0px 0px 0px 0px;}.elementor-964 .elementor-element.elementor-element-a7b4e82 > .elementor-widget-container{padding:0px 0px 0px 0px;}.elementor-964 .elementor-element.elementor-element-afa2e1f{--display:flex;--justify-content:center;--gap:00px 00px;--row-gap:00px;--column-gap:00px;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-964 .elementor-element.elementor-element-196e886 > .elementor-widget-container{margin:0px 0px 0px 0px;padding:0px 0px 0px 0px;}.elementor-964 .elementor-element.elementor-element-40817c9 > .elementor-widget-container{margin:0px 0px 0px 0px;padding:0px 0px 0px 0px;}.elementor-964 .elementor-element.elementor-element-0f97832{--display:flex;}.elementor-964 .elementor-element.elementor-element-0f97832:not(.elementor-motion-effects-element-type-background), .elementor-964 .elementor-element.elementor-element-0f97832 > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-color:var( --e-global-color-d4887a5 );}.elementor-964 .elementor-element.elementor-element-4a6316a{--display:flex;}@media(min-width:768px){.elementor-964 .elementor-element.elementor-element-8113962{--width:54%;}.elementor-964 .elementor-element.elementor-element-3440809{--width:54%;}.elementor-964 .elementor-element.elementor-element-1d89a32{--width:54%;}}@media(max-width:1024px){.elementor-964 .elementor-element.elementor-element-3d593d4{--gap:64px 64px;--row-gap:64px;--column-gap:64px;}.elementor-964 .elementor-element.elementor-element-ddceb37{--gap:64px 64px;--row-gap:64px;--column-gap:64px;}.elementor-964 .elementor-element.elementor-element-d6f7e11{--gap:64px 64px;--row-gap:64px;--column-gap:64px;}.elementor-964 .elementor-element.elementor-element-db27ee9{--gap:64px 64px;--row-gap:64px;--column-gap:64px;}.elementor-964 .elementor-element.elementor-element-a937560{--gap:64px 64px;--row-gap:64px;--column-gap:64px;}.elementor-964 .elementor-element.elementor-element-8f24d80{--gap:64px 64px;--row-gap:64px;--column-gap:64px;}}@media(max-width:767px){.elementor-964 .elementor-element.elementor-element-9c8bfad{--padding-top:64px;--padding-bottom:32px;--padding-left:20px;--padding-right:20px;}.elementor-964 .elementor-element.elementor-element-c165c3f{--margin-top:0px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-964 .elementor-element.elementor-element-3d593d4{--gap:20px 20px;--row-gap:20px;--column-gap:20px;--padding-top:64px;--padding-bottom:64px;--padding-left:20px;--padding-right:20px;}.elementor-964 .elementor-element.elementor-element-00d767c.e-con{--order:-99999 /* order start hack */;}.elementor-964 .elementor-element.elementor-element-b83bd36.e-con{--order:-99999 /* order start hack */;}.elementor-964 .elementor-element.elementor-element-ddceb37{--gap:40px 40px;--row-gap:40px;--column-gap:40px;--padding-top:64px;--padding-bottom:64px;--padding-left:20px;--padding-right:20px;}.elementor-964 .elementor-element.elementor-element-de1810c.elementor-element{--order:99999 /* order end hack */;}.elementor-964 .elementor-element.elementor-element-d6f7e11{--gap:40px 40px;--row-gap:40px;--column-gap:40px;--padding-top:64px;--padding-bottom:64px;--padding-left:20px;--padding-right:20px;}.elementor-964 .elementor-element.elementor-element-78ffd0c.e-con{--order:-99999 /* order start hack */;}.elementor-964 .elementor-element.elementor-element-1229f45.elementor-element{--order:99999 /* order end hack */;}.elementor-964 .elementor-element.elementor-element-db27ee9{--gap:40px 40px;--row-gap:40px;--column-gap:40px;--padding-top:64px;--padding-bottom:64px;--padding-left:20px;--padding-right:20px;}.elementor-964 .elementor-element.elementor-element-4680187.elementor-element{--order:99999 /* order end hack */;}.elementor-964 .elementor-element.elementor-element-a937560{--gap:20px 20px;--row-gap:20px;--column-gap:20px;--padding-top:64px;--padding-bottom:64px;--padding-left:20px;--padding-right:20px;}.elementor-964 .elementor-element.elementor-element-2bc8a5c.e-con{--order:-99999 /* order start hack */;}.elementor-964 .elementor-element.elementor-element-fdf01da.e-con{--order:-99999 /* order start hack */;}.elementor-964 .elementor-element.elementor-element-6d844ce{--padding-top:32px;--padding-bottom:64px;--padding-left:20px;--padding-right:20px;}.elementor-964 .elementor-element.elementor-element-8f24d80{--gap:20px 20px;--row-gap:20px;--column-gap:20px;--padding-top:64px;--padding-bottom:64px;--padding-left:20px;--padding-right:20px;}.elementor-964 .elementor-element.elementor-element-35d447a.e-con{--order:-99999 /* order start hack */;}.elementor-964 .elementor-element.elementor-element-afa2e1f.e-con{--order:-99999 /* order start hack */;}}/* Start custom CSS for html, class: .elementor-element-7a2360c *//* 152 · Spa · hero */

/* HERO DE PÁGINA INTERNA — é o kit que as outras páginas herdam.
   Um pouco mais baixo que o da home (85vh contra 100svh) e sem intro: a pessoa
   já está dentro do site, a abertura teatral é só da porta de entrada.
   NO PAINEL: seção em largura total, sem container, padding 0,
   Estouro: oculto. */
.pg-hero{
  position:relative;
  /* teto em 1400: com valores menores a altura deixava de ser 85vh
     em monitor alto — num 1440 de altura ela saía com 72vh. O teto
     existe só pra tela em pé, onde 85vh viraria uma faixa absurda. */
  height:clamp(520px, 85vh, 1400px);
  overflow:hidden;
  background-color:var(--mg-mata-fundo);
  display:flex;
  align-items:flex-end;
}
@supports (height:1svh){
  /* svh: no celular a barra de endereço some ao rolar e o vh cresce
     no meio do movimento */
  .pg-hero{height:clamp(520px, 85svh, 1400px)}
}

/* -20% em cima e embaixo: é a folga que o parallax usa. Sem ela a
   foto mostraria borda ao deslizar. A conta: a foto fica com 140% da
   altura da moldura, e o deslocamento máximo do JS (13% da altura
   PRÓPRIA dela) dá 18,2% da moldura — dentro dos 20% de folga. */
.pg-hero__bg{
  position:absolute;
  inset:-20% 0;
  background-size:cover;
  background-position:50% 50%;
  background-repeat:no-repeat;
}

/* véu igual ao do hero da home: degradê no topo (leitura do header),
   degradê na base (onde vive o texto) e vinheta fechando os cantos.
   Números copiados do arquivo 22 — se o hero da home mudar, este
   muda junto, na mão, porque são blocos independentes. */
.pg-hero__veu{
  position:absolute;
  inset:0;
  pointer-events:none;
  background:
    linear-gradient(180deg,
      rgba(6,16,10,.6) 0%, rgba(6,16,10,.28) 12%,
      rgba(6,16,10,.08) 22%, rgba(6,16,10,0) 30%),
    linear-gradient(0deg,
      rgba(6,16,10,.9) 0%, rgba(6,16,10,.7) 16%,
      rgba(6,16,10,.4) 34%, rgba(6,16,10,.12) 52%,
      rgba(6,16,10,0) 64%),
    radial-gradient(ellipse 110% 95% at 58% 42%,
      rgba(6,16,10,0) 40%, rgba(6,16,10,.28) 74%, rgba(6,16,10,.55) 100%);
}

.pg-hero__in{
  position:relative;
  z-index:2;
  width:100%;
  padding-bottom:clamp(40px, 5.4vw, 72px);
}
.pg-hero__grade{
  width:100%;
  max-width:calc(var(--mg-grid) + 2 * var(--mg-pad-x));
  margin:0 auto;
  padding:0 var(--mg-pad-x);
  box-sizing:border-box;
}

/* maior que os títulos de seção (29,6px), bem menor que o da home
   (72px a 1440). A hierarquia fica: home 72 · hero interno 51 ·
   seção 29,6. O divisor continua mandando nas telas estreitas. */
.pg-hero__titulo{--d3-max:3.2rem}

@media (max-width:900px){
  .pg-hero{height:clamp(440px, 70vh, 720px)}
  @supports (height:1svh){
    .pg-hero{height:clamp(440px, 70svh, 720px)}
  }
  .pg-hero__titulo{--d3-max:2rem}
}

/* estado antes da animação — segurado pelo script do arquivo 71.
   A foto entra levemente ampliada e assenta em 1: é o zoom de
   entrada, o mesmo gesto do hero da home, só que mais curto. */
html.mg-pg-pending .pg-hero__bg{transform:scale(1.08)}
html.mg-pg-pending .pg-hero .mg-d3-title__line > span{transform:translate3d(0,120%,0)}
html.mg-pg-pending .pg-hero .mg-eyebrow{opacity:0}
body.elementor-editor-active .pg-hero .mg-d3-title__line > span{transform:none !important}
body.elementor-editor-active .pg-hero .mg-eyebrow{opacity:1 !important}
body.elementor-editor-active .pg-hero__bg{transform:none !important}

/* ---------- foto própria pra tela em pé ----------
   No celular a moldura é alta e o cover cortaria as laterais da foto
   larga, sobrando um pedaço sem contexto.
   !important porque a URL do desktop vem no estilo INLINE do arquivo
   151, e inline ganha de classe — só o !important passa na frente. */
@media (max-width:767px){
  .pg-hero__bg{
    background-image:url('https://mangarito.com.br/wp-content/uploads/2026/09/bg-spa-mobile.webp') !important;
    background-position:50% 50%;
  }
}

/* ═══ O DIVISOR PRECISA DE ESCOPO ═══
   Auditoria: os arquivos de headline das seções definem
   `.mg-d3-title{--d3-div}` SEM escopo, então o último carregado
   vencia pra página inteira — inclusive pro hero. Resultado medido:
   a linha longa do hero vazava a 390px, a largura de celular mais
   comum, porque ele acabava usando o divisor de outra seção.

   `.pg-hero .mg-d3-title` tem duas classes e vence qualquer regra de
   uma só, independente da ordem de carregamento.
   "Depois da caverna," 9,05em · "o corpo pede água." 9,23 + 1,15 = 10,38. */
.pg-hero .mg-d3-title{--d3-div:10.9}/* End custom CSS */
/* Start custom CSS for html, class: .elementor-element-e9ee24c *//* 155 · Spa · manifesto */

/* QUARTA cópia idêntica deste componente: home (32), Glamping (77),
   Gastronomia (115) e agora Spa. Passou do ponto de subir pro CSS
   global — hoje um ajuste no manifesto vira quatro edições, e é
   questão de tempo até uma delas ser esquecida.
   Recomendo mover pro arquivo 02 e apagar os quatro. */
.mg-manifesto{
  container-type:inline-size;
  width:100%;
}

.mg-manifesto__p{
  --mf-fs:clamp(1.25rem, calc(100cqw / 42), 1.875rem);
  margin:0 auto;
  max-width:46ch;
  text-align:center;
  font-family:var(--mg-font) !important;
  font-size:var(--mf-fs);
  font-weight:400 !important;
  line-height:1.6;
  letter-spacing:-.015em;
  text-transform:none;
  color:var(--c-head, #2F4F3E);
  text-wrap:pretty;   /* evita linha órfã curta no fim */
  opacity:1;
}

/* as linhas são criadas pelo JS: ele mede onde o texto quebra e
   envolve cada uma, pra poder acender uma a uma no scroll */
.mg-manifesto__line{display:block}
.mg-manifesto__line > span{display:block;opacity:.16}

body.elementor-editor-active .mg-manifesto__line > span{opacity:1 !important}

@media (max-width:767px){
  .mg-manifesto__p{
    --mf-fs:clamp(1.125rem, calc(100cqw / 21), 1.5rem);
    max-width:none;
    line-height:1.62;
  }
}/* End custom CSS */
/* Start custom CSS for html, class: .elementor-element-7098701 *//* 157 · Spa · foto ampla */

/* Mesmo bloco da foto ampla da Gastronomia (arquivo 121), em arquivo
   próprio pra cada página poder ajustar proporção e altura sem mexer
   na outra.
   Mesmo enquadramento do bloco de vídeo do Glamping (arquivo 79): o
   bloco vive na grade e ESTOURA pros dois lados até a margem lateral
   do site — nem preso na grade, nem largura total.
   Quem escreve o --ampla-out é o JS, MEDINDO: 100vw conta a barra de
   rolagem e uma conta fixa não serve em todas as larguras.
   NO PAINEL: seção normal, na grade, com Estouro: oculto. */
.mg-ampla{
  position:relative;
  --ampla-out:0px;
  margin:0 calc(var(--ampla-out) * -1);
}

.mg-ampla__quadro{
  position:relative;
  width:100%;
  aspect-ratio:16/9;
  max-height:82vh;
  overflow:hidden;
  background:var(--mg-mata-fundo);
  /* estado seguro: sem JS o quadro aparece inteiro. Quem anima o
     recorte é o arquivo 110, preso ao scroll. */
  clip-path:inset(0% 0%);
  will-change:clip-path;
}
@supports (height:1svh){ .mg-ampla__quadro{max-height:82svh} }

/* -20% em cima e embaixo: é a folga que o parallax usa. A conta: a
   foto fica com 140% da altura do quadro, e o deslocamento máximo do
   JS (12% da altura PRÓPRIA dela) dá 16,8% do quadro — dentro dos
   20% de folga, sem risco de mostrar borda. */
.mg-ampla__img{
  position:absolute;
  inset:-20% 0;
  background-size:cover;
  background-position:50% 50%;
  background-repeat:no-repeat;
}

/* mesma assinatura das outras fotos do site */
.mg-ampla__quadro::after{
  content:"";
  position:absolute;
  inset:0;
  background:rgba(47,79,62,.10);
  pointer-events:none;
}

@media (max-width:767px){
  .mg-ampla__quadro{aspect-ratio:4/3;max-height:none}
}

body.elementor-editor-active .mg-ampla__quadro{clip-path:none !important}

@media (prefers-reduced-motion:reduce){
  .mg-ampla__quadro{clip-path:none}
}/* End custom CSS */
/* Start custom CSS for html, class: .elementor-element-015d0db *//* 160 · Spa · massagens · headline */


/* Remedido na revisão de setembro: "Cinco massagens e um ritual"
   virou "Quatro massagens e uma terapia".
   9,02em na primeira linha · 6,70 + 1,15 de recuo na segunda.
   Vale a primeira, mais folga. */
.mg-d3-title{--d3-div:9.5}/* End custom CSS */
/* Start custom CSS for html, class: .elementor-element-de1810c *//* 163 · Spa · escalda-pés · foto */

/* 4:5 — o padrão do componente é 3:4. Só a proporção muda aqui;
   moldura, folga do parallax e véu vêm do global. */
.mg-photo{--photo-ar:4/5}

@media (max-width:900px){
  .mg-photo{--photo-ar:3/2}
}/* End custom CSS */
/* Start custom CSS for html, class: .elementor-element-c715b66 *//* 37 · Home · gastronomia · headline */
.mg-d3-title{--d3-div:10.5}/* End custom CSS */
/* Start custom CSS for html, class: .elementor-element-1229f45 *//* 167 · Spa · hidromassagem · foto */

/* 4:5, igual à foto do escalda-pés (arquivo 163) — as duas seções
   são espelhadas e precisam da mesma altura de foto, senão a
   inversão lê como descuido em vez de ritmo. */

/* 4:5 — o padrão do componente é 3:4. Só a proporção muda aqui;
   moldura, folga do parallax e véu vêm do global. */
.mg-photo{--photo-ar:4/5}

@media (max-width:900px){
  .mg-photo{--photo-ar:3/2}
}/* End custom CSS */
/* Start custom CSS for html, class: .elementor-element-7272f64 *//* 37 · Home · gastronomia · headline */
.mg-d3-title{--d3-div:10.5}/* End custom CSS */
/* Start custom CSS for html, class: .elementor-element-4680187 *//* 171 · Spa · sala fitness · foto */

/* 4:5 — o padrão do componente é 3:4. Só a proporção muda aqui;
   moldura, folga do parallax e véu vêm do global. */
.mg-photo{--photo-ar:4/5}

@media (max-width:900px){
  .mg-photo{--photo-ar:3/2}
}/* End custom CSS */
/* Start custom CSS for html, class: .elementor-element-f4dee04 *//* 37 · Home · gastronomia · headline */
.mg-d3-title{--d3-div:10.5}/* End custom CSS */
/* Start custom CSS for html, class: .elementor-element-8ad8a48 *//* 176 · Spa · bom saber · headline */

/* "Antes de descer" 7,76em · "pro spa." 3,83 + 1,15 de recuo = 4,98.
   Vale a maior, 7,76, mais folga.
   Trocou o texto, meça de novo. */
.mg-d3-title{--d3-div:8.3}/* End custom CSS */
/* Start custom CSS for html, class: .elementor-element-fca6732 *//* 179 · Spa · tira de fotos */

/* Faixa de fotos que anda sozinha, vazada dos dois lados até a borda.
   Sem texto, sem link: é ambiente, não catálogo.
   Mesmo componente do Glamping (93) e da Gastronomia (131), em
   arquivo próprio pra cada página poder ajustar largura e velocidade
   sem mexer nas outras.
   Quem escreve o --tira-out é o JS, MEDINDO a distância do bloco até
   a borda — 100vw conta a barra de rolagem e uma conta fixa com 1280
   não serve abaixo dessa largura.
   NO PAINEL: seção normal, na grade, com Estouro: oculto. */
.mg-tira{
  --tira-out:0px;
  margin:0 calc(var(--tira-out) * -1);
}
.mg-tira__faixa{width:100%;overflow:hidden}

/* flex-start é o ponto todo: as fotos têm alturas diferentes e ficam
   COLADAS AO TOPO, com a base irregular. É isso que dá o ar de tira
   de contato em vez de grade. */
.mg-tira__trilho{
  display:flex;
  align-items:flex-start;
  gap:clamp(12px, 1.4vw, 22px);
  width:max-content;
  will-change:transform;
}

/* largura fixa, altura pela proporção de cada foto (--tira-ar no
   HTML). Mesma largura pra todas = alturas diferentes = base solta. */
/* ~4 fotos por tela em qualquer largura: 23vw mais o vão fecha em
   quatro a 1440, 1920 e 2560. A altura vem da proporção de cada foto,
   então largura maior = foto maior nos dois sentidos. */
.mg-tira__item{
  flex:0 0 auto;
  width:clamp(240px, 23vw, 540px);
  margin:0;
  aspect-ratio:var(--tira-ar, 3/2);
  overflow:hidden;
  background:rgba(47,79,62,.06);   /* enquanto a foto carrega */
}
.mg-tira__item > i{
  display:block;
  width:100%;
  height:100%;
  background-size:cover;
  background-position:50% 50%;
  background-repeat:no-repeat;
}

/* mesma assinatura das outras fotos do site */
.mg-tira__item{position:relative}
.mg-tira__item::after{
  content:"";
  position:absolute;
  inset:0;
  background:rgba(28,66,48,.10);
  pointer-events:none;
}

@media (max-width:767px){
  .mg-tira__item{width:clamp(190px, 55vw, 280px)}
  .mg-tira__trilho{gap:10px}
}

@media (prefers-reduced-motion:reduce){
  .mg-tira__trilho{transform:none !important}
}/* End custom CSS */
/* Start custom CSS for html, class: .elementor-element-a7b4e82 *//* 182 · Spa · agendar · headline */

/* "Marque antes" 6,50em · "de chegar." 4,96 + 1,15 de recuo = 6,11.
   Vale a maior, 6,50, mais folga.
   Trocou o texto, meça de novo. */
.mg-d3-title{--d3-div:7.0}/* End custom CSS */
/* Start custom CSS for html, class: .elementor-element-d39b3f4 *//* 186 · Spa · break final */

/* Fechamento da página, mesmo bloco do break final da home (65), do
   Glamping (102) e da Gastronomia (142). Em arquivo próprio pra cada
   página poder trocar a foto e a altura sem mexer nas outras.

   Duas classes no seletor: o .mg-break do CSS global é impresso DEPOIS
   do CSS dos widgets e ganharia de uma classe só.

   NO PAINEL: seção em largura total, sem container, padding 0,
   Estouro: oculto. */
/* 100vh, e o teto em 1600.
   A altura aqui não é só estética: a foto é 3:2 e a moldura é mais
   larga que isso, então o cover corta ALTURA. Quanto mais baixa a
   moldura, mais ela corta. Medido com o zoom de 1,34 junto, numa tela
   de 1440x900: a 90vh sobram 64% da altura da foto, a 100vh sobram
   71%. O teto só existe pra tela em pé, onde 100vh viraria uma faixa
   absurda. */
.mg-photo.mg-break--final{
  height:clamp(560px, 100vh, 1600px);
  clip-path:none;             /* este break NÃO abre: entra em largura cheia */
}
@supports (height:1svh){
  .mg-photo.mg-break--final{height:clamp(560px, 100svh, 1600px)}
}

/* ZOOM 1,34 — é ele que permite o parallax agressivo.
   A foto só desliza até a folga que o zoom dá: metade do excedente
   pra cada lado. A 1,34 sobram 17% de altura de cada lado, e a
   amplitude do parallax é 14 (o teto do JS). Com o zoom padrão de
   1,3 a folga seria 15% e ficaria no limite.
   Custo: 1,34 amplia mais o arquivo. Num monitor de 2560 a moldura
   pede ~3410px de largura a partir de um arquivo de 2560. */
.mg-photo.mg-break--final .mg-photo__img{
  transform:scale(1.34);
  background-position:50% 50%;
}

/* ── véu: o mesmo do hero ──
   Seção de fechamento, responde ao hero: degradê no topo, degradê na
   base, vinheta fechando os cantos, tinta radial e grão em soft-light.
   Números copiados do arquivo 22 — se o hero mudar, este muda junto,
   na mão, porque são blocos independentes. */
.mg-photo.mg-break--final::before{
  content:"";
  position:absolute;
  inset:0;
  pointer-events:none;
  background:
    linear-gradient(180deg,
      rgba(6,16,10,.6) 0%, rgba(6,16,10,.28) 12%,
      rgba(6,16,10,.08) 22%, rgba(6,16,10,0) 30%),
    linear-gradient(0deg,
      rgba(6,16,10,.9) 0%, rgba(6,16,10,.72) 14%,
      rgba(6,16,10,.46) 30%, rgba(6,16,10,.2) 46%,
      rgba(6,16,10,.05) 56%, rgba(6,16,10,0) 62%),
    radial-gradient(ellipse 110% 95% at 58% 42%,
      rgba(6,16,10,0) 40%, rgba(6,16,10,.3) 72%, rgba(6,16,10,.62) 100%),
    radial-gradient(ellipse 100% 90% at 58% 42%,
      rgba(8,19,13,.16) 30%, rgba(8,19,13,.25) 65%, rgba(8,19,13,.34) 100%);
}

/* grão em soft-light — o mesmo ruído do hero */
.mg-photo.mg-break--final::after{
  content:"";
  position:absolute;
  inset:0;
  height:auto;
  opacity:.14;
  mix-blend-mode:soft-light;
  pointer-events:none;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='220' height='220'%3E%3Cfilter id='g' x='0' y='0'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.82' numOctaves='3' stitchTiles='stitch'/%3E%3CfeColorMatrix type='saturate' values='0'/%3E%3CfeComponentTransfer%3E%3CfeFuncR type='linear' slope='1.9' intercept='-.45'/%3E%3CfeFuncG type='linear' slope='1.9' intercept='-.45'/%3E%3CfeFuncB type='linear' slope='1.9' intercept='-.45'/%3E%3C/feComponentTransfer%3E%3C/filter%3E%3Crect width='220' height='220' filter='url(%23g)'/%3E%3C/svg%3E");
  background-size:220px 220px;
}

@media (max-width:767px){
  .mg-photo.mg-break--final{height:90vh;min-height:500px}
  @supports (height:1svh){
    .mg-photo.mg-break--final{height:90svh}
  }
}/* End custom CSS */