/* Design Tokens + Grid + Utilities */
@import url("https://fonts.googleapis.com/css2?family=Manrope:wght@400;600;700;800&family=Inter:wght@300;400;500;600&display=swap");

:root {
  --primary: #00666e; --primary-container: #00818a; --on-primary: #fff;
  --on-primary-container: #f5feff; --secondary: #506071;
  --secondary-container: #d1e1f6; --on-secondary: #fff;
  --on-secondary-container: #546475; --on-secondary-fixed: #0c1d2b;
  --tertiary: #8d4a19; --tertiary-container: #ab622f; --on-tertiary: #fff;
  --surface: #f7f9fe; --surface-dim: #d7dadf;
  --surface-container-lowest: #fff; --surface-container-low: #f1f4f9;
  --surface-container: #ebeef3; --surface-container-high: #e5e8ed;
  --surface-container-highest: #dfe3e8;
  --on-background: #181c20; --on-surface: #181c20; --on-surface-variant: #3d494a;
  --outline: #6d797a; --outline-variant: #bdc9ca;
  --primary-fixed: #8cf2fd; --primary-fixed-dim: #6fd6e0;
  --inverse-surface: #2d3135; --inverse-on-surface: #eef1f6;
  --error: #ba1a1a; --error-container: #ffdad6; --on-error: #fff;
  --font-headline: "Manrope", system-ui, sans-serif;
  --font-body: "Inter", system-ui, sans-serif;
  --space-1: 0.25rem; --space-2: 0.5rem; --space-4: 1rem; --space-6: 1.5rem;
  --space-8: 2rem; --space-12: 3rem; --space-16: 4rem; --space-20: 5rem; --space-24: 6rem;
  --radius-sm: 0.125rem; --radius-md: 0.375rem; --radius-lg: 0.5rem; --radius-xl: 0.75rem;
  --shadow-sm: 0 2px 8px rgba(24,28,32,0.03);
  --shadow-md: 0 10px 30px rgba(24,28,32,0.04);
  --shadow-lg: 0 20px 40px rgba(24,28,32,0.06);
  --transition-fast: 0.12s ease; --transition-base: 0.16s ease; --transition-slow: 0.24s ease;
  --gradient-primary: linear-gradient(135deg, var(--primary), var(--primary-container));
  --gradient-cta: linear-gradient(135deg, var(--on-secondary-fixed), #1a3045);
}
@media (prefers-reduced-motion: reduce) { *, *::before, *::after { animation-duration: 0.01ms !important; transition-duration: 0.01ms !important; scroll-behavior: auto !important; } }

/* Grid */
*, *::before, *::after { box-sizing: border-box; }
.container { width: 100%; max-width: 1200px; padding: 0 var(--space-8); margin: 0 auto; }
.row { display: flex; flex-wrap: wrap; margin: 0 -15px; }
[class*="col-"] { position: relative; width: 100%; padding: 0 15px; }
.col-3 { flex: 0 0 25%; max-width: 25%; }
@media (min-width: 576px) { .col-sm-6 { flex: 0 0 50%; max-width: 50%; } .col-sm-12 { flex: 0 0 100%; max-width: 100%; } }
@media (min-width: 768px) { .col-md-3 { flex: 0 0 25%; max-width: 25%; } .col-md-4 { flex: 0 0 calc(100%/3); max-width: calc(100%/3); } .col-md-6 { flex: 0 0 50%; max-width: 50%; } .col-md-8 { flex: 0 0 66.667%; max-width: 66.667%; } .col-md-9 { flex: 0 0 75%; max-width: 75%; } .col-md-12 { flex: 0 0 100%; max-width: 100%; } }
@media (min-width: 992px) { .col-lg-3 { flex: 0 0 25%; max-width: 25%; } .col-lg-4 { flex: 0 0 calc(100%/3); max-width: calc(100%/3); } .col-lg-5 { flex: 0 0 41.667%; max-width: 41.667%; } .col-lg-6 { flex: 0 0 50%; max-width: 50%; } .col-lg-7 { flex: 0 0 58.333%; max-width: 58.333%; } .col-lg-8 { flex: 0 0 66.667%; max-width: 66.667%; } .col-lg-9 { flex: 0 0 75%; max-width: 75%; } .offset-lg-1 { margin-left: 8.333%; } .offset-lg-2 { margin-left: 16.667%; } }

/* Utilities */
.d-flex { display: flex !important; } .align-items-center { align-items: center !important; } .justify-content-center { justify-content: center !important; }
.me-auto { margin-right: auto !important; } .ms-auto { margin-left: auto !important; }
.text-center { text-align: center !important; } .text-left { text-align: left !important; } .text-right { text-align: right !important; }
.mb-0 { margin-bottom: 0 !important; } .mb-30 { margin-bottom: 30px !important; } .pl-0 { padding-left: 0 !important; }
.img-fluid { max-width: 100%; height: auto; } .list-unstyled { padding-left: 0; list-style: none; margin-bottom: 0; }