/* =====================================================================
   Bizacharya — Opportunities & Services inner pages
   Loaded only by opportunities/*.html and services/*.html, after style.css.

   One composition system, thirteen page personalities:
   - one content width (the site .container), one section rhythm (--sec-y), one type scale
   - every intro uses the same 7/5 editorial split, every closing CTA is a full-width band
   - the Bizacharya mark (data-watermark, from main.js) is the shared decorative motif
   - each page differs in hero composition, background colour and how its list is set
   Order: system → shared parts → opportunities → services → related → phones → motion
   ===================================================================== */

.ix {
  --pg-bg: var(--surface);
  --pg-deep: var(--black);
  --pg-accent: var(--brand-2);
  --pg-accent-ink: var(--brand-2-ink);
  --pg-line: var(--line);
  --ix-radius: 6px;
  --sec-y: clamp(4rem, 7vw, 6.5rem); /* = committed .section padding */
  /* distance from the container's content edge to the viewport edge — lets visuals bleed */
  --bleed: calc((100vw - min(100vw, 1280px)) / 2 + clamp(20px, 5vw, 80px));
  background: #fff;
}
@media (min-width: 1600px) { .ix { --bleed: calc((100vw - 1440px) / 2 + 80px); } }
.ix img:where(:not(.section-watermark__img)) { width: 100%; height: 100%; object-fit: cover; }

/* style.css animates `li[data-reveal].is-visible::before` for the listing-page timeline node;
   neutralise that leak so list counters/markers on these pages keep their own transforms. */
.ix li[data-reveal].is-visible::before { transform: none; }

/* ---------- System: sections, heads, type ---------- */
.ix-sec { position: relative; padding: var(--sec-y) 0; isolation: isolate; }
.ix-sec--tight { padding: clamp(2.5rem, 4.5vw, 4rem) 0; } /* = committed .section--tight */
/* Adjacent sections on the same background: don't stack two paddings into one empty band */
.mk-story + .ix-sec--tint, .ix-sec--tint + .ix-sec--tint { padding-top: 0; }
.ix-sec--tint { background: var(--pg-bg); }
.ix-head { max-width: 680px; margin: 0 auto clamp(2.25rem, 4vw, 3.5rem); text-align: center; }
.ix-head h2 { margin: 0 0 .5rem; }
.ix-head .ix-kicker { justify-content: center; }
.ix h1 { margin-bottom: 1.5rem; }

/* Eyebrow — identical to the Home section-head eyebrow (muted, lead size, no rule) */
.ix-kicker { display: flex; margin: 0 0 .75rem; color: var(--muted); }
.ix-kicker--light { color: rgba(255, 255, 255, .72); }

.ix-crumb { display: flex; flex-wrap: wrap; align-items: center; gap: .35rem .5rem; margin: 0 0 2rem; color: var(--muted); }
.ix-crumb a { color: var(--muted); }
.ix-crumb a:hover { color: var(--black); }
.ix-crumb li + li::before { content: "/"; margin-right: .5rem; opacity: .45; }
.ix-crumb [aria-current] { color: var(--ink); }
.ix-crumb--light, .ix-crumb--light a { color: rgba(255, 255, 255, .7); }
.ix-crumb--light a:hover { color: #fff; }
.ix-crumb--light [aria-current] { color: #4FC3B5; }

.ix-hero__lede { color: var(--text); max-width: 46ch; margin: 0; }
.ix-actions { display: flex; flex-wrap: wrap; gap: .75rem; }
.btn--ghost-dark { background: transparent; color: #fff; border-color: rgba(255, 255, 255, .38); }
.btn--ghost-dark:hover { color: #fff; border-color: #fff; }
.btn--navy { background: var(--black); color: #fff; border-color: var(--black); }
.btn--navy:hover { color: #fff; }

.ix-frame { position: relative; margin: 0; overflow: hidden; border-radius: var(--ix-radius); background: var(--pg-bg); }
.ix-frame img { transition: transform 1.4s var(--ease); }
.ix-frame:hover img { transform: scale(1.035); }

.ix-ico { display: inline-flex; align-items: center; justify-content: center; flex: none; color: var(--pg-accent); }
.ix-ico .icon { width: 26px; height: 26px; stroke-width: 1.4; }
li > .ix-ico { justify-self: start; }
.ix-ico--solid { width: 52px; height: 52px; border-radius: 50%; background: var(--black); color: #4FC3B5; }
.ix-ico--solid .icon { width: 22px; height: 22px; }

/* Split hero: ~45% copy / ~55% visual, vertically centred, generous height */
.ix-split { display: grid; gap: 3rem; align-items: center; }
@media (min-width: 992px) {
  .ix-split { grid-template-columns: minmax(0, 5fr) minmax(0, 6fr); gap: clamp(3rem, 6vw, 6rem); min-height: clamp(520px, 64vh, 680px); }
}

/* The one intro pattern every page shares: lead (7) + supporting copy (5) */
.ix-intro, .fin-intro__grid, .agri-intro, .rural-story, .women-quote, .su-idea, .sme-intro,
.tr-intro, .cp-intro, .fd-intro, .br-statement-wrap, .mk-intro, .mt-intro {
  display: grid; gap: 2rem clamp(3rem, 7vw, 7rem); align-items: start;
}
@media (min-width: 992px) {
  .ix-intro, .agri-intro, .rural-story, .women-quote, .sme-intro, .tr-intro, .cp-intro, .fd-intro, .br-statement-wrap, .mt-intro {
    grid-template-columns: minmax(0, 7fr) minmax(0, 5fr); column-gap: clamp(3.5rem, 8vw, 8rem); align-items: start;
  }
  .su-idea { grid-template-columns: minmax(0, 7fr) minmax(0, 5fr); }
}
/* Intro paragraph: its first sentence is the statement; the rest of the same paragraph reads at body-lead size */
.ix .lead { margin: 0; color: var(--black); }
.ix .ix-lead { color: var(--text); max-width: 60ch; }
@media (max-width: 991.98px) {
  .agri-intro__side, .women-quote__body, .su-idea__side, .sme-intro__side, .tr-intro__side, .cp-intro__note, .br-statement-side, .mt-intro__side { margin-top: 0; }
}
.ix .ix-lead__first { display: block; margin-bottom: 1.25rem; color: var(--black); }
/* supporting column: a short accent rule, then copy — aligned to the top of the lead */
.agri-intro__side, .rural-story__note, .women-quote__body, .su-idea__side, .sme-intro__side,
.tr-intro__side, .cp-intro__note, .br-statement-side, .mt-intro__side {
  position: relative; padding-top: 1.75rem; margin-top: 2.85rem; align-self: start; color: var(--text);
}
.agri-intro__side::before, .rural-story__note::before, .women-quote__body::before, .su-idea__side::before, .sme-intro__side::before,
.tr-intro__side::before, .cp-intro__note::before, .br-statement-side::before, .mt-intro__side::before {
  content: ""; position: absolute; left: 0; top: 0; width: 48px; height: 2px; background: var(--pg-accent);
}
.agri-intro__side p, .rural-story__note p, .women-quote__body p, .su-idea__side p, .sme-intro__side p,
.tr-intro__side p, .cp-intro__note p, .br-statement-side p, .mt-intro__side p { margin: 0 0 1rem; }
.agri-intro__side p:last-child, .rural-story__note p:last-child, .women-quote__body p:last-child, .su-idea__side p:last-child,
.sme-intro__side p:last-child, .tr-intro__side p:last-child, .cp-intro__note p:last-child, .br-statement-side p:last-child, .mt-intro__side p:last-child { margin: 0; }

/* Pull quote — every page's "Our Impact" statement */
.ix-quote { max-width: 900px; }
.ix-quote__label { margin: 0 0 1.25rem; color: var(--pg-accent-ink); }
.ix-quote blockquote p { margin: 0; color: var(--black); }

/* Full-width closing band */
.ix-band { position: relative; overflow: hidden; isolation: isolate; padding: var(--sec-y) 0; }
.ix-band h2 { margin: 0 0 .5rem; }
.ix-band p { margin: 0; }
.ix-cta-copy { display: flex; gap: 1.5rem; align-items: flex-start; }
.ix-band .container > [data-reveal] { display: grid; gap: 2rem 4rem; align-items: center; }
@media (min-width: 992px) { .ix-band .container > [data-reveal] { grid-template-columns: 1fr auto; } }

/* ---------- Original "Talk to an advisor" block, presented openly ---------- */
.ix-advisor { display: grid; gap: 1rem 2rem; align-items: center; }
.ix-advisor__icon { display: none; }
.ix-advisor__title { margin: 0 0 .3rem; }
.ix-advisor__body p { margin: 0; color: var(--muted); }
.ix-advisor__actions { display: flex; flex-wrap: wrap; align-items: center; gap: .5rem 1.5rem; }
.ix-advisor__link { display: inline-flex; align-items: center; gap: .4rem; color: var(--primary); }
.ix-advisor__link .icon { width: 1em; height: 1em; transition: transform .25s var(--ease); }
.ix-advisor__link:hover .icon { transform: translateX(3px); }
.ix-advisor .btn--light { background: var(--black); border-color: var(--black); color: #fff; }
.ix-advisor .btn--light:hover { color: #fff; }
.ix-advisor--row { margin-top: clamp(2.25rem, 4vw, 3rem); padding-top: 1.75rem; border-top: 1px solid rgba(10, 37, 64, .14); max-width: 520px; }
.ix-advisor--glass { padding-left: 1.75rem; border-left: 2px solid #4FC3B5; max-width: 420px; }
.ix-advisor--glass .ix-advisor__title { color: #fff; }
.ix-advisor--glass .ix-advisor__body p { color: var(--on-dark); }
.ix-advisor--glass .btn--light, .ix-advisor--bubble .btn--light { background: #fff; color: var(--black); border-color: #fff; }
.ix-advisor--glass .ix-advisor__link { color: #4FC3B5; }
.ix-advisor--bubble { background: var(--brand-2-ink); color: #fff; padding: 1.6rem 1.75rem; border-radius: 22px 22px 22px 4px; }
.ix-advisor--bubble .ix-advisor__title { color: #fff; }
.ix-advisor--bubble .ix-advisor__body p { color: rgba(255, 255, 255, .88); }
.ix-advisor--bubble .ix-advisor__link { color: #fff; }

/* ---------- "All Services" — closing section above the footer: centred head + a wrap of service pills ---------- */
.ix-allsvc { position: relative; overflow: hidden; isolation: isolate; padding: clamp(3.5rem, 6vw, 5rem) 0; background: var(--surface); }
.ix-allsvc::before { content: ""; position: absolute; z-index: -1; left: 50%; top: 0; width: 120px; height: 3px; transform: translateX(-50%); background: linear-gradient(90deg, var(--primary), var(--brand-2)); }
.ix-allsvc::after { content: ""; position: absolute; z-index: -1; inset: 0; background: radial-gradient(circle, rgba(7, 87, 154, .09) 1.5px, transparent 1.6px) 0 0 / 22px 22px;
  -webkit-mask: radial-gradient(ellipse at 50% 100%, #000 10%, transparent 65%); mask: radial-gradient(ellipse at 50% 100%, #000 10%, transparent 65%); }
.ix-allsvc__nav { display: grid; justify-items: center; gap: clamp(1.75rem, 3vw, 2.5rem); text-align: center; }
.ix-allsvc__title { margin: 0; color: var(--black); }
.ix-allsvc ul { display: flex; flex-wrap: wrap; justify-content: center; gap: .75rem; max-width: 1040px; margin: 0; padding: 0; list-style: none; }
.ix-allsvc a { display: inline-flex; align-items: center; gap: .55rem; padding: .8rem 1.3rem; border: 1px solid var(--line); border-radius: 999px; background: #fff; color: var(--black); white-space: nowrap;
  transition: border-color .25s, color .25s, background .25s, box-shadow .25s; }
.ix-allsvc a .icon { width: 1em; height: 1em; color: var(--brand-2); transition: transform .25s var(--ease); }
.ix-allsvc a:hover { border-color: var(--primary); color: var(--primary); box-shadow: 0 10px 22px -14px rgba(7, 87, 154, .5); }
.ix-allsvc a:hover .icon { transform: translateX(3px); }
.ix-allsvc a[aria-current] { background: var(--black); border-color: var(--black); color: #fff; pointer-events: none; }
.ix-allsvc a[aria-current] .icon { display: none; }
.ix-allsvc a[aria-current]::before { content: ""; width: 8px; height: 8px; border-radius: 50%; background: #4FC3B5; }
@media (max-width: 575.98px) { .ix-allsvc a { white-space: normal; text-align: left; } }

/* ===================================================================
   OPPORTUNITIES
   =================================================================== */

/* ---------- 1. Financial Services — split hero, photo bleeds to the right edge ---------- */
.ix--fin { --pg-bg: var(--surface); --pg-accent: #07579A; --pg-accent-ink: #07579A; }
.fin-hero { background: var(--surface); padding: clamp(2.5rem, 5vw, 4rem) 0; overflow: hidden; }
.fin-hero__grid { display: grid; gap: 3rem; align-items: center; }
.fin-hero h1 em { font-style: normal; color: var(--primary); }
.fin-hero__visual { position: relative; }
.fin-hero__photo { aspect-ratio: 4 / 3; }
.fin-badge { position: absolute; left: 0; bottom: 0; display: inline-flex; align-items: center; gap: .65rem; padding: 1.1rem 1.5rem; background: var(--primary); color: #fff; }
.fin-badge .icon { width: 22px; height: 22px; }
@media (min-width: 992px) {
  .fin-hero__grid { grid-template-columns: minmax(0, 6fr) minmax(0, 5fr); gap: clamp(3rem, 6vw, 6rem); }
  .fin-hero__visual { margin-right: calc(-1 * var(--bleed)); align-self: stretch; }
  .fin-hero__photo { aspect-ratio: auto; height: 100%; min-height: 560px; border-radius: var(--ix-radius) 0 0 var(--ix-radius); }
}

.fin-intro__aside { padding-top: 1.25rem; border-top: 2px solid var(--black); }
.fin-intro__aside h2 { margin: 0; }
.fin-intro__big { margin: 0 0 2.5rem; color: var(--black); }
.fin-intro__cols { display: grid; gap: 1.25rem 3rem; }
.fin-intro__cols p { margin: 0; }
@media (min-width: 768px) { .fin-intro__cols { grid-template-columns: 1fr 1fr; } }
@media (min-width: 992px) { .fin-intro__grid { grid-template-columns: minmax(0, 4fr) minmax(0, 8fr); } .fin-intro__aside { position: sticky; top: calc(var(--header-h) + 2rem); align-self: start; } }

.fin-ledger ol { display: grid; column-gap: 4rem; counter-reset: led; border-top: 2px solid var(--black); }
.fin-ledger li { counter-increment: led; display: grid; grid-template-columns: 3rem 1fr auto; align-items: center; gap: 1rem; padding: 1.45rem 0; border-bottom: 1px solid var(--line); color: var(--black); transition: padding .35s var(--ease), color .25s; }
.fin-ledger li::before { content: counter(led, decimal-leading-zero); color: var(--primary); font-variant-numeric: tabular-nums; }
.fin-ledger li .icon { width: 20px; height: 20px; color: var(--brand-2); }
.fin-ledger li:hover { padding-left: .5rem; color: var(--primary); }
@media (min-width: 992px) { .fin-ledger ol { grid-template-columns: 1fr 1fr; } }

.fin-people { display: grid; grid-template-columns: repeat(auto-fit, minmax(170px, 1fr)); }
.fin-people li { display: flex; flex-direction: column; gap: 1.25rem; padding: .5rem 1.75rem 0; border-left: 1px solid var(--line); color: var(--black); }
.fin-people li:first-child { border-left: 0; padding-left: 0; }
.fin-people .ix-ico { color: var(--primary); }

.fin-band { background: var(--black); color: var(--on-dark); }
.fin-band::before { content: ""; position: absolute; width: 520px; height: 520px; right: -140px; top: -240px; border-radius: 50%; border: 1px solid rgba(79, 195, 181, .22); z-index: -1; }
.fin-cta p { color: #fff; max-width: 24ch; }

/* ---------- 2. Agri-Business — full-bleed split screen ---------- */
.ix--agri { --pg-bg: rgba(26, 154, 140, .07); --pg-deep: var(--brand-2-ink); --pg-accent: #1A9A8C; --pg-accent-ink: var(--brand-2-ink); --pg-line: var(--line); }
.agri-hero { position: relative; overflow: hidden; isolation: isolate; background: var(--pg-bg); padding: clamp(2.5rem, 5vw, 3.5rem) 0 clamp(3.5rem, 6vw, 5rem); }
.agri-hero::before { content: ""; position: absolute; z-index: -1; inset: 0; background: radial-gradient(circle, rgba(26, 154, 140, .14) 1.4px, transparent 1.5px) 0 0 / 22px 22px;
  -webkit-mask: radial-gradient(ellipse at 85% 50%, #000 15%, transparent 60%); mask: radial-gradient(ellipse at 85% 50%, #000 15%, transparent 60%); }
.agri-hero__grid { display: grid; gap: clamp(3rem, 6vw, 4rem); align-items: center; }
.agri-hero h1 { max-width: 16ch; }
/* collage: a furrowed teal arch, the harvest photo standing in front, a processing-line photo tucked below, a low sun */
.agri-hero__visual { position: relative; width: min(100%, 600px); aspect-ratio: 540 / 500; margin: 0 auto; }
.agri-hero__backdrop { position: absolute; right: 0; top: 0; width: 62%; height: 92%; border-radius: 999px 999px 24px 24px; background: var(--pg-deep);
  background-image: radial-gradient(circle at 70% 20%, rgba(79, 195, 181, .35), transparent 50%), repeating-linear-gradient(115deg, rgba(255, 255, 255, .07) 0 1px, transparent 1px 22px); }
.agri-hero__sun { position: absolute; left: 6%; top: 4%; width: 92px; height: 92px; border-radius: 50%; background: radial-gradient(circle, #4FC3B5 0 34%, rgba(79, 195, 181, .22) 35% 62%, transparent 63%); }
.agri-hero__main { position: absolute; left: 14%; top: 14%; width: 52%; height: 72%; margin: 0; overflow: hidden; border-radius: 24px; box-shadow: 0 30px 60px -28px rgba(10, 37, 64, .55); border: 6px solid #fff; }
.agri-hero__main img, .agri-hero__inset img { width: 100%; height: 100%; object-fit: cover; }
.agri-hero__inset { position: absolute; right: 4%; bottom: 0; width: 46%; aspect-ratio: 547 / 365; margin: 0; overflow: hidden; border-radius: 18px; border: 6px solid #fff; box-shadow: 0 24px 48px -24px rgba(10, 37, 64, .5); }
.agri-hero__seeds { position: absolute; left: 4%; bottom: 10%; display: grid; gap: 6px; }
.agri-hero__seeds i { display: block; width: 14px; height: 24px; border-radius: 50%; background: var(--brand-2); transform: rotate(-30deg); }
.agri-hero__seeds i:nth-child(2) { background: #4FC3B5; margin-left: 12px; }
.agri-hero__seeds i:nth-child(3) { background: var(--brand-2-ink); }
@media (min-width: 992px) {
  .agri-hero__grid { grid-template-columns: minmax(0, 6fr) minmax(0, 5fr); gap: clamp(3rem, 6vw, 5rem); min-height: clamp(520px, 64vh, 640px); }
}

/* Services — an ear of grain: the services grow as alternating leaves off one stem (no icons).
   Minimal motion: when the block reveals, the stem draws up and the leaves unfurl one after another. */
.agri-rail-wrap { position: relative; }
.agri-ear { position: relative; display: grid; gap: .25rem; max-width: 1000px; margin: 3rem auto 0; padding: 0; list-style: none; }
.agri-ear li { display: flex; align-items: center; gap: 1rem; min-height: 56px; color: var(--black); }
.agri-ear__leaf { flex: none; width: 52px; height: 22px; background: linear-gradient(90deg, #4FC3B5, var(--brand-2)); border-radius: 100% 0 100% 0; transform-origin: left center; }
.agri-ear li:nth-child(n+4) .agri-ear__leaf { background: linear-gradient(90deg, var(--brand-2), var(--brand-2-ink)); }
.agri-ear li:last-child .agri-ear__leaf { background: linear-gradient(90deg, var(--brand-2-ink), var(--primary)); }
/* phones: one stem on the left, every leaf to the right */
@media (max-width: 767.98px) {
  .agri-ear { border-left: 3px solid var(--brand-2); }
  .agri-ear li { padding-left: 0; }
}
@media (min-width: 768px) {
  .agri-ear { grid-template-columns: 1fr 1fr; column-gap: 0; row-gap: 0; }
  .agri-ear::before { content: ""; position: absolute; left: 50%; top: -18px; bottom: 0; width: 3px; margin-left: -1.5px; border-radius: 2px; background: linear-gradient(0deg, var(--brand-2-ink), #4FC3B5); transform-origin: bottom; }
  .agri-ear::after { content: ""; position: absolute; left: 50%; top: -40px; width: 14px; height: 28px; margin-left: -7px; border-radius: 50%; background: #4FC3B5; }
  /* alternate sides, each next leaf half a step higher so the ear reads as one stalk */
  .agri-ear li { grid-column: 2; padding-left: 0; }
  .agri-ear li:nth-child(odd) { grid-column: 1; flex-direction: row-reverse; text-align: right; }
  .agri-ear li:nth-child(odd) .agri-ear__leaf { transform-origin: right center; border-radius: 0 100% 0 100%; }
  .agri-ear li:nth-child(1) { grid-row: 1; } .agri-ear li:nth-child(2) { grid-row: 2; } .agri-ear li:nth-child(3) { grid-row: 3; }
  .agri-ear li:nth-child(4) { grid-row: 4; } .agri-ear li:nth-child(5) { grid-row: 5; } .agri-ear li:nth-child(6) { grid-row: 6; } .agri-ear li:nth-child(7) { grid-row: 7; }
  .agri-ear { grid-auto-rows: 44px; }
  .agri-ear li:nth-child(even) { margin-top: -22px; }
  .agri-ear li:nth-child(odd) { padding-right: 1.5px; }
  .agri-ear li:nth-child(even) { padding-left: 1.5px; }
}
/* motion */
@media (prefers-reduced-motion: no-preference) {
  .agri-ear__leaf { transform: scale(0); transition: transform .6s cubic-bezier(.2, .8, .2, 1.2); }
  .agri-ear__txt { opacity: 0; transform: translateY(6px); transition: opacity .5s ease, transform .5s ease; }
  .agri-ear::before { transform: scaleY(0); transition: transform 1s ease; }
  .agri-ear::after { opacity: 0; transition: opacity .4s ease 1s; }
  .agri-rail-wrap.is-visible .agri-ear::before { transform: scaleY(1); }
  .agri-rail-wrap.is-visible .agri-ear::after { opacity: 1; }
  .agri-rail-wrap.is-visible .agri-ear__leaf { transform: scale(1); }
  .agri-rail-wrap.is-visible .agri-ear__txt { opacity: 1; transform: none; }
  .agri-ear li:nth-child(7) > * { transition-delay: .25s; } .agri-ear li:nth-child(6) > * { transition-delay: .35s; }
  .agri-ear li:nth-child(5) > * { transition-delay: .45s; } .agri-ear li:nth-child(4) > * { transition-delay: .55s; }
  .agri-ear li:nth-child(3) > * { transition-delay: .65s; } .agri-ear li:nth-child(2) > * { transition-delay: .75s; }
  .agri-ear li:nth-child(1) > * { transition-delay: .85s; }
}

.agri-band { background: var(--pg-deep); color: rgba(255, 255, 255, .78); overflow: hidden; }
.agri-band::before { content: ""; position: absolute; inset: 0; z-index: -1; background: radial-gradient(circle at 92% 0%, rgba(79, 195, 181, .2), transparent 40%); }
.agri-band h2 { color: #fff; }
/* Who — a skyline of arched photo windows (tallest in the middle), each audience named beneath; no icons.
   Minimal motion: on reveal each arch rises into view and its photo settles from a slight zoom. */
.agri-arches { display: grid; grid-template-columns: repeat(2, 1fr); gap: 2rem 1rem; margin: 0; padding: 0; list-style: none; }
.agri-arches li { display: flex; flex-direction: column; align-items: center; gap: 1rem; text-align: center; color: #fff; }
.agri-arches li:last-child { grid-column: 1 / -1; }
.agri-arch { --h: 190px; position: relative; width: min(100%, 170px); height: var(--h); margin: 0; overflow: hidden; border-radius: 999px 999px 14px 14px;
  outline: 1px solid rgba(255, 255, 255, .28); outline-offset: 6px; background: rgba(255, 255, 255, .08); }
.agri-arch img { width: 100%; height: 100%; object-fit: cover; }
.agri-arch::after { content: ""; position: absolute; inset: 0; background: linear-gradient(180deg, transparent 55%, rgba(10, 37, 64, .35)); }
.agri-arch__name { max-width: 17ch; line-height: 1.35; }
@media (min-width: 992px) {
  .agri-arches { grid-template-columns: repeat(5, 1fr); align-items: end; gap: 2rem; }
  .agri-arches li:last-child { grid-column: auto; }
  .agri-arch { width: 100%; max-width: 190px; }
  .agri-arches li:nth-child(1) .agri-arch, .agri-arches li:nth-child(5) .agri-arch { --h: 220px; }
  .agri-arches li:nth-child(2) .agri-arch, .agri-arches li:nth-child(4) .agri-arch { --h: 270px; }
  .agri-arches li:nth-child(3) .agri-arch { --h: 320px; outline-color: #4FC3B5; }
  .agri-arches .agri-arch__name { min-height: 2.7em; }
}
@media (prefers-reduced-motion: no-preference) {
  .agri-arches li[data-reveal] .agri-arch { clip-path: inset(100% 0 0 0 round 999px 999px 14px 14px); transition: clip-path .9s cubic-bezier(.2, .7, .2, 1); }
  .agri-arches li[data-reveal] .agri-arch img { transform: scale(1.12); transition: transform 1.4s cubic-bezier(.2, .7, .2, 1); }
  .agri-arches li[data-reveal].is-visible .agri-arch { clip-path: inset(0 0 0 0 round 999px 999px 14px 14px); }
  .agri-arches li[data-reveal].is-visible .agri-arch img { transform: none; }
}
.agri-cta { display: grid; gap: 2rem; align-items: center; margin-top: clamp(3.5rem, 7vw, 5.5rem); padding-top: clamp(2.5rem, 5vw, 4rem); border-top: 1px solid rgba(255, 255, 255, .14); }
.agri-band .btn--accent { background: #fff; color: var(--black); border-color: #fff; }
.agri-band .btn--accent:hover { color: var(--black); }
.agri-cta p { color: #fff; margin: 0; max-width: 22ch; }
@media (min-width: 992px) { .agri-cta { grid-template-columns: 1fr auto; } }

/* Intro continues the hero's split: white statement column | deep-green panel running to the edge */
/* Intro — the field photo with the support note set into its lower edge on a teal glass band | statement */
.agri-story__grid { display: grid; gap: clamp(2.5rem, 5vw, 3.5rem); align-items: center; }
.agri-story__main .ix-lead { max-width: 58ch; margin: 0; }
.agri-story__media { position: relative; overflow: hidden; border-radius: 22px; aspect-ratio: 547 / 420; box-shadow: 0 30px 60px -32px rgba(10, 37, 64, .5); }
.agri-story__media img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; object-position: 50% 30%; }
.agri-story__media::before { content: ""; position: absolute; z-index: 1; inset: 0; background: linear-gradient(180deg, transparent 35%, rgba(21, 126, 115, .55) 70%, rgba(10, 37, 64, .85)); }
.agri-story__note { position: absolute; z-index: 2; left: 0; right: 0; bottom: 0; padding: 1.5rem 1.75rem 1.6rem; border-top: 3px solid #4FC3B5; background: rgba(10, 37, 64, .35); -webkit-backdrop-filter: blur(6px); backdrop-filter: blur(6px); }
.agri-story__note p { margin: 0; color: #fff; font-size: var(--font-body); line-height: 1.6; }
@media (min-width: 992px) {
  .agri-story__grid { grid-template-columns: minmax(0, 5fr) minmax(0, 6fr); gap: clamp(3.5rem, 6vw, 5.5rem); }
}
@media (max-width: 767.98px) { .agri-story__media { aspect-ratio: auto; background: var(--black); } .agri-story__media img { position: static; height: 220px; } .agri-story__media::before { content: none; } .agri-story__note { position: static; background: var(--black); -webkit-backdrop-filter: none; backdrop-filter: none; } }

/* ---------- 3. Rural Enterprises — centred title over a panoramic photo ---------- */
.ix--rural { --pg-bg: var(--surface); --pg-accent: #1A9A8C; --pg-accent-ink: var(--brand-2-ink); --pg-line: var(--line);
  --rr-contour: url("../img/opportunities/rural-contours.svg"); }

/* Hero — copy | the sunset field illustration split into a staggered triptych of three tall panels that together read as one scene.
   Minimal motion: the panels rise into place one after another. */
.rr-hero { position: relative; overflow: hidden; isolation: isolate; background: linear-gradient(180deg, var(--surface-2) 0%, var(--surface) 100%); padding: clamp(2.5rem, 5vw, 3.5rem) 0 clamp(3.5rem, 6vw, 4.5rem); }
.rr-hero::before { content: ""; position: absolute; z-index: -1; right: -10%; top: -20%; width: 60%; aspect-ratio: 1; border-radius: 50%; background: radial-gradient(circle, rgba(79, 195, 181, .18), transparent 65%); }
.rr-hero__grid { display: grid; gap: 3rem; align-items: center; }
.rr-hero h1 { max-width: 15ch; }
.rr-tri { position: relative; width: 100%; margin: 0 auto; }
.rr-tri__panel { display: none; }
.ix .rr-tri__solo { display: block; width: 100%; height: auto; aspect-ratio: 4 / 3; object-fit: cover; border-radius: 22px; box-shadow: 0 30px 60px -30px rgba(10, 37, 64, .5); }
@media (min-width: 992px) {
  .rr-hero__grid { grid-template-columns: minmax(0, 5fr) minmax(0, 6fr); gap: clamp(3rem, 5vw, 4.5rem); }
  /* fixed geometry so the three slices line up into one picture: frame 600 x 560, gap 14, image drawn at 747 x 560 */
  .rr-tri { --W: 600px; --H: 560px; --g: 14px; --pw: calc((var(--W) - 2 * var(--g)) / 3); --iw: 747px; --x0: calc((var(--iw) - var(--W)) / 2);
    width: var(--W); height: var(--H); display: flex; gap: var(--g); align-items: flex-end; }
  .ix .rr-tri__solo { display: none; }
  .rr-tri__panel { display: block; flex: none; width: var(--pw); border-radius: 22px; box-shadow: 0 26px 50px -26px rgba(10, 37, 64, .55);
    background: url("../img/opportunities/rural-fields-illustration.jpg") no-repeat; background-size: var(--iw) var(--H); }
  .rr-tri__panel--1 { height: 86%; background-position: calc(-1 * var(--x0)) 100%; border-radius: 22px 22px 22px 22px; }
  .rr-tri__panel--2 { height: 100%; background-position: calc(-1 * (var(--x0) + var(--pw) + var(--g))) 100%; border-radius: 999px 999px 22px 22px; }
  .rr-tri__panel--3 { height: 74%; background-position: calc(-1 * (var(--x0) + 2 * (var(--pw) + var(--g)))) 100%; }
}
@media (min-width: 992px) and (max-width: 1199.98px) { .rr-tri { --W: 480px; --H: 470px; --iw: 627px; } }
@media (min-width: 992px) and (prefers-reduced-motion: no-preference) {
  .rr-tri .rr-tri__panel { opacity: 0; transform: translateY(40px); transition: opacity .7s ease, transform .9s cubic-bezier(.2, .7, .2, 1); }
  .rr-tri.is-visible .rr-tri__panel { opacity: 1; transform: none; }
  .rr-tri .rr-tri__panel--2 { transition-delay: .12s; } .rr-tri .rr-tri__panel--3 { transition-delay: .24s; }
}

/* Intro — copy on the left; the potter photo bleeds off the right edge behind a slanted cut */
.rr-story { position: relative; overflow: hidden; }
.rr-story__copy .ix-lead { max-width: 58ch; margin: 0; }
.rr-story__note { margin-top: clamp(1.75rem, 3vw, 2.25rem); padding-top: 1.5rem; border-top: 1px solid var(--line); }
.rr-story__note p { margin: 0; max-width: 58ch; color: var(--text); font-size: var(--font-body); line-height: 1.75; }
.rr-story__note b { font-weight: 500; color: var(--brand-2-ink); }
.rr-story__media { margin: calc(-1 * var(--sec-y)) calc(-1 * clamp(20px, 5vw, 80px)) 2.5rem; height: 300px; overflow: hidden; }
.rr-story__media img { width: 100%; height: 100%; object-fit: cover; object-position: 50% 45%; }
@media (min-width: 992px) {
  .rr-story { min-height: 560px; display: flex; align-items: center; }
  .rr-story > .container { width: 100%; }
  .rr-story__copy { width: 52%; }
  .rr-story__media { position: absolute; top: 0; right: 0; bottom: 0; width: 42%; height: auto; margin: 0; clip-path: polygon(14% 0, 100% 0, 100% 100%, 0 100%); }
  .rr-story__media::before { content: ""; position: absolute; z-index: 1; left: 0; top: 0; bottom: 0; width: 14%; background: linear-gradient(90deg, #fff, transparent); pointer-events: none; }
}

/* Services — the farmer portrait bleeds off the left edge; the eight services sit beside it as a two-column numbered ledger */
.rr-offer { position: relative; overflow: hidden; background: var(--surface); }
.rr-offer__media { margin: 0; height: 320px; overflow: hidden; }
.rr-offer__media img { width: 100%; height: 100%; object-fit: cover; object-position: 40% 30%; }
.rr-offer__copy { padding: clamp(2.75rem, 6vw, 4rem) 0 var(--sec-y); }
.rr-offer__head h2 { margin: 0 0 clamp(1.75rem, 3vw, 2.25rem); }
.rr-ledger { display: grid; margin: 0; padding: 0; list-style: none; counter-reset: rl; border-top: 1px solid var(--line); }
.rr-ledger li { counter-increment: rl; display: grid; grid-template-columns: 2.5rem 1fr; align-items: baseline; gap: .75rem; padding: 1rem 0; border-bottom: 1px solid var(--line); color: var(--black); }
.rr-ledger li::before { content: counter(rl, decimal-leading-zero); font-size: .85rem; font-weight: 600; color: var(--brand-2-ink); }
.ix .rr-ledger li[data-reveal].is-visible::before { transform: none; }
@media (min-width: 768px) { .rr-ledger { grid-template-columns: 1fr 1fr; column-gap: 2.5rem; } }
@media (min-width: 992px) {
  .rr-offer { min-height: 560px; display: flex; align-items: center; }
  .rr-offer > .container { width: 100%; }
  .rr-offer__media { position: absolute; top: 0; left: 0; bottom: 0; width: 40%; height: auto; }
  .rr-offer__media::after { content: ""; position: absolute; inset: 0; background: linear-gradient(90deg, transparent 70%, var(--surface)); }
  .rr-offer__copy { margin-left: 44%; padding: var(--sec-y) 0; }
}

/* Who — map pins rising from a shared ground line, like homes across a village; static */
.rr-pins { position: relative; display: grid; grid-template-columns: repeat(2, 1fr); align-items: start; gap: 2.75rem 1rem; margin: 0; padding: 0; list-style: none; text-align: center; }
.rr-pins li { --rise: 22px; display: flex; flex-direction: column; align-items: center; color: var(--black); font-size: .95rem; font-weight: 500; line-height: 1.35; }
.rr-pins .ix-ico { width: 72px; height: 72px; border-radius: 50% 50% 50% 0; transform: rotate(-45deg); background: var(--black); color: #4FC3B5; box-shadow: 0 16px 30px -14px rgba(10, 37, 64, .55); }
.rr-pins .ix-ico .icon { width: 28px; height: 28px; transform: rotate(45deg); }
.rr-pins li:nth-child(even) .ix-ico { background: var(--primary); color: #fff; }
.rr-pins li::before { content: ""; order: -2; width: 2px; height: var(--rise); margin-top: 10px; background: repeating-linear-gradient(180deg, var(--brand-2) 0 4px, transparent 4px 8px); }
.rr-pins li::after { content: ""; order: -1; width: 12px; height: 12px; margin: 0 0 1.1rem; border-radius: 50%; background: var(--brand-2); box-shadow: 0 0 0 5px rgba(26, 154, 140, .15); }
.rr-pins li > .ix-ico { order: -3; }
.rr-pins li > * { flex: none; }
.ix .rr-pins li[data-reveal].is-visible::before { transform: none; }
@media (min-width: 768px) { .rr-pins { grid-template-columns: repeat(3, 1fr); } }
@media (min-width: 992px) {
  .rr-pins { grid-template-columns: repeat(6, 1fr); gap: 1.5rem; }
  .rr-pins li { --rise: var(--stem); padding-top: calc(110px - var(--stem)); }
  .rr-pins::after { content: ""; position: absolute; z-index: -1; left: 0; right: 0; top: calc(110px + 72px + 10px + 6px); height: 2px; background: linear-gradient(90deg, transparent, var(--line) 8%, var(--line) 92%, transparent); }
}

/* CTA — rolling Kerala hills in brand blues and teals */
/* CTA — statement + button | the livelihoods fan shown whole, standing on the band's bottom edge; its striped grey ground fades into the band */
.rr-cta { position: relative; overflow: hidden; isolation: isolate; padding: var(--sec-y) 0 0; background: #DEDEE0; color: var(--black); }
.rr-cta::before { content: ""; position: absolute; z-index: -1; inset: 0; background: repeating-linear-gradient(135deg, rgba(10, 37, 64, .035) 0 2px, transparent 2px 9px); }
.rr-cta__grid { display: grid; gap: 2.5rem; align-items: end; }
.rr-cta__body { display: grid; justify-items: start; gap: 1.75rem; padding-bottom: 0; }
.rr-cta .big { margin: 0; max-width: 22ch; color: var(--black); font-size: clamp(1.35rem, 2.6vw, 2rem); font-weight: 500; line-height: 1.3; letter-spacing: -0.02em; }
.rr-cta .btn--white { background: var(--black); border-color: var(--black); color: #fff; }
.rr-cta .btn--white:hover { color: #fff; }
.rr-cta__fan { margin: 0; line-height: 0; }
.ix .rr-cta__fan img { display: block; width: 100%; height: auto;
  -webkit-mask: linear-gradient(90deg, transparent 0, #000 18%, #000 82%, transparent 100%), linear-gradient(180deg, transparent 0, #000 26%); -webkit-mask-composite: source-in;
  mask: linear-gradient(90deg, transparent 0, #000 18%, #000 82%, transparent 100%) intersect, linear-gradient(180deg, transparent 0, #000 26%); }
@media (min-width: 992px) {
  .rr-cta__grid { grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); gap: clamp(2rem, 4vw, 3.5rem); }
  .rr-cta__body { align-self: center; padding-bottom: var(--sec-y); }
}

/* Rural — phone & tablet refinements */
@media (max-width: 991.98px) {
  .rr-hero { padding-bottom: 2.5rem; }
  .rr-hero__grid { gap: 2rem; }
  .ix .rr-tri__solo { aspect-ratio: 16 / 11; object-position: 50% 78%; border-radius: 18px; }
  .rr-story__media { height: clamp(240px, 64vw, 380px); margin-bottom: 2rem; }
  .rr-offer__media { height: clamp(260px, 72vw, 420px); }
  .rr-offer__media img { object-position: 45% 25%; }
  .rr-offer__copy { padding-top: 2.25rem; }
  .rr-pins { gap: 2.25rem 1rem; }
  .rr-cta__grid { gap: 1.5rem; }
  .rr-cta__body { gap: 1.25rem; }
  .rr-cta__fan { margin: 0 calc(50% - 50vw); }
  .ix .rr-cta__fan img { -webkit-mask: linear-gradient(180deg, transparent 0, #000 22%); mask: linear-gradient(180deg, transparent 0, #000 22%); }
}
@media (min-width: 576px) and (max-width: 991.98px) {
  .rr-cta__fan { width: 100%; max-width: 560px; margin: 0 auto; }
}
@media (max-width: 575.98px) {
  .rr-pins .ix-ico { width: 64px; height: 64px; }
  .rr-pins .ix-ico .icon { width: 26px; height: 26px; }
  .rr-pins li { font-size: .9375rem; }
}

/* ---------- 4. Women Entrepreneurship — asymmetric, arched portrait anchored to the base ---------- */
.ix--women { --pg-bg: var(--surface); --pg-accent: #1A9A8C; --pg-accent-ink: #157E73; --pg-line: var(--line); }
.women-hero { background: var(--pg-bg); padding: clamp(2.5rem, 5vw, 4rem) 0 0; overflow: hidden; }
.women-hero__stage { display: grid; gap: 2.5rem; }
.women-hero__card { padding-bottom: clamp(1rem, 3vw, 2rem); }
.women-hero__photo { aspect-ratio: 4 / 3; border-radius: 999px 999px 0 0; }
@media (max-width: 991.98px) { .women-hero__card { order: -1; padding-bottom: 0; } .women-hero__photo { max-width: 520px; width: 100%; margin-inline: auto; } }
@media (min-width: 992px) {
  .women-hero__stage { grid-template-columns: minmax(0, 6fr) minmax(0, 5fr); gap: clamp(3rem, 6vw, 6rem); align-items: end; min-height: clamp(600px, 76vh, 780px); }
  .women-hero__card { grid-row: 1; grid-column: 1; align-self: center; padding-bottom: 3rem; }
  .women-hero__photo { grid-row: 1; grid-column: 2; aspect-ratio: 5 / 5.2; border-radius: 999px 999px 0 0; }
}

/* Services — a rising staircase: seven treads climbing from mentoring to growth; static */
.women-steps-sec { position: relative; overflow: hidden; isolation: isolate; padding-bottom: clamp(3rem, 5vw, 4rem); }
.women-steps { position: relative; display: grid; gap: 0; margin: 0; padding: 0; list-style: none; counter-reset: ws; }
.women-steps li { counter-increment: ws; position: relative; display: grid; grid-template-columns: 44px 1fr; gap: 1rem; align-items: center; padding: .9rem 0 .9rem calc(var(--i, 0) * 14px);
  color: var(--black); font-size: var(--font-body); font-weight: 500; line-height: 1.4; }
.women-steps li::before { content: counter(ws); display: grid; place-items: center; width: 44px; height: 44px; border-radius: 50%; background: #fff; border: 2px solid var(--brand-2); color: var(--brand-2-ink); font-size: .85rem; font-weight: 600; }
.ix .women-steps li[data-reveal].is-visible::before { transform: none; }
.women-steps li:last-child::before { background: var(--brand-2); color: #fff; }
.women-steps li:nth-child(1) { --i: 0; } .women-steps li:nth-child(2) { --i: 1; } .women-steps li:nth-child(3) { --i: 2; } .women-steps li:nth-child(4) { --i: 3; }
.women-steps li:nth-child(5) { --i: 4; } .women-steps li:nth-child(6) { --i: 5; } .women-steps li:nth-child(7) { --i: 6; }
@media (min-width: 992px) {
  .women-steps { --rise: 18px; grid-template-columns: repeat(7, 1fr); align-items: end; padding-top: 0; }
  .women-steps li { grid-template-columns: 1fr; grid-template-rows: auto auto auto; align-content: end; gap: .9rem; padding: 0 .9rem; }
  .women-steps li::before { grid-row: 1; }
  /* the tread + riser block under each step */
  .women-steps li::after { content: ""; grid-row: 3; height: calc(var(--rise) * (var(--i) + 1) + 10px); margin: .35rem -.9rem 0; border-top: 3px solid var(--brand-2);
    background: linear-gradient(180deg, rgba(7, 87, 154, calc(.07 + var(--i) * .035)), rgba(7, 87, 154, .03)); border-left: 1px solid rgba(255, 255, 255, .7); border-radius: 4px 4px 0 0; }
  .women-steps li:first-child::after { border-left: 0; }
  .women-steps li:nth-child(n+4)::after { border-top-color: var(--primary-2); }
  .women-steps li:last-child::after { border-top-color: #4FC3B5; background: linear-gradient(180deg, var(--primary), var(--black-2)); }
  .women-steps li:nth-child(n+4)::before { border-color: var(--primary-2); color: var(--primary); }
  .women-steps li:last-child::before { background: var(--primary); border-color: var(--primary); color: #fff; box-shadow: 0 0 0 6px rgba(7, 87, 154, .14); }
  /* rising arrow over the staircase */
  .women-steps-sec .women-steps { margin-top: 0; }

}
@media (max-width: 991.98px) {
  .women-steps::before { content: ""; position: absolute; left: 21px; top: 1.5rem; bottom: 1.5rem; width: 2px; background: linear-gradient(var(--brand-2), var(--primary)); opacity: .35; }
  .women-steps li { padding-left: 0; }
}

/* Audience: the portrait is the centre; audiences sit either side and read toward it */
.women-who-wrap { display: grid; gap: 2rem; align-items: center; }
.women-who__photo { position: relative; width: min(360px, 100%); aspect-ratio: 4 / 4.8; margin: 0 auto; border-radius: 999px 999px var(--ix-radius) var(--ix-radius); box-shadow: 0 0 0 14px var(--surface), 0 0 0 15px var(--line); }
.women-who { display: grid; }
.women-who li { position: relative; display: flex; align-items: center; gap: 1.1rem; padding: 1.25rem 0; border-bottom: 1px solid var(--pg-line); color: var(--black); }
.women-who li:first-child { border-top: 1px solid var(--pg-line); }
.women-who .ix-ico { width: 48px; height: 48px; border-radius: 50%; background: rgba(26, 154, 140, .1); color: var(--brand-2-ink); }
.women-who .ix-ico .icon { width: 20px; height: 20px; }
@media (max-width: 991.98px) {
  .women-who__photo { order: -1; margin-bottom: 1rem; }
  .women-who--r li:first-child { border-top: 0; }
  .women-who-wrap { gap: 0; }
}
@media (min-width: 992px) {
  .women-who-wrap { grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr); column-gap: clamp(3rem, 6vw, 5.5rem); }
  .women-who__photo { width: clamp(280px, 26vw, 360px); }
  .women-who li { padding: 1.5rem 0; }
  .women-who--l li { flex-direction: row-reverse; text-align: right; }
  /* faint dashed connector from each audience toward the portrait */
  .women-who li::after { content: ""; position: absolute; top: 50%; width: clamp(2rem, 4vw, 3.75rem); border-top: 1px dashed var(--line); }
  .women-who--l li::after { left: 100%; margin-left: .75rem; }
  .women-who--r li::after { right: 100%; margin-right: .75rem; }
}

.women-band { background: var(--black); text-align: center; }
.women-band::before { content: ""; position: absolute; left: -160px; bottom: -260px; width: 560px; height: 560px; border-radius: 50%; background: radial-gradient(circle, rgba(26, 154, 140, .28), transparent 65%); z-index: -1; }
.ix .women-band .container > [data-reveal] { grid-template-columns: 1fr; justify-items: center; }
.women-band .btn--primary { background: #fff; color: var(--black); border-color: #fff; }
.women-band .btn--primary:hover { color: var(--black); }
.women-cta .big { color: #fff; max-width: 22ch; }

/* ---------- 5. Startup Development — dark, type-led, framed image ---------- */
.ix--startup { --pg-bg: #F2F7FB; --pg-accent: #1A9A8C; --pg-accent-ink: #157E73; }
.su-hero { position: relative; overflow: hidden; isolation: isolate; background: var(--black); color: var(--on-dark); padding: clamp(2.5rem, 5vw, 4rem) 0 clamp(3.5rem, 6vw, 5rem); }
.su-hero::before { content: ""; position: absolute; inset: 0; z-index: -1; background: radial-gradient(circle at 80% 40%, rgba(26, 154, 140, .3), transparent 40%), linear-gradient(rgba(255, 255, 255, .04) 1px, transparent 1px) 0 0 / 64px 64px, linear-gradient(90deg, rgba(255, 255, 255, .04) 1px, transparent 1px) 0 0 / 64px 64px; -webkit-mask-image: linear-gradient(180deg, #000 55%, transparent); mask-image: linear-gradient(180deg, #000 55%, transparent); }
.su-hero h1 { color: #fff; max-width: 13ch; }
.su-hero h1 span { color: #4FC3B5; }
.su-hero .ix-hero__lede { color: var(--on-dark); }
.su-hero__grid { display: grid; gap: 3.5rem; align-items: center; }
.su-hero { --hp-t: clamp(2.5rem, 5vw, 4rem); --hp-b: clamp(3.5rem, 6vw, 5rem); padding: var(--hp-t) 0 var(--hp-b); }
.su-hero__visual { position: relative; min-height: 360px; margin: 0 calc(-1 * clamp(20px, 5vw, 80px)) calc(-1 * var(--hp-b)); }
.su-hero__chess { position: absolute; inset: 0; margin: 0; }
.su-hero__chess img { object-position: 52% 55%; }
.su-hero__chess::after { content: ""; position: absolute; inset: 0; background: linear-gradient(90deg, var(--black) 0%, rgba(10, 37, 64, .35) 30%, transparent 60%); }
.su-idea__photo { aspect-ratio: 4 / 3; max-width: 380px; margin-bottom: 1.75rem; }
@media (min-width: 992px) {
  .su-hero__grid { grid-template-columns: minmax(0, 6fr) minmax(0, 5fr); gap: 0; min-height: clamp(600px, 76vh, 780px); align-items: center; }
  .su-hero__visual { align-self: stretch; margin: calc(-1 * var(--hp-t)) calc(-1 * var(--bleed)) calc(-1 * var(--hp-b)) 0; }
  .su-hero__chess::after { background: linear-gradient(90deg, var(--black) 0%, rgba(10, 37, 64, .5) 22%, transparent 55%); }
}

.su-idea__big { color: var(--black); margin: 0; }
.su-idea__big mark { background: linear-gradient(transparent 62%, rgba(79, 195, 181, .35) 62%); color: inherit; padding: 0 .1em; }
.su-idea__stage { color: var(--black); }

/* Services — eight services in orbit around a launching rocket: four each side, curving round the core; static */
.su-orbit-sec { position: relative; overflow: hidden; isolation: isolate; }
.su-orbit { display: grid; gap: 2rem; align-items: center; }
.su-orbit__col { display: grid; gap: 1.4rem; margin: 0; padding: 0; list-style: none; }
.su-orbit__col li { position: relative; display: flex; align-items: center; gap: 1rem; color: var(--black); }
.su-orbit__ico { flex: none; display: grid; place-items: center; width: 56px; height: 56px; border-radius: 50%; background: #fff; border: 1px solid var(--line); color: var(--primary); box-shadow: 0 10px 22px -16px rgba(10, 37, 64, .45); }
.su-orbit__ico .icon { width: 28px; height: 28px; }
.su-orbit__col--r li:nth-child(odd) .su-orbit__ico, .su-orbit__col--l li:nth-child(even) .su-orbit__ico { color: var(--brand-2-ink); }
/* each service marked by a small node on its tether (no icon) */
.su-orbit__col li::before { content: ""; flex: none; width: 12px; height: 12px; border-radius: 50%; background: #fff; border: 2.5px solid var(--brand-2); box-shadow: 0 0 0 4px rgba(26, 154, 140, .12); }
.ix .su-orbit__col li[data-reveal].is-visible::before { transform: none; }
.su-orbit__col li:nth-child(even)::before { border-color: var(--primary); box-shadow: 0 0 0 4px rgba(7, 87, 154, .1); }
.su-orbit__core { position: relative; width: min(100%, 300px); aspect-ratio: 1; margin: 0 auto; order: -1; }
.su-orbit__ring { position: absolute; left: 50%; top: 50%; border-radius: 50%; transform: translate(-50%, -50%); }
.su-orbit__ring--1 { width: 100%; height: 100%; border: 1.5px dashed rgba(7, 87, 154, .25); }
.su-orbit__ring--2 { width: 72%; height: 72%; border: 1px solid var(--line); background: rgba(255, 255, 255, .6); }
.su-orbit__ring--3 { width: 46%; height: 46%; background: radial-gradient(circle, rgba(79, 195, 181, .25), transparent 70%); }
.su-orbit__sun { position: absolute; left: 50%; top: 50%; width: 210px; height: 210px; margin: -105px 0 0 -105px; display: grid; place-items: center; overflow: hidden; border-radius: 50%; border: 5px solid #fff;
  background: linear-gradient(150deg, var(--primary) 0%, var(--black) 100%); color: #fff; box-shadow: 0 0 0 10px rgba(7, 87, 154, .1), 0 24px 44px -18px rgba(10, 37, 64, .7); }
.su-orbit__sun img { width: 100%; height: 100%; object-fit: cover; object-position: 50% 38%; }
.su-orbit__planet { position: absolute; width: 14px; height: 14px; margin: -7px 0 0 -7px; border-radius: 50%; }
.su-orbit__planet--a { left: 85%; top: 15%; background: #4FC3B5; box-shadow: 0 0 0 5px rgba(79, 195, 181, .2); }
.su-orbit__planet--b { left: 14%; top: 22%; width: 10px; height: 10px; margin: -5px 0 0 -5px; background: var(--primary); }
.su-orbit__planet--c { left: 30%; top: 90%; width: 12px; height: 12px; margin: -6px 0 0 -6px; background: var(--brand-2); }
@media (max-width: 991.98px) { .su-orbit { row-gap: 1.4rem; } .su-orbit__core { width: min(100%, 220px); margin-bottom: .6rem; } .su-orbit__sun { width: 150px; height: 150px; margin: -75px 0 0 -75px; } }
@media (min-width: 992px) {
  .su-orbit { grid-template-columns: 1fr 340px 1fr; gap: 2.5rem; }
  .su-orbit__core { width: 340px; order: 0; }
  .su-orbit__col { gap: 1.6rem; }
  /* left column reads towards the core: text then icon, right-aligned */
  .su-orbit__col--l li { flex-direction: row-reverse; text-align: right; }
  /* curve round the core: outer rows sit further out, middle rows tuck in */
  .su-orbit__col--l li:nth-child(1), .su-orbit__col--l li:nth-child(4) { margin-right: 3rem; }
  .su-orbit__col--r li:nth-child(1), .su-orbit__col--r li:nth-child(4) { margin-left: 3rem; }
  /* short dashed tether from each icon towards the core */
  .su-orbit__col li::after { content: ""; position: absolute; top: 50%; width: 1.4rem; border-top: 1.5px dashed rgba(26, 154, 140, .45); }
  .su-orbit__col--l li::after { right: -1.6rem; }
  .su-orbit__col--r li::after { left: -1.6rem; }
  .su-orbit__col--l li:nth-child(1)::after, .su-orbit__col--l li:nth-child(4)::after { width: 4.4rem; right: -4.6rem; }
  .su-orbit__col--r li:nth-child(1)::after, .su-orbit__col--r li:nth-child(4)::after { width: 4.4rem; left: -4.6rem; }
}

.su-band { background: linear-gradient(rgba(10, 37, 64, .9), rgba(10, 37, 64, .94)), url("../img/bg_support.webp") center / cover, var(--black); color: var(--on-dark); overflow: hidden; }
.su-band h2 { color: #fff; }
.su-band__grid { display: grid; gap: 3rem clamp(3rem, 7vw, 7rem); align-items: end; }
.su-who { display: flex; flex-wrap: wrap; gap: 1rem 2.25rem; margin-top: 1.25rem; }
.su-who li { display: inline-flex; align-items: center; gap: .5rem; color: #fff; }
.su-who .icon { width: 18px; height: 18px; color: #4FC3B5; }
@media (max-width: 575.98px) { .su-who { display: grid; gap: .85rem; } }
.su-band__cta { padding-left: 2rem; border-left: 2px solid #4FC3B5; }
.su-band__cta p { color: #fff; margin: 0 0 1.75rem; }
.su-band__cta .btn--navy { background: #4FC3B5; border-color: #4FC3B5; color: var(--black); }
.su-band__cta .btn--navy:hover { color: var(--black); }
@media (min-width: 992px) { .su-band__grid { grid-template-columns: minmax(0, 7fr) minmax(0, 5fr); } }

/* ---------- 6. SME/MSME — structured split, photo on an offset blue block ---------- */
.ix--sme { --pg-bg: var(--surface); --pg-accent: #07579A; --pg-accent-ink: #07579A; --pg-line: var(--line); }
.sme-hero { background: linear-gradient(160deg, var(--surface) 0%, var(--surface) 100%); padding: clamp(2.5rem, 5vw, 4rem) 0 clamp(3.5rem, 6vw, 5rem); overflow: hidden; }
.sme-hero__grid { display: grid; gap: 3.5rem; align-items: center; }
.sme-hero h1 { max-width: 15ch; }
.sme-hero { --hp-t: clamp(2.5rem, 5vw, 4rem); --hp-b: clamp(3.5rem, 6vw, 5rem); padding: var(--hp-t) 0 var(--hp-b); }
.sme-dash { position: relative; min-height: 340px; margin: 0 calc(-1 * clamp(20px, 5vw, 80px)) calc(-1 * var(--hp-b)); }
.sme-hero__bleed { position: absolute; inset: 0; margin: 0; }
.sme-hero__bleed img { object-position: 55% 50%; }
.sme-hero__bleed::after { content: ""; position: absolute; inset: 0; background: linear-gradient(180deg, transparent 55%, rgba(7, 87, 154, .35)); }
.sme-dash__photo { position: absolute; left: clamp(20px, 5vw, 80px); bottom: -2rem; width: clamp(120px, 14vw, 200px); aspect-ratio: 1; border-radius: 50%; overflow: hidden; margin: 0; border: 6px solid var(--surface); z-index: 2; }
@media (min-width: 992px) {
  .sme-hero__grid { grid-template-columns: minmax(0, 6fr) minmax(0, 5fr); gap: 0; min-height: clamp(600px, 76vh, 780px); }
  .sme-hero__grid > :first-child { padding-right: clamp(2rem, 5vw, 5rem); }
  .sme-dash { align-self: stretch; margin: calc(-1 * var(--hp-t)) calc(-1 * var(--bleed)) calc(-1 * var(--hp-b)) 0; }
  .sme-dash__photo { left: calc(-1 * clamp(70px, 7vw, 100px)); bottom: 3.5rem; }
}


.sme-cta p { color: #fff; max-width: 30ch; }

/* ===================================================================
   SERVICES
   =================================================================== */

/* ---------- 7. Entrepreneurship Training — full-bleed photographic hero ---------- */
.ix--train { --pg-bg: var(--surface); --pg-accent: #07579A; --pg-accent-ink: #07579A; --pg-line: var(--line); }
.tr-hero { position: relative; isolation: isolate; overflow: hidden; background: var(--black); color: var(--on-dark); padding: clamp(2.5rem, 5vw, 4rem) 0 clamp(3.5rem, 6vw, 5rem); }
.tr-hero__bg { position: absolute; inset: 0; z-index: -2; object-position: 50% 40%; }
.tr-hero::before { content: ""; position: absolute; inset: 0; z-index: -1; background: linear-gradient(90deg, rgba(10, 37, 64, .95) 0%, rgba(10, 37, 64, .82) 48%, rgba(10, 37, 64, .45) 100%); }
.tr-hero h1 { color: #fff; max-width: 13ch; }
.tr-hero .ix-hero__lede { color: var(--on-dark); }
.tr-hero__grid { display: grid; gap: 3rem; align-items: end; }
@media (min-width: 992px) { .tr-hero__grid { grid-template-columns: minmax(0, 7fr) minmax(0, 4fr); gap: 5rem; min-height: clamp(580px, 74vh, 760px); align-content: end; } }

/* Offer: a curriculum path — framed classroom photo beside a vertical track; static, no hover */
.tr-offer__grid { display: grid; gap: clamp(3rem, 6vw, 5rem); align-items: start; }
.tr-offer__head h2 { margin: 0 0 clamp(2rem, 4vw, 2.75rem); }
.tr-offer__photo { position: relative; margin: 0 1.25rem 1.25rem 0; aspect-ratio: 4 / 3.2; }
.tr-offer__photo::before { content: ""; position: absolute; z-index: 0; inset: 1.25rem -1.25rem -1.25rem 1.25rem; border-radius: var(--ix-radius); background: var(--black);
  background-image: repeating-linear-gradient(135deg, rgba(79, 195, 181, .14) 0 1px, transparent 1px 14px); }
.tr-offer__photo::after { content: ""; position: absolute; z-index: 2; left: -10px; top: -10px; width: 64px; height: 64px; border-left: 3px solid var(--brand-2); border-top: 3px solid var(--brand-2); border-top-left-radius: 10px; }
.tr-offer__photo img { position: relative; z-index: 1; width: 100%; height: 100%; object-fit: cover; border-radius: var(--ix-radius); }
@media (max-width: 575.98px) { .tr-offer__photo { margin: 6px 1rem 1rem 6px; } .tr-offer__photo::before { inset: 1rem -1rem -1rem 1rem; } .tr-offer__photo::after { left: -6px; top: -6px; width: 52px; height: 52px; } }

.tr-courses { position: relative; display: grid; gap: 0; margin: 0; padding: 0; list-style: none; counter-reset: mod; }
.tr-courses::before { content: ""; position: absolute; left: 31px; top: 32px; bottom: 32px; width: 2px; background: linear-gradient(180deg, var(--primary-2), var(--brand-2)); opacity: .45; }
.tr-course { counter-increment: mod; position: relative; display: grid; grid-template-columns: 64px 1fr; grid-template-rows: auto auto; column-gap: clamp(1.25rem, 3vw, 2rem); row-gap: .3rem; align-items: center;
  padding: clamp(1rem, 2vw, 1.4rem) 0; color: var(--black); }
.tr-course::before { content: counter(mod, decimal-leading-zero); grid-column: 2; grid-row: 1; align-self: end; }
.tr-course .ix-ico { position: relative; z-index: 1; grid-column: 1; grid-row: 1 / 3; width: 64px; height: 64px; border-radius: 50%; background: #fff; border: 1px solid var(--line); color: var(--primary); box-shadow: 0 0 0 6px var(--surface); }
.tr-course .ix-ico .icon { width: 34px; height: 34px; }
.tr-course:first-child .ix-ico { background: var(--primary); border-color: var(--primary); color: #fff; }
.tr-course:last-child .ix-ico { background: var(--brand-2); border-color: var(--brand-2); color: #fff; }
@media (min-width: 992px) {
  .tr-offer__grid { grid-template-columns: minmax(0, 5fr) minmax(0, 6fr); gap: clamp(4rem, 7vw, 7rem); }
  .tr-offer__aside { position: sticky; top: 120px; }
}

.tr-impact { display: grid; gap: 3rem clamp(3rem, 7vw, 7rem); align-items: center; }
.tr-impact__photo { aspect-ratio: 7 / 5.4; }
@media (min-width: 992px) { .tr-impact { grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); } .tr-impact__photo { margin-left: calc(-1 * var(--bleed)); border-radius: 0 var(--ix-radius) var(--ix-radius) 0; } }

.tr-band { background: #fff; }

/* Intro: circular bootcamp photo on an orbit with learning chips | statement + a "journey" track over the note */
.tr-story { position: relative; overflow: hidden; isolation: isolate; }
.tr-story::before { content: ""; position: absolute; z-index: -1; inset: 0; background: radial-gradient(circle at 18% 50%, rgba(7, 87, 154, .07), transparent 42%); pointer-events: none; }
.tr-story__grid { display: grid; gap: clamp(3rem, 6vw, 5rem); align-items: center; }
@media (min-width: 992px) { .tr-story__grid { grid-template-columns: minmax(0, 5fr) minmax(0, 6fr); gap: clamp(4rem, 7vw, 7rem); } }

.tr-orbit { position: relative; width: min(100%, 480px); aspect-ratio: 1; margin: 0 auto; }
.tr-orbit__ring { position: absolute; inset: 0; border-radius: 50%; border: 1.5px dashed rgba(7, 87, 154, .28); }
.tr-orbit__ring--outer { inset: -6%; border: 1px solid var(--line); }
.tr-orbit__photo { position: absolute; inset: 9%; margin: 0; border-radius: 50%; overflow: hidden; box-shadow: 0 0 0 10px #fff, 0 30px 60px -24px rgba(10, 37, 64, .45); }
.tr-orbit__photo img { width: 100%; height: 100%; object-fit: cover; }
.tr-orbit__photo::after { content: ""; position: absolute; inset: 0; background: linear-gradient(200deg, rgba(10, 37, 64, 0) 45%, rgba(7, 87, 154, .35)); }
.tr-orbit__chip { position: absolute; display: grid; place-items: center; width: 64px; height: 64px; margin: -32px 0 0 -32px; border-radius: 50%; box-shadow: 0 0 0 6px #fff, 0 14px 28px -10px rgba(10, 37, 64, .35); }
.tr-orbit__chip .icon { width: 26px; height: 26px; }
/* positions on the dashed ring (r = 50%) */
.tr-orbit__chip--a { left: 14.6%; top: 14.6%; background: var(--primary); color: #fff; }
.tr-orbit__chip--b { left: 100%; top: 50%; background: #fff; color: var(--primary); border: 1px solid var(--line); }
.tr-orbit__chip--c { left: 25%; top: 93.3%; background: var(--brand-2-ink); color: #fff; }
.tr-orbit__dot { position: absolute; width: 14px; height: 14px; margin: -7px 0 0 -7px; border-radius: 50%; background: #4FC3B5; box-shadow: 0 0 0 5px rgba(79, 195, 181, .2); }
.tr-orbit__dot--a { left: 85.4%; top: 14.6%; }
.tr-orbit__dot--b { left: 0; top: 50%; width: 10px; height: 10px; margin: -5px 0 0 -5px; background: var(--primary-2); box-shadow: 0 0 0 5px rgba(31, 109, 174, .15); }

.tr-story__copy .ix-lead { max-width: 60ch; margin: 0; }
.tr-story__note { margin-top: clamp(2rem, 4vw, 2.75rem); padding: 1.75rem 0 0; border-top: 1px solid var(--line); }
.tr-story__note p { margin: 0; color: var(--text); }
.tr-path { position: relative; display: flex; justify-content: space-between; width: min(100%, 260px); margin: 0 0 1.5rem; }
.tr-path::before { content: ""; position: absolute; left: 6px; right: 6px; top: 50%; height: 2px; transform: translateY(-50%); background: linear-gradient(90deg, var(--line), var(--brand-2)); }
.tr-path i { position: relative; width: 12px; height: 12px; border-radius: 50%; background: #fff; border: 2px solid var(--primary-2); }
.tr-path i:nth-child(2) { border-color: var(--primary); }
.tr-path i:nth-child(3) { border-color: var(--brand-2); }
.tr-path i:last-child { width: 18px; height: 18px; margin-top: -3px; background: var(--brand-2); border-color: var(--brand-2); box-shadow: 0 0 0 5px rgba(26, 154, 140, .15); }
@media (max-width: 575.98px) {
  .tr-orbit { width: min(100%, 300px); }
  .tr-orbit__chip { width: 50px; height: 50px; margin: -25px 0 0 -25px; }
  .tr-orbit__chip .icon { width: 20px; height: 20px; }
  .tr-orbit__chip--b { left: 96%; }
}

/* ---------- 8. Business Registration — "certificate & seal": security-paper rings, stacked documents, official seal ---------- */
.ix--reg { --pg-bg: var(--surface); --pg-accent: var(--primary); --pg-accent-ink: var(--primary); --pg-line: var(--line);
  --reg-rings: repeating-radial-gradient(circle, transparent 0 22px, rgba(7, 87, 154, .07) 22px 23px); }

/* hero — surface with guilloche rings behind a stack of documents */
.reg-hero { position: relative; overflow: hidden; isolation: isolate; background: var(--surface); padding: clamp(2.5rem, 5vw, 4rem) 0 clamp(4rem, 7vw, 6rem); }
.reg-hero::before { content: ""; position: absolute; z-index: -1; width: 1100px; height: 1100px; right: -380px; top: 50%; transform: translateY(-50%); border-radius: 50%;
  background: var(--reg-rings); -webkit-mask: radial-gradient(circle, #000 30%, transparent 70%); mask: radial-gradient(circle, #000 30%, transparent 70%); }
.reg-hero__grid { display: grid; gap: 3.5rem; align-items: center; }
.reg-hero h1 { max-width: 15ch; }
@media (min-width: 992px) { .reg-hero__grid { grid-template-columns: minmax(0, 7fr) minmax(0, 5fr); gap: clamp(3rem, 6vw, 5.5rem); } }

.reg-doc { position: relative; width: min(100%, 470px); margin: 0 auto; padding: 1.5rem 1.5rem 2.5rem; }
.reg-doc__sheet, .reg-doc__front { display: block; border-radius: var(--radius-sm, 10px); background: #fff; border: 1px solid var(--line); }
.reg-doc__sheet { position: absolute; inset: 1.5rem 1.5rem 2.5rem; }
.reg-doc__sheet--back { transform: rotate(-9deg) translate(-26px, 10px); background: var(--primary); border-color: var(--primary); opacity: .9; }
.reg-doc__sheet--mid { transform: rotate(5deg) translate(20px, 4px); background: #4FC3B5; border-color: #4FC3B5; }
.reg-doc__front { position: relative; transform: rotate(-1.5deg); padding: 16px 16px 2rem; box-shadow: 0 30px 60px -28px rgba(10, 37, 64, .35); }
.reg-doc__front::before { content: ""; position: absolute; inset: 6px; border: 1px solid var(--line); border-radius: 6px; pointer-events: none; }
.reg-doc__photo { margin: 0; aspect-ratio: 1 / .8; overflow: hidden; border-radius: 6px; }
.reg-doc__photo img { width: 100%; height: 100%; object-fit: cover; }
.reg-doc__lines { display: grid; gap: 9px; padding: 1.4rem .5rem 0; }
.reg-doc__lines i { display: block; height: 7px; border-radius: 4px; background: var(--surface); }
.reg-doc__lines i:first-child { width: 72%; height: 9px; background: var(--line); }
.reg-doc__lines i:last-child { width: 46%; }
.reg-doc__sign { display: block; width: 38%; margin: 1.4rem .5rem 0; border-top: 1.5px solid var(--black); }
@media (max-width: 575.98px) { .reg-doc { width: 86%; } .reg-doc__sheet--back { transform: rotate(-7deg) translate(-14px, 8px); } .reg-doc__sheet--mid { transform: rotate(4deg) translate(12px, 4px); } }
.reg-seal { position: absolute; right: -4px; bottom: 0; width: 112px; height: 112px; border-radius: 50%; display: grid; place-items: center;
  background: repeating-conic-gradient(var(--primary) 0 6deg, var(--primary-2) 6deg 12deg); transform: rotate(-12deg);
  box-shadow: 0 14px 30px -10px rgba(7, 87, 154, .55); }
.reg-seal::before { content: ""; position: absolute; inset: 9px; border-radius: 50%; border: 1.5px dashed rgba(255, 255, 255, .55); }
.reg-seal__core { width: 62px; height: 62px; border-radius: 50%; display: grid; place-items: center; background: #fff; color: var(--primary); }
.reg-seal__core .icon { width: 28px; height: 28px; }

/* intro — statement left, structures on the right with highlighted names */
.reg-intro__grid { display: grid; gap: clamp(2.5rem, 5vw, 3rem); align-items: center; }
.reg-intro__main .ix-lead { max-width: 60ch; margin: 0; }
/* a small step trail: consult → file → stamp → done */
.reg-intro__trail { display: flex; align-items: center; gap: .6rem; margin-top: clamp(1.75rem, 3vw, 2.25rem); }
.reg-intro__trail span { display: grid; place-items: center; width: 40px; height: 40px; flex: none; border-radius: 50%; background: #fff; border: 1px solid var(--line); color: var(--primary); }
.reg-intro__trail span .icon { width: 18px; height: 18px; }
.reg-intro__trail span.is-done { background: var(--brand-2); border-color: var(--brand-2); color: #fff; }
.reg-intro__trail i { flex: 0 1 44px; height: 2px; background: repeating-linear-gradient(90deg, var(--brand-2) 0 5px, transparent 5px 9px); opacity: .6; }
/* the structures, set as an application form on navy */
.reg-form { position: relative; overflow: hidden; isolation: isolate; border-radius: var(--ix-radius); background: var(--black); color: rgba(255, 255, 255, .86); box-shadow: 0 30px 60px -30px rgba(10, 37, 64, .55); }
.reg-form::before { content: ""; position: absolute; z-index: -1; inset: 0; background: radial-gradient(circle, rgba(255, 255, 255, .07) 1px, transparent 1.2px) 0 0 / 16px 16px; }
.reg-form::after { content: ""; position: absolute; z-index: -1; right: -90px; bottom: -90px; width: 260px; height: 260px; border-radius: 50%; background: repeating-radial-gradient(circle, transparent 0 16px, rgba(79, 195, 181, .12) 16px 17px); }
.reg-form__bar { display: flex; align-items: center; gap: 6px; padding: .9rem 1.25rem; border-bottom: 1px solid rgba(255, 255, 255, .1); }
.reg-form__bar i { width: 9px; height: 9px; border-radius: 50%; background: rgba(255, 255, 255, .22); }
.reg-form__bar i:first-child { background: #4FC3B5; }
.reg-form__ico { margin-left: auto; display: grid; place-items: center; width: 34px; height: 34px; border-radius: 50%; background: rgba(79, 195, 181, .14); color: #4FC3B5; }
.reg-form__ico .icon { width: 16px; height: 16px; }
.reg-form p { margin: 0; padding: clamp(1.5rem, 3vw, 2rem) clamp(1.5rem, 3vw, 2rem) 0; font-size: var(--font-body); line-height: 2.1; color: rgba(255, 255, 255, .82); }
.reg-form b { display: inline-flex; align-items: center; gap: .35rem; padding: .05rem .6rem .05rem .45rem; margin: 0 .05rem; border-radius: 999px; font-weight: 500; line-height: 1.6;
  color: #fff; background: rgba(79, 195, 181, .14); border: 1px solid rgba(79, 195, 181, .35); }
.reg-form b::before { content: ""; width: 7px; height: 7px; border-radius: 50%; background: #4FC3B5; }
.reg-form__foot { display: flex; align-items: center; gap: 1rem; padding: 1.5rem clamp(1.5rem, 3vw, 2rem) clamp(1.5rem, 3vw, 2rem); }
.reg-form__track { flex: 1; height: 6px; border-radius: 3px; background: rgba(255, 255, 255, .1); overflow: hidden; }
.reg-form__track i { display: block; width: 100%; height: 100%; border-radius: 3px; background: linear-gradient(90deg, var(--primary-2), #4FC3B5); }
.reg-form__ok { display: grid; place-items: center; width: 34px; height: 34px; border-radius: 50%; background: #4FC3B5; color: var(--black); }
.reg-form__ok .icon { width: 18px; height: 18px; stroke-width: 2.6; }
@media (min-width: 992px) { .reg-intro__grid { grid-template-columns: minmax(0, 6fr) minmax(0, 5fr); gap: clamp(3rem, 6vw, 5rem); } }

/* offer — navy register sheet: a 3 × 2 ledger on hairlines, outlined serials, a giant seal mark */
/* Offer — minimal: heading and the digital-registration photo on the left; the six services as a clean numbered index on the right */
.reg-offer { position: relative; overflow: hidden; padding: var(--sec-y) 0; background: var(--black); color: #fff; }
.reg-offer__grid { display: grid; gap: clamp(2.5rem, 5vw, 3.5rem); align-items: center; }
.reg-offer__aside h2 { margin: 0 0 clamp(1.5rem, 3vw, 2rem); color: #fff; }
.reg-offer__photo { margin: 0; aspect-ratio: 736 / 414; overflow: hidden; border-radius: 18px; }
.reg-offer__photo img { width: 100%; height: 100%; object-fit: cover; }
.reg-list { margin: 0; padding: 0; list-style: none; counter-reset: reg; border-top: 1px solid rgba(255, 255, 255, .14); }
.reg-list li { counter-increment: reg; display: grid; grid-template-columns: 3rem 1fr; align-items: baseline; gap: 1rem; padding: 1.15rem 0; border-bottom: 1px solid rgba(255, 255, 255, .14); color: #fff; }
.reg-list li::before { content: counter(reg, decimal-leading-zero); font-size: .85rem; font-weight: 600; color: #4FC3B5; letter-spacing: .02em; }
.ix .reg-list li[data-reveal].is-visible::before { transform: none; }
@media (min-width: 992px) { .reg-offer__grid { grid-template-columns: minmax(0, 5fr) minmax(0, 6fr); gap: clamp(3.5rem, 6vw, 6rem); } }

/* impact — rosette emblem beside the statement */
/* impact — presented as an issued certificate: guilloche rings behind, double-ruled paper, corner ornaments, crest, signature lines and a ribboned seal */
.reg-key { position: relative; overflow: hidden; isolation: isolate; padding: clamp(3rem, 5vw, 4.5rem) 0; }
.reg-key::before { content: ""; position: absolute; z-index: -1; inset: 0; background: var(--reg-rings) 50% 50% / auto;
  -webkit-mask: radial-gradient(ellipse at 50% 50%, #000 20%, transparent 70%); mask: radial-gradient(ellipse at 50% 50%, #000 20%, transparent 70%); }
.reg-cert { position: relative; max-width: 860px; margin: 0 auto; padding: clamp(2.25rem, 4vw, 2.75rem) clamp(1.5rem, 6vw, 4.5rem) clamp(3.25rem, 5vw, 3.75rem); text-align: center; background: #fff;
  border: 1px solid var(--line); border-radius: 4px; box-shadow: 0 40px 80px -40px rgba(10, 37, 64, .35); }
.reg-cert::before { content: ""; position: absolute; inset: 12px; border: 2px solid var(--primary); border-radius: 2px; pointer-events: none; }
.reg-cert::after { content: ""; position: absolute; inset: 18px; border: 1px solid rgba(7, 87, 154, .25); pointer-events: none;
  background: repeating-radial-gradient(circle at 50% 120%, transparent 0 18px, rgba(26, 154, 140, .05) 18px 19px); }
.reg-cert > * { position: relative; z-index: 1; }
.reg-cert__corner { position: absolute; z-index: 1; width: 26px; height: 26px; border: 3px solid var(--brand-2); }
.reg-cert__corner--tl { left: 26px; top: 26px; border-right: 0; border-bottom: 0; }
.reg-cert__corner--tr { right: 26px; top: 26px; border-left: 0; border-bottom: 0; }
.reg-cert__corner--bl { left: 26px; bottom: 26px; border-right: 0; border-top: 0; }
.reg-cert__corner--br { right: 26px; bottom: 26px; border-left: 0; border-top: 0; }
.reg-cert__crest { display: grid; place-items: center; width: 44px; height: 44px; margin: 0 auto .85rem; border-radius: 50%; background: rgba(7, 87, 154, .08); color: var(--primary); }
.reg-cert__crest .icon { width: 20px; height: 20px; }
.reg-key .ix-quote { max-width: none; }
.reg-key .ix-quote__label { display: flex; align-items: center; justify-content: center; gap: 1rem; color: var(--brand-2-ink); }
.reg-key .ix-quote__label::before, .reg-key .ix-quote__label::after { content: ""; width: 48px; height: 1px; background: var(--brand-2); }
.reg-key .ix-quote blockquote p { font-size: clamp(1.1rem, 2vw, 1.4rem); font-weight: 500; line-height: 1.45; letter-spacing: -0.015em; max-width: 44ch; margin-inline: auto; }
.reg-cert__foot { display: grid; grid-template-columns: 1fr auto 1fr; align-items: end; gap: clamp(1rem, 4vw, 3rem); max-width: 560px; margin: clamp(1.25rem, 3vw, 1.75rem) auto 0; }
.reg-cert__sign { display: grid; gap: 8px; padding-bottom: 6px; }
.reg-cert__sign i { display: block; height: 1.5px; background: var(--black); opacity: .7; }
.reg-cert__sign i + i { width: 60%; height: 6px; margin-inline: auto; border-radius: 3px; background: var(--surface); opacity: 1; }
.reg-cert__seal { position: relative; display: grid; place-items: center; width: 80px; height: 80px; border-radius: 50%; background: repeating-conic-gradient(var(--primary) 0 6deg, var(--primary-2) 6deg 12deg);
  box-shadow: 0 14px 30px -10px rgba(7, 87, 154, .55); }
.reg-cert__seal::before { content: ""; position: absolute; inset: 8px; border-radius: 50%; border: 1.5px dashed rgba(255, 255, 255, .6); }
.reg-cert__seal::after { content: ""; position: absolute; z-index: -1; left: 50%; top: 70%; width: 46px; height: 46px; transform: translateX(-50%);
  background: linear-gradient(90deg, var(--brand-2) 0 45%, transparent 45% 55%, var(--brand-2-ink) 55%); clip-path: polygon(0 0, 100% 0, 100% 100%, 75% 82%, 55% 100%, 45% 100%, 25% 82%, 0 100%); }
.reg-cert__seal-core { display: grid; place-items: center; width: 44px; height: 44px; border-radius: 50%; background: #fff; color: var(--primary); }
.reg-cert__seal-core .icon { width: 22px; height: 22px; stroke-width: 2.4; }
@media (max-width: 575.98px) { .reg-cert__corner { width: 22px; height: 22px; } .reg-cert__seal { width: 70px; height: 70px; } .reg-cert__seal-core { width: 40px; height: 40px; } .reg-key .ix-quote__label::before, .reg-key .ix-quote__label::after { width: 24px; } }

/* CTA — blue certificate panel with rings and a perforated edge */
.reg-band { background: #fff; }
.reg-cta { position: relative; overflow: hidden; isolation: isolate; padding: clamp(2.5rem, 5vw, 4rem) clamp(1.5rem, 5vw, 4rem); border-radius: var(--ix-radius, 18px);
  background: linear-gradient(120deg, var(--primary) 0%, var(--black-2) 100%); color: #fff; }
.reg-cta::before { content: ""; position: absolute; z-index: -1; width: 700px; height: 700px; right: -260px; top: 50%; transform: translateY(-50%); border-radius: 50%;
  background: repeating-radial-gradient(circle, transparent 0 18px, rgba(255, 255, 255, .08) 18px 19px);
  -webkit-mask: radial-gradient(circle, #000 25%, transparent 70%); mask: radial-gradient(circle, #000 25%, transparent 70%); }
.reg-cta::after { content: ""; position: absolute; left: 0; right: 0; top: 0; height: 4px; background: linear-gradient(90deg, #4FC3B5, var(--brand-2)); }
.reg-cta h2 { color: #fff; }
.reg-band .reg-cta p { color: rgba(255, 255, 255, .82); }
.reg-cta .ix-ico--solid { background: #fff; color: var(--primary); }
.reg-cta .btn--light { background: transparent; color: #fff; border-color: rgba(255, 255, 255, .5); }
.reg-cta .btn--light:hover { color: #fff; }

/* ---------- 9. Compliance — calm split with a document illustration ---------- */
.ix--comp { --pg-bg: var(--surface); --pg-accent: #1A9A8C; --pg-accent-ink: #157E73; --pg-line: var(--line); }
/* Hero — copy on the left; the legal-desk photo fills the right side top to bottom, with a navy "compliance margin" of ticks running down its edge */
.cp-hero { position: relative; overflow: hidden; isolation: isolate; background: var(--pg-bg); }
.cp-hero h1 { max-width: 13ch; }
.cp-hero__copy { padding: clamp(2.5rem, 5vw, 3.5rem) 0 clamp(3rem, 6vw, 4rem); }
.cp-hero__photo { margin: 0; height: 340px; overflow: hidden; }
.cp-hero__photo img { width: 100%; height: 100%; object-fit: cover; object-position: 50% 40%; }
.cp-hero__margin { display: none; }
@media (min-width: 992px) {
  .cp-hero { min-height: clamp(600px, 76vh, 740px); display: flex; align-items: center; }
  .cp-hero > .container { width: 100%; }
  .cp-hero__copy { width: 52%; padding: clamp(3rem, 6vw, 4.5rem) 0; }
  .cp-hero__photo { position: absolute; top: 0; right: 0; bottom: 0; width: 40%; height: auto; border-radius: 0 0 0 180px; }
  .cp-hero__photo::after { content: ""; position: absolute; inset: 0; background: linear-gradient(90deg, rgba(10, 37, 64, .25), transparent 40%); }
  .cp-hero__margin { position: absolute; z-index: 2; top: 50%; right: calc(40% - 30px); transform: translateY(-50%); display: grid; gap: 14px; padding: 18px 14px; border-radius: 999px; background: var(--black); box-shadow: 0 24px 48px -20px rgba(10, 37, 64, .6); }
  .cp-hero__margin span { display: grid; place-items: center; width: 32px; height: 32px; border-radius: 50%; background: var(--brand-2); color: #fff; }
  .cp-hero__margin span .icon { width: 16px; height: 16px; stroke-width: 2.6; }
  .cp-hero__margin span.is-open { background: transparent; border: 1.5px dashed rgba(255, 255, 255, .45); }
}

/* Intro: shield-cut photo on a layered shield stack | statement + a guarded note */
.cp-story { position: relative; overflow: hidden; isolation: isolate; }
.cp-story__grid { display: grid; gap: clamp(3rem, 6vw, 4.5rem); align-items: center; }
@media (min-width: 992px) { .cp-story__grid { grid-template-columns: minmax(0, 5fr) minmax(0, 6fr); gap: clamp(4rem, 7vw, 7rem); } }

.cp-shield { position: relative; width: min(100%, 440px); margin: 0 auto; }
.cp-shield::before { content: ""; position: absolute; z-index: -1; inset: 8% -6% 4% -6%; border-radius: 50%;
  background: radial-gradient(circle, rgba(26, 154, 140, .12) 1.5px, transparent 1.6px) 0 0 / 18px 18px;
  -webkit-mask: radial-gradient(closest-side, #000 40%, transparent); mask: radial-gradient(closest-side, #000 40%, transparent); }
.cp-shield svg { display: block; width: 100%; height: auto; overflow: visible; }
.cp-shield__back { fill: var(--black); }
.cp-shield__line { fill: rgba(79, 195, 181, .22); }
.cp-shield__outline { fill: none; stroke: var(--brand-2); stroke-width: 2; stroke-dasharray: 7 7; }
.cp-shield__rim { fill: none; stroke: #fff; stroke-width: 8; }
.cp-shield__badge { position: absolute; left: 6%; top: 66%; display: grid; place-items: center; width: 76px; height: 76px; border-radius: 50%;
  background: var(--brand-2); color: #fff; box-shadow: 0 0 0 8px #fff, 0 18px 34px -12px rgba(21, 126, 115, .6); }
.cp-shield__badge .icon { width: 32px; height: 32px; stroke-width: 2.4; }
.cp-shield__dot { position: absolute; right: 4%; top: 12%; width: 16px; height: 16px; border-radius: 50%; background: var(--primary); box-shadow: 0 0 0 6px rgba(7, 87, 154, .14); }

.cp-story__copy .ix-lead { max-width: 60ch; margin: 0; }
.cp-story__note { display: grid; grid-template-columns: 56px 1fr; gap: 1.25rem; align-items: start; margin-top: clamp(2rem, 4vw, 2.75rem); padding-top: 1.75rem; border-top: 1px solid var(--line); }
.cp-story__ico { display: grid; place-items: center; width: 56px; height: 56px; border-radius: 50%; background: var(--black); color: #4FC3B5; }
.cp-story__ico .icon { width: 24px; height: 24px; }
.cp-story__note p { margin: 0; color: var(--text); font-size: var(--font-body); line-height: 1.65; }
@media (max-width: 575.98px) {
  .cp-shield__badge { width: 58px; height: 58px; box-shadow: 0 0 0 6px #fff; }
  .cp-shield__badge .icon { width: 24px; height: 24px; }
}

/* Offer — a compliance register: navy side panel (heading, shield, ten-tick meter) | compact two-column checklist; static */
.cp-doc { display: grid; overflow: hidden; border-radius: var(--ix-radius); background: #fff; border: 1px solid var(--line); box-shadow: 0 30px 60px -36px rgba(10, 37, 64, .4); }
.cp-doc__head { position: relative; overflow: hidden; isolation: isolate; display: grid; gap: 1.5rem; justify-items: start; align-content: center; padding: clamp(2rem, 4vw, 2.75rem);
  background: linear-gradient(160deg, var(--black) 0%, var(--black-2) 100%); }
.cp-doc__head::before { content: ""; position: absolute; z-index: -1; right: -110px; bottom: -110px; width: 300px; height: 300px; border-radius: 50%;
  background: repeating-radial-gradient(circle, transparent 0 16px, rgba(79, 195, 181, .12) 16px 17px); }
.cp-doc__head h2 { margin: 0; color: #fff; }
.cp-doc__emblem { position: relative; display: grid; place-items: center; width: 76px; height: 76px; border-radius: 50%; background: var(--brand-2); color: #fff; box-shadow: 0 0 0 8px rgba(79, 195, 181, .14); }
.cp-doc__emblem::after { content: ""; position: absolute; inset: -16px; border-radius: 50%; border: 1px dashed rgba(79, 195, 181, .45); }
.cp-doc__emblem .icon { width: 32px; height: 32px; }
.cp-doc__meter { display: flex; gap: 5px; }
.cp-doc__meter i { width: 16px; height: 6px; border-radius: 3px; background: #4FC3B5; }
.cp-doc__meter i:nth-child(n+6) { background: var(--primary-2); }
.cp-list { display: grid; margin: 0; padding: clamp(1.25rem, 3vw, 2rem) clamp(1.5rem, 3vw, 2.5rem); list-style: none; column-gap: 2.5rem; align-content: center; }
.cp-list li { display: flex; gap: .75rem; align-items: center; padding: .85rem 0; border-bottom: 1px dashed var(--line); color: var(--black); }
.cp-list li:last-child { border-bottom: 0; }
.cp-list .icon { flex: none; width: 24px; height: 24px; padding: 4px; border-radius: 50%; background: rgba(26, 154, 140, .12); color: var(--brand-2-ink); stroke-width: 2.6; margin: 0; }
@media (min-width: 768px) {
  .cp-list { grid-template-columns: 1fr 1fr; }
  .cp-list li:nth-last-child(2):nth-child(odd) { border-bottom: 0; }
}
@media (min-width: 992px) { .cp-doc { grid-template-columns: minmax(260px, 4fr) minmax(0, 9fr); } .cp-doc__head { padding: 2.75rem; } }

.cp-impact { display: grid; gap: 1.5rem 3rem; max-width: 1040px; }
.cp-impact__mark { color: var(--brand-2); }
.cp-impact__mark .icon { width: 56px; height: 56px; stroke-width: 1.2; }
@media (min-width: 768px) { .cp-impact { grid-template-columns: auto 1fr; } }
.cp-band { background: #fff; }
.cp-band p { color: var(--muted); }

/* ---------- 10. Funding Readiness — split with a growth chart, horizontal flow ---------- */
.ix--fund { --pg-bg: rgba(26, 154, 140, .07); --pg-accent: #1A9A8C; --pg-accent-ink: var(--brand-2-ink); --pg-line: var(--line); }
.fd-hero { background: linear-gradient(135deg, rgba(26, 154, 140, .07) 0%, var(--surface-2) 100%); padding: clamp(2.5rem, 5vw, 4rem) 0 clamp(3.5rem, 6vw, 5rem); overflow: hidden; }
.fd-hero__grid { display: grid; gap: 3.5rem; align-items: center; }
.fd-hero h1 { max-width: 13ch; }
.fd-board { max-width: 480px; width: 100%; margin-inline: auto; }
.fd-bars { display: grid; grid-template-columns: repeat(6, 1fr); grid-template-rows: 100%; align-items: end; gap: 1rem; height: 340px; border-bottom: 2px solid var(--black); background: repeating-linear-gradient(0deg, transparent 0 55px, rgba(10, 37, 64, .08) 55px 56px); }
.fd-bars i { display: block; height: var(--h); border-radius: 4px 4px 0 0; background: linear-gradient(180deg, var(--brand-2), #4FC3B5); transform-origin: bottom; animation: fd-grow 1.1s var(--ease) both; }
.fd-bars i:nth-child(2) { animation-delay: .08s; } .fd-bars i:nth-child(3) { animation-delay: .16s; } .fd-bars i:nth-child(4) { animation-delay: .24s; } .fd-bars i:nth-child(5) { animation-delay: .32s; }
.fd-bars i:nth-child(6) { animation-delay: .4s; background: linear-gradient(180deg, var(--primary), var(--primary-2)); }
@keyframes fd-grow { from { transform: scaleY(0); } to { transform: scaleY(1); } }
@media (min-width: 992px) { .fd-hero__grid { grid-template-columns: minmax(0, 6fr) minmax(0, 5fr); gap: 6rem; min-height: clamp(580px, 74vh, 760px); } }

.fd-note { display: flex; gap: 1rem; align-items: flex-start; margin-top: 2.6rem; padding: 1rem 1.25rem; border: 1px solid var(--line); border-left: 3px solid var(--primary); border-radius: var(--radius-sm); background: var(--surface); }
.fd-note .icon { width: 22px; height: 22px; color: var(--black); flex: none; margin-top: .15rem; }
.fd-note p { margin: 0; color: var(--text); }
.fd-note strong { color: var(--ink); }
@media (max-width: 991.98px) { .fd-note { margin-top: 0; } }

.fd-files { position: relative; display: grid; }
.fd-file { position: relative; display: grid; grid-template-columns: 56px 1fr; gap: 1.25rem; align-items: center; padding: 0 0 2rem; color: var(--black); }
.fd-file .ix-ico { width: 56px; height: 56px; border-radius: 50%; background: #fff; border: 1px solid var(--pg-line); position: relative; z-index: 1; transition: background .3s, color .3s; }
.fd-file .ix-ico .icon { width: 22px; height: 22px; }
.fd-file:hover .ix-ico { background: var(--brand-2-ink); color: #fff; border-color: var(--brand-2-ink); }
.fd-file::after { content: ""; position: absolute; left: 27px; top: 56px; bottom: 0; width: 2px; background: var(--pg-line); }
.fd-file:last-child::after { display: none; }
@media (min-width: 992px) {
  .fd-files { grid-template-columns: repeat(6, 1fr); gap: 1.5rem; }
  .fd-files::before { content: ""; position: absolute; left: 28px; right: 28px; top: 27px; height: 2px; background: repeating-linear-gradient(90deg, var(--brand-2) 0 6px, transparent 6px 12px); opacity: .6; }
  .fd-file { grid-template-columns: 1fr; padding: 0; align-items: start; }
  .fd-file::after { display: none; }
}

/* Impact: statement over a rising trend line, framed photo with growth chips */
.fd-proof { position: relative; overflow: hidden; isolation: isolate; }
.fd-proof__trend { position: absolute; z-index: -1; left: 0; bottom: 0; width: 100%; height: 62%; pointer-events: none; }
.fd-proof__line { fill: none; stroke: var(--primary-2); stroke-width: 2; stroke-dasharray: 6 6; vector-effect: non-scaling-stroke; opacity: .55; }
.fd-proof__grid { display: grid; gap: clamp(3rem, 6vw, 4rem); align-items: center; }
@media (min-width: 992px) { .fd-proof__grid { grid-template-columns: minmax(0, 7fr) minmax(0, 4fr); gap: clamp(4rem, 8vw, 8rem); } }
.fd-proof__mark { display: grid; place-items: center; width: 64px; height: 64px; margin-bottom: 1.75rem; border-radius: 50%; background: var(--black); color: #4FC3B5; }
.fd-proof__mark .icon { width: 28px; height: 28px; }
.fd-proof .ix-quote { max-width: none; padding-left: clamp(1.25rem, 3vw, 2rem); border-left: 3px solid var(--brand-2); }
.fd-proof .ix-quote__label { color: var(--brand-2-ink); }

.fd-proof__media { position: relative; width: min(100%, 360px); margin: 0 auto; padding: 0 1.5rem 1.5rem 0; }
.fd-proof__media::before { content: ""; position: absolute; inset: 1.5rem 0 0 1.5rem; border-radius: var(--ix-radius); background: linear-gradient(150deg, var(--primary), var(--black)); }
.fd-proof__photo { position: relative; margin: 0; aspect-ratio: 1; overflow: hidden; border-radius: var(--ix-radius); box-shadow: 0 24px 48px -20px rgba(10, 37, 64, .45); }
.fd-proof__photo img { width: 100%; height: 100%; object-fit: cover; }
.fd-proof__chip { position: absolute; display: grid; place-items: center; border-radius: 50%; box-shadow: 0 0 0 6px #fff, 0 14px 28px -10px rgba(10, 37, 64, .35); }
.fd-proof__chip--trend { left: -28px; top: 18%; width: 64px; height: 64px; background: var(--brand-2); color: #fff; }
.fd-proof__chip--trend .icon { width: 28px; height: 28px; stroke-width: 2.2; }
.fd-proof__chip--bars { right: -6px; bottom: -6px; width: 84px; height: 84px; background: #fff; display: flex; align-items: flex-end; justify-content: center; gap: 5px; padding-bottom: 24px; }
.fd-proof__chip--bars i { display: block; width: 8px; border-radius: 2px 2px 0 0; background: #4FC3B5; }
.fd-proof__chip--bars i:nth-child(1) { height: 12px; } .fd-proof__chip--bars i:nth-child(2) { height: 20px; }
.fd-proof__chip--bars i:nth-child(3) { height: 27px; } .fd-proof__chip--bars i:nth-child(4) { height: 36px; background: var(--primary); }
@media (max-width: 575.98px) { .fd-proof__media { width: min(100%, 300px); } .fd-proof__chip--trend { left: -14px; width: 52px; height: 52px; } .fd-proof__chip--bars { right: 0; bottom: 0; width: 68px; height: 68px; padding-bottom: 18px; } .fd-proof__trend { height: 40%; } }
.fd-band { background: linear-gradient(110deg, var(--black) 0 50%, var(--brand-2-ink) 100%); color: var(--on-dark); }
.fd-band h2 { color: #fff; }
.fd-band p { color: var(--on-dark); }

/* ---------- 11. Branding & Marketing — oversized type + colour blocks ---------- */
.ix--brand { --pg-bg: var(--surface-2); --pg-accent: #07579A; --pg-accent-ink: #07579A; --pg-line: var(--line); }
.br-hero { background: var(--pg-bg); padding: clamp(2.5rem, 5vw, 4rem) 0 clamp(3.5rem, 6vw, 5rem); overflow: hidden; }
.br-hero__grid { display: grid; gap: 3.5rem; align-items: center; }
.ix .br-hero h1 { max-width: 14ch; }
.br-blocks { display: grid; grid-template-columns: repeat(6, 1fr); grid-template-rows: repeat(6, minmax(0, 1fr)); gap: .75rem; aspect-ratio: 1; max-width: 460px; width: 100%; margin-inline: auto; }
.br-b1 { grid-column: 1 / 4; grid-row: 1 / 4; background: var(--black); display: flex; align-items: flex-end; padding: 1.25rem; color: #4FC3B5; }
.br-b1 .icon { width: 48px; height: 48px; stroke-width: 1.2; }
.br-b2 { grid-column: 4 / 7; grid-row: 1 / 3; background: var(--brand-2); border-radius: 0 0 0 999px; }
.br-b3 { grid-column: 4 / 7; grid-row: 3 / 7; border-radius: 0; }
.br-b4 { grid-column: 1 / 3; grid-row: 4 / 7; background: var(--primary); border-radius: 999px 999px 0 0; }
.br-b5 { grid-column: 3 / 4; grid-row: 4 / 7; background: repeating-linear-gradient(45deg, var(--black) 0 2px, transparent 2px 9px); opacity: .22; }
@media (min-width: 992px) { .br-hero__grid { grid-template-columns: minmax(0, 6fr) minmax(0, 5fr); gap: clamp(3rem, 6vw, 5.5rem); } }


/* Intro — statement + note | a fanned set of brand colour swatches (brand-guideline motif) */
.br-story { position: relative; overflow: hidden; isolation: isolate; }
.br-story__grid { display: grid; gap: clamp(3rem, 6vw, 4.5rem); align-items: center; }
@media (min-width: 992px) { .br-story__grid { grid-template-columns: minmax(0, 7fr) minmax(0, 5fr); gap: clamp(3rem, 7vw, 6rem); } }
.br-story .ix-lead { max-width: 60ch; margin: 0; }
.br-lead__big em { font-style: normal; color: var(--black); background: linear-gradient(transparent 64%, rgba(79, 195, 181, .4) 64%); padding: 0 .1em; }
.br-story__note { display: grid; grid-template-columns: 52px 1fr; gap: 1.25rem; align-items: start; margin-top: clamp(2rem, 4vw, 2.75rem); padding-top: 1.75rem; border-top: 1px solid var(--line); }
.br-story__ico { display: grid; place-items: center; width: 52px; height: 52px; border-radius: 50%; background: var(--primary); color: #fff; }
.br-story__ico .icon { width: 22px; height: 22px; }
.br-story__note p { margin: 0; color: var(--text); font-size: var(--font-body); line-height: 1.65; }

.br-fan { position: relative; width: min(100%, 420px); aspect-ratio: 1 / 1.05; margin: 0 auto; }
.br-fan::before { content: ""; position: absolute; z-index: -1; left: 50%; bottom: 4%; width: 92%; aspect-ratio: 1; transform: translateX(-50%); border-radius: 50%;
  background: radial-gradient(circle, rgba(7, 87, 154, .1) 1.5px, transparent 1.6px) 0 0 / 16px 16px; -webkit-mask: radial-gradient(closest-side, #000 40%, transparent); mask: radial-gradient(closest-side, #000 40%, transparent); }
.br-fan__chip { position: absolute; left: 50%; bottom: 8%; width: 30%; height: 78%; margin-left: -15%; transform-origin: 50% 92%; border-radius: 10px; background: #fff; border: 1px solid var(--line);
  box-shadow: 0 22px 40px -22px rgba(10, 37, 64, .45); overflow: hidden; display: flex; flex-direction: column; justify-content: flex-end; gap: 7px; padding: 0 12% 18%; }
.br-fan__chip::before { content: ""; position: absolute; left: 0; right: 0; top: 0; height: 62%; background: var(--chip); }
.br-fan__chip i { position: relative; display: block; height: 6px; border-radius: 3px; background: var(--line); }
.br-fan__chip i:first-child { width: 80%; height: 8px; background: var(--chip); opacity: .35; }
.br-fan__chip i:last-child { width: 55%; }
.br-fan__chip--1 { --chip: #4FC3B5; transform: rotate(-34deg); }
.br-fan__chip--2 { --chip: var(--brand-2); transform: rotate(-17deg); }
.br-fan__chip--3 { --chip: var(--primary-2); transform: rotate(0deg); }
.br-fan__chip--4 { --chip: var(--primary); transform: rotate(17deg); }
.br-fan__chip--5 { --chip: var(--black); transform: rotate(34deg); }
.br-fan__pin { position: absolute; left: 50%; bottom: calc(8% + 78% * .08); width: 18px; height: 18px; margin: 0 0 -9px -9px; border-radius: 50%; background: #fff; border: 4px solid var(--black); z-index: 2; }

@media (max-width: 575.98px) { .br-fan { width: min(100%, 250px); margin-block: 1rem; } }

/* Offer — a brand "spec sheet": logo-construction circle over the photo, services annotated with guide lines that meet its edge; static */
.br-spec { position: relative; overflow: hidden; isolation: isolate; }
.br-spec::before { content: ""; position: absolute; z-index: -1; inset: 0;
  background: linear-gradient(var(--line) 1px, transparent 1px) 0 0 / 40px 40px, linear-gradient(90deg, var(--line) 1px, transparent 1px) 0 0 / 40px 40px; opacity: .55;
  -webkit-mask: radial-gradient(ellipse at 35% 60%, #000 20%, transparent 70%); mask: radial-gradient(ellipse at 35% 60%, #000 20%, transparent 70%); }
.br-spec__grid { --d: 440px; --gap: 56px; display: grid; gap: 2.5rem; align-items: center; }
.br-spec__mark { position: relative; width: min(100%, 320px); aspect-ratio: 1; margin: 0 auto; }
.br-spec__photo { position: absolute; inset: 19%; margin: 0; border-radius: 50%; overflow: hidden; box-shadow: 0 0 0 8px #fff, 0 24px 50px -20px rgba(10, 37, 64, .5); }
.br-spec__photo img { width: 100%; height: 100%; object-fit: cover; }
.br-spec__photo::after { content: ""; position: absolute; inset: 0; background: linear-gradient(160deg, rgba(7, 87, 154, .1), rgba(10, 37, 64, .35)); }
.br-spec__guides { position: absolute; inset: 0; width: 100%; height: 100%; overflow: visible; }
.br-spec__guides .g-box { fill: none; stroke: var(--primary-2); stroke-width: 1; stroke-dasharray: 4 5; opacity: .6; }
.br-spec__guides .g-ring { fill: none; stroke: var(--brand-2); stroke-width: 1.5; stroke-dasharray: 2 6; }
.br-spec__guides .g-in { fill: none; stroke: var(--primary-2); stroke-width: 1; opacity: .35; }
.br-spec__guides .g-anchor { fill: #fff; stroke: var(--primary); stroke-width: 1.5; }
.br-spec__guides .g-anchor--on { fill: var(--brand-2); stroke: var(--brand-2); }
.br-spec__swatches { position: absolute; right: -6px; bottom: 9%; display: flex; padding: 6px; gap: 4px; background: #fff; border-radius: 999px; box-shadow: 0 10px 24px -10px rgba(10, 37, 64, .35); }
.br-spec__swatches i { width: 16px; height: 16px; border-radius: 50%; }
.br-spec__swatches i:nth-child(1) { background: var(--black); } .br-spec__swatches i:nth-child(2) { background: var(--primary); }
.br-spec__swatches i:nth-child(3) { background: var(--primary-2); } .br-spec__swatches i:nth-child(4) { background: var(--brand-2); }
.br-spec__swatches i:nth-child(5) { background: #4FC3B5; }

@media (max-width: 575.98px) { .br-spec__mark { width: min(100%, 260px); } }
.br-spec__list { margin: 0; padding: 0; list-style: none; counter-reset: bs; }
.br-spec__list li { counter-increment: bs; position: relative; display: grid; grid-template-columns: 2.25rem 44px 1fr; gap: 1rem; align-items: center; padding: 1.1rem 0; border-bottom: 1px solid var(--line);
  color: var(--black); font-size: var(--font-h3); font-weight: 500; line-height: 1.3; letter-spacing: -0.02em; }
.br-spec__list li:first-child { border-top: 1px solid var(--line); }
.br-spec__list li > span:first-child { grid-column: 2; grid-row: 1; }
.br-spec__list li::before { content: counter(bs, decimal-leading-zero); grid-column: 1; grid-row: 1; font-size: .85rem; font-weight: 500; letter-spacing: normal; color: var(--brand-2-ink); }
.ix .br-spec__list li[data-reveal].is-visible::before { transform: none; }
.br-spec__list .ix-ico { width: 44px; height: 44px; border-radius: 50%; background: #fff; border: 1px solid var(--line); color: var(--primary); }
.br-spec__list .ix-ico .icon { width: 20px; height: 20px; }
@media (min-width: 992px) {
  .br-spec__grid { grid-template-columns: var(--d) minmax(0, 1fr); column-gap: var(--gap); }
  .br-spec__mark { width: var(--d); }
  .br-spec__list li { height: calc(var(--d) / 5); padding: 0; border-top: 0; }
  .br-spec__list li:first-child { border-top: 0; }
  .br-spec__list li:last-child { border-bottom: 0; }
  /* guide line from each annotation back to the circle's edge */
  .br-spec__list li::after { content: ""; position: absolute; top: 50%; right: 100%; width: calc(var(--gap) + var(--reach) - 6px); height: 9px; margin: -4.5px 8px 0 0;
    background: radial-gradient(circle, var(--brand-2) 0 3.5px, transparent 4px) left center / 9px 9px no-repeat, linear-gradient(90deg, var(--primary-2) 50%, transparent 0) 0 center / 7px 1px repeat-x; opacity: .9; }
}


.br-impact { background: var(--black); overflow: hidden; }
.br-impact::before { content: ""; position: absolute; right: -140px; top: -140px; width: 420px; height: 420px; border-radius: 50%; background: var(--brand-2); z-index: -1; }
.br-impact .ix-quote { max-width: 760px; }
.br-impact .ix-quote blockquote p { color: #fff; }
.br-impact .ix-quote__label { color: #4FC3B5; }
@media (max-width: 575.98px) { .br-impact::before { width: 200px; height: 200px; right: -110px; top: -110px; } }
.br-band { background: #fff; }
.br-band p { color: var(--muted); }

/* ---------- 12. Market Access — full-bleed dark network image ---------- */
.ix--market { --pg-bg: var(--surface); --pg-accent: #1A9A8C; --pg-accent-ink: #157E73; --pg-line: var(--line); }
.mk-hero { position: relative; overflow: hidden; isolation: isolate; color: var(--on-dark); padding: clamp(2.5rem, 5vw, 4rem) 0 clamp(3.5rem, 6vw, 5rem); background: var(--black); }
.mk-hero > img { position: absolute; inset: 0; z-index: -2; object-position: 70% 50%; opacity: .85; }
.mk-hero::before { content: ""; position: absolute; inset: 0; z-index: -1; background: linear-gradient(90deg, rgba(10, 37, 64, .97) 0%, rgba(10, 37, 64, .85) 45%, rgba(10, 37, 64, .35) 100%); }
.mk-hero h1 { color: #fff; max-width: 15ch; }
.mk-hero .ix-hero__lede { color: var(--on-dark); }
.mk-hero__grid { display: grid; gap: 3rem; align-items: end; }
@media (min-width: 992px) { .mk-hero__grid { grid-template-columns: minmax(0, 7fr) minmax(0, 4fr); gap: 5rem; min-height: clamp(420px, 52vh, 540px); align-content: center; align-items: center; } }

.mk-intro .lead { margin-bottom: 1.5rem; }
.mk-intro__photo { aspect-ratio: 1100 / 700; }
@media (min-width: 992px) { .mk-intro { grid-template-columns: minmax(0, 6fr) minmax(0, 6fr); align-items: center; } .mk-intro__photo { margin-right: calc(-1 * var(--bleed)); border-radius: var(--ix-radius) 0 0 var(--ix-radius); } }

/* Intro: full-bleed photo on the left, a white panel overlapping its edge — on a pale network band */
.mk-story { position: relative; isolation: isolate; display: grid; background: var(--pg-bg); padding: 0 0 clamp(3.5rem, 7vw, 5rem); }
.mk-story::before { content: ""; position: absolute; inset: 0 0 0 50%; z-index: -1; background: radial-gradient(rgba(26, 154, 140, .22) 1px, transparent 1.5px) 0 0 / 22px 22px; -webkit-mask-image: linear-gradient(90deg, transparent, #000 40%); mask-image: linear-gradient(90deg, transparent, #000 40%); }
.mk-story__photo { position: relative; margin: 0; width: 100%; height: clamp(240px, 62vw, 420px); overflow: hidden; }
.mk-story__photo img { object-position: 35% 50%; }
.mk-story__photo::after { content: ""; position: absolute; inset: 0; background: linear-gradient(120deg, rgba(10, 37, 64, .55) 0%, rgba(7, 87, 154, .25) 55%, rgba(26, 154, 140, .15) 100%); }
.mk-story__body { position: relative; z-index: 1; margin: -3rem clamp(20px, 5vw, 80px) 0; padding: clamp(2rem, 5vw, 3.5rem); background: #fff; border-top: 4px solid var(--brand-2); }
.mk-story__body .ix-lead { max-width: none; }
.mk-story__reach { position: relative; margin: 2rem 0 0; padding-top: 1.75rem; color: var(--text); }
.mk-story__reach::before { content: ""; position: absolute; left: 0; top: 0; width: 48px; height: 2px; background: var(--brand-2); }
@media (min-width: 992px) {
  .mk-story { grid-template-columns: repeat(12, minmax(0, 1fr)); align-items: center; padding: var(--sec-y) 0; }
  .mk-story__photo { grid-column: 1 / span 7; grid-row: 1; aspect-ratio: auto; height: 100%; min-height: 580px; }
  .mk-story__body { grid-column: 7 / span 6; grid-row: 1; margin: 0 var(--bleed) 0 0; padding: clamp(2.75rem, 4.5vw, 4rem); }
}

.mk-hub { position: relative; display: grid; gap: 1.5rem; }
.mk-hub__core { display: none; }
.mk-hub ul { display: grid; }
.mk-hub li { display: flex; align-items: center; gap: 1rem; padding: 1.1rem 0; border-bottom: 1px dashed var(--line); color: var(--black); }
@media (min-width: 992px) {
  .mk-hub { grid-template-columns: 1fr 260px 1fr; grid-template-rows: repeat(3, auto); gap: 2.5rem 4.5rem; align-items: center; }
  .mk-hub__core { display: grid; place-items: center; grid-column: 2; grid-row: 1 / 4; aspect-ratio: 1; border-radius: 50%; background: var(--black); color: #4FC3B5; box-shadow: 0 0 0 18px rgba(10, 37, 64, .05), 0 0 0 38px rgba(10, 37, 64, .03); }
  .mk-hub__core { background: #fff; overflow: hidden; border: 1px solid var(--pg-line); }
  .mk-hub__core img { width: 100%; height: 100%; object-fit: cover; }
  .mk-hub ul { display: contents; }
  .mk-hub li { position: relative; border-bottom: 0; padding: 0; }
  .mk-hub li:nth-child(-n+3) { grid-column: 1; flex-direction: row-reverse; text-align: right; }
  .mk-hub li:nth-child(n+4) { grid-column: 3; }
  .mk-hub li:nth-child(1), .mk-hub li:nth-child(4) { grid-row: 1; }
  .mk-hub li:nth-child(2), .mk-hub li:nth-child(5) { grid-row: 2; }
  .mk-hub li:nth-child(3), .mk-hub li:nth-child(6) { grid-row: 3; }
  .mk-hub li::after { content: ""; position: absolute; top: 50%; width: 3.5rem; height: 1px; background: repeating-linear-gradient(90deg, var(--brand-2) 0 4px, transparent 4px 8px); }
  .mk-hub li:nth-child(-n+3)::after { left: calc(100% + .5rem); }
  .mk-hub li:nth-child(n+4)::after { right: calc(100% + .5rem); }
}
/* Impact — reach ripples: a pin sending out rings to stores, cart, delivery and global markets | statement */
.mk-reach { position: relative; overflow: hidden; isolation: isolate; padding: clamp(3rem, 5vw, 4.5rem) 0; }
.mk-reach__grid { display: grid; gap: 2rem; align-items: center; justify-items: center; text-align: center; max-width: 1080px; margin: 0 auto; }
.mk-ripple { position: relative; width: 240px; aspect-ratio: 1; flex: none; }
.mk-ripple__ring { position: absolute; border-radius: 50%; left: 50%; top: 50%; transform: translate(-50%, -50%); border: 1.5px dashed rgba(26, 154, 140, .45); }
.mk-ripple__ring--1 { width: 42%; height: 42%; background: rgba(26, 154, 140, .08); border-style: solid; border-color: rgba(26, 154, 140, .25); }
.mk-ripple__ring--2 { width: 70%; height: 70%; }
.mk-ripple__ring--3 { width: 98%; height: 98%; border-color: rgba(7, 87, 154, .25); }
.mk-ripple__core { position: absolute; left: 50%; top: 50%; width: 64px; height: 64px; margin: -32px 0 0 -32px; display: grid; place-items: center; border-radius: 50%; background: var(--black); color: #4FC3B5; box-shadow: 0 14px 28px -12px rgba(10, 37, 64, .6); }
.mk-ripple__core .icon { width: 28px; height: 28px; }
.mk-ripple__node { position: absolute; width: 40px; height: 40px; margin: -20px 0 0 -20px; display: grid; place-items: center; border-radius: 50%; background: #fff; border: 1px solid var(--line); color: var(--primary); box-shadow: 0 8px 18px -10px rgba(10, 37, 64, .4); }
.mk-ripple__node .icon { width: 18px; height: 18px; }
.mk-ripple__node--a { left: 85%; top: 36%; }
.mk-ripple__node--b { left: 18%; top: 14%; background: var(--primary); border-color: var(--primary); color: #fff; }
.mk-ripple__node--c { left: 25%; top: 85%; }
.mk-ripple__node--d { left: 92%; top: 78%; background: var(--brand-2); border-color: var(--brand-2); color: #fff; }
.mk-reach .ix-quote { max-width: none; }
.mk-reach .ix-quote__label { color: var(--brand-2-ink); }
.mk-reach .ix-quote blockquote p { font-size: clamp(1.1rem, 2vw, 1.4rem); font-weight: 500; line-height: 1.45; letter-spacing: -0.015em; }
@media (min-width: 992px) {
  .mk-reach__grid { grid-template-columns: auto 1fr; justify-items: start; text-align: left; column-gap: clamp(3rem, 6vw, 5.5rem); }
  .mk-reach .ix-quote { padding-left: clamp(2rem, 4vw, 3rem); border-left: 2px solid var(--line); }
}

.mk-band { background: var(--black); color: var(--on-dark); }
.mk-band::before { content: ""; position: absolute; inset: 0; z-index: -1; opacity: .5; background: radial-gradient(rgba(79, 195, 181, .55) 1px, transparent 1.5px) 0 0 / 18px 18px; -webkit-mask-image: radial-gradient(ellipse at 100% 50%, #000, transparent 60%); mask-image: radial-gradient(ellipse at 100% 50%, #000, transparent 60%); }
.mk-band h2 { color: #fff; }
.mk-band p { color: var(--on-dark); }

/* ---------- 13. Business Mentoring — image-led, visual first ---------- */
.ix--mentor { --pg-bg: rgba(26, 154, 140, .07); --pg-accent: #1A9A8C; --pg-accent-ink: var(--brand-2-ink); --pg-line: var(--line); }
.mt-hero { background: linear-gradient(180deg, rgba(26, 154, 140, .07), var(--surface-2)); padding: clamp(2.5rem, 5vw, 4rem) 0 clamp(3.5rem, 6vw, 5rem); overflow: hidden; }
.mt-hero__grid { display: grid; gap: 3rem; align-items: center; }
.mt-hero h1 { max-width: 12ch; }
@media (max-width: 991.98px) { .mt-hero h1 { max-width: none; } }
.mt-duo { position: relative; display: grid; grid-template-columns: 1.3fr 1fr; gap: 1.25rem; max-width: 660px; width: 100%; margin-inline: auto; }
.mt-duo .ix-frame:first-child { aspect-ratio: 4 / 5.3; border-radius: 999px 999px var(--ix-radius) var(--ix-radius); }
.mt-duo .ix-frame:first-child img { object-position: 50% 40%; }
.mt-duo .ix-frame:nth-child(2) { aspect-ratio: 1; align-self: start; margin-top: 3.5rem; }
.mt-duo .ix-advisor--bubble { grid-column: 1 / -1; margin: -5.5rem 0 0 22%; position: relative; }
@media (min-width: 992px) { .mt-hero__grid { grid-template-columns: minmax(0, 6fr) minmax(0, 5fr); gap: 6rem; min-height: clamp(600px, 76vh, 780px); } }

/* Offer — the mentoring cycle: a looping track with the heading at its centre; 1→3 along the top, 4→6 back along the bottom; static */
.mt-cycle { --row: 118px; --gap: 190px; --node: 68px; position: relative; }
.mt-cycle__list { position: relative; display: grid; gap: 0; margin: 0; padding: 0; list-style: none; counter-reset: mc; }
.mt-cycle__list li { counter-increment: mc; position: relative; display: grid; grid-template-columns: var(--node) 1fr; gap: 1.25rem; align-items: center; padding: 1rem 0;
  color: var(--black); font-size: var(--font-h3); font-weight: 500; line-height: 1.3; letter-spacing: -0.02em; }
.mt-cycle__list .ix-ico { position: relative; z-index: 1; width: var(--node); height: var(--node); border-radius: 50%; background: #fff; border: 1px solid var(--line); color: var(--brand-2-ink); box-shadow: 0 0 0 6px var(--surface); }
.mt-cycle__list .ix-ico .icon { width: 26px; height: 26px; }
.mt-cycle__list li:nth-child(3n+1) .ix-ico { background: var(--black); border-color: var(--black); color: #4FC3B5; }
.mt-cycle__list li:nth-child(3n+2) .ix-ico { background: var(--primary); border-color: var(--primary); color: #fff; }
.mt-cycle__list .ix-ico::after { content: counter(mc); position: absolute; right: -4px; top: -4px; display: grid; place-items: center; width: 22px; height: 22px; border-radius: 50%;
  background: var(--brand-2); color: #fff; font-size: .7rem; font-weight: 600; box-shadow: 0 0 0 3px var(--surface); }
.mt-cycle__list::before { content: ""; position: absolute; left: calc(var(--node) / 2 - 1px); top: 2.5rem; bottom: 2.5rem; border-left: 2px dashed rgba(26, 154, 140, .5); }
.mt-cycle__turn { display: none; }
.mt-cycle__head h2 { margin-bottom: 2rem; }
@media (min-width: 992px) {
  .mt-cycle { padding: 0 2rem; }
  .mt-cycle__head { position: absolute; z-index: 2; left: 0; right: 0; top: var(--row); height: var(--gap); display: flex; align-items: center; justify-content: center; margin: 0; max-width: none; pointer-events: none; }
  .mt-cycle__head h2 { margin: 0; white-space: nowrap; }
  .mt-cycle__list { grid-template-columns: repeat(3, 1fr); grid-template-rows: var(--row) var(--row); row-gap: var(--gap); column-gap: 2rem; }
  .mt-cycle__list::before { left: 0; right: 0; top: calc(var(--row) - var(--node) / 2); bottom: calc(var(--row) - var(--node) / 2); border: 2px dashed rgba(26, 154, 140, .5); border-radius: 999px; }
  .mt-cycle__list li { grid-template-columns: 1fr; justify-items: center; text-align: center; padding: 0 1rem; gap: 1rem; }
  /* top row: text above, node on the track */
  .mt-cycle__list li:nth-child(-n+3) { align-content: end; }
  .mt-cycle__list li:nth-child(-n+3) .ix-ico { order: 2; }
  /* bottom row runs back right → left: node on the track, text below */
  .mt-cycle__list li:nth-child(n+4) { grid-row: 2; align-content: start; }
  .mt-cycle__list li:nth-child(4) { grid-column: 3; }
  .mt-cycle__list li:nth-child(5) { grid-column: 2; }
  .mt-cycle__list li:nth-child(6) { grid-column: 1; }
  .mt-cycle__list li { max-width: 280px; justify-self: center; width: 100%; }
  /* direction chevrons at each end of the loop */
  .mt-cycle__turn { display: block; position: absolute; top: calc(var(--row) + var(--gap) / 2); width: 34px; height: 34px; margin-top: -17px; border-radius: 50%; background: var(--brand-2); box-shadow: 0 0 0 6px var(--surface); }
  .mt-cycle__turn::after { content: ""; position: absolute; left: 50%; top: 50%; width: 9px; height: 9px; border-right: 2px solid #fff; border-bottom: 2px solid #fff; }
  .mt-cycle__turn--r { right: calc(2rem - 17px); }
  .mt-cycle__turn--r::after { transform: translate(-50%, -70%) rotate(45deg); }
  .mt-cycle__turn--l { left: calc(2rem - 17px); background: var(--primary); }
  .mt-cycle__turn--l::after { transform: translate(-50%, -30%) rotate(-135deg); }
  /* soft centre glow behind the heading */
  .mt-cycle::before { content: ""; position: absolute; left: 50%; top: calc(var(--row) + var(--gap) / 2); width: 560px; height: 220px; transform: translate(-50%, -50%); border-radius: 50%;
    background: radial-gradient(closest-side, rgba(79, 195, 181, .18), transparent); }
}

.mt-impact { display: grid; gap: 3rem clamp(3rem, 7vw, 7rem); align-items: center; }
.mt-impact .ix-frame { aspect-ratio: 700 / 520; }
@media (min-width: 992px) { .mt-impact { grid-template-columns: minmax(0, 6fr) minmax(0, 6fr); } .mt-impact .ix-frame { margin-right: calc(-1 * var(--bleed)); border-radius: var(--ix-radius) 0 0 var(--ix-radius); } }

.mt-band { background: var(--brand-2-ink); color: #fff; text-align: center; }
.mt-band::before { content: ""; position: absolute; left: 50%; top: -340px; width: 680px; height: 680px; transform: translateX(-50%); border-radius: 50%; border: 1px solid rgba(255, 255, 255, .14); z-index: -1; }
.mt-band h2 { color: #fff; }
.mt-band .ix-actions { justify-content: center; align-items: center; }
.ix .mt-band .container > [data-reveal] { grid-template-columns: 1fr; justify-items: center; }
.mt-cta { display: grid; gap: 1.75rem; justify-items: center; }
.mt-cta .ix-cta-copy { justify-content: center; }
.mt-cta p { color: rgba(255, 255, 255, .86); }


/* ===================================================================
   KEY MESSAGE BANDS — the one strong brand section on a page ("Our Impact")
   =================================================================== */
.ix-key { position: relative; isolation: isolate; overflow: hidden; }
.ix-key .ix-quote blockquote p { color: #fff; }
.ix-key .ix-quote { max-width: 980px; }

/* Compliance: navy band, teal shield */
.cp-key { background: var(--black); }
.cp-key .ix-quote__label { color: #4FC3B5; }

/* Training: centred statement band on the site's navy business texture (the committed .statement pattern) */
/* Training impact — compact navy band: cap emblem | teal rule | statement, with a faint quote mark */
.tr-key { padding: clamp(3rem, 5vw, 4.25rem) 0; background: linear-gradient(100deg, var(--black) 0%, var(--black-2) 60%, rgba(21, 126, 115, .95) 130%), var(--black); }
.tr-key::before { content: ""; position: absolute; z-index: -1; right: -40px; top: 50%; width: 360px; height: 360px; transform: translateY(-50%); border-radius: 50%;
  background: repeating-radial-gradient(circle, transparent 0 18px, rgba(79, 195, 181, .08) 18px 19px); -webkit-mask: radial-gradient(closest-side, #000 30%, transparent); mask: radial-gradient(closest-side, #000 30%, transparent); }
.tr-key::after { content: none; }
.tr-key__inner { display: grid; gap: 1.5rem; align-items: center; justify-items: center; text-align: center; max-width: 1040px; margin-inline: auto; }
.tr-key__mark { position: relative; display: grid; place-items: center; width: 84px; height: 84px; border-radius: 50%; background: var(--brand-2); color: #fff; box-shadow: 0 0 0 8px rgba(79, 195, 181, .14); }
.tr-key__mark::after { content: ""; position: absolute; inset: -18px; border-radius: 50%; border: 1px dashed rgba(79, 195, 181, .4); }
.tr-key__mark .icon { width: 34px; height: 34px; }
.tr-key .ix-quote { max-width: none; }
.tr-key .ix-quote__label { color: #4FC3B5; margin-bottom: .75rem; }
@media (min-width: 992px) {
  .tr-key__inner { grid-template-columns: auto 1fr; justify-items: start; text-align: left; column-gap: clamp(3rem, 5vw, 4.5rem); }
  .tr-key__mark { margin-left: 18px; }
  .tr-key .ix-quote { padding-left: clamp(2rem, 4vw, 3rem); border-left: 2px solid rgba(79, 195, 181, .35); }
}

/* ===================================================================
   RELATED — opportunities: image-led strip; services: ruled index
   =================================================================== */


.ix-rel-svc { display: grid; column-gap: 3rem; border-top: 2px solid var(--black); counter-reset: rel; }
.ix-rel-svc a { counter-increment: rel; display: grid; grid-template-columns: 2.25rem 1fr auto; gap: .75rem; align-items: center; padding: 1.2rem 0; border-bottom: 1px solid var(--line); color: var(--black); transition: color .25s, padding .3s var(--ease); }
.ix-rel-svc a::before { content: counter(rel, decimal-leading-zero); color: var(--muted); font-variant-numeric: tabular-nums; }
.ix-rel-svc a .icon { width: 18px; height: 18px; color: var(--primary); transition: transform .3s var(--ease); }
.ix-rel-svc a:hover { color: var(--primary); padding-left: .5rem; }
.ix-rel-svc a:hover .icon { transform: translate(2px, -2px); }
@media (min-width: 768px) { .ix-rel-svc { grid-template-columns: 1fr 1fr; } }
@media (min-width: 1200px) { .ix-rel-svc { grid-template-columns: 1fr 1fr 1fr; } }

/* ===================================================================
   TYPOGRAPHY — every text style on these pages maps to the committed design.
   Headings (h1/h2/h3), body copy, .lead and buttons come straight from style.css; the roles
   below reuse the exact values of existing committed components (named in each comment).
   =================================================================== */
/* Eyebrow — Home .section-head eyebrow */
.ix-kicker { font-size: var(--font-lead); font-weight: 500; }
/* Breadcrumb — .breadcrumb */
.ix-crumb { font-size: .85rem; }
/* Hero description — .page-banner p */
.ix-hero__lede { font-size: clamp(1rem, 1.8vw, 1.25rem); }
/* Intro paragraph — .lead */
.ix .lead { font-size: var(--font-lead); line-height: 1.6; }
/* Statements — .statement p */
.ix .ix-lead__first, .su-idea__big, .fin-intro__big, .fin-cta p, .agri-cta p, .rural-cta__body .big, .women-cta .big, .sme-cta p, .su-band__cta p {
  font-size: clamp(1.35rem, 2.6vw, 2rem); font-weight: 500; line-height: 1.3; letter-spacing: -0.02em;
}
/* Quotes ("Our Impact") — .impact p / .svc .impact__label */
.ix-quote blockquote p { font-size: clamp(1.1rem, 2vw, 1.4rem); font-weight: 500; line-height: 1.45; letter-spacing: -0.015em; }
.ix-quote__label { font-size: var(--font-small); font-weight: 500; letter-spacing: .02em; }
/* Supporting copy — body */
.agri-intro__side, .rural-story__note, .women-quote__body, .su-idea__side, .sme-intro__side, .tr-intro__side, .cp-intro__note,
.br-statement-side, .mt-intro__side, .fd-note p, .women-intro__note p { font-size: var(--font-body); line-height: 1.65; }
.su-idea__stage { font-weight: 500; }
/* List items — .offer-list li */
.fin-ledger li, .agri-rail li, .rural-svc li, .su-bento li, .cp-list li,
.fd-file, .br-rows li, .mk-hub li, .mt-thread li, .fin-people li, .agri-who li, .rural-who li, .women-who li, .su-who li, .sme-who__sectors li {
  font-size: .95rem; font-weight: 500;
}
/* Large numbers — .stat__value (solid, like the committed stats) */

/* Small index numbers — .stat__pill */
.fin-ledger li::before, .agri-rail li::before, .br-rows li::before, .ix-rel-svc a::before { font-size: .85rem; font-weight: 500; }
/* Related links — .related a */
.ix-rel-svc a { font-size: .9rem; font-weight: 500; }
/* "All Services" strip — .side-nav__title / .side-nav a */
.ix-allsvc a { font-size: .95rem; font-weight: 500; line-height: 1.35; }
/* Advisor block — .side-cta */
.ix-advisor__body p { font-size: .88rem; }
.ix-advisor__link { font-size: .88rem; font-weight: 600; }
/* Training offers — item name at the committed h3 size, index as a .stat__pill-sized label */
.tr-course { font-size: var(--font-h3); font-weight: 500; line-height: 1.3; letter-spacing: -0.02em; }
.tr-course::before { font-size: .85rem; font-weight: 500; letter-spacing: normal; color: var(--muted); }
/* Training intro caption — body */
.tr-story__note p { font-size: var(--font-body); line-height: 1.65; }
/* Training impact band — .statement p */
/* Badges — .tiles li */
.fin-badge { font-size: .9rem; font-weight: 500; }

/* ===================================================================
   SECTION REWORKS (Women audience collage · Startup launch track · SME story / services / audience)
   =================================================================== */

/* Women — the six-photo collage is the centre of the audience section */
.women-who__photo { width: 100%; max-width: 640px; aspect-ratio: 1660 / 880; border-radius: 10px; box-shadow: 0 0 0 10px var(--surface), 0 0 0 11px var(--line); }
@media (min-width: 992px) {
  .women-who-wrap { column-gap: 3rem; }
  .women-who__photo { width: clamp(420px, 38vw, 540px); }
  .women-who li::after { width: 1.75rem; }
}

/* Startup — statement on a light launch grid | a track from the team photo to the rocket goal */
.su-launch { position: relative; isolation: isolate; padding: var(--sec-y) 0; background:
  linear-gradient(rgba(7, 87, 154, .06) 1px, transparent 1px) 0 0 / 56px 56px,
  linear-gradient(90deg, rgba(7, 87, 154, .06) 1px, transparent 1px) 0 0 / 56px 56px, #fff; }
.su-launch__grid { display: grid; gap: 3rem; align-items: center; }
.su-launch__track { position: relative; display: grid; gap: 2rem; margin: 0; padding: clamp(2rem, 3.5vw, 2.75rem); background: #F2F7FB; border-top: 4px solid #4FC3B5; }
.su-launch__track::before { content: ""; position: absolute; left: calc(clamp(2rem, 3.5vw, 2.75rem) + 44px); top: calc(clamp(2rem, 3.5vw, 2.75rem) + 44px); bottom: calc(clamp(2rem, 3.5vw, 2.75rem) + 44px); border-left: 2px dashed #4FC3B5; }
.su-launch__step { position: relative; display: grid; grid-template-columns: 88px 1fr; gap: 1.5rem; align-items: center; }
.su-launch__step p { margin: 0; }
.su-launch__photo { width: 88px; height: 88px; margin: 0; border-radius: 50%; overflow: hidden; border: 4px solid #F2F7FB; box-shadow: 0 0 0 2px #4FC3B5; }
.su-launch__node { display: grid; place-items: center; width: 88px; height: 88px; border-radius: 50%; background: var(--black); color: #4FC3B5; box-shadow: 0 0 0 6px rgba(79, 195, 181, .18); }
.su-launch__node .icon { width: 32px; height: 32px; }
.su-launch__step--goal .su-idea__stage { color: var(--black); }
@media (min-width: 992px) { .su-launch__grid { grid-template-columns: minmax(0, 6fr) minmax(0, 5fr); gap: clamp(3rem, 6vw, 5.5rem); } }
@media (max-width: 575.98px) {
  .su-launch__track::before { display: none; }
  .su-launch__step { grid-template-columns: 1fr; gap: 1rem; }
  .su-launch__photo, .su-launch__node { width: 72px; height: 72px; }
}

/* SME — text | photo with an overlapping blue note */
.sme-story { padding: var(--sec-y) 0; background: #fff; }
.sme-story__grid { display: grid; gap: 3rem; align-items: center; }
.sme-story__visual { position: relative; padding: 0 0 3.5rem 2.5rem; }
.sme-story__photo { aspect-ratio: 700 / 520; }
.sme-story__note { position: absolute; left: 0; bottom: 0; width: min(420px, 82%); padding: 1.75rem 2rem; background: var(--primary); border-top: 4px solid #4FC3B5; }
.sme-story__note p { margin: 0; color: rgba(255, 255, 255, .92); }
@media (min-width: 992px) { .sme-story__grid { grid-template-columns: minmax(0, 6fr) minmax(0, 6fr); gap: clamp(3rem, 6vw, 5.5rem); } }
@media (max-width: 575.98px) { .sme-story__visual { padding: 0; } .sme-story__note { position: relative; width: auto; margin: -2rem 1rem 0; } }

/* SME — services on a navy band as a ruled 4 × 2 grid */
.sme-svc { background: linear-gradient(135deg, #0A2540 0%, var(--black-2) 100%); color: var(--on-dark); overflow: hidden; }
.sme-svc::before { content: ""; position: absolute; right: -180px; top: -200px; width: 560px; height: 560px; border-radius: 50%; border: 1px solid rgba(79, 195, 181, .2); z-index: -1; }
.sme-svc h2 { color: #fff; }
/* SME — services: navy band, heading + framed photo | two columns of numbered rows (static, no tiles) */
.sme-svc__grid { display: grid; gap: 3rem; align-items: start; }
.sme-svc__head h2 { margin-bottom: 2rem; }
.sme-svc__photo { position: relative; margin: 0; max-width: 340px; aspect-ratio: 4 / 3; border-radius: var(--ix-radius); }
.sme-svc__photo img { border-radius: var(--ix-radius); position: relative; z-index: 1; }
.sme-svc__photo::before { content: ""; position: absolute; inset: 1rem -1rem -1rem 1rem; border: 1px solid rgba(79, 195, 181, .55); border-radius: var(--ix-radius); }
@media (max-width: 575.98px) { .sme-svc__photo { max-width: calc(100% - .75rem); } .sme-svc__photo::before { inset: .75rem -.75rem -.75rem .75rem; } }
.sme-svc__list { display: grid; column-gap: clamp(2rem, 4vw, 3.5rem); counter-reset: svc; margin: 0; }
.sme-svc__list li { counter-increment: svc; display: grid; grid-template-columns: auto 1fr; grid-template-rows: auto auto; column-gap: 1rem; row-gap: .4rem; align-items: center; padding: 1.4rem 0; border-bottom: 1px solid rgba(255, 255, 255, .14); color: #fff; }
.sme-svc__list li::before { content: counter(svc, decimal-leading-zero); grid-column: 1 / -1; color: #4FC3B5; }
.sme-svc__list .ix-ico { color: #4FC3B5; }
.sme-svc__list .ix-ico .icon { width: 22px; height: 22px; }
@media (min-width: 768px) { .sme-svc__list { grid-template-columns: 1fr 1fr; } .sme-svc__list li:nth-child(-n+2) { border-top: 1px solid rgba(255, 255, 255, .14); } }
@media (max-width: 767.98px) { .sme-svc__list li:first-child { border-top: 1px solid rgba(255, 255, 255, .14); } }
@media (min-width: 992px) { .sme-svc__grid { grid-template-columns: minmax(0, 4fr) minmax(0, 8fr); gap: clamp(3rem, 6vw, 5.5rem); } }

/* SME — audience: two main audiences split by a rule, sectors as an open strip (static, no blocks) */
/* Who — a "span" chart: from New registrants to Existing SME/MSMEs along one axis, with the three sectors as lanes that run the full span; static */
.sme-span { --lab: 0px; position: relative; display: grid; grid-template-columns: var(--lab) 1fr; column-gap: 0; max-width: 1080px; margin: 0 auto; }
.sme-span__ends { grid-column: 2; display: flex; justify-content: space-between; gap: 1rem; margin: 0; padding: 0; list-style: none; }
.sme-span__ends li { display: flex; align-items: center; gap: .6rem; color: var(--black); }
.sme-span__ends li::before { content: ""; flex: none; width: 10px; height: 10px; border-radius: 50%; }
.sme-span__ends .is-start::before { border: 2px solid var(--brand-2); background: #fff; }
.sme-span__ends .is-end { flex-direction: row-reverse; text-align: right; }
.sme-span__ends .is-end::before { background: var(--primary); }
.ix .sme-span__ends li[data-reveal].is-visible::before, .ix .sme-span__ends li::before { transform: none; }
.sme-span__axis { grid-column: 2; position: relative; display: flex; justify-content: space-between; align-items: center; height: 28px; margin: .9rem 0 1.25rem; }
.sme-span__axis::before { content: ""; position: absolute; left: 0; right: 0; top: 50%; height: 3px; margin-top: -1.5px; border-radius: 2px; background: linear-gradient(90deg, #4FC3B5, var(--primary)); }
.sme-span__axis::after { content: ""; position: absolute; right: -2px; top: 50%; width: 10px; height: 10px; margin-top: -5px; border-top: 3px solid var(--primary); border-right: 3px solid var(--primary); transform: rotate(45deg); }
.sme-span__axis i { position: relative; width: 2px; height: 12px; background: rgba(7, 87, 154, .3); }
.sme-span__axis i:first-child { width: 16px; height: 16px; border-radius: 50%; background: #fff; border: 3px solid var(--brand-2); }
.sme-span__axis i:last-child { visibility: hidden; }
.sme-span__lanes { grid-column: 1 / -1; display: grid; gap: 1rem; margin: 0; padding: 0; list-style: none; }
.sme-span__lanes li { display: grid; grid-template-columns: 1fr; gap: .55rem; color: var(--black); }
.sme-span__track { position: relative; height: 14px; border-radius: 999px; background: linear-gradient(90deg, rgba(79, 195, 181, .35), rgba(7, 87, 154, .85)); }
.sme-span__track::before, .sme-span__track::after { content: ""; position: absolute; top: 50%; width: 22px; height: 22px; margin-top: -11px; border-radius: 50%; background: #fff; }
.sme-span__track::before { left: -2px; border: 3px solid #4FC3B5; }
.sme-span__track::after { right: -2px; border: 3px solid var(--primary); }
.sme-span__lanes li:nth-child(2) .sme-span__track { background: linear-gradient(90deg, rgba(79, 195, 181, .3), rgba(31, 109, 174, .8)); }
.sme-span__lanes li:nth-child(3) .sme-span__track { background: linear-gradient(90deg, rgba(79, 195, 181, .25), rgba(18, 59, 99, .85)); }
@media (min-width: 768px) {
  .sme-span { --lab: 240px; }
  .sme-span__lanes { grid-template-columns: var(--lab) 1fr; row-gap: 1.6rem; }
  .sme-span__lanes li { display: contents; }
  .sme-span__lab { align-self: center; padding-right: 2rem; text-align: right; }
}
.sme-svc__list li { font-size: var(--font-h3); font-weight: 500; line-height: 1.3; letter-spacing: -0.02em; }
.sme-svc__list li::before { font-size: .85rem; font-weight: 500; letter-spacing: normal; }

/* SME — CTA band: brand elements on the blue gradient (logo-mark watermark, rings, dot grid, line texture) */
.sme-band { color: var(--on-dark); background:
  repeating-linear-gradient(115deg, rgba(255, 255, 255, .035) 0 1px, transparent 1px 30px),
  linear-gradient(110deg, var(--black) 0 50%, var(--primary) 100%); }
.sme-band::before { content: ""; position: absolute; z-index: -1; left: -140px; top: 50%; width: 420px; height: 420px; transform: translateY(-50%); border-radius: 50%;
  border: 1px solid rgba(79, 195, 181, .28); box-shadow: 0 0 0 60px rgba(255, 255, 255, .025), 0 0 0 61px rgba(79, 195, 181, .14), 0 0 0 130px rgba(255, 255, 255, .02); }
.sme-band::after { content: ""; position: absolute; z-index: -1; right: 4%; top: 50%; width: clamp(180px, 22vw, 300px); aspect-ratio: 225 / 241; transform: translateY(-50%) rotate(-8deg);
  background: url("../img/logo-mark.png") center / contain no-repeat; filter: brightness(0) invert(1); opacity: .08; }
.sme-band .container { position: relative; }
.sme-band .container::before { content: ""; position: absolute; z-index: -1; right: 0; top: -3rem; bottom: -3rem; width: 45%;
  background: radial-gradient(rgba(79, 195, 181, .45) 1px, transparent 1.5px) 0 0 / 18px 18px;
  -webkit-mask-image: radial-gradient(ellipse at 70% 50%, #000, transparent 65%); mask-image: radial-gradient(ellipse at 70% 50%, #000, transparent 65%); }

/* Women — intro: arched portrait | quote-led statement | blush note block */
.women-intro__grid { display: grid; gap: 2.5rem; align-items: center; }
.women-intro__photo { width: 100%; aspect-ratio: 1786 / 1300; margin: 0; border-radius: 999px 999px var(--ix-radius) var(--ix-radius); box-shadow: 0 0 0 10px var(--surface), 0 0 0 11px var(--line); }
.women-intro__photo img { object-position: 50% 40%; }
@media (max-width: 575.98px) { .women-intro__photo { box-shadow: 0 0 0 6px var(--surface), 0 0 0 7px var(--line); } }
.women-intro__copy { display: grid; gap: 2rem; }
.women-intro__mark { display: inline-grid; place-items: center; width: 56px; height: 56px; margin-bottom: 1.25rem; border-radius: 50%; background: rgba(26, 154, 140, .12); color: var(--brand-2-ink); }
.women-intro__mark .icon { width: 24px; height: 24px; }
.women-intro__note { position: relative; padding: clamp(1.5rem, 2.5vw, 2rem) clamp(1.75rem, 3vw, 2.25rem); background: var(--surface); border-left: 4px solid var(--brand-2); }
.women-intro__note p { margin: 0; color: var(--text); }
@media (min-width: 992px) {
  .women-intro__grid { grid-template-columns: minmax(0, 6fr) minmax(0, 5fr); gap: clamp(3rem, 5vw, 5rem); }
}

/* ---------- Tablets & phones ---------- */
@media (max-width: 767.98px) {
}
@media (max-width: 575.98px) {
  .ix-cta-copy { flex-direction: column; gap: 1rem; }
  .fin-ledger li { grid-template-columns: 2.25rem 1fr auto; }
  .fin-people { grid-template-columns: 1fr; }
  .fin-people li { flex-direction: row; align-items: center; padding: 1rem 0; border-left: 0; border-top: 1px solid var(--line); }
  .fin-people li:first-child { border-top: 0; }
  .mt-duo .ix-advisor--bubble { margin: -3rem 0 0 .5rem; }
}

/* ---------- Motion ---------- */
@media (prefers-reduced-motion: reduce) {
  .ix *, .ix *::before, .ix *::after { transition-duration: .01ms !important; animation-duration: .01ms !important; }
  .ix-frame:hover img { transform: none; }
}

/* ---------- Uniform type for every service / audience list item on the inner pages (body size, medium) ---------- */
.ix :is(.agri-ear, .agri-arches, .rr-ledger, .rr-pins, .women-steps, .women-who, .su-orbit__col, .su-who, .reg-list, .cp-list, .br-spec__list, .mk-hub, .mt-cycle__list, .sme-svc__list, .sme-who__main, .sme-who__sectors) li,
.ix :is(.fd-file, .tr-course) { font-size: var(--font-body); font-weight: 500; line-height: 1.45; letter-spacing: normal; }

/* ---------- Bizacharya illustrated icons (two-tone, 48-unit grid; colour from context) ---------- */
.ix .icon.icon--art { stroke-width: 2.6; }

/* Compliance impact — centred */

/* Intro statements — one calmer size on every inner page (first sentence of each intro) */
.ix .ix-lead .ix-lead__first { font-size: clamp(1.2rem, 1.9vw, 1.55rem); line-height: 1.35; letter-spacing: -0.015em; }

/* Compliance impact — the gavel-and-scales photo glows out of the navy band on the right; the statement sits left over the dark */
.cp-key { position: relative; overflow: hidden; isolation: isolate; background: var(--black); padding: 0; }
.cp-key__photo { margin: 0; height: 300px; position: relative; }
.cp-key__photo img { width: 100%; height: 100%; object-fit: cover; object-position: 60% 55%; }
.cp-key__photo::after { content: ""; position: absolute; inset: 0; background: linear-gradient(180deg, transparent 45%, var(--black)); }
.cp-key .cp-impact { display: block; max-width: 560px; padding: 2rem 0 var(--sec-y); }
.cp-key .ix-quote { max-width: none; padding-left: 1.5rem; border-left: 2px solid #4FC3B5; }
.cp-key .ix-quote__label { color: #4FC3B5; }
.cp-key .ix-quote blockquote p { color: #fff; }
@media (min-width: 992px) {
  .cp-key { min-height: 460px; display: flex; align-items: center; }
  .cp-key > .container { width: 100%; position: relative; z-index: 1; }
  .cp-key__photo { position: absolute; top: 0; right: 0; bottom: 0; width: 70%; height: auto; }
  .cp-key__photo::after { background: linear-gradient(90deg, var(--black) 0%, var(--black) 8%, rgba(10, 37, 64, .8) 28%, rgba(10, 37, 64, .3) 48%, rgba(10, 37, 64, 0) 65%); }
  .cp-key .cp-impact { padding: var(--sec-y) 0; }
}

/* ---------- Business Registration — one continuous thread through the page ----------
   shared radius, the same teal top rule on every panel, the guilloche-ring motif repeated, and the lower bands flowing into each other */
.ix--reg { --reg-r: 18px; }
.ix--reg .reg-doc__front { border-radius: 12px; }
.ix--reg .reg-form, .ix--reg .reg-offer__photo, .ix--reg .reg-cta { border-radius: var(--reg-r); }
.ix--reg .reg-cert { border-radius: 10px; }
/* teal top rule — form panel and photo now match the CTA panel */
.ix--reg .reg-form { border-top: 3px solid #4FC3B5; }
.ix--reg .reg-offer__photo { position: relative; box-shadow: 0 0 0 1px rgba(255, 255, 255, .08), 0 30px 60px -30px rgba(0, 0, 0, .6); }
.ix--reg .reg-offer__photo::before { content: ""; position: absolute; z-index: 1; left: 0; right: 0; top: 0; height: 3px; background: linear-gradient(90deg, #4FC3B5, var(--brand-2)); }
/* ring motif carried into the navy offer band (as in the hero, the form panel and the CTA) */
.ix--reg .reg-offer { isolation: isolate; }
.ix--reg .reg-offer::before { content: ""; position: absolute; z-index: -1; width: 760px; height: 760px; right: -300px; top: -320px; border-radius: 50%;
  background: repeating-radial-gradient(circle, transparent 0 22px, rgba(255, 255, 255, .05) 22px 23px); -webkit-mask: radial-gradient(closest-side, #000 30%, transparent); mask: radial-gradient(closest-side, #000 30%, transparent); }
/* the certificate and the CTA share one tinted ground, so the closing of the page reads as one movement */
.ix--reg .reg-key { padding-bottom: clamp(2rem, 4vw, 3rem); }
.ix--reg .reg-band { background: var(--surface); padding-top: 0; }
.ix--reg .reg-cta .ix-cta-copy { flex: 1; align-items: center; }
@media (min-width: 1200px) { .ix--reg .reg-cta .ix-cta-copy h2 { white-space: nowrap; } .ix--reg .reg-cta.ix-cta, .ix--reg .reg-band .container > [data-reveal] { grid-template-columns: minmax(0, 1fr) auto; } .ix--reg .reg-cta .ix-actions { justify-content: flex-end; } }

/* Breadcrumb stays on one line on phones — the current page truncates instead of wrapping */
@media (max-width: 575.98px) {
  .ix-crumb { flex-wrap: nowrap; white-space: nowrap; min-width: 0; }
  .ix-crumb li { flex: none; }
  .ix-crumb li[aria-current] { flex: 0 1 auto; min-width: 0; overflow: hidden; text-overflow: ellipsis; }
}

/* Funding Readiness — What We Offer: gentle float on the icon circles, staggered so they ripple along the line */
@keyframes fd-float { 0%, 100% { transform: translateY(0); box-shadow: 0 6px 14px -10px rgba(10, 37, 64, .35); } 50% { transform: translateY(-6px); box-shadow: 0 14px 22px -12px rgba(10, 37, 64, .3); } }
@media (prefers-reduced-motion: no-preference) {
  .fd-file .ix-ico { animation: fd-float 3.6s ease-in-out infinite; }
  .fd-file:nth-child(2) .ix-ico { animation-delay: -.6s; }
  .fd-file:nth-child(3) .ix-ico { animation-delay: -1.2s; }
  .fd-file:nth-child(4) .ix-ico { animation-delay: -1.8s; }
  .fd-file:nth-child(5) .ix-ico { animation-delay: -2.4s; }
  .fd-file:nth-child(6) .ix-ico { animation-delay: -3s; }
  .fd-file:hover .ix-ico { animation-play-state: paused; }
}

/* Business Mentoring — What We Offer: the two arrow badges travel round the dashed loop (JS: initMentorLoop),
   turning with the curve; a light trail follows them and each step lights up as an arrow passes. */
.mt-cycle__trail { position: absolute; inset: 0; z-index: 0; overflow: visible; pointer-events: none; }
.mt-cycle__trail path { fill: none; stroke-width: 3; stroke-linecap: round; }
.mt-cycle__list .ix-ico { transition: transform .5s cubic-bezier(.22, .61, .36, 1), box-shadow .5s; }
.mt-cycle__list .ix-ico.is-lit { transform: scale(1.08); box-shadow: 0 0 0 6px var(--surface), 0 0 0 13px rgba(26, 154, 140, .2), 0 16px 28px -14px rgba(10, 37, 64, .5); }
.mt-cycle.is-flowing .mt-cycle__turn { left: 0; right: auto; top: 0; margin: -17px 0 0 -17px; z-index: 2; will-change: transform; }
.mt-cycle.is-flowing .mt-cycle__turn::after { transform: translate(-50%, -70%) rotate(45deg); }

/* Business Mentoring — each icon acts out its own meaning when an arrow reaches it (and on hover) */
.mt-cycle__list .ix-ico svg * { transform-box: fill-box; }
@keyframes mtx-pop { 0% { transform: scale(0); } 60% { transform: scale(1.18); } 100% { transform: scale(1); } }
@keyframes mtx-draw { from { stroke-dashoffset: var(--len, 60); } to { stroke-dashoffset: 0; } }
@keyframes mtx-slide { from { transform: translate(7px, 4px); opacity: 0; } to { transform: none; opacity: .16; } }
@keyframes mtx-tilt { 0% { transform: rotate(0); } 30% { transform: rotate(-9deg) translateY(-1px); } 60% { transform: rotate(5deg); } 100% { transform: rotate(0); } }
@keyframes mtx-swing { 0% { transform: rotate(0); } 25% { transform: rotate(-48deg); } 50% { transform: rotate(32deg); } 70% { transform: rotate(-14deg); } 85% { transform: rotate(6deg); } 100% { transform: rotate(0); } }
@keyframes mtx-spin { from { transform: rotate(-90deg); } to { transform: rotate(0); } }
@keyframes mtx-grow { from { transform: scaleY(0); } to { transform: scaleY(1); } }
@keyframes mtx-shoot { 0% { transform: translate(-6px, 6px); opacity: 0; } 70% { transform: translate(1.5px, -1.5px); opacity: 1; } 100% { transform: none; opacity: 1; } }
@keyframes mtx-glow { 0%, 100% { opacity: .16; transform: scale(1); } 40% { opacity: .75; transform: scale(1.25); } }
@keyframes mtx-rays { 0% { opacity: 0; transform: scale(.55); } 45% { opacity: 1; transform: scale(1.12); } 100% { opacity: 1; transform: scale(1); } }
@keyframes mtx-fade { from { opacity: 0; } to { opacity: .16; } }
@keyframes mtx-ring { 0% { transform: rotate(0); } 25% { transform: rotate(-14deg); } 55% { transform: rotate(10deg); } 80% { transform: rotate(-4deg); } 100% { transform: rotate(0); } }
@keyframes mtx-fill { from { transform: scaleY(0); } to { transform: scaleY(1); } }
@media (prefers-reduced-motion: no-preference) {
  .mt-cycle__list li:nth-child(1) .ix-ico.is-lit svg > path:nth-of-type(1), .mt-cycle__list li:nth-child(1):hover svg > path:nth-of-type(1) { animation: mtx-slide .6s cubic-bezier(.22,.61,.36,1) both; }
  .mt-cycle__list li:nth-child(1) .ix-ico.is-lit svg > path:nth-of-type(2), .mt-cycle__list li:nth-child(1):hover svg > path:nth-of-type(2) { transform-origin: 20% 100%; animation: mtx-tilt .8s ease-in-out both; }
  .mt-cycle__list li:nth-child(1) .ix-ico.is-lit svg > path:nth-of-type(3), .mt-cycle__list li:nth-child(1):hover svg > path:nth-of-type(3) { --len: 30; stroke-dasharray: 30; animation: mtx-draw .9s .35s ease-out both; }
  .mt-cycle__list li:nth-child(2) .ix-ico.is-lit svg :is(path.a, > path:nth-of-type(2)), .mt-cycle__list li:nth-child(2):hover svg :is(path.a, > path:nth-of-type(2)) { transform-box: view-box; transform-origin: 24px 24px; animation: mtx-swing 1.6s cubic-bezier(.36,.07,.19,.97) both; }
  .mt-cycle__list li:nth-child(2) .ix-ico.is-lit svg > circle:nth-of-type(1), .mt-cycle__list li:nth-child(2):hover svg > circle:nth-of-type(1) { transform-origin: 50% 50%; animation: mtx-spin .9s cubic-bezier(.22,.61,.36,1) both; }
  .mt-cycle__list li:nth-child(2) .ix-ico.is-lit svg > circle:nth-of-type(3), .mt-cycle__list li:nth-child(2):hover svg > circle:nth-of-type(3) { transform-origin: 50% 50%; animation: mtx-pop .5s .9s both; }
  .mt-cycle__list li:nth-child(3) .ix-ico.is-lit svg > rect:nth-of-type(1), .mt-cycle__list li:nth-child(3):hover svg > rect:nth-of-type(1) { transform-origin: 50% 100%; animation: mtx-grow .55s 0.00s cubic-bezier(.22,.61,.36,1) both; }
  .mt-cycle__list li:nth-child(3) .ix-ico.is-lit svg > rect:nth-of-type(2), .mt-cycle__list li:nth-child(3):hover svg > rect:nth-of-type(2) { transform-origin: 50% 100%; animation: mtx-grow .55s 0.15s cubic-bezier(.22,.61,.36,1) both; }
  .mt-cycle__list li:nth-child(3) .ix-ico.is-lit svg > rect:nth-of-type(3), .mt-cycle__list li:nth-child(3):hover svg > rect:nth-of-type(3) { transform-origin: 50% 100%; animation: mtx-grow .55s 0.30s cubic-bezier(.22,.61,.36,1) both; }
  .mt-cycle__list li:nth-child(3) .ix-ico.is-lit svg > path:nth-of-type(2), .mt-cycle__list li:nth-child(3):hover svg > path:nth-of-type(2) { --len: 46; stroke-dasharray: 46; animation: mtx-draw .8s .45s ease-out both; }
  .mt-cycle__list li:nth-child(3) .ix-ico.is-lit svg > path:nth-of-type(3), .mt-cycle__list li:nth-child(3):hover svg > path:nth-of-type(3) { animation: mtx-shoot .55s 1.1s cubic-bezier(.22,.61,.36,1) both; }
  .mt-cycle__list li:nth-child(4) .ix-ico.is-lit svg > circle.d, .mt-cycle__list li:nth-child(4):hover svg > circle.d { transform-origin: 50% 50%; animation: mtx-glow 1.4s ease-in-out both; }
  .mt-cycle__list li:nth-child(4) .ix-ico.is-lit svg > path:nth-of-type(2), .mt-cycle__list li:nth-child(4):hover svg > path:nth-of-type(2) { --len: 18; stroke-dasharray: 18; animation: mtx-draw .6s .2s ease-out both; }
  .mt-cycle__list li:nth-child(4) .ix-ico.is-lit svg > path:nth-of-type(3), .mt-cycle__list li:nth-child(4):hover svg > path:nth-of-type(3) { transform-box: view-box; transform-origin: 24px 20px; animation: mtx-rays .7s .55s cubic-bezier(.22,.61,.36,1) both; }
  .mt-cycle__list li:nth-child(5) .ix-ico.is-lit svg > path:nth-of-type(1), .mt-cycle__list li:nth-child(5):hover svg > path:nth-of-type(1) { animation: mtx-fade .8s ease-out both; }
  .mt-cycle__list li:nth-child(5) .ix-ico.is-lit svg > path:nth-of-type(3), .mt-cycle__list li:nth-child(5):hover svg > path:nth-of-type(3) { --len: 42; stroke-dasharray: 42; animation: mtx-draw 1s .1s ease-in-out both; }
  .mt-cycle__list li:nth-child(5) .ix-ico.is-lit svg > circle:nth-of-type(2), .mt-cycle__list li:nth-child(5):hover svg > circle:nth-of-type(2) { transform-origin: 50% 50%; animation: mtx-pop .45s 0.35s both; }
  .mt-cycle__list li:nth-child(5) .ix-ico.is-lit svg > circle:nth-of-type(3), .mt-cycle__list li:nth-child(5):hover svg > circle:nth-of-type(3) { transform-origin: 50% 50%; animation: mtx-pop .45s 0.60s both; }
  .mt-cycle__list li:nth-child(5) .ix-ico.is-lit svg > circle:nth-of-type(1), .mt-cycle__list li:nth-child(5):hover svg > circle:nth-of-type(1) { transform-origin: 50% 50%; animation: mtx-pop .45s 0.95s both; }
  .mt-cycle__list li:nth-child(6) .ix-ico.is-lit svg > path.a, .mt-cycle__list li:nth-child(6):hover svg > path.a { transform-origin: 50% 0; animation: mtx-fill .5s ease-out both; }
  .mt-cycle__list li:nth-child(6) .ix-ico.is-lit svg > path:nth-of-type(2), .mt-cycle__list li:nth-child(6):hover svg > path:nth-of-type(2) { transform-origin: 50% 100%; animation: mtx-ring .7s .2s ease-in-out both; }
  .mt-cycle__list li:nth-child(6) .ix-ico.is-lit svg > circle:nth-of-type(1), .mt-cycle__list li:nth-child(6):hover svg > circle:nth-of-type(1) { transform-origin: 50% 50%; animation: mtx-pop .4s 0.35s both; }
  .mt-cycle__list li:nth-child(6) .ix-ico.is-lit svg > circle:nth-of-type(2), .mt-cycle__list li:nth-child(6):hover svg > circle:nth-of-type(2) { transform-origin: 50% 50%; animation: mtx-pop .4s 0.47s both; }
  .mt-cycle__list li:nth-child(6) .ix-ico.is-lit svg > circle:nth-of-type(3), .mt-cycle__list li:nth-child(6):hover svg > circle:nth-of-type(3) { transform-origin: 50% 50%; animation: mtx-pop .4s 0.59s both; }
  .mt-cycle__list li:nth-child(6) .ix-ico.is-lit svg > circle:nth-of-type(4), .mt-cycle__list li:nth-child(6):hover svg > circle:nth-of-type(4) { transform-origin: 50% 50%; animation: mtx-pop .4s 0.71s both; }
  .mt-cycle__list li:nth-child(6) .ix-ico.is-lit svg > circle:nth-of-type(5), .mt-cycle__list li:nth-child(6):hover svg > circle:nth-of-type(5) { transform-origin: 50% 50%; animation: mtx-pop .4s 0.83s both; }
}

/* Business Mentoring — intro: a glowing line draws round the loop and each step flips in as it arrives */
.mt-cycle__draw { fill: none; stroke: #1A9A8C; stroke-width: 3; stroke-linecap: round; filter: drop-shadow(0 0 6px rgba(79, 195, 181, .6)); transition: stroke-opacity 1.2s ease; }
.mt-cycle.is-drawn .mt-cycle__draw { stroke-opacity: .28; filter: none; }
.mt-cycle__head-dot { fill: #fff; stroke: #1A9A8C; stroke-width: 3; filter: drop-shadow(0 0 8px rgba(79, 195, 181, .9)); opacity: 0; }
.mt-cycle.is-pre .mt-cycle__head-dot { opacity: 1; }
.mt-cycle.is-drawn .mt-cycle__head-dot { opacity: 0; transition: opacity .5s; }
.mt-cycle.is-pre .mt-cycle__turn { opacity: 0; }
.mt-cycle.is-drawn .mt-cycle__turn { opacity: 1; transition: opacity .6s; }
@keyframes mtx-ripple { 0% { box-shadow: 0 0 0 6px var(--surface), 0 0 0 6px rgba(26, 154, 140, .45); } 100% { box-shadow: 0 0 0 6px var(--surface), 0 0 0 34px rgba(26, 154, 140, 0); } }
@media (prefers-reduced-motion: no-preference) {
  .mt-cycle.is-pre .mt-cycle__list li .ix-ico { opacity: 0; transform: perspective(500px) rotateY(-110deg) scale(.55); }
  .mt-cycle.is-pre .mt-cycle__list li.is-on .ix-ico, .mt-cycle.is-drawn .mt-cycle__list li.is-on .ix-ico:not(.is-lit) { opacity: 1; transform: none; }
  .mt-cycle .mt-cycle__list li.is-on .ix-ico { transition: transform .95s cubic-bezier(.34, 1.56, .64, 1), opacity .35s ease, box-shadow .5s; animation: mtx-ripple 1.1s .35s ease-out both; }
  .mt-cycle.is-pre .mt-cycle__list li { color: transparent; transition: color .6s ease .25s; }
  .mt-cycle.is-pre .mt-cycle__list li.is-on { color: var(--black); }
}
.mt-cycle.is-pre .mt-cycle__seg { opacity: 0; } .mt-cycle__seg { transition: opacity .6s; }

/* Rural Enterprises — Who Can Benefit: slower, calmer entrance for the pins (was .6s with an 80ms step) */
.ix .rr-pins li[data-reveal] { transform: translateY(26px); transition: opacity 1.4s cubic-bezier(.22, .61, .36, 1), transform 1.4s cubic-bezier(.22, .61, .36, 1); }
.ix .rr-pins li[data-reveal].is-visible { transform: none; }
.ix .rr-pins li:nth-child(1) { transition-delay: 0s !important; }
.ix .rr-pins li:nth-child(2) { transition-delay: .25s !important; }
.ix .rr-pins li:nth-child(3) { transition-delay: .5s !important; }
.ix .rr-pins li:nth-child(4) { transition-delay: .75s !important; }
.ix .rr-pins li:nth-child(5) { transition-delay: 1s !important; }
.ix .rr-pins li:nth-child(6) { transition-delay: 1.25s !important; }
/* Who Can Benefit pins: whole sequence takes 5s (2s per pin, 0.6s apart; last starts at 3s) */
.ix .rr-pins li[data-reveal] { transition-duration: 2s, 2s; }
.ix .rr-pins li:nth-child(2) { transition-delay: .6s !important; }
.ix .rr-pins li:nth-child(3) { transition-delay: 1.2s !important; }
.ix .rr-pins li:nth-child(4) { transition-delay: 1.8s !important; }
.ix .rr-pins li:nth-child(5) { transition-delay: 2.4s !important; }
.ix .rr-pins li:nth-child(6) { transition-delay: 3s !important; }
/* Who Can Benefit pins: whole sequence takes 8s (3s per pin, 1s apart; last starts at 5s) */
.ix .rr-pins li[data-reveal] { transition-duration: 3s, 3s; }
.ix .rr-pins li:nth-child(2) { transition-delay: 1s !important; }
.ix .rr-pins li:nth-child(3) { transition-delay: 2s !important; }
.ix .rr-pins li:nth-child(4) { transition-delay: 3s !important; }
.ix .rr-pins li:nth-child(5) { transition-delay: 4s !important; }
.ix .rr-pins li:nth-child(6) { transition-delay: 5s !important; }
/* Who Can Benefit pins: whole sequence takes 6s (2.25s per pin, 0.75s apart; last starts at 3.75s) */
.ix .rr-pins li[data-reveal] { transition-duration: 2.25s, 2.25s; }
.ix .rr-pins li:nth-child(2) { transition-delay: .75s !important; }
.ix .rr-pins li:nth-child(3) { transition-delay: 1.5s !important; }
.ix .rr-pins li:nth-child(4) { transition-delay: 2.25s !important; }
.ix .rr-pins li:nth-child(5) { transition-delay: 3s !important; }
.ix .rr-pins li:nth-child(6) { transition-delay: 3.75s !important; }
/* Who Can Benefit pins: whole sequence takes 3.5s (1.3s per pin, 0.44s apart; last starts at 2.2s) */
.ix .rr-pins li[data-reveal] { transition-duration: 1.3s, 1.3s; }
.ix .rr-pins li:nth-child(2) { transition-delay: .44s !important; }
.ix .rr-pins li:nth-child(3) { transition-delay: .88s !important; }
.ix .rr-pins li:nth-child(4) { transition-delay: 1.32s !important; }
.ix .rr-pins li:nth-child(5) { transition-delay: 1.76s !important; }
.ix .rr-pins li:nth-child(6) { transition-delay: 2.2s !important; }

/* Women Entrepreneurship — Our Services steps: slower staircase entrance (was .6s with an 80ms step).
   1.3s per step, 0.35s apart -> all seven in about 3.4s */
.ix .women-steps li[data-reveal] { transform: translateY(26px); transition: opacity 1.3s cubic-bezier(.22, .61, .36, 1), transform 1.3s cubic-bezier(.22, .61, .36, 1); }
.ix .women-steps li[data-reveal].is-visible { transform: none; }
.ix .women-steps li:nth-child(1) { transition-delay: 0s !important; }
.ix .women-steps li:nth-child(2) { transition-delay: .35s !important; }
.ix .women-steps li:nth-child(3) { transition-delay: .7s !important; }
.ix .women-steps li:nth-child(4) { transition-delay: 1.05s !important; }
.ix .women-steps li:nth-child(5) { transition-delay: 1.4s !important; }
.ix .women-steps li:nth-child(6) { transition-delay: 1.75s !important; }
.ix .women-steps li:nth-child(7) { transition-delay: 2.1s !important; }

/* Women Entrepreneurship — Our Services staircase, cleaned up (desktop):
   every column has the same structure — circle, a fixed-height label block, then its step —
   so the circles and labels climb in an even line parallel to the steps instead of
   floating at different heights depending on how many lines a label wraps to. */
@media (min-width: 992px) {
  .women-steps { --rise: 22px; column-gap: 0; }
  .women-steps li { grid-template-rows: 44px 6.4em auto; gap: 1rem; padding: 0 1.1rem; font-size: .95rem; line-height: 1.45; }
  .women-steps li::after { margin: 0 -1.1rem; height: calc(var(--rise) * (var(--i) + 1) + 8px); border-left: 0; box-shadow: inset 1px 0 0 rgba(255, 255, 255, .8); }
  .women-steps li:first-child::after { box-shadow: none; }
}
@media (min-width: 992px) { .women-steps li { align-items: start; } }
/* Staircase labels: the label row is sized to the tallest label (measured in JS -> --ws-label),
   so no label can ever run into its step at any screen width */
@media (min-width: 992px) {
  .women-steps li { grid-template-rows: 44px var(--ws-label, 6.4em) auto; }
}
@media (min-width: 992px) and (max-width: 1279.98px) { .women-steps li { font-size: .875rem; padding: 0 .8rem; } .women-steps li::after { margin: 0 -.8rem; } }