@font-face {
  font-family: "apercu-bold";
  src: url("../assets/fonts/apercu-bold.woff") format("woff");
  font-weight: bold;
  font-style: normal;
}
@font-face {
  font-family: "apercu-medium";
  src: url("../assets/fonts/apercu-medium.woff") format("woff");
  font-weight: 400;
  font-style: normal;
}
@font-face {
  font-family: "apercu-regular";
  src: url("../assets/fonts/apercu-regular.woff") format("woff");
  font-weight: 200;
  font-style: normal;
}
@font-face {
  font-family: "mad-font-bold";
  src: url("../assets/fonts/mad-font-bold.woff") format("woff");
  font-weight: bold;
  font-style: normal;
}

/* -- VARIABLES -- */
:root {
  --header-height: 75px;

  --font-family-apercu-bold: "apercu-bold", sans-serif;
  --font-family-apercu-medium: "apercu-medium", sans-serif;
  --font-family-apercu-regular: "apercu-regular", sans-serif;
  --font-family-mad-bold: "mad-font-bold", sans-serif;

  --font-size-xxl: clamp(2.5rem, 4.5vw, 5rem);
--font-size-xl: clamp(2.5rem, 4vw, 6.25rem);
  --font-size-large-alt: clamp(3.5rem, 8vw, 4rem);
  --font-size-large: clamp(1.5rem, 8vw, 2.75rem);
  --font-size-medium: clamp(1.4rem, 4.5vw, 2.15rem);
  --font-size-small: 1.4rem;
  --font-size-xsmall: 1.1rem;
  --font-size-xxsmall: .75rem;
  --font-size-menu: 1.1rem;
  --font-size-menu-small: 1.75rem;

  --light-blue: #dae2f9;
  --blue: #305cde;
  --pink: #ffebe6;

  --global-spacing-3: 3px;
  --global-spacing-6: 6px;
  --global-spacing-10: 10px;
  --global-spacing-12: 12px;
  --global-spacing-15: 15px;
  --global-spacing-25: 25px;
  --global-spacing-50: 50px;
  --global-spacing-75: 75px;
  --global-spacing-100: 100px;
  --global-spacing-150: 150px;
  --global-spacing-200: 200px;
}
@media (max-width: 992px) {
  :root {
    --global-spacing-25: 17px;
    --global-spacing-100: 75px;
  }
}
@media (max-width: 768px) {
  :root {
    --global-spacing-100: 50px;
  }
}
@media (max-width: 548px) {
  :root {
    --global-spacing-100: 17px;
  }
}
/* -- VARIABLES END -- */

@media (min-width: 992px) {
  .inner-glow-box {
    position: fixed;
    height: 100dvh;
    width: 100vw;
    pointer-events: none;
    z-index: 9999999;
  
    -webkit-box-shadow: inset 0px 0px 65px 10px rgba(255, 235, 230, 0.75);
    -moz-box-shadow: inset 0px 0px 65px 10px rgba(255, 235, 230, 0.75);
    box-shadow: inset 0px 0px 65px 10px rgba(255, 235, 230, 0.75);
  }
}

/* -- FONTS -- */
.no-hyphen,
.no-hyphen p
.no-hyphen * {
  hyphens: none !important;
}

.apercu-bold {
  font-family: var(--font-family-apercu-bold) !important;
}
.font-apercu-medium {
  font-family: var(--font-family-apercu-medium) !important;
}
.font-apercu-regular {
  font-family: var(--font-family-apercu-regular) !important;
}
.font-mad-bold {
  font-family: var(--font-family-mad-bold) !important;
}

.font-size-xxl {
  font-size: var(--font-size-xxl);
}
.font-size-xl,
h2,
h1 {
  font-size: var(--font-size-xl);
}
.font-size-large,
h3 {
  font-size: var(--font-size-large);
}

.font-size-large-alt {
  font-size: var(--font-size-large-alt);
}

.font-size-medium,
h4 {
  font-size: var(--font-size-medium);
}
.font-size-small,
h5 {
  font-size: var(--font-size-small);
}
.font-size-xsmall {
  font-size: var(--font-size-xsmall);
}
.font-size-menu-small {
  font-size: var(--font-size-menu-small) !important;
}

.font-blue,
.font-blue a {
  color: var(--blue) !important;
}
.font-light-blue,
.font-light-blue a {
  color: var(--light-blue) !important;
}
.font-pink,
.font-pink a {
  color: var(--pink) !important;
}
/* -- FONTS END -- */

/* -- BACKGROUND COLOUR -- */
.bg-blue {
  background-color: var(--blue) !important;
}
.bg-light-blue {
  background-color: var(--light-blue) !important;
}
.bg-pink {
  background-color: var(--pink) !important;
}
.bg-transparent {
  background-color: transparent !important;
}
/* -- BACKGROUND COLOUR END -- */

/* -- SPACING -- */
.padding-3 {
  padding: var(--global-spacing-3);
}
.padding-6 {
  padding: var(--global-spacing-6);
}
.padding-12 {
  padding: var(--global-spacing-12);
}
.padding-25 {
  padding: var(--global-spacing-25);
}
.padding-50 {
  padding: var(--global-spacing-50);
}
.padding-75 {
  padding: var(--global-spacing-75);
}
.padding-100 {
  padding: var(--global-spacing-100);
}

.padding-left-3 {
  padding-left: var(--global-spacing-3);
}
.padding-left-6 {
  padding-left: var(--global-spacing-6);
}
.padding-left-12 {
  padding-left: var(--global-spacing-12);
}
.padding-left-25 {
  padding-left: var(--global-spacing-25);
}
.padding-left-50 {
  padding-left: var(--global-spacing-50);
}
.padding-left-75 {
  padding-left: var(--global-spacing-75);
}
.padding-left-100 {
  padding-left: var(--global-spacing-100);
}

.padding-right-3 {
  padding-right: var(--global-spacing-3);
}
.padding-right-6 {
  padding-right: var(--global-spacing-6);
}
.padding-right-12 {
  padding-right: var(--global-spacing-12);
}
.padding-right-25 {
  padding-right: var(--global-spacing-25);
}
.padding-right-50 {
  padding-right: var(--global-spacing-50);
}
.padding-right-75 {
  padding-right: var(--global-spacing-75);
}
.padding-right-100 {
  padding-right: var(--global-spacing-100);
}

.padding-top-3 {
  padding-top: var(--global-spacing-3);
}
.padding-top-6 {
  padding-top: var(--global-spacing-6);
}
.padding-top-12 {
  padding-top: var(--global-spacing-12);
}
.padding-top-25 {
  padding-top: var(--global-spacing-25);
}
.padding-top-50 {
  padding-top: var(--global-spacing-50);
}
.padding-top-75 {
  padding-top: var(--global-spacing-75);
}
.padding-top-100 {
  padding-top: var(--global-spacing-100);
}
.padding-top-150 {
  padding-top: var(--global-spacing-150);
}
.padding-top-200 {
  padding-top: var(--global-spacing-200);
}

.padding-bottom-3 {
  padding-bottom: var(--global-spacing-3);
}
.padding-bottom-6 {
  padding-bottom: var(--global-spacing-6);
}
.padding-bottom-12 {
  padding-bottom: var(--global-spacing-12);
}
.padding-bottom-15 {
  padding-bottom: var(--global-spacing-15);
}
.padding-bottom-25 {
  padding-bottom: var(--global-spacing-25);
}
.padding-bottom-50 {
  padding-bottom: var(--global-spacing-50);
}
.padding-bottom-75 {
  padding-bottom: var(--global-spacing-75);
}
.padding-bottom-100 {
  padding-bottom: var(--global-spacing-100);
}
.padding-bottom-150 {
  padding-bottom: var(--global-spacing-150);
}

.padding-block-3 {
  padding-block: var(--global-spacing-3);
}
.padding-block-6 {
  padding-block: var(--global-spacing-6);
}
.padding-block-12 {
  padding-block: var(--global-spacing-12);
}
.padding-block-25 {
  padding-block: var(--global-spacing-25);
}
.padding-block-50 {
  padding-block: var(--global-spacing-50);
}
.padding-block-75 {
  padding-block: var(--global-spacing-75);
}
.padding-block-100 {
  padding-block: var(--global-spacing-100);
}
.padding-block-150 {
  padding-block: var(--global-spacing-150);
}

.padding-inline-3 {
  padding-inline: var(--global-spacing-3);
}
.padding-inline-6 {
  padding-inline: var(--global-spacing-6);
}
.padding-inline-12 {
  padding-inline: var(--global-spacing-12);
}
.padding-inline-25 {
  padding-inline: var(--global-spacing-25);
}
.padding-inline-50 {
  padding-inline: var(--global-spacing-50);
}
.padding-inline-75 {
  padding-inline: var(--global-spacing-75);
}
.padding-inline-100 {
  padding-inline: var(--global-spacing-100);
}
.padding-inline-150 {
  padding-inline: var(--global-spacing-150);
}

.margin-3 {
  margin: var(--global-spacing-3);
}
.margin-6 {
  margin: var(--global-spacing-6);
}
.margin-12 {
  margin: var(--global-spacing-12);
}
.margin-25 {
  margin: var(--global-spacing-25);
}
.margin-50 {
  margin: var(--global-spacing-50);
}
.margin-75 {
  margin: var(--global-spacing-75);
}
.margin-100 {
  margin: var(--global-spacing-100);
}
.margin-150 {
  margin: var(--global-spacing-150);
}
.margin-200 {
  margin: var(--global-spacing-200);
}

.margin-left-3 {
  margin-left: var(--global-spacing-3);
}
.margin-left-6 {
  margin-left: var(--global-spacing-6);
}
.margin-left-12 {
  margin-left: var(--global-spacing-12);
}
.margin-left-25 {
  margin-left: var(--global-spacing-25);
}
.margin-left-50 {
  margin-left: var(--global-spacing-50);
}
.margin-left-75 {
  margin-left: var(--global-spacing-75);
}
.margin-left-100 {
  margin-left: var(--global-spacing-100);
}
.margin-left-150 {
  margin-left: var(--global-spacing-150);
}
.margin-left-200 {
  margin-left: var(--global-spacing-200);
}

.margin-right-3 {
  margin-right: var(--global-spacing-3);
}
.margin-right-6 {
  margin-right: var(--global-spacing-6);
}
.margin-right-12 {
  margin-right: var(--global-spacing-12);
}
.margin-right-25 {
  margin-right: var(--global-spacing-25);
}
.margin-right-50 {
  margin-right: var(--global-spacing-50);
}
.margin-right-75 {
  margin-right: var(--global-spacing-75);
}
.margin-right-100 {
  margin-right: var(--global-spacing-100);
}
.margin-right-150 {
  margin-right: var(--global-spacing-150);
}
.margin-right-200 {
  margin-right: var(--global-spacing-200);
}

.margin-top-3 {
  margin-top: var(--global-spacing-3);
}
.margin-top-6 {
  margin-top: var(--global-spacing-6);
}
.margin-top-12 {
  margin-top: var(--global-spacing-12);
}
.margin-top-25 {
  margin-top: var(--global-spacing-25);
}
.margin-top-50 {
  margin-top: var(--global-spacing-50);
}
.margin-top-75 {
  margin-top: var(--global-spacing-75);
}
.margin-top-100 {
  margin-top: var(--global-spacing-100);
}
.margin-top-150 {
  margin-top: var(--global-spacing-150);
}
.margin-top-200 {
  margin-top: var(--global-spacing-200);
}

.margin-bottom-3 {
  margin-bottom: var(--global-spacing-3);
}
.margin-bottom-6 {
  margin-bottom: var(--global-spacing-6);
}
.margin-bottom-12 {
  margin-bottom: var(--global-spacing-12);
}
.margin-bottom-15 {
  margin-bottom: var(--global-spacing-15);
}
.margin-bottom-25 {
  margin-bottom: var(--global-spacing-25);
}
.margin-bottom-50 {
  margin-bottom: var(--global-spacing-50);
}
.margin-bottom-75 {
  margin-bottom: var(--global-spacing-75);
}
.margin-bottom-100 {
  margin-bottom: var(--global-spacing-100);
}
.margin-bottom-150 {
  margin-bottom: var(--global-spacing-150);
}
.margin-bottom-200 {
  margin-bottom: var(--global-spacing-200);
}
@media (max-width: 767px) {
  .margin-bottom-200 {
    margin-bottom: 25px !important;
  }
}

.margin-block-3 {
  margin-block: var(--global-spacing-3);
}
.margin-block-6 {
  margin-block: var(--global-spacing-6);
}
.margin-block-12 {
  margin-block: var(--global-spacing-12);
}
.margin-block-25 {
  margin-block: var(--global-spacing-25);
}
.margin-block-50 {
  margin-block: var(--global-spacing-50);
}
.margin-block-75 {
  margin-block: var(--global-spacing-75);
}
.margin-block-100 {
  margin-block: var(--global-spacing-100);
}
.margin-block-150 {
  margin-block: var(--global-spacing-150);
}
.margin-block-200 {
  margin-block: var(--global-spacing-200);
}

.margin-inline-3 {
  margin-inline: var(--global-spacing-3);
}
.margin-inline-6 {
  margin-inline: var(--global-spacing-6);
}
.margin-inline-12 {
  margin-inline: var(--global-spacing-12);
}
.margin-inline-25 {
  margin-inline: var(--global-spacing-25);
}
.margin-inline-50 {
  margin-inline: var(--global-spacing-50);
}
.margin-inline-75 {
  margin-inline: var(--global-spacing-75);
}
.margin-inline-100 {
  margin-inline: var(--global-spacing-100);
}
.margin-inline-150 {
  margin-inline: var(--global-spacing-150);
}
.margin-inline-200 {
  margin-inline: var(--global-spacing-200);
}
/* -- SPACING END -- */

/* -- POSITION -- */
.position-fixed {
  position: fixed !important;
}

.z-index-top {
  z-index: 9999;
}
/* -- POSITION END -- */

/* -- SIZING -- */
.vh-100 {
  height: auto !important;
  min-height: 100vh !important;
}

.object-contain {
  object-fit: contain !important;
}

.object-cover {
  object-fit: cover !important;
}

.aspect-square {
  aspect-ratio: 1/.8;
}

.object-centre {
  object-position: center;
}

.aspect-ratio {
  aspect-ratio: 2/1;
}
/* -- SIZING END -- */

/* -- BORDER -- */
.border-radius-12 {
  border-radius: var(--global-spacing-12);
}
.border-radius-25 {
  border-radius: var(--global-spacing-25);
}
.border-radius-100 {
  border-radius: var(--global-spacing-100);
}

.border-blue {
  border: 1px solid var(--blue) !important;
}

.border-bottom-blue {
  border-bottom: 1px solid var(--blue) !important;
}
/* -- BORDER END -- */

/* -- BUTTON -- */
/* -- BUTTON END -- */

/* -- GENERAL -- */

/* HEADER */
/* HEADER END */

/* FOOTER */
/* FOOTER END */

/* -- INC BLOCKS -- */

/* gallery */
.gallery-image-container {
  height: 400px;
}
/* gallery end */

/* -- INC BLOCKS END -- */

/* section:first-of-type {
  margin-top: var(--header-height);
} */

.w-125 {
  width: 125% !important;
}

.w-75 {
  width: 75% !important;
}

.w-50 {
  width: 50% !important;
}

.w-66 {
  width: 66% !important;
}

.h-50 {
  height: 50% !important;
}

.vh-100 {
  height: 100vh;
}

.ml-auto {
  margin-left: auto !important;
}
.mr-auto {
  margin-right: auto !important;
}

.hidden {
  opacity: 0;
}

h2,
h3 {
  line-height: 1;
}

.logo-dimensions {
  height: 50px;
}

@media (min-width: 1400px) {
  section .row {
    max-width: 1400px !important;
  }
  section {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
  }
  
  .heading-row,
  .base-row,
  section .row {
    width: 1400px;
  }
  
  /* .breadcrumb {
    padding-inline: 17px;
  } */
}

@media (min-width: 1800px) {
  section .row {
    max-width: 1600px !important;
  }
  .heading-row,
  .base-row,
  section .row {
    width: 1600px;
  }
}

footer {
  margin-top: auto !important;
  height: 67vh;
}

footer > .row {
  height: 66vh;
  position: relative;
  z-index: 1;
}

footer #menu-footer-menu {
  display: flex;
  justify-content: space-between;
  padding-right: var(--global-spacing-100) !important;
}

.image-text-repeater p,
.content-steps p {
  margin-bottom: 20px !important;
}
.image-text-repeater h3 {
  margin-bottom: 40px !important;
}

.full-text .font-size-large-alt p {
  line-height: 1 !important;
}

.text-underline {
  text-decoration: underline !important;
  text-decoration-thickness: 1px !important;
  text-underline-offset: 4px !important;
}
.text-underline.link:hover {
  text-decoration: none !important;
}

.blue-line-separator {
  width: 100%;
  
  border-bottom: 1px solid var(--blue);
}

.img-height {
  height: calc(100vh - 250px);
}
@media (max-width: 992px) {
  .img-height {
    height: auto;
  }
}

.post-card-height {
  height: auto !important;
}
.explore-card.h-100 {
  height: 55vh !important;
}
@media (max-width: 1200px) {
  .single-card .post-card-height {
    height: auto !important;
  } 
}
/* @media (min-width: 1600px) {
  .post-card-height {
    height: 75vh !important;
  }
}
@media (min-width: 1800px) {
  .post-card-height {
    height: 60vh !important;
  }
} */


@media (min-width: 1440px) {
  .logo-soup.vh-100,
  .discover-more.vh-100 {
    height: auto !important;
    min-height: auto !important;
  }
}


.half-opacity {
  opacity: .5 !important;
}

.post-image-overlay {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  mix-blend-mode: lighten;
  opacity: .75;
  filter: grayscale(1);
}


.card-padding {
  padding: var(--global-spacing-25);
}
@media (max-width: 768px) {
  .card-padding {
    padding-inline: 0;
    padding-block: var(--global-spacing-25);
  }
}

.container-padding {
  padding-left: 0 !important;
  padding-right: 0 !important;
}

@media (max-width: 1200px) {
  .container-padding {
    padding-left: calc(var(--bs-gutter-x) * .5) !important;
    padding-right: calc(var(--bs-gutter-x) * .5) !important;
  }
}

.w-fit-content {
  width: fit-content;
}

body {
  max-width: 100vw;
  /* overflow-x: hidden !important; */
}

.link-overlay {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: 10;
}

.alan-link {
  position: absolute;
  top: 42px;
  right: 0;
  padding-inline: var(--global-spacing-15);
  padding-block: var(--global-spacing-10);
  border-bottom-left-radius: var(--global-spacing-50);
  border-top-left-radius: var(--global-spacing-50);
  background-color: var(--blue); 
  font-size: var(--font-size-xxsmall);
  font-family: var(--font-family-apercu-bold);
  z-index: 9999 !important;
}
.alan-link > a {
  color: var(--pink); 
}


/* HEADER */
@media (max-width: 992px) {
  #siteSearchBar {
    top: 40%;
    left: 50%;
    transform: translateX(-50%);
  }
  .header-search::before {
    position: absolute;
    height: 100dvh;
    width: 100dvw;
    background-color: var(--blue);
    opacity: .75;
  }
}

nav.desktop-nav,
header .header-search {
  width: 75vw;
  left: 50%;
  transform: translateX(-50%);
  top: 25px;

  -webkit-box-shadow: 0px 0px 40px 19px rgba(255, 235, 230, 0.75);
  -moz-box-shadow: 0px 0px 40px 19px rgba(255, 235, 230, 0.75);
  box-shadow: 0px 0px 40px 19px rgba(255, 235, 230, 0.75);
}
nav.desktop-nav ul *:not(.main-header-logo) {
  height: min-content;
}

nav.desktop-nav ul *,
nav.desktop-nav ul li *,
footer #menu-footer-menu li a {
  font-family: var(--font-family-apercu-medium) !important;
  font-size: var(--font-size-menu) !important;
  color: var(--blue);
}

.main-header-logo {
  color: transparent !important;
}

nav.desktop-nav ul {
  display: flex;
  justify-content: space-between;
  align-items: center;
}
.main-header-logo {
  width: 140px;
  height: 40px;
}
nav.desktop-nav ul .main-header-logo a {
  color: transparent;
  content: "";
  background-image: url("../assets/images/logos/header-logo.svg");
  background-repeat: no-repeat;
  background-size: contain;
  background-position: center;
  display: block;
  height: 100%;
}

@media (max-width: 1200px) {
  .desktop-nav {
    display: none !important;
  }
}

@media (max-width: 1200px) {
  .hide-on-mobile {
    display: none !important;
  }
}




/* Burger position: relative to body (body already has position-relative) */
.site-burger{
  padding: var(--global-spacing-25);
  z-index:99999; /* above navs */
}

/* Show on mobile only (hide at desktop like your .mobile-nav) */
@media (min-width:1200px){
  .site-burger{ display:none; }
}

/* Button reset + hit area */
.burger-btn{
  display: flex;
  align-items: center;
  height:44px;
  padding:0;
  border:0;
  background:transparent;
  cursor:pointer;
  display: flex;
}
.burger-btn-pink {
  color: var(--pink)
}
.burger-btn-blue {
  color: var(--blue);
}

/* Three lines */
.burger-lines,
.burger-lines::before,
.burger-lines::after{
  content:"";
  display:block;
  width:28px;
  height:2px;
  background:currentColor;
  border-radius:2px;
  transition:transform .2s ease, opacity .2s ease;
}

.burger-lines{
  position:relative;
}

.burger-lines::before{ position:absolute; top:-8px; left:0; }
.burger-lines::after { position:absolute; top: 8px; left:0; }

/* (Optional) animated X state when toggled */
.burger-btn[aria-expanded="true"] .burger-lines{ transform:rotate(45deg); }
.burger-btn[aria-expanded="true"] .burger-lines::before{ transform:rotate(90deg) translateX(0); top:0; }
.burger-btn[aria-expanded="true"] .burger-lines::after{ opacity:0; }



.mobile-nav {
  position: fixed;
  top: 0;
  left: 0;
  height: 100vh;
  width: 100vw;
  transform: translateX(-100%);
}
@media (min-width: 1200px) {
  .mobile-nav {
    display: none !important;
  }
}
/* Animate the slide */
.mobile-nav{
  transition: transform .3s ease;
  z-index: 9999; /* stays above content */
  /* optional: smoother perf */
  will-change: transform;
}

/* Open state */
.mobile-nav.is-open{
  transform: translateX(0);
}

/* Optional: lock page scroll while menu is open */
body.nav-open{
  overflow: hidden;
}

/* Respect reduced motion */
@media (prefers-reduced-motion: reduce){
  .mobile-nav{ transition: none; }
}

.mobile-header-position {
  position: fixed;
  top: 0;
  left: 0;
  width: 100vw;
  height: 75px;
  z-index: 99999999;
  display: flex;
  justify-content: space-between;
  align-items: center;
}
@media (min-width: 1200px) {
  .mobile-header-position {
    display: none !important;
  }
}



.mobile-nav *:not(.alan-link-mobile *) {
  color: var(--pink);
  font-family: var(--font-family-mad-bold);
  font-size: var(--font-size-large);
}
.mobile-nav div ul li {
  padding-bottom: var(--global-spacing-25);
}

.mobile-header-logo {
  width: 140px;
  height: fit-content;
  
  padding: var(--global-spacing-25);
  z-index: 99999;
}
@media (min-width: 1200px) {
  .mobile-header-logo {
    display: none !important;
  }
}

.alan-link-mobile {
  position: absolute;
  bottom: 0;
  left: 0;
  padding: var(--global-spacing-25);
}

.menu-icon-small-width {
  width: 45px;
}
.menu-icon-small-height {
  height: 30px;
}


.accessibility-container {
  display: flex;
  align-items: center;
  height: 75px;
}
.menu-search-btn {
  width: 45px;
}
.menu-accessibility-btn {
  width: 45px
}
.menu-accessibility-btn img {
  width: 25px;
}

/* HEADER END */
/* SEARCH BAR */
header .header-search {
  /* was: display: none; — we’ll use [hidden] instead */
  display: block;
  position: fixed;
  border-radius: 100px;
  height: 64px;
  z-index: 99999;

  /* slide/overlay bits */
  background: #ffebe6;                   /* added so the bar itself is pink */
  box-shadow: 0 4px 20px rgba(0,0,0,.08);/* added */
  opacity: 0;                            /* added */
  transition: transform 220ms ease, opacity 220ms ease; /* added */
}

/* hide via [hidden] attribute */
header .header-search[hidden] { display: none !important; }

/* open state */
header .header-search.is-open {
  opacity: 1;
}

/* Visually hidden but accessible label */
.sr-only {
  position: absolute !important;
  height: 1px; width: 1px;
  overflow: hidden; clip: rect(1px, 1px, 1px, 1px);
  white-space: nowrap; border: 0; padding: 0; margin: -1px;
}

.header-search .search-form {
  width: 100%;
  height: 100%;
}

.header-search .search-field {
  display: block;
  width: 100%;
  height: 100%;                 /* ensure it fills the 64px bar */
  padding: 12px 16px;
  font-size: 1rem;
  line-height: 1.2;
  background: #ffebe6;          /* pink */
  color: #305cde;               /* blue text */
  border: none;
  border-radius: 100px;
  outline: none;
  -webkit-appearance: none;
  appearance: none;
  text-indent: 25px;
}

.header-search .search-field::placeholder {
  color: #305cde;
  opacity: .75;
}

.header-search .search-field:focus {
  outline: 2px solid #305cde;
  box-shadow: 0 0 0 3px rgba(48, 92, 222, 0.2);
}

/* Hide the built-in clear 'x' (optional) */
.header-search .search-field::-webkit-search-cancel-button,
.header-search .search-field::-webkit-search-decoration {
  -webkit-appearance: none;
}

/* Tame Chrome's autofill tint (optional) */
.header-search .search-field:-webkit-autofill {
  -webkit-box-shadow: 0 0 0 1000px #ffebe6 inset;
  -webkit-text-fill-color: #305cde;
}
/* Make sure the container is a positioning context (already fixed) */
header .header-search {
  position: fixed;
}

/* Close button on the right */
.search-close {
  position: absolute;
  top: 50%;
  right: 12px;
  transform: translateY(-50%);
  width: 40px;            /* comfy tap target */
  height: 40px;
  border: 0;
  border-radius: 999px;
  background: transparent;
  color: #305cde;         /* blue to match text */
  font-size: 28px;        /* × size */
  line-height: 1;
  cursor: pointer;
  display: flex;
  padding-top: 2px;
}

/* Keyboard focus ring */
.search-close:focus-visible {
  outline: 2px solid #305cde;
  box-shadow: 0 0 0 3px rgba(48,92,222,.2);
}

/* Give input extra right padding so text doesn't sit under the close button */
.header-search .search-field {
  padding-right: 56px; /* was 16px; add room for the button */
}



/* SEARCH BAR END */


@media (max-width: 1200px) {
  .flex-column-mobile {
    flex-direction: column;
  }
  
  .single-card .content-padding.padding-left-25 {
    padding-left: 0 !important;  
    padding-top: var(--global-spacing-15) !important;
  } 
}

@media (max-width: 1200px) {
  .logo-soup .mt-auto .justify-content-between {
    justify-content: unset !important;
  }
  .logo-soup.vh-100 {
    height: auto !important;
    min-height: auto !important;
  }
}

@media (max-width: 1200px) {
  .hero .row .col-lg-6 .padding-25 .h-100.padding-inline-25 {
    padding-inline: 0 !important;
  }
}

@media (max-width: 1200px) {
  .featured-content .title-padding.padding-25 {
    padding: 0 !important;
  }
}

@media (max-width: 1200px) {
  section {
    padding-block: var(--global-spacing-50);
  }
  section:first-of-type {
    padding-block: 100px;
  }
}

@media (min-width: 992px) {
  .logo-soup img.padding-inline-6.padding-block-12 {
    padding-block: 6px;
  }
}

.menu-search-btn,
button {
  background: transparent !important;
  border: 0 !important;
}

.download-icon {
  height: 25px;
}

.mixitup-control-active {
  background-color: var(--blue) !important;
  color: var(--pink) !important;
}

/* Let MixItUp actually hide targets even if a utility forces display */
#upcoming-container .mix[style*="display: none"],
#past-container .mix[style*="display: none"] {
  display: none !important;
}


/* Breadcrumb */
.breadcrumb-container {
  z-index: 999;
}

.breadcrumb-container.font-blue * {
  color: var(--blue) !important;
}
.breadcrumb-container.font-light-blue * {
  color: var(--light-blue) !important;
}
.breadcrumb-container.font-pink * {
  color: var(--pink) !important;
}

.breadcrumb { margin: 1rem 0; }
.breadcrumb__list {
  list-style: none; 
  margin: 0; 
  padding: 0; 
  display: flex; 
  flex-wrap: wrap; 
  gap: .25rem .5rem;
}
.breadcrumb__list * {
  color: var(--blue) !important;
  font-family: var(--font-family-apercu-regular) !important;
}
.breadcrumb__item { display: inline-flex; align-items: center; }
.breadcrumb__item + .breadcrumb__item::before {
  content: "›"; /* your chevron */
  display: inline-block; 
  margin-left: .5rem;
  margin-right: .75rem;
  opacity: .6;
}
.breadcrumb__link { text-decoration: none; }
.breadcrumb__link:hover { text-decoration: underline; }

@media (max-width: 1200px) {
  .breadcrumb-container .padding-inline-100.padding-bottom-12.padding-top-150 {
    padding-top: 50px;
  }
}
@media (max-width: 992px) {
  .breadcrumb-container .padding-inline-100.padding-bottom-12.padding-top-150 {
    padding-top: 0;
  }
}
/* Breadcrumb END */

/* footer */
#mc_embed_signup .mc-field-group input {
  border: 0 !important;
  background-color: transparent !important;
  border-bottom: 1px solid var(--blue) !important;
  border-radius: 0 !important;
  text-indent: 0 !important;
}

.signup-header {
  font-family: var(--font-family-mad-bold) !important;
  font-size: var(--font-size-medium) !important;
  color: var(--blue) !important;
}

input::placeholder,
.indicates-required {
  color: var(--blue) !important;
}

#mc-embedded-subscribe {
  background-color: transparent !important;
  font-family: var(--font-family-apercu-medium) !important;
  font-size: var(--font-size-xsmall) !important;
  height: auto !important;
  line-height: 1 !important;
  border-radius: 0 !important;
  color: var(--blue) !important;
  padding: 0 !important;
  margin: 0 !important;
  
  padding-top: var(--global-spacing-50) !important;
}
@media (max-width: 992px) {
  #mc-embedded-subscribe {
    padding-top: var(--global-spacing-25) !important;
    padding-bottom: var(--global-spacing-50) !important;
  }
}

#mc_embed_signup form {
  margin: 0 !important;
}

.signup-header {
  width: 50% !important;
}
@media (max-width: 1200px) {
  .signup-header {
    width: 50% !important;
  }
}

#mc_embed_signup * {
  margin: 0 !important;
}

#mc_embed_signup .mc-field-group {
  width: 100% !important;
}

/* anchor the wrapper */
#mc_embed_signup .mc-field-group { position: relative; }

/* target the group that contains the EMAIL input */
#mc_embed_signup .mc-field-group:has(> #mce-EMAIL)::before {
  content: "*";
  position: absolute;
  top: -6px;          /* tweak */
  left: -8px;         /* tweak */
  color: #d93025;
  font-size: 14px;
  line-height: 1;
  font-weight: 700;
  pointer-events: none;
}

/* if the email field is the first group */
#mc_embed_signup .mc-field-group:first-of-type::before {
  content: "*";
  position: absolute;
  top: -6px;
  left: -8px;
  color: #d93025;
  font-size: 14px;
  line-height: 1;
  font-weight: 700;
  pointer-events: none;
}


@media (min-width: 1800px) {
  #mc_embed_signup .mc-field-group {
    padding-bottom: 50px !important;
  }
  .signup-header {
    padding-bottom: 50px !important;
  }
}


/* footer end */

@media (max-width: 992px) {
  .hero .row {
    padding-top: 100px !important;
  }
  
  .discover-more .row .col-lg-4.col-12,
  .discover-more .heading-row .col-12 {
    padding: 0 !important;
  }
}


.alan-link a > span {
  transition: all .2s ease; 
}

.alan-link:hover a > span {
  padding-right: 12px !important;
}


li.current_page_item > a {
  text-decoration: underline !important;
  text-underline-offset: 3px;
}
.menu-item a {
  transition: all .2s ease;
}
.menu-item:hover a {
  text-decoration: underline !important;
  text-underline-offset: 3px;
}



/* Wiggle animation */
@keyframes wiggle {
  0%   { transform: rotate(0deg); }
  15%  { transform: rotate(-12deg) scale(1.02); }
  30%  { transform: rotate(12deg); }
  45%  { transform: rotate(-9deg); }
  60%  { transform: rotate(7deg); }
  75%  { transform: rotate(-4deg); }
  100% { transform: rotate(0deg); }
}

/* Make the icon pivot nicely */
.menu-search-btn img,
.menu-accessibility-btn img {
  display: inline-block;
  transform-origin: 50% 60%;
}

/* Play wiggle once on hover or keyboard focus */
.menu-search-btn:hover img,
.menu-search-btn:focus-visible img,
.menu-accessibility-btn:hover img,
.menu-accessibility-btn:focus-visible img {
  animation: wiggle 0.9s ease both 1;
}

/* Respect reduced motion */
@media (prefers-reduced-motion: reduce) {
  .menu-search-btn:hover img,
  .menu-search-btn:focus-visible img,
  .menu-accessibility-btn:hover img,
  .menu-accessibility-btn:focus-visible img {
    animation: none !important;
  }
}

.do-wiggle { animation: wiggle 1s ease both 1; }

.filter-item:hover {
  background-color: var(--blue) !important;
  color: var(--pink) !important;
}

.base-row a:hover {
  text-decoration: underline !important;
  text-underline-offset: 3px !important;
}

@media (max-width: 992px) {
  .image-text-repeater .text-section {
    order: 2 !important;
  }
  .image-text-repeater .image-section {
    order: 1 !important;
  }
}
@media (max-width: 992px) {
  .featured-content-mobile-padding-top {
    padding-top: var(--global-spacing-50) !important;
  }
  .featured-content-mobile-padding-bottom {
    padding-bottom: var(--global-spacing-50) !important;
  }
}











/* Body lock when overlay open */
.is-a11y-open {
  overflow: hidden;
}

/* Overlay */
.a11y-overlay {
  position: fixed;
  inset: 0;
  z-index: 99999;
  display: flex;               /* center modal */
  align-items: center;         /* vertical center */
  justify-content: center;     /* horizontal center */
}
.a11y-overlay[hidden] { display: none; }

.a11y-overlay__backdrop {
  position: absolute;
  inset: 0;
  background: rgba(0,0,0,.5);
  z-index: 0;                  /* behind panel */
}

.a11y-overlay__panel {
  position: relative;
  z-index: 1;                  /* above backdrop */
  max-width: 640px;
  width: 90%;                  /* responsive width */
  margin: 0;                   /* no auto margins; flex does the centering */
  background: #fff;
  border-radius: 10px;
  padding: 1.5rem;
}

.a11y-overlay__title {
  margin: 0 0 1rem 0;
  font-size: 1.5rem;
}

.a11y-overlay__close {
  position: absolute;
  top: .5rem;
  right: .75rem;
  font-size: 1.5rem;
  line-height: 1;
  background: transparent;
  border: 0;
  cursor: pointer;
}

.a11y-options {
  display: grid;
  gap: 1rem;
  margin: 0; padding: 0;
  list-style: none;
}

.a11y-option {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: .75rem;
  border: 1px solid #eee;
  border-radius: 8px;
  padding: .75rem 1rem;
}

.a11y-option__text p {
  margin: .25rem 0 0 0;
  font-size: .9rem;
  color: #555;
}

.a11y-toggle {
  min-width: 64px;
  border: 1px solid #ccc;
  border-radius: 999px;
  padding: .4rem .8rem;
  background: #f8f8f8;
  cursor: pointer;
}

/* Feature classes applied to <html> */
html.big-text { font-size: 112.5%; }          /* ~18px base if 16px default */
html.hc-contrast { filter: contrast(1.1); }   /* adapt to your palette */
html.reduce-motion * { animation: none !important; transition: none !important; }


/* --- UPDATED: Only hide images explicitly marked toggle-friendly --- */
html.no-images img.toggle-friendly {
  display: none !important;
}

/* Optional: if you also tag non-img elements that render images via background-image,
   add the 'toggle-friendly' class to those elements and this will blank them too. */
html.no-images .toggle-friendly {
  background: none !important;
  background-image: none !important;
}


/* --- BLACK & WHITE (grayscale) mode --- */
/* Applies to the entire page when <html> has class "bw-mode" */
html.bw-mode {
  filter: grayscale(1) !important;         /* make everything grayscale */
}

/* Optional: a touch more contrast (uncomment if you like it punchier) */
/* html.bw-mode { filter: grayscale(1) contrast(1.05) !important; } */

/* --- TEXT-ONLY MODE: hide images, grayscale, force sans-serif --- */
html.text-only {
  filter: grayscale(1) !important;  /* black & white for everything */
}

/* Hide only images you marked as toggle-friendly */
html.text-only img.toggle-friendly {
  display: none !important;
}

/* Also blank backgrounds where you've opted-in with .toggle-friendly */
html.text-only .toggle-friendly {
  background: none !important;
  background-image: none !important;
}

/* Force a plain, readable sans-serif font across the UI */
html.text-only, 
html.text-only body,
html.text-only :where(h1,h2,h3,h4,h5,h6,p,li,a,button,input,select,textarea,blockquote,figcaption,small,strong,em,span,code,pre,nav) {
  font-family: system-ui, -apple-system, "Segoe UI", Roboto, Inter, "Helvetica Neue", Arial, sans-serif !important;
  font-weight: 400;
}
  
  
  /* Standard B&W mode (already in your sheet) */
  html.bw-mode {
    filter: grayscale(1) !important;
  }
  
  /* Inverted B&W mode */
  html.bw-invert {
    filter: grayscale(1) invert(1) !important;
  }
  
  /* Keep media/logos from looking inverted:
     counter-apply invert + grayscale so they look normal (still grayscale) */
  html.bw-invert img:not(.invert-with-ui),
  html.bw-invert picture:not(.invert-with-ui),
  html.bw-invert video:not(.invert-with-ui),
  html.bw-invert canvas:not(.invert-with-ui),
  html.bw-invert svg:not(.invert-with-ui) {
    filter: invert(1) grayscale(1) !important;
  }
  
  /* If you DO want a specific asset to invert with the UI, add .invert-with-ui */


/* Turn on grayscale for everything */
  html.bw-mode { filter: grayscale(1) !important; }
  
  /* Keep your overlay UI from being affected (optional) */
  html.bw-mode .a11y-overlay { filter: none !important; }
  
  html.bw-mode body,
  html.bw-invert body {
    background-color: white !important;
  }
  
  html.bw-invert *,
  html.bw-mode *,
  html.text-only *,
  html.reduce-motion *,
  html.reduce-motion .hero-blur::before,
  html.reduce-motion .explore-card::before {
    box-shadow: none !important;
    filter: none !important;
    backdrop-filter: none !important;
  }

  
  
  p a {
    color: inherit !important;
    text-decoration: underline !important;
    text-underline-offset: 4px !important;
  }
  p a:hover {
    text-decoration: none !important;
  }
  
  
/* Keep col-xxl-3 behaving like 3 cols on 1400–1599px */
  @media (min-width: 1400px) and (max-width: 1599.98px) {
    .col-xxl-3 {
      flex: 0 0 auto;
      width: 33.33333333%;
    }
  }
  
  /* At 1600px+ finally allow 4 cols */
  @media (min-width: 1600px) {
    .col-xxl-3 {
      flex: 0 0 auto;
      width: 25%;
    }
  }

.card-title {
  hyphens: auto;
  -webkit-hyphens: auto;
  -ms-hyphens: auto;
  
  overflow-wrap: break-word;
  word-break: normal;
}

.no-wrap {
  white-space: nowrap !important;
}




















html {
  max-width: 100vw !important;
  overflow-x: hidden !important;
}
@media (max-width: 992px) {
  .container-fluid {
    /* overflow-x: hidden !important; */
  }
}


.vh-100-max {
  max-height: 100vh !important;
}


.single-title-padding,
.breadcrumb-padding {
  padding-block: 100px;
  padding-inline: 100px;
}
@media (max-width: 992px) {
  .single-title-padding,
  .breadcrumb-padding {
    padding-inline: 17px;
    padding-block: 0 !important;
  }
}

a.link {
  text-decoration: underline !important;
  text-underline-offset: 4px; 
}
a.link:hover {
  text-decoration: none !important;
}

.hover-blur {
  /* important: animate the actual property you're changing */
  transition: filter .3s ease;
  will-change: filter;              /* helps the browser prep for animation */
}

a:hover .hover-blur,
.hover-blur:hover {
  -webkit-filter: blur(8px);
  filter: blur(8px);
}