﻿:root {
  --breakpoint-xs: 0px;
  --breakpoint-sm: 640px;
  --breakpoint-md: 768px;
  --breakpoint-lg: 1024px;
  --breakpoint-xl: 1280px;
  --breakpoint-2xl: 1536px;

  --color-primary: #173F8A;
  --color-primary-dark: #0F2D68;
  --color-secondary: #F5B400;
  --color-secondary-dark: #D79A00;
  --color-accent: #E53935;

  --indy-color-ink: #111827;
  --indy-color-muted: #5B677A;
  --indy-color-subtle: #EEF3FA;
  --indy-color-surface: #FFFFFF;
  --indy-color-surface-soft: #F7FAFD;
  --indy-color-border: #D9E2EF;
  --indy-color-success: #168A4A;
  --indy-color-warning: #B77900;
  --indy-color-danger: var(--color-accent);
  --indy-color-focus: rgba(245, 180, 0, 0.38);

  --indy-font-sans: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  --indy-font-mono: "SFMono-Regular", Consolas, "Liberation Mono", monospace;

  --indy-space-1: 4px;
  --indy-space-2: 8px;
  --indy-space-3: 12px;
  --indy-space-4: 16px;
  --indy-space-5: 20px;
  --indy-space-6: 24px;
  --indy-space-8: 32px;
  --indy-space-10: 40px;
  --indy-space-12: 48px;
  --indy-space-16: 64px;

  --indy-radius-sm: 4px;
  --indy-radius-md: 8px;
  --indy-radius-lg: 12px;
  --indy-radius-xl: 16px;
  --indy-radius-pill: 999px;

  --indy-shadow-sm: 0 1px 2px rgba(17, 24, 39, 0.08);
  --indy-shadow-md: 0 12px 28px rgba(15, 45, 104, 0.12);
  --indy-shadow-lg: 0 22px 52px rgba(15, 45, 104, 0.18);

  --site-content-width: 1320px;
  --site-max-width: 1440px;
  --site-wide-width: 1600px;
  --site-full-width: 100vw;
  --site-narrow-width: 960px;
  --site-reading-width: 760px;
  --site-gutter-mobile: 16px;
  --site-gutter-tablet: 24px;
  --site-gutter-desktop: 32px;

  --indy-container: var(--site-content-width);
  --indy-container-wide: var(--site-wide-width);

  --indy-button-height-xs: 28px;
  --indy-button-height-sm: 34px;
  --indy-button-height-md: 42px;
  --indy-button-height-lg: 48px;
  --indy-button-height-xl: 56px;
  --indy-button-focus-ring: 0 0 0 3px var(--indy-color-focus);

  --icon-btn-bg: var(--indy-color-surface);
  --icon-btn-color: var(--color-primary-dark);
  --icon-btn-border: var(--indy-color-border);
  --icon-btn-hover-bg: var(--indy-color-subtle);
  --icon-btn-hover-color: var(--color-primary-dark);
  --icon-btn-hover-border: #B9C8DA;
  --icon-btn-active-bg: #DDE8F5;
  --icon-btn-active-color: var(--color-primary-dark);
  --icon-btn-active-border: #AFC0D5;
}

html,
body {
  max-width: 100%;
  overflow-x: hidden;
}

body {
  background: #FFFFFF;
}


.indy-container,
.indy-container-max,
.indy-container-wide,
.indy-container--wide,
.indy-container-full {
  width: min(100% - (var(--site-gutter-desktop) * 2), var(--site-content-width));
  margin-inline: auto;
}

.indy-container-max {
  width: min(100% - (var(--site-gutter-desktop) * 2), var(--site-max-width));
}

.indy-container-wide,
.indy-container--wide {
  width: min(100% - (var(--site-gutter-desktop) * 2), var(--site-wide-width));
}

.indy-container-full {
  width: 100%;
  max-width: none;
}

.indy-full-bleed {
  position: relative;
  width: 100vw;
  max-width: none;
  margin-left: calc(50% - 50vw);
  margin-right: calc(50% - 50vw);
}

.indy-hero-strip {
  display: grid;
  overflow: hidden;
  min-height: 420px;
  align-items: center;
  border-block: 1px solid rgba(217, 226, 239, 0.85);
  background:
    radial-gradient(circle at 82% 18%, rgba(245, 180, 0, 0.24), transparent 28rem),
    linear-gradient(135deg, var(--color-primary-dark), var(--color-primary));
  color: #FFFFFF;
}

.indy-campaign-grid {
  display: grid;
  grid-template-columns: minmax(0, 1.25fr) repeat(2, minmax(0, 0.875fr));
  gap: var(--indy-space-4);
}

.indy-section {
  padding: var(--indy-space-12) 0;
}

.indy-section--compact {
  padding: var(--indy-space-10) 0;
}

@media (min-width: 1280px) {
  .indy-section {
    padding: var(--indy-space-16) 0;
  }
}

@media (max-width: 1023px) {
  .indy-campaign-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 767px) {
  .indy-container,
  .indy-container-max,
  .indy-container-wide,
  .indy-container--wide {
    width: min(100% - (var(--site-gutter-tablet) * 2), var(--site-content-width));
  }

  .indy-section,
  .indy-section--compact {
    padding: var(--indy-space-8) 0;
  }

  .indy-hero-strip {
    min-height: auto;
  }

  .indy-campaign-grid {
    grid-template-columns: minmax(0, 1fr);
  }
}

@media (max-width: 479px) {
  .indy-container,
  .indy-container-max,
  .indy-container-wide,
  .indy-container--wide {
    width: min(100% - (var(--site-gutter-mobile) * 2), var(--site-content-width));
  }
}


