@import url('https://fonts.googleapis.com/css2?family=Cinzel:wght@400;600;700;900&family=Crimson+Pro:ital,wght@0,300;0,400;0,600;1,400&display=swap');

:root {
  --parchment:   #f5ede0;
  --parchment2:  #ede0cc;
  --parchment3:  #e4d4b8;
  --brown-deep:  #3a1f08;
  --brown-mid:   #6B3F1F;
  --brown-light: #8B5E3C;
  --gold:        #b8860b;
  --gold-light:  #d4a847;
  --gold-pale:   #e8c97a;
  --cream:       #fdf6ec;
  --text-body:   #4a2e10;
  --border:      #c8a96e;
  --border-light:#dfc89a;
}

* { margin:0; padding:0; box-sizing:border-box; }
html { scroll-behavior:smooth; }

body {
  background: var(--parchment);
  color: var(--text-body);
  font-family: 'Crimson Pro', Georgia, serif;
  font-size: 18px;
  line-height: 1.75;
  overflow-x: hidden;
  min-height: 100vh;
  display: flex;
  flex-direction: column;
}

/* NOISE OVERLAY */
body::after {
  content:'';
  position:fixed;
  inset:0;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='200' height='200'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='200' height='200' filter='url(%23n)' opacity='0.035'/%3E%3C/svg%3E");
  pointer-events:none;
  z-index:9999;
}

/* ===== HEADER ===== */
header {
  background: var(--cream);
  border-bottom: 1px solid var(--border);
  position: sticky;
  top: 0;
  z-index: 200;
  box-shadow: 0 2px 20px rgba(58,31,8,0.07);
}

.header-logo-bar {
  display: flex;
  justify-content: center;
  align-items: center;
  padding: 18px 40px 12px;
  border-bottom: 1px solid var(--border-light);
}

.header-logo-bar svg {
  width: min(460px, 85vw);
  height: auto;
  filter: drop-shadow(0 3px 10px rgba(58,31,8,0.1));
}

nav.main-nav {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 0;
  padding: 0;
  background: var(--brown-deep);
}

nav.main-nav a {
  font-family: 'Cinzel', serif;
  font-size: 10.5px;
  letter-spacing: 3px;
  text-transform: uppercase;
  color: var(--border);
  text-decoration: none;
  padding: 14px 32px;
  position: relative;
  transition: color 0.2s, background 0.2s;
  border-right: 1px solid rgba(200,169,110,0.15);
}

nav.main-nav a:first-child { border-left: 1px solid rgba(200,169,110,0.15); }

nav.main-nav a:hover,
nav.main-nav a.active {
  color: var(--gold-light);
  background: rgba(212,168,71,0.08);
}

nav.main-nav a.active::after {
  content:'';
  position:absolute;
  bottom:0; left:0; right:0;
  height:2px;
  background: var(--gold-light);
}

/* ===== MAIN CONTENT ===== */
main { flex: 1; }

/* ===== FOOTER ===== */
footer {
  background: var(--brown-deep);
  padding: 40px;
  text-align: center;
  border-top: 2px solid var(--gold);
  margin-top: auto;
}

.footer-name {
  font-family: 'Cinzel', serif;
  font-size: 16px;
  font-weight: 700;
  color: var(--parchment);
  letter-spacing: 3px;
  margin-bottom: 4px;
}
.footer-name span { color: var(--gold); }

.footer-sub {
  font-family: 'Cinzel', serif;
  font-size: 8px;
  letter-spacing: 5px;
  color: var(--border);
  margin-bottom: 22px;
}

.footer-nav {
  display: flex;
  justify-content: center;
  gap: 28px;
  list-style: none;
  margin-bottom: 20px;
  flex-wrap: wrap;
}

.footer-nav a {
  font-family: 'Cinzel', serif;
  font-size: 9px;
  letter-spacing: 2px;
  color: var(--border);
  text-decoration: none;
  transition: color 0.2s;
}
.footer-nav a:hover { color: var(--gold-light); }

.footer-runes {
  font-size: 16px;
  color: var(--gold);
  opacity: 0.25;
  letter-spacing: 8px;
  margin-bottom: 16px;
}

.footer-copy {
  font-size: 12px;
  color: var(--brown-light);
  opacity: 0.55;
}

/* ===== SHARED PAGE COMPONENTS ===== */
.page-hero {
  padding: 72px 40px 60px;
  text-align: center;
  background: linear-gradient(160deg, var(--cream) 0%, var(--parchment2) 100%);
  border-bottom: 1px solid var(--border);
  position: relative;
  overflow: hidden;
}

.page-hero::before {
  content:'';
  position:absolute;
  top:0; left:-10%; right:-10%;
  height:50%;
  background: radial-gradient(ellipse 70% 50% at 50% 0%, rgba(184,134,11,0.07) 0%, transparent 70%);
  pointer-events:none;
}

.page-hero .section-label {
  display:block;
  font-family:'Cinzel',serif;
  font-size:10px;
  letter-spacing:5px;
  text-transform:uppercase;
  color:var(--gold);
  margin-bottom:12px;
}

.page-hero h1 {
  font-family:'Cinzel',serif;
  font-size: clamp(28px,5vw,48px);
  font-weight:700;
  color:var(--brown-deep);
  line-height:1.2;
  margin-bottom:16px;
}

.page-hero p {
  max-width:600px;
  margin:0 auto;
  color:var(--brown-light);
  font-size:17px;
  font-style:italic;
}

/* Decorative mountain strip on page heroes */
.hero-mountains-strip {
  width:100%;
  height:80px;
  display:block;
  margin-top: -2px;
}

/* Divider */
.divider {
  display:flex;
  align-items:center;
  gap:14px;
  margin: 56px 0;
}
.divider-line { flex:1; height:1px; background:linear-gradient(90deg,transparent,var(--border),transparent); }
.divider-diamond { width:9px; height:9px; background:var(--gold); transform:rotate(45deg); flex-shrink:0; }

/* Section wrappers */
.section-wrap {
  max-width:1080px;
  margin:0 auto;
  padding: 72px 40px;
}

h2.section-title {
  font-family:'Cinzel',serif;
  font-size: clamp(22px, 3.5vw, 34px);
  font-weight:700;
  color:var(--brown-deep);
  margin-bottom:40px;
  line-height:1.25;
}

h3 {
  font-family:'Cinzel',serif;
  font-size:17px;
  font-weight:700;
  color:var(--brown-deep);
  margin-bottom:12px;
}

p { margin-bottom:18px; }
p:last-child { margin-bottom:0; }

/* Cards */
.card {
  background:var(--cream);
  border:1px solid var(--border);
  padding:32px 28px;
  transition:transform 0.2s, box-shadow 0.2s;
}
.card:hover { transform:translateY(-4px); box-shadow:0 12px 32px rgba(58,31,8,0.09); }

/* Buttons */
.btn {
  font-family:'Cinzel',serif;
  font-size:10px;
  letter-spacing:3px;
  text-transform:uppercase;
  padding:14px 30px;
  border:none;
  cursor:pointer;
  text-decoration:none;
  display:inline-block;
  transition:all 0.22s;
}
.btn-primary { background:var(--brown-deep); color:var(--gold-pale); border:1px solid var(--brown-deep); }
.btn-primary:hover { background:var(--gold); color:var(--brown-deep); border-color:var(--gold); }
.btn-outline { background:transparent; color:var(--brown-deep); border:1px solid var(--brown-mid); }
.btn-outline:hover { background:var(--brown-deep); color:var(--gold-pale); }
.btn-gold { background:var(--gold); color:var(--brown-deep); border:1px solid var(--gold); }
.btn-gold:hover { background:var(--brown-deep); color:var(--gold-pale); border-color:var(--brown-deep); }

/* Inputs */
input, textarea, select {
  background:var(--parchment);
  border:1px solid var(--border);
  padding:13px 16px;
  font-family:'Crimson Pro',serif;
  font-size:16px;
  color:var(--brown-deep);
  outline:none;
  transition:border-color 0.2s;
  width:100%;
}
input:focus, textarea:focus, select:focus { border-color:var(--gold); }
input::placeholder, textarea::placeholder { color:var(--brown-light); opacity:0.45; }
textarea { resize:vertical; }

label {
  font-family:'Cinzel',serif;
  font-size:9.5px;
  letter-spacing:2.5px;
  text-transform:uppercase;
  color:var(--brown-mid);
  display:block;
  margin-bottom:7px;
}

/* Fade in animation */
@keyframes fadeUp {
  from { opacity:0; transform:translateY(22px); }
  to   { opacity:1; transform:translateY(0); }
}
.fade-in { animation: fadeUp 0.7s ease both; }
.fade-in-2 { animation: fadeUp 0.7s 0.15s ease both; }
.fade-in-3 { animation: fadeUp 0.7s 0.3s ease both; }

/* Responsive */
@media(max-width:760px){
  nav.main-nav a { padding:12px 16px; letter-spacing:1.5px; font-size:9.5px; }
  .section-wrap { padding:48px 20px; }
  .page-hero { padding:48px 20px 40px; }
}
@media(max-width:480px){
  nav.main-nav { flex-wrap:wrap; }
  nav.main-nav a { flex:1 1 33%; text-align:center; border:none; border-bottom:1px solid rgba(200,169,110,0.15); }
}
