/* Restaurant Terminus – Karten (Speisekarte, Tagesmenü, Monatshit)
   Gemeinsam für Website und Druck. Vorlagen über Klasse .v-<name>.
   Schriften: Cormorant Garamond, Montserrat, Caveat (SIL Open Font License, siehe /css/fonts). */
@font-face { font-family: "TK Serif"; src: url(fonts/cormorant-garamond-latin-500-normal.woff2) format("woff2"); font-weight: 500; font-display: swap; }
@font-face { font-family: "TK Serif"; src: url(fonts/cormorant-garamond-latin-600-normal.woff2) format("woff2"); font-weight: 600; font-display: swap; }
@font-face { font-family: "TK Serif"; src: url(fonts/cormorant-garamond-latin-700-normal.woff2) format("woff2"); font-weight: 700; font-display: swap; }
@font-face { font-family: "TK Serif"; src: url(fonts/cormorant-garamond-latin-500-italic.woff2) format("woff2"); font-weight: 500; font-style: italic; font-display: swap; }
@font-face { font-family: "TK Sans"; src: url(fonts/montserrat-latin-400-normal.woff2) format("woff2"); font-weight: 400; font-display: swap; }
@font-face { font-family: "TK Sans"; src: url(fonts/montserrat-latin-500-normal.woff2) format("woff2"); font-weight: 500; font-display: swap; }
@font-face { font-family: "TK Sans"; src: url(fonts/montserrat-latin-600-normal.woff2) format("woff2"); font-weight: 600; font-display: swap; }
@font-face { font-family: "TK Kreide"; src: url(fonts/caveat-latin-400-normal.woff2) format("woff2"); font-weight: 400; font-display: swap; }
@font-face { font-family: "TK Kreide"; src: url(fonts/caveat-latin-700-normal.woff2) format("woff2"); font-weight: 700; font-display: swap; }

.tk-karte {
  --papier: #FBF7EE; --tinte: #2B2320; --akzent: #5A2A27; --akzent2: #B8893D; --linie: #D9C9A8; --leise: #6B5E58;
  --titel-font: "TK Serif", Georgia, serif; --text-font: "TK Sans", "Segoe UI", Arial, sans-serif; --gr: 1;
  position: relative; box-sizing: border-box; background: var(--papier); color: var(--tinte); font-family: var(--text-font);
  font-size: calc(15px * var(--gr)); line-height: 1.45; padding: calc(56px * var(--gr)) calc(64px * var(--gr)) calc(40px * var(--gr));
  border-radius: 10px; box-shadow: 0 10px 34px rgba(60,30,20,.10); overflow: hidden; margin: 0 0 34px;
  -webkit-print-color-adjust: exact; print-color-adjust: exact;
}
.tk-karte * { box-sizing: border-box; }
.tk-orn { position: absolute; width: calc(150px * var(--gr)); height: calc(150px * var(--gr)); pointer-events: none; z-index: 0; }
.tk-orn svg { width: 100%; height: 100%; display: block; }
.tk-orn.tl { top: 6px; left: 6px; }
.tk-orn.tr { top: 6px; right: 6px; transform: scaleX(-1); }
.tk-orn.bl { bottom: 6px; left: 6px; transform: scaleY(-1); }
.tk-orn.br { bottom: 6px; right: 6px; transform: scale(-1,-1); }
.tk-kopf, .tk-inhalt, .tk-fuss, .tk-tm-preis { position: relative; z-index: 1; }
.tk-karte:has(.tk-orn) { padding-bottom: calc(118px * var(--gr)); }
.tk-kopf { text-align: center; margin-bottom: calc(22px * var(--gr)); }
.tk-logo { height: calc(58px * var(--gr)); width: auto; display: block; margin: 0 auto calc(12px * var(--gr)); }
.tk-titel { font-family: var(--titel-font); font-weight: 600; font-size: calc(46px * var(--gr)); line-height: 1.05; color: var(--akzent); margin: 0; letter-spacing: .5px; }
.tk-unter { font-family: var(--titel-font); font-style: italic; font-size: calc(20px * var(--gr)); color: var(--leise); margin: calc(6px * var(--gr)) 0 0; }
.tk-zier { width: calc(120px * var(--gr)); height: 10px; margin: calc(14px * var(--gr)) auto 0;
  background: radial-gradient(circle, var(--akzent2) 0 3px, transparent 3.5px) center / 10px 10px no-repeat,
              linear-gradient(var(--akzent2), var(--akzent2)) left center / 44% 1px no-repeat,
              linear-gradient(var(--akzent2), var(--akzent2)) right center / 44% 1px no-repeat; }
.tk-inhalt { column-gap: calc(46px * var(--gr)); }
.tk-rubrik { break-inside: avoid-column; margin: 0 0 calc(22px * var(--gr)); }
.tk-rubrik h3, .tk-tag h3, .tk-hit h3 { font-family: var(--titel-font); font-weight: 700; font-size: calc(25px * var(--gr)); color: var(--akzent); margin: 0 0 calc(6px * var(--gr));
  padding-bottom: calc(4px * var(--gr)); border-bottom: 1px solid var(--linie); break-after: avoid; }
.tk-rubtext { font-size: .88em; color: var(--leise); margin: 0 0 calc(8px * var(--gr)); font-style: italic; }
.tk-art { padding: calc(5px * var(--gr)) 0; break-inside: avoid; }
.tk-zeile { display: flex; align-items: baseline; gap: 8px; }
.tk-name { font-weight: 500; }
.tk-punkte { flex: 1 1 auto; border-bottom: 1px dotted var(--linie); transform: translateY(-4px); min-width: 16px; }
.tk-preis { font-weight: 600; white-space: nowrap; color: var(--tinte); font-variant-numeric: tabular-nums; }
.tk-preis small { font-weight: 400; color: var(--leise); font-size: .8em; }
.tk-trenn { font-style: normal; color: var(--akzent2); margin: 0 7px; }
.tk-besch { font-size: .86em; color: var(--leise); margin: 1px 0 0; }
.tk-info { font-size: .74em; color: var(--leise); margin-top: 2px; display: flex; flex-wrap: wrap; gap: 4px 10px; }
.tk-mm { display: inline-block; padding: 0 6px; border-radius: 9px; background: color-mix(in srgb, var(--akzent2) 18%, transparent); color: var(--tinte); font-size: .95em; }
.tk-mm-vegi, .tk-mm-vegan { background: #E2EFD9; color: #2F5A22; }
.tk-mm-vorbestellung { background: #F6E7C8; color: #7A5410; }
.tk-art.aus .tk-name, .tk-art.aus .tk-preis { text-decoration: line-through; opacity: .55; }
.tk-aus { font-style: normal; font-size: .72em; color: #B7202E; text-decoration: none; display: inline-block; }
/* Preise in Spalten (z. B. 1 dl | 5 dl) */
.tk-spaltenkopf { display: grid; grid-template-columns: 1fr repeat(var(--sp, 2), calc(70px * var(--gr))); font-size: .78em; color: var(--leise); font-weight: 600; text-align: right; }
.tk-rubrik .tk-spaltenkopf { --sp: 2; }
.tk-art.sp .tk-zeile { display: grid; grid-template-columns: 1fr repeat(var(--sp), calc(70px * var(--gr))); }
.tk-art.sp .tk-preis { text-align: right; }
.tk-fuss { text-align: center; font-size: .78em; color: var(--leise); margin-top: calc(18px * var(--gr)); border-top: 1px solid var(--linie); padding-top: calc(10px * var(--gr)); }
.tk-fuss p { margin: 0 0 4px; }
.tk-legende { font-size: .92em; }
/* Tagesmenü */
.tk-tag { break-inside: avoid; margin: 0 0 calc(16px * var(--gr)); }
.tk-tag h3 { font-size: calc(21px * var(--gr)); border-bottom: 0; padding: 0; margin-bottom: 2px; }
.tk-gericht { font-family: var(--titel-font); font-size: calc(22px * var(--gr)); font-weight: 600; margin: 0; line-height: 1.2; }
.tk-vegi { font-size: .88em; margin: 3px 0 0; }
.tk-tag.zu .tk-gericht { color: var(--leise); font-style: italic; }
.tk-tag.leer { opacity: .6; }
.tk-tag.heute { background: color-mix(in srgb, var(--akzent2) 12%, transparent); margin-left: -14px; margin-right: -14px; padding: 8px 14px; border-radius: 8px; }
.tk-heute { font-family: var(--text-font); font-size: .55em; background: var(--akzent); color: #fff; padding: 2px 8px; border-radius: 10px; vertical-align: middle; font-weight: 600; }
.tk-tm-preis { display: flex; flex-wrap: wrap; justify-content: center; align-items: flex-end; gap: calc(28px * var(--gr)); text-align: center;
  margin-top: calc(10px * var(--gr)); padding: calc(14px * var(--gr)) 0 0; border-top: 1px solid var(--linie); }
.tk-tm-preis div b { display: block; font-family: var(--titel-font); font-size: calc(38px * var(--gr)); color: var(--akzent); line-height: 1; }
.tk-tm-preis div span { font-size: .8em; color: var(--leise); text-transform: uppercase; letter-spacing: 1.5px; }
.tk-tm-preis p { flex-basis: 100%; margin: 4px 0 0; font-style: italic; font-family: var(--titel-font); font-size: calc(18px * var(--gr)); }
/* Monatshit */
.tk-mh .tk-inhalt { text-align: center; }
.tk-hit { margin: 0 0 calc(24px * var(--gr)); }
.tk-hit h3 { border: 0; }
.tk-hit-bild { max-width: 100%; max-height: calc(320px * var(--gr)); width: auto; border-radius: 8px; margin: 0 auto calc(12px * var(--gr)); display: block; box-shadow: 0 8px 20px rgba(0,0,0,.15); }
.tk-hit-gericht { font-family: var(--titel-font); font-weight: 700; font-size: calc(42px * var(--gr)); color: var(--akzent); margin: 0; line-height: 1.1; }
.tk-hit-preis { font-family: var(--titel-font); font-size: calc(34px * var(--gr)); font-weight: 600; margin: calc(8px * var(--gr)) 0 0; display: flex; justify-content: center; gap: 26px; flex-wrap: wrap; }
.tk-hit-preis small { font-size: .55em; color: var(--leise); }
.tk-mh .tk-info { justify-content: center; }

/* ── Vorlagen ── */
.v-klassisch { --papier: #FBF7EE; --akzent: #5A2A27; --akzent2: #B8893D; --linie: #DCC9A2; }
.v-fruehling { --papier: #FBFAF4; --akzent: #4F7A45; --akzent2: #E59AAE; --linie: #D5E3C8; --leise: #5F6B58;
  background-image: radial-gradient(circle at 100% 0, rgba(242,184,198,.18), transparent 40%), radial-gradient(circle at 0 100%, rgba(157,191,138,.16), transparent 40%); }
.v-sommer { --papier: #FFFCF1; --akzent: #C2551F; --akzent2: #E9A91F; --linie: #F1DDA6; --leise: #6B5A40;
  background-image: radial-gradient(circle at 100% 0, rgba(249,226,125,.28), transparent 42%), radial-gradient(circle at 0 100%, rgba(141,184,106,.14), transparent 40%); }
.v-herbst { --papier: #FBF4EA; --akzent: #8C3B1E; --akzent2: #C8862B; --linie: #E6CFAE; --leise: #6E5646;
  background-image: radial-gradient(circle at 0 0, rgba(200,102,43,.10), transparent 40%), radial-gradient(circle at 100% 100%, rgba(166,61,42,.10), transparent 42%); }
.v-winter { --papier: #F8FAFC; --akzent: #2F5476; --akzent2: #B3262D; --linie: #D3DFEA; --leise: #56687A;
  background-image: radial-gradient(circle at 100% 0, rgba(127,167,201,.16), transparent 42%), radial-gradient(circle at 0 100%, rgba(79,122,99,.10), transparent 40%); }
.v-metzgete { --papier: #FFFFFF; --akzent: #B3262D; --akzent2: #B3262D; --linie: #EFC9CB; --leise: #6B4B4B;
  padding-top: calc(84px * var(--gr)); padding-bottom: calc(66px * var(--gr)); }
.v-metzgete::before, .v-metzgete::after { content: ""; position: absolute; left: 0; right: 0; height: calc(34px * var(--gr)); z-index: 0;
  background: repeating-linear-gradient(90deg, rgba(179,38,45,.85) 0 14px, transparent 14px 28px), repeating-linear-gradient(0deg, rgba(179,38,45,.55) 0 14px, #fff 14px 28px); }
.v-metzgete::before { top: 0; } .v-metzgete::after { bottom: 0; }
.v-metzgete .tk-titel { text-transform: uppercase; letter-spacing: 4px; font-family: var(--text-font); font-weight: 600; }
.v-tafel { --papier: #2E3B36; --tinte: #F4F1E8; --akzent: #FFFFFF; --akzent2: #F2D98C; --linie: rgba(244,241,232,.35); --leise: #D8D3C4;
  --titel-font: "TK Kreide", "Comic Sans MS", cursive; --text-font: "TK Kreide", "Comic Sans MS", cursive; font-size: calc(19px * var(--gr));
  background-image: radial-gradient(ellipse at 30% 20%, rgba(255,255,255,.07), transparent 55%), radial-gradient(ellipse at 80% 90%, rgba(255,255,255,.05), transparent 50%);
  border: calc(16px * var(--gr)) solid #7A5234; box-shadow: inset 0 0 0 2px #5C3A22, inset 0 0 40px rgba(0,0,0,.35), 0 10px 34px rgba(0,0,0,.25); border-radius: 6px; }
.v-tafel .tk-titel { font-weight: 700; font-size: calc(58px * var(--gr)); }
.v-tafel .tk-rubrik h3, .v-tafel .tk-tag h3 { color: var(--akzent2); border-bottom-style: dashed; font-weight: 700; }
.v-tafel .tk-preis { color: #F2D98C; }
.v-tafel .tk-mm { background: rgba(255,255,255,.12); color: var(--tinte); }
.v-tafel .tk-tm-preis div b { color: #F2D98C; }

/* Website: Kartenauswahl */
.tk-wahl { display: flex; gap: 8px; flex-wrap: wrap; margin: 0 0 24px; }
.tk-wahl a { padding: 8px 16px; border: 1px solid var(--rand, #E0D3BB); border-radius: 999px; text-decoration: none; background: #fff; font-weight: 600; font-size: 15px; }
.tk-wahl a:hover { border-color: var(--wein, #5A2A27); }
.m-web .tk-inhalt { column-count: 2; }
.m-web.tk-tm .tk-inhalt, .m-web.tk-mh .tk-inhalt { column-count: 1; }
@media (max-width: 760px) {
  .m-web .tk-inhalt { column-count: 1; }
  .tk-karte.m-web { padding: 44px 20px 28px; --gr: .9; }
  .tk-karte.m-web .tk-orn { width: 90px; height: 90px; opacity: .8; }
}

/* Bilder (Foto oder Symbolbild) */
.tk-bild { position: relative; margin: 0; }
.tk-bild img { display: block; width: 100%; height: 100%; object-fit: cover; border-radius: 8px; }
.tk-symbol { position: absolute; right: 6px; bottom: 6px; background: rgba(0,0,0,.55); color: #fff; font-family: var(--text-font); font-size: 10px; letter-spacing: .5px; padding: 2px 7px; border-radius: 9px; }
.tk-tag .tk-bild { float: right; width: calc(150px * var(--gr)); height: calc(100px * var(--gr)); margin: 0 0 6px 14px; }
.tk-tag::after { content: ""; display: block; clear: both; }
.tk-tag .tk-bild.gross { float: none; width: 100%; height: auto; max-height: calc(380px * var(--gr)); margin: 8px 0 12px; }
.tk-tag .tk-bild.gross img { max-height: calc(380px * var(--gr)); }
.tk-hit-bild { max-width: 100%; margin: 0 auto calc(12px * var(--gr)); display: inline-block; }
.tk-hit-bild img { max-height: calc(320px * var(--gr)); width: auto; box-shadow: 0 8px 20px rgba(0,0,0,.15); }
@media (max-width: 560px) { .tk-tag .tk-bild { width: 110px; height: 76px; } }

/* Auszeichnung aus der Redaktion (Stil-Menü «Aa»): Farbe, Grösse, Handschrift */
.tk-c-gold { color: #B8893D; } .tk-c-wein { color: #5A2A27; } .tk-c-gruen { color: #3E6B3A; } .tk-c-grau { color: #6B5E58; }
.tk-karte .tk-c-gold { color: var(--akzent2); } .tk-karte .tk-c-wein { color: var(--akzent); } .tk-karte .tk-c-grau { color: var(--leise); }
.tk-g-klein { font-size: .85em; } .tk-g-gross { font-size: 1.25em; } .tk-g-riesig { font-size: 1.5em; }
.tk-f-kreide { font-family: "TK Kreide", "Segoe Script", cursive; font-size: 1.3em; line-height: 1; }
