/* ── Google Fonts fallback (loaded via wp_enqueue in plugin) ── */
@import url('https://fonts.googleapis.com/css2?family=Cinzel:wght@400;600;700&family=Cinzel+Decorative:wght@400;700&family=Cormorant+Garamond:ital,wght@0,400;0,500;1,400&display=swap');

/* ── Artwork page content area — override theme content wrapper ── */
.mg-art-single__page-wrap {
	background: #090909;
	width: 100%;
}

/* Neutralize common theme content containers inside the page wrap */
.mg-art-single__page-wrap .site-main,
.mg-art-single__page-wrap #main,
.mg-art-single__page-wrap .content-area,
.mg-art-single__page-wrap article,
.mg-art-single__page-wrap .entry-content,
.mg-art-single__page-wrap .post-content {
	padding: 0 !important;
	margin: 0 !important;
	max-width: none !important;
	width: 100% !important;
	background: transparent !important;
	float: none !important;
}

.mg-lightbox-open { overflow: hidden; }

/* ── Gallery widget (shortcode) ── */
.mg-gallery-widget {
	--gold: 43 72% 55%;
	--gold-light: 43 80% 70%;
	--gold-dark: 43 60% 35%;
	--bg: 0 0% 3%;
	background: hsl(var(--bg));
	color: hsl(45 10% 90%);
	font-family: "Cormorant Garamond", serif;
	padding: 96px 16px;
}

.mg-gallery-widget * { box-sizing: border-box; }
.mg-gallery-widget input[type="radio"] { position: absolute; opacity: 0; pointer-events: none; }
.mg-gallery-container { max-width: 1152px; margin: 0 auto; }
.mg-header { text-align: center; margin-bottom: 48px; }
.mg-kicker { font-family: "Cinzel", serif; font-size: 10px; letter-spacing: .4em; text-transform: uppercase; color: hsl(var(--gold) / .6); margin: 0 0 16px; }
.mg-title { font-family: "Cinzel Decorative", serif; font-size: 30px; line-height: 1.15; margin: 0; background: linear-gradient(135deg, hsl(var(--gold-dark)), hsl(var(--gold)), hsl(var(--gold-light)), hsl(var(--gold))); -webkit-background-clip: text; -webkit-text-fill-color: transparent; background-clip: text; }
.mg-tabs { display: flex; flex-wrap: wrap; justify-content: center; gap: 16px; margin-bottom: 40px; }
.mg-tab { display: inline-flex; align-items: center; justify-content: center; padding: 8px 24px; border: 1px solid hsl(var(--gold-dark) / .3); font-family: "Cinzel", serif; font-size: 10px; letter-spacing: .2em; text-transform: uppercase; color: hsl(var(--gold) / .7); cursor: pointer; transition: all .35s ease; text-align: center; }
.mg-tab:hover { border-color: hsl(var(--gold)); color: hsl(var(--gold-light)); }
.mg-desc-block { display: none; max-width: 768px; margin: 0 auto 64px; text-align: center; padding: 0 16px; }
.mg-subtitle { font-family: "Cinzel", serif; font-size: 10px; letter-spacing: .4em; text-transform: uppercase; color: hsl(var(--gold-light) / .8); margin: 0 0 12px; }
.mg-desc-text { font-size: 16px; line-height: 1.625; font-style: italic; color: hsl(var(--gold-light) / .85); margin: 0; }
.mg-line { width: 96px; height: 1px; margin: 24px auto 0; background: linear-gradient(90deg, transparent, hsl(var(--gold-dark)), hsl(var(--gold)), hsl(var(--gold-dark)), transparent); }
.mg-grid { display: none; grid-template-columns: repeat(6, minmax(0,1fr)); gap: 42px 32px; align-items: start; }
.mg-artwork { grid-column: span 3; display: block; text-decoration: none; color: inherit; cursor: pointer; }
.mg-card { position: relative; overflow: hidden; width: 100%; aspect-ratio: 4/3; border: 1px solid hsl(var(--gold-dark) / .25); background: hsl(0 0% 3%); display: flex; align-items: center; justify-content: center; padding: 0; }
.mg-card img { width: 100%; height: 100%; object-fit: contain; display: block; transition: transform 1s ease; }
.mg-artwork:hover .mg-card img { transform: scale(1.03); }
.mg-card::after { content: ""; position: absolute; inset: 0; z-index: 2; background: linear-gradient(to top, rgba(0,0,0,.88) 0%, rgba(0,0,0,.62) 22%, rgba(0,0,0,.22) 46%, rgba(0,0,0,0) 72%); opacity: 0; transition: opacity .7s ease; pointer-events: none; }
.mg-artwork:hover .mg-card::after { opacity: 1; }
.mg-card-hover { position: absolute; left: 32px; right: 32px; bottom: 28px; z-index: 3; transform: translateY(18px); opacity: 0; transition: transform .5s ease, opacity .5s ease; pointer-events: none; }
.mg-artwork:hover .mg-card-hover { transform: translateY(0); opacity: 1; }
.mg-card-technique { font-family: "Cinzel", serif; font-size: 10px; letter-spacing: .22em; text-transform: uppercase; color: hsl(var(--gold-light) / .9); margin: 0 0 8px; text-align: left; }
.mg-card-hover-title { font-family: "Cinzel", serif; font-size: 14px; line-height: 1.35; letter-spacing: .05em; text-transform: uppercase; color: hsl(var(--gold-light)); margin: 0; text-align: left; }
.mg-placeholder { width: 100%; height: 100%; min-height: 240px; display: flex; align-items: center; justify-content: center; text-align: center; font-family: "Cinzel", serif; font-size: 10px; letter-spacing: .22em; text-transform: uppercase; color: hsl(var(--gold) / .45); background: radial-gradient(circle at center, hsl(var(--gold) / .12), transparent 55%), hsl(0 0% 5%); padding: 20px; }
.mg-info { margin-top: 16px; text-align: center; }
.mg-artwork-title { font-family: "Cinzel", serif; font-size: 13px; line-height: 1.45; letter-spacing: .03em; color: hsl(var(--gold-light) / .9); margin: 0; font-weight: 600; text-transform: uppercase; }
.mg-meta { font-size: 14px; line-height: 1.4; color: hsl(var(--gold) / .7); margin: 6px 0 0; font-weight: 500; }
.mg-empty-state { grid-column: 1/-1; padding: 48px 24px; border: 1px solid hsl(var(--gold-dark) / .2); text-align: center; font-family: "Cinzel", serif; font-size: 11px; letter-spacing: .22em; text-transform: uppercase; color: hsl(var(--gold) / .55); }

/* ── Single Artwork Page ── */
.mg-art-single {
	background: #090909;
	color: #dbc27a;
	padding: 42px 20px 110px;
	min-height: 100vh;
}

.mg-art-single__wrap {
	max-width: 1152px;
	margin: 0 auto;
}

.mg-art-single__back {
	display: inline-flex;
	gap: 12px;
	align-items: center;
	margin-top: 72px;
	margin-bottom: 20px;
	text-decoration: none;
	color: #bea45a;
	font-family: "Cinzel", serif;
	font-size: 13px;
	letter-spacing: .28em;
	text-transform: uppercase;
}

.mg-art-single__back:hover { color: #dbc27a; }
.mg-art-single__back-arrow { font-size: 28px; line-height: 1; transform: translateY(-1px); }

.mg-art-single__hero {
	display: grid;
	grid-template-columns: minmax(0, 1fr) minmax(430px, .92fr);
	gap: 96px;
	align-items: start;
}

.mg-art-single__media { min-width: 0; }

.mg-art-single__image-frame {
	position: relative;
	border: 1px solid rgba(190,164,90,.18);
	padding: 0;
	background: linear-gradient(90deg, rgba(255,255,255,.06), rgba(0,0,0,0) 12%, rgba(0,0,0,0) 88%, rgba(255,255,255,.06));
	box-shadow: 0 0 0 1px rgba(190,164,90,.06) inset;
}

.mg-art-single__image { display: block; width: 100%; height: auto; }

.mg-art-single__zoom {
  	position: absolute !important;
  	left: 50% !important;
  	top: 50% !important;
  	transform: translate(-50%,-50%) !important;
  	display: inline-flex !important;
  	align-items: center !important;
  	gap: 16px !important;
  	padding: 20px 44px !important;
  	border: 1px solid rgba(190,164,90,.65) !important;
  	border-radius: 0 !important;
  	background: rgba(28,22,10,.88) !important;
  	background-color: rgba(28,22,10,.88) !important;
  	color: #d4b562 !important;
  	font-family: "Cinzel", serif !important;
  	font-size: 13px !important;
  	letter-spacing: .32em !important;
  	text-transform: uppercase !important;
  	cursor: pointer !important;
  	white-space: nowrap !important;
  	transition: opacity .3s ease, visibility .3s ease, border-color .3s ease, background .3s ease !
  important;
  	box-shadow: 0 2px 32px rgba(0,0,0,.45) !important;
  	outline: none !important;
  	-webkit-appearance: none !important;
  	appearance: none !important;
  	opacity: 0 !important;
  	visibility: hidden !important;
  	pointer-events: none !important;
  }

  .mg-art-single__image-frame:hover .mg-art-single__zoom,
  .mg-art-single__image-frame:focus-within .mg-art-single__zoom {
  	opacity: 1 !important;
  	visibility: visible !important;
  	pointer-events: auto !important;
  }

  .mg-art-single__zoom:hover,
  .mg-art-single__zoom:focus {
  	border-color: rgba(190,164,90,.95) !important;
  	background: rgba(28,22,10,.96) !important;
  	background-color: rgba(28,22,10,.96) !important;
  	color: #e8ca70 !important;
  	outline: none !important;
  }

  .mg-art-single__zoom-icon {
  	font-size: 17px !important;
  	line-height: 1 !important;
  	color: #d4b562 !important;
  	display: inline-block !important;
  }


.mg-art-single__content { }

.mg-art-single__kicker,
.mg-art-single__pager-label {
	font-family: "Cinzel", serif;
	font-size: 10px;
	letter-spacing: .42em;
	text-transform: uppercase;
	color: hsl(43 72% 55% / .6);
	margin: 0 0 16px;
}

.mg-art-single__title {
	font-family: "Cormorant Garamond", serif;
	font-size: clamp(42px, 4.35vw, 24px);
	font-weight: 700;
	letter-spacing: .01em;
	max-width: 100%;
	margin: 0 0 52px;
	line-height: .9;
	background: linear-gradient(135deg, hsl(43 60% 35%), hsl(43 72% 55%), hsl(43 80% 70%), hsl(43 72% 55%));
	-webkit-background-clip: text;
	-webkit-text-fill-color: transparent;
	background-clip: text;
	text-wrap: balance;
}

.mg-art-single__meta {
	padding-top: 42px;
	border-top: 1px solid rgba(190,164,90,.18);
	margin-bottom: 42px;
}

.mg-art-single__row {
	display: grid;
	grid-template-columns: 180px 1fr;
	gap: 28px;
	padding: 0 0 30px;
}

.mg-art-single__label {
	font-family: "Cinzel", serif;
	font-size: 11px;
	letter-spacing: .28em;
	text-transform: uppercase;
	color: #bea45a;
}

.mg-art-single__value {
	font-family: "Cinzel", serif;
	font-size: 14px;
	line-height: 1.55;
	color: #cfbb85;
	text-align: right;
}

.mg-art-single__description {
	font-size: 18px;
	line-height: 1.9;
	color: #cfbb85;
	margin-bottom: 46px;
}

.mg-art-single__description p { margin: 0 0 18px; }

.mg-art-single__button {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-width: 340px;
	padding: 21px 30px;
	border: 1px solid rgba(190,164,90,.5);
	text-decoration: none;
	color: #d4b562;
	font-family: "Cinzel", serif;
	font-size: 12px;
	letter-spacing: .26em;
	text-transform: uppercase;
	background: transparent;
	transition: border-color .3s, color .3s, background .3s;
}

.mg-art-single__button:hover {
	border-color: rgba(190,164,90,.9);
	color: #f0d98a;
	background: rgba(190,164,90,.05);
}

.mg-art-single__pager {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 20px;
	margin-top: 112px;
	padding-top: 56px;
	border-top: 1px solid rgba(190,164,90,.18);
}

.mg-art-single__pager-item {
	display: flex;
}

.mg-art-single__pager-item--next {
	justify-content: flex-end;
}

.mg-art-single__pager-link {
	display: inline-flex;
	align-items: center;
	gap: 18px;
	text-decoration: none;
	color: #b79645;
	transition: color .3s;
}

.mg-art-single__pager-link:hover { color: #dbc27a; }

.mg-art-single__pager-arrow {
	font-size: 28px;
	line-height: 1;
	color: #bea45a;
	flex-shrink: 0;
	transition: color .3s, transform .3s;
}

.mg-art-single__pager-link--prev:hover .mg-art-single__pager-arrow { transform: translateX(-4px); color: #dbc27a; }
.mg-art-single__pager-link--next:hover .mg-art-single__pager-arrow { transform: translateX(4px); color: #dbc27a; }

.mg-art-single__pager-text {
	display: flex;
	flex-direction: column;
	gap: 6px;
}

.mg-art-single__pager-item--next .mg-art-single__pager-text {
	text-align: right;
}

.mg-art-single__pager-label {
	font-family: "Cinzel", serif;
	font-size: 10px;
	letter-spacing: .4em;
	text-transform: uppercase;
	color: hsl(43 72% 55% / .6);
	margin: 0;
	display: block;
}

.mg-art-single__pager-title {
	font-family: "Cormorant Garamond", serif;
	font-size: 17px;
	letter-spacing: .04em;
	line-height: 1.4;
	color: #b79645;
	font-weight: 400;
}

/* ── Lightbox ── */
.mg-art-lightbox {
	position: fixed;
	inset: 0;
	z-index: 99999;
	display: flex;
	align-items: center;
	justify-content: center;
	background: rgba(0,0,0,.92);
	padding: 32px;
}

.mg-art-lightbox[hidden] { display: none; }
.mg-art-lightbox__image { max-width: min(92vw,1400px); max-height: 88vh; display: block; }
.mg-art-lightbox__close { position: absolute; top: 18px; right: 24px; background: transparent; border: 0; color: #fff; font-size: 48px; line-height: 1; cursor: pointer; }

/* ── Responsive ── */
@media (min-width: 768px) {
	.mg-gallery-widget { padding-top: 144px; padding-bottom: 144px; }
	.mg-title { font-size: 48px; }
	.mg-desc-text { font-size: 18px; }
}

@media (max-width: 1024px) {
	.mg-art-single__hero { grid-template-columns: 1fr; gap: 42px; }
	.mg-art-single__title { font-size: clamp(42px, 8vw, 56px); max-width: none; }
	.mg-art-single__button { min-width: 100%; }
}

@media (max-width: 767px) {
	.mg-gallery-widget { padding: 72px 16px; }
	.mg-title { font-size: 34px; }
	.mg-tab { width: 100%; padding: 8px 18px; letter-spacing: .16em; }
	.mg-grid { grid-template-columns: 1fr; gap: 36px; }
	.mg-artwork { grid-column: span 1; }
	.mg-card-hover { left: 20px; right: 20px; bottom: 18px; }
	.mg-card-hover-title { font-size: 12px; }
	.mg-art-single { padding: 32px 16px 72px; }
	.mg-art-single__back { margin-bottom: 28px; font-size: 11px; }
	.mg-art-single__title { font-size: 36px; margin-bottom: 28px; line-height: .94; }
	.mg-art-single__row { grid-template-columns: 1fr; gap: 8px; padding-bottom: 18px; }
	.mg-art-single__value { text-align: left; }
	.mg-art-single__button { min-width: 100%; text-align: center; }
	.mg-art-single__zoom { padding: 14px 18px; font-size: 10px; letter-spacing: .18em; }
	.mg-art-single__pager { grid-template-columns: 1fr; }
	.mg-art-single__pager-item--next { justify-content: flex-start; }
	.mg-art-single__pager-item--next .mg-art-single__pager-text { text-align: left; }
}
