/* ============================================================
   JUL – pixCMS-Overlay (CMS-Portierungs-„Kleber")
   ------------------------------------------------------------
   Diese Datei wird NACH style.css geladen (siehe index.php) und
   stylt NUR Elemente, die erst durch den CMS-Umbau dazukamen:
   Skip-Link, Formular-Status, Cookie-Banner (i_cookie), News-Detail.

   Bewusst SEPARAT von style.css, damit ein neu abgelegtes
   JUL-Design (style.css) diese Regeln nie wieder überschreibt.
   Nutzt die Design-Tokens (:root) aus style.css.
   ============================================================ */

/* [hidden] darf nie von Klassen mit eigenem display überstimmt werden */
[hidden]{display:none!important}

/* Skip-Link (Barrierefreiheit): unsichtbar bis Tastatur-Fokus.
   OHNE diese Regel steht „Zum Hauptinhalt springen" sichtbar oben. */
.skip-link{
	position:absolute;left:-9999px;top:0;z-index:100;
	background:var(--ink,#2a201a);color:var(--paper,#f7efe1);
	padding:.7rem 1.2rem;border-radius:0 0 10px 0;font-weight:600;
}
.skip-link:focus{left:0}

/* ------------------------------------------------------------
   Marken-Logo in der Navbar (aus p_einstellungen.logo)
   ------------------------------------------------------------
   Das Logo sitzt auf einem WEISSEN Chip (Kundenwunsch 2026-07-30). Vorher war
   der Chip dunkel (Ink), weil das damalige Logo butter-gelb und damit für
   dunkle Flächen gemacht war – auf dem Creme-Header wäre es fast unsichtbar
   gewesen (Kontrast ~1,2:1). Mit dem angepassten Logo entfällt der Grund.

   Reines #fff, nicht --white (#fffaf2): der Header ist creme (#f6efe4), und
   der warme Weißton würde sich davon kaum abheben – die Box wäre keine Box.
   Hairline-Rahmen wie bei .card, damit die Kante auch beim Scrollen sitzt. */
.brand--logo{
	background:#fff;
	border:1px solid var(--line,rgba(42,32,24,.14));
	padding:.5rem .9rem;
	border-radius:12px;
	box-shadow:var(--shadow-sm);
	line-height:0;                       /* kein Extra-Raum unter dem Bild */
}
.brand--logo img{height:44px;width:auto;max-width:min(52vw,240px);display:block}
@media(max-width:920px){
	.brand--logo{padding:.4rem .7rem;border-radius:10px}
	.brand--logo img{height:34px}
}

/* ⚠️ FALLS DAS LOGO IM FOOTER VERSCHWINDET: hier die Sperre lösen.
   Header und Footer zeigen DIESELBE Datei (p_einstellungen.logo → beide
   rendern p_assets/logo/<datei>). Ist das angepasste Logo jetzt dunkel,
   damit es auf Weiß funktioniert, ist es im dunklen Footer unsichtbar.
   Dann diese vier Zeilen einkommentieren – dann steht es dort ebenfalls
   auf einem weißen Chip. Bleibt das Logo hell/mehrfarbig: so lassen.
.footer-brand img{
	background:#fff;padding:.6rem .9rem;border-radius:12px;
	height:auto;max-height:80px;width:auto;
}
*/

/* ------------------------------------------------------------
   Buttons behalten IHRE Textfarbe – Spezifitäts-Schutz
   ------------------------------------------------------------
   Container-Regeln wie `.visit-row a{color:var(--accent)}` und
   `.info-card a{color:var(--accent)}` (Spezifität 0,0,1,1) schlagen
   `.btn--primary{color:var(--white)}` (0,0,1,0). Folge: brauner Text auf
   braunem Button – z. B. „Tisch anfragen" im Block „Kontakt & Reservierung".

   `a.btn--x` hat dieselbe Spezifität (0,0,1,1) und gewinnt, weil dieses
   Overlay NACH style.css geladen wird. Wirkt in JEDEM Container, auch in
   künftigen. Hover-Regeln (0,0,2,x) bleiben unangetastet. */
a.btn--primary{color:var(--white,#fffaf2)}
a.btn--dark{color:var(--paper,#f7efe1)}
a.btn--light{color:var(--ink,#2a201a)}
a.btn--ghost{color:var(--ink,#2a201a)}
a.btn--ghost:hover{color:var(--paper,#f7efe1)}

/* Formular-Status (Server-Antwort der Reservierungs-/Event-Formulare) */
.form-status{padding:.9rem 1.1rem;border-radius:10px;font-weight:600;font-size:.95rem;margin:0}
.form-status--success{background:rgba(74,138,95,.14);color:var(--jade-d,#3a6e4b);border:1px solid rgba(74,138,95,.35)}
.form-status--error{background:rgba(192,57,43,.1);color:var(--spice,#c0392b);border:1px solid rgba(192,57,43,.3)}

/* Footer: pixlwerk-Credit */
.footer-credit i{color:var(--accent,#bb5e34)}

/* News-Detail (p_blog) */
.post-media{border-radius:var(--radius-lg,22px);overflow:hidden;box-shadow:var(--shadow);margin-bottom:2rem;max-height:460px}
.post-media img{width:100%;height:100%;object-fit:cover;display:block}
.prose img{border-radius:var(--radius,14px)}

/* CMS-Cookie-Banner (_integration/i_cookie.php) an die JUL-Optik angleichen */
#cookieBanner.pcc .pcc-card{background:var(--white,#fffaf2);color:var(--ink,#2a201a);font-family:var(--ff-body);border:1px solid var(--line);border-radius:var(--radius-lg,22px);box-shadow:var(--shadow)}
#cookieBanner.pcc .pcc-head{font-family:var(--ff-display);font-weight:600;color:var(--ink,#2a201a)}
#cookieBanner.pcc .pcc-text{color:var(--ink-2,#5b4a3b)}
#cookieBanner.pcc .pcc-cat{background:var(--paper,#f7efe1);border-color:var(--line);border-radius:10px}
#cookieBanner.pcc .pcc-cat label{color:var(--ink,#2a201a)}
#cookieBanner.pcc .pcc-btn{border-radius:999px;font-family:var(--ff-body);font-weight:600}
#cookieBanner.pcc .pcc-btn.pcc-decline{background:var(--paper,#f7efe1);color:var(--ink,#2a201a);border:1.5px solid var(--line)}
@media(max-width:920px){
	/* Banner über der Sticky-Anruf-Leiste halten */
	#cookieBanner.pcc.pcc-unten,#cookieBanner.pcc.pcc-links,#cookieBanner.pcc.pcc-rechts{bottom:70px}
}

/* ===== Hero: echtes Terrassenfoto statt Stock-Platzhalter (überschreibt style.css) ===== */
.hero{background-image:
	linear-gradient(100deg,rgba(38,26,18,.94) 0%,rgba(40,28,19,.80) 42%,rgba(40,28,19,.42) 100%),
	url(../stocks/jul_terrasse.webp)}

/* ===== Speisekarte: Gastro V2 (Gericht-Fotos + Angebot) ===== */
.m-item--media{grid-template-columns:auto 1fr auto}
.m-item--media .m-item__desc,.m-item--media .m-item__badges{grid-column:2/3}
.m-item__media{grid-row:1/span 3;position:relative;width:76px;height:76px;border-radius:14px;overflow:hidden;
	padding:0;border:1px solid var(--line);background:var(--paper-2,#efe4d1);cursor:zoom-in;flex:none;
	box-shadow:0 4px 12px rgba(42,32,26,.12);transition:transform .18s ease,box-shadow .18s ease}
.m-item__media:hover,.m-item__media:focus-visible{transform:scale(1.05);box-shadow:0 8px 20px rgba(42,32,26,.2)}
.m-item__media img{width:100%;height:100%;object-fit:cover;display:block}
.m-item__media-more{position:absolute;right:3px;bottom:3px;background:rgba(42,32,26,.78);color:#fff;
	font-size:.66rem;font-weight:600;line-height:1;padding:.22rem .34rem;border-radius:8px;pointer-events:none}
@media(max-width:560px){.m-item__media{width:64px;height:64px}}

/* Angebot: Kennzeichnung + Preise */
.badge--angebot{background:var(--accent,#bb5e34);color:#fff}
.badge--angebot i{font-size:.72em}
.chip--angebot{border-color:var(--accent,#bb5e34);color:var(--accent-d,#9a4a26);font-weight:700}
.chip--angebot.is-active{background:var(--accent,#bb5e34);border-color:var(--accent,#bb5e34);color:#fff}
.m-item__price-old{display:block;color:var(--muted,#8a7a66);font-size:.85rem;font-weight:500;text-decoration:line-through}
.m-item__price-deal{color:var(--accent-d,#9a4a26)}
.m-item--angebot .m-item__price{text-align:right}

/* Lightbox (Gericht-Fotos, speisekarte.js) */
.jul-lightbox{position:fixed;inset:0;z-index:200;display:flex;align-items:center;justify-content:center;
	background:rgba(30,22,16,.88);padding:1.2rem;backdrop-filter:blur(3px)}
.jul-lightbox[hidden]{display:none}
.jul-lightbox__inner{position:relative;max-width:min(92vw,760px);text-align:center}
.jul-lightbox__inner img{max-width:100%;max-height:78vh;border-radius:var(--radius-lg,22px);box-shadow:0 24px 70px rgba(0,0,0,.5)}
.jul-lightbox__caption{color:var(--paper,#f7efe1);font-family:var(--ff-display);font-size:1.05rem;margin-top:.8rem}
.jul-lightbox__close,.jul-lightbox__nav{position:absolute;display:flex;align-items:center;justify-content:center;
	width:44px;height:44px;border-radius:999px;border:0;cursor:pointer;background:rgba(247,239,225,.14);color:#fff;font-size:1.1rem}
.jul-lightbox__close:hover,.jul-lightbox__nav:hover{background:var(--accent,#bb5e34)}
.jul-lightbox__close{top:-54px;right:0}
.jul-lightbox__nav--prev{left:-8px;top:50%;transform:translateY(-50%)}
.jul-lightbox__nav--next{right:-8px;top:50%;transform:translateY(-50%)}
@media(max-width:640px){.jul-lightbox__nav--prev{left:4px}.jul-lightbox__nav--next{right:4px}}

/* ===== Home: Aktuelle Angebote ===== */
.deals-grid{align-items:stretch}
.deal-card{display:flex;flex-direction:column;background:var(--white,#fffaf2);border:1px solid var(--line);
	border-radius:var(--radius-lg,22px);overflow:hidden;box-shadow:var(--shadow)}
.deal-card__media{position:relative;aspect-ratio:4/3;overflow:hidden;background:var(--paper-2,#efe4d1)}
.deal-card__media img{width:100%;height:100%;object-fit:cover;display:block;transition:transform .35s ease}
.deal-card:hover .deal-card__media img{transform:scale(1.04)}
.deal-card__badge{position:absolute;top:.8rem;left:.8rem;background:var(--accent,#bb5e34);color:#fff;
	font-size:.78rem;font-weight:700;padding:.32rem .7rem;border-radius:999px;box-shadow:0 6px 14px rgba(42,32,26,.25)}
.deal-card__body{display:flex;flex-direction:column;gap:.45rem;padding:1.2rem 1.3rem 1.4rem;flex:1}
.deal-card__body h3{font-family:var(--ff-display);font-size:1.25rem;margin:0}
.deal-card__body p{color:var(--muted);font-size:.93rem;margin:0;flex:1}
.deal-card__prices{display:flex;align-items:baseline;gap:.6rem;margin-top:.3rem}
.deal-card__prices s{color:var(--muted,#8a7a66);font-size:.92rem}
.deal-card__prices b{font-family:var(--ff-display);font-size:1.35rem;color:var(--accent-d,#9a4a26)}

/* ===== Events: Impressionen-Galerie ===== */
.event-gallery{display:grid;grid-template-columns:repeat(4,1fr);gap:1rem}
.event-gallery figure{margin:0;border-radius:var(--radius,14px);overflow:hidden;box-shadow:var(--shadow);
	aspect-ratio:3/4;background:var(--paper-2,#efe4d1)}
.event-gallery img{width:100%;height:100%;object-fit:cover;display:block;transition:transform .35s ease}
.event-gallery figure:hover img{transform:scale(1.05)}
@media(max-width:920px){.event-gallery{grid-template-columns:repeat(2,1fr)}}

/* Speisekarte: Sticky-Suche unter dem Logo-Header ausrichten.
   style.css setzt top:62px, der Header ist mit .brand--logo aber ~84px hoch
   (Desktop) bzw. ~70px (mobil) — sonst klebt die Toolbar UNTER der Navigation. */
.menu-toolbar{top:88px}
.menu-cat{scroll-margin-top:175px}
@media(max-width:920px){
	.menu-toolbar{top:72px}
	.menu-cat{scroll-margin-top:150px}
}

/* ===== Events-Seite: Kommende Veranstaltungen (p_event) ===== */
.jevent-grid{align-items:stretch}
.jevent{display:flex;flex-direction:column}
.jevent__media{position:relative}
.jevent__media .ph{height:100%;min-height:180px}
.jevent__date{position:absolute;left:.9rem;bottom:.9rem;width:54px;border-radius:12px;overflow:hidden;
	text-align:center;background:var(--white,#fffaf2);box-shadow:0 8px 18px rgba(42,32,26,.22)}
.jevent__date b{display:block;font-family:var(--ff-display);font-size:1.2rem;line-height:1.3;color:var(--ink,#2a201a);padding-top:.2rem}
.jevent__date span{display:block;font-size:.6rem;font-weight:800;text-transform:uppercase;letter-spacing:.6px;
	color:#fff;background:var(--accent,#bb5e34);padding:.18rem 0 .24rem}
.jevent__voll{position:absolute;top:.9rem;right:.9rem;background:var(--ink,#2a201a);color:var(--paper,#f7efe1);
	font-size:.72rem;font-weight:700;padding:.3rem .7rem;border-radius:999px}
.jevent__body{display:flex;flex-direction:column;flex:1;gap:.55rem}
.jevent__body h3{margin:0}
.jevent__body p.muted{margin:0;font-size:.93rem;flex:1}
.jevent__meta{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:.3rem}
.jevent__meta li{font-size:.88rem;color:var(--ink-2,#5b4a3b);display:flex;align-items:baseline;gap:.55rem}
.jevent__meta i{width:15px;text-align:center;color:var(--accent,#bb5e34);font-size:.82rem;flex:none}
.jevent__serie{display:inline-flex;align-items:center;gap:.3rem;background:rgba(187,94,52,.12);color:var(--accent-d,#9a4a26);
	font-size:.72rem;font-weight:700;padding:.14rem .55rem;border-radius:999px;margin-left:.35rem}
.jevent__actions{display:flex;align-items:center;gap:1rem;flex-wrap:wrap;margin-top:.2rem}
.jevent__hinweis{margin:0;font-size:.78rem;color:var(--muted,#8a7a66)}

/* Event-Detail: Fakten-Box + Status */
.jevent-facts{display:grid;grid-template-columns:repeat(2,1fr);gap:1rem;background:var(--white,#fffaf2);
	border:1px solid var(--line);border-radius:var(--radius-lg,22px);box-shadow:var(--shadow);padding:1.4rem 1.5rem;margin-bottom:2rem}
.jevent-fact{display:flex;gap:.8rem;align-items:flex-start}
.jevent-fact > i{width:34px;height:34px;border-radius:10px;flex:none;display:flex;align-items:center;justify-content:center;
	background:rgba(187,94,52,.12);color:var(--accent,#bb5e34);font-size:.9rem}
.jevent-fact b{display:block;font-size:.7rem;text-transform:uppercase;letter-spacing:.08em;color:var(--muted,#8a7a66);margin-bottom:.1rem}
.jevent-fact > div{font-size:.94rem;color:var(--ink-2,#5b4a3b)}
@media(max-width:640px){.jevent-facts{grid-template-columns:1fr}}
.jevent-status{display:flex;align-items:center;gap:.6rem;background:var(--paper-2,#efe4d1);border-radius:14px;
	padding:.9rem 1.1rem;font-size:.92rem;color:var(--ink-2,#5b4a3b);margin-bottom:2rem}
.jevent-status i{color:var(--accent,#bb5e34)}
.jevent-status--voll{background:rgba(42,32,26,.06)}

/* ===== Home: Nächstes Event (Spotlight-Banner, p_event) ===== */
.event-spot{position:relative;display:grid;grid-template-columns:minmax(0,.92fr) minmax(0,1.08fr);
	background:var(--ink,#2a201a);color:var(--paper,#f7efe1);border-radius:var(--radius-lg,22px);
	overflow:hidden;box-shadow:0 24px 60px rgba(42,32,26,.28)}
.event-spot::after{content:"";position:absolute;inset:0;pointer-events:none;background:
	radial-gradient(720px 340px at 88% -12%,rgba(250,213,128,.22),transparent 60%),
	radial-gradient(560px 320px at 10% 118%,rgba(187,94,52,.32),transparent 62%)}
.event-spot__media{position:relative;min-height:340px;background:
	radial-gradient(420px 260px at 30% 30%,rgba(250,213,128,.16),transparent 65%),
	linear-gradient(145deg,#3a2c22 0%,#241a13 100%)}
.event-spot__media img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;display:block}
.event-spot__media::after{content:"";position:absolute;inset:0;background:
	linear-gradient(90deg,transparent 55%,rgba(42,32,26,.55) 100%),
	linear-gradient(0deg,rgba(42,32,26,.30),transparent 45%)}
.event-spot__date{position:absolute;left:1.4rem;top:1.4rem;z-index:2;min-width:104px;text-align:center;
	background:var(--butter,#fad580);color:var(--ink,#2a201a);border-radius:18px;padding:.8rem 1rem .9rem;
	box-shadow:0 14px 30px rgba(42,32,26,.35);transform:rotate(-2deg)}
.event-spot__date em{display:block;font-style:normal;font-size:.66rem;font-weight:800;text-transform:uppercase;letter-spacing:.14em;opacity:.72}
.event-spot__date b{display:block;font-family:var(--ff-display);font-size:2.4rem;font-weight:700;line-height:1.05;margin:.1rem 0}
.event-spot__date span{display:block;font-size:.72rem;font-weight:800;text-transform:uppercase;letter-spacing:.1em}
.event-spot__body{position:relative;z-index:2;display:flex;flex-direction:column;align-items:flex-start;gap:1rem;
	padding:clamp(1.8rem,4vw,3.2rem)}
.event-spot__body .overline{color:var(--butter,#fad580)}
.event-spot__body .overline::before{background:var(--butter,#fad580)}
.event-spot__body h2{color:var(--paper,#f7efe1);margin:0;font-size:clamp(1.5rem,1.1rem+1.6vw,2.3rem);line-height:1.12}
.event-spot__body p{margin:0;color:rgba(246,239,228,.82);max-width:52ch}
.event-spot__meta{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:.5rem}
.event-spot__meta li{display:inline-flex;align-items:center;gap:.5rem;font-size:.86rem;font-weight:600;
	color:var(--paper,#f7efe1);background:rgba(246,239,228,.09);border:1px solid rgba(246,239,228,.16);
	border-radius:999px;padding:.42rem .95rem}
.event-spot__meta i{color:var(--butter,#fad580);font-size:.8rem}
.event-spot__voll{display:inline-flex;align-items:center;gap:.5rem;background:rgba(246,239,228,.12);
	border:1px solid rgba(246,239,228,.2);color:var(--paper,#f7efe1);font-weight:700;font-size:.92rem;
	border-radius:999px;padding:.7rem 1.3rem}
.event-spot__voll i{color:var(--butter,#fad580)}
@media(max-width:860px){
	.event-spot{grid-template-columns:1fr}
	.event-spot__media{min-height:230px}
	.event-spot__media::after{background:linear-gradient(0deg,rgba(42,32,26,.65),transparent 55%)}
	.event-spot__date{left:1rem;top:1rem;min-width:92px;padding:.6rem .8rem .7rem}
	.event-spot__date b{font-size:2rem}
}

/* ===== Reservierung: Hinweis unter einem Formularfeld =====
   (z.B. „An diesem Wochentag haben wir Ruhetag.") – liegt hier im Overlay,
   damit es eine neu abgelegte style.css überlebt. */
.field-hint{
	margin:.45rem 0 0;font-size:.82rem;line-height:1.45;color:var(--accent,#bb5e34);
	display:flex;align-items:flex-start;gap:.4rem;
}
.field-hint::before{content:"\f06a";font-family:"Font Awesome 6 Free";font-weight:900;font-size:.85em;line-height:1.6}

/* ===== Reservierung: Urlaubs-Kasten =====
   Eigene Klasse statt .jul-url-hours: deren CSS liefert _modules/jul_urlaub.php,
   das aber NUR bei laufendem oder nahem Urlaub überhaupt etwas ausgibt. Auf der
   Reservierungsseite steht der Hinweis auch bei weit entferntem Urlaub, weil er
   die Tage schon jetzt im Kalender sperrt. */
.jul-res-hinweis{
	display:flex;align-items:flex-start;gap:.7rem;
	margin:0 0 1.2rem;padding:.85rem 1.1rem;border-radius:12px;line-height:1.55;
	background:rgba(207,154,63,.12);border:1px solid rgba(207,154,63,.30);color:var(--ink,#2a201a);
}
.jul-res-hinweis i{margin-top:.2rem;flex-shrink:0;color:var(--gold,#cf9a3f)}

/* Neutraler Hilfstext unter einem Feld – im Gegensatz zu .field-hint (Warnung
   mit Ausrufezeichen, z.B. „Ruhetag") ohne Signalfarbe und ohne Icon. */
.field-note{margin:.45rem 0 0;font-size:.82rem;line-height:1.45;color:var(--muted,#8a7765)}

/* ===== Anruf-Button außerhalb der Öffnungszeiten / im Betriebsurlaub =====
   Hier steht bewusst KEIN „deaktiviert"-Styling mehr. jul_tel_button()
   (_modules/jul_helpers.php) rendert stattdessen zwei Buttons — Anruf und
   Ersatz (Reservierung/Anfrage) — und versteckt den unpassenden per [hidden].
   Der Ersatz behält absichtlich dieselben .btn-Klassen wie das Original,
   damit das Layout beim Umschalten nicht springt. Es gibt deshalb nichts
   zusätzlich zu stylen; die Umschaltung hängt allein an der Regel
   `[hidden]{display:none!important}` ganz oben in dieser Datei. */

/* Begleitsatz unter dem Ersatz-Button (nur wo Platz ist). */
.jul-tel-note{
	margin:.6rem 0 0;font-size:.82rem;line-height:1.5;color:var(--muted,#8a7765);
	display:flex;align-items:flex-start;gap:.4rem;
}
.jul-tel-note i{margin-top:.15rem;flex-shrink:0}
.jul-tel-note a{color:var(--accent,#bb5e34);text-decoration:underline}

/* ===== Credit-Box im Impressum („Gestaltung & Umsetzung") =====
   Markup: view_impressum.inc.php, steht dort außerhalb des if/else.
   Bewusst in JULs Terracotta gehalten und NICHT im pixlwerk-CI-Rot: auf einer
   Kundenseite soll der Credit sich einfügen, nicht dagegen anspringen.
   Liegt innerhalb von .prose (72ch) – deshalb die margin-Resets, sonst
   schlagen die .prose-Abstände in die Box durch. */
.pix-credit{
	display:flex;align-items:flex-start;gap:1.4rem;
	margin:3.5rem 0 0;padding:1.8rem 1.9rem;
	background:var(--white,#fffaf2);
	border:1px solid var(--line,rgba(42,32,24,.14));
	border-left:4px solid var(--accent,#bb5e34);
	border-radius:var(--radius-lg,22px);
	box-shadow:var(--shadow-sm);
}
.pix-credit__ico{
	flex:0 0 auto;width:52px;height:52px;display:grid;place-items:center;
	border-radius:16px;font-size:1.35rem;
	background:color-mix(in srgb,var(--accent,#bb5e34) 12%,transparent);
	color:var(--accent,#bb5e34);
}
.pix-credit__body{min-width:0}
/* .prose h2 bringt margin-top:2rem + große Schrift mit – in der Box zu viel */
.pix-credit__body h2{
	margin:0 0 .5rem;font-size:1.35rem;line-height:1.25;color:var(--ink,#2a201a);
}
.pix-credit__body p{margin:0;font-size:.97rem;line-height:1.7;color:var(--muted,#8a7765)}
.pix-credit__body a{color:var(--accent,#bb5e34);font-weight:700;text-decoration:underline}
.pix-credit__body a:hover{color:var(--accent-d,#9a4a26)}
.pix-credit__herz{color:var(--accent,#bb5e34);font-size:.9em;margin:0 .1em}

.pix-credit__link{
	display:inline-flex;align-items:center;gap:.45rem;
	margin-top:1rem;font-size:.92rem;font-weight:700;
	text-decoration:none !important;
}
.pix-credit__link i{transition:transform .25s ease}
.pix-credit__link:hover i{transform:translateX(4px)}

@media(max-width:600px){
	.pix-credit{flex-direction:column;gap:1rem;padding:1.5rem 1.4rem}
	.pix-credit__ico{width:46px;height:46px;font-size:1.2rem}
}
@media (prefers-reduced-motion:reduce){
	.pix-credit__link i{transition:none}
}

/* ---- pixlwerk-Badge im Impressum ----------------------------------------
   NUR der Abstand, wie in den anderen Projekten auch. Keine Breitenbegrenzung:
   das Badge läuft standardmäßig über die volle Breite und bringt sein Aussehen
   selbst mit (unter .pxw-badge mit all:initial gekapselt). Nichts daran
   überschreiben – es kommt zentral von pixlwerk.de und sähe nach der nächsten
   Auffrischung sonst wieder anders aus. */
.jul-badge-wrap{margin-top:3.5rem}