.career-page {
    --career-ink: #072f2e;
    --career-teal: #005b58;
    --career-mint: #8fd1bd;
    --career-cream: #f3f4e5;
    background: #f7f8ef;
    color: var(--career-ink);
    overflow-x: hidden;
}

.career-page main { overflow: clip; }
.career-page em { font-family: Georgia, serif; font-weight: 400; }

.career-breadcrumb-hero {
    position: relative;
    min-height: 430px;
    padding-top: 90px;
    display: grid;
    align-items: center;
    isolation: isolate;
    overflow: hidden;
    color: #fff;
    background:
        radial-gradient(circle at 75% 30%, rgba(88, 200, 168, .18), transparent 27%),
        linear-gradient(135deg, #003e3d, #002827 74%);
}

.career-hero-grid {
    position: absolute;
    z-index: -2;
    inset: 0;
    opacity: .25;
    background-image: linear-gradient(rgba(255,255,255,.08) 1px, transparent 1px), linear-gradient(90deg, rgba(255,255,255,.08) 1px, transparent 1px);
    background-size: 54px 54px;
    mask-image: linear-gradient(90deg, #000, transparent 82%);
}

.career-hero-orb {
    position: absolute;
    z-index: -1;
    border: 1px solid rgba(237,240,218,.17);
    border-radius: 50%;
    animation: careerOrbit 16s linear infinite;
}

.career-hero-orb::before, .career-hero-orb::after {
    content: "";
    position: absolute;
    width: 12px;
    aspect-ratio: 1;
    border-radius: 50%;
    background: var(--career-mint);
    box-shadow: 0 0 24px rgba(143,209,189,.7);
}

.career-hero-orb-one { width: 410px; aspect-ratio: 1; right: 7%; top: -170px; }
.career-hero-orb-one::before { left: 28px; bottom: 88px; }
.career-hero-orb-one::after { right: 32px; top: 106px; }
.career-hero-orb-two { width: 220px; aspect-ratio: 1; right: 31%; bottom: -155px; animation-direction: reverse; }
.career-hero-orb-two::before { right: 13px; top: 55px; }
.career-hero-orb-two::after { display: none; }

@keyframes careerOrbit { to { transform: rotate(360deg); } }

.career-breadcrumb-content { position: relative; z-index: 2; padding-top: 36px; }
.career-kicker, .career-label {
    margin: 0 0 14px;
    color: #267c73;
    font: 700 .72rem/1.2 Poppins, sans-serif;
    letter-spacing: .13em;
    text-transform: uppercase;
}
.career-kicker { color: rgba(237,240,218,.72); display: flex; align-items: center; gap: 10px; }
.career-kicker span { width: 28px; height: 1px; background: var(--career-mint); }
.career-breadcrumb-hero h1 { margin: 0; font: 800 clamp(3.5rem, 8vw, 7.2rem)/.95 Poppins, sans-serif; letter-spacing: -.07em; }
.career-breadcrumb { margin-top: 26px; display: flex; gap: 11px; color: rgba(255,255,255,.52); font-size: .78rem; }
.career-breadcrumb a { color: #fff; transition: color .25s; }
.career-breadcrumb a:hover { color: var(--career-mint); }

.career-intro { position: relative; padding: clamp(85px, 10vw, 150px) 0; background: #f7f8ef; }
.career-intro-grid { display: grid; grid-template-columns: .9fr 1.1fr; align-items: center; gap: clamp(55px, 8vw, 110px); }
.career-intro-copy h2, .career-section-head h2, .career-roles-head h2 {
    margin: 0;
    font: 700 clamp(2.25rem, 4.5vw, 4.6rem)/1.02 Poppins, sans-serif;
    letter-spacing: -.06em;
}
.career-intro-copy h2 em, .career-section-head h2 em, .career-roles-head h2 em { color: #08766e; }
.career-intro-copy > p:not(.career-label) { max-width: 620px; margin: 25px 0 0; color: #54706b; font-size: clamp(.96rem, 1.25vw, 1.08rem); line-height: 1.8; }
.career-intro-actions { margin-top: 34px; display: flex; align-items: center; gap: 25px; flex-wrap: wrap; }
.career-primary-btn {
    min-height: 54px;
    padding: 0 24px;
    border-radius: 999px;
    display: inline-flex;
    align-items: center;
    gap: 28px;
    color: #fff;
    background: var(--career-teal);
    font: 700 .78rem Poppins, sans-serif;
    box-shadow: 0 14px 32px rgba(0,83,83,.18);
    transition: transform .3s, box-shadow .3s;
}
.career-primary-btn:hover { transform: translateY(-3px); box-shadow: 0 20px 40px rgba(0,83,83,.24); }
.career-primary-btn span { font-size: 1.1rem; }
.career-text-link { color: var(--career-ink); font: 700 .78rem Poppins, sans-serif; }
.career-text-link span { display: inline-block; margin-left: 8px; transition: transform .25s; }
.career-text-link:hover span { transform: translateX(5px); }
.career-stats { margin-top: 50px; padding-top: 25px; border-top: 1px solid #cfddd4; display: grid; grid-template-columns: repeat(3, 1fr); gap: 15px; }
.career-stats strong, .career-stats span { display: block; }
.career-stats strong { font: 700 1.25rem Poppins, sans-serif; color: var(--career-teal); }
.career-stats span { margin-top: 4px; color: #78908b; font-size: .68rem; text-transform: uppercase; letter-spacing: .06em; }

.career-scene-wrap { position: relative; perspective: 1200px; }
.career-scene-glow { position: absolute; inset: 12% 8%; border-radius: 50%; background: rgba(61,174,144,.18); filter: blur(55px); }
.career-scene {
    position: relative;
    aspect-ratio: 1.08;
    transform-style: preserve-3d;
    transition: transform .12s linear;
}
.career-scene-back {
    position: absolute;
    inset: 9%;
    border: 1px solid #c6ddd2;
    border-radius: 48% 52% 50% 45%;
    background: linear-gradient(145deg, rgba(255,255,255,.9), rgba(219,235,225,.5));
    transform: translateZ(-35px) rotate(-6deg);
    box-shadow: 0 35px 70px rgba(2,60,58,.12);
}
.career-scene-art { position: absolute; inset: 0; z-index: 2; transform: translateZ(35px); }
.career-scene-art svg { width: 100%; height: 100%; overflow: visible; }
.career-scene-card {
    position: absolute;
    z-index: 4;
    border: 1px solid rgba(255,255,255,.85);
    border-radius: 18px;
    background: rgba(255,255,255,.76);
    box-shadow: 0 18px 45px rgba(1,50,49,.16);
    backdrop-filter: blur(12px);
    transform: translateZ(75px);
    animation: careerFloat 4.8s ease-in-out infinite;
}
.career-card-code { top: 14%; right: -2%; width: 116px; padding: 14px; display: flex; flex-wrap: wrap; gap: 5px; }
.career-card-dot { width: 6px; aspect-ratio: 1; border-radius: 50%; background: #62b89f; }
.career-card-code i { display: block; width: 100%; height: 5px; border-radius: 5px; background: #c4dacf; }
.career-card-code i:nth-of-type(2) { width: 72%; }
.career-card-idea { left: -3%; bottom: 19%; padding: 12px 15px; display: flex; align-items: center; gap: 9px; animation-delay: -1.8s; }
.career-card-idea b { display: grid; place-items: center; width: 31px; aspect-ratio: 1; border-radius: 50%; color: #fff; background: #00746e; }
.career-card-idea span, .career-card-grow span { color: #4d6c67; font: 700 .63rem Poppins, sans-serif; }
.career-card-grow { right: 2%; bottom: 10%; padding: 13px 16px; animation-delay: -3s; }
.career-card-grow strong, .career-card-grow span { display: block; }
.career-card-grow strong { color: #006760; font: 800 1.05rem Poppins, sans-serif; }
@keyframes careerFloat { 50% { transform: translateZ(75px) translateY(-11px) rotate(1deg); } }

.career-journey { background: #052f2e; }
.career-journey-track { height: 390vh; }
.career-journey-sticky {
    position: sticky;
    top: 0;
    height: 100vh;
    min-height: 680px;
    padding: clamp(90px, 10vh, 120px) 0 35px;
    display: flex;
    flex-direction: column;
    overflow: hidden;
    color: #fff;
    background: radial-gradient(circle at 50% 110%, rgba(72,184,151,.2), transparent 38%), #052f2e;
}
.career-journey-noise { position: absolute; inset: 0; opacity: .22; background-image: radial-gradient(rgba(255,255,255,.18) .7px, transparent .7px); background-size: 18px 18px; mask-image: linear-gradient(90deg, transparent, #000 45%, transparent); }
.career-journey-head { position: relative; display: flex; align-items: flex-end; justify-content: space-between; gap: 30px; }
.career-label-light { color: #80c9b4; }
.career-journey-head h2 { max-width: 690px; margin: 0; font: 700 clamp(2.2rem, 4.2vw, 4.4rem)/.98 Poppins, sans-serif; letter-spacing: -.06em; }
.career-journey-head h2 em { color: #a6dbc9; }
.career-journey-progress { width: min(260px, 25vw); height: 3px; margin-bottom: 12px; overflow: hidden; background: rgba(255,255,255,.12); }
.career-journey-progress span { display: block; width: 25%; height: 100%; background: #a6dbc9; transition: width .15s linear; }
.career-journey-stage { position: relative; width: min(1220px, calc(100% - 48px)); flex: 1; margin: 35px auto 0; perspective: 1200px; }
.career-journey-card {
    position: absolute;
    left: 50%;
    top: 50%;
    width: min(480px, 42vw);
    min-height: 310px;
    padding: 38px;
    border: 1px solid rgba(221,240,229,.17);
    border-radius: 30px;
    opacity: 0;
    transform: translate(-50%, -44%) translateX(70vw) rotateY(-32deg) scale(.82);
    transform-origin: center;
    background: linear-gradient(145deg, rgba(255,255,255,.105), rgba(255,255,255,.035));
    box-shadow: 0 30px 80px rgba(0,0,0,.25), inset 0 1px rgba(255,255,255,.1);
    backdrop-filter: blur(18px);
    transition: opacity .65s, transform .75s cubic-bezier(.2,.8,.2,1);
}
.career-journey-card.is-active { z-index: 4; opacity: 1; transform: translate(-50%, -50%) translateX(0) rotateY(0) scale(1); }
.career-journey-card.is-past { opacity: .16; transform: translate(-50%, -50%) translateX(-45vw) rotateY(30deg) scale(.78); }
.career-journey-number { position: absolute; top: 24px; right: 28px; color: rgba(255,255,255,.32); font: 600 .68rem Poppins, sans-serif; letter-spacing: .12em; }
.career-journey-icon { width: 58px; aspect-ratio: 1; display: grid; place-items: center; border-radius: 18px; color: #053432; background: #b7e0d1; font: 700 1.45rem Poppins, sans-serif; box-shadow: 0 12px 35px rgba(114,205,177,.2); }
.career-journey-card h3 { margin: 26px 0 10px; font: 700 clamp(1.55rem, 2.5vw, 2.3rem) Poppins, sans-serif; letter-spacing: -.04em; }
.career-journey-card p { margin: 0; color: rgba(239,247,239,.62); line-height: 1.75; }
.career-journey-tags { margin-top: 24px; display: flex; gap: 8px; }
.career-journey-tags span { padding: 7px 11px; border: 1px solid rgba(255,255,255,.12); border-radius: 999px; color: #a8d8c8; font-size: .65rem; text-transform: uppercase; letter-spacing: .07em; }
.career-scroll-cue { margin: 0 auto; color: rgba(255,255,255,.36); font-size: .64rem; text-transform: uppercase; letter-spacing: .11em; }
.career-scroll-cue span { display: inline-block; width: 25px; height: 1px; margin-right: 8px; vertical-align: middle; background: #7dbda9; }

.career-benefits {
    position: relative;
    padding: clamp(90px, 11vw, 160px) 0;
    overflow: hidden;
    background: #f7f8ef;
}
.career-benefits::before {
    content: "";
    position: absolute;
    inset: 0;
    pointer-events: none;
    background: radial-gradient(circle at 50% 42%, rgba(255, 255, 255, .12), transparent 48%);
}
.career-benefits .container { position: relative; z-index: 1; }
.career-section-head { max-width: 810px; margin-bottom: 60px; }
.career-benefit-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 16px; }
.career-benefit-card { min-height: 330px; padding: 26px; border: 1px solid rgba(0,83,83,.1); border-radius: 24px; display: flex; flex-direction: column; background-color: #fff; background-position: center top; background-size: 100% auto; background-repeat: no-repeat; box-shadow: 0 12px 38px rgba(3,65,62,.06); transition: transform .35s, box-shadow .35s; }
.career-benefit-card:nth-child(1) { background-image: url("../images/career-flexible-card-v2.png?v=2"); }
.career-benefit-card:nth-child(2) { background-image: url("../images/career-learning-card-v2.png?v=2"); }
.career-benefit-card:nth-child(3) { background-image: url("../images/career-people-card-v2.png?v=2"); }
.career-benefit-card:nth-child(4) { background-image: url("../images/career-meaningful-card-v2.png?v=2"); }
.career-benefit-card:hover { transform: translateY(-10px); box-shadow: 0 24px 55px rgba(3,65,62,.14); }
.career-benefit-card > span { width: fit-content; padding: 5px 8px; border-radius: 999px; color: #315f5b; background: rgba(255,255,255,.82); box-shadow: 0 4px 14px rgba(0,61,61,.08); backdrop-filter: blur(8px); font: 700 .61rem Poppins, sans-serif; letter-spacing: .1em; }
.career-benefit-symbol { width: 62px; aspect-ratio: 1; margin-top: 45px; border-radius: 20px; display: grid; place-items: center; color: #fff; background: var(--career-teal); font: 500 1.5rem Poppins, sans-serif; transition: transform .45s; }
.career-benefit-card:hover .career-benefit-symbol { transform: rotate(8deg) scale(1.08); }
.career-benefit-card h3 { margin: auto 0 8px; font: 700 1.15rem Poppins, sans-serif; letter-spacing: -.03em; }
.career-benefit-card p { margin: 0; color: #6e837e; font-size: .82rem; line-height: 1.7; }

.career-roles { padding: clamp(90px, 10vw, 145px) 0; color: #fff; background: #082b2a; }
.career-roles-head { margin-bottom: 55px; display: grid; grid-template-columns: 1fr .55fr; align-items: end; gap: 60px; }
.career-roles-head h2 em { color: #9ed6c4; }
.career-roles-head > p { margin: 0 0 10px; color: rgba(255,255,255,.5); line-height: 1.75; }
.career-role { min-height: 112px; padding: 20px 10px; border-top: 1px solid rgba(255,255,255,.15); display: grid; grid-template-columns: 65px 1fr 180px 55px; align-items: center; gap: 20px; color: #fff; transition: padding .35s, background .35s; }
.career-role:last-child { border-bottom: 1px solid rgba(255,255,255,.15); }
.career-role:hover { padding-left: 25px; padding-right: 25px; background: rgba(255,255,255,.055); }
.career-role-index { color: #7eb5a6; font: 600 .68rem Poppins, sans-serif; }
.career-role-name strong, .career-role-name small { display: block; }
.career-role-name strong { font: 600 clamp(1.1rem, 2vw, 1.55rem) Poppins, sans-serif; }
.career-role-name small { margin-top: 5px; color: rgba(255,255,255,.4); }
.career-role-location { color: rgba(255,255,255,.58); font-size: .78rem; }
.career-role-arrow { width: 43px; aspect-ratio: 1; border: 1px solid rgba(255,255,255,.22); border-radius: 50%; display: grid; place-items: center; transition: background .3s, color .3s, transform .3s; }
.career-role:hover .career-role-arrow { color: #063331; background: #b2ddcf; transform: rotate(45deg); }

.career-modal-open { overflow: hidden; }
.career-application-modal {
    position: fixed;
    z-index: 10000;
    inset: 0;
    padding: 24px;
    display: grid;
    place-items: center;
    visibility: hidden;
    opacity: 0;
    transition: opacity .25s ease, visibility .25s ease;
}
.career-application-modal.is-open { visibility: visible; opacity: 1; }
.career-modal-backdrop {
    position: absolute;
    inset: 0;
    width: 100%;
    border: 0;
    background: rgba(0, 35, 34, .72);
    backdrop-filter: blur(8px);
    cursor: pointer;
}
.career-modal-panel {
    position: relative;
    width: min(640px, 100%);
    max-height: calc(100vh - 48px);
    padding: clamp(28px, 5vw, 48px);
    border-radius: 28px;
    overflow-y: auto;
    color: var(--career-ink);
    background: #f7f8ef;
    box-shadow: 0 30px 90px rgba(0, 25, 24, .35);
    transform: translateY(20px) scale(.98);
    transition: transform .25s ease;
}
.career-application-modal.is-open .career-modal-panel { transform: none; }
.career-modal-close {
    position: absolute;
    top: 18px;
    right: 18px;
    width: 42px;
    height: 42px;
    border: 1px solid rgba(0, 65, 62, .16);
    border-radius: 50%;
    color: var(--career-ink);
    background: transparent;
    font: 400 1.65rem/1 Poppins, sans-serif;
    cursor: pointer;
}
.career-modal-panel h2 { margin: 0; font: 700 clamp(2rem, 5vw, 3.4rem)/1 Poppins, sans-serif; letter-spacing: -.055em; }
.career-modal-intro { margin: 14px 0 28px; color: #526967; font-size: .9rem; }
.career-application-form { display: grid; gap: 10px; }
.career-application-form label { margin-top: 7px; color: #174f4b; font: 700 .72rem Poppins, sans-serif; letter-spacing: .04em; }
.career-application-form input,
.career-application-form textarea {
    width: 100%;
    border: 1px solid rgba(0, 83, 83, .18);
    border-radius: 12px;
    padding: 14px 15px;
    color: var(--career-ink);
    background: #fff;
    font: 500 .88rem Inter, sans-serif;
    outline: none;
    transition: border-color .2s, box-shadow .2s;
}
.career-application-form textarea { resize: vertical; }
.career-application-form input[type="file"] { padding: 10px; cursor: pointer; }
.career-application-form input[type="file"]::file-selector-button {
    margin-right: 12px;
    padding: 9px 13px;
    border: 0;
    border-radius: 8px;
    color: #fff;
    background: #267c73;
    font: 700 .72rem Poppins, sans-serif;
    cursor: pointer;
}
.career-application-form input:focus,
.career-application-form textarea:focus { border-color: #267c73; box-shadow: 0 0 0 3px rgba(38,124,115,.12); }
.career-application-form input[readonly] { color: #005b56; background: #e7f0e7; font-weight: 700; }
.career-file-help { margin-top: -4px; color: #687a78; font-size: .7rem; }
.career-form-status { min-height: 20px; margin: 5px 0 -5px; color: #506765; font-size: .78rem; }
.career-form-status.is-error { color: #a12626; }
.career-form-status.is-success { color: #08764d; font-weight: 700; }
.career-form-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; }
.career-form-grid > div { display: grid; gap: 10px; }
.career-form-submit {
    min-height: 52px;
    margin-top: 14px;
    padding: 0 22px;
    border: 0;
    border-radius: 999px;
    display: inline-flex;
    justify-content: center;
    align-items: center;
    gap: 22px;
    color: #fff;
    background: #005b56;
    font: 700 .8rem Poppins, sans-serif;
    cursor: pointer;
    transition: background .2s, transform .2s;
}
.career-form-submit:hover { background: #003f3c; transform: translateY(-2px); }
.career-form-submit:disabled { opacity: .65; cursor: wait; transform: none; }

.career-cta { padding: clamp(70px, 9vw, 125px) 20px; background: #edf0da; }
.career-cta-card { position: relative; padding: clamp(55px, 8vw, 105px); border-radius: 38px; overflow: hidden; text-align: center; color: #fff; background: linear-gradient(135deg, #00716a, #003d3d); box-shadow: 0 30px 70px rgba(1,49,48,.2); }
.career-cta-orbit { position: absolute; width: 520px; aspect-ratio: 1; left: 50%; top: -340px; border: 1px solid rgba(255,255,255,.15); border-radius: 50%; transform: translateX(-50%); box-shadow: 0 0 0 75px rgba(255,255,255,.025), 0 0 0 150px rgba(255,255,255,.02); }
.career-cta-card > *:not(.career-cta-orbit) { position: relative; z-index: 1; }
.career-cta-card p { margin: 0 0 14px; color: #9bd3c2; font: 700 .72rem Poppins, sans-serif; text-transform: uppercase; letter-spacing: .13em; }
.career-cta-card h2 { max-width: 850px; margin: 0 auto; font: 700 clamp(2rem, 4.4vw, 4.3rem)/1.04 Poppins, sans-serif; letter-spacing: -.055em; }
.career-cta-card h2 em { color: #dce9c9; }
.career-cta-card a { min-height: 54px; margin-top: 32px; padding: 0 25px; border-radius: 999px; display: inline-flex; align-items: center; gap: 30px; color: #06403e; background: #edf0da; font: 700 .78rem Poppins, sans-serif; transition: transform .3s; }
.career-cta-card a:hover { transform: translateY(-4px); }

.reveal { opacity: 0; transform: translateY(35px); transition: opacity .8s ease, transform .8s cubic-bezier(.2,.8,.2,1); }
.reveal.is-visible { opacity: 1; transform: translateY(0); }

@media (max-width: 1000px) {
    .career-intro-grid { grid-template-columns: 1fr; }
    .career-intro-copy { max-width: 720px; }
    .career-scene-wrap { width: min(700px, 100%); margin: 0 auto; }
    .career-benefit-grid { grid-template-columns: repeat(2, 1fr); }
    .career-roles-head { grid-template-columns: 1fr; gap: 20px; }
}

@media (max-width: 700px) {
    .career-breadcrumb-hero { min-height: 350px; }
    .career-hero-orb-one { right: -190px; }
    .career-application-modal { padding: 12px; }
    .career-modal-panel { max-height: calc(100vh - 24px); border-radius: 20px; }
    .career-form-grid { grid-template-columns: 1fr; gap: 0; }
    .career-intro { padding-top: 75px; }
    .career-stats { gap: 7px; }
    .career-scene-card { display: none; }
    .career-journey-sticky { min-height: 620px; padding-top: 85px; }
    .career-journey-head { align-items: flex-start; flex-direction: column; }
    .career-journey-progress { width: 100%; margin: 0; }
    .career-journey-stage { width: calc(100% - 30px); margin-top: 25px; }
    .career-journey-card { width: min(90vw, 430px); min-height: 300px; padding: 30px; }
    .career-benefit-grid { grid-template-columns: 1fr; }
    .career-benefit-card {
        position: relative;
        isolation: isolate;
        min-height: 310px;
        padding: 22px;
        overflow: hidden;
        background-size: cover;
    }
    .career-benefit-card::after {
        content: "";
        position: absolute;
        z-index: -1;
        inset: 38% 0 0;
        background: linear-gradient(
            180deg,
            rgba(247, 248, 239, 0) 0%,
            rgba(247, 248, 239, .9) 38%,
            #f7f8ef 68%
        );
        pointer-events: none;
    }
    .career-benefit-card > span {
        position: relative;
        z-index: 2;
        color: #063b38;
        background: rgba(255, 255, 255, .94);
        -webkit-backdrop-filter: none;
        backdrop-filter: none;
    }
    .career-benefit-card h3,
    .career-benefit-card p {
        position: relative;
        z-index: 2;
    }
    .career-benefit-card h3 {
        margin-bottom: 7px;
        color: #063b38;
        font-size: 1.25rem;
        line-height: 1.2;
    }
    .career-benefit-card p {
        color: #49645f;
        font-size: .9rem;
        line-height: 1.55;
    }
    .career-role { grid-template-columns: 35px 1fr 45px; gap: 10px; }
    .career-role-location { display: none; }
    .career-role:hover { padding-left: 10px; padding-right: 10px; }
    .career-cta { padding-left: 12px; padding-right: 12px; }
    .career-cta-card { border-radius: 26px; }
}

@media (prefers-reduced-motion: reduce) {
    .career-hero-orb, .career-scene-card { animation: none; }
    .reveal { opacity: 1; transform: none; transition: none; }
    .career-scene { transform: none !important; }
}
