/* Personal introduction: scoped to homepage hero. */
.hero-personal{padding-block:clamp(2rem,4vw,4rem) 1rem}
.hero-stage{display:grid;grid-template-columns:minmax(0,1.15fr) minmax(0,1fr);gap:clamp(1.5rem,4vw,4rem);align-items:center}
.hero-personal h1{font-size:clamp(48px,6.7vw,92px);margin-bottom:2.5rem}
.hero-personal .eyebrow{margin-bottom:2rem}
.hero-signature{margin:0;line-height:1.65}
.hero-signature strong{display:block;font-weight:600;font-size:1.15rem}
.hero-signature span{display:block;color:var(--muted);font-size:.95rem}
.hero-portrait{margin:0;width:100%;max-width:510px;justify-self:end}
.hero-portrait img{display:block;width:100%;max-width:100%;height:auto;mix-blend-mode:multiply}
.hero-summary{display:flex;align-items:center;justify-content:space-between;gap:3rem;border-top:1px solid var(--line);padding-top:1.75rem;margin-top:2rem}
.hero-summary .lead{max-width:46ch;margin:0;font-size:clamp(19px,1.6vw,23px)}
.hero-summary .text-link{flex-shrink:0}
@media(max-width:900px){.hero-personal h1{font-size:clamp(40px,6.5vw,60px)}.hero-summary{align-items:flex-start;flex-direction:column;gap:.75rem}.hero-signature span{max-width:24ch}}
@media(max-width:600px){.hero-stage{grid-template-columns:1fr;gap:1rem}.hero-personal h1{font-size:clamp(40px,10vw,60px);margin-bottom:1.75rem}.hero-personal .eyebrow{margin-bottom:1.5rem}.hero-portrait{max-width:300px;justify-self:center}.hero-signature span{max-width:none}.hero-summary{margin-top:1rem}.hero-summary .text-link{gap:1.5rem;flex-shrink:1}}

/* Revised hero: message left, laptop portrait and identity right. */
.hero-profile{width:100%;align-self:center}
.hero-profile .hero-portrait{max-width:560px;margin-inline:auto}
.hero-profile .hero-signature{margin-top:1.25rem;text-align:right}
.hero-profile .hero-signature span{max-width:none}
.hero-message>.lead{max-width:40ch;margin:0;font-size:clamp(19px,1.6vw,23px);line-height:1.5}
@media(max-width:600px){.hero-profile .hero-portrait{max-width:420px}.hero-profile .hero-signature{text-align:center;margin-top:.75rem}.hero-stage{gap:2rem}}
/* Give the laptop illustration approximately 27% more width on desktop. */
@media(min-width:1000px){
.hero-stage{grid-template-columns:minmax(0,.82fr) minmax(0,1.28fr);gap:2rem}
.hero-profile .hero-portrait{max-width:711px}
.hero-personal h1{font-size:clamp(48px,6.7vw,92px)}
}

/* Full-width tint, aligned with the existing VELORIS film section. */
#selected-work{background:#edf2f2;box-shadow:0 0 0 100vmax #edf2f2;clip-path:inset(0 -100vmax);border-top:0}

/* VELORIS: introduction above the full-width image. */
#veloris-brand .brand-intro { margin-top: 2.5rem; margin-bottom: 2.5rem; align-items: start; }
#veloris-brand .brand-intro h2 { margin-bottom: 0; }

/* Balanced overview spacing and two-column project context. */
#selected-work { padding-top: 4rem; padding-bottom: 4rem; }
.brand-depth { align-items: start; }
#veloris-brand .brand-depth .brand-system { margin-top: 0; }
#veloris-brand .brand-depth .brand-system-grid { grid-template-columns: 1fr; }

/* Consistent project labels. */
.project-head .tag { background: #185c63; color: #fff; border: 0; }

.project-head .tag { font-weight: 700; }
#wealthcap .research-image-link { background: #fff; }
.research-depth { align-items: start; }
#wealthcap .research-depth .research-examples { margin-top: 0; }
#wealthcap .research-depth .project-details { margin: 0; border-bottom: 0; }
#wealthcap .research-depth .project-details:last-child { border-bottom: 1px solid var(--line); }
.pfotenpass-intro { margin-bottom: 2.5rem; align-items: start; }
#pfotenpass .pfotenpass-preview { width: 100%; max-width: none; }
#pfotenpass .pfotenpass-preview img { display: block; width: 100%; height: auto; }
.pfotenpass-context { align-items: start; }
.pfotenpass-context .facts { margin-top: 0; }

#wealthcap .research-examples summary { font-weight: 400; }
.competency-list > div { display: grid; grid-template-columns: 64px minmax(0, 1fr); gap: 24px; }
.competency-number { font-size: 60px; line-height: 1.05; font-weight: 200; letter-spacing: -.04em; color: #185c63; }
#brand-book .book-preview { min-height: 0; justify-content: flex-start; }
@media(max-width:600px) { .competency-list > div { grid-template-columns: 46px minmax(0,1fr); gap:16px; } .competency-number { font-size:42px; } }

#brand-book .book-preview blockquote { margin-bottom: 0; }
.contact-bottom > p > strong { font-weight: 700; }

/* Readable navigation and project links across viewport sizes. */
.header nav a, .project-index a,
.brand-intro > div > .text-link, .research-intro > div > .text-link,
.pfotenpass-intro > div > .text-link { font-size: 1rem; }
#brand-book .book-insight { border: 0; }
.footer { flex-wrap: wrap; align-items: baseline; }
.footer-legal { color: var(--muted); }
.footer-legal > span { white-space: nowrap; }

#brand-book .split .text-link, .work-grid .project-details > summary,
#veloris-film .project-details > summary, #contact .contact-links a { font-size: 1rem; }
#brand-book .book-insight > h3 { font-size: 2rem; }
.steps .competency-number, .book-insight-grid .competency-number { display: block; margin-bottom: 1rem; }
#contact .contact-bottom { flex-direction: column; align-items: flex-start; gap: 0; }
#contact .contact-links { text-align: left; align-items: flex-start; }
#how-i-work, #veloris-film { border-top: 0; border-bottom: 0; }
#about, #pfotenpass { border-top: 0; }

#contact .contact-links { gap: .25rem; }
#contact .contact-links a { margin: 0; padding-block: .25rem; }

#wealthcap > .project-head { margin-bottom: 3rem; }

/* Lesetexte und Projektangaben der markierten Homepage-Bereiche. */
#veloris-film .project-details > p,
#pfotenpass .pfotenpass-context .facts dt,
#pfotenpass .pfotenpass-context .facts dd,
#professional .work-grid > article > p:not(.eyebrow),
#how-i-work .steps > li > p { font-size: 1rem; }

#brand-book .book-preview {
  background: transparent url("assets/denkrahmen-element-v1.svg") center / 100% 100% no-repeat;
  padding: clamp(3rem, 5.5vw, 5rem);
}

/* Situative Porträtzeichnungen, Entwurf 01. */
.section-drawing { display: block; width: 100%; height: auto; }
.competencies-visual .section-drawing { margin-top: 3rem; }
#about .about-portrait { background: transparent; aspect-ratio: auto; overflow: visible; }
#about .about-portrait img { height: auto; object-fit: contain; }
.contact-scene { display: grid; grid-template-columns: minmax(260px, .6fr) minmax(0, 1.4fr); gap: 2rem; align-items: center; }
.contact-drawing { max-width: 860px; justify-self: end; margin-top: -2rem; }

/* Einheitliche Kachelhöhen und stabile Akkordeon-Ausrichtung im Projektraster. */
#professional .work-grid { align-items: start; }
#professional .work-grid > article {
  display: block;
  align-self: start;
  height: max-content;
}
#professional .work-grid > article > .professional-image {
  width: 100%;
  aspect-ratio: 3 / 2;
  flex: none;
  overflow: hidden;
}
#professional .professional-image > img { min-width: 0; min-height: 0; }
#professional .work-grid > article > .project-details { margin: 1.5rem 0 0; }

/* Kontakt: kompaktere Desktop-Headline und engerer Anschluss an die Illustration. */
#contact > h2 {
  font-size: clamp(2.8rem, 7vw, 5.75rem);
  margin-bottom: 1rem;
}
@media (max-width: 600px) {
 .competencies-visual .section-drawing { margin-top: 1.5rem; }
 .contact-scene { grid-template-columns: 1fr; gap: 1.5rem; }
 .contact-drawing { max-width: 480px; justify-self: center; margin-top: 0; }
}