:root {
  --pe-primary: #307496;
  --pe-primary-dark: #1D5271;
  --pe-primary-mid: #28698B;
  --pe-accent: #4387A8;
  --pe-bg: #F5F6F7;
  --pe-surface: #FFFFFF;
  --pe-border: #E2E6E9;
  --pe-text: #1C2328;
  --pe-muted: #6B7C87;
}

.pe-card {
  background: var(--pe-surface);
  border: 1px solid var(--pe-border);
  border-radius: 18px;
  box-shadow: 0 12px 30px rgba(0,0,0,0.06);
}

.pe-pill {
  display: inline-flex;
  gap: .5rem;
  align-items: center;
  padding: .35rem .7rem;
  border: 1px solid var(--pe-border);
  background: #fff;
  border-radius: 999px;
  font-weight: 600;
  font-size: .9rem;
}

.pe-hero-title {
  letter-spacing: -0.02em;
}

.pe-section {
  padding-top: clamp(2.25rem, 3vw, 4.5rem);
  padding-bottom: clamp(2.25rem, 3vw, 4.5rem);
}

.pe-subtle-grid {
  background:
    radial-gradient(closest-side, rgba(48,116,150,.10), transparent 65%) 0 0/220px 220px,
    radial-gradient(closest-side, rgba(29,82,113,.08), transparent 65%) 110px 110px/220px 220px;
}

.pe-cta {
  background: linear-gradient(135deg, rgba(48,116,150,.18), rgba(67,135,168,.10));
  border: 1px solid var(--pe-border);
}

.pe-footnote {
  color: var(--pe-muted);
  font-size: .95rem;
}

.pe-kicker {
  text-transform: uppercase;
  letter-spacing: .12em;
  font-size: .78rem;
  font-weight: 700;
  color: var(--pe-primary-dark);
}