:root { color-scheme: light; font: 1rem/1.55 system-ui, sans-serif; color: #182e29; background: #f6f2eb; }
* { box-sizing: border-box; }
body { margin: 0; }
main { width: min(65rem, 100% - 2rem); margin: auto; padding: clamp(1rem, 5vw, 3rem) 0; }
header, section { padding: clamp(1rem, 4vw, 2rem); margin-bottom: 1rem; border: 1px solid #d9dfd7; border-radius: 1.25rem; background: #fffdfa; }
header { background: #dceee6; }
h1, h2, h3, p { margin: 0; }
h1 { font-size: clamp(1.9rem, 6vw, 3.5rem); line-height: 1.15; }
h1 + p, h2 + p, h3 + p { margin-top: .55rem; }
.button { display: inline-flex; min-height: 48px; align-items: center; margin-top: 1rem; padding: .5rem 1rem; color: #fff; background: #245c50; border-radius: .85rem; font-weight: 650; }
.button:focus-visible { outline: 3px solid #7656b0; outline-offset: 3px; }
.cards { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 16rem), 1fr)); gap: .8rem; margin-top: .85rem; }
article { padding: 1rem; background: #f6f2eb; border-radius: .9rem; }