/* Desktop Style Overrides (>980px) */
@media (min-width: 981px) {
  .wp-block-navigation__responsive-container-open {
    display: none !important;
  }
  .wp-block-navigation__responsive-container {
    display: flex !important;
    position: static !important;
    width: auto !important;
    height: auto !important;
    background: transparent !important;
    visibility: visible !important;
    opacity: 1 !important;
  }
  .wp-block-navigation__responsive-container-close {
    display: none !important;
  }
}

/* Mobile Style Overrides (<=980px) */
@media (max-width: 980px) {
  .site-header {
    backdrop-filter: none !important;
    background: var(--paper) !important;
  }
  
  .nav-portal-placeholder,
  .header-inner .nav-portal {
    display: none !important;
  }
  
  .wp-block-navigation__responsive-container-open {
    display: flex !important;
    border: 0 !important;
    background: transparent !important;
    color: var(--ink) !important;
    cursor: pointer !important;
    padding: 8px !important;
  }
  
  .wp-block-navigation__responsive-container:not(.is-menu-open) {
    display: none !important;
  }
  
  .wp-block-navigation__responsive-container.is-menu-open {
    display: flex !important;
    flex-direction: column !important;
    position: fixed !important;
    top: 0 !important;
    left: 0 !important;
    right: 0 !important;
    bottom: 0 !important;
    width: 100vw !important;
    height: 100vh !important;
    height: 100dvh !important;
    background: var(--paper) !important;
    z-index: 99999 !important;
    padding: 60px 24px !important;
    box-sizing: border-box !important;
  }
  
  .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__responsive-container-close {
    display: block !important;
    position: absolute !important;
    top: 24px !important;
    right: 24px !important;
    border: 0 !important;
    background: transparent !important;
    color: var(--ink) !important;
    cursor: pointer !important;
    padding: 8px !important;
  }
  
  .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__container {
    display: flex !important;
    flex-direction: column !important;
    align-items: flex-start !important;
    gap: 24px !important;
    margin-top: 48px !important;
    list-style: none !important;
    padding: 0 !important;
  }
  
  .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation-item {
    display: block !important;
  }
  
  .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation-item a {
    font-size: 22px !important;
    font-weight: 650 !important;
    color: var(--ink) !important;
    text-decoration: none !important;
  }
  
  .hero-grid,
  .section-head,
  .split,
  .finder,
  .content-layout,
  .doc-layout,
  .contact-grid {
    grid-template-columns: 1fr;
  }
  
  .hero-grid {
    gap: 42px;
  }
  
  .section-head p {
    justify-self: start;
  }
  
  .finder-panel,
  .finder-copy {
    padding: 34px;
  }
  
  .side {
    position: static;
  }
  
  .doc-nav {
    display: none;
  }
  
  .footer-grid {
    grid-template-columns: 1fr 1fr;
  }
  
  .content-layout {
    gap: 48px;
  }
}

/* Enforce static position on header when mobile menu modal is active to clear containing blocks */
.has-modal-open .site-header {
  position: static !important;
  backdrop-filter: none !important;
}

@media (max-width: 680px) {
  .wrap {
    width: min(calc(100% - 28px), var(--max));
  }
  
  .hero {
    padding: 54px 0;
  }
  
  .hero h1 {
    font-size: 47px;
  }
  
  .page-hero h1 {
    font-size: 44px;
  }
  
  .section {
    padding: 62px 0;
  }
  
  .index-grid {
    grid-template-columns: 1fr;
  }
  
  .finder-options {
    grid-template-columns: 1fr;
  }
  
  .update-row {
    grid-template-columns: 86px 1fr;
  }
  
  .update-tag {
    display: none;
  }
  
  .footer-grid {
    grid-template-columns: 1fr;
  }
  
  .footer-bottom {
    flex-direction: column;
  }
  
  .actions {
    display: grid;
  }
  
  .btn {
    width: 100%;
  }
  
  .verify-box {
    grid-template-columns: 1fr;
  }
  
  .contact-form {
    padding: 24px;
  }
  
  .hero-aside {
    padding: 22px;
  }
}