/* VastWondering · Argon 1.3.5 companion styles · v1.1.0 */
:root {
  --vw-paper: #f6f5f1;
  --vw-surface: #fffefa;
  --vw-ink: #253b42;
  --vw-muted: #596c71;
  --vw-line: #dce3df;
  --vw-accent: var(--themecolor, #285f63);
  --vw-soft: rgba(var(--themecolor-rgbstr, 40, 95, 99), .10);
  --vw-radius: var(--card-radius, 18px);
}
html.darkmode {
  --vw-paper: #171e23;
  --vw-surface: #202b31;
  --vw-ink: #e7eeea;
  --vw-muted: #afc2c1;
  --vw-line: #3c4c52;
  --vw-accent: var(--themecolor-light, #a0d0c7);
  --vw-soft: rgba(var(--themecolor-rgbstr, 40, 95, 99), .20);
}
html body { background: var(--vw-paper); color: var(--vw-ink); }
html.darkmode body { background: var(--vw-paper); color: var(--vw-ink); }
/* Typography follows Argon's --font and .use-serif preference. */
html { scroll-padding-top: 110px; }
#navbar-main {
  top: 16px; left: 20px; right: 20px;
  width: auto; max-width: 1140px; margin-inline: auto;
  min-height: 64px; padding: 8px 18px;
  border: 1px solid var(--vw-line); border-radius: 18px;
  background: var(--vw-surface) !important;
  box-shadow: 0 8px 30px rgb(24 49 53 / 8%);
  color: var(--vw-ink);
}
#navbar-main .container { max-width: 100%; padding-inline: 4px; }
#navbar-main .navbar-title {
  color: var(--vw-ink) !important; font-weight: 750;
  font-size: 19px; letter-spacing: -.6px;
}
#navbar-main .navbar-title::before {
  content: ""; display: inline-block; width: 9px; height: 9px;
  margin-right: 9px; border-radius: 50%; background: #b76760;
}
#navbar-main .nav-link, #navbar-main .navbar-toggler { color: var(--vw-ink) !important; }
#navbar-main .nav-link { padding: 10px 15px; border-radius: 10px; font-size: 14px; font-weight: 600; }
#navbar-main .nav-link:hover,
#navbar-main .nav-link[aria-current="page"] { background: var(--vw-soft); color: var(--vw-accent) !important; }
#navbar-main .input-group-text { color: var(--vw-ink); }
#navbar-main .navbar-toggler-icon { filter: brightness(.35); }
html.darkmode #navbar-main .navbar-toggler-icon { filter: brightness(1.8); }
#navbar_search_input, #navbar_search_input_mobile { color: var(--vw-ink); }
#navbar_search_input::placeholder, #navbar_search_input_mobile::placeholder { color: var(--vw-muted); }
html body #banner {
  height: 100vh !important; height: 100svh !important; min-height: 400px;
  margin-bottom: 0; padding: 100px 0 60px;
  background-position: center; isolation: isolate;
}
#banner::after {
  content: ""; position: absolute; inset: 0; z-index: 0; pointer-events: none;
  background: linear-gradient(180deg, rgb(27 46 51 / 8%) 0%, transparent 35%, rgb(27 46 51 / 18%) 100%);
}
#banner > .shape { display: none; }
html body #banner #banner_container {
  height: 100% !important; position: relative; z-index: 1;
  width: 100%; max-width: none !important; margin: 0;
  padding-inline: clamp(16px, 3vw, 64px);
}
#banner .banner-title {
  width: 100%; max-width: none; left: 0; top: 50%;
  transform: translateY(-50%); padding-inline: clamp(16px, 3vw, 64px);
  font-size: clamp(22px, 2.2vw, 40px); font-weight: 600;
  line-height: 1.65; letter-spacing: normal;
  white-space: normal; word-break: normal; overflow-wrap: break-word;
  text-shadow: 0 2px 14px rgb(17 33 39 / 55%); text-wrap: wrap;
}
#banner .banner-title-inner { white-space: normal; text-wrap: wrap; }
#banner .banner-subtitle { font-size: 14px; letter-spacing: .08em; }
#banner .cover-scroll-down { z-index: 2; bottom: 14px; }
html:not(.is-home) body #banner { height: 290px !important; min-height: 290px; padding-top: 108px; }
html:not(.is-home) #banner .banner-title { font-size: clamp(22px, 2.2vw, 34px); }
html body #content { max-width: 1140px; margin-top: 34px !important; padding-inline: 20px; }
html.single-column body #content { max-width: 1020px; }
html.no-banner body #content { margin-top: 110px !important; }
#main { padding-inline: 0; }
#main > article.post {
  border: 1px solid var(--vw-line) !important; border-radius: var(--vw-radius);
  overflow: hidden; margin-bottom: 28px;
  background: var(--vw-surface) !important;
}
.article-list > article.post { transition: box-shadow .2s ease, border-color .2s ease; }
.article-list > article.post:hover { border-color: #aabfba !important; }
.post-title { color: var(--vw-ink); line-height: 1.5; font-weight: 700; text-wrap: balance; }
.post-header:not(.post-header-with-thumbnail) .post-title { font-size: clamp(23px, 2.5vw, 32px); }
.post-meta { font-size: 12px; line-height: 1.9; color: var(--vw-muted); }
.post-header-with-thumbnail .post-meta { color: #fff; text-shadow: 0 1px 6px rgb(0 0 0 / 75%); }
.post-header-with-thumbnail .post-meta a { color: #fff; }
.post-content { color: var(--vw-ink); line-height: 1.9; overflow-wrap: break-word; }
.article-list .post-content { padding: 24px 32px; font-size: 15px; }
.post-content > :is(p, ul, ol, blockquote) { margin-bottom: 1.3em; }
.post-content :is(h2, h3, h4) { line-height: 1.5; margin-top: 1.6em; color: var(--vw-ink); }
.post-content a { color: var(--vw-accent); }
.post-content pre { max-width: 100%; overflow-x: auto; }
.post-content img { height: auto; max-width: 100%; }
.post-content blockquote { border-left: 3px solid var(--vw-accent); background: var(--vw-soft); padding: 18px 22px; border-radius: 0 10px 10px 0; }
#footer.site-footer {
  margin: 48px 0 28px; padding: 32px !important;
  text-align: left; border-radius: var(--vw-radius);
  background: var(--vw-surface) !important; color: var(--vw-muted);
  border: 1px solid var(--vw-line) !important;
}
html.darkmode body #footer.site-footer { background: var(--vw-surface) !important; }
.vw-footer-top { display: flex; justify-content: space-between; align-items: flex-start; gap: 28px; padding-bottom: 24px; }
.vw-footer-name { display: inline-block; color: var(--vw-ink); font-size: 23px; letter-spacing: -.7px; font-weight: 750; }
.vw-footer-tagline { margin: 8px 0 0; font-size: 14px; line-height: 1.9; max-width: 36em; }
.vw-footer-links { display: flex; flex-wrap: wrap; gap: 12px 20px; padding-top: 5px; }
#footer a { color: var(--vw-accent); }
.vw-footer-legal { padding-top: 18px; border-top: 1px solid var(--vw-line); font-size: 12px; line-height: 1.9; }
#footer > div:last-child { font-size: 12px; margin-top: 12px; }
.vw-language-item { display: flex; align-items: center; gap: 3px; margin-left: 12px; }
#navbar-main .vw-language-item .nav-link { padding: 7px 9px; font-size: 12px; }
.vw-language-item .is-current { background: var(--vw-soft); font-weight: 750; }
.vw-skip-link { position: fixed; top: 8px; left: 20px; z-index: 10000; padding: 12px 18px; background: var(--vw-surface); color: var(--vw-ink); border: 2px solid var(--vw-accent); border-radius: 8px; transform: translateY(-180%); }
.vw-skip-link:focus { transform: translateY(0); }
a:focus-visible, button:focus-visible, input:focus-visible, textarea:focus-visible { outline: 3px solid var(--vw-accent) !important; outline-offset: 4px; }
/* Keep the native Argon controls and their handlers. No replacement floating button. */
#float_action_buttons { z-index: 1100; }
html.is-home.banner-as-cover #float_action_buttons.hidden {
  opacity: 1 !important; pointer-events: auto !important;
}
#float_action_buttons #fabtn_toggle_blog_settings_popup {
  display: block !important; visibility: visible !important;
  width: 42px !important; height: 42px !important;
  margin-top: 8px !important; opacity: 1 !important; pointer-events: auto !important;
}
#float_action_buttons #fabtn_blog_settings_popup { z-index: 1101; }
@media (max-width: 991px) {
  #navbar-main { top: 10px; left: 12px; right: 12px; padding: 7px 10px; min-height: 58px; }
  #navbar_global { background: var(--vw-surface); color: var(--vw-ink); }
  #navbar-main .nav-link { padding: 12px; }
  #navbar-main .navbar-toggler-searcg-icon {
    filter: none;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24'%3E%3Cpath d='M4 6h16M4 12h16M4 18h16' fill='none' stroke='%23285f63' stroke-width='2' stroke-linecap='round'/%3E%3C/svg%3E") !important;
  }
  .vw-language-item { margin-left: 0; padding: 8px 12px; }
  html body #banner { height: 100vh !important; height: 100svh !important; min-height: 400px; padding-inline: 0; }
  html:not(.is-home) body #banner { height: 260px !important; min-height: 260px; }
  html body #content { margin-top: 22px !important; padding-inline: 14px; }
  #footer.site-footer { padding: 24px !important; }
}
@media (max-width: 575px) {
  #navbar-main .navbar-title { font-size: 17px; }
  #banner .banner-title { font-size: 22px; }
  .article-list .post-content { padding: 20px; }
  .vw-footer-top { flex-direction: column; gap: 20px; }
  #footer.site-footer { margin-top: 30px; padding: 22px !important; }
}
@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto !important; }
  #main > article.post, #navbar-main, .banner-title-inner, .banner-title-inner::after { animation: none !important; transition: none !important; }
}
