/* CAREERS AT ARMYEXPORTER — manifesto composition */

.cr-hero { background: var(--bone); padding-block: clamp(2rem, 4vw, 3.2rem) clamp(3rem, 6vw, 5rem); }
.cr-hero .crumbs { margin-bottom: clamp(2.2rem, 5vw, 4rem); }
.cr-hero__grid { display: grid; grid-template-columns: minmax(0, 1fr); gap: 2.6rem 5rem; }
.cr-hero h1 { max-width: 18ch; font-size: clamp(1.9rem, .9rem + 2.8vw, 3.8rem); }
.areas__t { overflow-wrap: break-word; }
.cr-hero .lead { max-width: 54ch; }
.cr-hero__fig { max-width: 600px; }
@media (min-width: 1200px) { .cr-hero__grid { grid-template-columns: minmax(0, 1fr) minmax(0, 540px); align-items: center; } }
.vac { margin-top: clamp(2.4rem, 5vw, 4rem); display: grid; grid-template-columns: minmax(0, 1fr); gap: 6px 24px; padding: 18px 0; border-top: 2px solid var(--ink); border-bottom: 1px solid var(--ink); }
.vac__k { font: 500 .7rem/1.9 var(--f-mono); letter-spacing: .16em; text-transform: uppercase; color: var(--signal); }
.vac p { margin: 0; font: 500 1.05rem/1.5 var(--f-display); }
@media (min-width: 700px) { .vac { grid-template-columns: 120px minmax(0, 1fr); } }

.areas { border-top: 2px solid var(--ink); }
.areas li { display: grid; grid-template-columns: 48px minmax(0, 1fr); gap: 4px 18px; padding: 26px 0; border-bottom: 1px solid var(--rule-2); transition: padding .35s var(--ease); }
.areas__n { grid-row: 1 / span 2; font: 400 .74rem/2.4 var(--f-mono); color: var(--acc); }
.areas__t { margin: 0; font: 650 clamp(1.35rem, 1rem + 1.6vw, 2.5rem)/1.1 var(--f-display); font-stretch: 108%; text-transform: uppercase; letter-spacing: -.01em; }
.areas p { margin: 0; color: var(--fg-2); max-width: 58ch; }
.areas li:hover { padding-left: 8px; }
.areas li:hover .areas__t { color: var(--copper-dp); }
@media (min-width: 1000px) {
  .areas li { grid-template-columns: 80px minmax(0, 1.3fr) minmax(0, 1fr); align-items: baseline; gap: 32px; }
  .areas__n { grid-row: auto; }
}

.values__list { display: grid; grid-template-columns: minmax(0, 1fr); gap: 0; }
.values__list li { display: grid; grid-template-columns: minmax(0, 1fr); gap: 6px 40px; padding: 22px 0; border-top: 1px solid var(--rule); }
.values__w { font: 800 clamp(1.5rem, .2rem + 5.4vw, 5.4rem)/.95 var(--f-display); font-stretch: 116%; text-transform: uppercase; letter-spacing: -.02em; color: var(--fg); overflow-wrap: break-word; min-width: 0; }
.values__list li:nth-child(even) .values__w { color: transparent; -webkit-text-stroke: 1px var(--copper-lt); }
@supports not (-webkit-text-stroke: 1px black) { .values__list li:nth-child(even) .values__w { color: var(--copper-lt); } }
.values__list p { margin: 0; color: var(--fg-2); max-width: 40ch; align-self: end; }