*{margin:0;padding:0;box-sizing:border-box}
body{font-family:'Segoe UI',system-ui,-apple-system,sans-serif;color:#e0e0e0;background:#0f0f1a;line-height:1.7}
a{color:#E8600A;text-decoration:none}
a:hover{text-decoration:underline}
img{max-width:100%;height:auto}

/* Header */
.site-header{background:#1a1a2e;padding:0 20px;position:sticky;top:0;z-index:100;border-bottom:2px solid #E8600A}
.header-inner{max-width:1200px;margin:0 auto;display:flex;align-items:center;justify-content:space-between;height:64px}
.logo{font-size:1.4rem;font-weight:700;color:#fff;letter-spacing:-.5px}
.logo span{color:#E8600A}
nav ul{list-style:none;display:flex;gap:24px}
nav a{color:#ccc;font-size:.95rem;font-weight:500}
nav a:hover{color:#E8600A;text-decoration:none}
.hamburger{display:none;background:none;border:none;color:#fff;font-size:1.6rem;cursor:pointer}

/* Hero */
.hero{background:linear-gradient(135deg,#1a1a2e 0%,#16213e 100%);padding:80px 20px;text-align:center}
.hero h1{font-size:2.6rem;color:#fff;margin-bottom:16px}
.hero h1 span{color:#E8600A}
.hero p{font-size:1.15rem;color:#aaa;max-width:700px;margin:0 auto 32px}

/* Buttons */
.btn-bartact{display:inline-block;background:#E8600A;color:#fff;padding:12px 28px;border-radius:6px;font-weight:700;font-size:1rem;border:none;cursor:pointer}
.btn-bartact:hover{background:#cc5200;text-decoration:none}
.btn-amazon{display:inline-block;background:#f0c14b;color:#111;padding:12px 28px;border-radius:6px;font-weight:700;font-size:1rem;border:none;cursor:pointer}
.btn-amazon:hover{background:#ddb347;text-decoration:none}
.btn-sm{padding:8px 18px;font-size:.9rem}

/* Sections */
.container{max-width:1200px;margin:0 auto;padding:40px 20px}
.section-title{font-size:2rem;color:#fff;margin-bottom:8px}
.section-sub{color:#999;margin-bottom:32px;font-size:1.05rem}

/* Cards */
.card-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(340px,1fr));gap:24px;margin-bottom:40px}
.card{background:#1a1a2e;border-radius:10px;padding:28px;border:1px solid #2a2a4a}
.card.top-pick{border-color:#E8600A;position:relative}
.card.top-pick::before{content:"#1 PICK";position:absolute;top:-12px;left:20px;background:#E8600A;color:#fff;padding:2px 14px;border-radius:4px;font-size:.8rem;font-weight:700}
.card h3{color:#fff;font-size:1.3rem;margin-bottom:10px}
.card .price{color:#E8600A;font-weight:700;font-size:1.1rem;margin-bottom:12px}
.card .pros,.card .cons{margin-bottom:12px}
.card .pros li::before{content:"✓ ";color:#4caf50;font-weight:700}
.card .cons li::before{content:"✗ ";color:#e74c3c;font-weight:700}
.card ul{list-style:none;padding-left:0}
.card li{margin-bottom:4px;font-size:.95rem}
.card .btns{display:flex;gap:10px;flex-wrap:wrap;margin-top:16px}

/* Comparison Table */
.comparison-wrap{overflow-x:auto;margin-bottom:40px}
table.comparison{width:100%;border-collapse:collapse;background:#1a1a2e;border-radius:8px;overflow:hidden;min-width:700px}
table.comparison th{background:#E8600A;color:#fff;padding:12px 16px;text-align:left;font-size:.9rem}
table.comparison td{padding:12px 16px;border-bottom:1px solid #2a2a4a;font-size:.9rem}
table.comparison tr:hover{background:#16213e}
table.comparison tr.highlight{background:rgba(232,96,10,.08)}

/* YMM */
.ymm-box{background:#1a1a2e;border-radius:10px;padding:32px;max-width:600px;margin:0 auto 40px;border:1px solid #2a2a4a;text-align:center}
.ymm-box h3{color:#fff;margin-bottom:16px;font-size:1.3rem}
.ymm-row{display:flex;gap:10px;justify-content:center;flex-wrap:wrap;margin-bottom:16px}
.ymm-row select{padding:10px 14px;border-radius:6px;border:1px solid #444;background:#0f0f1a;color:#e0e0e0;font-size:1rem;min-width:140px}
#ymm-result{margin-top:12px}

/* Gen links */
.gen-links{display:flex;gap:16px;justify-content:center;flex-wrap:wrap;margin:32px 0}
.gen-link{background:#1a1a2e;border:2px solid #2a2a4a;border-radius:8px;padding:20px 32px;color:#fff;font-weight:700;font-size:1.1rem;text-align:center;transition:border-color .2s}
.gen-link:hover{border-color:#E8600A;text-decoration:none}

/* Footer */
.site-footer{background:#1a1a2e;padding:40px 20px;border-top:1px solid #2a2a4a;margin-top:60px}
.footer-inner{max-width:1200px;margin:0 auto}
.footer-network{margin-bottom:20px}
.footer-network h4{color:#888;font-size:.85rem;text-transform:uppercase;margin-bottom:10px}
.footer-network a{color:#777;font-size:.85rem;margin-right:16px}
.footer-network a:hover{color:#E8600A}
.footer-bottom{color:#555;font-size:.8rem;line-height:1.8}
.disclosure{background:#16213e;padding:16px 20px;border-radius:6px;margin:20px 0;font-size:.82rem;color:#888;border-left:3px solid #E8600A}

/* Quick nav */
.quick-nav{display:flex;gap:12px;flex-wrap:wrap;margin-bottom:32px}
.quick-nav a{background:#16213e;padding:8px 16px;border-radius:20px;color:#ccc;font-size:.9rem}
.quick-nav a:hover{background:#E8600A;color:#fff;text-decoration:none}

/* Review page header */
.page-hero{background:linear-gradient(135deg,#1a1a2e,#16213e);padding:60px 20px;text-align:center}
.page-hero h1{font-size:2.2rem;color:#fff;margin-bottom:10px}
.page-hero p{color:#aaa;max-width:700px;margin:0 auto}

/* Responsive */
@media(max-width:768px){
  nav ul{display:none;flex-direction:column;position:absolute;top:64px;left:0;right:0;background:#1a1a2e;padding:20px;gap:16px;border-bottom:2px solid #E8600A}
  nav ul.open{display:flex}
  .hamburger{display:block}
  .hero h1{font-size:1.8rem}
  .card-grid{grid-template-columns:1fr}
  .ymm-row{flex-direction:column;align-items:center}
  .ymm-row select{width:100%;max-width:300px}
  .gen-links{flex-direction:column;align-items:center}
}
