:root {
  --navy: #07182b;
  --blue: #102b49;
  --gold: #c9a45c;
  --cream: #f3eee5;
  --paper: #fbf9f4;
  --red: #b63a31;
  --ink: #0b1927;
  --line: rgba(7, 24, 43, 0.17);
}
* {
  box-sizing: border-box;
}
html {
  scroll-behavior: smooth;
}
body {
  margin: 0;
  background: var(--paper);
  color: var(--ink);
  font:
    400 16px/1.6 "DM Sans",
    sans-serif;
}
button,
input,
select,
textarea {
  font: inherit;
}
button {
  cursor: pointer;
}
.site-header {
  height: 88px;
  padding: 0 clamp(24px, 5vw, 80px);
  display: flex;
  align-items: center;
  justify-content: space-between;
  border-bottom: 1px solid rgba(255, 255, 255, 0.15);
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  z-index: 10;
  color: white;
}
.brand {
  display: flex;
  align-items: center;
  gap: 12px;
  color: inherit;
  text-decoration: none;
}
.site-logo {
  width: 180px;
  height: 70px;
  object-fit: contain;
  object-position: left center;
  filter: drop-shadow(0 6px 12px rgba(0, 0, 0, 0.22));
}
.hero-mark img {
  width: min(620px, 48vw);
  height: auto;
  filter: drop-shadow(0 30px 45px rgba(0, 0, 0, 0.35));
}
.past-winners {
  background: var(--cream);
}
.featured-winners {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  border-top: 1px solid var(--line);
  border-left: 1px solid var(--line);
}
.featured-winners a {
  min-height: 235px;
  padding: 28px;
  border-right: 1px solid var(--line);
  border-bottom: 1px solid var(--line);
  display: flex;
  flex-direction: column;
  text-decoration: none;
  color: var(--navy);
  background: rgba(255, 255, 255, 0.35);
  transition: 0.2s;
}
.featured-winners a:hover {
  background: #fff;
  transform: translateY(-3px);
}
.featured-winners span {
  color: var(--red);
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.12em;
}
.featured-winners h3 {
  font:
    700 30px/1.05 "Playfair Display",
    serif;
  margin: 30px 0 8px;
}
.featured-winners p {
  margin: auto 0 0;
  color: #66727d;
}
.archive-link {
  display: inline-flex;
  gap: 18px;
  align-items: center;
  margin-top: 32px;
  color: var(--navy);
  font-weight: 700;
  text-decoration: none;
  border-bottom: 2px solid var(--gold);
  padding-bottom: 5px;
}
.archive-link span {
  font-size: 22px;
}
.brand > span:last-child {
  display: flex;
  flex-direction: column;
  line-height: 1;
}
.brand strong {
  font-size: 14px;
  letter-spacing: 0.18em;
}
.brand em {
  font:
    600 12px/1.5 "Playfair Display",
    serif;
  letter-spacing: 0.08em;
}
.mini-seal {
  width: 42px;
  height: 42px;
  border: 2px solid var(--gold);
  border-radius: 50%;
  display: grid;
  place-items: center;
  font:
    700 14px "Playfair Display",
    serif;
  color: var(--gold);
}
.logo-crest {
  width: 56px;
  height: 56px;
  flex: 0 0 auto;
  position: relative;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  border: 2px solid var(--gold);
  border-radius: 50%;
  background: linear-gradient(145deg, #173b61, #061526);
  box-shadow:
    inset 0 0 0 3px var(--navy),
    inset 0 0 0 4px rgba(201, 164, 92, 0.65),
    0 7px 20px rgba(0, 0, 0, 0.22);
  line-height: 1;
}
.logo-crest::before,
.logo-crest::after {
  content: "";
  position: absolute;
  top: 50%;
  width: 7px;
  height: 1px;
  background: var(--gold);
}
.logo-crest::before {
  left: 6px;
}
.logo-crest::after {
  right: 6px;
}
.logo-crest b {
  font:
    700 19px/0.9 "Playfair Display",
    serif;
  letter-spacing: -0.04em;
  color: var(--cream);
}
.logo-crest i {
  font:
    700 6px/1 "DM Sans",
    sans-serif;
  letter-spacing: 0.24em;
  color: var(--gold);
  margin: 3px 0 0 2px;
}
.logo-star {
  position: absolute;
  top: 5px;
  color: var(--gold);
  font-size: 7px;
}
.logo-type {
  display: grid !important;
  grid-template-columns: auto 1fr;
  grid-template-areas: "the best" "state state";
  align-items: end;
  column-gap: 6px;
  line-height: 0.9 !important;
}
.logo-type small {
  grid-area: the;
  color: var(--gold);
  font-size: 7px;
  font-weight: 700;
  letter-spacing: 0.22em;
  padding-bottom: 3px;
}
.logo-type strong {
  grid-area: best;
  font:
    700 20px/0.8 "DM Sans",
    sans-serif;
  letter-spacing: 0.08em;
}
.logo-type strong i {
  font:
    600 italic 14px "Playfair Display",
    serif;
  color: var(--gold);
  letter-spacing: 0;
}
.logo-type > em {
  grid-area: state;
  font:
    600 10px/1.5 "DM Sans",
    sans-serif;
  letter-spacing: 0.18em;
  color: var(--cream);
  margin-top: 5px;
}
nav {
  display: flex;
  align-items: center;
  gap: 32px;
}
nav a {
  color: white;
  text-decoration: none;
  font-size: 14px;
  font-weight: 600;
}
.menu {
  display: none;
  background: none;
  border: 1px solid rgba(255, 255, 255, 0.4);
  color: white;
  border-radius: 99px;
  padding: 8px 16px;
}
.button {
  border: 0;
  background: var(--gold);
  color: var(--navy);
  border-radius: 2px;
  padding: 15px 24px;
  font-weight: 700;
  letter-spacing: 0.02em;
  box-shadow: 0 8px 24px rgba(0, 0, 0, 0.12);
  transition:
    transform 0.2s,
    background 0.2s;
}
.button:hover {
  transform: translateY(-2px);
  background: #d8b56d;
}
.button-small {
  padding: 10px 18px;
}
.hero {
  min-height: 760px;
  background:
    radial-gradient(circle at 75% 32%, #1a4168 0, transparent 30%),
    linear-gradient(125deg, #061424 0%, #0b2541 60%, #061a2e 100%);
  color: white;
  padding: 150px clamp(24px, 7vw, 110px) 90px;
  display: grid;
  grid-template-columns: minmax(0, 1.15fr) minmax(320px, 0.85fr);
  align-items: center;
  gap: 70px;
  overflow: hidden;
}
.eyebrow {
  text-transform: uppercase;
  letter-spacing: 0.22em;
  font-size: 12px;
  font-weight: 700;
  color: var(--gold);
  margin: 0 0 18px;
}
.hero h1,
.section h2,
.final-cta h2,
.dialog-card h2,
.success h2 {
  font:
    700 clamp(48px, 6.3vw, 94px)/0.98 "Playfair Display",
    serif;
  letter-spacing: -0.035em;
  margin: 0;
}
.hero h1 i {
  color: var(--gold);
  font-weight: 600;
}
.lede {
  font-size: 19px;
  max-width: 590px;
  color: #dce4eb;
  margin: 30px 0;
}
.hero-actions {
  display: flex;
  align-items: center;
  gap: 30px;
}
.text-link {
  color: white;
  font-weight: 600;
  text-decoration: none;
  border-bottom: 1px solid rgba(255, 255, 255, 0.35);
  padding: 11px 0;
}
.dates {
  display: flex;
  gap: 0;
  margin-top: 70px;
  border-top: 1px solid rgba(255, 255, 255, 0.2);
  max-width: 650px;
}
.dates div {
  padding: 18px 28px 0 0;
  margin-right: 28px;
  border-right: 1px solid rgba(255, 255, 255, 0.2);
  display: flex;
  flex-direction: column;
}
.dates div:last-child {
  border: 0;
}
.dates b {
  font-size: 12px;
  letter-spacing: 0.12em;
  color: var(--gold);
}
.dates span {
  font-size: 13px;
  color: #c8d2dc;
}
.hero-mark {
  position: relative;
  display: grid;
  place-items: center;
  justify-self: center;
  filter: drop-shadow(0 28px 40px rgba(0, 0, 0, 0.34));
  transform: rotate(2deg);
}
.seal-ring {
  width: min(390px, 38vw);
  aspect-ratio: 1;
  border-radius: 50%;
  border: 4px solid var(--gold);
  outline: 1px solid var(--gold);
  outline-offset: -14px;
  background: linear-gradient(145deg, #102d4b, #061626);
  display: flex;
  align-items: center;
  justify-content: center;
  flex-direction: column;
  position: relative;
}
.seal-ring:after {
  content: "✦  ✦  ✦";
  position: absolute;
  bottom: 52px;
  color: var(--gold);
  letter-spacing: 0.35em;
}
.seal-ring strong {
  font:
    700 clamp(90px, 11vw, 150px)/0.8 "Playfair Display",
    serif;
  color: var(--cream);
  letter-spacing: -0.08em;
}
.seal-top,
.seal-bottom,
.seal-year {
  font-weight: 700;
  letter-spacing: 0.3em;
  color: var(--gold);
}
.seal-top {
  font-size: 18px;
}
.seal-year {
  margin-top: 10px;
}
.seal-bottom {
  font-size: 11px;
  margin-top: 35px;
}
.ribbon {
  position: absolute;
  background: var(--gold);
  color: var(--navy);
  font:
    700 17px "DM Sans",
    sans-serif;
  letter-spacing: 0.18em;
  padding: 12px 40px;
  width: 115%;
  text-align: center;
  transform: rotate(-3deg);
}
.ticker {
  background: var(--gold);
  color: var(--navy);
  display: flex;
  gap: 28px;
  align-items: center;
  justify-content: center;
  padding: 14px;
  overflow: hidden;
  text-transform: uppercase;
  letter-spacing: 0.14em;
  font-size: 12px;
  font-weight: 700;
  white-space: nowrap;
}
.ticker i {
  font-style: normal;
}
.section {
  padding: 110px clamp(24px, 7vw, 110px);
}
.section-heading {
  display: grid;
  grid-template-columns: 1.2fr 0.8fr;
  gap: 80px;
  align-items: end;
  margin-bottom: 55px;
}
.section h2,
.final-cta h2,
.dialog-card h2,
.success h2 {
  font-size: clamp(40px, 5vw, 68px);
}
.section-heading > p {
  font-size: 17px;
  color: #4e5b67;
  margin: 0;
}
.category-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  border-top: 1px solid var(--line);
  border-left: 1px solid var(--line);
}
.category-card {
  padding: 34px;
  min-height: 280px;
  border-right: 1px solid var(--line);
  border-bottom: 1px solid var(--line);
  display: flex;
  flex-direction: column;
  transition: 0.2s;
  background: rgba(255, 255, 255, 0.3);
}
.category-card:hover {
  background: white;
  transform: translateY(-4px);
  box-shadow: 0 16px 40px rgba(7, 24, 43, 0.08);
}
.category-card > span {
  color: var(--red);
  font-size: 12px;
  font-weight: 700;
  letter-spacing: 0.15em;
}
.category-card h3 {
  font:
    700 29px "Playfair Display",
    serif;
  margin: 24px 0 8px;
}
.category-card p {
  color: #596571;
  margin: 0 0 30px;
}
.category-link {
  margin-top: auto;
  border: 0;
  background: none;
  padding: 0;
  text-align: left;
  font-weight: 700;
  color: var(--navy);
}
.how {
  background: var(--navy);
  color: white;
  display: grid;
  grid-template-columns: 0.8fr 1.2fr;
  gap: 9vw;
}
.how-intro h2 {
  color: var(--cream);
}
.how-intro > p:last-child {
  color: #bcc7d1;
  font-size: 18px;
}
.steps {
  list-style: none;
  padding: 0;
  margin: 0;
}
.steps li {
  display: flex;
  gap: 25px;
  border-top: 1px solid rgba(255, 255, 255, 0.17);
  padding: 25px 0;
}
.steps li > span {
  width: 42px;
  height: 42px;
  border: 1px solid var(--gold);
  border-radius: 50%;
  display: grid;
  place-items: center;
  color: var(--gold);
  flex: 0 0 auto;
}
.steps h3 {
  margin: 0 0 4px;
  font:
    700 25px "Playfair Display",
    serif;
}
.steps p {
  margin: 0;
  color: #b7c3cd;
}
.brand-section {
  background: var(--cream);
}
.brand-panel {
  display: grid;
  grid-template-columns: 0.8fr 1.2fr;
  gap: 9vw;
  align-items: center;
}
.badge-demo {
  margin: auto;
  width: 300px;
  aspect-ratio: 1;
  border-radius: 50%;
  background: var(--navy);
  color: white;
  outline: 3px solid var(--gold);
  outline-offset: -14px;
  border: 8px solid var(--gold);
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  box-shadow: 0 28px 60px rgba(7, 24, 43, 0.22);
  transform: rotate(-4deg);
}
.badge-demo span {
  background: var(--red);
  padding: 4px 18px;
  font-weight: 700;
  letter-spacing: 0.17em;
}
.badge-demo strong {
  text-align: center;
  font:
    700 65px/0.8 "Playfair Display",
    serif;
  margin: 22px 0;
  color: var(--cream);
}
.badge-demo small {
  letter-spacing: 0.35em;
  color: var(--gold);
  font-weight: 700;
}
.brand-panel > div:last-child > p:not(.eyebrow) {
  font-size: 18px;
  color: #53606b;
}
.swatches {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 12px;
  margin-top: 30px;
}
.swatches span {
  font-size: 13px;
  font-weight: 600;
  display: flex;
  align-items: center;
  gap: 10px;
}
.swatches span:before {
  content: "";
  width: 28px;
  height: 28px;
  border-radius: 50%;
  background: var(--c);
  border: 1px solid rgba(0, 0, 0, 0.1);
}
.final-cta {
  text-align: center;
  padding: 120px 24px;
  background: var(--red);
  color: white;
}
.final-cta .eyebrow {
  color: #f0d49b;
}
.final-cta h2 {
  max-width: 850px;
  margin: 0 auto 35px;
}
footer {
  background: #04101e;
  color: #9daab6;
  padding: 45px clamp(24px, 7vw, 110px);
  display: grid;
  grid-template-columns: 1fr 1fr 1fr;
  align-items: center;
  font-size: 13px;
}
footer .brand {
  color: white;
}
footer p:nth-child(2) {
  text-align: center;
}
footer p:last-child {
  text-align: right;
}
dialog {
  border: 0;
  padding: 0;
  max-width: 620px;
  width: calc(100% - 30px);
  background: var(--paper);
  box-shadow: 0 35px 100px rgba(0, 0, 0, 0.4);
}
dialog::backdrop {
  background: rgba(2, 12, 23, 0.82);
  backdrop-filter: blur(5px);
}
.dialog-card,
.success {
  padding: 45px;
}
.dialog-card h2,
.success h2 {
  font-size: 43px;
}
.dialog-intro {
  color: #5b6671;
}
.close {
  position: absolute;
  right: 18px;
  top: 13px;
  border: 0;
  background: none;
  font-size: 30px;
  color: #66717a;
}
.dialog-card label {
  display: block;
  font-size: 13px;
  font-weight: 700;
  margin-top: 15px;
}
.dialog-card input,
.dialog-card select,
.dialog-card textarea {
  width: 100%;
  margin-top: 6px;
  padding: 11px 12px;
  border: 1px solid #c7c3bb;
  background: white;
  border-radius: 2px;
}
.submit-button {
  width: 100%;
  margin-top: 24px;
}
.success {
  text-align: center;
}
.success > span {
  width: 70px;
  height: 70px;
  border-radius: 50%;
  display: grid;
  place-items: center;
  margin: 0 auto 20px;
  background: var(--gold);
  font-size: 30px;
}
.success p {
  margin-bottom: 28px;
}
@media (max-width: 900px) {
  nav {
    display: none;
    position: absolute;
    top: 78px;
    left: 20px;
    right: 20px;
    background: var(--navy);
    padding: 25px;
    flex-direction: column;
    align-items: stretch;
    box-shadow: 0 20px 50px rgba(0, 0, 0, 0.25);
  }
  nav.open {
    display: flex;
  }
  .menu {
    display: block;
  }
  .hero {
    grid-template-columns: 1fr;
    padding-top: 135px;
  }
  .hero-mark {
    grid-row: 1;
  }
  .seal-ring {
    width: min(320px, 72vw);
  }
  .hero-copy {
    text-align: center;
  }
  .lede {
    margin-left: auto;
    margin-right: auto;
  }
  .hero-actions,
  .dates {
    justify-content: center;
  }
  .section-heading,
  .how,
  .brand-panel {
    grid-template-columns: 1fr;
    gap: 45px;
  }
  .category-grid {
    grid-template-columns: 1fr 1fr;
  }
  .featured-winners {
    grid-template-columns: 1fr 1fr;
  }
  .hero-mark img {
    width: min(650px, 88vw);
  }
  footer {
    grid-template-columns: 1fr;
    text-align: center;
    gap: 18px;
  }
  footer .brand {
    justify-content: center;
  }
  footer p:nth-child(2),
  footer p:last-child {
    text-align: center;
    margin: 0;
  }
}
@media (max-width: 600px) {
  .site-header {
    height: 76px;
  }
  .hero {
    min-height: 0;
    padding: 115px 20px 70px;
    gap: 45px;
  }
  .hero h1 {
    font-size: 49px;
  }
  .seal-ring {
    width: 270px;
  }
  .seal-ring strong {
    font-size: 98px;
  }
  .seal-bottom {
    margin-top: 25px;
  }
  .ribbon {
    font-size: 12px;
  }
  .hero-actions {
    flex-direction: column;
    gap: 12px;
  }
  .dates {
    margin-top: 45px;
    flex-direction: column;
  }
  .dates div {
    border-right: 0;
    border-bottom: 1px solid rgba(255, 255, 255, 0.15);
    padding: 12px 0;
    margin: 0;
  }
  .ticker {
    justify-content: flex-start;
  }
  .section {
    padding: 80px 20px;
  }
  .category-grid {
    grid-template-columns: 1fr;
  }
  .featured-winners {
    grid-template-columns: 1fr;
  }
  .site-logo {
    width: 145px;
    height: 58px;
  }
  .category-card {
    min-height: 240px;
  }
  .brand-panel {
    text-align: center;
  }
  .badge-demo {
    width: 250px;
  }
  .badge-demo strong {
    font-size: 52px;
  }
  .swatches {
    text-align: left;
  }
  .dialog-card,
  .success {
    padding: 35px 24px;
  }
  .dialog-card h2,
  .success h2 {
    font-size: 36px;
  }
}
/* Launch forms, informational pages, and keyboard accessibility. */
[hidden]{display:none!important}a{color:inherit}.skip-link{position:absolute;top:-100px;left:16px;z-index:100;background:white;color:#07182b;padding:12px}.skip-link:focus{top:12px}:focus-visible{outline:3px solid #b63a31;outline-offset:4px}button:disabled{opacity:.65;cursor:wait}.timeline-note{color:#dce4eb;font-size:13px;max-width:650px}.dates{flex-wrap:wrap;gap:12px}.dates div{padding-right:12px;margin-right:0;flex:1;min-width:110px}.footer-links{display:flex;gap:18px;flex-wrap:wrap;grid-column:1/-1;justify-content:center;margin-top:20px}.footer-links a{color:#f3eee5}.consent{display:flex!important;gap:8px;align-items:baseline;flex-wrap:wrap}.consent input{width:auto!important}.honeypot{position:absolute!important;left:-10000px;width:1px;height:1px;overflow:hidden}.form-status{color:#8b2922;overflow-wrap:anywhere}.page-header{padding:22px clamp(20px,5vw,80px);background:#07182b;color:#fff;display:flex;justify-content:space-between;gap:20px;flex-wrap:wrap}.page-header>a{font-weight:bold;text-decoration:none}.page-header nav{display:flex;position:static;box-shadow:none;padding:0;flex-direction:row;flex-wrap:wrap;gap:20px}.content-page{max-width:960px;margin:0 auto;padding:70px 24px 90px}.content-page h1{font-size:clamp(36px,6vw,62px);line-height:1.12}.content-page h2{font-size:28px;line-height:1.3;margin-top:40px}.content-page p,.content-page li{max-width:76ch}.content-page a:not(.button){text-decoration:underline}.inline-form{padding:24px 0;max-width:620px}.ballot-card,.admin-record{padding:22px;border:1px solid #c7c3bb;margin:18px 0;background:white;overflow-wrap:anywhere}.ballot-card h3,.admin-record h3{margin-top:0}.admin-record button{margin:8px 12px 0 0}.ballot-card label{display:block;padding:12px 0}.content-page .button{display:inline-block;margin:8px 4px 8px 0;text-decoration:none}.content-page input[type=radio]{margin-right:12px}#receipt{overflow-wrap:anywhere;font-size:13px}.dialog-card input,.dialog-card textarea,.dialog-card select{font-size:16px}.close{min-width:44px;min-height:44px}.ticker{max-width:100%}@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*{transition:none!important;animation:none!important}}@media(max-width:600px){.content-page{padding-top:40px}.page-header nav{gap:15px}.dates{gap:0}.dates div{width:100%;flex:auto}.content-page .button{max-width:100%;white-space:normal}.hero h1{font-size:clamp(36px,10vw,49px)}}