/* イベント一覧・詳細。接頭辞 .ev- は新規要素、.event-* はテスト/JSが参照する既存名。 */
.event-hero { position: relative; width: var(--wrap); margin: .6rem auto 0; padding: clamp(1.6rem, 3.5vw, 3rem); overflow: hidden; color: var(--ink); border: 1px solid var(--line); border-radius: calc(var(--r-l) + .35rem); background: radial-gradient(circle at 92% 0%, rgb(255 255 255 / 85%), transparent 34%), linear-gradient(135deg, #effbf7 0%, #dff5ef 58%, #fff4f7 100%); box-shadow: var(--sh-2); isolation: isolate; }
.event-hero::before, .event-hero::after { position: absolute; z-index: -1; border: 1px solid rgb(53 184 161 / 12%); border-radius: 50%; content: ""; }
.event-hero::before { top: -12rem; right: -4rem; width: 31rem; height: 31rem; }
.event-hero::after { right: 18rem; bottom: -18rem; width: 35rem; height: 35rem; border-color: rgb(216 100 130 / 10%); }
.event-hero__copy h1 { max-width: none; margin: .3rem 0 .7rem; font-size: clamp(2rem, 4vw, 3.2rem); line-height: 1.12; letter-spacing: -.04em; }
.event-hero__copy .eyebrow { color: var(--rose); }
.event-hero__copy > p:not(.eyebrow) { max-width: 44rem; color: var(--ink-2); font-size: var(--fs-s); }
.event-filter-panel { position: relative; z-index: 2; width: min(1080px, calc(100% - 3rem)); margin: -1.3rem auto 3.5rem; padding: .9rem; border: 1px solid rgb(255 255 255 / 78%); border-radius: var(--r-l); background: rgb(255 255 255 / 97%); box-shadow: var(--sh-3); backdrop-filter: blur(14px); }
.event-filters { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)) auto auto; gap: .6rem; align-items: end; }
.event-filters label { display: grid; gap: .3rem; }
.event-filters label span { color: var(--ink-2); font-size: var(--fs-xs); font-weight: 700; }
.event-catalog, .event-map-section, .event-detail { width: var(--wrap); margin-inline: auto; }
.event-catalog { margin-bottom: 4rem; }
.event-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(22rem, 100%), 1fr)); gap: 1rem; }
.event-card { overflow: hidden; padding: 1.35rem; border-top: 3px solid var(--blue); }
.event-card[data-category="fireworks"] { border-top-color: #7755c7; }
.event-card[data-category="festival"] { border-top-color: #ce684e; }
.event-card[data-category="market"] { border-top-color: var(--green); }
.event-card__media { margin: -1.35rem -1.35rem 1.2rem; overflow: hidden; background: var(--blue-50); }
.event-card__media img { display: block; width: 100%; aspect-ratio: 16 / 9; object-fit: cover; }
.event-card > header { display: flex; align-items: center; justify-content: space-between; gap: .6rem; }
.event-card > time { display: block; margin-top: 1.2rem; color: var(--blue); font-size: var(--fs-xs); font-weight: 800; letter-spacing: .03em; }
.event-card h2 { max-width: 24ch; margin: .3rem 0 .55rem; font-size: clamp(1.1rem, 2vw, 1.4rem); }
.event-card h2 a:hover { color: var(--blue); }
.event-card > p { color: var(--ink-2); font-size: var(--fs-s); line-height: 1.7; }
.event-card dl { margin: 1rem 0; }
.event-card dl div { display: grid; grid-template-columns: 4.5rem 1fr; gap: .5rem; padding: .5rem 0; border-top: 1px solid var(--line); font-size: var(--fs-xs); }
.event-card dt { color: var(--ink-3); }
.event-card dd { margin: 0; }
.event-card > footer { display: flex; flex-wrap: wrap; gap: .5rem; align-items: center; justify-content: space-between; margin-top: auto; padding-top: .8rem; border-top: 1px solid var(--line); }
.event-card > footer > a { color: var(--blue); font-size: var(--fs-xs); font-weight: 700; }
.event-tags { display: flex; flex-wrap: wrap; gap: .3rem; }
.event-map-section { margin-bottom: 4rem; }
.event-map { min-height: 500px; overflow: hidden; border: 1px solid var(--line); border-radius: var(--r-l); }
.event-detail .map-toolbar > a { color: var(--blue); font-size: var(--fs-xs); font-weight: 700; }

/* 詳細ヒーロー: 写真がある回は写真の角丸カード、ない回は薄い青地。 */
.event-detail { padding-top: var(--page-top); }
.event-detail__hero { position: relative; display: grid; align-items: end; min-height: 22rem; margin-top: 1rem; overflow: hidden; border: 1px solid var(--line); border-radius: var(--r-l); background: var(--blue-50); isolation: isolate; }
.event-detail__hero--image { min-height: clamp(24rem, 56svh, 34rem); color: #fff; border: 0; }
.event-detail__media, .event-detail__shade { position: absolute; z-index: -2; inset: 0; width: 100%; height: 100%; }
.event-detail__media { display: block; }
.event-detail__media img { width: 100%; height: 100%; object-fit: cover; }
.event-detail__shade { z-index: -1; background: linear-gradient(180deg, rgb(10 20 35 / 5%) 0%, rgb(10 20 35 / 25%) 45%, rgb(10 20 35 / 72%) 100%); }
.event-detail__lead { position: relative; z-index: 1; padding: clamp(1.4rem, 4vw, 2.5rem); }
.event-detail__lead > time { display: block; margin-top: .6rem; color: var(--blue); font-size: var(--fs-s); font-weight: 700; }
.event-detail__hero--image .event-detail__lead > time, .event-detail__hero--image .eyebrow { color: #dbeafe; }
.event-detail__lead h1 { max-width: 24ch; margin: .3rem 0 .6rem; }
.event-detail__hero--image h1 { text-shadow: 0 2px 16px rgb(0 0 0 / 30%); }
.event-detail__lead > p { max-width: 45rem; color: var(--ink-2); font-size: var(--fs-s); line-height: 1.8; }
.event-detail__hero--image .event-detail__lead > p { color: #f1f5f9; text-shadow: 0 1px 10px rgb(0 0 0 / 30%); }
.event-detail__lead .event-tags { margin: 1rem 0 1.2rem; }
.event-detail__credit { position: absolute; z-index: 2; top: .8rem; right: .8rem; max-width: min(70%, 32rem); margin: 0; padding: .3rem .6rem; border-radius: var(--r-s); color: rgb(255 255 255 / 85%); background: rgb(10 20 35 / 45%); font-size: .58rem; text-align: right; }
.event-detail__credit a { text-decoration: underline; text-underline-offset: .15em; }
.event-facts { display: grid; grid-template-columns: 1.5fr .7fr; gap: .8rem; align-items: stretch; margin: 1rem 0 3.5rem; }
.event-facts dl { display: grid; grid-template-columns: repeat(2, 1fr); gap: 0 1rem; margin: 0; padding: .4rem 1.2rem; border: 1px solid var(--line); border-radius: var(--r-l); background: var(--paper); }
.event-facts dl div { padding: .7rem 0; border-bottom: 1px solid var(--line); }
.event-facts dl div:nth-last-child(-n+2) { border-bottom: 0; }
.event-facts dt { color: var(--ink-3); font-size: .66rem; }
.event-facts dd { margin: .15rem 0 0; font-size: var(--fs-s); font-weight: 700; }
.event-facts aside { padding: 1.1rem 1.2rem; border: 1px solid var(--blue-100); border-radius: var(--r-l); background: var(--blue-50); }
.event-facts aside strong { display: block; font-size: var(--fs-s); }
.event-facts aside p { margin-top: .3rem; color: var(--ink-2); font-size: var(--fs-xs); line-height: 1.7; }
.event-facts aside small { display: block; margin-top: .4rem; color: var(--ink-3); font-size: .64rem; }

/* 特定イベントの案内(日本語のみ)。番号付きカードで並べる。 */
.event-guide, .event-detail-map, .event-next, .event-courses, .event-related { margin-bottom: 3.5rem; }
.event-guide__lead { max-width: 55rem; margin: 0 0 1.5rem; color: var(--ink-2); font-size: var(--fs-4); line-height: 1.9; }
.event-guide__lead strong { color: var(--ink); }
.event-guide__grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .8rem; }
.event-guide__grid article { padding: 1.3rem; border: 1px solid var(--line); border-radius: var(--r-l); background: var(--paper); }
.event-guide__number { margin: 0; color: var(--blue); font-size: .64rem; font-weight: 700; letter-spacing: .08em; }
.event-guide__grid h3, .event-guide__visit h3 { margin: .4rem 0 .6rem; font-size: var(--fs-3); }
.event-guide__grid article > p:last-child, .event-guide__visit p { color: var(--ink-2); font-size: var(--fs-s); line-height: 1.85; }
.event-guide__grid article > a { display: inline-block; margin-top: .8rem; color: var(--blue); font-size: var(--fs-xs); font-weight: 700; }
.event-guide__grid article > a:hover { text-decoration: underline; text-underline-offset: .2em; }
.event-guide__grid strong { color: var(--ink); }
.event-guide__visit { display: grid; grid-template-columns: 1.5fr .65fr; gap: 1.5rem; align-items: center; padding: 1.4rem; margin-top: .8rem; border: 1px solid var(--blue-100); border-radius: var(--r-l); background: var(--blue-50); }
.event-guide__visit nav { display: grid; gap: .5rem; }
.event-guide__note { margin: .7rem .2rem 0; color: var(--ink-3); font-size: .64rem; line-height: 1.7; }
.fireworks-guide__status { display: grid; grid-template-columns: 1fr auto; gap: 1rem 1.5rem; align-items: center; margin-bottom: 1.5rem; }
.fireworks-guide__status span, .fireworks-guide__status strong { display: block; }
.fireworks-guide__status span { font-size: .62rem; font-weight: 700; letter-spacing: .08em; }
.fireworks-guide__status strong { margin-top: .2rem; font-size: var(--fs-4); }
.fireworks-guide__status p { margin-top: .3rem; font-size: var(--fs-xs); line-height: 1.7; }
.event-next-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: .7rem; }
.event-next-grid article { display: grid; align-content: start; min-height: 10rem; padding: 1.1rem; border: 1px solid var(--line); border-radius: var(--r-m); background: var(--paper); transition: border-color var(--t-fast), box-shadow var(--t-base) var(--ease); }
.event-next-grid article:hover { border-color: var(--blue-100); box-shadow: var(--sh-2); }
.event-next-grid article > span { color: var(--ink-3); font-size: .66rem; font-weight: 700; }
.event-next-grid h3 { margin: .5rem 0 .3rem; font-size: var(--fs-4); }
.event-next-grid p { color: var(--ink-3); font-size: var(--fs-xs); line-height: 1.6; }
.event-next-grid article > a { align-self: end; margin-top: .8rem; color: var(--blue); font-size: var(--fs-xs); font-weight: 700; }
.event-source { display: flex; align-items: center; justify-content: space-between; gap: 1rem; padding: 1.2rem 1.4rem; margin-bottom: 1rem; border: 1px solid var(--line); border-radius: var(--r-l); background: var(--bg); }
.event-source strong, .event-source small { display: block; }
.event-source small { margin-top: .2rem; color: var(--ink-3); font-size: .66rem; }
.event-detail > .report-information { margin-bottom: 4rem; }

@media (max-width: 900px) {
  /* SP。段はこの1本だけ */
  .event-hero { width: calc(100% - 1rem); margin-top: .35rem; padding: 1.35rem 1rem 2.25rem; }
  .event-hero__copy h1 { font-size: 1.55rem; line-height: 1.18; }
  .event-filter-panel { width: calc(100% - 1.5rem); margin: -1.2rem auto 2.25rem; padding: .7rem; }
  .event-filters { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .45rem; }
  .event-filters .btn { width: 100%; min-height: 2.55rem; padding: .45rem .6rem; }
  .event-grid, .event-facts, .event-next-grid, .event-guide__grid, .event-guide__visit, .fireworks-guide__status { grid-template-columns: 1fr; }
  .event-facts dl { grid-template-columns: 1fr; }
  .event-facts dl div:nth-last-child(2) { border-bottom: 1px solid var(--line); }
  .event-map { min-height: 400px; }
  .event-detail__hero--image { min-height: 23rem; }
  .event-detail__lead { padding: 1.15rem; }
  .event-detail__lead h1 { max-width: 19ch; font-size: clamp(1.65rem, 7.2vw, 2.05rem); line-height: 1.12; }
  .event-detail__lead > p { display: -webkit-box; overflow: hidden; line-height: 1.65; -webkit-box-orient: vertical; -webkit-line-clamp: 3; }
  .event-detail__lead .event-tags { margin: .65rem 0 .8rem; }
  .event-detail__credit { top: .6rem; right: .6rem; max-width: calc(100% - 1.2rem); }
  .event-source { align-items: flex-start; flex-direction: column; }
}
.event-rich-content {
  margin-block: var(--space-8);
  padding: clamp(1.25rem, 3vw, 2rem);
  border: 1px solid #dbe3eb;
  border-radius: var(--radius-lg);
  background: #fff;
  box-shadow: var(--shadow-sm);
}

.event-rich-content h2 {
  margin: 2rem 0 0.75rem;
  padding-top: 1.7rem;
  border-top: 1px solid var(--line);
  font-size: clamp(1.25rem, 3vw, 1.65rem);
}

.event-rich-content h2:first-child { margin-top: 0; padding-top: 0; border-top: 0; }
.event-rich-content h3 { margin: 1.5rem 0 0.5rem; }
.event-rich-content p { margin: 0.65rem 0; line-height: 1.85; }
.event-rich-content ul,
.event-rich-content ol { margin: 0.75rem 0; padding-left: 1.5rem; }
.event-rich-content li { margin: 0.4rem 0; line-height: 1.75; }
.event-rich-content a { font-weight: 700; text-decoration: underline; text-underline-offset: 0.2em; }

.event-next-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(17rem, 100%), 1fr)); gap: .8rem; }
.event-next-grid article { display: flex; flex-direction: column; min-height: 14rem; padding: 1.15rem; border: 1px solid var(--line); border-radius: var(--r-l); background: #fff; box-shadow: var(--sh-1); }
.event-next-grid article > header, .event-next-grid article > footer { display: flex; align-items: center; justify-content: space-between; gap: .6rem; }
.event-next__distance { color: var(--ink-3); font-size: var(--fs-xs); font-weight: 700; }
.event-next-grid h3 { margin: .8rem 0 .4rem; font-size: var(--fs-3); }
.event-next-grid article > p { margin: 0; color: var(--ink-2); font-size: var(--fs-xs); line-height: 1.6; }
.event-next-grid dl { margin: .8rem 0 1rem; padding-top: .7rem; border-top: 1px solid var(--line); }
.event-next-grid dl div { display: grid; gap: .2rem; }
.event-next-grid dt { color: var(--ink-3); font-size: .66rem; }
.event-next-grid dd { margin: 0; font-size: var(--fs-xs); line-height: 1.55; }
.event-next-grid article > footer { margin-top: auto; }
.event-next-grid article > footer a { color: var(--blue); font-size: var(--fs-xs); font-weight: 700; }