/* ===== SavageConflicts - Medieval Header & Footer Theme. =====
   - Header: warm wood planks + gold rails
   - Footer: matches header (same wood + gold), no stone texture
   - Cards: force parchment backgrounds so no stone leaks onto them
   - Crenellation bar available via <div class="sc-crenel"></div> under navbar
   - Safe across pages; pairs with classes_style.css + home_theme_patch.css
*/

/* Palette (aligned to classes theme) */
:root{
  --stone:#1a1510;
  --stone-2:#0e0b0a;
  --gold:#caa24b;
  --gold-2:#ad8733;
  --parch:#f5ead3;
  --parch-2:#efe1c7;
  --ink:#2b221a;
}

/* =============== HEADER / NAV =============== */
.navbar{
  position: sticky; top:0; z-index:100;
  background:
    /* subtle wood grain shading */
    linear-gradient(180deg, rgba(0,0,0,.25), transparent 38%),
    /* wooden planks */
    repeating-linear-gradient(90deg, #5a3d1d 0 14px, #644321 14px 28px),
    /* warm base */
    linear-gradient(180deg, #6d4724, #513419 60%);
  border-bottom: 2px solid #3a2716;
  box-shadow:
    0 8px 18px rgba(0,0,0,.35),
    inset 0 -2px 0 rgba(0,0,0,.35),
    inset 0 2px 0 rgba(255,255,255,.06);
  display:flex; align-items:center; justify-content:space-between;
  gap:16px; padding:10px 16px;
}

.navbar::before,
.navbar::after{
  content:""; display:block; height:3px;
  background: linear-gradient(90deg, var(--gold), var(--gold-2), var(--gold));
}
.navbar::before{ opacity:.85 }
.navbar::after{ opacity:.55 }

.nav-left, .nav-right{
  display:flex; align-items:center; gap:10px;
}

.navbar .brand{
  display:flex; align-items:center; gap:10px; font-weight:700;
  color:#f3e3bd; text-decoration:none;
}
.navbar .brand .crest{
  width:36px; height:36px; border-radius:50%;
  background: conic-gradient(from 0deg, var(--gold), var(--gold-2), var(--gold));
  box-shadow: 0 0 0 3px rgba(255,255,255,.05), inset 0 0 0 3px rgba(0,0,0,.4);
}

.navbar .nav-link{
  color:#f3e3bd; text-decoration:none; font-weight:700; letter-spacing:.3px;
  padding:8px 12px; border-radius:999px; border:1px solid rgba(202,162,75,.35);
  background: linear-gradient(180deg, rgba(234,215,177,.16), rgba(220,198,155,.06));
  box-shadow: inset 0 1px 0 rgba(255,255,255,.2);
  transition: transform .12s ease, box-shadow .12s ease, background .12s ease;
}
.navbar .nav-link:hover{
  background: linear-gradient(180deg, rgba(234,215,177,.28), rgba(220,198,155,.12));
  box-shadow: 0 0 12px rgba(202,162,75,.35), inset 0 1px 0 rgba(255,255,255,.25);
  transform: translateY(-1px);
}

/* center castle icon link (your markup already has .castle-link/.castle-icon) */
.castle-link{ display:flex; align-items:center; justify-content:center; }
.castle-icon{ width:42px; height:auto; display:block; }

/* Thin crenellation strip you can place right under the navbar */
.sc-crenel{
  height:16px;
  background:
    /* top line */
    linear-gradient(#332415 0 0) left/100% 6px no-repeat,
    /* teeth pattern */
    repeating-linear-gradient(90deg, transparent 0 20px, #1f160e 20px 40px);
  border-bottom: 1px solid rgba(255,255,255,.05);
  box-shadow: inset 0 -10px 20px rgba(0,0,0,.35);
}

/* =============== FOOTER (matches header) =============== */
.sc-footer{
  margin-top:40px;
  background:
    linear-gradient(180deg, rgba(0,0,0,.25), transparent 38%),
    repeating-linear-gradient(90deg, #5a3d1d 0 14px, #644321 14px 28px),
    linear-gradient(180deg, #6d4724, #513419 60%);
  color:#f0e1bf;
  border-top: 2px solid #3a2716;
  box-shadow: 0 -12px 30px rgba(0,0,0,.4) inset;
}
.sc-footer::before{
  content:""; display:block; height:3px;
  background: linear-gradient(90deg, var(--gold), var(--gold-2), var(--gold));
  opacity:.85;
}

/* inner grid (kept from earlier) */
.sc-footer .inner{
  max-width:1200px; margin: 0 auto; padding: 28px 16px 24px;
  display:grid; gap:22px;
  grid-template-columns: repeat(12, 1fr);
}
.sc-foot-col{ grid-column: span 4; }
@media (max-width: 900px){ .sc-foot-col{ grid-column: span 6; } }
@media (max-width: 640px){ .sc-foot-col{ grid-column: span 12; } }

.sc-foot-title{
  margin:0 0 8px; color:#fff2cf; letter-spacing:.02em; font-weight:700;
  text-shadow: 0 2px 10px rgba(0,0,0,.4);
}
.sc-foot-text{ margin:0; color:#f2e5c7; line-height:1.45; }
.sc-foot-links{ list-style:none; margin:8px 0 0; padding:0; }
.sc-foot-links a{
  color:#f7e9c7; text-decoration:none; display:inline-flex; gap:8px; align-items:center;
}
.sc-foot-links a:hover{ text-decoration:underline; }

.sc-footer .copy{
  text-align:center; padding: 10px 16px 18px; color:#f0e1bf; opacity:.95;
  border-top: 1px solid rgba(255,255,255,.08);
}
/* ===== Cards solid parchment (no transparency) ===== */
.sc-card{
  background: linear-gradient(180deg, #fdf8ec, #f3e6c7 55%, #ead9b5 100%) !important;
  border: 1px solid #d8c59c;
  border-radius: 12px;
  box-shadow: 0 3px 8px rgba(0,0,0,.25);
  color: var(--ink);
}

.sc-card .sc-body,
.sc-card .sc-footer,
.sc-card .sc-card-header{
  background: transparent !important;
}

.sc-card::before,
.sc-card::after{ background: none !important; }
/* ===== Force equal card height and consistent layout ===== */
.sc-grid{
  display: grid;
  gap: 20px;
  grid-template-columns: repeat(auto-fill, minmax(320px, 1fr));
  align-items: stretch;
}

.sc-card{
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  min-height: 360px; /* tweak this until it looks balanced site-wide */
}

/* ensure footer stays at bottom of each card */
.sc-card .sc-footer{
  margin-top: auto;
}