/* Reading pages continue the Lernbus poster identity with a quieter text column. */
.detail-page{
 --bg:#fafafa;--surface-soft:#f0edf6;
 --yellow:#f4db4b;--marker:var(--yellow);
 --violet:#493f80;--violet-deep:#38306a;
 --forest:#205951;--forest-deep:#1e4843;
 --night:#29233e;--ink:var(--night);--teal-ink:var(--ink);--teal-soft:#655f73;
 --mint-paper:var(--surface-soft);--lavender-paper:var(--surface-soft);
 --hairline:#d4d0da;--line:#b3afbc;--rule-inverse:rgba(250,250,250,.35);
 --section-rule:var(--line);--section-space:5rem;
 --wrap:90rem;--pad:clamp(1.25rem,3.5vw,4.5rem);
 --fs-hero:clamp(2.8rem,6.7vw,6.8rem);--fs-h2:clamp(2.4rem,4.7vw,4.8rem);font-size:1.0625rem
}
.detail-page h1,.detail-page h2,.detail-page h3{letter-spacing:-.025em}
.detail-page .site-head{border-bottom:2px solid var(--violet);background:var(--bg)}
.detail-page .site-head .wrap{padding-block:1rem}
.detail-page .brand-logo{height:3.4rem}
.detail-page .brand span{font-size:.75rem;letter-spacing:.02em;text-transform:none;line-height:1.4}
.detail-page .site-head.nav-inline .navlink{font-size:.875rem;letter-spacing:.025em}
.detail-page .lang{background:transparent;border:1px solid var(--violet);border-radius:0}
.detail-page .menu-btn{border-radius:0;box-shadow:3px 3px 0 var(--night)}
.detail-page .hero{min-height:0!important;background:var(--yellow)}
.detail-page .hero-inner{padding-top:12rem;padding-bottom:4.5rem}
.detail-page .hero h1{max-width:22ch;line-height:1.16;text-wrap:balance}
/* A visible reversal of the brand pair, rather than a second nearly identical violet. */
.detail-page .hero h1 .pop{color:var(--yellow);background:var(--violet);padding:.015em .11em .06em;white-space:normal;-webkit-box-decoration-break:clone;box-decoration-break:clone}
.detail-page .hero h1 .pop::after{display:none}
.detail-page .hero .lead{max-width:54ch;font-size:1.25rem}
.detail-page .hero-scrim{display:none}
.detail-page .section{padding-block:var(--section-space);scroll-margin-top:7rem}
.detail-page .section.tint{background:var(--surface-soft)}
/* Each section owns its top rule; rows use a lighter 1px rule, controls a blue outline. */
.detail-page main>section+section{border-top:2px solid var(--section-rule)}
.detail-page h2.big{line-height:1.06;max-width:21ch}
.detail-page .detail{max-width:76rem;gap:0;grid-template-columns:minmax(0,1fr)}
.detail-page .detail>*,.detail-page .dsec>*{min-width:0}
.detail-page .dsec{display:grid;grid-template-columns:minmax(0,.85fr) minmax(0,1.15fr);gap:3rem;padding-block:2rem;border-bottom:1px solid var(--hairline)}
.detail-page .dsec:first-child{padding-top:0}
.detail-page .dsec:last-child{border-bottom:0;padding-bottom:0}
.detail-page #fragen .dsec{border-bottom:1px solid var(--hairline)}
.detail-page #fragen .dsec:last-child{border-bottom:0;padding-bottom:0}
.detail-page .dsec h2,.detail-page .dsec h3{hyphens:auto;overflow-wrap:anywhere;font-size:clamp(1.7rem,2.6vw,2.6rem);line-height:1.14;max-width:22ch}
.detail-page .dsec h2::before,.detail-page .dsec h3::before{width:3rem;height:4px;background:var(--violet);border-radius:0;rotate:0}
.detail-page .dsec p{margin-top:0;max-width:62ch;min-width:0}
.detail-page .dsec p+p{grid-column:2}
.detail-page .btn{border-radius:0;border:2px solid var(--violet);font-size:1rem;box-shadow:4px 4px 0 var(--night)}
.detail-page .btn-ghost{box-shadow:none}
.detail-page .btn-pink,.detail-page .menu-btn{color:var(--yellow)}
.detail-page .eyebrow{border:0;padding:0;font-size:.875rem;letter-spacing:.07em}
.detail-page .eyebrow::before{content:'';display:inline-block;width:2rem;height:3px;background:currentColor;vertical-align:middle;margin-right:.75rem}
.detail-page .fact{border-top:2px solid var(--violet)}
.detail-page .fact b{font-size:1.45rem;line-height:1.2}
.detail-page .steps{max-width:60rem;margin-left:auto}
.detail-page .step{padding-left:4rem;padding-bottom:2.5rem}
.detail-page .step .dotn{font-family:var(--display);font-size:2.7rem;line-height:1;width:2.5rem;height:auto;border-radius:0;background:transparent;transform:none;color:var(--violet)}
.detail-page .step h3{font-size:1.6rem;line-height:1.2}
.detail-page .step::before{display:none}
.detail-page .vignette{border-color:var(--violet);background:var(--yellow);padding:1.5rem 2rem;max-width:50ch}
.detail-page .example-label{display:block;font-family:var(--body);font-size:.875rem;font-weight:500;margin-bottom:1rem}
.detail-page .foot{background:var(--night);margin-top:0;padding-block:3rem}
.detail-page .morelink{margin-left:.5rem;min-height:44px;text-decoration:underline;text-underline-offset:4px}
.detail-page #anmelden{color:var(--bg);--section-rule:var(--rule-inverse);padding-block:var(--section-space)}
.detail-page #anmelden h2,.detail-page #anmelden .morelink{color:var(--yellow)}
.detail-page #anmelden .lead,.detail-page #anmelden .book-note{color:var(--bg)}
.detail-page #anmelden .btn-ghost{color:var(--bg);border-color:var(--bg)}
.detail-page #anmelden .btn-ghost:hover,.detail-page #anmelden .btn-ghost:focus-visible{color:var(--violet);background:var(--bg)}
.detail-page #anmelden .btn-ghost:focus-visible{outline-color:var(--yellow)}
.detail-page #team .lead{max-width:60ch}
@media(max-width:64rem){
 .detail-page .dsec{gap:2rem;grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr)}
 .detail-page .hero-inner{padding-top:11rem}
}
@media(max-width:48rem){
 .detail-page .hero-inner{padding-top:10rem;padding-bottom:3rem}
 .detail-page .hero h1{max-width:19ch;hyphens:none}
 .detail-page .hero .lead{font-size:1.125rem}
 .detail-page{--section-space:3.5rem}
 .detail-page .dsec{grid-template-columns:1fr;gap:1rem;padding-block:2rem}
 .detail-page .dsec p+p{grid-column:auto}
 .detail-page .dsec h2,.detail-page .dsec h3{max-width:none;font-size:1.8rem}
 .detail-page .brand span{max-width:22ch}
 .detail-page .brand-logo{height:2.8rem}
 .detail-page .site-head .wrap{gap:.5rem}
 .detail-page .head-right{gap:.6rem}
 .detail-page .step{padding-left:3.2rem}
 .detail-page .step .dotn{font-size:2.25rem}
 .detail-page .vignette{padding:1.2rem}
 .detail-page .morelink{margin-left:0}
}
@media print{
 .detail-page .hero h1 .pop{color:var(--violet);background:none;padding:0;text-decoration:underline;text-underline-offset:.1em;text-decoration-thickness:.05em}
}
@media(prefers-reduced-motion:reduce){.detail-page *{animation:none!important;transition:none!important}}

/* Neutral canvas lets the existing artwork carry warmth; colour carries identity and action. */
.detail-page::selection,.detail-page ::selection{background:var(--marker);color:var(--ink)}
.detail-page .site-head.nav-inline .navlink::after{background:var(--violet)}
.detail-page .foot{color:var(--bg)}
.detail-page .foot a{color:var(--bg)}
.detail-page .team-profile{display:grid;grid-template-columns:minmax(0,.75fr) minmax(0,1.25fr);gap:clamp(2.5rem,7vw,7rem);align-items:start}
.detail-page .team-identity,.detail-page .team-profile-copy{min-width:0}
.detail-page .team-photo-frame{width:100%;max-width:27rem;border:2px solid var(--violet);box-shadow:8px 8px 0 var(--yellow)}
.detail-page .team-photo{display:block;width:100%;height:auto}
.detail-page .team-name{font-family:var(--display);font-size:clamp(2.5rem,3.5vw,3.8rem);line-height:1.08;letter-spacing:-.025em;max-width:12ch;margin:2rem 0 .7rem;color:var(--violet);text-wrap:balance}
.detail-page .team-role{font-size:1.25rem;font-weight:700;color:var(--violet);margin:0}
.detail-page .team-profile .morelink{margin:.75rem 0 0;overflow-wrap:anywhere;display:block;max-width:100%;font-size:1rem}
.detail-page .team-bio-section{padding-block:2rem;border-top:1px solid var(--hairline)}
.detail-page .team-bio-section:first-child{padding-top:0;border-top:0}
.detail-page .team-bio-section:last-child{padding-bottom:0}
.detail-page .team-bio-heading{font-family:var(--display);font-size:clamp(1.65rem,2.3vw,2.3rem);font-weight:700;line-height:1.15;letter-spacing:-.02em;color:var(--violet);margin:0 0 1.2rem;text-wrap:balance}
.detail-page .team-bio-section p{font-size:1.0625rem;line-height:1.65;max-width:62ch;margin:0}
.detail-page .team-bio-section p+p{margin-top:1.15rem}
.detail-page .team-testimonials{margin-top:clamp(3.5rem,8vw,7rem);padding-top:clamp(2rem,5vw,4rem);border-top:2px solid var(--violet);scroll-margin-top:7rem}
.detail-page .team-testimonials-heading{font-family:var(--display);font-size:clamp(2.1rem,4vw,3.5rem);line-height:1.1;letter-spacing:-.025em;color:var(--violet);margin:0 0 1.5rem;text-wrap:balance}
.detail-page .team-testimonials-language{font-size:1rem;line-height:1.6;margin:0 0 1.5rem}
.detail-page .team-testimonials-list{max-width:72ch}
.detail-page .team-testimonial{margin:0;padding:2rem 0;border-bottom:1px solid var(--hairline)}
.detail-page .team-testimonial:first-child{padding-top:0}
.detail-page .team-testimonial blockquote{margin:0;padding:0;border:0;color:var(--ink)}
.detail-page .team-testimonial blockquote p{font-size:1.0625rem;line-height:1.75;margin:0;max-width:none;overflow-wrap:break-word}
.detail-page .team-testimonial blockquote p+p{margin-top:1rem}
.detail-page .team-testimonial figcaption{font-size:1rem;line-height:1.5;font-weight:700;color:var(--violet);margin-top:1.25rem}
@media(max-width:48rem){
 .detail-page .team-profile{grid-template-columns:minmax(0,1fr);gap:2.5rem}
 .detail-page .team-photo-frame{max-width:18rem}
 .detail-page .team-name{font-size:clamp(2.5rem,8vw,3.5rem);max-width:none}
 .detail-page .team-bio-section{padding-block:1.75rem}
}