.section { padding-block: clamp(42px, 5.2vw, 70px); }

.section h2 {
  font-size: clamp(31px, 4.05vw, 52px);
  line-height: 1.1;
  letter-spacing: -.04em;
}

.hero {
  position: relative;
  min-height: clamp(445px, 47.65vw, 670px);
  isolation: isolate;
  overflow: hidden;
  background: var(--navy);
  color: #fff;
}

.hero-picture, .hero::after {
  position: absolute;
  z-index: -1;
  inset: 0;
}

.hero::after {
  background: linear-gradient(90deg, #0a1d30ed 0%, #0b2034cd 23%, #0b203464 48%, #10233212 77%);
  content: "";
}

.hero-photo {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: 61% 53%;
}

.hero-inner { padding-block: clamp(63px, 7.2vw, 115px) 125px; }

/* Herói SEM o painel de rastreio sobreposto (15/11/2026, pedido do dono: rastreio e cotação
   saíram do ar por enquanto). A regra de cima reserva 125px embaixo para o painel que encosta
   nele; sem o painel esse espaço vira um vazio. Modificador à parte para a volta do painel ser
   só tirar a classe do <section>. */
.hero--sem-painel .hero-inner { padding-block: clamp(63px, 7.2vw, 115px); }
.hero--sem-painel + .section { padding-top: clamp(42px, 5.2vw, 70px); }

.hero h1 {
  max-width: 850px;
  font-size: clamp(47px, 5.7vw, 87px);
  line-height: .99;
  letter-spacing: -.04em;
  text-shadow: 0 1px 3px #1226384d;
}

.hero p {
  max-width: 32ch;
  margin-top: 18px;
  font-size: clamp(19px, 2.2vw, 30px);
  line-height: 1.28;
  letter-spacing: -.025em;
}

.hero-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 10px 12px;
  margin-top: 24px;
}

.hero-actions .button:focus-visible { outline-color: #fff; }

.tracking-panel {
  position: relative;
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  align-items: center;
  gap: clamp(15px, 2.65vw, 34px);
  min-height: 100px;
  margin-top: -57px;
  padding: 22px clamp(17px, 2.6vw, 32px);
  border: 1px solid #e6edf3;
  border-radius: 12px;
  background: #fff;
  box-shadow: 0 9px 25px #16355021;
}

.tracking-label {
  display: flex;
  align-items: center;
  gap: 15px;
  min-height: 48px;
  padding-right: clamp(14px, 2.3vw, 30px);
  border-right: 1px solid #b3beca;
}

.tracking-label h2 {
  font-size: clamp(21px, 2.5vw, 32px);
  line-height: 1.13;
  letter-spacing: -.045em;
}

.scan-icon {
  position: relative;
  display: inline-block;
  flex: 0 0 31px;
  height: 31px;
  border: 2px solid var(--navy);
  border-radius: 4px;
}

.scan-icon::before, .scan-icon::after, .scan-icon span {
  position: absolute;
  background: #fff;
  content: "";
}
.scan-icon::before { inset: -3px 7px; }
.scan-icon::after { inset: 7px -3px; }
.scan-icon span { z-index: 1; inset: 13px -1px auto; height: 1.5px; background: var(--navy); }

.tracking-form {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 13px;
}

.tracking-form input {
  min-width: 0;
  min-height: 49px;
  padding: 7px 14px;
  border: 1px solid #a0aeba;
  border-radius: 6px;
  background: #f6f8fa;
  color: var(--ink);
  font-size: 16px;
}

.tracking-form input::placeholder { color: #515e6d; }
.tracking-form .button { min-width: 122px; }

.services { scroll-margin-top: 20px; }
.services h2 { margin-bottom: 24px; }

.service-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: clamp(14px, 1.7vw, 24px);
}

.service-card {
  overflow: hidden;
  display: flex;
  flex-flow: column;
  border: 1px solid var(--border);
  border-radius: 8px;
  background: var(--paper);
}

.service-card img {
  width: 100%;
  height: auto;
  aspect-ratio: 1.63;
  object-fit: cover;
  object-position: center 47%;
  background: var(--tint);
}

.service-copy {
  display: flex;
  flex: 1;
  flex-direction: column;
  align-items: flex-start;
  padding: 15px 17px 17px;
}

.service-copy h3 {
  font-size: clamp(19px, 2.1vw, 26px);
  line-height: 1.17;
  letter-spacing: -.035em;
}

.service-copy p { margin: 6px 0 12px; color: var(--muted); }
.service-copy .text-link { margin-top: auto; font-size: 14px; }

.operation { background: var(--tint); }

.operation-top {
  display: grid;
  grid-template-columns: minmax(0, 0.76fr) minmax(0, 1fr);
  gap: clamp(20px, 4vw, 63px);
  align-items: center;
}

.operation-top p, .coverage p {
  margin-top: 10px;
  color: var(--muted);
  font-size: clamp(16px, 1.65vw, 20px);
}

.route {
  min-width: 0;
  padding: 19px clamp(14px, 2.2vw, 27px) 23px;
  border-radius: 9px;
  background: #fff;
}

.route h3 { font-size: 17px; }

.route-line {
  display: flex;
  align-items: center;
  gap: clamp(9px, 1.6vw, 21px);
  margin-top: 13px;
}

.route-line > span:not(.route-track) {
  display: flex;
  gap: 3px 8px;
  align-items: baseline;
  flex-wrap: wrap;
  font-size: clamp(16px, 2.15vw, 25px);
  font-weight: 700;
  line-height: 1.12;
}

.route-line strong { color: var(--teal-hover); font-size: .82em; font-weight: 400; }

.route-track {
  display: flex;
  flex: 1;
  align-items: center;
  min-width: 39px;
  gap: 8px;
  color: var(--teal-hover);
}

.route-track::before, .route-track::after {
  flex: 1;
  height: 1.5px;
  content: "";
  background: var(--teal);
}

.route-plane {
  flex: 0 0 39px;
  height: 31px;
  background: var(--navy);
  clip-path: polygon(100% 49%, 94% 43%, 63% 43%, 38% 3%, 28% 3%, 42% 43%, 18% 43%, 9% 28%, 2% 28%, 7% 49%, 2% 70%, 9% 70%, 18% 56%, 42% 56%, 28% 96%, 38% 96%, 63% 56%, 94% 56%);
}

.operation-steps {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 17px 26px;
  list-style: none;
  margin-top: 29px;
  padding: 0;
}

.operation-steps li { padding: 12px 4px 0 0; border-top: 2px solid #9bbfb9; }
.operation-steps h3 { font-size: 17px; line-height: 1.25; }
.operation-steps p { margin-top: 4px; color: var(--muted); font-size: 15px; }

.coverage {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 18px 30px;
}

.coverage p { max-width: 560px; }
.coverage-actions { display: flex; flex-wrap: wrap; gap: 9px 10px; flex-shrink: 0; }

@media (max-width: 900px) {
  .coverage { align-items: flex-start; flex-direction: column; }
}

@media (max-width: 700px) {
  .hero { min-height: clamp(437px, 73vw, 550px); }
  .hero-photo { object-position: 56% center; }
  .hero::after { background: linear-gradient(90deg, #0b2034e9, #0b203479 78%, #0b203445); }
  .hero-inner { padding-top: 66px; padding-bottom: 143px; }
  .hero--sem-painel .hero-inner { padding-bottom: 66px; }
  .hero h1 { font-size: clamp(40px, 9.8vw, 62px); }
  .button-lg { min-height: 45px; padding-inline: 13px; font-size: 14px; }

  .tracking-panel { grid-template-columns: 1fr; gap: 11px; margin-top: -69px; padding: 15px; }
  .tracking-label { min-height: 25px; padding-right: 0; border-right: 0; }
  .scan-icon { flex-basis: 25px; height: 25px; }
  .scan-icon span { top: 10px; }
  .tracking-form { gap: 8px; }
  .tracking-form .button { min-width: 0; padding-inline: 13px; }
  .tracking-form input { min-height: 46px; padding-inline: 9px; }

  .operation-top { grid-template-columns: 1fr; gap: 19px; }
  .operation-steps { grid-template-columns: repeat(2, minmax(0, 1fr)); margin-top: 21px; }
}

@media (max-width: 640px) {
  .service-grid { grid-template-columns: 1fr; }
  .service-copy { padding: 13px 15px 15px; }
  .service-card img { aspect-ratio: 1.8; }
}

@media (max-width: 360px) {
  .hero h1 { font-size: 36px; }
  .route-plane { flex-basis: 31px; height: 26px; }
}
