:root { --teal:#173F45; --ink:#10292D; --cream:#F6EEDF; --muted:#5b6f72; }
* { box-sizing: border-box; }
body { margin:0; font-family: -apple-system, "Helvetica Neue", Arial, sans-serif; color: var(--ink); background:#fbfaf7; line-height:1.6; }
a { color:#1f6f73; }
header.bar { padding:18px 24px; display:flex; align-items:center; gap:10px; }
header.bar img { width:34px; height:34px; border-radius:8px; }
header.bar a { text-decoration:none; color:var(--teal); font-family: Georgia, serif; font-size:22px; }
main.doc { max-width:720px; margin:0 auto; padding:8px 24px 64px; }
main.doc h1 { font-family: Georgia, serif; font-weight:normal; color:var(--teal); font-size:34px; margin:12px 0 4px; }
main.doc h2 { font-family: Georgia, serif; font-weight:normal; color:var(--teal); font-size:22px; margin-top:32px; }
footer { text-align:center; color:var(--muted); font-size:14px; padding:24px; }
.hero { background: radial-gradient(120% 80% at 50% 0%, #22545B 0%, #173F45 50%, #0E2C31 100%); color:var(--cream); text-align:center; padding:56px 24px 0; overflow:hidden; }
.hero img.icon { width:84px; height:84px; border-radius:20px; box-shadow:0 8px 24px rgba(0,0,0,.3); }
.hero h1 { font-family: Georgia, serif; font-weight:normal; font-size:44px; margin:18px 0 8px; }
.hero p { font-size:19px; color:#CFE0DE; max-width:520px; margin:0 auto 22px; }
.soon { display:inline-block; background:var(--cream); color:var(--teal); padding:12px 22px; border-radius:999px; font-weight:600; }
.hero img.shot { display:block; width:min(360px, 86vw); margin:40px auto 0; border-radius:26px 26px 0 0; box-shadow:0 20px 50px rgba(0,0,0,.45); }
.feats { max-width:880px; margin:0 auto; padding:48px 24px; display:grid; grid-template-columns: repeat(auto-fit, minmax(240px,1fr)); gap:28px; }
.feats h3 { font-family: Georgia, serif; font-weight:normal; color:var(--teal); font-size:21px; margin:0 0 6px; }
.feats p { margin:0; color:var(--muted); }