/* ============================================================
   CRÉDITO360 — Design System institucional
   Tokens oficiais da marca · gramática visual nível G4
   ============================================================ */

/* ---------- Reset ---------- */
*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
html { scroll-behavior: smooth; -webkit-text-size-adjust: 100%; }
img, svg, video { max-width: 100%; display: block; }
button, input, select, textarea { font: inherit; color: inherit; }
a { color: inherit; text-decoration: none; }
ul, ol { list-style: none; }

/* ---------- Tokens ---------- */
:root {
  --navy:      #0E273F;
  --navy-deep: #081726;
  --navy-2:    #16334F;
  --navy-3:    #1D3E5F;
  --navy-line: rgba(255,255,255,.08);
  --gold:      #C69C6D;
  --gold-deep: #A87F4F;
  --gold-soft: #E7D3B4;
  --offwhite:  #F5F3EF;
  --mist:      #ECE8E1;
  --paper-line: rgba(14,39,63,.12);
  --ink:       #0E273F;
  --ink-soft:  #46586C;
  --text-on-navy: rgba(245,243,239,.82);
  --text-on-navy-strong: #F5F3EF;

  --font-display: 'Marcellus', 'Times New Roman', serif;
  --font-serif: 'Libre Baskerville', Georgia, serif;
  --font-sans: 'Manrope', -apple-system, 'Segoe UI', sans-serif;

  --radius: 10px;
  --radius-lg: 18px;
  --shadow-lift: 0 24px 60px rgba(8,23,38,.18);
  --shadow-gold: 0 12px 34px rgba(198,156,109,.28);

  --container: 1200px;
  --gutter: clamp(20px, 4vw, 40px);
  --section-y: clamp(72px, 9vw, 128px);

  --ease-out: cubic-bezier(.22,.61,.36,1);
}

body {
  font-family: var(--font-sans);
  font-size: 17px;
  line-height: 1.65;
  color: var(--ink);
  background: var(--navy);
  -webkit-font-smoothing: antialiased;
  overflow-x: hidden;
  overflow-x: clip;
}

::selection { background: var(--gold); color: var(--navy-deep); }

/* ---------- Type ---------- */
.display {
  font-family: var(--font-display);
  font-weight: 400;
  line-height: 1.06;
  letter-spacing: .01em;
}
h1.display { font-size: clamp(38px, 5.4vw, 68px); }
h2.display { font-size: clamp(30px, 3.8vw, 48px); }

.serif-sub {
  font-family: var(--font-serif);
  font-size: clamp(17px, 1.5vw, 20px);
  line-height: 1.7;
}

.eyebrow {
  display: inline-flex;
  align-items: center;
  gap: 12px;
  font-family: var(--font-sans);
  font-size: 12.5px;
  font-weight: 600;
  letter-spacing: .18em;
  text-transform: uppercase;
  color: var(--gold);
}
.eyebrow::before {
  content: "";
  width: 34px; height: 1px;
  background: var(--gold);
  opacity: .7;
}
.eyebrow--center { justify-content: center; }
.eyebrow--center::after {
  content: "";
  width: 34px; height: 1px;
  background: var(--gold);
  opacity: .7;
}

.lead { font-size: clamp(17px, 1.6vw, 19.5px); color: var(--ink-soft); }

/* Cores automáticas por superfície */
.hero h1, .hero h2, .hero h3,
.section--navy h1, .section--navy h2, .section--navy h3,
.section--deep h1, .section--deep h2, .section--deep h3 { color: var(--text-on-navy-strong); }
.hero p, .hero .lead,
.section--navy p, .section--navy .lead,
.section--deep p, .section--deep .lead { color: var(--text-on-navy); }
.section--light h1, .section--light h2, .section--light h3,
.section--mist h1, .section--mist h2, .section--mist h3 { color: var(--ink); }
.section--light p, .section--mist p { color: var(--ink-soft); }
/* Cartões claros dentro de seções navy mantêm tinta escura */
.section--navy .form-card h1, .section--navy .form-card h2, .section--navy .form-card h3,
.section--deep .form-card h1, .section--deep .form-card h2, .section--deep .form-card h3,
.hero .form-card h3 { color: var(--ink); }
.section--navy .form-card p, .section--deep .form-card p, .hero .form-card p,
.section--navy .form-card label, .section--deep .form-card label { color: var(--ink-soft); }

/* ---------- Layout ---------- */
.container {
  width: 100%;
  max-width: var(--container);
  margin-inline: auto;
  padding-inline: var(--gutter);
}
.section { padding-block: var(--section-y); position: relative; overflow: clip; }
.section--navy { background: var(--navy); color: var(--text-on-navy); }
.section--deep { background: var(--navy-deep); color: var(--text-on-navy); }
.section--light { background: var(--offwhite); color: var(--ink); }
.section--mist { background: var(--mist); color: var(--ink); }

.section-head { max-width: 780px; margin-bottom: clamp(40px, 5vw, 64px); }
.section-head--center { margin-inline: auto; text-align: center; }
.section-head .display { margin: 18px 0 16px; }

/* ============================================================
   HEADER
   ============================================================ */
.site-header {
  position: fixed;
  inset: 0 0 auto 0;
  z-index: 100;
  background: rgba(8,23,38,.72);
  -webkit-backdrop-filter: blur(14px);
  backdrop-filter: blur(14px);
  border-bottom: 1px solid transparent;
  transition: background .35s var(--ease-out), border-color .35s var(--ease-out);
}
.site-header.is-scrolled {
  background: rgba(8,23,38,.92);
  border-bottom-color: var(--navy-line);
}
.site-header__inner {
  display: flex;
  align-items: center;
  gap: 28px;
  height: 76px;
}
.site-header__logo img { height: 44px; width: auto; }
.site-header__nav {
  display: flex;
  align-items: center;
  gap: 30px;
  margin-left: auto;
}
.site-header__nav a {
  font-size: 14.5px;
  font-weight: 600;
  color: var(--text-on-navy);
  transition: color .25s;
}
.site-header__nav a:hover { color: var(--gold-soft); }
.site-header__cta { margin-left: 8px; }

.nav-toggle {
  display: none;
  margin-left: auto;
  width: 44px; height: 44px;
  background: none;
  border: 1px solid var(--navy-line);
  border-radius: var(--radius);
  cursor: pointer;
  position: relative;
}
.nav-toggle span, .nav-toggle span::before, .nav-toggle span::after {
  content: "";
  position: absolute;
  left: 50%; top: 50%;
  width: 18px; height: 2px;
  background: var(--gold-soft);
  transform: translate(-50%, -50%);
  transition: transform .3s var(--ease-out), opacity .3s;
}
.nav-toggle span::before { transform: translate(-50%, calc(-50% - 6px)); }
.nav-toggle span::after  { transform: translate(-50%, calc(-50% + 6px)); }
.nav-toggle[aria-expanded="true"] span { background: transparent; }
.nav-toggle[aria-expanded="true"] span::before { transform: translate(-50%,-50%) rotate(45deg); }
.nav-toggle[aria-expanded="true"] span::after  { transform: translate(-50%,-50%) rotate(-45deg); }

/* ---------- Buttons ---------- */
.btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
  padding: 15px 30px;
  border-radius: var(--radius);
  font-family: var(--font-sans);
  font-size: 15.5px;
  font-weight: 800;
  letter-spacing: .01em;
  line-height: 1.2;
  border: 1px solid transparent;
  cursor: pointer;
  transition: transform .25s var(--ease-out), box-shadow .25s var(--ease-out),
              background .25s, color .25s, border-color .25s;
}
.btn--gold {
  background: var(--gold);
  color: var(--navy-deep);
  box-shadow: 0 6px 22px rgba(198,156,109,.22);
}
.btn--gold:hover {
  background: var(--gold-soft);
  transform: translateY(-2px);
  box-shadow: var(--shadow-gold);
}
.btn--ghost {
  background: transparent;
  color: var(--text-on-navy-strong);
  border-color: rgba(245,243,239,.32);
}
.btn--ghost:hover { border-color: var(--gold); color: var(--gold-soft); }
.btn--ghost-dark {
  background: transparent;
  color: var(--navy);
  border-color: rgba(14,39,63,.28);
}
.btn--ghost-dark:hover { border-color: var(--gold-deep); color: var(--gold-deep); }
.btn--lg { padding: 18px 38px; font-size: 16.5px; }
.btn--block { width: 100%; }

/* ============================================================
   HERO — receita bancária em 4 camadas codificadas
   ============================================================ */
.hero {
  position: relative;
  overflow: hidden;
  background: var(--navy);
  color: var(--text-on-navy);
  padding-top: 76px;
}
.hero__bg { position: absolute; inset: 0; overflow: hidden; pointer-events: none; }
.hero__bg-base {
  position: absolute; inset: 0;
  background:
    radial-gradient(140% 90% at 50% 112%, transparent 52%, rgba(4,12,22,.6)),
    linear-gradient(152deg, #081726 0%, #0E273F 46%, #16354F 100%);
}
.hero__bg-beams { position: absolute; inset: -2%; width: 104%; height: 104%; }
.hero__bg-glow {
  position: absolute; inset: 0;
  background:
    radial-gradient(46% 38% at 74% 30%, rgba(198,156,109,.16), transparent 70%),
    radial-gradient(52% 44% at 12% 88%, rgba(29,62,95,.5), transparent 72%);
}
/* textura de grão sutil (camada que faltava da família .hero__bg-*) */
.hero__bg-grain {
  position: absolute; inset: 0;
  pointer-events: none;
  opacity: .05;
  mix-blend-mode: overlay;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='2'/%3E%3C/filter%3E%3Crect width='160' height='160' filter='url(%23n)' opacity='.6'/%3E%3C/svg%3E");
}

.hero__sweep {
  position: absolute; top: -10%; bottom: -10%;
  width: 26%;
  left: -30%;
  background: linear-gradient(100deg, transparent, rgba(231,211,180,.07), transparent);
  transform: skewX(-14deg);
  animation: heroSweep 11s var(--ease-out) infinite;
}
@keyframes heroSweep {
  0%, 62% { left: -32%; opacity: 0; }
  70% { opacity: 1; }
  86%, 100% { left: 128%; opacity: 0; }
}
.hero__bg .drift-a { animation: drift 18s ease-in-out infinite alternate; }
.hero__bg .drift-b { animation: drift 24s ease-in-out infinite alternate-reverse; }
@keyframes drift {
  from { transform: translateY(-1.4%); }
  to   { transform: translateY(1.4%); }
}

.hero__inner {
  position: relative;
  display: grid;
  gap: clamp(40px, 5vw, 72px);
  padding-block: clamp(84px, 11vw, 148px) clamp(64px, 8vw, 104px);
}
.hero__content { max-width: 860px; }
.hero__content h1 { margin: 22px 0 24px; color: var(--text-on-navy-strong); }
.hero__content h1 em {
  font-style: normal;
  color: var(--gold-soft);
}
.hero__sub { max-width: 640px; }
.hero__ctas {
  display: flex;
  flex-wrap: wrap;
  gap: 16px;
  margin-top: 38px;
}

/* Hero compacto para páginas internas */
.hero--page .hero__inner { padding-block: clamp(72px, 9vw, 116px) clamp(48px, 6vw, 76px); }
.hero__badge {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 8px 18px;
  border-radius: 99px;
  border: 1px solid rgba(198,156,109,.45);
  background: rgba(198,156,109,.1);
  color: var(--gold-soft);
  font-size: 13px;
  font-weight: 700;
  letter-spacing: .06em;
  margin-bottom: 20px;
}
.hero__price {
  font-family: var(--font-display);
  font-size: clamp(30px, 3.6vw, 44px);
  color: var(--gold);
  margin: 26px 0 4px;
}
.hero__price small { font-family: var(--font-sans); font-size: 15px; color: var(--text-on-navy); font-weight: 600; }

/* Stats row */
.stats {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  border-top: 1px solid var(--navy-line);
}
.stat {
  padding: 26px 26px 6px 0;
  border-left: 1px solid var(--navy-line);
  padding-left: 26px;
}
.stat:first-child { border-left: 0; padding-left: 0; }
.stat__num {
  font-family: var(--font-display);
  font-size: clamp(30px, 3.4vw, 46px);
  color: var(--gold);
  line-height: 1.1;
}
.stat__label {
  font-size: 13.5px;
  font-weight: 600;
  letter-spacing: .04em;
  color: var(--text-on-navy);
  margin-top: 6px;
}

/* ============================================================
   COMPONENTES
   ============================================================ */

/* Cards genéricos */
.card-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(255px, 1fr));
  gap: 22px;
}
.card {
  border-radius: var(--radius-lg);
  padding: 30px 28px;
  transition: transform .35s var(--ease-out), box-shadow .35s var(--ease-out), border-color .35s;
}
.card:hover { transform: translateY(-6px); }
.card--navy {
  background: linear-gradient(165deg, var(--navy-2), rgba(22,51,79,.45));
  border: 1px solid var(--navy-line);
}
.card--navy:hover { border-color: rgba(198,156,109,.45); box-shadow: 0 22px 48px rgba(4,12,22,.5); }
.card--light {
  background: #FFFFFF;
  border: 1px solid var(--paper-line);
}
.card--light:hover { box-shadow: var(--shadow-lift); border-color: rgba(198,156,109,.5); }
.card h3 {
  font-family: var(--font-serif);
  font-size: 19px;
  font-weight: 700;
  margin: 18px 0 10px;
}
.card p { font-size: 15px; line-height: 1.6; }
.card--navy p { color: var(--text-on-navy); }
.card--light p { color: var(--ink-soft); }

.card__icon {
  width: 52px; height: 52px;
  border-radius: 12px;
  display: grid;
  place-items: center;
  background: rgba(198,156,109,.12);
  border: 1px solid rgba(198,156,109,.35);
}
.card__icon svg { width: 26px; height: 26px; stroke: var(--gold); fill: none; stroke-width: 1.6; }

/* Comparativo Sozinho × Com */
.versus {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 26px;
}
.versus__col {
  border-radius: var(--radius-lg);
  padding: 38px 34px;
}
.versus__col--alone {
  background: transparent;
  border: 1px dashed rgba(14,39,63,.3);
}
.versus__col--with {
  background: var(--navy);
  color: var(--text-on-navy);
  border: 1px solid rgba(198,156,109,.4);
  box-shadow: var(--shadow-lift);
}
.versus__col h3 {
  font-family: var(--font-display);
  font-size: 24px;
  font-weight: 400;
  margin-bottom: 22px;
}
.versus__col--with h3 { color: var(--gold-soft); }
.versus__col li {
  display: flex;
  gap: 12px;
  padding: 11px 0;
  font-size: 15.5px;
  border-top: 1px solid rgba(14,39,63,.1);
}
.versus__col--with li { border-top-color: var(--navy-line); }
.versus__col li svg { width: 20px; height: 20px; flex: none; margin-top: 2px; }
.versus__col--alone li { color: var(--ink-soft); }

/* Ecossistema radial */
.orbit-wrap {
  position: relative;
  /* reserva a projeção dos nós (112px de largura, ancorados em -56px) */
  width: min(720px, calc(100% - 116px));
  margin-inline: auto;
  aspect-ratio: 1;
}
.orbit-ring {
  position: absolute;
  inset: 0;
  border: 1px solid var(--navy-line);
  border-radius: 50%;
}
.orbit-ring--inner { inset: 18%; border-style: dashed; opacity: .7; }
.orbit-center {
  position: absolute;
  inset: 36%;
  border-radius: 50%;
  display: grid;
  place-items: center;
  text-align: center;
  background: radial-gradient(circle at 32% 28%, var(--navy-3), var(--navy-deep));
  border: 1px solid rgba(198,156,109,.55);
  box-shadow: 0 0 0 10px rgba(198,156,109,.05), 0 0 64px rgba(198,156,109,.18);
}
.orbit-center strong {
  font-family: var(--font-display);
  font-weight: 400;
  font-size: clamp(20px, 2.4vw, 28px);
  color: var(--gold-soft);
  display: block;
}
.orbit-center span { font-size: 12px; letter-spacing: .14em; text-transform: uppercase; color: var(--text-on-navy); }
.orbit-node {
  position: absolute;
  width: 112px;
  margin: -56px;
  top: calc(50% + var(--oy)); left: calc(50% + var(--ox));
  display: grid;
  justify-items: center;
  gap: 8px;
  text-align: center;
  font-size: 12.5px;
  font-weight: 700;
  letter-spacing: .02em;
  color: var(--text-on-navy-strong);
}
.orbit-node i {
  width: 58px; height: 58px;
  border-radius: 50%;
  display: grid;
  place-items: center;
  background: var(--navy-2);
  border: 1px solid rgba(198,156,109,.4);
  transition: transform .3s var(--ease-out), box-shadow .3s;
}
.orbit-node:hover i { transform: scale(1.12); box-shadow: 0 0 30px rgba(198,156,109,.35); }
.orbit-node svg { width: 24px; height: 24px; stroke: var(--gold); fill: none; stroke-width: 1.6; }

/* Mockup plataforma */
.mockup {
  border-radius: var(--radius-lg);
  overflow: hidden;
  background: var(--navy-deep);
  border: 1px solid var(--navy-line);
  box-shadow: var(--shadow-lift);
  font-size: 13px;
}
.mockup__bar {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 13px 18px;
  border-bottom: 1px solid var(--navy-line);
}
.mockup__bar i { width: 10px; height: 10px; border-radius: 50%; background: var(--navy-3); }
.mockup__bar i:first-child { background: rgba(198,156,109,.65); }
.mockup__body { display: grid; grid-template-columns: 200px 1fr; min-height: 380px; }
.mockup__side {
  border-right: 1px solid var(--navy-line);
  padding: 20px 0;
}
.mockup__side a {
  display: block;
  padding: 10px 22px;
  color: var(--text-on-navy);
  font-weight: 600;
}
.mockup__side a.is-active {
  color: var(--gold-soft);
  background: linear-gradient(90deg, rgba(198,156,109,.14), transparent);
  border-left: 2px solid var(--gold);
}
.mockup__main { padding: 26px 28px; color: var(--text-on-navy); }
.mockup__main h4 {
  font-family: var(--font-serif);
  color: var(--text-on-navy-strong);
  font-size: 16px;
  margin-bottom: 4px;
}
.mockup__meta { font-size: 12px; color: rgba(245,243,239,.55); margin-bottom: 20px; }
.progress {
  height: 7px;
  background: var(--navy-2);
  border-radius: 99px;
  overflow: hidden;
  margin: 8px 0 22px;
}
.progress i {
  display: block;
  height: 100%;
  width: 0;
  border-radius: inherit;
  background: linear-gradient(90deg, var(--gold-deep), var(--gold));
  transition: width 1.4s var(--ease-out);
}
.mockup__pill {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 7px 14px;
  border-radius: 99px;
  border: 1px solid rgba(198,156,109,.4);
  background: rgba(198,156,109,.08);
  color: var(--gold-soft);
  font-weight: 700;
  font-size: 12px;
}
.mockup__pill i {
  width: 7px; height: 7px;
  border-radius: 50%;
  background: var(--gold);
  animation: pulse 1.6s ease-in-out infinite;
}
@keyframes pulse { 50% { opacity: .3; } }
.mockup__rows { display: grid; gap: 10px; margin-top: 20px; }
.mockup__row {
  display: flex;
  justify-content: space-between;
  gap: 12px;
  padding: 12px 16px;
  border-radius: 8px;
  background: rgba(22,51,79,.5);
  border: 1px solid var(--navy-line);
}
.mockup__row b { color: var(--text-on-navy-strong); font-weight: 700; }
.mockup__row span { color: rgba(245,243,239,.6); }
.mockup__row em { font-style: normal; color: var(--gold-soft); font-weight: 700; }

/* Método numerado */
.method-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 2px;
  background: var(--navy-line);
  border: 1px solid var(--navy-line);
  border-radius: var(--radius-lg);
  overflow: hidden;
}
.method-item {
  background: var(--navy);
  padding: 30px 28px;
  transition: background .3s;
}
.method-item:hover { background: var(--navy-2); }
.method-item i {
  font-style: normal;
  font-family: var(--font-display);
  font-size: 15px;
  color: var(--gold);
  letter-spacing: .08em;
}
.method-item h3 {
  font-family: var(--font-serif);
  font-size: 17.5px;
  color: var(--text-on-navy-strong);
  margin-top: 10px;
}

/* Statement full-bleed */
.statement { text-align: center; }
.statement .display { max-width: 900px; margin-inline: auto; }
.statement .display em { font-style: normal; color: var(--gold-soft); }
.statement p { max-width: 560px; margin: 22px auto 0; }

/* Planos */
.plans {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 20px;
  align-items: stretch;
}
.plan {
  position: relative;
  display: flex;
  flex-direction: column;
  border-radius: var(--radius-lg);
  padding: 34px 28px;
  background: #FFFFFF;
  border: 1px solid var(--paper-line);
  transition: transform .35s var(--ease-out), box-shadow .35s var(--ease-out);
}
.plan:hover { transform: translateY(-6px); box-shadow: var(--shadow-lift); }
.plan__tag {
  font-size: 11.5px;
  font-weight: 800;
  letter-spacing: .14em;
  text-transform: uppercase;
  color: var(--gold-deep);
}
.plan h3 {
  font-family: var(--font-display);
  font-weight: 400;
  font-size: 30px;
  margin: 10px 0 6px;
}
.plan__price { font-size: 14px; color: var(--ink-soft); margin-bottom: 14px; }
.plan__price b { font-size: 22px; color: var(--ink); font-weight: 800; }
.plan p { font-size: 14.5px; color: var(--ink-soft); flex: 1; }
.plan .btn { margin-top: 24px; }
.plan--featured {
  background: linear-gradient(170deg, var(--navy), var(--navy-deep));
  border: 1px solid rgba(198,156,109,.5);
  box-shadow: var(--shadow-lift);
}
.plan--featured h3 { color: var(--gold-soft); }
.plan--featured p, .plan--featured .plan__price { color: var(--text-on-navy); }
.plan--featured .plan__price b { color: var(--text-on-navy-strong); }
.plan__badge {
  position: absolute;
  top: -13px; left: 50%;
  transform: translateX(-50%);
  white-space: nowrap;
  max-width: calc(100% - 12px);
  overflow: hidden;
  background: var(--gold);
  color: var(--navy-deep);
  font-size: clamp(9.5px, 0.35vw + 8px, 11.5px);
  font-weight: 800;
  letter-spacing: .08em;
  text-transform: uppercase;
  padding: 6px clamp(8px, 1vw, 16px);
  border-radius: 99px;
}

/* Marquee de serviços */
.marquee {
  overflow: hidden;
  -webkit-mask-image: linear-gradient(90deg, transparent, #000 8%, #000 92%, transparent);
  mask-image: linear-gradient(90deg, transparent, #000 8%, #000 92%, transparent);
}
.marquee__track {
  display: flex;
  gap: 14px;
  width: max-content;
  animation: marquee 42s linear infinite;
  padding-block: 6px;
}

@keyframes marquee { to { transform: translateX(-50%); } }
.chip {
  white-space: nowrap;
  padding: 12px 22px;
  border-radius: 99px;
  border: 1px solid var(--navy-line);
  background: rgba(22,51,79,.45);
  color: var(--text-on-navy);
  font-size: 14px;
  font-weight: 600;
}
.chip b { color: var(--gold-soft); font-weight: 700; }

/* Propósito — escada */
.purpose { text-align: center; }
.purpose li {
  font-family: var(--font-display);
  font-size: clamp(24px, 3.4vw, 42px);
  line-height: 1.5;
  color: rgba(245,243,239,.35);
  transition: color .6s var(--ease-out);
}
.purpose li.is-lit { color: var(--text-on-navy-strong); }
.purpose li.is-lit em { font-style: normal; color: var(--gold-soft); }
.purpose li em { font-style: normal; }

/* Perfis comunidade */

.profile {
  display: flex;
  align-items: center;
  gap: 14px;
  padding: 18px 20px;
  border-radius: var(--radius);
  background: #FFFFFF;
  border: 1px solid var(--paper-line);
  font-weight: 700;
  font-size: 14.5px;
}
.profile svg { width: 22px; height: 22px; stroke: var(--gold-deep); fill: none; stroke-width: 1.7; flex: none; }

/* FAQ */
.faq { max-width: 780px; margin-inline: auto; }
.faq details {
  border-bottom: 1px solid var(--paper-line);
}
.faq summary {
  cursor: pointer;
  list-style: none;
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 20px;
  padding: 22px 4px;
  font-family: var(--font-serif);
  font-size: 17px;
  font-weight: 700;
}
.faq summary::-webkit-details-marker { display: none; }
.faq summary::after {
  content: "+";
  font-family: var(--font-sans);
  font-size: 22px;
  font-weight: 400;
  color: var(--gold-deep);
  transition: transform .3s var(--ease-out);
}
.faq details[open] summary::after { transform: rotate(45deg); }
.faq details p { padding: 0 4px 22px; color: var(--ink-soft); max-width: 660px; }
.section--navy .faq details, .section--deep .faq details { border-bottom-color: var(--navy-line); }
.section--navy .faq details p, .section--deep .faq details p { color: var(--text-on-navy); }

/* Formulários */
.form-card {
  background: #FFFFFF;
  border: 1px solid var(--paper-line);
  border-radius: var(--radius-lg);
  padding: clamp(28px, 4vw, 44px);
  box-shadow: var(--shadow-lift);
  max-width: 560px;
  margin-inline: auto;
}
.form-field { margin-bottom: 18px; }
.form-field label {
  display: block;
  font-size: 13px;
  font-weight: 800;
  letter-spacing: .04em;
  margin-bottom: 8px;
}
.form-field input, .form-field select, .form-field textarea {
  width: 100%;
  padding: 14px 16px;
  border: 1px solid rgba(14,39,63,.22);
  border-radius: var(--radius);
  background: var(--offwhite);
  transition: border-color .25s, box-shadow .25s;
}
.form-field input:focus, .form-field select:focus, .form-field textarea:focus {
  outline: none;
  border-color: var(--gold-deep);
  box-shadow: 0 0 0 3px rgba(198,156,109,.2);
}
.form-note { font-size: 13px; color: var(--ink-soft); text-align: center; margin-top: 14px; }
.form-success {
  display: none;
  text-align: center;
  padding: 28px 10px 10px;
}
.form-success.is-visible { display: block; }
.form-success h3 { font-family: var(--font-display); font-weight: 400; font-size: 26px; margin-bottom: 8px; }
.form-success p { color: var(--ink-soft); }

/* Carrossel simples */







/* CTA final */
.final-cta { text-align: center; overflow: hidden; position: relative; }
.final-cta .display { max-width: 860px; margin: 18px auto 0; }
.final-cta p { max-width: 620px; margin: 22px auto 0; }
.final-cta .btn { margin-top: 36px; }

/* ============================================================
   FOOTER
   ============================================================ */
.site-footer {
  background: var(--navy-deep);
  color: var(--text-on-navy);
  border-top: 1px solid var(--navy-line);
  padding: clamp(56px, 7vw, 88px) 0 120px;
}
.site-footer__grid {
  display: grid;
  grid-template-columns: 1.6fr 1fr 1fr 1fr;
  gap: 40px;
}
.site-footer__brand img { height: 52px; width: auto; margin-bottom: 18px; }
.site-footer__brand p { font-size: 14.5px; max-width: 300px; }
.site-footer h4 {
  font-family: var(--font-sans);
  font-size: 12.5px;
  font-weight: 800;
  letter-spacing: .16em;
  text-transform: uppercase;
  color: var(--gold);
  margin-bottom: 18px;
}
.site-footer li { margin-bottom: 12px; }
.site-footer li a { font-size: 14.5px; transition: color .25s; }
.site-footer li a:hover { color: var(--gold-soft); }
.site-footer__legal {
  margin-top: 56px;
  padding-top: 26px;
  border-top: 1px solid var(--navy-line);
  display: flex;
  justify-content: space-between;
  gap: 16px;
  font-size: 13px;
  color: rgba(245,243,239,.55);
}

/* WhatsApp float */




/* Bottom bar mobile (assinatura G4) */
.bottom-bar {
  display: none;
  position: fixed;
  inset: auto 0 0 0;
  z-index: 95;
  background: rgba(8,23,38,.96);
  -webkit-backdrop-filter: blur(12px);
  backdrop-filter: blur(12px);
  border-top: 1px solid var(--navy-line);
  padding: 10px 8px calc(10px + env(safe-area-inset-bottom));
}
.bottom-bar__inner {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
}
.bottom-bar a {
  display: grid;
  justify-items: center;
  gap: 5px;
  font-size: 11px;
  font-weight: 700;
  color: var(--text-on-navy);
}
.bottom-bar svg { width: 22px; height: 22px; stroke: var(--gold); fill: none; stroke-width: 1.6; }

/* ============================================================
   REVEALS / MOTION
   ============================================================ */
.reveal {
  opacity: 0;
  transform: translateY(26px);
  transition: opacity .8s var(--ease-out), transform .8s var(--ease-out);
  transition-delay: var(--reveal-delay, 0s);
}
.reveal.is-in { opacity: 1; transform: none; }

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  .reveal { opacity: 1; transform: none; transition: none; }
  .hero__sweep, .hero__bg .drift-a, .hero__bg .drift-b,
  .marquee__track, .mockup__pill i { animation: none !important; }
  * { transition-duration: .01ms !important; }
}

/* ============================================================
   RESPONSIVO
   ============================================================ */
@media (max-width: 1024px) {
  .plans { grid-template-columns: repeat(2, 1fr); }
  .method-grid { grid-template-columns: repeat(2, 1fr); }

  .mockup__body { grid-template-columns: 168px 1fr; }
}

@media (max-width: 860px) {
  .site-header__nav {
    position: fixed;
    inset: 76px 0 auto 0;
    flex-direction: column;
    align-items: stretch;
    gap: 0;
    background: rgba(8,23,38,.98);
    border-bottom: 1px solid var(--navy-line);
    padding: 10px 0 22px;
    transform: translateY(-115%);
    visibility: hidden;
    transition: transform .4s var(--ease-out), visibility 0s .4s;
  }
  .site-header__nav.is-open { transform: none; visibility: visible; transition: transform .4s var(--ease-out); }
  .site-header__nav a { padding: 14px var(--gutter); font-size: 16px; }
  .site-header__cta { margin: 12px var(--gutter) 0; }
  .nav-toggle { display: block; }

  .stats { grid-template-columns: repeat(2, 1fr); }
  .stat:nth-child(3) { border-left: 0; padding-left: 0; }
  .versus { grid-template-columns: 1fr; }
  .site-footer__grid { grid-template-columns: 1fr 1fr; }
  .bottom-bar { display: block; }

  .orbit-node { width: 88px; margin: -44px; font-size: 11px; }
  .orbit-node i { width: 46px; height: 46px; }
  .orbit-wrap { width: min(720px, calc(100% - 92px)); }
  .mockup__body { grid-template-columns: 1fr; }
  .mockup__side { display: flex; overflow-x: auto; border-right: 0; border-bottom: 1px solid var(--navy-line); padding: 0; }
  .mockup__side a { white-space: nowrap; padding: 12px 16px; }
}

@media (max-width: 560px) {
.plans, .method-grid { grid-template-columns: 1fr; }
  .hero__ctas .btn { width: 100%; }
  .site-footer__grid { grid-template-columns: 1fr; }
  .stats { grid-template-columns: 1fr 1fr; }
  .site-footer { padding-bottom: 130px; }
}

/* ============================================================
   V2 — HERO COM FOUNDERS · WATERMARK · PLANOS · LÍDERES · BLOG
   ============================================================ */

/* Âncoras nunca sob o header fixo */
section[id], div[id] { scroll-margin-top: 84px; }

/* Ênfase serifada itálica (assinatura G4) */
.em-serif {
  font-family: var(--font-serif);
  font-style: italic;
  font-weight: 400;
  color: var(--gold-soft);
}
.section--light .em-serif, .section--mist .em-serif { color: var(--gold-deep); }
/* vence a regra v1 ".hero__content h1 em { font-style: normal }" */
.hero__content h1 em.em-serif, .hero h1 em.em-serif, .hero h2 em.em-serif { font-style: italic; }

/* Marca d'água — símbolo gigante, opacidade baixa */
.watermark {
  position: absolute;
  pointer-events: none;
  user-select: none;
  z-index: 0;
  opacity: .05;
  width: clamp(420px, 46vw, 780px);
}
.watermark img { width: 100%; height: auto; }
.watermark--tr { top: -8%; right: -10%; transform: rotate(8deg); }
.watermark--bl { bottom: -12%; left: -8%; transform: rotate(-6deg); }
.watermark--center { top: 50%; left: 50%; transform: translate(-50%, -50%) scale(1.15); }
.section > .container, .hero > .container { position: relative; z-index: 1; }

/* ---------- HERO COM PESSOAS (trio de founders) ---------- */





.trio {
  position: relative;
  display: flex;
  align-items: flex-end;
  justify-content: center;
  min-height: clamp(360px, 36vw, 560px);
  isolation: isolate;
}













/* ---------- PLANOS V2 ---------- */
.plans--v2 { grid-template-columns: repeat(4, 1fr); align-items: stretch; }
.plan--v2 {
  padding: 34px 26px 28px;
  border-radius: var(--radius-lg);
  position: relative;
  /* sem overflow:hidden — recortava a badge "Mais escolhido" (top:-13px);
     o brilho do card em destaque é contido via border-radius no ::before */
  display: flex;
  flex-direction: column;
}
.plan--v2 .plan__head {
  display: flex;
  align-items: center;
  gap: 12px;
  margin-bottom: 16px;
}
.plan--v2 .plan__ico {
  width: 46px; height: 46px;
  flex: none;
  border-radius: 12px;
  display: grid;
  place-items: center;
  background: rgba(198,156,109,.1);
  border: 1px solid rgba(198,156,109,.35);
}
.plan--v2 .plan__ico svg { width: 22px; height: 22px; stroke: var(--gold-deep); fill: none; stroke-width: 1.6; }
.plan--featured.plan--v2 .plan__ico svg { stroke: var(--gold); }
.plan--v2 h3 { margin: 0; font-size: 26px; }
.plan--v2 .plan__tag { display: block; margin-bottom: 2px; }
.plan__feats { margin: 16px 0 6px; }
.plan__feats li {
  display: flex;
  gap: 10px;
  align-items: flex-start;
  padding: 7px 0;
  font-size: 13.5px;
  line-height: 1.45;
  color: var(--ink-soft);
  border-top: 1px solid rgba(14,39,63,.08);
}
.plan__feats li svg { width: 15px; height: 15px; flex: none; margin-top: 3px; stroke: var(--gold-deep); fill: none; stroke-width: 2; }
.plan--featured .plan__feats li { color: var(--text-on-navy); border-top-color: var(--navy-line); }
.plan--featured .plan__feats li svg { stroke: var(--gold); }
.plan--featured.plan--v2 {
  box-shadow: 0 30px 70px rgba(8,23,38,.35), 0 0 0 1px rgba(198,156,109,.55), 0 0 44px rgba(198,156,109,.12);
}
.plan--featured.plan--v2::before {
  content: "";
  position: absolute;
  inset: 0;
  border-radius: inherit; /* contém o brilho nos cantos arredondados, sem overflow:hidden */
  pointer-events: none;
  background: radial-gradient(80% 46% at 50% 0%, rgba(198,156,109,.14), transparent 70%);
}
.plan--v2 .plan__price { margin: 14px 0 4px; }
.plan--v2 p.plan__desc { font-size: 14px; flex: 0 0 auto; } /* não estica: features alinham entre cards */
.plan--v2 .plan__feats { margin-top: auto; } /* empurra features+botão para a base, alinhados */

/* ---------- LÍDERES ---------- */
.leaders {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: clamp(18px, 2.4vw, 28px);
}
.leader {
  position: relative;
  border-radius: var(--radius-lg);
  overflow: hidden;
  aspect-ratio: 3 / 4;
  border: 1px solid var(--navy-line);
  background: var(--navy-2);
}
.leader img {
  width: 100%; height: 100%;
  object-fit: cover;
  filter: saturate(.82) contrast(1.04);
  transition: transform .8s var(--ease-out), filter .5s;
}
.leader:hover img { transform: scale(1.045); filter: saturate(1) contrast(1.05); }
.leader::after {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(185deg, rgba(14,39,63,.08) 40%, rgba(8,23,38,.88) 96%);
}
.leader__meta {
  position: absolute;
  z-index: 2;
  left: 22px; right: 22px; bottom: 18px;
}
.leader__meta strong {
  display: block;
  font-family: var(--font-display);
  font-weight: 400;
  font-size: clamp(20px, 1.8vw, 25px);
  color: var(--text-on-navy-strong);
  line-height: 1.15;
}
.leader__meta span {
  font-size: 12px;
  font-weight: 700;
  letter-spacing: .14em;
  text-transform: uppercase;
  color: var(--gold);
}

/* ---------- MOCKUP AO VIVO ---------- */
.typing { display: inline-flex; gap: 4px; margin-left: 6px; }
.typing i {
  width: 5px; height: 5px;
  border-radius: 50%;
  background: var(--gold);
  animation: typing 1.2s ease-in-out infinite;
}
.typing i:nth-child(2) { animation-delay: .18s; }
.typing i:nth-child(3) { animation-delay: .36s; }
@keyframes typing { 0%, 60%, 100% { opacity: .25; transform: translateY(0); } 30% { opacity: 1; transform: translateY(-3px); } }
.mockup__row { transition: opacity .5s var(--ease-out), transform .5s var(--ease-out); }
.mockup__row.is-pending { opacity: .35; transform: translateX(6px); }
.mockup__row em.is-ok { color: #7FC8A9; }

.mockup { position: relative; }

/* ---------- BLOG ---------- */
.filter-bar {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  margin-bottom: clamp(28px, 4vw, 44px);
}
.filter-chip {
  padding: 10px 20px;
  border-radius: 99px;
  border: 1px solid rgba(14,39,63,.22);
  background: transparent;
  color: var(--ink-soft);
  font-size: 13.5px;
  font-weight: 700;
  cursor: pointer;
  transition: all .25s var(--ease-out);
}
.filter-chip:hover { border-color: var(--gold-deep); color: var(--gold-deep); }
.filter-chip.is-active { background: var(--navy); border-color: var(--navy); color: var(--gold-soft); }
.section--navy .filter-chip, .section--deep .filter-chip { border-color: var(--navy-line); color: var(--text-on-navy); }
.section--navy .filter-chip.is-active { background: var(--gold); border-color: var(--gold); color: var(--navy-deep); }

.post-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 24px;
}
.post-card {
  display: flex;
  flex-direction: column;
  border-radius: var(--radius-lg);
  overflow: hidden;
  background: #FFFFFF;
  border: 1px solid var(--paper-line);
  transition: transform .35s var(--ease-out), box-shadow .35s var(--ease-out);
}
.post-card:hover { transform: translateY(-6px); box-shadow: var(--shadow-lift); }
.post-card__media {
  aspect-ratio: 16 / 9;
  position: relative;
  overflow: hidden;
  display: grid;
  place-items: center;
  background: linear-gradient(150deg, var(--navy) 0%, var(--navy-2) 100%);
}
.post-card__media img.symbol { width: 84px; opacity: .35; }
.post-card__media .cat-label {
  position: absolute;
  top: 14px; left: 14px;
  background: rgba(8,23,38,.72);
  -webkit-backdrop-filter: blur(6px);
  backdrop-filter: blur(6px);
  border: 1px solid rgba(198,156,109,.4);
  color: var(--gold-soft);
  border-radius: 99px;
  padding: 5px 13px;
  font-size: 11px;
  font-weight: 800;
  letter-spacing: .1em;
  text-transform: uppercase;
}
.post-card__body { padding: 22px 22px 24px; display: flex; flex-direction: column; flex: 1; }
.post-card__body time { font-size: 12.5px; color: var(--ink-soft); font-weight: 600; letter-spacing: .04em; }
.post-card__body h3 {
  font-family: var(--font-serif);
  font-size: 18px;
  line-height: 1.45;
  margin: 8px 0 10px;
  color: var(--ink);
}
.post-card__body p { font-size: 14px; color: var(--ink-soft); flex: 1; }
.post-card__link {
  margin-top: 16px;
  font-size: 13.5px;
  font-weight: 800;
  color: #8A6538; /* ≥4.5:1 sobre branco */
}
.post-card--featured { grid-column: 1 / -1; flex-direction: row; }
.post-card--featured .post-card__media { flex: 0 0 52%; aspect-ratio: auto; }
.post-card--featured .post-card__body { padding: clamp(24px, 3vw, 44px); justify-content: center; }
.post-card--featured .post-card__body h3 { font-size: clamp(20px, 2vw, 27px); }

/* ---------- MATERIAIS GRATUITOS ---------- */
.material-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 24px;
}
.material-card {
  position: relative;
  display: flex;
  flex-direction: column;
  border-radius: var(--radius-lg);
  background: #FFFFFF;
  border: 1px solid var(--paper-line);
  overflow: hidden;
  transition: transform .35s var(--ease-out), box-shadow .35s var(--ease-out);
}
.material-card:hover { transform: translateY(-6px); box-shadow: var(--shadow-lift); }
.material-card__cover {
  aspect-ratio: 16 / 8.4;
  display: grid;
  place-items: center;
  position: relative;
  background: linear-gradient(160deg, var(--navy-deep), var(--navy-2));
  overflow: hidden;
}
.material-card__cover .watermark { width: 200px; opacity: .1; top: auto; bottom: -34%; right: -12%; transform: rotate(10deg); }
.material-card__cover .doc {
  position: relative;
  z-index: 1;
  width: 96px;
  aspect-ratio: 3/4;
  border-radius: 8px;
  background: linear-gradient(165deg, var(--navy-2), var(--navy));
  border: 1px solid rgba(198,156,109,.45);
  box-shadow: 0 16px 32px rgba(4,12,22,.5);
  display: grid;
  place-items: center;
  transform: rotate(-4deg);
  transition: transform .4s var(--ease-out);
}
.material-card:hover .doc { transform: rotate(0deg) translateY(-4px); }
.material-card__cover .doc svg { width: 34px; height: 34px; stroke: var(--gold); fill: none; stroke-width: 1.5; }
.material-card__type {
  position: absolute;
  top: 14px; left: 14px;
  z-index: 2;
  background: var(--gold);
  color: var(--navy-deep);
  border-radius: 99px;
  padding: 5px 13px;
  font-size: 11px;
  font-weight: 800;
  letter-spacing: .1em;
  text-transform: uppercase;
}
.material-card__body { padding: 22px 22px 26px; display: flex; flex-direction: column; flex: 1; }
.material-card__body h3 { font-family: var(--font-serif); font-size: 17.5px; line-height: 1.45; margin-bottom: 10px; color: var(--ink); }
.material-card__body p { font-size: 14px; color: var(--ink-soft); flex: 1; }
.material-card__body .btn { margin-top: 18px; }

/* ---------- MODAL (captura gated) ---------- */
.modal {
  position: fixed;
  inset: 0;
  z-index: 200;
  display: grid;
  place-items: center;
  padding: 20px;
  background: rgba(4, 12, 22, .7);
  -webkit-backdrop-filter: blur(8px);
  backdrop-filter: blur(8px);
  opacity: 0;
  visibility: hidden;
  transition: opacity .35s var(--ease-out), visibility 0s .35s;
}
.modal.is-open { opacity: 1; visibility: visible; transition: opacity .35s var(--ease-out); }
.modal__card {
  width: min(480px, 100%);
  max-height: 90vh;
  overflow: auto;
  background: var(--offwhite);
  border-radius: var(--radius-lg);
  padding: clamp(26px, 4vw, 40px);
  position: relative;
  transform: translateY(24px) scale(.97);
  transition: transform .35s var(--ease-out);
  box-shadow: 0 40px 90px rgba(0,0,0,.45);
}
.modal.is-open .modal__card { transform: none; }
.modal__close {
  position: absolute;
  top: 14px; right: 14px;
  width: 38px; height: 38px;
  border: 1px solid rgba(14,39,63,.2);
  border-radius: 50%;
  background: none;
  cursor: pointer;
  font-size: 17px;
  color: var(--ink);
}
.modal__card h3 { font-family: var(--font-display); font-weight: 400; font-size: 24px; margin: 4px 0 6px; }
.modal__card > p { color: var(--ink-soft); font-size: 14.5px; margin-bottom: 18px; }

/* ---------- Reveals de linha (GSAP) ---------- */
.ln-wrap { overflow: hidden; display: block; }
.ln { display: block; will-change: transform; }

/* ---------- CTA sheen ---------- */
.btn--gold { position: relative; overflow: hidden; }
.btn--gold .sheen {
  position: absolute;
  top: -10%; bottom: -10%;
  width: 40%;
  left: -60%;
  background: linear-gradient(105deg, transparent, rgba(255,255,255,.35), transparent);
  transform: skewX(-18deg);
  animation: sheen 4.4s var(--ease-out) infinite;
  pointer-events: none;
}
@keyframes sheen { 0%, 70% { left: -60%; } 90%, 100% { left: 130%; } }

/* ---------- Responsivo V2 ---------- */
@media (max-width: 1024px) {
  .plans--v2 { grid-template-columns: repeat(2, 1fr); }
  .post-grid, .material-grid { grid-template-columns: repeat(2, 1fr); }
  .post-card--featured { flex-direction: column; }
  .post-card--featured .post-card__media { aspect-ratio: 16/9; flex: none; }
}
@media (max-width: 900px) {


  .trio { min-height: 0; margin-top: 8px; }


  .leaders { grid-template-columns: 1fr; max-width: 480px; margin-inline: auto; }
}
@media (max-width: 640px) {
  .plans--v2, .post-grid, .material-grid { grid-template-columns: 1fr; }



  .watermark { width: clamp(300px, 80vw, 420px); }
}
@media (prefers-reduced-motion: reduce) {
.typing i, .btn--gold .sheen { animation: none !important; }
  .mockup__row.is-pending { opacity: 1; transform: none; }
}

/* ============================================================
   V3 — HERO SLIDER PAPEL-RASGADO · ÍCONES PREENCHIDOS · PRODUTO
   ============================================================ */

/* ---------- Hero slider (banners rotativos, padrão G4) ---------- */
.hero-slider { position: relative; }
.hero-slide { display: none; }
.hero-slide.is-active { display: block; }
.hero-slider__arrow {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  z-index: 30;
  width: 52px; height: 52px;
  border-radius: 50%;
  border: 0;
  cursor: pointer;
  display: grid;
  place-items: center;
  background: var(--gold-deep);
  color: #fff;
  transition: background .25s, transform .25s var(--ease-out);
}
.hero-slider__arrow:hover { background: var(--gold); transform: translateY(-50%) scale(1.06); }
.hero-slider__arrow--prev { left: clamp(8px, 2vw, 28px); }
.hero-slider__arrow--next { right: clamp(8px, 2vw, 28px); }
.hero-slider__arrow svg { width: 20px; height: 20px; stroke: currentColor; fill: none; stroke-width: 2.4; }
.hero-slider__dots {
  position: absolute;
  bottom: 18px; left: 50%;
  transform: translateX(-50%);
  z-index: 30;
  display: flex;
  gap: 8px;
}
.hero-slider__dots button {
  width: 30px; height: 4px;
  border: 0;
  border-radius: 99px;
  background: rgba(198,156,109,.3);
  cursor: pointer;
  transition: background .3s;
}
.hero-slider__dots button.is-active { background: var(--gold); }

/* ---------- Slide papel-rasgado ---------- */
.hero--paper {
  position: relative;
  overflow: hidden;
  padding-top: 76px;
  color: var(--ink);
  background:
    repeating-linear-gradient(96deg, rgba(14,39,63,.022) 0 2px, transparent 2px 7px),
    radial-gradient(120% 90% at 8% 0%, #FBF8F1 0%, #F3EEE3 52%, #EAE2D2 100%);
}
.hero--paper::after {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='140' height='140'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='2'/%3E%3C/filter%3E%3Crect width='140' height='140' filter='url(%23n)' opacity='.05'/%3E%3C/svg%3E");
}
.hero--paper .hero__inner {
  position: relative;
  z-index: 2;
  display: grid;
  grid-template-columns: minmax(0, 1.02fr) minmax(0, .98fr);
  align-items: center;
  gap: clamp(24px, 3.5vw, 60px);
  padding-block: clamp(56px, 7vw, 96px) clamp(64px, 8vw, 104px);
}
.hero--paper .display-tag {
  font-family: var(--font-display);
  font-size: clamp(26px, 2.6vw, 38px);
  letter-spacing: .14em;
  color: var(--gold-deep);
  text-transform: uppercase;
  margin-bottom: 14px;
}
.hero--paper h1, .hero--paper h2.as-h1 {
  font-family: var(--font-display);
  font-weight: 400;
  font-size: clamp(30px, 3.6vw, 50px);
  line-height: 1.14;
  color: var(--ink);
}
.hero--paper h1 .em-serif, .hero--paper h2.as-h1 .em-serif { color: var(--gold-deep); font-style: italic; }
.hero--paper .lead { max-width: 520px; margin-top: 18px; }
.hero--paper .hero__ctas { margin-top: 32px; display: flex; gap: 14px; flex-wrap: wrap; }

/* Colagem de tiras rasgadas */









/* ---------- Ícones preenchidos em círculo (padrão G4 product) ---------- */
.ico-round {
  width: 44px; height: 44px;
  flex: none;
  border-radius: 50%;
  display: grid;
  place-items: center;
  background: var(--navy);
}
.ico-round svg { width: 22px; height: 22px; fill: var(--offwhite); stroke: none; }
.ico-round--gold { background: var(--gold); }
.ico-round--gold svg { fill: var(--navy-deep); }
.section--navy .ico-round, .section--deep .ico-round { background: var(--gold); }
.section--navy .ico-round svg, .section--deep .ico-round svg { fill: var(--navy-deep); }

/* Lista de features com ícone redondo */
.feat-list { display: grid; gap: 14px; }
.feat-list li { display: flex; align-items: center; gap: 14px; font-size: 15.5px; font-weight: 600; }

/* Chips de especificação (Formato / Acesso / Suporte...) */
.spec-chips {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
  gap: 14px;
}
.spec-chip {
  border: 1px solid var(--paper-line);
  border-radius: var(--radius);
  background: #fff;
  padding: 16px 18px;
}
.section--navy .spec-chip, .section--deep .spec-chip { background: var(--navy-2); border-color: var(--navy-line); }
.spec-chip b { display: block; font-size: 12px; letter-spacing: .1em; text-transform: uppercase; color: var(--gold-deep); margin-bottom: 4px; }
.section--navy .spec-chip b { color: var(--gold); }
.spec-chip span { font-size: 14.5px; font-weight: 700; }

/* ---------- Tabela comparativa (tradicional × nosso) ---------- */
.compare {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 22px;
  align-items: stretch;
}
.compare__col { border-radius: var(--radius-lg); padding: 32px 30px; }
.compare__col--them { background: transparent; border: 1px dashed rgba(14,39,63,.28); }
.section--navy .compare__col--them, .section--deep .compare__col--them { border-color: rgba(245,243,239,.25); }
.compare__col--us {
  background: linear-gradient(170deg, var(--navy), var(--navy-deep));
  border: 1px solid rgba(198,156,109,.5);
  box-shadow: var(--shadow-lift);
}
.compare__col h3 { font-family: var(--font-display); font-weight: 400; font-size: 22px; margin-bottom: 20px; }
.compare__col--us h3 { color: var(--gold-soft); }
.compare__col li { display: flex; gap: 12px; padding: 10px 0; font-size: 15px; border-top: 1px solid rgba(14,39,63,.1); align-items: flex-start; }
.compare__col--us li { border-top-color: var(--navy-line); color: var(--text-on-navy); }
.compare__col li svg { width: 18px; height: 18px; flex: none; margin-top: 3px; }
.compare__col--them li { color: var(--ink-soft); }
.section--navy .compare__col--them li, .section--deep .compare__col--them li { color: var(--text-on-navy); }

/* ---------- Card de preço "Incluso / Bônus" ---------- */
.price-detail {
  max-width: 620px;
  margin-inline: auto;
  background: #fff;
  border: 1px solid var(--paper-line);
  border-radius: var(--radius-lg);
  box-shadow: var(--shadow-lift);
  overflow: hidden;
}
.price-detail__head { padding: 30px 32px 24px; border-bottom: 1px solid var(--paper-line); text-align: center; }
.price-detail__head h3 { font-family: var(--font-display); font-weight: 400; font-size: 30px; }
.price-detail__head .amount { font-size: clamp(34px, 3.4vw, 44px); font-weight: 800; color: var(--ink); }
.price-detail__head .amount small { font-size: 15px; font-weight: 600; color: var(--ink-soft); }
.price-detail__body { padding: 26px 32px 32px; }
.price-detail__body h4 { font-size: 12.5px; letter-spacing: .12em; text-transform: uppercase; color: var(--gold-deep); margin: 18px 0 10px; }
.price-detail__body li { display: flex; gap: 10px; padding: 7px 0; font-size: 15px; color: var(--ink-soft); align-items: flex-start; }
.price-detail__body li svg { width: 17px; height: 17px; flex: none; margin-top: 3px; stroke: var(--gold-deep); fill: none; stroke-width: 2; }
.price-detail .btn { margin-top: 22px; }

/* ---------- Responsivo V3 ---------- */
@media (max-width: 900px) {
  .hero--paper .hero__inner { grid-template-columns: 1fr; }

  .compare { grid-template-columns: 1fr; }
}
@media (max-width: 640px) {
  .hero-slider__arrow { width: 42px; height: 42px; }
  .hero-slider__arrow--prev { left: 6px; }
  .hero-slider__arrow--next { right: 6px; }
}
@media (prefers-reduced-motion: reduce) {
  .hero-slider__arrow { transition: none; }
}

/* Troca de slides: entrada por CSS (compositor-friendly) */
@keyframes slideFade { from { opacity: 0; transform: translateY(22px); } }
.hero-slide.is-entering .hero__content > *,
.hero-slide.is-entering .hero--paper .hero__inner > div:first-child > * { animation: slideFade .55s var(--ease-out) backwards; }
.hero-slide.is-entering .hero__content > *:nth-child(2),
.hero-slide.is-entering .hero--paper .hero__inner > div:first-child > *:nth-child(2) { animation-delay: .08s; }
.hero-slide.is-entering .hero__content > *:nth-child(3),
.hero-slide.is-entering .hero--paper .hero__inner > div:first-child > *:nth-child(3) { animation-delay: .16s; }
.hero-slide.is-entering .hero__content > *:nth-child(4),
.hero-slide.is-entering .hero--paper .hero__inner > div:first-child > *:nth-child(4) { animation-delay: .24s; }
@media (prefers-reduced-motion: reduce) {
  .hero-slide.is-entering * { animation: none !important; }
}

/* ============================================================
   V3.1 — BANNER PAPEL-RASGADO fiel à referência G4
   ============================================================ */
.hero--paper {
  background:
    radial-gradient(120% 100% at 100% 0%, rgba(120, 92, 52, .16), transparent 42%),
    radial-gradient(90% 70% at 0% 100%, rgba(120, 92, 52, .12), transparent 46%),
    radial-gradient(50% 40% at 24% 30%, rgba(255, 252, 244, .5), transparent 70%),
    radial-gradient(160% 120% at 50% 50%, #F1E8D4 0%, #EAE0C8 55%, #DECFAF 100%);
}
.hero--paper::before {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  background:
    radial-gradient(34% 26% at 78% 82%, rgba(112, 84, 44, .07), transparent 70%),
    radial-gradient(26% 20% at 12% 14%, rgba(112, 84, 44, .06), transparent 70%),
    repeating-linear-gradient(94deg, rgba(90, 66, 34, .016) 0 1px, transparent 1px 6px);
}
.hero--paper .hero__inner {
  grid-template-columns: minmax(0, 52%) minmax(0, 1fr);
  align-items: center;
  min-height: clamp(480px, 44vw, 640px);
}
.hero--paper .display-tag {
  font-size: clamp(34px, 4vw, 58px);
  letter-spacing: .16em;
  color: #A87F4F;
  text-shadow: 0 1px 0 rgba(255,255,255,.5);
  margin-bottom: 18px;
}
.hero--paper h1, .hero--paper h2.as-h1 {
  font-family: var(--font-sans);
  font-weight: 500;
  font-size: clamp(26px, 2.9vw, 42px);
  line-height: 1.3;
  letter-spacing: -.01em;
  color: var(--navy);
}
.hero--paper h1 .em-serif, .hero--paper h2.as-h1 .em-serif {
  font-size: 1.06em;
  color: #A87F4F;
}
.hero--paper .lead { font-size: 15.5px; line-height: 1.7; max-width: 480px; margin-top: 20px; }
.hero--paper .hero__ctas { margin-top: 30px; }

/* Colagem full-bleed à direita (sangra topo/base/borda) */










/* Setas do slider — círculos vermelho-queimado, como a referência */
.hero-slider__arrow {
  background: #883325;
  color: #F3EADA;
  width: 56px; height: 56px;
  box-shadow: 0 10px 24px rgba(70, 24, 14, .35);
}
.hero-slider__arrow:hover { background: #9C4030; transform: translateY(-50%) scale(1.07); }

@media (max-width: 900px) {
  .hero--paper .hero__inner { grid-template-columns: 1fr; min-height: 0; }





}

/* V3.1b — sem sobreposição texto × colagem */
@media (min-width: 901px) {
  .hero--paper .hero__inner { grid-template-columns: minmax(0, 46%) minmax(0, 1fr); }

}


/* ============================================================
   V3.2 — RAIL (carrossel-cardápio) · PLATAFORMA MULTI-TELAS
   ============================================================ */

/* ---------- Rail: carrossel horizontal clean ---------- */
.rail { position: relative; }
.rail__nav {
  position: absolute;
  top: -74px;
  right: 0;
  display: flex;
  gap: 10px;
}
.rail__nav button {
  width: 46px; height: 46px;
  border-radius: 50%;
  border: 1px solid rgba(198,156,109,.5);
  background: transparent;
  color: var(--gold);
  cursor: pointer;
  display: grid;
  place-items: center;
  transition: all .25s var(--ease-out);
}
.section--light .rail__nav button, .section--mist .rail__nav button { color: var(--gold-deep); border-color: rgba(168,127,79,.45); }
.rail__nav button:hover:not(:disabled) { background: var(--gold); color: var(--navy-deep); transform: scale(1.06); }
.rail__nav button:disabled { opacity: .3; cursor: default; }
.rail__nav svg { width: 18px; height: 18px; stroke: currentColor; fill: none; stroke-width: 2.2; }
.rail__track {
  display: grid;
  grid-auto-flow: column;
  grid-auto-columns: clamp(250px, 26vw, 310px);
  gap: 20px;
  overflow-x: auto;
  scroll-snap-type: x mandatory;
  scroll-behavior: smooth;
  padding: 4px 4px 20px;
  scrollbar-width: none;
  -webkit-overflow-scrolling: touch;
}
.rail__track::-webkit-scrollbar { display: none; }
.rail__track > * { scroll-snap-align: start; }
.rail__track .card { height: 100%; }
.rail__track .profile { height: auto; align-self: start; }
@media (max-width: 640px) {
  .rail__nav { position: static; justify-content: flex-end; margin-bottom: 14px; }
  .rail__track { grid-auto-columns: min(78vw, 300px); }
}

/* ---------- Plataforma multi-telas com cursor ---------- */
.mockup__side a { cursor: default; transition: color .3s, background .3s; }
.mockup__screens { position: relative; min-height: 330px; }
.screen { display: none; }
.screen.is-on { display: block; animation: screenIn .45s var(--ease-out); }
@keyframes screenIn { from { opacity: 0; transform: translateY(10px); } }

.mcursor {
  position: absolute;
  z-index: 20;
  top: 0; left: 0;
  width: 22px; height: 22px;
  pointer-events: none;
  transition: transform 1s cubic-bezier(.45,.05,.25,1);
  filter: drop-shadow(0 3px 6px rgba(0,0,0,.5));
}
.mcursor svg { width: 100%; height: 100%; }
.mcursor.is-click svg { animation: curClick .32s var(--ease-out); }
@keyframes curClick { 40% { transform: scale(.78); } }
.mcursor .ripple {
  position: absolute;
  top: 2px; left: 2px;
  width: 18px; height: 18px;
  border-radius: 50%;
  border: 2px solid var(--gold);
  opacity: 0;
  transform: scale(.4);
}
.mcursor.is-click .ripple { animation: ripple .5s var(--ease-out); }
@keyframes ripple { 0% { opacity: .9; transform: scale(.4); } 100% { opacity: 0; transform: scale(2.4); } }

/* elementos de tela */
.scr-table { display: grid; gap: 8px; }
.scr-row {
  display: grid;
  grid-template-columns: 1.5fr auto auto;
  gap: 12px;
  align-items: center;
  padding: 12px 16px;
  border-radius: 8px;
  background: rgba(22,51,79,.5);
  border: 1px solid var(--navy-line);
  font-size: 12.5px;
  color: var(--text-on-navy);
  transition: border-color .3s, background .3s;
}
.scr-row b { color: var(--text-on-navy-strong); font-weight: 700; }
.scr-row.is-hot { border-color: rgba(198,156,109,.55); background: rgba(198,156,109,.08); }
.pill {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 4px 11px;
  border-radius: 99px;
  font-size: 11px;
  font-weight: 800;
  letter-spacing: .04em;
  background: rgba(127,200,169,.14);
  color: #7FC8A9;
  border: 1px solid rgba(127,200,169,.35);
}
.pill--gold { background: rgba(198,156,109,.12); color: var(--gold-soft); border-color: rgba(198,156,109,.4); }
.pill--dim { background: rgba(245,243,239,.06); color: rgba(245,243,239,.6); border-color: rgba(245,243,239,.16); }

/* score gauge */
.gauge { display: flex; align-items: center; gap: 22px; margin: 18px 0; }
.gauge__ring {
  width: 108px; height: 108px;
  border-radius: 50%;
  display: grid;
  place-items: center;
  background: conic-gradient(var(--gold) calc(var(--val, 0) * 1%), rgba(245,243,239,.09) 0);
  transition: --val 1.2s;
  position: relative;
}
.gauge__ring::before { content: ""; position: absolute; inset: 9px; border-radius: 50%; background: var(--navy-deep); }
.gauge__ring b { position: relative; font-family: var(--font-display); font-size: 26px; color: var(--gold-soft); font-weight: 400; }
.gauge ul { display: grid; gap: 8px; font-size: 12.5px; color: var(--text-on-navy); }

/* funil */
.funnel { display: grid; gap: 10px; margin-top: 16px; }
.funnel div { display: grid; grid-template-columns: 120px 1fr auto; gap: 12px; align-items: center; font-size: 12.5px; color: var(--text-on-navy); }
.funnel i {
  display: block;
  height: 10px;
  border-radius: 99px;
  background: linear-gradient(90deg, var(--gold-deep), var(--gold));
  transform-origin: left;
  transform: scaleX(0);
  transition: transform .9s var(--ease-out);
}
.screen.is-on .funnel i { transform: scaleX(1); }
.funnel b { color: var(--text-on-navy-strong); }

/* barras growth */
.bars { display: flex; align-items: flex-end; gap: 12px; height: 130px; margin-top: 18px; }
.bars i {
  flex: 1;
  border-radius: 6px 6px 2px 2px;
  background: linear-gradient(180deg, var(--gold), var(--gold-deep));
  opacity: .85;
  transform-origin: bottom;
  transform: scaleY(0);
  transition: transform .8s var(--ease-out);
}
.screen.is-on .bars i { transform: scaleY(1); }
.bars i:nth-child(odd) { opacity: .55; }

@media (prefers-reduced-motion: reduce) {
  .mcursor { display: none; }
  .screen { animation: none; }
  .funnel i, .bars i { transform: none; transition: none; }
}

/* ============================================================
   V3.3 — SEÇÃO "O QUE É" (papel + gravura) · telas clicáveis ·
           rostos do banner calibrados
   ============================================================ */

/* Rostos das tiras: enquadramento centralizado e responsivo */




/* Seção papel (reutilizável) */
.section--paper {
  position: relative;
  overflow: clip;
  color: var(--ink);
  background:
    radial-gradient(120% 100% at 100% 100%, rgba(120, 92, 52, .14), transparent 44%),
    radial-gradient(70% 60% at 18% 22%, rgba(255, 252, 244, .55), transparent 70%),
    radial-gradient(160% 120% at 50% 50%, #F2E9D6 0%, #EAE0C8 58%, #DFD1B2 100%);
}
.section--paper::before {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  background:
    radial-gradient(30% 22% at 82% 18%, rgba(112, 84, 44, .06), transparent 70%),
    repeating-linear-gradient(94deg, rgba(90, 66, 34, .015) 0 1px, transparent 1px 6px);
}
.section--paper h1, .section--paper h2, .section--paper h3 { color: var(--navy); }
.section--paper p, .section--paper .lead { color: #4A3F2C; }
.section--paper .em-serif { color: #A87F4F; }

/* Gravura sangrando na borda, sobre rasgo de papel */
.whatis {
  display: grid;
  grid-template-columns: minmax(0, 1.02fr) minmax(0, .98fr);
  gap: clamp(24px, 4vw, 56px);
  align-items: center;
}
.whatis__art {
  position: relative;
  align-self: end;
  margin: -12% -18% -18% 0;
}

.whatis__art img {
  position: relative;
  z-index: 1;
  width: 108%;
  max-width: none;
  filter: drop-shadow(-10px 14px 20px rgba(46, 32, 12, .3));
}
.whatis__copy .lead { font-size: 16.5px; margin-top: 18px; }
.whatis__pillars {
  display: grid;
  gap: 10px;
  margin-top: 26px;
}
.whatis__pillars li {
  display: flex;
  gap: 12px;
  align-items: flex-start;
  font-size: 15px;
  font-weight: 600;
  color: #4A3F2C;
}
.whatis__pillars li b { color: var(--navy); font-weight: 800; }
.whatis__pillars li svg { width: 18px; height: 18px; flex: none; margin-top: 3px; stroke: #A87F4F; fill: none; stroke-width: 2.2; }
.whatis__copy .btn { margin-top: 30px; }

@media (max-width: 900px) {
  .whatis { grid-template-columns: 1fr; }
  .whatis__art { order: 2; margin: 8px -12% -16% -6%; }
  .whatis__art img { width: 104%; }
}

/* Telas clicáveis (modo manual) */
[data-platform-demo] .mockup__side a { cursor: pointer; pointer-events: auto; }
[data-platform-demo] .mockup__side a:hover { color: var(--gold-soft); background: rgba(198,156,109,.06); }
[data-platform-demo].is-manual .mcursor { opacity: 0; transition: opacity .3s; }
.mockup__hint {
  position: absolute;
  z-index: 15;
  right: 14px;
  top: 12px;
  font-size: 10.5px;
  font-weight: 700;
  letter-spacing: .08em;
  text-transform: uppercase;
  color: rgba(245,243,239,.5);
  border: 1px solid var(--navy-line);
  border-radius: 99px;
  padding: 4px 12px;
}

/* V3.5 — Founder sempre no centro, com primazia visual */
.leader--founder {
  border: 1px solid rgba(198,156,109,.65);
  box-shadow: 0 0 0 1px rgba(198,156,109,.25), 0 26px 60px rgba(8,23,38,.22), 0 0 44px rgba(198,156,109,.14);
}
@media (min-width: 901px) {
  .leader--founder { transform: scale(1.045); z-index: 2; }
  .leader--founder:hover img { transform: scale(1.03); }
}
.leader--founder .leader__meta span { color: var(--gold); font-size: 13px; }
/* no mobile (coluna única) o Founder vem PRIMEIRO */
@media (max-width: 900px) {
  .leaders { display: flex; flex-direction: column; }
  .leader--founder { order: -1; }
}

/* ============================================================
   V3.6 — Seção "O que é": responsividade 100% (fix esticamento)
   ============================================================ */
.whatis { align-items: center; }
.whatis__art {
  position: relative;
  align-self: center;
  margin: 0;
  min-width: 0;
}
.whatis__art img {
  width: 100%;
  height: auto;
  max-width: none;
  display: block;
}


/* Desktop largo: sangria sutil e CONTROLADA na direita/base */
@media (min-width: 1101px) {
  .whatis__art { margin: 0 clamp(-110px, -7vw, -36px) -9% 0; }
}
/* Notebook/tablet horizontal: sem sangria lateral, leve na base */
@media (min-width: 901px) and (max-width: 1100px) {
  .whatis__art { margin: 0 0 -6% 0; }
}
/* Mobile/tablet vertical: arte abaixo do texto, largura total, sem cortes laterais */
@media (max-width: 900px) {
  .whatis { grid-template-columns: 1fr; }
  .whatis__art {
    order: 2;
    margin: 10px 0 calc(-1 * var(--section-y)) 0;
    width: 100%;
  }
  .whatis__art img { width: 100%; }

}

/* ============================================================
   V4 — PERGAMINHO EM CSS (fundoantigo) · SEM LISTRAS ·
        BANNER ACOLHIMENTO · ÓRBITA VIVA · DIAGNÓSTICO REAL
   ============================================================ */

/* ---------- Pergaminho codificado (recria fundoantigo.png) ---------- */
.bg-parchment, .hero--paper, .section--paper {
  background:
    radial-gradient(42% 34% at 97% 6%, rgba(150,117,68,.30), transparent 68%),
    radial-gradient(30% 40% at 0% 90%, rgba(150,117,68,.28), transparent 66%),
    radial-gradient(20% 16% at 6% 8%, rgba(150,117,68,.14), transparent 70%),
    radial-gradient(34% 22% at 90% 98%, rgba(150,117,68,.20), transparent 70%),
    radial-gradient(140% 110% at 50% 50%, transparent 58%, rgba(139,106,58,.16) 100%),
    radial-gradient(120% 90% at 50% 42%, #F6EEDE 0%, #F0E6CF 48%, #E8DBBD 76%, #DECDA6 100%);
}
/* remover TODAS as listrinhas (repeating gradients) */
.hero--paper::before, .section--paper::before { background: none; }

/* textura orgânica sutil (ruído, não listras) */
.hero--paper::after, .section--paper::after {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  opacity: .5;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.65' numOctaves='2'/%3E%3C/filter%3E%3Crect width='160' height='160' filter='url(%23n)' opacity='.06'/%3E%3C/svg%3E");
}

/* ---------- Banner 2 — Acolhimento (tríade) ---------- */
.hero--triade {
  position: relative;
  overflow: hidden;
  padding-top: 76px;
}
.hero--triade .hero__inner {
  position: relative;
  z-index: 2;
  display: grid;
  grid-template-columns: minmax(0, 50%) minmax(0, 1fr);
  align-items: center;
  gap: clamp(16px, 3vw, 44px);
  min-height: clamp(420px, 38vw, 560px);
}
.hero--triade .display-tag {
  font-family: var(--font-display);
  font-size: clamp(22px, 2.4vw, 34px);
  letter-spacing: .14em;
  text-transform: uppercase;
  color: #A87F4F;
  margin-bottom: 12px;
}
.hero--triade h2.as-h1 {
  font-family: var(--font-sans);
  font-weight: 500;
  font-size: clamp(22px, 2.3vw, 33px);
  line-height: 1.32;
  color: var(--navy);
}
.hero--triade h2.as-h1 .em-serif { font-size: 1.06em; color: #A87F4F; font-style: italic; }
.hero--triade .lead { font-size: 14.5px; line-height: 1.7; max-width: 440px; margin-top: 14px; color: #4A3F2C; }
.hero--triade .hero__ctas { margin-top: 24px; display: flex; gap: 12px; flex-wrap: wrap; }
.hero--triade .hero__ctas .btn { padding: 13px 26px; font-size: 14.5px; }





@media (max-width: 900px) {
  .hero--triade .hero__inner { grid-template-columns: 1fr; min-height: 0; padding-bottom: 0; }


}

/* ---------- Colagem do banner 1 mais clean e visível ---------- */






/* Slider mais clean */
.hero-slider__arrow { width: 46px; height: 46px; box-shadow: 0 8px 18px rgba(70, 24, 14, .28); }
.hero-slider__arrow svg { width: 17px; height: 17px; }
.hero-slider__dots { bottom: 14px; }
.hero-slider__dots button { width: 24px; height: 3px; }

/* ---------- Órbita: menor + linhas correndo ---------- */
.orbit-wrap { width: min(560px, calc(100% - 116px)); }
.orbit-flow {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  pointer-events: none;
}
.orbit-flow circle {
  fill: none;
  stroke: rgba(198,156,109,.5);
  stroke-width: 1.4;
  stroke-dasharray: 3 14;
  stroke-linecap: round;
  animation: orbitFlow 26s linear infinite;
}
.orbit-flow circle:nth-child(2) {
  stroke: rgba(198,156,109,.32);
  stroke-dasharray: 2 11;
  animation-duration: 34s;
  animation-direction: reverse;
}
@keyframes orbitFlow { to { stroke-dashoffset: -340; } }
.orbit-ring { border-color: rgba(255,255,255,.05); }
.orbit-ring--inner { border-style: solid; opacity: .5; }
@media (prefers-reduced-motion: reduce) { .orbit-flow circle { animation: none; } }

/* ---------- Gravura: dissolver o corte inferior ---------- */
.whatis__art img {
  -webkit-mask-image: linear-gradient(180deg, #000 78%, rgba(0,0,0,.55) 90%, transparent 99%);
  mask-image: linear-gradient(180deg, #000 78%, rgba(0,0,0,.55) 90%, transparent 99%);
}

/* ---------- Diagnóstico hiper-realista ---------- */
.scr-topbar {
  display: flex;
  align-items: center;
  gap: 10px;
  margin-bottom: 14px;
}
.scr-search {
  flex: 1;
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 8px 12px;
  border-radius: 8px;
  background: rgba(245,243,239,.05);
  border: 1px solid var(--navy-line);
  color: rgba(245,243,239,.45);
  font-size: 11.5px;
}
.scr-search svg { width: 13px; height: 13px; stroke: currentColor; fill: none; stroke-width: 2; }
.scr-user {
  display: flex;
  align-items: center;
  gap: 8px;
  font-size: 11px;
  font-weight: 700;
  color: var(--text-on-navy);
}
.scr-user i {
  width: 26px; height: 26px;
  border-radius: 50%;
  background: linear-gradient(135deg, var(--gold), var(--gold-deep));
  color: var(--navy-deep);
  display: grid;
  place-items: center;
  font-style: normal;
  font-size: 10px;
  font-weight: 800;
  position: relative;
}
.scr-user i::after {
  content: "";
  position: absolute;
  top: -1px; right: -1px;
  width: 7px; height: 7px;
  border-radius: 50%;
  background: #7FC8A9;
  border: 1.5px solid var(--navy-deep);
}
.mockup__row { cursor: pointer; }
.mockup__row:active { transform: scale(.985); }
.mockup__row.is-open {
  border-color: rgba(198,156,109,.55);
  background: rgba(198,156,109,.08);
}
.mockup__row-detail {
  display: none;
  padding: 10px 16px 12px;
  margin: -6px 0 4px;
  border-radius: 0 0 8px 8px;
  border: 1px solid var(--navy-line);
  border-top: 0;
  background: rgba(8,23,38,.5);
  font-size: 11.5px;
  color: rgba(245,243,239,.65);
  line-height: 1.6;
}
.mockup__row-detail.is-open { display: block; animation: screenIn .3s var(--ease-out); }
.scr-actions { display: flex; gap: 8px; margin-top: 16px; }
.scr-btn {
  padding: 8px 16px;
  border-radius: 7px;
  border: 1px solid rgba(198,156,109,.45);
  background: var(--gold);
  color: var(--navy-deep);
  font-size: 11.5px;
  font-weight: 800;
  cursor: pointer;
  transition: transform .2s var(--ease-out), background .2s;
}
.scr-btn:active { transform: scale(.95); }
.scr-btn--ghost { background: transparent; color: var(--gold-soft); }
.scr-btn--ghost:hover { background: rgba(198,156,109,.1); }

/* V4.1 — tríade ancorada na base (corte da mesa invisível) */
.hero--triade .hero__inner { padding-bottom: 0; }


@media (max-width: 900px) {
  .hero--triade .hero__inner { padding-bottom: 0; }

}

/* ============================================================
   V4.2 — "O que é": responsividade fina em 5 faixas
   ============================================================ */
/* base já definida: width 100%, height auto, máscara de fade no pé */

/* ≥1200 — sangria elegante à direita e na base */
@media (min-width: 1200px) {
  .whatis { grid-template-columns: minmax(0, 1fr) minmax(0, 1.04fr); }
  .whatis__art { margin: 0 clamp(-110px, -7vw, -36px) -9% 0; }
}
/* 1000–1199 — mantém lado a lado com sangria reduzida (arte não encolhe demais) */
@media (min-width: 1000px) and (max-width: 1199px) {
  .whatis { grid-template-columns: minmax(0, 1fr) minmax(0, 1.08fr); gap: clamp(18px, 2.5vw, 32px); }
  .whatis__art { margin: 0 -24px -7% 0; }
}
/* 901–999 — coluna do texto ficaria estreita: EMPILHA mais cedo */
@media (min-width: 901px) and (max-width: 999px) {
  .whatis { grid-template-columns: 1fr; }
  .whatis__art {
    order: 2;
    margin: 14px auto calc(-1 * var(--section-y));
    width: min(88%, 640px);
  }

}
/* 561–900 — empilhado, arte quase total */
@media (min-width: 561px) and (max-width: 900px) {
  .whatis__art { width: min(94%, 600px); margin-inline: auto; }
}
/* ≤560 — arte total com leve sangria à direita (personagem grande e legível) */
@media (max-width: 560px) {
  .whatis__art { width: 104%; margin: 10px -4% calc(-1 * var(--section-y)) 0; }

  .whatis__copy .lead { font-size: 15px; }
  .whatis__pillars li { font-size: 14px; }
}

/* ============================================================
   V4.3 — Colagem CLEAN e banners 100% congruentes
   ============================================================ */
/* Altura e grade idênticas nos dois banners */
.hero--paper .hero__inner, .hero--triade .hero__inner {
  min-height: clamp(440px, 40vw, 580px);
  grid-template-columns: minmax(0, 46%) minmax(0, 1fr);
  align-items: center;
}
@media (min-width: 901px) {
  .hero--paper .hero__inner { grid-template-columns: minmax(0, 46%) minmax(0, 1fr); }

}
/* Tiras uniformes: mesmo tamanho, mesmo eixo, espaçamento regular */





@media (max-width: 900px) {
  .hero--paper .hero__inner, .hero--triade .hero__inner { min-height: 0; grid-template-columns: 1fr; }



}

/* ============================================================
   V4.4 — Gravura: avatar mais abaixo + papel cobrindo sofá/pernas
   ============================================================ */
/* o rasgo de papel cresce para baixo e abraça o sofá e as pernas */

/* figura desce um pouco dentro da composição */
.whatis__art img { transform: translateY(7%); }
/* a máscara passa a desvanecer um pouco mais cedo (pé sempre dissolvido) */
.whatis__art img {
  -webkit-mask-image: linear-gradient(180deg, #000 74%, rgba(0,0,0,.5) 88%, transparent 98%);
  mask-image: linear-gradient(180deg, #000 74%, rgba(0,0,0,.5) 88%, transparent 98%);
}
@media (min-width: 1000px) and (max-width: 1199px) {
  .whatis__art img { transform: translateY(6%); }

}
@media (max-width: 999px) {
  .whatis__art img { transform: translateY(4%); }

}

/* ============================================================
   V4.5 — Banner 1 com trio recortado · Banner 2 com mapa da jornada
   ============================================================ */
/* Trio no banner 1: papel rasgado atrás + recorte ancorado na base */
.trio-hero {
  position: relative;
  align-self: end;
  display: flex;
  justify-content: center;
  min-width: 0;
}

.trio-hero img {
  position: relative;
  z-index: 1;
  width: min(100%, 720px);
  height: auto;
  filter: drop-shadow(0 14px 22px rgba(46, 32, 12, .32)) saturate(.96);
  margin-bottom: -2px;
  -webkit-mask-image: linear-gradient(180deg, #000 88%, rgba(0,0,0,.6) 96%, transparent 100%);
  mask-image: linear-gradient(180deg, #000 88%, rgba(0,0,0,.6) 96%, transparent 100%);
}
.hero--paper .hero__inner { align-items: end; }
.hero--paper .hero__inner > div:first-child { align-self: center; padding-bottom: clamp(16px, 3vw, 40px); }
@media (max-width: 900px) {
  .trio-hero { margin-top: 8px; }
  .trio-hero img { width: min(98%, 560px); }
}

/* ============================================================
   V5 — BANNERS 16:9 · conteúdo proporcional ao quadro ·
        mapa refinado · tríade em busto
   ============================================================ */
@media (min-width: 901px) {
  .hero--paper, .hero--triade {
    aspect-ratio: 16 / 9;
    max-height: min(88vh, 880px);
    display: flex;
    align-items: stretch;
  }
  .hero--paper > .container, .hero--triade > .container { display: flex; }
  .hero--paper .hero__inner, .hero--triade .hero__inner {
    min-height: 0;
    flex: 1;
    padding-block: clamp(24px, 3vw, 56px) 0;
  }
  /* tipografia e elementos escalam com a LARGURA do banner (vw) */
  .hero--paper .display-tag { font-size: clamp(26px, 3.6vw, 54px); margin-bottom: 1vw; }
  .hero--paper h2.as-h1 { font-size: clamp(22px, 2.5vw, 40px); }
  .hero--paper .lead { font-size: clamp(12px, 1.05vw, 16px); max-width: 34vw; margin-top: 1.2vw; }
  .hero--paper .hero__ctas { margin-top: 1.8vw; gap: .9vw; }
  .hero--paper .hero__ctas .btn { padding: 1vw 2vw; font-size: clamp(12px, 1.05vw, 16px); }
  .trio-hero img { width: min(100%, 46vw); }
  .hero--triade .display-tag { font-size: clamp(20px, 2.2vw, 34px); margin-bottom: .8vw; }
  .hero--triade h2.as-h1 { font-size: clamp(20px, 2.1vw, 34px); }
  .hero--triade .lead { font-size: clamp(12px, 1vw, 15px); max-width: 30vw; margin-top: 1vw; }
  .hero--triade .hero__ctas { margin-top: 1.6vw; gap: .8vw; }
  .hero--triade .hero__ctas .btn { padding: .9vw 1.8vw; font-size: clamp(12px, 1vw, 15px); }
}
/* tríade em busto: sobe do rodapé do quadro, fade mais alto */
.trio-hero img {
  -webkit-mask-image: linear-gradient(180deg, #000 80%, rgba(0,0,0,.5) 93%, transparent 100%);
  mask-image: linear-gradient(180deg, #000 80%, rgba(0,0,0,.5) 93%, transparent 100%);
}

/* V5.1 — equilíbrio interno do banner 1 em 16:9 */
@media (min-width: 901px) {
  .hero--paper .hero__inner { grid-template-columns: minmax(0, 48%) minmax(0, 1fr); }
  .hero--paper .display-tag { font-size: clamp(24px, 2.9vw, 44px); white-space: nowrap; }
  .hero--paper h2.as-h1 { font-size: clamp(22px, 2.35vw, 36px); }
  .hero--paper .lead { max-width: 38vw; }
  .trio-hero img { width: min(100%, 58vw); }

}

/* ============================================================
   V5.2 — Banners FULL SCREEN (tela cheia, como antes)
   ============================================================ */
@media (min-width: 901px) {
  .hero--paper, .hero--triade {
    aspect-ratio: auto;
    height: calc(100vh - 76px);
    min-height: 620px;
    max-height: 1100px;
  }
}

/* ============================================================
   V6 — JANELA macOS BRANCA · planos sem bugs · gravura colada ·
        trio elevado com névoa branca e sombra
   ============================================================ */
.mockup--mac {
  background: #FFFFFF;
  border: 1px solid rgba(0,0,0,.1);
  border-radius: 12px;
  box-shadow: 0 1px 2px rgba(0,0,0,.08), 0 24px 68px rgba(8,23,38,.28);
  font-size: 13px;
}

.mockup--mac .mockup__bar {
  position: relative;
  background: linear-gradient(180deg, #F6F6F6, #ECECEC);
  border-bottom: 1px solid rgba(0,0,0,.09);
  padding: 12px 16px;
  display: flex;
  align-items: center;
  gap: 8px;
}
.tl { width: 12px; height: 12px; border-radius: 50%; display: inline-block; }
.tl--r { background: #FF5F57; border: .5px solid rgba(0,0,0,.12); }
.tl--y { background: #FEBC2E; border: .5px solid rgba(0,0,0,.12); }
.tl--g { background: #28C840; border: .5px solid rgba(0,0,0,.12); }
.mockup__title {
  position: absolute;
  left: 50%; top: 50%;
  transform: translate(-50%, -50%);
  font-size: 12.5px;
  font-weight: 600;
  color: rgba(0,0,0,.55);
  white-space: nowrap;
}
.mockup--mac .mockup__side { background: #F5F5F7; border-right: 1px solid rgba(0,0,0,.08); }
.mockup--mac .mockup__side a { color: rgba(0,0,0,.68); font-weight: 600; }
.mockup--mac .mockup__side a:hover { color: var(--navy); background: rgba(14,39,63,.05); }
.mockup--mac .mockup__side a.is-active {
  color: var(--navy);
  background: linear-gradient(90deg, rgba(198,156,109,.18), transparent);
  border-left: 2px solid var(--gold-deep);
}
.mockup--mac .mockup__main { color: rgba(0,0,0,.72); }
.mockup--mac .mockup__main h4 { color: var(--navy); }
.mockup--mac .mockup__meta { color: rgba(0,0,0,.45); }
.mockup--mac .mockup__meta em { color: var(--gold-deep) !important; }
.mockup--mac .progress { background: #E9E9EE; }
.mockup--mac .mockup__pill { background: rgba(198,156,109,.1); border-color: rgba(168,127,79,.4); color: #8A6538; }
.mockup--mac .mockup__row { background: #F7F7F9; border-color: #E5E5EA; color: rgba(0,0,0,.6); }
.mockup--mac .mockup__row b { color: var(--navy); }
.mockup--mac .mockup__row em { color: #8A6538; }
.mockup--mac .mockup__row em.is-ok { color: #1E8E4E; }
.mockup--mac .mockup__row.is-open, .mockup--mac .scr-row.is-hot { background: rgba(198,156,109,.1); border-color: rgba(168,127,79,.45); }
.mockup--mac .mockup__row-detail { background: #FBFBFD; border-color: #E5E5EA; color: rgba(0,0,0,.55); }
.mockup--mac .scr-row { background: #F7F7F9; border-color: #E5E5EA; color: rgba(0,0,0,.6); }
.mockup--mac .scr-row b { color: var(--navy); }
.mockup--mac .pill { background: rgba(52,199,89,.12); color: #1E8E4E; border-color: rgba(52,199,89,.35); }
.mockup--mac .pill--gold { background: rgba(198,156,109,.12); color: #8A6538; border-color: rgba(168,127,79,.4); }
.mockup--mac .pill--dim { background: rgba(0,0,0,.05); color: rgba(0,0,0,.45); border-color: rgba(0,0,0,.12); }
.mockup--mac .scr-search { background: rgba(0,0,0,.045); border-color: rgba(0,0,0,.08); color: rgba(0,0,0,.4); }
.mockup--mac .scr-user { color: rgba(0,0,0,.65); }
.mockup--mac .scr-user i::after { border-color: #fff; }
.mockup--mac .gauge__ring::before { background: #FFFFFF; }
.mockup--mac .gauge__ring b { color: var(--gold-deep); }
.mockup--mac .gauge ul, .mockup--mac .funnel div { color: rgba(0,0,0,.6); }
.mockup--mac .funnel b { color: var(--navy); }
.mockup--mac .scr-btn--ghost { color: #8A6538; }

/* Planos: grid sem bugs em qualquer largura */
.plans, .plans--v2 { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.plan, .plan--v2 { min-width: 0; }
.plan h3, .plan p, .plan .btn { overflow-wrap: break-word; }
@media (max-width: 1140px) and (min-width: 641px) {
  .plans--v2 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 640px) {
  .plans, .plans--v2 { grid-template-columns: 1fr; }
}

/* Gravura colada na base do papel */


/* Trio: elevado + névoa branca sutil + sombra de chão */
@media (min-width: 901px) {
  .trio-hero img { margin-bottom: 2.6vw; }

}


.trio-hero img { -webkit-mask-image: none; mask-image: none; }
@media (max-width: 900px) {
  .trio-hero img { margin-bottom: 22px; }


}

/* ============================================================
   V7 — Nav dropdown (padrão G4) · footer institucional
   ============================================================ */
.nav-drop { position: relative; }
.nav-drop__btn {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  background: none;
  border: 0;
  font-size: 14.5px;
  font-weight: 600;
  color: var(--text-on-navy);
  cursor: pointer;
  transition: color .25s;
  padding: 0;
}
.nav-drop__btn:hover { color: var(--gold-soft); }
.nav-drop__btn svg { width: 12px; height: 12px; stroke: currentColor; fill: none; stroke-width: 2.4; transition: transform .3s var(--ease-out); }
.nav-drop.is-open .nav-drop__btn svg { transform: rotate(180deg); }
.nav-drop__panel {
  position: absolute;
  top: calc(100% + 18px);
  left: 50%;
  transform: translateX(-50%) translateY(8px);
  min-width: 210px;
  background: rgba(8,23,38,.97);
  -webkit-backdrop-filter: blur(14px);
  backdrop-filter: blur(14px);
  border: 1px solid var(--navy-line);
  border-radius: var(--radius);
  padding: 10px;
  opacity: 0;
  visibility: hidden;
  transition: opacity .3s var(--ease-out), transform .3s var(--ease-out), visibility 0s .3s;
  box-shadow: 0 24px 60px rgba(4,12,22,.5);
}
.nav-drop.is-open .nav-drop__panel {
  opacity: 1;
  visibility: visible;
  transform: translateX(-50%) translateY(0);
  transition: opacity .3s var(--ease-out), transform .3s var(--ease-out);
}
.nav-drop__panel a {
  display: block;
  padding: 10px 14px;
  border-radius: 7px;
  font-size: 14px;
  font-weight: 600;
  color: var(--text-on-navy);
  transition: background .2s, color .2s;
}
.nav-drop__panel a:hover { background: rgba(198,156,109,.1); color: var(--gold-soft); }
@media (max-width: 860px) {
  .nav-drop { width: 100%; }
  .nav-drop__btn { width: 100%; justify-content: space-between; padding: 14px var(--gutter); font-size: 16px; }
  .nav-drop__panel {
    position: static;
    transform: none;
    min-width: 0;
    background: rgba(22,51,79,.4);
    border: 0;
    border-radius: 0;
    box-shadow: none;
    display: none;
    padding: 0 0 8px;
  }
  .nav-drop.is-open .nav-drop__panel { display: block; opacity: 1; visibility: visible; }
  .nav-drop__panel a { padding: 12px calc(var(--gutter) + 16px); }
}

/* Footer com 5 colunas (institucional) */
.site-footer__grid { grid-template-columns: 1.5fr repeat(4, 1fr); }
@media (max-width: 900px) { .site-footer__grid { grid-template-columns: 1fr 1fr; } }
@media (max-width: 560px) { .site-footer__grid { grid-template-columns: 1fr; } }

/* V7.1 — contraste global: eyebrow dourado em superfícies claras (AA) */
.section--light .eyebrow, .section--mist .eyebrow, .section--paper .eyebrow,
.hero--paper .eyebrow, .hero--triade .eyebrow { color: #7A5930; }
.section--light .eyebrow::before, .section--mist .eyebrow::before, .section--paper .eyebrow::before,
.section--light .eyebrow::after, .section--mist .eyebrow::after, .section--paper .eyebrow::after { background: #7A5930; }

/* ============================================================
   V8 — MENTORES (padrão G4) · gravura allanold · trio sem fundo
   ============================================================ */
.mentor-card {
  display: flex;
  flex-direction: column;
  border-radius: 16px;
  overflow: hidden;
  background: linear-gradient(170deg, #D9B98E 0%, #C69C6D 55%, #B08355 100%);
  border: 1px solid rgba(255,255,255,.14);
  transition: transform .35s var(--ease-out), box-shadow .35s var(--ease-out);
  height: 100%;
}
.mentor-card:hover { transform: translateY(-6px); box-shadow: 0 26px 60px rgba(4,12,22,.5); }
.mentor-card__photo {
  position: relative;
  height: clamp(230px, 22vw, 300px);
  display: flex;
  align-items: flex-end;
  justify-content: center;
  background:
    radial-gradient(70% 55% at 50% 100%, rgba(60, 38, 12, .28), transparent 72%),
    radial-gradient(90% 80% at 50% 0%, rgba(255, 240, 214, .35), transparent 70%);
}
.mentor-card__photo img {
  height: 94%;
  width: auto;
  max-width: 92%;
  object-fit: contain;
  filter: drop-shadow(0 12px 18px rgba(46, 32, 12, .35));
}
.mentor-card__body { padding: 18px 22px 24px; }
.mentor-card__name {
  font-family: var(--font-serif);
  font-style: italic;
  font-weight: 400;
  font-size: clamp(21px, 1.8vw, 26px);
  line-height: 1.25;
  color: var(--navy-deep);
}
.mentor-card__role {
  display: inline-block;
  margin-top: 6px;
  font-size: 11.5px;
  font-weight: 800;
  letter-spacing: .12em;
  text-transform: uppercase;
  color: #5E3F1C;
}
.mentor-card__rule {
  height: 2px;
  width: 64px;
  background: var(--navy-deep);
  opacity: .55;
  margin: 12px 0;
  border-radius: 99px;
}
.mentor-card__bio { font-size: 13.5px; line-height: 1.6; color: #3C2A12; }
@media (max-width: 640px) {
  .mentor-card__photo { height: clamp(240px, 62vw, 300px); }
}

/* Gravura "O que é": duo símbolo + allanold */
.whatis__duo {
  position: relative;
  z-index: 1;
  display: flex;
  align-items: flex-end;
  justify-content: center;
  gap: 0;
}

.whatis__duo .whatis__figure {
  width: 68%;
  margin-left: -6%;
  height: auto;
  filter: drop-shadow(-10px 14px 20px rgba(46, 32, 12, .3));
  -webkit-mask-image: linear-gradient(180deg, #000 82%, rgba(0,0,0,.5) 93%, transparent 100%);
  mask-image: linear-gradient(180deg, #000 82%, rgba(0,0,0,.5) 93%, transparent 100%);
}

/* Banner 1: trio SEM painel de fundo */


@media (min-width: 901px) {
  .trio-hero img { margin-bottom: 1.6vw; width: min(100%, 52vw); }

}

/* V8.1 — duo: neutralizar regras herdadas; máscara só na figura */
.whatis__duo img { transform: none; -webkit-mask-image: none; mask-image: none; }
.whatis__duo .whatis__figure {
  transform: translateY(4%);
  -webkit-mask-image: linear-gradient(180deg, #000 82%, rgba(0,0,0,.5) 93%, transparent 100%);
  mask-image: linear-gradient(180deg, #000 82%, rgba(0,0,0,.5) 93%, transparent 100%);
}


/* V8.2 — gravura solo (sem símbolo): figura maior e centralizada */
.whatis__duo .whatis__figure { width: 86%; margin-left: 0; }

/* ============================================================
   V9 — TRIO DE DESTAQUES · macOS realista · órbita girando ·
        crossfade · setas brancas · rails clean · planos clean
   ============================================================ */

/* ---------- Bloco dividido em 3 (Eventos · TecIA · Bancos) ---------- */
.triple {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 22px;
}
.triple__card {
  display: flex;
  flex-direction: column;
  border-radius: var(--radius-lg);
  overflow: hidden;
  background: linear-gradient(165deg, var(--navy-2), rgba(22,51,79,.45));
  border: 1px solid var(--navy-line);
  transition: transform .35s var(--ease-out), box-shadow .35s var(--ease-out), border-color .35s;
}
.triple__card:hover { transform: translateY(-6px); border-color: rgba(198,156,109,.45); box-shadow: 0 24px 54px rgba(4,12,22,.5); }
.triple__media { aspect-ratio: 16 / 9.4; overflow: hidden; }
.triple__media img { width: 100%; height: 100%; object-fit: cover; transition: transform .8s var(--ease-out); }
.triple__card:hover .triple__media img { transform: scale(1.05); }
.triple__body { padding: 24px 26px 28px; display: flex; flex-direction: column; flex: 1; }
.triple__body h3 { font-family: var(--font-serif); font-size: 19px; font-weight: 700; color: var(--text-on-navy-strong); margin-bottom: 10px; }
.triple__body p { font-size: 14.5px; line-height: 1.65; color: var(--text-on-navy); flex: 1; }



@media (max-width: 1024px) { .triple { grid-template-columns: 1fr; max-width: 560px; margin-inline: auto; } }

/* ---------- Gravura e trio: SEM fundo, só sombra ---------- */

.whatis__art::after {
  content: "";
  position: absolute;
  left: 12%; right: 12%; bottom: 2%;
  height: 7%;
  background: radial-gradient(50% 100% at 50% 55%, rgba(70, 50, 20, .32), transparent 72%);
  filter: blur(10px);
  z-index: 0;
}

@media (min-width: 901px) {
  .trio-hero img { margin-bottom: 0; width: min(100%, 50vw); }

}
.trio-hero img { margin-bottom: 0; }

/* ---------- Slider do topo: crossfade + setas brancas ---------- */
.hero-slider { display: grid; }
.hero-slide {
  display: block;
  grid-area: 1 / 1;
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
  transition: opacity .9s var(--ease-out), visibility 0s .9s;
}
.hero-slide.is-active {
  opacity: 1;
  visibility: visible;
  pointer-events: auto;
  transition: opacity .9s var(--ease-out);
}
.hero-slider__arrow {
  background: #FFFFFF;
  color: var(--navy);
  box-shadow: 0 8px 22px rgba(46, 32, 12, .22);
  border: 1px solid rgba(14, 39, 63, .08);
}
.hero-slider__arrow:hover { background: #FFFFFF; color: var(--gold-deep); }
.hero-slider__dots button { background: rgba(14,39,63,.18); }
.hero-slider__dots button.is-active { background: var(--gold-deep); }

/* ---------- Órbita: rotor girando com contra-rotação ---------- */
.orbit-rotor {
  position: absolute;
  inset: 0;
  animation: orbitSpin 120s linear infinite;
}
.orbit-rotor .orbit-node { animation: orbitSpinBack 120s linear infinite; }
@keyframes orbitSpin { to { transform: rotate(360deg); } }
@keyframes orbitSpinBack { to { transform: rotate(-360deg); } }
@media (prefers-reduced-motion: reduce) {
  .orbit-rotor, .orbit-rotor .orbit-node { animation: none; }
}

/* ---------- Rails mais clean ---------- */
.rail__nav button { border-color: rgba(198,156,109,.35); background: rgba(255,255,255,.04); }
.section--light .rail__nav button, .section--mist .rail__nav button { background: #fff; box-shadow: 0 4px 14px rgba(14,39,63,.08); border-color: rgba(14,39,63,.1); }
.rail__track { padding-bottom: 26px; gap: 18px; }

/* Comunidade: grid no desktop, carrossel só no celular */
@media (min-width: 901px) {
  .rail--mobile .rail__track {
    display: grid;
    grid-auto-flow: row;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    overflow: visible;
    scroll-snap-type: none;
    padding: 4px 0;
  }
  .rail--mobile .rail__nav { display: none; }
}

/* ---------- Planos mais clean ---------- */
#planos > .watermark { display: none; }
.plan--v2 { border-color: rgba(14,39,63,.08); box-shadow: 0 2px 10px rgba(14,39,63,.05); }
.plan--v2:hover { box-shadow: var(--shadow-lift); }
.plans { gap: 24px; }

/* ---------- macOS: realismo total ---------- */
.mockup--mac {
  font-family: -apple-system, BlinkMacSystemFont, 'SF Pro Text', 'Segoe UI', Roboto, var(--font-sans);
  border-radius: 14px;
  border: 1px solid rgba(0,0,0,.14);
  box-shadow:
    0 0 0 .5px rgba(0,0,0,.08),
    0 2px 6px rgba(0,0,0,.1),
    0 30px 80px rgba(8,23,38,.34);
}
.mockup--mac .mockup__bar { padding: 11px 14px; }
.tl { width: 12px; height: 12px; position: relative; }
.tl::after {
  content: "";
  position: absolute;
  inset: 2.5px;
  opacity: 0;
  transition: opacity .2s;
}
.mockup--mac:hover .tl--r::after { content: "×"; opacity: .55; font-size: 9px; line-height: 7px; text-align: center; color: #7a1d17; }
.mockup--mac .mockup__side { padding: 14px 0; }
.mockup--mac .mockup__side::before {
  content: "PLATAFORMA";
  display: block;
  padding: 0 22px 8px;
  font-size: 10px;
  font-weight: 700;
  letter-spacing: .08em;
  color: rgba(0,0,0,.35);
}
.mockup__status {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 8px 16px;
  border-top: 1px solid rgba(0,0,0,.07);
  background: #FAFAFC;
  font-size: 11px;
  color: rgba(0,0,0,.45);
}
.mockup__status i {
  width: 7px; height: 7px;
  border-radius: 50%;
  background: #28C840;
  font-style: normal;
}
.mcursor { transition: transform 1.5s cubic-bezier(.45,.05,.25,1); }

/* macOS painel: responsividade real no celular */
@media (max-width: 640px) {
  .mockup--mac { font-size: 13.5px; border-radius: 12px; }
  .mockup__title { display: none; }
  .mockup--mac .mockup__side::before { display: none; }
  .mockup--mac .mockup__side { padding: 6px 8px; gap: 4px; display: flex; overflow-x: auto; }
  .mockup--mac .mockup__side a {
    border-radius: 99px;
    border: 1px solid rgba(0,0,0,.1);
    padding: 8px 14px;
    font-size: 12px;
  }
  .mockup--mac .mockup__side a.is-active { border-color: var(--gold-deep); background: rgba(198,156,109,.14); }
  .mockup--mac .mockup__main { padding: 18px 16px; }
  .mockup__screens { min-height: 400px; }
  .scr-row { grid-template-columns: 1fr auto; }
  .scr-row span:last-child { display: none; }
  .mockup__row { flex-direction: column; align-items: flex-start; gap: 4px; }
  .scr-topbar .scr-user span { display: none; }
  .gauge { flex-direction: column; align-items: flex-start; }
}

/* V9.1 — transição sequencial (sem textos sobrepostos) */
.hero-slide {
  transition: opacity .45s var(--ease-out), visibility 0s .45s;
}
.hero-slide.is-active {
  transition: opacity .55s var(--ease-out) .42s;
}

/* V9.2 — o contador dentro do stat herda o display grande */


/* ============================================================
   V9.3 — símbolo no painel · mentores 100% proporcionais
   ============================================================ */
.mockup__title {
  display: inline-flex;
  align-items: center;
  gap: 7px;
}
.mockup__title-sym { height: 15px; width: auto; display: inline-block; }
@media (max-width: 640px) {
  /* no celular o título some, mas o símbolo permanece como identidade */
  .mockup__title { display: inline-flex; left: auto; right: 12px; transform: translateY(-50%); font-size: 0; gap: 0; }
  .mockup__title-sym { height: 14px; }
}

/* Mentores: proporção idêntica em todos os cards */
.mentor-card__photo {
  aspect-ratio: 1 / 0.92;
  height: auto;
  position: relative;
  overflow: hidden;
}
.mentor-card__photo img {
  position: absolute;
  bottom: 0;
  left: 50%;
  transform: translateX(-50%);
  height: 96%;
  width: auto;
  max-width: none;
  object-fit: contain;
}
.mentor-card__body { min-height: 172px; }
.rail__track .mentor-card { height: auto; align-self: stretch; }
@media (max-width: 640px) {
  .rail__track { grid-auto-columns: min(82vw, 320px); }
  .mentor-card__photo { aspect-ratio: 1 / 0.95; }
  .mentor-card__name { font-size: 22px; }
  .mentor-card__bio { font-size: 13px; }
  .mentor-card__body { min-height: 0; padding: 16px 18px 22px; }
}

/* ============================================================
   V10 — EM NÚMEROS · tríade mais alta · ícones sem fundo
   ============================================================ */

/* ---------- Em números (cards bordados, padrão G4) ---------- */
@media (max-width: 900px) {
}

/* ---------- Tríade do banner 1 mais alta e visível ---------- */
@media (min-width: 901px) {
  .trio-hero img { width: min(100%, 54vw); margin-bottom: 3.2vw; }

}
@media (max-width: 900px) {
  .trio-hero img { margin-bottom: 26px; }

}

/* ---------- Ícones globais: sem fundo, maiores, traço refinado ---------- */
.card__icon, .plan__ico, .ico-round, .orbit-node i {
  background: none !important;
  border: none !important;
  box-shadow: none !important;
}
.card__icon { width: auto; height: auto; margin-bottom: 2px; }
.card__icon svg { width: 34px; height: 34px; stroke-width: 1.5; }
.plan__ico { width: auto; height: auto; }
.plan__ico svg { width: 28px; height: 28px; stroke-width: 1.5; }
.ico-round { width: auto; height: auto; }
.ico-round svg { width: 30px; height: 30px; }
.section--light .ico-round svg, .section--mist .ico-round svg, .section--paper .ico-round svg { fill: var(--gold-deep); }
.section--navy .ico-round svg, .section--deep .ico-round svg { fill: var(--gold); }
.orbit-node i { width: 44px; height: 44px; }
.orbit-node i svg { width: 30px; height: 30px; stroke-width: 1.5; }
.orbit-node:hover i { transform: scale(1.15); box-shadow: none !important; }
.profile svg { width: 24px; height: 24px; stroke-width: 1.6; }
.contact-card .ico-round svg { width: 30px; height: 30px; }

/* ============================================================
   V11 — CORREÇÃO TOTAL MOBILE · painel 16:9 · sem sombra ·
         espaçamentos enxutos · mapa clean
   ============================================================ */

/* Gravura: fundo 100% transparente, sem sombra alguma */
.whatis__art::after { display: none; }

/* Painel macOS: no celular vira miniatura 16:9 escalada (tudo proporcional) */
@media (max-width: 900px) {
  .mockup-scale {
    position: relative;
    width: 100%;
    aspect-ratio: 16 / 9.6;
    overflow: visible;
  }
  .mockup-scale .mockup--mac {
    position: absolute;
    top: 0; left: 0;
    width: 900px;
    transform-origin: top left;
    /* escala definida via JS (data-mockup-scale) */
  }
  /* desfaz adaptações verticais antigas — a miniatura preserva o desktop */
  .mockup-scale .mockup__title { display: inline-flex; font-size: 12.5px; gap: 7px; left: 50%; right: auto; transform: translate(-50%, -50%); }
  .mockup-scale .mockup__side { display: block; overflow: visible; padding: 14px 0; border-right: 1px solid rgba(0,0,0,.08); border-bottom: 0; }
  .mockup-scale .mockup__side::before { display: block; }
  .mockup-scale .mockup__side a { border: 0; border-radius: 0; padding: 10px 22px; font-size: 13px; white-space: nowrap; }
  .mockup-scale .mockup__side a.is-active { border-left: 2px solid var(--gold-deep); background: linear-gradient(90deg, rgba(198,156,109,.18), transparent); }
  .mockup-scale .mockup__body { grid-template-columns: 200px 1fr; }
  .mockup-scale .mockup__main { padding: 26px 28px; }
  .mockup-scale .scr-row { grid-template-columns: 1.5fr auto auto; }
  .mockup-scale .scr-row span:last-child { display: inline; }
  .mockup-scale .mockup__row { flex-direction: row; align-items: center; gap: 12px; }
  .mockup-scale .scr-topbar .scr-user span { display: inline; }
  .mockup-scale .gauge { flex-direction: row; align-items: center; }
  .mockup-scale .mockup__screens { min-height: 330px; }
}

/* Espaçamentos enxutos no celular (fora espaço desnecessário) */
@media (max-width: 640px) {
  :root { --section-y: clamp(44px, 11vw, 60px); --gutter: 18px; }
  .section-head { margin-bottom: 28px; }
  .section-head .display { margin: 12px 0 10px; }
  h2.display { font-size: clamp(26px, 7.4vw, 32px); }
  h1.display { font-size: clamp(30px, 8.6vw, 38px); }
  .lead { font-size: 15.5px; }
  .serif-sub { font-size: 15.5px; }
  .hero--paper .hero__inner, .hero--triade .hero__inner { padding-top: 18px; gap: 12px; }
  .hero--paper .display-tag { font-size: clamp(22px, 6.4vw, 28px); margin-bottom: 8px; }
  .hero--paper h2.as-h1, .hero--triade h2.as-h1 { font-size: clamp(20px, 5.8vw, 24px); }
  .hero--paper .lead, .hero--triade .lead { font-size: 14px; margin-top: 10px; }
  .hero__ctas { margin-top: 16px; gap: 10px; }
  .btn--lg { padding: 14px 26px; font-size: 15px; }
  .stats { gap: 0; }
  .stat { padding: 14px 14px 4px 14px; }
  .stat__num { font-size: 26px; }
  .stat__label { font-size: 11.5px; }
  .rail__track { padding-bottom: 16px; gap: 14px; }
  .rail__nav { margin-bottom: 8px; }
  .card { padding: 22px 20px; }
  .plan--v2 { padding: 26px 20px 22px; }
  .whatis__copy .lead { margin-top: 12px; }
  .whatis__pillars { margin-top: 16px; gap: 8px; }
  .whatis__copy .btn { margin-top: 20px; }
  .triple__body { padding: 18px 18px 22px; }
  .mentor-card__body { padding: 14px 16px 18px; }
  .site-footer { padding-top: 44px; }
  .site-footer__grid { gap: 26px; }
  .site-footer__legal { margin-top: 32px; }
  .purpose li { font-size: clamp(19px, 5.8vw, 24px); }
  .method-item { padding: 20px 18px; }
  .faq summary { padding: 16px 4px; font-size: 15.5px; }
}

/* Trio do banner: presença correta no celular */
@media (max-width: 900px) {
  .trio-hero img { width: min(100%, 560px); margin-bottom: 14px; }

}

/* Órbita: traço fino do fluxo */
.orbit-flow circle { stroke-width: 1.2; }

/* ============================================================
   V13 — Tríade e gravura no tamanho original, coladas na base
   ============================================================ */
/* Banner 1: trio inteiro, corte reto escondido pela seção de baixo */
.trio-hero { align-self: end; }
.trio-hero img {
  margin-bottom: 0 !important;
  -webkit-mask-image: none;
  mask-image: none;
  display: block;
}

@media (min-width: 901px) {
  .trio-hero img { width: min(100%, 46vw); }
  .hero--paper .hero__inner { align-items: end; padding-bottom: 0; }
  .hero--paper .hero__inner > div:first-child { align-self: center; padding-bottom: clamp(24px, 4vw, 56px); }
}
@media (max-width: 900px) {
  .trio-hero { margin-top: 10px; }
  .trio-hero img { width: min(100%, 460px); margin-bottom: 0; }
  .hero--paper .hero__inner { padding-bottom: 0; }
}

/* "O que é": gravura inteira, colada na base da seção */
#o-que-e { padding-bottom: 0; }
.whatis { align-items: end; }
.whatis__copy { align-self: center; padding-bottom: var(--section-y); }
.whatis__art { align-self: end; margin-bottom: 0; }
.whatis__duo { align-items: flex-end; }
.whatis__duo .whatis__figure {
  transform: none;
  -webkit-mask-image: none;
  mask-image: none;
  display: block;
  margin-bottom: 0;
}
@media (max-width: 999px) {
  .whatis__art { margin: 10px auto 0; width: min(92%, 600px); }
  .whatis__copy { padding-bottom: 0; }
}

/* Órbita: ícone de user no centro */
.orbit-center svg.center-user {
  width: clamp(34px, 4vw, 52px);
  height: clamp(34px, 4vw, 52px);
  stroke: var(--gold-soft);
  fill: none;
  stroke-width: 1.5;
  margin: 0 auto;
  display: block;
}

/* V13.1 — fotos dos mentores NUNCA cortam (contain, base ancorada) */
.mentor-card__photo img {
  position: absolute;
  inset: 0;
  left: 0;
  transform: none;
  width: 100%;
  height: 100%;
  max-width: 100%;
  object-fit: contain;
  object-position: center bottom;
  padding-top: 4%;
}

/* ============================================================
   V16 — FUNDO ESCURO COM PROFUNDIDADE (pergaminho navy)
   Nada de cor chapada; blocos escuros consecutivos se distinguem
   ============================================================ */
.section--navy {
  background:
    radial-gradient(40% 32% at 96% 4%, rgba(29, 62, 95, .45), transparent 66%),
    radial-gradient(34% 40% at 2% 92%, rgba(6, 16, 28, .6), transparent 64%),
    radial-gradient(24% 18% at 8% 10%, rgba(198, 156, 109, .05), transparent 70%),
    radial-gradient(30% 22% at 88% 96%, rgba(198, 156, 109, .04), transparent 70%),
    radial-gradient(150% 120% at 50% 45%, transparent 55%, rgba(4, 10, 18, .45) 100%),
    linear-gradient(168deg, #143453 0%, #0E273F 52%, #0A1F35 100%);
}
.section--deep {
  background:
    radial-gradient(46% 36% at 4% 6%, rgba(22, 51, 79, .55), transparent 68%),
    radial-gradient(30% 26% at 94% 90%, rgba(198, 156, 109, .06), transparent 70%),
    radial-gradient(26% 20% at 90% 8%, rgba(29, 62, 95, .35), transparent 68%),
    radial-gradient(150% 120% at 50% 50%, transparent 52%, rgba(2, 7, 14, .62) 100%),
    linear-gradient(160deg, #0D2239 0%, #081726 55%, #06101C 100%);
}
/* textura orgânica sutil (mesma família do pergaminho) */
.section--navy::before, .section--deep::before {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  opacity: .35;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.65' numOctaves='2'/%3E%3C/filter%3E%3Crect width='160' height='160' filter='url(%23n)' opacity='.05'/%3E%3C/svg%3E");
}
/* divisa perceptível quando dois blocos escuros se encontram */
.section--navy + .section--deep,
.section--deep + .section--navy,
.section--navy + .section--navy,
.section--deep + .section--deep {
  border-top: 1px solid rgba(198, 156, 109, .16);
}
/* o footer escuro também se separa do bloco escuro anterior */
.site-footer { 
  background:
    radial-gradient(40% 30% at 50% 0%, rgba(22, 51, 79, .4), transparent 70%),
    linear-gradient(180deg, #081726 0%, #060F1B 100%);
}

/* ============================================================
   V19 — VÍDEO DO HERO (banner 2): painel claro + som opcional
   ============================================================ */
.journey-video {
  position: relative;
  align-self: center;
  width: 100%;
  max-width: 620px;
  margin-inline: auto;
  border-radius: var(--radius-lg);
  overflow: hidden;
  background: #FCFBF8;
  border: 1px solid rgba(14, 39, 63, .12);
  box-shadow: 0 30px 70px rgba(14, 39, 63, .16);
}
.journey-video video { display: block; width: 100%; height: auto; aspect-ratio: 16 / 9; background: #FCFBF8; }
@media (max-width: 900px) { .journey-video { max-width: 480px; } }
@media (max-width: 640px) { .journey-video { max-width: 100%; } }
@media (min-width: 901px) { .hero--triade .journey-video { max-width: 42vw; } }

/* ============================================================
   V20 — CHATBOT SDR (estilo Typebot, nativo)
   ============================================================ */
.vbot { position: fixed; z-index: 990; right: 0; bottom: 0; font-family: var(--font-sans); }
.vbot [hidden] { display: none !important; } /* display de autor não pode anular o atributo hidden */
.vbot__launcher {
  position: fixed; right: 22px; bottom: 22px;
  width: 62px; height: 62px; border-radius: 50%;
  background: linear-gradient(160deg, var(--navy-2), var(--navy-deep));
  border: 1.5px solid rgba(198, 156, 109, .55);
  box-shadow: 0 14px 40px rgba(4, 12, 22, .35);
  display: grid; place-items: center; cursor: pointer;
  opacity: 0; transform: translateY(16px) scale(.9);
  transition: opacity .5s var(--ease-out), transform .5s var(--ease-out), box-shadow .3s;
}
.vbot--in .vbot__launcher { opacity: 1; transform: none; }
.vbot__launcher:hover { box-shadow: 0 16px 46px rgba(198, 156, 109, .35); }
.vbot__launcher img { width: 30px; height: auto; }
.vbot__badge {
  position: absolute; top: -3px; right: -3px;
  min-width: 22px; height: 22px; border-radius: 999px;
  background: var(--gold); color: var(--navy-deep);
  font-size: 12.5px; font-weight: 800; display: grid; place-items: center;
  border: 2px solid #fff;
}
.vbot__nudge {
  position: fixed; right: 96px; bottom: 30px;
  max-width: 280px; background: #fff; color: var(--navy);
  border: 1px solid rgba(14, 39, 63, .12); border-radius: 16px 16px 4px 16px;
  box-shadow: 0 18px 50px rgba(14, 39, 63, .2);
  padding: 14px 18px; cursor: pointer;
}
.vbot__nudge strong { display: block; font-size: 14.5px; line-height: 1.4; }
.vbot__nudge span { display: block; margin-top: 4px; font-size: 13px; color: rgba(14, 39, 63, .65); }
.vbot__nudge-x {
  position: absolute; top: 4px; right: 8px; background: none; border: 0;
  font-size: 18px; color: rgba(14, 39, 63, .4); cursor: pointer; padding: 4px;
}
.vbot__panel {
  position: fixed; right: 22px; bottom: 98px;
  width: min(388px, calc(100vw - 44px));
  height: min(620px, calc(100vh - 130px));
  height: min(620px, calc(100dvh - 130px));
  display: flex; flex-direction: column;
  background: var(--offwhite);
  border: 1px solid rgba(14, 39, 63, .14); border-radius: 22px;
  box-shadow: 0 30px 80px rgba(4, 12, 22, .35);
  overflow: hidden;
  opacity: 0; transform: translateY(18px) scale(.98);
  transition: opacity .35s var(--ease-out), transform .35s var(--ease-out);
}
.vbot--open .vbot__panel { opacity: 1; transform: none; }
.vbot__head {
  display: flex; align-items: center; gap: 12px;
  padding: 16px 18px;
  background: linear-gradient(165deg, var(--navy-2), var(--navy-deep));
  border-bottom: 1px solid rgba(198, 156, 109, .35);
}
.vbot__ava {
  width: 42px; height: 42px; border-radius: 50%;
  background: rgba(198, 156, 109, .16); border: 1px solid rgba(198, 156, 109, .4);
  display: grid; place-items: center; flex: none;
}
.vbot__ava img { width: 22px; height: auto; }
.vbot__id b { display: block; color: #fff; font-size: 15.5px; }
.vbot__id i {
  display: block; font-style: normal; margin-top: 2px;
  font-size: 12px; color: rgba(231, 211, 180, .85);
}
.vbot__close {
  margin-left: auto; background: none; border: 0; cursor: pointer; padding: 8px;
}
.vbot__close svg { width: 20px; height: 20px; stroke: rgba(245, 243, 239, .8); stroke-width: 2; fill: none; }
.vbot__close:hover svg { stroke: #fff; }
.vbot__body { flex: 1; overflow-y: auto; overscroll-behavior: contain; padding: 18px 16px 8px; display: flex; flex-direction: column; gap: 10px; }
.vbot__msg {
  max-width: 84%; padding: 11px 15px; font-size: 14.5px; line-height: 1.55;
  border-radius: 16px; animation: vbot-in .3s var(--ease-out);
}
@keyframes vbot-in { from { opacity: 0; transform: translateY(8px); } }
.vbot__msg--bot {
  align-self: flex-start; background: #fff; color: var(--navy);
  border: 1px solid rgba(14, 39, 63, .1); border-bottom-left-radius: 6px;
}
.vbot__msg--user {
  align-self: flex-end; background: var(--navy); color: var(--offwhite);
  border-bottom-right-radius: 6px;
}
.vbot__typing { display: inline-flex; gap: 5px; padding: 15px 16px; }
.vbot__typing span {
  width: 7px; height: 7px; border-radius: 50%; background: rgba(14, 39, 63, .35);
  animation: vbot-dot 1.1s infinite;
}
.vbot__typing span:nth-child(2) { animation-delay: .18s; }
.vbot__typing span:nth-child(3) { animation-delay: .36s; }
@keyframes vbot-dot { 0%, 60%, 100% { transform: none; opacity: .5; } 30% { transform: translateY(-5px); opacity: 1; } }
.vbot__foot { padding: 10px 14px calc(14px + env(safe-area-inset-bottom)); }
.vbot__chips { display: flex; flex-wrap: wrap; gap: 8px; justify-content: flex-end; }
.vbot__chip {
  border: 1.5px solid var(--gold-deep); background: #fff; color: #7A5930;
  font-family: var(--font-sans); font-size: 13.5px; font-weight: 800;
  padding: 9px 16px; border-radius: 999px; cursor: pointer;
  transition: background .2s, color .2s, transform .2s;
}
.vbot__chip:hover { background: var(--gold); border-color: var(--gold); color: var(--navy-deep); transform: translateY(-1px); }
.vbot__inputrow { display: flex; gap: 8px; }
.vbot__input {
  flex: 1; border: 1.5px solid rgba(14, 39, 63, .2); border-radius: 999px;
  background: #fff; color: var(--navy);
  font-family: var(--font-sans); font-size: 15px; padding: 11px 18px; outline: none;
}
.vbot__input:focus { border-color: var(--gold-deep); box-shadow: 0 0 0 3px rgba(198, 156, 109, .18); }
.vbot__send {
  width: 46px; height: 46px; flex: none; border-radius: 50%; border: 0;
  background: var(--gold); cursor: pointer; display: grid; place-items: center;
  transition: transform .2s, background .2s;
}
.vbot__send:hover { background: var(--gold-deep); transform: scale(1.06); }
.vbot__send svg { width: 20px; height: 20px; fill: var(--navy-deep); }
.vbot__err { margin: 6px 6px 0; font-size: 12.5px; font-weight: 700; color: #A33B3B; min-height: 1em; }

/* mobile: acima da bottom-bar; painel em tela cheia */
@media (max-width: 900px) {
  .vbot__launcher { right: 16px; bottom: calc(84px + env(safe-area-inset-bottom)); }
  .vbot__nudge { right: 88px; bottom: calc(92px + env(safe-area-inset-bottom)); }
}
@media (max-width: 640px) {
  .vbot__panel {
    right: 0; bottom: 0; width: 100vw;
    height: 100vh;
    height: 100dvh; max-height: none; border-radius: 0; border: 0;
  }
  .vbot__head { padding-top: calc(16px + env(safe-area-inset-top)); }
}
@media (prefers-reduced-motion: reduce) {
  .vbot__launcher, .vbot__panel, .vbot__msg { transition: none; animation: none; }
}

/* ============================================================
   V21 — Vídeo do hero v2 "Plataforma Viva": integração sem moldura
   (a janela macOS do próprio vídeo é a moldura; o fundo do vídeo
   casa com o pergaminho do banner e a leve translucidez funde os dois)
   ============================================================ */
.journey-video {
  background: none;
  border: 0;
  border-radius: 0;
  box-shadow: none;
  overflow: visible;
}
.journey-video video {
  opacity: .93;
  border-radius: 0;
  background: transparent;
}




/* ============================================================
   V23 — Auditoria: header na faixa 861–1120px · alvos de toque ·
         compatibilidade dvh · demo mobile sem dica enganosa
   ============================================================ */
@media (min-width: 861px) and (max-width: 1120px) {
  .site-header__nav { gap: 14px; }
  .site-header__nav a { white-space: nowrap; font-size: 14px; }
  .site-header .btn { white-space: nowrap; padding: 10px 16px; font-size: 13.5px; }
}
/* dots do hero: visual de linha, alvo de toque de verdade */
.hero-slider__dots button {
  width: 32px; height: 24px; background: none; position: relative;
}
.hero-slider__dots button::before {
  content: ''; position: absolute; left: 4px; right: 4px; top: 50%;
  height: 3px; margin-top: -1.5px; border-radius: 2px;
  background: rgba(14, 39, 63, .28);
}
.hero-slider__dots button.is-active::before { background: var(--gold-deep); }
/* fechar do nudge do chatbot: área ≥40px sem mudar o glifo */
.vbot__nudge-x { padding: 10px 12px; top: 0; right: 0; }
/* demo da plataforma no celular: sem dica de clique (é miniatura) */
@media (max-width: 900px) {
  .mockup-scale .mockup__hint { display: none; }
}

/* ============================================================
   V24 — Gauge da demo dirigido por --val (revisão do fix do cursor)
   ============================================================ */
/* registra --val para a transition de 1.2s do .gauge__ring animar de fato */
@property --val {
  syntax: '<number>';
  inherits: false;
  initial-value: 0;
}
@media (prefers-reduced-motion: reduce) {
  .gauge__ring { transition: none; }
}

/* ============================================================
   V24 — RESPIRO TIPOGRÁFICO GLOBAL (parágrafos menos "colados")
   Pedido do dono: mais espaçamento em todos os parágrafos de
   todas as etapas, desktop e mobile. Unidades relativas (em) —
   escalam junto com o clamp() das fontes, sem quebrar layout.
   ============================================================ */
body { line-height: 1.72; }
.lead { line-height: 1.8; }
.hero--paper .lead, .hero--triade .lead { line-height: 1.82; }
.card p { line-height: 1.7; }
.mentor-card__bio { line-height: 1.72; }
.triple__body p { line-height: 1.75; }

/* parágrafos consecutivos em áreas de conteúdo ganham respiro real */
.section p + p,
.hero__inner p + p,
article p + p { margin-top: .9em; }

/* respiro entre título e lead nas cabeças de seção */
.section-head .lead { margin-top: 16px; }
.section-head { margin-bottom: 34px; }

/* listas de conteúdo respiram na mesma medida */
.section ul li + li, .section ol li + li { margin-top: .45em; }

/* mobile: cabeças de seção um pouco mais soltas também */
@media (max-width: 640px) {
  .section-head { margin-bottom: 30px; }
  .section-head .lead { margin-top: 14px; }
}

/* item de rodapé ainda não disponível (ex.: Área do Aluno) — não-clicável, honesto */
.footer-soon { color: rgba(245,243,239,.4); font-size: 14px; cursor: default; }
.footer-soon em { font-style: normal; font-size: 11px; letter-spacing: .06em; text-transform: uppercase; color: var(--gold); opacity: .75; margin-left: 4px; }

/* h1 acessível porém oculto (páginas-wizard com títulos por etapa) */
.sr-only-h1 { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0; }
/* item/post ainda não disponível — aparência de "em breve", não interativo */
.post-card__link--soon { color: rgba(122,89,48,.6); font-weight: 700; font-size: 13.5px; cursor: default; }
.btn.is-disabled { opacity: .55; cursor: not-allowed; pointer-events: none; }
.btn.is-disabled em { font-style: normal; font-size: .82em; opacity: .8; margin-left: 6px; }

/* ============================================================
   V26 — BLOG EDITORIAL NÍVEL G4 (hero destaque, Radar IA,
   colunistas, tempo de leitura, busca) + template de artigo
   ============================================================ */

/* sub-barra do blog (padrão G4: marca + categorias + busca)
   header do site é fixed (~77px): a barra nasce abaixo dele e gruda ali */
.blog-bar {
  position: sticky; top: 77px; z-index: 40; margin-top: 77px;
  background: rgba(8,23,38,.92); backdrop-filter: blur(10px);
  border-bottom: 1px solid var(--navy-line);
}
@media (max-width: 860px) { .blog-bar { top: 64px; margin-top: 64px; } }
.blog-bar__inner { display: flex; align-items: center; gap: 18px; padding-block: 12px; }
.blog-bar__brand { font-size: 13px; font-weight: 800; letter-spacing: .22em; text-transform: uppercase; color: var(--gold); white-space: nowrap; }
.blog-bar__cats { display: flex; gap: 4px; overflow-x: auto; scrollbar-width: none; flex: 1; min-width: 0; }
@media (max-width: 720px) {
  .blog-bar__brand { display: none; } /* no celular: categorias + busca ocupam a barra */
  .blog-search input { width: 40vw; min-width: 120px; }
}
.blog-bar__cats::-webkit-scrollbar { display: none; }
.blog-bar__cats a {
  font-size: 12px; font-weight: 700; letter-spacing: .08em; text-transform: uppercase;
  color: var(--text-on-navy); padding: 7px 12px; border-radius: 999px; white-space: nowrap;
}
.blog-bar__cats a:hover { color: var(--gold-soft); background: rgba(198,156,109,.1); }
.blog-search { position: relative; flex: none; }
.blog-search input {
  width: clamp(150px, 18vw, 230px); padding: 8px 14px 8px 36px;
  border-radius: 999px; border: 1px solid var(--navy-line);
  background: rgba(22,51,79,.6); color: var(--text-on-navy-strong); font-size: 13.5px;
}
.blog-search input::placeholder { color: rgba(245,243,239,.45); }
.blog-search svg { position: absolute; left: 12px; top: 50%; transform: translateY(-50%); width: 16px; height: 16px; stroke: var(--gold); fill: none; stroke-width: 2; }

/* hero editorial de destaque (padrão G4, elevado) */
.blog-hero { position: relative; overflow: hidden; background:
  radial-gradient(120% 90% at 8% 0%, #FBF8F1 0%, #F3EEE3 52%, #EAE2D2 100%); }
.blog-hero__inner {
  position: relative; z-index: 2; display: grid;
  grid-template-columns: minmax(0, 1.05fr) minmax(0, .95fr);
  gap: clamp(28px, 4vw, 64px); align-items: center;
  padding-block: clamp(48px, 6vw, 84px);
}
.chip-cat {
  display: inline-flex; align-items: center; gap: 8px;
  font-size: 12.5px; font-weight: 800; letter-spacing: .16em; text-transform: uppercase;
  color: #8A6538; border: 1.5px solid rgba(166,127,79,.5); border-radius: 999px; padding: 7px 16px;
}
.blog-hero h1 { margin-top: 18px; }
.blog-hero .lead { margin-top: 16px; max-width: 560px; }
.blog-hero__meta { display: flex; align-items: center; gap: 18px; margin-top: 22px; font-size: 13.5px; font-weight: 700; color: rgba(14,39,63,.55); flex-wrap: wrap; }

/* selo/pulso do Radar IA */
.radar-dot { position: relative; width: 10px; height: 10px; border-radius: 50%; background: var(--gold-deep); flex: none; }
.radar-dot::after { content: ''; position: absolute; inset: -5px; border-radius: 50%; border: 1.5px solid rgba(168,127,79,.55); animation: radarPulse 2.4s ease-out infinite; }
@keyframes radarPulse { 0% { transform: scale(.6); opacity: 1; } 100% { transform: scale(1.9); opacity: 0; } }
@media (prefers-reduced-motion: reduce) { .radar-dot::after { animation: none; opacity: .5; } }

/* visual do radar (SVG dourado, decorativo) */
.blog-hero__radar { position: relative; display: grid; place-items: center; }
.blog-hero__radar svg { width: min(100%, 480px); height: auto; }
.blog-hero__radar .sweep { transform-origin: 50% 50%; animation: radarSweep 7s linear infinite; }
@keyframes radarSweep { to { transform: rotate(360deg); } }
@media (prefers-reduced-motion: reduce) { .blog-hero__radar .sweep { animation: none; } }

/* cards de post: meta com tempo de leitura */
.post-card__meta { display: flex; align-items: center; gap: 10px; font-size: 12.5px; font-weight: 700; color: rgba(14,39,63,.5); }
.post-card__meta .sep { opacity: .5; }
.post-card--ia .cat-label { background: var(--navy); color: var(--gold-soft); display: inline-flex; align-items: center; gap: 7px; }

/* colunistas (padrão G4, com a IA como colunista especial) */
.colunistas { display: grid; grid-template-columns: repeat(4, 1fr); gap: 22px; }
.colunista { text-align: center; }
.colunista img { width: 128px; height: 128px; object-fit: cover; border-radius: 50%; margin-inline: auto; border: 2px solid rgba(198,156,109,.45); }
.colunista b { display: block; margin-top: 14px; font-family: var(--font-display); font-weight: 400; font-size: 19px; color: var(--text-on-navy-strong); }
.colunista span { display: block; margin-top: 4px; font-size: 13px; font-weight: 600; color: var(--text-on-navy); }
.colunista--ia .avatar-ia {
  width: 128px; height: 128px; border-radius: 50%; margin-inline: auto;
  display: grid; place-items: center; border: 2px solid var(--gold);
  background: radial-gradient(circle at 35% 30%, var(--navy-2), var(--navy-deep));
  box-shadow: 0 0 34px rgba(198,156,109,.25);
}
.colunista--ia .avatar-ia img { width: 58px; height: auto; border: 0; border-radius: 0; }
@media (max-width: 900px) { .colunistas { grid-template-columns: repeat(2, 1fr); row-gap: 34px; } }

/* ---------- template de artigo ---------- */
.artigo-hero { background: radial-gradient(120% 90% at 8% 0%, #FBF8F1 0%, #F3EEE3 52%, #EAE2D2 100%); }
.artigo-hero__inner { max-width: 880px; margin-inline: auto; padding-block: clamp(44px, 6vw, 72px) clamp(30px, 4vw, 48px); }
.artigo-hero h1 { font-family: var(--font-display); font-weight: 400; font-size: clamp(30px, 4vw, 52px); line-height: 1.14; color: var(--navy); margin-top: 18px; }
.artigo-hero .lead { margin-top: 16px; }
.artigo-meta { display: flex; align-items: center; gap: 14px; flex-wrap: wrap; margin-top: 24px; font-size: 13.5px; font-weight: 700; color: rgba(14,39,63,.55); }
.artigo-corpo { max-width: 760px; margin-inline: auto; padding-block: clamp(36px, 5vw, 56px); font-size: 18px; line-height: 1.85; color: rgba(14,39,63,.85); }
.artigo-corpo h2 { font-family: var(--font-display); font-weight: 400; font-size: clamp(24px, 2.6vw, 32px); color: var(--navy); margin: 1.7em 0 .6em; }
.artigo-corpo h3 { font-size: 20px; font-weight: 800; color: var(--navy); margin: 1.5em 0 .5em; }
.artigo-corpo p + p { margin-top: 1em; }
.artigo-corpo ul, .artigo-corpo ol { margin: 1em 0 1em 1.3em; }
.artigo-corpo ul { list-style: disc; } .artigo-corpo ol { list-style: decimal; }
.artigo-corpo li + li { margin-top: .5em; }
.artigo-corpo a { color: #8A6538; font-weight: 700; text-decoration: underline; text-decoration-color: rgba(166,127,79,.4); }
.artigo-corpo blockquote {
  margin: 1.6em 0; padding: 22px 28px; border-left: 3px solid var(--gold);
  background: rgba(198,156,109,.07); border-radius: 0 12px 12px 0;
  font-family: var(--font-serif); font-style: italic; font-size: 19px; color: var(--navy);
}
.artigo-fonte { font-size: 13px; color: rgba(14,39,63,.5); font-weight: 600; }
.artigo-toc {
  margin: 28px 0; padding: 24px 30px; border: 1px solid var(--paper-line); border-radius: 14px; background: #fff;
}
.artigo-toc b { font-size: 13px; font-weight: 800; letter-spacing: .18em; text-transform: uppercase; color: #8A6538; }
.artigo-toc ol { margin: 12px 0 0 1.2em; list-style: decimal; font-size: 15.5px; font-weight: 600; }
.artigo-toc a { color: var(--navy); text-decoration: none; }
.artigo-toc a:hover { color: #8A6538; }
.artigo-cta {
  margin: 2.2em 0; padding: 30px 34px; border-radius: 16px;
  background: linear-gradient(165deg, var(--navy-2), var(--navy-deep));
  border: 1px solid rgba(198,156,109,.35); color: var(--text-on-navy);
}
.artigo-cta b { display: block; font-family: var(--font-display); font-weight: 400; font-size: 24px; color: var(--text-on-navy-strong); margin-bottom: 8px; }
.artigo-cta .btn { margin-top: 16px; }
.assinatura-ia {
  display: flex; gap: 18px; align-items: center; margin-top: 44px;
  padding: 24px 28px; border: 1px solid var(--paper-line); border-radius: 16px; background: #fff;
}
.assinatura-ia .avatar-ia { width: 62px; height: 62px; border-radius: 50%; display: grid; place-items: center; border: 1.5px solid var(--gold); background: radial-gradient(circle at 35% 30%, var(--navy-2), var(--navy-deep)); flex: none; }
.assinatura-ia .avatar-ia img { width: 30px; }
.assinatura-ia b { font-size: 15.5px; color: var(--navy); }
.assinatura-ia p { font-size: 13.5px; color: rgba(14,39,63,.6); font-weight: 600; margin-top: 3px; }

@media (max-width: 900px) {
  .blog-hero__inner { grid-template-columns: 1fr; }
  .blog-hero__radar { order: -1; }
  .blog-hero__radar svg { width: min(70%, 320px); }
}

/* ============================================================
   V27 — BLOG ESPELHO-G4 ELEVADO: destaque com figura, capas
   ilustradas por categoria, navegue por assunto, gráficos do
   Radar IA com animação de traço e barra de progresso de leitura
   ============================================================ */

/* destaque G4: texto à esquerda, figura grande à direita */
.blog-destaque { background: radial-gradient(120% 90% at 8% 0%, #FBF8F1 0%, #F3EEE3 52%, #EAE2D2 100%); }
.blog-destaque__inner {
  display: grid; grid-template-columns: minmax(0, .92fr) minmax(0, 1.08fr);
  gap: clamp(28px, 4vw, 60px); align-items: center;
  padding-block: clamp(44px, 5.5vw, 72px);
}
.blog-destaque h1 { font-family: var(--font-display); font-weight: 400; font-size: clamp(28px, 3.4vw, 46px); line-height: 1.14; color: var(--navy); margin-top: 18px; }
.blog-destaque .lead { margin-top: 14px; }
.blog-destaque__fig {
  position: relative; border-radius: var(--radius-lg); overflow: hidden;
  border: 1px solid rgba(166,127,79,.3); box-shadow: var(--shadow-lift);
  background: linear-gradient(165deg, var(--navy-2), var(--navy-deep));
}
.blog-destaque__fig .selo {
  position: absolute; top: 16px; left: 16px; z-index: 2;
  display: inline-flex; align-items: center; gap: 8px;
  font-size: 11.5px; font-weight: 800; letter-spacing: .16em; text-transform: uppercase;
  color: var(--gold-soft); background: rgba(8,23,38,.72); backdrop-filter: blur(6px);
  border: 1px solid rgba(198,156,109,.4); border-radius: 999px; padding: 7px 14px;
}

/* capas ilustradas dos cards (compostas por código — únicas nossas) */
.post-card__media { position: relative; overflow: hidden; }
.post-card__media .capa {
  position: absolute; inset: 0; display: grid; place-items: center;
  transition: transform .6s var(--ease-out);
}
.post-card:hover .capa { transform: scale(1.05); }
.post-card__media .capa svg.ic { width: 64px; height: 64px; stroke: rgba(231,211,180,.9); fill: none; stroke-width: 1.4; stroke-linecap: round; stroke-linejoin: round; }
.capa::before { /* padrão de pontos dourados */
  content: ''; position: absolute; inset: 0; opacity: .25;
  background-image: radial-gradient(rgba(198,156,109,.55) 1px, transparent 1.4px);
  background-size: 22px 22px;
  -webkit-mask-image: radial-gradient(80% 80% at 70% 30%, #000 0%, transparent 70%);
          mask-image: radial-gradient(80% 80% at 70% 30%, #000 0%, transparent 70%);
}
.capa::after { /* arco da marca */
  content: ''; position: absolute; right: -14%; bottom: -30%; width: 70%; aspect-ratio: 1;
  border: 2px solid rgba(198,156,109,.28); border-radius: 50%;
}
.capa--radar    { background: radial-gradient(110% 110% at 25% 15%, #1D3E5F 0%, #0E273F 55%, #081726 100%); }
.capa--mercado  { background: linear-gradient(160deg, #16334F 0%, #0E273F 60%, #081726 100%); }
.capa--pj       { background: linear-gradient(200deg, #1D3E5F 0%, #0E273F 55%, #081726 100%); }
.capa--carreira { background: radial-gradient(120% 120% at 80% 20%, #1D3E5F 0%, #0E273F 60%, #081726 100%); }
.capa--tec      { background: linear-gradient(145deg, #0E273F 0%, #16334F 45%, #081726 100%); }
.capa--ops      { background: linear-gradient(175deg, #16334F 0%, #081726 90%); }
.capa--mkt      { background: radial-gradient(130% 100% at 20% 85%, #1D3E5F 0%, #0E273F 55%, #081726 100%); }

/* navegue por assunto (padrão G4) */
.assuntos { display: grid; grid-template-columns: repeat(4, 1fr); gap: 18px; }
.assunto {
  display: flex; align-items: center; gap: 14px; padding: 20px 22px;
  background: #fff; border: 1px solid var(--paper-line); border-radius: 14px;
  font-weight: 800; color: var(--navy); font-size: 15.5px;
  transition: transform .3s var(--ease-out), box-shadow .3s, border-color .3s;
  cursor: pointer;
}
.assunto:hover { transform: translateY(-3px); box-shadow: 0 14px 34px rgba(14,39,63,.12); border-color: rgba(166,127,79,.5); }
.assunto svg { width: 26px; height: 26px; flex: none; stroke: var(--gold-deep); fill: none; stroke-width: 1.6; stroke-linecap: round; stroke-linejoin: round; }
@media (max-width: 980px) { .assuntos { grid-template-columns: repeat(2, 1fr); } }

/* gráficos editoriais do Radar IA */
.figura {
  margin: 2em 0; border: 1px solid var(--paper-line); border-radius: 16px;
  overflow: hidden; background: #fff;
}
.figura__corpo { background: linear-gradient(165deg, #10293f, #081726); padding: clamp(16px, 3vw, 30px); }
.figura__corpo svg { width: 100%; height: auto; display: block; }
.figura figcaption { padding: 14px 22px; font-size: 13px; font-weight: 600; color: rgba(14,39,63,.55); }
.figura figcaption b { color: var(--gold-aa); }
/* No celular o SVG escala junto com a tipografia: a 320px um rótulo de 12,5
   viraria ~4px. Trava a largura mínima do gráfico e deixa o painel rolar. */
@media (max-width: 640px) {
  .figura__corpo { overflow-x: auto; overscroll-behavior-x: contain; -webkit-overflow-scrolling: touch; }
  .figura__corpo svg { min-width: 680px; }
  .figura figcaption::after { content: ' · arraste o gráfico para o lado'; color: rgba(14,39,63,.42); }
}
/* animação de traço (dispara com .is-in do sistema de reveals) */
.figura .traco { stroke-dasharray: var(--len, 1600); stroke-dashoffset: var(--len, 1600); }
.figura.is-in .traco { animation: desenhaTraco 2.2s var(--ease-out) .25s forwards; }
.figura .barra-h { transform: scaleX(0); transform-origin: left center; }
.figura.is-in .barra-h { animation: cresceBarra .9s var(--ease-out) forwards; }
.figura.is-in .barra-h.b2 { animation-delay: .12s; } .figura.is-in .barra-h.b3 { animation-delay: .24s; }
.figura.is-in .barra-h.b4 { animation-delay: .36s; } .figura.is-in .barra-h.b5 { animation-delay: .48s; }
.figura.is-in .barra-h.b6 { animation-delay: .6s; }  .figura.is-in .barra-h.b7 { animation-delay: .72s; }
.figura.is-in .barra-h.b8 { animation-delay: .84s; } .figura.is-in .barra-h.b9 { animation-delay: 1.05s; }
@keyframes desenhaTraco { to { stroke-dashoffset: 0; } }
@keyframes cresceBarra { to { transform: scaleX(1); } }
@media (prefers-reduced-motion: reduce) {
  .figura .traco { stroke-dashoffset: 0; animation: none !important; }
  .figura .barra-h { transform: none; animation: none !important; }
}

/* barra de progresso de leitura */
.leitura-progresso {
  position: fixed; top: 0; left: 0; height: 3px; width: 100%;
  background: transparent; z-index: 120; pointer-events: none;
}
.leitura-progresso i {
  display: block; height: 100%; width: 0;
  background: linear-gradient(90deg, var(--gold-deep), var(--gold));
}

@media (max-width: 900px) {
  .blog-destaque__inner { grid-template-columns: 1fr; }
}

/* ============================================================
   V28 — LP FORMAÇÃO (espelho estrutural da formacao-g4-lp)
   hero-card navy, grade em acordeões, oferta sticky, faq,
   barra de conversão fixa
   ============================================================ */
.lp-hero { padding: clamp(16px, 2.5vw, 36px); padding-top: calc(77px + clamp(16px, 2.5vw, 36px)); background: #081726; }
.lp-hero__card {
  position: relative; overflow: hidden; border-radius: 26px;
  background:
    radial-gradient(110% 120% at 82% 100%, rgba(198,156,109,.2) 0%, rgba(198,156,109,0) 50%),
    radial-gradient(120% 90% at 18% 8%, rgba(22,51,79,.85) 0%, rgba(14,39,63,0) 55%),
    linear-gradient(168deg, #10293f 0%, #0E273F 38%, #081726 100%);
  border: 1px solid rgba(198,156,109,.2);
}
.lp-hero__inner {
  display: grid; grid-template-columns: minmax(0, 1.08fr) minmax(0, .92fr);
  gap: clamp(20px, 3vw, 48px); align-items: center;
  padding: clamp(36px, 5vw, 64px) clamp(24px, 4vw, 64px) 0;
}
.lp-hero__txt { padding-bottom: clamp(36px, 5vw, 72px); }
.lp-hero h1 { font-family: var(--font-sans); font-weight: 600; font-size: clamp(26px, 3vw, 44px); line-height: 1.25; color: var(--text-on-navy-strong); margin-top: 26px; }
.lp-hero h1 .em-serif { font-family: var(--font-serif); font-style: italic; font-size: 1.05em; color: var(--gold-soft); }
.lp-hero .sub { margin-top: 16px; font-size: clamp(16px, 1.4vw, 19px); font-weight: 600; color: var(--text-on-navy); }
.lp-stats { display: flex; gap: 26px; margin-top: 26px; flex-wrap: wrap; }
.lp-stats span { display: inline-flex; align-items: center; gap: 10px; font-size: 15.5px; font-weight: 700; color: var(--text-on-navy-strong); }
.lp-stats svg { width: 20px; height: 20px; stroke: var(--gold); fill: none; stroke-width: 1.8; }
.lp-stats .div { width: 1px; height: 22px; background: rgba(198,156,109,.35); align-self: center; }
.btn--cta-lp {
  display: inline-flex; align-items: center; gap: 12px;
  margin-top: 30px; padding: 18px 42px; border-radius: 999px;
  background: linear-gradient(100deg, #A87F4F, #D9B888 55%, #C69C6D);
  color: var(--navy-deep); font-weight: 800; font-size: 16.5px; letter-spacing: .06em; text-transform: uppercase;
  box-shadow: 0 14px 38px rgba(198,156,109,.35);
  transition: transform .25s var(--ease-out), box-shadow .25s;
}
.btn--cta-lp:hover { transform: translateY(-2px); box-shadow: 0 18px 46px rgba(198,156,109,.45); }
.btn--cta-lp svg { width: 20px; height: 20px; stroke: currentColor; fill: none; stroke-width: 2.2; }
.lp-hero__fig { position: relative; align-self: end; }
.lp-hero__fig::before {
  content: ''; position: absolute; left: 50%; bottom: 0; transform: translateX(-50%);
  width: 78%; aspect-ratio: 1; border-radius: 50%;
  background: radial-gradient(50% 50% at 50% 60%, rgba(198,156,109,.5) 0%, rgba(198,156,109,0) 70%);
}
.lp-hero__fig { align-self: end; }
.lp-hero__fig img { position: relative; width: 100%; max-width: 520px; height: auto; margin-inline: auto; display: block;
  -webkit-mask-image: linear-gradient(180deg, #000 92%, transparent 100%); mask-image: linear-gradient(180deg, #000 92%, transparent 100%); }

/* grade em acordeões */
.acordeao { border: 1px solid var(--paper-line); border-radius: 16px; background: #fff; overflow: hidden; }
.acordeao + .acordeao { margin-top: 16px; }
.acordeao summary {
  display: flex; align-items: center; gap: 18px; cursor: pointer; list-style: none;
  padding: 24px 30px; font-weight: 800; color: var(--navy);
}
.acordeao summary::-webkit-details-marker { display: none; }
.acordeao summary .num-p { font-family: var(--font-display); font-size: 15px; letter-spacing: .16em; text-transform: uppercase; color: var(--gold-aa); width: 172px; flex: none; }
.acordeao summary b { font-size: 19px; flex: 1; }
.acordeao summary i { font-style: normal; font-size: 12.5px; font-weight: 800; letter-spacing: .12em; color: var(--gold-aa); text-transform: uppercase; white-space: nowrap; }
.acordeao summary .seta { width: 22px; height: 22px; flex: none; transition: transform .3s var(--ease-out); }
.acordeao summary .seta svg { width: 100%; height: 100%; stroke: var(--gold-deep); fill: none; stroke-width: 2; }
.acordeao[open] summary .seta { transform: rotate(180deg); }
.acordeao ul { padding: 4px 30px 24px 220px; display: grid; gap: 12px; }
.acordeao li { position: relative; padding-left: 30px; font-size: 16.5px; font-weight: 600; color: rgba(14,39,63,.75); list-style: none; }
.acordeao li::before { content: ''; position: absolute; left: 0; top: 11px; width: 16px; height: 1.5px; background: var(--gold-deep); }
@media (max-width: 760px) {
  .acordeao summary { flex-wrap: wrap; gap: 8px 14px; }
  .acordeao summary .num-p { width: auto; }
  .acordeao ul { padding-left: 30px; }
}

/* incluído + oferta sticky */
.lp-incluido { display: grid; grid-template-columns: minmax(0, 1.15fr) minmax(0, .85fr); gap: clamp(24px, 3.5vw, 52px); align-items: start; }
.lista-num { display: grid; }
.lista-num li {
  display: flex; align-items: center; gap: 20px; list-style: none;
  padding: 16px 6px; border-bottom: 1px solid rgba(14,39,63,.09);
  font-size: 16.5px; font-weight: 700; color: var(--navy);
}
.lista-num li i { font-style: normal; font-family: var(--font-display); font-size: 15px; color: rgba(14,39,63,.4); width: 30px; flex: none; }
.lista-num li em { margin-left: auto; font-style: normal; font-size: 12px; font-weight: 800; letter-spacing: .1em; text-transform: uppercase; color: var(--gold-aa); white-space: nowrap; }
.oferta-card {
  position: sticky; top: 100px; border-radius: 20px; overflow: hidden;
  background: linear-gradient(170deg, var(--navy-2), var(--navy-deep));
  border: 1px solid rgba(198,156,109,.4); box-shadow: var(--shadow-lift);
  padding: 36px 34px; text-align: center; color: var(--text-on-navy);
}
.oferta-card .k { font-size: 13px; font-weight: 800; letter-spacing: .22em; text-transform: uppercase; color: var(--gold-soft); }
.oferta-card h3 { font-family: var(--font-display); font-weight: 400; font-size: 34px; color: var(--text-on-navy-strong); margin-top: 12px; }
.oferta-card .cond { margin-top: 6px; font-family: var(--font-serif); font-style: italic; font-size: 20px; color: var(--gold-soft); }
.oferta-card ul { margin-top: 20px; display: grid; gap: 10px; text-align: left; }
.oferta-card li { display: flex; gap: 10px; align-items: flex-start; font-size: 15px; font-weight: 600; list-style: none; }
.oferta-card li svg { width: 18px; height: 18px; flex: none; stroke: var(--gold); fill: none; stroke-width: 2.2; margin-top: 2px; }
.oferta-card .btn--cta-lp { width: 100%; justify-content: center; margin-top: 26px; }
.oferta-card .selos { display: flex; justify-content: center; gap: 16px; margin-top: 18px; flex-wrap: wrap; font-size: 12.5px; font-weight: 700; color: rgba(245,243,239,.6); }
@media (max-width: 900px) { .lp-incluido { grid-template-columns: 1fr; } .oferta-card { position: static; } }

/* faq */
.faq details { border-bottom: 1px solid rgba(14,39,63,.12); }
.faq summary { list-style: none; cursor: pointer; display: flex; justify-content: space-between; gap: 18px; align-items: center; padding: 22px 4px; font-size: 17.5px; font-weight: 800; color: var(--navy); }
.faq summary::-webkit-details-marker { display: none; }
.faq summary .seta { width: 20px; height: 20px; flex: none; transition: transform .3s var(--ease-out); }
.faq summary .seta svg { width: 100%; height: 100%; stroke: var(--gold-deep); fill: none; stroke-width: 2; }
.faq details[open] summary .seta { transform: rotate(180deg); }
.faq p { padding: 0 4px 22px; font-size: 16px; line-height: 1.7; font-weight: 600; color: rgba(14,39,63,.7); max-width: 820px; }

/* barra de conversão fixa */
.barra-cta {
  position: fixed; left: 0; right: 0; bottom: 0; z-index: 90;
  background: rgba(8,23,38,.96); backdrop-filter: blur(10px);
  border-top: 1px solid rgba(198,156,109,.3);
  transform: translateY(110%); transition: transform .4s var(--ease-out);
}
.barra-cta.is-on { transform: translateY(0); }
.barra-cta__inner { display: flex; align-items: center; justify-content: space-between; gap: 18px; padding-block: 14px; }
.barra-cta__inner p { font-size: 16.5px; font-weight: 700; color: var(--text-on-navy-strong); }
.barra-cta .btn--cta-lp { margin-top: 0; padding: 13px 30px; font-size: 14px; }
@media (max-width: 760px) { .barra-cta__inner p { display: none; } .barra-cta__inner { justify-content: center; } }

@media (max-width: 900px) { .lp-hero__inner { grid-template-columns: 1fr; } .lp-hero__txt { padding-bottom: 0; } }
@media (prefers-reduced-motion: reduce) { .barra-cta { transition: none; } }

/* ============================================================
   V29 — BLOG CLEAN-G4: MacBook realista com dashboard vivo
   (cursor + tabs), capas em painéis-janela oficiais por
   categoria e passe de limpeza (bordas finas, respiros G4)
   ============================================================ */

/* ---------- passe de limpeza (gramática G4) ---------- */
#lista-posts { gap: 28px; }
#lista-posts .post-card { border-color: rgba(14,39,63,.12); }
#lista-posts .post-card:not(.post-card--featured) .post-card__body { padding: 20px 20px 24px; }
#lista-posts .post-card__body h3 { line-height: 1.4; }
/* data "Em breve" dos cards: mesmo tom do meta (regra faltava) */
.post-card__date { font-size: 12.5px; color: var(--ink-soft); font-weight: 600; letter-spacing: .04em; }
/* sem JS o sistema de reveals nunca liga: entrega tudo visível */
@media (scripting: none) {
  .reveal { opacity: 1; transform: none; }
}

/* destaque vira palco do MacBook: sem card, sem borda, só a máquina */
.blog-destaque__fig--mac {
  position: relative; border: 0; border-radius: 0; overflow: visible;
  background: none; box-shadow: none;
}

/* ---------- MacBook (marco realista, 100% código) ---------- */
.mac { position: relative; width: 100%; }
.mac__screen {
  position: relative; border-radius: 18px 18px 0 0;
  background: linear-gradient(180deg, #2A2D33 0%, #17191D 12%, #0B0D10 100%);
  padding: 2.4% 2.4% 2.8%;
  box-shadow:
    0 34px 70px -22px rgba(8,23,38,.55),
    0 10px 26px rgba(8,23,38,.22),
    inset 0 1px 0 rgba(255,255,255,.16);
}
.mac__notch {
  position: absolute; top: 0; left: 50%; transform: translateX(-50%);
  width: 17%; height: 2.1%; min-height: 8px; z-index: 3;
  background: #0B0D10; border-radius: 0 0 7px 7px;
}
.mac__notch::after { /* câmera */
  content: ''; position: absolute; top: 28%; left: 50%; transform: translateX(-50%);
  width: 4px; height: 4px; border-radius: 50%;
  background: #1E2A3A; box-shadow: 0 0 3px rgba(90,140,200,.55);
}
.mac__display {
  position: relative; overflow: hidden; border-radius: 8px;
  aspect-ratio: 16 / 10.4;
  background: linear-gradient(168deg, #10293F 0%, #0E273F 46%, #081726 100%);
}
.mac__base {
  position: relative; height: 13px; margin-inline: -3.5%;
  background: linear-gradient(180deg, #E8E9EB 0%, #C9CBCF 38%, #9EA2A8 82%, #6E7278 100%);
  border-radius: 2px 2px 12px 12px;
  box-shadow: 0 16px 30px -12px rgba(8,23,38,.4);
}
.mac__base::before { /* recorte de abertura da tampa */
  content: ''; position: absolute; top: 0; left: 50%; transform: translateX(-50%);
  width: 12%; height: 42%;
  background: linear-gradient(180deg, #8E9298, #B9BCC1);
  border-radius: 0 0 10px 10px;
}
.mac__base::after { /* sombra de apoio no chão */
  content: ''; position: absolute; left: 6%; right: 6%; bottom: -14px; height: 14px;
  background: radial-gradient(50% 100% at 50% 0%, rgba(8,23,38,.28), transparent 72%);
}

/* ---------- app Radar IA dentro da tela ---------- */
.mapp { position: absolute; inset: 0; display: flex; flex-direction: column; font-family: var(--font-sans); }
.mapp__bar {
  display: flex; align-items: center; gap: 10px;
  padding: 4.2% 3.6% 2.6%; flex: none;
}
.mapp__lights { display: inline-flex; gap: 5px; flex: none; }
.mapp__lights i { width: 8px; height: 8px; border-radius: 50%; display: block; }
.mapp__lights i:nth-child(1) { background: #FF5F57; }
.mapp__lights i:nth-child(2) { background: #FEBC2E; }
.mapp__lights i:nth-child(3) { background: #28C840; }
.mapp__title {
  font-size: clamp(8px, 1.1vw, 11.5px); font-weight: 700; letter-spacing: .04em;
  color: rgba(245,243,239,.66); white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
.mapp__live {
  margin-left: auto; display: inline-flex; align-items: center; gap: 6px; flex: none;
  font-size: clamp(7px, .95vw, 10px); font-weight: 800; letter-spacing: .14em; text-transform: uppercase;
  color: var(--gold-soft); border: 1px solid rgba(198,156,109,.4);
  border-radius: 999px; padding: 3px 9px; background: rgba(8,23,38,.5);
}
.mapp__live .radar-dot { width: 7px; height: 7px; }
.mapp__kpis { display: grid; grid-template-columns: repeat(3, 1fr); gap: 2.4%; padding-inline: 3.6%; flex: none; }
.mapp__kpi {
  border: 1px solid rgba(198,156,109,.22); border-radius: 8px;
  background: rgba(22,51,79,.5); padding: 5.5% 8%;
  transition: transform .45s var(--ease-out), border-color .45s, background .45s;
}
.mapp__kpi.is-hot { transform: translateY(-3px); border-color: rgba(198,156,109,.65); background: rgba(22,51,79,.85); }
.mapp__kpi b { display: block; font-family: var(--font-display); font-weight: 400; font-size: clamp(11px, 1.7vw, 19px); color: #E7D3B4; line-height: 1.1; }
.mapp__kpi span { display: block; margin-top: 3px; font-size: clamp(6.5px, .85vw, 9.5px); font-weight: 700; letter-spacing: .08em; text-transform: uppercase; color: rgba(245,243,239,.55); }
.mapp__tabs { display: flex; gap: 6px; padding: 2.8% 3.6% 0; flex: none; }
.mapp__tab {
  font-size: clamp(7.5px, 1vw, 11px); font-weight: 800; letter-spacing: .06em;
  color: rgba(245,243,239,.6); background: none; border: 1px solid transparent;
  border-radius: 999px; padding: 4px 12px; cursor: pointer;
  transition: color .3s, background .3s, border-color .3s;
}
.mapp__tab:hover { color: var(--gold-soft); }
.mapp__tab.is-on { color: var(--gold-soft); background: rgba(198,156,109,.14); border-color: rgba(198,156,109,.4); }
.mapp__views { position: relative; flex: 1; margin: 2% 3.6% 0; min-height: 0; }
.mapp__view { position: absolute; inset: 0; opacity: 0; visibility: hidden; transition: opacity .5s var(--ease-out), visibility .5s; pointer-events: none; }
.mapp__view.is-on { opacity: 1; visibility: visible; }
.mapp__view svg { width: 100%; height: 100%; display: block; }
/* barras regionais: crescem quando a view liga
   (transform-box: fill-box — senão a origem é o canvas do SVG) */
.mapp__view .rbar { transform: scaleX(0); transform-box: fill-box; transform-origin: left center; }
.mapp__view.is-on .rbar { animation: cresceBarra .8s var(--ease-out) forwards; }
.mapp__view.is-on .rbar.r2 { animation-delay: .08s; } .mapp__view.is-on .rbar.r3 { animation-delay: .16s; }
.mapp__view.is-on .rbar.r4 { animation-delay: .24s; } .mapp__view.is-on .rbar.r5 { animation-delay: .32s; }
/* traço da tendência: redesenha quando a view liga */
.mapp__view .traco2 { stroke-dasharray: var(--len, 1000); stroke-dashoffset: var(--len, 1000); }
.mapp__view.is-on .traco2 { animation: desenhaTraco 1.8s var(--ease-out) .15s forwards; }
.mapp__foot {
  flex: none; display: flex; align-items: center; justify-content: space-between; gap: 10px;
  padding: 2.2% 3.6% 3.2%;
  font-size: clamp(6.5px, .85vw, 9.5px); font-weight: 600; color: rgba(245,243,239,.42);
}
.mapp__foot b { color: rgba(231,211,180,.75); font-weight: 800; letter-spacing: .1em; text-transform: uppercase; }
@media (prefers-reduced-motion: reduce) {
  .mapp__view .rbar { transform: none; animation: none !important; }
  .mapp__view .traco2 { stroke-dashoffset: 0; animation: none !important; }
  .mac .mcursor { display: none; }
}
.mac.is-manual .mcursor { opacity: 0; } /* cliente no controle: seta fake some */

/* ---------- capas: painéis-janela oficiais ---------- */
.capa .janela {
  position: absolute; left: 50%; top: 54%; transform: translate(-50%, -50%);
  width: 74%; border-radius: 10px; overflow: hidden;
  background: linear-gradient(180deg, #FDFCF9, #F4F0E7);
  border: 1px solid rgba(14,39,63,.18);
  box-shadow: 0 18px 40px -12px rgba(3,10,18,.6), 0 4px 12px rgba(3,10,18,.3);
  transition: transform .5s var(--ease-out), box-shadow .5s var(--ease-out);
}
.post-card:hover .capa .janela { transform: translate(-50%, -53%); box-shadow: 0 26px 52px -14px rgba(3,10,18,.68), 0 6px 16px rgba(3,10,18,.34); }
.post-card:hover .capa { transform: none; } /* zoom sai; a janela é quem responde */
.janela__bar {
  display: flex; align-items: center; gap: 7px;
  padding: 6px 10px; background: #EDE8DC; border-bottom: 1px solid rgba(14,39,63,.1);
}
.janela__bar i { width: 6.5px; height: 6.5px; border-radius: 50%; display: block; flex: none; }
.janela__bar i:nth-child(1) { background: #FF5F57; }
.janela__bar i:nth-child(2) { background: #FEBC2E; }
.janela__bar i:nth-child(3) { background: #28C840; }
.janela__bar b {
  margin-left: 4px; font-size: 8px; font-weight: 700; letter-spacing: .05em;
  color: rgba(14,39,63,.55); white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
.janela__body { display: block; position: relative; padding: 10px 12px 12px; min-height: 86px; }
/* peças de UI reutilizáveis dos painéis */
.ui-linha { display: block; height: 6px; border-radius: 3px; background: rgba(14,39,63,.14); margin-top: 6px; }
.ui-linha--t { width: 62%; background: rgba(14,39,63,.28); margin-top: 0; }
.ui-pill {
  display: inline-flex; align-items: center; gap: 4px;
  font-size: 7.5px; font-weight: 800; letter-spacing: .08em; text-transform: uppercase;
  color: #6E4F27; background: rgba(198,156,109,.22); border: 1px solid rgba(166,127,79,.45);
  border-radius: 999px; padding: 3px 8px;
}
.ui-pill svg { width: 8px; height: 8px; stroke: #6E4F27; fill: none; stroke-width: 3; }
.ui-barras { display: flex; align-items: flex-end; gap: 7%; height: 58px; padding-top: 8px; }
.ui-barras i { flex: 1; border-radius: 3px 3px 0 0; background: linear-gradient(180deg, var(--gold), var(--gold-deep)); display: block; }
.ui-check { display: flex; align-items: center; gap: 7px; margin-top: 7px; }
.ui-check i {
  width: 11px; height: 11px; border-radius: 3.5px; flex: none;
  background: var(--gold-deep); display: grid; place-items: center;
}
.ui-check i svg { width: 7px; height: 7px; stroke: #fff; fill: none; stroke-width: 3.4; }
.ui-check span { height: 6px; border-radius: 3px; background: rgba(14,39,63,.16); flex: 1; display: block; }
.ui-msg { display: block; max-width: 78%; border-radius: 9px; padding: 7px 9px; margin-top: 7px; }
.ui-msg i { display: block; height: 5px; border-radius: 2.5px; background: rgba(14,39,63,.2); }
.ui-msg i + i { margin-top: 4px; width: 70%; }
.ui-msg--in { background: rgba(14,39,63,.08); border: 1px solid rgba(14,39,63,.1); }
.ui-msg--out { margin-left: auto; background: rgba(198,156,109,.2); border: 1px solid rgba(166,127,79,.35); }
.ui-msg--out i { background: rgba(110,79,39,.4); }
.ui-avatar {
  width: 26px; height: 26px; border-radius: 50%; flex: none;
  background: radial-gradient(circle at 35% 30%, #1D3E5F, #081726);
  border: 1.5px solid var(--gold); display: grid; place-items: center;
}
.ui-avatar img { width: 13px; height: auto; }
.ui-anel { display: block; position: relative; width: 44px; height: 44px; border-radius: 50%; flex: none;
  background: conic-gradient(var(--gold) calc(var(--val, 98) * 1%), rgba(14,39,63,.12) 0); }
.ui-anel::before { content: ''; position: absolute; inset: 5px; border-radius: 50%; background: #FDFCF9; }
.ui-anel b { position: absolute; inset: 0; display: grid; place-items: center; font-size: 10px; font-weight: 800; color: #6E4F27; }
/* funil de captação */
.ui-funil { display: grid; gap: 5px; padding-top: 6px; }
.ui-funil i { height: 12px; border-radius: 3px; background: linear-gradient(90deg, var(--gold), var(--gold-deep)); display: block; }
.ui-funil i:nth-child(2) { width: 72%; opacity: .8; }
.ui-funil i:nth-child(3) { width: 46%; opacity: .6; }

@media (max-width: 520px) {
  .capa .janela { width: 82%; top: 58%; } /* respiro sob o rótulo da categoria */
  .mapp__kpi span { letter-spacing: .04em; }
}
/* faixas onde o card fica estreito e a mídia 16/9 é baixa demais
   para a janela + rótulo: mídia 4/3 (proporção de capa da G4) */
@media (min-width: 641px) and (max-width: 860px), (min-width: 1025px) and (max-width: 1240px), (max-width: 380px) {
  #lista-posts .post-card:not(.post-card--featured) .post-card__media { aspect-ratio: 4 / 3; }
}
@media (max-width: 380px) {
  #lista-posts .post-card--featured .post-card__media { aspect-ratio: 4 / 3; }
}
/* ≤400px: o display do mac fica raso — rodapé sai, gráfico respira */
@media (max-width: 400px) {
  .mapp__foot { display: none; }
  .mapp__kpi { padding: 4% 6.5%; }
}


/* ============================================================
   V30 — CANTOS RETOS NO BLOG (diretriz do dono, 2026-07-17):
   nenhum fundo arredondado — superfícies, chips e painéis a 2px.
   Círculos legítimos (avatares, luzes, dots, anel) permanecem.
   Escopo: body.pg-blog (blog + posts).
   ============================================================ */
.pg-blog .post-card,
.pg-blog .blog-destaque__fig,
.pg-blog .assunto,
.pg-blog .mapp__kpi,
.pg-blog .capa .janela,
.pg-blog .figura,
.pg-blog .artigo-toc,
.pg-blog .artigo-cta,
.pg-blog .assinatura-ia,
.pg-blog .ui-msg,
.pg-blog .ui-check i,
.pg-blog .ui-check span,
.pg-blog .ui-linha,
.pg-blog .ui-funil i,
.pg-blog .cat-label,
.pg-blog .filter-chip,
.pg-blog .chip-cat,
.pg-blog .blog-bar__cats a,
.pg-blog .blog-search input,
.pg-blog .mapp__live,
.pg-blog .mapp__tab,
.pg-blog .ui-pill,
.pg-blog .btn,
.pg-blog .ui-msg i { border-radius: 2px; }
.pg-blog .mac__screen { border-radius: 2px 2px 0 0; }
.pg-blog .mac__notch { border-radius: 0 0 2px 2px; }
.pg-blog .mac__display { border-radius: 2px; }
.pg-blog .mac__base { border-radius: 2px; }
.pg-blog .mac__base::before { border-radius: 0 0 2px 2px; }
.pg-blog .ui-barras i { border-radius: 2px 2px 0 0; }
.pg-blog .artigo-corpo blockquote { border-radius: 0 2px 2px 0; }

/* ============================================================
   V31 — PORTAL DE NOTÍCIAS: masthead de jornal, manchete com
   foto + coluna Destaques, banda Radar IA ao vivo, cards
   fotográficos com crédito de foto e figuras editoriais no post
   ============================================================ */

/* ---------- topo de jornal ---------- */
.jornal-topo { background: #FBF9F4; border-bottom: 1px solid var(--paper-line); margin-top: 77px; }
@media (max-width: 860px) { .jornal-topo { margin-top: 64px; } }
.jornal-strip {
  display: flex; align-items: center; justify-content: space-between; gap: 14px; flex-wrap: wrap; row-gap: 4px;
  padding-block: 9px; border-bottom: 1px solid var(--paper-line);
  font-size: 11.5px; font-weight: 700; letter-spacing: .07em; text-transform: uppercase; color: rgba(14,39,63,.55);
}
.jornal-aovivo { display: inline-flex; align-items: center; gap: 8px; color: #8A6538; }
.jornal-masthead { text-align: center; padding-block: clamp(20px, 3vw, 30px) clamp(16px, 2.4vw, 24px); }
.jornal-marca { font-family: var(--font-display); font-size: clamp(34px, 4.6vw, 56px); line-height: 1; color: var(--navy); letter-spacing: .02em; }
.jornal-tag {
  margin-top: 12px; display: flex; align-items: center; justify-content: center; gap: 16px;
  font-size: 11px; font-weight: 800; letter-spacing: .28em; text-transform: uppercase; color: #8A6538;
}
.jornal-tag::before, .jornal-tag::after { content: ''; height: 1px; background: rgba(166,127,79,.4); flex: 1; max-width: 170px; }
.jornal-cats-wrap {
  position: sticky; top: 77px; z-index: 40;
  background: rgba(8,23,38,.94); -webkit-backdrop-filter: blur(10px); backdrop-filter: blur(10px);
  border-bottom: 1px solid var(--navy-line);
}
@media (max-width: 860px) { .jornal-cats-wrap { top: 64px; } }
.jornal-cats-inner { display: flex; align-items: center; gap: 16px; padding-block: 11px; }
.jornal-cats { display: flex; flex: 1; min-width: 0; overflow-x: auto; scrollbar-width: none; }
.jornal-cats::-webkit-scrollbar { display: none; }
.jornal-cats a {
  font-size: 12px; font-weight: 800; letter-spacing: .1em; text-transform: uppercase;
  color: var(--text-on-navy); padding: 6px 14px; border-right: 1px solid rgba(198,156,109,.18); white-space: nowrap;
}
.jornal-cats a:first-child { padding-left: 0; }
.jornal-cats a:last-child { border-right: 0; }
.jornal-cats a:hover { color: var(--gold-soft); }

/* ---------- manchete ---------- */
.manchete { background: radial-gradient(120% 90% at 8% 0%, #FBF8F1 0%, #F3EEE3 52%, #EAE2D2 100%); }
.manchete__grid {
  display: grid; grid-template-columns: minmax(0, 1.6fr) minmax(0, 1fr);
  gap: clamp(26px, 3.5vw, 54px); padding-block: clamp(28px, 4vw, 52px);
}
.manchete__foto { position: relative; display: block; overflow: hidden; border-radius: 2px; border: 1px solid rgba(14,39,63,.14); }
.manchete__foto img { width: 100%; height: auto; display: block; transition: transform .7s var(--ease-out); }
.manchete__foto:hover img { transform: scale(1.03); }
.foto-credito {
  position: absolute; right: 0; bottom: 0; z-index: 2;
  font-size: 10px; font-weight: 600; letter-spacing: .04em;
  color: rgba(245,243,239,.88); background: rgba(8,23,38,.62); padding: 4px 9px; border-radius: 2px 0 0 0;
}
.kicker {
  display: inline-flex; align-items: center; gap: 8px;
  font-size: 12px; font-weight: 800; letter-spacing: .18em; text-transform: uppercase; color: #8A6538;
}
.manchete h1 { font-family: var(--font-display); font-weight: 400; font-size: clamp(27px, 3.1vw, 42px); line-height: 1.15; color: var(--navy); margin-top: 20px; }
.manchete h1 a { color: inherit; }
.manchete h1 a:hover { text-decoration: underline; text-decoration-color: rgba(166,127,79,.5); text-underline-offset: 6px; }
.manchete__deck { margin-top: 12px; font-size: 16.5px; line-height: 1.65; color: rgba(14,39,63,.75); max-width: 660px; }
.manchete__byline { margin-top: 14px; font-size: 13px; font-weight: 600; color: rgba(14,39,63,.55); }
.manchete__byline b { color: #8A6538; }
.manchete__mais { display: inline-block; margin-top: 10px; font-weight: 800; font-size: 14px; color: #8A6538; }
.manchete__mais:hover { text-decoration: underline; text-underline-offset: 4px; }

/* coluna Destaques */
.rail { border-left: 1px solid rgba(166,127,79,.35); padding-left: clamp(18px, 2vw, 30px); }
.rail__titulo {
  display: inline-block; font-size: 12.5px; font-weight: 800; letter-spacing: .22em; text-transform: uppercase;
  color: var(--navy); padding-bottom: 9px; border-bottom: 2px solid var(--gold);
}
.rail__item { display: block; padding-block: 15px; border-bottom: 1px solid var(--paper-line); }
.rail__item:last-child { border-bottom: 0; padding-bottom: 0; }
.rail__kicker { display: block; font-size: 10.5px; font-weight: 800; letter-spacing: .14em; text-transform: uppercase; color: #8A6538; }
.rail__headline { display: block; margin-top: 6px; font-family: var(--font-serif); font-size: 15.5px; line-height: 1.45; color: var(--ink); transition: color .25s; }
.rail__item:hover .rail__headline { color: #8A6538; }
.rail__meta { display: block; margin-top: 6px; font-size: 11.5px; font-weight: 700; color: rgba(14,39,63,.45); }
@media (max-width: 900px) {
  .manchete__grid { grid-template-columns: 1fr; }
  .rail { border-left: 0; padding-left: 0; border-top: 1px solid var(--paper-line); padding-top: 20px; }
}

/* ---------- banda Radar IA ao vivo ---------- */
.banda-radar__grid {
  display: grid; grid-template-columns: minmax(0, .85fr) minmax(0, 1.15fr);
  gap: clamp(28px, 4vw, 60px); align-items: center;
}
@media (max-width: 900px) { .banda-radar__grid { grid-template-columns: 1fr; } }

/* ---------- cards fotográficos ---------- */
.post-card__media--foto { aspect-ratio: 16 / 10; position: relative; overflow: hidden; }
.post-card__media--foto img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; transition: transform .7s var(--ease-out); }
.post-card:hover .post-card__media--foto img { transform: scale(1.045); }
.post-card__media--foto .foto-credito { font-size: 9.5px; padding: 3px 8px; }
.post-card__kicker {
  display: inline-flex; align-items: center; gap: 7px; margin-bottom: 8px;
  font-size: 10.5px; font-weight: 800; letter-spacing: .14em; text-transform: uppercase; color: #8A6538;
}
.post-card__kicker + h3 { margin-top: 0; }
.post-card__body .post-card__meta { margin-top: 12px; }

/* ---------- figuras editoriais do post ---------- */
.foto-noticia { margin: 1.5em 0 1.9em; }
.foto-noticia img { width: 100%; height: auto; display: block; border-radius: 2px; border: 1px solid var(--paper-line); }
.foto-noticia figcaption { margin-top: 9px; font-size: 13px; line-height: 1.55; color: rgba(14,39,63,.62); font-weight: 600; }
.foto-noticia .cred { color: rgba(14,39,63,.42); font-size: 12px; white-space: nowrap; }


/* ============================================================
   V32 — CAMADA 3D INSTITUCIONAL: fundos de vídeo pré-renderizados
   (esteira do método, emblema, destaques), orbit com profundidade
   e micro-tilt 3D nos cards (runtime, pointer fine)
   ============================================================ */

/* fundo de vídeo genérico de seção */
.secao-3d { position: relative; overflow: hidden; }
.secao-3d > .container { position: relative; z-index: 2; }
.fundo-3d { position: absolute; inset: 0; z-index: 0; pointer-events: none; }
.fundo-3d video { width: 100%; height: 100%; object-fit: cover; display: block; }
.fundo-3d--metodo video { opacity: .5; }
.fundo-3d--metodo::after { content: ''; position: absolute; inset: 0;
  background: linear-gradient(180deg, rgba(14,39,63,.78) 0%, rgba(11,29,48,.6) 45%, rgba(8,23,38,.88) 100%); }
.fundo-3d--emblema video { opacity: .55; }
.fundo-3d--emblema::after { content: ''; position: absolute; inset: 0;
  background: radial-gradient(80% 90% at 50% 50%, rgba(8,23,38,.42) 0%, rgba(8,23,38,.82) 100%); }

/* destaques: vídeo no lugar da imagem, mesmo comportamento do hover */
.triple__media video { width: 100%; height: 100%; object-fit: cover; display: block;
  transition: transform .8s var(--ease-out); }
.triple__card:hover .triple__media video { transform: scale(1.05); }

/* orbit: profundidade (anéis inclinados + espessura nos nós + palco) */
.orbit-wrap { perspective: 1100px; }
.orbit-wrap::after { content: ''; position: absolute; left: 8%; right: 8%; bottom: -5%;
  height: 12%; border-radius: 50%; z-index: -1;
  background: radial-gradient(50% 50% at 50% 50%, rgba(0,0,0,.4) 0%, rgba(0,0,0,0) 72%); }
.orbit-center { box-shadow: 0 0 0 10px rgba(198,156,109,.05), 0 0 64px rgba(198,156,109,.22),
  0 26px 60px rgba(4,12,22,.55); }

@media (prefers-reduced-motion: reduce) {
  .fundo-3d video { display: none; }
  .fundo-3d { background: linear-gradient(168deg, #10293f 0%, #0E273F 38%, #081726 100%); }
}


/* ============================================================
   V33 — Tour da plataforma (Remotion): vídeo dentro da moldura mac
   ============================================================ */
.mockup__tour { display: block; width: 100%; aspect-ratio: 1600 / 920; object-fit: cover;
  border-radius: 0 0 14px 14px; background: #F5F3EF; }


/* ============================================================
   V34 — Plataforma Cinema (Higgsfield + Remotion)
   ============================================================ */
.cinema { border-radius: var(--radius-lg); overflow: hidden; box-shadow: var(--shadow-lift);
  border: 1px solid rgba(14,39,63,.14); }
.cinema video { display: block; width: 100%; aspect-ratio: 16 / 9; object-fit: cover; background: #06101C; }


/* ============================================================
   V35 — Statement com símbolo à esquerda (vídeo) e texto à direita
   ============================================================ */
@media (min-width: 901px) {
  .statement--simbolo-esq .container { max-width: none; padding-inline: 0; }
  .statement--simbolo-esq .container > * { max-width: min(620px, 50vw); margin-left: 46%; text-align: left; }
  .statement--simbolo-esq .eyebrow--center { justify-content: flex-start; }
}


/* ============================================================
   V36 — Animações ao rolar (scroll-driven, progressive enhancement)
   Alvos SEM .reveal próprio e SEM :hover com transform
   (lição do tilt: nunca competir com transforms de classe).
   ============================================================ */
@supports (animation-timeline: view()) {
  @media (prefers-reduced-motion: no-preference) {
    @keyframes v36-sobe {
      from { opacity: 0; transform: translateY(var(--v36-dist, 18px)); }
      to { opacity: 1; transform: translateY(0); }
    }
    @keyframes v36-flutua-suave {
      from { transform: translateY(16px); }
      to { transform: translateY(-10px); }
    }
    /* faixa de números: cascata sutil ao entrar */
    .stats .stat {
      animation: v36-sobe linear both;
      animation-timeline: view();
      animation-range: entry 10% entry 90%;
    }
    .stats .stat:nth-child(2) { --v36-dist: 30px; }
    .stats .stat:nth-child(3) { --v36-dist: 42px; }
    .stats .stat:nth-child(4) { --v36-dist: 54px; }
    /* gravura "O que é": deriva vertical leve */
    .whatis__duo .whatis__figure {
      animation: v36-flutua-suave linear both;
      animation-timeline: view();
      animation-range: cover 0% cover 100%;
    }
  }
}


/* ============================================================
   V37 — Nível G4 total: hero slide 2 navy cinema ·
   órbita realista · metodo-cine
   ============================================================ */

/* ---------- Hero slide 2: "A Nova Era" navy cinema ---------- */
.hero--cine {
  color: #F5F3EF;
  background:
    radial-gradient(52% 64% at 72% 68%, rgba(198,156,109,.2) 0%, rgba(198,156,109,0) 70%),
    radial-gradient(40% 52% at 12% 8%, rgba(43,90,138,.32) 0%, rgba(43,90,138,0) 65%),
    linear-gradient(118deg, rgba(198,156,109,0) 44%, rgba(198,156,109,.07) 50%, rgba(198,156,109,0) 56%),
    linear-gradient(100deg, rgba(198,156,109,0) 63%, rgba(198,156,109,.05) 69%, rgba(198,156,109,0) 75%),
    linear-gradient(152deg, #0A1E33 0%, #0E273F 48%, #071624 100%);
}
.hero--cine::after { opacity: .7; }
.hero--cine .display-tag { color: var(--gold-soft); }
.hero--cine h1, .hero--cine h2.as-h1 { color: #F5F3EF; }
.hero--cine h1 .em-serif, .hero--cine h2.as-h1 .em-serif { color: var(--gold-soft); }
.hero--cine .lead { color: rgba(245,243,239,.78); }
.hero--cine .trio-hero::before {
  content: '';
  position: absolute;
  left: 50%; bottom: 0;
  width: 130%; height: 86%;
  transform: translateX(-50%);
  background: radial-gradient(50% 62% at 50% 74%, rgba(198,156,109,.3) 0%, rgba(198,156,109,0) 70%);
  pointer-events: none;
}
.hero--cine .trio-hero img {
  filter: drop-shadow(0 20px 34px rgba(2,8,16,.6)) saturate(1.02) contrast(1.03);
}

/* ---------- Ecossistema: fundo cinematográfico + órbita realista ---------- */
#ecossistema {
  position: relative;
  overflow: hidden;
  background:
    radial-gradient(46% 46% at 50% 58%, rgba(198,156,109,.13) 0%, rgba(198,156,109,0) 70%),
    radial-gradient(120% 90% at 50% -10%, rgba(43,90,138,.24) 0%, rgba(43,90,138,0) 55%),
    radial-gradient(rgba(245,243,239,.05) 1px, transparent 1.4px),
    linear-gradient(168deg, #10293F 0%, #0E273F 42%, #071624 100%);
  background-size: auto, auto, 30px 30px, auto;
}
#ecossistema::before {
  content: '';
  position: absolute;
  inset: 0;
  pointer-events: none;
  background:
    linear-gradient(116deg, rgba(198,156,109,0) 40%, rgba(198,156,109,.06) 50%, rgba(198,156,109,0) 60%),
    radial-gradient(130% 110% at 50% 50%, rgba(0,0,0,0) 55%, rgba(3,10,18,.5) 100%);
}
#ecossistema .container { position: relative; z-index: 1; }
/* anel externo metálico (gradiente cônico mascarado em anel) */
.orbit-ring {
  border: none;
  background: conic-gradient(from 210deg,
    rgba(198,156,109,.06) 0%, rgba(198,156,109,.55) 18%, rgba(198,156,109,.1) 38%,
    rgba(198,156,109,.4) 55%, rgba(198,156,109,.08) 74%, rgba(198,156,109,.5) 90%, rgba(198,156,109,.06) 100%);
  -webkit-mask: radial-gradient(farthest-side, transparent calc(100% - 2px), #000 calc(100% - 1.6px));
  mask: radial-gradient(farthest-side, transparent calc(100% - 2px), #000 calc(100% - 1.6px));
}
.orbit-ring--inner {
  opacity: .75;
  -webkit-mask: radial-gradient(farthest-side, transparent calc(100% - 1.4px), #000 calc(100% - 1px));
  mask: radial-gradient(farthest-side, transparent calc(100% - 1.4px), #000 calc(100% - 1px));
}
/* hub em vidro navy com especular */
.orbit-center {
  background:
    radial-gradient(58% 42% at 32% 22%, rgba(245,243,239,.14) 0%, rgba(245,243,239,0) 60%),
    radial-gradient(circle at 34% 30%, var(--navy-3), var(--navy-deep) 78%);
  border: 1px solid rgba(198,156,109,.62);
  box-shadow:
    inset 0 1px 0 rgba(245,243,239,.12),
    inset 0 -18px 34px rgba(3,10,18,.5),
    0 0 0 10px rgba(198,156,109,.05),
    0 0 72px rgba(198,156,109,.26),
    0 30px 70px rgba(4,12,22,.6);
}
/* palco: sombra + reflexo dourado do conjunto */
.orbit-wrap::after {
  background:
    radial-gradient(50% 50% at 50% 42%, rgba(198,156,109,.14) 0%, rgba(198,156,109,0) 62%),
    radial-gradient(50% 50% at 50% 50%, rgba(0,0,0,.46) 0%, rgba(0,0,0,0) 72%);
}

/* ---------- metodo-cine: cena mais presente que a esteira antiga ---------- */
.fundo-3d--metodo video { opacity: .68; }
.fundo-3d--metodo::after {
  background:
    linear-gradient(90deg, rgba(6,16,28,.6) 0%, rgba(6,16,28,.18) 46%, rgba(6,16,28,0) 62%),
    linear-gradient(180deg, rgba(9,22,38,.82) 0%, rgba(11,29,48,.5) 42%, rgba(6,18,30,.9) 100%);
}

/* ---------- Banners do topo: proporção fina em faixas intermediárias ---------- */
@media (max-width: 900px) {
  .hero--paper .display-tag, .hero--triade .display-tag { font-size: clamp(18px, 4.6vw, 26px); margin-bottom: 8px; }
  .hero--paper .hero__inner, .hero--triade .hero__inner { padding-block: clamp(36px, 7vw, 64px) clamp(28px, 6vw, 48px); }
  .hero--cine .trio-hero img { width: min(92%, 520px); }
}
@media (min-width: 641px) and (max-width: 900px) {
  .journey-video { max-width: min(560px, 78vw); }
}


/* V37.1 — refinamento: flow fino e nós com corpo visível na órbita */
.orbit-flow circle {
  stroke-width: .42;
  stroke-dasharray: .9 3.6;
  stroke: rgba(198,156,109,.55);
}
.orbit-flow circle:nth-child(2) {
  stroke-width: .34;
  stroke-dasharray: .7 3;
  stroke: rgba(198,156,109,.34);
}
/* os chips da órbita voltam a ter corpo (vence o "ícones sem fundo" global) */
.orbit-node i {
  width: 58px; height: 58px;
  background:
    radial-gradient(70% 52% at 32% 22%, rgba(245,243,239,.13) 0%, rgba(245,243,239,0) 58%),
    linear-gradient(180deg, #17344F 0%, #0B2036 100%) !important;
  border: 1px solid rgba(198,156,109,.58) !important;
  box-shadow:
    inset 0 1px 0 rgba(245,243,239,.12),
    0 0 22px rgba(198,156,109,.14),
    0 12px 26px rgba(3,10,18,.5) !important;
}
.orbit-node i svg { width: 24px; height: 24px; }
.orbit-node:hover i { box-shadow: 0 0 30px rgba(198,156,109,.4), inset 0 1px 0 rgba(245,243,239,.12), 0 12px 26px rgba(3,10,18,.5) !important; }
@media (max-width: 860px) { .orbit-node i { width: 48px; height: 48px; } }


/* ============================================================
   V37.2 — Correções do review adversarial (38 agentes)
   ============================================================ */
/* Setas do slider: em ≤1240px descem para a base (colidiam com
   headline/CTAs em 390-1024px — interceptavam o toque) */
@media (max-width: 1240px) {
  .hero-slider__arrow { top: auto; bottom: 12px; transform: none; width: 44px; height: 44px; }
  .hero-slider__arrow:hover { transform: scale(1.06); }
  .hero-slider__arrow--prev { left: 12px; }
  .hero-slider__arrow--next { right: 12px; }
}
/* Órbita: os nós projetam 56px além do círculo — reserva vertical
   (o chip Formação cobria "única pessoa: você.") */
.orbit-wrap { margin-block: clamp(64px, 8vw, 80px) clamp(80px, 9vw, 96px); }
/* hero--cine: nenhum vazamento do skin claro */
.hero--cine .display-tag { text-shadow: none; }
/* h1 do slide 1 (única h1 da página) herda o estilo do h2.as-h1 */
.hero--triade h1.as-h1 {
  font-family: var(--font-sans);
  font-weight: 500;
  font-size: clamp(22px, 2.3vw, 33px);
  line-height: 1.32;
  color: var(--navy);
}
.hero--triade h1.as-h1 .em-serif { font-size: 1.06em; color: #A87F4F; font-style: italic; }
@media (min-width: 901px) {
  .hero--triade h1.as-h1 { font-size: clamp(20px, 2.1vw, 34px); }
}
/* respiro entre o lead do #metodo e o nav do rail em telas médias */
@media (max-width: 900px) {
  #metodo [data-rail] { margin-top: 18px; }
}
/* vídeo do hero volta a ser recortado pelo painel (sem parallax) */
.journey-video { overflow: hidden; }


/* ============================================================
   V38 — TOKENS SEMÂNTICOS + FUNDAÇÕES (redesign G4 · Etapa A)
   Breakpoints canônicos p/ código novo: 360 / 640 / 860 / 1024 / 1200 / 1440
   ============================================================ */
:root {
  /* paleta semântica (aliases da paleta oficial — nada muda visualmente) */
  --navy-950: #071624;
  --navy-900: var(--navy);
  --navy-850: #0A1E33;
  --navy-800: var(--navy-2);
  --gold-300: var(--gold-soft);
  --gold-500: var(--gold);
  --gold-600: var(--gold-deep);
  --ivory-50: #FAF9F6;
  --ivory-100: var(--offwhite);
  --success: #2F6F55;
  --warning: #A96C2F;
  --error: #A94442;
  /* escala tipográfica fluida */
  --display-xl: clamp(3rem, 6.2vw, 6.75rem);
  --display-lg: clamp(2.5rem, 4.7vw, 5.25rem);
  --heading-xl: clamp(2.1rem, 3.5vw, 4rem);
  --heading-lg: clamp(1.75rem, 2.5vw, 3rem);
  --body-lg: clamp(1.05rem, 1.2vw, 1.25rem);
  --body-md: clamp(.98rem, 1vw, 1.08rem);
  /* escala de espaço (base 4px) */
  --space-1: 4px;  --space-2: 8px;  --space-3: 12px; --space-4: 16px;
  --space-5: 20px; --space-6: 24px; --space-8: 32px; --space-10: 40px;
  --space-12: 48px; --space-16: 64px; --space-20: 80px; --space-24: 96px;
  /* layout */
  --container-wide: clamp(1240px, 92vw, 1320px);
  --header-h: 72px;
  /* fallback métrico entra na pilha do display (só visível pré-swap) */
  --font-display: 'Marcellus', 'Marcellus Fallback', 'Times New Roman', serif;
}

/* fontes self-host (subset latin; substitui o CDN do Google) */
@font-face { font-family: 'Marcellus'; font-style: normal; font-weight: 400; font-display: swap;
  src: url('/assets/fonts/marcellus-v14-latin-regular.woff2') format('woff2'); }
@font-face { font-family: 'Libre Baskerville'; font-style: normal; font-weight: 400; font-display: swap;
  src: url('/assets/fonts/libre-baskerville-v24-latin-regular.woff2') format('woff2'); }
@font-face { font-family: 'Libre Baskerville'; font-style: italic; font-weight: 400; font-display: swap;
  src: url('/assets/fonts/libre-baskerville-v24-latin-italic.woff2') format('woff2'); }
@font-face { font-family: 'Libre Baskerville'; font-style: normal; font-weight: 700; font-display: swap;
  src: url('/assets/fonts/libre-baskerville-v24-latin-700.woff2') format('woff2'); }
@font-face { font-family: 'Manrope'; font-style: normal; font-weight: 400; font-display: swap;
  src: url('/assets/fonts/manrope-v20-latin-regular.woff2') format('woff2'); }
@font-face { font-family: 'Manrope'; font-style: normal; font-weight: 600; font-display: swap;
  src: url('/assets/fonts/manrope-v20-latin-600.woff2') format('woff2'); }
@font-face { font-family: 'Manrope'; font-style: normal; font-weight: 700; font-display: swap;
  src: url('/assets/fonts/manrope-v20-latin-700.woff2') format('woff2'); }
@font-face { font-family: 'Manrope'; font-style: normal; font-weight: 800; font-display: swap;
  src: url('/assets/fonts/manrope-v20-latin-800.woff2') format('woff2'); }
/* fallback métrico do display (reduz CLS durante o swap) */
@font-face { font-family: 'Marcellus Fallback'; src: local('Times New Roman');
  size-adjust: 105%; ascent-override: 92%; descent-override: 24%; line-gap-override: 0%; }

/* foco visível global (WCAG 2.2 AA) */
:focus-visible { outline: 2px solid var(--gold-500); outline-offset: 3px; border-radius: 2px; }
.section--navy :focus-visible, .section--deep :focus-visible, .site-header :focus-visible,
.hero-cine :focus-visible, .site-footer :focus-visible, .footer-v2 :focus-visible {
  outline-color: var(--gold-300);
}

/* skip link */
.skip-link {
  position: absolute; left: 16px; top: -64px; z-index: 200;
  padding: 12px 20px; background: var(--navy-900); color: var(--ivory-100);
  font-weight: 700; font-size: 15px; border-radius: 2px; transition: top .2s;
}
.skip-link:focus { top: 14px; }

/* grid utilitário 12/8/4 */
.grid-12 { display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); gap: var(--space-6) var(--space-8); }
@media (max-width: 1024px) { .grid-12 { grid-template-columns: repeat(8, minmax(0, 1fr)); } }
@media (max-width: 640px)  { .grid-12 { grid-template-columns: repeat(4, minmax(0, 1fr)); gap: var(--space-5); } }

/* alvo de toque 44px nos dots (visual inalterado: borda transparente) */
.hero-slider__dots { gap: 0; }
.hero-slider__dots button {
  box-sizing: content-box;
  border: 12px solid transparent;
  border-left-width: 7px; border-right-width: 7px;
  background-clip: padding-box;
}

/* ============================================================
   V39 — HERO-CINE (slide 2 "A Nova Era") + shell da home
   ============================================================ */
.container-wide {
  width: 100%;
  max-width: var(--container-wide);
  margin-inline: auto;
  padding-inline: var(--gutter);
}

/* ---------- hero-cine: camadas ---------- */
.hero-cine {
  position: relative;
  overflow: hidden;
  color: var(--ivory-100);
  min-height: max(700px, min(900px, calc(100svh - var(--header-h))));
  display: flex;
  align-items: stretch;
  padding-top: var(--header-h);
}
.hero-cine__bg {
  position: absolute; inset: 0; z-index: 0;
  background:
    radial-gradient(52% 64% at 74% 70%, rgba(198,156,109,.16) 0%, rgba(198,156,109,0) 70%),
    radial-gradient(40% 52% at 10% 6%, rgba(43,90,138,.3) 0%, rgba(43,90,138,0) 65%),
    linear-gradient(118deg, rgba(198,156,109,0) 44%, rgba(198,156,109,.06) 50%, rgba(198,156,109,0) 56%),
    linear-gradient(152deg, var(--navy-850) 0%, var(--navy-900) 48%, var(--navy-950) 100%);
}
.hero-cine__bg::after { /* grain sutil (mesma técnica do hero--paper) */
  content: ''; position: absolute; inset: 0; opacity: .5;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='140' height='140'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='2'/%3E%3C/filter%3E%3Crect width='140' height='140' filter='url(%23n)' opacity='.05'/%3E%3C/svg%3E");
}
/* gravura do símbolo ATRÁS dos avatares (decisão do dono) */
.hero-cine__etch {
  position: absolute; z-index: 0;
  right: 2%; bottom: -4%;
  width: min(46vw, 720px); aspect-ratio: 1;
  background: url('/assets/img/simbolo-credito360-bege.svg') center / contain no-repeat;
  opacity: .08;
  pointer-events: none;
}
.hero-cine__grid {
  position: relative; z-index: 1;
  display: grid;
  grid-template-columns: minmax(0, 6fr) minmax(0, 6fr);
  gap: var(--space-8);
  align-items: center;
  flex: 1;
}
.hero-cine__copy { padding-block: var(--space-16) var(--space-20); max-width: 640px; }
.hero-cine .display-tag {
  font-family: var(--font-display);
  font-size: clamp(20px, 2.2vw, 34px);
  letter-spacing: .14em; text-transform: uppercase;
  color: var(--gold-300);
  margin-bottom: var(--space-4);
  text-shadow: none;
}
.hero-cine h2.as-h1 {
  font-family: var(--font-sans); font-weight: 500;
  font-size: clamp(26px, 2.6vw, 42px);
  line-height: 1.22; color: var(--ivory-100);
}
.hero-cine h2.as-h1 .em-serif { font-family: var(--font-serif); font-style: italic; font-size: 1.06em; color: var(--gold-300); }
.hero-cine .lead { color: rgba(245,243,239,.78); max-width: 480px; margin-top: var(--space-4); font-size: var(--body-lg); }
.hero-cine .hero__ctas { margin-top: var(--space-8); display: flex; gap: var(--space-3); flex-wrap: wrap; }

/* elenco: ancorado na base, dimensionado por ALTURA */
.hero-cine__cast {
  position: relative;
  align-self: stretch;
  display: flex;
  align-items: flex-end;
  justify-content: center;
  min-width: 0;
}
.hero-cine__halo {
  position: absolute; left: 50%; bottom: 0; z-index: 0;
  width: 130%; height: 88%;
  transform: translateX(-50%);
  background: radial-gradient(50% 62% at 50% 76%, rgba(198,156,109,.26) 0%, rgba(198,156,109,0) 70%);
  pointer-events: none;
}
.hero-cine__cast picture { position: relative; z-index: 1; display: flex; align-items: flex-end; justify-content: center; width: 100%; height: 100%; }
.hero-cine__cast img {
  display: block;
  /* dimensionamento por LARGURA: a coluna manda, a altura segue a proporção —
     nunca corta os lados nem depende de resolução de % de altura */
  width: 100%;
  height: auto;
  filter: drop-shadow(0 22px 36px rgba(2,8,16,.55));
  -webkit-mask-image: linear-gradient(180deg, #000 92%, rgba(0,0,0,.6) 98%, transparent 100%);
  mask-image: linear-gradient(180deg, #000 92%, rgba(0,0,0,.6) 98%, transparent 100%);
}

/* entrada por camada (disparo pela classe is-active do slide — CSS puro) */
@media (prefers-reduced-motion: no-preference) {
  .hero-slide.is-active .hero-cine__copy > * { animation: heroCineSobe .7s var(--ease-out) both; }
  .hero-slide.is-active .hero-cine__copy > *:nth-child(2) { animation-delay: .08s; }
  .hero-slide.is-active .hero-cine__copy > *:nth-child(3) { animation-delay: .16s; }
  .hero-slide.is-active .hero-cine__copy > *:nth-child(4) { animation-delay: .24s; }
  .hero-slide.is-active .hero-cine__cast picture { animation: heroCineCast .9s var(--ease-out) both .1s; }
  @keyframes heroCineSobe { from { opacity: 0; transform: translateY(18px); } to { opacity: 1; transform: none; } }
  @keyframes heroCineCast { from { opacity: 0; transform: translateY(26px); } to { opacity: 1; transform: none; } }
}

/* ---------- responsivo ---------- */
@media (max-width: 860px) {
  .hero-cine { min-height: 0; padding-top: calc(var(--header-h) - 8px); }
  .hero-cine__grid { grid-template-columns: 1fr; gap: var(--space-4); }
  .hero-cine__copy { padding-block: var(--space-8) 0; max-width: none; }
  .hero-cine .hero__ctas .btn { flex: 1 1 100%; text-align: center; }
  .hero-cine__cast { margin-top: var(--space-2); }
  .hero-cine__cast img { height: auto; width: min(92%, 480px); max-height: 56svh; }
  .hero-cine__etch { right: auto; left: 50%; transform: translateX(-50%); top: auto; bottom: -2%; width: min(120vw, 560px); opacity: .06; }
}
@media (min-width: 480px) and (max-width: 860px) {
  .hero-cine .hero__ctas .btn { flex: 0 1 auto; }
}

/* ---------- footer-v2 (5 grupos) ---------- */
.footer-v2 .site-footer__grid { display: grid; grid-template-columns: 2fr 1fr 1fr 1fr 1fr 1fr; gap: var(--space-8); }
@media (max-width: 1024px) { .footer-v2 .site-footer__grid { grid-template-columns: repeat(3, 1fr); } }
@media (max-width: 640px)  { .footer-v2 .site-footer__grid { grid-template-columns: repeat(2, 1fr); } }


/* ---------- supergráficos de gravura (etching) ---------- */
.etch-lateral {
  position: absolute;
  z-index: 0;
  pointer-events: none;
  background: url('/assets/img/simbolo-credito360-bege.svg') center / contain no-repeat;
}
#o-que-e, .final-cta { position: relative; }
#o-que-e .container, .final-cta .container { position: relative; z-index: 1; }
.etch-lateral--oquee { right: -14%; top: -8%; width: min(52vw, 760px); aspect-ratio: 1; opacity: .05; }
.etch-lateral--cta { left: -10%; bottom: -18%; width: min(46vw, 640px); aspect-ratio: 1; opacity: .07; }
@media (max-width: 860px) {
  .etch-lateral--oquee { right: -30%; width: 90vw; opacity: .04; }
  .etch-lateral--cta { left: -34%; width: 84vw; opacity: .05; }
}

/* mensagens de erro textuais dos formulários */
.form-msg {
  margin: 6px 0 0;
  font-size: 13.5px;
  font-weight: 600;
  color: var(--error);
}
.section--navy .form-msg, .section--deep .form-msg, .modal .form-msg { color: #E4A69E; }


/* V39.1 — correções de acessibilidade (Lighthouse) */
.site-header__nav a.btn--gold { color: var(--navy-deep); }
.site-header__nav a.btn--gold:hover { color: var(--navy-deep); }
.footer-v2 h3 { font-family: var(--font-sans);
  font-size: 12.5px;
  font-weight: 800;
  letter-spacing: .16em;
  text-transform: uppercase;
  color: var(--gold);
  margin-bottom: 18px; }


/* V39.2 — blindagem do elenco: nenhum nível pode estourar a coluna,
   em nenhum engine (Safari inclusive). Cinto e suspensório. */
.hero-cine__grid > * { min-width: 0; }
.hero-cine__cast,
.hero-cine__cast picture,
.hero-cine__cast img { max-width: 100%; box-sizing: border-box; }
.hero-cine__cast img { width: 100%; height: auto; }


/* V39.3 — os braços das pontas terminam NA BORDA do arquivo original
   (corte de fábrica da foto). Fade lateral dissolve o corte reto no
   fundo navy — mesma linguagem do fade da base. */
.hero-cine__cast picture {
  -webkit-mask-image: linear-gradient(90deg, transparent 0%, #000 7%, #000 93%, transparent 100%);
  mask-image: linear-gradient(90deg, transparent 0%, #000 7%, #000 93%, transparent 100%);
}


/* V39.4 — mobile: a altura do slider segue o slide ATIVO.
   (No empilhamento em grid do crossfade, o contêiner herda a altura
   do slide mais alto — no mobile isso criava faixa vazia sob o slide 1.) */
@media (max-width: 860px) {
  .hero-slider { display: block; }
  .hero-slide {
    display: none;
    opacity: 1;
    visibility: visible;
    pointer-events: auto;
    transition: none;
  }
  .hero-slide.is-active { display: block; }
  /* zona dos controles: o painel de vídeo do slide 1 não fica sob as setas/dot */
  .hero--triade .hero__inner { padding-bottom: 88px; }
}

/* ============================================================
   V40 — Tabela comparativa de planos (Start × Life × Assessor)
   Desktop: tabela plena · Mobile: scroll horizontal com 1ª coluna
   fixa e dica de arrasto (brief §11)
   ============================================================ */
.tabela-planos {
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
  border: 1px solid var(--paper-line);
  border-radius: 2px;
  background: #FFFFFF;
  scrollbar-width: thin;
}
.tabela-planos:focus-visible { outline: 2px solid var(--gold-500); outline-offset: 3px; }
.tabela-planos table {
  width: 100%;
  min-width: 780px;
  border-collapse: collapse;
  font-size: 14.5px;
  line-height: 1.45;
}
.tabela-planos th, .tabela-planos td {
  padding: 14px 18px;
  text-align: left;
  vertical-align: top;
  border-bottom: 1px solid var(--paper-line);
}
.tabela-planos thead th {
  font-family: var(--font-sans);
  font-size: 13px;
  font-weight: 800;
  letter-spacing: .1em;
  text-transform: uppercase;
  color: var(--navy-900);
  background: var(--ivory-100);
  border-bottom: 2px solid rgba(198,156,109,.45);
}
.tabela-planos tbody th[scope="row"] {
  font-weight: 700;
  color: var(--navy-900);
  background: var(--ivory-50);
  min-width: 150px;
}
.tabela-planos td { color: var(--ink-soft); }
.tabela-planos td b { color: var(--navy-900); font-size: 15.5px; }
/* coluna do plano da página atual: destaque dourado */
.tabela-planos .is-atual {
  background: rgba(198,156,109,.10);
  border-inline: 1px solid rgba(198,156,109,.35);
}
.tabela-planos thead .is-atual {
  background: var(--gold-500);
  color: var(--navy-950);
  border-inline: 1px solid var(--gold-600);
}
.tabela-planos__cta td { border-bottom: 0; padding-block: 18px; }
.tabela-planos__cta .btn { padding: 11px 18px; font-size: 13.5px; white-space: nowrap; }
.tabela-planos__hint {
  display: none;
  margin-top: 10px;
  text-align: center;
  font-size: 13px;
  color: var(--ink-soft);
}
@media (max-width: 860px) {
  .tabela-planos__hint { display: block; }
  .tabela-planos tbody th[scope="row"],
  .tabela-planos thead th:first-child {
    position: sticky;
    left: 0;
    z-index: 2;
    box-shadow: 2px 0 0 var(--paper-line);
  }
}


/* ============================================================
   V41 — Fixes do QA responsivo (workflow de 17 agentes, 11 confirmados)
   ============================================================ */
/* home ≥1546px: eyebrow do hero não cresce além do que a coluna comporta */
@media (min-width: 1546px) {
  .hero--triade .display-tag { font-size: 28px; letter-spacing: .28em; white-space: nowrap; }
}
/* faixa .stats com 3 itens: 3 colunas em tablet (evita 2+1 órfão) */
@media (min-width: 641px) and (max-width: 900px) {
  .stats:has(> .stat:nth-child(3):last-child) { grid-template-columns: repeat(3, 1fr); }
}
/* spec-chips: 2×2 equilibrado em tablet (evita 3+1 órfão) */
@media (min-width: 641px) and (max-width: 900px) {
  .spec-chips { grid-template-columns: repeat(2, 1fr); }
}
/* blog: grid de assuntos vira 1 coluna em telas muito estreitas (cortava em 360) */
@media (max-width: 400px) {
  .assuntos { grid-template-columns: 1fr; }
}
/* blog: indicador de rolagem na barra de categorias (item cortado parecia bug) */
@media (max-width: 860px) {
  .jornal-cats-inner { position: relative; }
  .jornal-cats-inner::after {
    content: '';
    position: absolute; right: 0; top: 0; bottom: 0; width: 34px;
    background: linear-gradient(90deg, rgba(14,39,63,0), var(--navy) 82%);
    pointer-events: none;
  }
  .jornal-cats { padding-right: 26px; }
}
/* acordeões dentro de .faq: um indicador só (o "+"); a seta duplicada sai */
.faq summary .seta { display: none; }
/* card-grid de 4 cards: 2×2 entre 901-1101px (evita 3+1 órfão) */
@media (min-width: 901px) and (max-width: 1101px) {
  .card-grid:has(> .card:nth-child(4):last-child) { grid-template-columns: repeat(2, 1fr); }
}
/* bottom-bar: rótulos longos não quebram em telas estreitas */
@media (max-width: 400px) {
  .bottom-bar a { white-space: nowrap; font-size: 10.5px; }
}


/* ============================================================
   V42 — TELA INICIAL G4-CLEAN ABSOLUTO (paleta/tipos medidos em
   g4business.com: navy #001F35 · branco #F5F4F3 · dourado #B9915B ·
   Manrope 200 no display · botão 4px)
   ============================================================ */
:root {
  --g4-navy: #001F35;
  --g4-navy-deep: #001320;
  --g4-branco: #F5F4F3;
  --g4-gold: #B9915B;
  --g4-gold-claro: #C79E63;
}
@font-face { font-family: 'Manrope'; font-style: normal; font-weight: 200; font-display: swap;
  src: url('/assets/fonts/manrope-v20-latin-200.woff2') format('woff2'); }

/* header sólido navy G4 (site inteiro — coerência com a tela inicial) */
.site-header, .site-header.is-scrolled {
  background: var(--g4-navy);
  -webkit-backdrop-filter: none;
  backdrop-filter: none;
  border-bottom: 1px solid rgba(245,244,243,.08);
}

/* ---------- hero G4: flat, tipográfico, foto emoldurada ---------- */
.hero-g4 {
  position: relative;
  overflow: hidden;
  background: linear-gradient(180deg, var(--g4-navy) 0%, var(--g4-navy-deep) 100%);
  color: var(--g4-branco);
  padding-top: var(--header-h);
  /* mesma fórmula do slide 2: alturas idênticas = controles sempre dentro */
  min-height: max(700px, min(900px, calc(100svh - var(--header-h))));
  display: flex;
}
.hero-g4__grid {
  display: grid;
  grid-template-columns: minmax(0, 46%) minmax(0, 1fr);
  gap: var(--space-10);
  align-items: center;
  flex: 1;
}
.hero-g4__copy { padding-block: var(--space-16); max-width: 620px; }
.hero-g4__kicker {
  font-family: var(--font-sans);
  font-weight: 300;
  font-size: clamp(17px, 1.8vw, 26px);
  letter-spacing: .08em;
  text-transform: uppercase;
  color: var(--g4-branco);
  margin-bottom: var(--space-4);
}
.hero-g4__titulo {
  font-family: var(--font-sans);
  font-weight: 200;
  font-size: clamp(32px, 3.6vw, 52px);
  line-height: 1.18;
  color: var(--g4-branco);
  margin: 0;
}
.hero-g4__titulo em {
  font-family: var(--font-serif);
  font-style: italic;
  font-weight: 400;
  color: var(--g4-gold);
}
.hero-g4__lead {
  font-size: clamp(15.5px, 1.2vw, 18px);
  line-height: 1.6;
  color: rgba(245,244,243,.92);
  max-width: 470px;
  margin-top: var(--space-5);
}
.hero-g4__ctas { margin-top: var(--space-8); display: flex; gap: var(--space-4); flex-wrap: wrap; }
.btn-g4 {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  background: var(--g4-gold-claro);
  color: var(--g4-navy);
  font-family: var(--font-sans);
  font-weight: 800;
  font-size: 16px;
  line-height: 1.5;
  padding: 15px 26px;
  border-radius: 4px;
  transition: background .25s, transform .25s var(--ease-out);
}
.btn-g4:hover { background: var(--g4-gold); transform: translateY(-1px); }
.btn-g4__seta { font-weight: 700; }
.btn-g4--ghost {
  background: transparent;
  border: 1.5px solid rgba(245,244,243,.8);
  color: var(--g4-branco);
}
.btn-g4--ghost:hover { background: rgba(245,244,243,.08); transform: translateY(-1px); }

/* foto na moldura de canto redondo com arco dourado (assinatura G4) */
.hero-g4__media {
  position: relative;
  align-self: stretch;
  display: flex;
  align-items: center;
  justify-content: flex-end;
  min-width: 0;
}
.hero-g4__media img {
  display: block;
  width: 100%;
  max-width: 100%;
  height: min(78%, 620px);
  object-fit: cover;
  border-radius: 300px 0 0 300px;
  margin-right: calc(-1 * var(--gutter));
}
.hero-g4__media::before {
  content: '';
  position: absolute;
  left: -18px; top: 50%;
  transform: translateY(-50%);
  width: calc(100% + 18px);
  height: calc(min(78%, 620px) + 36px);
  border: 1px solid rgba(185,145,91,.55);
  border-right: 0;
  border-radius: 320px 0 0 320px;
  pointer-events: none;
}
.hero-g4__foto-mob { display: none; }

/* entrada por slide (mesmo gatilho is-entering do slider) */
@media (prefers-reduced-motion: no-preference) {
  .hero-slide.is-entering .hero-g4__copy > * { animation: heroCineSobe .6s var(--ease-out) both; }
  .hero-slide.is-entering .hero-g4__copy > *:nth-child(2) { animation-delay: .07s; }
  .hero-slide.is-entering .hero-g4__copy > *:nth-child(3) { animation-delay: .14s; }
  .hero-slide.is-entering .hero-g4__copy > *:nth-child(4) { animation-delay: .21s; }
}

/* ---------- slide 2 alinhado ao flat G4 (sai o cinematográfico) ---------- */
.hero-cine__bg {
  background: linear-gradient(180deg, var(--g4-navy) 0%, var(--g4-navy-deep) 100%);
}
.hero-cine__bg::after, .hero-cine__etch, .hero-cine__halo { display: none; }
.hero-cine .display-tag { color: var(--g4-branco); font-family: var(--font-sans); font-weight: 300; letter-spacing: .08em; }
.hero-cine h2.as-h1 { font-weight: 200; color: var(--g4-branco); }
.hero-cine h2.as-h1 .em-serif { color: var(--g4-gold); }

/* ---------- controles do slider minimalistas (chevron G4) ---------- */
.hero-slider__arrow, .hero-slider__arrow:hover {
  background: transparent;
  color: var(--g4-branco);
  box-shadow: none;
}
.hero-slider__arrow:hover { transform: translateY(-50%) scale(1.15); }
@media (max-width: 1240px) {
  .hero-slider__arrow:hover { transform: scale(1.15); }
}
.hero-slider__arrow svg { width: 26px; height: 26px; stroke-width: 2; }

/* ---------- mobile: foto vira fundo escurecido (padrão G4) ---------- */
@media (max-width: 860px) {
  .hero-g4 { min-height: 0; }
  .hero-g4__grid { grid-template-columns: 1fr; }
  .hero-g4__copy { padding-block: var(--space-10) var(--space-16); max-width: none; position: relative; z-index: 1; }
  .hero-g4__media { display: none; }
  .hero-g4__foto-mob {
    display: block;
    position: absolute;
    inset: 0;
    background: url('/assets/img/bloco-eventos.webp') center 30% / cover no-repeat;
    opacity: .38;
  }
  .hero-g4__foto-mob::after {
    content: '';
    position: absolute;
    inset: 0;
    background: linear-gradient(180deg, rgba(0,31,53,.55) 0%, rgba(0,19,32,.82) 100%);
  }
  .hero-g4__ctas .btn-g4 { flex: 1 1 100%; justify-content: center; }
}
@media (min-width: 480px) and (max-width: 860px) {
  .hero-g4__ctas .btn-g4 { flex: 0 1 auto; }
}


/* ============================================================
   V43 — PÁGINA INTEIRA NO SISTEMA G4 (home, copys intactas)
   Medidas reais: h2 Manrope 200 50/60 · sub 12-13px · corpo 14/21 ·
   superfícies #001F35 / #F5F4F3 / #FFF · cards 8-14px · chips pill ·
   marca d'água serif gigante · footer claro
   ============================================================ */

/* ---------- tipografia G4 em toda a home ---------- */
.pg-home .display, .pg-home h2.display {
  font-family: var(--font-sans);
  font-weight: 200;
  font-size: clamp(30px, 3.5vw, 50px);
  line-height: 1.2;
  letter-spacing: 0;
}
.pg-home .display .em-serif, .pg-home h2.display em {
  font-family: var(--font-serif);
  font-style: italic;
  font-weight: 400;
  color: var(--g4-gold);
  font-size: 1em;
}
.pg-home .eyebrow, .pg-home .eyebrow--center {
  font-weight: 300;
  letter-spacing: .1em;
  color: inherit;
  opacity: .85;
}
.pg-home .section-head .lead, .pg-home .section-head--center .lead {
  font-size: 14px;
  line-height: 1.6;
  font-weight: 400;
}
.pg-home .section { --section-y: clamp(76px, 8.5vw, 120px); }

/* superfícies exatas */
.pg-home .section--navy, .pg-home .section--deep { background: var(--g4-navy); }
.pg-home .section--light, .pg-home .section--mist, .pg-home .section--paper { background: #F5F4F3; }

/* botões dourados no padrão G4 (4px, navy 800) */
.pg-home .btn--gold {
  border-radius: 4px;
  background: var(--g4-gold-claro);
  color: var(--g4-navy);
  font-weight: 800;
}
.pg-home .btn--gold:hover { background: var(--g4-gold); }
.pg-home .btn--ghost, .pg-home .btn--ghost-dark { border-radius: 4px; }

/* marca d'água serif gigante (assinatura das seções navy da G4) */
.pg-home .section--navy { position: relative; overflow: hidden; }
.pg-home .section--navy .container { position: relative; z-index: 1; }
.pg-home .sec-mentores-g4::after, .pg-home #metodo::after, .pg-home #servicos::after {
  content: attr(data-marca);
  position: absolute;
  left: 0; bottom: -.18em;
  font-family: var(--font-serif);
  font-style: italic;
  font-size: clamp(120px, 16vw, 230px);
  line-height: 1;
  color: rgba(245,244,243,.04);
  white-space: nowrap;
  pointer-events: none;
}

/* ---------- faixa de números → cards contornados (G4 "em números") ---------- */
.pg-home .stats { border-top: 0; gap: 18px; }
.pg-home .stat {
  border: 1px solid rgba(245,244,243,.22);
  border-radius: 8px;
  padding: 26px 24px;
  background: transparent;
}
.pg-home .stat:first-child { padding-left: 24px; }
.pg-home .stat__num { font-family: var(--font-sans); font-weight: 200; font-size: clamp(30px, 3vw, 44px); color: var(--g4-branco); }
.pg-home .stat__label { color: rgba(245,244,243,.75); font-weight: 400; font-size: 13.5px; }

/* ---------- cards das "três forças" → cards brancos G4 (programas) ---------- */
.pg-home .triple__card {
  background: #FFFFFF;
  border-radius: 12px;
  border: 1px solid rgba(0,31,53,.08);
  overflow: hidden;
}
.pg-home .triple__media { border-radius: 0; }
.pg-home .triple__body h3 { font-family: var(--font-sans); font-weight: 700; font-size: 17px; color: var(--g4-navy); }
.pg-home .triple__body p { font-size: 14px; line-height: 1.55; color: rgba(0,31,53,.72); }

/* ---------- líderes → cards de mentor G4 (foto + nome/sobrenome dourado) ---------- */
.sec-mentores-g4 .leaders { gap: 22px; }
.sec-mentores-g4 .leader {
  position: relative;
  border-radius: 12px;
  overflow: hidden;
  border: 1px solid rgba(185,145,91,.25);
  background: var(--g4-navy-deep);
}
.sec-mentores-g4 .leader img { display: block; width: 100%; height: auto; }
.sec-mentores-g4 .leader::after {
  content: '';
  position: absolute; inset: 0;
  background: linear-gradient(180deg, rgba(0,19,32,0) 52%, rgba(0,19,32,.88) 100%);
  pointer-events: none;
}
.sec-mentores-g4 .leader__meta {
  position: absolute;
  left: 20px; right: 20px; bottom: 16px;
  z-index: 1;
  display: flex;
  flex-direction: column-reverse;
  gap: 2px;
  text-align: left;
}
.sec-mentores-g4 .leader__meta strong {
  font-family: var(--font-sans);
  font-weight: 500;
  font-size: 22px;
  color: var(--g4-branco);
  line-height: 1.2;
}
.sec-mentores-g4 .leader__meta strong em {
  display: block;
  font-family: var(--font-serif);
  font-style: italic;
  font-weight: 400;
  color: var(--g4-gold);
}
.sec-mentores-g4 .leader__meta span {
  font-size: 12.5px;
  letter-spacing: .04em;
  color: rgba(245,244,243,.8);
  border-top: 1px solid rgba(185,145,91,.45);
  padding-top: 8px;
  margin-top: 8px;
  order: -1;
}
.sec-mentores-g4 .leader--founder { border-color: rgba(185,145,91,.6); transform: none; }

/* ---------- planos e serviços: contornos finos e raios G4 ---------- */
.pg-home .plan, .pg-home .plan--v2 { border-radius: 12px; }
.pg-home .card, .pg-home .card--navy, .pg-home .card--light { border-radius: 12px; }
.pg-home .rail__item { border-radius: 12px; }

/* ---------- CTA final estilo bloco-missão G4 (layout, copy nossa) ---------- */
.pg-home .final-cta { background: var(--g4-navy); }
.pg-home .final-cta .display { font-weight: 200; }

/* ---------- FOOTER CLARO G4 (site inteiro — coerência) ---------- */
.footer-v2 {
  background: #F5F4F3;
  color: var(--g4-navy);
}
.footer-v2 .site-footer__brand p { color: rgba(0,31,53,.75); }
.footer-v2 h3, .footer-v2 h4 { color: var(--g4-gold-claro) !important; }
.footer-v2 ul a { color: var(--g4-navy); }
.footer-v2 ul a:hover { color: var(--g4-gold); }
.footer-v2 .footer-soon { color: rgba(0,31,53,.55); }
.footer-v2 .footer-soon em { color: rgba(0,31,53,.45); }
.footer-v2 .site-footer__brand img { filter: none; }
.footer-v2 .site-footer__legal {
  background: var(--g4-navy);
  color: rgba(245,244,243,.8);
  margin: 48px calc(-1 * var(--gutter)) 0;
  padding: 18px var(--gutter);
}

/* hero: vídeo 16:9 SEM corte dentro da moldura arredondada */
.hero-g4__media video {
  display: block;
  width: 100%;
  max-width: 100%;
  height: auto;
  aspect-ratio: 16 / 9;
  object-fit: contain;
  border-radius: 210px 0 0 210px;
  margin-right: calc(-1 * var(--gutter));
  background: var(--g4-navy-deep);
}
/* o arco dourado acompanha a proporção do vídeo */
.hero-g4__media:has(video)::before {
  height: auto;
  aspect-ratio: 1100 / 660;
  width: calc(100% + 18px);
  border-radius: 230px 0 0 230px;
}
@media (max-width: 860px) {
  .hero-g4__media { display: none; }
  /* foto-fundo mobile agora é o poster do vídeo do topo */
  .hero-g4__foto-mob { background-image: url('/assets/video/jornada-poster.webp?v=d46ce4cc'); }
}


/* ============================================================
   V44 — vídeo do topo SEM caixa (funde no navy) e responsivo
   em todas as larguras (aparece também no mobile)
   ============================================================ */
/* hero flat #001F35 = fundo do vídeo → fusão sem emenda */
.hero-g4 { background: var(--g4-navy); }
.hero-cine__bg { background: var(--g4-navy); }

/* o vídeo flutua: sem moldura, sem raio, sem arco, sem fundo */
.hero-g4__media video {
  border-radius: 0;
  background: transparent;
  margin-right: 0;
  object-fit: contain;
  width: 100%;
  height: auto;
  aspect-ratio: 16 / 9;
  /* fade vertical: dissolve a borda do codec no navy da página */
  -webkit-mask-image: linear-gradient(180deg, transparent 0, #000 26px, #000 calc(100% - 26px), transparent 100%);
  mask-image: linear-gradient(180deg, transparent 0, #000 26px, #000 calc(100% - 26px), transparent 100%);
}
/* fade horizontal no wrapper (as duas máscaras se multiplicam) */
.hero-g4__media:has(video) {
  -webkit-mask-image: linear-gradient(90deg, transparent 0, #000 26px, #000 calc(100% - 26px), transparent 100%);
  mask-image: linear-gradient(90deg, transparent 0, #000 26px, #000 calc(100% - 26px), transparent 100%);
}
.hero-g4__media::before, .hero-g4__media:has(video)::before { display: none; }

/* mobile/tablet: o vídeo APARECE, empilhado, largura total */
@media (max-width: 860px) {
  .hero-g4__media {
    display: flex;
    justify-content: center;
    margin-top: var(--space-4);
  }
  .hero-g4__media video { width: 100%; max-width: 640px; }
  .hero-g4__foto-mob { display: none; }
  .hero-g4__copy { padding-bottom: 0; }
  .hero-g4 { padding-bottom: 72px; } /* zona dos controles */
}


/* ============================================================
   V45 — Banner 1 volta ao fundo GRAVURA (pergaminho); banner 2
   permanece navy. Vídeo funde no pergaminho (mesma receita do
   fundo baked do próprio vídeo + fade de 4 lados já ativo).
   ============================================================ */
.hero-g4 {
  background:
    radial-gradient(70% 80% at 72% 46%, rgba(255,253,247,.85) 0%, rgba(255,253,247,0) 62%),
    radial-gradient(120% 100% at 10% 0%, rgba(252,247,238,.9) 0%, rgba(252,247,238,0) 55%),
    linear-gradient(160deg, #F7F1E4 0%, #F3ECDC 52%, #EDE3CE 100%);
  color: var(--ink);
}
.hero-g4__kicker { color: var(--gold-deep); }
.hero-g4__titulo { color: var(--navy-900); }
.hero-g4__titulo em { color: var(--gold-deep); }
.hero-g4__lead { color: rgba(14,39,63,.8); }
.hero-g4__ctas .btn-g4--ghost {
  border-color: rgba(14,39,63,.55);
  color: var(--navy-900);
}
.hero-g4__ctas .btn-g4--ghost:hover { background: rgba(14,39,63,.06); }

/* setas/dots: navy quando o banner 1 (pergaminho) está ativo */
.hero-slider:has(.hero-slide:first-child.is-active) .hero-slider__arrow { color: var(--navy-900); }
.hero-slider:has(.hero-slide:first-child.is-active) .hero-slider__dots button { background: rgba(14,39,63,.25); background-clip: padding-box; }
.hero-slider:has(.hero-slide:first-child.is-active) .hero-slider__dots button.is-active { background: var(--gold-deep); background-clip: padding-box; }

/* mobile: sem foto-fundo no pergaminho (o vídeo já aparece embaixo) */
@media (max-width: 860px) {
  .hero-g4__foto-mob { display: none; }
}


/* ============================================================
   V46 — Fixes do QA mobile final (24 agentes)
   ============================================================ */
/* footer: logo com largura definida (colunas alinham mesmo antes do load) */
.footer-v2 .site-footer__brand img { width: 150px; height: auto; }
/* badge "em breve" quebra como unidade */
.footer-v2 .footer-soon em { white-space: nowrap; display: inline-block; }
/* faixa bege órfã após o copyright: o fundo da página vira navy
   (a folga do bottom-bar fixa some na cor da faixa legal) */
body.pg-home { background: var(--g4-navy); }