.ann-hero {
  padding: clamp(1.6rem, 4vw, 3.6rem);
  color: #fff;
  background: linear-gradient(135deg, #102a43, #146477 55%, #25a18e);
  border-radius: 1.5rem;
  box-shadow: 0 1.2rem 3rem rgba(16, 42, 67, .2);
}

.ann-card {
  border: 0;
  border-radius: 1.25rem;
  box-shadow: 0 .65rem 1.9rem rgba(31, 41, 55, .08);
}

.ann-stat { height: 100%; }

.ann-stat strong {
  color: #126b70;
  font-size: clamp(2rem, 4vw, 3rem);
}

.ann-label {
  color: #64748b;
  font-size: .76rem;
  font-weight: 700;
  letter-spacing: .08em;
  text-transform: uppercase;
}

.ann-chart {
  position: relative;
  height: 410px;
}

.ann-nav a { border-radius: 999px; }

.ann-compare-card {
  height: 100%;
  background: #fff;
  border: 1px solid #e2e8f0;
  border-radius: 1rem;
  transition: transform .2s ease, box-shadow .2s ease, border-color .2s ease;
}

.ann-compare-card:hover {
  border-color: #8ccfc4;
  box-shadow: 0 .8rem 1.8rem rgba(16, 42, 67, .1);
  transform: translateY(-3px);
}

.ann-compare-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 2.75rem;
  height: 2.75rem;
  color: #126b70;
  font-size: 1.25rem;
  background: #e6f6f3;
  border-radius: .8rem;
}

.ann-compare-card a::after { content: " \2192"; }

.ann-calc {
  overflow: hidden;
  background: linear-gradient(135deg, #fff 0%, #f0fbf8 100%);
  border: 1px solid #bfe7df;
}

.ann-calc-value {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 7rem;
  padding: .75rem 1.15rem;
  color: #fff;
  font-size: 2rem;
  font-weight: 800;
  background: #126b70;
  border-radius: 1rem;
  box-shadow: 0 .6rem 1.3rem rgba(18, 107, 112, .2);
}

@media (max-width: 767px) {
  .ann-chart { height: 320px; }
  .ann-hero { border-radius: 1rem; }
}