/* ==========================================================================
   Amira — Career Development site sections (.icx) and practitioner hub (.ich)
   Palette matches the "Our Products" page (navy + gold on cream).
   Everything is scoped, nothing here touches other pages.
   ========================================================================== */

:root {
  --icx-navy: #16365c;
  --icx-deep: #0f2a47;
  --icx-gold: #cfa35e;
  --icx-gold-d: #a87f3f;
  --icx-cream: #faf6ef;
  --icx-paper: #f4eee3;
  --icx-line: #e6dcc9;
  --icx-ink: #34425a;
  --icx-muted: #6f7a8a;
  --icx-ok: #2f7d55;
  --icx-w: 1200px;
}

/* ---------- WPBakery wrappers ---------- */
body:has(.icx-hero) .internal-content {
  padding-top: 0;
}
body:has(.icx-band:last-child) .internal-content,
body:has(.icx-row) .internal-content {
  padding-bottom: 0;
}
.icx-row .wpb_raw_code,
.icx-row .wpb_content_element {
  margin-bottom: 0 !important;
}
.icx-row > .wpb_column > .vc_column-inner,
.icx-row .vc_column-inner {
  padding-top: 0 !important;
}
.icx-row.vc_row {
  margin-bottom: 0;
}

/* ---------- Base ---------- */
.icx {
  color: var(--icx-ink);
  font-size: 16px;
  line-height: 1.85;
}
.icx *,
.icx *::before,
.icx *::after {
  box-sizing: border-box;
}
.icx h1,
.icx h2,
.icx h3,
.icx h4 {
  color: var(--icx-navy);
  text-transform: none;
  letter-spacing: 0;
  font-weight: 700;
  margin: 0;
}
.icx h1 {
  font-size: clamp(30px, 4.2vw, 50px);
  line-height: 1.3;
}
.icx h2 {
  font-size: clamp(24px, 2.8vw, 34px);
  line-height: 1.4;
}
.icx h3 {
  font-size: 19px;
  line-height: 1.5;
}
.icx p {
  margin: 0 0 12px;
}
.icx p:last-child {
  margin-bottom: 0;
}
.icx a {
  text-decoration: none !important;
}
.icx img {
  max-width: 100%;
  height: auto;
  display: block;
}
.icx ul,
.icx ol {
  margin: 0;
  padding: 0;
  list-style: none;
}
.icx-in {
  max-width: var(--icx-w);
  margin: 0 auto;
  padding: 0 20px;
}
.icx-center {
  text-align: center;
}
.icx-fine {
  font-size: 13.5px;
  color: var(--icx-muted);
}

.icx-eyebrow {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  color: var(--icx-gold-d);
  font-weight: 700;
  font-size: 13.5px;
  letter-spacing: 0.03em;
  margin-bottom: 10px;
}
.icx-eyebrow::before {
  content: "";
  width: 28px;
  height: 2px;
  background: var(--icx-gold);
}

/* ---------- Buttons ---------- */
.icx-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  background: var(--icx-gold);
  color: var(--icx-deep) !important;
  font-weight: 700;
  font-size: 15px;
  padding: 13px 26px;
  border-radius: 4px;
  border: 2px solid var(--icx-gold);
  line-height: 1.3;
  transition:
    background 0.2s,
    color 0.2s,
    border-color 0.2s;
  cursor: pointer;
}
.icx-btn:hover,
.icx-btn:focus-visible {
  background: var(--icx-gold-d);
  border-color: var(--icx-gold-d);
  color: #fff !important;
}
.icx-btn.is-ghost {
  background: transparent;
  color: var(--icx-gold-d) !important;
  border-color: var(--icx-gold);
}
.icx-btn.is-ghost:hover {
  background: var(--icx-gold);
  border-color: var(--icx-gold);
  color: var(--icx-deep) !important;
}
.icx-btn.is-light {
  background: transparent;
  color: #fff !important;
  border-color: rgba(255, 255, 255, 0.6);
}
.icx-btn.is-light:hover {
  background: #fff;
  color: var(--icx-navy) !important;
}
.icx-btn.is-link {
  background: none;
  border-color: transparent;
  color: var(--icx-navy) !important;
  padding-inline: 8px;
  text-decoration: underline !important;
  text-underline-offset: 4px;
}
.icx-btn.is-small {
  padding: 9px 18px;
  font-size: 14px;
}
.icx-btn:focus-visible,
.icx a:focus-visible {
  outline: 3px solid var(--icx-gold);
  outline-offset: 3px;
}
.icx-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
  align-items: center;
  margin-top: 26px;
}

/* ---------- Hero ---------- */
.icx-hero {
  background: var(--icx-navy);
  color: #fff;
  padding: 84px 0 76px;
  position: relative;
  overflow: hidden;
}
.icx-hero::after {
  content: "";
  position: absolute;
  inset-block: 0;
  inset-inline-end: -10%;
  width: 55%;
  background: radial-gradient(
    closest-side,
    rgba(207, 163, 94, 0.2),
    transparent 70%
  );
  pointer-events: none;
}
.icx-hero .icx-in {
  position: relative;
  z-index: 1;
  max-width: 980px;
  margin-inline-start: max(20px, calc((100% - var(--icx-w)) / 2));
  margin-inline-end: auto;
}
.icx-hero h1 {
  color: #fff;
  margin-bottom: 18px;
}
.icx-hero .icx-eyebrow {
  color: var(--icx-gold);
}
.icx-hero .icx-lead {
  font-size: clamp(16px, 1.6vw, 19px);
  color: rgba(255, 255, 255, 0.88);
  max-width: 820px;
}
.icx-hero .icx-lead strong {
  color: #fff;
}
.icx-hero .icx-btn.is-ghost {
  color: #fff !important;
  border-color: rgba(255, 255, 255, 0.65);
}
.icx-hero .icx-btn.is-ghost:hover {
  background: #fff;
  color: var(--icx-navy) !important;
}
.icx-hero .icx-btn.is-link {
  color: #fff !important;
}
.icx-hero .icx-motto {
  color: var(--icx-gold);
  font-weight: 700;
  margin-top: 10px;
}
.icx-hero.is-home {
  padding: 110px 0 100px;
}

/* Home: portrait beside the headline, standing on the NAVIGATE® route */
.icx-hero.is-portrait {
  padding: 0;
  background: linear-gradient(180deg, var(--icx-deep) 0%, var(--icx-navy) 100%);
}
.icx-hero.is-portrait::after {
  inset: 0;
  width: auto;
  background: radial-gradient(
    45% 65% at 18% 50%,
    rgba(207, 163, 94, 0.16),
    transparent 70%
  );
}
[dir="ltr"] .icx-hero.is-portrait::after {
  background: radial-gradient(
    45% 65% at 82% 50%,
    rgba(207, 163, 94, 0.16),
    transparent 70%
  );
}
.icx-hero-grid {
  position: relative;
  z-index: 1;
  max-width: var(--icx-w);
  margin: 0 auto;
  padding: 150px 20px 0;
  display: grid;
  grid-template-columns: minmax(0, 1.15fr) minmax(0, 0.85fr);
  gap: 64px;
  align-items: center;
}
.icx-hero-text {
  padding-bottom: 52px;
}
.icx-hero .is-gold {
  color: var(--icx-gold);
}
.icx-hero.is-portrait h1 {
  font-size: clamp(28px, 3.4vw, 46px);
  text-wrap: balance;
}
/* Home headline: each sentence on its own line, never wrapped on desktop. */
.icx-h-lines .icx-h-line {
  display: block;
}
@media (min-width: 992px) {
  .icx-hero.is-portrait h1.icx-h-lines {
    font-size: clamp(28px, 3vw, 44px);
    text-wrap: nowrap;
  }
  .icx-h-lines .icx-h-line {
    white-space: nowrap;
  }
}
/* Home hero fills the first screen exactly; the next section starts on the
   first scroll. The photo shrinks on short screens so everything still fits. */
.icx-hero.is-portrait {
  min-height: 100vh;
  min-height: 100svh;
  display: flex;
  flex-direction: column;
}
.icx-hero.is-portrait .icx-hero-grid {
  flex: 1 0 auto;
  width: 100%;
}
.icx-hero.is-portrait .icx-route {
  flex: none;
}
body.admin-bar .icx-hero.is-portrait {
  min-height: calc(100svh - 32px);
}
/* Desktop: tighten the hero rhythm so text + NAVIGATE® route fit one screen.
   The route line sits at the circles' centre: padding-top + half the circle. */
@media (min-width: 992px) {
  .icx-hero.is-portrait .icx-hero-text {
    padding-bottom: 16px;
  }
  .icx-hero.is-portrait .icx-eyebrow {
    margin-bottom: 8px;
  }
  .icx-hero.is-portrait h1 {
    margin-bottom: 14px;
  }
  .icx-hero.is-portrait .icx-hero-text .icx-lead {
    font-size: 17px;
    line-height: 1.8;
    max-width: 72ch;
  }
  .icx-hero.is-portrait .icx-actions {
    margin-top: 22px;
  }
  .icx-hero.is-portrait .icx-creds {
    margin-top: 24px;
    padding-top: 16px;
  }
  .icx-hero.is-portrait .icx-route-in {
    padding: 34px 20px 16px;
  }
  .icx-hero.is-portrait .icx-route-cap {
    top: 10px;
  }
  .icx-hero.is-portrait .icx-route .l {
    width: 42px;
    height: 42px;
    font-size: 16px;
  }
  .icx-hero.is-portrait .icx-route-line {
    top: 55px;
  }
  .icx-hero.is-portrait .icx-route li {
    gap: 8px;
  }
  .icx-hero.is-portrait .icx-route-note {
    margin-top: 14px;
    padding-top: 10px;
  }
}
/* Short screens: drop the secondary lines rather than spill past the fold. */
@media (min-width: 992px) and (max-height: 800px) {
  .icx-hero.is-portrait .icx-creds {
    display: none;
  }
  .icx-hero.is-portrait .icx-hero-text {
    padding-bottom: 6px;
  }
}
@media (min-width: 992px) and (max-height: 700px) {
  .icx-hero.is-portrait .icx-route-note {
    display: none;
  }
}
.icx-hero.is-portrait .icx-lead {
  max-width: 58ch;
}
.icx-creds {
  display: flex;
  flex-wrap: wrap;
  gap: 12px 30px;
  margin-top: 34px !important;
  padding-top: 22px !important;
  border-top: 1px solid rgba(255, 255, 255, 0.14);
  font-size: 13.5px;
  line-height: 1.6;
  color: rgba(255, 255, 255, 0.7);
}
.icx-creds b {
  display: block;
  color: #fff;
  font-size: 15.5px;
}
.icx-hero-photo {
  position: relative;
  margin: 0;
  overflow: visible !important;
  align-self: end;
  max-width: 440px;
  justify-self: center;
  width: 100%;
}
/* .icx-hero-photo::before {
  content: "";
  position: absolute;
  inset: -14px 14px 0 -14px;
  border: 1.5px solid var(--icx-gold);
  border-radius: 240px 240px 0 0;
  border-bottom: 0;
  opacity: 0.7;
} */
.icx .icx-hero-photo img {
  position: relative;
  width: 100%;
  aspect-ratio: 5 / 6;
  object-fit: cover;
  object-position: 66% 20%;
  border-radius: 240px 240px 0 0;
  border: 1px solid var(--icx-gold);
  border-bottom: 0;
}
.icx-hero-photo figcaption {
  position: absolute;
  z-index: 2;
  inset-inline-end: -8%;
  bottom: 12%;
  background: #fff;
  color: var(--icx-navy);
  padding: 12px 18px;
  border-radius: 6px;
  box-shadow: 0 16px 30px -12px rgba(0, 0, 0, 0.45);
  font-size: 13px;
  line-height: 1.6;
}
.icx-hero-photo figcaption b {
  display: block;
  font-size: 15.5px;
}
.icx-hero-photo figcaption span {
  color: var(--icx-gold-d);
  font-weight: 700;
}

.icx-route {
  position: relative;
  z-index: 2;
  background: rgba(8, 24, 42, 0.45);
  border-top: 1px solid rgba(207, 163, 94, 0.35);
}
.icx-route-in {
  position: relative;
  max-width: var(--icx-w);
  margin: 0 auto;
  padding: 42px 20px 26px;
  direction: ltr;
}
.icx-route-cap {
  position: absolute;
  top: 14px;
  right: 20px;
  font:
    700 11px Montserrat,
    sans-serif;
  letter-spacing: 0.28em;
  color: rgba(255, 255, 255, 0.45);
}
.icx-route-line {
  position: absolute;
  top: 66px;
  left: calc(20px + 6.25% - 3px);
  right: calc(20px + 6.25% - 3px);
  height: 2px;
  background: linear-gradient(
    90deg,
    rgba(207, 163, 94, 0.25),
    var(--icx-gold) 50%,
    rgba(207, 163, 94, 0.25)
  );
}
.icx-route-line span {
  position: absolute;
  top: -4px;
  left: 0;
  width: 10px;
  height: 10px;
  border-radius: 50%;
  background: #fff;
  box-shadow:
    0 0 0 4px rgba(207, 163, 94, 0.35),
    0 0 18px 4px rgba(207, 163, 94, 0.6);
  animation: icx-travel 9s cubic-bezier(0.45, 0, 0.55, 1) infinite;
}
@keyframes icx-travel {
  from {
    left: 0;
  }
  to {
    left: calc(100% - 10px);
  }
}
.icx-route ol {
  position: relative;
  display: grid;
  grid-template-columns: repeat(8, minmax(0, 1fr));
  gap: 6px;
  text-align: center;
}
.icx-route li {
  display: grid;
  justify-items: center;
  align-content: start;
  gap: 10px;
}
.icx-route .l {
  width: 48px;
  height: 48px;
  border-radius: 50%;
  display: grid;
  place-items: center;
  font:
    700 18px Montserrat,
    sans-serif;
  color: var(--icx-gold);
  background: var(--icx-deep);
  border: 1.5px solid var(--icx-gold);
}
.icx-route li:first-child .l {
  background: var(--icx-gold);
  color: var(--icx-deep);
}
.icx-route small {
  font-size: 13px;
  font-weight: 600;
  line-height: 1.5;
  color: rgba(255, 255, 255, 0.82);
}
.icx-route-note {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 16px;
  margin-top: 22px;
  padding-top: 14px;
  border-top: 1px solid rgba(255, 255, 255, 0.08);
  font-size: 13.5px;
  color: rgba(255, 255, 255, 0.6);
}
[dir="rtl"] .icx-route-note,
[dir="rtl"] .icx-route small {
  direction: rtl;
}
.icx-route-note a {
  color: var(--icx-gold) !important;
  font-weight: 700;
  white-space: nowrap;
}
.icx-route-note a::after {
  content: " →";
}
[dir="rtl"] .icx-route-note a::after {
  content: " ←";
}
.icx-route-note a:hover {
  color: #fff !important;
}

/* ---------- Sections ---------- */
.icx-sec {
  padding: 72px 0;
}
.icx-row.is-full .icx-sec,
.icx-row.is-stretch .icx-sec {
  padding-inline: max(20px, calc((100% - var(--icx-w)) / 2));
}
.icx-sec.is-paper {
  background: var(--icx-paper);
}
.icx-head {
  max-width: 820px;
  margin: 0 auto 40px;
  text-align: center;
}
.icx-head .icx-eyebrow::after {
  content: "";
  width: 28px;
  height: 2px;
  background: var(--icx-gold);
}
.icx-head p {
  color: var(--icx-muted);
  margin-top: 12px;
  font-size: 17px;
}

/* ---------- Grids and cards ---------- */
.icx-grid {
  display: grid;
  gap: 22px;
}
.icx-grid-2 {
  grid-template-columns: repeat(2, 1fr);
}
.icx-grid-3 {
  grid-template-columns: repeat(3, 1fr);
}
.icx-grid-4 {
  grid-template-columns: repeat(4, 1fr);
}
.icx-grid-5 {
  grid-template-columns: repeat(5, 1fr);
}
.icx-card {
  position: relative;
  background: #fff;
  border: 1px solid var(--icx-line);
  border-radius: 6px;
  border-end-end-radius: 32px;
  padding: 26px 24px;
  display: flex;
  flex-direction: column;
  gap: 8px;
  transition:
    transform 0.2s,
    border-color 0.2s;
}
.is-paper .icx-card {
  border-color: transparent;
}
.icx-card::before {
  content: "";
  position: absolute;
  top: -1px;
  inset-inline-start: -1px;
  width: 44px;
  height: 3px;
  background: var(--icx-gold);
  transition: width 0.35s;
}
.icx-card p {
  color: var(--icx-muted);
  font-size: 15px;
}
.icx-card.is-link:hover,
.icx-card.is-link:focus-visible {
  transform: translateY(-3px);
  border-color: var(--icx-gold);
}
.icx-card.is-link:hover::before {
  width: calc(100% + 2px);
}
.icx-card.is-compact {
  padding: 22px 20px;
}
.icx-card.is-compact h3 {
  font-size: 17px;
}
.icx-card .icx-q {
  color: var(--icx-ink);
  font-style: italic;
}
.icx-card.is-soon {
  background: transparent;
  border-style: dashed;
}
.icx-more {
  margin-top: auto;
  padding-top: 8px;
  color: var(--icx-gold-d);
  font-weight: 700;
  font-size: 14px;
}
.icx-more::after {
  content: " ›";
}
[dir="rtl"] .icx-more::after {
  content: " ‹";
}
.icx-kind {
  color: var(--icx-gold-d);
  font-size: 12.5px;
  font-weight: 700;
  letter-spacing: 0.04em;
}

.icx-tag {
  display: inline-block;
  align-self: flex-start;
  font-style: normal;
  font-size: 12px;
  font-weight: 700;
  padding: 3px 10px;
  border-radius: 999px;
  background: var(--icx-paper);
  color: var(--icx-gold-d);
  border: 1px solid var(--icx-line);
}
.icx-tag.is-now {
  background: #e7f3ec;
  color: var(--icx-ok);
  border-color: #c6e3d2;
}
.icx-tag.is-new {
  background: var(--icx-gold);
  color: var(--icx-deep);
  border-color: var(--icx-gold);
}

/* ---------- Portals ---------- */
.icx-portals {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 0;
  border: 1px solid var(--icx-line);
  border-radius: 8px;
  overflow: hidden;
  background: #fff;
}
.icx-portal {
  display: flex;
  flex-direction: column;
  gap: 10px;
  padding: 34px 26px;
  color: var(--icx-ink) !important;
  border-inline-start: 1px solid var(--icx-line);
  transition: background 0.2s;
}
.icx-portal:first-child {
  border-inline-start: 0;
}
.icx-portal:hover,
.icx-portal:focus-visible {
  background: var(--icx-cream);
}
.icx-portal .icx-num {
  font-size: 13px;
  font-weight: 700;
  color: var(--icx-gold-d);
}
.icx-portal h3 {
  font-size: 22px;
}
.icx-portal p {
  color: var(--icx-muted);
  font-size: 15px;
}

/* ---------- NAVIGATE letters ---------- */
.icx-letters {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 14px;
  counter-reset: none;
}
.icx-letters li {
  background: #fff;
  border-radius: 6px;
  padding: 20px;
  display: grid;
  grid-template-columns: 52px 1fr;
  grid-template-rows: auto auto;
  column-gap: 14px;
  align-items: center;
}
.icx-letters .l {
  grid-row: 1 / 3;
  width: 52px;
  height: 52px;
  border-radius: 50%;
  background: var(--icx-navy);
  color: var(--icx-gold);
  font-weight: 800;
  font-size: 24px;
  display: flex;
  align-items: center;
  justify-content: center;
  font-family: Montserrat, sans-serif;
}
.icx-letters strong {
  color: var(--icx-navy);
  font-size: 16px;
  line-height: 1.4;
}
.icx-letters small {
  color: var(--icx-muted);
  font-size: 13.5px;
  line-height: 1.5;
}
.icx .icx-letters + .icx-center {
  margin-top: 28px;
}

/* ---------- Split (image + text) ---------- */
.icx-split {
  display: grid;
  grid-template-columns: 5fr 7fr;
  gap: 56px;
  align-items: center;
}
.icx-split.is-flip {
  grid-template-columns: 7fr 5fr;
}
.icx-split-media img {
  border-radius: 8px;
  border-end-end-radius: 60px;
  width: 100%;
  object-fit: cover;
  aspect-ratio: 4 / 5;
}
.icx-split-media.is-mark {
  background: var(--icx-navy);
  border-radius: 8px;
  border-end-end-radius: 60px;
  aspect-ratio: 1;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  color: var(--icx-gold);
  text-align: center;
}
.icx-split-media.is-mark span {
  font-family: Montserrat, sans-serif;
  font-weight: 700;
  font-size: clamp(30px, 3.4vw, 46px);
  line-height: 1.15;
  color: #fff;
}
.icx-split-media.is-mark small {
  margin-top: 12px;
  letter-spacing: 0.08em;
  font-size: 14px;
}
.icx-split-text h2 {
  margin-bottom: 6px;
}
.icx-split-text .icx-sub {
  color: var(--icx-gold-d);
  font-weight: 700;
  margin-bottom: 16px;
}
.icx-split-text .icx-btn {
  margin-top: 18px;
}

/* ---------- Check lists, pills, notes ---------- */
.icx-checks {
  display: grid;
  gap: 8px;
  margin: 14px 0;
}
.icx-checks li {
  position: relative;
  padding-inline-start: 28px;
}
.icx-checks li::before {
  content: "";
  position: absolute;
  inset-inline-start: 0;
  top: 0.62em;
  width: 14px;
  height: 8px;
  border-inline-start: 2px solid var(--icx-gold-d);
  border-bottom: 2px solid var(--icx-gold-d);
  transform: rotate(-45deg) scaleX(-1);
}
[dir="rtl"] .icx-checks li::before {
  transform: rotate(-45deg) scaleX(-1);
}
.icx-pills {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 12px;
}
.icx-pills li {
  background: #fff;
  border: 1px solid var(--icx-line);
  border-radius: 999px;
  padding: 10px 22px;
  font-weight: 700;
  color: var(--icx-navy);
}
.icx-pills.is-en li {
  font-family: Montserrat, sans-serif;
}
.icx-notes {
  display: grid;
  gap: 10px;
  margin-top: 8px;
}
.icx-notes li {
  background: #fff;
  border-inline-start: 3px solid var(--icx-gold);
  padding: 10px 14px;
  border-radius: 4px;
  font-size: 15px;
}

/* ---------- Two columns ---------- */
.icx-two {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 56px;
  align-items: start;
}
.icx-two.is-wide-first {
  grid-template-columns: 7fr 5fr;
}
.icx-two .icx-head {
  text-align: start;
  margin: 0 0 24px;
}
.icx-two h2 {
  margin-bottom: 14px;
}
.icx-two h3 {
  margin: 18px 0 8px;
}
.icx-big {
  font-size: 18px;
  line-height: 1.9;
  color: var(--icx-navy);
}

/* ---------- Vision / mission ---------- */
.icx-vm {
  background: var(--icx-navy);
  color: #fff;
  padding: 72px 0;
}
.icx-vm .icx-in {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 48px;
}
.icx-vm .icx-eyebrow {
  color: var(--icx-gold);
}
.icx-vm p {
  color: rgba(255, 255, 255, 0.9);
  font-size: 17px;
  line-height: 2;
}

/* ---------- Feature band (Inspiring Careers) ---------- */
.icx-feature {
  background: var(--icx-deep);
  color: #fff;
  padding: 76px 0;
  text-align: center;
}
.icx-feature .icx-in {
  max-width: 900px;
}
.icx-feature h2 {
  color: #fff;
  margin: 14px 0 14px;
}
.icx-feature p {
  color: rgba(255, 255, 255, 0.88);
}
.icx-feature .icx-motto {
  color: var(--icx-gold);
  font-weight: 700;
  font-size: 17px;
  margin: 18px 0 26px;
}
.icx-rel {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 16px;
  margin: 26px 0;
  text-align: start;
}
.icx-rel div {
  border: 1px solid rgba(255, 255, 255, 0.2);
  border-radius: 6px;
  padding: 18px;
  display: flex;
  flex-direction: column;
  gap: 6px;
}
.icx-rel strong {
  color: var(--icx-gold);
  font-size: 18px;
}
.icx-rel span {
  color: rgba(255, 255, 255, 0.85);
  font-size: 14px;
  direction: ltr;
  text-align: start;
}

/* ---------- Cohort strip ---------- */
.icx-cohort-in {
  display: flex;
  gap: 32px;
  align-items: center;
  justify-content: space-between;
  background: var(--icx-cream);
  border: 1px solid var(--icx-line);
  border-radius: 8px;
  border-end-end-radius: 60px;
  padding: 40px 44px;
}
.icx-cohort-in > div:first-child {
  max-width: 720px;
}
.icx-cohort-in .icx-actions {
  margin-top: 0;
  flex-direction: column;
  align-items: stretch;
  flex-shrink: 0;
}

/* ---------- Path, steps, chain, roadmap ---------- */
.icx-path {
  display: grid;
  grid-template-columns: 2fr 1fr 1fr;
  gap: 22px;
}
.icx-path li {
  background: #fff;
  border: 1px solid var(--icx-line);
  border-radius: 6px;
  padding: 26px;
  display: flex;
  flex-direction: column;
  gap: 10px;
}
.icx-path li.is-now {
  border-color: var(--icx-gold);
  box-shadow: inset 0 3px 0 var(--icx-gold);
}
.icx-path li p {
  color: var(--icx-muted);
  font-size: 15px;
}
.icx-path .icx-btn {
  align-self: flex-start;
  margin-top: auto;
}

.icx-steps {
  display: grid;
  grid-template-columns: repeat(5, 1fr);
  gap: 14px;
  margin-bottom: 44px;
}
.icx-steps li {
  background: var(--icx-cream);
  border-radius: 6px;
  padding: 20px 16px;
  font-weight: 700;
  color: var(--icx-navy);
  display: flex;
  flex-direction: column;
  gap: 10px;
}
.icx-steps li span {
  width: 34px;
  height: 34px;
  border-radius: 50%;
  background: var(--icx-gold);
  color: var(--icx-deep);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-family: Montserrat, sans-serif;
}
.icx-why h3 {
  margin-bottom: 6px;
}
.icx-why p {
  color: var(--icx-muted);
  font-size: 15px;
}

.icx-chain {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 8px;
  margin: 10px 0 30px;
}
.icx-chain li {
  font-family: Montserrat, sans-serif;
  font-weight: 600;
  color: var(--icx-navy);
  background: var(--icx-paper);
  padding: 8px 16px;
  border-radius: 999px;
  position: relative;
}
.icx-chain li + li::before {
  content: "›";
  position: absolute;
  left: -9px;
  top: 50%;
  transform: translateY(-52%);
  color: var(--icx-gold-d);
}
.icx-quote {
  max-width: 760px;
  margin: 0 auto;
  color: var(--icx-muted);
  font-size: 17px;
}
.icx-quote strong {
  display: block;
  margin-top: 10px;
  color: var(--icx-navy);
}

.icx-roadmap {
  display: grid;
  grid-template-columns: repeat(5, 1fr);
  gap: 14px;
}
.icx-roadmap li {
  background: #fff;
  border-radius: 6px;
  padding: 20px;
  display: flex;
  flex-direction: column;
  gap: 6px;
  opacity: 0.85;
}
.icx-roadmap li.is-now {
  opacity: 1;
  box-shadow: inset 0 3px 0 var(--icx-ok);
}
.icx-roadmap li p {
  color: var(--icx-muted);
  font-size: 14px;
}
.icx-roadmap h3 {
  font-size: 16px;
}

/* ---------- Tiers ---------- */
.icx-tiers {
  display: grid;
  gap: 10px;
  max-width: 900px;
  margin: 0 auto;
}
.icx-tier {
  display: grid;
  grid-template-columns: 220px 1fr auto;
  gap: 18px;
  align-items: center;
  background: #fff;
  border-radius: 6px;
  padding: 16px 22px;
}
.icx-tier strong {
  color: var(--icx-navy);
}
.icx-tier span {
  color: var(--icx-muted);
  font-size: 15px;
}
.icx-tier.is-base {
  background: var(--icx-navy);
}
.icx-tier.is-base strong {
  color: var(--icx-gold);
}
.icx-tier.is-base span {
  color: rgba(255, 255, 255, 0.85);
}
.icx-tier.is-now {
  box-shadow: inset 4px 0 0 var(--icx-ok);
}
[dir="rtl"] .icx-tier.is-now {
  box-shadow: inset -4px 0 0 var(--icx-ok);
}
.icx-tier.is-later {
  opacity: 0.75;
}

/* ---------- Launch cards and table ---------- */
.icx-card.is-launch .icx-gets {
  margin-top: auto;
  padding-top: 12px;
  border-top: 1px dashed var(--icx-line);
  color: var(--icx-ink);
  font-size: 14.5px;
}
.icx-table {
  width: 100%;
  border-collapse: collapse;
  background: #fff;
  border-radius: 6px;
  overflow: hidden;
}
.icx-table th,
.icx-table td {
  padding: 12px 16px;
  text-align: start;
  border-bottom: 1px solid var(--icx-line);
  font-size: 15px;
}
.icx-table th {
  background: var(--icx-navy);
  color: #fff;
  font-weight: 700;
}
.icx-table td:first-child {
  font-weight: 700;
  color: var(--icx-navy);
}

/* ---------- Aside ---------- */
.icx-aside {
  margin-top: 30px;
  background: #fff;
  border-radius: 6px;
  padding: 24px 26px;
  border-inline-start: 3px solid var(--icx-navy);
}
.icx-aside h3 {
  margin-bottom: 6px;
}
.icx-aside p {
  color: var(--icx-muted);
  font-size: 15px;
}
.icx-aside .icx-btn {
  margin-top: 12px;
}

/* ---------- Closing band ---------- */
.icx-band {
  background: var(--icx-navy);
  color: #fff;
  padding: 56px 0;
}
.icx-band .icx-in {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 30px;
}
.icx-band h2 {
  color: #fff;
  margin-bottom: 6px;
}
.icx-band p {
  color: rgba(255, 255, 255, 0.85);
}
.icx-band .icx-actions {
  margin-top: 0;
  flex-shrink: 0;
}

/* ---------- Join form ---------- */
.icx-join-head {
  padding-bottom: 20px;
}
.icx-row.icx-form-wrap {
  padding-bottom: 72px;
}
.icx-form {
  max-width: 860px;
  margin: 0 auto;
  background: #fff;
  border: 1px solid var(--icx-line);
  border-radius: 8px;
  padding: 34px;
  color: var(--icx-ink);
}
.icx-form fieldset {
  border: 0;
  padding: 0;
  margin: 0 0 22px;
  min-width: 0;
}
.icx-form legend {
  font-weight: 700;
  color: var(--icx-navy);
  margin-bottom: 8px;
  font-size: 16px;
  padding: 0;
}
.icx-form legend label {
  font-weight: 700;
}
.icx-form-row {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 18px;
  margin-bottom: 14px;
}
.icx-form-row > label {
  display: flex;
  flex-direction: column;
  gap: 6px;
  font-weight: 600;
  font-size: 14.5px;
}
.icx-form input[type="text"],
.icx-form input[type="email"],
.icx-form input[type="tel"],
.icx-form select,
.icx-form textarea {
  width: 100%;
  border: 1px solid var(--icx-line);
  border-radius: 4px;
  padding: 11px 12px;
  font-size: 15px;
  background: var(--icx-cream);
  color: var(--icx-ink);
  font-family: inherit;
  height: auto;
  margin: 0;
}
.icx-form input:focus,
.icx-form select:focus,
.icx-form textarea:focus {
  outline: 2px solid var(--icx-gold);
  outline-offset: 1px;
  background: #fff;
}
.icx-form .icx-checks {
  grid-template-columns: repeat(3, 1fr);
  margin: 0;
}
.icx-form .icx-check,
.icx-form .icx-radio {
  display: flex;
  gap: 8px;
  align-items: flex-start;
  font-weight: 400;
  font-size: 15px;
  cursor: pointer;
  padding: 8px 10px;
  border-radius: 4px;
  background: var(--icx-cream);
}
.icx-form .icx-radio {
  background: none;
  padding: 4px 0;
}
.icx-form .icx-check input,
.icx-form .icx-radio input {
  margin-top: 6px;
  accent-color: var(--icx-gold-d);
}
.icx-form .icx-check.is-disabled {
  opacity: 0.5;
  cursor: not-allowed;
}
.icx-form .icx-consent {
  background: none;
  padding: 0;
  margin: 4px 0 18px;
  font-size: 14px;
  color: var(--icx-muted);
}
.icx-form-hint {
  color: var(--icx-muted);
  font-size: 13.5px;
  margin: -4px 0 8px;
}
.icx-form-errors {
  background: #fdecea;
  border: 1px solid #f3c2bc;
  color: #8a1f11;
  border-radius: 4px;
  padding: 12px 16px;
  margin-bottom: 20px;
}
.icx-form-errors ul {
  margin: 0;
  padding-inline-start: 18px;
  list-style: disc;
}
.icx-form-done {
  max-width: 760px;
  margin: 0 auto;
  background: #e7f3ec;
  border: 1px solid #c6e3d2;
  border-radius: 8px;
  padding: 30px;
  text-align: center;
  color: var(--icx-ink);
}
.icx-form-done h3 {
  color: var(--icx-ok);
  margin: 0 0 8px;
}
.icx-form-done:focus {
  outline: none;
}
.icx-form .icx-btn.is-busy {
  opacity: 0.7;
  cursor: progress;
}

/* ---------- Toast (form answers) ---------- */
.icx-toast-host {
  position: fixed;
  inset-inline: 0;
  bottom: 24px;
  z-index: 100000;
  display: flex;
  justify-content: center;
  padding: 0 16px;
  pointer-events: none;
}
.icx-toast {
  pointer-events: auto;
  display: flex;
  align-items: flex-start;
  gap: 12px;
  width: 100%;
  max-width: 440px;
  padding: 14px 14px 14px 16px;
  background: #fff;
  color: var(--icx-ink);
  border: 1px solid var(--icx-line);
  border-radius: 12px;
  box-shadow:
    0 18px 40px -12px rgba(15, 42, 71, 0.28),
    0 2px 6px rgba(15, 42, 71, 0.08);
  font-size: 15px;
  line-height: 1.6;
  opacity: 0;
  transform: translateY(14px);
  transition:
    opacity 0.26s ease,
    transform 0.26s cubic-bezier(0.2, 0.8, 0.2, 1);
}
.icx-toast[dir="rtl"] {
  padding: 14px 16px 14px 14px;
}
.icx-toast.is-in {
  opacity: 1;
  transform: none;
}
.icx-toast-ic {
  flex: none;
  display: grid;
  place-items: center;
  width: 30px;
  height: 30px;
  border-radius: 50%;
  background: #e7f3ec;
}
.icx-toast-ic svg {
  width: 18px;
  height: 18px;
  fill: none;
  stroke: var(--icx-ok);
  stroke-width: 2.4;
  stroke-linecap: round;
  stroke-linejoin: round;
}
.icx-toast.is-error .icx-toast-ic {
  background: #fdecea;
}
.icx-toast.is-error .icx-toast-ic svg {
  stroke: #b3261e;
}
.icx-toast-body {
  flex: 1;
  min-width: 0;
  padding-top: 3px;
}
.icx-toast-body strong {
  display: block;
  color: var(--icx-deep);
  font-weight: 700;
}
.icx-toast-body ul {
  margin: 4px 0 0;
  padding-inline-start: 18px;
  list-style: disc;
  font-size: 14px;
  color: var(--icx-muted);
}
.icx-toast-body li {
  margin: 0;
  padding: 0;
  line-height: 1.6;
}
.icx-toast-body li:only-child {
  list-style: none;
  margin-inline-start: -18px;
}
.icx-toast-x {
  flex: none;
  width: 28px;
  height: 28px;
  margin: 0;
  padding: 0;
  border: 0;
  border-radius: 50%;
  background: transparent;
  color: var(--icx-muted);
  font-size: 22px;
  line-height: 28px;
  cursor: pointer;
}
.icx-toast-x:hover {
  background: var(--icx-cream);
  color: var(--icx-deep);
}
@media (max-width: 600px) {
  .icx-toast-host {
    bottom: 16px;
  }
}
@media (prefers-reduced-motion: reduce) {
  .icx-toast {
    transition: none;
  }
}
/* CF7 answers show as the toast; its own box under the button is not needed. */
.icx-cf7-toast .icx-form-card .wpcf7 form .wpcf7-response-output {
  display: none !important;
}
.icx-hp {
  position: absolute !important;
  left: -9999px !important;
  width: 1px;
  height: 1px;
  overflow: hidden;
}

/* ==========================================================================
   Practitioner hub (.ich) — inside WooCommerce My account
   ========================================================================== */
.ich {
  color: var(--icx-ink);
  line-height: 1.8;
}
.ich *,
.ich *::before,
.ich *::after {
  box-sizing: border-box;
}
.ich h2,
.ich h3,
.ich h4 {
  color: var(--icx-navy);
  text-transform: none;
  letter-spacing: 0;
  margin: 0 0 8px;
}
.ich h2 {
  font-size: 26px;
}
.ich h3 {
  font-size: 19px;
}
.ich h4 {
  font-size: 16px;
}
.ich a {
  text-decoration: none;
}
.ich ul,
.ich ol {
  margin: 0;
}
.ich .icx-btn {
  font-size: 14px;
}
.ich-eyebrow {
  color: var(--icx-gold-d);
  font-weight: 700;
  font-size: 13px;
  display: inline-flex;
  align-items: center;
  gap: 8px;
}
.ich-head {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  align-items: flex-end;
  gap: 14px;
  margin-bottom: 18px;
}
.ich-badges {
  display: flex;
  gap: 8px;
  flex-wrap: wrap;
}
.ich-badge {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  background: #fff;
  color: var(--icx-gold-d);
  border: 1px solid var(--icx-gold);
  border-radius: 999px;
  padding: 4px 12px;
  font-size: 12.5px;
  font-weight: 700;
  line-height: 1.6;
  white-space: nowrap;
}
.ich-badge::before {
  content: "";
  width: 7px;
  height: 7px;
  border-radius: 50%;
  background: var(--icx-gold);
  flex-shrink: 0;
}
.ich-badge.is-gold {
  background: var(--icx-gold);
  border-color: var(--icx-gold);
  color: var(--icx-deep);
}
.ich-badge.is-gold::before {
  background: var(--icx-deep);
}
.ich-note {
  background: #fff8e8;
  border: 1px solid #f0dcae;
  border-radius: 4px;
  padding: 10px 14px;
  font-size: 14px;
}

.ich-tabs {
  display: flex;
  flex-wrap: wrap;
  gap: 4px;
  border-bottom: 2px solid var(--icx-line);
  margin-bottom: 26px;
}
.ich-tabs a {
  padding: 10px 16px;
  color: var(--icx-muted);
  font-weight: 700;
  font-size: 14.5px;
  border-bottom: 3px solid transparent;
  margin-bottom: -2px;
}
.ich-tabs a:hover {
  color: var(--icx-navy);
}
.ich-tabs a.is-active {
  color: var(--icx-gold-d);
  border-bottom-color: var(--icx-gold);
}

.ich-grid {
  display: grid;
  gap: 18px;
}
.ich-grid-2 {
  grid-template-columns: repeat(2, 1fr);
}
.ich-grid-3 {
  grid-template-columns: repeat(3, 1fr);
}
.ich-grid-4 {
  grid-template-columns: repeat(4, 1fr);
}
.ich-card {
  background: #fff;
  border: 1px solid var(--icx-line);
  border-radius: 6px;
  padding: 22px;
}
.ich-card.is-accent {
  background: var(--icx-cream);
  border-color: transparent;
  box-shadow: inset 0 3px 0 var(--icx-gold);
}
.ich-card ul {
  padding-inline-start: 18px;
  list-style: disc;
  display: grid;
  gap: 6px;
  font-size: 15px;
}
.ich-links {
  list-style: none !important;
  padding: 0 !important;
}
.ich-links a {
  color: var(--icx-navy);
  font-weight: 700;
}
/* Gold chevrons: drawn with borders so they flip in RTL and never depend on a
   font having the glyph. .ich-arr = back (points to the start side); the
   ::after of forward links points to the end side. */
.ich-arr,
.ich-links a::after,
.ich-more::after {
  content: "";
  display: inline-block;
  width: 8px;
  height: 8px;
  border: solid var(--icx-gold-d);
  border-width: 0 0 2px 2px;
  border-radius: 1px;
  vertical-align: middle;
  position: relative;
  top: -1px;
  transition: transform 0.2s;
}
.ich-arr {
  margin-inline-end: 9px;
  transform: rotate(45deg);
}
[dir="rtl"] .ich-arr {
  transform: rotate(-135deg);
}
.ich-back a:hover .ich-arr {
  transform: rotate(45deg) translate(-2px, 2px);
}
[dir="rtl"] .ich-back a:hover .ich-arr {
  transform: rotate(-135deg) translate(-2px, 2px);
}
.ich-links a::after,
.ich-more::after {
  margin-inline-start: 9px;
  transform: rotate(-135deg);
}
[dir="rtl"] .ich-links a::after,
[dir="rtl"] .ich-more::after {
  transform: rotate(45deg);
}
.ich-links a:hover::after,
.ich-more:hover::after {
  transform: rotate(-135deg) translate(-2px, 2px);
}
[dir="rtl"] .ich-links a:hover::after,
[dir="rtl"] .ich-more:hover::after {
  transform: rotate(45deg) translate(-2px, 2px);
}
.ich-links a:hover,
.ich-more:hover {
  color: var(--icx-gold-d);
}
.ich-more {
  color: var(--icx-navy);
  font-weight: 700;
}
.ich-section {
  margin-top: 30px;
}
.ich-intro {
  margin-bottom: 20px;
}
.ich-intro p {
  color: var(--icx-muted);
}
.ich-empty {
  color: var(--icx-muted);
  font-style: italic;
}
.ich-fine {
  color: var(--icx-muted);
  font-size: 13px;
  margin-top: 14px;
}
.ich-muted {
  color: var(--icx-muted);
  font-size: 14px;
  margin: 0 0 12px;
}
/* Lab recordings: the YouTube playlist player at 16:9. */
.ich-video {
  position: relative;
  aspect-ratio: 16 / 9;
  max-width: 880px;
  border-radius: 10px;
  overflow: hidden;
  background: #141823;
  border: 1px solid var(--icx-line);
}
.ich-video iframe {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  border: 0;
}
.ich-back {
  margin-bottom: 14px;
}
.ich-back a {
  display: inline-flex;
  align-items: center;
  color: var(--icx-navy);
  font-weight: 700;
}
.ich-back a:hover {
  color: var(--icx-gold-d);
}
[dir="rtl"] .ich-back a {
  unicode-bidi: plaintext;
}

.ich-soon {
  background: var(--icx-paper);
  border-radius: 6px;
  padding: 18px 22px;
  margin-bottom: 22px;
  border-inline-start: 4px solid var(--icx-gold);
}
.ich-soon strong {
  color: var(--icx-navy);
}

.ich-search {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  align-items: center;
  margin-bottom: 20px;
}
.ich-search input[type="search"] {
  flex: 1 1 280px;
  border: 1px solid var(--icx-line);
  border-radius: 4px;
  padding: 10px 12px;
  background: var(--icx-cream);
  margin: 0;
  height: auto;
}
.ich-search select {
  border: 1px solid var(--icx-line);
  border-radius: 4px;
  padding: 10px;
  background: #fff;
  margin: 0;
  height: auto;
}
.ich-reset {
  color: var(--icx-muted);
  font-size: 14px;
}

.ich-letter {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 32px;
  height: 32px;
  border-radius: 50%;
  background: var(--icx-gold);
  color: var(--icx-deep);
  font-weight: 800;
  font-size: 15px;
  font-family: Montserrat, sans-serif;
  flex-shrink: 0;
}
.ich-section h3 .ich-letter {
  margin-inline-end: 6px;
  vertical-align: middle;
}

.ich-tool {
  display: flex;
  flex-direction: column;
  gap: 6px;
  background: #fff;
  border: 1px solid var(--icx-line);
  border-radius: 6px;
  border-end-end-radius: 24px;
  padding: 18px;
  color: var(--icx-ink);
  transition:
    border-color 0.2s,
    transform 0.2s;
}
a.ich-tool:hover {
  border-color: var(--icx-gold);
  transform: translateY(-2px);
}
.ich-tool strong {
  color: var(--icx-navy);
  line-height: 1.5;
}
.ich-tool p {
  color: var(--icx-muted);
  font-size: 14px;
  margin: 0;
}
.ich-tool.is-coming {
  background: transparent;
  border-style: dashed;
  opacity: 0.75;
}
.ich-kind {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  align-self: flex-start;
  padding: 2px 10px;
  border-radius: 999px;
  background: var(--icx-cream);
  border: 1px solid var(--icx-line);
  color: var(--icx-gold-d);
  font-size: 12px;
  font-weight: 700;
  line-height: 1.6;
}
.ich-meta {
  color: var(--icx-muted);
  font-size: 12.5px;
  margin-top: auto;
}

/* Toolbox folders: one per audience, like the programme's "theories box". */
.ich-folders {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(220px, 1fr));
  gap: 14px;
  margin-bottom: 22px;
}
.ich-folder {
  display: flex;
  flex-direction: column;
  gap: 6px;
  background: #fff;
  border: 1px solid var(--icx-line);
  border-radius: 6px;
  padding: 18px 18px 16px;
  color: var(--icx-ink);
  transition:
    border-color 0.2s,
    transform 0.2s,
    box-shadow 0.2s;
}
a.ich-folder:hover,
a.ich-folder:focus-visible {
  border-color: var(--icx-gold);
  transform: translateY(-2px);
  box-shadow: 0 12px 24px -18px rgba(15, 42, 71, 0.45);
}
.ich-folder strong {
  color: var(--icx-navy);
  font-size: 16px;
  line-height: 1.45;
}
.ich-folder small {
  color: var(--icx-muted);
  font-size: 13px;
}
.ich-folder.is-shared {
  background: var(--icx-cream);
  border-style: dashed;
}
.ich-folder-ic {
  width: 40px;
  height: 34px;
  margin-bottom: 4px;
  fill: var(--icx-paper);
  stroke: var(--icx-gold-d);
  stroke-width: 1.6;
  stroke-linejoin: round;
}
.ich-folder-ic .ich-folder-flap {
  fill: none;
}
.ich-folder-head {
  display: flex;
  align-items: center;
  gap: 14px;
  margin-bottom: 18px;
}
.ich-folder-head .ich-folder-ic {
  width: 52px;
  height: 44px;
  margin: 0;
}
.ich-folder-head h3 {
  margin: 0;
  font-size: 22px;
}
.ich-part h3 {
  display: flex;
  align-items: center;
  gap: 8px;
  padding-bottom: 10px;
  border-bottom: 1px solid var(--icx-line);
  margin-bottom: 16px;
}
.ich-count {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 26px;
  height: 22px;
  padding: 0 7px;
  border-radius: 999px;
  background: var(--icx-paper);
  color: var(--icx-gold-d);
  font-size: 12.5px;
  font-weight: 700;
}
.ich-chips {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px;
  margin: 6px 0 4px;
}
.ich-chips-t {
  color: var(--icx-muted);
  font-size: 13.5px;
  margin-inline-end: 4px;
}
.ich-chips a {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 5px 12px;
  border: 1px solid var(--icx-line);
  border-radius: 999px;
  background: #fff;
  color: var(--icx-ink);
  font-size: 13px;
  line-height: 1.5;
  transition:
    border-color 0.2s,
    background 0.2s;
}
.ich-chips a b {
  color: var(--icx-gold-d);
  font-weight: 800;
}
.ich-chips a:hover {
  border-color: var(--icx-gold);
}
.ich-chips a.is-active {
  background: var(--icx-gold);
  border-color: var(--icx-gold);
  color: var(--icx-deep);
}
.ich-chips a.is-active b {
  color: var(--icx-deep);
}
.ich-kind {
  display: inline-flex;
  align-items: center;
  gap: 6px;
}
.ich-letter.is-small {
  width: 22px;
  height: 22px;
  font-size: 11.5px;
}
.ich-tool.is-theory {
  border-top: 2px solid var(--icx-gold);
}

.ich-mini {
  display: flex;
  flex-direction: column;
  gap: 2px;
  background: var(--icx-cream);
  border-radius: 6px;
  padding: 14px;
  color: var(--icx-navy);
}
.ich-mini span {
  align-self: flex-start;
  padding: 1px 9px;
  margin-bottom: 4px;
  border-radius: 999px;
  background: #fff;
  border: 1px solid var(--icx-gold);
  color: var(--icx-gold-d);
  font-size: 11.5px;
  font-weight: 700;
  line-height: 1.6;
}

.ich-doc header {
  border-bottom: 1px solid var(--icx-line);
  padding-bottom: 14px;
  margin-bottom: 18px;
}
.ich-doc header h2 {
  margin-top: 6px;
}
.ich-content {
  margin-bottom: 18px;
}
.ich-guide {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: 12px;
}
.ich-guide-part {
  background: #fff;
  border: 1px solid var(--icx-line);
  border-radius: 6px;
  padding: 16px 20px;
}
.ich-guide-part h4 {
  color: var(--icx-gold-d);
}
.ich-guide-part ol,
.ich-guide-part ul {
  padding-inline-start: 22px;
  display: grid;
  gap: 4px;
}
.ich-guide-part ol {
  list-style: decimal;
}
.ich-guide-part ul {
  list-style: disc;
}
.ich-guide-part p {
  margin: 0 0 6px;
}
.ich-guide-part .ich-q-group {
  margin: 10px 0 6px;
  font-size: 14px;
  font-weight: 700;
  color: var(--icx-deep);
}
.ich-guide-part .ich-q-group:first-child {
  margin-top: 0;
}
.ich-guide-part.is-purpose,
.ich-guide-part.is-outputs {
  background: var(--icx-cream);
  border-color: transparent;
}
.ich-guide-part .ich-content {
  margin: 0;
}
.ich-guide-part.is-examples h4 + .ich-content > h4:first-child {
  margin-top: 4px;
}
.ich-content h3 {
  margin: 22px 0 8px;
  color: var(--icx-navy);
}
.ich-content h4 {
  margin: 18px 0 8px;
  color: var(--icx-navy);
  font-size: 16px;
}
.ich-content blockquote {
  margin: 18px 0 0;
  padding: 14px 18px;
  background: var(--icx-cream);
  border-inline-start: 3px solid var(--icx-gold);
  border-radius: 4px;
  color: var(--icx-deep);
}
.ich-content blockquote p {
  margin: 0;
}

/* Tables in tool guides: scroll sideways on small screens instead of squeezing. */
.ich-table {
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
  margin: 8px 0 14px;
  border: 1px solid var(--icx-line);
  border-radius: 6px;
}
.ich-table table {
  width: 100%;
  min-width: 560px;
  border-collapse: collapse;
  margin: 0;
  font-size: 14px;
  line-height: 1.65;
}
.ich-table th,
.ich-table td {
  padding: 10px 12px;
  border: 0;
  border-bottom: 1px solid var(--icx-line);
  text-align: start;
  vertical-align: top;
}
.ich-table th + th,
.ich-table td + td {
  border-inline-start: 1px solid var(--icx-line);
}
.ich-table thead th {
  background: var(--icx-cream);
  color: var(--icx-navy);
  font-weight: 700;
  white-space: normal;
}
.ich-table tbody tr:last-child td {
  border-bottom: 0;
}
.ich-table tbody td:first-child {
  color: var(--icx-deep);
  font-weight: 600;
}

/* Editors' preview of items still in preparation. */
.ich-tool.is-draft {
  border-style: dashed;
  border-color: var(--icx-gold);
}
.ich-draft-tag {
  align-self: flex-start;
  padding: 2px 10px;
  border-radius: 999px;
  background: #fbf3e4;
  border: 1px dashed var(--icx-gold);
  color: var(--icx-gold-d);
  font-size: 12px;
  font-weight: 700;
  line-height: 1.6;
}
.ich-draft-note {
  margin-bottom: 16px;
  padding: 12px 16px;
  background: #fbf3e4;
  border: 1px dashed var(--icx-gold);
  border-radius: 6px;
  color: var(--icx-ink);
  font-size: 14px;
}
.ich-draft-note strong {
  color: var(--icx-gold-d);
}

.ich-files {
  margin-top: 20px;
  background: var(--icx-paper);
  border-radius: 6px;
  padding: 18px 20px;
}
.ich-files ul {
  list-style: none;
  padding: 0;
  display: grid;
  gap: 8px;
}
.ich-files a {
  color: var(--icx-navy);
  font-weight: 700;
}
.ich-files small {
  color: var(--icx-muted);
}
.ich-ext {
  display: inline-block;
  min-width: 42px;
  text-align: center;
  background: var(--icx-navy);
  color: #fff;
  font-size: 11px;
  border-radius: 3px;
  padding: 1px 6px;
  margin-inline-end: 6px;
  font-family: Montserrat, sans-serif;
}

.ich-lab {
  display: grid;
  grid-template-columns: 74px 1fr;
  gap: 16px;
  background: #fff;
  border: 1px solid var(--icx-line);
  border-radius: 6px;
  padding: 16px;
  margin-bottom: 12px;
}
.ich-lab.is-cancelled {
  opacity: 0.6;
}
.ich-lab-date {
  background: linear-gradient(
    160deg,
    var(--icx-gold) 0%,
    var(--icx-gold-d) 100%
  );
  color: #fff;
  border-radius: 6px;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  padding: 8px 4px;
  text-align: center;
  min-height: 74px;
}
.ich-lab-date .d {
  font-size: 26px;
  font-weight: 800;
  line-height: 1;
  color: #fff;
  font-family: Montserrat, sans-serif;
}
.ich-lab-date .m {
  font-size: 12.5px;
  font-weight: 700;
}
.ich-lab-body strong {
  color: var(--icx-navy);
}
.ich-lab-body p {
  margin: 2px 0;
}
.ich-lab-text {
  font-size: 14.5px;
  color: var(--icx-muted);
  margin-top: 6px;
}
.ich-lab-actions {
  display: flex;
  gap: 8px;
  margin-top: 8px;
}
.ich-lab .ich-files {
  margin-top: 10px;
  padding: 12px 14px;
}
.ich-dl {
  display: grid;
  grid-template-columns: auto 1fr;
  gap: 6px 18px;
  margin: 0 0 14px;
}
.ich-dl dt {
  color: var(--icx-muted);
  font-weight: 400;
}
.ich-dl dd {
  margin: 0;
  color: var(--icx-navy);
  font-weight: 700;
}
.ich-locked {
  text-align: center;
  padding: 30px 10px;
}

/* ==========================================================================
   Responsive
   ========================================================================== */
@media (max-width: 1100px) {
  .icx-portals {
    grid-template-columns: repeat(2, 1fr);
  }
  .icx-portal:nth-child(3) {
    border-inline-start: 0;
  }
  .icx-portal:nth-child(n + 3) {
    border-top: 1px solid var(--icx-line);
  }
  .icx-grid-4,
  .icx-grid-5 {
    grid-template-columns: repeat(2, 1fr);
  }
  .icx-letters {
    grid-template-columns: repeat(2, 1fr);
  }
  .icx-steps,
  .icx-roadmap {
    grid-template-columns: repeat(3, 1fr);
  }
  .icx-path {
    grid-template-columns: 1fr 1fr;
  }
  .icx-path li.is-now {
    grid-column: 1 / -1;
  }
  .ich-grid-4 {
    grid-template-columns: repeat(2, 1fr);
  }
  .icx-hero-grid {
    gap: 40px;
  }
  .icx-hero-photo figcaption {
    inset-inline-end: -4%;
  }
  .icx-route small {
    font-size: 12px;
  }
}
@media (max-width: 900px) {
  .icx-hero-grid {
    grid-template-columns: 1fr;
    padding-top: 130px;
    gap: 8px;
  }
  .icx-hero-text {
    padding-bottom: 12px;
  }
  .icx-hero-photo {
    max-width: 320px;
    margin-top: 18px;
  }
  .icx-route-in {
    padding: 26px 20px 20px;
  }
  .icx-route-line,
  .icx-route-cap {
    display: none;
  }
  .icx-route ol {
    grid-template-columns: repeat(4, minmax(0, 1fr));
    row-gap: 18px;
  }
  .icx-route .l {
    width: 40px;
    height: 40px;
    font-size: 16px;
  }
  .icx-route-note {
    flex-direction: column;
    align-items: flex-start;
    gap: 4px;
  }
  [dir="rtl"] .icx-route-note {
    align-items: flex-end;
  }
}
@media (max-width: 767px) {
  .icx {
    font-size: 15.5px;
  }
  .icx-hero,
  .icx-hero.is-home {
    padding: 56px 0 52px;
  }
  .icx-hero.is-portrait {
    padding: 0;
  }
  .icx-hero-grid {
    padding-top: 110px;
  }
  .icx-hero-photo {
    margin-inline: 24px 34px;
    width: auto;
  }
  .icx-hero-photo figcaption {
    inset-inline-end: -26px;
    bottom: 10%;
  }
  .icx-creds {
    gap: 10px 20px;
    margin-top: 24px !important;
  }
  .icx-route small {
    font-size: 11.5px;
  }
  .icx-sec {
    padding: 52px 0;
  }
  .icx-row.is-boxed .icx-sec {
    padding-inline: 0;
  }
  .icx-head {
    margin-bottom: 28px;
  }
  .icx-grid-2,
  .icx-grid-3,
  .icx-grid-4,
  .icx-grid-5,
  .icx-portals,
  .icx-letters,
  .icx-steps,
  .icx-roadmap,
  .icx-path,
  .icx-split,
  .icx-split.is-flip,
  .icx-two,
  .icx-two.is-wide-first,
  .icx-vm .icx-in,
  .icx-rel {
    grid-template-columns: 1fr;
  }
  .icx-portal {
    border-inline-start: 0 !important;
    border-top: 1px solid var(--icx-line);
  }
  .icx-portal:first-child {
    border-top: 0;
  }
  .icx-split {
    gap: 28px;
  }
  .icx-split-media img {
    aspect-ratio: 4 / 3;
  }
  .icx-split.is-flip .icx-split-media {
    order: -1;
  }
  .icx-split-media.is-mark {
    aspect-ratio: 16 / 9;
  }
  .icx-cohort-in,
  .icx-band .icx-in {
    flex-direction: column;
    align-items: stretch;
    padding: 28px 22px;
  }
  .icx-band .icx-in {
    padding: 0 20px;
  }
  .icx-actions {
    flex-direction: column;
    align-items: stretch;
  }
  .icx-actions .icx-btn {
    width: 100%;
  }
  .icx-tier {
    grid-template-columns: 1fr;
    gap: 4px;
  }
  .icx-tier em {
    justify-self: start;
  }
  .icx-form {
    padding: 22px 16px;
  }
  .icx-form-row,
  .icx-form .icx-checks {
    grid-template-columns: 1fr;
  }
  .icx-table th,
  .icx-table td {
    padding: 10px 12px;
    font-size: 14px;
  }
  .ich-grid-2,
  .ich-grid-3,
  .ich-grid-4 {
    grid-template-columns: 1fr;
  }
  .ich-tabs {
    flex-wrap: nowrap;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
  }
  .ich-tabs a {
    white-space: nowrap;
  }
  .ich-lab {
    grid-template-columns: 60px 1fr;
  }
}
@media (prefers-reduced-motion: reduce) {
  .icx *,
  .ich * {
    transition: none !important;
  }
  .icx-route-line span {
    animation: none;
  }
}

/* ---------- CCCP programme page ---------- */
.icx-hero.is-cccp .icx-sub-en {
  color: var(--icx-gold);
  font-weight: 600;
  letter-spacing: 0.02em;
  margin: -6px 0 14px;
  text-align: start;
}
[dir="rtl"] .icx-hero.is-cccp .icx-sub-en {
  text-align: right;
}
.icx-facts {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 0;
  margin-top: 28px;
  border-top: 1px solid rgba(207, 163, 94, 0.3);
  max-width: 760px;
}
.icx-facts li {
  padding: 16px 18px 0;
  border-inline-start: 1px solid rgba(207, 163, 94, 0.22);
  display: grid;
  gap: 2px;
}
.icx-facts li:first-child {
  border-inline-start: 0;
  padding-inline-start: 0;
}
.icx-facts b {
  color: #fff;
  font-size: 26px;
  font-weight: 700;
  line-height: 1.2;
}
.icx-facts span {
  color: rgba(255, 255, 255, 0.7);
  font-size: 13.5px;
}
.icx-checks-2 {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 14px 40px;
  max-width: 980px;
  margin: 0 auto;
}
/* FAQ — the same component as the book and card pages (.nvc-faq / .ngb-faq):
   bold question, a plus drawn from two gold lines whose vertical stroke turns
   to a minus, hairlines between items and none under the last. Motion and
   one-open-at-a-time live in site.js. */
.icx-faq {
  max-width: 820px;
  margin-inline: auto;
}
.icx-faq details {
  border-bottom: 1px solid var(--icx-line);
}
.icx-faq details:last-of-type {
  border-bottom: 0;
}
.icx-faq summary {
  cursor: pointer;
  list-style: none;
  font-weight: 700;
  padding: 19px 0;
  padding-inline-end: 38px;
  color: var(--icx-navy);
  position: relative;
  font-size: 17px;
  transition: color 0.2s;
}
.icx-faq summary:hover {
  color: var(--icx-gold-d);
}
.icx-faq summary::-webkit-details-marker {
  display: none;
}
.icx-faq summary::before,
.icx-faq summary::after {
  content: "";
  position: absolute;
  inset-inline-end: 0;
  top: 50%;
  width: 16px;
  height: 2px;
  border-radius: 2px;
  background: var(--icx-gold-d);
  transition:
    transform 0.38s cubic-bezier(0.4, 0, 0.2, 1),
    opacity 0.38s;
}
.icx-faq summary::after {
  transform: translateY(-50%);
}
.icx-faq summary::before {
  transform: translateY(-50%) rotate(90deg);
}
.icx-faq details[open] summary::before {
  transform: translateY(-50%) rotate(0deg);
}
.icx-faq .a,
.icx-faq details p {
  padding: 0 0 22px;
  margin: 0;
  color: var(--icx-muted);
}
@media (prefers-reduced-motion: reduce) {
  .icx-faq summary::before,
  .icx-faq summary::after {
    transition: none;
  }
}
.icx-register-head {
  padding-bottom: 24px !important;
}
.icx-row.icx-cf7-wrap {
  background: var(--icx-paper);
  padding-bottom: 72px;
}
.icx-form-card {
  max-width: 860px;
  margin: 0 auto;
  background: #fff;
  border: 1px solid var(--icx-line);
  border-radius: 6px;
  border-end-end-radius: 32px;
  padding: 34px 34px 28px;
}
.icx-form-card .row {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 0 20px;
  margin: 0 0 16px !important;
}
.icx-form-card .row::before,
.icx-form-card .row::after {
  display: none;
}
.icx-form-card .row > [class*="col-"] {
  width: auto !important;
  float: none !important;
  padding: 0 !important;
  text-align: start !important;
}
.icx-form-card .row > .col-sm-12 {
  grid-column: 1 / -1;
}
.icx-form-card label,
.icx-form-card label.small {
  display: block;
  font-size: 14px !important;
  font-weight: 600;
  color: var(--icx-navy);
  margin-bottom: 6px;
}
.icx-form-card input:not([type="submit"]),
.icx-form-card select,
.icx-form-card textarea {
  width: 100% !important;
  border: 1px solid var(--icx-line);
  border-radius: 3px;
  padding: 11px 12px !important;
  font-size: 15px;
  background: #fff;
  height: auto !important;
}
.icx-form-card textarea {
  min-height: 110px;
}
.icx-form-card .wpcf7-submit {
  min-width: 200px;
}
.icx-form-card .wpcf7-spinner {
  vertical-align: middle;
}
@media (max-width: 1100px) {
  .icx-grid-5 {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
}
@media (max-width: 767px) {
  .icx-facts {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    row-gap: 14px;
  }
  .icx-facts li:nth-child(3) {
    border-inline-start: 0;
    padding-inline-start: 0;
  }
  .icx-checks-2,
  .icx-form-card .row,
  .icx-grid-5 {
    grid-template-columns: 1fr;
  }
  .icx-form-card {
    padding: 22px 16px;
  }
}

/* Contact Form 7 wraps every form in dir="ltr" (the site's default language),
   so Arabic pages get left-aligned labels and mirrored columns. Follow the page. */
.rtl .wpcf7[dir="ltr"],
.icx-form-card[dir="rtl"] .wpcf7 {
  direction: rtl;
}
.icx-form-card label + br,
.icx-form-card .row br {
  display: none;
}
.icx-form-card p {
  margin: 0;
}
.icx-form-card .wpcf7-form-control-wrap {
  display: block;
}

/* When the shared FAQ script runs, it drives the motion of the card and book
   FAQs too; their CSS-only transition would otherwise animate twice. */
html.am-faq-js .nvc-faq details::details-content {
  transition: none !important;
}

/* ---------- Trainer block (CCCP page) ---------- */
.icx-trainer {
  display: grid;
  grid-template-columns: minmax(0, 5fr) minmax(0, 7fr);
  gap: 56px;
  align-items: center;
}
.icx-trainer-photo {
  position: relative;
  margin: 0;
  overflow: visible !important;
  max-width: 460px;
  width: 100%;
  justify-self: center;
}
.icx-trainer-photo::before {
  content: "";
  position: absolute;
  inset-block: 16px -16px;
  inset-inline-start: 16px;
  inset-inline-end: -16px;
  border: 1.5px solid var(--icx-gold);
  border-radius: 8px;
  border-end-end-radius: 64px;
  opacity: 0.55;
}
.icx .icx-trainer-photo img {
  position: relative;
  width: 100%;
  aspect-ratio: 4 / 5;
  max-height: 540px;
  object-fit: cover;
  object-position: 62% 18%;
  border-radius: 8px;
  border-end-end-radius: 64px;
}
.icx-trainer-photo figcaption {
  position: absolute;
  z-index: 2;
  inset-inline-end: -26px;
  bottom: 40px;
  background: #fff;
  padding: 12px 18px;
  border-radius: 6px;
  box-shadow: 0 16px 30px -14px rgba(15, 30, 51, 0.4);
  display: grid;
  gap: 2px;
}
.icx-trainer-photo figcaption b {
  color: var(--icx-navy);
  font-size: 15.5px;
}
.icx-trainer-photo figcaption span {
  color: var(--icx-gold-d);
  font-size: 12.5px;
  font-weight: 700;
  direction: ltr;
  text-align: start;
}
.icx-trainer-body h2 {
  margin-bottom: 6px;
}
.icx-trainer-body .icx-sub {
  color: var(--icx-gold-d);
  font-weight: 700;
  margin-bottom: 24px;
}
.icx-trainer-stats {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 14px;
  margin: 0 0 24px;
}
.icx-trainer-stats li {
  position: relative;
  background: #fff;
  border: 1px solid var(--icx-line);
  border-radius: 6px;
  padding: 16px 18px 15px;
  display: grid;
  gap: 4px;
  align-content: start;
}
.icx-trainer-stats li::before {
  content: "";
  position: absolute;
  top: -1px;
  inset-inline-start: 18px;
  width: 28px;
  height: 2px;
  background: var(--icx-gold);
}
.icx-trainer-stats b {
  color: var(--icx-navy);
  font-size: 22px;
  font-weight: 700;
  line-height: 1.3;
}
.icx-trainer-stats span {
  color: var(--icx-muted);
  font-size: 14px;
  line-height: 1.6;
}
.icx .icx-trainer-quote {
  position: relative;
  margin: 22px 0 26px !important;
  padding: 18px 22px 16px;
  padding-inline-start: 54px;
  background: var(--icx-paper);
  border: 0 !important;
  border-inline-start: 3px solid var(--icx-gold) !important;
  border-radius: 0;
  border-start-end-radius: 6px;
  border-end-end-radius: 6px;
  font-size: inherit;
}
.icx-trainer-quote::after {
  display: none;
}
.icx .icx-trainer-quote::before {
  content: "\201D";
  background: none !important;
  width: auto;
  height: auto;
  bottom: auto;
  position: absolute;
  inset-inline-start: 16px;
  top: 6px;
  font-size: 56px;
  line-height: 1;
  color: var(--icx-gold);
  opacity: 0.7;
}
.icx-trainer-quote p {
  color: var(--icx-navy);
  font-size: 16.5px;
  line-height: 1.9;
  margin: 0 0 6px;
}
.icx-trainer-quote cite {
  font-style: normal;
  color: var(--icx-gold-d);
  font-weight: 700;
  font-size: 14px;
}
.icx-trainer-body .icx-actions {
  margin-top: 0;
}
@media (max-width: 991px) {
  .icx-trainer {
    grid-template-columns: 1fr;
    gap: 40px;
  }
  .icx-trainer-photo {
    max-width: 360px;
  }
}
@media (max-width: 767px) {
  .icx-trainer-stats {
    grid-template-columns: 1fr 1fr;
    gap: 10px;
  }
  .icx-trainer-stats li {
    padding: 14px;
  }
  .icx-trainer-stats b {
    font-size: 19px;
  }
  .icx-trainer-photo figcaption {
    inset-inline-end: -8px;
  }
}

/* ---------- Split hero with an arched portrait (About) ---------- */
.icx-hero.is-split {
  padding: 84px 0 0;
  background:
    radial-gradient(
      50% 90% at 20% 60%,
      rgba(176, 141, 87, 0.14),
      transparent 65%
    ),
    var(--icx-navy);
}
[dir="rtl"] .icx-hero.is-split,
.rtl .icx-hero.is-split {
  background:
    radial-gradient(
      50% 90% at 80% 60%,
      rgba(176, 141, 87, 0.14),
      transparent 65%
    ),
    var(--icx-navy);
}
.icx-hero.is-split::after {
  display: none;
}
.icx-split-grid {
  position: relative;
  z-index: 1;
  width: min(100% - 40px, var(--icx-w));
  margin-inline: auto;
  display: grid;
  grid-template-columns: minmax(0, 1.25fr) minmax(0, 0.75fr);
  gap: 56px;
  align-items: end;
}
.icx-hero.is-split .icx-hero-text {
  align-self: center;
  padding-bottom: 84px;
}
.icx-arch {
  position: relative;
  margin: 0;
  justify-self: center;
  width: min(100%, 360px);
  overflow: visible !important;
}
.icx-arch::before {
  content: "";
  position: absolute;
  inset: -12px -12px 0;
  border: 1px solid rgba(201, 168, 110, 0.55);
  border-bottom: 0;
  border-radius: 999px 999px 0 0;
  pointer-events: none;
}
.icx .icx-arch img {
  display: block;
  width: 100%;
  max-width: none;
  aspect-ratio: 4 / 5;
  object-fit: cover;
  object-position: 60% 20%;
  border-radius: 999px 999px 0 0;
}
.icx-arch figcaption {
  position: absolute;
  z-index: 2;
  inset-inline-start: -30px;
  bottom: 34px;
  display: grid;
  gap: 2px;
  background: #fff;
  color: var(--icx-navy);
  border-radius: 6px;
  padding: 10px 16px;
  box-shadow: 0 16px 30px -14px rgba(0, 0, 0, 0.45);
}
.icx-arch figcaption b {
  font-size: 15px;
  color: var(--icx-navy);
}
.icx-arch figcaption span {
  font-size: 12px;
  font-weight: 700;
  color: var(--icx-gold-d);
}
@media (max-width: 991px) {
  .icx-hero.is-split {
    padding-top: 64px;
  }
  .icx-split-grid {
    grid-template-columns: 1fr;
    gap: 36px;
  }
  .icx-hero.is-split .icx-hero-text {
    padding-bottom: 0;
  }
  .icx-arch {
    width: min(100%, 280px);
  }
  .icx-arch figcaption {
    inset-inline-start: -14px;
  }
}

/* ---------- Section links under a long page's hero (CCCP) ---------- */
.icx-hero.has-tabs {
  padding-bottom: 0;
}
/* Old theme (identity switch off): its header floats over the page top, so
   inner-page heroes start below it. */
body:not(.am-ds)
  .icx-hero:not(.is-portrait):not(.is-split):not(.is-home):not(.is-ic) {
  padding-top: 140px;
}
@media (max-width: 991px) {
  body:not(.am-ds)
    .icx-hero:not(.is-portrait):not(.is-split):not(.is-home):not(.is-ic) {
    padding-top: 110px;
  }
}
.icx-hero.has-tabs .icx-in {
  padding-bottom: 56px;
}
.icx-tabs {
  position: relative;
  z-index: 2;
  border-top: 1px solid rgba(255, 255, 255, 0.12);
  background: rgba(10, 31, 54, 0.45);
}
.icx-tabs-in {
  display: flex;
  gap: 30px;
  overflow-x: auto;
  white-space: nowrap;
  scrollbar-width: none;
  margin-inline: max(20px, calc((100% - var(--icx-w)) / 2));
}
.icx-tabs-in::-webkit-scrollbar {
  display: none;
}
.icx .icx-tabs a {
  flex: none;
  padding: 15px 0 13px;
  font-size: 14px;
  font-weight: 500;
  color: rgba(255, 255, 255, 0.72) !important;
  border-bottom: 2px solid transparent;
  text-decoration: none !important;
  transition:
    color 0.2s,
    border-color 0.2s;
}
.icx .icx-tabs a:hover,
.icx .icx-tabs a:focus-visible,
.icx .icx-tabs a.is-on {
  color: #fff !important;
  border-bottom-color: var(--icx-gold);
}
.icx-tabs.is-pinned {
  position: fixed;
  top: var(--icx-pin-top, 0px);
  left: 0;
  right: 0;
  z-index: 990;
  background: rgba(10, 31, 54, 0.96);
  -webkit-backdrop-filter: blur(8px);
  backdrop-filter: blur(8px);
  border-top-color: rgba(176, 141, 87, 0.25);
  box-shadow: 0 12px 24px -18px rgba(0, 0, 0, 0.6);
}
.icx-tabs-ph {
  display: none;
}
.icx-tabs.is-pinned + .icx-tabs-ph,
.icx-tabs-ph.is-active {
  display: block;
  height: var(--icx-tabs-h, 48px);
}
.icx [id="who"],
.icx [id="themes"],
.icx [id="outcomes"],
.icx [id="trainer"],
.icx [id="icf"],
.icx [id="faq"],
.icx [id="register"] {
  scroll-margin-top: 140px;
}

/* ---------- Launch announcement (Inspiring Careers page, v1.4) ---------- */
.icx .icx-anchor {
  scroll-margin-top: 140px;
}
.icx-prose {
  max-width: 860px;
  margin: 0 auto;
}
.icx-prose .icx-head {
  margin-bottom: 26px;
}
.icx-prose p {
  color: var(--icx-ink);
  font-size: 17px;
  margin: 0 0 16px;
}
.icx-prose p.icx-big {
  margin-top: 8px;
}
.icx .icx-list {
  display: grid;
  gap: 6px;
  padding: 0;
  padding-inline-start: 26px;
  margin: 0;
  color: var(--icx-ink);
  font-size: 15px;
  line-height: 1.6;
  list-style: disc outside;
}
.icx ol.icx-list {
  list-style: decimal outside;
}
.icx .icx-list li {
  display: list-item;
  margin: 0;
  padding: 0;
  padding-inline-start: 4px;
}
.icx-list li::marker {
  color: var(--icx-gold-d);
  font-weight: 700;
}
.icx-list strong {
  color: var(--icx-navy);
}
.icx-list.is-two {
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 8px 24px;
}
.icx-objectives {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 14px;
  margin: 0;
  padding: 0;
  list-style: none;
  counter-reset: obj;
}
.icx-objectives li {
  counter-increment: obj;
  position: relative;
  background: #fff;
  border: 1px solid var(--icx-line);
  border-radius: 6px;
  padding: 18px 20px;
  padding-inline-start: 66px;
  color: var(--icx-ink);
  font-size: 15.5px;
  line-height: 1.6;
}
.icx-objectives li::before {
  content: counter(obj, decimal-leading-zero);
  position: absolute;
  inset-inline-start: 20px;
  top: 16px;
  font-family: Montserrat, sans-serif;
  font-weight: 700;
  font-size: 20px;
  color: var(--icx-gold-d);
}
/* Benefits: short cards, four across on desktop. Number, title, one or two
   lines, then «Learn more» pinned to the bottom so the cards line up. */
.icx-benefits {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 20px;
}
.icx-benefit {
  position: relative;
  background: #fff;
  border: 1px solid var(--icx-line);
  border-radius: 6px;
  border-end-end-radius: 32px;
  padding: 24px 22px 18px;
  display: flex;
  flex-direction: column;
  transition:
    border-color 0.2s ease,
    box-shadow 0.2s ease;
}
.icx-benefit:hover {
  border-color: var(--icx-gold);
  box-shadow: 0 10px 28px rgba(20, 24, 35, 0.06);
}
.icx-benefit-no {
  align-self: flex-start;
  font-family: Montserrat, sans-serif;
  font-weight: 300;
  font-size: 28px;
  line-height: 1;
  color: var(--icx-gold);
  margin-bottom: 14px;
}
.icx-benefit h3 {
  margin: 0;
  font-size: 18px;
  line-height: 1.5;
}
.icx-benefit .icx-kind {
  align-self: flex-start;
  margin-top: 2px;
  font-size: 11.5px;
}
.icx-benefit > p {
  margin: 12px 0 0;
  color: var(--icx-muted);
  font-size: 14.5px;
  line-height: 1.85;
}
.icx-benefit-more {
  margin-top: auto;
  padding-top: 16px;
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
}
.icx-benefit > p + .icx-benefit-more {
  margin-top: auto;
}
.icx-benefit-more::before {
  content: "";
  flex: 0 0 100%;
  height: 1px;
  background: var(--icx-line);
  margin-bottom: 6px;
}
.icx-soon {
  color: var(--icx-muted);
  font-size: 13px;
  font-weight: 600;
}
@media (max-width: 1199px) {
  .icx-benefits {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}
.icx-members-only {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  color: var(--icx-muted);
  font-size: 13px;
}
.icx-members-only svg {
  width: 12px;
  height: 12px;
  fill: none;
  stroke: currentColor;
  stroke-width: 2;
}
.icx-detail {
  border: 1px solid var(--icx-line);
  border-radius: 6px;
  background: var(--icx-cream);
}
.icx-detail summary {
  cursor: pointer;
  list-style: none;
  padding: 11px 14px;
  padding-inline-end: 38px;
  font-weight: 700;
  font-size: 14.5px;
  color: var(--icx-navy);
  position: relative;
}
.icx-detail summary::-webkit-details-marker {
  display: none;
}
.icx-detail summary::before,
.icx-detail summary::after {
  content: "";
  position: absolute;
  inset-inline-end: 14px;
  top: 50%;
  width: 12px;
  height: 2px;
  border-radius: 2px;
  background: var(--icx-gold-d);
  transform: translateY(-50%);
  transition: transform 0.3s;
}
.icx-detail summary::before {
  transform: translateY(-50%) rotate(90deg);
}
.icx-detail[open] summary::before {
  transform: translateY(-50%) rotate(0);
}
.icx-detail[open] summary {
  border-bottom: 1px solid var(--icx-line);
}
.icx .icx-detail-body {
  padding: 16px 20px 18px;
  display: grid;
  gap: 12px;
}
.icx-detail-body > p {
  color: var(--icx-muted);
  font-size: 14.5px;
}
.icx-letters.is-compact {
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
  padding: 0;
  margin: 0;
  list-style: none;
}
.icx-letters.is-compact li {
  padding: 12px 14px;
  grid-template-columns: 40px 1fr;
  border: 1px solid var(--icx-line);
}
.icx-letters.is-compact .l {
  width: 40px;
  height: 40px;
  font-size: 18px;
}
.icx-letters.is-compact strong {
  font-size: 15px;
}
.icx-letters.is-compact small {
  font-size: 12.5px;
}
.icx-axes {
  display: grid;
  gap: 10px;
  margin: 0 0 18px;
  padding: 0;
  list-style: none;
  counter-reset: axis;
}
.icx-axes li {
  counter-increment: axis;
  background: #fff;
  border-radius: 6px;
  padding: 14px 16px;
  padding-inline-start: 56px;
  position: relative;
  color: var(--icx-ink);
  font-size: 15px;
}
.icx-axes li::before {
  content: counter(axis);
  position: absolute;
  inset-inline-start: 14px;
  top: 12px;
  width: 30px;
  height: 30px;
  border-radius: 50%;
  background: var(--icx-gold);
  color: var(--icx-deep);
  font-family: Montserrat, sans-serif;
  font-weight: 700;
  display: inline-flex;
  align-items: center;
  justify-content: center;
}
.icx-axes strong {
  color: var(--icx-navy);
}
.icx-center-start {
  margin-top: 16px;
}
.icx-join-steps {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 14px;
  margin: 0 0 28px;
  padding: 0;
  list-style: none;
}
.icx-join-steps li {
  background: #fff;
  border-radius: 6px;
  padding: 20px 18px;
  display: flex;
  flex-direction: column;
  gap: 12px;
  color: var(--icx-navy);
  font-weight: 700;
  font-size: 15px;
  line-height: 1.5;
}
.icx-join-steps li span {
  width: 34px;
  height: 34px;
  border-radius: 50%;
  background: var(--icx-gold);
  color: var(--icx-deep);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-family: Montserrat, sans-serif;
}
.icx-notes.is-center {
  max-width: 820px;
  margin: 18px auto 0;
}
.icx-packages {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 22px;
  max-width: 900px;
  margin: 0 auto 26px;
}
.icx-package {
  position: relative;
  background: #fff;
  border: 1px solid var(--icx-line);
  border-radius: 6px;
  border-end-end-radius: 32px;
  padding: 30px 28px;
  display: flex;
  flex-direction: column;
  gap: 10px;
}
.icx-package.is-featured {
  border-color: var(--icx-gold);
  box-shadow: 0 18px 40px -28px rgba(22, 54, 92, 0.5);
}
.icx-package .icx-tag {
  position: absolute;
  top: 18px;
  inset-inline-end: 22px;
}
.icx-package h3 {
  font-size: 20px;
  margin: 0;
}
.icx-price {
  display: flex;
  align-items: baseline;
  gap: 10px;
  color: var(--icx-navy);
}
.icx-price strong {
  font-family: Montserrat, sans-serif;
  font-size: 54px;
  line-height: 1;
  font-weight: 800;
}
.icx-price span {
  color: var(--icx-gold-d);
  font-weight: 700;
}
.icx-price-sub {
  color: var(--icx-navy);
  font-weight: 700;
  font-size: 14.5px;
  margin: 0;
}
.icx-package > p {
  color: var(--icx-muted);
  font-size: 15px;
}
.icx-package .icx-save {
  color: var(--icx-ok);
  font-weight: 700;
  font-size: 14.5px;
}
.icx-package .icx-btn {
  margin-top: auto;
  align-self: flex-start;
}
.icx-value {
  max-width: 900px;
  margin: 0 auto 26px;
  background: var(--icx-navy);
  color: #fff;
  border-radius: 6px;
  padding: 28px 30px;
}
.icx-value h3 {
  color: var(--icx-gold);
  margin: 0 0 8px;
}
.icx-value p {
  color: rgba(255, 255, 255, 0.88);
  font-size: 15.5px;
  margin: 0 0 10px;
}
.icx-value ul {
  margin: 0 0 12px;
  padding-inline-start: 22px;
  color: #fff;
  font-size: 15.5px;
  display: grid;
  gap: 6px;
}
.icx-value li::marker {
  color: var(--icx-gold);
}
@media (max-width: 900px) {
  .icx-join-steps {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}
@media (max-width: 767px) {
  .icx-objectives,
  .icx-benefits,
  .icx-packages,
  .icx-join-steps,
  .icx-list.is-two,
  .icx-letters.is-compact {
    grid-template-columns: 1fr;
  }
  .icx-price strong {
    font-size: 44px;
  }
  .icx-benefit,
  .icx-package {
    padding: 22px 18px;
  }
}

/* ---------- Collapsible details in tab intros (labs: contents, topics) ---------- */
.ich-details {
  border: 1px solid var(--icx-line, #e6dcc9);
  border-radius: 6px;
  background: #fff;
  margin: 0 0 12px;
}
.ich-details summary {
  cursor: pointer;
  list-style: none;
  padding: 12px 16px;
  padding-inline-end: 40px;
  font-weight: 700;
  color: var(--icx-navy, #16365c);
  position: relative;
}
.ich-details summary::-webkit-details-marker {
  display: none;
}
.ich-details summary::before,
.ich-details summary::after {
  content: "";
  position: absolute;
  inset-inline-end: 16px;
  top: 50%;
  width: 12px;
  height: 2px;
  border-radius: 2px;
  background: var(--icx-gold-d, #a87f3f);
  transform: translateY(-50%);
  transition: transform 0.3s;
}
.ich-details summary::before {
  transform: translateY(-50%) rotate(90deg);
}
.ich-details[open] summary::before {
  transform: translateY(-50%) rotate(0);
}
.ich-details ul {
  margin: 0;
  padding: 6px 16px 18px;
  padding-inline-start: 40px;
  display: grid;
  gap: 6px;
  color: var(--icx-ink, #34425a);
  font-size: 15px;
  line-height: 1.6;
  list-style: disc outside;
}
.ich-details li {
  display: list-item;
  margin: 0;
  padding-inline-start: 4px;
}
.ich-details li::marker {
  color: var(--icx-gold-d, #a87f3f);
}
.ich-details .ich-two-col {
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 6px 24px;
}
@media (max-width: 767px) {
  .ich-details .ich-two-col {
    grid-template-columns: 1fr;
  }
}

/* ---------- Inspiring Careers banner hero (owner's banner, 2026-10-15) ----------
   The owner's banner (img/inspiring-hero.webp, 1958×803) is the whole hero: the
   book, the NAVIGATE® wheel and the desk on its left, and its own dark navy
   on the right, where the live text, buttons and feature links sit. The
   photo side carries printed text, so the picture is never mirrored: the
   text column stays on the right in both languages (reading-start for
   Arabic, image-then-text for English). A light glass over the navy keeps
   the copy readable where the photo slides under it on narrower screens. */
.icx-hero.is-ic {
  padding: 118px 0 0;
  isolation: isolate;
  background: linear-gradient(180deg, #0f1a2c 0%, #0b1424 100%);
}
.icx-hero.is-ic::after {
  display: none;
}
.icx-ic-media {
  /* Width of the glass, from the right edge: margin + text + air. */
  --ic-glass: calc(max(20px, (100% - 1320px) / 2) + 600px);
  position: absolute;
  z-index: 0;
  inset: 0 0 55px; /* the photo stops above the section tabs */
  background: #0f1a2c url("img/inspiring-hero.webp") no-repeat;
  background-size: cover;
  /* Narrower screens slide the photo out at the left edge, not under the text. */
  background-position: left
    clamp(-260px, calc((100vw - 1440px) * 0.4 - 40px), 0px) center;
}
.icx-ic-media::after {
  content: "";
  position: absolute;
  inset: 0;
  background:
    /* Navy at the top, so the site menu, «ENGLISH» and «حسابي» read over the photo (audit G5). */
    linear-gradient(180deg, rgba(23, 62, 101, 0.85) 0, rgba(23, 62, 101, 0) 170px),
    linear-gradient(0deg, rgba(8, 18, 32, 0.45) 0, rgba(8, 18, 32, 0) 120px),
    linear-gradient(
      to left,
      rgba(10, 20, 36, 0.55) 0,
      rgba(10, 20, 36, 0.5) var(--ic-glass),
      rgba(10, 20, 36, 0.25) calc(var(--ic-glass) + 80px),
      rgba(10, 20, 36, 0) calc(var(--ic-glass) + 170px)
    );
}
.icx-hero.is-ic .icx-ic-text {
  position: relative;
  z-index: 2;
  max-width: 600px;
  margin-inline-start: max(20px, calc((100% - 1320px) / 2));
  margin-inline-end: auto;
  padding-bottom: 36px;
}
/* English: the column moves to the banner's navy side (right) as well. */
[dir="ltr"] .icx-hero.is-ic .icx-ic-text {
  margin-inline-start: auto;
  margin-inline-end: max(20px, calc((100% - 1320px) / 2));
}
.icx-hero.is-ic .icx-eyebrow {
  color: #e8d6b4;
  font-weight: 500;
  font-size: 14px;
  letter-spacing: 0;
  margin-bottom: 8px;
}
.icx-hero.is-ic .icx-eyebrow::before {
  display: none;
}
.icx-hero.is-ic .icx-eyebrow::after {
  content: "";
  width: 140px;
  height: 1px;
  background: linear-gradient(to left, #cfa35e, rgba(207, 163, 94, 0));
}
[dir="ltr"] .icx-hero.is-ic .icx-eyebrow::after {
  background: linear-gradient(to right, #cfa35e, rgba(207, 163, 94, 0));
}
.icx-ic-brand {
  display: inline-flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
  margin-bottom: 20px;
}
.icx .icx-hero.is-ic h1 {
  color: #fff;
  font-size: clamp(44px, 4.4vw, 68px);
  font-weight: 800;
  line-height: 1.2;
  margin: 0 0 4px;
}
.icx[dir="ltr"] .icx-hero.is-ic h1 {
  font-size: clamp(40px, 4.4vw, 62px);
  white-space: nowrap;
}
.icx .icx-hero.is-ic .icx-ic-sub {
  margin: 0;
  color: #fff;
  font-size: clamp(20px, 1.9vw, 28px);
  font-weight: 500;
  line-height: 1.35;
}
.icx-ic-sub span {
  color: #e2b46a;
}
.icx-ic-rule {
  position: relative;
  display: block;
  width: 210px;
  height: 1px;
  margin-top: 16px;
  background: linear-gradient(
    90deg,
    rgba(207, 163, 94, 0),
    #cfa35e,
    rgba(207, 163, 94, 0)
  );
}
.icx-ic-rule::after {
  content: "";
  position: absolute;
  left: 50%;
  top: 50%;
  width: 7px;
  height: 7px;
  background: #e2b46a;
  transform: translate(-50%, -50%) rotate(45deg);
}
.icx .icx-hero.is-ic .icx-ic-lead {
  color: #fff;
  font-size: clamp(17px, 1.5vw, 22px);
  font-weight: 700;
  line-height: 1.6;
  margin: 0 0 12px;
}
.icx[dir="ltr"] .icx-hero.is-ic .icx-ic-lead {
  font-size: clamp(17px, 1.5vw, 21px);
}
.icx[dir="ltr"] .icx-ic-btn {
  font-size: 15.5px;
  padding-inline: 24px;
}
.icx .icx-hero.is-ic .icx-ic-copy {
  color: rgba(255, 255, 255, 0.8);
  font-size: 15.5px;
  line-height: 1.85;
  margin: 0;
}
.icx-hero.is-ic .icx-actions {
  flex-wrap: nowrap;
  gap: 16px;
  margin-top: 22px;
}
/* The two buttons share the column, as in the banner. */
.icx-hero.is-ic .icx-actions .icx-ic-btn.is-gold {
  flex: 1.25 1 0;
}
.icx-hero.is-ic .icx-actions .icx-ic-btn.is-line {
  flex: 1 1 0;
}
.icx .icx-ic-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 14px;
  min-width: 0;
  padding: 13px 22px;
  border-radius: 14px;
  font-size: 16.5px;
  white-space: nowrap;
  font-weight: 700;
  line-height: 1.3;
  transition:
    transform 0.2s,
    filter 0.2s,
    background 0.2s,
    border-color 0.2s;
}
.icx-ic-btn svg {
  flex: none;
  width: 22px;
  height: 22px;
  fill: none;
  stroke: currentColor;
  stroke-width: 2;
  stroke-linecap: round;
  stroke-linejoin: round;
}
.icx-ic-btn svg .is-fill {
  fill: currentColor;
  stroke: none;
}
[dir="rtl"] .icx-ic-btn.is-gold svg {
  transform: scaleX(-1);
}
.icx .icx-ic-btn.is-gold {
  color: #172235 !important;
  background: linear-gradient(135deg, #f2d899 0%, #dcae63 48%, #bb8b44 100%);
  border: 1px solid rgba(255, 228, 170, 0.6);
  box-shadow:
    0 12px 28px -14px rgba(220, 174, 99, 0.8),
    inset 0 1px 0 rgba(255, 255, 255, 0.45);
}
.icx .icx-ic-btn.is-gold:hover,
.icx .icx-ic-btn.is-gold:focus-visible {
  color: #172235 !important;
  filter: brightness(1.07);
  transform: translateY(-1px);
}
.icx .icx-ic-btn.is-line {
  color: #fff !important;
  background: rgba(10, 22, 38, 0.35);
  border: 1px solid rgba(255, 255, 255, 0.55);
}
.icx .icx-ic-btn.is-line:hover,
.icx .icx-ic-btn.is-line:focus-visible {
  color: #fff !important;
  background: rgba(255, 255, 255, 0.1);
  border-color: #fff;
}
.icx .icx-ic-feats {
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  margin-top: 28px;
  /* A little wider than the text, reaching onto the glass's edge (banner). */
  margin-inline-end: -80px;
}
/* English: the column sits at the right edge, so the extra width goes left. */
[dir="ltr"] .icx .icx-ic-feats {
  margin-inline-end: 0;
  margin-inline-start: -80px;
}
.icx .icx-ic-feats li {
  margin: 0 !important;
  padding: 0 !important;
  font-size: 15px !important;
}
.icx .icx-ic-feats li + li {
  border-inline-start: 1px solid rgba(214, 174, 104, 0.32);
}
.icx .icx-ic-feats a {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 10px;
  padding: 2px 4px;
  text-align: center;
  white-space: nowrap;
  color: #fff !important;
  font-size: 15px;
  font-weight: 500;
  line-height: 1.5;
}
.icx-ic-feats svg {
  width: 38px;
  height: 38px;
  fill: none;
  stroke: #dcae63;
  stroke-width: 1.4;
  stroke-linecap: round;
  stroke-linejoin: round;
  transition: transform 0.2s;
}
.icx .icx-ic-feats a:hover svg {
  transform: translateY(-3px);
}
.icx .icx-ic-feats a:hover span {
  color: #f2d899;
}
@media (max-width: 1299px) {
  .icx-ic-media {
    --ic-glass: calc(20px + 560px);
  }
  .icx-hero.is-ic .icx-ic-text {
    max-width: 560px;
  }
  .icx .icx-ic-btn {
    padding-inline: 18px;
    font-size: 15.5px;
  }
  .icx .icx-ic-feats {
    margin-inline-end: -40px;
  }
  [dir="ltr"] .icx .icx-ic-feats {
    margin-inline-end: 0;
    margin-inline-start: -40px;
  }
  .icx .icx-ic-feats a {
    font-size: 13.5px;
  }
}
@media (max-width: 991px) {
  .icx-hero.is-ic {
    padding-top: 0;
  }
  /* Phones and tablets: the banner's photo side on top, the text below on the navy. */
  .icx-ic-media {
    position: relative;
    inset: auto;
    width: 100%;
    height: clamp(320px, 62vw, 480px);
    background-size: cover;
    background-position: left center;
    -webkit-mask-image: linear-gradient(to bottom, #000 64%, transparent 100%);
    mask-image: linear-gradient(to bottom, #000 64%, transparent 100%);
  }
  /* The theme's mobile header floats over the photo's top. */
  .icx-ic-media::after {
    background: linear-gradient(
      180deg,
      rgba(23, 62, 101, 0.85) 0,
      rgba(23, 62, 101, 0) 130px
    );
  }
  .icx .icx-ic-feats,
  [dir="ltr"] .icx .icx-ic-feats {
    margin-inline-end: 0;
    margin-inline-start: 0;
  }
  .icx-hero.is-ic .icx-ic-text,
  [dir="ltr"] .icx-hero.is-ic .icx-ic-text {
    margin-inline-start: auto;
    margin-inline-end: auto;
  }
  .icx-hero.is-ic .icx-ic-text {
    max-width: 720px;
    margin: -70px auto 0;
    padding: 0 20px 44px;
    text-align: center;
  }
  .icx-hero.is-ic .icx-eyebrow {
    justify-content: center;
  }
  .icx-hero.is-ic .icx-eyebrow::after {
    display: none;
  }
  .icx-ic-brand {
    display: flex;
  }
  .icx-hero.is-ic .icx-actions {
    justify-content: center;
  }
}
@media (max-width: 640px) {
  .icx-hero.is-ic .icx-ic-text {
    margin-top: -50px;
  }
  .icx-hero.is-ic .icx-actions {
    flex-direction: column;
    align-items: stretch;
  }
  .icx-hero.is-ic .icx-actions .icx-ic-btn.is-gold,
  .icx-hero.is-ic .icx-actions .icx-ic-btn.is-line {
    flex: none;
    width: 100%;
  }
  .icx .icx-ic-feats {
    grid-template-columns: repeat(6, minmax(0, 1fr));
    row-gap: 22px;
  }
  .icx .icx-ic-feats li {
    grid-column: span 2;
  }
  .icx .icx-ic-feats li:nth-child(4) {
    grid-column: 2 / span 2;
  }
  .icx .icx-ic-feats li + li {
    border: 0;
  }
  .icx .icx-ic-feats a {
    font-size: 14px;
  }
}

/* ==========================================================================
   Inspiring Careers page skin (2026-10-13): the hero's identity carried
   through the whole page. Navy type, warm ivory paper, hairline gold with the
   hero's diamond rule, gold-gradient buttons, quiet white cards and a few navy
   panels in the hero's gradient. Scoped to «.icx-ic» (the page's wrappers, the
   join-form row and the pinned tabs host), so other pages keep their look.
   ========================================================================== */
.icx-ic {
  --icx-navy: #10233f;
  --icx-deep: #0b1829;
  --icx-gold: #cfa35e;
  --icx-gold-d: #9b7536;
  --icx-cream: #fbf8f2;
  --icx-paper: #f7f2e8;
  --icx-line: #ece2cf;
  --icx-ink: #3a4558;
  --icx-muted: #697385;
  --icx-ok: #b48a46;
  --ic-shadow: 0 22px 44px -36px rgba(11, 24, 41, 0.5);
  --ic-shadow-up: 0 28px 50px -30px rgba(11, 24, 41, 0.45);
  --ic-rule: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='170' height='9'%3E%3Cdefs%3E%3ClinearGradient id='g'%3E%3Cstop offset='0' stop-color='%23cfa35e' stop-opacity='0'/%3E%3Cstop offset='.5' stop-color='%23cfa35e'/%3E%3Cstop offset='1' stop-color='%23cfa35e' stop-opacity='0'/%3E%3C/linearGradient%3E%3C/defs%3E%3Crect y='4' width='170' height='1' fill='url(%23g)'/%3E%3Crect x='81.5' y='1' width='7' height='7' fill='%23e2b46a' transform='rotate(45 85 4.5)'/%3E%3C/svg%3E");
}

/* Sections: white and warm ivory, divided by a whisper of gold. */
.icx-ic .icx-sec {
  padding-block: 84px;
}
.icx-ic .icx-sec.is-paper {
  background: linear-gradient(180deg, #f8f4ec 0%, #f5efe4 100%);
  border-block: 1px solid rgba(207, 163, 94, 0.16);
}

/* Section heads: gold eyebrow between hairlines, navy title, diamond rule. */
.icx-ic .icx-eyebrow {
  color: var(--icx-gold-d);
  font-weight: 600;
  letter-spacing: 0.02em;
}
.icx-ic .icx-eyebrow::before,
.icx-ic .icx-head .icx-eyebrow::after {
  width: 40px;
  height: 1px;
  background: var(--icx-gold);
}
.icx-ic h2,
.icx-ic h3 {
  color: var(--icx-navy);
}
.icx-ic .icx-head {
  margin-bottom: 46px;
}
.icx-ic .icx-head h2::after,
.icx-ic .icx-two > div > h2::after,
.icx-ic .icx-band h2::after {
  content: "";
  display: block;
  width: 170px;
  height: 9px;
  margin: 18px auto 0;
  background: var(--ic-rule) center / contain no-repeat;
}
.icx-ic .icx-two .icx-head h2::after,
.icx-ic .icx-two > div > h2::after {
  margin-inline: 0;
}
.icx-ic .icx-head p {
  color: var(--icx-muted);
}
.icx-ic .icx-big {
  color: var(--icx-navy);
  font-size: 18.5px;
  line-height: 2;
}

/* Buttons: the hero's gold gradient; ghost = navy text on a gold hairline. */
.icx-ic .icx-btn {
  border-radius: 12px;
  padding: 12px 26px;
  color: #172235 !important;
  background: linear-gradient(135deg, #f2d899 0%, #dcae63 48%, #bb8b44 100%);
  border: 1px solid rgba(187, 139, 68, 0.55);
  box-shadow: 0 12px 26px -18px rgba(187, 139, 68, 0.95);
  transition:
    transform 0.2s,
    filter 0.2s,
    background 0.2s,
    color 0.2s,
    border-color 0.2s;
}
.icx-ic .icx-btn:hover,
.icx-ic .icx-btn:focus-visible {
  color: #172235 !important;
  background: linear-gradient(135deg, #f2d899 0%, #dcae63 48%, #bb8b44 100%);
  border-color: rgba(187, 139, 68, 0.8);
  filter: brightness(1.06);
  transform: translateY(-1px);
}
.icx-ic .icx-btn.is-small {
  padding: 8px 18px;
  border-radius: 10px;
}
.icx-ic .icx-btn.is-ghost {
  background: transparent;
  color: var(--icx-navy) !important;
  border-color: rgba(207, 163, 94, 0.75);
  box-shadow: none;
}
.icx-ic .icx-btn.is-ghost:hover,
.icx-ic .icx-btn.is-ghost:focus-visible {
  background: var(--icx-navy);
  border-color: var(--icx-navy);
  color: #fff !important;
  filter: none;
}
.icx-ic .icx-band .icx-btn.is-light {
  color: #172235 !important;
  background: linear-gradient(135deg, #f2d899 0%, #dcae63 48%, #bb8b44 100%);
  border-color: rgba(255, 228, 170, 0.6);
}

/* Cards: white, hairline border, soft long shadow, one rounded rhythm. */
.icx-ic .icx-benefit,
.icx-ic .icx-package,
.icx-ic .icx-objectives li,
.icx-ic .icx-join-steps li,
.icx-ic .icx-axes li,
.icx-ic .icx-roadmap li,
.icx-ic .icx-tier,
.icx-ic .icx-form {
  background: #fff;
  border: 1px solid var(--icx-line);
  border-radius: 14px;
  box-shadow: var(--ic-shadow);
}
.icx-ic .icx-benefit,
.icx-ic .icx-package {
  border-end-end-radius: 36px;
}
.icx-ic .icx-benefit {
  overflow: hidden;
  transition:
    transform 0.25s ease,
    border-color 0.25s ease,
    box-shadow 0.25s ease;
}
.icx-ic .icx-benefit::after {
  content: "";
  position: absolute;
  top: 0;
  inset-inline: 24px;
  height: 2px;
  background: linear-gradient(
    90deg,
    rgba(207, 163, 94, 0),
    #cfa35e,
    rgba(207, 163, 94, 0)
  );
  opacity: 0;
  transition: opacity 0.25s ease;
}
.icx-ic .icx-benefit:hover {
  transform: translateY(-3px);
  border-color: rgba(207, 163, 94, 0.55);
  box-shadow: var(--ic-shadow-up);
}
.icx-ic .icx-benefit:hover::after {
  opacity: 1;
}
.icx-ic .icx-benefit-no {
  color: var(--icx-gold);
}
.icx-ic .icx-kind {
  color: var(--icx-gold-d);
}

/* Numbers: gold hairline circles with navy figures (steps and strands). */
.icx-ic .icx-axes li::before,
.icx-ic .icx-join-steps li span {
  background: #fffaf1;
  border: 1px solid var(--icx-gold);
  color: var(--icx-navy);
  font-weight: 600;
}
.icx-ic .icx-objectives li::before {
  color: var(--icx-gold);
  font-weight: 300;
  font-size: 22px;
}

/* «Now» markers. */
.icx-ic .icx-tag.is-now {
  background: rgba(207, 163, 94, 0.14);
  color: #8a6528;
  border: 1px solid rgba(207, 163, 94, 0.4);
}
.icx-ic .icx-roadmap li.is-now {
  border-color: rgba(207, 163, 94, 0.6);
  box-shadow:
    inset 0 2px 0 var(--icx-gold),
    var(--ic-shadow-up);
}
.icx-ic .icx-tier.is-now {
  border-color: rgba(207, 163, 94, 0.6);
  box-shadow:
    inset 3px 0 0 var(--icx-gold),
    var(--ic-shadow);
}
.icx-ic[dir="rtl"] .icx-tier.is-now {
  box-shadow:
    inset -3px 0 0 var(--icx-gold),
    var(--ic-shadow);
}

/* Navy panels in the hero's gradient, gold titles. */
.icx-ic .icx-tier.is-base,
.icx-ic .icx-value {
  background:
    radial-gradient(
      60% 140% at 100% 0%,
      rgba(207, 163, 94, 0.14),
      transparent 70%
    ),
    linear-gradient(135deg, #10233f 0%, #0b1829 100%);
  border: 1px solid rgba(207, 163, 94, 0.35);
}
.icx-ic .icx-tier.is-base strong,
.icx-ic .icx-value h3 {
  color: #e2b46a;
}
.icx-ic .icx-value {
  border-radius: 16px;
  padding: 32px 34px;
  box-shadow: var(--ic-shadow-up);
}

/* Packages: the annual one is lit in gold. */
.icx-ic .icx-packages {
  gap: 26px;
}
.icx-ic .icx-package {
  padding: 34px 30px;
}
.icx-ic .icx-package.is-featured {
  background: linear-gradient(180deg, #fffaf0 0%, #fff 45%);
  border-color: rgba(207, 163, 94, 0.7);
  box-shadow: var(--ic-shadow-up);
}
.icx-ic .icx-price strong {
  color: var(--icx-navy);
  font-weight: 700;
}
.icx-ic .icx-package .icx-save {
  color: #8a6528;
}

/* Quiet notes and the qualification chain. */
.icx-ic .icx-notes li {
  background: rgba(255, 255, 255, 0.75);
  border: 1px solid var(--icx-line);
  border-inline-start: 2px solid var(--icx-gold);
  border-radius: 10px;
  color: var(--icx-ink);
}
.icx-ic .icx-chain li {
  background: #fff;
  border: 1px solid var(--icx-line);
  box-shadow: var(--ic-shadow);
}
.icx-ic .icx-quote strong {
  color: var(--icx-navy);
}

/* Two-column sections (vision/mission, who/how): a gold hairline between. */
@media (min-width: 768px) {
  .icx-ic .icx-two {
    column-gap: 0;
  }
  .icx-ic .icx-two > div:first-child {
    padding-inline-end: 56px;
  }
  .icx-ic .icx-two > div + div {
    padding-inline-start: 56px;
    border-inline-start: 1px solid rgba(207, 163, 94, 0.35);
  }
}

/* Closing band: the hero's navy, centred like its title lockup. */
.icx-ic .icx-band {
  padding: 76px 0;
  background:
    radial-gradient(
      45% 120% at 50% 0%,
      rgba(207, 163, 94, 0.14),
      transparent 70%
    ),
    linear-gradient(180deg, #0d1c31 0%, #0a1626 100%);
  border-top: 1px solid rgba(207, 163, 94, 0.25);
}
.icx-ic .icx-band .icx-in {
  flex-direction: column;
  text-align: center;
  gap: 26px;
  max-width: 860px;
}
.icx-ic .icx-band h2 {
  color: #fff;
  margin-bottom: 16px;
}
.icx-ic .icx-band p {
  color: rgba(255, 255, 255, 0.8);
  font-size: 17px;
  line-height: 1.9;
}

/* Section tabs under the hero, and pinned. */
.icx-ic .icx-tabs {
  background: rgba(10, 22, 38, 0.62);
  border-top-color: rgba(207, 163, 94, 0.22);
}
.icx-ic .icx-tabs.is-pinned {
  background: rgba(11, 24, 41, 0.96);
}

/* Join form card. */
.icx-ic .icx-form {
  padding: 38px;
  border-radius: 16px;
}
.icx-ic .icx-form legend {
  color: var(--icx-navy);
}
@media (max-width: 767px) {
  .icx-ic .icx-sec {
    padding-block: 60px;
  }
  .icx-ic .icx-two > div + div {
    padding-top: 36px;
    border-top: 1px solid rgba(207, 163, 94, 0.35);
  }
  .icx-ic .icx-form {
    padding: 24px 18px;
  }
}
/* «.icx p» resets the quote's auto margins, which pushed it to the start. */
.icx.icx-ic p.icx-quote {
  max-width: 760px;
  margin: 0 auto !important;
  text-align: center !important;
}

/* Heroes without section tabs: the photo reaches the bottom. */
.icx-hero.is-ic:not(.has-tabs) .icx-ic-media {
  bottom: 0;
}

/* ==========================================================================
   Owner brief, October 2026: six benefits, five strands, three packages,
   the comparison table, five join steps, FAQ, Gold services in the hub.
   ========================================================================== */
.icx-benefits.is-six {
  grid-template-columns: repeat(3, minmax(0, 1fr));
}
.icx-benefit-sub {
  margin: 12px 0 4px;
  color: var(--icx-navy);
  font-weight: 700;
  font-size: 14px;
}
.icx-benefit .icx-benefit-list {
  margin: 8px 0 0;
  padding-inline-start: 20px;
  color: var(--icx-ink);
  font-size: 14px;
  line-height: 1.8;
  display: grid;
  gap: 3px;
}
.icx-benefit .icx-benefit-list.is-two {
  grid-template-columns: repeat(2, minmax(0, 1fr));
  column-gap: 14px;
}
.icx-benefit .icx-benefit-list li::marker {
  color: var(--icx-gold-d);
  font-weight: 700;
}
.icx-benefit-note {
  margin: 10px 0 0;
  color: var(--icx-navy);
  font-size: 13.5px;
  font-weight: 700;
}

/* Five strands as a row of cards. */
.icx-axes.is-five {
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: 14px;
  max-width: 1180px;
  margin: 0 auto 22px;
}
.icx-axes.is-five li {
  padding: 56px 18px 20px;
  display: flex;
  flex-direction: column;
  gap: 8px;
}
.icx-axes.is-five li::before {
  top: 16px;
  inset-inline-start: 18px;
}
.icx-axes.is-five strong {
  font-size: 17px;
}
.icx-axes.is-five span {
  color: var(--icx-muted);
  font-size: 14.5px;
  line-height: 1.8;
}
.icx .icx-axes + .icx-quote {
  max-width: 760px;
  margin: 0 auto;
  font-size: 18px;
}

/* Three packages: Gold on the right (first), lit in gold. */
.icx-packages.is-three {
  grid-template-columns: repeat(3, minmax(0, 1fr));
  max-width: 1180px;
  gap: 22px;
  align-items: start;
}
.icx-package .icx-kind {
  font-size: 12px;
  margin-top: -4px;
}
.icx-price.is-tba strong {
  font-size: 24px;
  line-height: 1.4;
  color: var(--icx-gold-d);
}
.icx-pk-promo {
  margin: 6px 0 0;
  font-size: 16px;
  color: var(--icx-navy);
}
.icx-pk-all {
  margin: 8px 0 0;
  padding-top: 12px;
  border-top: 1px solid var(--icx-line);
  color: var(--icx-navy);
  font-weight: 700;
  font-size: 14px;
}
.icx-pk-list {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  gap: 4px;
}
.icx-pk-list .icx-pk-group {
  margin-top: 8px;
  color: var(--icx-muted);
  font-size: 12.5px;
  font-weight: 700;
  letter-spacing: 0.02em;
}
.icx-pk-list .icx-pk-group.is-exclusive {
  color: var(--icx-gold-d);
}
.icx-pk-item summary {
  list-style: none;
  cursor: pointer;
  display: flex;
  align-items: flex-start;
  gap: 10px;
  padding: 6px 0;
  color: var(--icx-ink);
  font-size: 14.5px;
  font-weight: 600;
  line-height: 1.6;
}
.icx-pk-item summary::-webkit-details-marker {
  display: none;
}
.icx-pk-no {
  flex: 0 0 22px;
  width: 22px;
  height: 22px;
  border-radius: 50%;
  border: 1px solid var(--icx-line);
  background: #fffaf1;
  color: var(--icx-navy);
  font-family: Montserrat, sans-serif;
  font-size: 11.5px;
  font-weight: 700;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  margin-top: 2px;
}
.icx-pk-title {
  flex: 1 1 auto;
}
.icx-pk-item summary::after {
  content: "+";
  flex: 0 0 auto;
  color: var(--icx-gold-d);
  font-weight: 400;
  font-size: 18px;
  line-height: 1.2;
}
.icx-pk-item[open] summary::after {
  content: "–";
}
.icx-pk-item p {
  margin: 0 0 8px;
  padding-inline-start: 32px;
  color: var(--icx-muted);
  font-size: 13.5px;
  line-height: 1.8;
}
.icx-pk-list li.is-exclusive .icx-pk-no {
  background: var(--icx-gold);
  border-color: var(--icx-gold);
  color: var(--icx-deep);
}
.icx-pk-list li.is-exclusive summary {
  color: #7a5a24;
}
.icx-pk-close {
  margin: 12px 0 0;
  color: var(--icx-gold-d);
  font-weight: 700;
  font-size: 15px;
}
.icx-package .icx-btn {
  align-self: stretch;
  text-align: center;
  justify-content: center;
}
.icx-ic .icx-package.is-gold {
  border: 2px solid var(--icx-gold);
  background: linear-gradient(180deg, #fffaf0 0%, #fff 40%);
}
.icx-ic .icx-package .icx-save {
  margin: 10px 0 0;
}

/* Comparison table: scrolls sideways on phones, the Gold column lit. */
.icx-table-wrap {
  max-width: 1000px;
  margin: 0 auto;
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
  border-radius: 14px;
  border: 1px solid var(--icx-line);
  background: #fff;
}
.icx-compare {
  min-width: 640px;
  border-radius: 0;
}
.icx-compare th,
.icx-compare td {
  text-align: center;
  vertical-align: middle;
}
.icx-compare thead th:first-child,
.icx-compare tbody th {
  text-align: start;
}
.icx-compare tbody th {
  font-weight: 700;
  color: var(--icx-navy);
  background: #fff;
  width: 40%;
}
.icx-compare thead th.is-gold {
  background: var(--icx-gold);
  color: var(--icx-deep);
}
.icx-compare tbody td.is-gold {
  background: #fff7e6;
  font-weight: 700;
  color: var(--icx-navy);
}
.icx-compare .icx-yes {
  color: var(--icx-gold-d);
  font-weight: 800;
  font-size: 18px;
}
.icx-compare .icx-no {
  color: var(--icx-muted);
}

/* Five join steps with a title and a line each. */
.icx-join-steps.is-five {
  grid-template-columns: repeat(5, minmax(0, 1fr));
  max-width: 1180px;
  margin-inline: auto;
}
.icx-join-steps.is-five li {
  font-weight: 400;
  gap: 8px;
}
.icx-join-steps.is-five strong {
  color: var(--icx-navy);
  font-size: 15.5px;
}
.icx-join-steps.is-five p {
  margin: 0;
  color: var(--icx-muted);
  font-size: 14px;
  line-height: 1.8;
}

/* Roadmap: later phases are plans. */
.icx-roadmap li .icx-tag {
  align-self: flex-start;
}
.icx-ic .icx-roadmap li.is-later .icx-tag {
  background: #f3f1ec;
  color: var(--icx-muted);
  border: 1px solid var(--icx-line);
}

/* FAQ on the Inspiring Careers page. */
.icx-faq.is-ic {
  max-width: 900px;
  background: #fff;
  border: 1px solid var(--icx-line);
  border-radius: 14px;
  padding: 6px 28px;
  box-shadow: var(--ic-shadow);
}
.icx-faq.is-ic summary {
  font-size: 16.5px;
}

/* Application form: the free-text line under «Other». */
.icx-form .icx-other {
  display: block;
  margin: 10px 0 0;
}
.icx-form .icx-other span {
  display: block;
  font-size: 13.5px;
  color: var(--icx-muted);
  margin-bottom: 4px;
}

@media (max-width: 1199px) {
  .icx-benefits.is-six {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  .icx-axes.is-five,
  .icx-join-steps.is-five {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
}
@media (max-width: 991px) {
  .icx-packages.is-three {
    grid-template-columns: 1fr;
    max-width: 560px;
  }
}
@media (max-width: 767px) {
  .icx-benefits.is-six,
  .icx-axes.is-five,
  .icx-join-steps.is-five {
    grid-template-columns: 1fr;
  }
  .icx-benefit .icx-benefit-list.is-two {
    grid-template-columns: 1fr;
  }
  .icx-faq.is-ic {
    padding: 2px 16px;
  }
  .icx-compare th,
  .icx-compare td {
    padding: 10px 12px;
    font-size: 14px;
  }
}

/* ---------- Hub: overview, Gold services, resource facts, labs ---------- */
.ich-overview.ich-grid-3 {
  grid-template-columns: repeat(3, minmax(0, 1fr));
}
.ich-overview .ich-dl {
  margin-bottom: 10px;
}
.ich-card.is-gold {
  margin-top: 22px;
  background: linear-gradient(180deg, #fffaf0 0%, #fff 50%);
  border: 1px solid var(--icx-gold);
}
.ich-glist {
  list-style: none !important;
  padding: 0 !important;
  margin: 0 0 10px;
  display: grid;
  gap: 8px;
}
.ich-glist li {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 10px;
  font-size: 14.5px;
}
.ich-gstatus {
  display: inline-block;
  padding: 2px 10px;
  border-radius: 999px;
  font-size: 12px;
  font-weight: 700;
  white-space: nowrap;
  background: #f1efe9;
  color: var(--icx-muted);
}
.ich-gstatus.is-requested {
  background: #e5f0fa;
  color: #135e96;
}
.ich-gstatus.is-booked {
  background: #fff3d6;
  color: #8a6528;
}
.ich-gstatus.is-done {
  background: #e7f3ec;
  color: #2f7d55;
}
.ich-gold {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 18px;
}
.ich-gcard {
  background: #fff;
  border: 1px solid var(--icx-line);
  border-radius: 10px;
  padding: 20px 22px;
  display: flex;
  flex-direction: column;
  gap: 8px;
}
.ich-gcard.is-done {
  border-color: #bfdccb;
}
.ich-gcard header {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  gap: 10px;
}
.ich-gcard h4 {
  margin: 0;
  font-size: 16px;
  color: var(--icx-navy);
}
.ich-gcard > p {
  margin: 0;
  color: var(--icx-muted);
  font-size: 14.5px;
}
.ich-gnote,
.ich-greply {
  background: var(--icx-cream);
  border-radius: 8px;
  padding: 10px 14px;
  font-size: 14px;
}
.ich-greply {
  background: #fff7e6;
  border-inline-start: 3px solid var(--icx-gold);
}
.ich-gnote strong,
.ich-greply strong {
  display: block;
  color: var(--icx-navy);
  font-size: 13px;
  margin-bottom: 4px;
}
.ich-gnote p,
.ich-greply p {
  margin: 0 0 6px;
}
.ich-gfiles {
  list-style: none !important;
  padding: 0 !important;
  margin: 4px 0 0;
}
.ich-gfiles a {
  color: var(--icx-navy);
  font-weight: 700;
}
.ich-gcode {
  display: flex;
  align-items: center;
  gap: 10px;
  margin: 0;
}
.ich-gcode code {
  font-size: 16px;
  padding: 4px 12px;
  background: var(--icx-navy);
  color: var(--icx-gold);
  border-radius: 6px;
}
.ich-gform {
  display: grid;
  gap: 10px;
  margin-top: 6px;
}
.ich-gform label span {
  display: block;
  font-size: 13.5px;
  color: var(--icx-navy);
  font-weight: 700;
  margin-bottom: 4px;
}
.ich-gform textarea {
  width: 100%;
  border: 1px solid var(--icx-line);
  border-radius: 6px;
  padding: 10px 12px;
  font: inherit;
  font-size: 14px;
}
.ich-gform .icx-btn {
  justify-self: start;
}
.ich-flash {
  border-radius: 8px;
  padding: 12px 16px;
  margin-bottom: 18px;
  font-weight: 700;
}
.ich-flash.is-ok {
  background: #e7f3ec;
  color: #2f7d55;
}
.ich-flash.is-error {
  background: #fcf0f1;
  color: #a00;
}
.ich-facts {
  display: flex;
  flex-wrap: wrap;
  gap: 8px 22px;
  margin: 12px 0 0;
  font-size: 13.5px;
}
.ich-facts div {
  display: flex;
  gap: 6px;
}
.ich-facts dt {
  color: var(--icx-muted);
}
.ich-facts dd {
  margin: 0;
  color: var(--icx-navy);
  font-weight: 700;
}
.ich-lab-more {
  margin-top: 10px;
  font-size: 14px;
}
.ich-lab-more h5 {
  margin: 10px 0 4px;
  font-size: 13.5px;
  color: var(--icx-navy);
}
.ich-lab-more ul {
  margin: 0;
  padding-inline-start: 18px;
}
.ich-announce {
  background: #fff7e6;
  border: 1px solid #f0dcae;
  border-radius: 10px;
  padding: 16px 22px;
}
.ich-announce h3 {
  margin-top: 0;
}
.ich-more.is-small {
  font-size: 13px;
  margin-inline-start: 10px;
}
@media (max-width: 900px) {
  .ich-overview.ich-grid-3,
  .ich-gold {
    grid-template-columns: 1fr;
  }
}

/* Comparison table on phones: all four columns fit the screen (no sideways
   scroll), with a narrower benefit column and smaller type. */
.icx-table-hint {
  display: none;
}
@media (max-width: 767px) {
  .icx-table-wrap {
    overflow-x: hidden;
  }
  .icx-compare {
    min-width: 0;
    table-layout: fixed;
  }
  .icx-compare thead th:first-child,
  .icx-compare tbody th {
    width: 34%;
  }
  .icx-compare th,
  .icx-compare td {
    padding: 9px 5px;
    font-size: 12px;
    line-height: 1.5;
    word-break: normal;
    overflow-wrap: anywhere;
  }
  .icx-compare tbody th {
    font-size: 12.5px;
    padding-inline-start: 10px;
  }
  .icx-compare .icx-yes {
    font-size: 16px;
  }
}

/* Benefits: two wide cards (labs, toolbox, lists in two columns) over four
   compact ones, all rows equal in height. */
.icx-benefits.is-split {
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 18px;
}
.icx-benefits.is-split .icx-benefit.is-wide {
  grid-column: span 2;
}
.icx-benefits.is-split .icx-benefit.is-wide .icx-benefit-list.is-two {
  grid-template-columns: repeat(2, minmax(0, 1fr));
  column-gap: 22px;
}
.icx-benefits.is-split .icx-benefit:not(.is-wide) > p {
  font-size: 14px;
}
@media (max-width: 1199px) {
  .icx-benefits.is-split {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}
@media (max-width: 767px) {
  .icx-benefits.is-split {
    grid-template-columns: 1fr;
  }
  .icx-benefits.is-split .icx-benefit.is-wide {
    grid-column: auto;
  }
  .icx-benefits.is-split .icx-benefit.is-wide .icx-benefit-list.is-two {
    grid-template-columns: 1fr;
  }
}

/* Packages: three equal cards; the benefit lists sit under them. */
.icx-packages.is-three {
  align-items: stretch;
}
.icx-pk-sum {
  list-style: none;
  margin: 12px 0 0;
  padding: 12px 0 0;
  border-top: 1px solid var(--icx-line);
  display: grid;
  gap: 8px;
  color: var(--icx-ink);
  font-size: 14px;
}
.icx-pk-sum li {
  position: relative;
  padding-inline-start: 22px;
}
.icx-pk-sum li::before {
  content: "✓";
  position: absolute;
  inset-inline-start: 0;
  top: 0;
  color: var(--icx-gold-d);
  font-weight: 800;
}
.icx-pk-sum li.is-exclusive {
  color: #7a5a24;
  font-weight: 700;
}
.icx-package .icx-pk-close {
  margin-top: 10px;
}
.icx-package .icx-btn {
  margin-top: auto;
}
.icx-pk-benefits {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 22px;
  max-width: 1180px;
  margin: 0 auto 26px;
}
.icx-pk-col {
  background: #fff;
  border: 1px solid var(--icx-line);
  border-radius: 14px;
  padding: 24px 28px 20px;
  box-shadow: var(--ic-shadow);
}
.icx-pk-col.is-gold {
  border-color: var(--icx-gold);
  background: linear-gradient(180deg, #fffaf0 0%, #fff 45%);
}
.icx-pk-col h3 {
  margin: 0 0 10px;
  font-size: 17px;
  color: var(--icx-navy);
}
.icx-pk-col.is-gold h3 {
  color: #7a5a24;
}
.icx-pk-col .icx-pk-list {
  gap: 2px;
}
.icx-pk-col .icx-pk-item summary {
  padding: 9px 0;
  border-top: 1px solid var(--icx-line);
}
.icx-pk-col .icx-pk-list li:first-child .icx-pk-item summary {
  border-top: 0;
}
.icx-pk-col .icx-pk-item p {
  padding-bottom: 6px;
}
@media (max-width: 991px) {
  .icx-pk-benefits {
    grid-template-columns: 1fr;
    max-width: 560px;
  }
}

/* Lab recordings: the player at full width, then the playlist as thumbnail
   cards; a click plays the session in the player above. */
.ich .ich-video {
  max-width: none;
}
.ich-vlist {
  list-style: none !important;
  padding: 0 !important;
  margin: 18px 0 0 !important;
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 16px;
}
.ich-vlist a {
  display: flex;
  flex-direction: column;
  height: 100%;
  background: #fff;
  border: 1px solid var(--icx-line);
  border-radius: 12px;
  overflow: hidden;
  color: var(--icx-navy);
  transition:
    border-color 0.2s,
    box-shadow 0.2s,
    transform 0.2s;
}
.ich-vlist a:hover {
  border-color: var(--icx-gold);
  box-shadow: 0 12px 28px -18px rgba(22, 54, 92, 0.45);
  transform: translateY(-2px);
}
.ich-vlist a.is-on {
  border-color: var(--icx-gold);
  box-shadow: inset 0 3px 0 var(--icx-gold);
}
.ich-vthumb {
  position: relative;
  display: block;
  aspect-ratio: 16 / 9;
  background: #141823;
  overflow: hidden;
}
.ich-vthumb img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}
.ich-vplay {
  position: absolute;
  inset-inline-start: 50%;
  top: 50%;
  width: 46px;
  height: 46px;
  margin: -23px 0 0 -23px;
  border-radius: 50%;
  background: rgba(22, 54, 92, 0.82);
  border: 2px solid rgba(255, 255, 255, 0.85);
  transition: background 0.2s;
}
[dir="rtl"] .ich-vplay {
  margin: -23px -23px 0 0;
}
.ich-vplay::after {
  content: "";
  position: absolute;
  left: 50%;
  top: 50%;
  width: 0;
  height: 0;
  border-style: solid;
  border-width: 8px 0 8px 14px;
  border-color: transparent transparent transparent #fff;
  transform: translate(-40%, -50%);
}
.ich-vlist a:hover .ich-vplay,
.ich-vlist a.is-on .ich-vplay {
  background: var(--icx-gold);
  border-color: var(--icx-gold);
}
.ich-vbody {
  display: flex;
  flex-direction: column;
  gap: 4px;
  padding: 12px 14px 14px;
}
.ich-vno {
  color: var(--icx-gold-d);
  font-size: 12.5px;
  font-weight: 700;
  letter-spacing: 0.02em;
}
.ich-vtitle {
  font-weight: 700;
  font-size: 14.5px;
  line-height: 1.6;
}
.ich-vnow {
  display: none;
  margin-top: 4px;
  align-self: flex-start;
  font-size: 11.5px;
  font-weight: 700;
  color: var(--icx-deep);
  background: var(--icx-gold);
  border-radius: 999px;
  padding: 1px 9px;
}
.ich-vlist a.is-on .ich-vnow {
  display: inline-block;
}
@media (max-width: 991px) {
  .ich-vlist {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}
@media (max-width: 560px) {
  .ich-vlist {
    grid-template-columns: 1fr;
  }
}

/* Recordings, smaller: the player at 720px wide, the session cards four to a row. */
.ich .ich-video {
  max-width: 720px;
}
.ich-vlist {
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 12px;
  max-width: 980px;
}
.ich-vplay {
  width: 36px;
  height: 36px;
  margin: -18px 0 0 -18px;
}
[dir="rtl"] .ich-vplay {
  margin: -18px -18px 0 0;
}
.ich-vplay::after {
  border-width: 6px 0 6px 11px;
}
.ich-vbody {
  padding: 9px 11px 11px;
  gap: 2px;
}
.ich-vno {
  font-size: 11.5px;
}
.ich-vtitle {
  font-size: 13px;
  line-height: 1.5;
}
@media (max-width: 991px) {
  .ich-vlist {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
}
@media (max-width: 560px) {
  .ich-vlist {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

/* Gold card while the price is a proposal: a small label over the figure. */
.icx-price-label {
  margin: 4px 0 -4px;
  color: var(--icx-gold-d);
  font-size: 13px;
  font-weight: 700;
}

/* ==========================================================================
   Benefits section: the hero's deep navy, gold glows, glass cards.
   ========================================================================== */
.icx-ic .icx-sec.is-navy {
  position: relative;
  overflow: hidden;
  background:
    radial-gradient(55% 90% at 100% 0%, rgba(207, 163, 94, 0.22), transparent 70%),
    radial-gradient(50% 80% at 0% 100%, rgba(207, 163, 94, 0.14), transparent 70%),
    radial-gradient(70% 60% at 50% 50%, rgba(22, 54, 92, 0.6), transparent 100%),
    linear-gradient(160deg, #10233f 0%, #0b1829 55%, #0a1424 100%);
  border-block: 1px solid rgba(207, 163, 94, 0.3);
}
.icx-ic .icx-sec.is-navy::before {
  /* a faint gold grid, like the hero's wheel rim */
  content: "";
  position: absolute;
  inset: 0;
  background-image:
    linear-gradient(rgba(207, 163, 94, 0.07) 1px, transparent 1px),
    linear-gradient(90deg, rgba(207, 163, 94, 0.07) 1px, transparent 1px);
  background-size: 64px 64px;
  mask-image: radial-gradient(70% 70% at 50% 40%, #000 20%, transparent 100%);
  -webkit-mask-image: radial-gradient(70% 70% at 50% 40%, #000 20%, transparent 100%);
  pointer-events: none;
}
.icx-ic .icx-sec.is-navy > * {
  position: relative;
}
.icx-ic .icx-sec.is-navy .icx-eyebrow {
  color: #e2b46a;
}
.icx-ic .icx-sec.is-navy .icx-head h2 {
  color: #fff;
}
.icx-ic .icx-sec.is-navy .icx-head p {
  color: rgba(255, 255, 255, 0.78);
}
.icx-ic .icx-sec.is-navy .icx-benefit {
  background: rgba(255, 255, 255, 0.045);
  border: 1px solid rgba(207, 163, 94, 0.32);
  box-shadow: 0 24px 50px -30px rgba(0, 0, 0, 0.7);
  backdrop-filter: blur(6px);
  -webkit-backdrop-filter: blur(6px);
}
.icx-ic .icx-sec.is-navy .icx-benefit::after {
  opacity: 0.6;
}
.icx-ic .icx-sec.is-navy .icx-benefit:hover {
  background: rgba(255, 255, 255, 0.075);
  border-color: rgba(226, 180, 106, 0.8);
  box-shadow: 0 30px 60px -28px rgba(0, 0, 0, 0.8);
}
.icx-ic .icx-sec.is-navy .icx-benefit:hover::after {
  opacity: 1;
}
.icx-ic .icx-sec.is-navy .icx-benefit-no {
  color: #e2b46a;
  font-weight: 200;
}
.icx-ic .icx-sec.is-navy .icx-benefit h3 {
  color: #fff;
}
.icx-ic .icx-sec.is-navy .icx-benefit .icx-kind {
  color: #e2b46a;
}
.icx-ic .icx-sec.is-navy .icx-benefit > p {
  color: rgba(255, 255, 255, 0.78);
}
.icx-ic .icx-sec.is-navy .icx-benefit-sub,
.icx-ic .icx-sec.is-navy .icx-benefit-note {
  color: #e2b46a;
}
.icx-ic .icx-sec.is-navy .icx-benefit .icx-benefit-list {
  color: rgba(255, 255, 255, 0.9);
  list-style: none;
  padding-inline-start: 0;
}
.icx-ic .icx-sec.is-navy .icx-benefit .icx-benefit-list li {
  position: relative;
  padding-inline-start: 20px;
}
.icx-ic .icx-sec.is-navy .icx-benefit .icx-benefit-list li::before {
  content: "";
  position: absolute;
  inset-inline-start: 2px;
  top: 0.75em;
  width: 7px;
  height: 7px;
  transform: rotate(45deg);
  background: #e2b46a;
}
.icx-ic .icx-sec.is-navy .icx-benefit-more::before {
  background: rgba(207, 163, 94, 0.3);
}
.icx-ic .icx-sec.is-navy .icx-benefit .icx-btn.is-ghost {
  color: #e2b46a !important;
  border-color: rgba(226, 180, 106, 0.7);
  background: transparent;
}
.icx-ic .icx-sec.is-navy .icx-benefit .icx-btn.is-ghost:hover {
  background: #e2b46a;
  color: #172235 !important;
  border-color: #e2b46a;
}
.icx-ic .icx-sec.is-navy .icx-members-only {
  color: rgba(255, 255, 255, 0.6);
}

/* ==========================================================================
   Packages as rows: the package on the reading side, its benefits beside it.
   ========================================================================== */
.icx-pk-rows {
  display: grid;
  gap: 22px;
  max-width: 1180px;
  margin: 0 auto;
}
.icx-ic .icx-pk-row {
  display: grid;
  grid-template-columns: 300px minmax(0, 1fr);
  gap: 36px;
  background: #fff;
  border: 1px solid var(--icx-line);
  border-radius: 14px;
  border-end-end-radius: 36px;
  padding: 30px 32px;
  box-shadow: var(--ic-shadow);
  position: relative;
}
.icx-ic .icx-pk-row.is-featured {
  border: 2px solid var(--icx-gold);
  background: linear-gradient(135deg, #fffaf0 0%, #fff 55%);
  box-shadow: var(--ic-shadow-up);
}
.icx-pk-head {
  display: flex;
  flex-direction: column;
  gap: 8px;
  padding-inline-end: 36px;
  border-inline-end: 1px solid rgba(207, 163, 94, 0.35);
}
.icx-pk-head .icx-tag {
  align-self: flex-start;
  margin-bottom: 4px;
}
.icx-pk-head h3 {
  margin: 0;
  font-size: 21px;
}
.icx-pk-head .icx-kind {
  font-size: 12px;
  margin-top: -6px;
}
.icx-pk-head .icx-price {
  margin-top: 6px;
}
.icx-pk-head .icx-price strong {
  font-size: 46px;
}
.icx-pk-head > p {
  color: var(--icx-muted);
  font-size: 14.5px;
  margin: 0;
}
.icx-pk-head .icx-pk-promo {
  margin: 8px 0 0;
  font-size: 16px;
  color: var(--icx-navy);
}
.icx-pk-head .icx-save {
  color: #8a6528;
  font-weight: 700;
  margin: 6px 0 0;
}
.icx-pk-head .icx-pk-close {
  margin: 6px 0 0;
}
.icx-pk-head .icx-btn {
  margin-top: auto;
  align-self: stretch;
  text-align: center;
  justify-content: center;
}
.icx-pk-side .icx-pk-all {
  margin: 4px 0 10px;
  padding: 0;
  border: 0;
  font-size: 15px;
}
.icx-pk-items {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  column-gap: 28px;
  row-gap: 2px;
  align-content: start;
}
.icx-pk-items .icx-pk-group {
  grid-column: 1 / -1;
  margin: 10px 0 2px;
  color: var(--icx-muted);
  font-size: 12.5px;
  font-weight: 700;
  letter-spacing: 0.02em;
}
.icx-pk-items .icx-pk-group.is-exclusive {
  color: var(--icx-gold-d);
}
.icx-pk-items .icx-pk-item summary {
  border-top: 1px solid var(--icx-line);
  padding: 9px 0;
}
.icx-pk-items li.is-exclusive .icx-pk-no {
  background: var(--icx-gold);
  border-color: var(--icx-gold);
  color: var(--icx-deep);
}
.icx-pk-items li.is-exclusive summary {
  color: #7a5a24;
}
.icx-pk-items .icx-pk-item p {
  padding-bottom: 8px;
}
@media (max-width: 991px) {
  .icx-ic .icx-pk-row {
    grid-template-columns: 1fr;
    gap: 20px;
  }
  .icx-pk-head {
    padding-inline-end: 0;
    border-inline-end: 0;
    padding-bottom: 18px;
    border-bottom: 1px solid rgba(207, 163, 94, 0.35);
  }
  .icx-pk-head .icx-btn {
    align-self: flex-start;
    min-width: 240px;
  }
}
@media (max-width: 600px) {
  .icx-pk-items {
    grid-template-columns: 1fr;
  }
  .icx-ic .icx-pk-row {
    padding: 22px 18px;
  }
}

/* Package rows: the package column keeps its own height, so opening a
   benefit beside it never moves its text or button. The divider sits on the
   benefits column, which is the tall one. */
.icx-pk-head {
  align-self: start;
  border-inline-end: 0;
  padding-inline-end: 0;
}
.icx-pk-head .icx-btn {
  margin-top: 14px;
}
.icx-pk-side {
  padding-inline-start: 36px;
  border-inline-start: 1px solid rgba(207, 163, 94, 0.35);
}
@media (max-width: 991px) {
  .icx-pk-side {
    padding-inline-start: 0;
    border-inline-start: 0;
  }
}

/* Toolbox 1.7: client-segment folders and segment pages (final structure). */
.ich-folders-t {
  margin: 0 0 12px;
  color: var(--icx-muted);
  font-size: 14px;
}
.ich-folder .ich-svc {
  color: var(--icx-gold-d);
  font-size: 13px;
  font-weight: 700;
  line-height: 1.4;
}
.ich-folder.is-ref {
  background: var(--icx-navy);
  border-color: var(--icx-navy);
  color: #fff;
}
.ich-folder.is-ref strong,
.ich-folder.is-ref small {
  color: #fff;
}
.ich-folder.is-ref .ich-svc {
  color: var(--icx-gold);
}
.ich-folder.is-ref .ich-folder-ic {
  fill: rgba(255, 255, 255, 0.12);
  stroke: var(--icx-gold);
}
a.ich-folder.is-ref:hover,
a.ich-folder.is-ref:focus-visible {
  border-color: var(--icx-gold);
}
.ich-folder-head .ich-seg-service {
  margin: 4px 0 0;
  color: var(--icx-gold-d);
  font-weight: 700;
  font-size: 15px;
}
.ich-seg-goal {
  margin: -6px 0 18px;
  padding: 14px 18px;
  background: var(--icx-cream);
  border-inline-start: 3px solid var(--icx-gold);
  border-radius: 4px;
  font-size: 15px;
  line-height: 1.8;
}
.ich-seg-goal strong {
  color: var(--icx-navy);
}
.ich-part h3 .ich-step {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 28px;
  height: 28px;
  border-radius: 50%;
  background: var(--icx-navy);
  color: var(--icx-gold);
  font-size: 14px;
  font-weight: 800;
  flex: none;
}
.ich-tool.is-case .ich-kind {
  color: var(--icx-gold-d);
}
.ich-soon-tag {
  color: var(--icx-muted);
  font-size: 12px;
}

/* Hub 1.7: dashboard shell, sections in a sidebar (a strip on phones). */
.ich-shell {
  display: flex;
  flex-wrap: wrap;
  align-items: stretch;
  background: var(--icx-paper);
  border: 1px solid var(--icx-line);
  border-radius: 18px;
  overflow: hidden;
}
.ich-rail {
  flex: 0 0 232px;
  display: flex;
  flex-direction: column;
  gap: 6px;
  padding: 22px 16px;
  background: var(--icx-cream);
  border-inline-end: 1px solid var(--icx-line);
}
.ich-rail-brand {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 4px 8px 18px;
  color: var(--icx-navy);
  line-height: 1.3;
}
.ich-rail-brand .ich-rail-ic {
  width: 30px;
  height: 30px;
  color: var(--icx-gold);
}
.ich-rail-brand b {
  display: block;
  font-size: 15.5px;
  font-weight: 800;
}
.ich-rail-brand small {
  display: block;
  font-size: 11.5px;
  color: var(--icx-gold-d);
  font-weight: 600;
}
.ich-rail-links {
  display: flex;
  flex-direction: column;
  gap: 4px;
}
.ich-rail-links a {
  display: flex;
  align-items: center;
  gap: 12px;
  min-height: 44px;
  padding: 0 12px;
  border-radius: 12px;
  color: var(--icx-ink);
  font-size: 14.5px;
  font-weight: 600;
  line-height: 1.4;
  transition:
    background 0.2s,
    color 0.2s;
}
.ich-rail-ic {
  width: 20px;
  height: 20px;
  flex: none;
}
.ich-rail-links a:hover {
  background: #fff;
  color: var(--icx-navy);
}
.ich-rail-links a.is-active {
  background: var(--icx-navy);
  color: #fff;
}
.ich-rail-links a.is-active .ich-rail-ic {
  color: var(--icx-gold);
}
.ich-main {
  flex: 999 1 560px;
  min-width: 0;
  padding: 26px 28px 40px;
  background: #fff;
}
.ich-main .ich-head {
  margin-bottom: 22px;
}
.ich-main .ich-head h2 {
  font-size: 28px;
}
@media (max-width: 900px) {
  .ich-rail {
    flex: 1 1 100%;
    padding: 12px 12px 10px;
    border-inline-end: 0;
    border-bottom: 1px solid var(--icx-line);
  }
  .ich-rail-brand {
    padding: 2px 6px 10px;
  }
  .ich-rail-links {
    flex-direction: row;
    flex-wrap: nowrap;
    overflow-x: auto;
    gap: 6px;
    padding-bottom: 4px;
    scrollbar-width: thin;
  }
  .ich-rail-links a {
    flex: none;
    min-height: 40px;
    padding: 0 12px;
    font-size: 13.5px;
    gap: 8px;
    background: #fff;
    border: 1px solid var(--icx-line);
  }
  .ich-rail-links a.is-active {
    border-color: var(--icx-navy);
  }
  .ich-main {
    padding: 20px 16px 32px;
  }
}
.ich-main .ich-overview {
  grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
}
.ich-main .ich-grid-3 {
  grid-template-columns: repeat(auto-fill, minmax(250px, 1fr));
}

/* My account pages: the theme's empty photo title bar shrinks to a strip
   the height of the floating menu, so the dashboard starts right under it. */
body.woocommerce-account .page-header.pagetitle-v2,
body.woocommerce-account .page-header.pagetitle-v2 .hero,
body.woocommerce-account .page-header.pagetitle-v2 .mo-title-bar-wrap {
  height: 112px !important;
  min-height: 0 !important;
  max-height: 112px !important;
  overflow: hidden !important;
}
@media (max-width: 991px) {
  body.woocommerce-account .page-header.pagetitle-v2,
  body.woocommerce-account .page-header.pagetitle-v2 .hero,
  body.woocommerce-account .page-header.pagetitle-v2 .mo-title-bar-wrap {
    height: 84px !important;
    max-height: 84px !important;
  }
}
.ich-main .ich-overview {
  grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
}
.ich-overview .ich-lab {
  grid-template-columns: 64px 1fr;
  align-items: start;
}
.ich-overview .ich-lab-date {
  min-height: 64px;
  padding: 10px 4px;
}

/* ---------- Switch between the public page and the practitioner hub ----------
   At the far end of the section bar (HubPage::switch_button() / band()):
   «لوحة الممارس» for members on the public page, «تسجيل الدخول كممارس» for
   visitors, «الصفحة العامة» inside the hub. A gold pill, not a tab. */
.icx .icx-tabs a.ihub-switch {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  align-self: center;
  margin-inline-start: auto;
  padding: 7px 16px;
  border: 1px solid rgba(226, 180, 106, 0.65);
  border-radius: 999px;
  color: #ecd3a2 !important;
  font-size: 13.5px;
  font-weight: 700;
  line-height: 1.4;
  transition:
    background 0.2s,
    color 0.2s,
    border-color 0.2s;
}
.icx .icx-tabs a.ihub-switch svg {
  width: 16px;
  height: 16px;
  flex: none;
}
.icx .icx-tabs a.ihub-switch:hover,
.icx .icx-tabs a.ihub-switch:focus-visible {
  background: linear-gradient(180deg, #e2b46a, #c6964f);
  border-color: transparent;
  color: #10233f !important;
}
/* Phones: the switch is the bar's last item and scrolls with it. */
@media (max-width: 767px) {
  .icx .icx-tabs a.ihub-switch {
    flex: none;
  }
}
/* Visitors: «تسجيل الدخول كممارس» is a filled gold button, the clear way in. */
.icx .icx-tabs a.ihub-switch.is-login {
  padding: 8px 18px;
  background: linear-gradient(180deg, #e2b46a, #c6964f);
  border-color: transparent;
  color: #10233f !important;
  font-size: 14px;
  box-shadow: 0 10px 22px -14px rgba(226, 180, 106, 0.9);
}
.icx .icx-tabs a.ihub-switch.is-login svg {
  width: 18px;
  height: 18px;
}
.icx .icx-tabs a.ihub-switch.is-login:hover,
.icx .icx-tabs a.ihub-switch.is-login:focus-visible {
  background: linear-gradient(180deg, #f0c77f, #d4a35a);
  box-shadow: 0 12px 26px -12px rgba(226, 180, 106, 1);
}
/* ==========================================================================
   Audit of 2026-10-19 (Nadine): page-wide fixes on the Inspiring Careers page.
   ========================================================================== */

/* G2: once the header sticks it is solid navy, so the content never shows
   through the menu, «حسابي» and «خروج». */
body.ic-inspiring-page.mo-stick-active .mo-header-v6.mo-header-stick .mo-header-menu,
body.ic-inspiring-page.mo-stick-active .mo-header-stick .mo-header-menu {
  background: #173e65 !important;
}

/* G7: the section bar fades on the edge that has more links (site.js sets the widths). */
.icx-tabs-in {
  --fade-l: 0px;
  --fade-r: 0px;
  -webkit-mask-image: linear-gradient(to right, transparent 0, #000 var(--fade-l), #000 calc(100% - var(--fade-r)), transparent 100%);
  mask-image: linear-gradient(to right, transparent 0, #000 var(--fade-l), #000 calc(100% - var(--fade-r)), transparent 100%);
}

/* G8: Google's reCAPTCHA badge sat on the «Back to top» button; the notice
   it requires is under the join form instead. */
body.ic-inspiring-page .grecaptcha-badge {
  visibility: hidden !important;
}
.icx-recaptcha-note {
  margin: 14px 0 0;
  font-size: 12.5px;
  line-height: 1.8;
  color: #7a8394;
}
.icx-recaptcha-note a {
  color: inherit !important;
  text-decoration: underline !important;
}

/* P5: a member on the public page sees the way back instead of the form. */
.icx-form-done-act {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  margin: 16px 0 0;
}
.icx-form-done-act .icx-btn {
  margin: 0;
}
.icx-form-done.is-member {
  background: #fbf7ef;
  border: 1px solid rgba(207, 163, 94, 0.55);
  border-radius: 18px;
  box-shadow: 0 24px 50px -38px rgba(16, 35, 63, 0.55);
}
.icx-form-done.is-member h3 {
  color: #10233f;
}
.icx-form-done.is-member .icx-form-done-act {
  justify-content: center;
}

/* ---------- Ecosystem: three layers, framework → umbrella → community ----------
   Numbered like the page's index rows (Montserrat light numerals), the first
   layer a navy panel in the hero's gradient, the current one lit in gold; a
   gold diamond joins each layer to the next. */
.icx-eco {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 22px;
  max-width: 1180px;
  margin: 0 auto;
}
.icx-eco-step {
  position: relative;
  display: flex;
  flex-direction: column;
  gap: 6px;
  padding: 30px 30px 30px;
  background: #fff;
  border: 1px solid var(--icx-line);
  border-radius: 16px;
  border-end-end-radius: 36px;
  box-shadow: var(--ic-shadow, 0 24px 50px -38px rgba(16, 35, 63, 0.4));
}
.icx-eco-step:not(:last-child)::after {
  content: "";
  position: absolute;
  top: 50%;
  inset-inline-end: -15px;
  width: 8px;
  height: 8px;
  background: #e2b46a;
  transform: translateY(-50%) rotate(45deg);
  box-shadow: 0 0 0 4px var(--icx-cream, #fbf8f2);
}
.icx-eco-n {
  font-family: Montserrat, sans-serif;
  font-style: normal;
  font-weight: 200;
  font-size: 40px;
  line-height: 1;
  color: var(--icx-gold);
}
.icx-eco-k {
  margin-top: 8px;
  color: var(--icx-gold-d);
  font-size: 12.5px;
  font-weight: 700;
  letter-spacing: 0.02em;
}
.icx-eco-step strong {
  color: var(--icx-navy);
  font-size: 20px;
  font-weight: 800;
  line-height: 1.5;
}
.icx-eco-step p {
  margin: 4px 0 0 !important;
  color: var(--icx-muted);
  font-size: 15.5px;
  line-height: 1.8;
}
.icx-eco-step .icx-tag {
  margin-top: 14px;
}
.icx-eco-step.is-base {
  background:
    radial-gradient(60% 140% at 100% 0%, rgba(207, 163, 94, 0.14), transparent 70%),
    linear-gradient(135deg, #10233f 0%, #0b1829 100%);
  border-color: rgba(207, 163, 94, 0.35);
}
.icx-eco-step.is-base::before {
  content: "";
  position: absolute;
  inset: 0;
  border-radius: inherit;
  background-image:
    linear-gradient(rgba(207, 163, 94, 0.07) 1px, transparent 1px),
    linear-gradient(90deg, rgba(207, 163, 94, 0.07) 1px, transparent 1px);
  background-size: 22px 22px;
  pointer-events: none;
}
.icx-eco-step.is-base > * {
  position: relative;
}
.icx-eco-step.is-base strong {
  color: #e2b46a;
}
.icx-eco-step.is-base .icx-eco-k {
  color: var(--icx-gold);
}
.icx-eco-step.is-base p {
  color: rgba(255, 255, 255, 0.82);
}
.icx-eco-step.is-now {
  border-color: rgba(207, 163, 94, 0.6);
  box-shadow:
    inset 0 -3px 0 var(--icx-gold),
    var(--ic-shadow, 0 24px 50px -38px rgba(16, 35, 63, 0.4));
}
@media (max-width: 991px) {
  .icx-eco {
    grid-template-columns: 1fr;
    gap: 24px;
    max-width: 640px;
  }
  .icx-eco-step:not(:last-child)::after {
    top: auto;
    bottom: -16px;
    inset-inline-end: 50%;
    transform: translateX(50%) rotate(45deg);
  }
  .icx-eco-step {
    padding: 24px 22px;
  }
}