/* ============================================================
   TRIAA — one-page institucional
   Paleta extraída do manual da marca (01 LOGOS/47.png)
   ============================================================ */

/* Sistema tipográfico da marca (confirmado pela cliente):
   Títulos — Mansory (Larin Type Co., comercial) · Texto — Montserrat
   Quicksand — arredondada p/ frases-statement (padrão dos posts)

   Julius Sans One fica na pilha como fallback (cobre glifos que faltarem na Mansory). */
@font-face {
  font-family: 'Mansory';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url('../fonts/mansory.woff2') format('woff2');
}
@font-face {
  font-family: 'Julius Sans One';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url('../fonts/julius-latin.woff2') format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

@font-face {
  font-family: 'Montserrat';
  font-style: normal;
  font-weight: 100 900;
  font-display: swap;
  src: url('../fonts/montserrat-var-latin.woff2') format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

@font-face {
  font-family: 'Quicksand';
  font-style: normal;
  font-weight: 300 700;
  font-display: swap;
  src: url('../fonts/quicksand-var-latin.woff2') format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

:root {
  --navy: #172C61;
  --navy-deep: #0B152E;
  --caramelo: #A3683C;
  --caramelo-claro: #C08956;
  --caramelo-texto: #8A5530; /* AA sobre off-white */
  --azul-suave: #7E9AD6;
  --greige: #D2CCC0;
  --offwhite: #EEEAE2;
  --branco-quente: #F7F5F0;
  --tinta: #1C2333;
  --tinta-suave: #4A5266;
  --cream: #E9E5DC;

  --fonte: 'Montserrat', system-ui, -apple-system, 'Segoe UI', Helvetica, Arial, sans-serif;
  --fonte-display: 'Mansory', 'Julius Sans One', 'Trajan Pro', Georgia, serif;
  --fonte-frase: 'Quicksand', 'Trebuchet MS', system-ui, sans-serif;
  --container: 1160px;
  --raio: 6px;
  --transicao: 240ms ease;
}

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

/* garante que [hidden] vença qualquer display definido em classe (ex.: banner de cookies, chips do chat) */
[hidden] { display: none !important; }

html { scroll-behavior: smooth; }

body {
  margin: 0;
  font-family: var(--fonte);
  font-size: 1.0625rem;
  line-height: 1.65;
  color: var(--tinta);
  background: var(--offwhite);
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
}

img { max-width: 100%; height: auto; display: block; }

h1, h2, h3 { line-height: 1.2; margin: 0 0 0.6em; font-weight: 600; letter-spacing: -0.01em; }
p { margin: 0 0 1em; }
a { color: var(--navy); }

.visually-hidden {
  position: absolute; width: 1px; height: 1px;
  margin: -1px; padding: 0; overflow: hidden;
  clip: rect(0 0 0 0); white-space: nowrap; border: 0;
}

.skip-link {
  position: absolute; left: -9999px; top: 0;
  background: var(--caramelo); color: #fff;
  padding: 0.6rem 1rem; z-index: 100; border-radius: 0 0 var(--raio) 0;
}
.skip-link:focus { left: 0; }

.container { max-width: var(--container); margin: 0 auto; padding: 0 clamp(1.25rem, 4vw, 2.5rem); }
.container--narrow { max-width: 860px; }

/* ---------- Botões ---------- */
.btn {
  display: inline-block;
  font-family: var(--fonte);
  font-size: 0.95rem;
  font-weight: 600;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  text-decoration: none;
  text-align: center;
  padding: 0.95rem 1.9rem;
  border-radius: var(--raio);
  border: 1px solid transparent;
  cursor: pointer;
  transition: transform var(--transicao), box-shadow var(--transicao), background var(--transicao), color var(--transicao);
}
.btn:hover { transform: translateY(-2px); }
.btn:focus-visible { outline: 3px solid var(--azul-suave); outline-offset: 3px; }

.btn--primary {
  background: linear-gradient(135deg, var(--caramelo-claro) 0%, var(--caramelo) 55%, #8A5530 100%);
  color: #fff;
  box-shadow: 0 6px 18px rgba(163, 104, 60, 0.35);
}
.btn--primary:hover { box-shadow: 0 10px 24px rgba(163, 104, 60, 0.45); }

.btn--ghost {
  background: transparent;
  color: var(--cream);
  border-color: rgba(233, 229, 220, 0.55);
}
.btn--ghost:hover { background: rgba(233, 229, 220, 0.1); }

.btn--outline-light {
  background: transparent;
  color: var(--cream);
  border-color: rgba(233, 229, 220, 0.55);
}
.btn--outline-light:hover { background: rgba(233, 229, 220, 0.12); }

.btn--navy {
  background: var(--navy);
  color: #fff;
}
.btn--navy:hover { background: var(--navy-deep); }

/* ---------- Menu fixo ---------- */
.topbar {
  position: fixed;
  top: 0; left: 0; right: 0;
  z-index: 50;
  background: transparent;
  transition: background var(--transicao), box-shadow var(--transicao);
}
.topbar.is-solid {
  background: rgba(11, 21, 46, 0.96);
  box-shadow: 0 2px 20px rgba(0, 0, 0, 0.25);
}
.topbar__inner {
  max-width: var(--container);
  margin: 0 auto;
  padding: 0.9rem clamp(1.25rem, 4vw, 2.5rem);
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
}
.topbar__logo img { width: 118px; height: auto; }
.topbar__nav {
  display: flex;
  align-items: center;
  gap: clamp(1rem, 2.4vw, 2rem);
}
.topbar__nav a {
  color: var(--cream);
  text-decoration: none;
  font-size: 0.92rem;
  font-weight: 500;
  letter-spacing: 0.05em;
  text-transform: uppercase;
  padding: 0.3rem 0;
  border-bottom: 2px solid transparent;
  transition: border-color var(--transicao), color var(--transicao);
}
.topbar__nav a:hover { border-bottom-color: var(--caramelo-claro); }
.topbar__nav a:focus-visible { outline: 3px solid var(--azul-suave); outline-offset: 3px; }
.topbar__cta {
  border: 1px solid var(--caramelo-claro) !important;
  border-radius: var(--raio);
  padding: 0.5rem 1.1rem !important;
  color: #fff !important;
  background: linear-gradient(135deg, var(--caramelo-claro), var(--caramelo));
}
.topbar__cta:hover { border-bottom-color: transparent !important; filter: brightness(1.08); }

.topbar__toggle {
  display: none;
  flex-direction: column;
  gap: 5px;
  background: none;
  border: 0;
  padding: 0.5rem;
  cursor: pointer;
}
.topbar__toggle span {
  width: 26px; height: 2px;
  background: var(--cream);
  transition: transform var(--transicao), opacity var(--transicao);
}

/* ---------- Seções base ---------- */
.section { padding: clamp(4rem, 9vw, 7rem) 0; position: relative; }
.section--light { background: var(--offwhite); }
.section--greige { background: var(--greige); }
.section--navy { background: var(--navy); color: var(--cream); overflow: hidden; }
.section--dark { background: var(--navy-deep); color: var(--cream); overflow: hidden; }

/* Abertura de seção: rótulo pequeno e espaçado — quem chama atenção é a frase (.section__title) */
.kicker {
  font-family: var(--fonte-display);
  font-size: clamp(0.95rem, 1.4vw, 1.1rem);
  font-weight: 400;
  line-height: 1.15;
  letter-spacing: 0.32em;
  text-transform: uppercase;
  color: var(--navy);
  margin-bottom: 1.1rem;
}
.kicker--onDark, .kicker--caramelo { color: var(--branco-quente); }

/* Frase principal da seção: agora é ela que domina o cabeçalho */
.section__title {
  font-size: clamp(1.35rem, 2.4vw, 1.9rem);
  font-weight: 480;
  line-height: 1.45;
  letter-spacing: 0.01em;
  max-width: 40em;
  color: var(--tinta);
}
.section__title--onDark { color: rgba(233, 229, 220, 0.92); }
.section__title em {
  font-style: normal;
  font-weight: 680;
  color: var(--caramelo-texto);
}
.section__title--onDark em { color: #CE9660; }
.section--greige .section__title em { color: #74441F; }
.section__title--compact { margin-bottom: 0; }

.section__lead {
  max-width: 46em;
  font-size: clamp(1.05rem, 1.6vw, 1.18rem);
  color: var(--tinta-suave);
}
.section__lead--onDark { color: rgba(233, 229, 220, 0.85); }

/* Seções de coluna única: cabeçalho e elementos centralizados */
.section--centrado .kicker,
.section--centrado .section__title,
.section--centrado .section__lead,
.section--centrado .metodo__close,
.section--centrado .acelerador__subtitulo {
  margin-left: auto;
  margin-right: auto;
  text-align: center;
}
.section--centrado .acelerador__cta-wrap,
.section--centrado .diagnostico__cta-wrap,
.section--centrado .painel-wrap { text-align: center; }
.section--centrado .conteudo__video { margin-left: auto; margin-right: auto; }
.section--centrado .conteudo__acoes { justify-content: center; }
.section--centrado .numeros { text-align: center; }
.section--centrado .form { text-align: left; }

/* ---------- Hero ---------- */
.hero {
  position: relative;
  min-height: 100svh;
  display: flex;
  align-items: center;
  background: var(--navy-deep);
  overflow: hidden;
}
.hero__media {
  position: absolute;
  inset: 0;
}
.hero__media img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: 100% 30%;
}
/* Scrim leve: a foto do trio (à direita) fica visível; escurece só a faixa do texto (esquerda) e a base */
.hero__scrim {
  position: absolute;
  inset: 0;
  background:
    linear-gradient(90deg, rgba(11, 21, 46, 0.8) 0%, rgba(11, 21, 46, 0.45) 38%, rgba(11, 21, 46, 0) 60%),
    linear-gradient(0deg, rgba(11, 21, 46, 0.5) 0%, rgba(11, 21, 46, 0) 35%);
}
.hero__inner {
  position: relative;
  z-index: 1;
  max-width: var(--container);
  margin: 0 auto;
  padding: 7.5rem clamp(1.25rem, 4vw, 2.5rem) 4.5rem;
  width: 100%;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  text-align: left;
  text-shadow: 0 1px 16px rgba(11, 21, 46, 0.55);
}
/* Hero: mescla tipográfica no estilo dos posts — serifada caps grande,
   linha de apoio pequena em sans espaçada e fecho na arredondada.
   Desktop: bloco de texto à esquerda, sobre a madeira estendida — o trio fica em evidência à direita */
.hero__title {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  margin-bottom: 1.6rem;
}
@media (min-width: 760px) {
  .hero__serif { white-space: nowrap; }
}
.hero__serif {
  font-family: var(--fonte-display);
  font-size: clamp(1.35rem, 2.1vw, 1.8rem);
  font-weight: 400;
  line-height: 1.25;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: var(--branco-quente);
}
.hero__serif em {
  font-style: normal;
  font-weight: 400;
  color: var(--caramelo-claro);
}
.hero__meio {
  font-size: clamp(0.95rem, 1.5vw, 1.2rem);
  font-weight: 500;
  letter-spacing: 0.3em;
  text-transform: uppercase;
  color: rgba(233, 229, 220, 0.78);
  margin: 0.45em 0 0.55em 0.1em;
}
/* fecho no mesmo estilo da linha de apoio: só dois estilos no hero (Mansory + Montserrat) */
.hero__fecho {
  font-size: clamp(0.95rem, 1.5vw, 1.2rem);
  font-weight: 500;
  letter-spacing: 0.3em;
  text-transform: uppercase;
  color: rgba(233, 229, 220, 0.88);
  margin-top: 0.8em;
}
.hero__lead {
  max-width: 30em;
  font-size: clamp(0.92rem, 1.3vw, 1.02rem);
  color: rgba(233, 229, 220, 0.88);
  margin-bottom: 2.2rem;
}
.hero__actions { display: flex; flex-wrap: wrap; gap: 1rem; justify-content: flex-start; max-width: 30em; }

/* ---------- O sintoma ---------- */
.sintoma__dores {
  list-style: none;
  margin: 0;
  padding: 0;
}
.sintoma__dores li {
  display: flex;
  align-items: flex-start;
  gap: 0.85rem;
  padding: 0.7rem 0;
  color: var(--tinta-suave);
  font-size: 0.98rem;
  line-height: 1.55;
}
.sintoma__dores li + li { border-top: 1px solid rgba(23, 44, 97, 0.06); }
.sintoma__dor-icone {
  flex-shrink: 0;
  display: grid;
  place-items: center;
  width: 34px;
  height: 34px;
  margin-top: 0.1rem;
  border-radius: 50%;
  background: rgba(23, 44, 97, 0.06);
  color: var(--navy);
}
/* variante das dores sobre fundo navy (blocos do Para quem é) */
.sintoma__dores--onDark li { color: rgba(233, 229, 220, 0.85); }
.sintoma__dores--onDark li + li { border-top-color: rgba(233, 229, 220, 0.12); }
.sintoma__dores--onDark .sintoma__dor-icone { background: rgba(233, 229, 220, 0.1); color: var(--cream); }
.paraquem .sintoma__dores { margin-bottom: 1.8rem; }
/* Faixa de fechamento com foto de fundo (recorte horizontal) e a frase por cima */
.paraquem { padding-bottom: 0; }
.sintoma__close-band {
  position: relative;
  margin-top: clamp(2.6rem, 6vw, 4rem);
  padding: clamp(3.5rem, 8vw, 6rem) clamp(1.25rem, 4vw, 2.5rem);
  background: url('../img/sintoma-close-1600.webp') center 60% / cover no-repeat;
}
@media (min-width: 1600px) {
  .sintoma__close-band { background-image: url('../img/sintoma-close-2362.webp'); }
}
@media (max-width: 700px) {
  .sintoma__close-band { background-image: url('../img/sintoma-close-800.webp'); }
}
.sintoma__close-band::before {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(180deg, rgba(11, 21, 46, 0.6) 0%, rgba(11, 21, 46, 0.68) 100%);
}
.sintoma__close {
  position: relative;
  margin-left: auto;
  margin-right: auto;
  text-align: center;
  font-family: var(--fonte-frase);
  font-size: clamp(1.3rem, 2.4vw, 1.8rem);
  font-weight: 400;
  line-height: 1.4;
  color: var(--cream);
  max-width: 30em;
  text-shadow: 0 1px 14px rgba(11, 21, 46, 0.5);
}
.sintoma__close em { font-style: normal; font-weight: 700; color: var(--caramelo-claro); }

/* ---------- Sobre / números ---------- */
.sobre { position: relative; }
.sobre__marca, .paraquem__marca {
  position: absolute;
  right: -8%;
  top: 50%;
  transform: translateY(-50%);
  width: min(52vw, 640px);
  aspect-ratio: 44 / 38;
  background: url('../img/simbolo-cream.svg') no-repeat center / contain;
  opacity: 0.05;
  pointer-events: none;
}
.numeros {
  display: grid;
  grid-template-columns: repeat(6, 1fr);
  gap: 1.5rem;
  margin: clamp(2.5rem, 5vw, 4rem) 0 0;
  padding-top: clamp(2rem, 4vw, 3rem);
  border-top: 1px solid rgba(233, 229, 220, 0.25);
}
.numeros__item dt { margin: 0; }
.numeros__item dd { margin: 0.3rem 0 0; font-size: 0.95rem; color: rgba(233, 229, 220, 0.75); }
.numeros__valor {
  font-size: clamp(2rem, 4vw, 3rem);
  font-weight: 680;
  color: var(--branco-quente);
  letter-spacing: -0.02em;
  font-variant-numeric: tabular-nums;
}

/* ---------- Núcleos ---------- */
.nucleos__grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: clamp(1.5rem, 3.5vw, 2.8rem);
  margin-top: clamp(2rem, 5vw, 3.5rem);
}
.nucleo__foto {
  margin: 0 0 1.3rem;
  aspect-ratio: 3 / 3.6;
  overflow: hidden;
  border-radius: var(--raio);
}
.nucleo__foto img {
  width: 100%; height: 100%;
  object-fit: cover;
  object-position: center 18%;
  transition: transform 600ms ease;
}
.nucleo:hover .nucleo__foto img { transform: scale(1.03); }
.nucleo__nome {
  font-family: var(--fonte-display);
  font-size: 1.4rem;
  font-weight: 400;
  letter-spacing: 0.07em;
  text-transform: uppercase;
  margin-bottom: 0.15em;
  color: var(--navy);
}
.nucleo__cargo {
  font-size: 0.82rem;
  font-weight: 650;
  letter-spacing: 0.24em;
  text-transform: uppercase;
  color: var(--caramelo-texto);
  margin-bottom: 0.9rem;
}
.nucleo > p:last-child { color: var(--tinta-suave); }

/* ---------- Método ---------- */
.metodo__lista {
  list-style: none;
  margin: clamp(2.5rem, 5vw, 4rem) 0 0;
  padding: 0;
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(210px, 1fr));
  gap: 1.2rem;
}
@media (min-width: 1100px) {
  .metodo__lista { grid-template-columns: repeat(5, 1fr); }
  .metodo__etapa { min-height: 280px; }
}
.metodo__etapa {
  position: relative;
  background: var(--greige);
  color: var(--tinta);
  border-radius: var(--raio);
  padding: 1.6rem 1.4rem 4.5rem;
  overflow: hidden;
  min-height: 240px;
}
.metodo__etapa h3 {
  font-family: var(--fonte-display);
  font-size: 1.05rem;
  font-weight: 400;
  letter-spacing: 0.07em;
  text-transform: uppercase;
  color: var(--navy);
  position: relative;
  z-index: 1;
}
.metodo__etapa p { font-size: 0.97rem; color: var(--tinta-suave); position: relative; z-index: 1; margin: 0; }
.metodo__num {
  position: absolute;
  right: -0.08em;
  bottom: -0.34em;
  font-size: 7rem;
  font-weight: 700;
  letter-spacing: -0.04em;
  line-height: 1;
  color: rgba(23, 44, 97, 0.12);
  user-select: none;
}
.metodo__num::before { content: attr(data-num); }
.metodo__close {
  margin-top: clamp(2.2rem, 4.5vw, 3.2rem);
  font-family: var(--fonte-frase);
  font-size: clamp(1.2rem, 2vw, 1.55rem);
  font-weight: 400;
  line-height: 1.45;
  color: rgba(233, 229, 220, 0.9);
  max-width: 34em;
}

/* ---------- Acelerador ---------- */
.acelerador__subtitulo {
  margin-top: clamp(2.4rem, 5vw, 3.6rem);
  font-family: var(--fonte-display);
  font-size: 1.3rem;
  font-weight: 400;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--navy);
}
.formatos {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
  gap: 1.2rem;
  margin-top: 1.4rem;
}
.formato {
  background: var(--branco-quente);
  border: 1px solid rgba(23, 44, 97, 0.08);
  border-radius: var(--raio);
  padding: 1.5rem 1.4rem;
}
.formato h3 {
  font-family: var(--fonte-display);
  font-size: 1.1rem;
  font-weight: 400;
  color: var(--caramelo-texto);
  letter-spacing: 0.12em;
  text-transform: uppercase;
}
/* barra "/" da identidade TRIAA antes de cada formato */
.formato h3::before { content: "/ "; color: var(--navy); }
.formato p { font-size: 0.97rem; color: var(--tinta-suave); margin: 0; }

.acelerador__cta-wrap { margin-top: 2.4rem; }

/* ---------- Painéis expansíveis ---------- */
.painel-wrap { margin-top: 2.2rem; }
.painel-toggle {
  display: inline-flex;
  align-items: center;
  gap: 0.6rem;
  background: none;
  border: 0;
  font-family: var(--fonte);
  font-size: 1rem;
  font-weight: 600;
  color: var(--navy);
  cursor: pointer;
  padding: 0.4rem 0;
  border-bottom: 2px solid var(--caramelo);
}
.painel-toggle:focus-visible { outline: 3px solid var(--azul-suave); outline-offset: 3px; }
.painel-toggle__icone {
  width: 10px; height: 10px;
  border-right: 2px solid var(--caramelo);
  border-bottom: 2px solid var(--caramelo);
  transform: rotate(45deg) translateY(-2px);
  transition: transform var(--transicao);
}
.painel-toggle[aria-expanded="true"] .painel-toggle__icone { transform: rotate(225deg) translateY(-2px); }

.painel { margin-top: 1.6rem; scroll-margin-top: 92px; }
.paraquem .painel { margin-top: clamp(1.8rem, 4vw, 2.8rem); }
.painel__inner {
  background: var(--branco-quente);
  border: 1px solid rgba(23, 44, 97, 0.08);
  border-radius: var(--raio);
  padding: clamp(1.6rem, 4vw, 2.8rem);
}
.painel--onDark .painel__inner {
  background: rgba(11, 21, 46, 0.35);
  border-color: rgba(233, 229, 220, 0.14);
}
.painel__titulo {
  font-family: var(--fonte-display);
  font-size: 1.35rem;
  font-weight: 400;
  letter-spacing: 0.09em;
  text-transform: uppercase;
  color: var(--navy);
}
.painel__titulo--onDark { color: var(--branco-quente); }
.painel__lead { color: var(--tinta-suave); max-width: 52em; }
.painel__lead--onDark { color: rgba(233, 229, 220, 0.82); }
.painel__lead--mt { margin-top: 2rem; }
.painel__grid {
  display: grid;
  gap: 1.1rem;
  margin-top: 1.4rem;
}
.painel__grid--2 { grid-template-columns: repeat(auto-fit, minmax(280px, 1fr)); }
.card {
  background: var(--offwhite);
  border-radius: var(--raio);
  padding: 1.4rem 1.3rem;
  border: 1px solid rgba(23, 44, 97, 0.07);
}
.painel--onDark .card {
  background: rgba(233, 229, 220, 0.94);
}
.card h3 { font-size: 1.02rem; color: var(--navy); }
.card p { font-size: 0.95rem; color: var(--tinta-suave); margin: 0; }
.painel__figure {
  margin: 1.6rem 0 0;
  max-height: 420px;
  overflow: hidden;
  border-radius: var(--raio);
}
.painel__figure { aspect-ratio: 16 / 8; max-height: 460px; }
.painel__figure img { width: 100%; height: 100%; object-fit: cover; object-position: center 58%; }
.painel__cta { margin-top: 1.8rem; }

/* ---------- Para quem é ---------- */
/* blocos empilhados (foto ao lado do texto, alternando) — evita a desproporção entre os dois textos */
.paraquem__grid {
  display: grid;
  grid-template-columns: 1fr;
  gap: clamp(2.4rem, 5vw, 4rem);
  margin-top: clamp(2.2rem, 5vw, 3.4rem);
}
.paraquem__bloco {
  display: grid;
  grid-template-columns: 1fr 1.15fr;
  gap: clamp(1.6rem, 3.5vw, 3rem);
  align-items: stretch;
}
.paraquem__bloco:nth-child(even) .paraquem__figura { order: 2; }
/* desktop: a foto (corte retrato) acompanha a altura do texto; mobile volta ao formato paisagem */
.paraquem__figura {
  margin: 0;
  overflow: hidden;
  border-radius: var(--raio);
  min-height: 480px;
}
.paraquem__figura picture {
  display: block;
  height: 100%;
}
.paraquem__figura img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform 600ms ease;
}
.paraquem__bloco .paraquem__rotulo {
  font-family: var(--fonte-display);
  font-size: 0.85rem;
  font-weight: 400;
  letter-spacing: 0.24em;
  text-transform: uppercase;
  color: var(--caramelo-claro);
  margin-bottom: 0.5rem;
}
.paraquem__bloco:hover .paraquem__figura img { transform: scale(1.03); }
.paraquem__bloco h3 {
  font-family: var(--fonte-display);
  font-size: clamp(1.3rem, 2vw, 1.6rem);
  font-weight: 400;
  letter-spacing: 0.09em;
  text-transform: uppercase;
  color: var(--branco-quente);
}
.paraquem__bloco p { color: rgba(233, 229, 220, 0.85); margin-bottom: 1.6rem; }

/* ---------- Diferencial: lista ---------- */
.diferencial__lista {
  list-style: none;
  margin: clamp(1.6rem, 3.5vw, 2.4rem) 0 0;
  padding: 0;
  max-width: 780px;
}
.diferencial__lista li {
  position: relative;
  padding: 1.1rem 0 1.1rem 2.2rem;
  border-bottom: 1px solid rgba(23, 44, 97, 0.1);
  font-size: 1rem;
  color: var(--tinta);
}
.diferencial__lista li::before {
  content: '';
  position: absolute;
  left: 0;
  top: 1.55rem;
  width: 12px; height: 12px;
  background: url('../img/simbolo-caramelo.svg') no-repeat center / contain;
}

/* ---------- Conteúdo: podcast e YouTube ---------- */
.conteudo__video {
  max-width: 1040px;
  margin-top: clamp(2rem, 4.5vw, 3rem);
}
/* Grid dos 3 últimos episódios */
.conteudo__epis {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: clamp(1rem, 2.5vw, 1.6rem);
  margin-bottom: clamp(1.8rem, 4vw, 2.6rem);
}
.epi .video-facade__play { width: 54px; height: 54px; }
.epi .video-facade__play::after { border-width: 9px 0 9px 15px; }
.epi .video-facade__rotulo { left: 0.7rem; bottom: 0.7rem; font-size: 0.72rem; padding: 0.35rem 0.65rem; }
.epi__titulo {
  margin-top: 0.85rem;
  font-family: var(--fonte);
  font-size: 0.95rem;
  font-weight: 600;
  line-height: 1.45;
  color: rgba(233, 229, 220, 0.92);
}
.epi iframe {
  width: 100%;
  aspect-ratio: 16 / 9;
  border: 0;
  border-radius: var(--raio);
  display: block;
}
@media (max-width: 760px) {
  .conteudo__epis { grid-template-columns: 1fr; max-width: 480px; margin-left: auto; margin-right: auto; }
}
.btn--icone {
  display: inline-flex;
  align-items: center;
  gap: 0.6rem;
}
.btn--icone svg { flex-shrink: 0; }
.video-facade {
  position: relative;
  display: block;
  width: 100%;
  padding: 0;
  border: 0;
  border-radius: var(--raio);
  overflow: hidden;
  cursor: pointer;
  aspect-ratio: 16 / 9;
  background: var(--navy);
}
.video-facade img {
  width: 100%; height: 100%;
  object-fit: cover;
  transition: transform 500ms ease, opacity 300ms ease;
  opacity: 0.92;
}
.video-facade:hover img { transform: scale(1.02); opacity: 1; }
.video-facade:focus-visible { outline: 3px solid var(--azul-suave); outline-offset: 3px; }
.video-facade__play {
  position: absolute;
  left: 50%; top: 50%;
  transform: translate(-50%, -50%);
  width: 78px; height: 78px;
  border-radius: 50%;
  background: linear-gradient(135deg, var(--caramelo-claro), var(--caramelo));
  box-shadow: 0 8px 30px rgba(0, 0, 0, 0.45);
  transition: transform var(--transicao);
}
.video-facade__play::after {
  content: '';
  position: absolute;
  left: 55%; top: 50%;
  transform: translate(-50%, -50%);
  border-style: solid;
  border-width: 13px 0 13px 22px;
  border-color: transparent transparent transparent #fff;
}
.video-facade:hover .video-facade__play { transform: translate(-50%, -50%) scale(1.07); }
.video-facade__rotulo {
  position: absolute;
  left: 1rem; bottom: 1rem;
  background: rgba(11, 21, 46, 0.82);
  color: var(--cream);
  font-size: 0.82rem;
  font-weight: 600;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  padding: 0.45rem 0.85rem;
  border-radius: var(--raio);
}
.conteudo__video iframe {
  width: 100%;
  aspect-ratio: 16 / 9;
  border: 0;
  border-radius: var(--raio);
  display: block;
}
.conteudo__acoes {
  display: flex;
  flex-wrap: wrap;
  gap: 0.9rem;
  margin-top: 1.3rem;
}
.conteudo__spotify noscript { display: block; padding: 1.4rem; }
.conteudo__spotify noscript a { color: var(--cream); }

/* ---------- Diferencial: texto à esquerda + mosaico de eventos (layout herdado da antiga Agenda) ---------- */
.section--greige .kicker { color: var(--navy); }
.diferencial__grid {
  display: grid;
  grid-template-columns: 1fr 1.15fr;
  gap: clamp(1.8rem, 4vw, 3.2rem);
  align-items: center;
}
.diferencial .section__title { max-width: 15em; }
.diferencial__mosaico {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 0.9rem;
}
.diferencial__foto {
  width: 100%;
  height: 100%;
  object-fit: cover;
  border-radius: var(--raio);
  aspect-ratio: 3 / 3.4;
}
.diferencial__foto--larga {
  grid-column: span 2;
  aspect-ratio: 16 / 7.5;
  object-position: center 30%;
}

/* ---------- Diagnóstico: raio-x em formato de conversa ---------- */
.chat {
  max-width: 680px;
  margin: clamp(2rem, 4.5vw, 3rem) auto 0;
  text-align: left;
  background: linear-gradient(180deg, rgba(11, 21, 46, 0.72), rgba(11, 21, 46, 0.5));
  border: 1px solid rgba(233, 229, 220, 0.16);
  border-radius: calc(var(--raio) + 6px);
  overflow: hidden;
  box-shadow: 0 24px 60px rgba(0, 0, 0, 0.35);
}
.chat__topo {
  display: flex;
  align-items: center;
  gap: 0.85rem;
  padding: 0.95rem 1.4rem;
  background: rgba(11, 21, 46, 0.6);
  border-bottom: 1px solid rgba(233, 229, 220, 0.12);
}
.chat__avatar {
  flex-shrink: 0;
  display: grid;
  place-items: center;
  width: 30px;
  height: 30px;
  border-radius: 50%;
  background: linear-gradient(135deg, var(--caramelo-claro), var(--caramelo));
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.3);
}
.chat__avatar--topo { width: 42px; height: 42px; }
.chat__topo-nome { display: flex; flex-direction: column; line-height: 1.3; }
.chat__topo-nome strong {
  font-family: var(--fonte-display);
  font-weight: 400;
  font-size: 1.02rem;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--branco-quente);
}
.chat__topo-nome span { font-size: 0.78rem; color: rgba(233, 229, 220, 0.6); }
.chat__linha {
  display: flex;
  align-items: flex-end;
  gap: 0.6rem;
  max-width: 92%;
}
.chat__progresso {
  height: 3px;
  background: rgba(233, 229, 220, 0.12);
}
.chat__progresso span {
  display: block;
  height: 100%;
  width: 0;
  background: linear-gradient(90deg, var(--caramelo-claro), var(--caramelo));
  transition: width 400ms ease;
}
.chat__janela {
  min-height: 320px;
  max-height: min(56svh, 480px);
  overflow-y: auto;
  padding: 1.5rem 1.4rem;
  display: flex;
  flex-direction: column;
  gap: 0.65rem;
  scroll-behavior: smooth;
}
.chat__msg {
  max-width: 86%;
  padding: 0.75rem 1.05rem;
  border-radius: 18px;
  font-size: 0.98rem;
  line-height: 1.55;
  overflow-wrap: break-word;
  animation: chat-entra 320ms ease both;
}
@keyframes chat-entra {
  from { opacity: 0; transform: translateY(8px); }
  to { opacity: 1; transform: none; }
}
.chat__msg--triaa {
  background: rgba(233, 229, 220, 0.09);
  border: 1px solid rgba(233, 229, 220, 0.08);
  color: rgba(233, 229, 220, 0.94);
  border-bottom-left-radius: 5px;
}
.chat__msg--user {
  align-self: flex-end;
  background: linear-gradient(135deg, var(--caramelo-claro), var(--caramelo));
  color: #fff;
  border-bottom-right-radius: 5px;
  box-shadow: 0 6px 18px rgba(163, 104, 60, 0.3);
}
.chat__msg--digitando {
  display: inline-flex;
  gap: 5px;
  align-items: center;
  padding: 0.95rem 1rem;
}
.chat__msg--digitando span {
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background: rgba(233, 229, 220, 0.6);
  animation: chat-dot 1s ease-in-out infinite;
}
.chat__msg--digitando span:nth-child(2) { animation-delay: 150ms; }
.chat__msg--digitando span:nth-child(3) { animation-delay: 300ms; }
@keyframes chat-dot {
  0%, 60%, 100% { opacity: 0.35; transform: none; }
  30% { opacity: 1; transform: translateY(-3px); }
}
@media (prefers-reduced-motion: reduce) {
  .chat__msg--digitando span { animation: none; }
  .chat__msg { animation: none; }
  .chat__janela { scroll-behavior: auto; }
}
.chat__opcoes {
  display: flex;
  flex-wrap: wrap;
  gap: 0.5rem;
  padding: 0 1.4rem 1.1rem;
}
.chat__opcao {
  background: none;
  border: 1px solid var(--caramelo-claro);
  border-radius: 999px;
  padding: 0.5rem 1rem;
  font-family: var(--fonte);
  font-size: 0.92rem;
  color: var(--branco-quente);
  cursor: pointer;
  transition: background var(--transicao), color var(--transicao);
}
.chat__opcao:hover { background: var(--caramelo); border-color: var(--caramelo); }
.chat__entrada {
  display: flex;
  align-items: center;
  gap: 0.7rem;
  padding: 0.8rem 1rem;
  border-top: 1px solid rgba(233, 229, 220, 0.12);
  background: rgba(11, 21, 46, 0.45);
}
.chat__entrada input {
  flex: 1;
  min-width: 0;
  background: rgba(233, 229, 220, 0.07);
  border: 1px solid rgba(233, 229, 220, 0.14);
  border-radius: 999px;
  padding: 0.75rem 1.2rem;
  font-family: var(--fonte);
  font-size: 1rem;
  color: var(--branco-quente);
  transition: border-color var(--transicao), box-shadow var(--transicao);
}
.chat__entrada input:focus {
  outline: none;
  border-color: var(--caramelo-claro);
  box-shadow: 0 0 0 3px rgba(192, 137, 86, 0.2);
}
.chat__entrada input:disabled { opacity: 0.55; }
.chat__entrada input::placeholder { color: rgba(233, 229, 220, 0.45); }
.chat__entrada button {
  flex-shrink: 0;
  width: 46px;
  height: 46px;
  border: 0;
  border-radius: 50%;
  display: grid;
  place-items: center;
  background: linear-gradient(135deg, var(--caramelo-claro), var(--caramelo));
  color: #fff;
  cursor: pointer;
  box-shadow: 0 4px 14px rgba(163, 104, 60, 0.4);
  transition: filter var(--transicao), transform var(--transicao);
}
.chat__entrada button:hover { filter: brightness(1.08); transform: scale(1.05); }
.chat__noscript { padding: 1rem 1.4rem; color: rgba(233, 229, 220, 0.85); }
.chat__noscript a { color: var(--caramelo-claro); }
.form__lgpd--chat { max-width: 680px; margin: 0.9rem auto 0; }

/* ---------- Banner de cookies (LGPD) ---------- */
.cookies {
  position: fixed;
  left: 1rem;
  bottom: 1rem;
  z-index: 60;
  width: min(calc(100vw - 2rem), 380px);
  display: flex;
  flex-direction: column;
  gap: 0.9rem;
  padding: 1.1rem 1.3rem;
  background: rgba(11, 21, 46, 0.97);
  border: 1px solid rgba(233, 229, 220, 0.2);
  border-radius: var(--raio);
  box-shadow: 0 18px 50px rgba(0, 0, 0, 0.5);
}
.cookies p { margin: 0; font-size: 0.88rem; line-height: 1.55; color: rgba(233, 229, 220, 0.9); }
.cookies a { color: var(--caramelo-claro); }
.cookies__acoes { display: flex; gap: 0.6rem; }
.cookies__acoes .btn { padding: 0.55rem 1.3rem; font-size: 0.82rem; }

/* ---------- Contato ---------- */
.contato__grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
  gap: clamp(1.4rem, 3vw, 2.4rem);
  margin-top: clamp(2rem, 4.5vw, 3rem);
}
.contato__item h3 {
  font-family: var(--fonte-display);
  font-size: 0.95rem;
  font-weight: 400;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  color: var(--caramelo-texto);
  margin: 0 0 0.6rem;
}
.contato__item p { margin: 0; color: var(--tinta); }
.contato__item p a { color: var(--navy); font-weight: 600; text-decoration: none; }
.contato__item p a:hover { text-decoration: underline; }
.contato__sociais { display: flex; gap: 0.7rem; }
.contato__sociais a {
  display: grid;
  place-items: center;
  width: 42px;
  height: 42px;
  border-radius: 50%;
  border: 1px solid rgba(23, 44, 97, 0.3);
  color: var(--navy);
  transition: background var(--transicao), color var(--transicao);
}
.contato__sociais a:hover { background: var(--navy); color: var(--branco-quente); border-color: var(--navy); }

/* ---------- FAQ ---------- */
.faq__lista { margin-top: clamp(1.8rem, 4vw, 2.6rem); }
.faq__item {
  border-bottom: 1px solid rgba(23, 44, 97, 0.12);
}
.faq__item summary {
  list-style: none;
  cursor: pointer;
  padding: 1.2rem 2.4rem 1.2rem 0;
  position: relative;
}
.faq__item summary::-webkit-details-marker { display: none; }
.faq__item summary h3 {
  display: inline;
  font-size: 1.08rem;
  font-weight: 600;
  color: var(--navy);
  margin: 0;
}
.faq__item summary::after {
  content: '';
  position: absolute;
  right: 0.4rem;
  top: 50%;
  width: 10px; height: 10px;
  border-right: 2px solid var(--caramelo);
  border-bottom: 2px solid var(--caramelo);
  transform: translateY(-70%) rotate(45deg);
  transition: transform var(--transicao);
}
.faq__item[open] summary::after { transform: translateY(-30%) rotate(225deg); }
.faq__item > p { padding: 0 0 1.3rem; color: var(--tinta-suave); max-width: 60em; }
.faq__item summary:focus-visible { outline: 3px solid var(--azul-suave); outline-offset: 3px; }

/* ---------- Formulário ---------- */
.diagnostico { position: relative; }
.form {
  margin-top: clamp(1.8rem, 4vw, 2.6rem);
  background: rgba(233, 229, 220, 0.05);
  border: 1px solid rgba(233, 229, 220, 0.14);
  border-radius: var(--raio);
  padding: clamp(1.5rem, 4vw, 2.5rem);
}
.form__linha {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 0 1.2rem;
}
.form__campo { margin-bottom: 1.3rem; }
.form__campo > label, .form__radios legend {
  display: block;
  font-size: 0.9rem;
  font-weight: 600;
  letter-spacing: 0.05em;
  text-transform: uppercase;
  color: rgba(233, 229, 220, 0.85);
  margin-bottom: 0.45rem;
}
.form input[type="text"],
.form input[type="email"],
.form input[type="tel"],
.form input[type="number"],
.form select,
.form textarea {
  width: 100%;
  font-family: var(--fonte);
  font-size: 1rem;
  color: var(--branco-quente);
  background: rgba(11, 21, 46, 0.55);
  border: 1px solid rgba(233, 229, 220, 0.22);
  border-radius: var(--raio);
  padding: 0.85rem 1rem;
  transition: border-color var(--transicao);
}
.form select {
  appearance: none;
  -webkit-appearance: none;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath d='M1 1.5 6 6.5 11 1.5' fill='none' stroke='%23C08956' stroke-width='2' stroke-linecap='round'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: right 1rem center;
  padding-right: 2.6rem;
  cursor: pointer;
}
.form select:invalid { color: rgba(233, 229, 220, 0.55); }
.form select option { background: var(--navy-deep); color: var(--branco-quente); }
.form input:focus, .form select:focus, .form textarea:focus {
  outline: none;
  border-color: var(--caramelo-claro);
  box-shadow: 0 0 0 3px rgba(192, 137, 86, 0.25);
}
.form input.is-invalid, .form select.is-invalid, .form textarea.is-invalid { border-color: #C25B4E; }
.form__radios { border: 0; padding: 0; margin: 0 0 1.3rem; }
.radio {
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  margin: 0.2rem 1.4rem 0.2rem 0;
  font-size: 1rem;
  color: rgba(233, 229, 220, 0.9);
  cursor: pointer;
}
.radio input { accent-color: var(--caramelo); width: 1.1rem; height: 1.1rem; }
.form__hp { position: absolute; left: -9999px; top: -9999px; }
.form__enviar { width: 100%; margin-top: 0.4rem; }
.form__lgpd {
  font-size: 0.85rem;
  color: rgba(233, 229, 220, 0.6);
  margin: 1rem 0 0;
}
.form__lgpd a { color: rgba(233, 229, 220, 0.85); }
.form__feedback { margin: 0.9rem 0 0; font-weight: 600; min-height: 1.4em; }
.form__feedback.is-ok { color: #9BC49A; }
.form__feedback.is-erro { color: #E0A198; }

/* ---------- Rodapé ---------- */
.rodape {
  background: var(--navy-deep);
  color: rgba(233, 229, 220, 0.75);
  padding: clamp(2.6rem, 6vw, 4rem) 0 1.6rem;
  font-size: 0.95rem;
}
.rodape__topo {
  display: grid;
  grid-template-columns: 1.3fr 1fr 1fr;
  gap: 2rem;
  padding-bottom: 2rem;
  border-bottom: 1px solid rgba(233, 229, 220, 0.14);
}
.rodape__marca img { width: 128px; margin-bottom: 0.9rem; }
.rodape__marca p { max-width: 24em; }
.rodape__nav { display: flex; flex-direction: column; gap: 0.5rem; }
.rodape__nav a, .rodape__contato a {
  color: rgba(233, 229, 220, 0.8);
  text-decoration: none;
}
.rodape__nav a:hover, .rodape__contato a:hover { color: var(--caramelo-claro); }
.rodape__contato { display: flex; flex-direction: column; gap: 0.5rem; align-items: flex-start; }
.rodape__contato a { display: inline-flex; align-items: center; gap: 0.55rem; }
.rodape__contato svg { flex-shrink: 0; opacity: 0.85; }
.rodape__credito a { color: inherit; }
.rodape__credito a:hover { color: var(--caramelo-claro); }
.rodape__base {
  display: flex;
  flex-wrap: wrap;
  gap: 0.4rem 2rem;
  padding-top: 1.4rem;
  font-size: 0.85rem;
  color: rgba(233, 229, 220, 0.72);
}
.rodape__base p { margin: 0; }
.rodape__base a { color: rgba(233, 229, 220, 0.82); }
.rodape__credito { margin-left: auto !important; }

/* ---------- Animações de entrada (só com JS ativo) ---------- */
.js .reveal {
  opacity: 0;
  transform: translateY(24px);
  transition: opacity 640ms ease, transform 640ms ease;
}
.js .reveal.is-visible { opacity: 1; transform: none; }

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  .reveal { opacity: 1; transform: none; transition: none; }
  .btn, .nucleo__foto img { transition: none; }
}

/* ---------- Responsivo ---------- */
@media (max-width: 900px) {
  .diferencial__grid, .paraquem__bloco { grid-template-columns: 1fr; }
  .paraquem__bloco:nth-child(even) .paraquem__figura { order: 0; }
  .paraquem__figura { aspect-ratio: 16 / 10; min-height: 0; }
  .nucleos__grid { grid-template-columns: 1fr; max-width: 480px; }
  .numeros { grid-template-columns: repeat(2, 1fr); gap: 1.8rem 1rem; }
  .rodape__topo { grid-template-columns: 1fr; gap: 1.6rem; }
  .rodape__credito { margin-left: 0 !important; }

  /* Hero mobile/tablet: retrato do trio inteiro no topo, fundindo para navy; texto abaixo */
  .hero { display: block; min-height: 0; }
  .hero__media {
    position: relative;
    inset: auto;
    height: min(62svh, 130vw);
  }
  .hero__media img { object-position: 60% 20%; }
  .hero__scrim {
    inset: auto 0 auto 0;
    top: 0;
    height: min(62svh, 130vw);
    background: linear-gradient(0deg, var(--navy-deep) 2%, rgba(11, 21, 46, 0) 32%);
  }
  .hero__inner { align-items: center; text-align: center; padding-top: 0; margin-top: -2.5rem; padding-bottom: 3.5rem; }
  .hero__title { align-items: center; }
  .hero__lead { max-width: 34em; }
  .hero__actions { justify-content: center; max-width: none; }
}

@media (max-width: 760px) {
  .topbar__toggle { display: flex; }
  .topbar__nav {
    position: fixed;
    top: 0; right: 0;
    height: 100dvh;
    width: min(78vw, 320px);
    background: var(--navy-deep);
    flex-direction: column;
    align-items: flex-start;
    padding: 5.5rem 2rem 2rem;
    gap: 1.4rem;
    transform: translateX(100%);
    transition: transform 280ms ease;
    box-shadow: -10px 0 40px rgba(0, 0, 0, 0.4);
  }
  .topbar__nav.is-open { transform: translateX(0); }
  .topbar.menu-aberto { background: rgba(11, 21, 46, 0.96); }
  .topbar__toggle[aria-expanded="true"] span:nth-child(1) { transform: translateY(7px) rotate(45deg); }
  .topbar__toggle[aria-expanded="true"] span:nth-child(2) { opacity: 0; }
  .topbar__toggle[aria-expanded="true"] span:nth-child(3) { transform: translateY(-7px) rotate(-45deg); }

  .form__linha { grid-template-columns: 1fr; gap: 0; }
  .metodo__lista { grid-template-columns: 1fr; }
  .metodo__etapa { min-height: 0; padding-bottom: 3.6rem; }
}

@media (max-width: 480px) {
  .numeros { grid-template-columns: 1fr 1fr; }
  .hero__actions .btn { width: 100%; }
}
