/* Events page (V1 preview, 2026-11-05). Loaded only by events.html, after site.css. */

/* photo captions under framed photos */
.ev-hero-photo, .ev-weekly-photo { aspect-ratio: 4 / 5; }
.ev-hero-photo figcaption, .ev-weekly-photo figcaption { position: absolute; z-index: 2; left: 0; right: 0; bottom: 0; padding: 40px 18px 14px;
  font-family: var(--type); font-size: 12px; letter-spacing: .08em; text-transform: uppercase; color: var(--ivory);
  background: linear-gradient(to top, rgba(20, 15, 11, .72), rgba(20, 15, 11, 0)); }
.ev-weekly-photo { width: min(100%, 500px); }
.split.ev-weekly { align-items: center; }

/* next class line */
.ev-next { display: inline-block; margin-top: 28px; padding: 10px 18px; border: 1px solid var(--line); font-family: var(--serif);
  font-style: italic; font-size: clamp(21px, 1.7vw, 26px); line-height: 1.25; }
.ev-next.is-live { border-color: currentColor; }
.ev-next.is-live::before { content: ""; display: inline-block; width: 9px; height: 9px; margin-right: 10px; border-radius: 50%;
  background: #d94b3a; vertical-align: middle; animation: ev-pulse 1.6s ease-in-out infinite; }
@keyframes ev-pulse { 50% { opacity: .35; } }

/* when / where / cost / who */
.ev-meta { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 18px 32px; margin-top: 30px; max-width: 34em; }
.ev-meta div { border-top: 1px solid var(--line); padding-top: 12px; }
.ev-meta dt { font-family: var(--type); font-size: 12px; letter-spacing: .1em; text-transform: uppercase; opacity: .75; }
.ev-meta dd { margin-top: 4px; font-size: 17px; line-height: 1.45; }
.ev-weekly .fine a { color: inherit; }

/* upcoming cards */
.ev-cards { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: clamp(24px, 3vw, 44px); }
.ev-card { background: var(--ivory); color: var(--ink); display: flex; flex-direction: column; box-shadow: 0 1px 0 rgba(46, 35, 28, .08); }
.ev-card-img { display: block; aspect-ratio: 1200 / 630; overflow: hidden; }
.ev-card-img img { width: 100%; height: 100%; object-fit: cover; transition: transform .5s ease; }
.ev-card:hover .ev-card-img img { transform: scale(1.03); }
.ev-card-body { display: grid; grid-template-columns: 74px 1fr; gap: 22px; padding: clamp(22px, 2.4vw, 34px); flex: 1; }
.ev-date { display: flex; flex-direction: column; align-items: center; align-self: start; padding: 10px 0 12px; border: 1.5px solid var(--ink);
  font-family: var(--type); font-size: 12px; letter-spacing: .1em; text-transform: uppercase; line-height: 1.2; }
.ev-date b { font-family: var(--serif); font-weight: 500; font-size: 40px; line-height: 1; letter-spacing: 0; margin: 4px 0 2px; }
.ev-card h3 { margin: 8px 0 10px; }
.ev-card h3 a { text-decoration: none; }
.ev-card h3 a:hover { text-decoration: underline; text-decoration-thickness: 1px; text-underline-offset: 5px; }
.ev-who { font-size: 16.5px; line-height: 1.5; opacity: .85; }
.ev-facts { list-style: none; margin: 16px 0 22px; display: grid; gap: 6px; font-size: 16px; }
.ev-facts li { padding-left: 18px; position: relative; }
.ev-facts li::before { content: ""; position: absolute; left: 0; top: .7em; width: 8px; height: 1px; background: currentColor; }
.ev-empty { margin-top: 10px; }

/* gallery: one large photo, four small ones */
.ev-gallery { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); grid-auto-rows: clamp(180px, 19vw, 280px); gap: clamp(10px, 1.2vw, 18px); }
.ev-gallery figure { position: relative; overflow: hidden; }
.ev-gallery figure:first-child { grid-column: span 2; grid-row: span 2; }
.ev-gallery img { width: 100%; height: 100%; object-fit: cover; transition: transform .6s ease; }
.ev-gallery figure:hover img { transform: scale(1.03); }
.ev-gallery figcaption { position: absolute; left: 0; right: 0; bottom: 0; padding: 34px 14px 12px; font-family: var(--type); font-size: 11.5px;
  letter-spacing: .08em; text-transform: uppercase; color: var(--ivory); background: linear-gradient(to top, rgba(20, 15, 11, .7), rgba(20, 15, 11, 0)); }

/* past events */
.ev-past { list-style: none; border-top: 1px solid var(--line); }
.ev-past li { display: grid; grid-template-columns: minmax(150px, 230px) 1fr; gap: 12px 40px; padding: 24px 0; border-bottom: 1px solid var(--line); }
.ev-past .ev-when { font-family: var(--type); font-size: 13px; letter-spacing: .08em; text-transform: uppercase; opacity: .8; padding-top: 6px; }
.ev-past h3 { font-size: clamp(22px, 1.9vw, 28px); }
.ev-past p { margin-top: 6px; font-size: 16px; opacity: .8; }

@media (max-width: 900px) {
  .ev-cards { grid-template-columns: 1fr; }
}
@media (max-width: 760px) {
  .ev-weekly-photo { order: -1; width: min(100%, 420px); }
  .ev-gallery { grid-template-columns: repeat(2, minmax(0, 1fr)); grid-auto-rows: 46vw; }
  .ev-gallery figure:first-child { grid-row: span 1; }
  .ev-past li { grid-template-columns: 1fr; gap: 4px; }
}
@media (max-width: 560px) {
  .ev-meta { grid-template-columns: 1fr; }
  .ev-card-body { grid-template-columns: 1fr; }
  .ev-date { flex-direction: row; gap: 8px; align-items: baseline; justify-self: start; padding: 6px 12px; }
  .ev-date b { font-size: 24px; margin: 0; }
}
@media (prefers-reduced-motion: reduce) {
  .ev-card-img img, .ev-gallery img { transition: none; }
  .ev-next.is-live::before { animation: none; }
}