:root { --pink:#FF8FB1; --cream:#FFF3DC; --cocoa:#6B3E26; --navy:#2D3A6B; --butter:#FFD85A; }
* { box-sizing:border-box }
body { margin:0; font:16px/1.65 -apple-system,BlinkMacSystemFont,"Segoe UI",system-ui,sans-serif; color:var(--navy);
  background:linear-gradient(180deg,#4DB4F2 0%,#9FDCFF 220px,#F7F4EE 220px,#F7F4EE 100%); }
.wrap { max-width:720px; margin:0 auto; padding:48px 22px 80px }
header { text-align:center; margin-bottom:28px }
h1 { font-size:34px; margin:0 0 6px; color:#fff; text-shadow:0 2px 0 rgba(0,0,0,.15) }
header p { margin:0; color:#eaf7ff }
main { background:#fff; border:3px solid var(--cocoa); border-radius:22px; padding:28px 26px; box-shadow:0 8px 0 rgba(107,62,38,.18) }
h2 { font-size:20px; margin:26px 0 8px; color:var(--cocoa) } h2:first-child { margin-top:0 }
h3 { font-size:16px; margin:18px 0 4px }
p, li { margin:8px 0 } ul { padding-left:22px }
a { color:#D2447A } .updated { color:#7b8199; font-size:14px }
nav { text-align:center; margin-top:26px } nav a { margin:0 10px; font-weight:600 }
.mail { display:inline-block; margin:6px 0 2px; padding:10px 18px; background:var(--butter); border:3px solid var(--cocoa);
  border-radius:14px; font-weight:700; color:var(--cocoa); text-decoration:none }