.comments{margin-top:55px;padding-top:30px;border-top:1px solid #dce7ed}
.comments>header{display:flex;align-items:center;justify-content:space-between}
.comments>header h2{margin:.3rem 0}
.comments>header>b{width:44px;height:44px;display:grid;place-items:center;border-radius:50%;color:#fff;background:#087aa0}
.comment-form{position:relative;display:grid;gap:14px;margin:20px 0;padding:24px;border:1px solid #d7e6ee;border-radius:16px;background:#f6fafc}
.comment-form label{display:grid;gap:7px;font-weight:700}
.comment-form input,.comment-form textarea{padding:12px 14px;border:1px solid #c9dce6;border-radius:9px;font:inherit}
.comment-form textarea{resize:vertical}
.comment-form button{justify-self:end;padding:12px 18px;border:0;border-radius:9px;color:#fff;background:#087aa0;font-weight:800}
.comment-trap{position:absolute;left:-10000px;width:1px;height:1px;overflow:hidden}
.comment-notice,.comment-error{padding:12px 14px;border-radius:9px}
.comment-notice{color:#17613f;background:#e8f7ef}
.comment-error{color:#9c2430;background:#fff0f1}
.comment-list{display:grid;gap:12px}
.comment-list>p{padding:20px;border-radius:12px;background:#f6fafc;text-align:center}
.comment-list article{display:grid;grid-template-columns:44px 1fr;gap:13px;padding:17px;border:1px solid #deeaef;border-radius:12px}
.comment-list article>i{width:44px;height:44px;display:grid;place-items:center;border-radius:50%;color:#07446f;background:#dff2fa;font-style:normal;font-weight:850}
.comment-list article header{display:flex;justify-content:space-between;gap:12px}
.comment-list article time{color:#7a8d98;font-size:11px}
.comment-list article p{margin:8px 0 0}
@media(max-width:600px){.comment-form button{width:100%}.comment-list article header{flex-direction:column;gap:3px}}