/* ==============================================================
   INTERNATIONAL KITE FESTIVAL
   COMMON HEADER - ANIMATED KITE SKY

   Use this SAME file on:
   index.html
   about.html
   gallery.html
   contact.html
   frmRegistration.aspx

   IMPORTANT:
   Do not add menu/header positioning CSS inside individual pages.
============================================================== */

:root {
    --ikfc-header-height: 96px;
    --ikfc-sky-top: #0a4264;
    --ikfc-sky-bottom: #071f32;
    --ikfc-text: #ffffff;
    --ikfc-pink: #ff2f67;
    --ikfc-pink-2: #ff4e7c;
    --ikfc-orange: #ff7e2c;
    --ikfc-orange-2: #ff9c45;
}


/* ==========================================================
   COMMON HEADER PLACEHOLDER
========================================================== */

#commonHeader {
    width: 100% !important;
    height: 0 !important;
    min-height: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
}


/* ==========================================================
   FIXED HEADER
========================================================== */

#ikfCommonHeader.ikfc-header {
    position: fixed !important;
    top: 0 !important;
    right: 0 !important;
    left: 0 !important;
    width: 100% !important;
    height: var(--ikfc-header-height) !important;
    min-height: var(--ikfc-header-height) !important;
    margin: 0 !important;
    padding: 0 !important;
    z-index: 2147483000 !important;
    overflow: hidden !important;
    background: linear-gradient( 180deg, rgba(11, 67, 99, .96) 0%, rgba(5, 34, 54, .98) 100% ) !important;
    border: 0 !important;
    border-bottom: 1px solid rgba(255,255,255,.15) !important;
    border-radius: 0 !important;
    box-shadow: 0 8px 26px rgba(0,0,0,.18) !important;
    transform: none !important;
    animation: none !important;
    box-sizing: border-box !important;
}


/* ==========================================================
   ANIMATED SKY
========================================================== */

#ikfCommonHeader .ikfc-sky {
    position: absolute;
    inset: 0;
    z-index: 0;
    overflow: hidden;
    pointer-events: none;
}


    /* subtle sky glow */
    #ikfCommonHeader .ikfc-sky::before {
        content: "";
        position: absolute;
        inset: 0;
        background: radial-gradient( circle at 14% 20%, rgba(255, 188, 90, .10), transparent 24% ), radial-gradient( circle at 82% 15%, rgba(87, 205, 239, .12), transparent 22% );
        pointer-events: none;
    }


/* ----------------------------------------------------------
   KITES
---------------------------------------------------------- */

#ikfCommonHeader .ikfc-kite {
    --kite-size: 22px;
    --kite-color-a: #ff8a32;
    --kite-color-b: #ffd166;
    position: absolute;
    width: var(--kite-size);
    height: var(--kite-size);
    opacity: .72;
    animation: ikfcKiteFloat 8s ease-in-out infinite;
}


    #ikfCommonHeader .ikfc-kite > i {
        position: absolute;
        inset: 0;
        display: block;
        overflow: hidden;
        background: linear-gradient( 135deg, var(--kite-color-a) 0 49%, rgba(255,255,255,.72) 50% 52%, var(--kite-color-b) 53% 100% );
        border: 1px solid rgba(255,255,255,.30);
        clip-path: polygon( 50% 0, 100% 50%, 50% 100%, 0 50% );
        box-shadow: 0 5px 12px rgba(0,0,0,.10);
    }


        #ikfCommonHeader .ikfc-kite > i::before {
            content: "";
            position: absolute;
            left: 50%;
            top: 8%;
            bottom: 8%;
            width: 1px;
            background: rgba(255,255,255,.48);
            transform: translateX(-50%);
        }


        #ikfCommonHeader .ikfc-kite > i::after {
            content: "";
            position: absolute;
            top: 50%;
            left: 8%;
            right: 8%;
            height: 1px;
            background: rgba(255,255,255,.48);
            transform: translateY(-50%);
        }


    #ikfCommonHeader .ikfc-kite > b {
        position: absolute;
        left: 50%;
        top: calc(100% - 1px);
        width: 1px;
        height: 38px;
        background: linear-gradient( rgba(255,255,255,.44), transparent );
        transform-origin: top center;
        animation: ikfcTailWave 2.5s ease-in-out infinite;
    }


/* Kite positions */
#ikfCommonHeader .ikfc-kite-1 {
    --kite-size: 24px;
    --kite-color-a: #ff8a32;
    --kite-color-b: #ffc85c;
    left: 39%;
    top: 13px;
    animation-duration: 7.8s;
}


#ikfCommonHeader .ikfc-kite-2 {
    --kite-size: 17px;
    --kite-color-a: #46bee4;
    --kite-color-b: #8ce5f8;
    left: 58%;
    top: 48px;
    opacity: .58;
    animation-duration: 9s;
    animation-delay: -3s;
}


#ikfCommonHeader .ikfc-kite-3 {
    --kite-size: 19px;
    --kite-color-a: #ff5c79;
    --kite-color-b: #ff9f5a;
    right: 13%;
    top: 14px;
    opacity: .62;
    animation-duration: 8.5s;
    animation-delay: -5s;
}


/* ----------------------------------------------------------
   WIND LINES
---------------------------------------------------------- */

#ikfCommonHeader .ikfc-wind {
    position: absolute;
    height: 28px;
    border-top: 1px solid rgba(255,255,255,.13);
    border-radius: 50%;
    opacity: .60;
    animation: ikfcWindMove 7s ease-in-out infinite;
}


#ikfCommonHeader .ikfc-wind-1 {
    width: 150px;
    left: 28%;
    top: 23px;
}


#ikfCommonHeader .ikfc-wind-2 {
    width: 120px;
    right: 26%;
    top: 50px;
    animation-delay: -2.5s;
}


#ikfCommonHeader .ikfc-wind-3 {
    width: 100px;
    left: 70%;
    top: 17px;
    opacity: .35;
    animation-delay: -4s;
}


/* ----------------------------------------------------------
   CLOUDS
---------------------------------------------------------- */

#ikfCommonHeader .ikfc-cloud {
    position: absolute;
    width: 170px;
    height: 45px;
    opacity: .10;
    background: radial-gradient( circle at 18% 68%, #ffffff 0 19%, transparent 20% ), radial-gradient( circle at 38% 48%, #ffffff 0 27%, transparent 28% ), radial-gradient( circle at 58% 60%, #ffffff 0 23%, transparent 24% ), radial-gradient( circle at 78% 68%, #ffffff 0 17%, transparent 18% );
    animation: ikfcCloudDrift 20s ease-in-out infinite;
}


#ikfCommonHeader .ikfc-cloud-1 {
    left: 5%;
    top: 16px;
}


#ikfCommonHeader .ikfc-cloud-2 {
    right: 4%;
    top: 42px;
    opacity: .07;
    animation-delay: -9s;
}


/* ==========================================================
   HEADER INNER
========================================================== */

#ikfCommonHeader .ikfc-header-inner {
    position: relative !important;
    z-index: 3 !important;
    width: 100% !important;
    max-width: none !important;
    height: var(--ikfc-header-height) !important;
    min-height: var(--ikfc-header-height) !important;
    margin: 0 !important;
    padding: 0 5.2% !important;
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    gap: 28px !important;
}


/* ==========================================================
   LOGO
========================================================== */

#ikfCommonHeader .ikfc-brand {
    flex: 0 0 520px !important;
    width: 520px !important;
    min-width: 520px !important;
    max-width: 520px !important;
    margin: 0 !important;
    padding: 0 !important;
}


#ikfCommonHeader .ikfc-logo-link {
    display: flex !important;
    align-items: center !important;
    width: 100% !important;
    height: 76px !important;
    margin: 0 !important;
    padding: 0 !important;
    text-decoration: none !important;
}


#ikfCommonHeader .ikfc-logo {
    display: block !important;
    width: auto !important;
    max-width: 500px !important;
    height: auto !important;
    max-height: 72px !important;
    margin: 0 !important;
    padding: 0 !important;
    object-fit: contain !important;
    filter: drop-shadow( 0 2px 4px rgba(0,0,0,.35) ) !important;
}


/* ==========================================================
   NAVIGATION
========================================================== */

#ikfCommonHeader .ikfc-nav {
    flex: 1 1 auto !important;
    min-width: 0 !important;
    height: 100% !important;
    margin: 0 !important;
    padding: 0 !important;
    display: flex !important;
    align-items: center !important;
    justify-content: flex-end !important;
    background: transparent !important;
    border: 0 !important;
    box-shadow: none !important;
}


#ikfCommonHeader .ikfc-menu {
    display: flex !important;
    align-items: center !important;
    justify-content: flex-end !important;
    gap: 10px !important;
    width: auto !important;
    margin: 0 !important;
    padding: 0 !important;
    list-style: none !important;
}


    #ikfCommonHeader .ikfc-menu > li {
        float: none !important;
        display: block !important;
        margin: 0 !important;
        padding: 0 !important;
        list-style: none !important;
    }


        /* ==========================================================
   MENU ITEM
========================================================== */

        #ikfCommonHeader .ikfc-menu > li > a {
            position: relative !important;
            min-height: 50px !important;
            display: flex !important;
            align-items: center !important;
            justify-content: center !important;
            margin: 0 !important;
            padding: 0 16px !important;
            color: rgba(255,255,255,.92) !important;
            background: transparent !important;
            border: 0 !important;
            border-radius: 0 !important;
            font-family: "Segoe UI", Tahoma, Arial, sans-serif !important;
            font-size: 12px !important;
            line-height: 50px !important;
            font-weight: 800 !important;
            letter-spacing: 1px !important;
            text-transform: uppercase !important;
            white-space: nowrap !important;
            text-decoration: none !important;
            text-shadow: 0 1px 3px rgba(0,0,0,.55) !important;
            transition: color .22s ease, background .22s ease, transform .22s ease, box-shadow .22s ease !important;
        }


        /* ==========================================================
   HOVER
========================================================== */

        #ikfCommonHeader
        .ikfc-menu > li:not(.active):not(.ikfc-register) > a::after {
            content: "";
            position: absolute !important;
            left: 16px !important;
            right: 16px !important;
            bottom: 6px !important;
            height: 2px !important;
            background: #ffffff !important;
            opacity: .85 !important;
            transform: scaleX(0) !important;
            transform-origin: center !important;
            transition: transform .22s ease !important;
        }


        #ikfCommonHeader
        .ikfc-menu > li:not(.active):not(.ikfc-register) > a:hover,
        #ikfCommonHeader
        .ikfc-menu > li:not(.active):not(.ikfc-register) > a:focus {
            color: #ffffff !important;
            background: rgba(255,255,255,.075) !important;
            transform: translateY(-1px) !important;
            outline: none !important;
        }


            #ikfCommonHeader
            .ikfc-menu > li:not(.active):not(.ikfc-register) > a:hover::after,
            #ikfCommonHeader
            .ikfc-menu > li:not(.active):not(.ikfc-register) > a:focus::after {
                transform: scaleX(1) !important;
            }


        /* ==========================================================
   ACTIVE
========================================================== */

        #ikfCommonHeader .ikfc-menu > li.active > a {
            color: #ffffff !important;
            background: linear-gradient( 135deg, var(--ikfc-pink), var(--ikfc-pink-2) ) !important;
            box-shadow: 0 8px 20px rgba(255,47,103,.27) !important;
            text-shadow: none !important;
        }


            #ikfCommonHeader .ikfc-menu > li.active > a::after {
                display: none !important;
            }


        /* ==========================================================
   REGISTRATION
========================================================== */

        #ikfCommonHeader .ikfc-menu > li.ikfc-register {
            margin-left: 7px !important;
        }


            #ikfCommonHeader
            .ikfc-menu > li.ikfc-register > a {
                min-width: 128px !important;
                padding: 0 18px !important;
                color: #ffffff !important;
                background: linear-gradient( 135deg, var(--ikfc-orange), var(--ikfc-orange-2) ) !important;
                border-radius: 11px !important;
                text-transform: none !important;
                letter-spacing: .35px !important;
                text-shadow: none !important;
                box-shadow: 0 8px 22px rgba(255,126,44,.28) !important;
            }


                #ikfCommonHeader
                .ikfc-menu > li.ikfc-register > a:hover,
                #ikfCommonHeader
                .ikfc-menu > li.ikfc-register > a:focus {
                    color: #ffffff !important;
                    transform: translateY(-2px) !important;
                    box-shadow: 0 13px 30px rgba(255,126,44,.38) !important;
                    outline: none !important;
                }


/* ==========================================================
   MOBILE TOGGLE
========================================================== */

#ikfCommonHeader .ikfc-mobile-toggle {
    display: none !important;
    width: 44px !important;
    height: 42px !important;
    margin: 0 !important;
    padding: 9px !important;
    cursor: pointer !important;
    background: rgba(0,0,0,.22) !important;
    border: 1px solid rgba(255,255,255,.26) !important;
    border-radius: 9px !important;
}


    #ikfCommonHeader .ikfc-mobile-toggle span {
        display: block !important;
        width: 24px !important;
        height: 2px !important;
        margin: 5px auto !important;
        background: #ffffff !important;
        border-radius: 10px !important;
        transition: transform .22s ease, opacity .22s ease !important;
    }


    #ikfCommonHeader
    .ikfc-mobile-toggle.is-open
    span:nth-child(1) {
        transform: translateY(7px) rotate(45deg) !important;
    }


    #ikfCommonHeader
    .ikfc-mobile-toggle.is-open
    span:nth-child(2) {
        opacity: 0 !important;
    }


    #ikfCommonHeader
    .ikfc-mobile-toggle.is-open
    span:nth-child(3) {
        transform: translateY(-7px) rotate(-45deg) !important;
    }


/* ==========================================================
   ANIMATIONS
========================================================== */

@keyframes ikfcKiteFloat {

    0%, 100% {
        transform: translate3d(0, 0, 0) rotate(-4deg);
    }

    50% {
        transform: translate3d(14px, -8px, 0) rotate(5deg);
    }
}


@keyframes ikfcTailWave {

    0%, 100% {
        transform: translateX(-50%) rotate(7deg);
    }

    50% {
        transform: translateX(-50%) rotate(-10deg);
    }
}


@keyframes ikfcWindMove {

    0%, 100% {
        transform: translateX(0) scaleX(.90);
        opacity: .28;
    }

    50% {
        transform: translateX(22px) scaleX(1.08);
        opacity: .64;
    }
}


@keyframes ikfcCloudDrift {

    0%, 100% {
        transform: translateX(0);
    }

    50% {
        transform: translateX(30px);
    }
}


/* ==========================================================
   MEDIUM DESKTOP
========================================================== */

@media (max-width: 1280px) {

    #ikfCommonHeader
    .ikfc-header-inner {
        padding: 0 3.5% !important;
        gap: 18px !important;
    }


    #ikfCommonHeader
    .ikfc-brand {
        flex-basis: 430px !important;
        width: 430px !important;
        min-width: 430px !important;
        max-width: 430px !important;
    }


    #ikfCommonHeader
    .ikfc-logo {
        max-width: 410px !important;
    }


    #ikfCommonHeader
    .ikfc-menu {
        gap: 4px !important;
    }


        #ikfCommonHeader
        .ikfc-menu > li > a {
            padding: 0 12px !important;
            font-size: 11.5px !important;
            letter-spacing: .7px !important;
        }


        #ikfCommonHeader
        .ikfc-menu > li.ikfc-register > a {
            min-width: 118px !important;
            padding: 0 16px !important;
        }


    #ikfCommonHeader .ikfc-kite-1 {
        left: 36%;
    }


    #ikfCommonHeader .ikfc-kite-2 {
        left: 55%;
    }
}


/* ==========================================================
   TABLET / MOBILE
========================================================== */

@media (max-width: 991px) {

    :root {
        --ikfc-header-height: 78px;
    }


    #ikfCommonHeader
    .ikfc-header-inner {
        height: 78px !important;
        min-height: 78px !important;
        padding: 0 14px !important;
        display: flex !important;
    }


    #ikfCommonHeader
    .ikfc-brand {
        flex: 0 1 auto !important;
        width: calc(100% - 64px) !important;
        min-width: 0 !important;
        max-width: none !important;
    }


    #ikfCommonHeader
    .ikfc-logo-link {
        height: 60px !important;
    }


    #ikfCommonHeader
    .ikfc-logo {
        width: auto !important;
        max-width: 350px !important;
        max-height: 55px !important;
    }


    #ikfCommonHeader
    .ikfc-mobile-toggle {
        position: absolute !important;
        top: 18px !important;
        right: 14px !important;
        display: block !important;
    }


    /* Hide some decoration on smaller screens */
    #ikfCommonHeader
    .ikfc-kite-2,
    #ikfCommonHeader
    .ikfc-kite-3,
    #ikfCommonHeader
    .ikfc-wind-2,
    #ikfCommonHeader
    .ikfc-wind-3 {
        display: none !important;
    }


    #ikfCommonHeader
    .ikfc-kite-1 {
        left: auto;
        right: 82px;
        top: 13px;
        opacity: .45;
    }


    #ikfCommonHeader
    .ikfc-nav {
        position: fixed !important;
        top: 78px !important;
        right: 0 !important;
        left: 0 !important;
        z-index: 2147482999 !important;
        display: block !important;
        width: 100% !important;
        height: auto !important;
        max-height: 0 !important;
        overflow: hidden !important;
        visibility: hidden !important;
        opacity: 0 !important;
        background: linear-gradient( 180deg, rgba(8,62,91,.98), rgba(4,31,49,.99) ) !important;
        border-top: 1px solid rgba(255,255,255,.12) !important;
        box-shadow: 0 18px 35px rgba(0,0,0,.28) !important;
        transition: max-height .28s ease, opacity .22s ease, visibility .22s ease !important;
    }


        #ikfCommonHeader
        .ikfc-nav.is-open {
            max-height: calc(100vh - 78px) !important;
            overflow-y: auto !important;
            visibility: visible !important;
            opacity: 1 !important;
        }


    #ikfCommonHeader
    .ikfc-menu {
        display: block !important;
        width: 100% !important;
        padding: 10px 12px 14px !important;
    }


        #ikfCommonHeader
        .ikfc-menu > li {
            width: 100% !important;
        }


            #ikfCommonHeader
            .ikfc-menu > li > a,
            #ikfCommonHeader
            .ikfc-menu > li.ikfc-register > a {
                width: 100% !important;
                min-height: 48px !important;
                margin: 3px 0 !important;
                padding: 0 16px !important;
                justify-content: flex-start !important;
                border-radius: 7px !important;
                line-height: 48px !important;
                text-transform: none !important;
                letter-spacing: .25px !important;
            }


            #ikfCommonHeader
            .ikfc-menu > li.ikfc-register {
                margin-left: 0 !important;
            }
}


/* ==========================================================
   SMALL MOBILE
========================================================== */

@media (max-width: 480px) {

    :root {
        --ikfc-header-height: 72px;
    }


    #ikfCommonHeader.ikfc-header,
    #ikfCommonHeader
    .ikfc-header-inner {
        height: 72px !important;
        min-height: 72px !important;
    }


    #ikfCommonHeader
    .ikfc-logo {
        max-width: 235px !important;
        max-height: 48px !important;
    }


    #ikfCommonHeader
    .ikfc-mobile-toggle {
        top: 15px !important;
    }


    #ikfCommonHeader
    .ikfc-nav {
        top: 72px !important;
    }


        #ikfCommonHeader
        .ikfc-nav.is-open {
            max-height: calc(100vh - 72px) !important;
        }


    #ikfCommonHeader
    .ikfc-kite-1 {
        display: none !important;
    }
}


/* ==========================================================
   ACCESSIBILITY
========================================================== */

@media (prefers-reduced-motion: reduce) {

    #ikfCommonHeader
    .ikfc-kite,
    #ikfCommonHeader
    .ikfc-kite > b,
    #ikfCommonHeader
    .ikfc-wind,
    #ikfCommonHeader
    .ikfc-cloud {
        animation: none !important;
    }


    #ikfCommonHeader
    .ikfc-menu > li > a,
    #ikfCommonHeader
    .ikfc-mobile-toggle span,
    #ikfCommonHeader
    .ikfc-nav {
        transition: none !important;
    }
}


/* ==========================================================
   CLEAN LOGO AREA - NO CLOUD / GLOW BEHIND LOGO
========================================================== */

/* Remove all cloudy/glow decoration behind the header logo */
#ikfCommonHeader .ikfc-sky::before {
    display: none !important;
    content: none !important;
}

#ikfCommonHeader .ikfc-cloud,
#ikfCommonHeader .ikfc-cloud-1,
#ikfCommonHeader .ikfc-cloud-2 {
    display: none !important;
}

/* Keep decorative kites away from the logo area */
#ikfCommonHeader .ikfc-kite-1 {
    left: 45% !important;
}

#ikfCommonHeader .ikfc-kite-2 {
    left: 62% !important;
}

#ikfCommonHeader .ikfc-kite-3 {
    right: 9% !important;
}

/* Keep wind lines away from the brand area too */
#ikfCommonHeader .ikfc-wind-1 {
    left: 38% !important;
}

#ikfCommonHeader .ikfc-wind-2 {
    right: 24% !important;
}

#ikfCommonHeader .ikfc-wind-3 {
    left: 72% !important;
}

/* Make festival logo larger and clearer */
#ikfCommonHeader .ikfc-brand {
    flex: 0 0 560px !important;
    width: 560px !important;
    min-width: 560px !important;
    max-width: 560px !important;
}

#ikfCommonHeader .ikfc-logo-link {
    height: 82px !important;
}

#ikfCommonHeader .ikfc-logo {
    width: auto !important;
    max-width: 545px !important;
    max-height: 78px !important;
    filter: drop-shadow(0 2px 4px rgba(0,0,0,.30)) !important;
}

/* Remove any background texture behind logo itself */
#ikfCommonHeader .ikfc-brand,
#ikfCommonHeader .ikfc-logo-link {
    background: transparent !important;
    box-shadow: none !important;
}

/* Medium desktop */
@media (max-width: 1280px) {

    #ikfCommonHeader .ikfc-brand {
        flex-basis: 455px !important;
        width: 455px !important;
        min-width: 455px !important;
        max-width: 455px !important;
    }

    #ikfCommonHeader .ikfc-logo {
        max-width: 440px !important;
        max-height: 68px !important;
    }

    #ikfCommonHeader .ikfc-kite-1 {
        left: 43% !important;
    }
}

/* Tablet */
@media (max-width: 991px) {

    #ikfCommonHeader .ikfc-brand {
        flex: 0 1 auto !important;
        width: calc(100% - 64px) !important;
        min-width: 0 !important;
        max-width: none !important;
    }

    #ikfCommonHeader .ikfc-logo-link {
        height: 60px !important;
    }

    #ikfCommonHeader .ikfc-logo {
        max-width: 365px !important;
        max-height: 57px !important;
    }

    #ikfCommonHeader .ikfc-kite-1 {
        display: none !important;
    }
}

/* Small mobile */
@media (max-width: 480px) {

    #ikfCommonHeader .ikfc-logo {
        max-width: 250px !important;
        max-height: 50px !important;
    }
}


/* ==========================================================
   FINAL MENU BAR - KITE DECORATION REMOVED
   Logo, menu, sky gradient and subtle wind remain.
========================================================== */

#ikfCommonHeader .ikfc-kite,
#ikfCommonHeader .ikfc-kite-1,
#ikfCommonHeader .ikfc-kite-2,
#ikfCommonHeader .ikfc-kite-3 {
    display: none !important;
}

/* Keep menu background clean and professional */
#ikfCommonHeader.ikfc-header {
    background: linear-gradient( 180deg, rgba(10, 66, 98, .97) 0%, rgba(5, 32, 51, .99) 100% ) !important;
}

/* Logo stays large and clean */
#ikfCommonHeader .ikfc-brand {
    flex: 0 0 560px !important;
    width: 560px !important;
    min-width: 560px !important;
    max-width: 560px !important;
}

#ikfCommonHeader .ikfc-logo-link {
    height: 82px !important;
}

#ikfCommonHeader .ikfc-logo {
    max-width: 545px !important;
    max-height: 78px !important;
    filter: drop-shadow(0 2px 4px rgba(0,0,0,.28)) !important;
}

/* Keep only very subtle wind animation in empty sky space */
#ikfCommonHeader .ikfc-wind {
    opacity: .24 !important;
}

#ikfCommonHeader .ikfc-wind-1 {
    left: 40% !important;
}

#ikfCommonHeader .ikfc-wind-2 {
    right: 25% !important;
}

#ikfCommonHeader .ikfc-wind-3 {
    left: 72% !important;
}

/* Medium desktop */
@media (max-width: 1280px) {
    #ikfCommonHeader .ikfc-brand {
        flex-basis: 455px !important;
        width: 455px !important;
        min-width: 455px !important;
        max-width: 455px !important;
    }

    #ikfCommonHeader .ikfc-logo {
        max-width: 440px !important;
        max-height: 68px !important;
    }
}

/* Tablet */
@media (max-width: 991px) {
    #ikfCommonHeader .ikfc-brand {
        flex: 0 1 auto !important;
        width: calc(100% - 64px) !important;
        min-width: 0 !important;
        max-width: none !important;
    }

    #ikfCommonHeader .ikfc-logo-link {
        height: 60px !important;
    }

    #ikfCommonHeader .ikfc-logo {
        max-width: 365px !important;
        max-height: 57px !important;
    }

    /* keep mobile header cleaner */
    #ikfCommonHeader .ikfc-wind {
        display: none !important;
    }
}

/* Small mobile */
@media (max-width: 480px) {
    #ikfCommonHeader .ikfc-logo {
        max-width: 250px !important;
        max-height: 50px !important;
    }
}
