/* ProTrade site stylesheet
   Geometry follows the measured Sequoia blueprint
   (/mnt/project-files/sequoia-blueprint/spec/sequoia-layout-spec.json, 1440 desktop, 390 mobile).
   Offsets in comments are "px below section top" at 1440. Only colour, imagery, copy and corners differ. */

@font-face { font-family: "Geist"; src: url("../fonts/Geist-Variable.woff2") format("woff2"); font-weight: 100 900; font-display: swap; }
@font-face { font-family: "Geist Mono"; src: url("../fonts/GeistMono-Variable.woff2") format("woff2"); font-weight: 100 900; font-display: swap; }

:root {
  /* ProTrade palette, taken from protradestaffing.com computed styles (2026-09-29) */
  --ink: #00022F;          /* navy: headings and body on light, dark sections */
  --night: #0A0915;        /* near-black: prefooter and footer */
  --blue: #0C2AC1;         /* brand blue: buttons, labels, accents on light */
  --blue-2: #3A55D6;       /* tints of brand blue for card-group accents */
  --blue-3: #6C7FE6;
  --peri: #A4ADF5;         /* periwinkle: labels and links on dark (live hero glow colour) */
  --tint: #E9EAF0;         /* live page background */
  --tint-2: #F2F3FA;       /* live light surface */
  --paper: #FDFDFD;
  --white: #FFFFFF;
  --text: #363840;         /* body */
  --text-2: #22242E;       /* leads */
  --muted: #52525A;
  --rule: #D6D8E2;
  --on-dark: #F2F3FA;
  --on-dark-2: #C4C8DC;
  --radius: 4px;           /* buttons (live site) */
  --radius-card: 8px;      /* cards and panels (live site) */
  --radius-tile: 2px;      /* icon tiles (live site) */
  --dark-radial: radial-gradient(113.65% 92.95% at 50% 7.05%, #0B1A86 0%, #00022F 62%);
  --dark-45: linear-gradient(45deg, #00022F 70%, #0C2AC1 150%);
  --light-down: linear-gradient(var(--paper), var(--tint));
  --light-up: linear-gradient(var(--tint), var(--paper));
  --light-hero: linear-gradient(183deg, #fff 23%, #E6E8F6 80%);
  --sans: "Geist", ui-sans-serif, system-ui, -apple-system, "Segoe UI", sans-serif;
  --mono: "Geist Mono", ui-monospace, "SFMono-Regular", Menlo, monospace;
}

*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; }
body { margin: 0; font-family: var(--sans); color: var(--text); background: var(--white); -webkit-font-smoothing: antialiased; font-synthesis: none; }
img { display: block; max-width: 100%; }
h1, h2, h3, h4, h5, h6, p, ul, ol, figure, blockquote { margin: 0; }
ul, ol { padding: 0; list-style: none; }
a { color: inherit; text-decoration: none; }
button { font: inherit; color: inherit; }
:focus-visible { outline: 2px solid var(--blue); outline-offset: 3px; }
.dark :focus-visible { outline-color: var(--peri); }
.sr-only { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0; }
.skip { position: absolute; left: 12px; top: -60px; z-index: 100; background: var(--blue); color: #fff; padding: 10px 16px; border-radius: var(--radius); }
.skip:focus { top: 12px; }

/* ---------- containers ----------
   Sequoia mixes 1140-1280 content widths; ProTrade keeps every section on one 1280 column so left and right edges line up down the page. */
.w1310 { width: min(1310px, 100%); margin-inline: auto; }
.w1280 { width: min(1280px, calc(100% - 48px)); margin-inline: auto; }
.w1240 { width: min(1280px, calc(100% - 48px)); margin-inline: auto; }
.w1160 { width: min(1280px, calc(100% - 48px)); margin-inline: auto; }
.w1152 { width: min(1152px, calc(100% - 48px)); margin-inline: auto; }  /* narrower centred panel: accordion and stacked cards */
.w1140 { width: min(1280px, calc(100% - 48px)); margin-inline: auto; }
.w960  { width: min(960px,  calc(100% - 48px)); margin-inline: auto; }
.w1264 { width: min(1280px, calc(100% - 48px)); margin-inline: auto; }

/* ---------- type ---------- */
.eyebrow { font-family: var(--mono); font-size: 16px; line-height: 1.25; font-weight: 500; letter-spacing: .12em; text-transform: uppercase; color: var(--blue); }
.dark .eyebrow { color: var(--peri); }
.eyebrow--grey { color: var(--muted); }
.display { font-size: 56px; line-height: 1.14; font-weight: 400; letter-spacing: -.01em; color: var(--ink); padding-bottom: 10px; }
.h48 { font-size: 48px; line-height: 1.167; font-weight: 400; letter-spacing: -.01em; color: var(--ink); padding-bottom: 10px; }
.h40 { font-size: 40px; line-height: 1.1; font-weight: 400; letter-spacing: -.01em; color: var(--ink); padding-bottom: 10px; }
.h40s { font-size: 40px; line-height: 1.2; font-weight: 400; letter-spacing: -.01em; color: var(--ink); padding-bottom: 10px; }
.h38 { font-size: 38px; line-height: 1.263; font-weight: 400; letter-spacing: -.01em; color: var(--ink); }
.h32 { font-size: 32px; line-height: 1.125; font-weight: 400; letter-spacing: -.01em; color: var(--ink); }
.h32l { font-size: 32px; line-height: 1.375; font-weight: 400; letter-spacing: -.01em; color: var(--ink); }
.h28l { font-size: 28px; line-height: 1.714; font-weight: 400; letter-spacing: -.01em; color: var(--ink); }
.h28 { font-size: 28px; line-height: 1.2; font-weight: 500; letter-spacing: -.01em; color: var(--ink); }
.h24 { font-size: 24px; line-height: 1.333; font-weight: 400; letter-spacing: -.01em; color: var(--ink); }
.h24t { font-size: 24px; line-height: 1.167; font-weight: 400; letter-spacing: -.01em; color: var(--ink); }
.h24b { font-size: 24px; line-height: 1.333; font-weight: 600; letter-spacing: -.01em; color: var(--text); padding-bottom: 10px; }
.h20 { font-size: 20px; line-height: 1.2; font-weight: 500; letter-spacing: -.01em; color: var(--ink); }
.h20t { font-size: 20px; line-height: 1.4; font-weight: 400; letter-spacing: -.01em; color: var(--text); }
.lead { font-size: 18px; line-height: 1.333; color: var(--text-2); }
.body { font-size: 16px; line-height: 1.25; letter-spacing: .01em; color: var(--text); }
.small { font-size: 14px; line-height: 1.429; letter-spacing: .01em; color: var(--text); }
.list18 li { font-size: 18px; line-height: 1.57; }
.center { text-align: center; }
.mx { margin-inline: auto; }
.dark { color: var(--on-dark); }
.dark .display, .dark .h48, .dark .h40, .dark .h40s, .dark .h38, .dark .h32, .dark .h32l, .dark .h28l, .dark .h28, .dark .h24, .dark .h24t, .dark .h20 { color: var(--on-dark); }
.dark .lead, .dark .body, .dark .small { color: var(--on-dark-2); }
.grad { background: linear-gradient(92deg, #FFFFFF 30%, #C3C9F8 100%); -webkit-background-clip: text; background-clip: text; color: transparent !important; }
.accent { color: var(--blue); }
.dark .accent { color: var(--peri); }

/* ---------- links and buttons ---------- */
.arrow-link { display: inline-flex; align-items: center; gap: 8px; font-size: 16px; line-height: 1.25; font-weight: 500; color: var(--ink); }
.arrow-link::after { content: ""; width: 14px; height: 14px; flex: none; background: currentColor; -webkit-mask: url("../img/arrow.svg") center / contain no-repeat; mask: url("../img/arrow.svg") center / contain no-repeat; transition: transform .15s; }
.arrow-link:hover::after { transform: translateX(3px); }
.arrow-link--sm { font-size: 15px; }
.arrow-link--xs { font-size: 13px; }
.dark .arrow-link { color: var(--peri); }
.btn { display: inline-flex; align-items: center; justify-content: center; font-size: 16px; line-height: 1.25; font-weight: 500; letter-spacing: .02em; border-radius: var(--radius); white-space: nowrap; cursor: pointer; transition: background-color .15s, color .15s; }
.btn--outline { padding: 10px 18px; border: 1px solid currentColor; background: transparent; color: var(--on-dark); }
.btn--outline:hover { background: var(--on-dark); color: var(--ink); }
.btn--solid { padding: 10px 18px; border: 1px solid var(--blue); background: var(--blue); color: #fff; }
.btn--solid:hover { background: #0A22A0; border-color: #0A22A0; }
.sq { display: inline-grid; flex: none; place-items: center; width: 48px; height: 48px; border-radius: var(--radius); background: var(--blue); color: #fff; }
.sq::before { content: ""; width: 24px; height: 24px; background: currentColor; -webkit-mask: url("../img/arrow.svg") center / 18px no-repeat; mask: url("../img/arrow.svg") center / 18px no-repeat; }
.sq:hover { background: #0A22A0; }

/* ---------- photo slots ----------
   Real ProTrade job-site photography goes in <img>. Until it exists, .ph draws a labelled slot at the measured size. */
.ph { position: relative; overflow: hidden; background: #D9DDF0 linear-gradient(135deg, #E6E9F7 0%, #C8CEEA 100%); border-radius: var(--radius-card); }
.ph > img { width: 100%; height: 100%; object-fit: cover; }
.ph[data-label]::after { content: attr(data-label); position: absolute; left: 16px; bottom: 14px; right: 16px; font-family: var(--mono); font-size: 11px; line-height: 1.4; letter-spacing: .1em; text-transform: uppercase; color: #3B4470; }
.ph::before { content: ""; position: absolute; inset: 0; background: repeating-linear-gradient(90deg, transparent 0 63px, rgba(12,42,193,.07) 63px 64px), repeating-linear-gradient(0deg, transparent 0 63px, rgba(12,42,193,.07) 63px 64px); }
.dark .ph { background: #1A1D33 linear-gradient(135deg, #1C2142 0%, #12152A 100%); }
.dark .ph::before { background: repeating-linear-gradient(90deg, transparent 0 63px, rgba(164,173,245,.08) 63px 64px), repeating-linear-gradient(0deg, transparent 0 63px, rgba(164,173,245,.08) 63px 64px); }
.dark .ph[data-label]::after { color: #8A93C4; }

/* ---------- header ----------
   Measured from the live protradestaffing.com nav at 1440: 1280 bar, 20px padding, 91px tall, not sticky.
   Items 16/19.2 Geist 500, -0.32px, 16px 24px padding; open item dims and its chevron flips.
   Dropdown #F7F8FF, 322 wide, 6px padding, 52px rows with 28px line icons; hover rgba(164,173,245,.3). */
.hdr { position: absolute; inset: 0 0 auto; z-index: 30; color: #ECECEC; }
.hdr--solid { position: relative; background: #fff; color: var(--ink); border-bottom: 1px solid #EEF0F6; }
.hdr__row { display: flex; align-items: center; width: 1280px; max-width: 100%; height: 91px; margin: 0 auto; padding: 20px; }
.hdr__logo { flex: none; display: flex; width: 200px; height: 30px; }
.hdr__logo img { width: 200px; height: 30px; }
.hdr__nav { flex: 1; display: flex; justify-content: center; }
.nav { display: flex; gap: 10px; }
.nav__item { position: relative; }
.nav__top { display: flex; align-items: center; gap: 4px; padding: 16px 24px; font: 500 16px/19.2px var(--sans); letter-spacing: -.32px; color: inherit; background: none; border: 0; border-radius: 4px; cursor: pointer; transition: opacity .2s; }
.nav__top .chev { width: 14px; height: 14px; transition: transform .2s; }
.nav__item:hover > .nav__top, .nav__item.open > .nav__top { opacity: .7; }
.nav__item:hover > .nav__top .chev, .nav__item.open > .nav__top .chev { transform: rotate(180deg); }
.hdr__right { display: flex; align-items: center; gap: 8px; margin-left: auto; }
.nav__item--login:hover > .nav__top { opacity: 1; }
.hdr__cta { display: inline-flex; align-items: center; height: 43px; padding: 12px 22px; font: 400 16px/19.2px var(--sans); letter-spacing: -.32px; color: #F2F3FA; background: var(--blue); border-radius: 4px; transition: background-color .2s, color .2s; }
.hdr__cta:hover { background: var(--peri); color: var(--ink); }
.dd { position: absolute; top: calc(100% + 16px); left: 0; z-index: 40; width: 322px; background: #F7F8FF; color: var(--ink); border-radius: 4px; box-shadow: 0 12px 32px rgba(0,2,47,.18); opacity: 0; visibility: hidden; transform: translateY(-4px); transition: opacity .18s, transform .18s, visibility 0s .18s; }
.dd::before { content: ""; position: absolute; left: 0; right: 0; top: -16px; height: 16px; }
.nav__item:hover > .dd, .nav__item.open > .dd, .nav__item:focus-within > .dd { opacity: 1; visibility: visible; transform: none; transition: opacity .18s, transform .18s; }
.dd__list { padding: 6px; }
.dd__item { display: flex; align-items: center; gap: 12px; width: 100%; min-height: 52px; padding: 12px; font: 400 16px/19.2px var(--sans); letter-spacing: -.32px; color: var(--ink); text-align: left; background: rgba(255,255,255,0); border: 0; border-radius: 2px; cursor: pointer; transition: background-color .15s; }
.dd__item:hover, .dd__item[aria-current], .dd__sub[aria-expanded="true"] { background: rgba(164,173,245,.3); }
.dd__item .ico { flex: none; width: 28px; height: 28px; }
.dd__sub .caret { width: 20px; height: 20px; margin-left: -4px; }
.dd__sub .c-x, .dd__sub[aria-expanded="true"] .c-r { display: none; }
.dd__sub[aria-expanded="true"] .c-x { display: inline; }
.dd__trades { display: none; }
.dd.trades-open .dd__trades { display: block; }
.dd.trades-open .dd__main { display: none; }
.dd__foot { padding: 6px; border-top: 1px solid #E1E3EE; }
.dd__cta { display: flex; align-items: center; height: 43px; padding: 12px; font: 400 16px/19.2px var(--sans); letter-spacing: -.32px; color: #F2F3FA; background: var(--blue); border-radius: 2px; transition: background-color .15s; }
.dd__cta:hover { background: var(--ink); color: #ECECEC; }
.dd--login { left: auto; right: -18px; width: 323px; }
.dd__item--login { justify-content: space-between; min-height: 48px; }
.dd__item--login + .dd__item--login { margin-top: 1px; box-shadow: 0 -1px 0 #E1E3EE; }
.dd__item--login .arr { width: 24px; height: 24px; }
.hdr__burger, .mnav { display: none; }
/* header on scroll (site.js): pinned to the top once the page moves, light bar, slides in and out */
.hdr.is-stuck { position: fixed; inset: 0 0 auto; background: #fff; color: var(--ink); border-bottom: 1px solid #EEF0F6; transform: translateY(-100%); transition: transform .35s cubic-bezier(.2,.7,.2,1); }
.hdr.is-stuck.is-shown { transform: none; }
.hdr.no-anim { transition: none; }
@media (min-width: 1024px) { html { scroll-padding-top: 104px; } }
.hdr.is-stuck .hdr__logo img { content: url("../img/logo-live-dark.png"); }
@media (prefers-reduced-motion: reduce) { .hdr.is-stuck { transition: none; } }

/* ---------- section scaffolding ---------- */
.sec { position: relative; }
.sec--dark { background: var(--dark-radial); }
.sec--dark45 { background: var(--dark-45); }
.sec--ink { background: var(--ink); }
.sec--down { background: var(--light-down); }
.sec--up { background: var(--light-up); }
.sec--hero-light { background: var(--light-hero); }
.sec--white { background: #fff; }
/* Section rhythm. Sequoia's fixed section heights left empty bands under shorter ProTrade content,
   so each section now ends a set distance below its last element instead (--h stays in the markup as the measured reference). */
@media (min-width: 761px) {
  .sec { padding-bottom: 112px; }
  .hero-sub, .hero-art, .hero-q, .zz3--b { padding-bottom: 48px; }
  .hero-mq { padding-bottom: 96px; }
  .pre { padding-bottom: 112px; }
  .sband { padding-bottom: 56px; }
  .hero-lc { padding-bottom: 150px; }
  .hero-ls { padding-bottom: 72px; }
  .faq-grp { padding-bottom: 24px; }
}

/* ---------- marquees ---------- */
.marquee { overflow: hidden; width: 100%; }
.marquee__track { display: flex; width: max-content; animation: marquee 60s linear infinite; }
.marquee:hover .marquee__track { animation-play-state: paused; }
@keyframes marquee { to { transform: translateX(-50%); } }
@media (prefers-reduced-motion: reduce) { .marquee__track { animation: none; } }
.card-marquee .marquee__track { gap: 5px; }
.card-marquee .ph { width: 199px; height: 265px; border-radius: 0; flex: none; }
/* word marquee replaces Sequoia's client-logo strip: ProTrade does not show client logos it cannot verify */
.word-marquee { height: 55px; display: flex; align-items: center; }
.word-marquee .marquee__track { gap: 64px; padding-right: 64px; }
.word-marquee span { font-family: var(--mono); font-size: 14px; letter-spacing: .14em; text-transform: uppercase; color: rgba(253,253,252,.55); white-space: nowrap; display: inline-flex; align-items: center; gap: 64px; }
.word-marquee span::after { content: ""; width: 6px; height: 6px; background: var(--peri); opacity: .6; }

/* =====================================================================
   PATTERNS
   ===================================================================== */

/* hero: centred with card marquee and stats (Sequoia home) */
.hero-mq { padding-top: 149px; text-align: center; }
.hero-mq .display { max-width: 1140px; margin: 8px auto 0; }
.hero-mq__btns { display: flex; justify-content: center; gap: 12px; margin-top: 32px; }
.hero-mq .marquee { margin-top: 62px; height: 265px; }
.hero-mq__link { margin-top: 16px; }
.hero-mq__link .arrow-link { font-size: 13px; opacity: .9; }
.stat-row { width: max-content; margin-inline: auto; display: grid; grid-template-columns: repeat(4, 172px); column-gap: 57px; justify-content: center; margin-top: 97px; }
.stat-row dt { order: 2; margin-top: 4px; min-height: 34px; font-family: var(--mono); font-size: 14px; line-height: 1.429; font-weight: 500; letter-spacing: .12em; text-transform: uppercase; color: var(--peri); }
.stat-row div { display: flex; flex-direction: column; }
.stat-row dd { order: 1; margin: 0; height: 62px; display: flex; align-items: flex-end; justify-content: center; font-size: 44px; line-height: 1.1; font-weight: 400; letter-spacing: -.01em; color: var(--on-dark); }

/* feature triptych (Sequoia home section 1): h2 +86, link +292, image +379, features +430/+666 */
.trip { padding-top: 112px; }
.trip .h40 { width: 585px; margin: 0 auto; text-align: center; }
.trip__link { text-align: center; margin-top: 24px; }
.trip__grid { display: grid; grid-template-columns: 256px 704px 256px; justify-content: space-between; align-items: center; margin-top: 64px; }
.trip__img { width: 704px; height: 553px; }
.trip__col { display: grid; row-gap: 72px; align-content: center; }
.trip__col h3 { margin-bottom: 10px; }

/* split heading + 4 cards (Sequoia home section 2) */
.split4 { padding-top: 112px; }
.split-head { display: grid; grid-template-columns: 585px 605px; justify-content: space-between; align-items: start; }
.split-head .lead { margin-top: 12px; }
.cards4 { display: grid; grid-template-columns: repeat(4, 1fr); column-gap: 32px; margin: 72px 0 0; }
.card4 > p { max-width: 268px; }
.card4 { display: grid; grid-template-rows: auto 1fr 48px; row-gap: 12px; }
.card4 .sq { margin-top: 20px; }
.card4 .h24 { color: var(--ink); font-weight: 500; }

/* dark centred carousel (Sequoia home section 3 / healthcare section 4) */
.dcar { padding-top: 112px; text-align: center; }
.dcar .h40 { width: 685px; margin: 0 auto; }
.dcar__link { margin-top: 24px; }
.dcar__track { margin-top: 56px; }
.dcar--nolink .dcar__track { margin-top: 64px; }
.dcar--nolink .h40 { width: 700px; }

/* story rail: horizontal scroll-snap row, used where Sequoia shows client stories */
.rail { display: grid; grid-auto-flow: column; grid-auto-columns: 405px; gap: 32px; overflow-x: auto; scroll-snap-type: x mandatory; scrollbar-width: none; text-align: left; }
.rail::-webkit-scrollbar { display: none; }
.rail > * { scroll-snap-align: start; }
.story { display: grid; grid-template-rows: 380px auto; gap: 24px; }
.story .ph { height: 380px; }
.story .eyebrow { font-size: 13px; margin-bottom: 10px; }
.story p { color: var(--on-dark-2); font-size: 16px; line-height: 1.5; }
.rail-ctrl { display: flex; gap: 8px; justify-content: flex-end; margin-top: 20px; }
.rail-ctrl button { width: 44px; height: 43px; border: 1px solid rgba(253,253,252,.4); background: none; color: var(--on-dark); border-radius: var(--radius); cursor: pointer; }
.rail-ctrl button:disabled { opacity: .3; cursor: default; }

/* insights (Sequoia home section 5): repurposed as Resources */
.ins { padding-top: 112px; }
.ins > .w1140 > .h40 { text-align: center; width: 685px; margin: 0 auto; }
.ins__bar { display: flex; justify-content: space-between; align-items: flex-start; width: min(1280px, calc(100% - 48px)); margin: 64px auto 0; }
.ins__cards { display: grid; grid-template-columns: repeat(3, 1fr); column-gap: 32px; width: min(1280px, calc(100% - 48px)); margin: 32px auto 0; }
.post { display: grid; grid-template-rows: auto; align-content: start; }
.post .ph { height: 260px; }
.post h3 { margin: 24px 0 0; }
.post .arrow-link { margin: 12px 0 0; }
.ins__bar--2 { margin-top: 96px; }
.ins__bar .h24b { width: 605px; }
.ins__bar .arrow-link { margin: 7px 0 0; }
.tiles4 { display: grid; grid-template-columns: repeat(4, 1fr); column-gap: 32px; width: min(1280px, calc(100% - 48px)); margin: 32px auto 0; }
.tile4 { display: grid; gap: 12px; align-content: start; max-width: 260px; }
.tile4 .lbl { font-family: var(--mono); font-size: 14px; line-height: 1.429; font-weight: 500; letter-spacing: .12em; text-transform: uppercase; color: var(--blue); }

/* prefooter CTA */
.pre { background: var(--night); padding-top: 85px; text-align: center; overflow: hidden; }
.pre::before { content: ""; position: absolute; inset: 0; background: repeating-linear-gradient(90deg, transparent 0 119px, rgba(164,173,245,.06) 119px 120px); pointer-events: none; }
.pre .h40 { width: 500px; margin: 0 auto; position: relative; }
.pre__btns { position: relative; display: flex; justify-content: center; gap: 12px; margin-top: 40px; }

/* footer */

/* ---------- hub hero with sub-nav (Sequoia /benefits/) ---------- */
.hero-sub { padding-top: 139px; text-align: center; }
.pills { display: flex; flex-wrap: wrap; justify-content: center; gap: 8px; }
.pill { display: inline-flex; align-items: center; height: 38px; padding: 8px 16px; border: 1px solid rgba(253,253,252,.6); border-radius: var(--radius); font-size: 16px; line-height: 1.25; font-weight: 500; letter-spacing: .02em; color: var(--on-dark); }
.pill:hover { background: var(--on-dark); color: var(--ink); }
.hero-sub .eyebrow { margin-top: 51px; }
.hero-sub .h48 { margin-top: 8px; }
.hero-sub .lead { width: 920px; max-width: 100%; margin: 16px auto 0; }
.hero-sub .word-marquee { margin-top: 88px; }

/* split heading + comparison (Sequoia /benefits/ section 1) */
.cmp { padding-top: 86px; }
.cmp .split-head { grid-template-columns: 605px 605px; padding-left: 0; }
.cmp .split-head .lead { margin-top: 12px; }
.cmp__labels { display: grid; grid-template-columns: 605px 605px; justify-content: space-between; margin-top: 56px; }
.cmp__rows { margin-top: 20px; display: grid; row-gap: 16px; }
.cmp__row { display: grid; grid-template-columns: 605px 605px; justify-content: space-between; align-items: start; padding-top: 16px; border-top: 1px solid var(--rule); }
.cmp__l { position: relative; padding: 20px 0 0 35px; font-size: 20px; line-height: 1.2; color: var(--ink); }
.cmp__l::before { content: ""; position: absolute; left: 0; top: 23px; width: 16px; height: 16px; border: 1.5px solid var(--muted); }
.cmp__r { position: relative; padding: 20px 24px 20px 59px; background: #DDE2FA; border-radius: var(--radius-card); }
.cmp__r::before { content: ""; position: absolute; left: 24px; top: 23px; width: 16px; height: 16px; background: var(--blue); }
.cmp__r strong { display: block; font-size: 20px; line-height: 1.2; font-weight: 400; color: var(--ink); }
.cmp__r span { display: block; margin-top: 6px; font-size: 16px; line-height: 1.25; color: var(--text); }

/* dark intro + 3 zig-zag rows (Sequoia /benefits/ section 2) */
.dzz { padding-top: 107px; }
.dzz > .w1280 > .h40 { width: 600px; margin: 0 auto; text-align: center; }
.dzz > .w1280 > .lead { width: 830px; margin: 24px auto 0; text-align: center; }
.zz { display: grid; grid-template-columns: 605px 605px; justify-content: space-between; align-items: center; }
.zz + .zz { margin-top: 60px; }
.dzz .zz:first-of-type { margin-top: 62px; }
.zz__text .eyebrow { margin-bottom: 12px; }
.zz__text .h32 { margin-bottom: 20px; }
.zz__text .lead { margin-bottom: 24px; }
.zz .ph { height: 310px; }
.zz--flip .zz__text { order: 2; }

/* capability grid (Sequoia /benefits/ section 3, PEO section 2) */
.cap { padding-top: 87px; text-align: center; }
.cap .h40 { width: 730px; margin: 0 auto; }
.cap .lead { width: 800px; margin: 16px auto 0; }
.cap__grid { display: grid; grid-template-columns: repeat(4, 1fr); column-gap: 32px; row-gap: 56px; margin-top: 64px; text-align: left; }
.ctile { min-height: 0; }
.ctile__mark { width: 40px; height: 40px; background: var(--blue); border-radius: var(--radius-tile); display: grid; place-items: center; font-family: var(--mono); font-size: 13px; font-weight: 500; color: #fff; }
.ctile h3 { margin-top: 20px; }
.ctile p { margin-top: 8px; }
.ctile a { display: inline-block; margin-top: 12px; font-size: 14px; font-weight: 500; color: var(--blue); }
.ctile a::after { content: " \2192"; }
.cap--8 .h40 { width: 800px; }
.cap--8 .lead { width: 900px; margin-top: 16px; }
.cap--8 .cap__grid { row-gap: 48px; margin-top: 64px; }
.cap--8 .ctile { min-height: 0; }
.cap--8 .cap__link { margin-top: 48px; }

/* dark cards band (Sequoia /benefits/ dark testimonials; ProTrade uses it for fact cards) */
.dcards { padding-top: 86px; }
.dcards__h { margin-bottom: 56px; }
.qcards { display: grid; grid-template-columns: repeat(3, 1fr); column-gap: 32px; }
.qcard { display: grid; grid-template-rows: auto 1fr auto; min-height: 300px; padding: 28px 28px 24px; background: #fff; border-radius: var(--radius-card); }
.dark .qcard { background: #14172B; border: 1px solid #262A48; }
.qcard .eyebrow { font-size: 14px; line-height: 1.75; }
.qcard blockquote, .qcard .qtext { margin-top: 18px; font-size: 24px; line-height: 1.167; letter-spacing: -.01em; color: var(--ink); }
.dark .qcard .qtext { color: var(--on-dark); }
.qcard .qtext em { font-style: normal; color: var(--blue); }
.dark .qcard .qtext em { color: var(--peri); }
.qcard__foot { display: flex; align-items: flex-end; justify-content: space-between; gap: 16px; margin-top: 24px; }
.qcard__foot p { font-size: 16px; line-height: 1.5; color: var(--text); }
.dark .qcard__foot p { color: var(--on-dark-2); }

/* testimonials-slot section on light (Sequoia advisory/PEO); ProTrade fills with fact cards */
.t3 { padding-top: 86px; text-align: center; }
.t3 .h40 { width: 745px; margin: 0 auto; }
.t3 .lead { width: 850px; margin: 16px auto 0; }
.t3 .qcards { margin-top: 53px; text-align: left; }
.t3--short .h40 { width: 820px; }
.t3--short .qcards { margin-top: 56px; }
.t3--short .qcard { min-height: 340px; }

/* ---------- light centred hero (Sequoia healthcare) ---------- */
.hero-lc { padding-top: 56px; text-align: center; overflow: hidden; }
.hero-lc::after { content: ""; position: absolute; left: 0; right: 0; bottom: 0; height: 110px; background: radial-gradient(circle, rgba(12,42,193,.18) 1.5px, transparent 2px) 0 0 / 22px 22px; -webkit-mask: linear-gradient(transparent, #000); mask: linear-gradient(transparent, #000); pointer-events: none; }
.hero-lc .h48 { width: 730px; margin: 8px auto 0; }
.hero-lc .lead { width: 968px; margin: 16px auto 0; }

/* dark 3-row zig-zag + band (Sequoia healthcare section 1 / PEO section 1) */
.zz3 { padding-top: 58px; }
.zz3__row { display: grid; grid-template-columns: 605px 605px; justify-content: space-between; align-items: start; }
.zz3 .h40s { margin-bottom: 16px; }
.zz3 .lead + .lead { margin-top: 14px; }
.zz3 .arrow-link { margin-top: 22px; }
.zz3--a .zz3__row:nth-child(1) .zz3__text { margin-top: 20px; }
.zz3--a .zz3__row:nth-child(1) .ph { height: 290px; }
.zz3--a .zz3__row:nth-child(2) { margin-top: 28px; }
.zz3--a .zz3__row:nth-child(2) .ph { height: 495px; }
.zz3--a .zz3__row:nth-child(2) .zz3__text { margin-top: 127px; }
.zz3--a .zz3__row:nth-child(3) { margin-top: 28px; }
.zz3--a .zz3__row:nth-child(3) .ph { height: 495px; }
.zz3--a .zz3__row:nth-child(3) .zz3__text { margin-top: 126px; }
.zz3__band { text-align: center; }
.zz3--a .zz3__band { margin-top: 102px; }
.zz3--a .zz3__band .h32l { width: 1088px; margin: 0 auto; }
.certs { display: flex; flex-wrap: wrap; justify-content: center; gap: 12px; width: 900px; margin: 48px auto 0; }
.certs li { display: inline-flex; align-items: center; gap: 10px; height: 48px; padding: 0 20px 0 16px; border: 1px solid #2E3466; border-radius: var(--radius); background: rgba(164,173,245,.06); font-size: 16px; line-height: 1.2; color: var(--on-dark); }
.certs li::before { content: ""; width: 16px; height: 16px; flex: none; background: var(--peri); -webkit-mask: url("../img/check.svg") center / 16px no-repeat; mask: url("../img/check.svg") center / 16px no-repeat; }
.zz3--b { padding-top: 80px; }
.zz3--b .zz3__row:nth-child(1) .zz3__text { margin-top: 6px; }
.zz3--b .zz3__row:nth-child(1) .ph { height: 300px; }
.zz3--b .zz3__row:nth-child(2) { margin-top: 24px; }
.zz3--b .zz3__row:nth-child(2) .ph { height: 437px; }
.zz3--b .zz3__row:nth-child(2) .zz3__text { margin-top: 85px; }
.zz3--b .zz3__row:nth-child(3) { margin-top: 45px; }
.zz3--b .zz3__row:nth-child(3) .ph { height: 340px; }
.zz3--b .zz3__row:nth-child(3) .zz3__text { margin-top: 12px; }
.zz3--b .zz3__band { margin-top: 37px; }
.zz3--b .zz3__band .h28l { width: 1104px; margin: 0 auto; }
.zz3--b .word-marquee { margin-top: 60px; height: 80px; }
.zz3 .ph { order: 0; }
.zz3__row--flip .zz3__text { order: 2; }

/* image + accordion (Sequoia healthcare section 2) */
.acc-sec { padding-top: 87px; text-align: center; }
.acc-sec .h40 { width: 1160px; margin: 0 auto; }
.acc-sec .lead { width: 850px; margin: 16px auto 0; }
.acc-sec__grid { display: grid; grid-template-columns: 423px 666px; justify-content: space-between; align-items: start; margin-top: 56px; text-align: left; }
.acc-sec .ph { height: 282px; margin-top: 0; }
.acc details { border-bottom: 1px solid var(--rule); }
.acc details:last-child { border-bottom: 0; }
.acc summary { position: relative; list-style: none; cursor: pointer; padding: 24px 50px 24px 0; font-size: 20px; line-height: 1.2; font-weight: 500; letter-spacing: -.01em; color: #141414; }
.acc summary::-webkit-details-marker { display: none; }
.acc summary::before, .acc summary::after { content: ""; position: absolute; right: 7px; top: 34px; width: 16px; height: 1.5px; background: currentColor; transition: transform .2s; }
.acc summary::after { transform: rotate(90deg); }
.acc details[open] summary::after { transform: rotate(0deg); }
.acc .acc__body { padding: 0 50px 24px 0; font-size: 18px; line-height: 1.444; color: var(--text-2); }
.acc .acc__body p + p { margin-top: 12px; }
.acc .acc__body a { color: var(--blue); text-decoration: underline; text-underline-offset: 3px; }

/* stacked horizontal cards (Sequoia healthcare section 3) */
.hcards { padding-top: 58px; }
.hcards > .w1152 > .h40 { text-align: center; }
.hcard { display: grid; grid-template-columns: 544px 608px; min-height: 420px; background: #fff; border-radius: var(--radius-card); overflow: hidden; }
.hcard + .hcard { margin-top: 40px; }
.hcards .hcard:first-of-type { margin-top: 55px; }
.hcard .ph { height: 100%; min-height: 420px; border-radius: 0; }
.hcard__text { padding: 56px 56px 48px; display: flex; flex-direction: column; }
.hcard__text .sub { margin-top: 6px; font-size: 18px; line-height: 1.333; color: var(--blue); }
.hcard__text .lead { margin-top: 20px; }
.hcard__text .arrow-link { margin-top: auto; padding-top: 24px; }

/* ---------- light split hero (Sequoia PEO) ---------- */
.hero-ls { padding-top: 56px; }
.hero-ls__grid { display: grid; grid-template-columns: 605px 605px; justify-content: space-between; }
.hero-ls .h48 { margin-top: 8px; }
.hero-ls .lead { margin-top: 16px; }
.hero-ls .btn--solid { margin-top: 36px; }
.hero-ls .ph { height: 400px; }

/* dark two checklists (Sequoia PEO section 3) */
.chk { padding-top: 120px; }
.chk .h40s { width: 800px; margin: 0 auto; text-align: center; }
.chk__cols { display: grid; grid-template-columns: 548px 548px; justify-content: space-between; margin-top: 80px; }
.chk h3 { font-size: 24px; line-height: 1.177; font-weight: 500; color: var(--on-dark); }
.chk ul { margin-top: 30px; }
.chk li { position: relative; padding-left: 34px; font-size: 18px; line-height: 1.57; color: var(--on-dark); }
.chk li + li { margin-top: 10px; }
.chk li::before { content: ""; position: absolute; left: 0; top: 6px; width: 18px; height: 18px; background: var(--peri); -webkit-mask: url("../img/check.svg") center / contain no-repeat; mask: url("../img/check.svg") center / contain no-repeat; }

/* assurance strip (Sequoia PEO section 5) */
.assure { padding-top: 88px; }
.assure__row { display: flex; justify-content: space-between; align-items: flex-start; }
.assure p { width: 848px; font-size: 18px; line-height: 1.57; color: var(--text-2); }
.assure__badge { width: 203px; height: 145px; margin: -30px 0 0 0; display: grid; place-items: center; align-content: center; gap: 8px; border: 1px solid #D5DAF2; border-radius: var(--radius-card); text-align: center; }
.assure__badge strong { font-size: 18px; font-weight: 500; color: var(--ink); }
.assure__badge span { font-family: var(--mono); font-size: 11px; letter-spacing: .12em; text-transform: uppercase; color: var(--blue); }

/* ---------- split hero with quote + graphic (Sequoia why) ---------- */
.hero-q { padding-top: 149px; }
.hero-q__top { display: grid; grid-template-columns: 605px 605px; justify-content: space-between; }
.hero-q .display { margin-top: 8px; }
.hero-q__top .lead { margin-top: 48px; }
.hero-q__mid { display: grid; grid-template-columns: 491px 632px; justify-content: space-between; align-items: start; margin-top: 59px; }
.hero-q__left { margin: 0; padding-top: 5px; }
.hero-q__mark { font-size: 72px; line-height: .889; font-weight: 700; color: var(--peri); height: 64px; }
.hero-q__quote { margin-top: 8px; font-size: 30px; line-height: 1.133; letter-spacing: -.01em; color: var(--on-dark); }
.hero-q__who { display: flex; gap: 15px; align-items: center; margin-top: 40px; }
.avatar { width: 65px; height: 65px; flex: none; border-radius: 50%; display: grid; place-items: center; background: #1A2170; font-family: var(--mono); font-size: 16px; color: var(--peri); }
.hero-q__who p span { font-weight: 400; color: var(--on-dark-2); }
.hero-q__who p { width: 300px; min-height: 40px; }
.hero-q__who .ph { width: 65px; height: 65px; border-radius: 50%; flex: none; }
.hero-q__who p { font-size: 16px; line-height: 1.25; font-weight: 500; color: var(--on-dark-2); }
.hero-q__graphic { height: 460px; }
.hero-q .word-marquee { margin-top: 86px; }
.steps { list-style: none; }

/* steps graphic (How it works hero right) */
.steps { height: 460px; display: grid; grid-template-rows: repeat(4, 1fr); gap: 10px; }
.step { display: grid; grid-template-columns: 64px 1fr; align-items: center; padding: 0 28px; background: #13162C; border: 1px solid #262A48; border-radius: var(--radius-card); }
.step b { font-family: var(--mono); font-size: 14px; font-weight: 500; letter-spacing: .12em; color: var(--peri); }
.step span { font-size: 20px; line-height: 1.3; color: var(--on-dark); }
.step small { display: block; margin-top: 4px; font-size: 15px; line-height: 1.4; color: var(--on-dark-2); }

/* split heading + 3 dark image cards (Sequoia why section 1) */
.ic3 { padding-top: 97px; }
.ic3__head { display: grid; grid-template-columns: 585px 605px; justify-content: space-between; }
.ic3__head .h48 { margin-top: 11px; }
.ic3__head .lead { margin-top: 13px; }
.ic3__cards { display: grid; grid-template-columns: repeat(3, 1fr); column-gap: 32px; margin: 57px 0 0; }
.icard { position: relative; height: 460px; border-radius: var(--radius-card); overflow: hidden; background: var(--ink); color: var(--on-dark); display: flex; flex-direction: column; justify-content: flex-end; padding: 30px; }
.icard .ph { position: absolute; inset: 0; border-radius: 0; opacity: .55; }
.icard .ph::after { top: 16px; bottom: auto; }
.icard > *:not(.ph) { position: relative; }
.icard .eyebrow { color: var(--peri); font-size: 14px; }
.icard h3 { margin-top: 10px; font-size: 24px; line-height: 1.167; letter-spacing: -.01em; font-weight: 400; color: var(--on-dark); }
.icard p { margin-top: 10px; min-height: 67px; font-size: 16px; line-height: 1.4; color: var(--on-dark-2); }
.icard .ph { opacity: .9; }
.icard::after { content: ""; position: absolute; inset: 40% 0 0; background: linear-gradient(transparent, rgba(0,2,47,.92)); }
.icard > *:not(.ph) { z-index: 1; }

/* left text / right image with mini cards (Sequoia why section 2) */
.ltri { padding-top: 36px; }
.ltri__grid { display: grid; grid-template-columns: 464px 1fr; column-gap: 48px; }
.ltri__text { padding-top: 22px; }
.ltri__text .h38 { margin-top: 8px; }
.ltri__text .lead { margin-top: 18px; }
.ltri .ph { height: 536px; }
.mini2 { display: grid; grid-template-columns: repeat(2, 180px); column-gap: 52px; margin: 24px 0 0; }
.mini { display: grid; grid-template-rows: auto 1fr 48px; min-height: 206px; }
.mini h3 { font-size: 24px; line-height: 1.167; font-weight: 500; color: var(--ink); }
.mini p { margin-top: 10px; font-size: 16px; line-height: 1.3; color: var(--text); }

/* icon callout (Sequoia why section 3) */
.callout { display: grid; grid-template-columns: 120px 1fr; column-gap: 15px; align-items: center; padding-top: 37px; }
.callout__mark { width: 120px; height: 120px; display: grid; place-items: center; border: 1px solid #C9D0F2; border-radius: var(--radius-card); font-family: var(--mono); font-size: 13px; letter-spacing: .12em; color: var(--blue); }
.callout p { font-size: 18px; line-height: 1.222; font-weight: 500; letter-spacing: .01em; color: var(--ink); }
.callout p a { color: var(--blue); text-decoration: underline; text-underline-offset: 3px; }

/* dark centred media (Sequoia why section 4) */
.dmed { padding-top: 104px; text-align: center; }
.dmed .h40 { width: 685px; margin: 12px auto 0; }
.dmed .lead { width: 800px; margin: 16px auto 0; }
.dmed__media { margin-top: 32px; height: 564px; text-align: left; }

/* bleed image left, text right (Sequoia why section 5) */
.bleed { padding-top: 85px; }
.bleed__grid { display: grid; grid-template-columns: 635px 636px; column-gap: 74px; }
.bleed .ph { height: 423px; border-radius: 0; }
.bleed__text { padding-top: 9px; }
.bleed__text .h40s { margin-top: 10px; }
.bleed__text .lead { margin-top: 9px; }
.ilinks { display: flex; gap: 60px; margin-top: 29px; }
.ilink { display: grid; gap: 14px; width: 150px; font-size: 16px; line-height: 1.25; font-weight: 500; color: var(--on-dark); }
.ilink__mark { width: 62px; height: 62px; display: grid; place-items: center; border: 1px solid #353A62; border-radius: var(--radius-card); font-family: var(--mono); font-size: 13px; color: var(--peri); }
.ilink:hover .ilink__mark { border-color: var(--peri); }

/* impact band (Sequoia why section 6) */
.impact { background: linear-gradient(90deg, var(--ink) 30%, var(--blue) 140%); padding-top: 64px; }
.impact__top { display: grid; grid-template-columns: 550px 520px; column-gap: 113px; align-items: start; }
.impact__top .h40s { margin-top: 11px; }
.impact .ilinks { margin-top: 44px; gap: 90px; padding-right: 60px; }
.impact .ilink { width: 120px; }
.impact .ilink__mark { width: 72px; height: 72px; }
.impact__call { display: grid; grid-template-columns: 120px 1fr; column-gap: 15px; align-items: center; margin-top: 97px; }
.impact__call .callout__mark { border-color: #3A4077; color: var(--peri); }
.impact__call p { font-size: 18px; line-height: 1.222; color: var(--on-dark); }

/* ---------- centred hero with art (Sequoia advisory / about) ---------- */
.hero-art { padding-top: 136px; text-align: center; }
.hero-art .h48 { width: 730px; margin: 8px auto 0; }
.hero-art .lead { width: 880px; margin: 14px auto 0; }
.hero-art .word-marquee { margin-top: 88px; height: 71px; }
.hero-art--about .lead { width: 860px; margin-top: 32px; }
.hero-art--about .hero-art__link { margin-top: 44px; }
.hero-art--about .word-marquee { margin-top: 72px; height: 55px; }

/* stats band (Sequoia advisory / about) */
.sband { background: #fff; padding-top: 58px; }
.sband__row { display: grid; grid-template-columns: repeat(4, 1fr); width: min(1280px, calc(100% - 48px)); margin: 0 auto; }
.sband__row > div { padding: 0 24px; border-left: 1px solid #E1E4EE; }
.sband__row > div:first-child { border-left: 0; padding-left: 0; }
.sband dt { font-family: var(--mono); font-size: 14px; line-height: 1.429; letter-spacing: .12em; text-transform: uppercase; color: var(--muted); }
.sband dd { margin: 10px 0 0; font-size: 40px; line-height: 1.15; letter-spacing: -.01em; color: var(--ink); }

/* centred heading + 5 cards (Sequoia advisory section 2) */
.c5 { padding-top: 58px; text-align: center; }
.c5 .h40 { width: 685px; margin: 0 auto; }
.c5 .lead { width: 866px; margin: 16px auto 0; min-height: 96px; }
.c5__cards { display: grid; grid-template-columns: repeat(5, 1fr); column-gap: 16px; width: min(1280px, calc(100% - 48px)); margin: 45px auto 0; text-align: left; }
.c5card { display: grid; grid-template-rows: auto 1fr 48px; min-height: 330px; padding: 20px 20px 0; background: #fff; border-radius: var(--radius-card); }
.c5card h3 { min-height: 56px; font-size: 24px; line-height: 1.167; letter-spacing: -.01em; font-weight: 500; color: var(--ink); }
.c5card p { margin-top: 14px; font-size: 16px; line-height: 1.4; color: var(--text); }
.c5card .sq { margin-bottom: 20px; }

/* dark zig-zag x2 (Sequoia advisory section 3) */
.dzz2 { padding-top: 80px; }
.dzz2__a { display: grid; grid-template-columns: 605px 605px; justify-content: space-between; align-items: start; }
.dzz2__a .lead { margin-top: 16px; }
.dzz2__a .ph { height: 340px; }
.dzz2__b { display: grid; grid-template-columns: 605px 605px; justify-content: space-between; align-items: center; margin-top: 64px; }
.dzz2__b .ph { height: 320px; }
.dzz2__b ul { margin: 19px 0 0 35px; }
.dzz2__b li { position: relative; font-size: 18px; line-height: 1.57; color: var(--on-dark); }
.dzz2__b li + li { margin-top: 12px; }
.dzz2__b li::before { content: ""; position: absolute; left: -35px; top: 5px; width: 20px; height: 20px; background: var(--peri); -webkit-mask: url("../img/check.svg") center / 14px no-repeat, linear-gradient(#000,#000); -webkit-mask-composite: xor; mask: url("../img/check.svg") center / 14px no-repeat exclude, linear-gradient(#000,#000); }

/* ---------- about ---------- */
.lzz2 { padding-top: 112px; }
.lzz2__row { display: grid; grid-template-columns: 605px 605px; justify-content: space-between; align-items: center; }
.lzz2 .ph { height: 420px; }
.lzz2 .h42 { font-size: 42px; line-height: 1.2; font-weight: 500; letter-spacing: -.01em; color: var(--ink); }
.lzz2 .lead + .lead { margin-top: 14px; }
.lzz2 .h42 + .lead { margin-top: 20px; }
.lzz2__row + .lzz2__row { margin-top: 120px; }
.lzz2__news { margin-top: 20px; }

.qband { padding-top: 107px; }
.qband__grid { display: grid; grid-template-columns: 380px 830px; justify-content: space-between; }
.qband .ph { height: 339px; }
.qband figure { margin: 0; padding-top: 64px; }
.qband blockquote { min-height: 120px; font-size: 24px; line-height: 1.25; letter-spacing: -.01em; color: var(--on-dark); }
.qband cite { display: block; margin-top: 35px; font-style: normal; font-size: 18px; line-height: 1.57; color: var(--on-dark-2); }

.lzz3 { padding-top: 112px; }
.lzz3__row { display: grid; grid-template-columns: 605px 605px; justify-content: space-between; align-items: center; }
.lzz3__row + .lzz3__row { margin-top: 40px; }
.lzz3 .ph { height: 190px; }
.lzz3 h2, .col3 h2 { font-size: 28px; line-height: 1.2; font-weight: 500; letter-spacing: -.01em; color: var(--ink); }
.lzz3 p:not(.k-stage p), .col3 p { margin-top: 12px; font-size: 18px; line-height: 1.333; color: var(--text-2); }
.lzz3 .arrow-link, .col3 .arrow-link { margin-top: 16px; }
.col3 { display: grid; grid-template-columns: repeat(3, 1fr); column-gap: 32px; width: min(1280px, calc(100% - 48px)); margin: 96px auto 0; }
.col3 > div { max-width: 360px; }

.tl { padding-top: 70px; }
.tl__head { display: flex; justify-content: space-between; align-items: flex-start; }
.tl__head .rail-ctrl { margin: 0 -8px 0 0; }
.tl__head h2 { margin-top: 17px; font-size: 28px; line-height: 1.2; font-weight: 500; color: var(--ink); }
.tl__rail { padding-left: max(24px, calc(50% - 640px)); }
.tl .rail { grid-auto-columns: 393px; gap: 100px; height: auto; margin-top: 42px; padding-right: 80px; list-style: none; }
.tl .rail-ctrl button { border-color: #C8CCE0; color: var(--ink); }
.tslide .yr { font-size: 43px; line-height: 1.2; font-weight: 700; letter-spacing: -.01em; color: var(--blue); }
.tslide h3 { margin-top: 12px; font-size: 24px; line-height: 1.2; font-weight: 500; color: var(--ink); }
.tslide p { margin-top: 12px; font-size: 18px; line-height: 1.57; color: var(--text-2); }

/* ---------- form + contact (unmeasured Sequoia templates; built from measured primitives) ---------- */
.formwrap { padding: 72px 0 120px; }
.formwrap__grid { display: grid; grid-template-columns: 464px 717px; justify-content: space-between; }
.form { display: grid; grid-template-columns: 1fr 1fr; gap: 20px 24px; padding: 40px; background: #fff; border: 1px solid #E1E4EE; border-radius: var(--radius-card); }
.form .full { grid-column: 1 / -1; }
.form label { display: block; font-size: 14px; line-height: 1.429; font-weight: 500; color: var(--ink); }
.form label span { color: var(--muted); font-weight: 400; }
.form input, .form select, .form textarea { width: 100%; margin-top: 6px; padding: 11px 12px; font: 16px/1.25 var(--sans); color: var(--ink); background: #fff; border: 1px solid #C9CDE0; border-radius: var(--radius); }
.form textarea { min-height: 120px; resize: vertical; }
.form input:focus, .form select:focus, .form textarea:focus { outline: 2px solid var(--blue); outline-offset: 0; border-color: var(--blue); }
.form fieldset { border: 0; padding: 0; margin: 0; }
.form legend { font-size: 14px; font-weight: 500; color: var(--ink); margin-bottom: 8px; }
.checks { display: grid; grid-template-columns: repeat(3, 1fr); gap: 8px 16px; }
.checks label { display: flex; gap: 8px; align-items: center; font-weight: 400; font-size: 15px; }
.checks input { width: 16px; height: 16px; margin: 0; accent-color: var(--blue); }
.form .note { font-size: 13px; line-height: 1.4; color: var(--muted); }
.form .btn--solid { justify-self: start; }
.form__status { grid-column: 1 / -1; font-size: 15px; color: var(--blue); }
.aside-list { margin-top: 32px; display: grid; gap: 22px; }
.aside-list h3 { font-size: 20px; line-height: 1.2; font-weight: 500; color: var(--ink); }
.aside-list p { margin-top: 6px; font-size: 16px; line-height: 1.5; color: var(--text); }
.aside-list a { color: var(--blue); }

/* job list (Find Jobs) */
.jobs { padding: 72px 0 120px; }
.jobs__head { display: flex; justify-content: space-between; align-items: flex-start; gap: 24px; }
.jobtable { margin-top: 40px; border-top: 1px solid var(--rule); }
.jobrow { display: grid; grid-template-columns: 1.4fr 1fr 1fr 150px; gap: 24px; align-items: center; padding: 24px 0; border-bottom: 1px solid var(--rule); }
.jobrow h3 { font-size: 20px; line-height: 1.2; font-weight: 500; color: var(--ink); }
.jobrow p { font-size: 16px; color: var(--text); }
.jobrow > .arrow-link { justify-self: end; }
.empty { padding: 48px; margin-top: 40px; background: var(--tint-2); border: 1px dashed #BFC6EA; border-radius: var(--radius-card); }

/* =====================================================================
   RESPONSIVE: tablet collapses to the measured mobile rules
   (24px gutters, section h2 32/1.125 left, stacked columns)
   ===================================================================== */
@media (max-width: 1320px) {
  .trip__grid { grid-template-columns: 1fr 1.8fr 1fr; gap: 32px; }
  .trip__img { width: 100%; }
  .cards4, .ins__cards, .tiles4, .qcards, .cap__grid, .c5__cards, .ic3__cards { grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); column-gap: 24px; margin-left: 0; padding-left: 0; }
  .split-head, .cmp .split-head, .cmp__labels, .cmp__row, .zz, .zz3__row, .hero-q__top, .hero-q__mid, .ltri__grid, .bleed__grid, .impact__top, .dzz2__a, .lzz2__row, .qband__grid, .lzz3__row, .formwrap__grid, .acc-sec__grid, .chk__cols, .hero-ls__grid, .hcard { grid-template-columns: 1fr 1fr; column-gap: 40px; }
  .dzz2__b { grid-template-columns: 1fr 1fr; column-gap: 40px; }
  .hero-q__graphic, .steps { height: auto; min-height: 420px; }
  .callout, .impact__call { grid-template-columns: 120px 1fr; }
  .col3 { grid-template-columns: repeat(3, 1fr); column-gap: 40px; }
  .certs, .zz3--a .zz3__band .h32l, .zz3--b .zz3__band .h28l, .acc-sec .h40 { width: auto; }
  .assure p { width: auto; flex: 1; }
  .assure__row { gap: 40px; }
}

@media (max-width: 1023px) {
  /* live mobile: light 84px bar, 200x30 wordmark, 44px blue menu button; menu drops down over the page */
  .hdr__nav, .nav__item--login, .hdr__cta { display: none; }
  .hdr, .hdr--solid { background: #F0F1F9; color: var(--ink); border: 0; }
  .hdr.is-stuck { background: #F0F1F9; border: 0; box-shadow: 0 1px 0 rgba(10,9,21,.06); }
  .hdr__row { height: 84px; padding: 20px; }
  .hdr .hdr__logo img { content: url("../img/logo-live-dark.png"); }
  .hdr__burger { display: flex; flex-direction: column; justify-content: center; gap: 9px; width: 44px; height: 44px; padding: 0 12px; margin-left: auto; background: var(--blue); border: 0; border-radius: 2px; cursor: pointer; }
  .hdr__burger span { display: block; height: 2px; background: #fff; }
  .mnav { position: fixed; inset: 0 0 auto; z-index: 50; max-height: 100vh; overflow-y: auto; padding: 20px 20px 26px; background: #F0F1F9; color: #0D0D0D; box-shadow: 0 24px 48px rgba(0,2,47,.25); }
  .mnav.open { display: block; }
  .mnav__top-bar { display: flex; justify-content: space-between; align-items: center; height: 44px; margin-bottom: 36px; }
  .mnav__close { display: grid; place-items: center; width: 44px; height: 44px; padding: 0; background: var(--blue); color: #fff; border: 0; border-radius: 2px; cursor: pointer; }
  .mnav__close svg { width: 20px; height: 20px; }
  .mnav__row { display: flex; align-items: center; gap: 12px; width: 100%; padding: 0; font: 400 20px/28px var(--sans); letter-spacing: -.8px; color: #0D0D0D; text-align: left; background: none; border: 0; cursor: pointer; }
  .mnav__row .arr { width: 22px; height: 22px; }
  .mnav__row + .mnav__row, .mnav__grp + .mnav__row, .mnav__row + .mnav__grp { margin-top: 18px; }
  .mnav__row[aria-expanded="true"] .arr { display: none; }
  .mnav__row[aria-expanded="true"]::after { content: ""; width: 22px; height: 22px; background: currentColor; -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M6 6l12 12M18 6L6 18' stroke='black' stroke-width='1.5'/%3E%3C/svg%3E") center / 22px no-repeat; mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M6 6l12 12M18 6L6 18' stroke='black' stroke-width='1.5'/%3E%3C/svg%3E") center / 22px no-repeat; }
  .mnav__grp { display: none; }
  .mnav__grp.open { display: block; margin-top: 18px; }
  .mnav__row--sub { padding-left: 16px; font-size: 18px; color: #3B3D4A; }
  .mnav.has-open .mnav__top:not([aria-expanded="true"]) { display: none; }
  .mnav__btns { display: grid; gap: 9px; margin-top: 36px; }
  .mbtn { display: flex; align-items: center; justify-content: center; gap: 10px; height: 53px; border-radius: 4px; font: 500 18px/1 var(--sans); letter-spacing: -.36px; }
  .mbtn--solid { background: var(--blue); color: #F2F3FA; }
  .mbtn--solid svg { width: 18px; height: 18px; }
  .mbtn--line { border: 1px solid var(--blue); color: var(--blue); font-size: 16px; letter-spacing: -.16px; }
}

@media (max-width: 760px) {
  .w1280, .w1240, .w1160, .w1152, .w1140, .w960 { width: calc(100% - 48px); }
  .display { font-size: 32px; line-height: 1.14; padding-bottom: 0; }
  .h48 { font-size: 32px; line-height: 1.125; }
  .h40, .h40s, .h38, .h32 { font-size: 32px; line-height: 1.125; }
  .h32l, .h28l { font-size: 28px; line-height: 1.286; }
  .h42 { font-size: 30px !important; }
  .lead { font-size: 16px; line-height: 1.5; }
  /* section headings go left on mobile, as measured */
  .trip .h40, .split4 .h40, .cap .h40, .cap .lead, .t3 .h40, .t3 .lead, .acc-sec .h40, .acc-sec .lead, .c5 .h40, .c5 .lead, .dmed .h40, .dmed .lead, .dmed .eyebrow, .hcards > .w1152 > .h40, .ins > .w1140 > .h40, .chk .h40s { text-align: left; width: auto; }
  .dzz > .w1280 > .h40, .dzz > .w1280 > .lead, .hero-lc .h48, .hero-lc .lead, .hero-art .h48, .hero-art .lead, .hero-sub .lead, .pre .h40, .dcar .h40 { width: auto; }
  .trip .h40, .trip__link { text-align: left; }
  .pre .h40 { font-size: 32px; line-height: 1.375; }

  .hero-mq { padding-top: 107px; }
  .hero-mq .marquee { margin-top: 48px; height: 229px; }
  .card-marquee .ph { width: 172px; height: 229px; }
  .stat-row { grid-template-columns: repeat(2, 1fr); column-gap: 24px; row-gap: 40px; margin-top: 60px; padding-bottom: 50px; }
  .stat-row dd { height: auto; margin-bottom: 8px; }
  .trip { padding: 50px 0 90px; }
  .trip__link { margin-top: 24px; }
  .trip__grid { grid-template-columns: 1fr; gap: 0; margin-top: 40px; }
  .trip__img { height: 257px; order: -1; }
  .trip__col { display: block; padding-top: 0; }
  .trip__col > div { margin-top: 20px; }
  .trip__col h3 { margin-top: 0; }
  .split4 { padding: 30px 0 50px; }
  .split-head, .cmp .split-head { grid-template-columns: 1fr; padding-left: 0; row-gap: 24px; }
  .split-head .lead { margin-top: 0; }
  .cards4 { grid-template-columns: 1fr; row-gap: 48px; margin: 48px 0 0; padding: 0; }
  .card4 { grid-template-rows: auto auto 48px; row-gap: 16px; }
  .dcar { padding: 50px 0 100px; }
  .dcar__link { margin-top: 24px; }
  .dcar__track, .dcar--nolink .dcar__track { margin-top: 40px; }
  .rail { grid-auto-columns: 82%; height: auto; }
  .story { grid-template-rows: 240px auto; }
  .story .ph { height: 240px; }
  .ins { padding: 50px 0; }
  .ins__bar { margin-top: 40px; }
  .ins__cards, .tiles4, .qcards, .cap__grid, .c5__cards, .ic3__cards { grid-template-columns: 1fr; row-gap: 32px; }
  .post h3 { width: auto; margin-top: 20px; min-height: 0; }
  .tiles4 { margin-top: 24px; padding-left: 0; }
  .pre { padding: 50px 0 100px; }
  .pre__btns { margin-top: 32px; flex-direction: column; align-items: stretch; }

  .hero-sub { padding: 107px 0 40px; }
  .pills { display: none; }
  .hero-sub .eyebrow { margin-top: 0; }
  .hero-sub .word-marquee { margin-top: 56px; }
  .cmp { padding: 50px 0 120px; }
  .cmp__labels { display: none; }
  .cmp__row { grid-template-columns: 1fr; row-gap: 16px; }
  .cmp__row::before { content: attr(data-l); font-family: var(--mono); font-size: 14px; letter-spacing: .12em; color: var(--muted); }
  .cmp__rows { margin-top: 40px; row-gap: 48px; }
  .dzz { padding: 30px 0 80px; }
  .zz, .zz3__row, .dzz2__a, .dzz2__b, .lzz2__row, .lzz3__row, .qband__grid, .hero-q__top, .hero-q__mid, .ltri__grid, .bleed__grid, .impact__top, .acc-sec__grid, .chk__cols, .hero-ls__grid, .hcard, .formwrap__grid, .jobrow { grid-template-columns: 1fr; row-gap: 24px; }
  .zz .ph, .zz3 .ph { height: 240px !important; order: -1; }
  .zz--flip .zz__text, .zz3__row--flip .zz3__text { order: 0; }
  .zz3 { padding: 30px 0 80px; }
  .zz3__row .zz3__text { margin-top: 0 !important; }
  .zz3__row + .zz3__row { margin-top: 56px !important; }
  .zz3__band { margin-top: 64px !important; text-align: left; }
  .certs { justify-content: flex-start; gap: 8px; margin-top: 28px; } .certs li { height: 40px; font-size: 14px; padding: 0 14px 0 12px; }
  .cap { padding: 50px 0 80px; }
  .cap__grid { margin-top: 40px; }
  .ctile, .cap--8 .ctile { min-height: 0; }
  .dcards { padding: 60px 0 80px; }
  .t3 { padding: 50px 0 80px; }
  .t3 .qcards, .t3--short .qcards { margin-top: 40px; }
  .qcard { min-height: 0 !important; }
  .hero-lc { padding: 56px 0 86px; }
  .acc-sec { padding: 50px 0 80px; }
  .acc-sec .ph { display: none; }
  .acc-sec__grid { margin-top: 24px; }
  .acc summary { font-size: 18px; }
  .acc .acc__body { font-size: 16px; }
  .hcards { padding: 50px 0 80px; }
  .hcard .ph { min-height: 220px; }
  .hcard__text { padding: 28px 20px 32px; }
  .hero-ls { padding: 56px 0 86px; }
  .hero-ls .ph { display: none; }
  .chk { padding: 60px 0 100px; }
  .chk__cols { margin-top: 40px; row-gap: 48px; }
  .chk li { font-size: 16px; }
  .assure { padding: 50px 0; }
  .assure__badge { display: none; }
  .hero-q { padding-top: 107px; padding-bottom: 60px; }
  .hero-q__top .lead { margin-top: 24px; }
  .hero-q__mid { padding-left: 0; margin-top: 40px; }
  .hero-q__quote { font-size: 24px; line-height: 1.167; }
  .hero-q .word-marquee { margin-top: 48px; }
  .steps { min-height: 0; }
  .step { padding: 18px 20px; }
  .ic3 { padding: 60px 0 40px; }
  .ic3__head, .ic3__cards { padding: 0; margin-left: 0; margin-right: 0; grid-template-columns: 1fr; }
  .icard { height: 400px; }
  .ltri { padding: 40px 0 60px; }
  .ltri .ph { height: 244px; }
  .mini2 { grid-template-columns: 1fr; row-gap: 32px; margin-left: 0; }
  .callout { grid-template-columns: 1fr; padding: 10px 0 60px; }
  .callout__mark, .impact__call .callout__mark { display: none; }
  .impact__call { grid-template-columns: 1fr; }
  .dmed { padding: 60px 0; }
  .dmed__media { height: 240px; }
  .bleed { padding: 0 0 60px; }
  .bleed .ph { height: 249px; }
  .bleed__text { padding: 0 24px; }
  .ilinks, .impact .ilinks { flex-direction: column; gap: 24px; padding-right: 0; }
  .impact { padding: 40px 0 90px; }
  .hero-art { padding: 107px 0 40px; }
  .hero-art .word-marquee { margin-top: 48px; }
  .sband { padding: 40px 0; }
  .sband__row { grid-template-columns: 1fr 1fr; row-gap: 32px; }
  .sband__row > div:nth-child(3) { border-left: 0; padding-left: 0; }
  .c5 { padding: 50px 0 80px; }
  .c5card { min-height: 0; row-gap: 20px; }
  .dzz2 { padding: 30px 0 80px; }
  .dzz2__a .ph, .dzz2__b .ph { margin-top: 0; order: -1; height: 240px; }
  .dzz2__b { margin-top: 56px; }
  .lzz2 { padding: 50px 0 80px; }
  .lzz2 .ph, .qband .ph { display: none; }
  .lzz2__row .lzz2__text { margin-top: 0 !important; }
  .lzz2__row + .lzz2__row { margin-top: 48px; }
  .qband { padding: 80px 0; }
  .qband figure { padding-top: 0; }
.qband blockquote { font-size: 20px; line-height: 1.5; }
  .lzz3 { padding: 50px 0; }
  .lzz3 .ph { display: none; }
  .col3 { grid-template-columns: 1fr; row-gap: 40px; }
  .tl { padding: 50px 0; }
  .tl .rail { grid-auto-columns: 80%; gap: 40px; }
  .tslide .yr { font-size: 36px; }
  .formwrap, .jobs { padding: 48px 0 80px; }
  .form { grid-template-columns: 1fr; padding: 24px 20px; }
  .checks { grid-template-columns: 1fr 1fr; }
  .jobs__head { flex-direction: column; align-items: start; }
}

/* testimonial cards in the dark carousel slot (quotes as published on protradestaffing.com) */
.tq3 { grid-auto-columns: calc((100% - 64px) / 3); gap: 32px; }
.tcard { display: flex; flex-direction: column; min-height: 460px; margin: 0; padding: 36px 32px 32px; background: rgba(0,2,46,.8); border: 1px solid #1F2466; border-radius: var(--radius-card); text-align: left; }
.tcard .eyebrow { font-size: 14px; }
.tcard .qtext { margin: 28px 0 32px; font-size: 28px; line-height: 1.214; letter-spacing: -.01em; color: var(--on-dark); }
.tcard .qtext em { font-style: normal; color: var(--peri); }
.tcard figcaption { margin-top: auto; padding-top: 24px; border-top: 1px solid #23286A; }
.tcard strong { display: block; font-size: 20px; line-height: 1.4; font-weight: 500; color: var(--on-dark); }
.tcard figcaption span { display: block; font-size: 16px; line-height: 1.75; color: var(--on-dark-2); }
.post:hover h3 { color: var(--blue); }
.tile4:hover .body { color: var(--ink); }
@media (max-width: 760px) {
  .tq3 { grid-auto-columns: 86%; }
  .tcard { height: auto; min-height: 420px; }
  .tcard .qtext { font-size: 22px; }
}

/* FAQ page: accordion groups at full content width (guide: composite of healthcare hero + accordion) */
.faq-tabs { display: flex; justify-content: center; gap: 8px; margin-top: 28px; }
.faq-tabs a { display: inline-flex; align-items: center; height: 38px; padding: 8px 16px; border: 1px solid #C9CDE0; border-radius: var(--radius); font-size: 16px; font-weight: 500; color: var(--ink); background: #fff; }
.faq-tabs a:hover { border-color: var(--blue); color: var(--blue); }
.faq-wrap { padding: 30px 0 60px; }
.faq-grp { padding: 57px 0 20px; scroll-margin-top: 20px; }
.faq-grp__head { display: grid; grid-template-columns: 423px 666px; justify-content: space-between; align-items: end; padding-bottom: 20px; border-bottom: 1px solid var(--rule); }
.faq-grp__head .h40 { padding-bottom: 0; }
.acc--full details:last-child { border-bottom: 1px solid var(--rule); }
.acc--full summary { padding-right: 60px; }
.acc--full details { scroll-margin-top: 20px; }
.acc--full details:target summary { color: var(--blue); }
@media (max-width: 760px) {
  .faq-tabs { flex-wrap: wrap; justify-content: flex-start; }
  .faq-grp__head { grid-template-columns: 1fr; row-gap: 8px; }
}

/* week strip (How it works, dark centred media slot) */
.week { display: grid; grid-template-columns: repeat(5, 1fr); gap: 1px; background: #262A5A; border: 1px solid #262A5A; border-radius: var(--radius-card); overflow: hidden; list-style: none; }
.week li { display: flex; flex-direction: column; padding: 36px 26px; background: #070A33; }
.week li:nth-child(4) { background: #0C1352; }
.week b { font-family: var(--mono); font-size: 13px; font-weight: 500; letter-spacing: .12em; text-transform: uppercase; color: var(--peri); }
.week strong { margin-top: 64px; min-height: 56px; font-size: 24px; line-height: 1.167; font-weight: 400; letter-spacing: -.01em; color: var(--on-dark); }
.week span { margin-top: 12px; font-size: 16px; line-height: 1.4; color: var(--on-dark-2); }
@media (max-width: 1023px) { .week { grid-template-columns: 1fr 1fr; } }
@media (max-width: 760px) { .week { grid-template-columns: 1fr; height: auto; } .week li { padding: 24px 20px; } .week strong { margin-top: 16px; } .hero-q__who { margin-top: 32px; } .hero-q__quote { min-height: 0; } .hero-q__who p { width: auto; } }

/* contact page */
.contact { padding: 72px 0 120px; }
.contact__grid { display: grid; grid-template-columns: 1.2fr 1fr 1fr; gap: 16px; }
.ccard { display: flex; flex-direction: column; gap: 14px; min-height: 220px; padding: 32px; background: #fff; border: 1px solid #E1E4EE; border-radius: var(--radius-card); }
.ccard strong { margin-top: auto; font-size: 24px; line-height: 1.25; font-weight: 400; letter-spacing: -.01em; color: var(--ink); overflow-wrap: anywhere; }
.ccard--main { background: var(--ink); border-color: var(--ink); }
.ccard--main .eyebrow { color: var(--peri); }
.ccard--main strong { font-size: 40px; color: #fff; }
.ccard--main .body { color: var(--on-dark-2); }
a.ccard:hover { border-color: var(--blue); }
.contact__paths { display: grid; grid-template-columns: repeat(3, 1fr); gap: 48px; margin-top: 88px; }
.contact__paths .lead { margin: 12px 0 24px; }
.res { padding: 86px 0 120px; }
.res .jobrow { grid-template-columns: 1fr 1.6fr 1fr 100px; }
.hero-lc .lead a { text-decoration: underline; text-underline-offset: 3px; }
.jobs__head .h40 { padding-bottom: 0; }
.empty { margin-top: 48px; }
@media (max-width: 1023px) { .contact__grid, .contact__paths { grid-template-columns: 1fr; } }
@media (max-width: 760px) { .contact, .res { padding: 48px 0 80px; } .ccard--main strong { font-size: 32px; } .res .jobrow { grid-template-columns: 1fr; } }
@media (max-width: 760px) {
  .ins__bar { flex-direction: column; gap: 8px; }
  .ins__bar .h24b { width: auto; padding-bottom: 0; }
  .ins__bar .arrow-link { margin: 0; }
  .ins__cards { width: calc(100% - 48px); }
  .tiles4 { width: auto; margin-left: 24px; margin-right: 24px; }
}

/* Resources page: its hero already says what the insights block is, so the block's own heading is dropped there */
.hero-lc + .ins > .w1140 { display: none; }
.hero-lc + .ins .ins__bar:first-of-type { margin-top: 0; }
.hero-lc + .ins { min-height: 0; padding-top: 72px; padding-bottom: 96px; }
@media (max-width: 760px) {
  .hero-mq__btns { flex-direction: column; align-items: stretch; }
  .stat-row dd { font-size: 32px; height: auto; }
  .card4 { min-height: 0; }
  .col3 { margin-top: 48px; }
  .dzz2__b { margin-top: 56px; }
  .week strong, .week span { min-height: 0; }
  .jobrow > .arrow-link { justify-self: start; }
  .hero-ls__grid { grid-template-columns: 1fr; }
}
/* FAQ groups: title and summary stay pinned on the left while the questions run down the right */
@media (min-width: 1024px) {
  .faq-grp > .w1280 { display: grid; grid-template-columns: 360px 1fr; column-gap: 80px; align-items: start; }
  .faq-grp__head { display: block; position: sticky; top: 123px; padding-bottom: 0; border-bottom: 0; }
  .faq-grp__head .lead { margin-top: 12px; }
  .faq-grp .acc--full { border-top: 1px solid var(--rule); }
  .faq-grp .acc--full summary { padding-top: 22px; padding-bottom: 22px; }
}

/* =====================================================================
   PHOTOS AND PRODUCT GRAPHICS
   .ph--img: a real photo (built from assets/img/photos, see src/photos.py)
   .ph--demo: a designed product graphic (src/demos.py) where the slot shows
   a process or a piece of the service rather than a person
   ===================================================================== */
.ph--img::before, .ph--img::after, .ph--demo::after { display: none; }
.ph--img picture, .ph--img img { display: block; width: 100%; height: 100%; object-fit: cover; }
.ph--demo { display: grid; place-items: center; padding: 32px; background: radial-gradient(120% 100% at 15% 0%, #FFFFFF 0%, #E8EBFA 50%, #D5DBF6 100%); }
.ph--demo::before { background: radial-gradient(circle, rgba(12,42,193,.10) 1px, transparent 1.5px) 0 0 / 18px 18px; }
.dark .ph--demo { background: radial-gradient(120% 100% at 15% 0%, #1A2380 0%, #0D1450 45%, #070B33 100%); border: 1px solid #222A6A; }
.dark .ph--demo::before { background: radial-gradient(circle, rgba(164,173,245,.12) 1px, transparent 1.5px) 0 0 / 18px 18px; }

.demo { position: relative; z-index: 1; width: min(100%, 420px); font-family: var(--sans); color: var(--ink); text-align: left; }
.d-card { padding: 20px; background: #fff; border: 1px solid rgba(0,2,47,.06); border-radius: var(--radius-card); box-shadow: 0 1px 2px rgba(0,2,47,.06), 0 24px 48px -16px rgba(0,2,47,.28); }
.d-head { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin-bottom: 14px; }
.d-lbl { font-family: var(--mono); font-size: 11px; line-height: 1.3; font-weight: 500; letter-spacing: .12em; text-transform: uppercase; color: var(--muted); }
.d-meta { font-size: 12px; color: var(--muted); }
.d-title { margin-bottom: 6px; font-size: 20px; line-height: 1.25; font-weight: 500; letter-spacing: -.01em; }
.d-pill { flex: none; padding: 4px 8px; border-radius: var(--radius); font-size: 12px; line-height: 1.2; font-weight: 500; white-space: nowrap; }
.d-pill--ok { background: #E4F4EA; color: #17663A; }
.d-pill--wait { background: #FFF3D6; color: #875600; }
.d-pill--blue { background: #E7EBFD; color: var(--blue); }
.d-chip { display: inline-block; margin: 0 4px 0 0; padding: 2px 6px; font-family: var(--mono); font-size: 11px; line-height: 1.4; color: var(--text); background: var(--tint-2); border: 1px solid #E1E4EE; border-radius: var(--radius-tile); }
.d-rows > div { display: grid; grid-template-columns: 104px 1fr; gap: 12px; padding: 9px 0; border-top: 1px solid #EEF0F6; }
.d-rows dt { font-size: 13px; line-height: 1.4; color: var(--muted); }
.d-rows dd { margin: 0; font-size: 14px; line-height: 1.4; font-weight: 500; }
.d-list li { display: flex; align-items: center; gap: 12px; padding: 10px 0; border-top: 1px solid #EEF0F6; }
.d-list li > div { flex: 1; min-width: 0; }
.d-list strong { display: block; font-size: 14px; line-height: 1.3; font-weight: 500; }
.demo--roster .d-list strong { flex: 1; }
.d-list li > div > span { display: block; margin-top: 5px; }
.d-av { flex: none; display: grid; place-items: center; width: 32px; height: 32px; border-radius: var(--radius); background: #E7EBFD; font-family: var(--mono); font-size: 13px; font-weight: 500; color: var(--blue); }
.d-foot { margin-top: 12px; padding-top: 12px; border-top: 1px solid #EEF0F6; }
.d-check { display: inline-flex; align-items: center; gap: 6px; font-size: 13px; line-height: 1.3; color: #17663A; }
.d-check::before, .d-ticks li::before { content: ""; width: 14px; height: 14px; flex: none; background: currentColor; -webkit-mask: url("../img/check.svg") center / contain no-repeat; mask: url("../img/check.svg") center / contain no-repeat; }
.d-week, .d-cal { display: grid; grid-template-columns: repeat(5, 1fr); gap: 6px; }
.d-week > div, .d-cal > div { padding: 10px 6px; border-radius: var(--radius); background: #F5F6FB; text-align: center; }
.d-week span, .d-cal span { display: block; font-family: var(--mono); font-size: 11px; letter-spacing: .08em; text-transform: uppercase; color: var(--muted); }
.d-week b { display: block; margin-top: 4px; font-size: 20px; line-height: 1.2; font-weight: 500; font-variant-numeric: tabular-nums; }
.d-cal b { display: block; margin-top: 4px; font-size: 12px; font-weight: 500; }
.d-cal .is-start { background: var(--blue); }
.d-cal .is-start span, .d-cal .is-start b { color: #fff; }
.d-split { display: grid; grid-template-columns: 1fr 1fr; gap: 6px; margin-top: 6px; }
.d-split > div { display: flex; justify-content: space-between; align-items: baseline; padding: 9px 10px; border: 1px solid #EEF0F6; border-radius: var(--radius); }
.d-split span { font-size: 12px; color: var(--muted); }
.d-split b { font-size: 14px; font-weight: 500; font-variant-numeric: tabular-nums; }
.d-sign { display: flex; align-items: center; justify-content: space-between; margin-top: 14px; padding-top: 14px; border-top: 1px dashed #D6D9E6; }
.d-sig { font-size: 13px; color: var(--muted); }
.d-ticks { display: grid; gap: 8px; margin-top: 14px; }
.d-ticks li { display: flex; align-items: center; gap: 8px; font-size: 14px; }
.d-ticks li::before { color: #17663A; }
.demo--certs { width: min(100%, 400px); }
.d-stack { position: relative; height: 212px; }
.d-cert { position: absolute; left: calc(var(--i) * 44px); top: calc(var(--i) * 52px); width: 260px; padding: 16px 18px; background: #fff; border-radius: var(--radius-card); box-shadow: 0 1px 2px rgba(0,2,47,.06), 0 18px 36px -14px rgba(0,2,47,.3); }
.d-cert strong { display: block; margin: 4px 0 10px; font-size: 18px; line-height: 1.2; font-weight: 500; }
.d-browser { padding: 0; overflow: hidden; }
.d-bar { display: flex; align-items: center; gap: 6px; padding: 10px 12px; background: var(--tint-2); border-bottom: 1px solid #E6E8F2; }
.d-bar i { width: 8px; height: 8px; border-radius: 50%; background: #C9CDE0; }
.d-bar span:not(.d-pill) { margin-left: 8px; font-size: 12px; color: var(--muted); }
.d-bar .d-pill { margin-left: auto; }
.d-app { display: grid; grid-template-columns: 60px 1fr; min-height: 190px; }
.d-side { display: grid; align-content: start; gap: 10px; padding: 14px 12px; background: #F7F8FC; border-right: 1px solid #EEF0F6; }
.d-side b { height: 8px; border-radius: 2px; background: #DDE1F0; }
.d-side b:first-child { background: #C3CBF4; }
.d-main { display: grid; align-content: start; gap: 10px; padding: 16px; }
.d-sk { width: 80%; height: 9px; border-radius: 2px; background: #E8EAF3; }
.d-sk--h { width: 45%; height: 14px; background: #C9D0F2; }
.d-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 8px; margin-top: 6px; }
.d-grid div { height: 60px; border: 1px solid #E8EAF3; border-radius: var(--radius); background: #FAFBFE; }
/* smaller slots show the same graphic at a smaller scale */
.post .ph--demo, .acc-sec .ph--demo { padding: 20px; }
.post .demo, .acc-sec .demo { zoom: .72; }
@media (max-width: 760px) {
  .ph--demo { padding: 20px; }
  .demo { zoom: .85; }
  .d-rows > div { grid-template-columns: 88px 1fr; }
}
.icard:has(.ph--demo)::after { display: none; }
.icard .ph--demo { position: relative; inset: auto; flex: 1; opacity: 1; align-items: start; margin: -30px -30px 24px; padding: 24px 24px 0; border: 0; border-radius: 0; -webkit-mask: linear-gradient(#000 70%, transparent); mask: linear-gradient(#000 70%, transparent); }
/* process cards with a product graphic: light card, graphic on top fading out, text below */
.icard:has(.ph--demo) { background: #fff; color: var(--ink); border: 1px solid #E1E4EE; }
.icard:has(.ph--demo) .eyebrow { color: var(--blue); }
.icard:has(.ph--demo) h3 { color: var(--ink); }
.icard:has(.ph--demo) p:not(.eyebrow) { color: var(--text); }
.icard .demo { zoom: .72; }
@media (max-width: 760px) {
  .ph.ph--demo { height: auto !important; min-height: 0; padding: 24px 16px; }
  .icard:has(.ph--demo) { height: auto; }
  .icard .ph--demo { max-height: 220px; }
  .mini { min-height: 0; row-gap: 16px; grid-template-rows: auto auto 48px; }
}
@media (max-width: 760px) { .cap__grid { grid-template-columns: 1fr 1fr; column-gap: 20px; row-gap: 32px; } .ctile h3 { margin-top: 14px; font-size: 18px; } }
/* FAQ question graphics */
.d-rows--wide > div { grid-template-columns: 1fr auto; }
.d-rows--wide dd .d-check { font-weight: 500; }
.d-steps { display: grid; gap: 0; }
.d-steps li { position: relative; display: flex; gap: 12px; padding: 10px 0 10px; }
.d-steps li + li::before { content: ""; position: absolute; left: 6px; top: -10px; height: 20px; width: 1.5px; background: #D6DAEA; }
.d-steps i { flex: none; width: 14px; height: 14px; margin-top: 2px; border-radius: 50%; border: 2px solid #17663A; background: #17663A; }
.d-steps .is-now i { background: #fff; border-color: var(--blue); box-shadow: 0 0 0 4px #E7EBFD; }
.d-steps strong { display: block; font-size: 14px; line-height: 1.3; font-weight: 500; }
.d-steps span { display: block; margin-top: 2px; font-size: 12px; line-height: 1.35; color: var(--muted); }
.d-form { padding: 16px 18px; }
.d-formhead { display: flex; align-items: baseline; gap: 10px; padding-bottom: 10px; border-bottom: 2px solid var(--ink); }
.d-formhead b { font-size: 22px; line-height: 1; font-weight: 600; letter-spacing: -.01em; }
.d-formhead span { font-size: 12px; color: var(--muted); }
.d-boxes { display: grid; grid-template-columns: 1fr 1fr; border-left: 1px solid #DDE0EC; border-top: 1px solid #DDE0EC; margin-top: 12px; }
.d-box { padding: 7px 9px 9px; border-right: 1px solid #DDE0EC; border-bottom: 1px solid #DDE0EC; }
.d-box--wide { grid-column: 1 / -1; }
.d-box span { display: block; font-family: var(--mono); font-size: 9.5px; letter-spacing: .06em; text-transform: uppercase; color: var(--muted); }
.d-box strong { display: block; margin-top: 4px; font-size: 14px; font-weight: 500; }
.d-box em { display: block; font-style: normal; font-size: 12px; color: var(--muted); }
.d-box i { display: block; width: 60%; height: 8px; margin-top: 7px; border-radius: 2px; background: #E8EAF3; }
.d-fields { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; }
.d-field { padding: 8px 10px; border: 1px solid #E1E4EE; border-radius: var(--radius); }
.d-field span { display: block; font-size: 11px; color: var(--muted); }
.d-field b { display: block; margin-top: 3px; font-size: 13px; font-weight: 500; }
.post .ph--demo { height: 260px; }
/* planned items are not done: ring marker instead of a check */
.dzz2__b li::before { -webkit-mask: none; mask: none; background: none; width: 12px; height: 12px; top: 8px; left: -30px; border: 1.5px solid var(--peri); border-radius: 50%; }
.dzz2__note { margin-top: 20px; }

/* ---------- live-site line icons (isometric set from protradestaffing.com) ---------- */
.ico { display: block; flex: none; }
.card4__icons { display: flex; gap: 8px; margin-bottom: 20px; }
.trip__ico { margin-bottom: 14px; }
.ctile__mark--ico { width: auto; height: auto; background: none; place-items: start; }
.ilink__mark .ico, .callout__mark .ico { margin: auto; }
/* generated backdrops behind product graphics (Teero-style: crisp UI over a soft scene) */
.ph__scene { position: absolute; inset: 0; z-index: 0; }
.ph__scene img { width: 100%; height: 100%; object-fit: cover; }
.ph--demo:has(.ph__scene)::before { display: none; }
.ph--demo .demo { box-shadow: 0 24px 48px -12px rgba(0,2,47,.28); }

/* ---------- home: one card per trade (Sequoia home 4-card pattern, 3 x 2 for six trades) ---------- */
.tcards { display: grid; grid-template-columns: repeat(3, 1fr); gap: 20px; margin-top: 64px; }
.tcard6 { display: grid; grid-template-rows: auto auto 1fr auto; min-height: 318px; padding: 28px 26px 26px; background: #fff; border: 1px solid #E1E3EE; border-radius: var(--radius-card); color: var(--ink); transition: border-color .2s, box-shadow .2s, transform .2s; }
.tcard6 .ico { width: 44px; height: 44px; }
.tcard6 .h24 { margin-top: 28px; font-weight: 500; }
.tcard6 .body { margin-top: 10px; max-width: 330px; color: var(--text); }
.tcard6__foot { display: flex; align-items: center; justify-content: space-between; gap: 16px; margin-top: 28px; padding-top: 18px; border-top: 1px solid #ECEEF5; font-size: 14px; line-height: 1.3; color: var(--muted); }
.tcard6__foot .sq { width: 40px; height: 40px; }
.tcard6:hover { border-color: #C6CCEE; box-shadow: 0 18px 40px -18px rgba(0,2,47,.25); transform: translateY(-2px); }
.tcard6:hover .sq { background: #0A22A0; }
@media (max-width: 1023px) { .tcards { grid-template-columns: 1fr 1fr; } }
@media (max-width: 760px) { .tcards { grid-template-columns: 1fr; gap: 12px; margin-top: 40px; } .tcard6 { min-height: 0; padding: 22px 20px 20px; } .tcard6 .h24 { margin-top: 18px; } }
.d-rows--certs dd { display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.d-rows--certs strong { font-weight: 500; }
.ctile--rule { padding-top: 18px; border-top: 2px solid var(--blue); }
.ctile--rule h3 { margin-top: 0; }
.dark .ctile--rule { border-top-color: var(--peri); }
.dmed__media.week { height: auto; margin-top: 56px; }
@media (max-width: 1023px) {
  /* the live mobile header is an opaque 84px bar; give dark heroes the room the transparent header used to share */
  .hdr:not(.hdr--solid) ~ main > .sec:first-child { border-top: 28px solid transparent; }
}
@media (max-width: 760px) {
  .tcard6 { grid-template-columns: 36px 1fr 40px; grid-template-rows: auto auto; column-gap: 14px; row-gap: 6px; align-items: center; min-height: 0; padding: 18px 16px; }
  .tcard6 .ico { width: 36px; height: 36px; grid-row: 1 / 3; align-self: start; }
  .tcard6 .h24 { margin: 0; font-size: 20px; }
  .tcard6 .body { grid-column: 2; margin: 0; font-size: 15px; }
  .tcard6__foot { grid-column: 3; grid-row: 1 / 3; margin: 0; padding: 0; border: 0; align-self: center; }
  .tcard6__foot span:first-child { display: none; }
}

/* Coverage: what ProTrade carries as employer of record. One row of eight, icon over name, no cards. */
.cov { padding: 104px 0 112px; }
.cov__head { display: grid; grid-template-columns: 585px 520px; justify-content: space-between; align-items: end; }
.cov__head .h48 { margin-top: 11px; }
.cov__grid { list-style: none; margin: 64px 0 0; padding: 0; display: grid; grid-template-columns: repeat(8, 1fr); }
.cov__item { display: flex; flex-direction: column; align-items: center; gap: 18px; text-align: center; }
.cov__item .ico { width: 56px; height: 56px; object-fit: contain; }
.cov__item span { font-size: 17px; line-height: 1.25; font-weight: 500; color: var(--ink); }
@media (max-width: 1023px) { .cov__head { grid-template-columns: 1fr; gap: 16px; } .cov__grid { grid-template-columns: repeat(4, 1fr); row-gap: 40px; } }
@media (max-width: 760px) {
  .cov { padding: 72px 0; }
  .cov__grid { margin-top: 40px; row-gap: 32px; }
  .cov__item .ico { width: 44px; height: 44px; }
  .cov__item span { font-size: 14px; }
}

/* Closing CTA: a brand-blue card placed inside the page's last section, on that section's background */
.pcta { margin-top: 96px; margin-bottom: 8px; }
.pcta__card { position: relative; display: grid; grid-template-columns: 1fr; min-height: 360px; border-radius: var(--radius-card); overflow: hidden; background: linear-gradient(120deg, #0C2AC1 0%, #0A21A6 55%, #06137A 100%); }
.pcta__card--media { grid-template-columns: 1fr 540px; min-height: 400px; }
.pcta__text { display: flex; flex-direction: column; justify-content: center; padding: 64px; }
.pcta .h48 { max-width: 560px; color: #fff; }
.pcta .lead { margin-top: 12px; max-width: 480px; color: rgba(255,255,255,.82); }
.pcta__btns { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 36px; }
.btn--white { padding: 10px 18px; border: 1px solid #fff; background: #fff; color: var(--blue); }
.btn--white:hover { background: var(--tint-2); border-color: var(--tint-2); }
.pcta .btn--outline { color: #fff; }
.pcta .btn--outline:hover { color: var(--blue); background: #fff; }
.pcta__card .ph { height: 100%; min-height: 400px; border-radius: 0; }
.sec:has(> .pcta) { padding-bottom: 120px; }
.dark .pcta__card { box-shadow: 0 0 0 1px rgba(164,173,245,.18); }
@media (max-width: 1023px) { .pcta__card--media { grid-template-columns: 1fr 1fr; } .pcta__text { padding: 48px 40px; } }
@media (max-width: 760px) {
  .pcta { margin-top: 56px; }
  .sec:has(> .pcta) { padding-bottom: 64px; }
  .pcta__card--media { grid-template-columns: 1fr; }
  .pcta__card .ph { min-height: 220px; height: 220px; order: -1; }
  .pcta__text { padding: 32px 24px 36px; }
  .pcta .h48 { font-size: 32px; }
}

/* How it works, round 3 */
.hero-q__quote--long { font-size: 26px; line-height: 1.23; }
.btn--line { padding: 10px 18px; border: 1px solid var(--blue); background: transparent; color: var(--blue); }
.btn--line:hover { background: var(--blue); color: #fff; }
.five { list-style: none; counter-reset: five; margin: 28px 0 0; padding: 0; border-top: 1px solid var(--rule); }
.five li { counter-increment: five; display: flex; gap: 16px; align-items: baseline; padding: 13px 0; border-bottom: 1px solid var(--rule); font-size: 18px; line-height: 1.3; color: var(--ink); }
.five li::before { content: counter(five, decimal-leading-zero); flex: none; width: 24px; font-family: var(--mono); font-size: 13px; color: var(--blue); }
.five__note { margin-top: 14px; font-size: 16px; color: var(--muted); }
.ltri__ctas { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 32px; }

/* week: a calendar header strip per day so the columns scan like a planner */
.week li { padding: 0; }
.week b { display: block; padding: 16px 24px; border-bottom: 1px solid #262A5A; background: #0A0F45; font-size: 12px; color: #C9CEF7; }
.week li:nth-child(4) b { background: var(--blue); color: #fff; }
.week strong { margin: 28px 24px 0; min-height: 0; font-size: 22px; line-height: 1.2; }
.week span { margin: 10px 24px 32px; font-size: 16px; color: #D3D7EA; }
@media (max-width: 760px) { .week li { padding: 0; } .week b { padding: 12px 20px; } .week strong { margin: 18px 20px 0; } .week span { margin: 8px 20px 22px; } }

/* if something goes wrong */
.fix { padding: 104px 0 96px; }
.fix__grid { display: grid; grid-template-columns: 1fr 1fr; column-gap: 72px; align-items: center; }
.fix .ph { height: 520px; }
.fix__text .h40s { margin-top: 10px; max-width: 520px; }
.fix__steps { list-style: none; margin: 36px 0 0; padding: 0; }
.fix__steps li { display: grid; grid-template-columns: 44px 1fr; gap: 20px; padding: 22px 0; border-top: 1px solid var(--rule); }
.fix__steps li > span { width: 44px; height: 44px; display: grid; place-items: center; border-radius: var(--radius-tile); background: var(--ink); color: #fff; font-family: var(--mono); font-size: 15px; }
.fix__steps strong { display: block; font-size: 20px; line-height: 1.25; font-weight: 500; color: var(--ink); }
.fix__steps p { margin-top: 4px; font-size: 16px; line-height: 1.4; color: var(--text); }
@media (max-width: 1023px) { .fix__grid { column-gap: 40px; } .fix .ph { height: 420px; } }
@media (max-width: 760px) { .fix { padding: 64px 0; } .fix__grid { grid-template-columns: 1fr; row-gap: 32px; } .fix .ph { height: 240px; } .hero-q__quote--long { font-size: 21px; } }

/* testimonials are quoted in full, word for word from the live site: smaller type so they fit */
.tcard blockquote.qtext { font-size: 21px; line-height: 1.33; }
.qcard blockquote.qtext { font-size: 19px; line-height: 1.37; }
@media (max-width: 760px) { .tcard blockquote.qtext { font-size: 18px; } .qcard blockquote.qtext { font-size: 17px; } }


/* platform page layout */
.plat-hero { padding: 136px 0 0; text-align: center; overflow: hidden; }
.plat-hero .h48 { width: 760px; margin: 8px auto 0; }
.plat-hero .lead { width: 700px; margin: 14px auto 0; }
.plat-hero__shot { position: relative; width: min(1280px, calc(100% - 48px)); margin: 56px auto -96px; }
.plat-rows { padding: 200px 0 40px; }
.plat-row { display: grid; grid-template-columns: 440px 1fr; column-gap: 96px; align-items: center; padding: 56px 0; }
.plat-row--flip { grid-template-columns: 1fr 440px; }
.plat-row--flip .plat-row__text { order: 2; }
.plat-row__text .h40s { margin-top: 10px; }
.plat-row__text .lead { margin-top: 12px; }
.plat-row__media { display: flex; justify-content: center; padding: 48px; border-radius: var(--radius-card); background: linear-gradient(160deg, #EEF0FA, #DFE3F6); }
.plat-now { padding: 40px 0 96px; }
.plat-now__box { display: grid; grid-template-columns: 1fr auto; align-items: center; gap: 32px; padding: 36px 40px; border: 1px solid var(--rule); border-radius: var(--radius-card); background: var(--white); }
.plat-now__box p { font-size: 18px; line-height: 1.45; color: var(--text-2); max-width: 760px; }
.plat-now__box strong { color: var(--ink); font-weight: 500; }
@media (max-width: 1023px) {
  .plat-hero .h48, .plat-hero .lead { width: auto; }
  .plat-hero__shot { width: 100%; }
  .plat-row, .plat-row--flip { grid-template-columns: 1fr; row-gap: 32px; }
  .plat-row--flip .plat-row__text { order: 0; }
}
@media (max-width: 760px) {
  .plat-hero { padding-top: 110px; }
  .plat-hero__shot { margin: 40px auto -60px; }
  .plat-rows { padding-top: 110px; }
  .plat-row { padding: 32px 0; }
  .plat-row__media { padding: 20px 12px; }
  .plat-now__box { grid-template-columns: 1fr; padding: 28px 24px; }
}
.plat-hero { overflow: visible; z-index: 1; }
@media (max-width: 1023px) { .plat-hero__shot { width: calc(100% - 48px); } }
@media (max-width: 760px) { .plat-hero__shot { width: calc(100% - 48px); } }
@media (max-width: 1320px) { .hero-q__graphic.ph--img { height: 420px; } }
@media (max-width: 760px) { .hero-q__graphic.ph--img { height: 260px; min-height: 0; } }

/* Find work: listings, trade filter, per-job apply dialog */
.jobs { background: #E6E8F6; padding: 8px 0 120px; }
.jobs__bar { display: flex; flex-wrap: wrap; gap: 8px; }
.jf { display: inline-flex; align-items: center; gap: 8px; height: 38px; padding: 0 14px; border: 1px solid #D3D6E6; border-radius: 999px; background: #fff; font: 500 15px/1 var(--sans); color: var(--ink); cursor: pointer; }
.jf span { font-size: 13px; color: var(--muted); }
.jf:hover { border-color: var(--blue); }
.jf.is-on { background: var(--ink); border-color: var(--ink); color: #fff; }
.jf.is-on span { color: var(--on-dark-2); }
.joblist { display: grid; gap: 8px; margin-top: 24px; }
.job { display: grid; grid-template-columns: minmax(0, 1.1fr) minmax(0, 1.4fr) 170px auto; gap: 32px; align-items: center; padding: 20px 20px 20px 28px; background: #fff; border-radius: var(--radius-card); }
.job[hidden] { display: none; }
.job h3 { font-size: 20px; line-height: 1.2; font-weight: 500; letter-spacing: -.01em; color: var(--ink); }
.job__loc { margin-top: 3px; font-size: 15px; color: var(--muted); }
.job__req { list-style: none; display: flex; flex-wrap: wrap; gap: 6px; margin: 0; padding: 0; }
.job__req li { padding: 4px 10px; border-radius: 999px; background: var(--tint-2); font-size: 13px; color: var(--text-2); }
.job__sched { font-size: 13px; line-height: 1.4; color: var(--muted); }
.job__sched b { font-size: 15px; font-weight: 500; color: var(--ink); }
.jobdlg { width: min(640px, calc(100% - 32px)); padding: 0; border: 0; border-radius: var(--radius-card); box-shadow: 0 30px 80px -20px rgba(0,2,47,.45); }
.jobdlg::backdrop { background: rgba(0,2,47,.55); }
.jobdlg .form { border: 0; }
.jobdlg__head { display: flex; justify-content: space-between; align-items: flex-start; gap: 16px; padding-bottom: 4px; border-bottom: 1px solid var(--rule); }
.jobdlg__head .h28 { margin-top: 6px; font-size: 28px; line-height: 1.2; font-weight: 500; color: var(--ink); }
.jobdlg__meta { margin: 4px 0 16px; font-size: 15px; color: var(--muted); }
.jobdlg__x { flex: none; width: 36px; height: 36px; border: 1px solid var(--rule); border-radius: 50%; background: #fff; font-size: 22px; line-height: 1; color: var(--ink); cursor: pointer; }
@media (max-width: 1023px) { .job { grid-template-columns: 1fr auto; row-gap: 14px; } .job__req { grid-column: 1; } .job__sched { grid-column: 2; grid-row: 1; text-align: right; } .job__apply { grid-column: 2; grid-row: 2; } }
@media (max-width: 760px) {
  .job { padding: 18px 18px 18px 20px; }
  .jobs__bar { flex-wrap: nowrap; overflow-x: auto; margin-inline: -16px; padding-inline: 16px; }
  .jf { flex: none; }
  .jobdlg .form { grid-template-columns: 1fr; padding: 24px 20px; }
}

/* Home hero: example worker profiles scrolling where Sequoia shows its companies */
.pro-marquee { margin-top: 62px; padding: 6px 0 10px; -webkit-mask: linear-gradient(90deg, transparent, #000 8%, #000 92%, transparent); mask: linear-gradient(90deg, transparent, #000 8%, #000 92%, transparent); }
.pro-marquee .marquee__track { gap: 16px; padding-right: 16px; animation-duration: 80s; }
.pcard { flex: none; width: 264px; padding: 20px 20px 16px; background: #fff; border-radius: 10px; box-shadow: 0 1px 0 rgba(0,2,47,.06), 0 18px 40px -24px rgba(0,0,0,.6); color: var(--ink); text-align: left; }
.pcard__top { display: flex; align-items: center; gap: 10px; }
.pcard__av { width: 32px; height: 32px; flex: none; display: grid; place-items: center; border-radius: 50%; background: #E6E9FB; color: var(--blue); font-size: 12px; font-weight: 600; }
.pcard__top b { font-size: 15px; font-weight: 500; }
.pcard__top img { margin-left: auto; width: 28px; height: 28px; opacity: .9; }
.pcard__role { margin-top: 16px; font-size: 19px; line-height: 1.2; font-weight: 500; letter-spacing: -.01em; }
.pcard__yrs { margin-top: 3px; font-size: 14px; color: var(--muted); }
.pcard__chips { list-style: none; display: flex; flex-wrap: wrap; gap: 6px; margin: 14px 0 0; padding: 0; }
.pcard__chips li { padding: 3px 9px; border-radius: 999px; background: var(--tint-2); font-size: 12px; color: var(--text-2); }
.pcard__foot { display: flex; justify-content: space-between; align-items: center; margin-top: 16px; padding-top: 12px; border-top: 1px solid #EEF0F5; font-size: 13px; }
.pcard__rt { font-weight: 500; }
.pcard__rt::first-letter { color: #E0A21B; }
.pcard__st { display: inline-flex; align-items: center; gap: 6px; color: #1C6B3E; }
.pcard__st::before { content: ""; width: 7px; height: 7px; border-radius: 50%; background: #2EA35D; }
.pcard__st.is-busy { color: var(--muted); }
.pcard__st.is-busy::before { background: #B8BBC8; }
@media (max-width: 760px) { .pro-marquee { margin-top: 40px; } .pcard { width: 236px; padding: 16px 16px 14px; } .pcard__role { font-size: 17px; } }
.pcta { text-align: left; } .pcta .h48, .pcta .lead { margin-left: 0; margin-right: 0; width: auto; }

/* Home hero: full viewport; New England map (src/mapgen.py, US Census outlines) with the request composer over it */
.hero-mq:has(.hero-map) { display: flex; flex-direction: column; min-height: 100vh; min-height: 100svh; padding-bottom: 0; overflow: hidden; }
.hero-map { position: relative; flex: 1; min-height: 420px; margin-top: 40px; }
.hero-map .nemap { top: 120px; height: calc(100% - 120px); }
.nemap { position: absolute; inset: 0; width: 100%; height: 100%; -webkit-mask: linear-gradient(#000 70%, transparent); mask: linear-gradient(#000 70%, transparent); }
.nemap__ctx path { fill: rgba(164,173,245,.03); stroke: rgba(164,173,245,.16); stroke-width: 1; stroke-linejoin: round; }
.nemap__core path { fill: #16248A; stroke: rgba(164,173,245,.55); stroke-width: 1; stroke-linejoin: round; }
.hero-map__over { position: absolute; inset: -8px 0 0; display: flex; flex-direction: column; align-items: center; justify-content: flex-start; padding-top: 8px; pointer-events: none; }
.hero-map__over > * { pointer-events: auto; }
.nemap__core path { transition: fill .35s ease, stroke .35s ease; cursor: pointer; }
.nemap__core path:hover { fill: #1B2DA6; }
.nemap__core path.is-on { fill: #0C2AC1; stroke: rgba(214,219,255,.9); }
.hq { display: flex; align-items: center; flex-wrap: wrap; justify-content: center; gap: 10px 12px; padding: 10px 10px 10px 24px; border-radius: 12px; background: rgba(0,2,47,.82); border: 1px solid rgba(164,173,245,.22); box-shadow: 0 30px 80px -30px rgba(0,0,0,.8); -webkit-backdrop-filter: blur(10px); backdrop-filter: blur(10px); font-size: 20px; color: #F2F3FA; }
.hq__w { color: rgba(242,243,250,.62); white-space: nowrap; }
.hq__f { font: inherit; color: #fff; background: transparent; border: 0; border-bottom: 1px solid rgba(164,173,245,.5); border-radius: 0; padding: 4px 22px 4px 2px; -webkit-appearance: none; appearance: none; cursor: pointer; }
select.hq__f { background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='6'%3E%3Cpath d='M1 1l4 4 4-4' fill='none' stroke='%23A4ADF5' stroke-width='1.5'/%3E%3C/svg%3E") right 4px center no-repeat; }
select.hq__f option { color: #0A0915; }
.hq__f:focus-visible { outline: none; border-bottom-color: #fff; }
.hq__go { margin-left: 8px; }
.hq__alt { margin-top: 20px; font-size: 14px; color: rgba(242,243,250,.62); }
.hq__alt .arrow-link { color: #F2F3FA; }
@media (max-width: 760px) {
  .hero-map { margin-top: 24px; min-height: 690px; }
  .hero-map__over { padding: 0 16px; }
  .hero-map .nemap { inset: auto; bottom: 0; left: -78%; width: 220%; height: auto; }
  .hq { border-radius: 20px; padding: 20px; font-size: 18px; justify-content: flex-start; gap: 8px 10px; width: 100%; }
  .hq__go { margin: 8px 0 0; width: 100%; }
}

/* Home trades: one row of six, Sequoia card row; hover fills the card blue */
.trow { display: grid; grid-template-columns: repeat(6, 1fr); gap: 16px; margin-top: 64px; }
.trow__card { position: relative; display: flex; flex-direction: column; min-height: 360px; padding: 24px 20px 20px; background: #fff; border: 1px solid #E1E3EE; border-radius: var(--radius-card); color: var(--ink); transition: background-color .25s ease, border-color .25s ease, color .25s ease; }
.trow__t { font-size: 22px; line-height: 1.2; font-weight: 500; color: #0C2AC1; transition: color .25s ease; }
.trow__b { margin-top: 12px; font-size: 15px; line-height: 1.45; color: var(--text); transition: color .25s ease; }
.trow__ico { width: 72px; height: 72px; margin: auto 0 0 auto; transition: filter .25s ease; }
.trow__card:hover, .trow__card:focus-visible { background: #0C2AC1; border-color: #0C2AC1; }
.trow__card:hover .trow__t, .trow__card:hover .trow__b, .trow__card:focus-visible .trow__t, .trow__card:focus-visible .trow__b { color: #fff; }
.trow__card:hover .trow__ico, .trow__card:focus-visible .trow__ico { filter: brightness(0) invert(1); }
@media (max-width: 1180px) { .trow { grid-template-columns: repeat(3, 1fr); } .trow__card { min-height: 280px; } }
@media (max-width: 760px) { .trow { grid-template-columns: 1fr 1fr; gap: 12px; margin-top: 40px; } .trow__card { min-height: 230px; padding: 18px 16px 16px; } .trow__t { font-size: 19px; } .trow__b { font-size: 14px; } .trow__ico { width: 56px; height: 56px; } }

/* ---------- Clean-up pass (2026-10-01): one column edge, even rows, no orphan words ---------- */
/* text wrapping: balanced headings, no one-word last lines, terms that never split */
h1, h2, h3, .h40, .h48, .h56, .h20, .h32l { text-wrap: balance; }
p, .lead, li { text-wrap: pretty; }
.nw { white-space: nowrap; }

/* header sits on the same 1280 column as every section */
.hdr__row { width: min(1280px, calc(100% - 48px)); padding: 20px 0; }

/* accordion and stacked cards widen from 1152 to the shared 1280 column */
.acc-sec > .w1152, .hcards > .w1152 { width: min(1280px, calc(100% - 48px)); }
.acc-sec__grid { grid-template-columns: 480px 704px; }
.hcard { grid-template-columns: 608px 1fr; }

/* split headers: intro starts on the right column (x = 755 at 1440), top-aligned */
.cov__head { display: block; text-align: center; }
.hero-q__mid { grid-template-columns: 605px 605px; }

/* FAQ link cards: centred on the column at every width; links line up at the bottom */
.ins__cards { margin-inline: auto; }
.post { grid-template-rows: auto auto 1fr; }
.post .arrow-link { align-self: end; }

/* contact: cards and the three columns below share one grid */
.contact__grid, .contact__paths { grid-template-columns: repeat(3, 1fr); gap: 32px; }
.contact__paths:first-child { margin-top: 0; }
.ccard strong { overflow-wrap: normal; }

/* story timeline: arrows inside the column, centred on the heading */
.tl__head { align-items: center; }
.tl__head .rail-ctrl { margin: 0; }
.tl__head h2 { margin-top: 0; }

/* credits: title column gets the room */
.res .jobrow { grid-template-columns: 2fr 1.5fr 1fr 100px; }

/* hero: the "See open jobs" line sits above the map */
.hq__alt { position: relative; z-index: 5; }

/* apply form: one field height, checkboxes that don't shrink, legend on the label edge */
.form input:not([type=checkbox]):not([type=radio]), .form select { height: 46px; box-sizing: border-box; }
.form legend { padding: 0; }
.checks label { align-items: flex-start; }
.checks input { flex: none; margin-top: 2px; }

/* job tags and match chips stay on one line */
.job__req li, .d-chip { white-space: nowrap; }


@media (max-width: 1023px) {
  .acc-sec__grid, .hcard, .hero-q__mid { grid-template-columns: 1fr 1fr; }
  .contact__grid, .contact__paths { grid-template-columns: 1fr; gap: 16px; }
  .contact__paths { gap: 40px; }
}
@media (max-width: 760px) {
  .hdr__row { padding: 20px 0; }
  .acc-sec__grid, .hcard, .hero-q__mid { grid-template-columns: 1fr; }
  .zz3 { padding-top: 56px; }
  .pcta__btns, .pre__btns { flex-direction: column; align-items: stretch; }
  .pcta__btns .btn, .pre__btns .btn { width: 100%; justify-content: center; }
  .ccard strong { font-size: 20px; } .ccard--main strong { font-size: 28px; }
  .tl__head { flex-direction: column; align-items: flex-start; gap: 16px; }
  .jobs__bar { -webkit-mask: linear-gradient(90deg, #000 85%, transparent); mask: linear-gradient(90deg, #000 85%, transparent); }
  .res .jobrow { grid-template-columns: 1fr; row-gap: 4px; }
}
.job__sched { white-space: nowrap; }
@media (max-width: 1023px) { .job__req { min-width: 0; } .job__req li { white-space: normal; } }

.tslide h3 { text-wrap: wrap; }
@media (max-width: 760px) { .tslide h3 { text-wrap: balance; } }
.icard p.eyebrow { min-height: 0; }
@media (max-width: 760px) { .d-list li > div > span { white-space: nowrap; } .d-chip { padding: 2px 4px; margin-right: 3px; font-size: 10px; } }
.plat-hero .lead, .hero-lc .lead, .hero-sub .lead, .hero-art .lead { text-wrap: balance; }

/* Footer (2026-10-01): brand and contact on the left, four link columns, social icons, one legal line */
.ftr { background: var(--night); color: var(--on-dark); padding: 72px 0 0; }
.ftr__grid { display: grid; grid-template-columns: 1.3fr repeat(4, 1fr); column-gap: 40px; }
.ftr__logo { display: inline-flex; align-items: center; height: 24px; }
.ftr__logo img { width: 160px; height: 24px; }
.ftr__tag { margin-top: 16px; max-width: 260px; font-size: 15px; line-height: 1.5; color: var(--on-dark-2); }
.ftr__contact { margin-top: 24px; display: grid; gap: 6px; font-size: 15px; line-height: 1.4; color: var(--on-dark-2); }
.ftr__contact a { color: var(--on-dark); }
.ftr__contact a:hover, .ftr li a:hover, .ftr__legal a:hover { color: #fff; }
.ftr__social { display: flex; gap: 10px; margin-top: 28px; }
.ftr__social a { display: grid; place-items: center; width: 38px; height: 38px; border: 1px solid #262A4A; border-radius: 50%; color: var(--on-dark); transition: background-color .2s, border-color .2s; }
.ftr__social a:hover { background: var(--blue); border-color: var(--blue); }
.ftr__social svg { width: 17px; height: 17px; }
.ftr h2 { font-family: var(--sans); font-size: 14px; line-height: 1.33; font-weight: 500; color: #fff; }
.ftr ul { margin: 15px 0 0; padding: 0; list-style: none; }
.ftr li { font-size: 15px; line-height: 1.3; padding: 6px 0; }
.ftr li a { color: var(--on-dark-2); }
.ftr__legal { display: flex; justify-content: space-between; align-items: center; gap: 16px 24px; flex-wrap: wrap; margin-top: 64px; padding: 24px 0 32px; border-top: 1px solid #1E2140; font-size: 13px; line-height: 1.3; color: var(--on-dark-2); }
.ftr__legal nav { display: flex; gap: 20px; }
@media (max-width: 1023px) {
  .ftr__grid { grid-template-columns: repeat(4, 1fr); row-gap: 48px; }
  .ftr__brand { grid-column: 1 / -1; }
}
@media (max-width: 760px) {
  .ftr { padding-top: 48px; }
  .ftr__grid { grid-template-columns: 1fr 1fr; row-gap: 36px; column-gap: 24px; }
  .ftr__legal { flex-direction: column; align-items: flex-start; margin-top: 40px; }
}

/* Privacy policy page */
.legal { max-width: 760px; }
.legal h2 { font-size: 24px; line-height: 1.3; font-weight: 500; margin: 48px 0 16px; }
.legal h2:first-child { margin-top: 0; }
.legal h3 { font-size: 18px; line-height: 1.4; font-weight: 500; margin: 28px 0 10px; }
.legal p, .legal li { font-size: 16px; line-height: 1.6; color: var(--text-2); }
.legal p { margin: 0 0 16px; }
.legal ul { list-style: disc; padding-left: 24px; margin: 0 0 16px; }
.legal li { margin-bottom: 6px; }
.legal li::marker { color: var(--text-2); }
.legal a { text-decoration: underline; text-underline-offset: 2px; }

/* Log in: one card, contractor and employee tabs, password reset view */
.login { padding: 64px 0 120px; }
.login__wrap { display: flex; justify-content: center; }
.login__card { width: 100%; max-width: 440px; padding: 40px; background: #fff; border: 1px solid #E1E4EE; border-radius: var(--radius-card); box-shadow: 0 24px 48px -32px rgba(0,2,47,.25); }
.login__card .h40 { font-size: 32px; text-align: center; padding-bottom: 0; }
.login__tabs { display: grid; grid-template-columns: 1fr 1fr; gap: 4px; margin: 28px 0 24px; padding: 4px; border-radius: 8px; background: var(--tint-2); }
.login__tabs button { height: 38px; border: 0; border-radius: 6px; background: transparent; font: 500 15px/1 var(--sans); color: var(--muted); cursor: pointer; }
.login__tabs button[aria-selected="true"] { background: #fff; color: var(--ink); box-shadow: 0 1px 3px rgba(0,2,47,.12); }
.login__form { display: grid; gap: 18px; }
.login__f label, .login__row label { display: block; font-size: 14px; font-weight: 500; color: var(--ink); }
.login__row { display: flex; justify-content: space-between; align-items: baseline; }
.login__f input { width: 100%; height: 46px; box-sizing: border-box; margin-top: 6px; padding: 0 12px; font: 16px/1.25 var(--sans); color: var(--ink); background: #fff; border: 1px solid #C9CDE0; border-radius: var(--radius); }
.login__f input:focus { outline: 2px solid var(--blue); outline-offset: 0; border-color: var(--blue); }
.login__pw { position: relative; }
.login__pw input { padding-right: 46px; }
.login__eye { position: absolute; right: 4px; top: 10px; display: grid; place-items: center; width: 38px; height: 38px; border: 0; background: none; color: var(--muted); cursor: pointer; }
.login__eye svg { width: 20px; height: 20px; }
.login__eye[aria-pressed="true"] { color: var(--blue); }
.login__link { padding: 0; border: 0; background: none; font: 500 14px var(--sans); color: var(--blue); cursor: pointer; }
.login__check { display: flex; align-items: center; gap: 8px; font-size: 15px; color: var(--text-2); }
.login__check input { width: 16px; height: 16px; margin: 0; accent-color: var(--blue); }
.login__err { min-height: 0; font-size: 14px; line-height: 1.4; color: #B42318; }
.login__err:empty { display: none; }
.login__go { width: 100%; height: 48px; }
.login__alt { text-align: center; font-size: 15px; color: var(--muted); }
.login__alt a { color: var(--blue); font-weight: 500; }
.login__lead { font-size: 15px; line-height: 1.5; color: var(--text-2); }
@media (max-width: 760px) { .login { padding: 32px 0 80px; } .login__card { padding: 28px 20px; } }

/* Application and job-apply forms: confirmation that replaces the form once it is sent */
.form__done { padding: 8px 0; }
.form__done:focus { outline: none; }
.form__done .h28 { margin-top: 8px; }
.form__done .lead { margin-top: 10px; }
.login__form[hidden] { display: none; }

/* Mobile pass (2026-10-01): nothing may push the page sideways on a phone */
html, body { overflow-x: clip; }
h1, h2, h3, h4, p, li, dd, dt, blockquote, a, strong, span { overflow-wrap: break-word; }
@media (max-width: 480px) {
  .job { grid-template-columns: minmax(0, 1fr); }
  .job__req, .job__sched, .job__apply { grid-column: 1; grid-row: auto; }
  .job__sched { text-align: left; white-space: normal; }
  .job__apply { justify-self: start; }
}
@media (max-width: 400px) {
  .ccard { padding: 24px 20px; }
  .ccard strong { font-size: 17px; overflow-wrap: anywhere; }
  .ccard--main strong { font-size: 26px; }
  .pcta__text { padding: 28px 20px 32px; }
  .btn { white-space: normal; text-align: center; height: auto; min-height: 48px; padding-top: 12px; padding-bottom: 12px; line-height: 1.25; }
}
@media (max-width: 760px) {
  /* story timeline: four short entries read as a list on a phone, not a cut-off carousel */
  .tl__head .rail-ctrl { display: none; }
  .tl__rail { padding-inline: 0; width: calc(100% - 48px); margin-inline: auto; }
  .tl .rail { grid-auto-flow: row; grid-auto-columns: auto; grid-template-columns: minmax(0, 1fr); gap: 32px; margin-top: 28px; padding-right: 0; overflow: visible; scroll-snap-type: none; }
  /* job filters scroll sideways: fade the edge so the cut reads as "more" */
  .jobs__bar { -webkit-mask: linear-gradient(90deg, #000 85%, transparent); mask: linear-gradient(90deg, #000 85%, transparent); }
}
@media (max-width: 760px) {
  /* no half-visible cards with clipped text: one full slide at a time, arrows step through */
  .rail { grid-auto-columns: 100%; gap: 24px; }
  /* home testimonials: three quotes stack, same as the contractors page */
  .rail.tq3 { grid-auto-flow: row; grid-auto-columns: auto; grid-template-columns: minmax(0, 1fr); gap: 16px; overflow: visible; scroll-snap-type: none; }
}

/* Story (2026-10-01): Robert's portrait, a text-only next chapter, the quote on its own */
.lzz2__row--text { align-items: start; }
.lzz2__row--text > .h42 { margin: 0; }
.lzz2__row--text .lzz2__text .lead:first-child { margin-top: 0; }
.qband__grid--solo { grid-template-columns: minmax(0, 830px); justify-content: center; text-align: center; }
.qband__grid--solo figure { padding-top: 0; }
.qband__grid--solo blockquote { min-height: 0; }
.qband { padding-bottom: 107px; }
@media (max-width: 760px) {
  .lzz2 .ph.ph--keep { display: block; height: auto; aspect-ratio: 3 / 2; }
  .lzz2__row--text { row-gap: 16px; }
  .qband { padding: 80px 0; }
}
/* 404 */
.nf .login__card { display: flex; flex-direction: column; gap: 16px; text-align: left; }
.nf .login__card > * { margin: 0; }
.nf .h40 { text-align: left; }
.nf .login__lead { color: var(--text-2); }
.nf .login__alt { text-align: center; }
/* Story body (2026-10-01): one text block from the original story, Robert's photo held in view beside it */
.sstory__grid { display: grid; grid-template-columns: min(540px, calc(45% - 32px)) minmax(0, 640px); column-gap: 64px; justify-content: space-between; align-items: start; } /* photo shrinks below ~1320px so the text never touches it */
.sstory__media { position: sticky; top: max(24px, calc(50vh - 270px)); }
.sstory .ph { height: auto; aspect-ratio: 1 / 1; }
.sstory .ph img { object-position: 50% 30%; }
.sstory__text p { font-size: 22px; line-height: 1.5; letter-spacing: -.005em; color: var(--ink); }
.sstory__text p + p { margin-top: 28px; }
.sstory__text p.sstory__news { margin-top: 14px; }
.sstory__news + p { margin-top: 36px !important; }
.sstory__news .arrow-link { font-size: 16px; color: var(--blue); }
@media (max-width: 1023px) { .sstory__grid { grid-template-columns: 1fr 1fr; column-gap: 40px; } .sstory__text p { font-size: 20px; } }
@media (max-width: 760px) {
  .sstory__grid { grid-template-columns: 1fr; row-gap: 28px; }
  .sstory__media { position: static; }
  .sstory .ph { aspect-ratio: 3 / 2; }
  .sstory__text p { font-size: 18px; }
  .sstory__text p + p { margin-top: 20px; }
  .sstory__text br { display: none; }
}
/* Legal pages laid out like the original site: centred title, one 800px column, compact bold-headed text */
.legal-hero { padding: 150px 0 0; text-align: center; }
.legal-hero h1 { font-size: 64px; line-height: 1.1; font-weight: 500; letter-spacing: -.03em; color: var(--ink); }
.legal-hero p { margin-top: 14px; font-size: 18px; color: var(--text-2); }
.legal-sec { padding: 56px 0 120px; }
.legal--live { max-width: 800px; margin: 0 auto; }
.legal--live p, .legal--live li { font-size: 15px; line-height: 1.7; color: var(--text-2); }
.legal--live p { margin: 0; }
.legal--live strong { font-weight: 600; color: var(--ink); }
.legal--live ul { margin: 0; padding-left: 18px; list-style: disc; }
.legal--live li { margin: 0; }
.legal--live .legal__gap { height: 1.7em; }
.legal--live a { color: var(--blue); }
@media (max-width: 760px) { .legal-hero { padding-top: 110px; } .legal-hero h1 { font-size: 40px; } .legal-sec { padding: 36px 0 80px; } }
/* SMS consent: an unchecked box under the contact fields, in fine print, like most service sign-up forms */
.consent { display: grid !important; grid-template-columns: 18px 1fr; gap: 10px; align-items: start; font-size: 13px !important; line-height: 1.45 !important; font-weight: 400 !important; color: var(--muted) !important; cursor: pointer; }
.consent input { width: 18px; height: 18px; margin: 0; accent-color: var(--blue); }
.consent a { color: var(--text-2); text-decoration: underline; text-underline-offset: 2px; }
.rq__step .consent { margin: 4px 0 8px; max-width: 560px; }
/* Story lower rows: same height as the "What we are building" graphic, with room between rows */
.lzz3 .ph { height: 380px; }
.lzz3__row + .lzz3__row { margin-top: 80px; }

/* Scholarship card (tradespeople and story pages); only the buttons link */
.schol { display: grid; grid-template-columns: 120px minmax(0, 1fr) auto; align-items: center; gap: 32px; padding: 24px 32px 24px 24px; background: #fff; border: 1px solid #E1E4EE; border-radius: var(--radius-card); color: var(--ink); }
.schol__ph img { display: block; width: 120px; height: 120px; object-fit: cover; object-position: 50% 25%; border-radius: 4px; }
.schol__text { display: grid; gap: 8px; }
.schol .schol__t { margin: 0; font-size: 26px; line-height: 1.2; font-weight: 400; letter-spacing: -.01em; color: var(--ink); text-wrap: balance; }
.schol .schol__b { margin: 0; max-width: 680px; font-size: 16px; line-height: 1.45; color: var(--text-2); }
.schol__btns { display: flex; gap: 12px; }
.schol__btns .btn { min-width: 112px; }
.t3 .schol { margin-top: 56px; text-align: left; }
.sstory .schol { grid-template-columns: minmax(0, 1fr); gap: 20px; margin-top: 40px; padding: 28px 32px; }
.sstory .schol__ph { display: none; }
@media (max-width: 760px) {
  .schol { grid-template-columns: minmax(0, 1fr); gap: 16px; padding: 20px; }
  .schol__ph img { width: 64px; height: 64px; }
  .schol .schol__t { font-size: 21px; }
  .schol__btns { flex-direction: column; }
  .schol__btns .btn { width: 100%; }
  .t3 .schol { margin-top: 40px; }
  .sstory .schol { padding: 20px; }
}
/* Story: past the halfway point the sticky photo fades to a random other photo of Robert, new pick each pass (site.js; desktop only) */
.sstory__media .ph { position: relative; }
.sstory__swap { position: absolute; inset: 0; opacity: 0; transition: opacity .9s ease; }
.sstory__swap img { width: 100%; height: 100%; object-fit: cover; }
.sstory__swap.is-on { opacity: 1; }
@media (prefers-reduced-motion: reduce) { .sstory__swap { transition: none; } }

/* home: the employer-of-record row follows "One coordinator" on a flat tint, so it meets both neighbours' gradients without a seam;
   padding keeps the same gap the home page had between "One coordinator" and the next section (224px desktop, 120px phones) on each side */
.cov--home { background: var(--tint); padding: 112px 0; }
@media (max-width: 760px) { .cov--home { padding: 30px 0 90px; } }