/* Make Yur Mark: a mobile-first wall of paint, paper and lettering. */
.event-theme-mark {
  --mark-ink: #141613;
  --mark-paper: #f0efe6;
  --mark-acid: #dcff48;
  --mark-coral: #ff624b;
  background: var(--mark-ink);
  color: var(--mark-paper);
}
.event-theme-mark .archive-header { position: relative; z-index: 10; padding: 18px 24px; align-items: center; background: #141613; border-bottom: 1px solid #ffffff26; }
.event-theme-mark .archive-header .logo { width: 65px; }
.event-theme-mark .nav-link span { color: var(--mark-acid); }
.event-theme-mark main { overflow: clip; }
.event-theme-mark a { color: inherit; text-decoration: none; }
.event-theme-mark a:focus-visible, .event-theme-mark button:focus-visible, .event-theme-mark select:focus-visible { outline: 3px solid var(--mark-coral); outline-offset: 5px; }
.mark-hero { padding: 24px 22px 32px; background: var(--mark-paper) url('images/make-yur-mark-wall.svg') center / cover; color: var(--mark-ink); }
.mark-hero-top { display: flex; justify-content: space-between; gap: 18px; max-width: 1380px; margin: auto; font: 10px/1.6 'DM Mono', monospace; text-transform: uppercase; }
.mark-hero-top a { padding-block: 10px; }
.mark-hero-top > span { max-width: 155px; text-align: right; color: #51564b; }
.mark-hero-grid { display: grid; gap: 64px; max-width: 1380px; margin: 34px auto 42px; }
.mark-hero-copy { min-width: 0; }
.mark-eyebrow { display: flex; gap: 9px; align-items: center; font: 500 10px/1.6 'DM Mono', monospace; letter-spacing: .11em; text-transform: uppercase; }
.mark-eyebrow > span { width: 7px; height: 7px; background: currentColor; border-radius: 50%; }
.mark-word-art { position: relative; margin: 30px 0 28px; padding-bottom: 12px; }
.mark-word-art h1 { position: relative; z-index: 1; margin: 0; padding: 0 5px; width: fit-content; max-width: 100%; font: 400 clamp(77px, 23vw, 162px)/.88 Impact, 'Arial Black', Manrope, sans-serif; letter-spacing: -.025em; transform: rotate(-4deg); text-transform: uppercase; }
.mark-word-art h1 > span { display: block; }
.mark-title-middle { display: flex !important; align-items: center; gap: 18px; margin: 6px 0 7px; }
.mark-title-middle i { display: block; padding: 3px 17px 10px 8px; background: var(--mark-acid); color: var(--mark-ink); font: inherit; transform: rotate(2deg) skewX(-7deg); box-shadow: 5px 5px 0 var(--mark-ink); }
.mark-title-middle b { color: var(--mark-coral); font: 400 .8em/1 Georgia, serif; transform: rotate(10deg); }
.mark-title-last { -webkit-text-stroke: 1px var(--mark-ink); text-shadow: 4px 4px 0 var(--mark-paper), 6px 6px 0 var(--mark-ink); }
.mark-title-last > span { color: var(--mark-coral); text-shadow: none; -webkit-text-stroke: 0; }
.mark-scribble { position: absolute; top: 7%; right: -4px; z-index: 2; font: italic 600 clamp(12px, 3.7vw, 22px)/1.1 Georgia, serif; transform: rotate(12deg); }
.mark-date-tag { position: relative; z-index: 2; display: inline-block; margin: 32px 0 0 10px; padding: 8px 14px; background: var(--mark-coral); font: 700 11px/1.4 'DM Mono', monospace; box-shadow: 3px 3px 0 var(--mark-ink); text-transform: uppercase; transform: rotate(-3deg); }
.mark-lede { max-width: 460px; font-size: 15px; font-weight: 500; line-height: 1.65; }
.mark-hero-links { display: flex; flex-wrap: wrap; align-items: center; gap: 14px 24px; margin-top: 26px; }
.event-theme-mark .mark-main-link { display: inline-flex; min-height: 49px; justify-content: space-between; align-items: center; gap: 20px; padding: 14px 20px; background: var(--mark-ink); color: var(--mark-paper); font: 500 11px/1.5 'DM Mono', monospace; text-transform: uppercase; transition: background .18s, color .18s; }
.mark-main-link span { font-size: 22px; line-height: 1; }
.event-theme-mark .mark-main-link:hover { background: var(--mark-coral); color: var(--mark-ink); }
.mark-hero-links > a:last-child { display: inline-flex; align-items: center; min-height: 44px; gap: 18px; font: 500 11px 'DM Mono', monospace; }
.mark-ticket { position: relative; scroll-margin-top: 25px; align-self: center; min-width: 0; background: var(--mark-ink); color: var(--mark-paper); box-shadow: 10px 10px 0 #14161323; }
.mark-ticket-top { display: flex; justify-content: space-between; align-items: center; gap: 12px; padding: 14px 20px; background: var(--mark-acid); color: var(--mark-ink); font: 500 9px/1.5 'DM Mono', monospace; letter-spacing: .05em; }
.mark-ticket-top > span:last-child { font: 25px/1 Manrope, sans-serif; }
.mark-ticket-heading { padding: 26px 24px; }
.mark-ticket-heading .mark-eyebrow { color: #b4b9aa; font-size: 9px; }
.mark-ticket h2 { margin: 16px 0 20px; color: var(--mark-paper); font: 400 43px/.97 Impact, 'Arial Black', sans-serif; letter-spacing: -.01em; }
.mark-ticket h2 em { color: var(--mark-acid); font: inherit; }
.mark-sales-state { display: inline-flex; align-items: center; gap: 8px; font: 10px 'DM Mono', monospace; text-transform: uppercase; }
.mark-sales-state i { width: 6px; height: 6px; border-radius: 50%; background: var(--mark-acid); }
.mark-ticket-facts { display: grid; gap: 17px; margin: 0 24px; padding: 20px 0; border-top: 1px solid #ffffff2b; border-bottom: 1px dashed #ffffff4a; }
.mark-ticket-facts > div { display: grid; grid-template-columns: 42px minmax(0,1fr); gap: 16px; }
.mark-ticket dt { color: #b4b9aa; font: 9px/1.8 'DM Mono', monospace; text-transform: uppercase; }
.mark-ticket dd { margin: 0; font: 600 13px/1.5 Manrope, sans-serif; }
.mark-ticket dd small { display: block; margin-top: 3px; color: #b4b9aa; font-size: 11px; font-weight: 400; }
.mark-ticket-purchase { display: grid; grid-template-columns: minmax(0,1fr) 73px; gap: 19px 12px; padding: 24px; }
.mark-price { display: grid; align-content: center; gap: 6px; }
.mark-price > span, .mark-quantity { font: 9px/1.5 'DM Mono', monospace; text-transform: uppercase; color: #b4b9aa; }
.mark-price strong { color: var(--mark-paper); font: 700 20px/1.3 Manrope, sans-serif; letter-spacing: -.05em; }
.mark-quantity { display: grid; gap: 6px; }
.mark-quantity select { min-width: 0; width: 100%; min-height: 44px; border: 1px solid #ffffff4d; border-radius: 0; padding: 8px; background: var(--mark-ink); color: var(--mark-paper); font: 16px Manrope, sans-serif; }
.mark-quantity select:disabled { opacity: .5; }
.mark-buy { display: flex; justify-content: space-between; align-items: center; gap: 14px; grid-column: 1/-1; padding: 17px 15px; min-height: 54px; border: 0; background: var(--mark-acid); color: var(--mark-ink); font: 700 11px/1.6 'DM Mono', monospace; text-transform: uppercase; cursor: pointer; text-align: left; }
.mark-buy > span { font-size: 23px; line-height: 1; }
.mark-buy:hover:enabled { background: var(--mark-paper); }
.mark-buy:disabled { cursor: not-allowed; background: #c8d69b; color: #262b1d; }
.mark-ticket-note, .mark-inventory, .mark-checkout-message { grid-column: 1/-1; color: #c0c5b8; font-size: 11px; line-height: 1.6; }
.mark-inventory { color: var(--mark-acid); }
.mark-checkout-message { color: #ffbcaf; }
.mark-checkout-message:empty { display: none; }
.mark-ticket-stub { position: relative; display: flex; gap: 16px; align-items: center; justify-content: space-between; padding: 24px; border-top: 1px dashed #ffffff4a; }
.mark-ticket-stub::before, .mark-ticket-stub::after { content: ''; position: absolute; top: -10px; width: 18px; height: 18px; background: var(--mark-paper); border-radius: 50%; }
.mark-ticket-stub::before { left: -9px; }.mark-ticket-stub::after { right: -9px; }
.mark-ticket-stub > span:last-child { max-width: 150px; font: 8px/1.7 'DM Mono', monospace; text-align: right; color: #bec4b4; }
.mark-barcode { display: block; flex: 0 0 68px; height: 33px; background: repeating-linear-gradient(90deg,var(--mark-paper) 0 2px,transparent 2px 5px,var(--mark-paper) 5px 6px,transparent 6px 9px,var(--mark-paper) 9px 13px,transparent 13px 15px); opacity: .7; }
.mark-hero-foot { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 10px; max-width: 1380px; margin: auto; padding-top: 25px; border-top: 1px solid #14161342; font: 9px/1.5 'DM Mono', monospace; text-transform: uppercase; }
.mark-tape { position: relative; display: flex; align-items: center; justify-content: center; gap: 26px; padding: 17px 0; overflow: hidden; background: var(--mark-acid); color: var(--mark-ink); font: 400 20px/1 Impact, 'Arial Black', sans-serif; white-space: nowrap; }
.mark-tape b { font: 26px/1 Georgia, serif; }
.mark-lineup { max-width: 1540px; margin: auto; padding: 65px 24px 48px; background: var(--mark-ink); }
.mark-section-heading { display: flex; gap: 22px; align-items: center; justify-content: space-between; margin-bottom: 35px; }
.mark-lineup .mark-eyebrow { color: #aeb4a3; font-size: 9px; }
.mark-section-heading h2 { margin-top: 18px; font: 400 clamp(48px, 12vw, 100px)/.95 Impact, 'Arial Black', sans-serif; letter-spacing: -.01em; }
.mark-section-heading h2 em { font: inherit; color: var(--mark-acid); }
.mark-handwritten { display: none; color: var(--mark-acid); font: italic 25px/1.2 Georgia, serif; transform: rotate(-8deg); }
.mark-artists { display: grid; padding: 0; margin: 0; list-style: none; border-top: 1px solid #ffffff30; }
.mark-artists li { position: relative; display: flex; align-items: center; min-width: 0; gap: 16px; padding: 21px 0; border-bottom: 1px solid #ffffff30; }
.mark-artists .artist-number { min-width: 18px; align-self: flex-start; padding-top: 5px; color: #969d8d; font: 9px 'DM Mono', monospace; }
.mark-artists .artist-name, .mark-artists .artist-link { min-width: 0; color: var(--mark-paper); font: 400 clamp(32px, 8.5vw, 60px)/1.08 Impact, 'Arial Black', sans-serif; letter-spacing: 0; text-transform: uppercase; overflow-wrap: anywhere; }
.mark-artists .artist-link { display: flex; align-items: center; justify-content: space-between; flex: 1; gap: 15px; }
.mark-artists .artist-arrow { font: 25px Manrope, sans-serif; color: var(--mark-acid); }
.mark-artists li:nth-child(3n + 2) .artist-name, .mark-artists li:nth-child(3n + 2) .artist-link { color: var(--mark-acid); }
.mark-artists li:last-child .artist-name, .mark-artists li:last-child .artist-link { color: var(--mark-coral); }
.mark-lineup-foot { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 16px; margin-top: 27px; color: #aeb4a3; font: 10px/1.8 'DM Mono', monospace; }
.mark-lineup-foot > span { color: #797f72; font-size: 8px; }
.mark-story { display: grid; gap: 60px; padding: 65px 24px 85px; background: var(--mark-paper); color: var(--mark-ink); }
.mark-story-copy { min-width: 0; }
.mark-story h2 { margin: 24px 0; font: 400 clamp(60px, 17vw, 105px)/.95 Impact, 'Arial Black', sans-serif; letter-spacing: -.015em; }
.mark-story h2 em { display: inline-block; padding: 0 8px 3px 0; color: var(--mark-ink); background: var(--mark-acid); font-family: Manrope, Arial, sans-serif; font-size: inherit; font-style: normal; font-weight: 800; line-height: .95; letter-spacing: -.065em; transform: rotate(-3deg); }
.mark-story-copy > p:not(.mark-eyebrow) { max-width: 460px; font-size: 14px; line-height: 1.85; }
.mark-story .mark-main-link { margin-top: 26px; }
.mark-support { display: block; width: fit-content; margin-top: 18px; min-height: 44px; padding-block: 12px; font: 10px 'DM Mono', monospace; }
.mark-poster { position: relative; width: min(100% - 12px, 410px); margin: 0 auto; padding: 10px; align-self: center; background: #fff; color: var(--mark-ink); box-shadow: 11px 15px 0 #1416131c; transform: rotate(3deg); }
.mark-poster img { display: block; width: 100%; height: auto; aspect-ratio: 4/5; object-fit: contain; background: var(--mark-ink); }
.mark-poster figcaption { padding: 12px 2px 3px; font: 8px 'DM Mono', monospace; text-transform: uppercase; }
.mark-poster-tape { position: absolute; z-index: 1; width: 100px; height: 30px; left: calc(50% - 50px); top: -13px; background: #ff624bd6; clip-path: polygon(3% 0,100% 5%,96% 21%,100% 36%,95% 51%,99% 72%,96% 100%,0 96%,3% 80%,0 62%,5% 36%); transform: rotate(-6deg); }
.event-theme-mark .mark-footer { display: flex; flex-wrap: wrap; gap: 28px; align-items: center; justify-content: space-between; padding: 35px 24px; background: var(--mark-ink); }
.mark-footer .logo { width: 70px; }
.mark-footer nav { display: flex; flex-wrap: wrap; gap: 12px 20px; font: 10px 'DM Mono', monospace; }
.mark-footer nav a { display: inline-flex; align-items: center; min-height: 44px; }
.mark-footer > p { font: 9px 'DM Mono', monospace; color: #aeb4a3; }
.event-card-mark .event-card-poster { box-shadow: 15px 15px 0 #dcff48; background: #141613; }
.event-card-mark .event-date-block, .event-card-mark .poster-stamp, .event-card-mark .ticket-button { background: #dcff48; color: #141613; }
.event-card-mark:hover h2 { color: #dcff48; }
@media (min-width: 701px) {
  .mark-hero { padding: 30px 5vw 35px; }
  .mark-hero-top > span { max-width: none; }
  .mark-hero-grid { grid-template-columns: minmax(0, 1fr) minmax(275px, .68fr); gap: 45px; margin-top: 45px; }
  .mark-word-art h1 { font-size: clamp(100px, 15.5vw, 215px); }
  .mark-scribble { top: 1%; right: -7px; font-size: 17px; }
  .mark-ticket { transform: rotate(1deg); }
  .mark-ticket-heading { padding: 26px 24px 20px; }
  .mark-lineup { padding: 85px 5vw 55px; }
  .mark-artists { grid-template-columns: repeat(2,minmax(0,1fr)); column-gap: 45px; }
  .mark-artists li { padding-block: 28px; }
  .mark-artists .artist-name, .mark-artists .artist-link { font-size: clamp(35px, 5.3vw, 78px); }
  .mark-handwritten { display: block; }
  .mark-story { grid-template-columns: minmax(0,1fr) minmax(0,.8fr); align-items: center; gap: 70px; padding: 100px 8vw; }
  .mark-story h2 { font-size: clamp(60px, 9.3vw, 132px); }
  .event-theme-mark .mark-footer { padding-inline: 5vw; }
}
@media (min-width: 701px) and (max-width: 1099px) {
  .mark-word-art { margin-top: 58px; }
  .mark-scribble {
    top: -38px;
    right: 6px;
    width: 210px;
    max-width: 46%;
    font-size: clamp(13px, 1.8vw, 17px);
    line-height: 1.05;
    text-align: right;
    transform: rotate(7deg);
  }
}
@media (min-width: 1100px) {
  .mark-hero-grid { grid-template-columns: minmax(0,1fr) 355px; gap: 8vw; margin-top: 55px; margin-bottom: 60px; }
  .mark-hero-copy > .mark-eyebrow { font-size: 11px; }
  .mark-word-art { margin-top: 35px; }
  .mark-word-art h1 { font-size: clamp(155px, 15vw, 226px); }
  .mark-scribble { top: 11%; right: 1%; font-size: 25px; }
  .mark-date-tag { position: absolute; left: auto; right: 0; bottom: 5px; margin: 0; transform: rotate(5deg); }
  .mark-lede { max-width: 430px; margin-top: 40px; font-size: 16px; }
  .mark-ticket h2 { font-size: 50px; }
  .mark-tape { gap: 48px; font-size: 30px; }
}
@media (prefers-reduced-motion: no-preference) {
  .mark-hero-copy { animation: mark-arrive .55s ease-out both; }
  .mark-ticket { animation: mark-arrive .7s ease-out both; }
  @keyframes mark-arrive { from { opacity: 0; translate: 0 14px; } to { opacity: 1; translate: 0 0; } }
}
@media (prefers-reduced-motion: reduce) { .mark-main-link { transition: none; } }