*{box-sizing:border-box}
body{margin:0;font-family:system-ui,-apple-system,Segoe UI,Roboto,Arial,sans-serif;background:#f4f6f8;color:#111}
.hero{height:56vh;min-height:380px;background:url('gdansk.jpg') center/cover no-repeat;position:relative}
.overlay{position:absolute;inset:0;background:linear-gradient(180deg,rgba(0,0,0,.45),rgba(0,0,0,.25) 60%, rgba(0,0,0,0));display:flex;align-items:flex-start}
.brand{padding:28px 22px;color:#fff;letter-spacing:.08em}
.kicker{font-size:14px;opacity:.95}
.name{margin-top:10px;font-size:26px;font-weight:700;letter-spacing:.12em}
.chat-section{max-width:720px;margin:-92px auto 36px;background:#fff;border-radius:12px;box-shadow:0 18px 40px rgba(0,0,0,.14);overflow:hidden}
.chat-header{display:flex;align-items:center;gap:10px;padding:14px 16px;background:#1f3a5f;color:#fff;font-weight:600}
.avatar{width:42px;height:42px;border-radius:50%;border:2px solid rgba(255,255,255,.35)}
.chat-box{height:240px;padding:14px 16px;overflow:auto}
.muted{color:#667085;font-size:14px;line-height:1.45}
.chat-input{display:flex;gap:8px;padding:12px 12px 14px;border-top:1px solid #e6e8ee}
.chat-input input{flex:1;padding:12px;border:1px solid #d5dae3;border-radius:10px;background:#f7f9fc}
.chat-input button{padding:12px 16px;border:0;border-radius:10px;background:#1f3a5f;color:#fff;font-weight:700;opacity:.55}
.chat-input button[title]{width:52px}
.about{max-width:720px;margin:0 auto 36px;padding:0 14px}
.about h3{margin:12px 0 10px;font-size:22px}
.about ul{margin:0;padding-left:20px;color:#344054;line-height:1.7}
.links{margin-top:14px;display:flex;gap:10px;flex-wrap:wrap}
.btn{display:inline-block;padding:10px 14px;border-radius:10px;background:#1f3a5f;color:#fff;text-decoration:none;font-weight:700}
.btn.secondary{background:#e6e8ee;color:#111}
footer{max-width:720px;margin:0 auto;padding:14px;color:#667085;font-size:12px;text-align:center}
