html,
body {
  margin: 0;
  min-height: 100%;
}

.arth-brand-link {
  display: inline-flex;
  align-items: center;
  flex: 0 0 auto;
}

.arth-brand-logo {
  display: block;
  width: auto;
  object-fit: contain;
}

.arth-brand-logo-header {
  height: 2.75rem;
  max-width: 10rem;
}

.arth-brand-heading {
  margin: 0;
}

.arth-brand-logo-footer {
  height: 4rem;
  max-width: 14rem;
}

@media (min-width: 1024px) {
  .arth-brand-logo-header {
    height: 3rem;
    max-width: 11rem;
  }
}

/* Hero final: a imagem já foi preparada com área livre para a chamada. */
#root main > section:first-child > .absolute.inset-0 > img {
  filter: none;
  transform: none;
  object-position: center center;
}

@media (max-width: 639px) {
  #root main > section:first-child > .absolute.inset-0 > img {
    object-position: right center;
  }
}

/* Reforça a faixa escura atrás da chamada principal. */
#root main > section:first-child > .absolute.inset-0 > div:first-of-type {
  background: linear-gradient(
    90deg,
    rgba(24, 32, 40, 0.84) 0%,
    rgba(24, 32, 40, 0.68) 36%,
    rgba(24, 32, 40, 0.38) 58%,
    rgba(24, 32, 40, 0.1) 82%,
    transparent 100%
  );
}

#root main > section:first-child h1,
#root main > section:first-child h1 + p {
  color: #fff;
  text-shadow: 0 2px 12px rgba(0, 0, 0, 0.55);
}

/* Veículos vendidos permanecem no catálogo como histórico, sem ações comerciais. */
.arth-vehicle-sold > a:first-child img {
  filter: grayscale(0.35) brightness(0.82);
}

.arth-sold-badge {
  position: absolute;
  top: 0.75rem;
  right: 0.75rem;
  z-index: 2;
  border-radius: 0.25rem;
  background: #b42318;
  color: #fff;
  padding: 0.35rem 0.7rem;
  font-size: 0.75rem;
  font-weight: 800;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  box-shadow: 0 4px 14px rgba(24, 32, 40, 0.28);
}

.arth-sold-price p:last-child,
.arth-detail-sold-price {
  color: #b42318 !important;
}

.arth-detail-sold-status {
  display: inline-flex;
  margin-top: 0.75rem;
  border-radius: 0.25rem;
  background: #b42318;
  color: #fff;
  padding: 0.4rem 0.8rem;
  font-size: 0.75rem;
  font-weight: 800;
  letter-spacing: 0.06em;
  text-transform: uppercase;
}

.arth-detail-sold-button {
  display: flex;
  width: 100%;
  align-items: center;
  justify-content: center;
  border-radius: 0.375rem;
  background: #b42318;
  color: #fff;
  padding: 1rem;
  font-size: 1.125rem;
  font-weight: 700;
}

/* Diferenciais: os pictogramas devem contrastar com o fundo azul. */
#root main > section:nth-of-type(3) .w-12.h-12 svg {
  color: #fff;
}

/* Remove o aviso de conteúdo demonstrativo dos depoimentos. */
#root main > section:nth-of-type(7) > div > .mb-8.flex.items-start.gap-2 {
  display: none;
}

/* Bloco manual do Instagram. Não consulta API nem carrega conteúdo externo. */
.arth-instagram-section {
  background: #fff;
  padding: 4rem 1rem;
}

.arth-instagram-shell {
  width: min(100%, 72rem);
  margin: 0 auto;
}

.arth-instagram-title-row {
  display: flex;
  align-items: end;
  justify-content: space-between;
  gap: 1rem;
  margin-bottom: 1rem;
}

.arth-instagram-kicker {
  color: #59636e;
  font-size: 0.75rem;
  font-weight: 700;
  letter-spacing: 0.12em;
  text-transform: uppercase;
}

.arth-instagram-title-row h2 {
  margin-top: 0.35rem;
  color: #182028;
  font-family: var(--font-display);
  font-size: clamp(1.9rem, 4vw, 2.5rem);
  font-weight: 700;
  line-height: 1.1;
}

.arth-instagram-open {
  display: grid;
  width: 2.5rem;
  height: 2.5rem;
  flex: 0 0 auto;
  place-items: center;
  border: 1px solid #e5e7eb;
  border-radius: 0.65rem;
  background: #fff;
  color: #182028;
  font-size: 1.45rem;
  transition: transform 180ms ease, box-shadow 180ms ease;
}

.arth-instagram-open:hover {
  transform: translateY(-2px);
  box-shadow: 0 8px 22px rgba(24, 32, 40, 0.12);
}

.arth-instagram-card {
  overflow: hidden;
  border: 1px solid #dfe3e7;
  border-radius: 0.75rem;
  background: #fff;
}

.arth-instagram-profile {
  display: flex;
  align-items: center;
  gap: 1rem;
  min-height: 7.5rem;
  padding: 1.15rem 1.35rem;
  color: #182028;
}

.arth-instagram-avatar {
  display: grid;
  width: 5.25rem;
  height: 5.25rem;
  flex: 0 0 auto;
  place-items: center;
  padding: 3px;
  border-radius: 999px;
  background: linear-gradient(135deg, #feda75, #fa7e1e 28%, #d62976 58%, #4f5bd5);
}

.arth-instagram-avatar img {
  display: block;
  width: 100%;
  height: 100%;
  border: 3px solid #fff;
  border-radius: 999px;
  object-fit: cover;
}

.arth-instagram-profile-copy {
  display: grid;
  gap: 0.1rem;
  color: #5f6873;
  font-size: 0.82rem;
}

.arth-instagram-profile-copy strong {
  color: #182028;
  font-size: 0.95rem;
}

.arth-instagram-profile-copy span:last-child {
  margin-top: 0.35rem;
}

.arth-instagram-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 2px;
  background: #fff;
}

.arth-instagram-post {
  position: relative;
  display: block;
  aspect-ratio: 1;
  overflow: hidden;
  background: #f5f5f5;
}

.arth-instagram-post img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform 300ms ease;
}

.arth-instagram-post-overlay {
  position: absolute;
  inset: 0;
  display: grid;
  place-items: center;
  background: rgba(24, 32, 40, 0.42);
  color: #fff;
  font-size: 2rem;
  opacity: 0;
  transition: opacity 180ms ease;
}

.arth-instagram-post:hover img {
  transform: scale(1.035);
}

.arth-instagram-post:hover .arth-instagram-post-overlay {
  opacity: 1;
}

@media (max-width: 639px) {
  .arth-instagram-section {
    padding: 3.5rem 1rem;
  }

  .arth-instagram-profile {
    min-height: 6.5rem;
    padding: 1rem;
  }

  .arth-instagram-avatar {
    width: 4.25rem;
    height: 4.25rem;
  }

  .arth-instagram-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

/* --------------------------------------------------------------------------
   Compatibilidade da versão estática / HostGator
   O bundle do clone referencia utilitários Tailwind com cores arbitrárias
   que não foram incluídos no CSS exportado. Sem eles, fundos escuros somem e
   textos ficam com a cor herdada, dando a impressão de conteúdo apagado.
   -------------------------------------------------------------------------- */
.bg-\[\#182028\] { background-color: #182028 !important; }
.bg-\[\#182028\]\/0 { background-color: rgb(24 32 40 / 0) !important; }
.bg-\[\#182028\]\/95 { background-color: rgb(24 32 40 / 0.95) !important; }
.bg-\[\#1A73E8\] { background-color: #1A73E8 !important; }
.bg-\[\#1A73E8\]\/20 { background-color: rgb(26 115 232 / 0.20) !important; }
.bg-\[\#25D366\] { background-color: #25D366 !important; }
.bg-\[\#F5F5F5\] { background-color: #F5F5F5 !important; }

.text-\[\#182028\] { color: #182028 !important; }
.text-\[\#1A73E8\] { color: #1A73E8 !important; }
.text-\[\#59636E\] { color: #59636E !important; }
.text-\[\#5F6873\] { color: #5F6873 !important; }
.text-\[\#66717C\] { color: #66717C !important; }

.border-\[\#182028\] { border-color: #182028 !important; }
.border-\[\#1A73E8\] { border-color: #1A73E8 !important; }
.border-\[\#1A73E8\]\/40 { border-color: rgb(26 115 232 / 0.40) !important; }

.focus\:border-\[\#1A73E8\]:focus { border-color: #1A73E8 !important; }
.focus\:ring-\[\#1A73E8\]:focus { --tw-ring-color: #1A73E8 !important; }
.hover\:bg-\[\#10161C\]:hover { background-color: #10161C !important; }
.hover\:bg-\[\#1557B0\]:hover { background-color: #1557B0 !important; }
.hover\:bg-\[\#182028\]:hover { background-color: #182028 !important; }
.hover\:bg-\[\#182028\]\/40:hover { background-color: rgb(24 32 40 / 0.40) !important; }
.hover\:bg-\[\#1da851\]:hover { background-color: #1da851 !important; }
.hover\:border-\[\#1A73E8\]\/40:hover { border-color: rgb(26 115 232 / 0.40) !important; }
.hover\:text-\[\#1A73E8\]:hover { color: #1A73E8 !important; }

/* Header sempre legível fora do hero, sem depender do fundo da seção abaixo. */
header { isolation: isolate; }

/* Evita que qualquer estado de animação herdado deixe conteúdo permanente
   invisível na exportação estática. */
#root main [style*="opacity: 0"] { opacity: 1 !important; }