:root {
  --bci-primary: #0b7a3e;
  --bci-primary-hover: #086533;
  --bci-primary-soft: #eef8f2;
  --bci-dark: #202020;
  --bci-text: #3f4348;
  --bci-muted: #70757c;
  --bci-border: #e1e4e8;
  --bci-surface: #ffffff;
  --bci-surface-soft: #f3f6f7;
  --bci-font-family: "Montserrat", Arial, Helvetica, sans-serif;
  --bci-font-base: 16px;
  --bci-font-small: 14px;
  --bci-font-xs: 12px;
  --bci-shell: 1360px;
  --bci-gutter: 30px;
  --bci-gutter-mobile: 16px;
  --bci-radius-sm: 6px;
  --bci-radius-md: 10px;
  --bci-transition: 180ms ease;
}

html {
  scroll-behavior: smooth;
}

body {
  color: var(--bci-text);
  background: var(--bci-surface);
  font-family: var(--bci-font-family);
  font-size: var(--bci-font-base);
  font-weight: 400;
  line-height: 1.55;
}

button,
input,
select,
textarea {
  font-family: inherit;
  font-weight: 400;
}

strong,
b {
  font-weight: 700;
}

.bci-shell {
  box-sizing: border-box;
  width: min(100%, var(--bci-shell));
  max-width: var(--bci-shell);
  margin-inline: auto;
  padding-inline: var(--bci-gutter);
}

@media (max-width: 767px) {
  .bci-shell {
    padding-inline: var(--bci-gutter-mobile);
  }
}
