/* Brand DNA Report page presentation.
   Shared page header, question header, question intro, question card, and
   Ask MAI rules migrated to marby-forms-public.css on 2026-08-09.
   The former page-level rules are retained as comments for reference so they
   cannot override the shared Forms components.

.frm-brand-dna-report-page {
	width: calc(100vw - (2 * var(--marby-page-gutter)));
	max-width: none;
	margin: 0;
}

.frm-brand-dna-report-header {
	margin-bottom: 26px;
}

.frm-brand-dna-report-header > div {
	max-width: 980px;
}

.frm-brand-dna-report-header h1 {
	margin: 18px 0 10px;
	font-size: clamp(42px, 5vw, 68px);
	line-height: 1;
	letter-spacing: -0.035em;
}

.frm-brand-dna-report-header p {
	max-width: 900px;
	margin: 0;
	color: var(--marby-color-marby-blue);
	font-size: clamp(20px, 2.1vw, 30px);
	line-height: 1.2;
}

.frm-brand-dna-report-page .marby-form,
.frm-brand-dna-report-page .marby-question {
	margin: 0;
	padding: 0;
	border: 0;
	border-radius: 0;
	background: transparent;
}

.frm-brand-dna-report-page .marby-q-header[hidden],
.frm-brand-dna-report-page .frm-response-source[hidden] {
	display: none !important;
}

.frm-brand-dna-report-question {
	min-width: 0;
}

.frm-brand-dna-report-create {
	margin-bottom: 22px;
	border: 1px solid var(--marby-color-border-light);
	background: var(--marby-color-light-tan);
	box-shadow: var(--marby-shadow-soft);
}

.frm-brand-dna-report-create-main {
	display: grid;
	grid-template-columns: 54px minmax(0, 1fr) minmax(320px, 0.72fr);
	gap: 20px;
	align-items: center;
	padding: 28px;
}

.frm-brand-dna-report-create-icon {
	display: grid;
	width: 50px;
	height: 50px;
	place-items: center;
	border-radius: 50%;
	background: var(--marby-color-marby-blue);
	color: var(--marby-color-white);
	font-size: 21px;
	font-weight: 700;
}

.frm-brand-dna-report-create h2 {
	margin: 0 0 8px;
	font-size: 26px;
}

.frm-brand-dna-report-create p {
	margin: 0;
}

.frm-brand-dna-report-create .marby-inputs,
.frm-brand-dna-report-create .marby-input-row {
	margin: 0;
	padding: 0;
}

.frm-brand-dna-report-create .marby-input-label {
	display: block;
	margin-bottom: 8px;
	font-size: 14px;
	font-weight: 500;
}

.frm-brand-dna-report-create .marby-inputs textarea,
.frm-brand-dna-report-create .marby-inputs input {
	width: 100%;
	color: var(--marby-color-marby-blue) !important;
}

.frm-brand-dna-report-page .marby-ai-actions {
	display: grid;
	grid-template-columns: minmax(0, 1fr) auto auto;
	gap: 8px 18px;
	align-items: center;
	margin: 0;
	padding: 24px 28px;
	border-top: 1px solid var(--marby-color-border-light);
	background: var(--marby-color-soft-blue);
}

.frm-brand-dna-report-page .marby-ai-actions h3 {
	margin: 0 0 5px;
	font-size: 22px;
}

body .frm-brand-dna-report-page .ask-mai-btn {
	border-color: var(--marby-color-marby-blue) !important;
	background: var(--marby-color-marby-blue) !important;
	color: var(--marby-color-white) !important;
}

body .frm-brand-dna-report-page .ask-mai-btn:hover,
body .frm-brand-dna-report-page .ask-mai-btn:focus-visible {
	border-color: var(--marby-color-marby-blue) !important;
	background: var(--marby-color-white) !important;
	color: var(--marby-color-marby-blue) !important;
}
*/

/* Shared migration 2026-08-09: the report review section now takes its
   response-column width and review intro from marby-forms-public.css.
.frm-brand-dna-report-page .marby-ai-editor-wrap {
	margin: 0;
	padding: 0;
}
*/

/* Shared migration 2026-08-09: report response cards, ordered lists,
   double-order-lists, palette display, and save treatment now live in
   marby-forms-public.css. Retained below as reference only.
.frm-brand-dna-report-output {
	display: grid;
	gap: 18px;
}

.frm-brand-dna-report-card {
	min-width: 0;
	border: 1px solid var(--marby-color-border-light);
	background: var(--marby-color-white);
	box-shadow: var(--marby-shadow-soft);
}

.frm-brand-dna-report-section-heading {
	display: flex;
	gap: 12px;
	align-items: center;
	padding: 20px 22px;
	border-bottom: 1px solid var(--marby-color-border-light);
}

.frm-brand-dna-report-section-heading > span,
.frm-brand-dna-report-promotion > span {
	display: grid;
	width: 34px;
	height: 34px;
	flex: 0 0 34px;
	place-items: center;
	border-radius: 50%;
	background: var(--marby-color-marby-blue);
	color: var(--marby-color-white);
	font-size: 14px;
	font-weight: 700;
}

.frm-brand-dna-report-section-heading h2 {
	margin: 0;
	font-size: 24px;
	line-height: 1.2;
}

.frm-brand-dna-report-card-body {
	padding: 22px;
}

.frm-brand-dna-report-columns,
.frm-brand-dna-report-feature-grid,
.frm-brand-dna-report-foundation-grid,
.frm-brand-dna-report-two-column,
.frm-brand-dna-report-analysis-grid,
.frm-brand-dna-report-channel-grid,
.frm-brand-dna-report-priority-grid {
	display: grid;
	gap: 16px;
}

.frm-brand-dna-report-columns.three,
.frm-brand-dna-report-priority-grid,
.frm-brand-dna-report-channel-grid {
	grid-template-columns: repeat(3, minmax(0, 1fr));
}

.frm-brand-dna-report-columns.two,
.frm-brand-dna-report-two-column,
.frm-brand-dna-report-analysis-grid {
	grid-template-columns: repeat(2, minmax(0, 1fr));
}

.frm-brand-dna-report-feature-grid {
	grid-template-columns: repeat(2, minmax(0, 1fr));
}

.frm-brand-dna-report-foundation-grid {
	grid-template-columns: repeat(3, minmax(0, 1fr));
	align-items: stretch;
}

.frm-brand-dna-report-foundation-first {
	display: grid;
	min-width: 0;
	gap: 16px;
}

.frm-brand-dna-report-foundation-grid > .frm-brand-dna-report-card {
	height: 100%;
}

.frm-brand-dna-report-feature-grid .frm-brand-dna-report-card:nth-child(even),
.frm-brand-dna-report-competitor:nth-child(even),
.frm-brand-dna-report-channel:nth-child(even),
.frm-brand-dna-report-priority-grid
	.frm-brand-dna-report-field:nth-child(even) {
	background: var(--marby-color-light-tan);
}

.frm-brand-dna-report-field {
	min-width: 0;
}

.frm-brand-dna-report-field + .frm-brand-dna-report-field {
	margin-top: 14px;
}

.frm-brand-dna-report-columns
	> .frm-brand-dna-report-field
	+ .frm-brand-dna-report-field,
.frm-brand-dna-report-priority-grid
	> .frm-brand-dna-report-field
	+ .frm-brand-dna-report-field {
	margin-top: 0;
}

.frm-brand-dna-report-field h3 {
	margin: 0 0 7px;
	font-size: 16px;
	font-weight: 700;
	line-height: 1.3;
}

.frm-brand-dna-report-columns.three > .frm-brand-dna-report-field {
	padding: 0 18px;
	border-right: 1px solid var(--marby-color-border-light);
}

.frm-brand-dna-report-columns.three > .frm-brand-dna-report-field:first-child {
	padding-left: 0;
}

.frm-brand-dna-report-columns.three > .frm-brand-dna-report-field:last-child {
	padding-right: 0;
	border-right: 0;
}

.frm-brand-dna-report-field.is-tagline .frm-brand-dna-report-textarea {
	color: var(--marby-color-marby-blue);
	font-size: 28px !important;
	font-weight: 500;
	line-height: 1.3;
}

.frm-brand-dna-report-field.is-meta h3 {
	color: var(--marby-color-marby-blue);
	font-size: 11px;
	font-weight: 700;
	letter-spacing: 0.08em;
	text-transform: uppercase;
}

.frm-brand-dna-report-name {
	margin: 0 0 14px;
	font-size: 20px;
	line-height: 1.3;
}

.frm-brand-dna-report-textarea {
	box-sizing: border-box;
	display: block;
	width: 100%;
	min-width: 0;
	padding: 10px 12px;
	overflow: hidden;
	border: 1px solid transparent;
	border-radius: var(--marby-radius-xs);
	background: transparent;
	color: var(--marby-color-text);
	font: inherit;
	line-height: 1.55;
	resize: none;
}

.frm-brand-dna-report-textarea:hover {
	border-color: var(--marby-color-border-light);
}

.frm-brand-dna-report-textarea:focus {
	border-color: var(--marby-color-marby-blue);
	outline: 0;
	background: var(--marby-color-white);
	box-shadow: 0 0 0 3px rgba(112, 170, 221, 0.14);
	resize: vertical;
}

.frm-brand-dna-report-pain-grid {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
	gap: 0;
}

.frm-brand-dna-report-pain {
	min-width: 0;
	padding: 0 15px;
	border-right: 1px solid var(--marby-color-border-light);
}

.frm-brand-dna-report-pain:first-child {
	padding-left: 0;
}

.frm-brand-dna-report-pain:last-child {
	padding-right: 0;
	border-right: 0;
}

.frm-brand-dna-report-pain > span,
.frm-brand-dna-report-list-row > span {
	display: grid;
	width: 30px;
	height: 30px;
	place-items: center;
	margin-bottom: 10px;
	border: 1px solid var(--marby-color-marby-blue);
	border-radius: 50%;
	color: var(--marby-color-marby-blue);
	font-weight: 700;
}

.frm-brand-dna-report-list-row {
	display: grid;
	grid-template-columns: 30px minmax(0, 1fr);
	gap: 12px;
	padding: 14px;
	border: 1px solid var(--marby-color-border-light);
}

.frm-brand-dna-report-differentiators,
.frm-brand-dna-report-competitors {
	display: grid;
	grid-template-columns: 1fr;
	gap: 14px;
}

.frm-brand-dna-report-differentiators .frm-brand-dna-report-list-row > div {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 16px;
}

.frm-brand-dna-report-differentiators
	.frm-brand-dna-report-field
	+ .frm-brand-dna-report-field {
	margin-top: 0;
}

.frm-brand-dna-report-list-row > span {
	margin: 2px 0 0;
}

.frm-brand-dna-report-competitor,
.frm-brand-dna-report-channel {
	min-width: 0;
	padding: 18px;
	border: 1px solid var(--marby-color-border-light);
	background: var(--marby-color-white);
}

.frm-brand-dna-report-opportunities {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: 14px;
}

.frm-brand-dna-report-opportunity {
	display: grid;
	grid-template-columns: 26px minmax(0, 1fr);
	gap: 10px;
	align-items: start;
	padding: 14px;
	border: 1px solid var(--marby-color-border-light);
}

.frm-brand-dna-report-opportunity > span {
	color: var(--marby-color-marby-blue);
	font-size: 22px;
	line-height: 1.3;
}

.frm-brand-dna-report-promotion {
	display: grid;
	grid-template-columns: 34px minmax(0, 1fr);
	gap: 14px;
	padding: 15px 0;
	border-bottom: 1px solid var(--marby-color-border-light);
}

.frm-brand-dna-report-promotion:last-child {
	border-bottom: 0;
}

.frm-brand-dna-report-priority-grid .frm-brand-dna-report-field {
	padding: 18px;
	border-left: 4px solid var(--marby-color-marby-blue);
	background: var(--marby-color-light-tan);
}

.frm-brand-dna-report-card.is-brand-style .marby-colour-palette-panel {
	margin: 0;
	padding: 18px;
	border: 1px solid var(--marby-color-border-light);
	background: var(--marby-color-white);
	border-radius: 0% !important;
}

.frm-brand-dna-report-card.is-brand-style .frm-brand-dna-report-card-body {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: 16px;
}

.frm-brand-dna-report-style-column {
	min-width: 0;
	padding: 18px;
	border: 1px solid var(--marby-color-border-light);
}

.frm-brand-dna-report-card.is-brand-style .marby-colour-palette-title {
	margin: 0 0 14px;
	font-size: 18px;
}

.frm-brand-dna-report-card.is-brand-style .marby-colour-palette-list {
	display: grid;
	grid-template-columns: 1fr;
	gap: 12px;
}

.frm-brand-dna-report-card.is-brand-style .marby-colour-palette-row {
	display: grid;
	grid-template-columns: 66px minmax(0, 1fr);
	gap: 5px 10px;
	align-items: center;
	padding: 10px;
	border: 1px solid var(--marby-color-border-light);
}

.frm-brand-dna-report-card.is-brand-style .marby-colour-swatch {
	width: 150px;
	height: 50px;
	border: 1px solid rgba(0, 0, 0, 0.08);
	border-radius: 0% !important;
}

.frm-brand-dna-report-card.is-brand-style .marby-colour-palette-label {
	grid-column: 1 / -1;
	color: var(--marby-color-marby-blue);
	font-size: 11px;
	font-weight: 700;
	letter-spacing: 0.08em;
	text-transform: uppercase;
}

.frm-brand-dna-report-visual-list p {
	margin: 0 0 9px;
	line-height: 1.5;
}

.frm-brand-dna-report-visual-list p:last-child {
	margin-bottom: 0;
}

.frm-brand-dna-report-visual-list strong {
	font-weight: 700;
}

.frm-brand-dna-report-promotions {
	display: grid;
	grid-template-columns: repeat(4, minmax(0, 1fr));
	gap: 14px;
}

.frm-brand-dna-report-promotions .frm-brand-dna-report-promotion {
	display: block;
	padding: 18px;
	border: 1px solid var(--marby-color-border-light);
	background: var(--marby-color-white);
}

.frm-brand-dna-report-promotions
	.frm-brand-dna-report-promotion:nth-child(even) {
	background: var(--marby-color-light-tan);
}

.frm-brand-dna-report-promotions .frm-brand-dna-report-promotion > span {
	margin-bottom: 14px;
}

.frm-brand-dna-report-card.is-brand-style .marby-colour-palette-value {
	font-size: 18px;
}

.frm-brand-dna-report-page .marby-save-actions {
	margin-top: 20px;
	padding: 24px 28px;
	background: var(--marby-color-marby-blue);
	color: var(--marby-color-white);
}

.frm-brand-dna-report-page .marby-save-actions h3,
.frm-brand-dna-report-page .marby-save-actions p {
	margin: 0;
	color: var(--marby-color-white) !important;
}

.frm-brand-dna-report-page .marby-save-actions h3 {
	margin-bottom: 4px;
}

body .frm-brand-dna-report-page .save-mai-btn {
	border-color: var(--marby-color-marby-blue) !important;
	background: var(--marby-color-white) !important;
	color: var(--marby-color-marby-blue) !important;
}

body .frm-brand-dna-report-page .save-mai-btn:hover,
body .frm-brand-dna-report-page .save-mai-btn:focus-visible {
	border-color: var(--marby-color-white) !important;
	background: var(--marby-color-marby-blue) !important;
	color: var(--marby-color-white) !important;
}
*/

/* Shared migration 2026-08-09: the three pitch tools now use the shared Forms
   header, intro, question card, Ask MAI, response-card, and save components.
   Retained below as reference only. The three pitch tools repeat the report
   question structure.
.frm-brand-dna-pitch-question {
	margin-top: 22px !important;
	border: 1px solid var(--marby-color-border-light);
	background: transparent;
	box-shadow: var(--marby-shadow-soft);
}

.frm-brand-dna-pitch-create {
	background: var(--marby-color-light-tan);
}

.frm-brand-dna-pitch-create-main {
	display: grid;
	grid-template-columns: 54px minmax(0, 1fr) minmax(320px, 0.72fr);
	gap: 20px;
	align-items: center;
	padding: 28px;
}

.frm-brand-dna-pitch-create-main h2 {
	margin: 0 0 8px;
	font-size: 26px;
}

.frm-brand-dna-pitch-create-main p,
.frm-brand-dna-pitch-create .marby-inputs,
.frm-brand-dna-pitch-create .marby-input-row {
	margin: 0;
}

.frm-brand-dna-pitch-create .marby-input-label {
	display: block;
	margin-bottom: 8px;
	font-size: 14px;
	font-weight: 500;
}

.frm-brand-dna-pitch-create .marby-inputs textarea,
.frm-brand-dna-pitch-create .marby-inputs input {
	width: 100%;
	color: var(--marby-color-marby-blue) !important;
}

.frm-brand-dna-pitch-response {
	padding: 22px 24px;
	border-top: 1px solid var(--marby-color-border-light);
	background: var(--marby-color-white);
}

.frm-brand-dna-pitch-response h3 {
	margin: 0 0 10px;
	font-size: 22px;
}

.frm-brand-dna-pitch-textarea {
	box-sizing: border-box;
	display: block;
	width: 100%;
	padding: 12px 14px;
	overflow: hidden;
	border: 1px solid transparent;
	border-radius: var(--marby-radius-xs);
	background: transparent;
	color: var(--marby-color-text);
	font: inherit;
	line-height: 1.55;
	resize: none;
}

.frm-brand-dna-pitch-textarea:hover {
	border-color: var(--marby-color-border-light);
}

.frm-brand-dna-pitch-textarea:focus {
	border-color: var(--marby-color-marby-blue);
	outline: 0;
	background: var(--marby-color-white);
	box-shadow: 0 0 0 3px rgba(112, 170, 221, 0.14);
}

.frm-brand-dna-pitch-question .marby-ai-editor-wrap {
	margin: 0;
	padding: 0;
}
*/

/* Shared migration 2026-08-09: responsive report response rules now live in
   marby-forms-public.css. The retained pitch-specific mobile rules follow.
@media (max-width: 1200px) {
	.frm-brand-dna-report-feature-grid,
	.frm-brand-dna-report-pain-grid {
		grid-template-columns: repeat(2, minmax(0, 1fr));
		gap: 16px;
	}

	.frm-brand-dna-report-pain {
		padding: 16px;
		border: 1px solid var(--marby-color-border-light);
	}

	.frm-brand-dna-report-competitors,
	.frm-brand-dna-report-opportunities,
	.frm-brand-dna-report-channel-grid {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}

	.frm-brand-dna-report-foundation-grid {
		grid-template-columns: 1fr 1fr;
	}

	.frm-brand-dna-report-foundation-first {
		grid-column: 1 / -1;
		grid-template-columns: 1fr 1fr;
	}

	.frm-brand-dna-report-promotions {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}
}

/* Shared migration 2026-08-09: these pitch-create mobile rules target the
   retired page-specific create layout. The shared question-card layout owns
   its responsive behavior in marby-forms-public.css.
@media (max-width: 820px) {
	.frm-brand-dna-report-create-main,
	.frm-brand-dna-pitch-create-main,
	.frm-brand-dna-report-columns.three,
	.frm-brand-dna-report-columns.two,
	.frm-brand-dna-report-two-column,
	.frm-brand-dna-report-analysis-grid,
	.frm-brand-dna-report-priority-grid {
		grid-template-columns: 1fr;
	}

	.frm-brand-dna-report-create-main {
		align-items: start;
	}

	.frm-brand-dna-report-create .marby-inputs {
		grid-column: 1 / -1;
	}

	.frm-brand-dna-report-columns.three > .frm-brand-dna-report-field {
		padding: 16px 0;
		border-right: 0;
		border-bottom: 1px solid var(--marby-color-border-light);
	}

	.frm-brand-dna-report-columns.three
		> .frm-brand-dna-report-field:first-child {
		padding-top: 0;
	}

	.frm-brand-dna-report-columns.three > .frm-brand-dna-report-field:last-child {
		padding-bottom: 0;
		border-bottom: 0;
	}

	.frm-brand-dna-report-card.is-brand-style .frm-brand-dna-report-card-body {
		grid-template-columns: 1fr;
	}

	.frm-brand-dna-report-card.is-brand-style .marby-colour-palette-list {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}
}

@media (max-width: 600px) {
	.frm-brand-dna-report-page {
		width: 100%;
	}

	.frm-brand-dna-report-create-main,
	.frm-brand-dna-report-page .marby-ai-actions,
	.frm-brand-dna-report-card-body,
	.frm-brand-dna-report-section-heading,
	.frm-brand-dna-report-page .marby-save-actions {
		padding: 18px;
	}

	.frm-brand-dna-report-feature-grid,
	.frm-brand-dna-report-foundation-grid,
	.frm-brand-dna-report-pain-grid,
	.frm-brand-dna-report-two-column,
	.frm-brand-dna-report-analysis-grid,
	.frm-brand-dna-report-competitors,
	.frm-brand-dna-report-opportunities,
	.frm-brand-dna-report-channel-grid {
		grid-template-columns: 1fr;
	}

	.frm-brand-dna-report-foundation-first,
	.frm-brand-dna-report-promotions {
		grid-template-columns: 1fr;
	}

	.frm-brand-dna-report-differentiators .frm-brand-dna-report-list-row > div {
		grid-template-columns: 1fr;
	}

	.frm-brand-dna-report-card.is-brand-style .marby-colour-palette-list {
		grid-template-columns: 1fr;
	}
}
*/
*/

@media (max-width: 820px) {
	.frm-brand-dna-pitch-create-main {
		grid-template-columns: 1fr;
	}
}

@media (max-width: 600px) {
	.frm-brand-dna-pitch-create-main {
		padding: 18px;
	}
}