/* ==========================================================================
   Aviva B.P.O. — Design System
   Lab4Ge · 2026
   Paleta e tipografia derivadas do material oficial da marca (Instagram).
   ========================================================================== */

/* --------------------------------------------------------------------------
   1. Tokens
   -------------------------------------------------------------------------- */
:root {
  /* Cor — extraída das peças institucionais do cliente */
  --ink:        #0B0B0C;
  --ink-2:      #121316;
  --ink-3:      #1B1D21;
  --navy:       #0C1A2B;
  --navy-2:     #112438;

  --gold:       #C9A227;
  --gold-lt:    #E8C77A;
  --gold-dk:    #8B6B2E;
  --gold-grad:  linear-gradient(160deg, #E8C77A 0%, #C9A227 42%, #8B6B2E 100%);

  --paper:      #F7F5F1;
  --paper-2:    #EFEBE3;
  --white:      #FFFFFF;

  --text:       #16181C;
  --text-soft:  #55595F;
  --text-mute:  #6A6F76;   /* 4,65:1 sobre --paper — AA para texto normal */
  --on-dark:    #EDEAE4;
  --on-dark-soft: #9AA0A8;

  --line:       rgba(11,11,12,.12);
  --line-field: #8C8C8C;   /* 3:1 — limite de campo de formulário */
  --line-dark:  rgba(232,199,122,.18);

  /* Tipografia */
  --f-display: "Cinzel", "Times New Roman", serif;
  --f-sans:    "Manrope", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;

  --fs-eyebrow: clamp(.68rem, .62rem + .2vw, .78rem);
  --fs-body:    clamp(1rem, .96rem + .18vw, 1.075rem);
  --fs-lead:    clamp(1.09rem, 1rem + .45vw, 1.32rem);
  --fs-h4:      clamp(1.12rem, 1.04rem + .35vw, 1.3rem);
  --fs-h3:      clamp(1.35rem, 1.18rem + .75vw, 1.85rem);
  --fs-h2:      clamp(1.8rem, 1.45rem + 1.65vw, 2.85rem);
  --fs-h1:      clamp(2.1rem, 1.55rem + 2.35vw, 3.6rem);
  --fs-mega:    clamp(3rem, 1.4rem + 7vw, 8.5rem);

  /* Espaço e forma */
  --shell:      1240px;
  --shell-nar:  920px;
  --gut:        clamp(1.25rem, .8rem + 2.2vw, 3rem);
  --sec-y:      clamp(4.5rem, 3rem + 7vw, 9rem);
  --r-sm:       4px;
  --r-md:       8px;
  --r-lg:       14px;

  --ease:       cubic-bezier(.22,.61,.36,1);
  --dur:        .5s;
}

/* --------------------------------------------------------------------------
   2. Reset
   -------------------------------------------------------------------------- */
*, *::before, *::after { box-sizing: border-box; }

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

body.aviva {
  margin: 0;
  font-family: var(--f-sans);
  font-size: var(--fs-body);
  line-height: 1.68;
  color: var(--text);
  background: var(--paper);
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  overflow-x: hidden;
}

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

h1, h2, h3, h4, h5 {
  margin: 0;
  font-weight: 800;
  line-height: 1.08;
  letter-spacing: -.022em;
  /* Distribui as linhas em vez de deixar uma palavra órfã na última. */
  text-wrap: balance;
}
p { margin: 0; }
a { color: inherit; text-decoration: none; }
ul, ol { margin: 0; padding: 0; list-style: none; }
button { font: inherit; color: inherit; background: none; border: 0; cursor: pointer; }

:focus-visible {
  outline: 2px solid var(--gold);
  outline-offset: 3px;
  border-radius: 2px;
}

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

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

/* --------------------------------------------------------------------------
   3. Layout
   -------------------------------------------------------------------------- */
.shell {
  width: 100%;
  max-width: var(--shell);
  margin-inline: auto;
  padding-inline: var(--gut);
}
.shell--narrow { max-width: var(--shell-nar); }

.sec { padding-block: var(--sec-y); position: relative; }
.sec--dark  { background: var(--ink);   color: var(--on-dark); }
.sec--navy  { background: var(--navy);  color: var(--on-dark); }
.sec--paper { background: var(--paper); }
.sec--white { background: var(--white); }

.sec--dark h1, .sec--dark h2, .sec--dark h3, .sec--dark h4,
.sec--navy h1, .sec--navy h2, .sec--navy h3, .sec--navy h4 { color: var(--white); }

.skip-link {
  position: absolute;
  left: -9999px;
  top: 0;
  z-index: 999;
  background: var(--gold);
  color: var(--ink);
  padding: .75rem 1.25rem;
  font-weight: 700;
}
.skip-link:focus { left: 0; }

/* --------------------------------------------------------------------------
   4. Tipografia utilitária
   -------------------------------------------------------------------------- */
.eyebrow {
  display: inline-flex;
  align-items: center;
  flex-wrap: wrap;
  text-wrap: balance;
  gap: .7rem;
  font-family: var(--f-display);
  font-size: var(--fs-eyebrow);
  font-weight: 600;
  letter-spacing: .28em;
  text-transform: uppercase;
  color: var(--gold-dk);
  margin-bottom: 1.35rem;
}
.sec--dark .eyebrow, .sec--navy .eyebrow,
.hero .eyebrow, .cta .eyebrow, .phero .eyebrow { color: var(--gold-lt); }

.eyebrow::before {
  content: "";
  width: 28px;
  height: 1px;
  background: currentColor;
  opacity: .7;
  flex: none;
}

.h-mega { font-size: var(--fs-mega); }
.h1 { font-size: var(--fs-h1); }
.h2 { font-size: var(--fs-h2); }
.h3 { font-size: var(--fs-h3); }
.h4 { font-size: var(--fs-h4); font-weight: 700; letter-spacing: -.012em; }

.lead {
  font-size: var(--fs-lead);
  line-height: 1.6;
  color: var(--text-soft);
  font-weight: 400;
  text-wrap: pretty;
}
.sec--dark .lead, .sec--navy .lead,
.hero .lead, .cta .lead, .phero .lead { color: var(--on-dark-soft); }

.gold      { color: var(--gold); }
.gold-text {
  background: var(--gold-grad);
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
}

.measure    { max-width: 62ch; }
.measure-sm { max-width: 48ch; }

.rule {
  height: 1px;
  border: 0;
  margin: 0;
  background: var(--line);
}
.sec--dark .rule, .sec--navy .rule { background: var(--line-dark); }

.rule-gold {
  height: 2px;
  width: 56px;
  border: 0;
  margin: 0 0 1.6rem;
  background: var(--gold-grad);
}

/* --------------------------------------------------------------------------
   5. Wordmark
   -------------------------------------------------------------------------- */
.wordmark {
  display: inline-flex;
  flex-direction: column;
  align-items: center;
  line-height: 1;
  text-decoration: none;
}
.wordmark__svg { display: block; height: auto; line-height: 1; }
.wordmark__tag {
  font-family: var(--f-display);
  font-size: .5rem;
  letter-spacing: .2em;
  text-transform: uppercase;
  color: var(--on-dark-soft);
  margin-top: .5rem;
  white-space: nowrap;
}

/* --------------------------------------------------------------------------
   6. Botões
   -------------------------------------------------------------------------- */
.btn {
  --btn-bg: var(--gold);
  --btn-fg: var(--ink);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: .6rem;
  padding: 1.02rem 1.9rem;
  font-family: var(--f-sans);
  font-size: .935rem;
  font-weight: 700;
  letter-spacing: .01em;
  line-height: 1;
  color: var(--btn-fg);
  background: var(--btn-bg);
  border: 1px solid transparent;
  border-radius: var(--r-sm);
  cursor: pointer;
  position: relative;
  overflow: hidden;
  transition: transform .3s var(--ease), box-shadow .3s var(--ease),
              background-color .3s var(--ease), color .3s var(--ease),
              border-color .3s var(--ease);
}
.btn > * { position: relative; z-index: 1; }

.btn:hover {
  transform: translateY(-2px);
  box-shadow: 0 12px 30px -12px rgba(201,162,39,.55);
}
.btn:active { transform: translateY(0); }

.btn--gold { background: var(--gold-grad); color: var(--ink); }

.btn--ghost {
  background: transparent;
  color: var(--ink);
  border-color: var(--line);
}
.btn--ghost:hover {
  border-color: var(--gold);
  color: var(--gold-dk);
  box-shadow: none;
}

.sec--dark .btn--ghost, .sec--navy .btn--ghost,
.hero .btn--ghost, .cta .btn--ghost, .phero .btn--ghost, .drawer .btn--ghost {
  color: var(--white);
  border-color: rgba(237,234,228,.28);
}
.sec--dark .btn--ghost:hover, .sec--navy .btn--ghost:hover,
.hero .btn--ghost:hover, .cta .btn--ghost:hover, .phero .btn--ghost:hover,
.drawer .btn--ghost:hover {
  border-color: var(--gold);
  color: var(--gold-lt);
  background: rgba(201,162,39,.06);
}

.btn--sm { padding: .72rem 1.25rem; font-size: .85rem; }
.btn--block { width: 100%; }

.btn__ico { flex: none; }

/* Link com seta */
.arrow-link {
  display: inline-flex;
  align-items: center;
  gap: .55rem;
  font-weight: 700;
  font-size: .93rem;
  color: var(--gold-dk);
  transition: gap .3s var(--ease), color .3s var(--ease);
}
.sec--dark .arrow-link, .sec--navy .arrow-link,
.hero .arrow-link, .cta .arrow-link, .phero .arrow-link { color: var(--gold-lt); }
.arrow-link:hover { gap: .95rem; }
.arrow-link svg { flex: none; transition: transform .3s var(--ease); }

/* --------------------------------------------------------------------------
   7. Topbar + Header
   -------------------------------------------------------------------------- */
.topbar {
  background: var(--ink);
  color: var(--on-dark-soft);
  font-size: .78rem;
  letter-spacing: .015em;
  border-bottom: 1px solid rgba(232,199,122,.1);
  position: relative;
  z-index: 60;
}
.topbar__in {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1.5rem;
  min-height: 40px;
  padding-block: .45rem;
}
.topbar__loc { display: inline-flex; align-items: center; gap: .5rem; }
.topbar__loc svg { flex: none; opacity: .65; }
.topbar__links { display: flex; align-items: center; gap: 1.6rem; }
.topbar a { transition: color .25s var(--ease); }
.topbar a:hover { color: var(--gold-lt); }
.topbar__portal {
  display: inline-flex;
  align-items: center;
  gap: .45rem;
  color: var(--gold-lt);
  font-weight: 700;
}

/* O header é sticky dentro do fluxo (não sobrepõe o hero), então precisa
   de fundo próprio. Fica preto sólido, dando continuidade ao topbar, e
   ganha desfoque e fio dourado ao rolar. */
.site-head {
  position: sticky;
  top: 0;
  z-index: 70;
  background: var(--ink);
  border-bottom: 1px solid transparent;
  transition: background-color .35s var(--ease), border-color .35s var(--ease),
              box-shadow .35s var(--ease);
}
.site-head.is-stuck {
  background: rgba(11,11,12,.95);
  backdrop-filter: blur(16px) saturate(140%);
  -webkit-backdrop-filter: blur(16px) saturate(140%);
  border-bottom-color: rgba(232,199,122,.2);
  box-shadow: 0 14px 34px -24px rgba(0,0,0,.9);
}

.site-head__in {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 2rem;
  min-height: 76px;
}

.nav { display: flex; align-items: center; gap: 2rem; }

.nav__list {
  display: flex;
  align-items: center;
  gap: 2rem;
}
.nav__list a {
  position: relative;
  font-size: .885rem;
  font-weight: 600;
  letter-spacing: .01em;
  color: var(--on-dark);
  padding-block: .4rem;
  transition: color .25s var(--ease);
  white-space: nowrap;
}
.nav__list a::after {
  content: "";
  position: absolute;
  left: 0; bottom: 0;
  width: 100%;
  height: 1px;
  background: var(--gold);
  transform: scaleX(0);
  transform-origin: right;
  transition: transform .35s var(--ease);
}
.nav__list a:hover { color: var(--gold-lt); }
.nav__list a:hover::after { transform: scaleX(1); transform-origin: left; }
.nav__list .current-menu-item > a,
.nav__list a[aria-current="page"] { color: var(--gold-lt); }
.nav__list .current-menu-item > a::after,
.nav__list a[aria-current="page"]::after { transform: scaleX(1); }

/* Hamburger */
.burger {
  display: none;
  width: 44px;
  height: 44px;
  align-items: center;
  justify-content: center;
  flex-direction: column;
  gap: 5px;
  margin-right: -10px;
}
.burger span {
  display: block;
  width: 24px;
  height: 1.5px;
  background: var(--on-dark);
  transition: transform .35s var(--ease), opacity .25s var(--ease);
}
.burger.is-open span:nth-child(1) { transform: translateY(6.5px) rotate(45deg); }
.burger.is-open span:nth-child(2) { opacity: 0; }
.burger.is-open span:nth-child(3) { transform: translateY(-6.5px) rotate(-45deg); }

/* Drawer mobile */
.drawer {
  position: fixed;
  inset: 0;
  z-index: 65;
  background: var(--ink);
  padding: 7rem var(--gut) 3rem;
  display: flex;
  flex-direction: column;
  gap: 2rem;
  transform: translateX(100%);
  visibility: hidden;
  transition: transform .45s var(--ease), visibility .45s;
  overflow-y: auto;
}
.drawer.is-open { transform: translateX(0); visibility: visible; }
.drawer__list { display: flex; flex-direction: column; }
.drawer__list a {
  display: block;
  padding: 1.05rem 0;
  font-size: 1.3rem;
  font-weight: 700;
  color: var(--white);
  border-bottom: 1px solid rgba(232,199,122,.12);
}
.drawer__list a:hover { color: var(--gold-lt); }
.drawer__foot { display: flex; flex-direction: column; gap: .9rem; margin-top: auto; }
.drawer__meta { font-size: .85rem; color: var(--on-dark-soft); }

@media (max-width: 1000px) {
  .nav__list, .nav .btn { display: none; }
  .burger { display: flex; }
}
@media (max-width: 760px) {
  .topbar__loc { display: none; }
  .topbar__in { justify-content: center; }
}

/* --------------------------------------------------------------------------
   8. Hero
   -------------------------------------------------------------------------- */
.hero {
  position: relative;
  background: var(--ink);
  color: var(--on-dark);
  overflow: hidden;
  isolation: isolate;
}
.hero__bg {
  position: absolute;
  inset: 0;
  z-index: -2;
  background-size: cover;
  background-position: center 28%;
  opacity: 0;
  transform: scale(1.06);
  transition: opacity 1.4s var(--ease), transform 8s var(--ease);
  filter: grayscale(1) contrast(1.06);
}
.hero__bg.is-ready { opacity: .2; transform: scale(1); }
.hero::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: -1;
  background:
    linear-gradient(105deg, var(--ink) 6%, rgba(11,11,12,.9) 42%, rgba(11,11,12,.55) 78%),
    radial-gradient(120% 80% at 12% 100%, rgba(201,162,39,.16), transparent 62%);
}

.hero__in {
  display: grid;
  grid-template-columns: minmax(0, 7fr) minmax(0, 4.4fr);
  gap: clamp(2.5rem, 1rem + 5vw, 5.5rem);
  align-items: center;
  padding-block: clamp(3.5rem, 2.4rem + 5.2vw, 6.5rem);
}

.hero h1 {
  font-size: var(--fs-h1);
  color: var(--white);
  letter-spacing: -.032em;
  margin-bottom: 1.6rem;
}
.hero h1 em {
  font-style: normal;
  background: var(--gold-grad);
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
}
.hero__lead {
  font-size: var(--fs-lead);
  color: var(--on-dark-soft);
  max-width: 54ch;
  margin-bottom: 2.4rem;
}
.hero__cta { display: flex; flex-wrap: wrap; gap: .9rem; margin-bottom: 2.6rem; }

.hero__trust {
  display: flex;
  flex-wrap: wrap;
  gap: .65rem 1.85rem;
  padding-top: 1.9rem;
  border-top: 1px solid rgba(232,199,122,.16);
  font-size: .845rem;
  color: var(--on-dark-soft);
}
.hero__trust li { display: inline-flex; align-items: center; gap: .5rem; }
.hero__trust svg { flex: none; color: var(--gold); }

/* Card de prova no hero */
.proof {
  background: rgba(255,255,255,.045);
  border: 1px solid rgba(232,199,122,.2);
  border-radius: var(--r-lg);
  padding: clamp(1.6rem, 1.2rem + 1.2vw, 2.3rem);
  backdrop-filter: blur(14px);
  -webkit-backdrop-filter: blur(14px);
  box-shadow: 0 30px 70px -40px rgba(0,0,0,.9);
}
.proof__top {
  display: flex;
  align-items: center;
  gap: .65rem;
  padding-bottom: 1.15rem;
  margin-bottom: 1.4rem;
  border-bottom: 1px solid rgba(232,199,122,.16);
  font-family: var(--f-display);
  font-size: .7rem;
  font-weight: 600;
  letter-spacing: .2em;
  text-transform: uppercase;
  color: var(--gold-lt);
}
.proof__dot {
  width: 7px; height: 7px;
  border-radius: 50%;
  background: var(--gold);
  box-shadow: 0 0 0 4px rgba(201,162,39,.16);
  flex: none;
}
.proof__list { display: flex; flex-direction: column; gap: 1.05rem; }
.proof__row { display: flex; gap: .85rem; align-items: flex-start; }
.proof__row svg { flex: none; margin-top: 3px; color: var(--gold); }
.proof__row strong { display: block; color: var(--white); font-size: .95rem; font-weight: 700; }
.proof__row span { font-size: .855rem; color: var(--on-dark-soft); line-height: 1.55; }
.proof__foot {
  margin-top: 1.6rem;
  padding-top: 1.3rem;
  border-top: 1px solid rgba(232,199,122,.16);
}

@media (max-width: 980px) {
  .hero__in { grid-template-columns: 1fr; gap: 3rem; }
  .proof { max-width: 520px; }
}

/* --------------------------------------------------------------------------
   9. Marquee
   -------------------------------------------------------------------------- */
.marquee {
  background: var(--gold-grad);
  color: var(--ink);
  padding-block: .95rem;
  overflow: hidden;
  position: relative;
}
.marquee__track {
  display: flex;
  width: max-content;
  animation: marquee 44s linear infinite;
}
.marquee:hover .marquee__track { animation-play-state: paused; }
.marquee__group {
  display: flex;
  align-items: center;
  gap: 2.6rem;
  padding-right: 2.6rem;
}
.marquee__group span {
  font-family: var(--f-display);
  font-size: .78rem;
  font-weight: 600;
  letter-spacing: .22em;
  text-transform: uppercase;
  white-space: nowrap;
}
.marquee__sep { opacity: .45; font-size: .6rem; }
@keyframes marquee {
  from { transform: translateX(0); }
  to   { transform: translateX(-50%); }
}

/* --------------------------------------------------------------------------
   10. Cabeçalho de seção
   -------------------------------------------------------------------------- */
.sec-head { margin-bottom: clamp(2.6rem, 1.8rem + 2.5vw, 4.2rem); }
.sec-head--split {
  display: grid;
  grid-template-columns: minmax(0, 1.15fr) minmax(0, 1fr);
  gap: clamp(1.8rem, 1rem + 3vw, 4rem);
  align-items: end;
}
.sec-head--center { text-align: center; max-width: 760px; margin-inline: auto; }
.sec-head--center .eyebrow { justify-content: center; }
.sec-head--center .eyebrow::after {
  content: "";
  width: 28px; height: 1px;
  background: currentColor;
  opacity: .7;
}
@media (max-width: 860px) {
  .sec-head--split { grid-template-columns: 1fr; align-items: start; }
}

/* --------------------------------------------------------------------------
   11. Dores — lista editorial numerada
   -------------------------------------------------------------------------- */
.pains {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(290px, 1fr));
  gap: 0;
  border-top: 1px solid var(--line);
}
.pain {
  display: flex;
  gap: 1.15rem;
  padding: 2.05rem 1.6rem 2.05rem 0;
  border-bottom: 1px solid var(--line);
  position: relative;
}
.pain__n {
  font-family: var(--f-display);
  font-size: .78rem;
  font-weight: 600;
  letter-spacing: .12em;
  color: var(--gold-dk);
  padding-top: .32rem;
  flex: none;
  min-width: 26px;
}
.pain h3 {
  font-size: var(--fs-h4);
  font-weight: 700;
  margin-bottom: .5rem;
  letter-spacing: -.012em;
}
.pain p { font-size: .93rem; color: var(--text-soft); line-height: 1.62; }

.pains-out {
  margin-top: clamp(2.6rem, 2rem + 2vw, 3.8rem);
  padding: clamp(1.8rem, 1.4rem + 1.6vw, 2.8rem);
  background: var(--ink);
  color: var(--on-dark);
  border-radius: var(--r-lg);
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 1.8rem;
  align-items: center;
  position: relative;
  overflow: hidden;
}
.pains-out::before {
  content: "";
  position: absolute;
  inset: 0;
  background: radial-gradient(90% 130% at 100% 0%, rgba(201,162,39,.2), transparent 58%);
  pointer-events: none;
}
.pains-out > * { position: relative; }
.pains-out h3 { color: var(--white); font-size: var(--fs-h3); margin-bottom: .6rem; }
.pains-out p { color: var(--on-dark-soft); max-width: 58ch; font-size: .98rem; }
@media (max-width: 780px) {
  .pains-out { grid-template-columns: 1fr; }
}

/* --------------------------------------------------------------------------
   12. Serviços — linhas editoriais expansíveis
   -------------------------------------------------------------------------- */
.svc-list { border-top: 1px solid var(--line); }
.sec--dark .svc-list, .sec--navy .svc-list { border-top-color: var(--line-dark); }

.svc {
  border-bottom: 1px solid var(--line);
  position: relative;
}
.sec--dark .svc, .sec--navy .svc { border-bottom-color: var(--line-dark); }

.svc__head {
  display: grid;
  grid-template-columns: 62px minmax(0, 1fr) auto;
  gap: clamp(1rem, .6rem + 1.6vw, 2.4rem);
  align-items: center;
  width: 100%;
  padding: clamp(1.5rem, 1.2rem + 1vw, 2.15rem) 0;
  text-align: left;
  transition: padding-left .4s var(--ease);
}
.svc__head:hover { padding-left: .8rem; }

.svc__n {
  font-family: var(--f-display);
  font-size: .8rem;
  font-weight: 600;
  letter-spacing: .14em;
  color: var(--gold-dk);
}
.sec--dark .svc__n, .sec--navy .svc__n { color: var(--gold-lt); }

.svc__ttl {
  font-size: clamp(1.28rem, 1.05rem + 1.1vw, 2rem);
  font-weight: 800;
  letter-spacing: -.026em;
  line-height: 1.14;
  transition: color .3s var(--ease);
}
.svc__head:hover .svc__ttl { color: var(--gold-dk); }
.sec--dark .svc__head:hover .svc__ttl,
.sec--navy .svc__head:hover .svc__ttl { color: var(--gold-lt); }

.svc__toggle {
  width: 42px; height: 42px;
  border: 1px solid var(--line);
  border-radius: 50%;
  display: grid;
  place-items: center;
  flex: none;
  transition: transform .4s var(--ease), border-color .3s var(--ease), background-color .3s var(--ease);
}
.sec--dark .svc__toggle, .sec--navy .svc__toggle { border-color: var(--line-dark); }
.svc__head:hover .svc__toggle { border-color: var(--gold); background: rgba(201,162,39,.08); }
.svc.is-open .svc__toggle { transform: rotate(45deg); border-color: var(--gold); }
.svc__toggle svg { color: var(--gold-dk); }
.sec--dark .svc__toggle svg, .sec--navy .svc__toggle svg { color: var(--gold-lt); }

.svc__panel {
  display: grid;
  grid-template-rows: 0fr;
  transition: grid-template-rows .45s var(--ease);
}
.svc.is-open .svc__panel { grid-template-rows: 1fr; }
/* visibility:hidden tira o painel fechado do leitor de tela e do Ctrl+F —
   grid-template-rows:0fr sozinho só zera a altura. */
.svc__panel > div {
  overflow: hidden;
  visibility: hidden;
  transition: visibility .45s var(--ease);
}
.svc.is-open .svc__panel > div { visibility: visible; }

.svc__body {
  display: grid;
  grid-template-columns: 62px minmax(0, 1fr);
  gap: clamp(1rem, .6rem + 1.6vw, 2.4rem);
  padding-bottom: clamp(1.8rem, 1.4rem + 1.2vw, 2.6rem);
}
.svc__body-in {
  display: grid;
  grid-template-columns: minmax(0, 1.1fr) minmax(0, 1fr);
  gap: clamp(1.4rem, 1rem + 2vw, 3rem);
}
.svc__desc { font-size: 1rem; color: var(--text-soft); line-height: 1.7; }
.sec--dark .svc__desc, .sec--navy .svc__desc { color: var(--on-dark-soft); }

.svc__items { display: flex; flex-direction: column; gap: .68rem; }
.svc__items li {
  display: flex;
  gap: .65rem;
  align-items: flex-start;
  font-size: .925rem;
  line-height: 1.5;
  color: var(--text-soft);
}
.sec--dark .svc__items li, .sec--navy .svc__items li { color: var(--on-dark-soft); }
.svc__items svg { flex: none; margin-top: 4px; color: var(--gold); }

@media (max-width: 700px) {
  .svc__head { grid-template-columns: 34px minmax(0, 1fr) auto; }
  .svc__body { grid-template-columns: 1fr; }
  .svc__body-in { grid-template-columns: 1fr; }
  .svc__toggle { width: 34px; height: 34px; }
}

/* --------------------------------------------------------------------------
   13. Cards de serviço (página Serviços)
   -------------------------------------------------------------------------- */
.cards {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 300px), 1fr));
  gap: 1px;
  background: var(--line);
  border: 1px solid var(--line);
}

/* Variantes de coluna — usadas quando a contagem de itens é conhecida,
   para que a grade nunca termine com células vazias à mostra. */
.cards--3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.cards--4 { grid-template-columns: repeat(4, minmax(0, 1fr)); }

@media (max-width: 1080px) {
  .cards--4 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 900px) {
  .cards--3 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 620px) {
  .cards--3, .cards--4 { grid-template-columns: 1fr; }
}
.sec--dark .cards, .sec--navy .cards { background: var(--line-dark); border-color: var(--line-dark); }

.card {
  background: var(--white);
  padding: clamp(1.7rem, 1.3rem + 1.4vw, 2.5rem);
  display: flex;
  flex-direction: column;
  gap: 1rem;
  transition: background-color .35s var(--ease);
  position: relative;
}
.sec--paper .card { background: var(--paper); }
.sec--dark .card, .sec--navy .card { background: var(--ink); }
.card:hover { background: var(--paper-2); }
.sec--dark .card:hover, .sec--navy .card:hover { background: var(--ink-2); }

.card__ico {
  width: 46px; height: 46px;
  display: grid;
  place-items: center;
  border: 1px solid var(--line);
  border-radius: var(--r-sm);
  color: var(--gold-dk);
  margin-bottom: .35rem;
}
.sec--dark .card__ico, .sec--navy .card__ico { border-color: var(--line-dark); color: var(--gold-lt); }

.card h2, .card h3 { font-size: var(--fs-h4); font-weight: 700; letter-spacing: -.014em; }
.card p { font-size: .93rem; color: var(--text-soft); line-height: 1.65; }
.sec--dark .card p, .sec--navy .card p { color: var(--on-dark-soft); }

.card__list { display: flex; flex-direction: column; gap: .55rem; margin-top: .3rem; }
.card__list li {
  display: flex; gap: .55rem; align-items: flex-start;
  font-size: .875rem; color: var(--text-soft); line-height: 1.5;
}
.sec--dark .card__list li, .sec--navy .card__list li { color: var(--on-dark-soft); }
.card__list svg { flex: none; margin-top: 4px; color: var(--gold); }

/* --------------------------------------------------------------------------
   14. Processo — timeline
   -------------------------------------------------------------------------- */
.steps {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 230px), 1fr));
  gap: clamp(1.6rem, 1rem + 2vw, 2.6rem);
  counter-reset: step;
  position: relative;
}
.step { position: relative; padding-top: 2.9rem; }
.step::before {
  content: "";
  position: absolute;
  top: 13px; left: 0;
  width: 100%;
  height: 1px;
  background: var(--line);
}
.sec--dark .step::before, .sec--navy .step::before { background: var(--line-dark); }
.step::after {
  counter-increment: step;
  content: "0" counter(step);
  position: absolute;
  top: 0; left: 0;
  display: grid;
  place-items: center;
  width: 27px; height: 27px;
  font-family: var(--f-display);
  font-size: .62rem;
  font-weight: 700;
  letter-spacing: .05em;
  color: var(--ink);
  background: var(--gold-grad);
  border-radius: 50%;
}
.step h3 {
  font-size: var(--fs-h4);
  font-weight: 700;
  color: var(--text);
  margin-bottom: .6rem;
  letter-spacing: -.014em;
}
.sec--dark .step h3, .sec--navy .step h3 { color: var(--white); }

.step p { font-size: .915rem; color: var(--text-soft); line-height: 1.62; }
.sec--dark .step p, .sec--navy .step p { color: var(--on-dark-soft); }

.step__tag {
  display: inline-block;
  margin-top: .95rem;
  font-family: var(--f-display);
  font-size: .62rem;
  font-weight: 600;
  letter-spacing: .18em;
  text-transform: uppercase;
  color: var(--gold-dk);
  border: 1px solid var(--line);
  border-radius: 100px;
  padding: .32rem .75rem;
}
.sec--dark .step__tag, .sec--navy .step__tag {
  color: var(--gold-lt);
  border-color: var(--line-dark);
}

/* --------------------------------------------------------------------------
   15. Split (imagem + texto)
   -------------------------------------------------------------------------- */
.split {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
  gap: clamp(2.2rem, 1.2rem + 4vw, 5rem);
  align-items: center;
}
.split--rev .split__media { order: 2; }
@media (max-width: 900px) {
  .split { grid-template-columns: 1fr; }
  .split--rev .split__media { order: 0; }
}

.split__media {
  position: relative;
  border-radius: var(--r-lg);
  overflow: hidden;
  aspect-ratio: 4 / 3.2;
  background: var(--ink-2);
}
.split__media img {
  width: 100%; height: 100%;
  object-fit: cover;
  filter: grayscale(1) contrast(1.05);
  transition: transform 1.1s var(--ease), filter .7s var(--ease);
}
.split__media:hover img { transform: scale(1.045); filter: grayscale(.55) contrast(1.05); }
.split__media::after {
  content: "";
  position: absolute; inset: 0;
  background: linear-gradient(200deg, rgba(201,162,39,.16), rgba(11,11,12,.5));
  pointer-events: none;
}

.split__badge {
  position: absolute;
  left: 1.2rem; bottom: 1.2rem;
  z-index: 2;
  background: rgba(11,11,12,.82);
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
  border: 1px solid rgba(232,199,122,.24);
  border-radius: var(--r-md);
  padding: .9rem 1.15rem;
  max-width: 78%;
}
.split__badge strong {
  display: block;
  font-family: var(--f-display);
  font-size: .66rem;
  font-weight: 600;
  letter-spacing: .2em;
  text-transform: uppercase;
  color: var(--gold-lt);
  margin-bottom: .3rem;
}
.split__badge span { font-size: .85rem; color: var(--on-dark); line-height: 1.45; }

.checklist { display: flex; flex-direction: column; gap: .9rem; margin-top: 1.9rem; }
.checklist li { display: flex; gap: .8rem; align-items: flex-start; font-size: .97rem; line-height: 1.55; }
.checklist svg { flex: none; margin-top: 3px; color: var(--gold); }
.checklist strong { font-weight: 700; }

/* --------------------------------------------------------------------------
   16. Portal do cliente
   -------------------------------------------------------------------------- */
.portal {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, .85fr);
  gap: clamp(2rem, 1.2rem + 3.5vw, 4.5rem);
  align-items: center;
}
@media (max-width: 900px) { .portal { grid-template-columns: 1fr; } }

.portal-ui {
  background: linear-gradient(165deg, var(--navy-2), var(--ink));
  border: 1px solid rgba(232,199,122,.2);
  border-radius: var(--r-lg);
  padding: 1.15rem;
  box-shadow: 0 40px 80px -50px rgba(0,0,0,.95);
}
.portal-ui__bar {
  display: flex; align-items: center; gap: .4rem;
  padding-bottom: .95rem;
  border-bottom: 1px solid rgba(232,199,122,.14);
  margin-bottom: 1.15rem;
}
.portal-ui__bar i {
  width: 8px; height: 8px; border-radius: 50%;
  background: rgba(237,234,228,.22);
  display: block;
}
.portal-ui__bar i:first-child { background: var(--gold); }
.portal-ui__bar span {
  margin-left: auto;
  font-size: .68rem;
  letter-spacing: .06em;
  color: var(--on-dark-soft);
  font-family: var(--f-sans);
}
.portal-ui__grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: .7rem;
}
.portal-ui__cell {
  background: rgba(255,255,255,.04);
  border: 1px solid rgba(232,199,122,.12);
  border-radius: var(--r-md);
  padding: .95rem 1rem;
}
.portal-ui__cell--wide { grid-column: 1 / -1; }
.portal-ui__k {
  font-family: var(--f-display);
  font-size: .58rem;
  font-weight: 600;
  letter-spacing: .18em;
  text-transform: uppercase;
  color: var(--gold-lt);
  display: block;
  margin-bottom: .45rem;
}
.portal-ui__v { font-size: 1.02rem; font-weight: 700; color: var(--white); letter-spacing: -.01em; }
.portal-ui__bars { display: flex; align-items: flex-end; gap: 5px; height: 46px; margin-top: .6rem; }
.portal-ui__bars i {
  flex: 1;
  background: var(--gold-grad);
  border-radius: 2px 2px 0 0;
  opacity: .8;
  display: block;
}

/* --------------------------------------------------------------------------
   17. FAQ
   -------------------------------------------------------------------------- */
.faq { border-top: 1px solid var(--line); }
.faq details {
  border-bottom: 1px solid var(--line);
}
.faq summary {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 1.5rem;
  padding: 1.55rem 0;
  cursor: pointer;
  list-style: none;
  font-size: var(--fs-h4);
  font-weight: 700;
  letter-spacing: -.014em;
  line-height: 1.35;
  transition: color .3s var(--ease);
}
.faq summary::-webkit-details-marker { display: none; }
.faq summary:hover { color: var(--gold-dk); }
.faq summary::after {
  content: "";
  flex: none;
  width: 13px; height: 13px;
  margin-top: 7px;
  background: currentColor;
  color: var(--gold-dk);
  clip-path: polygon(46% 0, 54% 0, 54% 46%, 100% 46%, 100% 54%, 54% 54%, 54% 100%, 46% 100%, 46% 54%, 0 54%, 0 46%, 46% 46%);
  transition: transform .4s var(--ease);
}
.faq details[open] summary::after { transform: rotate(135deg); }
.faq__a {
  padding-bottom: 1.7rem;
  max-width: 74ch;
  font-size: .975rem;
  color: var(--text-soft);
  line-height: 1.72;
}
.faq__a p + p { margin-top: .9rem; }

/* --------------------------------------------------------------------------
   18. Page hero (páginas internas)
   -------------------------------------------------------------------------- */
.phero {
  background: var(--ink);
  color: var(--on-dark);
  position: relative;
  overflow: hidden;
  isolation: isolate;
}
.phero::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: -1;
  background: radial-gradient(100% 120% at 88% 0%, rgba(201,162,39,.17), transparent 58%);
}
.phero__in {
  padding-block: clamp(3.5rem, 2.4rem + 6vw, 7rem);
  display: grid;
  grid-template-columns: minmax(0, 1.25fr) minmax(0, 1fr);
  gap: clamp(1.6rem, 1rem + 3vw, 4rem);
  align-items: end;
}
@media (max-width: 860px) { .phero__in { grid-template-columns: 1fr; align-items: start; } }
.phero h1 { font-size: var(--fs-h2); color: var(--white); letter-spacing: -.03em; }
.phero p { color: var(--on-dark-soft); font-size: var(--fs-lead); max-width: 52ch; }

.crumbs {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: .55rem;
  font-size: .78rem;
  color: var(--on-dark-soft);
  margin-bottom: 1.4rem;
}
.crumbs a:hover { color: var(--gold-lt); }
.crumbs span { opacity: .45; }

/* --------------------------------------------------------------------------
   19. CTA final
   -------------------------------------------------------------------------- */
.cta {
  background: var(--ink);
  color: var(--on-dark);
  position: relative;
  overflow: hidden;
  isolation: isolate;
  text-align: center;
}
.cta::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: -1;
  background:
    radial-gradient(80% 110% at 50% 108%, rgba(201,162,39,.24), transparent 62%),
    linear-gradient(180deg, var(--ink), var(--ink-2));
}
/* Marca d'água: textura de fundo, não elemento de leitura. Menor e mais
   apagada que antes, para não competir com a chamada nem encostar no rodapé. */
.cta__mark {
  position: absolute;
  left: 50%;
  bottom: -.34em;
  transform: translateX(-50%);
  z-index: -1;
  font-family: var(--f-display);
  font-size: clamp(2.4rem, .8rem + 5.6vw, 6.4rem);
  font-weight: 700;
  letter-spacing: .08em;
  line-height: .8;
  color: transparent;
  -webkit-text-stroke: 1px rgba(232,199,122,.09);
  white-space: nowrap;
  pointer-events: none;
  user-select: none;
}
@media (max-width: 620px) { .cta__mark { display: none; } }
.cta__in { position: relative; padding-block: clamp(4.5rem, 3rem + 7vw, 8rem); }
.cta h2 {
  font-size: var(--fs-h2);
  color: var(--white);
  letter-spacing: -.032em;
  max-width: 20ch;
  margin: 0 auto 1.3rem;
}
.cta p {
  color: var(--on-dark-soft);
  font-size: var(--fs-lead);
  max-width: 54ch;
  margin: 0 auto 2.9rem;
  text-wrap: pretty;
}
.cta__btns { display: flex; flex-wrap: wrap; gap: .9rem; justify-content: center; }
/* Precisa de `.cta` no seletor para vencer `.cta p`, que a deixava com o
   tamanho do parágrafo de apoio e sem margem superior. */
.cta .cta__note {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  align-items: center;
  gap: .3rem 1.1rem;
  max-width: none;   /* zera o 54ch herdado de `.cta p`, que a 13px = 380px */
  margin: 2.9rem auto 0;
  font-size: .84rem;
  line-height: 1.6;
  letter-spacing: .01em;
  color: var(--on-dark-soft);
}

/* Cada dado quebra por inteiro ou não quebra — nunca deixa o separador
   órfão no começo da linha seguinte. */
.cta .cta__note span {
  display: inline-flex;
  align-items: center;
  gap: 1.1rem;
  white-space: nowrap;
}
.cta .cta__note span + span::before {
  content: "";
  width: 3px;
  height: 3px;
  border-radius: 50%;
  background: var(--gold);
  opacity: .55;
  flex: none;
}

/* --------------------------------------------------------------------------
   20. Contato / formulário
   -------------------------------------------------------------------------- */
.contact {
  display: grid;
  grid-template-columns: minmax(0, .85fr) minmax(0, 1.15fr);
  gap: clamp(2rem, 1.2rem + 4vw, 4.5rem);
  align-items: start;
}
@media (max-width: 900px) { .contact { grid-template-columns: 1fr; } }

.contact-ch { display: flex; flex-direction: column; }
.contact-ch__item {
  display: flex;
  gap: 1rem;
  padding: 1.35rem 0;
  border-bottom: 1px solid var(--line);
  align-items: flex-start;
}
.contact-ch__item:first-child { border-top: 1px solid var(--line); }
.contact-ch__ico {
  width: 40px; height: 40px;
  flex: none;
  display: grid;
  place-items: center;
  border: 1px solid var(--line);
  border-radius: var(--r-sm);
  color: var(--gold-dk);
}
.contact-ch__k {
  font-family: var(--f-display);
  font-size: .62rem;
  font-weight: 600;
  letter-spacing: .2em;
  text-transform: uppercase;
  color: var(--text-mute);
  display: block;
  margin-bottom: .28rem;
}
.contact-ch__v {
  display: block;
  font-size: 1.02rem;
  font-weight: 700;
  letter-spacing: -.012em;
  line-height: 1.35;
}
.contact-ch__v a:hover { color: var(--gold-dk); }
.contact-ch__sub {
  display: block;
  font-size: .85rem;
  color: var(--text-soft);
  margin-top: .3rem;
  line-height: 1.5;
}

.form {
  background: var(--white);
  border: 1px solid var(--line);
  border-radius: var(--r-lg);
  padding: clamp(1.6rem, 1.2rem + 1.6vw, 2.6rem);
}
.sec--paper .form { background: var(--white); }
.form__grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 1.1rem;
}
.form__row--full { grid-column: 1 / -1; }
@media (max-width: 620px) { .form__grid { grid-template-columns: 1fr; } }

.field { display: flex; flex-direction: column; gap: .45rem; }
.field label {
  font-size: .78rem;
  font-weight: 700;
  letter-spacing: .04em;
  text-transform: uppercase;
  color: var(--text-soft);
}
.field label .req { color: var(--gold-dk); }
.field input,
.field select,
.field textarea {
  font-family: var(--f-sans);
  font-size: .97rem;
  color: var(--text);
  background: var(--paper);
  border: 1px solid var(--line-field);
  border-radius: var(--r-sm);
  padding: .88rem 1rem;
  width: 100%;
  transition: border-color .25s var(--ease), background-color .25s var(--ease),
              box-shadow .25s var(--ease);
}
.field select {
  appearance: none;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath d='M1 1l5 5 5-5' fill='none' stroke='%238B6B2E' stroke-width='1.6' stroke-linecap='round'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: right 1rem center;
  padding-right: 2.4rem;
}
.field textarea { resize: vertical; min-height: 130px; line-height: 1.6; }
.field input:focus,
.field select:focus,
.field textarea:focus {
  outline: none;
  border-color: var(--gold-dk);
  background: var(--white);
  box-shadow: 0 0 0 3px rgba(201,162,39,.45);
}
.field input::placeholder, .field textarea::placeholder { color: var(--text-mute); }

.form__consent {
  display: flex;
  gap: .7rem;
  align-items: flex-start;
  font-size: .82rem;
  color: var(--text-soft);
  line-height: 1.55;
}
.form__consent input { width: 17px; height: 17px; flex: none; margin-top: 2px; accent-color: var(--gold-dk); }
.form__consent a { text-decoration: underline; text-underline-offset: 2px; }

.form__hp { position: absolute; left: -9999px; opacity: 0; height: 0; overflow: hidden; }

.notice {
  padding: 1rem 1.15rem;
  border-radius: var(--r-sm);
  font-size: .92rem;
  line-height: 1.55;
  margin-bottom: 1.4rem;
  border: 1px solid;
}
.notice--ok  { background: rgba(201,162,39,.08); border-color: rgba(201,162,39,.4); color: #6B5116; }
.notice--err { background: rgba(190,60,40,.06); border-color: rgba(190,60,40,.35); color: #8C2F1E; }

/* --------------------------------------------------------------------------
   21. Footer
   -------------------------------------------------------------------------- */
.site-foot {
  background: var(--ink);
  color: var(--on-dark-soft);
  padding-top: clamp(3.5rem, 2.5rem + 4vw, 5.5rem);
  font-size: .9rem;
}
.site-foot__grid {
  display: grid;
  grid-template-columns: minmax(0, 1.5fr) repeat(3, minmax(0, 1fr));
  gap: clamp(2rem, 1.2rem + 3vw, 3.5rem);
  padding-bottom: clamp(2.5rem, 2rem + 2vw, 3.5rem);
}
@media (max-width: 900px) { .site-foot__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 560px) { .site-foot__grid { grid-template-columns: 1fr; } }

.site-foot__about { max-width: 40ch; line-height: 1.68; margin-top: 1.4rem; }
.site-foot h4 {
  font-family: var(--f-display);
  font-size: .68rem;
  font-weight: 600;
  letter-spacing: .22em;
  text-transform: uppercase;
  color: var(--gold-lt);
  margin-bottom: 1.15rem;
}
.site-foot__links { display: flex; flex-direction: column; gap: .72rem; }
.site-foot__links a { transition: color .25s var(--ease), padding-left .25s var(--ease); }
.site-foot__links a:hover { color: var(--gold-lt); padding-left: .28rem; }

.site-foot__social { display: flex; gap: .6rem; margin-top: 1.5rem; }
.site-foot__social a {
  width: 40px; height: 40px;
  display: grid;
  place-items: center;
  border: 1px solid rgba(232,199,122,.2);
  border-radius: var(--r-sm);
  color: var(--on-dark);
  transition: border-color .3s var(--ease), color .3s var(--ease),
              background-color .3s var(--ease), transform .3s var(--ease);
}
.site-foot__social a:hover {
  border-color: var(--gold);
  color: var(--gold-lt);
  background: rgba(201,162,39,.08);
  transform: translateY(-2px);
}

.site-foot__bar {
  border-top: 1px solid rgba(232,199,122,.14);
  padding-block: 1.6rem;
  display: flex;
  flex-wrap: wrap;
  gap: .8rem 1.8rem;
  align-items: center;
  justify-content: space-between;
  font-size: .8rem;
  color: var(--on-dark-soft);
}
.site-foot__bar a:hover { color: var(--gold-lt); }
.site-foot__credit { display: inline-flex; align-items: center; gap: .45rem; }
.site-foot__credit strong { color: var(--on-dark-soft); font-weight: 700; }

/* --------------------------------------------------------------------------
   22. WhatsApp flutuante
   -------------------------------------------------------------------------- */
.wa-float {
  position: fixed;
  right: clamp(1rem, .6rem + 1.2vw, 1.8rem);
  bottom: clamp(1rem, .6rem + 1.2vw, 1.8rem);
  z-index: 80;
  display: inline-flex;
  align-items: center;
  gap: .6rem;
  padding: .85rem 1.15rem;
  background: var(--ink);
  color: var(--white);
  border: 1px solid rgba(232,199,122,.3);
  border-radius: 100px;
  font-size: .87rem;
  font-weight: 700;
  box-shadow: 0 16px 40px -18px rgba(0,0,0,.7);
  transform: translateY(140%);
  transition: transform .55s var(--ease), border-color .3s var(--ease), background-color .3s var(--ease);
}
.wa-float.is-visible { transform: translateY(0); }
.wa-float:hover { border-color: var(--gold); background: var(--ink-2); }
.wa-float svg { flex: none; color: var(--gold-lt); }
@media (max-width: 560px) {
  .wa-float span { display: none; }
  .wa-float { padding: .95rem; }
}

/* --------------------------------------------------------------------------
   23. Animação de entrada
   -------------------------------------------------------------------------- */
/* O conteúdo nasce visível. A animação só é armada quando o JS confirma que
   está rodando (classe .js no <html>) — assim uma falha de script, cache ou
   bloqueador nunca deixa a página em branco. */
.reveal { opacity: 1; transform: none; }

.js .reveal {
  opacity: 0;
  transform: translateY(26px);
  transition: opacity .85s var(--ease), transform .85s var(--ease);
  will-change: opacity, transform;
}
.js .reveal.is-in { opacity: 1; transform: none; }
.reveal[data-d="1"] { transition-delay: .09s; }
.reveal[data-d="2"] { transition-delay: .18s; }
.reveal[data-d="3"] { transition-delay: .27s; }
.reveal[data-d="4"] { transition-delay: .36s; }
.reveal[data-d="5"] { transition-delay: .45s; }

@media (prefers-reduced-motion: reduce) {
  .js .reveal { opacity: 1; transform: none; }
}

/* --------------------------------------------------------------------------
   24. Conteúdo editorial (page.php / posts)
   -------------------------------------------------------------------------- */
.prose { max-width: 72ch; }
.prose > * + * { margin-top: 1.35rem; }
.prose h2 { font-size: var(--fs-h3); margin-top: 2.8rem; }
.prose h3 { font-size: var(--fs-h4); margin-top: 2.1rem; }
.prose ul, .prose ol { padding-left: 1.3rem; }
.prose ul { list-style: disc; }
.prose ol { list-style: decimal; }
.prose li { margin-top: .5rem; }
.prose li::marker { color: var(--gold-dk); }
.prose a { color: var(--gold-dk); text-decoration: underline; text-underline-offset: 3px; }
.prose blockquote {
  border-left: 2px solid var(--gold);
  padding-left: 1.4rem;
  font-size: var(--fs-lead);
  line-height: 1.6;
  color: var(--text-soft);
}
.prose img { border-radius: var(--r-md); }
.prose code {
  background: var(--paper-2);
  padding: .15em .4em;
  border-radius: 3px;
  font-size: .9em;
}

/* Bloco de citação da missão */
.quote {
  max-width: 68ch;
  margin-inline: auto;
  text-align: center;
}
.quote__mark {
  font-family: var(--f-display);
  font-size: 3.4rem;
  line-height: 1;
  color: var(--gold);
  display: block;
  margin-bottom: 1rem;
}
.quote p {
  font-size: clamp(1.15rem, 1rem + .8vw, 1.6rem);
  line-height: 1.55;
  font-weight: 500;
  letter-spacing: -.014em;
  color: var(--white);
}
.quote cite {
  display: block;
  margin-top: 1.6rem;
  font-family: var(--f-display);
  font-style: normal;
  font-size: .68rem;
  font-weight: 600;
  letter-spacing: .24em;
  text-transform: uppercase;
  color: var(--gold-lt);
}

/* Utilitários */
.mt-0 { margin-top: 0; }
.mt-2 { margin-top: 2rem; }
.mt-3 { margin-top: 3rem; }
.tc { text-align: center; }
.sr-only {
  position: absolute; width: 1px; height: 1px;
  padding: 0; margin: -1px; overflow: hidden;
  clip: rect(0,0,0,0); white-space: nowrap; border: 0;
}

/* Barra admin do WP */
body.admin-bar .site-head { top: 32px; }
@media screen and (max-width: 782px) { body.admin-bar .site-head { top: 46px; } }

/* Card isolado (fora da grade .cards) */
.card--solo {
  background: var(--white);
  border: 1px solid var(--line);
  border-radius: var(--r-lg);
  height: 100%;
}
.sec--paper .card--solo { background: var(--white); }
.sec--dark .card--solo, .sec--navy .card--solo {
  background: rgba(255,255,255,.035);
  border-color: var(--line-dark);
}
.card--solo:hover { background: var(--white); }
.sec--paper .card--solo:hover { background: var(--white); }

/* Card-convite que fecha a grade de serviços */
.card--invite {
  background: var(--ink);
  color: var(--on-dark);
  justify-content: center;
}
.card--invite h3 { color: var(--white); }
.card--invite p { color: var(--on-dark-soft); }
.card--invite:hover { background: var(--ink-2); }
.card--invite .card__ico { border-color: var(--line-dark); color: var(--gold-lt); }

/* Em telas estreitas o traço do eyebrow criava uma linha órfã */
@media (max-width: 560px) {
  .eyebrow::before, .sec-head--center .eyebrow::after { display: none; }
  .eyebrow { gap: 0; letter-spacing: .16em; font-size: .66rem; }
}

/* --------------------------------------------------------------------------
   25. Integração com plugins
   -------------------------------------------------------------------------- */

/* Seletor de idioma flutuante do TranslatePress ("Portuguese" no canto
   inferior direito). Ele disputa espaço com o botão de WhatsApp e não faz
   sentido enquanto o site é só em português.
   Isto é a rede de segurança visual — a remoção definitiva é em
   Configurações → TranslatePress → Seletor de idioma → Nenhum. */
.trp-floating-switcher,
#trp-floater-ls {
  display: none !important;
}

/* --------------------------------------------------------------------------
   26. Proteção contra rolagem lateral
   -------------------------------------------------------------------------- */

/* Nada deve criar eixo horizontal. O overflow-x fica também no html porque
   em iOS o clamp no body sozinho não segura elemento posicionado. */
html { overflow-x: hidden; max-width: 100%; }

/* Mídia e blocos que costumam furar o container em telas estreitas. */
img, svg, video, iframe, table, pre { max-width: 100%; }

/* Palavras longas (URLs, e-mails) não empurram o layout. */
body.aviva { overflow-wrap: break-word; }
.svc__items li, .checklist li, .card p, .pain p, .faq__a { overflow-wrap: anywhere; }