/* Frete Garantido — paleta da marca (verde primário #2ACE8A, escuros #23352E/#171C1A,
   claro #AAE993, neutros #E6ECE1/#F8F8F9) + tokens do Figma. */
:root, body {
  /* primários */
  --core-purple--t1: #2ace8a;
  --core-purple--t2: #aae993;
  --core-purple--t4: #e6ece1;
  --core-purple-dark--100: #21a36d;
  --buttons--primary-pressed: #1b8559;

  /* superfícies e texto */
  --uv-purple: #23352e;
  --dark-purple: #171c1a;
  --almost-black: #171c1a;
  --light-grey: #f8f8f9;
  --off-white: #f8f8f9;
  --grey--100: #cfd4d2;
  --neutrals--45: #afb6b4;
  --stone: #777a78;

  /* acentos (sem tons fora da paleta) */
  --yellow: #23352e;   /* faixa da seção de cards: fundo escuro da marca */
  --green: #39c88d;
  --sand: #aae993;
  --red-strong: #ec7465; /* funcional: erro de formulário */

  /* tipografia */
  --_typography---fg-heading: "Fustat", Georgia, sans-serif;
  --_typography---fg-body: "DM Sans", Arial, sans-serif;
}

/* Faixa "Os dois lados da estrada.": fundo escuro, título branco com "dois lados" em verde */
.releases_header .heading-style-215,
.releases_header .heading-style-215 * {
  color: #f8f8f9 !important;
}
.releases_header .heading-style-215 .fg-verde,
.releases_header .heading-style-215 .fg-verde * {
  color: #2ace8a !important;
}

/* Seção da roda: fundo branco com textos no verde primário da marca
   (no original era o bloco roxo vivo com texto branco). */
.section_standart { background-color: #e6ece1; color: #2ace8a; }

/* ---- Logo do navbar: apenas o ícone da marca, em container generoso ---- */
.navbar_logo {
  background-color: transparent;
  width: auto;
  height: auto;
}
.navbar_logo .logo-svg {
  width: auto;
  max-width: none;
  height: auto;
  aspect-ratio: auto;
}
.fg-logo { display: flex; align-items: center; }
.fg-logo-badge {
  flex: none;
  width: 4.25rem;
  height: 4.25rem;
  border-radius: 0;
  background: #ffffff;
  display: flex;
  align-items: center;
  justify-content: center;
}
.fg-logo-badge svg { width: 64%; height: auto; display: block; }
@media (max-width: 767px) {
  .fg-logo-badge { width: 3.25rem; height: 3.25rem; }
}

/* Rodapé: lockup horizontal */
.footer-logo { width: clamp(10rem, 16vw, 14rem); max-width: none; height: auto; aspect-ratio: 3972 / 500; }
.footer-logo svg { width: 100%; height: 100%; }

/* Slots de logo nos cards de público */
.release-logos { height: auto; }
.release-logos img { max-height: 3.25rem; max-width: 16rem; width: auto; }

/* ---- Smartphone 3D (coreografia do cartão original: scrub até ficar de frente) ---- */
.spline-canvas { display: flex; align-items: center; justify-content: center; }
.fg-phone {
  width: min(60vw, 52rem);
  aspect-ratio: 1;
}
.fg-phone canvas { width: 100%; height: 100%; display: block; }

/* Cards de público: sem logo, apenas textos, com overlay reforçado para contraste */
.release-logos { display: none; }
.release-card_overlay,
.release-card_overlay.more-gradient {
  background: linear-gradient(180deg, rgba(23, 28, 26, 0.05) 35%, rgba(23, 28, 26, 0.82) 100%) !important;
}

/* Área do slider de benefícios: fundo branco */
.section-moments { background-color: #e6ece1; }
.section-moments .heading-style-167,
.section-moments .heading-style-167 * { color: #2ace8a !important; }

/* Faixa do scroll-prompt: branca, com a cápsula da seta no verde-claro da marca */
.section_overlap, .contain-scroll { background-color: #e6ece1; }
.scroll-mobile-icon rect { fill: #aae993; }
.scroll-to-block { background-color: #aae993; }

/* Rodapé: "Vá com carga." em linha própria, no verde-claro dos rótulos do rodapé */
.footer_header .heading-style-80 .fg-verde { color: #aae993; }

/* Sliders: transição suave e botões com anel de progresso */
.swiper.is-moments .swiper-wrapper,
.swiper.is-news .swiper-wrapper {
  transition-timing-function: cubic-bezier(0.22, 0.61, 0.36, 1) !important;
}
.swiper_button {
  position: relative;
  overflow: visible;
  -webkit-tap-highlight-color: transparent;
  user-select: none;
  touch-action: manipulation;
}
.swiper_button:active { transform: none; }
.news-slider_control { gap: 1.4rem; padding: 0.85rem 1rem; }
.fg-ring {
  position: absolute;
  inset: -0.6rem;               /* respiro generoso entre o botão e o anel */
  pointer-events: none;
  opacity: 0;
  transition: opacity 0.25s ease;
  transform: rotate(-90deg);    /* progresso começa no topo */
}
.fg-ring circle {
  fill: none;
  stroke: #2ace8a;
  stroke-width: 2.5;
  stroke-linecap: round;
}

/* Sem fundos puramente brancos: superfícies da marca para destacar os assets */
body { background-color: #e6ece1; }
.section_news { background-color: #e6ece1; }

/* Botões dos sliders: sem outline no clique de mouse (mantém para teclado) */
.swiper_button:focus:not(:focus-visible) { outline: none; }
.swiper_button:focus-visible { outline: 2px solid #2ace8a; outline-offset: 4px; }

/* Inputs: transições suaves no label flutuante, borda e ícone do select */
.form-hero_input-wrap {
  transition: padding 0.3s cubic-bezier(0.22, 0.61, 0.36, 1),
              border-color 0.3s ease,
              background-color 0.3s ease;
}
.form-hero_label {
  transition: opacity 0.3s ease, transform 0.3s ease;
}
.form-hero_input {
  transition: color 0.3s ease;
}
.form_select_icon {
  transition: transform 0.35s cubic-bezier(0.22, 0.61, 0.36, 1);
}

/* Splash: marca ao lado do "no", preenchendo o espaço vazio da caixa */
.fg-hello-row {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: clamp(1rem, 2.5vw, 2.25rem);
}
.fg-hello-logo { flex: none; width: clamp(4.5rem, 9vw, 8.75rem); }
.fg-hello-logo svg { width: 100%; height: auto; display: block; }

/* Splash screen: fundo totalmente branco durante a intro */
.section_global-hero { background-color: #ffffff; }

/* Splash: lados simétricos para o retângulo de revelação nascer exatamente
   no centro e empurrar as palavras sem sobrepor */
.hero_background-wrap .intro-hello {
  flex: 1 1 0 !important;
  width: auto !important;
  min-width: 0;
}

/* Hero em video. As imagens originais permanecem por baixo como fallback. */
.section_global-hero .hero-img,
.section_global-hero .img-scale {
  overflow: hidden;
}
.section_global-hero .img-scale {
  position: relative;
}
.section_global-hero .fg-hero-video {
  position: absolute;
  inset: 0;
  z-index: 1;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: 64% center;
  opacity: 0;
  transition: opacity 500ms ease;
  background: #23352e;
}
.section_global-hero .fg-hero-video.is-ready {
  opacity: 1;
}
.section_global-hero .hero-img_overlay {
  z-index: 2;
  pointer-events: none;
}
@media (max-width: 767px) {
  .section_global-hero .fg-hero-video {
    object-position: 58% center;
  }
}
@media (prefers-reduced-motion: reduce) {
  .section_global-hero .fg-hero-video {
    display: none;
  }
}
.fg-form { margin: 0 0 15px; }

/* Revisão: hierarquia de cores e textos com mais respiro ao lado do app. */
.section_standart .fg-secondary,
.section_standart .standart-bottom-wrap { color: #23352e; }
.section_standart .fg-highlight { color: #2ace8a; }
.section_standart .standart-bottom-wrap {
  grid-template-columns: minmax(0, 1fr) minmax(0, 1.2fr) minmax(0, 1fr);
  column-gap: clamp(1.5rem, 3vw, 3rem);
}
.standart-bottom_left { max-width: 24rem; }
.standart-bottom_left .heading-style-48 {
  font-size: clamp(1.65rem, 2.7vw, 2.75rem);
  line-height: 1.16;
  text-wrap: pretty;
}
.standart-bottom_right { max-width: 20rem; opacity: 1; }
.standart-bottom_right .heading-style-34 { line-height: 1.25; }

/* Cards de indicadores, com valores legíveis em qualquer tamanho. */
.money-transfer-block.fg-freight-card,
.savings-block.new-ver.fg-savings-card {
  display: flex;
  flex-direction: row;
  align-items: center;
  gap: 1rem;
  width: calc(100% - 2rem);
  max-width: 24rem;
  padding: 1rem;
  inset: auto 1rem 1rem auto;
  border: 0;
  border-radius: 1.25rem;
  background: #f8f8f9;
  box-shadow: none;
  container-type: normal;
}
.fg-card-copy { display: flex; flex-direction: column; gap: .4rem; flex: 0 0 auto; }
.fg-card-label { color: #53665c; font-size: .8rem; font-weight: 500; line-height: 1.2; }
.fg-card-value { color: #23352e; font-size: clamp(1.25rem, 1.7vw, 1.7rem); font-weight: 600; line-height: 1.1; white-space: nowrap; letter-spacing: -.04em; }
.money-transfer-block.fg-freight-card,
.savings-block.new-ver.fg-savings-card {
  width: auto;
  max-width: calc(100% - 2rem);
  padding: 1.25rem 1.5rem;
}
.fg-card-value { font-variant-numeric: tabular-nums; letter-spacing: -.025em; }
.fg-card-value [data-fg-count] { display: inline-block; min-width: 9ch; text-align: right; }

/* Gravity Icons: tamanho e cor consistentes, SVGs oficiais incorporados. */
.fg-icon { display: block; width: 100%; height: 100%; flex-shrink: 0; }
.btn-icon { border-radius: 50%; background: #2ace8a; color: #fff; padding: .625rem; }
.scroll-mobile-icon { border-radius: 999px; background: #aae993; color: #23352e; padding: .3rem .7rem; }
.money-transfer-block.fg-freight-card,
.savings-block.new-ver.fg-savings-card {
  display: grid;
  grid-template-columns: 2.75rem minmax(0, 1fr);
  gap: .875rem;
  width: 15.75rem;
  padding: 1.125rem;
  border-radius: 1.125rem;
  text-align: left;
}
.fg-card-icon { display: grid; place-items: center; width: 2.75rem; height: 2.75rem; border-radius: .875rem; background: #e6ece1; color: #23352e; }
.fg-card-icon .fg-icon { width: 1.375rem; height: 1.375rem; }
.fg-savings-card .fg-card-icon { background: #d6f5e7; color: #1b8559; }
.fg-card-copy { min-width: 0; gap: .375rem; align-items: flex-start; }
.fg-card-label { font-size: .75rem; line-height: 1.25; letter-spacing: .01em; }
.fg-card-value { font-size: 1.625rem; line-height: 1.15; }
.fg-card-value [data-fg-count] { min-width: 0; text-align: left; }

/* Rodapé compacto; controles indisponíveis mostram uma dica acessível. */
.footer .padding-section-medium { padding-top: 3rem; padding-bottom: 2.5rem; }
.footer-main-wrap { gap: 2rem; }
.footer_header .heading-style-80 { font-size: clamp(2rem, 4vw, 3.5rem); line-height: 1.08; }
.fg-footer-nav { display: flex; flex-wrap: wrap; gap: .75rem 2rem; padding-block: .25rem; }
.fg-soon-item { position: relative; display: inline-flex; }
.fg-soon-button { background: transparent; color: #f8f8f9; padding: .5rem 0; font: inherit; font-size: .95rem; cursor: default; }
.fg-soon-button:hover, .fg-soon-button:focus { color: #aae993; }
.fg-soon-button:focus-visible { outline: 2px solid #aae993; outline-offset: 5px; border-radius: 3px; }
.fg-tooltip { position: absolute; bottom: calc(100% + .35rem); left: 50%; transform: translateX(-50%); padding: .4rem .7rem; border-radius: .5rem; background: #aae993; color: #23352e; font-size: .75rem; white-space: nowrap; opacity: 0; visibility: hidden; pointer-events: none; transition: opacity .15s; }
.fg-soon-item:hover .fg-tooltip, .fg-soon-item:focus-within .fg-tooltip { opacity: 1; visibility: visible; }
.footer-bottom { gap: 1.25rem; }

/* Rodapé editorial: poucos elementos, respiro e assinatura em grande escala. */
.footer { overflow: hidden; background: #23352e; }
.footer > .padding-section-medium { padding-top: clamp(4rem, 7vw, 7rem); padding-bottom: 0; }
.fg-footer-refined { gap: clamp(3rem, 5vw, 5rem); }
.fg-footer-top { display: flex; align-items: flex-start; justify-content: space-between; gap: 4rem; }
.fg-footer-top .footer_header { flex: 1; }
.fg-footer-top .heading-style-80 { font-size: clamp(2rem, 3.8vw, 3.75rem); line-height: 1.12; letter-spacing: -.04em; }
.fg-footer-top .fg-footer-nav { display: grid; grid-template-columns: auto auto; column-gap: clamp(3rem, 6vw, 6rem); row-gap: 2rem; padding-top: .25rem; }
.fg-footer-group { display: flex; flex-direction: column; align-items: flex-start; gap: .5rem; }
.fg-footer-group h3 { margin: 0 0 .75rem; font-size: .8rem; font-weight: 500; color: #aae993; letter-spacing: .035em; }
.fg-footer-description { margin: 1.25rem 0 0; max-width: 24rem; font-size: 1rem; line-height: 1.5; color: #c8d3cb; }
.fg-footer-top .fg-soon-button { font-size: .875rem; color: #e6ece1; }
.fg-footer-top .fg-soon-button:hover, .fg-footer-top .fg-soon-button:focus { color: #2ace8a; }
.fg-footer-meta { display: flex; align-items: flex-end; justify-content: space-between; gap: 2rem; padding-top: 1.5rem; border-top: 1px solid rgba(230,236,225,.16); color: #a5b3aa; }
.fg-footer-meta p { margin: 0; font-size: .75rem; line-height: 1.65; }
.fg-footer-note { max-width: 23rem; text-align: right; }
.fg-footer-wordmark { margin-top: clamp(3.5rem, 6vw, 6rem); width: 100%; padding: 0; line-height: 0; }
.fg-footer-wordmark img { display: block; width: 100%; height: auto; }
.fg-wordmark-accent { color: #2ace8a; font-weight: 600; }

/* Símbolo em linha: o contorno acompanha o scroll, sem glow ou preenchimento. */
.releases_header { isolation: isolate; overflow: clip; }
.releases_header > .padding-global { position: relative; z-index: 1; }
.fg-scroll-logo { position: absolute; z-index: 0; left: 50%; top: 50%; transform: translate(-50%, -50%); width: max(105vw, 110vh); color: #aae993; opacity: .065; pointer-events: none; user-select: none; -webkit-mask-image: linear-gradient(to bottom, #000 0%, rgba(0,0,0,.7) 30%, rgba(0,0,0,.25) 55%, transparent 94%); mask-image: linear-gradient(to bottom, #000 0%, rgba(0,0,0,.7) 30%, rgba(0,0,0,.25) 55%, transparent 94%); }
.fg-scroll-logo svg { display: block; width: 100%; height: auto; overflow: visible; }
.fg-scroll-logo path { fill: none; stroke: currentColor; stroke-width: 2.5; stroke-linecap: round; stroke-linejoin: round; }

/* Fotografia: recortes consistentes e acabamento discreto. */
.moments-image-blocks .hold-image { overflow: hidden; border-radius: 12px; }
.moments-images { object-fit: cover; object-position: center 45%; }
.release_video_desktop, .release_video_mobile { object-fit: cover; object-position: center; }
.plane-img { max-width: 18rem; }
.plane-img img { border-radius: 12px; }

/* Controles flat: estados por cor, sem efeitos decorativos. */
.fg-icon { animation: none; transition: none; transform: none; }
.button, .swiper_button, .open-modal-btn, .nav-dropdown_local_toggle, .modal-close,
.fg-soon-button, .fg-card-icon, .btn-icon {
  box-shadow: none !important;
  background-image: none !important;
  filter: none !important;
  animation: none !important;
  transition: none !important;
}
.button:hover, .button:active, .swiper_button:hover, .swiper_button:active,
.open-modal-btn:hover, .open-modal-btn:active, .nav-dropdown_local_toggle:hover,
.modal-close:hover { transform: none !important; box-shadow: none !important; }
.button:focus:not(:focus-visible), .swiper_button:focus:not(:focus-visible),
.open-modal-btn:focus:not(:focus-visible) { outline: none; }
.button:focus-visible, .swiper_button:focus-visible, .open-modal-btn:focus-visible {
  outline: 2px solid #23352e; outline-offset: 3px; box-shadow: none;
}
.fg-card-icon { border: 0; box-shadow: none; }
.fg-ring { display: none; }
.fg-footer-meta { border-top: 0; }
@media (max-width: 767px) {
  .fg-footer-top { flex-direction: column; gap: 2.75rem; }
  .fg-footer-top .fg-footer-nav { column-gap: 2.5rem; }
  .fg-footer-meta { align-items: flex-start; flex-direction: column; gap: 1rem; }
  .fg-footer-note { text-align: left; max-width: 20rem; }
  .fg-footer-wordmark { margin-top: 4rem; }
}
@media (max-width: 991px) {
  .section_standart .standart-bottom-wrap { grid-template-columns: 1fr; gap: 2rem; max-width: 36rem; }
  .standart-bottom_left, .standart-bottom_right { max-width: none; }
  .standart-bottom_left .heading-style-48 { font-size: clamp(1.75rem, 4vw, 2.5rem); }
}
@media (max-width: 479px) {
  .money-transfer-block.fg-freight-card,
  .savings-block.new-ver.fg-savings-card { gap: .75rem; padding: 1rem; }
  .fg-card-label { font-size: .75rem; }
  .fg-card-value { font-size: 1.3rem; }
  .fg-footer-nav { gap: .5rem 1.5rem; }
}
