/* ============================================================
   TRAFEGOBI · PÁGINAS INSTITUCIONAIS
   Hero de página, conteúdo legal, contato.
   ============================================================ */

/* ── Hero de página ───────────────────────────────────────────── */
.page-hero {
  position: relative;
  padding-top: calc(var(--nav-h) + clamp(2.5rem, 6vw, 4.5rem));
  padding-bottom: clamp(2rem, 5vw, 3rem);
  text-align: center;
  overflow: hidden;
}
.page-hero__orb { position: absolute; width: 26rem; height: 26rem; border-radius: 50%; filter: blur(80px); top: -10rem; left: 50%; transform: translateX(-50%); background: rgba(0,229,160,0.1); z-index: -1; pointer-events: none; }
.page-hero__title { font-size: var(--fs-4xl); letter-spacing: -0.03em; margin-block: var(--sp-4) var(--sp-4); }
.page-hero__sub { color: var(--text-2); font-size: var(--fs-lg); max-width: 56ch; margin-inline: auto; }

/* ── Conteúdo legal (prosa) ───────────────────────────────────── */
.prose { max-width: var(--container-sm); margin-inline: auto; }
.prose__meta { font-size: var(--fs-sm); color: var(--text-3); margin-bottom: var(--sp-6); padding-bottom: var(--sp-4); border-bottom: 1px solid var(--line); }
.prose h2 { font-size: var(--fs-xl); margin-block: var(--sp-6) var(--sp-3); font-family: var(--font-sans); font-weight: 700; letter-spacing: -0.01em; }
.prose h2:first-child { margin-top: 0; }
.prose h3 { font-size: var(--fs-md); margin-block: var(--sp-4) var(--sp-2); color: var(--text); font-weight: 700; }
.prose p { color: var(--text-2); margin-bottom: var(--sp-3); line-height: var(--lh-normal); }
.prose ul { display: flex; flex-direction: column; gap: var(--sp-2); margin-bottom: var(--sp-4); }
.prose li { color: var(--text-2); padding-left: var(--sp-5); position: relative; line-height: var(--lh-normal); }
.prose li::before { content: ''; position: absolute; left: 4px; top: 0.65em; width: 6px; height: 6px; border-radius: 50%; background: var(--brand); }
.prose a { color: var(--brand); }
.prose a:hover { text-decoration: underline; }
.prose strong { color: var(--text); }

/* ── Contato ──────────────────────────────────────────────────── */
.contact-grid { display: grid; grid-template-columns: 0.9fr 1.1fr; gap: clamp(2rem, 5vw, 4rem); align-items: start; max-width: var(--container-md); margin-inline: auto; }
.contact-methods { display: flex; flex-direction: column; gap: var(--sp-3); }
.contact-method {
  display: flex; align-items: center; gap: var(--sp-4);
  background: var(--surface); border: 1px solid var(--line); border-radius: var(--r-md);
  padding: var(--sp-4); transition: border-color var(--t-base) var(--ease), transform var(--t-base) var(--ease);
}
.contact-method:hover { border-color: var(--line-2); transform: translateY(-2px); }
.contact-method__icon { width: 44px; height: 44px; flex-shrink: 0; border-radius: var(--r-sm); display: grid; place-items: center; background: rgba(0,229,160,0.1); color: var(--brand); border: 1px solid rgba(0,229,160,0.2); }
.contact-method__icon svg { width: 20px; height: 20px; }
.contact-method__label { font-size: var(--fs-xs); color: var(--text-3); }
.contact-method__value { font-weight: 600; font-size: var(--fs-sm); }

/* ── Comparativo de planos (na página /planos) ────────────────── */
.plan-note { text-align: center; color: var(--text-3); font-size: var(--fs-sm); margin-top: var(--sp-6); }

/* ── Responsivo ───────────────────────────────────────────────── */
@media (max-width: 760px) {
  .contact-grid { grid-template-columns: 1fr; }
}