/**
 * Home header + hero: stay balanced at browser zoom (110%+) — fluid widths, no horizontal spill.
 * Load after style.min.css / responsive.css.
 */

html {
    overflow-x: hidden;
}

body {
    overflow-x: hidden;
    max-width: 100vw;
}

/* responsive.css sets .container { min-width: 1640px } at wide viewports — can force x-overflow when zooming */
@media (min-width: 1640px) {
    .header_area .container {
        min-width: 0 !important;
        max-width: 1320px;
    }
}

/* Prevent nested bootstrap rows/containers from forcing page wider than viewport */
.header_area,
.header_area .extra_div,
.header_area .header_text,
.header_area .menu_main,
.header_area .menu_main .container,
.header_area .banner_area,
.header_area .banner_text {
    max-width: 100%;
    box-sizing: border-box;
}

.header_area .menu {
    gap: clamp(6px, 1.2vw, 16px);
    min-width: 0;
}

/* When viewport tightens (incl. browser zoom), allow nav row to wrap instead of overflowing */
@media (max-width: 1600px) {
    .header_area .menu {
        flex-wrap: wrap;
        row-gap: 10px;
    }
}

.header_area .logo {
    flex: 0 1 auto;
    min-width: 0;
}

.header_area .logo-link {
    max-width: 100%;
}

.header_area .logo-link svg {
    width: min(180px, 34vw);
    height: auto;
    max-width: 100%;
}

.header_area .menu ul {
    flex-wrap: wrap;
    gap: 2px 6px;
    min-width: 0;
    flex: 1 1 auto;
    justify-content: flex-end;
    align-items: center;
}

.header_area .menu ul li a {
    padding: 4px clamp(6px, 0.9vw, 14px);
    font-size: clamp(13px, 0.85vw + 0.35rem, 16px);
    white-space: nowrap;
}

.header_area .btn_main_right {
    flex: 0 1 auto;
    min-width: 0;
}

.header_area .btn_main_right .btn-style {
    padding: clamp(8px, 0.9vw, 12px) clamp(10px, 1.4vw, 22px);
    font-size: clamp(11px, 0.75vw + 0.35rem, 15px);
    white-space: nowrap;
}

/* Hero: columns must shrink inside grid (fixes col-auto–style blowout at zoom) */
.header_area .banner_text .row {
    max-width: 100%;
}

.header_area .banner_text .row > [class*="col-"] {
    min-width: 0;
}

.header_area .banner_text h1 {
    font-size: clamp(2rem, 4.2vw + 1rem, 4.75rem) !important;
    line-height: 1.06 !important;
    word-wrap: break-word;
    overflow-wrap: break-word;
    hyphens: auto;
}

.header_area .banner_text p {
    max-width: 100%;
}

#hero_video_container {
    min-width: 0;
    max-width: 100%;
}

#hero_video_container video {
    max-width: 100%;
    width: 100%;
    height: auto;
    min-height: 220px;
    object-fit: cover;
    display: block;
}

.header_area .banner_area {
    width: 100%;
    max-width: min(1010px, 100%);
    padding-left: clamp(8px, 2vw, 16px);
    padding-right: clamp(8px, 2vw, 16px);
}

.fixedheader .menu {
    min-width: 0;
}