/* Stack the CTMS introduction and clinical workflow in one centered column. */
.study-system-comparison { grid-template-columns: minmax(0, 1fr); align-items: center; gap: 24px; text-align: center; }
.study-system-comparison > div { width: 100%; max-width: 800px; margin-inline: auto; }

/* Research features use the homepage opportunities section's divided list layout. */
.study-features { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 80px; align-items: center; }
.study-feature-list { margin: 0; }
.study-feature-list > div { display: grid; grid-template-columns: minmax(0, .85fr) minmax(0, 1.3fr); align-items: start; gap: 24px; padding-block: 14px; border-bottom: 1px solid #ffffff26; }
.study-feature-list > div:first-child { padding-top: 0; }
.study-feature-list dt { color: #f9fafe; font-size: 16px; font-weight: 400; line-height: 1.5; }
.study-feature-list dd { margin: 0; color: #d8dff9; font-size: 14px; line-height: 1.65; text-align: right; }
@media (max-width: 1100px) {
    .study-features { gap: 50px; }
}
@media (max-width: 900px) {
    .study-features { grid-template-columns: minmax(0, 1fr); gap: 38px; }
}
@media (max-width: 560px) {
    .study-feature-list > div { grid-template-columns: minmax(0, 1fr); gap: 6px; padding-block: 18px; }
    .study-feature-list dt { font-size: 15px; font-weight: 600; }
    .study-feature-list dd { text-align: center; }
}

/* The participant chart connects the research site's four clinical workflows. */
.study-care-flow { margin: 0; }
.study-care-network { position: relative; isolation: isolate; background: radial-gradient(ellipse at center, #e6edff, #f1f5ff80 36%, transparent 70%); }
.study-care-connections { position: absolute; inset: 0; width: 100%; height: 100%; fill: none; pointer-events: none; }
.study-care-connections path { vector-effect: non-scaling-stroke; }
.study-care-wire { stroke: #c4d0ef; stroke-width: 1.5; }
.study-care-signal { stroke: var(--hs-accent); stroke-width: 3; stroke-linecap: round; stroke-dasharray: .18 .82; stroke-dashoffset: 1; opacity: 0; }
.study-care-hub { position: absolute; z-index: 1; top: 50%; left: 50%; display: flex; align-items: center; justify-content: center; flex-direction: column; width: 200px; height: 200px; transform: translate(-50%, -50%); border: 1px solid #c4d0ef; border-radius: 50%; background: #fff; box-shadow: 0 0 0 10px #f4f7ff, 0 0 0 11px #dce4f7, 0 16px 48px #465fb70a; text-align: center; }
.study-care-hub > i { margin-bottom: 14px; color: var(--hs-accent); font-size: 22px; }
.study-care-hub > span { color: #5b5d72; font-size: 10px; font-weight: 600; letter-spacing: .12em; text-transform: uppercase; }
.study-care-hub > strong { margin-top: 9px; color: #25263d; font-size: 21px; font-weight: 500; line-height: 1.25; letter-spacing: -.03em; }
.study-care-hub .study-care-hub-detail { margin-top: 12px; font-size: 11px; font-weight: 400; letter-spacing: 0; text-transform: none; }
.study-care-nodes { position: relative; display: grid; grid-template-columns: 32% 36% 32%; grid-template-rows: repeat(2, 1fr); align-items: center; row-gap: 24px; min-height: 440px; }
.study-care-node { padding: 24px; border: 1px solid #d5ddf5; border-radius: 12px; background: #fff; box-shadow: 0 6px 22px #29345f05; text-align: left; }
.study-care-node:nth-child(odd) { grid-column: 1; }
.study-care-node:nth-child(even) { grid-column: 3; }
.study-care-node:nth-child(-n + 2) { grid-row: 1; }
.study-care-node:nth-child(n + 3) { grid-row: 2; }
.study-care-node-label { display: flex; align-items: center; gap: 12px; margin-bottom: 16px; color: #405db9; font-size: 10px; font-weight: 600; letter-spacing: .1em; text-transform: uppercase; }
.study-care-icon { display: grid; place-items: center; flex: 0 0 36px; height: 36px; border-radius: 10px; background: #edf1fd; color: #405db9; font-size: 15px; }
.hs-page .study-care-node h3 { margin-bottom: 10px; font-size: 20px; line-height: 1.3; }
.hs-page .study-care-node p { margin: 0; color: #5b5d72; font-size: 14px !important; line-height: 1.65; }
.study-care-step-1 { --study-care-delay: 0s; }
.study-care-step-2 { --study-care-delay: 2s; }
.study-care-step-3 { --study-care-delay: 4s; }
.study-care-step-4 { --study-care-delay: 6s; }
@media (prefers-reduced-motion: no-preference) {
    .study-care-flow.is-animated .study-care-signal { animation: study-care-travel 8s linear var(--study-care-delay) infinite paused; }
    .study-care-flow.is-animated .study-care-icon { animation: study-care-highlight 8s ease-in-out var(--study-care-delay) infinite paused; }
    .study-care-flow.is-playing .study-care-signal,
    .study-care-flow.is-playing .study-care-icon { animation-play-state: running; }
}
@keyframes study-care-travel {
    0% { stroke-dashoffset: 1; opacity: 0; }
    3% { opacity: 1; }
    21% { stroke-dashoffset: 0; opacity: 1; }
    25%, 100% { stroke-dashoffset: 0; opacity: 0; }
}
@keyframes study-care-highlight {
    0%, 28%, 100% { background: #edf1fd; color: #405db9; box-shadow: 0 0 0 0 #5d7ce900; }
    7%, 20% { background: var(--hs-accent); color: #fff; box-shadow: 0 0 0 5px #5d7ce914; }
}
@media (max-width: 900px) {
    .study-care-network { padding-top: 12px; }
    .study-care-connections { display: none; }
    .study-care-hub { position: relative; top: auto; left: auto; width: 180px; height: 180px; margin: 0 auto 38px; transform: none; }
    .study-care-nodes { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 20px; min-height: 0; }
    .study-care-node:nth-child(n) { grid-column: auto; grid-row: auto; height: 100%; }
    .study-care-nodes::before { content: ''; position: absolute; z-index: -1; top: -28px; bottom: 50%; left: 50%; width: 1px; background: #c4d0ef; }
}
@media (max-width: 560px) {
    .study-care-nodes { grid-template-columns: minmax(0, 1fr); }
    .study-care-nodes::before { bottom: 0; }
    .study-care-node { padding: 22px; }
}
