/* DN-FAQ — accordion styles (namespaced).
   Mirrors the FAQ pattern from the design mockup, but only the
   question/answer rows; no eyebrow/subtitle. */

.dn-faq{
	--dn-faq-accent: #F18A2C;
	--dn-faq-accent-open: #E07A18;
	--dn-faq-ink: #143922;
	--dn-faq-ink-soft: #2E4E37;
	--dn-faq-divider: rgba(20,57,34,.08);
	--dn-faq-rule-w: 48px;
	--dn-faq-toggle-w: 34px;
	--dn-faq-gap: 1rem;

	display: grid;
	gap: 0;
	margin: 0;
	padding: 0;
	list-style: none;
}

.dn-faq-item{
	margin: 0;
	padding: 0;
}

.dn-faq-q{
	width: 100%;
	display: grid;
	grid-template-columns: 64px 1fr 40px;
	align-items: center;
	gap: var(--dn-faq-gap);
	padding: 1rem 0;
	text-align: left;
	color: var(--dn-faq-ink);
	font-weight: 500;
	font-size: 1rem;
	line-height: 1.4;
	background: none;
	border: 0;
	cursor: pointer;
	font: inherit;
}

.dn-faq-item + .dn-faq-item .dn-faq-q{
	border-top: 1px solid var(--dn-faq-divider);
}

.dn-faq-rule{
	display: inline-block;
	width: var(--dn-faq-rule-w);
	height: 2px;
	background: var(--dn-faq-accent);
	border-radius: 2px;
	justify-self: start;
}

.dn-faq-text{ display: block; }

.dn-faq-toggle{
	width: var(--dn-faq-toggle-w);
	height: var(--dn-faq-toggle-w);
	border-radius: 0px 8px;
	background: var(--dn-faq-accent);
	position: relative;
	display: inline-block;
	flex: 0 0 auto;
	justify-self: end;
	transition: background .2s ease, transform .2s ease;
}
.dn-faq-toggle::before,
.dn-faq-toggle::after{
	content: "";
	position: absolute;
	left: 50%;
	top: 50%;
	background: #fff;
	border-radius: 1px;
	transform: translate(-50%, -50%);
}
.dn-faq-toggle::before{ width: 14px; height: 2px; }
.dn-faq-toggle::after{
	width: 2px;
	height: 14px;
	transition: transform .25s ease;
}
.dn-faq-item.is-open .dn-faq-toggle{ background: var(--dn-faq-accent-open); }
.dn-faq-item.is-open .dn-faq-toggle::after{ transform: translate(-50%, -50%) scaleY(0); }
.dn-faq-q:hover .dn-faq-toggle{ transform: scale(1.06); }

.dn-faq-a{
	display: grid;
	grid-template-rows: 0fr;
	transition: grid-template-rows .3s ease;
}
.dn-faq-a > p{
	overflow: hidden;
	margin: 0;
	color: var(--dn-faq-ink-soft);
	font-size: .92rem;
	line-height: 1.6;
	padding-left: calc(64px + var(--dn-faq-gap));
	padding-right: calc(40px + var(--dn-faq-gap));
}
.dn-faq-item.is-open .dn-faq-a{ grid-template-rows: 1fr; }
.dn-faq-item.is-open .dn-faq-a > p{ padding-bottom: 1rem; }

/* Small screens: tighten the rule + toggle so text gets more room. */
@media (max-width: 720px){
	.dn-faq-q{ grid-template-columns: 36px 1fr 32px; gap: .75rem; }
	.dn-faq-rule{ width: 24px; }
	.dn-faq-toggle{ width: 30px; height: 30px; }
	.dn-faq-a > p{
		padding-left: calc(36px + .75rem);
		padding-right: 0;
	}
}
