/*
 * Overrides that replace behaviours the legacy jQuery (assets/js/custom.js) applied at
 * runtime on the old site. Loaded LAST so it wins over style.css / common.css.
 */

/* --- Full-width layout (per request) ---
 * Bootstrap's .container caps content width and centres it (big empty side margins
 * on desktop). Make every container span the viewport with responsive side gutters
 * so it reads edge-to-edge but never glued to the screen edge. Scales 16px on phones
 * up to ~64px on wide desktops. */
.container,
.container-sm,
.container-md,
.container-lg,
.container-xl,
.container-xxl {
  max-width: 100%;
  width: 100%;
  padding-left: clamp(16px, 4vw, 64px);
  padding-right: clamp(16px, 4vw, 64px);
}

/* --- Home hero banner ---
 * Legacy custom.js set the absolute transparent header's height as the banner's
 * top-padding so the hero heading clears it. The banner also had z-index:-1 which,
 * without the JS layering, hid the heading. Restore both statically. */
.home-banner {
  z-index: 0;
  min-height: 440px;
  padding-top: 130px; /* clear the absolute header; heading sits in the upper band */
  padding-bottom: 48px;
  display: flex;
  align-items: center;
}
.home-banner .banner-content {
  width: 100%;
}
.home-banner .banner-content {
  position: relative;
  z-index: 2;
  width: 100%;
}
/* keep the hexagon pattern visible but behind the text */
.home-banner .banner-pattern {
  z-index: 0;
}

@media (max-width: 991px) {
  .home-banner {
    padding-top: 110px;
    min-height: 320px;
  }
}

/* The fund-performance card overlaps the bottom of the navy banner (margin-top:-240px).
 * The banner is positioned with z-index:0, so without this the banner paints OVER the
 * white card and the first fund table looks like it's on navy. Lift the card above it. */
.home-banner-bottom-sec {
  position: relative;
  z-index: 2;
}

/* --- Fund performance: CSS-only horizontal scroll for the period cards
 * (legacy used Swiper). Classes match the ported markup in FundPerformance.tsx. */
.performance-swiper {
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
}
.performance-swiper .swiper-wrapper {
  display: flex;
  align-items: stretch;
  gap: 12px;
  padding: 4px 20px 12px 0;
  cursor: default;
}
.performance-swiper .swiper-slide {
  flex: 0 0 auto;
  min-width: 110px;
}
@media (max-width: 768px) {
  .fund-slider-container {
    flex-wrap: nowrap;
  }
  .fund-names {
    width: 140px;
  }
  .performance-swiper {
    width: calc(100% - 140px);
  }
}

/* --- "As Featured On" logos: legacy used a slick carousel; render as a calm wrap row. */
.logo-slider {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: center;
  gap: 28px 40px;
}
.logo-slider .gallery-item {
  flex: 0 0 auto;
  width: 16.66%;
  min-width: 150px;
}
.logo-slider img {
  max-height: 46px;
  width: auto;
  object-fit: contain;
  filter: grayscale(1);
  opacity: 0.85;
  transition: filter 0.25s ease, opacity 0.25s ease;
}
.logo-slider img:hover {
  filter: grayscale(0);
  opacity: 1;
}

/* --- Post detail banner: no bottom gap under the category heading (was the one rule
 * research-post.css — the removed jQuery flipbook's stylesheet — still applied). */
.inner-banner-wrap {
  padding-bottom: 0;
}

/* --- Smooth section rhythm so pages match the live spacing without JS reveal animations. */
.home-section {
  overflow: hidden;
}

/* --- Poppins, self-hosted (was a render-blocking Google Fonts stylesheet on every page) ---
 * Only the "How We Buy Our Stocks" section (.construct in theme.css) uses it, so browsers
 * fetch these files on the homepage alone, and only the subsets/weights it renders. Same
 * woff2 files Google Fonts served (Poppins v24, latin + latin-ext; SIL OFL 1.1, see
 * /vendors/poppins/OFL.txt). */
@font-face {
  font-family: 'Poppins';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url(/vendors/poppins/poppins-400-latin-ext.woff2) format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
  font-family: 'Poppins';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url(/vendors/poppins/poppins-400-latin.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: 'Poppins';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url(/vendors/poppins/poppins-500-latin-ext.woff2) format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
  font-family: 'Poppins';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url(/vendors/poppins/poppins-500-latin.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: 'Poppins';
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url(/vendors/poppins/poppins-600-latin-ext.woff2) format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
  font-family: 'Poppins';
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url(/vendors/poppins/poppins-600-latin.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: 'Poppins';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url(/vendors/poppins/poppins-700-latin-ext.woff2) format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
  font-family: 'Poppins';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url(/vendors/poppins/poppins-700-latin.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

/* --- Team portraits ---
 * common.css gives .team-img `z-index: -1` (for the old hover overlay). Without a
 * stacking context on the card it painted beneath the section's page background, so
 * every portrait was invisible. Keep the -1 inside the card. */
.home-team .team-item {
  position: relative;
  z-index: 0;
}
