/* Projekt-1-Gestaltung, ausschliesslich auf die übernommenen Bereiche begrenzt. */
.section.p1-block { padding:100px 0; color:#243c32; background:#fff; font:16px/1.65 Arial,Helvetica,sans-serif; }
.p1-block .shell { width:min(1240px,calc(100% - 96px)); margin-inline:auto; }
.p1-block p { margin:0 0 22px; }
.p1-block h2 { font-family:Arial,Helvetica,sans-serif; font-size:clamp(32px,3.2vw,46px); font-weight:500; line-height:1.14; letter-spacing:-.045em; margin:0 0 26px; }
.p1-block .eyebrow { font-size:12px; text-transform:uppercase; letter-spacing:.17em; font-weight:700; margin-bottom:24px; color:#c6481c; }
.p1-block.intro .shell { display:grid; grid-template-columns:1fr 1fr; column-gap:90px; }
.p1-block.intro .eyebrow { grid-column:1/-1; }
.p1-block.intro h2 { max-width:540px; }
.p1-block.intro .section-lead { color:#57645c; font-size:18px; margin:0; max-width:none; }
.p1-block .split { display:grid; grid-template-columns:1fr 1fr; gap:95px; align-items:center; }
.p1-block .approach-image { width:100%; height:500px; object-fit:cover; border-radius:5px 90px 5px 5px; }
.p1-block .split p:not(.eyebrow) { color:#57645c; }
.p1-block .principles { display:flex; flex-wrap:wrap; gap:8px; margin:28px 0; }
.p1-block .principles span { font-size:11px; background:#f7f3df; border-radius:20px; padding:7px 12px; }
.p1-block .text-link { display:inline-block; color:inherit; text-decoration:none; font-size:14px; font-weight:600; border-bottom:1px solid #ce6b3e; padding-bottom:7px; }
.p1-block .text-link:hover { color:#c6481c; }
.p1-block .text-link span { margin-left:25px; }
.section.p1-block.portrait { background:#f5f7f2; }
.p1-block .portrait-grid { display:grid; grid-template-columns:1.2fr .8fr; gap:130px; align-items:center; max-width:1050px; }
.p1-block .portrait-grid img { display:block; width:100%; height:auto; aspect-ratio:4/5; object-fit:cover; object-position:center; border-radius:5px; }
.p1-block .portrait-title { font-size:16px; color:#c6481c; }
.p1-block .portrait-grid p:not(.eyebrow):not(.portrait-title) { color:#57645c; }
.integrated-hero .hero-image img { object-position:center 65%; }
@media(max-width:1100px) {
 .p1-block .shell { width:calc(100% - 56px); }
 .p1-block .split { gap:45px; }
 .p1-block .portrait-grid { gap:65px; }
 .p1-block.intro .shell { column-gap:45px; }
}
@media(max-width:760px) {
 .section.p1-block { padding:65px 0; }
 .p1-block .shell { width:calc(100% - 40px); }
 .p1-block.intro .shell,.p1-block .split,.p1-block .portrait-grid { grid-template-columns:1fr; gap:25px; }
 .p1-block.intro .eyebrow,.p1-block.intro h2 { margin-bottom:0; }
 .p1-block.intro .section-lead { font-size:16px; }
 .p1-block .approach-image { height:350px; }
 .p1-block .portrait-grid img { max-width:320px; grid-row:1; margin-bottom:15px; }
 .p1-block .portrait-grid { gap:15px; }
 .p1-block .eyebrow { margin-bottom:20px; }
}

/* Gleiche Abstände um die Titelzeilen; Bild vertikal im Hero zentriert. */
.integrated-hero { --title-gap: 28px; }
.integrated-hero .hero-title { padding-top:0; margin-bottom:var(--title-gap); }
.integrated-hero .hero-title::before { transform:none; margin-bottom:var(--title-gap); }
.integrated-hero .lead { margin-top:0; margin-bottom:0; }
@media(min-width:761px) {
 .integrated-hero .hero-grid { grid-template-rows:auto auto auto; }
 .integrated-hero .hero-image { grid-row:1 / 4; align-self:center; margin-block:0; }
}

/* Freigestellte Figuren: volle Farbkraft direkt auf der orangefarbenen Fläche. */
.integrated-hero .hero-image { background:transparent; overflow:visible; }
.integrated-hero .hero-image img {
 border-radius:0;
 opacity:1;
 mix-blend-mode:normal;
 -webkit-mask-image:none;
 mask-image:none;
 object-fit:contain;
 object-position:center;
}

/* Einheitliches Logo-Orange für alle fünf Bereichstitel. */
.p1-block.intro .eyebrow,
.offer-section .offer-eyebrow,
.p1-block.approach .eyebrow,
.p1-block.portrait .eyebrow,
.section.institute .eyebrow {
  color: var(--accent);
}

/* Praxisbezeichnung im Titelbereich besser lesbar. */
.integrated-hero .hero-copy > .eyebrow {
  font-size: 14px;
  font-weight: 600;
  color: #fff;
}

/* Hintergrund wie im Angebotsbereich auf hess-psy.ch: #eef3ef. */
.offer-section,
.section.p1-block.portrait {
  background: #eef3ef;
}
