/**
 * Public site typography & design tokens
 * Edit fonts and sizes here — other public CSS files use var(...) from :root.
 *
 * Title → Borna | Body → Gilroy (self-hosted in wwwroot/assets/public/fonts/)
 */

/* ─── Borna ─── */
@font-face {
  font-family: "Borna";
  src: url("../fonts/borna-medium-webfont.woff2") format("woff2");
  font-weight: 500;
  font-style: normal;
  font-display: swap;
}

/* ─── Gilroy ─── */
@font-face {
  font-family: "Gilroy";
  src: url("../fonts/Gilroy-Thin.woff2") format("woff2");
  font-weight: 100;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "Gilroy";
  src: url("../fonts/Gilroy-ThinItalic.woff2") format("woff2");
  font-weight: 100;
  font-style: italic;
  font-display: swap;
}
@font-face {
  font-family: "Gilroy";
  src: url("../fonts/Gilroy-UltraLight.woff2") format("woff2");
  font-weight: 200;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "Gilroy";
  src: url("../fonts/Gilroy-UltraLightItalic.woff2") format("woff2");
  font-weight: 200;
  font-style: italic;
  font-display: swap;
}
@font-face {
  font-family: "Gilroy";
  src: url("../fonts/Gilroy-Light.woff2") format("woff2");
  font-weight: 300;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "Gilroy";
  src: url("../fonts/Gilroy-LightItalic.woff2") format("woff2");
  font-weight: 300;
  font-style: italic;
  font-display: swap;
}
@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-RegularItalic.woff2") format("woff2");
  font-weight: 400;
  font-style: italic;
  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;
}
@font-face {
  font-family: "Gilroy";
  src: url("../fonts/Gilroy-MediumItalic.woff2") format("woff2");
  font-weight: 500;
  font-style: italic;
  font-display: swap;
}
@font-face {
  font-family: "Gilroy";
  src: url("../fonts/Gilroy-Semibold.woff2") format("woff2");
  font-weight: 600;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "Gilroy";
  src: url("../fonts/Gilroy-SemiboldItalic.woff2") format("woff2");
  font-weight: 600;
  font-style: italic;
  font-display: swap;
}
@font-face {
  font-family: "Gilroy";
  src: url("../fonts/Gilroy-Bold.woff2") format("woff2");
  font-weight: 700;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "Gilroy";
  src: url("../fonts/Gilroy-BoldItalic.woff2") format("woff2");
  font-weight: 700;
  font-style: italic;
  font-display: swap;
}
@font-face {
  font-family: "Gilroy";
  src: url("../fonts/Gilroy-Extrabold.woff2") format("woff2");
  font-weight: 800;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "Gilroy";
  src: url("../fonts/Gilroy-ExtraboldItalic.woff2") format("woff2");
  font-weight: 800;
  font-style: italic;
  font-display: swap;
}
@font-face {
  font-family: "Gilroy";
  src: url("../fonts/Gilroy-Heavy.woff2") format("woff2");
  font-weight: 900;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "Gilroy";
  src: url("../fonts/Gilroy-HeavyItalic.woff2") format("woff2");
  font-weight: 900;
  font-style: italic;
  font-display: swap;
}
@font-face {
  font-family: "Gilroy";
  src: url("../fonts/Gilroy-Black.woff2") format("woff2");
  font-weight: 950;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "Gilroy";
  src: url("../fonts/Gilroy-BlackItalic.woff2") format("woff2");
  font-weight: 950;
  font-style: italic;
  font-display: swap;
}

:root {
  --font-title: "Borna", Georgia, serif;
  --font-heading: var(--font-title);
  --font-body: "Gilroy", system-ui, sans-serif;
  --public-body-size: 1rem;
  --public-body-leading: 1.5625;
  --public-nav-size: 1rem;
  --public-h1-size: clamp(2.5rem, 5vw, 3.25rem);
  --public-h2-size: clamp(2rem, 4vw, 2.75rem);
  --public-h3-size: clamp(1.75rem, 3vw, 2.25rem);
  --public-h4-size: 1.625rem;
  --public-h5-size: 1.375rem;
  --public-h6-size: 1.125rem;
  /* Opt-in type scale (.type-h1 … .type-h6). Max = desktop design (16px root). */
  --type-h1-size: clamp(2.5rem, 5vw + 1.5rem, 4.1875rem); /* 40px → 67px */
  --type-h2-size: clamp(2rem, 4.2vw + 1.2rem, 3.5rem); /* 32px → 56px */
  --type-h3-size: clamp(1.75rem, 3.4vw + 1rem, 2.875rem); /* 28px → 46px */
  --type-h4-size: clamp(1.5rem, 2.4vw + 0.9rem, 2.125rem); /* 24px → 34px */
  --type-h5-size: clamp(1.25rem, 1.8vw + 0.85rem, 1.75rem); /* 20px → 28px */
  --type-h6-size: clamp(1.125rem, 1.4vw + 0.8rem, 1.4375rem); /* 18px → 23px */
  /* Brand colors */
  --fnfc-color-primary: #2d2e74;
  --fnfc-color-secondary: #231f20;
  --fnfc-color-accent: #00b3b5;
  --fnfc-color-accent-rgb: 0, 179, 181;
  --fnfc-color-earth: #2d251e;
  --fnfc-color-text: #333333;
  --fnfc-color-text-muted: #555555;
  --fnfc-color-text-soft: #5a524a;
  --fnfc-color-text-subtle: #7a726a;
  --fnfc-color-text-warm: #4a423a;
  --fnfc-color-stat-label: #6e6560;
  --fnfc-color-orange: #33c2c4;
  --fnfc-color-orange-light: #4dccce;
  --fnfc-color-orange-hover: #009a9c;
  --fnfc-color-orange-dark: #007a7b;
  --fnfc-color-orange-quote: #5bbcbd;
  --fnfc-color-white: #ffffff;
  --fnfc-color-ivory: #fff9ef;
  --fnfc-color-grey: #414042;
  --fnfc-color-lightbrown: #c29d8b;
  --fnfc-color-cream: #fdf7ee;
  --fnfc-color-cream-alt: #f5efeb;
  --fnfc-color-sand: #f4ebe1;
  --fnfc-color-sand-hover: #e6dbd0;
  --fnfc-color-sand-card: #ede4d7;
  --fnfc-color-border: #d6cec4;
  --fnfc-color-border-light: #f5f0ea;
  --fnfc-color-border-neutral: #eaeaea;
  --fnfc-color-border-gray: #cccccc;
  --fnfc-color-border-dark: #a0a0a0;
  --fnfc-color-surface-muted: #f9f9f9;
  --fnfc-color-olive: #556b43;
  --fnfc-color-olive-text: #fdf7ee;
  --fnfc-color-olive-eyebrow: #d6cec4;
  --fnfc-color-glossary-term: #e6a15c;
  --fnfc-color-glossary-desc: #e2ddd5;
  --fnfc-color-connect-bg: #0d0806;
  --fnfc-color-connect-text: #f5efeb;
  --fnfc-color-connect-muted: #a89f9a;
  --fnfc-color-connect-desc: #d6cfcb;
  --fnfc-color-connect-border: #3a312c;
  --fnfc-color-connect-gold: #ebb04d;
  --fnfc-color-connect-gold-hover: #d69e3f;
  --fnfc-color-connect-btn-text: #140d0a;
  --fnfc-color-on-dark: #ffffff;
  --fnfc-color-on-dark-muted: rgba(255, 255, 255, 0.7);
  --fnfc-color-on-dark-soft: rgba(255, 255, 255, 0.9);
  /* Typography scale */
  --fnfc-text-eyebrow: 0.75rem;
  --fnfc-text-eyebrow-sm: 0.65rem;
  --fnfc-text-eyebrow-lg: 0.8rem;
  --fnfc-text-eyebrow-hero: 0.68rem;
  --fnfc-text-label: 0.7rem;
  --fnfc-text-caption: 0.85rem;
  --fnfc-text-small: 0.8rem;
  --fnfc-text-btn: 0.78rem;
  --fnfc-text-btn-sm: 0.72rem;
  --fnfc-text-lead: 1.05rem;
  --fnfc-text-lead-lg: 1.1rem;
  --fnfc-text-body-sm: 0.88rem;
  --fnfc-text-body-xs: 0.95rem;
  --fnfc-text-quote: 1.15rem;
  --fnfc-text-stat: 2.5rem;
  --fnfc-text-card-title: 1.25rem;
  --fnfc-text-section-title: 1.35rem;
  --fnfc-text-season-title: 1.5rem;
  --fnfc-text-glossary-title: 1.6rem;
  --fnfc-text-hero-title: calc(2.8rem + 2.5vw);
  --fnfc-tracking-eyebrow: 0.15em;
  --fnfc-tracking-eyebrow-wide: 0.2em;
  --fnfc-tracking-eyebrow-tight: 0.12em;
  --fnfc-tracking-eyebrow-hero: 0.16em;
  --fnfc-tracking-label: 0.1em;
  --fnfc-tracking-btn: 0.08em;
  --fnfc-tracking-btn-wide: 0.1em;
  --fnfc-tracking-btn-wider: 0.12em;
  --fnfc-tracking-tight: 0.05em;
  --fnfc-weight-normal: 400;
  --fnfc-weight-medium: 500;
  --fnfc-weight-semibold: 600;
  --fnfc-weight-bold: 700;
  --fnfc-leading-tight: 1.15;
  --fnfc-leading-snug: 1.4;
  --fnfc-leading-normal: 1.5;
  --fnfc-leading-relaxed: 1.6;
  --fnfc-leading-loose: 1.65;
  /* Layout */
  --fnfc-section-padding: 80px;
  --fnfc-section-padding-lg: 90px;
  --fnfc-section-padding-xl: 100px;
  --fnfc-section-padding-hero: 120px;
  --fnfc-radius-sm: 6px;
  --fnfc-radius-md: 8px;
  --fnfc-radius-lg: 12px;
  --fnfc-radius-pill: 999px;
  --fnfc-shadow-card: 0 4px 20px rgba(0, 0, 0, 0.02);
  --fnfc-shadow-soft: 0 4px 15px rgba(0, 0, 0, 0.05);
  --fnfc-shadow-badge: 0 2px 4px rgba(0, 0, 0, 0.02);
  --fnfc-gradient-light: linear-gradient(to bottom, var(--fnfc-color-white) 0%, var(--fnfc-color-cream) 100%);
  --fnfc-gradient-warm: linear-gradient(to bottom, var(--fnfc-color-white) 0%, var(--fnfc-color-cream-alt) 100%);
  --fnfc-gradient-hero: linear-gradient(
    to bottom,
    rgba(0, 0, 0, 0.45) 0%,
    rgba(0, 0, 0, 0) 25%,
    rgba(var(--fnfc-color-accent-rgb), 0.2) 50%,
    rgba(var(--fnfc-color-accent-rgb), 0.8) 80%,
    rgba(var(--fnfc-color-accent-rgb), 1) 100%
  );
}

/* Prevent trackpad/mouse "overscroll bounce" past the end of the page. */
html {
  overscroll-behavior-y: none;
  scroll-behavior: smooth;
}

@media (prefers-reduced-motion: reduce) {
  html {
    scroll-behavior: auto;
  }
}

body.public-site {
  /* Prevent the browser's automatic dark-theme heuristic from re-tinting
       near-black text/backgrounds (e.g. #212529 rendering as blue-grey). */
  color-scheme: light;
  font-family: var(--font-body);
  font-size: var(--public-body-size);
  line-height: var(--public-body-leading);
}

body.public-site p,
body.public-site li {
  font-size: inherit;
  line-height: var(--public-body-leading);
}

h1,
h2,
h3,
h4,
h5,
h6,
.h1,
.h2,
.h3,
.h4,
.h5,
.h6,
.display-1,
.display-2,
.display-3,
.display-4,
.display-5,
.display-6,
.font-title,
.font-heading {
  font-family: var(--font-title);
  font-weight: 500;
}

.font-body {
  font-family: var(--font-body);
}

body.public-site .font-title,
body.public-site .font-heading {
  font-family: var(--font-title);
  font-weight: 500;
}

body.public-site .font-body {
  font-family: var(--font-body);
}

body.public-site .type-h1,
body.public-site .type-h2,
body.public-site .type-h3,
body.public-site .type-h4,
body.public-site .type-h5,
body.public-site .type-h6 {
  font-family: var(--font-title);
  font-weight: 500;
}

body.public-site .type-h1 {
  font-size: var(--type-h1-size) !important;
  line-height: 1.15;
}
body.public-site .type-h2 {
  font-size: var(--type-h2-size) !important;
  line-height: 1.2;
}
body.public-site .type-h3 {
  font-size: var(--type-h3-size) !important;
  line-height: 1.25;
}
body.public-site .type-h4 {
  font-size: var(--type-h4-size) !important;
  line-height: 1.3;
}
body.public-site .type-h5 {
  font-size: var(--type-h5-size) !important;
  line-height: 1.35;
}
body.public-site .type-h6 {
  font-size: var(--type-h6-size) !important;
  line-height: 1.4;
}

body.public-site h1,
body.public-site .h1,
body.public-site .cms-section h1,
body.public-site .cms-page-detail-body h1,
body.public-site .cms-rich-text h1 {
  font-size: var(--public-h1-size);
  line-height: 1.15;
}

body.public-site h2,
body.public-site .h2,
body.public-site .cms-section h2,
body.public-site .cms-page-detail-body h2,
body.public-site .cms-rich-text h2 {
  font-size: var(--public-h2-size);
  line-height: 1.2;
}

body.public-site h3,
body.public-site .h3,
body.public-site .cms-section h3,
body.public-site .cms-page-detail-body h3,
body.public-site .cms-rich-text h3 {
  font-size: var(--public-h3-size);
  line-height: 1.25;
}

body.public-site h4,
body.public-site .h4,
body.public-site .cms-section h4,
body.public-site .cms-page-detail-body h4,
body.public-site .cms-rich-text h4 {
  font-size: var(--public-h4-size);
  line-height: 1.3;
}

body.public-site h5,
body.public-site .h5,
body.public-site .cms-section h5,
body.public-site .cms-page-detail-body h5,
body.public-site .cms-rich-text h5 {
  font-size: var(--public-h5-size);
  line-height: 1.35;
}

body.public-site h6,
body.public-site .h6,
body.public-site .cms-section h6,
body.public-site .cms-page-detail-body h6,
body.public-site .cms-rich-text h6 {
  font-size: var(--public-h6-size);
  line-height: 1.4;
}

.cms-section h1,
.cms-section h2,
.cms-section h3,
.cms-section h4,
.cms-section h5,
.cms-section h6,
[class^="cms-hero"] h1,
[class^="cms-research"] h1,
[class^="cms-oral"] h1,
[class^="cms-calendar"] h1,
[class^="cms-living"] h1,
[class^="cms-connect"] h1,
[class^="cms-split"] h1,
[class^="cms-ar-"] h1,
.cms-page-detail-body h1,
.cms-page-detail-body h2,
.cms-page-detail-body h3,
.cms-page-detail-body h4,
.cms-page-detail-body h5,
.cms-page-detail-body h6,
.cms-rich-text h1,
.cms-rich-text h2,
.cms-rich-text h3,
.cms-rich-text h4,
.cms-rich-text h5,
.cms-rich-text h6 {
  font-family: var(--font-title);
}

.cms-page-detail-body,
.cms-rich-text,
.cms-section,
[class^="cms-hero"],
[class^="cms-research"],
[class^="cms-oral"],
[class^="cms-calendar"],
[class^="cms-living"],
[class^="cms-connect"],
[class^="cms-split"],
[class^="cms-ar-"] {
  font-family: var(--font-body);
}

.cms-page-detail-body p,
.cms-rich-text p {
  margin-bottom: 0;
}

.cms-page-detail-body ul,
.cms-page-detail-body ol,
.cms-rich-text ul,
.cms-rich-text ol {
  padding-left: 1.75rem;
  margin-bottom: 0;
  list-style: none;
}

.cms-page-detail-body li[data-list="bullet"],
.cms-rich-text li[data-list="bullet"] {
  list-style-type: disc;
}

.cms-page-detail-body li[data-list="ordered"],
.cms-rich-text li[data-list="ordered"] {
  list-style-type: decimal;
}

.cms-page-detail-body ul > li,
.cms-rich-text ul > li {
  list-style-type: disc;
}

.cms-page-detail-body ol > li:not([data-list]),
.cms-rich-text ol > li:not([data-list]) {
  list-style-type: decimal;
}

.cms-page-detail-body li,
.cms-rich-text li {
  margin-bottom: 0;
}

.cms-page-detail-body a,
.cms-rich-text a {
  color: var(--fnfc-color-accent);
  text-decoration: underline;
  text-underline-offset: 2px;
}

.cms-page-detail-body a:hover,
.cms-rich-text a:hover {
  color: var(--fnfc-color-orange-dark);
}

.cms-rich-text p:has(> img),
.cms-page-detail-body p:has(> img) {
  overflow: auto;
}

.cms-rich-text img,
.cms-page-detail-body img {
  max-width: 100%;
  height: auto;
  display: block;
  margin: 0.75rem 0;
}

.cms-rich-text img[data-align="left"],
.cms-page-detail-body img[data-align="left"] {
  margin-left: 0;
  margin-right: auto;
}

.cms-rich-text img[data-align="right"],
.cms-page-detail-body img[data-align="right"] {
  margin-left: auto;
  margin-right: 0;
}

.cms-rich-text img[data-align="center"],
.cms-page-detail-body img[data-align="center"] {
  margin-left: auto;
  margin-right: auto;
}

.public-header .navbar,
.public-header .nav-link {
  font-family: var(--font-body);
}

.text-color-nab {
  color: var(--fnfc-color-accent) !important;
}

.bg-color-nab {
  background-color: var(--fnfc-color-accent) !important;
}

.text-pem-grey {
  color: #414042 !important;
}

.text-ivory {
  color: var(--fnfc-color-ivory) !important;
}

.ls-1 {
  letter-spacing: 1px !important;
}

.ls-2 {
  letter-spacing: 2px !important;
}

.ls-3 {
  letter-spacing: 3px !important;
}

.ls-4 {
  letter-spacing: 4px !important;
}

.fs-16 {
  font-size: 16px !important;
}

.fs-24 {
  font-size: 24px !important;
}

.fs-14 {
  font-size: 14px !important;
}

.fs-12 {
  font-size: 12px !important;
}

.mb-60 {
  margin-bottom: 60px !important;
}

.bg-ivory {
  background-color: var(--fnfc-color-ivory) !important;
}