/* ============================================================
   Karriere + Stellenseiten (auto-linked for page "careers")
   Only what main.css doesn't cover; var(--token) values only.
   Benefit and job cards reuse .pillar-grid / .pillar-card.
   ============================================================ */

/* Hero: centered dark intro band (surface-dark + eyebrow-dark in main.css) */
.careers-hero {
    padding-block: var(--space-2xl);
    text-align: center;
}
.careers-hero .breadcrumb__trail { justify-content: center; }
.careers-hero__eyebrow { margin-bottom: var(--space-md); }
.careers-hero__headline { margin-bottom: var(--space-sm); }
.careers-hero__sub {
    font-size: var(--text-lg); color: var(--ink-inverse-muted);
    max-width: var(--container-narrow); margin-inline: auto;
}
.careers-hero .breadcrumb { color: var(--ink-inverse-muted); }
.careers-hero .breadcrumb__trail a { color: var(--ink-inverse-muted); }
.careers-hero .breadcrumb__trail a:hover { color: var(--surface-0); }
.careers-hero .breadcrumb__trail [aria-current="page"] { color: var(--ink-inverse); }
.careers-hero .breadcrumb__sep { color: var(--ink-inverse-muted); opacity: .6; }
@media (min-width: 1024px) {
    .careers-hero { padding-block: var(--space-3xl) var(--space-2xl); }
}

.careers-section__heading { margin-bottom: var(--space-xl); }
.careers-positions { background: var(--surface-50); }

/* Job cards */
.careers-jobs__meta {
    color: var(--ink-600); font-size: var(--text-sm); margin-bottom: var(--space-sm);
}

/* Empty state */
.careers-empty {
    max-width: var(--container-narrow);
    background: var(--surface-0);
    border: 1px solid var(--line-200); border-radius: var(--radius-md);
    box-shadow: var(--shadow-sm);
    padding: var(--space-xl);
}
.careers-empty__title { margin-bottom: var(--space-sm); }
.careers-empty__text { color: var(--ink-600); margin-bottom: var(--space-lg); }
.careers-empty__mail { margin-top: var(--space-md); font-size: var(--text-sm); }

/* Locations */
.careers-places {
    list-style: none; padding: 0;
    display: grid; gap: var(--space-sm);
}
@media (min-width: 768px) { .careers-places { grid-template-columns: repeat(2, 1fr); } }
.careers-places li {
    background: var(--surface-0);
    border: 1px solid var(--line-200); border-radius: var(--radius-md);
    padding: var(--space-md) var(--space-lg);
}

/* Job detail */
.job-facts {
    display: grid; gap: var(--space-md);
    margin-bottom: var(--space-xl);
    padding: var(--space-lg);
    background: var(--surface-50);
    border: 1px solid var(--line-200); border-radius: var(--radius-md);
}
@media (min-width: 768px) { .job-facts { grid-template-columns: repeat(3, 1fr); } }
.job-facts dt { font-size: var(--text-sm); color: var(--ink-600); }
.job-facts dd { margin: 0; font-weight: 600; color: var(--ink-900); }
.job-apply {
    margin-top: var(--space-xl); padding: var(--space-lg);
    border: 1px solid var(--line-200); border-radius: var(--radius-md);
    background: var(--surface-50);
}
.job-apply h2 { margin-bottom: var(--space-sm); }
.job-apply p { margin-bottom: var(--space-md); }
.story-back { margin-top: var(--space-lg); font-weight: 600; }

/* CTA band: hairline between the dark band and the footer (as on cases) */
.cta-band--blue { border-bottom: 1px solid var(--line-dark); }

/* Benefit tiles: line icon in a soft tinted circle (decorative; chosen in the admin) */
.careers-benefit__icon {
    width: 48px; height: 48px;
    border-radius: var(--radius-full);
}
