@import url('https://fonts.googleapis.com/css2?family=Playfair+Display:ital,wght@0,400;1,400&display=swap');

/* Gilroy — self-hosted, licensed. Regular (400) + Medium (500).
   Bold (700+) still synthesizes until Gilroy-Bold.woff2 is added. */
@font-face {
  font-family: 'Gilroy';
  src: url('../fonts/Gilroy-Regular.woff2') format('woff2');
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: 'Gilroy';
  src: url('../fonts/Gilroy-Medium.woff2') format('woff2');
  font-weight: 500;
  font-style: normal;
  font-display: swap;
}

:root {
  --bg:       #F2F2F2;
  --surface:  #EBEBEB;
  --ink:      #151515;
  --muted:    #404040;
  --inactive: #888888;
  --hairline: #DEDEDE;
  --light:    #F2F2F2;
  --dark-bg:  #1a1a1a;

  --font-display: 'Playfair Display', Georgia, serif;
  --font-ui: 'Gilroy', 'Gill Sans', 'Trebuchet MS', Arial, sans-serif;

  --space-2xs: 2px;
  --space-xs:  4px;
  --space-sm:  8px;
  --space-md:  16px;
  --space-lg:  24px;
  --space-xl:  32px;
  --space-2xl: 48px;
  --space-3xl: 64px;
  --space-4xl: 96px;

  --max-width:   1400px;
  --header-h:    64px;
  --section-px:  clamp(2rem, 6vw, 6rem);
  --section-py:  5rem;
  --photo-gap:   4px;

  --ease: cubic-bezier(0.16, 1, 0.3, 1);
  --dur-micro:  100ms;
  --dur-short:  250ms;
  --dur-medium: 400ms;
  --dur-long:   700ms;
  --dur-reveal: 900ms;

  --bp-sm:  600px;
  --bp-md:  900px;
  --bp-lg:  1200px;
  --bp-xl:  1600px;

  --z-base:   0;
  --z-header: 100;
  --z-modal:  1000;
  --z-cursor: 9999;
}