/* pe_accordion_tabs_lite - accordion synced to right-side image panes.
   Shared rules under .pe_acctabs; variant looks:
   --boxed (directories s4): icon circles, active bg highlight, 20px padded items.
   --bar (no_code_ai): 3px left border bar, no icons. Vanilla collapse: desktop
   show/hide via .show; mobile forces every item open and hides the pane column. */
.pe_acctabs .accordion .accordion-item h3 button {
	background-color: unset;
	border: 0 none;
	cursor: pointer;
	/* kill bootstrap accordion-button artifacts from the inlined stack:
	   inset 0 -1px box-shadow (title "underline") + focus ring (border on click) */
	box-shadow: none !important;
	outline: 0;
	padding-top: 0;
	padding-bottom: 0;
	padding-right: 0;
	/* bootstrap-reboot equivalent: buttons don't inherit font from the h3 natively */
	font-family: inherit;
	font-size: inherit;
	font-weight: inherit;
	line-height: inherit;
}
.pe_acctabs .font-24 .accordion-button {
	font-size: 24px;
	padding: 0;
	border: 0 !important;
	box-shadow: none;
}
/* keyboard users still get a focus indicator */
.pe_acctabs .accordion .accordion-item h3 button:focus-visible {
	outline: 2px solid var(--pe_blue);
	outline-offset: 2px;
}
.pe_acctabs .accordion-body * {
	font-size: 16px;
	color: var(--pe_old);
}
.pe_acctabs .accordion-button::after { display: none; }
/* boxed only: directories page-CSS button colors (bar inherits the h3 color classes) */
.pe_acctabs--boxed .accordion-button { color: var(--pe_deep_blue); }
/* vanilla tab panes */
.pe_acctabs .tab-pane { display: none; }
.pe_acctabs .tab-pane.active { display: block; }
/* --boxed variant (directories s4) */
.pe_acctabs--boxed .accordion .accordion-item {
	border: 0;
	border-radius: 2px;
	padding: 20px;
}
.pe_acctabs--boxed .accordion .accordion-item:hover button { color: var(--pe_blue); }
.pe_acctabs--boxed .accordion .accordion-item:hover .icon_wrap { background-color: var(--pe_blue); }
.pe_acctabs--boxed .accordion .accordion-item:hover .icon_wrap img { filter: saturate(0) invert(2) brightness(3); }
.pe_acctabs--boxed .icon_wrap {
	width: 47px;
	height: 42px;
	display: block;
	text-align: center;
	border-radius: 100%;
}
/* --bar variant (no_code_ai) */
.pe_acctabs--bar .accordion .accordion-item {
	color: var(--pe_old);
	background-color: unset;
	border: 0 none;
}
.pe_acctabs--bar .accordion .accordion-item:before {
	content: '';
	width: 3px;
	height: 100%;
	background-color: var(--pe_border);
	left: 0;
	top: 0;
	bottom: 0;
	position: absolute;
}
.pe_acctabs--bar .accordion .accordion-item.active:before { background-color: var(--pe_mid_blue); }
.pe_acctabs--bar .accordion .accordion-item:hover:before { background-color: var(--pe_blue); }
.pe_acctabs--bar .accordion .accordion-item h3 button:hover { color: var(--pe_blue); }
.pe_acctabs--bar .accordion-item.active h3 button { pointer-events: none; }
.pe_acctabs--bar .accordion-item h3 { margin-bottom: 0; }
.pe_acctabs--bar .accordion-item h3 button { color: inherit; }
/* mobile: description is centered, so center the title too (text-md-start
   utility takes over at >=768px; explicit rule in case utilities are purged) */
@media (max-width: 767.98px) {
	.pe_acctabs--bar .accordion-item h3 button { text-align: center; }
}
@media (max-width: 991px) {
	.pe_acctabs .accordion-collapse {
		display: block !important; /* all items stay open on mobile */
		visibility: visible;
		height: auto !important;
	}
	.pe_acctabs .accordion-button { pointer-events: none; }
	.pe_acctabs .row_accordion_tab .tab-content { display: none; }
	.pe_acctabs .accordion .accordion-item:before { display: none; }
	.pe_acctabs .accordion .accordion-item.pl-20 { padding: 0 !important; }
	.pe_acctabs .accordion .accordion-item h3 { color: var(--pe_mid_blue); }
}
@media (min-width: 992px) {
	/* vanilla collapse */
	.pe_acctabs .accordion-collapse { display: none; }
	.pe_acctabs .accordion-collapse.show { display: block; }
	.pe_acctabs--boxed .accordion .accordion-item.active { background: rgba(0,35,125,0.05); }
	.pe_acctabs--boxed .accordion-item.active .icon_wrap img { filter: saturate(0) invert(2) brightness(3); }
	.pe_acctabs--boxed .accordion-item.active .icon_wrap { background-color: var(--pe_mid_blue); }
	.pe_acctabs--boxed .accordion-body ul { padding-left: 75px; }
	.pe_acctabs--boxed .accordion-button { color: var(--pe_black); }
	.pe_acctabs--boxed .accordion-button:not(.collapsed) { color: var(--pe_deep_blue); }
	/* bar: font-lg-24 equivalent (utility may be absent from the lite CSS stack) */
	.pe_acctabs--bar .accordion-item h3 button { font-size: 24px; }
}
/* closing paragraph + up to 2 buttons under the accordion */
.pe_acctabs .acctabs_closing { margin-top: 50px; }
.pe_acctabs .acctabs_closing_text { font-size: var(--fs-18); color: var(--pe_old); }
.pe_acctabs .acctabs_btns {
	margin-top: 25px;
	display: flex;
	flex-wrap: wrap;
	gap: 15px;
	justify-content: center;
}
/* own geometry: .btn-xl / --fsxl are not in the lite CSS stack */
.pe_acctabs .acctabs_btn {
	display: inline-block;
	width: auto;
	font-family: var(--latobold);
	font-size: var(--fs-16);
	line-height: 1;
	text-transform: uppercase;
	padding: 14px 30px;
	border-radius: var(--border_radius_2);
	text-decoration: none;
}
/* optional per-item link at the foot of the description */
.pe_acctabs .acctabs_item_link {
	display: inline-block;
	margin-top: 15px;
	font-family: var(--latobold);
	font-size: var(--fs-16);
	line-height: 1.45;
	text-transform: uppercase;
	color: var(--pe_blue);
	text-decoration: none;
}
.pe_acctabs .acctabs_item_link .acctabs_link_text { border-bottom: 1px solid var(--pe_blue); }
.pe_acctabs .acctabs_item_link:hover .acctabs_link_text,
.pe_acctabs .acctabs_item_link:focus .acctabs_link_text { border-bottom-color: transparent; }
/* own glyph so it survives a brand-lite purge of .link_arrow */
.pe_acctabs .acctabs_link_arrow {
	display: inline-block;
	margin-left: 5px;
	font: normal normal normal 1em/1 icomoon;
}
.pe_acctabs .acctabs_link_arrow:before { content: "\f27f"; }
/* the body rule sets font-size/color on every child - keep the link on brand */
.pe_acctabs .accordion-body .acctabs_item_link,
.pe_acctabs .accordion-body .acctabs_item_link * { color: var(--pe_blue); }
/* mobile: title, description and link first, image under them. Order-only, so the
   markup (and the desktop layout) is untouched. */
@media (max-width: 991px) {
	.pe_acctabs .accordion-item {
		display: flex;
		flex-direction: column;
	}
	.pe_acctabs .accordion-item > h3 { order: 1; }
	.pe_acctabs .accordion-item > .accordion-collapse { order: 2; }
	.pe_acctabs .accordion-item > img {
		order: 3;
		margin-top: 20px;
		margin-bottom: 0;
	}
}