.events-page { padding: clamp(62px, 8vw, 110px) 0 100px; background: var(--ivory); }
.events-page > .container { width: min(calc(100% - 48px), 1380px); }
.events-page__hero { display: flex; justify-content: space-between; align-items: end; gap: 36px; margin-bottom: 42px; padding-bottom: 32px; border-bottom: 1px solid var(--line); }
.events-page__hero h1 { max-width: 780px; margin: 0 0 16px; color: var(--charcoal-deep); font-family: var(--serif); font-size: clamp(3rem, 6vw, 6.4rem); font-weight: 500; line-height: .92; }
.events-page__hero p:last-child { max-width: 650px; margin: 0; color: var(--muted); font-size: 1.05rem; line-height: 1.55; }
.events-page__stats { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; margin-bottom: 26px; }
.events-page__stats > div { display: flex; min-height: 112px; padding: 20px 22px; flex-direction: column; justify-content: space-between; background: var(--orange-soft); border: 1px solid rgba(232,91,36,.24); border-radius: 18px; }
.events-page__stats strong { color: var(--charcoal-deep); font-family: var(--serif); font-size: 2.5rem; font-weight: 500; line-height: 1; }
.events-page__stats span { color: var(--orange-dark); font-size: .72rem; font-weight: 900; letter-spacing: .06em; text-transform: uppercase; }
.events-page__workspace { padding: 22px; background: var(--charcoal-deep); border-radius: 24px; box-shadow: var(--shadow-small); }
.events-page__toolbar { display: grid; grid-template-columns: minmax(220px, 1.6fr) repeat(2, minmax(150px, .75fr)) auto; gap: 12px; align-items: end; }
.events-page__toolbar label { display: grid; gap: 7px; color: var(--orange-light); font-size: .68rem; font-weight: 900; letter-spacing: .07em; text-transform: uppercase; }
.events-page__toolbar input, .events-page__toolbar select { min-height: 44px; padding: 0 13px; color: var(--charcoal-deep); background: var(--paper); border: 1px solid transparent; border-radius: 10px; font: inherit; font-size: .86rem; letter-spacing: normal; text-transform: none; }
.events-page__toolbar input:focus, .events-page__toolbar select:focus { border-color: var(--orange-light); outline: 3px solid rgba(242,174,86,.24); }
.events-page__toolbar .quiet-link { min-height: 44px; padding: 0 8px; color: var(--orange-light); background: transparent; border: 0; cursor: pointer; font: inherit; font-size: .72rem; font-weight: 900; white-space: nowrap; }
.events-page__result { margin: 23px 0 12px; color: var(--white); font-size: .8rem; font-weight: 800; }
.events-page__grid { display: grid; gap: 8px; }
.event-card { display: grid; grid-template-columns: 132px minmax(0, 1fr) 170px; gap: 20px; align-items: center; padding: 14px 18px; background: var(--paper); border: 0; border-left: 4px solid transparent; border-radius: 10px; box-shadow: none; transition: background-color 160ms ease, border-color 160ms ease; }
.event-card:hover, .event-card:focus-within { background: #fff; border-left-color: var(--orange); }
.event-card__date { display: grid; grid-template-columns: 38px 1fr; grid-template-rows: auto auto; column-gap: 9px; align-items: center; color: var(--charcoal-deep); }
.event-card__date span { grid-row: 1 / 3; color: var(--orange-dark); font-size: .66rem; font-weight: 900; letter-spacing: .1em; text-transform: uppercase; writing-mode: vertical-rl; transform: rotate(180deg); }
.event-card__date strong { font-family: var(--serif); font-size: 2.3rem; font-weight: 500; line-height: .85; }
.event-card__date small { color: var(--muted); font-size: .61rem; font-weight: 800; line-height: 1.1; }
.event-card__content { min-width: 0; padding-left: 18px; border-left: 1px solid var(--line); }
.event-card__tag { display: block; max-width: 100%; overflow: hidden; color: var(--orange-dark); font-size: .57rem; font-weight: 900; letter-spacing: .08em; text-overflow: ellipsis; text-transform: uppercase; white-space: nowrap; }
.event-card h2 { margin: 5px 0 0; color: var(--charcoal-deep); font-family: var(--serif); font-size: clamp(1.1rem, 1.7vw, 1.45rem); font-weight: 500; line-height: 1.08; }
.event-card p { display: -webkit-box; max-width: 72ch; margin: 5px 0 0; overflow: hidden; color: var(--muted); font-size: .72rem; line-height: 1.35; -webkit-box-orient: vertical; -webkit-line-clamp: 2; }
.event-card__schedule { display: flex; min-height: 54px; padding-left: 18px; flex-direction: column; justify-content: center; border-left: 1px solid var(--line); }
.event-card__schedule > span { color: var(--muted); font-size: .56rem; font-weight: 900; letter-spacing: .08em; text-transform: uppercase; }
.event-card__schedule strong { margin-top: 4px; color: var(--charcoal-deep); font-size: .75rem; line-height: 1.2; }
.event-card a { display: inline-flex; margin-top: 6px; align-items: center; gap: 5px; color: var(--orange-dark); font-size: .65rem; font-weight: 900; text-decoration: none; }
.event-card a:hover, .event-card a:focus-visible { text-decoration: underline; }
.events-page__empty { padding: 48px 20px; color: var(--white); text-align: center; }
.events-page__empty strong, .events-page__empty span { display: block; }
.events-page__empty strong { font-family: var(--serif); font-size: 1.7rem; font-weight: 500; }
.events-page__empty span { margin-top: 8px; color: rgba(255,255,255,.7); font-size: .85rem; }
@media (max-width: 900px) { .events-page__toolbar { grid-template-columns: repeat(2, minmax(0, 1fr)); } .events-page__toolbar .events-page__search { grid-column: 1 / -1; } .events-page__toolbar .quiet-link { justify-self: start; } .event-card { grid-template-columns: 110px minmax(0, 1fr) 145px; gap: 14px; } .event-card__content { padding-left: 12px; } .event-card__schedule { padding-left: 12px; } }
@media (max-width: 620px) { .events-page { padding-top: 42px; } .events-page > .container { width: min(calc(100% - 20px), 1380px); } .events-page__hero { align-items: start; flex-direction: column; } .events-page__hero h1 { font-size: clamp(2.9rem, 15vw, 4.5rem); } .events-page__stats { grid-template-columns: 1fr; } .events-page__workspace { padding: 14px; border-radius: 18px; } .events-page__toolbar { grid-template-columns: 1fr; } .events-page__toolbar .events-page__search { grid-column: auto; } .event-card { grid-template-columns: 58px minmax(0, 1fr); gap: 12px; padding: 13px 12px; } .event-card__date { grid-row: 1 / 3; grid-template-columns: 1fr; grid-template-rows: auto auto auto; justify-items: start; gap: 4px; } .event-card__date span { grid-row: auto; writing-mode: horizontal-tb; transform: none; } .event-card__date strong { font-size: 2rem; } .event-card__date small { max-width: 54px; } .event-card__content { padding-left: 0; border-left: 0; } .event-card h2 { font-size: 1.15rem; } .event-card__schedule { grid-column: 2; min-height: 0; padding: 8px 0 0; border-top: 1px solid var(--line); border-left: 0; } }
