@charset "UTF-8";

/* @font-face {
    font-family: 'Liberation Mono';
    src: url('../fonts/LiberationMono-Regular.woff2') format('woff2');
    font-weight: 400;
    font-style: normal;
    font-display: swap;
} */

:root {
  /* BRAND */
  --brand-primary:   #c85a8a;
  --brand-primary-dark: #a94873;
  --brand-secondary: #c85a8a;
  --brand-accent:    #1a1a1a;
  --brand-white:     #ffffff;
  --brand-black:     #111111;
  --brand-grey:      #f5f5f5;

  /* TYPOGRAPHY */
  --font-heading: "Roboto Mono", monospace;
  --font-body:    "Roboto Mono", monospace;
  --font-buttons: "Roboto Mono", monospace;

  /* UI */
  --text-main:  #cdcdcd;
  --text-light: #ffffff;
  --text-muted: #999999;
  --bg-body:    #111111;
  --bg-light:   #1a1a1a;

  /* COMPONENTS */
  --input-border: #333333;
  --input-height: 50px;
  --btn-radius: 0px;

  /* Border radius */
  --radius-sm: 5px;
  --radius-md: 0px;
  --radius-lg: 0px;
  --radius-xl: 0px;

  /* Shadows */
  --shadow-sm: none;
  --shadow-md: none;
  --shadow-lg: none;

  /* RESPONSIVE SPACING */
  --section-gap: clamp(40px, 5vw, 100px);
  --section-gap-sm: calc(var(--section-gap) / 2);

  /* LAYOUT SPACING */
  --container-gutter: 1.5rem;
  --container-gutter-mobile: 3rem;

  /* HEADER / FOOTER */
  --header-bg: var(--brand-black);
  --footer-bg: var(--brand-black);

  /* TRANSITIONS */
  --transition-fast: 150ms ease;
  --transition-base: 300ms ease;
}

@media (min-width: 992px) {
  :root {
    --section-gap: clamp(40px, 10vw, 180px);
    --section-gap-sm: calc(var(--section-gap) / 2);
  }
}