:root {
        --ink: #102f37;
        --teal: #07878d;
        --brand-deep: #0b4d54;
        --sage: #bcdfe1;
        --mint: #dceff2;
        --pale: #f0f8fa;
        --sand: #eef1ec;
        --paper: #ffffff;
        --line: rgba(16, 47, 55, 0.16);
        --serif: Newsreader, Georgia, serif;
        --sans: Manrope, Arial, sans-serif;
      }
      .shell {
        width: min(1180px, calc(100% - 48px));
        margin-inline: auto;
      }
      .desktop-nav > a,
      
      .nav-drop > summary { display: inline-flex; align-items: center; gap: 0.35rem; }
      
      
      
      
      
      .page-hero {
        position: relative;
        padding: 54px 0 0;
        overflow: hidden;
        background: linear-gradient(
          90deg,
          var(--paper) 0 61%,
          var(--mint) 61% 100%
        );
      }
      .page-hero__grid {
        min-height: 520px;
        display: grid;
        grid-template-columns: 1.05fr 0.95fr;
        align-items: center;
        gap: 76px;
      }
      .eyebrow {
        margin: 0 0 1rem;
        color: var(--teal);
        font-size: 0.74rem;
        font-weight: 800;
        letter-spacing: 0.16em;
        text-transform: uppercase;
      }
      .page-hero h1 {
        margin: 0;
        font: 400 clamp(3.8rem, 7vw, 7.2rem) / 0.88 var(--serif);
        letter-spacing: -0.055em;
      }
      .page-hero h1 em {
        display: block;
        color: var(--teal);
        font-weight: 400;
      }
      .lead {
        max-width: 650px;
        margin: 2rem 0;
        font-size: 1.12rem;
      }
      .hero-actions {
        display: flex;
        gap: 0.8rem;
        flex-wrap: wrap;
      }
      .button {
        padding: 1rem 1.25rem;
      }
      .button--light {
        background: transparent;
        color: var(--ink);
        border: 1px solid var(--line);
      }
      .hero-media {
        position: relative;
        width: 100%;
        max-width: 540px;
        height: 500px;
        min-height: 0;
        margin-left: auto;
        align-self: center;
        box-shadow: 0 18px 46px rgba(7, 59, 61, 0.12);
      }
      .hero-media:before {
        content: "";
        position: absolute;
        z-index: -1;
        inset: 24px -24px -24px 24px;
        border: 1px solid rgba(7, 59, 61, 0.25);
      }
      .hero-media img {
        position: absolute;
        inset: 0;
        width: 100%;
        height: 100%;
        object-fit: cover;
        object-position: center 45%;
        filter: saturate(0.72);
      }
      .hero-media__label {
        position: absolute;
        right: -1px;
        bottom: -1px;
        max-width: 290px;
        padding: 23px 28px;
        background: var(--ink);
        color: #fff;
      }
      .hero-media__label span {
        display: block;
        font-size: 0.65rem;
        letter-spacing: 0.14em;
        text-transform: uppercase;
        opacity: 0.65;
      }
      .hero-media__label strong {
        font: 500 1.4rem/1.2 var(--serif);
      }
      .hero-facts {
        margin-top: 0;
        background: var(--ink);
        color: #fff;
      }
      .hero-facts__grid {
        display: grid;
        grid-template-columns: repeat(4, 1fr);
      }
      .hero-fact {
        padding: 28px 24px;
        border-right: 1px solid rgba(255, 255, 255, 0.16);
      }
      .hero-fact span {
        display: block;
        margin-bottom: 0.8rem;
        font-size: 0.64rem;
        letter-spacing: 0.12em;
        opacity: 0.55;
      }
      .hero-fact strong {
        display: block;
        font: 500 1.15rem/1.2 var(--serif);
      }
      .conditions {
        padding: 100px 0 108px;
        background:
          linear-gradient(rgba(7, 59, 61, 0.032) 1px, transparent 1px) 0 0 /
            100% 88px,
          var(--paper);
      }
      .section-heading {
        display: grid;
        grid-template-columns: 0.8fr 1.2fr;
        gap: 4rem;
        align-items: end;
        margin-bottom: 56px;
      }
      .section-heading h2,
      .values h2,
      .jobs h2 {
        margin: 0;
        font: 400 clamp(2.7rem, 5vw, 5rem) / 0.95 var(--serif);
        letter-spacing: -0.04em;
      }
      .section-heading h2 em,
      .values h2 em,
      .jobs h2 em {
        display: block;
        color: var(--teal);
        font-weight: 400;
      }
      .section-heading > p {
        max-width: 600px;
        margin: 0;
      }
      .condition-grid {
        display: grid;
        grid-template-columns: repeat(3, 1fr);
        gap: 22px;
      }
      .condition {
        min-height: 250px;
        padding: 30px;
        border: 1px solid var(--line);
        border-top: 3px solid var(--sage);
        background: #fff;
        box-shadow: 0 12px 30px rgba(7, 59, 61, 0.045);
        transition:
          transform 0.28s ease,
          box-shadow 0.28s ease,
          border-color 0.28s ease;
      }
      .condition:hover {
        transform: translateY(-5px);
        border-top-color: var(--teal);
        box-shadow: 0 20px 44px rgba(7, 59, 61, 0.09);
      }
      .condition__icon {
        width: 54px;
        height: 54px;
        display: grid;
        place-items: center;
        margin-bottom: 42px;
        border-radius: 50%;
        background: var(--mint);
        font: 500 1.4rem var(--serif);
      }
      .condition h3 {
        margin: 0 0 0.75rem;
        font: 500 1.7rem/1 var(--serif);
      }
      .condition p {
        margin: 0;
        color: rgba(7, 59, 61, 0.78);
      }
      .values {
        background: var(--mint);
        padding: 105px 0;
      }
      .values__grid {
        display: grid;
        grid-template-columns: 0.8fr 1.2fr;
        gap: 80px;
      }
      .values__intro {
        position: sticky;
        top: 125px;
        align-self: start;
      }
      .values__intro p:last-child {
        max-width: 470px;
      }
      .value-list {
        border-top: 1px solid var(--line);
      }
      .value {
        display: grid;
        grid-template-columns: 64px 1fr;
        gap: 20px;
        padding: 31px 0;
        border-bottom: 1px solid var(--line);
      }
      .value > span {
        font-size: 0.7rem;
        letter-spacing: 0.12em;
      }
      .value h3 {
        margin: 0 0 0.55rem;
        font: 500 2rem/1 var(--serif);
      }
      .value p {
        margin: 0;
        max-width: 620px;
      }
      .jobs {
        padding: 104px 0 112px;
        background: var(--paper);
      }
      .jobs-head {
        display: grid;
        grid-template-columns: 0.85fr 1.15fr;
        gap: 4rem;
        margin-bottom: 50px;
      }
      .jobs-head > p {
        margin: 0;
        max-width: 610px;
      }
      .job-list {
        display: grid;
        gap: 16px;
      }
      .job {
        border: 1px solid var(--line);
        border-left: 4px solid var(--sage);
        background: #fff;
        box-shadow: 0 10px 28px rgba(7, 59, 61, 0.04);
        transition:
          border-color 0.25s ease,
          box-shadow 0.25s ease;
      }
      .job:hover,
      .job[open] {
        border-left-color: var(--teal);
        box-shadow: 0 18px 38px rgba(7, 59, 61, 0.08);
      }
      .job summary {
        display: grid;
        grid-template-columns: 80px 1fr auto;
        gap: 24px;
        align-items: center;
        padding: 28px 30px;
        cursor: pointer;
        list-style: none;
      }
      .job summary::-webkit-details-marker {
        display: none;
      }
      .job-index {
        font-size: 0.68rem;
        letter-spacing: 0.12em;
      }
      .job-title h3 {
        margin: 0 0 0.35rem;
        font: 500 clamp(1.7rem, 3vw, 2.7rem) / 1 var(--serif);
      }
      .job-meta {
        display: flex;
        gap: 0.7rem;
        flex-wrap: wrap;
        color: var(--teal);
        font-size: 0.68rem;
        font-weight: 800;
        letter-spacing: 0.09em;
        text-transform: uppercase;
      }
      .job-toggle {
        width: 48px;
        height: 48px;
        display: grid;
        place-items: center;
        border: 1px solid var(--line);
        border-radius: 50%;
        font-size: 1.5rem;
        transition: 0.25s;
      }
      .job[open] .job-toggle {
        transform: rotate(45deg);
        background: var(--ink);
        color: #fff;
      }
      .job-content {
        display: grid;
        grid-template-columns: 80px 1fr;
        gap: 24px;
        padding: 0 30px 30px;
      }
      .job-content__inner {
        display: grid;
        grid-template-columns: 1fr 1fr;
        gap: 44px;
        padding: 36px;
        background: var(--pale);
      }
      .job-content h4 {
        margin: 0 0 0.8rem;
        font: 600 1.2rem var(--serif);
      }
      .job-content ul {
        margin: 0.6rem 0 1.5rem;
        padding-left: 1.1rem;
      }
      .job-content li + li {
        margin-top: 0.55rem;
      }
      .job-content p {
        margin-top: 0;
      }
      .job-apply {
        align-self: end;
      }
      .job-apply .button {
        width: 100%;
      }
      .application {
        padding: 0 0 110px;
      }
      .application__inner {
        display: grid;
        grid-template-columns: 1fr 0.8fr;
        gap: 70px;
        padding: 60px;
        background: var(--sand);
        border-top: 3px solid var(--teal);
        box-shadow: 0 18px 44px rgba(7, 59, 61, 0.07);
      }
      .application h2 {
        margin: 0;
        font: 400 clamp(2.8rem, 5vw, 4.8rem) / 0.94 var(--serif);
      }
      .application p {
        max-width: 680px;
      }
      .application-steps {
        display: grid;
        gap: 1px;
        background: rgba(7, 59, 61, 0.12);
      }
      .application-step {
        display: grid;
        grid-template-columns: 42px 1fr;
        gap: 18px;
        padding: 22px;
        background: var(--paper);
      }
      .application-step span {
        font-size: 0.7rem;
        letter-spacing: 0.12em;
      }
      .application-step strong {
        display: block;
        font: 500 1.25rem var(--serif);
      }
      .application-step small {
        display: block;
        margin-top: 0.2rem;
        font-size: 0.76rem;
      }
      .editor-note {
        padding: 18px 0;
        background: var(--pale);
        border-top: 1px solid var(--line);
        border-bottom: 0;
        color: rgba(7, 59, 61, 0.7);
        font-size: 0.72rem;
      }
      .editor-note strong {
        display: inline;
        margin-right: 0.25rem;
        color: var(--ink);
      }
      .site-footer {
        background: var(--ink);
        color: #fff;
        padding: 58px 0 24px;
      }
      .footer-grid {
        display: grid;
        grid-template-columns: 1.2fr 1fr 1fr;
        gap: 50px;
      }
      .footer-wordmark {
        font: 500 1.9rem/1 var(--serif);
        text-decoration: none;
      }
      .footer-wordmark small {
        display: block;
        margin-top: 0.55rem;
        font: 600 0.62rem/1.35 var(--sans);
        letter-spacing: 0.09em;
        text-transform: uppercase;
        opacity: 0.62;
      }
      .footer-grid nav,
      .footer-contact {
        display: grid;
        align-content: start;
        gap: 0.55rem;
      }
      .footer-grid a {
        text-decoration: none;
      }
      .footer-kicker {
        font-size: 0.68rem;
        letter-spacing: 0.14em;
        text-transform: uppercase;
        opacity: 0.55;
        margin-bottom: 0.7rem;
      }
      .legal {
        display: flex;
        justify-content: space-between;
        margin-top: 44px;
        padding-top: 18px;
        border-top: 1px solid rgba(255, 255, 255, 0.16);
        font-size: 0.68rem;
      }
      .legal > span {
        opacity: 0.66;
      }
      .footer-credit {
        display: inline-flex;
        align-items: center;
        gap: 0.32rem;
        color: rgba(255, 255, 255, 0.55);
        text-decoration: none;
        font-weight: 600;
        transition: color 0.25s ease;
      }
      .footer-credit strong {
        color: rgba(220, 239, 242, 0.92);
        font-weight: 750;
      }
      .footer-credit:hover strong {
        color: var(--scrub-blue, #5aabc1);
      }
      @media (max-width: 1050px) {
        .desktop-nav {
          gap: 0.8rem;
        }
        
        .page-hero__grid {
          gap: 38px;
        }
        .hero-facts__grid {
          grid-template-columns: repeat(2, 1fr);
        }
        .condition-grid {
          grid-template-columns: repeat(2, 1fr);
        }
      }
      @media (max-width: 820px) {
        .shell {
          width: min(100% - 32px, 680px);
        }
        .site-header {
          height: 74px;
          grid-template-columns: 1fr auto auto;
          padding-inline: 16px;
        }
        .brand img {
          width: 160px;
        }
        .desktop-nav,
        .header-cta {
          display: none;
        }
        .menu-toggle {
          display: block;
        }
        .mobile-menu {
          position: fixed;
          z-index: 29;
          inset: 74px 0 auto;
          background: var(--ink);
          color: #fff;
          padding: 26px 24px;
        }
        .mobile-menu.is-open {
          display: block;
        }
        .mobile-menu nav {
          display: grid;
        }
        .mobile-menu a {
          padding: 0.8rem 0;
          border-bottom: 1px solid rgba(255, 255, 255, 0.15);
          text-decoration: none;
        }
        .mobile-sub {
          padding-left: 1.1rem;
        }
        .page-hero {
          padding: 48px 0 0;
          background: var(--paper);
        }
        .page-hero__grid,
        .section-heading,
        .values__grid,
        .jobs-head,
        .application__inner,
        .footer-grid {
          grid-template-columns: 1fr;
          gap: 30px;
        }
        .hero-media {
          width: 100%;
          max-width: none;
          height: 420px;
          min-height: 0;
          margin: 0;
        }
        .condition-grid {
          grid-template-columns: 1fr;
        }
        .conditions,
        .values,
        .jobs {
          padding: 76px 0;
        }
        .values__intro {
          position: static;
        }
        .job summary {
          grid-template-columns: 44px 1fr auto;
        }
        .job-content {
          grid-template-columns: 1fr;
        }
        .job-content__inner {
          grid-template-columns: 1fr;
        }
        .application__inner {
          padding: 36px;
        }
        .footer-grid {
          gap: 2rem;
        }
      }
      @media (max-width: 560px) {
        .page-hero h1 {
          font-size: 3.35rem;
        }
        .hero-facts__grid {
          grid-template-columns: 1fr 1fr;
        }
        .hero-fact {
          padding: 20px 14px;
        }
        .job summary {
          grid-template-columns: 1fr auto;
        }
        .job-index {
          display: none;
        }
        .job-content__inner {
          padding: 24px;
        }
        .job-toggle {
          width: 40px;
          height: 40px;
        }
        .legal {
          display: block;
        }
        .legal span {
          display: block;
          margin-top: 0.5rem;
        }
      }