/* Cascade
   Later layers override earlier ones, whatever the selector weight. Inside a layer, normal specificity and source order apply.
   Shared tokens, base, layout, and components match the main site. Blog-only rules live in pages/.
*/

@layer base, layout, components, pages;

@import './tokens.css' layer(base);
@import './base.css' layer(base);
@import './layout.css' layer(layout);
@import './components/buttons.css' layer(components);
@import './components/nav.css' layer(components);
@import './components/footer.css' layer(components);
@import './pages/blog.css' layer(pages);
@import './pages/blog-post.css' layer(pages);
@import './pages/blog-preview.css?v=20260928b' layer(pages);

@layer pages {
  .siteheader.blog,
  .siteheader.blogPost {
    background-color: transparent;
  }
  .site.active .siteheader,
  .siteheader.is-scrolled {
    background-color: #000;
  }
  @media screen and (max-width: 890px) {
    .site:not(.active):has(.page-side) .siteheader.is-scrolled {
      background-color: transparent;
    }
    .site.blogPost:not(.active) .siteheader {
      background-color: transparent;
    }
  }

  /* Hide reCAPTCHA badge */
  .grecaptcha-badge {
    visibility: hidden;
  }

  .ns-modal-form-actions {
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    align-items: center;
    gap: 1rem;
  }
  .ns-modal-form-actions p {
    margin:0;
    padding:0;
    line-height: 0;
  }

  .recaptcha-notice img {
    width: 100%;
    max-width: 187px;
    height: auto;
    padding: 0;
    margin: 0;
    box-shadow: 0 0 4px 0px rgba(0, 0, 0, 0.4);
  }

  

}