/* Ecosystem page + corporate.html teaser: page-scoped, reuses tokens from style.css.
   No .reveal classes here on purpose: every block stays visible without JavaScript. */

.eco-hero{
  padding:168px 0 88px;
  background:linear-gradient(135deg,var(--ink) 0%,var(--blue-dim) 100%);
  color:var(--white);position:relative;overflow:hidden;
}
.eco-hero::after{
  content:'';position:absolute;inset:0;pointer-events:none;
  background:radial-gradient(55% 60% at 88% 18%,rgba(188,225,56,.14),transparent 70%);
}
.eco-hero__grid{
  position:relative;z-index:1;
  display:grid;grid-template-columns:minmax(0,1.5fr) minmax(0,1fr);gap:56px;align-items:end;
}
.eco-hero .eyebrow{color:var(--lime);}
.eco-hero h1{
  margin-top:16px;color:var(--white);
  font-size:clamp(34px,5vw,60px);letter-spacing:-.03em;line-height:1.06;
}
.eco-hero h1 em{font-style:normal;color:var(--lime);}
.eco-hero__lede{margin-top:22px;max-width:620px;font-size:17px;line-height:1.7;color:rgba(255,255,255,.84);}
.eco-hero__actions{margin-top:32px;display:flex;flex-wrap:wrap;gap:12px;}
.eco-hero__actions .btn-ghost{color:var(--white);border-color:rgba(255,255,255,.4);}
.eco-hero__actions .btn-ghost:hover{border-color:var(--white);}

/* Hero facts: three numbers from the ecosystem model, set as a ruled column */
.eco-facts{margin:0;padding:0;list-style:none;border-top:1px solid rgba(255,255,255,.22);}
.eco-facts li{
  display:grid;grid-template-columns:72px 1fr;gap:16px;align-items:baseline;
  padding:18px 0;border-bottom:1px solid rgba(255,255,255,.22);
}
.eco-facts b{font-size:44px;font-weight:700;letter-spacing:-.03em;color:var(--lime);line-height:1;}
.eco-facts span{font-size:15px;line-height:1.5;color:rgba(255,255,255,.86);}

.eco-section{padding:104px 0;}
.eco-section--gray{background:var(--gray-100);}
.eco-head{max-width:680px;margin-bottom:48px;}
.eco-head .eyebrow{margin-bottom:16px;}
.eco-head h2{font-size:clamp(28px,3.6vw,42px);letter-spacing:-.025em;}
.eco-head p{margin-top:14px;font-size:17px;line-height:1.7;color:var(--gray-700);}

/* Parties: intro left, ruled definition list right */
.eco-split{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.45fr);gap:64px;align-items:start;}
.eco-split .eco-head{margin-bottom:0;position:sticky;top:120px;}
.eco-parties{margin:0;padding:0;border-top:1px solid var(--gray-300);}
.eco-parties div{
  display:grid;grid-template-columns:220px 1fr;gap:24px;
  padding:22px 0;border-bottom:1px solid var(--gray-300);
}
.eco-parties dt{font-size:16px;font-weight:600;color:var(--ink);}
.eco-parties dd{margin:0;font-size:15px;line-height:1.6;color:var(--gray-700);}
.eco-parties div.is-woman dt{color:var(--blue);}

/* Patient pathway: six-step timeline, played once on scroll by js/eco-steps.js.
   Without the script, and under reduced motion, every step, the line and all texts stay visible and still. */
.eco-pathway{
  --path-blue:#1D4ED8;                 /* step circles, start of the line */
  --path-mint:#3CC9A4;                 /* end of the line: the woman's follow-up */
  --path-sky:#E7EEFB;                  /* blue wash in the background */
  --path-leaf:#E3F5EF;                 /* mint wash in the background */
  --path-glow:rgba(29,78,216,.30);
  position:relative;overflow:hidden;isolation:isolate;
}
.eco-pathway > .wrap{position:relative;z-index:1;}
.eco-pathway__bg{
  position:absolute;inset:0;z-index:0;pointer-events:none;
  background:linear-gradient(120deg,var(--gray-100) 0%,var(--path-sky) 34%,var(--path-leaf) 66%,var(--gray-100) 100%);
  background-size:300% 300%;
  animation:eco-path-drift 20s ease-in-out infinite;
}
@keyframes eco-path-drift{0%,100%{background-position:0% 50%;}50%{background-position:100% 50%;}}
/* Tint follows the scroll: blue while the section enters, mint as it leaves (--p from 0 to 1) */
.eco-pathway__tint::before,.eco-pathway__tint::after{content:'';position:absolute;inset:0;}
.eco-pathway__tint::before{background:radial-gradient(70% 80% at 15% 20%,rgba(29,78,216,.10),transparent 70%);opacity:calc(1 - var(--p,0));}
.eco-pathway__tint::after{background:radial-gradient(70% 80% at 85% 80%,rgba(60,201,164,.16),transparent 70%);opacity:var(--p,0);}
/* Faint dot grid, moved slower than the page scroll */
.eco-pathway__grid{
  position:absolute;left:0;right:0;top:-320px;bottom:-320px;
  background-image:radial-gradient(rgba(18,21,28,.10) 1px,transparent 1.4px);background-size:22px 22px;
  transform:translate3d(0,var(--grid-y,0px),0);will-change:transform;
}

.eco-path{position:relative;padding-top:34px;}
.eco-steps{
  margin:0;padding:0;list-style:none;position:relative;z-index:1;
  display:grid;grid-template-columns:repeat(6,minmax(0,1fr));
}
.eco-steps::before{
  content:'';position:absolute;left:20px;right:calc(100% / 6 - 20px);top:19px;height:2px;
  background:linear-gradient(90deg,var(--path-blue),var(--path-mint));
}
.eco-step{position:relative;padding:56px 20px 0 0;border-radius:12px;outline:none;transition:opacity .35s var(--ease);}
.eco-step__num{
  position:absolute;left:0;top:0;width:40px;height:40px;border-radius:50%;z-index:2;
  display:flex;align-items:center;justify-content:center;
  background:var(--path-blue);color:var(--white);font-weight:700;font-size:14px;
  transition:transform .5s cubic-bezier(.34,1.56,.64,1),box-shadow .35s var(--ease);
}
.eco-step__icon{
  position:absolute;left:7px;top:-32px;width:26px;height:26px;border-radius:50%;
  display:flex;align-items:center;justify-content:center;
  background:var(--white);color:var(--path-blue);box-shadow:0 2px 8px rgba(29,78,216,.14);
  opacity:0;transform:translateY(6px);transition:opacity .3s var(--ease),transform .3s var(--ease);
}
.eco-step h3{font-size:17px;letter-spacing:-.01em;margin-bottom:8px;}
.eco-step p{font-size:14.5px;line-height:1.6;color:var(--gray-700);transition:color .3s var(--ease);}

/* The drawn line, its fill and the travelling dot (placed by the script from the circle centres) */
.eco-steps__track{display:none;position:absolute;z-index:0;pointer-events:none;background:rgba(29,78,216,.14);}
.eco-path.is-js .eco-steps::before{display:none;}
.eco-path.is-js .eco-steps__track{display:block;}
.eco-steps__fill{
  position:absolute;inset:0;
  background:linear-gradient(90deg,var(--path-blue),var(--path-mint));
  clip-path:inset(0 calc(100% - var(--fill,1) * 100%) 0 0);
  transition:clip-path .6s linear;
}
.eco-path.is-done .eco-steps__fill{transition-duration:.4s;transition-timing-function:var(--ease);}
.eco-steps__dot{
  position:absolute;left:0;top:50%;width:8px;height:8px;margin:-4px 0 0 -4px;border-radius:50%;
  background:var(--white);box-shadow:0 0 0 2px rgba(60,201,164,.55),0 0 12px 4px rgba(60,201,164,.55);
  opacity:0;transition:opacity .4s var(--ease);
}
.eco-path.is-done:not(.has-active) .eco-steps__dot{opacity:1;animation:eco-dot-x 4.2s linear infinite;}
.eco-pathway.is-away .eco-steps__dot,.eco-pathway.is-away .eco-pathway__bg{animation-play-state:paused;}
@keyframes eco-dot-x{from{left:0;}to{left:100%;}}

/* Hover, focus or tap: the step comes forward, the line fills up to it, the others step back */
.eco-path.is-done .eco-step{cursor:pointer;}
.eco-path.has-active .eco-step:not(.is-active){opacity:.5;}
.eco-step.is-active .eco-step__num{transform:scale(1.15);box-shadow:0 0 0 7px rgba(29,78,216,.12),0 0 22px 6px var(--path-glow);}
.eco-step.is-active .eco-step__icon{opacity:1;transform:none;}
.eco-step.is-active p{color:var(--gray-900);}
.eco-step:focus-visible{box-shadow:0 0 0 3px var(--white),0 0 0 5px var(--path-blue);}

/* Entrance, once per page view: words, then each circle pops and its line draws to the next one */
.eco-pathway.is-anim .eco-w:not(.eyebrow){display:inline-block;}
.eco-pathway.is-anim .eco-w{
  opacity:0;transform:translateY(12px);
  transition:opacity .5s var(--ease),transform .6s var(--ease);transition-delay:calc(var(--i) * 60ms);
}
.eco-pathway.is-anim.is-play .eco-w{opacity:1;transform:none;}
/* Each step opens as the page scrolls on to it: an empty ring and a muted title wait,
   then the circle pops, the line draws to it and the text folds open. Open steps stay open. */
.eco-pathway.is-anim .eco-step::before{
  content:'';position:absolute;left:0;top:0;width:40px;height:40px;border-radius:50%;box-sizing:border-box;
  border:2px solid rgba(29,78,216,.28);background:var(--white);
}
.eco-pathway.is-anim .eco-step:not(.is-in) .eco-step__num{transform:scale(0);}
.eco-pathway.is-anim .eco-step h3{opacity:.45;transition:opacity .45s var(--ease) .15s,color .3s var(--ease);}
.eco-pathway.is-anim .eco-step p{
  overflow:hidden;max-height:0;opacity:0;transform:translateY(-6px);
  transition:max-height .6s var(--ease) .15s,opacity .45s var(--ease) .3s,transform .5s var(--ease) .3s,color .3s var(--ease);
}
.eco-pathway.is-anim .eco-step.is-in h3{opacity:1;}
.eco-pathway.is-anim .eco-step:not(.is-in){cursor:pointer;}
.eco-pathway.is-anim .eco-step.is-in p{opacity:1;transform:none;}
.eco-steps__count{margin-top:36px;font-size:14px;font-weight:600;color:var(--gray-700);}
.eco-steps__count[hidden]{display:none;}

@media print{
  .eco-pathway__bg,.eco-steps__track{display:none !important;}
  .eco-path.is-js .eco-steps::before{display:block;}
  .eco-pathway .eco-w,.eco-pathway .eco-step h3,.eco-pathway .eco-step p,.eco-pathway .eco-step__num{opacity:1 !important;transform:none !important;max-height:none !important;}
  .eco-steps__count{display:none;}
}

/* Data governance: big statement left, rule list right, on the gray band */
.eco-rules{margin:0;padding:0;list-style:none;}
.eco-rules li{
  position:relative;padding:18px 0 18px 28px;border-bottom:1px solid var(--gray-300);
  font-size:16px;line-height:1.6;color:var(--gray-700);
}
.eco-rules li:first-child{border-top:1px solid var(--gray-300);}
.eco-rules li::before{
  content:'';position:absolute;left:0;top:27px;width:10px;height:2px;background:var(--teal);
}
.eco-rules b{color:var(--ink);font-weight:600;}

/* Kit supply: two-column numbered index list */
.eco-index{
  margin:0;padding:0;list-style:none;counter-reset:eco;
  display:grid;grid-template-columns:repeat(2,minmax(0,1fr));column-gap:64px;
}
.eco-index li{
  counter-increment:eco;display:grid;grid-template-columns:56px 1fr;gap:12px;
  padding:22px 0;border-top:1px solid var(--gray-300);
}
.eco-index li::before{
  content:counter(eco,decimal-leading-zero);
  font-size:28px;font-weight:700;letter-spacing:-.02em;color:var(--teal-dim);line-height:1.1;
}
.eco-index h3{font-size:17px;margin-bottom:6px;}
.eco-index p{font-size:15px;line-height:1.6;color:var(--gray-700);}

/* CarciScan in the ecosystem: facts column + responsibility table */
.eco-assay{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.2fr);gap:64px;align-items:start;}
.eco-assay__facts{margin:28px 0 0;padding:0;list-style:none;}
.eco-assay__facts li{padding:12px 0;border-bottom:1px solid var(--gray-100);font-size:15px;line-height:1.55;color:var(--gray-700);}
.eco-assay__facts b{display:block;font-size:12.5px;text-transform:uppercase;letter-spacing:.06em;color:var(--teal-dim);margin-bottom:2px;}
.eco-assay__link{margin-top:24px;display:inline-block;font-weight:600;color:var(--blue);}
.eco-assay__link:hover{text-decoration:underline;}

.eco-table{
  border:1px solid var(--gray-300);border-radius:var(--radius);overflow:hidden;background:var(--white);
}
.eco-table table{width:100%;border-collapse:collapse;}
.eco-table caption{
  text-align:left;padding:18px 22px;font-size:13px;font-weight:600;text-transform:uppercase;
  letter-spacing:.06em;color:var(--gray-700);border-bottom:1px solid var(--gray-300);
}
.eco-table th,.eco-table td{padding:18px 22px;text-align:left;vertical-align:top;border-bottom:1px solid var(--gray-100);}
.eco-table tr:last-child th,.eco-table tr:last-child td{border-bottom:none;}
.eco-table th{width:36%;font-size:15px;font-weight:600;color:var(--ink);}
.eco-table td{font-size:14.5px;line-height:1.6;color:var(--gray-700);}
.eco-table tr.is-malaya th{color:var(--blue);}

/* Audiences: unequal field layout, one wide row for the women */
.eco-audience{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:0;}
.eco-audience > div{padding:28px 32px 28px 0;border-top:2px solid var(--ink);}
.eco-audience > div + div{padding-left:32px;border-left:1px solid var(--gray-300);}
.eco-audience h3{font-size:19px;margin-bottom:10px;}
.eco-audience p{font-size:15px;line-height:1.6;color:var(--gray-700);}
.eco-audience__women{
  grid-column:1 / -1;margin-top:40px;padding:40px 44px !important;border:none !important;
  background:var(--blue);color:var(--white);border-radius:var(--radius);
  display:grid;grid-template-columns:auto 1fr;gap:40px;align-items:center;
}
.eco-audience__women b{font-size:clamp(44px,6vw,72px);font-weight:700;letter-spacing:-.03em;line-height:1;color:var(--lime);}
.eco-audience__women h3{color:var(--white);}
.eco-audience__women p{color:rgba(255,255,255,.88);}

.eco-note{
  margin-top:56px;padding-top:20px;border-top:1px solid var(--gray-300);
  font-size:13px;line-height:1.65;color:var(--gray-700);max-width:860px;
}

/* CTA band */
.eco-cta{padding:96px 0;background:var(--ink);color:var(--white);}
.eco-cta__grid{display:grid;grid-template-columns:minmax(0,1.4fr) auto;gap:40px;align-items:center;}
.eco-cta h2{color:var(--white);font-size:clamp(26px,3.4vw,40px);letter-spacing:-.025em;}
.eco-cta p{margin-top:12px;color:rgba(255,255,255,.78);font-size:16.5px;line-height:1.65;}
.eco-cta__actions{display:flex;flex-wrap:wrap;gap:12px;}

/* corporate.html teaser band (sits right after #access-story) */
.eco-teaser{padding:88px 0;background:var(--gray-100);}
.eco-teaser__grid{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,1fr);gap:56px;align-items:center;}
.eco-teaser h2{font-size:clamp(26px,3.4vw,40px);letter-spacing:-.025em;margin-top:16px;}
.eco-teaser p{margin-top:14px;font-size:16.5px;line-height:1.7;color:var(--gray-700);}
.eco-teaser .btn{margin-top:26px;}
.eco-teaser__list{margin:0;padding:0;list-style:none;border-top:1px solid var(--gray-300);}
.eco-teaser__list li{
  display:grid;grid-template-columns:56px 1fr;gap:14px;align-items:baseline;
  padding:18px 0;border-bottom:1px solid var(--gray-300);font-size:15.5px;line-height:1.5;color:var(--gray-700);
}
.eco-teaser__list b{font-size:30px;font-weight:700;letter-spacing:-.02em;color:var(--blue);line-height:1;}

a:focus-visible,.btn:focus-visible{outline:3px solid var(--lime);outline-offset:3px;}

/* Below desktop the pathway stacks vertically and its line draws from top to bottom */
@media (max-width:1099.98px){
  .eco-steps{grid-template-columns:1fr;row-gap:0;max-width:680px;}
  .eco-steps::before{left:19px;right:auto;top:20px;bottom:auto;width:2px;height:calc(100% - 60px);
    background:linear-gradient(180deg,var(--path-blue),var(--path-mint));}
  .eco-step{padding:4px 0 40px 64px;}
  .eco-step:last-child{padding-bottom:4px;}
  .eco-path.is-vert .eco-steps__fill{
    background:linear-gradient(180deg,var(--path-blue),var(--path-mint));
    clip-path:inset(0 0 calc(100% - var(--fill,1) * 100%) 0);
  }
  .eco-path.is-vert .eco-steps__dot{left:50%;top:0;margin:-4px 0 0 -4px;}
  .eco-path.is-vert.is-done:not(.has-active) .eco-steps__dot{animation-name:eco-dot-y;}
}
@keyframes eco-dot-y{from{top:0;}to{top:100%;}}
@media (max-width:860px){
  .eco-hero{padding:124px 0 56px;}
  .eco-hero__grid,.eco-split,.eco-assay,.eco-teaser__grid,.eco-cta__grid{grid-template-columns:1fr;gap:36px;}
  .eco-split .eco-head{position:static;}
  .eco-section{padding:72px 0;}
  .eco-parties div{grid-template-columns:1fr;gap:6px;}
  .eco-index{grid-template-columns:1fr;}
  .eco-table th,.eco-table td{display:block;width:auto;padding:6px 18px;}
  .eco-table th{padding-top:16px;}
  .eco-table td{padding-bottom:16px;}
  .eco-table tr{display:block;border-bottom:1px solid var(--gray-100);}
  .eco-table th,.eco-table td{border-bottom:none;}
  .eco-audience{grid-template-columns:1fr;}
  .eco-audience > div,.eco-audience > div + div{padding:24px 0;border-left:none;}
  .eco-audience__women{grid-template-columns:1fr;gap:16px;padding:32px 26px !important;}
  .eco-teaser,.eco-cta{padding:64px 0;}
}
@media (prefers-reduced-motion:reduce){
  *{scroll-behavior:auto !important;}
  .eco-pathway__bg{animation:none;}
  .eco-pathway__grid{transform:none;}
  .eco-steps__dot{display:none;}
  .eco-step,.eco-step__num,.eco-step__icon,.eco-step p,.eco-steps__fill{transition:none;}
}

/* Deck graphics: ecosystem hub diagram + patient app concept screens */
.eco-figure{margin:0 0 72px;}
.eco-figure img{display:block;width:100%;height:auto;}
.eco-figure figcaption,.eco-caption{margin-top:14px;font-size:13px;line-height:1.6;color:var(--gray-700);}
.eco-app{background:linear-gradient(180deg,var(--white) 0%,rgba(24,80,225,.07) 100%);}
.eco-app__grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.1fr);gap:72px;align-items:center;}
.eco-app__phones{display:flex;justify-content:center;gap:24px;}
.eco-app__phones img{width:min(46%,240px);height:auto;filter:drop-shadow(0 28px 36px rgba(11,14,20,.18));}
.eco-app__phones img + img{margin-top:56px;}
@media (max-width:860px){
  .eco-figure{margin-bottom:48px;margin-left:-16px;margin-right:-16px;}
  .eco-figure figcaption{padding:0 16px;}
  .eco-app__grid{grid-template-columns:1fr;gap:40px;}
  .eco-app__phones img + img{margin-top:36px;}
}
