/*
Theme Name: Celeb Axis
Theme URI: https://celebaxis.com
Author: Celeb Axis
Author URI: https://celebaxis.com
Description: Custom maroon and gold editorial theme for Celeb Axis, built for celebrity net worth, biography and age content. Fonts: Playfair Display (headings) and Poppins (body).
Version: 1.0
Requires at least: 6.0
Requires PHP: 7.4
Text Domain: celebaxis
*/

:root{
  --maroon:#6B1029;
  --maroon-dark:#4A0A1C;
  --gold:#C6952C;
  --gold-light:#F3E5D8;
  --cream:#FBF9F4;
  --ink:#221D1A;
  --ink-soft:#5A544F;
  --line:#E7E0D4;
  --net-worth:#2F5233; --net-worth-bg:#E3EDDF;
  --fashion:#B23A5C; --fashion-bg:#F7E3E8;
  --age:#23405A; --age-bg:#E1E9F0;
  --bio:#8A5A15; --bio-bg:#F4E8D3;
}
*{box-sizing:border-box;}
body{
  font-family:'Poppins', sans-serif;
  background:var(--cream);
  color:var(--ink);
  line-height:1.6;
  margin:0;
}
a{text-decoration:none; color:inherit;}
img{max-width:100%; display:block;}
ul{list-style:none; margin:0; padding:0;}

/* ===== HEADER ===== */
.site-header{
  display:flex; align-items:center; justify-content:space-between;
  padding:22px 48px;
  background:var(--cream);
  border-bottom:1px solid var(--line);
  flex-wrap:wrap; gap:16px;
}
.site-logo{
  font-family:'Playfair Display', serif;
  font-weight:800;
  font-size:30px;
  letter-spacing:0.5px;
  color:var(--maroon);
}
.site-logo span{color:var(--gold);}
.main-nav ul{display:flex; gap:34px; flex-wrap:wrap;}
.main-nav a{font-size:14px; font-weight:500; color:var(--ink);}
.main-nav a:hover{color:var(--maroon);}
.write-btn{
  background:var(--maroon); color:#fff; padding:10px 22px;
  border-radius:30px; font-size:13px; font-weight:600;
}

/* ===== HERO ===== */
.hero{
  display:grid; grid-template-columns:1.1fr 1fr;
  max-width:1240px; margin:56px auto; padding:0 48px; gap:56px; align-items:center;
}
.hero-text .tag{
  display:inline-block; font-size:13px; font-weight:600; color:var(--maroon);
  border-bottom:2px solid var(--gold); padding-bottom:6px; margin-bottom:22px;
}
.hero-text h1{
  font-family:'Playfair Display', serif;
  font-size:44px; line-height:1.18; font-weight:700; color:var(--ink);
  margin:0 0 20px;
}
.hero-text p{color:var(--ink-soft); font-size:15.5px; margin:0 0 26px; max-width:52ch;}
.hero-cta{
  display:inline-flex; align-items:center; gap:10px;
  background:var(--ink); color:#fff; padding:13px 26px; border-radius:6px;
  font-weight:600; font-size:14px;
}
.hero-image{
  position:relative; border-radius:6px; overflow:hidden;
  box-shadow:0 24px 48px -18px rgba(74,10,28,0.35);
}
.hero-image::before{
  content:""; position:absolute; inset:0;
  background:linear-gradient(180deg, transparent 40%, rgba(74,10,28,0.85) 100%);
}
.hero-image img{height:420px; object-fit:cover; width:100%;}
.hero-image figcaption{
  position:absolute; left:22px; right:22px; bottom:18px; color:#fff; z-index:2;
  font-size:13px; font-weight:500; opacity:0.9;
}

/* ===== TRENDING STRIP ===== */
.trending{background:var(--maroon); padding:44px 48px;}
.trending-inner{max-width:1240px; margin:0 auto;}
.trending h2{font-family:'Playfair Display', serif; color:#fff; font-size:24px; margin:0 0 24px;}
.trending h2 span{color:var(--gold);}
.trending-list{display:grid; grid-template-columns:repeat(3, 1fr); gap:26px;}
.trending-item{display:flex; gap:16px; align-items:flex-start;}
.rank{font-family:'Playfair Display', serif; font-size:34px; font-weight:700; color:var(--gold); line-height:1; opacity:0.85;}
.trending-item h3{color:#fff; font-size:15px; font-weight:600; margin:0 0 6px;}
.trending-item p{color:#e6c9d1; font-size:12.5px; margin:0;}

/* ===== SECTION HEAD ===== */
.section-head{margin-bottom:28px;}
.section-head .eyebrow{font-size:13px; font-weight:600; color:var(--maroon);}
.section-head h2{font-family:'Playfair Display', serif; font-size:30px; margin:6px 0 0;}

/* ===== COMPARE TOOL ===== */
.compare{max-width:1240px; margin:64px auto; padding:0 48px;}
.compare-box{
  background:#fff; border:1px solid var(--line); border-radius:10px;
  padding:34px; display:grid; grid-template-columns:1fr auto 1fr; gap:26px; align-items:center;
}
.compare-col{text-align:center;}
.compare-col select{
  width:100%; padding:11px; border-radius:6px; border:1px solid var(--line);
  font-family:'Poppins', sans-serif; font-size:14px; margin-bottom:14px; color:var(--ink);
  background:var(--cream);
}
.compare-value{font-family:'Playfair Display', serif; font-size:32px; font-weight:700; color:var(--maroon);}
.compare-label{font-size:12.5px; color:var(--ink-soft); margin-top:4px;}
.vs{font-family:'Playfair Display', serif; font-size:20px; color:var(--gold); font-weight:700;}

/* ===== LATEST GRID ===== */
.latest{max-width:1240px; margin:64px auto; padding:0 48px;}
.post-grid{display:grid; grid-template-columns:repeat(3, 1fr); gap:28px; margin-top:30px;}
.post-card{background:#fff; border:1px solid var(--line); border-radius:10px; overflow:hidden; transition:border-color 0.2s ease;}
.post-card:hover{border-color:var(--gold);}
.post-card img{height:190px; object-fit:cover; width:100%; background:var(--gold-light);}
.post-card-body{padding:18px 20px 22px;}
.badge{display:inline-block; font-size:11.5px; font-weight:600; padding:4px 12px; border-radius:20px; margin-bottom:12px;}
.badge.net-worth{background:var(--net-worth-bg); color:var(--net-worth);}
.badge.fashion{background:var(--fashion-bg); color:var(--fashion);}
.badge.age{background:var(--age-bg); color:var(--age);}
.badge.bio, .badge.celebbio{background:var(--bio-bg); color:var(--bio);}
.badge.uncategorized{background:var(--gold-light); color:var(--bio);}
.post-card h3{font-size:16.5px; font-weight:600; line-height:1.4; margin:0 0 10px;}
.post-card .meta{font-size:12px; color:var(--ink-soft);}

/* ===== NEWSLETTER ===== */
.newsletter{background:var(--gold-light); margin:80px 0; padding:54px 48px; text-align:center;}
.newsletter h2{font-family:'Playfair Display', serif; font-size:28px; color:var(--maroon); margin:0 0 10px;}
.newsletter p{color:var(--ink-soft); font-size:14.5px; margin:0 0 24px;}
.newsletter-form{display:flex; justify-content:center; gap:10px; max-width:440px; margin:0 auto;}
.newsletter-form input{flex:1; padding:13px 16px; border-radius:6px; border:1px solid var(--line); font-family:'Poppins', sans-serif; font-size:14px;}
.newsletter-form button{background:var(--maroon); color:#fff; border:none; padding:13px 24px; border-radius:6px; font-weight:600; font-size:14px;}

/* ===== SINGLE POST ===== */
.single-post{max-width:760px; margin:56px auto; padding:0 48px;}
.single-post .badge{margin-bottom:16px;}
.single-post h1{font-family:'Playfair Display', serif; font-size:38px; line-height:1.25; margin:0 0 16px;}
.single-post .meta{color:var(--ink-soft); font-size:13px; margin-bottom:28px;}
.single-post img{border-radius:8px; margin-bottom:28px;}
.single-post .entry-content{font-size:16px; color:var(--ink);}
.single-post .entry-content p{margin:0 0 20px;}

/* ===== FOOTER ===== */
.site-footer{background:var(--ink); color:#cfc9c3; padding:44px 48px; text-align:center; font-size:13px;}
.site-footer .flogo{font-family:'Playfair Display', serif; color:#fff; font-size:20px; font-weight:700; margin-bottom:10px;}
.site-footer .flogo span{color:var(--gold);}
.site-footer a:hover{color:var(--gold);}

@media (max-width:860px){
  .site-header{padding:18px 22px;} .main-nav{display:none;}
  .hero{grid-template-columns:1fr; padding:0 22px; margin:34px auto;}
  .trending{padding:34px 22px;} .trending-list{grid-template-columns:1fr;}
  .compare, .latest, .single-post{padding:0 22px;}
  .compare-box{grid-template-columns:1fr; text-align:center;}
  .post-grid{grid-template-columns:1fr;}
  .newsletter{padding:40px 22px;} .newsletter-form{flex-direction:column;}
}
