/* seção espaco · prefixo esp- */
.esp{--esp-vao:clamp(.9rem,1.8vw,1.6rem)}
.esp-foto{margin:0;position:relative}
.esp-quadro{position:relative;overflow:hidden;border-radius:6px;background:var(--b-noite-2)}
.esp-quadro img{width:100%;height:100%;max-width:none;object-fit:cover;filter:saturate(.86) brightness(.9) contrast(1.03)}
/* a noite castanha entra pelas bordas da foto */
.esp-quadro::after{content:"";position:absolute;inset:0;pointer-events:none;background:radial-gradient(120% 95% at 50% 42% in oklab,transparent 52%,rgba(18,10,6,.5) 100%),linear-gradient(180deg in oklab,rgba(92,48,24,.1),rgba(18,10,6,.18));box-shadow:inset 0 0 0 1px rgba(242,235,227,.1);border-radius:inherit}
.esp-foto figcaption{display:flex;gap:.7em;align-items:baseline;margin-top:.7rem;font-size:var(--w-t-mini);line-height:1.4;letter-spacing:.03em;color:var(--b-creme-suave)}
.esp-foto figcaption b{flex:none;font-weight:600;font-variant-numeric:tabular-nums;letter-spacing:.06em;color:var(--b-mel-claro)}

/* gesto: cada foto se abre do centro para fora */
.w-js .esp-foto.w-entra{transform:none}
.w-js .esp-foto.w-entra .esp-quadro{clip-path:circle(0% at 50% 55%);transition:clip-path 1.5s var(--w-curva);transition-delay:calc(var(--i,0)*140ms)}
.w-js .esp-foto.w-entra.w-visto .esp-quadro{clip-path:circle(125% at 50% 55%)}

/* abertura: texto à esquerda, a recepção em arco à direita */
.esp-abertura{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,6fr);grid-template-areas:"cabeca palco" "detalhes palco";column-gap:clamp(2rem,6vw,6rem);row-gap:2.5rem;align-items:start}
.esp-cabeca{grid-area:cabeca;padding-top:clamp(0rem,3vw,3rem)}
.esp-cabeca .w-texto{margin-top:1.6rem}
.esp-palco{grid-area:palco;position:relative;padding-top:clamp(1.5rem,3vw,2.6rem)}
/* luz morna atrás do arco */
.esp-palco::before{content:"";position:absolute;z-index:-2;left:50%;top:40%;width:150%;aspect-ratio:1;transform:translate(-50%,-50%);border-radius:50%;background:radial-gradient(closest-side in oklab,rgba(205,125,54,.26),rgba(92,48,24,.16) 55%,transparent);pointer-events:none}
/* o endereço escrito sobre o arco, como as frases do tronco */
.esp-arco{position:absolute;left:-6%;top:calc(clamp(1.5rem,3vw,2.6rem) - 6%*0);width:112%;max-width:none;overflow:visible;pointer-events:none;transform:translateY(-10%)}
.esp-arco text{font-family:var(--b-sans);font-size:25px;font-weight:500;letter-spacing:.2em;text-transform:uppercase;fill:var(--b-mel-claro)}
.w-js .esp-arco{opacity:0;transition:opacity 1.2s ease .7s}
.w-js .esp-palco:has(.w-visto) .esp-arco{opacity:1}
.esp-foto--sofa .esp-quadro{aspect-ratio:1/1.12;border-radius:999px 999px 6px 6px}
.esp-foto--sofa img{object-position:42% 50%}
.esp-foto--sofa figcaption{justify-content:center}
.esp-aneis{position:absolute;z-index:-1;left:50%;top:44%;width:190%;max-width:none;transform:translate(-50%,-50%);pointer-events:none;overflow:visible}
.esp-aneis path{fill:none;stroke:var(--b-mel-claro);stroke-width:1;vector-effect:non-scaling-stroke;opacity:calc(.5 - var(--n)*.034)}
.w-js .esp-aneis path{transform-box:fill-box;transform-origin:center;transform:scale(.82);opacity:0;transition:transform 1.6s var(--w-curva),opacity 1.6s ease;transition-delay:calc(var(--n)*70ms)}
.w-js .esp-palco:has(.w-visto) .esp-aneis path{transform:none;opacity:calc(.5 - var(--n)*.034)}
.esp-detalhes{grid-area:detalhes;display:grid;grid-template-columns:minmax(0,1.15fr) minmax(0,1fr);gap:var(--esp-vao);align-items:end;align-self:end}
.esp-foto--orquidea .esp-quadro{aspect-ratio:3/4}
.esp-foto--madeira .esp-quadro{aspect-ratio:1;border-radius:50%}
.esp-foto--madeira .esp-quadro::after{background:radial-gradient(circle at 50% 50%,transparent 55%,rgba(18,10,6,.45) 100%)}
.esp-foto--madeira figcaption{display:block;text-align:center}
.esp-foto--madeira figcaption b{margin-right:.6em}
.esp-foto--madeira .esp-quadro{box-shadow:0 0 0 1px rgba(227,167,99,.5),0 0 0 9px rgba(227,167,99,.1),0 0 0 10px rgba(227,167,99,.28),0 0 0 20px rgba(227,167,99,.05),0 0 0 21px rgba(227,167,99,.16)}
.esp-foto--madeira{padding:21px}

/* a fita de janelas atravessa a página */
.esp-foto--janelas{margin:clamp(3rem,7vw,6.5rem) calc(50% - 50vw) 0}
.esp-foto--janelas .esp-quadro{aspect-ratio:4.6/1;border-radius:0;background:none;-webkit-mask-image:linear-gradient(90deg,transparent,#000 14%,#000 86%,transparent);mask-image:linear-gradient(90deg,transparent,#000 14%,#000 86%,transparent)}
.esp-foto--janelas .esp-quadro img{filter:saturate(.8) sepia(.28) brightness(.74) contrast(1.16)}
.esp-foto--janelas .esp-quadro::after{background:linear-gradient(180deg in oklab,rgba(18,10,6,.55),transparent 22%,transparent 74%,rgba(18,10,6,.6));box-shadow:none}
.esp-foto--janelas img{object-position:50% 46%}
.esp-foto--janelas figcaption{width:min(100% - 2*var(--b-margem),var(--w-largura));margin-inline:auto;justify-content:center}
.w-js .esp-foto--janelas.w-entra .esp-quadro{clip-path:inset(0 50% 0 50%)}
.w-js .esp-foto--janelas.w-entra.w-visto .esp-quadro{clip-path:inset(0 0 0 0)}

/* fecho: a recepção e a sala */
.esp-fecho{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);column-gap:clamp(2rem,6vw,6rem);margin-top:clamp(3rem,7vw,6.5rem);align-items:start}
.esp-foto--balcao .esp-quadro{aspect-ratio:5/4}
.esp-cita{margin-top:2.2rem}
.esp-cita blockquote{font-size:clamp(1.35rem,1.1rem + 1vw,1.9rem);line-height:1.25;color:var(--b-creme)}
.esp-sala{padding-top:clamp(0rem,6vw,5rem)}
.esp-foto--mesa .esp-quadro{aspect-ratio:3/2}
.esp-lista{list-style:none;margin:clamp(3rem,6vw,5rem) 0 0;padding:0;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));border-top:1px solid var(--w-linha-noite);color:var(--b-creme)}
.esp-lista li{padding:1.4rem 1.6rem 0 0;font-family:var(--b-serif);font-size:var(--w-t-sub);line-height:1.25}
.esp-lista li+li{padding-left:1.6rem;border-left:1px solid var(--w-linha-noite)}
.esp-lista span{display:block;margin-bottom:.7rem;font-family:var(--b-sans);font-size:var(--w-t-mini);letter-spacing:.14em;text-transform:uppercase;color:var(--b-mel-claro)}

@media (min-width:861px) and (max-width:1240px){
  .esp-arco text{font-size:33px;letter-spacing:.16em}
}
@media (max-width:860px){
  .esp-abertura{grid-template-columns:minmax(0,1fr);grid-template-areas:"cabeca" "palco" "detalhes";row-gap:2.2rem}
  .esp-aneis{width:230%}
  .esp-foto--janelas .esp-quadro{aspect-ratio:2.2/1}
  .esp-fecho{grid-template-columns:minmax(0,1fr)}
  .esp-sala{padding-top:3rem}
  .esp-arco text{font-size:44px;letter-spacing:.12em}
  .esp-foto--balcao{width:86%;margin-left:auto}
  .esp-foto--mesa{width:92%}
  .esp-cita{margin-top:2.6rem}
  .esp-lista{grid-template-columns:minmax(0,1fr);border-top:0}
  .esp-lista li,.esp-lista li+li{padding:1.1rem 0;border-left:0;border-top:1px solid var(--w-linha-noite)}
  .esp-lista span{margin-bottom:.35rem}
}
@media (prefers-reduced-motion:reduce){
  .w-js .esp-foto.w-entra .esp-quadro{clip-path:none!important}
  .w-js .esp-aneis path{transform:none;opacity:calc(.5 - var(--n)*.034)}
  .w-js .esp-arco{opacity:1}
}
