/* * V7.3.2 | BIOTEN patent R&D proof and blue-green color-field refinement * Visual thesis: scientific mineral surfaces + emerald / technology-blue blocks. */ body.bioten-platform-v580 { --btp732-blue: #075fae; --btp732-blue-deep: #06395f; --btp732-emerald: #078a76; --btp732-emerald-deep: #075447; --btp732-mint: #8ce1cd; --btp732-cyan: #83cce8; --btp732-ink: #071f2b; --btp732-ease: cubic-bezier(0.22, 1, 0.36, 1); } /* A little more blue-green depth in the first viewport without obscuring the material field. */ body.bioten-platform-v580 .btp580-hero::after { content: ""; position: absolute; z-index: 1; inset: auto 0 0; height: 22%; background: linear-gradient(90deg, rgba(255, 255, 255, 0), rgba(15, 129, 155, 0.06) 58%, rgba(4, 127, 106, 0.14)); pointer-events: none; } body.bioten-platform-v580 .btp580-hero__inner, body.bioten-platform-v580 .btp580-hero__visual { z-index: 2; } body.bioten-platform-v580 .btp580-hero__lead { max-width: 650px; color: #435b58; } /* The R&D field is split into an emerald material zone and a blue evidence zone. */ body.bioten-platform-v580 .btp731-science { background: linear-gradient(rgba(7, 83, 74, 0.032) 1px, transparent 1px), linear-gradient(90deg, rgba(7, 83, 74, 0.032) 1px, transparent 1px), radial-gradient(circle at 86% 12%, rgba(68, 166, 220, 0.17), transparent 27%), linear-gradient(112deg, #eff8f4 0 42%, #edf5f9 42% 100%); background-size: 64px 64px, 64px 64px, auto, auto; } body.bioten-platform-v580 .btp731-science::after { content: ""; position: absolute; z-index: -1; top: 0; right: 0; width: clamp(120px, 16vw, 260px); height: clamp(210px, 26vw, 410px); background: linear-gradient(180deg, rgba(11, 104, 180, 0.09), rgba(10, 139, 116, 0)); clip-path: polygon(28% 0, 100% 0, 100% 100%, 0 74%); pointer-events: none; } /* Patent portfolio proof: one large editorial slab, not a generic stat strip. */ body.bioten-platform-v580 .btp732-ip { position: relative; display: grid; grid-template-columns: minmax(0, 1.18fr) minmax(430px, 0.82fr); gap: 0; margin: 0 0 28px; overflow: hidden; border: 7px solid rgba(255, 255, 255, 0.48); border-radius: 27px; background: radial-gradient(circle at 12% 0%, rgba(125, 221, 199, 0.18), transparent 34%), linear-gradient(135deg, #061f31 0%, #063b54 52%, #07564a 100%); box-shadow: inset 0 0 0 1px rgba(222, 250, 242, 0.11), 0 30px 80px rgba(7, 47, 65, 0.16); color: #f4fbf9; } body.bioten-platform-v580 .btp732-ip::before { content: "IP / R&D"; position: absolute; top: 28px; right: 32px; color: rgba(225, 249, 243, 0.12); font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace; font-size: 10px; font-weight: 720; letter-spacing: 0.2em; } body.bioten-platform-v580 .btp732-ip__copy { display: flex; min-width: 0; min-height: 295px; flex-direction: column; justify-content: center; padding: 42px 44px 40px; } body.bioten-platform-v580 .btp732-ip__eyebrow { margin: 0 0 16px; color: #8fe2ce; font-size: 9px; font-weight: 760; letter-spacing: 0.18em; line-height: 1.2; } html body.bioten-platform-v580.bioten-platform-v580 main.btp580-main .btp732-ip h3 { max-width: 650px; margin: 0; color: #f6fcfa !important; font-size: clamp(27px, 2.45vw, 38px) !important; letter-spacing: -0.042em !important; line-height: 1.16 !important; text-wrap: balance; } body.bioten-platform-v580 .btp732-ip__copy > p:last-child { max-width: 660px; margin: 17px 0 0; color: rgba(232, 247, 243, 0.66); font-size: 13px; line-height: 1.72; } body.bioten-platform-v580 .btp732-ip__metrics { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); align-self: stretch; margin: 0; padding: 48px 30px 58px 0; } body.bioten-platform-v580 .btp732-ip__metric { display: flex; min-width: 0; flex-direction: column; justify-content: center; padding: 22px 24px; border-left: 1px solid rgba(222, 250, 242, 0.13); } body.bioten-platform-v580 .btp732-ip__metric dt { display: flex; flex-direction: column; } body.bioten-platform-v580 .btp732-ip__metric strong { color: #f6fffc; font-size: clamp(37px, 3.3vw, 51px); font-weight: 760; letter-spacing: -0.065em; line-height: 0.95; } body.bioten-platform-v580 .btp732-ip__metric span { margin-top: 12px; color: #89dfca; font-size: 9px; font-weight: 720; letter-spacing: 0.11em; line-height: 1.45; } body.bioten-platform-v580 .btp732-ip__metric dd { margin: 9px 0 0; color: rgba(231, 247, 242, 0.54); font-size: 10px; line-height: 1.55; } body.bioten-platform-v580 .btp732-ip__evidence { position: absolute; right: 0; bottom: 0; left: 0; display: flex; min-height: 46px; align-items: center; justify-content: space-between; gap: 20px; padding: 10px 27px; border-top: 1px solid rgba(222, 250, 242, 0.1); background: rgba(3, 21, 31, 0.24); } body.bioten-platform-v580 .btp732-ip__evidence p { max-width: 900px; margin: 0; color: rgba(226, 244, 239, 0.43); font-size: 8.5px; line-height: 1.55; } body.bioten-platform-v580 .btp732-ip__sources { display: flex; flex: 0 0 auto; gap: 15px; } body.bioten-platform-v580 .btp732-ip__sources a { color: rgba(230, 249, 243, 0.65); font-size: 8.5px; font-weight: 650; line-height: 1.4; text-decoration: none; transition: color 360ms var(--btp732-ease), transform 360ms var(--btp732-ease); } body.bioten-platform-v580 .btp732-ip__sources a::after { content: " ↗"; color: #83d9c4; } body.bioten-platform-v580 .btp732-ip__sources a:hover { color: #9fead8; transform: translate3d(0, -1px, 0); } /* Applications get a blue editorial field; evidence closes in a deeper emerald field. */ body.bioten-platform-v580 .btp580-domains { position: relative; isolation: isolate; overflow: hidden; background: radial-gradient(circle at 86% 10%, rgba(66, 167, 221, 0.16), transparent 27%), linear-gradient(122deg, #f8fbfa 0 58%, #edf5fa 58% 100%); } body.bioten-platform-v580 .btp580-domains::before { content: "APPLICATION / 02"; position: absolute; z-index: -1; top: clamp(72px, 6vw, 100px); right: max(28px, calc((100vw - 1180px) / 2)); color: rgba(5, 92, 160, 0.055); font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace; font-size: clamp(42px, 6vw, 90px); font-weight: 760; letter-spacing: -0.055em; line-height: 0.9; } body.bioten-platform-v580 .btp580-close { background: linear-gradient(rgba(6, 89, 78, 0.03) 1px, transparent 1px), radial-gradient(circle at 84% 13%, rgba(71, 167, 221, 0.18), transparent 29%), linear-gradient(132deg, #e4f1ec 0 52%, #dfeef4 52% 100%); background-size: 72px 72px, auto, auto; } @media (max-width: 1100px) { body.bioten-platform-v580 .btp732-ip { grid-template-columns: minmax(0, 1fr) minmax(360px, 0.82fr); } body.bioten-platform-v580 .btp732-ip__copy { padding-inline: 34px; } body.bioten-platform-v580 .btp732-ip__metrics { padding-right: 18px; } body.bioten-platform-v580 .btp732-ip__metric { padding-inline: 17px; } } @media (max-width: 820px) { body.bioten-platform-v580 .btp732-ip { grid-template-columns: 1fr; } body.bioten-platform-v580 .btp732-ip__copy { min-height: 0; padding: 36px 34px 25px; } body.bioten-platform-v580 .btp732-ip__metrics { padding: 0 28px 69px; } body.bioten-platform-v580 .btp732-ip__metric:first-child { border-left: 0; } } @media (max-width: 640px) { body.bioten-platform-v580 .btp580-hero__lead { max-width: 360px; font-size: 13.5px; } body.bioten-platform-v580 .btp731-science { background-size: 36px 36px, 36px 36px, auto, auto; } body.bioten-platform-v580 .btp732-ip { margin-bottom: 19px; border-width: 5px; border-radius: 22px; } body.bioten-platform-v580 .btp732-ip::before { top: 20px; right: 20px; font-size: 8px; } body.bioten-platform-v580 .btp732-ip__copy { padding: 31px 22px 22px; } html body.bioten-platform-v580.bioten-platform-v580 main.btp580-main .btp732-ip h3 { max-width: 310px; font-size: 25px !important; line-height: 1.14 !important; } body.bioten-platform-v580 .btp732-ip__copy > p:last-child { margin-top: 13px; font-size: 11.5px; line-height: 1.65; } body.bioten-platform-v580 .btp732-ip__metrics { padding: 0 17px 98px; } body.bioten-platform-v580 .btp732-ip__metric { min-height: 128px; padding: 18px 13px; } body.bioten-platform-v580 .btp732-ip__metric strong { font-size: 35px; } body.bioten-platform-v580 .btp732-ip__metric span { margin-top: 9px; font-size: 7.5px; letter-spacing: 0.07em; } body.bioten-platform-v580 .btp732-ip__metric dd { margin-top: 6px; font-size: 8px; } body.bioten-platform-v580 .btp732-ip__evidence { min-height: 91px; align-items: flex-start; flex-direction: column; gap: 7px; padding: 10px 15px 11px; } body.bioten-platform-v580 .btp732-ip__evidence p { font-size: 7.5px; line-height: 1.45; } body.bioten-platform-v580 .btp732-ip__sources { gap: 13px; } body.bioten-platform-v580 .btp732-ip__sources a { font-size: 8px; } body.bioten-platform-v580 .btp580-domains::before { content: "APPLICATION"; top: 65px; right: 18px; font-size: 41px; } } html[data-lang="en"] body.bioten-platform-v580 .btp732-ip__metric span { letter-spacing: 0.07em; } @media (max-width: 640px) { html[data-lang="en"] body.bioten-platform-v580 .btp732-ip__copy { padding-top: 36px; } html[data-lang="en"] body.bioten-platform-v580.bioten-platform-v580 main.btp580-main .btp732-ip h3 { font-size: 22px !important; } html[data-lang="en"] body.bioten-platform-v580 .btp732-ip__metric strong { font-size: 28px; } html[data-lang="en"] body.bioten-platform-v580 .btp732-ip__metrics { padding-bottom: 109px; } html[data-lang="en"] body.bioten-platform-v580 .btp732-ip__evidence { min-height: 103px; } } @media (prefers-reduced-motion: reduce) { body.bioten-platform-v580 .btp732-ip__sources a { transition: none; } }