/* tomclapp.com hub — neutral look, matches the scheduler page (src/schedule.js PAGE_CSS) */
:root{--accent:#2b5c8a;--green:#7ab800;--green-dark:#6aa400;--ink:#2b3440;--muted:#5d6b7a;--tint:#f4f7fb;--line:#dde3ea}
*{box-sizing:border-box}
body{margin:0;font:17px/1.55 "Open Sans",system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;color:var(--ink);background:#fff}
.wrap{max-width:760px;margin:0 auto;padding:1.5rem 1rem 3rem}
.top{display:flex;justify-content:space-between;align-items:center;gap:1rem;flex-wrap:wrap;margin-bottom:1.5rem;font-size:.95rem}
.top a{color:var(--muted);text-decoration:none;font-weight:600}
.top a:hover,.top a.on{color:var(--accent)}
.top nav{display:flex;gap:1.1rem}
.who{display:flex;gap:1.25rem;align-items:center;margin:1rem 0 1.5rem}
.who img{width:150px;height:150px;object-fit:cover;border-radius:50%;border:4px solid var(--tint)}
h1{font-family:"Plus Jakarta Sans","Open Sans",system-ui,sans-serif;font-size:2rem;margin:0 0 .25rem}
h2{font-family:"Plus Jakarta Sans","Open Sans",system-ui,sans-serif;font-size:1.25rem;margin:1.75rem 0 .5rem}
p{margin:.4rem 0}
.lead{color:var(--muted);font-size:1.05rem}
.btns{display:flex;gap:.75rem;flex-wrap:wrap;margin:1.25rem 0}
.home{text-align:center}.home .btns{justify-content:center}.home .note{text-align:left}.home h1{margin-top:.5rem}
.portrait{width:200px;height:200px;border-radius:50%;object-fit:cover;border:4px solid var(--tint);margin-top:1rem}
.btn{display:inline-block;background:var(--green);color:#fff;text-decoration:none;border-radius:10px;padding:.85rem 1.4rem;font-weight:700;min-width:230px;text-align:center}
.btn:hover{background:var(--green-dark)}
.btn.alt{background:#fff;color:var(--accent);border:2px solid var(--accent)}
.note{background:var(--tint);border-radius:12px;padding:1rem 1.1rem;margin:1.25rem 0}
.links{list-style:none;padding:0;margin:0}
.links li{border:1px solid var(--line);border-radius:12px;padding:.9rem 1.1rem;margin:.6rem 0}
.links a{color:var(--accent);font-weight:700;text-decoration:none;font-size:1.05rem}
.links a:hover{text-decoration:underline}
.links small{display:block;color:var(--muted);margin-top:.15rem}
footer{margin-top:2.5rem;font-size:.9rem;color:var(--muted);border-top:1px solid var(--line);padding-top:1rem}
footer a{color:var(--muted)}
@media(max-width:560px){.who{flex-direction:column;text-align:center}.top{justify-content:center}}