/* Base font settings */
@import url("https://fonts.googleapis.com/css2?family=Roboto:wght@400;500;700&family=Inter:wght@400;500;600;700&display=swap&subset=latin");

@view-transition {
  navigation: none;
}
@font-face {
  font-family: "Material Symbols Outlined";
  font-style: normal;
  font-weight: 100 700;
  src: url("https://fonts.gstatic.com/icon/font?kit=kJEhBvYX7BgnkSrUwT8OhrdQw4oELdPIeeII9v6oFsLjBuVYLA3brMghX78kgb0hWRPv_A&skey=b8dc2088854b122f&v=v292")
    format("woff2");
}

.material-symbols-outlined {
  font-family: "Material Symbols Outlined";
  font-weight: normal;
  font-style: normal;
  font-size: 24px;
  line-height: 1;
  letter-spacing: normal;
  text-transform: none;
  display: inline-block;
  white-space: nowrap;
  word-wrap: normal;
  direction: ltr;
  -webkit-font-feature-settings: "liga";
  -webkit-font-smoothing: antialiased;
}

html {
  font-size: var(--base-font-size);
  view-transition-name: auto;
}

/* Your other custom CSS rules can go below this line */
body {
  font-family: "Inter", sans-serif;
  color: var(--color-text-default) !important;
}
/*
      * Global style tokens (CSS Custom Properties) for easy updates.
     */
:root {
  /* Base Font Size Token - Change this and everything scales automatically */
  --base-font-size: 12px;

  /* Fluid Typography Scale - Based on 1.25 ratio (Major Third) */
  --scale-ratio: 1.25;
  --scale-ratio-large: 1.3; /* For h1-multiplied */

  /* Font Size Tokens (in rem) - All scale with --base-font-size */
  --fs-h1: 2.6rem;
  --fs-h1-multiplied: 4.3rem;
  --fs-h2: 1.9rem;
  --fs-h3: 1.5rem;
  --fs-h4: 1.4rem;
  --fs-h5: 1.1rem;
  --fs-h6: 0.85rem;

  /* Link Context Default Size */
  --link-context-size: var(--fs-h3);

  /* Line Height Tokens (in rem) */
  --lh-h1: 5.7rem;
  --lh-h2: 3.6rem;
  --lh-h3: 1.7rem;
  --lh-h4: 0.85rem;
  --lh-h5: 1.1rem;
  --lh-h6: 0.85rem;

  /* Line Height Tokens for Paragraphs (in rem) */
  --lh-p1: 3.2rem;
  --lh-p2: 2.6rem;
  --lh-p3: 2.4rem;
  --lh-p4: 2.4rem;
  --lh-p5: 1.4rem;
  --lh-p6: 1rem;

  /* Heading Bottom Margin Tokens (in rem) */
  --h-margin-1: 3.6rem;
  --h-margin-2: 1.65rem;
  --h-margin-3: 1.7rem;
  --h-margin-4: 20.9rem;
  --h-margin-5: 0.4rem;
  --h-margin-6: 0.4rem;

  /* Module Spacing Tokens (in rem) */
  --module-spacing-1: 4.5rem;
  --module-spacing-2: 5.8rem;
  --module-spacing-3: 3.5rem;
  --module-spacing-4: 0rem;
  --module-spacing-5: 0.96rem;
  --module-spacing-6: 0.64rem;

  /* Paragraph Group Padding Tokens (in rem) */
  --group-padding-1: 5.6rem;
  --group-padding-2: 4rem;
  --group-padding-3: 3rem;
  --group-padding-4: 1rem;
  --group-padding-5: 0rem;
  --group-padding-6: 0rem;

  /* Color Tokens */
  --color-text-default: #2c2c2c;
  --color-text-secondary: #1d1d1d;
  /*  --color-text-primary: #0051d2;*/
  accent-color: var(--primary-color);
  /* Font Weight Tokens */
  --font-normal: 400;
  --font-medium: 500;
  --font-semibold: 600;
  --font-bold: 700;

  /* Proportional Paragraph Spacing Token */
  --paragraph-spacing-scale: 0.9;
}

/* Responsive Base Font Size - Just change this and everything scales */

@media (max-width: 950px) {
  :root {
    --base-font-size: 10px; /* Even larger for big screens */
    --lh-h1: 3.9rem;
  }
  .module-1 {
    padding-left: 0px;
  }
}

@media (min-width: 950px) {
  :root {
    --base-font-size: 11px; /* Even larger for big screens */
  }
  .fsBreadcrumb ul li {
    font-size: 1.5rem;
  }
  .type-p3 {
    text-wrap: pretty;
    max-inline-size: 150ch;
  }
}

@media (min-width: 1200px) {
  :root {
    --base-font-size: 12.5px; /* Largest for very big screens */
  }
  .fsBreadcrumb ul li {
    font-size: 1rem;
  }
}

@media (min-width: 1780px) {
  :root {
    --base-font-size: 14.5px; /* Largest for very big screens */
  }
  .fsBreadcrumb ul li {
    font-size: 1rem;
  }
}

/* * Hierarchical Module Spacing */
.module-1 {
  margin-bottom: var(--module-spacing-1);
  /*padding-left: 20px;*/
}
.module-2 {
  margin-bottom: var(--module-spacing-2);
}
.module-3 {
  margin-bottom: var(--module-spacing-3);
}
.module-4 {
  margin-bottom: var(--module-spacing-4);
}
.module-5 {
  margin-bottom: var(--module-spacing-5);
}
.module-6 {
  margin-bottom: var(--module-spacing-6);
}

/* * Paragraph Group Padding */
.group-1 {
  padding-bottom: var(--group-padding-1);
}
.group-2 {
  padding-bottom: var(--group-padding-2);
}
.group-3 {
  padding-bottom: var(--group-padding-3);
}
.group-4 {
  padding-bottom: var(--group-padding-4);
}
.group-5 {
  padding-bottom: var(--group-padding-5);
}
.group-6 {
  padding-bottom: var(--group-padding-6);
}

/* * Proportional Paragraph Spacing */
.paragraph {
  margin-bottom: calc(0.8rem * var(--paragraph-spacing-scale));
}

/*
      * THE FIX: This rule targets the last paragraph in any group and removes its bottom margin.
      * This prevents the paragraph's own spacing from stacking with the group/module spacing.
     */
div[class*="group-"] > p.paragraph:last-child {
  margin-bottom: 0;
}

/*
      * THE FIX: This rule tells a parent group to remove its own bottom padding
      * IF AND ONLY IF it contains another module inside it. This prevents the
      * double-padding issue with nested components.
     */
.group-1:has(.module-2),
.group-2:has(.module-3),
.group-3:has(.module-4),
.group-4:has(.module-5),
.group-5:has(.module-6) {
  padding-bottom: 0;
}

/* * Typography classes using CSS variables */
.type-h1 {
  font-size: clamp(3rem, var(--fs-h1-multiplied), 6.25rem);
  line-height: var(--lh-h1);
  margin-bottom: var(--h-margin-1);
  font-weight: var(--font-semibold) !important;
  letter-spacing: -0px !important;
  margin-left: -2px;
}
.type-h1b {
  font-size: var(--fs-h1);
  line-height: 3rem;
  margin-bottom: var(--h-margin-1);
  font-weight: var(--font-medium) !important;
  letter-spacing: -0px !important;
}
.type-h1c {
  font-size: var(--fs-h1-multiplied);
  line-height: 3rem;
  margin-bottom: var(--h-margin-1);
  font-weight: var(--font-medium) !important;
  letter-spacing: -0px !important;
}
.type-h2 {
  font-size: var(--fs-h2);
  line-height: var(--lh-h2);
  margin-bottom: var(--h-margin-2);
  font-weight: var(--font-medium) !important;
  color: var(--primary-color);
}
.type-h2 a {
  font-weight: var(--font-medium);
}

.type-h3 {
  font-size: var(--fs-h3);
  line-height: var(--lh-h3);
  margin-bottom: var(--h-margin-3);
}
.type-h4 {
  font-size: var(--fs-h4);
  line-height: var(--lh-h4);
  margin-bottom: var(--h-margin-4);
}
.type-h5 {
  font-size: var(--fs-h5);
  line-height: var(--lh-h5);
  margin-bottom: var(--h-margin-5);
}
.type-h6 {
  font-size: var(--fs-h6);
  line-height: var(--lh-h6);
  margin-bottom: var(--h-margin-6);
}
.type-p1 {
  font-size: var(--fs-h1);
  line-height: var(--lh-p1);
}
.type-p2 {
  font-size: var(--fs-h2);
  line-height: var(--lh-p2);
  text-wrap: balanced;
  max-inline-size: 80ch;
}
.type-p3 {
  font-size: var(--fs-h3);
  line-height: var(--lh-p3);
  text-wrap: balanced;
  max-inline-size: 80ch;
}
.type-p4 {
  font-size: var(--fs-h4);
  line-height: var(--lh-p4);
  text-wrap: pretty;
  max-inline-size: 120ch;
  padding-bottom: 0px;
}

a.type-p4 {
  font-size: var(--fs-h4);
  line-height: var(--lh-p4);
  text-wrap: pretty;
  max-inline-size: 120ch;
}

.type-p5 {
  font-size: var(--fs-h5);
  line-height: var(--lh-p5);
}
.type-p6 {
  font-size: var(--fs-h6);
  line-height: var(--lh-p6);
}

/* * Semantic utility classes for themes */
.text-primary {
  /* color: var(--color-text-primary);*/
}
.text-secondary {
  color: var(--color-text-secondary);
}
.font-normal {
  font-weight: var(--font-normal);
}
.font-medium {
  font-weight: var(--font-medium);
}
.font-semibold {
  font-weight: var(--font-semibold);
}
.font-bold {
  font-weight: var(--font-bold);
}

h1,
h2,
h3,
h4,
h5,
h6 {
  font-family: "Inter", sans-serif;
  text-box-trim: trim-both;
  text-box-edge: cap alphabetic;
  text-wrap: pretty;
  /* margin-left: -4px; */
}

/* h1 {
  font-size: clamp(var(--fs-h1-multiplied));
  margin-left: -5px;
  font-weight: var(--font-semibold);
} */

h2 {
  font-weight: var(--font-medium) !important;
}

h3 {
  font-weight: var(--font-medium) !important;
}

.module-1 {
  margin-bottom: 200px;
  padding-right: 0%;
}

.module-2 {
  padding-right: 0%;
}

/* * Addendum class to zero-out module spacing */
.addendum {
  margin-bottom: 20px !important;
}

.space-y-2 > :not([hidden]) ~ :not([hidden]) {
  margin-bottom: calc(0rem * var(--tw-space-y-reverse)) !important;
}

h1.fsPageTitle {
  display: none;
  visibility: none !important;
}

#fsHeader .header-top > .fsElementContent .district-home-link a {
  text-shadow: 0px 0px 6px rgba(0, 0, 0, 0);
}

.nav-tier {
  -webkit-box-shadow: 0px 10px 50px -10px rgba(0, 0, 0, 0);
  box-shadow: 0px 10px 50px -10px rgba(0, 0, 0, 0);
}

.fsBreadcrumb ul li {
  font-size: 1.4rem; /* or initial, or a specific px/rem value */
}

.fsBreadcrumb {
  padding: 0 0px; /* or initial, or a specific px/rem value */
}

ol li::marker {
  font-size: 1.3rem; /* Adjust the value to increase or decrease the disc size */
  vertical-align: middle;
  color: #7e7e7e;
}

ol li {
  list-style-type: decimal;
  margin-left: 1.4rem;
}

button,
input,
optgroup,
select,
textarea {
  font-size: 1.4rem;
}

.material-symbols-outlined {
  font-variation-settings: "FILL" 0, "wght" 400, "GRAD" 0, "opsz" 24;
}

.btn-culture {
  /* Default State */
  display: inline-flex;
  place-items: center;
  gap: 0.65rem;
  padding: 9.75px 25px 8.5px 30px;
  border: 1.5px solid var(--secondary-color);
  font-weight: 400;
  font-size: var(--fs-h4);
  border-radius: 50px;
  margin: 10px 0 0 -10px;
  color: var(--primary-color);
  text-decoration: none;
  text-box-trim: trim-both;
  text-box-edge: cap alphabetic;
  z-index: 10;
  transform: translateY(0px);
  transition: background-color 0.3s, color 0.3s, border-color 0.3s;
}

.btn-culture::after {
  content: "arrow_forward";
  font-family: "Material Symbols Outlined";
  font-variation-settings: "FILL" 0, "wght" 300, "GRAD" 0, "opsz" 24;
  font-size: 1.3rem;
  text-box-trim: trim-both;
  text-box-edge: cap alphabetic;
  place-items: center;
  padding-block: 0.2vw;
}

.btn-culture:hover {
  border-color: var(--primary-color);
  background-color: var(--primary-color);
  color: white;
}

.title-link {
  color: var(--color-text-primary);
  font-weight: var(--font-medium);
  text-decoration: none;
  text-underline-offset: 0.425rem;
  text-decoration-skip-ink: auto;
  transition: background-color 0.3s, color 0.3s, border-color 0.3s;
}

.title-link:hover {
  text-decoration: underline solid var(--primary-color) 0.08rem;
  text-decoration-skip-ink: auto;
}

.pm-links {
  font-size: var(--link-context-size);
  color: white;
  text-decoration: underline solid #ffffff 0px;
  text-underline-offset: 0.18rem;
  text-decoration-skip-ink: auto;
  font-weight: var(--font-normal);
  transition: background-color 0.3s, color 0.3s, border-color 0.3s;
}

.link-context {
  /* font-size: var(--link-context-size); */
  color: var(--color-text-default);
  text-decoration: underline solid var(--color-text-default) 0.5px;
  text-underline-offset: 0.18rem;
  text-decoration-skip-ink: auto;
  font-weight: var(--font-normal);
  transition: background-color 0.3s, color 0.3s, border-color 0.3s;
}

a.link-context h2 {
  text-underline-offset: 1.5rem;
}

.link-context:hover {
  /* Hover State */
  color: var(--color-text-default); /* Orange text on hover */
  text-decoration: underline solid var(--secondary-color) 1px;
}

/* Link Context Size Variants - Only override font-size */
.link-context.h1,
.link-context.size-h1 {
  font-size: var(--fs-h1-multiplied);
}

.link-context.h2,
.link-context.size-h2 {
  font-size: var(--fs-h2);
}

.link-context.h3,
.link-context.size-h3 {
  font-size: var(--fs-h3);
}

.link-context.h4,
.link-context.size-h4 {
  font-size: var(--fs-h4);
}

.link-context.h5,
.link-context.size-h5 {
  font-size: var(--fs-h5);
}

.link-context.h6,
.link-context.size-h6 {
  font-size: var(--fs-h6);
}

.link-parent {
  display: flex;
  flex-wrap: wrap;
  /* justify-content: center; */
}

.link-child {
  flex: 0 1 600px;
  margin-bottom: 0px;
}

.mod-parent {
  display: flex;
  flex-wrap: wrap;
  gap: 40px;
  justify-content: left;
}

.mod-child {
  flex: 1 1 380px;
  margin-bottom: 5px;
}

.fsComposerFormEmbed form .required {
  color: var(--secondary-color, #0c4b90);
  -webkit-transition: 0.3s color;
  transition: 0.3s color;
}

p,
.panel-value,
.panel-label,
tbody tr,
tbody td,
tbody span {
  transition: all 0.3s ease-in-out;
}

h1.fsPageTitle {
  display: none;
  visibility: none;
}

#fsPoweredByFinalsite {
  display: none;
  visibility: none;
}

#fsEl_64919,
.nav-social .fsNavLevel1 {
  visibility: hidden;
}

#fsEl_65034 {
  visibility: hidden;
}

.home-hero-school > header .fsImage {
  position: absolute;
  top: 30px;
  right: 40px;
  transform: translate(0, 0);
  opacity: 0; /* GSAP will also zero it out */
  pointer-events: none;
}

.fsBreadcrumb ul li {
  text-transform: capitalize;
}

#fsEl_102084 {
  max-width: 300px;
}

.button-arrow-primary {
  text-transform: capitalize;

  /*   max-width: 380px; */
}

/* .home:not(.fsComposeMode) .home-hero-school > header .fsElementHeaderContent {
  margin-top: 0px;
}

.home:not(.fsComposeMode) .home-hero-school>header .fsElementHeaderContent ul.flatten li {
  font-size: clamp(1rem, calc(1.5vw + 1rem), 3.5rem);
  line-height: 40px;
  font-weight: 400px
} */

/* .home:not(.fsComposeMode) .home-hero-school>header .fsElementHeaderContent ul li {
  font-weight: 400;
}

@media (min-width: 700px) {
  .home:not(.fsComposeMode) .home-hero-school>header .fsElementHeaderContent ul li {
    font-size: clamp(1rem, calc(1.5vw + 1rem), 3.5rem);
      line-height: 50px;
      margin: -25px 0;
  }
} */

/* .home:not(.fsComposeMode) .home-hero-school
Specificity: (0,3,0)
 {
    height: 90vh;
}

.home:not(.fsComposeMode) .home-hero-school>header .fsElementHeaderContent {
  margin: 0;
  padding-right: 26px;
  padding-left: 26px;
  position: absolute;
  width: 100%;
  max-width: 100%;
  margin: 0 auto;
  height: 100%;
} */

/* .home:not(.fsComposeMode) .home-hero-school>header .fsElementHeaderContent .fsImage {
  width: 300px;
  position: relative;
  top: 50%;
 

} */

/* .home:not(.fsComposeMode) .home-hero-school>header {
  position: relative;
  bottom: 100px;
  left: 0;
  width: 100%;
  text-align: left;
  z-index: 10;
} */

/* .home:not(.fsComposeMode) .home-hero-school>header .fsElementHeaderContent ul.flatten {
  opacity: 0;
}


@media (min-width: 1000px) {
  .home:not(.fsComposeMode) .home-hero-school>header .fsElementHeaderContent ul li {
      font-size: clamp(1rem, calc(1.5vw + 1rem), 3.5rem);
      line-height: 70px;
  }
}

@media (min-width: 700px) {
  .home:not(.fsComposeMode) .home-hero-school>header .fsElementHeaderContent ul li>span {
      padding: 0px;
  }
} */

/* @media (min-width: 1000px) {
  .home:not(.fsComposeMode) .home-hero-school>header .fsElementHeaderContent ul {
      width: 100%;
      top: auto;
      bottom: 0;
      text-align: left;
  }
}
 */

/* .hero.fsResourceElement:before {
  display: block;
  content: "";
  position: absolute;
  height: 100%;
  width: 100%;
  position: absolute;
  left: 50%;
  top: 50%;
  -webkit-transform: translate3d(-50%, -50%, 0);
  transform: translate3d(-50%, -50%, 0);
  background: -webkit-gradient(linear, left bottom, left top, from(rgba(0, 0, 0, 0.0)), to(rgba(0, 0, 0, 0.0)));
  background: linear-gradient(0deg, rgba(0, 0, 0, 0.0) 0%, rgba(0, 0, 0, 0.4) 0%);
  z-index: 1
} */

/* Kill the black overlay */