/* ==========================================================================
   Gilded — dark & gold Azuriom theme
   ========================================================================== */

:root,
[data-bs-theme=dark] {
    /* Palette */
    --gl-bg: #141312;
    --gl-bg-deep: #0d0c0b;
    --gl-surface: #1b1917;
    --gl-surface-2: #221f1c;
    --gl-line: #36312a;
    --gl-line-soft: rgba(191, 162, 81, .18);
    --gl-gold: #bfa251;
    --gl-gold-rgb: 191, 162, 81;
    --gl-gold-bright: #eac04b;
    --gl-gold-deep: #ac7d00;
    --gl-gold-pale: #efd8af;
    --gl-cream: #fcf5e2;
    --gl-text: #b5b5b5;
    --gl-text-strong: #e9e5dc;
    --gl-muted: #85817a;
    --gl-success: #7fc97f;
    --gl-danger: #d9534f;

    --gl-metal: linear-gradient(90deg, #d8bd7d, #efd8af, #fcf3ca, #dfb872, #c5a55e);
    --gl-gold-button: radial-gradient(#eac04b, #ac7d00);
    --gl-gold-button-hover: radial-gradient(#fbd970, #bd8a06);
    --gl-gold-fade: linear-gradient(90deg, rgba(191, 162, 81, 0), #bfa251, rgba(191, 162, 81, 0));

    --gl-font-display: "Marcellus", "Times New Roman", Times, serif;
    --gl-font-body: "Mulish", "Helvetica Neue", Arial, sans-serif;
    --gl-nav-height: 64px;
    --gl-ease: cubic-bezier(.2, .7, .2, 1);

    /* Bootstrap mapping */
    --bs-body-bg: var(--gl-bg);
    --bs-body-bg-rgb: 20, 19, 18;
    --bs-body-color: var(--gl-text);
    --bs-body-color-rgb: 181, 181, 181;
    --bs-body-font-family: var(--gl-font-body);
    --bs-body-line-height: 1.65;
    --bs-emphasis-color: var(--gl-text-strong);
    --bs-emphasis-color-rgb: 233, 229, 220;
    --bs-heading-color: var(--gl-cream);
    --bs-secondary-color: var(--gl-muted);
    --bs-secondary-bg: var(--gl-surface);
    --bs-secondary-bg-rgb: 27, 25, 23;
    --bs-tertiary-bg: var(--gl-surface-2);
    --bs-tertiary-bg-rgb: 34, 31, 28;
    --bs-border-color: var(--gl-line);
    --bs-border-color-translucent: rgba(191, 162, 81, .15);
    --bs-border-radius: 3px;
    --bs-border-radius-sm: 2px;
    --bs-border-radius-lg: 4px;
    --bs-primary: var(--gl-gold);
    --bs-primary-rgb: var(--gl-gold-rgb);
    --bs-primary-text-emphasis: var(--gl-gold-pale);
    --bs-primary-bg-subtle: #2a2416;
    --bs-primary-border-subtle: #6b5a2b;
    --bs-link-color: var(--gl-gold);
    --bs-link-color-rgb: var(--gl-gold-rgb);
    --bs-link-hover-color: var(--gl-gold-pale);
    --bs-link-hover-color-rgb: 239, 216, 175;
    --bs-focus-ring-color: rgba(var(--gl-gold-rgb), .3);
    --bs-highlight-bg: rgba(var(--gl-gold-rgb), .25);
    --bs-highlight-color: var(--gl-cream);
}

/* --------------------------------------------------------------------------
   Base
   -------------------------------------------------------------------------- */

html {
    height: 100%;
    scroll-behavior: smooth;
}

body.gl-body {
    min-height: 100%;
    background-color: var(--gl-bg);
    color: var(--gl-text);
    font-family: var(--gl-font-body);
    -webkit-font-smoothing: antialiased;
}

#app {
    position: relative;
}

a {
    text-decoration: none;
    transition: color .25s ease;
}

img {
    max-width: 100%;
    height: auto;
}

::selection {
    background: rgba(var(--gl-gold-rgb), .35);
    color: var(--gl-cream);
}

h1, h2, h3, h4, h5, h6,
.h1, .h2, .h3, .h4, .h5, .h6 {
    font-family: var(--gl-font-display);
    font-weight: 400;
    letter-spacing: .02em;
    color: var(--gl-cream);
}

hr {
    border: 0;
    height: 1px;
    background: var(--gl-gold-fade);
    opacity: .7;
}

:focus-visible {
    outline: 2px solid var(--gl-gold);
    outline-offset: 2px;
}

.text-body-secondary,
.text-muted,
.gl-muted {
    color: var(--gl-muted) !important;
}

/* Diamond bullets for rich content */
.gl-main .card-text ul,
.gl-main .content ul,
.gl-main article ul {
    list-style: none;
    padding-left: 1.25rem;
}

.gl-main .card-text ul > li,
.gl-main .content ul > li,
.gl-main article ul > li {
    position: relative;
}

.gl-main .card-text ul > li::before,
.gl-main .content ul > li::before,
.gl-main article ul > li::before {
    content: "";
    position: absolute;
    left: -1rem;
    top: .68em;
    width: 5px;
    height: 5px;
    background: var(--gl-gold);
    transform: rotate(45deg);
}

/* Scrollbar */
* {
    scrollbar-color: #4a4135 var(--gl-bg-deep);
}

::-webkit-scrollbar {
    width: 10px;
    height: 10px;
}

::-webkit-scrollbar-track {
    background: var(--gl-bg-deep);
}

::-webkit-scrollbar-thumb {
    background: #4a4135;
    border: 2px solid var(--gl-bg-deep);
    border-radius: 10px;
}

::-webkit-scrollbar-thumb:hover {
    background: var(--gl-gold);
}

/* --------------------------------------------------------------------------
   Ornaments
   -------------------------------------------------------------------------- */

.gl-divider {
    position: relative;
    height: 1px;
    background: var(--gl-gold-fade);
    z-index: 2;
}

.gl-divider > span {
    position: absolute;
    top: 50%;
    left: 50%;
    width: 11px;
    height: 11px;
    margin: -5.5px 0 0 -5.5px;
    background: radial-gradient(#fcf3ca, #ae9368);
    border: 2px solid var(--gl-bg);
    box-shadow: 0 0 0 1px rgba(var(--gl-gold-rgb), .6), 0 0 14px rgba(var(--gl-gold-rgb), .5);
    transform: rotate(45deg);
}

.gl-section-title,
.gl-main > h1:first-of-type,
.gl-main .row > [class*="col"] > h1:first-child,
.gl-main > .container > h1:first-child {
    position: relative;
    text-align: center;
    font-size: clamp(1.9rem, 1.4rem + 1.6vw, 2.75rem);
    margin-bottom: 2.75rem;
    padding-bottom: 1.1rem;
}

.gl-section-title::before,
.gl-main > h1:first-of-type::before,
.gl-main .row > [class*="col"] > h1:first-child::before,
.gl-main > .container > h1:first-child::before {
    content: "";
    position: absolute;
    left: 50%;
    bottom: 0;
    width: min(260px, 70%);
    height: 1px;
    transform: translateX(-50%);
    background: var(--gl-gold-fade);
}

.gl-section-title::after,
.gl-main > h1:first-of-type::after,
.gl-main .row > [class*="col"] > h1:first-child::after,
.gl-main > .container > h1:first-child::after {
    content: "";
    position: absolute;
    left: 50%;
    bottom: -4px;
    width: 9px;
    height: 9px;
    margin-left: -4.5px;
    background: radial-gradient(#fcf3ca, #ae9368);
    border: 1px solid var(--gl-bg);
    transform: rotate(45deg);
}

/* --------------------------------------------------------------------------
   Buttons
   -------------------------------------------------------------------------- */

.btn {
    --bs-btn-font-family: var(--gl-font-body);
    --bs-btn-font-weight: 600;
    --bs-btn-border-radius: 4px;
    --bs-btn-padding-x: 1.35rem;
    --bs-btn-padding-y: .5rem;
    letter-spacing: .04em;
    transition: color .35s ease, background .35s ease, border-color .35s ease, box-shadow .35s ease, transform .2s ease;
}

.btn-lg {
    --bs-btn-padding-x: 2.1rem;
    --bs-btn-padding-y: .8rem;
    --bs-btn-font-size: 1.1rem;
    --bs-btn-border-radius: 4px;
}

.btn-primary {
    --bs-btn-color: #fff;
    --bs-btn-border-color: var(--gl-gold);
    --bs-btn-hover-color: #fff;
    --bs-btn-hover-border-color: #fcf3ca;
    --bs-btn-active-color: #fff;
    --bs-btn-active-border-color: #fcf3ca;
    --bs-btn-disabled-color: rgba(255, 255, 255, .7);
    --bs-btn-disabled-border-color: var(--gl-gold);
    background-image: var(--gl-gold-button);
    background-color: var(--gl-gold-deep);
    text-shadow: 1px 1px 8px var(--gl-bg);
}

.btn-primary:hover,
.btn-primary:focus-visible,
.btn-primary:active,
.btn-primary.active {
    background-image: var(--gl-gold-button-hover);
    box-shadow: 0 0 22px rgba(234, 192, 75, .35), inset 0 0 0 1px rgba(255, 247, 156, .25);
}

.btn-primary:disabled,
.btn-primary.disabled {
    background-image: var(--gl-gold-button);
    opacity: .5;
}

/* Ghost buttons: gold outline that fills with metal on hover */
.btn-outline-primary,
.btn-secondary,
.btn-outline-secondary {
    --bs-btn-color: #fff;
    --bs-btn-bg: rgba(20, 19, 18, .35);
    --bs-btn-border-color: var(--gl-gold);
    --bs-btn-hover-color: var(--gl-bg);
    --bs-btn-hover-bg: var(--gl-gold);
    --bs-btn-hover-border-color: #fcf3ca;
    --bs-btn-active-color: var(--gl-bg);
    --bs-btn-active-bg: var(--gl-gold);
    --bs-btn-active-border-color: #fcf3ca;
    --bs-btn-disabled-color: var(--gl-muted);
    --bs-btn-disabled-border-color: var(--gl-line);
    --bs-btn-disabled-bg: transparent;
}

.btn-outline-primary:hover,
.btn-outline-primary:focus-visible,
.btn-outline-primary:active,
.btn-outline-primary.active,
.btn-secondary:hover,
.btn-secondary:active,
.btn-outline-secondary:hover,
.btn-outline-secondary:active {
    background-image: var(--gl-metal);
    text-shadow: none;
}

.btn-danger {
    --bs-btn-bg: #7a1f1c;
    --bs-btn-border-color: #a8322d;
    --bs-btn-hover-bg: #9b2925;
    --bs-btn-hover-border-color: #d9534f;
}

.btn-success {
    --bs-btn-bg: #2f5a2f;
    --bs-btn-border-color: #4a8a4a;
    --bs-btn-hover-bg: #3b6f3b;
    --bs-btn-hover-border-color: #7fc97f;
}

.btn-link {
    --bs-btn-color: var(--gl-gold);
    --bs-btn-hover-color: var(--gl-gold-pale);
}

.btn-close {
    filter: invert(1) grayscale(100%) brightness(160%);
}

/* --------------------------------------------------------------------------
   Navbar
   -------------------------------------------------------------------------- */

.gl-header {
    position: sticky;
    top: 0;
    z-index: 1030;
}

.gl-navbar {
    --bs-navbar-padding-y: 0;
    --bs-navbar-color: #fff;
    --bs-navbar-hover-color: var(--gl-gold-bright);
    --bs-navbar-active-color: var(--gl-gold-bright);
    min-height: var(--gl-nav-height);
    background: rgba(20, 19, 18, .94);
    -webkit-backdrop-filter: blur(10px);
    backdrop-filter: blur(10px);
    border-bottom: 1px solid #2a2622;
    transition: box-shadow .3s ease, background .3s ease;
}

.gl-navbar::after {
    content: "";
    position: absolute;
    left: 0;
    right: 0;
    bottom: -1px;
    height: 1px;
    background: var(--gl-gold-fade);
    opacity: .55;
}

.gl-navbar.is-scrolled {
    background: rgba(13, 12, 11, .97);
    box-shadow: 0 8px 28px rgba(0, 0, 0, .55);
}

.gl-navbar-inner {
    max-width: 1440px;
    padding-left: clamp(1rem, 3vw, 2.5rem);
    padding-right: clamp(1rem, 3vw, 2.5rem);
}

.gl-brand {
    display: flex;
    align-items: center;
    min-height: var(--gl-nav-height);
    padding: 0;
    margin-right: 2rem;
}

.gl-brand img {
    max-height: 42px;
    width: auto;
    filter: drop-shadow(0 0 8px rgba(0, 0, 0, .6));
}

.gl-brand-text {
    font-family: var(--gl-font-display);
    font-size: 1.55rem;
    letter-spacing: .06em;
    background: var(--gl-metal);
    -webkit-background-clip: text;
    background-clip: text;
    color: transparent;
}

.gl-nav .nav-link {
    position: relative;
    padding: .5rem .9rem !important;
    font-size: .75rem;
    font-weight: 700;
    letter-spacing: .14em;
    text-transform: uppercase;
    color: #fff;
}

@media (min-width: 992px) {
    .gl-nav > .nav-item > .nav-link {
        line-height: calc(var(--gl-nav-height) - 1rem);
    }

    .gl-nav > .nav-item > .nav-link::before {
        content: "";
        position: absolute;
        left: .9rem;
        right: .9rem;
        bottom: .7rem;
        height: 1px;
        background: var(--gl-gold);
        transform: scaleX(0);
        transition: transform .3s var(--gl-ease);
    }

    .gl-nav > .nav-item > .nav-link:hover::before,
    .gl-nav > .nav-item > .nav-link.active::before,
    .gl-nav > .nav-item > .nav-link.show::before {
        transform: scaleX(1);
    }
}

.gl-nav .nav-link:hover,
.gl-nav .nav-link:focus,
.gl-nav .nav-link.active,
.gl-nav .nav-link.show {
    color: var(--gl-gold-bright) !important;
}

.gl-nav .dropdown-toggle::after {
    border-top-color: var(--gl-gold);
    vertical-align: .2em;
    margin-left: .45em;
    border-width: .3em .28em 0;
}

.gl-nav .badge {
    font-size: .6rem;
    vertical-align: top;
}

.gl-play {
    white-space: nowrap;
}

.gl-navbar .gl-play {
    --bs-btn-padding-y: .45rem;
    --bs-btn-padding-x: 1.4rem;
    font-size: .8rem;
    letter-spacing: .12em;
    text-transform: uppercase;
}

.gl-toggler {
    border: 1px solid var(--gl-line);
    padding: .55rem .6rem;
    display: inline-flex;
    flex-direction: column;
    gap: 4px;
}

.gl-toggler span {
    display: block;
    width: 22px;
    height: 2px;
    background: var(--gl-gold);
    transition: transform .3s ease, opacity .3s ease;
}

.gl-toggler[aria-expanded="true"] span:nth-child(1) {
    transform: translateY(6px) rotate(45deg);
}

.gl-toggler[aria-expanded="true"] span:nth-child(2) {
    opacity: 0;
}

.gl-toggler[aria-expanded="true"] span:nth-child(3) {
    transform: translateY(-6px) rotate(-45deg);
}

.gl-toggler:focus {
    box-shadow: 0 0 0 .2rem rgba(var(--gl-gold-rgb), .3);
}

@media (max-width: 991.98px) {
    .gl-navbar .navbar-collapse {
        padding: .5rem 0 1rem;
        border-top: 1px solid var(--gl-line);
        max-height: calc(100vh - var(--gl-nav-height));
        overflow-y: auto;
    }

    .gl-nav .nav-link {
        padding: .8rem .25rem !important;
        border-bottom: 1px solid #221f1c;
    }

    .gl-navbar .gl-play {
        display: block;
        width: 100%;
        margin-top: .5rem;
    }
}

/* Dropdowns */
.dropdown-menu {
    --bs-dropdown-bg: var(--gl-bg);
    --bs-dropdown-border-color: var(--gl-line);
    --bs-dropdown-border-radius: 0;
    --bs-dropdown-link-color: var(--gl-text-strong);
    --bs-dropdown-link-hover-color: var(--gl-gold-bright);
    --bs-dropdown-link-hover-bg: rgba(var(--gl-gold-rgb), .08);
    --bs-dropdown-link-active-color: var(--gl-bg);
    --bs-dropdown-link-active-bg: var(--gl-gold);
    --bs-dropdown-header-color: var(--gl-gold);
    --bs-dropdown-divider-bg: var(--gl-line);
    --bs-dropdown-item-padding-y: .55rem;
    --bs-dropdown-item-padding-x: 1.1rem;
    border-top: 2px solid var(--gl-gold);
    box-shadow: 0 18px 40px rgba(0, 0, 0, .6);
    font-size: .9rem;
}

.dropdown-item i {
    color: var(--gl-gold);
    margin-right: .35rem;
}

.dropdown-item:active i,
.dropdown-item.active i {
    color: inherit;
}

.dropdown-header {
    font-size: .7rem;
    letter-spacing: .14em;
    text-transform: uppercase;
}

/* --------------------------------------------------------------------------
   Hero
   -------------------------------------------------------------------------- */

.gl-hero {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
    min-height: clamp(520px, 78vh, 760px);
    padding: 5rem 0 6rem;
    overflow: hidden;
    text-align: center;
    color: #fff;
    background:
        linear-gradient(180deg, rgba(20, 19, 18, .25) 0%, rgba(20, 19, 18, .35) 50%, rgba(20, 19, 18, .85) 85%, var(--gl-bg) 100%),
        radial-gradient(ellipse at center, rgba(0, 0, 0, 0) 40%, rgba(0, 0, 0, .55) 100%),
        var(--gl-hero-image) center / cover no-repeat;
    background-color: var(--gl-bg-deep);
}

.gl-hero--default {
    background:
        linear-gradient(180deg, rgba(20, 19, 18, 0) 60%, var(--gl-bg) 100%),
        radial-gradient(ellipse 60% 55% at 50% 38%, rgba(234, 192, 75, .22), rgba(172, 125, 0, .06) 55%, transparent 75%),
        radial-gradient(ellipse 120% 80% at 50% 120%, #2a2112 0%, transparent 60%),
        radial-gradient(circle at 15% 20%, rgba(191, 162, 81, .08), transparent 35%),
        radial-gradient(circle at 85% 30%, rgba(191, 162, 81, .07), transparent 35%),
        var(--gl-bg-deep);
}

/* Ornamental rotated frames behind the default hero */
.gl-hero--default::before,
.gl-hero--default::after {
    content: "";
    position: absolute;
    top: 50%;
    left: 50%;
    border: 1px solid rgba(var(--gl-gold-rgb), .16);
    transform: translate(-50%, -55%) rotate(45deg);
    pointer-events: none;
}

.gl-hero--default::before {
    width: min(560px, 80vw);
    height: min(560px, 80vw);
}

.gl-hero--default::after {
    width: min(420px, 60vw);
    height: min(420px, 60vw);
    border-color: rgba(var(--gl-gold-rgb), .1);
    box-shadow: 0 0 120px rgba(var(--gl-gold-rgb), .08) inset;
}

.gl-hero-content {
    position: relative;
    z-index: 1;
    max-width: 920px;
    animation: gl-rise 1s var(--gl-ease) both;
}

.gl-hero-kicker {
    margin-bottom: 1.25rem;
    font-size: .8rem;
    font-weight: 700;
    letter-spacing: .32em;
    text-transform: uppercase;
    color: var(--gl-gold-bright);
    text-shadow: 0 0 12px rgba(0, 0, 0, .9);
}

.gl-hero-title {
    position: relative;
    display: inline-block;
    margin: 0 0 1.5rem;
    padding: .9rem 1.5rem;
    font-size: clamp(2.6rem, 1.5rem + 5vw, 5.5rem);
    line-height: 1.05;
    letter-spacing: .03em;
    color: var(--gl-cream);
    text-shadow: 0 2px 30px rgba(0, 0, 0, .85), 0 0 60px rgba(234, 192, 75, .18);
}

.gl-hero-title::before,
.gl-hero-title::after {
    content: "";
    position: absolute;
    left: 0;
    right: 0;
    height: 1px;
    background: var(--gl-gold-fade);
}

.gl-hero-title::before {
    top: 0;
}

.gl-hero-title::after {
    bottom: 0;
}

.gl-hero-subtitle {
    max-width: 640px;
    margin: 0 auto 1.75rem;
    font-size: clamp(1rem, .95rem + .3vw, 1.2rem);
    color: var(--gl-text-strong);
    text-shadow: 0 1px 12px rgba(0, 0, 0, .9);
}

.gl-hero-actions {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 1rem;
}

.gl-divider--hero {
    margin-top: -1px;
}

@keyframes gl-rise {
    from {
        opacity: 0;
        transform: translateY(24px);
    }
    to {
        opacity: 1;
        transform: none;
    }
}

/* --------------------------------------------------------------------------
   Layout sections
   -------------------------------------------------------------------------- */

.gl-page-top {
    position: absolute;
    inset: 0 0 auto 0;
    height: 460px;
    background:
        radial-gradient(ellipse 70% 100% at 50% 0%, rgba(var(--gl-gold-rgb), .13), transparent 70%),
        linear-gradient(180deg, var(--gl-bg-deep), var(--gl-bg));
    pointer-events: none;
}

/* No z-index here: it would create a stacking context that traps Bootstrap
   modals rendered inside the page beneath the body-level .modal-backdrop. */
.gl-main {
    position: relative;
    padding-top: 3.5rem;
    padding-bottom: 5rem;
}

.gl-home {
    padding-top: 4.5rem;
    padding-bottom: 3rem;
}

.gl-section + .gl-section {
    margin-top: 5.5rem;
}

.gl-panel {
    position: relative;
    padding: 1.75rem;
    background: linear-gradient(180deg, var(--gl-surface-2), var(--gl-surface));
    border: 1px solid var(--gl-line);
}

.gl-panel::before {
    content: "";
    position: absolute;
    top: -1px;
    left: 10%;
    right: 10%;
    height: 1px;
    background: var(--gl-gold-fade);
}

.gl-message {
    font-size: 1.1rem;
    color: var(--gl-text-strong);
}

/* Servers */
.gl-server {
    text-align: center;
}

.gl-server-name {
    font-size: 1.6rem;
    margin-bottom: 1rem;
}

/* News cards */
.gl-news-card {
    display: flex;
    flex-direction: column;
    height: 100%;
    color: var(--gl-text);
    border-bottom: 1px solid var(--gl-line);
    padding-bottom: 1.25rem;
    transition: border-color .3s ease;
}

.gl-news-card:hover {
    color: var(--gl-text);
    border-bottom-color: var(--gl-gold);
}

.gl-news-image {
    position: relative;
    aspect-ratio: 16 / 9;
    overflow: hidden;
    background: var(--gl-surface);
    border: 1px solid #2a2622;
}

.gl-news-image::after {
    content: "";
    position: absolute;
    inset: 0;
    box-shadow: inset 0 0 0 1px rgba(var(--gl-gold-rgb), 0);
    transition: box-shadow .3s ease;
}

.gl-news-card:hover .gl-news-image::after {
    box-shadow: inset 0 0 0 1px rgba(var(--gl-gold-rgb), .7);
}

.gl-news-image img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform .5s var(--gl-ease);
}

.gl-news-card:hover .gl-news-image img {
    transform: scale(1.05);
}

.gl-news-placeholder {
    display: flex;
    align-items: center;
    justify-content: center;
    height: 100%;
    font-size: 3rem;
    color: rgba(var(--gl-gold-rgb), .35);
    background: radial-gradient(circle at 50% 40%, rgba(var(--gl-gold-rgb), .12), transparent 65%), var(--gl-surface);
}

.gl-news-tag {
    position: absolute;
    top: .85rem;
    left: .85rem;
    padding: .3rem .65rem;
    font-size: .65rem;
    font-weight: 700;
    letter-spacing: .14em;
    text-transform: uppercase;
    color: var(--gl-text-strong);
    background: rgba(13, 12, 11, .85);
    border-left: 2px solid var(--gl-gold);
}

.gl-news-body {
    display: flex;
    flex-direction: column;
    flex: 1;
    padding-top: 1.1rem;
}

.gl-news-date {
    margin-bottom: .45rem;
    font-size: .75rem;
    letter-spacing: .04em;
    color: var(--gl-muted);
}

.gl-news-title {
    margin-bottom: .6rem;
    font-family: var(--gl-font-body);
    font-size: 1.25rem;
    font-weight: 600;
    line-height: 1.3;
    letter-spacing: .02em;
    color: #fff;
    transition: color .3s ease;
}

.gl-news-card:hover .gl-news-title {
    color: var(--gl-gold-bright);
}

.gl-news-excerpt {
    flex: 1;
    margin-bottom: 1rem;
    font-size: .92rem;
}

.gl-news-more {
    font-size: .75rem;
    font-weight: 700;
    letter-spacing: .14em;
    text-transform: uppercase;
    color: var(--gl-gold);
}

.gl-news-more i {
    display: inline-block;
    margin-left: .3rem;
    transition: transform .3s var(--gl-ease);
}

.gl-news-card:hover .gl-news-more i {
    transform: translateX(5px);
}

/* Call to action */
.gl-cta {
    position: relative;
    margin-top: 4rem;
    background:
        radial-gradient(ellipse 60% 120% at 50% 100%, rgba(var(--gl-gold-rgb), .14), transparent 70%),
        var(--gl-bg-deep);
}

.gl-cta-inner {
    padding: 5.5rem 0;
}

.gl-cta-title {
    display: inline-block;
    margin-bottom: 1rem;
    font-size: clamp(2rem, 1.4rem + 2.2vw, 3.25rem);
    background: var(--gl-metal);
    -webkit-background-clip: text;
    background-clip: text;
    color: transparent;
}

.gl-cta-text {
    max-width: 560px;
    margin: 0 auto 2rem;
    font-size: 1.1rem;
    color: var(--gl-text-strong);
}

/* --------------------------------------------------------------------------
   Bootstrap components
   -------------------------------------------------------------------------- */

.card {
    --bs-card-bg: var(--gl-surface);
    --bs-card-border-color: var(--gl-line);
    --bs-card-border-radius: 2px;
    --bs-card-inner-border-radius: 1px;
    --bs-card-cap-bg: rgba(var(--gl-gold-rgb), .06);
    --bs-card-cap-color: var(--gl-gold-pale);
    --bs-card-title-color: var(--gl-cream);
    --bs-card-color: var(--gl-text);
    position: relative;
    background-image: linear-gradient(180deg, var(--gl-surface-2), var(--gl-surface));
    box-shadow: 0 10px 30px rgba(0, 0, 0, .25) !important;
}

.card::before {
    content: "";
    position: absolute;
    top: -1px;
    left: 8%;
    right: 8%;
    height: 1px;
    background: var(--gl-gold-fade);
    z-index: 1;
}

.card-header {
    font-size: .78rem;
    font-weight: 700;
    letter-spacing: .14em;
    text-transform: uppercase;
    border-bottom-color: var(--gl-line);
}

.card-title a {
    color: var(--gl-cream);
}

.card-title a:hover {
    color: var(--gl-gold-bright);
}

.card-footer {
    background: rgba(0, 0, 0, .2);
    border-top-color: var(--gl-line);
    font-size: .85rem;
}

.post-preview .card-img-top {
    aspect-ratio: 16 / 9;
    object-fit: cover;
}

/* Forms */
.form-label {
    font-size: .8rem;
    font-weight: 700;
    letter-spacing: .08em;
    text-transform: uppercase;
    color: var(--gl-text-strong);
}

.form-control,
.form-select,
.input-group-text {
    background-color: var(--gl-bg-deep);
    border-color: var(--gl-line);
    color: var(--gl-text-strong);
    border-radius: 2px;
}

.form-control {
    padding: .65rem .9rem;
}

.form-control::placeholder {
    color: #6c6862;
}

.form-control:focus,
.form-select:focus {
    background-color: #100f0e;
    border-color: var(--gl-gold);
    color: #fff;
    box-shadow: 0 0 0 .2rem rgba(var(--gl-gold-rgb), .2);
}

.input-group-text {
    color: var(--gl-gold);
}

.form-check-input {
    background-color: var(--gl-bg-deep);
    border-color: #4a443b;
}

.form-check-input:checked {
    background-color: var(--gl-gold);
    border-color: var(--gl-gold);
}

.form-check-input:focus {
    border-color: var(--gl-gold);
    box-shadow: 0 0 0 .2rem rgba(var(--gl-gold-rgb), .2);
}

.form-text {
    color: var(--gl-muted);
}

/* Tables */
.table {
    --bs-table-bg: transparent;
    --bs-table-color: var(--gl-text);
    --bs-table-border-color: var(--gl-line);
    --bs-table-striped-bg: rgba(var(--gl-gold-rgb), .03);
    --bs-table-hover-bg: rgba(var(--gl-gold-rgb), .06);
    --bs-table-hover-color: var(--gl-text-strong);
}

.table > thead th {
    font-size: .72rem;
    font-weight: 700;
    letter-spacing: .14em;
    text-transform: uppercase;
    color: var(--gl-gold);
    border-bottom: 1px solid var(--gl-gold) !important;
    white-space: nowrap;
}

.table > tbody > tr {
    transition: background-color .2s ease;
}

.table > tbody > tr:hover > * {
    background-color: rgba(var(--gl-gold-rgb), .05);
}

/* Alerts */
.alert {
    --bs-alert-border-radius: 2px;
    border-width: 0 0 0 3px;
    background: var(--gl-surface-2);
    color: var(--gl-text-strong);
}

.alert-success { border-color: var(--gl-success); }
.alert-danger { border-color: var(--gl-danger); }
.alert-warning { border-color: var(--gl-gold-bright); }
.alert-info,
.alert-primary { border-color: var(--gl-gold); }

.alert i {
    margin-right: .25rem;
}

/* Badges */
.badge.bg-primary,
.text-bg-primary {
    background: var(--gl-gold-button) !important;
    color: #fff !important;
}

.badge {
    letter-spacing: .05em;
    border-radius: 2px;
}

/* Progress */
.progress,
.gl-progress {
    --bs-progress-bg: var(--gl-bg-deep);
    --bs-progress-border-radius: 0;
    --bs-progress-height: .55rem;
    border: 1px solid var(--gl-line);
}

.progress-bar {
    background: linear-gradient(90deg, #ac7d00, #eac04b, #fcf3ca);
}

/* Pagination */
.pagination {
    --bs-pagination-bg: transparent;
    --bs-pagination-color: var(--gl-text-strong);
    --bs-pagination-border-color: var(--gl-line);
    --bs-pagination-hover-bg: rgba(var(--gl-gold-rgb), .1);
    --bs-pagination-hover-color: var(--gl-gold-bright);
    --bs-pagination-hover-border-color: var(--gl-gold);
    --bs-pagination-focus-bg: rgba(var(--gl-gold-rgb), .1);
    --bs-pagination-focus-color: var(--gl-gold-bright);
    --bs-pagination-focus-box-shadow: 0 0 0 .2rem rgba(var(--gl-gold-rgb), .2);
    --bs-pagination-active-bg: var(--gl-gold);
    --bs-pagination-active-color: var(--gl-bg);
    --bs-pagination-active-border-color: var(--gl-gold);
    --bs-pagination-disabled-bg: transparent;
    --bs-pagination-disabled-color: #5a564f;
    --bs-pagination-disabled-border-color: var(--gl-line);
    --bs-pagination-border-radius: 2px;
    justify-content: center;
}

/* Nav tabs & pills */
.nav-tabs {
    --bs-nav-tabs-border-color: var(--gl-line);
    --bs-nav-tabs-link-hover-border-color: transparent transparent var(--gl-gold);
    --bs-nav-tabs-link-active-color: var(--gl-gold-bright);
    --bs-nav-tabs-link-active-bg: transparent;
    --bs-nav-tabs-link-active-border-color: transparent transparent var(--gl-gold);
}

.nav-tabs .nav-link,
.nav-pills .nav-link {
    font-size: .78rem;
    font-weight: 700;
    letter-spacing: .12em;
    text-transform: uppercase;
    color: var(--gl-text);
}

.nav-tabs .nav-link {
    border-width: 0 0 2px;
}

.nav-pills {
    --bs-nav-pills-border-radius: 2px;
    --bs-nav-pills-link-active-bg: var(--gl-gold);
    --bs-nav-pills-link-active-color: var(--gl-bg);
}

/* List groups */
.list-group {
    --bs-list-group-bg: var(--gl-surface);
    --bs-list-group-border-color: var(--gl-line);
    --bs-list-group-color: var(--gl-text);
    --bs-list-group-action-hover-bg: rgba(var(--gl-gold-rgb), .07);
    --bs-list-group-action-hover-color: var(--gl-gold-bright);
    --bs-list-group-active-bg: var(--gl-gold);
    --bs-list-group-active-border-color: var(--gl-gold);
    --bs-list-group-active-color: var(--gl-bg);
    --bs-list-group-border-radius: 2px;
}

/* Modals, tooltips, breadcrumbs */
.modal {
    --bs-modal-bg: var(--gl-surface);
    --bs-modal-border-color: var(--gl-line);
    --bs-modal-border-radius: 2px;
    --bs-modal-header-border-color: var(--gl-line);
    --bs-modal-footer-border-color: var(--gl-line);
}

.modal-content {
    border-top: 2px solid var(--gl-gold);
}

.tooltip {
    --bs-tooltip-bg: #000;
    --bs-tooltip-color: var(--gl-cream);
    --bs-tooltip-font-size: .75rem;
}

.breadcrumb {
    --bs-breadcrumb-divider-color: var(--gl-gold);
    --bs-breadcrumb-item-active-color: var(--gl-muted);
    font-size: .8rem;
    letter-spacing: .06em;
    text-transform: uppercase;
}

blockquote {
    padding: .75rem 1.25rem;
    border-left: 2px solid var(--gl-gold);
    background: rgba(var(--gl-gold-rgb), .05);
    font-style: italic;
}

code {
    color: var(--gl-gold-pale);
}

/* --------------------------------------------------------------------------
   Footer
   -------------------------------------------------------------------------- */

.gl-footer {
    position: relative;
    padding-bottom: 2.5rem;
    background: var(--gl-bg);
    font-size: .8rem;
    letter-spacing: .025em;
}

.gl-footer > .container {
    padding-top: 2.5rem;
}

.gl-back-top {
    display: inline-flex;
    flex-direction: column;
    align-items: center;
    gap: .15rem;
    margin-bottom: 2rem;
    font-size: .68rem;
    font-weight: 700;
    letter-spacing: .18em;
    text-transform: uppercase;
    color: var(--gl-muted);
}

.gl-back-top i {
    font-size: 1rem;
    color: var(--gl-gold);
    transition: transform .3s var(--gl-ease);
}

.gl-back-top:hover {
    color: var(--gl-gold-bright);
}

.gl-back-top:hover i {
    transform: translateY(-4px);
}

.gl-footer-brand {
    display: block;
    margin-bottom: 1rem;
}

.gl-footer-brand img {
    max-height: 72px;
    width: auto;
}

.gl-footer-brand span {
    font-family: var(--gl-font-display);
    font-size: 2rem;
    letter-spacing: .06em;
    background: var(--gl-metal);
    -webkit-background-clip: text;
    background-clip: text;
    color: transparent;
}

.gl-footer-tagline {
    max-width: 520px;
    margin: 0 auto 1.5rem;
    font-size: .95rem;
    color: var(--gl-text);
}

.gl-footer .gl-play {
    margin-top: .5rem;
}

.gl-socials {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: .65rem;
}

.gl-socials a {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 40px;
    height: 40px;
    font-size: 1.05rem;
    color: var(--gl-text-strong);
    border: 1px solid var(--gl-line);
    border-radius: 50%;
    transition: all .3s ease;
}

.gl-socials a:hover {
    color: var(--gl-bg);
    border-color: #fcf3ca;
    background: var(--gl-metal);
    transform: translateY(-2px);
}

.gl-footer-fine {
    padding-top: 1.5rem;
    border-top: 1px solid #221f1c;
    color: #6f6b65;
    font-size: .75rem;
}

/* --------------------------------------------------------------------------
   Motion preferences
   -------------------------------------------------------------------------- */

@media (prefers-reduced-motion: reduce) {
    html {
        scroll-behavior: auto;
    }

    *,
    *::before,
    *::after {
        animation-duration: .01ms !important;
        transition-duration: .01ms !important;
    }
}