/* ====================================
   ESTÚDIO NICOLLY PENASC — STYLE
   Paleta: branco · preto · cinza chumbo
   ==================================== */

:root{
  --color-bg: #ffffff;
  --color-bg-alt: #f5f4f2;
  --color-text: #1a1a1a;
  --color-muted: #6b6b6b;
  --color-line: #e5e3e0;
  --color-charcoal: #3a3a3c;     /* cinza chumbo */
  --color-charcoal-2: #2a2a2c;
  --color-black: #0a0a0a;
  --color-gold: #b5a47a;          /* leve dourado sutil para acentos */

  --font-serif: 'Cormorant Garamond', 'Times New Roman', serif;
  --font-sans: 'Inter', system-ui, -apple-system, sans-serif;

  --container: 1240px;
  --section-pad: clamp(72px, 10vw, 140px);
  --radius: 4px;
  --transition: 320ms cubic-bezier(.4,.2,.2,1);

  --shadow-1: 0 8px 24px rgba(0,0,0,.06);
  --shadow-2: 0 20px 60px rgba(0,0,0,.12);
}

*,*::before,*::after{ box-sizing:border-box; }
html{ scroll-behavior:smooth; -webkit-text-size-adjust:100%; }
body{
  margin:0;
  font-family:var(--font-sans);
  font-weight:400;
  color:var(--color-text);
  background:var(--color-bg);
  line-height:1.6;
  -webkit-font-smoothing:antialiased;
  overflow-x:hidden;
}
img{ max-width:100%; display:block; }
a{ color:inherit; text-decoration:none; transition:color var(--transition); }
button{ font-family:inherit; cursor:pointer; border:0; background:none; color:inherit; }

.container{
  width:100%;
  max-width:var(--container);
  margin:0 auto;
  padding:0 clamp(20px,4vw,40px);
}

/* ===== Section headers ===== */
.section__eyebrow{
  display:inline-block;
  font-family:var(--font-sans);
  font-size:11px;
  letter-spacing:.32em;
  text-transform:uppercase;
  color:var(--color-charcoal);
  font-weight:500;
  margin-bottom:18px;
  position:relative;
  padding-left:42px;
}
.section__eyebrow::before{
  content:"";
  position:absolute;
  left:0; top:50%;
  width:32px; height:1px;
  background:var(--color-charcoal);
  transform:translateY(-50%);
}
.section__title{
  font-family:var(--font-serif);
  font-weight:300;
  font-size:clamp(36px, 5.5vw, 64px);
  line-height:1.05;
  margin:0 0 24px;
  letter-spacing:-.01em;
}
.section__title em{
  font-style:italic;
  font-weight:400;
  color:var(--color-charcoal);
}
.section__lead{
  max-width:640px;
  color:var(--color-muted);
  font-size:16px;
  margin:0;
}
.section__header{ margin-bottom:64px; }
.section__header--center{ text-align:center; margin-inline:auto; }
.section__header--center .section__eyebrow{ padding-left:0; }
.section__header--center .section__eyebrow::before{ display:none; }
.section__header--center .section__lead{ margin-inline:auto; }

/* ===== Buttons ===== */
.btn{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:10px;
  padding:16px 32px;
  font-size:12px;
  font-weight:500;
  letter-spacing:.22em;
  text-transform:uppercase;
  border:1px solid currentColor;
  border-radius:0;
  transition:all var(--transition);
  position:relative;
  overflow:hidden;
}
.btn--primary{
  background:var(--color-black);
  color:#fff;
  border-color:var(--color-black);
}
.btn--primary:hover{
  background:var(--color-charcoal);
  border-color:var(--color-charcoal);
  transform:translateY(-2px);
}
.btn--ghost{
  background:transparent;
  color:#fff;
  border-color:rgba(255,255,255,.6);
}
.btn--ghost:hover{
  background:#fff;
  color:var(--color-black);
}

/* ===================================================
   NAV
   =================================================== */
.nav{
  position:fixed;
  top:0; left:0; right:0;
  z-index:100;
  background:rgba(255,255,255,0);
  transition:background var(--transition), border-color var(--transition), padding var(--transition);
  border-bottom:1px solid transparent;
}
.nav.is-scrolled{
  background:rgba(255,255,255,.95);
  backdrop-filter:blur(12px);
  -webkit-backdrop-filter:blur(12px);
  border-bottom-color:var(--color-line);
}
.nav__inner{
  display:flex;
  align-items:center;
  justify-content:space-between;
  max-width:var(--container);
  margin:0 auto;
  padding:18px clamp(20px,4vw,40px);
  transition:padding var(--transition);
}
.nav.is-scrolled .nav__inner{ padding-block:14px; }

.nav__brand{
  display:flex; align-items:center; gap:12px;
  color:#fff;
  transition:color var(--transition);
}
.nav.is-scrolled .nav__brand{ color:var(--color-black); }
.nav__brand-mark{
  display:inline-flex; align-items:center; justify-content:center;
  width:42px; height:42px;
  border:1px solid currentColor;
  font-family:var(--font-serif);
  font-size:18px;
  font-style:italic;
  font-weight:500;
  letter-spacing:.02em;
}
.nav__brand-name{
  font-family:var(--font-serif);
  font-size:18px;
  font-weight:500;
  letter-spacing:.02em;
}

.nav__links{
  display:flex; align-items:center; gap:36px;
}
.nav__links a{
  position:relative;
  color:#fff;
  font-size:13px;
  font-weight:400;
  letter-spacing:.12em;
  text-transform:uppercase;
  padding:8px 0;
  transition:color var(--transition);
}
.nav.is-scrolled .nav__links a{ color:var(--color-text); }
.nav__links a:not(.nav__cta)::after{
  content:""; position:absolute;
  left:0; bottom:2px;
  width:0; height:1px;
  background:currentColor;
  transition:width var(--transition);
}
.nav__links a:not(.nav__cta):hover::after{ width:100%; }
.nav__cta{
  padding:11px 22px !important;
  border:1px solid currentColor;
  font-weight:500 !important;
}
.nav__cta:hover{
  background:#fff;
  color:var(--color-black) !important;
}
.nav.is-scrolled .nav__cta:hover{
  background:var(--color-black);
  color:#fff !important;
}

.nav__toggle{
  display:none;
  flex-direction:column; justify-content:space-between;
  width:26px; height:18px;
  padding:0;
}
.nav__toggle span{
  display:block; width:100%; height:1.5px;
  background:#fff;
  transition:all var(--transition);
}
.nav.is-scrolled .nav__toggle span{ background:var(--color-text); }
.nav__toggle.is-open span:nth-child(1){ transform:translateY(8px) rotate(45deg); }
.nav__toggle.is-open span:nth-child(2){ opacity:0; }
.nav__toggle.is-open span:nth-child(3){ transform:translateY(-8px) rotate(-45deg); }

/* ===================================================
   HERO
   =================================================== */
.hero{
  position:relative;
  height:100vh;
  min-height:640px;
  max-height:1000px;
  overflow:hidden;
  color:#fff;
}
.hero__slides{
  position:absolute; inset:0;
}
.hero__slides .slide{
  position:absolute; inset:0;
  background-position:center;
  background-size:cover;
  opacity:0;
  transition:opacity 1.4s ease-in-out, transform 6s linear;
}
.hero__slides .slide.is-active{
  opacity:1;
  transform:scale(1.08);
}
.hero__overlay{
  position:absolute; inset:0;
  background:linear-gradient(180deg, rgba(0,0,0,.45) 0%, rgba(0,0,0,.25) 40%, rgba(0,0,0,.65) 100%);
}
.hero__content{
  position:relative;
  z-index:2;
  height:100%;
  display:flex; flex-direction:column;
  justify-content:center;
  align-items:flex-start;
  max-width:var(--container);
  margin:0 auto;
  padding:0 clamp(20px,4vw,40px);
}
.hero__eyebrow{
  font-size:11px;
  letter-spacing:.4em;
  text-transform:uppercase;
  color:rgba(255,255,255,.85);
  margin-bottom:24px;
  padding-left:42px;
  position:relative;
}
.hero__eyebrow::before{
  content:""; position:absolute;
  left:0; top:50%;
  width:32px; height:1px;
  background:#fff;
  transform:translateY(-50%);
}
.hero__title{
  font-family:var(--font-serif);
  font-weight:300;
  font-size:clamp(54px, 10vw, 124px);
  line-height:.96;
  letter-spacing:-.02em;
  margin:0 0 28px;
  text-shadow:0 4px 30px rgba(0,0,0,.3);
}
.hero__title em{
  font-style:italic;
  font-weight:300;
  display:inline-block;
}
.hero__subtitle{
  max-width:520px;
  font-size:clamp(15px,1.4vw,17px);
  color:rgba(255,255,255,.9);
  margin:0 0 40px;
  line-height:1.7;
}
.hero__actions{ display:flex; flex-wrap:wrap; gap:14px; }
.hero__scroll{
  position:absolute;
  bottom:32px; left:50%;
  transform:translateX(-50%);
  z-index:2;
  display:flex; flex-direction:column; align-items:center;
  gap:12px;
  color:rgba(255,255,255,.7);
  font-size:10px;
  letter-spacing:.3em;
  text-transform:uppercase;
}
.hero__scroll span{
  display:block; width:1px; height:50px;
  background:currentColor;
  animation:scrollPulse 2.2s ease-in-out infinite;
  transform-origin:top;
}
@keyframes scrollPulse{
  0%,100%{ transform:scaleY(0); opacity:0; }
  50%{ transform:scaleY(1); opacity:1; }
}

/* ===================================================
   ABOUT
   =================================================== */
.about{
  padding-block:var(--section-pad);
  background:var(--color-bg);
}
.about__grid{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:clamp(40px,8vw,120px);
  align-items:center;
}
.about__images{
  position:relative;
  height:clamp(420px,60vw,720px);
}
.about__img{
  position:absolute;
  margin:0;
  overflow:hidden;
  background:var(--color-bg-alt);
  transition:transform .8s ease;
}
.about__img img{
  width:100%; height:100%;
  object-fit:cover;
}
.about__img--1{
  top:0; left:0;
  width:72%; height:80%;
  z-index:2;
  box-shadow:var(--shadow-2);
}
.about__img--2{
  bottom:0; right:0;
  width:48%; height:55%;
  z-index:1;
}
.about__img:hover{ transform:translateY(-6px); }

.about__text p{
  font-size:16px;
  color:var(--color-text);
  margin:0 0 18px;
  line-height:1.8;
}
.about__text p strong{ color:var(--color-black); font-weight:500; }
.about__signature{
  font-family:var(--font-serif);
  font-style:italic;
  font-size:20px !important;
  color:var(--color-charcoal) !important;
  border-left:2px solid var(--color-charcoal);
  padding-left:18px;
  margin-top:32px !important;
}
.about__stats{
  display:flex;
  gap:clamp(20px,3vw,48px);
  margin-top:48px;
  padding-top:36px;
  border-top:1px solid var(--color-line);
}
.about__stats > div{
  display:flex; flex-direction:column;
}
.about__stats strong{
  font-family:var(--font-serif);
  font-size:38px;
  font-weight:400;
  color:var(--color-black);
  line-height:1;
}
.about__stats span{
  font-size:11px;
  letter-spacing:.18em;
  text-transform:uppercase;
  color:var(--color-muted);
  margin-top:6px;
}

/* ===================================================
   PACKAGES
   =================================================== */
.packages{
  padding-block:var(--section-pad);
  background:var(--color-bg-alt);
  position:relative;
}

.tabs{
  display:flex;
  justify-content:center;
  gap:0;
  margin-bottom:56px;
  flex-wrap:wrap;
  border-bottom:1px solid var(--color-line);
}
.tab{
  padding:18px 32px;
  font-size:13px;
  letter-spacing:.18em;
  text-transform:uppercase;
  color:var(--color-muted);
  font-weight:500;
  border-bottom:2px solid transparent;
  margin-bottom:-1px;
  transition:all var(--transition);
}
.tab:hover{ color:var(--color-text); }
.tab--active{
  color:var(--color-black);
  border-bottom-color:var(--color-black);
}

.tab-panel{ display:none; animation:fadeUp .6s ease; }
.tab-panel--active{ display:block; }
.panel__intro{
  text-align:center;
  max-width:640px;
  margin:0 auto 40px;
  color:var(--color-muted);
  font-family:var(--font-serif);
  font-style:italic;
  font-size:18px;
  line-height:1.6;
}

/* Destaque: nota de desconto na página de Parto (/gestante-parto) */
.parto-note{
  display:flex;
  flex-direction:column;
  align-items:center;
  gap:14px;
  max-width:560px;
  margin:36px auto 0;
  padding:28px 34px 26px;
  text-align:center;
  background:linear-gradient(160deg, #fbf8f1 0%, #f3ead9 100%);
  border:1px solid rgba(181,164,122,.55);
  border-radius:16px;
  box-shadow:0 12px 34px rgba(181,164,122,.22);
}
.parto-note__icon{
  display:flex; align-items:center; justify-content:center;
  width:50px; height:50px;
  border-radius:50%;
  background:var(--color-gold);
  color:#fff;
  box-shadow:0 6px 16px rgba(181,164,122,.5);
}
.parto-note__icon svg{ width:25px; height:25px; }
.parto-note__text{
  margin:0;
  font-family:var(--font-sans);
  font-size:16px;
  line-height:1.6;
  color:var(--color-charcoal-2);
}
.parto-note__text strong{ color:#9c854e; font-weight:700; }

/* Página de Parto: aproxima a seção "Veja mais" dos pacotes (estava muito afastada) */
.page-combo .packages{ padding-bottom:36px; }
.page-combo #veja-mais{ padding-top:12px; }
@keyframes fadeUp{
  from{ opacity:0; transform:translateY(20px); }
  to{ opacity:1; transform:translateY(0); }
}

.cards{
  display:grid;
  grid-template-columns:repeat(auto-fit, minmax(300px, 1fr));
  gap:24px;
  margin-bottom:56px;
}
.card{
  position:relative;
  background:#fff;
  padding:40px 32px;
  border:1px solid var(--color-line);
  display:flex; flex-direction:column;
  transition:all var(--transition);
}
.card:hover{
  transform:translateY(-6px);
  box-shadow:var(--shadow-2);
  border-color:transparent;
}
.card--featured{
  background:var(--color-black);
  color:#fff;
  border-color:var(--color-black);
  transform:translateY(-12px);
}
.card--featured:hover{ transform:translateY(-18px); }
.card__ribbon{
  position:absolute;
  top:0; right:24px;
  background:var(--color-gold);
  color:var(--color-black);
  font-size:10px;
  font-weight:600;
  letter-spacing:.22em;
  text-transform:uppercase;
  padding:6px 14px;
  transform:translateY(-50%);
}
.card__head{ margin-bottom:28px; }
.card__tag{
  display:block;
  font-size:10px;
  letter-spacing:.3em;
  text-transform:uppercase;
  color:var(--color-muted);
  margin-bottom:14px;
}
.card--featured .card__tag{ color:rgba(255,255,255,.6); }
.card__title{
  font-family:var(--font-serif);
  font-weight:400;
  font-size:32px;
  line-height:1.1;
  margin:0 0 18px;
  letter-spacing:-.005em;
}
.card__quote{
  font-family:var(--font-serif);
  font-style:italic;
  font-size:15px;
  color:var(--color-muted);
  line-height:1.6;
  margin:0;
}
.card--featured .card__quote{ color:rgba(255,255,255,.7); }
.card__price{
  padding:24px 0;
  border-top:1px solid var(--color-line);
  border-bottom:1px solid var(--color-line);
  margin-bottom:28px;
}
.card--featured .card__price{
  border-color:rgba(255,255,255,.15);
}
.card__price-value{
  font-family:var(--font-serif);
  font-size:46px;
  font-weight:400;
  line-height:1;
  display:block;
  margin-bottom:4px;
}
.card__price small{
  font-size:11px;
  letter-spacing:.18em;
  text-transform:uppercase;
  color:var(--color-muted);
}
.card--featured .card__price small{ color:rgba(255,255,255,.6); }
.card__list{
  list-style:none;
  padding:0; margin:0 0 32px;
  flex:1;
}
.card__list li{
  position:relative;
  padding:9px 0 9px 28px;
  font-size:14px;
  border-bottom:1px solid var(--color-line);
  color:var(--color-text);
}
.card--featured .card__list li{
  color:rgba(255,255,255,.88);
  border-color:rgba(255,255,255,.1);
}
.card__list li:last-child{ border-bottom:0; }
.card__list li::before{
  content:""; position:absolute;
  left:0; top:18px;
  width:14px; height:1px;
  background:var(--color-charcoal);
}
.card--featured .card__list li::before{ background:rgba(255,255,255,.6); }
.card__list li strong{ font-weight:600; color:var(--color-black); }
.card--featured .card__list li strong{ color:#fff; }

.card__cta{
  display:inline-block;
  padding:14px 28px;
  font-size:12px;
  font-weight:500;
  letter-spacing:.22em;
  text-transform:uppercase;
  border:1px solid var(--color-black);
  color:var(--color-black);
  text-align:center;
  transition:all var(--transition);
}
.card__cta:hover{
  background:var(--color-black);
  color:#fff;
}
.card--featured .card__cta{
  border-color:#fff;
  color:#fff;
}
.card--featured .card__cta:hover{
  background:#fff;
  color:var(--color-black);
}

/* ========== GOLD CARD (3º pacote — Premium) ========== */
.card--gold{
  background:
    linear-gradient(135deg, #c8b48a 0%, #b5a47a 50%, #9d8a5e 100%);
  color:#1f1a10;
  border-color:transparent;
  box-shadow:0 18px 50px rgba(157,138,94,.30);
}
.card--gold .card__tag{ color:rgba(0,0,0,.55); }
.card--gold .card__title{ color:#1a1408; }
.card--gold .card__quote{ color:rgba(26,20,8,.78); }
.card--gold .card__price{
  border-color:rgba(0,0,0,.15);
}
.card--gold .card__price small{ color:rgba(0,0,0,.6); }
.card--gold .card__list li{
  color:rgba(26,20,8,.88);
  border-color:rgba(0,0,0,.1);
}
.card--gold .card__list li::before{ background:rgba(26,20,8,.55); }
.card--gold .card__list li strong{ color:#0a0700; }

.card--gold .card__cta{
  border-color:#1a1408;
  color:#1a1408;
}
.card--gold .card__cta:hover{
  background:#1a1408;
  color:#d4be8a;
}

.card__ribbon--gold{
  background:#1a1408 !important;
  color:#d4be8a !important;
}

/* Masculino */
.masculino{
  display:flex; justify-content:center;
  padding:60px 0;
}
.masculino__text{
  max-width:540px;
  text-align:center;
  background:#fff;
  padding:56px 40px;
  border:1px solid var(--color-line);
}
.masculino__text h3{
  font-family:var(--font-serif);
  font-weight:400;
  font-size:36px;
  margin:0 0 24px;
}
.masculino__text p{
  color:var(--color-muted);
  font-size:15px;
  line-height:1.7;
  margin:0 0 18px;
}
.masculino__text .btn{ margin-top:16px; }

/* Extras */
.extras{
  background:#fff;
  padding:48px;
  border:1px solid var(--color-line);
}
.extras__title{
  font-family:var(--font-serif);
  font-weight:400;
  font-size:28px;
  margin:0 0 28px;
  text-align:center;
}
.extras__grid{
  display:grid;
  grid-template-columns:repeat(auto-fit, minmax(180px,1fr));
  gap:0;
}
.extras__item{
  padding:20px;
  text-align:center;
  border-right:1px solid var(--color-line);
  display:flex; flex-direction:column; gap:6px;
}
.extras__item:last-child{ border-right:0; }
.extras__item strong{
  font-size:13px;
  font-weight:500;
  letter-spacing:.05em;
  color:var(--color-text);
}
.extras__item span{
  font-family:var(--font-serif);
  font-size:22px;
  color:var(--color-charcoal);
}

/* ===================================================
   GALLERY (marquee)
   =================================================== */
.gallery{
  padding-block:var(--section-pad);
  background:#fff;
  overflow:hidden;
}

/* ---- MARQUEE (cada fileira) ---------------------------------- */
.marquee{
  margin-top:60px;
  min-height:380px;
  overflow:hidden;
  position:relative;
}
.marquee + .marquee{ margin-top:24px; }

/* Fade nas bordas via overlay — substituiu mask-image
   (mask-image dava glitch de compositing em iOS Safari) */
.marquee::before,
.marquee::after{
  content:"";
  position:absolute;
  top:0; bottom:0;
  width:80px;
  z-index:2;
  pointer-events:none;
}
.marquee::before{ left:0;  background:linear-gradient(to right, #fff, transparent); }
.marquee::after { right:0; background:linear-gradient(to left,  #fff, transparent); }

.marquee__track{
  display:flex;
  gap:24px;
  width:max-content;
  animation:marquee 70s linear infinite;
}
.marquee--reverse .marquee__track{
  animation-direction:reverse;
  animation-duration:90s;
}
.marquee:hover .marquee__track{ animation-play-state:paused; }

.marquee__item{
  width:280px;
  height:380px;
  overflow:hidden;
  flex-shrink:0;
  cursor:pointer;
  position:relative;
  /* skeleton suave enquanto a foto carrega */
  background:linear-gradient(110deg, var(--color-bg-alt) 30%, #ececea 50%, var(--color-bg-alt) 70%);
  background-size:200% 100%;
  animation:marquee-skel 1.8s ease-in-out infinite;
}
.marquee__item.is-loaded{ animation:none; background:var(--color-bg-alt); }
.marquee__item img{
  width:100%; height:100%;
  object-fit:cover;
  display:block;
  opacity:0;
  transition:opacity .35s ease, transform .8s ease;
}
.marquee__item.is-loaded img{ opacity:1; }
.marquee__item:hover img{ transform:scale(1.06); }

@keyframes marquee{
  from{ transform:translateX(0); }
  to{ transform:translateX(-50%); }
}
@keyframes marquee-skel{
  0%   { background-position:200% 0; }
  100% { background-position:-200% 0; }
}

/* ===================================================
   LOOKS — carrossel horizontal
   =================================================== */
.looks{
  padding-block:var(--section-pad);
  background:var(--color-bg-alt);
  overflow:hidden;
}

.looks__carousel{
  position:relative;
  margin:40px 0 24px;
}

.looks__scroller{
  display:flex;
  gap:20px;
  overflow-x:auto;
  overflow-y:hidden;
  scroll-snap-type:x mandatory;
  scroll-behavior:smooth;
  padding:8px clamp(20px,4vw,40px) 28px;
  scrollbar-width:none;            /* Firefox */
  -ms-overflow-style:none;          /* IE/Edge */
  cursor:grab;
  user-select:none;
}
.looks__scroller::-webkit-scrollbar{ display:none; }
.looks__scroller.is-grabbing{
  cursor:grabbing;
  scroll-behavior:auto;
}

.looks__item{
  flex:0 0 auto;
  width:clamp(220px, 22vw, 320px);
  aspect-ratio:3/4;
  background:#fff;
  overflow:hidden;
  cursor:pointer;
  position:relative;
  scroll-snap-align:start;
  box-shadow:0 6px 24px rgba(0,0,0,.04);
  transition:transform .35s ease, box-shadow .35s ease;
}
.looks__item img{
  width:100%; height:100%;
  object-fit:cover;
  pointer-events:none;             /* avoid drag-image during swipe */
  transition:transform .8s ease, filter .4s ease;
}
.looks__item:hover{
  transform:translateY(-4px);
  box-shadow:0 14px 36px rgba(0,0,0,.12);
}
.looks__item:hover img{
  transform:scale(1.04);
  filter:brightness(.94);
}
.looks__item::after{
  content:"+";
  position:absolute;
  inset:0;
  display:flex; align-items:center; justify-content:center;
  background:rgba(0,0,0,0);
  color:#fff;
  font-family:var(--font-serif);
  font-size:48px;
  font-weight:300;
  opacity:0;
  transition:all .4s ease;
  pointer-events:none;
}
.looks__item:hover::after{
  background:rgba(0,0,0,.25);
  opacity:1;
}

/* Prev / Next buttons */
.looks__nav{
  position:absolute;
  top:50%;
  transform:translateY(-50%);
  z-index:5;
  width:52px; height:52px;
  display:flex; align-items:center; justify-content:center;
  background:#fff;
  border:1px solid var(--color-line);
  border-radius:50%;
  color:var(--color-black);
  box-shadow:0 8px 22px rgba(0,0,0,.08);
  transition:all var(--transition);
}
.looks__nav:hover{
  background:var(--color-black);
  color:#fff;
  border-color:var(--color-black);
  transform:translateY(-50%) scale(1.06);
}
.looks__nav:disabled{
  opacity:.3;
  cursor:not-allowed;
  transform:translateY(-50%);
}
.looks__nav--prev{ left:clamp(8px, 2vw, 32px); }
.looks__nav--next{ right:clamp(8px, 2vw, 32px); }

/* Progress bar (track of horizontal scroll) */
.looks__progress{
  width:100%;
  max-width:240px;
  height:1px;
  background:rgba(0,0,0,.12);
  margin:0 auto 40px;
  position:relative;
  overflow:hidden;
}
.looks__progress-bar{
  position:absolute;
  left:0; top:0;
  height:100%;
  background:var(--color-black);
  transition:width .15s linear, transform .15s linear;
  width:0;
}

.looks__info{
  background:#fff;
  border:1px solid var(--color-line);
  margin-top:8px;
}
.looks__info summary{
  padding:20px 28px;
  font-size:13px;
  font-weight:500;
  letter-spacing:.18em;
  text-transform:uppercase;
  cursor:pointer;
  list-style:none;
  position:relative;
}
.looks__info summary::-webkit-details-marker{ display:none; }
.looks__info summary::after{
  content:"+";
  position:absolute;
  right:28px; top:50%;
  transform:translateY(-50%);
  font-size:22px;
  transition:transform var(--transition);
  font-family:var(--font-serif);
}
.looks__info[open] summary::after{ transform:translateY(-50%) rotate(45deg); }
.looks__info ul{
  margin:0; padding:0 28px 28px 50px;
}
.looks__info ul li{
  font-size:14px;
  color:var(--color-muted);
  margin-bottom:10px;
  line-height:1.6;
}
.looks__info ul li strong{ color:var(--color-text); font-weight:500; }

/* ===================================================
   INFO
   =================================================== */
.info{
  padding-block:var(--section-pad);
  background:#fff;
}
.info__grid{
  display:grid;
  grid-template-columns:repeat(auto-fit, minmax(280px,1fr));
  gap:0;
  border-top:1px solid var(--color-line);
  border-left:1px solid var(--color-line);
}
.info__card{
  padding:40px 32px;
  border-right:1px solid var(--color-line);
  border-bottom:1px solid var(--color-line);
  position:relative;
}
.info__num{
  font-family:var(--font-serif);
  font-size:14px;
  color:var(--color-gold);
  letter-spacing:.18em;
  display:block;
  margin-bottom:18px;
}
.info__card h4{
  font-family:var(--font-serif);
  font-size:24px;
  font-weight:400;
  margin:0 0 14px;
}
.info__card p{
  margin:0;
  font-size:14px;
  color:var(--color-muted);
  line-height:1.7;
}
.info__card p strong{ color:var(--color-charcoal); font-weight:500; }

/* ===================================================
   CONTATO
   =================================================== */
.contact{
  background:var(--color-charcoal-2);
  color:#fff;
  padding-block:var(--section-pad);
  position:relative;
  overflow:hidden;
}
.contact::before{
  content:"";
  position:absolute;
  inset:0;
  background:radial-gradient(circle at 80% 20%, rgba(255,255,255,.04), transparent 50%);
  pointer-events:none;
}
.contact__inner{
  position:relative;
  max-width:780px;
  margin:0 auto;
  text-align:center;
}
.contact .section__eyebrow{ color:rgba(255,255,255,.7); }
.contact .section__eyebrow::before{ background:rgba(255,255,255,.7); }
.contact .section__title{ color:#fff; }
.contact .section__title em{ color:var(--color-gold); }
.contact__header p{
  max-width:520px;
  margin:24px auto 0;
  color:rgba(255,255,255,.7);
  font-size:16px;
}
.contact__actions{
  display:flex;
  flex-wrap:wrap;
  gap:18px;
  justify-content:center;
  margin-top:56px;
}
.contact__btn{
  display:flex; align-items:center; gap:16px;
  padding:18px 28px;
  background:rgba(255,255,255,.04);
  border:1px solid rgba(255,255,255,.15);
  transition:all var(--transition);
  text-align:left;
}
.contact__btn:hover{
  background:#fff;
  color:var(--color-black);
  border-color:#fff;
  transform:translateY(-4px);
}
.contact__btn svg{ flex-shrink:0; }
.contact__btn span{
  display:flex; flex-direction:column;
}
.contact__btn strong{
  font-size:14px;
  font-weight:500;
  letter-spacing:.04em;
}
.contact__btn small{
  font-size:11px;
  letter-spacing:.18em;
  text-transform:uppercase;
  opacity:.65;
  margin-top:2px;
}
.contact__btn--wpp:hover{ color:#25D366; }
.contact__btn--ig:hover{
  background:linear-gradient(45deg, #f09433, #e6683c, #dc2743, #cc2366, #bc1888);
  color:#fff;
  border-color:transparent;
}

/* ===================================================
   FOOTER
   =================================================== */
.footer{
  background:var(--color-black);
  color:rgba(255,255,255,.6);
  padding:40px 0;
}
.footer__inner{
  display:flex;
  align-items:center;
  justify-content:space-between;
  flex-wrap:wrap;
  gap:24px;
}
.footer__brand{ display:flex; align-items:center; gap:14px; color:#fff; }
.footer__mark{
  display:inline-flex; align-items:center; justify-content:center;
  width:42px; height:42px;
  border:1px solid currentColor;
  font-family:var(--font-serif);
  font-size:18px;
  font-style:italic;
  font-weight:500;
  letter-spacing:.02em;
}
.footer__brand > div > strong{
  display:block;
  font-family:var(--font-serif);
  font-size:18px;
  font-weight:500;
}
.footer__brand > div > span{
  display:block;
  font-size:11px;
  letter-spacing:.18em;
  text-transform:uppercase;
  color:rgba(255,255,255,.5);
  margin-top:2px;
}
.footer__copy{
  font-size:12px;
  letter-spacing:.06em;
  margin:0;
}

/* ===================================================
   LIGHTBOX
   =================================================== */
.lightbox{
  position:fixed;
  inset:0;
  z-index:999;
  background:rgba(10,10,10,.95);
  display:none;
  align-items:center;
  justify-content:center;
}
.lightbox.is-open{ display:flex; animation:fadeIn .3s ease; }
@keyframes fadeIn{ from{ opacity:0; } to{ opacity:1; } }
.lightbox img{
  max-width:90vw;
  max-height:85vh;
  object-fit:contain;
  box-shadow:0 30px 80px rgba(0,0,0,.6);
}
.lightbox__close,
.lightbox__prev,
.lightbox__next{
  position:absolute;
  color:#fff;
  background:rgba(255,255,255,.06);
  border:1px solid rgba(255,255,255,.15);
  width:48px; height:48px;
  display:flex; align-items:center; justify-content:center;
  font-size:24px;
  transition:all var(--transition);
}
.lightbox__close{ top:24px; right:24px; }
.lightbox__prev{ left:24px; top:50%; transform:translateY(-50%); }
.lightbox__next{ right:24px; top:50%; transform:translateY(-50%); }
.lightbox__close:hover,
.lightbox__prev:hover,
.lightbox__next:hover{ background:#fff; color:var(--color-black); }

/* ===================================================
   FLOAT WHATSAPP
   =================================================== */
.float-wpp{
  position:fixed;
  bottom:24px; right:24px;
  z-index:50;
  width:56px; height:56px;
  background:#25D366;
  color:#fff;
  border-radius:50%;
  display:flex; align-items:center; justify-content:center;
  box-shadow:0 12px 30px rgba(37,211,102,.4);
  transition:transform var(--transition);
}
.float-wpp:hover{ transform:scale(1.1) rotate(8deg); }

/* ===================================================
   ANIMATIONS — reveal on scroll
   =================================================== */
.reveal{ opacity:0; transform:translateY(40px); transition:all .9s cubic-bezier(.2,.6,.2,1); }
.reveal.is-visible{ opacity:1; transform:none; }
.reveal.delay-1{ transition-delay:.12s; }
.reveal.delay-2{ transition-delay:.24s; }
.reveal.delay-3{ transition-delay:.36s; }

/* ===================================================
   BADGE / CTA — link para a página de looks
   =================================================== */
.looks__cta{
  display:inline-flex;
  align-items:center;
  gap:12px;
  margin-top:30px;
  padding:14px 30px;
  font-size:12px;
  font-weight:500;
  letter-spacing:.22em;
  text-transform:uppercase;
  color:#fff;
  background:var(--color-black);
  border:1px solid var(--color-black);
  transition:all var(--transition);
}
.looks__cta span{ font-size:16px; line-height:1; transition:transform var(--transition); }
.looks__cta:hover{
  background:var(--color-charcoal);
  border-color:var(--color-charcoal);
  transform:translateY(-2px);
}
.looks__cta:hover span{ transform:translateX(5px); }

/* Botão invertido (branco c/ texto preto) — hero da página de orçamento */
.btn--invert{
  background:#fff;
  color:var(--color-black);
  border-color:#fff;
}
.btn--invert:hover{
  background:transparent;
  color:#fff;
  border-color:#fff;
  transform:translateY(-2px);
}

/* Ênfase no bloco "Vamos agendar?" (contato da página inicial) */
.contact--agendar .section__title{ font-size:clamp(42px, 6.5vw, 78px); }

/* ===================================================
   LOOKBOOK — página dedicada /looks
   =================================================== */
.page-inner .nav{
  background:rgba(255,255,255,.95);
  backdrop-filter:blur(12px);
  -webkit-backdrop-filter:blur(12px);
  border-bottom:1px solid var(--color-line);
}
.page-inner .nav__brand,
.page-inner .nav__links a{ color:var(--color-text); }
.page-inner .nav__toggle span{ background:var(--color-text); }

.lookbook{
  padding-block:var(--section-pad);
  background:#fff;
}
.lookbook .inner-hero{
  padding-top:120px;
  margin-bottom:48px;
}
.lookbook__grid{
  display:grid;
  grid-template-columns:repeat(auto-fill, minmax(260px, 1fr));
  gap:16px;
}
.lookbook__item{
  position:relative;
  aspect-ratio:3/4;
  overflow:hidden;
  cursor:pointer;
  background:linear-gradient(110deg, var(--color-bg-alt) 30%, #ececea 50%, var(--color-bg-alt) 70%);
  background-size:200% 100%;
  animation:marquee-skel 1.8s ease-in-out infinite;
}
.lookbook__item.is-loaded{ animation:none; background:var(--color-bg-alt); }
.lookbook__item img{
  width:100%; height:100%;
  object-fit:cover;
  opacity:0;
  transition:opacity .35s ease, transform .8s ease;
}
.lookbook__item.is-loaded img{ opacity:1; }
.lookbook__item:hover img{ transform:scale(1.05); }
.lookbook__item::after{
  content:"+";
  position:absolute; inset:0;
  display:flex; align-items:center; justify-content:center;
  background:rgba(0,0,0,0);
  color:#fff;
  font-family:var(--font-serif);
  font-size:48px; font-weight:300;
  opacity:0;
  transition:all .4s ease;
  pointer-events:none;
}
.lookbook__item:hover::after{ background:rgba(0,0,0,.25); opacity:1; }
.lookbook__empty{
  text-align:center;
  color:var(--color-muted);
  padding:50px 20px;
  font-family:var(--font-serif);
  font-style:italic;
  font-size:20px;
}

/* Álbuns da galeria "Momentos de Parto" (/momentos-parto) */
.parto-album{ margin-bottom:56px; }
.parto-album:last-child{ margin-bottom:0; }
.parto-album__title{
  font-family:var(--font-serif);
  font-weight:500;
  font-size:clamp(24px, 3.4vw, 34px);
  color:var(--color-text);
  margin:0 0 22px;
  padding-bottom:12px;
  border-bottom:1px solid var(--color-line);
}
.parto-album__title::before{
  content:"";
  display:inline-block;
  width:26px; height:1px;
  background:var(--color-gold);
  vertical-align:middle;
  margin-right:12px;
}

/* ===================================================
   RESPONSIVE
   =================================================== */
@media (max-width:980px){
  .about__grid{ grid-template-columns:1fr; }
  .about__images{ width:100%; height:560px; max-width:520px; margin:0 auto; }

  .nav__toggle{ display:flex; }
  .nav__links{
    position:fixed;
    top:0; right:-100%;
    width:80%;
    max-width:380px;
    height:100vh;
    background:#fff;
    flex-direction:column;
    justify-content:center;
    align-items:flex-start;
    padding:80px 40px;
    gap:24px;
    box-shadow:-20px 0 60px rgba(0,0,0,.1);
    transition:right .4s ease;
  }
  .nav__links.is-open{ right:0; }
  .nav__links a{ color:var(--color-text) !important; font-size:14px; }

  .card--featured{ transform:none; }
  .card--featured:hover{ transform:translateY(-6px); }

  .extras__grid{ grid-template-columns:repeat(2,1fr); }
  .extras__item{
    border-right:0; border-bottom:1px solid var(--color-line);
  }
  .extras__item:nth-child(odd){ border-right:1px solid var(--color-line); }

  .marquee__item{ width:220px; height:300px; }
  .marquee{ min-height:300px; }
  .looks__nav{ width:44px; height:44px; }
}

@media (max-width:640px){
  .nav__brand-name{ display:none; }
  .hero{ min-height:560px; }
  .hero__title{ font-size:54px; }
  .hero__subtitle{ font-size:14px; }
  .extras{ padding:32px 20px; }
  .extras__grid{ grid-template-columns:1fr; }
  .extras__item{ border-right:0 !important; }
  .about__stats{ flex-wrap:wrap; gap:24px; }
  .about__stats strong{ font-size:32px; }
  .contact__btn{ flex:1 1 100%; max-width:340px; }
  .marquee__item{ width:180px; height:240px; }
  .marquee{ min-height:240px; }
  .looks__nav{ display:none; }      /* mobile: usa swipe direto */
  .looks__item{ width:75vw; }       /* mostra um look + peek do próximo */
  .info__card{ padding:32px 24px; }
  .card{ padding:32px 24px; }
  .lookbook__grid{ grid-template-columns:repeat(2, 1fr); gap:10px; }
  .lookbook .inner-hero{ padding-top:100px; }
}

/* ===================================================
   COMBO Gestante + Parto (banner de venda combinada)
   =================================================== */
.combo{
  margin:72px 0 64px;
  background:var(--color-charcoal-2);
  padding:64px 48px;
  text-align:center;
  border-radius:var(--radius);
  position:relative;
  overflow:hidden;
}
.combo::before{
  content:'';
  position:absolute;
  top:0; left:50%;
  transform:translateX(-50%);
  width:72px; height:2px;
  background:var(--color-gold);
}
.combo__eyebrow{
  display:block;
  font-size:11px;
  letter-spacing:.26em;
  text-transform:uppercase;
  color:var(--color-gold);
  margin-bottom:16px;
}
.combo__title{
  font-family:var(--font-serif);
  font-weight:400;
  font-size:clamp(32px, 4.5vw, 46px);
  color:#fff;
  margin:0 0 16px;
}
.combo__text{
  max-width:600px;
  margin:0 auto 20px;
  color:rgba(255,255,255,.72);
  font-size:15px;
  line-height:1.75;
}
.combo__highlight{
  display:inline-block;
  font-family:var(--font-serif);
  font-style:italic;
  font-size:22px;
  color:var(--color-gold);
  margin-bottom:30px;
}
.combo__actions{ display:flex; justify-content:center; }
.combo__cta{
  display:inline-block;
  background:#fff;
  color:var(--color-black);
  padding:17px 44px;
  font-size:12px;
  letter-spacing:.2em;
  text-transform:uppercase;
  font-weight:500;
  transition:all var(--transition);
}
.combo__cta:hover{
  background:var(--color-gold);
  color:#0a0700;
}
@media (max-width:640px){
  .combo{ padding:44px 24px; margin:56px 0 48px; }
  .combo__highlight{ font-size:19px; }
  .combo__cta{ width:100%; max-width:340px; }
}

/* ===================================================
   CAMPANHA DE NATAL — /natal
   Tema "Refúgio do Natal": verde floresta · bordô ·
   whisky · creme · off white · dourado envelhecido
   =================================================== */
.page-natal{
  --natal-green:      #384030;   /* verde floresta */
  --natal-green-deep: #242B1F;   /* verde profundo (fundos escuros) */
  --natal-bordo:      #6E1B23;   /* bordô */
  --natal-whisky:     #9C4B22;   /* whisky / couro */
  --natal-creme:      #E9DCC6;   /* creme */
  --natal-offwhite:   #FAF7F1;   /* branco off white */
  --natal-gold:       #C7A35C;   /* dourado envelhecido */
  /* Versão clara do dourado, para texto pequeno sobre o verde escuro:
     o #C7A35C fica em 3.9:1 de contraste ali, abaixo do mínimo legível. */
  --natal-gold-light: #DCC08A;
  /* Dourado fechado, para texto sobre creme: o #C7A35C fica em 2.2:1 ali,
     ilegível. Este mantém a cara de dourado envelhecido e passa no contraste. */
  --natal-gold-deep:  #9A7433;

  /* Reaproveita os componentes existentes trocando a paleta base */
  --color-bg:        var(--natal-offwhite);
  --color-bg-alt:    #F2EAD9;
  --color-text:      #2B2A26;
  --color-muted:     #7A7266;
  --color-line:      #DFD2BC;
  --color-charcoal:  var(--natal-green);
  --color-charcoal-2:var(--natal-green-deep);
  --color-black:     var(--natal-green-deep);
  --color-gold:      var(--natal-gold);
}

/* --- Nav --- */
.page-natal .nav.is-scrolled{
  background:rgba(250,247,241,.94);
  border-bottom-color:var(--natal-creme);
}
.page-natal .nav__cta{ border-color:rgba(255,255,255,.7); }
.page-natal .nav.is-scrolled .nav__cta{
  background:var(--natal-bordo);
  border-color:var(--natal-bordo);
  color:#fff;
}
.page-natal .nav.is-scrolled .nav__cta:hover{
  background:var(--natal-green-deep);
  border-color:var(--natal-green-deep);
}

/* --- Hero --- */
.page-natal .hero__overlay{
  background:
    /* véu da esquerda: as fotos têm luzes claras que apagavam o texto dourado */
    linear-gradient(90deg, rgba(20,24,17,.78) 0%, rgba(20,24,17,.55) 34%, rgba(20,24,17,.12) 62%, rgba(20,24,17,0) 100%),
    radial-gradient(120% 90% at 50% 100%, rgba(36,43,31,.7) 0%, rgba(36,43,31,0) 62%),
    linear-gradient(180deg, rgba(20,24,17,.5) 0%, rgba(20,24,17,.2) 42%, rgba(20,24,17,.72) 100%);
}
@media (max-width:760px){
  /* no celular o texto ocupa a largura toda, então o véu precisa ser parelho */
  .page-natal .hero__overlay{
    background:
      linear-gradient(180deg, rgba(20,24,17,.62) 0%, rgba(20,24,17,.45) 40%, rgba(20,24,17,.85) 100%);
  }
}
.page-natal .hero__eyebrow{ color:var(--natal-gold); }
.page-natal .hero__eyebrow::before{ background:var(--natal-gold); }
.page-natal .hero__title em{ color:var(--natal-creme); }
.page-natal .btn--invert{
  background:var(--natal-bordo);
  border-color:var(--natal-bordo);
  color:#fff;
}
.page-natal .btn--invert:hover{
  background:var(--natal-gold);
  border-color:var(--natal-gold);
  color:var(--natal-green-deep);
}

/* Selo de urgência acima do título */
.natal-badge{
  display:inline-flex;
  align-items:center;
  gap:9px;
  align-self:flex-start;
  margin-bottom:22px;
  padding:8px 18px;
  border:1px solid rgba(199,163,92,.55);
  background:rgba(110,27,35,.42);
  backdrop-filter:blur(6px);
  color:var(--natal-creme);
  font-size:11px;
  font-weight:500;
  letter-spacing:.22em;
  text-transform:uppercase;
}
.natal-badge::before{
  content:'';
  width:6px; height:6px;
  border-radius:50%;
  background:var(--natal-gold-light);
  box-shadow:0 0 0 0 rgba(199,163,92,.7);
  animation:natalPulse 2.4s ease-out infinite;
}
@keyframes natalPulse{
  0%   { box-shadow:0 0 0 0 rgba(199,163,92,.7); }
  70%  { box-shadow:0 0 0 9px rgba(199,163,92,0); }
  100% { box-shadow:0 0 0 0 rgba(199,163,92,0); }
}
@media (prefers-reduced-motion:reduce){
  .natal-badge::before{ animation:none; }
}

/* --- Seção de vídeo --- */
.video-section{
  padding-block:var(--section-pad);
  background:var(--natal-green-deep);
  color:var(--natal-offwhite);
}
.video-section .section__eyebrow{ color:var(--natal-gold-light); }
.video-section .section__eyebrow::before{ background:var(--natal-gold-light); }
.video-section .section__title{ color:var(--natal-offwhite); }
.video-section .section__title em{ color:var(--natal-creme); }
.video-section .section__lead{ color:rgba(250,247,241,.66); }

.video-frame{
  position:relative;
  max-width:920px;
  margin:0 auto;
  aspect-ratio:16 / 9;
  background:#11150D;
  border:1px solid rgba(199,163,92,.28);
  box-shadow:0 30px 80px rgba(0,0,0,.45);
  overflow:hidden;
}
.video-frame__player{
  position:absolute; inset:0;
  width:100%; height:100%;
  border:0;
  display:block;
  object-fit:cover;
  background:#11150D;
}
/* Capa clicável — o player externo só carrega no clique */
.video-frame__facade{
  position:absolute; inset:0;
  width:100%; height:100%;
  padding:0;
  display:flex;
  align-items:center;
  justify-content:center;
  background-color:var(--natal-green);
  background-size:cover;
  background-position:center;
  cursor:pointer;
  transition:filter var(--transition);
}
.video-frame__facade::after{
  content:'';
  position:absolute; inset:0;
  background:linear-gradient(180deg, rgba(20,24,17,.25) 0%, rgba(20,24,17,.55) 100%);
}
.video-frame__facade:hover{ filter:brightness(1.08); }
.video-frame__play{
  position:relative;
  z-index:2;
  width:84px; height:84px;
  border-radius:50%;
  background:rgba(110,27,35,.9);
  border:1px solid rgba(199,163,92,.6);
  display:flex;
  align-items:center;
  justify-content:center;
  transition:transform var(--transition), background var(--transition);
}
.video-frame__play::before{
  content:'';
  width:0; height:0;
  margin-left:6px;
  border-style:solid;
  border-width:15px 0 15px 24px;
  border-color:transparent transparent transparent var(--natal-creme);
}
.video-frame__facade:hover .video-frame__play{
  transform:scale(1.08);
  background:var(--natal-gold);
}
.video-frame__facade:hover .video-frame__play::before{
  border-left-color:var(--natal-green-deep);
}
@media (max-width:640px){
  .video-frame__play{ width:64px; height:64px; }
  .video-frame__play::before{ border-width:12px 0 12px 19px; }
}

/* --- Pacotes --- */
/* Fundo verde floresta. Começa num verde mais claro que o da seção de vídeo
   (logo acima) e escurece descendo — assim os dois blocos escuros não se
   fundem num só. O brilho quente no topo simula a luz de vela do cenário. */
.packages--natal{
  position:relative;
  color:var(--natal-offwhite);
  background:
    radial-gradient(130% 70% at 50% 0%, rgba(156,75,34,.20) 0%, rgba(156,75,34,0) 58%),
    linear-gradient(180deg, #414A38 0%, var(--natal-green) 42%, var(--natal-green-deep) 100%);
}
/* Fio dourado separando do bloco do vídeo */
.packages--natal::before{
  content:'';
  position:absolute;
  top:0; left:50%;
  transform:translateX(-50%);
  width:min(760px, 78%);
  height:1px;
  background:linear-gradient(90deg, transparent, rgba(199,163,92,.8), transparent);
}

/* Títulos da seção: branco com a palavra em itálico em dourado */
.packages--natal .section__eyebrow{ color:var(--natal-gold-light); }
.packages--natal .section__eyebrow::before{ background:var(--natal-gold-light); }
.packages--natal .section__title{ color:var(--natal-offwhite); }
.packages--natal .section__title em{ color:var(--natal-gold); }
.packages--natal .section__lead{ color:rgba(250,247,241,.72); }

/* Card simples: creme em vez de branco puro — sobre o verde o branco estoura.
   Precisa do `color` próprio porque a seção agora define texto branco; sem ele
   o título herdaria branco sobre creme e sumiria. O :not() é essencial: os
   cards bordô e dourado têm as cores deles e não podem receber texto escuro. */
.page-natal .card:not(.card--featured):not(.card--gold){
  background:var(--natal-offwhite);
  border-color:rgba(199,163,92,.34);
  color:#2B2A26;
}
.page-natal .card:hover{ box-shadow:0 26px 64px rgba(0,0,0,.40); }
.page-natal .card--featured{
  background:var(--natal-bordo);
  /* contorno dourado para o bordô destacar do fundo verde */
  border-color:rgba(199,163,92,.55);
}
.page-natal .card__ribbon{
  background:var(--natal-gold);
  color:var(--natal-green-deep);
}
/* 3º pacote — dourado envelhecido sobre madeira/whisky */
.page-natal .card--gold{
  background:linear-gradient(135deg, #D8BE8A 0%, var(--natal-gold) 52%, #9C7B3E 100%);
  color:#2A2010;
  border-color:transparent;
  box-shadow:0 20px 54px rgba(156,123,62,.34);
}
.page-natal .card--gold .card__price-value{ color:#3A2A12; }
.page-natal .card--gold .card__cta{
  background:transparent;
  border-color:#3A2A12;
  color:#3A2A12;
}
.page-natal .card--gold .card__cta:hover{
  background:var(--natal-green-deep);
  border-color:var(--natal-green-deep);
  color:var(--natal-creme);
}
.page-natal .card__price-value{ color:var(--natal-bordo); }
.page-natal .card--featured .card__price-value{ color:var(--natal-creme); }
.page-natal .card__cta{
  background:var(--natal-green);
  border-color:var(--natal-green);
  color:#fff;
}
.page-natal .card__cta:hover{
  background:var(--natal-gold);
  border-color:var(--natal-gold);
  color:var(--natal-green-deep);
}
.page-natal .card--featured .card__cta{
  background:var(--natal-creme);
  border-color:var(--natal-creme);
  color:var(--natal-bordo);
}
.page-natal .card--featured .card__cta:hover{
  background:var(--natal-gold);
  border-color:var(--natal-gold);
  color:var(--natal-green-deep);
}

/* --- Condições --- */
.info--natal{ background:var(--natal-offwhite); }
.page-natal .info__card{
  background:#fff;
  border-color:var(--natal-creme);
}
.page-natal .info__num{ color:var(--natal-gold); }

/* --- Contato --- */
.contact--natal{ background:var(--natal-green-deep); }
.page-natal .contact .section__eyebrow{ color:var(--natal-gold-light); }
.page-natal .contact .section__eyebrow::before{ background:var(--natal-gold-light); }
.page-natal .contact__btn--wpp:hover,
.page-natal .contact__btn--ig:hover{ border-color:var(--natal-gold); }

.natal-closing{
  margin:56px 0 0;
  text-align:center;
  font-family:var(--font-serif);
  font-style:italic;
  font-size:clamp(19px, 2.4vw, 25px);
  letter-spacing:.06em;
  color:var(--natal-gold);
}
.natal-closing:empty{ display:none; }

/* --- Footer --- */
.page-natal .footer{ background:#171B12; }
.page-natal .footer__mark{ color:var(--natal-gold); }

/* --- Botão flutuante do WhatsApp --- */
.page-natal .float-wpp{ background:var(--natal-bordo); }
.page-natal .float-wpp:hover{ background:var(--natal-green); }

/* Link da campanha de Natal no menu das demais páginas */
.nav__natal{ color:var(--color-gold) !important; }
.nav.is-scrolled .nav__natal{ color:#9a7d3c !important; }

/* ===================================================
   /natal — SEÇÕES DA CAMPANHA REESTRUTURADA
   Ordem: topo → vídeo → cenário → experiência → pacotes
          → urgência → prova social → dúvidas → condições → fechamento
   Ritmo de fundos alternando escuro e claro.
   =================================================== */

/* Transições mais lentas e suaves nesta página */
.page-natal .reveal{ transition:opacity 1.35s cubic-bezier(.2,.6,.2,1), transform 1.35s cubic-bezier(.2,.6,.2,1); }
.page-natal .reveal.delay-1{ transition-delay:.18s; }
.page-natal .reveal.delay-2{ transition-delay:.36s; }
.page-natal .reveal.delay-3{ transition-delay:.54s; }

/* ---- Fonte do título do Refúgio ---- */
@font-face{
  font-family:'Baby Algutta';
  src:url('../fonts/baby-algutta.woff2') format('woff2');
  font-weight:400;
  font-style:normal;
  font-display:swap;   /* mostra o texto na fonte reserva enquanto carrega */
}
/* Só o título do topo da /natal usa a fonte da campanha */
.page-natal .hero__title{
  font-family:'Baby Algutta', var(--font-serif), serif;
  /* duas linhas, com bastante presença em qualquer tela.
     O limite em vh evita que, em janelas baixas, o título empurre o selo
     para debaixo da barra de navegação. */
  font-size:min(clamp(76px, 21vw, 170px), 20vh);
  line-height:1.04;
  margin-bottom:10px;   /* a frase fica colada no título */
  letter-spacing:0;
}
.page-natal .hero__title em{
  font-style:normal;   /* a fonte já é cursiva; o itálico sintético a deforma */
}
/* Título dos pacotes na mesma fonte da campanha */
.packages--natal .section__title{
  font-family:'Baby Algutta', var(--font-serif), serif;
  /* mínimo mais alto para não ficar acanhado no celular */
  font-size:clamp(56px, 7vw, 84px);
  line-height:1.12;
  letter-spacing:0;
}
.packages--natal .section__title em{ font-style:normal; }

/* ---- Pontos de luz (luzinhas da árvore) ---- */
.sparkles{
  position:absolute; inset:0;
  z-index:1;
  pointer-events:none;
  overflow:hidden;
}
.sparkle{
  position:absolute;
  width:var(--size,3px);
  height:var(--size,3px);
  border-radius:50%;
  background:var(--natal-gold-light);
  opacity:0;
  box-shadow:0 0 8px 2px rgba(220,192,138,.55);
  animation:sparkleGlow 7s ease-in-out infinite;
}
@keyframes sparkleGlow{
  0%, 100% { opacity:0;   transform:scale(.6); }
  45%      { opacity:.85; transform:scale(1); }
  60%      { opacity:.55; transform:scale(.9); }
}
@media (prefers-reduced-motion:reduce){
  .sparkle{ animation:none; opacity:.35; }
}

/* ---- 2 · Vídeo: frase de convite ---- */
.video-intro{
  max-width:680px;
  margin:0 auto;
  font-family:var(--font-serif);
  font-style:normal;
  font-size:clamp(20px, 2.4vw, 27px);
  line-height:1.6;
  color:var(--natal-creme);
}
.video-intro:empty{ display:none; }
.section__lead--center{ text-align:center; margin-inline:auto; }
.video-section .section__lead--center{ margin-top:32px; }

/* ---- 3 · Revelação do cenário ---- */
.reveal-scene{
  padding-block:var(--section-pad) 0;
  background:var(--natal-offwhite);
  color:var(--color-text);
}
.reveal-scene .section__title{ color:var(--natal-gold-deep); }
.reveal-scene .section__title em{ color:var(--natal-whisky); }

/* Foto grande de abertura */
.reveal-scene__stage{
  margin:0 0 clamp(40px,6vw,72px);
  position:relative;
  overflow:hidden;
  background:var(--natal-creme);
}
.reveal-scene__stage img{
  width:100%;
  height:clamp(320px, 62vh, 720px);
  object-fit:cover;
  opacity:0;
  transform:scale(1.04);
  transition:opacity 1.4s ease, transform 2.4s ease;
}
.reveal-scene__stage.is-loaded img{ opacity:1; transform:none; }
.reveal-scene__stage figcaption{
  position:absolute;
  left:0; right:0; bottom:0;
  padding:56px clamp(20px,4vw,40px) 24px;
  background:linear-gradient(180deg, transparent, rgba(20,24,17,.75));
  color:var(--natal-creme);
  font-family:var(--font-serif);
  font-style:italic;
  font-size:clamp(16px,2vw,21px);
  text-align:center;
}

/* Frases curtas */
.reveal-scene__lines{
  max-width:760px;
  margin:0 auto clamp(44px,6vw,72px);
  text-align:center;
}
.reveal-scene__lines p{
  font-family:var(--font-serif);
  font-weight:300;
  font-size:clamp(22px, 3.4vw, 38px);
  line-height:1.35;
  margin:0 0 14px;
  color:#2B2A26;
}
.reveal-scene__lines p:last-child{
  margin-bottom:0;
  font-style:italic;
  color:var(--natal-whisky);
}

/* Tira de fotos de detalhe */
.reveal-scene__strip{
  display:grid;
  grid-template-columns:repeat(auto-fit, minmax(230px, 1fr));
  gap:16px;
  padding-bottom:clamp(64px,8vw,110px);
}
.reveal-scene__shot{
  margin:0;
  position:relative;
  overflow:hidden;
  background:var(--natal-creme);
  cursor:zoom-in;
}
.reveal-scene__shot img{
  width:100%;
  aspect-ratio:4/5;
  object-fit:cover;
  opacity:0;
  transition:opacity 1.1s ease, transform 1.1s ease;
}
.reveal-scene__shot.is-loaded img{ opacity:1; }
.reveal-scene__shot:hover img{ transform:scale(1.05); }
.reveal-scene__shot figcaption{
  position:absolute;
  left:0; right:0; bottom:0;
  padding:32px 16px 14px;
  background:linear-gradient(180deg, transparent, rgba(20,24,17,.8));
  color:var(--natal-creme);
  font-size:12px;
  letter-spacing:.14em;
  text-transform:uppercase;
  text-align:center;
}

/* Frase de posicionamento */
.reveal-scene__claim{
  background:var(--natal-bordo);
  padding-block:clamp(48px,7vw,84px);
  text-align:center;
}
.reveal-scene__claim p{
  max-width:820px;
  margin:0 auto;
  font-family:var(--font-serif);
  font-size:clamp(24px, 3.6vw, 42px);
  font-weight:300;
  line-height:1.35;
  color:var(--natal-offwhite);
}

/* ---- 4 · O que você vai encontrar ---- */
.features{
  padding-block:var(--section-pad);
  background:#F2EAD9;
}
.features .section__title{ color:#2B2A26; }
.features .section__title em{ color:var(--natal-whisky); }
.features__grid{
  display:grid;
  grid-template-columns:repeat(auto-fit, minmax(258px, 1fr));
  gap:clamp(28px,4vw,48px) clamp(24px,3vw,40px);
}
.features__item{ position:relative; padding-top:26px; }
.features__mark{
  position:absolute;
  top:0; left:0;
  width:26px; height:2px;
  background:var(--natal-gold);
}
.features__item h3{
  font-family:var(--font-serif);
  font-weight:400;
  font-size:23px;
  margin:0 0 10px;
  color:#2B2A26;
}
.features__item p{
  margin:0;
  font-size:14.5px;
  line-height:1.75;
  color:#6B6357;
}

/* ---- 6 · Urgência ---- */
.urgency{
  position:relative;
  overflow:hidden;
  padding-block:clamp(64px,8vw,110px);
  background:var(--natal-bordo);
  text-align:center;
  color:var(--natal-offwhite);
}
.urgency .container{ position:relative; z-index:2; }
.urgency .section__eyebrow{ color:var(--natal-gold-light); padding-left:0; }
.urgency .section__eyebrow::before{ display:none; }
.urgency .section__title{
  color:var(--natal-offwhite);
  max-width:820px;
  margin-inline:auto;
}
.urgency__text{
  max-width:660px;
  margin:0 auto 38px;
  font-size:16px;
  line-height:1.8;
  color:rgba(250,247,241,.82);
}
.urgency__text strong{ color:var(--natal-gold-light); font-weight:500; }
.urgency .btn--invert{
  background:var(--natal-offwhite);
  border-color:var(--natal-offwhite);
  color:var(--natal-bordo);
}
.urgency .btn--invert:hover{
  background:var(--natal-gold);
  border-color:var(--natal-gold);
  color:var(--natal-green-deep);
}

/* ---- 7 · Prova social ---- */
.social-proof{
  padding-block:var(--section-pad);
  background:var(--natal-offwhite);
}
.social-proof .section__title{ color:#2B2A26; }
.social-proof .section__title em{ color:var(--natal-whisky); }
.social-proof__photos{
  display:grid;
  grid-template-columns:repeat(auto-fit, minmax(200px, 1fr));
  gap:14px;
  margin-bottom:clamp(44px,6vw,72px);
}
.social-proof__photos:empty{ display:none; }
.social-proof__photo{
  overflow:hidden;
  background:var(--natal-creme);
  cursor:zoom-in;
}
.social-proof__photo img{
  width:100%;
  aspect-ratio:4/5;
  object-fit:cover;
  opacity:0;
  transition:opacity 1.1s ease, transform .8s ease;
}
.social-proof__photo.is-loaded img{ opacity:1; }
.social-proof__photo:hover img{ transform:scale(1.05); }

.social-proof__quotes{
  display:grid;
  grid-template-columns:repeat(auto-fit, minmax(280px, 1fr));
  gap:24px;
}
.social-proof__quotes:empty{ display:none; }
.testimonial{
  margin:0;
  padding:34px 30px;
  background:#fff;
  border:1px solid var(--natal-creme);
  position:relative;
}
.testimonial::before{
  content:'"';
  position:absolute;
  top:6px; left:20px;
  font-family:var(--font-serif);
  font-size:64px;
  line-height:1;
  color:var(--natal-gold);
  opacity:.45;
}
.testimonial blockquote{
  margin:0 0 16px;
  padding-top:14px;
  font-family:var(--font-serif);
  font-style:italic;
  font-size:18px;
  line-height:1.65;
  color:#3A362E;
}
.testimonial figcaption{
  font-size:11px;
  letter-spacing:.2em;
  text-transform:uppercase;
  color:var(--natal-whisky);
}

/* ---- 8 · Dúvidas ---- */
.faq{
  padding-block:var(--section-pad);
  background:#F2EAD9;
}
.faq .section__title{ color:#2B2A26; }
.faq .section__title em{ color:var(--natal-whisky); }
.faq__list{ max-width:820px; margin:0 auto; }
.faq__item{
  border-bottom:1px solid rgba(156,75,34,.22);
}
.faq__item summary{
  list-style:none;
  cursor:pointer;
  padding:24px 44px 24px 0;
  position:relative;
  font-family:var(--font-serif);
  font-size:clamp(18px,2.2vw,23px);
  color:#2B2A26;
  transition:color var(--transition);
}
.faq__item summary::-webkit-details-marker{ display:none; }
.faq__item summary:hover{ color:var(--natal-whisky); }
.faq__item summary::after{
  content:'';
  position:absolute;
  right:6px; top:50%;
  width:11px; height:11px;
  border-right:1.5px solid var(--natal-whisky);
  border-bottom:1.5px solid var(--natal-whisky);
  transform:translateY(-70%) rotate(45deg);
  transition:transform .45s cubic-bezier(.2,.6,.2,1);
}
.faq__item[open] summary::after{ transform:translateY(-30%) rotate(-135deg); }
.faq__answer{
  padding:0 44px 26px 0;
  animation:faqOpen .5s cubic-bezier(.2,.6,.2,1);
}
.faq__answer p{
  margin:0;
  font-size:15px;
  line-height:1.85;
  color:#6B6357;
}
@keyframes faqOpen{
  from{ opacity:0; transform:translateY(-8px); }
  to  { opacity:1; transform:none; }
}
@media (prefers-reduced-motion:reduce){
  .faq__answer{ animation:none; }
}

/* ---- 9 · Fechamento emocional + contato ---- */
.finale{
  position:relative;
  padding-block:clamp(90px,12vw,170px);
  background:var(--natal-green-deep);
  color:var(--natal-offwhite);
  overflow:hidden;
}
.finale__bg{
  position:absolute; inset:0;
  background-size:cover;
  background-position:center;
  opacity:.42;
}
.finale__overlay{
  position:absolute; inset:0;
  background:
    radial-gradient(100% 80% at 50% 50%, rgba(36,43,31,.55) 0%, rgba(36,43,31,.9) 100%);
}
.finale__inner{
  position:relative;
  z-index:2;
  text-align:center;
}
.finale__lines{ margin-bottom:26px; }
.finale__lines p{
  font-family:var(--font-serif);
  font-weight:300;
  font-size:clamp(24px, 3.8vw, 44px);
  line-height:1.35;
  margin:0 0 10px;
  color:var(--natal-offwhite);
  text-shadow:0 4px 26px rgba(0,0,0,.35);
}
.finale__lines p:last-child{ margin-bottom:0; font-style:italic; color:var(--natal-creme); }
.finale__signature{
  display:block;
  margin-bottom:52px;
  font-size:11px;
  letter-spacing:.34em;
  text-transform:uppercase;
  color:var(--natal-gold-light);
}
.finale__signature:empty{ display:none; }
.finale .contact__actions{
  display:flex;
  flex-wrap:wrap;
  gap:16px;
  justify-content:center;
}
.finale .contact__btn{
  background:rgba(250,247,241,.06);
  border-color:rgba(220,192,138,.32);
  backdrop-filter:blur(4px);
}
.finale .contact__btn:hover{
  background:var(--natal-offwhite);
  color:var(--natal-green-deep);
  border-color:var(--natal-offwhite);
}

@media (max-width:640px){
  .reveal-scene__lines p{ font-size:clamp(20px,5.6vw,27px); }
  .reveal-scene__claim p{ font-size:clamp(21px,5.6vw,28px); }
  .finale .contact__actions{ flex-direction:column; }
  .finale .contact__btn{ width:100%; }
}

/* Depoimento com foto da família — a foto ocupa o topo do card */
.testimonial--com-foto{ padding:0; overflow:hidden; }
.testimonial--com-foto::before{ display:none; }
.testimonial__face{
  width:100%;
  aspect-ratio:4/3;
  object-fit:cover;
  display:block;
  margin:0;
}
.testimonial--com-foto blockquote{
  margin:0;
  padding:28px 30px 0;
}
.testimonial--com-foto figcaption{
  display:block;
  padding:14px 30px 30px;
}

/* Espaço reservado do vídeo, enquanto ele não é publicado */
.video-frame__espera{
  position:absolute; inset:0;
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  gap:14px;
  padding:24px;
  text-align:center;
  background:
    repeating-linear-gradient(135deg, rgba(199,163,92,.05) 0 12px, transparent 12px 24px),
    var(--natal-green);
  border:1px dashed rgba(199,163,92,.45);
}
.video-frame__espera-icone{
  width:66px; height:66px;
  border-radius:50%;
  border:1px solid rgba(220,192,138,.55);
  display:flex; align-items:center; justify-content:center;
}
.video-frame__espera-icone::before{
  content:'';
  width:0; height:0;
  margin-left:5px;
  border-style:solid;
  border-width:11px 0 11px 18px;
  border-color:transparent transparent transparent rgba(220,192,138,.75);
}
.video-frame__espera strong{
  font-family:var(--font-serif);
  font-size:clamp(20px,2.6vw,27px);
  font-weight:400;
  color:var(--natal-creme);
}
.video-frame__espera small{
  font-size:12px;
  letter-spacing:.16em;
  text-transform:uppercase;
  color:rgba(250,247,241,.55);
}

/* Frase curta logo abaixo do título do topo */
.hero__tagline{
  font-family:var(--font-serif);
  font-weight:300;
  font-style:normal;
  font-size:clamp(21px, 2.9vw, 34px);
  line-height:1.4;
  color:var(--natal-creme);
  margin:0 0 26px;
  max-width:min(760px, 92vw);   /* cabe numa linha só no computador */
  text-shadow:0 3px 22px rgba(0,0,0,.4);
}
.hero__tagline:empty{ display:none; }
/* a assinatura da campanha vai abaixo da frase, como no roteiro */
/* .page-natal na frente para vencer a regra dourada do tema */
.page-natal .hero__eyebrow--abaixo{
  margin-bottom:36px;
  color:rgba(255,255,255,.92);
}
.page-natal .hero__eyebrow--abaixo::before{ background:rgba(255,255,255,.7); }
.page-natal .hero__subtitle:empty{ display:none; }

/* As seções escuras precisam conter os pontos de luz sem vazar */
.video-section,
.reveal-scene__claim,
.packages--natal{ position:relative; overflow:hidden; }
.video-section .container,
.reveal-scene__claim .container,
.packages--natal .container{ position:relative; z-index:2; }
/* na tira bordô e no fechamento os pontos ficam mais discretos */
.reveal-scene__claim .sparkle,
.finale .sparkle{ opacity:0; box-shadow:0 0 10px 2px rgba(220,192,138,.4); }

/* Frase de abertura do cenário — maior, com peso de destaque */
.reveal-scene .section__lead{
  font-family:var(--font-serif);
  font-size:clamp(21px, 2.9vw, 32px);
  line-height:1.5;
  color:#3A362E;
  max-width:760px;
  margin-top:18px;
}

/* Ícones de linha dos diferenciais */
.features__item{ padding-top:0; }
.features__icone{
  display:block;
  width:34px; height:34px;
  margin-bottom:16px;
  color:var(--natal-gold-deep);
}
.features__item .features__mark{ position:static; display:block; margin-bottom:16px; }

/* Brilho suave atrás do pacote em destaque, para o olho ir nele */
.page-natal .card--featured{
  box-shadow:0 0 0 1px rgba(199,163,92,.25), 0 24px 70px rgba(110,27,35,.45);
}
.page-natal .card--featured::after{
  content:'';
  position:absolute;
  inset:-30px;
  z-index:-1;
  background:radial-gradient(60% 50% at 50% 0%, rgba(220,192,138,.22), transparent 70%);
  pointer-events:none;
}

/* Divisor dourado entre blocos claros */
.ornamento{
  display:flex;
  align-items:center;
  justify-content:center;
  gap:14px;
  margin:0 auto;
  color:var(--natal-gold);
}
.ornamento::before,
.ornamento::after{
  content:'';
  height:1px;
  width:min(120px, 18vw);
  background:linear-gradient(90deg, transparent, currentColor);
}
.ornamento::after{ background:linear-gradient(90deg, currentColor, transparent); }
.ornamento svg{ width:22px; height:22px; }

/* ===================================================
   /natal — EFEITOS DE EMOÇÃO
   Neve discreta no topo, brilho de vela no título e
   feixe de luz nos botões. Tudo lento e sutil.
   =================================================== */

/* ---- Neve, só na primeira tela ---- */
.snow{
  position:absolute; inset:0;
  z-index:1;
  pointer-events:none;
  overflow:hidden;
}
.snowflake{
  position:absolute;
  top:-6vh;
  border-radius:50%;
  background:radial-gradient(circle, rgba(255,255,255,.95) 0%, rgba(255,255,255,.4) 65%, transparent 100%);
  opacity:0;
  animation:snowFall linear infinite;
  will-change:transform;
}
@keyframes snowFall{
  0%   { opacity:0;           transform:translate3d(0, -4vh, 0); }
  10%  { opacity:var(--op,.6); }
  85%  { opacity:var(--op,.6); }
  100% { opacity:0;           transform:translate3d(var(--drift, 40px), 106vh, 0); }
}

/* ---- Brilho de vela percorrendo o título do topo ---- */
@supports (-webkit-background-clip: text) or (background-clip: text){
  .page-natal .hero__title{
    background:linear-gradient(105deg,
      #FAF7F1 0%, #FAF7F1 40%,
      #EDD9A8 50%,
      #FAF7F1 60%, #FAF7F1 100%);
    background-size:230% 100%;
    -webkit-background-clip:text;
    background-clip:text;
    -webkit-text-fill-color:transparent;
    color:#FAF7F1;                 /* reserva, caso o clip falhe */
    text-shadow:none;              /* sombra vazaria pelas letras transparentes */
    filter:drop-shadow(0 4px 26px rgba(0,0,0,.4));
    animation:tituloBrilho 8s ease-in-out infinite;
  }
  .page-natal .hero__title em{
    color:inherit;
    -webkit-text-fill-color:transparent;
  }
}
@keyframes tituloBrilho{
  0%, 55%  { background-position:115% 0; }
  85%, 100%{ background-position:-35% 0; }
}

/* ---- Feixe de luz atravessando os botões principais ---- */
.page-natal .btn--invert::before{
  content:'';
  position:absolute;
  top:-4px; bottom:-4px;
  left:-70%;
  width:45%;
  background:linear-gradient(100deg, transparent, rgba(255,244,214,.38), transparent);
  transform:skewX(-18deg);
  animation:feixeBotao 5.2s ease-in-out infinite;
  pointer-events:none;
}
@keyframes feixeBotao{
  0%, 55%   { left:-70%; }
  85%, 100% { left:135%; }
}

/* Quem pediu menos movimento vê tudo parado, sem perder as cores */
@media (prefers-reduced-motion: reduce){
  .snowflake{ animation:none; opacity:0; }
  .page-natal .hero__title{ animation:none; background-position:50% 0; }
  .page-natal .btn--invert::before{ animation:none; left:-70%; }
}

/* No celular a galeria vira um carrossel de deslizar — 34 fotos empilhadas
   eram ~14.000px de rolagem antes da pessoa chegar aos pacotes */
@media (max-width:640px){
  .social-proof__photos{
    display:flex;
    overflow-x:auto;
    scroll-snap-type:x mandatory;
    gap:12px;
    /* sangra até as bordas da tela */
    margin-inline:calc(-1 * clamp(20px,4vw,40px));
    padding:4px clamp(20px,4vw,40px) 16px;
    scrollbar-width:none;
    -webkit-overflow-scrolling:touch;
  }
  .social-proof__photos::-webkit-scrollbar{ display:none; }
  .social-proof__photo{
    flex:0 0 76%;
    scroll-snap-align:center;
    box-shadow:0 12px 34px rgba(56,64,48,.22);
  }
  .social-proof__hint{ display:flex; }

  .reveal-scene__strip{
    grid-template-columns:repeat(2, 1fr);
    gap:10px;
  }
}

/* Dica de deslizar — só aparece no celular */
.social-proof__hint{
  display:none;
  align-items:center;
  justify-content:center;
  gap:8px;
  margin:2px 0 30px;
  font-size:11px;
  letter-spacing:.22em;
  text-transform:uppercase;
  color:var(--natal-gold-deep);
}
.social-proof__hint::after{
  content:'→';
  animation:dicaDeslize 1.8s ease-in-out infinite;
}
@keyframes dicaDeslize{
  0%, 100% { transform:translateX(0); opacity:.6; }
  50%      { transform:translateX(6px); opacity:1; }
}
@media (prefers-reduced-motion:reduce){
  .social-proof__hint::after{ animation:none; }
}

/* A dica de deslizar precisa vir depois da regra base para valer no celular */
@media (max-width:640px){
  .social-proof__hint{ display:flex; }
}

/* Botão do topo mais contido no celular — estava maior que o resto */
@media (max-width:640px){
  .page-natal .hero__actions .btn{
    padding:13px 22px;
    font-size:11px;
    letter-spacing:.18em;
  }
}

@media (max-width:640px){
  .page-natal .hero__title{ margin-bottom:8px; }
}

/* No celular o selo vai para o cantinho de cima, discreto e numa linha só */
@media (max-width:640px){
  .natal-badge{
    position:absolute;
    top:88px;
    left:20px;
    margin-bottom:0;
    padding:6px 12px;
    font-size:9.5px;
    letter-spacing:.15em;
    white-space:nowrap;
  }
}

/* Brilho dourado percorrendo o "Natal" de "Escolha o seu Natal" */
@supports (-webkit-background-clip: text) or (background-clip: text){
  .packages--natal .section__title em{
    background:linear-gradient(105deg,
      var(--natal-gold) 0%, var(--natal-gold) 38%,
      #F4E3B8 50%,
      var(--natal-gold) 62%, var(--natal-gold) 100%);
    background-size:230% 100%;
    -webkit-background-clip:text;
    background-clip:text;
    -webkit-text-fill-color:transparent;
    animation:tituloBrilho 6.5s ease-in-out infinite;
  }
  @media (prefers-reduced-motion: reduce){
    .packages--natal .section__title em{ animation:none; background-position:50% 0; }
  }
}

/* Avisinho "clique para assistir", acima do player */
.video-hint{
  display:block;
  text-align:center;
  margin:0 0 16px;
  font-size:11px;
  letter-spacing:.26em;
  text-transform:uppercase;
  color:var(--natal-gold-light);
}
.video-hint[hidden]{ display:none; }

/* Folga fixa sob a barra de navegação, para o selo nunca encostar nela */
@media (min-width:641px){
  .page-natal .hero__content{ padding-top:104px; }
}

/* ---- Telas baixas (notebooks, janela reduzida) ----
   O topo é 100vh: em telas baixas tudo precisa encolher junto, senão o selo
   sobe para debaixo do menu e o botão cai para fora da primeira tela. */
@media (min-width:641px) and (max-height:820px){
  .page-natal .hero__content{ padding-top:96px; padding-bottom:44px; }
  .page-natal .hero__title{ font-size:min(17vh, 120px); margin-bottom:6px; }
  .page-natal .hero__tagline{ font-size:clamp(18px, 2.2vh, 26px); margin-bottom:16px; }
  .page-natal .hero__eyebrow--abaixo{ margin-bottom:22px; }
  .page-natal .natal-badge{ margin-bottom:16px; padding:6px 14px; font-size:10px; }
}
@media (min-width:641px) and (max-height:660px){
  .page-natal .hero__content{ padding-top:88px; padding-bottom:34px; }
  .page-natal .hero__title{ font-size:min(15.5vh, 96px); }
  .page-natal .hero__tagline{ font-size:17px; margin-bottom:12px; }
  .page-natal .hero__eyebrow--abaixo{ margin-bottom:16px; font-size:10px; }
  .page-natal .hero__actions .btn{ padding:13px 26px; font-size:11px; }
  .page-natal .hero__scroll{ display:none; }   /* não cabe e não faz falta */
}

/* ---- Logo "Refúgio do Natal" no topo ---- */
.sr-only{
  position:absolute;
  width:1px; height:1px;
  padding:0; margin:-1px;
  overflow:hidden;
  clip:rect(0,0,0,0);
  white-space:nowrap;
  border:0;
}
.hero__title--logo{
  /* a logo substitui o texto: sem fonte, sem gradiente de texto */
  display:block;
  margin:0 0 14px;
  background:none;
  animation:none;
  -webkit-text-fill-color:initial;
  line-height:0;
}
.refugio-logo{
  display:block;
  width:min(560px, 78vw);
  height:auto;
  filter:drop-shadow(0 6px 30px rgba(0,0,0,.45));
}
@media (max-width:640px){
  .refugio-logo{ width:min(400px, 88vw); }
  .hero__title--logo{ margin-bottom:10px; }
}
/* Telas baixas: a logo encolhe junto com o resto */
@media (min-width:641px) and (max-height:820px){
  .refugio-logo{ width:min(460px, 62vw); }
}
@media (min-width:641px) and (max-height:660px){
  .refugio-logo{ width:min(380px, 52vw); }
}

/* Galeria recolhida no computador: só as primeiras fotos aparecem */
.social-proof__photos.is-recolhida > .social-proof__photo:nth-child(n + 11){
  display:none;
}
.social-proof__mais{
  display:block;
  margin:26px auto 0;
  padding:14px 34px;
  background:transparent;
  border:1px solid var(--natal-gold);
  color:var(--natal-gold-deep);
  font-family:var(--font-sans);
  font-size:11px;
  font-weight:500;
  letter-spacing:.22em;
  text-transform:uppercase;
  cursor:pointer;
  transition:all var(--transition);
}
.social-proof__mais:hover{
  background:var(--natal-gold);
  color:var(--natal-green-deep);
}
.social-proof__mais[hidden]{ display:none; }
@media (max-width:640px){
  .social-proof__mais{ display:none; }   /* no celular é carrossel */
}

/* ---- Celular deitado (tela larga e muito baixa) ----
   O topo é 100vh: com ~390px de altura, logo + frase + assinatura + botão
   não cabem. Aqui tudo encolhe e o supérfluo sai. */
@media (max-height:520px) and (orientation:landscape){
  /* o .hero tem min-height:640px fixo — numa tela de 390px isso deixa o topo
     maior que a tela e joga o botão para fora. Aqui ele acompanha a tela. */
  .page-natal .hero{
    min-height:0;
    height:100svh;
    max-height:none;
  }
  .page-natal .hero__content{
    padding-top:74px;
    padding-bottom:22px;
    justify-content:center;
  }
  .page-natal .natal-badge{
    position:static;
    margin-bottom:10px;
    padding:5px 12px;
    font-size:9px;
  }
  .refugio-logo{ width:min(300px, 34vw); }
  .hero__title--logo{ margin-bottom:8px; }
  .page-natal .hero__tagline{
    font-size:16px;
    margin-bottom:10px;
  }
  .page-natal .hero__eyebrow--abaixo{
    font-size:9px;
    letter-spacing:.2em;
    margin-bottom:14px;
  }
  .page-natal .hero__actions .btn{ padding:11px 20px; font-size:10px; }
  .page-natal .hero__scroll{ display:none; }
  .page-natal .snow, .page-natal .sparkles{ opacity:.5; }
}

/* ===================================================
   /natal — AGENDAR
   =================================================== */
.agendar{
  position:relative;
  overflow:hidden;
  padding-block:var(--section-pad);
  background:linear-gradient(180deg, #414A38 0%, var(--natal-green) 45%, var(--natal-green-deep) 100%);
  color:var(--natal-offwhite);
}
.agendar .container{ position:relative; z-index:2; }
.agendar .section__eyebrow{ color:var(--natal-gold-light); }
.agendar .section__eyebrow::before{ background:var(--natal-gold-light); }
.agendar .section__title{ color:var(--natal-offwhite); }
.agendar .section__title em{ color:var(--natal-gold-light); }
.agendar .section__lead{ color:rgba(250,247,241,.72); }

.agendar__caixa{
  max-width:760px;
  margin:0 auto;
  background:rgba(250,247,241,.05);
  border:1px solid rgba(199,163,92,.28);
  backdrop-filter:blur(6px);
  padding:clamp(24px,4vw,44px);
}

.passo{ margin-bottom:34px; }
.passo:last-child{ margin-bottom:0; }
.passo[hidden]{ display:none; }
.passo__num{
  display:inline-flex;
  align-items:center; justify-content:center;
  width:26px; height:26px;
  border-radius:50%;
  border:1px solid var(--natal-gold);
  color:var(--natal-gold-light);
  font-size:12px;
  margin-bottom:12px;
}
.passo h3{
  font-family:var(--font-serif);
  font-weight:400;
  font-size:clamp(21px,2.6vw,27px);
  color:var(--natal-creme);
  margin:0 0 16px;
}

/* --- datas --- */
.agendar__datas{
  display:flex;
  gap:10px;
  overflow-x:auto;
  padding-bottom:8px;
  scrollbar-width:none;
}
.agendar__datas::-webkit-scrollbar{ display:none; }
.data-card{
  flex:0 0 auto;
  min-width:92px;
  padding:14px 12px;
  background:rgba(250,247,241,.06);
  border:1px solid rgba(250,247,241,.16);
  color:var(--natal-offwhite);
  font-family:inherit;
  text-align:center;
  cursor:pointer;
  transition:all var(--transition);
}
.data-card small{
  display:block; font-size:10px; letter-spacing:.16em;
  text-transform:uppercase; color:rgba(250,247,241,.6);
}
.data-card strong{
  display:block; font-family:var(--font-serif);
  font-size:30px; font-weight:400; line-height:1.1; margin:2px 0;
}
.data-card span{ display:block; font-size:12px; color:rgba(250,247,241,.7); }
.data-card em{
  display:block; margin-top:6px; font-style:normal;
  font-size:10px; letter-spacing:.1em; color:var(--natal-gold-light);
}
.data-card:hover{ border-color:var(--natal-gold); }
.data-card.is-escolhido{
  background:var(--natal-creme);
  border-color:var(--natal-creme);
  color:var(--natal-green-deep);
}
.data-card.is-escolhido small,
.data-card.is-escolhido span{ color:rgba(36,43,31,.7); }
.data-card.is-escolhido em{ color:var(--natal-bordo); }

/* --- horários --- */
.agendar__horas{ display:flex; flex-wrap:wrap; gap:10px; }
.hora-card{
  padding:12px 22px;
  background:rgba(250,247,241,.06);
  border:1px solid rgba(250,247,241,.16);
  color:var(--natal-offwhite);
  font-family:inherit;
  font-size:15px;
  cursor:pointer;
  transition:all var(--transition);
}
.hora-card:hover{ border-color:var(--natal-gold); }
.hora-card.is-escolhido{
  background:var(--natal-creme);
  border-color:var(--natal-creme);
  color:var(--natal-green-deep);
  font-weight:500;
}

/* --- formulário --- */
.agendar__form{ display:flex; flex-direction:column; gap:16px; }
.agendar__form label{ display:flex; flex-direction:column; gap:7px; }
.agendar__form label > span{
  font-size:11px; letter-spacing:.18em; text-transform:uppercase;
  color:rgba(250,247,241,.7);
}
.agendar__form label small{ text-transform:none; letter-spacing:0; opacity:.7; }
.agendar__form input,
.agendar__form select,
.agendar__form textarea{
  font-family:inherit;
  font-size:15px;
  padding:13px 15px;
  background:rgba(20,24,17,.35);
  border:1px solid rgba(250,247,241,.2);
  color:var(--natal-offwhite);
  border-radius:0;
  width:100%;
  resize:vertical;
}
.agendar__form input:focus,
.agendar__form select:focus,
.agendar__form textarea:focus{
  outline:none;
  border-color:var(--natal-gold);
}
.agendar__form input::placeholder,
.agendar__form textarea::placeholder{ color:rgba(250,247,241,.35); }
.agendar__form select option{ background:var(--natal-green-deep); color:var(--natal-offwhite); }
.agendar__form button[type="submit"]{ align-self:flex-start; margin-top:6px; }
.agendar__form button[type="submit"]:disabled{ opacity:.6; cursor:wait; }
.agendar__erro{
  margin:0;
  padding:11px 14px;
  background:rgba(110,27,35,.4);
  border-left:2px solid var(--natal-bordo);
  font-size:14px;
  color:#FBE3E3;
}

/* --- passo do pagamento --- */
.passo--pago{ text-align:center; }
.passo__selo{
  display:inline-flex; align-items:center; justify-content:center;
  width:52px; height:52px; border-radius:50%;
  background:var(--natal-gold);
  color:var(--natal-green-deep);
  font-size:24px;
  margin-bottom:16px;
}
.pago__resumo{
  font-family:var(--font-serif);
  font-size:clamp(18px,2.2vw,23px);
  line-height:1.55;
  color:var(--natal-creme);
  max-width:520px;
  margin:0 auto 24px;
}
/* [hidden] precisa vencer os display: das regras abaixo, senão a caixa
   aparece vazia quando o pacote ainda não tem preço */
.agendar [hidden]{ display:none !important; }
.pago__valor{
  display:inline-block;
  padding:16px 34px;
  border:1px solid rgba(199,163,92,.5);
  margin-bottom:22px;
}
.pago__valor small{
  display:block; font-size:10px; letter-spacing:.22em;
  text-transform:uppercase; color:rgba(250,247,241,.65); margin-bottom:5px;
}
.pago__valor strong{
  font-family:var(--font-serif);
  font-size:38px; font-weight:400; color:var(--natal-gold-light);
}
.pago__pix{ margin-bottom:20px; }
.pago__pix > small{
  display:block; font-size:11px; letter-spacing:.16em;
  text-transform:uppercase; color:rgba(250,247,241,.6); margin-bottom:8px;
}
.pago__chave{
  display:inline-flex; align-items:center; gap:12px;
  padding:11px 14px;
  background:rgba(20,24,17,.45);
  border:1px solid rgba(250,247,241,.2);
  max-width:100%;
}
.pago__chave code{
  font-family:var(--font-sans);
  font-size:15px;
  color:var(--natal-offwhite);
  word-break:break-all;
}
.pago__chave button{
  flex-shrink:0;
  font-family:inherit; font-size:11px;
  letter-spacing:.14em; text-transform:uppercase;
  color:var(--natal-gold-light);
  background:none; border:0; cursor:pointer;
  padding:4px 2px;
}
.pago__chave button:hover{ text-decoration:underline; }
.pago__aviso{
  max-width:480px; margin:0 auto 26px;
  font-size:14px; line-height:1.7; color:rgba(250,247,241,.7);
}
.pago__aviso:empty{ display:none; }

@media (max-width:640px){
  .agendar__caixa{ padding:22px 18px; }
  .agendar__form button[type="submit"]{ align-self:stretch; text-align:center; }
  .pago__valor{ display:block; padding:14px 20px; }
  .pago__chave{ width:100%; }
}

/* --- pacote como cartão clicável (era uma lista suspensa, ficava fraca) --- */
.campo-pacote{ display:flex; flex-direction:column; gap:9px; }
.campo-pacote__titulo{
  font-size:11px; letter-spacing:.18em; text-transform:uppercase;
  color:rgba(250,247,241,.7);
}
.agendar__pacotes{
  display:grid;
  grid-template-columns:repeat(auto-fit, minmax(180px, 1fr));
  gap:10px;
}
.pacote-card{
  padding:16px 16px 14px;
  background:rgba(250,247,241,.06);
  border:1px solid rgba(250,247,241,.16);
  color:var(--natal-offwhite);
  font-family:inherit;
  text-align:left;
  cursor:pointer;
  transition:all var(--transition);
}
.pacote-card strong{
  display:block;
  font-family:var(--font-serif);
  font-weight:400;
  font-size:19px;
  line-height:1.25;
}
.pacote-card small{
  display:block;
  margin-top:5px;
  font-size:12.5px;
  line-height:1.5;
  color:rgba(250,247,241,.6);
}
.pacote-card span{
  display:block;
  margin-top:9px;
  font-family:var(--font-serif);
  font-size:21px;
  color:var(--natal-gold-light);
}
.pacote-card:hover{ border-color:var(--natal-gold); }
.pacote-card.is-escolhido{
  background:var(--natal-creme);
  border-color:var(--natal-creme);
  color:var(--natal-green-deep);
}
.pacote-card.is-escolhido small{ color:rgba(36,43,31,.7); }
.pacote-card.is-escolhido span{ color:var(--natal-bordo); }

/* --- escolha da forma de pagamento --- */
.pago__formas{ margin-bottom:22px; }
.pago__formas-titulo{
  display:block;
  font-size:11px; letter-spacing:.2em; text-transform:uppercase;
  color:rgba(250,247,241,.65);
  margin-bottom:10px;
}
.pago__abas{
  display:inline-flex;
  gap:0;
  border:1px solid rgba(250,247,241,.2);
}
.pago__aba{
  padding:11px 24px;
  background:transparent;
  border:0;
  color:rgba(250,247,241,.7);
  font-family:inherit;
  font-size:13px;
  letter-spacing:.08em;
  cursor:pointer;
  transition:all var(--transition);
}
.pago__aba + .pago__aba{ border-left:1px solid rgba(250,247,241,.2); }
.pago__aba.is-ativa{
  background:var(--natal-creme);
  color:var(--natal-green-deep);
  font-weight:500;
}
@media (max-width:640px){
  .pago__abas{ display:flex; width:100%; }
  .pago__aba{ flex:1; padding:11px 12px; font-size:12px; }
  .pacote-card{ padding:14px; }
}

/* --- abas de mês --- */
.agendar__meses{
  display:flex; flex-wrap:wrap; gap:8px;
  margin-bottom:16px;
}
.agendar__meses[hidden]{ display:none; }
.mes-aba{
  padding:13px 22px;
  background:transparent;
  border:1px solid rgba(250,247,241,.2);
  color:rgba(250,247,241,.75);
  font-family:inherit;
  font-size:13px;
  text-transform:capitalize;
  cursor:pointer;
  transition:all var(--transition);
}
/* a aba perdeu a segunda linha, então ganha altura no lugar */
.mes-aba{ font-size:14px; letter-spacing:.02em; }
.mes-aba:hover{ border-color:var(--natal-gold); }
.mes-aba.is-ativo{
  background:var(--natal-creme);
  border-color:var(--natal-creme);
  color:var(--natal-green-deep);
  font-weight:500;
}
.mes-aba.is-ativo span{ opacity:.7; }

/* --- carrossel de datas com setas e desvanecer nas bordas --- */
.agendar__carrossel{ position:relative; }
/* o desvanecer avisa que existe mais conteúdo para o lado */
.agendar__carrossel::after{
  content:'';
  position:absolute;
  top:0; right:0; bottom:8px;
  width:56px;
  background:linear-gradient(90deg, transparent, rgba(45,53,38,.92));
  pointer-events:none;
}
.agendar__seta{
  position:absolute;
  top:calc(50% - 4px);
  transform:translateY(-50%);
  z-index:3;
  width:38px; height:38px;
  border-radius:50%;
  background:var(--natal-creme);
  border:0;
  color:var(--natal-green-deep);
  font-size:22px;
  line-height:1;
  cursor:pointer;
  box-shadow:0 6px 20px rgba(0,0,0,.35);
  transition:all var(--transition);
}
.agendar__seta:hover{ background:var(--natal-gold); }
.agendar__seta[hidden]{ display:none; }
.agendar__seta--esq{ left:-14px; }
.agendar__seta--dir{ right:-14px; }

@media (max-width:640px){
  .agendar__seta{ display:none; }        /* no celular o dedo arrasta */
  .agendar__carrossel::after{ width:34px; }
  .mes-aba{ flex:1; text-align:center; padding:12px 10px; font-size:13px; }
}

/* ===================================================
   PRÉ-VENDA  (só existe na /natal)
   A faixa mora no rodapé da tela, não no topo: o menu já é fixo lá em cima e
   dois elementos grudados brigariam pelo mesmo espaço, ainda mais no celular.
   =================================================== */
.prevenda-barra{
  position:fixed;
  left:0; right:0; bottom:0;
  z-index:60;
  background:var(--natal-green-deep);
  border-top:1px solid var(--natal-gold);
  box-shadow:0 -8px 30px rgba(0,0,0,.28);
  animation:prevendaSobe .5s ease both;
}
@keyframes prevendaSobe{ from{ transform:translateY(100%); } to{ transform:translateY(0); } }

.prevenda-barra__inner{
  max-width:var(--container);
  margin-inline:auto;
  padding:11px 20px;
  display:flex;
  align-items:center;
  justify-content:center;
  gap:14px;
  flex-wrap:wrap;
}
.prevenda-barra__selo{
  font-size:10px;
  letter-spacing:.16em;
  text-transform:uppercase;
  color:var(--natal-green-deep);
  background:var(--natal-gold);
  padding:4px 10px;
  white-space:nowrap;
}
.prevenda-barra__texto{
  color:#FAF7F1;
  font-size:14px;
}
.prevenda-barra__cta{
  color:var(--natal-gold-light);
  font-size:12px;
  letter-spacing:.08em;
  text-transform:uppercase;
  border-bottom:1px solid currentColor;
  padding-bottom:1px;
  white-space:nowrap;
}
.prevenda-barra__cta:hover{ color:#fff; }

/* O relógio some e volta sem empurrar o texto do lado: dígitos de largura fixa */
.prevenda-relogio{
  font-variant-numeric:tabular-nums;
  font-feature-settings:"tnum" 1;
  color:var(--natal-gold-light);
  font-size:14px;
  letter-spacing:.04em;
  white-space:nowrap;
}

/* o botão do WhatsApp sobe para não ficar em cima da faixa */
body.tem-prevenda .float-wpp{ bottom:84px; }

/* ---------- seção ---------- */
.prevenda{
  position:relative;
  overflow:hidden;
  background:var(--natal-green-deep);
  color:#FAF7F1;
  padding-block:var(--section-pad, 96px);
}
.prevenda .section__eyebrow{ color:var(--natal-gold); }
.prevenda .section__eyebrow::before{ background:var(--natal-gold); }
.prevenda .section__title{ color:#FAF7F1; }
.prevenda .section__title em{ color:var(--natal-gold); }
.prevenda .section__lead{ color:rgba(250,247,241,.82); }

.prevenda__contagem{
  text-align:center;
  margin:38px auto 46px;
  max-width:560px;
}
.prevenda__contagem-label{
  display:block;
  font-size:11px;
  letter-spacing:.18em;
  text-transform:uppercase;
  color:var(--natal-gold);
  margin-bottom:14px;
}
.prevenda__relogio{
  display:flex;
  justify-content:center;
  gap:10px;
  flex-wrap:wrap;
}
.prevenda__casa{
  min-width:78px;
  padding:14px 8px 11px;
  background:rgba(199,163,92,.10);
  border:1px solid rgba(199,163,92,.34);
}
.prevenda__casa b{
  display:block;
  font-family:var(--font-display, 'Cormorant Garamond', serif);
  font-size:38px;
  line-height:1;
  font-weight:400;
  color:var(--natal-gold-light);
  font-variant-numeric:tabular-nums;
}
.prevenda__casa span{
  display:block;
  margin-top:6px;
  font-size:10px;
  letter-spacing:.14em;
  text-transform:uppercase;
  color:rgba(250,247,241,.66);
}
.prevenda__janela{
  margin-top:16px;
  font-size:13px;
  color:rgba(250,247,241,.62);
}

.prevenda__grid{
  display:grid;
  grid-template-columns:repeat(auto-fit, minmax(240px, 1fr));
  gap:34px 30px;
  margin-bottom:44px;
}
.prevenda__item{ text-align:center; }
.prevenda__item .features__icone{
  width:34px; height:34px;
  color:var(--natal-gold);
  /* o ícone herda display:block das features e encostaria na esquerda;
     aqui o texto é centralizado, então ele precisa se centralizar também */
  margin:0 auto 14px;
}
.prevenda__item .features__mark{ margin-inline:auto; }
.prevenda__item h3{
  font-family:var(--font-display, 'Cormorant Garamond', serif);
  font-size:21px;
  font-weight:400;
  color:#FAF7F1;
  margin-bottom:8px;
}
.prevenda__item p{
  font-size:14.5px;
  line-height:1.65;
  color:rgba(250,247,241,.76);
}
.prevenda__cta{ display:block; width:max-content; margin-inline:auto; }

/* ---------- o bônus dentro do cartão do pacote ---------- */
.card__bonus{
  margin-top:18px;
  padding:14px 16px 15px;
  border:1px solid rgba(199,163,92,.42);
  background:rgba(199,163,92,.09);
}
.card__bonus-titulo{
  display:block;
  font-size:10px;
  letter-spacing:.15em;
  text-transform:uppercase;
  color:var(--natal-gold-deep);
  margin-bottom:9px;
}
.card__bonus ul{ list-style:none; margin:0; padding:0; }
.card__bonus li{
  position:relative;
  padding-left:20px;
  font-size:13.5px;
  line-height:1.55;
  margin-bottom:5px;
}
.card__bonus li:last-child{ margin-bottom:0; }
.card__bonus li::before{
  content:'';
  position:absolute;
  left:2px; top:8px;
  width:7px; height:7px;
  background:var(--natal-gold);
  transform:rotate(45deg);
}
/* dentro dos cartões escuros o dourado precisa clarear para continuar legível */
.page-natal .card--featured .card__bonus-titulo,
.page-natal .card--gold .card__bonus-titulo{ color:var(--natal-gold-light); }

/* ---------- agenda ainda fechada pela pré-venda ---------- */
.agendar__aviso{
  text-align:center;
  max-width:540px;
  margin-inline:auto;
  padding:34px 26px;
  border:1px solid rgba(199,163,92,.4);
  background:rgba(199,163,92,.07);
}
.agendar__aviso h3{
  font-family:var(--font-display, 'Cormorant Garamond', serif);
  font-size:25px;
  font-weight:400;
  margin-bottom:10px;
}
.agendar__aviso p{ font-size:15px; line-height:1.7; opacity:.85; }
.agendar__aviso .prevenda__relogio{ margin-top:22px; }

@media (max-width:640px){
  .prevenda-barra__inner{ gap:10px; padding:10px 14px; flex-wrap:nowrap; }
  /* "Encerra em" sai no celular: o selo e o relógio já dizem tudo, e em duas
     linhas a faixa comia altura demais de uma tela pequena. */
  .prevenda-barra__texto{ display:none; }
  .prevenda-barra__selo{ font-size:9.5px; padding:4px 8px; }
  .prevenda-barra__cta{ font-size:10.5px; }
  .prevenda-relogio{ font-size:14px; font-weight:500; }
  .prevenda__casa{ min-width:66px; padding:11px 6px 9px; }
  .prevenda__casa b{ font-size:30px; }
  .prevenda__grid{ gap:28px; }
}

/* Botão de pacote enquanto a venda não abriu: continua bonito, mas discreto,
   porque não é uma compra, é um "volte no dia".
   Os seletores repetem .card--featured / .card--gold de propósito: sem isso o
   fundo creme do cartão em destaque vencia por especificidade e o texto
   dourado sumia em cima dele. */
.page-natal .card .card__cta--espera{
  background:transparent;
  color:var(--natal-gold-deep);
  border:1px solid var(--natal-gold);
}
.page-natal .card--featured .card__cta--espera,
.page-natal .card--gold .card__cta--espera{
  background:transparent;
  color:var(--natal-gold-light);
  border-color:rgba(220,192,138,.6);
}
.page-natal .card--featured .card__cta--espera:hover,
.page-natal .card--gold .card__cta--espera:hover{
  background:rgba(220,192,138,.14);
  color:#FAF7F1;
}
.page-natal .card .card__cta--espera:hover{
  background:rgba(199,163,92,.12);
}
.agendar__aviso-data{
  margin-top:10px;
  font-size:14px;
  /* fundo escuro pede o dourado claro; o escuro sumia aqui */
  color:var(--natal-gold-light);
}

/* ---------- Vídeo no palco do cenário ----------
   A foto do palco é cortada para preencher a largura toda. Com vídeo isso não
   serve: o corte comeria o topo e o rodapé do quadro que ela filmou. Aqui ele
   fica inteiro, centralizado, com o verde escuro em volta fazendo moldura. */
.reveal-scene__stage--video{
  background:var(--natal-green-deep);
  padding:clamp(24px,4vw,52px) clamp(16px,4vw,40px);
}
.reveal-scene__player{
  display:block;
  width:100%;
  max-width:min(920px, 92vw);
  height:auto;
  margin-inline:auto;
  background:#000;
  box-shadow:0 24px 60px rgba(0,0,0,.4);
}
/* a legenda sai de cima do vídeo e vai para baixo, senão tapa os controles */
.reveal-scene__stage--video figcaption{
  position:static;
  padding:20px 0 0;
  background:none;
  max-width:min(920px, 92vw);
  margin-inline:auto;
  color:var(--natal-gold-light);
}

.agendar__aviso-cta{ display:inline-block; margin-top:22px; }
/* o display:flex do relógio ganharia do [hidden] sem esta linha */
.agendar__aviso .prevenda__relogio[hidden]{ display:none; }

/* ---- vantagens em lista (itens de uma linha só) ---- */
.prevenda__grid--lista{
  grid-template-columns:repeat(auto-fit, minmax(300px, 1fr));
  gap:14px 40px;
  max-width:900px;
  margin-inline:auto;
  text-align:left;
}
.prevenda__linha{
  display:flex;
  align-items:flex-start;
  gap:13px;
  padding:11px 0;
  border-bottom:1px solid rgba(199,163,92,.18);
}
.prevenda__linha .features__icone{
  flex:0 0 auto;
  width:19px; height:19px;
  margin:2px 0 0;
  color:var(--natal-gold);
}
.prevenda__linha span{
  font-size:15.5px;
  line-height:1.55;
  color:rgba(250,247,241,.9);
}
@media (max-width:640px){
  .prevenda__grid--lista{ gap:6px; }
  .prevenda__linha{ padding:10px 0; gap:11px; }
  .prevenda__linha span{ font-size:14.5px; }
}

/* ---- lembrete das fotografias avulsas, abaixo dos pacotes ---- */
.pacotes__extras{
  max-width:660px;
  margin:clamp(34px,5vw,52px) auto 0;
  display:grid;
  gap:12px;
}
.pacotes__nota{
  display:flex;
  align-items:flex-start;
  gap:13px;
  margin:0;
  padding:16px 22px;
  border:1px solid rgba(199,163,92,.34);
  background:rgba(199,163,92,.07);
  color:rgba(250,247,241,.9);
  font-size:15px;
  line-height:1.6;
  text-align:left;
}
.pacotes__extras .features__icone{
  flex:0 0 auto;
  width:23px; height:23px;
  margin:2px 0 0;
  color:var(--natal-gold);
}
.pacotes__extras strong{ color:var(--natal-gold-light); font-weight:500; }

/* a estrela na faixa "mais escolhido" */
.card__ribbon{ display:flex; align-items:center; gap:6px; }
.card__ribbon .features__icone{
  width:12px; height:12px;
  margin:0;
  color:currentColor;
  fill:currentColor;
}

@media (max-width:640px){
  .pacotes__nota{ padding:15px 17px; gap:11px; font-size:14.3px; }
  .pacotes__extras .features__icone{ width:20px; height:20px; }
}

/* ---- vídeo da campanha passada, na prova social ----
   É vertical (formato de Reels). Largura de celular e centralizado: esticar
   um 9:16 na largura da seção deixaria a página com um poço no meio. */
.social-proof__video{
  margin:clamp(28px,4vw,44px) auto clamp(34px,5vw,52px);
  max-width:330px;
  text-align:center;
}
.social-proof__player{
  display:block;
  width:100%;
  aspect-ratio:9 / 16;
  background:#000;
  border-radius:4px;
  box-shadow:0 22px 54px rgba(0,0,0,.28);
}
.social-proof__video figcaption{
  margin-top:14px;
  font-family:var(--font-serif);
  font-style:italic;
  font-size:14.5px;
  line-height:1.55;
  opacity:.75;
}
@media (max-width:640px){
  .social-proof__video{ max-width:265px; }
  .social-proof__video figcaption{ font-size:13.5px; }
}

/* Instrução do comprovante, antes do botão do WhatsApp */
.pago__passo{
  margin:18px 0 14px;
  padding:14px 16px;
  border-left:2px solid var(--natal-gold);
  background:rgba(199,163,92,.08);
  font-size:14.5px;
  line-height:1.6;
}
/* mesmo motivo: fundo escuro pede o dourado claro */
.pago__passo strong{ color:var(--natal-gold-light); font-weight:600; }
.pago__enviar{ width:100%; text-align:center; }

/* O aviso que muda o comportamento de quem lê: sem comprovante, perde a data.
   A caixa do pagamento é verde escuro, então o texto tem que ser CLARO. Com o
   bordô escuro que estava aqui o contraste dava 1.0: sumia por completo. */
.pago__alerta{
  margin:0 0 16px;
  padding:13px 16px;
  border:1px solid rgba(242,166,158,.45);
  background:rgba(150,40,45,.24);
  color:#F6BDB5;
  font-size:14.5px;
  line-height:1.55;
  font-weight:500;
}
.pago__alerta strong{ font-weight:700; color:#FFDCD6; }
.pago__passo{ margin-bottom:12px; }

/* ---- data que já encheu ----
   Fica visível de propósito. Sumir com ela esconderia justamente a prova de
   que as datas estão acabando. */
.data-card--esgotado{
  position:relative;
  cursor:not-allowed;
  opacity:.55;
  border-style:dashed;
}
.data-card--esgotado strong,
.data-card--esgotado small,
.data-card--esgotado > span{
  text-decoration:line-through;
  text-decoration-thickness:1px;
}
.data-card--esgotado em{
  font-style:normal;
  color:var(--natal-bordo);
  font-weight:600;
  letter-spacing:.06em;
  text-transform:uppercase;
  font-size:10px;
}
.data-card__x{
  position:absolute;
  top:5px; right:7px;
  font-size:13px;
  line-height:1;
  color:var(--natal-bordo);
  font-weight:700;
  text-decoration:none;
}
.data-card--esgotado:hover{ transform:none; }

/* poucas vagas: o aviso que faz decidir agora */
.data-card__ultimos{
  color:var(--natal-bordo);
  font-weight:600;
}