/* Public site finishing layer: shared contrast, responsive navigation and layouts. */
:root {
  --gradient-action: linear-gradient(115deg, #075eae, #9b35af);
  --gradient-heading: linear-gradient(110deg, #004d94, #9635aa);
}
[hidden] { display: none !important; }
:focus-visible { outline: 3px solid #2487d8; outline-offset: 4px; }
h1, h2, h3 { overflow-wrap: anywhere; text-wrap: balance; }
input, select, textarea { min-width: 0; max-width: 100%; }
.eyebrow { color: var(--blue-deep); line-height: 1.6; }
.eyebrow::before { flex: 0 0 7px; }
.btn:not(.btn-ghost), .lang a[aria-current], .chip[aria-pressed=true],
.job-country .code { background: var(--gradient-action); }
.gradient-text { background-image: var(--gradient-heading); animation: none; }
.hero .gradient-text, .method .gradient-text, .coverage .gradient-text, .cta .gradient-text {
  background-image: linear-gradient(110deg, #8bcaff, #dc9de8);
}
.method .eyebrow, .coverage .eyebrow { color: #8bcaff; }
.top:focus-within { transform: translateY(0); }
.nav { gap: 1rem; }
.nav > a { flex-shrink: 0; }
.menu { gap: clamp(.75rem, 1.5vw, 1.4rem); }
.menu > a { white-space: nowrap; }
.menu-toggle { min-width: 44px; min-height: 44px; }
.lang a { min-height: 36px; }
.foot-grid > *, .section-head > *, .detail-grid > * { min-width: 0; }
.foot-grid a, .job-meta b, .jd { overflow-wrap: anywhere; }
.foot-bottom { color: #a3b4c9; }
.msg { width: max-content; max-width: calc(100% - 32px); border-radius: 16px; }

/* Dark, quiet surfaces keep the title and controls readable across the hero. */
.job-hero, .legal-hero {
  background: linear-gradient(115deg, #063363 0%, #164f96 40%, #71369c 75%, #8b38ac 100%);
  padding-top: 132px;
}
.job-hero::before { display: none; }
.job-hero .wrap > * { animation: none; }
.job-hero h1 { max-width: 28ch; line-height: 1.1; letter-spacing: -.035em; }
.job-heading-meta { display: flex; flex-wrap: wrap; align-items: center; gap: 1rem 2rem; margin: 1.5rem 0 1.25rem; }
.job-heading-meta .job-back { margin: 0; min-height: 44px; }
.job-heading-meta .eyebrow { padding: .45rem .85rem; border: 1px solid rgba(124,232,183,.3); border-radius: 999px; color: #bbf5d9; font-size: .68rem; letter-spacing: .12em; }
.job-heading-meta .eyebrow::before { background: #8fe5bb; box-shadow: none; animation: none; }
.crumbs { line-height: 1.65; }
.crumbs li { min-width: 0; overflow-wrap: anywhere; }
.job-hero .tags { gap: .6rem; }
.detail { background: #f7f9fc; }
.detail-grid { grid-template-columns: minmax(0, 1.35fr) minmax(0, 1fr); gap: clamp(1.5rem, 4vw, 3.5rem); }
.jd { padding-top: .5rem; }
.jd h2 { line-height: 1.25; }
.apply-card { border-color: #dce4ed; box-shadow: 0 12px 36px rgba(7,17,31,.06); }
.jobs-grid { grid-template-columns: repeat(auto-fill, minmax(min(100%, 330px), 1fr)); }
.job-card { min-width: 0; }
.job-foot { flex-wrap: wrap; }
.jobs-reset, .service-no { color: var(--blue-deep); }
:root #psgh-chat { --chat-fill: var(--gradient-action); }

/* The complete translated navigation needs more room than the old 900px breakpoint. */
@media (max-width: 1200px) {
  .menu-toggle { display: block; }
  .menu > a, .menu > .lang { display: none !important; }
  .menu.open { position: fixed; inset: 82px 20px auto; display: flex; flex-direction: column;
    align-items: stretch; gap: .2rem; padding: 1rem; background: #0b192a;
    border: 1px solid var(--line-dark); border-radius: 20px;
    box-shadow: 0 24px 70px rgba(0,0,0,.3); max-height: calc(100dvh - 100px); overflow-y: auto; }
  .menu.open > a { display: flex !important; padding: .75rem 1rem; }
  .menu.open > .lang { display: flex !important; justify-content: center; margin-top: .6rem; }
  .menu.open .lang a { flex: 1; min-height: 44px; }
  .menu.open .btn { margin-top: .35rem; }
}
@media (max-width: 860px) {
  .detail-grid { grid-template-columns: minmax(0, 1fr); }
}
@media (max-width: 600px) {
  .menu.open { inset: 72px 16px auto; max-height: calc(100dvh - 88px); }
  .hero h1 { font-size: clamp(2.6rem, 10.6vw, 3.3rem); }
  .hero-content { min-width: 0; }
  .job-hero, .legal-hero { padding: 108px 0 44px; }
  .job-hero h1 { font-size: clamp(1.9rem, 7.8vw, 2.6rem); }
  .job-heading-meta { gap: .65rem 1.3rem; margin: 1rem 0; }
  .apply-card { padding: 1.25rem; border-radius: 18px; }
  .apply-consent { padding: 1rem; }
  .apply-meter { top: 72px; }
  .jobs-grid { grid-template-columns: minmax(0, 1fr); }
  .field input:not([type=checkbox]), .field select, .field textarea, .jobs-search input { font-size: 16px; }
}
