/* Aptly's final legacy tokens, expressed as framework-neutral CSS variables. */
:root {
    --aptly-canvas: #f8fafc;
    --aptly-surface: #fff;
    --aptly-ink: #111827;
    --aptly-slate: #374151;
    --aptly-muted: #6b7280;
    --aptly-soft: #f3f4f6;
    --aptly-border: #e5e7eb;
    --aptly-primary: #2563eb;
    --aptly-primary-hover: #1d4ed8;
    --aptly-primary-soft: #eff6ff;
    --aptly-evergreen: #047857;
    --aptly-evergreen-soft: #ecfdf5;
    --aptly-success: #16a34a;
    --aptly-warning: #d97706;
    --aptly-danger: #dc2626;
    --aptly-info: #0284c7;
    --aptly-radius: .75rem;
    --aptly-radius-sm: .5rem;
    --aptly-radius-lg: 1rem;
    --aptly-shadow-xs: 0 1px 2px rgb(17 24 39 / .04);
    --aptly-shadow-sm: 0 10px 24px rgb(17 24 39 / .06), 0 1px 2px rgb(17 24 39 / .04);
    --aptly-shadow-md: 0 22px 50px rgb(17 24 39 / .1);
    --aptly-shadow-focus: 0 0 0 3px rgb(37 99 235 / .18);
    --aptly-ease-out: cubic-bezier(.22, 1, .36, 1);
    --bs-border-radius: var(--aptly-radius);
    --bs-border-radius-sm: var(--aptly-radius-sm);
    --bs-border-radius-lg: var(--aptly-radius-lg);
}

/* Directional reveal transforms must never create page-level horizontal scroll. */
html,
body {
    overflow-x: clip;
}

body {
    background:
        radial-gradient(circle at 18% 0%, rgb(37 99 235 / .08), transparent 30rem),
        linear-gradient(180deg, var(--aptly-canvas), var(--aptly-canvas) 24rem);
    -webkit-font-smoothing: antialiased;
}

::selection { background: rgb(37 99 235 / .16); }

:where(a, button, input, select, textarea, [tabindex]):focus-visible {
    outline: 2px solid var(--aptly-primary);
    outline-offset: 2px;
}

.btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: .5rem;
    transition: color .2s ease, background-color .2s ease, border-color .2s ease,
        box-shadow .2s ease, transform .2s ease;
}

.btn:not(:disabled):not(.disabled):hover { transform: translateY(-1px); }
.btn:focus-visible { box-shadow: var(--aptly-shadow-focus); }
.btn:disabled, .btn.disabled { cursor: not-allowed; opacity: .58; transform: none; }
.btn-outline-secondary { border-color: var(--aptly-border); color: var(--aptly-slate); }
.btn-outline-secondary:hover { border-color: #d1d5db; background: var(--aptly-soft); color: var(--aptly-ink); }
.btn-danger { box-shadow: 0 5px 14px rgb(220 38 38 / .14); }

.form-control,
.form-select {
    background-color: var(--aptly-surface);
    transition: border-color .2s ease, box-shadow .2s ease, background-color .2s ease;
}

.form-control:hover:not(:disabled), .form-select:hover:not(:disabled) { border-color: #d1d5db; }
.form-control:focus, .form-select:focus { box-shadow: var(--aptly-shadow-focus); }
.form-control:disabled, .form-select:disabled { cursor: not-allowed; background: var(--aptly-soft); opacity: .8; }
.form-control.is-invalid, .form-select.is-invalid { border-color: var(--aptly-danger); }
.invalid-feedback { color: #b91c1c; font-size: .8125rem; }
.form-text { color: var(--aptly-muted); font-size: .8125rem; }

.card {
    background: rgb(255 255 255 / .96);
    box-shadow: var(--aptly-shadow-sm);
    transition: border-color .25s ease, box-shadow .25s ease, transform .25s ease;
}

.card-interactive:hover {
    border-color: rgb(37 99 235 / .25);
    box-shadow: var(--aptly-shadow-md);
    transform: translateY(-2px);
}

.badge-soft-danger { background: #fef2f2; color: #b91c1c; }
.badge-soft-neutral { background: var(--aptly-soft); color: var(--aptly-slate); }
.badge-soft-info { background: #f0f9ff; color: #0369a1; }

.alert { border-width: 1px; box-shadow: var(--aptly-shadow-xs); }
.alert-info { border-color: #bae6fd; background: #f0f9ff; color: #075985; }
.alert-success { border-color: #bbf7d0; background: #f0fdf4; color: #166534; }
.alert-warning { border-color: #fde68a; background: #fffbeb; color: #92400e; }

.modal-backdrop.show { opacity: .35; }
.modal-content { border: 1px solid var(--aptly-border); border-radius: var(--aptly-radius-lg); box-shadow: var(--aptly-shadow-lg); }
.modal-header, .modal-footer { border-color: var(--aptly-border); }

.table { --bs-table-bg: transparent; }
.table > thead > tr > th { white-space: nowrap; }
.table > tbody > tr { transition: background-color .18s ease; }
.table-hover > tbody > tr:hover > * { --bs-table-bg-state: rgb(239 246 255 / .55); }

.aptly-empty-state {
    display: grid;
    justify-items: center;
    max-width: 34rem;
    margin-inline: auto;
    padding: clamp(2rem, 6vw, 4rem) 1.5rem;
    color: var(--aptly-muted);
    text-align: center;
}

.aptly-empty-state-icon {
    display: grid;
    width: 3rem;
    height: 3rem;
    margin-bottom: 1rem;
    place-items: center;
    border-radius: var(--aptly-radius);
    background: var(--aptly-primary-soft);
    color: var(--aptly-primary);
}

.aptly-skeleton {
    overflow: hidden;
    border-radius: .375rem;
    background: var(--aptly-soft);
}

.aptly-skeleton::after {
    display: block;
    width: 100%;
    height: 100%;
    content: "";
    background: linear-gradient(90deg, transparent, rgb(255 255 255 / .72), transparent);
    transform: translateX(-100%);
    animation: aptly-skeleton 1.4s ease-in-out infinite;
}

@keyframes aptly-skeleton { to { transform: translateX(100%); } }

/* Public shell */
.public-header {
    position: fixed;
    z-index: 1040;
    inset: 0 0 auto;
    padding: 1rem;
    color: #fff;
    transform: translateY(0);
    transition: transform .7s var(--aptly-ease-out), opacity .7s var(--aptly-ease-out),
        background-color .7s var(--aptly-ease-out), box-shadow .7s var(--aptly-ease-out), padding .7s var(--aptly-ease-out);
}

.public-header.is-hidden { pointer-events: none; opacity: 0; transform: translateY(-125%); }
.public-header.is-solid { padding: 0; background: #081120; box-shadow: 0 22px 50px rgb(2 6 23 / .35); }
.public-header-inner { display: grid; width: min(100%, 80rem); min-height: 3.5rem; margin: 0 auto; grid-template-columns: 1fr auto 1fr; align-items: center; gap: .75rem; transition: min-height .7s var(--aptly-ease-out), padding .7s var(--aptly-ease-out); }
.public-header.is-solid .public-header-inner { min-height: 4.75rem; padding-inline: 1.5rem; }
.public-brand { width: fit-content; padding: .75rem 1rem; border-radius: var(--aptly-radius-lg); background: rgb(11 18 32 / .48); box-shadow: 0 22px 50px rgb(0 0 0 / .15); text-decoration: none; backdrop-filter: blur(20px); transition: background-color .3s ease, transform .3s ease; }
.public-header.is-solid .public-brand { padding-inline: 0; background: transparent; box-shadow: none; backdrop-filter: none; }
.public-brand:hover { transform: translateY(-2px); }
.public-header .aptly-logo, .public-header .aptly-logo:hover { color: #fff; }
.public-header .aptly-mark { border-color: transparent; background: rgb(255 255 255 / .1); color: #93c5fd; box-shadow: none; }
.public-desktop-nav { display: flex; min-height: 3.5rem; align-items: center; gap: 1.75rem; padding: 0 1.75rem; border-radius: var(--aptly-radius-lg); background: rgb(11 18 32 / .42); box-shadow: 0 22px 50px rgb(0 0 0 / .15); backdrop-filter: blur(20px); transition: background-color .5s ease, box-shadow .5s ease, border-radius .5s ease; }
.public-header.is-solid .public-desktop-nav { background: transparent; box-shadow: none; backdrop-filter: none; }
.public-nav-link { position: relative; padding: .5rem 0; color: rgb(255 255 255 / .9); font-size: 1rem; font-weight: 650; text-decoration: none; }
.public-nav-link:hover { color: #fff; }
.public-nav-link::after { position: absolute; right: 50%; bottom: .15rem; left: 50%; height: 2px; border-radius: 999px; background: #fff; box-shadow: 0 0 16px rgb(255 255 255 / .55); content: ""; transition: right .3s ease, left .3s ease; }
.public-nav-link:hover::after, .public-nav-link.active::after { right: 0; left: 0; }
.public-nav-link.active { color: #bfdbfe; }
.public-nav-link.active::after { background: #93c5fd; box-shadow: 0 0 16px rgb(147 197 253 / .8); }
.public-header-actions { display: flex; align-items: center; justify-content: flex-end; gap: .75rem; }
.public-company-context { max-width: 12rem; overflow: hidden; color: rgb(255 255 255 / .68); font-size: .8rem; text-overflow: ellipsis; white-space: nowrap; }
.public-sign-in { min-height: 2.75rem; padding-inline: 1.5rem; border: 0; border-radius: var(--aptly-radius-lg); background: #fff; color: #0b1220; box-shadow: 0 22px 50px rgb(0 0 0 / .15); font-size: .9375rem; font-weight: 650; }
.public-sign-in:hover { background: rgb(255 255 255 / .95); color: #0b1220; }
.public-menu-button { display: none; width: 2.75rem; height: 2.75rem; padding: .65rem; border: 0; border-radius: var(--aptly-radius-lg); background: rgb(11 18 32 / .48); box-shadow: 0 22px 50px rgb(0 0 0 / .15); }
.public-menu-button span { display: block; height: 2px; margin-block: 4px; border-radius: 1px; background: #fff; }
.public-mobile-drawer { --bs-offcanvas-width: min(24rem, 100vw); }
.public-mobile-link { min-height: 2.75rem; padding: .7rem .75rem; border-radius: var(--aptly-radius); color: var(--aptly-ink); font-weight: 650; text-decoration: none; }
.public-mobile-link:hover { background: var(--aptly-soft); color: var(--aptly-ink); }
.public-header + .offcanvas + main > .public-hero > .container { padding-top: 8.5rem !important; }

.public-footer { margin-top: 0; border-top: 1px solid rgb(255 255 255 / .1); background: #0b1220; color: #fff; }
.public-footer-grid { display: grid; gap: 2rem; padding-top: 2.5rem; padding-bottom: 2.5rem; grid-template-columns: 1.3fr 1fr 1fr; }
.public-footer .aptly-logo { color: #fff; }
.public-footer .aptly-mark { border-color: rgb(255 255 255 / .2); background: rgb(255 255 255 / .1); color: #93c5fd; }
.public-footer-summary { max-width: 22rem; margin: .75rem 0 0; color: rgb(255 255 255 / .6); font-size: .875rem; line-height: 1.5rem; }
.public-footer-heading { margin-bottom: .75rem; color: rgb(255 255 255 / .5); font-size: .75rem; font-weight: 650; letter-spacing: .14em; text-transform: uppercase; }
.public-footer-links { display: grid; gap: .5rem; margin: 0; padding: 0; list-style: none; }
.public-footer-links a { color: rgb(255 255 255 / .7); font-size: .875rem; transition: color .2s ease; }
.public-footer-links a:hover { color: #fff; }
.public-footer-legal { padding-block: 1.25rem; border-top: 1px solid rgb(255 255 255 / .1); color: rgb(255 255 255 / .45); font-size: .75rem; }

@media (max-width: 991.98px) {
    .public-header-inner { grid-template-columns: 1fr auto; }
    .public-desktop-nav, .public-sign-in, .public-company-context { display: none; }
    .public-menu-button { display: block; }
    .public-footer-grid { grid-template-columns: 1fr 1fr; }
    .public-footer-grid > :first-child { grid-column: 1 / -1; }
}

@media (max-width: 575.98px) {
    .public-header { padding: .75rem; }
    .public-header.is-solid .public-header-inner { padding-inline: .75rem; }
    .public-footer-grid { grid-template-columns: 1fr; }
    .public-footer-grid > :first-child { grid-column: auto; }
}

/* Marketing homepage */
.marketing-hero { position: relative; isolation: isolate; min-height: 42rem; overflow: hidden; color: #fff; }
.marketing-hero-image { position: absolute; z-index: -3; inset: 0; width: 100%; height: 100%; object-fit: cover; object-position: center; }
.marketing-hero-overlay { position: absolute; z-index: -2; inset: 0; background: linear-gradient(90deg, rgb(11 18 32 / .96), rgb(11 18 32 / .78) 52%, rgb(11 18 32 / .42)), rgb(11 18 32 / .42); }
.marketing-hero-content { display: flex; min-height: 42rem; align-items: center; padding-top: 8rem; padding-bottom: 3.5rem; }
.marketing-hero-copy { max-width: 48rem; }
.marketing-hero h1 { max-width: 48rem; margin-top: 1.5rem; font-size: clamp(2.5rem, 5vw, 3.25rem); font-weight: 650; line-height: 1.06; text-shadow: 0 3px 24px rgb(2 6 23 / .55); }
.marketing-hero-copy > p { max-width: 42rem; margin-top: 1.25rem; color: rgb(255 255 255 / .85); font-size: 1.125rem; line-height: 1.75rem; text-shadow: 0 2px 16px rgb(2 6 23 / .75); }
.marketing-hero-stats { display: grid; max-width: 26rem; margin: 1.75rem 0 0; grid-template-columns: repeat(2, 1fr); gap: .75rem; }
.marketing-hero-stats div { padding: .875rem; border: 1px solid rgb(255 255 255 / .2); border-radius: var(--aptly-radius); background: rgb(11 18 32 / .6); backdrop-filter: blur(12px); }
.marketing-hero-stats dd { margin: 0; color: #fff; font-size: 1.5rem; font-weight: 650; }
.marketing-hero-stats dt { margin-top: .25rem; color: rgb(255 255 255 / .7); font-size: .75rem; font-weight: 500; }
.marketing-section { padding-top: 4rem; padding-bottom: 4rem; }
.marketing-kicker { margin-bottom: .75rem; color: var(--aptly-primary); font-size: .75rem; font-weight: 750; letter-spacing: .18em; text-transform: uppercase; }
.text-blue { color: #bfdbfe; }
.journey-panel { display: grid; overflow: hidden; border: 1px solid var(--aptly-border); border-radius: 2rem; background: #fff; box-shadow: 0 18px 45px rgb(15 23 42 / .07); grid-template-columns: .9fr 1.1fr; }
.journey-intro { display: flex; padding: clamp(2rem, 4vw, 3rem); flex-direction: column; justify-content: center; background: radial-gradient(circle at 100% 0, rgb(37 99 235 / .28), transparent 18rem), radial-gradient(circle at 20% 100%, rgb(4 120 87 / .2), transparent 18rem), #0b1220; color: #fff; }
.journey-intro h2 { font-size: clamp(2rem, 4vw, 2.5rem); font-weight: 650; }
.journey-intro > p:not(.marketing-kicker) { color: rgb(255 255 255 / .75); line-height: 1.75rem; }
.journey-intro .btn { align-self: flex-start; }
.journey-list { display: grid; align-content: center; gap: 1rem; margin: 0; padding: clamp(1.5rem, 4vw, 2.5rem); list-style: none; }
.journey-list li { display: flex; gap: 1rem; padding: 1rem; border: 1px solid rgb(229 231 235 / .75); border-radius: var(--aptly-radius-lg); background: rgb(248 250 252 / .7); transition: border-color .3s ease, box-shadow .3s ease, transform .3s ease; }
.journey-list li:hover { border-color: rgb(37 99 235 / .3); box-shadow: 0 10px 24px rgb(37 99 235 / .05); transform: translateY(-2px); }
.journey-list li > span { display: grid; width: 2.5rem; height: 2.5rem; flex: 0 0 auto; place-items: center; border-radius: 50%; background: var(--aptly-primary); color: #fff; font-size: .875rem; font-weight: 650; box-shadow: 0 8px 20px rgb(37 99 235 / .2); }
.journey-list h3, .feature-grid h3, .employer-feature-list h3 { margin: 0; font-size: 1rem; font-weight: 650; }
.journey-list p, .feature-grid p, .employer-feature-list p { margin: .25rem 0 0; color: var(--aptly-muted); font-size: .875rem; line-height: 1.5rem; }
.candidate-experience-panel { position: relative; isolation: isolate; display: grid; overflow: hidden; padding: clamp(1.5rem, 4vw, 2.5rem); border-radius: 2rem; background: radial-gradient(circle at 100% 0, rgb(37 99 235 / .35), transparent 22rem), radial-gradient(circle at 15% 100%, rgb(4 120 87 / .25), transparent 20rem), #081120; color: #fff; box-shadow: 0 24px 60px rgb(15 23 42 / .15); grid-template-columns: .85fr 1.15fr; gap: 2rem; }
.candidate-experience-intro { align-self: start; position: sticky; top: 7rem; }
.candidate-experience-intro h2, .employer-copy h2 { font-size: clamp(2rem, 4vw, 2.5rem); font-weight: 650; }
.candidate-experience-intro > p:not(.marketing-kicker) { max-width: 28rem; color: rgb(255 255 255 / .75); line-height: 1.75rem; }
.candidate-proof-grid { display: grid; max-width: 26rem; margin-top: 1.75rem; grid-template-columns: repeat(2, 1fr); gap: .75rem; }
.candidate-proof-grid div { padding: 1rem; border-radius: var(--aptly-radius-lg); background: rgb(255 255 255 / .08); }
.candidate-proof-grid strong, .candidate-proof-grid span { display: block; }
.candidate-proof-grid span { margin-top: .35rem; color: rgb(255 255 255 / .6); font-size: .75rem; line-height: 1.25rem; }
.feature-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: .75rem; }
.feature-grid article { padding: 1rem; border: 1px solid rgb(255 255 255 / .1); border-radius: var(--aptly-radius-lg); background: rgb(255 255 255 / .08); box-shadow: 0 10px 24px rgb(0 0 0 / .1); transition: background-color .3s ease, transform .3s ease; }
.feature-grid article:hover { background: rgb(255 255 255 / .12); transform: translateY(-4px); }
.feature-grid article:last-child { grid-column: 1 / -1; }
.feature-grid h3 { margin-top: 1rem; color: #fff; }
.feature-grid p { color: rgb(255 255 255 / .7); }
.feature-symbol { display: grid; width: 2.5rem; height: 2.5rem; place-items: center; border-radius: var(--aptly-radius); background: rgb(255 255 255 / .1); color: #bfdbfe; font-weight: 700; }
.employer-overview { background: linear-gradient(180deg, var(--aptly-canvas), rgb(255 255 255 / .75), var(--aptly-canvas)); }
.employer-overview-panel { display: grid; overflow: hidden; border: 1px solid var(--aptly-border); border-radius: 2rem; background: #fff; box-shadow: 0 18px 45px rgb(15 23 42 / .07); grid-template-columns: 1.05fr .95fr; }
.employer-image-wrap { position: relative; min-height: 32rem; overflow: hidden; }
.employer-image-wrap::after { position: absolute; inset: 0; background: linear-gradient(35deg, rgb(8 17 32 / .55), transparent 55%); content: ""; }
.employer-image-wrap img { width: 100%; height: 100%; object-fit: cover; transition: transform 1s ease; }
.employer-overview-panel:hover .employer-image-wrap img { transform: scale(1.025); }
.employer-copy { padding: clamp(2rem, 4vw, 3rem); }
.employer-copy > p:not(.marketing-kicker) { color: var(--aptly-muted); line-height: 1.75rem; }
.employer-feature-list { display: grid; gap: .75rem; margin-top: 1.75rem; }
.employer-feature-list article { display: flex; gap: .75rem; padding: 1rem; border-radius: var(--aptly-radius-lg); background: rgb(243 244 246 / .7); }
.employer-feature-list article > span { display: grid; width: 2.25rem; height: 2.25rem; flex: 0 0 auto; place-items: center; border-radius: var(--aptly-radius); background: #fff; color: var(--aptly-primary); }
.decision-support-section { max-width: 66rem; padding-top: 3.5rem; padding-bottom: 3.5rem; }
.decision-support-panel { padding: clamp(1.5rem, 4vw, 2rem); border: 1px solid rgb(37 99 235 / .15); border-radius: var(--aptly-radius-lg); background: linear-gradient(135deg, var(--aptly-primary-soft), #fff, rgb(239 246 255 / .6)); }
.decision-support-panel h2 { font-size: clamp(1.75rem, 3vw, 2.25rem); font-weight: 650; }
.decision-support-panel > p:not(.marketing-kicker) { max-width: 50rem; color: var(--aptly-muted); line-height: 1.75rem; }
.roles-showcase { border-block: 1px solid var(--aptly-border); background: rgb(255 255 255 / .72); }
.role-card-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 1rem; }
.role-showcase-card { position: relative; padding: 1.5rem; border: 1px solid var(--aptly-border); border-radius: var(--aptly-radius-lg); background: #fff; box-shadow: var(--aptly-shadow-sm); }
.company-avatar { display: grid; width: 2.75rem; height: 2.75rem; place-items: center; border-radius: var(--aptly-radius); background: #0b1220; color: #fff; font-weight: 700; }
.role-showcase-card p { margin: 1rem 0 .25rem; color: var(--aptly-muted); font-size: .8125rem; }
.role-showcase-card h3 { font-size: 1.25rem; }
.role-showcase-card > span:not(.company-avatar) { display: block; color: var(--aptly-muted); font-size: .8125rem; }
.role-showcase-card a { display: inline-block; margin-top: 1.25rem; font-weight: 650; }
.faq-section { max-width: 58rem; }
.faq-section h2 { font-size: clamp(2rem, 4vw, 2.5rem); font-weight: 650; }
.faq-section .accordion-item { overflow: hidden; margin-bottom: .75rem; border: 1px solid var(--aptly-border); border-radius: var(--aptly-radius-lg); box-shadow: var(--aptly-shadow-xs); }
.faq-section .accordion-button { padding: 1.25rem; font-weight: 650; }
.faq-section .accordion-button:not(.collapsed) { background: #081120; color: #fff; box-shadow: none; }
.faq-section .accordion-button:not(.collapsed)::after { filter: brightness(0) invert(1); }
.faq-section .accordion-body { color: var(--aptly-muted); line-height: 1.7; }
.marketing-cta-section { padding-top: 3.5rem; padding-bottom: 3.5rem; }
.marketing-cta { padding: clamp(2rem, 5vw, 3rem); border-radius: 2rem; background: radial-gradient(circle at 0 0, rgb(37 99 235 / .35), transparent 20rem), radial-gradient(circle at 90% 100%, rgb(4 120 87 / .25), transparent 20rem), #081120; color: #fff; text-align: center; box-shadow: 0 24px 60px rgb(15 23 42 / .15); }
.marketing-cta h2 { font-size: clamp(1.75rem, 3vw, 2.25rem); font-weight: 650; }
.marketing-cta p { color: rgb(255 255 255 / .8); }
.employer-marketing-hero { min-height: 38rem; }
.employer-marketing-hero .marketing-hero-content { min-height: 38rem; }
.employer-marketing-hero .marketing-hero-image { object-position: 58% center; }
.section-heading h2 { font-size: clamp(2rem, 4vw, 2.5rem); font-weight: 650; }
.employer-capability-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 1rem; }
.employer-capability-card { padding: 1.5rem; border: 1px solid var(--aptly-border); border-radius: var(--aptly-radius-lg); background: rgb(255 255 255 / .9); box-shadow: var(--aptly-shadow-sm); }
.employer-capability-card > span, .audience-symbol { display: grid; width: 3rem; height: 3rem; margin-bottom: 1.25rem; place-items: center; border-radius: var(--aptly-radius-lg); background: var(--aptly-primary-soft); color: var(--aptly-primary); font-size: 1.125rem; font-weight: 700; }
.employer-capability-card h3 { font-size: 1.125rem; font-weight: 650; }
.employer-capability-card p { margin: .5rem 0 0; color: var(--aptly-muted); font-size: .875rem; line-height: 1.5rem; }
.employer-evidence-panel { display: grid; overflow: hidden; border: 1px solid var(--aptly-border); border-radius: var(--aptly-radius-lg); background: #fff; box-shadow: var(--aptly-shadow-sm); grid-template-columns: 1.15fr .85fr; }
.employer-evidence-image { min-height: 28rem; overflow: hidden; }
.employer-evidence-image img { width: 100%; height: 100%; object-fit: cover; transition: transform 1s ease; }
.employer-evidence-panel:hover img { transform: scale(1.025); }
.employer-evidence-copy { display: flex; padding: clamp(2rem, 4vw, 3rem); flex-direction: column; justify-content: center; }
.employer-evidence-copy h2, .hiring-path-panel h2 { font-size: clamp(1.85rem, 4vw, 2.25rem); font-weight: 650; }
.employer-evidence-copy > p:not(.marketing-kicker), .hiring-path-panel > div > p, .employer-audience-grid p { color: var(--aptly-muted); line-height: 1.65rem; }
.employer-evidence-copy ul { display: grid; gap: .75rem; margin: 1.5rem 0 0; padding: 0; list-style: none; }
.employer-evidence-copy li { display: flex; gap: .5rem; align-items: center; font-size: .875rem; }
.employer-evidence-copy li span { color: var(--aptly-success); font-weight: 750; }
.hiring-path-panel { padding: clamp(1.5rem, 4vw, 2rem); border: 1px solid var(--aptly-border); border-radius: 1.5rem; background: rgb(255 255 255 / .75); box-shadow: var(--aptly-shadow-sm); }
.hiring-path-panel > div > p { max-width: 36rem; margin-bottom: 0; font-size: .875rem; }
.hiring-path-steps { display: grid; margin: 2rem 0 0; padding: 0; grid-template-columns: repeat(6, 1fr); gap: .75rem; list-style: none; }
.hiring-path-steps li { padding: 1rem; border: 1px solid var(--aptly-border); border-radius: var(--aptly-radius-lg); background: rgb(255 255 255 / .85); box-shadow: var(--aptly-shadow-xs); }
.hiring-path-steps span { display: grid; width: 2rem; height: 2rem; margin-bottom: 1rem; place-items: center; border-radius: 50%; background: var(--aptly-primary); color: #fff; font-size: .875rem; font-weight: 650; }
.hiring-path-steps strong { font-size: .875rem; }
.employer-audience-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 1.25rem; }
.employer-audience-grid article { padding: clamp(1.5rem, 4vw, 2rem); border: 1px solid var(--aptly-border); border-radius: var(--aptly-radius-lg); background: linear-gradient(135deg, var(--aptly-primary-soft), #fff); box-shadow: var(--aptly-shadow-sm); }
.employer-audience-grid article:last-child { background: linear-gradient(135deg, var(--aptly-evergreen-soft), #fff); }
.employer-audience-grid article:last-child .audience-symbol { background: var(--aptly-evergreen-soft); color: var(--aptly-evergreen); }
.employer-audience-grid h2 { font-size: 1.5rem; font-weight: 650; }
.roles-hero { position: relative; overflow: hidden; background: radial-gradient(circle at 20% 10%, rgb(37 99 235 / .28), transparent 34rem), radial-gradient(circle at 85% 20%, rgb(14 116 144 / .18), transparent 28rem), #0b1220; color: #fff; }
.roles-hero::after { position: absolute; inset: 0; background: linear-gradient(115deg, rgb(255 255 255 / .035) 1px, transparent 1px); background-size: 34px 34px; content: ""; pointer-events: none; -webkit-mask-image: linear-gradient(to bottom, #000, transparent 85%); mask-image: linear-gradient(to bottom, #000, transparent 85%); }
.roles-hero-content { position: relative; z-index: 1; max-width: 72rem; padding-top: 8.5rem; padding-bottom: 3.5rem; }
.roles-hero h1 { max-width: 42rem; font-size: clamp(2.5rem, 5vw, 3.25rem); font-weight: 650; }
.roles-hero-content > p:not(.marketing-kicker) { max-width: 38rem; color: rgb(255 255 255 / .72); line-height: 1.7; }
.role-search-panel { margin-top: 2rem; padding: 1.25rem; border: 1px solid rgb(255 255 255 / .1); border-radius: var(--aptly-radius-lg); background: rgb(255 255 255 / .96); box-shadow: 0 24px 55px rgb(0 0 0 / .25); backdrop-filter: blur(16px); }
.role-search-primary { display: grid; grid-template-columns: minmax(0, 2fr) minmax(12rem, 1fr) auto; gap: .75rem; }
.role-search-primary label { position: relative; }
.role-search-primary .form-control, .role-search-primary .btn { min-height: 2.75rem; }
.role-input-icon { position: absolute; z-index: 2; top: 50%; left: .75rem; color: var(--aptly-muted); transform: translateY(-50%); }
.role-input-icon + .form-control { padding-left: 2.25rem; }
.role-search-filters { display: grid; margin-top: .75rem; padding-top: .75rem; border-top: 1px solid var(--aptly-border); grid-template-columns: repeat(3, 1fr); gap: .75rem; }
.role-results-section { max-width: 72rem; padding-top: 3rem; padding-bottom: 4rem; }
.role-results-heading { display: flex; align-items: end; justify-content: space-between; gap: 1rem; }
.role-results-heading h2 { font-size: 1.75rem; font-weight: 650; }
.role-results-heading > p { color: var(--aptly-muted); font-size: .875rem; }
.marketplace-grid { display: grid; margin-top: 1.5rem; grid-template-columns: repeat(2, 1fr); gap: 1.25rem; }
.marketplace-card { overflow: hidden; border: 1px solid var(--aptly-border); border-radius: var(--aptly-radius-lg); background: #fff; box-shadow: var(--aptly-shadow-sm); }
.marketplace-card-accent { height: 4px; background: linear-gradient(90deg, var(--aptly-primary), #3b82f6, #06b6d4); opacity: .7; transition: opacity .3s ease; }
.marketplace-card:hover .marketplace-card-accent { opacity: 1; }
.marketplace-card-body { display: flex; min-height: 20rem; padding: 1.5rem; flex-direction: column; gap: 1rem; }
.marketplace-company { margin: 0; color: var(--aptly-primary); font-size: .75rem; font-weight: 750; letter-spacing: .08em; text-transform: uppercase; }
.marketplace-card h3 { margin: .25rem 0 0; font-size: 1.25rem; }
.marketplace-card h3 a { color: var(--aptly-ink); text-decoration: none; }
.marketplace-card:hover h3 a, .marketplace-card h3 a:hover { color: var(--aptly-primary); text-decoration: underline; text-underline-offset: .25rem; }
.marketplace-summary { display: -webkit-box; min-height: 3rem; overflow: hidden; margin: 0; color: var(--aptly-muted); font-size: .875rem; line-height: 1.5rem; -webkit-box-orient: vertical; -webkit-line-clamp: 2; }
.marketplace-badges { display: flex; flex-wrap: wrap; gap: .5rem; }
.company-careers-hero { position: relative; overflow: hidden; background: radial-gradient(circle at 20% 0, rgb(37 99 235 / .14), transparent 36rem), #f8fafc; }
.company-careers-content { max-width: 72rem; padding-top: 8rem; padding-bottom: 3rem; }
.careers-back-link { color: var(--aptly-slate); }
.company-avatar-large { width: 3.5rem; height: 3.5rem; border-radius: 1.25rem; font-size: 1.25rem; }
.company-careers-content h1 { margin: 0; font-size: clamp(2.25rem, 5vw, 3rem); font-weight: 650; }
.company-careers-content > p { max-width: 38rem; margin: 1rem 0 0; color: var(--aptly-muted); line-height: 1.7; }
.company-role-section { max-width: 72rem; padding-top: 2.5rem; padding-bottom: 4rem; }
.company-role-grid { display: grid; margin-top: 1.5rem; grid-template-columns: repeat(2, 1fr); gap: 1rem; }
.company-role-card { display: flex; min-height: 17rem; padding: 1.5rem; flex-direction: column; gap: 1rem; border: 1px solid var(--aptly-border); border-radius: var(--aptly-radius-lg); background: #fff; box-shadow: var(--aptly-shadow-sm); }
.company-role-card h3 { font-size: 1.25rem; }
.company-role-card h3 a { color: var(--aptly-ink); text-decoration: none; }
.company-role-card h3 a:hover { color: var(--aptly-primary); text-decoration: underline; text-underline-offset: .25rem; }
.company-role-card > p { color: var(--aptly-muted); font-size: .875rem; line-height: 1.5rem; }
.job-detail-hero { position: relative; overflow: hidden; background: radial-gradient(circle at 18% 10%, rgb(37 99 235 / .3), transparent 34rem), radial-gradient(circle at 85% 20%, rgb(14 116 144 / .2), transparent 28rem), #0b1220; color: #fff; }
.job-detail-hero-content { max-width: 72rem; padding-top: 8rem; padding-bottom: 3rem; }
.job-back-link { padding-inline: 0; color: rgb(255 255 255 / .7); }
.job-back-link:hover { color: #fff; }
.job-title-grid { display: grid; margin-top: 1.5rem; grid-template-columns: minmax(0, 1fr) 22rem; align-items: end; gap: 2rem; }
.job-title-grid h1 { margin: 0; font-size: clamp(2.5rem, 5vw, 3.25rem); font-weight: 650; text-shadow: 0 3px 24px rgb(2 6 23 / .45); }
.job-title-grid div > p:not(.marketing-kicker) { max-width: 44rem; margin: 1rem 0 0; color: rgb(255 255 255 / .75); line-height: 1.7; }
.job-ready-card { padding: 1.25rem; border: 1px solid rgb(255 255 255 / .1); border-radius: 1.5rem; background: rgb(255 255 255 / .06); box-shadow: 0 22px 50px rgb(0 0 0 / .2); backdrop-filter: blur(16px); }
.job-ready-card p { margin: .75rem 0 1.25rem; color: rgb(255 255 255 / .7); font-size: .875rem; line-height: 1.5rem; }
.job-meta-row { display: flex; flex-wrap: wrap; gap: .5rem; margin-top: 2rem; }
.job-meta-row span { padding: .5rem .75rem; border: 1px solid rgb(255 255 255 / .1); border-radius: 999px; background: rgb(255 255 255 / .06); color: rgb(255 255 255 / .82); font-size: .8125rem; }
.job-detail-layout { display: grid; max-width: 72rem; padding-top: 3rem; padding-bottom: 4rem; grid-template-columns: minmax(0, 1fr) 21rem; align-items: start; gap: 3rem; }
.job-detail-main { display: grid; gap: 3rem; }
.job-detail-main h2 { font-size: 1.5rem; font-weight: 650; }
.job-leading-copy { color: var(--aptly-slate); font-size: 1.0625rem; line-height: 1.8; }
.job-check-list { display: grid; gap: .75rem; margin: 1.25rem 0 0; padding: 0; list-style: none; }
.job-check-list li { display: flex; gap: .75rem; align-items: start; color: var(--aptly-slate); line-height: 1.65; }
.job-check-list span { display: grid; width: 1.5rem; height: 1.5rem; flex: 0 0 auto; place-items: center; border-radius: 50%; background: var(--aptly-evergreen-soft); color: var(--aptly-evergreen); font-size: .75rem; font-weight: 750; }
.job-process-panel { padding: 1.5rem; border: 1px solid var(--aptly-border); border-radius: var(--aptly-radius-lg); background: #fff; box-shadow: var(--aptly-shadow-sm); }
.job-process-grid { display: grid; margin-top: 1.5rem; grid-template-columns: repeat(3, 1fr); gap: .75rem; }
.job-process-grid article { padding: 1rem; border-radius: var(--aptly-radius); background: var(--aptly-soft); }
.job-process-grid article > span { display: grid; width: 2rem; height: 2rem; place-items: center; border-radius: 50%; background: var(--aptly-primary); color: #fff; font-size: .8rem; font-weight: 700; }
.job-process-grid h3 { margin: 1rem 0 .35rem; font-size: .9375rem; font-weight: 650; }
.job-process-grid p { margin: 0; color: var(--aptly-muted); font-size: .8rem; line-height: 1.4rem; }
.job-apply-aside { position: sticky; top: 6rem; }
.job-apply-card { padding: 1.5rem; border: 1px solid var(--aptly-border); border-radius: var(--aptly-radius-lg); background: #fff; box-shadow: var(--aptly-shadow-md); }
.job-apply-card h2 { margin-top: 1.25rem; font-size: 1.25rem; font-weight: 650; }
.job-apply-card p { color: var(--aptly-muted); font-size: .875rem; line-height: 1.5rem; }
.job-apply-card ul { display: grid; gap: .5rem; margin: 1.25rem 0; padding: 1.25rem 0; border-block: 1px solid var(--aptly-border); color: var(--aptly-slate); font-size: .8125rem; list-style: none; }
.job-mobile-apply { display: none; }
.application-hero { overflow: hidden; background: radial-gradient(circle at 18% 8%, rgb(37 99 235 / .34), transparent 34rem), radial-gradient(circle at 84% 22%, rgb(20 184 166 / .22), transparent 30rem), #081120; color: #fff; }
.application-hero-content { max-width: 72rem; padding-top: 7rem; padding-bottom: 6rem; }
.application-title-grid { display: grid; margin-top: 1.5rem; grid-template-columns: minmax(0, 1fr) 21rem; align-items: end; gap: 2rem; }
.application-title-grid h1 { margin: 0; font-size: clamp(2.35rem, 5vw, 3.15rem); font-weight: 650; }
.application-title-grid div > p:not(.marketing-kicker) { max-width: 44rem; margin: 1rem 0 0; color: rgb(255 255 255 / .75); line-height: 1.7; }
.application-title-grid > aside { padding: 1.25rem; border: 1px solid rgb(255 255 255 / .1); border-radius: 1.5rem; background: rgb(255 255 255 / .06); box-shadow: 0 22px 50px rgb(0 0 0 / .2); backdrop-filter: blur(16px); }
.application-title-grid > aside p { margin: .5rem 0 0; color: rgb(255 255 255 / .7); font-size: .875rem; line-height: 1.5rem; }
.application-layout { position: relative; display: grid; max-width: 72rem; margin-top: -4rem; padding-bottom: 4rem; grid-template-columns: .72fr 1.28fr; align-items: start; gap: 1.25rem; }
.application-guidance, .application-form-card, .status-access-card { border: 1px solid var(--aptly-border); border-radius: var(--aptly-radius-lg); background: #fff; box-shadow: var(--aptly-shadow-md); }
.application-guidance { padding: 1.5rem; }
.application-guidance h2 { font-size: 1.35rem; font-weight: 650; }
.application-guidance > p:not(.marketing-kicker) { color: var(--aptly-muted); font-size: .875rem; line-height: 1.5rem; }
.application-guidance ul { display: grid; gap: .75rem; margin: 1.5rem 0 0; padding: 0; list-style: none; }
.application-guidance li { display: flex; gap: .75rem; padding: .875rem; border: 1px solid var(--aptly-border); border-radius: var(--aptly-radius); background: var(--aptly-canvas); }
.application-guidance li > span { display: grid; width: 1.5rem; height: 1.5rem; flex: 0 0 auto; place-items: center; border-radius: 50%; background: var(--aptly-primary-soft); color: var(--aptly-primary); font-size: .75rem; font-weight: 750; }
.application-guidance li strong, .application-guidance li p { display: block; }
.application-guidance li p { margin: .25rem 0 0; color: var(--aptly-muted); font-size: .8rem; line-height: 1.35rem; }
.application-form-column { display: grid; gap: 1rem; }
.application-form-card { overflow: hidden; }
.application-card-header { padding: 1.5rem; border-bottom: 1px solid var(--aptly-border); }
.application-card-header h2 { margin: 0; font-size: 1.25rem; font-weight: 650; }
.application-card-header p { margin: .35rem 0 0; color: var(--aptly-muted); font-size: .8125rem; }
.application-form { display: grid; padding: 1.5rem; gap: 1.25rem; }
.application-form-row { display: grid; grid-template-columns: 1.15fr .85fr; gap: 1rem; }
.application-form .form-label > span[aria-hidden] { color: var(--aptly-danger); }
.application-upload { padding: 1rem; border: 1px dashed #cbd5e1; border-radius: var(--aptly-radius); background: var(--aptly-canvas); }
.application-consent { display: flex; align-items: start; gap: .625rem; padding: 1rem; border-radius: var(--aptly-radius); background: var(--aptly-primary-soft); }
.application-consent label { color: var(--aptly-slate); font-size: .875rem; line-height: 1.45; }
.status-access-card { padding: 1.5rem; }
.status-access-card h2 { margin: 0; font-size: 1.125rem; font-weight: 650; }
.status-access-card p { margin: .35rem 0 0; color: var(--aptly-muted); font-size: .875rem; }
.status-access-card form { display: grid; margin-top: 1rem; grid-template-columns: 1fr auto; gap: .5rem; }

/* Section 35: authentication and account recovery */
.auth-shell { overflow: hidden; }
.auth-aside { width: 48%; }
.auth-aside::after { background: radial-gradient(circle at 32% 18%, rgb(96 165 250 / .28), transparent 34%), linear-gradient(180deg, rgb(8 17 32 / .1), rgb(8 17 32 / .58) 48%, rgb(8 17 32 / .92)); }
.auth-aside-content { max-width: 38rem; text-shadow: 0 2px 12px rgb(2 6 23 / .65); }
.auth-aside-content p { max-width: 31rem; margin: 1rem 0 0; color: rgb(255 255 255 / .8); font-size: .94rem; line-height: 1.65; }
.auth-aside-content .auth-kicker { margin: 0; color: #bfdbfe; font-size: .72rem; font-weight: 750; letter-spacing: .18em; text-transform: uppercase; }
.auth-aside-content h2 { margin: 1rem 0 0; letter-spacing: -.025em; }
.auth-trust-list { display: flex; flex-wrap: wrap; gap: .5rem; margin-top: 1.25rem; }
.auth-trust-list span { padding: .4rem .75rem; border: 1px solid rgb(255 255 255 / .25); border-radius: 999px; background: rgb(255 255 255 / .1); color: rgb(255 255 255 / .92); font-size: .75rem; font-weight: 650; }
.auth-panel { background: #f8fafc; }
.auth-card { width: min(100%, 29rem); }
.auth-logo { display: flex; justify-content: center; margin-bottom: 1.5rem; }
.auth-heading { margin-bottom: 1.25rem; text-align: center; }
.auth-heading h1 { margin: 0; color: var(--aptly-ink); font-size: clamp(1.65rem, 3vw, 2rem); font-weight: 700; letter-spacing: -.035em; }
.auth-heading p { max-width: 25rem; margin: .55rem auto 0; color: var(--aptly-muted); font-size: .9rem; line-height: 1.5; }
.auth-provider-block { display: grid; gap: .4rem; }
.auth-provider-block p { margin: 0; color: var(--aptly-muted); font-size: .75rem; text-align: center; }
.auth-google-button { position: relative; min-height: 2.75rem; border: 1px solid var(--aptly-border); background: #fff; color: var(--aptly-ink); font-weight: 650; opacity: 1 !important; }
.google-mark { position: absolute; left: 1rem; display: grid; width: 1.3rem; height: 1.3rem; place-items: center; border-radius: 50%; color: #4285f4; font-weight: 800; }
.auth-divider { margin: 1.15rem 0; }
.auth-divider span { white-space: nowrap; }
.auth-submit { min-height: 2.75rem; background: #081120; border-color: #081120; box-shadow: 0 8px 20px rgb(2 6 23 / .12); }
.auth-submit:hover { background: #111827; border-color: #111827; }
.auth-submit[aria-busy="true"]::before { display: inline-block; width: .9rem; height: .9rem; margin-right: .5rem; content: ""; border: 2px solid rgb(255 255 255 / .45); border-top-color: #fff; border-radius: 50%; animation: aptly-spin .7s linear infinite; vertical-align: -.1rem; }
.auth-secondary-links { margin: 1.35rem 0 0; color: var(--aptly-muted); font-size: .875rem; text-align: center; }
.auth-secondary-links a { font-weight: 650; }
.auth-role-notice, .auth-status { display: flex; align-items: flex-start; gap: .75rem; margin-bottom: 1.25rem; padding: 1rem; border: 1px solid var(--aptly-border); border-radius: var(--aptly-radius); background: #fff; }
.auth-role-notice { flex-direction: column; gap: .15rem; border-color: #bfdbfe; background: var(--aptly-primary-soft); }
.auth-role-notice strong, .auth-status strong { color: var(--aptly-ink); font-size: .875rem; }
.auth-role-notice span, .auth-status p { margin: .2rem 0 0; color: var(--aptly-muted); font-size: .82rem; line-height: 1.45; }
.auth-status-icon { display: grid; width: 1.6rem; height: 1.6rem; flex: 0 0 auto; place-items: center; border-radius: 50%; font-size: .8rem; font-weight: 800; }
.auth-status-success { border-color: #a7f3d0; background: #ecfdf5; }
.auth-status-success .auth-status-icon { background: var(--aptly-evergreen); color: #fff; }
.auth-status-danger { border-color: #fecaca; background: #fef2f2; }
.auth-status-danger .auth-status-icon { background: #dc2626; color: #fff; }
.auth-status-info { border-color: #bfdbfe; background: var(--aptly-primary-soft); }
.auth-status-info .auth-status-icon { background: var(--aptly-primary); color: #fff; }
.password-rules { padding: 1rem; border-radius: var(--aptly-radius); background: #eef2f7; color: var(--aptly-slate); font-size: .82rem; }
.password-rules ul { margin: .5rem 0 0; padding-left: 1.15rem; }
.password-rules li + li { margin-top: .2rem; }
.mt-n2 { margin-top: -.5rem; }
@keyframes aptly-spin { to { transform: rotate(360deg); } }

/* Section 36: candidate access and self-service */
.candidate-stepper { overflow-x: auto; scrollbar-width: none; }
.candidate-stepper::-webkit-scrollbar { display: none; }
.candidate-stepper .journey-step { padding-inline: .25rem; }
.candidate-card-header { display: flex; align-items: flex-start; justify-content: space-between; gap: 1.5rem; }
.candidate-card-header > div:first-child { max-width: 38rem; }
.candidate-progress-card { width: 11rem; flex: 0 0 auto; padding: .8rem; border: 1px solid var(--aptly-border); border-radius: var(--aptly-radius); background: #f8fafc; }
.candidate-progress-card > div { display: flex; justify-content: space-between; gap: .75rem; color: var(--aptly-muted); font-size: .7rem; font-weight: 700; }
.candidate-progress-track { display: block; height: .4rem; overflow: hidden; margin-top: .55rem; border-radius: 999px; background: #e2e8f0; }
.candidate-progress-track i { display: block; height: 100%; border-radius: inherit; background: linear-gradient(90deg, var(--aptly-primary), #34d399); }
.candidate-context-list { display: grid; gap: 1.25rem; }
.candidate-context-list > div { display: flex; gap: .75rem; }
.candidate-context-list > div > span { display: grid; width: 2rem; height: 2rem; flex: 0 0 auto; place-items: center; border: 1px solid rgb(167 243 208 / .25); border-radius: 50%; background: rgb(52 211 153 / .1); color: #a7f3d0; }
.candidate-context-list p, .status-human-note p, .availability-guidance p, .support-assurance p { margin: 0; }
.candidate-context-list strong, .candidate-context-list small, .status-human-note strong, .status-human-note small, .availability-guidance strong, .availability-guidance small, .support-assurance strong, .support-assurance small { display: block; }
.candidate-context-list small { margin-top: .25rem; color: rgb(255 255 255 / .58); line-height: 1.45; }
.candidate-access-steps { display: grid; gap: .65rem; margin-top: 1.15rem; }
.candidate-access-steps > div { display: flex; gap: .75rem; padding: .8rem; border: 1px solid var(--aptly-border); border-radius: var(--aptly-radius); background: #fff; }
.candidate-access-steps > div > span { display: grid; width: 1.75rem; height: 1.75rem; flex: 0 0 auto; place-items: center; border-radius: .5rem; background: var(--aptly-primary-soft); color: var(--aptly-primary); font-size: .75rem; font-weight: 800; }
.candidate-access-steps p { margin: 0; }
.candidate-access-steps strong, .candidate-access-steps small { display: block; }
.candidate-access-steps strong { color: var(--aptly-ink); font-size: .84rem; }
.candidate-access-steps small { margin-top: .15rem; color: var(--aptly-muted); line-height: 1.4; }
.application-status-hero { padding: 6rem 0 7rem; background: radial-gradient(circle at 80% 0, rgb(37 99 235 / .24), transparent 28rem), #081120; color: #fff; }
.application-status-hero h1 { margin: .75rem 0 0; font-size: clamp(2.2rem, 5vw, 4rem); letter-spacing: -.045em; }
.application-status-hero > .container > p:last-child { max-width: 38rem; margin: 1rem 0 0; color: rgb(255 255 255 / .7); font-size: 1.05rem; }
.application-status-wrap { display: grid; max-width: 52rem; gap: 1rem; margin-top: -3.5rem; padding-bottom: 6rem; }
.application-status-card { padding: clamp(1.4rem, 4vw, 2rem); border: 1px solid var(--aptly-border); border-radius: var(--aptly-radius-xl); background: #fff; box-shadow: var(--aptly-shadow-lg); }
.application-status-progress > div { display: flex; justify-content: space-between; color: var(--aptly-muted); font-size: .78rem; font-weight: 700; }
.application-status-progress > span { display: block; height: .55rem; overflow: hidden; margin-top: .65rem; border-radius: 999px; background: #e2e8f0; }
.application-status-progress i { display: block; height: 100%; border-radius: inherit; background: linear-gradient(90deg, var(--aptly-primary), #34d399); }
.application-status-card dl { display: grid; margin: 1.75rem 0; border-block: 1px solid var(--aptly-border); }
.application-status-card dl > div { display: grid; grid-template-columns: 9rem 1fr; gap: 1rem; padding: .9rem 0; }
.application-status-card dl > div + div { border-top: 1px solid var(--aptly-border); }
.application-status-card dt { color: var(--aptly-muted); font-size: .78rem; letter-spacing: .04em; text-transform: uppercase; }
.application-status-card dd { margin: 0; color: var(--aptly-ink); font-weight: 650; }
.status-human-note, .availability-guidance, .support-assurance { display: flex; gap: .75rem; padding: 1rem; border-radius: var(--aptly-radius); background: #ecfdf5; }
.status-human-note > span, .availability-guidance > span, .support-assurance > span { display: grid; width: 1.75rem; height: 1.75rem; flex: 0 0 auto; place-items: center; border-radius: 50%; background: var(--aptly-evergreen); color: #fff; font-size: .75rem; font-weight: 800; }
.status-human-note strong, .availability-guidance strong, .support-assurance strong { color: #065f46; font-size: .84rem; }
.status-human-note small, .availability-guidance small, .support-assurance small { margin-top: .2rem; color: #477166; line-height: 1.45; }
.application-status-once { display: flex; gap: 1rem; padding: 1.25rem; border: 1px solid #bfdbfe; border-radius: var(--aptly-radius-lg); background: var(--aptly-primary-soft); }
.application-status-once > span { color: var(--aptly-primary); font-size: 1.4rem; }
.application-status-once h2 { margin: 0; font-size: 1rem; }
.application-status-once p { margin: .35rem 0 0; color: var(--aptly-muted); font-size: .84rem; line-height: 1.5; }
.availability-summary { display: grid; grid-template-columns: repeat(3, 1fr); overflow: hidden; margin-bottom: 1rem; border: 1px solid var(--aptly-border); border-radius: var(--aptly-radius); }
.availability-summary > div { padding: .9rem; }
.availability-summary > div + div { border-left: 1px solid var(--aptly-border); }
.availability-summary span, .availability-summary strong { display: block; }
.availability-summary span { color: var(--aptly-muted); font-size: .68rem; font-weight: 750; letter-spacing: .05em; text-transform: uppercase; }
.availability-summary strong { margin-top: .3rem; font-size: .85rem; }
.availability-guidance { margin-bottom: 1.25rem; background: var(--aptly-primary-soft); }
.availability-guidance > span { background: var(--aptly-primary); }
.availability-guidance strong { color: #1e3a8a; }
.availability-guidance small { color: #52698e; }
.availability-slots { display: grid; gap: .65rem; }
.availability-slot { display: flex; align-items: flex-start; gap: .85rem; padding: 1rem; border: 1px solid var(--aptly-border); border-radius: var(--aptly-radius); background: #fff; cursor: pointer; transition: border-color .18s ease, transform .18s ease, box-shadow .18s ease; }
.availability-slot:hover, .availability-slot:focus-within { border-color: rgb(37 99 235 / .45); box-shadow: 0 8px 20px rgb(15 23 42 / .07); transform: translateY(-1px); }
.availability-slot input:checked ~ i { background: var(--aptly-primary); color: #fff; }
.availability-slot > span { flex: 1; }
.availability-slot strong, .availability-slot small { display: block; }
.availability-slot small { margin-top: .25rem; color: var(--aptly-muted); }
.availability-slot i { display: grid; width: 1.5rem; height: 1.5rem; place-items: center; border-radius: 50%; background: #e2e8f0; color: transparent; font-size: .7rem; font-style: normal; }
.candidate-empty-state, .candidate-completion-state { padding: 2.5rem 1.25rem; border: 1px dashed var(--aptly-border); border-radius: var(--aptly-radius-lg); background: #f8fafc; text-align: center; }
.candidate-empty-state > span, .candidate-completion-state > span { display: grid; width: 3rem; height: 3rem; margin: 0 auto 1rem; place-items: center; border-radius: 50%; background: var(--aptly-primary-soft); color: var(--aptly-primary); font-size: 1.15rem; font-weight: 800; }
.candidate-completion-state > span { background: #d1fae5; color: var(--aptly-evergreen); }
.candidate-empty-state h2, .candidate-completion-state h2 { font-size: 1.2rem; }
.candidate-empty-state p, .candidate-completion-state p { max-width: 30rem; margin: .5rem auto 1rem; color: var(--aptly-muted); }
.candidate-request-form { display: grid; gap: 1rem; margin-top: 1.25rem; }
.withdraw-warning { display: flex; gap: .9rem; padding: 1rem; border: 1px solid #fcd34d; border-radius: var(--aptly-radius); background: #fffbeb; }
.withdraw-warning > span { display: grid; width: 1.75rem; height: 1.75rem; flex: 0 0 auto; place-items: center; border-radius: 50%; background: #d97706; color: #fff; font-weight: 800; }
.withdraw-warning h2 { margin: 0; font-size: .95rem; }
.withdraw-warning p { margin: .3rem 0 0; color: #795a28; font-size: .84rem; }
.withdraw-confirm { display: flex; gap: .75rem; padding: 1rem; border: 1px solid #fecaca; border-radius: var(--aptly-radius); background: #fef2f2; }
.withdraw-confirm strong, .withdraw-confirm small { display: block; }
.withdraw-confirm small { margin-top: .25rem; color: var(--aptly-muted); }
.browser-requirements { display: grid; gap: .5rem; }
.browser-requirements span { padding: .7rem .85rem; border-radius: .6rem; background: #eef2f7; color: var(--aptly-slate); font-size: .82rem; font-weight: 650; }

/* Section 37: secure interview journey */
.candidate-role-summary { display: grid; grid-template-columns: 1.4fr 1fr; overflow: hidden; border: 1px solid var(--aptly-border); border-radius: var(--aptly-radius-lg); background: linear-gradient(135deg, #f8fafc, var(--aptly-primary-soft)); }
.candidate-role-summary > div { padding: 1.15rem; }
.candidate-role-summary > div + div { border-left: 1px solid var(--aptly-border); }
.candidate-role-summary span, .candidate-role-summary strong, .candidate-role-summary small { display: block; }
.candidate-role-summary span { color: var(--aptly-muted); font-size: .68rem; font-weight: 750; letter-spacing: .06em; text-transform: uppercase; }
.candidate-role-summary strong { margin-top: .3rem; color: var(--aptly-ink); font-size: 1rem; }
.candidate-role-summary small { margin-top: .2rem; color: var(--aptly-muted); }
.preparation-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: .75rem; margin-top: 1rem; }
.preparation-grid article { position: relative; padding: 1rem; border-radius: var(--aptly-radius); background: #f8fafc; }
.preparation-grid article > span, .instruction-grid article > span { display: grid; width: 2.25rem; height: 2.25rem; place-items: center; border: 1px solid var(--aptly-border); border-radius: 50%; background: #fff; color: var(--aptly-primary); font-weight: 800; }
.preparation-grid h3 { margin: .8rem 0 0; font-size: .9rem; }
.preparation-grid p { margin: .4rem 0 0; color: var(--aptly-muted); font-size: .78rem; line-height: 1.5; }
.candidate-actions { display: flex; flex-wrap: wrap; align-items: center; gap: .65rem; margin-top: 1.25rem; padding-top: 1.25rem; border-top: 1px solid var(--aptly-border); }
.consent-intro, .readiness-permission, .monitoring-disclosure, .ready-summary { display: flex; gap: .8rem; padding: 1rem; border-radius: var(--aptly-radius); background: var(--aptly-primary-soft); }
.consent-intro > span, .readiness-permission > span, .monitoring-disclosure > span, .ready-summary > span { display: grid; width: 1.9rem; height: 1.9rem; flex: 0 0 auto; place-items: center; border-radius: 50%; background: var(--aptly-primary); color: #fff; font-size: .78rem; font-weight: 800; }
.consent-intro p, .readiness-permission p, .monitoring-disclosure p { margin: 0; }
.consent-intro strong, .consent-intro small, .readiness-permission strong, .readiness-permission small, .monitoring-disclosure strong, .monitoring-disclosure small { display: block; }
.consent-intro strong, .readiness-permission strong, .monitoring-disclosure strong { color: #1e3a8a; font-size: .86rem; }
.consent-intro small, .readiness-permission small, .monitoring-disclosure small { margin-top: .2rem; color: #52698e; line-height: 1.5; }
.consent-list { display: grid; gap: .6rem; margin-top: 1rem; }
.consent-item { display: flex; align-items: flex-start; gap: .8rem; padding: .9rem 1rem; border: 1px solid var(--aptly-border); border-radius: var(--aptly-radius); background: #fff; cursor: pointer; transition: border-color .18s ease, background .18s ease; }
.consent-item:hover, .consent-item:focus-within { border-color: rgb(37 99 235 / .45); background: #f8fbff; }
.consent-item > span { flex: 1; }
.consent-item strong, .consent-item small { display: block; }
.consent-item strong { color: var(--aptly-ink); font-size: .87rem; }
.consent-item small { margin-top: .2rem; color: var(--aptly-muted); line-height: 1.45; }
.consent-item i { display: grid; width: 1.5rem; height: 1.5rem; place-items: center; border-radius: 50%; background: #e2e8f0; color: transparent; font-size: .7rem; font-style: normal; }
.consent-item input:checked ~ i { background: var(--aptly-evergreen); color: #fff; }
.identity-assurance { display: flex; gap: 1rem; padding: 1.15rem; border: 1px solid var(--aptly-border); border-radius: var(--aptly-radius-lg); background: linear-gradient(135deg, #f8fafc, var(--aptly-primary-soft)); }
.identity-assurance > span { display: grid; width: 2.5rem; height: 2.5rem; flex: 0 0 auto; place-items: center; border-radius: .7rem; background: #fff; color: var(--aptly-primary); box-shadow: var(--aptly-shadow-sm); }
.identity-assurance h2 { margin: 0; font-size: 1rem; }
.identity-assurance p { margin: .35rem 0 0; color: var(--aptly-muted); font-size: .84rem; line-height: 1.5; }
.identity-confirm { display: flex; gap: .75rem; padding: 1rem; border: 1px solid #bfdbfe; border-radius: var(--aptly-radius); background: var(--aptly-primary-soft); }
.identity-confirm strong, .identity-confirm small { display: block; }
.identity-confirm small { margin-top: .25rem; color: var(--aptly-muted); }
.readiness-layout { display: grid; grid-template-columns: 1.25fr .75fr; gap: 1rem; margin-top: 1rem; }
.readiness-preview { position: relative; display: grid; min-height: 18rem; overflow: hidden; place-items: center; border-radius: var(--aptly-radius-lg); background: #081120; color: #fff; }
.readiness-preview video { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.readiness-preview > div { position: relative; z-index: 1; display: grid; place-items: center; padding: 1rem; text-align: center; }
.readiness-preview > div > span { display: grid; width: 3rem; height: 3rem; place-items: center; border-radius: 50%; background: rgb(255 255 255 / .1); }
.readiness-preview strong, .readiness-preview small { display: block; }
.readiness-preview strong { margin-top: .8rem; }
.readiness-preview small { max-width: 16rem; margin-top: .3rem; color: rgb(255 255 255 / .58); }
.readiness-check-list { display: grid; gap: .5rem; }
.readiness-check-list > div { display: flex; align-items: center; justify-content: space-between; gap: .5rem; padding: .75rem; border: 1px solid var(--aptly-border); border-radius: .65rem; background: #fff; color: var(--aptly-muted); font-size: .78rem; }
.readiness-check-list strong { font-size: .72rem; }
.readiness-check-list [data-status="ready"] { border-color: #a7f3d0; background: #ecfdf5; }
.readiness-check-list [data-status="ready"] strong { color: var(--aptly-evergreen); }
.readiness-check-list [data-status="blocked"], .readiness-check-list [data-status="failed"] { border-color: #fecaca; background: #fef2f2; }
.readiness-check-list [data-status="blocked"] strong, .readiness-check-list [data-status="failed"] strong { color: #dc2626; }
.readiness-status { margin: 1rem 0 0; color: var(--aptly-muted); font-size: .82rem; }
.instruction-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: .75rem; }
.instruction-grid article { padding: 1rem; border: 1px solid var(--aptly-border); border-radius: var(--aptly-radius); background: #f8fafc; }
.instruction-grid h2 { margin: .75rem 0 0; font-size: .92rem; }
.instruction-grid p { margin: .35rem 0 0; color: var(--aptly-muted); font-size: .8rem; line-height: 1.5; }
.monitoring-disclosure { margin-top: 1rem; background: #fffbeb; }
.monitoring-disclosure > span { background: #d97706; }
.monitoring-disclosure strong { color: #78350f; }
.monitoring-disclosure small { color: #80633a; }
.ready-summary { align-items: center; border: 1px solid #a7f3d0; background: #ecfdf5; }
.ready-summary > span { width: 2.5rem; height: 2.5rem; background: var(--aptly-evergreen); }
.ready-summary h2 { margin: 0; color: #065f46; font-size: 1.05rem; }
.ready-summary p { margin: .3rem 0 0; color: #477166; font-size: .84rem; }
.continuation-card { margin-top: 1rem; padding: 1.15rem; border: 1px solid var(--aptly-border); border-radius: var(--aptly-radius-lg); background: #f8fafc; }
.continuation-card > div:first-child { display: flex; gap: .8rem; }
.continuation-card > div:first-child > span { color: var(--aptly-primary); font-size: 1.25rem; }
.continuation-card h2 { margin: 0; font-size: .95rem; }
.continuation-card p { margin: .3rem 0 .9rem; color: var(--aptly-muted); font-size: .8rem; }
.continuation-result { margin-top: 1rem; }
.interview-status-bar { display: flex; align-items: center; gap: .5rem; margin-bottom: 1rem; padding: .65rem .8rem; border: 1px solid #a7f3d0; border-radius: var(--aptly-radius); background: #ecfdf5; color: #477166; font-size: .78rem; }
.interview-status-bar strong { margin-left: auto; color: #065f46; font-variant-numeric: tabular-nums; }
.connection-indicator { width: .55rem; height: .55rem; border-radius: 50%; background: #10b981; box-shadow: 0 0 0 4px rgb(16 185 129 / .12); }
.interview-recorder { overflow: hidden; border: 1px solid var(--aptly-border); border-radius: var(--aptly-radius-lg); }
.interview-video-wrap { position: relative; min-height: 18rem; background: #081120; }
.interview-video-wrap video { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.recording-badge { position: absolute; top: .8rem; left: .8rem; padding: .35rem .65rem; border-radius: 999px; background: rgb(15 23 42 / .8); color: #fff; font-size: .68rem; font-weight: 750; }
.recording-badge.is-recording::before { display: inline-block; width: .45rem; height: .45rem; margin-right: .35rem; content: ""; border-radius: 50%; background: #ef4444; }
.recorder-controls { display: flex; align-items: center; justify-content: space-between; gap: 1rem; padding: 1rem; background: #fff; }
.recorder-controls strong { font-size: .86rem; }
.recorder-controls p { margin: .2rem 0 0; color: var(--aptly-muted); font-size: .76rem; }
.interview-question-meta { display: flex; align-items: center; gap: .8rem; margin-top: 1rem; color: var(--aptly-muted); font-size: .74rem; font-weight: 750; }
.question-progress { height: .4rem; flex: 1; overflow: hidden; border-radius: 999px; background: #e2e8f0; }
.question-progress i { display: block; height: 100%; border-radius: inherit; background: linear-gradient(90deg, var(--aptly-primary), #34d399); }
.interview-question { margin-top: 1rem; padding: 1.4rem; border-radius: var(--aptly-radius-lg); background: linear-gradient(135deg, #081120, #172b49); color: #fff; }
.interview-question .eyebrow { color: #93c5fd; }
.interview-question h2 { margin: .6rem 0 0; font-size: clamp(1.25rem, 3vw, 1.75rem); }
.interview-question > p:last-child { margin: .65rem 0 0; color: rgb(255 255 255 / .62); font-size: .82rem; }
.answer-counter { display: flex; justify-content: space-between; margin-top: .35rem; color: var(--aptly-muted); font-size: .72rem; }
.completion-next { margin: 1rem 0; }
.completion-next > h2 { font-size: 1rem; }
.completion-next > div { display: grid; grid-template-columns: repeat(3, 1fr); gap: .65rem; }
.completion-next article { display: flex; gap: .6rem; padding: .85rem; border: 1px solid var(--aptly-border); border-radius: var(--aptly-radius); }
.completion-next article > span { display: grid; width: 1.6rem; height: 1.6rem; flex: 0 0 auto; place-items: center; border-radius: .45rem; background: var(--aptly-primary-soft); color: var(--aptly-primary); font-size: .7rem; font-weight: 800; }
.completion-next p { margin: 0; }
.completion-next strong, .completion-next small { display: block; }
.completion-next strong { font-size: .78rem; }
.completion-next small { margin-top: .25rem; color: var(--aptly-muted); font-size: .7rem; line-height: 1.4; }

@media (max-width: 991.98px) {
    .journey-panel, .candidate-experience-panel, .employer-overview-panel { grid-template-columns: 1fr; }
    .candidate-experience-intro { position: static; }
    .employer-image-wrap { min-height: 24rem; }
    .role-card-grid { grid-template-columns: repeat(2, 1fr); }
    .employer-capability-grid { grid-template-columns: repeat(2, 1fr); }
    .employer-evidence-panel { grid-template-columns: 1fr; }
    .employer-evidence-image { min-height: 22rem; }
    .hiring-path-steps { grid-template-columns: repeat(3, 1fr); }
    .role-search-primary { grid-template-columns: 1fr 1fr; }
    .role-search-primary .btn { grid-column: 1 / -1; }
    .job-title-grid { grid-template-columns: 1fr; }
    .job-ready-card { display: none; }
    .job-detail-layout { grid-template-columns: 1fr; }
    .job-apply-aside { display: none; }
    .job-mobile-apply { position: fixed; z-index: 1035; right: 0; bottom: 0; left: 0; display: flex; align-items: center; justify-content: space-between; gap: 1rem; padding: .75rem 1rem; border-top: 1px solid var(--aptly-border); background: rgb(255 255 255 / .96); box-shadow: 0 -12px 30px rgb(15 23 42 / .1); backdrop-filter: blur(12px); }
    .job-mobile-apply span, .job-mobile-apply small { display: block; }
    .job-mobile-apply small { color: var(--aptly-muted); }
    .application-title-grid { grid-template-columns: 1fr; }
    .application-title-grid > aside { display: none; }
    .application-layout { grid-template-columns: 1fr; }
    .candidate-card-header { flex-direction: column; }
    .candidate-progress-card { width: 100%; }
    .readiness-layout { grid-template-columns: 1fr; }
}

@media (max-width: 575.98px) {
    .marketing-hero, .marketing-hero-content { min-height: 39rem; }
    .marketing-hero-copy > p { font-size: 1rem; }
    .journey-panel, .candidate-experience-panel, .employer-overview-panel, .marketing-cta { border-radius: var(--aptly-radius-lg); }
    .feature-grid, .candidate-proof-grid, .role-card-grid { grid-template-columns: 1fr; }
    .feature-grid article:last-child { grid-column: auto; }
    .employer-image-wrap { min-height: 18rem; }
    .employer-capability-grid, .employer-audience-grid { grid-template-columns: 1fr; }
    .hiring-path-steps { grid-template-columns: repeat(2, 1fr); }
    .role-search-primary, .role-search-filters, .marketplace-grid, .company-role-grid { grid-template-columns: 1fr; }
    .role-results-heading { align-items: start; flex-direction: column; }
    .job-process-grid { grid-template-columns: 1fr; }
    .application-form-row, .status-access-card form { grid-template-columns: 1fr; }
    .availability-summary { grid-template-columns: 1fr; }
    .availability-summary > div + div { border-top: 1px solid var(--aptly-border); border-left: 0; }
    .application-status-card dl > div { grid-template-columns: 1fr; gap: .25rem; }
    .candidate-role-summary, .preparation-grid, .instruction-grid, .completion-next > div { grid-template-columns: 1fr; }
    .candidate-role-summary > div + div { border-top: 1px solid var(--aptly-border); border-left: 0; }
    .recorder-controls { align-items: flex-start; flex-direction: column; }
}

/* Progressive enhancement: content stays visible until JavaScript arms it. */
[data-scroll-reveal] {
    --aptly-reveal-x: 0;
    --aptly-reveal-y: 1.5rem;
    --aptly-reveal-scale: 1;
    opacity: 1;
    transform: translate3d(0, 0, 0) scale(1);
    transition: opacity .7s ease-out, transform .7s ease-out;
    transition-delay: var(--aptly-reveal-delay, 0ms);
}

[data-scroll-reveal="left"] { --aptly-reveal-x: -2rem; --aptly-reveal-y: 0; }
[data-scroll-reveal="right"] { --aptly-reveal-x: 2rem; --aptly-reveal-y: 0; }
[data-scroll-reveal="scale"] { --aptly-reveal-y: .75rem; --aptly-reveal-scale: .98; }

[data-scroll-reveal].is-reveal-armed:not(.is-reveal-visible) {
    opacity: 0;
    transform: translate3d(var(--aptly-reveal-x), var(--aptly-reveal-y), 0) scale(var(--aptly-reveal-scale));
}

[data-scroll-reveal].is-reveal-visible {
    opacity: 1;
    transform: translate3d(0, 0, 0) scale(1);
}

@media (prefers-reduced-motion: reduce) {
    .public-header { transition: none; }
    .public-header.is-hidden { pointer-events: auto; opacity: 1; transform: none; }
    [data-scroll-reveal] {
        opacity: 1 !important;
        transform: none !important;
        transition: none !important;
    }
}
