/*
 * Block-component polish — styles native core blocks (Details accordion, etc.)
 * to the Norlon design using global tokens. Structural component styling for a
 * native element; content stays fully editable in the block editor.
 */

/* Details accordion (Services "Explore our Services") — evokes the tabbed look:
   Montserrat uppercase labels, hairline dividers, red active marker. */
.norlon-din-accordion, /* opt-in hook if needed */
.wp-block-details {
	border-top: 2px solid var(--wp--preset--color--hairline-gray, #D9D9D9);
}
.wp-block-details:last-of-type {
	border-bottom: 2px solid var(--wp--preset--color--hairline-gray, #D9D9D9);
}
.wp-block-details > summary {
	list-style: none;
	cursor: pointer;
	padding: 18px 0;
	font-family: "Montserrat", sans-serif;
	font-weight: 700;
	font-size: 12px;
	letter-spacing: 0.12em;
	text-transform: uppercase;
	color: var(--wp--preset--color--ink, #231F20);
	position: relative;
	padding-right: 32px;
}
.wp-block-details > summary::-webkit-details-marker { display: none; }
/* plus/minus indicator in Norlon red */
.wp-block-details > summary::after {
	content: "+";
	position: absolute;
	right: 4px;
	top: 50%;
	transform: translateY(-50%);
	font-size: 20px;
	line-height: 1;
	color: var(--wp--preset--color--norlon-red, #DE3412);
}
.wp-block-details[open] > summary { color: var(--wp--preset--color--norlon-red, #DE3412); }
.wp-block-details[open] > summary::after { content: "\2013"; } /* en dash = minus */
.wp-block-details > summary:hover { color: var(--wp--preset--color--norlon-red, #DE3412); }
.wp-block-details > summary:focus-visible { outline: 2px solid var(--wp--preset--color--signal-red, #EF4135); outline-offset: 2px; }
.wp-block-details > *:not(summary) { padding-bottom: 20px; max-width: 900px; }
