.accordion {
	padding-top: var(--section-padding-lg);
	padding-bottom: var(--section-padding-lg);
}
.accordion__intro {
	display: grid;
	grid-template-columns: repeat(12, 1fr);
	column-gap: var(--gap-md);
	margin-bottom: 50px !important;
}

.accordion dotlottie-player {
	margin-top: -30px;
	width: 130% !important;
}


.accordion__squiggle {
	grid-row: 1 / span 2;
	grid-column: 1 / span 2;
}

.accordion__squiggle .squiggle {
	width: 90%;
}
.accordion__heading {
	grid-column: 1  / -1;
}
.accordion__content {
	grid-column: 1 / -1;
}
.accordion__squiggle ~ .accordion__heading,
.accordion__squiggle ~ .accordion__content {
	grid-column-start: 3;
}
@media (min-width: 780px) {
	.accordion__squiggle {
		grid-row: 1 / span 1;
	}
	.accordion__heading {
		grid-row: 1;
		grid-column: 1  / span 4;
	}
	.accordion__content {
		grid-row: 1;
		grid-column: 5 / span 5;
	}
	.accordion__squiggle ~ .accordion__heading {
		grid-column-start: 3;
	}
	.accordion__squiggle ~ .accordion__content {
		grid-column-start: 7;
	}
}
.accordion__section {
	/*margin-top: var(--gap-md);*/
	margin-top: 10px;
	padding: 3rem;
	overflow: hidden;
}

.accordion__toggle {
	display: block;
	position: relative;
	width: calc(100% + 4rem);
	text-align: left;
    overflow: visible;
	margin: -2rem;
	padding: 2rem;
	
	background-color: rgba(255, 255, 255, 0);
	transition: background-color .1s linear;
}
.accordion__toggle:after {
	--btn-rotate: 0deg;
	--btn-scale: 1;
	display: block;
	content: '';
	position: absolute;
	right: 25px;
	top: 15px;
	width: 70px;
	height: 70px;
	background-color: var(--color-blaa);
	background-image: 
		linear-gradient(#fff, #fff), 
		linear-gradient(#fff, #fff);
	background-size: 
		40% 2px,
		2px 40%;
	background-repeat: no-repeat;
	background-position: 50% 50%;
	color: white;
	border-radius: 45px;
	transform: scale(var(--btn-scale)) rotate(var(--btn-rotate));
	transition: transform .1s linear;
}
.accordion__toggle[aria-expanded='true']:after {
	--btn-rotate: 45deg;
}


.accordion__toggle:focus,
.accordion__toggle:active,
.accordion__toggle:hover {
	/*background-color: rgba(255,255,255,.3);*/
}

.accordion__toggle:focus:after,
.accordion__toggle:active:after,
.accordion__toggle:hover:after {
	--btn-scale: 1.1;
}

.accordion__columns {
	display: grid;
	grid-template-columns: 1fr;
	gap: 1rem;
	margin-top: 2rem;
}

.accordion__panel[aria-expanded='false'] {
	display: none;
}

.accordion h6 {
	font-weight: 900 !important;
	font-size: 20px;
}

.accordion p {
	font-size: clamp(13px,1.4vw, 16px);
	line-height: 160%;
	font-weight: 500;
}

.accordion__intro p {
	margin-top: 5px;
}


@media (min-width: 601px) {
	.accordion__columns[data-columns='2'],
	.accordion__columns[data-columns='4'] {
		gap: 2rem;
		grid-template-columns: repeat(2, 1fr);
	}
}

@media (min-width: 780px) {
	.accordion__columns[data-columns='3'] {
		gap: 2rem;
		grid-template-columns: repeat(3, 1fr);
	}	
}

@media (min-width: 940px) {
	.accordion__columns[data-columns='2'],
	.accordion__columns[data-columns='4'] {
		grid-template-columns: repeat(4, 1fr);
	}
}

@media (max-width: 768px) {
	.accordion__section {
		margin-top: 15px;
	}
	
	.accordion__intro {
		display: grid;
		grid-template-columns: repeat(1, 1fr);
		column-gap: var(--gap-md);
		margin-bottom: 50px !important;
	}
	
	.accordion__squiggle {
		grid-row: 1;
		grid-column: 1 / span 1;
		width: 40%;
		margin-right: 0px !important;
		justify-self: end;
		margin-bottom: -30px;
	}
	
	.accordion__heading {
		grid-column: 1 / span 1 !important;
		grid-row: 2 !important;
	}
	
	.accordion__content {
		grid-column: 1 / span 1 !important;
	}
	
	.accordion__section {
		margin-top: 10px;
		padding: 1rem;
		overflow: hidden;
	}
	
	.accordion__toggle::after {
		right: 28px;
		top: 28px;
		width: 35px;
		height: 35px;
	}
	
	.accordion .global-round-corners {
		border-radius: 30px !important;
	}
}