/* ══════════════════════════════════════════════════════════════
       VARIABLES
    ══════════════════════════════════════════════════════════════ */
    :root {
      --ink:         #0d0804;
      --parchment:   #f7f1e3;
      --parchment2:  #ede4cc;
      --parchment3:  #e2d4b4;
      --rust:        #7a1e00;
      --rust2:       #a33018;
      --rust3:       #c04020;
      --gold:        #c9a030;
      --gold2:       #e8c96a;
      --gold3:       #f5e0a0;
      --rule:        #b89850;
      --dark:        #0d0804;
      --dark2:       #1a1005;
      --dark3:       #2e1f08;
      --muted:       #3a2810;
      --white:       #ffffff;
      --sidebar-w:   230px;
    }

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

    body {
      background: var(--dark);
      background-image:
        url("data:image/svg+xml,%3Csvg width='60' height='60' viewBox='0 0 60 60' xmlns='http://www.w3.org/2000/svg'%3E%3Cg fill='none' fill-rule='evenodd'%3E%3Cg fill='%23c9a030' fill-opacity='0.03'%3E%3Cpath d='M36 34v-4h-2v4h-4v2h4v4h2v-4h4v-2h-4zm0-30V0h-2v4h-4v2h4v4h2V6h4V4h-4zM6 34v-4H4v4H0v2h4v4h2v-4h4v-2H6zM6 4V0H4v4H0v2h4v4h2V6h4V4H6z'/%3E%3C/g%3E%3C/g%3E%3C/svg%3E");
      font-family: 'Libre Baskerville', Georgia, serif;
      font-size: 15px;
      color: var(--ink);
      line-height: 1.65;
    }

    a { color: var(--rust); text-decoration: none; }
    a:hover { color: var(--rust3); text-decoration: underline; }
    img { max-width: 100%; }

    /* ══════════════════════════════════════════════════════════════
       SHELL
    ══════════════════════════════════════════════════════════════ */
    #shell {
      max-width: 1080px;
      margin: 0 auto;
      background: var(--parchment);
      box-shadow: 0 0 120px rgba(0,0,0,0.9), 0 0 0 2px rgba(201,160,48,0.4);
    }

    /* ══════════════════════════════════════════════════════════════
       TOP BAR
    ══════════════════════════════════════════════════════════════ */
    #topbar {
      background: linear-gradient(180deg, #2e1f08 0%, #0d0804 100%);
      border-bottom: 2px solid var(--gold);
      display: flex;
      align-items: center;
      justify-content: space-between;
      padding: 8px 18px;
      gap: 10px;
      flex-wrap: wrap;
    }

    #topbar-logo img { height: 46px; border: 0; display: block; }

    #topbar-right { display: flex; flex-direction: column; align-items: flex-end; gap: 5px; }

    #topbar-nav {
      display: flex;
      flex-wrap: wrap;
      justify-content: flex-end;
      font-family: 'IM Fell English SC', serif;
      font-size: 12px;
      gap: 0;
    }

    #topbar-nav a {
      color: var(--gold2);
      padding: 4px 11px;
      border-left: 1px solid rgba(201,160,48,0.25);
      letter-spacing: 0.05em;
      white-space: nowrap;
      transition: background 0.15s, color 0.15s;
    }

    #topbar-nav a:first-child { border-left: none; }
    #topbar-nav a:hover { background: rgba(201,160,48,0.12); color: var(--white); text-decoration: none; }

    /* Search */
    #site-search form {
      display: flex;
      border: 1px solid var(--gold);
      border-radius: 3px;
      overflow: hidden;
    }

    #site-search input[type=search] {
      background: rgba(255,255,255,0.09);
      border: none;
      outline: none;
      color: var(--white);
      font-family: 'Libre Baskerville', serif;
      font-size: 13px;
      padding: 5px 10px;
      width: 175px;
      transition: background 0.2s, width 0.25s;
    }

    #site-search input[type=search]::placeholder { color: rgba(232,201,106,0.5); font-style: italic; }
    #site-search input[type=search]:focus { background: rgba(255,255,255,0.16); width: 205px; }

    #site-search button {
      background: var(--gold);
      border: none;
      color: var(--dark);
      cursor: pointer;
      padding: 5px 12px;
      font-size: 15px;
      font-weight: bold;
      transition: background 0.15s;
    }

    #site-search button:hover { background: var(--gold2); }

    /* ══════════════════════════════════════════════════════════════
       HERO — Full-bleed battle painting with magazine overlay
    ══════════════════════════════════════════════════════════════ */
    #hero {
      position: relative;
      overflow: hidden;
      background: #0a0602;
      border-bottom: 3px solid var(--gold);
    }

    #hero-img {
      display: block;
      width: 100%;
      height: 420px;
      object-fit: cover;
      object-position: center 28%;
      filter: sepia(15%) contrast(1.15) brightness(var(--hero-brightness, 0.88));
    }

    .home-hero-image { --hero-brightness: 1.056; }

    /* Dramatic gradient overlay — dark bottom, clear center */
    #hero-grad {
      position: absolute;
      inset: 0;
      background:
        linear-gradient(to bottom, rgba(13,8,4,0.55) 0%, rgba(13,8,4,0.0) 30%, rgba(13,8,4,0.0) 55%, rgba(13,8,4,0.85) 100%),
        linear-gradient(to right, rgba(13,8,4,0.5) 0%, transparent 25%, transparent 75%, rgba(13,8,4,0.5) 100%);
      pointer-events: none;
    }

    /* Newspaper-rule decoration across top of hero */
    #hero-topline {
      position: absolute;
      top: 0; left: 0; right: 0;
      height: 6px;
      background: linear-gradient(90deg, var(--rust) 0%, var(--gold) 40%, var(--rust2) 100%);
    }

    /* Masthead floated over the hero image */
    #hero-masthead {
      position: absolute;
      bottom: 0; left: 0; right: 0;
      padding: 20px 28px 22px 28px;
      display: flex;
      flex-direction: column;
      align-items: center;
      gap: 8px;
    }

    #hero-masthead img.title-img {
      max-width: 560px;
      width: 72%;
      filter: drop-shadow(0 3px 16px rgba(0,0,0,1)) brightness(1.15);
    }

    #hero-tagline {
      font-family: 'IM Fell English SC', serif;
      font-size: 13px;
      color: var(--gold3);
      letter-spacing: 0.22em;
      text-shadow: 0 1px 6px rgba(0,0,0,0.9);
      text-align: center;
    }

    #hero-caption {
      position: absolute;
      bottom: 6px;
      right: 12px;
      font-size: 10px;
      font-style: italic;
      color: rgba(245,224,160,0.6);
    }

    /* ══════════════════════════════════════════════════════════════
       ANNOUNCEMENT BAND
    ══════════════════════════════════════════════════════════════ */
    #announcement {
      background: linear-gradient(90deg, var(--rust) 0%, #a33018 50%, var(--rust) 100%);
      border-bottom: 2px solid rgba(201,160,48,0.5);
      padding: 0;
      display: flex;
      align-items: stretch;
      overflow: hidden;
    }

    #announcement-inner {
      display: flex;
      align-items: center;
      justify-content: space-between;
      width: 100%;
      padding: 8px 20px;
      gap: 16px;
      flex-wrap: wrap;
    }

    #announcement .tagline {
      font-family: 'IM Fell English SC', serif;
      font-size: 13px;
      color: var(--gold3);
      letter-spacing: 0.08em;
    }

    #announcement .visitor {
      font-family: 'IM Fell English', serif;
      font-size: 12px;
      color: rgba(245,224,160,0.75);
      font-style: italic;
    }

    #announcement .share-btn {
      background: rgba(0,0,0,0.25);
      border: 1px solid rgba(245,224,160,0.4);
      color: var(--gold3);
      font-family: 'IM Fell English SC', serif;
      font-size: 11px;
      letter-spacing: 0.07em;
      padding: 4px 12px;
      cursor: pointer;
      transition: background 0.15s;
      text-decoration: none;
    }

    #announcement .share-btn:hover { background: rgba(0,0,0,0.45); text-decoration: none; color: var(--white); }

    /* ══════════════════════════════════════════════════════════════
       LAYOUT: sidebar + main
    ══════════════════════════════════════════════════════════════ */
    #layout {
      display: grid;
      grid-template-columns: var(--sidebar-w) 1fr;
      align-items: start;
    }

    /* ══════════════════════════════════════════════════════════════
       SIDEBAR
    ══════════════════════════════════════════════════════════════ */
    #sidebar {
      background: linear-gradient(180deg, #f0e6cc 0%, #e2d4b0 100%);
      border-right: 2px solid var(--rule);
      min-height: 700px;
      position: sticky;
      top: 0;
    }

    /* Sidebar header strip */
    .sidebar-cat-header {
      background: linear-gradient(90deg, var(--rust) 0%, var(--rust2) 100%);
      padding: 6px 14px;
      font-family: 'Cinzel', serif;
      font-size: 10px;
      font-weight: 700;
      letter-spacing: 0.18em;
      color: var(--gold3);
      text-transform: uppercase;
      border-bottom: 1px solid rgba(201,160,48,0.4);
    }

    .sidebar-section { border-bottom: 1px solid rgba(184,152,80,0.4); }

    .sidebar-heading {
      background: rgba(122,30,0,0.1);
      font-family: 'IM Fell English SC', serif;
      font-size: 11px;
      letter-spacing: 0.12em;
      color: var(--rust);
      padding: 6px 14px 5px 14px;
      border-bottom: 1px solid rgba(184,152,80,0.3);
      text-transform: uppercase;
    }

    .sidebar-section ul { list-style: none; }

    .sidebar-section ul li { border-bottom: 1px solid rgba(184,152,80,0.2); }

    .sidebar-section ul li a {
      display: flex;
      align-items: center;
      gap: 6px;
      padding: 7px 14px;
      font-size: 13px;
      color: var(--muted);
      line-height: 1.3;
      transition: background 0.12s, color 0.12s, padding-left 0.12s;
    }

    .sidebar-section ul li a::before {
      content: '›';
      color: var(--rust);
      font-size: 16px;
      font-weight: bold;
      line-height: 1;
      flex-shrink: 0;
      transition: transform 0.12s;
    }

    .sidebar-section ul li a:hover {
      background: rgba(122,30,0,0.08);
      color: var(--rust);
      padding-left: 18px;
      text-decoration: none;
    }

    .sidebar-section ul li a:hover::before { transform: translateX(2px); }

    .sidebar-products {
      padding: 10px 14px;
      background: rgba(122,30,0,0.06);
    }

    .sidebar-products a {
      display: flex;
      align-items: center;
      gap: 7px;
      font-size: 13px;
      font-weight: bold;
      color: var(--rust);
      padding: 6px 0;
      border-bottom: 1px dotted rgba(184,152,80,0.5);
      transition: color 0.12s;
    }

    .sidebar-products a:last-child { border-bottom: none; }

    .sidebar-products a::before {
      content: '⚔';
      font-size: 13px;
      color: var(--gold);
    }

    .sidebar-products a:hover { color: var(--rust3); text-decoration: none; }

    /* ══════════════════════════════════════════════════════════════
       MAIN CONTENT
    ══════════════════════════════════════════════════════════════ */
    .home-content { padding: 0; }

    /* ── SEO intro + warrior image ───────────────────────────── */
    #intro-strip {
      display: grid;
      grid-template-columns: 1fr 160px;
      gap: 0;
      border-bottom: 2px solid var(--rule);
    }

    #seo-intro {
      padding: 20px 22px 18px 22px;
      background: linear-gradient(135deg, var(--parchment) 0%, var(--parchment2) 100%);
      border-right: 1px solid var(--rule);
    }

    #seo-intro h1 {
      font-family: 'Cinzel', serif;
      font-size: 19px;
      font-weight: 700;
      color: var(--rust);
      line-height: 1.2;
      margin-bottom: 10px;
      letter-spacing: 0.03em;
    }

    #seo-intro p {
      font-size: 13px;
      color: var(--muted);
      line-height: 1.7;
      margin-bottom: 6px;
    }

    #seo-intro p:last-child { margin-bottom: 0; }

    #seo-intro strong { color: var(--rust); font-weight: bold; }

    /* Warrior image panel */
    #warrior-panel {
      background: var(--dark);
      display: flex;
      flex-direction: column;
      align-items: stretch;
      overflow: hidden;
    }

    #warrior-panel img {
      width: 100%;
      height: 180px;
      object-fit: cover;
      object-position: top center;
      filter: sepia(20%) contrast(1.1);
      display: block;
    }

    #warrior-panel .warrior-caption {
      background: var(--rust);
      color: var(--gold3);
      font-size: 9px;
      font-style: italic;
      font-family: 'IM Fell English', serif;
      padding: 5px 8px;
      line-height: 1.4;
      text-align: center;
      flex: 1;
    }

    /* ── Welcome block ───────────────────────────────────────── */
    #welcome-band {
      background: var(--dark2);
      background-image: linear-gradient(90deg, var(--dark) 0%, #1e1208 40%, #1e1208 60%, var(--dark) 100%);
      border-top: 1px solid rgba(201,160,48,0.3);
      border-bottom: 2px solid var(--gold);
      padding: 13px 22px;
      font-family: 'IM Fell English', serif;
      font-size: 14px;
      line-height: 1.7;
      color: rgba(245,224,160,0.9);
      position: relative;
    }

    #welcome-band::before {
      content: '\275D';
      font-size: 40px;
      color: rgba(201,160,48,0.15);
      position: absolute;
      left: 10px;
      top: 4px;
      line-height: 1;
      font-family: Georgia, serif;
    }

    #welcome-band strong { color: var(--gold2); font-family: 'IM Fell English SC', serif; letter-spacing: 0.05em; }
    #welcome-band a { color: var(--gold2); }
    #welcome-band a:hover { color: var(--white); }

    /* ── Video section ───────────────────────────────────────── */
    #video-section { padding: 18px 22px 10px 22px; border-bottom: 1px solid rgba(184,152,80,0.4); }

    .section-label {
      display: flex;
      align-items: center;
      gap: 0;
      margin-bottom: 14px;
    }

    .section-label::before {
      content: '';
      display: block;
      width: 5px;
      height: 28px;
      background: linear-gradient(180deg, var(--rust) 0%, var(--gold) 100%);
      margin-right: 12px;
      flex-shrink: 0;
    }

    .section-label h2 {
      font-family: 'Cinzel', serif;
      font-size: 14px;
      font-weight: 700;
      color: var(--rust);
      letter-spacing: 0.12em;
      text-transform: uppercase;
    }

    .section-label::after {
      content: '';
      flex: 1;
      height: 1px;
      background: linear-gradient(to right, var(--rule), transparent);
      margin-left: 14px;
    }

    .video-grid {
      display: grid;
      grid-template-columns: 1fr 1fr;
      gap: 14px;
      margin-bottom: 6px;
    }

    .video-item {}

    .video-wrap {
      position: relative;
      padding-top: 56.25%;
      border: 2px solid var(--rule);
      box-shadow: 4px 4px 0 rgba(13,8,4,0.3);
      margin-bottom: 6px;
      overflow: hidden;
    }

    .video-wrap iframe {
      position: absolute;
      inset: 0;
      width: 100%; height: 100%;
      border: 0;
    }

    .video-caption {
      font-size: 11px;
      font-style: italic;
      color: var(--muted);
      text-align: center;
      line-height: 1.4;
    }

    /* ── Articles section ────────────────────────────────────── */
    #articles-section { padding: 18px 22px 10px 22px; }

    /* Featured article — magazine-style card with image */
    .featured-article {
      display: grid;
      grid-template-columns: 200px 1fr;
      gap: 0;
      margin-bottom: 16px;
      border: 1px solid var(--rule);
      box-shadow: 4px 4px 0 rgba(13,8,4,0.2);
      overflow: hidden;
      transition: box-shadow 0.2s;
    }

    .featured-article:hover { box-shadow: 6px 6px 0 rgba(122,30,0,0.3); }

    .featured-article .feat-img {
      position: relative;
      overflow: hidden;
      background: var(--dark);
    }

    .featured-article .feat-img img {
      width: 100%;
      height: 100%;
      min-height: 160px;
      object-fit: cover;
      filter: sepia(20%) contrast(1.1);
      display: block;
      transition: transform 0.4s, filter 0.4s;
    }

    .featured-article:hover .feat-img img {
      transform: scale(1.04);
      filter: sepia(10%) contrast(1.15);
    }

    .featured-article .feat-tag {
      position: absolute;
      top: 10px; left: 0;
      background: var(--rust);
      color: var(--gold3);
      font-family: 'IM Fell English SC', serif;
      font-size: 10px;
      letter-spacing: 0.1em;
      padding: 3px 10px;
    }

    .featured-article .feat-body {
      padding: 14px 16px;
      background: var(--parchment2);
      display: flex;
      flex-direction: column;
      justify-content: center;
      gap: 6px;
    }

    .featured-article .feat-body a {
      font-family: 'IM Fell English', serif;
      font-size: 16px;
      line-height: 1.3;
      color: var(--rust);
      font-weight: normal;
    }

    .featured-article .feat-body a:hover { color: var(--rust3); text-decoration: none; }

    .featured-article .feat-body .feat-blurb {
      font-size: 13px;
      color: var(--muted);
      line-height: 1.6;
      font-style: italic;
    }

    .featured-article .feat-body .read-more {
      display: inline-flex;
      align-items: center;
      gap: 5px;
      font-family: 'IM Fell English SC', serif;
      font-size: 11px;
      letter-spacing: 0.08em;
      color: var(--gold);
      background: var(--rust);
      padding: 4px 12px;
      align-self: flex-start;
      transition: background 0.15s;
    }

    .featured-article .feat-body .read-more:hover { background: var(--rust2); text-decoration: none; color: var(--gold3); }

    /* Standard article list */
    .article-list { list-style: none; margin: 0 0 14px 0; }

    .article-list li {
      padding: 9px 10px 9px 16px;
      border-bottom: 1px solid rgba(184,152,80,0.35);
      border-left: 3px solid transparent;
      transition: border-left-color 0.15s, background 0.15s;
      display: flex;
      flex-direction: column;
      gap: 3px;
    }

    .article-list li:hover {
      border-left-color: var(--rust);
      background: rgba(122,30,0,0.04);
    }

    .article-list li a {
      font-weight: bold;
      font-size: 14px;
      color: var(--rust);
      line-height: 1.35;
    }

    .article-list li a:hover { color: var(--rust3); }

    .article-list li .blurb {
      font-size: 13px;
      color: var(--muted);
      font-style: italic;
      line-height: 1.5;
    }

    /* ── Subsection headings ─────────────────────────────────── */
    .sub-heading {
      display: flex;
      align-items: center;
      gap: 0;
      margin: 20px 0 10px 0;
    }

    .sub-heading::before {
      content: '';
      display: block;
      width: 4px;
      height: 22px;
      background: var(--gold);
      margin-right: 10px;
      flex-shrink: 0;
    }

    .sub-heading span {
      font-family: 'Cinzel', serif;
      font-size: 12px;
      font-weight: 600;
      color: var(--rust);
      letter-spacing: 0.14em;
      text-transform: uppercase;
    }

    .sub-heading::after {
      content: '';
      flex: 1;
      height: 1px;
      background: linear-gradient(to right, var(--rule), transparent);
      margin-left: 12px;
    }

    /* ── Crysler's Farm pull image ───────────────────────────── */
    .pull-image {
      float: right;
      margin: 6px 0 16px 18px;
      max-width: 220px;
      border: 2px solid var(--rule);
      box-shadow: 5px 5px 0 rgba(13,8,4,0.25);
      clear: right;
    }

    .pull-image img {
      display: block;
      width: 100%;
      filter: sepia(20%) contrast(1.08);
    }

    .pull-image figcaption {
      background: var(--rust);
      color: var(--gold3);
      font-size: 10px;
      font-style: italic;
      font-family: 'IM Fell English', serif;
      padding: 5px 8px;
      text-align: center;
      line-height: 1.4;
    }

    /* ── Artefact + Book rows ────────────────────────────────── */
    #artefact-section, #book-section {
      padding: 4px 22px 16px 22px;
      border-top: 1px solid rgba(184,152,80,0.35);
    }

    /* ══════════════════════════════════════════════════════════════
       FOOTER
    ══════════════════════════════════════════════════════════════ */
    #footer {
      background: linear-gradient(180deg, var(--dark2) 0%, var(--dark) 100%);
      border-top: 3px solid var(--gold);
      padding: 24px 26px;
      text-align: center;
      color: rgba(232,201,106,0.65);
      font-size: 12px;
      line-height: 1.9;
    }

    #footer::before {
      content: '✦  ✦  ✦';
      display: block;
      color: rgba(201,160,48,0.4);
      font-size: 14px;
      margin-bottom: 14px;
      letter-spacing: 0.5em;
    }

    #footer a { color: var(--gold2); }
    #footer a:hover { color: var(--white); }

    #footer .submit-cta {
      display: inline-block;
      margin-bottom: 16px;
      padding: 10px 26px;
      border: 1px solid var(--gold);
      color: var(--gold2);
      font-family: 'Cinzel', serif;
      font-size: 12px;
      font-weight: 600;
      letter-spacing: 0.1em;
      text-transform: uppercase;
      background: rgba(201,160,48,0.07);
      transition: background 0.18s, color 0.18s, box-shadow 0.18s;
    }

    #footer .submit-cta:hover {
      background: var(--gold);
      color: var(--dark);
      box-shadow: 0 0 18px rgba(201,160,48,0.4);
      text-decoration: none;
    }

    /* ══════════════════════════════════════════════════════════════
       RESPONSIVE
    ══════════════════════════════════════════════════════════════ */
    @media (max-width: 740px) {
      :root { --sidebar-w: 0px; }
      #layout { grid-template-columns: 1fr; }
      #sidebar { border-right: none; border-bottom: 2px solid var(--rule); min-height: unset; position: static; }
      #intro-strip { grid-template-columns: 1fr; }
      #warrior-panel { display: none; }
      #topbar { flex-direction: column; align-items: flex-start; }
      #topbar-right { align-items: flex-start; width: 100%; }
      #hero-img { height: 240px; }
      .video-grid { grid-template-columns: 1fr; }
      .featured-article { grid-template-columns: 1fr; }
      .featured-article .feat-img { height: 180px; }
      .pull-image { float: none; max-width: 100%; margin: 0 0 16px 0; }
    }
  .auto-style1 {
	font-size: xx-large;
}
.auto-style2 {
	margin-bottom: 0px;
}
