/* Shared styles for opportunity.html and protection.html */
*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
html { scroll-behavior: smooth; }
body {
  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", system-ui, sans-serif;
  background: #0E0D0A; color: #fff;
  line-height: 1.6; -webkit-font-smoothing: antialiased;
}
a { text-decoration: none; color: inherit; }
:root {
  --gold: #B8913A; --gold2: #C9A550;
  --dark: #0E0D0A; --border: rgba(255,255,255,.08);
}

header {
  position: fixed; top: 0; left: 0; right: 0; z-index: 100;
  padding: 18px 48px; display: flex; align-items: center;
  justify-content: space-between;
  background: rgba(14,13,10,.96); backdrop-filter: blur(12px);
  border-bottom: 1px solid rgba(255,255,255,.06);
}
.logo { font-family: Georgia, serif; font-size: 1rem; font-weight: 400;
  letter-spacing: .02em; color: #fff; }
.logo small { display: block; font-size: .6rem; letter-spacing: .14em;
  text-transform: uppercase; opacity: .5; font-style: normal; margin-top: 2px; }
.back-btn { font-size: .75rem; font-weight: 600; letter-spacing: .1em;
  text-transform: uppercase; color: var(--gold2);
  display: flex; align-items: center; gap: 8px; opacity: .8; transition: opacity .2s; }
.back-btn:hover { opacity: 1; }
.back-btn::before { content: '←'; font-size: 1rem; }

.eyebrow { font-size: .68rem; font-weight: 700; letter-spacing: .18em;
  text-transform: uppercase; color: var(--gold); margin-bottom: 16px; display: block; }
h1 { font-family: Georgia, serif; font-weight: 400; font-style: italic;
  font-size: clamp(2.4rem, 4vw, 3.8rem); line-height: 1.1;
  letter-spacing: -.02em; color: #fff; margin-bottom: 20px; }
.cta-btn { display: inline-block; background: var(--gold); color: #fff;
  padding: 14px 36px; font-size: .88rem; font-weight: 600;
  letter-spacing: .04em; border-radius: 5px; transition: background .2s; }
.cta-btn:hover { background: var(--gold2); }

@media (max-width: 768px) {
  header { padding: 16px 24px; }
}