:root { --green:#0e1b11; --cream:#f5e7d4; --muted:#dfd1c0; --video-story-scroll:400vh; --static-session-height:100svh; }
* { box-sizing:border-box; }
html { scroll-behavior:smooth; background:var(--green); }
body { margin:0; background:var(--green); color:var(--cream); font-family:Montserrat,Arial,sans-serif; }
.loader { position:fixed; z-index:20; inset:0; display:grid; place-content:center; justify-items:center; gap:27px; background:var(--green); transition:opacity .7s ease, visibility .7s ease; animation:loader-safety-exit .7s ease 4.5s forwards; }
.loader.is-hidden { opacity:0; visibility:hidden; pointer-events:none; animation:none; }
.loader img { width:290px; max-width:58vw; }
.loader p { margin:0; font-size:12px; letter-spacing:.19em; text-transform:uppercase; color:var(--muted); }
@keyframes loader-safety-exit { to { opacity:0; visibility:hidden; pointer-events:none; } }
.site-header { position:fixed; z-index:10; inset:0 0 auto; height:184px; display:flex; align-items:center; justify-content:center; pointer-events:none; padding:32px 5.35vw; transition:background-color .45s ease; }
.brand { display:block; width:321px; height:77px; pointer-events:auto; }
.brand img { width:100%; display:block; }
.menu-button { --menu-stroke:4px; --menu-offset:12px; position:absolute; right:5.35vw; width:55px; height:43px; display:block; border:0; background:transparent; cursor:pointer; pointer-events:auto; padding:0; }
.menu-button i { position:absolute; top:50%; left:0; width:100%; height:var(--menu-stroke); margin-top:calc(var(--menu-stroke) / -2); border-radius:3px; background:var(--cream); transition:transform .3s ease, opacity .2s ease; }
.menu-button i:nth-child(1) { transform:translateY(calc(var(--menu-offset) * -1)); }
.menu-button i:nth-child(3) { transform:translateY(var(--menu-offset)); }
.menu-button[aria-expanded="true"] i:nth-child(1) { transform:rotate(45deg); }
.menu-button[aria-expanded="true"] i:nth-child(2) { opacity:0; }
.menu-button[aria-expanded="true"] i:nth-child(3) { transform:rotate(-45deg); }
.menu-panel { position:fixed; z-index:9; inset:0; display:flex; flex-direction:column; align-items:center; justify-content:center; gap:18px; background:#0e1b11f2; opacity:0; visibility:hidden; transition:.35s ease; }
.menu-panel.is-open { opacity:1; visibility:visible; }
.menu-panel a { color:var(--cream); font-size:clamp(28px,3vw,48px); text-decoration:none; }
.menu-panel .menu-apply { margin-top:14px; padding:13px 24px; border-radius:0 28px 0 0; background:linear-gradient(105deg,#e2b77f,#f8ead9); color:var(--green); font-size:clamp(17px,1.35vw,22px); font-weight:600; letter-spacing:.12em; text-transform:uppercase; cursor:pointer; }
.story { height:var(--video-story-scroll); position:relative; }
.stage { position:sticky; top:0; height:100vh; min-height:620px; overflow:hidden; isolation:isolate; }
.video-layer, .video-layer video, .mask { position:absolute; inset:0; width:100%; height:100%; }
.video-layer { z-index:-2; background:#172019; }
.video-layer video { object-fit:cover; object-position:center; opacity:0; transition:opacity .65s ease; }
.video-layer video.is-visible { opacity:1; }
.mask { z-index:0; pointer-events:none; background:linear-gradient(90deg, rgba(14,27,17,.96) 0%, rgba(14,27,17,.73) 20%, rgba(14,27,17,.18) 53%, rgba(14,27,17,.04) 70%, rgba(14,27,17,.6) 100%), linear-gradient(0deg, rgba(14,27,17,.84) 0%, transparent 38%, rgba(14,27,17,.38) 100%); }
.content-wrap { position:relative; z-index:1; height:100%; max-width:1920px; margin:auto; padding:0 5.35vw; display:flex; align-items:center; }
.hero-copy { position:absolute; top:50%; transform:translateY(-42%); max-width:640px; opacity:0; translate:0 38px; pointer-events:none; transition:opacity .58s cubic-bezier(.22,1,.36,1), translate .58s cubic-bezier(.22,1,.36,1); }
.hero-copy.is-active { opacity:1; translate:0 0; pointer-events:auto; }
.reveal { opacity:0; translate:0 22px; transition:opacity .62s cubic-bezier(.22,1,.36,1), translate .62s cubic-bezier(.22,1,.36,1); }
.reveal.is-revealed { opacity:1; translate:0 0; }
.eyebrow { display:block; margin:0 0 19px; font-size:16px; font-weight:600; letter-spacing:.47em; color:var(--cream); }
h1,h2 { margin:0; font-family:Montserrat,Arial,sans-serif; font-size:clamp(53px,5.15vw,99px); font-weight:600; letter-spacing:.03em; line-height:.98; }
.hero-copy p { max-width:570px; margin:37px 0 43px; font-size:clamp(19px,1.55vw,30px); letter-spacing:.015em; line-height:1.37; color:var(--muted); }
.cta { display:inline-flex; min-width:275px; min-height:70px; align-items:center; justify-content:center; gap:32px; padding:15px 29px; border-radius:0 36px 0 0; color:#112016; background:linear-gradient(105deg,#e2b77f,#f8ead9); font-size:18px; font-weight:500; letter-spacing:.13em; text-decoration:none; text-transform:uppercase; cursor:pointer; transition:transform .25s ease, box-shadow .25s ease; }
.cta:hover { transform:translateY(-3px); box-shadow:0 10px 28px #0004; }
.cta span { font-size:25px; line-height:0; }
.back-link { position:absolute; right:0; bottom:10px; color:var(--muted); font-size:17px; font-weight:400; letter-spacing:.025em; text-decoration:underline; text-underline-offset:5px; }
.scroll-cue { position:absolute; z-index:1; bottom:36px; left:50%; translate:-50%; display:flex; align-items:center; gap:10px; font-size:10px; letter-spacing:.17em; text-transform:uppercase; color:#f5e7d49c; }
.scroll-cue span { width:25px; height:1px; background:currentColor; }
.scroll-space { height:1px; }
.reservation { min-height:72vh; padding:142px 5.35vw 120px; display:flex; flex-direction:column; align-items:flex-start; justify-content:center; background:#dcae75; color:#102016; }
.final-section { position:relative; z-index:8; min-height:100svh; }
.final-content { display:flex; flex:1; flex-direction:column; align-items:flex-start; justify-content:center; }
.final-footer { width:100%; max-width:1120px; padding-top:36px; }
.final-disclaimer { max-width:1000px; margin:0; color:#1020168a; font-size:10px; line-height:1.42; letter-spacing:.01em; }
.final-signature { margin:15px 0 0; color:var(--green); font-size:13px; font-weight:500; letter-spacing:.015em; }
.final-signature a { color:inherit; text-decoration:underline; text-underline-offset:4px; }
.reservation .eyebrow { color:#102016; }
.reservation h2 { font-size:clamp(52px,6vw,112px); }
.cta-light { margin-top:47px; background:var(--green); color:var(--cream); }
.site-header.is-gold { background:#dcae75; }
.site-header.is-gold .brand { filter:brightness(0) saturate(100%) invert(8%) sepia(31%) saturate(936%) hue-rotate(102deg) brightness(88%) contrast(96%); }
.site-header.is-gold .menu-button i { background:var(--green); }
.site-header.is-garden { background:var(--green); }
.site-header.is-garden .brand { filter:brightness(0) saturate(100%) invert(78%) sepia(30%) saturate(777%) hue-rotate(353deg) brightness(93%) contrast(86%); }
.site-header.is-garden .menu-button i { background:#dcae75; }
.salon-section { position:relative; z-index:3; isolation:isolate; height:var(--static-session-height); min-height:0; margin-top:0; overflow:hidden; display:flex; flex-direction:column; padding:clamp(155px,13.8vh,240px) 5.35vw clamp(35px,4vh,70px); background:#dfad70; color:var(--green); }
.session-salao { margin-top:-100svh; }
.salon-content { position:relative; z-index:1; max-width:910px; opacity:0; translate:0 34px; transition:opacity .8s cubic-bezier(.22,1,.36,1), translate .8s cubic-bezier(.22,1,.36,1); }
.salon-section .eyebrow { color:var(--green); }
.salon-section h2 { font-size:clamp(54px,5.35vw,105px); letter-spacing:-.055em; line-height:.94; }
.salon-section p { max-width:850px; margin:clamp(18px,2vh,35px) 0 0; font-size:clamp(18px,1.65vw,31px); line-height:1.32; letter-spacing:.015em; }
.garden-section, .ceremony-section { margin-top:0; background:var(--green); color:#dcae75; }
.garden-section .eyebrow, .ceremony-section .eyebrow { color:#dcae75; }
.garden-section .organic-shape, .ceremony-section .organic-shape { opacity:.26; background:radial-gradient(circle at 35% 35%, #e8bb81 0, #7d4e2c 35%, transparent 70%); }
.garden-section .cta, .ceremony-section .cta { color:var(--green); background:linear-gradient(105deg,#e2b77f,#f8ead9); }
.garden-section .salon-back, .ceremony-section .salon-back { color:#dcae75; }
#garden { position:sticky; top:0; z-index:2; }
.session-cerimonia { z-index:5; }
.session-aereo { z-index:6; }
.breather-story { position:relative; z-index:4; height:300vh; }
.breather-stage { position:sticky; top:0; height:100svh; display:grid; place-items:center; overflow:hidden; background:var(--green); }
.breather-stage video { display:block; width:min(88vw,1500px); height:min(82svh,850px); object-fit:contain; }
.breather-actions { position:absolute; z-index:1; right:5.35vw; bottom:clamp(55px,7vh,100px); left:5.35vw; display:flex; align-items:end; justify-content:space-between; }
.breather-actions::before { content:""; position:absolute; z-index:-1; right:-8vw; bottom:-7vh; left:-8vw; height:36vh; pointer-events:none; background:linear-gradient(0deg, var(--green) 8%, rgba(14,27,17,.88) 42%, transparent 100%); }
.breather-actions .salon-back { position:static; color:#dcae75; }
.loop-section { position:relative; z-index:7; height:100svh; background:var(--green); }
.loop-stage { position:relative; display:grid; place-items:center; width:100%; height:100%; overflow:hidden; }
.loop-stage video { display:block; width:min(88vw,1500px); height:min(82svh,850px); object-fit:contain; }
.loop-actions { position:absolute; z-index:1; right:5.35vw; bottom:clamp(55px,7vh,100px); left:5.35vw; display:flex; justify-content:flex-start; }
.loop-actions::before { content:""; position:absolute; z-index:-1; right:-8vw; bottom:-7vh; left:-8vw; height:36vh; pointer-events:none; background:linear-gradient(0deg, var(--green) 8%, rgba(14,27,17,.88) 42%, transparent 100%); }
.organic-shape { position:absolute; z-index:-1; width:55vw; aspect-ratio:1; border-radius:50%; filter:blur(58px); opacity:.34; background:radial-gradient(circle at 35% 35%, #ffd79d 0, #ca8241 35%, transparent 70%); animation:drift 14s ease-in-out infinite alternate; }
.shape-one { top:-23vw; right:-17vw; }
.shape-two { bottom:-31vw; left:-22vw; scale:.82; animation-delay:-6s; animation-duration:18s; }
.gallery-wrap { position:relative; z-index:1; margin-top:auto; margin-right:-5.35vw; opacity:0; translate:0 34px; transition:opacity .8s .16s cubic-bezier(.22,1,.36,1), translate .8s .16s cubic-bezier(.22,1,.36,1); }
.gallery-carousel { display:flex; gap:22px; padding:clamp(20px,3vh,45px) 0 0; overflow-x:auto; overscroll-behavior-x:contain; scroll-snap-type:x mandatory; scrollbar-width:none; cursor:grab; user-select:none; }
.gallery-carousel::-webkit-scrollbar { display:none; }
.gallery-carousel.is-dragging { cursor:grabbing; scroll-snap-type:none; }
.gallery-card { flex:0 0 min(35vw,600px); aspect-ratio:1.16; margin:0; padding:0; border:0; background:#bf7a42; box-shadow:0 9px 18px #6e401f28; cursor:inherit; overflow:hidden; scroll-snap-align:start; }
.gallery-card img { width:100%; height:100%; display:block; object-fit:cover; pointer-events:none; transition:transform .6s ease; }
.gallery-card:hover img { transform:scale(1.035); }
.salon-actions { position:relative; z-index:2; display:flex; align-items:end; justify-content:space-between; margin-bottom:28px; padding-top:clamp(22px,3vh,47px); opacity:0; translate:0 20px; transition:opacity .7s .31s cubic-bezier(.22,1,.36,1), translate .7s .31s cubic-bezier(.22,1,.36,1); }
.salon-section.is-revealed .salon-content, .salon-section.is-revealed .gallery-wrap, .salon-section.is-revealed .salon-actions { opacity:1; translate:0 0; }
.gallery-nav { display:none; }
.cta-dark { color:#e9bd84; background:var(--green); }
.salon-back { position:static; color:var(--green); }
.lightbox { position:fixed; z-index:30; inset:0; display:none; align-items:center; background:#0e1b11f5; }
.lightbox.is-open { display:flex; }
.lightbox-close { position:absolute; z-index:1; top:30px; right:5.35vw; width:55px; height:43px; border:0; background:transparent; color:transparent; cursor:pointer; }
.lightbox-close::before, .lightbox-close::after { content:""; position:absolute; top:50%; left:0; width:55px; height:4px; border-radius:3px; background:#dcae75; }
.lightbox-close::before { transform:translateY(-50%) rotate(45deg); }
.lightbox-close::after { transform:translateY(-50%) rotate(-45deg); }
.lightbox-track { display:flex; width:100%; height:100%; overflow-x:auto; scroll-snap-type:x mandatory; scrollbar-width:none; cursor:grab; user-select:none; }
.lightbox-track::-webkit-scrollbar { display:none; }
.lightbox-track.is-dragging { cursor:grabbing; scroll-snap-type:none; }
.lightbox-track figure { flex:0 0 100%; width:100%; height:100%; margin:0; padding:95px 7vw 58px; display:grid; place-items:center; scroll-snap-align:start; }
.lightbox-track img { max-width:100%; max-height:100%; object-fit:contain; box-shadow:0 20px 55px #0007; pointer-events:none; }
body.lightbox-open { overflow:hidden; }
.application-modal { position:fixed; z-index:40; inset:0; display:none; align-items:center; justify-content:center; padding:clamp(16px,4vw,54px); background:#0e1b11ec; }
.application-modal.is-open { display:flex; }
.application-frame { width:min(100%,1100px); height:min(100%,900px); border:0; background:var(--green); box-shadow:0 22px 70px #0008; }
.application-close { position:absolute; z-index:1; top:clamp(18px,3vw,38px); right:clamp(18px,4vw,54px); width:42px; height:42px; padding:0; border:0; background:transparent; color:#dcae75; font:300 43px/1 Arial,sans-serif; cursor:pointer; }
body.application-open { overflow:hidden; }
@keyframes drift { from { transform:translate3d(-4%, -3%, 0) scale(.9); } to { transform:translate3d(7%, 8%, 0) scale(1.12); } }
@media (max-width: 700px), (max-aspect-ratio: 3/4) {
  .site-header { height:16.67vw; padding:7.13vw 8.7vw 0; align-items:flex-start; }
  .brand { width:29.72vw; height:7.13vw; }
  .brand img { height:100%; width:auto; }
  .menu-button { --menu-stroke:max(.28vw, 1px); --menu-offset:.93vw; top:9.44vw; right:9.26vw; width:3.7vw; height:2.78vw; }
  .stage { min-height:660px; }
  /* 110px no artboard de 1080px: o vídeo inicia abaixo do cabeçalho. */
  .video-layer { inset:10.185vw auto auto; width:100vw; height:100vw; overflow:hidden; -webkit-mask-image:linear-gradient(180deg, transparent 0%, #000 17%, #000 61.11%, transparent 100%); mask-image:linear-gradient(180deg, transparent 0%, #000 17%, #000 61.11%, transparent 100%); }
  .video-layer video { object-position:53% center; }
  /* Máscara do preview: verde no cabeçalho, área transparente e retorno
     ao verde a partir de 770px no artboard de 1080px (71.296vw). */
  .mask { background:linear-gradient(180deg, var(--green) 0, rgba(14,27,17,.9) 8.2vw, rgba(14,27,17,.48) 16.2vw, transparent 29.63vw, transparent 71.296vw, rgba(14,27,17,.42) 84vw, var(--green) 100svh); }
  .mask::before { content:""; position:absolute; top:4.8vw; right:-4vw; left:-4vw; height:29vw; background:linear-gradient(180deg, rgba(14,27,17,.72) 0%, rgba(14,27,17,.34) 42%, transparent 100%); filter:blur(1.8vw); opacity:.84; }
  .content-wrap { padding:0 9.26vw; align-items:flex-start; }
  .hero-copy { top:calc(110.185vw + .5vw); left:9.26vw; right:9.26vw; width:auto; transform:none; max-width:none; }
  .eyebrow { margin-bottom:2.41vw; font-size:2.04vw; font-weight:600; letter-spacing:.5em; }
  h1,h2 { font-size:10.37vw; letter-spacing:.03em; line-height:1.02; overflow-wrap:normal; }
  .hero-copy p { max-width:100%; margin:4.35vw 0 5.09vw; font-size:3.7vw; font-weight:400; letter-spacing:.025em; line-height:1.34; }
  .cta { min-width:35.65vw; min-height:10.74vw; padding:1.85vw 3.24vw; border-radius:0 5.37vw 0 0; font-size:3.52vw; font-weight:500; letter-spacing:.08em; text-transform:none; }
  .back-link { right:0; bottom:.28vw; font-size:2.59vw; letter-spacing:.025em; }
  .scroll-cue { display:none; }
  .reservation { min-height:70vh; padding:100px 8.7vw; }
  .final-footer { padding-top:28px; }
  .final-disclaimer { font-size:9px; line-height:1.38; }
  .final-signature { margin-top:13px; font-size:11px; line-height:1.35; }
  .breather-stage video { width:100vw; height:100svh; object-fit:cover; object-position:center; }
  .breather-actions { right:9.26vw; bottom:55px; left:9.26vw; }
  .breather-actions::before { right:-9.26vw; bottom:-55px; left:-9.26vw; height:58svh; }
  .loop-stage video { width:100vw; height:100svh; object-fit:cover; object-position:center; }
  .loop-actions { right:9.26vw; bottom:55px; left:9.26vw; }
  .loop-actions::before { right:-9.26vw; bottom:-55px; left:-9.26vw; height:58svh; }
  .application-modal { padding:0; }
  .application-frame { width:100%; height:100%; }
  .application-close { top:17px; right:18px; }
  .salon-section { min-height:0; height:var(--static-session-height); padding:clamp(85px,14vw,140px) 9.26vw clamp(24px,4vw,42px); }
  .salon-section h2 { font-size:clamp(34px,8.15vw,88px); letter-spacing:-.045em; line-height:.97; }
  .salon-section p { margin-top:clamp(14px,2.4vw,26px); font-size:clamp(14px,3.15vw,34px); line-height:1.28; }
  .salon-section .eyebrow { margin-bottom:clamp(12px,2vw,22px); }
  .gallery-wrap { margin-top:auto; margin-right:-9.26vw; }
  .gallery-carousel { gap:12px; padding:clamp(16px,2.5vh,28px) 0 0; }
  .gallery-card { flex-basis:72vw; aspect-ratio:1.12; }
  .salon-actions { padding-top:clamp(15px,2.3vh,25px); }
  /* O fechamento acompanha a borda direita e fica 25px acima da imagem 16:9. */
  .lightbox-close { top:calc(50% - 6px - 28.51vw); right:5vw; width:4.255vw; height:3.197vw; }
  .lightbox-close::before, .lightbox-close::after { width:4.255vw; height:.322vw; }
  .lightbox-track figure { padding:74px 5vw 36px; }
}

/* Em telas compactas, a escala menor preserva a hierarquia sem quebras excessivas. */
@media (max-width: 420px) {
  .hero-copy h1 { font-size:8.9vw; letter-spacing:.008em; line-height:1.08; }
}

@media (min-width: 701px) {
  /* Escala desktop: 15% menor que a composição-base. */
  .site-header { height:150px; }
  .brand { width:225px; height:54px; }
  .menu-button { --menu-stroke:3px; --menu-offset:9px; width:39px; height:30px; }
  .eyebrow { font-size:14px; }
  h1, h2 { font-size:clamp(45px,4.38vw,84px); }
  .hero-copy p { font-size:clamp(16px,1.32vw,26px); }
  .cta { min-width:234px; min-height:60px; padding:13px 25px; border-radius:0 31px 0 0; font-size:15px; }
  .back-link { font-size:15px; }
  .hero-copy { max-width:850px; }

  /* Sessão estática em duas colunas: narrativa à esquerda e galeria à direita. */
  .salon-section { display:grid; grid-template-columns:minmax(0, .83fr) minmax(0, 1.17fr); grid-template-rows:1fr auto; column-gap:clamp(45px,5vw,100px); align-items:start; padding-top:clamp(135px,13vh,205px); }
  .salon-content { grid-column:1; grid-row:1; align-self:center; }
  .salon-section h2 { font-size:clamp(46px,4.55vw,89px); }
  .salon-section p { font-size:clamp(16px,1.4vw,26px); }
  .gallery-wrap { grid-column:2; grid-row:1 / span 2; align-self:center; width:calc(100% + 5.35vw); margin:0 -5.35vw 0 0; }
  .gallery-carousel { width:100%; height:clamp(310px,55vh,650px); padding:0; }
  .gallery-card { flex-basis:clamp(390px,39vw,680px); height:100%; aspect-ratio:auto; }
  .gallery-nav { display:flex; gap:9px; padding-top:14px; }
  .gallery-nav button { position:relative; width:28px; height:28px; padding:0; border:1.5px solid #0e1b11; border-radius:50%; background:transparent; color:transparent; cursor:pointer; transition:background-color .2s ease; }
  .gallery-nav button::before { content:""; position:absolute; top:50%; left:9px; width:8px; height:8px; border-top:1.5px solid var(--green); border-right:1.5px solid var(--green); transform:translateY(-50%) rotate(45deg); }
  .gallery-nav button[data-gallery-prev]::before { left:11px; transform:translateY(-50%) rotate(-135deg); }
  .gallery-nav button:hover { background:#0e1b1112; }
  .garden-section .gallery-nav button, .ceremony-section .gallery-nav button { border-color:#dcae75; }
  .garden-section .gallery-nav button::before, .ceremony-section .gallery-nav button::before { border-color:#dcae75; }
  .garden-section .gallery-nav button:hover, .ceremony-section .gallery-nav button:hover { background:#dcae751f; }
  .salon-actions { grid-column:1; grid-row:2; align-self:end; margin-bottom:18px; padding-top:20px; }
  .salon-actions .back-link { font-size:15px; }
}
