/* Event listing, detail and registration */
.events-page,
.event-detail {
    position: relative;
    min-height: 100vh;
    padding: 140px 0 100px;
    overflow: hidden;
}
.events-page > .container,
.event-detail > .container { position: relative; z-index: 1; }

.events-heading { max-width: 720px; margin-bottom: 48px; }
.events-eyebrow {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    color: var(--coral);
    font-size: .75rem;
    font-weight: 800;
    letter-spacing: 2px;
    text-transform: uppercase;
    margin-bottom: 14px;
}
.events-heading h1,
.event-intro h1,
.registration-copy h2 {
    font-family: var(--font-display);
    line-height: 1.12;
    letter-spacing: -1px;
}
.events-heading h1 { font-size: clamp(2.2rem, 6vw, 4.4rem); margin-bottom: 16px; }
.events-heading h1 span { color: var(--coral); }
.events-heading p { color: var(--text-secondary); font-size: 1.05rem; line-height: 1.8; }

.events-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 24px; }
.event-card {
    display: grid;
    grid-template-columns: 210px 1fr;
    min-height: 330px;
    color: inherit;
    background: linear-gradient(145deg, rgba(25,25,38,.96), rgba(16,16,24,.98));
    border: 1px solid var(--border);
    border-radius: var(--radius-xl);
    overflow: hidden;
    transition: transform var(--transition), border-color var(--transition), box-shadow var(--transition);
}
.event-card:hover { color: inherit; transform: translateY(-5px); border-color: var(--border-hover); box-shadow: 0 22px 60px rgba(0,0,0,.3); }
.event-card__visual { position: relative; min-height: 330px; background: var(--bg-elevated); overflow: hidden; }
.event-card__visual::after { content: ''; position: absolute; inset: 0; background: linear-gradient(90deg, transparent 60%, rgba(16,16,24,.85)); }
.event-card__visual img { width: 100%; height: 100%; object-fit: cover; transition: transform .6s ease; }
.event-card:hover .event-card__visual img { transform: scale(1.035); }
.event-card__placeholder { height: 100%; display: grid; place-items: center; color: var(--coral); font-size: 3rem; }
.event-card__date {
    position: absolute;
    z-index: 2;
    top: 16px;
    left: 16px;
    display: flex;
    flex-direction: column;
    align-items: center;
    min-width: 58px;
    padding: 8px 10px;
    color: #fff;
    background: rgba(10,10,15,.82);
    border: 1px solid rgba(255,255,255,.12);
    border-radius: 12px;
    backdrop-filter: blur(12px);
    font-size: .62rem;
    letter-spacing: .8px;
}
.event-card__date strong { font: 800 1.45rem/1 var(--font-display); }
.event-card__content { display: flex; flex-direction: column; padding: 30px 26px 26px; }
.event-card__format { color: var(--coral); font-size: .67rem; font-weight: 800; letter-spacing: 1.2px; text-transform: uppercase; }
.event-card h2 { color: var(--text-primary); font-family: var(--font-display); font-size: 1.2rem; line-height: 1.35; margin: 8px 0 4px; }
.event-card__content > p { color: var(--text-secondary); font-size: .8rem; }
.event-card ul { list-style: none; display: grid; gap: 8px; margin: 20px 0; color: var(--text-secondary); font-size: .78rem; }
.event-card li { display: flex; align-items: center; gap: 9px; }
.event-card li i { width: 14px; color: var(--coral); text-align: center; }
.event-card__cta { margin-top: auto; color: var(--text-primary); font-size: .78rem; font-weight: 700; }
.event-card__cta i { margin-left: 4px; transition: transform var(--transition); }
.event-card:hover .event-card__cta i { transform: translateX(4px); }

.events-empty { grid-column: 1/-1; text-align: center; padding: 80px 24px; background: var(--bg-card); border: 1px solid var(--border); border-radius: var(--radius-xl); }
.events-empty > i { color: var(--coral); font-size: 2rem; margin-bottom: 18px; }
.events-empty h2 { font-family: var(--font-display); font-size: 1.2rem; }
.events-empty p { color: var(--text-secondary); margin-top: 8px; }
.past-events { margin-top: 70px; }
.past-events > h2 { font: 700 1rem var(--font-display); margin-bottom: 18px; }
.past-events__list { border-top: 1px solid var(--border); }
.past-events__list a { display: grid; grid-template-columns: 130px 1fr auto; align-items: center; gap: 16px; padding: 18px 4px; color: var(--text-secondary); border-bottom: 1px solid var(--border); }
.past-events__list a:hover { color: var(--text-primary); }
.past-events__list span { font-size: .8rem; }
.past-events__list strong { font-size: .9rem; }

/* Detail */
.event-detail { padding-top: 120px; }
.event-back { display: inline-flex; align-items: center; gap: 8px; color: var(--text-secondary); font-size: .8rem; margin-bottom: 24px; }
.event-back:hover { color: var(--coral); }
.event-hero { display: grid; grid-template-columns: minmax(280px, 400px) 1fr; align-items: center; gap: clamp(40px, 7vw, 90px); }
.event-poster { position: relative; border-radius: var(--radius-xl); overflow: hidden; background: var(--bg-card); border: 1px solid rgba(255,255,255,.1); box-shadow: 0 28px 80px rgba(0,0,0,.45); aspect-ratio: 9/16; }
.event-poster::after { content: ''; position: absolute; inset: 0; border-radius: inherit; box-shadow: inset 0 0 0 1px rgba(255,255,255,.08); pointer-events: none; }
.event-poster img { width: 100%; height: 100%; display: block; object-fit: cover; }
.event-poster__placeholder { height: 100%; display: grid; place-items: center; color: var(--coral); font-size: 4rem; }
.event-intro__badges { display: flex; gap: 8px; flex-wrap: wrap; margin-bottom: 18px; }
.event-intro__badges > span { display: inline-flex; align-items: center; gap: 6px; padding: 6px 11px; border-radius: 100px; color: var(--coral); background: rgba(232,96,90,.1); border: 1px solid rgba(232,96,90,.16); font-size: .67rem; font-weight: 800; letter-spacing: .7px; text-transform: uppercase; }
.event-intro__badges .event-status--open { color: #4ade80; background: rgba(34,197,94,.1); border-color: rgba(34,197,94,.18); }
.event-status--open i { font-size: .38rem; }
.event-intro__badges .event-status--waitlist { color: #fbbf24; background: rgba(251,191,36,.1); border-color: rgba(251,191,36,.22); }
.event-intro__badges .event-status--closed { color: var(--text-secondary); background: rgba(255,255,255,.04); border-color: var(--border); }
.event-intro h1 { max-width: 800px; font-size: clamp(2.1rem, 5vw, 4.2rem); }
.event-intro__subtitle { color: var(--coral); font-weight: 700; margin-top: 12px; }
.event-intro__description { max-width: 700px; color: var(--text-secondary); line-height: 1.8; margin-top: 20px; }
.event-facts { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; margin-top: 32px; }
.event-facts > div { display: flex; align-items: center; gap: 13px; min-height: 74px; padding: 14px 16px; background: rgba(255,255,255,.025); border: 1px solid var(--border); border-radius: var(--radius-md); }
.event-facts > div > i { width: 18px; color: var(--coral); text-align: center; }
.event-facts span { min-width: 0; }
.event-facts small, .event-facts strong { display: block; }
.event-facts small { color: var(--text-muted); font-size: .62rem; font-weight: 700; letter-spacing: .8px; text-transform: uppercase; }
.event-facts strong { color: var(--text-primary); font-size: .82rem; line-height: 1.4; }
.event-facts__wide { grid-column: 1/-1; }

.registration-layout { display: grid; grid-template-columns: minmax(260px, .75fr) minmax(500px, 1.25fr); gap: clamp(36px, 7vw, 90px); align-items: start; margin-top: 110px; padding-top: 80px; border-top: 1px solid var(--border); }
.registration-copy { position: sticky; top: 120px; }
.registration-copy h2 { font-size: clamp(1.7rem, 3vw, 2.5rem); margin-bottom: 16px; }
.registration-copy > p { color: var(--text-secondary); line-height: 1.75; }
.registration-waitlist-notice { display: flex; gap: 12px; padding: 16px; margin-top: 22px; color: #fbbf24; background: rgba(251,191,36,.08); border: 1px solid rgba(251,191,36,.2); border-radius: var(--radius-md); }
.registration-waitlist-notice > i { margin-top: 3px; }
.registration-waitlist-notice strong,
.registration-waitlist-notice span { display: block; }
.registration-waitlist-notice strong { font-size: .82rem; }
.registration-waitlist-notice span { color: var(--text-secondary); font-size: .73rem; line-height: 1.55; margin-top: 4px; }
.registration-notes { display: grid; gap: 14px; margin-top: 30px; }
.registration-notes > div { display: flex; gap: 11px; color: var(--text-secondary); font-size: .82rem; }
.registration-notes i { color: var(--coral); margin-top: 4px; }
.registration-notes strong { color: var(--text-primary); }

.registration-card { background: linear-gradient(145deg, rgba(25,25,38,.98), rgba(16,16,24,.98)); border: 1px solid var(--border); border-radius: var(--radius-xl); padding: clamp(22px, 4vw, 38px); box-shadow: 0 24px 70px rgba(0,0,0,.22); }
.registration-current { display: flex; align-items: flex-start; gap: 12px; padding: 14px 16px; margin-bottom: 24px; color: #4ade80; background: rgba(34,197,94,.08); border: 1px solid rgba(34,197,94,.16); border-radius: var(--radius-md); }
.registration-current--waitlist { color: #fbbf24; background: rgba(251,191,36,.08); border-color: rgba(251,191,36,.16); }
.registration-current--cancelled { color: #f87171; background: rgba(248,113,113,.08); border-color: rgba(248,113,113,.16); }
.registration-current i { margin-top: 3px; }
.registration-current strong, .registration-current span { display: block; }
.registration-current strong { font-size: .84rem; }
.registration-current span { color: var(--text-secondary); font-size: .72rem; margin-top: 2px; }
.registration-form__grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 18px 16px; }
.registration-form__wide { grid-column: 1/-1; }
.registration-card .form__group label { color: var(--text-primary); font-size: .75rem; font-weight: 700; }
.registration-card .form__group small { color: var(--text-muted); font-size: .66rem; }
.registration-card .form__input { width: 100%; background: rgba(8,8,13,.55); }
.registration-card .form__textarea { resize: vertical; min-height: 92px; }
.form__error { display: block; color: #f87171; font-size: .69rem; line-height: 1.35; }

.ydk-upload { margin-top: 22px; padding: 16px; border: 1px dashed rgba(232,96,90,.35); border-radius: var(--radius-md); background: rgba(232,96,90,.035); }
.ydk-upload > label { display: flex; align-items: center; gap: 12px; cursor: pointer; }
.ydk-upload > label > i { display: grid; place-items: center; width: 40px; height: 40px; color: var(--coral); background: rgba(232,96,90,.1); border-radius: 10px; }
.ydk-upload strong, .ydk-upload small { display: block; }
.ydk-upload strong { color: var(--text-primary); font-size: .8rem; }
.ydk-upload small { color: var(--text-muted); font-size: .67rem; }
.ydk-upload input[type=file] { position: absolute; width: 1px; height: 1px; opacity: 0; pointer-events: none; }
.ydk-upload__name { display: block; margin: 10px 0 0 52px; color: var(--text-secondary); font-size: .68rem; overflow-wrap: anywhere; }
.ydk-current { display: inline-flex; gap: 7px; align-items: center; margin: 10px 0 0 52px; font-size: .72rem; overflow-wrap: anywhere; }
.login-decklist { display: flex; align-items: center; gap: 12px; margin-top: 22px; padding: 14px 16px; color: var(--text-secondary); background: rgba(255,255,255,.025); border: 1px solid var(--border); border-radius: var(--radius-md); font-size: .75rem; }
.login-decklist > i { color: var(--coral); }
.login-decklist strong { color: var(--text-primary); }
.privacy-check { display: flex; align-items: flex-start; gap: 10px; margin-top: 22px; color: var(--text-secondary); font-size: .7rem; line-height: 1.5; cursor: pointer; }
.privacy-check input { width: 16px; height: 16px; margin-top: 2px; accent-color: var(--coral); flex-shrink: 0; }
.registration-submit { width: 100%; justify-content: center; margin-top: 24px; }
.registration-closed { padding: 36px 16px; text-align: center; }
.registration-closed > i { color: var(--coral); font-size: 1.8rem; }
.registration-closed h3 { font-family: var(--font-display); font-size: 1.1rem; margin: 14px 0 8px; }
.registration-closed p { color: var(--text-secondary); font-size: .82rem; margin-bottom: 22px; }

@media (max-width: 1050px) {
    .events-grid { grid-template-columns: 1fr; }
    .event-card { grid-template-columns: 230px 1fr; }
    .registration-layout { grid-template-columns: 1fr; }
    .registration-copy { position: static; max-width: 650px; }
}
@media (max-width: 768px) {
    .events-page, .event-detail { padding: 105px 0 70px; }
    .events-heading { margin-bottom: 32px; }
    .event-card { grid-template-columns: 150px 1fr; min-height: 290px; border-radius: var(--radius-lg); }
    .event-card__visual { min-height: 290px; }
    .event-card__content { padding: 22px 20px; }
    .event-card__date { top: 10px; left: 10px; min-width: 50px; }
    .event-hero { grid-template-columns: minmax(180px, 280px) 1fr; gap: 28px; align-items: start; }
    .event-intro h1 { font-size: clamp(1.6rem, 5vw, 2.6rem); }
    .event-facts { grid-template-columns: 1fr; margin-top: 24px; }
    .event-facts__wide { grid-column: auto; }
    .registration-layout { margin-top: 70px; padding-top: 55px; }
}
@media (max-width: 600px) {
    .event-card { grid-template-columns: 120px 1fr; min-height: 265px; }
    .event-card__visual { min-height: 265px; }
    .event-card__content { padding: 18px 16px; }
    .event-card h2 { font-size: .92rem; }
    .event-card ul { margin: 14px 0; gap: 5px; }
    .event-card__content > p { display: none; }
    .event-card__date { min-width: 44px; padding: 7px; }
    .event-card__date strong { font-size: 1.1rem; }
    .past-events__list a { grid-template-columns: 90px 1fr auto; gap: 10px; }
    .event-hero { grid-template-columns: 1fr; }
    .event-poster { width: min(100%, 330px); margin: 0 auto; }
    .event-intro { padding-top: 10px; }
    .event-intro h1 { font-size: 2rem; }
    .event-facts { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .event-facts__wide { grid-column: 1/-1; }
    .registration-form__grid { grid-template-columns: 1fr; }
    .registration-form__wide { grid-column: auto; }
    .registration-card { border-radius: var(--radius-lg); }
}
@media (max-width: 400px) {
    .event-card { grid-template-columns: 105px 1fr; }
    .event-card__content { padding: 16px 12px; }
    .event-card ul { font-size: .68rem; }
    .event-card__cta { font-size: .68rem; }
    .event-facts { grid-template-columns: 1fr; }
    .event-facts__wide { grid-column: auto; }
}
