/* Science & Research — Oncology Excellence subpage. All rules scoped under .oe */

@keyframes oeShine { 0%, 60% { transform: translateX(-120%) skewX(-20deg); } 100% { transform: translateX(320%) skewX(-20deg); } }
@keyframes oeRing { 0% { transform: scale(1); opacity: .8; } 100% { transform: scale(1.7); opacity: 0; } }
@keyframes oeFlow { to { stroke-dashoffset: -32; } }
@keyframes oeSpin { to { transform: rotate(360deg); } }

.oe { font-family: Poppins, sans-serif; color: #fff; }
.oe *, .oe *::before, .oe *::after { box-sizing: border-box; }
.oe a { color: #fff; }
.oe a:hover { color: #8ff7dc; }
.oe .oe-icon { font-family: 'Material Symbols Outlined'; font-weight: 400; font-style: normal; line-height: 1; letter-spacing: normal; text-transform: none; white-space: nowrap; direction: ltr; -webkit-font-feature-settings: 'liga'; font-feature-settings: 'liga'; -webkit-font-smoothing: antialiased; }
.oe .oe-mint { color: #8ff7dc; }

.oe .oe-eyebrow { display: flex; align-items: center; gap: 10px; font-family: 'JetBrains Mono', monospace; font-size: 11px; font-weight: 600; letter-spacing: 3px; color: #8ff7dc; }
.oe .oe-eyebrow__dot { width: 7px; height: 7px; border-radius: 50%; background: #8ff7dc; }
.oe .oe-eyebrow--white { color: #fff; }

/* Shared hexagon clip */
.oe .oe-approvals__hex,
.oe .oe-hex__edge, .oe .oe-hex__face,
.oe .oe-hex-core__edge, .oe .oe-hex-core__face { clip-path: polygon(50% 0, 100% 25%, 100% 75%, 50% 100%, 0 75%, 0 25%); }

/* ============ 03 ONCOLOGY EXCELLENCE ============ */
.oe .oe-intro { position: relative; height: 340vh; background: #12103b; }
.oe .oe-intro__pin { position: sticky; top: 0; height: 100vh; overflow: hidden; }
.oe .oe-intro__bg { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; object-position: 30% 50%; display: block; transform: scale(1.3); will-change: transform; }
.oe .oe-intro__bg--slide2 { opacity: 0; will-change: transform, opacity; }
.oe .oe-intro__shade-x { position: absolute; inset: 0; background: linear-gradient(90deg, rgba(18, 16, 59, .72) 0%, rgba(0, 15, 159, .50) 48%, rgba(0, 15, 159, .10) 100%); }
.oe .oe-intro__shade-y { position: absolute; inset: 0; background: linear-gradient(0deg, rgba(18, 16, 59, .66) 0%, rgba(18, 16, 59, 0) 45%); }
.oe .oe-intro__stage { position: relative; height: 100%; }

.oe .oe-intro__head { position: absolute; left: 5vw; right: 5vw; top: 50%; margin-top: -24vh; display: flex; flex-direction: column; gap: 3.4vh; max-width: 980px; opacity: 0; will-change: transform, opacity; }
.oe .oe-intro__title { margin: 0; font-size: min(5.4vw, 9vh, 92px); line-height: .95; font-weight: 800; letter-spacing: -.055em; text-wrap: balance; }
.oe .oe-intro__lede { margin: 0; max-width: 600px; font-size: min(1.25vw, 2.5vh, 18px); line-height: 1.72; text-wrap: pretty; opacity: 0; }

.oe .oe-intro__grid { position: absolute; left: 5vw; right: 5vw; top: 50%; transform: translateY(-50%); display: grid; grid-template-columns: minmax(0, .85fr) minmax(0, 1.15fr); gap: 3vw; align-items: center; }
.oe .oe-intro__copy { display: flex; flex-direction: column; gap: 4vh; min-width: 0; }
.oe .oe-approvals { display: flex; flex-direction: column; gap: 2.4vh; opacity: 0; }
.oe .oe-approvals__label { display: flex; align-items: center; gap: 10px; font-family: 'JetBrains Mono', monospace; font-size: 11px; font-weight: 600; letter-spacing: 3px; color: #8ff7dc; }
.oe .oe-approvals__rule { width: 28px; height: 1px; background: #8ff7dc; }
.oe .oe-approvals__statement { display: flex; flex-direction: column; align-items: flex-start; gap: .38em; font-size: min(2.15vw, 4vh, 36px); line-height: 1.15; font-weight: 800; letter-spacing: -.01em; }
.oe .oe-approvals__line { display: block; white-space: nowrap; }
.oe .oe-approvals__only { color: #12103b; background: #8ff7dc; padding: 0 .2em; border-radius: .18em; }
.oe .oe-approvals__tags { display: flex; gap: 18px; flex-wrap: wrap; font-family: 'JetBrains Mono', monospace; font-size: 11px; font-weight: 600; letter-spacing: 2.5px; }
.oe .oe-approvals__tag { display: flex; align-items: center; gap: 8px; color: #fff; }
.oe .oe-approvals__tag--dim { color: #8ff7dc; }
.oe .oe-approvals__hex { width: 14px; height: 16px; background: #8ff7dc; }
.oe .oe-approvals__tag--dim .oe-approvals__hex { opacity: .5; }
.oe .oe-intro__quote { max-width: 460px; padding-left: 18px; border-left: 3px solid #8ff7dc; font-size: min(1.2vw, 2.4vh, 18px); line-height: 1.6; font-weight: 600; color: #fff; text-wrap: pretty; opacity: 0; }

/* Hexagon cluster */
.oe .oe-hexwrap { position: relative; min-width: 0; display: flex; justify-content: center; }
.oe .oe-hex-cluster { --w: min(10.5vw, 19vh, 170px); position: relative; width: calc(var(--w) * 3.5); height: calc(var(--w) * 3.25); }
.oe .oe-hex-orbit,
.oe .oe-hex-sweep { position: absolute; left: 50%; top: 50%; width: calc(var(--w) * 3.5); height: calc(var(--w) * 3.5); margin: calc(var(--w) * -1.75) 0 0 calc(var(--w) * -1.75); border-radius: 50%; pointer-events: none; }
.oe .oe-hex-orbit { border: 1px dashed rgba(143, 247, 220, .35); animation: oeSpin 40s linear infinite; }
.oe .oe-hex-sweep { background: conic-gradient(from 0deg, rgba(143, 247, 220, 0) 0deg, rgba(143, 247, 220, .2) 30deg, rgba(143, 247, 220, 0) 70deg); animation: oeSpin 7s linear infinite; }
.oe .oe-hex-links { position: absolute; inset: 0; width: 100%; height: 100%; overflow: visible; pointer-events: none; }
.oe .oe-hex-links line { stroke-dasharray: 6 10; animation: oeFlow 1.4s linear infinite; }

.oe .oe-hex { position: absolute; left: calc(50% + var(--dx) * var(--w) - var(--w) / 2); top: calc(50% + var(--dy) * var(--w) - var(--w) * .5774); width: var(--w); height: calc(var(--w) * 1.1547); opacity: 0; will-change: transform, opacity; }
.oe .oe-hex__hover { position: absolute; inset: 0; filter: drop-shadow(0 18px 30px rgba(5, 15, 70, .45)); transition: transform .45s cubic-bezier(.2, 0, 0, 1), filter .45s ease; }
.oe .oe-hex__hover:hover { transform: scale(1.08); filter: drop-shadow(0 0 26px rgba(143, 247, 220, .65)); }
.oe .oe-hex__edge { position: absolute; inset: 0; background: rgba(143, 247, 220, .65); }
.oe .oe-hex__face { position: absolute; inset: 2px; background: rgba(18, 16, 59, .72); -webkit-backdrop-filter: blur(14px); backdrop-filter: blur(14px); color: #fff; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: calc(var(--w) * .03); text-align: center; overflow: hidden; }
.oe .oe-hex__shine { position: absolute; top: 0; bottom: 0; left: 0; width: 45%; background: linear-gradient(90deg, rgba(255, 255, 255, 0), rgba(255, 255, 255, .3), rgba(255, 255, 255, 0)); animation: oeShine 5s ease-in-out infinite; animation-delay: var(--dl); pointer-events: none; }
.oe .oe-hex__icon { font-size: calc(var(--w) * .13); color: #8ff7dc; }
.oe .oe-hex__sym { font-size: calc(var(--w) * .3); line-height: .9; font-weight: 800; letter-spacing: -.05em; color: #8ff7dc; }
.oe .oe-hex__label { max-width: 76%; font-size: max(10.5px, calc(var(--w) * .078)); line-height: 1.15; font-weight: 700; }
.oe .oe-hex--cap .oe-hex__edge { background: #8ff7dc; }
.oe .oe-hex--cap .oe-hex__face { background: #8ff7dc; color: #12103b; }
.oe .oe-hex--cap .oe-hex__icon,
.oe .oe-hex--cap .oe-hex__sym { color: #12103b; }

.oe .oe-hex-core { position: absolute; left: calc(50% - var(--w) / 2); top: calc(50% - var(--w) * .5774); width: var(--w); height: calc(var(--w) * 1.1547); }
.oe .oe-hex-core__ring { position: absolute; inset: -14%; border-radius: 50%; border: 2px solid rgba(143, 247, 220, .55); animation: oeRing 2.8s ease-out infinite; pointer-events: none; }
.oe .oe-hex-core__ring--late { animation-delay: 1.4s; }
.oe .oe-hex-core__edge { position: absolute; inset: 0; background: #8ff7dc; }
.oe .oe-hex-core__face { position: absolute; inset: 3px; background: radial-gradient(circle at 35% 25%, #1f4fff 0%, #000f9f 50%, #12103b 100%); display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 4px; text-align: center; }
.oe .oe-hex-core__icon { font-size: calc(var(--w) * .22); color: #8ff7dc; }
.oe .oe-hex-core__title { font-size: calc(var(--w) * .16); line-height: .95; font-weight: 800; letter-spacing: -.03em; color: #fff; }
.oe .oe-hex-core__sub { font-family: 'JetBrains Mono', monospace; font-size: max(9px, calc(var(--w) * .055)); font-weight: 600; letter-spacing: 2px; color: #8ff7dc; }

/* ============ 04 BUILT FOR ONCOLOGY THERAPIES ============ */
.oe .oe-fac { position: relative; height: 440vh; background: #046459; }
.oe .oe-fac__pin { position: sticky; top: 0; height: 100vh; overflow: hidden; display: grid; grid-template-columns: min(32vw, 460px) minmax(0, 1fr); align-items: center; }
.oe .oe-fac__side { display: flex; flex-direction: column; gap: 3vh; padding: 0 3vw 0 5vw; }
.oe .oe-fac__title { margin: 0; display: flex; flex-direction: column; gap: 1.4vh; }
.oe .oe-fac__title-main { font-size: min(3.4vw, 6vh, 54px); line-height: 1; font-weight: 800; letter-spacing: -.045em; }
.oe .oe-fac__title-sub { font-size: min(1.15vw, 2.3vh, 17px); font-weight: 400; line-height: 1.6; color: #fff; text-wrap: pretty; }
.oe .oe-fac__progress { display: flex; align-items: center; gap: 16px; margin-top: 2vh; }
.oe .oe-fac__count { font-family: 'JetBrains Mono', monospace; font-size: 13px; font-weight: 600; color: #8ff7dc; min-width: 56px; }
.oe .oe-fac__rail { position: relative; flex: 1; height: 2px; background: rgba(255, 255, 255, .25); overflow: hidden; }
.oe .oe-fac__bar { position: absolute; inset: 0; background: #8ff7dc; transform-origin: left; transform: scaleX(0); }
.oe .oe-fac__viewport { position: relative; height: 100%; overflow: hidden; display: flex; align-items: center; }
.oe .oe-fac__track { display: flex; gap: 24px; padding: 0 8vw 0 1vw; will-change: transform; }

.oe .oe-fcard { position: relative; flex: none; width: min(34vw, 500px); height: min(76vh, 640px); border-radius: 30px; overflow: hidden; background: #000f9f; box-shadow: 0 40px 80px rgba(5, 15, 70, .45); }
.oe .oe-fcard__img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; display: block; will-change: transform; }
.oe .oe-fcard__shade { position: absolute; inset: 0; background: linear-gradient(0deg, rgba(18, 16, 59, .97) 0%, rgba(18, 16, 59, .75) 38%, rgba(18, 16, 59, 0) 70%); }
.oe .oe-fcard__copy { position: absolute; left: 28px; right: 28px; bottom: 30px; display: flex; flex-direction: column; gap: 1.6vh; }
.oe .oe-fcard__rule { display: block; width: 40px; height: 3px; border-radius: 2px; background: #8ff7dc; }
.oe .oe-fcard__title { font-size: min(1.9vw, 3.4vh, 28px); line-height: 1.1; font-weight: 800; letter-spacing: -.03em; }
.oe .oe-fcard__text { font-size: min(1vw, 2vh, 15px); line-height: 1.6; color: #fff; text-wrap: pretty; }

/* ============ 05 IMPROVING ACCESS ============ */
.oe .oe-access { position: relative; height: 250vh; background: #0fb39b; }
.oe .oe-access__pin { position: sticky; top: 0; height: 100vh; overflow: hidden; }
.oe .oe-access__reveal { position: absolute; inset: 0; clip-path: circle(14% at 72% 52%); will-change: clip-path; }
.oe .oe-access__img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; object-position: 60% 30%; display: block; }
.oe .oe-access__shade { position: absolute; inset: 0; background: linear-gradient(90deg, rgba(0, 15, 159, .94) 0%, rgba(0, 15, 159, .7) 45%, rgba(0, 15, 159, .1) 100%); opacity: 0; }
.oe .oe-access__content { position: relative; height: 100%; display: flex; flex-direction: column; justify-content: center; gap: 4vh; padding: 0 5vw; max-width: 900px; }
.oe .oe-access__title { margin: 0; font-size: min(5vw, 8.6vh, 80px); line-height: .98; font-weight: 800; letter-spacing: -.05em; text-wrap: balance; will-change: transform; }
.oe .oe-access__words { margin: 0; display: flex; flex-wrap: wrap; column-gap: .28em; row-gap: .1em; font-size: min(1.6vw, 3vh, 24px); line-height: 1.45; font-weight: 500; }
.oe .oe-access__word { opacity: .3; color: #fff; transition: opacity .35s ease, color .35s ease; }
.oe .oe-access__card { position: absolute; right: 5vw; bottom: 7vh; width: min(18vw, 260px); aspect-ratio: 4 / 5; border-radius: 24px; overflow: hidden; border: 6px solid #fff; box-shadow: 0 30px 60px rgba(5, 15, 70, .4); opacity: 0; will-change: transform, opacity; }
.oe .oe-access__card img { width: 100%; height: 100%; object-fit: cover; display: block; }