@charset "UTF-8";
:root {
  --color-primary: #131b30;
  --color-secondary: #30b3e9;
  --color-secondary-hover: #60d1fa;
  --heading-letter-spacing: -0.03125rem;
  --heading-font: "Archivo Black", Arial, Helvetica, sans-serif;
  --logo-width: 13.5rem; /* 216px */
  --logo-height: 3.3625rem; /* 53.8px */
  --header-padding-mobile: 0.75rem; /* ~12px (top + bottom used below) */
  --header-height-mobile: calc(var(--logo-height) + (var(--header-padding-mobile) * 2));
}

/* ========== GLOBAL TYPOGRAPHY ==========
(Keep Arial site-wide; bold hero H1 uses 'Archivo Black') */
html {
  font-family: Arial, Helvetica, sans-serif;
  color: var(--color-primary);
}

a {
  color: var(--color-primary);
}

a:hover {
  color: var(--color-secondary);
}

p {
  color: var(--color-primary);
}

.cta-content p {
  color: #fff;
}

.twi_paragraph-bold, .twi_paragraph-bold a {
  color: var(--color-primary);
}

/* ========== ICON: SQUARE ARROW RIGHT (moved from inline SVG) ========== */
/* gulp SVG compressor adds random prefix to symbol layers */
#icon-chevron-right-new path[class$=square] {
  fill: currentColor;
}

#icon-chevron-right-new path[class$=arrow] {
  fill: #fff;
}

/* ========== HEADINGS TYPOGRAPHY OVERRIDE ========== */
h1, h2, h3, h4, h5, h6,
.feature-boxes .feature-box__link,
.card.card__events .card--date,
.card.card__events .card--category {
  font-family: "Archivo Black", Arial, Helvetica, sans-serif !important;
}

h1, h2, h3, h4, h5, h6 {
  font-weight: 800;
  letter-spacing: var(--heading-letter-spacing);
}

.feature-boxes .feature-box__link {
  color: var(--color-primary);
  font-weight: 800;
  letter-spacing: 0.16rem;
}

.feature-boxes .feature-box__link:hover {
  color: var(--color-secondary);
}

.feature-boxes .feature-box__link:hover .bdicon .bqsar__background {
  fill: var(--color-secondary);
}

.card.card__events {
  border: 5px solid var(--color-primary);
  position: relative !important;
  float: left;
  width: 384px;
  background: #fff;
  z-index: 1;
  padding: 2.2rem;
  box-shadow: 0 6px 17px 0 rgba(0, 0, 0, 0.06);
  margin: 16px;
}

.card.card__events .card--category {
  font-size: 0.775rem;
  color: var(--color-secondary);
  text-transform: uppercase;
  font-weight: 800;
  letter-spacing: 0.11rem;
}

.card.card__events .card--date {
  font-weight: normal;
  color: var(--color-primary);
  font-size: 2.2rem;
}

.card.card__events .card--description a {
  color: var(--color-primary);
  font-size: 1.7rem;
  line-height: 1.2;
  padding: 2.925rem 0 4.675rem;
}

.card.card__events .card--description a .card--indicator {
  border-bottom: 59px solid var(--color-primary);
}

section.bg-cubes {
  background-image: none;
  padding-bottom: 0;
}

.latest-media {
  margin-bottom: 0;
}

.section-title h2 {
  font-size: 2.375rem;
  line-height: 2.5rem;
  font-weight: 800;
  margin: 0;
  letter-spacing: -0.13125rem;
}

.section-title .media-link {
  color: var(--color-secondary);
}

/* Hero base styles - consolidated */
.hero {
  width: 100%;
  height: 36rem; /* Using rem value from second declaration */
  position: relative;
  top: -112px;
  margin-bottom: -3rem; /* Using value from second declaration */
  z-index: 100;
  clip-path: polygon(0 0, 100% 0, 100% 100%, 0 100%);
}

.hero .hero-slider .hero-slide .hero-slide_content {
  font-family: var(--heading-font);
}

.hero .hero-slider .hero-slide .hero-slide_content:before {
  display: none;
}

.hero .hero-slider .hero-slide .hero-slide_content h1 {
  color: #fff;
  font-size: 1.95rem;
  line-height: 3.125rem;
  text-transform: uppercase;
  margin: 0;
  letter-spacing: 0.2rem;
}

.hero .large-5 {
  width: 100%;
}

/* ========== ICON COLOURS (consolidated) ========== */
.footer .icon:not(.footer__icon):not(.footer__social-icon),
.quick-links .icon-globe,
.quick-links .icon-person,
.quick-links .icon-chevron-down,
.megamenu .social-icons .social-icons__item svg,
.social-share__list.social-share--vertical .social-share__link .icon,
.social-share__list .social-share__link .icon,
.megamenu .megamenu__menu .nav__chevron .nav__chevron-icon {
  fill: var(--color-primary);
}

.footer.rb .footer__contact p {
  color: #fff;
}

/* ========== HEADER SEARCH TOGGLE (replaces triangle) ========== */
.header__search-toggle {
  position: absolute;
  top: 60px;
  right: 52px;
  z-index: 300;
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
  background: transparent;
  border: 0;
  padding: 1rem; /* rem-calc(16) equivalent at build time */
  cursor: pointer;
  display: none;
}

@media only screen and (min-width: 74.5em) { /* matches large breakpoint */
  .header__search-toggle {
    display: inline-flex;
    align-items: center;
    gap: 0.625rem;
  }
}
.header__search-toggle .icon-search {
  fill: #fff;
  height: 1.21875rem;
  width: 1.21875rem;
}

.header__search-toggle .header__search-label {
  color: #fff;
  font-weight: 600;
  font-size: 1rem;
}

.header__search-toggle:focus-visible {
  outline: 2px solid #2a8ed6;
  outline-offset: 2px;
}

.header__search-toggle:hover .icon-search {
  fill: #f2f2f2;
}

/* ========== HERO (colours + remove angles) ========== */
.hero .contact {
  background: var(--color-primary);
  clip-path: polygon(0 100%, 100% 0, 100% 100%, 0 100%);
}

.hero .contact:focus,
.hero .contact:hover {
  background: var(--color-secondary);
}

@media only screen and (min-width: 74.5em) {
  .hero {
    clip-path: polygon(0 0, 100% 0, 100% 100%, 0 100%);
  }
  .feature-boxes .feature-box,
  .feature-boxes .feature-box:first-child,
  .feature-boxes .feature-box:last-child {
    top: 0px;
  }
  .header .header__bar .header__logo {
    padding-top: 0.3125rem;
    padding-right: 0;
  }
  .header .header__bar {
    display: flex;
    align-items: center;
    justify-content: space-between;
  }
  .header .header__nav-desktop {
    flex: 1;
  }
  .header {
    margin-right: 0;
  }
  .section-title .latest-media-title-heading {
    padding-left: 0;
  }
}
/* ========== HEADER LOGO SIZE OVERRIDE ========== */
.header__logo .logo__link {
  display: inline-block;
  width: 13.5rem;
  height: 3.3625rem;
}

/* Consolidated logo icon rules */
.header__logo .logo__link .icon.icon-logo,
.header .header__bar .logo__link .icon.icon-logo {
  width: 100%;
  height: 100%;
}

.blue-content-area {
  background: var(--color-primary) !important;
}

/* Consolidated .top-left-down.bottom-left-up rules */
.top-left-down.bottom-left-up {
  margin-bottom: 2rem;
  margin-top: 2rem !important;
}

.top-left-down.bottom-left-up.mask-bg {
  background: var(--color-primary) !important;
  margin-bottom: 3rem; /* Overrides base margin-bottom */
  min-height: auto !important;
  padding: 0 !important;
}

.top-left-down.bottom-left-up.mask-bg p {
  color: #fff;
}

.latest-media .ui-card {
  box-shadow: none !important;
  width: 380px;
  margin: 3rem 1rem; /* Standard mobile margins */
}

.ui-card .ui-card__content.ui-card__content--clip {
  clip-path: polygon(0 0, 100% 0%, 100% 100%, 0 100%);
}

.ui-card .ui-card__content, .ui-card__text {
  color: var(--color-primary);
}

/* Desktop: Calculated spacing for 3 cards in 1224px */
@media (min-width: 1024px) {
  .latest-media .ui-card {
    margin: 3rem 24px; /* Clean round number */
  }
  .latest-media .ui-card:first-child {
    margin-left: 0;
  }
  .latest-media .ui-card:nth-child(3) {
    margin-right: 0;
  }
  .latest-media .ui-card:nth-child(n+4) {
    display: none;
  }
}
.ui-card .ui-card__content.ui-card__content--clip {
  clip-path: polygon(0 0, 100% 0%, 100% 100%, 0 100%);
}

.ui-card .ui-card__content, .ui-card__text {
  color: var(--color-primary);
}

.cta-button {
  background-color: var(--color-secondary) !important;
}

.cta-button:hover {
  background-color: var(--color-secondary-hover) !important;
}

.floating-cta {
  background-color: var(--color-primary) !important;
}

/* ========== BACK TO TOP ========== */
/* ========== MASKED/ANGLED BACKGROUNDS (generic kill switch) ========== */
.mask-bg:before {
  background-color: #131b30;
}

/* Common angle helper classes (flatten them globally) */
.top-left-up,
.top-left-up.bottom-left-down,
.top-right-up,
.top-right-up.bottom-right-down,
.bottom-left-down,
.bottom-right-down,
.top-left-down,
.top-left-down.bottom-left-up,
.bottom-left-up,
.parallax-window,
.parallax-mirror,
.tag,
.dialog--experts img.avatar {
  clip-path: none !important;
}

.ui-card .ui-card__image,
.ui-card .ui-card__image::before,
.ui-card .ui-card__image::after,
.ui-card .ui-card__type,
.ui-card .ui-card__type::before,
.ui-card .ui-card__type::after,
.ui-card:hover .ui-card__image,
.ui-card:hover .ui-card__type {
  clip-path: polygon(0 0, 100% 0, 100% 100%, 0 100%);
}

/* Also guard against hover states re-applying angles */
/* .ui-card:hover .ui-card__image,
.ui-card:hover .ui-card__type {
  -webkit-clip-path: none !important;
  clip-path: none !important;
} */
/* ========== LIST BULLETS (site-wide) ========== */
/* .main li:before { background: #52d0fd; }
.main li:after { background: #334779; } */
.main li:before {
  content: "";
  position: absolute;
  top: 8px;
  left: 10px;
  height: 10px;
  width: 10px;
  background: #30b3e9;
  transform: none;
  border-radius: 2px;
}

.main li:after {
  display: none;
}

/* ========== FEATURE BOXES (spacing + colours) ========== */
.feature-boxes {
  margin: 3.3rem 0;
}

.feature-boxes .feature-box {
  padding-left: 0;
}

.feature-boxes .feature-box__content:after,
.feature-boxes .feature-box__content:before {
  display: none;
}

.feature-boxes .feature-box__content {
  padding-left: 0;
}

/* ===== sys_nav updates (spacing, alignment, logo behavior) ===== */
/* Header bar spacing (no fixed height) */
.header__nav-mobile .header__bar,
.header .header__bar {
  padding: var(--header-padding-mobile) 0;
}

/* Header logo container visibility */
.header .header__bar .header__logo {
  display: block;
}

/* Clickable area must match intended logo size */
.header .header__bar .logo__link,
.header__nav-mobile .header__bar .logo__link {
  display: block;
  width: var(--logo-width);
  height: var(--logo-height);
  line-height: 0;
  overflow: hidden;
}

/* SVG fills container, keeping aspect ratio */
.header .header__bar .header__logo .icon.icon-logo,
.header__nav-mobile .header__bar .header__logo .icon.icon-logo {
  width: 100%;
  height: 100%;
  display: block;
  -o-object-fit: contain;
  object-fit: contain;
  -o-object-position: left center;
  object-position: left center;
  fill: #fff;
}

.header.nav--active .header__bar .header__logo .icon.icon-logo,
.header__nav-mobile.nav--active .header__bar .header__logo .icon.icon-logo {
  fill: var(--color-primary);
}

/* Desktop nav spacing and distribution */
.header .header__nav-desktop .nav__list .nav__item:first-child {
  margin: 0 0.5rem 0 1rem;
}

.header .header__nav-desktop .nav__list .nav__item {
  margin: 0 0.5rem;
}

.header .header__nav-desktop .nav__list {
  display: flex;
  align-items: center;
  justify-content: space-evenly;
  flex-wrap: nowrap;
  padding-left: 0;
}

/* Align logo with nav on wide screens */
/* Mobile menu logo color when active */
.header__nav-mobile.nav--active .header__logo .icon-logo {
  --logo-stroke-color: #0161AA;
  --logo-fill-color: #0161AA;
}

.header__nav-mobile.nav--active .header__bar .header__logo .icon-logo {
  fill: var(--logo-fill-color);
}

/* Very small screens: shrink header logo to fit */
@media (max-width: 391px) {
  :root {
    --logo-width: 11rem;
    --logo-height: 2.75rem;
  }
  .header__logo .logo__link {
    width: var(--logo-width);
    height: var(--logo-height);
  }
}
/* ===== hero updates (layout/controls/utilities) — h1 intentionally excluded ===== */
/* Light shadow on hero headings */
/* Keep readable line breaks in hero title on larger screens; allow natural wrap on small */
.hero .hero-slide_content h1 {
  text-wrap: balance;
}

/* Hide small manual line breaks on small screens */
@media (max-width: 640px) {
  .hero .br-sm-hide {
    display: none;
  }
  .hero .hero-slider .hero-slide {
    height: auto;
  }
  .row--hero-logo {
    bottom: 1rem;
  }
  .technical-excellence-logo {
    width: 5.19rem;
    height: 1.44rem;
    opacity: 0.9;
  }
  .hero .hero-slider .hero-slide .hero-slide_content {
    position: relative !important;
    top: calc(50% - 200px);
    transform: none !important;
    margin-top: 0;
    padding-top: 6rem;
    padding-bottom: 2rem;
    z-index: 5;
  }
  /* Add subtle gradient background on mobile for readability */
  .hero .hero-slider .hero-slide .hero-slide_content::before {
    content: "";
    position: absolute;
    top: 0;
    left: -1rem;
    right: -1rem;
    bottom: 0;
    background: linear-gradient(to bottom, rgba(0, 0, 0, 0.6) 0%, rgba(0, 0, 0, 0.4) 50%, rgba(0, 0, 0, 0.3) 100%);
    z-index: -1;
    border-radius: 8px;
  }
  .hero .hero-slider {
    height: auto;
    min-height: 100%;
  }
  .hero .hero-slider .hero-slide {
    min-height: 400px;
    display: flex;
    align-items: flex-start;
  }
  .hero .hero-slide .row {
    width: 100%;
    position: relative;
    padding-bottom: 3rem;
  }
  /* Keep H2 mobile sizing from wjexpo (H1 intentionally excluded) */
  .hero .hero-slider .hero-slide .hero-slide_content h2 {
    font-size: clamp(1rem, 5.5vw, 1.25rem);
    line-height: 1.3;
    margin-top: 0.25rem;
    overflow-wrap: anywhere;
    word-break: break-word;
    -webkit-hyphens: auto;
    hyphens: auto;
  }
}
/* Fixed-width hero text container until viewport drops below 640px */
/* Make hero slide the positioning context for content */
.hero .hero-slider .hero-slide {
  position: relative;
  height: 100%;
}

/* Make hero row the positioning context so logo aligns to content area */
.hero .hero-slide .row {
  position: relative;
  height: 100%;
}

/* Position search input on hero search results to match design */
.hero .hero-slider .hero-slide .hero-slide_content.hero-slide_content-search.search--listing {
  top: 190px !important;
  left: 50%;
  transform: translateX(-50%);
  margin: 0;
  height: auto;
}

.hero .hero-slider .hero-slide .hero-slide_content.hero-slide_content-search.search--listing.careers--listing {
  top: 240px !important;
  height: auto;
}

.search__input.careers__input .site-search__button {
  background-color: inherit;
  height: 42px;
}

/* Prevent layout shift at <=640px where transform is removed globally */
@media (max-width: 640px) {
  .hero .hero-slider .hero-slide .hero-slide_content.hero-slide_content-search.search--listing {
    position: relative !important;
    top: 0; /* anchor within normal document flow */
    left: 0; /* reset centering by left/transform */
    right: 0;
    transform: none;
    margin: 0 auto; /* center via auto margins */
    padding: 0 1rem; /* small side padding on mobile */
  }
  .hero .hero-slider .hero-slide .search__input,
  .hero .hero-slider .hero-slide .search-input {
    width: 100%;
  }
  /* Keep icon from wrapping under input on small screens */
  .hero .hero-slider .hero-slide .search__input {
    position: relative;
    max-width: 100%;
  }
  .hero .hero-slider .hero-slide .search__input input {
    width: 100% !important;
    box-sizing: border-box;
    padding-right: 56px; /* space for icon button */
    display: block;
  }
  .hero .hero-slider .hero-slide .search__input .site-search__button {
    position: absolute;
    top: 0;
    right: 0;
    height: 100%;
    width: 42px;
    background-position: center;
    float: none;
    margin: 0;
  }
}
/* Hero logo overlay row: full-width overlay, aligns to grid right */
.row--hero-logo {
  position: absolute;
  left: 0;
  right: 0;
  bottom: 0;
  pointer-events: none;
  display: flex;
  justify-content: flex-end;
}

/* Let logo remain interactive if needed */
.row--hero-logo .technical-excellence-logo {
  pointer-events: auto;
}

/* Technical Excellence Logo */
.technical-excellence-logo {
  position: relative;
  bottom: 4rem;
  right: 0;
  width: 11.55rem;
  height: 3.2rem;
  z-index: 1000;
}

.technical-excellence-logo .icon-technical-excellence {
  width: 100%;
  height: 100%;
  fill: #fff;
  filter: drop-shadow(0 2px 4px rgba(0, 0, 0, 0.3));
  display: block;
}

@media (max-width: 1024px) {
  .technical-excellence-logo {
    width: 8.66rem;
    height: 2.4rem;
  }
}
@media (max-width: 1241px) {
  .technical-excellence-logo {
    right: 2rem;
  }
}
/* Hero action buttons */
.hero-buttons {
  display: flex;
  flex-direction: row;
  gap: 15px;
  align-items: center;
  flex-wrap: wrap;
  font-family: Arial, Helvetica, sans-serif;
}

.hero-buttons-secondary {
  display: flex;
  gap: 15px;
  flex-wrap: wrap;
}

.hero-btn-primary {
  background-color: #00b9fd;
  color: white;
  padding: 16px 32px;
  border-radius: 6px;
  text-decoration: none;
  font-weight: 600;
  border: none;
  display: inline-block;
  font-size: 1.1rem;
  box-shadow: 0 4px 12px rgba(0, 185, 253, 0.3);
  transition: all 0.3s ease;
}

.hero-btn-primary:hover {
  background-color: #0099d4;
  box-shadow: 0 6px 16px rgba(0, 185, 253, 0.4);
  transform: translateY(-2px);
}

.hero-btn-secondary {
  background-color: transparent;
  color: white;
  padding: 12px 24px;
  border: 2px solid white;
  border-radius: 4px;
  text-decoration: none;
  font-weight: 600;
  display: inline-block;
  transition: all 0.3s ease;
}

.hero-btn-secondary:hover {
  background-color: white;
  color: #00b9fd;
}

.hero-btn-tertiary {
  background-color: rgba(255, 255, 255, 0.1);
  color: white;
  padding: 12px 24px;
  border: 1px solid rgba(255, 255, 255, 0.3);
  border-radius: 4px;
  text-decoration: none;
  font-weight: 600;
  display: inline-block;
  transition: all 0.3s ease;
}

.hero-btn-tertiary:hover {
  background-color: rgba(255, 255, 255, 0.2);
  border-color: rgba(255, 255, 255, 0.5);
}

/* Center hero content vertically on desktop; mobile handled separately below */
/* Mobile hero height/layout (complements existing height rules) */
/* Extra small content padding (keep H1 rules excluded) */
@media (max-width: 380px) {
  .hero .hero-slider .hero-slide .hero-slide_content {
    padding-left: 0.5rem;
    padding-right: 0.5rem;
  }
}
@media (max-width: 320px) {
  .hero .hero-slider .hero-slide .hero-slide_content {
    padding-left: 0.75rem;
    padding-right: 0.75rem;
  }
}
/* Keep H2 mobile sizing from wjexpo (H1 intentionally excluded) */
@media (max-width: 320px) {
  .hero .hero-slider .hero-slide .hero-slide_content h2 {
    font-size: clamp(0.9rem, 4.5vw, 1.1rem);
    line-height: 1.25;
    margin-top: 0.5rem;
  }
}
/* Optional: hero controls placement refinement */
.hero .hero-slider .controls {
  position: absolute;
  bottom: 200px;
  z-index: 99999;
  margin-left: 1rem;
}

/* Round arrow icon styling for feature-box links */
.feature-boxes .feature-box__link .bdicon {
  width: 28px;
  height: 28px;
  margin-left: 8px;
  vertical-align: middle;
}

/* Colors for the injected symbol's internal shapes */
.bdicon--arrow-right-round .bdring {
  fill: var(--color-secondary);
}

.bdicon--arrow-right-round .bdarrow {
  fill: #fff;
  fill-rule: evenodd;
}

/* New: solid disc fill for the round arrow */
.bdicon--arrow-right-round .bddisc {
  fill: var(--color-secondary);
  opacity: 1; /* subtle tint; adjust/remove for full solid */
}

/* Optional hover: lighten ring when link hovered */
.feature-boxes .feature-box__link:hover .bdicon--arrow-right-round .bdring {
  fill: var(--color-secondary-hover);
}

/* ========== BUTTONS (consolidated) ========== */
.btn--register, .btn--submit, .quick-links__dropdown .btn {
  background: var(--color-primary);
}

.btn--register:hover, .btn--submit:hover, .quick-links__dropdown .btn:hover {
  background: var(--color-secondary-hover);
}

.btn--alt,
.quick-links__dropdown .btn--alt,
.twi_btn_orange {
  background: var(--color-secondary);
}

.btn--alt:hover,
.quick-links__dropdown .btn--alt:hover,
.twi_btn_orange:hover {
  background: var(--color-secondary-hover);
}

.twi_btn_blue {
  background: var(--color-primary);
}

.twi_btn_blue:focus,
.twi_btn_blue:hover {
  background: var(--color-secondary);
}

/* ========== QUICK LINKS BORDER ========== */
.quick-links .quick-links__dropdown {
  border-top: 1px solid #ddd;
}

.quick-links .quick-links__dropdown:after {
  border-bottom-color: #ddd;
}

/* ========== CARDS (extra colour tweak) ========== */
.ui-card .ui-card__type {
  background-color: var(--color-secondary);
}

/* Very high specificity override for back-to-top SVG element */
#back-to-top {
  position: fixed;
  bottom: 40px;
  right: 40px;
  height: 44px;
  width: 44px;
  z-index: 999999;
  background: none !important;
}

#back-to-top .icon {
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  margin-top: 0;
  margin-left: 0;
}

#back-to-top:hover {
  color: var(--color-secondary);
}

/* Show state for back-to-top SVG */
body div#back-to-top.show,
html body div#back-to-top.show {
  opacity: 1;
}

/* Ensure the new square icon displays properly */
#icon-square-lt-blue-top-of-page .brbg-square {
  fill: var(--color-secondary);
}

#icon-square-lt-blue-top-of-page .brarrow {
  fill: #fff;
}

.footer.rb {
  margin-top: 5rem;
}

.popupBlueFilter {
  background-color: var(--color-primary);
}

.controls .control {
  background-image: none;
  height: 44px;
  width: 44px;
  border: 0;
  padding: 0;
  cursor: pointer;
  margin-right: 1.938rem;
}

/* Slider controls: make SVG fill the button */
.controls .control .icon {
  width: 100%;
  height: 100%;
  display: block;
  color: var(--color-primary);
}

.hero .controls .control {
  border: 2px solid #fff;
  border-radius: 0;
  box-sizing: border-box;
  padding: 0.6rem;
}

/* Upcoming events controls: match hero button style */
.controls .event-prev,
.controls .event-next {
  /* override hex background from component styles */
  background: none !important;
  background-image: none !important;
  height: 44px;
  width: 44px;
  margin-right: 1.938rem;
  border-radius: 0;
  box-sizing: border-box;
}

/* Meet the experts controls: match events button style */
.controls .experts-prev,
.controls .experts-next,
.controls .latest-media-prev,
.controls .latest-media-next {
  background: none !important;
  background-image: none !important;
  height: 44px;
  width: 44px;
  margin-right: 1.938rem;
  border-radius: 0;
  box-sizing: border-box;
  color: var(--color-primary);
  opacity: 1;
}

.controls .control.disabled {
  opacity: 0.2;
  color: var(--color-primary);
  pointer-events: none;
}

.controls .control:hover,
.controls .control:hover .icon {
  color: var(--color-secondary);
  opacity: 1;
}

.experts-slider .experts-slide .experts-slide--information a.card--indicator {
  border-bottom: 59px solid var(--color-primary);
}

.experts-slider .experts-slide .experts-slide--information a:hover {
  color: var(--color-primary);
}

/* ========== CARD INDICATOR - SQUARE OVERRIDE ========== */
/* Override triangular card indicators to be square */
.card.card__events .card--description a .card--indicator,
.experts-slider .experts-slide .experts-slide--information a.card--indicator {
  /* Reset triangle borders */
  border-bottom: none !important;
  border-left: none !important;
  /* Create square shape */
  width: 60px;
  height: 60px;
  background-color: var(--color-primary);
  /* Position in bottom-right corner */
  position: absolute;
  bottom: 0;
  right: 20px;
  /* Maintain existing transition */
  opacity: 0;
  transition: all 0.3s ease;
  z-index: 200;
}

/* Adjust the + symbol positioning for the square */
.card.card__events .card--description a .card--indicator span,
.experts-slider .experts-slide .experts-slide--information a.card--indicator span {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  color: #fff;
  font-size: 2.15rem;
  font-weight: 900;
  bottom: -15px;
}

.experts-slider .experts-slide .experts-slide--information a.card--indicator span {
  bottom: -29px;
}

/* Show on hover */
.card.card__events .card--description a:hover .card--indicator,
.experts-slider .experts-slide .experts-slide--information:hover .card--indicator {
  opacity: 1;
}

.latest-media-row .ui-card .ui-card__image {
  aspect-ratio: 759/598; /* Exact ratio: 1.27:1 (close to 5:4) */
  height: auto;
}

/* Remove clip-path from type badges */
.latest-media-row .ui-card .ui-card__type,
.latest-media-row .ui-card .ui-card__type-dark {
  clip-path: none;
}

/* Content container */
.latest-media-row .ui-card .ui-card__content {
  display: block; /* Simple block, no flex needed */
  padding: 0.75rem 1rem; /* Reduced from 1rem 1.25rem */
  padding-bottom: 0; /* No bottom padding needed with grid */
  text-align: left;
  color: var(--color-primary);
}

/* Handle clipped content variant */
.latest-media-row .ui-card .ui-card__content.ui-card__content--clip {
  top: 0;
  margin: 0;
  padding-top: 0.75rem; /* Reduced from 1rem */
  text-align: left;
  clip-path: none;
}

/* Heading styling */
.latest-media-row .ui-card .ui-card__heading {
  font-weight: 800;
  line-height: 1.2; /* Tightened from 1.25 */
  margin-top: 0; /* Removed top margin */
  display: -webkit-box;
  display: -moz-box;
  -webkit-line-clamp: 2;
  line-clamp: 2; /* Standard property */
  -webkit-box-orient: vertical;
  overflow: hidden;
  text-overflow: ellipsis;
  max-height: 2.4em; /* 2 lines × 1.2 line-height */
}

.latest-media-row .ui-card .ui-card__heading a {
  color: var(--color-primary);
}

.latest-media-row .ui-card .ui-card__heading a:hover {
  text-decoration: none;
}

/* Text/description styling */
.latest-media-row .ui-card .ui-card__text {
  line-height: 1.4; /* Tightened from 1.45 */
  margin-top: 0.25rem; /* Reduced from 0.375rem */
  display: -webkit-box;
  display: -moz-box;
  -webkit-line-clamp: 3; /* Reduced from 4 to match design */
  line-clamp: 3; /* Standard property */
  -webkit-box-orient: vertical;
  overflow: hidden;
  text-overflow: ellipsis;
  /* Removed min-height to allow natural truncation */
  max-height: 4.2em; /* 3 lines × 1.4 */
}

/* Date styling - aligned at bottom via grid */
.latest-media-row .ui-card .ui-card__date {
  position: static; /* Normal flow, not absolute */
  margin-top: 0;
  padding: 0.5rem 1rem; /* Reduced from 0.75rem 1.25rem */
  border-top: 4px solid var(--color-primary);
  color: var(--color-primary);
  font-weight: 800;
  font-size: 0.875rem; /* Slightly smaller for compact look */
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

/* Hide date icon */
.latest-media-row .ui-card .ui-card__date .icon {
  display: none;
}

/* Word wrapping for long content - only for headings */
.latest-media-row .ui-card .ui-card__heading {
  overflow-wrap: break-word; /* Changed from anywhere for better compatibility */
  word-break: normal;
  -webkit-hyphens: none;
  hyphens: none;
}

/* Text uses normal word wrapping to work with line-clamp */
.latest-media-row .ui-card .ui-card__text {
  overflow-wrap: break-word; /* More compatible with line-clamp than anywhere */
  word-break: normal;
  -webkit-hyphens: none;
  hyphens: none;
}

/* Mobile adjustments */
@media (max-width: 768px) {
  .latest-media-row .ui-card .ui-card__heading {
    -webkit-line-clamp: 3;
    line-clamp: 3;
    max-height: 3.6em; /* 3 × 1.2 line-height */
  }
  .latest-media-row .ui-card .ui-card__text {
    -webkit-line-clamp: 4;
    line-clamp: 4;
    max-height: 5.6em; /* 4 × 1.4 line-height */
  }
}
/* Latest media header row (title + More link) */
.latest-media .latest-media-title.row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding-bottom: 1.5rem;
}

.latest-media .latest-media-title .latest-media-cta {
  display: flex;
  justify-content: flex-end;
}

.latest-media .latest-media-title .latest-media--link {
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  padding: 0.375rem 0.75rem;
  background-color: transparent;
  text-transform: uppercase;
  font-weight: 800;
  letter-spacing: 0.08em;
  line-height: 1;
  color: var(--color-primary);
  transition: background-color 0.3s ease, border-color 0.3s ease, box-shadow 0.3s ease, transform 0.2s ease, color 0.3s ease;
  top: 0;
  text-decoration: none;
}

.latest-media .latest-media-title .latest-media--link .bdicon {
  width: 1.4875rem;
  height: 1.4875rem;
  vertical-align: middle;
}

.latest-media-row .ui-card .ui-card__text,
.latest-media-row .ui-card .ui-card__date {
  position: relative;
  z-index: 3;
  padding-bottom: 0;
  margin-top: 1rem;
  bottom: 0;
}

/* Smooth color/fill transitions for label and icon */
.latest-media .latest-media-title .latest-media--link .latest-media--label {
  font-size: 0.85rem;
  transition: color 0.3s ease;
}

.latest-media .latest-media-title .latest-media--link .bdicon .bqsar__background,
.latest-media .latest-media-title .latest-media--link .bdicon .bqsar__arrow {
  transition: fill 0.3s ease;
}

/* Hover: mimic footer social buttons */
.latest-media .latest-media-title .latest-media--link:hover,
.latest-media .latest-media-title .latest-media--link:focus {
  color: var(--color-secondary);
}

/* On hover/focus, tint the square background of the arrow icon */
.latest-media .latest-media-title .latest-media--link:hover .bdicon .bqsar__background {
  fill: var(--color-secondary);
}

/* On hover/focus, set arrow to primary to maintain contrast */
.latest-media .latest-media-title .latest-media--link:hover .bdicon .bqsar__arrow,
.latest-media .latest-media-title .latest-media--link:focus .bdicon .bqsar__arrow {
  fill: var(--color-primary);
}

@media (max-width: 640px) {
  .latest-media .latest-media-title .latest-media--link {
    padding: 0.25rem 0.5rem;
  }
}


/*our stories */

.video-slice:before {
  clip-path: none;
}

.mask-bg p {
  color: #fff;
}

.mask-bg.top-left-up.bottom-left-down.background-section {
  margin-bottom: 8rem;
}

.testimonials-section .testimonials-slider .testimonials-slider_slide .testimonial--avatar img
{
  clip-path: none;
}