/* Honeypot field hiding - looks like normal utility class */
.field-wrapper.optional {
    position: absolute;
    left: -9999px;
    opacity: 0;
    pointer-events: none;
}

/* Success/error message styling */
#msgSubmit {
    margin-top: 20px;
    padding: 15px;
    border-radius: 8px;
    font-size: 16px;
    text-align: center;
}

#msgSubmit.success {
    background-color: rgba(156, 175, 136, 0.1);
    border: 2px solid #9CAF88;
    color: #6B5347;
}

#msgSubmit.error {
    background-color: rgba(212, 121, 91, 0.1);
    border: 2px solid #D4795B;
    color: #6B5347;
}

.validation-error {
    color: #D4795B;
    font-size: 14px;
    margin-top: 5px;
}

/* Header logo (reversed one-line wordmark; header sits on dark imagery / Earth Brown).
   Height must stay within the theme's header offsets (hero margin-top -116px desktop,
   -90px below 1200px): <=55px desktop, <=49px below 1200px, or a white strip shows above the hero. */
.solana-header-logo img {
    display: block;
    width: auto;
    height: 48px;
    /* Optical alignment: the image box includes the tall "l", so the lowercase letters sit
       ~14% of the height below center. Lift them level with the menu text (transform: no layout change). */
    transform: translateY(-14%);
}

@media (max-width: 1199px) {
    .solana-header-logo img {
        height: 44px;
    }
}

/* Hamburger navigation below 1200px (theme default was 991px).
   Between 992-1199px the full menu does not fit beside the logo and wraps onto two lines,
   growing the header to ~140px and leaving a white strip above every hero.
   Pairs with navbar-expand-xl in base/default.html; mirrors the theme's 991px nav rules in custom.css.
   All hero offsets below 1200px match the ~85px collapsed header. */
@media only screen and (max-width: 1199px) {
    .navbar {
        padding: 20px 0;
    }

    .main-menu ul li.highlighted-menu {
        display: block;
    }

    .slicknav_nav li,
    .slicknav_nav ul {
        display: block;
    }

    .responsive-menu,
    .navbar-toggle {
        display: block;
    }

    .header-btn {
        display: none;
    }

    .hero,
    .page-header {
        margin-top: -90px;
    }

    .article-hero-section,
    .new-policy-hero {
        margin-top: -90px;
        padding-top: 90px;
    }

    .header-slim {
        height: 90px;
        margin-top: -90px;
        padding-top: 90px;
    }
}
