/*
 * Shared brand typefaces used across every AC Cannabis Wissen widget
 * (Montserrat for headings/titles, Amiko for body text). Registered once and
 * pulled in as a dependency by every widget so typography is correct even if
 * the active theme doesn't already load these fonts.
 */

@font-face {
	font-family: 'Montserrat';
	src: url( 'https://arge-canna.at/wp-content/uploads/2025/05/Montserrat-VariableFont_wght.ttf' ) format( 'truetype-variations' );
	font-weight: 100 900;
	font-style: normal;
	font-display: swap;
}

@font-face {
	font-family: 'Amiko';
	src: url( 'https://arge-canna.at/wp-content/uploads/2025/05/Amiko-Regular.ttf' ) format( 'truetype' );
	font-weight: 400;
	font-style: normal;
	font-display: swap;
}

/*
 * Shared CI heading/eyebrow utilities, defined once here (loaded by every widget via
 * get_style_depends()) rather than duplicated per widget — Artikel-Abschnitte, beide
 * Bürgerinitiative-Widgets, Partner & Unterstützer, Rechtliche Situation and Forschung
 * all use these for their top section heading and (where present) its eyebrow label.
 */
.ac-heading {
	font-family: 'Montserrat', sans-serif;
	font-size: clamp( 1.5rem, 5vw, 4rem );
	font-weight: 700;
	line-height: 1.1;
	color: #303030;
	margin: 0;
}

.ac-eyebrow {
	display: block;
	font-family: 'Montserrat', sans-serif;
	font-size: 1rem;
	font-weight: 600;
	text-transform: uppercase;
	line-height: 1.1;
	letter-spacing: 2px;
	color: var( --ac-accent, #2e6741 );
	margin: 0 0 14px;
}

/*
 * Optional header-image layout: heading/intro text alongside a rounded image. Only
 * gets the two-column treatment when a widget actually has an image set (.has-image) —
 * otherwise it's just a plain single-column block, so nothing breaks or leaves empty
 * space when no image is uploaded.
 */
.ac-intro-grid {
	display: grid;
	grid-template-columns: 1fr;
	gap: 30px;
	align-items: center;
}

.ac-intro-grid.has-image {
	grid-template-columns: 1fr 260px;
}

.ac-intro-grid-image {
	border-radius: 16px;
	overflow: hidden;
	box-shadow: 0 10px 30px rgba( 0, 0, 0, 0.08 );
}

/* Toggled via the "Bild-Schatten" switcher control (see add_header_image_control()). */
.ac-intro-grid-image.ac-no-shadow {
	box-shadow: none;
}

.ac-intro-grid-image img {
	display: block;
	width: 100%;
	height: 100%;
	object-fit: cover;
}

@media ( max-width: 700px ) {
	.ac-intro-grid.has-image {
		grid-template-columns: 1fr;
	}

	.ac-intro-grid-image {
		order: -1;
		max-height: 220px;
	}
}