/* Cabeçalho, hero e seletor de produtos. */

.hero__copy, .live, .switch__tab, .switch__text { min-width: 0; }
.live__bar, .live__tabs { flex-wrap: wrap; }
.ed__seg { max-width: 100%; flex-wrap: wrap; }
.lv-form, .lv-ready > div { min-width: 0; }

/* ---------- Cabeçalho ---------- */
.site-header {
  position: sticky; top: 0; z-index: 50;
  background: rgba(18, 16, 13, 0.0);
  border-bottom: 1px solid transparent;
  transition: background-color .3s var(--ease), border-color .3s var(--ease);
}
.site-header[data-scrolled] { background: rgba(18, 16, 13, 0.96); border-color: var(--shell-line); }
.site-header__bar { display: flex; align-items: center; justify-content: space-between; gap: 24px; min-height: 76px; }
.brand { display: inline-flex; align-items: center; gap: 12px; min-height: 44px; color: var(--shell-text); text-decoration: none; }
.brand img { width: 44px; height: 44px; object-fit: contain; }
.brand__word { display: grid; line-height: 1.15; }
.brand__word b { font: 600 18px var(--font-ui); letter-spacing: -.01em; }
.brand__word small { font: 500 11px var(--font-ui); letter-spacing: .12em; text-transform: uppercase; color: var(--brass); }
.site-nav { display: flex; gap: 4px; }
.site-nav a { display: inline-flex; align-items: center; min-height: 44px; padding: 0 14px; border-radius: 999px; color: var(--shell-muted); text-decoration: none; font: 500 14px var(--font-ui); transition: color .2s, background-color .2s; }
.site-nav a:hover { color: var(--shell-text); background: rgba(237, 224, 200, 0.06); }
@media (max-width: 760px) {
  .site-nav { display: none; }
  .brand__word small { display: none; }
  .site-header__cta { min-height: 44px; padding: 0 16px; font-size: 14px; }
}

/* ---------- Hero ---------- */
.hero { position: relative; isolation: isolate; padding: clamp(40px, 7vw, 104px) 0 clamp(48px, 6vw, 88px); }
/* Transição do topo escuro para o fundo claro da vitrine (sem corte seco). */
@property --hero-fade { syntax: "<color>"; inherits: false; initial-value: #e2ecf9; }
.hero::after { content: ""; position: absolute; left: 0; right: 0; bottom: -1px; height: clamp(140px, 16vw, 240px); z-index: -1; pointer-events: none; background: linear-gradient(180deg, color-mix(in srgb, var(--hero-fade) 0%, transparent) 0%, color-mix(in srgb, var(--hero-fade) 35%, transparent) 55%, var(--hero-fade) 100%); transition: --hero-fade .7s var(--ease); }
/* Com o Capital selecionado a vitrine é escura: o degradê do topo acompanha a cor, sem faixa clara. */
body:has(.showroom[data-product="capital"]) .hero::after { --hero-fade: #060c0a; }
.hero::before { content: ""; position: absolute; inset: -80px 0 0; z-index: -1; pointer-events: none;
  background: radial-gradient(40% 45% at 76% 42%, rgba(212, 173, 106, 0.16), transparent 70%), radial-gradient(34% 40% at 18% 20%, rgba(39, 88, 184, 0.14), transparent 72%); }
.hero__grid { display: grid; grid-template-columns: minmax(0, 1.05fr) minmax(0, .95fr); align-items: center; gap: clamp(40px, 6vw, 96px); }
.hero h1 {
  margin: 0;
  font: 380 clamp(44px, 5.4vw, 80px)/0.98 var(--font-display);
  font-optical-sizing: auto;
  letter-spacing: -.025em;
  text-wrap: balance;
}
.hero h1 em { display: block; font-style: italic; font-weight: 340; color: var(--brass-2); }
.hero__lead { max-width: 46ch; margin: 30px 0 0; font-size: clamp(16px, 1.3vw, 18px); line-height: 1.7; color: var(--shell-muted); }
.hero__lead strong { color: var(--shell-text); font-weight: 600; }
.hero__actions { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 36px; }
.hero__note { margin: 22px 0 0; font-size: 13px; color: var(--shell-muted); }

/* Janela viva: prévia que alterna entre os produtos (dados fictícios). */
.live { min-width: 0; display: grid; grid-template-columns: minmax(0, 1fr); gap: 14px; }
.live__win {
  border-radius: 16px; overflow: hidden; cursor: pointer;
  background: var(--paper); color: var(--ink); border: 1px solid rgba(255, 255, 255, 0.14);
  box-shadow: 0 2px 6px rgba(0, 0, 0, .2), 0 40px 80px -30px rgba(0, 0, 0, .9);
  transition: transform .3s var(--ease);
}
.live__win:hover { transform: translateY(-3px); }
.live[data-product="capital"] .live__win { background: var(--ledger); color: var(--ledger-text); border-color: var(--ledger-line); box-shadow: 0 2px 6px rgba(0, 0, 0, .3), 0 40px 80px -30px rgba(0, 0, 0, .95); }
.live__chrome { display: flex; align-items: center; gap: 12px; padding: 10px 14px; border-bottom: 1px solid var(--rule); background: var(--paper-2); font: 500 12px var(--font-ui); color: var(--ink-3); }
.live[data-product="capital"] .live__chrome { background: #0a1310; border-color: var(--ledger-line); color: var(--ledger-muted); }
.live__dots { display: flex; gap: 6px; }
.live__dots i { width: 10px; height: 10px; border-radius: 50%; background: currentColor; opacity: .3; }
.live__addr { margin: 0 auto; padding: 3px 14px; border-radius: 999px; background: rgba(127, 127, 127, .1); }
.live__fict { font-size: 10px; letter-spacing: .1em; text-transform: uppercase; }
.live__win { display: grid; grid-template-columns: minmax(0, 1fr); }
/* As cenas ficam empilhadas na mesma célula: a janela tem sempre a altura da maior e nada pula ao alternar Docs/Capital. */
.live__scene { grid-area: 2 / 1; min-width: 0; padding: 18px; min-height: 330px; }
.live__scene[hidden] { display: block !important; visibility: hidden; pointer-events: none; }
.live__cap { margin: 0 0 12px; font: 500 13px/1.4 var(--font-ui); opacity: .75; }
.lv-k { margin: 0 0 8px; font: 600 11px var(--font-ui); letter-spacing: .08em; text-transform: uppercase; opacity: .7; }

/* Docs */
.lv-docs { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 16px; }
.lv-form { display: grid; align-content: start; gap: 4px; }
.lv-label { margin-top: 6px; font: 500 11px var(--font-ui); color: var(--ink-3); }
.lv-in { display: flex; justify-content: space-between; align-items: center; gap: 6px; min-height: 36px; padding: 8px 10px; border-radius: 8px; background: #fff; border: 1px solid var(--rule); font: 500 13px var(--font-ui); color: var(--ink); white-space: nowrap; overflow: hidden; }
.lv-in--on { border-color: var(--seal); box-shadow: 0 0 0 3px rgba(39, 88, 184, .15); }
.lv-in--on span::after { content: ""; display: inline-block; width: 1.5px; height: 1em; margin-left: 1px; vertical-align: -2px; background: var(--seal); animation: lv-caret 1s steps(1) infinite; }
.lv-tag { font: 600 10px var(--font-ui); font-style: normal; padding: 2px 7px; border-radius: 99px; background: var(--paper-2); color: var(--ink-3); }
.lv-sheet { position: relative; display: grid; align-content: start; gap: 8px; padding: 18px 16px 16px; border-radius: 6px; background: #fff; border: 1px solid var(--rule); box-shadow: 0 14px 30px -18px rgba(19, 35, 59, .45); font: 400 11px/1.6 var(--font-display); color: var(--ink-2); }
.lv-sheet b { padding-bottom: 8px; border-bottom: 1px solid var(--rule); text-align: center; font: 600 12px var(--font-display); letter-spacing: .18em; text-transform: uppercase; color: var(--ink); }
.lv-sheet p { margin: 0; }
.lv-sheet mark { padding: 0 2px; border-radius: 2px; background: rgba(39, 88, 184, .13); color: var(--ink); }
.lv-sheet i { display: block; height: 4px; border-radius: 3px; background: var(--paper-2); }
.lv-sheet i.s { width: 58%; }
.lv-sign { justify-self: center; min-width: 70%; margin-top: 18px; padding-top: 5px; border-top: 1px solid var(--ink-3); text-align: center; font-size: 9px; color: var(--ink-3); }
.lv-seal { position: absolute; right: 12px; bottom: 30px; display: grid; place-items: center; width: 44px; height: 44px; border-radius: 50%; background: radial-gradient(circle at 35% 30%, #3566c2, var(--seal) 60%, #173a80); color: #fff; font: 700 10px var(--font-display); letter-spacing: .08em; rotate: -14deg; box-shadow: 0 6px 12px -4px rgba(23, 58, 128, .55); }
.lv-tag[data-s="ok"] { background: #dff3e8; color: #1f6b4f; }
.lv-tag[data-s="bad"] { background: #fbe4e1; color: #a3231a; }
.lv-in[data-s="bad"] { border-color: #d64545; box-shadow: 0 0 0 3px rgba(214, 69, 69, .16); }
.lv-seal { transition: opacity .15s linear, scale .45s cubic-bezier(.16, 1, .3, 1); }
.live__scene:not([data-state="ok"]) .lv-seal { opacity: 0; scale: 1.9; }
.lv-ready[data-s="warn"] .lv-ready__ico { background: #f8ead0; }
.lv-ready[data-s="warn"] .lv-ready__ico svg { stroke: #8a5a12; }
.lv-ready[data-s="warn"] b { color: #8a5a12; }
.lv-ready[data-s="warn"] .lv-pdf { opacity: .45; }
@media (prefers-reduced-motion: reduce) { .lv-seal { transition: none; } }
.lv-ready { grid-column: 1 / -1; display: flex; align-items: center; gap: 12px; padding: 10px 12px; border-radius: 12px; background: #fff; border: 1px solid var(--rule); }
.lv-ready__ico { display: grid; place-items: center; width: 30px; height: 30px; border-radius: 50%; background: #dff3e8; }
.lv-ready__ico svg { width: 16px; height: 16px; fill: none; stroke: #1f7a4d; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }
.lv-ready small { display: block; font-size: 11px; color: var(--ink-3); }
.lv-ready b { font: 600 13px var(--font-ui); color: #1f7a4d; }
.lv-pdf { margin-left: auto; padding: 8px 16px; border-radius: 99px; background: var(--seal); color: #fff; font: 600 12px var(--font-ui); }

/* Capital: contrato sendo fechado e seus prazos */
.lv-cap { display: grid; grid-template-columns: minmax(0, 1.05fr) minmax(0, .95fr); gap: 16px; }
.lv-contract, .lv-dues { min-width: 0; }
.lv-fields { display: grid; grid-template-columns: 1fr 1fr; gap: 8px 10px; }
.lv-f { display: grid; gap: 3px; min-width: 0; }
.lv-f--wide { grid-column: 1 / -1; }
.lv-cap .lv-label { color: var(--ledger-muted); margin: 0; }
.lv-cap .lv-in { min-height: 34px; padding: 7px 10px; background: var(--ledger-2); border: 1px solid var(--ledger-line); color: var(--ledger-text); }
.lv-cap .lv-in.is-typing { border-color: var(--verdigris); box-shadow: 0 0 0 3px rgba(79, 191, 152, .16); }
.lv-cap .lv-in.is-typing::after { content: ""; display: inline-block; width: 1.5px; height: 1em; margin-left: 1px; vertical-align: -2px; background: var(--verdigris); animation: lv-caret 1s steps(1) infinite; }
.lv-summary { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 8px 10px; margin-top: 12px; padding: 12px 14px; border-radius: 12px; background: var(--ledger-2); border: 1px solid var(--ledger-line); transition: opacity .35s var(--ease), translate .35s var(--ease); }
.lv-summary small { display: block; font-size: 10px; letter-spacing: .08em; text-transform: uppercase; color: var(--ledger-muted); }
.lv-summary b { display: block; font: 600 20px var(--font-ui); letter-spacing: -.02em; white-space: nowrap; }
.lv-summary em { font-style: normal; font-size: 11px; color: var(--ledger-muted); }
.lv-closed { display: inline-flex; align-items: center; gap: 6px; padding: 7px 12px; border-radius: 99px; background: rgba(79, 191, 152, .16); color: #7fd9b6; font: 600 12px var(--font-ui); white-space: nowrap; transition: opacity .2s linear, scale .45s cubic-bezier(.16, 1, .3, 1); }
.lv-closed svg { width: 14px; height: 14px; fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }
.live__scene[data-live-scene="capital"]:not([data-state="closed"]) .lv-summary { opacity: .35; }
.live__scene[data-live-scene="capital"]:not([data-state="closed"]) .lv-closed { opacity: 0; scale: 1.6; }
.lv-due { display: grid; gap: 6px; margin: 0; padding: 0; list-style: none; }
.lv-due li { display: grid; grid-template-columns: minmax(0, 1fr) auto; grid-template-rows: auto auto; align-items: center; gap: 2px 10px; padding: 6px 10px; border-radius: 10px; background: var(--ledger-2); border: 1px solid var(--ledger-line); transition: opacity .35s var(--ease), translate .35s var(--ease); }
.lv-due li:not(.is-in) { opacity: 0; translate: 0 8px; }
.lv-due li > span:first-child { grid-column: 1; grid-row: 1 / span 2; min-width: 0; }
.lv-due b { display: block; font: 600 12px var(--font-ui); white-space: nowrap; }
.lv-due small { display: block; font-size: 10px; color: var(--ledger-muted); white-space: nowrap; }
.lv-due__v { grid-column: 2; grid-row: 1; justify-self: end; font: 600 12px var(--font-ui); font-variant-numeric: tabular-nums; text-align: right; }
.lv-due em { grid-column: 2; grid-row: 2; justify-self: end; font: 600 10px var(--font-ui); font-style: normal; padding: 2px 8px; border-radius: 99px; color: #e2c48c; background: rgba(201, 166, 107, .15); white-space: nowrap; }
@media (prefers-reduced-motion: reduce) { .lv-summary, .lv-closed, .lv-due li { transition: none; } }

/* Barra abaixo da janela */
.live__bar { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 10px; }
.live__tabs { display: flex; gap: 6px; }
.live__tab { min-height: 44px; padding: 0 14px; border-radius: 999px; border: 1px solid var(--shell-line-2); background: transparent; color: var(--shell-muted); font: 500 13px var(--font-ui); cursor: pointer; transition: background-color .25s, color .25s, border-color .25s; }
.live__tab:hover { color: var(--shell-text); border-color: var(--shell-muted); }
.live__tab[aria-pressed="true"] { background: var(--shell-text); border-color: var(--shell-text); color: var(--shell); }
.live__open { display: inline-flex; align-items: center; justify-content: flex-end; gap: 8px; min-width: min(11rem, 100%); min-height: 44px; padding: 0 4px; border: 0; background: none; color: var(--brass-2); font: 600 14px var(--font-ui); cursor: pointer; }
.live__open svg { width: 16px; height: 16px; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; transition: transform .25s var(--ease); }
.live__open:hover svg { transform: translateX(3px); }

@media (prefers-reduced-motion: no-preference) {
  .live { animation: rise .9s var(--ease) .15s both; }
  .live__scene[data-run] { animation: lv-in .5s var(--ease) both; }
  @keyframes lv-in { from { opacity: 0; translate: 0 8px; } }
}
@keyframes lv-caret { 50% { opacity: 0; } }

@media (max-width: 960px) {
  .live { max-width: 600px; width: 100%; margin-inline: auto; }
}
@media (max-width: 520px) {
  .lv-docs, .lv-cap { grid-template-columns: 1fr; }
  .lv-due li:nth-child(n+4) { display: none; }
  .lv-sheet { display: none; }
  .live__scene { min-height: 0; padding: 14px; }
}

@media (prefers-reduced-motion: no-preference) {
  /* O título aparece de imediato (é o maior elemento da tela); o resto entra suave. */
  .hero__copy > :not(h1) { animation: rise .9s var(--ease) both; }
  .hero__copy > :nth-child(2) { animation-delay: .06s; } .hero__copy > :nth-child(3) { animation-delay: .12s; }
  @keyframes rise { from { translate: 0 18px; } }
}

@media (max-width: 960px) {
  .hero__grid { grid-template-columns: 1fr; }
}
@media (max-width: 520px) {
  .hero__actions .btn { flex: 1 1 100%; }
  .live__chrome, .lv-ready { flex-wrap: wrap; }
  .lv-pdf { margin-left: 0; }
}

/* ---------- Seletor de produtos (o palco muda de mundo) ---------- */
@property --stage { syntax: "<color>"; inherits: true; initial-value: #12100d; }
@property --stage-2 { syntax: "<color>"; inherits: true; initial-value: #1a1712; }

.showroom {
  --stage: #c4d7f0;
  --stage-2: #e2ecf9;
  position: relative; padding: var(--section) 0;
  background: linear-gradient(180deg, var(--stage-2), var(--stage));
  color: var(--ink);
  transition: --stage .7s var(--ease), --stage-2 .7s var(--ease), color .5s var(--ease);
}
.showroom[data-product="capital"] { --stage: #0a1612; --stage-2: #060c0a; color: var(--ledger-text); }
/* Luz atrás das interfaces: azul para o Docs, verdete para o Capital (só opacidade anima). */
.showroom::before, .showroom::after { content: ""; position: absolute; inset: 0; pointer-events: none; transition: opacity .7s var(--ease); }
.showroom::before { background: radial-gradient(55% 45% at 50% 42%, rgba(39, 88, 184, 0.26), transparent 72%), radial-gradient(35% 30% at 85% 10%, rgba(255, 255, 255, 0.55), transparent 70%); }
.showroom::after { background: radial-gradient(55% 45% at 50% 42%, rgba(79, 191, 152, 0.2), transparent 72%), radial-gradient(30% 25% at 12% 8%, rgba(212, 173, 106, 0.12), transparent 70%); opacity: 0; }
.showroom[data-product="capital"]::before { opacity: 0; }
.showroom[data-product="capital"]::after { opacity: 1; }
.showroom > .wrap { position: relative; z-index: 1; }

.showroom__head { max-width: 760px; margin-bottom: clamp(32px, 4vw, 48px); }
.showroom__head h2 { margin: 0; font: 380 clamp(34px, 4.2vw, 60px)/1.04 var(--font-display); letter-spacing: -.02em; text-wrap: balance; }
.showroom__head h2 em { font-style: italic; color: var(--seal); transition: color .5s var(--ease); }
.showroom[data-product="capital"] .showroom__head h2 em { color: var(--verdigris); }
.showroom__head p { max-width: 56ch; margin: 18px 0 0; font-size: 17px; line-height: 1.7; color: var(--ink-2); transition: color .5s var(--ease); }
.showroom[data-product="capital"] .showroom__head p { color: var(--ledger-muted); }

.switch { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; margin-bottom: 20px; }
.switch__tab {
  display: flex; align-items: center; gap: 16px; min-height: 76px; padding: 14px 20px;
  border-radius: 16px; border: 1px solid var(--rule); background: rgba(255, 255, 255, 0.45);
  text-align: left; transition: background-color .35s var(--ease), border-color .35s var(--ease), color .35s var(--ease), box-shadow .35s var(--ease);
}
.switch__text { display: grid; gap: 2px; }
.switch__text b { font: 600 18px var(--font-ui); letter-spacing: -.01em; }
.switch__text small { font-size: 13px; color: inherit; opacity: .78; }
.switch__swatch { flex: none; width: 34px; height: 34px; border-radius: 10px; }
.switch__tab--docs .switch__swatch { background: var(--paper); box-shadow: inset 0 0 0 1px var(--rule), inset -10px -10px 0 -4px var(--seal); }
.switch__tab--capital .switch__swatch { background: var(--ledger); box-shadow: inset 0 0 0 1px var(--ledger-line), inset -10px -10px 0 -4px var(--verdigris); }
.switch__tab[aria-selected="true"].switch__tab--docs { background: var(--paper); border-color: var(--seal); box-shadow: 0 14px 30px -20px rgba(19, 35, 59, 0.45); }
.switch__tab[aria-selected="false"]:hover { border-color: var(--ink-3); }
.showroom[data-product="capital"] .switch__tab { border-color: var(--ledger-line); background: rgba(255, 255, 255, 0.03); color: var(--ledger-text); }
.showroom[data-product="capital"] .switch__tab[aria-selected="true"] { background: var(--ledger-2); border-color: var(--verdigris); box-shadow: 0 14px 30px -20px rgba(0, 0, 0, 0.8); }
.showroom[data-product="capital"] .switch__tab[aria-selected="false"]:hover { border-color: var(--ledger-muted); }
.showroom[data-product="docs"] .switch__tab:focus-visible { outline-color: var(--seal); }
.showroom[data-product="capital"] :focus-visible { outline-color: var(--verdigris); }

.showroom__foot { margin: 16px 0 0; font-size: 13px; color: var(--ledger-muted); }

.showroom__intro { display: none; }
.showroom__status { display: flex; flex-wrap: wrap; align-items: center; gap: 12px; margin-block: 20px; }
.contact__fields { display: grid; gap: inherit; min-width: 0; margin: 0; padding: 0; border: 0; }
@media (max-width: 820px) {
  .showroom__intro { display: block; margin: 0 0 24px; }
  .showroom__intro[hidden] { display: none; }
  .showroom__intro p { max-width: 65ch; margin: 0; font-size: 16px; line-height: 1.6; }
  .showroom__intro strong { display: block; font-weight: 600; }
  .showroom__intro a { display: inline-flex; align-items: center; gap: 10px; min-height: 44px; margin-top: 6px; color: inherit; font: 600 14px var(--font-ui); text-underline-offset: 4px; }
  .showroom__intro a svg { flex: none; width: 16px; height: 16px; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
}

@media (max-width: 640px) {
  .switch__tab { min-height: 64px; padding: 12px; gap: 10px; }
  .switch__text small { display: none; }
  .switch__swatch { width: 26px; height: 26px; border-radius: 8px; }
}

/* ---------- Seção ativa e menu mobile ---------- */
.site-nav a[aria-current="true"] { color: var(--shell-text); background: rgba(212, 173, 106, 0.12); box-shadow: inset 0 -2px 0 var(--brass); }
.menu-btn { display: none; place-items: center; width: 44px; height: 44px; border-radius: 50%; border: 1px solid var(--shell-line-2); background: transparent; }
.menu-btn__bars { display: grid; gap: 6px; width: 18px; }
.menu-btn__bars i { display: block; height: 1.5px; border-radius: 2px; background: var(--shell-text); transition: transform .3s var(--ease); }
.menu-btn[aria-expanded="true"] .menu-btn__bars i:first-child { transform: translateY(3.75px) rotate(45deg); }
.menu-btn[aria-expanded="true"] .menu-btn__bars i:last-child { transform: translateY(-3.75px) rotate(-45deg); }
.menu-mobile { border-top: 1px solid var(--shell-line); background: rgba(18, 16, 13, 0.98); }
.menu-mobile nav { display: grid; gap: 4px; padding-top: 12px; padding-bottom: 20px; }
.menu-mobile a:not(.btn) { display: flex; align-items: center; min-height: 52px; padding: 0 4px; border-bottom: 1px solid var(--shell-line); color: var(--shell-text); text-decoration: none; font: 500 17px var(--font-ui); }
.menu-mobile .btn { margin-top: 12px; }
@media (prefers-reduced-motion: no-preference) {
  .menu-mobile:not([hidden]) { animation: menu-in .3s var(--ease) both; }
  @keyframes menu-in { from { opacity: 0; translate: 0 -8px; } }
}
@media (max-width: 760px) {
  .menu-btn { display: inline-grid; }
  .site-header__cta { display: none; }
  .site-header[data-menu-open] { background: rgba(18, 16, 13, 0.98); border-color: var(--shell-line); }
}
@media (min-width: 761px) { .menu-mobile { display: none !important; } }

.live[data-motion-paused] *, .live[data-motion-paused] *::after { animation-play-state: paused; }
.live__pause { margin-left: auto; }

/* Entrada ao rolar: sobe 14 px e aparece (só opacidade e transform; sem JS e sem mudar o layout). */
@media (prefers-reduced-motion: no-preference) {
  @supports (animation-timeline: view()) {
    .showroom__head, .showroom__intro, .benefit, .contact__copy, .contact__panel, .footer__top {
      animation: reveal-in linear both; animation-timeline: view(); animation-range: entry 0% entry 40%;
    }
    @keyframes reveal-in { from { opacity: 0; transform: translateY(14px); } to { opacity: 1; transform: none; } }
  }
}