/* =========================================================================
   Palaphita — páginas interiores (O Espaço, Experiências…)
   Mesma linguagem da home: fotos em tela cheia, itálico Fraunces, fundo floresta.
   ========================================================================= */

.p-hero{
  position:relative; min-height:100vh; min-height:100svh; display:flex; align-items:flex-end;
  padding:calc(var(--nav-h) + 4vh) 6vw 12vh; overflow:hidden; isolation:isolate;
}
.p-hero > img{
  position:absolute; inset:0; width:100%; height:100%; object-fit:cover; z-index:-2;
}
.p-hero::after{
  content:""; position:absolute; inset:0; z-index:-1; pointer-events:none;
  background:linear-gradient(0deg, rgba(20,28,22,.92) 0%, rgba(20,28,22,.5) 32%, rgba(20,28,22,.08) 62%, rgba(20,28,22,.3) 100%);
}
.p-hero-texto{ max-width:60rem; }
.eyebrow{ display:block; margin-bottom:.9rem; font:500 .72rem/1 var(--mono); letter-spacing:.18em; text-transform:uppercase; color:var(--dourado); }
.p-hero h1{
  margin:0; font:italic 500 clamp(2.8rem,8vw,8rem)/.98 var(--display); letter-spacing:-.025em; padding-right:.1em;
}
.p-hero .frase{ margin:1.2rem 0 0; font:400 clamp(1.05rem,1.4vw,1.4rem)/1.45 var(--texto); max-width:42rem; color:rgba(244,236,224,.92); }

.p-sec{ padding:clamp(4rem,9vw,8rem) 6vw; }
.p-sec.claro{ background:var(--areia); color:var(--terra); }
.p-intro{
  max-width:56rem; margin:0 auto; text-align:center;
  font:italic 500 clamp(1.4rem,2.6vw,2.4rem)/1.3 var(--display); letter-spacing:-.01em; text-wrap:balance;
}

.pilares{ display:grid; grid-template-columns:repeat(3,1fr); gap:clamp(1.5rem,3vw,3rem); max-width:70rem; margin:clamp(2.5rem,5vw,4.5rem) auto 0; }
.pilar{ border-top:1px solid rgba(241,233,220,.25); padding-top:1.2rem; }
.pilar h3{ margin:0 0 .5rem; font:italic 500 1.5rem/1.15 var(--display); color:var(--dourado); }
.pilar p{ margin:0; color:rgba(241,233,220,.82); line-height:1.65; }

/* visualizador de fotos */
.lb{
  position:fixed; inset:0; z-index:200; display:none; align-items:center; justify-content:center;
  background:rgba(14,10,7,.94); padding:3vh 3vw;
}
.lb.on{ display:flex; }
.lb img{ max-width:94vw; max-height:90vh; object-fit:contain; border-radius:14px 4px 14px 4px; }
.lb button{
  position:absolute; background:rgba(241,233,220,.12); color:var(--areia); border:0; cursor:pointer;
  width:46px; height:46px; border-radius:50%; font-size:1.3rem; line-height:1;
}
.lb button:hover{ background:var(--terracota); }
.lb .x{ top:2.2vh; right:2.2vw; } .lb .ant{ left:2vw; top:50%; } .lb .seg{ right:2vw; top:50%; }

/* experiências: um bloco por experiência, foto grande + texto */
.exp{ display:grid; gap:clamp(3rem,7vw,7rem); max-width:78rem; margin:clamp(3rem,6vw,5rem) auto 0; }
.exp-item{ display:grid; grid-template-columns:1.25fr 1fr; gap:clamp(1.5rem,4vw,4rem); align-items:center; }
.exp-item:nth-child(even){ grid-template-columns:1fr 1.25fr; }
.exp-item:nth-child(even) .exp-foto{ order:2; }
.exp-foto{ aspect-ratio:4/3; overflow:hidden; border-radius:34px 8px 34px 8px; }
.exp-foto img{ width:100%; height:100%; object-fit:cover; transition:transform .8s var(--ease-out); }
.exp-item:hover .exp-foto img{ transform:scale(1.04); }
.exp-num{ font:500 .72rem/1 var(--mono); letter-spacing:.18em; color:var(--dourado); }
.exp-item h2{ margin:.7rem 0 .8rem; font:italic 500 clamp(1.8rem,3.4vw,3rem)/1.05 var(--display); letter-spacing:-.015em; }
.exp-item p{ margin:0; max-width:30rem; color:rgba(241,233,220,.86); line-height:1.7; font-size:1.05rem; }
@media (max-width:800px){
  .exp-item, .exp-item:nth-child(even){ grid-template-columns:1fr; }
  .exp-item:nth-child(even) .exp-foto{ order:0; }
}

/* chamada final */
.p-cta{ text-align:center; padding:clamp(4rem,9vw,8rem) 6vw; background:var(--floresta); }
.p-cta h2{ margin:0 0 .8rem; font:italic 500 clamp(2rem,4.6vw,4rem)/1.05 var(--display); letter-spacing:-.02em; }
.p-cta p{ margin:0 auto 1.8rem; max-width:34rem; color:rgba(241,233,220,.86); }
.p-cta .btn{ margin:.25rem; }
.btn.vazio{ background:transparent; box-shadow:0 0 0 1px rgba(241,233,220,.45) inset; }
.btn.vazio:hover{ background:rgba(241,233,220,.14); }

/* entrada suave */
.rev{ opacity:0; transform:translateY(24px); transition:opacity .8s var(--ease-out), transform .8s var(--ease-out); }
.rev.in{ opacity:1; transform:none; }
@media (prefers-reduced-motion:reduce){ .rev{ opacity:1; transform:none; } }

@media (max-width:800px){ .p-hero{ padding-bottom:calc(8vh + 52px); } }

/* ---------- Galeria infinita (canvas arrastável) ---------- */
.galeria{
  position:relative; height:165vh; isolation:isolate;
  background:var(--floresta-2);
}
/* palco preso à tela: garante um trecho de scroll em que só se vê verde e fotos */
.gal-stage{ position:sticky; top:0; height:100vh; overflow:hidden; }
.gal-viewport{
  position:absolute; inset:0; overflow:hidden;
  cursor:grab; touch-action:pan-y;
  -webkit-user-select:none; user-select:none;
}
.gal-viewport.is-dragging{ cursor:grabbing; }
.gal-canvas{ position:absolute; top:0; left:0; will-change:transform; }
.gal-item{
  position:absolute; padding:0; border:none; background:none;
  overflow:hidden; cursor:pointer;
  border-radius:26px 8px 26px 8px / 8px 26px 8px 26px;
  opacity:0; transform:scale(.94);
  transition:opacity .6s var(--ease-out), transform .6s var(--ease-out);
}
.gal-item.in{ opacity:1; transform:scale(1); }
.gal-item img{
  width:100%; height:100%; object-fit:cover; display:block;
  transition:transform .5s var(--ease-out), filter .5s var(--ease-out);
  filter:saturate(.92) brightness(.94);
}
@media (hover:hover) and (pointer:fine){
  .gal-item:hover img{ transform:scale(1.07); filter:saturate(1) brightness(1); }
}
.gal-title{
  position:absolute; top:50%; left:50%; transform:translate(-50%,-50%);
  z-index:3; text-align:center; pointer-events:none; color:var(--areia);
}
.gal-title h2{
  font-family:"Fraunces",serif; font-style:italic; font-weight:500;
  font-size:clamp(3rem,7.5vw,6rem); line-height:1.02; margin:0;
  text-shadow:0 4px 40px rgba(15,10,7,.55);
}
@media (max-width:640px){ .gal-title h2{ font-size:clamp(3.6rem,12vw,5rem); } }
.gal-hint{
  display:inline-block; margin-top:1.4rem;
  font-family:"IBM Plex Mono",monospace; font-size:.72rem; letter-spacing:.16em;
  text-transform:uppercase; opacity:.7;
  text-shadow:0 2px 20px rgba(15,10,7,.6);
}
/* setas de apoio no toque: o arrasto reto pra cima/baixo é cedido de propósito à rolagem
   da página (ver initGaleria), então essas setas cobrem exatamente esse caso — clique e
   segure move o mosaico na direção sem disputar com o scroll. Só existem no mobile: no
   desktop o arrasto de mouse já é livre nas duas direções, sem esse conflito. */
.gal-arrows{ display:none; }
@media (max-width:640px){
  .gal-arrows{
    display:grid; grid-template-columns:repeat(3,42px); grid-template-rows:repeat(3,42px);
    gap:6px; justify-content:center; margin:1.6rem auto 0; pointer-events:auto;
  }
  .gal-arrow{
    grid-column:2; grid-row:2; width:42px; height:42px; padding:0;
    display:flex; align-items:center; justify-content:center;
    background:rgba(241,233,220,.14); border:1px solid rgba(241,233,220,.4);
    border-radius:50%; color:var(--areia); cursor:pointer;
    -webkit-tap-highlight-color:transparent; transition:background .2s var(--ease-out);
  }
  .gal-arrow:active{ background:rgba(241,233,220,.3); }
  .gal-arrow svg{ width:18px; height:18px; }
  .gal-arrow-up{ grid-column:2; grid-row:1; }
  .gal-arrow-left{ grid-column:1; grid-row:2; }
  .gal-arrow-right{ grid-column:3; grid-row:2; }
  .gal-arrow-down{ grid-column:2; grid-row:3; }
}
.gal-lightbox{
  position:fixed; inset:0; z-index:120; display:none;
  align-items:center; justify-content:center; padding:clamp(1rem,4vw,3rem);
  background:rgba(15,10,7,.94); -webkit-backdrop-filter:blur(8px); backdrop-filter:blur(8px);
  opacity:0; transition:opacity .3s var(--ease-out);
}
.gal-lightbox.open{ display:flex; }
.gal-lightbox.visible{ opacity:1; }
.gal-lightbox img{
  max-width:100%; max-height:100%; object-fit:contain; display:block;
  border-radius:22px 8px 22px 8px / 8px 22px 8px 22px;
  transform:scale(.96); transition:transform .35s var(--ease-out);
}
.gal-lightbox.visible img{ transform:scale(1); }
.gal-close{
  position:absolute; top:clamp(1rem,3vw,2rem); right:clamp(1rem,3vw,2rem);
  width:46px; height:46px; border-radius:50%; cursor:pointer;
  border:1px solid rgba(241,233,220,.3); background:rgba(241,233,220,.08);
  color:var(--areia); font-size:1.6rem; line-height:1;
  display:flex; align-items:center; justify-content:center;
  transition:background .25s var(--ease-out);
}
.gal-close:hover{ background:rgba(241,233,220,.2); }

/* experiências: cada uma é uma cena em tela cheia, como na página inicial */
.p-sec-intro{ background:var(--floresta-2); padding-bottom:clamp(5rem,10vw,8rem); }
.word.word-md{ font-size:clamp(2.4rem,6.4vw,6.4rem); }
@media (max-width:800px){ .word.word-md{ white-space:normal; font-size:clamp(2.3rem,11vw,4rem); line-height:1; } }
.scene-text.sem-painel{ grid-template-columns:minmax(0,1fr); grid-template-areas:"word" "phrase"; }