/* Animações sempre ativas, como no site de referência: as regras de movimento reduzido
   ficam desligadas com "and (max-width: 0px)". Para reativar, remova essa cláusula. */
/* Ajustes da BMAI por cima do CSS da referência. Carregado depois do bmai.css em todas as páginas. */
:root {
  --bm-orange: #db5500;
  --bm-orange-dark: #b84700;
  --bm-navy: #0d1b2a;
  --bm-cream: #ede7e1;
  --bm-muted: #a3adb7; /* cinza de apoio com contraste AA sobre o navy */
}

/* Sem texto em degradê: título branco, palavra de destaque em laranja sólido */
.text-gradient, .h1_text-gradient, .text-gradient-h2, .cs-body h2, .process_num,
[class*="text-gradient"] {
  background-image: none !important;
  -webkit-text-fill-color: currentColor !important;
  color: #fff;
}
.process_num { color: var(--bm-orange) !important; }
.hl { color: var(--bm-orange) !important; -webkit-text-fill-color: var(--bm-orange) !important; }

/* Logo do menu: símbolo parado + palavra que some ao rolar, como na referência */
.nav_logo.bm-logo { display: flex; align-items: center; gap: 10px; width: auto; height: 32px; }
.bm-logo img { display: block; height: 100%; width: auto; }
.bm-logo .bm-word { height: 26px; transition: opacity .3s ease; }
.nav_component.scrolled .bm-logo .bm-word { opacity: 0; }

/* Botões laranja; hover escurece e a seta anda */
.button, .form-submit {
  background-color: var(--bm-orange) !important;
  color: #fff !important;
  border-color: var(--bm-orange) !important;
  transition: background-color .2s ease;
}
.button:hover, .form-submit:hover { background-color: var(--bm-orange-dark) !important; }
.button .icon-1x1-xsmall, .form-submit svg { transition: transform .2s ease; }
.button:hover .icon-1x1-xsmall, .form-submit:hover svg { transform: translateX(4px); }

/* Contraste AA nos textos pequenos de apoio */
.text-style-muted, .eyebrow-text.text-style-muted, .testimonial_author .text-size-small,
.team_member p, .cs_wrap .eyebrow-text { color: var(--bm-muted) !important; }

/* Foco visível no teclado */
a:focus-visible, button:focus-visible, input:focus-visible, select:focus-visible,
textarea:focus-visible, [tabindex]:focus-visible {
  outline: 2px solid var(--bm-orange) !important;
  outline-offset: 3px;
}

/* Logos de clientes em branco */
.hero_logo { filter: brightness(0) invert(1); opacity: .85; max-height: 44px; width: auto; object-fit: contain; }

/* Depoimentos: foto e logo junto do nome */
.bm-author { display: flex; align-items: center; gap: 12px; justify-content: center; }
.bm-author .bm-avatar { width: 44px; height: 44px; border-radius: 50%; object-fit: cover; flex: none; }
.bm-author .bm-client-logo { height: 18px; width: auto; filter: brightness(0) invert(1); opacity: .7; }
.bm-author-text { text-align: left; }
.bm-author-text p { margin: 0; }

/* Nota da fonte dos números */
.bm-stats-note { text-align: center; color: var(--bm-muted); font-size: .8rem; margin-top: 1.5rem; }

/* Cards de case: foto em preto e branco com o logo do cliente por cima */
.cs_img-wrap { position: relative; }
.cs_img-wrap > img:first-child { filter: grayscale(1) contrast(1.05) brightness(.7); }
.bm-case-logo {
  position: absolute; inset: 0; margin: auto; max-width: 55%; max-height: 35%;
  object-fit: contain; filter: brightness(0) invert(1); pointer-events: none;
}

/* Números grandes na página de case */
.bm-results { display: grid; grid-template-columns: repeat(auto-fit, minmax(160px, 1fr)); gap: 1.5rem; margin: 1rem 0 2rem; }
.bm-results div { border: 1px solid rgba(237, 231, 225, .12); border-radius: 12px; padding: 1.25rem; }
.bm-results strong { display: block; font-size: 2.5rem; line-height: 1.1; color: var(--bm-orange); font-weight: 700; }
.bm-results span { color: var(--bm-cream); }

/* Outros cases no fim da página de case */
.bm-more-cases { display: grid; grid-template-columns: repeat(auto-fit, minmax(260px, 1fr)); gap: 2rem; margin-top: 1rem; }
.bm-more-title { color: #fff; margin: 3rem 0 1rem; }

/* Time: fotos em tom uniforme */
.founder_img img, .team_member-photo { filter: grayscale(1) contrast(1.05); }
.bm-team-video { width: 100%; max-width: 960px; margin: 2rem auto 0; display: block; border-radius: 16px; }

/* Card 4 do processo: ícone de traço que se desenha ao aparecer, como os Lottie dos outros cards */
.bm-draw path { stroke-dasharray: 260; stroke-dashoffset: 260; transition: stroke-dashoffset 1.3s ease; }
.bm-draw.is-drawn path { stroke-dashoffset: 0; }

/* Formulário */
.bm-hp { position: absolute !important; left: -9999px !important; width: 1px; height: 1px; overflow: hidden; }
.bm-form-note { font-size: .8rem; color: var(--bm-muted); margin-top: .75rem; text-align: center; }
.bm-form-note a { color: var(--bm-cream); text-decoration: underline; }
.bm-form-error {
  margin-top: 1rem; padding: 1rem; border-radius: 10px; border: 1px solid var(--bm-orange);
  color: var(--bm-cream); background: rgba(219, 85, 0, .08); font-size: .9rem;
}
.bm-form-error a { color: #fff; font-weight: 700; }
.bm-back-logo { position: absolute; top: max(24px, env(safe-area-inset-top, 0px)); left: max(24px, env(safe-area-inset-left, 0px)); z-index: 10; }
.bm-back-logo img { height: 32px; width: auto; display: block; }

/* Banner de cookies */
.bm-cookies {
  position: fixed; left: 0; right: 0; bottom: 0; z-index: 9999;
  padding: 1rem max(16px, env(safe-area-inset-right, 0px)) calc(1rem + env(safe-area-inset-bottom, 0px)) max(16px, env(safe-area-inset-left, 0px));
  background: rgba(13, 27, 42, .96); border-top: 1px solid rgba(237, 231, 225, .12);
  display: flex; gap: 1rem; align-items: center; justify-content: center; flex-wrap: wrap;
  color: var(--bm-cream); font-size: .875rem;
}
.bm-cookies a { color: #fff; text-decoration: underline; }
.bm-cookies button {
  background: var(--bm-orange); color: #fff; border: 0; border-radius: 999px;
  padding: .55rem 1.25rem; font: inherit; font-weight: 700; cursor: pointer;
}
.bm-cookies button.bm-ghost { background: transparent; border: 1px solid rgba(237, 231, 225, .3); font-weight: 400; }

/* Páginas de texto (termos, privacidade, 404) */
.bm-legal { max-width: 760px; margin: 0 auto; color: var(--bm-cream); line-height: 1.7; }
.bm-legal h1 { color: #fff; font-size: 2.5rem; margin-bottom: 1rem; }
.bm-legal h2 { color: #fff; font-size: 1.4rem; margin: 2rem 0 .5rem; }
.bm-legal a { color: var(--bm-orange); }

/* Quem pede menos movimento vê tudo parado */
@media (prefers-reduced-motion: reduce) and (max-width: 0px) {
  *, *::before, *::after {
    animation-duration: .001ms !important; animation-iteration-count: 1 !important;
    transition-duration: .001ms !important; scroll-behavior: auto !important;
  }
  .bm-draw path { stroke-dashoffset: 0; }
}

/* Fotos de case todas em 3:2, como na referência */
.cs_img-wrap > img:first-child { width: 100%; height: auto; aspect-ratio: 3 / 2; object-fit: cover; object-position: 50% 35%; display: block; }
.bm-author .bm-avatar { object-position: 50% 20%; }

/* Página de contato: tira a fonte e o degradê próprios da referência */
body *:not([class*="w-icon"]):not(svg):not(path) { font-family: "General Sans", sans-serif !important; }
.accent { background-image: none !important; -webkit-text-fill-color: var(--bm-orange) !important; color: var(--bm-orange) !important; }

/* ================= Camada de estilo BMAI =================
   Curvas fortes de saída (Emil Kowalski) e botões com rótulo que rola (base: Magic UI interactive-hover/shimmer). */
:root {
  --ease-out: cubic-bezier(0.23, 1, 0.32, 1);
  --ease-in-out: cubic-bezier(0.77, 0, 0.175, 1);
  --line: rgba(237, 231, 225, .1);
}

/* Grão leve no fundo inteiro: tira o aspecto chapado */
body::after {
  content: ""; position: fixed; inset: 0; z-index: 9998; pointer-events: none;
  background-image: url("/assets/grainy.avif");
  background-size: 512px; opacity: .05; mix-blend-mode: overlay;
}

/* Títulos: tracking mais justo */
h1, h2, .heading-style-h1, .heading-style-h4, .text-sequence-stop { letter-spacing: -0.025em; }

/* ---------- Botões ---------- */
.button, .form-submit {
  position: relative; isolation: isolate; overflow: hidden;
  border-radius: 999px !important;
  padding: .55rem .6rem .55rem 1.35rem !important;
  font-weight: 700 !important; letter-spacing: .06em !important; font-size: .8rem !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .28), inset 0 -10px 18px rgba(0, 0, 0, .18), 0 10px 30px -12px rgba(219, 85, 0, .7);
  transition: transform 160ms var(--ease-out), background-color 200ms ease, box-shadow 200ms ease !important;
}
.form-submit { padding: .9rem 1.4rem !important; justify-content: center; }
.button:active, .form-submit:active { transform: scale(.97); }
/* Rótulo que rola: o texto sai por cima e entra de novo por baixo */
.bm-label { display: inline-grid; overflow: hidden; line-height: 1.25; }
.bm-label > span, .bm-label::after { grid-area: 1 / 1; transition: transform 420ms var(--ease-out); }
.bm-label::after { content: attr(data-text); transform: translateY(110%); }
/* Seta num círculo claro */
.button .icon-1x1-xsmall {
  width: 1.9rem; height: 1.9rem; border-radius: 50%; display: grid; place-items: center; flex: none;
  background: rgba(255, 255, 255, .16); transition: background-color 200ms ease, color 200ms ease, transform 300ms var(--ease-out);
}
.button .icon-1x1-xsmall svg { width: 6px; height: 10px; display: block; margin-left: 1px; }
.button .icon-1x1-xsmall { line-height: 0; }
.button.is-icon-small { padding: .45rem .5rem .45rem 1.2rem !important; display: inline-flex; align-items: center; gap: .75rem; }
.button.is-icon:hover { grid-column-gap: .875rem; grid-row-gap: .875rem; }
@media (hover: hover) and (pointer: fine) {
  .button:hover .bm-label > span, .form-submit:hover .bm-label > span { transform: translateY(-110%); }
  .button:hover .bm-label::after, .form-submit:hover .bm-label::after { transform: translateY(0); }
  .button:hover .icon-1x1-xsmall { background: var(--bm-cream); color: var(--bm-orange); transform: translateX(2px); }
  .button:hover { box-shadow: inset 0 1px 0 rgba(255, 255, 255, .35), inset 0 -10px 18px rgba(0, 0, 0, .12), 0 14px 36px -10px rgba(219, 85, 0, .85); }
}
.button:hover .icon-1x1-xsmall, .form-submit:hover svg { transform: none; }

/* ---------- Menu ---------- */
.nav_menu-link { position: relative; }
.nav_menu-link::after {
  content: ""; position: absolute; left: 0; right: 0; bottom: -4px; height: 1px; background: var(--bm-orange);
  transform: scaleX(0); transform-origin: right; transition: transform 300ms var(--ease-out);
}
@media (hover: hover) and (pointer: fine) {
  .nav_menu-link:hover::after { transform: scaleX(1); transform-origin: left; }
}
.nav_menu-link.w--current { color: #fff !important; }
.nav_menu-link.w--current::after { transform: scaleX(1); }

/* ---------- Rótulos pequenos (eyebrow) com marcador laranja ---------- */
.eyebrow-text { display: inline-flex; align-items: center; gap: .6rem; letter-spacing: .14em; }
.eyebrow-text::before { content: ""; width: 6px; height: 6px; background: var(--bm-orange); transform: rotate(45deg); flex: none; }

/* ---------- Logos dos clientes no hero ---------- */
.hero_logo-row { align-items: center; gap: 2.5rem; }
.hero_logo-wrap { display: flex; align-items: center; justify-content: center; height: 34px; }
.hero_logo { height: 24px !important; max-height: none; max-width: 130px; width: auto; object-fit: contain; opacity: .6; transition: opacity 200ms ease; }
.hero_logo.is-mid { height: 32px !important; }
.hero_logo.is-square { height: 44px !important; }
.hero_logo-wrap { height: 48px; }
@media (hover: hover) and (pointer: fine) { .hero_logo:hover { opacity: 1; } }

/* ---------- Cards do processo ---------- */
.process_card {
  background: linear-gradient(180deg, rgba(237, 231, 225, .045), rgba(237, 231, 225, .01)) !important;
  border: 1px solid var(--line) !important;
  box-shadow: inset 0 1px 0 rgba(237, 231, 225, .08);
  transition: border-color 250ms ease, transform 300ms var(--ease-out);
}
.bm-method-icon { display: flex; align-items: center; justify-content: center; flex: none; width: 180px; height: 188px; color: #fff; }
.process_step._4, .process_step._5 { opacity: 1; transform: translate3d(0, 0, 0); }
html.bm-motion-ready .process_step:is(._4, ._5) { transition: opacity 520ms cubic-bezier(.16,1,.3,1), transform 620ms cubic-bezier(.16,1,.3,1); }
html.bm-motion-ready .process_step._4:not(.is-in-view) { opacity: 0; transform: translate3d(-52px, 0, 0); }
html.bm-motion-ready .process_step._5:not(.is-in-view) { opacity: 0; transform: translate3d(52px, 0, 0); }
.section_services { opacity: 1 !important; padding-top: 104px; scroll-margin-top: 74px; }
.nav_skip-link:not(:focus-visible) { position: absolute !important; width: 1px !important; height: 1px !important; padding: 0 !important; margin: -1px !important; overflow: hidden !important; clip-path: inset(50%) !important; white-space: nowrap !important; border: 0 !important; }
.nav_skip-link:focus-visible { position: fixed; top: 12px; left: 50%; margin-top: 0; z-index: 9999; }
.bm-method-icon svg { width: 100%; height: 100%; overflow: visible; }
.bm-method-icon .bm-draw-line { stroke-dasharray: 320; stroke-dashoffset: 0; }
.process_step.is-in-view .bm-draw-line,
.services_wrap.is-active .bm-draw-line { animation: bm-line-draw 1.4s cubic-bezier(.22,1,.36,1) both; }
.process_step.is-in-view .bm-method-node,
.services_wrap.is-active .bm-method-node { animation: bm-node-in 650ms 400ms cubic-bezier(.22,1,.36,1) both; transform-origin: center; }
@keyframes bm-line-draw { from { stroke-dashoffset: 320; } to { stroke-dashoffset: 0; } }
@keyframes bm-node-in { from { opacity: 0; scale: .7; } to { opacity: 1; scale: 1; } }
.bm-method-illustration :is(.bm-method-orbit, .bm-method-action, .bm-method-detail, .bm-method-finish) { stroke-dasharray: var(--bm-trace-length); stroke-dashoffset: 0; }
.bm-follow-icon .bm-method-orbit { --bm-trace-length: 189; --bm-trace-time: 1050ms; --bm-trace-delay: 0ms; }
.bm-follow-icon .bm-method-action { --bm-trace-length: 47; --bm-trace-time: 580ms; --bm-trace-delay: 380ms; }
.bm-follow-icon .bm-method-detail { --bm-trace-length: 21; --bm-trace-time: 440ms; --bm-trace-delay: 760ms; }
.bm-growth-icon .bm-method-orbit { --bm-trace-length: 166; --bm-trace-time: 1050ms; --bm-trace-delay: 0ms; }
.bm-growth-icon .bm-method-detail { --bm-trace-length: 25; --bm-trace-time: 450ms; --bm-trace-delay: 380ms; }
.bm-growth-icon .bm-method-action { --bm-trace-length: 63; --bm-trace-time: 750ms; --bm-trace-delay: 420ms; }
.bm-growth-icon .bm-method-finish { --bm-trace-length: 19; --bm-trace-time: 380ms; --bm-trace-delay: 880ms; }
:where(.process_step.is-in-view, .services_wrap.is-motion-active) .bm-method-illustration :is(.bm-method-orbit, .bm-method-action, .bm-method-detail, .bm-method-finish) {
  animation: bm-method-trace var(--bm-trace-time) cubic-bezier(.16,1,.3,1) var(--bm-trace-delay) both;
}
@keyframes bm-method-trace { from { stroke-dashoffset: var(--bm-trace-length); opacity: .35; } to { stroke-dashoffset: 0; opacity: 1; } }
.section_services .services_wrap[hidden] { display: none !important; }
.section_services .services_wrap.is-entering { animation: bm-service-card-enter 420ms cubic-bezier(.22,1,.36,1) both; }
@keyframes bm-service-card-enter { from { opacity: .55; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }
.services_nav-wrap { overflow-x: auto; scrollbar-width: thin; }
.services_nav { display: grid !important; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 1rem !important; width: 100%; }
.services_nav-item { appearance: none; background: none; border: 0; color: inherit; padding: .75rem 0 1.5rem; text-align: left; cursor: pointer; min-width: 0; display: flex; align-items: flex-start; gap: .4rem; }
.services_nav-item-text { font-size: clamp(.95rem, 1.45vw, 1.35rem) !important; line-height: 1.2; overflow-wrap: normal; }
.services_nav-item:focus-visible { outline: 2px solid var(--bm-orange); outline-offset: 4px; border-radius: 4px; }
.services_nav-item.active .services_nav-item-text { color: var(--bm-cream); }
.services_wrap .bm-method-icon { width: 200px; height: 200px; }
@media (max-width: 767px) {
  .services_wrap .bm-method-icon { width: 150px; height: 150px; }
}
@media (max-width: 767px) {
  .section_services { padding-top: 88px; }
  .services_nav-wrap { align-items: flex-start !important; mask-image: linear-gradient(90deg, transparent, #000 24px, #000 calc(100% - 24px), transparent); }
  .services_nav { display: flex !important; width: max-content !important; max-width: none !important; min-width: 100%; gap: .75rem !important; padding-inline: max(0px, calc((100vw - 186px) / 2)); }
  .services_nav-item { flex: 0 0 146px; }
  .services_nav-item-text { font-size: 1rem !important; }
  .process_cards-wrap, .process_step, .process_card { box-sizing: border-box; width: 100% !important; max-width: 100% !important; min-width: 0 !important; }
  .process_step { margin-left: 0 !important; margin-right: 0 !important; }
  .process_card-info { min-width: 0 !important; width: 100%; }
  .process_card-title h3 { font-size: clamp(1.65rem, 7vw, 2rem) !important; overflow-wrap: anywhere; }
}
@media (max-width: 479px) {
  .services_wrap .bm-method-icon { width: 120px; height: 120px; }
}
@media (prefers-reduced-motion: reduce) and (max-width: 0px) {
  .process_step.is-in-view .bm-draw-line, .services_wrap.is-active .bm-draw-line,
  .process_step.is-in-view .bm-method-node, .services_wrap.is-active .bm-method-node,
  .section_services .services_wrap.is-entering,
  :where(.process_step.is-in-view, .services_wrap.is-motion-active) .bm-method-illustration :is(.bm-method-orbit, .bm-method-action, .bm-method-detail, .bm-method-finish) { animation: none !important; }
  html.bm-motion-ready .process_step:is(._4, ._5):not(.is-in-view) { opacity: 1 !important; transform: none !important; }
}
@media (hover: hover) and (pointer: fine) {
  .process_card:hover { border-color: rgba(219, 85, 0, .45) !important; transform: translateY(-3px); }
}

/* ---------- Depoimentos ---------- */
.testimonial_card { position: relative; padding-top: 3.5rem; }
.testimonial_card::before {
  content: "“"; position: absolute; top: -.5rem; left: 50%; transform: translateX(-50%);
  font-size: 6rem; line-height: 1; color: var(--bm-orange); opacity: .9; font-weight: 700;
}

/* ---------- Números ---------- */
.stat_num { font-variant-numeric: tabular-nums; letter-spacing: -0.03em; }

/* ---------- Cards de case: selo do cliente no canto, sem cobrir rosto ---------- */
.cs_img-wrap::after {
  content: ""; position: absolute; inset: 45% 0 0 0; pointer-events: none;
  background: linear-gradient(180deg, transparent, rgba(13, 27, 42, .85));
}
.bm-case-logo {
  inset: auto auto 14px 16px !important; margin: 0 !important;
  max-width: 38% !important; max-height: 34px !important; height: 34px; width: auto; z-index: 2;
}
.cs_img-wrap > img:first-child { transition: transform 600ms var(--ease-out), filter 400ms ease; }
@media (hover: hover) and (pointer: fine) {
  .cs_wrap:hover .cs_img-wrap > img:first-child { transform: scale(1.04); filter: grayscale(.2) brightness(.85); }
}

/* ---------- Dúvidas ---------- */
.faq_accordion { border-color: var(--line) !important; transition: border-color 200ms ease; }
.faq_accordion.is-open, .faq_accordion:hover { border-color: rgba(219, 85, 0, .35) !important; }
.faq_icon-code { transition: transform 300ms var(--ease-out), color 200ms ease; }
.faq_accordion.is-open .faq_icon-code { transform: rotate(180deg); }

/* ---------- Formulário ---------- */
.contact-form input, .contact-form select, .contact-form textarea {
  border-radius: 10px !important; transition: border-color 200ms ease, box-shadow 200ms ease;
}
.contact-form input:focus, .contact-form select:focus, .contact-form textarea:focus {
  border-color: var(--bm-orange) !important; box-shadow: 0 0 0 3px rgba(219, 85, 0, .18) !important; outline: none;
}
