/* Therion pilot: a local, responsive reading layout. SAPE stays server-rendered. */
:root { color-scheme: dark; --paper:#111315; --panel:#181b1d; --ink:#eeeae2;
  --muted:#a7aaa8; --gold:#ceb887; --line:#303538; --soft:#1c2023; }
* { box-sizing:border-box; }
html { scroll-behavior:smooth; }
body { margin:0; background:var(--paper); color:var(--ink); font:16px/1.7 "Segoe UI",Arial,sans-serif; }
a { color:var(--gold); text-underline-offset:3px; text-decoration-thickness:1px; }
a:hover { color:#fff; }
a:focus-visible, button:focus-visible, summary:focus-visible, [tabindex]:focus-visible {
  outline:2px solid var(--gold); outline-offset:5px; border-radius:2px; }
button { font:inherit; }
img { max-width:100%; height:auto; vertical-align:middle; }
figure { margin:0; }
#wrapper { max-width:1392px; margin:0 auto; padding:0 36px; }
.skip-link { position:absolute; left:16px; top:-100px; z-index:1000; padding:10px 18px;
  background:var(--gold); color:#111; }
.skip-link:focus { top:12px; }
#header { min-height:224px; display:flex; align-items:center; padding:38px 0;
  background:linear-gradient(90deg,#111315 5%,rgba(17,19,21,.90) 32%,rgba(17,19,21,.08) 100%),
    url("/sites/all/themes/therion/images/head-fon.jpg") right center/auto 100% no-repeat; }
.brand-block { max-width:470px; }
.brand-logo { display:inline-block; }
.brand-logo img { width:255px; height:auto; }
.brand-caption { margin:12px 0 0; color:#e0ded6; font-size:14px; letter-spacing:.02em; }
.brand-shortcuts { display:flex; flex-wrap:wrap; gap:8px 20px; margin-top:18px; font-size:13px; }
.brand-shortcuts a { text-decoration:none; border-bottom:1px solid #6d624d; }
#mainmenu { border-top:1px solid var(--line); border-bottom:1px solid var(--line); padding:0; }
#site-nav { display:flex; justify-content:space-between; gap:4px 10px; list-style:none; margin:0; padding:0; }
#site-nav li { min-width:0; }
#site-nav a { display:block; padding:17px 3px 15px; color:#bfc1bd; font-size:13px; text-decoration:none;
  border-bottom:2px solid transparent; }
#site-nav a:hover, #site-nav a[aria-current="page"] { color:var(--ink); border-color:var(--gold); }
.menu-toggle { display:none; }
#contentwrapper { display:grid; grid-template-columns:176px minmax(0,1fr) 224px;
  grid-template-areas:"left main right"; align-items:start; gap:34px; margin-top:34px; padding-bottom:60px; }
#left { grid-area:left; min-width:0; font-size:13px; line-height:1.6; overflow-wrap:anywhere; }
#main { grid-area:main; min-width:0; line-height:1.75; }
#right { grid-area:right; min-width:0; font-size:13px; line-height:1.6; overflow-wrap:anywhere; }
.breadcrumbs { margin-bottom:22px; color:var(--muted); font-size:12px; }
.breadcrumbs ol { display:flex; flex-wrap:wrap; align-items:center; gap:6px 10px; padding:0; margin:0; list-style:none; }
.breadcrumbs li+li::before { content:"/"; margin-right:10px; color:#555d60; }
.breadcrumbs a { color:var(--muted); text-decoration:none; }
.breadcrumbs span { overflow-wrap:anywhere; }
.page-title { margin:0 0 28px; font:400 clamp(30px,3.25vw,46px)/1.15 Georgia,"Times New Roman",serif;
  letter-spacing:-.025em; overflow-wrap:break-word; color:#f0ece3; }
.article-body { overflow-wrap:anywhere; }
.article-body p { margin:0 0 1.15em; max-width:74ch; }
.article-body h2 { margin:36px 0 18px; font:400 28px/1.25 Georgia,"Times New Roman",serif; color:#e6ddc9; }
.article-body h3, .article-body h4 { margin:26px 0 14px; font:600 18px/1.4 "Segoe UI",Arial,sans-serif; }
.article-body ul, .article-body ol { margin:16px 0 22px; padding-left:24px; }
.article-body ul { list-style:disc; }
.article-body li { padding-left:2px; margin:5px 0; }
.article-body blockquote { margin:22px 0; padding:4px 0 4px 20px; border-left:2px solid var(--gold); color:#c9cbc5; }
.article-body img.imageright { float:right; margin:4px 0 20px 24px; max-width:44%; }
.article-body img.imageleft { float:left; margin:4px 24px 20px 0; max-width:44%; }
.article-body .clear-block::after { display:table; content:""; clear:both; }
.article-body table { border-collapse:collapse; font-size:14px; }
.article-body td, .article-body th { border-bottom:1px solid var(--line); padding:10px; vertical-align:top; text-align:left; }
.table-scroll { max-width:100%; overflow-x:auto; margin:20px 0; }
.table-scroll table { min-width:0; width:100%; }
.blockcontent { margin:0 0 28px; padding:0 0 22px; border-bottom:1px solid var(--line); }
.blockcontent h5 { margin:0 0 14px; color:#e3d8bd; font:400 19px/1.3 Georgia,"Times New Roman",serif; }
.blockcontent h5 a { color:inherit; text-decoration:none; }
.blockcontent .view-content { padding:0; }
.blockcontent p { margin:0 0 12px; }
.blockcontent ul { padding:0; margin:12px 0; list-style:none; }
.blockcontent li { padding:5px 0; border-bottom:1px solid #272c2f; }
.blockcontent blockquote { margin:0; color:#aeb3b0; font-style:italic; }
.views-field-field-quote-autor-value { margin-top:12px; color:var(--gold); }
.blockcontent .views-field-title, .blockcontent .views-field-field-disctype-value { margin:12px 0; }
.blockcontent .views-field-field-disctype-value a { text-decoration:none; color:#c7cac6; }
#randomalbum img { width:100%; max-width:224px; height:auto; border:1px solid var(--line); }
#randomphoto img { display:block; margin:0 auto; width:auto; max-width:100%; }
#randomvideo img { width:100%; height:auto; }
#quote .field-content { font-size:13px; }
.archive-dates summary { color:var(--muted); cursor:pointer; }
.archive-dates[open] summary { margin-bottom:14px; }
#left>div:not([class]), #right>div:not([class]) { padding:8px 0 20px; font-size:13px; overflow-wrap:anywhere; }
.home-intro { margin-bottom:40px; padding-bottom:34px; border-bottom:1px solid var(--line); }
.eyebrow { color:var(--gold); font-size:11px; font-weight:600; letter-spacing:.17em; text-transform:uppercase; margin:0 0 15px; }
.home-intro h1 { margin:0 0 18px; max-width:16ch; font:400 clamp(34px,4vw,55px)/1.12 Georgia,"Times New Roman",serif; letter-spacing:-.035em; }
.home-intro .lead { color:#b6bcb8; font-size:17px; line-height:1.65; max-width:53ch; }
.section-cards { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:12px; margin-top:25px; }
.section-card { display:flex; flex-direction:column; gap:6px; min-height:120px; padding:18px;
  border:1px solid var(--line); background:linear-gradient(135deg,#1a1e20,#141719); text-decoration:none; }
.section-card:hover { border-color:#7e7156; background:#1e2325; }
.section-card strong { color:var(--ink); font:400 22px/1.2 Georgia,"Times New Roman",serif; }
.section-card span { color:#a1aaa6; font-size:12px; line-height:1.5; }
.pilot-kind-home .article-body>.page-title { font-size:30px; margin-top:8px; }
.altrack { float:right; width:210px; max-width:43%; margin:0 0 24px 24px; padding:18px;
  border:1px solid var(--line); background:var(--panel); font-size:13px; line-height:1.6; }
.songalbum { display:block; color:var(--muted); }
.songalbum a { color:#e3d8bd; font-weight:600; }
.track-list { margin-top:15px; border-top:1px solid var(--line); padding-top:12px; }
.track-list summary { color:#b7bfba; cursor:pointer; font-size:12px; }
.track-list .item-list ul { padding:0; list-style:none; }
.track-list .item-list li { margin:8px 0; padding:0; }
.track-list a { text-decoration:none; }
.lyrics-language { margin:0 0 24px; }
.lyrics-language a { display:inline-block; padding:8px 13px; border:1px solid #4c493e; border-radius:3px; font-size:13px; text-decoration:none; }
.rightdiscimg-block { float:right; width:224px; max-width:43%; margin:0 0 25px 24px; text-align:center; }
#main .rightdiscimg-block img { display:block; max-width:100%; width:auto; height:auto; margin:12px auto; border:1px solid var(--line); }
.discdate { color:var(--muted); font-size:13px; }
.views-field-field-disc-year-value { color:var(--gold); font-size:13px; }
#discnavi { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); clear:both; border-top:1px solid var(--line);
  border-bottom:1px solid var(--line); margin:30px 0; font-size:12px; color:var(--muted); }
#discnavi>span { padding:16px; }
#discnavi>span+span { border-left:1px solid var(--line); text-align:right; }
#discnavi a { font-size:15px; }
.views-view-grid { display:block; width:100%; }
.views-view-grid tbody { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:16px; }
.views-view-grid tr { display:contents; }
.article-body .views-view-grid td { display:block; min-width:0; padding:0; border:none; }
.views-view-grid img { width:100%; height:auto; background:#1a1c1f; border:1px solid var(--line); }
.gallery-caption { display:block; margin:9px 0 15px; font-size:12px; color:#b7c0ba; line-height:1.5; }
.pilot-kind-photos .views-view-grid img { aspect-ratio:4/3; object-fit:cover; }
.item-list .pager { display:flex; flex-wrap:wrap; gap:12px; padding:10px 0; list-style:none; color:var(--muted); }
.asset-notice { background:#1e211e; color:#c3c9bc; border-color:#444b3d; border-radius:3px; font-size:13px; }
.video-card { margin:24px 0; border:1px solid var(--line); background:#080a0b; }
.video-launch { position:relative; display:block; width:100%; padding:0; border:0; background:#080a0b; color:#fff; cursor:pointer; }
.video-launch img { display:block; width:100%; max-height:400px; object-fit:cover; opacity:.7; }
.video-launch span { position:absolute; left:50%; top:50%; transform:translate(-50%,-50%); padding:11px 18px;
  background:#d5c08a; color:#151510; border-radius:3px; white-space:nowrap; font-size:14px; font-weight:600; }
.video-frame { aspect-ratio:16/9; }
.video-frame iframe { display:block; width:100%; height:100%; border:0; }
.video-card figcaption { padding:14px 18px; color:var(--muted); font-size:12px; }
#mdbfooter { padding:28px 0 36px; border-top:1px solid var(--line); color:#8e9792; font-size:12px; }
#mdbfooter a { color:#bcc3bd; }
.footer-links { display:flex; gap:18px; flex-wrap:wrap; margin-top:10px; }
.clear, #clear { clear:both; }
@media (max-width:1150px) {
  #wrapper { padding:0 26px; }
  #contentwrapper { grid-template-columns:150px minmax(0,1fr) 195px; gap:24px; }
  #site-nav a { font-size:12px; }
}
@media (max-width:950px) {
  #contentwrapper { grid-template-columns:minmax(0,1fr) 220px; grid-template-areas:"main right" "left right"; }
  #left { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); align-items:start; gap:22px; }
  #left>div:not([class]) { grid-column:1/-1; }
  #header { min-height:200px; }
  #mainmenu { padding:9px 0; }
  .has-theme-js .menu-toggle { display:flex; justify-content:space-between; align-items:center; width:100%; padding:8px 0;
    background:transparent; border:0; color:var(--ink); font-size:14px; cursor:pointer; }
  .menu-toggle::after { content:"+"; font-size:22px; color:var(--gold); }
  .menu-toggle[aria-expanded="true"]::after { content:"−"; }
  #site-nav { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:0 14px; }
  .has-theme-js #site-nav:not(.is-open) { display:none; }
  #site-nav a { padding:11px 0; font-size:13px; }
}
@media (max-width:700px) {
  #wrapper { padding:0 20px; }
  #header { min-height:190px; padding:29px 0; background-position:67% center; background-size:auto 100%; }
  .brand-logo img { width:218px; }
  .brand-caption { max-width:230px; font-size:12px; }
  .brand-shortcuts { margin-top:16px; font-size:12px; gap:12px; }
  #contentwrapper { display:grid; grid-template-columns:minmax(0,1fr); grid-template-areas:"main" "left" "right";
    gap:34px; margin-top:26px; padding-bottom:36px; }
  #left { display:block; }
  #right { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); align-items:start; gap:20px; }
  #right>div:not([class]) { grid-column:1/-1; }
  #randomalbum img { max-width:190px; }
  .page-title { font-size:34px; margin-bottom:24px; }
  .breadcrumbs { margin-bottom:19px; font-size:11px; }
  .article-body { font-size:16px; }
  .article-body h2 { font-size:26px; }
  .altrack { float:none; width:auto; max-width:100%; margin:0 0 24px; }
  .rightdiscimg-block { float:none; width:224px; max-width:100%; margin:0 auto 25px; }
  .article-body img.imageright, .article-body img.imageleft { float:none; display:block; max-width:100%; margin:18px auto; }
  .section-cards { gap:10px; }
  .section-card { padding:14px; min-height:128px; }
  .section-card strong { font-size:21px; }
  .home-intro h1 { font-size:39px; }
  .home-intro .lead { font-size:16px; }
  .views-view-grid tbody { grid-template-columns:repeat(2,minmax(0,1fr)); gap:12px; }
}
@media (prefers-reduced-motion:reduce) { html { scroll-behavior:auto; } }
.archive-search { margin:24px 0; padding:20px; border:1px solid var(--line); background:var(--panel); }
.archive-search label { display:block; margin-bottom:10px; font-weight:600; }
.search-controls { display:flex; gap:10px; }
.search-controls input { flex:1; min-width:0; width:100%; padding:11px 12px; border:1px solid #71786d; border-radius:3px; background:#101314; color:var(--ink); font:inherit; }
.search-controls button, #search-pagination button { padding:10px 15px; border:1px solid #857658; border-radius:3px; background:#26291f; color:var(--ink); cursor:pointer; }
#search-help { margin:10px 0 0; color:var(--muted); font-size:13px; }
.article-body .search-results { padding-left:24px; }
.search-results li { padding:0 0 22px; margin-bottom:24px; border-bottom:1px solid var(--line); }
.article-body .search-results h2 { margin:0 0 12px; font-size:24px; }
.search-section { color:var(--muted); font-size:13px; }
#search-pagination { display:flex; flex-wrap:wrap; gap:12px; margin-top:22px; }
.collection-items { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:24px 18px; }
.collection-items.collection-single { grid-template-columns:minmax(0,1fr); }
.collection-photo { min-width:0; text-align:center; }
.collection-photo img { display:block; max-width:100%; width:auto; height:auto; margin:0 auto; }
.collection-photo a { display:block; }
.collection-items>.views-row { grid-column:1/-1; border-bottom:1px solid var(--line); padding-bottom:24px; }
.collection-items>.views-row::after { display:table; content:""; clear:both; }
.collection-items .views-field-field-storyimage-fid { float:left; margin:0 18px 12px 0; }

/* Media cards and captions, step 11. */
.video-frame { min-height:200px; }
.video-card>img { display:block; max-width:100%; height:auto; margin:auto; }
.video-details { overflow-wrap:anywhere; }
.video-details dt { font-weight:600; margin-top:12px; }
.video-details dd { margin:4px 0 14px; color:var(--muted); }
.media-note,.media-caption { color:var(--muted); font-size:14px; }
.media-caption { margin-top:12px; text-align:left; overflow-wrap:anywhere; }
.media-caption>a[download] { display:block; margin-top:8px; }