/* ==========================================================
   MOT15 INDONESIA V3
   EVENT PAGE — IMMERSIVE MOTORSPORT EXPERIENCE

   Visual reference: Event Page Approved
   Desktop + Tablet + Mobile
   ========================================================== */

/* ==========================================================
   01. PAGE FOUNDATION
   ========================================================== */

.event-page {
  background: #070707;
  color: var(--white);
}

.event-page button {
  cursor: pointer;
}

.event-page button:focus-visible,
.event-page a:focus-visible,
.event-page input:focus-visible {
  outline: 2px solid var(--gold-light);
  outline-offset: 3px;
}

.event-page .site-header {
  z-index: 1000;
}

/* ==========================================================
   02. TYPOGRAPHY
   ========================================================== */

.event-page .ev-kicker {
  display: block;

  color: var(--gold-light);

  font-family: var(--font-support);
  font-size: 13px;
  font-weight: 700;

  letter-spacing: 2.5px;
  text-transform: uppercase;
}

.event-page .ev-lined {
  display: flex;
  align-items: center;
  gap: 12px;
}

.event-page .ev-lined::before {
  content: "";

  flex: 0 0 27px;
  width: 27px;
  height: 1px;

  background: var(--gold);
}

.event-page .ev-section {
  padding: 95px 0 27px;
  scroll-margin-top: 70px;
}

.event-page .ev-heading-row {
  display: flex;
  justify-content: space-between;
  align-items: end;
  gap: 32px;

  margin: 17px 0 34px;
}

.event-page .ev-heading-row h2 {
  margin: 0;

  color: var(--white);

  font-family: var(--font-display);
  font-size: clamp(2.3rem, 4.5vw, 4rem);
  font-weight: 400;
  line-height: 1.09;

  letter-spacing: -0.035em;
  text-transform: uppercase;
}

.event-page .ev-heading-row h2 em {
  color: var(--gold);
  font-style: normal;
}

.event-page .ev-heading-row p {
  max-width: 255px;
  margin: 0;

  color: #aaa9a1;

  font-size: 14px;
  line-height: 1.75;
}

/* ==========================================================
   03. CINEMATIC EVENT HERO
   ========================================================== */

.event-page .ev-hero {
  position: relative;

  display: flex;
  align-items: center;

  min-height: max(92svh, 850px);
  height: auto;

  overflow: hidden;
  isolation: isolate;
  background: #111110;
}

.event-page .ev-hero-art {
  position: absolute;
  inset: -2%;
  z-index: -2;

  background:
    linear-gradient(
      90deg,
      rgba(0, 0, 0, 0.92) 0%,
      rgba(0, 0, 0, 0.68) 42%,
      rgba(0, 0, 0, 0.2) 88%
    ),
    linear-gradient(0deg, #070707 0%, transparent 36%),
    url("../images/hero-home.webp") center 52% / cover no-repeat;

  animation: ev-breathe 22s ease-in-out infinite alternate;
}

.event-page .ev-hero-grid {
  position: absolute;
  inset: 0;
  z-index: -1;

  pointer-events: none;
  opacity: 0.13;

  background-image:
    linear-gradient(rgba(255, 255, 255, 0.13) 1px, transparent 1px),
    linear-gradient(90deg, rgba(255, 255, 255, 0.13) 1px, transparent 1px);

  background-size: 85px 85px;

  mask-image: linear-gradient(90deg, #000, transparent 70%);
}

.event-page .ev-hero-content {
  position: relative;
  z-index: 1;

  padding-top: calc(var(--header-height) + 95px);
  padding-bottom: 160px;
}

.event-page .ev-hero h1 {
  max-width: 1080px;

  margin: 26px 0 25px;

  font-family: var(--font-display);
  font-size: clamp(3.5rem, 7vw, 7rem);
  font-weight: 400;
  line-height: 1.07;

  letter-spacing: -0.04em;
  text-transform: uppercase;

  overflow-wrap: normal;
}

.event-page .ev-hero h1 span {
  display: block;
}

.event-page .ev-hero h1 .ev-gold {
  color: var(--gold-light);
}

.event-page .ev-hero-description {
  max-width: 420px;

  margin: 0 0 31px;

  color: #d4d2cc;

  font-size: 16px;
  line-height: 1.8;
}

.event-page .ev-main-button {
  display: inline-flex;
  justify-content: space-between;
  align-items: center;
  gap: 36px;

  min-height: 54px;
  padding: 15px 22px;

  border: 1px solid var(--gold);

  background: var(--gold);
  color: #0a0a0a;

  font-family: var(--font-support);
  font-size: 15px;
  font-weight: 800;

  letter-spacing: 1.1px;

  transition:
    background 0.25s ease,
    transform 0.25s ease;
}

.event-page .ev-main-button:hover {
  background: var(--gold-light);
  transform: translateY(-3px);
}

.event-page .ev-main-button > span {
  font-size: 23px;
  line-height: 1;
}

.event-page .ev-hero-side {
  position: absolute;
  z-index: 2;

  top: 50%;
  right: 3%;

  writing-mode: vertical-rl;

  color: rgba(239, 220, 168, 0.6);

  font-family: var(--font-support);
  font-size: 12px;
  font-weight: 700;

  letter-spacing: 2.5px;
}

.event-page .ev-hero-bottom {
  position: absolute;
  right: 0;
  bottom: 27px;
  left: 0;
  z-index: 2;

  display: flex;
  align-items: center;
  justify-content: space-between;

  padding-top: 17px;

  border-top: 1px solid rgba(255, 255, 255, 0.38);
}

.event-page .ev-hero-bottom > span {
  color: #ceccc3;

  font-family: var(--font-support);
  font-size: 12px;
  font-weight: 700;

  letter-spacing: 2px;
}

.event-page .ev-hero-bottom a {
  color: var(--gold-light);
  font-size: 30px;
  line-height: 1;
}

/* ==========================================================
   04. GLOBAL EVENT PHOTO
   ========================================================== */

.event-page .ev-photo {
  position: relative;
  display: block;

  overflow: hidden;
  background: #27231c;
}

.event-page .ev-photo img {
  display: block;

  width: 100%;
  height: 100%;

  object-fit: cover;

  transition: transform 0.65s cubic-bezier(0.2, 0.7, 0.2, 1);
}

.event-page .ev-photo::after {
  content: "";

  position: absolute;
  inset: 0;

  pointer-events: none;

  background: linear-gradient(0deg, rgba(0, 0, 0, 0.88), transparent 65%);
}

.event-page button:hover .ev-photo img,
.event-page .ev-photo:hover img {
  transform: scale(1.045);
}

/* ==========================================================
   05. STATUS BADGES
   ========================================================== */

.event-page .ev-status {
  display: inline-flex;
  align-items: center;
  gap: 8px;

  padding: 9px 12px;

  border: 1px solid #ac9149;

  background: rgba(9, 9, 9, 0.8);
  color: var(--gold-light);

  font-family: var(--font-support);
  font-size: 12px;
  font-weight: 700;

  letter-spacing: 1.4px;
  text-transform: uppercase;
}

.event-page .ev-status::before {
  content: "";

  width: 7px;
  height: 7px;
  flex: 0 0 7px;

  border-radius: 50%;

  background: var(--gold);
}

.event-page .ev-status-past {
  color: #d4d2cb;
  border-color: #827b68;
}

.event-page .ev-status-past::before {
  background: #ccc9c0;
}

.event-page .ev-circle-arrow {
  display: grid;
  place-items: center;

  flex: 0 0 46px;

  width: 46px;
  height: 46px;

  border: 1px solid #fae2a5;
  border-radius: 50%;

  background: var(--gold);
  color: #0a0a0a;

  font-size: 25px;
  line-height: 1;
}

/* ==========================================================
   06. FEATURED EVENT
   ========================================================== */

.event-page .ev-featured {
  display: grid;

  grid-template-columns:
    minmax(0, 1.5fr)
    minmax(0, 0.86fr);

  gap: 15px;
  min-height: 470px;
}

.event-page .ev-featured-cover {
  position: relative;

  display: block;

  width: 100%;
  min-height: 470px;

  padding: 0;
  text-align: left;

  border: 1px solid rgba(255, 255, 255, 0.2);
  background: #27231c;
  color: #fff;

  overflow: hidden;
}

.event-page .ev-featured-cover > img {
  position: absolute;
  inset: 0;
}

.event-page .ev-featured-cover > .ev-status {
  position: absolute;
  top: 20px;
  left: 20px;
  z-index: 2;
}

.event-page .ev-featured-caption {
  position: absolute;
  right: 26px;
  bottom: 29px;
  left: 27px;
  z-index: 2;

  display: flex;
  align-items: end;
  justify-content: space-between;
  gap: 16px;
}

.event-page .ev-featured-caption small {
  display: block;
  margin-bottom: 11px;

  color: #dedad0;

  font-family: var(--font-support);
  font-size: 12px;
  font-weight: 700;

  letter-spacing: 1.3px;
}

.event-page .ev-featured-caption strong {
  display: block;

  font-family: var(--font-display);
  font-size: clamp(2rem, 3.9vw, 3.7rem);
  font-weight: 400;
  line-height: 1.07;
}

.event-page .ev-featured-side {
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  gap: 28px;

  padding: 31px;

  border: 1px solid #403625;

  background: linear-gradient(155deg, #1d1b16, #11110f);
}

.event-page .ev-featured-number {
  display: block;

  color: #72613a;

  font-family: var(--font-display);
  font-size: 42px;
}

.event-page .ev-featured-side h3 {
  margin: 17px 0 15px;

  font-family: var(--font-display);
  font-size: clamp(1.6rem, 3vw, 2.6rem);
  font-weight: 400;
  line-height: 1.12;
}

.event-page .ev-featured-side p {
  margin: 0;

  color: #b4b2a8;

  font-size: 14px;
  line-height: 1.75;
}

.event-page .ev-side-meta {
  display: grid;
  gap: 0;

  margin-bottom: 22px;
}

.event-page .ev-side-meta > div {
  display: flex;
  align-items: center;
  gap: 12px;

  padding: 14px 0;

  border-top: 1px solid rgba(255, 255, 255, 0.12);

  color: #d4d1c7;
  font-size: 14px;
}

.event-page .ev-side-meta > div > span {
  color: var(--gold);

  font-size: 19px;
  line-height: 1;
}

.event-page .ev-text-button {
  display: inline-flex;
  align-items: center;
  gap: 8px;

  padding: 0;

  border: 0;
  background: transparent;

  color: var(--gold-light);

  font-family: var(--font-support);
  font-size: 15px;
  font-weight: 800;

  letter-spacing: 1.2px;
  text-align: left;
}

.event-page .ev-text-button:hover {
  text-decoration: underline;
  text-underline-offset: 5px;
}

/* ==========================================================
   07. UPCOMING EVENTS
   ========================================================== */

.event-page .ev-upcoming {
  padding-top: 102px;
}

.event-page .ev-upcoming-grid {
  display: grid;
  grid-template-columns:
    minmax(0, 1.15fr)
    minmax(0, 0.85fr);

  grid-template-rows: repeat(2, minmax(0, 1fr));

  gap: 15px;
}

.event-page .ev-upcoming-card {
  display: flex;

  min-width: 0;
  padding: 0;

  border: 1px solid #39342a;

  background: #141310;
  color: var(--white);

  text-align: left;

  overflow: hidden;

  transition: border-color 0.25s;
}

.event-page .ev-upcoming-card:hover {
  border-color: #b79a52;
}

.event-page .ev-upcoming-primary {
  grid-row: span 2;
  display: flex;
  flex-direction: column;
}

.event-page .ev-upcoming-picture {
  flex: 0 0 41%;

  width: 41%;
  min-height: 168px;
}

.event-page .ev-upcoming-primary .ev-upcoming-picture {
  flex: none;
  width: 100%;
  height: 295px;
  min-height: 0;
}

.event-page .ev-upcoming-copy {
  display: flex;
  flex: 1;
  flex-direction: column;
  justify-content: center;
  gap: 9px;

  min-width: 0;
  padding: 20px;
}

.event-page .ev-upcoming-primary .ev-upcoming-copy {
  padding: 25px;
}

.event-page .ev-upcoming-copy small {
  color: var(--gold-light);

  font-family: var(--font-support);
  font-size: 12px;
  font-weight: 700;

  letter-spacing: 1.2px;
}

.event-page .ev-upcoming-copy strong {
  font-family: var(--font-display);
  font-size: clamp(1.2rem, 2.35vw, 2rem);
  font-weight: 400;
  line-height: 1.13;
}

.event-page .ev-upcoming-description {
  display: block;

  color: #aaa79e;

  font-size: 13px;
  line-height: 1.65;
}

.event-page .ev-upcoming-link {
  color: var(--gold-light);

  font-family: var(--font-support);
  font-size: 13px;
  font-weight: 700;

  letter-spacing: 1px;
}

/* ==========================================================
   08. EVENT ARCHIVE
   ========================================================== */

.event-page .ev-archive {
  padding-top: 110px;
  padding-bottom: 115px;
}

.event-page .ev-toolbar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  flex-wrap: wrap;
  gap: 18px;

  margin: 26px 0 30px;
}

.event-page .ev-filters {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.event-page .ev-filter {
  padding: 11px 17px;

  border: 1px solid #3c3930;

  background: #181815;
  color: #bbb9b0;

  font-family: var(--font-support);
  font-size: 13px;
  font-weight: 700;

  letter-spacing: 1px;

  transition:
    background 0.2s,
    color 0.2s,
    border-color 0.2s;
}

.event-page .ev-filter:hover,
.event-page .ev-filter.is-active {
  background: var(--gold);
  border-color: var(--gold);
  color: #080808;
}

.event-page .ev-search {
  display: flex;
  align-items: center;
  gap: 10px;

  min-width: 245px;
  padding: 10px 14px;

  border: 1px solid #423c2e;
  background: #151513;
}

.event-page .ev-search > span {
  color: var(--gold);
  font-size: 23px;
  line-height: 1;
}

.event-page .ev-search input {
  width: 100%;
  min-width: 0;

  border: 0;
  outline: 0;

  background: transparent;
  color: #fff;

  font-family: var(--font-body);
  font-size: 14px;
}

.event-page .ev-search input::placeholder {
  color: #aaa79e;
}

.event-page .ev-archive-grid {
  display: grid;

  grid-template-columns: repeat(12, minmax(0, 1fr));

  gap: 18px;
}

.event-page .ev-archive-card {
  grid-column: span 4;

  min-width: 0;
  padding: 0;

  border: 0;
  background: transparent;

  color: var(--white);
  text-align: left;
}

.event-page .ev-archive-card:nth-child(1),
.event-page .ev-archive-card:nth-child(4) {
  grid-column: span 7;
}

.event-page .ev-archive-card:nth-child(2),
.event-page .ev-archive-card:nth-child(3) {
  grid-column: span 5;
}

.event-page .ev-archive-card[hidden] {
  display: none !important;
}

.event-page .ev-archive-picture {
  height: 290px;

  border: 1px solid #333029;
}

.event-page .ev-archive-picture > img {
  position: absolute;
  inset: 0;
}

.event-page .ev-archive-picture .ev-status {
  position: absolute;
  top: 14px;
  left: 14px;
  z-index: 2;
}

.event-page .ev-archive-picture .ev-circle-arrow {
  position: absolute;
  right: 14px;
  bottom: 14px;
  z-index: 2;

  width: 40px;
  height: 40px;

  opacity: 0;
  transform: translateY(7px);

  transition:
    opacity 0.25s,
    transform 0.25s;
}

.event-page .ev-archive-card:hover .ev-circle-arrow,
.event-page .ev-archive-card:focus-visible .ev-circle-arrow {
  opacity: 1;
  transform: none;
}

.event-page .ev-archive-caption {
  display: flex;
  align-items: start;
  justify-content: space-between;
  gap: 14px;

  padding: 15px 2px 18px;

  border-bottom: 1px solid rgba(255, 255, 255, 0.16);
}

.event-page .ev-archive-caption strong {
  display: block;

  font-family: var(--font-support);
  font-size: 25px;
  font-weight: 700;
  line-height: 1.13;

  text-transform: uppercase;
}

.event-page .ev-archive-caption small {
  display: block;
  margin-top: 8px;

  color: #a19e95;

  font-size: 12px;
}

.event-page .ev-type {
  flex: none;

  padding: 7px 9px;

  border: 1px solid #756032;

  color: var(--gold-light);

  font-family: var(--font-support);
  font-size: 12px;
  font-weight: 700;

  letter-spacing: 1px;
}

.event-page .ev-empty {
  padding: 45px 20px;

  border: 1px solid #49402d;
  background: #141310;

  color: #b7b3a8;
  text-align: center;
}

.event-page .ev-empty[hidden] {
  display: none;
}

/* ==========================================================
   09. ENDING & FOOTER
   ========================================================== */

.event-page .ev-ending {
  padding: 55px 0;

  border-top: 1px solid #594722;

  background: linear-gradient(100deg, #211b0e, #0a0a09);
}

.event-page .ev-ending .site-container {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 25px;
}

.event-page .ev-ending h2 {
  margin: 0;

  font-family: var(--font-display);
  font-size: clamp(2rem, 4.1vw, 4rem);
  font-weight: 400;
  line-height: 1.12;
}

.event-page .ev-ending h2 em {
  color: var(--gold);
  font-style: normal;
}

.event-page .ev-footer {
  padding: 23px 0;
  background: #030303;
}

.event-page .ev-footer .site-container {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 14px;
}

.event-page .ev-footer span {
  color: #918d81;

  font-family: var(--font-support);
  font-size: 12px;
  font-weight: 700;

  letter-spacing: 1.2px;
}

/* ==========================================================
   10. IMMERSIVE EVENT POPUP
   ========================================================== */

.event-page.ev-modal-open {
  overflow: hidden;
}

.event-page .ev-modal {
  position: fixed;
  inset: 0;
  z-index: 2000;

  display: grid;
  place-items: center;

  padding: 22px;
}

.event-page .ev-modal[hidden] {
  display: none !important;
}

.event-page .ev-modal-backdrop {
  position: absolute;
  inset: 0;

  background: rgba(0, 0, 0, 0.91);

  backdrop-filter: blur(8px);
  -webkit-backdrop-filter: blur(8px);
}

.event-page .ev-dialog {
  position: relative;

  width: min(100%, 1050px);
  max-height: calc(100dvh - 44px);

  overflow-x: hidden;
  overflow-y: auto;
  overscroll-behavior: contain;

  border: 1px solid #856e34;

  background: #10100e;

  box-shadow: 0 30px 100px rgba(0, 0, 0, 0.9);
}

.event-page .ev-dialog-bar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 15px;

  padding: 15px 20px;

  border-bottom: 1px solid #413826;
}

.event-page .ev-dialog-bar > span {
  color: var(--gold-light);

  font-family: var(--font-support);
  font-size: 13px;
  font-weight: 700;

  letter-spacing: 2px;
}

.event-page .ev-dialog-close {
  display: grid;
  place-items: center;

  flex: 0 0 39px;

  width: 39px;
  height: 39px;
  padding: 0;

  border: 1px solid #807354;
  border-radius: 50%;

  background: transparent;
  color: #eee;

  font-size: 27px;
  line-height: 1;
}

.event-page .ev-dialog-close:hover {
  color: var(--gold-light);
  border-color: var(--gold);
}

.event-page .ev-dialog-content {
  display: grid;

  grid-template-columns:
    minmax(0, 1.04fr)
    minmax(0, 1fr);

  min-height: 460px;
}

/* LEFT — POSTER */

.event-page .ev-dialog-visual {
  position: relative;
  min-height: 470px;

  overflow: hidden;
  background: #26221b;
}

.event-page .ev-dialog-visual::after {
  content: "";

  position: absolute;
  inset: 0;

  pointer-events: none;

  background: linear-gradient(0deg, rgba(0, 0, 0, 0.65), transparent 55%);
}

.event-page .ev-dialog-visual > img {
  position: absolute;
  inset: 0;

  display: block;

  width: 100%;
  height: 100%;

  object-fit: cover;
}

.event-page .ev-dialog-visual .ev-status {
  position: absolute;
  top: 20px;
  left: 20px;
  z-index: 2;
}

.event-page .ev-dialog-visual-caption {
  position: absolute;
  bottom: 22px;
  left: 22px;
  z-index: 2;

  color: #fff;

  font-family: var(--font-support);
  font-size: 13px;
  font-weight: 700;

  letter-spacing: 1.7px;
}

/* RIGHT — EVENT INFO */

.event-page .ev-dialog-info {
  display: flex;
  flex-direction: column;
  gap: 13px;

  min-width: 0;
  padding: 28px 29px;
}

.event-page .ev-dialog-info .ev-kicker {
  font-size: 11px;
  letter-spacing: 1.6px;
}

.event-page .ev-dialog-info h2 {
  margin: 7px 0 9px;

  font-family: var(--font-display);
  font-size: clamp(1.65rem, 2.8vw, 2.8rem);
  font-weight: 400;
  line-height: 1.09;

  overflow-wrap: anywhere;
}

.event-page .ev-info-row {
  display: flex;
  align-items: start;
  gap: 12px;

  padding: 11px 0;

  border-bottom: 1px solid rgba(255, 255, 255, 0.13);
}

.event-page .ev-info-icon {
  flex: 0 0 24px;
  width: 24px;

  color: var(--gold-light);

  font-size: 20px;
  text-align: center;
}

.event-page .ev-info-row small {
  display: block;
  margin-bottom: 5px;

  color: #a9a18c;

  font-family: var(--font-support);
  font-size: 12px;
  font-weight: 700;

  letter-spacing: 1.2px;
}

.event-page .ev-info-row strong {
  display: block;

  color: #eee9dc;

  font-size: 14px;
  font-weight: 600;
  line-height: 1.5;
}

.event-page .ev-dialog-description {
  margin: 7px 0;

  color: #bcb9ad;

  font-size: 14px;
  line-height: 1.75;
}

.event-page .ev-dialog-tags {
  display: flex;
  flex-wrap: wrap;
  gap: 9px;
}

.event-page .ev-dialog-tags span {
  color: var(--gold-light);

  font-family: var(--font-support);
  font-size: 13px;
  font-weight: 700;
}

.event-page .ev-dialog-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;

  margin-top: auto;
  padding-top: 17px;
}

.event-page .ev-outline-button {
  padding: 13px 16px;

  border: 1px solid #937937;

  background: #211d14;
  color: var(--gold-light);

  font-family: var(--font-support);
  font-size: 13px;
  font-weight: 800;

  letter-spacing: 1px;

  transition: background 0.2s ease;
}

.event-page .ev-outline-button:hover {
  background: #423216;
}

/* ==========================================================
   11. SUBTLE MOTION
   ========================================================== */

@keyframes ev-breathe {
  from {
    transform: scale(1);
  }

  to {
    transform: scale(1.04);
  }
}

/* ==========================================================
   12. TABLET
   ========================================================== */

@media (max-width: 900px) {
  .event-page .ev-hero {
    min-height: max(100svh, 780px);
  }

  .event-page .ev-hero-content {
    padding-top: calc(var(--header-height) + 90px);
    padding-bottom: 145px;
  }

  .event-page .ev-hero h1 {
    font-size: clamp(3.3rem, 8.1vw, 5.4rem);
  }

  .event-page .ev-hero-side {
    display: none;
  }

  .event-page .ev-section {
    padding-top: 75px;
  }

  /* Featured */

  .event-page .ev-featured {
    grid-template-columns: 1fr;
  }

  .event-page .ev-featured-cover {
    min-height: 430px;
  }

  .event-page .ev-featured-side {
    padding: 26px;
  }

  .event-page .ev-featured-number {
    display: none;
  }

  .event-page .ev-featured-side h3 {
    margin-top: 0;
  }

  .event-page .ev-side-meta {
    grid-template-columns: 1fr 1fr;
    gap: 20px;
  }

  /* Upcoming */

  .event-page .ev-upcoming-grid {
    grid-template-columns: 1fr 1fr;
    grid-template-rows: auto;
  }

  .event-page .ev-upcoming-primary {
    grid-column: span 2;
    grid-row: auto;
  }

  .event-page .ev-upcoming-primary .ev-upcoming-picture {
    height: 330px;
  }

  .event-page .ev-upcoming-card:not(.ev-upcoming-primary) {
    flex-direction: column;
  }

  .event-page .ev-upcoming-card:not(.ev-upcoming-primary) .ev-upcoming-picture {
    width: 100%;
    height: 200px;
    min-height: 0;
    flex: none;
  }

  /* Archive */

  .event-page .ev-archive-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .event-page .ev-archive-card:nth-child(n) {
    grid-column: span 1;
  }

  .event-page .ev-archive-picture {
    height: 245px;
  }

  .event-page .ev-archive-picture .ev-circle-arrow {
    opacity: 1;
    transform: none;
  }

  /* Popup */

  .event-page .ev-dialog-content {
    grid-template-columns: 1fr;
  }

  .event-page .ev-dialog-visual {
    min-height: 340px;
    max-height: 420px;
  }

  .event-page .ev-dialog-info {
    padding: 25px;
  }
}

/* ==========================================================
   13. MOBILE
   ========================================================== */

@media (max-width: 640px) {
  /* Hero */

  .event-page .ev-hero {
    min-height: max(100svh, 700px);
    align-items: end;
  }

  .event-page .ev-hero-art {
    background:
      linear-gradient(
        0deg,
        #070707 1%,
        rgba(0, 0, 0, 0.8) 35%,
        rgba(0, 0, 0, 0.25) 83%
      ),
      url("../images/hero-home.webp") 58% center / cover no-repeat;
  }

  .event-page .ev-hero-content {
    padding-top: calc(var(--header-height) + 100px);
    padding-bottom: 155px;
  }

  .event-page .ev-hero h1 {
    font-size: clamp(2.15rem, 9vw, 3.5rem);
    line-height: 1.1;
    letter-spacing: -0.035em;
    margin: 23px 0;
  }

  .event-page .ev-kicker {
    font-size: 11px;
    letter-spacing: 1.9px;
  }

  .event-page .ev-hero-description {
    max-width: 305px;

    font-size: 14px;
    line-height: 1.75;
  }

  .event-page .ev-main-button {
    min-height: 51px;
    font-size: 14px;
  }

  .event-page .ev-hero-bottom {
    bottom: 21px;
  }

  .event-page .ev-hero-bottom > span {
    font-size: 10px;
    letter-spacing: 1.6px;
  }

  /* Section headings */

  .event-page .ev-section {
    padding-top: 70px;
  }

  .event-page .ev-heading-row {
    display: block;
  }

  .event-page .ev-heading-row h2 {
    font-size: clamp(2rem, 8vw, 3rem);
  }

  .event-page .ev-heading-row p {
    max-width: 340px;
    margin-top: 17px;
  }

  /* Featured */

  .event-page .ev-featured-cover {
    min-height: 345px;
  }

  .event-page .ev-featured-caption {
    left: 18px;
    right: 17px;
    bottom: 19px;
  }

  .event-page .ev-featured-caption strong {
    font-size: 2rem;
  }

  .event-page .ev-featured-caption small {
    font-size: 11px;
  }

  .event-page .ev-featured-cover > .ev-status {
    top: 15px;
    left: 15px;
  }

  .event-page .ev-featured-side {
    padding: 23px;
  }

  .event-page .ev-featured-side h3 {
    font-size: 1.9rem;
  }

  .event-page .ev-side-meta {
    grid-template-columns: 1fr;
    gap: 0;
  }

  /* Upcoming */

  .event-page .ev-upcoming-grid {
    grid-template-columns: 1fr;
  }

  .event-page .ev-upcoming-primary {
    grid-column: span 1;
  }

  .event-page .ev-upcoming-primary .ev-upcoming-picture {
    height: 260px;
  }

  .event-page .ev-upcoming-card:not(.ev-upcoming-primary) {
    flex-direction: row;
  }

  .event-page .ev-upcoming-card:not(.ev-upcoming-primary) .ev-upcoming-picture {
    flex: 0 0 40%;
    width: 40%;
    height: auto;
    min-height: 175px;
  }

  .event-page .ev-upcoming-copy {
    padding: 17px;
  }

  .event-page .ev-upcoming-copy strong {
    font-size: 1.25rem;
  }

  .event-page .ev-upcoming-description {
    font-size: 12px;
  }

  .event-page .ev-upcoming-link {
    font-size: 12px;
  }

  /* Archive */

  .event-page .ev-archive {
    padding-top: 80px;
    padding-bottom: 85px;
  }

  .event-page .ev-toolbar {
    display: block;
  }

  .event-page .ev-filters {
    flex-wrap: nowrap;
    overflow-x: auto;

    padding-bottom: 10px;
    scrollbar-width: thin;
  }

  .event-page .ev-filter {
    flex: none;
  }

  .event-page .ev-search {
    width: 100%;
    margin-top: 13px;
  }

  .event-page .ev-archive-grid {
    grid-template-columns: 1fr;
    gap: 28px;
  }

  .event-page .ev-archive-card:nth-child(n) {
    grid-column: span 1;
  }

  .event-page .ev-archive-picture {
    height: 285px;
  }

  .event-page .ev-archive-caption strong {
    font-size: 23px;
  }

  /* Ending */

  .event-page .ev-ending {
    padding: 42px 0;
  }

  .event-page .ev-ending .site-container {
    display: block;
  }

  .event-page .ev-ending h2 {
    font-size: 2.3rem;
    margin-bottom: 24px;
  }

  .event-page .ev-footer span {
    font-size: 10px;
    letter-spacing: 0.8px;
  }

  /* Popup */

  .event-page .ev-modal {
    padding: 9px;
  }

  .event-page .ev-dialog {
    max-height: calc(100dvh - 18px);
  }

  .event-page .ev-dialog-bar {
    padding: 11px 15px;
  }

  .event-page .ev-dialog-bar > span {
    font-size: 11px;
  }

  .event-page .ev-dialog-visual {
    min-height: 270px;
    max-height: 340px;
  }

  .event-page .ev-dialog-visual .ev-status {
    top: 14px;
    left: 14px;
  }

  .event-page .ev-dialog-info {
    padding: 20px;
    gap: 11px;
  }

  .event-page .ev-dialog-info h2 {
    font-size: 1.8rem;
  }

  .event-page .ev-info-row {
    padding: 9px 0;
  }

  .event-page .ev-dialog-description {
    font-size: 13px;
  }

  .event-page .ev-dialog-actions {
    margin-top: 10px;
  }

  .event-page .ev-outline-button {
    padding: 12px 14px;
  }
}

/* ==========================================================
   14. SMALL MOBILE
   ========================================================== */

@media (max-width: 380px) {
  .event-page .ev-hero {
    min-height: max(100svh, 670px);
  }

  .event-page .ev-hero-content {
    padding-top: calc(var(--header-height) + 80px);
    padding-bottom: 145px;
  }

  .event-page .ev-hero h1 {
    font-size: clamp(1.95rem, 8.8vw, 2.7rem);
  }

  .event-page .ev-featured-caption strong {
    font-size: 1.8rem;
  }

  .event-page .ev-upcoming-card:not(.ev-upcoming-primary) .ev-upcoming-picture {
    flex-basis: 38%;
    width: 38%;
  }

  .event-page .ev-upcoming-copy {
    padding: 13px;
  }

  .event-page .ev-upcoming-copy strong {
    font-size: 1.1rem;
  }

  .event-page .ev-archive-caption strong {
    font-size: 20px;
  }

  .event-page .ev-type {
    font-size: 10px;
  }

  .event-page .ev-dialog-visual {
    min-height: 230px;
  }

  .event-page .ev-dialog-info {
    padding: 16px;
  }

  .event-page .ev-dialog-info h2 {
    font-size: 1.5rem;
  }
}

/* ==========================================================
   15. ACCESSIBILITY & PERFORMANCE
   ========================================================== */

@media (hover: none) {
  .event-page .ev-photo img {
    transform: none !important;
  }
}

@media (prefers-reduced-motion: reduce) {
  .event-page .ev-hero-art {
    animation: none;
  }

  .event-page .ev-photo img,
  .event-page .ev-main-button,
  .event-page .ev-filter,
  .event-page .ev-outline-button,
  .event-page .ev-circle-arrow {
    transition: none !important;
  }
}


body.event-page {


&{
 --da02-night:#07090c;--da02-ink:#080b0e;--da02-panel:#171c20;
 --da02-gold:#d7b579;--da02-pale:#f1f0ed;--da02-muted:#bbc0c5;
 background:var(--da02-night);color:var(--da02-pale);
 font-family:"Barlow",Arial,sans-serif;
}
& .site-container {width:calc(100% - 36px);max-width:1280px}
& .site-header,& .site-header.is-scrolled{
 position:sticky;top:0;z-index:1000;
 background:linear-gradient(180deg,rgba(8,11,13,.96),rgba(8,11,13,.76));
 border-bottom:1px solid rgba(255,255,255,.17);box-shadow:none;
 backdrop-filter:blur(22px) saturate(135%);-webkit-backdrop-filter:blur(22px) saturate(135%);
}
& .navbar{min-height:76px;gap:12px}
& .brand{gap:9px;min-width:0}
& .brand-logo{width:38px;height:38px;object-fit:contain;flex:none}
& .brand-copy .brand-name{display:flex;flex-direction:column;gap:3px;white-space:nowrap;color:var(--da02-gold);font:800 8px/1.3 "Barlow",sans-serif;letter-spacing:2.8px}
& .brand-copy .brand-name>span{font:900 25px/.8 "Barlow Condensed",Impact,sans-serif;letter-spacing:-.5px;color:var(--da02-pale)}
& .desktop-nav{margin-left:auto;gap:12px}
& .desktop-nav .nav-link{padding:13px 5px;font:800 11px/1.2 "Barlow",sans-serif;letter-spacing:1.2px;text-transform:uppercase}
& .desktop-nav .nav-link.active{color:#dec391}
& .menu-toggle{width:88px;min-width:88px;height:42px;border:1px solid rgba(255,255,255,.28);border-radius:3px;background:rgba(255,255,255,.055);backdrop-filter:blur(14px)}
& .menu-toggle:before{top:14px;left:11px;font-size:10px}
& .mobile-menu{background:radial-gradient(ellipse at 90% 6%,rgba(183,141,79,.15),transparent 55%),rgba(8,10,13,.96);backdrop-filter:blur(28px);-webkit-backdrop-filter:blur(28px);padding:24px 21px 34px}
& .mobile-menu-top{margin-top:14px}
& .mobile-navigation{margin-top:42px}
& .mobile-navigation>a{border-bottom:1px solid rgba(255,255,255,.23);font:900 clamp(41px,12.8vw,64px)/.95 "Barlow Condensed",Impact,sans-serif;letter-spacing:-1px;padding:18px 0}
& .mobile-menu-bottom{margin-top:auto;border-top:1px solid rgba(215,181,121,.42);padding-top:15px}
& .mobile-menu .menu-close{border-radius:3px;border-color:rgba(215,181,121,.54)}
& main{background:var(--da02-night)}
& :is(.g-kicker,.ev-kicker,.c-kicker){font:800 10px/1.5 "Barlow",sans-serif;letter-spacing:1.7px;color:var(--da02-gold)}
& :is(a,button,input,textarea,select):focus-visible{outline:2px solid #f2d5a3;outline-offset:4px}
& :is(a,button){-webkit-tap-highlight-color:transparent}
& .mot-footer{background:#050608;border-top:1px solid rgba(215,181,121,.42);padding-top:44px}
& .mot-footer .site-container{max-width:1280px}
& .mot-footer-brand strong{font:900 38px/.94 "Barlow Condensed",sans-serif;letter-spacing:-.6px}
& .mot-footer-brand em{color:var(--da02-gold)}
& .mot-footer :is(.mot-footer-nav,.mot-footer-contact) h2{color:var(--da02-gold);font:800 12px/1.4 "Barlow",sans-serif;letter-spacing:1.4px}
& .mot-footer-about p{font:400 12px/1.75 "Barlow",sans-serif;color:#bdc0bc}
& .mot-footer a:hover{color:#edcd98}
@media(min-width:651px){& .site-container{width:calc(100% - 80px)}& .navbar{min-height:83px}}
@media(min-width:1001px){& .site-container{width:calc(100% - 12%)} }
@supports not (backdrop-filter:blur(1px)){& .site-header,& .site-header.is-scrolled,& .mobile-menu{background:#11171b}}
@media(prefers-reduced-motion:reduce){& *,& *:before,& *:after{animation:none!important;transition:none!important;scroll-behavior:auto!important}}

}


/* ===== DARK AUTHORITY V02 : Event / motorsport posters ===== */
.event-page .ev-hero{min-height:665px;min-height:max(665px,84svh);height:auto;max-height:none;background:#080a0e;isolation:isolate}
.event-page .ev-hero-art{inset:0;animation:none;filter:saturate(.68) grayscale(.33) contrast(1.1);background:linear-gradient(180deg,rgba(7,9,12,.21),rgba(7,9,12,.40) 40%,#07090c 98%),linear-gradient(90deg,rgba(7,9,12,.67),transparent 90%),url("../images/hero-home.webp") center 54%/cover no-repeat}
.event-page .ev-hero-grid{opacity:.12;background-size:60px 60px}
.event-page .ev-hero:before{content:"15";position:absolute;right:-.12em;top:16%;z-index:0;pointer-events:none;font:900 290px/.83 "Barlow Condensed",Impact,sans-serif;color:transparent;-webkit-text-stroke:1px rgba(231,219,195,.16);letter-spacing:-.07em;transform:rotate(-90deg)}
.event-page .ev-hero-content{position:relative;z-index:1;padding-top:192px;padding-bottom:132px}
.event-page .ev-hero h1{font:900 clamp(77px,22vw,107px)/.79 "Barlow Condensed",Impact,sans-serif;letter-spacing:-.039em;margin:25px 0 26px;max-width:100%}
.event-page .ev-hero h1 .ev-gold{color:transparent;-webkit-text-stroke:1.5px #d7b579}
.event-page .ev-hero-description{border-left:2px solid #d7b579;padding-left:13px;color:#c8c9cb;font:400 12px/1.7 "Barlow",sans-serif;max-width:320px;margin:0 0 26px}
.event-page .ev-main-button{display:inline-flex;gap:22px;min-height:52px;justify-content:space-between;background:#d7b579;border:1px solid #d7b579;color:#0c1013;transform:skew(-5deg);padding:14px 17px;font:900 11px/1.4 "Barlow",sans-serif;letter-spacing:1px}
.event-page .ev-main-button:hover{background:#e6c58e;transform:skew(-5deg) translateY(-2px)}
.event-page .ev-main-button>span{font-size:20px}
.event-page .ev-hero-side{display:none}
.event-page .ev-hero-bottom{bottom:20px;min-height:55px;border-color:rgba(255,255,255,.22);font:700 10px "Barlow",sans-serif;letter-spacing:1.2px;color:#c6c8ca}
.event-page .ev-hero-bottom a{color:#d7b579}
.event-page .ev-section{padding:77px 0 43px;scroll-margin-top:76px;background:radial-gradient(ellipse at 98% 12%,#1b2228,#080b0e 69%)}
.event-page .ev-section.ev-upcoming{background:#101418}
.event-page .ev-section.ev-archive{background:#090c10;padding-bottom:92px}
.event-page .ev-heading-row{display:block;gap:18px;margin-bottom:28px}
.event-page .ev-heading-row h2{font:900 clamp(54px,15vw,78px)/.86 "Barlow Condensed",Impact,sans-serif;letter-spacing:-.025em;margin:21px 0 20px}
.event-page .ev-heading-row h2 em{color:#c8a676}
.event-page .ev-heading-row p{font:400 12px/1.75 "Barlow",sans-serif;color:#b7bec5;max-width:390px}
.event-page .ev-featured{display:grid;grid-template-columns:1fr;gap:0;background:#171c20;border:1px solid rgba(215,181,121,.55)}
.event-page .ev-featured-cover{display:block;min-height:345px;height:345px;border:0;position:relative;overflow:hidden;background:#161c20}
.event-page .ev-featured-cover>img{width:100%;height:100%;object-fit:cover;filter:grayscale(.3) brightness(.6) contrast(1.1);transition:transform .45s ease}
.event-page .ev-featured-cover:hover>img{transform:scale(1.04)}
.event-page .ev-featured-cover:after{background:linear-gradient(180deg,transparent 15%,rgba(5,8,10,.94) 100%)}
.event-page .ev-featured-caption{z-index:2;left:17px;right:16px;bottom:18px}
.event-page .ev-featured-caption small{font:800 9px "Barlow",sans-serif;color:#dfb979;letter-spacing:1.2px}
.event-page .ev-featured-caption strong{font:900 clamp(46px,13vw,70px)/.88 "Barlow Condensed",Impact,sans-serif;letter-spacing:-.02em}
.event-page .ev-status{background:rgba(18,22,24,.61);border:1px solid rgba(226,191,135,.58);backdrop-filter:blur(14px);color:#e7c998;font:800 9px "Barlow",sans-serif;letter-spacing:.8px}
.event-page .ev-featured-side{position:relative;background:linear-gradient(140deg,#242526,#12171b);padding:24px 19px;border:0;gap:14px;min-width:0}
.event-page .ev-featured-number{font:900 95px/.88 "Barlow Condensed",sans-serif;color:transparent;-webkit-text-stroke:1px rgba(215,181,121,.64)}
.event-page .ev-featured-side h3{font:900 40px/.91 "Barlow Condensed",sans-serif}
.event-page .ev-featured-side p{font:400 12px/1.7 "Barlow",sans-serif;color:#bec2c6}
.event-page .ev-side-meta{font:700 11px/1.65 "Barlow",sans-serif}
.event-page .ev-text-button{min-height:42px;color:#d7b579;font:800 11px "Barlow",sans-serif;letter-spacing:1px}
.event-page .ev-upcoming-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
.event-page .ev-upcoming-card,.event-page .ev-upcoming-primary{min-width:0;display:flex;flex-direction:column;background:#171d21;border:1px solid rgba(215,181,121,.29);text-align:left}
.event-page .ev-upcoming-picture,.event-page .ev-upcoming-primary .ev-upcoming-picture{width:100%;height:152px;min-height:152px;flex:none}
.event-page .ev-upcoming-picture img{filter:grayscale(.3) brightness(.73)}
.event-page .ev-upcoming-copy,.event-page .ev-upcoming-primary .ev-upcoming-copy{padding:14px 12px;flex:1;min-width:0;background:transparent}
.event-page .ev-upcoming-copy small{font:800 9px "Barlow",sans-serif;letter-spacing:1px;color:#d7b579}
.event-page .ev-upcoming-copy strong{font:900 27px/.94 "Barlow Condensed",sans-serif;overflow-wrap:anywhere}
.event-page .ev-upcoming-description{font:400 11px/1.6 "Barlow",sans-serif;color:#b8bec4}
.event-page .ev-upcoming-link{font:800 10px "Barlow",sans-serif;color:#d7b579}
.event-page .ev-toolbar{display:flex;flex-direction:column;gap:13px;align-items:stretch;margin-bottom:24px}
.event-page .ev-filters{display:flex;gap:8px;overflow-x:auto;scrollbar-width:thin;padding-bottom:6px}
.event-page .ev-filter{flex:none;min-height:43px;border:1px solid rgba(211,182,131,.36);background:rgba(255,255,255,.035);font:800 10px "Barlow",sans-serif;color:#d0c5b5}
.event-page .ev-filter.is-active,.event-page .ev-filter:hover{background:#d7b579;border-color:#d7b579;color:#111315}
.event-page .ev-search{min-height:49px;width:100%;border:1px solid rgba(213,187,142,.43);background:#151a1f}
.event-page .ev-search input{font-size:16px;color:#f1f0ed}
.event-page .ev-archive-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
.event-page .ev-archive-card{min-width:0;background:#181d21;border:1px solid rgba(215,181,121,.32)}
.event-page .ev-archive-card:nth-child(n) .ev-archive-picture{height:170px;min-height:170px}
.event-page .ev-archive-picture>img{filter:grayscale(.32) brightness(.7)}
.event-page .ev-archive-caption{padding:14px 11px;gap:9px}
.event-page .ev-archive-caption strong{font:900 23px/.96 "Barlow Condensed",sans-serif;overflow-wrap:anywhere}
.event-page .ev-archive-caption small{font:500 10px "Barlow",sans-serif}
.event-page .ev-type{color:#d7b579;border-color:rgba(215,181,121,.44)}
.event-page .ev-ending{background:radial-gradient(ellipse at 80% 15%,rgba(136,104,59,.20),transparent 62%),#08090c;border-top:1px solid rgba(215,181,121,.27);padding:83px 0}
.event-page .ev-ending h2{font:900 clamp(60px,17vw,92px)/.86 "Barlow Condensed",sans-serif}
.event-page .ev-dialog{background:#11161b;border:1px solid rgba(215,181,121,.53)}
.event-page .ev-dialog-info h2{font:900 43px/.92 "Barlow Condensed",sans-serif}
.event-page .ev-dialog-visual>img{object-fit:contain;background:#07090c}
.event-page .ev-dialog-bar{background:#171c20;color:#d7b579}
@media(min-width:651px){
 .event-page .ev-hero{min-height:760px}
 .event-page .ev-hero-content{padding-block:185px 145px}
 .event-page .ev-hero h1{font-size:clamp(104px,12vw,170px)}
 .event-page .ev-hero-description{font-size:14px;max-width:450px}
 .event-page .ev-section{padding-block:108px 75px}
 .event-page .ev-heading-row h2{font-size:clamp(78px,9vw,120px)}
 .event-page .ev-featured-cover{height:455px}
 .event-page .ev-upcoming-picture,.event-page .ev-upcoming-primary .ev-upcoming-picture{height:235px;min-height:235px}
 .event-page .ev-archive-card:nth-child(n) .ev-archive-picture{height:260px}
 .event-page .ev-upcoming-copy strong{font-size:35px}
}
@media(min-width:1001px){
 .event-page .ev-hero-art{background:linear-gradient(90deg,rgba(7,9,12,.94),rgba(7,9,12,.55) 48%,rgba(7,9,12,.14)),linear-gradient(0deg,#07090ce0,transparent 65%),url("../images/hero-home.webp") center 48%/cover no-repeat}
 .event-page .ev-hero:before{transform:none;top:125px;right:0;font-size:410px}
 .event-page .ev-heading-row{display:flex;align-items:flex-end;gap:40px}
 .event-page .ev-heading-row p{font-size:14px;max-width:370px}
 .event-page .ev-featured{grid-template-columns:1.5fr 1fr}
 .event-page .ev-featured-cover{height:540px}
 .event-page .ev-featured-side{padding:34px;justify-content:space-between}
 .event-page .ev-upcoming-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}
 .event-page .ev-archive-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:18px}
 .event-page .ev-toolbar{flex-direction:row;align-items:center;justify-content:space-between}
 .event-page .ev-search{width:min(330px,100%)}
}
@media(max-width:380px){.event-page .ev-hero h1{font-size:clamp(63px,20.5vw,83px)}.event-page .ev-upcoming-copy strong{font-size:23px}}
@supports not (-webkit-text-stroke:1px white){.event-page .ev-hero h1 .ev-gold{color:#d7b579}.event-page .ev-hero:before{display:none}}
@media(prefers-reduced-motion:reduce){.event-page .ev-hero-art{animation:none}}

@media(max-width:650px){
 .event-page .ev-hero h1{font-size:clamp(59px,17vw,75px);overflow-wrap:normal}
 .event-page .ev-hero h1 span{white-space:nowrap;letter-spacing:-.045em}
}

@media(max-width:650px){
 .event-page .ev-heading-row h2,.event-page .ev-heading-row h2 em{overflow-wrap:anywhere;word-break:normal}
 .event-page .ev-toolbar,.event-page .ev-filters{min-width:0;max-width:100%;width:100%}
 .event-page .ev-filters{overflow-x:auto;overscroll-behavior-x:contain}
}

@media(max-width:650px){
 .event-page .ev-featured-caption .ev-circle-arrow{width:34px;height:34px;flex:0 0 34px;font-size:18px}
 .event-page .ev-featured-caption strong{min-width:0;overflow-wrap:anywhere}
}

@media(max-width:650px){
 .event-page .ev-featured-side h3{font-size:34px;overflow-wrap:anywhere}
}
/* V06 | Event Hero: original photo colors, 50% gold fill, one viewport */
body.event-page .ev-hero{
  min-height:0;max-height:none;
  height:calc(100svh - var(--header-height,88px) - 10px);
  height:calc(100dvh - var(--header-height,88px) - 10px);
  display:flex;align-items:center;overflow:hidden;
}
body.event-page .ev-hero-art{
  filter:none;animation:none;opacity:1;
  background:
    radial-gradient(ellipse at center,transparent 52%,rgba(7,9,12,.14) 100%),
    linear-gradient(90deg,rgba(7,9,12,.19) 0%,rgba(7,9,12,.06) 52%,rgba(7,9,12,.10) 100%),
    linear-gradient(0deg,rgba(7,9,12,.14),transparent 28%),
    url("../images/hero-home.webp") center 48%/cover no-repeat;
}
body.event-page .ev-hero-content{
  margin-block:auto;min-height:0;
  padding-top:clamp(12px,2svh,22px);
  padding-bottom:clamp(62px,9svh,78px);
}
body.event-page .ev-hero h1{
  font-size:clamp(54px,min(10vw,11svh),120px);
  line-height:.80;margin:clamp(9px,2svh,18px) 0;
  text-shadow:0 3px 17px rgba(0,0,0,.4);
}
body.event-page .ev-hero h1 .ev-gold{
  color:rgba(215,181,121,.50);
  -webkit-text-stroke:1.3px #d7b579;
}
body.event-page .ev-hero-description{
  margin-bottom:clamp(12px,2svh,20px);
  font-size:clamp(11px,1.5svh,13px);line-height:1.5;
  text-shadow:0 2px 14px rgba(0,0,0,.65);
}
body.event-page .ev-hero-bottom{bottom:9px;min-height:42px}
@media(max-width:650px){
 body.event-page .ev-hero h1{font-size:clamp(43px,min(14.5vw,9.2svh),68px);line-height:.83}
 body.event-page .ev-hero-content{padding-block:12px 64px}
 body.event-page .ev-main-button{min-height:42px;padding:9px 14px;font-size:11px}
 body.event-page .ev-hero-description{font-size:11px;max-width:min(100%,370px)}
}
@media(max-height:700px){
 body.event-page .ev-hero h1{font-size:clamp(42px,min(14.2vw,9svh),82px);margin:10px 0}
 body.event-page .ev-hero-description{margin-bottom:11px;line-height:1.4}
}

/* V07 | Text-area shadow panel + slightly brighter hero */
body.event-page .ev-hero-art{
  background:
    radial-gradient(ellipse at center,transparent 48%,rgba(7,9,12,.16) 100%),
    linear-gradient(90deg,rgba(7,9,12,.36) 0%,rgba(7,9,12,.20) 38%,rgba(7,9,12,.10) 72%,rgba(7,9,12,.08) 100%),
    linear-gradient(0deg,rgba(7,9,12,.16),transparent 26%),
    url("../images/hero-home.webp") center 44%/cover no-repeat;
}
body.event-page .ev-hero-content{position:relative;max-width:min(100%,640px);padding-inline:18px;isolation:isolate}
body.event-page .ev-hero-content::before{content:"";position:absolute;left:0;top:50%;transform:translateY(-50%);width:min(100%,620px);height:calc(100% - 10px);z-index:-1;pointer-events:none;background:linear-gradient(90deg,rgba(7,9,12,.78) 0%,rgba(7,9,12,.58) 58%,rgba(7,9,12,.16) 100%),radial-gradient(circle at 18% 28%,rgba(7,9,12,.32),transparent 62%);filter:blur(14px);border-radius:24px}
body.event-page .ev-hero h1,body.event-page .ev-hero-description,body.event-page .ev-kicker{position:relative;z-index:1}
body.event-page .ev-hero h1{color:#f2f0ea;text-shadow:0 4px 22px rgba(0,0,0,.58)}
body.event-page .ev-hero h1 .ev-gold{color:rgba(215,181,121,.54);-webkit-text-stroke:1.2px #d7b579;text-shadow:0 4px 18px rgba(0,0,0,.42)}
body.event-page .ev-hero-description{color:#e3e0d8;text-shadow:0 3px 18px rgba(0,0,0,.78)}
@media(max-width:650px){body.event-page .ev-hero-content{max-width:100%;padding-inline:14px}body.event-page .ev-hero-content::before{width:calc(100% - 4px);height:calc(100% - 8px)}body.event-page .ev-hero-art{background-position:center 42%}}


/* V08 — Restore original left-side Hero composition while keeping V07 shadow. */
body.event-page .ev-hero-content {
  width:calc(100% - 40px);
  max-width:1280px;
  padding-left:0;
  padding-right:0;
  margin-left:auto;
  margin-right:auto;
  text-align:left;
}
body.event-page .ev-hero-content::before {
  left:-9px;
  width:min(610px,calc(100vw - 38px));
  max-width:calc(100vw - 24px);
}
@media(min-width:651px) {
  body.event-page .ev-hero-content {
    width:calc(100% - 80px);
  }
}
@media(min-width:1001px) {
  body.event-page .ev-hero-content {
    width:calc(100% - 12%);
  }
}
@media(max-width:650px) {
  body.event-page .ev-hero-content {
    width:calc(100% - 40px);
    padding-left:0;
    padding-right:0;
  }
  body.event-page .ev-hero-content::before {
    left:-8px;
    width:calc(100% + 16px);
  }
}


/* ================================================================
   MOT15 PUBLIC EVENT V11 — Desktop Arsip Event uses uniform cards
   Follows the approved Gallery V10 grid.
   Scope: ONLY Event Archive cards, desktop/tablet above 900px.
   Mobile (<=900px), Featured/Upcoming, Hero and JS remain unchanged.
   ================================================================ */
@media (min-width: 901px) {
  body.event-page #eventArchiveGrid.ev-archive-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 16px;
    align-items: stretch;
  }
  body.event-page #eventArchiveGrid > .ev-archive-card:nth-child(n) {
    grid-column: auto;
    grid-row: auto;
    display: flex;
    flex-direction: column;
    align-items: stretch;
    min-width: 0;
    width: 100%;
    max-width: none;
  }
  body.event-page #eventArchiveGrid > .ev-archive-card:nth-child(n) .ev-archive-picture {
    position: relative;
    display: block;
    flex: 0 0 auto;
    min-height: 0;
    width: 100%;
    height: auto;
    aspect-ratio: 4 / 3;
    overflow: hidden;
  }
  body.event-page #eventArchiveGrid > .ev-archive-card .ev-archive-picture > img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
  }
  body.event-page #eventArchiveGrid > .ev-archive-card .ev-archive-caption {
    flex: 1 1 auto;
    min-width: 0;
    display: flex;
    gap: 8px;
    align-items: flex-start;
  }
  body.event-page #eventArchiveGrid > .ev-archive-card .ev-archive-caption > span:first-child {
    flex: 1 1 auto;
    min-width: 0;
  }
  body.event-page #eventArchiveGrid > .ev-archive-card .ev-archive-caption strong {
    font-size: clamp(21px, 2.2vw, 26px);
    line-height: 1.04;
    overflow-wrap: anywhere;
  }
  body.event-page #eventArchiveGrid > .ev-archive-card .ev-type {
    flex: 0 0 auto;
    max-width: 43%;
    min-width: 0;
    overflow-wrap: anywhere;
    white-space: normal;
    text-align: center;
  }
}
@media (min-width: 1001px) {
  body.event-page #eventArchiveGrid.ev-archive-grid {
    grid-template-columns: repeat(4, minmax(0, 1fr));
  }
}

.event-page .ev-info-row[hidden],
.event-page #eventModalNotes[hidden],
.event-page #eventModalLink[hidden] { display: none; }

/* v3.5.10: gallery/event Hero and Collaboration cards share one source path. */
body.event-page .ev-hero-art{background-image:radial-gradient(ellipse at center,transparent 48%,rgba(7,9,12,.16) 100%),linear-gradient(90deg,rgba(7,9,12,.36) 0%,rgba(7,9,12,.20) 38%,rgba(7,9,12,.10) 72%,rgba(7,9,12,.08) 100%),linear-gradient(0deg,rgba(7,9,12,.16),transparent 26%),var(--mot15-page-hero,url("../images/hero-home.webp"))}

/* Event page CMS: saved Hero has priority over legacy static background declarations. */
.event-page .ev-hero-art{background-image:linear-gradient(180deg,rgba(7,9,12,.21),rgba(7,9,12,.40) 40%,#07090c 98%),linear-gradient(90deg,rgba(7,9,12,.67),transparent 90%),var(--mot15-page-hero)!important;background-position:center,center,var(--ep-focus-x,50%) var(--ep-focus-y,54%)!important;background-size:cover,cover,cover!important;background-repeat:no-repeat!important}
@media(max-width:700px){.event-page .ev-hero-art{background-position:center,center,var(--ep-focus-mx,50%) var(--ep-focus-my,50%)!important}}