/*
Theme Name: Maikanti News Premium
Theme URI: https://example.com/
Author: Maikanti International
Description: A modern, fast, editorial WordPress news theme with premium newspaper layouts.
Version: 1.0.3
Requires at least: 6.0
Requires PHP: 7.4
License: GPL-2.0-or-later
Text Domain: maikanti-news
*/
:root{--ink:#111827;--muted:#667085;--line:#e6e8ec;--brand:#b21f2d;--brand2:#8f1824;--paper:#fff;--soft:#f5f6f8;--max:1240px}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;color:var(--ink);background:var(--paper);font-family:system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;line-height:1.65}a{color:inherit;text-decoration:none}img{max-width:100%;height:auto;display:block}.container{width:min(100% - 32px,var(--max));margin-inline:auto}.topbar{background:#101828;color:#d0d5dd;font-size:13px}.topbar .inner,.mainhead .inner,.nav .inner{display:flex;align-items:center;justify-content:space-between;min-height:38px}.mainhead{border-bottom:1px solid var(--line);background:#fff}.mainhead .inner{min-height:88px;gap:24px}.logo{font-size:30px;font-weight:900;letter-spacing:-1.5px}.logo span{color:var(--brand)}.search{display:flex;border:1px solid var(--line);border-radius:999px;overflow:hidden}.search input{border:0;outline:0;padding:10px 14px;width:220px}.search button{border:0;background:var(--brand);color:#fff;padding:0 16px}.nav{border-bottom:1px solid var(--line);background:#fff}.nav .inner{overflow:auto}.menu{display:flex;gap:24px;white-space:nowrap;font-weight:700;font-size:14px}.menu a{padding:14px 0;border-bottom:3px solid transparent}.menu a:hover{color:var(--brand);border-color:var(--brand)}.breaking{background:var(--brand);color:#fff}.breaking .inner{display:flex;gap:14px;align-items:center;min-height:42px}.breaking strong{background:#8f1824;padding:5px 9px;font-size:12px}.ad{min-height:90px;background:#f2f4f7;border:1px dashed #c9ced6;display:grid;place-items:center;color:#98a2b3;font-size:12px;margin:22px 0}.hero{display:grid;grid-template-columns:1.6fr 1fr;gap:20px}.lead{position:relative;min-height:460px;background:#111;border-radius:4px;overflow:hidden;color:#fff}.lead img{width:100%;height:100%;object-fit:cover;opacity:.82}.lead .overlay{position:absolute;inset:auto 0 0;padding:30px;background:linear-gradient(transparent,rgba(0,0,0,.9))}.kicker{color:var(--brand);font-weight:800;text-transform:uppercase;font-size:12px;letter-spacing:.08em}.lead .kicker{color:#fff}.lead h1{font-size:clamp(30px,4vw,54px);line-height:1.05;margin:8px 0}.sidegrid{display:grid;grid-template-rows:1fr 1fr;gap:20px}.card{border-bottom:1px solid var(--line);padding-bottom:16px}.card img{aspect-ratio:16/9;object-fit:cover;border-radius:4px;margin-bottom:10px}.card h3{font-size:20px;line-height:1.25;margin:5px 0}.meta{font-size:12px;color:var(--muted)}.section{margin:42px 0}.section-head{display:flex;justify-content:space-between;align-items:end;border-bottom:3px solid var(--ink);margin-bottom:18px}.section-head h2{margin:0 0 7px;font-size:25px}.section-head a{font-size:13px;color:var(--brand);font-weight:800}.news-layout{display:grid;grid-template-columns:1.65fr .75fr;gap:30px}.list{display:grid;gap:18px}.list .item{display:grid;grid-template-columns:220px 1fr;gap:18px;padding-bottom:18px;border-bottom:1px solid var(--line)}.item img{aspect-ratio:16/10;object-fit:cover;border-radius:4px}.item h3{margin:4px 0;font-size:21px;line-height:1.3}.sidebox{background:var(--soft);padding:20px}.sidebox h3{margin-top:0;border-bottom:2px solid var(--brand);padding-bottom:10px}.rank{display:flex;gap:12px;padding:13px 0;border-bottom:1px solid var(--line)}.rank b{font-size:25px;color:#98a2b3}.category-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}.category-grid .card h3{font-size:18px}.footer{background:#101828;color:#d0d5dd;margin-top:55px}.footer .inner{padding:48px 0;display:grid;grid-template-columns:1.4fr 1fr 1fr;gap:35px}.footer h3{color:#fff}.footer a{color:#d0d5dd}.copyright{border-top:1px solid #344054;padding:18px 0;font-size:13px}.article{max-width:850px;margin:35px auto}.article h1{font-family:Georgia,serif;font-size:clamp(36px,6vw,66px);line-height:1.05;margin:8px 0 16px}.article .featured{width:100%;margin:24px 0}.article-content{font-family:Georgia,serif;font-size:19px}.article-content p{margin:0 0 1.3em}.article-content h2,.article-content h3{font-family:system-ui}.share{display:flex;gap:8px;margin:18px 0}.share a{background:#f2f4f7;padding:8px 12px;border-radius:4px;font-size:13px}.pagination{display:flex;gap:8px;margin:25px 0}.pagination a,.pagination span{padding:8px 12px;border:1px solid var(--line)}@media(max-width:850px){.hero,.news-layout,.footer .inner{grid-template-columns:1fr}.sidegrid{grid-template-rows:auto}.lead{min-height:360px}.category-grid{grid-template-columns:1fr 1fr}.search{display:none}.mainhead .inner{min-height:70px}.list .item{grid-template-columns:140px 1fr}.list .item h3{font-size:18px}}@media(max-width:520px){.container{width:min(100% - 22px,var(--max))}.category-grid{grid-template-columns:1fr}.lead h1{font-size:32px}.topbar{display:none}.menu{gap:17px}.list .item{grid-template-columns:110px 1fr}.list .item h3{font-size:16px}}


/* Mobile-first visible category navigation */
@media (max-width: 850px){
  .nav{
    position:sticky;
    top:0;
    z-index:1000;
    box-shadow:0 2px 8px rgba(16,24,40,.08);
  }
  .nav .inner{
    display:block;
    width:100%;
    padding:0;
    overflow:hidden;
  }
  .menu{
    display:flex !important;
    flex-wrap:nowrap !important;
    gap:0;
    width:max-content;
    min-width:100%;
    overflow-x:auto;
    overflow-y:hidden;
    -webkit-overflow-scrolling:touch;
    scrollbar-width:none;
    padding:0 10px;
    scroll-snap-type:x proximity;
  }
  .menu::-webkit-scrollbar{display:none}
  .menu li{flex:0 0 auto;scroll-snap-align:start}
  .menu a{
    display:block;
    padding:12px 13px 10px;
    font-size:13px;
    border-bottom:3px solid transparent;
  }
  .menu a:hover,.menu .current-menu-item>a,.menu .current_page_item>a{
    color:var(--brand);
    border-color:var(--brand);
  }
  .nav:after{
    content:"";
    position:absolute;
    right:0;
    top:0;
    bottom:0;
    width:28px;
    pointer-events:none;
    background:linear-gradient(90deg,transparent,rgba(255,255,255,.96));
  }
}

/* Keep the main masthead compact while leaving the category menu visible */
@media (max-width:520px){
  .mainhead .inner{min-height:62px}
  .logo{font-size:24px}
  .breaking .inner{
    min-height:38px;
    white-space:nowrap;
    overflow:hidden;
  }
  .breaking .inner>div{
    overflow:hidden;
    text-overflow:ellipsis;
    white-space:nowrap;
  }
  .nav .menu a{padding-left:12px;padding-right:12px}
}

html,body{max-width:100%;overflow-x:hidden}.wp-block-image img{height:auto}.wp-caption{max-width:100%}


/* =========================================================
   PRODUCTION RESPONSIVE PATCH
   - Prevent mobile horizontal overflow
   - Keep primary menu items adjacent in one swipeable row
   - Make the newspaper layout fluid on phones
   ========================================================= */

html, body {
  width: 100%;
  max-width: 100%;
  overflow-x: hidden !important;
}

img, video, iframe, embed, object, svg, canvas {
  max-width: 100% !important;
}

table {
  width: 100% !important;
  max-width: 100% !important;
  display: block;
  overflow-x: auto;
}

pre, code {
  max-width: 100%;
  overflow-x: auto;
}

.wp-block-table,
.wp-block-embed,
.wp-block-video,
.wp-block-image,
.wp-caption {
  max-width: 100% !important;
}

.article-content,
.entry-content,
.post-content {
  max-width: 100%;
  overflow-wrap: anywhere;
  word-break: normal;
}

.article-content p,
.article-content li,
.article-content blockquote,
.article-content h1,
.article-content h2,
.article-content h3,
.article-content h4 {
  max-width: 100%;
}

@media (max-width: 850px) {

  /* Header and navigation always fit the viewport */
  .mainhead,
  .nav,
  .breaking {
    width: 100%;
    max-width: 100%;
    overflow: hidden;
  }

  .nav {
    position: sticky;
    top: 0;
    z-index: 1000;
    background: #fff;
  }

  .nav .inner {
    display: block !important;
    width: 100% !important;
    max-width: 100% !important;
    min-height: 0 !important;
    padding: 0 !important;
    overflow: hidden !important;
  }

  /* THE IMPORTANT PART: one adjacent horizontal row */
  .nav ul.menu,
  .nav .menu,
  .nav .menu ul {
    display: flex !important;
    flex-direction: row !important;
    flex-wrap: nowrap !important;
    align-items: stretch !important;
    justify-content: flex-start !important;
    gap: 0 !important;
    width: max-content !important;
    min-width: max-content !important;
    max-width: none !important;
    margin: 0 !important;
    padding: 0 8px !important;
    list-style: none !important;
    overflow-x: auto !important;
    overflow-y: hidden !important;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: none;
    white-space: nowrap !important;
  }

  .nav ul.menu::-webkit-scrollbar,
  .nav .menu::-webkit-scrollbar {
    display: none;
  }

  .nav ul.menu > li,
  .nav .menu > li,
  .nav .menu li {
    display: block !important;
    flex: 0 0 auto !important;
    width: auto !important;
    min-width: max-content !important;
    max-width: none !important;
    float: none !important;
    clear: none !important;
    margin: 0 !important;
    padding: 0 !important;
  }

  .nav ul.menu > li > a,
  .nav .menu > li > a,
  .nav .menu li a {
    display: block !important;
    width: auto !important;
    min-width: max-content !important;
    white-space: nowrap !important;
    padding: 11px 13px 9px !important;
    font-size: 13px !important;
    line-height: 1.2 !important;
    border-bottom: 3px solid transparent;
  }

  .nav ul.menu > li > a:hover,
  .nav .menu > li.current-menu-item > a,
  .nav .menu > li.current_page_item > a {
    color: var(--brand);
    border-bottom-color: var(--brand);
  }

  /* Never let submenu items create a vertical wall on the primary bar */
  .nav .menu .sub-menu {
    display: none !important;
  }

  /* Phone-safe content grid */
  .container {
    width: calc(100% - 22px) !important;
    max-width: 100% !important;
    margin-left: auto !important;
    margin-right: auto !important;
  }

  .hero,
  .news-layout,
  .footer .inner {
    width: 100% !important;
    max-width: 100% !important;
  }

  .hero {
    display: grid;
    grid-template-columns: minmax(0, 1fr) !important;
  }

  .lead {
    width: 100% !important;
    min-width: 0 !important;
    min-height: 320px;
  }

  .sidegrid {
    width: 100% !important;
    min-width: 0 !important;
    display: grid;
    grid-template-columns: minmax(0, 1fr) !important;
  }

  .news-layout {
    display: grid;
    grid-template-columns: minmax(0, 1fr) !important;
  }

  .list,
  .list .item,
  .category-grid,
  .section,
  aside,
  .sidebox {
    min-width: 0 !important;
    max-width: 100% !important;
  }

  .list .item {
    grid-template-columns: minmax(100px, 34%) minmax(0, 1fr) !important;
    gap: 12px !important;
  }

  .item h3,
  .card h3,
  .section-head h2 {
    overflow-wrap: anywhere;
  }

  .section-head {
    min-width: 0;
    gap: 10px;
  }

  .section-head a {
    white-space: nowrap;
  }

  .article {
    width: 100% !important;
    max-width: 100% !important;
    margin: 24px auto !important;
    min-width: 0 !important;
  }

  .article h1 {
    font-size: clamp(30px, 8vw, 46px);
    overflow-wrap: anywhere;
  }

  .article-content {
    font-size: 18px;
    line-height: 1.7;
  }

  .article-content img,
  .article-content figure {
    max-width: 100% !important;
    height: auto !important;
  }
}

@media (max-width: 520px) {
  .mainhead .inner {
    width: 100% !important;
    min-height: 62px !important;
  }

  .logo {
    max-width: 70vw;
    overflow: hidden;
  }

  .logo img,
  .custom-logo {
    max-width: 180px !important;
    height: auto !important;
  }

  .nav ul.menu,
  .nav .menu {
    padding-left: 5px !important;
    padding-right: 18px !important;
  }

  .nav ul.menu > li > a,
  .nav .menu > li > a,
  .nav .menu li a {
    padding-left: 11px !important;
    padding-right: 11px !important;
    font-size: 12.5px !important;
  }

  .category-grid {
    grid-template-columns: minmax(0, 1fr) !important;
  }

  .list .item {
    grid-template-columns: 100px minmax(0, 1fr) !important;
  }

  .list .item h3 {
    font-size: 16px;
    line-height: 1.3;
  }

  .meta {
    font-size: 11px;
  }

  .article-content {
    font-size: 17px;
  }
}


/* =========================================================
   v1.0.3 — STRUCTURAL MOBILE FIX
   The category navigation is generated by the theme itself.
   It is deliberately a single horizontal strip.
   ========================================================= */

.nav {
  position: relative;
  overflow: hidden;
}

.nav .inner {
  min-width: 0;
  overflow: hidden;
}

.news-category-menu {
  display: flex !important;
  flex-direction: row !important;
  flex-wrap: nowrap !important;
  align-items: center !important;
  justify-content: flex-start !important;
  gap: 0 !important;
  width: max-content !important;
  min-width: 100% !important;
  max-width: none !important;
  margin: 0 !important;
  padding: 0 !important;
  list-style: none !important;
  white-space: nowrap !important;
  overflow-x: auto !important;
  overflow-y: hidden !important;
  -webkit-overflow-scrolling: touch;
  scrollbar-width: none;
}

.news-category-menu::-webkit-scrollbar {
  display: none;
}

.news-category-menu > li {
  display: block !important;
  flex: 0 0 auto !important;
  width: auto !important;
  min-width: max-content !important;
  max-width: none !important;
  float: none !important;
  clear: none !important;
  margin: 0 !important;
  padding: 0 !important;
}

.news-category-menu > li > a {
  display: block !important;
  width: auto !important;
  min-width: max-content !important;
  white-space: nowrap !important;
  padding: 14px 13px !important;
  line-height: 1.2 !important;
}

.news-category-menu .home-link > a {
  font-weight: 900;
  color: var(--brand);
}

@media (min-width: 851px) {
  .news-category-menu {
    overflow-x: auto !important;
  }
}

@media (max-width: 850px) {
  .nav {
    position: sticky;
    top: 0;
    z-index: 10000;
    background: #fff;
  }

  .nav .inner {
    display: block !important;
    width: 100% !important;
    max-width: 100% !important;
    min-height: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
  }

  .news-category-menu {
    width: max-content !important;
    min-width: 100% !important;
    max-width: none !important;
    padding: 0 8px !important;
    gap: 0 !important;
  }

  .news-category-menu > li {
    flex: 0 0 auto !important;
  }

  .news-category-menu > li > a {
    padding: 11px 12px 9px !important;
    font-size: 12.5px !important;
    border-bottom: 3px solid transparent;
  }

  .news-category-menu > li > a:hover {
    color: var(--brand);
    border-bottom-color: var(--brand);
  }

  /* The page itself must never become wider than the phone. */
  main.container,
  .container,
  .article,
  .article-content,
  .news-layout,
  .hero,
  .section,
  .list,
  aside {
    min-width: 0 !important;
    max-width: 100% !important;
    box-sizing: border-box !important;
  }

  main.container {
    overflow: hidden !important;
  }

  .article {
    width: 100% !important;
    margin-left: auto !important;
    margin-right: auto !important;
    padding-left: 0 !important;
    padding-right: 0 !important;
  }

  .article .featured {
    display: block !important;
    width: 100% !important;
    max-width: 100% !important;
    height: auto !important;
    margin: 20px 0 !important;
    float: none !important;
  }

  .article-content,
  .article-content > *,
  .article-content figure,
  .article-content .wp-block-image,
  .article-content .wp-block-embed,
  .article-content .wp-block-table {
    max-width: 100% !important;
    min-width: 0 !important;
    box-sizing: border-box !important;
  }

  .article-content img,
  .article-content video,
  .article-content iframe,
  .article-content embed,
  .article-content object {
    max-width: 100% !important;
    height: auto !important;
  }

  /* WordPress alignment classes can otherwise push an old article sideways. */
  .article-content .alignleft,
  .article-content .alignright,
  .article-content .aligncenter {
    float: none !important;
    display: block !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
  }

  .article-content table {
    display: block !important;
    width: 100% !important;
    max-width: 100% !important;
    overflow-x: auto !important;
  }

  .article h1,
  .article-content h1,
  .article-content h2,
  .article-content h3,
  .article-content p,
  .article-content li,
  .article-content blockquote {
    overflow-wrap: anywhere !important;
  }

  .list .item {
    min-width: 0 !important;
  }
}

@media (max-width: 520px) {
  .news-category-menu > li > a {
    padding-left: 10px !important;
    padding-right: 10px !important;
    font-size: 12px !important;
  }

  .article h1 {
    font-size: clamp(28px, 8vw, 42px) !important;
    line-height: 1.08 !important;
  }

  .article-content {
    font-size: 17px !important;
    line-height: 1.7 !important;
  }
}