:root {
    --gold: #d7b56d;
    --gold2: #f2dda2;
    --ink: #070709;
    --panel: #111116;
    --muted: #a9a9b2;
    --white: #f8f7f3;
}

* {
    box-sizing: border-box;
    max-width: 100%;
}

html {
    scroll-behavior: smooth;
    width: 100%;
    max-width: 100%;
    overflow-x: hidden;
}

body {
    margin: 0;
    background: var(--ink);
    color: var(--white);
    font-family: Inter, system-ui, sans-serif;
    line-height: 1.7;
    width: 100%;
    max-width: 100%;
    overflow-x: hidden;
}

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

.container,
.container-fluid {
    width: 100%;
}

.container {
    max-width: 1400px;
}

h1,
h2,
h3,
h4,
h5,
.serif {
    font-family: Georgia, serif
}

 a {
     text-decoration: none
 }

 .text-gold {
     color: var(--gold)
 }

 .text-muted2 {
     color: var(--muted)
 }

 .navbar {
     background: rgba(7, 7, 9, .93);
     backdrop-filter: blur(14px);
     border-bottom: 1px solid rgba(215, 181, 109, .18)
 }

 .navbar-brand img {
     width: 205px
 }

 .navbar .nav-link {
     color: #d7d7dc !important;
     font-size: .92rem;
     padding: .75rem .8rem !important
 }

 .navbar .nav-link:hover,
 .navbar .nav-link.active {
     color: var(--gold2) !important
 }

 .btn-gold {
     background: linear-gradient(135deg, #b88935, #f1dda0, #c49a4a);
     color: #111;
     border: 0;
     font-weight: 800;
     border-radius: 50px;
     padding: .8rem 1.35rem
 }

 .btn-gold:hover {
     color: #000
 }

 .btn-outline-gold {
     border: 1px solid var(--gold);
     color: var(--gold2);
     border-radius: 50px;
     padding: .75rem 1.3rem
 }

 .btn-outline-gold:hover {
     background: var(--gold);
     color: #111
 }

 .hero {
     min-height: 50vh;
     position: relative;
     display: flex;
     align-items: center;
     overflow: hidden;
     background-size: cover;
     background-position: center;
     margin-top: var(--navbar-height, 76px);
 }

 .hero.home {
     min-height: 100vh
 }

 .hero:before {
     content: "";
     position: absolute;
     inset: 0;
     background: linear-gradient(90deg, rgba(3, 3, 5, .94), rgba(3, 3, 5, .72), rgba(3, 3, 5, .35))
 }

 .hero:after {
     content: "";
     position: absolute;
     inset: 0;
     background: linear-gradient(0deg, var(--ink), transparent 45%)
 }

 .hero-content {
     position: relative;
     z-index: 2
 }

 .eyebrow,
 .section-kicker {
     letter-spacing: .2em;
     text-transform: uppercase;
     color: var(--gold);
     font-size: .75rem;
     font-weight: 800
 }

 .hero h1 {
     font-size: clamp(2.7rem, 6vw, 6.4rem);
     line-height: 1.02;
     max-width: 950px
 }

 .hero .lead {
     font-size: clamp(1rem, 1.5vw, 1.25rem);
     color: #d6d6da;
     max-width: 760px
 }

 .section {
     padding: 100px 0
 }

 .section-sm {
     padding: 70px 0
 }

 .section-title {
     font-size: clamp(2rem, 4vw, 3.5rem);
     line-height: 1.1;
 }

 .gold-line {
     width: 70px;
     height: 2px;
     background: var(--gold);
     margin: 20px 0 30px
 }

 .panel {
     background: linear-gradient(145deg, #141419, #0d0d10);
     border: 1px solid rgba(215, 181, 109, .15);
     border-radius: 22px;
     padding: 28px;
     height: 100%;
     box-shadow: 0 18px 50px #0004;
     transition: .3s;
 }

 .panel:hover {
     border-color: #d7b56d66;
     transform: translateY(-3px)
 }

 .image-card {
     border-radius: 22px;
     overflow: hidden;
     min-height: 360px
 }

 .image-card img {
     width: 100%;
     height: 100%;
     object-fit: cover;
     display: block
 }

 .stat {
     border-left: 2px solid var(--gold);
     padding-left: 18px
 }

 .stat strong {
     display: block;
     font: 700 2.5rem Georgia;
     color: var(--gold2);
     line-height: 1
 }

 .category-card {
     display: flex;
     gap: 15px;
     align-items: flex-start;
     padding: 22px;
     border: 1px solid #ffffff14;
     background: #101014;
     border-radius: 16px;
     height: 100%
 }

 .category-card i {
     font-size: 1.35rem;
     color: var(--gold)
 }

 .category-card h5 {
     margin: 0 0 7px
 }

 .category-card ul {
     margin: 0;
     padding-left: 18px;
     color: #bdbdc5;
     font-size: .92rem
 }

 .quote {
     font: italic 1.45rem Georgia;
     color: #eee;
     border-left: 3px solid var(--gold);
     padding: 20px 25px;
     background: #101014;
     border-radius: 0 14px 14px 0
 }

 .cta {
     background: radial-gradient(circle at 70% 20%, #d7b56d2b, transparent 40%), linear-gradient(135deg, #15151a, #09090b);
     border: 1px solid #d7b56d33;
     border-radius: 28px;
     padding: 60px
 }

.cta {
    max-width: 900px;
    margin-left: auto;
    margin-right: auto;
}

 footer {
     background: #050506;
     border-top: 1px solid #d7b56d29
 }

 footer .footer-logo {
     width: 240px
 }

 .social a {
     width: 38px;
     height: 38px;
     display: inline-flex;
     align-items: center;
     justify-content: center;
     border: 1px solid #ffffff26;
     border-radius: 50%;
     color: #ddd;
     margin-right: 6px
 }

 .social a:hover {
     color: #111;
     background: var(--gold)
 }

 .page-hero {
     padding-top: 76px
 }

 .badge-gold {
     display: inline-flex;
     gap: 7px;
     border: 1px solid #d7b56d59;
     color: var(--gold2);
     padding: 7px 13px;
     border-radius: 50px;
     font-size: .78rem
 }

 .list-check {
     list-style: none;
     padding: 0
 }

 .list-check li {
     position: relative;
     padding-left: 30px;
     margin: 10px 0;
     color: #c9c9cf
 }

 .list-check li:before {
     content: "\f26e";
     font-family: "bootstrap-icons";
     position: absolute;
     left: 0;
     color: var(--gold)
 }

 @media(max-width:991px) {
     .navbar-brand img {
         width: 180px
     }

     .navbar-collapse {
         padding: 12px 0
     }

     .hero h1 {
         font-size: clamp(2.7rem, 10vw, 4.5rem)
     }

     .section {
         padding: 75px 0
     }
 }

 @media(max-width:575px) {
     .navbar-brand img {
         width: 160px
     }

     .section {
         padding: 60px 0
     }

     .image-card {
         min-height: 280px
     }
 }

.nominee-card {
    padding: 28px 22px;
    height: 100%;
    text-align: center;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    border-radius: 16px;
    transition: transform .3s ease, border-color .3s ease;
}

.nominee-card i {
    font-size: 28px;
    margin-bottom: 15px;
    display: inline-block;
}

.nominee-card h5 {
    margin: 0;
}

.nominee-card:hover {
    transform: translateY(-5px);
}