/*
Theme Name:  CricGuides Dynamic
Theme URI:   https://cricguides.com
Author:      CricGuides
Description: A modern, fully dynamic cricket guides, reviews & fantasy tips theme. Every homepage section, color, and listing is editable from the Customizer with no code required.
Version:     1.0.0
Requires at least: 6.0
Requires PHP: 7.4
License:     GNU General Public License v2 or later
License URI: https://www.gnu.org/licenses/gpl-2.0.html
Text Domain: cricguides
Tags:        cricket, blog, news, affiliate, sports, two-columns, custom-colors, custom-logo, custom-menu, featured-images, threaded-comments, translation-ready

This theme, like WordPress, is licensed under the GPL.
Use it to make something cool, have fun, and share what you've learned with others.
*/

:root{
    --green:#1f7a3d;
    --green-dark:#155c2c;
    --green-darker:#0d3f1d;
    --red:#c8202f;
    --ink:#1a1d1a;
    --ink-soft:#5b6258;
    --line:#e7e9e4;
    --bg:#f7f8f5;
    --gold:#f0a826;
    --white:#ffffff;
    --radius:10px;
    --shadow:0 1px 3px rgba(20,30,20,0.06), 0 1px 2px rgba(20,30,20,0.04);
    --shadow-md:0 4px 14px rgba(20,30,20,0.08);
  }
  *{box-sizing:border-box;}
  html,body{margin:0;padding:0;}
  body{
    font-family:"Inter",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Helvetica,Arial,sans-serif;
    color:var(--ink);
    background:var(--bg);
    line-height:1.45;
  }
  /* soft dotted texture + faint top-down tint to break up flat middle sections */
  .content-zone{
    position:relative;
    background:
      radial-gradient(circle at 1px 1px, rgba(31,122,61,0.07) 1px, transparent 0) 0 0/26px 26px,
      linear-gradient(180deg, #f3f6f1 0%, #f7f8f5 6%, #f7f8f5 94%, #f1f4ee 100%);
  }
  .content-zone::before{
    content:"";position:absolute;top:0;left:0;right:0;height:340px;
    background:radial-gradient(ellipse 60% 100% at 15% 0%, rgba(31,122,61,0.06), transparent 70%);
    pointer-events:none;
  }
  img{max-width:100%;display:block;}
  a{color:inherit;text-decoration:none;}
  ul{margin:0;padding:0;list-style:none;}
  button{font-family:inherit;cursor:pointer;border:none;}
  .wrap{max-width:1240px;margin:0 auto;padding:0 24px;}

  /* ---------- Top utility bar ---------- */
  .topbar{
    background:var(--green-darker);
    color:#cfe6d6;
    font-size:13px;
  }
  .topbar .wrap{
    display:flex;
    align-items:center;
    justify-content:space-between;
    height:38px;
  }
  .topbar-left{display:flex;align-items:center;gap:18px;}
  .topbar-left span{display:flex;align-items:center;gap:6px;white-space:nowrap;}
  .topbar-right{display:flex;align-items:center;gap:20px;}
  .topbar-right a{color:#cfe6d6;opacity:.9;}
  .topbar-right a:hover{opacity:1;text-decoration:underline;}
  .topbar-search{
    background:rgba(255,255,255,0.08);
    border-radius:6px;
    padding:5px 10px;
    display:flex;align-items:center;gap:6px;
    color:#a9c7b1;
    font-size:12.5px;
  }
  @media (max-width:860px){
    .topbar-left span:not(:first-child){display:none;}
    .topbar-search{display:none;}
  }
  @media (max-width:560px){
    .topbar .wrap{flex-wrap:nowrap;overflow:hidden;}
    .topbar-left span{font-size:11.5px;}
    .topbar-right{gap:10px;flex-shrink:0;}
    .topbar-right a:not(:last-child){display:none;}
  }
  @media (max-width:400px){
    .topbar-left span{font-size:10.5px;}
  }

  /* ---------- Header / nav ---------- */
  header.main{
    background:var(--white);
    border-bottom:1px solid var(--line);
    position:relative;
    z-index:50;
  }
  .nav-row{
    display:flex;
    align-items:center;
    justify-content:space-between;
    height:74px;
    gap:24px;
  }
  .brand{
    display:flex;align-items:center;gap:10px;
    font-weight:800;font-size:22px;letter-spacing:-0.02em;
    flex-shrink:0;
  }
  .brand .ball{
    width:30px;height:30px;border-radius:50%;
    background:radial-gradient(circle at 35% 30%, #e2483f, var(--red) 70%);
    position:relative;flex-shrink:0;
  }
  .brand .ball::after{
    content:"";position:absolute;inset:3px;
    border:1.5px dashed rgba(255,255,255,.55);
    border-radius:50%;
  }
  nav.primary{display:flex;align-items:center;gap:30px;flex:1;justify-content:center;}
  /* When items_wrap outputs a real <ul> (a WordPress menu is assigned to this
     location), reset list styling and lay items out the same as the flat
     <a> fallback markup used when no menu has been assigned yet. */
  nav.primary ul{display:flex;align-items:center;gap:30px;list-style:none;margin:0;padding:0;}
  nav.primary li{display:flex;align-items:center;}
  nav.primary a{
    font-size:15px;font-weight:500;color:var(--ink);
    display:flex;align-items:center;gap:4px;
    padding:8px 0;white-space:nowrap;
  }
  nav.primary a.active,
  nav.primary li.current-menu-item > a,
  nav.primary li.current_page_item > a{
    color:var(--green);font-weight:600;border-bottom:2px solid var(--green);
  }
  nav.primary a:hover{color:var(--green);}
  .caret{font-size:10px;opacity:.55;margin-top:1px;}
  .btn-deals{
    background:var(--green);color:var(--white);
    font-weight:600;font-size:14.5px;
    padding:11px 22px;border-radius:7px;
    display:flex;align-items:center;gap:7px;
    flex-shrink:0;
    transition:background .15s ease;
  }
  .btn-deals:hover{background:var(--green-dark);}
  .burger{display:none;background:none;padding:6px;flex-shrink:0;border-radius:6px;}
  .burger span{display:block;width:24px;height:2px;background:var(--ink);margin:5px 0;border-radius:2px;transition:transform .2s ease, opacity .2s ease;}
  .burger:hover{background:#f3f6f1;}
  .burger.is-open span:nth-child(1){transform:translateY(7px) rotate(45deg);}
  .burger.is-open span:nth-child(2){opacity:0;}
  .burger.is-open span:nth-child(3){transform:translateY(-7px) rotate(-45deg);}

  /* ---------- Mobile nav drawer ---------- */
  .mobile-nav{
    display:none;
    max-height:0;
    overflow:hidden;
    background:var(--white);
    border-bottom:1px solid var(--line);
    transition:max-height .25s ease;
  }
  .mobile-nav.is-open{max-height:80vh;overflow-y:auto;}
  .mobile-nav-inner{padding:8px 0 16px;}
  .mobile-nav a{
    display:flex;align-items:center;justify-content:space-between;
    padding:13px 0;font-size:15.5px;font-weight:600;color:var(--ink);
    border-bottom:1px solid var(--line);
  }
  .mobile-nav a:last-child{border-bottom:none;}
  .mobile-nav a.active{color:var(--green);}
  .mobile-nav a .nav-arrow{color:#c7cdc2;font-size:13px;}
  .mobile-nav .mn-cta{
    margin-top:14px;background:var(--green);color:var(--white)!important;
    justify-content:center;border-radius:8px;border-bottom:none;padding:13px 0;
  }

  @media (max-width:980px){
    nav.primary{display:none;}
    .burger{display:block;}
    .mobile-nav{display:block;}
  }
  @media (max-width:560px){
    .btn-deals span.label{display:none;}
    .btn-deals{padding:11px 14px;}
  }

  /* ---------- Popular topics strip ---------- */
  .topics-strip{
    background:var(--white);
    border-bottom:1px solid var(--line);
    font-size:13.5px;
    color:var(--ink-soft);
  }
  .topics-strip .wrap{
    display:flex;align-items:center;gap:26px;
    height:42px;overflow-x:auto;
    scrollbar-width:none;
  }
  .topics-strip .wrap::-webkit-scrollbar{display:none;}
  .topics-strip .label{font-weight:700;color:var(--ink);white-space:nowrap;}
  .topics-strip a{white-space:nowrap;display:flex;align-items:center;gap:6px;}
  .topics-strip a:hover{color:var(--green);}
  .dot{color:var(--gold);font-size:11px;}

  /* ---------- Hero ---------- */
  .hero{
    position:relative;
    min-height:460px;
    padding:0;
    overflow:hidden;
  }
  .hero-bg-photo{
    position:absolute;inset:0;
    width:100%;height:100%;
    object-fit:cover;
    object-position:75% 30%;
    z-index:0;
  }
  .hero-bg-photo.is-placeholder{
    background:linear-gradient(115deg, var(--bg) 0%, var(--bg) 38%, #e9efe6 52%, #16331f 78%, #0c2415 100%);
  }
  .hero::before{
    content:"";position:absolute;inset:0;
    background:linear-gradient(90deg, var(--bg) 0%, rgba(247,248,245,.9) 26%, rgba(247,248,245,.25) 48%, rgba(10,20,12,.05) 68%);
    z-index:1;
  }
  .hero-inner{
    position:relative;z-index:2;
    padding:52px 0 64px;
  }
  .hero-copy{max-width:660px;}
  .eyebrow{
    display:inline-flex;align-items:center;gap:7px;
    color:var(--green);font-weight:700;font-size:13px;
    letter-spacing:.04em;text-transform:uppercase;
    margin-bottom:18px;
  }
  .eyebrow::before{content:"●";color:var(--gold);font-size:10px;}
  h1.hero-title{
    font-size:44px;line-height:1.12;font-weight:800;
    letter-spacing:-0.02em;margin:0 0 18px;
  }
  h1.hero-title .accent{color:var(--green);}
  .hero-sub{
    font-size:16px;color:var(--ink-soft);
    max-width:460px;margin:0 0 26px;
  }
  .search-pill{
    display:flex;align-items:center;background:var(--white);
    border:1px solid #e3e6df;border-radius:12px;
    padding:5px 5px 5px 20px;max-width:480px;
    box-shadow:0 1px 2px rgba(20,30,20,0.04);margin-bottom:30px;
  }
  .search-pill svg.search-ic{flex-shrink:0;color:#9aa399;}
  .search-pill input{
    border:none;outline:none;flex:1;font-size:15px;
    background:transparent;padding:13px 10px;
    font-family:inherit;color:var(--ink);
  }
  .search-pill input::placeholder{color:#9aa399;}
  .search-pill button{
    background:var(--green-dark);color:var(--white);font-weight:700;
    font-size:15px;padding:13px 28px;border-radius:8px;
    white-space:nowrap;
  }
  .search-pill button:hover{background:var(--green-darker);}
  .stat-row{display:flex;gap:22px;flex-wrap:wrap;}
  .stat{display:flex;align-items:center;gap:10px;}
  .stat .ic{
    width:44px;height:44px;border-radius:12px;
    background:#e2efe2;color:var(--green);
    display:flex;align-items:center;justify-content:center;
    flex-shrink:0;
  }
  .stat .ic svg{width:21px;height:21px;}
  .stat .num{font-weight:800;font-size:18px;line-height:1.15;color:var(--ink);}
  .stat .lbl{font-size:13px;color:var(--ink-soft);}

  .trending-card{
    position:absolute;
    top:52px;right:24px;
    width:300px;
    background:rgba(13,38,21,0.88);
    backdrop-filter:blur(6px);
    color:#e9f1ea;
    border-radius:14px;padding:20px 18px 18px;
    box-shadow:0 12px 30px rgba(0,0,0,0.25);
    z-index:3;
  }
  .trending-head{
    display:flex;align-items:center;gap:8px;
    font-weight:700;font-size:15px;margin-bottom:16px;
  }
  .trending-head .flame{color:var(--gold);}
  .trend-item{
    display:flex;gap:12px;align-items:flex-start;
    padding:10px 0;border-top:1px solid rgba(255,255,255,.1);
  }
  .trend-item:first-of-type{border-top:none;padding-top:0;}
  .trend-thumb{
    width:38px;height:38px;border-radius:8px;flex-shrink:0;
    background:linear-gradient(135deg,#3a7a4e,#1d4a2a);
  }
  .trend-text .t-title{font-size:13.5px;font-weight:600;line-height:1.3;margin-bottom:2px;}
  .trend-text .t-sub{font-size:12px;color:#a9c7b1;}
  .trending-card .view-all{
    display:block;text-align:center;margin-top:14px;
    background:rgba(255,255,255,.1);
    padding:11px;border-radius:8px;font-size:13.5px;font-weight:600;
  }
  .trending-card .view-all:hover{background:rgba(255,255,255,.18);}

  .hero-photo-credit{
    position:absolute;bottom:14px;right:24px;z-index:3;
    font-size:10.5px;color:rgba(255,255,255,.55);
    background:rgba(0,0,0,.25);padding:3px 9px;border-radius:5px;
  }

  @media (max-width:980px){
    .hero{min-height:0;}
    .hero-inner{padding:32px 0 24px;}
    .trending-card{
      position:static;width:100%;margin-top:8px;
    }
    .hero::before{
      background:linear-gradient(180deg, var(--bg) 0%, rgba(247,248,245,.92) 60%, rgba(247,248,245,.6) 85%, rgba(10,20,12,.05) 100%);
    }
    .hero-bg-photo{object-position:50% 20%;opacity:.85;}
  }
  @media (max-width:720px){
    h1.hero-title{font-size:32px;}
    .stat-row{gap:20px;}
  }

  /* ---------- Section heading shared ---------- */
  .section{padding:46px 0;position:relative;}
  .section-head{
    display:flex;align-items:center;justify-content:space-between;
    margin-bottom:24px;
  }
  .section-head h2{
    font-size:21px;font-weight:700;margin:0;
    display:flex;align-items:center;gap:10px;
  }
  .section-head h2 .ic{
    color:var(--green);font-size:16px;
    width:32px;height:32px;border-radius:9px;
    background:#e2efe2;display:flex;align-items:center;justify-content:center;
    flex-shrink:0;
  }
  .view-link{color:var(--green);font-size:14px;font-weight:600;white-space:nowrap;display:flex;align-items:center;gap:4px;}
  .view-link:hover{text-decoration:underline;}
  @media (max-width:560px){
    .section-head{flex-direction:column;align-items:flex-start;gap:8px;}
  }

  /* ---------- Category grid ---------- */
  .cat-grid{
    display:grid;grid-template-columns:repeat(7,1fr);gap:14px;
  }
  .cat-card{
    background:var(--white);border:1px solid var(--line);
    border-radius:12px;padding:22px 12px;text-align:center;
    position:relative;overflow:hidden;
    transition:box-shadow .18s ease, transform .18s ease, border-color .18s ease;
  }
  .cat-card::before{
    content:"";position:absolute;top:0;left:0;right:0;height:3px;
    background:linear-gradient(90deg,var(--green),#5cb877);
    transform:scaleX(0);transform-origin:left;
    transition:transform .25s ease;
  }
  .cat-card:hover{box-shadow:0 10px 24px rgba(31,122,61,0.12);transform:translateY(-3px);border-color:#cfe3d4;}
  .cat-card:hover::before{transform:scaleX(1);}
  .cat-card .cat-ic{
    width:44px;height:44px;margin:0 auto 12px;
    border-radius:12px;background:#eef5ec;
    display:flex;align-items:center;justify-content:center;
    font-size:22px;
    transition:background .18s ease, transform .18s ease;
  }
  .cat-card:hover .cat-ic{background:#e2efe2;transform:scale(1.06);}
  .cat-card .cat-name{font-weight:700;font-size:14px;margin-bottom:3px;}
  .cat-card .cat-count{font-size:12px;color:var(--ink-soft);}
  @media (max-width:980px){.cat-grid{grid-template-columns:repeat(4,1fr);}}
  @media (max-width:620px){
    .cat-grid{grid-template-columns:repeat(3,1fr);}
    .cat-card:last-child{grid-column:1 / -1;}
  }
  @media (max-width:420px){
    .cat-grid{grid-template-columns:repeat(2,1fr);}
    .cat-card:last-child{grid-column:1 / -1;}
  }

  /* ---------- 3-column feature row: how-to / deals / fantasy ---------- */
  .feature-row{
    display:grid;grid-template-columns:1fr 1.3fr 1fr;gap:20px;
  }
  .panel{
    background:var(--white);border:1px solid var(--line);
    border-radius:14px;padding:22px;
    transition:box-shadow .2s ease, border-color .2s ease;
  }
  .panel:not(.deals-panel):hover{box-shadow:0 10px 28px rgba(20,30,20,0.07);border-color:#dde6da;}
  .panel-head{display:flex;align-items:center;justify-content:space-between;margin-bottom:16px;}
  .panel-head h3{font-size:16px;font-weight:700;margin:0;}
  .panel-head a{font-size:12.5px;color:var(--green);font-weight:600;}
  .feat-list li{
    display:flex;gap:12px;align-items:flex-start;
    padding:10px 0;border-top:1px solid var(--line);
    border-radius:8px;margin:0 -8px;padding-left:8px;padding-right:8px;
    transition:background .15s ease;
  }
  .feat-list li:first-child{border-top:none;}
  .feat-list li:hover{background:#f5f9f4;}
  .feat-ic{
    width:32px;height:32px;border-radius:9px;background:#eaf3ec;color:var(--green);
    display:flex;align-items:center;justify-content:center;flex-shrink:0;font-size:14px;
    box-shadow:inset 0 0 0 1px rgba(31,122,61,0.08);
  }
  .feat-title{font-size:13.5px;font-weight:600;margin-bottom:1px;}
  .feat-sub{font-size:12px;color:var(--ink-soft);}
  .panel-cta{
    display:inline-block;margin-top:14px;
    background:#eaf3ec;color:var(--green);font-weight:700;font-size:13px;
    padding:10px 18px;border-radius:7px;
    transition:background .15s ease, transform .15s ease;
  }
  .panel-cta:hover{background:#dcecdf;transform:translateX(2px);}

  .deals-panel{
    background:linear-gradient(150deg,var(--green-darker),#143a22 60%, #0c2415);
    color:#eaf1eb;border:none;
    display:flex;flex-direction:column;justify-content:space-between;
    position:relative;overflow:hidden;
    min-height:340px;
    transition:box-shadow .2s ease;
  }
  .deals-panel:hover{box-shadow:0 14px 32px rgba(13,38,21,0.35);}
  .deals-tag{
    display:inline-flex;background:rgba(255,255,255,.12);color:var(--gold);
    font-size:11.5px;font-weight:700;letter-spacing:.04em;text-transform:uppercase;
    padding:5px 10px;border-radius:20px;margin-bottom:16px;width:fit-content;
  }
  .deals-panel h3{font-size:26px;font-weight:800;line-height:1.2;margin:0 0 12px;}
  .deals-panel h3 .amz{color:var(--gold);}
  .deals-panel p{font-size:13.5px;color:#bcd3c2;max-width:280px;margin:0 0 20px;}
  .deals-btn{
    background:var(--gold);color:#2a1c04;font-weight:700;font-size:13.5px;
    padding:12px 20px;border-radius:7px;display:inline-flex;align-items:center;gap:6px;
    width:fit-content;
    transition:background .15s ease, transform .15s ease;
  }
  .deals-btn:hover{background:#e09c1f;transform:translateX(2px);}
  .deals-graphic{
    position:absolute;right:-30px;bottom:-30px;width:230px;height:230px;
    background:radial-gradient(circle,#2c6b40,transparent 70%);
    opacity:.5;border-radius:50%;
  }

  @media (max-width:980px){
    .feature-row{grid-template-columns:1fr;}
    .deals-panel{min-height:260px;}
  }

  /* ---------- Latest / popular / SEO three-col ---------- */
  .three-col{
    display:grid;grid-template-columns:1.3fr 1fr 0.95fr;gap:20px;
  }
  .article-row{
    display:flex;gap:12px;padding:14px 8px;border-top:1px solid var(--line);
    margin:0 -8px;border-radius:9px;
    transition:background .15s ease;
  }
  .article-row:first-child{border-top:none;}
  .article-row:hover{background:#f5f9f4;}
  .article-row:hover .article-thumb{transform:scale(1.04);}
  .article-thumb{
    width:64px;height:54px;border-radius:8px;flex-shrink:0;
    background:linear-gradient(135deg,#2c6b40,#173d23);
    transition:transform .2s ease;
  }
  .article-cat{
    font-size:10.5px;font-weight:700;letter-spacing:.03em;
    text-transform:uppercase;margin-bottom:3px;
  }
  .article-cat.howto{color:var(--red);}
  .article-cat.buying{color:var(--green);}
  .article-cat.fantasy{color:#1c6fd8;}
  .article-cat.news{color:#9a5b00;}
  .article-title{font-size:14px;font-weight:700;line-height:1.3;margin-bottom:3px;}
  .article-meta{font-size:11.5px;color:var(--ink-soft);}

  .rank-row{
    display:flex;align-items:center;gap:14px;padding:13px 8px;
    margin:0 -8px;border-radius:9px;
    border-top:1px solid var(--line);
    transition:background .15s ease;
  }
  .rank-row:first-child{border-top:none;}
  .rank-row:hover{background:#f5f9f4;}
  .rank-num{
    font-size:18px;font-weight:800;color:#cfd6c9;width:26px;flex-shrink:0;
    transition:color .15s ease;
  }
  .rank-row:hover .rank-num{color:var(--green);}
  .rank-thumb{
    width:46px;height:46px;border-radius:8px;flex-shrink:0;
    background:linear-gradient(135deg,#2c6b40,#173d23);
  }
  .rank-title{font-size:13.5px;font-weight:700;line-height:1.3;margin-bottom:2px;}
  .rank-meta{font-size:11.5px;color:var(--ink-soft);}

  .check-list li{
    display:flex;gap:10px;align-items:flex-start;
    padding:10px 0;font-size:13.5px;
  }
  .check-list .tick{
    color:var(--white);font-weight:800;flex-shrink:0;
    width:18px;height:18px;border-radius:50%;background:var(--green);
    display:flex;align-items:center;justify-content:center;font-size:11px;
    margin-top:1px;
  }
  .check-list .ct-title{font-weight:600;}
  .check-list .ct-sub{color:var(--ink-soft);font-size:12px;}
  .learn-more{
    display:inline-block;color:var(--green);font-weight:600;font-size:13px;
    margin:6px 0 18px;
  }
  .learn-more:hover{text-decoration:underline;}
  .follow-head{font-weight:700;font-size:14.5px;margin-bottom:4px;}
  .follow-sub{font-size:12.5px;color:var(--ink-soft);margin-bottom:12px;}
  .social-row{display:flex;gap:10px;}
  .social-ic{
    width:34px;height:34px;border-radius:8px;background:#eaf3ec;color:var(--green);
    display:flex;align-items:center;justify-content:center;font-size:14px;
    transition:background .15s ease, transform .15s ease;
  }
  .social-ic:hover{background:var(--green);color:var(--white);transform:translateY(-2px);}

  @media (max-width:980px){.three-col{grid-template-columns:1fr;}}

  /* ---------- Deals carousel ---------- */
  .deals-section .section-head{margin-bottom:18px;}
  .deal-track{
    display:grid;grid-template-columns:repeat(5,1fr);gap:16px;
  }
  .deal-card{
    background:var(--white);border:1px solid var(--line);border-radius:12px;
    padding:16px;position:relative;
    transition:box-shadow .2s ease, transform .2s ease, border-color .2s ease;
  }
  .deal-card:hover{
    box-shadow:0 12px 28px rgba(20,30,20,0.1);
    transform:translateY(-3px);
    border-color:#d7e6db;
  }
  .affiliate-tag{
    position:absolute;top:12px;left:12px;
    background:#fbeee0;color:#a4660c;font-size:10px;font-weight:700;
    letter-spacing:.03em;text-transform:uppercase;padding:3px 8px;border-radius:5px;
  }
  .deal-img{
    height:100px;border-radius:8px;margin:18px 0 12px;
    background:#f1f3ee;display:flex;align-items:center;justify-content:center;
    color:#b9c1b3;font-size:28px;
    transition:background .2s ease;
  }
  .deal-card:hover .deal-img{background:#eaf3ec;}
  .deal-name{font-size:13.5px;font-weight:700;line-height:1.3;margin-bottom:6px;min-height:34px;}
  .deal-rating{font-size:12px;color:var(--gold);font-weight:700;margin-bottom:6px;}
  .deal-rating .count{color:var(--ink-soft);font-weight:500;}
  .deal-price{font-size:15px;font-weight:800;margin-bottom:10px;}
  .deal-price .prime{color:#1c6fd8;font-size:11px;font-weight:700;margin-left:6px;}
  .deal-btn{
    display:block;text-align:center;background:var(--gold);color:#2a1c04;
    font-weight:700;font-size:12.5px;padding:9px;border-radius:7px;
    transition:background .15s ease;
  }
  .deal-btn:hover{background:#e09c1f;}
  @media (max-width:980px){.deal-track{grid-template-columns:repeat(3,1fr);}}
  @media (max-width:620px){.deal-track{grid-template-columns:repeat(2,1fr);}}

  /* ---------- Trust logos ---------- */
  .trust-strip{padding:36px 0;text-align:center;}
  .trust-strip p{font-size:13px;color:var(--ink-soft);font-weight:600;margin-bottom:22px;letter-spacing:.02em;}
  .trust-logos{
    display:flex;align-items:center;justify-content:center;gap:48px;flex-wrap:wrap;
    opacity:.7;font-weight:700;font-size:18px;color:#6b7268;
  }
  @media (max-width:620px){.trust-logos{gap:26px;font-size:15px;}}

  /* ---------- Newsletter band ---------- */
  .newsletter{
    background:linear-gradient(120deg,var(--green-darker) 0%, var(--green-dark) 70%, #1f7a3d 100%);
    color:var(--white);padding:48px 0;position:relative;overflow:hidden;
  }
  .newsletter::after{
    content:"";position:absolute;right:-40px;bottom:-60px;width:220px;height:220px;
    background:radial-gradient(circle,var(--red) 0%, transparent 70%);opacity:.35;
  }
  .nl-row{
    display:flex;align-items:center;justify-content:space-between;gap:30px;flex-wrap:wrap;
    position:relative;z-index:1;
  }
  .nl-text h3{font-size:24px;font-weight:800;margin:0 0 6px;}
  .nl-text p{font-size:14px;color:#cfe6d6;margin:0;max-width:420px;}
  .nl-form{display:flex;gap:10px;flex-wrap:wrap;width:100%;}
  .nl-form input{
    border:none;border-radius:7px;padding:13px 16px;font-size:14px;
    min-width:260px;flex:1;font-family:inherit;
  }
  .nl-form button{
    background:var(--gold);color:#2a1c04;font-weight:700;font-size:14px;
    padding:13px 24px;border-radius:7px;flex-shrink:0;
  }
  .nl-form button:hover{background:#e09c1f;}
  .nl-note{font-size:11.5px;color:#9fc3a8;margin-top:8px;}
  @media (max-width:400px){
    .nl-form input{min-width:0;width:100%;}
    .nl-form button{width:100%;}
  }

  /* ---------- Footer ---------- */
  footer{background:var(--ink-darkest, #14241a);background:#142217;color:#a9c2af;padding:50px 0 0;}
  .footer-grid{
    display:grid;grid-template-columns:1.5fr 1fr 1fr 1fr 1fr;gap:30px;
    padding-bottom:36px;border-bottom:1px solid rgba(255,255,255,.08);
  }
  .footer-brand{display:flex;align-items:center;gap:9px;font-weight:800;font-size:19px;color:var(--white);margin-bottom:12px;}
  .footer-grid p{font-size:13px;line-height:1.6;color:#8aa491;max-width:260px;}
  .footer-social{display:flex;gap:10px;margin-top:16px;}
  .footer-social .social-ic{background:rgba(255,255,255,.07);color:#cfe6d6;}
  .footer-social .social-ic:hover{background:rgba(255,255,255,.14);}
  .footer-col h4{color:var(--white);font-size:13.5px;font-weight:700;margin:0 0 16px;letter-spacing:.03em;text-transform:uppercase;}
  .footer-col li{margin-bottom:10px;font-size:13.5px;}
  .footer-col a:hover{color:var(--white);}
  .footer-bottom{
    display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:10px;
    padding:20px 0;font-size:12.5px;color:#75906f;
  }
  @media (max-width:980px){
    .footer-grid{grid-template-columns:repeat(2,1fr);}
    .footer-brand-block{grid-column:1/-1;}
  }
  @media (max-width:560px){
    .footer-grid{grid-template-columns:1fr;}
  }

/* =====================================================================
   SHARED INNER-PAGE COMPONENTS: breadcrumbs, ad slots, sidebar, layouts
   ===================================================================== */

/* ---------- Breadcrumb ---------- */
.breadcrumb{
  padding:16px 0;font-size:13px;color:var(--ink-soft);
  display:flex;align-items:center;gap:6px;flex-wrap:wrap;
}
.breadcrumb a{color:var(--ink-soft);}
.breadcrumb a:hover{color:var(--green);}
.breadcrumb .sep{color:#c7cdc2;}
.breadcrumb .current{color:var(--ink);font-weight:600;}

/* ---------- Ad slots (affiliate / display ad placeholders) ---------- */
.ad-slot{
  border:1.5px dashed #d3dccd;
  background:repeating-linear-gradient(135deg, #f3f6f0 0 10px, #eef2ea 10px 20px);
  border-radius:10px;
  display:flex;flex-direction:column;align-items:center;justify-content:center;
  text-align:center;color:#8a9485;
  position:relative;
  margin:0 0 28px;
}
.ad-slot .ad-tag{
  position:absolute;top:8px;left:8px;
  font-size:9.5px;font-weight:700;letter-spacing:.05em;text-transform:uppercase;
  color:#a3ad97;background:rgba(255,255,255,.7);padding:2px 7px;border-radius:4px;
}
.ad-slot .ad-label{font-size:13px;font-weight:600;color:#9aa48d;}
.ad-slot .ad-size{font-size:11.5px;color:#aab3a0;margin-top:2px;}

.ad-slot--leaderboard{height:90px;}
.ad-slot--banner{height:120px;}
.ad-slot--rectangle{height:250px;width:300px;margin-left:auto;margin-right:auto;}
.ad-slot--square{height:280px;}
.ad-slot--inline{height:100px;margin:32px 0;}
.ad-slot--skyscraper{height:600px;}

/* native-style affiliate card (looks like content, labeled clearly) */
.affiliate-block{
  border:1px solid var(--line);background:var(--white);
  border-radius:12px;padding:18px;margin:0 0 28px;
  display:flex;gap:16px;align-items:center;
  transition:box-shadow .2s ease, transform .2s ease;
}
.affiliate-block:hover{box-shadow:0 10px 24px rgba(20,30,20,0.08);transform:translateY(-2px);}
.affiliate-block .aff-tagline{
  position:absolute;
}
.affiliate-block .aff-img{
  width:74px;height:74px;border-radius:9px;background:#f1f3ee;flex-shrink:0;
  display:flex;align-items:center;justify-content:center;font-size:26px;color:#b9c1b3;
}
.affiliate-block .aff-body{flex:1;min-width:0;}
.affiliate-block .aff-label{
  font-size:10px;font-weight:700;letter-spacing:.04em;text-transform:uppercase;
  color:#a4660c;background:#fbeee0;padding:2px 7px;border-radius:5px;display:inline-block;margin-bottom:6px;
}
.affiliate-block .aff-name{font-size:14.5px;font-weight:700;margin-bottom:3px;}
.affiliate-block .aff-meta{font-size:12.5px;color:var(--ink-soft);margin-bottom:8px;}
.affiliate-block .aff-price{font-size:15px;font-weight:800;color:var(--ink);}
.affiliate-block .aff-cta{
  flex-shrink:0;background:var(--gold);color:#2a1c04;font-weight:700;font-size:13px;
  padding:11px 18px;border-radius:7px;white-space:nowrap;
  transition:background .15s ease;
}
.affiliate-block .aff-cta:hover{background:#e09c1f;}
@media (max-width:560px){
  .affiliate-block{flex-wrap:wrap;}
  .affiliate-block .aff-cta{width:100%;text-align:center;}
}

/* ---------- Page layout: content + sidebar ---------- */
.page-head{padding:6px 0 30px;}
.page-head h1{font-size:32px;font-weight:800;letter-spacing:-0.01em;margin:0 0 10px;line-height:1.2;}
.page-head .page-sub{font-size:15.5px;color:var(--ink-soft);max-width:680px;margin:0;}
.page-meta-row{
  display:flex;align-items:center;gap:14px;flex-wrap:wrap;
  font-size:13px;color:var(--ink-soft);margin-top:14px;
}
.page-meta-row .meta-item{display:flex;align-items:center;gap:6px;}
.author-chip{
  display:flex;align-items:center;gap:10px;
}
.author-chip .avatar{
  width:34px;height:34px;border-radius:50%;
  background:linear-gradient(135deg,#3a7a4e,#1d4a2a);flex-shrink:0;
}
.author-chip .a-name{font-weight:700;font-size:13.5px;color:var(--ink);}
.author-chip .a-role{font-size:11.5px;color:var(--ink-soft);}

.layout-with-sidebar{
  display:grid;grid-template-columns:1fr 320px;gap:36px;align-items:start;
  padding:8px 0 60px;
}
.main-col{min-width:0;}
.sidebar-col{position:relative;}
.sidebar-sticky{position:sticky;top:24px;display:flex;flex-direction:column;gap:24px;}

.sidebar-card{
  background:var(--white);border:1px solid var(--line);border-radius:14px;
  padding:20px;
}
.sidebar-card h4{
  font-size:14.5px;font-weight:700;margin:0 0 14px;
  display:flex;align-items:center;gap:8px;
}
.sidebar-card h4 .ic{
  width:26px;height:26px;border-radius:7px;background:#e2efe2;color:var(--green);
  display:flex;align-items:center;justify-content:center;font-size:13px;flex-shrink:0;
}
.sidebar-toc li{margin-bottom:9px;font-size:13.5px;}
.sidebar-toc a{color:var(--ink-soft);display:flex;gap:8px;}
.sidebar-toc a:hover{color:var(--green);}
.sidebar-toc a .toc-num{color:#b9c4b3;font-weight:700;flex-shrink:0;}
.sidebar-toc a.active{color:var(--green);font-weight:600;}

.sidebar-product{
  display:flex;gap:12px;padding:12px 0;border-top:1px solid var(--line);
}
.sidebar-product:first-of-type{border-top:none;padding-top:0;}
.sidebar-product .sp-img{
  width:56px;height:56px;border-radius:8px;background:#f1f3ee;flex-shrink:0;
  display:flex;align-items:center;justify-content:center;font-size:20px;color:#b9c1b3;
}
.sidebar-product .sp-name{font-size:13px;font-weight:700;line-height:1.3;margin-bottom:3px;}
.sidebar-product .sp-price{font-size:12.5px;color:var(--ink-soft);}
.sidebar-product .sp-price strong{color:var(--ink);font-weight:800;}
.sidebar-product .sp-link{font-size:11.5px;color:var(--green);font-weight:600;}

.newsletter-card{
  background:linear-gradient(150deg,var(--green-darker),#143a22 70%);
  color:#e9f1ea;text-align:center;
}
.newsletter-card h4{color:#fff;justify-content:center;}
.newsletter-card p{font-size:12.5px;color:#bcd3c2;margin:0 0 14px;}
.newsletter-card input{
  width:100%;border:none;border-radius:7px;padding:11px 12px;font-size:13px;
  margin-bottom:8px;font-family:inherit;
}
.newsletter-card button{
  width:100%;background:var(--gold);color:#2a1c04;font-weight:700;font-size:13px;
  padding:11px;border-radius:7px;
}
.newsletter-card button:hover{background:#e09c1f;}

@media (max-width:980px){
  .layout-with-sidebar{grid-template-columns:minmax(0,1fr);}
  .sidebar-sticky{position:static;}
}

/* ---------- Article body content ---------- */
.article-body{font-size:15.5px;line-height:1.75;color:#33392f;}
.article-body h2{
  font-size:23px;font-weight:800;margin:38px 0 14px;letter-spacing:-0.01em;color:var(--ink);
  scroll-margin-top:90px;
}
.article-body h2:first-child{margin-top:0;}
.article-body h3{font-size:18px;font-weight:700;margin:28px 0 10px;color:var(--ink);}
.article-body p{margin:0 0 16px;}
.article-body ul, .article-body ol{margin:0 0 16px;padding-left:22px;}
.article-body li{margin-bottom:8px;}
.article-body strong{color:var(--ink);}
.article-body .lead{font-size:17px;color:var(--ink-soft);margin-bottom:24px;}
.article-hero-img{
  width:100%;aspect-ratio:16/9;border-radius:14px;margin-bottom:28px;
  background:linear-gradient(135deg,#2c6b40,#173d23);
  display:flex;align-items:center;justify-content:center;color:rgba(255,255,255,.4);font-size:13px;font-weight:600;
}
.pull-quote{
  border-left:3px solid var(--green);padding:6px 0 6px 20px;margin:24px 0;
  font-size:17px;font-weight:600;color:var(--ink);font-style:italic;
}
.spec-table{width:100%;border-collapse:collapse;margin:0 0 24px;font-size:14px;}
.spec-table th, .spec-table td{padding:11px 14px;border:1px solid var(--line);text-align:left;}
.spec-table th{background:#f3f6f1;font-weight:700;width:38%;color:var(--ink-soft);font-size:13px;}
.tag-row{display:flex;gap:8px;flex-wrap:wrap;margin-top:30px;padding-top:24px;border-top:1px solid var(--line);}
.tag-pill{
  background:#eef2ea;color:var(--ink-soft);font-size:12.5px;font-weight:600;
  padding:6px 14px;border-radius:20px;
}
.tag-pill:hover{background:#e2efe2;color:var(--green);}

.share-row{display:flex;align-items:center;gap:10px;margin:28px 0;padding:16px 0;border-top:1px solid var(--line);border-bottom:1px solid var(--line);}
.share-row .share-label{font-size:13px;font-weight:700;color:var(--ink-soft);margin-right:4px;}

.author-box{
  display:flex;gap:16px;background:#f5f9f4;border-radius:14px;padding:20px;margin-top:30px;
}
.author-box .avatar{
  width:54px;height:54px;border-radius:50%;flex-shrink:0;
  background:linear-gradient(135deg,#3a7a4e,#1d4a2a);
}
.author-box .a-name{font-weight:700;font-size:14.5px;margin-bottom:3px;}
.author-box .a-bio{font-size:13px;color:var(--ink-soft);line-height:1.6;}

/* ---------- Related / pagination ---------- */
.related-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;margin-top:16px;}
.related-card{
  background:var(--white);border:1px solid var(--line);border-radius:12px;overflow:hidden;
  transition:box-shadow .2s ease, transform .2s ease;
}
.related-card:hover{box-shadow:0 10px 24px rgba(20,30,20,0.08);transform:translateY(-3px);}
.related-card .rc-img{height:110px;background:linear-gradient(135deg,#2c6b40,#173d23);}
.related-card .rc-body{padding:14px;}
.related-card .rc-cat{font-size:10px;font-weight:700;letter-spacing:.03em;text-transform:uppercase;color:var(--green);margin-bottom:5px;}
.related-card .rc-title{font-size:13.5px;font-weight:700;line-height:1.35;}
@media (max-width:768px){.related-grid{grid-template-columns:1fr;}}

/* ---------- Category / listing page ---------- */
.filter-bar{
  display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:14px;
  background:var(--white);border:1px solid var(--line);border-radius:12px;
  padding:14px 18px;margin-bottom:24px;
}
.filter-bar .result-count{font-size:13.5px;color:var(--ink-soft);}
.filter-bar .result-count strong{color:var(--ink);}
.filter-pills{display:flex;gap:8px;flex-wrap:wrap;}
.filter-pill{
  background:#f3f6f1;color:var(--ink-soft);font-size:12.5px;font-weight:600;
  padding:7px 14px;border-radius:20px;cursor:pointer;
  transition:background .15s ease, color .15s ease;
}
.filter-pill.active{background:var(--green);color:var(--white);}
.filter-pill:not(.active):hover{background:#e2efe2;color:var(--green);}
.sort-select{
  font-size:13px;color:var(--ink);border:1px solid var(--line);border-radius:8px;
  padding:8px 12px;background:var(--white);font-family:inherit;
}

.listing-grid{display:grid;grid-template-columns:1fr;gap:16px;}
.listing-card{
  background:var(--white);border:1px solid var(--line);border-radius:14px;
  padding:18px;display:grid;grid-template-columns:160px 1fr auto;gap:18px;align-items:center;
  transition:box-shadow .2s ease, transform .2s ease, border-color .2s ease;
}
.listing-card:hover{box-shadow:0 10px 26px rgba(20,30,20,0.08);transform:translateY(-2px);border-color:#dde6da;}
.listing-card .lc-img{
  width:160px;height:110px;border-radius:10px;background:linear-gradient(135deg,#2c6b40,#173d23);
  flex-shrink:0;position:relative;
}
.listing-card .lc-rank{
  position:absolute;top:8px;left:8px;background:rgba(13,38,21,.85);color:var(--gold);
  font-size:11px;font-weight:800;padding:3px 8px;border-radius:5px;
}
.listing-card .lc-title{font-size:17px;font-weight:700;margin-bottom:6px;line-height:1.3;}
.listing-card .lc-title a{color:var(--ink);}
.listing-card .lc-title a:hover{color:var(--green);}
.listing-card .lc-desc{font-size:13.5px;color:var(--ink-soft);line-height:1.55;margin-bottom:10px;}
.listing-card .lc-meta{display:flex;gap:14px;font-size:12.5px;color:var(--ink-soft);flex-wrap:wrap;}
.listing-card .lc-meta .stars{color:var(--gold);font-weight:700;}
.listing-card .lc-cta{
  flex-shrink:0;text-align:center;background:#eaf3ec;color:var(--green);font-weight:700;font-size:13px;
  padding:11px 20px;border-radius:8px;white-space:nowrap;
  transition:background .15s ease;
}
.listing-card .lc-cta:hover{background:#dcecdf;}
@media (max-width:720px){
  .listing-card{grid-template-columns:1fr;}
  .listing-card .lc-img{width:100%;height:160px;}
  .listing-card .lc-cta{width:100%;}
}

.pagination{display:flex;align-items:center;justify-content:center;gap:8px;margin-top:32px;flex-wrap:wrap;}
.page-btn,
.pagination .page-numbers{
  width:38px;height:38px;border-radius:8px;background:var(--white);border:1px solid var(--line);
  display:flex;align-items:center;justify-content:center;font-size:13.5px;font-weight:700;color:var(--ink-soft);
  transition:background .15s ease, color .15s ease;
  text-decoration:none;
}
.page-btn.active,
.pagination .page-numbers.current{background:var(--green);color:var(--white);border-color:var(--green);}
.page-btn:not(.active):hover,
.pagination a.page-numbers:hover{background:#f3f6f1;color:var(--ink);}
.page-btn.next,
.pagination .page-numbers.next,
.pagination .page-numbers.prev{width:auto;padding:0 16px;gap:6px;}
.pagination .dots{
  width:38px;height:38px;display:flex;align-items:center;justify-content:center;
  color:var(--ink-soft);border:none;background:none;
}

/* ---------- Review page specific ---------- */
.review-score-card{
  display:flex;align-items:center;gap:20px;background:#f5f9f4;border-radius:14px;padding:22px;margin-bottom:28px;
}
.review-score{
  width:84px;height:84px;border-radius:50%;background:var(--green);color:var(--white);
  display:flex;flex-direction:column;align-items:center;justify-content:center;flex-shrink:0;
}
.review-score .rs-num{font-size:26px;font-weight:800;line-height:1;}
.review-score .rs-max{font-size:11px;opacity:.8;}
.review-score-body h3{font-size:16px;font-weight:700;margin:0 0 6px;}
.review-score-body .stars-row{color:var(--gold);font-size:15px;margin-bottom:6px;}
.review-score-body .verdict{font-size:13.5px;color:var(--ink-soft);}

.pros-cons{display:grid;grid-template-columns:1fr 1fr;gap:16px;margin:24px 0;}
.pros-cons .pc-box{border-radius:12px;padding:18px;}
.pros-cons .pc-box.pros{background:#eef7ef;}
.pros-cons .pc-box.cons{background:#fdf1f0;}
.pros-cons h4{font-size:14px;font-weight:700;margin:0 0 12px;display:flex;align-items:center;gap:6px;}
.pros-cons.pros h4{color:var(--green);}
.pc-box.pros h4{color:var(--green);}
.pc-box.cons h4{color:var(--red);}
.pc-box li{font-size:13.5px;margin-bottom:8px;padding-left:18px;position:relative;line-height:1.5;}
.pc-box.pros li::before{content:"+";position:absolute;left:0;color:var(--green);font-weight:800;}
.pc-box.cons li::before{content:"–";position:absolute;left:0;color:var(--red);font-weight:800;}
@media (max-width:620px){.pros-cons{grid-template-columns:1fr;}}

.rating-bars{margin:20px 0;}
.rating-bar-row{display:flex;align-items:center;gap:12px;margin-bottom:10px;font-size:13px;}
.rating-bar-row .rb-label{width:110px;color:var(--ink-soft);flex-shrink:0;}
.rating-bar-row .rb-track{flex:1;height:7px;background:#eef0ea;border-radius:5px;overflow:hidden;}
.rating-bar-row .rb-fill{height:100%;background:linear-gradient(90deg,var(--green),#5cb877);border-radius:5px;}
.rating-bar-row .rb-score{width:32px;text-align:right;font-weight:700;color:var(--ink);flex-shrink:0;}

/* make article/rank rows work as anchor wrappers */
a.article-row, a.rank-row{display:flex;color:inherit;}