/* Allow the homepage grids and carousels to shrink to mobile widths. */
html { overflow-x: clip; }
body { width: 100%; max-width: 100%; overflow-x: clip; }
.why-new-grid > *, .grid2 > *, .ruhunu-slider-outer, .ruhunu-viewport {
    min-width: 0;
    max-width: 100%;
}
.redesign-event-card img { max-width: 100%; height: auto !important; }
@media (max-width: 768px) {
    .why-new-grid, .ruhunu-section .grid2 { grid-template-columns: minmax(0, 1fr) !important; }
    .why-new-left, .why-new-right { width: 100%; min-width: 0 !important; }
    .ruhunu-section .h2 { max-width: 100%; }
    .newsletter-left, .newsletter-right { min-width: 0 !important; width: 100%; }
    .redesign-conference-card h2 { overflow-wrap: anywhere; }
    .why-new-right [style*="repeat(5"] { grid-template-columns: repeat(3, minmax(0, 1fr)) !important; }
    #redesignHeader .header-main { min-width: 0; width: 100%; }
    #redesignHeader .nav-inner { gap: 8px !important; padding-left: 0 !important; padding-right: 0 !important; }
    #redesignHeader .nav-logo { flex-shrink: 1; max-width: 90px; }
    #redesignHeader .nav-event-highlight { min-width: 0; max-width: 160px; }
    #redesignHeader .hamburger { flex-shrink: 0; }
}

/* Keep the utility bar and compact main menu visible together on scroll. */
#redesignHeader {
    position: sticky;
    top: 0 !important;
    z-index: 1000;
}

#redesignHeader .header-container,
#redesignHeader .nav-inner {
    transition: min-height .25s ease, height .25s ease;
}

#redesignHeader .nav-logo-white {
    width: 170px;
    transition: height .25s ease;
}

#redesignHeader .nav-logo-white img {
    transform-origin: left center;
    transition: transform .25s ease;
}

#redesignHeader.is-compact .header-container {
    min-height: 80px;
}

#redesignHeader.is-compact .nav-inner {
    min-height: 66px;
    height: auto !important;
}

#redesignHeader.is-compact .nav-logo-white {
    height: 60px !important;
}

#redesignHeader.is-compact .nav-logo-white img {
    transform: scale(.75);
}

@media (max-width: 768px) {
    #redesignHeader .nav-logo {
        transition: transform .25s ease;
        transform-origin: left center;
    }

    #redesignHeader.is-compact .header-container,
    #redesignHeader.is-compact .nav-inner {
        min-height: 60px;
    }

    #redesignHeader.is-compact .nav-inner {
        height: 60px !important;
    }

    #redesignHeader.is-compact .nav-logo {
        transform: scale(.85);
    }
}

@media (prefers-reduced-motion: reduce) {
    #redesignHeader .header-container,
    #redesignHeader .nav-inner,
    #redesignHeader .nav-logo,
    #redesignHeader .nav-logo-white,
    #redesignHeader .nav-logo-white img {
        transition: none;
    }
}