/* Clover Grid System — refreshed responsive foundation */
:root {
  --grid-breakpoint-xs: 480px;
  --grid-breakpoint-sm: 640px;
  --grid-breakpoint-md: 768px;
  --grid-breakpoint-lg: 992px;
  --grid-breakpoint-xl: 1280px;
  --grid-breakpoint-xxl: 1440px;

  --grid-container-padding: clamp(1rem, 4vw, 3.5rem);
  --grid-gap: clamp(1rem, 3vw, 3rem);
  --grid-gap-tight: clamp(0.75rem, 2vw, 1.5rem);
  --grid-gap-loose: clamp(1.5rem, 4vw, 4rem);

  --container-max-sm: 640px;
  --container-max-md: 768px;
  --container-max-lg: 1024px;
  --container-max-xl: 1200px;
  --container-max-xxl: 1360px;
}

*,
*::before,
*::after {
  box-sizing: border-box;
}

.flow-spacing > * + * {
  margin-top: var(--flow-space, 1.5rem);
}

._text-center {
  text-align: center !important;
}

.sr-only {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border: 0;
}

section {
  display: block;
}

._container {
  width: min(100%, var(--container-max-xxl));
  margin-inline: auto;
  padding-inline: var(--grid-container-padding);
}

@media (max-width: 1439px) {
  ._container {
    max-width: var(--container-max-xl);
  }
}

@media (max-width: 1199px) {
  ._container {
    max-width: var(--container-max-lg);
  }
}

@media (max-width: 991px) {
  ._container {
    max-width: var(--container-max-md);
  }
}

@media (max-width: 767px) {
  ._container {
    max-width: var(--container-max-sm);
  }
}

@media (max-width: 639px) {
  ._container {
    padding-inline: clamp(1rem, 5vw, 1.5rem);
  }
}

@media (max-width: 480px) {
  ._container {
    padding-inline: 1rem;
  }
  
  :root {
    --grid-container-padding: 1rem;
    --grid-gap: 1rem;
    --grid-gap-tight: 0.75rem;
    --grid-gap-loose: 1.5rem;
  }
}

._container[data-width="wide"] {
  max-width: min(100%, 1480px);
}

._container[data-width="narrow"] {
  max-width: min(100%, 960px);
}

._container[data-width="compact"] {
  max-width: min(100%, 760px);
}

._row {
  display: flex;
  flex-wrap: wrap;
  column-gap: var(--grid-gap);
  row-gap: var(--grid-gap);
}

._row[data-gap="tight"] {
  column-gap: var(--grid-gap-tight);
  row-gap: var(--grid-gap-tight);
}

._row[data-gap="loose"] {
  column-gap: var(--grid-gap-loose);
  row-gap: var(--grid-gap-loose);
}

._row[data-align="center"] {
  justify-content: center;
}

._row[data-align="between"] {
  justify-content: space-between;
}

._cl {
  width: 100%;
  min-width: 0;
}

._cl[data-align="center"] {
  margin-inline: auto;
}

@media (min-width: 768px) {
  ._cl-m-1 { flex: 0 0 calc(100% / 12); max-width: calc(100% / 12); }
  ._cl-m-2 { flex: 0 0 calc(100% * 2 / 12); max-width: calc(100% * 2 / 12); }
  ._cl-m-3 { flex: 0 0 calc(100% * 3 / 12); max-width: calc(100% * 3 / 12); }
  ._cl-m-4 { flex: 0 0 calc(100% * 4 / 12); max-width: calc(100% * 4 / 12); }
  ._cl-m-5 { flex: 0 0 calc(100% * 5 / 12); max-width: calc(100% * 5 / 12); }
  ._cl-m-6 { flex: 0 0 50%; max-width: 50%; }
  ._cl-m-7 { flex: 0 0 calc(100% * 7 / 12); max-width: calc(100% * 7 / 12); }
  ._cl-m-8 { flex: 0 0 calc(100% * 8 / 12); max-width: calc(100% * 8 / 12); }
  ._cl-m-9 { flex: 0 0 75%; max-width: 75%; }
  ._cl-m-10 { flex: 0 0 calc(100% * 10 / 12); max-width: calc(100% * 10 / 12); }
  ._cl-m-11 { flex: 0 0 calc(100% * 11 / 12); max-width: calc(100% * 11 / 12); }
  ._cl-m-12 { flex: 0 0 100%; max-width: 100%; }
}

@media (min-width: 992px) {
  ._cl-l-1 { flex: 0 0 calc(100% / 12); max-width: calc(100% / 12); }
  ._cl-l-2 { flex: 0 0 calc(100% * 2 / 12); max-width: calc(100% * 2 / 12); }
  ._cl-l-3 { flex: 0 0 25%; max-width: 25%; }
  ._cl-l-4 { flex: 0 0 calc(100% * 4 / 12); max-width: calc(100% * 4 / 12); }
  ._cl-l-5 { flex: 0 0 calc(100% * 5 / 12); max-width: calc(100% * 5 / 12); }
  ._cl-l-6 { flex: 0 0 50%; max-width: 50%; }
  ._cl-l-7 { flex: 0 0 calc(100% * 7 / 12); max-width: calc(100% * 7 / 12); }
  ._cl-l-8 { flex: 0 0 calc(100% * 8 / 12); max-width: calc(100% * 8 / 12); }
  ._cl-l-9 { flex: 0 0 75%; max-width: 75%; }
  ._cl-l-10 { flex: 0 0 calc(100% * 10 / 12); max-width: calc(100% * 10 / 12); }
  ._cl-l-11 { flex: 0 0 calc(100% * 11 / 12); max-width: calc(100% * 11 / 12); }
  ._cl-l-12 { flex: 0 0 100%; max-width: 100%; }
}

.order-l-1 { order: 1; }
.order-l-2 { order: 2; }
.order-l-3 { order: 3; }

@media (max-width: 991px) {
  .order-mob-1 { order: 1; }
  .order-mob-2 { order: 2; }
  .order-mob-3 { order: 3; }
}

._d-mn-l,
._d-mn-l-flex,
._d-mx-l,
._d-mx-l-flex,
._d-mn-m,
._d-mn-m-flex,
._d-mx-m,
._d-mx-m-flex {
  display: none !important;
}

@media (min-width: 992px) {
  ._d-mn-l { display: block !important; }
  ._d-mn-l-flex { display: flex !important; }
}

@media (max-width: 991px) {
  ._d-mx-l { display: block !important; }
  ._d-mx-l-flex { display: flex !important; }
}

@media (min-width: 768px) {
  ._d-mn-m { display: block !important; }
  ._d-mn-m-flex { display: flex !important; }
}

@media (max-width: 767px) {
  ._d-mx-m { display: block !important; }
  ._d-mx-m-flex { display: flex !important; }
}

img,
svg,
picture {
  display: block;
  max-width: 100%;
  height: auto;
}

svg {
  overflow: visible;
}

._section {
  padding-block: clamp(3.5rem, 8vw, 6.5rem);
}

._section[data-compact="true"] {
  padding-block: clamp(2rem, 6vw, 3.5rem);
}

._stack-xs { --flow-space: 0.75rem; }
._stack-sm { --flow-space: 1rem; }
._stack-md { --flow-space: 1.5rem; }
._stack-lg { --flow-space: 2.25rem; }
._stack-xl { --flow-space: 3rem; }