/* FARBEN HIER ÄNDERN: Gelb, Schwarz und Weiß aus dem gelieferten Logo. */
:root{--yellow:#ffe600;--ink:#171717;--muted:#525252;--line:#dedede;--paper:#fff;--soft:#f5f5f2}
*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:1rem}body{margin:0;color:var(--ink);background:var(--paper);font-family:Arial,Helvetica,sans-serif;font-size:1rem;line-height:1.65}a{color:inherit;text-underline-offset:.25em}a:hover{text-decoration-thickness:2px}a:focus-visible{outline:3px solid #705800;outline-offset:5px}h1,h2,h3,p{margin-top:0}h1,h2,h3{line-height:1.08;letter-spacing:-.04em}h1{font-size:clamp(2.7rem,5.5vw,5.5rem);margin-bottom:1.5rem}h2{font-size:clamp(2rem,3.5vw,3.25rem);margin-bottom:1.5rem}h3{font-size:1.5rem}p{margin-bottom:1.25rem}.wrap{width:min(1160px,calc(100% - 3rem));margin-inline:auto}.header{border-bottom:1px solid var(--line)}.header-inner{display:flex;justify-content:space-between;align-items:center;gap:2rem;padding-block:1.5rem}.brand{text-decoration:none;line-height:1.1;font-size:.95rem}.brand strong{display:block;font-size:1.55rem;letter-spacing:-.04em}.brand span{font-size:.9rem;letter-spacing:.08em;display:block;margin-top:.35rem}.header nav,footer nav{display:flex;flex-wrap:wrap;gap:.5rem 1.6rem}.header nav a{text-decoration:none;padding:.6rem 0;border-bottom:3px solid transparent}.header nav a[aria-current]{border-color:var(--yellow);font-weight:bold}.header nav a:hover{border-color:var(--ink)}.hero{display:grid;grid-template-columns:1.05fr 1fr;gap:2.5rem;align-items:center;padding-block:5rem}.hero h1 span{background:linear-gradient(transparent 66%,var(--yellow) 66%)}.eyebrow{text-transform:uppercase;letter-spacing:.13em;font-weight:bold;font-size:.78rem;margin-bottom:1.25rem}.intro{font-size:1.2rem;max-width:39rem;color:var(--muted)}.logo-panel img{display:block;width:100%;height:auto}.button{display:inline-flex;gap:2rem;align-items:center;background:var(--ink);color:white;text-decoration:none;padding:1rem 1.4rem;font-weight:bold;margin-top:.5rem}.button:hover{background:#383838}.button span{color:var(--yellow);font-size:1.5rem}.instruments{background:var(--yellow);padding:4rem 0}.section-top{display:grid;grid-template-columns:1fr 1fr;gap:4rem;align-items:end}.section-top>p{max-width:26rem}.instrument-list{padding:0;margin:1.5rem 0 0;list-style:none;display:grid;grid-template-columns:repeat(5,1fr);border-top:1px solid #958800}.instrument-list li{padding:1.5rem 1rem 0 0}.number{display:block;font-size:.85rem;margin-bottom:2rem}.instrument-list h3{margin-bottom:.65rem}.small{font-size:.9rem}.story{display:grid;grid-template-columns:1fr 1fr;gap:4rem;padding-block:5rem}.story>div:last-child{padding-top:2.4rem;font-size:1.1rem}.text-link{font-weight:bold;display:inline-block;padding-block:.5rem}.text-link span{margin-left:1rem}.contact{padding:2.5rem;background:var(--soft);display:grid;grid-template-columns:1fr 1fr;gap:3rem;margin-bottom:5rem}.contact h2{font-size:2.15rem}.contact p:last-child{margin-bottom:0}address{font-style:normal;line-height:2;overflow-wrap:anywhere}.placeholder{background:#fff1c2;color:#604400;border:1px dashed #987021;box-decoration-break:clone;-webkit-box-decoration-break:clone;padding:.12em .3em;font-size:.9em;letter-spacing:0;overflow-wrap:anywhere}.page-heading{padding-top:4.5rem;padding-bottom:2rem}.teachers{display:grid;grid-template-columns:1fr 1fr;gap:2rem}.teacher{border-top:6px solid var(--yellow);background:var(--soft);padding:2rem}.teacher h2{font-size:2rem}.bottom-link{padding-block:2rem 4rem}.legal{max-width:850px;padding-bottom:4rem;overflow-wrap:anywhere}.legal h2{font-size:1.55rem;margin-top:2.3rem}.notice{border-left:5px solid var(--yellow);padding:1.5rem;background:var(--soft)}.notice p{margin:.5rem 0 0}footer{background:var(--ink);color:#fff;padding:2.5rem 0;font-size:.9rem}.footer-inner{display:flex;justify-content:space-between;align-items:center;gap:2rem}.footer-inner p{margin:0}footer a{padding-block:.6rem}.skip{position:absolute;left:1rem;top:-10rem;background:var(--yellow);padding:.75rem;z-index:5}.skip:focus{top:1rem}
@media(max-width:800px){.header-inner{align-items:flex-start;flex-direction:column;gap:1rem}.header nav{gap:.3rem 1.3rem}.hero{gap:2rem;padding-block:3rem;grid-template-columns:1fr}.logo-panel{max-width:440px;margin:auto}.section-top,.story,.contact{grid-template-columns:1fr;gap:1rem}.instrument-list{grid-template-columns:repeat(2,1fr);gap:1rem}.instrument-list li:last-child{grid-column:1/-1}.number{margin-bottom:.8rem}.story{padding-block:3rem}.story>div:last-child{padding-top:0}.teachers{grid-template-columns:1fr}.contact{padding:1.5rem;margin-bottom:3rem}.footer-inner{align-items:flex-start;flex-direction:column}.page-heading{padding-top:3rem}}
@media(max-width:380px){.wrap{width:calc(100% - 2rem)}.header nav{gap:.25rem .8rem}.teacher{padding:1.25rem}.instrument-list h3{font-size:1.25rem}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}}
@media print{.header,footer,.skip,.button,.bottom-link{display:none}.wrap{width:100%}.hero,.story,.contact,.teachers{display:block}.page-heading{padding-top:0}.legal{max-width:none}body{font-size:11pt}h1{font-size:28pt}h2{font-size:20pt}}

/* AUSFÜHRLICHES DOZENTENPROFIL: volle Breite, gut lesbare Textspalte. */
.teacher-profile{grid-column:1/-1}
.teacher-profile .teacher-bio{max-width:75ch}
.teacher-profile h3{font-size:1.35rem;letter-spacing:-.02em;line-height:1.3;margin-top:2rem;margin-bottom:.8rem}
.teacher-profile .teacher-bio p:last-child{margin-bottom:0}
.teacher-nickname{display:inline-block;font-size:.8em;letter-spacing:0}
.teacher-experience{padding-left:1.3rem}
.teacher-experience li{margin-bottom:.75rem}
.teacher-portrait{float:left;width:35%;max-width:260px;height:auto;margin:.5rem 2rem 1.5rem 0}
.teacher-profile::after{content:"";display:block;clear:both}
@media(max-width:600px){.teacher-portrait{float:none;width:100%;margin:0 0 1.5rem}}

/* Gliederung der ausführlichen Datenschutzerklärung. */
.legal h3{font-size:1.25rem;line-height:1.35;letter-spacing:-.015em;margin-top:2rem;margin-bottom:.8rem}
.legal h4{font-size:1rem;line-height:1.5;margin-top:1.5rem;margin-bottom:.6rem}
.legal li{margin-bottom:.8rem}
.page-heading h1{overflow-wrap:anywhere;hyphens:auto}

/* Unterricht: eigene Seite mit ruhigen, hellen Instrumentabschnitten. */
.lesson-overview{max-width:1160px}
.lesson-links{display:flex;flex-wrap:wrap;gap:.5rem 1.5rem;padding-bottom:2rem}
.lesson-links a{padding:.5rem 0;font-weight:bold}
.lesson{margin-bottom:2rem}
.lesson h2{font-size:2rem}
.lesson p{max-width:none}

/* Instrumententext mit zugehörigem Bild. */
.lesson-detail{display:grid;grid-template-columns:minmax(0,3fr) minmax(0,2fr);gap:2rem;align-items:start}
.lesson-image{display:block;width:100%;height:auto}
@media(max-width:800px){.lesson-detail{grid-template-columns:1fr}.lesson-image{max-width:450px;margin-inline:auto}}

/* Smartphone, Tablet und vergrößerte Schrift. */
img{max-width:100%;height:auto}
.header-inner>*,.hero>*,.story>*,.contact>*,.teachers>*,.lesson-detail>*{min-width:0}
h1,h2,h3,h4,p,li,address{overflow-wrap:break-word}
.teacher-profile{display:flow-root}
.teacher-profile .teacher-bio{max-width:none}
.teacher-profile h3,.teacher-profile p,.teacher-profile ul{line-height:1.65}
.teacher-portrait,.lesson-image{border-radius:6px}
.header nav a,.lesson-links a,footer nav a{min-height:44px;display:inline-flex;align-items:center}
@media(max-width:1000px){.header-inner{flex-wrap:wrap}.header nav{gap:.25rem 1.2rem}}
@media(max-width:800px){
 .teacher-portrait{float:none;width:100%;max-width:360px;margin:0 auto 1.5rem;display:block}
 .hero,.story,.contact,.teachers,.lesson-detail{grid-template-columns:minmax(0,1fr)}
 .teacher-profile .teacher-bio{max-width:75ch}
 .header nav{width:100%}
}
@media(max-width:480px){
 .wrap{width:calc(100% - 2rem)}
 .header-inner{padding-block:1rem}
 .header nav{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:.35rem .65rem}
 .header nav a{font-size:.9rem;justify-content:center;text-align:center}
 .teacher,.contact{padding:1.25rem}
 .teacher h2{font-size:1.8rem}
 .hero{padding-block:2.5rem}
 .page-heading{padding-top:2.5rem}
 .lesson-links{gap:.35rem 1rem}
 .legal ul{padding-left:1.25rem}
 .legal h2{line-height:1.35}
 .lesson-tutor a{min-height:44px}
}

/* Info und PDF-Vorschau. */
.info-card{display:grid;grid-template-columns:minmax(0,1fr) minmax(320px,.9fr);gap:3rem;padding:2.5rem;background:var(--soft);margin-bottom:5rem}
.info-copy{max-width:48ch}
.info-note{border-left:5px solid var(--yellow);padding:1rem 1.25rem;background:#fff}
.pdf-preview iframe{width:100%;height:680px;border:1px solid var(--line);background:#fff}
.pdf-preview .small{margin:.65rem 0 0}
@media(max-width:800px){.info-card{grid-template-columns:1fr;padding:1.5rem;margin-bottom:3rem}.info-copy{max-width:none}.pdf-preview iframe{height:560px}}
@media(max-width:480px){.pdf-preview iframe{height:500px}.info-card .button{width:100%;justify-content:space-between}}
