/* GoldConnect Africa homepage repair. All rules are limited to the homepage. */
body.home #gcp27-header,
body.front-page #gcp27-header,
body.home #gcp27-header *,
body.front-page #gcp27-header * {
  box-sizing: border-box;
}

/* Let the long navigation wrap instead of running under the logo or off-screen. */
body.home #gcp27-header,
body.front-page #gcp27-header {
  height: auto !important;
  min-height: 0;
  max-width: 100%;
}

body.home #gcp27-primary-nav,
body.front-page #gcp27-primary-nav {
  min-width: 0;
  max-width: 100%;
  overflow: visible;
}

body.home #gcp27-primary-nav ul,
body.home #gcp27-primary-nav .menu,
body.front-page #gcp27-primary-nav ul,
body.front-page #gcp27-primary-nav .menu {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: flex-end;
  gap: 6px 12px;
  max-width: 100%;
  white-space: normal;
}

body.home #gcp27-primary-nav li,
body.front-page #gcp27-primary-nav li {
  min-width: 0;
  max-width: 100%;
}

body.home #gcp27-primary-nav a,
body.front-page #gcp27-primary-nav a {
  white-space: normal;
  overflow-wrap: anywhere;
}

/* Keep one clear Log In action; the header already supplies a separate button. */
body.home #gcp27-primary-nav a[href*="/login/"],
body.front-page #gcp27-primary-nav a[href*="/login/"] {
  display: none !important;
}

/* Prevent failed entrance/reveal effects from leaving homepage sections invisible. */
body.home #gcp27-main,
body.front-page #gcp27-main {
  color: #f3f0e8;
  min-width: 0;
  overflow-x: clip;
}

body.home #gcp27-main > *,
body.front-page #gcp27-main > * {
  opacity: 1 !important;
  visibility: visible !important;
  transform: none !important;
  animation: none !important;
}

body.home #gcp27-main [data-aos],
body.home #gcp27-main .gcp27-reveal,
body.front-page #gcp27-main [data-aos],
body.front-page #gcp27-main .gcp27-reveal {
  opacity: 1 !important;
  visibility: visible !important;
  transform: none !important;
  animation: none !important;
}

body.home #gcp27-main p,
body.home #gcp27-main li,
body.home #gcp27-main .gcp27-copy,
body.front-page #gcp27-main p,
body.front-page #gcp27-main li,
body.front-page #gcp27-main .gcp27-copy {
  color: #e9e7df;
}

body.home #gcp27-main h1,
body.home #gcp27-main h2,
body.home #gcp27-main h3,
body.front-page #gcp27-main h1,
body.front-page #gcp27-main h2,
body.front-page #gcp27-main h3 {
  color: #f1d27a;
}

body.home #gcp27-main img,
body.front-page #gcp27-main img,
body.home #gcp27-main video,
body.front-page #gcp27-main video {
  max-width: 100%;
  height: auto;
}

@media (max-width: 900px) {
  body.home #gcp27-primary-nav ul,
  body.home #gcp27-primary-nav .menu,
  body.front-page #gcp27-primary-nav ul,
  body.front-page #gcp27-primary-nav .menu {
    justify-content: flex-start;
    gap: 6px 10px;
  }
}

@media (max-width: 600px) {
  body.home #gcp27-header,
  body.front-page #gcp27-header {
    width: 100%;
    padding-inline: 12px;
  }

  body.home #gcp27-primary-nav ul,
  body.home #gcp27-primary-nav .menu,
  body.front-page #gcp27-primary-nav ul,
  body.front-page #gcp27-primary-nav .menu {
    justify-content: flex-start;
    gap: 4px 8px;
  }

  body.home #gcp27-primary-nav a,
  body.front-page #gcp27-primary-nav a {
    display: inline-block;
    padding: 7px 4px;
    font-size: 14px;
    line-height: 1.35;
  }

  body.home #gcp27-main,
  body.front-page #gcp27-main {
    width: 100%;
  }

  body.home #gcp27-main h1,
  body.front-page #gcp27-main h1 {
    font-size: clamp(2.2rem, 10vw, 3.7rem);
    line-height: 1.05;
    overflow-wrap: anywhere;
  }
}

/* Contrast repair for the light "One marketplace" section. */
body.home #gcp27-main section.gchr-trade-intro h2,
body.front-page #gcp27-main section.gchr-trade-intro h2 { color:#17372b !important; }
body.home #gcp27-main section.gchr-trade-intro a h3,
body.front-page #gcp27-main section.gchr-trade-intro a h3 { color:#17372b !important; }
body.home #gcp27-main section.gchr-trade-intro a:nth-child(4) h3,
body.front-page #gcp27-main section.gchr-trade-intro a:nth-child(4) h3 { color:#fff !important; }

/* Stack the intro and feature cards on phones so no content is clipped. */
@media (max-width: 700px) {
  body.home #gcp27-main section.gchr-trade-intro > div:first-child,
  body.front-page #gcp27-main section.gchr-trade-intro > div:first-child {
    width:calc(100% - 36px) !important;
    max-width:560px !important;
    margin-inline:auto !important;
    padding:48px 0 !important;
    box-sizing:border-box !important;
  }
  body.home #gcp27-main section.gchr-trade-intro > div:first-child > div:first-child,
  body.front-page #gcp27-main section.gchr-trade-intro > div:first-child > div:first-child {
    display:grid !important;
    grid-template-columns:minmax(0,1fr) !important;
    gap:24px !important;
    width:100% !important;
    min-width:0 !important;
    box-sizing:border-box !important;
  }
  body.home #gcp27-main section.gchr-trade-intro > div:first-child > div:first-child > div:nth-child(2),
  body.front-page #gcp27-main section.gchr-trade-intro > div:first-child > div:first-child > div:nth-child(2) {
    grid-template-columns:minmax(0,1fr) !important;
    gap:12px !important;
    width:100% !important;
    min-width:0 !important;
  }
  body.home #gcp27-main section.gchr-trade-intro > div:first-child > div:first-child > div:nth-child(2) > a,
  body.front-page #gcp27-main section.gchr-trade-intro > div:first-child > div:first-child > div:nth-child(2) > a {
    width:100% !important;
    min-width:0 !important;
    padding:22px !important;
    box-sizing:border-box !important;
    overflow-wrap:anywhere;
  }
  body.home #gcp27-main section.gchr-trade-intro h2,
  body.front-page #gcp27-main section.gchr-trade-intro h2 {
    font-size:clamp(32px,9vw,42px) !important;
    line-height:1.06 !important;
  }
}
