/* Section-specific theme for /agenter pages */
:root {
  --agenter-logo-filter: sepia(0.92) saturate(4.4) hue-rotate(118deg) brightness(1.02) contrast(0.95);
  --primary: #2e6f75;
  --primary-dim: #255a5f;
  --primary-container: #cbecef;
  --secondary: #5e5f88;
  --secondary-dim: #4b4c6f;
  --secondary-container: #e0e2ff;
  --tertiary: #3f6f58;
  --tertiary-dim: #335a47;
  --tertiary-container: #d7efe1;

  --on-primary: #f5feff;
  --on-primary-container: #1f5257;
  --on-secondary: #f6f7ff;
  --on-secondary-container: #3f4163;
  --on-tertiary: #f3fff8;
  --on-tertiary-container: #2d513f;

  --surface-tint: #2e6f75;
  --gradient-primary: linear-gradient(135deg, var(--primary), var(--primary-dim));
  --gradient-hero: linear-gradient(135deg, rgba(46, 111, 117, 0.14), rgba(37, 90, 95, 0.05));
}

body {
  background: linear-gradient(135deg, rgba(46, 111, 117, 0.08), rgba(126, 99, 181, 0.04)), var(--surface);
}

body::before {
  background:
    radial-gradient(circle at 20% 20%, rgba(255, 255, 255, 0.65), transparent 20%),
    radial-gradient(circle at 80% 0%, rgba(46, 111, 117, 0.07), transparent 28%),
    repeating-linear-gradient(0deg, rgba(45, 52, 51, 0.015) 0, rgba(45, 52, 51, 0.015) 1px, transparent 1px, transparent 5px);
}

@media (prefers-color-scheme: dark) {
  :root {
    --primary: #a9e3e9;
    --primary-dim: #7fc8cf;
    --primary-container: #24545a;
    --secondary: #c8c9ff;
    --secondary-dim: #a7a9de;
    --secondary-container: #434567;
    --tertiary: #b8e5cc;
    --tertiary-dim: #94c6ae;
    --tertiary-container: #335744;

    --on-primary: #063a3f;
    --on-primary-container: #d3f3f6;
    --on-secondary: #262946;
    --on-secondary-container: #ececff;
    --on-tertiary: #143a2b;
    --on-tertiary-container: #daf5e6;

    --surface-tint: #a9e3e9;
    --gradient-primary: linear-gradient(135deg, var(--primary), var(--primary-dim));
    --gradient-hero: linear-gradient(135deg, rgba(169, 227, 233, 0.15), rgba(127, 200, 207, 0.05));
  }
}

html.dark-mode {
  --primary: #a9e3e9;
  --primary-dim: #7fc8cf;
  --primary-container: #24545a;
  --secondary: #c8c9ff;
  --secondary-dim: #a7a9de;
  --secondary-container: #434567;
  --tertiary: #b8e5cc;
  --tertiary-dim: #94c6ae;
  --tertiary-container: #335744;

  --on-primary: #063a3f;
  --on-primary-container: #d3f3f6;
  --on-secondary: #262946;
  --on-secondary-container: #ececff;
  --on-tertiary: #143a2b;
  --on-tertiary-container: #daf5e6;

  --surface-tint: #a9e3e9;
  --gradient-primary: linear-gradient(135deg, var(--primary), var(--primary-dim));
  --gradient-hero: linear-gradient(135deg, rgba(169, 227, 233, 0.15), rgba(127, 200, 207, 0.05));
}

.agenter-section-logo {
  width: 9rem;
  height: auto;
  filter: var(--agenter-logo-filter);
  border: 2px solid #000;
  border-radius: 6px;
}

@media (max-width: 768px) {
  .agenter-section-logo {
    width: 7.2rem;
  }
}