/* EffortMart page kit (shop).
   Used by every content page (about, contact, careers, policies, track, categories, site map, grievance ...).
   Direction: a spec-sheet look. Left aligned, hairline rules instead of cards, one mono label style for metadata,
   tight headings, orange only on actions and links. No gradients, no glass, no shadows, no pills with icons.
   Classes are prefixed k-. Tokens come from :root below; page CSS must not redefine them. */
:root {
  --k-ink: #0F172A; --k-text: #334155; --k-mute: #64748B; --k-line: #E2E8F0; --k-line-strong: #CBD5E1; --k-soft: #F8FAFC;
  --k-brand: #E97C43; --k-brand-strong: #C45A2A; --k-brand-deep: #973B14; --k-brand-tint: #FFF4EC;
  --k-ok: #15803D; --k-warn: #B45309; --k-bad: #B91C1C;
  --k-mono: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
  --k-w: 1120px; --k-w-narrow: 760px;
}
.k-page { background: #fff; color: var(--k-text); font-size: 15px; line-height: 1.65; }
.k-wrap { width: 100%; max-width: var(--k-w); margin: 0 auto; padding: 0 20px; }
.k-wrap.is-narrow { max-width: var(--k-w-narrow); }

/* page header */
.k-head { padding: 40px 0 28px; border-bottom: 1px solid var(--k-line); }
.k-crumbs { display: flex; flex-wrap: wrap; gap: 6px; margin: 0 0 18px; padding: 0; list-style: none; font: 500 12px/1 var(--k-mono); letter-spacing: .02em; color: var(--k-mute); }
.k-crumbs a { color: var(--k-mute); text-decoration: none; }
.k-crumbs a:hover { color: var(--k-brand-strong); }
.k-crumbs li + li::before { content: "/"; margin-right: 6px; color: var(--k-line-strong); }
.k-eyebrow { display: block; margin: 0 0 10px; font: 600 12px/1 var(--k-mono); letter-spacing: .08em; text-transform: uppercase; color: var(--k-brand-strong); }
.k-title { margin: 0; font-size: clamp(26px, 4.2vw, 36px); line-height: 1.15; font-weight: 600; letter-spacing: -.02em; color: var(--k-ink); }
.k-lede { margin: 12px 0 0; max-width: 62ch; font-size: 16px; line-height: 1.6; color: var(--k-mute); }
.k-meta { display: flex; flex-wrap: wrap; gap: 6px 18px; margin: 18px 0 0; padding: 0; list-style: none; font: 500 12px/1.4 var(--k-mono); color: var(--k-mute); }
.k-meta b { color: var(--k-ink); font-weight: 600; }

/* body */
.k-body { padding: 32px 0 64px; }
.k-body > .k-list:first-child, .k-body > .k-facts:first-child { margin-top: 0; }
.k-section { display: grid; grid-template-columns: 220px minmax(0, 1fr); gap: 8px 40px; padding: 28px 0; border-bottom: 1px solid var(--k-line); }
.k-section:last-child { border-bottom: 0; }
.k-section > h2, .k-label { margin: 0; font-size: 14px; font-weight: 600; line-height: 1.4; color: var(--k-ink); }
.k-section > h2 small, .k-label small { display: block; margin-top: 4px; font: 500 12px/1.4 var(--k-mono); color: var(--k-mute); }
.k-section p { margin: 0 0 14px; }
.k-section p:last-child { margin-bottom: 0; }

/* readable text (policies, long copy) */
.k-prose { max-width: 70ch; }
.k-prose h2 { margin: 36px 0 10px; padding-top: 24px; border-top: 1px solid var(--k-line); font-size: 19px; font-weight: 600; letter-spacing: -.01em; color: var(--k-ink); }
.k-prose h2:first-child { margin-top: 0; padding-top: 0; border-top: 0; }
.k-prose h3 { margin: 24px 0 8px; font-size: 15px; font-weight: 600; color: var(--k-ink); }
.k-prose p, .k-prose li { font-size: 15px; line-height: 1.7; }
.k-prose ul, .k-prose ol { padding-left: 20px; }
.k-prose a, .k-link { color: var(--k-brand-strong); text-decoration: underline; text-underline-offset: 3px; text-decoration-color: color-mix(in srgb, var(--k-brand) 40%, transparent); }
.k-prose a:hover, .k-link:hover { color: var(--k-brand-deep); text-decoration-color: currentColor; }

/* two-column layout with a sticky contents list (policies) */
.k-layout { display: grid; grid-template-columns: 220px minmax(0, 1fr); gap: 48px; align-items: start; }
.k-toc { position: sticky; top: 96px; padding: 0; margin: 0; list-style: none; font-size: 13px; border-left: 1px solid var(--k-line); }
.k-toc a { display: block; padding: 6px 0 6px 14px; margin-left: -1px; border-left: 2px solid transparent; color: var(--k-mute); text-decoration: none; }
.k-toc a:hover { color: var(--k-ink); }
.k-toc a.is-active { color: var(--k-brand-strong); border-left-color: var(--k-brand); font-weight: 600; }

/* facts: definition rows */
.k-facts { margin: 0; border-top: 1px solid var(--k-line); }
.k-facts > div { display: grid; grid-template-columns: 200px minmax(0, 1fr); gap: 16px; padding: 12px 0; border-bottom: 1px solid var(--k-line); }
.k-facts dt { font-size: 13px; font-weight: 500; color: var(--k-mute); }
.k-facts dd { margin: 0; font-size: 14px; color: var(--k-ink); overflow-wrap: anywhere; }
.k-facts dd.is-mono { font-family: var(--k-mono); font-size: 13px; }

/* lists of links / items, ruled */
.k-list { margin: 0; padding: 0; list-style: none; border-top: 1px solid var(--k-line); }
.k-list > li { border-bottom: 1px solid var(--k-line); }
.k-list a, .k-list .k-row { display: flex; align-items: baseline; justify-content: space-between; gap: 16px; padding: 14px 0; color: var(--k-ink); text-decoration: none; font-weight: 500; }
.k-list a:hover { color: var(--k-brand-strong); }
.k-list small { font: 500 12px/1.4 var(--k-mono); color: var(--k-mute); white-space: nowrap; }
.k-list a::after { content: "\2192"; margin-left: auto; color: var(--k-line-strong); }
.k-list a:hover::after { color: var(--k-brand); }
.k-list a small { margin-left: 12px; }

/* grid of plain items, separated by rules (no cards) */
.k-grid { display: grid; grid-template-columns: repeat(var(--k-cols, 3), minmax(0, 1fr)); border-top: 1px solid var(--k-line); border-left: 1px solid var(--k-line); }
.k-grid > * { padding: 20px; border-right: 1px solid var(--k-line); border-bottom: 1px solid var(--k-line); }
.k-grid h3 { margin: 0 0 6px; font-size: 14px; font-weight: 600; color: var(--k-ink); }
.k-grid p { margin: 0; font-size: 14px; color: var(--k-mute); }
.k-grid .k-big { display: block; margin-bottom: 8px; font-size: 22px; font-weight: 600; letter-spacing: -.01em; color: var(--k-ink); }

/* notes */
.k-note { margin: 18px 0; padding: 12px 16px; border-left: 3px solid var(--k-brand); background: var(--k-soft); font-size: 14px; color: var(--k-text); }
.k-note strong { color: var(--k-ink); }
.k-note.is-warn { border-left-color: var(--k-warn); }
.k-note.is-ok { border-left-color: var(--k-ok); }

/* forms */
.k-form { display: grid; gap: 16px; max-width: 520px; }
.k-field label { display: block; margin: 0 0 6px; font-size: 13px; font-weight: 600; color: var(--k-ink); }
.k-field .k-hint { margin: 6px 0 0; font-size: 12.5px; color: var(--k-mute); }
.k-input, .k-select, .k-textarea { width: 100%; min-height: 40px; padding: 8px 12px; font: 400 14px/1.4 inherit; font-family: inherit; color: var(--k-ink); background: #fff; border: 1px solid var(--k-line-strong); border-radius: 6px; box-shadow: none; }
.k-textarea { min-height: 120px; resize: vertical; }
.k-input:focus, .k-select:focus, .k-textarea:focus { outline: 2px solid color-mix(in srgb, var(--k-brand) 40%, transparent); outline-offset: 0; border-color: var(--k-brand); }
.k-input::placeholder { color: #94A3B8; }

/* buttons */
.k-btn { display: inline-flex; align-items: center; justify-content: center; gap: 8px; min-height: 40px; padding: 0 18px; font: 600 14px/1 inherit; font-family: inherit; color: var(--k-ink); background: #fff; border: 1px solid var(--k-line-strong); border-radius: 6px; text-decoration: none; cursor: pointer; box-shadow: none; }
.k-btn:hover { background: var(--k-soft); color: var(--k-ink); }
.k-btn.is-primary { color: #fff; background: var(--k-brand); border-color: var(--k-brand); }
.k-btn.is-primary:hover { background: var(--k-brand-strong); border-color: var(--k-brand-strong); color: #fff; }
.k-btn:focus-visible, .k-page a:focus-visible { outline: 2px solid var(--k-brand); outline-offset: 2px; }

/* empty / error state */
.k-empty { padding: 72px 0; text-align: left; max-width: 520px; }
.k-empty .k-code { display: block; margin-bottom: 14px; font: 600 13px/1 var(--k-mono); letter-spacing: .08em; text-transform: uppercase; color: var(--k-brand-strong); }
.k-empty h1 { margin: 0 0 10px; font-size: 28px; font-weight: 600; letter-spacing: -.02em; color: var(--k-ink); }
.k-empty p { margin: 0 0 22px; color: var(--k-mute); }
.k-actions { display: flex; flex-wrap: wrap; gap: 10px; }

/* ---- additions: small generic pieces used by the info pages ---- */
.k-section.is-stack { grid-template-columns: minmax(0, 1fr); }
.k-section > div > .k-facts + .k-facts, .k-facts.k-gap + .k-facts.k-gap { margin-top: 24px; }
.k-layout.is-single { grid-template-columns: minmax(0, 1fr); }
.k-mute { color: var(--k-mute); }
.k-hint { margin: 14px 0 0; font-size: 13px; color: var(--k-mute); }
.k-pre { display: block; margin-top: 6px; white-space: pre-line; }
.k-note .k-actions { margin-top: 12px; }
.k-note.is-bad { border-left-color: var(--k-bad); }
.k-btn[disabled] { opacity: .6; cursor: default; }
.k-input.is-invalid, .k-select.is-invalid, .k-textarea.is-invalid { border-color: var(--k-bad); }
.k-form .k-actions { margin-top: 4px; }

/* plain bullet list and link columns */
.k-bullets { margin: 0; padding-left: 20px; }
.k-bullets li { margin: 0 0 6px; }
.k-links { margin: 0; padding: 0; list-style: none; }
.k-links a, .k-sub a { display: inline-block; padding: 4px 0; font-size: 14px; color: var(--k-text); text-decoration: none; }
.k-links a:hover, .k-sub a:hover { color: var(--k-brand-strong); }
.k-sub { margin: 10px 0 0; }
.k-sub a { font-weight: 600; color: var(--k-ink); }
.k-grid h3 a { font-weight: 600; }

/* question / answer rows */
.k-faq { border-top: 1px solid var(--k-line); }
.k-faq details { border-bottom: 1px solid var(--k-line); }
.k-faq summary { display: flex; align-items: center; justify-content: space-between; gap: 16px; min-height: 44px; padding: 10px 0; font-weight: 500; color: var(--k-ink); cursor: pointer; list-style: none; }
.k-faq summary::-webkit-details-marker { display: none; }
.k-faq summary::after { content: "+"; font: 500 16px/1 var(--k-mono); color: var(--k-mute); }
.k-faq details[open] summary::after { content: "\2212"; }
.k-faq details > p { margin: 0 0 14px; max-width: 70ch; color: var(--k-text); }

/* tables and mono tags */
.k-table-wrap { overflow-x: auto; }
.k-table { width: 100%; border-collapse: collapse; font-size: 14px; }
.k-table th { text-align: left; font: 500 12px/1.4 var(--k-mono); color: var(--k-mute); text-transform: uppercase; letter-spacing: .04em; }
.k-table th, .k-table td { padding: 10px 12px 10px 0; border-bottom: 1px solid var(--k-line); vertical-align: top; }
.k-table thead th { border-bottom-color: var(--k-line-strong); }
.k-table .is-num { text-align: right; padding-right: 0; }
.k-table .is-nowrap { white-space: nowrap; }
.k-tag { display: inline-block; margin-right: 8px; font: 600 12px/1.4 var(--k-mono); text-transform: uppercase; letter-spacing: .04em; color: var(--k-mute); }
.k-tag.is-add { color: var(--k-ok); }
.k-tag.is-chg { color: var(--k-warn); }
.k-tag.is-del { color: var(--k-bad); }
.k-changes { margin: 10px 0 0; padding: 0; list-style: none; font-size: 14px; }
.k-changes li { margin: 2px 0; }
.k-diff { padding: 4px 10px; margin: 2px 0; border-left: 3px solid var(--k-line); font-size: 14px; line-height: 1.6; color: var(--k-mute); }
.k-diff.is-add { border-left-color: var(--k-ok); background: var(--k-soft); color: var(--k-ink); }
.k-diff.is-del { border-left-color: var(--k-bad); text-decoration: line-through; }
.k-diff.is-head { font-weight: 600; }
.k-aside { max-width: 70ch; margin-top: 40px; padding-top: 24px; border-top: 1px solid var(--k-line); }
.k-aside > .k-label { margin-bottom: 12px; }

/* body of a policy document (HTML written in the admin) */
.k-prose { overflow-wrap: anywhere; }
.k-prose h2, .k-prose h3 { scroll-margin-top: 96px; }
.k-prose h4 { margin: 16px 0 6px; font-size: 14px; font-weight: 600; color: var(--k-ink); }
.k-prose p { margin: 0 0 14px; }
.k-prose li { margin: 4px 0; }
.k-prose hr { border: 0; border-top: 1px solid var(--k-line); margin: 24px 0; }
.k-prose img { max-width: 100%; height: auto; }
.k-prose table { display: block; max-width: 100%; overflow-x: auto; border-collapse: collapse; margin: 14px 0 18px; font-size: 14px; }
.k-prose th, .k-prose td { padding: 8px 12px 8px 0; border-bottom: 1px solid var(--k-line); vertical-align: top; text-align: left; min-width: 90px; }
.k-prose th { font-weight: 600; color: var(--k-ink); border-bottom-color: var(--k-line-strong); }
.k-prose .callout { margin: 18px 0; padding: 12px 16px; border-left: 3px solid var(--k-brand); background: var(--k-soft); font-size: 14px; }
.k-prose .callout p:last-child { margin-bottom: 0; }
.k-prose .callout-warning { border-left-color: var(--k-warn); }
.k-prose .callout-success { border-left-color: var(--k-ok); }

@media (max-width: 899px) {
  .k-layout { grid-template-columns: minmax(0, 1fr); gap: 0; }
  .k-toc { position: static; display: flex; gap: 4px; overflow-x: auto; margin: 0 -20px 20px; padding: 0 20px 8px; border-left: 0; border-bottom: 1px solid var(--k-line); white-space: nowrap; scrollbar-width: none; }
  .k-toc a { padding: 6px 10px; margin: 0; border: 1px solid var(--k-line); border-radius: 6px; font-size: 12.5px; }
  .k-toc a.is-active { border-color: var(--k-brand); background: var(--k-brand-tint); }
  .k-section { grid-template-columns: minmax(0, 1fr); gap: 10px; }
  .k-grid { --k-cols: 1; }
  .k-facts > div { grid-template-columns: minmax(0, 1fr); gap: 2px; }
  .k-list a, .k-list .k-row { flex-wrap: wrap; gap: 2px 12px; }
  .k-list small { white-space: normal; }
  .k-list a::after { margin-left: auto; }
}
@media (max-width: 599px) {
  .k-head { padding: 26px 0 20px; }
  .k-body { padding: 22px 0 48px; }
  .k-page { font-size: 14.5px; }
  .k-input, .k-select, .k-textarea { font-size: 16px; }
  .k-actions .k-btn { flex: 1 1 100%; }
}
@media (prefers-reduced-motion: reduce) { .k-page * { transition: none !important; animation: none !important; } }
