/* ===========================================================================
   Industries page, design canvas "Bransjer" (2026-10-02)
   ===========================================================================
   Loaded only on pages whose content uses the `cq-ind-` sections (see
   inc/page-bransjer.php). Values follow the canvas and the Certain QMS Web
   Design System it was built with: white hero with breadcrumb, a single
   column of nine industries as <details> rows with an icon tile and chevron,
   and the ink "next step" CTA band.

   The accordion is one core/html block on purpose: core/details only takes a
   plain-text <summary>, so it cannot hold the icon tile and the <h2> the
   design asks for, and its bare <summary> would feed the FAQPage JSON-LD in
   functions.php, which these rows are not. */

.cq-main {
	/* Same gutter as the header/footer (theme.json root padding), so the
	   content column lines up with them (2026-10-07 review CQ-V1). */
	--cq-ind-gutter: var(--wp--style--root--padding-left, clamp(24px, 5.56vw, 80px));
	--cq-ind-section: clamp(64px, 8vw, 112px);
	--cq-ind-muted: #3f4947;
	--cq-ind-text: #232323;
}

.wp-block-post-content > .cq-ind-s {
	margin-block: 0 !important;
}

.cq-main .cq-ind-s :where(h1, h2, h3, p, ul, ol, li, .wp-block-buttons, .wp-block-group) {
	margin: 0 !important;
}

.cq-main .cq-ind-s {
	font-family: "Roboto", system-ui, -apple-system, "Segoe UI", sans-serif;
}

.cq-main .cq-ind-wrap {
	box-sizing: border-box;
	margin-inline: auto !important;
	/* 1200px of content, like the header and footer (contentSize). */
	max-width: calc(1200px + 2 * var(--cq-ind-gutter));
	padding-inline: var(--cq-ind-gutter);
}

/* --- Hero ---------------------------------------------------------------- */

.cq-main .cq-ind-hero {
	background-color: #ffffff;
}

.cq-main .cq-ind-hero > .cq-ind-wrap {
	display: flex;
	flex-direction: column;
	gap: var(--cq-crumb-gap);
	padding-block: var(--cq-crumb-top) 64px;
}

.cq-main .cq-ind-hero__copy {
	display: flex;
	flex-direction: column;
	gap: 24px;
	max-width: 760px;
}

.cq-main .cq-ind-hero h1 {
	color: var(--cq-ink);
	font-size: clamp(34px, 4.4vw, 56px);
	font-weight: 500;
	letter-spacing: -0.022em;
	line-height: 1.08;
	text-wrap: balance;
}

.cq-main .cq-ind-hero__lead {
	color: var(--cq-ind-muted);
	font-size: 20px;
	line-height: 1.6;
	max-width: 68ch;
}

/* --- Industry list ------------------------------------------------------- */

.cq-main .cq-ind-list > .cq-ind-wrap {
	padding-bottom: var(--cq-ind-section);
}

.cq-main .cq-ind-items {
	border-top: 1px solid var(--cq-border);
	display: flex;
	flex-direction: column;
}

.cq-main .cq-ind-item {
	border-bottom: 1px solid var(--cq-border);
	scroll-margin-top: 24px;
}

.cq-main .cq-ind-item__sum {
	align-items: center;
	cursor: pointer;
	display: flex;
	gap: 24px;
	list-style: none;
	min-height: 48px;
	padding-block: 24px;
}

.cq-main .cq-ind-item__sum::-webkit-details-marker {
	display: none;
}

.cq-main .cq-ind-item__sum::marker {
	content: "";
}

.cq-main .cq-ind-item__sum:focus-visible {
	border-radius: 8px;
	outline: 2px solid var(--cq-blue);
	outline-offset: 2px;
}

.cq-main .cq-ind-item__icon {
	align-items: center;
	background-color: var(--cq-mist);
	border-radius: var(--cq-radius-md);
	color: var(--cq-blue);
	display: flex;
	flex-shrink: 0;
	height: 48px;
	justify-content: center;
	width: 48px;
}

.cq-main .cq-ind-item__icon::before {
	background-color: currentColor;
	content: "";
	height: 24px;
	-webkit-mask: var(--cq-icon) center / contain no-repeat;
	mask: var(--cq-icon) center / contain no-repeat;
	width: 24px;
}

.cq-main .cq-ind-item__title {
	color: var(--cq-ink);
	flex-grow: 1;
	font-size: clamp(20px, 1.8vw, 24px);
	font-weight: 500;
	letter-spacing: -0.01em;
	line-height: 1.3;
	transition: color 120ms var(--cq-ease);
}

.cq-main .cq-ind-item__sum:hover .cq-ind-item__title {
	color: var(--cq-blue);
}

.cq-main .cq-ind-item__chev {
	align-items: center;
	border-radius: var(--cq-radius-pill);
	color: var(--cq-blue);
	display: flex;
	flex-shrink: 0;
	height: 40px;
	justify-content: center;
	transition: transform 200ms var(--cq-ease), background-color 120ms var(--cq-ease);
	width: 40px;
}

.cq-main .cq-ind-item__chev::before {
	background-color: currentColor;
	content: "";
	height: 24px;
	-webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E") center / contain no-repeat;
	mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E") center / contain no-repeat;
	width: 24px;
}

.cq-main .cq-ind-item__sum:hover .cq-ind-item__chev {
	background-color: var(--cq-mist);
}

.cq-main .cq-ind-item[open] .cq-ind-item__chev {
	transform: rotate(180deg);
}

.cq-main .cq-ind-item__body {
	display: flex;
	flex-direction: column;
	gap: 16px;
	padding: 0 64px 32px 72px;
}

.cq-main .cq-ind-item__body p {
	color: var(--cq-ind-text);
	font-size: 17px;
	line-height: 1.65;
	margin: 0;
	max-width: 68ch;
}

/* --- CTA band ------------------------------------------------------------ */

.cq-main .cq-ind-cta {
	background-color: var(--cq-ink);
	color: #ffffff;
}

.cq-main .cq-ind-cta__inner {
	/* Centred column at every width: copy above, buttons below (Oda, 2026-10-07). */
	align-items: center;
	display: flex;
	flex-direction: column;
	gap: 32px;
	padding-block: var(--cq-ind-section);
	text-align: center;
}

.cq-main .cq-ind-cta__copy {
	align-items: center;
	display: flex;
	flex-direction: column;
	gap: 12px;
}

.cq-main .cq-ind-cta__eyebrow {
	color: var(--cq-sky);
	font-size: 13px;
	font-weight: 600;
	letter-spacing: 0.08em;
	line-height: 1.2;
	text-transform: uppercase;
}

.cq-main .cq-ind-cta__title {
	color: #ffffff;
	font-size: clamp(28px, 3.2vw, 40px);
	font-weight: 500;
	letter-spacing: -0.016em;
	line-height: 1.15;
	max-width: 24ch;
	text-wrap: balance;
}

.cq-main .cq-ind-cta__lead {
	color: #ffffff;
	font-size: 18px;
	line-height: 1.6;
	max-width: 640px;
}

.cq-main .cq-ind-cta .wp-block-buttons {
	gap: 12px;
	justify-content: center;
}

.cq-main .cq-ind-cta .cq-ind-btn--light > .wp-block-button__link {
	background-color: #ffffff !important;
	color: var(--cq-ink) !important;
}

.cq-main .cq-ind-cta .cq-ind-btn--light > .wp-block-button__link:hover {
	background-color: var(--cq-sky) !important;
	color: var(--cq-ink) !important;
}

.cq-main .cq-ind-cta .cq-ind-btn--ghost > .wp-block-button__link {
	background-color: transparent !important;
	border-color: var(--cq-sky) !important;
	color: #ffffff !important;
}

.cq-main .cq-ind-cta .cq-ind-btn--ghost > .wp-block-button__link:hover {
	background-color: rgba(188, 207, 252, .16) !important;
	color: #ffffff !important;
}

.cq-main .cq-ind-cta .wp-block-button > .wp-block-button__link:focus-visible {
	outline-color: var(--cq-sky);
}

/* --- Icons --------------------------------------------------------------- */
/* Lucide-style, 24px, 1.5px stroke, as in the canvas. Same mask technique as
   the shared `.cq-icon--*` set. */

.cq-ind-icon--health {
	--cq-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M19 14c1.49-1.46 3-3.21 3-5.5A5.5 5.5 0 0 0 16.5 3c-1.76 0-3 .5-4.5 2-1.5-1.5-2.74-2-4.5-2A5.5 5.5 0 0 0 2 8.5c0 2.3 1.5 4.05 3 5.5l7 7Z'/%3E%3Cpath d='M3.22 12H9.5l.5-1 2 4.5 2-7 1.5 3.5h5.27'/%3E%3C/svg%3E");
}

.cq-ind-icon--energy {
	--cq-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4 14a1 1 0 0 1-.78-1.63l9.9-10.2a.5.5 0 0 1 .86.46l-1.92 6.02A1 1 0 0 0 13 10h7a1 1 0 0 1 .78 1.63l-9.9 10.2a.5.5 0 0 1-.86-.46l1.92-6.02A1 1 0 0 0 11 14z'/%3E%3C/svg%3E");
}

.cq-ind-icon--oil {
	--cq-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 22a7 7 0 0 0 7-7c0-2-1-3.9-3-5.5s-3.5-4-4-6.5c-.5 2.5-2 4.9-4 6.5C6 11.1 5 13 5 15a7 7 0 0 0 7 7z'/%3E%3C/svg%3E");
}

.cq-ind-icon--public {
	--cq-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M3 22h18'/%3E%3Cpath d='M6 18v-7'/%3E%3Cpath d='M10 18v-7'/%3E%3Cpath d='M14 18v-7'/%3E%3Cpath d='M18 18v-7'/%3E%3Cpath d='M12 2 20 7H4z'/%3E%3C/svg%3E");
}

.cq-ind-icon--factory {
	--cq-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M2 20a2 2 0 0 0 2 2h16a2 2 0 0 0 2-2V8l-7 5V8l-7 5V4a2 2 0 0 0-2-2H4a2 2 0 0 0-2 2Z'/%3E%3Cpath d='M17 18h1'/%3E%3Cpath d='M12 18h1'/%3E%3Cpath d='M7 18h1'/%3E%3C/svg%3E");
}

.cq-ind-icon--flask {
	--cq-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M10 2v7.527a2 2 0 0 1-.211.896L4.72 20.55a1 1 0 0 0 .9 1.45h12.76a1 1 0 0 0 .9-1.45l-5.069-10.127A2 2 0 0 1 14 9.527V2'/%3E%3Cpath d='M8.5 2h7'/%3E%3Cpath d='M7 16h10'/%3E%3C/svg%3E");
}

.cq-ind-icon--umbrella {
	--cq-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M22 12a10.06 10.06 1 0 0-20 0Z'/%3E%3Cpath d='M12 12v8a2 2 0 0 0 4 0'/%3E%3Cpath d='M12 2v1'/%3E%3C/svg%3E");
}

.cq-ind-icon--gauge {
	--cq-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m12 14 4-4'/%3E%3Cpath d='M3.34 19a10 10 0 1 1 17.32 0'/%3E%3C/svg%3E");
}

.cq-ind-icon--pill {
	--cq-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m10.5 20.5 10-10a4.95 4.95 0 1 0-7-7l-10 10a4.95 4.95 0 1 0 7 7Z'/%3E%3Cpath d='m8.5 8.5 7 7'/%3E%3C/svg%3E");
}
/* --- Small screens ------------------------------------------------------- */

@media (max-width: 599px) {
	.cq-main .cq-ind-item__sum {
		gap: 16px;
	}

	.cq-main .cq-ind-item__body {
		padding: 0 0 24px 0;
	}
}

@media (prefers-reduced-motion: reduce) {
	.cq-main .cq-ind-item__title,
	.cq-main .cq-ind-item__chev {
		transition: none;
	}
}