@font-face{font-family:'Cormorant Garamond';font-style:normal;font-weight:300;font-display:swap;src:url('../fonts/cormorant-garamond-latin-300-normal.woff2') format('woff2')}
@font-face{font-family:'Cormorant Garamond';font-style:italic;font-weight:300;font-display:swap;src:url('../fonts/cormorant-garamond-latin-300-italic.woff2') format('woff2')}
@font-face{font-family:'Jost';font-style:normal;font-weight:300;font-display:swap;src:url('../fonts/jost-latin-300-normal.woff2') format('woff2')}
@font-face{font-family:'Cormorant Garamond';font-style:normal;font-weight:400;font-display:swap;src:url('../fonts/cormorant-garamond-latin-400-normal.woff2') format('woff2')}
@font-face{font-family:'Cormorant Garamond';font-style:italic;font-weight:400;font-display:swap;src:url('../fonts/cormorant-garamond-latin-400-italic.woff2') format('woff2')}
@font-face{font-family:'Jost';font-style:normal;font-weight:400;font-display:swap;src:url('../fonts/jost-latin-400-normal.woff2') format('woff2')}
@font-face{font-family:'Cormorant Garamond';font-style:normal;font-weight:500;font-display:swap;src:url('../fonts/cormorant-garamond-latin-500-normal.woff2') format('woff2')}
@font-face{font-family:'Cormorant Garamond';font-style:italic;font-weight:500;font-display:swap;src:url('../fonts/cormorant-garamond-latin-500-italic.woff2') format('woff2')}
@font-face{font-family:'Jost';font-style:normal;font-weight:500;font-display:swap;src:url('../fonts/jost-latin-500-normal.woff2') format('woff2')}

/* =========================================================
   Trend Hair — folha única
   Direção: premium contida. Paleta nomeada pela marca no briefing:
   off-white, champagne, bege, marrom profundo, preto suave.
   ========================================================= */

:root{
  --bone:#F6F3EE;
  --bone-2:#EFEAE2;
  --sand:#E4DACB;
  --champagne:#B8914F;        /* fundo de botão e acento sobre escuro */
  --champagne-ink:#725722;    /* mesmo matiz, escurecido para texto sobre claro (6.1:1 no bone, 4.9:1 no sand) */
  --champagne-soft:#D9BE8B;
  --espresso:#33261D;
  --ink:#171310;
  --ink-2:#221B16;
  --muted:#6B5A4B;
  --on-dark:#F2EBE1;
  --on-dark-muted:#C3B4A3;

  --font-d:'Cormorant Garamond',Georgia,'Times New Roman',serif;
  --font-t:'Jost',system-ui,-apple-system,'Segoe UI',Roboto,Helvetica,Arial,sans-serif;

  --ease-out:cubic-bezier(.23,1,.32,1);
  --ease-io:cubic-bezier(.77,0,.175,1);

  --pad:clamp(1.25rem,5vw,5.5rem);
  --gap:clamp(3.5rem,9vw,9rem);
  --header-h:76px;
}

*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;overflow-x:clip}
/* clip, nunca hidden: overflow:hidden em ancestral desativa o position:sticky
   das seções de vídeo e abre um vazio entre elas. */
body{
  margin:0;background:var(--bone);color:var(--espresso);
  font-family:var(--font-t);font-weight:300;font-size:clamp(1rem,.96rem + .18vw,1.0625rem);
  line-height:1.65;-webkit-font-smoothing:antialiased;overflow-x:clip;
}
img{display:block;max-width:100%;height:auto}
a{color:inherit}
ul{list-style:none;margin:0;padding:0}
h1,h2,h3{margin:0;font-weight:400}

::selection{background:var(--champagne);color:var(--ink)}
:focus-visible{outline:2px solid var(--champagne);outline-offset:3px;border-radius:2px}

.skip{position:absolute;left:-999px;top:0;z-index:999;background:var(--ink);color:var(--on-dark);padding:.75rem 1.25rem}
.skip:focus{left:.5rem;top:.5rem}

/* ---------- tipografia ---------- */
.h-display{
  font-family:var(--font-d);font-weight:300;
  font-size:clamp(2.35rem,1.2rem + 5.2vw,5.25rem);
  line-height:1.12;letter-spacing:-.018em;
}
.h-display em{font-style:italic;color:var(--champagne-ink);display:inline-block;padding:.06em 0 .08em}
.eyebrow{
  font-size:.72rem;letter-spacing:.24em;text-transform:uppercase;
  color:var(--muted);margin:0 0 1.35rem;font-weight:400;
}
.lead{max-width:46ch;color:var(--muted);margin:1.5rem 0 0;font-size:clamp(1rem,.95rem + .3vw,1.15rem);line-height:1.75}

/* ---------- botões ---------- */
.btn{
  display:inline-flex;align-items:center;justify-content:center;gap:.6rem;
  font-family:var(--font-t);font-size:.76rem;font-weight:400;
  letter-spacing:.17em;text-transform:uppercase;text-decoration:none;
  padding:1.05rem 2rem;border-radius:2px;white-space:nowrap;
  transition:background-color .3s var(--ease-out),color .3s var(--ease-out),
             border-color .3s var(--ease-out),transform .16s var(--ease-out);
}
.btn:active{transform:scale(.975)}
.btn-solid{background:var(--champagne);color:#1A140C;border:1px solid var(--champagne)}
.btn-line{background:transparent;color:var(--on-dark);border:1px solid rgba(242,235,225,.42)}
.btn-line--dark{color:var(--espresso);border-color:rgba(51,38,29,.32)}
.btn-line--light{color:var(--on-dark);border-color:rgba(242,235,225,.4)}
.btn-ghost{background:transparent;color:var(--on-dark);border:1px solid rgba(242,235,225,.4);padding:.85rem 1.5rem}
.btn-lg{padding:1.25rem 2.6rem;font-size:.8rem}
@media (hover:hover) and (pointer:fine){
  .btn-solid:hover{background:var(--champagne-soft);border-color:var(--champagne-soft)}
  .btn-line:hover,.btn-ghost:hover{background:rgba(242,235,225,.1);border-color:rgba(242,235,225,.8)}
  .btn-line--dark:hover{background:rgba(51,38,29,.06);border-color:var(--espresso)}
}

/* ---------- loader ---------- */
#loader{
  position:fixed;inset:0;z-index:200;background:var(--ink);
  display:grid;place-content:center;gap:1.75rem;justify-items:center;
  transition:opacity .7s var(--ease-out),visibility .7s;
}
#loader.done{opacity:0;visibility:hidden;pointer-events:none}
.loader-brand{width:min(220px,52vw);height:auto}
.loader-track{width:min(240px,52vw);height:1px;background:rgba(242,235,225,.2);overflow:hidden}
#loader-bar{height:100%;width:0;background:var(--champagne);transition:width .25s linear}

/* ---------- header ---------- */
.site-header{
  position:fixed;top:0;left:0;right:0;z-index:90;height:var(--header-h);
  display:flex;align-items:center;gap:2rem;padding:0 var(--pad);
  color:var(--on-dark);
  transition:background-color .45s var(--ease-out),color .45s var(--ease-out),
             border-color .45s var(--ease-out),backdrop-filter .45s var(--ease-out);
  border-bottom:1px solid transparent;
}
.site-header.solid{
  background:rgba(23,19,16,.82);backdrop-filter:blur(14px) saturate(150%);
  -webkit-backdrop-filter:blur(14px) saturate(150%);
  border-bottom-color:rgba(242,235,225,.1);
}
.brand{display:block;line-height:0;text-decoration:none;flex:none}
.brand img{width:clamp(122px,13vw,168px);height:auto}
.nav-desk{display:flex;gap:2.1rem;margin-left:auto}
.nav-desk a{
  font-size:.74rem;letter-spacing:.16em;text-transform:uppercase;text-decoration:none;
  opacity:.82;transition:opacity .25s var(--ease-out),color .25s var(--ease-out);
}
@media (hover:hover) and (pointer:fine){.nav-desk a:hover{opacity:1;color:var(--champagne-soft)}}
.header-cta{margin-left:.5rem}

.burger{display:none;margin-left:auto;width:44px;height:44px;background:none;border:0;padding:0;cursor:pointer;position:relative}
.burger span{position:absolute;left:11px;width:22px;height:1px;background:currentColor;transition:transform .35s var(--ease-io),opacity .2s}
.burger span:first-child{top:19px}
.burger span:last-child{top:25px}
.burger[aria-expanded="true"] span:first-child{transform:translateY(3px) rotate(45deg)}
.burger[aria-expanded="true"] span:last-child{transform:translateY(-3px) rotate(-45deg)}

.menu-mobile{
  position:fixed;inset:0;z-index:85;background:var(--ink);color:var(--on-dark);
  display:flex;flex-direction:column;justify-content:center;gap:2.5rem;padding:var(--pad);
  opacity:0;visibility:hidden;pointer-events:none;
  transition:opacity .4s var(--ease-out),visibility .4s var(--ease-out);
}
.menu-mobile.open{opacity:1;visibility:visible;pointer-events:auto}
/* O atributo hidden vale display:none, mas qualquer display no CSS o vence.
   Sem esta linha o menu fica invisível cobrindo a tela inteira e engole
   todos os cliques da página. */
.menu-mobile[hidden]{display:none}
.menu-mobile nav{display:flex;flex-direction:column;gap:1.4rem}
.menu-mobile nav a{font-family:var(--font-d);font-size:2rem;text-decoration:none}
.menu-mobile .btn{align-self:flex-start}

/* ---------- seções de scrub (hero e experiência) ---------- */
.scrub{position:relative}
.hero{height:230vh}
.exp{height:250vh}
/* O fundo usa lvh (a maior altura possível da tela, com a barra do navegador
   recolhida) para nunca faltar pedaço quando a barra some. O conteúdo usa svh
   (a menor) para nunca ficar escondido atrás dela. */
.scrub-stage{
  position:sticky;top:0;
  height:100vh;height:100lvh;
  min-height:100vh;min-height:100lvh;
  overflow:clip;background:var(--ink);
}
.scrub-canvas{position:absolute;inset:-1px;overflow:hidden;background:var(--ink)}
.scrub-canvas canvas{width:100%;height:100%;display:block;object-fit:cover}
.scrub-veil{
  position:absolute;inset:-1px;pointer-events:none;
  background:
    linear-gradient(180deg,rgba(23,19,16,.86) 0%,rgba(23,19,16,.3) 26%,rgba(23,19,16,.8) 78%,rgba(23,19,16,.86) 100%),
    linear-gradient(90deg,rgba(23,19,16,.82) 0%,rgba(23,19,16,.64) 40%,rgba(23,19,16,.14) 76%,rgba(23,19,16,0) 100%);
}
.scrub-veil--side{
  background:
    linear-gradient(180deg,rgba(23,19,16,.6) 0%,rgba(23,19,16,0) 22%,rgba(23,19,16,0) 62%,rgba(23,19,16,.5) 88%,rgba(23,19,16,.6) 100%),
    linear-gradient(90deg,rgba(23,19,16,.9) 0%,rgba(23,19,16,.78) 38%,rgba(23,19,16,.3) 72%,rgba(23,19,16,.52) 100%);
}

/* hero */
.hero-inner{
  position:absolute;top:0;left:0;right:0;z-index:2;
  height:100vh;height:100svh;
  display:flex;flex-direction:column;justify-content:center;
  padding:calc(var(--header-h) + 2rem) var(--pad) calc(4rem + env(safe-area-inset-bottom,0px));
  color:var(--on-dark);max-width:min(56rem,92vw);
}
.hero-inner .eyebrow{color:var(--champagne-soft)}
.hero-title{
  font-family:var(--font-d);font-weight:300;
  font-size:clamp(3rem,1.1rem + 9vw,8.5rem);line-height:1.04;letter-spacing:-.025em;margin:0;
}
.hero-title .w{display:block;overflow:hidden;padding:.02em 0 .06em}
.hero-title em{font-style:italic;color:var(--champagne-soft)}
.hero-sub{color:#DCD2C6;margin:1.75rem 0 0;max-width:34ch;font-size:clamp(1rem,.94rem + .35vw,1.2rem)}
.hero-ctas{display:flex;flex-wrap:wrap;gap:.9rem;margin-top:2.75rem}

/* experiência */
.exp-inner{
  position:absolute;top:0;left:0;right:0;overflow:hidden;z-index:2;
  height:100vh;height:100svh;
  display:flex;flex-direction:column;justify-content:center;
  padding:calc(var(--header-h) + 2rem) var(--pad) calc(4rem + env(safe-area-inset-bottom,0px));
  color:var(--on-dark);
}
.zone-left{max-width:min(42rem,52vw)}
.exp-inner .eyebrow{color:var(--champagne-soft)}
.exp-inner .lead{color:#DCD2C6;max-width:40ch}

/* ---------- 03 autoridade ---------- */
.autoridade{background:var(--bone);padding:var(--gap) 0}
.aut-grid{
  display:grid;grid-template-columns:1.05fr .95fr;gap:clamp(2.5rem,6vw,6rem);
  align-items:center;padding:0 var(--pad);max-width:100rem;margin:0 auto;
}
.aut-foto{margin:0;overflow:hidden;border-radius:2px}
.aut-foto img{width:100%;object-fit:cover;aspect-ratio:4/3;will-change:transform}
.stats{
  display:grid;grid-template-columns:repeat(2,minmax(0,1fr));
  gap:clamp(2rem,4vw,3.25rem);margin-top:clamp(3rem,5vw,4.5rem);
}
.stat{display:flex;flex-wrap:wrap;align-items:baseline;gap:.15rem}
.stat-n{
  font-family:var(--font-d);font-weight:300;font-size:clamp(3rem,1.4rem + 5vw,5rem);
  line-height:1;letter-spacing:-.02em;font-variant-numeric:tabular-nums;color:var(--espresso);
}
.stat-plus{font-family:var(--font-d);font-size:clamp(1.7rem,3vw,2.6rem);color:var(--champagne-ink);line-height:1}
.stat-l{flex:1 0 100%;font-size:.78rem;letter-spacing:.14em;text-transform:uppercase;color:var(--muted);margin-top:.65rem}

/* ---------- marquee ---------- */
.marquee{overflow:hidden;background:var(--ink);padding:clamp(1.5rem,3vw,2.75rem) 0;user-select:none}
.marquee-track{display:flex;gap:2.5rem;width:max-content;will-change:transform}
.marquee-track span{
  font-family:var(--font-d);font-style:italic;font-weight:300;
  font-size:clamp(3.5rem,11vw,9rem);line-height:1;color:rgba(242,235,225,.13);white-space:nowrap;
}
.marquee-track span:nth-child(even){color:rgba(184,145,79,.5)}

/* ---------- 04 transformação ---------- */
.transf{background:var(--ink);color:var(--on-dark);padding:var(--gap) 0;overflow:hidden}
.transf-head{padding:0 var(--pad);max-width:56rem}
.transf-head .h-display em{color:var(--champagne-soft)}
.transf-head .lead{color:var(--on-dark-muted)}
.rail{margin-top:clamp(3rem,6vw,5rem);overflow:hidden}
.rail-cap{
  padding:0 var(--pad);margin:0 0 1.25rem;font-size:.72rem;letter-spacing:.24em;
  text-transform:uppercase;color:var(--champagne-soft);
}
.rail-track{display:flex;gap:clamp(.75rem,1.5vw,1.5rem);width:max-content;will-change:transform}
/* sem margem lateral: o laço só fecha sem emenda se o trilho começar colado na borda */
.rail-track li{flex:0 0 auto;overflow:hidden;border-radius:2px;background:var(--ink-2)}
.rail-track img{height:clamp(15rem,30vw,25rem);width:auto;object-fit:cover}
.transf-cta{padding:clamp(3rem,6vw,5rem) var(--pad) 0}

/* ---------- 05 serviços ---------- */
.servicos{background:var(--bone);padding:var(--gap) var(--pad)}
.sec-head{max-width:52rem;margin:0 auto 0 0}
.sec-head--center{margin:0 auto;text-align:center}
.serv-grid{
  --serv-gap:clamp(.9rem,1.6vw,1.5rem);
  display:flex;flex-wrap:wrap;justify-content:center;
  gap:var(--serv-gap);margin-top:clamp(3rem,6vw,5rem);
}
.serv{flex:0 0 calc((100% - 4 * var(--serv-gap)) / 5);max-width:19rem}
.serv-card{display:block;text-decoration:none;color:inherit}
.serv-img{
  display:block;position:relative;aspect-ratio:393/457;overflow:hidden;
  border-radius:6px;background:var(--sand);
}
.serv-img img{width:100%;height:100%;object-fit:cover;display:block;transition:transform .8s var(--ease-out)}
.serv-cta{
  display:flex;align-items:center;justify-content:center;gap:.45rem;
  margin-top:.8rem;padding-top:.7rem;border-top:1px solid rgba(51,38,29,.16);
  font-size:.64rem;letter-spacing:.2em;text-transform:uppercase;color:var(--champagne-ink);
  transition:color .3s var(--ease-out),border-color .3s var(--ease-out);
}
.serv-seta{flex:0 0 auto;transition:transform .4s var(--ease-out)}
.serv-card:focus-visible{outline:2px solid var(--champagne-ink);outline-offset:5px;border-radius:6px}
@media (hover:hover) and (pointer:fine){
  .serv-card:hover .serv-img img{transform:scale(1.06)}
  .serv-card:hover .serv-cta{color:var(--espresso);border-color:rgba(51,38,29,.42)}
  .serv-card:hover .serv-seta{transform:translateX(4px)}
}
@media (max-width:1180px){.serv{flex-basis:calc((100% - 3 * var(--serv-gap)) / 4)}}
@media (max-width:900px){.serv{flex-basis:calc((100% - 2 * var(--serv-gap)) / 3)}}
@media (max-width:620px){.serv{flex-basis:calc((100% - 1 * var(--serv-gap)) / 2);max-width:none}}

/* ---------- 06 day spa ---------- */
.spa{
  background:var(--ink);color:var(--on-dark);
  padding:var(--gap) var(--pad);
  display:grid;grid-template-columns:1fr 1.1fr;
  gap:clamp(2.5rem,6vw,6rem);align-items:center;
}
.spa .h-display em{color:var(--champagne-soft)}
.spa .lead{color:var(--on-dark-muted)}
.spa-copy .btn{margin-top:2.5rem}
.spa-grade{
  display:grid;grid-template-columns:repeat(2,1fr);
  gap:clamp(.6rem,1.4vw,1.1rem);align-items:start;
}
.spa-grade li{overflow:hidden;border-radius:2px;background:var(--ink-2)}
.spa-grade li:nth-child(2),
.spa-grade li:nth-child(4){transform:translateY(clamp(1.25rem,3vw,2.75rem))}
.spa-grade img{
  width:100%;height:100%;object-fit:cover;aspect-ratio:3/4;
  transition:transform .9s var(--ease-out);
}
@media (hover:hover) and (pointer:fine){.spa-grade li:hover img{transform:scale(1.05)}}

/* ---------- 06 dia da noiva ---------- */
.noiva{
  display:grid;grid-template-columns:1.2fr 1fr;align-items:stretch;
  background:var(--sand);color:var(--espresso);
}
.noiva-foto{margin:0;overflow:hidden;min-height:clamp(28rem,60vw,46rem)}
.noiva-foto img{width:100%;height:100%;object-fit:cover;will-change:transform}
.noiva-copy{display:flex;flex-direction:column;justify-content:center;padding:var(--gap) var(--pad)}
.noiva-copy .lead{color:#5A4B3D}
.noiva-copy .btn{margin-top:2.25rem;align-self:flex-start}

/* ---------- 07 instagram ---------- */
.insta{background:var(--bone);padding:var(--gap) var(--pad)}
.insta-grid{
  display:grid;grid-template-columns:repeat(4,1fr);grid-auto-rows:clamp(9rem,15vw,13rem);
  gap:clamp(.6rem,1.2vw,1rem);margin-top:clamp(3rem,6vw,4.5rem);
}
.insta-grid li{overflow:hidden;border-radius:2px;background:var(--sand)}
.insta-grid img{width:100%;height:100%;object-fit:cover;transition:transform .9s var(--ease-out)}
@media (hover:hover) and (pointer:fine){.insta-grid li:hover img{transform:scale(1.05)}}
.g-tall{grid-row:span 2}
.g-wide{grid-column:span 2}
.insta-cta{margin-top:clamp(2.5rem,5vw,3.5rem);display:flex;flex-direction:column;align-items:center;gap:1rem}
.insta-handle{margin:0;font-size:.78rem;letter-spacing:.16em;text-transform:lowercase;color:var(--muted)}

/* ---------- 08 unidades ---------- */
.unidades{background:var(--ink);color:var(--on-dark);padding:var(--gap) var(--pad)}
.unidades .h-display em{color:var(--champagne-soft)}
.unidades .eyebrow{color:var(--on-dark-muted)}
.und-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:clamp(1.25rem,3vw,2.5rem);margin-top:clamp(3rem,6vw,4.5rem)}
.und{
  border:1px solid rgba(242,235,225,.16);border-radius:2px;
  padding:clamp(2rem,4vw,3.25rem);display:flex;flex-direction:column;align-items:flex-start;gap:1.25rem;
  transition:border-color .4s var(--ease-out),background-color .4s var(--ease-out);
}
@media (hover:hover) and (pointer:fine){.und:hover{border-color:rgba(184,145,79,.55);background:rgba(242,235,225,.03)}}
.und-tag{margin:0;font-size:.72rem;letter-spacing:.24em;text-transform:uppercase;color:var(--champagne-soft)}
.und-end{margin:0;font-family:var(--font-d);font-size:clamp(1.5rem,1.15rem + 1vw,2.15rem);line-height:1.3;color:var(--on-dark)}
.und-tel{margin:0;font-size:1rem;color:var(--on-dark-muted);font-variant-numeric:tabular-nums}
.und-tel a{text-decoration:none;border-bottom:1px solid rgba(184,145,79,.6);padding-bottom:2px}
.und-tel--sec{font-size:.88rem;opacity:.75;margin-top:-.55rem}
.und .btn{margin-top:.5rem}
.und-mapa{
  position:relative;width:100%;margin-top:.35rem;border-radius:2px;overflow:hidden;
  border:1px solid rgba(242,235,225,.14);background:var(--ink-2);
  aspect-ratio:16/10;
}
/* enquanto o mapa carrega (ou se ele falhar) o espaço lê como intencional,
   não como imagem quebrada */
.und-mapa::before{
  content:"Mapa";position:absolute;inset:0;display:grid;place-content:center;
  font-size:.68rem;letter-spacing:.24em;text-transform:uppercase;
  color:var(--on-dark-muted);opacity:.5;
  background:repeating-linear-gradient(45deg,rgba(242,235,225,.03),rgba(242,235,225,.03) 12px,transparent 12px,transparent 24px);
}
.und-mapa iframe{position:relative;z-index:1}
.und-mapa iframe{display:block;width:100%;height:100%;border:0;filter:grayscale(.35) contrast(1.05)}

/* ---------- 09 cta final ---------- */
.final{position:relative;overflow:hidden;background:var(--ink);color:var(--on-dark);isolation:isolate}
.final-bg{position:absolute;inset:0;z-index:-1}
.final-bg img{width:100%;height:110%;object-fit:cover;object-position:50% 28%;opacity:.5;will-change:transform}
.final::after{
  content:"";position:absolute;inset:0;z-index:-1;
  background:linear-gradient(180deg,rgba(23,19,16,.72) 0%,rgba(23,19,16,.55) 45%,rgba(23,19,16,.88) 100%);
}
.final-inner{
  padding:calc(var(--gap) * 1.15) var(--pad);
  max-width:44rem;margin-left:auto;margin-right:var(--pad);text-align:right;
  display:flex;flex-direction:column;align-items:flex-end;
}
.final-inner .h-display em{color:var(--champagne-soft)}
.final-inner .lead{color:var(--on-dark-muted);text-align:right}
.final-inner .btn{margin-top:2.5rem}
.final-note{margin:1.5rem 0 0;font-size:.78rem;letter-spacing:.14em;text-transform:uppercase;color:var(--on-dark-muted);font-variant-numeric:tabular-nums}

/* ---------- rodapé ---------- */
.rodape{background:var(--ink-2);color:var(--on-dark);padding:clamp(3.5rem,7vw,5.5rem) var(--pad) 2.5rem}
.rod-grid{display:grid;grid-template-columns:1.2fr 1fr 1fr;gap:clamp(2rem,5vw,4rem);align-items:start}
.brand--foot{width:min(190px,46vw);height:auto;margin:0 0 1.4rem}
.rod-txt{margin:0;color:var(--on-dark-muted);font-size:.92rem;line-height:1.8}
.rod-nav{display:flex;flex-direction:column;gap:.75rem}
.rod-nav a{font-size:.8rem;letter-spacing:.14em;text-transform:uppercase;text-decoration:none;color:var(--on-dark-muted);transition:color .25s var(--ease-out)}
@media (hover:hover) and (pointer:fine){.rod-nav a:hover{color:var(--champagne-soft)}}
.rod-lbl{margin:0 0 .75rem;font-size:.72rem;letter-spacing:.24em;text-transform:uppercase;color:var(--on-dark-muted)}
.rod-insta{font-family:var(--font-d);font-size:1.35rem;text-decoration:none;color:var(--champagne-soft)}
.rod-fim{margin:clamp(3rem,6vw,4.5rem) 0 0;padding-top:1.75rem;border-top:1px solid rgba(242,235,225,.12);font-size:.78rem;letter-spacing:.1em;color:var(--on-dark-muted)}

/* ---------- whatsapp flutuante ---------- */
.wpp{
  position:fixed;right:clamp(1rem,3vw,2rem);bottom:clamp(1rem,3vw,2rem);z-index:80;
  display:inline-flex;align-items:center;gap:.65rem;
  background:var(--champagne);color:#1A140C;text-decoration:none;
  padding:.95rem 1.35rem;border-radius:999px;
  box-shadow:0 10px 30px rgba(23,19,16,.28),0 3px 8px rgba(23,19,16,.16);
  font-size:.76rem;letter-spacing:.16em;text-transform:uppercase;
  transform:translateY(140%);opacity:0;pointer-events:none;
  transition:transform .55s var(--ease-out),opacity .45s var(--ease-out),background-color .3s var(--ease-out);
}
.wpp.on{transform:none;opacity:1;pointer-events:auto}
/* sem JS o botão precisa existir mesmo assim */
.no-js .wpp{transform:none;opacity:1;pointer-events:auto}
.wpp:active{transform:scale(.97)}
.wpp svg{width:19px;height:19px;flex:none}
.wpp{min-height:52px}
@media (hover:hover) and (pointer:fine){.wpp:hover{background:var(--champagne-soft)}}

/* ---------- estados de animação ---------- */
.anim,.clip,.reveal{will-change:transform,opacity}

/* =========================================================
   RESPONSIVO
   ========================================================= */
@media (max-width:1080px){
  .aut-grid{grid-template-columns:1fr;gap:3rem}
  .aut-foto{order:-1}
  .spa{grid-template-columns:1fr;gap:3rem}
  .noiva{grid-template-columns:1fr}
  .noiva-foto{min-height:clamp(22rem,72vw,32rem)}
  .zone-left{max-width:none}
  .insta-grid{grid-template-columns:repeat(3,1fr)}
  .rod-grid{grid-template-columns:1fr 1fr}
}

@media (max-width:860px){
  .nav-desk,.header-cta{display:none}
  .burger{display:block}
  .site-header{background:rgba(23,19,16,.55);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px)}
  .hero{height:165vh}
  .exp{height:170vh}
  .und-grid{grid-template-columns:1fr}
  .stats{gap:2rem}
  .final-inner{margin-right:0;text-align:left;align-items:flex-start;max-width:none}
  .final-inner .lead{text-align:left}
  /* no celular o texto ocupa a largura toda: a faixa central precisa de scrim de verdade */
  .scrub-veil{background:linear-gradient(180deg,rgba(23,19,16,.9) 0%,rgba(23,19,16,.52) 20%,rgba(23,19,16,.84) 46%,rgba(23,19,16,.9) 78%,rgba(23,19,16,.9) 100%)}
  .scrub-veil--side{background:linear-gradient(180deg,rgba(23,19,16,.9) 0%,rgba(23,19,16,.6) 16%,rgba(23,19,16,.88) 44%,rgba(23,19,16,.9) 78%,rgba(23,19,16,.9) 100%)}
}

@media (max-width:560px){
  :root{--header-h:66px}
  .hero{height:150vh}
  .exp{height:155vh}
  .insta-grid{grid-template-columns:repeat(2,1fr);grid-auto-rows:clamp(8rem,32vw,11rem)}
  .g-wide{grid-column:span 2}
  .stats{grid-template-columns:1fr;gap:1.75rem}
  .spa-grade li:nth-child(2),.spa-grade li:nth-child(4){transform:translateY(1rem)}
  .rod-grid{grid-template-columns:1fr;gap:2.5rem}
  .hero-ctas{flex-direction:column;align-items:stretch}
  .hero-ctas .btn{width:100%}
  .wpp span{display:none}
  .wpp{padding:1rem;border-radius:50%}
  .wpp svg{width:22px;height:22px}
}

/* =========================================================
   MOVIMENTO REDUZIDO — mais suave, não zero
   ========================================================= */
@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  .anim,.clip,.reveal,.hero-title .w>*{opacity:1!important;transform:none!important;clip-path:none!important}
  .marquee-track,[data-parallax],.final-bg img,.spa-grade li{transform:none!important}
  .serv-img img,.insta-grid img{transition:none}
  .wpp{transition:opacity .2s ease}
}