/* Conversas sobre Arte, página de vendas
   Cores: as mesmas do guia da Biblioteca de Referências e da marca
   (Contexto/01-quem-sou-eu.md). Fonte: Degular pelo kit Adobe, Avenir Next de reserva. */

:root {
  --ink: #231F20;
  --paper: #F1EEEB;
  --mist: #E3E4E0;
  --sand: #D6CFC8;
  --white: #FFFFFF;
  --night: #1A1718;
  --band: #262122;

  --muted: rgba(35, 31, 32, .74);
  --rule: rgba(35, 31, 32, .15);
  --fg-dark: #F1EEEB;
  --muted-dark: rgba(241, 238, 235, .80);
  --rule-dark: rgba(241, 238, 235, .18);

  --sans: "degular-text", "degular", "Degular", "Avenir Next", "Avenir", "Segoe UI", system-ui, -apple-system, sans-serif;
  --display: "degular-display", "degular", "Degular", "Avenir Next", "Avenir", system-ui, -apple-system, sans-serif;

  --s2: .5rem; --s3: .75rem; --s4: 1rem; --s5: 1.5rem;
  --s6: 2rem; --s7: 3rem; --s8: 4rem; --s9: 6rem; --s10: 8rem;

  --radius: 14px;
  --radius-sm: 8px;
  --wrap: 1180px;
  --measure: 40rem;
  --gutter: 1.25rem;
  --ease: cubic-bezier(.2, .7, .2, 1);
}

@media (min-width: 768px) { :root { --gutter: 2rem; } }

*, *::before, *::after { box-sizing: border-box; }

html {
  -webkit-text-size-adjust: 100%;
  scroll-behavior: smooth;
  scroll-padding-top: 5.5rem;
}

body {
  margin: 0;
  background: var(--paper);
  color: var(--ink);
  font-family: var(--sans);
  font-size: 1.0625rem;
  line-height: 1.65;
  -webkit-font-smoothing: antialiased;
  overflow-x: hidden;
}
@media (min-width: 1024px) { body { font-size: 1.125rem; } }

img { display: block; max-width: 100%; height: auto; }
picture { display: block; }
figure { margin: 0; }
p { margin: 0 0 1em; }
p:last-child { margin-bottom: 0; }
strong { font-weight: 700; }

h1, h2, h3, h4 {
  font-family: var(--display);
  font-weight: 600;
  line-height: 1.12;
  letter-spacing: -.01em;
  margin: 0 0 var(--s5);
  text-wrap: balance;
  overflow-wrap: break-word;
}
h1 { font-size: clamp(2.25rem, 1.4rem + 4.2vw, 4.25rem); line-height: 1.04; letter-spacing: -.02em; }
h2 { font-size: clamp(1.75rem, 1.25rem + 2.2vw, 2.85rem); }
h3 { font-size: clamp(1.2rem, 1.08rem + .6vw, 1.5rem); line-height: 1.22; margin-bottom: var(--s4); }
h4 { font-size: 1.2rem; line-height: 1.25; margin-bottom: var(--s4); }

a { color: inherit; }

:focus-visible { outline: 3px solid var(--ink); outline-offset: 3px; border-radius: 4px; }
.section-dark :focus-visible,
.bonus :focus-visible,
.site-footer :focus-visible { outline-color: var(--paper); }

.skip-link {
  position: absolute; left: var(--s4); top: -100px; z-index: 100;
  background: var(--ink); color: var(--paper);
  padding: var(--s3) var(--s4); border-radius: var(--radius-sm);
  text-decoration: none; font-weight: 600;
}
.skip-link:focus { top: var(--s4); }

/* Layout */
.wrap { width: 100%; max-width: var(--wrap); margin-inline: auto; padding-inline: var(--gutter); }
.wrap.narrow { max-width: calc(var(--measure) + 2 * var(--gutter)); }
div.narrow:not(.wrap) { max-width: var(--measure); }

.section { padding-block: var(--s9); }
@media (min-width: 1024px) { .section { padding-block: var(--s10); } }
.section-mist { background: var(--mist); }
.section-paper-2 { background: var(--white); }
.section-dark { background: var(--night); color: var(--fg-dark); }
.section-dark .prose p { color: var(--muted-dark); }
.section-dark .prose p strong { color: var(--fg-dark); }
.section-title { max-width: 22ch; margin-bottom: var(--s7); }

.prose p { color: var(--muted); }
.prose p strong, .prose p em { color: var(--ink); }
.prose h2 { margin-bottom: var(--s6); }

/* Botões */
.btn {
  display: inline-flex; align-items: center; justify-content: center;
  min-height: 52px; padding: .95rem 1.6rem; border-radius: 999px;
  background: var(--ink); color: var(--paper); border: 1px solid var(--ink);
  font-family: var(--sans); font-size: .9rem; font-weight: 700;
  letter-spacing: .06em; line-height: 1.25; text-align: center; text-decoration: none;
  cursor: pointer; touch-action: manipulation;
  transition: background-color .2s var(--ease), color .2s var(--ease), transform .2s var(--ease);
}
.btn:hover { background: var(--band); }
.btn:active { transform: scale(.98); }
.btn-light { background: var(--paper); color: var(--ink); border-color: var(--paper); }
.btn-light:hover { background: var(--white); }
.btn-small { min-height: 44px; padding: .6rem 1.1rem; font-size: .78rem; }
.btn-block { display: flex; width: 100%; }
.cta-row { margin-top: var(--s7); }

/* Cabeçalho */
.site-header {
  position: sticky; top: 0; z-index: 40;
  background: rgba(241, 238, 235, .92);
  -webkit-backdrop-filter: saturate(1.2) blur(10px);
  backdrop-filter: saturate(1.2) blur(10px);
  border-bottom: 1px solid transparent;
  transition: border-color .2s var(--ease);
}
.site-header.is-scrolled { border-bottom-color: var(--rule); }
.header-inner { display: flex; align-items: center; justify-content: space-between; gap: var(--s4); min-height: 4.25rem; }
.wordmark {
  display: inline-flex; align-items: center; gap: .5rem;
  text-decoration: none; font-family: var(--display); font-weight: 600;
  font-size: 1.15rem; line-height: .95; letter-spacing: -.01em; padding-block: var(--s2);
}
.wordmark-light { color: var(--paper); }
.header-cta { display: none; }
@media (min-width: 900px) { .header-cta { display: inline-flex; } }

/* Abertura */
.hero { padding-block: var(--s7) var(--s9); }
.hero-grid { display: grid; gap: var(--s8); align-items: center; }
.hero-text h1 { margin-bottom: var(--s6); max-width: 15ch; }
.hero-text .lead { font-size: clamp(1.15rem, 1.05rem + .5vw, 1.35rem); line-height: 1.55; color: var(--ink); max-width: 36rem; }
.hero-text p { color: var(--muted); max-width: 36rem; }
.hero-text p strong { color: var(--ink); }
.hero-text .btn { margin-top: var(--s5); }
.hero-figure { max-width: 34rem; width: 100%; justify-self: center; padding: 0 14px 14px 0; }
@media (min-width: 960px) {
  .hero { padding-block: var(--s9) var(--s10); }
  .hero-grid { grid-template-columns: 1.15fr .85fr; gap: var(--s9); }
  .hero-figure { justify-self: end; }
}

/* Moldura das imagens */
.frame { position: relative; border-radius: var(--radius); overflow: hidden; background: var(--sand); }
.frame img { width: 100%; }
.frame-offset { overflow: visible; background: none; }
.frame-offset::before {
  content: ""; position: absolute; inset: 0;
  transform: translate(14px, 14px);
  border: 1px solid var(--ink); border-radius: var(--radius); pointer-events: none;
}
.frame-offset picture { position: relative; border-radius: var(--radius); overflow: hidden; background: var(--sand); }

/* Primeira seção */
.lead-line { font-family: var(--display); font-size: clamp(1.3rem, 1.15rem + .8vw, 1.7rem); line-height: 1.25; margin-block: var(--s6) var(--s5); }
.prose .lead-line strong { color: var(--ink); font-weight: 600; }
.prose h2 + .lead-line { margin-top: 0; }
.statement {
  margin-top: var(--s7); padding-top: var(--s6); border-top: 1px solid var(--ink);
  font-family: var(--display); font-size: clamp(1.35rem, 1.15rem + 1vw, 1.9rem); line-height: 1.3;
}
.prose .statement strong { font-weight: 600; }

/* Metodologia */
.method-card {
  margin-top: var(--s8); background: var(--paper); border-radius: var(--radius);
  padding: var(--s6) var(--s5); display: grid; gap: var(--s6);
}
.method-mark {
  margin: 0; font-family: var(--display); font-weight: 600;
  font-size: clamp(3rem, 1.6rem + 7vw, 7.5rem); line-height: .9; letter-spacing: -.04em;
  display: flex; flex-wrap: wrap; align-items: baseline; gap: 0 .05em;
}
.method-mark .slash { font-weight: 300; color: var(--muted); }
@media (min-width: 900px) {
  .method-card { grid-template-columns: .9fr 1.1fr; padding: var(--s8); gap: var(--s8); align-items: start; }
  .method-mark { flex-direction: column; gap: 0; position: sticky; top: 7rem; }
  .method-mark .slash { margin-left: .2em; }
}

/* Três caminhos */
.paths { list-style: none; margin: 0; padding: 0; }
.path { display: grid; gap: var(--s5); padding-block: var(--s7); border-top: 1px solid var(--ink); }
.path:last-child { border-bottom: 1px solid var(--ink); }
.path-num { display: block; font-family: var(--display); font-size: .95rem; font-weight: 600; letter-spacing: .14em; color: var(--muted); margin-bottom: var(--s3); }
.path-head h3 { font-size: clamp(1.4rem, 1.2rem + 1vw, 2rem); margin: 0; max-width: 18ch; }
.path-body { max-width: var(--measure); }
@media (min-width: 900px) {
  .path { grid-template-columns: 5fr 7fr; gap: var(--s8); padding-block: var(--s8); }
  .path-head { position: sticky; top: 7rem; align-self: start; }
}

/* Diferenciais */
.feature-grid {
  display: grid; gap: 1px; margin-top: var(--s8);
  background: var(--rule-dark); border: 1px solid var(--rule-dark);
  border-radius: var(--radius); overflow: hidden;
}
.feature { background: var(--night); padding: var(--s6) var(--s5); }
.feature h3 { color: var(--fg-dark); }
.feature p { color: var(--muted-dark); }
.feature p strong { color: var(--fg-dark); }
@media (min-width: 700px) { .feature-grid { grid-template-columns: repeat(2, 1fr); } .feature { padding: var(--s7) var(--s6); } }
@media (min-width: 1100px) { .feature-grid { grid-template-columns: repeat(3, 1fr); } }

/* Para quem é */
.fit-list { list-style: none; margin: 0; padding: 0; display: grid; gap: var(--s4); }
.fit { position: relative; background: var(--paper); border-radius: var(--radius); padding: var(--s6) var(--s5) var(--s6) calc(var(--s5) + 1.75rem); }
.fit::before {
  content: ""; position: absolute; left: var(--s5); top: calc(var(--s6) + .45rem);
  width: .7rem; height: 1.1rem; border-left: 2px solid var(--ink); border-bottom: 2px solid var(--ink);
}
.fit h3 { font-size: clamp(1.15rem, 1.05rem + .5vw, 1.35rem); }
.fit p { color: var(--muted); }
.fit p strong, .fit p em { color: var(--ink); }
@media (min-width: 900px) {
  .fit-list { grid-template-columns: repeat(6, 1fr); gap: var(--s5); }
  .fit { grid-column: span 2; padding: var(--s7) var(--s6) var(--s7) calc(var(--s6) + 1.75rem); }
  .fit::before { left: var(--s6); top: calc(var(--s7) + .45rem); }
  .fit:nth-child(4), .fit:nth-child(5) { grid-column: span 3; }
}

/* História */
.story { display: grid; gap: var(--s7); }
.story-aside h2 { max-width: 16ch; }
.story-figure { margin-top: var(--s6); max-width: 26rem; }
.story-body { max-width: var(--measure); }
.pull-quote {
  margin: var(--s7) 0 0; padding-left: var(--s5); border-left: 2px solid var(--ink);
  font-family: var(--display); font-size: clamp(1.3rem, 1.1rem + .9vw, 1.75rem);
  line-height: 1.3; font-weight: 500; max-width: 24ch;
}
@media (max-width: 899px) { .pull-quote { display: none; } }
@media (min-width: 900px) {
  .story { grid-template-columns: 5fr 7fr; gap: var(--s8); }
  .story-aside { position: sticky; top: 7rem; align-self: start; }
}

/* Plataforma */
.shot { border-radius: var(--radius); overflow: hidden; background: var(--sand); box-shadow: 0 1px 0 var(--rule), 0 18px 40px -24px rgba(35, 31, 32, .45); }
.shot img { width: 100%; }
.shot-wide { margin-top: var(--s7); }
.modules { display: grid; gap: var(--s5); margin-top: var(--s7); }
.module { background: var(--paper); border-radius: var(--radius); padding: var(--s6) var(--s5); }
.module h3 { font-size: clamp(1.3rem, 1.15rem + .7vw, 1.75rem); }
.module p { color: var(--muted); }
.module-sub { font-family: var(--display); font-size: 1.15rem; line-height: 1.35; }
.module .module-sub strong { color: var(--ink); font-weight: 600; }
.module-wide { display: grid; gap: var(--s6); align-items: center; }
.module-grid { display: grid; gap: var(--s5); }
.dash-list { margin: var(--s4) 0 0; padding: 0; list-style: none; color: var(--muted); }
.dash-list li { position: relative; padding-left: 1.4rem; margin-bottom: var(--s3); }
.dash-list li::before { content: ""; position: absolute; left: 0; top: .8em; width: .8rem; height: 1px; background: var(--ink); }
.dash-list strong { color: var(--ink); }
@media (min-width: 900px) {
  .module { padding: var(--s7) var(--s6); }
  .module-wide { grid-template-columns: 5fr 7fr; gap: var(--s7); }
  .module-grid { grid-template-columns: repeat(2, 1fr); }
}

.bonus { margin-top: var(--s8); background: var(--night); color: var(--fg-dark); border-radius: var(--radius); padding: var(--s7) var(--s5); }
.bonus-title { font-size: clamp(1.6rem, 1.3rem + 1.4vw, 2.4rem); }
.bonus-intro { color: var(--muted-dark); max-width: var(--measure); margin-bottom: var(--s7); }
.bonus-grid { display: grid; gap: var(--s6); }
.bonus-item { border-top: 1px solid var(--rule-dark); padding-top: var(--s5); }
.bonus-item p { color: var(--muted-dark); }
@media (min-width: 900px) {
  .bonus { padding: var(--s8); }
  .bonus-grid { grid-template-columns: repeat(2, 1fr); gap: var(--s8); }
}

/* Depoimentos */
.quotes { display: grid; gap: var(--s5); margin-top: var(--s8); }
.quote { display: flex; flex-direction: column; background: var(--white); border: 1px solid var(--rule); border-radius: var(--radius); padding: var(--s6) var(--s5); }
.quote h3 { font-size: 1.15rem; line-height: 1.3; }
.quote blockquote { margin: 0 0 var(--s5); flex: 1; }
.quote blockquote p { font-size: 1.05rem; line-height: 1.6; color: var(--ink); }
.quote figcaption { font-size: .92rem; letter-spacing: .02em; padding-top: var(--s4); border-top: 1px solid var(--rule); }
@media (min-width: 800px) {
  .quotes { grid-template-columns: repeat(2, 1fr); gap: var(--s6); }
  .quote { padding: var(--s7) var(--s6); }
}

/* Oferta */
.offer-grid { display: grid; gap: var(--s8); }
.offer-text h2 { max-width: 20ch; }
.offer-card { background: var(--band); border: 1px solid var(--rule-dark); border-radius: var(--radius); padding: var(--s6) var(--s5); color: var(--fg-dark); }
.offer-card h3 { font-size: clamp(1.35rem, 1.2rem + .8vw, 1.8rem); }
.offer-card p { color: var(--muted-dark); }
.offer-card p strong { color: var(--fg-dark); }
.price-main { margin-top: var(--s6); font-family: var(--display); font-size: clamp(1.7rem, 1.35rem + 1.8vw, 2.6rem); line-height: 1.12; font-variant-numeric: tabular-nums; }
.offer-card .price-main strong { font-weight: 600; }
.price-alt { font-size: 1.2rem; font-variant-numeric: tabular-nums; }
.offer-note, .offer-guarantee { font-size: .98rem; border-top: 1px solid var(--rule-dark); padding-top: var(--s4); margin-top: var(--s5); }
.offer-cta { margin-top: var(--s7); }
.offer-cta h3 { font-size: 1.25rem; }
.offer-whatsapp { margin-top: var(--s5); font-size: .98rem; text-align: center; }
.offer-whatsapp a { color: var(--fg-dark); text-underline-offset: 3px; }
.offer-whatsapp .link-pendente { outline: 1px dashed var(--sand); outline-offset: 2px; cursor: help; }
@media (min-width: 1000px) {
  .offer-grid { grid-template-columns: 1fr 1fr; gap: var(--s9); align-items: start; }
  .offer-card { padding: var(--s8) var(--s7); position: sticky; top: 6.5rem; }
}

/* Perguntas frequentes */
.faq { border-top: 1px solid var(--ink); }
.faq-item { border-bottom: 1px solid var(--rule); }
.faq-item h3 { margin: 0; font-size: inherit; }
.faq-q {
  display: block; width: 100%; padding: var(--s5) 2.75rem var(--s5) 0;
  background: none; border: 0; color: var(--ink);
  font-family: var(--display); font-size: clamp(1.1rem, 1.02rem + .4vw, 1.3rem);
  font-weight: 600; line-height: 1.3; text-align: left; position: relative; cursor: default;
}
.faq-a { padding: 0 0 var(--s5); color: var(--muted); max-width: var(--measure); }
.faq-a strong, .faq-a em { color: var(--ink); }
.js .faq-q { cursor: pointer; min-height: 44px; }
.js .faq-q::after, .js .faq-q::before {
  content: ""; position: absolute; right: .4rem; top: 50%;
  width: 1rem; height: 1.5px; background: var(--ink);
  transition: transform .25s var(--ease);
}
.js .faq-q::before { transform: rotate(90deg); }
.js .faq-q[aria-expanded="true"]::before { transform: rotate(0deg); }
.js .faq-q:hover { text-decoration: underline; text-underline-offset: 4px; text-decoration-thickness: 1px; }
.faq-a[hidden] { display: none; }

/* Rodapé */
.site-footer { background: var(--night); color: var(--paper); padding-block: var(--s7) var(--s9); }
@media (min-width: 900px) { .site-footer { padding-block: var(--s7); } }

/* Barra fixa no celular */
.mobile-bar { display: none; }
.js .mobile-bar {
  display: block; position: fixed; left: 0; right: 0; bottom: 0; z-index: 50;
  padding: var(--s3) var(--gutter) calc(var(--s3) + env(safe-area-inset-bottom));
  background: rgba(241, 238, 235, .96); border-top: 1px solid var(--rule);
  transform: translateY(110%); visibility: hidden;
  transition: transform .3s var(--ease), visibility 0s linear .3s;
}
.js .mobile-bar .btn { font-size: .8rem; letter-spacing: .04em; min-height: 48px; padding-inline: 1rem; }
.js .mobile-bar.is-visible { transform: translateY(0); visibility: visible; transition: transform .3s var(--ease); }
@media (min-width: 900px) { .js .mobile-bar { display: none; } }

/* Entrada suave */
.js .reveal { opacity: 0; transform: translateY(14px); transition: opacity .6s var(--ease), transform .6s var(--ease); }
.js .reveal.is-in { opacity: 1; transform: none; }

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after { transition-duration: .01ms !important; animation-duration: .01ms !important; }
  .js .reveal { opacity: 1; transform: none; }
}

/* Logo oficial */
.wordmark img { height: 2.6rem; width: auto; }
@media (min-width: 900px) { .wordmark img { height: 3rem; } }
.site-footer .wordmark img { height: 3.4rem; }

/* =========================================================
   Segunda versão: revista editorial + percurso por capítulos
   (direção da skill UI/UX Pro: Editorial Grid / Magazine e
   Scroll-Triggered Storytelling)
   ========================================================= */

/* Barra de progresso de leitura */
.progress { position: fixed; top: 0; left: 0; right: 0; height: 3px; z-index: 60; pointer-events: none; }
.progress span { display: block; height: 100%; background: var(--ink); transform-origin: 0 50%; transform: scaleX(0); }

/* Números de capítulo */
.chapter {
  display: flex; align-items: center; gap: .9rem;
  font-family: var(--display); font-weight: 700; font-size: .95rem;
  letter-spacing: .18em; margin-bottom: var(--s5); color: currentColor; opacity: .7;
}
.chapter::after { content: ""; height: 1px; width: 3.5rem; background: currentColor; }

/* Capitular */
.dropcap::first-letter {
  float: left; font-family: var(--display); font-weight: 700;
  font-size: 4.6em; line-height: .78; margin: .06em .12em 0 -.02em; color: var(--ink);
}

/* Abertura */
.hero { position: relative; padding-block: var(--s6) var(--s8); overflow: hidden; }
.hero-text h1 { font-size: clamp(2.6rem, 1.3rem + 5.6vw, 6rem); line-height: .98; letter-spacing: -.035em; max-width: 13ch; }
.hero-wall {
  display: grid; grid-template-columns: repeat(12, 1fr); grid-auto-rows: 2.2rem;
  gap: .9rem; width: 100%; max-width: 40rem; justify-self: center;
}
.wall-item {
  background: var(--white); padding: .55rem;
  box-shadow: 0 1px 0 rgba(35,31,32,.08), 0 22px 40px -26px rgba(35,31,32,.55);
}
.wall-item picture { height: 100%; overflow: hidden; }
.wall-item img { width: 100%; height: 100%; object-fit: cover; }
.wall-main { grid-column: 1 / 9; grid-row: 1 / 9; }
.wall-a { grid-column: 9 / 13; grid-row: 2 / 6; }
.wall-b { grid-column: 9 / 13; grid-row: 6 / 10; }
.wall-c { grid-column: 3 / 9; grid-row: 9 / 13; }
@media (min-width: 960px) {
  .hero { padding-block: var(--s8) var(--s9); }
  .hero-grid { grid-template-columns: 1.05fr .95fr; gap: var(--s8); }
  .hero-wall { justify-self: end; grid-auto-rows: 2.6rem; }
}

/* Galeria horizontal */
.strip { background: var(--ink); padding-block: var(--s5); }
.strip-track {
  list-style: none; margin: 0; padding: 0 var(--gutter);
  display: flex; gap: .75rem; overflow-x: auto; scroll-snap-type: x mandatory;
  scrollbar-width: thin; scrollbar-color: rgba(241,238,235,.35) transparent;
  -webkit-overflow-scrolling: touch;
}
.strip-track:focus-visible { outline: 3px solid var(--paper); outline-offset: -3px; }
.strip-item { flex: 0 0 auto; width: clamp(13rem, 24vw, 21rem); aspect-ratio: 554 / 321; scroll-snap-align: start; border-radius: 6px; overflow: hidden; background: var(--band); }
.strip-item picture, .strip-item img { width: 100%; height: 100%; }
.strip-item img { object-fit: cover; transform: scale(1.03); filter: saturate(.92); transition: filter .3s var(--ease), transform .4s var(--ease); }
.strip-item:hover img { filter: none; transform: scale(1.06); }

/* Grade assimétrica */
.split { display: grid; gap: var(--s6); }
.split-head h2 { font-size: clamp(2rem, 1.3rem + 3vw, 3.6rem); line-height: 1.02; letter-spacing: -.025em; }
.split-body { max-width: var(--measure); }
@media (min-width: 900px) {
  .split { grid-template-columns: 5fr 7fr; gap: var(--s8); }
  .split-head { position: sticky; top: 7rem; align-self: start; }
}

/* Metodologia escura */
.method .chapter { color: var(--fg-dark); }
.method-card { background: var(--band); border: 1px solid var(--rule-dark); color: var(--fg-dark); }
.method-card .prose p { color: var(--muted-dark); }
.method-card .prose p strong, .method-card .prose p em { color: var(--fg-dark); }
.method-visual { position: relative; border-radius: var(--radius); overflow: hidden; align-self: stretch; min-height: 20rem; }
.method-visual picture, .method-visual img { width: 100%; height: 100%; }
.method-visual img { object-fit: cover; position: absolute; inset: 0; }
.method-visual::after { content: ""; position: absolute; inset: 0; background: linear-gradient(180deg, rgba(26,23,24,0) 35%, rgba(26,23,24,.88) 100%); }
.method-visual .method-mark {
  position: absolute; left: var(--s5); right: var(--s5); bottom: var(--s5); z-index: 1;
  color: var(--paper); font-size: clamp(3rem, 1.8rem + 5vw, 6rem);
}
.method-visual .method-mark .slash { color: rgba(241,238,235,.6); }
@media (min-width: 900px) {
  .method-card { align-items: stretch; }
  .method-visual { min-height: 34rem; position: sticky; top: 7rem; }
  .method-visual .method-mark { position: absolute; top: auto; flex-direction: column; }
}

/* Três caminhos */
.path-img { width: 100%; max-width: 22rem; aspect-ratio: 16 / 10; border-radius: 10px; overflow: hidden; margin-bottom: var(--s5); background: var(--sand); }
.path-img picture, .path-img img { width: 100%; height: 100%; }
.path-img img { object-fit: cover; transform: scale(1.03); }
.path-num { font-size: clamp(3rem, 2rem + 4vw, 5.5rem); letter-spacing: -.02em; line-height: 1; font-weight: 700; color: var(--ink); opacity: .14; margin-bottom: var(--s2); }

/* Diferenciais: numeração */
.feature-grid { counter-reset: feat; }
.feature { counter-increment: feat; position: relative; transition: background-color .25s var(--ease); }
.feature::before {
  content: counter(feat, decimal-leading-zero); display: block;
  font-family: var(--display); font-weight: 700; font-size: 2.6rem; line-height: 1;
  color: rgba(241,238,235,.22); margin-bottom: var(--s5);
}
.feature:hover { background: var(--band); }

/* Caminho organizado: obra ao fundo */
.organized { position: relative; overflow: hidden; background: var(--ink); }
.organized-art { position: absolute; inset: 0; }
.organized-art picture, .organized-art img { width: 100%; height: 100%; }
.organized-art img { object-fit: cover; opacity: .9; }
.organized-card {
  position: relative; background: var(--paper);
  border-radius: var(--radius); padding: var(--s7) var(--s5) !important;
  box-shadow: 0 30px 80px -30px rgba(0,0,0,.6);
}
.wrap.organized-card { width: calc(100% - 2 * var(--gutter)); }
@media (min-width: 768px) { .organized-card { padding: var(--s8) var(--s7) !important; } }

/* Para quem é */
.fit { transition: transform .25s var(--ease), box-shadow .25s var(--ease); }
.fit:hover { transform: translateY(-3px); box-shadow: 0 18px 40px -28px rgba(35,31,32,.5); }

/* História */
.story-figure { max-width: 30rem; }
.story-figure .frame { background: var(--white); padding: .6rem; border-radius: 4px; box-shadow: 0 22px 40px -26px rgba(35,31,32,.55); }
.story-figure .frame picture { border-radius: 2px; overflow: hidden; }
.pull-quote { font-size: clamp(1.5rem, 1.2rem + 1.2vw, 2.2rem); line-height: 1.18; font-weight: 700; letter-spacing: -.01em; border-left-width: 3px; }

/* Capturas em moldura de aparelho */
.device { background: var(--night); padding: .6rem; border-radius: 18px; box-shadow: 0 30px 60px -30px rgba(35,31,32,.6); }
.device picture { border-radius: 10px; overflow: hidden; }

/* Depoimentos em tabuleiro */
.quote:nth-child(2), .quote:nth-child(3) { background: var(--night); border-color: var(--night); color: var(--fg-dark); }
.quote:nth-child(2) blockquote p, .quote:nth-child(3) blockquote p { color: var(--fg-dark); }
.quote:nth-child(2) figcaption, .quote:nth-child(3) figcaption { border-top-color: var(--rule-dark); }
.quote h3 { font-size: 1.35rem; }
.quote blockquote p { font-size: 1.1rem; }
@media (min-width: 800px) { .quote:nth-child(even) { transform: translateY(var(--s7)); } .quotes { padding-bottom: var(--s7); } }

/* Oferta com obra ao fundo */
.offer-section { position: relative; overflow: hidden; }
.offer-art { position: absolute; inset: 0; }
.offer-art picture, .offer-art img { width: 100%; height: 100%; }
.offer-art img { object-fit: cover; opacity: .22; filter: grayscale(.2); }
.offer-art::after { content: ""; position: absolute; inset: 0; background: linear-gradient(90deg, rgba(26,23,24,.92) 0%, rgba(26,23,24,.55) 60%, rgba(26,23,24,.75) 100%); }
.offer-grid { position: relative; }
.offer-section .chapter { color: var(--fg-dark); }
.offer-card { background: var(--paper); color: var(--ink); border: 0; box-shadow: 0 40px 80px -30px rgba(0,0,0,.7); }
.offer-card p { color: var(--muted); }
.offer-card p strong { color: var(--ink); }
.offer-card .btn-light { background: var(--ink); color: var(--paper); border-color: var(--ink); }
.offer-card .btn-light:hover { background: var(--band); }
.offer-card :focus-visible { outline-color: var(--ink); }
.offer-note, .offer-guarantee { border-top-color: var(--rule); }
.price-main { font-size: clamp(2rem, 1.4rem + 2.6vw, 3.2rem); font-weight: 700; letter-spacing: -.02em; }
.offer-whatsapp a { color: var(--ink); }
.offer-whatsapp .link-pendente { outline-color: var(--ink); }

/* FAQ em duas colunas */
.faq-layout { display: grid; gap: var(--s5); }
@media (min-width: 900px) {
  .faq-layout { grid-template-columns: 4fr 8fr; gap: var(--s8); }
  .faq-head { position: sticky; top: 7rem; align-self: start; }
}

/* Títulos de seção maiores */
h2 { font-size: clamp(2rem, 1.3rem + 2.8vw, 3.4rem); line-height: 1.04; letter-spacing: -.025em; font-weight: 700; }

@media (prefers-reduced-motion: reduce) {
  .strip-item img, .fit, .feature { transition: none; }
  .fit:hover { transform: none; }
}
.wall-b img { object-position: 12% 60%; }
.hero-text h1 { font-size: clamp(2.6rem, 1.3rem + 4.8vw, 5.4rem); max-width: 14ch; }
.hero-text h1 { font-size: clamp(2.5rem, 1.2rem + 4.2vw, 4.7rem); max-width: 17ch; }
.path-num { font-size: .95rem; letter-spacing: .2em; opacity: .6; font-weight: 700; margin-bottom: var(--s3); }
@media (max-width: 959px) { .hero-wall { grid-auto-rows: min(7.2vw, 2.6rem); gap: .6rem; } .wall-item { padding: .35rem; } }

/* Leitura: títulos mais abertos, texto corrido mais fechado */
h1, h2, h3, h4,
.hero-text h1, .split-head h2,
.pull-quote, .price-main, .lead-line, .statement, .module-sub,
.wordmark { letter-spacing: .01em; }
.hero-text h1 { line-height: 1.04; }
h2, .split-head h2 { line-height: 1.1; }
.method-mark { letter-spacing: 0; }

body, p, li, blockquote, .faq-a { letter-spacing: -.012em; }
body { word-spacing: -.02em; }

/* Sem numeração decorativa */
.feature::before { content: none; }

/* Abertura com imagem de fundo (trocar img/fundo-abertura.jpg e .webp) */
.hero-bg { position: relative; isolation: isolate; color: var(--paper); background: var(--night); min-height: min(88vh, 54rem); display: flex; align-items: center; }
.hero-bg-img { position: absolute; inset: 0; z-index: -1; }
.hero-bg-img picture, .hero-bg-img img { width: 100%; height: 100%; }
.hero-bg-img img { object-fit: cover; object-position: 50% 40%; }
.hero-bg-img::after { content: ""; position: absolute; inset: 0; background: linear-gradient(90deg, rgba(26,23,24,.86) 0%, rgba(26,23,24,.62) 55%, rgba(26,23,24,.35) 100%); }
.hero-bg .hero-grid { grid-template-columns: 1fr; }
.hero-bg .hero-text h1 { color: var(--paper); }
.hero-bg .hero-text .lead { color: var(--paper); }
.hero-bg .hero-text p { color: rgba(241,238,235,.86); }
.hero-bg .hero-text p strong { color: var(--paper); }
.hero-bg :focus-visible { outline-color: var(--paper); }
@media (max-width: 959px) { .hero-bg-img::after { background: linear-gradient(180deg, rgba(26,23,24,.7) 0%, rgba(26,23,24,.85) 100%); } }

/* Uma cor por dobra */
.bg-paper { background: var(--paper); }
.bg-white { background: var(--white); }
.bg-mist { background: var(--mist); }
.bg-sand { background: var(--sand); }
.section-dark.bg-band { background: var(--band); }
.bg-band .feature-grid { background: var(--rule-dark); }
.bg-band .feature { background: var(--band); }
.bg-band .feature:hover { background: var(--night); }
.bg-white .path { border-color: var(--ink); }
.bg-mist .fit { background: var(--white); }
.bg-sand .prose p, .bg-sand .story-body p { color: rgba(35,31,32,.82); }
.bg-paper .module { background: var(--white); }
.bg-mist .quote:not(:nth-child(2)):not(:nth-child(3)) { background: var(--white); border-color: transparent; }

/* =========================================================
   Ajustáveis pelo painel (valores padrão).
   O painel grava os valores escolhidos em css/ajustes.css.
   ========================================================= */
:root {
  --titulo-escala: 1;
  --texto-tam: 1.0625rem;
  --titulo-espaco: .01em;
  --texto-espaco: -.012em;
  --entrelinha: 1.65;
  --btn-escala: 1;
  --hero-escuro: 1;
  --oferta-img: .22;
  --organizado-img: .9;
  --anim-tipo: fade;
  --anim-dur: .9s;
  --anim-passo: .12s;
}
body { font-size: var(--texto-tam); line-height: var(--entrelinha); letter-spacing: var(--texto-espaco); }
@media (min-width: 1024px) { body { font-size: calc(var(--texto-tam) + .0625rem); } }
p, li, blockquote, .faq-a { letter-spacing: var(--texto-espaco); }
h1, h2, h3, h4, .hero-text h1, .split-head h2, .pull-quote, .price-main, .lead-line, .statement, .module-sub { letter-spacing: var(--titulo-espaco); }
.hero-text h1 { font-size: calc(clamp(2.5rem, 1.2rem + 4.2vw, 4.7rem) * var(--titulo-escala)); }
h2 { font-size: calc(clamp(2rem, 1.3rem + 2.8vw, 3.4rem) * var(--titulo-escala)); }
.split-head h2 { font-size: calc(clamp(2rem, 1.3rem + 3vw, 3.6rem) * var(--titulo-escala)); }
.btn { font-size: calc(.9rem * var(--btn-escala)); padding: calc(.95rem * var(--btn-escala)) calc(1.6rem * var(--btn-escala)); }
.btn-small { font-size: .78rem; padding: .6rem 1.1rem; }
.hero-bg-img::after { opacity: var(--hero-escuro); }
.offer-art img { opacity: var(--oferta-img); }
.organized-art img { opacity: var(--organizado-img); }

/* Pontos de botão: só a abertura e o "caminho organizado" vêm ligados */
.cta-slot { display: none; justify-content: flex-start; }
.cta-slot[data-slot="abertura"], .cta-slot[data-slot="organizado"] { display: flex; }
.hero-text .cta-slot { margin-top: var(--s5); }
.hero-text .cta-slot .btn { margin-top: 0; }
.cta-fim { margin-top: var(--s7); }
.section-dark .cta-slot .btn:not(.btn-light) { background: var(--paper); color: var(--ink); border-color: var(--paper); }
.section-dark .cta-slot .btn:not(.btn-light):hover { background: var(--white); }

/* Animação de leitura (como a do site: cada elemento aparece sozinho) */
.js .reveal, .js .reveal.is-in { opacity: 1; transform: none; transition: none; }
.anima { transition-property: opacity, transform; transition-duration: var(--anim-dur); transition-timing-function: ease; transition-delay: var(--atraso, 0s); }
.anim-fade .anima:not(.visivel) { opacity: 0; }
.anim-slide .anima:not(.visivel) { opacity: 0; transform: translateY(28px); }
.anim-scale .anima:not(.visivel) { opacity: 0; transform: scale(.94); }
.anim-clip .anima:not(.visivel) { opacity: 0; clip-path: inset(0 0 100% 0); }
.anim-clip .anima { transition-property: opacity, clip-path; }
.anim-clip .anima.visivel { clip-path: inset(0 0 0 0); }
@media (prefers-reduced-motion: reduce) {
  .anima, .anima:not(.visivel) { opacity: 1 !important; transform: none !important; clip-path: none !important; transition: none !important; }
}

/* Cabeçalho branco, só com o logo */
.site-header { background: var(--white); -webkit-backdrop-filter: none; backdrop-filter: none; border-bottom: 1px solid var(--rule); }
.header-inner { justify-content: center; }
@media (min-width: 900px) { .header-inner { justify-content: flex-start; } }
.header-inner { justify-content: flex-start; }

/* =========================================================
   Abertura como no site: logo sobre a imagem, sem faixa,
   véu cinza uniforme, título grande e a cadeira recortada.
   ========================================================= */
.site-header {
  position: absolute; top: 0; left: 0; right: 0; z-index: 40;
  background: transparent; border-bottom: 0;
}
.site-header.is-scrolled { border-bottom-color: transparent; }
.header-inner { min-height: 5.5rem; max-width: none; }
.wordmark img { height: 2.8rem; }
@media (min-width: 900px) { .wordmark img { height: 3.4rem; } .header-inner { min-height: 7rem; padding-inline: 2rem; } }
html { scroll-padding-top: 1rem; }
.progress span { background: #A8A69F; }

.hero.hero-bg { min-height: 100vh; min-height: 100svh; padding-block: 8rem 5rem; align-items: flex-end; }
@media (min-width: 900px) { .hero.hero-bg { padding-block: 10rem 6rem; align-items: center; } }
.hero-bg-img::after { background: rgba(44, 42, 43, .62); }
.hero-bg .hero-grid { position: relative; grid-template-columns: 1fr; max-width: 1400px; }
.hero-bg .hero-text { max-width: 100%; }
.hero-bg .hero-text h1 { font-size: calc(clamp(2.6rem, 1rem + 6.4vw, 6.8rem) * var(--titulo-escala)); line-height: 1.02; max-width: 15ch; margin-bottom: var(--s7); font-weight: 600; }
.hero-bg .hero-text .lead, .hero-bg .hero-text p { max-width: 38rem; }
.hero-bg .hero-text .lead { font-size: clamp(1.1rem, 1rem + .45vw, 1.35rem); line-height: 1.6; }

.hero-cadeira { margin: var(--s6) 0 0 auto; width: min(62vw, 18rem); }
.hero-cadeira[hidden] { display: none; }
.hero-cadeira img { width: 100%; height: auto; filter: drop-shadow(0 30px 40px rgba(0,0,0,.35)); }
@media (min-width: 1000px) {
  .hero-cadeira { position: absolute; right: 0; bottom: -2rem; margin: 0; width: clamp(16rem, 22vw, 24rem); }
  .hero-bg .hero-text .lead, .hero-bg .hero-text p { max-width: min(38rem, 56vw); }
}
@media (min-width: 1000px) { .hero-cadeira { top: 40%; bottom: auto; } }
u { text-decoration-thickness: 1px; text-underline-offset: .18em; }

/* Título e texto alinhados pelo topo das letras */
.split-body > :first-child { margin-top: 0; }
.split-head h2, .split-body > :first-child { text-box: trim-start cap alphabetic; }
/* Imagem abaixo do título (dobra curiosidade) */
.split-img { margin: var(--s6) 0 0; }
.split-img[hidden] { display: none; }
.split-img img { display: block; width: 100%; height: auto; }

/* sente/arte: duas colunas, sem caixa */
.method-cols { display: grid; gap: var(--s7); }
.method-cols .method-col { max-width: none; }
.method-cols .method-mark {
  position: static; display: block; margin: 0 0 var(--s6);
  font-family: var(--display); font-weight: 700; line-height: 1.04;
  font-size: calc(clamp(2rem, 1.3rem + 2.8vw, 3.4rem) * var(--titulo-escala));
  letter-spacing: var(--titulo-espaco); color: var(--fg-dark);
}
.method-cols .method-mark .slash { margin: 0 .04em; font-weight: 300; color: var(--muted-dark); }
.method-cols .method-body { border-top: 1px solid var(--rule-dark); padding-top: var(--s7); }
.method-cols .method-col > :first-child { margin-top: 0; text-box: trim-start cap alphabetic; }
@media (min-width: 900px) {
  .method-cols { grid-template-columns: 1fr 1fr; gap: 0; align-items: start; }
  .method-cols .method-col:first-child { padding-right: var(--s8); }
  .method-cols .method-body { border-top: 0; padding-top: 0; border-left: 1px solid var(--rule-dark); padding-left: var(--s8); }
}
.section-dark .method-cols p.method-mark { color: var(--fg-dark); }
.section-dark .method-cols p.method-mark .slash { color: var(--muted-dark); }
.section-dark .method-cols .prose p strong, .section-dark .method-cols .prose p em,
.section-dark .method-cols.prose p em, .section-dark .prose p em { color: var(--fg-dark); }

/* Botões em terracota, todos iguais */
:root { --terracota: #A84B2F; --terracota-escuro: #8E3E26; }
.btn, .btn-light, .offer-card .btn-light, .js .mobile-bar .btn,
.section-dark .cta-slot .btn:not(.btn-light) { background: var(--terracota); border-color: var(--terracota); color: #FFFFFF; }
.btn:hover, .btn-light:hover, .offer-card .btn-light:hover, .js .mobile-bar .btn:hover,
.section-dark .cta-slot .btn:not(.btn-light):hover { background: var(--terracota-escuro); border-color: var(--terracota-escuro); color: #FFFFFF; }
.btn:focus-visible { outline: 2px solid currentColor; outline-offset: 3px; }

/* Três selos abaixo do botão da abertura */
.hero-selos { list-style: none; margin: var(--s5) 0 0; padding: 0; display: flex; flex-wrap: wrap; align-items: center; color: rgba(241,238,235,.85); }
.hero-selos li { display: flex; align-items: center; gap: .55rem; padding: 0 var(--s5); font-size: .78rem; line-height: 1.2; letter-spacing: .01em; }
.hero-selos li:first-child { padding-left: 0; }
.hero-selos li + li { border-left: 1px solid rgba(241,238,235,.35); }
.hero-selos svg { flex: none; }
@media (max-width: 420px) { .hero-selos li { padding: 0 .8rem; gap: .4rem; font-size: .72rem; } .hero-selos svg { width: 18px; height: 18px; } }

/* Mais respiro entre o texto da abertura e o botão */
.hero-text .cta-slot { margin-top: 60px; }

/* Uma curiosidade (ativação): título com a foto inteira ao lado, cartão branco, caixa preta e caixa clara */
.ativ { overflow-x: clip; }
.ativ-topo .wrap { display: grid; gap: var(--s6); }
.ativ-head h2 { margin: 0; font-size: calc(clamp(2rem, 1.3rem + 3vw, 3.6rem) * var(--titulo-escala)); line-height: 1.06; letter-spacing: var(--titulo-espaco); }
.ativ-foto { margin: 0; }
.ativ-foto[hidden] { display: none; }
.ativ-foto img { display: block; width: 100%; height: auto; border-radius: var(--radius); }
.ativ-caixa { border-radius: var(--radius); padding: var(--s6) var(--s5); }
.ativ-card {
  position: relative; z-index: 1; margin-top: var(--s5);
  background: #FFFFFF; border-radius: var(--radius); padding: var(--s6) var(--s5);
  box-shadow: 0 30px 60px -32px rgba(35, 31, 32, .28);
}
.ativ-card > .lead-line { margin: 0 0 var(--s6); }
.ativ-lista { list-style: none; margin: 0; padding: 0; }
.ativ-lista li { display: grid; grid-template-columns: 1.6rem 1fr; gap: .75rem; align-items: start; }
.ativ-lista li + li { margin-top: var(--s5); }
.ativ-lista p { margin: 0; padding-bottom: var(--s5); border-bottom: 1px solid var(--rule); }
.ativ-lista li:last-child p { padding-bottom: 0; border-bottom: 0; }
.ativ-seta { width: 1.6rem; height: auto; margin-top: .45em; color: var(--ink); }
.ativ-fim { display: grid; gap: var(--s5); margin-top: var(--s7); }
.ativ-preta { background: var(--ink); }
.ativ-preta > .lead-line { margin: 0 0 var(--s5); }
.prose.ativ-preta .lead-line strong { color: #FFFFFF; }
.prose.ativ-preta p { color: rgba(241, 238, 235, .78); }
.prose.ativ-preta p strong, .prose.ativ-preta p em { color: #FFFFFF; }
.prose.ativ-preta p:last-child { margin-bottom: 0; }
.ativ-clara { background: #FFFFFF; box-shadow: 0 30px 60px -32px rgba(35, 31, 32, .22); }
.ativ-clara .statement { margin: 0; padding: 0; border: 0; }
@media (min-width: 960px) {
  .ativ-topo .wrap { grid-template-columns: 5fr 6fr; gap: var(--s8); align-items: center; }
  .ativ-foto img { border-radius: var(--radius) 0 0 var(--radius); }
  .ativ-card { grid-column: 1 / -1; margin-top: var(--s5); width: min(100%, 62rem); padding: var(--s8) var(--s8) var(--s8) var(--s7); }
  .ativ-lista li { grid-template-columns: 3.5rem 1fr; gap: var(--s6); }
  .ativ-seta { width: 3rem; margin-top: .35em; }
  .ativ-fim { margin-top: var(--s7); width: min(100%, 62rem); }
  .ativ-caixa { padding: var(--s8) var(--s8) var(--s8) var(--s7); }
}

/* Uma curiosidade, versão 3: título, imagem inteira no meio, branco e preto lado a lado */
.ativ-topo .wrap { display: block; }
.ativ-foto { margin: var(--s6) 0 0; }
.ativ-cols { display: grid; gap: var(--s5); margin-top: var(--s7); }
.ativ-cols .ativ-card, .ativ-cols .ativ-caixa { margin: 0; width: auto; }
.ativ-fim { margin-top: var(--s5); }
@media (min-width: 960px) {
  .ativ-topo .wrap { display: block; }
  .ativ-head { max-width: 46rem; }
  .ativ-foto { margin: var(--s7) 0 0; }
  .ativ-foto img { border-radius: var(--radius); }
  .ativ-cols { grid-template-columns: 1fr 1fr; align-items: stretch; margin-top: var(--s7); }
  .ativ-cols .ativ-card, .ativ-cols .ativ-caixa { padding: var(--s7) var(--s6); }
  .ativ-cols .ativ-lista li { grid-template-columns: 2rem 1fr; gap: var(--s4); }
  .ativ-cols .ativ-seta { width: 2rem; margin-top: .45em; }
  .ativ-fim { width: 100%; margin-top: var(--s5); }
  .ativ-fim .ativ-caixa { padding: var(--s7) var(--s6); }
}
@media (min-width: 960px) { .ativ-cols .ativ-card { grid-column: auto; } }
/* "Porque conhecer arte..." solto, numa coluna como o título */
.ativ-fim .ativ-clara { background: none; box-shadow: none; padding: 0; border-radius: 0; max-width: 46rem; }
.ativ-fim { margin-top: var(--s8); }
@media (min-width: 960px) { .ativ-fim .ativ-caixa.ativ-clara { padding: 0; } .ativ-fim { margin-top: var(--s9); } }
@media (min-width: 960px) { .ativ-cols { align-items: start; } }
/* coluna da direita: caixa preta e, embaixo, a frase solta */
.ativ-dir { display: grid; gap: var(--s7); align-content: start; }
.ativ-dir .ativ-clara { background: none; box-shadow: none; padding: 0 var(--s2); border-radius: 0; max-width: none; }
@media (min-width: 960px) { .ativ-dir .ativ-caixa.ativ-clara { padding: 0 var(--s6); } }
.ativ-dir .statement { font-size: calc(clamp(1.6rem, 1rem + 1.7vw, 2.5rem) * var(--titulo-escala)); line-height: 1.18; }

/* Uma curiosidade, versão final: tudo um embaixo do outro */
.ativ-pilha > .wrap { display: grid; gap: var(--s7); }
.ativ-pilha .ativ-head, .ativ-pilha .ativ-card, .ativ-pilha .ativ-foto, .ativ-pilha .ativ-caixa { margin: 0; width: 100%; max-width: none; }
.ativ-pilha .ativ-head { max-width: 46rem; }
.ativ-pilha .ativ-clara { background: none; box-shadow: none; border-radius: 0; padding: 0; max-width: 52rem; }
.ativ-pilha .ativ-foto img { border-radius: var(--radius); }
@media (min-width: 960px) {
  .ativ-pilha .ativ-card, .ativ-pilha .ativ-caixa.ativ-preta { padding: var(--s8); }
  .ativ-pilha .ativ-caixa.ativ-clara { padding: 0; }
  .ativ-pilha .ativ-lista li { grid-template-columns: 3rem 1fr; gap: var(--s5); }
  .ativ-pilha .ativ-seta { width: 2.5rem; }
  .ativ-pilha .ativ-lista p, .prose.ativ-preta p { max-width: 62rem; }
}
.ativ-pilha .statement { font-size: calc(clamp(1.6rem, 1rem + 1.7vw, 2.5rem) * var(--titulo-escala)); line-height: 1.18; }
.section.ativ-pilha { padding-top: var(--s9); }
.ativ-pilha .ativ-caixa.ativ-clara, .ativ-pilha .ativ-clara .statement { max-width: none; }

/* Caixa preta: frase de abertura e itens com marcador */
.ativ-pontos { list-style: none; margin: 0 0 var(--s5); padding: 0; }
.ativ-pontos li { position: relative; padding-left: 1.4rem; }
.ativ-pontos li + li { margin-top: var(--s3); }
.ativ-pontos li::before { content: ""; position: absolute; left: 0; top: .72em; width: .42rem; height: .42rem; border-radius: 50%; background: var(--terracota); }
.ativ-pontos p { margin: 0; }
.prose.ativ-preta p:has(+ .ativ-pontos) { margin-bottom: var(--s4); }

/* Dobra 3: linha do tempo que se abre e o plano sente/arte num cartão branco com a cadeira */
.metodo2 { overflow-x: clip; }
.tl-head h2 { margin: 0; max-width: 40rem; }
.tl { list-style: none; margin: var(--s8) 0 0; padding: 0 0 0 2.25rem; position: relative; display: grid; gap: var(--s7); }
.tl::before {
  content: ""; position: absolute; left: .55rem; top: .4rem; bottom: .4rem; width: 1px; background: var(--ink);
  transform: scaleY(0); transform-origin: top; transition: transform 1.8s cubic-bezier(.4, 0, .2, 1);
}
.tl.tl-on::before { transform: none; }
.tl-passo { position: relative; }
.tl-no {
  position: absolute; left: -2.25rem; top: .15rem; width: 1.15rem; height: 1.15rem; border-radius: 50%;
  border: 1px solid var(--ink); background: var(--mist);
}
.tl-no::after { content: ""; position: absolute; inset: .3rem; border-radius: 50%; background: var(--ink); }
.tl-fim .tl-no { border-color: var(--terracota); }
.tl-fim .tl-no::after { background: var(--terracota); }
.tl-passo p { margin: 0; color: var(--muted); }
.tl-passo p strong, .tl-passo p em { color: var(--ink); }
.tl-pergunta p { font-family: var(--display); font-size: clamp(1.15rem, 1rem + .6vw, 1.45rem); line-height: 1.3; color: var(--ink); }
.tl-pergunta p em { font-style: italic; }
.tl-fim p { color: var(--ink); }
@media (min-width: 960px) {
  .tl { grid-template-columns: repeat(4, 1fr); gap: var(--s6); padding: 2.75rem 0 0; }
  .tl::before { left: 0; right: 0; top: .57rem; bottom: auto; width: auto; height: 1px; transform: scaleX(0); transform-origin: left; }
  .tl-no { left: 0; top: 0; }
  .tl-passo { padding-top: .25rem; padding-right: var(--s4); }
}
@media (prefers-reduced-motion: reduce) { .tl::before { transform: none !important; transition: none; } }

.plano { position: relative; display: grid; margin-top: var(--s9); }
.plano-card {
  position: relative; z-index: 1; background: #FFFFFF; border-radius: var(--radius);
  padding: var(--s6) var(--s5); box-shadow: 0 40px 80px -40px rgba(35, 31, 32, .38);
}
.plano-card .method-mark {
  position: static; display: block; margin: 0 0 var(--s6); color: var(--ink);
  font-family: var(--display); font-weight: 700; line-height: 1;
  font-size: calc(clamp(2.6rem, 1.6rem + 4vw, 5rem) * var(--titulo-escala)); letter-spacing: var(--titulo-espaco);
}
.plano-card .method-mark .slash { margin: 0 .03em; font-weight: 300; color: var(--terracota); }
.plano-card p:last-child { margin-bottom: 0; }
.plano-cadeira { order: -1; margin: 0 auto -3.5rem; width: min(62vw, 16rem); position: relative; z-index: 2; }
.plano-cadeira[hidden] { display: none; }
.plano-cadeira img { display: block; width: 100%; height: auto; filter: drop-shadow(0 30px 30px rgba(35, 31, 32, .25)); }
.plano-cadeira + * { }
.plano-card { padding-top: var(--s8); }
@media (min-width: 960px) {
  .plano { grid-template-columns: 7fr 5fr; align-items: center; }
  .plano-card { padding: var(--s8); }
  .plano-cadeira { order: 0; margin: 0 0 0 -5rem; width: auto; max-width: 30rem; justify-self: start; }
}
.tl-passo p { font-size: 1.02rem; line-height: 1.6; }
@media (min-width: 960px) {
  .tl-no { top: -2.75rem; }
  .tl-passo { padding-top: 0; }
  .plano-card { padding-right: calc(var(--s8) + 2.5rem); }
  .plano-cadeira { margin-left: -3rem; }
}
.tl-pergunta p { font-size: clamp(1.15rem, 1rem + .5vw, 1.35rem); line-height: 1.35; letter-spacing: 0; }
/* timeline: os 4 passos com a mesma letra e o mesmo tamanho do primeiro */
.tl-passo p, .tl-pergunta p, .tl-fim p { font-family: inherit; font-size: 1.02rem; line-height: 1.6; letter-spacing: inherit; color: var(--muted); }
.tl-pergunta p em, .tl-pergunta p u, .tl-fim p u { color: var(--ink); }
/* timeline: todas as bolinhas iguais, sólidas, em terracota */
.tl-no, .tl-fim .tl-no { background: var(--terracota); border-color: var(--terracota); }
.tl-no::after { display: none; }
/* timeline padronizada: sem itálico nem sublinhado, mesma cor; só o negrito destaca */
.tl-passo p em, .tl-passo p u { font-style: normal; text-decoration: none; color: inherit; }
.tl-passo p strong { color: var(--ink); }
/* frase de fecho da dobra 3, grande como a da dobra 2 */
.plano-frase { margin: var(--s9) 0 0; padding: 0; border: 0; max-width: none; color: var(--ink);
  font-size: calc(clamp(1.6rem, 1rem + 1.7vw, 2.5rem) * var(--titulo-escala)); line-height: 1.18; }
.plano-frase strong { font-weight: 600; color: var(--ink); }

/* Dobra 4: três caminhos em três cartões, com número grande sobre a imagem */
.paths3 { list-style: none; margin: var(--s8) 0 0; padding: 0; display: grid; gap: var(--s6); }
.paths3 .path3 {
  display: flex; flex-direction: column; gap: 0; padding: 0; border: 0;
  background: #FFFFFF; border-radius: var(--radius); overflow: hidden;
  box-shadow: 0 34px 70px -40px rgba(35, 31, 32, .35);
}
.paths3 .path3:last-child { border: 0; }
.paths3 .path-head { position: relative; top: auto; display: flex; flex-direction: column; }
.paths3 .path-img { max-width: none; width: 100%; margin: 0; border-radius: 0; aspect-ratio: 4 / 3; }
.paths3 .path-img img { transform: none; }
.path-n {
  position: relative; z-index: 1; align-self: flex-start;
  margin: -2.9rem 0 0 var(--s5); width: 5.6rem; height: 5.6rem; border-radius: 50%;
  display: grid; place-items: center; background: #FFFFFF;
  font-family: var(--display); font-weight: 700; font-size: 3.4rem; line-height: 1; letter-spacing: -.03em; color: var(--terracota);
  font-variant-numeric: lining-nums;
}
.paths3 .path-head h3 { margin: var(--s4) var(--s5) 0; max-width: none; font-size: clamp(1.35rem, 1.15rem + .7vw, 1.7rem); line-height: 1.15; }
.paths3 .path-body { max-width: none; padding: var(--s5) var(--s5) var(--s6); }
.paths3 .path-body p { font-size: 1rem; }
.paths3 .path-body p:last-child { margin-bottom: 0; }
@media (min-width: 960px) {
  .paths3 { grid-template-columns: repeat(3, 1fr); gap: var(--s5); align-items: stretch; }
  .paths3 .path3 { display: flex; grid-template-columns: none; padding-block: 0; }
  .paths3 .path-head { position: relative; top: auto; }
}
.paths3 .path-img { order: 1; }
.paths3 .path-n { order: 2; }
.paths3 .path-head h3 { order: 3; }

/* Dobra 2: cartão "Você gosta de arte." em preto, como a caixa do percurso */
.ativ-card { background: var(--ink); box-shadow: none; }
.prose.ativ-card .lead-line strong, .prose.ativ-card .lead-line u { color: #FFFFFF; }
.prose.ativ-card p { color: rgba(241, 238, 235, .78); }
.prose.ativ-card p strong, .prose.ativ-card p em, .prose.ativ-card p u { color: #FFFFFF; }
.ativ-card .ativ-seta { color: #F1EEEB; }
.ativ-card .ativ-lista p { border-bottom-color: rgba(241, 238, 235, .18); }
/* timeline: sublinhado volta a funcionar */
.tl-passo p u { text-decoration: underline; text-decoration-thickness: 1px; text-underline-offset: .18em; color: var(--ink); }
/* números dos três caminhos: círculo terracota, número branco */
.path-n { background: var(--terracota); color: #FFFFFF; }

/* três caminhos: cartões terracota com texto branco; círculo do número em branco para não sumir */
.paths3 .path3 { background: var(--terracota); box-shadow: 0 34px 70px -40px rgba(35, 31, 32, .45); }
.paths3 .path-head h3 { color: #FFFFFF; }
.paths3 .path-body p { color: rgba(255, 255, 255, .9); }
.paths3 .path-body p strong, .paths3 .path-body p em, .paths3 .path-body p u { color: #FFFFFF; }
.paths3 .path-n { background: #FFFFFF; color: var(--terracota); }
.paths3 .path-n { background: var(--terracota); color: #FFFFFF; }

/* Diferenciais: imagem de fundo com véu escuro; título e texto na largura dos cartões */
.dif-com-fundo { position: relative; isolation: isolate; overflow: hidden; }
.dif-fundo { position: absolute; inset: 0; z-index: -1; }
.dif-fundo[hidden] { display: none; }
.dif-fundo picture, .dif-fundo img { display: block; width: 100%; height: 100%; }
.dif-fundo img { object-fit: cover; }
.dif-fundo::after { content: ""; position: absolute; inset: 0; background: linear-gradient(180deg, rgba(26, 23, 24, .88) 0%, rgba(26, 23, 24, .78) 45%, rgba(26, 23, 24, .9) 100%); }
.dif-com-fundo .dif-head { max-width: none; }
.dif-com-fundo .dif-head h2 { max-width: none; }
.dif-com-fundo .dif-head p { max-width: 62rem; }
[data-dobra="diferenciais"].dif-com-fundo .feature-grid { background: transparent; gap: 1px; }
[data-dobra="diferenciais"].dif-com-fundo .feature { background: rgba(38, 33, 34, .82); -webkit-backdrop-filter: blur(6px); backdrop-filter: blur(6px); }
[data-dobra="diferenciais"].dif-com-fundo .feature:hover { background: rgba(26, 23, 24, .9); }
[data-dobra="diferenciais"].dif-com-fundo div.narrow.dif-head { max-width: none; }
[data-dobra="diferenciais"].dif-com-fundo .dif-head h2 { max-width: none; }
[data-dobra="diferenciais"].dif-com-fundo .dif-head p { max-width: none; }
.dif-fundo::after { background: linear-gradient(180deg, rgba(26, 23, 24, .8) 0%, rgba(26, 23, 24, .62) 45%, rgba(26, 23, 24, .84) 100%); }

/* Diferenciais: linha do tempo vertical no lugar das caixas */
.vtl { list-style: none; margin: var(--s8) 0 0; padding: 0 0 0 2.5rem; position: relative; display: grid; gap: var(--s7); }
.vtl::before {
  content: ""; position: absolute; left: .55rem; top: .5rem; bottom: .5rem; width: 1px; background: rgba(241, 238, 235, .45);
  transform: scaleY(0); transform-origin: top; transition: transform 2.2s cubic-bezier(.4, 0, .2, 1);
}
.vtl.tl-on::before { transform: none; }
.vtl-item { position: relative; display: grid; gap: var(--s3); }
.vtl-no { position: absolute; left: -2.5rem; top: .3rem; width: 1.15rem; height: 1.15rem; border-radius: 50%; background: var(--terracota); box-shadow: 0 0 0 5px rgba(26, 23, 24, .55); }
.vtl-item h3 { margin: 0; color: var(--fg-dark); font-size: clamp(1.25rem, 1.1rem + .6vw, 1.6rem); line-height: 1.2; }
.vtl-item p { margin: 0; color: var(--muted-dark); max-width: 46rem; }
.vtl-item p strong, .vtl-item p em, .vtl-item p u { color: var(--fg-dark); }
@media (min-width: 960px) {
  .vtl { padding-left: 3rem; gap: var(--s8); }
  .vtl-no { left: -3rem; }
  .vtl-item { grid-template-columns: 5fr 7fr; gap: var(--s7); align-items: start; }
}
@media (prefers-reduced-motion: reduce) { .vtl::before { transform: none !important; transition: none; } }
/* Diferenciais no computador: duas linhas de três, horizontais, como a linha do tempo da dobra 3 */
@media (min-width: 960px) {
  .vtl { padding: 0; grid-template-columns: repeat(3, 1fr); column-gap: var(--s6); row-gap: var(--s8); }
  .vtl::before { display: none; }
  .vtl-item { grid-template-columns: none; display: block; padding-top: 2.75rem; }
  .vtl-item::before {
    content: ""; position: absolute; top: .57rem; left: 0; right: calc(-1 * var(--s6)); height: 1px;
    background: rgba(241, 238, 235, .45); transform: scaleX(0); transform-origin: left;
    transition: transform .9s cubic-bezier(.4, 0, .2, 1);
  }
  .vtl-item:nth-child(3n)::before { right: 0; }
  .vtl.tl-on .vtl-item::before { transform: none; }
  .vtl-item:nth-child(2)::before, .vtl-item:nth-child(5)::before { transition-delay: .5s; }
  .vtl-item:nth-child(3)::before, .vtl-item:nth-child(6)::before { transition-delay: 1s; }
  .vtl-item:nth-child(n+4)::before { transition-delay: 1.4s; }
  .vtl-item:nth-child(5)::before { transition-delay: 1.9s; }
  .vtl-item:nth-child(6)::before { transition-delay: 2.4s; }
  .vtl-no { left: 0; top: 0; z-index: 1; }
  .vtl-item h3 { margin-bottom: var(--s4); }
  .vtl-item p { padding-right: var(--s4); }
}
@media (min-width: 960px) and (prefers-reduced-motion: reduce) { .vtl-item::before { transform: none !important; transition: none; } }
/* Diferenciais: "O Conversas sobre Arte propõe uma experiência diferente." em destaque, um pouco menor que o título */
[data-dobra="diferenciais"] .dif-head p.dif-destaque {
  margin-top: var(--s6); font-family: var(--display); color: var(--fg-dark);
  font-size: calc(clamp(1.7rem, 1.15rem + 2.3vw, 2.85rem) * var(--titulo-escala)); line-height: 1.1; letter-spacing: var(--titulo-espaco);
}
[data-dobra="diferenciais"] .dif-head p.dif-destaque strong { color: var(--fg-dark); }

/* Caminho organizado: título à esquerda, o que você NÃO precisa à direita com X, fecho embaixo */
.org2 { background: var(--paper); }
.org2 .organized-art { display: none; }
.org-topo { display: grid; gap: var(--s7); }
.org-head h2 { margin: 0; font-size: calc(clamp(2rem, 1.3rem + 2.8vw, 3.4rem) * var(--titulo-escala)); line-height: 1.06; }
.org-nao { list-style: none; margin: 0; padding: 0; display: grid; gap: var(--s5); }
.org-nao li { display: grid; grid-template-columns: 1.6rem 1fr; gap: var(--s4); align-items: start; }
.org-x { width: 1.35rem; height: 1.35rem; margin-top: .2em; color: var(--terracota); }
.org-nao p { margin: 0; color: var(--muted); font-size: 1.08rem; line-height: 1.55; }
.org-nao p strong, .org-nao p em, .org-nao p u { color: var(--ink); }
.org-fim { margin-top: var(--s9); max-width: none; }
.org-fim p { max-width: 52rem; }
.org-fim .org-frase { max-width: none; margin-top: var(--s7); color: var(--ink); font-family: var(--display); font-weight: 600;
  font-size: calc(clamp(1.6rem, 1rem + 1.7vw, 2.5rem) * var(--titulo-escala)); line-height: 1.18; letter-spacing: var(--titulo-espaco); }
.org-fim .cta-row { margin-top: var(--s7); }
@media (min-width: 960px) {
  .org-topo { grid-template-columns: 5fr 6fr; gap: var(--s8); align-items: center; }
}

/* Espaço entre as dobras: 120 px no computador, 90 px no celular e tablet (mesma proporção de antes) */
:root { --dobra-espaco: 90px; }
@media (min-width: 1024px) { :root { --dobra-espaco: 120px; } }
.section:not(.hero), .section.ativ, .section.ativ-pilha { padding-block: var(--dobra-espaco); }

/* Dobra 2: cartão "Você já gosta de arte" e imagem lado a lado; a caixa do percurso embaixo */
.ativ-linha { display: grid; gap: var(--s5); }
@media (min-width: 960px) {
  .ativ-linha { grid-template-columns: 7fr 5fr; align-items: stretch; }
  .ativ-linha .ativ-foto { height: 100%; }
  .ativ-linha .ativ-foto picture { height: 100%; }
  .ativ-linha .ativ-foto img { height: 100%; object-fit: cover; object-position: 50% 50%; }
}
@media (min-width: 960px) { .ativ-linha .ativ-card { grid-column: auto; width: auto; } .ativ-linha .ativ-foto { grid-column: auto; margin: 0; } }

/* Caminho organizado: os dois textos do Conversas sobre Arte em cartões terracota, letra grande e branca */
.org-cards { display: grid; gap: var(--s5); }
.org-card { background: var(--terracota); border-radius: var(--radius); padding: var(--s6) var(--s5); }
.org-fim .org-card p {
  margin: 0; max-width: none; color: #FFFFFF; font-family: var(--display); font-weight: 500;
  font-size: clamp(1.25rem, 1.05rem + .8vw, 1.7rem); line-height: 1.3; letter-spacing: var(--titulo-espaco);
}
.org-fim .org-card p strong, .org-fim .org-card p em, .org-fim .org-card p u { color: #FFFFFF; }
@media (min-width: 960px) {
  .org-cards { grid-template-columns: 1fr 1fr; }
  .org-card { padding: var(--s7) var(--s6); }
}

/* Sombra flutuante (a mesma do cartão sente/arte) nos cartões pretos e na imagem da dobra 2, e nos cartões terracota do caminho organizado */
.ativ-card, .ativ-caixa.ativ-preta, .org-card { box-shadow: 0 40px 80px -40px rgba(35, 31, 32, .38); }
.ativ-foto img { box-shadow: 0 40px 80px -40px rgba(35, 31, 32, .38); }
.ativ-linha .ativ-foto { border-radius: var(--radius); box-shadow: 0 40px 80px -40px rgba(35, 31, 32, .38); }
.ativ-linha .ativ-foto img { box-shadow: none; }

/* Para quem é: carrossel horizontal; o cartão do centro cresce */
[data-dobra="para-quem"] { overflow-x: clip; }
.fit-list.carrossel {
  display: flex; gap: var(--s5); grid-template-columns: none;
  overflow-x: auto; scroll-snap-type: x mandatory; scroll-behavior: smooth; overscroll-behavior-x: contain;
  margin: var(--s7) calc(50% - 50vw) 0; padding: var(--s6) calc(50vw - min(40vw, 17rem)); scrollbar-width: none;
}
.fit-list.carrossel::-webkit-scrollbar { display: none; }
.carrossel .fit {
  flex: 0 0 min(80vw, 34rem); grid-column: auto; scroll-snap-align: center;
  background: #FFFFFF; box-shadow: 0 40px 80px -40px rgba(35, 31, 32, .38);
  transform: scale(.88); opacity: .5;
  transition: transform .5s cubic-bezier(.2, .7, .2, 1), opacity .5s ease !important;
}
.carrossel .fit.ativo { transform: none; opacity: 1; }
.carrossel .fit h3 { font-size: clamp(1.3rem, 1.1rem + .8vw, 1.75rem); line-height: 1.2; }
.carrossel-nav { display: flex; gap: var(--s3); justify-content: center; margin-top: var(--s4); }
.carrossel-btn {
  width: 48px; height: 48px; border-radius: 50%; border: 1px solid var(--ink); background: transparent; color: var(--ink);
  display: grid; place-items: center; cursor: pointer; transition: background .2s, color .2s;
}
.carrossel-btn:hover { background: var(--ink); color: var(--paper); }
.carrossel-btn:focus-visible { outline: 2px solid var(--terracota); outline-offset: 3px; }
@media (min-width: 960px) {
  .carrossel .fit { flex-basis: 34rem; padding: var(--s8) var(--s7) var(--s8) calc(var(--s7) + 1.75rem); }
  .carrossel .fit::before { left: var(--s7); top: calc(var(--s8) + .5rem); }
}
@media (prefers-reduced-motion: reduce) { .fit-list.carrossel { scroll-behavior: auto; } .carrossel .fit { transition: none !important; } }
/* sem o traço em L nos cartões */
.fit::before, .carrossel .fit::before { content: none; display: none; }
.carrossel .fit { padding: var(--s6) var(--s5); }
@media (min-width: 960px) { .carrossel .fit { padding: var(--s8) var(--s7); } }
.fit-list.carrossel { position: relative; }

/* Três caminhos: o cartão cresce um pouco ao passar o mouse (computador) ou ao chegar no meio da tela (celular) */
.paths3 .path3 { transition: transform .5s cubic-bezier(.2, .7, .2, 1), opacity .5s ease, box-shadow .5s ease !important; }
@media (hover: hover) and (min-width: 960px) {
  .paths3:hover .path3 { transform: scale(.97); opacity: .7; }
  .paths3 .path3:hover { transform: scale(1.04); opacity: 1; box-shadow: 0 50px 90px -40px rgba(35, 31, 32, .5); z-index: 1; }
}
@media (hover: none), (max-width: 959px) {
  .paths3 .path3 { transform: scale(.94); opacity: .75; }
  .paths3 .path3.ativo { transform: none; opacity: 1; }
}
@media (prefers-reduced-motion: reduce) { .paths3 .path3 { transition: none !important; transform: none !important; opacity: 1 !important; } }

/* Para quem é, versão 2: setas ao lado do título, fundo com imagem e véu, sombra sem corte */
.pq-com-fundo { position: relative; isolation: isolate; overflow: hidden; }
.pq-fundo { position: absolute; inset: 0; z-index: -1; }
.pq-fundo[hidden] { display: none; }
.pq-fundo picture, .pq-fundo img { display: block; width: 100%; height: 100%; }
.pq-fundo img { object-fit: cover; }
.pq-fundo::after { content: ""; position: absolute; inset: 0; background: linear-gradient(180deg, rgba(26, 23, 24, .82), rgba(26, 23, 24, .7) 50%, rgba(26, 23, 24, .85)); }
.pq-com-fundo .section-title { color: #FFFFFF; margin: 0; }
.pq-com-fundo .section-title u { text-decoration-color: rgba(255, 255, 255, .6); }
.carrossel-topo { display: flex; align-items: flex-end; justify-content: space-between; gap: var(--s5); flex-wrap: wrap; }
.carrossel-topo .carrossel-nav { margin: 0; }
.pq-com-fundo .carrossel-btn { border-color: rgba(255, 255, 255, .7); color: #FFFFFF; }
.pq-com-fundo .carrossel-btn:hover { background: #FFFFFF; color: var(--ink); }
.fit-list.carrossel { padding-top: var(--s7); padding-bottom: var(--s9); margin-bottom: calc(-1 * var(--s7)); }
.carrossel .fit { box-shadow: 0 30px 60px -30px rgba(0, 0, 0, .55); }
.carrossel.sem-anim { scroll-behavior: auto; }
.carrossel.sem-anim .fit { transition: none !important; }

/* sente/arte: o cartão branco cresce um pouco ao passar o mouse (computador) ou ao chegar no meio da tela (celular) */
.plano-card { transition: transform .5s cubic-bezier(.2, .7, .2, 1), box-shadow .5s ease !important; transform-origin: center; }
@media (hover: hover) and (min-width: 960px) {
  .plano-card:hover { transform: scale(1.03); box-shadow: 0 50px 90px -40px rgba(35, 31, 32, .5); }
}
@media (hover: none), (max-width: 959px) {
  .plano-card { transform: scale(.96); }
  .plano-card.ativo { transform: none; }
}
@media (prefers-reduced-motion: reduce) { .plano-card { transition: none !important; transform: none !important; } }

/* Dobra 2: os dois cartões pretos crescem um pouco ao passar o mouse (computador) ou no meio da tela (celular) */
.ativ-card, .ativ-caixa.ativ-preta { transition: transform .5s cubic-bezier(.2, .7, .2, 1), box-shadow .5s ease !important; }
@media (hover: hover) and (min-width: 960px) {
  .ativ-card:hover, .ativ-caixa.ativ-preta:hover { transform: scale(1.03); box-shadow: 0 50px 90px -40px rgba(35, 31, 32, .55); position: relative; z-index: 1; }
}
@media (hover: none), (max-width: 959px) {
  .ativ-card, .ativ-caixa.ativ-preta { transform: scale(.96); }
  .ativ-card.ativo, .ativ-caixa.ativ-preta.ativo { transform: none; }
}
@media (prefers-reduced-motion: reduce) { .ativ-card, .ativ-caixa.ativ-preta { transition: none !important; transform: none !important; } }
/* Para quem é: cartões alternando as duas cores claras da marca */
[data-dobra="para-quem"] .carrossel .fit.fit-a { background: #F1EEEB; }
[data-dobra="para-quem"] .carrossel .fit.fit-b { background: #E3E4E0; }

/* Caminho organizado: os dois cartões terracota crescem um pouco ao passar o mouse (computador) ou no meio da tela (celular) */
.org-card { transition: transform .5s cubic-bezier(.2, .7, .2, 1), box-shadow .5s ease !important; }
@media (hover: hover) and (min-width: 960px) {
  .org-card:hover { transform: scale(1.03); box-shadow: 0 50px 90px -40px rgba(35, 31, 32, .55); position: relative; z-index: 1; }
}
@media (hover: none), (max-width: 959px) {
  .org-card { transform: scale(.96); }
  .org-card.ativo { transform: none; }
}
@media (prefers-reduced-motion: reduce) { .org-card { transition: none !important; transform: none !important; } }

/* Botões de compra: crescem um pouco ao passar o mouse, como os cartões */
.btn { transition: transform .35s cubic-bezier(.2, .7, .2, 1), background-color .25s ease, box-shadow .35s ease; }
@media (hover: hover) {
  .btn:hover { transform: scale(1.05); box-shadow: 0 18px 36px -18px rgba(35, 31, 32, .55); }
}
.btn:active { transform: scale(.98); }
@media (prefers-reduced-motion: reduce) { .btn, .btn:hover { transition: none; transform: none; } }

/* Frase antes de sente/arte no card branco */
.plano-card .plano-pre { font-size: clamp(1.15rem, 1.6vw, 1.4rem); font-weight: 500; line-height: 1.3; margin: 0 0 .4rem; color: var(--ink, #231F20); }

/* "Através do sente/arte" no card branco: tudo numa linha */
.plano-card .method-mark.plano-marca { display: block; position: static; }
.plano-card .plano-atraves { font-weight: inherit; }

/* ===== A história: linha do tempo em cards com foto ===== */
.hist-titulo { margin: 0 0 var(--s8); }
@media (min-width: 960px) { .hist-titulo { white-space: nowrap; } }
.hist-linha { list-style: none; margin: 0; padding: 0 0 0 2.5rem; position: relative; display: grid; gap: var(--s7); }
.hist-linha::before {
  content: ""; position: absolute; left: .55rem; top: 1rem; bottom: 1rem; width: 1px; background: var(--ink);
  transform: scaleY(0); transform-origin: top; transition: transform 2.4s cubic-bezier(.4, 0, .2, 1);
}
.hist-linha.tl-on::before { transform: none; }
.hist-item { position: relative; }
.hist-no { position: absolute; left: -2.5rem; top: 2.2rem; width: 1.15rem; height: 1.15rem; border-radius: 50%; background: var(--terracota); }
.hist-card {
  display: grid; grid-template-columns: 1fr; background: #FFFFFF; border-radius: var(--radius); overflow: hidden;
  box-shadow: 0 40px 80px -40px rgba(35, 31, 32, .38);
  transition: transform .5s cubic-bezier(.2, .7, .2, 1), box-shadow .5s ease;
}
.hist-foto { margin: 0; position: relative; overflow: hidden; aspect-ratio: 4 / 5; background: #E3E4E0; }
.hist-foto picture, .hist-foto img { display: block; width: 100%; height: 100%; }
.hist-foto img { object-fit: cover; object-position: 50% 30%; }
.hist-texto { padding: var(--s6) var(--s5); align-self: center; }
.hist-texto p:last-child { margin-bottom: 0; }
@media (min-width: 760px) {
  .hist-card { grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); }
  .hist-foto { aspect-ratio: auto; min-height: 26rem; }
  .hist-item:nth-child(even) .hist-foto { order: 2; }
  .hist-texto { padding: var(--s7) var(--s7); }
}
/* espaço reservado enquanto a foto não chega */
.hist-foto.sem-foto img { visibility: hidden; }
.hist-foto.sem-foto::after {
  content: "Foto a inserir"; position: absolute; inset: var(--s4); display: grid; place-items: center;
  border: 1px dashed rgba(35, 31, 32, .35); border-radius: calc(var(--radius) * .6);
  font-size: .85rem; letter-spacing: .08em; text-transform: uppercase; color: var(--muted);
}
@media (hover: hover) and (min-width: 960px) {
  .hist-card:hover { transform: scale(1.03); box-shadow: 0 50px 90px -40px rgba(35, 31, 32, .55); position: relative; z-index: 1; }
}
@media (hover: none), (max-width: 959px) { .hist-card { transform: scale(.96); } .hist-card.ativo { transform: none; } }
@media (min-width: 760px) { .hist-item:nth-child(even) .hist-card { grid-template-columns: minmax(0, 7fr) minmax(0, 5fr); } }
/* A história: todos os cards com a mesma altura (a do card mais alto) */
@media (min-width: 760px) {
  .hist-linha { grid-auto-rows: 1fr; }
  .hist-item, .hist-card { height: 100%; }
  .hist-foto { min-height: 0; height: 100%; }
}
/* A história: a crença dela, grande, embaixo da linha do tempo */
.hist-crenca { margin: var(--s9, 6rem) 0 0; max-width: none; }
.hist-crenca { border-top: 0 !important; padding-top: 0 !important; }
.hist-crenca::before { content: none !important; display: none !important; }

/* A história no computador: grade de 3 em cima e 3 embaixo, foto no alto do card */
@media (min-width: 960px) {
  .hist-linha { grid-template-columns: repeat(3, minmax(0, 1fr)); grid-auto-rows: auto; padding-left: 0; gap: var(--s6); }
  .hist-linha::before, .hist-no { display: none; }
  .hist-item, .hist-card { height: 100%; }
  .hist-card, .hist-item:nth-child(even) .hist-card { grid-template-columns: 1fr; grid-template-rows: auto 1fr; }
  .hist-item:nth-child(even) .hist-foto { order: 0; }
  .hist-foto { aspect-ratio: 1 / 1; height: auto; min-height: 0; }
  .hist-texto { align-self: start; padding: var(--s6) var(--s5); }
}
@media (min-width: 960px) { .hist-linha { grid-auto-rows: 1fr; } }
/* A história com 8 cards: 4 em cima e 4 embaixo no computador, 2 por linha no tablet */
@media (min-width: 760px) and (max-width: 1099px) {
  .hist-linha { grid-template-columns: repeat(2, minmax(0, 1fr)); grid-auto-rows: 1fr; padding-left: 0; gap: var(--s6); }
  .hist-linha::before, .hist-no { display: none; }
  .hist-card, .hist-item:nth-child(even) .hist-card { grid-template-columns: 1fr; grid-template-rows: auto 1fr; }
  .hist-item:nth-child(even) .hist-foto { order: 0; }
  .hist-foto { aspect-ratio: 1 / 1; height: auto; min-height: 0; }
  .hist-texto { align-self: start; padding: var(--s6) var(--s5); }
}
@media (min-width: 1100px) {
  .hist-linha { grid-template-columns: repeat(4, minmax(0, 1fr)); gap: var(--s5); }
  .hist-texto { padding: var(--s5) var(--s5) var(--s6); }
}
/* A história: 2 colunas no computador, cards retangulares (foto deitada em cima) */
@media (min-width: 760px) {
  .hist-linha { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; grid-auto-rows: 1fr; padding-left: 0; gap: var(--s6); }
  .hist-linha::before, .hist-no { display: none; }
  .hist-card, .hist-item:nth-child(even) .hist-card { grid-template-columns: 1fr; grid-template-rows: auto 1fr; }
  .hist-item:nth-child(even) .hist-foto { order: 0; }
  .hist-foto { aspect-ratio: 3 / 2; height: auto; min-height: 0; }
  .hist-texto { align-self: start; padding: var(--s6) var(--s6) var(--s7); }
}
@media (min-width: 760px) { .hist-foto { aspect-ratio: 1 / 1 !important; } }

/* Um caminho organizado: obra de fundo atrás de um véu claro */
.org2 { position: relative; isolation: isolate; overflow: hidden; }
.org2 .organized-art { display: block; position: absolute; inset: 0; z-index: -1; }
.org2 .organized-art picture, .org2 .organized-art img { display: block; width: 100%; height: 100%; }
.org2 .organized-art img { object-fit: cover; opacity: var(--organizado-img, 1); }
.org2 .organized-art::after { content: ""; position: absolute; inset: 0; background: linear-gradient(180deg, rgba(241, 238, 235, .9), rgba(241, 238, 235, .78) 50%, rgba(241, 238, 235, .9)); }
.org2 .organized-art[hidden] { display: none !important; }

/* ===== A plataforma: grade de cards com espaço de imagem ===== */
.plat-head { display: grid; gap: var(--s5); margin-bottom: var(--s8); }
.plat-head h2 { margin: 0; }
.plat-head p { margin: 0; max-width: 46rem; }
@media (min-width: 960px) {
  .plat-head { grid-template-columns: minmax(0, 1.1fr) minmax(0, 1fr); align-items: end; gap: var(--s8); }
}
.plat-grade { list-style: none; margin: 0; padding: 0; display: grid; gap: var(--s6); grid-template-columns: 1fr; }
@media (min-width: 760px) { .plat-grade { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (min-width: 1100px) { .plat-grade { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
.plat-card, .bonus-card {
  display: flex; flex-direction: column; background: #FFFFFF; border-radius: var(--radius); overflow: hidden;
  box-shadow: 0 40px 80px -40px rgba(35, 31, 32, .38);
  transition: transform .5s cubic-bezier(.2, .7, .2, 1), box-shadow .5s ease;
}
.plat-foto { margin: 0; position: relative; overflow: hidden; aspect-ratio: 16 / 10; background: #E3E4E0; }
.plat-foto picture, .plat-foto img { display: block; width: 100%; height: 100%; }
.plat-foto img { object-fit: cover; }
.plat-foto.sem-foto img { visibility: hidden; }
.plat-foto.sem-foto::after {
  content: "Imagem a inserir"; position: absolute; inset: var(--s4); display: grid; place-items: center;
  border: 1px dashed rgba(35, 31, 32, .35); border-radius: calc(var(--radius) * .6);
  font-size: .85rem; letter-spacing: .08em; text-transform: uppercase; color: var(--muted);
}
.plat-texto { padding: var(--s6) var(--s5) var(--s7); }
.plat-texto h3, .plat-texto h4 { margin: 0 0 var(--s3); font-family: var(--display); font-size: clamp(1.25rem, 1.05rem + .6vw, 1.55rem); line-height: 1.2; }
.plat-texto .module-sub { margin: 0 0 var(--s4); color: var(--terracota); }
.plat-texto .module-sub strong { color: inherit; }
.plat-texto p:last-child, .plat-texto ul:last-child { margin-bottom: 0; }
.plat-texto .dash-list { margin-top: var(--s4); }
.plat-texto .dash-list li { margin-bottom: var(--s3); }

.plat-bonus { margin-top: var(--s9, 6rem); }
.plat-bonus-head { margin-bottom: var(--s7); max-width: 46rem; }
.plat-bonus-head .bonus-title { margin: 0 0 var(--s4); font-family: var(--display); font-size: calc(clamp(2rem, 1.4rem + 2.4vw, 3.2rem) * var(--titulo-escala, 1)); line-height: 1.05; }
.plat-bonus-head p { margin: 0; }
.plat-bonus-grade { display: grid; gap: var(--s6); grid-template-columns: 1fr; }
@media (min-width: 960px) {
  .plat-bonus-grade { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (hover: hover) and (min-width: 960px) {
  .plat-card:hover, .bonus-card:hover { transform: scale(1.03); box-shadow: 0 50px 90px -40px rgba(35, 31, 32, .55); position: relative; z-index: 1; }
}
@media (hover: none), (max-width: 959px) {
  .plat-card, .bonus-card { transform: scale(.96); }
  .plat-card.ativo, .bonus-card.ativo { transform: none; }
}

/* ===== A plataforma: faixa de slides com imagem de fundo ===== */
.plat-show { position: relative; border-radius: var(--radius); overflow: hidden; background: #2A2627; color: #FFFFFF; isolation: isolate; }
.plat-slides { display: grid; }
.plat-slide {
  grid-area: 1 / 1; position: relative; display: flex; align-items: flex-end;
  min-height: min(82vh, 46rem); padding: var(--s8) var(--s6) 7.5rem;
  opacity: 0; visibility: hidden; transition: opacity 1s ease, visibility 0s linear 1s;
}
.plat-slide.ativo { opacity: 1; visibility: visible; transition: opacity 1s ease, visibility 0s; z-index: 1; }
.plat-fundo { position: absolute; inset: 0; z-index: -1; margin: 0; aspect-ratio: auto !important; background: #3A3536; }
.plat-fundo img { transform: scale(1.08); transition: transform 7s ease-out; }
.plat-slide.ativo .plat-fundo img { transform: scale(1); }
.plat-fundo::before {
  content: ""; position: absolute; inset: 0; z-index: 1;
  background: linear-gradient(90deg, rgba(26, 23, 24, .88) 0%, rgba(26, 23, 24, .62) 45%, rgba(26, 23, 24, .15) 100%),
              linear-gradient(0deg, rgba(26, 23, 24, .7) 0%, rgba(26, 23, 24, 0) 45%);
}
.plat-fundo.sem-foto::after {
  content: "Imagem de fundo a inserir"; inset: auto var(--s5) auto auto; top: var(--s5); padding: .5rem .8rem;
  display: block; z-index: 2; border-color: rgba(255, 255, 255, .45); color: rgba(255, 255, 255, .75); font-size: .72rem;
}
.plat-slide-texto { position: relative; max-width: 38rem; }
.plat-num { display: block; margin-bottom: var(--s4); font-size: .85rem; letter-spacing: .14em; color: rgba(255, 255, 255, .7); }
.plat-slide-texto h3 { margin: 0 0 var(--s3); color: #FFFFFF; font-family: var(--display); font-size: calc(clamp(1.9rem, 1.3rem + 2.2vw, 3rem) * var(--titulo-escala, 1)); line-height: 1.05; }
.plat-slide-texto p, .plat-slide-texto li { color: rgba(255, 255, 255, .88); }
.plat-slide-texto strong { color: #FFFFFF; }
.plat-slide-texto .module-sub { margin: 0 0 var(--s4); font-size: clamp(1.05rem, .95rem + .4vw, 1.25rem); }
.plat-slide-texto .module-sub strong { color: #F0B9A6; }
.plat-slide-texto p:last-child, .plat-slide-texto ul:last-child { margin-bottom: 0; }
.plat-slide-texto .dash-list { margin: var(--s4) 0 0; }
.plat-slide-texto .dash-list li { margin-bottom: var(--s3); }

.plat-nav { position: absolute; left: var(--s6); right: var(--s6); bottom: var(--s6); z-index: 2; display: flex; align-items: center; gap: var(--s5); }
.plat-barras { flex: 1; display: flex; gap: .5rem; }
.plat-barra { flex: 1; height: 1.6rem; padding: 0; border: 0; background: none; cursor: pointer; display: flex; align-items: center; }
.plat-barra span { display: block; width: 100%; height: 3px; border-radius: 3px; background: rgba(255, 255, 255, .3); position: relative; overflow: hidden; }
.plat-barra span::after { content: ""; position: absolute; inset: 0; background: #FFFFFF; transform: scaleX(0); transform-origin: left; }
.plat-barra.feito span::after { transform: scaleX(1); }
.plat-barra.ativo span::after { animation: platEnche var(--plat-tempo, 8.5s) linear forwards; }
.plat-show.parado .plat-barra.ativo span::after { animation-play-state: paused; }
@keyframes platEnche { to { transform: scaleX(1); } }
.plat-setas { display: flex; gap: .5rem; }
.plat-seta { width: 2.75rem; height: 2.75rem; border-radius: 50%; border: 1px solid rgba(255, 255, 255, .6); background: transparent; color: #FFFFFF; display: grid; place-items: center; cursor: pointer; transition: background .25s ease, color .25s ease; }
.plat-seta:hover, .plat-seta:focus-visible { background: #FFFFFF; color: var(--ink); }

@media (min-width: 960px) {
  .plat-slide { padding: var(--s9, 6rem) var(--s8) 8rem; }
  .plat-nav { left: var(--s8); right: var(--s8); bottom: var(--s7); }
}
@media (max-width: 759px) {
  .plat-show { border-radius: calc(var(--radius) * .7); }
  .plat-slide { min-height: 88svh; padding: var(--s7) var(--s5) 7rem; }
  .plat-nav { left: var(--s5); right: var(--s5); bottom: var(--s5); gap: var(--s4); }
  .plat-fundo::before { background: linear-gradient(0deg, rgba(26, 23, 24, .92) 0%, rgba(26, 23, 24, .7) 55%, rgba(26, 23, 24, .35) 100%); }
}
@media (prefers-reduced-motion: reduce) {
  .plat-fundo img { transition: none; transform: none; }
  .plat-slide { transition: none; }
}

/* modo de edição: os seis um embaixo do outro, para editar o texto de todos */
.plat-show.editando .plat-slides { display: block; }
.plat-show.editando .plat-slide { opacity: 1; visibility: visible; min-height: 32rem; border-bottom: 1px solid rgba(255, 255, 255, .2); }
.plat-show.editando .plat-nav { display: none; }
.plat-show.editando .plat-slides { display: grid; }

/* ===== Depoimentos: 4 colunas, print do WhatsApp no alto, sem caixa ===== */
.quotes4 { display: grid; gap: var(--s7) var(--s6); grid-template-columns: 1fr; }
@media (min-width: 640px) { .quotes4 { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (min-width: 1100px) { .quotes4 { grid-template-columns: repeat(4, minmax(0, 1fr)); gap: var(--s6); } }
.quotes4 .quote { background: transparent !important; border: 0; padding: 0; border-radius: 0; }
.dep-print {
  position: relative; margin: 0 0 var(--s5); aspect-ratio: 9 / 16; border-radius: calc(var(--radius) * .8); overflow: hidden;
  background: #E3E4E0; box-shadow: 0 30px 60px -32px rgba(35, 31, 32, .45);
  transition: transform .5s cubic-bezier(.2, .7, .2, 1), box-shadow .5s ease;
}
.dep-print picture, .dep-print img { display: block; width: 100%; height: 100%; }
.dep-print img { object-fit: cover; object-position: 50% 0; }
.dep-print.sem-foto img { visibility: hidden; }
.dep-print.sem-foto::after {
  content: "Print do WhatsApp a inserir"; position: absolute; inset: var(--s4); display: grid; place-items: center; text-align: center; padding: var(--s4);
  border: 1px dashed rgba(35, 31, 32, .35); border-radius: calc(var(--radius) * .5);
  font-size: .8rem; letter-spacing: .08em; text-transform: uppercase; color: var(--muted);
}
.quotes4 .quote h3 { font-size: 1.15rem; line-height: 1.3; margin-bottom: var(--s3); }
.quotes4 .quote blockquote p { font-size: 1rem; }
@media (hover: hover) and (min-width: 960px) {
  .dep-print:hover { transform: scale(1.03); box-shadow: 0 40px 80px -36px rgba(35, 31, 32, .6); }
}
@media (max-width: 639px) { .dep-print { max-width: 22rem; } }
.dep-print { background: #F1EEEB; }
/* Depoimentos: texto escuro em todas as colunas, colunas alinhadas, print quadrado */
.quotes4 .quote, .quotes4 .quote h3, .quotes4 .quote blockquote p, .quotes4 .quote figcaption, .quotes4 .quote figcaption strong { color: var(--ink) !important; }
.quotes4 .quote figcaption { border-top-color: var(--rule) !important; }
.quotes4 .quote { transform: none !important; }
.quotes4 { padding-bottom: 0 !important; }
.dep-print { aspect-ratio: 1 / 1; }
@media (max-width: 639px) { .dep-print { max-width: none; } }
/* Depoimentos: print inteiro, sem corte; a sobra fica no tom do fundo do WhatsApp */
.dep-print { aspect-ratio: 5 / 7 !important; background: #ECE6DD; }
.dep-print img { object-fit: contain !important; object-position: 50% 50%; }

/* ===== Botão flutuante do WhatsApp (suporte) ===== */
.wa-flutuante {
  position: fixed; right: 20px; bottom: 20px; z-index: 60;
  width: 58px; height: 58px; border-radius: 50%; display: grid; place-items: center;
  background: #25D366; color: #FFFFFF; box-shadow: 0 14px 30px -10px rgba(35, 31, 32, .5);
  transition: transform .3s cubic-bezier(.2, .7, .2, 1), box-shadow .3s ease;
}
.wa-flutuante[hidden] { display: none; }
.wa-flutuante:hover, .wa-flutuante:focus-visible { transform: scale(1.08); box-shadow: 0 18px 36px -10px rgba(35, 31, 32, .6); }
.wa-flutuante:focus-visible { outline: 3px solid var(--terracota); outline-offset: 3px; }
.wa-dica {
  position: absolute; right: calc(100% + 10px); top: 50%; transform: translateY(-50%);
  padding: .35rem .7rem; border-radius: 999px; background: var(--ink); color: #FFFFFF;
  font-size: .8rem; white-space: nowrap; opacity: 0; pointer-events: none; transition: opacity .25s ease;
}
.wa-flutuante:hover .wa-dica, .wa-flutuante:focus-visible .wa-dica { opacity: 1; }
.wa-flutuante.wa-pendente { opacity: .55; cursor: help; }
@media (max-width: 899px) { .wa-flutuante { right: 16px; bottom: calc(92px + env(safe-area-inset-bottom)); width: 52px; height: 52px; } }
@media print { .wa-flutuante { display: none; } }
/* nomes dos depoimentos na mesma linha, mesmo quando a profissão quebra em duas */
@media (min-width: 1100px) { .quotes4 .quote figcaption { min-height: calc(2 * 1.5em + var(--s4)); box-sizing: content-box; } }

/* Oferta: parcela em destaque, "no cartão de crédito" menor, à vista logo abaixo */
.offer-card .preco { margin-top: var(--s6); }
.offer-card .preco .price-main { margin: 0; line-height: 1; }
.offer-card .preco-parcela { display: block; font-size: clamp(2.4rem, 1.6rem + 3vw, 3.8rem); font-weight: 700; letter-spacing: -.02em; }
.offer-card .preco-cartao { display: block; margin-top: .35rem; font-family: var(--body, inherit); font-size: 1.05rem; font-weight: 500; letter-spacing: 0; }
.offer-card .preco .price-alt { margin: var(--s3) 0 0; font-size: 1.15rem; }
.offer-card .preco .price-main { letter-spacing: 0 !important; word-spacing: normal; }
.offer-card .preco-parcela { white-space: nowrap; font-size: clamp(2rem, 1.5rem + 1.6vw, 3rem); letter-spacing: -.01em; word-spacing: .08em; }
.offer-card .preco-cartao { letter-spacing: .01em; word-spacing: .05em; }
.offer-card .preco-de { margin: 0 0 .5rem; font-size: 1.05rem; color: var(--muted); }
.offer-card .preco-de s { text-decoration-thickness: 1.5px; }

/* Botão de pausa do carrossel da plataforma */
.plat-pausa .ic-play { display: none; }
.plat-pausa.pausado .ic-pausa { display: none; }
.plat-pausa.pausado .ic-play { display: block; }