/* One visual rail keeps every homepage section aligned with the feature banner. */
#top{--b88-home-rail:min(1240px,calc(100% - 64px))}
#top>.home-hero-news,#top>.matches,#top>.home-news-slider,#top>.events-media,#top>.manifesto,#top>.signup{box-sizing:border-box;width:var(--b88-home-rail)!important;margin-left:auto!important;margin-right:auto!important}
#top>.matches{margin-top:42px!important;padding:46px 0 54px!important;border-top:1px solid #2c2c2a}
#top>.matches .section-title{margin-bottom:26px!important}
#top>.home-news-slider,#top>.events-media{margin-top:0!important;margin-bottom:42px!important;padding:28px 24px 24px!important;border:1px solid #302f2c;border-radius:12px!important;background:#141310!important}
#top>.home-news-slider .news-slider-card,#top>.events-media .event-media-slot{min-width:0}
#top>.manifesto{display:grid!important;grid-template-columns:minmax(0,1fr) minmax(280px,.78fr);gap:clamp(36px,7vw,110px);margin-top:0!important;margin-bottom:42px!important;padding:56px 0!important;border-top:1px solid #302f2c;border-bottom:1px solid #302f2c}
#top>.signup{margin-top:0!important;margin-bottom:62px!important;padding:30px 34px!important;border:1px solid #393632;border-radius:10px}
#top>.signup{display:grid!important;grid-template-columns:auto minmax(0,1fr) minmax(360px,430px);align-items:center!important;gap:22px!important}#top>.signup>#email-form{display:grid!important;grid-template-columns:minmax(0,1fr) auto;align-items:stretch;width:100%;margin:0!important}#top>.signup>#email-form input,#top>.signup>#email-form button{height:50px!important;margin:0!important}#top>.signup>#email-form button{display:inline-flex;align-items:center;justify-content:center;min-width:124px;padding-inline:18px!important;white-space:nowrap}
@media(max-width:760px){#top{--b88-home-rail:calc(100% - 30px)}#top>.matches{margin-top:30px!important;padding:37px 0 40px!important}#top>.home-news-slider,#top>.events-media{margin-bottom:30px!important;padding:23px 16px 19px!important;border-radius:10px!important}#top>.manifesto{grid-template-columns:1fr;gap:28px;margin-bottom:30px!important;padding:42px 0!important}#top>.signup{grid-template-columns:auto minmax(0,1fr);gap:15px!important;margin-bottom:38px!important;padding:24px!important}#top>.signup>#email-form{grid-column:1/-1}#top>.signup>#email-form input,#top>.signup>#email-form button{height:46px!important}}

/* Centre the B88 identity lock-up inside the left side of the manifesto. */
#top>.manifesto>.marquee{align-self:center!important;justify-self:center!important;text-align:center!important}

/* Homepage footer social links use the same compact circular icon system as the news desk. */
footer .home-footer-social{display:block!important}footer .home-footer-social>b{display:block;margin-bottom:13px;color:#fff;font:800 1.05rem/1 var(--font-body,"DM Sans",sans-serif);letter-spacing:0;text-transform:none}footer .home-footer-social nav{display:flex;gap:10px}footer .home-footer-social a{display:grid!important;place-items:center;width:38px;height:38px;padding:0!important;border:1px solid #fff!important;border-radius:50%;color:#fff!important;transition:background .18s ease,border-color .18s ease,color .18s ease,transform .18s ease}footer .home-footer-social a:hover{border-color:var(--lime,#fae12c)!important;background:var(--lime,#fae12c);color:#080808!important;transform:translateY(-2px)}footer .home-footer-social svg{width:16px;height:16px;fill:currentColor;stroke:currentColor}footer .home-footer-social a.instagram svg{fill:none;stroke-width:1.9}@media(max-width:760px){footer .home-footer-social>b{margin-bottom:11px}}

/* Footer columns share the same rail as the homepage sections. */
#top>footer>small{text-align:center!important}
#top>footer{box-sizing:border-box;display:grid!important;grid-template-columns:minmax(300px,1.65fr) minmax(130px,.72fr) minmax(130px,.72fr) minmax(220px,.9fr);align-items:start;gap:28px 48px;width:100%!important;margin:0!important;padding:42px max(32px,calc((100% - 1240px)/2)) 26px!important;border-top:1px solid #282828!important;background:#050505}#top>footer>.logo{align-self:center}#top>footer>.logo img{display:block}#top>footer>div:not(.home-footer-social){display:grid;gap:10px;align-content:start}#top>footer>div>b{margin:0;color:#aaa9a4;font:700 .67rem/1 "DM Mono",monospace;letter-spacing:.06em;text-transform:uppercase}#top>footer>div:not(.home-footer-social)>a{width:max-content;color:#fff;font:500 .82rem/1.15 "DM Sans",sans-serif}#top>footer>div:not(.home-footer-social)>a:hover{color:var(--lime,#fae12c)}#top>footer>.home-footer-social{justify-self:end;min-width:0}#top>footer>small{grid-column:1/-1;margin-top:8px;border-top:1px solid #242424;padding-top:18px;color:#85857e;font:500 .62rem/1.2 "DM Mono",monospace;letter-spacing:.04em}
@media(max-width:760px){#top>footer{grid-template-columns:repeat(2,minmax(0,1fr));gap:28px 22px;padding:34px 24px 22px!important}#top>footer>.logo{grid-column:1/-1}#top>footer>.home-footer-social{justify-self:start}#top>footer>small{margin-top:2px;padding-top:16px}}

/* Homepage footer follows the same protected logo/social zone as all news pages. */
#top>footer>.logo{display:grid!important;place-items:center!important;width:110px!important;min-width:110px!important}
#top>footer>.logo img{width:108px!important;height:60px!important;object-fit:cover;object-position:center 52%}
#top>footer>.home-footer-social{display:flex!important;flex:0 0 144px!important;flex-direction:column!important;align-items:center!important;justify-content:center!important;text-align:center!important}
#top>footer>.home-footer-social>b{margin:0!important}
#top>footer>.home-footer-social nav{margin-top:11px!important}
@media(max-width:760px){
  #top>footer{grid-template-columns:minmax(0,1fr) auto!important;align-items:center!important;gap:28px 18px!important;padding:28px 24px 22px!important}
  #top>footer>.logo{grid-column:1!important;grid-row:1!important;width:92px!important;min-width:92px!important;justify-self:start!important}
  #top>footer>.logo img{width:92px!important;height:52px!important}
  #top>footer>.home-footer-social{grid-column:2!important;grid-row:1!important;justify-self:end!important;align-self:center!important;flex:0 0 128px!important}
  #top>footer>.home-footer-social>b{font-size:.78rem!important}
  #top>footer>.home-footer-social nav{gap:10px!important;margin-top:7px!important}
  #top>footer>.home-footer-social a{width:36px!important;height:36px!important}
  #top>footer>div:not(.home-footer-social){grid-row:2!important}
  #top>footer>small{grid-row:3!important}
}

/* Homepage Sport News dropdown matches the compact disabled-Football treatment. */
#top>header .submenu{top:calc(100% + 9px)!important;width:130px!important;min-width:130px!important;padding:7px 0!important}#top>header .submenu a{padding:10px 14px!important;font-size:13px!important}#top>header .submenu-item--coming-soon{display:flex!important;align-items:center!important;justify-content:space-between!important;gap:5px!important;min-height:40px!important;padding:7px 7px 7px 12px!important;border-left:2px solid rgba(250,225,44,.55)!important;background:rgba(250,225,44,.09)!important;color:rgba(255,255,255,.54)!important}#top>header .submenu-item--coming-soon>span:first-child{font:700 12px "Barlow Condensed",Impact,sans-serif!important;letter-spacing:.01em!important;text-transform:uppercase!important}#top>header .submenu-item--coming-soon small{display:inline-flex!important;align-items:center!important;border:1px solid rgba(250,225,44,.72)!important;border-radius:999px!important;padding:3px 4px!important;background:rgba(250,225,44,.1)!important;color:var(--lime,#fae12c)!important;font:700 .44rem/1 "DM Mono",monospace!important;letter-spacing:.03em!important;text-transform:uppercase!important;white-space:nowrap!important}

/* Home header is nested inside #top, so it needs its own compact mobile menu rules. */
@media(max-width:760px){#top>header{position:sticky!important;overflow:visible!important}#top>header>.header-social,#top>header>nav .header-social{display:none!important}#top>header>nav:not(.open){display:none!important}#top>header>nav.open{position:absolute!important;top:68px!important;right:0!important;left:0!important;display:flex!important;flex-direction:column!important;align-items:stretch!important;gap:0!important;margin:0!important;padding:8px 20px 16px!important;border-bottom:1px solid #2b2b2b!important;background:#080808!important;box-shadow:0 12px 22px rgba(0,0,0,.28)!important;transform:none!important}#top>header>nav.open>a,#top>header>nav.open>.nav-dropdown{width:100%!important;border-bottom:1px solid #242424!important}#top>header>nav.open>a{padding:14px 0!important;font-size:18px!important}#top>header>nav.open>.nav-dropdown{padding:0!important}#top>header>nav.open .nav-trigger{display:flex!important;width:100%!important;justify-content:space-between!important;padding:14px 0!important;font-size:18px!important}#top>header>nav.open .submenu{position:static!important;width:100%!important;min-width:0!important;margin:0 0 8px!important;border-color:#393939!important;background:#121212!important}#top>header>nav.open .submenu a{padding:11px 14px!important;font-size:14px!important}#top>.home-hero-news{margin-top:16px!important}#top>.home-hero-news__image{background-position:58% center!important}}

/* Keep mobile navigation focused: social links remain in the footer. */
@media(max-width:760px){
  #top>header .header-social,
  #top>header>.header-social{display:none!important;visibility:hidden!important}
}

/* Mobile campaign art uses a compact landscape frame, so the full campaign composition stays intact. */
@media(max-width:760px){
  #top>.home-hero-news{
    min-height:0!important;
    height:clamp(260px,72vw,310px)!important;
  }
  #top>.home-hero-news__image{
    background-position:center 18%!important;
    background-size:cover!important;
    background-repeat:no-repeat!important;
  }
  #top>.home-hero-news .home-hero-news__copy{
    min-height:0!important;
    height:100%!important;
    padding:18px 20px 64px!important;
  }
  #top>.home-hero-news .home-hero-news__copy h1{max-width:260px!important;font-size:clamp(2.1rem,9.5vw,2.8rem)!important}
  #top>.home-hero-news .home-hero-news__meta{max-width:250px!important;font-size:.76rem!important}
  #top>.home-hero-news .home-hero-news__controls{right:14px!important;bottom:14px!important}
}

/* The compact card action must remain a single, readable label on mobile. */
@media(max-width:760px){
  #top>.home-news-slider .news-card-meta{gap:8px!important}
  #top>.home-news-slider .news-read{flex:0 0 auto!important;white-space:nowrap!important;padding-inline:10px!important;font-size:.68rem!important}
}

/* Mobile event carousel presents one complete, easy-to-watch video card. */
@media(max-width:760px){
  #top>.events-media .events-media-head{align-items:center!important;gap:14px!important}
  #top>.events-media .events-media-head h2{max-width:220px!important;font-size:clamp(2rem,10vw,2.6rem)!important}
  #top>.events-media .events-media-track{gap:12px!important}
  #top>.events-media .event-media-slot{flex:0 0 100%!important;min-height:0!important;aspect-ratio:auto!important}
  #top>.events-media .event-video-stage{flex:0 0 auto!important;width:100%!important;min-height:0!important;aspect-ratio:16/9!important}
  #top>.events-media .event-video-link{padding:14px!important}
  #top>.events-media .event-video-play{width:46px!important;height:46px!important;font-size:1.15rem!important}
  #top>.events-media .event-video-copy{margin-left:11px!important;font-size:1rem!important}
  #top>.events-media .event-video-caption{min-height:58px!important;padding:13px 14px!important}
}

/* Mobile footer retains the full social action row below its Follow us label. */
@media(max-width:760px){
  #top>footer>.home-footer-social nav{display:flex!important;visibility:visible!important;opacity:1!important;justify-content:center!important;align-items:center!important;gap:10px!important;margin-top:7px!important}
  #top>footer>.home-footer-social nav a{display:grid!important;visibility:visible!important;width:36px!important;height:36px!important;flex:0 0 36px!important}
  #top>footer>.home-footer-social nav svg{display:block!important}
}

/* The mobile menu keeps social links as a centred, horizontal action row. */
@media(max-width:760px){
  #top>header>.header-social{display:none!important}
  #top>header>nav.open .header-social{display:flex!important;visibility:visible!important;flex-direction:row!important;flex-wrap:wrap!important;align-items:center!important;justify-content:center!important;gap:12px!important;width:100%!important;padding:18px 0 4px!important}
  #top>header>nav.open .mobile-follow-label{display:block!important;flex:0 0 100%!important;width:100%!important;margin-bottom:1px!important;color:#fff!important;font:800 .78rem/1 "DM Sans",sans-serif!important;text-align:center!important}
  #top>header>nav.open .header-social a{display:grid!important;place-items:center!important;width:38px!important;height:38px!important;border:1px solid #fff!important;border-radius:50%!important}
  #top>header>nav.open .header-social a:nth-of-type(1){border-color:#1877f2!important;background:#1877f21c!important;color:#1877f2!important}
  #top>header>nav.open .header-social a:nth-of-type(2){border-color:#ff0000!important;background:#ff00001c!important;color:#ff0000!important}
  #top>header>nav.open .header-social a:nth-of-type(3){border-color:#e1306c!important;background:linear-gradient(135deg,#f9ce34,#ee2a7b 55%,#6228d7)!important;color:#fff!important}
  #top>header>nav.open .header-social svg{display:block!important;width:17px!important;height:17px!important;fill:currentColor!important;stroke:currentColor!important}
  #top>header>nav.open .header-social a:nth-of-type(3) svg{fill:none!important;stroke-width:1.9!important}
}

/* Keep the campaign banner clear: social buttons are available in the footer, not the mobile header. */
@media(max-width:760px){
  #top>header .header-social{display:none!important}
}

/* Reserve a complete first row for the mobile footer's Follow us icon group. */
@media(max-width:900px){
  #top>footer{
    grid-template-columns:minmax(0,1fr) auto!important;
    grid-template-rows:110px auto auto!important;
    align-items:start!important;
    gap:24px 18px!important;
    overflow:visible!important;
  }
  #top>footer>.logo{grid-column:1!important;grid-row:1!important;align-self:center!important}
  #top>footer>.home-footer-social{
    display:flex!important;
    grid-column:2!important;
    grid-row:1!important;
    align-self:center!important;
    justify-self:end!important;
    flex:0 0 128px!important;
    flex-direction:column!important;
    align-items:center!important;
    justify-content:flex-start!important;
    padding-top:3px!important;
    overflow:visible!important;
  }
  #top>footer>.home-footer-social nav{
    display:grid!important;
    grid-template-columns:repeat(3,36px)!important;
    grid-template-rows:36px!important;
    flex-direction:row!important;
    flex-wrap:nowrap!important;
    gap:10px!important;
    position:relative!important;
    visibility:visible!important;
    opacity:1!important;
    width:128px!important;
    height:36px!important;
    min-height:36px!important;
    margin-top:7px!important;
    overflow:visible!important;
  }
  #top>footer>.home-footer-social nav a{display:grid!important;visibility:visible!important;opacity:1!important;position:static!important;width:36px!important;height:36px!important}
  #top>footer>div:not(.home-footer-social){grid-row:2!important}
  #top>footer>small{grid-row:3!important}
}

/* Keep the compact home news heading and carousel controls on one mobile row. */
@media(max-width:900px){
  #top>.home-news-slider .news-slider-header{flex-wrap:nowrap!important;gap:10px!important}
  #top>.home-news-slider .news-slider-header h2{
    min-width:0!important;
    margin:0!important;
    font-size:clamp(1.75rem,7.5vw,2.25rem)!important;
    letter-spacing:-.045em!important;
    white-space:nowrap!important;
  }
  #top>.home-news-slider .news-slider-actions{flex:0 0 auto!important;gap:8px!important}
  #top>.home-news-slider .news-arrow{flex:0 0 38px!important}
}

/* At phone widths, keep the complete Badminton News control bar on one line. */
/* The carousel controls are the only actions in the heading; avoid a duplicate text link. */
#top>.home-news-slider .more-news{
  display:none!important;
}
@media(max-width:480px){
  #top>.home-news-slider .news-slider-header{
    display:grid!important;
    grid-template-columns:minmax(0,1fr) auto!important;
    align-items:center!important;
    gap:8px!important;
  }
  #top>.home-news-slider .news-slider-header h2{
    min-width:0!important;
    font-size:clamp(1.5rem,6.5vw,1.9rem)!important;
    line-height:1!important;
    letter-spacing:-.035em!important;
    white-space:nowrap!important;
  }
  #top>.home-news-slider .news-slider-actions{gap:6px!important;white-space:nowrap!important}
  #top>.home-news-slider .more-news{display:none!important}
  #top>.home-news-slider .news-arrow{
    flex:0 0 34px!important;
    width:34px!important;
    height:34px!important;
    font-size:1.45rem!important;
  }
}

/* Homepage mobile menu: compact Follow us lock-up matching the site reference. */
@media(max-width:760px){
  #top>header>nav.open>.b88-mobile-follow{
    min-height:0!important;
    padding:7px 0 10px!important;
  }
  #top>header>nav.open>.b88-mobile-follow>b{
    color:#fff!important;
    font:800 .78rem/1 "DM Sans",sans-serif!important;
    letter-spacing:0!important;
    text-transform:none!important;
  }
  #top>header>nav.open>.b88-mobile-follow .b88-mobile-follow__icons{
    grid-template-columns:repeat(3,36px)!important;
    gap:10px!important;
    margin-top:6px!important;
  }
  #top>header>nav.open>.b88-mobile-follow .b88-mobile-follow__icons a{
    width:36px!important;
    height:36px!important;
  }
  #top>header>nav.open>.b88-mobile-follow .b88-mobile-follow__icons svg{width:15px!important;height:15px!important}
}

/* Keep the mobile news bar concise: one compact title and the two carousel controls. */
@media(max-width:900px){
  #top>.home-news-slider .news-slider-header{
    display:grid!important;
    grid-template-columns:minmax(0,1fr) auto!important;
    align-items:center!important;
    gap:8px!important;
  }
  #top>.home-news-slider .news-slider-header h2{
    min-width:0!important;
    margin:0!important;
    font-size:clamp(1.3rem,6.2vw,1.6rem)!important;
    line-height:1!important;
    letter-spacing:-.035em!important;
    white-space:nowrap!important;
  }
  #top>.home-news-slider .news-slider-actions{display:flex!important;flex:0 0 auto!important;gap:6px!important}
  #top>.home-news-slider .news-slider-actions>.more-news{display:none!important}
  #top>.home-news-slider .news-arrow{flex:0 0 34px!important;width:34px!important;height:34px!important;font-size:1.45rem!important}
}

/* Homepage footer: keep the Follow us label and its icon row as one compact unit. */
@media(max-width:900px){
  #top>footer>.home-footer-social{
    position:relative!important;
    display:flex!important;
    flex:0 0 128px!important;
    flex-direction:column!important;
    align-items:center!important;
    justify-content:center!important;
    align-self:center!important;
    width:128px!important;
    height:36px!important;
    min-height:36px!important;
    padding:0!important;
  }
  #top>footer>.home-footer-social>b{
    position:absolute!important;
    top:-17px!important;
    left:0!important;
    right:0!important;
    width:128px!important;
    margin:0!important;
    text-align:center!important;
    white-space:nowrap!important;
  }
  #top>footer>.home-footer-social nav{
    position:absolute!important;
    top:0!important;
    left:0!important;
    display:flex!important;
    align-items:center!important;
    justify-content:center!important;
    width:128px!important;
    height:36px!important;
    min-height:36px!important;
    margin:0!important;
    transform:none!important;
  }
}

@media(min-width:901px){
  #top>footer>.home-footer-social{align-self:center!important}
}
