/* 
   MÉTODO DE TRANSMUTAÇÃO EMOCIONAL PROFUNDA
   Landing Page CSS - Caroline Caron
*/

/* 
   1. VARIÁVEIS CSS (DESIGN TOKENS)
   Altere aqui para mudar cores em toda a página
*/

:root {
  /* === CORES PRINCIPAIS === */
  --roxo-principal: #930F82;
  --roxo-secundario: #9D4EDD;
  --roxo-claro: #C77DFF;
  --roxo-muito-claro: rgba(147, 15, 130, 0.1);

  --dourado-principal: #FFD700;
  --dourado-suave: #F4E4C1;
  --amarelo-dourado: #E8B923;

  --off-white: #FAF8F3;
  --bege-suave: #F5E6D3;
  --bege-medio: #E8DCC4;

  --azul-marinho: #631559;
  --azul-medio: #2E4057;

  --laranja-vital: #FF6B35;
  --coral: #FFA07A;

  --texto-principal: #2D2D2D;
  --texto-secundario: #5A5A5A;
  --branco: #FFFFFF;

  /* === TIPOGRAFIA === */
  --font-headline: 'Cormorant Garamond', serif;
  --font-body: 'Inter', sans-serif;
  --font-cta: 'Montserrat', sans-serif;

  /* === TAMANHOS DE FONTE (Desktop) === */
  --font-size-h1: 56px;
  --font-size-h2: 42px;
  --font-size-h3: 32px;
  --font-size-h4: 24px;
  --font-size-body: 18px;
  --font-size-small: 16px;

  /* === ESPAÇAMENTOS === */
  --spacing-section: 120px;
  --spacing-container: 80px;
  --spacing-element: 40px;

  /* === OUTROS === */
  --container-max-width: 1200px;
  --text-max-width: 800px;
  --border-radius: 12px;
  --border-radius-large: 16px;
  --border-radius-pill: 50px;
  --transition: all 0.3s ease;
}

/* 
   2. RESET E BASE
*/

* {
  margin: 0;
  padding: 0;
  box-sizing: border-box;
}

html {
  scroll-behavior: smooth;
  font-size: 16px;
}

body {
  font-family: var(--font-body);
  font-size: var(--font-size-body);
  line-height: 1.7;
  color: var(--texto-principal);
  background-color: var(--branco);
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

img {
  max-width: 100%;
  height: auto;
  display: block;
}

a {
  text-decoration: none;
  color: inherit;
  transition: var(--transition);
}

ul, ol {
  list-style-position: inside;
  margin-left: 0;
}

strong {
  font-weight: 700;
}

/* 
   3. TIPOGRAFIA GLOBAL
*/

h1, h2, h3, h4, h5, h6 {
  font-family: var(--font-headline);
  font-weight: 700;
  line-height: 1.2;
  margin-bottom: 16px;
  color: var(--roxo-principal);
}

h1 { font-size: var(--font-size-h1); }
h2 { font-size: var(--font-size-h2); }
h3 { font-size: var(--font-size-h3); }
h4 { font-size: var(--font-size-h4); }

p { margin-bottom: 16px; }

/* 
   4. LAYOUT GLOBAL
*/

.container {
  max-width: var(--container-max-width);
  margin: 0 auto;
  padding: 0 var(--spacing-container);
}

section {
  padding: var(--spacing-section) 0;
}

/* 
   5. COMPONENTES REUTILIZÁVEIS - BOTÕES
*/

.btn {
  display: inline-block;
  font-family: var(--font-cta);
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 1.5px;
  text-align: center;
  border: none;
  cursor: pointer;
  transition: var(--transition);
  border-radius: var(--border-radius-pill);
  padding: 18px 48px;
  font-size: 18px;
}

.btn--primary {
  background: linear-gradient(135deg, var(--dourado-principal) 0%, var(--amarelo-dourado) 100%);
  color: var(--azul-marinho);
  box-shadow: 0 8px 24px rgba(255, 215, 0, 0.3);
}

.btn--primary:hover {
  transform: translateY(-4px);
  box-shadow: 0 12px 32px rgba(255, 215, 0, 0.5);
  background: linear-gradient(135deg, var(--amarelo-dourado) 0%, var(--dourado-principal) 100%);
}

.btn--secondary {
  background: transparent;
  color: var(--roxo-principal);
  border: 2px solid var(--roxo-principal);
  padding: 16px 40px;
  font-size: 16px;
  font-weight: 600;
}

.btn--secondary:hover {
  background: var(--roxo-principal);
  color: var(--branco);
  box-shadow: 0 8px 24px rgba(147, 15, 130, 0.3);
}

.btn--outline {
  background: transparent;
  color: var(--texto-secundario);
  border: 1px solid var(--bege-medio);
  padding: 12px 32px;
  font-size: 16px;
  font-weight: 500;
  border-radius: 8px;
}

.btn--outline:hover {
  border-color: var(--dourado-principal);
  color: var(--roxo-principal);
}

.btn--large {
  padding: 20px 56px;
  font-size: 20px;
}

.btn--giant {
  padding: 24px 64px;
  font-size: 22px;
}

/* 
   6. COMPONENTES REUTILIZÁVEIS - BADGES
*/

.badge {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  background: rgba(255, 255, 255, 0.15);
  border: 1px solid rgba(255, 255, 255, 0.5);
  border-radius: 24px;
  padding: 8px 16px;
  margin: 8px;
}

.badge__icon { font-size: 16px; }

.badge__text {
  font-family: var(--font-body);
  font-size: 14px;
  font-weight: 600;
  color: var(--branco);
}

/* 
   7. SECTION HEADLINES
*/

.section__headline {
  font-size: var(--font-size-h2);
  text-align: center;
  margin-bottom: 48px;
  color: var(--roxo-principal);
}

.section__headline--large { font-size: 48px; }
.section__headline--light { color: var(--branco); }

.section__subheadline {
  font-size: 24px;
  text-align: center;
  margin-bottom: 32px;
  font-weight: 600;
}

.section__subheadline--accent { color: var(--amarelo-dourado); }

/* 
   8. HERO SECTION
*/

.hero {
  position: relative;
  background: linear-gradient(135deg, var(--azul-marinho) 0%, var(--roxo-principal) 100%);
  padding: 120px 0;
  overflow: hidden;
  text-align: center;
}

.hero__container {
  max-width: var(--container-max-width);
  margin: 0 auto;
  padding: 0 var(--spacing-container);
  position: relative;
  z-index: 2;
}

.hero__decoration {
  position: absolute;
  border-radius: 50%;
  opacity: 0.1;
  pointer-events: none;
}

.hero__decoration--circle-1 {
  width: 400px;
  height: 400px;
  background: var(--dourado-principal);
  top: -100px;
  left: -100px;
}

.hero__decoration--circle-2 {
  width: 300px;
  height: 300px;
  background: var(--dourado-principal);
  bottom: -50px;
  right: -50px;
}

.hero__decoration--line-1 {
  width: 2px;
  height: 200px;
  background: var(--dourado-principal);
  top: 50%;
  left: 10%;
  border-radius: 0;
}

.hero__headline {
  font-size: var(--font-size-h1);
  color: var(--branco);
  margin-bottom: 24px;
  max-width: var(--text-max-width);
  margin-left: auto;
  margin-right: auto;
}

.hero__subheadline {
  font-size: 20px;
  color: rgba(255, 255, 255, 0.9);
  margin-bottom: 40px;
  max-width: var(--text-max-width);
  margin-left: auto;
  margin-right: auto;
  line-height: 1.6;
}

.hero__subheadline strong { color: var(--dourado-suave); }

.hero__badges {
  margin-top: 40px;
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 16px;
}

/* 
   9. PROBLEM SECTION
*/

.problem { background-color: var(--off-white); }

.problem__intro {
  text-align: center;
  font-size: 20px;
  margin-bottom: 40px;
  color: var(--texto-secundario);
}

.problem__list {
  max-width: 900px;
  margin: 0 auto;
}

.problem__item {
  display: flex;
  gap: 16px;
  margin-bottom: 32px;
  padding: 24px;
  background: var(--branco);
  border-radius: var(--border-radius);
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.05);
  transition: var(--transition);
}

.problem__item:hover {
  transform: translateY(-4px);
  box-shadow: 0 8px 24px rgba(147, 15, 130, 0.1);
}

.problem__icon {
  font-size: 32px;
  flex-shrink: 0;
  color: var(--roxo-principal);
}

.problem__content { flex: 1; }

.problem__title {
  font-size: 22px;
  color: var(--roxo-principal);
  margin-bottom: 12px;
}

.problem__text {
  color: var(--texto-principal);
  line-height: 1.7;
}

.problem__agitation {
  max-width: var(--text-max-width);
  margin: 60px auto 0;
  padding: 32px;
  background: var(--bege-suave);
  border-left: 4px solid var(--dourado-principal);
  border-radius: var(--border-radius);
}

.problem__agitation-title {
  font-size: 24px;
  color: var(--roxo-principal);
  margin-bottom: 16px;
}

.problem__agitation-text { margin-bottom: 16px; }

.problem__transition {
  max-width: var(--text-max-width);
  margin: 40px auto 0;
  text-align: center;
  font-size: 20px;
}

.problem__transition p { margin-bottom: 12px; }

/* 
   10. SOLUTION SECTION
*/

.solution { background-color: var(--branco); }

.solution__intro {
  max-width: var(--text-max-width);
  margin: 0 auto 48px;
  text-align: center;
  font-size: 20px;
  color: var(--texto-secundario);
}

.solution__why {
  max-width: var(--text-max-width);
  margin: 0 auto 60px;
}

.solution__why-title {
  font-size: 28px;
  color: var(--roxo-principal);
  margin-bottom: 24px;
}

.solution__why-text { margin-bottom: 16px; }

.solution__why-highlight {
  background: var(--bege-suave);
  padding: 16px;
  border-left: 4px solid var(--dourado-principal);
  border-radius: 8px;
  margin: 24px 0;
}

.solution__list {
  margin: 16px 0;
  padding-left: 20px;
}

.solution__list li { margin-bottom: 8px; }

.solution__pillars { margin-bottom: 60px; }

.solution__pillars-title {
  font-size: 28px;
  text-align: center;
  color: var(--roxo-principal);
  margin-bottom: 48px;
}

.pillars {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
  gap: 32px;
  max-width: 1200px;
  margin: 0 auto;
}

.pillar {
  background: linear-gradient(135deg, var(--off-white) 0%, var(--bege-suave) 100%);
  border-top: 4px solid var(--dourado-principal);
  border-radius: var(--border-radius-large);
  padding: 32px;
  box-shadow: 0 8px 24px rgba(147, 15, 130, 0.08);
  transition: var(--transition);
}

.pillar:hover {
  transform: translateY(-8px);
  box-shadow: 0 12px 40px rgba(147, 15, 130, 0.15);
}

.pillar__icon {
  font-size: 48px;
  margin-bottom: 16px;
  text-align: center;
}

.pillar__title {
  font-size: 20px;
  color: var(--roxo-principal);
  margin-bottom: 16px;
  text-align: center;
}

.pillar__text { margin-bottom: 16px; }

.pillar__highlight {
  font-weight: 600;
  color: var(--roxo-principal);
  margin-top: 16px;
  margin-bottom: 8px;
}

.pillar__list {
  margin: 12px 0;
  padding-left: 20px;
}

.pillar__list li { margin-bottom: 8px; }

.pillar__conclusion {
  margin-top: 16px;
  padding: 16px;
  background: rgba(147, 15, 130, 0.05);
  border-radius: 8px;
}

.solution__works {
  max-width: var(--text-max-width);
  margin: 0 auto 60px;
}

.solution__works-title {
  font-size: 28px;
  color: var(--roxo-principal);
  margin-bottom: 24px;
}

.solution__works-text { margin-bottom: 16px; }

.solution__works-list {
  margin: 16px 0;
  padding-left: 20px;
}

.solution__works-list li { margin-bottom: 8px; }

.solution__works-highlight {
  background: var(--bege-suave);
  padding: 16px;
  border-left: 4px solid var(--dourado-principal);
  border-radius: 8px;
  margin: 24px 0;
}

.solution__works-benefits {
  margin: 16px 0;
  list-style: none;
  padding-left: 0;
}

.solution__works-benefits li {
  margin-bottom: 12px;
  padding-left: 32px;
  position: relative;
}

.solution__works-conclusion {
  margin-top: 24px;
  font-size: 20px;
  color: var(--roxo-principal);
}

.solution__works-final {
  margin-top: 16px;
  font-size: 20px;
  text-align: center;
  color: var(--roxo-principal);
}

.solution__best {
  max-width: var(--text-max-width);
  margin: 0 auto 40px;
  text-align: center;
}

.solution__best-title {
  font-size: 28px;
  color: var(--roxo-principal);
  margin-bottom: 24px;
}

.solution__best-text {
  margin-bottom: 16px;
  font-size: 20px;
}

.solution__cta {
  text-align: center;
  margin-top: 48px;
}

/* 
   11. VALUE STACK SECTION
*/

.value-stack {
  background: linear-gradient(180deg, var(--off-white) 0%, var(--bege-suave) 100%);
}

.value-stack__items {
  max-width: 900px;
  margin: 0 auto 60px;
}

.value-item {
  display: flex;
  gap: 24px;
  margin-bottom: 24px;
  padding: 32px;
  background: linear-gradient(135deg, var(--off-white) 0%, var(--bege-suave) 100%);
  border-left: 4px solid var(--dourado-principal);
  border-radius: var(--border-radius);
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.05);
}

.value-item__icon {
  font-size: 32px;
  flex-shrink: 0;
}

.value-item__content { flex: 1; }

.value-item__title {
  font-size: 22px;
  color: var(--roxo-principal);
  margin-bottom: 16px;
}

.value-item__text { margin-bottom: 12px; }

.value-item__list {
  margin: 12px 0;
  padding-left: 20px;
}

.value-item__list li { margin-bottom: 8px; }

.value-item__highlight {
  font-weight: 600;
  color: var(--roxo-principal);
  margin-top: 16px;
  margin-bottom: 8px;
}

.value-item__value {
  font-family: var(--font-cta);
  font-size: 18px;
  font-weight: 700;
  color: var(--amarelo-dourado);
  margin-top: 16px;
}

.value-stack__bonus {
  max-width: 900px;
  margin: 0 auto 60px;
}

.value-stack__bonus-title {
  font-size: 28px;
  color: var(--roxo-principal);
  text-align: center;
  margin-bottom: 32px;
}

.bonus-item {
  margin-bottom: 24px;
  padding: 32px;
  background: var(--branco);
  border: 2px solid var(--dourado-suave);
  border-radius: var(--border-radius-large);
  box-shadow: 0 8px 24px rgba(255, 215, 0, 0.1);
}

.bonus-item__badge {
  display: inline-block;
  background: linear-gradient(135deg, var(--dourado-principal) 0%, var(--amarelo-dourado) 100%);
  color: var(--azul-marinho);
  font-family: var(--font-cta);
  font-size: 14px;
  font-weight: 700;
  padding: 8px 16px;
  border-radius: 20px;
  margin-bottom: 16px;
}

.bonus-item__title {
  font-size: 22px;
  color: var(--roxo-principal);
  margin-bottom: 16px;
}

.bonus-item__text { margin-bottom: 12px; }

.bonus-item__highlight {
  font-weight: 600;
  color: var(--roxo-principal);
  margin-top: 16px;
  margin-bottom: 8px;
}

.bonus-item__list {
  margin: 12px 0;
  padding-left: 20px;
}

.bonus-item__list li { margin-bottom: 8px; }

.bonus-item__value {
  font-family: var(--font-cta);
  font-size: 18px;
  font-weight: 700;
  color: var(--amarelo-dourado);
  margin-top: 16px;
}

.value-stack__calculation {
  max-width: 700px;
  margin: 0 auto 60px;
}

.calculation {
  background: var(--azul-marinho);
  padding: 40px;
  border-radius: var(--border-radius-large);
  box-shadow: 0 12px 40px rgba(99, 21, 89, 0.3);
}

.calculation__line {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 16px;
  color: var(--branco);
}

.calculation__label { font-size: 16px; }

.calculation__value {
  font-family: var(--font-cta);
  font-size: 18px;
  font-weight: 700;
}

.calculation__divider {
  height: 2px;
  background: var(--dourado-principal);
  margin: 24px 0;
}

.calculation__line--total {
  font-size: 18px;
  margin-top: 24px;
}

.calculation__line--investment {
  font-size: 22px;
  color: var(--dourado-suave);
}

.calculation__line--investment .calculation__value {
  font-size: 32px;
  color: var(--dourado-principal);
}

.calculation__line--savings {
  font-size: 18px;
  color: var(--dourado-suave);
}

.calculation__line--savings .calculation__value {
  font-size: 24px;
  color: var(--dourado-principal);
}

.value-stack__why {
  max-width: var(--text-max-width);
  margin: 0 auto 40px;
}

.value-stack__why-title {
  font-size: 28px;
  color: var(--roxo-principal);
  margin-bottom: 24px;
  text-align: center;
}

.value-stack__why-text {
  margin-bottom: 16px;
  text-align: center;
}

.value-stack__why-highlight {
  font-size: 20px;
  color: var(--roxo-principal);
  text-align: center;
  margin: 24px 0;
}

.value-stack__why-final {
  margin-top: 24px;
  text-align: center;
  font-size: 20px;
}

.value-stack__cta {
  text-align: center;
  margin-top: 48px;
}

/* 
   12. CREDIBILIDADE SECTION
*/

.credibility { background-color: var(--off-white); }

.credibility__content {
  max-width: 1000px;
  margin: 0 auto 60px;
}

.credibility__profile {
  text-align: center;
  margin-bottom: 48px;
}

.credibility__photo {
  width: 200px;
  height: 200px;
  margin: 0 auto 24px;
  border-radius: 50%;
  border: 4px solid var(--dourado-principal);
  overflow: hidden;
  box-shadow: 0 8px 24px rgba(147, 15, 130, 0.15);
}

.credibility__photo img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.credibility__name {
  font-size: 36px;
  color: var(--roxo-principal);
  margin-bottom: 8px;
}

.credibility__title {
  font-family: var(--font-cta);
  font-size: 18px;
  font-weight: 600;
  color: var(--amarelo-dourado);
  margin-bottom: 4px;
}

.credibility__subtitle {
  font-size: 16px;
  color: var(--texto-secundario);
}

.credibility__text {
  max-width: var(--text-max-width);
  margin: 0 auto;
}

.credibility__intro {
  font-size: 24px;
  text-align: center;
  margin-bottom: 16px;
}

.credibility__paragraph {
  margin-bottom: 16px;
  text-align: center;
}

.credibility__highlight {
  font-size: 20px;
  color: var(--roxo-principal);
  text-align: center;
  margin: 24px 0;
}

.credibility__formation,
.credibility__differential,
.credibility__mission { margin-top: 40px; }

.credibility__section-title {
  font-size: 24px;
  color: var(--roxo-principal);
  margin-bottom: 16px;
  text-align: center;
}

.credibility__specializations {
  background: var(--bege-suave);
  padding: 16px;
  border-left: 4px solid var(--dourado-principal);
  border-radius: 8px;
  text-align: center;
  margin: 16px 0;
}

.credibility__service {
  margin-top: 32px;
  text-align: center;
}

.credibility__service-item {
  font-size: 18px;
  margin-bottom: 8px;
}

.credibility__patterns { margin-top: 80px; }

.credibility__patterns-title {
  font-size: 32px;
  color: var(--roxo-principal);
  text-align: center;
  margin-bottom: 48px;
}

.patterns {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
  gap: 32px;
  max-width: 1200px;
  margin: 0 auto;
}

.pattern {
  background: var(--branco);
  border: 1px solid var(--roxo-muito-claro);
  border-radius: var(--border-radius-large);
  padding: 32px;
  box-shadow: 0 8px 24px rgba(147, 15, 130, 0.08);
  transition: var(--transition);
}

.pattern:hover {
  transform: translateY(-8px);
  box-shadow: 0 12px 40px rgba(147, 15, 130, 0.15);
  border: 1px solid rgba(255, 215, 0, 0.5);
}

.pattern__icon {
  font-size: 48px;
  text-align: center;
  margin-bottom: 16px;
}

.pattern__title {
  font-size: 20px;
  color: var(--roxo-principal);
  margin-bottom: 16px;
  text-align: center;
}

.pattern__text { margin-bottom: 16px; }

.pattern__highlight {
  font-weight: 600;
  color: var(--roxo-principal);
  margin-top: 16px;
  margin-bottom: 8px;
}

.pattern__quote {
  font-style: italic;
  color: var(--texto-secundario);
  margin: 16px 0;
  padding-left: 16px;
  border-left: 3px solid var(--dourado-principal);
}

.pattern__list {
  margin: 12px 0;
  padding-left: 20px;
}

.pattern__list li { margin-bottom: 8px; }

/* 
   13. URGENCY SECTION
*/

.urgency {
  background: linear-gradient(180deg, var(--azul-marinho) 0%, var(--azul-medio) 100%);
  color: var(--branco);
  position: relative;
  overflow: hidden;
}

.urgency__content {
  max-width: var(--text-max-width);
  margin: 0 auto;
}

.urgency__text {
  margin-bottom: 16px;
  color: rgba(255, 255, 255, 0.9);
}

.urgency__highlight {
  font-size: 20px;
  color: var(--dourado-suave);
  margin: 24px 0;
}

.urgency__availability,
.urgency__question,
.urgency__conclusion { margin-top: 40px; }

.urgency__subtitle {
  font-size: 24px;
  color: var(--dourado-principal);
  margin-bottom: 16px;
}

.urgency__question-title {
  font-size: 28px;
  color: var(--dourado-principal);
  margin-bottom: 16px;
  text-align: center;
}

.urgency__question-text {
  font-size: 24px;
  text-align: center;
  color: var(--dourado-suave);
  margin-bottom: 24px;
}

.urgency__cta {
  text-align: center;
  margin-top: 48px;
}

/* 
   14. FAQ SECTION
*/

.faq { background-color: var(--branco); }

.faq__items {
  max-width: 900px;
  margin: 0 auto;
}

.faq__item {
  background: var(--branco);
  border: 1px solid var(--bege-medio);
  border-radius: var(--border-radius);
  margin-bottom: 16px;
  overflow: hidden;
  transition: var(--transition);
}

.faq__question {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 20px 24px;
  cursor: pointer;
  transition: var(--transition);
}

.faq__question:hover {
  background: rgba(147, 15, 130, 0.05);
}

.faq__question-text {
  font-family: var(--font-headline);
  font-size: 20px;
  font-weight: 700;
  color: var(--roxo-principal);
  margin: 0;
  flex: 1;
}

.faq__icon {
  font-size: 24px;
  font-weight: 700;
  color: var(--dourado-principal);
  flex-shrink: 0;
  margin-left: 16px;
  transition: transform 0.3s ease;
}

.faq__answer {
  max-height: 0;
  overflow: hidden;
  transition: max-height 0.4s ease, padding 0.4s ease;
  padding: 0 24px;
}

.faq__answer--open {
  max-height: 2000px;
  padding: 0 24px 20px 24px;
}

.faq__answer p {
  color: var(--texto-principal);
  line-height: 1.7;
  margin-bottom: 12px;
}

.faq__answer ul,
.faq__answer ol {
  margin: 12px 0;
  padding-left: 20px;
}

.faq__answer li { margin-bottom: 8px; }

/* 
   15. FINAL CTA SECTION
*/

.final-cta {
  background: linear-gradient(135deg, var(--roxo-principal) 0%, var(--roxo-secundario) 50%, var(--roxo-claro) 100%);
  color: var(--branco);
  position: relative;
  overflow: hidden;
  text-align: center;
}

.final-cta__content {
  max-width: 900px;
  margin: 0 auto;
}

.final-cta__text {
  font-size: 20px;
  margin-bottom: 16px;
  color: rgba(255, 255, 255, 0.9);
}

.final-cta__choice {
  margin: 40px 0;
  padding: 32px;
  border-radius: var(--border-radius-large);
  text-align: left;
}

.final-cta__choice--negative {
  background: rgba(0, 0, 0, 0.2);
  border: 2px solid rgba(255, 255, 255, 0.1);
}

.final-cta__choice--positive {
  background: rgba(255, 215, 0, 0.15);
  border: 2px solid var(--dourado-principal);
}

.final-cta__choice-title {
  font-size: 24px;
  color: var(--dourado-principal);
  margin-bottom: 16px;
}

.final-cta__choice-text {
  margin-bottom: 16px;
  color: rgba(255, 255, 255, 0.9);
}

.final-cta__choice-list {
  margin: 16px 0;
  list-style: none;
  padding-left: 0;
}

.final-cta__choice-list li {
  margin-bottom: 12px;
  color: rgba(255, 255, 255, 0.9);
}

.final-cta__choice-highlight {
  font-size: 20px;
  color: var(--dourado-suave);
  margin: 24px 0;
}

.final-cta__offer {
  margin: 48px 0;
  padding: 32px;
  background: rgba(255, 255, 255, 0.1);
  border: 2px solid var(--dourado-principal);
  border-radius: var(--border-radius-large);
}

.final-cta__offer-title {
  font-size: 24px;
  color: var(--dourado-principal);
  margin-bottom: 16px;
}

.final-cta__offer-text {
  margin-bottom: 12px;
  color: rgba(255, 255, 255, 0.9);
}

.final-cta__offer-investment {
  font-size: 22px;
  color: var(--dourado-suave);
  margin-top: 16px;
}

.final-cta__cta { margin: 48px 0; }

.final-cta__alternatives {
  margin: 48px 0;
  padding: 32px;
  background: rgba(0, 0, 0, 0.2);
  border-radius: var(--border-radius-large);
}

.final-cta__alternatives-title {
  font-size: 24px;
  color: var(--dourado-principal);
  margin-bottom: 16px;
}

.final-cta__alternatives-text {
  margin-bottom: 16px;
  color: rgba(255, 255, 255, 0.9);
}

.final-cta__alternatives-options { margin: 24px 0; }

.final-cta__alternatives-options p {
  margin-bottom: 12px;
  color: rgba(255, 255, 255, 0.9);
}

.final-cta__message { margin: 48px 0; }

.final-cta__message-title {
  font-size: 32px;
  color: var(--dourado-principal);
  margin-bottom: 24px;
}

.final-cta__message-text {
  font-size: 18px;
  margin-bottom: 16px;
  color: rgba(255, 255, 255, 0.9);
}

.final-cta__message-highlight {
  font-size: 22px;
  color: var(--dourado-suave);
  margin: 24px 0;
}

.final-cta__message-final {
  font-size: 24px;
  color: var(--dourado-principal);
  margin-top: 32px;
}

.final-cta__cta-final { margin-top: 48px; }

/* 
   16. CONTATO E FOOTER
*/

.contact {
  background-color: var(--off-white);
  text-align: center;
}

.contact__text { margin-top: 32px; }

.footer {
  background-color: var(--azul-marinho);
  color: var(--branco);
  text-align: center;
  padding: 32px 0;
}

.footer__text {
  font-size: 14px;
  color: rgba(255, 255, 255, 0.7);
}

/* 
   17. ANIMAÇÕES
*/

@keyframes fadeIn {
  from { opacity: 0; transform: translateY(20px); }
  to { opacity: 1; transform: translateY(0); }
}

@keyframes float {
  0%, 100% { transform: translateY(0); }
  50% { transform: translateY(-10px); }
}

.hero__decoration { animation: float 6s ease-in-out infinite; }
.hero__decoration--circle-1 { animation-delay: 0s; }
.hero__decoration--circle-2 { animation-delay: 2s; }

/* 
   18. RESPONSIVIDADE - TABLET
*/

@media (max-width: 1024px) {
  :root {
    --spacing-section: 80px;
    --spacing-container: 40px;
  }

  .section__headline { font-size: 36px; }
  .hero__headline { font-size: 42px; }

  .pillars {
    grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
    gap: 24px;
  }

  .patterns {
    grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
    gap: 24px;
  }
}

/* 
   19. RESPONSIVIDADE - MOBILE
*/

@media (max-width: 768px) {
  :root {
    --font-size-h1: 36px;
    --font-size-h2: 28px;
    --font-size-h3: 24px;
    --font-size-h4: 20px;
    --font-size-body: 16px;
    --spacing-section: 60px;
    --spacing-container: 24px;
    --spacing-element: 24px;
  }

  .container { padding: 0 24px; }
  .hero { padding: 80px 0; }
  .hero__headline { font-size: 32px; }
  .hero__subheadline { font-size: 16px; }

  .hero__badges {
    flex-direction: column;
    align-items: center;
  }

  .badge {
    width: 100%;
    justify-content: center;
  }

  .btn {
    width: 100%;
    padding: 16px 32px;
    font-size: 16px;
  }

  .btn--large,
  .btn--giant {
    padding: 18px 40px;
    font-size: 18px;
  }

  .section__headline {
    font-size: 28px;
    margin-bottom: 32px;
  }

  .section__headline--large { font-size: 32px; }

  .problem__item {
    flex-direction: column;
    padding: 20px;
  }

  .pillars { grid-template-columns: 1fr; gap: 20px; }
  .pillar { padding: 24px; }
  .pillar__title { font-size: 18px; }

  .value-item {
    flex-direction: column;
    padding: 24px;
  }

  .calculation { padding: 24px; }

  .calculation__line {
    flex-direction: column;
    align-items: flex-start;
    gap: 8px;
  }

  .calculation__label { font-size: 14px; }
  .calculation__value { font-size: 16px; }
  .calculation__line--investment .calculation__value { font-size: 24px; }
  .calculation__line--savings .calculation__value { font-size: 20px; }

  .credibility__photo {
    width: 150px;
    height: 150px;
  }

  .credibility__name { font-size: 28px; }

  .patterns { grid-template-columns: 1fr; gap: 20px; }
  .pattern { padding: 24px; }

  .faq__question-text { font-size: 16px; }
  .faq__icon { font-size: 20px; }

  .final-cta__choice { padding: 24px; }
  .final-cta__choice-title { font-size: 20px; }
  .final-cta__message-title { font-size: 24px; }
}