:root {
  color-scheme: light;
}

html {
  scroll-behavior: smooth;
}

body {
  font-family: "Manrope", sans-serif;
  background: #faf6ee;
  color: #3f5563;
}

.hero-grid {
  background-image:
    linear-gradient(rgba(55, 95, 118, 0.07) 1px, transparent 1px),
    linear-gradient(90deg, rgba(55, 95, 118, 0.07) 1px, transparent 1px);
  background-size: 42px 42px;
  mask-image: linear-gradient(180deg, rgba(0, 0, 0, 0.45), transparent);
}

.glass-panel {
  backdrop-filter: blur(8px);
  background: rgba(255, 255, 255, 0.88);
}

.tab-button[data-active="true"] {
  background: #5ea79d;
  color: #ffffff;
  border-color: #5ea79d;
}

.associate-logo {
  background:
    radial-gradient(circle at 30% 20%, rgba(255, 255, 255, 0.85), transparent 30%),
    linear-gradient(135deg, var(--logo-a), var(--logo-b));
}

.brand-mark {
  border: 1px solid rgba(55, 95, 118, 0.18);
}

.brand-logo {
  display: block;
}