.notes-hero { padding: 96px 0 62px; border-bottom: 1px solid var(--line); }
.notes-hero h1 { font: 500 clamp(3.8rem,8vw,7rem)/.92 var(--serif); letter-spacing: -.055em; margin: 20px 0 28px; }
.notes-grid { display: grid; grid-template-columns: repeat(3,1fr); gap: 14px; padding: 70px 0 110px; }
.note-card { border: 1px solid var(--ink); padding: 28px; min-height: 360px; display: flex; flex-direction: column; color: inherit; text-decoration: none; }
.note-card:nth-child(1) { background: #dff4ff; }
.note-card:nth-child(2) { background: #e8f5cf; }
.note-card:nth-child(3) { background: #fff0dc; }
.note-card:nth-child(4) { background: #f0e8ff; }
.note-card h2 { font: 500 2.5rem/1 var(--serif); letter-spacing: -.035em; margin: 42px 0 18px; }
.note-card p { color: var(--muted); }
.note-card b { margin-top: auto; }
.note-page { padding-bottom: 110px; }
.note-body { max-width: 780px; margin: 0 auto; font-size: 1.03rem; }
.note-body h2 { font: 500 2.6rem/1.05 var(--serif); letter-spacing: -.03em; margin: 2em 0 .55em; }
.note-body pre { overflow: auto; padding: 20px; background: #1c1d1b; color: #eef0e9; font-size: .83rem; }
.note-body table { width: 100%; border-collapse: collapse; margin: 28px 0; font-size: .9rem; }
.note-body th, .note-body td { border: 1px solid var(--line); padding: 12px; text-align: left; vertical-align: top; }
.note-body th { background: #e7e4dc; }
.note-callout { border-left: 5px solid var(--ink); background: white; padding: 20px 24px; margin: 30px 0; }
.note-status { color: var(--muted); font-size: .83rem; }
@media(max-width:760px) { .notes-grid { grid-template-columns: 1fr; } .note-card { min-height: 280px; } .notes-hero { padding-top: 64px; } .note-body { width: min(100% - 48px,780px); } }