/* =========================================================
   UNIFRUTAS · VERSÃO 2 — home
   ========================================================= */

/* ---------- HERO (estrutura atual, modernizada) ---------- */
.hero {
  position: relative; isolation: isolate; overflow: hidden;
  min-height: 100vh; min-height: 100svh;
  display: flex; flex-direction: column; justify-content: center;
  background: #07130c; color: #fff;
}
.hero-video {
  position: absolute; inset: 0; z-index: -2;
  width: 100%; height: 100%; object-fit: cover;
  filter: brightness(1.55) saturate(1.1);
}
.hero::before {
  content: ""; position: absolute; inset: 0; z-index: -1;
  background:
    linear-gradient(90deg, rgba(4, 16, 9, .88) 0%, rgba(4, 16, 9, .55) 50%, rgba(4, 16, 9, .2) 100%),
    linear-gradient(0deg, rgba(4, 16, 9, .7), transparent 45%);
}
.hero-conteudo {
  display: flex; flex-direction: column; align-items: flex-start; gap: 26px;
  padding-top: calc(var(--nav-h) + 24px); padding-bottom: 110px;
}
.hero-conteudo > * { animation: sobe 1s var(--ease) backwards; }
.hero-conteudo > :nth-child(2) { animation-delay: .15s; }
.hero-conteudo > :nth-child(3) { animation-delay: .3s; }
.hero-titulo { font-size: clamp(42px, 6.4vw, 92px); line-height: .98; max-width: 15ch; }
.hero-marca { color: var(--sun); }
.hero-texto { font-size: clamp(17px, 1.45vw, 21px); line-height: 1.6; color: rgba(255, 255, 255, .86); max-width: 56ch; }
.hero-descer {
  position: absolute; left: 50%; bottom: 28px; translate: -50% 0;
  width: 52px; height: 52px; border-radius: 50%;
  display: grid; place-items: center;
  color: #fff; text-decoration: none; font-size: 18px;
  box-shadow: inset 0 0 0 1.5px rgba(255, 255, 255, .5);
  animation: flutua 2.4s ease-in-out infinite;
  transition: background-color .3s;
}
.hero-descer:hover { background: rgba(255, 255, 255, .14); }
@keyframes flutua { 50% { transform: translateY(6px); } }

/* ---------- QUEM SOMOS ---------- */
.sobre {
  position: relative; isolation: isolate; overflow: hidden;
  color: #fff;
  background: linear-gradient(170deg, var(--verde-marca) 0%, var(--accent) 100%);
}
@supports (background: linear-gradient(in oklab, red, blue)) {
  .sobre { background: linear-gradient(170deg in oklab, var(--verde-marca) 0%, var(--accent) 100%); }
}
.sobre::before {
  content: ""; position: absolute; inset: 0; z-index: -1;
  background:
    radial-gradient(55% 35% at 92% 8%, rgba(251, 176, 64, .38), transparent 70%),
    radial-gradient(45% 30% at 0% 55%, rgba(10, 42, 26, .35), transparent 70%);
}
.sobre-in { display: flex; flex-direction: column; gap: clamp(56px, 7vw, 100px); }
.sobre-bloco { display: grid; gap: 20px; }
.sobre-topo { display: grid; grid-template-columns: minmax(0, .85fr) minmax(0, 1.15fr); gap: 20px; align-items: stretch; }
.sobre-foto { position: relative; margin: 0; min-height: 520px; overflow: hidden; border-radius: 32px; box-shadow: 0 40px 70px -40px rgba(0, 0, 0, .65); }
.sobre-foto img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; object-position: 60% 35%; transition: transform 1.2s var(--ease); }
.sobre-foto:hover img { transform: scale(1.03); }
.sobre-foto figcaption {
  position: absolute; left: 16px; bottom: 16px;
  display: grid; padding: 9px 14px; border-radius: 14px;
  background: #fff; color: var(--ink); font-weight: 650; font-size: 15px; line-height: 1.25;
}
.sobre-foto small { font-family: var(--mono); font-size: 10.5px; font-weight: 500; letter-spacing: .08em; text-transform: uppercase; color: var(--muted); }
.sobre-card {
  display: grid; gap: 16px; align-content: center;
  padding: clamp(24px, 3vw, 40px);
  border-radius: 28px;
  background: rgba(6, 30, 17, .28);
  border: 1px solid rgba(255, 255, 255, .2);
  -webkit-backdrop-filter: blur(16px) saturate(1.2);
  backdrop-filter: blur(16px) saturate(1.2);
}
.sobre-lead { font-size: clamp(26px, 2.8vw, 38px); }
.sobre-card p { font-size: 16.5px; line-height: 1.75; color: rgba(255, 255, 255, .92); max-width: 66ch; }
.sobre-citacao {
  position: relative; margin: 0;
  padding: clamp(24px, 3vw, 36px) clamp(24px, 3vw, 40px) clamp(24px, 3vw, 36px) clamp(68px, 6vw, 92px);
  border-radius: 28px;
  background: rgba(255, 255, 255, .1);
  border: 1px solid rgba(255, 255, 255, .2);
}
.sobre-citacao::before {
  content: "“"; position: absolute; left: clamp(18px, 2vw, 28px); top: clamp(6px, 1vw, 12px);
  font-family: var(--display); font-weight: 800; font-size: clamp(84px, 8vw, 124px); line-height: 1;
  color: var(--sun);
}
.sobre-citacao p { font-family: var(--display); font-weight: 500; font-size: clamp(20px, 2.1vw, 30px); line-height: 1.4; letter-spacing: -0.015em; }
.sobre-botoes { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
.sobre-botoes .btn { width: 100%; }

.time { display: grid; justify-items: center; gap: 30px; }
.time-titulo { font-size: clamp(28px, 3vw, 40px); }
.time-card { position: relative; margin: 0; width: min(100%, 340px); }
.time-card img {
  width: 100%; height: auto; aspect-ratio: 3 / 4; object-fit: cover;
  border-radius: 200px 200px 28px 28px;
  box-shadow: 0 40px 70px -40px rgba(0, 0, 0, .65);
  transition: transform .7s var(--ease);
}
.time-card:hover img { transform: scale(1.02); }
.time-nome {
  position: absolute; right: -22px; bottom: 34px;
  display: grid; gap: 1px;
  padding: 12px 18px; border-radius: 16px;
  background: var(--deep); color: #fff; line-height: 1.25;
  transform: rotate(-3deg);
  box-shadow: 0 20px 40px -20px rgba(0, 0, 0, .6);
  transition: transform .45s var(--ease);
}
.time-card:hover .time-nome { transform: rotate(0) translateY(-4px); }
.time-nome b { font-family: var(--display); font-weight: 750; font-size: 21px; letter-spacing: -0.02em; }
.time-nome span { font-size: 14px; }
.time-nome small { font-family: var(--mono); font-size: 10.5px; letter-spacing: .06em; text-transform: uppercase; color: var(--sun); margin-top: 3px; }

.dados { display: grid; grid-template-columns: repeat(3, 1fr); border-top: 1px solid rgba(255, 255, 255, .3); }
.dado { display: flex; flex-direction: column; align-items: center; gap: 4px; padding-top: 30px; text-align: center; }
.dado + .dado { border-left: 1px solid rgba(255, 255, 255, .3); }
.dado-mais { font-family: var(--mono); font-size: 12px; letter-spacing: .1em; text-transform: uppercase; opacity: .85; }
.dado-num { font-family: var(--display); font-weight: 800; font-size: clamp(60px, 7.5vw, 110px); line-height: .95; letter-spacing: -0.045em; font-variant-numeric: tabular-nums; }
.dado-rotulo { font-weight: 650; font-size: 17px; }

@media (max-width: 860px) {
  .sobre-topo { grid-template-columns: 1fr; }
  .sobre-foto { min-height: 0; aspect-ratio: 4 / 5; }
  .time-nome { right: 10px; }
  .dados { grid-template-columns: 1fr; }
  .dado { padding-block: 24px; }
  .dado + .dado { border-left: 0; border-top: 1px solid rgba(255, 255, 255, .3); }
}

@media (max-width: 560px) { .sobre-botoes { grid-template-columns: 1fr; } }

/* ---------- GALERIA (carrossel contínuo acima da Temporada) ---------- */
.galeria { position: relative; overflow: hidden; background: var(--deep); padding-block: clamp(28px, 4vw, 48px); }
.galeria::before, .galeria::after { content: ""; position: absolute; top: 0; bottom: 0; z-index: 2; width: clamp(24px, 6vw, 96px); pointer-events: none; }
.galeria::before { left: 0; background: linear-gradient(90deg, var(--deep), transparent); }
.galeria::after { right: 0; background: linear-gradient(-90deg, var(--deep), transparent); }
/* o movimento é feito pelo main.js (loop infinito sem reinício) */
.galeria-trilho { display: flex; gap: 14px; width: max-content; will-change: transform; backface-visibility: hidden; }
.galeria-lista { display: flex; gap: 14px; margin: 0; padding: 0; list-style: none; }
.galeria-lista li { flex: none; height: clamp(160px, 19vw, 270px); }
.galeria-lista img { height: 100%; width: auto; object-fit: cover; border-radius: 18px; box-shadow: 0 24px 40px -28px rgba(0, 0, 0, .7); transition: transform .5s var(--ease); }
.galeria-lista li:hover img { transform: scale(1.03); }
@media (prefers-reduced-motion: reduce) {
  .galeria { overflow-x: auto; }
  .galeria-trilho { transform: none !important; }
  .galeria-lista[aria-hidden="true"] { display: none; }
}

/* ---------- TEMPORADA ---------- */
.temporada { position: relative; overflow: hidden; background: var(--tint); }
.temporada::before {
  content: ""; position: absolute; pointer-events: none;
  width: min(80vw, 980px); aspect-ratio: 1; border-radius: 50%;
  right: -22%; top: -38%;
  background: radial-gradient(circle, rgba(251, 176, 64, .42), transparent 64%);
}
.temp-cabeca { position: relative; display: grid; gap: 14px; margin-bottom: clamp(32px, 4vw, 52px); }
.temp-lista { position: relative; display: grid; gap: 20px; }
.temp-lista.is-varias { grid-template-columns: repeat(auto-fit, minmax(min(100%, 540px), 1fr)); }
.temp-lista.is-muitas { grid-template-columns: repeat(auto-fit, minmax(min(100%, 340px), 1fr)); }
.is-muitas .temp-card { padding: 24px; }
.is-muitas .temp-arte { width: min(100%, 260px); }
.is-muitas .temp-info h3 { font-size: 30px; }
.is-muitas .temp-desc, .is-muitas .temp-attrs { display: none; }
.temp-card {
  --fruit: var(--accent);
  container-type: inline-size;
  padding: clamp(22px, 3vw, 44px);
  border-radius: 34px;
  background: var(--surface);
  box-shadow: 0 1px 0 var(--line), 0 40px 80px -60px rgba(15, 58, 37, .55);
}
.temp-in { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: clamp(24px, 5cqw, 64px); align-items: center; }
.temp-info { display: grid; gap: 16px; justify-items: start; }
.temp-arte { position: relative; width: min(100%, 360px); aspect-ratio: 1.3; }
.temp-arte::before {
  content: ""; position: absolute; inset: 4% 17%; border-radius: 50%;
  background: radial-gradient(circle at 35% 30%, color-mix(in oklab, var(--fruit) 35%, var(--sun)), var(--fruit) 88%);
}
.temp-arte img { position: relative; width: 100%; height: 100%; object-fit: contain; animation: boia 7s ease-in-out infinite; filter: drop-shadow(0 26px 24px rgba(0, 0, 0, .22)); }
.temp-info h3 { font-size: clamp(34px, 6cqw, 60px); }
.temp-attrs { margin: 0; width: 100%; }
.temp-attrs div { display: grid; grid-template-columns: 7.5em 1fr; gap: 12px; padding: 11px 0; border-top: 1px solid var(--line); }
.temp-attrs dt { font-weight: 700; }
.temp-attrs dd { margin: 0; color: var(--muted); }
.temp-desc { color: var(--muted); max-width: 58ch; }
.temp-cal { display: grid; gap: 12px; padding: clamp(18px, 3cqw, 30px); border-radius: 26px; background: var(--bg); }
.temp-cal-topo { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 10px; }
@container (max-width: 760px) {
  .temp-in { grid-template-columns: 1fr; }
  .temp-attrs div { grid-template-columns: 1fr; gap: 2px; }
}

/* outras temporadas */
.temp-outras-cabeca { position: relative; display: flex; flex-wrap: wrap; align-items: end; justify-content: space-between; gap: 8px 24px; margin: clamp(44px, 5vw, 72px) 0 18px; }
.temp-outras-cabeca h3 { font-size: clamp(26px, 2.6vw, 36px); }
.temp-outras-cabeca p { color: var(--muted); max-width: 52ch; }
.temp-outras { position: relative; display: grid; grid-template-columns: repeat(auto-fill, minmax(min(100%, 300px), 1fr)); gap: 12px; }
.temp-outra {
  --fruit: var(--accent);
  --fruit-escura: color-mix(in oklab, var(--fruit) 70%, #1d0700);
  display: grid; grid-template-columns: 80px minmax(0, 1fr); align-items: center; gap: 14px 16px;
  padding: 16px; border-radius: 26px;
  background: var(--surface); text-decoration: none;
  box-shadow: 0 1px 0 var(--line);
  transition: transform .4s var(--ease), box-shadow .4s;
}
.temp-outra:hover { transform: translateY(-4px); box-shadow: 0 1px 0 var(--line), 0 28px 46px -32px rgba(15, 58, 37, .5); }
.temp-outra-arte { width: 80px; height: 80px; border-radius: 20px; display: grid; place-items: center; background: color-mix(in oklab, var(--fruit) 18%, #fff); }
.temp-outra-arte img { width: 64px; height: 64px; object-fit: contain; transition: transform .6s var(--ease); }
.temp-outra:hover .temp-outra-arte img { transform: rotate(-10deg) scale(1.08); }
.temp-outra-info { display: grid; gap: 2px; }
.temp-outra-info .eyebrow { font-size: 11px; color: var(--fruit-escura); }
.temp-outra-info b { font-family: var(--display); font-weight: 750; font-size: 21px; letter-spacing: -0.02em; line-height: 1.1; }
.temp-outra-pico { margin-top: 2px; font-size: 14.5px; font-weight: 650; }
.temp-outra-status { font-size: 13.5px; color: var(--muted); }
.mini-cal {
  grid-column: 1 / -1;
  display: grid; grid-template-columns: repeat(12, 1fr); grid-template-rows: 1fr; align-items: end; gap: 3px;
  height: 48px; padding-top: 12px; border-top: 1px solid var(--line);
}
.mini-cal i { display: block; height: calc(var(--lv) * 25%); border-radius: 3px 3px 1px 1px; background: color-mix(in oklab, var(--fruit) 24%, #fff); }
.mini-cal i[data-nivel="3"] { background: color-mix(in oklab, var(--fruit) 55%, #fff); }
.mini-cal i[data-nivel="4"] { background: var(--fruit); }
.mini-cal i.is-agora { box-shadow: 0 0 0 1.5px var(--surface), 0 0 0 3px var(--ink); }

/* ---------- PRODUTOS (zigue-zague atual, fundos modernizados) ---------- */
.produtos { background: var(--bg); }
.prod-cabeca { display: grid; gap: 14px; margin-bottom: clamp(32px, 4vw, 56px); }
.prod-lista { display: grid; gap: 18px; }
.prod {
  --fruit: #E84E1B;
  --fruit-2: #FBB040;
  --fruit-escura: color-mix(in oklab, var(--fruit) 70%, #1d0700);
  position: relative; isolation: isolate; overflow: hidden;
  display: grid; grid-template-columns: minmax(0, 1.1fr) minmax(0, .9fr); align-items: center;
  gap: clamp(20px, 4vw, 56px);
  min-height: clamp(340px, 34vw, 450px);
  padding: clamp(28px, 5vw, 72px);
  border-radius: 38px;
}
.prod::after {
  content: ""; position: absolute; inset: 0; z-index: -1; pointer-events: none;
  opacity: .22; mix-blend-mode: soft-light;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='180' height='180'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
}
.prod--cor {
  color: #fff;
  background:
    radial-gradient(85% 120% at 88% 50%, color-mix(in oklab, var(--fruit-2) 80%, transparent) 0%, transparent 60%),
    linear-gradient(100deg, var(--fruit-escura) 0%, var(--fruit) 58%, color-mix(in oklab, var(--fruit) 55%, var(--fruit-2)) 100%);
}
.prod--claro {
  color: var(--ink);
  background:
    radial-gradient(75% 110% at 16% 50%, color-mix(in oklab, var(--fruit) 22%, #fff) 0%, transparent 62%),
    linear-gradient(120deg, color-mix(in oklab, var(--fruit) 5%, #fff), color-mix(in oklab, var(--fruit) 13%, #fff));
  box-shadow: inset 0 0 0 1px color-mix(in oklab, var(--fruit) 16%, #fff);
}
.prod--inv { grid-template-columns: minmax(0, .9fr) minmax(0, 1.1fr); }
.prod--inv .prod-arte { order: -1; }
.prod-texto { display: grid; justify-items: start; gap: 16px; max-width: 580px; }
.prod--inv .prod-texto { justify-self: end; }
.prod h3 { font-size: clamp(36px, 4.6vw, 64px); }
.prod p { font-size: 16.5px; line-height: 1.7; max-width: 56ch; }
.prod--cor .eyebrow { color: rgba(255, 255, 255, .85); }
.prod--cor p { color: rgba(255, 255, 255, .92); }
.prod--claro h3, .prod--claro .eyebrow { color: var(--fruit-escura); }
.prod--claro p { color: var(--muted); }
.btn--fruta { background: var(--fruit-escura); color: #fff; }
.btn--fruta:hover { box-shadow: 0 14px 30px -14px var(--fruit-escura); }

.prod-arte { position: relative; justify-self: center; display: grid; place-items: center; width: min(100%, 430px); aspect-ratio: 1; }
.prod-arte::before {
  content: ""; position: absolute; inset: 0; border-radius: 50%;
  background: repeating-radial-gradient(circle, transparent 0 36px, rgba(255, 255, 255, .2) 36px 37px);
  -webkit-mask-image: radial-gradient(circle, #000 45%, transparent 71%);
  mask-image: radial-gradient(circle, #000 45%, transparent 71%);
  transition: transform 1.4s var(--ease);
}
.prod--claro .prod-arte::before { background: repeating-radial-gradient(circle, transparent 0 36px, color-mix(in oklab, var(--fruit) 26%, transparent) 36px 37px); }
.prod-arte::after {
  content: ""; position: absolute; inset: 20%; border-radius: 50%;
  background: rgba(255, 255, 255, .28); filter: blur(34px);
}
.prod--claro .prod-arte::after { background: color-mix(in oklab, var(--fruit) 30%, transparent); }
.prod-arte img {
  position: relative; z-index: 1; width: 76%; height: auto; object-fit: contain;
  filter: drop-shadow(0 30px 28px rgba(0, 0, 0, .25));
  transition: transform .9s var(--ease);
}
.prod:hover .prod-arte img { transform: rotate(-7deg) scale(1.06); }
.prod:hover .prod-arte::before { transform: scale(1.1); }
@media (max-width: 820px) {
  .prod, .prod--inv { grid-template-columns: 1fr; }
  .prod-arte, .prod--inv .prod-arte { order: -1; width: min(78%, 320px); }
  .prod--inv .prod-texto { justify-self: start; }
}

/* ---------- LOGÍSTICA ---------- */
.logistica { background: var(--surface); }
.log-grade { display: grid; grid-template-columns: minmax(0, 1.45fr) minmax(0, .7fr); gap: clamp(32px, 5vw, 80px); align-items: center; }
.log-texto { display: grid; gap: 16px; }
.trilha { list-style: none; margin: 26px 0 0; padding: 0; display: grid; grid-template-columns: repeat(5, 1fr); position: relative; }
.trilha::before { content: ""; position: absolute; top: 28px; left: 10%; right: 10%; height: 2px; background: var(--line); }
.trilha-linha { position: absolute; top: 28px; left: 10%; height: 2px; width: calc(80% * var(--p, 0)); background: var(--accent); transition: width .7s var(--ease); }
.trilha li { display: flex; justify-content: center; }
.trilha button {
  position: relative; z-index: 1;
  display: flex; flex-direction: column; align-items: center; gap: 10px;
  padding: 0 4px; border: 0; background: transparent; cursor: pointer;
  font-size: 14.5px; font-weight: 650; line-height: 1.25; text-align: center; color: var(--muted);
}
.trilha-ponto {
  width: 56px; height: 56px; border-radius: 50%;
  display: grid; place-items: center;
  background: var(--surface); box-shadow: inset 0 0 0 2px var(--line);
  transition: background-color .4s, box-shadow .4s, color .4s, transform .4s var(--ease);
}
.trilha-ponto svg { width: 25px; height: 25px; fill: none; stroke: currentColor; stroke-width: 1.6; stroke-linecap: round; stroke-linejoin: round; }
.trilha button:hover .trilha-ponto { transform: scale(1.06); }
.trilha button.is-feito { color: var(--ink); }
.trilha button.is-feito .trilha-ponto { box-shadow: inset 0 0 0 2px var(--accent); color: var(--accent-ink); }
.trilha button[aria-selected="true"] { color: var(--ink); }
.trilha button[aria-selected="true"] .trilha-ponto { background: var(--accent); color: #fff; box-shadow: 0 14px 26px -12px var(--accent); transform: scale(1.12); }
.trilha-detalhe { display: grid; gap: 8px; min-height: 176px; margin-top: 12px; padding: 24px 28px; border-radius: 26px; background: var(--bg); }
.trilha-detalhe h3 { font-size: clamp(22px, 2.2vw, 30px); }
.trilha-detalhe p { color: var(--muted); max-width: 64ch; }
.trilha-detalhe.is-troca > * { animation: sobe .5s var(--ease) backwards; }
.trilha-detalhe.is-troca > :nth-child(2) { animation-delay: .06s; }
.trilha-detalhe.is-troca > :nth-child(3) { animation-delay: .12s; }
.log-fatos { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: 8px; }
.log-fatos li { padding: .45em .9em; border-radius: 999px; background: var(--tint); font-family: var(--mono); font-size: 13px; }
.celular {
  position: relative; justify-self: center;
  width: min(100%, 290px); aspect-ratio: 9 / 17.5;
  padding: 10px; border-radius: 42px;
  background: #0b0b0b;
  box-shadow: 0 50px 80px -40px rgba(15, 58, 37, .6), inset 0 0 0 1px #333;
}
.celular::before { content: ""; position: absolute; z-index: 2; top: 20px; left: 50%; translate: -50% 0; width: 76px; height: 20px; border-radius: 12px; background: #0b0b0b; }
.celular-tela { width: 100%; height: 100%; overflow: hidden; border-radius: 33px; background: #111; }
/* amplia a partir da base para esconder a marca d'água do CapCut no topo do vídeo */
.celular video { width: 100%; height: 100%; object-fit: cover; transform: scale(1.14); transform-origin: 50% 100%; }
@media (max-width: 900px) {
  .log-grade { grid-template-columns: 1fr; }
  .celular { width: 250px; }
}
@media (max-width: 640px) {
  .trilha { grid-template-columns: 1fr; gap: 8px; }
  .trilha::before { top: 28px; bottom: 28px; left: 27px; right: auto; width: 2px; height: auto; }
  .trilha-linha { top: 28px; left: 27px; width: 2px; height: calc((100% - 56px) * var(--p, 0)); transition: height .7s var(--ease); }
  .trilha li { justify-content: flex-start; }
  .trilha button { flex-direction: row; gap: 14px; font-size: 16px; text-align: left; }
}

/* ---------- GARANTIAS ---------- */
.garantias { background: var(--bg); }
.gar-grade { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.25fr); gap: clamp(28px, 5vw, 72px); align-items: center; }
.gar-texto { display: grid; gap: 18px; justify-items: start; }
.selos { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; }
.selo {
  display: grid; gap: 10px; align-content: start;
  padding: 18px; border-radius: 26px;
  background: var(--surface); box-shadow: inset 0 0 0 1px var(--line);
  text-decoration: none;
  transition: transform .4s var(--ease), box-shadow .4s;
}
.selo:hover { transform: translateY(-5px); box-shadow: inset 0 0 0 1px var(--line), 0 30px 50px -34px rgba(15, 58, 37, .5); }
.selo-logo { display: grid; place-items: center; height: 150px; padding: 14px; border-radius: 18px; background: #fff; box-shadow: inset 0 0 0 1px var(--line); }
.selo-logo img { max-height: 118px; width: auto; transition: transform .5s var(--ease); }
.selo:hover .selo-logo img { transform: scale(1.05); }
.selo b { font-family: var(--display); font-weight: 750; font-size: 22px; letter-spacing: -0.02em; }
.selo-texto { font-size: 15px; line-height: 1.5; color: var(--muted); }
@media (max-width: 860px) { .gar-grade { grid-template-columns: 1fr; } }
@media (max-width: 480px) { .selos { grid-template-columns: 1fr; } }

/* ---------- CONTATO ---------- */
.contato { position: relative; isolation: isolate; overflow: hidden; background: #07130c; color: #fff; }
.contato-fundo {
  position: absolute; inset: 0; z-index: -2;
  background: url("../assets/localizacao-banner.png") center / cover;
  animation: aproxima 24s ease-in-out infinite alternate;
}
@keyframes aproxima { from { transform: scale(1.12); } to { transform: scale(1); } }
.contato::before {
  content: ""; position: absolute; inset: 0; z-index: -1;
  background:
    linear-gradient(90deg, rgba(4, 16, 9, .93) 0%, rgba(4, 16, 9, .78) 50%, rgba(4, 16, 9, .6) 100%),
    linear-gradient(0deg, rgba(4, 16, 9, .85), transparent 50%);
}
.contato-grade { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.1fr); gap: clamp(28px, 4vw, 64px); align-items: center; }
.contato-texto { display: grid; gap: 22px; justify-items: start; }
.contato-texto .eyebrow { color: var(--sun); }
.contato-texto h2 { font-size: clamp(40px, 5.6vw, 80px); max-width: 13ch; }
.contato-texto p { font-size: clamp(16px, 1.4vw, 19px); color: rgba(255, 255, 255, .84); max-width: 46ch; }

.contato-mapa { position: relative; }
.mapa { width: 100%; height: auto; overflow: visible; }
.mapa-base { opacity: .22; }
.rota-base { fill: none; stroke: rgba(251, 176, 64, .28); stroke-width: 3; }
.rota { fill: none; stroke: var(--sun); stroke-width: 4; stroke-linecap: round; stroke-dasharray: 4 14; animation: rota 1.3s linear infinite; }
@keyframes rota { to { stroke-dashoffset: -36; } }
.carga { fill: #fff; filter: drop-shadow(0 0 8px rgba(251, 176, 64, .9)); }
.pino-nucleo { fill: var(--sun); stroke: #07130c; stroke-width: 3; }
.pino--origem .pino-nucleo { fill: var(--accent); }
.pino-onda { fill: none; stroke: var(--sun); stroke-width: 3; transform-box: fill-box; transform-origin: center; animation: onda 2.4s var(--ease) infinite; }
.pino--origem .pino-onda { stroke: var(--accent); }
@keyframes onda { from { transform: scale(.7); opacity: .9; } to { transform: scale(3.2); opacity: 0; } }
.mapa-rotulo {
  font-family: var(--mono); font-size: 26px; font-weight: 500; letter-spacing: .04em;
  fill: #fff; paint-order: stroke; stroke: rgba(4, 16, 9, .85); stroke-width: 8px; stroke-linejoin: round;
}

.contato-linha { display: grid; grid-template-columns: repeat(3, 1fr); margin-top: clamp(44px, 5vw, 72px); border-top: 1px solid rgba(255, 255, 255, .2); }
.contato-item { display: grid; gap: 3px; padding: 20px 20px 0 0; text-decoration: none; }
.contato-item small { font-family: var(--mono); font-size: 11px; letter-spacing: .08em; text-transform: uppercase; color: rgba(255, 255, 255, .6); }
.contato-item b { font-weight: 600; font-size: 16px; word-break: break-word; transition: color .25s; }
a.contato-item:hover b { color: var(--sun); }
@media (max-width: 900px) {
  .contato-grade { grid-template-columns: 1fr; }
  .contato-mapa { max-width: 600px; }
  .contato-linha { grid-template-columns: 1fr; }
}
