/* ============================================================
   DB Upstage — Logo Sizing
   logo-1.png is 4800×2334 (≈2:1 ratio). Sizes below keep the
   logo proportional across nav, mobile menu, and sidebar.
   ============================================================ */

/* Remove bottom border line from navbar */
.main-menu__wrapper-inner::before {
    display: none !important;
}

/* Remove gap between navbar and first section */
.main-header {
    margin-bottom: 0 !important;
}

/* Logo + nav items + right actions all on the same row, vertically centred */
.main-menu__logo {
    padding-top: 0 !important;
    padding-bottom: 0 !important;
}
.main-menu__wrapper-inner {
    padding-top: 16px !important;
    padding-bottom: 16px !important;
}
.main-menu__right {
    padding-top: 0 !important;
    padding-bottom: 0 !important;
}

/* Main nav (desktop + sticky) */
.main-menu__logo img {
    height: 115px;
    width: auto;
    display: block;
}

/* Mobile nav drawer */
.mobile-nav__content .logo-box img {
    height: 70px;
    width: auto;
    display: block;
}

/* Off-canvas sidebar */
.xs-sidebar-group .content-inner .logo {
    max-width: 250px;
}
.xs-sidebar-group .content-inner .logo img {
    width: 100%;
    height: auto;
    display: block;
}

/* ============================================================
   DB Upstage — Unified Section Spacing
   Applies a consistent rhythm between all sections on all pages.

   Scale:
   - Desktop (≥1200px):  100px top + 100px bottom
   - Tablet  (768–1199): 75px  top + 75px  bottom
   - Mobile  (<768px):   55px  top + 55px  bottom

   Exceptions (kept on purpose for visual identity):
   - .main-slider  : hero — keeps its own padding
   - .page-header  : breadcrumb banner — theme-controlled
   - .db-cta       : accent CTA — slightly tighter for emphasis
   - .brand-one    : sponsors — keeps its dashed top/bottom borders
   - body:not(.body-bg-color-1) .site-footer : footer — own padding
   ============================================================ */

/* ---------- Desktop default ---------- */
.services-one,
.feature-one,
.team-one,
.gallery-one,
.event-one,
.buy-ticket,
.schedule-one,
.schedule-three,
.event-direction,
.contact-one,
.about-db-intro,
.htp-final,
.db-legal,
.sliding-text-one,
.error-page {
    padding-top: 100px !important;
    padding-bottom: 100px !important;
}

/* The sliding-text marquee is a thin transition element — keep it minimal */
.sliding-text-one {
    padding-top: 20px !important;
    padding-bottom: 20px !important;
}

.brand-one {
    padding-top: 90px !important;
    padding-bottom: 90px !important;
}

.db-cta,
.cta-one {
    padding-top: 80px !important;
    padding-bottom: 80px !important;
}

/* Restore zero-top for sections that visually flow directly out of a CTA banner.
   (e.g. the htp-final summary on the How-to-Participate page sits right under
   the gradient CTA and would look detached with a full 100px top gap.) */
.db-cta + .htp-final {
    padding-top: 0 !important;
}

/* ---------- Tablet ---------- */
@media (max-width: 1199.98px) {
    .services-one,
    .feature-one,
    .team-one,
    .gallery-one,
    .event-one,
    .buy-ticket,
    .schedule-one,
    .schedule-three,
    .event-direction,
    .contact-one,
    .about-db-intro,
    .htp-final,
    .db-legal,
    .error-page,
    .brand-one {
        padding-top: 75px !important;
        padding-bottom: 75px !important;
    }
    .db-cta,
    .cta-one {
        padding-top: 65px !important;
        padding-bottom: 65px !important;
    }
    .sliding-text-one {
        padding-top: 16px !important;
        padding-bottom: 16px !important;
    }
}

/* ---------- Mobile ---------- */
@media (max-width: 767.98px) {
    .services-one,
    .feature-one,
    .team-one,
    .gallery-one,
    .event-one,
    .buy-ticket,
    .schedule-one,
    .schedule-three,
    .event-direction,
    .contact-one,
    .about-db-intro,
    .htp-final,
    .db-legal,
    .error-page,
    .brand-one {
        padding-top: 48px !important;
        padding-bottom: 48px !important;
    }
    .db-cta,
    .cta-one {
        padding-top: 44px !important;
        padding-bottom: 44px !important;
    }
    .sliding-text-one {
        padding-top: 10px !important;
        padding-bottom: 10px !important;
    }
}

/* ============================================================
   Mobile Header — always-visible fixed bar.
   Stays at the top on every scroll direction.
   ============================================================ */
@media (max-width: 991.98px) {
    .main-header {
        position: fixed !important;
        top: 0 !important;
        left: 0 !important;
        right: 0 !important;
        width: 100% !important;
        z-index: 9999 !important;
        background-color: var(--eventflow-black, #04000A) !important;
        box-shadow: 0 2px 16px rgba(0,0,0,.45);
    }
    /* Shrink logo on mobile so the bar stays compact */
    .main-menu__logo img {
        height: 52px !important;
    }
    /* Hide the JS-driven sticky clone — unused on mobile */
    .stricky-header {
        display: none !important;
    }
    /* Tighten wrapper padding on mobile */
    .main-menu__wrapper-inner {
        padding-top: 10px !important;
        padding-bottom: 10px !important;
    }
    /* Push page content below the fixed header
       (logo 52px + padding-top 10px + padding-bottom 10px = 72px) */
    .page-wrapper {
        padding-top: 72px !important;
    }
}

/* ============================================================
   Page Header (inner-page breadcrumb banner) — reduce the
   huge 188px desktop padding on mobile now that the header
   is sticky (in document flow, not overlaid/fixed).
   ============================================================ */
@media (max-width: 991.98px) {
    .page-header {
        padding: 56px 0 56px !important;
    }
    .page-header__inner h2 {
        font-size: 26px !important;
        line-height: 1.35 !important;
    }
}
@media (max-width: 575px) {
    .page-header {
        padding: 40px 0 40px !important;
    }
    .page-header__inner h2 {
        font-size: 22px !important;
    }
}

/* ============================================================
   Scroll-to-top button — shrink and pull it into the corner on
   mobile so its fixed 60×60px footprint stops sitting on top of
   footer/body text (it has no responsive rule upstream at all).
   ============================================================ */
@media (max-width: 767.98px) {
    .scroll-to-top {
        width: 44px !important;
        height: 44px !important;
        bottom: 16px !important;
        right: 16px !important;
    }
    .scroll-to-top i {
        line-height: 44px !important;
        font-size: 15px !important;
    }
}

/* ============================================================
   Touch-target sizing — the header hamburger button and the
   off-canvas sidebar's close button are under the ~44px minimum
   recommended tap target on mobile; bump their hit area without
   changing their visual icon size.
   ============================================================ */
@media (max-width: 991.98px) {
    .main-header .mobile-nav__toggler {
        display: inline-flex;
        align-items: center;
        justify-content: center;
        width: 44px;
        height: 44px;
    }
}
@media (max-width: 767.98px) {
    .xs-sidebar-group .widget-heading a {
        width: 44px !important;
        height: 44px !important;
        line-height: 44px !important;
    }
}