/* Blissarria: velvet black, emerald and gold, taken from the emblem */
:root, [data-bs-theme=dark] {
  --velvet:#050806; --deep:#0a1711; --panel:#0d1c15;
  --emerald:#2f9e76; --emerald-lo:#176346;
  --gold:#d9ae52; --gold-hi:#f3d98b; --gold-lo:#8f6f2a;
  --parch:#ece4cf; --muted:#9db0a3; --line:rgba(217,174,82,.28);
  --bs-body-bg:var(--velvet); --bs-body-color:var(--parch);
  --bs-body-font-family:'Alegreya',Georgia,serif; --bs-body-font-size:1.15rem; --bs-body-line-height:1.65;
  --bs-border-color:var(--line); --bs-link-color:var(--gold-hi); --bs-link-hover-color:#fff3c9;
  --bs-link-color-rgb:243,217,139; --bs-link-hover-color-rgb:255,243,201;
}
body { background:radial-gradient(1100px 520px at 50% -8%, rgba(47,158,118,.10), transparent 62%), var(--velvet); }
a:focus-visible, button:focus-visible, .btn:focus-visible { outline:2px solid var(--gold-hi); outline-offset:3px; box-shadow:none; }
.muted { color:var(--muted); }
.skip { position:absolute; z-index:2000; left:1rem; top:1rem; background:var(--gold); color:#1a1304; padding:.4rem .8rem; }

/* gold-leaf display type, echoing the lettering in the emblem */
h1, .sec-title { font-family:'Cinzel',Georgia,serif; font-weight:600; letter-spacing:.04em; line-height:1.2;
  background:linear-gradient(180deg,var(--gold-hi),var(--gold) 55%,var(--gold-lo)); -webkit-background-clip:text; background-clip:text; color:transparent; }
.sec-title { font-size:clamp(1.7rem,3.6vw,2.4rem); margin:0; }
h2, h3 { font-weight:700; }

/* divider with a diamond: marks the break between sections */
.orn { position:relative; height:14px; max-width:260px; margin:.9rem auto 1.1rem; }
.orn::before { content:""; position:absolute; left:0; right:0; top:50%; height:1px; background:linear-gradient(90deg,transparent,var(--gold) 30%,var(--gold) 70%,transparent); }
.orn::after { content:""; position:absolute; left:50%; top:50%; width:9px; height:9px; background:var(--gold); transform:translate(-50%,-50%) rotate(45deg); box-shadow:0 0 0 5px var(--velvet); }

/* buttons */
.btn { font-family:'Alegreya',serif; font-weight:700; font-size:1.05rem; border-radius:2px; padding:.55rem 1.3rem; }
.btn-sm { font-size:1rem; padding:.35rem .9rem; }
.btn-gold { background:linear-gradient(180deg,var(--gold-hi),var(--gold) 60%,#b98b34); color:#1a1304; border:1px solid rgba(243,217,139,.5); }
.btn-gold:hover { color:#000; filter:brightness(1.1); }
.btn-ghost { background:transparent; color:var(--gold-hi); border:1px solid var(--gold-lo); }
.btn-ghost:hover, .btn-ghost.active { background:rgba(217,174,82,.14); border-color:var(--gold); color:#fff3c9; }

/* navigation */
.bl-nav { background:rgba(5,8,6,.9); backdrop-filter:blur(10px); border-bottom:1px solid var(--line); }
.navbar-brand { display:flex; align-items:center; gap:.7rem; font-family:'Cinzel',serif; font-weight:600; font-size:1.3rem; letter-spacing:.08em; color:var(--gold-hi); }
.navbar-brand:hover { color:#fff3c9; }
.navbar-brand img { border-radius:50%; }
.bl-nav .nav-link { color:var(--parch); font-size:1.1rem; padding:.5rem .9rem; border-bottom:1px solid transparent; }
.bl-nav .nav-link:hover { color:var(--gold-hi); }
.bl-nav .nav-link.active { color:var(--gold-hi); border-bottom-color:var(--gold); }
.navbar-toggler { border:1px solid var(--line); color:var(--gold-hi); font-size:1.5rem; padding:.1rem .5rem; }
.navbar-toggler:focus { box-shadow:none; }

/* hero: the one big moment */
.hero { text-align:center; overflow:hidden; }
.hero-art img { display:block; width:100%; height:auto; max-height:82vh; object-fit:contain;
  -webkit-mask-image:linear-gradient(to bottom,#000 92%,transparent),linear-gradient(to right,transparent,#000 12%,#000 88%,transparent);
  -webkit-mask-composite:source-in;
  mask-image:linear-gradient(to bottom,#000 92%,transparent),linear-gradient(to right,transparent,#000 12%,#000 88%,transparent);
  mask-composite:intersect; }
@media (max-width:767.98px) { .hero-art img { height:46vh; max-height:none; object-fit:cover; } }
@media (prefers-reduced-motion:no-preference) {
  .hero-art img { animation:emerge 1.8s ease-out both; }
  .hero-copy { animation:rise 1.2s .9s ease-out both; }
  @keyframes emerge { from { opacity:0; filter:brightness(.35); transform:scale(1.03); } to { opacity:1; filter:none; transform:none; } }
  @keyframes rise { from { opacity:0; transform:translateY(12px); } to { opacity:1; transform:none; } }
}
.hero-copy { max-width:780px; margin-top:-1.5rem; padding-bottom:4.5rem; }
.hero-tag { font-size:clamp(1.6rem,3.4vw,2.3rem); font-style:italic; color:var(--gold-hi); margin-bottom:.6rem; }
.hero-text { font-size:1.25rem; max-width:60ch; margin:0 auto 1.8rem; opacity:.92; }

/* sections */
.section { padding:4.5rem 0; }
.page-head { padding:3.5rem 0 2.5rem; }
.page-head h1 { font-size:clamp(2rem,5vw,3.3rem); margin:0; }
.lead-text { max-width:60ch; margin:0 auto 1.2rem; font-size:1.3rem; font-style:italic; opacity:.92; }
.cta-band { padding:4.2rem 0; border-block:1px solid var(--line);
  background:radial-gradient(620px 240px at 50% 0, rgba(47,158,118,.2), transparent 70%), var(--deep); }
.cta-band h2 { font-size:clamp(1.6rem,3vw,2.2rem); }

/* framed images */
.frame { display:block; position:relative; padding:8px; background:var(--panel); border:1px solid var(--gold-lo); }
.frame img, .frame video { display:block; width:100%; height:auto; }
.ratio.frame { padding:0; }
.play { position:absolute; inset:0; display:grid; place-items:center; pointer-events:none; }
.play i { width:3.4rem; height:3.4rem; border-radius:50%; display:grid; place-items:center; padding-left:.15rem;
  font-size:1.9rem; color:var(--gold-hi); background:rgba(5,8,6,.72); border:1px solid var(--gold); }

/* masonry cards (home + related) */
.masonry { column-count:1; column-gap:1.75rem; }
@media (min-width:768px) { .masonry { column-count:2; } }
@media (min-width:1200px) { .masonry { column-count:3; } }
.b-card { display:inline-block; width:100%; break-inside:avoid; margin:0 0 1.75rem; padding:11px; background:var(--panel);
  border:1px solid var(--gold-lo); box-shadow:inset 0 0 0 5px var(--panel), inset 0 0 0 6px var(--line); transition:border-color .25s; }
.b-card:hover { border-color:var(--gold); }
.b-card-img { display:block; position:relative; overflow:hidden; }
.b-card-img img { display:block; width:100%; height:auto; }
.b-card-body { padding:1rem .6rem .7rem; }
.b-meta { display:flex; justify-content:space-between; align-items:center; gap:.5rem; font-size:.95rem; color:var(--muted); margin-bottom:.4rem; }
.badge-sec { color:var(--gold-hi); border:1px solid var(--gold-lo); padding:0 .6rem; border-radius:2px; font-size:.95rem; }
.b-card h3 { font-size:1.5rem; line-height:1.25; margin-bottom:.5rem; }
.b-card h3 a { color:var(--parch); text-decoration:none; }
.b-card h3 a:hover { color:var(--gold-hi); }
.b-card p { margin-bottom:1rem; }

/* story */
.story-row { margin-bottom:4.5rem; }
.story-title { font-size:clamp(1.8rem,3.2vw,2.5rem); line-height:1.2; margin-bottom:1rem; }
.story-title a { color:var(--gold-hi); text-decoration:none; }
.story-title a:hover { color:#fff3c9; }
.story-snippet { font-size:1.28rem; margin-bottom:1.4rem; }

/* history timeline (a true sequence) */
.timeline { list-style:none; margin:0 auto; padding:0; max-width:1040px; position:relative; }
.timeline::before { content:""; position:absolute; top:0; bottom:0; left:14px; width:2px; background:linear-gradient(var(--gold-lo),var(--emerald-lo)); }
.tl-item { position:relative; padding:0 0 2.5rem 3.2rem; }
.tl-dot { position:absolute; left:5px; top:.9rem; width:20px; height:20px; transform:rotate(45deg); background:var(--velvet); border:2px solid var(--gold); }
.tl-card { background:var(--panel); border:1px solid var(--gold-lo); padding:1.4rem 1.5rem; }
.tl-date { font-family:'Cinzel',serif; color:var(--gold-hi); font-size:1.05rem; margin-bottom:.7rem; }
.tl-card h2 { font-size:1.6rem; }
.tl-card h2 a { color:var(--parch); text-decoration:none; }
.tl-card h2 a:hover { color:var(--gold-hi); }
@media (min-width:992px) {
  .timeline::before { left:50%; margin-left:-1px; }
  .tl-item { width:50%; padding:0 3rem 3rem 0; }
  .tl-item:nth-child(even) { margin-left:50%; padding:0 0 3rem 3rem; }
  .tl-dot { left:auto; right:-10px; }
  .tl-item:nth-child(even) .tl-dot { right:auto; left:-10px; }
}

/* gallery + lightbox */
.g-grid { display:grid; grid-template-columns:repeat(auto-fill,minmax(230px,1fr)); gap:12px; }
.g-item { position:relative; display:block; aspect-ratio:16/10; overflow:hidden; border:1px solid var(--gold-lo); background:var(--panel); }
.g-item img { width:100%; height:100%; object-fit:cover; transition:transform .5s; }
.g-item:hover img { transform:scale(1.05); }
.g-ph { display:grid; place-items:center; height:100%; font-size:2.6rem; color:var(--gold-lo); }
.g-cap { position:absolute; inset:auto 0 0 0; padding:1.8rem .8rem .5rem; font-size:1rem; color:var(--parch);
  background:linear-gradient(transparent,rgba(5,8,6,.92)); opacity:0; transition:opacity .25s; }
.g-item:hover .g-cap, .g-item:focus-visible .g-cap { opacity:1; }
@media (hover:none) { .g-cap { opacity:1; } }
.modal-backdrop { --bs-backdrop-opacity:.88; }
.lb { position:relative; background:#030504; border:1px solid var(--gold-lo); border-radius:0; }
.lb-stage { display:flex; justify-content:center; min-height:200px; padding:2.8rem 3.6rem 0; }
.lb-stage img, .lb-stage video { max-width:100%; max-height:72vh; display:block; }
.lb-frame { width:100%; aspect-ratio:16/9; border:0; }
.lb-cap { padding:1rem 1.5rem 1.4rem; text-align:center; }
.lb-cap strong { display:block; font-size:1.25rem; color:var(--gold-hi); }
.lb-close { position:absolute; top:.9rem; right:.9rem; z-index:3; }
.lb-nav { position:absolute; top:50%; transform:translateY(-50%); z-index:3; width:2.7rem; height:2.7rem; border-radius:50%;
  background:rgba(5,8,6,.75); border:1px solid var(--gold-lo); color:var(--gold-hi); }
.lb-nav:hover { border-color:var(--gold); }
.lb-prev { left:.7rem; } .lb-next { right:.7rem; }
@media (max-width:575.98px) { .lb-stage { padding:2.8rem .5rem 0; } .lb-nav { top:auto; bottom:.8rem; transform:none; } }

/* single page */
.article { max-width:860px; }
.article-title { font-size:clamp(1.9rem,4.6vw,3rem); margin:0; }
.back-link { color:var(--muted); text-decoration:none; }
.back-link:hover { color:var(--gold-hi); }
.prose { font-size:1.28rem; line-height:1.8; max-width:68ch; margin:0 auto; }
.prose h2, .prose h3 { color:var(--gold-hi); margin:2rem 0 .8rem; }
.prose img { display:block; max-width:100%; height:auto; margin:1.5rem auto; padding:6px; border:1px solid var(--gold-lo); background:var(--panel); }
.prose blockquote { margin:1.6rem 0; padding:.2rem 0 .2rem 1.2rem; border-left:3px solid var(--emerald); font-style:italic; }
.prose .ql-align-center { text-align:center; } .prose .ql-align-right { text-align:right; } .prose .ql-align-justify { text-align:justify; }

/* forms */
.panel { background:var(--panel); border:1px solid var(--gold-lo); padding:1.8rem; position:relative; box-shadow:inset 0 0 0 5px var(--panel), inset 0 0 0 6px var(--line); }
.panel h2 { font-size:1.7rem; color:var(--gold-hi); }
.form-label { color:var(--parch); margin-bottom:.25rem; }
.form-control, .form-select { background-color:#07110c; border:1px solid rgba(217,174,82,.35); color:var(--parch); font-size:1.1rem; border-radius:2px; }
.form-control:focus, .form-select:focus { background-color:#07110c; color:#fff; border-color:var(--gold); box-shadow:0 0 0 .2rem rgba(243,217,139,.25); }
.form-check-input:checked { background-color:var(--gold); border-color:var(--gold); }
.hp { position:absolute; left:-9999px; width:1px; height:1px; overflow:hidden; }

/* footer */
.bl-footer { border-top:1px solid var(--line); padding:0 0 2rem; background:linear-gradient(var(--velvet),#030504); }
.bl-footer .orn { margin-top:-7px; }
.foot-brand { font-family:'Cinzel',serif; font-size:1.5rem; letter-spacing:.08em; color:var(--gold-hi); }
.foot-links a { color:var(--parch); text-decoration:none; margin:0 .4rem; }
.foot-links a:hover { color:var(--gold-hi); }
