/* Golestan — persische Küche. Nach Christophs Gestaltungspaket vom 09.10.2026.
Die Vorgabe des Pakets: sinnlich, ruhig, kunstvoll — ein fein illustriertes Rezeptbuch.
Gartenkunst und Buchmalerei als Anspielung, ohne eine historische Epoche oder eine antike
Rezeptur zu behaupten; die Gartenillustration ist eine neue Arbeit, kein Museumsoriginal.
Bewahren (so steht es in der Übergabe):
- Cormorant Garamond für Überschriften, mit ihrer echten Kursiven. Lokal ausgeliefert
(SIL Open Font License), nie von einem fremden Server.
- Farben: Pergament, Jade, Tinte, Lapislazuli, Pflaume, Goldlinien.
- Schmuck bleibt fein: dünne Linien, kleine Rosetten. Keine Pillen-Knöpfe, keine schweren
Schatten, keine dichten Kartenraster.
- Symmetrie: Der Auftakt steht mittig, nicht links. Das unterscheidet Golestan von Iberien
(zwei Spalten) und von Mexiko (Plakat auf einer Fläche). */
@font-face{
font-family:Cormorant;
src:url('/assets/CormorantGaramond-variable.ttf') format('truetype');
font-weight:300 700;font-style:normal;font-display:swap;
}
@font-face{
font-family:Cormorant;
src:url('/assets/CormorantGaramond-Italic-variable.ttf') format('truetype');
font-weight:300 700;font-style:italic;font-display:swap;
}
:root{
--pergament:#FAF6EB;
--jade:#E5EADF;
--tinte:#253C43;
--lapis:#234B61;
--pflaume:#563344;
--gold:#9D773B;
--linie:#D2C5A6;
--leise:#606B65;
--serifen:Cormorant,Georgia,serif;
--seite-breite:1280px;
--seite-rand:clamp(24px,5vw,60px);
--primary:var(--pflaume);
--papier:var(--pergament);
--knopf-grund:var(--pflaume);
--knopf-schrift:var(--pergament);
--band-dunkel:var(--lapis);
--band-ruhig:var(--jade);
--band-akzent:var(--pflaume);
}
body{background:var(--pergament);color:var(--tinte);line-height:1.7}
/* Überschriften in Cormorant; die Kursive trägt den zweiten Teil der Zeile. */
h1,h2,h3{font-family:var(--serifen);font-weight:400;letter-spacing:0}
h1 em,h2 em,h3 em{font-style:italic;color:var(--pflaume)}
.eyebrow{font-size:clamp(11px,.35vw,12.5px);letter-spacing:.2em;line-height:1.8;font-weight:600;
color:var(--lapis)}
/* Kopfleiste: mittige Wortmarke, dünne Goldlinie darunter — kein Farbbalken. */
.topbar{background:var(--pergament);border-bottom:1px solid var(--linie);backdrop-filter:none}
.brand b{font-family:var(--serifen);font-weight:500;letter-spacing:.14em;text-transform:uppercase;
color:var(--tinte)}
.brand small{color:var(--leise);letter-spacing:.22em;font-size:11px}
.topbar nav a:hover{color:var(--pflaume)}
.basket{background:none;border:1px solid var(--linie);color:var(--tinte);border-radius:2px}
.basket b{background:var(--jade);color:var(--tinte)}
/* Der Auftakt: Jadefläche mit der Gartenmalerei dahinter, mittig gesetzter Text, darunter das
gerahmte Foto. Der Rahmen ist eine dünne Goldlinie, kein Schatten. */
.aufmacher-tisch{display:block;background:var(--jade);min-height:0;
padding:clamp(40px,5vw,46px) var(--seite-rand) clamp(44px,6vw,55px);
border-bottom:1px solid var(--linie);position:relative;isolation:isolate}
.aufmacher-tisch::before{content:"";position:absolute;inset:0;z-index:-1;opacity:.45;
background-image:url('/bilder/web/profil/garten-1536.webp');background-size:cover;
background-position:center}
/* Die Schrift steht nicht auf der gemalten Flaeche, sondern auf einem weichen Pergamentschleier
darueber. Christoph am 10.10.2026: „die kontraste sind teils zu gering" — der Garten ist ein
dichtes Bild aus Zypressen, Bluetenzweigen und Voegeln, und darauf verliert jede Zeile. Der
Schleier laeuft an den Raendern aus, also bleibt der Garten sichtbar, wo keine Schrift steht. */
.aufmacher-tisch > .tisch-text{position:relative;align-items:center;text-align:center;
max-width:62ch;margin:0 auto;padding:clamp(22px,3vw,34px) clamp(24px,4vw,56px) clamp(26px,3vw,36px)}
.aufmacher-tisch > .tisch-text::before{content:"";position:absolute;inset:-6% -4%;z-index:-1;
background:radial-gradient(ellipse 62% 58% at 50% 50%, rgba(250,246,235,.94) 0%,
rgba(250,246,235,.90) 52%, rgba(250,246,235,.62) 76%, rgba(250,246,235,0) 100%)}
.aufmacher-tisch .eyebrow{display:block;margin:0 0 18px;color:var(--lapis);font-weight:700}
.aufmacher-tisch h1{font:400 clamp(44px,6.1vw,88px)/.91 var(--serifen);color:var(--tinte);
letter-spacing:0;margin:0 0 24px;max-width:none}
.aufmacher-tisch .aufmacher-text{font-size:clamp(15px,.49vw,17px);line-height:1.7;max-width:58ch;
margin:0 auto 26px;color:var(--tinte)}
/* Kein Knopf mit Füllung: Der Entwurf führt mit einer unterstrichenen Zeile weiter. */
.aufmacher-tisch .knopf{align-self:center;background:none;border:0;border-bottom:1px solid var(--gold);
border-radius:0;color:var(--tinte);padding:6px 2px;min-height:0;font-size:clamp(14px,.45vw,16px);
font-weight:500;letter-spacing:.02em}
.aufmacher-tisch .knopf:hover{transform:none;color:var(--pflaume)}
.aufmacher-notiz{text-align:center;color:var(--leise)}
/* Das Bild steht unter dem Text, gerahmt und mittig — nicht als zweite Spalte. */
.aufmacher-tisch > .tisch-bild{position:relative;max-width:min(100%,740px);margin:0 auto;
min-height:0;aspect-ratio:1.5;border:1px solid var(--gold);padding:7px;background:var(--pergament)}
.aufmacher-tisch .aufmacher-bild{position:absolute;inset:7px;width:auto;background-position:center}
/* Seit dem 10.10.2026 steht hier ein echtes ![]()
statt eines Hintergrundbildes, damit die
Bildersuche und ein Vorlesegeraet es sehen. Der Ausschnitt muss darum zweimal dastehen:
einmal fuer den Hintergrund, einmal fuer das Bild. Ohne die zweite Zeile faellt der
gewaehlte Ausschnitt auf die Mitte zurueck. */
.aufmacher-tisch .aufmacher-bild > .flaechenbild{object-fit:cover;object-position:center}
.aufmacher-tisch > .tisch-bild::after{display:none}
.aufmacher-tisch figcaption{position:static;color:var(--leise);font:italic 400 clamp(13px,.42vw,15px)/1.5
var(--serifen);padding:10px 4px 0;text-align:left}
@media(max-width:860px){
.aufmacher-tisch{display:block}
.aufmacher-tisch > .tisch-bild{height:auto}
}
/* Die Einladungszeile: zwei Grüße mit einer Rosette dazwischen, auf Pergament. */
.einladung{border-bottom:1px solid var(--linie);color:var(--lapis);gap:18px 30px}
.einladung > span{font-family:var(--serifen);font-style:italic;font-size:clamp(19px,2vw,26px)}
.einladung svg{color:var(--gold)}
.einladung p{color:var(--leise)}
/* Das Rezept des Tages steht in einem weinroten Band ueber die volle Breite — die Masse aus
collection.css der Vorlage: Pflaume mit Goldlinie, Text links, Foto rechts in einem
goldgerahmten Kasten, dessen Grund die Rosette traegt. */
.tagesrezept-tisch{margin-left:calc(50% - 50vw);margin-right:calc(50% - 50vw);
margin-block:clamp(40px,6vw,86px);background:var(--pflaume);color:var(--pergament);border:0;
border-top:1px solid var(--gold);border-bottom:1px solid var(--gold);
padding:clamp(40px,5vw,62px) max(var(--seite-rand),calc(50vw - var(--seite-breite) / 2));
gap:clamp(30px,4vw,65px);grid-template-columns:1fr 1.08fr}
.tagesrezept-tisch > .tages-text{order:1;padding:18px 0}
.tagesrezept-tisch > .tages-bild{order:2;aspect-ratio:1.06;overflow:visible;padding:12px;
border:1px solid #c7a775;
background:var(--pflaume) url('/assets/rosette.svg') center/75px no-repeat}
.tagesrezept-tisch .tages-marke{background:rgba(250,246,235,.92);color:var(--pflaume);
letter-spacing:.2em;border-radius:0;font-weight:600;top:28px;left:28px}
.tagesrezept-tisch .eyebrow{color:#ddc493}
.tagesrezept-tisch h2{font:400 clamp(34px,3.8vw,66px)/.97 var(--serifen);color:var(--pergament);
letter-spacing:0;max-width:16ch}
.tagesrezept-tisch .beschreibung{color:#f0e3de;font-size:clamp(14px,.46vw,16px);line-height:1.9;
max-width:44ch}
.tagesrezept-tisch .fakten-zeile{border-top:1px solid rgba(250,246,235,.28);
border-bottom:1px solid rgba(250,246,235,.28);padding:13px 0;margin:22px 0 24px;color:#e8d6d0}
.tagesrezept-tisch .knopf{background:none;border:1px solid #dbc18e;border-radius:0;
color:var(--pergament);padding:14px 22px}
.tagesrezept-tisch .knopf:hover{background:rgba(250,246,235,.08);transform:none}
.tagesrezept-tisch .merken{border-color:rgba(250,246,235,.45);border-radius:0;
color:var(--pergament)}
/* Sammlung: lockeres Raster, Karten ohne Rahmenkasten — nur Bild, Linie, Text. */
.section-head .eyebrow{color:var(--lapis)}
.section-head h2{font:400 clamp(32px,3.4vw,54px)/1.05 var(--serifen);letter-spacing:0}
.kopf-notiz{color:var(--leise)}
.search{border:1px solid var(--linie);background:var(--pergament);border-radius:2px}
.categories button{border-radius:2px;border:1px solid transparent;font-size:clamp(12px,.38vw,14px);
padding:8px 14px;min-height:38px}
.categories button.active,button.active{background:var(--lapis);border-color:var(--lapis);
color:var(--pergament)}
.mehr-filter{border-radius:2px;border-color:var(--linie);color:var(--tinte)}
.mehr-filter.offen{background:var(--lapis);border-color:var(--lapis);color:var(--pergament)}
.weitere-filter{background:var(--jade);border:1px solid var(--linie);border-radius:2px}
.recipe{background:none;border:0;border-radius:0;border-bottom:1px solid var(--linie);
padding-bottom:18px}
.recipe h3{font-family:var(--serifen);font-weight:400}
.recipe h3 a{color:var(--tinte)}
.recipe h3 a:hover,.recipe a,.text-link{color:var(--pflaume)}
.region{color:var(--lapis)!important;letter-spacing:.18em}
.merken-knopf{background:var(--pergament);color:var(--tinte);border-radius:50%}
.merken-knopf.gemerkt,.merken-rund.gemerkt,.nur-gemerkte.active{color:var(--pflaume)}
/* Der Gebietsabschnitt: Bild in Jade links, Text auf Lapislazuli rechts — der kulturelle
Einschub des Entwurfs. */
.band-regionen{gap:0;align-items:stretch;background:var(--lapis);color:var(--pergament);
margin-left:calc(50% - 50vw);margin-right:calc(50% - 50vw);padding:0}
/* Das Bild fuellt seine Spalte. Vorher stand hier `background-size:contain` — das Bild ist aber
ein echtes ![]()
, dort zaehlt `object-fit`, und so war das Gemaelde auf einen Streifen
beschnitten (Christoph am 11.10.2026: „das schaut etwas eigenartig aus"). */
.band-regionen .regionen-bild{background:var(--jade);min-height:0}
.band-regionen .regionen-foto{inset:0}
.regionen-bildtext{position:absolute;left:clamp(20px,2.4vw,34px);right:clamp(20px,2.4vw,34px);
bottom:clamp(14px,1.6vw,22px);color:var(--pergament);font:400 12px/1.6 var(--body,inherit);
letter-spacing:.14em;text-transform:uppercase}
/* Das Innenmass haengt an der Spalte, nicht am Seitenraster: Auf einem breiten Schirm stand der
Text sonst ganz links und daneben ein Meter leeres Lapislazuli. */
.regionen-text{padding:clamp(34px,4vw,60px) clamp(28px,4vw,60px);width:100%;
max-width:calc(var(--seite-breite) / 2);margin-inline:auto}
.band-regionen .eyebrow{color:var(--gold)}
.band-regionen h2{font:400 clamp(30px,3.2vw,54px)/1.05 var(--serifen);color:var(--pergament)}
.band-regionen h2 em{color:#EAD9B6}
.regionen-text > p:not(.eyebrow){color:rgba(250,246,235,.86)}
.regionen-pillen .pill{border-color:rgba(250,246,235,.4);color:var(--pergament);border-radius:2px}
.regionen-pillen .pill:hover{background:rgba(250,246,235,.1)}
.regionen-pillen .pill.active{background:var(--gold);border-color:var(--gold);color:var(--tinte)}
.regionen-hinweis{border-top-color:rgba(250,246,235,.3)}
.regionen-hinweis .eyebrow{color:var(--gold)}
.regionen-hinweis p:not(.eyebrow){color:rgba(250,246,235,.86)}
.regionen-hinweis .text-link{color:#EAD9B6;border-bottom-color:#EAD9B6}
@media(max-width:860px){
.band-regionen{display:block}
.regionen-text{padding:clamp(28px,5vw,44px) var(--seite-rand)}
}
/* Der Reihenhinweis: Pergament mit einer feinen Rahmenlinie, mittig — kein Farbfeld. */
.partnerhinweis{background:none;border:1px solid var(--linie);color:var(--tinte);text-align:center;
max-width:var(--seite-breite);margin-inline:auto;padding:clamp(34px,4vw,56px) clamp(24px,4vw,48px)}
.partnerhinweis > div{max-width:60ch;margin:0 auto}
.partnerhinweis .eyebrow{color:var(--lapis)}
.partnerhinweis h2{font:400 clamp(30px,3.2vw,48px)/1.08 var(--serifen)}
.partnerhinweis p{color:var(--leise)}
.partnerhinweis .text-link{border-bottom:1px solid var(--gold);padding-bottom:5px;color:var(--tinte)}
/* Fuss: das weinrote Band der Vorlage — Pflaume, Wortmarke in Serifen, feine helle Schrift. */
footer{background:var(--pflaume);border-top:0;color:#e2d5d4;align-items:flex-start;
gap:clamp(20px,3vw,40px);padding:45px var(--seiten-inset) 28px;font-size:13px}
footer p{margin:0;color:#e2d5d4}
footer a{color:inherit}
footer a:hover{color:#dac493}
.footer-brand{font-family:var(--serifen);font-weight:500;font-size:clamp(22px,2vw,26px);
letter-spacing:.14em;text-transform:uppercase;color:var(--pergament);line-height:1.4}
.fusslinks{gap:14px}
/* Rezeptseite: Buchsatz — Titel in Cormorant, Zutaten auf Jade, Ziffern in Gold. */
.rezeptseite{max-width:calc(var(--seite-breite) + 2 * var(--seite-rand))}
.detail-kopf h1{font:400 clamp(36px,4.6vw,72px)/1.04 var(--serifen);letter-spacing:0;margin:18px 0}
.detail-kopf .region{letter-spacing:.2em;color:var(--lapis)}
.detail-kopf .beschreibung,.detail-kopf .einleitung{color:var(--leise);
font-size:clamp(14px,.46vw,16px)}
.recipe-columns > section:first-child{background:var(--jade);padding:26px 25px}
.recipe-columns h2{font:400 clamp(28px,2.4vw,38px)/1.1 var(--serifen);letter-spacing:0}
.recipe-columns .steps > li::before{color:var(--gold);font-family:var(--serifen)}
/* ======================================================================
Golestan — der Stil der Vorlage, Maß für Maß (abgelesen am 11.10.2026).
Feine Linien, kleine Ornamente, sehr kleine gesperrte Schrift.
====================================================================== */
/* ---- Die Grundzeichen, auf denen alles andere steht ---- */
.aufmacher-tisch .eyebrow,.aromen .eyebrow,.rezeptbuch .eyebrow,
.kulturband .eyebrow,.abschluss .eyebrow{
font-size:12px;letter-spacing:.2em;line-height:1.8;font-weight:600;color:var(--lapis);
margin:0 0 18px}
.aromen .text-link,.rezeptbuch .text-link,.abschluss .text-link,.kulturband .text-link{
display:inline-flex;align-items:center;gap:22px;padding-bottom:5px;
border-bottom:1px solid var(--gold);font-size:12px;font-weight:500}
.aromen .text-link span,.rezeptbuch .text-link span,.abschluss .text-link span,
.kulturband .text-link span{font-size:19px;line-height:1}
/* ---- Auftakt: randlos, der Schleier laeuft waagerecht aus ---- */
/* Der Schleier liegt ueber der ganzen Flaeche und laeuft nach links und rechts aus — er
gehoert an das Element selbst, nicht an den Textkasten. Dort ergab er einen harten
Streifen quer durch das Bild (11.10.2026). Unten genug Platz, damit der Bogen und die
Rosette nicht an der Abschnittskante abgeschnitten werden. */
.aufmacher-tisch{max-width:none;width:auto;margin-inline:0;padding:46px 24px 96px;
overflow:visible}
.aufmacher-tisch::before{opacity:.66}
.aufmacher-tisch > .tisch-text{max-width:900px;margin:0 auto;padding:0}
/* Kein eigener Schleier mehr an dieser Stelle: Es gilt wieder der weiche Pergamentschein
hinter dem Titel von weiter oben. Der waagerechte Verlauf ergab einen breiten Balken quer
durch den Garten (Christoph am 11.10.2026: „nun hast du da diesen fetten balken draus
gemacht"). */
.aufmacher-tisch h1{font-size:clamp(44px,6.1vw,88px);line-height:.91;margin:0 0 24px;
max-width:none}
.aufmacher-tisch h1 em{color:var(--lapis)}
.aufmacher-tisch .aufmacher-text{font-size:13px;line-height:1.8;margin:0 auto 15px;max-width:600px}
.aufmacher-tisch .knopf{margin-bottom:30px}
/* Das Bild ist ein Bogen, kein Rechteck — die Form, die den Auftakt traegt. */
.aufmacher-tisch > .tisch-bild{max-width:760px;margin:0 auto;padding:9px 9px 0;
border:1px solid var(--gold);background:var(--pergament);border-radius:240px 240px 0 0;
position:relative;aspect-ratio:auto;min-height:0}
.aufmacher-tisch .aufmacher-bild{position:relative;inset:auto;height:298px;width:100%;
border-radius:230px 230px 0 0;overflow:hidden}
.aufmacher-tisch .aufmacher-bild > .flaechenbild{object-fit:cover;object-position:center 54%}
.aufmacher-tisch figcaption{padding:14px 12px;display:flex;justify-content:space-between;
align-items:center;gap:12px;font-size:12px;position:static;text-align:left}
.aufmacher-tisch figcaption .randnotiz{font-size:12px;letter-spacing:.2em;color:var(--leise)}
/* Die Rosette liegt auf der unteren Kante des Bogens. */
.aufmacher-tisch::after{content:"";position:absolute;left:calc(50% - 35px);bottom:-29px;
width:70px;height:70px;border-radius:50%;background:var(--pergament)
url('/assets/rosette.svg') center/62px 62px no-repeat;z-index:2;display:block;margin:0}
/* ---- Stille Leiste: neun Punkt, die Trennzeichen in Gold ---- */
.stille-leiste{gap:42px;padding:38px 20px 25px;font-size:12px;letter-spacing:.16em;
border-bottom:1px solid var(--linie);color:var(--tinte)}
.stille-leiste i{color:var(--gold);font-size:22px;opacity:1}
/* ---- Rezeptbuch: ein aufgeschlagenes Buch auf Papier ---- */
.rezeptbuch{background:#eaeadd;border-top:1px solid var(--linie);
border-bottom:1px solid var(--linie);padding:88px 40px}
.rezeptbuch .aromen-kopf,.aromen .aromen-kopf{max-width:900px;margin:0 auto 35px}
.rezeptbuch .aromen-kopf > p:not(.eyebrow),.aromen .aromen-kopf > p:not(.eyebrow){
color:var(--leise);font-size:13px}
.buch-reiter-reihe{gap:30px;margin:0 0 30px}
.buch-reiter{color:var(--leise);padding:8px 0;font-family:var(--serifen);font-size:24px;gap:10px;
border-bottom:1px solid transparent}
.buch-reiter span{font-family:inherit;font-size:12px;font-family:var(--grotesk,inherit)}
.buch-reiter.ist-hier{color:var(--pflaume);border-bottom-color:var(--gold)}
.buch-buehne{max-width:1060px;margin:0 auto;box-shadow:0 14px 32px #263c4320;
border:1px solid #bfb49a;background:var(--pergament);padding:12px}
.buch-seite{border:0;background:none;min-height:420px}
.buch-seite figure{border:1px solid var(--linie);min-height:0}
.buch-seite figcaption{background:#253c43ce;color:var(--pergament);padding:13px 20px;
font-size:12px;letter-spacing:.15em;left:0;right:0;bottom:0}
.buch-text{padding:38px 42px;border:1px solid var(--linie);border-left:0;
background:linear-gradient(90deg,#4f443015,transparent 6%)}
.buch-text .kapitel{font-size:12px;letter-spacing:.16em;color:var(--gold);margin:0 0 24px}
.buch-text h3{font-size:clamp(30px,3.4vw,50px);margin:0 0 20px;line-height:1.05}
.buch-text > p:not(.kapitel):not(.buch-zutaten){max-width:360px;font-size:13px;line-height:1.8}
.buch-angaben{gap:20px;font-size:12px;padding:13px 0;margin:12px 0;
border-top:1px solid var(--linie);border-bottom:1px solid var(--linie);color:var(--tinte)}
.buch-zutaten{font-family:var(--serifen);font-style:italic;font-size:18px;color:var(--leise);
margin:0}
.buch-text .knopf{display:inline-flex;align-items:center;justify-content:space-between;gap:30px;
padding:12px 19px;background:var(--pflaume);color:var(--pergament);
border:1px solid var(--pflaume);border-radius:0;font-size:12px;line-height:1.6}
.folio{font-family:var(--serifen);font-size:20px;color:var(--gold);bottom:16px;right:24px}
.buch-steuer{gap:28px;margin:28px auto 0;font-size:12px;letter-spacing:.14em}
.buch-steuer button{width:40px;height:40px;border:1px solid #b7b49b;color:var(--lapis);
font-size:21px}
.buch-steuer button:hover{background:var(--pergament)}
/* ---- Duftkompass: grosse Zeichnungen, winzige Beschriftung, Goldbalken ---- */
.aromen{padding:88px 40px 72px;background:var(--pergament)}
.aromen-wahl{display:grid;grid-template-columns:repeat(4,1fr);max-width:850px;margin:0 auto;
border-bottom:1px solid var(--linie);gap:0}
.aroma-wahl{padding:0 15px 28px;position:relative;border-bottom:0;gap:0}
.aroma-wahl svg{width:78px;height:78px;margin-bottom:13px;transition:transform .25s}
.aroma-wahl:hover svg{transform:translateY(-5px)}
.aroma-wahl span{font-family:var(--serifen);font-weight:600;font-size:27px;line-height:1.2}
.aroma-wahl small{font-size:12px;letter-spacing:.17em;margin-top:10px;color:var(--leise)}
.aroma-wahl.ist-hier::after{content:"";height:3px;background:var(--gold);position:absolute;
bottom:-2px;left:25%;right:25%}
.aromen-satz{text-align:center;max-width:630px;margin:28px auto 0;min-height:144px;
border-top:0;padding-top:0}
.aroma-note{font-size:12px;letter-spacing:.15em;color:var(--gold);margin-bottom:0}
.aromen-satz p{font-size:14px;margin:12px 0 14px;line-height:1.8}
/* ---- Gartenband: das Bild steht auf salbeigruenem Grund, nicht randfuellend ---- */
.kulturband{grid-template-columns:1.08fr 1fr;background:var(--lapis);color:var(--pergament)}
.kulturband-bild{background:#adb89e;display:flex;align-items:center;padding:45px 24px;
min-height:0}
.kulturband-foto{position:relative;inset:auto;width:100%;height:auto;object-fit:contain}
.band-bildtext{left:24px;right:24px;bottom:16px;text-align:center;font-size:12px;
letter-spacing:.12em;color:#253c43;background:none;padding:0}
.kulturband-text{padding:70px 60px;max-width:700px;align-self:center;gap:0;margin-inline:auto}
.kulturband-text .eyebrow{color:#d8c898}
.kulturband-text h2{font-size:clamp(32px,3.6vw,52px);margin:0 0 16px}
.kulturband-text h2 em{color:#d4d9c3}
.kulturband-text p{font-size:13px;line-height:1.85;color:#e1e6df;margin:0 0 14px}
.kulturband .text-link.hell{color:var(--pergament);border-color:#c7a967}
.band-signet{margin-bottom:28px}
/* ---- Abschluss: der Text liegt auf dem Bildrahmen auf ---- */
.abschluss{padding:75px 24px 80px;max-width:1440px;margin:0 auto;background:var(--pergament)}
.abschluss-text{position:relative;z-index:1;background:var(--pergament);max-width:600px;
padding:0 20px 26px;margin:0 auto -16px}
.abschluss-text h2{margin:0 0 18px}
.abschluss-text p{font-size:13px;color:var(--leise)}
.abschluss-bild{max-width:1040px;margin:0 auto;padding:10px;border:1px solid var(--gold)}
.abschluss-foto{width:100%;height:350px;object-fit:cover;object-position:center 48%}
@media(max-width:860px){
.aromen-wahl{grid-template-columns:repeat(2,1fr)}
.aroma-wahl svg{width:56px;height:56px}
.aroma-wahl span{font-size:21px}
.kulturband-text{padding:44px 24px}
.buch-text{padding:26px 22px;border-left:1px solid var(--linie);border-top:0}
}