/* homecal1 (19-10-2026): the small club calendar in the home hero, to the left of the Genesis card and never bigger than it.
   Only on screens wide enough for both next to the title (1440px and up); elsewhere the hero is as before.
   home-calendar.js also drops "Coming up" rows until the calendar is no taller than the card. */
.hero-side { display: contents; }          /* below 1440px the card is a grid item exactly as before */
.hcal { display: none; }

@media (min-width: 1440px) {
    .hero-inner.has-hcal { grid-template-columns: minmax(0, 1fr) auto; gap: 32px; padding-right: 36px; }
    .hero-side { justify-self: end; display: flex; align-items: center; justify-content: flex-end; gap: 24px; min-width: 0; }
    .hero-side .hero-card { justify-self: auto; flex: none; width: 380px; }
    .hcal:not([hidden]) { display: flex; }
}
@media (min-width: 1440px) and (max-width: 1599px) {
    .hero-inner.has-hcal .hero-card { width: 330px; }
    .hero-inner.has-hcal .hero-card img { height: auto; }      /* stays square in the narrower card */
    .hero-inner.has-hcal .hcal-day { height: 28px; }
    .hero-inner.has-hcal h1 { font-size: clamp(2.4rem, 3.7vw, 4.4rem); }
}

.hcal { flex: none; flex-direction: column; gap: 8px; width: 288px; padding: 14px 14px 13px; border-radius: 20px;
    background: linear-gradient(160deg, rgba(0,221,235,0.08), transparent 40%), rgba(9, 6, 22, 0.66); border: 1px solid var(--line-strong);
    backdrop-filter: blur(12px); box-shadow: 0 24px 60px rgba(0,0,0,0.45), 0 0 40px rgba(0, 221, 235, 0.12); }
.hcal-head { display: flex; align-items: center; justify-content: space-between; gap: 8px; }
.hcal-title { font-size: 1rem; font-weight: 900; letter-spacing: 0.01em; color: #fff; }
.hcal-title:hover { color: var(--cyan); }
.hcal-nav { display: flex; gap: 6px; }
.hcal-nav button { width: 28px; height: 28px; border-radius: 9px; cursor: pointer; font: inherit; font-size: 1.05rem; font-weight: 900; line-height: 1;
    color: var(--text); background: rgba(255,255,255,0.06); border: 1px solid var(--line); transition: background 0.2s, border-color 0.2s, opacity 0.2s; }
.hcal-nav button:hover:not(:disabled) { background: rgba(0,221,235,0.14); border-color: rgba(0,221,235,0.5); }
.hcal-nav button:disabled { opacity: 0.3; cursor: default; }
.hcal-grid { display: grid; grid-template-columns: repeat(7, 1fr); gap: 3px; }
.hcal-wd { padding-bottom: 2px; text-align: center; font-size: 0.75rem; font-weight: 900; letter-spacing: 0.08em; text-transform: uppercase; color: var(--muted); }
.hcal-day { position: relative; display: grid; justify-items: center; align-content: start; gap: 2px; height: 30px; padding-top: 2px; border-radius: 9px;
    font-size: 0.78rem; font-weight: 700; color: #cbd5e1; text-decoration: none; transition: background 0.15s; }
a.hcal-day:hover { background: rgba(255,255,255,0.08); color: #fff; }
.hcal-day.is-out { opacity: 0.5; }   /* smalltext1: still dimmed, now readable (AA) */
.hcal-day.has-ev { color: #fff; font-weight: 800; }
.hcal-day.is-today { color: #04121a; background: linear-gradient(135deg, var(--cyan), #7dd3fc); box-shadow: 0 0 14px rgba(0,221,235,0.45); }
.hcal-dots { display: flex; gap: 2px; height: 5px; }
.hcal-dots i { width: 5px; height: 5px; border-radius: 50%; background: var(--c); box-shadow: 0 0 5px var(--c); }
.hcal-day.is-today .hcal-dots i { box-shadow: none; outline: 1px solid rgba(4,18,26,0.5); }
.hcal-next { display: grid; gap: 5px; padding-top: 8px; border-top: 1px solid var(--line); }
.hcal-next-head { font-size: 0.75rem; font-weight: 900; letter-spacing: 0.14em; text-transform: uppercase; color: var(--muted); }
.hcal-ev { display: flex; align-items: center; gap: 9px; min-width: 0; padding: 5px 8px; border-radius: 10px; text-decoration: none;
    background: linear-gradient(90deg, color-mix(in srgb, var(--c) 14%, transparent), transparent 70%); border-left: 2px solid var(--c); transition: background 0.2s, transform 0.2s; }
.hcal-ev:hover { background: linear-gradient(90deg, color-mix(in srgb, var(--c) 26%, transparent), transparent 80%); transform: translateX(2px); }
.hcal-ev-when { flex: none; display: grid; text-align: center; min-width: 38px; font-size: 0.75rem; font-weight: 800; color: var(--muted); text-transform: uppercase; line-height: 1.15; }
.hcal-ev-when b { font-size: 0.82rem; color: #fff; font-variant-numeric: tabular-nums; text-transform: none; }
.hcal-ev-body { min-width: 0; display: grid; }
.hcal-ev-src { font-size: 0.75rem; font-weight: 900; letter-spacing: 0.1em; text-transform: uppercase; color: var(--c); }
.hcal-ev-title { overflow: hidden; white-space: nowrap; text-overflow: ellipsis; font-size: 0.8rem; font-weight: 700; color: #f1f5f9; }
.hcal-all { align-self: flex-start; font-size: 0.8rem; font-weight: 800; color: var(--cyan); }
.hcal-all span { display: inline-block; transition: transform 0.2s; }
.hcal-all:hover span { transform: translateX(3px); }

/* one colour per source, the same as the calendar page */
.hcal-t-k-space { --c: #38bdf8; } .hcal-t-k-call { --c: #00ddeb; } .hcal-t-k-tournament { --c: #f87171; } .hcal-t-k-giveaway { --c: #f59e0b; }
.hcal-t-k-launch { --c: #f97316; } .hcal-t-k-meetup { --c: #c4b5fd; } .hcal-t-k-other { --c: #94a3b8; }
.hcal-t-k-lotto { --c: #facc15; } .hcal-t-k-raffle { --c: #e879f9; } .hcal-t-k-vote { --c: #2dd4bf; }
.hcal-t-tribe-aether { --c: #9370db; } .hcal-t-tribe-air { --c: #87ceeb; } .hcal-t-tribe-earth { --c: #3cb043; } .hcal-t-tribe-fire { --c: #ff6347; }
.hcal-t-tribe-water { --c: #4f7dff; } .hcal-t-tribe-xe { --c: #00f3ff; }
@media (prefers-reduced-motion: reduce) { .hcal-ev, .hcal-all span { transition: none; } .hcal-ev:hover { transform: none; } }
.hcal-t-k-sitepoll { --c: #a3e635; } .hcal-t-k-sotw { --c: #fbbf24; }   /* sitecal1: the Ape Sites */
.hcal-t-k-gwlive, .hcal-t-k-gwsoon { --c: #ff3d7f; } .hcal-t-k-gwdraw, .hcal-t-k-gwdone { --c: #f5c542; }   /* gwcal1: the team's giveaways */