:root {
    color-scheme: light;
    --color-ink: #111614;
    --color-ink-2: #202522;
    --color-muted: #5e6966;
    --color-surface: #ffffff;
    --color-page: #f4f5f1;
    --color-soft: #ecefeb;
    --color-line: #d9ded7;
    --color-gold: #c8a33a;
    --color-gold-dark: #806724;
    --color-blue: #4d6668;
    --color-teal: #2f777c;
    --color-danger: #7b4934;
    --color-steel: #263231;
    --color-graphite: #0f1413;
    --shadow-soft: 0 18px 48px rgba(17, 22, 20, 0.11);
    --shadow-card: 0 12px 28px rgba(17, 22, 20, 0.08);
    --radius-sm: 6px;
    --radius-md: 8px;
    --container: 1200px;
    --font-base: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Arial, sans-serif;
}

* {
    box-sizing: border-box;
}

html {
    scroll-behavior: smooth;
}

main section[id],
.service-category-panel,
.anchor-offset,
.payroll-plan-grid,
.contact-form[id] {
    scroll-margin-top: 104px;
}

.anchor-offset {
    display: block;
    width: 1px;
    height: 1px;
    overflow: hidden;
}

body {
    margin: 0;
    min-height: 100vh;
    background: linear-gradient(180deg, #f7f7f3 0%, var(--color-page) 100%);
    color: var(--color-ink);
    font-family: var(--font-base);
    line-height: 1.55;
    text-rendering: optimizeLegibility;
    -webkit-font-smoothing: antialiased;
}

body.nav-open {
    overflow: hidden;
}

img {
    display: block;
    max-width: 100%;
}

a {
    color: inherit;
}

h1,
h2,
h3 {
    text-wrap: balance;
}

p,
li {
    text-wrap: pretty;
}

button,
input,
select,
textarea {
    font: inherit;
}

button {
    cursor: pointer;
}

.container {
    width: min(100% - 40px, var(--container));
    margin: 0 auto;
}

.site-header {
    position: sticky;
    top: 0;
    z-index: 50;
    background: rgba(255, 255, 255, 0.97);
    border-bottom: 1px solid rgba(217, 222, 215, 0.9);
    backdrop-filter: blur(16px);
}

.header-inner {
    display: flex;
    width: min(100% - 40px, var(--container));
    min-height: 82px;
    align-items: center;
    justify-content: space-between;
    gap: 28px;
    margin: 0 auto;
}

.brand,
.footer-logo {
    text-decoration: none;
}

.brand {
    display: inline-flex;
    align-items: center;
    min-width: 92px;
}

.brand-logo {
    display: grid;
    width: 88px;
    height: 56px;
    place-items: center;
    overflow: hidden;
}

.brand-logo img {
    width: 94px;
    height: 62px;
    object-fit: contain;
}

.site-nav,
.nav-list,
.header-actions,
.language-switch {
    display: flex;
    align-items: center;
}

.site-nav {
    flex: 1;
    justify-content: space-between;
    gap: 18px;
}

.nav-list {
    gap: 4px;
    margin: 0;
    padding: 0;
    list-style: none;
}

.nav-item {
    position: relative;
}

.has-submenu::after {
    position: absolute;
    top: 100%;
    right: 0;
    left: 0;
    display: block;
    height: 12px;
    content: "";
}

.nav-link {
    display: inline-flex;
    min-height: 42px;
    align-items: center;
    padding: 0 12px;
    border: 0;
    background: transparent;
    color: #2e3835;
    border-radius: var(--radius-sm);
    font-size: 0.88rem;
    font-weight: 700;
    text-decoration: none;
    white-space: nowrap;
}

.nav-link:hover,
.nav-link:focus-visible,
.has-submenu:focus-within .nav-dropdown-toggle,
.has-submenu:hover .nav-dropdown-toggle {
    background: var(--color-soft);
    color: var(--color-ink);
    outline: none;
}

.nav-dropdown-toggle::after {
    width: 6px;
    height: 6px;
    margin-left: 8px;
    border-right: 2px solid currentColor;
    border-bottom: 2px solid currentColor;
    content: "";
    transform: rotate(45deg) translateY(-2px);
}

.nav-panel {
    position: absolute;
    top: calc(100% + 12px);
    left: 0;
    display: grid;
    width: 320px;
    padding: 10px;
    background: var(--color-surface);
    border: 1px solid var(--color-line);
    border-radius: var(--radius-md);
    box-shadow: var(--shadow-soft);
    opacity: 0;
    pointer-events: none;
    transform: translateY(8px);
    transition: opacity 160ms ease, transform 160ms ease;
}

.has-submenu:hover .nav-panel,
.has-submenu:focus-within .nav-panel {
    opacity: 1;
    pointer-events: auto;
    transform: translateY(0);
}

.nav-panel a {
    padding: 11px 12px;
    color: var(--color-muted);
    border-radius: var(--radius-sm);
    font-size: 0.92rem;
    font-weight: 650;
    text-decoration: none;
}

.nav-panel a:hover,
.nav-panel a:focus-visible {
    background: var(--color-soft);
    color: var(--color-ink);
    outline: none;
}

.header-actions {
    gap: 12px;
}

.language-switch {
    min-height: 38px;
    padding: 4px;
    border: 1px solid var(--color-line);
    border-radius: var(--radius-sm);
    background: #f8f8f4;
    color: var(--color-muted);
    font-size: 0.8rem;
    font-weight: 800;
}

.language-switch a,
.language-switch span {
    display: inline-grid;
    min-width: 34px;
    min-height: 28px;
    place-items: center;
    border-radius: 4px;
    text-decoration: none;
}

.language-switch span {
    background: var(--color-ink);
    color: #ffffff;
}

.nav-toggle {
    display: none;
    min-height: 42px;
    align-items: center;
    gap: 9px;
    padding: 0 12px;
    border: 1px solid var(--color-line);
    background: var(--color-surface);
    border-radius: var(--radius-sm);
    color: var(--color-ink);
    font-weight: 800;
}

.nav-toggle-lines,
.nav-toggle-lines::before,
.nav-toggle-lines::after {
    display: block;
    width: 18px;
    height: 2px;
    background: currentColor;
    content: "";
}

.nav-toggle-lines {
    position: relative;
}

.nav-toggle-lines::before,
.nav-toggle-lines::after {
    position: absolute;
    left: 0;
}

.nav-toggle-lines::before {
    top: -6px;
}

.nav-toggle-lines::after {
    top: 6px;
}

main {
    overflow: hidden;
}

.hero {
    position: relative;
    min-height: 700px;
    overflow: hidden;
    background: var(--color-graphite);
    color: #ffffff;
}

.hero-backdrop {
    position: absolute;
    inset: 0;
    background:
        linear-gradient(90deg, rgba(15, 20, 19, 0.96), rgba(32, 37, 34, 0.82) 45%, rgba(32, 37, 34, 0.48) 100%),
        linear-gradient(0deg, rgba(15, 20, 19, 0.68), rgba(15, 20, 19, 0.12) 48%, rgba(15, 20, 19, 0.56)),
        url("../img/home-hero-recruitment.jpg"),
        linear-gradient(90deg, rgba(15, 20, 19, 0.98), rgba(32, 37, 34, 0.9) 54%, rgba(77, 102, 104, 0.58)),
        linear-gradient(90deg, rgba(255, 255, 255, 0.045) 1px, transparent 1px),
        linear-gradient(0deg, rgba(255, 255, 255, 0.045) 1px, transparent 1px),
        var(--color-graphite);
    background-position: center, center, center right, center, center, center, center;
    background-size: auto, auto, cover, auto, 64px 64px, 64px 64px, auto;
}

.hero-backdrop::after {
    content: none;
}

.hero-inner {
    position: relative;
    z-index: 1;
    display: grid;
    width: min(100% - 40px, var(--container));
    min-height: 700px;
    align-items: center;
    gap: 44px;
    grid-template-columns: minmax(0, 1fr) 410px;
    margin: 0 auto;
    padding: 84px 0 104px;
}

.hero-copy {
    max-width: 760px;
}

.eyebrow {
    margin: 0 0 14px;
    color: var(--color-gold);
    font-size: 0.78rem;
    font-weight: 900;
    letter-spacing: 0;
    text-transform: uppercase;
}

.hero h1,
.section-heading h2,
.feature-band h2 {
    margin: 0;
    font-weight: 850;
    letter-spacing: 0;
}

.hero h1 {
    max-width: 820px;
    font-size: 2.62rem;
    line-height: 1.08;
    overflow-wrap: anywhere;
}

.hero-lead {
    max-width: 660px;
    margin: 24px 0 0;
    color: rgba(255, 255, 255, 0.84);
    font-size: 1.12rem;
}

.hero-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 12px;
    margin-top: 34px;
}

.home-stats-section {
    position: relative;
    z-index: 1;
    margin-top: -6px;
    padding: 28px 0 72px;
    background:
        linear-gradient(180deg, rgba(255, 255, 255, 0.78), rgba(244, 245, 241, 0.98)),
        var(--color-page);
}

.home-stats-heading {
    width: 100%;
    max-width: none;
    margin-bottom: 24px;
}

.home-stats-heading h2 {
    margin: 0;
    color: var(--color-ink);
    font-size: 2.08rem;
    font-weight: 850;
    line-height: 1.08;
}

.home-hero-stats {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 14px;
}

.home-hero-stat {
    position: relative;
    display: grid;
    gap: 7px;
    min-height: 132px;
    align-content: start;
    overflow: hidden;
    padding: 16px;
    background:
        linear-gradient(180deg, rgba(47, 119, 124, 0.07), rgba(255, 255, 255, 0)),
        var(--color-surface);
    border: 1px solid var(--color-line);
    border-radius: var(--radius-md);
    box-shadow: var(--shadow-card);
}

.home-hero-stat::before {
    position: absolute;
    inset: 0 0 auto;
    height: 5px;
    background: linear-gradient(90deg, var(--color-gold), var(--color-teal));
    content: "";
}

.home-hero-stat::after {
    position: absolute;
    right: 16px;
    bottom: 12px;
    width: 42%;
    height: 7px;
    background:
        linear-gradient(90deg, rgba(200, 163, 58, 0.88), rgba(47, 119, 124, 0.78)),
        var(--color-soft);
    border-radius: 999px;
    content: "";
    opacity: 0.78;
}

.home-hero-stat strong {
    position: relative;
    z-index: 1;
    color: var(--color-teal);
    font-size: 1.82rem;
    font-weight: 950;
    line-height: 0.95;
}

.home-hero-stat h3 {
    position: relative;
    z-index: 1;
    max-width: 24ch;
    margin: 0;
    color: var(--color-ink);
    font-size: 0.76rem;
    font-weight: 900;
    line-height: 1.2;
    text-transform: uppercase;
}

.home-hero-stat p {
    position: relative;
    z-index: 1;
    margin: 0;
    color: var(--color-muted);
    font-size: 0.78rem;
    line-height: 1.35;
}

.home-hero-stat-featured {
    grid-column: span 2;
    min-height: 0;
    grid-template-columns: minmax(94px, 0.28fr) minmax(0, 1fr);
    column-gap: 14px;
    background:
        radial-gradient(circle at top right, rgba(200, 163, 58, 0.22), transparent 38%),
        linear-gradient(135deg, rgba(47, 119, 124, 0.12), rgba(255, 255, 255, 0)),
        var(--color-surface);
    border-color: rgba(47, 119, 124, 0.28);
}

.home-hero-stat-featured strong {
    grid-row: span 3;
    align-self: start;
    font-size: 2.72rem;
}

.home-hero-stat-featured h3,
.home-hero-stat-featured p,
.home-hero-stat-featured .home-hero-stat-chips {
    grid-column: 2;
}

.home-hero-stat-chips {
    position: relative;
    z-index: 1;
    display: flex;
    flex-wrap: wrap;
    gap: 7px;
    margin-top: 2px;
}

.home-hero-stat-chips span {
    display: inline-flex;
    min-height: 28px;
    align-items: center;
    padding: 5px 7px;
    background: rgba(47, 119, 124, 0.08);
    color: var(--color-ink-2);
    border: 1px solid rgba(47, 119, 124, 0.18);
    border-radius: 999px;
    font-size: 0.68rem;
    font-weight: 800;
    line-height: 1.15;
}

.button {
    display: inline-flex;
    min-height: 46px;
    align-items: center;
    justify-content: center;
    padding: 0 18px;
    border: 1px solid transparent;
    border-radius: var(--radius-sm);
    font-size: 0.9rem;
    font-weight: 850;
    text-decoration: none;
    transition: background 160ms ease, border-color 160ms ease, color 160ms ease, transform 160ms ease;
}

.button:hover,
.button:focus-visible {
    outline: none;
    transform: translateY(-1px);
}

.button-primary {
    background: var(--color-gold);
    color: var(--color-ink);
}

.button-primary:hover,
.button-primary:focus-visible {
    background: #d7b342;
}

.button-secondary {
    border-color: rgba(255, 255, 255, 0.46);
    color: #ffffff;
}

.button-secondary:hover,
.button-secondary:focus-visible {
    background: rgba(255, 255, 255, 0.12);
}

.button-small {
    min-height: 38px;
    padding: 0 14px;
    font-size: 0.82rem;
}

.hero-search,
.contact-form {
    display: grid;
    gap: 14px;
    padding: 22px;
    border-radius: var(--radius-md);
}

.hero-search {
    align-self: end;
    margin-bottom: 28px;
    background: rgba(255, 255, 255, 0.94);
    color: var(--color-ink);
    box-shadow: 0 24px 70px rgba(0, 0, 0, 0.24);
}

.search-intro {
    display: grid;
    gap: 3px;
    padding-bottom: 8px;
    border-bottom: 1px solid var(--color-line);
}

.search-intro span,
.card-kicker,
.audience-link span,
.process-list span,
.footer-column h2 {
    color: var(--color-gold-dark);
    font-size: 0.76rem;
    font-weight: 900;
    letter-spacing: 0;
    text-transform: uppercase;
}

.search-intro strong {
    font-size: 1.15rem;
}

label {
    display: grid;
    gap: 6px;
    color: #31555a;
    font-size: 0.86rem;
    font-weight: 800;
}

input,
select,
textarea {
    width: 100%;
    min-height: 46px;
    padding: 0 13px;
    border: 1px solid #cfd8d2;
    background: #ffffff;
    border-radius: var(--radius-sm);
    color: var(--color-ink);
    outline: none;
}

textarea {
    min-height: 120px;
    padding-top: 12px;
    resize: vertical;
}

input:focus,
select:focus,
textarea:focus {
    border-color: var(--color-teal);
    box-shadow: 0 0 0 3px rgba(47, 119, 124, 0.13);
}

.audience-section {
    position: relative;
    z-index: 2;
    margin-top: -56px;
    padding-bottom: 34px;
}

.audience-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 16px;
}

.audience-link {
    display: grid;
    gap: 8px;
    min-height: 142px;
    align-content: center;
    padding: 24px;
    background: var(--color-surface);
    border: 1px solid var(--color-line);
    border-left: 5px solid var(--color-gold);
    border-radius: var(--radius-md);
    box-shadow: var(--shadow-card);
    text-decoration: none;
}

.audience-link strong {
    max-width: 520px;
    font-size: 1.16rem;
    line-height: 1.35;
}

.section {
    padding: 84px 0;
}

.section-heading {
    width: 100%;
    max-width: none;
}

.section-heading h2,
.feature-band h2 {
    color: var(--color-ink);
    font-size: 2.62rem;
    line-height: 1.08;
    overflow-wrap: anywhere;
}

.section-heading p:not(.eyebrow),
.feature-band p,
.service-card p,
.exclusive-card p,
.process-list p,
.footer-brand p,
.footer-column p {
    color: var(--color-muted);
}

.section-heading p:not(.eyebrow) {
    max-width: 760px;
    margin: 18px 0 0;
    font-size: 1.06rem;
}

.service-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 20px;
    margin-top: 38px;
}

.service-card,
.exclusive-card,
.industry-card,
.process-list article {
    background: var(--color-surface);
    border: 1px solid var(--color-line);
    border-radius: var(--radius-md);
}

.service-card {
    display: grid;
    overflow: hidden;
    box-shadow: var(--shadow-card);
}

.card-media {
    position: relative;
    min-height: 180px;
    overflow: hidden;
    background:
        linear-gradient(135deg, rgba(17, 22, 20, 0.84), rgba(77, 102, 104, 0.62)),
        repeating-linear-gradient(90deg, rgba(255, 255, 255, 0.14) 0 1px, transparent 1px 24px),
        var(--color-blue);
}

.card-media img {
    width: 100%;
    height: 100%;
    min-height: inherit;
    object-fit: cover;
    transform: scale(1.02);
}

.card-media::after {
    position: absolute;
    inset: 0;
    background: linear-gradient(180deg, rgba(15, 20, 19, 0.02), rgba(15, 20, 19, 0.22));
    content: "";
    pointer-events: none;
}

.card-media-alt {
    background:
        linear-gradient(135deg, rgba(38, 50, 49, 0.86), rgba(200, 163, 58, 0.28)),
        repeating-linear-gradient(0deg, rgba(255, 255, 255, 0.13) 0 1px, transparent 1px 22px),
        var(--color-steel);
}

.card-media-soft {
    background:
        linear-gradient(135deg, rgba(200, 163, 58, 0.58), rgba(77, 102, 104, 0.5)),
        repeating-linear-gradient(135deg, rgba(255, 255, 255, 0.15) 0 1px, transparent 1px 26px),
        #b79437;
}

.service-card-content {
    display: grid;
    gap: 12px;
    padding: 24px;
}

.service-card h3,
.exclusive-card h3,
.industry-card h3,
.process-list h3 {
    margin: 0;
    color: var(--color-ink);
    font-size: 1.35rem;
    line-height: 1.22;
}

.service-card p,
.exclusive-card p,
.process-list p {
    margin: 0;
}

.service-card a,
.exclusive-card a {
    color: var(--color-teal);
    font-weight: 850;
    text-decoration: none;
}

.service-card a:hover,
.exclusive-card a:hover {
    text-decoration: underline;
}

.hero-directory-panel {
    display: grid;
    gap: 14px;
}

.directory-panel-link {
    display: grid;
    gap: 4px;
    padding: 14px;
    background: #ffffff;
    border: 1px solid var(--color-line);
    border-radius: var(--radius-sm);
    color: var(--color-ink);
    text-decoration: none;
}

.directory-panel-link span {
    color: var(--color-gold-dark);
    font-size: 0.72rem;
    font-weight: 900;
    text-transform: uppercase;
}

.directory-panel-link strong {
    font-size: 1rem;
}

.directory-panel-link:hover,
.directory-panel-link:focus-visible {
    border-color: rgba(47, 119, 124, 0.5);
    box-shadow: 0 10px 22px rgba(17, 22, 20, 0.08);
    outline: none;
}

.service-directory-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 20px;
    margin-top: 42px;
}

.directory-card {
    position: relative;
    display: grid;
    grid-template-rows: auto auto auto auto minmax(0, 1fr) auto;
    min-height: 438px;
    gap: 14px;
    overflow: hidden;
    padding: 24px;
    background:
        linear-gradient(180deg, rgba(47, 119, 124, 0.06), rgba(255, 255, 255, 0) 42%),
        var(--color-surface);
    border: 1px solid rgba(217, 222, 215, 0.95);
    border-radius: var(--radius-md);
    box-shadow: var(--shadow-card);
    transition: border-color 160ms ease, box-shadow 160ms ease, transform 160ms ease;
}

.directory-card::before {
    position: absolute;
    inset: 0 0 auto;
    height: 5px;
    background: linear-gradient(90deg, var(--color-gold), var(--color-teal));
    content: "";
}

.directory-card:hover,
.directory-card:focus-within {
    border-color: rgba(47, 119, 124, 0.38);
    box-shadow: 0 18px 42px rgba(17, 22, 20, 0.13);
    transform: translateY(-2px);
}

.directory-card:first-child,
.service-directory-grid-candidates .directory-card:first-child {
    background:
        linear-gradient(135deg, rgba(200, 163, 58, 0.13), rgba(47, 119, 124, 0.08) 48%, rgba(255, 255, 255, 0) 100%),
        var(--color-surface);
    border-color: rgba(200, 163, 58, 0.48);
}

.directory-card-media {
    position: relative;
    height: 138px;
    margin: -24px -24px 4px;
    overflow: hidden;
    background: var(--color-soft);
}

.directory-card-media::after {
    position: absolute;
    inset: auto 0 0;
    height: 42%;
    background: linear-gradient(180deg, rgba(15, 20, 19, 0), rgba(15, 20, 19, 0.22));
    content: "";
    pointer-events: none;
}

.directory-card-media img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transform: scale(1.01);
    transition: transform 220ms ease;
}

.directory-card:hover .directory-card-media img,
.directory-card:focus-within .directory-card-media img {
    transform: scale(1.045);
}

.directory-card-top {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 14px;
}

.directory-card-top span {
    color: var(--color-gold-dark);
    font-size: 0.74rem;
    font-weight: 900;
    text-transform: uppercase;
}

.directory-card-top b {
    display: inline-grid;
    width: 42px;
    height: 42px;
    flex: 0 0 auto;
    place-items: center;
    background: #f3f5f1;
    color: var(--color-teal);
    border: 1px solid var(--color-line);
    border-radius: 999px;
    font-size: 0.92rem;
    line-height: 1;
}

.directory-card-meta {
    width: fit-content;
    margin: 0;
    padding: 6px 10px;
    background: rgba(200, 163, 58, 0.14);
    color: var(--color-gold-dark);
    border-radius: var(--radius-sm);
    font-size: 0.78rem;
    font-weight: 850;
    line-height: 1.2;
}

.directory-card h3 {
    margin: 0;
    color: var(--color-ink);
    font-size: 1.42rem;
    line-height: 1.16;
    overflow-wrap: anywhere;
}

.directory-card p:not(.directory-card-meta) {
    margin: 0;
    color: var(--color-muted);
    font-size: 0.98rem;
}

.directory-card-cta {
    display: inline-flex;
    min-height: 48px;
    height: 48px;
    width: fit-content;
    align-items: center;
    justify-content: center;
    align-self: end;
    margin-top: 4px;
    padding: 0 14px;
    background: var(--color-ink);
    color: #ffffff;
    border-radius: var(--radius-sm);
    font-weight: 850;
    line-height: 1.15;
    text-align: center;
    text-decoration: none;
}

.directory-card-cta::after {
    margin-left: 10px;
    content: ">";
}

.directory-card-cta:hover,
.directory-card-cta:focus-visible {
    background: var(--color-teal);
    text-decoration: none;
    outline: none;
}

.section-industries {
    background: #ffffff;
}

.split-layout {
    display: grid;
    align-items: start;
    gap: 50px;
    grid-template-columns: 0.9fr 1.1fr;
}

.industry-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 14px;
}

.sector-demand-panel {
    display: grid;
    gap: 18px;
    margin-top: 30px;
    padding: 22px;
    background:
        linear-gradient(135deg, rgba(47, 119, 124, 0.12), rgba(200, 163, 58, 0.12)),
        var(--color-page);
    border: 1px solid rgba(217, 222, 215, 0.95);
    border-radius: var(--radius-md);
}

.sector-demand-heading {
    display: flex;
    align-items: start;
    justify-content: space-between;
    gap: 14px;
}

.sector-demand-panel h3 {
    margin: 0;
    color: var(--color-ink);
    font-size: 1.22rem;
    line-height: 1.22;
}

.sector-demand-heading > span {
    flex: 0 0 auto;
    max-width: 150px;
    padding: 7px 10px;
    background: #ffffff;
    color: var(--color-gold-dark);
    border: 1px solid var(--color-line);
    border-radius: 999px;
    font-size: 0.68rem;
    font-weight: 900;
    line-height: 1.15;
    text-align: center;
    text-transform: uppercase;
}

.sector-demand-list {
    display: grid;
    gap: 10px;
    margin: 0;
    padding: 0;
    list-style: none;
    counter-reset: sector-demand;
}

.sector-demand-list li {
    position: relative;
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(104px, 0.34fr);
    gap: 14px;
    min-height: 82px;
    align-items: center;
    padding: 14px;
    padding-left: 58px;
    background: rgba(255, 255, 255, 0.82);
    border: 1px solid rgba(217, 222, 215, 0.9);
    border-radius: var(--radius-md);
    counter-increment: sector-demand;
}

.sector-demand-list li::before {
    position: absolute;
    top: 16px;
    left: 14px;
    display: inline-grid;
    width: 32px;
    height: 32px;
    place-items: center;
    background: var(--color-ink);
    color: #ffffff;
    border: 1px solid rgba(255, 255, 255, 0.5);
    border-radius: 999px;
    content: counter(sector-demand);
    font-size: 0.82rem;
    font-weight: 900;
    line-height: 1;
}

.sector-demand-item-copy {
    display: grid;
    gap: 4px;
}

.sector-demand-item-copy strong {
    color: var(--color-ink);
    font-size: 0.98rem;
    line-height: 1.25;
}

.sector-demand-item-copy span {
    color: var(--color-muted);
    font-size: 0.92rem;
    line-height: 1.45;
}

.sector-demand-meter {
    display: grid;
    gap: 7px;
}

.sector-demand-meter-label {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
}

.sector-demand-meter-label span {
    color: var(--color-gold-dark);
    font-size: 0.68rem;
    font-weight: 900;
    line-height: 1;
    text-transform: uppercase;
}

.sector-demand-meter-label b {
    color: var(--color-teal);
    font-size: 1rem;
    font-weight: 950;
    line-height: 1;
}

.sector-demand-meter i {
    position: relative;
    display: block;
    height: 10px;
    overflow: hidden;
    background: rgba(217, 222, 215, 0.95);
    border-radius: 999px;
}

.sector-demand-meter i::before {
    position: absolute;
    inset: 0 auto 0 0;
    width: var(--demand-level);
    background: linear-gradient(90deg, var(--color-teal), var(--color-gold));
    border-radius: inherit;
    content: "";
}

.sector-demand-note {
    margin: 0;
    padding: 12px 14px;
    background: rgba(255, 255, 255, 0.72);
    color: var(--color-muted);
    border: 1px solid rgba(217, 222, 215, 0.9);
    border-radius: var(--radius-sm);
    font-size: 0.82rem;
    line-height: 1.48;
}

.sector-proof-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 12px;
    margin-top: 18px;
}

.sector-proof-grid article {
    position: relative;
    display: grid;
    gap: 8px;
    min-height: 118px;
    align-content: start;
    overflow: hidden;
    padding: 18px;
    padding-top: 22px;
    background:
        linear-gradient(180deg, rgba(47, 119, 124, 0.07), rgba(255, 255, 255, 0)),
        var(--color-surface);
    border: 1px solid var(--color-line);
    border-radius: var(--radius-md);
    box-shadow: var(--shadow-card);
}

.sector-proof-grid article::before {
    position: absolute;
    inset: 0 0 auto;
    height: 5px;
    background: linear-gradient(90deg, var(--color-gold), var(--color-teal));
    content: "";
}

.sector-proof-grid article:nth-child(1) {
    background:
        radial-gradient(circle at top right, rgba(200, 163, 58, 0.2), transparent 42%),
        linear-gradient(180deg, rgba(47, 119, 124, 0.08), rgba(255, 255, 255, 0)),
        var(--color-surface);
}

.sector-proof-grid strong {
    color: var(--color-teal);
    font-size: 1.72rem;
    font-weight: 900;
    line-height: 1;
}

.sector-proof-grid span {
    color: var(--color-muted);
    font-size: 0.86rem;
    font-weight: 650;
    line-height: 1.35;
}

.industry-card {
    display: grid;
    min-height: 138px;
    align-content: start;
    gap: 12px;
    padding: 20px;
}

.industry-card span {
    display: inline-grid;
    width: 48px;
    height: 34px;
    place-items: center;
    background: var(--color-soft);
    color: var(--color-teal);
    border-radius: var(--radius-sm);
    font-size: 0.78rem;
    font-weight: 900;
}

.industry-card .industry-icon,
.expertise-modal-icon {
    display: inline-grid;
    width: 48px;
    height: 48px;
    place-items: center;
    background: var(--color-soft);
    color: var(--color-teal);
    border: 1px solid var(--color-line);
    border-radius: var(--radius-sm);
}

.industry-card .industry-icon {
    margin-bottom: 2px;
}

.expertise-icon-svg {
    width: 26px;
    height: 26px;
}

.industry-card h3 {
    font-size: 1.16rem;
}

.industry-card p {
    margin: 0;
    color: var(--color-muted);
    font-size: 0.92rem;
}

.industry-card .button {
    align-self: end;
    width: fit-content;
    margin-top: 4px;
}

.expertise-modal {
    width: min(920px, calc(100% - 32px));
    max-height: min(84vh, 760px);
    margin: auto;
    padding: 0;
    overflow: hidden;
    background: var(--color-surface);
    border: 1px solid var(--color-line);
    border-radius: var(--radius-md);
    box-shadow: 0 28px 80px rgba(0, 0, 0, 0.28);
    color: var(--color-ink);
}

.expertise-modal::backdrop {
    background: rgba(15, 20, 19, 0.68);
    backdrop-filter: blur(3px);
}

.expertise-modal-inner {
    display: grid;
    gap: 20px;
    max-height: inherit;
    overflow-y: auto;
    padding: 28px;
}

.expertise-modal-header {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 18px;
    padding-bottom: 18px;
    border-bottom: 1px solid var(--color-line);
}

.expertise-modal-header h3 {
    margin: 0;
    color: var(--color-ink);
    font-size: 2rem;
    line-height: 1.1;
}

.expertise-modal-header > div {
    display: grid;
    gap: 12px;
}

.expertise-modal-close {
    display: inline-flex;
    min-height: 38px;
    align-items: center;
    justify-content: center;
    padding: 0 14px;
    background: var(--color-soft);
    border: 1px solid var(--color-line);
    border-radius: var(--radius-sm);
    color: var(--color-ink);
    font-size: 0.84rem;
    font-weight: 850;
}

.expertise-modal-close:hover,
.expertise-modal-close:focus-visible {
    border-color: var(--color-teal);
    outline: none;
}

.expertise-modal-summary {
    max-width: 720px;
    margin: 0;
    color: var(--color-muted);
    font-size: 1rem;
}

.expertise-modal-grid {
    display: grid;
    gap: 14px;
    grid-template-columns: repeat(2, minmax(0, 1fr));
}

.expertise-modal-group {
    display: grid;
    gap: 12px;
    align-content: start;
    padding: 18px;
    background: var(--color-page);
    border: 1px solid var(--color-line);
    border-radius: var(--radius-md);
}

.expertise-modal-group h4 {
    margin: 0;
    color: var(--color-ink);
    font-size: 1rem;
    line-height: 1.2;
}

.expertise-modal-group ul {
    display: grid;
    gap: 7px;
    margin: 0;
    padding-left: 18px;
    color: var(--color-muted);
    font-size: 0.9rem;
}

.expertise-modal-group a {
    color: inherit;
    text-decoration: none;
}

.expertise-modal-group a:hover,
.expertise-modal-group a:focus-visible {
    color: var(--color-teal);
    text-decoration: underline;
    text-underline-offset: 3px;
    outline: none;
}

.section-featured {
    background: var(--color-soft);
}

.feature-band {
    display: grid;
    align-items: center;
    gap: 42px;
    grid-template-columns: 0.82fr 1.18fr;
    padding: 42px;
    background: #ffffff;
    border: 1px solid var(--color-line);
    border-radius: var(--radius-md);
    box-shadow: var(--shadow-card);
}

.feature-band-copy p:not(.eyebrow) {
    margin: 18px 0 0;
}

.exclusive-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 16px;
}

.exclusive-card {
    display: grid;
    gap: 14px;
    min-height: 280px;
    align-content: start;
    padding: 24px;
}

.badge {
    display: inline-flex;
    width: fit-content;
    min-height: 30px;
    align-items: center;
    padding: 0 10px;
    background: rgba(200, 163, 58, 0.16);
    color: #715b00;
    border: 1px solid rgba(200, 163, 58, 0.36);
    border-radius: 999px;
    font-size: 0.75rem;
    font-weight: 900;
    text-transform: uppercase;
}

.section-process {
    background: var(--color-ink);
    color: #ffffff;
}

.section-process .section-heading h2 {
    color: #ffffff;
}

.section-process .section-heading p:not(.eyebrow) {
    color: rgba(255, 255, 255, 0.72);
}

.process-layout {
    display: grid;
    gap: 46px;
    grid-template-columns: 0.85fr 1.15fr;
}

.process-list {
    display: grid;
    gap: 14px;
}

.process-list article {
    display: grid;
    gap: 9px;
    padding: 22px;
    background: rgba(255, 255, 255, 0.08);
    border-color: rgba(255, 255, 255, 0.16);
}

.process-list h3 {
    color: #ffffff;
}

.process-list p {
    color: rgba(255, 255, 255, 0.72);
}

.section-contact {
    background: #ffffff;
}

.contact-layout {
    display: grid;
    align-items: start;
    gap: 58px;
    grid-template-columns: 0.9fr 1.1fr;
}

.contact-form {
    background: var(--color-page);
    border: 1px solid var(--color-line);
    box-shadow: var(--shadow-card);
}

.page-hero {
    position: relative;
    overflow: hidden;
    background:
        linear-gradient(90deg, rgba(15, 20, 19, 0.98), rgba(32, 37, 34, 0.92) 58%, rgba(77, 102, 104, 0.66)),
        linear-gradient(90deg, rgba(255, 255, 255, 0.045) 1px, transparent 1px),
        linear-gradient(0deg, rgba(255, 255, 255, 0.045) 1px, transparent 1px),
        var(--color-graphite);
    background-size: auto, 64px 64px, 64px 64px, auto;
    color: #ffffff;
}

.page-hero::after {
    position: absolute;
    right: 5vw;
    bottom: -120px;
    width: 360px;
    height: 360px;
    border: 1px solid rgba(255, 255, 255, 0.16);
    background:
        linear-gradient(135deg, rgba(200, 163, 58, 0.16), rgba(255, 255, 255, 0.035)),
        repeating-linear-gradient(135deg, rgba(255, 255, 255, 0.09) 0 1px, transparent 1px 26px);
    border-radius: var(--radius-md);
    content: "";
    transform: rotate(8deg);
}

.page-hero-catalogue {
    background:
        linear-gradient(90deg, rgba(15, 20, 19, 0.98), rgba(47, 119, 124, 0.74) 60%, rgba(200, 163, 58, 0.22)),
        linear-gradient(90deg, rgba(255, 255, 255, 0.045) 1px, transparent 1px),
        linear-gradient(0deg, rgba(255, 255, 255, 0.045) 1px, transparent 1px),
        var(--color-graphite);
    background-size: auto, 64px 64px, 64px 64px, auto;
}

.page-hero-services {
    background:
        linear-gradient(90deg, rgba(15, 20, 19, 0.98), rgba(32, 37, 34, 0.9) 50%, rgba(15, 20, 19, 0.28)),
        url("../img/hero-recrutement-gradient.jpg"),
        linear-gradient(90deg, rgba(255, 255, 255, 0.045) 1px, transparent 1px),
        linear-gradient(0deg, rgba(255, 255, 255, 0.045) 1px, transparent 1px),
        var(--color-ink);
    background-position: center, center right, center, center, center;
    background-size: auto, cover, 64px 64px, 64px 64px, auto;
}

.page-hero-solutions {
    background:
        linear-gradient(90deg, rgba(15, 20, 19, 0.98), rgba(32, 37, 34, 0.92) 56%, rgba(77, 102, 104, 0.62)),
        linear-gradient(90deg, rgba(255, 255, 255, 0.045) 1px, transparent 1px),
        linear-gradient(0deg, rgba(255, 255, 255, 0.045) 1px, transparent 1px),
        var(--color-graphite);
    background-size: auto, 64px 64px, 64px 64px, auto;
}

.page-hero-sectors {
    background:
        linear-gradient(90deg, rgba(15, 20, 19, 0.98), rgba(32, 37, 34, 0.9) 50%, rgba(15, 20, 19, 0.28)),
        url("../img/hero-secteurs-activite-gradient.jpg"),
        linear-gradient(90deg, rgba(255, 255, 255, 0.045) 1px, transparent 1px),
        linear-gradient(0deg, rgba(255, 255, 255, 0.045) 1px, transparent 1px),
        var(--color-graphite);
    background-position: center, center right, center, center, center;
    background-size: auto, cover, 64px 64px, 64px 64px, auto;
}

.page-hero-translation {
    background:
        linear-gradient(90deg, rgba(15, 20, 19, 0.98), rgba(32, 37, 34, 0.9) 50%, rgba(15, 20, 19, 0.3)),
        url("../img/hero-services-traduction-gradient.jpg"),
        linear-gradient(90deg, rgba(255, 255, 255, 0.045) 1px, transparent 1px),
        linear-gradient(0deg, rgba(255, 255, 255, 0.045) 1px, transparent 1px),
        var(--color-graphite);
    background-position: center, center right, center, center, center;
    background-size: auto, cover, 64px 64px, 64px 64px, auto;
}

.page-hero-externalization {
    background:
        linear-gradient(90deg, rgba(15, 20, 19, 0.98), rgba(32, 37, 34, 0.9) 50%, rgba(15, 20, 19, 0.3)),
        url("../img/service-externalisation.jpg"),
        linear-gradient(90deg, rgba(255, 255, 255, 0.045) 1px, transparent 1px),
        linear-gradient(0deg, rgba(255, 255, 255, 0.045) 1px, transparent 1px),
        var(--color-graphite);
    background-position: center, center right, center, center, center;
    background-size: auto, cover, 64px 64px, 64px 64px, auto;
}

.remote-savings-card {
    background: rgba(255, 255, 255, 0.94);
}

.remote-hero-math {
    display: grid;
    gap: 10px;
}

.remote-hero-math div {
    display: grid;
    gap: 4px;
    padding: 14px;
    background: var(--color-page);
    border: 1px solid var(--color-line);
    border-radius: var(--radius-sm);
}

.remote-hero-math span {
    color: var(--color-muted);
    font-size: 0.72rem;
    font-weight: 900;
    text-transform: uppercase;
}

.remote-hero-math b {
    color: var(--color-ink);
    font-size: 1.3rem;
    line-height: 1;
}

.remote-hero-math .remote-hero-savings {
    background: #e8f4ec;
    border-color: rgba(35, 121, 72, 0.3);
}

.remote-hero-math .remote-hero-savings b {
    color: #237948;
}

.page-hero-international {
    background:
        linear-gradient(90deg, rgba(15, 20, 19, 0.98), rgba(47, 119, 124, 0.74) 54%, rgba(77, 102, 104, 0.58)),
        url("../img/service-workers-industry.jpg"),
        linear-gradient(90deg, rgba(255, 255, 255, 0.045) 1px, transparent 1px),
        linear-gradient(0deg, rgba(255, 255, 255, 0.045) 1px, transparent 1px),
        var(--color-graphite);
    background-position: center, center right, center, center, center;
    background-size: auto, cover, 64px 64px, 64px 64px, auto;
}

.employer-anchor-nav {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    margin-top: 18px;
}

.employer-anchor-nav a {
    display: inline-flex;
    min-height: 38px;
    align-items: center;
    padding: 0 13px;
    background: rgba(255, 255, 255, 0.12);
    border: 1px solid rgba(255, 255, 255, 0.22);
    border-radius: var(--radius-sm);
    color: #ffffff;
    font-size: 0.84rem;
    font-weight: 850;
    text-decoration: none;
}

.employer-anchor-nav a:hover,
.employer-anchor-nav a:focus-visible {
    background: rgba(200, 163, 58, 0.24);
    border-color: rgba(200, 163, 58, 0.58);
    outline: none;
}

.page-hero-consultation {
    background:
        linear-gradient(90deg, rgba(15, 20, 19, 0.98), rgba(77, 102, 104, 0.82) 55%, rgba(15, 20, 19, 0.28)),
        url("../img/service-immigration.jpg"),
        linear-gradient(90deg, rgba(255, 255, 255, 0.045) 1px, transparent 1px),
        linear-gradient(0deg, rgba(255, 255, 255, 0.045) 1px, transparent 1px),
        var(--color-graphite);
    background-position: center, center right, center, center, center;
    background-size: auto, cover, 64px 64px, 64px 64px, auto;
}

.page-hero-payroll {
    background:
        linear-gradient(90deg, rgba(15, 20, 19, 0.98), rgba(31, 43, 41, 0.9) 48%, rgba(47, 119, 124, 0.48)),
        url("../img/payroll-hero.jpg"),
        linear-gradient(90deg, rgba(255, 255, 255, 0.045) 1px, transparent 1px),
        linear-gradient(0deg, rgba(255, 255, 255, 0.045) 1px, transparent 1px),
        var(--color-graphite);
    background-position: center, center right, center, center, center;
    background-size: auto, cover, 64px 64px, 64px 64px, auto;
}

.page-hero-transport {
    background:
        linear-gradient(90deg, rgba(15, 20, 19, 0.98), rgba(31, 43, 41, 0.88) 48%, rgba(47, 119, 124, 0.42)),
        url("../img/transport-hero.jpg"),
        linear-gradient(90deg, rgba(255, 255, 255, 0.045) 1px, transparent 1px),
        linear-gradient(0deg, rgba(255, 255, 255, 0.045) 1px, transparent 1px),
        var(--color-graphite);
    background-position: center, center right, center, center, center;
    background-size: auto, cover, 64px 64px, 64px 64px, auto;
}

.page-hero-candidates {
    background:
        linear-gradient(90deg, rgba(15, 20, 19, 0.98), rgba(47, 119, 124, 0.76) 55%, rgba(200, 163, 58, 0.18)),
        url("../img/service-office-consultation.jpg"),
        linear-gradient(90deg, rgba(255, 255, 255, 0.045) 1px, transparent 1px),
        linear-gradient(0deg, rgba(255, 255, 255, 0.045) 1px, transparent 1px),
        var(--color-graphite);
    background-position: center, center right, center, center, center;
    background-size: auto, cover, 64px 64px, 64px 64px, auto;
}

.page-hero-jobs {
    background:
        linear-gradient(90deg, rgba(15, 20, 19, 0.98), rgba(32, 37, 34, 0.92) 54%, rgba(47, 119, 124, 0.7)),
        linear-gradient(90deg, rgba(255, 255, 255, 0.045) 1px, transparent 1px),
        linear-gradient(0deg, rgba(255, 255, 255, 0.045) 1px, transparent 1px),
        var(--color-ink);
    background-size: auto, 64px 64px, 64px 64px, auto;
}

.page-hero-registration {
    background:
        linear-gradient(90deg, rgba(15, 20, 19, 0.98), rgba(32, 37, 34, 0.9) 50%, rgba(15, 20, 19, 0.28)),
        url("../img/hero-candidate-registration-gradient.jpg"),
        linear-gradient(90deg, rgba(255, 255, 255, 0.045) 1px, transparent 1px),
        linear-gradient(0deg, rgba(255, 255, 255, 0.045) 1px, transparent 1px),
        var(--color-graphite);
    background-position: center, center right, center, center, center;
    background-size: auto, cover, 64px 64px, 64px 64px, auto;
}

.page-hero-about {
    background:
        linear-gradient(90deg, rgba(15, 20, 19, 0.98), rgba(32, 37, 34, 0.92) 56%, rgba(200, 163, 58, 0.22)),
        linear-gradient(90deg, rgba(255, 255, 255, 0.045) 1px, transparent 1px),
        linear-gradient(0deg, rgba(255, 255, 255, 0.045) 1px, transparent 1px),
        var(--color-graphite);
    background-size: auto, 64px 64px, 64px 64px, auto;
}

.page-hero-contact {
    background:
        linear-gradient(90deg, rgba(15, 20, 19, 0.98), rgba(47, 119, 124, 0.74) 54%, rgba(77, 102, 104, 0.68)),
        linear-gradient(90deg, rgba(255, 255, 255, 0.045) 1px, transparent 1px),
        linear-gradient(0deg, rgba(255, 255, 255, 0.045) 1px, transparent 1px),
        var(--color-ink);
    background-size: auto, 64px 64px, 64px 64px, auto;
}

.page-hero-faq {
    background:
        linear-gradient(90deg, rgba(15, 20, 19, 0.98), rgba(31, 43, 41, 0.9) 50%, rgba(47, 119, 124, 0.42)),
        url("../img/service-office-consultation.jpg"),
        linear-gradient(90deg, rgba(255, 255, 255, 0.045) 1px, transparent 1px),
        linear-gradient(0deg, rgba(255, 255, 255, 0.045) 1px, transparent 1px),
        var(--color-graphite);
    background-position: center, center right, center, center, center;
    background-size: auto, cover, 64px 64px, 64px 64px, auto;
}

.page-hero-legal {
    background:
        linear-gradient(90deg, rgba(15, 20, 19, 0.98), rgba(38, 50, 49, 0.9) 56%, rgba(200, 163, 58, 0.24)),
        linear-gradient(90deg, rgba(255, 255, 255, 0.045) 1px, transparent 1px),
        linear-gradient(0deg, rgba(255, 255, 255, 0.045) 1px, transparent 1px),
        var(--color-graphite);
    background-size: auto, 64px 64px, 64px 64px, auto;
}

.page-hero-legal::after {
    content: none;
}

.page-hero-legal .page-hero-grid {
    align-items: center;
    grid-template-columns: minmax(0, 1fr);
}

.page-hero-grid {
    position: relative;
    z-index: 1;
    display: grid;
    align-items: start;
    gap: 54px;
    grid-template-columns: minmax(0, 1fr) 390px;
    min-height: 510px;
    padding: 66px 0 72px;
}

.page-hero-compact-visual .page-hero-grid {
    align-items: start;
    gap: 42px;
    min-height: 0;
    padding: 48px 0 52px;
}

.page-hero-copy {
    max-width: 820px;
}

.page-hero h1 {
    max-width: 860px;
    margin: 0;
    color: #ffffff;
    font-size: 2.62rem;
    font-weight: 850;
    letter-spacing: 0;
    line-height: 1.08;
    overflow-wrap: anywhere;
}

.page-hero p:not(.eyebrow) {
    max-width: 700px;
    margin: 22px 0 0;
    color: rgba(255, 255, 255, 0.78);
    font-size: 1.06rem;
}

.breadcrumb {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin-bottom: 28px;
    color: rgba(255, 255, 255, 0.66);
    font-size: 0.84rem;
    font-weight: 800;
}

.breadcrumb a,
.breadcrumb span {
    display: inline-flex;
    align-items: center;
    text-decoration: none;
}

.breadcrumb a::after {
    margin-left: 8px;
    color: rgba(255, 255, 255, 0.38);
    content: "/";
}

.breadcrumb a:hover {
    color: #ffffff;
}

.hero-insight-card {
    display: grid;
    gap: 16px;
    padding: 24px;
    background: rgba(255, 255, 255, 0.94);
    color: var(--color-ink);
    border: 1px solid rgba(255, 255, 255, 0.38);
    border-radius: var(--radius-md);
    box-shadow: 0 24px 70px rgba(0, 0, 0, 0.2);
}

.service-visual-card {
    align-content: start;
    gap: 0;
    overflow: hidden;
    padding: 0;
    max-width: 390px;
}

.service-hero-visual {
    position: relative;
    height: 148px;
    margin: 0;
    overflow: hidden;
    background: var(--color-steel);
}

.service-hero-visual img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.service-hero-visual::after {
    position: absolute;
    inset: 0;
    background: linear-gradient(180deg, rgba(15, 20, 19, 0), rgba(15, 20, 19, 0.16));
    content: "";
}

.service-visual-content {
    display: grid;
    gap: 12px;
    padding: 18px;
}

.service-visual-content > span {
    color: var(--color-gold-dark);
    font-size: 0.76rem;
    font-weight: 900;
    text-transform: uppercase;
}

.service-visual-content > strong {
    font-size: 1.06rem;
    line-height: 1.22;
}

.service-visual-content .insight-list {
    gap: 7px;
}

.service-visual-content .insight-list p {
    padding: 9px 10px;
    font-size: 0.84rem;
    line-height: 1.38;
}

.service-visual-content .savings-comparison {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 8px;
    margin-top: 0;
}

.service-visual-content .savings-comparison div {
    padding: 10px;
}

.service-visual-content .savings-comparison span {
    font-size: 0.66rem;
}

.service-visual-content .savings-comparison strong {
    font-size: 1.12rem;
}

.hero-insight-card > span {
    color: var(--color-gold-dark);
    font-size: 0.76rem;
    font-weight: 900;
    text-transform: uppercase;
}

.hero-insight-card > strong {
    font-size: 1.42rem;
    line-height: 1.22;
}

.insight-list {
    display: grid;
    gap: 10px;
}

.insight-list p {
    margin: 0;
    padding: 12px;
    background: var(--color-page);
    border: 1px solid var(--color-line);
    border-radius: var(--radius-sm);
    color: var(--color-muted);
    font-size: 0.93rem;
}

.page-hero .insight-list p {
    margin: 0;
    color: var(--color-muted);
    font-size: 0.93rem;
}

.insight-list b {
    color: var(--color-teal);
}

.pathway-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 18px;
    margin-top: 38px;
}

.pathway-card {
    display: grid;
    gap: 14px;
    min-height: 270px;
    align-content: start;
    padding: 24px;
    background: var(--color-surface);
    border: 1px solid var(--color-line);
    border-radius: var(--radius-md);
    box-shadow: var(--shadow-card);
    text-decoration: none;
}

.pathway-card span {
    display: inline-grid;
    width: 42px;
    height: 34px;
    place-items: center;
    background: var(--color-soft);
    color: var(--color-teal);
    border-radius: var(--radius-sm);
    font-size: 0.8rem;
    font-weight: 900;
}

.pathway-card h3,
.mini-profile h3,
.talent-card h3,
.governance-list h3,
.service-option h3,
.comparison-grid h3,
.solution-card h3,
.note-band h2,
.cta-strip h2 {
    margin: 0;
    color: var(--color-ink);
    line-height: 1.16;
}

.pathway-card h3 {
    font-size: 1.5rem;
}

.pathway-card p,
.mini-profile p,
.governance-list p,
.service-option p,
.service-detail-list,
.comparison-grid p,
.solution-card p,
.payroll-package-card p,
.note-band p {
    margin: 0;
    color: var(--color-muted);
}

.section-cta {
    width: fit-content;
    margin-top: 24px;
}

.mini-profile-stack {
    display: grid;
    gap: 14px;
}

.mini-profile {
    display: grid;
    gap: 8px;
    padding: 22px;
    background: var(--color-surface);
    border: 1px solid var(--color-line);
    border-left: 5px solid var(--color-gold);
    border-radius: var(--radius-md);
    box-shadow: var(--shadow-card);
}

.mini-profile span,
.talent-card-head span,
.service-priority,
.comparison-grid span {
    color: var(--color-gold-dark);
    font-size: 0.76rem;
    font-weight: 900;
    text-transform: uppercase;
}

.catalogue-toolbar {
    display: grid;
    align-items: end;
    gap: 22px;
    grid-template-columns: 1fr;
    margin-bottom: 30px;
}

.catalogue-toolbar h2 {
    margin: 0;
    font-size: 2.45rem;
    font-weight: 850;
    line-height: 1.08;
}

.filter-panel {
    display: grid;
    gap: 14px;
    grid-template-columns: repeat(6, minmax(0, 1fr)) auto;
    align-items: end;
    padding: 18px;
    background: var(--color-page);
    border: 1px solid var(--color-line);
    border-radius: var(--radius-md);
    box-shadow: var(--shadow-card);
}

.filter-panel .button,
.job-filter-panel .button {
    align-self: end;
}

.market-result-heading {
    display: grid;
    gap: 6px;
    margin: 0 0 18px;
}

.market-result-heading h2 {
    margin: 0;
    color: var(--color-ink);
    font-size: 1.7rem;
    line-height: 1.16;
}

.talent-grid {
    display: grid;
    align-items: stretch;
    grid-auto-rows: 1fr;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 20px;
    scroll-margin-top: 110px;
}

.talent-card {
    --catalogue-blue: var(--color-teal);
    --catalogue-blue-dark: var(--color-ink);
    --catalogue-panel: var(--color-soft);
    display: grid;
    height: 100%;
    grid-template-columns: 1fr;
    grid-template-rows: 1fr auto;
    overflow: hidden;
    padding: 0;
    background: var(--color-surface);
    border: 1px solid var(--color-line);
    border-radius: var(--radius-md);
    box-shadow: 0 16px 36px rgba(17, 22, 20, 0.09);
}

.talent-empty-state {
    grid-column: 1 / -1;
    display: grid;
    justify-items: start;
    gap: 12px;
    padding: 28px;
    background: var(--color-surface);
    border: 1px solid var(--color-line);
    border-radius: var(--radius-md);
}

.talent-empty-state h3,
.talent-empty-state p {
    margin: 0;
}

.talent-empty-state h3 {
    color: var(--color-ink);
    font-size: 1.35rem;
}

.talent-empty-state p {
    color: var(--color-muted);
}

.talent-profile {
    display: grid;
    gap: 18px;
    grid-template-rows: auto 1fr auto;
    padding: 24px;
}

.talent-profile-top {
    display: grid;
    align-items: start;
    gap: 16px;
    grid-template-columns: 82px minmax(0, 1fr);
}

.candidate-avatar {
    position: relative;
    width: 82px;
    aspect-ratio: 1;
    overflow: hidden;
    background: #e6e9e3;
    border-radius: 50%;
}

.candidate-avatar::before {
    position: absolute;
    top: 12px;
    left: 50%;
    width: 34px;
    height: 42px;
    background: #a9b1ad;
    border-radius: 44% 44% 38% 38%;
    content: "";
    transform: translateX(-50%);
}

.candidate-avatar::after {
    position: absolute;
    right: 12px;
    bottom: -7px;
    left: 12px;
    height: 36px;
    background: #a9b1ad;
    border-radius: 50% 50% 0 0;
    content: "";
}

.talent-summary {
    min-width: 0;
}

.talent-card-head {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 8px;
    margin-bottom: 8px;
}

.talent-card-head span {
    color: var(--catalogue-blue);
    letter-spacing: 0;
}

.talent-card-head strong {
    display: inline-flex;
    min-height: 24px;
    align-items: center;
    padding: 0 8px;
    background: rgba(47, 119, 124, 0.08);
    color: var(--catalogue-blue);
    border: 1px solid rgba(47, 119, 124, 0.22);
    border-radius: 999px;
    font-size: 0.7rem;
    font-weight: 850;
}

.talent-card h3 {
    margin: 0;
    color: var(--catalogue-blue-dark);
    font-size: 2rem;
    font-weight: 900;
    letter-spacing: 0;
    line-height: 0.95;
    overflow-wrap: anywhere;
}

.talent-role {
    margin: 8px 0 10px;
    color: var(--catalogue-blue);
    font-size: 0.95rem;
    font-weight: 900;
    letter-spacing: 0;
    line-height: 1.15;
}

.talent-location {
    display: grid;
    align-items: start;
    gap: 8px;
    grid-template-columns: 20px minmax(0, 1fr);
    margin: 0;
    color: var(--catalogue-blue-dark);
    font-size: 0.9rem;
    line-height: 1.34;
}

.candidate-id {
    display: inline-flex;
    min-height: 34px;
    align-items: center;
    gap: 6px;
    margin: 12px 0 0;
    padding: 0 10px;
    border: 1px solid var(--catalogue-blue);
    color: var(--catalogue-blue-dark);
    border-radius: var(--radius-sm);
    font-size: 0.86rem;
    font-weight: 650;
}

.candidate-id strong {
    color: var(--catalogue-blue);
    font-size: 0.96rem;
    font-weight: 900;
}

.candidate-availability {
    margin: 10px 0 0;
    color: var(--color-muted);
    font-size: 0.83rem;
    line-height: 1.35;
}

.candidate-availability strong {
    color: var(--catalogue-blue-dark);
    font-weight: 800;
}

.talent-highlights {
    display: grid;
    gap: 13px;
    padding-top: 16px;
    border-top: 1px solid var(--color-line);
}

.talent-highlight {
    display: grid;
    align-items: start;
    gap: 12px;
    grid-template-columns: 26px minmax(0, 1fr);
}

.talent-highlight p {
    margin: 0;
    color: var(--catalogue-blue-dark);
    font-size: 0.9rem;
    line-height: 1.42;
}

.talent-highlight strong {
    font-weight: 900;
}

.profile-svg {
    display: block;
    width: 1.15em;
    height: 1.15em;
    fill: none;
    stroke: currentColor;
    stroke-linecap: round;
    stroke-linejoin: round;
    stroke-width: 2;
}

.talent-highlight .profile-svg {
    width: 24px;
    height: 24px;
    color: var(--catalogue-blue);
    stroke-width: 1.75;
}

.talent-location .profile-svg {
    width: 19px;
    height: 19px;
    margin-top: 2px;
    color: var(--catalogue-blue);
}

.candidate-validation {
    display: grid;
    align-items: center;
    gap: 12px;
    grid-template-columns: 38px minmax(0, 1fr);
    padding: 14px;
    background: var(--color-soft);
    border-radius: var(--radius-md);
}

.candidate-validation .profile-svg {
    width: 34px;
    height: 34px;
    color: var(--catalogue-blue);
    stroke-width: 1.65;
}

.candidate-validation p {
    margin: 0;
    color: var(--catalogue-blue-dark);
    font-size: 0.86rem;
    line-height: 1.36;
}

.candidate-validation strong {
    display: block;
    color: var(--catalogue-blue);
    font-weight: 900;
}

.talent-confidential {
    display: grid;
    align-content: center;
    justify-items: center;
    gap: 16px;
    padding: 22px 24px;
    background: var(--catalogue-panel);
    border-top: 1px solid var(--color-line);
    text-align: center;
}

.talent-cv-visual {
    display: grid;
    width: 112px;
    place-items: center;
}

.talent-cv-visual svg {
    width: 100%;
    color: var(--catalogue-blue);
    fill: none;
    stroke: currentColor;
    stroke-linecap: round;
    stroke-linejoin: round;
    stroke-width: 6;
}

.talent-cv-visual rect {
    fill: var(--catalogue-blue);
}

.talent-cv-visual path:nth-of-type(3),
.talent-cv-visual path:nth-of-type(4),
.talent-cv-visual path:nth-of-type(6) {
    stroke: #95afb0;
}

.talent-confidential-copy h4 {
    margin: 0 0 8px;
    color: var(--catalogue-blue-dark);
    font-size: 1.15rem;
    line-height: 1.16;
}

.talent-confidential-copy p {
    max-width: 280px;
    margin: 0;
    color: #2e3835;
    font-size: 0.88rem;
    line-height: 1.42;
}

.talent-actions {
    display: grid;
    width: 100%;
    gap: 10px;
}

.talent-actions .button {
    width: 100%;
    min-height: 46px;
    gap: 10px;
    padding: 9px 12px;
    font-size: 0.84rem;
    line-height: 1.2;
}

.talent-actions .profile-svg {
    flex: 0 0 auto;
    width: 21px;
    height: 21px;
}

.talent-action-primary {
    background: var(--catalogue-blue);
    color: #ffffff;
    box-shadow: 0 10px 18px rgba(47, 119, 124, 0.18);
}

.talent-action-primary:hover,
.talent-action-primary:focus-visible {
    background: #285f63;
}

.talent-action-secondary {
    background: #ffffff;
    border-color: #95afb0;
    color: var(--catalogue-blue);
}

.talent-action-secondary:hover,
.talent-action-secondary:focus-visible {
    border-color: var(--catalogue-blue);
    background: var(--color-page);
}

.talent-action-whatsapp {
    background: #ffffff;
    border-color: #8ea9a9;
    color: var(--catalogue-blue);
}

.talent-action-whatsapp:hover,
.talent-action-whatsapp:focus-visible {
    border-color: var(--catalogue-blue);
    background: var(--color-page);
}

.talent-action-whatsapp .profile-svg {
    width: 26px;
    height: 26px;
}

.talent-confidential-note {
    display: grid;
    align-items: start;
    gap: 8px;
    grid-template-columns: 18px minmax(0, 1fr);
    max-width: 260px;
    margin: 2px 0 0;
    color: var(--catalogue-blue-dark);
    font-size: 0.82rem;
    line-height: 1.38;
    text-align: left;
}

.talent-confidential-note .profile-svg {
    width: 17px;
    height: 17px;
    margin-top: 2px;
}

.governance-grid {
    display: grid;
    align-items: start;
    gap: 42px;
    grid-template-columns: 0.85fr 1.15fr;
}

.governance-list {
    display: grid;
    gap: 14px;
}

.governance-list article {
    display: grid;
    gap: 8px;
    padding: 22px;
    background: var(--color-surface);
    border: 1px solid var(--color-line);
    border-radius: var(--radius-md);
}

.cta-strip {
    background: var(--color-ink);
    color: #ffffff;
}

.cta-strip-inner {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 28px;
    padding: 42px 0;
}

.cta-strip h2 {
    color: #ffffff;
    font-size: 2.2rem;
}

.service-option-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 18px;
    margin-top: 38px;
}

.service-option {
    display: grid;
    gap: 15px;
    min-height: 300px;
    align-content: start;
    padding: 24px;
    background: var(--color-surface);
    border: 1px solid var(--color-line);
    border-radius: var(--radius-md);
    box-shadow: var(--shadow-card);
}

.service-option-featured {
    border-color: rgba(200, 163, 58, 0.46);
    background: linear-gradient(180deg, rgba(200, 163, 58, 0.09), #ffffff 44%);
}

.service-option h3 {
    font-size: 1.55rem;
}

.commercial-rate {
    display: inline-flex;
    width: fit-content;
    min-height: 34px;
    align-items: center;
    padding: 0 10px;
    background: var(--color-soft);
    color: var(--color-teal);
    border-radius: var(--radius-sm);
    font-size: 0.9rem;
    font-weight: 900;
}

.service-detail-list {
    display: grid;
    gap: 7px;
    padding-left: 18px;
    font-size: 0.92rem;
}

.service-option a {
    align-self: end;
    color: var(--color-teal);
    font-weight: 850;
    text-decoration: none;
}

.service-option a:hover {
    text-decoration: underline;
}

.comparison-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 14px;
    margin-top: 34px;
}

.comparison-grid article {
    display: grid;
    gap: 12px;
    padding: 22px;
    background: var(--color-surface);
    border: 1px solid var(--color-line);
    border-radius: var(--radius-md);
}

.solution-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 20px;
    margin-top: 38px;
}

.solution-card {
    display: grid;
    gap: 18px;
    padding: 30px;
    background: var(--color-surface);
    border: 1px solid var(--color-line);
    border-radius: var(--radius-md);
    box-shadow: var(--shadow-card);
}

.solution-icon {
    display: inline-grid;
    width: 50px;
    height: 50px;
    place-items: center;
    background: var(--color-soft);
    color: var(--color-teal);
    border: 1px solid var(--color-line);
    border-radius: var(--radius-sm);
}

.solution-icon-svg {
    width: 27px;
    height: 27px;
}

.solution-card h3 {
    font-size: 1.7rem;
}

.solution-card ul {
    display: grid;
    gap: 8px;
    margin: 0;
    padding-left: 19px;
    color: var(--color-muted);
}

.process-list-light article {
    background: var(--color-surface);
    border-color: var(--color-line);
}

.process-list-light h3 {
    color: var(--color-ink);
}

.process-list-light p {
    color: var(--color-muted);
}

.note-band {
    display: grid;
    align-items: start;
    gap: 36px;
    grid-template-columns: minmax(0, 0.8fr) minmax(0, 1.2fr);
    padding: 34px;
    background: var(--color-surface);
    border: 1px solid var(--color-line);
    border-left: 5px solid var(--color-gold);
    border-radius: var(--radius-md);
    box-shadow: var(--shadow-card);
}

.note-band h2 {
    font-size: 2.2rem;
}

.note-band .button {
    width: fit-content;
}

.payroll-package-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 18px;
    margin-top: 34px;
}

.payroll-package-card {
    display: grid;
    gap: 12px;
    align-content: start;
    min-height: 250px;
    padding: 24px;
    background: var(--color-surface);
    border: 1px solid var(--color-line);
    border-radius: var(--radius-md);
    box-shadow: var(--shadow-card);
}

.payroll-package-card span {
    color: var(--color-gold-dark);
    font-size: 0.76rem;
    font-weight: 900;
    text-transform: uppercase;
}

.payroll-package-card h3 {
    margin: 0;
    color: var(--color-ink);
    font-size: 1.45rem;
    line-height: 1.16;
}

.payroll-package-card strong {
    color: var(--color-teal);
    font-weight: 900;
}

.payroll-hero-card {
    background: rgba(255, 255, 255, 0.94);
}

.payroll-risk-section {
    background:
        linear-gradient(90deg, rgba(15, 20, 19, 0.96), rgba(38, 50, 49, 0.86)),
        url("../img/payroll-compliance-risk.jpg"),
        var(--color-graphite);
    background-position: center, center;
    background-size: auto, cover;
    color: #ffffff;
}

.payroll-risk-band {
    display: grid;
    align-items: center;
    gap: 34px;
    grid-template-columns: minmax(0, 0.92fr) minmax(0, 1.08fr);
}

.payroll-risk-band h2 {
    max-width: 720px;
    margin: 0;
    color: #ffffff;
    font-size: 2.36rem;
    line-height: 1.12;
}

.payroll-risk-band p {
    max-width: 680px;
    margin: 16px 0 0;
    color: rgba(255, 255, 255, 0.78);
}

.payroll-risk-list {
    display: grid;
    gap: 14px;
    grid-template-columns: repeat(2, minmax(0, 1fr));
}

.payroll-risk-list article {
    min-height: 168px;
    padding: 20px;
    background: rgba(255, 255, 255, 0.94);
    border: 1px solid rgba(255, 255, 255, 0.24);
    border-left: 4px solid var(--color-gold);
    border-radius: var(--radius-md);
    box-shadow: 0 18px 42px rgba(0, 0, 0, 0.18);
}

.payroll-risk-list span,
.payroll-plan-card > span {
    color: var(--color-gold-dark);
    font-size: 0.76rem;
    font-weight: 900;
    text-transform: uppercase;
}

.payroll-risk-list p {
    margin: 10px 0 0;
    color: var(--color-muted);
    font-size: 0.94rem;
}

.payroll-service-visual-grid {
    display: grid;
    gap: 18px;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    margin-top: 34px;
}

.payroll-service-visual-card {
    display: grid;
    overflow: hidden;
    min-height: 440px;
    align-content: start;
    background: var(--color-surface);
    border: 1px solid var(--color-line);
    border-radius: var(--radius-md);
    box-shadow: var(--shadow-card);
}

.payroll-service-visual-card figure {
    position: relative;
    height: 190px;
    margin: 0;
    overflow: hidden;
    background: var(--color-steel);
}

.payroll-service-visual-card figure::after {
    position: absolute;
    inset: 0;
    background: linear-gradient(180deg, rgba(15, 20, 19, 0), rgba(15, 20, 19, 0.28));
    content: "";
}

.payroll-service-visual-card img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.payroll-service-visual-card div {
    display: grid;
    gap: 12px;
    padding: 24px;
}

.payroll-service-visual-card h3,
.payroll-plan-card h3 {
    margin: 0;
    color: var(--color-ink);
    line-height: 1.16;
}

.payroll-service-visual-card h3 {
    font-size: 1.42rem;
}

.payroll-service-visual-card p,
.payroll-plan-card p,
.payroll-plan-list li {
    margin: 0;
    color: var(--color-muted);
}

.payroll-plans-section {
    background:
        linear-gradient(180deg, rgba(236, 239, 235, 0.96), rgba(236, 239, 235, 0.9)),
        url("../img/payroll-direct-deposit.jpg"),
        var(--color-soft);
    background-position: center, center;
    background-size: auto, cover;
}

.payroll-plan-grid {
    display: grid;
    gap: 20px;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    margin-top: 34px;
}

.payroll-plan-card {
    display: grid;
    gap: 16px;
    align-content: start;
    min-height: 650px;
    padding: 28px;
    background: rgba(255, 255, 255, 0.96);
    border: 1px solid var(--color-line);
    border-radius: var(--radius-md);
    box-shadow: var(--shadow-card);
}

.payroll-plan-card h3 {
    font-size: 1.68rem;
}

.payroll-plan-price {
    display: grid;
    gap: 12px;
    grid-template-columns: repeat(2, minmax(0, 1fr));
}

.payroll-plan-price div {
    padding: 16px;
    background: var(--color-page);
    border: 1px solid var(--color-line);
    border-radius: var(--radius-sm);
}

.payroll-plan-price small {
    display: block;
    color: var(--color-muted);
    font-size: 0.76rem;
    font-weight: 850;
    text-transform: uppercase;
}

.payroll-plan-price strong {
    display: block;
    margin-top: 6px;
    color: var(--color-teal);
    font-size: 1.78rem;
    font-weight: 950;
    line-height: 1;
}

.payroll-plan-list {
    display: grid;
    gap: 10px;
    margin: 2px 0 0;
    padding-left: 18px;
}

.payroll-plan-card .button {
    width: fit-content;
    align-self: end;
}

.transport-hero-card {
    background: rgba(255, 255, 255, 0.94);
}

.transport-problem-section {
    background:
        linear-gradient(180deg, rgba(236, 239, 235, 0.96), rgba(236, 239, 235, 0.9)),
        url("../img/transport-logistics-continuity.jpg"),
        var(--color-soft);
    background-position: center, center;
    background-size: auto, cover;
}

.transport-problem-grid {
    display: grid;
    gap: 16px;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    margin-top: 34px;
}

.transport-problem-grid article {
    display: grid;
    gap: 10px;
    min-height: 208px;
    align-content: start;
    padding: 22px;
    background: rgba(255, 255, 255, 0.96);
    border: 1px solid var(--color-line);
    border-left: 4px solid var(--color-gold);
    border-radius: var(--radius-md);
    box-shadow: var(--shadow-card);
}

.transport-problem-grid span,
.transport-service-card h3,
.transport-step-list h3 {
    color: var(--color-ink);
}

.transport-problem-grid span {
    font-size: 1.16rem;
    font-weight: 900;
    line-height: 1.18;
}

.transport-problem-grid p {
    margin: 0;
    color: var(--color-muted);
}

.transport-benefits-band {
    align-items: center;
    padding: 34px;
    background:
        linear-gradient(90deg, rgba(255, 255, 255, 0.98), rgba(255, 255, 255, 0.92) 56%, rgba(15, 20, 19, 0.34)),
        url("../img/transport-industrial-access.jpg"),
        var(--color-surface);
    background-position: center, center right, center;
    background-size: auto, cover, auto;
    border: 1px solid var(--color-line);
    border-radius: var(--radius-md);
    box-shadow: var(--shadow-card);
}

.transport-service-grid {
    display: grid;
    gap: 18px;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    margin-top: 34px;
}

.transport-service-card {
    display: grid;
    overflow: hidden;
    min-height: 430px;
    align-content: start;
    background: var(--color-surface);
    border: 1px solid var(--color-line);
    border-radius: var(--radius-md);
    box-shadow: var(--shadow-card);
    scroll-margin-top: 104px;
}

.transport-service-card figure {
    position: relative;
    height: 198px;
    margin: 0;
    overflow: hidden;
    background: var(--color-steel);
}

.transport-service-card figure::after {
    position: absolute;
    inset: 0;
    background: linear-gradient(180deg, rgba(15, 20, 19, 0), rgba(15, 20, 19, 0.3));
    content: "";
}

.transport-service-card img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.transport-service-card div {
    display: grid;
    gap: 12px;
    padding: 24px;
}

.transport-service-card h3,
.transport-step-list h3 {
    margin: 0;
    line-height: 1.16;
}

.transport-service-card h3 {
    font-size: 1.45rem;
}

.transport-service-card p,
.transport-step-list p {
    margin: 0;
    color: var(--color-muted);
}

.transport-partners-section {
    background:
        linear-gradient(90deg, rgba(15, 20, 19, 0.96), rgba(38, 50, 49, 0.86)),
        url("../img/transport-special-shifts.jpg"),
        var(--color-graphite);
    background-position: center, center;
    background-size: auto, cover;
    color: #ffffff;
}

.transport-partners-band {
    display: grid;
    align-items: center;
    gap: 34px;
    grid-template-columns: minmax(0, 0.9fr) minmax(0, 1.1fr);
}

.transport-partners-band h2 {
    max-width: 700px;
    margin: 0;
    color: #ffffff;
    font-size: 2.3rem;
    line-height: 1.12;
}

.transport-partners-band p {
    max-width: 680px;
    margin: 16px 0 0;
    color: rgba(255, 255, 255, 0.78);
}

.transport-partners-band .transport-step-list p {
    max-width: none;
    margin: 0;
    color: var(--color-muted);
}

.transport-step-list {
    display: grid;
    gap: 14px;
}

.transport-step-list article {
    display: grid;
    gap: 8px;
    padding: 20px;
    background: rgba(255, 255, 255, 0.95);
    border: 1px solid rgba(255, 255, 255, 0.22);
    border-radius: var(--radius-md);
    box-shadow: 0 18px 42px rgba(0, 0, 0, 0.18);
}

.transport-step-list span {
    display: inline-grid;
    width: 42px;
    height: 34px;
    place-items: center;
    background: rgba(47, 119, 124, 0.12);
    color: var(--color-teal);
    border-radius: var(--radius-sm);
    font-size: 0.8rem;
    font-weight: 950;
}

.payroll-support-band {
    align-items: center;
    padding: 34px;
    background:
        linear-gradient(90deg, rgba(255, 255, 255, 0.98), rgba(255, 255, 255, 0.92) 58%, rgba(15, 20, 19, 0.35)),
        url("../img/payroll-hr-support.jpg"),
        var(--color-surface);
    background-position: center, center right, center;
    background-size: auto, cover, auto;
    border: 1px solid var(--color-line);
    border-radius: var(--radius-md);
    box-shadow: var(--shadow-card);
}

@media (max-width: 980px) {
    .payroll-risk-band {
        grid-template-columns: 1fr;
    }

    .transport-partners-band {
        grid-template-columns: 1fr;
    }

    .payroll-service-visual-grid,
    .payroll-plan-grid,
    .transport-service-grid,
    .transport-problem-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .payroll-plan-card {
        min-height: auto;
    }
}

@media (max-width: 720px) {
    .payroll-risk-band h2,
    .transport-partners-band h2 {
        font-size: 1.88rem;
    }

    .payroll-risk-list,
    .payroll-service-visual-grid,
    .payroll-plan-grid,
    .payroll-plan-price,
    .transport-service-grid,
    .transport-problem-grid {
        grid-template-columns: 1fr;
    }

    .payroll-risk-list article,
    .payroll-service-visual-card,
    .transport-problem-grid article,
    .transport-service-card {
        min-height: auto;
    }

    .payroll-service-visual-card figure,
    .transport-service-card figure {
        height: 170px;
    }

    .payroll-plan-card,
    .payroll-support-band,
    .transport-benefits-band {
        padding: 20px;
    }

    .payroll-plan-card .button,
    .transport-benefits-band .button {
        width: 100%;
    }
}

.advantage-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 14px;
}

.advantage-grid article,
.migration-card,
.region-list article,
.consultation-steps article {
    background: var(--color-surface);
    border: 1px solid var(--color-line);
    border-radius: var(--radius-md);
}

.advantage-grid article {
    display: grid;
    gap: 10px;
    min-height: 188px;
    align-content: start;
    padding: 22px;
    box-shadow: var(--shadow-card);
}

.advantage-grid span,
.migration-card span,
.externalization-card span,
.consultation-steps span {
    color: var(--color-gold-dark);
    font-size: 0.76rem;
    font-weight: 900;
    text-transform: uppercase;
}

.advantage-grid h3,
.migration-card h3,
.region-list h3,
.externalization-band h2,
.externalization-card h3,
.accordion-stack summary,
.consultation-steps h3,
.form-heading h2,
.schedule-card h2,
.payment-card h2 {
    margin: 0;
    color: var(--color-ink);
    line-height: 1.16;
}

.advantage-grid p,
.migration-card p,
.region-list p,
.externalization-band p,
.externalization-card p,
.accordion-stack p,
.consultation-steps p,
.form-heading p,
.schedule-card p,
.payment-card p {
    margin: 0;
    color: var(--color-muted);
}

.international-map-layout {
    display: grid;
    align-items: start;
    gap: 46px;
    grid-template-columns: 0.78fr 1.22fr;
}

.region-map {
    display: grid;
    gap: 18px;
}

.map-surface {
    position: relative;
    min-height: 350px;
    overflow: hidden;
    background:
        linear-gradient(135deg, rgba(15, 20, 19, 0.94), rgba(77, 102, 104, 0.72)),
        repeating-linear-gradient(90deg, rgba(255, 255, 255, 0.1) 0 1px, transparent 1px 48px),
        repeating-linear-gradient(0deg, rgba(255, 255, 255, 0.1) 0 1px, transparent 1px 48px),
        var(--color-graphite);
    border: 1px solid rgba(255, 255, 255, 0.18);
    border-radius: var(--radius-md);
    box-shadow: var(--shadow-card);
}

.map-surface::after {
    position: absolute;
    inset: 28px;
    border: 1px solid rgba(200, 163, 58, 0.28);
    border-radius: var(--radius-md);
    content: "";
}

.region-dot {
    position: absolute;
    display: inline-flex;
    min-height: 32px;
    align-items: center;
    padding: 0 10px;
    background: var(--color-gold);
    color: var(--color-ink);
    border-radius: 999px;
    font-size: 0.76rem;
    font-weight: 900;
}

.region-africa {
    left: 47%;
    top: 48%;
}

.region-latam {
    left: 18%;
    top: 62%;
}

.region-asia {
    right: 16%;
    top: 42%;
}

.region-europe {
    left: 52%;
    top: 28%;
}

.region-list {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 12px;
}

.region-list article {
    display: grid;
    gap: 8px;
    padding: 18px;
}

.migration-grid,
.immigration-service-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 18px;
    margin-top: 38px;
}

.migration-card {
    display: grid;
    gap: 14px;
    min-height: 260px;
    align-content: start;
    padding: 24px;
    box-shadow: var(--shadow-card);
}

.migration-card h3 {
    font-size: 1.55rem;
}

.employer-service-split {
    align-items: center;
}

.employer-visual-card {
    display: grid;
    min-height: 430px;
    align-content: end;
    gap: 14px;
    overflow: hidden;
    padding: 30px;
    background:
        linear-gradient(180deg, rgba(15, 20, 19, 0.08), rgba(15, 20, 19, 0.92)),
        url("../img/service-logistics.jpg"),
        var(--color-graphite);
    background-position: center;
    background-size: cover;
    border: 1px solid rgba(255, 255, 255, 0.16);
    border-radius: var(--radius-md);
    box-shadow: var(--shadow-card);
    color: #ffffff;
}

.employer-visual-workers {
    background:
        linear-gradient(180deg, rgba(15, 20, 19, 0.08), rgba(15, 20, 19, 0.92)),
        url("../img/service-workers-industry.jpg"),
        var(--color-graphite);
    background-position: center;
    background-size: cover;
}

.employer-visual-card span,
.employer-image-section .eyebrow,
.employer-legal-grid span,
.employer-info-card span {
    color: var(--color-gold);
    font-size: 0.78rem;
    font-weight: 900;
    text-transform: uppercase;
}

.employer-visual-card h3 {
    max-width: 560px;
    margin: 0;
    color: #ffffff;
    font-size: 1.8rem;
    line-height: 1.14;
}

.employer-visual-card p {
    max-width: 620px;
    margin: 0;
    color: rgba(255, 255, 255, 0.78);
}

.employer-image-section {
    position: relative;
    overflow: hidden;
    background:
        linear-gradient(90deg, rgba(15, 20, 19, 0.96), rgba(32, 37, 34, 0.9) 48%, rgba(47, 119, 124, 0.68)),
        var(--color-ink);
    color: #ffffff;
}

.employer-image-section-office {
    background:
        linear-gradient(90deg, rgba(15, 20, 19, 0.97), rgba(32, 37, 34, 0.86) 48%, rgba(15, 20, 19, 0.38)),
        url("../img/service-office-consultation.jpg"),
        var(--color-ink);
    background-position: center, center right, center;
    background-size: auto, cover, auto;
}

.employer-image-section-immigration {
    background:
        linear-gradient(90deg, rgba(15, 20, 19, 0.97), rgba(32, 37, 34, 0.88) 48%, rgba(15, 20, 19, 0.42)),
        url("../img/service-immigration.jpg"),
        var(--color-ink);
    background-position: center, center right, center;
    background-size: auto, cover, auto;
}

.section-heading-light h2,
.section-heading-light p:not(.eyebrow) {
    color: #ffffff;
}

.section-heading-light p:not(.eyebrow) {
    color: rgba(255, 255, 255, 0.76);
}

.migration-card-dark {
    background: rgba(255, 255, 255, 0.94);
    border-color: rgba(255, 255, 255, 0.2);
}

.migration-card-dark .button-secondary {
    border-color: rgba(47, 119, 124, 0.28);
    color: var(--color-teal);
}

.migration-card-dark .button-secondary:hover,
.migration-card-dark .button-secondary:focus-visible {
    background: rgba(47, 119, 124, 0.1);
    color: var(--color-ink);
}

.employer-check-list {
    display: grid;
    gap: 9px;
    margin: 0;
    padding: 0;
    list-style: none;
}

.employer-check-list li {
    position: relative;
    padding-left: 22px;
    color: var(--color-muted);
    font-size: 0.94rem;
}

.employer-check-list li::before {
    position: absolute;
    left: 0;
    top: 0.55em;
    width: 8px;
    height: 8px;
    background: var(--color-teal);
    border-radius: 999px;
    color: var(--color-teal);
    content: "";
}

.employer-compliance-grid,
.employer-legal-grid {
    display: grid;
    gap: 18px;
    margin-top: 34px;
}

.employer-compliance-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
}

.employer-info-card {
    display: grid;
    min-height: 360px;
    align-content: end;
    gap: 12px;
    overflow: hidden;
    padding: 28px;
    background:
        linear-gradient(180deg, rgba(15, 20, 19, 0.06), rgba(15, 20, 19, 0.92)),
        url("../img/service-office-consultation.jpg"),
        var(--color-graphite);
    background-position: center;
    background-size: cover;
    border-radius: var(--radius-md);
    box-shadow: var(--shadow-card);
    color: #ffffff;
}

.employer-info-card-permit {
    background:
        linear-gradient(180deg, rgba(15, 20, 19, 0.06), rgba(15, 20, 19, 0.92)),
        url("../img/service-immigration.jpg"),
        var(--color-graphite);
    background-position: center;
    background-size: cover;
}

.employer-info-card h3,
.employer-legal-grid p,
.employer-info-card p {
    margin: 0;
}

.employer-info-card h3 {
    color: #ffffff;
    font-size: 1.62rem;
    line-height: 1.14;
}

.employer-info-card p {
    color: rgba(255, 255, 255, 0.78);
}

.employer-legal-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr));
}

.employer-legal-grid article {
    display: grid;
    gap: 12px;
    align-content: start;
    padding: 24px;
    background: rgba(255, 255, 255, 0.94);
    border: 1px solid rgba(255, 255, 255, 0.2);
    border-left: 4px solid var(--color-gold);
    border-radius: var(--radius-md);
}

.employer-legal-grid span {
    color: var(--color-gold-dark);
}

.employer-legal-grid p {
    color: var(--color-muted);
}

.employer-sector-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 12px;
}

.employer-sector-grid span {
    display: flex;
    min-height: 54px;
    align-items: center;
    padding: 13px 15px;
    background: var(--color-surface);
    border: 1px solid var(--color-line);
    border-left: 4px solid var(--color-teal);
    border-radius: var(--radius-md);
    color: var(--color-ink);
    font-weight: 850;
    box-shadow: var(--shadow-card);
}

.employer-consultation-cta {
    background:
        linear-gradient(90deg, rgba(15, 20, 19, 0.98), rgba(32, 37, 34, 0.92) 52%, rgba(47, 119, 124, 0.72)),
        url("../img/service-office-consultation.jpg"),
        var(--color-ink);
    background-position: center, center right, center;
    background-size: auto, cover, auto;
}

.pricing-panel {
    display: grid;
    align-items: stretch;
    gap: 24px;
    grid-template-columns: minmax(0, 0.9fr) minmax(320px, 1.1fr);
    margin-top: 28px;
    padding: 30px;
    background: var(--color-surface);
    border: 1px solid var(--color-line);
    border-left: 5px solid var(--color-gold);
    border-radius: var(--radius-md);
    box-shadow: var(--shadow-card);
}

.pricing-panel h3,
.pricing-card h3 {
    margin: 0;
    color: var(--color-ink);
    font-size: 1.6rem;
    line-height: 1.16;
}

.pricing-panel p,
.pricing-card p {
    margin: 12px 0 0;
    color: var(--color-muted);
}

.pricing-card {
    display: grid;
    gap: 12px;
    align-content: start;
}

.savings-comparison {
    display: grid;
    gap: 12px;
    margin-top: 18px;
}

.savings-comparison div {
    display: grid;
    gap: 4px;
    padding: 14px;
    background: var(--color-page);
    border: 1px solid var(--color-line);
    border-radius: var(--radius-sm);
}

.savings-comparison span {
    color: var(--color-gold-dark);
    font-size: 0.74rem;
    font-weight: 900;
    text-transform: uppercase;
}

.savings-comparison strong {
    color: var(--color-teal);
    font-size: 1.55rem;
}

.page-hero .hero-insight-card > p {
    margin: 0;
    color: var(--color-muted);
    font-size: 0.94rem;
}

.benefit-list {
    display: grid;
    gap: 12px;
    grid-template-columns: repeat(2, minmax(0, 1fr));
}

.benefit-list span {
    display: flex;
    min-height: 58px;
    align-items: center;
    padding: 14px 16px;
    background: var(--color-surface);
    border: 1px solid var(--color-line);
    border-left: 4px solid var(--color-gold);
    border-radius: var(--radius-md);
    color: var(--color-ink);
    font-weight: 850;
    box-shadow: var(--shadow-card);
}

.translation-benefits-section .split-layout {
    gap: 42px;
    grid-template-columns: minmax(280px, 0.82fr) minmax(0, 1.18fr);
}

.translation-benefits-section .benefit-list {
    gap: 16px;
    grid-template-columns: repeat(2, minmax(240px, 1fr));
}

.translation-benefits-section .benefit-list span {
    display: grid;
    min-height: 176px;
    align-content: start;
    align-items: start;
    gap: 10px;
    padding: 24px;
    color: var(--color-ink-2);
    font-size: 0.98rem;
    font-weight: 600;
    line-height: 1.55;
}

.translation-benefits-section .benefit-list b {
    display: block;
    color: var(--color-ink);
    font-size: 1.08rem;
    font-weight: 900;
    line-height: 1.22;
}

.translation-quote-notices {
    display: grid;
    gap: 14px;
    margin-top: 24px;
}

.translation-quote-notices article {
    padding: 18px;
    background: #f8f8f4;
    border: 1px solid var(--color-line);
    border-left: 4px solid var(--color-gold);
    border-radius: var(--radius-sm);
}

.translation-quote-notices span {
    color: var(--color-gold-dark);
    font-size: 0.72rem;
    font-weight: 900;
    text-transform: uppercase;
}

.translation-quote-notices p {
    margin: 8px 0 0;
    color: var(--color-muted);
    font-size: 0.94rem;
    line-height: 1.55;
}

.benefit-list-spaced {
    margin-top: 18px;
}

.quick-read-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 16px;
    margin-top: 30px;
}

.quick-read-grid-three {
    grid-template-columns: repeat(3, minmax(0, 1fr));
}

.quick-read-card {
    display: grid;
    gap: 11px;
    align-content: start;
    min-height: 205px;
    padding: 22px;
    background: var(--color-surface);
    border: 1px solid var(--color-line);
    border-radius: var(--radius-md);
    box-shadow: var(--shadow-card);
}

.quick-read-card-muted {
    background:
        linear-gradient(135deg, rgba(47, 119, 124, 0.08), rgba(255, 255, 255, 0.96) 48%),
        var(--color-surface);
}

.quick-read-card span {
    color: var(--color-gold-dark);
    font-size: 0.74rem;
    font-weight: 900;
    text-transform: uppercase;
}

.quick-read-card h3 {
    margin: 0;
    color: var(--color-ink);
    font-size: 1.22rem;
    line-height: 1.18;
}

.quick-read-card p {
    margin: 0;
    color: var(--color-muted);
}

.quick-read-card .button {
    align-self: end;
    width: fit-content;
    margin-top: 4px;
}

.profile-grid,
.personal-category-grid,
.service-price-grid {
    display: grid;
    gap: 18px;
    margin-top: 34px;
}

.profile-grid {
    grid-template-columns: repeat(4, minmax(0, 1fr));
}

.profile-card,
.personal-category-card,
.service-price-card,
.requirements-card,
.audience-service-card {
    display: grid;
    gap: 12px;
    align-content: start;
    background: var(--color-surface);
    border: 1px solid var(--color-line);
    border-radius: var(--radius-md);
    box-shadow: var(--shadow-card);
}

.profile-card {
    min-height: 230px;
    padding: 22px;
}

.profile-card span,
.personal-category-card span,
.service-price-card span,
.requirements-card span,
.audience-service-card span {
    color: var(--color-gold-dark);
    font-size: 0.74rem;
    font-weight: 900;
    text-transform: uppercase;
}

.profile-card h3,
.personal-category-card h3,
.service-price-card h3,
.audience-service-card h3 {
    margin: 0;
    color: var(--color-ink);
    line-height: 1.16;
}

.profile-card h3 {
    font-size: 1.25rem;
}

.profile-card p,
.personal-category-card p,
.service-price-card p,
.requirements-card li,
.audience-service-card p,
.audience-service-card li {
    margin: 0;
    color: var(--color-muted);
}

.service-audience-grid {
    display: grid;
    gap: 20px;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    margin-top: 36px;
}

.audience-service-card {
    min-height: 420px;
    padding: 30px;
}

.audience-service-card h3 {
    font-size: 1.7rem;
}

.audience-service-card ul,
.personal-category-card ul,
.requirements-card ul {
    display: grid;
    gap: 8px;
    margin: 0;
    padding-left: 18px;
}

.audience-service-card .button {
    align-self: end;
    width: fit-content;
}

.personal-category-grid {
    grid-template-columns: repeat(4, minmax(0, 1fr));
}

.personal-category-card {
    min-height: 390px;
    padding: 24px;
}

.personal-category-card h3 {
    font-size: 1.45rem;
}

.personal-category-card a {
    align-self: end;
    color: var(--color-teal);
    font-weight: 850;
    text-decoration: none;
}

.personal-category-card a:hover,
.personal-category-card a:focus-visible {
    text-decoration: underline;
}

.company-routing-band {
    display: grid;
    align-items: center;
    gap: 28px;
    grid-template-columns: minmax(0, 1fr) auto;
    padding: 32px;
    background:
        linear-gradient(90deg, rgba(255, 255, 255, 0.98), rgba(255, 255, 255, 0.9) 68%, rgba(15, 20, 19, 0.2)),
        url("../img/service-logistics.jpg"),
        var(--color-surface);
    background-position: center, center right, center;
    background-size: auto, cover, auto;
    border: 1px solid var(--color-line);
    border-left: 5px solid var(--color-gold);
    border-radius: var(--radius-md);
    box-shadow: var(--shadow-card);
}

.company-routing-band h2 {
    margin: 0;
    color: var(--color-ink);
    font-size: 2rem;
    line-height: 1.16;
}

.company-routing-band p {
    margin: 12px 0 0;
    color: var(--color-muted);
}

.uncertain-consultation-section,
.candidate-consultation-entry-section {
    background: #ffffff;
}

.uncertain-consultation-band,
.candidate-consultation-entry {
    display: grid;
    align-items: center;
    gap: 30px;
    overflow: hidden;
    border: 1px solid rgba(217, 222, 215, 0.95);
    border-radius: var(--radius-md);
    box-shadow: var(--shadow-card);
}

.uncertain-consultation-band {
    grid-template-columns: minmax(0, 1.08fr) minmax(320px, 0.92fr);
    padding: 34px;
    background:
        linear-gradient(90deg, rgba(255, 255, 255, 0.98), rgba(255, 255, 255, 0.9) 56%, rgba(15, 20, 19, 0.32)),
        url("../img/service-office-consultation.jpg"),
        var(--color-surface);
    background-position: center, center right, center;
    background-size: auto, cover, auto;
}

.uncertain-consultation-copy,
.uncertain-consultation-reasons,
.candidate-consultation-entry > div {
    position: relative;
    z-index: 1;
}

.uncertain-consultation-copy h2,
.candidate-consultation-entry h2 {
    max-width: 760px;
    margin: 0;
    color: var(--color-ink);
    font-size: 2rem;
    line-height: 1.14;
}

.uncertain-consultation-copy p,
.candidate-consultation-entry p {
    max-width: 720px;
    margin: 14px 0 0;
    color: var(--color-muted);
}

.consultant-credential-card,
.consultant-credential-inline {
    display: grid;
    gap: 6px;
    width: fit-content;
    max-width: 100%;
    margin-top: 22px;
    padding: 16px 18px;
    background: rgba(255, 255, 255, 0.94);
    border: 1px solid rgba(200, 163, 58, 0.42);
    border-left: 4px solid var(--color-gold);
    border-radius: var(--radius-md);
    box-shadow: 0 10px 24px rgba(17, 22, 20, 0.08);
}

.consultant-credential-card span,
.consultant-credential-inline span,
.uncertain-consultation-reasons span,
.paid-consultation-card span {
    color: var(--color-gold-dark);
    font-size: 0.74rem;
    font-weight: 900;
    text-transform: uppercase;
}

.consultant-credential-card strong,
.consultant-credential-inline strong {
    color: var(--color-ink);
    line-height: 1.2;
}

.consultant-credential-card p {
    margin: 0;
    color: var(--color-teal);
    font-weight: 900;
}

.uncertain-consultation-reasons {
    display: grid;
    gap: 16px;
    align-content: start;
    padding: 24px;
    background: rgba(15, 20, 19, 0.86);
    border: 1px solid rgba(255, 255, 255, 0.16);
    border-radius: var(--radius-md);
    color: #ffffff;
}

.uncertain-consultation-reasons span {
    color: #f1d984;
}

.uncertain-consultation-reasons ul,
.paid-consultation-card ul {
    display: grid;
    gap: 9px;
    margin: 0;
    padding-left: 18px;
}

.uncertain-consultation-reasons li {
    color: rgba(255, 255, 255, 0.86);
}

.uncertain-consultation-reasons .button {
    width: fit-content;
}

.paid-consultations-section {
    background:
        linear-gradient(180deg, rgba(236, 239, 235, 0.96), rgba(236, 239, 235, 0.9)),
        url("../img/service-immigration.jpg"),
        var(--color-soft);
    background-attachment: scroll;
    background-position: center, center;
    background-size: auto, cover;
}

.paid-consultation-grid {
    display: grid;
    gap: 18px;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    margin-top: 34px;
}

.paid-consultation-card {
    display: grid;
    gap: 14px;
    align-content: start;
    min-height: 540px;
    padding: 24px;
    background: rgba(255, 255, 255, 0.96);
    border: 1px solid var(--color-line);
    border-radius: var(--radius-md);
    box-shadow: var(--shadow-card);
}

.paid-consultation-card-top {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: 14px;
}

.paid-consultation-card-top strong {
    color: var(--color-teal);
    font-size: 1.45rem;
    font-weight: 950;
    white-space: nowrap;
}

.paid-consultation-card h3 {
    margin: 0;
    color: var(--color-ink);
    font-size: 1.45rem;
    line-height: 1.16;
}

.paid-consultation-card p,
.paid-consultation-card li {
    margin: 0;
    color: var(--color-muted);
}

.paid-consultation-card .button {
    align-self: end;
    width: fit-content;
    margin-top: 4px;
}

.paid-consultation-card small,
.payment-placeholder-summary p {
    color: var(--color-danger);
    font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", monospace;
    font-size: 0.78rem;
    font-weight: 800;
    overflow-wrap: anywhere;
}

.payment-placeholder-button::after {
    content: "";
    width: 8px;
    height: 8px;
    margin-left: 2px;
    border-top: 2px solid currentColor;
    border-right: 2px solid currentColor;
    transform: rotate(45deg);
}

.candidate-consultation-entry {
    grid-template-columns: minmax(0, 1fr) auto;
    padding: 32px;
    background:
        linear-gradient(90deg, rgba(15, 20, 19, 0.92), rgba(47, 119, 124, 0.84) 58%, rgba(15, 20, 19, 0.42)),
        url("../img/service-office-consultation.jpg"),
        var(--color-graphite);
    background-position: center, center right, center;
    background-size: auto, cover, auto;
    color: #ffffff;
}

.candidate-consultation-entry h2,
.candidate-consultation-entry p {
    color: #ffffff;
}

.candidate-consultation-entry p {
    color: rgba(255, 255, 255, 0.82);
}

.candidate-consultation-entry .eyebrow {
    color: #f1d984;
}

.candidate-consultation-entry .consultant-credential-inline {
    background: rgba(255, 255, 255, 0.1);
    border-color: rgba(255, 255, 255, 0.18);
    border-left-color: var(--color-gold);
    box-shadow: none;
}

.candidate-consultation-entry .consultant-credential-inline span,
.candidate-consultation-entry .consultant-credential-inline strong {
    color: #ffffff;
}

.candidate-consultation-actions {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 12px;
    flex-wrap: wrap;
}

.immigration-selector-grid {
    display: grid;
    gap: 16px;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    margin-top: 36px;
}

.immigration-selector-card {
    display: grid;
    min-height: 260px;
    gap: 12px;
    align-content: start;
    padding: 24px;
    background: var(--color-surface);
    border: 1px solid var(--color-line);
    border-radius: var(--radius-md);
    color: inherit;
    text-align: left;
    box-shadow: var(--shadow-card);
    transition: border-color 160ms ease, box-shadow 160ms ease, transform 160ms ease;
}

.immigration-selector-card:hover,
.immigration-selector-card:focus-visible,
.immigration-selector-card.is-active {
    border-color: rgba(200, 163, 58, 0.9);
    box-shadow: 0 18px 42px rgba(17, 22, 20, 0.14);
    outline: none;
    transform: translateY(-2px);
}

.immigration-selector-card span {
    color: var(--color-gold-dark);
    font-size: 0.74rem;
    font-weight: 900;
    text-transform: uppercase;
}

.immigration-selector-card strong {
    color: var(--color-ink);
    font-size: 1.45rem;
    line-height: 1.14;
}

.immigration-selector-card small {
    color: var(--color-muted);
    font-size: 0.95rem;
    line-height: 1.48;
}

.service-category-panel {
    display: none;
}

.service-category-panel.is-active {
    display: block;
}

.service-panel-heading {
    display: grid;
    align-items: start;
    gap: 24px;
    grid-template-columns: minmax(0, 1fr) minmax(280px, 0.45fr);
}

.service-panel-heading h2 {
    margin: 0;
    color: var(--color-ink);
    font-size: 2.2rem;
    line-height: 1.14;
}

.service-panel-heading p {
    max-width: 820px;
    margin: 14px 0 0;
    color: var(--color-muted);
}

.requirements-card {
    padding: 22px;
}

.service-price-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr));
}

.service-price-card {
    min-height: 330px;
    padding: 24px;
}

.service-price-card h3 {
    font-size: 1.35rem;
}

.service-price-row {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: 16px;
    padding-top: 10px;
    border-top: 1px solid var(--color-line);
}

.service-price-row small {
    color: var(--color-muted);
    font-size: 0.78rem;
    font-weight: 800;
    text-transform: uppercase;
}

.service-price-row strong {
    color: var(--color-teal);
    font-size: 1.05rem;
    font-weight: 900;
    text-align: right;
}

.service-price-card .button {
    align-self: end;
    width: fit-content;
}

.service-price-card .button-secondary {
    background: var(--color-teal);
    border-color: var(--color-teal);
    color: #ffffff;
}

.service-price-card .button-secondary:hover,
.service-price-card .button-secondary:focus-visible {
    background: #245f63;
    border-color: #245f63;
    color: #ffffff;
}

.immigration-card-legal-note {
    margin: 0;
    padding: 12px 14px;
    background: rgba(236, 239, 235, 0.74);
    border: 1px solid rgba(217, 222, 215, 0.95);
    border-left: 4px solid var(--color-gold);
    border-radius: var(--radius-sm);
    color: var(--color-muted);
    font-size: 0.82rem;
    line-height: 1.45;
}

.paid-consultation-card .immigration-card-legal-note {
    align-self: end;
    color: var(--color-muted);
    font-family: inherit;
    font-size: 0.82rem;
    font-weight: 650;
    overflow-wrap: normal;
}

.immigration-legal-section {
    background:
        radial-gradient(circle at top right, rgba(47, 119, 124, 0.1), transparent 34%),
        linear-gradient(180deg, #ffffff 0%, rgba(236, 239, 235, 0.64) 100%);
}

.immigration-legal-panel {
    display: grid;
    gap: 28px;
    grid-template-columns: minmax(0, 1fr) minmax(280px, 0.38fr);
    padding: 34px;
    background: rgba(255, 255, 255, 0.96);
    border: 1px solid var(--color-line);
    border-left: 5px solid var(--color-gold);
    border-radius: var(--radius-md);
    box-shadow: var(--shadow-card);
}

.immigration-legal-main h2 {
    max-width: 820px;
    margin: 0;
    color: var(--color-ink);
    font-size: 2.25rem;
    line-height: 1.14;
}

.immigration-legal-main p,
.immigration-legal-detail p {
    margin: 14px 0 0;
    color: var(--color-muted);
}

.immigration-trust-card {
    display: grid;
    gap: 14px;
    align-content: start;
    padding: 22px;
    background: var(--color-graphite);
    border-radius: var(--radius-md);
    color: #ffffff;
}

.immigration-trust-card > span,
.employer-legal-notice span {
    color: #f1d984;
    font-size: 0.74rem;
    font-weight: 900;
    text-transform: uppercase;
}

.immigration-trust-badges {
    display: flex;
    gap: 10px;
    flex-wrap: wrap;
}

.immigration-trust-badges span {
    display: inline-flex;
    align-items: center;
    min-height: 36px;
    padding: 8px 11px;
    background: rgba(255, 255, 255, 0.1);
    border: 1px solid rgba(255, 255, 255, 0.16);
    border-radius: 999px;
    color: #ffffff;
    font-size: 0.82rem;
    font-weight: 850;
    line-height: 1.25;
}

.immigration-trust-badges span::before {
    content: "";
    width: 7px;
    height: 7px;
    margin-right: 8px;
    border-radius: 999px;
    background: var(--color-gold);
    flex: 0 0 auto;
}

.immigration-legal-detail {
    display: grid;
    gap: 24px;
    grid-column: 1 / -1;
    grid-template-columns: repeat(2, minmax(0, 1fr));
}

.immigration-legal-detail > div {
    padding: 24px;
    background: #f8f8f4;
    border: 1px solid var(--color-line);
    border-radius: var(--radius-md);
}

.immigration-legal-detail h3 {
    margin: 0;
    color: var(--color-ink);
    font-size: 1.25rem;
    line-height: 1.2;
}

.immigration-legal-list {
    display: grid;
    gap: 8px;
    margin: 16px 0 0;
    padding-left: 18px;
    color: var(--color-muted);
}

.immigration-legal-list li::marker {
    color: var(--color-gold-dark);
}

.employer-legal-notice {
    display: grid;
    align-items: start;
    gap: 14px;
    grid-template-columns: 1fr;
    margin-top: 22px;
    padding: 22px;
    background: rgba(15, 20, 19, 0.78);
    border: 1px solid rgba(255, 255, 255, 0.15);
    border-left: 5px solid var(--color-gold);
    border-radius: var(--radius-md);
    color: #ffffff;
}

.employer-legal-notice h2,
.employer-legal-notice h3 {
    margin: 6px 0 0;
    color: #ffffff;
    line-height: 1.14;
}

.employer-legal-notice p {
    margin: 8px 0 0;
    color: rgba(255, 255, 255, 0.84);
}

.employer-legal-notice p:not(.eyebrow) {
    max-width: none;
    margin: 8px 0 0;
    color: #ffffff;
}

.employer-legal-notice > span,
.employer-legal-notice .eyebrow {
    display: block;
    margin: 0;
}

.employer-legal-notice .button {
    width: fit-content;
    margin-top: 4px;
}

.employer-legal-list {
    margin: 10px 0 0;
    padding-left: 20px;
    color: rgba(255, 255, 255, 0.84);
}

.employer-legal-list li + li {
    margin-top: 4px;
}

.employer-legal-list li::marker {
    color: var(--color-gold);
}

.requirements-summary {
    display: grid;
    gap: 8px;
    padding: 14px;
    background: #f8f8f4;
    border: 1px solid var(--color-line);
    border-radius: var(--radius-sm);
}

.requirements-summary span {
    color: var(--color-gold-dark);
    font-size: 0.74rem;
    font-weight: 900;
    text-transform: uppercase;
}

.service-detail-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 18px;
    margin-top: 34px;
}

.detail-card {
    display: grid;
    gap: 12px;
    min-height: 240px;
    align-content: start;
    padding: 24px;
    background: var(--color-surface);
    border: 1px solid var(--color-line);
    border-radius: var(--radius-md);
    box-shadow: var(--shadow-card);
}

.detail-card span,
.pricing-model-card span {
    color: var(--color-gold-dark);
    font-size: 0.74rem;
    font-weight: 900;
    text-transform: uppercase;
}

.detail-card h3 {
    margin: 0;
    color: var(--color-ink);
    font-size: 1.35rem;
    line-height: 1.16;
}

.detail-card p,
.pricing-model-card p {
    margin: 0;
    color: var(--color-muted);
}

.pricing-model-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 18px;
    margin-top: 34px;
}

.pricing-model-card {
    display: grid;
    gap: 12px;
    align-content: start;
    padding: 24px;
    background:
        linear-gradient(135deg, rgba(47, 119, 124, 0.09), rgba(255, 255, 255, 0.98) 48%),
        var(--color-surface);
    border: 1px solid rgba(47, 119, 124, 0.28);
    border-radius: var(--radius-md);
    box-shadow: var(--shadow-card);
}

.pricing-model-card strong {
    color: var(--color-ink);
    font-size: 1.35rem;
    line-height: 1.18;
}

.remote-roi-section {
    background:
        linear-gradient(90deg, rgba(15, 20, 19, 0.96), rgba(38, 50, 49, 0.9) 52%, rgba(15, 20, 19, 0.35)),
        url("../img/service-workers-industry.jpg"),
        var(--color-graphite);
    background-position: center, center right, center;
    background-size: auto, cover, auto;
    color: #ffffff;
}

.roi-metric-grid,
.included-solution-grid {
    display: grid;
    gap: 16px;
    margin-top: 34px;
}

.roi-metric-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr));
}

.roi-metric-grid article,
.included-solution-grid article {
    display: grid;
    gap: 10px;
    align-content: start;
    padding: 22px;
    border-radius: var(--radius-md);
    box-shadow: var(--shadow-card);
}

.roi-metric-grid article {
    background: rgba(255, 255, 255, 0.94);
    border: 1px solid rgba(255, 255, 255, 0.2);
}

.roi-metric-grid span,
.included-solution-grid span,
.remote-productivity-panel span {
    color: var(--color-gold-dark);
    font-size: 0.74rem;
    font-weight: 900;
    text-transform: uppercase;
}

.roi-metric-grid strong {
    color: #237948;
    font-size: 2.15rem;
    line-height: 1;
}

.roi-metric-grid p,
.included-solution-grid p,
.remote-productivity-panel p {
    margin: 0;
    color: var(--color-muted);
}

.included-solution-grid {
    grid-template-columns: repeat(4, minmax(0, 1fr));
}

.included-solution-grid article {
    background: var(--color-surface);
    border: 1px solid var(--color-line);
}

.included-solution-grid h3 {
    margin: 0;
    color: var(--color-ink);
    line-height: 1.16;
}

.externalization-image-band {
    background:
        linear-gradient(90deg, rgba(15, 20, 19, 0.96), rgba(47, 119, 124, 0.76) 56%, rgba(15, 20, 19, 0.36)),
        url("../img/service-logistics.jpg"),
        var(--color-graphite);
    background-position: center, center right, center;
    background-size: auto, cover, auto;
    color: #ffffff;
}

.remote-productivity-panel {
    display: grid;
    gap: 14px;
    align-content: end;
    min-height: 320px;
    padding: 28px;
    background:
        linear-gradient(180deg, rgba(15, 20, 19, 0.08), rgba(15, 20, 19, 0.92)),
        url("../img/service-office-consultation.jpg"),
        var(--color-graphite);
    background-position: center;
    background-size: cover;
    border: 1px solid rgba(255, 255, 255, 0.18);
    border-radius: var(--radius-md);
    box-shadow: var(--shadow-card);
}

.remote-productivity-panel span {
    color: var(--color-gold);
}

.remote-productivity-panel strong {
    color: #ffffff;
    font-size: 1.85rem;
    line-height: 1.12;
}

.remote-productivity-panel p {
    color: rgba(255, 255, 255, 0.78);
}

.remote-calculator-section {
    background:
        linear-gradient(180deg, rgba(244, 245, 241, 0.94), rgba(255, 255, 255, 0.98)),
        var(--color-page);
}

.calculator-layout {
    display: grid;
    gap: 32px;
}

.remote-calculator {
    display: grid;
    gap: 26px;
    padding: 30px;
    background:
        linear-gradient(135deg, rgba(47, 119, 124, 0.08), rgba(255, 255, 255, 0.98) 42%),
        var(--color-surface);
    border: 1px solid var(--color-line);
    border-radius: var(--radius-md);
    box-shadow: var(--shadow-card);
}

.calculator-controls,
.calculator-results {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(190px, 1fr));
    gap: 16px;
}

.calculator-controls label {
    display: grid;
    gap: 8px;
}

.calculator-control {
    align-content: start;
    padding: 16px;
    background: #f8f8f4;
    border: 1px solid var(--color-line);
    border-radius: var(--radius-md);
}

.calculator-control-wide {
    grid-column: 1 / -1;
}

.calculator-controls span {
    color: var(--color-muted);
    font-size: 0.82rem;
    font-weight: 850;
}

.calculator-controls input,
.calculator-controls select {
    width: 100%;
    min-height: 48px;
    padding: 0 12px;
    background: #f8f8f4;
    border: 1px solid var(--color-line);
    border-radius: var(--radius-sm);
    color: var(--color-ink);
}

.calculator-controls .calculator-number {
    background: #ffffff;
    font-weight: 800;
}

.calculator-controls select {
    background: #ffffff;
    font-weight: 800;
}

.calculator-controls .calculator-range {
    appearance: none;
    -webkit-appearance: none;
    min-height: 28px;
    padding: 0;
    background: transparent;
    border: 0;
    accent-color: var(--color-teal);
}

.calculator-controls .calculator-range::-webkit-slider-runnable-track {
    height: 8px;
    background: linear-gradient(90deg, var(--color-teal) var(--range-progress, 0%), var(--color-line) var(--range-progress, 0%));
    border-radius: 999px;
}

.calculator-controls .calculator-range::-webkit-slider-thumb {
    width: 22px;
    height: 22px;
    margin-top: -7px;
    background: var(--color-ink);
    border: 3px solid #ffffff;
    border-radius: 999px;
    box-shadow: 0 6px 14px rgba(17, 22, 20, 0.2);
    -webkit-appearance: none;
}

.calculator-controls .calculator-range::-moz-range-track {
    height: 8px;
    background: var(--color-line);
    border-radius: 999px;
}

.calculator-controls .calculator-range::-moz-range-progress {
    height: 8px;
    background: var(--color-teal);
    border-radius: 999px;
}

.calculator-controls .calculator-range::-moz-range-thumb {
    width: 18px;
    height: 18px;
    background: var(--color-ink);
    border: 3px solid #ffffff;
    border-radius: 999px;
    box-shadow: 0 6px 14px rgba(17, 22, 20, 0.2);
}

.calculator-range-label {
    display: flex;
    justify-content: space-between;
    color: var(--color-muted);
    font-size: 0.72rem;
    font-weight: 800;
}

.calculator-results article {
    display: grid;
    gap: 8px;
    min-height: 150px;
    align-content: start;
    padding: 20px;
    background: #f8f8f4;
    border: 1px solid var(--color-line);
    border-radius: var(--radius-md);
}

.calculator-results-roi {
    grid-template-columns: minmax(260px, 1.2fr) repeat(3, minmax(180px, 0.82fr));
    align-items: stretch;
}

.calculator-results span {
    color: var(--color-gold-dark);
    font-size: 0.72rem;
    font-weight: 900;
    text-transform: uppercase;
}

.calculator-results strong {
    color: var(--color-ink);
    font-size: 2rem;
    line-height: 1;
    overflow-wrap: anywhere;
}

.calculator-results p {
    margin: 0;
    color: var(--color-muted);
}

.calculator-legal-note {
    margin: -8px 0 0;
    color: var(--color-muted);
    font-size: 0.86rem;
    line-height: 1.5;
}

.calculator-result-highlight {
    background:
        linear-gradient(135deg, rgba(35, 121, 72, 0.18), rgba(255, 255, 255, 0.98) 62%),
        #f6fff8;
    border-color: rgba(35, 121, 72, 0.36);
}

.calculator-savings-main {
    border-left: 6px solid #237948;
}

.calculator-savings-main span {
    color: #237948;
}

.calculator-savings-main strong {
    color: #237948;
    font-size: clamp(2.7rem, 5vw, 4.6rem);
    letter-spacing: 0;
}

.calculator-savings-main p {
    font-size: 1.05rem;
    font-weight: 850;
}

.calculator-savings-main p b {
    color: #237948;
    font-size: 1.42rem;
}

.remote-calculator > .button {
    width: fit-content;
}

.solution-card .button {
    align-self: end;
    width: fit-content;
}

.externalization-band {
    display: grid;
    align-items: center;
    gap: 42px;
    grid-template-columns: 0.88fr 1.12fr;
    padding: 42px;
    background: var(--color-surface);
    border: 1px solid var(--color-line);
    border-radius: var(--radius-md);
    box-shadow: var(--shadow-card);
}

.externalization-band h2 {
    font-size: 2.7rem;
}

.externalization-band p {
    margin-top: 18px;
}

.externalization-card {
    display: grid;
    gap: 16px;
    padding: 26px;
    background:
        linear-gradient(135deg, rgba(200, 163, 58, 0.11), rgba(255, 255, 255, 0.96) 42%),
        #ffffff;
    border: 1px solid rgba(200, 163, 58, 0.42);
    border-radius: var(--radius-md);
}

.externalization-card p {
    margin: 0;
}

.externalization-card .button {
    width: fit-content;
}

.accordion-stack {
    display: grid;
    gap: 12px;
}

.accordion-stack details {
    background: var(--color-page);
    border: 1px solid var(--color-line);
    border-radius: var(--radius-md);
}

.accordion-stack summary {
    cursor: pointer;
    padding: 18px 20px;
    font-size: 1.05rem;
    font-weight: 850;
}

.accordion-stack p {
    padding: 0 20px 18px;
}

.consultation-steps {
    display: grid;
    grid-template-columns: 1fr;
    gap: 18px;
    margin-top: 38px;
}

.consultation-steps article {
    display: grid;
    gap: 12px;
    min-height: 190px;
    align-content: start;
    padding: 24px;
    box-shadow: var(--shadow-card);
}

.consultation-layout {
    display: grid;
    align-items: start;
    gap: 24px;
    grid-template-columns: 1fr;
}

.consultation-form {
    padding: 26px;
}

.form-heading {
    display: grid;
    gap: 10px;
    margin-bottom: 4px;
}

.form-heading h2 {
    font-size: 2rem;
}

.form-grid-two {
    display: grid;
    gap: 14px;
    grid-template-columns: repeat(2, minmax(0, 1fr));
}

.phone-input-group {
    display: grid;
    gap: 10px;
    grid-template-columns: minmax(132px, 0.42fr) minmax(0, 1fr);
}

.phone-input-group select,
.phone-input-group input {
    min-width: 0;
}

.form-question {
    display: grid;
    gap: 10px;
    margin: 0;
    padding: 14px;
    background: #ffffff;
    border: 1px solid var(--color-line);
    border-radius: var(--radius-sm);
}

.form-question legend {
    padding: 0;
    color: #31555a;
    font-size: 0.86rem;
    font-weight: 850;
}

.checkbox-row {
    display: flex;
    align-items: flex-start;
    gap: 10px;
    padding: 14px;
    background: #ffffff;
    border: 1px solid var(--color-line);
    border-radius: var(--radius-sm);
    color: var(--color-muted);
    font-weight: 700;
}

.radio-row {
    display: flex;
    align-items: flex-start;
    gap: 10px;
    color: var(--color-muted);
    font-weight: 700;
}

.checkbox-row input,
.radio-row input {
    width: 18px;
    min-width: 18px;
    height: 18px;
    min-height: 18px;
    margin-top: 2px;
}

.form-consent-stack {
    display: grid;
    gap: 10px;
    width: 100%;
}

.contact-form .form-consent-stack,
.filter-panel .form-consent-stack,
.job-filter-panel .form-consent-stack,
.remote-calculator .form-consent-stack {
    grid-column: 1 / -1;
}

.form-consent-row {
    background:
        linear-gradient(135deg, rgba(47, 119, 124, 0.05), rgba(200, 163, 58, 0.08)),
        #ffffff;
    border-color: rgba(47, 119, 124, 0.18);
    color: var(--color-ink-2);
    font-size: 0.9rem;
    font-weight: 700;
    line-height: 1.42;
}

.form-consent-row span {
    min-width: 0;
    overflow-wrap: anywhere;
}

.form-consent-row a {
    color: var(--color-teal);
    font-weight: 900;
    text-decoration: underline;
    text-underline-offset: 3px;
}

.form-consent-row a:hover,
.form-consent-row a:focus-visible {
    color: var(--color-gold-dark);
    outline: none;
}

.form-consent-row input:focus-visible {
    outline: 3px solid rgba(200, 163, 58, 0.44);
    outline-offset: 2px;
}

.consultation-side {
    display: grid;
    gap: 16px;
}

.schedule-card,
.payment-card {
    display: grid;
    gap: 16px;
    padding: 24px;
    background: var(--color-surface);
    border: 1px solid var(--color-line);
    border-radius: var(--radius-md);
    box-shadow: var(--shadow-card);
}

.time-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 10px;
}

.time-grid button,
.button-outline-dark {
    min-height: 44px;
    border: 1px solid var(--color-line);
    background: #ffffff;
    color: var(--color-ink);
    border-radius: var(--radius-sm);
    font-weight: 850;
}

.time-grid button:hover,
.time-grid button:focus-visible {
    border-color: var(--color-teal);
    outline: none;
}

.price-row {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 14px;
    padding: 16px;
    background: var(--color-soft);
    border-radius: var(--radius-sm);
}

.price-row span {
    color: var(--color-muted);
    font-weight: 800;
}

.price-row strong {
    color: var(--color-ink);
    font-size: 1.45rem;
}

.payment-actions {
    display: grid;
    gap: 10px;
}

.candidate-pathway-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 18px;
    margin-top: 38px;
}

.candidate-pathway-card,
.candidate-flow-list article,
.job-card,
.ats-card,
.registration-card,
.routing-warning,
.rights-grid article {
    background: var(--color-surface);
    border: 1px solid var(--color-line);
    border-radius: var(--radius-md);
}

.candidate-pathway-card {
    display: grid;
    gap: 14px;
    min-height: 250px;
    align-content: start;
    padding: 24px;
    box-shadow: var(--shadow-card);
    text-decoration: none;
}

.candidate-pathway-card span,
.candidate-flow-list span,
.job-sector,
.ats-card span,
.rights-grid span,
.routing-warning span {
    color: var(--color-gold-dark);
    font-size: 0.76rem;
    font-weight: 900;
    text-transform: uppercase;
}

.candidate-pathway-card h3,
.candidate-flow-list h3,
.job-card h3,
.ats-card h3,
.registration-card h2,
.routing-warning h3,
.rights-grid h3 {
    margin: 0;
    color: var(--color-ink);
    line-height: 1.16;
}

.candidate-pathway-card h3 {
    font-size: 1.5rem;
}

.candidate-pathway-card p,
.candidate-flow-list p,
.job-card p,
.ats-card p,
.registration-card p,
.routing-warning p,
.rights-grid p {
    margin: 0;
    color: var(--color-muted);
}

.candidate-search-layout,
.registration-layout,
.ats-band {
    display: grid;
    align-items: start;
    gap: 44px;
    grid-template-columns: 0.82fr 1.18fr;
}

.job-search-panel,
.job-filter-panel {
    display: grid;
    gap: 14px;
    padding: 22px;
    background: var(--color-page);
    border: 1px solid var(--color-line);
    border-radius: var(--radius-md);
    box-shadow: var(--shadow-card);
}

.job-search-panel {
    grid-template-columns: repeat(3, minmax(0, 1fr)) auto;
    align-items: end;
}

.candidate-flow-list {
    display: grid;
    gap: 14px;
}

.candidate-flow-list article {
    display: grid;
    gap: 9px;
    padding: 22px;
}

.candidate-note-band {
    display: grid;
    align-items: start;
    gap: 36px;
    grid-template-columns: minmax(0, 0.82fr) minmax(0, 1.18fr);
    padding: 34px;
    background: var(--color-surface);
    border: 1px solid var(--color-line);
    border-left: 5px solid var(--color-gold);
    border-radius: var(--radius-md);
    box-shadow: var(--shadow-card);
}

.candidate-note-band h2 {
    margin: 0;
    color: var(--color-ink);
    font-size: 2.2rem;
    line-height: 1.12;
}

.candidate-note-band p {
    margin: 0;
    color: var(--color-muted);
}

.jobs-toolbar {
    display: grid;
    align-items: end;
    gap: 22px;
    grid-template-columns: 1fr;
    margin-bottom: 30px;
}

.jobs-toolbar h2 {
    margin: 0;
    color: var(--color-ink);
    font-size: 2.45rem;
    line-height: 1.08;
}

.job-filter-panel {
    grid-template-columns: repeat(5, minmax(0, 1fr)) auto;
    align-items: end;
}

.job-list {
    display: grid;
    gap: 14px;
}

.job-empty-state {
    display: grid;
    justify-items: start;
    gap: 12px;
    padding: 28px;
    background: var(--color-surface);
    border: 1px solid var(--color-line);
    border-radius: var(--radius-md);
}

.job-empty-state h3,
.job-empty-state p {
    margin: 0;
}

.job-empty-state h3 {
    color: var(--color-ink);
    font-size: 1.35rem;
}

.job-empty-state p {
    color: var(--color-muted);
}

.job-card {
    display: grid;
    align-items: start;
    gap: 28px;
    grid-template-columns: minmax(0, 1fr) minmax(260px, 320px);
    padding: 26px;
    box-shadow: var(--shadow-card);
}

.job-card-main {
    display: grid;
    gap: 10px;
    align-content: start;
    align-self: start;
}

.job-card-kickers {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}

.job-card-kickers span {
    display: inline-flex;
    min-height: 26px;
    align-items: center;
    padding: 0 9px;
    border-radius: 999px;
    font-size: 0.72rem;
    font-weight: 900;
    text-transform: uppercase;
}

.job-market {
    background: #eef5f3;
    color: var(--color-teal);
}

.job-sector {
    background: #fff6de;
    color: var(--color-gold-dark);
}

.job-card h3 {
    font-size: 1.55rem;
}

.job-meta {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}

.job-meta span {
    display: inline-flex;
    min-height: 30px;
    align-items: center;
    padding: 0 10px;
    background: var(--color-soft);
    color: var(--color-teal);
    border-radius: 999px;
    font-size: 0.8rem;
    font-weight: 850;
}

.job-card-action {
    display: grid;
    gap: 12px;
    align-content: start;
    align-self: start;
    justify-items: stretch;
}

.job-card-action strong {
    color: var(--color-ink);
    font-size: 1.2rem;
}

.job-immigration-notice {
    max-width: none;
    padding: 12px;
    border: 1px solid var(--color-line);
    border-radius: var(--radius-sm);
    background: rgba(255, 255, 255, 0.72);
    color: var(--color-muted);
    font-size: 0.84rem;
    line-height: 1.42;
}

.job-immigration-notice p,
.job-immigration-notice ul {
    margin: 0;
}

.job-immigration-notice ul {
    padding-left: 18px;
}

.job-immigration-notice p + p,
.job-immigration-notice p + ul,
.job-immigration-notice ul + p {
    margin-top: 8px;
}

.job-immigration-notice strong {
    font-size: 0.82rem;
}

.ats-card {
    display: grid;
    gap: 14px;
    padding: 24px;
    box-shadow: var(--shadow-card);
}

.registration-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 18px;
    margin-top: 38px;
}

.registration-card {
    display: grid;
    gap: 14px;
    align-content: start;
    padding: 22px;
    box-shadow: var(--shadow-card);
}

.schedule-unlock-card .button:disabled {
    cursor: not-allowed;
    opacity: 0.62;
    transform: none;
}

.profile-progress {
    display: grid;
    gap: 8px;
    padding: 16px;
    background: var(--color-page);
    border: 1px solid var(--color-line);
    border-radius: var(--radius-sm);
}

.profile-progress span {
    color: var(--color-muted);
    font-size: 0.78rem;
    font-weight: 900;
    text-transform: uppercase;
}

.profile-progress strong {
    color: var(--color-ink);
    font-size: 1.35rem;
}

.profile-progress div {
    height: 9px;
    overflow: hidden;
    background: #dde4df;
    border-radius: 999px;
}

.profile-progress i {
    display: block;
    height: 100%;
    background: var(--color-gold);
    border-radius: inherit;
}

.routing-warning {
    display: grid;
    gap: 14px;
    padding: 24px;
    border-left: 5px solid var(--color-gold);
    box-shadow: var(--shadow-card);
}

.routing-warning .button {
    width: fit-content;
}

.rights-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 14px;
    margin-top: 34px;
}

.rights-grid article {
    display: grid;
    gap: 10px;
    padding: 22px;
}

.legal-attestation {
    align-self: start;
}

.about-story-layout,
.leadership-layout,
.contact-info-layout,
.contact-form-layout,
.map-layout,
.faq-layout {
    display: grid;
    align-items: start;
    gap: 46px;
    grid-template-columns: 0.82fr 1.18fr;
}

.timeline-list {
    display: grid;
    gap: 14px;
}

.timeline-list article {
    display: grid;
    gap: 18px;
    grid-template-columns: 54px minmax(0, 1fr);
    padding: 22px;
    background: var(--color-surface);
    border: 1px solid var(--color-line);
    border-radius: var(--radius-md);
    box-shadow: var(--shadow-card);
}

.timeline-list span,
.values-grid span,
.team-grid span,
.contact-card-grid span,
.sms-menu span,
.form-warning {
    color: var(--color-gold-dark);
    font-size: 0.76rem;
    font-weight: 900;
    text-transform: uppercase;
}

.timeline-list span {
    display: inline-grid;
    width: 42px;
    height: 34px;
    place-items: center;
    background: var(--color-soft);
    color: var(--color-teal);
    border-radius: var(--radius-sm);
}

.timeline-list h3,
.values-grid h3,
.team-grid h3,
.contact-card-grid h3,
.office-map strong {
    margin: 0;
    color: var(--color-ink);
    line-height: 1.16;
}

.timeline-list p,
.values-grid p,
.team-grid p,
.contact-card-grid p,
.office-map p,
.contact-panel p {
    margin: 0;
    color: var(--color-muted);
}

.about-metrics-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 16px;
}

.about-metrics-grid article {
    display: grid;
    gap: 12px;
    min-height: 176px;
    align-content: start;
    padding: 24px;
    background: var(--color-surface);
    border: 1px solid var(--color-line);
    border-radius: var(--radius-md);
    box-shadow: var(--shadow-card);
}

.about-metrics-grid span {
    color: var(--color-teal);
    font-size: 2.55rem;
    font-weight: 900;
    line-height: 1;
}

.about-metrics-grid p {
    margin: 0;
    color: var(--color-muted);
    font-weight: 700;
}

.about-results-section .section-heading {
    max-width: none;
}

#about-results {
    scroll-margin-top: 96px;
}

.about-results-layout {
    display: grid;
    align-items: stretch;
    gap: 20px;
    grid-template-columns: 0.9fr 1.1fr;
    margin-top: 38px;
}

.about-results-section .about-metrics-grid {
    grid-auto-rows: 1fr;
    grid-template-columns: repeat(2, minmax(0, 1fr));
}

.about-impact-card h3 {
    margin: 0;
    color: var(--color-ink);
    font-size: 1.06rem;
    line-height: 1.22;
}

.about-sector-panel,
.evolution-panel {
    padding: 24px;
    background: #ffffff;
    border: 1px solid var(--color-line);
    border-radius: var(--radius-md);
    box-shadow: var(--shadow-card);
}

.about-sector-panel {
    display: grid;
    gap: 22px;
    align-content: start;
}

.about-sector-panel h3,
.evolution-panel-heading h3 {
    margin: 0;
    color: var(--color-ink);
    font-size: 1.7rem;
    line-height: 1.12;
}

.sector-bars {
    display: grid;
    gap: 14px;
}

.sector-bar {
    display: grid;
    gap: 8px;
}

.sector-bar-heading {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: 12px;
}

.sector-bar-heading span {
    color: var(--color-ink);
    font-weight: 850;
}

.sector-bar-heading strong {
    color: var(--color-teal);
    font-size: 0.98rem;
}

.sector-bar-track,
.evolution-track {
    position: relative;
    height: 10px;
    overflow: hidden;
    background: var(--color-line);
    border-radius: 999px;
}

.sector-bar-track span,
.evolution-track span {
    display: block;
    width: var(--bar-width, 0%);
    height: 100%;
    background: linear-gradient(90deg, var(--color-teal), var(--color-gold));
    border-radius: inherit;
    transform-origin: left;
    animation: chartGrow 850ms ease-out both;
}

.evolution-panel {
    margin-top: 20px;
}

.evolution-panel-heading {
    display: grid;
    align-items: start;
    gap: 24px;
    grid-template-columns: 0.8fr 1fr;
}

.evolution-panel-heading p:not(.eyebrow) {
    margin: 0;
    color: var(--color-muted);
    font-weight: 700;
}

.evolution-list {
    display: grid;
    gap: 12px;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    margin-top: 22px;
}

.evolution-list article {
    display: grid;
    align-items: center;
    gap: 12px;
    grid-template-columns: 88px minmax(0, 1fr) 1fr;
    min-height: 68px;
    padding: 14px;
    background: var(--color-page);
    border: 1px solid var(--color-line);
    border-radius: var(--radius-sm);
}

.evolution-list article > span {
    color: var(--color-gold-dark);
    font-size: 0.78rem;
    font-weight: 900;
}

.evolution-list strong {
    color: var(--color-ink);
    font-size: 0.95rem;
    line-height: 1.2;
}

.evolution-list article.is-milestone .evolution-track::before {
    position: absolute;
    inset: 0;
    background: repeating-linear-gradient(
        90deg,
        rgba(194, 159, 57, 0.42) 0,
        rgba(194, 159, 57, 0.42) 10px,
        rgba(194, 159, 57, 0.12) 10px,
        rgba(194, 159, 57, 0.12) 18px
    );
    content: "";
}

@keyframes chartGrow {
    from {
        transform: scaleX(0);
    }

    to {
        transform: scaleX(1);
    }
}

.values-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 18px;
    margin-top: 38px;
}

.values-grid article {
    display: grid;
    gap: 12px;
    min-height: 232px;
    align-content: start;
    padding: 24px;
    background: var(--color-surface);
    border: 1px solid var(--color-line);
    border-radius: var(--radius-md);
    box-shadow: var(--shadow-card);
}

.values-grid article:nth-child(-n + 2) {
    border-left: 5px solid var(--color-gold);
}

.values-grid h3 {
    font-size: 1.45rem;
}

.team-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 18px;
}

.team-grid article {
    display: grid;
    gap: 12px;
    min-height: 286px;
    align-content: start;
    padding: 24px;
    background: var(--color-surface);
    border: 1px solid var(--color-line);
    border-radius: var(--radius-md);
    box-shadow: var(--shadow-card);
}

.team-avatar {
    display: inline-grid;
    width: 66px;
    height: 66px;
    place-items: center;
    background:
        linear-gradient(135deg, rgba(200, 163, 58, 0.26), rgba(77, 102, 104, 0.14)),
        var(--color-soft);
    color: var(--color-ink);
    border: 1px solid rgba(200, 163, 58, 0.36);
    border-radius: 50%;
    font-weight: 900;
}

.team-grid h3 {
    font-size: 1.55rem;
}

.page-hero-about {
    background:
        linear-gradient(90deg, rgba(15, 20, 19, 0.98), rgba(24, 31, 30, 0.92) 48%, rgba(24, 31, 30, 0.42)),
        url("../img/home-hero-recruitment.jpg"),
        linear-gradient(90deg, rgba(255, 255, 255, 0.045) 1px, transparent 1px),
        linear-gradient(0deg, rgba(255, 255, 255, 0.045) 1px, transparent 1px),
        var(--color-graphite);
    background-position: center, center right, center, center, center;
    background-size: auto, cover, 64px 64px, 64px 64px, auto;
}

.about-hero-grid {
    align-items: start;
    grid-template-columns: minmax(0, 1fr) minmax(360px, 440px);
    min-height: 640px;
}

.about-hero .page-hero-copy {
    max-width: 880px;
}

.about-hero h1 {
    max-width: 920px;
    font-size: 3.18rem;
}

.about-hero-metrics {
    display: grid;
    gap: 12px;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    max-width: 820px;
    margin-top: 30px;
}

.about-hero-metrics article {
    display: grid;
    gap: 7px;
    min-height: 126px;
    align-content: center;
    padding: 18px;
    background: rgba(255, 255, 255, 0.1);
    border: 1px solid rgba(255, 255, 255, 0.2);
    border-radius: var(--radius-sm);
    backdrop-filter: blur(12px);
}

.about-hero-metrics strong {
    color: #ffffff;
    font-size: 2.18rem;
    font-weight: 900;
    line-height: 1;
}

.about-hero-metrics span {
    color: rgba(255, 255, 255, 0.76);
    font-size: 0.78rem;
    font-weight: 900;
    line-height: 1.28;
    text-transform: uppercase;
}

.about-hero-visual {
    position: relative;
    min-height: 500px;
}

.about-hero-visual figure {
    margin: 0;
    overflow: hidden;
    background: var(--color-steel);
    border: 1px solid rgba(255, 255, 255, 0.18);
    border-radius: var(--radius-md);
    box-shadow: 0 28px 80px rgba(0, 0, 0, 0.28);
}

.about-hero-visual img,
.about-sector-image img,
.about-solutions-grid img,
.about-slogan-grid img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.about-visual-main {
    height: 360px;
}

.about-visual-secondary {
    position: absolute;
    right: -24px;
    bottom: 84px;
    width: 56%;
    height: 190px;
}

.about-visual-proof {
    position: absolute;
    right: 22px;
    bottom: 18px;
    display: grid;
    gap: 9px;
    width: min(330px, 86%);
    padding: 20px;
    background: rgba(255, 255, 255, 0.95);
    color: var(--color-ink);
    border: 1px solid rgba(255, 255, 255, 0.34);
    border-radius: var(--radius-md);
    box-shadow: var(--shadow-card);
}

.about-visual-proof span,
.about-proof-grid span,
.about-mission-grid span {
    color: var(--color-gold-dark);
    font-size: 0.76rem;
    font-weight: 900;
    text-transform: uppercase;
}

.about-visual-proof strong {
    font-size: 1.18rem;
    line-height: 1.22;
}

.about-positioning-section {
    background: #ffffff;
}

.about-positioning-grid {
    display: grid;
    align-items: start;
    gap: 46px;
    grid-template-columns: 0.78fr 1.22fr;
}

.about-proof-grid {
    display: grid;
    gap: 16px;
    grid-template-columns: repeat(3, minmax(0, 1fr));
}

.about-proof-grid article {
    display: grid;
    gap: 13px;
    min-height: 250px;
    align-content: start;
    padding: 24px;
    background: var(--color-surface);
    border: 1px solid var(--color-line);
    border-radius: var(--radius-md);
    box-shadow: var(--shadow-card);
}

.about-proof-grid article:nth-child(2) {
    transform: translateY(28px);
}

.about-proof-grid h3,
.about-panel-heading h3,
.about-timeline-list h4,
.about-mission-grid h3,
.about-compliance-band h3,
.about-solutions-grid h3 {
    margin: 0;
    color: var(--color-ink);
    line-height: 1.15;
}

.about-proof-grid h3 {
    font-size: 1.35rem;
}

.about-proof-grid p,
.about-timeline-list p,
.about-mission-grid p,
.about-compliance-band p,
.about-solutions-grid p {
    margin: 0;
    color: var(--color-muted);
}

.about-results-section .about-impact-grid {
    grid-template-columns: repeat(4, minmax(0, 1fr));
    margin-top: 38px;
}

.about-impact-grid .about-impact-card {
    min-height: 230px;
}

.about-impact-grid .about-impact-card:nth-child(1) {
    background:
        linear-gradient(135deg, rgba(47, 119, 124, 0.1), rgba(200, 163, 58, 0.12)),
        #ffffff;
}

.about-impact-grid span {
    color: var(--color-ink);
    font-size: 3.05rem;
}

.about-impact-grid h3 {
    margin: 0;
    color: var(--color-teal);
    font-size: 1rem;
    line-height: 1.2;
    text-transform: uppercase;
}

.about-notice-card,
.about-recognition-band {
    display: grid;
    gap: 10px;
    margin-top: 20px;
    padding: 22px;
    background: #f8f8f4;
    border: 1px solid var(--color-line);
    border-left: 5px solid var(--color-gold);
    border-radius: var(--radius-md);
}

.about-notice-card span,
.about-recognition-band .eyebrow {
    color: var(--color-gold-dark);
    font-size: 0.76rem;
    font-weight: 900;
    text-transform: uppercase;
}

.about-notice-card p,
.about-recognition-band p {
    margin: 0;
    color: var(--color-muted);
    line-height: 1.58;
}

.about-recognition-band h3 {
    margin: 0;
    color: var(--color-ink);
    font-size: 1.42rem;
    line-height: 1.2;
}

.about-internship-notice {
    grid-column: 1 / -1;
    margin-top: 0;
}

.about-talent-panel {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(220px, 0.36fr);
    gap: 24px;
    align-items: start;
    margin-top: 20px;
    padding: 28px;
    background:
        linear-gradient(135deg, rgba(47, 119, 124, 0.09), rgba(200, 163, 58, 0.13)),
        #ffffff;
    border: 1px solid rgba(217, 222, 215, 0.95);
    border-radius: var(--radius-md);
    box-shadow: var(--shadow-card);
}

.about-talent-copy {
    display: grid;
    gap: 12px;
}

.about-talent-copy h3 {
    margin: 0;
    color: var(--color-ink);
    font-size: 1.55rem;
    line-height: 1.18;
}

.about-talent-copy p:not(.eyebrow) {
    margin: 0;
    color: var(--color-muted);
}

.about-talent-stat {
    display: grid;
    gap: 10px;
    min-height: 150px;
    align-content: center;
    justify-items: start;
    padding: 22px;
    background: var(--color-ink);
    color: #ffffff;
    border-radius: var(--radius-md);
}

.about-talent-stat strong {
    color: var(--color-gold);
    font-size: 3.25rem;
    font-weight: 950;
    line-height: 0.95;
}

.about-talent-stat span {
    font-size: 0.95rem;
    font-weight: 800;
    line-height: 1.25;
    text-transform: uppercase;
}

.about-institution-cloud {
    display: flex;
    flex-wrap: wrap;
    grid-column: 1 / -1;
    gap: 10px;
}

.about-institution-cloud span {
    display: inline-flex;
    min-height: 36px;
    align-items: center;
    padding: 8px 12px;
    background: rgba(255, 255, 255, 0.8);
    color: var(--color-ink-2);
    border: 1px solid var(--color-line);
    border-radius: 999px;
    font-size: 0.86rem;
    font-weight: 750;
    line-height: 1.15;
}

.about-growth-layout {
    display: grid;
    gap: 20px;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    margin-top: 20px;
}

.about-growth-panel,
.about-timeline-panel,
.about-compliance-band {
    padding: 26px;
    background: #ffffff;
    border: 1px solid var(--color-line);
    border-radius: var(--radius-md);
    box-shadow: var(--shadow-card);
}

.about-growth-panel-human .about-chart-track i {
    background: linear-gradient(90deg, var(--color-gold-dark), var(--color-gold));
}

.about-panel-heading {
    display: grid;
    gap: 10px;
    margin-bottom: 22px;
}

.about-panel-heading h3 {
    font-size: 1.72rem;
}

.about-chart-list {
    display: grid;
    gap: 12px;
}

.about-chart-row {
    display: grid;
    align-items: center;
    gap: 12px;
    grid-template-columns: 52px minmax(0, 1fr) 86px;
}

.about-chart-row > span {
    color: var(--color-gold-dark);
    font-size: 0.78rem;
    font-weight: 900;
}

.about-chart-row strong {
    color: var(--color-ink);
    font-size: 0.88rem;
    text-align: right;
}

.about-chart-track {
    height: 13px;
    overflow: hidden;
    background: var(--color-line);
    border-radius: 999px;
}

.about-chart-track i {
    display: block;
    width: var(--bar-width, 0%);
    height: 100%;
    background: linear-gradient(90deg, var(--color-teal), var(--color-gold));
    border-radius: inherit;
    transform-origin: left;
    animation: chartGrow 850ms ease-out both;
}

.about-timeline-panel {
    margin-top: 20px;
}

.about-timeline-list {
    display: grid;
    gap: 12px;
}

.about-timeline-list article {
    display: grid;
    align-items: center;
    gap: 18px;
    grid-template-columns: minmax(0, 1fr) 250px;
    padding: 16px;
    background: var(--color-page);
    border: 1px solid var(--color-line);
    border-radius: var(--radius-sm);
}

.about-timeline-list article > div:first-child {
    display: grid;
    gap: 6px;
}

.about-timeline-list span {
    color: var(--color-gold-dark);
    font-size: 0.78rem;
    font-weight: 900;
}

.about-timeline-list h4 {
    font-size: 1rem;
}

.about-timeline-list dl {
    display: grid;
    gap: 10px;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    margin: 0;
}

.about-timeline-list dl div {
    display: grid;
    gap: 4px;
    padding: 12px;
    background: #ffffff;
    border: 1px solid var(--color-line);
    border-radius: var(--radius-sm);
}

.about-timeline-list dt {
    color: var(--color-muted);
    font-size: 0.7rem;
    font-weight: 900;
    text-transform: uppercase;
}

.about-timeline-list dd {
    margin: 0;
    color: var(--color-teal);
    font-size: 1.02rem;
    font-weight: 900;
}

.about-operations-section {
    background: #ffffff;
}

.about-operations-header {
    display: grid;
    align-items: stretch;
    gap: 34px;
    grid-template-columns: 1fr minmax(320px, 460px);
}

.about-sector-image {
    min-height: 310px;
    margin: 0;
    overflow: hidden;
    background: var(--color-steel);
    border-radius: var(--radius-md);
    box-shadow: var(--shadow-card);
}

.about-sector-cloud {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    margin-top: 30px;
}

.about-sector-cloud span {
    display: inline-flex;
    min-height: 40px;
    align-items: center;
    padding: 0 14px;
    background: var(--color-soft);
    border: 1px solid rgba(47, 119, 124, 0.18);
    border-radius: 999px;
    color: var(--color-ink);
    font-size: 0.86rem;
    font-weight: 850;
}

.about-solutions-grid {
    display: grid;
    gap: 18px;
    grid-template-columns: repeat(5, minmax(0, 1fr));
    margin-top: 38px;
}

.about-solutions-grid article {
    display: grid;
    overflow: hidden;
    background: var(--color-surface);
    border: 1px solid var(--color-line);
    border-radius: var(--radius-md);
    box-shadow: var(--shadow-card);
}

.about-solutions-grid figure {
    height: 154px;
    margin: 0;
    background: var(--color-steel);
}

.about-solutions-grid article > div {
    display: grid;
    gap: 10px;
    padding: 18px;
}

.about-solutions-grid h3 {
    font-size: 1.05rem;
}

.about-solutions-grid p {
    font-size: 0.92rem;
}

.about-principles-section {
    background:
        linear-gradient(180deg, rgba(247, 244, 237, 0.74), rgba(255, 255, 255, 0.98)),
        var(--color-page);
}

.about-mission-grid {
    display: grid;
    gap: 18px;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    margin-top: 38px;
}

.about-mission-grid article {
    display: grid;
    gap: 13px;
    min-height: 258px;
    align-content: start;
    padding: 28px;
    background: #ffffff;
    border: 1px solid var(--color-line);
    border-left: 5px solid var(--color-gold);
    border-radius: var(--radius-md);
    box-shadow: var(--shadow-card);
}

.about-mission-grid h3 {
    font-size: 1.72rem;
}

.about-values-grid article:nth-child(-n + 2) {
    border-left-width: 1px;
}

.about-compliance-band {
    display: grid;
    align-items: center;
    gap: 28px;
    grid-template-columns: minmax(0, 1fr) minmax(280px, 0.86fr);
    margin-top: 20px;
    background:
        linear-gradient(135deg, rgba(15, 20, 19, 0.96), rgba(38, 50, 49, 0.94)),
        var(--color-graphite);
}

.about-compliance-band h3,
.about-compliance-band p {
    color: #ffffff;
}

.about-compliance-band p {
    color: rgba(255, 255, 255, 0.74);
}

.about-compliance-band ul {
    display: grid;
    gap: 10px;
    margin: 0;
    padding: 0;
    list-style: none;
}

.about-compliance-band li {
    padding: 12px 14px;
    background: rgba(255, 255, 255, 0.08);
    border: 1px solid rgba(255, 255, 255, 0.14);
    border-radius: var(--radius-sm);
    color: #ffffff;
    font-size: 0.9rem;
    font-weight: 850;
}

.about-presence-section {
    padding-block: 48px;
}

.about-presence-section .note-band {
    gap: 18px;
    padding-block: 28px;
}

.about-presence-section .note-band p:not(.eyebrow) {
    max-width: 900px;
    font-size: 1.08rem;
    line-height: 1.6;
}

.about-slogan-section {
    background:
        linear-gradient(90deg, rgba(15, 20, 19, 0.98), rgba(32, 37, 34, 0.88) 54%, rgba(47, 119, 124, 0.42)),
        var(--color-graphite);
    color: #ffffff;
}

.about-slogan-grid {
    display: grid;
    align-items: center;
    gap: 44px;
    grid-template-columns: minmax(320px, 0.82fr) minmax(0, 1fr);
}

.about-slogan-grid figure {
    height: 430px;
    margin: 0;
    overflow: hidden;
    background: var(--color-steel);
    border-radius: var(--radius-md);
    box-shadow: 0 28px 80px rgba(0, 0, 0, 0.28);
}

.about-slogan-grid h2 {
    margin: 0;
    color: #ffffff;
    font-size: 3.2rem;
    font-weight: 900;
    letter-spacing: 0;
    line-height: 1.04;
}

.about-slogan-grid p:not(.eyebrow) {
    max-width: 700px;
    margin: 22px 0 0;
    color: rgba(255, 255, 255, 0.78);
    font-size: 1.12rem;
}

.about-slogan-links {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    margin-top: 28px;
}

.about-slogan-links a {
    display: inline-flex;
    min-height: 42px;
    align-items: center;
    padding: 0 14px;
    background: rgba(255, 255, 255, 0.1);
    border: 1px solid rgba(255, 255, 255, 0.18);
    border-radius: 999px;
    color: #ffffff;
    font-weight: 850;
    text-decoration: none;
    transition: background 160ms ease, border-color 160ms ease, transform 160ms ease;
}

.about-slogan-links a:hover,
.about-slogan-links a:focus-visible {
    background: rgba(255, 255, 255, 0.18);
    border-color: rgba(255, 255, 255, 0.34);
    outline: none;
    transform: translateY(-1px);
}

.faq-hero-grid {
    align-items: start;
}

.faq-hero-panel {
    display: grid;
    gap: 14px;
    padding: 24px;
    background: rgba(255, 255, 255, 0.94);
    border: 1px solid rgba(255, 255, 255, 0.34);
    border-radius: var(--radius-md);
    box-shadow: 0 24px 70px rgba(0, 0, 0, 0.2);
}

.faq-hero-panel article {
    display: grid;
    gap: 7px;
    padding: 18px;
    background: var(--color-page);
    border: 1px solid var(--color-line);
    border-radius: var(--radius-sm);
}

.faq-hero-panel strong {
    color: var(--color-ink);
    font-size: 2.4rem;
    font-weight: 900;
    line-height: 1;
}

.faq-hero-panel span {
    color: var(--color-teal);
    font-size: 0.78rem;
    font-weight: 900;
    text-transform: uppercase;
}

.faq-overview-section,
.faq-content-section {
    background: #ffffff;
}

.faq-overview-grid {
    display: grid;
    align-items: start;
    gap: 44px;
    grid-template-columns: 0.78fr 1.22fr;
}

.faq-category-nav {
    display: grid;
    gap: 12px;
    grid-template-columns: repeat(2, minmax(0, 1fr));
}

.faq-category-nav a {
    display: grid;
    gap: 7px;
    min-height: 86px;
    align-content: center;
    padding: 16px 18px;
    background: var(--color-surface);
    border: 1px solid var(--color-line);
    border-radius: var(--radius-sm);
    box-shadow: var(--shadow-card);
    color: var(--color-ink);
    text-decoration: none;
}

.faq-category-nav a:hover,
.faq-category-nav a:focus-visible {
    border-color: rgba(47, 119, 124, 0.34);
    box-shadow: var(--shadow-soft);
    outline: none;
    transform: translateY(-1px);
}

.faq-category-nav span {
    font-size: 0.98rem;
    font-weight: 900;
    line-height: 1.2;
}

.faq-category-nav small {
    color: var(--color-gold-dark);
    font-size: 0.76rem;
    font-weight: 900;
    text-transform: uppercase;
}

.faq-content-layout {
    display: grid;
    gap: 28px;
}

.faq-category-block {
    display: grid;
    align-items: start;
    gap: 26px;
    grid-template-columns: minmax(260px, 0.42fr) minmax(0, 1fr);
    padding: 28px;
    background:
        linear-gradient(135deg, rgba(247, 244, 237, 0.72), rgba(255, 255, 255, 0.98)),
        var(--color-surface);
    border: 1px solid var(--color-line);
    border-radius: var(--radius-md);
    box-shadow: var(--shadow-card);
    scroll-margin-top: 110px;
}

.faq-category-heading {
    position: sticky;
    top: 102px;
    display: grid;
    gap: 12px;
}

.faq-category-heading h2 {
    margin: 0;
    color: var(--color-ink);
    font-size: 1.78rem;
    line-height: 1.12;
}

.faq-category-heading p:not(.eyebrow) {
    margin: 0;
    color: var(--color-muted);
}

.faq-accordion {
    gap: 10px;
}

.faq-accordion details {
    background: #ffffff;
    box-shadow: none;
}

.faq-accordion details[open] {
    border-color: rgba(47, 119, 124, 0.28);
}

.faq-accordion summary {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 18px;
    list-style: none;
}

.faq-accordion summary::-webkit-details-marker {
    display: none;
}

.faq-accordion summary::after {
    display: inline-grid;
    flex: 0 0 28px;
    width: 28px;
    height: 28px;
    place-items: center;
    background: var(--color-soft);
    color: var(--color-teal);
    border-radius: 50%;
    content: "+";
    font-weight: 900;
}

.faq-accordion details[open] summary::after {
    content: "−";
}

.faq-accordion p {
    color: var(--color-muted);
    font-weight: 650;
    line-height: 1.62;
}

.faq-slogan-section {
    background:
        linear-gradient(90deg, rgba(15, 20, 19, 0.98), rgba(32, 37, 34, 0.9) 56%, rgba(47, 119, 124, 0.38)),
        var(--color-graphite);
    color: #ffffff;
}

.faq-slogan-card {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 28px;
}

.faq-slogan-card h2 {
    margin: 0;
    color: #ffffff;
    font-size: 2.72rem;
    font-weight: 900;
    letter-spacing: 0;
    line-height: 1.05;
}

.faq-slogan-card p:not(.eyebrow) {
    max-width: 760px;
    margin: 18px 0 0;
    color: rgba(255, 255, 255, 0.74);
    font-size: 1.08rem;
}

.faq-entry-card {
    display: grid;
    gap: 12px;
    align-content: start;
    padding: 26px;
    background:
        linear-gradient(135deg, rgba(47, 119, 124, 0.08), rgba(200, 163, 58, 0.1)),
        var(--color-surface);
    border: 1px solid var(--color-line);
    border-radius: var(--radius-md);
    box-shadow: var(--shadow-card);
}

.faq-entry-card span {
    color: var(--color-gold-dark);
    font-size: 0.76rem;
    font-weight: 900;
    text-transform: uppercase;
}

.faq-entry-card h3 {
    margin: 0;
    color: var(--color-ink);
    font-size: 1.52rem;
    line-height: 1.14;
}

.faq-entry-card p {
    margin: 0;
    color: var(--color-muted);
}

.faq-entry-card .button {
    width: fit-content;
}

.contact-hero {
    background:
        linear-gradient(90deg, rgba(15, 20, 19, 0.98), rgba(31, 43, 41, 0.92) 50%, rgba(47, 119, 124, 0.42)),
        url("../img/service-office-consultation.jpg"),
        linear-gradient(90deg, rgba(255, 255, 255, 0.045) 1px, transparent 1px),
        linear-gradient(0deg, rgba(255, 255, 255, 0.045) 1px, transparent 1px),
        var(--color-graphite);
    background-position: center, center right, center, center, center;
    background-size: auto, cover, 64px 64px, 64px 64px, auto;
}

.contact-hero-grid {
    align-items: start;
    grid-template-columns: minmax(0, 1fr) minmax(340px, 420px);
    min-height: 610px;
}

.contact-hero .page-hero-copy {
    max-width: 900px;
}

.contact-hero h1 {
    max-width: 940px;
    font-size: 3rem;
}

.contact-hero-metrics {
    display: grid;
    gap: 12px;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    max-width: 680px;
    margin-top: 30px;
}

.contact-hero-metrics article {
    display: grid;
    gap: 7px;
    min-height: 122px;
    align-content: center;
    padding: 18px;
    background: rgba(255, 255, 255, 0.1);
    border: 1px solid rgba(255, 255, 255, 0.2);
    border-radius: var(--radius-sm);
    backdrop-filter: blur(12px);
}

.contact-hero-metrics strong {
    color: #ffffff;
    font-size: 2.12rem;
    font-weight: 900;
    line-height: 1;
}

.contact-hero-metrics span {
    color: rgba(255, 255, 255, 0.76);
    font-size: 0.76rem;
    font-weight: 900;
    line-height: 1.28;
    text-transform: uppercase;
}

.contact-hero-card {
    display: grid;
    gap: 16px;
    padding: 24px;
    background: rgba(255, 255, 255, 0.95);
    color: var(--color-ink);
    border: 1px solid rgba(255, 255, 255, 0.38);
    border-radius: var(--radius-md);
    box-shadow: 0 24px 70px rgba(0, 0, 0, 0.2);
}

.contact-hero-card > span,
.contact-permit-card span,
.privacy-note span {
    color: var(--color-gold-dark);
    font-size: 0.76rem;
    font-weight: 900;
    text-transform: uppercase;
}

.contact-hero-card > strong {
    font-size: 1.36rem;
    line-height: 1.22;
}

.contact-hero-card p {
    margin: 0;
    color: var(--color-muted);
}

.page-hero .contact-hero-card p:not(.eyebrow) {
    color: var(--color-muted);
}

.contact-permit-card {
    display: grid;
    gap: 8px;
    padding: 18px;
    background:
        linear-gradient(135deg, rgba(47, 119, 124, 0.1), rgba(200, 163, 58, 0.16)),
        var(--color-page);
    border: 1px solid rgba(47, 119, 124, 0.18);
    border-radius: var(--radius-sm);
}

.contact-permit-card b {
    color: var(--color-ink);
    font-size: 2rem;
    font-weight: 900;
    letter-spacing: 0;
}

.contact-trust-section,
.contact-details-section,
.contact-routes-section,
.contact-faq-section {
    background: #ffffff;
}

.contact-trust-grid {
    display: grid;
    align-items: start;
    gap: 42px;
    grid-template-columns: 0.85fr 1.15fr;
}

.contact-trust-list {
    display: grid;
    gap: 12px;
    grid-template-columns: repeat(2, minmax(0, 1fr));
}

.contact-trust-list span {
    min-height: 58px;
    display: flex;
    align-items: center;
    padding: 14px 16px;
    background: var(--color-surface);
    border: 1px solid var(--color-line);
    border-radius: var(--radius-sm);
    box-shadow: var(--shadow-card);
    color: var(--color-ink);
    font-weight: 850;
}

.contact-authority-note {
    grid-column: 1 / -1;
    display: grid;
    gap: 8px;
    padding: 22px;
    background: #f8f8f4;
    border: 1px solid var(--color-line);
    border-left: 5px solid var(--color-gold);
    border-radius: var(--radius-md);
}

.contact-authority-note span {
    color: var(--color-gold-dark);
    font-size: 0.76rem;
    font-weight: 900;
    text-transform: uppercase;
}

.contact-authority-note p {
    margin: 0;
    color: var(--color-muted);
    line-height: 1.58;
}

.contact-card-grid-premium {
    margin-top: 38px;
}

.contact-card-grid-premium article {
    min-height: 238px;
}

.contact-card-grid-premium strong {
    color: var(--color-ink);
    font-size: 1.02rem;
    line-height: 1.42;
}

.contact-route-grid {
    display: grid;
    gap: 18px;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    margin-top: 38px;
}

.contact-route-grid article {
    display: grid;
    gap: 14px;
    min-height: 300px;
    align-content: start;
    padding: 26px;
    background: var(--color-surface);
    border: 1px solid var(--color-line);
    border-top: 5px solid var(--color-gold);
    border-radius: var(--radius-md);
    box-shadow: var(--shadow-card);
}

.contact-route-grid h3 {
    margin: 0;
    color: var(--color-ink);
    font-size: 1.42rem;
    line-height: 1.12;
}

.contact-route-grid p {
    margin: 0;
    color: var(--color-muted);
}

.contact-route-grid .button {
    width: fit-content;
    margin-top: auto;
}

.contact-form-premium {
    border-top: 5px solid var(--color-gold);
}

.privacy-note {
    display: grid;
    gap: 6px;
    padding: 16px;
    background: var(--color-soft);
    border: 1px solid rgba(47, 119, 124, 0.18);
    border-radius: var(--radius-sm);
}

.privacy-note p {
    margin: 0;
    color: var(--color-muted);
}

.contact-form-notices {
    display: grid;
    gap: 12px;
}

.contact-form-notices article {
    padding: 16px;
    background: #ffffff;
    border: 1px solid var(--color-line);
    border-left: 4px solid var(--color-gold);
    border-radius: var(--radius-sm);
}

.contact-form-notices span {
    color: var(--color-gold-dark);
    font-size: 0.72rem;
    font-weight: 900;
    text-transform: uppercase;
}

.contact-form-notices p {
    margin: 8px 0 0;
    color: var(--color-muted);
    line-height: 1.55;
}

.contact-office-map {
    background:
        linear-gradient(135deg, rgba(15, 20, 19, 0.9), rgba(47, 119, 124, 0.62)),
        url("../img/service-logistics.jpg"),
        var(--color-graphite);
    background-position: center;
    background-size: cover;
}

.contact-faq-stack details {
    background: #ffffff;
}

.contact-faq-stack summary {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 18px;
    list-style: none;
}

.contact-faq-stack summary::-webkit-details-marker {
    display: none;
}

.contact-faq-stack summary::after {
    display: inline-grid;
    flex: 0 0 28px;
    width: 28px;
    height: 28px;
    place-items: center;
    background: var(--color-soft);
    color: var(--color-teal);
    border-radius: 50%;
    content: "+";
    font-weight: 900;
}

.contact-faq-stack details[open] summary::after {
    content: "−";
}

.contact-slogan-section {
    background:
        linear-gradient(90deg, rgba(15, 20, 19, 0.98), rgba(32, 37, 34, 0.9) 56%, rgba(47, 119, 124, 0.38)),
        var(--color-graphite);
    color: #ffffff;
}

.contact-slogan-card {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 30px;
}

.contact-slogan-card h2 {
    max-width: 800px;
    margin: 0;
    color: #ffffff;
    font-size: 2.6rem;
    font-weight: 900;
    letter-spacing: 0;
    line-height: 1.06;
}

.contact-slogan-card p:not(.eyebrow) {
    max-width: 780px;
    margin: 18px 0 0;
    color: rgba(255, 255, 255, 0.74);
    font-size: 1.08rem;
}

.translation-benefits-section .split-layout,
.split-layout,
.feature-band,
.process-layout,
.contact-layout,
.governance-grid,
.note-band,
.payroll-risk-band,
.transport-partners-band,
.international-map-layout,
.pricing-panel,
.uncertain-consultation-band,
.candidate-consultation-entry,
.service-panel-heading,
.immigration-legal-panel,
.externalization-band,
.calculator-layout,
.candidate-search-layout,
.registration-layout,
.ats-band,
.candidate-note-band,
.about-story-layout,
.about-results-layout,
.evolution-panel-heading,
.leadership-layout,
.contact-info-layout,
.contact-form-layout,
.map-layout,
.faq-layout,
.about-positioning-grid,
.about-growth-layout,
.about-talent-panel,
.about-operations-header,
.about-compliance-band,
.about-slogan-grid,
.faq-overview-grid,
.faq-category-block,
.contact-trust-grid {
    grid-template-columns: 1fr;
}

.visual-note-band,
.recruitment-quebec-band,
.international-recruitment-quebec-band,
.externalization-advantages-band {
    align-items: stretch;
    grid-template-columns: minmax(0, 0.82fr) minmax(360px, 1.18fr);
}

.visual-note-band > div,
.recruitment-quebec-band > div,
.international-recruitment-quebec-band > div,
.externalization-advantages-band > div {
    grid-column: 1 / -1;
}

.visual-note-band-figure,
.recruitment-quebec-visual,
.international-recruitment-quebec-visual,
.externalization-advantages-visual {
    min-height: 310px;
    margin: 0;
    overflow: hidden;
    background: var(--color-steel);
    border-radius: var(--radius-md);
    box-shadow: var(--shadow-card);
}

.visual-note-band-figure img,
.recruitment-quebec-visual img,
.international-recruitment-quebec-visual img,
.externalization-advantages-visual img {
    width: 100%;
    height: 100%;
    min-height: 310px;
    object-fit: cover;
}

@media (max-width: 1180px) {
    .about-solutions-grid {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }
}

@media (max-width: 980px) {
    .about-hero-grid,
    .about-positioning-grid,
    .about-growth-layout,
    .about-talent-panel,
    .about-operations-header,
    .about-compliance-band,
    .about-slogan-grid,
    .faq-overview-grid,
    .faq-category-block,
    .contact-hero-grid,
    .contact-trust-grid {
        grid-template-columns: 1fr;
    }

    .about-hero-grid {
        min-height: auto;
    }

    .about-hero-visual {
        max-width: 620px;
        min-height: 430px;
    }

    .about-proof-grid {
        grid-template-columns: 1fr;
    }

    .about-proof-grid article:nth-child(2) {
        transform: none;
    }

    .about-timeline-list article {
        grid-template-columns: 1fr;
    }

    .about-slogan-grid figure {
        height: 320px;
    }

    .faq-category-heading {
        position: static;
    }

    .contact-hero-grid {
        min-height: auto;
    }

    .contact-route-grid {
        grid-template-columns: 1fr;
    }

    .contact-route-grid article {
        min-height: 0;
    }
}

@media (max-width: 720px) {
    .about-hero h1,
    .about-slogan-grid h2 {
        font-size: 2.08rem;
    }

    .about-hero-metrics,
    .about-mission-grid,
    .about-solutions-grid,
    .faq-category-nav,
    .contact-hero-metrics,
    .contact-trust-list {
        grid-template-columns: 1fr;
    }

    .about-hero-metrics article {
        min-height: 0;
    }

    .about-hero-visual {
        min-height: 0;
    }

    .about-visual-main {
        height: 260px;
    }

    .about-visual-secondary,
    .about-visual-proof {
        position: static;
        width: 100%;
        margin-top: 12px;
    }

    .about-results-section .about-impact-grid {
        margin-top: 28px;
    }

    .about-talent-panel {
        padding: 20px;
    }

    .about-talent-stat {
        min-height: 0;
    }

    .about-institution-cloud span {
        flex: 1 1 100%;
        justify-content: center;
        text-align: center;
    }

    .about-chart-row {
        grid-template-columns: 48px minmax(0, 1fr);
    }

    .about-chart-row strong {
        grid-column: 2;
        text-align: left;
    }

    .about-timeline-list dl {
        grid-template-columns: 1fr;
    }

    .about-sector-cloud span,
    .about-slogan-links a {
        width: 100%;
        justify-content: center;
    }

    .about-growth-panel,
    .about-timeline-panel,
    .about-compliance-band,
    .about-mission-grid article,
    .faq-category-block,
    .faq-entry-card {
        padding: 20px;
    }

    .faq-hero-panel strong {
        font-size: 2.05rem;
    }

    .faq-category-heading h2,
    .faq-slogan-card h2 {
        font-size: 1.92rem;
    }

    .faq-slogan-card {
        align-items: stretch;
        flex-direction: column;
    }

    .faq-slogan-card .button,
    .faq-entry-card .button,
    .contact-route-grid .button {
        width: 100%;
    }

    .contact-hero h1,
    .contact-slogan-card h2 {
        font-size: 2.02rem;
    }

    .contact-hero-metrics article {
        min-height: 0;
    }

    .contact-permit-card b {
        font-size: 1.72rem;
        overflow-wrap: anywhere;
    }

    .contact-route-grid article {
        padding: 20px;
    }

    .contact-slogan-card {
        align-items: stretch;
        flex-direction: column;
    }
}

.contact-card-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 16px;
}

.contact-card-grid-compact {
    max-width: 420px;
    grid-template-columns: 1fr;
    margin-top: 24px;
}

.contact-card-grid article {
    display: grid;
    gap: 10px;
    min-height: 188px;
    align-content: start;
    padding: 22px;
    background: var(--color-surface);
    border: 1px solid var(--color-line);
    border-radius: var(--radius-md);
    box-shadow: var(--shadow-card);
}

.contact-card-grid.contact-card-grid-premium article {
    min-height: 238px;
}

.contact-card-checklist {
    display: grid;
    gap: 8px;
    margin: 2px 0 0;
    padding: 0;
    list-style: none;
}

.contact-card-checklist li {
    position: relative;
    padding-left: 22px;
    color: var(--color-ink);
    font-size: 0.9rem;
    font-weight: 750;
    line-height: 1.38;
}

.contact-card-checklist li::before {
    content: "\2713";
    position: absolute;
    left: 0;
    top: 0;
    color: var(--color-gold-dark);
    font-weight: 900;
}

.contact-card-grid a {
    color: var(--color-teal);
    font-size: 1.06rem;
    font-weight: 850;
    text-decoration: none;
}

.contact-card-grid a:hover,
.contact-card-grid a:focus-visible {
    text-decoration: underline;
    outline: none;
}

.dynamic-contact-form {
    padding: 26px;
}

.contact-panel {
    display: none;
    gap: 14px;
    padding: 18px;
    background: #ffffff;
    border: 1px solid var(--color-line);
    border-radius: var(--radius-sm);
}

.contact-panel.is-active {
    display: grid;
}

.form-warning {
    padding: 13px 14px;
    background: rgba(200, 163, 58, 0.12);
    border: 1px solid rgba(200, 163, 58, 0.34);
    border-radius: var(--radius-sm);
    line-height: 1.5;
}

.office-map {
    position: relative;
    display: grid;
    min-height: 390px;
    align-content: end;
    overflow: hidden;
    padding: 28px;
    background:
        linear-gradient(135deg, rgba(15, 20, 19, 0.94), rgba(77, 102, 104, 0.7)),
        repeating-linear-gradient(90deg, rgba(255, 255, 255, 0.1) 0 1px, transparent 1px 42px),
        repeating-linear-gradient(0deg, rgba(255, 255, 255, 0.1) 0 1px, transparent 1px 42px),
        var(--color-graphite);
    border: 1px solid rgba(255, 255, 255, 0.16);
    border-radius: var(--radius-md);
    box-shadow: var(--shadow-card);
}

.office-map::after {
    position: absolute;
    inset: 34px;
    border: 1px solid rgba(200, 163, 58, 0.28);
    border-radius: var(--radius-md);
    content: "";
}

.office-map > div:last-child {
    position: relative;
    z-index: 1;
    display: grid;
    gap: 6px;
    max-width: 440px;
    padding: 20px;
    background: rgba(255, 255, 255, 0.94);
    border: 1px solid rgba(255, 255, 255, 0.46);
    border-radius: var(--radius-md);
}

.office-map span {
    color: var(--color-gold-dark);
    font-size: 0.76rem;
    font-weight: 900;
    text-transform: uppercase;
}

.office-map strong {
    font-size: 1.3rem;
}

.map-pin {
    position: absolute;
    top: 38%;
    left: 55%;
    z-index: 1;
    width: 28px;
    height: 28px;
    background: var(--color-gold);
    border: 4px solid #ffffff;
    border-radius: 50% 50% 50% 0;
    box-shadow: 0 16px 30px rgba(0, 0, 0, 0.26);
    transform: rotate(-45deg);
}

.legal-section-wrap {
    background:
        linear-gradient(180deg, rgba(255, 255, 255, 0.62), rgba(244, 245, 241, 0.96)),
        var(--color-page);
}

.legal-layout {
    display: grid;
    align-items: start;
    gap: 42px;
    grid-template-columns: 300px minmax(0, 1fr);
}

.legal-sidebar {
    position: sticky;
    top: 106px;
    display: grid;
    gap: 18px;
    padding: 22px;
    background: #ffffff;
    border: 1px solid var(--color-line);
    border-radius: var(--radius-md);
    box-shadow: var(--shadow-card);
}

.legal-sidebar h2 {
    margin: 0;
    color: var(--color-ink);
    font-size: 1.1rem;
}

.legal-nav {
    display: grid;
    gap: 8px;
}

.legal-nav a {
    padding: 11px 12px;
    color: var(--color-muted);
    border-radius: var(--radius-sm);
    font-size: 0.92rem;
    font-weight: 750;
    line-height: 1.25;
    text-decoration: none;
}

.legal-nav a:hover,
.legal-nav a:focus-visible,
.legal-nav a[aria-current="page"] {
    background: var(--color-soft);
    color: var(--color-ink);
    outline: none;
}

.legal-content {
    display: grid;
    gap: 18px;
    max-width: 860px;
}

.legal-content-header,
.legal-copy-block {
    background: #ffffff;
    border: 1px solid var(--color-line);
    border-radius: var(--radius-md);
    box-shadow: var(--shadow-card);
}

.legal-content-header {
    padding: 30px;
}

.legal-content-header h2 {
    margin: 8px 0 0;
    color: var(--color-ink);
    font-size: 2rem;
    letter-spacing: 0;
    line-height: 1.12;
}

.legal-content-header p:not(.eyebrow) {
    margin: 14px 0 0;
    color: var(--color-muted);
}

.legal-copy-block {
    padding: 28px 30px;
}

.legal-copy-block h3 {
    margin: 0 0 12px;
    color: var(--color-ink);
    font-size: 1.22rem;
    letter-spacing: 0;
}

.legal-copy-block p {
    margin: 0;
    color: var(--color-ink-2);
}

.legal-copy-block p + p {
    margin-top: 12px;
}

.legal-copy-block ul {
    display: grid;
    gap: 8px;
    margin: 14px 0 0;
    padding-left: 20px;
    color: var(--color-ink-2);
}

.legal-copy-block li::marker {
    color: var(--color-gold-dark);
}

.sms-widget {
    position: fixed;
    right: 22px;
    bottom: 22px;
    z-index: 90;
}

.sms-widget summary {
    display: inline-flex;
    min-height: 48px;
    align-items: center;
    justify-content: center;
    padding: 0 18px;
    background: var(--color-teal);
    color: #ffffff;
    border: 1px solid rgba(255, 255, 255, 0.28);
    border-radius: 999px;
    box-shadow: 0 16px 36px rgba(17, 22, 20, 0.22);
    cursor: pointer;
    font-size: 0.9rem;
    font-weight: 900;
    list-style: none;
}

.sms-widget summary::-webkit-details-marker {
    display: none;
}

.sms-widget[open] summary {
    background: var(--color-ink);
}

.sms-menu {
    position: absolute;
    right: 0;
    bottom: calc(100% + 10px);
    display: grid;
    width: 270px;
    gap: 8px;
    padding: 14px;
    background: var(--color-surface);
    border: 1px solid var(--color-line);
    border-radius: var(--radius-md);
    box-shadow: var(--shadow-soft);
}

.sms-menu a {
    padding: 11px 12px;
    background: var(--color-page);
    color: var(--color-ink);
    border-radius: var(--radius-sm);
    font-weight: 800;
    text-decoration: none;
}

.sms-menu a:hover,
.sms-menu a:focus-visible {
    background: var(--color-soft);
    outline: none;
}

.site-footer {
    background: var(--color-graphite);
    color: rgba(255, 255, 255, 0.78);
}

.footer-inner {
    display: grid;
    width: min(100% - 40px, var(--container));
    gap: 34px;
    grid-template-columns: 1.35fr repeat(3, 1fr);
    margin: 0 auto;
    padding: 56px 0 40px;
}

.footer-brand {
    max-width: 380px;
}

.footer-logo {
    display: inline-flex;
    width: min(100%, 340px);
    align-items: center;
    justify-content: flex-start;
    overflow: visible;
    padding: 0;
    background: transparent;
    border: 0;
    border-radius: 0;
    box-shadow: none;
    line-height: 0;
}

.footer-logo img {
    display: block;
    width: 100%;
    height: auto;
    max-height: none;
    object-fit: contain;
}

.footer-brand p {
    margin: 14px 0 0;
    color: rgba(255, 255, 255, 0.66);
}

.footer-permit-card {
    display: grid;
    gap: 12px;
    margin-top: 18px;
    padding: 16px;
    background:
        linear-gradient(135deg, rgba(255, 255, 255, 0.08), rgba(200, 163, 58, 0.1)),
        rgba(255, 255, 255, 0.04);
    border: 1px solid rgba(255, 255, 255, 0.16);
    border-radius: var(--radius-md);
}

.footer-permit-card > span,
.footer-permit-card small {
    color: var(--color-gold);
    font-size: 0.7rem;
    font-weight: 900;
    line-height: 1.15;
    text-transform: uppercase;
}

.footer-permit-card strong {
    max-width: 30ch;
    color: rgba(255, 255, 255, 0.9);
    font-size: 0.95rem;
    line-height: 1.28;
}

.footer-permit-card > div {
    display: grid;
    gap: 7px;
    padding: 13px;
    background: rgba(255, 255, 255, 0.08);
    border: 1px solid rgba(255, 255, 255, 0.14);
    border-radius: var(--radius-sm);
}

.footer-permit-card b {
    display: block;
    color: #ffffff;
    font-size: 1.72rem;
    font-weight: 950;
    letter-spacing: 0.02em;
    line-height: 1;
}

.footer-column {
    display: grid;
    align-content: start;
    gap: 9px;
}

.footer-column h2 {
    margin: 0 0 8px;
    color: var(--color-gold);
}

.footer-column a {
    color: rgba(255, 255, 255, 0.78);
    font-weight: 650;
    text-decoration: none;
}

.footer-column a:hover,
.footer-column a:focus-visible {
    color: #ffffff;
    text-decoration: underline;
    outline: none;
}

.footer-column p {
    margin: 0;
    color: rgba(255, 255, 255, 0.66);
}

.footer-legal-strip {
    display: flex;
    width: min(100% - 40px, var(--container));
    align-items: center;
    gap: 18px;
    margin: 0 auto;
    padding: 18px 0;
    border-top: 1px solid rgba(255, 255, 255, 0.1);
}

.footer-legal-strip > span {
    flex: 0 0 auto;
    color: var(--color-gold);
    font-size: 0.82rem;
    font-weight: 900;
    letter-spacing: 0;
    text-transform: uppercase;
}

.footer-legal-nav {
    display: flex;
    flex: 1 1 auto;
    flex-wrap: wrap;
    gap: 9px;
}

.footer-legal-nav a {
    display: inline-flex;
    min-height: 34px;
    align-items: center;
    padding: 7px 11px;
    background: rgba(255, 255, 255, 0.06);
    color: rgba(255, 255, 255, 0.76);
    border: 1px solid rgba(255, 255, 255, 0.1);
    border-radius: var(--radius-sm);
    font-size: 0.84rem;
    font-weight: 700;
    line-height: 1.2;
    text-decoration: none;
}

.footer-legal-nav a:hover,
.footer-legal-nav a:focus-visible {
    background: rgba(200, 163, 58, 0.16);
    border-color: rgba(200, 163, 58, 0.36);
    color: #ffffff;
    outline: none;
}

.footer-bottom {
    border-top: 1px solid rgba(255, 255, 255, 0.1);
}

.footer-bottom p {
    width: min(100% - 40px, var(--container));
    margin: 0 auto;
    padding: 18px 0;
    color: rgba(255, 255, 255, 0.55);
    font-size: 0.88rem;
}

.not-found {
    min-height: 58vh;
}

@media (max-width: 1120px) {
    .header-inner {
        min-height: 74px;
    }

    .nav-toggle {
        display: inline-flex;
    }

    .site-nav {
        position: fixed;
        top: 74px;
        right: 0;
        bottom: 0;
        left: 0;
        z-index: 80;
        flex: none;
        display: none;
        height: calc(100vh - 74px);
        height: calc(100dvh - 74px);
        overflow-y: auto;
        align-content: start;
        align-items: stretch;
        flex-direction: column;
        justify-content: flex-start;
        gap: 22px;
        padding: 24px 20px 34px;
        background: #ffffff;
        border-top: 1px solid var(--color-line);
        box-shadow: 0 28px 60px rgba(17, 22, 20, 0.14);
    }

    .site-nav.is-open {
        display: flex;
    }

    .nav-list,
    .header-actions {
        align-items: stretch;
        flex-direction: column;
        gap: 8px;
    }

    .nav-link {
        width: 100%;
        justify-content: space-between;
        min-height: 48px;
        padding: 0 14px;
        background: var(--color-page);
    }

    .nav-panel {
        position: static;
        display: none;
        width: 100%;
        margin-top: 8px;
        opacity: 1;
        pointer-events: auto;
        transform: none;
        box-shadow: none;
    }

    .has-submenu::after {
        content: none;
    }

    .has-submenu.is-open .nav-panel {
        display: grid;
    }

    .language-switch {
        width: fit-content;
    }

    .button-small {
        width: fit-content;
    }
}

@media (max-width: 980px) {
    .hero,
    .hero-inner {
        min-height: auto;
    }

    .hero-inner {
        grid-template-columns: 1fr;
        padding: 68px 0 88px;
    }

    .hero-backdrop::after {
        right: -70px;
        bottom: -120px;
        width: 420px;
        min-width: 0;
        height: 360px;
        opacity: 0.54;
    }

    .hero h1,
    .page-hero h1 {
        font-size: 2.62rem;
    }

    .hero-search {
        max-width: 560px;
        margin-bottom: 0;
    }

    .home-hero-stats {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .home-hero-stat-featured {
        grid-column: 1 / -1;
    }

    .service-grid,
    .split-layout,
    .feature-band,
    .process-layout,
    .contact-layout,
    .footer-inner,
    .page-hero-grid,
    .catalogue-toolbar,
    .governance-grid,
    .solution-grid,
    .note-band,
    .international-map-layout,
    .service-audience-grid,
    .company-routing-band,
    .uncertain-consultation-band,
    .candidate-consultation-entry,
    .service-panel-heading,
    .immigration-legal-panel,
    .immigration-legal-detail,
    .employer-legal-notice,
    .externalization-band,
    .consultation-layout,
    .candidate-search-layout,
    .registration-layout,
    .ats-band,
    .jobs-toolbar,
    .about-story-layout,
    .about-results-layout,
    .evolution-panel-heading,
    .leadership-layout,
    .contact-info-layout,
    .contact-form-layout,
    .map-layout,
    .faq-layout,
    .legal-layout {
        grid-template-columns: 1fr;
    }

    .service-grid,
    .industry-grid,
    .exclusive-grid,
    .pathway-grid {
        max-width: 720px;
    }

    .pathway-grid {
        grid-template-columns: 1fr;
    }

    .talent-grid,
    .service-directory-grid,
    .service-option-grid,
    .comparison-grid,
    .payroll-package-grid,
    .quick-read-grid,
    .roi-metric-grid,
    .included-solution-grid,
    .profile-grid,
    .personal-category-grid,
    .immigration-selector-grid,
    .service-price-grid,
    .service-detail-grid,
    .pricing-model-grid,
    .region-list,
    .migration-grid,
    .immigration-service-grid,
    .paid-consultation-grid,
    .consultation-steps,
    .candidate-pathway-grid,
    .registration-grid,
    .rights-grid,
    .about-metrics-grid,
    .about-results-section .about-metrics-grid,
    .values-grid,
    .team-grid,
    .contact-card-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .talent-card {
        grid-template-columns: 1fr;
    }

    .pricing-panel {
        grid-template-columns: 1fr;
    }

    .calculator-results-roi {
        grid-template-columns: 1fr;
    }

    .talent-confidential {
        border-left: 0;
    }

    .filter-panel,
    .job-search-panel,
    .job-filter-panel {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .feature-band {
        padding: 28px;
    }

    .page-hero-grid {
        align-items: start;
        min-height: auto;
        padding: 56px 0 64px;
    }

    .page-hero-compact-visual .page-hero-grid {
        gap: 34px;
        padding: 42px 0 46px;
    }

    .hero-insight-card {
        max-width: 620px;
    }

    .service-visual-card {
        max-width: 560px;
    }

    .consultation-side {
        max-width: 720px;
    }

    .contact-form-layout .contact-form,
    .office-map,
    .legal-content {
        max-width: 720px;
    }

    .legal-sidebar {
        position: static;
    }
}

@media (max-width: 720px) {
    .container,
    .header-inner,
    .hero-inner,
    .footer-inner,
    .footer-legal-strip,
    .footer-bottom p {
        width: min(100% - 28px, var(--container));
    }

    .brand-logo {
        width: 64px;
        height: 46px;
    }

    .brand-logo img {
        width: 70px;
        height: 52px;
    }

    .hero-inner {
        padding: 46px 0 72px;
    }

    .hero h1 {
        font-size: 1.88rem;
    }

    .hero-lead {
        font-size: 1.03rem;
    }

    .hero-actions,
    .button {
        width: 100%;
    }

    .home-hero-stats {
        grid-template-columns: 1fr;
    }

    .home-hero-stat {
        min-height: 0;
        grid-template-columns: 92px minmax(0, 1fr);
        align-items: center;
        padding: 14px;
    }

    .home-hero-stat:not(.home-hero-stat-featured) p {
        display: none;
    }

    .home-hero-stat strong {
        font-size: 1.68rem;
    }

    .home-hero-stat h3 {
        max-width: none;
    }

    .home-hero-stat-featured {
        grid-template-columns: 1fr;
        align-items: start;
        padding: 16px;
    }

    .home-hero-stat-featured strong,
    .home-hero-stat-featured h3,
    .home-hero-stat-featured p,
    .home-hero-stat-featured .home-hero-stat-chips {
        grid-column: auto;
        grid-row: auto;
    }

    .home-hero-stat-featured strong {
        font-size: 2.8rem;
    }

    .home-hero-stat-chips span {
        flex: 1 1 auto;
        justify-content: center;
        text-align: center;
    }

    .button {
        min-height: 46px;
        padding-right: 16px;
        padding-left: 16px;
        text-align: center;
        white-space: normal;
    }

    .audience-section {
        margin-top: -36px;
    }

    .audience-grid,
    .service-directory-grid,
    .exclusive-grid,
    .industry-grid,
    .sector-proof-grid,
    .expertise-modal-grid,
    .filter-panel,
    .talent-grid,
    .service-option-grid,
    .comparison-grid,
    .solution-grid,
    .payroll-package-grid,
    .advantage-grid,
    .region-list,
    .benefit-list,
    .quick-read-grid,
    .roi-metric-grid,
    .included-solution-grid,
    .profile-grid,
    .personal-category-grid,
    .immigration-selector-grid,
    .service-price-grid,
    .service-detail-grid,
    .pricing-model-grid,
    .migration-grid,
    .immigration-service-grid,
    .employer-compliance-grid,
    .employer-legal-grid,
    .employer-sector-grid,
    .consultation-steps,
    .form-grid-two,
    .time-grid,
    .candidate-pathway-grid,
    .paid-consultation-grid,
    .candidate-note-band,
    .job-search-panel,
    .job-filter-panel,
    .registration-grid,
    .rights-grid,
    .about-metrics-grid,
    .about-results-section .about-metrics-grid,
    .evolution-list,
    .values-grid,
    .team-grid,
    .contact-card-grid {
        grid-template-columns: 1fr;
    }

    .evolution-list article {
        grid-template-columns: 78px minmax(0, 1fr);
    }

    .translation-benefits-section .split-layout {
        gap: 28px;
        grid-template-columns: 1fr;
    }

    .translation-benefits-section .benefit-list {
        grid-template-columns: 1fr;
    }

    .translation-benefits-section .benefit-list span {
        min-height: 0;
    }

    .evolution-track {
        grid-column: 1 / -1;
    }

    .section {
        padding: 56px 0;
    }

    .section-heading h2,
    .feature-band h2 {
        font-size: 1.88rem;
    }

    .sector-demand-panel {
        padding: 20px;
    }

    .sector-demand-heading {
        align-items: stretch;
        flex-direction: column;
    }

    .sector-demand-heading > span {
        max-width: none;
        width: fit-content;
    }

    .sector-demand-list li {
        grid-template-columns: 1fr;
        gap: 12px;
        padding-left: 58px;
    }

    .page-hero-grid {
        padding: 40px 0 48px;
    }

    .page-hero-compact-visual .page-hero-grid {
        gap: 26px;
        padding: 30px 0 34px;
    }

    .page-hero h1 {
        font-size: 1.88rem;
    }

    .page-hero p:not(.eyebrow) {
        font-size: 1rem;
    }

    .legal-content-header,
    .legal-copy-block,
    .legal-sidebar {
        padding: 20px;
    }

    .legal-content-header h2 {
        font-size: 1.58rem;
    }

    .breadcrumb {
        margin-bottom: 22px;
    }

    .catalogue-toolbar h2,
    .cta-strip h2,
    .note-band h2,
    .externalization-band h2,
    .immigration-legal-main h2,
    .form-heading h2,
    .candidate-note-band h2,
    .jobs-toolbar h2,
    .values-grid h3 {
        font-size: 1.72rem;
    }

    .cta-strip-inner {
        align-items: stretch;
        flex-direction: column;
    }

    .hero-insight-card,
    .employer-visual-card,
    .employer-info-card,
    .remote-productivity-panel,
    .directory-card,
    .pathway-card,
    .talent-card,
    .service-option,
    .solution-card,
    .quick-read-card,
    .profile-card,
    .personal-category-card,
    .audience-service-card,
    .company-routing-band,
    .requirements-card,
    .service-price-card,
    .immigration-legal-panel,
    .immigration-legal-detail > div,
    .immigration-trust-card,
    .employer-legal-notice,
    .detail-card,
    .pricing-model-card,
    .note-band,
    .externalization-band,
    .externalization-card,
    .schedule-card,
    .payment-card,
    .consultation-form,
    .candidate-pathway-card,
    .candidate-note-band,
    .registration-card,
    .routing-warning,
    .timeline-list article,
    .values-grid article,
    .team-grid article,
    .contact-card-grid article,
    .dynamic-contact-form,
    .office-map {
        padding: 20px;
    }

    .remote-calculator {
        padding: 20px;
    }

    .directory-card-media {
        height: 150px;
        margin: -20px -20px 2px;
    }

    .calculator-savings-main strong {
        font-size: 2.55rem;
    }

    .employer-anchor-nav a {
        flex: 1 1 100%;
        justify-content: center;
    }

    .employer-visual-card,
    .employer-info-card {
        min-height: 320px;
    }

    .service-visual-card {
        padding: 0;
    }

    .service-visual-content {
        padding: 16px;
    }

    .service-hero-visual {
        height: 138px;
    }

    .page-hero-compact-visual .service-visual-content {
        display: none;
    }

    .expertise-modal-inner {
        padding: 20px;
    }

    .audience-service-card .button,
    .directory-card-cta,
    .company-routing-band .button,
    .employer-legal-notice .button,
    .service-price-card .button,
    .quick-read-card .button {
        width: 100%;
    }

    .solution-card .button {
        width: 100%;
    }

    .expertise-modal-header {
        display: grid;
    }

    .expertise-modal-header h3 {
        font-size: 1.6rem;
    }

    .expertise-modal-close {
        width: 100%;
    }

    .talent-card {
        padding: 0;
    }

    .talent-profile,
    .talent-confidential {
        padding: 20px;
    }

    .talent-profile-top {
        grid-template-columns: 1fr;
        gap: 20px;
    }

    .candidate-avatar {
        width: 88px;
    }

    .talent-card h3 {
        font-size: 1.78rem;
        line-height: 1.05;
    }

    .talent-role,
    .talent-location,
    .talent-highlight p {
        font-size: 0.94rem;
    }

    .phone-input-group {
        grid-template-columns: 1fr;
    }

    .talent-highlight {
        gap: 14px;
        grid-template-columns: 34px minmax(0, 1fr);
    }

    .talent-highlight .profile-svg {
        width: 30px;
        height: 30px;
    }

    .candidate-validation {
        align-items: start;
        grid-template-columns: 44px minmax(0, 1fr);
        padding: 18px;
    }

    .candidate-validation .profile-svg {
        width: 40px;
        height: 40px;
    }

    .talent-cv-visual {
        width: 128px;
    }

    .timeline-list article {
        grid-template-columns: 1fr;
    }

    .sms-widget {
        right: 14px;
        bottom: 14px;
    }

    .sms-widget summary {
        width: 52px;
        min-height: 52px;
        padding: 0;
        color: transparent;
        font-size: 0;
    }

    .sms-widget summary::after {
        color: #ffffff;
        content: "SMS";
        font-size: 0.82rem;
        font-weight: 900;
    }

    .sms-menu {
        width: min(270px, calc(100vw - 28px));
    }

    .job-card {
        align-items: stretch;
        grid-template-columns: 1fr;
        padding: 20px;
    }

    .job-card-action {
        justify-items: stretch;
    }

    .routing-warning .button {
        width: 100%;
    }

    .map-surface {
        min-height: 300px;
    }

    .region-dot {
        font-size: 0.7rem;
    }

    .price-row {
        align-items: flex-start;
        flex-direction: column;
    }

    .service-card-content,
    .exclusive-card,
    .process-list article,
    .contact-form,
    .hero-search {
        padding: 20px;
    }

    .card-media {
        min-height: 142px;
    }
}

/* Card collections: let incomplete rows expand instead of leaving empty tracks. */
.audience-grid,
.service-directory-grid,
.industry-grid,
.exclusive-grid,
.pathway-grid,
.sector-proof-grid,
.expertise-modal-grid,
.talent-grid,
.service-option-grid,
.comparison-grid,
.solution-grid,
.payroll-package-grid,
.payroll-service-visual-grid,
.payroll-plan-grid,
.transport-problem-grid,
.transport-service-grid,
.advantage-grid,
.quick-read-grid,
.roi-metric-grid,
.included-solution-grid,
.profile-grid,
.personal-category-grid,
.service-audience-grid,
.migration-grid,
.immigration-service-grid,
.employer-compliance-grid,
.employer-legal-grid,
.employer-sector-grid,
.paid-consultation-grid,
.immigration-selector-grid,
.service-price-grid,
.service-detail-grid,
.pricing-model-grid,
.candidate-pathway-grid,
.registration-grid,
.rights-grid,
.about-proof-grid,
.about-metrics-grid,
.about-solutions-grid,
.about-mission-grid,
.values-grid,
.team-grid,
.contact-card-grid:not(.contact-card-grid-compact),
.contact-route-grid {
    --card-flow-gap: 20px;
    --card-flow-basis: calc((100% - var(--card-flow-gap) - var(--card-flow-gap)) / 3);
    display: flex;
    flex-wrap: wrap;
    align-items: stretch;
    gap: var(--card-flow-gap);
}

.audience-grid,
.industry-grid,
.exclusive-grid,
.sector-proof-grid,
.expertise-modal-grid,
.payroll-plan-grid,
.advantage-grid,
.service-audience-grid,
.employer-compliance-grid,
.about-mission-grid {
    --card-flow-basis: calc((100% - var(--card-flow-gap)) / 2);
}

.pathway-grid,
.comparison-grid,
.quick-read-grid,
.included-solution-grid,
.profile-grid,
.personal-category-grid,
.immigration-selector-grid,
.transport-problem-grid,
.candidate-pathway-grid,
.rights-grid,
.about-metrics-grid {
    --card-flow-basis: calc((100% - var(--card-flow-gap) - var(--card-flow-gap) - var(--card-flow-gap)) / 4);
}

.about-solutions-grid {
    --card-flow-basis: calc((100% - var(--card-flow-gap) - var(--card-flow-gap) - var(--card-flow-gap) - var(--card-flow-gap)) / 5);
}

.comparison-grid,
.rights-grid {
    --card-flow-gap: 14px;
}

.quick-read-grid,
.roi-metric-grid,
.included-solution-grid,
.immigration-selector-grid {
    --card-flow-gap: 16px;
}

.pathway-grid,
.service-option-grid,
.payroll-service-visual-grid,
.payroll-plan-grid,
.transport-problem-grid,
.profile-grid,
.personal-category-grid,
.paid-consultation-grid,
.service-price-grid,
.service-detail-grid,
.pricing-model-grid,
.candidate-pathway-grid,
.registration-grid,
.about-metrics-grid,
.about-solutions-grid,
.about-mission-grid,
.values-grid,
.team-grid,
.contact-route-grid {
    --card-flow-gap: 18px;
}

.quick-read-grid-three {
    --card-flow-basis: calc((100% - var(--card-flow-gap) - var(--card-flow-gap)) / 3);
}

.audience-grid > *,
.service-directory-grid > *,
.industry-grid > *,
.exclusive-grid > *,
.pathway-grid > *,
.sector-proof-grid > *,
.expertise-modal-grid > *,
.talent-grid > *,
.service-option-grid > *,
.comparison-grid > *,
.solution-grid > *,
.payroll-package-grid > *,
.payroll-service-visual-grid > *,
.payroll-plan-grid > *,
.transport-problem-grid > *,
.transport-service-grid > *,
.advantage-grid > *,
.quick-read-grid > *,
.roi-metric-grid > *,
.included-solution-grid > *,
.profile-grid > *,
.personal-category-grid > *,
.service-audience-grid > *,
.migration-grid > *,
.immigration-service-grid > *,
.employer-compliance-grid > *,
.employer-legal-grid > *,
.employer-sector-grid > *,
.paid-consultation-grid > *,
.immigration-selector-grid > *,
.service-price-grid > *,
.service-detail-grid > *,
.pricing-model-grid > *,
.candidate-pathway-grid > *,
.registration-grid > *,
.rights-grid > *,
.about-proof-grid > *,
.about-metrics-grid > *,
.about-solutions-grid > *,
.about-mission-grid > *,
.values-grid > *,
.team-grid > *,
.contact-card-grid:not(.contact-card-grid-compact) > *,
.contact-route-grid > * {
    flex: 1 1 var(--card-flow-basis);
    min-width: min(100%, var(--card-flow-basis));
}

.registration-grid-stacked {
    display: grid;
    grid-template-columns: 1fr;
}

.registration-grid-stacked > * {
    min-width: 0;
    width: 100%;
}

@media (max-width: 1180px) {
    .about-solutions-grid {
        --card-flow-basis: calc((100% - var(--card-flow-gap) - var(--card-flow-gap)) / 3);
    }
}

@media (max-width: 980px) {
    .audience-grid,
    .service-directory-grid,
    .industry-grid,
    .exclusive-grid,
    .pathway-grid,
    .sector-proof-grid,
    .expertise-modal-grid,
    .talent-grid,
    .service-option-grid,
    .comparison-grid,
    .solution-grid,
    .payroll-package-grid,
    .payroll-service-visual-grid,
    .payroll-plan-grid,
    .transport-problem-grid,
    .transport-service-grid,
    .advantage-grid,
    .quick-read-grid,
    .roi-metric-grid,
    .included-solution-grid,
    .profile-grid,
    .personal-category-grid,
    .service-audience-grid,
    .migration-grid,
    .immigration-service-grid,
    .employer-compliance-grid,
    .employer-legal-grid,
    .employer-sector-grid,
    .paid-consultation-grid,
    .immigration-selector-grid,
    .service-price-grid,
    .service-detail-grid,
    .pricing-model-grid,
    .candidate-pathway-grid,
    .registration-grid,
    .rights-grid,
    .about-proof-grid,
    .about-metrics-grid,
    .about-solutions-grid,
    .about-mission-grid,
    .values-grid,
    .team-grid,
    .contact-card-grid:not(.contact-card-grid-compact),
    .contact-route-grid {
        --card-flow-basis: calc((100% - var(--card-flow-gap)) / 2);
    }
}

@media (max-width: 720px) {
    .audience-grid,
    .service-directory-grid,
    .industry-grid,
    .exclusive-grid,
    .pathway-grid,
    .sector-proof-grid,
    .expertise-modal-grid,
    .talent-grid,
    .service-option-grid,
    .comparison-grid,
    .solution-grid,
    .payroll-package-grid,
    .payroll-service-visual-grid,
    .payroll-plan-grid,
    .transport-problem-grid,
    .transport-service-grid,
    .advantage-grid,
    .quick-read-grid,
    .roi-metric-grid,
    .included-solution-grid,
    .profile-grid,
    .personal-category-grid,
    .service-audience-grid,
    .migration-grid,
    .immigration-service-grid,
    .employer-compliance-grid,
    .employer-legal-grid,
    .employer-sector-grid,
    .paid-consultation-grid,
    .immigration-selector-grid,
    .service-price-grid,
    .service-detail-grid,
    .pricing-model-grid,
    .candidate-pathway-grid,
    .registration-grid,
    .rights-grid,
    .about-proof-grid,
    .about-metrics-grid,
    .about-solutions-grid,
    .about-mission-grid,
    .values-grid,
    .team-grid,
    .contact-card-grid:not(.contact-card-grid-compact),
    .contact-route-grid {
        --card-flow-basis: 100%;
    }
}