* { box-sizing: border-box; margin: 0; padding: 0; }
body { font-family: system-ui, Segoe UI, Roboto, Arial, sans-serif; background: #f6f7fb; color: #222; }
header { background: #4f46e5; color: #fff; padding: 2.5rem 1.5rem; text-align: center; }
header h1 { font-size: 2rem; margin-bottom: .5rem; }
main { max-width: 1100px; margin: 2rem auto; padding: 0 1.5rem; display: grid; gap: 1.5rem; grid-template-columns: repeat(auto-fit, minmax(280px, 1fr)); }
.doc-section { background: #fff; border-radius: 10px; padding: 1.25rem; box-shadow: 0 2px 12px rgba(0,0,0,.06); }
.doc-section h2 { color: #4f46e5; margin-bottom: .5rem; }
.doc-section p { margin: .5rem 0 1rem; color: #555; }
.btn { display: inline-block; background: #4f46e5; color: #fff; text-decoration: none; padding: .6rem 1rem; border-radius: 6px; margin-right: .5rem; }
.btn:hover { background: #4338ca; }
.btn-secondary { background: #0ea5e9; }
.btn-secondary:hover { background: #0284c7; }
footer { text-align: center; padding: 2rem 1rem; color: #666; }