.dresium-docs-page { max-width: 900px; margin: 0; }
.dresium-docs-page * { box-sizing: border-box; }
.dresium-docs-header {
	background: linear-gradient(135deg, #7c3aed 0%, #4f46e5 100%);
	color: white; padding: 40px; border-radius: 12px;
	margin-bottom: 24px; margin-top: 24px;
}
.dresium-docs-header h1 { margin: 0 0 12px 0; font-size: 32px; font-weight: 700; color: white; }
.dresium-docs-header p { margin: 0; font-size: 16px; opacity: 0.9; line-height: 1.6; }
.dresium-docs-section {
	background: #fff; border: 1px solid #e5e7eb;
	border-radius: 8px; margin-bottom: 24px; overflow: hidden;
}
.dresium-docs-section-header { background: #f9fafb; padding: 20px 24px; border-bottom: 1px solid #e5e7eb; }
.dresium-docs-section-header h2 {
	margin: 0; font-size: 18px; font-weight: 600; color: #111827;
	display: flex; align-items: center; gap: 10px;
}
.dresium-docs-section-content { padding: 24px; }
.dresium-steps { counter-reset: step-counter; list-style: none; padding: 0; margin: 0; }
.dresium-steps li { position: relative; padding: 16px 0 16px 60px; border-bottom: 1px solid #f3f4f6; }
.dresium-steps li:last-child { border-bottom: none; }
.dresium-steps li::before {
	counter-increment: step-counter; content: counter(step-counter);
	position: absolute; left: 0; top: 16px; width: 36px; height: 36px;
	background: #7c3aed; color: white; border-radius: 50%;
	display: flex; align-items: center; justify-content: center;
	font-weight: 600; font-size: 14px;
}
.dresium-steps li strong { display: block; color: #111827; margin-bottom: 4px; }
.dresium-steps li span { color: #6b7280; font-size: 14px; line-height: 1.5; }
.dresium-benefits-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 16px; }
@media (max-width: 768px) { .dresium-benefits-grid { grid-template-columns: 1fr; } }
.dresium-benefit-card { background: #f9fafb; border: 1px solid #e5e7eb; border-radius: 8px; padding: 20px; }
.dresium-benefit-card .icon { font-size: 28px; margin-bottom: 12px; }
.dresium-benefit-card h3 { margin: 0 0 8px 0; font-size: 15px; font-weight: 600; color: #111827; }
.dresium-benefit-card p { margin: 0; font-size: 13px; color: #6b7280; line-height: 1.5; }
.dresium-benefit-card .stat {
	display: inline-block; background: #10b981; color: white;
	padding: 2px 8px; border-radius: 4px; font-size: 12px; font-weight: 600; margin-top: 10px;
}
.dresium-info-box {
	background: #eff6ff; border: 1px solid #bfdbfe; border-radius: 8px;
	padding: 16px 20px; display: flex; gap: 12px; align-items: flex-start;
}
.dresium-info-box.success { background: #ecfdf5; border-color: #a7f3d0; }
.dresium-info-box .icon { font-size: 20px; flex-shrink: 0; }
.dresium-info-box .content { flex: 1; }
.dresium-info-box .content strong { display: block; color: #111827; margin-bottom: 4px; }
.dresium-info-box .content p { margin: 0; font-size: 13px; color: #4b5563; line-height: 1.5; }
.dresium-docs-links { display: flex; gap: 12px; flex-wrap: wrap; margin-top: 16px; }
.dresium-docs-link {
	display: inline-flex; align-items: center; gap: 6px; padding: 10px 16px;
	background: #7c3aed; color: white; text-decoration: none;
	border-radius: 6px; font-size: 13px; font-weight: 500; transition: background 0.2s;
}
.dresium-docs-link:hover { background: #6d28d9; color: white; }
.dresium-docs-link.secondary { background: #f3f4f6; color: #374151; }
.dresium-docs-link.secondary:hover { background: #e5e7eb; color: #374151; }
.dresium-faq-item { padding: 16px 0; border-bottom: 1px solid #f3f4f6; }
.dresium-faq-item:last-child { border-bottom: none; }
.dresium-faq-item strong { display: block; color: #111827; margin-bottom: 8px; font-size: 14px; }
.dresium-faq-item p { margin: 0; color: #6b7280; font-size: 13px; line-height: 1.6; }