/* SIBO navigation: transparent hero, edge-to-edge fixed bar, dark image-led mega menu. */
body.sibo-site {
    --sibo-header-height: 96px;
    --sibo-header-offset: 0px;
    --sibo-header-inset: 0px;
    --sibo-header-surface: #121c1e;
}
body.admin-bar.sibo-site { --sibo-header-offset: 32px; }
body.sibo-site .sibo-header {
    position: fixed; top: var(--sibo-header-offset); left: 0; right: 0;
    z-index: 100; color: #fff; background: var(--sibo-header-surface);
    border: 1px solid transparent; border-radius: 0;
    transition: background .22s ease, border-color .22s ease, box-shadow .22s ease;
}
body.sibo-home .sibo-header { background: transparent; }
body.sibo-site .sibo-header-spacer { height: calc(var(--sibo-header-height) + 2px); }
body.sibo-home .sibo-header-spacer { display: none; }
body.sibo-site .sibo-header .sibo-header-inner {
    height: var(--sibo-header-height); gap: 30px;
    width: calc(100% - 60px); max-width: 1760px; margin-inline: auto;
}
body.sibo-site .sibo-header .sibo-brand { flex: 0 0 150px; }
body.sibo-site .sibo-header .sibo-brand img { width: 150px; }
body.sibo-site .sibo-header .sibo-navigation { margin-inline: auto; }
body.sibo-site .sibo-header .sibo-nav-list { gap: clamp(20px, 2.1vw, 40px); }
body.sibo-site .sibo-header .sibo-nav-label { height: var(--sibo-header-height); border: 0; }
body.sibo-site .sibo-header .sibo-nav-link {
    color: #d5dcdc; font-size: 15px; font-weight: 600;
    position: relative; transition: color .18s ease;
}
body.sibo-site .sibo-header .sibo-nav-link::after {
    content: ''; position: absolute; bottom: 14px; left: 0; right: 0; height: 1px;
    background: var(--sibo-teal); transform: scaleX(0); transform-origin: left;
    transition: transform .2s ease;
}
body.sibo-site .sibo-header .sibo-nav-link:is(:hover,:focus-visible),
body.sibo-site .sibo-header .sibo-is-open .sibo-nav-link { color: #fff; }
body.sibo-site .sibo-header .sibo-is-open .sibo-nav-link::after,
body.sibo-site .sibo-header .sibo-nav-link[aria-current=page]::after { transform: scaleX(1); }
body.sibo-site .sibo-header .sibo-submenu-toggle { color: #d5dcdc; }
body.sibo-site .sibo-header .sibo-header-cta { flex-shrink: 0; margin-left: 0; }
body.sibo-site.sibo-header-scrolled .sibo-header,
body.sibo-site.sibo-mega-open .sibo-header,
body.sibo-site.sibo-mobile-open .sibo-header {
    top: var(--sibo-header-offset);
    left: 0; right: 0;
    background: var(--sibo-header-surface); border-color: #ffffff15;
    border-radius: 0; box-shadow: none;
}
body.sibo-site.sibo-mega-open .sibo-header { border-radius: 0; border-bottom-color: transparent; }
body.sibo-site .sibo-header .sibo-mega {
    top: 100%; left: -1px; right: -1px;
    background: var(--sibo-header-surface); color: #fff;
    border: 1px solid #ffffff15; border-top: 0; border-radius: 0 0 16px 16px;
    box-shadow: 0 28px 40px #03131433;
    max-height: calc(100dvh - var(--sibo-header-offset) - var(--sibo-header-height) - 18px);
    overscroll-behavior: contain;
    transition: opacity .2s ease, transform .2s ease;
}
body.sibo-site .sibo-header .sibo-mega-layout {
    display: grid; grid-template-columns: minmax(180px, .95fr) minmax(0, 2.15fr) minmax(150px, .65fr);
    gap: clamp(24px, 2.5vw, 48px); padding: 24px 30px 30px;
    max-width: 1760px; margin-inline: auto;
}
body.sibo-site .sibo-header .sibo-mega-scenes { display: grid; grid-template-rows: repeat(2,minmax(0,1fr)); gap: 16px; }
body.sibo-site .sibo-header .sibo-mega-scene {
    position: relative; display: block; overflow: hidden; border-radius: 12px;
    min-height: 150px; background: #263435;
}
body.sibo-site .sibo-header .sibo-mega-scene::after {
    content: ''; position: absolute; inset: 0; background: linear-gradient(transparent 25%,#031314cf);
    pointer-events: none;
}
body.sibo-site .sibo-header .sibo-mega-scene img { width: 100%; height: 100%; object-fit: cover; position: absolute; inset: 0; transition: transform .3s; }
body.sibo-site .sibo-header .sibo-mega-scene>span {
    position: absolute; z-index: 1; bottom: 18px; left: 18px; right: 18px;
    display: flex; align-items: center; justify-content: space-between; gap: 12px;
    font-size: 17px; font-weight: 600; line-height: 1.4; color: #fff;
}
body.sibo-site .sibo-header .sibo-mega-scene:hover img { transform: scale(1.04); }
body.sibo-site .sibo-header .sibo-mega-collection { min-width: 0; }
body.sibo-site .sibo-header .sibo-mega-collection-heading {
    display: flex; align-items: center; justify-content: space-between; gap: 20px;
    color: #a8b8b7; font-size: 13px; margin-bottom: 16px;
}
body.sibo-site .sibo-header .sibo-mega-overview { display: inline-flex; align-items: center; gap: 10px; color: #fff; }
body.sibo-site .sibo-header .sibo-mega-cards {
    display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 14px;
}
body.sibo-site .sibo-header .sibo-mega-card {
    position: relative; display: flex; flex-direction: column; gap: 12px;
    min-width: 0; padding: 16px; background: #252f31; border: 1px solid transparent;
    border-radius: 12px; transition: background .2s, border-color .2s;
}
body.sibo-site .sibo-header .sibo-mega-card:hover,
body.sibo-site .sibo-header .sibo-mega-card:focus-within { background: #2b3a3b; border-color: var(--sibo-teal); }
body.sibo-site .sibo-header .sibo-mega-card-image {
    height: clamp(105px, 10.5vw, 170px); overflow: hidden; border-radius: 7px; background: #edf2f1;
}
body.sibo-site .sibo-header .sibo-mega-card-image img { width: 100%; height: 100%; object-fit: cover; }
body.sibo-site .sibo-header .sibo-mega-card-product .sibo-mega-card-image img { object-fit: contain; mix-blend-mode: multiply; padding: 10px; }
body.sibo-site .sibo-header .sibo-mega-card-link {
    font-size: 14px; font-weight: 600; line-height: 1.45; padding-right: 20px;
    color: #f3f7f6; margin-block: auto 0; overflow-wrap: anywhere;
}
body.sibo-site .sibo-header .sibo-mega-card-link::after { content: ''; position: absolute; inset: 0; border-radius: 12px; }
body.sibo-site .sibo-header .sibo-mega-card>.sibo-arrow { position: absolute; right: 12px; bottom: 17px; width: 16px; height: 16px; color: #66d3cb; pointer-events: none; }
body.sibo-site .sibo-header .sibo-mega-descendants { position: relative; z-index: 1; font-size: 12px; }
body.sibo-site .sibo-header .sibo-mega-rail { border-left: 1px solid #ffffff1c; padding-left: 26px; }
body.sibo-site .sibo-header .sibo-mega-rail-title { font-size: 13px; color: #93a6a6; margin-bottom: 18px; }
body.sibo-site .sibo-header .sibo-mega-rail-link { display: block; font-size: 14px; line-height: 1.5; color: #f3f7f6; margin-bottom: 18px; }
body.sibo-site .sibo-header .sibo-mega-rail-link+.sibo-mega-rail-title { margin-top: 36px; }
body.sibo-site .sibo-header .sibo-mega-rail-link:hover,
body.sibo-site .sibo-header .sibo-mega-overview:hover { color: #66d3cb; }
body.sibo-site .sibo-header :is(a,button):focus-visible { outline: 2px solid #66d3cb; outline-offset: 4px; }
body.sibo-site .sibo-nav-backdrop { background: #020a0b88; }
/* Keep the approved split hero and working inquiry form clear of the overlay. */
body.sibo-home .sibo-hero-inquiry { padding-top: calc(48px + 96px); }
body.sibo-home .sibo-hero-visual .sibo-hero-content { padding-top: calc(75px + 96px); }
body.sibo-home .sibo-hero-visual { min-height: 856px; }
@media(min-width:1700px) {
    body.sibo-home .sibo-hero-inquiry { padding-top: 156px; }
    body.sibo-home .sibo-hero-visual { min-height: 926px; }
}
@media(min-width:1001px) and (max-width:1200px) {
    body.sibo-site .sibo-header .sibo-header-inner { gap: 18px; width: calc(100% - 40px); }
    body.sibo-site .sibo-header .sibo-brand { flex-basis: 126px; }
    body.sibo-site .sibo-header .sibo-brand img { width: 126px; }
    body.sibo-site .sibo-header .sibo-nav-list { gap: 16px; }
    body.sibo-site .sibo-header .sibo-nav-link { font-size: 13px; }
    body.sibo-site .sibo-header .sibo-mega-layout { gap: 22px; padding: 20px; grid-template-columns: .8fr 2.2fr .65fr; }
    body.sibo-site .sibo-header .sibo-mega-card { padding: 12px; }
    body.sibo-site .sibo-header .sibo-mega-card-link { font-size: 12px; }
    body.sibo-site .sibo-header .sibo-mega-rail { padding-left: 18px; }
}
@media(max-width:1000px) {
    body.sibo-site { --sibo-header-height: 80px; --sibo-header-inset: 0px; }
    body.sibo-site .sibo-header .sibo-header-inner { width: calc(100% - 40px); height: var(--sibo-header-height); gap: 16px; }
    body.sibo-site .sibo-header .sibo-brand { flex-basis: 130px; }
    body.sibo-site .sibo-header .sibo-brand img { width: 130px; }
    body.sibo-site .sibo-header .sibo-header-cta { margin-left: auto; }
    body.sibo-site .sibo-header .sibo-menu-toggle { border: 1px solid #ffffff40; border-radius: 8px; background: transparent; color: white; flex-shrink: 0; }
    body.sibo-site .sibo-header .sibo-navigation {
        margin: 0; background: var(--sibo-header-surface); padding: 12px 20px 24px;
        left: -1px; right: -1px; border-radius: 0 0 16px 16px;
        border: 1px solid #ffffff15; border-top: 0;
        max-height: calc(100dvh - var(--sibo-header-offset) - 100px);
        overscroll-behavior: contain;
    }
    body.sibo-site.sibo-mobile-open .sibo-header { border-radius: 0; }
    body.sibo-site.sibo-mobile-open .sibo-nav-backdrop { visibility: visible; opacity: 1; }
    body.sibo-site .sibo-header .sibo-nav-list { display: block; }
    body.sibo-site .sibo-header .sibo-nav-label { height: 58px; border-bottom: 1px solid #ffffff1c; }
    body.sibo-site .sibo-header .sibo-nav-link { font-size: 17px; }
    body.sibo-site .sibo-header .sibo-nav-link::after { display: none; }
    body.sibo-site .sibo-header .sibo-mega { background: transparent; border: 0; box-shadow: none; overflow: visible; max-height: none; }
    body.sibo-site .sibo-header .sibo-mega-layout { display: block; padding: 16px 0; }
    body.sibo-site .sibo-header .sibo-mega-scenes { display: none; }
    body.sibo-site .sibo-header .sibo-mega-cards { grid-template-columns: repeat(2,minmax(0,1fr)); gap: 10px; }
    body.sibo-site .sibo-header .sibo-mega-card { padding: 12px; }
    body.sibo-site .sibo-header .sibo-mega-card-image { height: 130px; }
    body.sibo-site .sibo-header .sibo-mega-card-link { font-size: 13px; }
    body.sibo-site .sibo-header .sibo-mega-rail { display: none; }
    body.sibo-site.sibo-mobile-open { overflow: hidden; }
    body.sibo-home .sibo-hero-visual .sibo-hero-content { padding-top: 145px; }
    body.sibo-home .sibo-hero-visual { min-height: 600px; }
    body.sibo-home .sibo-hero-inquiry { padding-top: 42px; }
}
@media(max-width:782px) { body.admin-bar.sibo-site { --sibo-header-offset: 46px; } }
@media(max-width:600px) {
    body.sibo-site { --sibo-header-height: 76px; --sibo-header-inset: 0px; }
    body.sibo-site .sibo-header .sibo-header-inner { width: calc(100% - 32px); gap: 12px; }
    body.sibo-site .sibo-header .sibo-brand { flex-basis: 104px; }
    body.sibo-site .sibo-header .sibo-brand img { width: 104px; }
    body.sibo-site.sibo-header-scrolled .sibo-header,
    body.sibo-site.sibo-mobile-open .sibo-header { top: var(--sibo-header-offset); }
    body.sibo-site .sibo-header .sibo-mega-card-image { height: 100px; }
    body.sibo-home .sibo-hero-visual .sibo-hero-content { padding-top: 124px; }
    body.sibo-home .sibo-hero-inquiry { padding-top: 38px; }
    body.sibo-home .sibo-hero-visual { min-height: 616px; }
}
@media(prefers-reduced-motion: reduce) {
    body.sibo-site .sibo-header, body.sibo-site .sibo-header * { transition: none !important; }
}

/* A category without published photography stays typographic, never a broken-image placeholder. */
body.sibo-site .sibo-header .sibo-mega-card-no-image {
    justify-content: center; background: radial-gradient(ellipse at 100% 0%,#009e9628,transparent 80%),#252f31;
}
body.sibo-site .sibo-header .sibo-mega-card-no-image .sibo-mega-card-link { margin-block: auto; }
body.sibo-site :is(#sibo-main,#sibo-products,#sibo-applications,#sibo-about) { scroll-margin-top: calc(var(--sibo-header-offset) + 110px); }
@media(max-width:1000px) {
    body.sibo-site .sibo-header .sibo-menu-toggle .sibo-menu-lines { position: relative; height: 14px; border: 0; transform: none; background: linear-gradient(currentColor,currentColor) center / 100% 1px no-repeat; transition: background-size .2s; }
    body.sibo-site .sibo-header .sibo-menu-lines::before,
    body.sibo-site .sibo-header .sibo-menu-lines::after {
        content: ''; position: absolute; left: 0; width: 100%; height: 1px; background: currentColor; transition: transform .2s;
    }
    body.sibo-site .sibo-header .sibo-menu-lines::before { top: 0; }
    body.sibo-site .sibo-header .sibo-menu-lines::after { bottom: 0; }
    body.sibo-site .sibo-header .sibo-menu-toggle[aria-expanded=true] .sibo-menu-lines { background-size: 0 1px; }
    body.sibo-site .sibo-header .sibo-menu-toggle[aria-expanded=true] .sibo-menu-lines::before { transform: translateY(6.5px) rotate(45deg); }
    body.sibo-site .sibo-header .sibo-menu-toggle[aria-expanded=true] .sibo-menu-lines::after { transform: translateY(-6.5px) rotate(-45deg); }
}

/* No-script fallback: navigation remains in normal flow, never an unclosable overlay. */
@media(max-width:1000px) {
    body.sibo-site:not(.sibo-nav-ready) .sibo-header { position: relative; top: auto; background: var(--sibo-header-surface); }
    body.sibo-site:not(.sibo-nav-ready) .sibo-header-spacer { display: none; }
    body.sibo-site:not(.sibo-nav-ready) .sibo-header .sibo-header-inner { height: auto; flex-wrap: wrap; padding-block: 18px; }
    body.sibo-site:not(.sibo-nav-ready) .sibo-header .sibo-menu-toggle { display: none; }
    body.sibo-site:not(.sibo-nav-ready) .sibo-header .sibo-navigation { position: static; flex-basis: 100%; order: 4; padding: 0; max-height: none; overflow: visible; border: 0; }
}