body .grid-3 {
  display: grid;
  gap: var(--grid-layout-gap);
  grid-template-columns: repeat(
    auto-fit,
    minmax(min(100%, var(--grid-item--min-width)), 1fr)
  );
}
@media screen and (min-width: 781px) {
  body .grid-3 {
    --gap-count: calc(var(--grid-column-count) - 1);
    --total-gap-width: calc(var(--gap-count) * var(--grid-layout-gap));
    --grid-item--max-width: calc(
      (100% - var(--total-gap-width)) / var(--grid-column-count)
    );
    grid-template-columns: repeat(
      auto-fill,
      minmax(max(var(--grid-item--min-width), var(--grid-item--max-width)), 1fr)
    );
  }
}
body .grid-3 {
  --grid-column-count: 3;
  --grid-item--min-width: 280px;
  --grid-layout-gap: 2rem;
}
:root,
.brxc-light-colors {
  --primary: hsla(30, 100%, 50%, 1);
  --primary-dark-shade: hsl(30, 100%, 10%);
  --white: #ffffff;
  --black: hsla(0, 0%, 0%, 1);
  --primary-light-bg: hsla(0, 100%, 97.1%, 1);
}
:root {
  --section: clamp(7rem, 6.4194rem + 1.6129vw, 9rem);
  --border: 3px solid #1061a3;
  --radius-max: clamp(1.6rem, 1.3677rem + 0.6452vw, 2.4rem);
  --radius-card: clamp(0.6rem, 0.4258rem + 0.4839vw, 1.2rem);
  --radius-btn: clamp(0.4rem, 0.2839rem + 0.3226vw, 0.8rem);
  --box-shadow: 0px 0px 20px #00000030;
  --one: clamp(2.8rem, 2.2774rem + 1.4516vw, 4.6rem);
  --sub-heading: clamp(1.6rem, 1.4839rem + 0.3226vw, 2rem);
  --text: clamp(1.5rem, 1.4129rem + 0.2419vw, 1.8rem);
  --section-headings: clamp(2.5rem, 2.2097rem + 0.8065vw, 3.5rem);
}
html[data-theme="dark"],
.brxc-dark-colors {
  --primary: #000000;
  --primary-dark-shade: hsl(30, 100%, 90%)
  --white: #000000;
  --black: #000000;
  --primary-light-bg: #000000;
}
