/* Souza Auto Center — atualização visual compartilhada */
:root {
  --souza-whatsapp: #16a34a;
  --souza-whatsapp-dark: #0f873a;
  --souza-whatsapp-glow: rgba(34, 197, 94, .28);
}

/* Todo CTA que abre o WhatsApp ganha uma cor de ação única e reconhecível. */
a[href*="wa.me"],
a[href*="api.whatsapp.com"],
a[href*="web.whatsapp.com"] {
  color: #fff !important;
  background: linear-gradient(135deg, #23c967 0%, var(--souza-whatsapp) 52%, var(--souza-whatsapp-dark) 100%) !important;
  border-color: rgba(255, 255, 255, .24) !important;
  border-radius: 14px !important;
  text-shadow: none !important;
  box-shadow: 0 12px 28px var(--souza-whatsapp-glow), inset 0 1px 0 rgba(255, 255, 255, .22) !important;
}

a[href*="wa.me"]:hover,
a[href*="api.whatsapp.com"]:hover,
a[href*="web.whatsapp.com"]:hover {
  color: #fff !important;
  background: linear-gradient(135deg, #31db75 0%, #18b655 52%, #0b7730 100%) !important;
  box-shadow: 0 16px 34px rgba(34, 197, 94, .40), inset 0 1px 0 rgba(255, 255, 255, .3) !important;
  transform: translateY(-2px);
}

.floating-whatsapp {
  background: linear-gradient(135deg, #23c967 0%, var(--souza-whatsapp) 52%, var(--souza-whatsapp-dark) 100%) !important;
  border-radius: 999px !important;
}

/* Hero: a primeira decisão precisa ser inequívoca em desktop e celular. */
.hero .hero-media {
  /* A oficina continua presente como prova visual, sem disputar a leitura do CTA. */
  display: block !important;
  opacity: .54 !important;
  object-position: center !important;
  filter: saturate(.78) contrast(1.06) brightness(.82) !important;
}

.hero::before {
  background:
    radial-gradient(circle at 78% 20%, rgba(217, 30, 54, .14), transparent 38%),
    linear-gradient(180deg, transparent 62%, rgba(7, 3, 4, .38) 100%),
    linear-gradient(90deg, rgba(13, 7, 9, .96) 0%, rgba(18, 8, 11, .88) 43%, rgba(22, 12, 14, .55) 71%, rgba(12, 6, 8, .48) 100%) !important;
}

.hero .hero-copy > p {
  max-width: 52ch;
  color: rgba(255, 255, 255, .92) !important;
  font-size: clamp(16px, 1.45vw, 19px) !important;
  line-height: 1.55 !important;
}

.hero .hero-actions {
  align-items: center;
  gap: 18px !important;
}

.hero .hero-actions a[href*="wa.me"],
.hero .hero-actions a[href*="api.whatsapp.com"],
.hero .hero-actions a[href*="web.whatsapp.com"] {
  position: relative;
  min-height: 58px;
  padding-inline: clamp(24px, 3vw, 34px) !important;
  font-size: 13px !important;
  letter-spacing: .035em;
  box-shadow: 0 18px 34px rgba(26, 197, 90, .35), inset 0 1px 0 rgba(255, 255, 255, .25) !important;
}

.hero .hero-actions a[href*="wa.me"]::after,
.hero .hero-actions a[href*="api.whatsapp.com"]::after,
.hero .hero-actions a[href*="web.whatsapp.com"]::after {
  content: "ATENDIMENTO IMEDIATO";
  position: absolute;
  bottom: -21px;
  left: 0;
  width: 100%;
  color: rgba(255, 255, 255, .72);
  font-family: var(--font-tech), monospace;
  font-size: 8px;
  font-weight: 700;
  letter-spacing: .14em;
  text-align: center;
  pointer-events: none;
}

.hero .text-link {
  color: #fff !important;
  font-weight: 800 !important;
}

.hero .hero-proof {
  margin-top: 38px !important;
  padding: 15px 0 !important;
  border-top: 1px solid rgba(255, 255, 255, .22);
  border-bottom: 1px solid rgba(255, 255, 255, .12);
}

.hero .hero-proof div {
  color: rgba(255, 255, 255, .96) !important;
  font-size: 12px !important;
  font-weight: 800 !important;
}

.hero .hero-proof svg {
  color: #ffda27 !important;
}

.hero .hero-card {
  border-color: rgba(255, 211, 27, .76) !important;
  box-shadow: 0 30px 72px rgba(0, 0, 0, .48), 0 0 0 1px rgba(255, 211, 27, .12) !important;
}

.hero .hero-card-label {
  font-weight: 900 !important;
  box-shadow: 0 12px 26px rgba(255, 211, 27, .24) !important;
}

.hero .hero-price-value {
  color: #ffda27 !important;
  text-shadow: 0 8px 24px rgba(255, 211, 27, .16);
}

.hero .hero-card .button {
  width: 100%;
}

/* A leitura do hero fica mais direta: remove o elemento técnico sem valor comercial. */
.hero-techline {
  display: none !important;
}

/* Serviços: uma tabela de decisão, sem o peso visual de vários cards grandes. */
.services {
  position: relative;
  overflow: hidden;
  padding-top: clamp(64px, 8vw, 96px) !important;
  padding-bottom: clamp(68px, 8vw, 104px) !important;
  background:
    radial-gradient(circle at 88% 15%, rgba(217, 30, 54, .10), transparent 28%),
    linear-gradient(155deg, #fffdf9 0%, #f5efea 62%, #fffaf5 100%) !important;
}

.services::before {
  display: none !important;
}

.services .container,
.services .section-heading,
.services .services-grid {
  position: relative;
  z-index: 1;
}

.services .section-heading {
  align-items: end !important;
  gap: clamp(20px, 4vw, 52px) !important;
  margin-bottom: 20px !important;
  padding: 0 0 24px !important;
  color: #1b0b0e !important;
  background: transparent !important;
  border: 0 !important;
  border-bottom: 2px solid rgba(127, 15, 29, .18) !important;
  border-radius: 0 !important;
  box-shadow: none !important;
}

.services .section-heading h2,
.services .section-heading p {
  color: #211012 !important;
}

.services .section-heading h2 {
  max-width: 16ch;
  text-wrap: balance;
}

.services .section-kicker,
.services .diagnostic-pill {
  color: #bd1530 !important;
}

.nav-links a[href="#servicos"] {
  color: #fff !important;
  background: rgba(255, 211, 27, .14);
  border: 1px solid rgba(255, 211, 27, .55);
  border-radius: 999px;
  box-shadow: inset 0 0 0 1px rgba(255, 255, 255, .06);
  font-weight: 850 !important;
}

.services .diagnostic-pill {
  border-color: rgba(189, 21, 48, .25) !important;
  background: rgba(189, 21, 48, .06) !important;
}

.services .services-grid {
  display: grid !important;
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  gap: 0 !important;
  overflow: hidden;
  background: rgba(255, 255, 255, .82);
  border: 1px solid rgba(46, 13, 18, .15);
  border-radius: 16px;
  box-shadow: 0 18px 44px rgba(45, 8, 13, .08);
}

.services .service-card {
  min-height: 0 !important;
  padding: 18px 72px 18px 18px !important;
  overflow: visible !important;
  background: transparent !important;
  border: 0 !important;
  border-bottom: 1px solid rgba(46, 13, 18, .11) !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  transform: none !important;
}

.services .service-card h3,
.services .service-card p {
  color: #211012 !important;
}

.services .service-card::before,
.services .service-card::after,
.services .service-card .service-grid-overlay,
.services .service-card .service-status,
.services .service-card .service-index {
  display: none !important;
}

.services .service-card > :not(.service-link) {
  position: relative !important;
  z-index: 1 !important;
}

.services .service-card .service-icon {
  position: absolute;
  top: 50%;
  left: 18px;
  width: 42px;
  height: 42px;
  margin: 0 !important;
  color: #bb1831 !important;
  background: rgba(189, 21, 48, .08) !important;
  border: 1px solid rgba(189, 21, 48, .1) !important;
  border-radius: 11px !important;
  transform: translateY(-50%);
  box-shadow: none !important;
}

.services .service-card h3,
.services .service-card p {
  margin-left: 56px !important;
}

.services .service-card h3 {
  margin-top: 0 !important;
  font-size: 18px !important;
  line-height: 1.05 !important;
}

.services .service-card p {
  display: -webkit-box;
  margin-top: 5px !important;
  overflow: hidden;
  color: rgba(33, 16, 18, .66) !important;
  font-size: 12px !important;
  line-height: 1.35 !important;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
}

.services .service-card .service-link {
  position: absolute !important;
  top: 50%;
  right: 18px;
  bottom: auto !important;
  left: auto !important;
  z-index: 3;
  display: grid !important;
  width: 38px;
  height: 38px;
  min-height: 38px;
  padding: 0 !important;
  place-items: center;
  font-size: 0 !important;
  transform: translateY(-50%);
  transition: transform .2s ease, box-shadow .2s ease !important;
}

.services .service-card .service-link svg {
  width: 17px;
  height: 17px;
}

.services .service-card:hover {
  background: rgba(189, 21, 48, .035) !important;
  border-color: rgba(46, 13, 18, .11) !important;
  box-shadow: none !important;
}

.services .service-card:hover .service-link {
  transform: translateY(-50%) scale(1.06) !important;
}

/* A ação de serviço precisa ser legível em qualquer largura, não apenas um ícone solto. */
.services .service-card {
  padding-right: 164px !important;
}

.services .service-card .service-link {
  display: inline-flex !important;
  width: 128px;
  height: 42px;
  min-height: 42px;
  gap: 7px;
  justify-content: center;
  border-radius: 12px !important;
  font-family: var(--font-body), Arial, sans-serif;
  font-size: 10px !important;
  font-weight: 850;
  letter-spacing: .015em;
  text-transform: uppercase;
}

.services .service-card .service-link svg {
  flex: 0 0 auto;
  width: 16px;
  height: 16px;
}

/* As artes de pneus já incluem título e preço. Exibir a arte inteira evita texto duplicado e cortes. */
.offer-carousel .offer-slide-label,
.offer-carousel .offer-slide-price {
  display: none !important;
}

.offer-carousel .offer-tire-art {
  top: 0 !important;
  height: 100% !important;
  overflow: visible !important;
}

.offer-carousel .offer-tire-art img {
  width: 100% !important;
  height: 100% !important;
  max-width: none !important;
  max-height: none !important;
  object-fit: contain !important;
  transform: none !important;
}

/* CTAs secundários mantêm sua hierarquia e não recebem o verde do WhatsApp principal. */
.reviews-link,
.reviews-link:hover,
.reviews-link:focus-visible {
  padding: 0 0 6px !important;
  color: #bf1831 !important;
  background: transparent !important;
  border: 0 !important;
  border-bottom: 1px solid rgba(191, 24, 49, .42) !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  font-size: 13px !important;
  font-weight: 850 !important;
  text-decoration: none !important;
}

footer .footer-links a[href*="wa.me"],
footer .footer-links a[href*="api.whatsapp.com"],
footer .footer-links a[href*="web.whatsapp.com"] {
  display: inline !important;
  padding: 0 !important;
  color: rgba(255, 255, 255, .7) !important;
  background: transparent !important;
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  font: inherit !important;
  text-shadow: none !important;
}

@media (min-width: 561px) {
  /* Em desktop, o card retoma a coluna direita e os benefícios voltam ao ritmo original. */
  .hero .hero-proof {
    margin-top: 40px !important;
    padding: 26px 0 0 !important;
    border-top: 1px solid rgba(255, 255, 255, .15) !important;
    border-bottom: 0 !important;
  }

  .hero .hero-proof div {
    font-size: 11px !important;
  }

  .hero-inline-trust {
    display: none !important;
  }
}

/* O telefone fica acima do WhatsApp e mantém as duas ações sempre acessíveis. */
.floating-call {
  position: fixed;
  z-index: 26;
  right: 22px;
  bottom: 92px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 9px;
  min-height: 56px;
  padding: 0 19px;
  color: #fff;
  background: linear-gradient(135deg, #ed2c45, #bb102a);
  border: 1px solid rgba(255, 255, 255, .26);
  border-radius: 999px;
  font-family: var(--font-body), Arial, sans-serif;
  font-size: 12px;
  font-weight: 850;
  letter-spacing: .01em;
  text-decoration: none;
  box-shadow: 0 15px 40px rgba(118, 7, 23, .36);
  transition: transform .2s ease, box-shadow .2s ease;
}

.floating-call:hover {
  color: #fff;
  transform: translateY(-2px);
  box-shadow: 0 20px 44px rgba(118, 7, 23, .48);
}

.floating-call svg {
  width: 21px;
  height: 21px;
  fill: none;
  stroke: currentColor;
  stroke-width: 2;
  stroke-linecap: round;
  stroke-linejoin: round;
}

@media (max-width: 560px) {
  .hero .hero-media {
    opacity: .42 !important;
    object-position: 62% center !important;
    filter: saturate(.7) contrast(1.05) brightness(.76) !important;
  }

  .hero::before {
    background:
      radial-gradient(circle at 80% 12%, rgba(217, 30, 54, .16), transparent 42%),
      linear-gradient(180deg, rgba(17, 8, 10, .68) 0%, rgba(17, 8, 10, .82) 72%, rgba(12, 5, 7, .94) 100%) !important;
  }

  .hero .hero-content {
    width: calc(100% - 28px) !important;
    max-width: calc(100% - 28px) !important;
    min-width: 0 !important;
    margin-inline: auto !important;
    padding-block: 22px 28px !important;
    gap: 0 !important;
  }

  .hero .hero-copy,
  .hero .hero-actions {
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
  }

  .hero h1 {
    font-size: clamp(44px, 13.5vw, 52px) !important;
    line-height: .94 !important;
  }

  .hero .hero-copy > p {
    width: 100% !important;
    max-width: 100% !important;
    margin-top: 16px !important;
    overflow-wrap: break-word;
    font-size: 15px !important;
    line-height: 1.48 !important;
  }

  .hero .hero-card {
    max-width: none !important;
    margin: 14px 0 0 !important;
    padding: 18px 20px 17px !important;
    border-radius: 18px !important;
  }

  .hero .hero-card-label {
    right: 16px !important;
    padding: 7px 10px !important;
    font-size: 8px !important;
  }

  .hero .hero-card-kicker {
    font-size: 8px !important;
  }

  .hero .hero-price-prefix {
    font-size: 30px !important;
  }

  .hero .hero-price-value {
    gap: 5px !important;
    font-size: 48px !important;
  }

  .hero .hero-price-value > span {
    margin-top: 7px !important;
    font-size: 18px !important;
  }

  .hero .hero-card > p:not(.hero-card-kicker) {
    margin-top: 6px !important;
    overflow: hidden;
    font-size: 10px !important;
    line-height: 1.4 !important;
    text-overflow: ellipsis;
    white-space: nowrap;
  }

  .hero .hero-card-line,
  .hero .hero-card ul,
  .hero .hero-card small {
    display: none !important;
  }

  .hero .hero-card .button {
    display: none !important;
  }

  .hero .hero-actions {
    margin-top: 24px !important;
    gap: 10px !important;
  }

  .hero .hero-actions a[href*="wa.me"],
  .hero .hero-actions a[href*="api.whatsapp.com"],
  .hero .hero-actions a[href*="web.whatsapp.com"] {
    width: 100% !important;
    max-width: 100% !important;
    min-height: 58px;
    padding-inline: 14px !important;
    border-radius: 16px !important;
    font-size: 14px !important;
  }

  .hero .hero-actions .text-link {
    width: 100%;
    min-height: 50px;
    padding: 0 20px;
    justify-content: center;
    color: #fff !important;
    background: linear-gradient(135deg, #e8324a, #b80f29) !important;
    border: 1px solid rgba(255, 255, 255, .2) !important;
    border-radius: 14px;
    box-shadow: 0 14px 30px rgba(148, 9, 30, .3), inset 0 1px 0 rgba(255, 255, 255, .16);
    font-size: 14px !important;
    letter-spacing: .02em;
  }

  .hero .hero-actions a[href*="wa.me"]::after,
  .hero .hero-actions a[href*="api.whatsapp.com"]::after,
  .hero .hero-actions a[href*="web.whatsapp.com"]::after {
    display: none;
  }

  .hero .hero-proof {
    display: none !important;
  }

  .hero-inline-trust {
    margin-top: 12px;
    padding: 10px 0;
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 6px;
    border-top: 1px solid rgba(255, 255, 255, .16);
    border-bottom: 1px solid rgba(255, 255, 255, .11);
  }

  .hero-inline-trust span {
    display: grid;
    gap: 2px;
    text-align: center;
  }

  .hero-inline-trust strong {
    color: #ffda27;
    font-family: var(--font-display), Impact, sans-serif;
    font-size: 21px;
    line-height: .9;
  }

  .hero-inline-trust small {
    color: rgba(255, 255, 255, .72);
    font-family: var(--font-tech), monospace;
    font-size: 7px;
    font-weight: 800;
    letter-spacing: .05em;
    line-height: 1.25;
    text-transform: uppercase;
  }

  .trust-strip.is-inline-proof-source {
    display: none !important;
  }

  .services {
    padding-top: 56px !important;
    padding-bottom: 64px !important;
  }

  .services .section-heading {
    display: block !important;
    margin-bottom: 16px !important;
    padding-bottom: 18px !important;
  }

  .services .section-heading h2 {
    max-width: 11ch;
    font-size: 32px !important;
    line-height: .95 !important;
  }

  .services .section-heading-aside {
    display: none !important;
  }

  .services .services-grid {
    grid-template-columns: 1fr !important;
    border-radius: 13px;
  }

  .services .service-card {
    min-height: 76px !important;
    padding: 15px 128px 15px 15px !important;
  }

  .services .service-card .service-icon {
    left: 15px;
    width: 38px;
    height: 38px;
    border-radius: 10px !important;
  }

  .services .service-card h3,
  .services .service-card p {
    margin-left: 50px !important;
  }

  .services .service-card h3 {
    font-size: 16px !important;
  }

  .services .service-card p {
    -webkit-line-clamp: 1;
    font-size: 11px !important;
  }

  .services .service-card .service-link {
    right: 14px;
    display: inline-flex !important;
    width: 102px;
    height: 38px;
    min-height: 38px;
    gap: 6px;
    justify-content: center;
    border-radius: 12px !important;
    font-family: var(--font-body), Arial, sans-serif;
    font-size: 10px !important;
    font-weight: 850;
    letter-spacing: .015em;
    text-transform: uppercase;
  }

  .services .service-card .service-link svg {
    width: 15px;
    height: 15px;
  }

  .nav-links a[href="#servicos"] {
    border-radius: 6px;
  }

  .floating-call {
    right: 14px;
    bottom: 78px;
    width: 54px;
    height: 54px;
    min-height: 54px;
    padding: 0;
  }

  .floating-call span {
    display: none;
  }
}