/* CREASCOPE — Stylesheet */
/* Palette */
:root {
  --gold: #C8A96E;
  --gold-muted: rgba(200,169,110,0.3);
  --gold-faint: rgba(200,169,110,0.12);
  --dark: #0E0E0E;
  --dark-2: #141414;
  --dark-3: #1a1a1a;
  --light: #F5F4F0;
  --text-muted: rgba(245,244,240,0.55);
  --text-dim: rgba(245,244,240,0.35);
  --serif: Georgia, 'Times New Roman', serif;
  --sans: 'Helvetica Neue', Helvetica, Arial, sans-serif;
}

/* Reset */
*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
html { scroll-behavior: smooth; }
body {
  background: var(--dark);
  color: var(--light);
  font-family: var(--sans);
  font-size: 15px;
  line-height: 1.6;
  -webkit-font-smoothing: antialiased;
}
img { display: block; width: 100%; height: 100%; object-fit: cover; }
a { text-decoration: none; color: inherit; }

/* Layout */
.container { max-width: 1100px; margin: 0 auto; padding: 0 60px; }
.section-pad { padding: 96px 0; }

/* Typography */
.display { font-family: var(--serif); font-weight: 400; line-height: 0.92; letter-spacing: -2px; }
.serif { font-family: var(--serif); font-weight: 400; }
.label {
  font-size: 11px;
  letter-spacing: 3px;
  text-transform: uppercase;
  color: var(--gold);
  margin-bottom: 16px;
  display: block;
}
.gold { color: var(--gold); }
.muted { color: var(--text-muted); }

/* Divider */
.divider { width: 40px; height: 0.5px; background: var(--gold); margin: 28px 0; }
.hr { height: 0.5px; background: var(--gold-faint); border: none; }

/* Buttons */
.btn-gold {
  display: inline-block;
  background: var(--gold);
  color: var(--dark);
  font-size: 11px;
  letter-spacing: 2.5px;
  text-transform: uppercase;
  font-weight: 700;
  padding: 13px 28px;
  border: none;
  cursor: pointer;
  transition: opacity 0.2s;
}
.btn-gold:hover { opacity: 0.85; }
.btn-ghost {
  display: inline-block;
  background: transparent;
  color: var(--light);
  font-size: 11px;
  letter-spacing: 2.5px;
  text-transform: uppercase;
  font-weight: 600;
  padding: 13px 28px;
  border: 0.5px solid rgba(245,244,240,0.35);
  cursor: pointer;
  transition: border-color 0.2s, color 0.2s;
}
.btn-ghost:hover { border-color: var(--gold); color: var(--gold); }
.btn-dark {
  display: inline-block;
  background: var(--dark);
  color: var(--light);
  font-size: 11px;
  letter-spacing: 2.5px;
  text-transform: uppercase;
  font-weight: 700;
  padding: 13px 28px;
  border: none;
  cursor: pointer;
  transition: opacity 0.2s;
}
.btn-dark:hover { opacity: 0.8; }

/* Tags */
.tag {
  display: inline-block;
  font-size: 10px;
  letter-spacing: 1.5px;
  text-transform: uppercase;
  color: var(--gold);
  border: 0.5px solid var(--gold-muted);
  padding: 5px 11px;
}
.tags { display: flex; gap: 6px; flex-wrap: wrap; margin-bottom: 36px; }