:root { --brand: #000; --muted: #6c757d; }
body { font-family: 'PT Sans', system-ui, -apple-system, Segoe UI, Roboto, 'Helvetica Neue', Arial; }
.brand-logo { height: 40px; width: 40px; border-radius: 14px; background: var(--brand); color:#fff; display:grid; place-items:center; font-weight:700; }
.navlinks a { color: #444; text-decoration: none; font-size: 0.95rem; margin-left: 14px; }
.navlinks a:hover { color: #000; }
.underline { text-decoration: underline; text-decoration-color: rgba(0,0,0,.25); }
.skill-card { border: 1px solid #eee; border-radius: 14px; padding: 16px; background: #fff; box-shadow: 0 1px 0 rgba(0,0,0,.02); }
.skill-card h4 { font-size: 1rem; margin: 0 0 4px; }
.skill-card p { margin: 0; color: var(--muted); font-size: .95rem; }
   .timeline-basic-example {
            border-left: 1px solid hsl(0, 0%, 90%);
            position: relative;
            list-style: none;
          }

          .timeline-basic-example .timeline-item {
            position: relative;
          }

          .timeline-basic-example .timeline-item:after {
            position: absolute;
            display: block;
            top: 0;
          }

          .timeline-basic-example .timeline-item:after {
            background-color: hsl(0, 0%, 90%);
            left: -38px;
            border-radius: 50%;
            height: 11px;
            width: 11px;
            content: "";
          }
.tags span { display:inline-block; margin-right:6px; margin-bottom:6px; padding:6px 10px; border:1px solid #eee; border-radius:100px; font-size:.8rem; color:#555; }