:root{
  --black:#0A0A0A; --nude:#D9B99B; --gold:#C9A66B; --off:#F5F1EC; --wine:#3B1F1F;
  --ease:cubic-bezier(.22,1,.36,1);
}
*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth}
body{
  background:var(--black); color:var(--off);
  font-family:'Manrope',system-ui,sans-serif; font-weight:300;
  -webkit-font-smoothing:antialiased; overflow-x:hidden;
}
h1,h2,h3{font-family:'Cormorant Garamond',Georgia,serif;font-weight:400;letter-spacing:.01em}
h2{font-size:clamp(2rem,5vw,3.4rem);line-height:1.1;margin-bottom:1.2rem}
img{display:block;max-width:100%}
a{color:inherit;text-decoration:none}

/* loader */
#loader{position:fixed;inset:0;z-index:100;background:var(--black);display:grid;place-content:center;gap:1.4rem;justify-items:center;transition:opacity .8s var(--ease),visibility .8s}
#loader.done{opacity:0;visibility:hidden}
.loader-mark{width:180px}
.loader-mark path{stroke-dasharray:400;stroke-dashoffset:400;animation:draw 1.7s var(--ease) forwards}
.loader-mark path:nth-child(2){animation-delay:.25s}
@keyframes draw{to{stroke-dashoffset:0}}
.loader-label{font-size:.7rem;letter-spacing:.55em;color:var(--nude);opacity:0;animation:fade .9s 1.1s forwards}
@keyframes fade{to{opacity:.8}}

/* cursor */
#cursor{position:fixed;top:0;left:0;width:10px;height:10px;border-radius:50%;background:var(--gold);pointer-events:none;z-index:90;transform:translate(-50%,-50%);transition:width .25s,height .25s,opacity .3s;mix-blend-mode:screen;opacity:0}
@media (hover:hover) and (pointer:fine){#cursor{opacity:1}#cursor.big{width:38px;height:38px;background:rgba(201,166,107,.35)}}

/* nav */
.nav{position:fixed;top:0;left:0;right:0;z-index:60;display:flex;align-items:center;justify-content:space-between;
  padding:1rem clamp(1rem,4vw,3rem);backdrop-filter:blur(14px);background:rgba(10,10,10,.55);
  border-bottom:1px solid rgba(201,166,107,.14)}
.nav-logo{font-family:'Cormorant Garamond',serif;font-size:1.5rem;letter-spacing:.18em;color:var(--nude)}
.nav nav{display:flex;gap:2rem;font-size:.78rem;letter-spacing:.16em;text-transform:uppercase;color:rgba(245,241,236,.65)}
.nav nav a:hover{color:var(--gold)}
@media(max-width:900px){.nav nav{display:none}}

/* buttons */
.btn{display:inline-flex;align-items:center;gap:.6rem;border-radius:999px;padding:.95rem 2.1rem;
  font-size:.78rem;letter-spacing:.18em;text-transform:uppercase;transition:all .4s var(--ease)}
.btn-gold{background:linear-gradient(120deg,var(--gold),var(--nude));color:#120c06;font-weight:600}
.btn-gold:hover{transform:scale(1.05);box-shadow:0 0 42px rgba(201,166,107,.45)}
.btn-ghost{border:1px solid rgba(201,166,107,.5);color:var(--nude)}
.btn-ghost:hover{background:rgba(201,166,107,.12);box-shadow:0 0 26px rgba(201,166,107,.25)}
.big{padding:1.2rem 3rem;font-size:.85rem}
.pulse{animation:pulse 2.8s ease-in-out infinite}
@keyframes pulse{0%,100%{box-shadow:0 0 0 0 rgba(201,166,107,.35)}50%{box-shadow:0 0 0 18px rgba(201,166,107,0)}}

/* hero */
#hero{position:relative;min-height:100svh;display:grid;place-items:center;text-align:center;padding:7rem 1.2rem 5rem;
  background:radial-gradient(120% 80% at 50% 0%,#161009 0%,var(--black) 55%),linear-gradient(180deg,transparent 60%,rgba(59,31,31,.35) 100%)}
#particles{position:absolute;inset:0;width:100%;height:100%}
.hero-inner{position:relative;z-index:2;max-width:820px;display:grid;justify-items:center;gap:1.1rem}
.portrait{position:relative;width:min(230px,58vw);aspect-ratio:1;border-radius:50%;margin-bottom:.8rem}
.portrait img{width:100%;height:100%;object-fit:cover;border-radius:50%;position:relative;z-index:2;border:1px solid rgba(201,166,107,.55)}
.portrait::before{content:"";position:absolute;inset:-14px;border-radius:50%;
  background:conic-gradient(from 0deg,transparent,var(--gold),var(--nude),transparent 70%);
  filter:blur(10px);opacity:.75;animation:spin 7s linear infinite}
@keyframes spin{to{transform:rotate(360deg)}}
.eyebrow{font-size:.7rem;letter-spacing:.42em;text-transform:uppercase;color:var(--gold)}
h1{font-size:clamp(2.7rem,9vw,5.6rem);line-height:1;background:linear-gradient(100deg,var(--off),var(--nude) 60%,var(--gold));-webkit-background-clip:text;background-clip:text;color:transparent}
.hero-sub{color:rgba(245,241,236,.7);font-size:clamp(.95rem,2.3vw,1.15rem);max-width:32ch}
.scroll-hint{position:absolute;bottom:26px;left:50%;transform:translateX(-50%);width:1px;height:56px;background:linear-gradient(var(--gold),transparent);opacity:.6}

/* sections */
.section{padding:clamp(4.5rem,11vw,8.5rem) clamp(1.2rem,6vw,7rem);max-width:1200px;margin:0 auto}
.tag{display:inline-block;font-size:.68rem;letter-spacing:.38em;text-transform:uppercase;color:var(--gold);margin-bottom:1rem}
.lead{color:rgba(245,241,236,.6);margin-bottom:2.4rem}
.reveal{opacity:0;transform:translateY(38px);transition:opacity 1s var(--ease),transform 1s var(--ease)}
.reveal.in{opacity:1;transform:none}
.grid-2{display:grid;grid-template-columns:1fr 1fr;gap:clamp(2rem,6vw,5rem);align-items:start}
@media(max-width:820px){.grid-2{grid-template-columns:1fr}}
.about-body p{color:rgba(245,241,236,.72);line-height:1.8;margin-bottom:1.1rem}
.seals{list-style:none;display:grid;gap:.9rem;margin-top:1.8rem}
.seals li{display:flex;align-items:center;gap:.8rem;font-size:.9rem;color:var(--nude)}
.seals svg{width:26px;height:26px;flex:none;fill:rgba(201,166,107,.16);stroke:var(--gold);stroke-width:1}
.seals .tick{fill:none;stroke:var(--gold);stroke-width:1.6}

/* cards */
.cards{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:1.2rem;margin-top:1rem}
.card{position:relative;padding:2.2rem 1.7rem 2.6rem;border-radius:18px;background:linear-gradient(160deg,rgba(217,185,155,.07),rgba(59,31,31,.18));
  border:1px solid rgba(201,166,107,.2);transition:transform .35s var(--ease),box-shadow .35s var(--ease),border-color .35s;transform-style:preserve-3d}
.card:hover{border-color:rgba(201,166,107,.65);box-shadow:0 22px 60px rgba(0,0,0,.6),0 0 34px rgba(201,166,107,.22)}
.card h3{font-size:1.6rem;margin-bottom:.7rem;color:var(--nude)}
.card p{color:rgba(245,241,236,.6);font-size:.92rem;line-height:1.7}

/* before after */
.ba-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:1.4rem}
.ba{position:relative;aspect-ratio:443/710;border-radius:16px;overflow:hidden;border:1px solid rgba(201,166,107,.22);touch-action:none;user-select:none;cursor:ew-resize}
.ba>img{width:100%;height:100%;object-fit:cover;display:block;pointer-events:none}
.ba .after{position:absolute;inset:0;overflow:hidden;width:50%}
.ba .after img{height:100%;max-width:none;object-fit:cover;position:absolute;top:0;left:0;pointer-events:none}
.ba .handle{position:absolute;top:0;bottom:0;width:2px;background:var(--gold);left:50%;box-shadow:0 0 16px rgba(201,166,107,.8)}
.ba .handle::after{content:"";position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:38px;height:38px;border-radius:50%;
  border:1px solid var(--gold);background:rgba(10,10,10,.6);backdrop-filter:blur(4px)}
.ba .lbl{position:absolute;bottom:10px;font-size:.62rem;letter-spacing:.3em;text-transform:uppercase;color:var(--off);
  background:rgba(10,10,10,.55);padding:.35rem .7rem;border-radius:999px}
.ba .lbl.l{left:10px}.ba .lbl.r{right:10px;color:var(--nude)}

/* testimonials */
.testimonials{position:relative;min-height:210px}
.t{position:absolute;inset:0;opacity:0;transition:opacity 1s var(--ease);display:grid;justify-items:center;text-align:center;gap:.9rem}
.t.on{opacity:1}
.t .av{width:66px;height:66px;border-radius:50%;display:grid;place-items:center;font-family:'Cormorant Garamond',serif;font-size:1.5rem;
  color:#120c06;background:linear-gradient(140deg,var(--nude),var(--gold))}
.t p{max-width:60ch;font-size:clamp(1.05rem,2.6vw,1.35rem);font-family:'Cormorant Garamond',serif;color:rgba(245,241,236,.92);line-height:1.6}
.t span.name{font-size:.72rem;letter-spacing:.3em;text-transform:uppercase;color:var(--gold)}
.stars{display:flex;gap:.3rem}
.stars i{width:14px;height:14px;background:var(--gold);clip-path:polygon(50% 0,61% 35%,98% 35%,68% 57%,79% 91%,50% 70%,21% 91%,32% 57%,2% 35%,39% 35%);
  animation:twinkle 2.4s ease-in-out infinite}
@keyframes twinkle{0%,100%{opacity:.55;transform:scale(.9)}50%{opacity:1;transform:scale(1.1)}}
.dots{display:flex;gap:.5rem;justify-content:center;margin-top:2rem}
.dots button{width:7px;height:7px;border-radius:50%;border:0;background:rgba(201,166,107,.3);cursor:pointer;transition:.3s}
.dots button.on{background:var(--gold);width:22px;border-radius:999px}

/* map */
.map{position:relative;height:340px;border-radius:20px;overflow:hidden;border:1px solid rgba(201,166,107,.22);
  background:radial-gradient(80% 90% at 50% 50%,#14100c,#070707)}
.map-grid{position:absolute;inset:-20%;background-image:linear-gradient(rgba(201,166,107,.12) 1px,transparent 1px),linear-gradient(90deg,rgba(201,166,107,.12) 1px,transparent 1px);
  background-size:64px 64px;transform:perspective(600px) rotateX(52deg)}
.pin{position:absolute;top:46%;left:50%;transform:translate(-50%,-50%)}
.pin span{display:block;width:14px;height:14px;border-radius:50%;background:var(--gold);box-shadow:0 0 22px var(--gold)}
.pin::after{content:"";position:absolute;inset:-6px;border-radius:50%;border:1px solid var(--gold);animation:ping 2s ease-out infinite}
@keyframes ping{0%{transform:scale(.6);opacity:.9}100%{transform:scale(3.4);opacity:0}}
.map-label{position:absolute;bottom:18px;left:50%;transform:translateX(-50%);font-size:.72rem;letter-spacing:.3em;text-transform:uppercase;color:var(--nude)}

/* cta */
#cta{text-align:center;padding:clamp(5rem,12vw,9rem) 1.2rem;
  background:radial-gradient(70% 100% at 50% 100%,rgba(59,31,31,.55),transparent 70%),var(--black);
  border-top:1px solid rgba(201,166,107,.14)}
#cta h2{margin-bottom:2rem}
.wa{width:22px;height:22px;fill:#120c06}
.bounce{animation:bounce 1.9s ease-in-out infinite}
@keyframes bounce{0%,100%{transform:translateY(0)}50%{transform:translateY(-4px)}}

footer{text-align:center;padding:3.5rem 1.2rem 7rem;display:grid;gap:.9rem;justify-items:center;border-top:1px solid rgba(201,166,107,.12)}
.f-logo{font-family:'Cormorant Garamond',serif;font-size:1.7rem;letter-spacing:.2em;color:var(--nude)}
footer a{font-size:.8rem;letter-spacing:.2em;color:var(--gold)}
footer p{font-size:.7rem;letter-spacing:.12em;color:rgba(245,241,236,.4)}

.mobile-cta{position:fixed;left:12px;right:12px;bottom:12px;z-index:70;display:none;text-align:center;
  padding:1rem;border-radius:999px;background:linear-gradient(120deg,var(--gold),var(--nude));color:#120c06;
  font-size:.78rem;letter-spacing:.18em;text-transform:uppercase;font-weight:600;box-shadow:0 12px 40px rgba(0,0,0,.6)}
@media(max-width:820px){.mobile-cta{display:block}footer{padding-bottom:6.5rem}.nav-cta{display:none}}
@media(prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}}
