/* Ink & Signal for every route except the homepage (body.ink-home).
   Loaded after each page's own <style> so these tokens and chrome win.
   Homepage keeps styles/homepage.css. Culture Cards pages do not link this file.
   Depends on styles/ink-signal.css for --ink, --signal, and the type roles. */

:root {
    --bg: var(--ink);
    --bg-raised: var(--ink-raised);
    --bg-card: var(--ink-card);
    --bg-hover: rgba(244, 241, 234, 0.06);
    --text: var(--ink-text);
    --text-2: var(--ink-text-2);
    --text-3: var(--ink-text-3);
    --accent: var(--signal);
    --accent-hover: var(--signal-hover);
    --accent-bg: rgba(255, 106, 43, 0.14);
    --accent-border: rgba(255, 106, 43, 0.4);
    --teal: #d6d0c3;
    --teal-bg: rgba(244, 241, 234, 0.08);
    --teal-border: rgba(244, 241, 234, 0.18);
    --violet: #ffb088;
    --violet-bg: rgba(255, 106, 43, 0.1);
    --violet-border: rgba(255, 106, 43, 0.28);
    --rose: #ff8a5b;
    --rose-bg: rgba(255, 106, 43, 0.1);
    --rose-border: rgba(255, 106, 43, 0.28);
    --sky: #cfcac0;
    --sky-bg: rgba(244, 241, 234, 0.08);
    --sky-border: rgba(244, 241, 234, 0.18);
    --orange: var(--signal);
    --orange-bg: rgba(255, 106, 43, 0.14);
    --orange-border: rgba(255, 106, 43, 0.4);
    --lime: #e7e1d6;
    --lime-bg: rgba(244, 241, 234, 0.08);
    --lime-border: rgba(244, 241, 234, 0.18);
    --green: #d6d0c3;
    --green-bg: rgba(244, 241, 234, 0.08);
    --border: var(--ink-line);
    --border-2: rgba(244, 241, 234, 0.22);
    --border-3: rgba(244, 241, 234, 0.32);
    --radius: 22px;
    --radius-sm: 12px;
    --radius-lg: 28px;
    --radius-full: 999px;
    --font-display: var(--font-serif);
    --font-body: var(--font-sans);
    --shadow: 0 24px 48px -28px rgba(0, 0, 0, 0.7);
    --shadow-lg: 0 40px 80px -32px rgba(0, 0, 0, 0.75);
}

html { color-scheme: dark; }
body:not(.ink-home) {
    background: var(--ink) !important;
    color: var(--ink-text);
    font-family: var(--font-sans);
    text-align: left;
}
body:not(.ink-home) ::selection { background: var(--signal); color: var(--ink); }
body:not(.ink-home) :focus-visible { outline: 3px solid var(--signal); outline-offset: 3px; }

body:not(.ink-home) h1,
body:not(.ink-home) .page-head h1,
body:not(.ink-home) .job-title,
body:not(.ink-home) .cp-hero h1,
body:not(.ink-home) .cl-hero h1,
body:not(.ink-home) .dg-hero h1,
body:not(.ink-home) .rd-hero h1,
body:not(.ink-home) .article-hero h1,
body:not(.ink-home) .hj-hero h1 {
    font-family: var(--font-serif);
    font-weight: 400;
    letter-spacing: -0.02em;
    text-align: left;
    color: var(--ink-text);
}
body:not(.ink-home) h1 em,
body:not(.ink-home) h2 em { font-style: italic; color: var(--signal); }

/* Company directory hero is one centered column. The sitewide h1
   left-align was pinning the title to the container edge while the
   eyebrow stayed centered and the subtitle used its own 600px measure. */
body:not(.ink-home) .dir-hero,
body:not(.ink-home) .dir-hero-copy,
body:not(.ink-home) .dir-hero-copy h1,
body:not(.ink-home) .dir-hero-copy .dir-hero-sub {
    text-align: center;
}
body:not(.ink-home) .dir-hero-copy {
    width: min(600px, 100%);
    max-width: 600px;
    margin-left: auto;
    margin-right: auto;
}
body:not(.ink-home) .dir-hero-copy .dir-hero-sub {
    max-width: none;
    margin-left: auto;
    margin-right: auto;
}

body:not(.ink-home) .cp-hero,
body:not(.ink-home) .cl-hero,
body:not(.ink-home) .page-head,
body:not(.ink-home) .dg-hero,
body:not(.ink-home) .rd-hero,
body:not(.ink-home) .article-hero,
body:not(.ink-home) .hj-hero,
body:not(.ink-home) .job-header {
    text-align: left;
}
body:not(.ink-home) .job-header {
    /* Clip the Apply control so its shadow cannot paint the culture card. */
    overflow: hidden;
}
body:not(.ink-home) .cp-hero-tagline,
body:not(.ink-home) .cp-hero-logo,
body:not(.ink-home) .cl-hero p,
body:not(.ink-home) .cl-hero-sub,
body:not(.ink-home) .dg-hero .dg-sub,
body:not(.ink-home) .article-hero p,
body:not(.ink-home) .hj-intro {
    margin-left: 0;
    margin-right: auto;
}
body:not(.ink-home) .cp-hero-stats,
body:not(.ink-home) .cp-hero-logo,
body:not(.ink-home) .cl-stats,
body:not(.ink-home) .dg-stats { justify-content: flex-start; }

body:not(.ink-home) nav {
    background: rgba(14, 14, 12, 0.92) !important;
    border-bottom: 1px solid rgba(244, 241, 234, 0.12) !important;
    backdrop-filter: blur(16px);
}
body:not(.ink-home) .nav-inner {
    max-width: 1280px;
    width: 100%;
    margin-left: auto;
    margin-right: auto;
    padding: 14px 32px;
    box-sizing: border-box;
    flex-wrap: wrap;
    gap: 8px 16px;
}
body:not(.ink-home) .nav-logo,
body:not(.ink-home) .nav-wordmark { color: var(--ink-text) !important; letter-spacing: -0.01em; }
body:not(.ink-home) .nav-wordmark span { color: var(--signal) !important; }
/* Same soft signal ring as the homepage mark. Pages that still ship .ring keep logoPing. */
@keyframes nav-mark-pulse {
    0%, 100% { box-shadow: 0 0 0 0 rgba(255, 106, 43, 0.5); }
    50% { box-shadow: 0 0 0 10px rgba(255, 106, 43, 0); }
}
body:not(.ink-home) .nav-mark:not(:has(.ring)) {
    animation: nav-mark-pulse 2.6s ease-in-out infinite;
}
@media (prefers-reduced-motion: reduce) {
    body:not(.ink-home) .nav-mark:not(:has(.ring)) { animation: none; }
}
body:not(.ink-home) .nav-links a {
    color: #bdb8ae !important;
    font-size: 14px;
    font-weight: 400;
    text-decoration: none;
}
body:not(.ink-home) .nav-links a:hover,
body:not(.ink-home) .nav-links a.active { color: var(--signal) !important; background: transparent; }
body:not(.ink-home) .nav-links .nav-cta,
body:not(.ink-home) a.nav-cta {
    background: transparent !important;
    color: #f4f1ea !important;
    border: 1px solid rgba(244, 241, 234, 0.28) !important;
    border-radius: 999px !important;
    padding: 11px 20px !important;
    min-height: 44px;
    font-weight: 500 !important;
    box-shadow: none !important;
    transform: none !important;
}
body:not(.ink-home) .nav-links .nav-cta:hover,
body:not(.ink-home) a.nav-cta:hover { color: var(--signal) !important; background: transparent !important; }
body:not(.ink-home) .hamburger span { background: var(--ink-text); }

@media (min-width: 1051px) {
    body:not(.ink-home) .nav-links {
        display: flex;
        flex: 1 1 280px;
        min-width: 0;
        flex-direction: row;
        flex-wrap: wrap;
        align-items: center;
        justify-content: flex-end;
        gap: 8px 18px;
        position: static;
        max-height: none;
        overflow: visible;
        background: transparent;
        border: 0;
        box-shadow: none;
        padding: 0;
    }
}

body:not(.ink-home) .btn-primary,
body:not(.ink-home) a.btn-primary,
body:not(.ink-home) .apply-btn,
body:not(.ink-home) .nl-submit,
body:not(.ink-home) .hj-btn,
body:not(.ink-home) .job-unlock-form button,
body:not(.ink-home) .unlock-browse {
    background: var(--signal) !important;
    color: #0e0e0c !important;
    border: 0 !important;
    border-radius: 999px !important;
    font-weight: 600 !important;
    padding: 14px 22px !important;
    min-height: 48px;
    max-width: 100%;
    white-space: normal;
    text-align: center;
    text-decoration: none !important;
    box-shadow: 0 16px 36px -8px rgba(255, 106, 43, 0.95);
}
body:not(.ink-home) .btn-primary:hover,
body:not(.ink-home) a.btn-primary:hover,
body:not(.ink-home) .apply-btn:hover,
body:not(.ink-home) .hj-btn:hover,
body:not(.ink-home) .job-unlock-form button:hover,
body:not(.ink-home) .unlock-browse:hover {
    background: var(--signal-hover) !important;
    color: #0e0e0c !important;
}
/* The header Apply button sits about 12px above the culture-signals card.
   Any orange box-shadow there paints onto that card. No shadow, and the
   header clips overflow, so nothing from the button can land on the card. */
body:not(.ink-home) .job-header .apply-btn,
body:not(.ink-home) .job-header a.apply-btn,
body:not(.ink-home) .job-header .apply-btn:hover,
body:not(.ink-home) .job-header a.apply-btn:hover {
    box-shadow: none !important;
}
body:not(.ink-home) .cp-cta-center { text-align: left; }

/* The closing Apply lives in the same 820px column as the FAQ.
   It sits on the trailing edge of that column (center-right of the
   page). A full-bleed left align pinned it to the viewport edge. */
body:not(.ink-home) .apply-section {
    box-sizing: border-box;
    width: min(820px, 100%);
    margin-inline: auto;
    padding: 4px 24px 32px;
    display: flex;
    justify-content: flex-end;
    align-items: center;
    text-align: right;
}
body:not(.ink-home) .apply-section .apply-btn {
    margin-left: auto;
    flex: 0 1 auto;
    box-shadow: none !important;
}
body:not(.ink-home) .apply-section .apply-btn:hover { box-shadow: none !important; }
body:not(.ink-home) .apply-section + footer {
    box-sizing: border-box;
    width: min(820px, 100%);
    margin-inline: auto;
    padding: 24px 24px 48px;
    text-align: left;
    background: transparent !important;
}
body:not(.ink-home) .apply-section + footer .links {
    justify-content: flex-start;
    gap: 8px 22px;
    margin-bottom: 14px;
}
body:not(.ink-home) .apply-section + footer p {
    margin: 0;
    text-align: left;
}

body:not(.ink-home) .job,
body:not(.ink-home) a.job,
body:not(.ink-home) .culture-card,
body:not(.ink-home) .cp-eng-card,
body:not(.ink-home) .rd-card,
body:not(.ink-home) .dg-job,
body:not(.ink-home) .cl-job,
body:not(.ink-home) .filter-bar,
body:not(.ink-home) .filter-dropdown-panel,
body:not(.ink-home) .jbc-shell,
body:not(.ink-home) .hj-job,
body:not(.ink-home) .hj-node,
body:not(.ink-home) .role-culture,
body:not(.ink-home) .similar-item {
    background: var(--ink-card) !important;
    color: var(--ink-text) !important;
    border: 1px solid rgba(244, 241, 234, 0.1) !important;
    border-radius: 22px !important;
    text-align: left;
}
body:not(.ink-home) .hj-job h3,
body:not(.ink-home) .hj-job p,
body:not(.ink-home) .hj-company,
body:not(.ink-home) .job-title,
body:not(.ink-home) .job-company,
body:not(.ink-home) .job-company b { color: var(--ink-text); }
body:not(.ink-home) .job-avatar,
body:not(.ink-home) .cp-hero-logo,
body:not(.ink-home) .culture-card-logo,
body:not(.ink-home) .dg-logo,
body:not(.ink-home) .si-logo {
    background: #fff;
    border-radius: 12px;
}
/* Outline culture pills use a dark translucent wash on night cards.
   Paper text keeps them readable. Do not paint bare .jt ink-black —
   that selector also matches .jt-teal / .jt-orange and made the labels
   black on dark gray. Solid match and active pills use a light fill,
   so those keep ink text. */
body:not(.ink-home) .jt-teal,
body:not(.ink-home) .jt-violet,
body:not(.ink-home) .jt-sky,
body:not(.ink-home) .jt-orange,
body:not(.ink-home) .jt-rose,
body:not(.ink-home) .cl-value-tag,
body:not(.ink-home) .culture-val,
body:not(.ink-home) .value-pill,
body:not(.ink-home) .dg-pill,
body:not(.ink-home) .jbc-culture-pill:not(.active) {
    color: #f4f1ea !important;
}
body:not(.ink-home) .jt.match-teal,
body:not(.ink-home) .jt.match-violet,
body:not(.ink-home) .jt.match-sky,
body:not(.ink-home) .jt.match-orange,
body:not(.ink-home) .jt.match-rose,
body:not(.ink-home) .jbc-culture-pill.active {
    color: #141412 !important;
}
body:not(.ink-home) .filter-dropdown-btn,
body:not(.ink-home) .filter-dropdown-btn:hover,
body:not(.ink-home) .filter-dropdown-btn.open,
body:not(.ink-home) .jbc-trend-chip,
body:not(.ink-home) .cp-dd-btn,
body:not(.ink-home) .cp-dd-btn:hover,
body:not(.ink-home) .cp-remote-pill,
body:not(.ink-home) .cp-remote-pill:hover {
    background: var(--ink-raised) !important;
    color: var(--ink-text) !important;
    border-color: rgba(244, 241, 234, 0.22) !important;
}
body:not(.ink-home) .cp-dd-panel {
    background: var(--ink-card) !important;
    color: var(--ink-text) !important;
    border-color: rgba(244, 241, 234, 0.16) !important;
}
body:not(.ink-home) .cp-dd-opt { color: var(--ink-text-2) !important; }
body:not(.ink-home) .cp-dd-opt:hover { background: rgba(244, 241, 234, 0.06) !important; color: var(--ink-text) !important; }
body:not(.ink-home) .hj-map,
body:not(.ink-home) .hj-band { background: var(--ink-raised) !important; color: var(--ink-text) !important; }
body:not(.ink-home) .hj-values a {
    background: var(--ink-card) !important;
    color: var(--ink-text) !important;
    border-color: rgba(244, 241, 234, 0.16) !important;
}

/* Unlock gate on /jobs, digests, and roundups. Same night card as a job
   row: ink surface, hairline, 22px radius. The cream panel and orange
   halo were a homepage paper moment dropped into the list. */
body:not(.ink-home) .job-unlock {
    box-sizing: border-box;
    grid-column: 1 / -1;
    width: 100%;
    margin: 40px 0 0;
    padding: 32px 32px 28px;
    text-align: left !important;
    background: var(--ink-card) !important;
    color: var(--ink-text) !important;
    border: 1px solid rgba(244, 241, 234, 0.1) !important;
    border-radius: 22px !important;
    box-shadow: none !important;
}
body:not(.ink-home) .job-unlock h2 {
    font-family: var(--font-serif);
    font-weight: 400;
    font-size: clamp(30px, 3.2vw, 42px);
    line-height: 1.12;
    letter-spacing: -0.02em;
    text-align: left;
    text-wrap: balance;
    color: var(--ink-text) !important;
    margin: 0 0 12px;
    max-width: 18em;
}
body:not(.ink-home) .job-unlock > p,
body:not(.ink-home) .job-unlock .unlock-micro,
body:not(.ink-home) .job-unlock .unlock-consent,
body:not(.ink-home) .job-unlock-form {
    margin-left: 0;
    margin-right: 0;
}
body:not(.ink-home) .job-unlock > p {
    max-width: 68ch;
    margin: 0 0 22px;
    color: var(--ink-text-2) !important;
    font-size: 16px;
    line-height: 1.55;
}
body:not(.ink-home) .job-unlock .unlock-micro,
body:not(.ink-home) .job-unlock .unlock-consent {
    max-width: 68ch;
    color: var(--ink-text-3) !important;
}
body:not(.ink-home) .job-unlock .unlock-micro {
    margin-top: 14px;
    font-size: 14px;
    line-height: 1.45;
}
body:not(.ink-home) .job-unlock .unlock-consent {
    margin-top: 6px;
    font-size: 13px;
    line-height: 1.5;
}
body:not(.ink-home) .job-unlock .unlock-consent a {
    color: var(--signal) !important;
    text-decoration: underline;
    text-underline-offset: 3px;
}
body:not(.ink-home) .job-unlock .unlock-status {
    min-height: 1.4em;
    margin: 10px 0 0;
    font-size: 14px;
    color: var(--signal) !important;
}
body:not(.ink-home) .job-unlock .unlock-browse { margin-top: 16px; }
body:not(.ink-home) form.job-unlock-form {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
    align-items: end;
    gap: 12px;
    width: 100%;
    max-width: none;
    margin-top: 0;
    box-sizing: border-box;
}
body:not(.ink-home) form.job-unlock-form > label,
body:not(.ink-home) form.job-unlock-form > button {
    width: 100% !important;
    min-width: 0;
    max-width: none;
    box-sizing: border-box;
}
body:not(.ink-home) form.job-unlock-form > label input[type="email"] {
    width: 100%;
    box-sizing: border-box;
}
body:not(.ink-home) input:not([type="checkbox"]):not([type="radio"]):not(.jbc-field-input),
body:not(.ink-home) textarea,
body:not(.ink-home) select {
    background: #151513 !important;
    color: var(--ink-text) !important;
    border: 1px solid rgba(244, 241, 234, 0.2) !important;
    border-radius: 12px !important;
}
body:not(.ink-home) form.job-unlock-form > label {
    display: flex;
    flex-direction: column;
    gap: 8px;
    font-size: 11px;
    font-weight: 600;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    color: var(--ink-text-3) !important;
}
body:not(.ink-home) section.job-unlock form.job-unlock-form label input[type="email"] {
    background: #fff !important;
    color: #141412 !important;
    border: 1px solid #d6d0c3 !important;
    border-radius: 999px !important;
    min-height: 52px;
    margin: 0;
    padding: 0 22px;
    font-size: 16px;
    font-weight: 500;
    letter-spacing: 0;
    text-transform: none;
    font-family: var(--font-sans);
}
body:not(.ink-home) section.job-unlock form.job-unlock-form label input[type="email"]::placeholder {
    color: #6b665d;
    text-transform: none;
    font-weight: 400;
}
body:not(.ink-home) section.job-unlock form.job-unlock-form label input[type="email"]:focus,
body:not(.ink-home) section.job-unlock form.job-unlock-form label input[type="email"]:focus-visible {
    border-color: var(--signal) !important;
    outline: 3px solid rgba(255, 106, 43, 0.45);
    outline-offset: 2px;
}
body:not(.ink-home) form.job-unlock-form > button {
    min-height: 52px;
    align-self: end;
}

/* The jobs-list explainer under the gate. Same card as the list,
   signal links instead of the browser-default blue underline. */
body:not(.ink-home) .jbc-intro {
    order: 3;
    margin: 28px 0 8px;
    padding: 32px 32px 28px;
    background: var(--ink-card);
    border: 1px solid rgba(244, 241, 234, 0.1);
    border-radius: 22px;
    color: var(--ink-text-2);
    font-size: 16px;
    line-height: 1.6;
}
body:not(.ink-home) .jbc-intro h2 {
    margin: 0 0 16px;
    max-width: 18em;
    font-family: var(--font-serif);
    font-weight: 400;
    font-size: clamp(28px, 3vw, 40px);
    line-height: 1.12;
    letter-spacing: -0.02em;
    color: var(--ink-text);
    text-wrap: balance;
}
body:not(.ink-home) .jbc-intro p {
    margin: 0 0 14px;
    max-width: 68ch;
}
body:not(.ink-home) .jbc-intro p:last-child { margin-bottom: 0; }
body:not(.ink-home) .jbc-intro a {
    color: var(--signal);
    text-decoration: underline;
    text-decoration-thickness: 1px;
    text-underline-offset: 3px;
}
body:not(.ink-home) .jbc-intro a:hover { color: var(--signal-hover); }
body:not(.ink-home) .jbc-field-input {
    background: transparent !important;
    color: var(--ink-text) !important;
    border: 0 !important;
}
body:not(.ink-home) input::placeholder,
body:not(.ink-home) textarea::placeholder { color: #8e897f; }

body:not(.ink-home) .claim-modal {
    background: var(--paper) !important;
    color: #141412 !important;
}
body:not(.ink-home) .claim-modal h2,
body:not(.ink-home) .claim-modal h3,
body:not(.ink-home) .claim-modal p,
body:not(.ink-home) .claim-modal label,
body:not(.ink-home) .claim-field-label { color: #141412 !important; }
body:not(.ink-home) .claim-overlay .claim-modal .claim-modal-form input,
body:not(.ink-home) .claim-overlay .claim-modal .claim-modal-form select,
body:not(.ink-home) .claim-overlay .claim-modal .claim-modal-form textarea,
body:not(.ink-home) .claim-modal input:not([type="checkbox"]):not([type="radio"]):not(.jbc-field-input),
body:not(.ink-home) .claim-modal select,
body:not(.ink-home) .claim-modal textarea {
    background: #fff !important;
    color: #141412 !important;
    border-color: rgba(20, 20, 18, 0.2) !important;
}
body:not(.ink-home) .claim-overlay .claim-modal .claim-modal-form input:focus,
body:not(.ink-home) .claim-overlay .claim-modal .claim-modal-form select:focus,
body:not(.ink-home) .claim-overlay .claim-modal .claim-modal-form textarea:focus {
    border-color: var(--signal) !important;
    box-shadow: 0 0 0 3px rgba(255,106,43,0.15) !important;
    background: #fff !important;
    color: #141412 !important;
}
body:not(.ink-home) .claim-modal input::placeholder,
body:not(.ink-home) .claim-modal textarea::placeholder { color: #8a857b !important; }
body:not(.ink-home) .claim-modal-sub,
body:not(.ink-home) .claim-modal-footer,
body:not(.ink-home) .claim-modal-success p { color: #45413a !important; }
body:not(.ink-home) .claim-modal h3 em { color: var(--signal) !important; font-style: italic; }
body:not(.ink-home) .claim-modal-close { color: #45413a !important; }
body:not(.ink-home) .claim-modal-close:hover { background: rgba(20,20,18,0.08) !important; color: #141412 !important; }
body:not(.ink-home) .claim-modal-icon {
    background: rgba(255,106,43,0.14) !important;
    color: var(--signal) !important;
}
body:not(.ink-home) .claim-modal-success .check {
    background: rgba(255,106,43,0.14) !important;
    color: var(--signal) !important;
}
body:not(.ink-home) .claim-modal-submit {
    background: var(--signal) !important;
    color: #fff !important;
    border: 0 !important;
    font-weight: 700 !important;
    transition: background 0.2s, transform 0.1s !important;
}
body:not(.ink-home) .claim-modal-submit:hover {
    background: var(--signal-hover) !important;
    color: #fff !important;
    transform: translateY(-1px);
}

/* ═══ Claim banner on the dark page (all 127 company pages) ═══ */
body:not(.ink-home) .claim-banner {
    background: var(--ink-raised) !important;
    border: 1px solid var(--ink-line) !important;
    color: var(--ink-text) !important;
}
body:not(.ink-home) .claim-banner-title { color: var(--ink-text) !important; }
body:not(.ink-home) .claim-banner-title .badge {
    background: var(--signal) !important;
    color: #fff !important;
}
body:not(.ink-home) .claim-banner-desc { color: var(--ink-text-2) !important; }
body:not(.ink-home) .claim-banner-btn {
    background: var(--signal) !important;
    color: #fff !important;
    border: 0 !important;
    font-weight: 700 !important;
    transition: background 0.2s, transform 0.1s !important;
}
body:not(.ink-home) .claim-banner-btn:hover {
    background: var(--signal-hover) !important;
    color: #fff !important;
    transform: translateY(-1px);
    box-shadow: 0 8px 20px -8px rgba(255,106,43,0.6);
}

/* ═══ Company profile template (cp-*) — triggerdev/inngest/infisical/resend ═══ */
body:not(.ink-home) .cp-button {
    background: var(--signal) !important;
    color: #fff !important;
    border: 1px solid transparent !important;
    transition: background 0.2s, transform 0.1s !important;
}
body:not(.ink-home) .cp-button:hover {
    background: var(--signal-hover) !important;
    color: #fff !important;
    transform: translateY(-1px);
}
body:not(.ink-home) .cp-button.secondary {
    background: transparent !important;
    color: var(--ink-text) !important;
    border: 1px solid rgba(244,241,234,0.28) !important;
}
body:not(.ink-home) .cp-button.secondary:hover {
    border-color: var(--signal) !important;
    color: var(--signal) !important;
    background: transparent !important;
    transform: translateY(-1px);
}
body:not(.ink-home) .cp-policy,
body:not(.ink-home) .cp-live-role {
    background: var(--ink-card) !important;
    border: 1px solid var(--ink-line) !important;
    color: var(--ink-text) !important;
    border-radius: var(--radius-card, 22px) !important;
    transition: border-color 0.2s, transform 0.1s !important;
}
body:not(.ink-home) .cp-policy h3,
body:not(.ink-home) .cp-live-role h3 { color: var(--ink-text) !important; }
body:not(.ink-home) .cp-policy p,
body:not(.ink-home) .cp-questions li,
body:not(.ink-home) .cp-live-role p { color: var(--ink-text-2) !important; }
body:not(.ink-home) .cp-sub { color: var(--ink-text-2) !important; }
body:not(.ink-home) .cp-note { color: var(--ink-text-3) !important; }
body:not(.ink-home) .cp-policy a { color: var(--signal) !important; text-decoration: none; }
body:not(.ink-home) .cp-policy a:hover { color: var(--signal-hover) !important; text-decoration: underline; }
body:not(.ink-home) .cp-live-role {
    display: block;
}
body:not(.ink-home) .cp-live-role:hover {
    border-color: var(--signal) !important;
    transform: translateY(-2px);
}
body:not(.ink-home) .cp-section h2 { color: var(--ink-text) !important; }

body:not(.ink-home) footer,
body:not(.ink-home) .home-footer,
body:not(.ink-home) .cp-footer {
    background: var(--ink) !important;
    color: var(--ink-text) !important;
    border-top: 1px solid rgba(244, 241, 234, 0.12);
    text-align: left;
}
body:not(.ink-home) footer a,
body:not(.ink-home) .ft-links a,
body:not(.ink-home) .cp-footer a { color: #bdb8ae !important; text-decoration: none; }
body:not(.ink-home) footer a:hover,
body:not(.ink-home) .cp-footer a:hover { color: var(--signal) !important; }
body:not(.ink-home) .ft-links,
body:not(.ink-home) .cp-footer-links { justify-content: flex-start; }

@media (max-width: 640px) {
    body:not(.ink-home) form.job-unlock-form { grid-template-columns: minmax(0, 1fr); }
    body:not(.ink-home) .job-unlock,
    body:not(.ink-home) .jbc-intro { padding: 22px 18px 20px; }
    body:not(.ink-home) .job-unlock { margin-top: 28px; }
    body:not(.ink-home) .apply-section { justify-content: stretch; }
    body:not(.ink-home) .apply-section .apply-btn {
        width: 100%;
        justify-content: center;
    }
}
@media (max-width: 900px) {
    body:not(.ink-home) .nav-links.open {
        background: #151513;
        border-bottom: 1px solid rgba(244, 241, 234, 0.12);
    }
    body:not(.ink-home) .nav-inner { padding: 14px 20px; }
}