/* DD Marketing Assessment v1.0.5 */
.dd-ma {
	--dd-navy: #041A41;
	--dd-ink: #2B3648;
	--dd-muted: #5B667A;
	--dd-line: #E2E7EF;
	--dd-soft: #F6F8FB;
	--dd-mint-a: #57D5C9;
	--dd-mint-b: #36F092;
	--dd-scarlet: #EF3C2F;
	--dd-amber: #F5A524;
	font-family: "Mulish", sans-serif;
	color: var(--dd-ink);
	max-width: 880px;
	margin: 0 auto;
}
.dd-ma *, .dd-ma *::before, .dd-ma *::after { box-sizing: border-box; }
.dd-ma [hidden] { display: none !important; }

.dd-ma__card {
	background: #fff;
	border-radius: 18px;
	padding: 44px 48px;
	box-shadow: 0 24px 64px rgba(4, 26, 65, 0.12);
}

/* Progress */
.dd-ma__progress { margin-bottom: 28px; }
.dd-ma__progress-meta {
	display: flex; justify-content: space-between;
	font-size: 13px; font-weight: 800; letter-spacing: .4px; text-transform: uppercase;
	color: var(--dd-muted); margin-bottom: 10px;
}
.dd-ma__bar { height: 8px; background: var(--dd-soft); border-radius: 99px; overflow: hidden; }
.dd-ma__bar span {
	display: block; height: 100%; border-radius: 99px;
	background: linear-gradient(90deg, var(--dd-mint-a), var(--dd-mint-b));
	transition: width .35s ease;
}

/* Headings */
.dd-ma__eyebrow {
	display: inline-block; font-size: 13px; font-weight: 800; letter-spacing: .6px; text-transform: uppercase;
	background: linear-gradient(90deg, var(--dd-mint-a), var(--dd-mint-b));
	-webkit-background-clip: text; -webkit-text-fill-color: transparent;
	margin-bottom: 8px;
}
.dd-ma .dd-ma__title {
	font-family: "Mulish", sans-serif; font-size: 28px; line-height: 1.25; font-weight: 800;
	color: var(--dd-navy); margin: 0 0 10px;
}
.dd-ma .dd-ma__title--lg { font-size: 32px; }
.dd-ma p, .dd-ma li, .dd-ma button { font-family: "Mulish", sans-serif; }
.dd-ma__sub { font-weight: 400; font-size: 16px; line-height: 1.6; color: var(--dd-muted); margin: 0 0 26px; }
.dd-ma .dd-ma__h3 {
	font-family: "Mulish", sans-serif; font-size: 19px; font-weight: 800; color: var(--dd-navy);
	margin: 36px 0 14px;
}

/* Options */
.dd-ma__options { display: grid; gap: 12px; }
.dd-ma__options--grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.dd-ma .dd-ma__opt {
	display: flex; align-items: center; gap: 14px; width: 100%; text-align: left;
	background: #fff; border: 2px solid var(--dd-line); border-radius: 12px;
	padding: 16px 18px; cursor: pointer; color: var(--dd-ink);
	font-family: inherit; font-size: 16px; line-height: 1.4; text-transform: none; letter-spacing: 0;
	white-space: normal; min-width: 0; height: auto;
	transition: border-color .15s ease, background-color .15s ease, transform .15s ease;
}
.dd-ma .dd-ma__opt:hover { border-color: var(--dd-mint-a); background: #fff; color: var(--dd-ink); transform: translateY(-1px); }
.dd-ma .dd-ma__opt:focus-visible { outline: 3px solid var(--dd-mint-a); outline-offset: 2px; }
.dd-ma .dd-ma__opt.is-selected { border-color: var(--dd-mint-b); background: #F0FDF8; }
.dd-ma__opt-icon { font-size: 24px; line-height: 1; flex: 0 0 auto; }
.dd-ma__opt-text { display: flex; flex-direction: column; gap: 3px; }
.dd-ma__opt-label { font-weight: 800; color: var(--dd-navy); }
.dd-ma__opt-desc { font-size: 14px; color: var(--dd-muted); }
.dd-ma__options--grid .dd-ma__opt { flex-direction: column; justify-content: center; text-align: center; padding: 18px 12px; }

/* Flags */
.dd-ma__flag {
	margin: 18px 0 0; padding: 14px 16px 14px 18px; border-radius: 10px;
	font-size: 15px; line-height: 1.5; border-left: 4px solid;
}
.dd-ma__flag--critical { background: #FEF0EF; border-color: var(--dd-scarlet); color: #7A1A13; }
.dd-ma__flag--warning { background: #FFF7E8; border-color: var(--dd-amber); color: #6B4700; }
.dd-ma__flags { list-style: none; margin: 0; padding: 0; display: grid; gap: 10px; }
.dd-ma__flags .dd-ma__flag { margin: 0; }

/* Nav + buttons */
.dd-ma__nav { display: flex; justify-content: space-between; align-items: center; margin-top: 26px; min-height: 44px; }
.dd-ma .dd-ma__back, .dd-ma .dd-ma__restart {
	background: none; border: 0; padding: 8px 0; cursor: pointer;
	font-family: inherit; font-size: 14px; font-weight: 800; color: var(--dd-muted); text-transform: none;
}
.dd-ma .dd-ma__back:hover, .dd-ma .dd-ma__restart:hover { color: var(--dd-navy); background: none; }
.dd-ma .dd-ma__back--gate { margin-top: 14px; }
.dd-ma .dd-ma__next,
.dd-ma .dd-ma__btn,
.dd-ma .gform_wrapper .gform_footer input[type="submit"],
.dd-ma .gform_wrapper .gform_footer button {
	display: inline-block; border: 0; border-radius: 6px; cursor: pointer;
	background: linear-gradient(130deg, var(--dd-mint-a), var(--dd-mint-b));
	color: var(--dd-navy); font-family: "Mulish", sans-serif; font-size: 14px; font-weight: 800;
	letter-spacing: .4px; text-transform: uppercase; text-decoration: none;
	padding: 15px 32px; line-height: 1.2; transition: filter .15s ease, transform .15s ease;
}
.dd-ma .dd-ma__next:hover,
.dd-ma .dd-ma__btn:hover,
.dd-ma .gform_wrapper .gform_footer input[type="submit"]:hover { filter: brightness(1.05); transform: translateY(-1px); color: var(--dd-navy); }

/* Gate */
.dd-ma__gate-head { margin-bottom: 8px; }
.dd-ma .gform_wrapper .gform_footer { margin-top: 18px; padding: 0; }
.dd-ma .gform_wrapper .gform_footer input[type="submit"] { width: 100%; }

/* Results */
.dd-ma__scores { display: grid; gap: 16px; padding: 22px 24px; background: var(--dd-soft); border-radius: 14px; margin-bottom: 24px; }
.dd-ma__score-head { display: flex; justify-content: space-between; font-size: 15px; font-weight: 800; color: var(--dd-navy); margin-bottom: 8px; }
.dd-ma__score-head span:last-child { font-size: 13px; color: var(--dd-muted); font-weight: 700; }
.dd-ma__score .dd-ma__bar { background: #fff; height: 10px; }
.dd-ma__score:not(.is-primary) .dd-ma__bar span { background: #C9D3E3; }

.dd-ma__cards { display: grid; grid-template-columns: repeat(auto-fit, minmax(260px, 1fr)); gap: 16px; }
.dd-ma__panel { border: 2px solid var(--dd-line); border-radius: 14px; padding: 22px; }
.dd-ma__panel--primary { border-color: var(--dd-mint-b); background: #F0FDF8; }
.dd-ma__panel-tag { font-size: 12px; font-weight: 800; letter-spacing: .5px; text-transform: uppercase; color: var(--dd-muted); }
.dd-ma .dd-ma__panel h3 { font-family: "Mulish", sans-serif; font-size: 20px; font-weight: 800; color: var(--dd-navy); margin: 6px 0 8px; }
.dd-ma__panel p { font-size: 15px; line-height: 1.6; margin: 0; }

.dd-ma__bench { display: grid; grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)); gap: 12px; }
.dd-ma__bench div { background: var(--dd-soft); border-radius: 12px; padding: 16px 18px; display: flex; flex-direction: column; gap: 4px; }
.dd-ma__bench span { font-size: 13px; color: var(--dd-muted); font-weight: 700; }
.dd-ma__bench strong { font-size: 20px; color: var(--dd-navy); font-weight: 800; }
.dd-ma__note { font-size: 13px; color: var(--dd-muted); margin: 10px 0 0; }

.dd-ma__steps { margin: 0; padding: 0; list-style: none; counter-reset: ddma; display: grid; gap: 12px; }
.dd-ma__steps li {
	counter-increment: ddma; position: relative; padding: 4px 0 4px 46px; font-size: 16px; line-height: 1.55;
}
.dd-ma__steps li::before {
	content: counter(ddma); position: absolute; left: 0; top: 0;
	width: 32px; height: 32px; border-radius: 50%; display: grid; place-items: center;
	background: var(--dd-navy); color: #fff; font-size: 14px; font-weight: 800;
}

.dd-ma__cta { display: flex; flex-wrap: wrap; align-items: center; gap: 18px; margin-top: 34px; padding-top: 28px; border-top: 1px solid var(--dd-line); }

/* Mobile */
@media (max-width: 767px) {
	.dd-ma__card { padding: 28px 20px; border-radius: 14px; }
	.dd-ma .dd-ma__title { font-size: 23px; }
	.dd-ma .dd-ma__title--lg { font-size: 25px; }
	.dd-ma__options--grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
	.dd-ma .dd-ma__opt { padding: 14px; font-size: 15px; }
	.dd-ma__scores { padding: 18px; }
	.dd-ma__cta { flex-direction: column; align-items: stretch; text-align: center; }
}

/* TEMP: admin-only skip button */
.dd-ma .dd-ma__skip {
	display: block; margin-top: 10px; padding: 8px 12px; cursor: pointer;
	background: #FFF7E8; border: 1px dashed var(--dd-amber); border-radius: 6px;
	font-family: "Mulish", sans-serif; font-size: 13px; font-weight: 800; color: #6B4700; text-transform: none;
}