/* Sedara Clinical Research Organizations landing page. */
:root {
    --cro-ink: #2f2034;
    --cro-muted: #6d6270;
    --cro-wine: #6b1730;
    --cro-wine-deep: #470d20;
    --cro-rose: #c04e70;
    --cro-gold: #edbd61;
    --cro-mist: #f9f5f6;
    --cro-border: #eadde1;
    --cro-white: #fff;
    --cro-teal: #258785;
    --cro-plum: #75519a;
    --cro-shadow: 0 22px 62px rgba(71, 13, 32, 0.13);
}

* { box-sizing: border-box; }

html { scroll-behavior: smooth; }

body {
    background: var(--cro-white);
    color: var(--cro-ink);
    font-family: Arial, Helvetica, sans-serif;
    margin: 0;
    -webkit-font-smoothing: antialiased;
}

a { color: inherit; text-decoration: none; }

button, input, textarea { font: inherit; }

.cro-shell { margin: 0 auto; max-width: 1180px; padding-left: 28px; padding-right: 28px; }

.cro-footer-brand img { height: auto; max-width: 127px; }

.cro-hero {
    background:
        radial-gradient(circle at 86% 21%, rgba(237, 189, 97, .18), transparent 19%),
        radial-gradient(circle at 67% 87%, rgba(192, 78, 112, .22), transparent 28%),
        linear-gradient(122deg, #4d0e23 0%, #6b1730 56%, #80213d 100%);
    color: var(--cro-white);
    overflow: hidden;
    padding: 101px 0 98px;
}

.cro-hero-grid { align-items: center; display: grid; gap: 58px; grid-template-columns: minmax(0, 1.02fr) minmax(420px, .98fr); }
.cro-eyebrow { color: var(--cro-gold); font-size: 11px; font-weight: 700; letter-spacing: 2px; line-height: 1.35; margin: 0 0 16px; text-transform: uppercase; }
.cro-eyebrow-dark { color: var(--cro-wine); }

.cro-hero h1, .cro-section-intro h2, .cro-workflow-intro h2, .cro-product-copy h2, .cro-example-copy h2, .cro-considerations-grid h2, .cro-contact-copy h2 {
    font-family: Georgia, 'Times New Roman', serif;
    font-weight: 600;
}

.cro-hero h1 { font-size: clamp(42px, 4.2vw, 63px); letter-spacing: -1.8px; line-height: 1.07; margin: 0; max-width: 700px; }
.cro-hero-lead { color: rgba(255,255,255,.88); font-size: 18px; line-height: 1.72; margin: 25px 0 29px; max-width: 620px; }
.cro-hero-actions { display: flex; flex-wrap: wrap; gap: 12px; }

.cro-button {
    align-items: center;
    border: 1px solid transparent;
    cursor: pointer;
    display: inline-flex;
    font-size: 12px;
    font-weight: 700;
    gap: 9px;
    justify-content: center;
    letter-spacing: .35px;
    min-height: 46px;
    padding: 12px 17px;
    text-transform: uppercase;
    transition: background .2s ease, border-color .2s ease, color .2s ease, transform .2s ease;
}

.cro-button:hover { transform: translateY(-2px); }
.cro-button-primary { background: var(--cro-gold); color: #3d2130; }
.cro-button-primary:hover { background: #ffd986; }
.cro-button-secondary { border-color: rgba(255,255,255,.65); color: var(--cro-white); }
.cro-button-secondary:hover { background: rgba(255,255,255,.12); }
.cro-hero-diagram { height: 414px; position: relative; }
.cro-diagram-orbit { border: 1px solid rgba(255,255,255,.18); border-radius: 50%; pointer-events: none; position: absolute; }
.cro-diagram-orbit-one { height: 338px; right: -81px; top: 17px; width: 338px; }
.cro-diagram-orbit-two { border-color: rgba(237,189,97,.37); height: 475px; right: 34px; top: -65px; width: 475px; }

.cro-diagram-card {
    backdrop-filter: blur(6px);
    background: rgba(255,255,255,.97);
    border: 1px solid rgba(255,255,255,.6);
    box-shadow: 0 15px 38px rgba(31, 0, 12, .22);
    color: var(--cro-ink);
    min-height: 115px;
    padding: 17px 17px 16px 21px;
    position: absolute;
    width: 214px;
    z-index: 2;
}

.cro-diagram-card:before { background: var(--cro-gold); bottom: 0; content: ''; left: 0; position: absolute; top: 0; width: 4px; }
.cro-diagram-model:before { background: var(--cro-rose); }
.cro-diagram-app:before { background: var(--cro-teal); }
.cro-diagram-team:before { background: var(--cro-plum); }
.cro-diagram-source { left: 0; top: 28px; }
.cro-diagram-model { left: 144px; top: 144px; }
.cro-diagram-app { left: 287px; top: 28px; }
.cro-diagram-team { left: 287px; top: 260px; }
.cro-diagram-icon { color: var(--cro-wine); display: inline-block; font-size: 18px; margin-bottom: 10px; }
.cro-diagram-model .cro-diagram-icon { color: var(--cro-rose); }
.cro-diagram-app .cro-diagram-icon { color: var(--cro-teal); }
.cro-diagram-team .cro-diagram-icon { color: var(--cro-plum); }
.cro-diagram-card p { font-family: Georgia, 'Times New Roman', serif; font-size: 17px; font-weight: 700; line-height: 1.2; margin: 0 0 5px; }
.cro-diagram-card small { color: #685a63; display: block; font-size: 11px; line-height: 1.4; }
.cro-diagram-connector { color: rgba(255,255,255,.72); font-size: 25px; position: absolute; z-index: 1; }
.cro-diagram-connector-one { left: 100px; top: 107px; transform: rotate(37deg); }
.cro-diagram-connector-two { left: 272px; top: 107px; transform: rotate(-37deg); }

.cro-problem-section, .cro-capabilities-section, .cro-value-section { padding: 103px 0; }
.cro-problem-section { background: var(--cro-mist); }
.cro-section-intro { max-width: 800px; }
.cro-section-intro-centered { margin-left: auto; margin-right: auto; text-align: center; }
.cro-section-intro h2, .cro-workflow-intro h2, .cro-product-copy h2, .cro-example-copy h2, .cro-considerations-grid h2, .cro-contact-copy h2 { color: var(--cro-ink); font-size: clamp(31px, 3vw, 43px); letter-spacing: -1px; line-height: 1.15; margin: 0; }
.cro-problem-grid { display: grid; gap: 18px; grid-template-columns: repeat(3, 1fr); margin-top: 49px; }
.cro-problem-card { background: var(--cro-white); border: 1px solid var(--cro-border); min-height: 225px; padding: 29px 28px; position: relative; }
.cro-problem-card:after { background: var(--cro-gold); content: ''; height: 3px; left: 28px; position: absolute; top: 0; width: 49px; }
.cro-card-number { color: var(--cro-rose); font-size: 12px; font-weight: 700; letter-spacing: 1.6px; }
.cro-problem-card h3, .cro-capability-card h3, .cro-value-grid h3 { font-family: Georgia, 'Times New Roman', serif; font-size: 23px; letter-spacing: -.35px; line-height: 1.16; margin: 18px 0 11px; }
.cro-problem-card p, .cro-capability-card p, .cro-value-grid p { color: var(--cro-muted); font-size: 14px; line-height: 1.7; margin: 0; }

.cro-workflow-section { background: var(--cro-wine-deep); color: var(--cro-white); padding: 108px 0 104px; }
.cro-workflow-intro { align-items: end; display: grid; gap: 64px; grid-template-columns: minmax(0, 1.18fr) minmax(265px, .82fr); max-width: none; }
.cro-workflow-intro h2 { color: var(--cro-white); }
.cro-workflow-intro > p { color: rgba(255,255,255,.75); font-size: 15px; line-height: 1.75; margin: 0; }
.cro-workflow-list { counter-reset: workflow; display: grid; gap: 0 29px; grid-template-columns: repeat(3, 1fr); list-style: none; margin: 55px 0 0; padding: 0; }
.cro-workflow-list li { border-top: 1px solid rgba(255,255,255,.25); display: flex; gap: 16px; min-height: 173px; padding: 23px 0 23px; }
.cro-workflow-count { color: var(--cro-gold); font-size: 13px; font-weight: 700; line-height: 1.7; }
.cro-workflow-list h3 { color: var(--cro-white); font-family: Georgia, 'Times New Roman', serif; font-size: 21px; margin: 0 0 7px; }
.cro-workflow-list p { color: rgba(255,255,255,.71); font-size: 13px; line-height: 1.65; margin: 0; }

.cro-capabilities-grid { display: grid; gap: 18px; grid-template-columns: repeat(3, 1fr); margin-top: 50px; }
.cro-capability-card { border: 1px solid var(--cro-border); min-height: 277px; overflow: hidden; padding: 32px 29px; position: relative; }
.cro-capability-card:before { bottom: 0; content: ''; left: 0; position: absolute; top: 0; width: 5px; }
.cro-capability-card-wine { background: #f9eff2; }
.cro-capability-card-wine:before, .cro-capability-card-wine .cro-capability-icon { color: var(--cro-wine); background: var(--cro-wine); }
.cro-capability-card-gold { background: #fffaed; }
.cro-capability-card-gold:before, .cro-capability-card-gold .cro-capability-icon { color: #9b6d17; background: #d8a63d; }
.cro-capability-card-plum { background: #f4eff8; }
.cro-capability-card-plum:before, .cro-capability-card-plum .cro-capability-icon { color: var(--cro-plum); background: var(--cro-plum); }
.cro-capability-icon { align-items: center; border-radius: 50%; color: var(--cro-white) !important; display: inline-flex; font-size: 17px; height: 40px; justify-content: center; width: 40px; }
.cro-capability-card h3 { margin-top: 23px; }

.cro-product-showcase { margin-top: 84px; }
.cro-product-copy { max-width: 780px; }
.cro-product-media { margin: 48px 0 0; position: relative; }
.cro-product-media:before { background: var(--cro-gold); bottom: -17px; content: ''; height: 35%; left: -17px; position: absolute; width: 28%; z-index: 0; }
.cro-product-media img { box-shadow: var(--cro-shadow); display: block; height: auto; position: relative; width: 100%; z-index: 1; }
.cro-product-media p { color: var(--cro-muted); font-size: 11px; margin: 12px 0 0; padding: 0; position: relative; text-align: right; z-index: 2; }
.cro-product-copy p:not(.cro-eyebrow) { color: var(--cro-muted); font-size: 15px; line-height: 1.75; margin: 18px 0 0; }
.cro-check-list { list-style: none; margin: 23px 0 0; padding: 0; }
.cro-check-list li { color: #534651; font-size: 13px; line-height: 1.5; margin-top: 12px; }
.cro-check-list i { color: var(--cro-teal); margin-right: 8px; }

.cro-example-section { background: #f7f1ed; border-top: 1px solid #eee1db; border-bottom: 1px solid #eee1db; padding: 104px 0; }
.cro-example-grid { align-items: center; display: grid; gap: 76px; grid-template-columns: minmax(0, .9fr) minmax(450px, 1.1fr); }
.cro-example-copy p:not(.cro-eyebrow) { color: #5f5660; font-size: 15px; line-height: 1.75; margin: 18px 0 0; }
.cro-example-flow { background: var(--cro-white); box-shadow: 0 13px 36px rgba(73, 35, 40, .08); padding: 34px 37px; }
.cro-example-step { align-items: center; display: flex; gap: 18px; }
.cro-example-step > span { align-items: center; background: var(--cro-mist); border: 1px solid var(--cro-border); color: var(--cro-wine); display: inline-flex; font-size: 17px; height: 46px; justify-content: center; width: 46px; }
.cro-example-step strong { color: var(--cro-ink); display: block; font-family: Georgia, 'Times New Roman', serif; font-size: 17px; line-height: 1.2; }
.cro-example-step small { color: var(--cro-muted); display: block; font-size: 12px; line-height: 1.45; margin-top: 4px; }
.cro-example-line { border-left: 1px solid #d8c4cb; height: 27px; margin-left: 22px; }

.cro-value-section { background: var(--cro-white); }
.cro-value-grid { display: grid; gap: 0; grid-template-columns: repeat(3, 1fr); margin-top: 49px; }
.cro-value-grid article { border-left: 1px solid var(--cro-border); padding: 4px 34px 7px; }
.cro-value-grid article:first-child { border-left: 0; padding-left: 0; }
.cro-value-grid article:last-child { padding-right: 0; }
.cro-value-icon { align-items: center; background: var(--cro-mist); color: var(--cro-wine); display: inline-flex; font-size: 17px; height: 42px; justify-content: center; width: 42px; }
.cro-value-grid h3 { font-size: 24px; margin-top: 19px; }

.cro-considerations-section { background: linear-gradient(119deg, #350716, #63132d); color: var(--cro-white); padding: 100px 0 72px; }
.cro-considerations-grid { align-items: start; display: grid; gap: 96px; grid-template-columns: minmax(0, .93fr) minmax(380px, 1.07fr); }
.cro-considerations-grid h2 { color: var(--cro-white); }
.cro-considerations-grid p:not(.cro-eyebrow) { color: rgba(255,255,255,.77); font-size: 15px; line-height: 1.75; margin: 20px 0 0; }
.cro-considerations-list { list-style: none; margin: 6px 0 0; padding: 0; }
.cro-considerations-list li { border-top: 1px solid rgba(255,255,255,.2); color: rgba(255,255,255,.89); display: flex; font-size: 14px; gap: 13px; line-height: 1.55; padding: 17px 0; }
.cro-considerations-list li:last-child { border-bottom: 1px solid rgba(255,255,255,.2); }
.cro-considerations-list i { color: var(--cro-gold); font-size: 19px; margin-top: -1px; }
.cro-contact-section { background: #faf8f8; padding: 105px 0; }
.cro-contact-grid { align-items: start; display: grid; gap: 80px; grid-template-columns: minmax(0, .86fr) minmax(400px, 1.14fr); }
.cro-contact-copy p:not(.cro-eyebrow) { color: var(--cro-muted); font-size: 15px; line-height: 1.75; margin: 21px 0 0; max-width: 435px; }
.cro-contact-email { color: var(--cro-wine); display: inline-flex; font-size: 13px; font-weight: 700; gap: 8px; margin-top: 23px; }
.cro-contact-email:hover { color: var(--cro-rose); }
.cro-contact-form { background: var(--cro-white); box-shadow: 0 12px 39px rgba(73, 35, 40, .09); padding: 30px; }
.cro-form-row { display: grid; gap: 15px; grid-template-columns: repeat(2, 1fr); }
.cro-contact-form label { color: #514451; display: block; font-size: 11px; font-weight: 700; letter-spacing: .5px; margin: 0 0 7px; text-transform: uppercase; }
.cro-contact-form input, .cro-contact-form textarea { background: #fcfafb; border: 1px solid #dfd2d6; border-radius: 0; color: var(--cro-ink); display: block; font-size: 14px; margin: 0 0 17px; outline: none; padding: 11px 12px; resize: vertical; transition: border-color .2s ease, box-shadow .2s ease; width: 100%; }
.cro-contact-form textarea { margin-bottom: 18px; min-height: 104px; }
.cro-contact-form input:focus, .cro-contact-form textarea:focus { border-color: var(--cro-rose); box-shadow: 0 0 0 3px rgba(192,78,112,.12); }
.cro-contact-form .cro-button { border: 0; }
.cro-form-note { color: #796d75; font-size: 11px; line-height: 1.5; margin: 13px 0 0; }

.cro-site-footer { background: #2d0714; color: rgba(255,255,255,.68); }
.cro-footer-inner { align-items: center; display: flex; gap: 24px; justify-content: space-between; min-height: 92px; }
.cro-footer-brand { display: inline-flex; filter: brightness(0) invert(1); line-height: 0; opacity: .95; }
.cro-footer-inner p, .cro-footer-inner > a { font-size: 11px; margin: 0; }
.cro-footer-inner > a { color: var(--cro-gold); font-weight: 700; }
.cro-footer-inner > a:hover { color: var(--cro-white); }
.cro-footer-inner > a i { margin-left: 6px; }

@media (max-width: 1080px) {
    .cro-hero-grid { gap: 34px; grid-template-columns: minmax(0, .95fr) minmax(390px, 1.05fr); }
    .cro-hero-diagram { transform: scale(.91); transform-origin: left center; }
    .cro-example-grid, .cro-considerations-grid, .cro-contact-grid { gap: 52px; }
}

@media (max-width: 900px) {
    .cro-hero { padding: 75px 0 74px; }
    .cro-hero-grid, .cro-example-grid, .cro-considerations-grid, .cro-contact-grid { grid-template-columns: 1fr; }
    .cro-hero-diagram { margin: 9px auto 0; transform: none; width: 540px; }
    .cro-workflow-intro { gap: 25px; grid-template-columns: 1fr; }
    .cro-workflow-list { grid-template-columns: repeat(2, 1fr); }
    .cro-example-grid, .cro-considerations-grid, .cro-contact-grid { gap: 43px; }
}

@media (max-width: 680px) {
    .cro-shell { padding-left: 20px; padding-right: 20px; }
    .cro-hero { padding: 65px 0 59px; }
    .cro-hero h1 { font-size: 40px; letter-spacing: -1.2px; }
    .cro-hero-lead { font-size: 16px; }
    .cro-hero-diagram { height: 600px; margin-top: 25px; width: 100%; }
    .cro-diagram-orbit-one { height: 260px; right: -62px; top: 168px; width: 260px; }
    .cro-diagram-orbit-two { height: 360px; right: -24px; top: 101px; width: 360px; }
    .cro-diagram-card { min-height: 108px; width: calc(50% - 11px); }
    .cro-diagram-source { left: 0; top: 0; }
    .cro-diagram-model { left: auto; right: 0; top: 126px; }
    .cro-diagram-app { left: 0; top: 253px; }
    .cro-diagram-team { left: auto; right: 0; top: 379px; }
    .cro-diagram-connector-one { left: 47%; top: 82px; transform: rotate(55deg); }
    .cro-diagram-connector-two { left: 47%; top: 336px; transform: rotate(55deg); }
    .cro-problem-section, .cro-capabilities-section, .cro-value-section, .cro-example-section, .cro-contact-section { padding: 75px 0; }
    .cro-workflow-section, .cro-considerations-section { padding: 76px 0 61px; }
    .cro-section-intro h2, .cro-workflow-intro h2, .cro-product-copy h2, .cro-example-copy h2, .cro-considerations-grid h2, .cro-contact-copy h2 { font-size: 31px; }
    .cro-problem-grid, .cro-capabilities-grid, .cro-workflow-list, .cro-value-grid { grid-template-columns: 1fr; }
    .cro-problem-grid { gap: 12px; margin-top: 36px; }
    .cro-problem-card { min-height: 0; padding: 25px 24px; }
    .cro-workflow-list { margin-top: 40px; }
    .cro-workflow-list li { min-height: 0; padding: 20px 0; }
    .cro-capabilities-grid { margin-top: 37px; }
    .cro-capability-card { min-height: 0; }
    .cro-product-showcase { margin-top: 54px; }
    .cro-product-media:before { bottom: -11px; left: -11px; }
    .cro-example-flow { padding: 25px 22px; }
    .cro-value-grid { gap: 26px; margin-top: 38px; }
    .cro-value-grid article, .cro-value-grid article:first-child, .cro-value-grid article:last-child { border-left: 0; border-top: 1px solid var(--cro-border); padding: 26px 0 0; }
    .cro-value-grid article:first-child { border-top: 0; padding-top: 0; }
    .cro-contact-form { padding: 24px 20px; }
    .cro-form-row { grid-template-columns: 1fr; }
    .cro-footer-inner { align-items: flex-start; flex-direction: column; gap: 11px; justify-content: center; padding-bottom: 22px; padding-top: 22px; }
}

@media (prefers-reduced-motion: reduce) {
    html { scroll-behavior: auto; }
    .cro-button { transition: none; }
}
