/*
 * Dealsmaster ten-guide editorial layer
 * Batch: DM-ART-20260730-TEN-GUIDES-01
 * Version: 1.0.0
 */

.dm10-guide {
	--dm10-accent: #9b4f38;
	--dm10-accent-soft: #ead2c5;
	--dm10-ink: #1f2924;
	--dm10-muted: #665f56;
	--dm10-paper: #fffaf1;
	--dm10-panel: #f4eadb;
	--dm10-rule: rgba(71, 61, 49, 0.22);
}

.dm10-guide.dm10-atmosphere--air {
	--dm10-accent: #657d73;
	--dm10-accent-soft: #dce5df;
	--dm10-panel: #edf0e8;
}

.dm10-guide.dm10-atmosphere--gallery {
	--dm10-accent: #9b4f38;
	--dm10-accent-soft: #efd3c4;
	--dm10-panel: #f8eadb;
}

.dm10-guide.dm10-atmosphere--rhythm {
	--dm10-accent: #316c66;
	--dm10-accent-soft: #cde2dc;
	--dm10-panel: #e8efe9;
}

.dm10-guide.dm10-atmosphere--glow {
	--dm10-accent: #a96826;
	--dm10-accent-soft: #f1d9a7;
	--dm10-panel: #faedd2;
}

.dm10-guide.dm10-atmosphere--studio {
	--dm10-accent: #3f5e6a;
	--dm10-accent-soft: #cbd9dc;
	--dm10-panel: #e7edef;
}

.dm10-guide.dm10-atmosphere--retreat {
	--dm10-accent: #574c72;
	--dm10-accent-soft: #d9d0e6;
	--dm10-panel: #ede8f2;
}

.dm10-guide.dm10-atmosphere--outdoors {
	--dm10-accent: #536b3e;
	--dm10-accent-soft: #d4dfc7;
	--dm10-panel: #edf1e6;
}

.dm10-guide .entry-content {
	overflow-wrap: anywhere;
}

.dm10-guide .entry-content > :is(p, ul, ol),
.dm10-guide .entry-content > article > :is(p, ul, ol) {
	font-size: clamp(1.05rem, 0.99rem + 0.24vw, 1.2rem);
	line-height: 1.72;
}

.dm10-guide .entry-content > h2,
.dm10-guide .entry-content > article > h2 {
	margin-top: clamp(3.8rem, 9vw, 7.5rem);
	text-wrap: balance;
}

.dm10-guide .entry-content > h3,
.dm10-guide .entry-content > article > h3 {
	margin-top: 2.4rem;
	text-wrap: balance;
}

.dm10-opening,
.dm10-tool,
.dm10-worksheet,
.dm10-comparison,
.dm10-map,
.dm10-sequence,
.dm10-ledger,
.dm10-lab,
.dm10-callout,
.dm10-checklist,
.dm10-safety,
.dm10-sources,
.dm10-production-note {
	box-sizing: border-box;
	width: min(100%, 920px);
	margin: clamp(2.2rem, 6vw, 5rem) auto;
}

.dm10-opening {
	position: relative;
	padding: clamp(1.5rem, 4vw, 3.2rem);
	overflow: hidden;
	border: 1px solid var(--dm10-rule);
	border-radius: clamp(1rem, 2.2vw, 2rem);
	background:
		radial-gradient(circle at 90% 10%, var(--dm10-accent-soft), transparent 38%),
		linear-gradient(145deg, var(--dm10-paper), var(--dm10-panel));
	box-shadow: 0 1.2rem 3.2rem rgba(42, 34, 25, 0.08);
}

.dm10-opening::before {
	position: absolute;
	inset: 0 auto 0 0;
	width: 0.35rem;
	content: "";
	background: var(--dm10-accent);
}

.dm10-opening :is(h2, h3) {
	max-width: 18ch;
	margin-block: 0.4rem 1rem;
	color: var(--dm10-ink);
	font-size: clamp(2rem, 5vw, 4rem);
	line-height: 0.98;
}

.dm10-eyebrow,
.dm10-kicker {
	margin: 0 0 0.75rem;
	color: var(--dm10-accent);
	font-size: 0.76rem;
	font-weight: 800;
	letter-spacing: 0.14em;
	text-transform: uppercase;
}

.dm10-tool,
.dm10-worksheet,
.dm10-comparison,
.dm10-map,
.dm10-sequence,
.dm10-ledger,
.dm10-lab {
	padding: clamp(1.25rem, 3.6vw, 2.6rem);
	overflow-x: auto;
	border: 1px solid var(--dm10-rule);
	border-radius: 1rem;
	background: var(--dm10-paper);
	box-shadow: 0 0.8rem 2.5rem rgba(41, 36, 30, 0.055);
}

.dm10-tool > :first-child,
.dm10-worksheet > :first-child,
.dm10-comparison > :first-child,
.dm10-map > :first-child,
.dm10-sequence > :first-child,
.dm10-ledger > :first-child,
.dm10-lab > :first-child {
	margin-top: 0;
}

.dm10-grid,
.dm10-columns,
.dm10-cards,
.dm10-steps,
.dm10-zones,
.dm10-phases {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(min(100%, 12rem), 1fr));
	gap: 1rem;
	padding: 0;
	list-style: none;
}

.dm10-grid > *,
.dm10-columns > *,
.dm10-cards > *,
.dm10-steps > *,
.dm10-zones > *,
.dm10-phases > * {
	min-width: 0;
	padding: 1rem;
	border-top: 0.24rem solid var(--dm10-accent);
	background: color-mix(in srgb, var(--dm10-panel) 72%, white);
}

.dm10-table-scroll {
	width: 100%;
	max-width: 100%;
	overflow-x: auto;
	overscroll-behavior-inline: contain;
	-webkit-overflow-scrolling: touch;
}

.dm10-table-scroll:focus-visible {
	outline: 0.18rem solid var(--dm10-accent);
	outline-offset: 0.22rem;
}

.dm10-guide table {
	width: max(100%, 38rem);
	border-spacing: 0;
	border-collapse: collapse;
}

.dm10-guide :is(th, td) {
	padding: 0.8rem;
	border-bottom: 1px solid var(--dm10-rule);
	text-align: left;
	vertical-align: top;
}

.dm10-guide th {
	color: var(--dm10-ink);
	background: var(--dm10-panel);
}

.dm10-guide caption {
	padding: 0 0 0.7rem;
	color: var(--dm10-ink);
	font-weight: 800;
	text-align: left;
}

.dm10-callout,
.dm10-checklist,
.dm10-safety {
	padding: clamp(1.2rem, 3vw, 2rem);
	border-left: 0.38rem solid var(--dm10-accent);
	background: var(--dm10-panel);
}

.dm10-safety {
	--dm10-accent: #974635;
}

.dm10-checklist :is(ul, ol) {
	margin-bottom: 0;
}

.dm10-photo {
	width: min(100%, 980px);
	margin: clamp(2.8rem, 7vw, 6rem) auto;
}

.dm10-photo__image {
	display: block;
	width: 100%;
	height: auto;
	max-height: none;
	object-fit: contain;
	border-radius: clamp(0.7rem, 1.8vw, 1.4rem);
	box-shadow: 0 1.1rem 3rem rgba(35, 29, 22, 0.11);
}

.dm10-photo--detail-2 {
	width: min(100%, 760px);
}

.dm10-photo figcaption {
	max-width: 62ch;
	margin: 0.75rem 0 0;
	color: var(--dm10-muted);
	font-size: 0.92rem;
	line-height: 1.5;
}

.dm10-sources {
	padding-top: 1.4rem;
	border-top: 1px solid var(--dm10-rule);
}

.dm10-sources li + li {
	margin-top: 0.75rem;
}

.dm10-production-note {
	padding: 1rem 1.2rem;
	border: 1px solid var(--dm10-rule);
	border-radius: 0.7rem;
	background: color-mix(in srgb, var(--dm10-panel) 65%, white);
}

.dm10-production-note summary {
	min-height: 2.75rem;
	cursor: pointer;
	font-weight: 800;
}

.dm10-production-note p {
	color: var(--dm10-muted);
}

@media (max-width: 720px) {
	.dm10-guide .entry-content > h2,
	.dm10-guide .entry-content > article > h2 {
		margin-top: 4.2rem;
		font-size: clamp(2rem, 11vw, 3.4rem);
		line-height: 1;
	}

	.dm10-opening,
	.dm10-tool,
	.dm10-worksheet,
	.dm10-comparison,
	.dm10-map,
	.dm10-sequence,
	.dm10-ledger,
	.dm10-lab,
	.dm10-callout,
	.dm10-checklist,
	.dm10-safety,
	.dm10-sources,
	.dm10-production-note {
		width: 100%;
		margin-block: 2.4rem;
	}

	.dm10-guide table {
		width: max(100%, 34rem);
	}

	.dm10-photo {
		width: 100%;
		margin-block: 3rem;
	}

	.dm10-photo--detail-2 {
		width: min(100%, 30rem);
	}
}

@media (prefers-reduced-motion: no-preference) {
	.dm10-motion-ready .dm10-guide .dm10-reveal {
		opacity: 0;
		transform: translateY(1rem);
		transition:
			opacity 520ms cubic-bezier(0.22, 1, 0.36, 1),
			transform 620ms cubic-bezier(0.22, 1, 0.36, 1);
		transition-delay: calc(var(--dm10-reveal-order, 0) * 45ms);
	}

	.dm10-motion-ready .dm10-guide .dm10-reveal.dm10-is-visible {
		opacity: 1;
		transform: none;
	}

	.dm10-guide .dm10-photo__image {
		transition: filter 220ms ease, transform 220ms ease;
	}

	.dm10-guide .dm10-photo:hover .dm10-photo__image {
		transform: translateY(-0.18rem);
		filter: saturate(1.035);
	}
}