/* sanctuary · brand type — Hank Grotesk first, Manrope web fallback
   Lululemon-adjacent geometric grotesk. No serif display face. */
@import url('https://fonts.googleapis.com/css2?family=Manrope:wght@300;400;500;600;700&display=swap');

@font-face{
  font-family:'Hank Grotesk';
  src:local('Hank Grotesk'),local('HankGrotesk'),local('Hank Grotesk Regular');
  font-weight:400;font-style:normal;font-display:swap;
}
@font-face{
  font-family:'Hank Grotesk';
  src:local('Hank Grotesk Light'),local('HankGrotesk-Light');
  font-weight:300;font-style:normal;font-display:swap;
}
@font-face{
  font-family:'Hank Grotesk';
  src:local('Hank Grotesk Medium'),local('HankGrotesk-Medium');
  font-weight:500;font-style:normal;font-display:swap;
}
@font-face{
  font-family:'Hank Grotesk';
  src:local('Hank Grotesk SemiBold'),local('HankGrotesk-SemiBold');
  font-weight:600;font-style:normal;font-display:swap;
}

:root{
  --font-brand:'Hank Grotesk','Manrope',system-ui,-apple-system,sans-serif;
  --sans:var(--font-brand);
  --display:var(--font-brand);
  --serif:var(--font-brand);
  --font-weight-light:300;
  --font-weight-regular:400;
  --font-weight-medium:500;
  --font-weight-semibold:600;
  --tracking-tight:-.025em;
  --tracking-brand:.14em;
  --tracking-label:.18em;
}

html,body{
  font-family:var(--font-brand);
  font-weight:var(--font-weight-light);
  letter-spacing:-.005em;
  -webkit-font-smoothing:antialiased;
  -moz-osx-font-smoothing:grayscale;
  text-rendering:optimizeLegibility;
}

h1,h2,h3,h4,.display,.brand,.hero-brand,.hero h1,.ob-brand,.ob-headline,
.nav-brand-text,.nav-overlay-brand span,.page-hero h1,.cinema-title,.cinema-prompt{
  font-family:var(--font-brand)!important;
  font-style:normal!important;
}