/*
 * Accordions — native <details>/<summary> (core/details block).
 * A gray clickable header that lightens when open, with a bold uppercase title
 * and a +/− marker on the right. No JavaScript; the disclosure is the
 * browser-native <details> toggle.
 */

.wp-block-details {
	margin: 0 0 1px;
	background-color: #ffffff;
	box-sizing: border-box;
}

/* Header */
.wp-block-details > summary {
	position: relative;
	list-style: none; /* drop the native disclosure triangle */
	padding: 10px 44px 10px 20px;
	min-height: 45px;
	box-sizing: border-box;
	background-color: #e0e0e0;
	color: #000000;
	font-family: var(--wp--preset--font-family--montserrat, sans-serif);
	font-weight: 700;
	text-transform: uppercase;
	font-size: 1.25rem;
	line-height: 1.3;
	cursor: pointer;
	opacity: 0.75;
	transition: 250ms ease;
}

.wp-block-details > summary::-webkit-details-marker {
	display: none;
}

.wp-block-details > summary:hover {
	opacity: 1;
}

/* Closed marker */
.wp-block-details > summary::after {
	content: '+';
	position: absolute;
	top: 50%;
	right: 20px;
	transform: translateY(-50%);
	font-size: 1.25em;
	line-height: 1;
	color: #919191;
}

/* Open header */
.wp-block-details[open] > summary {
	background-color: #fafafa;
	opacity: 1;
}

/* Open marker */
.wp-block-details[open] > summary::after {
	content: '\2013'; /* en dash – */
	color: #9e9e9e;
}

/* Keep panel content hidden while collapsed. Inner blocks that set their own
   display (e.g. flex columns) would otherwise override the native hiding of a
   closed <details>. */
.wp-block-details:not([open]) > :not(summary) {
	display: none;
}

/* Panel body — everything after <summary>. The content supplies its own
   inner padding, so the body region stays flush and just provides the fill. */
.wp-block-details[open] > summary ~ * {
	background-color: #fafafa;
	font-size: 1rem;
}

/*
 * "Q&A grid" gallery style (registered as core/gallery style `qa-grid`).
 * The Ask-a-Scientist slide galleries. Core's gallery gives each image
 * flex-grow:1, so a lone image on an incomplete row stretches to full width.
 * Keep every image at its column width instead, leaving an orphan half-width
 * and left-aligned — matching the original Weebly gallery. Opt-in only, so
 * other galleries on the site are unaffected.
 */
.wp-block-gallery.is-style-qa-grid.has-nested-images figure.wp-block-image {
	flex-grow: 0;
}