/* PhonesCheaper - Shared Styles */
* { margin: 0; padding: 0; box-sizing: border-box; }

body { 
  font-family: 'Inter', sans-serif; 
  background: linear-gradient(180deg, #dff8e8 0%, #f0fbf4 100%); 
  color: #06321a; 
  line-height: 1.6;
  min-height: 100vh;
}

.container { max-width: 900px; margin: 0 auto; padding: 20px; }

/* Header */
header { text-align: center; padding: 40px 20px 20px; }
h1 { font-size: 2.5rem; margin-bottom: 0.5rem; color: #15532f; }
h1 a { color: inherit; text-decoration: none; }
h1 a:hover { opacity: 0.8; }
.tagline { font-size: 1.2rem; color: #2d5a3d; font-weight: 600; }

/* Navigation */
nav { background: white; border-radius: 12px; padding: 15px; margin: 20px 0; box-shadow: 0 2px 8px rgba(0,0,0,0.08); }
nav ul { list-style: none; display: flex; flex-wrap: wrap; justify-content: center; gap: 10px; }
nav a { 
  color: #15532f; 
  text-decoration: none; 
  font-weight: 600; 
  padding: 10px 16px; 
  border-radius: 8px; 
  transition: all 0.3s; 
  display: block; 
  border: 2px solid transparent; 
}
nav a:hover { background: #dff8e8; }
nav a.active { background: #15532f; color: white; border-color: #15532f; }

/* Content Sections */
.intro { background: white; border-radius: 12px; padding: 30px; margin: 30px 0; box-shadow: 0 4px 12px rgba(0,0,0,0.08); }
.intro h2 { color: #15532f; margin-bottom: 15px; font-size: 1.5rem; }
.intro p { margin-bottom: 15px; color: #444; font-size: 1.05rem; }

.content-section { background: white; border-radius: 12px; padding: 30px; margin: 20px 0; box-shadow: 0 4px 12px rgba(0,0,0,0.08); }
.content-section h2 { color: #15532f; margin-bottom: 20px; padding-bottom: 10px; border-bottom: 2px solid #dff8e8; }
.content-section h3 { color: #2d5a3d; margin: 20px 0 10px; font-size: 1.2rem; }
.content-section p { margin-bottom: 15px; color: #444; }
.content-section ul { margin: 15px 0; padding-left: 25px; }
.content-section li { margin: 8px 0; color: #444; }

/* Retailer Grid */
.retailer-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); gap: 15px; margin: 20px 0; }
.retailer-card { background: #f8fdf9; border: 2px solid #dff8e8; border-radius: 8px; padding: 15px; text-align: center; }
.retailer-card h4 { color: #15532f; margin-bottom: 5px; }

/* Product Cards */
.amazon-products { display: grid; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); gap: 20px; margin: 30px 0; }
.product-card { 
  background: white; 
  border: 2px solid #e0e0e0; 
  border-radius: 10px; 
  padding: 15px; 
  text-decoration: none; 
  color: inherit; 
  transition: all 0.3s; 
  display: block; 
}
.product-card:hover { 
  border-color: #15532f; 
  box-shadow: 0 6px 20px rgba(0,0,0,0.12); 
  transform: translateY(-2px); 
}
.product-card img { 
  width: 100%; 
  height: 180px; 
  object-fit: contain; 
  border-radius: 8px; 
  margin-bottom: 12px; 
}
.product-title { font-size: 1rem; font-weight: 700; margin-bottom: 8px; color: #15532f; min-height: 48px; }
.product-meta { font-size: 0.85rem; color: #666; margin-bottom: 10px; }
.product-cta { font-size: 1rem; font-weight: 700; color: #007600; padding: 8px; background: #dff8e8; border-radius: 6px; text-align: center; }

/* Blog Grid */
.blog-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(250px, 1fr)); gap: 20px; margin: 30px 0; }
.blog-card { 
  background: white; 
  border: 2px solid #e0e0e0; 
  border-radius: 10px; 
  padding: 20px; 
  text-decoration: none; 
  color: inherit; 
  transition: all 0.3s; 
  display: block; 
}
.blog-card:hover { 
  border-color: #15532f; 
  box-shadow: 0 6px 20px rgba(0,0,0,0.12); 
  transform: translateY(-2px); 
}
.blog-card h3 { color: #15532f; margin-bottom: 10px; }
.blog-card p { color: #666; font-size: 0.95rem; }

/* Comparison Table */
.comparison-table { width: 100%; border-collapse: collapse; margin: 20px 0; font-size: 0.95rem; }
.comparison-table th, .comparison-table td { padding: 12px; text-align: left; border-bottom: 1px solid #e0e0e0; }
.comparison-table th { background: #f8fdf9; color: #15532f; font-weight: 700; }
.comparison-table tr:hover { background: #f8fdf9; }

/* Savings Box */
.savings-box { background: #dff8e8; border-left: 4px solid #15532f; padding: 15px; margin: 15px 0; border-radius: 4px; }

/* Affiliate Disclosure */
.affiliate-disclosure { 
  background: #fff8dc; 
  border: 1px solid #f0e68c; 
  border-radius: 8px; 
  padding: 15px; 
  margin: 20px 0; 
  font-size: 0.9rem; 
  color: #666; 
}

/* Footer */
footer { text-align: center; padding: 30px 20px; color: #666; font-size: 0.9rem; }
footer p { margin-bottom: 8px; }

/* Back to Home Link */
.back-link { 
  display: inline-block; 
  margin-bottom: 20px; 
  color: #15532f; 
  text-decoration: none; 
  font-weight: 600; 
}
.back-link:hover { text-decoration: underline; }

/* Key Specs Box */
.specs-box { 
  background: #f8fdf9; 
  border: 2px solid #dff8e8; 
  border-radius: 8px; 
  padding: 20px; 
  margin: 20px 0; 
}
.specs-box h3 { color: #15532f; margin-bottom: 15px; }

/* Responsive */
@media (max-width: 768px) { 
  h1 { font-size: 1.8rem; } 
  .amazon-products, .blog-grid { grid-template-columns: 1fr; } 
  nav ul { flex-direction: column; align-items: stretch; }
  nav a { text-align: center; }
  .comparison-table { font-size: 0.85rem; }
  .comparison-table th, .comparison-table td { padding: 8px 6px; }
}