.resume-page-body { background: var(--main-darker); }
.resume-site-header { background: rgba(0, 74, 74, .9); backdrop-filter: blur(8px); }
.resume-site-header #site-nav a[aria-current="page"] { color: var(--link); }
.resume-site-header #site-nav a[aria-current="page"]::before,
.resume-site-header #site-nav a[aria-current="page"]::after { opacity: 1; }

.resume-hero {
  position: relative;
  display: grid;
  grid-template-columns: minmax(0, 1.45fr) minmax(280px, .55fr);
  align-items: center;
  gap: clamp(3rem, 8vw, 8rem);
  min-height: 960px;
  overflow: hidden;
  padding: 150px var(--pad) 90px;
  background: var(--main-darker);
  color: white;
}
.resume-hero::after {
  content: '+';
  position: absolute;
  right: 3vw;
  bottom: -4rem;
  color: rgba(19, 175, 240, .2);
  font: 500 clamp(12rem, 25vw, 25rem)/1 var(--ui);
}
.resume-hero-grid {
  position: absolute;
  inset: 84px 0 0;
  pointer-events: none;
  background-image:
    linear-gradient(rgba(135, 217, 217, .06) 1px, transparent 1px),
    linear-gradient(90deg, rgba(135, 217, 217, .06) 1px, transparent 1px);
  background-size: 42px 42px;
  mask-image: linear-gradient(90deg, black, transparent 88%);
}
.resume-hero-copy { position: relative; z-index: 2; }
.resume-hero h1 {
  margin: .05em 0 .12em;
  color: white;
  font: 700 clamp(5rem, 10vw, 10rem)/.78 var(--display);
  letter-spacing: -.08em;
}
.resume-hero h1 em {
  color: var(--text);
  font-style: normal;
  font-weight: 400;
  text-decoration: underline var(--link) .045em;
  text-underline-offset: .1em;
  text-decoration-skip-ink: auto;
}
.resume-role {
  margin: 2rem 0 .65rem;
  color: var(--link);
  font: 600 clamp(.75rem, 1.1vw, 1rem) var(--ui);
  text-transform: uppercase;
  letter-spacing: .1em;
}
.resume-intro { max-width: 700px; margin: 0; color: var(--text); font-size: clamp(1.05rem, 1.8vw, 1.35rem); }
.resume-actions { display: flex; flex-wrap: wrap; gap: 1rem; margin-top: 2.2rem; }
.resume-print {
  color: white;
  background: transparent;
  border: 1px solid var(--text);
  cursor: pointer;
  clip-path: polygon(0 0, calc(100% - 13px) 0, 100% 13px, 100% 100%, 13px 100%, 0 calc(100% - 13px));
}
.resume-print:hover { color: var(--main-darker); background: var(--text); }

.resume-player-card {
  position: relative;
  z-index: 3;
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 1px;
  padding: 1px;
  background: var(--text);
  border: 1px solid var(--text);
  box-shadow: 14px 14px 0 var(--link);
}
.resume-portrait { position: relative; grid-column: 1 / -1; overflow: hidden; background: #f5f5f2; }
.resume-portrait img { height: 270px; object-fit: cover; object-position: center 35%; filter: grayscale(1) contrast(1.05); }
.resume-portrait::after { content: ''; position: absolute; inset: 0; background: linear-gradient(0deg, rgba(0, 74, 74, .74), transparent 45%); }
.resume-portrait > span {
  position: absolute;
  right: .8rem;
  bottom: .8rem;
  z-index: 2;
  padding: .35rem .5rem;
  color: var(--main-darker);
  background: var(--link);
  font: 600 .58rem var(--ui);
}
.resume-player-card > div:not(.resume-portrait) { display: grid; padding: .8rem; background: var(--main-darker); }
.resume-player-card small { color: var(--footer-text); font: 500 .53rem var(--ui); text-transform: uppercase; letter-spacing: .08em; }
.resume-player-card strong { color: white; font: 600 .72rem var(--ui); }
.resume-player-card > a { grid-column: 1 / -1; padding: .9rem; color: var(--link); background: var(--main-darker); font-size: .85rem; font-weight: 600; }

.resume-marquee {
  display: flex;
  justify-content: space-around;
  gap: 1.5rem;
  overflow: hidden;
  padding: 1rem var(--pad);
  color: var(--main-darker);
  background: var(--link);
  border-block: 2px solid var(--main-darker);
  font: 600 .7rem var(--ui);
  letter-spacing: .08em;
  white-space: nowrap;
}
.resume-marquee i { font-style: normal; }

.resume-content { display: grid; grid-template-columns: minmax(280px, 31%) minmax(0, 1fr); align-items: start; background: var(--main); }
.resume-sidebar {
  position: sticky;
  top: 0;
  display: grid;
  gap: 3rem;
  min-height: 100vh;
  padding: clamp(4rem, 7vw, 7rem) clamp(1.5rem, 4vw, 4.5rem);
  color: var(--text);
  background: var(--main-darker);
  border-right: 1px solid var(--line);
}
.resume-sidebar section { border-top: 1px solid var(--line); padding-top: 1rem; }
.resume-kicker { margin: 0 0 .65rem; color: var(--link); font: 600 .58rem var(--ui); text-transform: uppercase; letter-spacing: .09em; }
.resume-sidebar h2 { margin: 0 0 1rem; color: white; font: 700 clamp(2rem, 3vw, 3.2rem)/1 var(--display); letter-spacing: -.05em; }
.resume-sidebar section > p:last-child { margin-bottom: 0; }
.resume-sidebar section > p + p { margin-top: .9rem; }
.resume-chip-list { display: flex; flex-wrap: wrap; gap: .5rem; }
.resume-chip-list span,
.resume-skill-grid span {
  position: relative;
  padding: .55rem .75rem .55rem 1.35rem;
  color: var(--main-darker);
  background: var(--text);
  border: 1px solid var(--main-darker);
  font: 600 .6rem var(--ui);
  text-transform: uppercase;
  letter-spacing: .04em;
  transition: transform .15s, background .15s;
}
.resume-chip-list span::before,
.resume-skill-grid span::before { content: '+'; position: absolute; left: .55rem; color: var(--main); }
@media (hover: hover) {
  .resume-chip-list span:hover,
  .resume-skill-grid span:hover { transform: translateY(-3px) rotate(-1deg); background: white; }
  .resume-chip-list span:nth-child(even):hover,
  .resume-skill-grid span:nth-child(even):hover { transform: translateY(-3px) rotate(1deg); }
}
.language-list { margin: 0; }
.language-list > div { display: flex; justify-content: space-between; padding: .65rem 0; border-bottom: 1px solid rgba(135,217,217,.2); }
.language-list dt { color: white; font-weight: 600; }
.language-list dd { margin: 0; color: var(--link); font: 600 .65rem var(--ui); }
.resume-links { display: grid; gap: .5rem; }
.resume-links .resume-kicker { grid-column: 1 / -1; }
.resume-links a { color: white; font-size: .85rem; }
.resume-links a:hover { color: var(--link); }

.resume-main-column { min-width: 0; }
.resume-section { padding: clamp(5rem, 9vw, 9rem) clamp(1.5rem, 6vw, 7rem); color: var(--text); border-bottom: 2px solid var(--main-darker); }
.resume-section-heading { margin-bottom: clamp(3rem, 6vw, 5rem); }
.resume-section-heading h2 {
  margin: 0;
  color: white;
  font: 700 clamp(3.5rem, 8vw, 8rem)/.86 var(--display);
  letter-spacing: -.07em;
}
.career-timeline { margin: 0; padding: 0; list-style: none; }
.career-timeline > li {
  display: grid;
  grid-template-columns: minmax(130px, .25fr) 1fr;
  gap: clamp(1.5rem, 4vw, 4rem);
  padding: 2rem 0 3rem;
  border-top: 1px solid var(--line);
}
.career-date { display: flex; align-items: start; gap: .55rem; padding-top: .3rem; color: var(--text); font: 600 .6rem var(--ui); white-space: nowrap; }
.career-date b { color: var(--link); }
.career-company { margin: 0; color: var(--link); font: 600 .65rem var(--ui); text-transform: uppercase; letter-spacing: .06em; }
.career-timeline h3 { margin: .25rem 0 1rem; color: white; font: 700 clamp(2rem, 4vw, 4.5rem)/1 var(--display); letter-spacing: -.05em; }
.career-timeline article > p:not(.career-company) { max-width: 760px; font-size: 1.05rem; }
.career-timeline article > .career-note { margin-top: 1rem; color: white; font-size: .85rem; }
.career-note strong { color: var(--link); font: 600 .58rem var(--ui); text-transform: uppercase; letter-spacing: .05em; }
.career-tags { display: flex; flex-wrap: wrap; gap: .5rem; margin-top: 1.3rem; }
.career-tags span { padding: .45rem .65rem; color: var(--main-darker); background: var(--text); font: 600 .55rem var(--ui); text-transform: uppercase; }

.education-section { background: var(--text); color: var(--main-darker); }
.education-section .eyebrow { color: var(--main-darker); }
.education-section .eyebrow::before { color: var(--main); }
.education-section .resume-section-heading h2 { color: var(--main-darker); }
.education-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1.5rem; }
.education-grid article { min-height: 300px; padding: clamp(1.5rem, 3vw, 2.5rem); background: var(--main-darker); color: var(--text); border: 2px solid var(--main-darker); box-shadow: 8px 8px 0 var(--main); }
.education-year { color: var(--link); font: 600 .65rem var(--ui); }
.education-grid h3 { margin: 2.2rem 0 1rem; color: white; font: 700 clamp(1.8rem, 3vw, 3.3rem)/1 var(--display); letter-spacing: -.05em; }
.education-grid small { display: block; margin-top: 1.5rem; color: var(--footer-text); }

.capabilities-section { background: var(--main); }
.capability-layout { display: grid; grid-template-columns: .8fr 1.2fr; gap: clamp(3rem, 6vw, 6rem); }
.capability-layout h3 { margin: 0 0 1.3rem; color: white; font: 700 1.3rem var(--display); }
.resume-skill-grid { display: flex; flex-wrap: wrap; gap: .55rem; }
.software-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: .65rem; margin: 0; padding: 0; list-style: none; }
.software-grid li { display: grid; grid-template-columns: 34px minmax(0, 1fr); align-items: center; gap: .6rem; min-height: 58px; padding: .6rem; color: var(--main-darker); background: var(--text); border: 1px solid var(--main-darker); }
.software-grid b { display: grid; place-items: center; width: 34px; height: 34px; color: var(--text); background: var(--main-darker); font: 600 .6rem var(--ui); }
.software-grid span { font-size: .75rem; font-weight: 600; }

.resume-cta { position: relative; overflow: hidden; padding: clamp(6rem, 12vw, 11rem) clamp(1.5rem, 6vw, 7rem); background: var(--main-darker); color: white; }
.resume-cta::after { content: '+'; position: absolute; right: -1rem; bottom: -4rem; color: var(--main); font: 500 clamp(10rem, 20vw, 18rem)/1 var(--ui); }
.resume-cta h2 { position: relative; z-index: 1; margin: .1em 0 .4em; color: white; font: 700 clamp(4rem, 9vw, 9rem)/.85 var(--display); letter-spacing: -.07em; }
.resume-cta > a { position: relative; z-index: 2; display: inline-flex; color: var(--link); border-bottom: 2px solid var(--link); font-size: clamp(1.15rem, 2vw, 1.8rem); font-weight: 700; }
.resume-cta > a span { margin-left: 1rem; }

.resume-footer { background: var(--main-darker); }

@media (min-width: 901px) {
  .resume-content {
    background: linear-gradient(90deg, var(--main-darker) 0 31%, var(--main) 31% 100%);
  }
  .resume-sidebar { background: transparent; }
}

@media (min-width: 801px) {
  .resume-portrait { display: grid; place-items: center; aspect-ratio: 1 / 1; }
  .resume-portrait img {
    width: 100%;
    height: 100%;
    object-fit: contain;
    object-position: center;
    transform: scale(.92);
    transform-origin: center 44%;
  }
}

@media (max-width: 900px) {
  .resume-hero { grid-template-columns: minmax(0, 1.2fr) minmax(240px, .8fr); gap: 2rem; }
  .resume-content { grid-template-columns: 1fr; }
  .resume-sidebar { position: static; min-height: 0; grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .resume-sidebar section { min-width: 0; }
  .capability-layout { grid-template-columns: 1fr; }
}

@media (max-width: 800px) {
  .resume-site-header #site-nav { background: var(--main-darker); }
  .resume-hero {
    grid-template-columns: 1fr;
    align-items: end;
    min-height: 720px;
    padding-top: 125px;
  }
  .resume-hero-grid { inset: 72px 0 0; }
  .resume-hero h1 { font-size: clamp(4.5rem, 22vw, 7rem); }
  .resume-intro { font-size: 1rem; }
  .resume-actions { align-items: stretch; flex-direction: column; width: min(100%, 350px); }
  .resume-player-card { width: min(100%, 350px); box-shadow: 8px 8px 0 var(--link); }
  .resume-portrait img { height: 190px; }
  .resume-marquee { justify-content: flex-start; }
  .resume-sidebar { grid-template-columns: 1fr; gap: 2.25rem; padding-block: 4rem; }
  .career-timeline > li { grid-template-columns: 1fr; gap: 1rem; }
  .education-grid { grid-template-columns: 1fr; }
  .education-grid article { min-height: 260px; }
  .software-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .resume-footer { flex-direction: column; text-align: center; }
}

@media (max-width: 430px) {
  .resume-hero { min-height: 680px; gap: 2rem; }
  .resume-hero h1 { font-size: 4.5rem; }
  .resume-role { margin-top: 1.5rem; }
  .resume-section-heading h2 { font-size: 3.65rem; }
  html[lang='de'] .resume-section-heading h2 {
    font-size: clamp(2.65rem, 13vw, 3.65rem);
    overflow-wrap: break-word;
    hyphens: auto;
  }
  .career-date { white-space: normal; }
  .career-timeline h3 { font-size: 2.4rem; }
  .software-grid { grid-template-columns: 1fr; }
  .resume-cta h2 { font-size: 4.1rem; }
  html[lang='de'] .resume-cta h2 {
    font-size: clamp(3.2rem, 16vw, 4.1rem);
    overflow-wrap: break-word;
    hyphens: auto;
  }
}

@media (prefers-reduced-motion: reduce) {
  .resume-chip-list span,
  .resume-skill-grid span { transition: none; transform: none !important; }
}

@media print {
  @page { margin: 12mm; }
  .resume-page-body { background: white; color: #172f2f; }
  .site-header, .world-progress, .resume-marquee, .resume-actions, .resume-cta, .resume-footer { display: none !important; }
  .resume-hero { min-height: 0; padding: 0 0 10mm; grid-template-columns: 1fr 52mm; background: white; color: #172f2f; border-bottom: 2px solid #006e6e; }
  .resume-hero-grid, .resume-hero::after { display: none; }
  .resume-hero h1, .resume-role { color: #004a4a; }
  .resume-intro { color: #315a5a; font-size: 10pt; }
  .resume-player-card { box-shadow: none; }
  .resume-portrait img { height: 42mm; }
  .resume-content { display: block; background: white; }
  .resume-sidebar { position: static; display: grid; grid-template-columns: repeat(4, 1fr); min-height: 0; padding: 8mm 0; color: #315a5a; background: white; border: 0; }
  .resume-sidebar h2, .resume-links a { color: #004a4a; }
  .resume-section { padding: 8mm 0; color: #315a5a; background: white; break-inside: avoid; border-color: #87d9d9; }
  .resume-section-heading { margin-bottom: 5mm; }
  .resume-section-heading h2, .career-timeline h3, .education-section .resume-section-heading h2, .capability-layout h3 { color: #004a4a; }
  .career-timeline > li { padding: 4mm 0; }
  .education-grid article { min-height: 0; color: #315a5a; background: white; box-shadow: none; }
  .education-grid h3 { color: #004a4a; }
  .software-grid li, .resume-skill-grid span, .resume-chip-list span { print-color-adjust: exact; }
}

/* Compact hero: shared height with every top-level page hero (see --hero-compact-height in styles.css). */
@media screen and (min-width: 801px) {
  .resume-hero { grid-template-columns: minmax(0, 1fr); gap: 0; min-height: var(--hero-compact-height, 360px); padding: 100px var(--pad) 18px; }
  .resume-hero::after { bottom: -2.5rem; font-size: 10rem; }
  .resume-player-card { display: none; }
  .resume-hero-copy { max-width: 900px; }
  .resume-hero .eyebrow { margin-bottom: .5rem; }
  .resume-hero h1 { margin: .05em 0 0; font-size: clamp(2.4rem, 3.2vw, 3.1rem); line-height: .9; }
  .resume-role { margin: .5rem 0 .15rem; font-size: .72rem; }
  .resume-intro { max-width: 760px; font-size: 1rem; line-height: 1.45; }
  .resume-actions { gap: .75rem; margin-top: .9rem; }
  .resume-actions .button { min-height: 44px; }
}
@media screen and (max-width: 800px) {
  .resume-hero { gap: 0; min-height: var(--hero-compact-height-mobile, 380px); padding: 86px 1.25rem 16px; }
  .resume-hero::after { bottom: -2rem; font-size: 8rem; }
  .resume-player-card { display: none; }
  .resume-hero .eyebrow { margin-bottom: .4rem; }
  .resume-hero h1 { margin: .05em 0 0; font-size: clamp(2rem, 9vw, 2.6rem); line-height: .9; }
  .resume-role { margin: .4rem 0 .1rem; font-size: .66rem; }
  .resume-intro { font-size: .9rem; line-height: 1.4; }
  .resume-actions { flex-direction: row; flex-wrap: wrap; align-items: center; width: auto; gap: .5rem; margin-top: .75rem; }
  .resume-actions .button { min-height: 42px; padding: .55rem .8rem; font-size: .62rem; }
}
@media screen {
  .resume-hero h1 br { display: none; }
  .resume-hero h1 br + em { margin-left: .25em; }
}