/* =========================================================
   ST FRANCIS XAVIER HOMEPAGE SETTINGS

   Brand colours are inherited from the global CSS palette.
   Only homepage-specific sizing, imagery and effects belong here.
   ========================================================= */
:root {
  --ifs-header-height: 82px;
  --ifs-footer-height: 154px;
  --ifs-ticker-bg: var(--ifs-primary);
  --ifs-home-overlay: var(--ifs-primary);
  --ifs-home-overlay-deep: var(--ifs-primary-deep);
  --ifs-footer-start: var(--ifs-primary);
  --ifs-footer-middle: var(--ifs-primary-dark);
  --ifs-footer-end: var(--ifs-primary-deep);
  --ifs-card-mask: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAxoAAAHcCAYAAABRbtzSAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAA+tpVFh0WE1MOmNvbS5hZG9iZS54bXAAAAAAADw/eHBhY2tldCBiZWdpbj0i77u/IiBpZD0iVzVNME1wQ2VoaUh6cmVTek5UY3prYzlkIj8+IDx4OnhtcG1ldGEgeG1sbnM6eD0iYWRvYmU6bnM6bWV0YS8iIHg6eG1wdGs9IkFkb2JlIFhNUCBDb3JlIDkuMS1jMDAzIDc5Ljk2OTBhODdmYywgMjAyNS8wMy8wNi0yMDo1MDoxNiAgICAgICAgIj4gPHJkZjpSREYgeG1sbnM6cmRmPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5LzAyLzIyLXJkZi1zeW50YXgtbnMjIj4gPHJkZjpEZXNjcmlwdGlvbiByZGY6YWJvdXQ9IiIgeG1sbnM6eG1wPSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvIiB4bWxuczpkYz0iaHR0cDovL3B1cmwub3JnL2RjL2VsZW1lbnRzLzEuMS8iIHhtbG5zOnhtcE1NPSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvbW0vIiB4bWxuczpzdFJlZj0iaHR0cDovL25zLmFkb2JlLmNvbS94YXAvMS4wL3NUeXBlL1Jlc291cmNlUmVmIyIgeG1wOkNyZWF0b3JUb29sPSJBZG9iZSBQaG90b3Nob3AgMjYuNiAoV2luZG93cykiIHhtcDpDcmVhdGVEYXRlPSIyMDI1LTA1LTE1VDEwOjMzOjMxKzAxOjAwIiB4bXA6TW9kaWZ5RGF0ZT0iMjAyNS0wNS0xNVQxNDowNDoyMyswMTowMCIgeG1wOk1ldGFkYXRhRGF0ZT0iMjAyNS0wNS0xNVQxNDowNDoyMyswMTowMCIgZGM6Zm9ybWF0PSJpbWFnZS9wbmciIHhtcE1NOkluc3RhbmNlSUQ9InhtcC5paWQ6MUYzNTZFNkYzMThEMTFGMDk0Q0VEQkQ3OTI3NTM4ODQiIHhtcE1NOkRvY3VtZW50SUQ9InhtcC5kaWQ6MUYzNTZFNzAzMThEMTFGMDk0Q0VEQkQ3OTI3NTM4ODQiPiA8eG1wTU06RGVyaXZlZEZyb20gc3RS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");
}

/* Base homepage document */
html,
body {
  width: 100%;
  max-width: 100%;
  overflow-x: hidden;
}
body {
  margin: 0;
  color: var(--ifs-white);
  font-family: "Source Sans 3", Arial, sans-serif;
  background: var(--ifs-primary-dark);
}
body.home-page {
  overflow: hidden;
}
img {
  max-width: 100%;
  height: auto;
}
a:focus,
button:focus,
input:focus,
select:focus {
  outline: 4px solid var(--ifs-accent) !important;
  outline-offset: 3px;
}
.page-subtitle {
  display: none !important;
}
.hidden {
  display: none !important;
}

.ifs-skip {
  position: fixed;
  top: -100px;
  left: 18px;
  z-index: 10000;
  padding: 12px 18px;
  background: var(--ifs-white);
  color: var(--ifs-link-highlight-background);
  font-weight: 800;
  border-radius: 0 0 10px 10px;
}
.ifs-skip:focus {
  top: 0;
}

/* Header and navigation */
.ifs-header {
  position: fixed;
  z-index: 150;
  inset: 0 0 auto 0;
  height: var(--ifs-header-height);
  display: flex;
  align-items: center;
  padding-left: clamp(235px, 18vw, 330px);
  padding-right: 86px;
  background: linear-gradient(180deg, rgba(0, 0, 0, 0.48), rgba(0, 0, 0, 0));
  pointer-events: none;
}
.ifs-header > * {
  pointer-events: auto;
}
.ifs-logo-plaque {
  position: absolute;
  left: -58px;
  top: -48px;
  width: clamp(225px, 17vw, 310px);
  height: clamp(225px, 17vw, 310px);
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 32px 14px 14px 32px;
  background: var(--ifs-white);
  color: var(--ifs-primary);
  text-decoration: none;
  border-radius: 50%;
  box-shadow: 0 18px 48px var(--ifs-shadow-medium);
  border: 1px solid color-mix(in srgb, var(--ifs-primary) 14%, transparent);
}
.ifs-logo-plaque:hover,
.ifs-logo-plaque:focus {
  color: var(--ifs-primary);
  text-decoration: none;
}
.ifs-logo-plaque img {
  width: 100%;
  height: 100%;
  max-width: 225px;
  max-height: 225px;
  object-fit: contain;
}
.ifs-nav {
  margin-left: auto;
  padding: 0 !important;
  border: 0 !important;
  box-shadow: none !important;
  background: transparent !important;
}
.ifs-nav .navbar-nav {
  float: none;
  display: flex;
  align-items: center;
  margin: 0;
}
.ifs-nav .navbar-nav > li {
  float: none;
}
.ifs-nav .navbar-nav > li > a {
  padding: 26px 15px;
  color: var(--ifs-white) !important;
  font: 800 clamp(18px,1.0vw,24px) / 1 "Nunito", sans-serif;
  text-shadow: 0 2px 8px rgba(0, 0, 0, 0.55);
  background: transparent !important;
  white-space: nowrap;
}
.ifs-nav .navbar-nav > li > a:hover,
.ifs-nav .navbar-nav > li > a:focus {
  color: var(--ifs-accent) !important;
  background: var(--ifs-shadow-soft) !important;
}
.ifs-nav .dropdown-menu {
  border: 0;
  border-radius: 14px;
  background: rgba(4, 45, 35, 0.96);
  padding: 8px;
  box-shadow: 0 18px 45px var(--ifs-shadow-strong);
}
.ifs-nav .dropdown-menu > li > a {
  padding: 11px 14px;
  border-radius: 8px;
  color: var(--ifs-white);
  font-weight: 700;
}
.ifs-nav .dropdown-menu > li > a:hover {
  background: color-mix(in srgb, var(--ifs-white) 12%, transparent);
  color: var(--ifs-accent);
}
.ifs-menu-toggle {
  display: none;
  margin: 0 0 0 auto;
  padding: 10px 14px;
  border: 0;
  border-radius: 999px;
  background: var(--ifs-primary) !important;
  color: var(--ifs-white) !important;
  font-weight: 800;
  gap: 8px;
  align-items: center;
}

/* Hero slideshow */
.ifs-home {
  position: relative;
  width: 100%;
  height: 100vh;
  min-height: 620px;
  overflow: hidden;
  background: var(--ifs-primary-dark);
}
.ifs-backdrop,
.ifs-overlay {
  position: absolute;
  inset: 0;
}
.ifs-backdrop {
  overflow: hidden;
  background: var(--ifs-primary-dark);
  transform: scale(1.015);
}
/* =========================================================
   HOMEPAGE BACKGROUND SLIDESHOW

   Reusable carousel CSS.

   JavaScript controls which slide is active and changes
   slides every 6 seconds.

   No animation delays or slide-count calculations are
   required in the CSS.
   ========================================================= */


/* =========================================================
   SLIDESHOW CONTAINER
   ========================================================= */

.ifs-backdrop,
.ifs-overlay {
  position: absolute;
  inset: 0;
}

.ifs-backdrop {
  overflow: hidden;
  background: var(--ifs-primary-dark);
  transform: scale(1.015);
}


/* =========================================================
   INDIVIDUAL SLIDES

   All slides begin hidden.

   The scale transition lasts for the full 6-second period,
   producing the slow zoom effect.

   The opacity transition creates the crossfade.
   ========================================================= */

.ifs-backdrop-slide {
  position: absolute;
  inset: 0;

  background-size: cover;
  background-position: center 42%;
  background-repeat: no-repeat;

  opacity: 0;
  z-index: 1;

  transform: scale(1.035);

  transition:
    opacity 1s ease-in-out,
    transform 6s linear;

  will-change: opacity, transform;
}


/* =========================================================
   ACTIVE SLIDE

   JavaScript adds .is-active to the current slide.

   The active slide is always placed above the outgoing slide.
   This ensures the transition from the final slide back to
   slide 1 behaves exactly like every other transition.
   ========================================================= */

.ifs-backdrop-slide.is-active {
  opacity: 1;
  z-index: 2;

  transform: scale(1.1);
}


/* =========================================================
   SLIDESHOW IMAGES

   Change the image filenames for each school.

   Add or remove slide rules to match the number of images
   used on that school's homepage.

   There are NO animation delays to change.
   ========================================================= */
.ifs-backdrop-slide-1 {
  opacity: 1;
  background-image: url("/webcontent/webimage/st francis xavier_web_1op.jpg");
	background-position: top center;
}
.ifs-backdrop-slide-2 {
  background-image: url("/webcontent/webimage/st francis xavier_web_2op.jpg");
}
.ifs-backdrop-slide-3 {
  background-image: url("/webcontent/webimage/st francis xavier_web_3op.jpg");
	background-position: bottom center;
}
.ifs-backdrop-slide-4 {
  background-image: url("/webcontent/webimage/st francis xavier_web_5op.jpg");
	background-position: top center;
}
.ifs-backdrop-slide-5 {
  background-image: url("/webcontent/webimage/st francis xavier_web_6op.jpg");
}
.ifs-backdrop-slide-6 {
  background-image: url("/webcontent/webimage/st francis xavier_web_7op.jpg");
}
.ifs-backdrop-slide-7 {
  background-image: url("/webcontent/webimage/st francis xavier_web_8op.jpg");
	background-position: top center;
}
/* =========================================================
   HOMEPAGE OVERLAY

   Gradient placed over the slideshow so homepage text and
   other content remain readable.
   ========================================================= */

.ifs-overlay {
  z-index: 4;

  background: linear-gradient(
    to bottom,
    transparent 0%,
    transparent 22%,
    color-mix(
      in srgb,
      var(--ifs-home-overlay) 8%,
      transparent
    ) 32%,
    color-mix(
      in srgb,
      var(--ifs-home-overlay) 22%,
      transparent
    ) 45%,
    color-mix(
      in srgb,
      var(--ifs-home-overlay) 50%,
      transparent
    ) 62%,
    color-mix(
      in srgb,
      var(--ifs-home-overlay) 78%,
      transparent
    ) 78%,
    var(--ifs-home-overlay) 100%
  );

  pointer-events: none;
}


/* =========================================================
   REDUCED MOTION

   If the visitor has requested reduced motion, remove the
   fade and zoom transitions.

   The JavaScript will leave the first photograph displayed.
   ========================================================= */

@media (prefers-reduced-motion: reduce) {

  .ifs-backdrop-slide {
    transition: none !important;
    transform: none !important;
  }

  .ifs-backdrop-slide.is-active {
    transform: none !important;
  }

}
/* Welcome content */
.ifs-welcome {
  position: absolute;
  z-index: 5;
  right: clamp(40px, 2vw, 80px);
  top: 40%;
  width: min(390px, 28vw);
  text-shadow: 0 3px 18px rgba(0, 0, 0, 0.42);
}
.ifs-eyebrow {
  display: block;
  margin-bottom: 4px;
  font: 800 clamp(17px, 1.4vw, 23px) / 1 "Nunito", sans-serif;
}
.ifs-welcome h1 {
  margin: 0;
  font: 900 clamp(35px, 3.35vw, 40px) / 1.02 "Nunito", sans-serif;
}
.ifs-welcome p {
  margin: 14px 0 20px;
  font-size: clamp(15px, 1.05vw, 19px);
  line-height: 1.45;
}
.ifs-welcome-button {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  padding: 12px 17px;
  border-radius: 999px;
  background: var(--ifs-accent);
  color: var(--ifs-primary-dark);
  font-weight: 900;
  text-decoration: none;
  text-shadow: none;
  box-shadow: 0 8px 24px var(--ifs-shadow-soft);
}
.ifs-welcome-button:hover,
.ifs-welcome-button:focus {
  color: var(--ifs-primary-dark);
  text-decoration: none;
  transform: translateY(-2px);
}

/* Homepage quick links */
.ifs-quick-links {
  position: absolute;
  z-index: 8;
  left: 50%;
  bottom: calc(var(--ifs-footer-height) + 60px);
  transform: translateX(-50%);
  width: min(1200px, 75vw);
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: clamp(12px, 1.2vw, 22px);
  align-items: stretch;
}
.ifs-quick-card {
  position: relative;
  isolation: isolate;
  height: clamp(150px, 11vh, 185px);
  min-height: 0;
  display: flex;
  align-items: flex-end;
  justify-content: center;
  padding: 18px 13px;
  overflow: hidden;
  border: 0;
  box-shadow: 0 14px 34px var(--ifs-shadow-medium);
  color: var(--ifs-white);
  text-decoration: none;
  transition: transform 0.22s ease, box-shadow 0.22s ease;
  -webkit-mask-image: var(--ifs-card-mask);
  mask-image: var(--ifs-card-mask);
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
  -webkit-mask-position: center;
  mask-position: center;
  -webkit-mask-size: 100% 100%;
  mask-size: 100% 100%;
  border-radius: 26% 18% 24% 20% / 18% 25% 20% 27%;
}
.ifs-quick-card::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: -2;
  background-image: var(--ifs-card-image);
  background-size: cover;
  background-position: center;
  transition: transform 0.35s ease;
}
.ifs-quick-card::after {
  content: "";
  position: absolute;
  inset: 0;
  z-index: -1;
  background: linear-gradient(
    0deg,
    rgba(0, 0, 0, 0.88),
    rgba(0, 0, 0, 0.06) 75%
  );
}
.ifs-quick-card:hover,
.ifs-quick-card:focus {
  color: var(--ifs-white);
  text-decoration: none;
  transform: translateY(-8px) rotate(0);
  box-shadow: 0 20px 45px var(--ifs-shadow-modal);
}
.ifs-quick-card:hover::before {
  transform: scale(1.08);
}
.ifs-quick-card > span {
  display: flex;
  align-items: center;
  gap: 8px;
  font: 900 clamp(15px, 1.15vw, 20px) / 1.1 "Nunito", sans-serif;
  text-align: center;
}
.ifs-quick-card-brand {
  height: clamp(112px, 11vh, 145px);
  background: linear-gradient(135deg, var(--ifs-white), var(--ifs-surface-muted));
  color: var(--ifs-primary) !important;
  align-items: center;
  flex-direction: column;
  justify-content: center;
  gap: 8px;
  text-shadow: none;
}
.ifs-quick-card-brand::before,
.ifs-quick-card-brand::after {
  display: none;
}
.ifs-card-brand-icon {
  width: 62px;
  height: 62px;
  border-radius: 50%;
  display: grid !important;
  place-items: center;
  background: var(--ifs-primary);
  color: var(--ifs-accent);
  font-size: 27px;
}
.ifs-mobile-body {
  display: none;
}

.ifs-access-reset {
  width: 100%;
  background: var(--ifs-primary);
  color: var(--ifs-white);
  border-color: var(--ifs-primary);
}

/* Homepage footer and ticker */
.ifs-footer {
  position: fixed;
  z-index: 120;
  left: 0;
  right: 0;
  bottom: 0;
  height: var(--ifs-footer-height);
  color: var(--ifs-white);
}
.ifs-footer-main {
  height: 108px;
  display: grid;
  grid-template-columns: minmax(220px, 0.9fr) minmax(560px, 2.2fr) minmax(
      190px,
      0.8fr
    );
  align-items: center;
  gap: 24px;
  padding: 10px 26px 8px;
  font-size: 12px;
}
.ifs-trust-mark {
  display: flex;
  align-items: center;
  gap: 12px;
  min-width: 220px;
  color: var(--ifs-white);
  text-decoration: none;
}
.ifs-trust-mark:hover,
.ifs-trust-mark:focus {
  color: var(--ifs-white);
  text-decoration: none;
}
.ifs-trust-mark img {
    max-width: 100%;
    height: auto;
  object-fit: contain;
  border-radius: 8px;
  padding: 5px 10px;
	background: var(--ifs-white);
}
.ifs-trust-motto {
  font-size: 13px;
  font-weight: 900;
  line-height: 1.2;
  max-width: 120px;
}
.ifs-trust-mark small {
  opacity: 0.82;
  margin-top: 3px;
}
.ifs-footer-centre {
  display: grid;
  justify-items: center;
  gap: 9px;
  min-width: 0;
}
.ifs-contact-line {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 8px 20px;
  font-weight: 700;
  text-align: center;
}
.ifs-contact-line i {
  margin-right: 5px;
  color: var(--ifs-accent);
}
.ifs-leadership {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 6px 24px;
  text-align: center;
  line-height: 1.25;
}
.ifs-leadership span {
  white-space: nowrap;
}
.ifs-leadership strong {
  color: var(--ifs-accent);
}
.ifs-copyright {
  text-align: right;
  line-height: 1.35;
}
.ifs-copyright span {
  display: block;
}
.ifs-copyright strong {
  color: var(--ifs-accent);
}
.ifs-news-ticker {
  position: absolute;
  left: 0;
  right: 0;
  bottom: 0;
  height: 46px;
  display: flex;
  align-items: center;
  background: var(--ifs-ticker-bg);
  border-top: 1px solid color-mix(in srgb, var(--ifs-white) 18%, transparent);
  font-size: 17px;
  font-weight: 900;
  overflow: hidden;
}
.ifs-news-label {
  height: 100%;
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 0 28px;
  background: var(--ifs-accent);
  color: var(--ifs-primary-dark);
  flex: 0 0 auto;
  font-size: 16px;
}

.ifs-high-contrast .ifs-overlay {
  background: rgba(0, 0, 0, 0.72);
}
.ifs-high-contrast .ifs-welcome,
.ifs-high-contrast .ifs-footer {
  filter: contrast(1.25);
}

/* St Ambrose bespoke branding */
.ifs-logo-plaque {
  border: 8px solid color-mix(in srgb, var(--ifs-white) 72%, transparent);
  box-shadow: 0 20px 55px color-mix(in srgb, var(--ifs-primary-deep) 35%, transparent);
}
.ifs-logo-plaque img {
  mix-blend-mode: multiply;
}
.ifs-contact-line a {
  color: var(--ifs-white);
  text-decoration: none;
  font-weight: 700;
}
.ifs-contact-line a:hover,
.ifs-contact-line a:focus {
  color: var(--ifs-accent);
  text-decoration: underline;
}

@media (max-width: 1200px) {
  .ifs-header {
    padding-left: 230px;
    padding-right: 76px;
  }
  .ifs-logo-plaque {
    width: 235px;
    height: 235px;
    padding: 64px 30px 30px 64px;
    left: -52px;
    top: -52px;
  }
  .ifs-logo-plaque img {
    width: 145px;
    height: 145px;
    max-width: none;
    max-height: none;
  }
  .ifs-nav .navbar-nav > li > a {
    padding-left: 10px;
    padding-right: 10px;
    font-size: 13px;
  }
  .ifs-welcome {
    right: 85px;
    width: 330px;
  }
  .ifs-quick-links {
    width: 82vw;
  }
}

@media (max-width: 1000px) {
  body.home-page {
    overflow: auto;
  }
  .ifs-header {
    position: absolute;
    height: 78px;
    padding: 0 18px;
    background: color-mix(in srgb, var(--ifs-primary-dark) 96%, transparent);
  }
  .ifs-logo-plaque {
    position: relative;
    left: auto;
    top: auto;
    width: 66px;
    height: 66px;
    padding: 4px;
    background: var(--ifs-white);
    border-radius: 50%;
    box-shadow: none;
  }
  .ifs-logo-plaque img {
    width: 58px;
    height: 58px;
    max-width: none;
    max-height: none;
    border-radius: 50%;
  }
  .ifs-menu-toggle {
    display: flex;
  }
  .ifs-nav {
    position: absolute;
    top: 78px;
    left: 0;
    right: 0;
    margin: 0 !important;
    padding: 10px 18px 18px !important;
    background: color-mix(in srgb, var(--ifs-primary-dark) 99%, transparent) !important;
    border-radius: 0 0 18px 18px !important;
  }
  .ifs-nav .navbar-nav {
    display: block;
  }
  .ifs-nav .navbar-nav > li > a {
    padding: 13px 12px;
    font-size: 15px;
  }
  .ifs-home {
    height: auto;
    min-height: 100vh;
    overflow: visible;
    padding: 80px 18px 165px;
  }
  .ifs-backdrop {
    position: fixed;
    background-position: center;
  }
  .ifs-overlay {
    position: fixed;
    background: linear-gradient(
      0deg,
      color-mix(in srgb, var(--ifs-primary-deep) 92%, transparent),
      color-mix(in srgb, var(--ifs-primary-deep) 24%, transparent)
    );
  }
  .ifs-welcome {
    position: relative;
    right: auto;
    top: auto;
    width: min(620px, 100%);
    margin: 8vh auto 40px;
    text-align: center;
  }
  .ifs-welcome h1 {
    font-size: clamp(42px, 8vw, 66px);
  }
  .ifs-quick-links {
    position: relative;
    left: auto;
    bottom: auto;
    transform: none;
    width: min(760px, 100%);
    margin: 0 auto;
    grid-template-columns: repeat(2, 1fr);
    gap: 18px;
  }
  .ifs-quick-card {
    height: 170px;
    min-height: 0;
    transform: none !important;
  }
  .ifs-quick-card:last-child {
    grid-column: 1/-1;
    height: 140px;
    min-height: 0;
  }
  .ifs-mobile-body {
    display: block;
    position: relative;
    z-index: 2;
    width: min(760px, 100%);
    margin: 26px auto 0;
    padding: 22px;
    border-radius: 20px;
    background: color-mix(in srgb, var(--ifs-white) 96%, transparent);
    color: var(--ifs-ink);
  }
  .ifs-mobile-body:empty {
    display: none;
  }
  .ifs-footer {
    position: relative;
    height: auto;
  }
  .ifs-footer-main {
    height: auto;
    grid-template-columns: 1fr;
    padding: 24px 20px 18px;
    text-align: center;
    gap: 15px;
  }
  .ifs-trust-mark {
    justify-content: center;
  }
  .ifs-contact-line {
    flex-direction: column;
    gap: 5px;
  }
  .ifs-leadership {
    padding: 12px 0;
    border-left: 0;
    border-top: 1px solid color-mix(in srgb, var(--ifs-white) 25%, transparent);
    border-bottom: 1px solid color-mix(in srgb, var(--ifs-white) 25%, transparent);
  }
  .ifs-leadership span {
    white-space: normal;
  }
  .ifs-copyright {
    text-align: center;
  }
  .ifs-news-ticker {
    position: relative;
    height: 46px;
  }
}

@media (max-width: 560px) {
  .ifs-header {
    height: 72px;
  }
  .ifs-logo-plaque {
    width: 60px;
    height: 60px;
    padding: 4px;
  }
  .ifs-logo-plaque img {
    width: 52px;
    height: 52px;
  }
  .ifs-nav {
    top: 72px;
  }
  .ifs-home {
    padding: 72px 12px 70px;
  }
  .ifs-welcome {
    margin-top: 5vh;
  }
  .ifs-welcome p {
    font-size: 16px;
  }
  .ifs-quick-links {
    grid-template-columns: 1fr;
  }
  .ifs-quick-card,
  .ifs-quick-card:last-child {
    grid-column: auto;
    height: 155px;
    min-height: 0;
  }
}

@media (prefers-reduced-motion: reduce) {
  *,
  *::before,
  *::after {
    scroll-behavior: auto !important;
    animation: none !important;
    transition: none !important;
  }
}

/* =========================================================
   ST FRANCIS XAVIER MOBILE HOMEPAGE LAYOUT
   Add at the bottom of the site CSS
   ========================================================= */

@media (max-width: 767px) {


  /* ---------------------------------------------------------
     1. Allow the homepage sections to flow normally
     --------------------------------------------------------- */

  .ifs-home {
    min-height: 0;
    padding-bottom: 0;
    overflow: visible;
    background: var(--ifs-white);
  }

  /* ---------------------------------------------------------
     2. Move the slideshow into its own area at the top
     --------------------------------------------------------- */

  .ifs-home .ifs-backdrop {
    position: relative;
    inset: auto;

    width: 100%;
    height: clamp(250px, 72vw, 390px);

    overflow: hidden;
    background: var(--ifs-primary-deep);
  }

  .ifs-home .ifs-backdrop-slide {
    background-size: cover;
    background-position: center center;
    background-repeat: no-repeat;

    transform: none;
  }

  /* Remove the full-page mask from the mobile layout */

  .ifs-home > .ifs-overlay {
    display: none;
  }

  /* ---------------------------------------------------------
     3. Welcome section underneath the slideshow
     --------------------------------------------------------- */

  .ifs-home .ifs-welcome {
    position: relative;
    inset: auto;
    z-index: 2;

    width: 100%;
    max-width: none;
    min-height: 0;

    padding: 32px 20px 28px;
    margin: 0;

    text-align: center;
    color: var(--ifs-white);

    background:
      linear-gradient(
        145deg,
        var(--ifs-primary-mid) 0%,
        var(--ifs-primary-alt) 55%,
        var(--ifs-primary-deep) 100%
      );
  }

  .ifs-home .ifs-welcome .ifs-eyebrow {
    display: block;
    margin-bottom: 5px;
  }

  .ifs-home .ifs-welcome h1 {
    margin: 0 auto 14px;

    font-size: clamp(2.2rem, 10vw, 3.5rem);
    line-height: 0.98;
  }

  .ifs-home .ifs-welcome p {
    margin: 0;
    font-size: 1.05rem;
    line-height: 1.5;
  }

  /* ---------------------------------------------------------
     4. Quick links underneath the welcome section
     --------------------------------------------------------- */

  .ifs-home .ifs-quick-links {
    position: relative;
    inset: auto;
    z-index: 2;

    display: grid;
    grid-template-columns: 1fr;
    gap: 18px;

    width: 100%;
    max-width: none;

    padding: 22px 14px 34px;
    margin: 0;

            background: linear-gradient(75deg, var(--ifs-primary-mid) 0, var(--ifs-primary-alt) 55%, var(--ifs-primary-deep) 100%);
  }

  .ifs-home .ifs-quick-card {
    width: 100%;
    height: auto;
    min-height: 210px;
    margin: 0;

    background-image:
      linear-gradient(
        var(--ifs-card-overlay-top),
        rgba(43, 11, 21, 0.52)
      ),
      var(--ifs-card-image);

    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;

    border-radius: 46px 10px 46px 10px;
  }

  .ifs-home .ifs-quick-card span {
    padding: 18px 20px;
  }

  /* ---------------------------------------------------------
     5. Move the utility buttons above the news ticker
     --------------------------------------------------------- */

  #sideUtility {
    bottom: 74px;
  }

 /* =========================================================
   MOBILE FOOTER, NEWS TICKER AND UTILITY BUTTON FIX
   ========================================================= */

  /* Remove the unwanted space after the news ticker */
  .ifs-footer {
    padding-bottom: 0 !important;
    margin-bottom: 0 !important;
  }

  /*
   * Put the protective space inside the main footer area.
   * The news ticker will therefore remain the final item.
   */
  .ifs-footer-main {
    padding-bottom: 130px !important;
  }

  /* Keep the news ticker at the absolute bottom of the footer */
  .ifs-news-ticker {
    position: relative;
    z-index: 20;

    width: 100%;
    min-height: 52px;

    margin: 0 !important;
    bottom: auto !important;
  }

  /* Make the yellow label an icon-only square */
  .ifs-news-label {
    display: flex;
    align-items: center;
    justify-content: center;

    width: 58px;
    min-width: 58px;
    height: 52px;

    padding: 0 !important;

    /*
     * Hides the plain "Latest News" text while keeping
     * it available in the existing HTML.
     */
    font-size: 0 !important;
    line-height: 1;
  }

  .ifs-news-label i {
    display: block;

    margin: 0 !important;

    font-size: 1.3rem !important;
    line-height: 1;
  }

  /* Allow the scrolling headline to use the remaining width */
  .ifs-news-window {
    flex: 1 1 auto;
    min-width: 0;
  }

  /*
   * Position the utility buttons above the ticker.
   * The ticker is approximately 52px high.
   */
  #sideUtility {
    bottom: 68px !important;
    z-index: 1000;
  }
}


/* =========================================================
   DESKTOP HEIGHT RESPONSIVE LAYOUT
   Prevent quick links overlapping the fixed footer
   ========================================================= */

@media (min-width: 1001px) {
  html,
  body {
    width: 100%;
    height: 100%;
    overflow: hidden !important;
  }

  /*
   * Important:
   * Remove the original 620px minimum height on desktop.
   */
  .ifs-home {
    width: 100%;
    height: 100vh !important;
    min-height: 0 !important;
    overflow: hidden;
  }

  /*
   * Keep the cards a consistent size.
   */
  .ifs-quick-card {
    height: 150px !important;
    min-height: 150px !important;
    max-height: 150px !important;
  }

  /*
   * Normal position:
   * 154px footer + 60px clearance.
   */
  .ifs-quick-links {
    bottom: calc(
      var(--ifs-footer-height, 154px) + 60px
    ) !important;
  }
}

/* Move the cards higher on moderately shallow screens */
@media (min-width: 1001px) and (max-height: 850px) {
  .ifs-quick-links {
    bottom: calc(
      var(--ifs-footer-height, 154px) + 82px
    ) !important;
  }
}

/* Move the cards higher again */
@media (min-width: 1001px) and (max-height: 750px) {
  .ifs-quick-links {
    bottom: calc(
      var(--ifs-footer-height, 154px) + 102px
    ) !important;
  }

  .ifs-welcome {
    top: 30%;
  }
}

/* Very shallow desktop screens */
@media (min-width: 1001px) and (max-height: 660px) {
  .ifs-quick-links {
    bottom: calc(
      var(--ifs-footer-height, 154px) + 122px
    ) !important;
  }

  .ifs-welcome {
    top: 20%;
  }
}