/* ============================================================
   Custom overrides for the jekyll-klise theme.
   Loaded AFTER /assets/css/style.css, so these rules win without
   needing !important. Keep this minimal — the theme is already clean.
   ============================================================ */

/* --- Navbar: let the header span the full width of the screen --- */
/* (theme caps it at ~830px and centers it; we open it up on desktop) */
@media screen and (min-width: 769px) {
  .navbar {
    max-width: none;
    padding-top: 16px;
    padding-bottom: 16px;
    padding-left: 44px;
    padding-right: 44px;
  }
}

/* --- Author / profile block --- */

/* Tighten the large empty gap above and below the profile block */
.author {
  margin-top: 3.5rem;
  margin-bottom: 3.75rem;
}

/* Bigger, still-round profile photo */
.author .author-avatar {
  width: 124px;
  height: 124px;
}

/* A little breathing room under the photo, slightly larger name */
.author .author-name {
  margin-top: 16px;
  font-size: 1.8em;
}

/* Larger, more readable bio line */
.author .author-bio {
  font-size: 1.06em;
  line-height: 1.7;
  max-width: 480px;
  opacity: 0.95;
  margin-top: 6px;
}

/* Slightly tighter rhythm on the home page heading */
.posts-item-note {
  margin-top: 1rem;
}

/* --- About page links: black instead of blue (post links stay blue) --- */
/* .wrapper:not(.post) matches `page` layouts only, so blog posts are untouched */
.wrapper:not(.post) .page-content a,
.wrapper:not(.post) .page-content a:hover,
.wrapper:not(.post) .page-content a:focus {
  color: #0d122b;
}
/* keep them readable in dark mode */
body[data-theme="dark"] .wrapper:not(.post) .page-content a,
body[data-theme="dark"] .wrapper:not(.post) .page-content a:hover,
body[data-theme="dark"] .wrapper:not(.post) .page-content a:focus {
  color: #eaeaea;
}

/* --- Nicer focus state --- */
/* Theme draws a hard blue rectangle on every click. Drop it for mouse
   clicks, and show a soft rounded ring only for keyboard (Tab) users. */
a:focus {
  outline: none;
}
a:focus-visible {
  outline: 2px solid rgba(0, 63, 255, 0.55);
  outline-offset: 3px;
  border-radius: 4px;
}
body[data-theme="dark"] a:focus-visible {
  outline-color: rgba(255, 82, 119, 0.6);
}

/* --- Small-screen adjustments --- */
@media screen and (max-width: 768px) {
  .author {
    margin-top: 2.5rem;
  }
  .author .author-avatar {
    width: 108px;
    height: 108px;
  }
}
