/* NaukriNotice v3 - mobile-only presentation layer */
.nn-mobile-bottom-nav{display:none}

@media (max-width: 767.98px){
  html,body{min-width:0!important;width:100%!important;overflow-x:hidden!important}
  body{padding-bottom:58px!important;font-size:13px!important;background:#eef2f7!important}
  .site-shell{width:100%!important;max-width:100%!important;min-width:0!important;margin:0!important;box-shadow:none!important;overflow:hidden!important}
  .site-shell .container{padding-left:8px!important;padding-right:8px!important}

  .top-banner img{height:68px!important;object-fit:cover!important;object-position:center!important}
  .main-navbar{margin:0!important;padding:7px 0!important;border-radius:0!important;background:#111827!important;border:0!important}
  .nav-inner{display:block!important}
  .brand{display:flex!important;align-items:center!important;margin-bottom:7px!important;color:#fff!important}
  .navbar-logo{width:38px!important;height:38px!important;object-fit:contain!important;border-radius:9px!important;margin-right:8px!important}
  .brand span{font-size:17px!important;line-height:1.05!important}
  .brand small{font-size:9px!important;color:#94a3b8!important}
  .nav-menu{display:flex!important;gap:7px!important;overflow-x:auto!important;white-space:nowrap!important;padding-bottom:2px!important;scrollbar-width:none}
  .nav-menu::-webkit-scrollbar{display:none}
  .nav-box{flex:0 0 auto!important;padding:7px 10px!important;border-radius:999px!important;font-size:11px!important;min-height:34px!important}

  .breaking-glow-box{min-height:0!important;padding:8px 10px!important}

  .nn-home-hero{padding:12px 0 10px!important;min-height:0!important}
  .nn-hero-glow,.nn-hero-trust,.nn-home-hero p{display:none!important}
  .nn-hero-content{max-width:none!important}
  .nn-hero-kicker{font-size:10px!important;padding:5px 9px!important;margin-bottom:6px!important}
  .nn-home-hero h1{font-size:20px!important;line-height:1.2!important;margin-bottom:8px!important}
  .nn-hero-search{display:grid!important;grid-template-columns:1fr auto!important;gap:6px!important;padding:5px!important;border-radius:12px!important}
  .nn-search-icon{display:none!important}
  .nn-hero-search input{min-width:0!important;height:36px!important;padding:8px 10px!important;font-size:11px!important}
  .nn-search-button{height:40px!important;padding:0 12px!important;font-size:11px!important;border-radius:9px!important}
  .nn-hero-shortcuts{display:flex!important;gap:6px!important;overflow-x:auto!important;white-space:nowrap!important;margin-top:8px!important;padding-bottom:2px!important;scrollbar-width:none}
  .nn-hero-shortcuts::-webkit-scrollbar{display:none}
  .nn-hero-shortcuts a{flex:0 0 auto!important;padding:6px 9px!important;font-size:10px!important;border-radius:999px!important}

  .home-boxes-section{padding:10px 0!important}
  .home-boxes-section .row{--bs-gutter-x:8px!important;--bs-gutter-y:8px!important}
  .home-boxes-section .row>[class*="col-"]{flex:0 0 50%!important;width:50%!important;max-width:50%!important;padding-left:4px!important;padding-right:4px!important}
  .home-update-box{min-height:0!important;height:100%!important;border-radius:10px!important;transform:none!important}
  .home-update-box::before{display:none!important}
  .home-update-box-title{padding:9px 4px!important;font-size:12px!important;line-height:1.2!important;white-space:normal!important}
  .home-update-list{padding:7px 6px 4px!important}
  .home-update-item{display:block!important;position:relative!important;margin:0!important;padding:4px 2px 4px 10px!important;line-height:1.3!important;min-width:0!important}
  .home-update-bullet{position:absolute!important;left:0!important;top:4px!important;width:10px!important;margin:0!important;font-size:15px!important;line-height:1!important;color:#f4b400!important}
  .home-update-item::before{display:none!important}
  .home-update-link,.home-update-link.box-link,.home-update-box .box-link{
    display:block!important;width:100%!important;min-width:0!important;max-width:100%!important;
    font-size:9px!important;line-height:1.28!important;font-weight:600!important;
    word-break:normal!important;overflow-wrap:break-word!important;white-space:normal!important;
    hyphens:none!important;padding:0!important;
  }
  .home-update-box-footer{padding:7px 4px!important}
  .home-update-view-more{min-width:0!important;padding:5px 8px!important;font-size:10px!important;box-shadow:none!important}

  .nn-footer{padding:24px 0 14px!important;margin-top:16px!important}
  .nn-footer-grid{grid-template-columns:1fr!important;gap:18px!important}
  .nn-footer-bottom{flex-direction:column!important;gap:6px!important}

  .nn-mobile-bottom-nav{position:fixed;display:grid;grid-template-columns:repeat(5,1fr);left:0;right:0;bottom:0;z-index:9999;height:58px;background:#111827;border-top:1px solid #334155;box-shadow:0 -4px 14px rgba(15,23,42,.18)}
  .nn-mobile-bottom-nav a{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:1px;color:#e5e7eb;text-decoration:none;font-size:9px;line-height:1.1}
  .nn-mobile-bottom-nav i{font-size:17px}
}

/* NaukriNotice v3 Stage 1.1
   Compact mobile navigation, breaking news and hero */
@media (max-width: 767.98px) {

    /* ---------- Main navigation: show all menu items ---------- */

    .main-navbar {
        padding: 5px 0 7px !important;
    }

    .main-navbar .container {
        padding-left: 6px !important;
        padding-right: 6px !important;
    }

    .brand {
        justify-content: center !important;
        margin-bottom: 5px !important;
    }

    .navbar-logo {
        width: 32px !important;
        height: 32px !important;
        margin-right: 6px !important;
    }

    .brand span {
        margin-left: 0 !important;
        font-size: 15px !important;
    }

    .brand small {
        display: none !important;
    }

    .nav-menu {
        display: grid !important;
        grid-template-columns: repeat(5, minmax(0, 1fr)) !important;
        gap: 4px !important;
        width: 100% !important;
        margin: 0 !important;
        padding: 0 !important;
        overflow: visible !important;
        white-space: normal !important;
    }

    .nav-box {
        display: flex !important;
        min-width: 0 !important;
        min-height: 32px !important;
        padding: 5px 2px !important;
        flex-direction: column !important;
        align-items: center !important;
        justify-content: center !important;
        gap: 2px !important;
        overflow: hidden !important;
        border-radius: 6px !important;
        font-size: 8px !important;
        line-height: 1.05 !important;
        text-align: center !important;
        white-space: normal !important;
    }

    .nav-box i {
        font-size: 12px !important;
        line-height: 1 !important;
    }

    .nav-box span {
        display: block !important;
        width: 100% !important;
        overflow: hidden !important;
        text-overflow: ellipsis !important;
        white-space: nowrap !important;
    }

    /* Put the final four menu items on the second row */
    .nav-menu .nav-box:nth-child(n+6) {
        grid-column: auto !important;
    }

    /* ---------- Breaking news: compact single strip ---------- */

    .breaking-glow-box {
        min-height: 30px !important;
        padding: 3px 0 !important;
        border-bottom-width: 1px !important;
    }

    .breaking-glow-box .container {
        min-height: 24px !important;
        padding-left: 6px !important;
        padding-right: 6px !important;
    }

    .breaking-label {
        flex: 0 0 auto !important;
        min-width: 0 !important;
        margin-right: 7px !important;
        font-size: 9px !important;
        line-height: 1 !important;
    }

    .live-fire {
        font-size: 18px !important;
        filter: drop-shadow(0 0 4px rgba(255, 140, 0, .75)) !important;
    }

    .breaking-glow-box marquee {
        height: 22px !important;
        line-height: 22px !important;
    }

    .breaking-link {
        margin-right: 18px !important;
        font-size: 9px !important;
        line-height: 22px !important;
    }

    /* ---------- Hero: compact information/search strip ---------- */

    .nn-home-hero {
        padding: 7px 0 8px !important;
        min-height: 0 !important;
    }

    .nn-home-hero::before,
    .nn-hero-glow {
        display: none !important;
    }

    .nn-hero-kicker {
        display: none !important;
    }

    .nn-home-hero h1 {
        margin-bottom: 5px !important;
        font-size: 15px !important;
        line-height: 1.15 !important;
    }

    .nn-home-hero p,
    .nn-hero-trust {
        display: none !important;
    }

    .nn-hero-search {
        gap: 4px !important;
        max-width: 100% !important;
        padding: 3px !important;
        border-radius: 8px !important;
        box-shadow: 0 5px 12px rgba(15, 23, 42, .18) !important;
    }

    .nn-hero-search input {
        height: 32px !important;
        padding: 5px 7px !important;
        font-size: 9px !important;
    }

    .nn-search-button {
        height: 32px !important;
        padding: 0 8px !important;
        font-size: 9px !important;
        border-radius: 6px !important;
    }

    .nn-hero-shortcuts {
        display: grid !important;
        grid-template-columns: repeat(5, minmax(0, 1fr)) !important;
        gap: 4px !important;
        margin-top: 5px !important;
        padding: 0 !important;
        overflow: visible !important;
        white-space: normal !important;
    }

    .nn-hero-shortcuts a {
        min-width: 0 !important;
        padding: 5px 2px !important;
        overflow: hidden !important;
        border-radius: 6px !important;
        font-size: 8px !important;
        line-height: 1.05 !important;
        text-align: center !important;
        text-overflow: ellipsis !important;
        white-space: nowrap !important;
    }

    .nn-hero-shortcuts a i {
        margin-right: 1px !important;
        font-size: 9px !important;
    }

    /* Bring homepage cards closer to the top */
    .home-boxes-section {
        padding-top: 6px !important;
    }
}


/* NN MOBILE BANNER FIT FIX */
@media (max-width: 767.98px) {
    .top-banner {
        height: auto !important;
        min-height: 0 !important;
        overflow: visible !important;
        background: #02053b !important;
    }

    .top-banner img {
        display: block !important;
        width: 100% !important;
        height: auto !important;
        max-height: none !important;
        object-fit: contain !important;
        object-position: center center !important;
    }
}
