:root {
    --slow-cream: #f5f1e9;
    --slow-paper: #fbf9f5;
    --slow-ink: #25231f;
    --slow-muted: #716d65;
    --slow-gold: #a68b5b;
}

.events-hub {
    background: var(--slow-cream);
    color: var(--slow-ink);
    padding: clamp(4rem, 8vw, 7rem) clamp(1rem, 4vw, 3rem);
}

.events-hub__intro {
    margin: 0 auto clamp(2.5rem, 6vw, 5rem);
    max-width: 820px;
    text-align: center;
}

.events-hub__intro > span,
.events-hub__promise > span {
    color: var(--slow-gold);
    display: block;
    font-size: .65rem;
    font-weight: 700;
    letter-spacing: .25em;
    margin-bottom: 1rem;
    text-transform: uppercase;
}

.events-hub__intro h2,
.events-hub__promise h2 {
    font-family: "Playfair Display", serif;
    font-size: clamp(2.35rem, 5vw, 4.7rem);
    font-weight: 400;
    line-height: 1.02;
}

.events-hub__intro p,
.events-hub__promise p {
    color: var(--slow-muted);
    font-size: clamp(.95rem, 1.6vw, 1.15rem);
    font-weight: 300;
    line-height: 1.8;
    margin: 1.4rem auto 0;
    max-width: 690px;
}

.events-hub__grid {
    display: grid;
    gap: 1rem;
    margin: 0 auto;
    max-width: 1320px;
}

.event-tile {
    --event-accent: #9d9384;
    --event-bg: #e9e3d9;
    background: var(--event-bg);
    color: var(--slow-ink);
    display: flex;
    flex-direction: column;
    min-height: 330px;
    overflow: hidden;
    padding: clamp(1.7rem, 3vw, 2.6rem);
    position: relative;
    transition: transform .35s ease, box-shadow .35s ease;
}

.event-tile::after {
    background: var(--event-accent);
    bottom: 0;
    content: "";
    height: 5px;
    left: 0;
    position: absolute;
    right: 0;
    transform: scaleX(.28);
    transform-origin: left;
    transition: transform .35s ease;
}

.event-tile:hover {
    box-shadow: 0 24px 58px rgba(35, 31, 25, .12);
    transform: translateY(-5px);
}

.event-tile:hover::after { transform: scaleX(1); }
.event-tile--fira { --event-accent: #839895; --event-bg: #e4ece9; }
.event-tile--mwc { --event-accent: #8792a1; --event-bg: #e5e8ed; }
.event-tile--music { --event-accent: #a78593; --event-bg: #eee3e8; }
.event-tile--moto { --event-accent: #9a816c; --event-bg: #ece3da; }
.event-tile--f1 { --event-accent: #7f817e; --event-bg: #e5e6e4; }

.event-tile > span {
    color: var(--event-accent);
    font-size: .62rem;
    font-weight: 700;
    letter-spacing: .16em;
    text-transform: uppercase;
}

.event-tile h2 {
    font-family: "Playfair Display", serif;
    font-size: clamp(2rem, 3.2vw, 3.15rem);
    font-weight: 400;
    line-height: 1.05;
    margin: auto 0 1rem;
}

.event-tile p {
    color: #625e57;
    font-size: .88rem;
    font-weight: 300;
    line-height: 1.65;
    max-width: 460px;
}

.event-tile strong {
    font-size: .62rem;
    font-weight: 700;
    letter-spacing: .1em;
    margin-top: 1.4rem;
    text-transform: uppercase;
}

.events-hub__promise {
    border-bottom: 1px solid #d8d0c4;
    border-top: 1px solid #d8d0c4;
    margin: clamp(4rem, 8vw, 7rem) auto 0;
    max-width: 1040px;
    padding: clamp(3.5rem, 7vw, 6rem) 1rem;
    text-align: center;
}

.events-hub__promise h2 { font-size: clamp(2.1rem, 4.2vw, 3.8rem); }

.events-hub__promise a,
.event-page__button {
    background: var(--slow-ink);
    color: #fff;
    display: inline-block;
    font-size: .68rem;
    font-weight: 700;
    letter-spacing: .18em;
    margin-top: 2rem;
    padding: 1rem 1.7rem;
    text-transform: uppercase;
    transition: background .25s ease, transform .25s ease;
}

.events-hub__promise a:hover,
.event-page__button:hover { background: var(--slow-gold); transform: translateY(-2px); }

/* Individual event landing pages */
.event-page {
    --event-accent: #899794;
    background: var(--slow-paper);
    color: var(--slow-ink);
    font-family: "Montserrat", sans-serif;
}

.event-page__nav {
    align-items: center;
    background: rgba(251, 249, 245, .94);
    display: flex;
    justify-content: space-between;
    left: 0;
    padding: .9rem clamp(1rem, 4vw, 3rem);
    position: fixed;
    right: 0;
    top: 0;
    z-index: 50;
}

.event-page__nav img { width: auto; }
.event-page__nav-links { align-items: center; display: flex; gap: 1.1rem; }
.event-page__nav-links a { font-size: .64rem; font-weight: 700; letter-spacing: .12em; text-transform: uppercase; }
.event-page__langs { display: flex; gap: .55rem; opacity: .65; }

.event-page__hero {
    align-items: flex-end;
    background-position: center;
    background-size: cover;
    display: flex;
    min-height: min(780px, 88vh);
    padding: 8rem clamp(1.2rem, 7vw, 7rem) clamp(3rem, 8vw, 7rem);
    position: relative;
}

.event-page__hero::before {
    background: linear-gradient(180deg, rgba(22, 22, 20, .24), rgba(22, 22, 20, .78));
    content: "";
    inset: 0;
    position: absolute;
}

.event-page__hero-content { color: #fff; max-width: 880px; position: relative; z-index: 1; }
.event-page__eyebrow { color: #ead9b8; display: block; font-size: .68rem; font-weight: 700; letter-spacing: .24em; margin-bottom: 1.3rem; text-transform: uppercase; }
.event-page__hero h1 { font-family: "Playfair Display", serif; font-size: clamp(3rem, 8vw, 7.4rem); font-weight: 400; letter-spacing: -.02em; line-height: .96; }
.event-page__hero p { font-size: clamp(1rem, 2vw, 1.28rem); font-weight: 300; line-height: 1.7; margin-top: 1.7rem; max-width: 690px; }
.event-page__facts { display: flex; flex-wrap: wrap; gap: .65rem; margin-top: 2rem; }
.event-page__facts span { border: 1px solid rgba(255,255,255,.45); font-size: .65rem; font-weight: 600; letter-spacing: .12em; padding: .7rem 1rem; text-transform: uppercase; }

.event-page__section { margin: 0 auto; max-width: 1180px; padding: clamp(4.5rem, 9vw, 8rem) clamp(1.2rem, 4vw, 2rem); }
.event-page__section-header { max-width: 760px; }
.event-page__section-header span { color: var(--event-accent); font-size: .65rem; font-weight: 700; letter-spacing: .22em; text-transform: uppercase; }
.event-page__section-header h2 { font-family: "Playfair Display", serif; font-size: clamp(2.4rem, 5vw, 4.4rem); font-weight: 400; line-height: 1.05; margin-top: 1rem; }
.event-page__section-header p { color: var(--slow-muted); font-size: 1rem; font-weight: 300; line-height: 1.85; margin-top: 1.5rem; }

.event-page__benefits { display: grid; gap: 1px; margin-top: 3.5rem; background: #d8d2c8; }
.event-page__benefit { background: var(--slow-paper); min-height: 230px; padding: 2rem; }
.event-page__benefit b { color: var(--event-accent); font-family: "Playfair Display", serif; font-size: 2rem; font-weight: 400; }
.event-page__benefit h3 { font-family: "Playfair Display", serif; font-size: 1.55rem; font-weight: 400; margin-top: 2.8rem; }
.event-page__benefit p { color: var(--slow-muted); font-size: .82rem; font-weight: 300; line-height: 1.7; margin-top: .8rem; }

.event-page__rhythm { background: #292823; color: #f6f1e9; }
.event-page__rhythm-inner { margin: 0 auto; max-width: 1180px; padding: clamp(4.5rem, 9vw, 8rem) clamp(1.2rem, 4vw, 2rem); }
.event-page__rhythm h2 { font-family: "Playfair Display", serif; font-size: clamp(2.4rem, 5vw, 4.3rem); font-weight: 400; }
.event-page__steps { display: grid; gap: 2rem; margin-top: 3rem; }
.event-page__step { border-top: 1px solid rgba(255,255,255,.2); padding-top: 1.3rem; }
.event-page__step span { color: #c8b28b; font-size: .64rem; font-weight: 700; letter-spacing: .17em; text-transform: uppercase; }
.event-page__step h3 { font-family: "Playfair Display", serif; font-size: 1.65rem; font-weight: 400; margin-top: .8rem; }
.event-page__step p { color: #bbb7ae; font-size: .84rem; font-weight: 300; line-height: 1.7; margin-top: .7rem; }

.event-page__cta { background: var(--event-accent); color: #fff; padding: clamp(4.5rem, 9vw, 8rem) 1.2rem; text-align: center; }
.event-page__cta h2 { font-family: "Playfair Display", serif; font-size: clamp(2.5rem, 5vw, 4.7rem); font-weight: 400; line-height: 1.03; }
.event-page__cta p { font-weight: 300; line-height: 1.8; margin: 1.4rem auto 0; max-width: 650px; }
.event-page__cta .event-page__button { background: #fff; color: var(--slow-ink); }
.event-page__official { display: block; font-size: .65rem; letter-spacing: .1em; margin-top: 1.3rem; text-decoration: underline; text-underline-offset: 4px; text-transform: uppercase; }
.event-page__footer { background: #1d1c19; color: #fff; padding: 3rem 1.2rem; text-align: center; }
.event-page__footer img { height: 55px; margin: 0 auto 1.3rem; width: auto; }
.event-page__footer p { font-size: .65rem; letter-spacing: .16em; opacity: .62; text-transform: uppercase; }

@media (min-width: 760px) {
    .events-hub__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .event-tile:last-child { grid-column: 1 / -1; min-height: 290px; }
    .event-page__benefits,
    .event-page__steps { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}

@media (min-width: 1120px) {
    .events-hub__grid { grid-template-columns: repeat(6, minmax(0, 1fr)); }
    .event-tile { grid-column: span 2; }
    .event-tile:nth-child(4) { grid-column: 2 / span 2; }
    .event-tile:last-child { grid-column: 4 / span 2; min-height: 330px; }
}

@media (max-width: 700px) {
    .event-page__nav-links > a:not(.event-page__book) { display: none; }
    .event-page__langs { gap: .4rem; }
    .event-page__hero { min-height: 76vh; }
}

@media (prefers-reduced-motion: reduce) {
    .event-tile,
    .event-tile::after,
    .event-page__button { transition: none; }
}