/* ─── Reset & Base ─── */
*, *::before, *::after {
  box-sizing: border-box;
  margin: 0;
  padding: 0;
}

:root {
  --font-display: 'ES Rebond Grotesque', system-ui, sans-serif;
  --font-body: 'Geist Mono', 'Courier New', monospace;
  /* Swap this to test: 'Inter' / 'Figtree' / 'Plus Jakarta Sans' */
  --font-prose: 'CustomProse', system-ui, sans-serif;

  /* City colour palette (flat pastels from the map series) */
  --color-paris:      #B8CDE0;
  --color-ny:         #a2bcdf;
  --color-copenhagen: #F1F2F1;
  --color-tokyo:      #E87058;
  --color-london:     #D4A8A0;
  --color-bangkok:    #F0C832;
  --color-amsterdam:  #D4925A;
  --color-berlin:     #C8C0B0;
  --color-chicago:    #C4D4B8;
  --color-dubai:      #E8D4A0;
  --color-istanbul:   #a03232;
  --color-hong-kong:  #c1ddac;
  --color-miami:      #A8D8C8;
  --color-milan:      #E8D0B8;
  --color-prague:     #C8B8D4;
  --color-rome:       #E0C8A8;
  --color-vancouver:  #B8D4C8;

  /* Homepage default */
  --color-home: #e8c976;

  --color-text: #1A1A1A;
  --nav-width: 180px;
}

html {
  font-family: var(--font-body);
  font-size: 16px;
  color: var(--color-text);
  -webkit-font-smoothing: antialiased;
}

body {
  min-height: 100vh;
  transition: background-color 0.6s ease;
}

a {
  color: inherit;
  text-decoration: none;
}

/* ─── Self-hosted fonts ─── */
@font-face {
  font-family: 'ES Rebond Grotesque';
  src: url('/fonts/ESRebondGrotesque-Regular.woff2') format('woff2');
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}

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

@font-face {
  font-family: 'Plus Jakarta Sans';
  src: url('/fonts/PlusJakartaSans-Regular.woff2') format('woff2');
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: 'Plus Jakarta Sans';
  src: url('/fonts/PlusJakartaSans-SemiBold.woff2') format('woff2');
  font-weight: 600;
  font-style: normal;
  font-display: swap;
}

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

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

@font-face {
  font-family: 'Inter';
  src: url('/fonts/Inter-SemiBold.woff2') format('woff2');
  font-weight: 600;
  font-style: normal;
  font-display: swap;
}

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

@font-face {
  font-family: 'Figtree';
  src: url('/fonts/Figtree-SemiBold.woff2') format('woff2');
  font-weight: 600;
  font-style: normal;
  font-display: swap;
}