/* ============================================================
   JULLY SHARON — DESIGN SYSTEM
   Curso de Extensão de Cílios | Landing Page Premium
   Versão: 1.0.0
   ============================================================ */

/* ──────────────────────────────────────────────────────────── */
/*  1. CSS CUSTOM PROPERTIES (DESIGN TOKENS)                   */
/* ──────────────────────────────────────────────────────────── */
:root {
  /* Paleta principal — extraída do Figma */
  --c-rose-deep:     #694059;  /* cor de parágrafo do Figma */
  --c-rose-mid:      #796471;  /* "Color" do Figma */
  --c-rose-light:    #D4A0B5;
  --c-rose-pale:     #FDEEF5;
  --c-rose-bg:       #FBE4EE;

  /* Dourado — CTAs e destaques */
  --c-gold:          #C9A227;
  --c-gold-dark:     #A07A0A;
  --c-gold-light:    #EDD97A;
  --c-gold-bg:       #FDF6DC;

  /* Neutros */
  --c-dark:          #180A10;
  --c-text:          #3D1F2D;
  --c-muted:         #796471;
  --c-gray-dk:       #6A6A6A;
  --c-gray-md:       #868686;
  --c-gray-lt:       #F0EBF0;
  --c-white:         #FFFFFF;
  --c-off-white:     #FFFBFD;

  /* Backgrounds de seção */
  --bg-hero:         linear-gradient(160deg, #FBE4EE 0%, #FFF5F9 60%, #FAF0F5 100%);
  --bg-alt:          #FBF1F5;
  --bg-dark:         #2C0E1C;
  --bg-darker:       #1A0810;

  /* Tipografia */
  --font-script:   'Dancing Script', cursive;
  --font-display:  'Playfair Display', Georgia, serif;
  --font-body:     'Poppins', system-ui, sans-serif;

  /* Escala de tipo (16px base) */
  --fs-xs:    0.75rem;   /*  12px */
  --fs-sm:    0.875rem;  /*  14px */
  --fs-base:  1rem;      /*  16px */
  --fs-lg:    1.125rem;  /*  18px */
  --fs-xl:    1.25rem;   /*  20px */
  --fs-2xl:   1.5rem;    /*  24px */
  --fs-3xl:   1.875rem;  /*  30px */
  --fs-4xl:   2.25rem;   /*  36px */
  --fs-5xl:   3rem;      /*  48px */
  --fs-6xl:   3.75rem;   /*  60px */
  --fs-7xl:   4.5rem;    /*  72px */

  /* Espaçamentos */
  --sp-1:  0.25rem;
  --sp-2:  0.5rem;
  --sp-3:  0.75rem;
  --sp-4:  1rem;
  --sp-5:  1.25rem;
  --sp-6:  1.5rem;
  --sp-8:  2rem;
  --sp-10: 2.5rem;
  --sp-12: 3rem;
  --sp-16: 4rem;
  --sp-20: 5rem;
  --sp-24: 6rem;
  --sp-32: 8rem;

  /* Container */
  --container-max:     1260px;
  --container-pad:     clamp(1.25rem, 5vw, 2.5rem);
  --section-py:        clamp(4rem, 8vw, 6rem);

  /* Sombras */
  --shadow-xs:   0 1px 4px  rgba(105, 64, 89, .07);
  --shadow-sm:   0 2px 10px rgba(105, 64, 89, .10);
  --shadow-md:   0 4px 24px rgba(105, 64, 89, .14);
  --shadow-lg:   0 8px 48px rgba(105, 64, 89, .18);
  --shadow-xl:   0 20px 80px rgba(105, 64, 89, .22);
  --shadow-gold: 0 4px 20px rgba(201, 162, 39, .35);

  /* Bordas */
  --radius-sm:   8px;
  --radius-md:   16px;
  --radius-lg:   24px;
  --radius-xl:   40px;
  --radius-full: 9999px;

  /* Transições */
  --ease:          cubic-bezier(.4, 0, .2, 1);
  --ease-out:      cubic-bezier(0, 0, .2, 1);
  --ease-spring:   cubic-bezier(.34, 1.56, .64, 1);
  --dur-fast:      150ms;
  --dur-base:      300ms;
  --dur-slow:      600ms;
  --transition:    var(--dur-base) var(--ease);
}

/* ──────────────────────────────────────────────────────────── */
/*  2. RESET & BASE                                            */
/* ──────────────────────────────────────────────────────────── */
*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }

html {
  scroll-behavior: smooth;
  font-size: 16px;
  -webkit-text-size-adjust: 100%;
  overflow-x: hidden; /* iOS Safari: scroll container é o html, não o body */
  max-width: 100%;
}

body {
  font-family: var(--font-body);
  font-size: var(--fs-base);
  line-height: 1.7;
  color: var(--c-text);
  background-color: var(--c-off-white);
  -webkit-font-smoothing: antialiased;
  overflow-x: hidden;
  max-width: 100%; /* garante que body nunca ultrapasse a viewport */
}

img, svg { max-width: 100%; height: auto; display: block; }
a { color: inherit; text-decoration: none; }
ul { list-style: none; }
button { cursor: pointer; font: inherit; border: none; background: none; }

/* ──────────────────────────────────────────────────────────── */
/*  3. TYPOGRAPHY UTILITIES                                    */
/* ──────────────────────────────────────────────────────────── */
.text-script  { font-family: var(--font-script); font-weight: 700; font-style: italic; }
.text--gold   { color: var(--c-gold); }
.text--rose   { color: var(--c-rose-deep); }
.text--white  { color: var(--c-white); }
.text--muted  { color: var(--c-muted); }

/* ──────────────────────────────────────────────────────────── */
/*  4. LAYOUT UTILITIES                                        */
/* ──────────────────────────────────────────────────────────── */
.container {
  width: 100%;
  max-width: var(--container-max);
  margin-inline: auto;
  padding-inline: var(--container-pad);
}

/* ──────────────────────────────────────────────────────────── */
/*  5. BOTÕES (COMPONENTS)                                     */
/* ──────────────────────────────────────────────────────────── */
.btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: var(--sp-2);
  padding: 0.85em 2.2em;
  border-radius: var(--radius-full);
  font-family: var(--font-body);
  font-size: var(--fs-sm);
  font-weight: 700;
  letter-spacing: .08em;
  text-transform: uppercase;
  line-height: 1;
  white-space: nowrap;
  transition: transform var(--dur-fast) var(--ease-spring),
              box-shadow var(--dur-base) var(--ease),
              background-color var(--dur-base) var(--ease);
  position: relative;
  overflow: hidden;
  cursor: pointer;
}
.btn:active { transform: scale(.97); }

/* Gold (principal CTA) */
.btn--gold {
  background: linear-gradient(135deg, var(--c-gold-light) 0%, var(--c-gold) 50%, var(--c-gold-dark) 100%);
  color: var(--c-dark);
  box-shadow: var(--shadow-gold);
}
.btn--gold:hover, .btn--gold:focus-visible {
  transform: translateY(-2px) scale(1.02);
  box-shadow: 0 8px 32px rgba(201,162,39,.45);
}

/* Primary (rose) */
.btn--primary {
  background: var(--c-rose-deep);
  color: var(--c-white);
  box-shadow: var(--shadow-md);
}
.btn--primary:hover, .btn--primary:focus-visible {
  transform: translateY(-2px) scale(1.02);
  background: #7a4d6a;
  box-shadow: var(--shadow-lg);
}

/* Outline */
.btn--outline {
  background: transparent;
  color: var(--c-rose-deep);
  border: 2px solid var(--c-rose-deep);
}
.btn--outline:hover { background: var(--c-rose-bg); }

/* Tamanhos */
.btn--sm  { padding: .55em 1.4em; font-size: var(--fs-xs); }
.btn--large { padding: 1em 2.8em; font-size: var(--fs-base); }
.btn--xl  { padding: 1.1em 3.2em; font-size: var(--fs-lg); }
.btn--full { width: 100%; }

/* Efeito shimmer */
.btn--shine::after {
  content: '';
  position: absolute;
  top: 0; left: -60%;
  width: 40%; height: 100%;
  background: linear-gradient(90deg, transparent, rgba(255,255,255,.35), transparent);
  transform: skewX(-20deg);
  transition: left .6s var(--ease);
}
.btn--shine:hover::after { left: 140%; }

/* Seta no botão */
.btn__arrow { width: 1.1em; height: 1.1em; flex-shrink: 0; transition: transform var(--dur-fast) var(--ease); }
.btn:hover .btn__arrow { transform: translateX(4px); }

/* ──────────────────────────────────────────────────────────── */
/*  6. SECTION HEADER (padrão reutilizável)                   */
/* ──────────────────────────────────────────────────────────── */
.section-header { text-align: center; margin-bottom: clamp(2rem, 5vw, 3.5rem); }

.section-eyebrow {
  display: inline-block;
  font-size: var(--fs-xs);
  font-weight: 700;
  letter-spacing: .18em;
  text-transform: uppercase;
  color: var(--c-rose-deep);
  margin-bottom: var(--sp-4);
}

.section-title {
  font-family: var(--font-display);
  font-size: clamp(var(--fs-3xl), 4vw, var(--fs-5xl));
  font-weight: 700;
  line-height: 1.2;
  color: var(--c-dark);
}
.section-title .text-script {
  font-size: 1.15em;
  color: var(--c-rose-deep);
}

.section-subtitle {
  margin-top: var(--sp-4);
  font-size: var(--fs-lg);
  color: var(--c-muted);
  max-width: 52ch;
  margin-inline: auto;
}

/* ──────────────────────────────────────────────────────────── */
/*  7. SCROLL PROGRESS BAR                                     */
/* ──────────────────────────────────────────────────────────── */
.scroll-progress-bar {
  position: fixed;
  top: 0; left: 0;
  width: 0%;
  height: 3px;
  background: linear-gradient(90deg, var(--c-rose-deep), var(--c-gold));
  z-index: 9999;
  transition: width 80ms linear;
}

/* ──────────────────────────────────────────────────────────── */
/*  8. STICKY CTA BAR                                          */
/* ──────────────────────────────────────────────────────────── */
.sticky-cta-bar {
  position: fixed;
  top: 0; left: 0; right: 0;
  background: var(--c-rose-deep);
  color: var(--c-white);
  padding: var(--sp-3) var(--sp-6);
  z-index: 1000;
  transform: translateY(-100%);
  transition: transform .4s var(--ease-out);
  box-shadow: 0 2px 20px rgba(0,0,0,.18);
}
.sticky-cta-bar.is-visible { transform: translateY(0); }

.sticky-cta-bar__inner {
  max-width: var(--container-max);
  margin-inline: auto;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--sp-4);
}
.sticky-cta-bar__text { font-size: var(--fs-sm); }
.sticky-cta-bar__icon { margin-right: var(--sp-2); }

/* ──────────────────────────────────────────────────────────── */
/*  9. HEADER / NAVEGAÇÃO                                      */
/* ──────────────────────────────────────────────────────────── */
.site-header {
  position: fixed;
  top: 0; left: 0; right: 0;
  z-index: 900;
  padding: var(--sp-4) 0;
  background: transparent;
  transition: background var(--dur-base) var(--ease),
              box-shadow var(--dur-base) var(--ease),
              padding var(--dur-base) var(--ease);
}
.site-header.is-scrolled {
  background: rgba(255, 248, 252, .96);
  backdrop-filter: blur(12px);
  -webkit-backdrop-filter: blur(12px);
  box-shadow: 0 2px 20px rgba(105, 64, 89, .1);
  padding: var(--sp-3) 0;
}
.site-header__inner {
  max-width: var(--container-max);
  margin-inline: auto;
  padding-inline: var(--container-pad);
  display: flex;
  align-items: center;
  gap: var(--sp-8);
}

/* Logo */
.site-logo {
  display: flex;
  align-items: center;
  flex-shrink: 0;
  line-height: 1;
}
.site-logo__img {
  display: block;
  height: 52px;
  width: auto;
  max-width: 220px;
  object-fit: contain;
  transition: opacity var(--dur-fast) var(--ease);
}
.site-logo:hover .site-logo__img { opacity: .85; }
/* Fallback text (usado no footer) */
.site-logo__script {
  font-family: var(--font-script);
  font-size: var(--fs-2xl);
  font-weight: 700;
  color: var(--c-rose-deep);
  line-height: 1;
}
.site-logo__tagline {
  font-size: var(--fs-xs);
  letter-spacing: .12em;
  text-transform: uppercase;
  color: var(--c-muted);
  margin-top: 1px;
}

/* Nav links */
.site-nav {
  display: flex;
  gap: var(--sp-8);
  margin-left: auto;
}
.site-nav__link {
  font-size: var(--fs-sm);
  font-weight: 600;
  letter-spacing: .05em;
  text-transform: uppercase;
  color: var(--c-text);
  position: relative;
  padding-bottom: 2px;
  transition: color var(--dur-fast) var(--ease);
}
.site-nav__link::after {
  content: '';
  position: absolute;
  bottom: 0; left: 50%;
  width: 0; height: 2px;
  background: var(--c-gold);
  border-radius: 99px;
  transform: translateX(-50%);
  transition: width var(--dur-base) var(--ease);
}
.site-nav__link:hover { color: var(--c-rose-deep); }
.site-nav__link:hover::after { width: 100%; }

/* Header CTA */
.site-header__cta { flex-shrink: 0; }

/* Mobile menu button */
.mobile-menu-btn {
  display: none;
  flex-direction: column;
  gap: 5px;
  padding: var(--sp-2);
  margin-left: auto;
}
.mobile-menu-btn span {
  display: block;
  width: 24px;
  height: 2px;
  background: var(--c-rose-deep);
  border-radius: 99px;
  transition: transform var(--dur-base) var(--ease), opacity var(--dur-base);
}
.mobile-menu-btn.is-open span:nth-child(1) { transform: translateY(7px) rotate(45deg); }
.mobile-menu-btn.is-open span:nth-child(2) { opacity: 0; }
.mobile-menu-btn.is-open span:nth-child(3) { transform: translateY(-7px) rotate(-45deg); }

/* ──────────────────────────────────────────────────────────── */
/*  10. HERO SECTION                                           */
/* ──────────────────────────────────────────────────────────── */
.hero {
  position: relative;
  min-height: 100svh;
  display: flex;
  align-items: center;
  background: var(--bg-hero);
  overflow: hidden;
  padding-top: 90px;
  /* fix iOS Safari: filter:blur em filhos pode quebrar overflow:hidden */
  -webkit-mask-image: -webkit-radial-gradient(white, black);
  mask-image: radial-gradient(white, black);
}

/* Partículas decorativas */
.hero__particles {
  position: absolute;
  inset: 0;
  pointer-events: none;
  z-index: 0;
}
.particle {
  position: absolute;
  border-radius: 50%;
  opacity: 0;
  animation: particleFly calc(4s + (var(--i) * .4s)) calc(var(--i) * .3s) ease-in-out infinite;
}
.particle:nth-child(odd)  { width: 6px;  height: 6px;  background: var(--c-gold); }
.particle:nth-child(even) { width: 4px;  height: 4px;  background: var(--c-rose-light); }
.particle:nth-child(1)  { left: 8%;  top: 15%; }
.particle:nth-child(2)  { left: 18%; top: 65%; }
.particle:nth-child(3)  { left: 28%; top: 85%; }
.particle:nth-child(4)  { left: 72%; top: 12%; }
.particle:nth-child(5)  { left: 82%; top: 55%; }
.particle:nth-child(6)  { left: 90%; top: 80%; }
.particle:nth-child(7)  { left: 45%; top: 5%;  }
.particle:nth-child(8)  { left: 55%; top: 90%; }
.particle:nth-child(9)  { left: 5%;  top: 45%; }
.particle:nth-child(10) { left: 35%; top: 30%; }
.particle:nth-child(11) { left: 65%; top: 70%; }
.particle:nth-child(12) { left: 95%; top: 30%; }

@keyframes particleFly {
  0%   { opacity: 0; transform: translateY(0) scale(.5); }
  30%  { opacity: .8; }
  70%  { opacity: .6; }
  100% { opacity: 0; transform: translateY(-40px) scale(1.2); }
}

/* Container do hero */
.hero__container {
  position: relative;
  z-index: 1;
  max-width: var(--container-max);
  margin-inline: auto;
  padding-inline: var(--container-pad);
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: clamp(2rem, 5vw, 5rem);
  align-items: center;
  width: 100%;
}

/* Eyebrow */
.hero__eyebrow {
  display: flex;
  align-items: center;
  gap: var(--sp-3);
  font-size: var(--fs-xs);
  font-weight: 700;
  letter-spacing: .18em;
  text-transform: uppercase;
  color: var(--c-rose-deep);
  margin-bottom: var(--sp-4);
}
.eyebrow__line {
  flex: 1;
  height: 1px;
  background: linear-gradient(90deg, transparent, var(--c-rose-light));
  max-width: 48px;
}
.eyebrow__line:last-child { background: linear-gradient(90deg, var(--c-rose-light), transparent); }

/* Brand name / Logo no hero */
.hero__brand-name { margin-bottom: var(--sp-4); }
.hero__logo-img {
  display: block;
  max-width: clamp(240px, 30vw, 380px);
  height: auto;
  object-fit: contain;
  filter: drop-shadow(0 2px 8px rgba(105,64,89,.15));
}

/* Headline */
.hero__headline {
  font-family: var(--font-display);
  font-size: clamp(var(--fs-4xl), 4.5vw, var(--fs-6xl));
  font-weight: 700;
  line-height: 1.15;
  color: var(--c-dark);
  margin-bottom: var(--sp-6);
}
.hero__headline em {
  font-style: italic;
  color: var(--c-rose-deep);
}

/* Subheadline */
.hero__subheadline {
  font-size: var(--fs-lg);
  color: var(--c-muted);
  max-width: 44ch;
  margin-bottom: var(--sp-8);
}

/* Checklist */
.hero__checklist {
  display: flex;
  flex-direction: column;
  gap: var(--sp-3);
  margin-bottom: var(--sp-8);
}
.hero__checklist li {
  display: flex;
  align-items: center;
  gap: var(--sp-3);
  font-size: var(--fs-base);
  color: var(--c-text);
}
.check {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 22px;
  height: 22px;
  border-radius: 50%;
  background: var(--c-gold);
  color: var(--c-dark);
  font-size: .7rem;
  font-weight: 900;
  flex-shrink: 0;
}

/* CTA block */
.hero__cta-block { display: flex; flex-direction: column; gap: var(--sp-4); }

.hero__mini-trust {
  display: flex;
  align-items: center;
  gap: var(--sp-2);
  font-size: var(--fs-sm);
  color: var(--c-muted);
}
.trust-shield { width: 1em; height: 1em; color: var(--c-gold); flex-shrink: 0; }

/* Visual / Foto */
.hero__visual { display: flex; justify-content: center; align-items: center; }

.hero__photo-wrapper {
  position: relative;
  max-width: 540px;
  width: 100%;
}

.hero__photo-glow {
  position: absolute;
  top: 10%; left: 10%; right: 10%; bottom: 5%;
  background: radial-gradient(ellipse, rgba(212,160,181,.45) 0%, transparent 70%);
  filter: blur(40px);
  z-index: 0;
  animation: glowPulse 4s ease-in-out infinite alternate;
}
@keyframes glowPulse {
  from { opacity: .6; transform: scale(1); }
  to   { opacity: 1; transform: scale(1.08); }
}

.hero__photo {
  position: relative;
  z-index: 1;
  border-radius: var(--radius-lg) var(--radius-xl) var(--radius-lg) var(--radius-xl);
  overflow: hidden;
  aspect-ratio: 3/4;
  background: linear-gradient(135deg, var(--c-rose-bg), var(--c-rose-pale));
  box-shadow: var(--shadow-xl);
  /* garante contexto para position:absolute do SVG */
  isolation: isolate;
}
.hero__photo-img {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: top center;
}
/* Placeholders: mostrados apenas quando a imagem falha */
.hero__photo-placeholder {
  /* hero: position:absolute — preenche o frame */
  display: none;
  position: absolute;
  inset: 0;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: var(--sp-2);
  font-size: var(--fs-sm);
  color: var(--c-muted);
  text-align: center;
  padding: var(--sp-4);
}
.about__photo-placeholder {
  /* about: fluxo normal — aparece com altura mínima */
  display: none;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: var(--sp-2);
  font-size: var(--fs-sm);
  color: var(--c-muted);
  text-align: center;
  padding: var(--sp-8);
  min-height: 320px;
}
.photo--placeholder .hero__photo-img,
.photo--placeholder .about__photo-img { display: none; }
.photo--placeholder .hero__photo-placeholder,
.photo--placeholder .about__photo-placeholder { display: flex; }

/* Float badges */
.hero__float-badge {
  position: absolute;
  background: var(--c-white);
  border-radius: var(--radius-md);
  padding: var(--sp-3) var(--sp-4);
  box-shadow: var(--shadow-lg);
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 2px;
  animation: floatBadge 3s ease-in-out infinite alternate;
  z-index: 2;
}
.hero__float-badge--left  { left: -10%; bottom: 20%; animation-delay: .5s; }
.hero__float-badge--right { right: -10%; top: 22%; animation-delay: 1.2s; }

@keyframes floatBadge {
  from { transform: translateY(0); }
  to   { transform: translateY(-8px); }
}

.float-badge__number {
  font-family: var(--font-display);
  font-size: var(--fs-2xl);
  font-weight: 700;
  color: var(--c-rose-deep);
  line-height: 1;
}
.float-badge__label {
  font-size: var(--fs-xs);
  color: var(--c-muted);
  text-align: center;
  line-height: 1.3;
}
.float-badge__stars {
  color: var(--c-gold);
  font-size: var(--fs-base);
  letter-spacing: 1px;
  line-height: 1;
}

/* Scroll cue */
.hero__scroll-cue {
  position: absolute;
  bottom: var(--sp-8);
  left: 50%;
  transform: translateX(-50%);
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: var(--sp-2);
  font-size: var(--fs-xs);
  color: var(--c-muted);
  letter-spacing: .1em;
  text-transform: uppercase;
  z-index: 1;
}
.scroll-cue__dot {
  width: 6px; height: 6px;
  border-radius: 50%;
  background: var(--c-rose-deep);
  animation: scrollBob 1.8s ease-in-out infinite;
}
@keyframes scrollBob {
  0%, 100% { transform: translateY(0); opacity: 1; }
  50% { transform: translateY(8px); opacity: .4; }
}

/* ──────────────────────────────────────────────────────────── */
/*  11. STATS BAR                                              */
/* ──────────────────────────────────────────────────────────── */
.stats-bar {
  background: var(--c-rose-deep);
  padding: clamp(1.5rem, 3vw, 2.5rem) 0;
}
.stats-bar__container {
  max-width: var(--container-max);
  margin-inline: auto;
  padding-inline: var(--container-pad);
  display: flex;
  align-items: center;
  justify-content: space-around;
  flex-wrap: wrap;
  gap: var(--sp-6);
}
.stat-item {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: var(--sp-1);
  text-align: center;
}
.stat-item__value {
  font-family: var(--font-display);
  font-size: clamp(var(--fs-3xl), 4vw, var(--fs-5xl));
  font-weight: 700;
  color: var(--c-white);
  line-height: 1;
}
.stat-item__label {
  font-size: var(--fs-sm);
  color: rgba(255,255,255,.75);
  text-transform: uppercase;
  letter-spacing: .08em;
}
.stat-item__divider {
  width: 1px;
  height: 48px;
  background: rgba(255,255,255,.2);
}

/* ──────────────────────────────────────────────────────────── */
/*  12. FOR WHOM (PARA QUEM É)                                 */
/* ──────────────────────────────────────────────────────────── */
.for-whom {
  padding: var(--section-py) 0;
  background: var(--c-off-white);
}
.for-whom__container {
  max-width: var(--container-max);
  margin-inline: auto;
  padding-inline: var(--container-pad);
}
.for-whom__grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
  gap: var(--sp-5);
  margin-top: var(--sp-8);
}
.whom-card {
  background: var(--c-white);
  border: 1px solid rgba(105, 64, 89, .1);
  border-radius: var(--radius-lg);
  padding: var(--sp-8);
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: var(--sp-4);
  box-shadow: var(--shadow-xs);
  transition: transform var(--dur-base) var(--ease-spring),
              box-shadow var(--dur-base) var(--ease);
}
.whom-card:hover {
  transform: translateY(-4px);
  box-shadow: var(--shadow-md);
}
.whom-card__icon {
  font-size: 2rem;
  line-height: 1;
  background: var(--c-rose-bg);
  width: 56px; height: 56px;
  border-radius: var(--radius-md);
  display: flex;
  align-items: center;
  justify-content: center;
}
.whom-card__text {
  font-size: var(--fs-base);
  color: var(--c-text);
  line-height: 1.6;
}
.whom-card__text strong { color: var(--c-rose-deep); }

/* ──────────────────────────────────────────────────────────── */
/*  13. TESTIMONIALS                                           */
/* ──────────────────────────────────────────────────────────── */
.testimonials {
  padding: var(--section-py) 0;
  background: var(--bg-alt);
  position: relative;
  overflow: hidden;
}
.testimonials::before {
  content: '';
  position: absolute;
  top: -80px; right: -80px;
  width: 320px; height: 320px;
  border-radius: 50%;
  background: radial-gradient(var(--c-rose-pale), transparent);
  opacity: .6;
  pointer-events: none;
}
.testimonials__container {
  max-width: var(--container-max);
  margin-inline: auto;
  padding-inline: var(--container-pad);
}
.testimonials__grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(310px, 1fr));
  gap: var(--sp-6);
}
.testimonial-card {
  background: var(--c-white);
  border-radius: var(--radius-lg);
  padding: var(--sp-8);
  box-shadow: var(--shadow-sm);
  border: 1px solid rgba(105, 64, 89, .08);
  display: flex;
  flex-direction: column;
  gap: var(--sp-4);
  transition: transform var(--dur-base) var(--ease-spring),
              box-shadow var(--dur-base) var(--ease);
}
.testimonial-card:hover {
  transform: translateY(-4px);
  box-shadow: var(--shadow-md);
}
.testimonial-card__top {
  display: flex;
  align-items: center;
  gap: var(--sp-3);
}
.testimonial-card__avatar {
  width: 48px; height: 48px;
  border-radius: 50%;
  background: linear-gradient(135deg, var(--c-rose-deep), var(--c-rose-light));
  color: var(--c-white);
  display: flex;
  align-items: center;
  justify-content: center;
  font-family: var(--font-display);
  font-size: var(--fs-xl);
  font-weight: 700;
  flex-shrink: 0;
}
.testimonial-card__name { font-weight: 700; color: var(--c-dark); display: block; }
.testimonial-card__role { font-size: var(--fs-xs); color: var(--c-muted); display: block; }
.testimonial-card__stars { color: var(--c-gold); font-size: var(--fs-base); letter-spacing: 2px; }
.testimonial-card__quote p {
  font-size: var(--fs-sm);
  color: var(--c-text);
  line-height: 1.65;
  font-style: italic;
}
.testimonial-card__video-cue {
  margin-top: auto;
  display: flex;
  align-items: center;
  gap: var(--sp-2);
  font-size: var(--fs-sm);
  color: var(--c-rose-deep);
  cursor: pointer;
}
.play-icon {
  width: 32px; height: 32px;
  border-radius: 50%;
  background: var(--c-rose-bg);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-size: .65rem;
  flex-shrink: 0;
}

/* ──────────────────────────────────────────────────────────── */
/*  14. ABOUT (PROFESSORA)                                     */
/* ──────────────────────────────────────────────────────────── */
.about {
  padding: var(--section-py) 0;
  background: var(--c-off-white);
  overflow: hidden; /* impede badge de vazar lateralmente */
}
.about__container {
  max-width: var(--container-max);
  margin-inline: auto;
  padding-inline: var(--container-pad);
  display: grid;
  grid-template-columns: 1fr 1.1fr;
  gap: clamp(3rem, 6vw, 6rem);
  align-items: center;
}
.about__visual {
  position: relative;
}
.about__photo-frame {
  border-radius: var(--radius-xl) var(--radius-lg) var(--radius-xl) var(--radius-lg);
  overflow: hidden;
  background: linear-gradient(135deg, var(--c-rose-bg), var(--c-rose-pale));
  box-shadow: var(--shadow-xl);
  position: relative;
  isolation: isolate;
  /* Sem aspect-ratio + position:absolute — iOS Safari colapsava para 0px */
  min-height: 280px; /* garante altura mínima mesmo que imagem atrase */
}
.about__photo-img {
  /* Fluxo normal: a imagem determina a altura do frame */
  display: block;
  width: 100%;
  height: auto;
  object-fit: cover;
  object-position: top center;
  /* Reserva espaço antes do carregamento (evita layout shift) */
  aspect-ratio: 630 / 828;
}
.about__exp-badge {
  position: absolute;
  bottom: -20px; right: 0; /* sem valor negativo — evita overflow horizontal */
  background: var(--c-rose-deep);
  color: var(--c-white);
  border-radius: var(--radius-md);
  padding: var(--sp-4) var(--sp-5);
  text-align: center;
  box-shadow: var(--shadow-lg);
}
.exp-badge__number {
  display: block;
  font-family: var(--font-display);
  font-size: var(--fs-3xl);
  font-weight: 700;
  line-height: 1;
}
.exp-badge__label {
  display: block;
  font-size: var(--fs-xs);
  line-height: 1.3;
  color: rgba(255,255,255,.8);
  margin-top: 4px;
}

.about__content {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: var(--sp-6);
}
.about__bio { font-size: var(--fs-base); color: var(--c-text); line-height: 1.7; }
.about__bio strong { color: var(--c-rose-deep); }

.about__credentials {
  display: flex;
  flex-direction: column;
  gap: var(--sp-3);
}
.credential {
  display: flex;
  align-items: center;
  gap: var(--sp-3);
  font-size: var(--fs-sm);
  color: var(--c-text);
}
.credential__icon {
  font-size: 1.25rem;
  width: 36px;
  text-align: center;
  flex-shrink: 0;
}

/* ──────────────────────────────────────────────────────────── */
/*  15. CURRICULUM (PILARES)                                   */
/* ──────────────────────────────────────────────────────────── */
.curriculum {
  padding: var(--section-py) 0;
  background: var(--bg-alt);
}
.curriculum__container {
  max-width: var(--container-max);
  margin-inline: auto;
  padding-inline: var(--container-pad);
}
.curriculum__pillars {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: var(--sp-6);
}
.pillar-card {
  background: var(--c-white);
  border-radius: var(--radius-lg);
  padding: clamp(var(--sp-8), 3vw, var(--sp-12));
  box-shadow: var(--shadow-sm);
  border: 1px solid rgba(105, 64, 89, .08);
  display: flex;
  flex-direction: column;
  gap: var(--sp-4);
  position: relative;
  overflow: hidden;
  transition: transform var(--dur-base) var(--ease-spring),
              box-shadow var(--dur-base) var(--ease);
}
.pillar-card:hover {
  transform: translateY(-6px);
  box-shadow: var(--shadow-lg);
}
.pillar-card--featured {
  background: var(--c-rose-deep);
  color: var(--c-white);
  border-color: transparent;
  transform: scale(1.02);
}
.pillar-card--featured:hover { transform: scale(1.02) translateY(-6px); }
.pillar-card--featured .pillar-card__title,
.pillar-card--featured .pillar-card__desc { color: var(--c-white); }
.pillar-card--featured .pillar-card__list li { color: rgba(255,255,255,.85); }
.pillar-card--featured .pillar-card__list li::before { color: var(--c-gold-light); }

.pillar-card__popular-tag {
  position: absolute;
  top: var(--sp-4); right: var(--sp-4);
  background: var(--c-gold);
  color: var(--c-dark);
  font-size: var(--fs-xs);
  font-weight: 700;
  letter-spacing: .1em;
  padding: .3em .8em;
  border-radius: var(--radius-full);
}

.pillar-card__icon {
  width: 64px; height: 64px;
  border-radius: var(--radius-md);
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
}
.pillar-card__icon svg { width: 32px; height: 32px; }
.pillar-card__icon--practice { background: var(--c-rose-bg); color: var(--c-rose-deep); }
.pillar-card__icon--theory   { background: var(--c-gold-bg); color: var(--c-gold-dark); }
.pillar-card__icon--training { background: rgba(105,64,89,.1); color: var(--c-rose-deep); }
.pillar-card--featured .pillar-card__icon { background: rgba(255,255,255,.15); color: var(--c-gold-light); }

.pillar-card__title {
  font-family: var(--font-display);
  font-size: var(--fs-2xl);
  font-weight: 700;
  color: var(--c-dark);
  line-height: 1.2;
}
.pillar-card__desc {
  font-size: var(--fs-sm);
  color: var(--c-muted);
  line-height: 1.6;
}
.pillar-card__list {
  display: flex;
  flex-direction: column;
  gap: var(--sp-2);
  margin-top: auto;
}
.pillar-card__list li {
  display: flex;
  align-items: center;
  gap: var(--sp-2);
  font-size: var(--fs-sm);
  color: var(--c-text);
}
.pillar-card__list li::before {
  content: '✓';
  color: var(--c-gold);
  font-weight: 700;
  font-size: .8em;
}

.curriculum__cta-wrap {
  display: flex;
  justify-content: center;
  margin-top: var(--sp-12);
}

/* ──────────────────────────────────────────────────────────── */
/*  16. RESULTS (PHONE MOCKUPS)                               */
/* ──────────────────────────────────────────────────────────── */
.results {
  padding: var(--section-py) 0;
  background: var(--c-off-white);
}
.results__container {
  max-width: var(--container-max);
  margin-inline: auto;
  padding-inline: var(--container-pad);
}
.results__phones {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: var(--sp-8);
  margin-top: var(--sp-10);
  align-items: center;
}

/* iPhone mockup */
.phone-mockup { display: flex; justify-content: center; }
.phone-mockup:nth-child(2) { transform: scale(1.06); z-index: 2; }

.phone-mockup__body {
  width: 280px;
  background: #1A1A1A;
  border-radius: 40px;
  padding: 12px;
  box-shadow: 0 30px 80px rgba(0,0,0,.25), 0 0 0 1px rgba(255,255,255,.06);
  position: relative;
}
.phone-mockup__notch {
  width: 110px; height: 26px;
  background: #1A1A1A;
  border-radius: 0 0 18px 18px;
  margin: 0 auto 6px;
  position: relative;
  z-index: 2;
}
.phone-mockup__notch::after {
  content: '';
  position: absolute;
  top: 6px; left: 50%;
  transform: translateX(-50%);
  width: 10px; height: 10px;
  border-radius: 50%;
  background: #333;
}
.phone-mockup__screen {
  background: #F0F2F5;
  border-radius: 30px;
  overflow: hidden;
  min-height: 500px;
}
.phone-mockup__home-bar {
  width: 120px; height: 4px;
  background: rgba(255,255,255,.3);
  border-radius: 99px;
  margin: 8px auto 4px;
}

/* Chat UI */
.chat-ui { height: 100%; display: flex; flex-direction: column; }
.chat-ui__header {
  display: flex;
  align-items: center;
  gap: var(--sp-2);
  background: var(--c-white);
  padding: var(--sp-3) var(--sp-4);
  box-shadow: 0 1px 4px rgba(0,0,0,.08);
}
.chat-ui__avatar {
  width: 36px; height: 36px;
  border-radius: 50%;
  background: var(--c-rose-deep);
  color: var(--c-white);
  font-size: var(--fs-xs);
  font-weight: 700;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
}
.chat-ui__name { font-size: var(--fs-sm); font-weight: 700; color: var(--c-dark); }
.chat-ui__status { font-size: 10px; color: #25D366; }

.chat-ui__messages {
  flex: 1;
  display: flex;
  flex-direction: column;
  gap: var(--sp-2);
  padding: var(--sp-3);
  overflow-y: auto;
}
.chat-msg { max-width: 85%; }
.chat-msg--received { align-self: flex-start; }
.chat-msg--sent { align-self: flex-end; }

.chat-msg__text {
  display: inline-block;
  padding: var(--sp-2) var(--sp-3);
  border-radius: 12px;
  font-size: var(--fs-xs);
  line-height: 1.4;
}
.chat-msg--received .chat-msg__text { background: var(--c-white); color: var(--c-dark); border-bottom-left-radius: 2px; }
.chat-msg--sent .chat-msg__text { background: #DCF8C6; color: var(--c-dark); border-bottom-right-radius: 2px; }

.chat-msg__image { border-radius: 8px; overflow: hidden; }
.chat-msg__image img { width: 100%; aspect-ratio: 3/4; object-fit: cover; }
.chat-msg__image--placeholder .chat-msg__image-fallback {
  display: flex !important;
  align-items: center;
  justify-content: center;
  background: var(--c-gray-lt);
  border-radius: 8px;
  padding: var(--sp-6);
  font-size: var(--fs-xs);
  color: var(--c-muted);
  aspect-ratio: 3/4;
}
.chat-msg__image-fallback { display: none; }

/* ──────────────────────────────────────────────────────────── */
/*  17. CERTIFICATE                                            */
/* ──────────────────────────────────────────────────────────── */
.certificate {
  padding: var(--section-py) 0;
  background: var(--bg-alt);
}
.certificate__container {
  max-width: var(--container-max);
  margin-inline: auto;
  padding-inline: var(--container-pad);
}
.certificate__content {
  display: grid;
  grid-template-columns: 1.4fr 1fr;
  gap: clamp(2rem, 5vw, 5rem);
  align-items: center;
  margin-top: var(--sp-12);
}
.certificate__preview {
  position: relative;
  border-radius: var(--radius-lg);
  overflow: hidden;
  box-shadow: var(--shadow-xl);
  background: linear-gradient(135deg, #FFF8F0, #FFF2E8);
  aspect-ratio: 4/3;
}
.certificate__img {
  width: 100%; height: 100%;
  object-fit: cover;
}
.cert--placeholder .certificate__img { display: none; }
.cert--placeholder .certificate__placeholder { display: flex !important; }
.certificate__placeholder {
  display: none;
  align-items: center;
  justify-content: center;
  height: 100%;
}
.cert-mock {
  text-align: center;
  padding: var(--sp-8);
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: var(--sp-3);
}
.cert-mock__seal {
  font-size: 2rem;
  color: var(--c-gold);
}
.cert-mock__title {
  font-size: var(--fs-xs);
  letter-spacing: .4em;
  text-transform: uppercase;
  color: var(--c-muted);
}
.cert-mock__name {
  font-family: var(--font-display);
  font-size: var(--fs-4xl);
  font-weight: 700;
  color: var(--c-dark);
  line-height: 1.2;
}
.cert-mock__course {
  font-size: var(--fs-lg);
  color: var(--c-rose-deep);
}
.cert-mock__brand {
  font-family: var(--font-script);
  font-size: var(--fs-2xl);
  color: var(--c-rose-deep);
}

/* Shine overlay on certificate */
.certificate__shine {
  position: absolute;
  inset: 0;
  background: linear-gradient(135deg, rgba(255,255,255,.08) 0%, transparent 50%, rgba(255,255,255,.04) 100%);
  pointer-events: none;
}

.certificate__features {
  display: flex;
  flex-direction: column;
  gap: var(--sp-8);
}
.cert-feature {
  display: flex;
  align-items: flex-start;
  gap: var(--sp-4);
}
.cert-feature__icon { font-size: 1.75rem; flex-shrink: 0; }
.cert-feature h3 {
  font-family: var(--font-display);
  font-size: var(--fs-lg);
  font-weight: 600;
  color: var(--c-dark);
  margin-bottom: var(--sp-1);
}
.cert-feature p { font-size: var(--fs-sm); color: var(--c-muted); line-height: 1.6; }

/* ──────────────────────────────────────────────────────────── */
/*  18. TECHNIQUES                                             */
/* ──────────────────────────────────────────────────────────── */
.techniques {
  padding: var(--section-py) 0;
  background: var(--c-off-white);
}
.techniques__container {
  max-width: var(--container-max);
  margin-inline: auto;
  padding-inline: var(--container-pad);
}
.techniques__grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(180px, 1fr));
  gap: var(--sp-6);
  margin-top: var(--sp-10);
}
.technique-card {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: var(--sp-3);
  cursor: pointer;
  animation-delay: var(--card-delay, 0s);
}
.technique-card__visual {
  position: relative;
  width: 160px;
  height: 160px;
  border-radius: 50%;
  overflow: hidden;
  background: linear-gradient(135deg, var(--c-rose-bg), var(--c-rose-pale));
  box-shadow: var(--shadow-md);
  transition: transform var(--dur-base) var(--ease-spring),
              box-shadow var(--dur-base) var(--ease);
  flex-shrink: 0;
}
.technique-card:hover .technique-card__visual {
  transform: scale(1.06);
  box-shadow: var(--shadow-lg);
}
.technique-card__img {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
  transition: transform var(--dur-slow) var(--ease);
  border-radius: 50%;
}
.technique-card:hover .technique-card__img { transform: scale(1.08); }

.technique-card__overlay {
  position: absolute;
  inset: 0;
  background: rgba(105, 64, 89, .82);
  color: var(--c-white);
  display: flex;
  align-items: center;
  justify-content: center;
  padding: var(--sp-3);
  border-radius: 50%;
  opacity: 0;
  transition: opacity var(--dur-base) var(--ease);
}
.technique-card:hover .technique-card__overlay { opacity: 1; }
.technique-card__overlay p {
  font-size: var(--fs-xs);
  text-align: center;
  line-height: 1.4;
}

.technique-card__name {
  font-family: var(--font-display);
  font-size: var(--fs-base);
  font-weight: 600;
  color: var(--c-dark);
  text-align: center;
}

/* ──────────────────────────────────────────────────────────── */
/*  19. GUARANTEE                                              */
/* ──────────────────────────────────────────────────────────── */
.guarantee {
  padding: var(--section-py) 0;
  background: var(--bg-dark);
  position: relative;
  overflow: hidden;
}
.guarantee::before {
  content: '';
  position: absolute;
  top: -100px; right: -100px;
  width: 400px; height: 400px;
  border-radius: 50%;
  background: radial-gradient(rgba(201,162,39,.12), transparent);
  pointer-events: none;
}
.guarantee__container {
  max-width: var(--container-max);
  margin-inline: auto;
  padding-inline: var(--container-pad);
}
.guarantee__inner {
  display: grid;
  grid-template-columns: auto 1fr;
  gap: clamp(2rem, 5vw, 5rem);
  align-items: center;
}
.guarantee__badge-wrap {
  flex-shrink: 0;
  width: clamp(200px, 25vw, 320px);
}
.guarantee__badge-img { width: 100%; }
.guarantee__badge-fallback { display: none; }
.guarantee__badge-img.img--hidden ~ .guarantee__badge-fallback { display: block; }

/* Seal visual fallback */
.guarantee-seal {
  display: flex;
  align-items: center;
  justify-content: center;
}
.guarantee-seal__outer {
  width: 220px; height: 220px;
  border-radius: 50%;
  background: conic-gradient(var(--c-gold), var(--c-gold-light), var(--c-gold), var(--c-gold-light), var(--c-gold));
  display: flex;
  align-items: center;
  justify-content: center;
  animation: sealSpin 20s linear infinite;
}
@keyframes sealSpin { to { transform: rotate(360deg); } }
.guarantee-seal__inner {
  width: 190px; height: 190px;
  border-radius: 50%;
  background: var(--bg-dark);
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 2px;
}
.guarantee-seal__days {
  font-family: var(--font-display);
  font-size: 4rem;
  font-weight: 700;
  color: var(--c-gold);
  line-height: 1;
}
.guarantee-seal__unit {
  font-size: var(--fs-base);
  font-weight: 700;
  letter-spacing: .2em;
  color: var(--c-white);
}
.guarantee-seal__text {
  font-size: var(--fs-xs);
  color: rgba(255,255,255,.6);
  letter-spacing: .1em;
}

.guarantee__title {
  font-family: var(--font-display);
  font-size: clamp(var(--fs-4xl), 4vw, var(--fs-6xl));
  font-weight: 700;
  color: var(--c-white);
  margin-bottom: var(--sp-6);
}
.guarantee__title .text-script { color: var(--c-gold); font-size: 1.1em; }

.guarantee__body {
  font-size: var(--fs-lg);
  color: rgba(255,255,255,.75);
  line-height: 1.7;
  max-width: 52ch;
  margin-bottom: var(--sp-8);
}
.guarantee__body strong { color: var(--c-gold); }

.guarantee__trust-icons {
  display: flex;
  flex-wrap: wrap;
  gap: var(--sp-6);
}
.trust-icon-item {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: var(--sp-1);
  font-size: var(--fs-xs);
  color: rgba(255,255,255,.65);
  text-align: center;
  line-height: 1.3;
}
.trust-icon-item span:first-child { font-size: 1.5rem; }

/* ──────────────────────────────────────────────────────────── */
/*  20. GOOGLE REVIEWS                                         */
/* ──────────────────────────────────────────────────────────── */
.google-reviews {
  padding: clamp(3rem, 6vw, 5rem) 0;
  background: var(--c-white);
  border-top: 1px solid var(--c-gray-lt);
  border-bottom: 1px solid var(--c-gray-lt);
}
.google-reviews__container {
  max-width: 700px;
  margin-inline: auto;
  padding-inline: var(--container-pad);
  text-align: center;
}
.google-reviews__headline {
  font-family: var(--font-display);
  font-size: clamp(var(--fs-3xl), 3.5vw, var(--fs-5xl));
  font-weight: 700;
  color: var(--c-dark);
  margin-bottom: var(--sp-8);
  line-height: 1.3;
}
.google-reviews__widget {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: var(--sp-8);
  background: var(--bg-alt);
  border-radius: var(--radius-xl);
  padding: var(--sp-8) var(--sp-10);
  box-shadow: var(--shadow-sm);
  border: 1px solid rgba(105,64,89,.1);
  flex-wrap: wrap;
}
.google-widget__logo {
  display: flex;
  align-items: center;
  gap: var(--sp-3);
}
.google-icon { width: 48px; height: 48px; flex-shrink: 0; }
.google-widget__title {
  font-weight: 700;
  font-size: var(--fs-base);
  color: var(--c-dark);
}
.google-widget__score {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: var(--sp-1);
}
.google-widget__number {
  font-family: var(--font-display);
  font-size: var(--fs-5xl);
  font-weight: 700;
  color: var(--c-dark);
  line-height: 1;
}
.google-widget__stars {
  color: var(--c-gold);
  font-size: var(--fs-xl);
  letter-spacing: 2px;
}
.google-widget__cta {
  font-size: var(--fs-xs);
  color: #4285F4;
  text-decoration: underline;
  cursor: pointer;
}

/* ──────────────────────────────────────────────────────────── */
/*  21. PRICING                                                */
/* ──────────────────────────────────────────────────────────── */
.pricing {
  padding: var(--section-py) 0;
  background: var(--bg-alt);
}
.pricing__container {
  max-width: 1000px;
  margin-inline: auto;
  padding-inline: var(--container-pad);
}
.pricing__cards {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: var(--sp-6);
  align-items: start;
  margin-top: var(--sp-10);
}
.pricing-card {
  background: var(--c-white);
  border-radius: var(--radius-xl);
  padding: clamp(var(--sp-8), 4vw, var(--sp-12));
  box-shadow: var(--shadow-md);
  border: 2px solid rgba(105,64,89,.1);
  display: flex;
  flex-direction: column;
  gap: var(--sp-6);
  position: relative;
  overflow: hidden;
  transition: transform var(--dur-base) var(--ease-spring),
              box-shadow var(--dur-base) var(--ease);
}
.pricing-card:hover { transform: translateY(-4px); box-shadow: var(--shadow-lg); }

.pricing-card--featured {
  background: var(--c-rose-deep);
  border-color: var(--c-gold);
  transform: scale(1.02);
}
.pricing-card--featured:hover { transform: scale(1.02) translateY(-4px); }
.pricing-card--featured * { color: var(--c-white) !important; }
.pricing-card--featured .price-value { color: var(--c-gold) !important; }
.pricing-card--featured .price-integer { color: var(--c-gold) !important; }
.pricing-card--featured .feature-check { color: var(--c-gold-light) !important; }

.pricing-card__popular-ribbon {
  position: absolute;
  top: var(--sp-4); right: var(--sp-4);
  background: var(--c-gold);
  color: var(--c-dark);
  font-size: var(--fs-xs);
  font-weight: 700;
  letter-spacing: .08em;
  padding: .3em .9em;
  border-radius: var(--radius-full);
}

.pricing-card__badge {
  font-size: var(--fs-xs);
  font-weight: 700;
  letter-spacing: .2em;
  text-transform: uppercase;
  color: var(--c-muted);
}
.pricing-card__name {
  font-family: var(--font-display);
  font-size: var(--fs-2xl);
  font-weight: 700;
  color: var(--c-dark);
  line-height: 1.2;
}
.pricing-card__tagline { font-size: var(--fs-sm); color: var(--c-muted); }

.pricing-card__price-block {
  display: flex;
  flex-direction: column;
  gap: var(--sp-2);
  padding: var(--sp-6) 0;
  border-top: 1px solid rgba(105,64,89,.1);
  border-bottom: 1px solid rgba(105,64,89,.1);
}
.pricing-card--featured .pricing-card__price-block {
  border-color: rgba(255,255,255,.15) !important;
}
.price-installments {
  font-size: var(--fs-sm);
  color: var(--c-muted);
  text-transform: uppercase;
  letter-spacing: .05em;
}
.price-value {
  display: flex;
  align-items: baseline;
  gap: 2px;
  line-height: 1;
}
.price-currency { font-size: var(--fs-xl); font-weight: 600; color: var(--c-text); }
.price-integer {
  font-family: var(--font-display);
  font-size: var(--fs-6xl);
  font-weight: 700;
  color: var(--c-dark);
  line-height: 1;
}
.price-decimal { font-size: var(--fs-2xl); font-weight: 600; color: var(--c-text); }
.price-cash { font-size: var(--fs-sm); color: var(--c-muted); }

.pricing-card__features {
  display: flex;
  flex-direction: column;
  gap: var(--sp-3);
  flex: 1;
}
.pricing-card__features li {
  display: flex;
  align-items: center;
  gap: var(--sp-3);
  font-size: var(--fs-sm);
  color: var(--c-text);
}
.feature-check {
  color: var(--c-gold);
  font-weight: 700;
  flex-shrink: 0;
}

.pricing-card__guarantee-note {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: var(--sp-2);
  font-size: var(--fs-xs);
  color: rgba(255,255,255,.65) !important;
  text-align: center;
  margin-top: var(--sp-2);
}
.shield-icon { width: .9em; height: .9em; color: var(--c-gold) !important; }

/* Payment methods */
.payment-methods {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: center;
  gap: var(--sp-5);
  margin-top: var(--sp-10);
  padding-top: var(--sp-8);
  border-top: 1px solid rgba(105,64,89,.1);
}
.payment-method-item {
  font-size: var(--fs-sm);
  color: var(--c-muted);
  display: flex;
  align-items: center;
  gap: var(--sp-2);
}

/* ──────────────────────────────────────────────────────────── */
/*  22. FAQ                                                    */
/* ──────────────────────────────────────────────────────────── */
.faq {
  padding: var(--section-py) 0;
  background: var(--c-off-white);
  position: relative;
  overflow: hidden;
}
.faq::before {
  content: '';
  position: absolute;
  bottom: -150px; left: -150px;
  width: 500px; height: 500px;
  border-radius: 50%;
  background: radial-gradient(var(--c-rose-pale), transparent);
  opacity: .5;
  pointer-events: none;
}
.faq__container {
  max-width: 800px;
  margin-inline: auto;
  padding-inline: var(--container-pad);
  position: relative;
  z-index: 1;
}
.faq__list {
  display: flex;
  flex-direction: column;
  gap: var(--sp-3);
  margin-top: var(--sp-10);
}
.faq-item {
  background: var(--c-white);
  border-radius: var(--radius-md);
  border: 1px solid rgba(105,64,89,.1);
  overflow: hidden;
  box-shadow: var(--shadow-xs);
  transition: box-shadow var(--dur-base) var(--ease);
}
.faq-item.is-open { box-shadow: var(--shadow-md); }
.faq-item__trigger {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--sp-4);
  width: 100%;
  padding: var(--sp-5) var(--sp-6);
  text-align: left;
  color: var(--c-dark);
}
.faq-item__trigger:hover { color: var(--c-rose-deep); }
.faq-item.is-open .faq-item__trigger { color: var(--c-rose-deep); }
.faq-item__question {
  font-size: var(--fs-base);
  font-weight: 600;
  line-height: 1.4;
  flex: 1;
}
.faq-item__icon {
  width: 32px; height: 32px;
  border-radius: 50%;
  background: var(--c-rose-bg);
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  transition: background var(--dur-fast) var(--ease);
}
.faq-item__icon svg {
  width: 16px; height: 16px;
  color: var(--c-rose-deep);
  transition: transform var(--dur-base) var(--ease-spring);
}
.faq-item.is-open .faq-item__icon { background: var(--c-rose-deep); }
.faq-item.is-open .faq-item__icon svg { transform: rotate(180deg); color: var(--c-white); }

.faq-item__answer {
  padding: 0 var(--sp-6) var(--sp-5);
  overflow: hidden;
}
.faq-item__answer[hidden] { display: none; }
.faq-item__answer p {
  font-size: var(--fs-base);
  color: var(--c-muted);
  line-height: 1.7;
}

/* ──────────────────────────────────────────────────────────── */
/*  23. FINAL CTA                                              */
/* ──────────────────────────────────────────────────────────── */
.final-cta {
  position: relative;
  padding: clamp(5rem, 10vw, 8rem) 0;
  background: var(--bg-darker);
  overflow: hidden;
  text-align: center;
}
.final-cta__glow {
  position: absolute;
  top: 50%; left: 50%;
  transform: translate(-50%, -50%);
  width: min(600px, 100%); /* responsivo — nunca ultrapassa a viewport */
  height: min(400px, 80vw);
  background: radial-gradient(ellipse, rgba(105,64,89,.4) 0%, transparent 70%);
  pointer-events: none;
}
.final-cta__container {
  position: relative;
  z-index: 1;
  max-width: 700px;
  margin-inline: auto;
  padding-inline: var(--container-pad);
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: var(--sp-6);
}
.final-cta__headline {
  font-family: var(--font-display);
  font-size: clamp(var(--fs-4xl), 5vw, var(--fs-6xl));
  font-weight: 700;
  color: var(--c-white);
  line-height: 1.2;
}
.final-cta__headline .text-script { font-size: 1.15em; }
.final-cta__body {
  font-size: var(--fs-lg);
  color: rgba(255,255,255,.7);
  max-width: 48ch;
  line-height: 1.7;
}
.final-cta__body strong { color: var(--c-gold); }
.final-cta__trust-strip {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: center;
  gap: var(--sp-3);
  font-size: var(--fs-sm);
  color: rgba(255,255,255,.55);
  margin-top: var(--sp-2);
}

/* ──────────────────────────────────────────────────────────── */
/*  24. FOOTER                                                 */
/* ──────────────────────────────────────────────────────────── */
.site-footer {
  background: var(--c-dark);
  padding: clamp(2.5rem, 5vw, 3.5rem) 0;
  text-align: center;
}
.site-footer__inner {
  max-width: var(--container-max);
  margin-inline: auto;
  padding-inline: var(--container-pad);
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: var(--sp-5);
}
.site-footer__brand {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: var(--sp-1);
}
.site-footer__brand p { font-size: var(--fs-xs); color: rgba(255,255,255,.45); }
.site-footer .site-logo__script {
  font-size: var(--fs-3xl);
  color: var(--c-rose-light);
}
.site-footer__links {
  display: flex;
  gap: var(--sp-6);
  flex-wrap: wrap;
  justify-content: center;
}
.site-footer__links a {
  font-size: var(--fs-sm);
  color: rgba(255,255,255,.5);
  transition: color var(--dur-fast) var(--ease);
}
.site-footer__links a:hover { color: var(--c-rose-light); }
.site-footer__copy {
  font-size: var(--fs-xs);
  color: rgba(255,255,255,.35);
}
.site-footer__credit {
  font-size: var(--fs-xs);
  color: rgba(255,255,255,.3);
}
.site-footer__credit a { color: var(--c-rose-light); }

/* ──────────────────────────────────────────────────────────── */
/*  25. WHATSAPP FAB                                           */
/* ──────────────────────────────────────────────────────────── */
.whatsapp-fab {
  position: fixed;
  bottom: var(--sp-6);
  right: var(--sp-6);
  z-index: 800;
  background: #25D366;
  color: var(--c-white);
  border-radius: var(--radius-full);
  padding: var(--sp-3) var(--sp-5);
  display: flex;
  align-items: center;
  gap: var(--sp-2);
  box-shadow: 0 4px 24px rgba(37,211,102,.4);
  font-size: var(--fs-sm);
  font-weight: 700;
  transition: transform var(--dur-fast) var(--ease-spring),
              box-shadow var(--dur-base) var(--ease);
  animation: fabBounce 2.5s ease-in-out 3s 3;
}
.whatsapp-fab:hover {
  transform: scale(1.06) translateY(-2px);
  box-shadow: 0 8px 32px rgba(37,211,102,.5);
}
.whatsapp-fab__icon { width: 24px; height: 24px; flex-shrink: 0; }
@keyframes fabBounce {
  0%, 100% { transform: scale(1); }
  30% { transform: scale(1.12); }
  50% { transform: scale(1.06); }
}

/* ──────────────────────────────────────────────────────────── */
/*  26. SCROLL REVEAL ANIMATIONS                              */
/* ──────────────────────────────────────────────────────────── */
[data-animate] {
  opacity: 0;
  transition: opacity var(--dur-slow) var(--ease-out),
              transform var(--dur-slow) var(--ease-out);
}
[data-animate="fade-up"]    { transform: translateY(32px); }
[data-animate="fade-down"]  { transform: translateY(-32px); }
[data-animate="fade-left"]  { transform: translateX(40px); }
[data-animate="fade-right"] { transform: translateX(-40px); }
[data-animate="fade-in"]    { transform: none; }
[data-animate="stagger"] > * {
  opacity: 0;
  transform: translateY(20px);
  transition: opacity var(--dur-slow) var(--ease-out),
              transform var(--dur-slow) var(--ease-out);
}
[data-animate].is-visible,
[data-animate="stagger"].is-visible > * {
  opacity: 1;
  transform: none;
}
[data-animate="stagger"].is-visible > *:nth-child(1)  { transition-delay: .05s; }
[data-animate="stagger"].is-visible > *:nth-child(2)  { transition-delay: .12s; }
[data-animate="stagger"].is-visible > *:nth-child(3)  { transition-delay: .19s; }
[data-animate="stagger"].is-visible > *:nth-child(4)  { transition-delay: .26s; }
[data-animate="stagger"].is-visible > *:nth-child(5)  { transition-delay: .33s; }
[data-animate="stagger"].is-visible > *:nth-child(6)  { transition-delay: .40s; }
[data-animate="stagger"].is-visible > *:nth-child(7)  { transition-delay: .45s; }
[data-animate="stagger"].is-visible > *:nth-child(8)  { transition-delay: .50s; }
[data-animate="stagger"].is-visible > *:nth-child(9)  { transition-delay: .55s; }

/* ──────────────────────────────────────────────────────────── */
/*  27. RESPONSIVE — Sistema Completo por Breakpoint           */
/*  768–1023px  Tablet                                         */
/*  < 768px     Mobile geral                                   */
/*  < 480px     Mobile pequeno                                 */
/*  < 360px     Mobile extra pequeno                           */
/* ──────────────────────────────────────────────────────────── */

/* ── Tokens mobile ───────────────────────────────────────── */
@media (max-width: 767px) {
  :root {
    --section-py: clamp(2.25rem, 9vw, 3.5rem);
    --container-pad: 1.25rem;
  }
}

/* ═══════════════════════════════════════════════════════════
   TABLET (768px – 1023px)
   Grid 12-col → 2 col pricing | 2 iPhones | 4 técnicas | nav mobile
   ═══════════════════════════════════════════════════════════ */
@media (max-width: 1023px) {
  /* ── Header / Nav ── */
  .site-header__cta { display: none; }
  .mobile-menu-btn  { display: flex; }
  .site-nav {
    display: none;
    flex-direction: column;
    position: fixed;
    inset: 0;
    top: 0;
    padding: 88px var(--sp-8) var(--sp-8);
    background: rgba(255, 248, 252, .97);
    backdrop-filter: blur(20px);
    -webkit-backdrop-filter: blur(20px);
    gap: var(--sp-6);
    z-index: 800;
    overflow-y: auto;
  }
  .site-nav.is-open   { display: flex; }
  .site-nav__link     { font-size: var(--fs-xl); }

  /* ── Hero ── */
  .hero__container {
    grid-template-columns: 1fr;
    gap: 2rem;
    padding-top: var(--sp-8);
  }
  .hero__visual {
    order: -1;
    max-width: 460px;
    margin-inline: auto;
    width: 100%;
  }
  .hero__content {
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
  }
  .hero__eyebrow    { justify-content: center; }
  .hero__checklist  { align-items: flex-start; max-width: 42ch; }
  .hero__cta-block  { align-items: center; width: 100%; }
  .hero__mini-trust { justify-content: center; flex-wrap: wrap; }
  .hero__float-badge--left  { left: -3%; }
  .hero__float-badge--right { right: -3%; }

  /* ── Stats — 2×2 grid ── */
  .stat-item__divider { display: none; }
  .stats-bar__container {
    display: grid;
    grid-template-columns: 1fr 1fr;
    row-gap: var(--sp-8);
    column-gap: var(--sp-8);
    padding-block: var(--sp-8);
  }
  .stat-item { padding: 0; }

  /* ── For-whom — 2 colunas ── */
  .for-whom__grid { grid-template-columns: repeat(2, 1fr); }

  /* ── Testimonials — 2 colunas ── */
  .testimonials__grid { grid-template-columns: repeat(2, 1fr); }

  /* ── About — empilha ── */
  .about__container { grid-template-columns: 1fr; gap: 3rem; }
  .about__visual    { max-width: 400px; margin-inline: auto; order: -1; }
  .about__content   { align-items: center; text-align: center; }
  .about__credentials { align-items: flex-start; max-width: 380px; }

  /* ── Curriculum — empilha com coluna central em destaque ── */
  .curriculum__pillars { grid-template-columns: 1fr; max-width: 520px; margin-inline: auto; }
  .pillar-card--featured { transform: none; order: -1; }

  /* ── Results — 2 iPhones lado a lado ── */
  .results__phones {
    grid-template-columns: repeat(2, auto);
    justify-content: center;
    gap: var(--sp-6);
  }
  .results__phones > .phone-mockup:nth-child(3) { display: none; }
  .phone-mockup:nth-child(2) { transform: none; }

  /* ── Certificate — empilha ── */
  .certificate__content { grid-template-columns: 1fr; }
  .certificate__preview { max-width: 540px; margin-inline: auto; }
  .certificate__features {
    align-items: center;
    text-align: center;
    max-width: 560px;
    margin-inline: auto;
  }
  .cert-feature { flex-direction: column; align-items: center; gap: var(--sp-2); }

  /* ── Techniques — 4 colunas (3 por linha no tablet portrait) ── */
  .techniques__grid {
    grid-template-columns: repeat(4, 1fr);
    gap: var(--sp-5);
  }
  .technique-card__visual {
    width: clamp(100px, 15vw, 140px);
    height: clamp(100px, 15vw, 140px);
    margin-inline: auto;
  }

  /* ── Guarantee — empilha ── */
  .guarantee__inner { grid-template-columns: 1fr; gap: var(--sp-10); text-align: center; }
  .guarantee__badge-wrap { margin-inline: auto; width: clamp(180px, 35vw, 260px); }
  .guarantee__trust-icons { justify-content: center; flex-wrap: wrap; }
  .guarantee__body { margin-inline: auto; max-width: 52ch; }

  /* ── Google Reviews ── */
  .google-reviews__widget { flex-wrap: wrap; justify-content: center; }

  /* ── Pricing — 2 colunas no tablet ── */
  .pricing__cards { grid-template-columns: repeat(2, 1fr); max-width: 100%; gap: var(--sp-5); }
  .pricing-card--featured { transform: none; }

  /* ── Footer ── */
  .site-footer__links { flex-wrap: wrap; justify-content: center; }
}

/* ═══════════════════════════════════════════════════════════
   MOBILE GERAL (< 768px)
   Empilha tudo, ajusta tipografia, 1 iPhone, pricing 1 col
   ═══════════════════════════════════════════════════════════ */
@media (max-width: 767px) {
  /* ── Header ── */
  .site-logo__img { height: 44px; max-width: 180px; }

  /* ── Hero ── */
  .hero { padding-top: 72px; }
  .hero__visual { max-width: 360px; }
  .hero__subheadline { font-size: var(--fs-base); max-width: 100%; }
  .hero__scroll-cue { display: none; }
  .hero__float-badge--left  { left: -4px; bottom: 12%; }
  .hero__float-badge--right { right: -4px; top: 16%; }
  .hero__float-badge { padding: var(--sp-2) var(--sp-3); }
  .float-badge__number { font-size: var(--fs-lg); }
  .float-badge__label  { font-size: 9px; line-height: 1.3; }
  .float-badge__stars  { font-size: var(--fs-sm); letter-spacing: 1px; }

  /* ── Stats — empilha em 2×2 ── */
  .stat-item__divider { display: none; }
  .stats-bar__container {
    display: grid;
    grid-template-columns: 1fr 1fr;
    row-gap: var(--sp-6);
    column-gap: var(--sp-4);
    padding-block: var(--sp-6);
    padding-inline: var(--container-pad);
  }

  /* ── For-whom — 1 coluna ── */
  .for-whom__grid { grid-template-columns: 1fr; }

  /* ── Testimonials — 1 coluna ── */
  .testimonials__grid { grid-template-columns: 1fr; }

  /* ── About ── */
  .about__exp-badge { right: 0; }

  /* ── Curriculum — 1 coluna ── */
  .pillar-card--featured { order: -1; }

  /* ── Results — 1 iPhone ── */
  .results__phones {
    grid-template-columns: 1fr;
    max-width: 300px;
    margin-inline: auto;
  }
  .results__phones > .phone-mockup:not(:first-child) { display: none; }
  .phone-mockup:nth-child(2) { transform: none; }

  /* ── Techniques — 3 colunas ── */
  .techniques__grid {
    grid-template-columns: repeat(3, 1fr);
    gap: var(--sp-4);
  }
  .technique-card__visual {
    width: clamp(72px, 22vw, 112px);
    height: clamp(72px, 22vw, 112px);
    margin-inline: auto;
  }
  .technique-card__name { font-size: 11px; text-align: center; }

  /* ── Guarantee ── */
  .guarantee__inner { grid-template-columns: 1fr; gap: var(--sp-8); text-align: center; }
  .guarantee__badge-wrap { margin-inline: auto; width: clamp(160px, 45vw, 240px); }
  .guarantee__trust-icons { justify-content: center; flex-wrap: wrap; gap: var(--sp-5); }
  .guarantee__body { margin-inline: auto; max-width: 44ch; }

  /* ── Google reviews ── */
  .google-reviews__widget { flex-direction: column; gap: var(--sp-5); }

  /* ── Pricing — 1 coluna ── */
  .pricing__cards { grid-template-columns: 1fr; max-width: 440px; margin-inline: auto; }
  .pricing-card--featured { transform: none; }

  /* ── FAQ ── */
  .faq-item__trigger { padding: var(--sp-4) var(--sp-5); }
  .faq-item__answer  { padding: 0 var(--sp-5) var(--sp-4); }

  /* ── Final CTA ── */
  .final-cta__trust-strip { flex-direction: column; gap: var(--sp-2); font-size: var(--fs-sm); }
  .final-cta__trust-strip > [aria-hidden] { display: none; }

  /* ── Sticky CTA ── */
  .sticky-cta-bar__inner { flex-direction: column; gap: var(--sp-2); text-align: center; }

  /* ── WhatsApp FAB ── */
  .whatsapp-fab__label { display: none; }
  .whatsapp-fab { padding: var(--sp-4); border-radius: 50%; bottom: var(--sp-4); right: var(--sp-4); }

  /* ── Footer ── */
  .site-footer__links { flex-direction: column; gap: var(--sp-3); align-items: center; }
}

/* ═══════════════════════════════════════════════════════════
   MOBILE PEQUENO (< 480px)
   Reduz tipografia, badges, preços, círculos de técnicas
   ═══════════════════════════════════════════════════════════ */
@media (max-width: 479px) {
  /* ── Tipografia ── */
  .hero__headline   { font-size: clamp(var(--fs-2xl), 7.5vw, var(--fs-4xl)); line-height: 1.2; }
  .section-title    { font-size: clamp(var(--fs-2xl), 6.5vw, var(--fs-3xl)); }
  .hero__subheadline { font-size: var(--fs-sm); }

  /* ── Hero ── */
  .hero__photo-wrapper { max-width: 300px; }
  .hero__float-badge--left  { left: -4px; }
  .hero__float-badge--right { right: -4px; }

  /* ── Stats ── */
  .stat-item__value { font-size: clamp(var(--fs-2xl), 8vw, var(--fs-4xl)); }
  .stat-item__label { font-size: 11px; }

  /* ── Curriculum pillar ── */
  .pillar-card { padding: var(--sp-6); }

  /* ── Certificate mock ── */
  .cert-mock__name { font-size: var(--fs-3xl); }

  /* ── Techniques ── */
  .techniques__grid { gap: var(--sp-3); }
  .technique-card__visual {
    width: clamp(64px, 26vw, 96px);
    height: clamp(64px, 26vw, 96px);
  }
  .technique-card__name { font-size: 10px; letter-spacing: 0; }

  /* ── Guarantee seal menor ── */
  .guarantee-seal__outer { width: 180px; height: 180px; }
  .guarantee-seal__inner { width: 154px; height: 154px; }
  .guarantee-seal__days  { font-size: 3rem; }

  /* ── Pricing ── */
  .pricing-card { padding: var(--sp-6); }
  .price-integer { font-size: var(--fs-5xl); }
  .pricing__cards { max-width: 100%; }
  .pricing-card__popular-ribbon { position: relative; top: 0; right: 0; margin-bottom: var(--sp-2); align-self: flex-start; }

  /* ── About badge ── */
  .about__exp-badge { right: 0; bottom: -8px; padding: var(--sp-3) var(--sp-4); }
  .exp-badge__number { font-size: var(--fs-2xl); }
  .exp-badge__label  { font-size: 11px; }

  /* ── Botões ── */
  .btn--xl    { font-size: var(--fs-base); padding: .9em 1.8em; }
  .btn--large { font-size: var(--fs-sm); }

  /* ── Final CTA ── */
  .final-cta__headline { font-size: var(--fs-3xl); }
  .final-cta__body     { font-size: var(--fs-sm); }
}

/* ═══════════════════════════════════════════════════════════
   MOBILE EXTRA PEQUENO (< 360px)
   Ajustes finais para dispositivos legados e telas narrow
   ═══════════════════════════════════════════════════════════ */
@media (max-width: 359px) {
  :root { --container-pad: 1rem; }

  /* ── Logo menor ── */
  .site-logo__img { height: 38px; max-width: 156px; }

  /* ── Ocultar badges flutuantes ── */
  .hero__float-badge { display: none; }

  /* ── Tipografia mínima legível ── */
  .hero__headline { font-size: var(--fs-2xl); }
  .section-title  { font-size: var(--fs-2xl); }
  .hero__subheadline { font-size: var(--fs-sm); }

  /* ── Stats ── */
  .stat-item__value { font-size: var(--fs-2xl); }

  /* ── Phone mockup — encolhe para caber ── */
  .phone-mockup__body { width: min(280px, calc(100vw - 2 * var(--container-pad))); }

  /* ── Techniques — círculos fluidos ── */
  .technique-card__visual {
    width: calc(31vw - 8px);
    height: calc(31vw - 8px);
  }
  .technique-card__name { font-size: 9px; }

  /* ── Botões ── */
  .btn--xl    { font-size: var(--fs-sm); padding: .8em 1.4em; }
  .btn--large { font-size: var(--fs-xs); padding: .75em 1.4em; }
  .btn--shine::after { display: none; }

  /* ── Pricing ── */
  .price-integer { font-size: var(--fs-4xl); }
  .pricing-card { padding: var(--sp-5); }

  /* ── FAQ ── */
  .faq-item__question { font-size: var(--fs-sm); }
}

/* ──────────────────────────────────────────────────────────── */
/*  28. LEGACY — mantido para compatibilidade                  */
/* ──────────────────────────────────────────────────────────── */

/* ──────────────────────────────────────────────────────────── */
/*  29. FOCUS VISIBLE (ACESSIBILIDADE)                         */
/* ──────────────────────────────────────────────────────────── */
:focus-visible {
  outline: 3px solid var(--c-gold);
  outline-offset: 3px;
  border-radius: 4px;
}

/* ══════════════════════════════════════════════════════════════
   31. MOBILE UX/UI POLISH — Auditoria completa 20 pontos
   Lei de Fitts · 8pt Grid · WCAG · Gestalt · Jakob Nielsen
   Breakpoints: 767px · 479px · 359px
   ══════════════════════════════════════════════════════════════ */

/* ── P1: Tokens rebalanced — mais respiro entre seções ──────── */
@media (max-width: 767px) {
  :root {
    --section-py: clamp(3rem, 10vw, 4.5rem);
  }

  /* ─────────────────────────────────────────────────────────
     HEADER
     ───────────────────────────────────────────────────────── */
  .site-logo__img { height: 46px; }

  /* ─────────────────────────────────────────────────────────
     HERO — respiro, tipografia e CTAs full-width (Lei de Fitts)
     ───────────────────────────────────────────────────────── */
  .hero {
    min-height: auto;           /* remove 100svh — conteúdo determina altura */
    padding-top: 80px;
    padding-bottom: clamp(2.5rem, 8vw, 4rem);
  }
  /* P15: Partículas decorativas — performance em mobile */
  .hero__particles { display: none; }

  .hero__eyebrow { font-size: 10px; letter-spacing: .14em; gap: var(--sp-2); }
  .hero__headline { margin-bottom: var(--sp-5); line-height: 1.15; }
  .hero__subheadline { margin-bottom: var(--sp-6); }
  .hero__checklist { gap: var(--sp-3); margin-bottom: var(--sp-8); }
  .hero__checklist li { font-size: var(--fs-sm); }
  .check { width: 20px; height: 20px; font-size: 10px; flex-shrink: 0; }

  /* P8: CTA full-width — alvos maiores melhoram taxa de conversão */
  .hero__cta-block { gap: var(--sp-4); align-items: stretch; }
  .hero__cta-block .btn--xl {
    width: 100%;
    justify-content: center;
    padding: 1rem 1.5rem;          /* garante 48px+ de altura */
    font-size: var(--fs-base);
  }
  .hero__mini-trust { font-size: 11px; justify-content: center; flex-wrap: wrap; gap: var(--sp-1); }

  /* P3: Float badges — ajuste tipografia */
  .float-badge__number { font-size: var(--fs-xl); }
  .float-badge__label  { font-size: 11px; line-height: 1.3; } /* P3: mínimo legível */
  .float-badge__stars  { font-size: var(--fs-sm); }

  /* ─────────────────────────────────────────────────────────
     STATS BAR — hierarquia valor/label
     ───────────────────────────────────────────────────────── */
  .stats-bar__container { padding-block: var(--sp-8); row-gap: var(--sp-6); column-gap: var(--sp-8); }
  .stat-item__value { font-size: clamp(var(--fs-2xl), 7vw, var(--fs-4xl)); }
  .stat-item__label { font-size: 12px; margin-top: var(--sp-1); text-transform: uppercase; letter-spacing: .04em; } /* P3: 12px mínimo */

  /* ─────────────────────────────────────────────────────────
     SECTION HEADERS — consistência em todo o site
     ───────────────────────────────────────────────────────── */
  .section-header { margin-bottom: clamp(1.75rem, 5vw, 2.5rem); }
  .section-eyebrow { font-size: 10px; letter-spacing: .16em; } /* P19: reduzir tracking */
  .section-subtitle { font-size: var(--fs-base); }

  /* ─────────────────────────────────────────────────────────
     FOR WHOM — cards 1 coluna
     ───────────────────────────────────────────────────────── */
  .for-whom__grid { gap: var(--sp-4); }                  /* 16px — 8pt × 2 */
  .whom-card { padding: var(--sp-6); gap: var(--sp-3); } /* 24px interno */
  .whom-card__icon { width: 48px; height: 48px; font-size: 1.5rem; border-radius: var(--radius-sm); }
  .whom-card__text { font-size: var(--fs-sm); line-height: 1.6; }

  /* ─────────────────────────────────────────────────────────
     TESTIMONIALS — limpeza visual
     ───────────────────────────────────────────────────────── */
  .testimonials__grid { gap: var(--sp-4); }
  .testimonial-card { padding: var(--sp-6); gap: var(--sp-3); }
  .testimonial-card__quote p { font-size: var(--fs-sm); line-height: 1.65; }
  /* P11: Remove ruído — hover-only sem função em touch */
  .testimonial-card__video-cue { display: none; }

  /* ─────────────────────────────────────────────────────────
     ABOUT — alinhamento de leitura e respiro
     ───────────────────────────────────────────────────────── */
  .about__container { gap: var(--sp-8); }
  .about__content { gap: var(--sp-5); }
  /* P12: Bio e credentials à esquerda — leitura natural em português */
  .about__bio { font-size: var(--fs-sm); line-height: 1.65; text-align: left; }
  .credential { font-size: var(--fs-sm); }
  .about__credentials { align-items: flex-start !important; text-align: left !important; }
  .exp-badge__label { font-size: 11px; } /* P3: mínimo legível */

  /* ─────────────────────────────────────────────────────────
     CURRICULUM — pilares empilhados
     ───────────────────────────────────────────────────────── */
  .curriculum__pillars { gap: var(--sp-4); }
  .pillar-card { padding: var(--sp-6); gap: var(--sp-3); }
  .pillar-card__title { font-size: var(--fs-xl); }
  .pillar-card__desc { font-size: var(--fs-sm); line-height: 1.6; }
  .pillar-card__list { gap: var(--sp-2); margin-top: var(--sp-2); }
  .pillar-card__list li { font-size: var(--fs-sm); }

  /* ─────────────────────────────────────────────────────────
     CERTIFICATE — alinhamento e limpeza
     ───────────────────────────────────────────────────────── */
  .certificate__content { gap: var(--sp-8); margin-top: var(--sp-8); }
  .certificate__features { gap: var(--sp-6); text-align: left; align-items: flex-start; }
  .cert-feature { flex-direction: row; align-items: flex-start; gap: var(--sp-4); text-align: left; }
  .cert-feature h3 { font-size: var(--fs-base); margin-bottom: var(--sp-1); }
  .cert-feature p { font-size: var(--fs-sm); line-height: 1.6; }
  .cert-feature__icon { font-size: 1.5rem; flex-shrink: 0; }

  /* ─────────────────────────────────────────────────────────
     TECHNIQUES — P11: overlay sempre visível em mobile
     ───────────────────────────────────────────────────────── */
  .techniques__grid { gap: var(--sp-3); }
  .technique-card { gap: var(--sp-2); }
  /* P11: hover inacessível em touch — mostra nome abaixo do círculo apenas */
  .technique-card__overlay { display: none; }
  /* P3: nome da técnica — tamanho mínimo legível */
  .technique-card__name {
    font-size: 11px;
    font-weight: 700;
    line-height: 1.3;
    text-align: center;
    letter-spacing: 0;
  }

  /* ─────────────────────────────────────────────────────────
     GUARANTEE — texto longos à esquerda
     ───────────────────────────────────────────────────────── */
  .guarantee__inner { gap: var(--sp-8); }
  .guarantee__title { font-size: var(--fs-4xl); line-height: 1.2; }
  /* P12: texto longo justificado à esquerda */
  .guarantee__body { font-size: var(--fs-sm); line-height: 1.7; text-align: left; max-width: 100%; }
  .guarantee__trust-icons { gap: var(--sp-4); flex-wrap: wrap; }
  .trust-icon-item { font-size: 11px; min-width: 64px; } /* P3: mínimo legível */

  /* ─────────────────────────────────────────────────────────
     GOOGLE REVIEWS
     ───────────────────────────────────────────────────────── */
  .google-reviews__headline { font-size: var(--fs-2xl); line-height: 1.3; margin-bottom: var(--sp-6); }
  .google-reviews__widget { padding: var(--sp-6); border-radius: var(--radius-lg); }
  .google-widget__number { font-size: var(--fs-4xl); }
  .google-widget__title { font-size: var(--fs-sm); }

  /* ─────────────────────────────────────────────────────────
     PRICING — P16: diferenciação visual do card featured
     ───────────────────────────────────────────────────────── */
  .pricing__cards { gap: var(--sp-5); }
  .pricing-card { padding: var(--sp-6); gap: var(--sp-5); }
  .pricing-card__name { font-size: var(--fs-xl); }
  .pricing-card__tagline { font-size: var(--fs-xs); }
  .pricing-card__features { gap: var(--sp-3); }
  .pricing-card__features li { font-size: var(--fs-sm); gap: var(--sp-2); }
  .price-integer { font-size: var(--fs-5xl); } /* impacto visual mantido */
  .price-currency, .price-decimal { font-size: var(--fs-xl); }
  .price-installments { font-size: 11px; text-transform: uppercase; letter-spacing: .05em; }
  .price-cash { font-size: 11px; }
  .payment-methods { gap: var(--sp-3); flex-wrap: wrap; justify-content: center; }
  .payment-method-item { font-size: var(--fs-xs); }

  /* P16: Card "Mais Escolhido" — borda dourada substitui scale em mobile */
  .pricing-card--featured {
    border: 3px solid var(--c-gold) !important;
    box-shadow: 0 0 0 4px rgba(201,162,39,.12), var(--shadow-lg);
  }

  /* ─────────────────────────────────────────────────────────
     FAQ — legibilidade e respiro
     ───────────────────────────────────────────────────────── */
  .faq__list { gap: var(--sp-3); }
  .faq-item__trigger { padding: var(--sp-4) var(--sp-5); gap: var(--sp-3); min-height: 56px; } /* P9: 56px tap target */
  .faq-item__question { font-size: var(--fs-sm); line-height: 1.5; }
  .faq-item__icon { width: 28px; height: 28px; flex-shrink: 0; }
  .faq-item__answer { padding: 0 var(--sp-5) var(--sp-5); }
  .faq-item__answer p { font-size: var(--fs-sm); line-height: 1.7; }

  /* ─────────────────────────────────────────────────────────
     FINAL CTA — full-width button e hierarquia
     ───────────────────────────────────────────────────────── */
  .final-cta__headline { font-size: clamp(var(--fs-3xl), 7vw, var(--fs-4xl)); line-height: 1.2; }
  .final-cta__body { font-size: var(--fs-sm); line-height: 1.65; }
  /* P8: CTA final full-width */
  .final-cta__container .btn--xl {
    width: 100%;
    justify-content: center;
    padding: 1rem 1.5rem;
  }
  .final-cta__trust-strip { font-size: 11px; gap: var(--sp-2); }

  /* ─────────────────────────────────────────────────────────
     FOOTER — hierarquia e espaçamento
     ───────────────────────────────────────────────────────── */
  .site-footer__inner { gap: var(--sp-5); padding-block: var(--sp-8); }
  .site-footer .site-logo__script { font-size: var(--fs-2xl); }
  .site-footer__brand p { font-size: 11px; }
  .site-footer__links { gap: var(--sp-3); }
  .site-footer__links a { font-size: var(--fs-xs); }
  .site-footer__copy, .site-footer__credit { font-size: 10px; line-height: 1.6; }

  /* ─────────────────────────────────────────────────────────
     STICKY CTA BAR — compacto e claro
     ───────────────────────────────────────────────────────── */
  .sticky-cta-bar__text { font-size: 12px; }
  .sticky-cta-bar .btn--sm { font-size: var(--fs-xs); padding: .6em 1.2em; white-space: nowrap; }

  /* ─────────────────────────────────────────────────────────
     BOTÕES — P9: altura mínima 48px para todos em mobile
     ───────────────────────────────────────────────────────── */
  .btn {
    min-height: 48px;     /* WCAG: mínimo de área de toque */
    font-size: var(--fs-sm);
  }
  .btn--sm { min-height: 36px; font-size: var(--fs-xs); }
}

/* ── P2: Small mobile polish (< 480px) ─────────────────────── */
@media (max-width: 479px) {
  /* Hero mais compacto */
  .hero { padding-top: 70px; }
  .hero__headline { font-size: clamp(1.75rem, 7.5vw, var(--fs-3xl)); }

  /* P12: Bio à esquerda — leitura mais fluida */
  .about__content { text-align: left; }
  .about__bio { text-align: left; }

  /* Section titles ligeiramente reduzidos */
  .section-title { font-size: clamp(1.5rem, 6.5vw, var(--fs-3xl)); line-height: 1.2; }

  /* Section eyebrow — P19: letter-spacing reduzido */
  .section-eyebrow { letter-spacing: .12em; font-size: 10px; }

  /* P12: guarantee body à esquerda */
  .guarantee__body { text-align: left; }
  .guarantee__inner { text-align: left; }
  .guarantee__trust-icons { justify-content: flex-start; }

  /* Certificate features sempre à esquerda */
  .certificate__features { text-align: left; align-items: flex-start; }

  /* Técnicas: nome mais compacto */
  .technique-card__name { font-size: 10px; word-break: break-word; }

  /* Pricing compacto */
  .pricing-card { padding: var(--sp-5); }
  .price-integer { font-size: var(--fs-4xl); }

  /* FAQ compacto */
  .faq-item__trigger { padding: var(--sp-3) var(--sp-4); min-height: 52px; }
  .faq-item__answer  { padding: 0 var(--sp-4) var(--sp-4); }

  /* About badge ajuste */
  .about__exp-badge { bottom: 0; padding: var(--sp-3) var(--sp-4); }
  .exp-badge__number { font-size: var(--fs-2xl); }

  /* Botões */
  .btn--xl    { font-size: var(--fs-base); padding: .9em 1.8em; }
  .btn--large { font-size: var(--fs-sm); padding: .85em 1.5em; }

  /* Final CTA */
  .final-cta__headline { font-size: var(--fs-3xl); }
}

/* ── P3: Extra small (< 360px) ──────────────────────────────── */
@media (max-width: 359px) {
  :root { --container-pad: 1rem; }

  /* Logo menor */
  .site-logo__img { height: 38px; }

  /* Float badges ocultos */
  .hero__float-badge { display: none; }

  /* Tipografia mínima legível */
  .hero__headline { font-size: var(--fs-2xl); }
  .section-title  { font-size: var(--fs-2xl); }

  /* Stats */
  .stat-item__value { font-size: var(--fs-2xl); }
  .stat-item__label { font-size: 11px; }

  /* Phone mockup fluido */
  .phone-mockup__body { width: min(280px, calc(100vw - 2 * var(--container-pad))); }

  /* Technique circles — P3: fluidos para 360px */
  .technique-card__visual { width: calc(31vw - 8px); height: calc(31vw - 8px); }
  .technique-card__name   { font-size: 10px; } /* P3: 10px mínimo aceitável */

  /* Botões */
  .btn     { min-height: 44px; } /* reduz um pouco para 360px */
  .btn--xl { font-size: var(--fs-sm); padding: .85em 1.5em; }
  .btn--large { font-size: var(--fs-xs); padding: .8em 1.3em; min-height: 40px; }
  .btn--shine::after { display: none; } /* performance */

  /* Pricing */
  .price-integer { font-size: var(--fs-4xl); }
  .pricing-card  { padding: var(--sp-5); }

  /* FAQ */
  .faq-item__question { font-size: var(--fs-xs); }
  .faq-item__trigger  { min-height: 48px; }

  /* P20: Nav mobile overflow em telas muito pequenas */
  .site-nav {
    padding-top: 70px;
    overflow-y: auto;
    max-height: 100dvh;
  }
}

/* ──────────────────────────────────────────────────────────── */
/*  30. PRINT                                                  */
/* ──────────────────────────────────────────────────────────── */
@media print {
  .site-header, .sticky-cta-bar, .scroll-progress-bar,
  .whatsapp-fab, .hero__particles, [data-animate] { display: none !important; }
  body { background: white; color: black; }
}
