/* ═══════════ RESET + TOKENS ═══════════ */
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth;font-size:16px;-webkit-font-smoothing:antialiased}
body{font-family:'Inter',system-ui,sans-serif;background:#FFF8FA;color:#2A1A22;overflow-x:hidden;line-height:1.6;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}
img{max-width:100%;display:block}
a{text-decoration:none;color:inherit}
h1,h2{font-weight:400;letter-spacing:-.01em}

:root{
  /* ── Nova paleta premium ── */
  --bg-main:     #FFF8FA;
  --bg-soft:     #FDECEF;
  --bg-section:  #FAE3EA;
  --primary:     #6A1B3D;
  --secondary:   #C05A7C;
  --accent:      #EFA3B5;
  --cta:         #FF4D6D;
  --cta-hover:   #E63E5C;
  --text-main:   #2A1A22;
  --text-soft:   #6B4C5A;
  --border-soft: #F3D6DE;
  --shadow-soft: rgba(106,27,61,0.08);

  /* ── Aliases legados remapeados para a nova paleta ── */
  --ink:    #2A1A22;          /* texto principal */
  --ink-2:  #6B4C5A;          /* texto secundário */
  --ink-3:  #8A7588;          /* texto muted */
  --cream:  #FFF8FA;          /* fundo principal */
  --rose:   #FDECEF;          /* fundo rosé suave */
  --rose-m: #EFA3B5;          /* accent */
  --rose-d: #6A1B3D;          /* primary (headings/brand) */
  --sage:   #FF4D6D;          /* CTA */
  --sage-l: #FF6B85;          /* CTA luz */
  --gold:   #C05A7C;          /* secundário */
  --gold-l: #EFA3B5;          /* accent */
  --lilac:  #FAE3EA;          /* card / seção destacada */
  --white:  #fff;
  --ff-s:   'Playfair Display',serif;
  --ff-b:   'Inter',system-ui,sans-serif;
  --ease:   cubic-bezier(.22,1,.36,1);
  --r:      16px;
}

/* ═══════════ UTILS ═══════════ */
.wrap{max-width:1140px;margin:0 auto;padding:0 24px}
.wrap--sm{max-width:860px;margin:0 auto;padding:0 24px}

/* ═══════════ ANNOUNCE ═══════════ */
#ann{
  background:var(--ink);color:rgba(255,255,255,.75);
  text-align:center;padding:10px 16px;
  font-size:12.5px;font-weight:300;letter-spacing:.03em;
}
#ann strong{color:var(--gold-l);font-weight:600}
#ann span{margin:0 10px;opacity:.3}

/* ═══════════ NAV ═══════════ */
#nav{
  position:sticky;top:0;z-index:500;
  background:rgba(255,248,250,.95);
  backdrop-filter:blur(24px) saturate(1.4);
  border-bottom:1px solid rgba(180,90,104,.12);
  transition:box-shadow .3s;
}
#nav.scrolled{box-shadow:0 2px 24px rgba(42,26,34,.08)}
.nav-in{
  display:flex;align-items:center;justify-content:space-between;
  max-width:1140px;margin:0 auto;padding:16px 24px;
}
.logo{
  display:flex;align-items:center;
}
.logo img{height:52px;width:auto;object-fit:contain;}
.logo b{color:var(--rose-d);font-weight:inherit}
.nav-links{display:flex;gap:28px;list-style:none}
.nav-links a{font-size:13px;font-weight:400;color:var(--ink-2);transition:color .2s;letter-spacing:.02em}
.nav-links a:hover{color:var(--rose-d)}
.nav-cta{
  background:var(--cta);color:#fff;
  padding:10px 22px;border-radius:50px;
  font-size:13px;font-weight:600;letter-spacing:.03em;
  border:none;cursor:pointer;transition:all .3s;
  box-shadow:0 10px 30px rgba(255,77,109,.25);
}
.nav-cta:hover{background:var(--cta-hover);transform:translateY(-1px);box-shadow:0 14px 34px rgba(255,77,109,.32)}
.ham{display:none;flex-direction:column;gap:4.5px;background:none;border:none;cursor:pointer;padding:4px}
.ham span{display:block;width:20px;height:1.5px;background:var(--ink);border-radius:2px;transition:all .3s}

/* ═══════════════════════════════════════
   HERO
═══════════════════════════════════════ */
#hero{
  min-height:clamp(640px,88vh,820px);    /* hero capado: nunca passa de 820px */
  display:grid;
  grid-template-columns:1fr 1fr;
  align-items:center;
  position:relative;
  overflow:hidden;
  background:
    radial-gradient(ellipse 70% 70% at 75% 45%, rgba(210,170,190,.22) 0%, transparent 65%),
    radial-gradient(ellipse 50% 60% at 20% 80%, rgba(190,168,220,.16) 0%, transparent 65%),
    linear-gradient(155deg, #FFFBFC 0%, #FDECEF 40%, #FAE3EA 70%, #F3D6DE 100%);
}

.hero-left{
  padding:64px 32px 64px 60px;           /* -29% padding vertical */
  position:relative;z-index:3;
}

/* Eyebrow tag */
.hero-tag{
  display:inline-flex;align-items:center;gap:8px;
  background:rgba(192,90,124,.09);
  border:1px solid rgba(192,90,124,.2);
  border-radius:40px;padding:5px 16px 5px 8px;
  margin-bottom:28px;
}
.hero-tag-dot{
  width:18px;height:18px;border-radius:50%;
  background:var(--rose-d);
  display:flex;align-items:center;justify-content:center;
  font-size:9px;color:#fff;font-weight:700;
}
.hero-tag span{
  font-size:11px;font-weight:700;
  letter-spacing:.14em;text-transform:uppercase;
  color:var(--rose-d);
}

/* Headline */
.hero-h1{
  font-family:var(--ff-s);
  font-size:clamp(42px,4.6vw,66px);   /* impacto reforçado na headline */
  font-weight:400;line-height:1.08;   /* mais elegante, respiro premium */
  letter-spacing:-.01em;
  color:var(--ink);margin-bottom:24px;
}
.hero-h1 em{font-style:italic;color:var(--rose-d)}
.hero-h1 .lt{font-weight:300;color:var(--ink-2)}

/* Subheadline — explicação suave abaixo da headline */
.hero-h1-sub{
  display:block;
  font-family:var(--ff-b);
  font-size:clamp(15px,1.3vw,19px);
  font-weight:400;
  line-height:1.6;
  letter-spacing:0;
  color:var(--ink-2);
  margin-top:20px;
  font-style:normal;
}

.hero-rule{
  width:40px;height:2px;
  background:linear-gradient(90deg,var(--rose-d),var(--rose-m));
  border-radius:2px;margin-bottom:24px;
}

.hero-p{
  font-size:15.5px;font-weight:300;
  color:var(--ink-2);line-height:1.85;
  max-width:420px;margin-bottom:34px;
}
.hero-p strong{color:var(--ink);font-weight:500}

/* CTA button */
.hero-btn{
  display:flex;align-items:center;justify-content:center;gap:10px;
  width:100%;max-width:400px;
  background:var(--cta);color:#fff;
  font-size:16px;font-weight:700;letter-spacing:.02em;
  padding:20px 40px;border-radius:60px;border:none;
  cursor:pointer;text-decoration:none;
  position:relative;overflow:hidden;
  box-shadow:0 8px 24px rgba(255,77,109,.26),0 2px 6px rgba(255,77,109,.14),inset 0 1px 0 rgba(255,255,255,.18);
  transition:all .35s var(--ease);
  margin-bottom:12px;
}
.hero-btn::before{
  content:'';position:absolute;inset:0;
  background:linear-gradient(135deg,rgba(255,255,255,.16) 0%,transparent 55%);
  pointer-events:none;
}
.hero-btn:hover{
  background:var(--cta-hover);transform:translateY(-3px);
  box-shadow:0 20px 48px rgba(255,77,109,.38),0 6px 14px rgba(255,77,109,.18);
}
.hero-btn-arr{font-size:18px;transition:transform .3s}
.hero-btn:hover .hero-btn-arr{transform:translateX(5px)}

.hero-link{
  display:inline-flex;align-items:center;gap:6px;
  font-size:13.5px;font-weight:400;color:var(--ink-2);
  transition:color .25s;
}
.hero-link:hover{color:var(--rose-d)}
.hero-link::before{
  content:'';display:inline-block;
  width:5px;height:5px;
  border-right:1.5px solid currentColor;
  border-bottom:1.5px solid currentColor;
  transform:rotate(-45deg);
}

/* Trust chips */
.hero-trust{
  display:flex;gap:14px;flex-wrap:wrap;
  margin:22px 0;
}
.htag{
  display:flex;align-items:center;gap:4px;
  font-size:12px;color:var(--ink-3);font-weight:400;
}
.htag-v{color:var(--sage);font-weight:700}

/* Social proof row */
.hero-proof{
  display:flex;align-items:center;gap:12px;
  padding-top:20px;
  border-top:1px solid rgba(192,90,124,.12);
}
.pav-stack{display:flex}
.pav{
  width:33px;height:33px;border-radius:50%;
  border:2px solid #fff;margin-left:-7px;
  overflow:hidden;flex-shrink:0;
  box-shadow:0 2px 8px rgba(42,26,34,.1);
}
.pav:first-child{margin-left:0}
.pav img{width:100%;height:100%;object-fit:cover;object-position:center top}
.pav-stars{color:var(--gold);font-size:13px;margin-bottom:1px;letter-spacing:-.5px}
.pav-t{font-size:12.5px;color:var(--ink-3);font-weight:300}
.pav-t strong{color:var(--ink);font-weight:600}

/* ── Product stage ── */
.hero-right{
  position:relative;height:clamp(560px,80vh,740px);   /* acompanha o hero capado */
  display:flex;align-items:center;justify-content:center;
  z-index:2;
}

/* Glow system */
.hglow{
  position:absolute;border-radius:50%;pointer-events:none;
}
.hglow-a{
  width:500px;height:500px;
  background:radial-gradient(ellipse at 48% 52%,
    rgba(210,170,200,.42) 0%,rgba(195,168,230,.24) 28%,
    rgba(180,162,228,.1) 52%,transparent 70%);
  filter:blur(36px);
  animation:hgA 9s ease-in-out infinite;
}
.hglow-b{
  width:300px;height:320px;
  background:radial-gradient(ellipse at 45% 50%,
    rgba(224,178,192,.46) 0%,rgba(210,172,220,.28) 32%,
    transparent 65%);
  filter:blur(22px);
  animation:hgA 6s ease-in-out infinite reverse;
}
.hglow-c{
  top:12%;right:16%;
  width:160px;height:180px;
  background:radial-gradient(ellipse at center,
    rgba(255,245,250,.6) 0%,rgba(240,230,248,.3) 42%,transparent 70%);
  filter:blur(18px);
  animation:hgA 7s ease-in-out infinite 1s;
}
@keyframes hgA{
  0%,100%{transform:scale(1) translate(0,0);opacity:.88}
  50%{transform:scale(1.08) translate(-5px,-8px);opacity:1}
}

.hground{
  position:absolute;bottom:13%;left:50%;
  transform:translateX(-50%);
  width:280px;height:28px;
  background:radial-gradient(ellipse at center,rgba(42,26,34,.13) 0%,transparent 68%);
  filter:blur(14px);border-radius:50%;
  animation:hgr 8s ease-in-out infinite;
}
@keyframes hgr{
  0%,100%{transform:translateX(-50%) scaleX(1);opacity:.6}
  50%{transform:translateX(-50%) scaleX(1.1);opacity:.9}
}

.hring{
  position:absolute;border-radius:50%;pointer-events:none;
  border:1px solid rgba(192,90,124,.08);
}
.hring-a{width:420px;height:420px;animation:rsp 55s linear infinite}
.hring-b{width:560px;height:560px;border-style:dashed;border-color:rgba(193,172,224,.07);animation:rsp 75s linear infinite reverse}
@keyframes rsp{to{transform:rotate(360deg)}}

/* THE BOTTLE */
.hbottle{
  position:relative;z-index:5;
  width:340px;
  mix-blend-mode:multiply;
  filter:
    drop-shadow(0 64px 96px rgba(42,26,34,.22))
    drop-shadow(0 24px 42px rgba(80,36,72,.15))
    drop-shadow(0  6px 14px rgba(42,26,34,.1))
    contrast(1.05) saturate(1.07);
  animation:bsway 8s ease-in-out infinite;
  transform-origin:50% 93%;
  cursor:default;
}
@keyframes bsway{
  0%,100%{transform:translateY(0) rotate(-.4deg)}
  35%{transform:translateY(-15px) rotate(.3deg)}
  65%{transform:translateY(-7px) rotate(-.1deg)}
}

/* Floating cards */
.hfc{
  position:absolute;
  background:rgba(255,255,255,.86);
  backdrop-filter:blur(20px) saturate(1.7);
  border:1px solid rgba(210,188,218,.35);
  border-radius:14px;padding:11px 16px;
  display:flex;align-items:center;gap:10px;
  box-shadow:0 8px 28px rgba(42,26,34,.09),0 2px 8px rgba(42,26,34,.05),inset 0 1px 0 rgba(255,255,255,.85);
  z-index:7;
  animation:cflt 5s ease-in-out infinite;
}
.hfc-1{top:18%;left:-28px;animation-delay:0s}
.hfc-2{bottom:25%;right:-14px;animation-delay:2.2s}
.hfc-3{bottom:12%;left:6%;animation-delay:1.1s}
@keyframes cflt{0%,100%{transform:translateY(0)}50%{transform:translateY(-7px)}}
.hfc-ico{font-size:20px;flex-shrink:0}
.hfc-main{font-size:13px;font-weight:700;color:var(--ink);line-height:1.2}
.hfc-sub{font-size:11px;color:var(--ink-3);font-weight:300}

/* ─── Hero responsive ─── */
@media(max-width:960px){
  #hero{grid-template-columns:1fr;min-height:auto;padding-bottom:52px}
  .hero-left{padding:52px 24px 28px;order:2;text-align:center}
  .hero-tag{margin-left:auto;margin-right:auto}
  .hero-rule{margin-left:auto;margin-right:auto}
  .hero-p{margin-left:auto;margin-right:auto}
  .hero-btn{margin-left:auto;margin-right:auto}
  .hero-trust{justify-content:center}
  .hero-proof{justify-content:center}
  .hero-right{order:1;height:400px}
  .hbottle{width:210px}
  .hglow-a{width:280px;height:280px}
  .hring-a{width:270px;height:270px}
  .hring-b{width:360px;height:360px}
  .hfc-1{left:8px}
  .hfc-2{right:8px}
  .hfc-3{display:none}
}
@media(max-width:560px){
  .hbottle{width:170px}
  .hero-right{height:320px}
  .hfc{padding:9px 13px}
  .hfc-main{font-size:12px}
  .hfc-sub{font-size:10px}
  .hero-h1{font-size:clamp(34px,9vw,54px)}
}

/* ═══════════════════════════════════════
   SOCIAL PROOF STRIP
═══════════════════════════════════════ */
#strip{background:var(--ink);padding:36px 0}
.strip-grid{
  display:grid;grid-template-columns:repeat(4,1fr);
  text-align:center;
}
.strip-item{
  padding:6px 20px;
  border-right:1px solid rgba(255,255,255,.08);
}
.strip-item:last-child{border-right:none}
.strip-n{
  font-family:var(--ff-s);font-size:42px;font-weight:400;
  color:#fff;line-height:1;margin-bottom:3px;
}
.strip-n em{color:var(--gold-l);font-style:normal}
.strip-l{font-size:11px;color:rgba(255,255,255,.38);letter-spacing:.1em;text-transform:uppercase;font-weight:400}
@media(max-width:700px){
  .strip-grid{grid-template-columns:repeat(2,1fr)}
  .strip-item{padding:16px;border-right:none;border-bottom:1px solid rgba(255,255,255,.07)}
  .strip-item:nth-child(odd){border-right:1px solid rgba(255,255,255,.07)}
}

/* ═══════════════════════════════════════
   PAIN SECTION
═══════════════════════════════════════ */
#pain{
  background:#1A0A14;padding:0;overflow:hidden;
}
.pain-wrap{
  display:grid;grid-template-columns:1fr 1fr;min-height:64vh;          /* 88vh → 64vh */
  align-items:stretch;
}
.pain-visual{position:relative;overflow:hidden;background:#150612;aspect-ratio:4/5} /* proporção padrão p/ ratios consistentes */
.pain-img{
  width:100%;height:100%;min-height:420px;                              /* 560 → 420 */
  object-fit:cover;object-position:center;
  display:block;opacity:.78;
  filter:contrast(1.08) saturate(.8) brightness(.95);
  transition:transform 10s ease;
}
.pain-visual:hover .pain-img{transform:scale(1.04)}
.pain-fade{
  position:absolute;inset:0;
  background:linear-gradient(to right,transparent 48%,rgba(26,10,20,.97) 100%),
    linear-gradient(to bottom,rgba(26,10,20,.3) 0%,transparent 18%,transparent 80%,rgba(26,10,20,.7) 100%);
  pointer-events:none;
}
.pain-badge{
  position:absolute;top:24px;left:24px;
  display:flex;align-items:center;gap:7px;
  background:rgba(255,255,255,.06);
  border:1px solid rgba(255,255,255,.1);
  backdrop-filter:blur(10px);
  border-radius:7px;padding:7px 13px;
}
.pain-dot{
  width:7px;height:7px;border-radius:50%;
  background:#E63E5C;
  box-shadow:0 0 6px rgba(255,77,109,.7);
  animation:blink 2s ease-in-out infinite;
}
@keyframes blink{0%,100%{opacity:1}50%{opacity:.25}}
.pain-badge span{font-size:10.5px;font-weight:700;letter-spacing:.13em;text-transform:uppercase;color:rgba(255,255,255,.52)}

.pain-copy{
  padding:52px 48px 52px 40px;                                          /* -28% padding vertical */
  display:flex;flex-direction:column;justify-content:center;
  position:relative;background:#1A0A14;
}
.pain-copy::before{ content:none }                                       /* hairline decorativa removida */
.pain-eye{
  font-size:11px;font-weight:700;letter-spacing:.17em;text-transform:uppercase;
  color:rgba(255,77,109,.65);margin-bottom:18px;
  display:flex;align-items:center;gap:10px;
}
.pain-eye::before{content:none}                                          /* dash decorativo removido */
.pain-title{
  font-family:var(--ff-s);
  font-size:clamp(26px,3vw,40px);font-weight:400;
  line-height:1.12;color:#fff;
  margin-bottom:14px;letter-spacing:-.01em;
}
.pain-title em{font-style:italic;color:rgba(239,163,181,.8)}
.pain-intro{
  font-size:14px;font-weight:300;color:rgba(255,255,255,.38);
  line-height:1.85;margin-bottom:32px;
  border-left:2px solid rgba(192,90,124,.2);
  padding-left:15px;max-width:440px;
}
.pain-list{list-style:none;margin-bottom:32px}
.pl{
  display:flex;gap:0;align-items:stretch;
  padding:18px 0;border-bottom:1px solid rgba(255,255,255,.05);
  transition:background .2s;
}
.pl:last-child{border-bottom:none}
.pl:hover{background:rgba(255,255,255,.025);margin:0 -18px;padding-left:18px;padding-right:18px;border-radius:8px}
.pl-n{
  font-family:var(--ff-s);font-size:34px;font-weight:300;
  color:rgba(192,90,124,.15);line-height:1;
  width:48px;flex-shrink:0;padding-top:2px;
  transition:color .3s;
}
.pl:hover .pl-n{color:rgba(192,90,124,.3)}
.pl-b{flex:1}
.pl-t{font-family:var(--ff-s);font-size:20px;font-weight:400;color:rgba(255,255,255,.88);margin-bottom:4px}
.pl-d{font-size:13px;font-weight:300;color:rgba(255,255,255,.38);line-height:1.7}
.pl-bar{
  flex-shrink:0;width:3px;align-self:stretch;
  border-radius:0 3px 3px 0;margin-left:14px;
  background:var(--rose-d);opacity:0;transition:opacity .3s;
}
.pl:hover .pl-bar{opacity:1}

.pain-why{
  background:rgba(192,90,124,.07);
  border:1px solid rgba(192,90,124,.14);
  border-radius:12px;padding:18px 20px;
  display:flex;gap:13px;align-items:flex-start;
}
.pain-why-ico{font-size:20px;flex-shrink:0;margin-top:1px}
.pain-why-title{font-size:13px;font-weight:700;color:rgba(239,163,181,.85);margin-bottom:4px;letter-spacing:.02em}
.pain-why-text{font-size:13px;font-weight:300;color:rgba(255,255,255,.36);line-height:1.75}
.pain-why-text strong{color:rgba(255,255,255,.62);font-weight:500}

@media(max-width:900px){
  .pain-wrap{grid-template-columns:1fr;min-height:auto}
  .pain-visual{order:1;min-height:300px}
  .pain-img{min-height:300px}
  .pain-fade{background:linear-gradient(to bottom,transparent 55%,rgba(26,10,20,.97) 100%)}
  .pain-copy{order:2;padding:44px 24px 52px}
  .pain-copy::before{left:24px;right:24px}
}

/* ═══════════════════════════════════════
   SOLUTION SECTION
═══════════════════════════════════════ */
#solution{padding:0;background:var(--cream);overflow:hidden}
.sol-wrap{
  display:grid;grid-template-columns:1fr 1fr;
  min-height:60vh;align-items:stretch;                                  /* 82vh → 60vh */
}
.sol-visual{position:relative;overflow:hidden;background:#FDECEF;aspect-ratio:4/5}  /* proporção padrão */
.sol-img{
  width:100%;height:100%;min-height:420px;                              /* 540 → 420 */
  object-fit:cover;object-position:center 28%;
  display:block;filter:contrast(1.03) saturate(.96);
  transition:transform 8s ease;
}
.sol-visual:hover .sol-img{transform:scale(1.03)}
.sol-img-fade{
  position:absolute;inset:0;
  background:linear-gradient(to right,transparent 52%,rgba(255,248,250,.97) 100%),
    linear-gradient(to bottom,rgba(255,248,250,.15) 0%,transparent 12%);
  pointer-events:none;
}
.sol-img-tag{
  position:absolute;top:24px;left:24px;
  background:rgba(255,77,109,.88);color:#fff;
  font-size:10.5px;font-weight:700;letter-spacing:.12em;
  text-transform:uppercase;padding:5px 13px;border-radius:6px;
}
.sol-float-card{
  position:absolute;bottom:32px;left:24px;
  background:rgba(255,255,255,.9);
  backdrop-filter:blur(16px) saturate(1.4);
  border:1px solid rgba(192,90,124,.2);
  border-radius:16px;padding:13px 17px;
  display:flex;align-items:center;gap:13px;
  box-shadow:0 12px 36px rgba(42,26,34,.1),inset 0 1px 0 rgba(255,255,255,.9);
  animation:cflt 5s ease-in-out infinite;
  max-width:230px;
}
.sfc-img{width:50px;flex-shrink:0;filter:drop-shadow(0 4px 10px rgba(42,26,34,.18))}
.sfc-img img{width:100%;display:block}
.sfc-title{font-family:var(--ff-s);font-size:16px;font-weight:500;color:var(--ink);line-height:1.2;margin-bottom:2px}
.sfc-sub{font-size:11px;color:var(--ink-3);font-weight:300;letter-spacing:.03em}
.sfc-badge{
  display:inline-flex;align-items:center;gap:4px;
  margin-top:5px;background:rgba(255,77,109,.1);
  border-radius:20px;padding:2px 9px;
  font-size:10px;font-weight:700;color:var(--sage);letter-spacing:.05em;
}
.sol-copy{
  padding:48px 48px 48px 40px;                                          /* -29% padding vertical */
  display:flex;flex-direction:column;justify-content:center;
}
.sol-eye{
  font-size:11px;font-weight:700;letter-spacing:.17em;text-transform:uppercase;
  color:var(--sage);margin-bottom:16px;
  display:flex;align-items:center;gap:9px;
}
.sol-eye::before{content:none}                                           /* dash decorativo removido */
.sol-title{
  font-family:var(--ff-s);font-size:clamp(28px,3.2vw,44px);
  font-weight:400;line-height:1.15;color:var(--ink);
  margin-bottom:8px;letter-spacing:-.01em;
}
.sol-title em{font-style:italic;color:var(--rose-d)}
.sol-subtitle{
  font-family:var(--ff-s);font-size:17px;font-weight:300;
  color:var(--ink-2);margin-bottom:24px;font-style:italic;
}
.sol-mechanism{
  background:linear-gradient(135deg,rgba(255,77,109,.07),rgba(255,77,109,.03));
  border:1px solid rgba(255,77,109,.15);
  border-left:3px solid var(--sage);
  border-radius:0 11px 11px 0;
  padding:15px 19px;margin-bottom:28px;
}
.sol-mechanism p{font-size:14px;font-weight:300;color:var(--ink-2);line-height:1.85}
.sol-mechanism strong{color:var(--ink);font-weight:500}
.sol-steps{display:flex;flex-direction:column;gap:0;margin-bottom:28px}
.ss{
  display:flex;gap:15px;align-items:flex-start;
  padding:15px 0;border-bottom:1px solid rgba(42,26,34,.06);
}
.ss:last-child{border-bottom:none}
.ss-num{
  flex-shrink:0;width:30px;height:30px;border-radius:50%;
  background:var(--sage);display:flex;align-items:center;justify-content:center;
  font-size:12px;font-weight:700;color:#fff;margin-top:2px;
  box-shadow:0 4px 12px rgba(255,77,109,.28);
}
.ss-t{font-size:14.5px;font-weight:600;color:var(--ink);margin-bottom:3px;line-height:1.3}
.ss-d{font-size:13px;font-weight:300;color:var(--ink-3);line-height:1.7}
.sol-ingr-label{
  font-size:10.5px;font-weight:700;letter-spacing:.14em;
  text-transform:uppercase;color:var(--ink-3);margin-bottom:12px;
}
.sol-ingr{display:grid;grid-template-columns:1fr 1fr;gap:9px;margin-bottom:32px}
.si{
  display:flex;align-items:center;gap:9px;
  padding:10px 13px;background:#fff;
  border:1px solid rgba(192,90,124,.11);
  border-radius:10px;transition:all .3s;
}
.si:hover{border-color:rgba(192,90,124,.28);box-shadow:0 4px 14px rgba(42,26,34,.06);transform:translateY(-1px)}
.si-ck{
  width:18px;height:18px;border-radius:50%;background:var(--sage);
  display:flex;align-items:center;justify-content:center;
  font-size:9.5px;color:#fff;font-weight:700;flex-shrink:0;
}
.si-name{font-size:12.5px;font-weight:600;color:var(--ink)}
.si-role{font-size:11px;color:var(--ink-3);font-weight:300;display:block;margin-top:1px}

@media(max-width:900px){
  .sol-wrap{grid-template-columns:1fr;min-height:auto}
  .sol-visual{order:1;min-height:340px}
  .sol-img{min-height:340px}
  .sol-img-fade{background:linear-gradient(to bottom,transparent 55%,rgba(255,248,250,.97) 100%)}
  .sol-copy{order:2;padding:44px 24px 52px}
  .sol-float-card{display:none}
  .sol-ingr{grid-template-columns:1fr 1fr}
}
@media(max-width:480px){.sol-ingr{grid-template-columns:1fr}}

/* ═══════════════════════════════════════
   BENEFITS
═══════════════════════════════════════ */
#benefits{padding:72px 0 80px;background:#FFF8FA;position:relative;overflow:hidden}    /* -25% / -26% vertical */
#benefits::before{
  content:'';position:absolute;
  top:-60px;right:-100px;width:460px;height:460px;
  border-radius:50%;
  background:radial-gradient(circle,rgba(243,214,222,.12),transparent 68%);
  filter:blur(48px);pointer-events:none;
}
.ben-hd{text-align:center;margin-bottom:56px;position:relative;z-index:2}
.ben-hd-eye{
  font-size:11px;font-weight:700;letter-spacing:.17em;text-transform:uppercase;
  color:var(--rose-d);margin-bottom:12px;display:block;
}
.ben-hd-t{
  font-family:var(--ff-s);font-size:clamp(28px,3.8vw,50px);
  font-weight:400;line-height:1.1;color:var(--ink);letter-spacing:-.01em;
}
.ben-hd-t em{font-style:italic;color:var(--rose-d)}
.ben-grid{
  display:grid;grid-template-columns:repeat(3,1fr);
  gap:18px;position:relative;z-index:2;
}
.bcard{
  background:#fff;border-radius:22px;overflow:hidden;
  border:1px solid rgba(192,90,124,.09);
  box-shadow:0 2px 16px rgba(42,26,34,.05);
  transition:all .42s var(--ease);
  position:relative;
}
.bcard:hover{
  transform:translateY(-10px);
  box-shadow:0 28px 64px rgba(42,26,34,.1);
  border-color:rgba(192,90,124,.2);
}
.bcard-img{height:200px;overflow:hidden;position:relative}              /* 248 → 200 (-19%) */
.bcard-img img{
  width:100%;height:100%;object-fit:cover;
  transition:transform .6s var(--ease);display:block;
}
.bcard:hover .bcard-img img{transform:scale(1.06)}
.bcard-img-fade{
  position:absolute;bottom:0;left:0;right:0;height:90px;
  background:linear-gradient(to top,#fff 0%,transparent 100%);
  pointer-events:none;
}
.bcard-lbl{
  position:absolute;top:16px;left:16px;
  display:flex;align-items:center;gap:7px;
  background:rgba(255,255,255,.88);
  backdrop-filter:blur(10px);
  border-radius:40px;padding:4px 13px 4px 7px;
  box-shadow:0 3px 12px rgba(42,26,34,.1);
}
.bcard-lbl-dot{
  width:22px;height:22px;border-radius:50%;
  display:flex;align-items:center;justify-content:center;font-size:12px;
}
.bcard-lbl-txt{
  font-size:10.5px;font-weight:700;letter-spacing:.12em;
  text-transform:uppercase;color:var(--ink);
}
.bcard-time{
  position:absolute;bottom:14px;right:14px;
  background:var(--ink);color:#fff;
  font-size:10px;font-weight:700;letter-spacing:.04em;
  padding:4px 11px;border-radius:6px;
  opacity:0;transform:translateY(5px);transition:all .32s;
}
.bcard:hover .bcard-time{opacity:1;transform:translateY(0)}
.bcard-body{padding:18px 24px 24px}
.bcard-title{font-family:var(--ff-s);font-size:24px;font-weight:400;color:var(--ink);margin-bottom:8px;line-height:1.15}
.bcard-desc{font-size:13.5px;font-weight:300;color:var(--ink-3);line-height:1.8;margin-bottom:16px}
.bcard-chips{display:flex;flex-wrap:wrap;gap:6px}
.bchip{
  display:flex;align-items:center;gap:4px;
  font-size:11.5px;font-weight:600;color:var(--sage);
  background:rgba(255,77,109,.08);
  border:1px solid rgba(255,77,109,.17);
  border-radius:30px;padding:4px 11px;letter-spacing:.02em;
}
.bchip::before{content:'✓';font-size:10px;font-weight:800}
.ben-cta{text-align:center;margin-top:48px;position:relative;z-index:2}
@media(max-width:900px){
  .ben-grid{grid-template-columns:1fr;gap:14px}
  .bcard-img{height:230px}
}

/* ═══════════════════════════════════════
   RESULTS — NARRATIVE
═══════════════════════════════════════ */
#results{background:#1A0A14;overflow:hidden;padding:0}
.res-intro{padding:56px 0 32px;text-align:center}                          /* -30% vertical */
.res-intro-eye{
  font-size:11px;font-weight:700;letter-spacing:.17em;text-transform:uppercase;
  color:rgba(192,90,124,.65);margin-bottom:14px;display:block;
}
.res-intro-title{
  font-family:var(--ff-s);font-size:clamp(28px,4vw,48px);
  font-weight:400;color:#fff;line-height:1.1;letter-spacing:-.01em;
}
.res-intro-title em{font-style:italic;color:rgba(239,163,181,.78)}
.res-intro-sub{
  font-size:14px;font-weight:300;color:rgba(255,255,255,.35);
  margin:13px auto 0;line-height:1.8;max-width:420px;
}
.res-intro::after{ content:none }                                        /* hairline divisória removida (margin do título já dá respiro) */

.story{
  display:grid;grid-template-columns:1fr 1fr;
  min-height:350px;                                                        /* -30% (500→350) */
  border-top:1px solid rgba(255,255,255,.04);
  padding:14px;                                                            /* respiro p/ visual de galeria */
  gap:14px;                                                                /* gap interno reduzido */
}
.story:hover{background:rgba(255,255,255,.014)}
.story.rev{direction:rtl}
.story.rev>*{direction:ltr}

.story-img{
  position:relative;overflow:hidden;
  border-radius:14px;                                                      /* bordas suaves consistentes */
  aspect-ratio:5/4;                                                        /* proporção padronizada (galeria) */
}
.story-img img{
  width:100%;height:100%;min-height:0;                                     /* deixa o aspect-ratio mandar */
  object-fit:cover;display:block;
  filter:contrast(1.04) saturate(.88);
  transition:transform 8s ease,filter .5s;
  border-radius:14px;                                                      /* radius consistente também na img */
}
.story:hover .story-img img{transform:scale(1.04);filter:contrast(1.06) saturate(.96)}
.sfade-r{
  position:absolute;inset:0;
  background:linear-gradient(to right,transparent 50%,rgba(26,10,20,.96) 100%);
  pointer-events:none;
}
.sfade-l{
  position:absolute;inset:0;
  background:linear-gradient(to left,transparent 50%,rgba(26,10,20,.96) 100%);
  pointer-events:none;
}
.story-stamps{
  position:absolute;top:22px;left:22px;
  display:flex;flex-direction:column;gap:3px;
}
.sstamp{
  display:inline-flex;align-items:center;gap:6px;
  padding:4px 12px;font-size:10px;font-weight:700;
  letter-spacing:.12em;text-transform:uppercase;border-radius:5px;
}
.sstamp-b{
  background:rgba(255,77,109,.16);border:1px solid rgba(255,77,109,.28);
  color:rgba(255,140,148,.8);
}
.sstamp-a{
  background:rgba(255,77,109,.18);border:1px solid rgba(255,77,109,.32);
  color:rgba(140,205,160,.88);
}
.sstamp-dot{width:6px;height:6px;border-radius:50%;flex-shrink:0}
.sstamp-b .sstamp-dot{background:rgba(255,77,109,.8)}
.sstamp-a .sstamp-dot{background:rgba(255,77,109,.9)}
.story-days{
  position:absolute;bottom:20px;right:20px;
  background:rgba(255,255,255,.07);
  backdrop-filter:blur(12px);
  border:1px solid rgba(255,255,255,.1);
  border-radius:10px;padding:10px 15px;text-align:center;
}
.sdays-n{
  font-family:var(--ff-s);font-size:30px;font-weight:300;
  color:rgba(239,163,181,.88);line-height:1;display:block;
}
.sdays-l{font-size:9.5px;color:rgba(255,255,255,.36);letter-spacing:.1em;text-transform:uppercase;font-weight:500}

.story-copy{
  display:flex;flex-direction:column;justify-content:center;
  padding:32px 40px 32px 32px;position:relative;                          /* -25% no padding interno */
}
.story.rev .story-copy{padding:32px 32px 32px 40px}
.story-num{
  font-family:var(--ff-s);font-size:72px;font-weight:300;
  color:rgba(255,255,255,.04);line-height:1;
  position:absolute;top:22px;right:32px;
  pointer-events:none;user-select:none;
}
.story.rev .story-num{right:auto;left:32px}
.story-cat{
  font-size:10.5px;font-weight:700;letter-spacing:.16em;
  text-transform:uppercase;margin-bottom:14px;
  display:flex;align-items:center;gap:9px;
}
.story-cat::before{ content:none }                                       /* dash decorativo removido */
.story-title{
  font-family:var(--ff-s);
  font-size:clamp(22px,2.6vw,34px);
  font-weight:400;line-height:1.15;
  color:#fff;margin-bottom:16px;letter-spacing:-.01em;
}
.story-title em{font-style:italic;color:rgba(239,163,181,.78)}
.story-quote{
  font-size:13.5px;font-weight:300;color:rgba(255,255,255,.38);
  line-height:1.85;font-style:italic;
  border-left:2px solid rgba(192,90,124,.22);
  padding-left:15px;margin-bottom:24px;
}
.story-facts{display:flex;flex-direction:column;gap:9px;margin-bottom:24px}
.sfact{display:flex;gap:11px;align-items:flex-start}
.sfact-ico{
  flex-shrink:0;width:26px;height:26px;border-radius:50%;
  display:flex;align-items:center;justify-content:center;
  font-size:12px;margin-top:1px;
}
.sfact-t{font-size:13px;color:rgba(255,255,255,.5);font-weight:300;line-height:1.65}
.sfact-t strong{color:rgba(255,255,255,.78);font-weight:500}
.story-author{
  display:flex;align-items:center;gap:11px;
  padding-top:18px;
  border-top:1px solid rgba(255,255,255,.06);
}
.sa-name{font-size:13.5px;font-weight:600;color:rgba(255,255,255,.72)}
.sa-info{font-size:11.5px;color:rgba(255,255,255,.32);font-weight:300}
.sa-ver{font-size:10.5px;color:var(--sage-l);font-weight:700;margin-top:1px;letter-spacing:.03em}

.res-bottom{
  padding:36px 0 48px;text-align:center;                                  /* -30% vertical */
  border-top:1px solid rgba(255,255,255,.04);
}
.res-bottom-t{
  font-size:14px;font-weight:300;color:rgba(255,255,255,.32);
  margin-bottom:22px;line-height:1.75;
}
.res-bottom-t strong{color:rgba(255,255,255,.58);font-weight:500}

@media(max-width:900px){
  .story,.story.rev{grid-template-columns:1fr;direction:ltr;min-height:auto;padding:10px;gap:10px}
  .story-img{aspect-ratio:5/4;border-radius:12px}                          /* radius consistente no mobile */
  .story-img img{min-height:0;border-radius:12px}                          /* aspect-ratio governa */
  .sfade-r,.sfade-l{background:linear-gradient(to bottom,transparent 52%,rgba(26,10,20,.97) 100%)}
  .story-copy,.story.rev .story-copy{padding:22px 18px 28px}                /* -30% padding */
  .story-num{display:none}
  .story-days{bottom:14px;right:14px}
}

/* ═══════════════════════════════════════
   INGREDIENTS
═══════════════════════════════════════ */
#ingr{padding:72px 0;background:var(--ink);overflow:hidden}                /* -25% no espaçamento vertical */
.ingr-hd{text-align:center;margin-bottom:45px}                              /* proporcional à seção */
.ingr-hd-eye{font-size:11px;font-weight:700;letter-spacing:.17em;text-transform:uppercase;color:rgba(192,90,124,.6);margin-bottom:12px;display:block}
.ingr-hd-t{font-family:var(--ff-s);font-size:clamp(26px,3.6vw,46px);font-weight:400;color:#fff;line-height:1.1;letter-spacing:-.01em}
.ingr-hd-t em{font-style:italic;color:rgba(239,163,181,.75)}
.ingr-hd-sub{font-size:14px;font-weight:300;color:rgba(255,255,255,.55);margin:13px auto 0;max-width:420px;line-height:1.8;text-align:center}  /* contraste melhor */

.ingr-layout{display:grid;grid-template-columns:1fr 1fr;gap:20px;margin-bottom:30px}    /* -25% no gap inferior */
.ingr-hero{border-radius:22px;overflow:hidden}
.ingr-hero img{width:100%;height:320px;object-fit:cover;border-radius:22px}            /* card hero -20% (400→320) */
.ingr-cards{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.icard{
  background:rgba(255,255,255,.046);
  border:1px solid rgba(255,255,255,.075);
  border-radius:18px;overflow:hidden;
  transition:all .35s;
}
.icard:hover{background:rgba(255,255,255,.082);border-color:rgba(239,163,181,.22)}
.icard-img{height:110px;overflow:hidden}                                    /* -21% (140→110) */
.icard-img img{width:100%;height:100%;object-fit:cover;transition:transform .4s}
.icard:hover .icard-img img{transform:scale(1.08)}
.icard-body{padding:18px}                                                   /* +3px de respiro */
.icard-n{font-family:var(--ff-s);font-size:20px;font-weight:400;color:#fff;margin-bottom:5px}
.icard-d{font-size:12.5px;color:rgba(255,255,255,.65);font-weight:300;line-height:1.7}  /* contraste +.25 */
.icard-b{
  display:inline-block;margin-top:8px;
  background:rgba(192,90,124,.14);color:var(--gold-l);
  font-size:10.5px;letter-spacing:.06em;padding:3px 10px;border-radius:20px;
}
.ingr-seals{
  display:flex;justify-content:center;gap:28px;flex-wrap:wrap;
}
.iseal{display:flex;align-items:center;gap:7px;font-size:13px;color:rgba(255,255,255,.58);font-weight:300}  /* contraste melhor */

@media(max-width:900px){
  .ingr-layout{grid-template-columns:1fr}
  .ingr-cards{grid-template-columns:1fr 1fr}
}
@media(max-width:480px){.ingr-cards{grid-template-columns:1fr}}

/* ═══════════════════════════════════════
   REVIEWS
═══════════════════════════════════════ */
#reviews{padding:72px 0;background:var(--rose)}                          /* -25% (96 → 72) */
.rev-hd{text-align:center;margin-bottom:56px}
.rev-hd-eye{font-size:11px;font-weight:700;letter-spacing:.17em;text-transform:uppercase;color:var(--rose-d);margin-bottom:12px;display:block}
.rev-hd-t{font-family:var(--ff-s);font-size:clamp(26px,3.6vw,46px);font-weight:400;color:var(--ink);line-height:1.1;letter-spacing:-.01em}
.rev-hd-t em{font-style:italic;color:var(--rose-d)}

.rev-rating{
  display:flex;justify-content:center;align-items:center;
  gap:24px;flex-wrap:wrap;margin-bottom:52px;
}
.rr-big{font-family:var(--ff-s);font-size:86px;font-weight:300;color:var(--ink);line-height:1}
.rr-sep{width:1px;height:60px;background:rgba(192,90,124,.2)}
.rr-stars{font-size:22px;color:var(--gold);margin-bottom:3px;letter-spacing:-.5px}
.rr-ct{font-size:13px;color:var(--ink-3);font-weight:300}
.rr-pct{text-align:center}
.rr-pn{font-family:var(--ff-s);font-size:46px;font-weight:300;color:var(--ink);line-height:1}
.rr-pl{font-size:11px;color:var(--ink-3);text-transform:uppercase;letter-spacing:.1em}

.rev-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}
.rcard{
  background:#fff;border-radius:18px;padding:24px;
  box-shadow:0 2px 16px rgba(42,26,34,.06);
  border:1px solid rgba(192,90,124,.09);
  transition:all .35s;position:relative;
}
.rcard::before{
  content:'"';position:absolute;top:12px;right:20px;
  font-family:var(--ff-s);font-size:62px;color:rgba(192,90,124,.08);line-height:1;
}
.rcard:hover{transform:translateY(-6px);box-shadow:0 20px 48px rgba(42,26,34,.1)}
.rcard-stars{color:var(--gold);font-size:13px;margin-bottom:11px;letter-spacing:-.5px}
.rcard-text{
  font-size:14.5px;font-weight:300;color:var(--ink-2);
  line-height:1.82;font-style:italic;margin-bottom:18px;
}
.rcard-auth{display:flex;gap:11px;align-items:center}
.rav{
  width:44px;height:44px;border-radius:50%;flex-shrink:0;
  overflow:hidden;border:2.5px solid var(--rose-m);
}
.rav img{width:100%;height:100%;object-fit:cover;object-position:center top}
.rav-name{font-size:13.5px;font-weight:700;color:var(--ink)}
.rav-city{font-size:11.5px;color:var(--ink-3);font-weight:300}
.rav-ver{font-size:10.5px;color:var(--sage);font-weight:700;margin-top:1px;letter-spacing:.03em}

@media(max-width:900px){
  .rev-grid{grid-template-columns:1fr;gap:12px}
  .rr-sep{display:none}
  .rev-rating{flex-direction:column;gap:16px}
}

/* ═══════════════════════════════════════
   OFFER
═══════════════════════════════════════ */
#offer{
  padding:76px 0;background:var(--ink);                                  /* -21% (96 → 76) */
  position:relative;overflow:hidden;
}
#offer::before{
  content:'';position:absolute;
  top:-180px;right:-150px;width:560px;height:560px;
  border-radius:50%;pointer-events:none;
  background:radial-gradient(circle,rgba(239,163,181,.09),transparent 65%);
}
#offer::after{
  content:'';position:absolute;
  bottom:-100px;left:-80px;width:380px;height:380px;
  border-radius:50%;pointer-events:none;
  background:radial-gradient(circle,rgba(243,214,222,.08),transparent 65%);
}
.off-hd{text-align:center;margin-bottom:52px;position:relative;z-index:2}
.off-urg{
  display:inline-flex;align-items:center;gap:7px;
  background:rgba(192,90,124,.16);border:1px solid rgba(192,90,124,.26);
  color:var(--gold-l);padding:6px 18px;border-radius:40px;
  font-size:11.5px;font-weight:700;letter-spacing:.1em;text-transform:uppercase;
  margin-bottom:18px;
}
.off-title{font-family:var(--ff-s);font-size:clamp(26px,3.6vw,46px);font-weight:400;color:#fff;line-height:1.1;letter-spacing:-.01em}
.off-title em{font-style:italic;color:rgba(239,163,181,.75)}
.off-sub{font-size:14px;font-weight:300;color:rgba(255,255,255,.36);margin-top:11px;line-height:1.75}

.kits{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;position:relative;z-index:2}
.kit{
  background:rgba(255,255,255,.048);
  border:1px solid rgba(255,255,255,.088);
  border-radius:22px;padding:34px 24px;
  text-align:center;position:relative;
  transition:all .4s var(--ease);overflow:hidden;
}
.kit::before{
  content:'';position:absolute;inset:0;
  background:linear-gradient(135deg,rgba(239,163,181,.07),transparent);
  opacity:0;transition:opacity .4s;
  pointer-events:none;                    /* não intercepta cliques na card */
}
.kit:hover{background:rgba(255,255,255,.074);transform:translateY(-8px);border-color:rgba(192,90,124,.26)}
.kit:hover::before{opacity:1}
.kit.pop{
  background:rgba(255,255,255,.086);
  border-color:rgba(239,163,181,.3);
  transform:scale(1.04);
}
.kit.pop::before{opacity:1}
.kit-pop-tag{
  position:absolute;top:14px;right:14px;
  background:var(--rose-d);color:#fff;
  font-size:10.5px;font-weight:700;padding:4px 12px;border-radius:20px;letter-spacing:.04em;
}
.kit-img{
  width:98px;margin:0 auto 14px;
  filter:drop-shadow(0 14px 28px rgba(0,0,0,.32));
}
.kit-img img{width:100%;display:block;mix-blend-mode:multiply;filter:contrast(1.05) saturate(1.06)}
.kit-name{font-family:var(--ff-s);font-size:25px;font-weight:400;color:#fff;margin-bottom:3px}
.kit-qty{font-size:12.5px;color:rgba(255,255,255,.35);margin-bottom:5px;font-weight:300}
.kit-per{font-size:11.5px;color:#EFA3B5;font-weight:600;margin-bottom:16px}
.kit-old{font-size:13.5px;color:rgba(255,255,255,.25);text-decoration:line-through;margin-bottom:3px}
.kit-price{font-family:var(--ff-s);font-size:50px;font-weight:400;color:#fff;line-height:1}
.kit-price sup{font-size:20px;vertical-align:super;font-family:var(--ff-b);font-weight:300}
.kit-inst{font-size:11.5px;color:rgba(255,255,255,.34);margin:5px 0 13px}
.kit-off{
  display:inline-block;
  background:rgba(255,77,109,.18);color:#EFA3B5;
  border:1px solid rgba(255,77,109,.26);
  padding:3px 13px;border-radius:20px;
  font-size:11.5px;font-weight:700;margin-bottom:5px;
}
.kit-urg{font-size:11px;color:var(--gold-l);margin-bottom:16px;font-weight:600;letter-spacing:.03em}
.kit-perks{list-style:none;text-align:left;margin-bottom:22px}
.kp{display:flex;gap:9px;align-items:center;font-size:12.5px;font-weight:300;color:rgba(255,255,255,.46);padding:5px 0}
.kpv{color:var(--sage-l);font-size:13.5px;flex-shrink:0}
.kit-btn{
  display:block;width:100%;padding:15px;border-radius:50px;border:none;
  cursor:pointer;font-family:var(--ff-b);font-size:13.5px;font-weight:700;
  letter-spacing:.03em;transition:all .3s;
  position:relative;z-index:50;pointer-events:auto;   /* sobe acima de qualquer overlay decorativo */
}
.kbg{background:var(--cta);color:#fff;box-shadow:0 10px 30px rgba(255,77,109,.25)}
.kbg:hover{background:var(--cta-hover);transform:translateY(-2px);box-shadow:0 14px 36px rgba(255,77,109,.42)}
.kbw{background:transparent;color:rgba(255,255,255,.36);border:1px solid rgba(255,255,255,.13)}
.kbw:hover{border-color:rgba(255,255,255,.36);color:#fff}

.off-seals{
  display:flex;justify-content:center;gap:28px;flex-wrap:wrap;
  margin-top:40px;position:relative;z-index:2;
}
.oseal{display:flex;align-items:center;gap:7px;font-size:12.5px;color:rgba(255,255,255,.36);font-weight:300}

@media(max-width:900px){
  .kits{grid-template-columns:1fr;gap:12px}
  .kit.pop{transform:none}
}

/* ═══════════════════════════════════════
   GUARANTEE
═══════════════════════════════════════ */
#guar{padding:64px 0;background:var(--cream)}                            /* -27% (88 → 64) */
.guar-box{
  max-width:720px;margin:0 auto;text-align:center;
  background:#fff;border-radius:28px;padding:60px 48px;
  box-shadow:0 20px 72px rgba(42,26,34,.07);
  border:1px solid rgba(192,90,124,.11);position:relative;overflow:hidden;
}
.guar-box::before{ content:none }                                        /* barra rainbow removida — visual mais clean */
.guar-ico{font-size:68px;margin-bottom:20px;display:block}
.guar-t{font-family:var(--ff-s);font-size:clamp(28px,4vw,46px);font-weight:400;color:var(--ink);margin-bottom:14px;line-height:1.1}
.guar-t em{font-style:italic;color:var(--rose-d)}
.guar-p{font-size:15px;font-weight:300;color:var(--ink-3);line-height:1.9;max-width:480px;margin:0 auto 28px}
.guar-items{display:flex;justify-content:center;gap:28px;flex-wrap:wrap}
.gi{text-align:center}
.gi-i{font-size:24px;margin-bottom:4px}
.gi-l{font-size:11px;font-weight:700;color:var(--ink);letter-spacing:.08em;text-transform:uppercase}
@media(max-width:600px){.guar-box{padding:36px 18px}}

/* ═══════════════════════════════════════
   FAQ
═══════════════════════════════════════ */
#faq{
  padding:64px 0;                                                        /* -27% (88 → 64) */
  background:linear-gradient(180deg,var(--cream) 0%,var(--lilac) 100%);
}
.faq-hd{text-align:center;margin-bottom:48px}
.faq-hd-eye{font-size:11px;font-weight:700;letter-spacing:.17em;text-transform:uppercase;color:var(--rose-d);margin-bottom:11px;display:block}
.faq-hd-t{font-family:var(--ff-s);font-size:clamp(24px,3.4vw,42px);font-weight:400;color:var(--ink);line-height:1.1;letter-spacing:-.01em}
.faq-hd-t em{font-style:italic;color:var(--rose-d)}
.faq-list{max-width:700px;margin:0 auto}
.faq-item{border-bottom:1px solid rgba(192,90,124,.12)}
.faq-q{
  display:flex;justify-content:space-between;align-items:center;
  padding:21px 0;cursor:pointer;gap:18px;
  font-family:var(--ff-s);font-size:20px;font-weight:400;
  color:var(--ink);transition:color .3s;line-height:1.3;
}
.faq-q:hover{color:var(--rose-d)}
.faq-plus{
  flex-shrink:0;width:30px;height:30px;border-radius:50%;
  border:1.5px solid rgba(192,90,124,.28);
  display:flex;align-items:center;justify-content:center;
  font-size:17px;font-weight:300;color:var(--rose-d);
  transition:all .3s;
}
.faq-item.open .faq-plus{transform:rotate(45deg);background:var(--rose-d);color:#fff;border-color:var(--rose-d)}
.faq-a{max-height:0;overflow:hidden;transition:max-height .4s ease}
.faq-a-in{padding:0 0 20px;font-size:14.5px;font-weight:300;color:var(--ink-3);line-height:1.9}
.faq-item.open .faq-a{max-height:220px}

/* ═══════════════════════════════════════
   FINAL CTA
═══════════════════════════════════════ */
#cta-f{
  padding:76px 0;text-align:center;                                      /* -30% (108 → 76) */
  background:linear-gradient(135deg,#FAE3EA 0%,#FAE3EA 50%,#FAE3EA 100%);
  position:relative;overflow:hidden;
}
#cta-f::before{
  content:'';position:absolute;
  top:50%;left:50%;transform:translate(-50%,-50%);
  width:680px;height:680px;border-radius:50%;
  background:radial-gradient(circle,rgba(255,255,255,.72),transparent 65%);
  filter:blur(60px);pointer-events:none;
}
.ctaf-inner{position:relative;z-index:2}
.ctaf-t{
  font-family:var(--ff-s);
  font-size:clamp(40px,5.5vw,72px);font-weight:400;
  line-height:1.05;color:var(--ink);margin-bottom:15px;letter-spacing:-.015em;
}
.ctaf-t em{font-style:italic;color:var(--rose-d)}
.ctaf-s{
  font-size:16px;font-weight:300;color:var(--ink-2);
  margin-bottom:40px;line-height:1.8;
  max-width:500px;margin-left:auto;margin-right:auto;
}
.ctaf-btns{display:flex;gap:14px;justify-content:center;flex-wrap:wrap;margin-bottom:24px}
.ctaf-micro{font-size:12.5px;color:var(--ink-3);font-weight:300}
.ctaf-micro span{color:var(--sage);font-weight:600}

/* ═══════════════════════════════════════
   FOOTER
═══════════════════════════════════════ */
footer{background:var(--ink);padding:52px 0 32px}
.foot-g{display:grid;grid-template-columns:2fr 1fr 1fr;gap:48px;margin-bottom:36px}
.foot-logo{display:flex;align-items:center;margin-bottom:13px}                /* container do logo (imagem) */
.foot-logo img{height:44px;width:auto;object-fit:contain}                     /* mesma imagem do header, levemente menor p/ hierarquia */
.foot-desc{font-size:13.5px;color:rgba(255,255,255,.34);font-weight:300;line-height:1.7;max-width:240px}
.foot-title{font-size:10.5px;letter-spacing:.14em;text-transform:uppercase;color:rgba(255,255,255,.34);font-weight:700;margin-bottom:14px}
.foot-ul{list-style:none}
.foot-ul li{margin-bottom:9px}
.foot-ul a{font-size:13.5px;color:rgba(255,255,255,.4);transition:color .3s;font-weight:300}
.foot-ul a:hover{color:#fff}
.foot-bottom{border-top:1px solid rgba(255,255,255,.07);padding-top:22px}
.foot-copy{font-size:11.5px;color:rgba(255,255,255,.2);margin-bottom:7px}
.foot-legal{font-size:11.5px;color:rgba(255,255,255,.14);line-height:1.7;max-width:640px}
@media(max-width:700px){.foot-g{grid-template-columns:1fr;gap:24px}}

/* ═══════════════════════════════════════
   STICKY BAR
═══════════════════════════════════════ */
#sticky{
  position:fixed;bottom:0;left:0;right:0;z-index:999;
  background:rgba(255,248,250,.95);backdrop-filter:blur(24px);
  border-top:1px solid rgba(192,90,124,.16);
  padding:13px 20px;display:flex;align-items:center;justify-content:space-between;
  box-shadow:0 -6px 32px rgba(42,26,34,.08);
  transform:translateY(100%);
  transition:transform .5s var(--ease);
}
#sticky.on{transform:translateY(0)}
.sk-t{font-family:var(--ff-s);font-size:19px;color:var(--ink);font-weight:400;line-height:1.2;white-space:nowrap}
.sk-logo{height:22px;width:auto;vertical-align:middle;margin-right:6px;display:inline-block}
.sk-s{font-size:12.5px;color:var(--ink-3);font-weight:300}
.sk-r{display:flex;align-items:center;gap:15px}
.sk-p{font-family:var(--ff-s);font-size:28px;color:var(--ink);font-weight:300}
@media(max-width:600px){
  #sticky{flex-direction:column;gap:10px;text-align:center}
  .sk-r{justify-content:center}
}

/* ═══════════════════════════════════════
   SCROLL REVEAL
═══════════════════════════════════════ */
.rv{opacity:0;transform:translateY(30px);transition:opacity .8s ease,transform .8s ease}
.rv.in{opacity:1;transform:none}
.rl{opacity:0;transform:translateX(-34px);transition:opacity .8s ease,transform .8s ease}
.rl.in{opacity:1;transform:none}
.rr{opacity:0;transform:translateX(34px);transition:opacity .8s ease,transform .8s ease}
.rr.in{opacity:1;transform:none}
.d1{transition-delay:.1s!important}.d2{transition-delay:.2s!important}
.d3{transition-delay:.3s!important}.d4{transition-delay:.4s!important}



/* ════════════════════════════════════════════════════════
   HERO — SENIOR DESIGNER REBUILD V9
   Concept: "Editorial Luxury Supplement"
   Reference: Ritual, Care/Of, Hims, AG1
════════════════════════════════════════════════════════ */

/* ── Base hero grid ── */
#hero {
  min-height: clamp(640px,88vh,820px);                                  /* override v14: hero capado */
  display: grid;
  grid-template-columns: 1fr 1fr;
  align-items: center;
  position: relative;
  overflow: hidden;

  /* Perfectly matched to bottle's purple bg for mix-blend removal */
  background:
    linear-gradient(148deg,
      #FFFBFC  0%,
      #FDECEF  25%,
      #FAE3EA  52%,
      #F3D6DE  75%,
      #e5d8f0  100%
    );
}

/* Large ambient blobs */
#hero::before {
  content: '';
  position: absolute;
  top: -140px; right: -80px;
  width: 680px; height: 680px;
  border-radius: 50%;
  background: radial-gradient(ellipse at 45% 48%,
    rgba(190,155,225,.26) 0%,
    rgba(239,163,181,.14) 45%,
    transparent 68%
  );
  pointer-events: none;
  filter: blur(55px);
  animation: blobA 20s ease-in-out infinite alternate;
}
#hero::after {
  content: '';
  position: absolute;
  bottom: -110px; left: -70px;
  width: 520px; height: 520px;
  border-radius: 50%;
  background: radial-gradient(ellipse at center,
    rgba(170,140,210,.2) 0%,
    transparent 65%
  );
  pointer-events: none;
  filter: blur(65px);
  animation: blobA 26s ease-in-out infinite alternate-reverse;
}
@keyframes blobA {
  from { transform: translate(0,0) scale(1); }
  to   { transform: translate(14px,-12px) scale(1.05); }
}

/* ───────────────────────────────
   LEFT: COPY (unchanged)
─────────────────────────────── */
.hero-left {
  padding: 90px 32px 90px 60px;
  position: relative; z-index: 3;
}

/* ───────────────────────────────
   RIGHT: PRODUCT STAGE
─────────────────────────────── */
.hero-right {
  position: relative;
  height: clamp(560px,80vh,740px);                                      /* override v14: acompanha o hero capado */
  display: flex;
  align-items: center;
  justify-content: center;
  z-index: 2;
  overflow: visible;
}

/* ──── LAYER 1: Geometric background shapes ──── */
.hs-geo {
  position: absolute;
  pointer-events: none;
  z-index: 1;
}

/* Large circle — soft gradient ring */
.hs-geo-circle {
  width: 500px; height: 500px;
  border-radius: 50%;
  border: 1px solid rgba(239,163,181,.15);
  left: 50%; top: 50%;
  transform: translate(-50%, -50%);
  animation: geoSpin 60s linear infinite;
}
.hs-geo-circle-2 {
  width: 380px; height: 380px;
  border-radius: 50%;
  border: 1px dashed rgba(185,155,225,.1);
  left: 50%; top: 50%;
  transform: translate(-50%, -50%);
  animation: geoSpin 40s linear infinite reverse;
}
@keyframes geoSpin { to { transform: translate(-50%,-50%) rotate(360deg); } }

/* Dot accents */
.hs-dot {
  position: absolute;
  border-radius: 50%;
  pointer-events: none; z-index: 6;
}
.hs-dot-1 {
  width: 7px; height: 7px;
  background: rgba(239,163,181,.5);
  box-shadow: 0 0 12px rgba(239,163,181,.5);
  top: 24%; right: 18%;
  animation: dotPulse 4s ease-in-out infinite;
}
.hs-dot-2 {
  width: 5px; height: 5px;
  background: rgba(165,200,180,.6);
  box-shadow: 0 0 8px rgba(165,200,180,.5);
  top: 65%; left: 14%;
  animation: dotPulse 6s ease-in-out infinite 1s;
}
.hs-dot-3 {
  width: 6px; height: 6px;
  background: rgba(239,163,181,.5);
  box-shadow: 0 0 10px rgba(239,163,181,.4);
  bottom: 20%; right: 26%;
  animation: dotPulse 5s ease-in-out infinite .5s;
}
.hs-dot-4 {
  width: 4px; height: 4px;
  background: rgba(239,163,181,.4);
  top: 38%; left: 8%;
  animation: dotPulse 7s ease-in-out infinite 2s;
}
@keyframes dotPulse {
  0%,100% { transform: scale(1); opacity: .55; }
  50%      { transform: scale(1.8); opacity: 1; }
}

/* ──── LAYER 2: Multi-layer glow system ──── */
.hs-glow {
  position: absolute;
  border-radius: 50%;
  pointer-events: none;
}

/* Wide ambient halo — matches purple palette */
.hs-glow-1 {
  width: 540px; height: 540px;
  background: radial-gradient(ellipse at 48% 52%,
    rgba(195,158,230,.40) 0%,
    rgba(178,148,222,.22) 28%,
    rgba(162,138,215,.10) 52%,
    transparent           70%
  );
  filter: blur(38px);
  z-index: 2;
  animation: glowPulse 9s ease-in-out infinite;
}

/* Mid warm-rose glow */
.hs-glow-2 {
  width: 340px; height: 360px;
  background: radial-gradient(ellipse at 44% 52%,
    rgba(220,175,205,.44) 0%,
    rgba(205,165,220,.26) 32%,
    transparent           65%
  );
  filter: blur(24px);
  z-index: 2;
  animation: glowPulse 7s ease-in-out infinite reverse;
}

/* Top-right specular rim — studio light feel */
.hs-glow-3 {
  width: 180px; height: 200px;
  top: 12%; right: 16%;
  background: radial-gradient(ellipse at center,
    rgba(255,248,255,.60) 0%,
    rgba(242,232,255,.32) 42%,
    transparent           70%
  );
  filter: blur(18px);
  z-index: 2;
  animation: rimPulse 8s ease-in-out infinite;
}

/* Bottom warm light */
.hs-glow-4 {
  width: 260px; height: 140px;
  bottom: 18%; left: 18%;
  background: radial-gradient(ellipse at center,
    rgba(230,195,210,.28) 0%,
    transparent           68%
  );
  filter: blur(22px);
  z-index: 2;
}

@keyframes glowPulse {
  0%,100% { transform: scale(1) translate(0,0); opacity: .88; }
  50%      { transform: scale(1.07) translate(-4px,-6px); opacity: 1; }
}
@keyframes rimPulse {
  0%,100% { opacity: .65; transform: translate(0,0); }
  50%      { opacity: 1; transform: translate(-5px, 3px); }
}

/* ──── LAYER 3: THE PRODUCT ──── */
/* 
 * BACKGROUND REMOVAL:
 * The product photo has a solid lilac-purple bg ~#c4b0d8.
 * Our page bg at that position is approximately that same tone.
 * mix-blend-mode: multiply makes identical colors cancel each other.
 * Result: purple bg disappears, dark bottle stays visible.
 * We boost contrast+saturate to sharpen the bottle edges.
 */
.hs-bottle-wrap {
  position: relative;
  z-index: 5;
  width: 420px;  /* Large and impactful */
}

.hs-bottle {
  width: 100%;
  display: block;
  mix-blend-mode: multiply;
  filter:
    contrast(1.12)
    saturate(1.08)
    brightness(1.02)
    drop-shadow(0 56px 88px rgba(80,40,130,.22))
    drop-shadow(0 22px 38px rgba(100,60,150,.16))
    drop-shadow(0  5px 12px rgba(40,20,60,.12));
  animation: bottleSway 9s ease-in-out infinite;
  transform-origin: 50% 94%;
}

@keyframes bottleSway {
  0%,100% { transform: translateY(0px)   rotate(0deg);  }
  38%      { transform: translateY(-16px) rotate(.35deg); }
  72%      { transform: translateY(-7px)  rotate(-.18deg); }
}

/* Ground shadow — anchors the bottle */
.hs-ground {
  position: absolute;
  bottom: 7%;
  left: 50%;
  transform: translateX(-50%);
  width: 300px; height: 34px;
  background: radial-gradient(ellipse at center,
    rgba(70,35,110,.2) 0%,
    transparent 68%
  );
  filter: blur(18px);
  border-radius: 50%;
  pointer-events: none;
  z-index: 4;
  animation: groundPulse 9s ease-in-out infinite;
}
@keyframes groundPulse {
  0%,100% { transform:translateX(-50%) scaleX(1); opacity:.55; }
  50%      { transform:translateX(-50%) scaleX(1.1); opacity:.8; }
}

/* ──── LAYER 4: Floating UI cards — glassmorphism ──── */
.hfc {
  position: absolute;
  background: rgba(255,255,255,.86);
  backdrop-filter: blur(22px) saturate(1.9);
  border: 1px solid rgba(195,165,228,.32);
  border-radius: 16px;
  padding: 12px 18px;
  display: flex; align-items: center; gap: 11px;
  z-index: 8;
  box-shadow:
    0 10px 32px rgba(106,27,61,.1),
    0 3px 10px rgba(106,27,61,.07),
    inset 0 1px 0 rgba(255,255,255,.9);
  animation: cardFloat 5s ease-in-out infinite;
  cursor: default;
}

/* Card 1: top-left — rating */
.hfc-1 {
  top: 16%; left: -32px;
  animation-delay: 0s;
}
/* Card 2: bottom-right — guarantee */
.hfc-2 {
  bottom: 22%; right: -18px;
  animation-delay: 2.3s;
}
/* Card 3: bottom-left — biotin */
.hfc-3 {
  bottom: 11%; left: 4%;
  animation-delay: 1.1s;
}

@keyframes cardFloat {
  0%,100% { transform: translateY(0); }
  50%      { transform: translateY(-8px); }
}

.hfc-ico { font-size: 21px; flex-shrink: 0; }
.hfc-main {
  font-size: 13px; font-weight: 700;
  color: var(--ink); line-height: 1.2;
}
.hfc-sub {
  font-size: 11px; color: var(--ink-3);
  font-weight: 300; line-height: 1.3;
}

/* ──── LAYER 5: Decorative detail lines ──── */
/* Thin vertical accent line — editorial feel */
.hs-vline {
  position: absolute;
  right: 12%;
  top: 15%;
  bottom: 15%;
  width: 1px;
  background: linear-gradient(
    to bottom,
    transparent 0%,
    rgba(239,163,181,.3) 20%,
    rgba(239,163,181,.3) 80%,
    transparent 100%
  );
  z-index: 1;
  pointer-events: none;
}

/* Small cross/plus decorations */
.hs-plus {
  position: absolute;
  color: rgba(175,145,210,.3);
  font-size: 18px;
  font-weight: 300;
  z-index: 1;
  pointer-events: none;
  animation: plusDrift 8s ease-in-out infinite;
  user-select: none;
}
.hs-plus-1 { top: 18%; left: 10%; animation-delay: 0s; }
.hs-plus-2 { top: 72%; right: 9%; animation-delay: 2s; font-size: 14px; }
.hs-plus-3 { top: 44%; right: 6%; animation-delay: 4s; font-size: 12px; opacity: .6; }
@keyframes plusDrift {
  0%,100% { transform: translate(0,0) rotate(0deg); }
  50%      { transform: translate(3px,-4px) rotate(15deg); }
}

/* ─────────────────────────────
   RESPONSIVE
───────────────────────────── */
@media (max-width: 960px) {
  #hero {
    grid-template-columns: 1fr;
    min-height: auto;
    padding-bottom: 52px;
  }
  .hero-left {
    padding: 52px 24px 28px;
    order: 2;
    text-align: center;
  }
  .hero-tag { margin-left: auto; margin-right: auto; }
  .hero-rule { margin-left: auto; margin-right: auto; }
  .hero-p { margin-left: auto; margin-right: auto; }
  .hero-btn { margin-left: auto; margin-right: auto; }
  .hero-trust { justify-content: center; }
  .hero-proof { justify-content: center; }
  .hero-right { order: 1; height: 420px; }
  .hs-bottle-wrap { width: 240px; }
  .hs-glow-1 { width: 320px; height: 320px; }
  .hs-geo-circle { width: 300px; height: 300px; }
  .hs-geo-circle-2 { width: 220px; height: 220px; }
  .hs-ground { width: 190px; }
  .hfc-1 { left: 8px; }
  .hfc-2 { right: 8px; }
  .hfc-3 { display: none; }
  .hs-vline { display: none; }
}
@media (max-width: 560px) {
  .hs-bottle-wrap { width: 190px; }
  .hero-right { height: 340px; }
  .hfc { padding: 9px 13px; }
  .hfc-main { font-size: 12px; }
  .hfc-sub { font-size: 10px; }
  .hfc-ico { font-size: 18px; }
}




/* ═══════════════════════════════════════════════════════════
   HERO PRODUCT — DEFINITIVE FIX V11
   
   Problem: Solid-bg product photo creates visible "box"
   Solution: CSS mask-image fades photo edges to transparent
             + color-matched background blob behind product
             + proper drop-shadow (no blend modes)
═══════════════════════════════════════════════════════════ */

/* ── Step 1: Match hero bg to product photo tone ──────────
   The product photo bg is ~#d4a8b4 (warm rose).
   We inject a radial blob at the right panel position
   that exactly matches that tone so the photo merges in.
─────────────────────────────────────────────────────────── */
#hero {
  background:
    /* Color-match blob: positioned where product sits */
    radial-gradient(ellipse 55% 65% at 75% 50%,
      #d8aeb8  0%,
      #ddb8c4  18%,
      #e4c8d2  36%,
      #F3D6DE  54%,
      transparent 72%
    ),
    /* Base gradient — left side clean cream */
    linear-gradient(155deg,
      #FFFBFC  0%,
      #FDECEF  22%,
      #FDECEF  46%,
      #F3D6DE  68%,
      #e8d4e6  100%
    ) !important;
}

/* ── Step 2: The bottle wrapper with mask ──────────────────
   mask-image creates a radial fade:
   - Center of image: fully visible (product visible)
   - Edges: fade to transparent (background disappears)
   This makes any solid background "melt" into the page.
─────────────────────────────────────────────────────────── */
.hs-bottle-wrap {
  position: relative;
  z-index: 5;
  width: 460px;
  margin-right: -8px;

  /* mask removida — PNG já vem com fundo transparente, a imagem se integra naturalmente ao gradiente da hero */
}

/* ── Step 3: The image itself — clean, no blend mode ───────
   - NO mix-blend-mode (remove it entirely)
   - Subtle filter for premium feel
   - drop-shadow uses warm rose tone matching the scene
─────────────────────────────────────────────────────────── */
.hs-bottle {
  width: 100%;
  display: block;

  /* Renderização limpa: sem blend mode, sem contrast/saturate/brightness;
     apenas uma sombra suave e natural — a imagem já vem tratada */
  mix-blend-mode: normal !important;
  filter: drop-shadow(0 24px 48px rgba(60, 25, 40, .18));

  animation: bottleSway 9s ease-in-out infinite;
  transform-origin: 50% 94%;
}

/* ── Step 4: Glow BEHIND product — creates floating feel ───
   This is a pseudo-element on the wrapper (not the image)
   so it sits under the photo and creates depth.
─────────────────────────────────────────────────────────── */
.hs-bottle-wrap::before {
  content: '';
  position: absolute;
  top: 50%; left: 50%;
  transform: translate(-50%, -50%);
  width: 90%; height: 85%;
  border-radius: 50%;
  background: radial-gradient(ellipse at 48% 52%,
    rgba(215, 155, 172, .55)  0%,
    rgba(200, 140, 158, .32) 32%,
    rgba(185, 128, 148, .14) 58%,
    transparent               78%
  );
  filter: blur(32px);
  z-index: -1;
  pointer-events: none;
  animation: glowBehind 9s ease-in-out infinite;
}
@keyframes glowBehind {
  0%,100% { transform: translate(-50%,-50%) scale(1); opacity: .88; }
  50%      { transform: translate(-50%,-55%) scale(1.1); opacity: 1; }
}

/* Rim light: top-right specular highlight (studio feel) */
.hs-bottle-wrap::after {
  content: '';
  position: absolute;
  top: 6%; right: 8%;
  width: 38%; height: 42%;
  background: radial-gradient(ellipse at center,
    rgba(255, 244, 248, .58)  0%,
    rgba(248, 228, 236, .30) 45%,
    transparent               70%
  );
  filter: blur(16px);
  z-index: -1;
  pointer-events: none;
  animation: rimLight 7s ease-in-out infinite reverse;
}
@keyframes rimLight {
  0%,100% { opacity: .65; }
  50%      { opacity: 1; }
}

/* ── Step 5: Ground shadow (contact shadow) ─────────────── */
.hs-ground {
  position: absolute;
  bottom: 6%; left: 50%;
  transform: translateX(-50%);
  width: 340px; height: 36px;
  background: radial-gradient(ellipse at center,
    rgba(100, 48, 66, .2) 0%,
    transparent 68%
  );
  filter: blur(18px);
  border-radius: 50%;
  pointer-events: none;
  z-index: 4;
  animation: groundShadow 9s ease-in-out infinite;
}
@keyframes groundShadow {
  0%,100% { transform: translateX(-50%) scaleX(1);    opacity: .55; }
  50%      { transform: translateX(-50%) scaleX(1.08); opacity: .78; }
}

/* ── Step 6: Sync glow layers to rose palette ──────────── */
.hs-glow-1 {
  background: radial-gradient(ellipse at 48% 52%,
    rgba(215, 158, 172, .40)  0%,
    rgba(198, 145, 160, .22) 28%,
    rgba(180, 135, 152, .10) 52%,
    transparent               70%
  ) !important;
  filter: blur(42px) !important;
  width: 520px !important;
  height: 520px !important;
}
.hs-glow-2 {
  background: radial-gradient(ellipse at 44% 50%,
    rgba(230, 178, 190, .44) 0%,
    rgba(215, 162, 178, .26) 32%,
    transparent               65%
  ) !important;
  filter: blur(26px) !important;
}

/* ── Step 7: Responsive ─────────────────────────────────── */
@media (max-width: 960px) {
  .hs-bottle-wrap {
    width: 255px !important;
    margin-right: 0 !important;
  }
  /* mask mobile removida — desnecessária com PNG transparente */
}
@media (max-width: 560px) {
  .hs-bottle-wrap { width: 205px !important; }
}


/* ════════════════════════════════════════════════════════
   PAIN SECTION — V11 REBUILD
   Layout: split grid, image left, copy right
   Images: real hair loss + broken nail thumbnails
   Goal: immediate emotional identification
════════════════════════════════════════════════════════ */

/* ── Section wrapper ── */
#pain {
  background: #1A0A14;
  padding: 0;
  overflow: hidden;
}

/* ── Main grid: image left | copy right ── */
.pain-wrap {
  display: grid;
  grid-template-columns: 1fr 1fr;
  min-height: 64vh;                                                     /* override v14: 88vh → 64vh */
  align-items: stretch;
}

/* ─────────────────────────────
   LEFT: IMAGE PANEL
───────────────────────────── */
.pain-visual {
  position: relative;
  overflow: hidden;
  background: #150612;
}

/* Main image: hair brush with hair loss */
.pain-img-main {
  width: 100%;
  height: 100%;
  min-height: 420px;                                                    /* override v14: 540 → 420 */
  object-fit: cover;
  object-position: center 30%;
  display: block;

  /* Slightly desaturate + darken edges: makes it feel real,
     not like a stock photo. Cool tone reinforces the "pain" mood */
  filter: contrast(1.06) saturate(.82) brightness(.9);
  transition: transform 10s ease, filter .5s;
}
.pain-visual:hover .pain-img-main {
  transform: scale(1.04);
  filter: contrast(1.08) saturate(.88) brightness(.92);
}

/* Gradient fade right → blends into copy panel */
.pain-fade {
  position: absolute;
  inset: 0;
  background:
    linear-gradient(to right, transparent 50%, rgba(26,10,20,.97) 100%),
    linear-gradient(to bottom, rgba(26,10,20,.28) 0%, transparent 16%,
      transparent 80%, rgba(26,10,20,.6) 100%);
  pointer-events: none;
}

/* ── Live indicator badge ── */
.pain-badge {
  position: absolute;
  top: 24px; left: 24px;
  display: flex; align-items: center; gap: 8px;
  background: rgba(255,255,255,.07);
  border: 1px solid rgba(255,255,255,.12);
  backdrop-filter: blur(10px);
  border-radius: 8px;
  padding: 7px 14px;
  z-index: 3;
}
.pain-dot {
  width: 7px; height: 7px;
  border-radius: 50%;
  background: #E63E5C;
  box-shadow: 0 0 7px rgba(255,77,109,.75);
  animation: dotBlink 2s ease-in-out infinite;
  flex-shrink: 0;
}
@keyframes dotBlink {
  0%,100% { opacity: 1; }
  50%      { opacity: .22; }
}
.pain-badge-txt {
  font-size: 10.5px; font-weight: 700;
  letter-spacing: .13em; text-transform: uppercase;
  color: rgba(255,255,255,.54);
}

/* ── Thumbnail strip at bottom: 2 pain proofs ── */
.pain-thumbs {
  position: absolute;
  bottom: 22px; left: 20px; right: 20px;
  display: flex; gap: 10px;
  z-index: 3;
}
.pain-thumb {
  flex: 1;
  border-radius: 10px;
  overflow: hidden;
  border: 1.5px solid rgba(255,255,255,.1);
  cursor: default;
  transition: border-color .3s, transform .3s;
  position: relative;
}
.pain-thumb:hover {
  border-color: rgba(220,80,96,.45);
  transform: translateY(-3px);
}
.pain-thumb img {
  width: 100%;
  height: 70px;
  object-fit: cover;
  /* Stronger desaturate for thumbnails — reinforces problem */
  filter: saturate(.6) contrast(1.08);
  transition: filter .3s;
  display: block;
}
.pain-thumb:hover img { filter: saturate(.85) contrast(1.08); }
.pain-thumb-lbl {
  position: absolute;
  bottom: 0; left: 0; right: 0;
  background: linear-gradient(to top, rgba(0,0,0,.82), transparent);
  padding: 6px 7px 5px;
  font-size: 10px; font-weight: 700;
  color: rgba(255,255,255,.58);
  letter-spacing: .08em; text-transform: uppercase;
  text-align: center;
}

/* ─────────────────────────────
   RIGHT: COPY PANEL
───────────────────────────── */
.pain-copy {
  padding: 68px 52px 68px 44px;
  display: flex;
  flex-direction: column;
  justify-content: center;
  background: #1A0A14;
  position: relative;
}

/* Subtle top separator accent */
.pain-copy::before { content: none; }                                    /* override v14: hairline removida */

/* Eyebrow label */
.pain-eye {
  font-size: 10.5px; font-weight: 700;
  letter-spacing: .18em; text-transform: uppercase;
  color: rgba(255,77,109,.62);
  margin-bottom: 18px;
  display: flex; align-items: center; gap: 10px;
}
.pain-eye::before { content: none; }                                     /* override v14: dash decorativo removido */

/* Section headline */
.pain-title {
  font-family: var(--ff-s);
  font-size: clamp(24px, 2.8vw, 38px);
  font-weight: 400;
  line-height: 1.12;
  color: #fff;
  margin-bottom: 13px;
  letter-spacing: -.01em;
}
.pain-title em {
  font-style: italic;
  color: rgba(239,163,181,.82);
}

/* Intro paragraph */
.pain-intro {
  font-size: 14px; font-weight: 300;
  color: rgba(255,255,255,.38);
  line-height: 1.85;
  margin-bottom: 30px;
  border-left: 2px solid rgba(192,90,124,.2);
  padding-left: 15px;
  max-width: 440px;
}

/* Numbered pain list */
.pain-list { list-style: none; margin-bottom: 28px; }

.pl {
  display: flex;
  gap: 0;
  align-items: stretch;
  padding: 17px 0;
  border-bottom: 1px solid rgba(255,255,255,.05);
  transition: background .2s;
  position: relative;
  cursor: default;
}
.pl:last-child { border-bottom: none; }
.pl:hover {
  background: rgba(255,255,255,.025);
  margin: 0 -16px;
  padding-left: 16px;
  padding-right: 16px;
  border-radius: 8px;
}

/* Large ghost number */
.pl-n {
  font-family: var(--ff-s);
  font-size: 32px; font-weight: 300;
  color: rgba(192,90,124,.14);
  line-height: 1;
  width: 46px; flex-shrink: 0;
  padding-top: 2px;
  transition: color .3s;
}
.pl:hover .pl-n { color: rgba(192,90,124,.28); }

.pl-b { flex: 1; }
.pl-t {
  font-family: var(--ff-s);
  font-size: 19px; font-weight: 400;
  color: rgba(255,255,255,.88);
  margin-bottom: 3px;
  line-height: 1.25;
}
.pl-d {
  font-size: 13px; font-weight: 300;
  color: rgba(255,255,255,.37);
  line-height: 1.72;
}

/* Side accent bar on hover */
.pl-bar {
  flex-shrink: 0;
  width: 3px;
  align-self: stretch;
  border-radius: 0 3px 3px 0;
  margin-left: 14px;
  background: var(--rose-d);
  opacity: 0;
  transition: opacity .3s;
}
.pl:hover .pl-bar { opacity: 1; }

/* "Why" explanation box */
.pain-why {
  background: rgba(192,90,124,.07);
  border: 1px solid rgba(192,90,124,.14);
  border-radius: 12px;
  padding: 17px 19px;
  display: flex; gap: 13px; align-items: flex-start;
}
.pain-why-ico { font-size: 19px; flex-shrink: 0; margin-top: 1px; }
.pain-why-title {
  font-size: 13px; font-weight: 700;
  color: rgba(239,163,181,.86);
  margin-bottom: 4px; letter-spacing: .02em;
}
.pain-why-text {
  font-size: 13px; font-weight: 300;
  color: rgba(255,255,255,.36);
  line-height: 1.78;
}
.pain-why-text strong {
  color: rgba(255,255,255,.62);
  font-weight: 500;
}

/* ── Responsive ── */
@media (max-width: 900px) {
  .pain-wrap {
    grid-template-columns: 1fr;
    min-height: auto;
  }
  .pain-visual {
    order: 1;
    min-height: 300px;
  }
  .pain-img-main { min-height: 300px; }
  /* On mobile, fade bottom instead of right */
  .pain-fade {
    background:
      linear-gradient(to bottom,
        transparent 55%,
        rgba(26,10,20,.97) 100%);
  }
  .pain-copy {
    order: 2;
    padding: 42px 24px 50px;
  }
  .pain-copy::before { left: 24px; right: 24px; }
  /* Hide thumbs on mobile to keep it clean */
  .pain-thumbs { display: none; }
}
@media (max-width: 560px) {
  .pain-visual { min-height: 260px; }
  .pain-img-main { min-height: 260px; }
  .pain-title { font-size: clamp(22px, 5.5vw, 34px); }
}


/* ════════════════════════════════════════════════════════
   BENEFITS — V12 EDITORIAL REBUILD
   Concept: "O resultado que você quer" — desire-driven
   Layout: hero image + copy + 2 accent images
   Reference: Ritual, AG1, Hims editorial sections
════════════════════════════════════════════════════════ */

#benefits {
  background: #FFF8FA;
  padding: 0;
  overflow: hidden;
}

/* ── Outer wrapper ── */
.ben-wrap {
  display: grid;
  grid-template-columns: 58fr 42fr;
  min-height: 70vh;                                                     /* override v14: 92vh → 70vh */
  align-items: stretch;
}

/* ══════════════════════════════════
   LEFT — HERO RESULT IMAGE
══════════════════════════════════ */
.ben-hero-img {
  position: relative;
  overflow: hidden;
  background: #FDECEF;
}

/* The main image — long healthy hair */
.ben-hero-img img {
  width: 100%;
  height: 100%;
  min-height: 460px;                                                    /* override v14: 600 → 460 (-23%) */
  object-fit: cover;
  /* Crop to show hair from mid-back up */
  object-position: center 15%;
  display: block;
  /* Premium filter: warm, slightly lifted, high contrast */
  filter: contrast(1.05) saturate(1.06) brightness(1.03);
  transition: transform 10s ease;
}
.ben-hero-img:hover img {
  transform: scale(1.04);
}

/* Top gradient — creates breathing room */
.ben-img-top-fade {
  position: absolute;
  top: 0; left: 0; right: 0;
  height: 120px;
  background: linear-gradient(to bottom,
    rgba(255,248,250,.6) 0%, transparent 100%);
  pointer-events: none;
}

/* "Após ELFIT" result label */
.ben-result-tag {
  position: absolute;
  top: 28px; left: 28px;
  display: flex; align-items: center; gap: 8px;
  background: rgba(255,255,255,.9);
  backdrop-filter: blur(14px) saturate(1.6);
  border: 1px solid rgba(255,77,109,.22);
  border-radius: 8px;
  padding: 8px 15px;
  z-index: 3;
}
.ben-result-tag-dot {
  width: 8px; height: 8px;
  border-radius: 50%;
  background: var(--sage);
  box-shadow: 0 0 8px rgba(255,77,109,.6);
  flex-shrink: 0;
}
.ben-result-tag span {
  font-size: 11px; font-weight: 700;
  letter-spacing: .13em; text-transform: uppercase;
  color: var(--sage);
}

/* Day counter badge */
.ben-days-badge {
  position: absolute;
  bottom: 32px; left: 28px;
  background: rgba(42,26,34,.78);
  backdrop-filter: blur(12px);
  border: 1px solid rgba(255,255,255,.1);
  border-radius: 12px;
  padding: 12px 18px;
  z-index: 3;
}
.ben-days-num {
  font-family: var(--ff-s);
  font-size: 36px; font-weight: 300;
  color: rgba(230,188,196,.9);
  line-height: 1; display: block;
}
.ben-days-lbl {
  font-size: 11px; font-weight: 500;
  color: rgba(255,255,255,.4);
  letter-spacing: .1em; text-transform: uppercase;
}

/* ══════════════════════════════════
   RIGHT — COPY + ACCENT IMAGES
══════════════════════════════════ */
.ben-copy-col {
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  background: #FFF8FA;
  border-left: 1px solid rgba(42,26,34,.06);
}

/* Top: text block */
.ben-copy {
  padding: 64px 52px 40px 44px;
  flex: 1;
}

/* Eyebrow */
.ben-eye {
  font-size: 10.5px; font-weight: 700;
  letter-spacing: .18em; text-transform: uppercase;
  color: var(--sage);
  margin-bottom: 16px;
  display: flex; align-items: center; gap: 9px;
}
.ben-eye::before { content: none; }                                      /* dash decorativo removido */

/* Headline */
.ben-title {
  font-family: var(--ff-s);
  font-size: clamp(28px, 2.8vw, 40px);
  font-weight: 400; line-height: 1.1;
  color: var(--ink);
  letter-spacing: -.01em;
  margin-bottom: 10px;
}
.ben-title em { font-style: italic; color: var(--rose-d); }

/* Sub */
.ben-sub {
  font-size: 15px; font-weight: 300;
  color: var(--ink-2); line-height: 1.85;
  margin-bottom: 32px;
  max-width: 380px;
}

/* Benefit list — clean checkmark style */
.ben-list { list-style: none; margin-bottom: 36px; }

.bl {
  display: flex; gap: 14px; align-items: flex-start;
  padding: 14px 0;
  border-bottom: 1px solid rgba(42,26,34,.06);
}
.bl:last-child { border-bottom: none; }

/* Check icon circle */
.bl-ck {
  flex-shrink: 0;
  width: 28px; height: 28px;
  border-radius: 50%;
  background: rgba(255,77,109,.1);
  border: 1.5px solid rgba(255,77,109,.25);
  display: flex; align-items: center; justify-content: center;
  color: var(--sage);
  font-size: 12px; font-weight: 800;
  margin-top: 1px;
  transition: all .3s;
}
.bl:hover .bl-ck {
  background: var(--sage);
  color: #fff;
  border-color: var(--sage);
}

.bl-body { flex: 1; }
.bl-t {
  font-size: 15px; font-weight: 600;
  color: var(--ink); margin-bottom: 3px;
  line-height: 1.3;
}
.bl-d {
  font-size: 13px; font-weight: 300;
  color: var(--ink-3); line-height: 1.68;
}

/* Timeline indicator */
.bl-time {
  flex-shrink: 0;
  font-size: 11px; font-weight: 600;
  color: var(--sage);
  background: rgba(255,77,109,.08);
  border-radius: 20px;
  padding: 3px 10px;
  margin-top: 2px;
  letter-spacing: .03em;
  white-space: nowrap;
}

/* CTA */
.ben-cta-row {
  display: flex; gap: 12px;
  flex-wrap: wrap;
  align-items: center;
  padding-bottom: 36px;
}

/* Bottom: 2 accent images */
.ben-accents {
  display: grid;
  grid-template-columns: 1fr 1fr;
  border-top: 1px solid rgba(42,26,34,.06);
  flex-shrink: 0;
}

.ba-item {
  position: relative;
  overflow: hidden;
  height: 200px;
  cursor: default;
}
.ba-item:first-child {
  border-right: 1px solid rgba(42,26,34,.06);
}
.ba-item img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  filter: contrast(1.04) saturate(1.05);
  transition: transform 6s ease, filter .4s;
}
.ba-item:hover img {
  transform: scale(1.06);
  filter: contrast(1.06) saturate(1.1);
}
/* Dark-to-transparent bottom fade on accent images */
.ba-fade {
  position: absolute; inset: 0;
  background: linear-gradient(to top,
    rgba(42,26,34,.55) 0%,
    rgba(42,26,34,.1) 45%,
    transparent 70%
  );
  pointer-events: none;
}
.ba-label {
  position: absolute;
  bottom: 14px; left: 50%;
  transform: translateX(-50%);
  display: flex; align-items: center; gap: 6px;
  background: rgba(255,255,255,.88);
  backdrop-filter: blur(10px) saturate(1.5);
  border-radius: 20px;
  padding: 5px 14px 5px 8px;
  box-shadow: 0 4px 14px rgba(42,26,34,.12);
  white-space: nowrap;
}
.ba-label-dot {
  width: 20px; height: 20px;
  border-radius: 50%;
  display: flex; align-items: center; justify-content: center;
  font-size: 11px;
}
.ba-label-txt {
  font-size: 11px; font-weight: 700;
  color: var(--ink);
  letter-spacing: .05em; text-transform: uppercase;
}

/* ── Responsive ── */
@media (max-width: 960px) {
  .ben-wrap {
    grid-template-columns: 1fr;
    min-height: auto;
  }
  /* Mobile: image first */
  .ben-hero-img {
    order: 1;
    min-height: 380px;
  }
  .ben-hero-img img { min-height: 380px; }
  .ben-copy-col {
    order: 2;
    border-left: none;
    border-top: 1px solid rgba(42,26,34,.06);
  }
  .ben-copy { padding: 44px 24px 28px; }
  .ben-cta-row { padding-bottom: 0; }
  .ben-accents { height: auto; }
  .ba-item { height: 160px; }
}
@media (max-width: 560px) {
  .ben-hero-img { min-height: 300px; }
  .ben-hero-img img { min-height: 300px; }
  .ba-item { height: 130px; }
  .ben-title { font-size: clamp(24px, 6.5vw, 36px); }
  .bl-time { display: none; }
}


/* ╔═══════════════════════════════════════════════════════════════╗
   ║  ELFIT — FINAL REFINEMENT v14                                ║
   ║  Senior UI/UX Polish Layer                                   ║
   ║  Injected as override block — does not break existing CSS    ║
   ╚═══════════════════════════════════════════════════════════════╝ */

/* ─────────────────────────────────────────────────────────────────
   1. DESIGN TOKEN UPGRADES — alinhado à nova paleta premium
───────────────────────────────────────────────────────────────── */
:root {
  /* Ink — warm burgundy tints */
  --ink:   #2A1A22;
  --ink-2: #6B4C5A;
  --ink-3: #8A7588;

  /* Cream — richer warm base */
  --cream: #FFF8FA;

  /* Rose system — paleta premium */
  --rose:   #FDECEF;
  --rose-m: #EFA3B5;
  --rose-d: #6A1B3D;
  --rose-l: #FAE3EA;

  /* CTA — alinhado a --cta / --cta-hover */
  --sage:   #FF4D6D;
  --sage-l: #FF6B85;
  --sage-d: #E63E5C;

  /* Secundário (gold remap) */
  --gold:   #C05A7C;
  --gold-l: #EFA3B5;

  /* Lilac → seção destacada */
  --lilac:   #FAE3EA;
  --lilac-d: #F3D6DE;

  /* Typography scale */
  --ff-s: 'Cormorant Garamond', Georgia, serif;
  --ff-b: 'Inter', system-ui, sans-serif;

  /* Motion */
  --ease:     cubic-bezier(.22, 1, .36, 1);
  --ease-in:  cubic-bezier(.4, 0, 1, 1);
  --ease-out: cubic-bezier(0, 0, .2, 1);
  --dur-fast: 220ms;
  --dur-mid:  380ms;
  --dur-slow: 650ms;

  /* Spacing scale (8px base) */
  --sp-1: 8px;
  --sp-2: 16px;
  --sp-3: 24px;
  --sp-4: 32px;
  --sp-5: 40px;
  --sp-6: 48px;
  --sp-7: 64px;
  --sp-8: 80px;
  --sp-9: 96px;
  --sp-10: 120px;

  /* Radius */
  --r-sm: 8px;
  --r-md: 14px;
  --r-lg: 22px;
  --r-xl: 32px;
  --r-full: 999px;

  /* Shadows — warm-toned */
  --shadow-xs: 0 1px 3px rgba(42,26,34,.08);
  --shadow-sm: 0 2px 8px rgba(42,26,34,.07), 0 1px 3px rgba(42,26,34,.05);
  --shadow-md: 0 8px 24px rgba(42,26,34,.09), 0 2px 6px rgba(42,26,34,.05);
  --shadow-lg: 0 20px 56px rgba(42,26,34,.1), 0 6px 16px rgba(42,26,34,.06);
  --shadow-xl: 0 40px 90px rgba(42,26,34,.12), 0 12px 28px rgba(42,26,34,.07);
}

/* ─────────────────────────────────────────────────────────────────
   2. GLOBAL BASE REFINEMENTS
───────────────────────────────────────────────────────────────── */
html {
  scroll-behavior: smooth;
  text-rendering: optimizeLegibility;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

body {
  background: var(--cream);
  color: var(--ink);
  /* Slightly improved base line-height */
  line-height: 1.65;
}

/* ─────────────────────────────────────────────────────────────────
   3. TYPOGRAPHY REFINEMENTS
───────────────────────────────────────────────────────────────── */

/* Display headings: tighter tracking, better optical sizing */
.h1, .hero-h1, .pain-title, .sol-title, .ben-title,
.off-title, .guar-t, .faq-hd-t, .ctaf-t,
.story-title, .rev-hd-t {
  font-feature-settings: "kern" 1, "liga" 1;
  text-wrap: balance;
}

/* Body text: optimal reading line-height */
.hero-p, .pain-intro, .sol-mechanism p,
.ss-d, .bl-d, .pl-d, .sfact-t,
.rcard-text, .story-quote, .guar-p, .faq-a-in,
.ctaf-s {
  line-height: 1.88;
  letter-spacing: .012em;
}

/* Secondary labels: consistent weight */
.ben-eye, .pain-eye, .sol-eye, .off-urg,
.pain-badge-txt, .res-intro-eye,
.ben-result-tag span, .strip-l,
.ba-label-txt, .pain-thumb-lbl {
  font-feature-settings: "kern" 1;
  letter-spacing: .16em;
}

/* ─────────────────────────────────────────────────────────────────
   4. ANNOUNCE BAR — refined
───────────────────────────────────────────────────────────────── */
#ann {
  background: linear-gradient(90deg, #2A1A22 0%, #2E1828 50%, #2A1A22 100%);
  padding: 11px 20px;
  font-size: 13px;
  letter-spacing: .025em;
  border-bottom: 1px solid rgba(255,255,255,.05);
}

/* ─────────────────────────────────────────────────────────────────
   5. NAV — elevated glassmorphism
───────────────────────────────────────────────────────────────── */
#nav {
  background: rgba(255,248,250,.94);
  backdrop-filter: blur(28px) saturate(1.6) brightness(1.02);
  border-bottom: 1px solid rgba(192,90,124,.1);
}
#nav.scrolled {
  box-shadow: 0 2px 28px rgba(42,26,34,.07), 0 1px 4px rgba(42,26,34,.04);
}
.logo {
  font-size: 27px;
  letter-spacing: .06em;
}
.nav-links a {
  font-size: 13px;
  font-weight: 400;
  letter-spacing: .025em;
  transition: color var(--dur-fast) var(--ease);
}
.nav-cta {
  padding: 10px 22px;
  font-size: 13px;
  font-weight: 600;
  letter-spacing: .04em;
  background: var(--sage);
  border-radius: var(--r-full);
  transition: all var(--dur-mid) var(--ease);
  box-shadow: 0 2px 8px rgba(230,62,92,.2);
}
.nav-cta:hover {
  background: var(--sage-d);
  transform: translateY(-1px);
  box-shadow: 0 6px 18px rgba(230,62,92,.3);
}

/* ─────────────────────────────────────────────────────────────────
   6. HERO — refined
───────────────────────────────────────────────────────────────── */
#hero {
  background:
    radial-gradient(ellipse 65% 65% at 75% 45%,
      rgba(208,168,185,.2) 0%, transparent 65%),
    radial-gradient(ellipse 50% 55% at 22% 80%,
      rgba(188,168,218,.14) 0%, transparent 65%),
    linear-gradient(152deg,
      #FFFBFC 0%, #FDECEF 25%, #FAE3EA 52%,
      #F3D6DE 75%, #EFA3B5 100%) !important;
}

.hero-left {
  padding: var(--sp-10) var(--sp-5) var(--sp-10) var(--sp-8);
}

.hero-tag {
  padding: 6px 18px 6px 8px;
  background: rgba(192,90,124,.08);
  border: 1px solid rgba(192,90,124,.18);
  border-radius: var(--r-full);
  margin-bottom: var(--sp-4);
  transition: background var(--dur-mid) var(--ease),
              border-color var(--dur-mid) var(--ease);
}
.hero-tag:hover {
  background: rgba(192,90,124,.13);
  border-color: rgba(192,90,124,.28);
}

.hero-h1 {
  font-size: clamp(38px, 4.2vw, 60px);
  line-height: 1.08;                    /* refinado: 1.05–1.15 */
  letter-spacing: -.018em;
  margin-bottom: var(--sp-3);           /* leve respiro extra abaixo */
}

.hero-rule {
  width: 40px; height: 2px;
  background: linear-gradient(90deg, var(--rose-d), var(--rose-m));
  border-radius: 2px;
  margin-bottom: var(--sp-4);           /* +8px → mais ar entre h1 e p */
  transform-origin: left center;
}

.hero-p {
  font-size: 15.5px;
  line-height: 1.88;
  color: var(--ink-2);
  max-width: 420px;                     /* limite premium de leitura */
  margin-bottom: var(--sp-5);
}

/* Trust chips */
.hero-trust { gap: 14px; margin: var(--sp-3) 0; }
.htag {
  font-size: 12px;
  font-weight: 400;
  color: var(--ink-3);
  transition: color var(--dur-fast);
}
.htag:hover { color: var(--ink-2); }
.htag-v { color: var(--sage); font-weight: 700; }

/* Social proof row */
.hero-proof {
  padding-top: var(--sp-3);
  border-top: 1px solid rgba(192,90,124,.1);
}
.pav-stars {
  font-size: 13px;
  color: var(--gold);
  letter-spacing: -.5px;
  margin-bottom: 1px;
}
.pav-t { font-size: 12.5px; color: var(--ink-3); line-height: 1.45; }
.pav-t strong { color: var(--ink); font-weight: 700; }

/* Floating cards */
.hfc {
  background: rgba(255,255,255,.9);
  backdrop-filter: blur(22px) saturate(2);
  border: 1px solid rgba(205,168,180,.28);
  border-radius: var(--r-md);
  padding: 11px 16px;
  box-shadow:
    0 10px 32px rgba(42,26,34,.09),
    0 2px 8px rgba(42,26,34,.05),
    inset 0 1px 0 rgba(255,255,255,.88);
  transition: transform var(--dur-mid) var(--ease),
              box-shadow var(--dur-mid) var(--ease);
}
.hfc:hover {
  transform: translateY(-4px) !important;
  box-shadow:
    0 16px 44px rgba(42,26,34,.12),
    0 4px 12px rgba(42,26,34,.07),
    inset 0 1px 0 rgba(255,255,255,.9);
}
.hfc-main { font-size: 13px; font-weight: 700; color: var(--ink); }
.hfc-sub  { font-size: 11px; color: var(--ink-3); font-weight: 300; margin-top: 1px; }

/* ─────────────────────────────────────────────────────────────────
   7. BUTTONS — premium gradient + elevated hover
───────────────────────────────────────────────────────────────── */

/* Primary CTA — sage green with subtle gradient */
.hero-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
  width: 100%;
  max-width: 400px;

  background: linear-gradient(
    135deg,
    #FF4D6D 0%,
    #527f62 60%,
    #E63E5C 100%
  );
  color: #fff;
  font-family: var(--ff-b);
  font-size: 15.5px;
  font-weight: 700;
  letter-spacing: .025em;
  padding: 19px 40px;
  border-radius: var(--r-full);
  border: none;
  cursor: pointer;
  text-decoration: none;
  position: relative;
  overflow: hidden;
  margin-bottom: var(--sp-2);

  box-shadow:
    0 4px 14px rgba(230,62,92,.28),
    0 1px 4px rgba(230,62,92,.16),
    inset 0 1px 0 rgba(255,255,255,.2),
    inset 0 -1px 0 rgba(0,0,0,.1);

  transition:
    transform var(--dur-mid) var(--ease),
    box-shadow var(--dur-mid) var(--ease),
    background var(--dur-mid) var(--ease);
}

/* Inner light sweep */
.hero-btn::before {
  content: '';
  position: absolute;
  top: 0; left: -100%;
  width: 60%; height: 100%;
  background: linear-gradient(
    90deg,
    transparent,
    rgba(255,255,255,.16),
    transparent
  );
  transition: left var(--dur-slow) var(--ease);
}
.hero-btn:hover::before { left: 160%; }

.hero-btn:hover {
  background: linear-gradient(135deg, #FF4D6D 0%, #E63E5C 100%);
  transform: translateY(-3px);
  box-shadow:
    0 18px 48px rgba(230,62,92,.36),
    0 6px 14px rgba(230,62,92,.2),
    inset 0 1px 0 rgba(255,255,255,.22),
    inset 0 -1px 0 rgba(0,0,0,.12);
}
.hero-btn:active {
  transform: translateY(-1px);
  box-shadow:
    0 8px 22px rgba(230,62,92,.28),
    0 2px 6px rgba(230,62,92,.14);
  transition-duration: 80ms;
}

.hero-btn-arr {
  font-size: 17px;
  display: inline-block;
  transition: transform var(--dur-mid) var(--ease);
}
.hero-btn:hover .hero-btn-arr { transform: translateX(5px); }

/* Secondary link */
.hero-link {
  font-size: 13.5px;
  font-weight: 500;
  color: var(--ink-2);
  letter-spacing: .01em;
  transition: color var(--dur-fast);
}
.hero-link:hover { color: var(--rose-d); }

/* Kit buy buttons */
.kbg {
  background: linear-gradient(135deg, #FF4D6D 0%, #E63E5C 100%);
  color: #fff;
  border: none;
  box-shadow:
    0 4px 14px rgba(230,62,92,.28),
    inset 0 1px 0 rgba(255,255,255,.18);
  transition: all var(--dur-mid) var(--ease);
}
.kbg:hover {
  background: linear-gradient(135deg, #FF4D6D 0%, #C03052 100%);
  transform: translateY(-2px);
  box-shadow:
    0 14px 36px rgba(230,62,92,.38),
    inset 0 1px 0 rgba(255,255,255,.2);
}

.kbw {
  background: rgba(255,255,255,.055);
  color: rgba(255,255,255,.42);
  border: 1px solid rgba(255,255,255,.12);
  transition: all var(--dur-mid) var(--ease);
}
.kbw:hover {
  background: rgba(255,255,255,.1);
  color: rgba(255,255,255,.82);
  border-color: rgba(255,255,255,.28);
  transform: translateY(-1px);
}

/* Nav CTA override */
.nav-cta {
  background: linear-gradient(135deg, #FF4D6D 0%, #E63E5C 100%);
  box-shadow: 0 2px 10px rgba(230,62,92,.22);
}
.nav-cta:hover {
  background: linear-gradient(135deg, #FF4D6D 0%, #C03052 100%);
  box-shadow: 0 6px 20px rgba(230,62,92,.32);
}

/* ─────────────────────────────────────────────────────────────────
   8. METRICS STRIP — refined
───────────────────────────────────────────────────────────────── */
#strip {
  background: linear-gradient(90deg, #221220 0%, #2A1A2A 50%, #221220 100%);
  padding: var(--sp-6) 0;
  border-top: 1px solid rgba(255,255,255,.04);
  border-bottom: 1px solid rgba(255,255,255,.04);
}
.strip-n {
  font-size: 40px;
  line-height: 1.1;
  margin-bottom: 5px;
}
.strip-n em { color: var(--gold-l); }
.strip-l {
  font-size: 11px;
  letter-spacing: .12em;
  opacity: .38;
}
.strip-item {
  padding: 6px 24px;
  transition: opacity var(--dur-mid);
}
.strip-item:hover { opacity: .85; }

/* ─────────────────────────────────────────────────────────────────
   9. PAIN SECTION — refined
───────────────────────────────────────────────────────────────── */
#pain { background: #0e0c12; }

.pain-wrap { min-height: 64vh; }                                         /* override v14b: 86vh → 64vh */

.pain-img-main {
  filter: contrast(1.07) saturate(.8) brightness(.88);
}

.pain-badge {
  top: var(--sp-4);
  left: var(--sp-4);
  border-radius: var(--r-sm);
  padding: 7px 14px;
}

.pain-copy {
  padding: var(--sp-9) var(--sp-7) var(--sp-9) var(--sp-6);
}

.pain-eye {
  font-size: 10.5px;
  margin-bottom: var(--sp-3);
}

.pain-title {
  font-size: clamp(24px, 2.8vw, 38px);
  line-height: 1.11;
  margin-bottom: 13px;
}

.pain-intro {
  font-size: 14px;
  line-height: 1.9;
  margin-bottom: var(--sp-4);
  border-left: 2px solid rgba(192,90,124,.18);
  padding-left: 15px;
}

.pain-why {
  border-radius: var(--r-md);
  padding: 17px 20px;
  background: rgba(192,90,124,.065);
  border-color: rgba(192,90,124,.13);
}
.pain-why-title { font-size: 13px; font-weight: 700; }
.pain-why-text { font-size: 13px; line-height: 1.78; }

.pl { padding: 16px 0; }
.pl-t {
  font-family: var(--ff-s);
  font-size: 19px;
  margin-bottom: 4px;
}
.pl-d { font-size: 13px; line-height: 1.72; }

/* ─────────────────────────────────────────────────────────────────
   10. SOLUTION SECTION — refined
───────────────────────────────────────────────────────────────── */
#solution { background: var(--cream); }

.sol-wrap { min-height: 60vh; }                                         /* override v14: 80vh → 60vh */

.sol-copy {
  padding: var(--sp-6) var(--sp-6) var(--sp-6) var(--sp-5);              /* override v14: -50% padding (sp-9/sp-8 → sp-6/sp-5) */
}

.sol-eye { font-size: 10.5px; margin-bottom: var(--sp-2); }

.sol-title {
  font-size: clamp(26px, 3vw, 42px);
  line-height: 1.1;
  margin-bottom: 8px;
}

.sol-mechanism {
  border-radius: 0 var(--r-md) var(--r-md) 0;
  padding: 16px 20px;
  margin-bottom: var(--sp-4);
  background: linear-gradient(135deg,
    rgba(230,62,92,.07), rgba(230,62,92,.03));
}
.sol-mechanism p { font-size: 14px; line-height: 1.88; }

.si {
  border-radius: var(--r-md);
  padding: 10px 13px;
  transition:
    border-color var(--dur-mid) var(--ease),
    box-shadow var(--dur-mid) var(--ease),
    transform var(--dur-mid) var(--ease);
}
.si:hover {
  border-color: rgba(192,90,124,.25);
  box-shadow: var(--shadow-sm);
  transform: translateY(-1px);
}
.si-name { font-size: 12.5px; font-weight: 600; }
.si-role { font-size: 11px; color: var(--ink-3); }

/* ─────────────────────────────────────────────────────────────────
   11. BENEFITS SECTION — refined
───────────────────────────────────────────────────────────────── */
#benefits { background: #FDECEF; }

.ben-wrap { min-height: 70vh; }                                          /* override v14b: 88vh → 70vh */

.ben-copy { padding: var(--sp-6) var(--sp-6) var(--sp-4) var(--sp-5); }   /* override v14: -33% padding */

.ben-eye { font-size: 10.5px; margin-bottom: var(--sp-2); }

.ben-title {
  font-size: clamp(26px, 2.8vw, 38px);
  line-height: 1.1;
  margin-bottom: 9px;
}

.ben-sub {
  font-size: 15px;
  line-height: 1.88;
  margin-bottom: var(--sp-4);
  color: var(--ink-2);
}

.bl {
  padding: 14px 0;
  border-bottom: 1px solid rgba(42,26,34,.055);
}
.bl-ck {
  width: 27px; height: 27px;
  border-radius: 50%;
  background: rgba(230,62,92,.09);
  border: 1.5px solid rgba(230,62,92,.22);
  font-size: 11px; font-weight: 800;
  color: var(--sage);
  transition:
    background var(--dur-mid) var(--ease),
    color var(--dur-mid) var(--ease),
    border-color var(--dur-mid) var(--ease),
    transform var(--dur-mid) var(--ease);
}
.bl:hover .bl-ck {
  background: var(--sage);
  color: #fff;
  border-color: var(--sage);
  transform: scale(1.08);
}
.bl-t { font-size: 14.5px; font-weight: 600; line-height: 1.3; }
.bl-d { font-size: 13px; line-height: 1.72; color: var(--ink-3); }
.bl-time {
  font-size: 10.5px; font-weight: 600;
  color: var(--sage);
  background: rgba(230,62,92,.08);
  border-radius: var(--r-full);
  padding: 3px 10px;
  letter-spacing: .03em;
  white-space: nowrap;
  transition: background var(--dur-mid), color var(--dur-mid);
}
.bl:hover .bl-time {
  background: rgba(230,62,92,.15);
}

/* Accent images */
.ba-item {
  height: 195px;
  transition: opacity var(--dur-mid);
}
.ba-item:hover { opacity: .94; }
.ba-label {
  border-radius: var(--r-full);
  padding: 5px 14px 5px 8px;
  box-shadow: var(--shadow-md);
  transition: box-shadow var(--dur-mid), transform var(--dur-mid);
}
.ba-label-txt {
  font-size: 10.5px; font-weight: 700;
  letter-spacing: .1em;
}

/* ─────────────────────────────────────────────────────────────────
   12. RESULTS (STORY) SECTION — refined
───────────────────────────────────────────────────────────────── */
#results { background: #1A0A14; }

.res-intro { padding: var(--sp-7) 0 var(--sp-4); }                         /* -30% (sp-9/sp-6 → sp-7/sp-4) */
.res-intro-title {
  font-size: clamp(26px, 3.8vw, 46px);
  line-height: 1.1;
}
.res-intro-sub {
  font-size: 14px; line-height: 1.82;
  color: rgba(255,255,255,.35);
}

.story-copy {
  padding: var(--sp-5) var(--sp-5) var(--sp-5) var(--sp-4);                /* -30% (sp-8/sp-7/sp-6 → sp-5/sp-4) */
}
.story.rev .story-copy {
  padding: var(--sp-5) var(--sp-4) var(--sp-5) var(--sp-5);
}
.story-title { font-size: clamp(22px, 2.5vw, 33px); }
.story-quote { font-size: 13.5px; line-height: 1.88; }
.sfact-t { font-size: 13px; line-height: 1.7; }

.sstamp-b, .sstamp-a {
  border-radius: var(--r-sm);
  padding: 4px 11px;
}

/* ─────────────────────────────────────────────────────────────────
   13. INGREDIENTS — refined
───────────────────────────────────────────────────────────────── */
#ingr {
  background: linear-gradient(160deg, #221220 0%, #221A24 50%, #1F0E18 100%);
}

.ingr-hd-t { font-size: clamp(24px, 3.5vw, 44px); line-height: 1.1; }
.ingr-hd-sub { font-size: 14px; line-height: 1.82; }

.icard {
  border-radius: var(--r-lg);
  overflow: hidden;
  transition:
    background var(--dur-mid) var(--ease),
    border-color var(--dur-mid) var(--ease),
    transform var(--dur-mid) var(--ease),
    box-shadow var(--dur-mid) var(--ease);
}
.icard:hover {
  background: rgba(255,255,255,.088) !important;
  border-color: rgba(239,163,181,.22) !important;
  transform: translateY(-3px);
  box-shadow: 0 16px 40px rgba(42,26,34,.18);
}
.icard-n { font-family: var(--ff-s); font-size: 20px; }
.icard-d { font-size: 12.5px; line-height: 1.72; color: rgba(255,255,255,.65); }   /* contraste +.25 */

.iseal { font-size: 13px; color: rgba(255,255,255,.58); }                            /* contraste melhor */

/* ─────────────────────────────────────────────────────────────────
   14. REVIEWS — refined
───────────────────────────────────────────────────────────────── */
#reviews { background: var(--rose-l); }

.rev-hd-t { font-size: clamp(24px, 3.5vw, 44px); }
.rr-big { font-size: 80px; }

.rcard {
  border-radius: var(--r-lg);
  padding: 26px;
  box-shadow: var(--shadow-sm);
  border: 1px solid rgba(192,90,124,.08);
  transition:
    transform var(--dur-mid) var(--ease),
    box-shadow var(--dur-mid) var(--ease),
    border-color var(--dur-mid) var(--ease);
}
.rcard:hover {
  transform: translateY(-6px);
  box-shadow: var(--shadow-lg);
  border-color: rgba(192,90,124,.18);
}
.rcard-text { font-size: 14px; line-height: 1.85; }
.rav { border-radius: 50%; border: 2.5px solid var(--rose-m); }
.rav-name { font-size: 13.5px; font-weight: 700; }
.rav-city { font-size: 11.5px; }
.rav-ver { font-size: 10.5px; color: var(--sage); font-weight: 700; }

/* ─────────────────────────────────────────────────────────────────
   15. OFFER SECTION — refined
───────────────────────────────────────────────────────────────── */
#offer {
  background: linear-gradient(160deg, #2A1A22 0%, #2A1828 50%, #1E0E14 100%);
}

.off-title { font-size: clamp(24px, 3.5vw, 44px); }
.off-sub { font-size: 14px; line-height: 1.82; }

.kit {
  border-radius: var(--r-xl);
  padding: 36px 26px;
  transition:
    background var(--dur-mid) var(--ease),
    border-color var(--dur-mid) var(--ease),
    transform var(--dur-mid) var(--ease),
    box-shadow var(--dur-mid) var(--ease);
}
.kit:hover {
  transform: translateY(-8px);
  box-shadow: 0 28px 64px rgba(42,26,34,.25);
}
.kit.pop {
  background: rgba(255,255,255,.09);
  border-color: rgba(230,180,195,.3);
}
.kit-pop-tag {
  font-size: 10.5px; font-weight: 700;
  background: var(--rose-d);
  border-radius: var(--r-sm);
  padding: 4px 12px;
  letter-spacing: .05em;
}
.kit-name { font-family: var(--ff-s); font-size: 24px; color: #fff !important; opacity: 1 !important; }
.kit-qty { font-size: 12.5px; }
.kit-price {
  font-family: var(--ff-s);
  font-size: 48px;
  line-height: 1.05;
}
.kit-inst { font-size: 11.5px; }

.oseal { font-size: 12.5px; }

/* ─────────────────────────────────────────────────────────────────
   16. GUARANTEE — refined
───────────────────────────────────────────────────────────────── */
/* guar-box moved to new authority section CSS */
.guar-box::before { content: none; background: none; }                  /* override v14: barra rainbow removida */
.guar-t { font-size: clamp(26px, 3.8vw, 44px); }
.guar-p { font-size: 15px; line-height: 1.9; }

/* ─────────────────────────────────────────────────────────────────
   17. FAQ — refined
───────────────────────────────────────────────────────────────── */
#faq {
  background: linear-gradient(180deg, var(--cream) 0%, var(--lilac) 100%);
  padding: var(--sp-7) 0;                                                /* override v14: -47% (120 → 64) */
}
.faq-hd-t { font-size: clamp(24px, 3.5vw, 42px); }
.faq-q {
  font-size: 19.5px;
  padding: 20px 0;
  transition: color var(--dur-fast);
}
.faq-a-in { font-size: 14.5px; line-height: 1.9; }
.faq-plus {
  width: 30px; height: 30px;
  border-radius: 50%;
  border: 1.5px solid rgba(192,90,124,.25);
  transition:
    transform var(--dur-mid) var(--ease),
    background var(--dur-mid) var(--ease),
    border-color var(--dur-mid) var(--ease);
}

/* ─────────────────────────────────────────────────────────────────
   18. FINAL CTA — refined
───────────────────────────────────────────────────────────────── */
#cta-f {
  padding: var(--sp-7) 0 var(--sp-8);                                    /* override v14: -47% (120/140 → 64/80) */
  background: linear-gradient(135deg,
    #FDECEF 0%, #FAE3EA 48%, #FAE3EA 100%);
}
.ctaf-t {
  font-size: clamp(38px, 5.5vw, 68px);
  letter-spacing: -.018em;
  line-height: 1.05;
}
.ctaf-s { font-size: 16px; line-height: 1.85; }
.ctaf-micro { font-size: 12.5px; color: var(--ink-3); }
.ctaf-micro span { color: var(--sage); font-weight: 700; }

/* ─────────────────────────────────────────────────────────────────
   19. FOOTER — refined
───────────────────────────────────────────────────────────────── */
footer {
  background: linear-gradient(160deg, #2A1A22 0%, #221A28 100%);
  padding: var(--sp-8) 0 var(--sp-5);
}
.foot-logo img { height: 44px; }                                               /* override v14: equilíbrio com header (52px) */
.foot-desc { font-size: 13.5px; line-height: 1.75; }
.foot-ul a {
  font-size: 13.5px;
  transition: color var(--dur-fast);
}
.foot-legal { font-size: 11.5px; line-height: 1.75; }

/* ─────────────────────────────────────────────────────────────────
   20. STICKY BAR — refined
───────────────────────────────────────────────────────────────── */
#sticky {
  background: rgba(255,248,250,.96);
  backdrop-filter: blur(28px) saturate(1.6);
  border-top: 1px solid rgba(192,90,124,.14);
  box-shadow: 0 -4px 24px rgba(42,26,34,.07);
}
.sk-t { font-family: var(--ff-s); font-size: 18px; }
.sk-s { font-size: 12.5px; }
.sk-p { font-family: var(--ff-s); font-size: 27px; }

/* ─────────────────────────────────────────────────────────────────
   21. SCROLL REVEAL — smoother, staggered
───────────────────────────────────────────────────────────────── */
.rv {
  opacity: 0;
  transform: translateY(28px);
  transition:
    opacity var(--dur-slow) var(--ease),
    transform var(--dur-slow) var(--ease);
  will-change: transform, opacity;
}
.rv.in { opacity: 1; transform: none; }

.rl {
  opacity: 0;
  transform: translateX(-32px);
  transition:
    opacity var(--dur-slow) var(--ease),
    transform var(--dur-slow) var(--ease);
  will-change: transform, opacity;
}
.rl.in { opacity: 1; transform: none; }

.rr {
  opacity: 0;
  transform: translateX(32px);
  transition:
    opacity var(--dur-slow) var(--ease),
    transform var(--dur-slow) var(--ease);
  will-change: transform, opacity;
}
.rr.in { opacity: 1; transform: none; }

.d1 { transition-delay: .09s !important; }
.d2 { transition-delay: .18s !important; }
.d3 { transition-delay: .27s !important; }
.d4 { transition-delay: .36s !important; }

/* ─────────────────────────────────────────────────────────────────
   22. MOBILE REFINEMENTS — premium app feel
───────────────────────────────────────────────────────────────── */
@media (max-width: 960px) {
  .hero-left {
    padding: var(--sp-7) var(--sp-3) var(--sp-4);
    text-align: center;
  }
  .hero-h1 { font-size: clamp(32px, 9vw, 52px); }
  .hero-p { font-size: 15px; margin-left: auto; margin-right: auto; }
  .pain-copy { padding: var(--sp-6) var(--sp-3) var(--sp-7); }
  .sol-copy { padding: var(--sp-6) var(--sp-3) var(--sp-7); }
  .story-copy, .story.rev .story-copy {
    padding: var(--sp-5) var(--sp-3) var(--sp-6);
  }
  .ben-copy { padding: var(--sp-6) var(--sp-3) var(--sp-4); }
  .kits { gap: 12px; }
  .kit { padding: var(--sp-5) var(--sp-3); }
  .guar-box { padding: var(--sp-6) var(--sp-3); }
  .rev-grid { gap: 12px; }
}

@media (max-width: 560px) {
  .hero-h1 { font-size: clamp(30px, 9.5vw, 46px); }
  #strip { padding: var(--sp-5) 0; }
  .strip-n { font-size: 34px; }
  .pain-title { font-size: clamp(22px, 5.5vw, 32px); }
  .sol-title  { font-size: clamp(24px, 6.5vw, 36px); }
  .off-title  { font-size: clamp(24px, 6.5vw, 36px); }
  .ctaf-t     { font-size: clamp(32px, 9vw, 52px); }
  .guar-t     { font-size: clamp(24px, 6.5vw, 36px); }
  .faq-q      { font-size: 17px; }
  .hfc        { padding: 9px 13px; }
}

/* ─────────────────────────────────────────────────────────────────
   23. FOCUS & ACCESSIBILITY
───────────────────────────────────────────────────────────────── */
:focus-visible {
  outline: 2px solid var(--sage);
  outline-offset: 3px;
  border-radius: var(--r-sm);
}

/* Reduced motion */
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    animation-duration: .01ms !important;
    transition-duration: .15ms !important;
  }
  .rv, .rl, .rr {
    opacity: 1 !important;
    transform: none !important;
  }
}

/* ─────────────────────────────────────────────────────────────────
   24. SELECTION COLOR — on-brand
───────────────────────────────────────────────────────────────── */
::selection {
  background: rgba(192,90,124,.18);
  color: var(--ink);
}


/* ╔═══════════════════════════════════════════════════════
   ║  ANIMATION SPEED FIX — v14.1
   ║  Problem: transitions too fast, animations rushed
   ║  Fix: calibrated durations for premium feel
   ╚═══════════════════════════════════════════════════════ */

/* ── 1. Duration tokens — recalibrated ── */
:root {
  --dur-fast: 180ms;   /* micro: color, opacity changes */
  --dur-mid:  320ms;   /* standard: hover lifts, border changes */
  --dur-slow: 520ms;   /* entrances: cards sliding in */
  --dur-xslow: 900ms; /* scroll reveals */
  --ease: cubic-bezier(.22, 1, .36, 1);
}

/* ── 2. Scroll reveal — natural, unhurried ── */
.rv {
  opacity: 0;
  transform: translateY(30px);
  transition:
    opacity  var(--dur-xslow) var(--ease),
    transform var(--dur-xslow) var(--ease);
  will-change: transform, opacity;
}
.rv.in { opacity: 1; transform: none; }

.rl {
  opacity: 0;
  transform: translateX(-34px);
  transition:
    opacity  var(--dur-xslow) var(--ease),
    transform var(--dur-xslow) var(--ease);
  will-change: transform, opacity;
}
.rl.in { opacity: 1; transform: none; }

.rr {
  opacity: 0;
  transform: translateX(34px);
  transition:
    opacity  var(--dur-xslow) var(--ease),
    transform var(--dur-xslow) var(--ease);
  will-change: transform, opacity;
}
.rr.in { opacity: 1; transform: none; }

/* Stagger delays — comfortable rhythm */
.d1 { transition-delay: .12s !important; }
.d2 { transition-delay: .24s !important; }
.d3 { transition-delay: .36s !important; }
.d4 { transition-delay: .48s !important; }

/* ── 3. Hover transitions — precise, not snappy ── */

/* Cards */
.rcard,
.icard,
.kit,
.ben-accents .ba-item,
.hfc {
  transition:
    transform 320ms var(--ease),
    box-shadow 320ms var(--ease),
    border-color 280ms ease,
    background 280ms ease,
    opacity 280ms ease !important;
}

/* Buttons */
.hero-btn {
  transition:
    transform 320ms var(--ease),
    box-shadow 320ms var(--ease),
    background 280ms ease !important;
}
.hero-btn::before {
  transition: left 600ms var(--ease) !important;
}

.kbg, .kbw {
  transition:
    transform 320ms var(--ease),
    box-shadow 320ms var(--ease),
    background 280ms ease,
    color 220ms ease,
    border-color 220ms ease !important;
}

.nav-cta {
  transition:
    transform 280ms var(--ease),
    box-shadow 280ms var(--ease),
    background 240ms ease !important;
}

/* Ingredient cards */
.si {
  transition:
    border-color 280ms ease,
    box-shadow 280ms var(--ease),
    transform 280ms var(--ease) !important;
}

/* Benefit checkmarks */
.bl-ck {
  transition:
    background 280ms ease,
    color 220ms ease,
    border-color 220ms ease,
    transform 280ms var(--ease) !important;
}

/* Pain list items */
.pl { transition: background 200ms ease !important; }
.pl-n { transition: color 280ms ease !important; }
.pl-bar { transition: opacity 280ms ease !important; }

/* Story rows */
.story { transition: background 280ms ease !important; }

/* Image zooms */
.pain-img-main,
.sol-img,
.ben-hero-img img,
.ba-item img,
.story-img img {
  transition: transform 8s ease, filter 500ms ease !important;
}

/* Nav links */
.nav-links a { transition: color 180ms ease !important; }
.htag { transition: color 180ms ease !important; }
.hero-link { transition: color 180ms ease !important; }

/* FAQ toggle */
.faq-q { transition: color 180ms ease !important; }
.faq-a { transition: max-height 400ms ease !important; }
.faq-plus {
  transition:
    transform 300ms var(--ease),
    background 220ms ease,
    border-color 220ms ease !important;
}

/* ── 4. Floating card animations — smooth, dreamy ── */
@keyframes cardFloat {
  0%,100% { transform: translateY(0); }
  50%      { transform: translateY(-8px); }
}
.hfc { animation-duration: 5s !important; }
.hfc-1 { animation: cardFloat 5.5s ease-in-out infinite; }
.hfc-2 { animation: cardFloat 5.5s ease-in-out infinite; animation-delay: 2.2s; }
.hfc-3 { animation: cardFloat 5.5s ease-in-out infinite; animation-delay: 1.1s; }

/* ── 5. Product bottle — slow, elegant sway ── */
@keyframes bottleSway {
  0%,100% { transform: translateY(0px)    rotate(0deg); }
  38%      { transform: translateY(-15px)  rotate(.3deg); }
  72%      { transform: translateY(-7px)   rotate(-.15deg); }
}
.hs-bottle {
  animation: bottleSway 9s ease-in-out infinite !important;
}

/* ── 6. Glow animations — very slow, ambient ── */
@keyframes glowPulse {
  0%,100% { transform: scale(1) translate(0,0); opacity: .88; }
  50%      { transform: scale(1.07) translate(-4px,-6px); opacity: 1; }
}
.hs-glow-1 { animation: glowPulse 10s ease-in-out infinite !important; }
.hs-glow-2 { animation: glowPulse 8s  ease-in-out infinite reverse !important; }

/* Ground shadow pulse */
@keyframes groundShadow {
  0%,100% { transform: translateX(-50%) scaleX(1);    opacity: .55; }
  50%      { transform: translateX(-50%) scaleX(1.1); opacity: .8; }
}
.hs-ground { animation: groundShadow 9s ease-in-out infinite !important; }

/* ── 7. Ring spins — very slow ── */
.hs-geo-circle   { animation: geoSpin 60s linear infinite !important; }
.hs-geo-circle-2 { animation: geoSpin 40s linear infinite reverse !important; }

/* Dot pulse — slow and subtle */
@keyframes dotPulse {
  0%,100% { transform: scale(1);   opacity: .5; }
  50%      { transform: scale(1.7); opacity: .9; }
}
.hs-dot-1 { animation: dotPulse 5s  ease-in-out infinite !important; }
.hs-dot-2 { animation: dotPulse 7s  ease-in-out infinite 1s !important; }
.hs-dot-3 { animation: dotPulse 6s  ease-in-out infinite .5s !important; }
.hs-dot-4 { animation: dotPulse 8s  ease-in-out infinite 2s !important; }

/* Plus accents */
@keyframes plusDrift {
  0%,100% { transform: translate(0,0) rotate(0deg); }
  50%      { transform: translate(3px,-4px) rotate(12deg); }
}
.hs-plus-1 { animation: plusDrift 9s  ease-in-out infinite !important; }
.hs-plus-2 { animation: plusDrift 11s ease-in-out infinite 2s !important; }
.hs-plus-3 { animation: plusDrift 13s ease-in-out infinite 4s !important; }

/* ── 8. Hero glow behind product ── */
@keyframes glowBehind {
  0%,100% { transform: translate(-50%,-50%) scale(1);   opacity: .88; }
  50%      { transform: translate(-50%,-55%) scale(1.1); opacity: 1; }
}
.hs-bottle-wrap::before {
  animation: glowBehind 10s ease-in-out infinite !important;
}
@keyframes rimLight {
  0%,100% { opacity: .65; }
  50%      { opacity: 1; }
}
.hs-bottle-wrap::after {
  animation: rimLight 8s ease-in-out infinite reverse !important;
}

/* ── 9. Result tag dots ── */
@keyframes dotBlink {
  0%,100% { opacity: 1; }
  50%      { opacity: .2; }
}
.pain-dot,
.ben-result-tag-dot {
  animation: dotBlink 2.5s ease-in-out infinite !important;
}

/* Background blobs — very slow */
@keyframes blobA {
  from { transform: translate(0,0) scale(1); }
  to   { transform: translate(14px,-12px) scale(1.05); }
}
#hero::before { animation: blobA 22s ease-in-out infinite alternate !important; }
#hero::after  { animation: blobA 28s ease-in-out infinite alternate-reverse !important; }

/* ── 10. Sticky bar — smooth slide ── */
#sticky {
  transition: transform 500ms var(--ease) !important;
}

/* ── 11. Nav scrolled state ── */
#nav {
  transition: box-shadow 400ms ease !important;
}

/* ── 12. Reduced motion — keep some feel, just slower ── */
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    animation-duration: .5s !important;
    transition-duration: .2s !important;
  }
  .rv, .rl, .rr {
    opacity: 1 !important;
    transform: none !important;
    transition: none !important;
  }
}


/* ╔══════════════════════════════════════════════════════════════╗
   ║  MOBILE-FIRST RESPONSIVE SYSTEM — v15                       ║
   ║  8px spacing scale · fluid typography · 1→2→3 col grids    ║
   ╚══════════════════════════════════════════════════════════════╝

   Strategy:
   - All <style> above = desktop base
   - This block overrides DOWN from desktop using max-width
   - Each section gets its own breakpoint block for clarity
   - No fixed heights on any container
   - All font sizes use clamp() for fluid scaling
*/

/* ─────────────────────────────────────────────────────────────
   GLOBAL MOBILE BASE
───────────────────────────────────────────────────────────────  */
@media (max-width: 959px) {

  /* Wrap: full-width with comfortable gutter */
  .wrap, .wrap--sm {
    padding: 0 20px;
  }

  /* Section padding: tighter but breathable */
  .section { padding: 64px 0; }

  /* ── Announce bar ── */
  #ann {
    font-size: 12px;
    padding: 9px 16px;
    line-height: 1.5;
  }

  /* ── Nav ── */
  .nav-in { padding: 15px 20px; }
  .logo   { font-size: 24px; }
  .nav-ul { display: none; }
  .ham    { display: flex; }
  .nav-cta {
    padding: 9px 18px;
    font-size: 12.5px;
  }

  /* ── HERO ── */
  #hero {
    grid-template-columns: 1fr;
    min-height: auto;
    padding-bottom: 0;
  }

  /* Product stage: compact, impactful */
  .hero-right {
    order: 1;
    height: 64vw;
    min-height: 280px;
    max-height: 420px;
  }

  /* Bottle: proportional to viewport */
  .hs-bottle-wrap {
    width: clamp(180px, 44vw, 260px) !important;
    margin-right: 0 !important;
  }

  /* Rings and glows: scaled down */
  .hs-geo-circle   { width: 66vw !important; height: 66vw !important; }
  .hs-geo-circle-2 { width: 88vw !important; height: 88vw !important; }
  .hs-glow-1 { width: 70vw !important; height: 70vw !important; }
  .hs-glow-2 { width: 50vw !important; height: 50vw !important; }

  /* Floating cards: smaller, repositioned */
  .hfc {
    padding: 9px 13px;
    border-radius: 12px;
  }
  .hfc-1 { left: 10px !important; top: 14% !important; }
  .hfc-2 { right: 10px !important; bottom: 18% !important; }
  .hfc-3 { display: none !important; }
  .hfc-main { font-size: 12px; }
  .hfc-sub  { font-size: 10px; }

  /* Hero copy: centered, generous padding */
  .hero-left {
    order: 2;
    padding: 36px 20px 48px;
    text-align: center;
  }

  /* Center-align helpers */
  .hero-tag,
  .hero-rule,
  .hero-btn {
    margin-left: auto;
    margin-right: auto;
  }
  .hero-trust  { justify-content: center; }
  .hero-proof  { justify-content: center; }

  .hero-h1 {
    font-size: clamp(32px, 9vw, 48px);
    line-height: 1.06;
    letter-spacing: -.014em;
  }
  .hero-p {
    font-size: 15px;
    line-height: 1.85;
    max-width: 100%;
    margin-left: auto;
    margin-right: auto;
  }

  /* Button: full-width, tall enough to tap */
  .hero-btn {
    width: 100%;
    max-width: 100%;
    padding: 18px 32px;
    font-size: 15px;
    min-height: 56px;
    border-radius: 16px;
  }
  .hero-link { font-size: 13px; }
  .hero-trust { gap: 10px; flex-wrap: wrap; }
  .htag { font-size: 11.5px; }

  /* ── STRIP ── */
  #strip { padding: 36px 0; }
  .strip-grid {
    grid-template-columns: 1fr 1fr;
    gap: 0;
  }
  .strip-item {
    padding: 14px 16px;
    border-right: none;
    border-bottom: 1px solid rgba(255,255,255,.07);
  }
  .strip-item:nth-child(odd)  { border-right: 1px solid rgba(255,255,255,.07); }
  .strip-item:nth-child(3),
  .strip-item:nth-child(4)    { border-bottom: none; }
  .strip-n  { font-size: 36px; }
  .strip-l  { font-size: 10.5px; }

  /* ── PAIN ── */
  .pain-wrap {
    grid-template-columns: 1fr;
    min-height: auto;
  }
  .pain-visual {
    order: 1;
    min-height: 58vw;
    max-height: 340px;
  }
  .pain-img-main {
    min-height: 0 !important;
    height: 100%;
  }
  .pain-fade {
    background:
      linear-gradient(to bottom,
        transparent 55%,
        rgba(14,12,18,.97) 100%) !important;
  }
  .pain-thumbs { display: none; }
  .pain-badge  { top: 16px; left: 16px; }

  .pain-copy {
    order: 2;
    padding: 40px 20px 52px;
  }
  .pain-copy::before { left: 20px; right: 20px; }
  .pain-title {
    font-size: clamp(22px, 5.5vw, 34px);
    line-height: 1.12;
  }
  .pain-intro { font-size: 13.5px; }
  .pl { padding: 15px 0; }
  .pl-t { font-size: 17px; }
  .pl-d { font-size: 13px; }
  .pain-why { padding: 15px 17px; }
  .pain-why-text { font-size: 13px; }

  /* ── SOLUTION ── */
  .sol-wrap {
    grid-template-columns: 1fr;
    min-height: auto;
  }
  .sol-visual {
    order: 1;
    min-height: 58vw;
    max-height: 320px;
  }
  .sol-img {
    min-height: 0 !important;
    height: 100%;
  }
  .sol-img-fade {
    background:
      linear-gradient(to bottom,
        transparent 55%,
        rgba(255,248,250,.97) 100%) !important;
  }
  .sol-float-card { display: none; }

  .sol-copy {
    order: 2;
    padding: 40px 20px 52px;
  }
  .sol-title  { font-size: clamp(24px, 6.5vw, 38px); }
  .sol-ingr   { grid-template-columns: 1fr 1fr; gap: 8px; }
  .si         { padding: 9px 12px; }
  .si-name    { font-size: 12px; }
  .si-role    { font-size: 10.5px; }
  .ss         { gap: 13px; padding: 13px 0; }
  .ss-num     { width: 28px; height: 28px; font-size: 11.5px; }
  .ss-t       { font-size: 14px; }
  .ss-d       { font-size: 13px; }

  /* ── BENEFITS ── */
  .ben-wrap {
    grid-template-columns: 1fr;
    min-height: auto;
  }
  .ben-hero-img {
    order: 1;
    min-height: 64vw;
    max-height: 400px;
  }
  .ben-hero-img img {
    min-height: 0 !important;
    height: 100%;
    object-position: center 18%;
  }
  .ben-copy-col {
    order: 2;
    border-left: none;
    border-top: 1px solid rgba(42,26,34,.06);
  }
  .ben-copy { padding: 40px 20px 28px; }
  .ben-title { font-size: clamp(24px, 6.5vw, 36px); }
  .ben-sub   { font-size: 14.5px; }
  .bl { padding: 13px 0; }
  .bl-t { font-size: 14px; }
  .bl-d { font-size: 13px; }
  .bl-time { display: none; }  /* Clean on mobile */

  .ben-accents { }
  .ba-item { height: 140px; }

  /* ── RESULTS (STORIES) ── */
  .res-intro { padding: 56px 0 40px; }
  .res-intro-title {
    font-size: clamp(24px, 6.5vw, 40px);
    line-height: 1.1;
  }
  .res-intro-sub { font-size: 14px; }

  .story,
  .story.rev {
    grid-template-columns: 1fr;
    direction: ltr;
    min-height: auto;
  }
  .story-img {
    order: 1;
  }
  .story-img img {
    min-height: 56vw !important;
    max-height: 340px;
  }
  .sfade-r,
  .sfade-l {
    background:
      linear-gradient(to bottom,
        transparent 52%,
        rgba(26,10,20,.97) 100%) !important;
  }
  .story-stamps { top: 16px; left: 16px; }
  .story-days   { bottom: 14px; right: 14px; }
  .sdays-n      { font-size: 24px; }

  .story-copy,
  .story.rev .story-copy {
    order: 2;
    padding: 32px 20px 44px;
  }
  .story-num    { display: none; }
  .story-title  {
    font-size: clamp(20px, 5.5vw, 30px);
    margin-bottom: 12px;
  }
  .story-quote  { font-size: 13.5px; line-height: 1.82; }
  .sfact-t      { font-size: 13px; }
  .sa-name      { font-size: 13px; }

  .res-bottom   { padding: 40px 0 52px; }
  .res-bottom-t { font-size: 13.5px; }

  /* ── INGREDIENTS ── */
  #ingr { padding: 48px 0; }                          /* -25% no mobile (64→48) */
  .ingr-hd-t   { font-size: clamp(22px, 6vw, 38px); }
  .ingr-hd-sub { font-size: 13.5px; }

  .ingr-layout {
    grid-template-columns: 1fr;
    gap: 16px;
    margin-bottom: 21px;                              /* -25% (28→21) */
  }
  .ingr-hero img {
    height: 176px !important;                         /* -20% (220→176) */
    border-radius: 18px !important;
  }
  .ingr-cards {
    grid-template-columns: 1fr 1fr;
    gap: 12px;
  }
  .icard-img   { height: 96px; }                      /* -20% (120→96) */
  .icard-body  { padding: 17px; }                     /* +3px de respiro */
  .icard-n     { font-size: 17px; }
  .icard-d     { font-size: 12px; }
  .ingr-seals  { gap: 16px; }
  .iseal       { font-size: 12px; }

  /* ── REVIEWS ── */
  #reviews { padding: 64px 0; }
  .rev-hd-t { font-size: clamp(22px, 6vw, 38px); }

  .rev-rating {
    flex-direction: column;
    gap: 18px;
    align-items: center;
    margin-bottom: 40px;
  }
  .rr-big   { font-size: 72px; }
  .rr-sep   { display: none; }
  .rr-stars { font-size: 20px; }

  .rev-grid {
    grid-template-columns: 1fr;
    gap: 12px;
  }
  .rcard        { padding: 22px 20px; border-radius: 18px; }
  .rcard-text   { font-size: 14px; line-height: 1.82; }
  .rav          { width: 40px; height: 40px; }
  .rav-name     { font-size: 13px; }

  /* ── OFFER ── */
  #offer { padding: 64px 0; }
  .off-title { font-size: clamp(22px, 6vw, 38px); }

  .kits {
    grid-template-columns: 1fr;
    gap: 14px;
  }
  .kit {
    padding: 32px 22px;
    border-radius: 22px;
  }
  .kit.pop { transform: none !important; }  /* No scale on mobile */
  .kit-img  { width: 90px !important; margin-bottom: 12px; }
  .kit-name { font-size: 22px; }
  .kit-price { font-size: 44px; }
  .kit-btn  {
    padding: 16px;
    font-size: 14px;
    min-height: 52px;
    border-radius: 14px;
  }

  .off-seals {
    gap: 14px;
    margin-top: 32px;
  }
  .oseal { font-size: 12px; }

  /* ── GUARANTEE ── */
  #guar { padding: 64px 0; }
  .guar-box {
    padding: 40px 22px;
    border-radius: 22px;
  }
  .guar-ico { font-size: 58px; margin-bottom: 18px; }
  .guar-t   { font-size: clamp(24px, 6.5vw, 38px); }
  .guar-p   { font-size: 14.5px; line-height: 1.88; }
  .guar-items { gap: 22px; }
  .gi-i  { font-size: 22px; }
  .gi-l  { font-size: 10.5px; }

  /* ── FAQ ── */
  #faq { padding: 64px 0; }
  .faq-hd-t { font-size: clamp(22px, 6vw, 36px); }
  .faq-wrap { max-width: 100%; }
  .faq-q    {
    font-size: 17px;
    padding: 18px 0;
    line-height: 1.35;
  }
  .faq-a-in { font-size: 14px; line-height: 1.85; }
  .faq-plus { width: 28px; height: 28px; font-size: 16px; }

  /* ── FINAL CTA ── */
  #cta-f { padding: 72px 0 80px; }
  .ctaf-t {
    font-size: clamp(30px, 8.5vw, 52px);
    letter-spacing: -.014em;
    line-height: 1.07;
  }
  .ctaf-s    { font-size: 15px; line-height: 1.82; }
  .ctaf-btns { flex-direction: column; align-items: center; }
  .ctaf-btns .hero-btn {
    max-width: 100%;
    width: 100%;
    border-radius: 16px;
    min-height: 56px;
  }
  .ctaf-micro {
    font-size: 12px;
    line-height: 1.8;
  }

  /* ── FOOTER ── */
  footer { padding: 48px 0 32px; }
  .foot-g {
    grid-template-columns: 1fr;
    gap: 32px;
  }
  .foot-logo img { height: 38px; }                                            /* mobile: ligeiramente menor */
  .foot-desc { font-size: 13px; max-width: 100%; }
  .foot-title { font-size: 10px; }
  .foot-ul a  { font-size: 13px; }
  .foot-copy  { font-size: 11px; }
  .foot-legal { font-size: 11px; }

  /* ── STICKY BAR ── */
  #sticky {
    flex-direction: column;
    gap: 10px;
    padding: 14px 20px;
    text-align: center;
  }
  .sk-r {
    justify-content: center;
    width: 100%;
  }
  .sk-r .hero-btn {
    flex: 1;
    max-width: 220px;
    padding: 12px 22px;
    font-size: 13.5px;
    min-height: 48px;
    border-radius: 12px;
  }
  .sk-t { font-size: 16px; }
  .sk-s { font-size: 11.5px; }
  .sk-p { font-size: 24px; }
}

/* ─────────────────────────────────────────────────────────────
   SMALL PHONES — < 400px
───────────────────────────────────────────────────────────────  */
@media (max-width: 399px) {
  .wrap, .wrap--sm { padding: 0 16px; }

  .hero-h1 { font-size: 30px; }

  .hero-right {
    height: 72vw;
    max-height: 280px;
  }
  .hs-bottle-wrap { width: 46vw !important; }

  .hfc         { padding: 8px 11px; }
  .hfc-main    { font-size: 11px; }
  .hfc-sub     { font-size: 9.5px; }

  .pain-title  { font-size: 21px; }
  .pl-t        { font-size: 16px; }
  .story-title { font-size: 19px; }

  .rcard     { padding: 18px 16px; }
  .kit       { padding: 26px 18px; }
  .guar-box  { padding: 32px 16px; }
  .ctaf-t    { font-size: 28px; }

  .strip-n { font-size: 30px; }
  .strip-l { font-size: 10px; }

  .ingr-cards     { grid-template-columns: 1fr; }
  .icard-img      { height: 112px; }                  /* -20% (140→112) */
  .sol-ingr       { grid-template-columns: 1fr; }

  .ben-accents    { grid-template-columns: 1fr; }
  .ba-item        { height: 160px; }
  .ba-item:first-child { border-right: none; border-bottom: 1px solid rgba(42,26,34,.06); }
}

/* ─────────────────────────────────────────────────────────────
   TABLET — 560px → 959px
───────────────────────────────────────────────────────────────  */
@media (min-width: 560px) and (max-width: 959px) {

  .wrap, .wrap--sm { padding: 0 28px; }

  /* 2-col grids on tablet */
  .rev-grid {
    grid-template-columns: 1fr 1fr;
    gap: 14px;
  }
  .kits {
    grid-template-columns: 1fr 1fr;
    gap: 14px;
  }
  /* Kit trimestral spans full width on tablet */
  .kits .kit:last-child {
    grid-column: 1 / -1;
    max-width: 480px;
    margin: 0 auto;
    width: 100%;
  }

  .ingr-cards {
    grid-template-columns: 1fr 1fr;
    gap: 14px;
  }

  .sol-ingr {
    grid-template-columns: 1fr 1fr;
    gap: 10px;
  }

  .ben-accents .ba-item { height: 170px; }

  .hero-right  { max-height: 480px; }
  .hs-bottle-wrap { width: clamp(200px, 38vw, 300px) !important; }

  /* Tablet hero gets 2 col if wide enough */
  #hero {
    grid-template-columns: 1fr;
  }

  .ctaf-btns .hero-btn {
    max-width: 420px;
    width: auto;
  }

  .strip-grid { grid-template-columns: repeat(4, 1fr); }
  .strip-item {
    border-bottom: none;
    border-right: 1px solid rgba(255,255,255,.07);
  }
  .strip-item:last-child { border-right: none; }
  .strip-item:nth-child(odd) { border-right: 1px solid rgba(255,255,255,.07); }

  .guar-box { padding: 52px 44px; }
}

/* ─────────────────────────────────────────────────────────────
   DESKTOP — 960px → 1199px
───────────────────────────────────────────────────────────────  */
@media (min-width: 960px) and (max-width: 1199px) {

  .wrap { padding: 0 28px; }

  #hero { grid-template-columns: 1fr 1fr; }
  .hero-left { padding: 80px 28px 80px 48px; }
  .hero-h1 { font-size: clamp(36px, 3.8vw, 54px); }

  .pain-wrap    { grid-template-columns: 1fr 1fr; }
  .pain-copy    { padding: 56px 44px 56px 36px; }

  .sol-wrap     { grid-template-columns: 1fr 1fr; }
  .sol-copy     { padding: 56px 44px 56px 36px; }

  .ben-wrap     { grid-template-columns: 55fr 45fr; }
  .ben-copy     { padding: 56px 40px 36px 36px; }

  .story-copy,
  .story.rev .story-copy { padding: 44px 44px 44px 36px; }

  .kits { gap: 14px; }
  .kit.pop { transform: scale(1.03) !important; }
  .kit  { padding: 32px 22px; }

  .rev-grid { grid-template-columns: repeat(3, 1fr); gap: 14px; }
  .ingr-cards { grid-template-columns: 1fr 1fr; gap: 14px; }
  .ingr-hero img { height: 360px !important; }
}

/* ─────────────────────────────────────────────────────────────
   LARGE DESKTOP — ≥ 1200px
───────────────────────────────────────────────────────────────  */
@media (min-width: 1200px) {
  .wrap { max-width: 1140px; padding: 0 24px; }

  #hero { grid-template-columns: 55fr 45fr; }
  .hero-left { padding: 90px 32px 90px 60px; }

  .pain-copy,
  .sol-copy { padding: 72px 56px 72px 48px; }

  .kits { gap: 16px; }
  .kit.pop { transform: scale(1.04) !important; }
}


/* ════════════════════════════════════════════════════════
   GUARANTEE + AUTHORITY SECTION — V15
   Layout: 2-column grid
     Left  (~320px): nutritionist authority block
     Right (flex-1): guarantee card
   Mobile: stacked, nutri first
════════════════════════════════════════════════════════ */

#guar {
  background: var(--cream);
  padding: 72px 0;
}

/* ── Outer 2-col grid ── */
.guar-grid {
  display: grid;
  /* Especialista PROTAGONISTA (~60%) | Garantia secundária (~40%) */
  grid-template-columns: 1.4fr 1fr;
  gap: 64px;
  align-items: center;
  max-width: 1180px;
  margin: 0 auto;
  padding: 0 24px;
}

/* ════════════════════════════
   LEFT: NUTRITIONIST BLOCK
════════════════════════════ */
.guar-nutri {
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
  position: relative;
  padding: 44px 24px; /* mais respiro — protagonismo total */
}

/* Photo container — premium, dominante */
.guar-nutri-photo {
  position: relative;
  width: 100%;
  max-width: 500px; /* +39% (era 360px) — foco visual */
  border-radius: 26px;
  overflow: hidden;
  margin-bottom: 30px;

  /* Sombra premium em camadas — eleva a foto da página */
  box-shadow:
    0 44px 96px rgba(42,26,34,.28),
    0 18px 40px rgba(42,26,34,.16),
    0 6px 14px rgba(42,26,34,.10),
    0 1px 3px rgba(192,90,124,.08);
}

/* The photo itself */
.guar-nutri-photo img {
  width: 100%;
  /* Show from head to mid-torso */
  aspect-ratio: 3/4;
  object-fit: cover;
  object-position: center 12%;
  display: block;
  /* Black studio bg: slight contrast lift */
  filter: contrast(1.03) brightness(1.01);
}

/* Verified badge overlaid on bottom of photo */
.guar-nutri-badge {
  position: absolute;
  bottom: 14px;
  left: 50%;
  transform: translateX(-50%);
  display: inline-flex;
  align-items: center;
  gap: 6px;
  background: rgba(255,255,255,.92);
  backdrop-filter: blur(14px) saturate(1.6);
  border: 1px solid rgba(255,77,109,.22);
  border-radius: 40px;
  padding: 5px 13px 5px 8px;
  box-shadow:
    0 4px 16px rgba(42,26,34,.12),
    inset 0 1px 0 rgba(255,255,255,.9);
  white-space: nowrap;
}
.guar-nutri-badge-dot {
  width: 20px; height: 20px;
  border-radius: 50%;
  background: var(--sage);
  display: flex; align-items: center; justify-content: center;
  font-size: 10px; color: #fff; font-weight: 800;
  flex-shrink: 0;
}
.guar-nutri-badge span:last-child {
  font-size: 11px; font-weight: 700;
  color: var(--sage);
  letter-spacing: .08em; text-transform: uppercase;
}

/* Name block below photo */
.guar-nutri-info {
  padding: 0 8px;
}
.guar-nutri-name {
  font-family: var(--ff-s);
  font-size: 46px; font-weight: 600; /* +35% sobre 34 — destaque máximo */
  color: var(--ink);
  letter-spacing: -.015em;
  margin-bottom: 8px;
  line-height: 1.08;
}
.guar-nutri-title {
  font-size: 16px; font-weight: 700; /* mais legível */
  color: var(--sage);
  letter-spacing: .12em; text-transform: uppercase;
  margin-bottom: 6px;
}
.guar-nutri-crn {
  font-size: 14px; font-weight: 500;
  color: var(--ink-3);
  letter-spacing: .06em;
  margin-bottom: 16px;
}
.guar-nutri-spec {
  font-size: 16.5px; font-weight: 300;
  color: var(--ink-2);
  line-height: 1.75;
  font-style: italic;
  max-width: 560px;
  margin: 0 auto;
}

/* Divider line between nutri block and guarantee */
.guar-divider {
  display: none; /* hidden on desktop, shown on mobile */
  width: 60px; height: 1px;
  background: linear-gradient(90deg,
    transparent, rgba(192,90,124,.3), transparent);
  margin: 0 auto;
}

/* ════════════════════════════
   RIGHT: GUARANTEE CARD
════════════════════════════ */
.guar-box {
  /* Card SECUNDÁRIO — recuado em relação à especialista */
  max-width: 380px; /* limita largura — não compete com a foto */
  margin: 0 auto;

  background: rgba(255,255,255,.78); /* mais sutil */
  border-radius: 16px;
  padding: 26px 24px; /* reduzido ~25% sobre antes */
  text-align: center;
  box-shadow:
    0 8px 22px rgba(42,26,34,.04),
    0 2px 6px rgba(42,26,34,.03);
  border: 1px solid rgba(192,90,124,.06);
  position: relative;
  overflow: hidden;
}

/* Top accent bar */
.guar-box::before { content: none; }                                     /* barra rainbow removida — clean premium */

/* Shield icon — reduzido ~25% */
.guar-ico {
  font-size: 36px;
  margin-bottom: 10px;
  display: block;
  opacity: .85;
  filter: drop-shadow(0 2px 4px rgba(42,26,34,.06));
}

.guar-t {
  font-family: var(--ff-s);
  font-size: clamp(17px, 1.9vw, 22px);
  font-weight: 400; line-height: 1.18;
  color: var(--ink-2);
  margin-bottom: 8px;
  letter-spacing: -.01em;
}
.guar-t em { font-style: italic; color: var(--rose-d); }

.guar-p {
  font-size: 12.5px; font-weight: 300;
  color: var(--ink-3); line-height: 1.75;
  max-width: 340px;
  margin: 0 auto 14px;
}

/* Guarantee chips — discretos */
.guar-items {
  display: flex;
  justify-content: center;
  gap: 12px;
  flex-wrap: wrap;
}
.gi { text-align: center; }
.gi-i {
  font-size: 15px;
  margin-bottom: 3px;
  display: block;
  opacity: .9;
}
.gi-l {
  font-size: 9.5px; font-weight: 700;
  color: var(--ink-3);
  letter-spacing: .08em;
  text-transform: uppercase;
  display: block;
}

/* ════════════════════════════
   RESPONSIVE
════════════════════════════ */
@media (max-width: 959px) {
  .guar-grid {
    grid-template-columns: 1fr;
    gap: 0;
    padding: 0 20px;
  }

  #guar { padding: 56px 0; }

  .guar-nutri {
    padding: 16px 8px 48px;
    border-bottom: 1px solid rgba(192,90,124,.12);
    margin-bottom: 36px;
  }

  .guar-nutri-photo {
    max-width: 380px;
  }
  .guar-nutri-name { font-size: 36px; line-height: 1.1; }
  .guar-nutri-title { font-size: 15px; }
  .guar-nutri-crn { font-size: 13.5px; }
  .guar-nutri-spec { font-size: 15.5px; }

  .guar-box {
    padding: 22px 18px;
    border-radius: 14px;
    max-width: 360px;
    margin: 0 auto;
  }
  .guar-t { font-size: clamp(16px, 4.2vw, 20px); }
  .guar-p { font-size: 12.5px; max-width: 320px; }
  .guar-ico { font-size: 32px; margin-bottom: 8px; }
  .guar-items { gap: 12px; }
  .gi-i { font-size: 14px; }
  .gi-l { font-size: 9.5px; }
}

@media (max-width: 399px) {
  .guar-nutri-photo { max-width: 300px; }
  .guar-nutri-name { font-size: 32px; }
  .guar-box { padding: 20px 14px; max-width: 100%; }
}

@media (min-width: 960px) and (max-width: 1199px) {
  .guar-grid {
    grid-template-columns: 1.3fr 1fr;
    gap: 48px;
    padding: 0 28px;
  }
  .guar-nutri-photo { max-width: 440px; }
  .guar-nutri-name { font-size: 40px; }
  .guar-box { padding: 22px 20px; max-width: 340px; }
}


/* ═══════════════════════════════════════
   COMMUNITY (Instagram)
═══════════════════════════════════════ */
#community{
  padding:64px 0;
  background:linear-gradient(180deg,var(--cream) 0%,var(--rose) 100%);
  overflow:hidden;
}
.comm-grid{
  display:grid;grid-template-columns:1fr 1fr;
  gap:48px;align-items:center;
}
.comm-img-wrap{
  border-radius:22px;overflow:hidden;
  box-shadow:0 18px 48px rgba(106,27,61,.12),0 4px 12px rgba(106,27,61,.06);
  aspect-ratio:4/5;
}
.comm-img{
  width:100%;height:100%;display:block;
  object-fit:cover;object-position:center 22%;
}
.comm-copy{display:flex;flex-direction:column;justify-content:center}
.comm-eye{
  display:inline-block;align-self:flex-start;
  font-size:11px;font-weight:700;letter-spacing:.17em;
  text-transform:uppercase;color:var(--rose-d);
  background:rgba(192,90,124,.09);
  border:1px solid rgba(192,90,124,.2);
  border-radius:40px;padding:5px 14px;margin-bottom:20px;
}
.comm-title{
  font-family:var(--ff-s);
  font-size:clamp(28px,3.4vw,44px);
  font-weight:400;line-height:1.12;letter-spacing:-.01em;
  color:var(--ink);margin-bottom:20px;
}
.comm-title em{font-style:italic}
.comm-ig{
  background:linear-gradient(135deg,#F58529 0%,#DD2A7B 55%,#8134AF 100%);
  -webkit-background-clip:text;background-clip:text;
  -webkit-text-fill-color:transparent;color:transparent;
  font-style:italic;
}
.comm-desc{
  font-size:15px;font-weight:300;
  color:var(--ink-2);line-height:1.85;
  margin-bottom:28px;max-width:460px;
}
.comm-btn{
  display:inline-flex;align-items:center;gap:10px;
  align-self:flex-start;
  background:linear-gradient(135deg,#F58529 0%,#DD2A7B 60%,#8134AF 100%);
  color:#fff;font-size:14px;font-weight:700;letter-spacing:.08em;
  padding:16px 32px;border-radius:50px;text-decoration:none;
  transition:transform .3s var(--ease),box-shadow .3s var(--ease);
  box-shadow:0 10px 30px rgba(221,42,123,.28);
}
.comm-btn:hover{
  transform:translateY(-2px);
  box-shadow:0 14px 36px rgba(221,42,123,.36);
}
.comm-btn-arr{font-size:16px;transition:transform .3s var(--ease)}
.comm-btn:hover .comm-btn-arr{transform:translateX(4px)}
@media(max-width:900px){
  #community{padding:48px 0}
  .comm-grid{grid-template-columns:1fr;gap:28px}
  .comm-img-wrap{max-width:380px;margin:0 auto}
  .comm-desc{margin-left:auto;margin-right:auto}
  .comm-title{font-size:clamp(24px,6vw,36px)}
}