/* ==========================================================================
   Self-hosted font faces for the two preloaded woff2 files above.
   ========================================================================== */

/* ==========================================================================
   FluidText: real text stays hidden until the fluid effect hands it over.
   (not applied when the visitor prefers reduced motion)
   ========================================================================== */
@media (prefers-reduced-motion: no-preference) {
  [data-fluid] { opacity: 0; }
}

/* ==========================================================================
   IRX (i-repair marketing block) — uniquely namespaced custom properties
   ========================================================================== */
.irx-scope {
  --irx-desktop-width: 1250px;
  --irx-desktop-width-m: 1280px;
  --irx-desktop-gutter: 3rem;
  --irx-content-width: var(--irx-desktop-width);
  --irx-bg-layer: linear-gradient(90deg, rgb(0,4,42) 0%, rgb(40,50,145) 37%, rgba(41,51,145,0) 94%);
  --irx-block-col: 4;
  --irx-block-col-tablet: 2;
  --irx-block-col-mobile: 1;
  --irx-block-padding-block: 4rem;
  --irx-block-padding-inline: 2rem;
  --irx-transition: .3s;
  --irx-secondary-color2: #009cff;
  --irx-secondary-color1: #ffffff;
  --irx-primary-color3: #9536e5;
  --irx-base-heading-color: var(--irx-secondary-color1);
  --irx-body-bg: var(--irx-secondary-color4);
  --irx-base-text-color: var(--irx-secondary-color1);
  --irx-secondary-color4: rgb(26, 31, 36);
  --irx-base-text-size: 2rem;
  --irx-base-text-line-height: 1.6;
  --irx-base-text-font-weight: 400;
  --irx-page-gutter: var(--irx-desktop-gutter, 30px);
 --irx-card-media-overlay-bg: #254459;
  --irx-media-ratio: 16 / 9;
  --irx-card-body-padding: 3rem;
  --irx-card-body-padding-mobile: 2rem;
  --irx-card-gap: 3rem;
  --irx-h4-ff: var(--irx-font-secondary);
  --irx-h4-fs: 2.4rem;
  --irx-h4-fsm: 19.99px;
  --irx-h4-lh: 1.2;
  --irx-h4-fw: 700;
  --irx-h4-tt: none;
  --irx-text-wrap: pretty;
  --irx-font-primary: "Good Timing", sans-serif;
  --irx-font-secondary: "GoodTimesRg", sans-serif;
  --irx-min-base-text-size: 16px;
  --irx-card-title-tt: uppercase;
  --irx-card-title-fw: 700;
  --irx-card-title-ls: .05em;
  --irx-card-title-fs: 1.6rem;
  --irx-card-title-fsm: 16px;
  --irx-vertical-gap: var(--irx-desktop-vertical-gap, 2rem);
  --irx-vertical-gap-l: calc(var(--irx-vertical-gap) * 1.5);
  --irx-vertical-gap-s: calc(var(--irx-vertical-gap) / 2);
  --irx-subtitle-width: 50%;
  --irx-subtitle-fw: 400;
  --irx-subtitle-tt: none;
  --irx-subtitle-mb: 0.5em;
  --irx-subtitle-color: var(--irx-secondary-color1);
  --irx-subtitle-ff: var(--irx-font-primary);
  --irx-subtitle-fs: 2.4rem;
  --irx-subtitle-fsm: 16px;
  --irx-subtitle-lh: 1.5;
}

.irx-scope, .irx-scope *, .irx-scope ::before, .irx-scope ::after {
  box-sizing: border-box;
}
.irx-scope p, .irx-scope h1, .irx-scope h2, .irx-scope h3, .irx-scope h4, .irx-scope h5, .irx-scope h6 {
  overflow-wrap: break-word;
}

.irx-scope {
  position: relative;
 /* background-color: var(--irx-body-bg); */
  color: var(--irx-base-text-color);
  font-family: var(--irx-font-primary);
  font-size: clamp(var(--irx-min-base-text-size), 2vw, var(--irx-base-text-size));
  font-weight: var(--irx-base-text-font-weight);
  line-height: var(--irx-base-text-line-height);
  overflow: hidden;
  --tw-bg-opacity: 1;
  background-color: rgb(15 22 27 / var(--tw-bg-opacity));
}

/* Background layer */
.irx-bg {
  z-index: -20;
  pointer-events: none;
  background: var(--irx-bg-layer);
  position: absolute;
  inset: 0;
  overflow: hidden;
}

.irx-wrapper {
  position: relative;
}

/* Container */
.irx-container {
  max-width: calc(var(--irx-content-width) + var(--irx-page-gutter) * 2);
  padding-inline: var(--irx-page-gutter);
  transition: max-width var(--irx-transition), padding var(--irx-transition);
  width: 100%;
  margin-inline: auto;
}

.irx-gutter-bottom-s {
	padding-bottom: var(--irx-vertical-gap-s);
	padding: 89px;
}
/* Heading */
.irx-heading-block {
  --irx-title-mb: 1rem;
}
.irx-heading-block__title {
  font-weight: 700;
  font-family: var(--irx-font-primary);
  line-height: 1.2;
  color: #fff;
  margin-bottom: var(--irx-title-mb);
  text-transform: none;
  letter-spacing: 0;
  font-size: clamp(1.75rem, -0.0714rem + 8.0952vw, 4rem);
}
.irx-heading-block__subtitle {
  font-weight: var(--irx-subtitle-fw);
  font-family: var(--irx-subtitle-ff);
  color: var(--irx-subtitle-color, inherit);
  line-height: var(--irx-subtitle-lh, inherit);
  margin-bottom: var(--irx-subtitle-mb);
  text-transform: var(--irx-subtitle-tt, none);
  letter-spacing: 0;
  font-size: clamp(1rem, 0.5178rem + 2.1428vw, 1.625rem);
}
.irx-text-center {
  text-align: center;
}
.irx-subtitle--custom-width {
  width: 100%;
}
@media (min-width: 1113px) {
  .irx-subtitle--custom-width {
    max-width: var(--irx-subtitle-width);
    display: inline-block;
  }
}

/* Cards grid */
.irx-cards {
  position: relative;
}
.irx-cards__grid {
  column-gap: var(--irx-block-padding-inline);
  display: grid;
  grid-auto-flow: row dense;
  grid-template-columns: repeat(var(--irx-block-col), minmax(0, 1fr));
  row-gap: var(--irx-block-padding-block);
}

.irx-cards__grid > a {
  display: contents;
}

@media (max-width: 991px) {
  .irx-cards__grid {
    grid-template-columns: repeat(var(--irx-block-col-tablet), minmax(0, 1fr));
    row-gap: calc(var(--irx-block-padding-block) * 0.7);
    column-gap: calc(var(--irx-block-padding-inline) * 0.7);
  }
}
@media (max-width: 599px) {
  .irx-cards__grid {
    grid-template-columns: repeat(var(--irx-block-col-mobile), minmax(0, 1fr));
    row-gap: calc(var(--irx-block-padding-block) * 0.5);
  }
}

/* Card */
.irx-card {
  box-shadow: var(--irx-card-shadow, none);
  display: flex;
  flex-direction: column;
  min-height: 100%;
  position: relative;
  transition: transform var(--irx-transition) ease-out, background-color var(--irx-transition);
  --irx-z-overlay: 1;
  --irx-z-media: 0;
  --irx-z-body: 2;
  will-change: transform, opacity;
}

/* Media */
.irx-card__media {
  position: relative;
}
.irx-media {
  overflow: initial;
  margin: 0 auto;
  align-items: flex-start;
  aspect-ratio: var(--irx-media-ratio);
  justify-content: center;
  height: 100%;
  padding: 0;
  transition: transform var(--irx-transition), opacity var(--irx-transition);
  width: 100%;
  display: flex;
}
.irx-media__figure {
  align-items: flex-start;
  aspect-ratio: var(--irx-media-ratio);
  justify-content: center;
  height: 100%;
  width: 100%;
  display: flex;
  overflow: hidden;
  margin: 0 auto;
  position: relative;
}
.irx-media__img {
  --irx-media-width: 90%;
  opacity: .5;
  z-index: 10;
  margin: 0 auto;
  position: relative;
  height: 100%;
  object-fit: contain;
  object-position: 50% 50%;
  max-width: 100%;
  max-height: 100%;
  width: var(--irx-media-width);
  transition: transform .5s, opacity var(--irx-transition);
}

.irx-card__media::after {
  background-image: linear-gradient(45deg, var(--irx-secondary-color2) 0, var(--irx-primary-color3) 100%);
  content: "";
  z-index: 1;
  width: 100%;
  height: 4px;
  transition: height .3s ease-out 50ms;
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
}
.irx-media__figure::after {
  background: var(--irx-card-media-overlay-bg, #000);
  content: "";
  inset: 0;
  pointer-events: none;
  position: absolute;
  z-index: 1;
}

/* Body / title */
.irx-card__body {
	background: none;
	left: 0;
	position: absolute;
	width: 100%;
	z-index: 10;
	/* padding: var(--irx-card-body-padding); */
	color: var(--irx-base-text-color);
	gap: var(--irx-card-gap);
	flex-direction: column;
	display: flex;
	bottom: 6%;
}
@media (max-width: 599px) {
  .irx-card__body {
    padding: var(--irx-card-body-padding-mobile);
  }
}

.irx-card__title {
  font-weight: var(--irx-card-title-fw);
  font-family: var(--irx-h4-ff);
  color: var(--irx-base-heading-color);
  line-height: var(--irx-h4-lh);
  margin-top: 54px !important;
  text-transform: var(--irx-card-title-tt);
  letter-spacing: var(--irx-card-title-ls);
  font-size: clamp(0.825rem, 1.0178rem + 0.4761vw, 1rem) !important;
  word-break: break-word;
  transition: color .3s;
  display: flex;
  align-content: center;
  align-items: center;
  justify-content: center;
  position: relative;
  overflow: hidden;
  z-index: 100;
  text-align: center;
}
@media (max-width: 599px) {
  .irx-card__title {
    margin-top: 20px;
    font-size: 16px;
  }
}

/* Hover reveal (desktop / hover-capable devices only) */
@media (hover: hover) {
  .irx-card:hover {
    z-index: 200;
  }
  .irx-card:hover .irx-card__media {
    overflow: visible;
  }
  .irx-card:hover .irx-media,
  .irx-card:hover .irx-media__figure {
    overflow: visible;
  }
  .irx-card:hover .irx-media__img {
    opacity: 1;
    transform: translateY(-3rem);
    z-index: 5;
  }
  .irx-card:hover .irx-card__media::after {
    height: 100%;
  }
}

/* ==========================================================================
   Intro block
   ========================================================================== */
.irx-intro-section {
	position: relative;
	padding-block: clamp(8.5rem, 2vw, 2rem) clamp(2rem, 4vw, 2rem);
}
.irx-intro-title {
  font-weight: 700;
  font-family: var(--irx-font-primary);
  color: #fff;
  line-height: 1.2;
  margin-bottom: 1.75rem;
  text-transform: none;
  letter-spacing: 0;
  font-size: clamp(1.75rem, -0.0714rem + 8.0952vw, 3rem);
}
.irx-intro-columns {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: clamp(2rem, 5vw, 4rem);
  margin-top: clamp(1.5rem, 3vw, 2.5rem);
  text-align: left;
}
.irx-intro-col {
  min-width: 0;
}
.irx-intro-lead {
  font-weight: 600;
  font-family: var(--irx-font-primary);
  color: #fff;
  font-size: clamp(1.15rem, 0.95rem + 0.9vw, 1.5rem);
  line-height: 1.4;
  margin-bottom: 1.25rem;
}
.irx-intro-subtitles {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  flex-direction: column;
  gap: .85rem;
}
.irx-intro-subtitles__item {
  position: relative;
  text-align: left;
  font-weight: 600;
  font-family: var(--irx-font-primary);
  color: var(--irx-secondary-color2);
  font-size: clamp(1rem, 0.85rem + 0.6vw, 1.25rem);
  line-height: 1;
  padding-left: 1.25rem;
  margin-top: 9px;
}
.irx-intro-subtitles__item::before {
  content: "";
  position: absolute;
  left: 0;
  top: .55em;
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background-image: linear-gradient(45deg, var(--irx-secondary-color2) 0, var(--irx-primary-color3) 100%);
}
.irx-intro-text {
  color: rgba(255, 255, 255, .8);
  line-height: 1.75;
  font-size: clamp(1rem, 0.92rem + 0.3vw, 1.125rem);
}
@media (max-width: 900px) {
  .irx-intro-columns {
    grid-template-columns: 1fr;
    gap: 1.75rem;
  }
}

/* ==========================================================================
   Split content rows
   ========================================================================== */
.irx-scope {
  --irx-content-width-wide: 1250px;
}

.irx-container--wide {
  max-width: calc(var(--irx-content-width-wide) + var(--irx-page-gutter) * 2);
}

.irx-split-section {
  position: relative;
  padding-block: clamp(3rem, 6vw, 6rem);
}

.irx-split-list {
  display: flex;
  flex-direction: column;
  gap: clamp(3.5rem, 7vw, 7rem);
}

.irx-split-row {
  display: flex;
  align-items: center;
  gap: clamp(2rem, 5vw, 5rem);
}
.irx-split-row--reverse {
  flex-direction: row-reverse;
}

.irx-split-media {
  flex: 0 0 40%;
  min-width: 0;
  position: relative;
  overflow: hidden;
  border-radius: 1.25rem;
  aspect-ratio: 5 / 3;
  box-shadow: 0 1.5rem 3rem rgba(0, 0, 0, .35);
  background-color: rgba(255, 255, 255, .03);
}
.irx-split-media__blur {
    position: absolute;
    inset: 0;
    z-index: 1;
    width: 100%;
    height: 100%;
    object-fit: contain;
    filter: blur(0.25rem);
    transform: scale(1.4);
    pointer-events: none;
}
.irx-split-media__img {
  position: relative;
  z-index: 2;
  width: 100%;
  height: 100%;
  object-fit: contain;
  display: block;
}
/* The dissolve canvas takes over the img's exact positioning so the
   transition from canvas → img on completion is seamless. */
.irx-split-media__img.irx-dissolve-canvas {
  position: relative;
  z-index: 2;
  width: 100%;
  height: 100%;
  object-fit: contain;
  display: block;
}
.irx-split-media::after {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 3;
  background: var(--irx-card-media-overlay-bg);
  opacity: .16;
  pointer-events: none;
}

.irx-split-content {
  flex: 1 1 auto;
  min-width: 0;
}
.irx-split-eyebrow {
  display: inline-block;
  font-weight: 700;
  letter-spacing: .18em;
  text-transform: uppercase;
  font-size: .8rem;
  color: var(--irx-secondary-color2);
  margin-bottom: .75rem;
}
.irx-split-title {
  font-weight: 700;
  font-family: var(--irx-font-primary);
  color: #fff;
  line-height: 1.2;
  margin-bottom: 1.25rem;
  font-size: clamp(1.5rem, 1.1rem + 1.6vw, 2rem);
}
.irx-split-text {
  color: rgba(255, 255, 255, .8);
  line-height: 1.75;
  font-size: clamp(1rem, 0.92rem + 0.3vw, 1.125rem);
  max-width: 60ch;
}

@media (max-width: 900px) {
  .irx-split-row,
  .irx-split-row--reverse {
    flex-direction: column;
    align-items: stretch;
    gap: 1.75rem;
  }
  .irx-split-media {
    flex: none;
    width: 100%;
    aspect-ratio: 16 / 8;
  }
  .irx-split-content {
    text-align: left;
  }
}

/* ==========================================================================
   Split-row divider
   ========================================================================== */
.irx-split-divider {
  flex: 0 0 auto;
  align-self: stretch;
  width: clamp(20px, 3.2vw, 40px);
  position: relative;
  display: flex;
}
.irx-split-divider svg {
  width: 100%;
  height: 100%;
  display: block;
  overflow: visible;
}
.irx-split-row--reverse .irx-split-divider svg {
    transform: scaleX(-1);
    position: relative;
    left: -48px;
}
.irx-split-divider .irx-divider-base {
  stroke: rgba(255, 255, 255, 0.22);
  stroke-width: 1.5;
  fill: none;
  vector-effect: non-scaling-stroke;
}
.irx-split-divider .irx-divider-shine {
  stroke: url(#irxShineGradient);
  stroke-width: 1.5;
  fill: none;
  vector-effect: non-scaling-stroke;
  filter: drop-shadow(0 0 4px rgba(255,255,255,0.9)) drop-shadow(0 0 10px rgba(255,255,255,0.5));
}

@media (max-width: 900px) {
  .irx-split-divider {
    display: none;
  }
}

/* ==========================================================================
   NEW: Glass-blurred container for split-content
   - container: blur(20px) only, no background of its own
   - title:     its own radial-gradient background (white tones)
   - border:    5px gold gradient, width 100%, between title and <p>
   - text:      its own radial-gradient background (teal tones)
   ========================================================================== */
.irx-split-content {
  position: relative;
  border-radius: 1.25rem;
  backdrop-filter: blur(20px);
  -webkit-backdrop-filter: blur(20px);
  /* NO background here — the blur alone creates the glass panel */
  overflow: hidden;               /* keeps child backgrounds inside the radius */
}

/* --- TITLE: its own background --- */
.irx-split-content .irx-split-title {
  position: relative;
  margin: 0;                      /* reset */
  padding: 2rem 2rem 1.4rem 2rem;
  background: radial-gradient(
    156.55% 137.61% at 92.14% 10.28%,
    rgba(224, 227, 240, 0.16) 0%,
    rgba(255, 255, 255, 0.13) 46.44%,
    rgba(224, 227, 240, 0) 100%
  );
  border-radius: 1.25rem 1.25rem 0 0;   /* round only the top corners */
}

/* --- BORDER: full-width gold line between title and <p> --- */
.irx-split-content .irx-split-title::after {
  content: "";
  display: block;
  position: absolute;
  left: 0;
  right: 0;
  bottom: 0;
  width: 100%;
  height: 5px;
  background: linear-gradient(
    151deg,
    #B2883E 0%,
    #E0B54D 13.29%,
    #ECD799 18.67%,
    #AB8C40 32.59%,
    #E0B54D 55.9%,
    #C29743 68.27%,
    #FEF2BD 100%
  );
}

/* --- PARAGRAPH: its own background --- */
.irx-split-content .irx-split-text {
  margin: 0;
  padding: 1.6rem 2rem 2rem 2rem;
  max-width: none;
  background: radial-gradient(
    220.32% 112% at 96.55% 147.14%,
    rgba(56, 148, 169, 0.07) 0%,
    rgba(171, 241, 251, 0.06) 46.44%,
    rgba(31, 210, 200, 0) 100%
  );
  border-radius: 0 0 1.25rem 1.25rem;   /* round only the bottom corners */
}

@media (max-width: 900px) {
  .irx-split-content .irx-split-title {
    padding: 1.5rem 1.25rem 1.1rem 1.25rem;
  }
  .irx-split-content .irx-split-text {
    padding: 1.2rem 1.25rem 1.5rem 1.25rem;
  }
}