/* ----------------------------------------------------------------------------
   miguelmoura.pt — base styles
   Fonts + palette carried over from the Miguel Moura Creative Studios site.
---------------------------------------------------------------------------- */

@font-face {
  font-family: "Clash Display";
  src: url("../assets/fonts/ClashDisplay-Regular.woff2") format("woff2");
  font-weight: 400;
  font-display: swap;
}
@font-face {
  font-family: "Clash Display";
  src: url("../assets/fonts/ClashDisplay-Medium.woff2") format("woff2");
  font-weight: 500;
  font-display: swap;
}
@font-face {
  font-family: "Clash Display";
  src: url("../assets/fonts/ClashDisplay-Semibold.woff2") format("woff2");
  font-weight: 600;
  font-display: swap;
}
@font-face {
  font-family: "Bricolage";
  src: url("../assets/fonts/BricolageGrotesque-Variable.woff2") format("woff2");
  font-weight: 200 800;
  font-display: swap;
}
:root {
  --bg: #050505;
  --bg-alt: #0a0a09;
  --surface: #0d0d0c;
  --bone: #f2eee6;
  --muted: #9a958c;
  --muted-dark: #5d594f;
  --border: #1c1c1c;

  --font-body: "Bricolage", system-ui, sans-serif;
  --font-display: "Clash Display", sans-serif;
}

* {
  box-sizing: border-box;
}

html {
  scroll-behavior: smooth;
}

html,
body {
  margin: 0;
  padding: 0;
  background: var(--bg);
}

body {
  font-family: var(--font-body);
  color: var(--bone);
  overflow-x: hidden;
  -webkit-font-smoothing: antialiased;
}

a {
  color: var(--bone);
  text-decoration: none;
}

a:hover {
  color: var(--muted);
}

::selection {
  background: var(--bone);
  color: var(--bg);
}
