/* ==========================================================
   B-Together Galerie
   Farben & Abstände zentral hier ändern:
   ========================================================== */
:root {
	--btg-accent: #147485;      /* Grünblau – Links, Buttons */
	--btg-cyan: #00ffff;        /* Hellblau – nur Flächen */
	--btg-gelb: #e6e14a;        /* Gelb */
	--btg-dunkelgelb: #a8a319;  /* Dunkelgelb – Footer */
	--btg-text: #111111;
	--btg-text-2: #3a3832;
	--btg-grau: #57534b;
	--btg-linie: #e4e2dd;
	--btg-flaeche: #f6f5f2;
	--btg-bild: #eceae5;
	--btg-font: 'Lato', 'Helvetica Neue', Helvetica, Arial, sans-serif;
}

.btg,
.btg * {
	box-sizing: border-box;
}

.btg {
	font-family: var(--btg-font);
	color: var(--btg-text);
	font-weight: 400;
}

.btg a {
	color: var(--btg-text);
}

.btg a:hover,
.btg a:focus-visible {
	color: var(--btg-accent);
}

/* ---------- Typografie ---------- */
.btg .btg-abschnitt,
.btg-abschnitt {
	margin: 0;
	font-family: var(--btg-font);
	font-size: 34px;
	line-height: 1.15;
	font-weight: 300;
	letter-spacing: 0;
	text-transform: none;
	color: var(--btg-text);
}

.btg .btg-kicker,
.btg-kicker {
	margin: 0 0 12px;
	font-size: 13px;
	font-weight: 400;
	letter-spacing: 0.16em;
	text-transform: uppercase;
	color: var(--btg-accent);
}

.btg-kicker a {
	color: var(--btg-accent) !important;
	text-decoration: none;
}

.btg-kopf {
	display: flex;
	flex-wrap: wrap;
	align-items: baseline;
	justify-content: space-between;
	gap: 12px;
	margin-bottom: 28px;
}

.btg-anzahl {
	font-size: 15px;
	color: var(--btg-grau);
}

.btg .btg-mehr,
.btg-mehr {
	font-size: 14px;
	color: var(--btg-accent);
	text-decoration: none;
}

/* ---------- Farbband ---------- */
.btg-farbband {
	display: flex;
	height: 14px;
	width: 100%;
	margin: 40px 0;
}

.btg-farbband span {
	display: block;
}

/* ---------- Filter ---------- */
.btg-filter {
	display: flex;
	flex-wrap: wrap;
	gap: 8px;
	margin-bottom: 32px;
}

.btg .btg-chip {
	min-height: 44px;
	padding: 0 18px;
	border: 1px solid #c9c6bf;
	border-radius: 0;
	background: #ffffff;
	color: var(--btg-text);
	font-family: var(--btg-font);
	font-size: 14px;
	font-weight: 400;
	cursor: pointer;
	box-shadow: none;
	text-shadow: none;
}

.btg .btg-chip[aria-pressed="true"] {
	background: var(--btg-text);
	border-color: var(--btg-text);
	color: #ffffff;
}

.btg .btg-chip:focus-visible {
	outline: 2px solid var(--btg-accent);
	outline-offset: 2px;
}

/* ---------- Raster & Karten ---------- */
.btg-raster {
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(240px, 1fr));
	gap: 48px 24px;
}

.btg .btg-karte {
	display: flex;
	flex-direction: column;
	gap: 14px;
	text-decoration: none;
	color: var(--btg-text);
}

.btg .btg-karte[hidden] {
	display: none;
}

.btg-karte__bild,
.btg-kuenstlerkarte__bild {
	position: relative;
	display: block;
	aspect-ratio: 4 / 5;
	background: var(--btg-bild);
	overflow: hidden;
}

.btg-kuenstlerkarte__bild {
	aspect-ratio: 1 / 1;
}

.btg-karte__bild img,
.btg-kuenstlerkarte__bild img,
.btg-profil__bild img {
	display: block;
	width: 100%;
	height: 100%;
	object-fit: cover;
	transition: opacity 0.2s ease;
}

.btg-karte:hover .btg-karte__bild img {
	opacity: 0.88;
}

.btg-placeholder {
	display: block;
	width: 100%;
	height: 100%;
	background: var(--btg-bild);
}

.btg-karte--verkauft .btg-karte__bild img {
	opacity: 0.6;
}

.btg-karte__text {
	display: flex;
	flex-direction: column;
	gap: 4px;
}

.btg-karte__zeile {
	display: flex;
	justify-content: space-between;
	align-items: baseline;
	gap: 12px;
}

.btg-karte__titel {
	font-size: 17px;
	font-weight: 400;
}

.btg-karte__preis {
	font-size: 16px;
	white-space: nowrap;
}

.btg-karte__preis small,
.btg-karte__preis .wc-gzd-additional-info {
	display: none; /* Steuer-/Versandhinweise stehen auf der Werkseite */
}

.btg-karte__kuenstler {
	font-size: 14px;
	color: var(--btg-text-2);
}

.btg-karte__info {
	font-size: 13px;
	color: var(--btg-grau);
}

/* ---------- Badges ---------- */
.btg-badge {
	display: inline-block;
	padding: 6px 10px;
	font-family: var(--btg-font);
	font-size: 12px;
	font-weight: 700;
	line-height: 1;
	letter-spacing: 0.08em;
	text-transform: uppercase;
}

.btg-karte__bild .btg-badge,
li.product .btg-badge {
	position: absolute;
	top: 12px;
	left: 12px;
	z-index: 2;
}

li.product {
	position: relative;
}

.btg-badge--verkauft {
	background: var(--btg-text);
	color: #ffffff;
}

.btg-badge--reserviert {
	background: var(--btg-gelb);
	color: var(--btg-text);
}

/* ---------- Künstler:innen ---------- */
.btg-raster--kuenstler {
	grid-template-columns: repeat(auto-fill, minmax(190px, 1fr));
	gap: 24px;
}

.btg .btg-kuenstlerkarte {
	display: flex;
	flex-direction: column;
	gap: 10px;
	text-decoration: none;
	color: var(--btg-text);
}

.btg-kuenstlerkarte__name {
	font-size: 17px;
	margin-top: 4px;
}

.btg-kuenstlerkarte__fokus {
	font-size: 14px;
	color: var(--btg-text-2);
}

/* ---------- Profil ---------- */
.btg-profil {
	display: flex;
	flex-wrap: wrap;
	gap: 56px;
	align-items: flex-start;
	margin: 0 0 24px;
}

.btg-profil__bild {
	flex: 0 1 420px;
	min-width: 240px;
	aspect-ratio: 1 / 1;
	background: var(--btg-bild);
	overflow: hidden;
}

.btg-profil__text {
	flex: 1 1 380px;
}

.btg .btg-profil__name {
	margin: 0 0 20px;
	font-family: var(--btg-font);
	font-size: clamp(34px, 4.5vw, 54px);
	line-height: 1.12;
	font-weight: 300;
	letter-spacing: 0;
	text-transform: none;
	color: var(--btg-text);
}

.btg-profil__bio {
	font-size: 18px;
	line-height: 1.6;
	color: var(--btg-text-2);
}

.btg-ausstellungen {
	margin-top: 28px;
	border-top: 1px solid var(--btg-linie);
}

.btg .btg-ausstellungen__titel {
	margin: 0;
	padding: 20px 0 8px;
	font-family: var(--btg-font);
	font-size: 13px;
	font-weight: 400;
	letter-spacing: 0.12em;
	text-transform: uppercase;
	color: var(--btg-grau);
}

.btg-ausstellungen__zeile {
	display: flex;
	gap: 24px;
	padding: 12px 0;
	border-bottom: 1px solid var(--btg-linie);
	font-size: 15px;
}

.btg-ausstellungen__jahr {
	width: 64px;
	flex-shrink: 0;
}

/* ---------- Hinweise ---------- */
.btg-hinweise {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
	gap: 40px;
}

.btg-hinweis {
	padding-top: 20px;
	border-top: 4px solid var(--btg-accent);
}

.btg-hinweis--gelb {
	border-top-color: var(--btg-gelb);
}

.btg-hinweis--dunkelgelb {
	border-top-color: var(--btg-dunkelgelb);
}

.btg .btg-hinweis h3 {
	margin: 0 0 10px;
	font-family: var(--btg-font);
	font-size: 20px;
	font-weight: 400;
	text-transform: none;
	letter-spacing: 0;
	color: var(--btg-text);
}

.btg-hinweis p {
	margin: 0;
	font-size: 15px;
	line-height: 1.6;
	color: var(--btg-text-2);
}

/* ---------- Werkseite ---------- */
.btg-werkangaben {
	display: grid;
	grid-template-columns: 120px minmax(0, 1fr);
	margin: 20px 0;
	border-top: 1px solid var(--btg-linie);
	font-size: 15px;
}

.btg-werkangaben dt,
.btg-werkangaben dd {
	margin: 0;
	padding: 11px 0;
	border-bottom: 1px solid var(--btg-linie);
}

.btg-werkangaben dt {
	color: var(--btg-grau);
	font-weight: 400;
}

.btg-statuszeile {
	display: flex;
	align-items: center;
	gap: 12px;
	font-size: 14px;
	color: var(--btg-text-2);
}

.btg .btg-button,
.btg-button {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-height: 52px;
	padding: 0 28px;
	border: 0;
	border-radius: 0;
	font-family: var(--btg-font);
	font-size: 16px;
	font-weight: 400;
	letter-spacing: 0.04em;
	text-decoration: none;
	cursor: pointer;
}

.btg .btg-button--rahmen {
	border: 2px solid var(--btg-text);
	background: transparent;
	color: var(--btg-text);
}

.btg .btg-button--rahmen:hover {
	background: var(--btg-text);
	color: #ffffff;
}

.btg .btg-button--dunkel {
	background: var(--btg-text);
	color: #ffffff;
}

.btg .btg-button--dunkel:hover {
	background: var(--btg-accent);
	color: #ffffff;
}

/* WooCommerce-„In den Warenkorb“ auf Werkseiten im Galerie-Stil */
.btg-werkseite .single_add_to_cart_button {
	min-height: 52px;
	padding: 0 28px !important;
	border-radius: 0 !important;
	background: var(--btg-accent) !important;
	border-color: var(--btg-accent) !important;
	color: #ffffff !important;
	font-family: var(--btg-font) !important;
	font-size: 16px !important;
	font-weight: 400 !important;
	letter-spacing: 0.04em;
}

.btg-werkseite .single_add_to_cart_button:hover {
	background: #0e5865 !important;
}

.btg-werkseite .stock {
	display: inline-block;
	padding: 5px 9px;
	background: var(--btg-gelb);
	color: var(--btg-text) !important;
	font-size: 12px;
	font-weight: 700;
	letter-spacing: 0.08em;
	text-transform: uppercase;
}

.btg-werkseite .stock.out-of-stock {
	background: var(--btg-text);
	color: #ffffff !important;
}

.btg-anfrage-link {
	margin: 12px 0 24px;
}

.btg-infos {
	border-top: 1px solid var(--btg-linie);
	margin-top: 8px;
}

.btg-info {
	border-bottom: 1px solid var(--btg-linie);
}

.btg-info summary {
	display: flex;
	justify-content: space-between;
	align-items: center;
	min-height: 52px;
	font-size: 15px;
	cursor: pointer;
	list-style: none;
}

.btg-info summary::-webkit-details-marker {
	display: none;
}

.btg-info summary::after {
	content: '+';
	font-size: 20px;
	font-weight: 300;
}

.btg-info[open] summary::after {
	content: '−';
}

.btg-info p {
	margin: 0 0 16px;
	font-size: 14px;
	line-height: 1.6;
	color: var(--btg-text-2);
}

/* ---------- Anfrage ---------- */
.btg-anfrage {
	clear: both;
	display: flex;
	flex-wrap: wrap;
	gap: 48px;
	margin: 64px 0;
	padding: 56px clamp(20px, 4vw, 48px);
	background: var(--btg-flaeche);
}

.btg-anfrage__intro {
	flex: 1 1 300px;
}

.btg-anfrage__intro p {
	margin-top: 14px;
	font-size: 16px;
	line-height: 1.6;
	color: var(--btg-text-2);
}

.btg-anfrage__formular {
	flex: 1 1 460px;
}

.btg-form {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 16px;
}

.btg-feld {
	display: flex;
	flex-direction: column;
	gap: 6px;
	font-size: 14px;
}

.btg-feld--breit {
	grid-column: 1 / -1;
}

.btg .btg-feld input,
.btg .btg-feld textarea {
	width: 100%;
	min-height: 48px;
	margin: 0;
	padding: 10px 14px;
	border: 1px solid #a8a49b;
	border-radius: 0;
	background: #ffffff;
	font-family: var(--btg-font);
	font-size: 15px;
	color: var(--btg-text);
	box-shadow: none;
}

.btg .btg-feld textarea {
	line-height: 1.5;
	resize: vertical;
}

.btg .btg-feld input:focus,
.btg .btg-feld textarea:focus {
	outline: 2px solid var(--btg-accent);
	outline-offset: 0;
}

.btg-feld--falle {
	position: absolute !important;
	left: -9999px !important;
	width: 1px;
	height: 1px;
	overflow: hidden;
}

.btg-check {
	display: flex;
	align-items: flex-start;
	gap: 10px;
	font-size: 14px;
	line-height: 1.5;
	color: var(--btg-text-2);
}

.btg-check input {
	width: 20px;
	height: 20px;
	margin: 1px 0 0;
	flex-shrink: 0;
	accent-color: var(--btg-text);
}

.btg-meldung {
	padding: 16px 18px;
	font-size: 15px;
}

.btg-meldung--ok {
	background: #ffffff;
	border-left: 4px solid var(--btg-accent);
}

.btg-meldung--fehler {
	background: #ffffff;
	border-left: 4px solid #b42318;
}

/* ---------- Weitere Werke ---------- */
.btg-weitere {
	clear: both;
	margin: 64px 0;
}

/* ---------- Produktlisten (Shop / Künstlerseite) ---------- */
.btg-loop-info {
	display: flex;
	flex-direction: column;
	gap: 2px;
	margin: 4px 0 6px;
}

.btg-loop-info__kuenstler {
	font-size: 14px;
	color: var(--btg-text-2);
}

.btg-loop-info__meta {
	font-size: 13px;
	color: var(--btg-grau);
}

/* ---------- Mobil ---------- */
@media (max-width: 640px) {
	.btg-form {
		grid-template-columns: minmax(0, 1fr);
	}
	.btg .btg-abschnitt {
		font-size: 28px;
	}
	.btg-profil {
		gap: 28px;
	}
	.btg-raster {
		grid-template-columns: repeat(auto-fill, minmax(160px, 1fr));
		gap: 32px 16px;
	}
}