/* European page reworks only. The shared Swiss/report styles stay untouched. */
#cover.cover-europe-page .cover-canvas {
  background: #1c1c1c;
}

#cover.cover-europe-page .cover-media::before {
  /* Keep the title legible without flattening the street photograph. */
  background: linear-gradient(90deg, rgb(24 24 24 / 28%), transparent 65%);
}

#cover.cover-europe-page .cover-europe-background {
  inset: 0;
  opacity: .16;
  object-position: 38% 52%;
  filter: saturate(.72) contrast(1.04) brightness(.78);
}

.cover-europe-mosaic, .cover-europe-seams {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
}

.cover-europe-tile {
  position: absolute;
  display: block;
  overflow: hidden;
  /* Keep the existing photo opacity, but composite it over an opaque backing. */
  background: #1c1c1c;
}

.cover-europe-tile img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
  opacity: .46;
  filter: saturate(.72) contrast(1.05) brightness(.74);
}

/* Coordinates share the report's fixed 1280 × 800 canvas. */
.cover-europe-london, .cover-europe-bridge, .cover-europe-city {
  width: 21.875%;
  height: 33.333333%;
  clip-path: polygon(0 0, 100% 0, 50% 100%);
}
.cover-europe-london { left: 56.25%; top: 0; }
.cover-europe-london img {
  object-position: 25% 60%;
  transform: scale(2.7);
  transform-origin: 50% 85%;
}
.cover-europe-bridge { left: 78.125%; top: 0; }
.cover-europe-bridge img { object-position: 70% 45%; }
.cover-europe-city { left: 67.1875%; top: 33.333333%; }
.cover-europe-city img {
  object-position: 50% 46%;
  transform: scale(1.16);
  transform-origin: 50% 100%;
}

.cover-europe-castle {
  left: 67.1875%;
  top: 0;
  width: 21.875%;
  height: 33.333333%;
  clip-path: polygon(50% 0, 100% 100%, 0 100%);
}
.cover-europe-castle img {
  object-fit: cover;
  object-position: 50% 0%;
  transform: translate(-2%, 7%) scale(1.2);
  transform-origin: 50% 25%;
}

.cover-europe-lake {
  left: 45.3125%;
  top: 33.333333%;
  width: 43.75%;
  height: 66.666667%;
  clip-path: polygon(50% 0, 100% 100%, 0 100%);
}
.cover-europe-lake img { object-position: 48% 56%; }

.cover-europe-berlin {
  left: 78.125%;
  top: 0;
  width: 21.875%;
  height: 100%;
  clip-path: polygon(100% 0, 100% 100%, 50% 100%, 0 66.666667%);
}
.cover-europe-berlin img { object-position: 43% 50%; }

.cover-europe-seams {
  z-index: 2;
  fill: none;
  stroke: rgb(255 255 255 / 24%);
  stroke-width: 1.5;
  stroke-linejoin: round;
}

#report #cover.cover-europe-page .cover-copy {
  top: .5rem;
  width: 56%;
}

#report #cover.cover-europe-page .cover-deck {
  position: absolute;
  z-index: 3;
  top: calc(var(--page-pad-y) + 0.7rem);
  left: var(--page-pad-x);
  margin: 0;
}

#cover.cover-europe-page .cover-copy h2 {
  font-size: 5.5rem;
  line-height: .98;
}

#cover.cover-europe-page .cover-europe-heading-region {
  color: var(--accent);
}

#cover.cover-europe-page .cover-europe-heading-prefix {
  display: inline;
}

#cover.cover-europe-page .cover-meta {
  grid-template-columns: 7.5rem max-content;
  grid-template-rows: auto;
  column-gap: 1rem;
  width: max-content;
  margin-top: .9rem;
  /* Match the visible R stem, rather than the heading's font side bearing. */
  margin-left: .3rem;
}

#cover.cover-europe-page .cover-meta::before {
  width: 7.5rem;
}

#cover.cover-europe-page .cover-meta strong {
  font-size: 1.77rem;
}

.report-header {
  grid-template-columns: auto minmax(0, 1fr) auto auto;
}

.report-header .section-nav {
  justify-self: end;
  justify-content: flex-end;
}

.europe-report-brand {
  text-decoration: none;
  font-weight: 400;
}

.europe-report-brand .europe-report-title-text {
  color: inherit;
}

.europe-report-brand:focus-visible {
  outline: 2px solid var(--accent);
  outline-offset: 4px;
}

@media (max-width: 1500px) {
  .report-header {
    grid-template-columns: minmax(0, 1fr) auto auto;
  }

  .report-header .section-nav {
    justify-self: center;
    justify-content: center;
  }
}
.about-boards-canvas {
  isolation: isolate;
  background:
    radial-gradient(circle at 82% 26%, rgba(41, 132, 230, 0.19), transparent 42%),
    radial-gradient(circle at 24% 88%, rgba(27, 119, 220, 0.12), transparent 45%),
    linear-gradient(135deg, #171b21 0%, #161b22 50%, #111820 100%);
}

.about-boards-content {
  position: relative;
  z-index: 1;
  display: flex;
  height: 100%;
  flex-direction: column;
  justify-content: center;
  gap: 1.4rem;
}

.about-boards-heading h2 {
  margin: 0;
  padding-left: 1.65rem;
  font-size: 3.9rem;
  font-weight: 600;
  letter-spacing: -0.055em;
  line-height: 1;
}

.about-boards-statement,
.about-boards-panel {
  border: 1px solid rgba(123, 188, 248, 0.22);
  border-radius: 1rem;
  background:
    radial-gradient(circle at 77% 32%, rgba(66, 150, 237, 0.16), transparent 45%),
    linear-gradient(125deg, rgba(30, 91, 156, 0.28), rgba(10, 24, 42, 0.48));
  box-shadow: 0 1.2rem 3rem rgba(0, 0, 0, 0.16);
}

.about-boards-statement {
  margin: 0;
  padding: 1.2rem 1.65rem;
  font-size: 1.85rem;
  font-weight: 600;
  letter-spacing: -0.035em;
  line-height: 1.2;
  white-space: nowrap;
}

.about-boards-statement span {
  display: inline;
}

.about-boards-heading em,
.about-boards-statement em {
  color: var(--accent);
  font-style: normal;
}

html[data-locale="de"] .about-boards-statement,
html[data-locale="fr"] .about-boards-statement {
  font-size: 1.65rem;
}

.about-boards-intro {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 11rem;
  align-items: center;
  gap: 2.5rem;
  padding: 0 1.65rem;
}

.about-boards-intro p {
  margin: 0;
  color: rgba(238, 238, 238, 0.78);
  font-size: 1.22rem;
  line-height: 1.5;
}

.about-boards-mascot {
  margin: 0;
  justify-self: center;
}

.about-boards-mascot img {
  display: block;
  width: 8.4rem;
  height: 11.2rem;
  object-fit: contain;
  filter: drop-shadow(0 0.6rem 1rem rgba(0, 0, 0, 0.18));
}

.about-boards-panel {
  position: relative;
  padding: 1.4rem 1.65rem;
}

.about-boards-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 1.1rem;
  margin: 0;
  padding: 0;
  list-style: none;
}

.about-board-card {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 3.805rem;
  min-height: 5.6rem;
  align-items: center;
  gap: 0.6rem;
  padding: 0.8rem;
  border: 1px solid rgba(150, 203, 253, 0.27);
  border-radius: 0.85rem;
  color: var(--paper);
  background: rgba(16, 46, 78, 0.28);
  transition: border-color 180ms ease, background-color 180ms ease;
}

.about-board-link {
  display: flex;
  min-width: 0;
  min-height: 3.8rem;
  align-items: center;
  gap: 0.65rem;
  color: var(--paper);
  text-decoration: none;
}

.about-board-flag {
  position: relative;
  width: 3.1rem;
  height: 3.1rem;
  flex: 0 0 auto;
  overflow: hidden;
  border-radius: 50%;
}

.about-board-flag::after {
  content: "";
  position: absolute;
  inset: 0;
  border-radius: inherit;
  /* Draw over the photo, with one shared outer clip instead of competing edges. */
  box-shadow: inset 0 0 0 1px #fff;
  pointer-events: none;
}

.about-board-flag img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.about-board-name {
  min-width: 0;
  font-size: 1.15rem;
  font-weight: 700;
  letter-spacing: -0.025em;
  white-space: nowrap;
}

.about-board-domain {
  color: var(--accent);
}

.about-board-socials {
  display: grid;
  /* Equilateral center spacing keeps the visible gaps equal in this triangle. */
  grid-template-columns: repeat(2, 1.905rem);
  grid-template-rows: repeat(2, 1.9rem);
  column-gap: 0;
  row-gap: 0.3rem;
}

.about-board-social {
  display: grid;
  width: 1.9rem;
  height: 1.9rem;
  place-items: center;
  border: 1px solid rgba(150, 203, 253, 0.25);
  border-radius: 50%;
  background: rgba(72, 132, 195, 0.16);
  transition: border-color 180ms ease, background-color 180ms ease;
}

.about-board-social:first-child {
  grid-row: 1 / 3;
  align-self: center;
}

.about-board-social img {
  display: block;
  width: 0.95rem;
  height: 0.95rem;
  object-fit: contain;
  filter: brightness(0) invert(1);
  opacity: 0.85;
}

@media (hover: hover) {
  .about-board-card:hover {
    border-color: rgba(150, 203, 253, 0.55);
    background: rgba(38, 93, 151, 0.34);
  }

  .about-board-social:hover {
    border-color: rgba(150, 203, 253, 0.65);
    background: rgba(72, 132, 195, 0.35);
  }
}

.juniors-chapter-page .chapter-figure img {
  transform: translateX(3%) scale(1.08);
  transform-origin: center;
}
.job-change-chapter-page .chapter-figure {
  left: -1px;
}
.job-change-chapter-page .chapter-figure img {
  object-position: center;
  transform: none;
}
.salary-chapter-page .chapter-figure img {
  object-position: center;
  transform: scale(1.08);
  transform-origin: center;
}

@media (prefers-reduced-motion: reduce) {
  .about-board-card,
  .about-board-social {
    transition: none;
  }
}

/* Page 29: developer-product advertising, independent of the Swiss partner page. */
/* Country-aware salary overview; no changes to the copied salary pages. */
#salary-overview .salary-panel-stat { flex: 0 0 14.5rem; white-space: nowrap; }
.external-link-arrow { display: inline-flex; flex: none; width: 1em; height: 1em; align-items: center; justify-content: center; }
.external-link-arrow svg { display: block; width: 100%; height: 100%; }
.js #salary-overview .salary-overview-chart-section.reveal:not(.is-bar-revealed) .salary-dist-bar { clip-path: inset(0 50% round 0.75rem); }
.js #salary-overview .salary-overview-chart-section.reveal.is-bar-revealed .salary-dist-bar { clip-path: inset(0 0 round 0.75rem); }
.js #salary-overview .salary-overview-chart-section.reveal :is(.salary-panel-label,.salary-panel-stat,.salary-dist-bottom-labels > span,.salary-dist-inner-labels > span) { opacity: 0; scale: 1; translate: none; transition: opacity 300ms ease 620ms; }
.js #salary-overview .salary-overview-chart-section.reveal.is-visible :is(.salary-panel-label,.salary-panel-stat,.salary-dist-bottom-labels > span,.salary-dist-inner-labels > span) { opacity: 1; }
@media (prefers-reduced-motion: reduce) {
  .js #salary-overview .salary-overview-chart-section.reveal .salary-dist-bar { clip-path: none; }
  .js #salary-overview .salary-overview-chart-section.reveal.is-visible :is(.salary-panel-label,.salary-panel-stat,.salary-dist-bottom-labels > span,.salary-dist-inner-labels > span) { opacity: 1; transition: none; }
}
#salary-overview .salary-overview-chart-section { position: relative; }
.salary-currency-row { position: absolute; top: calc(100% + 0.5rem); right: 0; display: flex; justify-content: flex-end; }
.salary-currency-row[hidden] { display: none; }
.salary-currency-selector { display: inline-flex; gap: 0.1rem; padding: 0.3rem; border: 1px solid rgba(255,255,255,0.12); border-radius: 0.55rem; background: rgba(30,30,30,0.65); }
.salary-currency-btn { appearance: none; padding: 0.2rem 0.5rem; border: 0; border-radius: 0.3rem; background: transparent; color: var(--muted); font-size: 0.72rem; font-weight: 700; font-family: inherit; cursor: pointer; transition: color 180ms ease, background-color 180ms ease; }
.salary-currency-btn.is-active { color: var(--ink); background: var(--accent); cursor: default; }
.salary-currency-btn:not(.is-active):hover { color: var(--paper); }
.salary-currency-btn:focus-visible { outline: 2px solid var(--accent); outline-offset: 2px; }
@media (prefers-reduced-motion: reduce) { .salary-currency-btn { transition: none; } }
#salary-overview.is-country-leaving { --country-text-warp: salary-diff-out 140ms ease-in both; }
#salary-overview.is-country-entering { --country-text-warp: salary-diff-in 220ms ease-out both; }
#salary-overview:is(.is-country-leaving,.is-country-entering) :is(.salary-heading-flag,.salary-overview-heading h2 > span:last-child,[data-salary-lead],[data-salary-summary],[data-salary-explanation],[data-salary-source-note],.salary-partner-credit,.salary-partner-brand img,.salary-partner-arrow,.salary-panel-header,.salary-dist-bottom-labels,.salary-currency-selector) { animation: var(--country-text-warp); }
@media (prefers-reduced-motion: reduce) { #salary-overview:is(.is-country-leaving,.is-country-entering) :is(.salary-heading-flag,.salary-overview-heading h2 > span:last-child,[data-salary-lead],[data-salary-summary],[data-salary-explanation],[data-salary-source-note],.salary-partner-credit,.salary-partner-brand img,.salary-partner-arrow,.salary-panel-header,.salary-dist-bottom-labels,.salary-currency-selector) { animation: none; } }
#salary-overview .salary-overview-heading h2 { display: flex; align-items: center; gap: 1rem; font-size: 3.35rem; }
:is(#salary-overview,#salary-experience-level,#salary-technology) .salary-heading-flag { display: block; flex: 0 0 3.1rem; width: 3.1rem; height: 3.1rem; }
:is(#salary-overview,#salary-experience-level,#salary-technology) .salary-heading-flag img,
.salary-country-flag img { display: block; width: 100%; height: 100%; object-fit: cover; }
#salary-overview .salary-overview-content { gap: 1.25rem; }
#salary-overview .salary-overview-lead-copy h3 { font-size: 1.95rem; }
#salary-overview .salary-inline-increase { display: inline-block; padding: 0.04em 0.35em; border: 1px solid rgba(68, 204, 136, 0.42); border-radius: 0.35em; background: rgba(68, 204, 136, 0.1); color: #44cc88; font-weight: 600; line-height: 1.3; }
#salary-overview .salary-partner-link { display: grid; grid-template-columns: 1rem minmax(0,1fr) 1rem; align-items: center; gap: 0.9rem; padding: 1rem 1.25rem; border: 2px solid rgba(255,255,255,0.16); border-radius: 0.75rem; color: var(--paper); text-decoration: none; background: rgba(255,255,255,0.025); transition: border-color 180ms ease, background-color 180ms ease; }
#salary-overview .salary-partner-brand { grid-column: 2; display: flex; align-items: center; justify-content: center; gap: 0.9rem; min-width: 0; }
#salary-overview .salary-partner-link[hidden], #salary-overview [data-salary-source-note][hidden] { display: none; }
#salary-overview .salary-partner-credit { flex: none; padding: 0.2rem 0.4rem; border-radius: 0.2rem; background: rgba(255,255,255,0.1); font-size: 0.8rem; font-weight: 700; text-transform: uppercase; letter-spacing: 0.04em; }
#salary-overview .salary-partner-link img { display: block; width: 15rem; max-width: 65%; height: auto; translate: 0 -0.05rem; }
.js #salary-overview .salary-overview-editorial.reveal .salary-partner-brand img { opacity: 0; filter: blur(5px); transition: opacity 300ms ease 160ms, filter 300ms ease 160ms; }
.js #salary-overview .salary-overview-editorial.reveal.is-visible .salary-partner-brand img { opacity: 1; filter: blur(0); }
@media (prefers-reduced-motion: reduce) { .js #salary-overview .salary-overview-editorial.reveal.is-visible .salary-partner-brand img { opacity: 1; filter: none; transition: none; } }
#salary-overview .salary-partner-arrow { grid-column: 3; justify-self: end; font-size: 1rem; transition: transform 180ms ease; }
#salary-overview .salary-partner-link:hover, #salary-overview .salary-partner-link:focus-visible { border-color: rgba(255,255,255,0.32); background: rgba(255,255,255,0.055); }
#salary-overview .salary-partner-link:focus-visible { outline: 2px solid var(--paper); outline-offset: 3px; }
#salary-overview .salary-partner-link:hover .salary-partner-arrow, #salary-overview .salary-partner-link:focus-visible .salary-partner-arrow { transform: translate(0.12rem,-0.12rem); }
@media (prefers-reduced-motion: reduce) { #salary-overview .salary-partner-link, #salary-overview .salary-partner-arrow { transition: none; } }
#salary-overview .salary-country-controls { justify-content: space-between; gap: 1rem; }
.salary-country-selector { display: inline-flex; align-items: center; gap: 0.35rem; padding: 0.3rem 0.35rem; border: 1px solid rgba(255,255,255,0.12); border-radius: 0.75rem; background: rgba(30,30,30,0.65); }
#salary-overview .salary-year-btn, .salary-country-btn { min-height: 2.15rem; }
.salary-country-btn { appearance: none; display: flex; align-items: center; gap: 0; padding: 0.42rem 0.6rem; border: 0; border-radius: 0.55rem; background: transparent; color: var(--muted); font-family: inherit; font-weight: 700; font-size: 0.92rem; letter-spacing: 0.04em; cursor: pointer; transition: color 200ms ease, background 200ms ease, transform 200ms ease, box-shadow 200ms ease; }
.salary-country-btn { position: relative; }
.salary-country-flag { position: relative; z-index: 1; display: block; flex: none; width: 1.35rem; height: 1.35rem; }
.salary-country-btn:not(.is-active)::before { content: ""; position: absolute; z-index: 0; top: 50%; left: 50%; width: 2.5rem; height: 2.5rem; transform: translate(-50%,-50%); background: radial-gradient(circle,transparent 0 0.675rem,rgba(255,193,50,0.18) 0.7rem,transparent 1.22rem); opacity: 0; pointer-events: none; transition: opacity 240ms ease; }
.salary-country-name { max-width: 0; overflow: hidden; opacity: 0; white-space: nowrap; transition: max-width 240ms ease, opacity 200ms ease, margin-left 240ms ease; }
.salary-country-btn.is-active { color: var(--ink); background: var(--accent); box-shadow: 0 2px 12px rgba(255,193,50,0.32); cursor: default; }
.salary-country-btn.is-active .salary-country-name { max-width: 16rem; opacity: 1; margin-left: 0.4rem; }
.salary-country-btn:focus-visible { outline: 2px solid var(--accent); outline-offset: 2px; }
#salary-overview .salary-year-btn:disabled { opacity: 0.3; cursor: not-allowed; background: transparent; color: var(--muted); }
@media (hover: hover) {
  .salary-country-btn:not(.is-active):hover { color: var(--paper); }
  .salary-country-btn:not(.is-active):hover::before { opacity: 1; }
}
.salary-country-btn:not(.is-active):focus-visible::before { opacity: 1; }
/* Experience-level controls mirror the overview, with their fixed copy untouched. */
.tech-badge.tech-scala { --tech-badge-color: #b94b68; }
#salary-technology .salary-tech-heading { grid-row: 1; grid-column: 1; top: -1.15rem; margin-bottom: 0; }
#salary-technology .salary-tech-heading h2 { display: flex; align-items: center; justify-content: flex-end; gap: 0.8rem; font-size: 4.2rem; line-height: 3.8rem; white-space: normal; }
#salary-technology .salary-tech-country-controls { grid-row: 1; grid-column: 1; align-self: end; display: flex; justify-content: flex-start; width: calc(100% + (2 * var(--page-pad-x))); margin-left: calc(-1 * var(--page-pad-x)); }
#salary-technology .salary-tech-content { display: grid; grid-template-columns: minmax(0,1fr); align-content: center; gap: 0.75rem; }
#salary-technology .salary-table-card { grid-row: 2; grid-column: 1; position: relative; }
#salary-technology { --table-flag-left: 220,45,45; --table-flag-middle: 245,245,245; --table-flag-right: 245,245,245; --table-flag-middle-opacity: 0; }
#salary-technology[data-salary-country="ch"] { --table-flag-middle: 220,45,45; --table-flag-right: 220,45,45; --table-flag-left-opacity: 0.1; --table-flag-right-opacity: 0.025; }
#salary-technology[data-salary-country="de"] { --table-flag-left: 207,49,49; --table-flag-right: 231,172,38; }
#salary-technology[data-salary-country="uk"] { --table-flag-left: 48,82,171; --table-flag-right: 207,49,65; }
#salary-technology[data-salary-country="fr"] { --table-flag-left: 48,82,171; --table-flag-middle: 245,245,245; --table-flag-right: 207,49,65; --table-flag-middle-opacity: 0.065; }
#salary-technology[data-salary-country="nl"] { --table-flag-left: 207,49,65; --table-flag-middle: 245,245,245; --table-flag-right: 48,82,171; --table-flag-middle-opacity: 0.065; }
#salary-technology[data-salary-country="ro"] { --table-flag-left: 48,82,171; --table-flag-middle: 231,172,38; --table-flag-right: 207,49,49; --table-flag-middle-opacity: 0.065; }
#salary-technology[data-salary-country="pl"] { --table-flag-left: 245,245,245; --table-flag-right: 207,49,65; }
#salary-technology .salary-table-card {
  background:
    radial-gradient(ellipse at 8% 0%, rgba(var(--table-flag-left),var(--table-flag-left-opacity,0.08)), transparent 58%),
    radial-gradient(ellipse at 50% 0%, rgba(var(--table-flag-middle),var(--table-flag-middle-opacity)), transparent 52%),
    radial-gradient(ellipse at 92% 0%, rgba(var(--table-flag-right),var(--table-flag-right-opacity,0.08)), transparent 58%),
    rgba(55,55,55,0.16);
  background-size: 100% 11rem, 100% 11rem, 100% 11rem, auto;
  background-repeat: no-repeat;
}
#salary-technology .salary-currency-row { position: absolute; top: calc(100% + 0.5rem); right: 0; }
.js #salary-technology .salary-table-card.reveal .salary-currency-selector { opacity: 0; scale: 0.9; transform-origin: right center; pointer-events: none; }
.js #salary-technology .salary-table-card.reveal.is-visible .salary-currency-selector { opacity: 1; scale: 1; pointer-events: auto; transition: opacity 220ms ease 980ms, scale 300ms cubic-bezier(0.16,1,0.3,1) 980ms; }
#salary-technology.is-country-leaving .salary-currency-selector { animation: salary-diff-out 140ms ease-in both; }
#salary-technology.is-country-entering .salary-currency-selector { animation: salary-diff-in 220ms ease-out both; }
#salary-technology .salary-tech-table { transform-origin: center; }
#salary-technology.is-country-leaving .salary-heading-flag { animation: salary-table-country-out 140ms ease-in both; }
#salary-technology.is-country-entering .salary-heading-flag { animation: salary-table-country-in 220ms ease-out both; }
#salary-technology:is(.is-country-leaving,.is-currency-leaving) .salary-tech-table { animation: salary-table-country-out 140ms ease-in both; }
#salary-technology:is(.is-country-entering,.is-currency-entering) .salary-tech-table { animation: salary-table-country-in 220ms ease-out both; }
@keyframes salary-table-country-out {
  from { filter: blur(0); transform: scale(1); }
  to { filter: blur(9px); transform: scale(1.012); }
}
@keyframes salary-table-country-in {
  from { filter: blur(9px); transform: scale(1.012); }
  to { filter: blur(0); transform: scale(1); }
}
.js #salary-technology .salary-tech-country-controls.reveal .salary-country-selector { opacity: 0; scale: 0.9; transform-origin: left center; pointer-events: none; }
.js #salary-technology .salary-tech-country-controls.reveal.is-visible .salary-country-selector { opacity: 1; scale: 1; pointer-events: auto; transition: opacity 220ms ease 500ms, scale 300ms cubic-bezier(0.16,1,0.3,1) 500ms; }
@media (prefers-reduced-motion: reduce) {
  #salary-technology:is(.is-country-leaving,.is-country-entering,.is-currency-leaving,.is-currency-entering) :is(.salary-tech-table,.salary-heading-flag,.salary-currency-selector) { animation: none; }
  .js #salary-technology .salary-table-card.reveal.is-visible .salary-currency-selector { opacity: 1; scale: 1; transition: none; }
  .js #salary-technology .salary-tech-country-controls.reveal.is-visible .salary-country-selector { opacity: 1; scale: 1; transition: none; }
}
#salary-experience-level .salary-overview-heading h2 { display: flex; align-items: center; justify-content: flex-end; width: 100%; gap: 1rem; }
#salary-experience-level .salary-overview-chart-section { position: relative; }
#salary-experience-level .salary-country-controls { justify-content: space-between; gap: 1rem; }
#salary-experience-level .salary-currency-row { left: auto; right: 0; justify-content: flex-end; }
#salary-experience-level .salary-panel-stat { flex: 0 0 14.5rem; white-space: nowrap; }
#salary-experience-level.is-country-leaving { --country-text-warp: salary-diff-out 140ms ease-in both; }
#salary-experience-level.is-country-entering { --country-text-warp: salary-diff-in 220ms ease-out both; }
#salary-experience-level:is(.is-country-leaving,.is-country-entering) :is([data-salary-experience-explanation],.salary-panel-header,.salary-dist-bottom-labels,.salary-currency-selector) { animation: var(--country-text-warp); }
#salary-experience-level.is-country-leaving .salary-heading-flag { animation: salary-table-country-out 140ms ease-in both; }
#salary-experience-level.is-country-entering .salary-heading-flag { animation: salary-table-country-in 220ms ease-out both; }
.js #salary-experience-level .salary-overview-chart-section.reveal:not(.is-bar-revealed) .salary-dist-bar { clip-path: inset(0 50% round 0.75rem); }
.js #salary-experience-level .salary-overview-chart-section.reveal.is-bar-revealed .salary-dist-bar { clip-path: inset(0 0 round 0.75rem); }
.js #salary-experience-level .salary-overview-chart-section.reveal :is(.salary-panel-label,.salary-panel-stat,.salary-dist-bottom-labels > span,.salary-dist-inner-labels > span) { opacity: 0; transition: opacity 300ms ease 620ms; }
.js #salary-experience-level .salary-overview-chart-section.reveal.is-visible :is(.salary-panel-label,.salary-panel-stat,.salary-dist-bottom-labels > span,.salary-dist-inner-labels > span) { opacity: 1; }
.js #salary-experience-level .salary-overview-chart-section.reveal :is(.salary-country-selector,.salary-currency-selector) { opacity: 0; scale: 0.9; transform-origin: right center; pointer-events: none; }
#salary-experience-level .salary-experience-selector { transform-origin: left center; }
#salary-experience-level [data-salary-experience-explanation].is-diff-leaving { animation: salary-diff-out 140ms ease-in both; }
#salary-experience-level [data-salary-experience-explanation].is-diff-entering { animation: salary-diff-in 220ms ease-out both; }
.js #salary-experience-level .salary-overview-chart-section.reveal.is-visible :is(.salary-country-selector,.salary-currency-selector) { opacity: 1; scale: 1; pointer-events: auto; transition: opacity 220ms ease 980ms, scale 300ms cubic-bezier(0.16,1,0.3,1) 980ms; }
@media (prefers-reduced-motion: reduce) {
  #salary-experience-level [data-salary-experience-explanation]:is(.is-diff-leaving,.is-diff-entering) { animation: none; }
  #salary-experience-level:is(.is-country-leaving,.is-country-entering) :is(.salary-heading-flag,[data-salary-experience-explanation],.salary-panel-header,.salary-dist-bottom-labels,.salary-currency-selector) { animation: none; }
  .js #salary-experience-level .salary-overview-chart-section.reveal .salary-dist-bar { clip-path: none; }
  .js #salary-experience-level .salary-overview-chart-section.reveal.is-visible :is(.salary-panel-label,.salary-panel-stat,.salary-dist-bottom-labels > span,.salary-dist-inner-labels > span,.salary-country-selector,.salary-currency-selector) { opacity: 1; scale: 1; transition: none; }
}
.js #salary-overview .salary-overview-chart-section.reveal :is(.salary-country-selector,.salary-currency-selector) { opacity: 0; scale: 0.9; transform-origin: right center; pointer-events: none; }
.js #salary-overview .salary-overview-chart-section.reveal.is-visible :is(.salary-country-selector,.salary-currency-selector) { opacity: 1; scale: 1; pointer-events: auto; transition: opacity 220ms ease 980ms, scale 300ms cubic-bezier(0.16,1,0.3,1) 980ms; }
@media (prefers-reduced-motion: reduce) {
  .salary-country-name, .salary-country-btn, .salary-country-btn::before { transition: none; }
  .js #salary-overview .salary-overview-chart-section.reveal.is-visible :is(.salary-country-selector,.salary-currency-selector) { opacity: 1; scale: 1; pointer-events: auto; transition: none; }
}
.advertising-page .advertising-canvas {
  background:
    radial-gradient(ellipse at 86% 10%, rgba(64, 154, 238, 0.28), transparent 55%),
    linear-gradient(130deg, #103b67, #15578f 58%, #113b66);
}

.advertising-content {
  position: relative;
  z-index: 1;
  display: flex;
  height: 100%;
  flex-direction: column;
  justify-content: center;
  gap: 1.65rem;
}

/* Retain the content position after moving its topic label to the standard page anchor. */
.advertising-heading { padding-top: calc(0.72rem * 1.4 + 0.9rem); }
.advertising-heading h2 {
  margin: 0;
  font-size: 3.6rem;
  font-weight: 600;
  letter-spacing: -0.055em;
  line-height: 1.02;
}
.advertising-heading em { color: var(--accent); font-style: normal; }
.advertising-lede {
  max-width: 62rem;
  margin: 1rem 0 0;
  color: rgba(255, 255, 255, 0.78);
  font-size: 1.2rem;
  line-height: 1.4;
}

.advertising-layout {
  display: grid;
  grid-template-columns: minmax(0, 1.12fr) minmax(0, 1fr);
  gap: 1.5rem;
}
.advertising-audience,
.advertising-stat,
.advertising-recruit {
  border: 1px solid rgba(184, 221, 255, 0.25);
  border-radius: 1rem;
  background: rgba(6, 27, 48, 0.24);
  box-shadow: 0 1rem 2.5rem rgba(0, 0, 0, 0.1);
}
.advertising-audience {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  justify-content: center;
  gap: 1.1rem;
  padding: 1.65rem;
}
.advertising-audience h3 { margin: 0; font-size: 1.55rem; font-weight: 600; letter-spacing: -0.03em; }
.advertising-audience > p { margin: 0; font-size: 1.04rem; line-height: 1.5; color: rgba(255, 255, 255, 0.78); }
.advertising-countries {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 0.65rem 1rem;
  width: 100%;
  margin: 0;
  padding: 0;
  list-style: none;
}
.advertising-country { display: flex; align-items: center; gap: 0.45rem; font-size: 0.83rem; }
.advertising-country-flag { position: relative; display: block; flex: none; width: 1.45rem; height: 1.45rem; overflow: hidden; border-radius: 50%; }
.advertising-country-flag::after { content: ""; position: absolute; inset: 0; border: 1px solid rgba(184, 221, 255, 0.25); border-radius: inherit; pointer-events: none; }
.advertising-country-flag img { display: block; width: 100%; height: 100%; object-fit: cover; }
.advertising-cta {
  position: relative;
  overflow: hidden;
  isolation: isolate;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  gap: 0.25rem;
  margin-top: 0.25rem;
  padding: 0.7rem 1.8rem;
  border: 1.5px solid rgba(184, 221, 255, 0.25);
  border-radius: 0.75rem;
  background: #17466f;
  color: rgba(255, 255, 255, 0.93);
  font-size: 1.35rem;
  font-weight: 600;
  letter-spacing: 0.025em;
  line-height: 1.35;
  text-decoration: none;
  transition: background-color 240ms ease, border-color 240ms ease;
}
.advertising-cta::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: -1;
  pointer-events: none;
  background: linear-gradient(105deg, transparent 40%, rgba(255, 255, 255, 0.07) 50%, transparent 60%);
  transform: translateX(-120%);
  animation: advertising-reflection 6s ease-in-out infinite;
}
@keyframes advertising-reflection {
  0%, 20% { transform: translateX(-120%); }
  65%, 100% { transform: translateX(120%); }
}
.advertising-cta:hover::before,
.advertising-cta:focus-visible::before { animation: none; opacity: 0; }
.advertising-cta:focus-visible,
.advertising-recruit:focus-visible { outline: 2px solid var(--accent); outline-offset: 4px; }
@media (hover: hover) {
  .advertising-cta:hover { background: #225587; border-color: rgba(150, 203, 253, 0.47); }
}

.advertising-stats { display: grid; grid-template-columns: minmax(0, 1.6fr) minmax(0, 1fr); gap: 1rem; }
.advertising-stat { padding: 1.1rem 1.35rem; display: flex; flex-direction: column; justify-content: center; }
.advertising-stat-report { grid-column: 1 / -1; }
.advertising-stat > p { margin: 0 0 0.45rem; font-size: 0.78rem; text-transform: uppercase; letter-spacing: 0.13em; color: var(--accent); }
.advertising-stat > strong { font-size: 2.6rem; font-weight: 600; letter-spacing: -0.055em; line-height: 1.1; white-space: nowrap; }
.advertising-stat-report > strong { font-size: 4.25rem; }
.advertising-stat > span { font-size: 0.91rem; color: rgba(255, 255, 255, 0.8); }
.advertising-recruit { position: relative; display: grid; grid-template-columns: auto auto minmax(0, 1fr); align-items: center; gap: 1.35rem; padding: 0.9rem 1.7rem; color: inherit; text-decoration: none; transition: background-color 240ms ease, border-color 240ms ease; }
.js .advertising-recruit.reveal { transition: opacity 620ms ease, transform 620ms cubic-bezier(0.2, 0.8, 0.2, 1), background-color 240ms ease, border-color 240ms ease; }
@media (hover: hover) {
  .advertising-recruit:hover { border-color: rgba(150, 203, 253, 0.47); background-color: rgba(28, 71, 116, 0.29); }
}
.advertising-recruit-mascot { display: block; width: 5rem; height: 5rem; padding: 0.2rem; overflow: hidden; border: 1.5px solid rgba(184, 221, 255, 0.25); border-radius: 50%; background: #17466f; }
.advertising-recruit-mascot img { display: block; width: 100%; height: 100%; object-fit: contain; transform: translateX(-0.15rem); }
.advertising-recruit-brand { width: 13.75rem; margin: 0; transform: translateY(0.15rem); }
.advertising-recruit-brand img { display: block; width: 94%; height: auto; filter: brightness(0) invert(1); }
.advertising-recruit-description { display: inline-flex; align-items: center; gap: 0.25rem; justify-self: end; width: max-content; max-width: 100%; padding: 0.7rem 1.8rem; border: 1.5px solid rgba(184, 221, 255, 0.25); border-radius: 0.75rem; background: #17466f; font-size: 1.35rem; font-weight: 600; letter-spacing: 0.025em; line-height: 1.35; color: rgba(255, 255, 255, 0.93); }
.advertising-recruit-arrow { position: relative; top: 0.08rem; flex: none; font-size: 0.85rem; color: inherit; transition: transform 440ms cubic-bezier(0.16, 1, 0.3, 1); }
@media (hover: hover) and (pointer: fine) {
  .advertising-cta:hover .advertising-recruit-arrow,
  .advertising-recruit:hover .advertising-recruit-arrow { transform: translate(0.12rem, -0.12rem); }
}
.advertising-cta:focus-visible .advertising-recruit-arrow,
.advertising-recruit:focus-visible .advertising-recruit-arrow { transform: translate(0.12rem, -0.12rem); }
html[data-locale="de"] .advertising-heading h2,
html[data-locale="fr"] .advertising-heading h2 { font-size: 3.25rem; }
html[data-locale="de"] .advertising-country,
html[data-locale="fr"] .advertising-country { font-size: 0.78rem; }

@media (prefers-reduced-motion: reduce) {
  .advertising-cta::before { animation: none; display: none; }
  .advertising-cta,
  .advertising-recruit,
  .js .advertising-recruit.reveal,
  .advertising-recruit-arrow { transition: none; }
  .advertising-cta:hover .advertising-recruit-arrow,
  .advertising-cta:focus-visible .advertising-recruit-arrow,
  .advertising-recruit:hover .advertising-recruit-arrow,
  .advertising-recruit:focus-visible .advertising-recruit-arrow { transform: none; }
}