:root {
  --bg-color: #0f1c2d; /* Deep Navy */
  --text-color: #f0f0f5; /* Off-white */
  --accent-color: #d4af37; /* Metallic Gold */
  --secondary-color: #2c3e50; /* Charcoal Blue */
  --link-color: #a8d5e2; /* Soft Ice Blue */
  --font-main: "Georgia", "Times New Roman", serif; /* Serif for elegance */
  --font-mono: "Courier New", Courier, monospace; /* Keeping mono for code snippets only */
  --trust-blue: #0070ba; /* PayPal Trust Blue */
}

* {
  box-sizing: border-box;
  margin: 0;
  padding: 0;
}

body {
  background-color: var(--bg-color);
  color: var(--text-color);
  font-family: var(--font-main);
  line-height: 1.8; /* Increased line-height for readability */
  font-size: 19px;
  display: flex;
  flex-direction: column;
  min-height: 100vh;
}

header, footer {
  padding: 30px 20px;
  background-color: #050a10; /* Darker navy for header/footer */
  border-bottom: 1px solid var(--accent-color);
  text-align: center;
}

footer {
  border-top: 1px solid var(--accent-color);
  border-bottom: none;
  margin-top: auto;
  font-size: 0.9em;
  color: #bdc3c7;
}

main {
  max-width: 900px;
  margin: 0 auto;
  padding: 60px 20px;
  width: 100%;
}

h1, h2, h3 {
  font-family: var(--font-main);
  color: var(--accent-color);
  margin-bottom: 1.5rem;
  line-height: 1.3;
  font-weight: normal; /* Elegant, not bold */
  letter-spacing: 0.5px;
}

h1 {
  font-size: 3rem;
  text-transform: uppercase;
  border-bottom: 2px solid var(--secondary-color);
  padding-bottom: 20px;
  margin-bottom: 40px;
}

h2 {
  font-size: 2.2rem;
  border-bottom: 1px solid var(--secondary-color);
  padding-bottom: 10px;
  margin-top: 3rem;
}

h3 {
  font-size: 1.6rem;
  margin-top: 2rem;
  font-style: italic;
}

p { margin-bottom: 1.8rem; text-align: justify; }

a { color: var(--link-color); text-decoration: none; transition: color 0.3s ease; border-bottom: 1px dotted var(--link-color); }
a:hover { color: var(--accent-color); border-bottom: 1px solid var(--accent-color); }

ul, ol { margin-bottom: 1.8rem; padding-left: 2rem; }
li { margin-bottom: 0.8rem; }

code, pre {
  font-family: var(--font-mono);
  background-color: #15202b;
  padding: 0.2em 0.4em;
  border-radius: 3px;
  border: 1px solid var(--secondary-color);
  color: #e0e0e0;
}

pre {
  padding: 1rem;
  overflow-x: auto;
  margin-bottom: 2rem;
}

img {
  max-width: 100%;
  height: auto;
  display: block;
}

/* Phase 4: GLOBAL CSS (AdSense CLS Armor) */
.ad-container-leaderboard {
  min-height: 90px;
  display: flex;
  justify-content: center;
  align-items: center;
  margin: 40px 0;
  background-color: #f2f2f2; /* Kept light for AdSense visibility */
  color: #333;
  border: 1px solid var(--secondary-color);
  box-shadow: 0 4px 6px rgba(0,0,0,0.3);
}

@media (max-width: 768px) {
  .ad-container-leaderboard {
    min-height: 250px;
  }
}

/* Custom styles for Satire/Data theme - Updated for Classy Look */
.stat-box {
  border: 1px solid var(--secondary-color);
  padding: 25px;
  margin-bottom: 30px;
  background: linear-gradient(135deg, #121f30 0%, #0a111a 100%);
  box-shadow: 0 4px 10px rgba(0,0,0,0.5);
  border-left: 4px solid var(--accent-color);
}

.warning-banner {
  background-color: #2c3e50; /* Changed from red to charcoal */
  color: var(--accent-color);
  padding: 15px;
  text-align: center;
  font-weight: bold;
  margin-bottom: 40px;
  border: 1px solid var(--accent-color);
  text-transform: uppercase;
  letter-spacing: 1px;
}

nav ul {
  list-style: none;
  padding: 0;
  display: flex;
  justify-content: center;
  gap: 30px;
  flex-wrap: wrap;
}

nav li { margin: 0; }
nav a {
  font-size: 1.1rem;
  text-transform: uppercase;
  letter-spacing: 1px;
  border-bottom: none;
}
nav a:hover {
  border-bottom: 1px solid var(--accent-color);
}

/* Phase 1: REVENUE BULKHEAD (Payment Button) */
.btn-payment {
  display: inline-block;
  background-color: var(--trust-blue);
  color: #ffffff !important;
  font-weight: bold;
  text-align: center;
  text-decoration: none;
  padding: 15px 30px;
  border-radius: 5px;
  border-bottom: none;
  margin: 30px auto;
  min-width: 44px; /* Mobile-First Law: Touch Target */
  min-height: 44px; /* Mobile-First Law: Touch Target */
  box-shadow: 0 4px 6px rgba(0,0,0,0.3);
  transition: transform 0.2s ease, box-shadow 0.2s ease;
  font-family: var(--font-main);
  text-transform: uppercase;
  letter-spacing: 0.5px;
}

.btn-payment:hover {
  transform: translateY(-2px);
  box-shadow: 0 6px 12px rgba(0,112,186,0.4);
  background-color: #005ea6; /* Slightly darker on hover */
  border-bottom: none;
}

.payment-container {
  text-align: center;
  margin-top: 40px;
  padding-top: 20px;
  border-top: 1px solid var(--secondary-color);
}