/* Theme tonikum – Feinheiten über das Grund-Stylesheet hinaus */

/* Das echte Logo ist hochkant (Schriftzug in zwei Zeilen) und braucht mehr Höhe als der frühere Platzhalter */
.brand img{height:64px}
.site-head.stuck .brand img{height:48px}
@media (max-width:720px){.brand img{height:52px}}

/* ---------------------------------------------------------------------------------------------
   Hero-Überschrift „Alles! außer … gewöhnlich“ – kleiner, ruhig und edel statt plakativ
   --------------------------------------------------------------------------------------------- */
.hero h1.display{font-size:clamp(2.5rem,4.6vw,4.4rem);font-weight:400;line-height:1.06;letter-spacing:.012em}
.hero h1 .line{display:block}
.hero h1 .aside{font-size:.5em;font-weight:400;font-style:normal;letter-spacing:.06em;margin:.28em 0 .18em .9em;color:var(--clay-d)}
.hero h1 .big{display:inline-block;margin-left:.42em;font-style:normal;font-weight:400;color:var(--ink);
  -webkit-text-stroke:0;letter-spacing:.01em}
.hero h1 .big::after{content:"";display:block;width:2.6em;height:1px;margin:.42em 0 0 .06em;
  background:linear-gradient(90deg,var(--gold),rgba(196,161,74,0))}
@media (max-width:720px){.hero h1.display{font-size:clamp(2.2rem,9vw,3rem)}}

/* ---------------------------------------------------------------------------------------------
   Showroom-Hinweis unter „01 Willkommen“
   --------------------------------------------------------------------------------------------- */
.showroom-card{display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);gap:clamp(1.4rem,4vw,3.4rem);align-items:center;
  margin-top:clamp(2.4rem,5vw,4rem);background:var(--cream);border-radius:4px 28px 4px 28px;padding:clamp(1rem,2.4vw,1.6rem)}
.showroom-img{margin:0;overflow:hidden;border-radius:44% 44% 8px 8px/30% 30% 8px 8px;aspect-ratio:4/3.4}
.showroom-img img{width:100%;height:100%;object-fit:cover;object-position:50% 60%}
.showroom-copy{padding-right:clamp(0rem,3vw,2rem)}
.showroom-copy h3{font-family:var(--serif);font-weight:400;font-size:clamp(1.5rem,2.6vw,2.1rem);line-height:1.15;margin:.4rem 0 .9rem}
.showroom-copy p{margin:0 0 1.2rem;color:var(--ink-2)}
.showroom-copy .btn{margin-top:.3rem}
@media (max-width:720px){
  .showroom-card{grid-template-columns:1fr;padding:.8rem .8rem 1.4rem}
  .showroom-copy{padding:0 .6rem}
}

/* ---------------------------------------------------------------------------------------------
   Rückmeldung der Kundin 2026-10-26: Überschriften ruhiger und moderner – keine verschnörkelten
   Kursiven, „verwenden · verschenken · gern haben“ deutlich kleiner, Schriften vereinheitlicht
   --------------------------------------------------------------------------------------------- */
.pull,.sign,.foot-kicker,.suit-words em,.news-head h2 em{font-style:normal}
.suit-list li{font-family:var(--sans);font-size:clamp(1rem,1.3vw,1.15rem)}
.suit-words{font-size:clamp(1.5rem,2.8vw,2.3rem);gap:.6rem;line-height:1.15}
.suit-words em,.suit-words em:nth-child(3){font-weight:400;color:var(--paper)}
.suit-words span{font-size:.6em}
.pull{font-size:clamp(1.15rem,1.5vw,1.4rem)}

/* Öffnungszeiten: eine Schrift (Helvetica), Tage nicht mehr in der Überschrift-Schrift */
.h-week dt{font-family:var(--sans);font-weight:700}
.addr{font-family:var(--sans);font-size:1rem}
.h-status small{font-size:.92rem}

/* Willkommen: Bild unter der Überschrift */
.intro-img{margin:1.8rem 0 0;width:min(320px,75%);overflow:hidden;border-radius:44% 44% 8px 8px/30% 30% 8px 8px;
  border:1px solid var(--line);background:var(--cream)}
.intro-img img{width:100%;aspect-ratio:4/5;object-fit:cover}
/* rechte Spalte (Text + Zitat) mittig neben Überschrift und Bild, damit rechts unten kein Loch bleibt */
.intro .two{align-items:center}

/* Über mich auf der Startseite: nur noch ein Bild */
.studio-grid.single{align-items:center}

/* Laden-Seite: lange Überschrift („Alle aktuellen Serien und Einzelstücke …“) kleiner setzen */
.page-shop .page-head .display{font-size:clamp(2.1rem,4.4vw,3.7rem);max-width:24ch}

/* Über mich: Zitat von Meister Eckhart */
.prose blockquote{margin:1.6rem 0;padding:.4rem 0 .4rem 1.4rem;border-left:3px solid var(--clay);
  font-family:var(--serif);font-size:clamp(1.15rem,1.5vw,1.4rem);line-height:1.35;color:var(--sea-d)}
.prose blockquote small{display:block;margin-top:.5rem;font-family:var(--sans);font-size:.85rem;color:var(--ink-2)}

/* ---------------------------------------------------------------------------------------------
   Handy: Startbild direkt unter „Alles! außer … gewöhnlich“, Text und Buttons darunter
   --------------------------------------------------------------------------------------------- */
@media (max-width:860px){
  .page-home .hero-grid{gap:0}
  .page-home .hero-copy{display:contents}
  .page-home .hero-copy .kicker{order:1}
  .page-home .hero h1{order:2;margin-bottom:0}
  .page-home .hero-art{order:3;width:86%;margin:1.5rem 0 2.2rem auto}
  .page-home .hero .lede{order:4;margin-top:0}
  .page-home .hero-cta{order:5}
  .page-home .hero-hours{order:6}
  .page-home .hero .stamp{left:-2.6rem;bottom:-1.6rem;width:96px}
}

/* Startbild aus dem Backend: beliebiges Format sauber zuschneiden */
.hero .arch img{aspect-ratio:1200/820;object-fit:cover;height:auto}

/* Referenzen unter „Etwas Bestimmtes im Kopf?“ – Notizzettel auf dunklem Grund wie früher „Aus dem Ofen“ */
.refs{margin-top:clamp(1rem,3vw,2rem)}
.ref-notes{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:1.1rem 1.3rem;margin:0;padding:0;list-style:none}
.ref-notes .note,.ref-notes .note:nth-child(3){transform:rotate(-.8deg);padding:1.2rem 1.4rem}
.ref-notes .note:nth-child(even){transform:rotate(.9deg) translateY(.5rem)}
.ref-notes .note:nth-child(3n){transform:rotate(-.3deg)}
.ref-notes .note:hover{transform:rotate(0) translateY(-4px)}
.ref-notes h3{font-size:clamp(1.1rem,1.6vw,1.4rem);margin:0}
.ref-notes .ref-more{background:transparent;box-shadow:none;color:var(--paper);border-left:0}
.ref-notes .ref-more h3{color:var(--rose)}
@media (max-width:600px){.ref-notes{grid-template-columns:1fr}}

/* Schriften im Stil eines großen Markenauftritts – frei lizenziert (SIL OFL): Source Serif 4 leicht für
   Überschriften, Inter für den Text. Keine proprietäre Markenschrift, nur ähnlicher Charakter. */
:root{--sans:"Inter","Helvetica Neue",Helvetica,Arial,sans-serif}
:root[data-hfont="sourceserif"] .hero h1.display,:root[data-hfont="sourceserif"] .hero h1 .big,
:root[data-hfont="sourceserif"] .hero h1 .aside{font-weight:300}
:root[data-hfont="sourceserif"] .h-mid{letter-spacing:-.02em}
body{letter-spacing:-.003em}