:root {
  --color-primary: #1e3a5f;
  --color-primary-dark: #152a45;
  --color-secondary: #d4af37;
  --color-accent: #8b4513;
  --color-gold: #c9a227;
  --color-light: #f8f6f0;
  --color-cream: #faf8f3;
  --color-text: #2d3748;
  --color-text-light: #4a5568;
  --font-heading: 'Merriweather', Georgia, serif;
  --font-body: 'Open Sans', -apple-system, sans-serif;
  --shadow-soft: 0 4px 6px -1px rgba(0,0,0,0.1);
  --shadow-medium: 0 10px 15px -3px rgba(0,0,0,0.1);
  --border-radius: 12px;
  --transition: all 0.3s ease;
}
* { margin:0; padding:0; box-sizing:border-box; }
html { font-size:16px; scroll-padding-top:120px; }
body {
  font-family: var(--font-body);
  color: var(--color-text);
  background: var(--color-cream);
  line-height: 1.7;
  min-height: 100vh;
  display:flex;
  flex-direction:column;
}
a { text-decoration: none; }
.container { max-width:1200px; margin:0 auto; padding:0 1.5rem; }

/* Header */
.site-header {
  background: linear-gradient(135deg, var(--color-primary) 0%, var(--color-primary-dark) 100%);
  color: white;
  position: sticky;
  top: 0;
  z-index: 1000;
  box-shadow: var(--shadow-medium);
}
.header-content {
  display:flex;
  align-items:center;
  justify-content:space-between;
  padding:1rem 0;
  gap:1rem;
  flex-wrap:wrap;
}
.logo { display:flex; align-items:center; gap:0.75rem; color:white; font-family: var(--font-heading); }
.logo-icon { font-size:1.75rem; color: var(--color-gold); }
.logo-text { font-size:1.5rem; font-weight:700; }

/* Hero */
.hero {
  background: linear-gradient(135deg, var(--color-primary) 0%, var(--color-primary-dark) 100%);
  color:white;
  padding:4rem 0;
  margin-bottom:3rem;
  border-radius: 0 0 var(--border-radius) var(--border-radius);
}
.hero-inner { display:grid; grid-template-columns:minmax(0,1.2fr) minmax(0,0.8fr); gap:2.5rem; align-items:center; }
.hero-copy { text-align:left; }
.hero h1 { font-family: var(--font-heading); font-size:2.5rem; font-weight:700; margin-bottom:1rem; line-height:1.3; }
.hero-subtitle { font-size:1.25rem; opacity:0.9; max-width:600px; margin:0; }
.hero-media { display:flex; justify-content:center; }
.hero-media img { width:min(320px,100%); height:auto; border-radius:24px; box-shadow:0 18px 40px rgba(0,0,0,0.25); }

.category-header { text-align:center; margin-bottom:2rem; }
.category-intro { max-width:700px; margin:0 auto; color: var(--color-text-light); font-size:1.1rem; }

.category-hero { display:grid; grid-template-columns:minmax(0,1fr) minmax(0,200px); align-items:center; gap:2rem; text-align:left; }
.category-hero-media { display:flex; justify-content:center; }
.category-hero-media img { width:180px; height:auto; }

.btn { display:inline-flex; align-items:center; justify-content:center; padding:0.75rem 1.5rem; border-radius:999px; background: var(--color-primary); color:white; font-weight:600; }

@media (max-width:900px) {
  .hero-inner { grid-template-columns:1fr; text-align:center; }
  .hero-copy { text-align:center; }
  .hero-subtitle { margin:0 auto; }
  .category-hero { grid-template-columns:1fr; text-align:center; }
}