/* Current portfolio: independent services, genuine customer work and the own Brain platform. */
.portfolio-label { color: var(--deho-muted, #516b7a); font-weight: 600; margin-bottom: .75rem; }
.portfolio-readable { max-width: 52rem; }
.portfolio-intro { background: #eef4f6; }
.homepage-hero .homepage-hero-title, .portfolio-intro h1, .brain-hero h1 { hyphens: none; overflow-wrap: normal; word-break: normal; text-wrap: balance; }
.portfolio-section-heading { align-items: end; display: flex; flex-wrap: wrap; gap: 1rem 3rem; justify-content: space-between; margin-bottom: 2.5rem; }
.portfolio-section-heading h2 { max-width: 45rem; margin: 0; }
.portfolio-section-heading p { color: #516b7a; margin: .75rem 0 0; max-width: 43rem; }
.portfolio-text-link { font-weight: 600; text-underline-offset: .25em; }
.portfolio-jump-links { display: flex; flex-wrap: wrap; gap: .75rem 2rem; margin-top: 2rem; }
.portfolio-jump-links a { font-weight: 600; text-underline-offset: .25em; }
.owner-portrait img { aspect-ratio: 4 / 5; border-radius: .75rem; display: block; height: auto; max-height: 38rem; object-fit: cover; object-position: 50% 40%; width: 100%; }
.owner-portrait figcaption { border-left: 3px solid #dc3545; margin-top: 1rem; padding-left: 1rem; }
.owner-portrait figcaption strong, .owner-portrait figcaption span { display: block; }
.owner-portrait figcaption span { color: #516b7a; font-size: .9rem; }
.portfolio-footnote { color: #516b7a; font-size: .9rem; margin: 1.5rem 0 0; }
.customer-case-grid { display: grid; gap: 1.5rem; grid-template-columns: repeat(2, minmax(0, 1fr)); }
.customer-case { border: 1px solid #dce5e9; border-radius: .75rem; padding: 2rem; scroll-margin-top: 7rem; }
.customer-case h2 { color: #253b48; font-size: 1.5rem; line-height: 1.3; margin-bottom: 1.25rem; }
.customer-case h2 span { color: #516b7a; display: block; font-size: 1rem; font-weight: 500; line-height: 1.5; margin-top: .5rem; }
.customer-case p { line-height: 1.7; }
.customer-case .case-intro { font-size: 1.05rem; }
.customer-case summary { color: #253b48; cursor: pointer; font-weight: 600; padding: .5rem 0; }
.customer-case details p { margin-top: .75rem; }
.portfolio-more { background: #f7f9fa; }
.portfolio-work-list { display: grid; gap: 2rem 3rem; grid-template-columns: repeat(2, minmax(0, 1fr)); }
.portfolio-work-list article { border-top: 1px solid #cbd8df; padding-top: 1.5rem; }
.portfolio-work-list h3 { color: #253b48; font-size: 1.25rem; }
.portfolio-work-list p { line-height: 1.75; margin-bottom: .5rem; max-width: 42rem; }
.portfolio-contact { align-items: center; display: flex; flex-wrap: wrap; gap: 1.5rem 3rem; justify-content: space-between; }
.brain-home { background: #eef4f6; }
.brain-home p { max-width: 44rem; }
.brain-home-capabilities { margin: 0; }
.brain-home-capabilities > div { border-top: 1px solid #cbd8df; padding: 1.5rem 0; }
.brain-home-capabilities dt { color: #253b48; font-size: 1.1rem; margin-bottom: .5rem; }
.brain-home-capabilities dd { color: #516b7a; line-height: 1.7; margin: 0; }
.brain-hero { background: #eef4f6; padding: 3.5rem 0; }
.brain-hero h1 { color: #253b48; font-size: clamp(2rem, 4vw, 3.75rem); line-height: 1.12; max-width: 15ch; }
.brain-hero .lead { line-height: 1.65; max-width: 43rem; }
.brain-map { background: #fff; border: 1px solid #cbd8df; border-radius: .75rem; padding: 2rem; }
.brain-map h2 { color: #253b48; font-size: 1.5rem; line-height: 1.35; }
.brain-map-core { background: #253b48; border-radius: .5rem; color: #fff; line-height: 1.6; margin: 1.5rem 0; padding: 1.25rem; }
.brain-map ul { display: grid; gap: .75rem; grid-template-columns: repeat(2, minmax(0, 1fr)); list-style: none; margin: 0; padding: 0; }
.brain-map li { border-left: 2px solid #dc3545; font-size: .9rem; padding-left: .75rem; }
.brain-capabilities { display: grid; gap: 2.5rem 3rem; grid-template-columns: repeat(2, minmax(0, 1fr)); }
.brain-capability { border-top: 2px solid #cbd8df; padding-top: 1.5rem; }
.brain-capability h3 { color: #253b48; font-size: 1.3rem; line-height: 1.4; }
.brain-capability p, .brain-capability li { line-height: 1.75; }
.brain-capability ul { margin: 1rem 0 0; padding-left: 1.25rem; }
.brain-capability li + li { margin-top: .5rem; }
.brain-flow { counter-reset: brain-step; display: grid; gap: 1rem; grid-template-columns: repeat(3, minmax(0, 1fr)); list-style: none; margin: 2rem 0 0; padding: 0; }
.brain-flow > li { background: #fff; border: 1px solid #cbd8df; border-radius: .5rem; counter-increment: brain-step; padding: 1.5rem; }
.brain-flow > li::before { color: #516b7a; content: counter(brain-step); display: block; font-size: .85rem; font-weight: 700; margin-bottom: .75rem; }
.brain-flow h3 { color: #253b48; font-size: 1.1rem; }
.brain-flow p { font-size: .95rem; line-height: 1.65; }
.brain-flow .step-artifact { color: #516b7a; font-size: .85rem; margin-bottom: 0; }
.brain-stack { border-top: 1px solid #cbd8df; display: grid; gap: 1rem 3rem; grid-template-columns: 1fr 2fr; margin-top: 2rem; padding-top: 2rem; }
.brain-stack dt { color: #253b48; }
.brain-stack dd { line-height: 1.75; }
.brain-example { border-top: 1px solid #cbd8df; }
.brain-example > summary { cursor: pointer; font-size: 1.25rem; font-weight: 600; padding: 1.5rem 0; }
.brain-example .section { padding-top: 1.5rem !important; }
@media (max-width: 991.98px) {
  .owner-portrait img { max-height: 28rem; }
  .brain-hero { padding: 3rem 0; }
}
@media (max-width: 767.98px) {
  .customer-case-grid, .portfolio-work-list, .brain-capabilities { grid-template-columns: minmax(0, 1fr); }
  .customer-case { padding: 1.5rem; }
  .brain-flow { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .brain-stack { gap: .5rem; grid-template-columns: minmax(0, 1fr); }
  .brain-stack dd { margin-bottom: 1rem; }
}
@media (max-width: 399.98px) {
  .brain-map { padding: 1.5rem; }
  .brain-map ul { grid-template-columns: minmax(0, 1fr); }
}
@media print {
  .customer-case-grid, .brain-capabilities, .brain-flow { display: block; }
  .customer-case, .brain-capability, .brain-flow > li { break-inside: avoid; margin-bottom: 1rem; }
}

/* Anonymous practice examples retain labelled local technology mini-icons. */
.customer-case.reference-project { border: 0; border-top: 1px solid #dce5e9; border-radius: 0; padding: 3rem 0; }
.reference-project h2 { font-size: clamp(1.5rem,2.5vw,2.25rem); }
.reference-project .case-intro { font-size: 1.15rem; }
.reference-roles { display: flex; flex-wrap: wrap; gap: .4rem; margin: 1rem 0 1.5rem; }
.reference-roles span { background: #eef4f6; border-radius: .3rem; color: #253b48; font-size: .8rem; padding: .3rem .6rem; }
.reference-project-summary { background: #f7f9fa; border-radius: .5rem; padding: 1.5rem; }
.reference-tech.skill-icons { gap: 1.25rem 1.5rem; margin-top: 1.75rem; }
.reference-tech .skill-icon { margin: 0; min-width: 3.5rem; }
.reference-tech .skill-icon div { align-items: center; display: flex; height: 3rem; justify-content: center; width: 3rem; }
.reference-tech .skill-icon img { height: 2.5rem; object-fit: contain; width: 2.5rem; }
.reference-tech .skill-icon span { display: block; font-size: .8rem; padding-top: .5rem; }
@media (max-width: 991.98px) {
  .reference-project-summary { align-items: start; display: flex; flex-wrap: wrap; gap: 1rem 2rem; }
}
@media (max-width: 399.98px) {
  .reference-tech.skill-icons { gap: 1rem; }
}
/* Problem-led summaries use the same six anchors as the detailed examples. */
.practice-overview { display: grid; gap: 0 3rem; grid-template-columns: repeat(3, minmax(0, 1fr)); }
.practice-link { align-items: start; border-top: 1px solid #cbd8df; color: #253b48; display: grid; gap: .8rem; grid-template-columns: auto minmax(0, 1fr) auto; padding: 1.5rem 0; text-decoration: none; }
.practice-link strong { display: block; font-size: 1.1rem; line-height: 1.4; margin-bottom: .6rem; }
.practice-link > span > span { color: #516b7a; display: block; font-size: .95rem; line-height: 1.7; }
.practice-number, .practice-arrow { color: #516b7a; font-size: .85rem; padding-top: .15rem; }
.practice-link:hover strong { text-decoration: underline; text-underline-offset: .2em; }
.practice-link:focus-visible, .portfolio-jump-links a:focus-visible, .practice-technical summary:focus-visible { outline: 3px solid #253b48; outline-offset: 5px; }
.practice-kicker { color: #516b7a; font-size: .85rem; font-weight: 600; letter-spacing: .02em; margin-bottom: .8rem; }
.reference-project-summary h3 { color: #253b48; font-size: 1.15rem; margin-bottom: 1rem; }
.reference-project-summary p:last-child { margin-bottom: 0; }
.practice-technical { border-top: 1px solid #dce5e9; margin-top: 1.5rem; padding-top: .75rem; }
.practice-technical summary { padding: .6rem 0; }
.reference-contribution { border-left: 2px solid #cbd8df; padding-left: 1rem; }
@media (max-width: 991.98px) {
  .practice-overview { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .reference-project-summary { display: block; }
}
@media (max-width: 575.98px) {
  .practice-overview { grid-template-columns: minmax(0, 1fr); }
  .practice-link { gap: .75rem; padding: 1.25rem 0; }
}

/* Own developments: readable purpose, explicit stack and optional architecture detail. */
.own-project-list { align-items: start; gap: 3rem; }
.own-project-list .practice-kicker { font-size: .8rem; margin-bottom: .65rem; }
.own-project h3 { font-size: 1.35rem; line-height: 1.4; margin-bottom: .85rem; }
.own-project .own-project-stack { color: #253b48; font-size: .85rem; font-weight: 600; line-height: 1.8; margin-top: 1rem; }
.own-project .practice-technical { margin-top: 1rem; }
.own-project-facts { margin: .75rem 0 0; }
.own-project-facts dt { color: #253b48; font-size: .9rem; margin-top: 1.25rem; }
.own-project-facts dd { font-size: .95rem; line-height: 1.75; margin: .4rem 0 1rem; }
.own-project .own-project-stage { color: #516b7a; font-size: .85rem; line-height: 1.7; margin: 1rem 0 .75rem; }
.own-project-more { margin-top: 3rem; }
.own-project-more > summary { font-size: 1.1rem; }
.own-project-more .portfolio-work-list { margin-top: 1rem; }
.own-project { scroll-margin-top: 7rem; }