.events-page { color: #0b2852; background: #fff; }
.events-hero { position: relative; overflow: hidden; padding: 24px 0 70px; background: radial-gradient(circle at 85% 25%,rgba(190,151,242,.3),transparent 30%),linear-gradient(135deg,#fbf9ff,#f0e6ff); }
.events-hero::after { position: absolute; right: -110px; bottom: -210px; width: 420px; height: 420px; content: ""; border: 1px solid rgba(126,79,199,.14); border-radius: 50%; }
.events-breadcrumb { position: relative; z-index: 2; margin-bottom: 48px; font-size: 12px; font-weight: 700; }.events-breadcrumb a { color: #7d55c6; text-decoration: none; }
.events-kicker { display: block; margin-bottom: 11px; color: #8653ce; font-size: 12px; font-weight: 800; letter-spacing: .1em; text-transform: uppercase; }
.events-hero h1 { max-width: 750px; margin: 0 0 18px; font-size: clamp(43px,5vw,63px); font-weight: 800; line-height: 1.06; letter-spacing: -.055em; }.events-hero p { max-width: 710px; margin: 0; color: #5d6d81; font-size: 15px; line-height: 1.8; }
.calendar-visual { position: relative; width: 270px; margin-left: auto; padding: 17px; color: #fff; background: linear-gradient(145deg,#9563db,#7545bf); border-radius: 25px; box-shadow: 0 22px 45px rgba(112,64,189,.25); transform: rotate(2deg); }.calendar-top { display: flex; padding: 5px 5px 15px; align-items: center; justify-content: space-between; border-bottom: 1px solid rgba(255,255,255,.17); }.calendar-top span { display: block; width: 13px; height: 13px; background: #d3b5f7; border: 3px solid rgba(255,255,255,.4); border-radius: 50%; }.calendar-top strong { font-size: 13px; }.calendar-body { display: flex; min-height: 205px; padding: 23px; flex-direction: column; align-items: center; justify-content: center; background: rgba(255,255,255,.1); border-radius: 0 0 15px 15px; }.calendar-body small { font-size: 12px; text-transform: uppercase; }.calendar-body strong { font-size: 68px; line-height: .95; letter-spacing: -.07em; }.calendar-body span { font-size: 18px; font-weight: 800; }.calendar-body em { margin-top: 13px; padding: 6px 11px; font-size: 12px; font-style: normal; font-weight: 800; background: rgba(255,255,255,.16); border-radius: 999px; }.calendar-visual > i { position: absolute; right: -16px; top: 38px; display: flex; width: 48px; height: 48px; align-items: center; justify-content: center; color: #8452cc; font-size: 20px; background: #fff; border-radius: 14px; box-shadow: 0 10px 25px rgba(57,34,87,.14); }
.events-content { padding: 72px 0 84px; }.next-event { display: grid; grid-template-columns: 130px 1fr auto; gap: 30px; margin-bottom: 48px; padding: 35px; align-items: center; color: #fff; background: linear-gradient(135deg,#8f5bd4,#7143bb); border-radius: 25px; box-shadow: 0 20px 48px rgba(112,64,189,.2); }.next-event-date { display: flex; min-height: 135px; flex-direction: column; align-items: center; justify-content: center; background: rgba(255,255,255,.12); border: 1px solid rgba(255,255,255,.2); border-radius: 19px; }.next-event-date small { font-size: 12px; font-weight: 800; }.next-event-date strong { font-size: 48px; line-height: 1; }.next-event-date span { font-size: 12px; }.event-label { color: #eadcff; font-size: 12px; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; }.next-event-copy h2 { margin: 7px 0 10px; font-size: clamp(25px,3vw,36px); font-weight: 800; letter-spacing: -.04em; }.next-event-copy > p { max-width: 650px; margin: 0 0 17px; color: rgba(255,255,255,.78); font-size: 14px; line-height: 1.7; }.event-meta { display: flex; gap: 16px 22px; flex-wrap: wrap; }.event-meta span { display: inline-flex; align-items: center; gap: 7px; font-size: 12px; }.event-primary-link { display: inline-flex; min-height: 50px; padding: 12px 17px; align-items: center; justify-content: center; gap: 8px; color: #7545bd; font-size: 12px; font-weight: 800; text-decoration: none; background: #fff; border-radius: 12px; }
.events-toolbar { display: flex; margin-bottom: 42px; align-items: center; justify-content: space-between; gap: 20px; }.events-search { position: relative; flex: 1 1 380px; max-width: 470px; }.events-search i { position: absolute; top: 50%; left: 17px; color: #8653ce; font-size: 17px; transform: translateY(-50%); }.events-search input { width: 100%; min-height: 52px; padding: 12px 16px 12px 46px; color: #173454; font-size: 13px; background: #faf9fc; border: 1px solid #e2ddea; border-radius: 13px; outline: 0; }.events-search input:focus { border-color: #996bd9; box-shadow: 0 0 0 4px rgba(143,91,211,.1); }.events-filters { display: flex; gap: 8px; flex-wrap: wrap; justify-content: flex-end; }.events-filters button { padding: 10px 14px; color: #58677b; font-size: 12px; font-weight: 800; background: #fff; border: 1px solid #e2ddea; border-radius: 999px; }.events-filters button:hover,.events-filters button.active { color: #fff; background: #8150ca; border-color: #8150ca; }
.events-heading { display: flex; margin-bottom: 23px; align-items: flex-end; justify-content: space-between; gap: 20px; }.events-heading span,.events-support span { color: #8553cd; font-size: 12px; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; }.events-heading h2 { margin: 5px 0 0; font-size: 32px; font-weight: 800; letter-spacing: -.04em; }.events-heading > p { margin: 0; color: #717c8d; font-size: 12px; }
.events-list { display: grid; gap: 17px; }.event-card { display: grid; grid-template-columns: 105px 1fr 48px; gap: 25px; padding: 25px; align-items: center; background: #fff; border: 1px solid #e5dfea; border-radius: 20px; box-shadow: 0 11px 28px rgba(28,42,79,.06); transition: transform .2s ease,box-shadow .2s ease; }.event-card:hover { transform: translateY(-3px); box-shadow: 0 17px 36px rgba(28,42,79,.11); }.event-card-date { display: flex; min-height: 105px; flex-direction: column; align-items: center; justify-content: center; color: #fff; background: linear-gradient(145deg,#9563db,#7545bf); border-radius: 16px; }.event-card-date small { font-size: 12px; font-weight: 800; }.event-card-date strong { font-size: 39px; line-height: 1; }.event-card-date span { font-size: 12px; }.event-card-tags { display: flex; gap: 7px; flex-wrap: wrap; }.event-card-tags span,.event-card-tags em { padding: 5px 8px; color: #794bbf; font-size: 12px; font-style: normal; font-weight: 800; background: #f0e7fc; border-radius: 999px; }.event-card-tags em { color: #6d7888; background: #edf0f4; }.event-card-main h3 { margin: 9px 0 8px; font-size: 20px; font-weight: 800; }.event-card-main > p { margin: 0 0 14px; color: #667386; font-size: 13px; line-height: 1.65; }.event-card-main .event-meta { color: #69768a; }.event-card > a { display: flex; width: 48px; height: 48px; align-items: center; justify-content: center; color: #fff; font-size: 18px; background: #8150ca; border-radius: 13px; }.event-past { background: #fbfbfd; }.event-past .event-card-date { background: #738198; }
.events-empty { padding: 55px 20px; text-align: center; background: #faf8fd; border: 1px solid #e6dfed; border-radius: 20px; }.events-empty i { color: #8552cd; font-size: 30px; }.events-empty h2 { margin: 12px 0 7px; font-size: 22px; font-weight: 800; }.events-empty p { margin: 0; color: #6b7789; font-size: 13px; }
.events-support { display: flex; margin-top: 52px; padding: 32px 35px; align-items: center; justify-content: space-between; gap: 28px; background: #f4edfe; border: 1px solid #e2d3f5; border-radius: 22px; }.events-support h2 { margin: 6px 0 8px; font-size: 25px; font-weight: 800; }.events-support p { max-width: 720px; margin: 0; color: #617085; font-size: 13px; line-height: 1.7; }.events-support > a { display: inline-flex; flex: 0 0 auto; min-height: 49px; padding: 12px 17px; align-items: center; gap: 8px; color: #fff; font-size: 12px; font-weight: 800; text-decoration: none; background: #8150ca; border-radius: 12px; }
@media (max-width:991.98px) { .calendar-visual { margin: 0; }.next-event { grid-template-columns: 115px 1fr; }.event-primary-link { grid-column: 2; width: fit-content; }.events-toolbar { align-items: flex-start; flex-direction: column; }.events-search { width: 100%; max-width: none; flex-basis: auto; }.events-filters { justify-content: flex-start; }.events-support { align-items: flex-start; flex-direction: column; } }
@media (max-width:575.98px) { .events-hero { padding: 20px 0 54px; }.events-breadcrumb { margin-bottom: 35px; }.events-hero h1 { font-size: 39px; }.events-hero p { font-size: 14px; }.calendar-visual { width: 100%; transform: none; }.events-content { padding: 52px 0 66px; }.next-event { grid-template-columns: 1fr; gap: 21px; padding: 25px; }.next-event-date { width: 110px; min-height: 110px; }.event-primary-link { grid-column: 1; width: 100%; }.events-filters { flex-wrap: nowrap; width: 100%; padding-bottom: 5px; overflow-x: auto; }.events-filters button { flex: 0 0 auto; }.events-heading { align-items: flex-start; flex-direction: column; gap: 7px; }.event-card { grid-template-columns: 82px 1fr; gap: 17px; padding: 19px; align-items: start; }.event-card-date { min-height: 90px; }.event-card-main h3 { font-size: 18px; }.event-card > a { grid-column: 2; width: 100%; }.event-meta { flex-direction: column; gap: 7px; }.events-support { padding: 27px 24px; }.events-support > a { width: 100%; justify-content: center; } }