/* Recanto Sabor de Mel — noite tropical, mel e água.
   Conceito: o círculo da piscina é o gesto do site (abertura, hero, botões, calendário). */
:root{
  --noite:#050e17; --noite2:#08192a; --surf:#0d2238; --surf2:#12304d;
  --fg:#eef6ff; --muted:#a3b9cf; --line:rgba(160,200,240,.16);
  --pool:#22bfff; --pool2:#2f6bff; --honey:#ffb42a; --honey2:#ff8a1f; --ink:#2a1700;
  --busy:#52667a; --leaf:#3ddc97;
  --display:'Bricolage Grotesque','Trebuchet MS',system-ui,sans-serif;
  --body:'Figtree','Segoe UI',system-ui,sans-serif;
  --ease:cubic-bezier(.2,.8,.2,1);
  --pad:clamp(18px,4vw,56px);
  color-scheme:dark;
}
*{box-sizing:border-box}
html{scroll-padding-top:84px}
html.lenis,html.lenis body{height:auto}
.lenis.lenis-smooth{scroll-behavior:auto!important}
.lenis.lenis-stopped{overflow:hidden}
body{margin:0;background:var(--noite);color:var(--fg);font-family:var(--body);font-size:17px;line-height:1.6;overflow-x:hidden;-webkit-font-smoothing:antialiased}
img,video{display:block;max-width:100%}
a{color:inherit}
h1,h2,h3{font-family:var(--display);margin:0;line-height:1.02;letter-spacing:-.025em;text-wrap:balance}
p{margin:0}
ul{margin:0;padding:0;list-style:none}
.wrap{max-width:1240px;margin:0 auto;padding-inline:var(--pad)}
section{position:relative}
:focus-visible{outline:3px solid var(--pool);outline-offset:3px}

/* grain: tira o aspecto liso das fotos ampliadas */
.grain{position:fixed;inset:0;z-index:90;pointer-events:none;opacity:.045;background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='160' height='160'><filter id='n'><feTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='2' stitchTiles='stitch'/></filter><rect width='100%' height='100%' filter='url(%23n)'/></svg>")}

/* cursor */
.cursor{position:fixed;left:0;top:0;width:34px;height:34px;margin:-17px 0 0 -17px;border-radius:50%;border:1.5px solid var(--honey);z-index:95;pointer-events:none;opacity:0;
  transition:width .3s var(--ease),height .3s var(--ease),margin .3s var(--ease),background .3s,opacity .3s}
.cursor.on{opacity:1}
.cursor.big{width:70px;height:70px;margin:-35px 0 0 -35px;background:rgba(255,180,42,.14)}
@media (hover:none),(pointer:coarse){.cursor{display:none}}

/* abertura */
.intro{position:fixed;inset:0;z-index:200;background:var(--noite);display:grid;place-items:center;overflow:hidden}
.intro .drop{position:absolute;left:50%;top:50%;width:20px;height:20px;margin:-10px;border-radius:50%;border:2px solid var(--pool);opacity:0}
.intro .d2{border-color:var(--honey)}
.intro-name{position:relative;font-family:var(--display);font-weight:800;font-size:clamp(2rem,7vw,5rem);line-height:.95;text-align:center;letter-spacing:-.03em;opacity:0}
.js-done .intro{display:none}

/* header */
.top{position:fixed;inset:0 0 auto;z-index:60;display:flex;align-items:center;justify-content:space-between;gap:16px;padding:14px var(--pad);
  transition:background .4s,backdrop-filter .4s,transform .5s var(--ease)}
.top.solid{background:rgba(5,14,23,.9);border-bottom:1px solid var(--line)}
.top.hide{transform:translateY(-100%)}
.brand{display:flex;align-items:center;gap:10px;text-decoration:none;font-family:var(--display);font-weight:800;font-size:1.1rem;letter-spacing:-.01em}
.brand i{width:30px;height:30px;border-radius:50%;background:radial-gradient(circle at 35% 30%,#ffe29a,var(--honey) 45%,var(--honey2));box-shadow:0 0 22px rgba(255,170,40,.6);display:grid;place-items:center}
.brand i::after{content:"";width:12px;height:12px;border-radius:50%;border:2px solid var(--ink);opacity:.55}
.links{display:flex;gap:28px;font-weight:600;font-size:.95rem}
.links a{text-decoration:none;color:var(--muted);transition:color .2s}
.links a:hover{color:var(--fg)}
@media(max-width:900px){.links{display:none}}
@media(max-width:420px){.brand span{display:none}}

/* botões */
.btn{--h:54px;position:relative;display:inline-flex;align-items:center;justify-content:center;gap:10px;min-height:var(--h);padding:0 28px;border-radius:999px;border:0;cursor:pointer;
  font:700 1rem var(--body);text-decoration:none;overflow:hidden;isolation:isolate;transition:box-shadow .3s,background .3s,color .3s,border-color .3s;will-change:transform}
.btn.sm{--h:42px;padding:0 20px;font-size:.92rem}
.btn.honey{background:linear-gradient(120deg,var(--honey),var(--honey2));color:var(--ink);box-shadow:0 12px 34px -8px rgba(255,140,30,.65)}
.btn.honey::after{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(120deg,#ffd27a,var(--honey));opacity:0;transition:opacity .3s}
.btn.honey:hover::after{opacity:1}
.btn.ghost{background:rgba(255,255,255,.06);color:var(--fg);border:1px solid var(--line);backdrop-filter:blur(8px)}
.btn.ghost:hover{background:rgba(255,255,255,.14);border-color:rgba(255,255,255,.35)}
.btn.soft{background:var(--surf2);color:var(--fg);border:1px solid var(--line)}
.btn.soft:hover{background:#18406a}
.btn[aria-disabled="true"]{opacity:.45;pointer-events:none;box-shadow:none}

/* texto dividido em linhas */
.split .w{display:inline-block;overflow:hidden;vertical-align:top;padding-bottom:.12em;margin-bottom:-.12em}
.split .w>span{display:inline-block;will-change:transform}

/* HERO */
.hero{height:100vh;height:100svh}
.pin{position:relative;height:100%;overflow:hidden;background:var(--noite)}
.layer{position:absolute;inset:0}
.layer img{width:100%;height:100%;object-fit:cover}
.night img{transform:scale(1.12);transform-origin:50% 55%}
.day{clip-path:circle(0px at 50% 62%);will-change:clip-path}
.day img{transform:scale(1.08)}
.shade{position:absolute;inset:0;background:
  linear-gradient(180deg,rgba(5,14,23,.55) 0%,rgba(5,14,23,0) 30%,rgba(5,14,23,.15) 55%,rgba(5,14,23,.88) 100%),
  radial-gradient(90% 60% at 20% 90%,rgba(5,14,23,.7),transparent 70%);pointer-events:none}
.ring{position:absolute;left:50%;top:62%;width:0;height:0;border-radius:50%;border:2px solid rgba(255,200,100,.85);transform:translate(-50%,-50%);pointer-events:none}
.copy{position:absolute;left:var(--pad);right:var(--pad);bottom:clamp(64px,11vh,120px);max-width:760px}
.copy .kicker{font-weight:600;font-size:1rem;color:var(--honey);margin-bottom:18px}
.copy h1{font-weight:800;font-size:clamp(2.5rem,7.4vw,6.4rem);line-height:.96}
.copy .lead{margin-top:22px;max-width:52ch;font-size:clamp(1rem,1.5vw,1.2rem);color:#d4e6f7}
.ctas{display:flex;flex-wrap:wrap;gap:12px;margin-top:30px}
.c2{bottom:auto;top:50%;transform:translateY(-50%);opacity:0;max-width:none;text-align:center;left:0;right:0}
.c2 h2{font-weight:800;font-size:clamp(2rem,5.6vw,4.8rem);text-shadow:0 4px 40px rgba(0,0,0,.6)}
.hint{position:absolute;left:50%;bottom:22px;transform:translateX(-50%);display:flex;flex-direction:column;align-items:center;gap:8px;font-size:.78rem;color:var(--muted);letter-spacing:.08em}
.hint span{width:1.5px;height:34px;background:linear-gradient(var(--honey),transparent);animation:drip 1.8s ease-in-out infinite;transform-origin:top}
@keyframes drip{0%{transform:scaleY(0)}50%{transform:scaleY(1)}100%{transform:scaleY(1);opacity:0}}

/* faixa */
.marquee{overflow:hidden;border-block:1px solid var(--line);background:var(--noite2);padding:20px 0;transform:skewY(-1.2deg);margin:-14px 0 40px;position:relative;z-index:2}
.track{display:flex;align-items:center;gap:34px;width:max-content;font-family:var(--display);font-weight:700;font-size:clamp(1.4rem,3vw,2.4rem);white-space:nowrap;will-change:transform}
.track i{width:12px;height:12px;border-radius:50%;background:var(--honey);flex:none}

/* frase */
.statement{padding-block:clamp(60px,12vw,150px)}
.statement p{font-family:var(--display);font-weight:700;font-size:clamp(1.8rem,4.6vw,4rem);line-height:1.12;letter-spacing:-.025em;max-width:22ch;max-width:24em}
.statement .t{color:rgba(238,246,255,.18);transition:none}

/* ESPAÇO horizontal */
.space{background:var(--noite)}
.space-pin{height:100vh;height:100svh;display:flex;flex-direction:column;justify-content:center;gap:clamp(18px,3vh,34px);overflow:hidden}
.space-head{padding-inline:var(--pad);display:flex;align-items:flex-end;justify-content:space-between;gap:20px}
.space-head h2{font-weight:800;font-size:clamp(2rem,4.6vw,4rem)}
.space-head p{color:var(--muted);font-size:.95rem;padding-bottom:8px}
.space-track{display:flex;gap:clamp(14px,2vw,26px);padding-inline:var(--pad);width:max-content;will-change:transform}
.panel{position:relative;margin:0;height:clamp(300px,58vh,640px);border-radius:26px;overflow:hidden;background:var(--surf);flex:none}
.p-wide{aspect-ratio:4/3}
.p-sq{aspect-ratio:1/1}
.panel img{width:100%;height:100%;object-fit:cover;transition:transform 1.2s var(--ease)}
.panel:hover img{transform:scale(1.05)}
.panel figcaption{position:absolute;inset:auto 0 0 0;padding:60px 22px 20px;display:flex;flex-direction:column;gap:2px;background:linear-gradient(transparent,rgba(5,14,23,.88))}
.panel figcaption b{font-family:var(--display);font-size:1.25rem}
.panel figcaption span{color:#c5d9ec;font-size:.92rem}
.space-bar{margin-inline:var(--pad);height:3px;background:var(--line);border-radius:3px;overflow:hidden}
.space-bar i{display:block;height:100%;width:100%;background:linear-gradient(90deg,var(--pool),var(--honey));transform:scaleX(0);transform-origin:left}
@media(max-width:720px){
  .space-pin{height:auto;padding-block:50px;overflow:visible}
  .space-track{width:auto;overflow-x:auto;scroll-snap-type:x mandatory;padding-bottom:10px;scrollbar-width:none}
  .space-track::-webkit-scrollbar{display:none}
  .panel{height:60vh;scroll-snap-align:center}
  .space-bar{display:none}
  .space-head{flex-direction:column;align-items:flex-start}
}

/* números */
.stats{display:grid;grid-template-columns:repeat(4,1fr);gap:20px;padding-block:clamp(70px,10vw,130px)}
.stats div{border-top:1px solid var(--line);padding-top:18px}
.stats b{display:block;font-family:var(--display);font-weight:800;font-size:clamp(3rem,7vw,6rem);line-height:1;background:linear-gradient(120deg,var(--honey),var(--honey2) 55%,var(--pool));-webkit-background-clip:text;background-clip:text;color:transparent}
.stats small{font-size:.35em;margin-left:6px;font-weight:700}
.stats span{display:block;margin-top:8px;color:var(--muted);max-width:18ch}
@media(max-width:760px){.stats{grid-template-columns:1fr 1fr}}

/* casamentos */
.wedding{display:grid;grid-template-columns:1fr 1.05fr;gap:clamp(30px,6vw,90px);padding-block:clamp(40px,8vw,110px);align-items:start}
.w-copy{position:sticky;top:110px}
.w-copy h2{font-weight:800;font-size:clamp(2rem,4.4vw,3.8rem)}
.w-copy>p{margin-top:22px;color:#cfe0f0;max-width:46ch}
.ticks{margin:26px 0 32px;display:grid;gap:12px}
.ticks li{position:relative;padding-left:32px}
.ticks li::before{content:"";position:absolute;left:0;top:.55em;width:14px;height:14px;border-radius:50%;background:radial-gradient(circle at 35% 30%,#ffe29a,var(--honey));box-shadow:0 0 14px rgba(255,170,40,.6)}
.w-imgs{display:grid;gap:clamp(14px,2vw,26px)}
.reveal{margin:0;border-radius:26px;overflow:hidden;background:var(--surf);clip-path:inset(0 0 0 0 round 26px)}
.reveal img{width:100%;height:auto;aspect-ratio:1/1;object-fit:cover;will-change:transform}
.reveal:nth-child(2) img{aspect-ratio:4/5}
@media(max-width:860px){.wedding{grid-template-columns:1fr}.w-copy{position:static}}

/* valores */
.prices{padding-block:clamp(50px,9vw,120px)}
.sec-h{max-width:820px;margin-bottom:clamp(28px,4vw,54px)}
.sec-h h2{font-weight:800;font-size:clamp(2rem,4.6vw,4rem)}
.sec-h p{margin-top:16px;color:var(--muted);max-width:56ch}
.cards{display:grid;grid-template-columns:1fr 1fr;gap:clamp(14px,2vw,26px)}
.price{position:relative;display:flex;flex-direction:column;gap:20px;padding:clamp(24px,3vw,40px);border-radius:28px;background:linear-gradient(160deg,var(--surf),var(--noite2));border:1px solid var(--line)}
.price.hot{background:linear-gradient(160deg,#16395c,#0b2038);border-color:rgba(255,180,42,.5);box-shadow:0 30px 80px -30px rgba(255,150,30,.35)}
.price h3{font-size:1.5rem;font-weight:800}
.flag{position:absolute;top:22px;right:22px;padding:6px 14px;border-radius:999px;background:linear-gradient(120deg,var(--honey),var(--honey2));color:var(--ink);font-weight:700;font-size:.85rem}
.amt{display:flex;align-items:baseline;gap:8px;font-family:var(--display)}
.amt span{font-size:1.6rem;font-weight:700;color:var(--honey)}
.amt b{font-size:clamp(3.4rem,6vw,5rem);line-height:1;font-weight:800;letter-spacing:-.04em}
.amt small{font-family:var(--body);color:var(--muted);font-size:1rem}
.price ul{display:grid;gap:10px;color:#d3e4f4;flex:1}
.price li{padding-left:26px;position:relative}
.price li::before{content:"";position:absolute;left:2px;top:.62em;width:9px;height:9px;border-radius:50%;background:var(--pool)}
.pay{margin-top:26px;padding:20px 24px;border-radius:18px;border:1px dashed var(--line);color:#cfe0f0}
.pay b{color:var(--honey)}
@media(max-width:820px){.cards{grid-template-columns:1fr}}

/* suítes */
.suites{display:grid;grid-template-columns:.8fr 1.2fr;gap:clamp(30px,6vw,90px);align-items:center;padding-block:clamp(50px,9vw,120px)}
.phone{position:relative;width:min(100%,340px);margin-inline:auto;aspect-ratio:9/16;border-radius:42px;padding:10px;background:linear-gradient(160deg,#1c3a5a,#0a1b2d);box-shadow:0 40px 100px -30px rgba(34,191,255,.45),inset 0 0 0 1.5px rgba(255,255,255,.12)}
.phone video{width:100%;height:100%;object-fit:cover;border-radius:33px;background:#000}
.notch{position:absolute;top:18px;left:50%;transform:translateX(-50%);width:84px;height:22px;border-radius:12px;background:#050e17;z-index:2}
.play{position:absolute;left:50%;top:50%;width:76px;height:76px;margin:-38px;border-radius:50%;border:0;cursor:pointer;background:linear-gradient(120deg,var(--honey),var(--honey2));display:grid;place-items:center;box-shadow:0 14px 40px rgba(255,140,30,.6);transition:transform .3s var(--ease),opacity .3s}
.play svg{width:30px;height:30px;fill:var(--ink);margin-left:4px}
.play:hover{transform:scale(1.08)}
.phone.playing .play{opacity:0;pointer-events:none}
.s-copy h2{font-weight:800;font-size:clamp(2rem,4.4vw,3.8rem)}
.s-copy>p{margin-top:20px;color:#cfe0f0;max-width:48ch}
.serra{width:100%;max-width:520px;border-radius:24px;aspect-ratio:16/10;object-fit:cover}
@media(max-width:860px){.suites{grid-template-columns:1fr}}

/* reserva */
.book{padding-block:clamp(50px,9vw,120px)}
.grid{display:grid;grid-template-columns:1.1fr .9fr;gap:clamp(14px,2vw,26px);align-items:start}
.card{padding:clamp(20px,2.6vw,34px);border-radius:28px;background:linear-gradient(160deg,var(--surf),var(--noite2));border:1px solid var(--line)}
.cal-h{display:flex;align-items:center;justify-content:space-between;margin-bottom:18px}
.cal-h h3{font-size:1.35rem;font-weight:800}
.icon-btn{width:44px;height:44px;border-radius:50%;border:1px solid var(--line);background:var(--surf2);color:var(--fg);font-size:1.5rem;line-height:1;cursor:pointer;transition:background .2s,transform .2s}
.icon-btn:hover{background:#18406a;transform:scale(1.06)}
.dow,.days{display:grid;grid-template-columns:repeat(7,1fr);gap:6px}
.dow{margin-bottom:8px;text-align:center;font-size:.8rem;color:var(--muted);font-weight:600}
.cell{aspect-ratio:1/1;border-radius:50%;border:1px solid transparent;background:transparent;color:var(--fg);font:600 .98rem var(--body);cursor:pointer;display:grid;place-items:center;position:relative;transition:background .2s,transform .25s var(--ease),border-color .2s}
.cell:hover:not(:disabled){background:var(--surf2);transform:scale(1.1);border-color:var(--pool)}
.cell.today{border-color:var(--pool)}
.cell.busy,.cell:disabled{color:var(--busy);cursor:not-allowed;text-decoration:line-through}
.cell.past{opacity:.28}
.cell.sel{background:linear-gradient(120deg,var(--honey),var(--honey2));color:var(--ink);border-color:transparent;box-shadow:0 8px 24px -6px rgba(255,140,30,.7)}
.cell.in{background:rgba(255,180,42,.2);border-radius:12px}
.cell.empty{pointer-events:none}
.legend{display:flex;flex-wrap:wrap;gap:16px;margin:18px 0;font-size:.85rem;color:var(--muted)}
.legend span{display:flex;align-items:center;gap:7px}
.legend i{width:14px;height:14px;border-radius:50%;border:1px solid var(--line)}
.legend i.s{background:var(--honey);border-color:transparent}
.legend i.b{background:var(--busy);border-color:transparent}
.sum{padding:18px 20px;border-radius:18px;background:var(--noite);border:1px solid var(--line);margin-bottom:20px}
.sum small{display:block;color:var(--muted);font-size:.85rem}
.sum strong{display:block;font-family:var(--display);font-size:1.6rem;line-height:1.15;margin-top:2px}
.sum em{display:block;margin-top:6px;font-style:normal;color:#cfe0f0;font-size:.95rem}
form{display:grid;gap:14px}
label{display:grid;gap:6px;font-weight:600;font-size:.9rem;color:var(--muted)}
input,select{width:100%;min-height:50px;padding:0 16px;border-radius:14px;border:1px solid var(--line);background:var(--noite);color:var(--fg);font:500 1rem var(--body)}
input::placeholder{color:#6f86a0}
.row2{display:grid;grid-template-columns:1.4fr 1fr;gap:12px}
.fine{font-size:.85rem;color:var(--muted)}
.phone-num{display:flex;align-items:center;gap:12px;flex-wrap:wrap;padding-top:14px;border-top:1px solid var(--line)}
.phone-num span{color:var(--muted);font-size:.9rem}
.phone-num b{font-family:var(--display);font-size:1.15rem}
.copybtn{margin-left:auto;min-height:38px;padding:0 16px;border-radius:999px;border:1px solid var(--line);background:var(--surf2);color:var(--fg);font:600 .9rem var(--body);cursor:pointer}
@media(max-width:900px){.grid{grid-template-columns:1fr}}

/* onde */
.where{display:grid;grid-template-columns:1fr 1fr;gap:clamp(30px,6vw,90px);align-items:center;padding-block:clamp(50px,9vw,120px)}
.where h2{font-weight:800;font-size:clamp(2rem,4.2vw,3.6rem)}
.where p{margin-top:16px;color:#cfe0f0;max-width:44ch}
address{margin:22px 0;font-style:normal;font-weight:600;color:var(--fg)}
.pet{display:flex;align-items:center;gap:16px;margin:0 0 26px}
.pet img{width:84px;height:84px;border-radius:50%;object-fit:cover;flex:none}
.pet p{margin:0;max-width:30ch}
.w-r{position:relative;aspect-ratio:1/1.05}
.w-r img{position:absolute;object-fit:cover;border-radius:26px}
.w-r .a{inset:0 18% 20% 0;width:82%;height:80%}
.w-r .b{right:0;bottom:0;width:58%;height:46%;border:6px solid var(--noite)}
@media(max-width:860px){.where{grid-template-columns:1fr}}

.insta{display:flex;align-items:center;justify-content:space-between;gap:20px;flex-wrap:wrap;padding-block:50px;border-top:1px solid var(--line)}
.insta h2{font-size:clamp(1.5rem,3vw,2.2rem);font-weight:800}
.insta p{color:var(--muted);margin-top:6px}

/* rodapé */
.foot{overflow:hidden;padding-top:40px}
.mega{font-family:var(--display);font-weight:800;font-size:clamp(3rem,15.2vw,15rem);line-height:.9;letter-spacing:-.05em;white-space:nowrap;text-align:center;
  background:linear-gradient(180deg,rgba(255,180,42,.9),rgba(255,138,31,.05));-webkit-background-clip:text;background-clip:text;color:transparent;will-change:transform}
.fl{display:flex;justify-content:space-between;gap:20px;flex-wrap:wrap;padding-block:30px 110px;color:var(--muted);font-size:.95rem}
.fl a{text-decoration:none}.fl a:hover{color:var(--fg)}

/* whatsapp flutuante */
.fab{position:fixed;right:max(18px,env(safe-area-inset-right));bottom:max(18px,env(safe-area-inset-bottom));z-index:70;display:flex;align-items:center;gap:10px;height:58px;padding:0 22px 0 16px;border-radius:999px;background:#1fb855;color:#fff;font-weight:700;text-decoration:none;box-shadow:0 14px 40px -8px rgba(31,184,85,.7);transform:translateY(120px);transition:transform .5s var(--ease)}
.fab.show{transform:none}
.fab svg{width:30px;height:30px}
@media(max-width:560px){.fab span{display:none}.fab{padding:0 14px;width:58px;justify-content:center}}
.toast{position:fixed;left:50%;bottom:90px;transform:translate(-50%,30px);opacity:0;padding:12px 20px;border-radius:999px;background:var(--surf2);border:1px solid var(--line);z-index:100;pointer-events:none;transition:.4s var(--ease)}
.toast.on{opacity:1;transform:translate(-50%,0)}

@media (prefers-reduced-motion:reduce){
  .intro{display:none}
  .hint span{animation:none}
}

/* contraste do texto sobre a foto de dia */
.day::after{content:"";position:absolute;inset:0;background:radial-gradient(70% 55% at 50% 50%,rgba(5,14,23,.62),rgba(5,14,23,.25))}
.c2 h2{text-shadow:0 2px 30px rgba(0,0,0,.85),0 0 4px rgba(0,0,0,.5)}

.book{padding-top:clamp(36px,6vw,80px)}
.suites{padding-top:clamp(30px,5vw,70px)}

.skip{position:fixed;left:12px;top:-60px;z-index:300;padding:10px 16px;border-radius:999px;background:var(--honey);color:var(--ink);font-weight:700;text-decoration:none;transition:top .2s}
.skip:focus{top:12px}
.hero .layer,.day,.ring{backface-visibility:hidden}
