/*
 * Montage Blue — Block Style Variants
 * Apply to both editor and front-end.
 */

/* Safe fallbacks for editor where style.css isn't loaded */
:root {
	--mb-deep-blue: #2C5F8A;
	--mb-ocean: #5B8FB9;
	--mb-sky-mist: #E6F1F7;
	--mb-pearl: #FAF7F2;
	--mb-blush: #F6DDE2;
	--mb-gold: #C7AA6A;
	--mb-gold-deep: #a88a4d;
	--mb-slate: #4A4F55;
	--mb-muted: #707070;
	--mb-white: #ffffff;
	--font-heading: 'Playfair Display', Georgia, serif;
	--font-ui: Montserrat, sans-serif;
	--font-body: Lora, Georgia, serif;
	--font-script: 'Cormorant Garamond', serif;
	--t-base: 0.3s;
	--ease: cubic-bezier(.25, .8, .25, 1);
}

/* ============================================================ PARAGRAPH */
.wp-block-paragraph.is-style-eyebrow,
p.is-style-eyebrow {
	font-family: var(--font-ui);
	font-size: 0.72rem;
	font-weight: 500;
	letter-spacing: 0.22em;
	text-transform: uppercase;
	color: var(--mb-gold);
	margin-bottom: 0.5rem;
}
.wp-block-paragraph.is-style-eyebrow::before,
p.is-style-eyebrow::before {
	content: '';
	display: inline-block;
	width: 28px;
	height: 1px;
	background: var(--mb-gold);
	vertical-align: middle;
	margin-right: 0.75rem;
}

.wp-block-paragraph.is-style-lead,
p.is-style-lead {
	font-family: var(--font-heading);
	font-style: italic;
	font-size: clamp(1.2rem, 1.8vw, 1.45rem);
	line-height: 1.55;
	color: var(--mb-deep-blue);
	margin-bottom: 2rem;
}

.wp-block-paragraph.is-style-drop-cap::first-letter,
p.is-style-drop-cap::first-letter {
	font-family: var(--font-heading);
	font-size: 4.5rem;
	font-weight: 500;
	color: var(--mb-deep-blue);
	float: left;
	line-height: 0.85;
	margin: 0.15rem 0.5rem 0 0;
	padding-top: 4px;
}

/* ============================================================ HEADING */
h1.is-style-script, h2.is-style-script, h3.is-style-script, h4.is-style-script {
	font-family: var(--font-script);
	font-style: italic;
	font-weight: 500;
	color: var(--mb-gold);
}

h1.is-style-eyebrow, h2.is-style-eyebrow, h3.is-style-eyebrow,
h4.is-style-eyebrow, h5.is-style-eyebrow, h6.is-style-eyebrow {
	font-family: var(--font-ui);
	font-size: 0.72rem;
	font-weight: 500;
	letter-spacing: 0.22em;
	text-transform: uppercase;
	color: var(--mb-gold);
}

/* ============================================================ QUOTE */
.wp-block-quote.is-style-editorial {
	font-family: var(--font-heading);
	font-style: italic;
	font-size: clamp(1.5rem, 2.5vw, 2rem);
	line-height: 1.45;
	color: var(--mb-deep-blue);
	border-left: 2px solid var(--mb-gold);
	padding: 1.5rem 2.5rem;
	margin: 3rem 0;
	position: relative;
}
.wp-block-quote.is-style-editorial::before {
	content: '\201C';
	position: absolute;
	top: -0.5rem;
	left: 1.5rem;
	font-family: var(--font-heading);
	font-size: 5rem;
	color: var(--mb-gold);
	opacity: 0.4;
	line-height: 1;
}
.wp-block-quote.is-style-editorial cite {
	display: block;
	margin-top: 1.25rem;
	font-family: var(--font-ui);
	font-style: normal;
	font-size: 0.72rem;
	font-weight: 500;
	letter-spacing: 0.22em;
	text-transform: uppercase;
	color: var(--mb-muted);
}

/* ============================================================ BUTTON */
.wp-block-button.is-style-secondary .wp-block-button__link {
	background: transparent !important;
	color: var(--mb-deep-blue) !important;
	border: 1px solid var(--mb-deep-blue);
	transition: all var(--t-base) var(--ease);
}
.wp-block-button.is-style-secondary .wp-block-button__link:hover {
	background: var(--mb-deep-blue) !important;
	color: var(--mb-white) !important;
}

.wp-block-button.is-style-gold .wp-block-button__link {
	background: var(--mb-gold) !important;
	color: var(--mb-white) !important;
}
.wp-block-button.is-style-gold .wp-block-button__link:hover {
	background: var(--mb-gold-deep) !important;
}

.wp-block-button.is-style-text-link .wp-block-button__link {
	background: transparent !important;
	color: var(--mb-deep-blue) !important;
	padding: 0.25rem 0 !important;
	border-bottom: 1px solid var(--mb-gold);
	border-radius: 0;
}
.wp-block-button.is-style-text-link .wp-block-button__link::after {
	content: '\2192';
	margin-left: 0.5rem;
	color: var(--mb-gold);
	transition: transform var(--t-base) var(--ease);
	display: inline-block;
}
.wp-block-button.is-style-text-link .wp-block-button__link:hover::after {
	transform: translateX(4px);
}

/* ============================================================ IMAGE */
.wp-block-image.is-style-gold-offset {
	position: relative;
}
.wp-block-image.is-style-gold-offset::before {
	content: '';
	position: absolute;
	top: 20px; left: -20px; right: 20px; bottom: -20px;
	border: 1px solid var(--mb-gold);
	z-index: -1;
	transition: transform var(--t-base) var(--ease);
}
.wp-block-image.is-style-gold-offset:hover::before {
	transform: translate(6px, 6px);
}
.wp-block-image.is-style-gold-offset img {
	position: relative;
	z-index: 1;
}

.wp-block-image.is-style-magazine-card {
	position: relative;
	overflow: hidden;
}
.wp-block-image.is-style-magazine-card img {
	width: 100%;
	transition: transform 1.4s cubic-bezier(0,0,0.2,1);
}
.wp-block-image.is-style-magazine-card:hover img {
	transform: scale(1.05);
}

/* ============================================================ SEPARATOR */
.wp-block-separator.is-style-compass {
	border: none;
	margin: 2.5rem auto;
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 0.85rem;
	max-width: 200px;
	height: auto;
	position: relative;
}
.wp-block-separator.is-style-compass::before,
.wp-block-separator.is-style-compass::after {
	content: '';
	flex: 1;
	height: 1px;
	background: var(--mb-gold);
	opacity: 0.6;
}