/* Christian Lijsen – Feine Streichinstrumente */
@font-face{font-family:"Open Sans";src:url(fonts/open-sans.ttf) format("truetype");font-weight:300 800;font-style:normal;font-display:swap}
@font-face{font-family:"Open Sans";src:url(fonts/open-sans-italic.ttf) format("truetype");font-weight:300 800;font-style:italic;font-display:swap}

:root{
  /* Fotohintergrund der Instrumentenaufnahmen */
  --studio:#978e87;
  --studio-hi:#a39a93;
  --studio-lo:#8a8079;
  --paper:#f2eae0;
  --paper-2:#faf5ee;
  --ink:#261d18;
  --ink-soft:#4b4039;
  --varnish:#aa531e;
  --varnish-hi:#aa531e;
  --line:rgba(38,29,24,.22);
  --focus:#7a3214;

  
  
  --gutter:clamp(1rem,4vw,3rem);
  color-scheme:light;
}

*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;text-size-adjust:100%}
body{margin:0;background:var(--paper);color:var(--ink);font-family:"Open Sans",Arial,sans-serif;font-weight:400;font-size:clamp(1.0625rem,.98rem + .35vw,1.1875rem);line-height:1.68;font-feature-settings:"kern","liga","onum";-webkit-font-smoothing:antialiased}
img{display:block;max-width:100%;height:auto}
a{color:var(--varnish);text-decoration-thickness:1px;text-underline-offset:.2em}
a:hover{color:var(--varnish-hi)}
:focus-visible{outline:2px solid var(--focus);outline-offset:3px;border-radius:2px}
strong{font-weight:500}
.skip{position:absolute;left:-999px;top:0;background:var(--ink);color:var(--paper);padding:.6rem 1rem;z-index:10}
.skip:focus{left:1rem;top:1rem}

/* Typografie */
h1,h2,h3,h4,h5,h6{color:inherit;font-family:"Times New Roman",Times,serif;font-weight:400;line-height:1.08;letter-spacing:-.005em;margin:0;text-wrap:balance}
h1{font-size:clamp(2.4rem,1.6rem + 3vw,4.1rem)}
h2{font-size:clamp(1.9rem,1.4rem + 1.8vw,2.85rem);margin-top:.65em;margin-bottom:.6em}
h3{font-size:clamp(1.35rem,1.15rem + .7vw,1.7rem);margin:1.8em 0 .45em}
p{margin:0 0 1.05em}
.lead{font-size:1.18em;line-height:1.55;font-weight:400}
.prose ul{padding-left:1.1em;margin:0 0 1.2em}
.prose li{margin:.25em 0}
.prose li::marker{color:var(--varnish)}
.note{font-style:italic;color:var(--ink-soft);font-size:.92em}

/* Kopfzeile */
.site-head{position:relative;z-index:5;background:transparent;color:#221a15}
.site-head .wrap{display:flex;align-items:center;justify-content:space-between;gap:1.5rem;padding-top:1.1rem;padding-bottom:1.1rem}
.brand{text-decoration:none;color:inherit;display:block;line-height:1}
.brand:hover{color:inherit}
.nav ul{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:.2rem 1.4rem}
.nav a{color:#221a15;text-decoration:none;font-size:1.2rem;padding:.3rem 0}
.nav a[aria-current="page"]{font-weight:600}
.nav-toggle{display:none;background:none;border:1px solid rgba(34,26,21,.5);color:#221a15;font:inherit;font-size:.95rem;padding:.35rem .8rem;border-radius:2px;cursor:pointer}
@media (max-width:860px){
  .nav-toggle{display:block}
  .nav{position:absolute;left:0;right:0;top:100%;background:var(--paper);border-top:1px solid rgba(34,26,21,.2);display:none;padding:.5rem var(--gutter) 1.2rem}
  .nav.open{display:block}
  .nav ul{flex-direction:column;gap:0}
  .nav a{display:block;padding:.65rem 0;font-size:1.25rem}
}

/* Startseite: Hero auf Fotogrund */
.hero{background:#d7cec5;color:#1f1712;overflow:hidden}
.hero .wrap{display:grid;grid-template-columns:minmax(0,9fr) minmax(0,15fr);gap:1rem;align-items:center;min-height:min(82vh,46rem);padding-bottom:2rem}
.hero-text{position:relative;z-index:2;padding:2rem 0 3rem}
.hero-text .lead{margin-top:1.4rem;color:#2c221c}
.hero-fig{margin:0 calc(var(--gutter)*-1.6) 0 -6%;align-self:stretch;display:flex;align-items:center}
.hero-fig img{width:100%;-webkit-mask-image:radial-gradient(ellipse 50% 50% at 50% 50%,#000 72%,transparent 100%);mask-image:radial-gradient(ellipse 50% 50% at 50% 50%,#000 72%,transparent 100%);animation:settle 1.6s cubic-bezier(.2,.7,.2,1) both}
@keyframes settle{from{opacity:0;transform:translateX(2.5%) scale(1.02)}to{opacity:1;transform:none}}
@media (prefers-reduced-motion:reduce){.hero-fig img{animation:none}}
@media (max-width:860px){
  .hero .wrap{grid-template-columns:minmax(0,1fr);min-height:0;padding-bottom:0}
  .hero-fig{order:-1;margin:0 calc(var(--gutter)*-1)}
  .hero-fig img{-webkit-mask-image:radial-gradient(ellipse 50% 50% at 50% 50%,#000 70%,transparent 100%);mask-image:radial-gradient(ellipse 50% 50% at 50% 50%,#000 70%,transparent 100%)}
  .hero-text{padding:0 0 2.5rem}
}

/* Schaltflächen */
.actions{display:flex;flex-wrap:wrap;gap:.7rem;margin-top:1.8rem}
.btn{display:inline-block;font:inherit;font-size:1rem;font-weight:400;text-decoration:none;padding:.7rem 1.25rem;border:1px solid currentColor;border-radius:2px;color:inherit;line-height:1.2}
.btn:hover{color:inherit;background:rgba(0,0,0,.06)}
.btn-solid{background:#2a1f19;border-color:#2a1f19;color:#efe9e2}
.btn-solid:hover{background:#4a2414;border-color:#4a2414;color:#fff}

/* Unterseiten-Kopf */
.page-head{background:#d7cec5;color:#1f1712;overflow:hidden}
.page-head .wrap{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,22rem);gap:2rem;align-items:end}
.page-head .txt{padding:3.2rem 0 3rem}
.page-head .txt p{margin:1.1rem 0 0;color:#2c221c;font-size:1.12em;line-height:1.55}
.page-head figure{margin:0;align-self:stretch;display:flex;align-items:flex-end;justify-content:center}
.page-head figure img{max-height:24rem;width:auto;-webkit-mask-image:radial-gradient(ellipse 50% 50% at 50% 55%,#000 62%,transparent 100%);mask-image:radial-gradient(ellipse 50% 50% at 50% 55%,#000 62%,transparent 100%)}
@media (max-width:760px){.page-head .wrap{grid-template-columns:minmax(0,1fr)}.page-head figure{display:none}.page-head .txt{padding:2.4rem 0 2.2rem}}

/* Abschnitte */
.section{padding:40px 0}
.section + .section{border-top:1px solid var(--line)}
.split{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:clamp(2rem,6vw,6rem);align-items:start}
.split.wide-text{grid-template-columns:minmax(0,7fr) minmax(0,5fr)}
@media (max-width:820px){.split,.split.wide-text{grid-template-columns:1fr}}
figure{margin:0}
figcaption{font-size:.86rem;font-style:italic;color:var(--ink-soft);margin-top:.6rem;line-height:1.45}
.on-studio{background:var(--studio);padding:0}
.on-studio img{width:100%}

/* Leistungsliste */
.services{list-style:none;margin:2.2rem 0 0;padding:0;border-top:1px solid var(--line)}
.services li{border-bottom:1px solid var(--line)}
.services a{display:grid;grid-template-columns:minmax(0,18rem) minmax(0,1fr);gap:.3rem 2.5rem;padding:1.5rem 0;text-decoration:none;color:var(--ink)}
.services a:hover h3{color:var(--varnish)}
.services h3{margin:0;font-size:clamp(1.45rem,1.2rem + .8vw,1.9rem)}
.services p{margin:0;color:var(--ink-soft);max-width:34rem}
@media (max-width:700px){.services a{grid-template-columns:1fr}}

/* Profilband */
.band{background:var(--studio);line-height:0}
.band img{width:100%;max-height:30rem;object-fit:cover}

/* Auszeichnungen (chronologisch) */
.awards{list-style:none;padding:0;margin:1.4rem 0 0}
.awards li{display:grid;grid-template-columns:4.2rem 1fr;gap:1rem;padding:.75rem 0;border-top:1px solid var(--line)}
.awards li:last-child{border-bottom:1px solid var(--line)}
.awards time{font-family:"Times New Roman",Times,serif;font-size:1.3rem;line-height:1.3;color:var(--varnish)}
.awards span{line-height:1.5}

/* Portrait */
.portrait{display:grid;grid-template-columns:9rem 1fr;gap:1.4rem;align-items:center;margin-bottom:1.6rem}
.portrait img{width:9rem;height:9rem;object-fit:cover;border-radius:50%}
.portrait p{margin:0;font-style:italic;color:var(--ink-soft)}

/* Der Geigenzettel – Kontaktkarte */
.zettel{position:relative;background:#e9dcc4;color:#2a1d14;padding:2.2rem 2.2rem 2rem;max-width:34rem;box-shadow:0 1px 0 rgba(0,0,0,.08),0 18px 40px -22px rgba(40,25,15,.45);background-image:radial-gradient(130% 120% at 30% 20%,rgba(255,250,240,.55),transparent 60%),radial-gradient(90% 80% at 90% 100%,rgba(150,105,60,.18),transparent 70%)}
.zettel::before{content:"";position:absolute;inset:.7rem;border:1px solid rgba(60,35,20,.55);outline:3px double rgba(60,35,20,.35);outline-offset:-7px;pointer-events:none}
.zettel .name{font-family:"Times New Roman",Times,serif;font-style:italic;font-size:clamp(1.7rem,1.4rem + 1vw,2.2rem);margin:0 0 .2rem;line-height:1.1}
.zettel .what{font-family:"Times New Roman",Times,serif;font-size:1.15rem;margin:0 0 1.2rem}
.zettel address{font-style:normal;line-height:1.6;margin-bottom:1.2rem}
.zettel dl{display:grid;grid-template-columns:auto 1fr;gap:.15rem 1rem;margin:0 0 1.4rem}
.zettel dt{font-style:italic}
.zettel dd{margin:0}
.zettel a{color:#6a2a10}
.zettel .actions{margin-top:0}
.zettel .btn{border-color:rgba(42,29,20,.6);color:#2a1d14}
.zettel .btn-solid,.zettel .btn-solid:hover{color:#f3ede6}
.zettel .fecit{position:absolute;right:1.6rem;bottom:1.3rem;font-family:"Times New Roman",Times,serif;font-style:italic;font-size:.95rem;opacity:.7}
@media (max-width:520px){.zettel{padding:2rem 1.5rem 3rem}.zettel .fecit{right:1.2rem;bottom:1rem}}

/* Tabellen */
table.prices{border-collapse:collapse;width:100%;max-width:32rem;margin:1rem 0 .6rem}
table.prices th,table.prices td{text-align:left;padding:.6rem .8rem .6rem 0;border-bottom:1px solid var(--line);vertical-align:top}
table.prices th{font-weight:400;font-style:italic;color:var(--ink-soft)}
table.prices td:last-child{text-align:right;white-space:nowrap;padding-right:0}

/* Galerie */
.gallery{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:.6rem;background:var(--studio);padding:.6rem}
.gallery img{width:100%;aspect-ratio:3/4;object-fit:cover}
@media (max-width:560px){.gallery{grid-template-columns:repeat(2,minmax(0,1fr))}}

/* Ordered list (Kaufkriterien) */
ol.criteria{padding:0;margin:1.2rem 0 1.4rem;list-style:none;counter-reset:c}
ol.criteria li{counter-increment:c;display:grid;grid-template-columns:2.4rem 1fr;padding:.5rem 0;border-top:1px solid var(--line)}
ol.criteria li::before{content:counter(c);font-family:"Times New Roman",Times,serif;font-size:1.35rem;line-height:1.3;color:var(--varnish)}

/* Fachvortrag */
.article{max-width:40rem}
.article p{text-align:left;hyphens:auto}
.article h2{margin-top:2.2em}
.toc{list-style:none;padding:0;margin:0}
.toc li{padding:.35rem 0;border-top:1px solid var(--line)}
.toc a{text-decoration:none}
.vortrag{display:grid;grid-template-columns:minmax(0,15rem) minmax(0,1fr);gap:clamp(2rem,5vw,5rem)}
.vortrag aside{position:sticky;top:1.5rem;align-self:start;font-size:.95rem}
@media (max-width:860px){.vortrag{grid-template-columns:1fr}.vortrag aside{position:static}}

/* Fußzeile */
.site-foot{background:#2a211c;color:#d9d0c6;padding:3.5rem 0 2rem;font-size:.98rem}
.site-foot a{color:#ecc6a6}
.site-foot .cols{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:2rem}
.site-foot h2{font-size:1.4rem;margin:.65em 0 .6rem;color:#f1ebe3}
.site-foot p{margin:0 0 .4rem}
.site-foot ul{list-style:none;padding:0;margin:0}
.site-foot li{margin:.2rem 0}
.site-foot .legal{margin-top:2.8rem;padding-top:1.2rem;border-top:1px solid rgba(255,255,255,.12);font-size:.88rem;color:#a99e93;display:flex;flex-wrap:wrap;gap:.4rem 1.6rem}
@media (max-width:760px){.site-foot .cols{grid-template-columns:1fr}}
.hero h1,.page-head h1{overflow-wrap:anywhere}
.hero h1{font-size:clamp(2.4rem,1.5rem + 2.6vw,3.7rem)}

.brand img{width:clamp(10rem,23vw,16rem)}
.home-hero .wrap{grid-template-columns:minmax(0,1.15fr) minmax(0,.85fr);gap:clamp(2rem,5vw,5rem);min-height:0;padding-block:clamp(2rem,6vw,5rem)}
.home-hero .hero-text{padding:0}
.home-hero .hero-fig{margin:0;align-self:center}
.home-hero .hero-fig img{width:100%;max-height:36rem;aspect-ratio:4/5;object-fit:cover;object-position:center 34%;mask-image:none;animation:none}
.focus-grid{list-style:none;padding:0;margin:0;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:1rem}
.focus-grid li{padding:clamp(1.25rem,4vw,2.5rem);background:var(--paper-2)}
.focus-grid h2{margin-bottom:.35em}
.focus-grid p{margin:0}
.service-copy + .service-copy{margin-top:2.5rem}
address{font-style:normal;margin-bottom:1em}
@media(max-width:860px){
  .home-hero .wrap{grid-template-columns:minmax(0,1fr)}
  .home-hero .hero-fig{order:0;max-width:32rem}
}
@media(max-width:560px){.focus-grid{grid-template-columns:1fr}}

.uk-container-large.wrap{box-sizing:content-box}
.page-head .wrap:has(> .txt:only-child){grid-template-columns:minmax(0,1fr)}

.service-jumps{margin-top:1.5rem;row-gap:.5rem}
.service-gallery figure{margin:0}
.service-gallery img{width:100%;aspect-ratio:2/3;object-fit:cover}
.service-gallery figcaption{margin:.45rem 0 1rem}

body a:any-link{color:#aa531e}
body a:any-link:not(.brand):not(.uk-button):not(.btn):not(nav a):not(.service-jumps a){text-decoration:underline}
body a.uk-button-primary{background:var(--paper-2);border:1px solid currentColor}
body .nav a:any-link{color:#aa531e;text-decoration:none}
body .service-jumps a:any-link{color:#2c221c;text-decoration:underline}
.service-jumps.uk-subnav-divider > :nth-child(n+2):not(.uk-first-column)::before{border-left-color:#2c221c}
.service-divider{margin:0}
.service-divider img{width:100%}

body .site-foot a:any-link{color:#ecc6a6}
.home-hero .actions a.btn:any-link{color:inherit;text-decoration:none}
.home-hero .actions a.btn-solid:any-link{color:#efe9e2}
.home-hero .actions a.btn-solid:hover{color:#fff}

@media (min-width: 640px){
  .service-split{grid-template-columns:minmax(0,1fr) minmax(0,1fr)}
  .service-split > figure{margin-top:calc(.65 * clamp(1.9rem,1.4rem + 1.8vw,2.85rem))}
}