/* Christ's College Hospitality design tokens.
   Generated from the design system's tokens.json (source: christscollegeconference theme).
   Fluid values scale in a straight line from a 767px viewport (min) to 1440px (max). */

@font-face {
  font-family: "Gantari";
  src: url("fonts/Gantari-Variable.woff2") format("woff2");
  font-weight: 100 900;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "Gantari";
  src: url("fonts/Gantari-Italic-Variable.woff2") format("woff2");
  font-weight: 100 900;
  font-style: italic;
  font-display: swap;
}

:root {
  --font-sans: "Gantari", sans-serif;
  --color-black: #000000;
  --color-white: #ffffff;
  --color-grey: #e5e5e5;
  --color-selection: #adcfe8;
  --color-bg: #ffffff;
  --color-bg-grey: #f3f3f3;
  --color-bg-blue: #f6f9fe;
  --color-primary: #133673;
  --color-accent: #c51a1b;
  --color-keyline: #dae4e7;
  --color-yellow: #fabb05;
  --color-font: #133673;
  --color-font-grey: #a9a9a9;
  --color-primary-hover: #113067;
  --color-accent-hover: #b11718;
  --color-icon: #bcbcbc;
  --color-error: #e80000;
  --overlay-top: rgba(0, 0, 0, 0.1);
  --overlay-bottom: rgba(0, 0, 0, 0.2);
  --overlay-top-mobile: rgba(0, 0, 0, 0.3);
  --overlay-bottom-mobile: rgba(0, 0, 0, 0.5);
  --focus-ring: var(--color-primary);
  --focus-ring-inverse: var(--color-white);
  --space-gutter: clamp(1.25rem, -0.8869rem + 4.4577vw, 3.125rem);
  --space-section: clamp(1.875rem, -2.3988rem + 8.9153vw, 5.625rem);
  --space-hero: clamp(1.875rem, -0.9742rem + 5.9435vw, 4.375rem);
  --space-grid: clamp(1.25rem, -0.8869rem + 4.4577vw, 3.125rem);
  --space-grid-wide: clamp(1.25rem, -2.3115rem + 7.4294vw, 4.375rem);
  --space-grid-tight: clamp(1.25rem, 0.5377rem + 1.4859vw, 1.875rem);
  --space-grid-gallery: clamp(0.9375rem, -0.1309rem + 2.2288vw, 1.875rem);
  --space-card: clamp(0.9375rem, -0.1309rem + 2.2288vw, 1.875rem);
  --space-panel: clamp(0.9375rem, -0.8432rem + 3.7147vw, 2.5rem);
  --space-text: clamp(1.25rem, 0.9651rem + 0.5944vw, 1.5rem);
  --space-section-header: clamp(1.25rem, -0.1746rem + 2.9718vw, 2.5rem);
  --space-header: clamp(1.25rem, 0.8226rem + 0.8915vw, 1.625rem);
  --space-footer: clamp(1.875rem, 0.4504rem + 2.9718vw, 3.125rem);
  --space-cta: clamp(1.875rem, 0.8066rem + 2.2288vw, 2.8125rem);
  --space-accordion: clamp(1.25rem, 0.5377rem + 1.4859vw, 1.875rem);
  --space-nav: clamp(0.9375rem, 0.2252rem + 1.4859vw, 1.5625rem);
  --space-button-y: clamp(0.625rem, 0.4113rem + 0.4458vw, 0.8125rem);
  --space-button-left: clamp(1.25rem, 0.5377rem + 1.4859vw, 1.875rem);
  --space-button-right: clamp(2.5rem, 1.7877rem + 1.4859vw, 3.125rem);
  --space-3: 3px;
  --space-5: 5px;
  --space-10: 10px;
  --space-12: 12px;
  --space-15: 15px;
  --space-20: 20px;
  --space-25: 25px;
  --space-30: 30px;
  --space-35: 35px;
  --space-50: 50px;
  --space-60: 60px;
  --container: 1410px;
  --container-thin: 1050px;
  --container-wide: 1700px;
  --logo-height: clamp(3.125rem, 2.0566rem + 2.2288vw, 4.0625rem);
  --footer-logo-height: clamp(2.5rem, 2.1439rem + 0.7429vw, 2.8125rem);
  --title-bar-width: 115px;
  --title-bar-height: 5px;
  --feature-height: clamp(18.75rem, 8.0656rem + 22.2883vw, 28.125rem);
  --carousel-arrow: 42px;
  --carousel-dot: 10px;
  --page-number: 35px;
  --burger: 40px;
  --bullet: clamp(0.3125rem, 0.17rem + 0.2972vw, 0.4375rem);
  --social-icon: 30px;
  --social-icon-footer: 35px;
  --highlight-image: 150px;
  --hero-logo: clamp(3.4375rem, 2.7252rem + 1.4859vw, 4.0625rem);
  --dropdown-width: 400px;
  --drawer-width: 456px;
  --radius-xs: 3px;
  --radius-sm: 4px;
  --radius-md: 5px;
  --radius-lg: 10px;
  --radius-full: 50%;
  --shadow-dropdown: 0px 5px 20px 0px rgba(0, 0, 0, 0.2);
  --shadow-drawer: 0px 0px 5px 0px rgba(0, 0, 0, 0.3);
  --opacity-disabled: 0.5;
  --opacity-underlay: 0.2;
  --z-dropdown: 5;
  --z-skip: 10;
  --z-carousel-arrow: 99;
  --z-header: 999;
  --z-underlay: 9998;
  --z-drawer: 9999;
}

/* Type styles: put these classes on text (the components do). */
.fontHeroTitle {
  font-family: var(--font-sans);
  font-size: clamp(2.1875rem, 0.4068rem + 3.7147vw, 3.75rem);
  line-height: 1;
  font-weight: 700;
}
.fontSectionTitle {
  font-family: var(--font-sans);
  font-size: clamp(1.875rem, 0.4504rem + 2.9718vw, 3.125rem);
  line-height: 1;
  font-weight: 700;
}
.fontHeader1 {
  font-family: var(--font-sans);
  font-size: clamp(1.875rem, 1.5189rem + 0.7429vw, 2.1875rem);
  line-height: 1.15;
  font-weight: 600;
}
.fontHeader2 {
  font-family: var(--font-sans);
  font-size: clamp(1.5625rem, 1.2064rem + 0.7429vw, 1.875rem);
  line-height: 1.25;
  font-weight: 600;
}
.fontHeader3 {
  font-family: var(--font-sans);
  font-size: clamp(1.3125rem, 0.9564rem + 0.7429vw, 1.625rem);
  line-height: 1.25;
  font-weight: 600;
}
.fontHeader4 {
  font-family: var(--font-sans);
  font-size: clamp(1.125rem, 0.6976rem + 0.8915vw, 1.5rem);
  line-height: 1.5;
  font-weight: 600;
}
.fontHeader5 {
  font-family: var(--font-sans);
  font-size: clamp(1.0625rem, 0.7064rem + 0.7429vw, 1.375rem);
  line-height: 1.5;
  font-weight: 600;
}
.fontHeader6 {
  font-family: var(--font-sans);
  font-size: clamp(1rem, 0.7151rem + 0.5944vw, 1.25rem);
  line-height: 1.5;
  font-weight: 600;
}
.fontBodyLarger {
  font-family: var(--font-sans);
  font-size: clamp(1.125rem, 0.6264rem + 1.0401vw, 1.5625rem);
  line-height: 1.5;
  font-weight: 400;
}
.fontBodyLarge {
  font-family: var(--font-sans);
  font-size: clamp(1.0625rem, 0.6351rem + 0.8915vw, 1.4375rem);
  line-height: 1.5;
  font-weight: 400;
}
.fontBodyRegular {
  font-family: var(--font-sans);
  font-size: clamp(1rem, 0.7151rem + 0.5944vw, 1.25rem);
  line-height: 1.5;
  font-weight: 400;
}
.fontBodySmall {
  font-family: var(--font-sans);
  font-size: clamp(0.9375rem, 0.7238rem + 0.4458vw, 1.125rem);
  line-height: 1.5;
  font-weight: 400;
}
.fontBodySmaller {
  font-family: var(--font-sans);
  font-size: clamp(0.875rem, 0.7325rem + 0.2972vw, 1rem);
  line-height: 1.5;
  font-weight: 400;
}
.fontQuote {
  font-family: var(--font-sans);
  font-size: clamp(1.3125rem, 0.9564rem + 0.7429vw, 1.625rem);
  line-height: 1.25;
  font-weight: 600;
  font-style: italic;
}
.fontTestimonial {
  font-family: var(--font-sans);
  font-size: clamp(1rem, 0.7151rem + 0.5944vw, 1.25rem);
  line-height: 1.4;
  font-weight: 400;
}
.fontButton {
  font-family: var(--font-sans);
  font-size: clamp(0.9375rem, 0.7238rem + 0.4458vw, 1.125rem);
  line-height: 1.5;
  font-weight: 600;
}
.fontNavigation {
  font-family: var(--font-sans);
  font-size: clamp(0.9375rem, 0.7238rem + 0.4458vw, 1.125rem);
  line-height: 1.5;
  font-weight: 600;
}
.fontNavigationSub {
  font-family: var(--font-sans);
  font-size: clamp(0.875rem, 0.7325rem + 0.2972vw, 1rem);
  line-height: 1.5;
  font-weight: 500;
}
.fontLabel {
  font-family: var(--font-sans);
  font-size: clamp(1rem, 0.7151rem + 0.5944vw, 1.25rem);
  line-height: 1.5;
  font-weight: 600;
}
.fontFooterHeading {
  font-family: var(--font-sans);
  font-size: clamp(0.875rem, 0.7325rem + 0.2972vw, 1rem);
  line-height: 1.5;
  font-weight: 500;
  text-transform: uppercase;
}
.fontCiteName {
  font-family: var(--font-sans);
  font-size: clamp(0.875rem, 0.7325rem + 0.2972vw, 1rem);
  line-height: 1;
  font-weight: 700;
  text-transform: uppercase;
}
