.cp-kicker { font-size: var(--t-caption); color: rgba(246, 244, 240, 0.8); margin-bottom: 8px; } .cp-hero-next { color: var(--ink); background: linear-gradient(currentColor, currentColor) 0 100% / 100% 1px no-repeat; padding-bottom: 2px; } .cp-story { margin-top: 40px; } .cp-events { border-top: 1px solid var(--hair); margin-top: 8px; } .cp-events li { border-bottom: 1px solid var(--hair); } .cp-event { display: grid; grid-template-columns: 8.5em minmax(0, 1fr) auto; gap: 24px; align-items: baseline; padding: 24px 0; transition: padding 0.6s var(--ease); } .cp-event:hover { padding-left: 12px; } .cp-event-when { display: flex; flex-direction: column; gap: 2px; } .cp-event-day { font-size: var(--t-read); color: var(--ink); } .cp-event-time { font-size: var(--t-caption); color: var(--faint); } .cp-event-what { display: flex; flex-direction: column; gap: 4px; min-width: 0; } .cp-event-title { font-weight: 300; font-size: clamp(21px, 1.9vw, 28px); line-height: 1.22; letter-spacing: -0.02em; } .cp-event-where, .cp-event-going { font-size: var(--t-caption); color: var(--soft); } .cp-event-going { white-space: nowrap; } .cp-event-flag { align-self: flex-start; font-size: 12px; padding: 2px 10px; border: 1px solid var(--hair); border-radius: 999px; color: var(--soft); } .cp-recent { padding-top: 0; } .cp-recent figcaption a { color: var(--ink); } .cp-eco { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 56px 48px; } .cp-eco-kind { padding-top: 22px; border-top: 1px solid var(--rule); } .cp-eco-kind h3 { font-weight: 350; font-size: clamp(21px, 1.8vw, 27px); letter-spacing: -0.02em; margin-bottom: 16px; } .cp-eco-kind li { display: flex; flex-direction: column; padding: 10px 0; border-bottom: 1px solid var(--hair); } .cp-eco-name { font-size: var(--t-read); color: var(--ink); } .cp-eco-where { font-size: var(--t-caption); color: var(--faint); } .cp-eco-kind .fr-more { margin-top: 20px; } .cp-faqs { border-top: 1px solid var(--hair); } .cp-faqs div { padding: 28px 0; border-bottom: 1px solid var(--hair); } .cp-faqs dt { font-weight: 350; font-size: clamp(20px, 1.7vw, 25px); line-height: 1.3; letter-spacing: -0.015em; margin-bottom: 12px; } .cp-faqs dd { margin: 0; max-width: 42em; color: var(--soft); line-height: 1.65; } @media (max-width: 700px) { .cp-event { grid-template-columns: 1fr auto; gap: 6px 16px; } .cp-event-when { grid-column: 1 / -1; flex-direction: row; gap: 10px; } .cp-eco { grid-template-columns: 1fr; gap: 40px; } }