/*
Theme Name: MSNStyle
Description: An MSN.com-inspired news theme — dense magazine-style grid homepage, Microsoft-blue accent, top category navigation, and a trending sidebar. Includes a free public post-submission page with an image-required rule enforced site-wide. Fully portable.
Version: 1.0
Requires at least: 5.9
Requires PHP: 7.4
Text Domain: msnstyle
*/

:root{
  --ms-blue:#0067b8;
  --ms-blue-dark:#004b87;
  --ms-black:#1b1b1b;
  --ms-gray:#666;
  --ms-border:#e1e1e1;
  --ms-bg:#f2f2f2;
  --ms-font: -apple-system, BlinkMacSystemFont, 'Segoe UI', Arial, sans-serif;
}
*{box-sizing:border-box;margin:0;padding:0;}
body{font-family:var(--ms-font);color:var(--ms-black);background:var(--ms-bg);line-height:1.5;font-size:14px;}
a{color:inherit;text-decoration:none;}
img{max-width:100%;display:block;}
.container{max-width:1220px;margin:0 auto;padding:0 16px;}

.ms-header{background:#fff;border-bottom:1px solid var(--ms-border);padding:12px 0;}
.ms-header-inner{display:flex;align-items:center;justify-content:space-between;gap:20px;}
.ms-logo{display:flex;align-items:center;gap:8px;font-size:21px;font-weight:800;color:var(--ms-black);}
.ms-logo-dot{width:12px;height:12px;background:var(--ms-blue);border-radius:2px;}
.ms-search-form{display:flex;background:var(--ms-bg);border-radius:4px;overflow:hidden;border:1px solid var(--ms-border);}
.ms-search-form input{border:none;background:none;padding:7px 12px;font-size:13px;width:180px;}
.ms-search-form button{background:var(--ms-blue);color:#fff;border:none;padding:0 14px;cursor:pointer;font-size:12px;font-weight:700;}

.ms-nav{background:var(--ms-blue);}
.ms-nav ul{display:flex;gap:0;list-style:none;overflow-x:auto;margin:0;padding:0;}
.ms-nav a{display:block;padding:9px 14px;color:#fff;font-size:12.5px;font-weight:600;white-space:nowrap;}
.ms-nav a:hover{background:var(--ms-blue-dark);}

.ms-layout{display:grid;grid-template-columns:2.4fr 1fr;gap:14px;margin:14px 0;align-items:start;}

.ms-lead{display:block;background:#fff;border-radius:4px;overflow:hidden;box-shadow:0 1px 3px rgba(0,0,0,.08);margin-bottom:14px;}
.ms-lead-img{width:100%;height:340px;object-fit:cover;background:linear-gradient(135deg,#ccc,#999);}
.ms-lead-body{padding:16px 18px;}
.ms-lead-cat{display:inline-block;color:var(--ms-blue);font-size:11px;font-weight:800;text-transform:uppercase;margin-bottom:6px;}
.ms-lead-title{font-size:22px;font-weight:800;line-height:1.28;}
.ms-lead:hover .ms-lead-title{color:var(--ms-blue);}

.ms-grid{display:grid;grid-template-columns:1fr 1fr 1fr;gap:12px;}
.ms-card{display:block;background:#fff;border-radius:4px;overflow:hidden;box-shadow:0 1px 3px rgba(0,0,0,.08);}
.ms-card-img{width:100%;height:130px;object-fit:cover;background:linear-gradient(135deg,#ccc,#999);}
.ms-card-body{padding:10px 12px;}
.ms-card-cat{display:block;color:var(--ms-blue);font-size:10px;font-weight:800;text-transform:uppercase;margin-bottom:4px;}
.ms-card-title{font-size:13px;font-weight:700;line-height:1.32;}
.ms-card:hover .ms-card-title{color:var(--ms-blue);}
.ms-card-meta{font-size:10.5px;color:var(--ms-gray);margin-top:6px;}

.ms-row-list{background:#fff;border-radius:4px;box-shadow:0 1px 3px rgba(0,0,0,.08);margin-bottom:14px;}
.ms-row-item{display:flex;gap:10px;padding:10px 14px;border-bottom:1px solid var(--ms-border);align-items:center;}
.ms-row-item:last-child{border-bottom:none;}
.ms-row-thumb{width:64px;height:48px;object-fit:cover;border-radius:3px;flex-shrink:0;background:linear-gradient(135deg,#ccc,#999);}
.ms-row-item h4{font-size:12.5px;font-weight:700;line-height:1.3;}
.ms-row-item:hover h4{color:var(--ms-blue);}

.ms-sidebar-block{background:#fff;border-radius:4px;box-shadow:0 1px 3px rgba(0,0,0,.08);margin-bottom:14px;padding:12px 14px;}
.ms-sidebar-title{font-size:12px;font-weight:800;text-transform:uppercase;color:var(--ms-black);border-bottom:2px solid var(--ms-blue);padding-bottom:8px;margin-bottom:10px;}
.ms-sidebar-item{display:flex;gap:10px;padding:9px 0;border-bottom:1px solid var(--ms-border);}
.ms-sidebar-item:last-child{border-bottom:none;}
.ms-sidebar-num{font-size:16px;font-weight:900;color:var(--ms-blue);width:16px;flex-shrink:0;}
.ms-sidebar-item h5{font-size:12px;font-weight:700;line-height:1.3;}
.ms-sidebar-item:hover h5{color:var(--ms-blue);}

.ms-section-head{font-size:15px;font-weight:800;padding:10px 0 8px;border-bottom:2px solid var(--ms-black);margin-bottom:10px;text-transform:uppercase;}

.ms-breadcrumb{font-size:12px;color:var(--ms-gray);margin:16px 0 8px;}
.ms-breadcrumb a:hover{color:var(--ms-blue);}
.ms-article{background:#fff;border-radius:4px;box-shadow:0 1px 3px rgba(0,0,0,.08);padding:22px;}
.ms-article h1{font-size:27px;font-weight:800;line-height:1.25;margin-bottom:10px;}
.ms-article-meta{font-size:12px;color:var(--ms-gray);margin-bottom:16px;padding-bottom:12px;border-bottom:1px solid var(--ms-border);}
.ms-article-meta b{color:var(--ms-blue);}
.ms-article-thumb{width:100%;height:auto;max-height:420px;object-fit:cover;border-radius:4px;margin-bottom:18px;}
.ms-article-body{font-size:16.5px;line-height:1.75;}
.ms-article-body p{margin:0 0 16px;}
.ms-article-body h2{font-size:20px;font-weight:800;margin:24px 0 10px;}
.ms-article-body a{color:var(--ms-blue);text-decoration:underline;}

.ms-page{max-width:740px;margin:0 auto;padding:26px 16px 50px;}
.ms-page h1{font-size:26px;font-weight:800;margin-bottom:14px;}
.ms-page-body{font-size:15.5px;line-height:1.7;}
.ms-page-body a{color:var(--ms-blue);text-decoration:underline;}

.ms-submit-wrap{max-width:760px;margin:0 auto;padding:20px 16px 50px;}
.ms-submit-wrap h1{font-size:26px;font-weight:800;margin:0 0 8px;}
.ms-submit-intro{font-size:14px;color:#444;margin-bottom:18px;padding-bottom:14px;border-bottom:1px solid var(--ms-border);}
.ms-req-box{background:#e8f2fb;border-radius:4px;padding:14px 16px;margin-bottom:20px;}
.ms-req-box h4{font-size:11.5px;font-weight:800;text-transform:uppercase;margin:0 0 8px;color:var(--ms-blue-dark);}
.ms-req-box ul{margin:0;padding-left:16px;font-size:13px;color:#444;line-height:1.7;}
.ms-form-group{margin-bottom:14px;}
.ms-form-group label{display:block;font-size:12.5px;font-weight:700;margin-bottom:4px;}
.ms-form-group input{width:100%;border:1px solid var(--ms-border);border-radius:3px;padding:8px 11px;font-size:13.5px;box-sizing:border-box;}
.ms-word-count{font-size:11.5px;color:#888;margin-top:4px;}
.ms-word-count.ok{color:#1a7a3a;font-weight:700;}
.ms-submit-btn{background:var(--ms-blue);color:#fff;border:none;border-radius:3px;padding:10px 24px;font-size:13.5px;font-weight:700;cursor:pointer;}
.ms-submit-btn:hover{background:var(--ms-blue-dark);}
.ms-submit-btn:disabled{opacity:.5;cursor:not-allowed;}
.ms-error-box{display:none;background:#fdecec;border-radius:3px;color:#a3382c;padding:11px 14px;margin-bottom:14px;font-size:13px;}
.ms-error-box.show{display:block;}
.ms-success-box{display:none;text-align:center;padding:32px 0;}
.ms-success-box.show{display:block;}

.ms-footer{background:#fff;border-top:1px solid var(--ms-border);padding:18px 0;margin-top:14px;text-align:center;font-size:11.5px;color:var(--ms-gray);}

@media(max-width:900px){
  .ms-layout{grid-template-columns:1fr;}
  .ms-grid{grid-template-columns:1fr 1fr;}
}