/* v2.52 - 1440px global container system for WorldCupLive.Ph
   Applies homepage proportions to header, menus, archives, blog, sports news, news, pages and footers. */
:root{
  --wcl-container-1440:1440px;
  --wcl-content-1280:1280px;
  --wcl-archive-1320:1320px;
  --wcl-single-article:900px;
  --wcl-sidebar:320px;
  --wcl-gutter:24px;
}
html,body{overflow-x:hidden!important;}
*,*::before,*::after{box-sizing:border-box;}

/* Universal page shell */
.site-container,
.ast-container,
.container,
.wp-site-blocks,
.wrap,
.page-wrap,
.section.wrap,
.wcl-content-shell{
  width:100%!important;
  max-width:var(--wcl-container-1440)!important;
  margin-left:auto!important;
  margin-right:auto!important;
  padding-left:var(--wcl-gutter)!important;
  padding-right:var(--wcl-gutter)!important;
}

/* Header / navigation: same width as homepage */
.site-header{width:100%!important;}
.site-header .nav,
header.site-header .nav,
body .site-header nav.nav{
  width:100%!important;
  max-width:var(--wcl-container-1440)!important;
  margin-left:auto!important;
  margin-right:auto!important;
  padding-left:var(--wcl-gutter)!important;
  padding-right:var(--wcl-gutter)!important;
  display:grid!important;
  grid-template-columns:minmax(210px,300px) minmax(0,1fr) auto!important;
  gap:clamp(14px,2vw,28px)!important;
  align-items:center!important;
}
.site-header .main-menu{justify-content:center!important;min-width:0!important;}
.site-header .actions{justify-content:flex-end!important;}
.site-header .mega{
  width:min(100vw - 48px, var(--wcl-container-1440))!important;
  max-width:var(--wcl-container-1440)!important;
}

/* Footer: same width as homepage */
.footer .wrap,
.site-footer .ast-container,
body footer .wrap{
  width:100%!important;
  max-width:var(--wcl-container-1440)!important;
  margin-left:auto!important;
  margin-right:auto!important;
  padding-left:var(--wcl-gutter)!important;
  padding-right:var(--wcl-gutter)!important;
}
.footer-grid{width:100%!important;}

/* Main archives: /blog/, /blogs/, /sports-news/, /news/ */
body main.content-hub,
body .content-hub,
body.blog .site-content,
body.archive .site-content,
body.post-type-archive .site-content,
body main[data-page="blog"],
body main[data-page="sports-news"],
body main[data-page="news"]{
  width:100%!important;
  max-width:var(--wcl-container-1440)!important;
  margin-left:auto!important;
  margin-right:auto!important;
  padding-left:var(--wcl-gutter)!important;
  padding-right:var(--wcl-gutter)!important;
}
body .content-hub{padding-top:clamp(54px,6vw,88px)!important;padding-bottom:clamp(64px,7vw,96px)!important;}

/* Archive heading area follows homepage rhythm */
body .content-hub > .hub-eyebrow,
body .content-hub > h1,
body .content-hub > .hub-sub,
body .content-hub > .hub-toolbar,
body .content-hub > .cta-row{
  width:100%!important;
  max-width:var(--wcl-content-1280)!important;
  margin-left:auto!important;
  margin-right:auto!important;
}

/* Lead and archive cards use a strong publisher width */
body .lead-card,
body .content-grid,
body .pager,
body .count{
  width:100%!important;
  max-width:var(--wcl-archive-1320)!important;
  margin-left:auto!important;
  margin-right:auto!important;
}
body .lead-card{
  display:grid!important;
  grid-template-columns:minmax(0,1.18fr) minmax(360px,.82fr)!important;
  align-items:stretch!important;
}
body .content-grid{
  display:grid!important;
  grid-template-columns:repeat(4,minmax(0,1fr))!important;
  gap:clamp(18px,2vw,24px)!important;
}

/* Single blog/news content remains readable, centered and professional */
body main.article-wrap,
body .article-wrap,
body.single .site-content{
  width:100%!important;
  max-width:var(--wcl-container-1440)!important;
  margin-left:auto!important;
  margin-right:auto!important;
  padding-left:var(--wcl-gutter)!important;
  padding-right:var(--wcl-gutter)!important;
}
body .article-wrap > :is(.hub-eyebrow,h1,.hub-sub,.cta-row,h2,h3,p,ul,ol,blockquote,.related-box),
body.single .entry-content,
body.single article{
  max-width:var(--wcl-single-article)!important;
  margin-left:auto!important;
  margin-right:auto!important;
}

/* Cover images: show the full cover end-to-end inside cards */
body .lead-card > a,
body .story-card > a,
body .content-grid article > a{
  display:block!important;
  width:100%!important;
  background:linear-gradient(145deg,#071018,#101820)!important;
  overflow:hidden!important;
}
body .lead-card img,
body .story-card img,
body .content-grid article img,
body .content-grid .story-card > a > img,
body .article-cover{
  display:block!important;
  width:100%!important;
  height:auto!important;
  aspect-ratio:16/9!important;
  object-fit:contain!important;
  object-position:center center!important;
  background:linear-gradient(145deg,#071018,#101820)!important;
  max-height:none!important;
  min-height:0!important;
}
body .lead-card img{height:auto!important;min-height:0!important;}
body .article-cover{max-width:920px!important;margin:28px auto!important;border-radius:28px!important;}
body .story-card{min-width:0!important;display:flex!important;flex-direction:column!important;height:100%!important;overflow:hidden!important;}
body .story-card .card-body{display:flex!important;flex-direction:column!important;flex:1!important;}
body .story-card .btn-secondary{margin-top:auto!important;align-self:flex-start!important;}

/* 70/30 optional sidebar layout */
.wcl-sidebar-layout,
.has-sidebar,
.content-sidebar-wrap{
  max-width:var(--wcl-container-1440)!important;
  margin-left:auto!important;
  margin-right:auto!important;
  padding-left:var(--wcl-gutter)!important;
  padding-right:var(--wcl-gutter)!important;
  display:grid!important;
  grid-template-columns:minmax(0,calc(100% - var(--wcl-sidebar) - 32px)) var(--wcl-sidebar)!important;
  gap:32px!important;
}

/* Link and CTA polish */
body .lead-card h2 a,
body .story-card h3 a{color:inherit!important;text-decoration:none!important;}
body .lead-card h2 a:hover,
body .story-card h3 a:hover{color:#ffe174!important;}

/* Responsive breakpoints */
@media(max-width:1280px){
  :root{--wcl-gutter:22px;--wcl-archive-1320:1200px;}
  body .content-grid{grid-template-columns:repeat(3,minmax(0,1fr))!important;}
}
@media(max-width:1024px){
  :root{--wcl-gutter:20px;}
  .site-header .nav{grid-template-columns:minmax(160px,220px) minmax(0,1fr) auto!important;}
  body .lead-card{grid-template-columns:1fr!important;}
  .wcl-sidebar-layout,.has-sidebar,.content-sidebar-wrap{grid-template-columns:1fr!important;}
}
@media(max-width:900px){
  :root{--wcl-gutter:18px;}
  .site-header .nav{width:100%!important;max-width:none!important;padding-left:16px!important;padding-right:16px!important;grid-template-columns:minmax(118px,1fr) auto auto!important;}
  body .content-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important;}
}
@media(max-width:620px){
  :root{--wcl-gutter:16px;}
  body .content-grid{grid-template-columns:1fr!important;}
  body .content-hub > h1,body .article-wrap > h1{font-size:2.3rem!important;line-height:1!important;}
  .footer{padding-bottom:88px!important;}
}
