/* Sky + Soul Collective page (v0.1.6). Her picks, Sep 28: Cormorant Garamond for SKY + SOUL,
   Tenor Sans tracked wide for COLLECTIVE; more blue than her own site; bronze, not high gold. */
.ss-page {
  --ss-night: #08142b;
  --ss-blue: #10284f;
  --ss-deep: #0b1d3d;
  --ss-bronze: #c89a5e;
  --ss-star: #efe4cc;
  --ss-sans: "Tenor Sans", "Gill Sans", "Segoe UI", sans-serif;
  background: var(--ss-night);
  background-image: radial-gradient(ellipse 90% 60% at 50% 0%, #17345f 0%, var(--ss-night) 62%), linear-gradient(180deg, var(--ss-night), var(--ss-deep));
}
.ss-page h1, .ss-page h2, .ss-page h3 { font-family: "Cormorant Garamond", Georgia, serif; font-weight: 500; }
.ss-page h3 { color: var(--ss-bronze); }
.ss-page a:hover { color: var(--ss-bronze); }
.ss-page .topnav a:hover { color: var(--ss-bronze); }

.ss-hero { position: relative; z-index: 1; text-align: center; padding: clamp(88px, 14vh, 140px) var(--gutter) clamp(40px, 8vh, 80px); display: flex; flex-direction: column; align-items: center; gap: 14px; }
.ss-building { font-family: var(--ss-sans); font-size: 0.78rem; letter-spacing: 0.24em; text-transform: uppercase; color: var(--sage); margin: 0; }
.ss-logo {
  width: min(86vw, 420px); height: auto;
}
/* the logo already carries the name; the heading repeats it in type for search and screen readers */
.ss-name { margin: 0; font-size: clamp(2.2rem, 1.6rem + 3vw, 3.6rem); letter-spacing: 0.08em; color: var(--ss-star); line-height: 1.05; display: flex; flex-direction: column; gap: 0.2em; }
.ss-collective { font-family: var(--ss-sans); font-size: 0.34em; letter-spacing: 0.5em; text-transform: uppercase; color: var(--ss-bronze); }
.ss-tagline { font-family: "Cormorant Garamond", Georgia, serif; font-style: italic; font-size: clamp(1.25rem, 1.05rem + 1vw, 1.7rem); color: var(--ss-star); margin: 0.2em 0 0; }

.ss-section { position: relative; z-index: 1; padding: clamp(48px, 9vh, 96px) var(--gutter); }
.ss-section .prose { max-width: var(--measure); margin: 0 auto; }
.ss-label { font-family: var(--ss-sans); font-size: 0.78rem; letter-spacing: 0.34em; text-transform: uppercase; color: var(--ss-bronze); margin: 0 0 1em; }
.ss-people { max-width: 52rem; margin: 1.4rem auto 0; display: grid; gap: 22px; }
@media (min-width: 720px) { .ss-people { grid-template-columns: 1fr 1fr; } }
.ss-person { padding: 22px 24px 8px; border-top: 1px solid rgba(200,154,94,0.55); background: linear-gradient(180deg, rgba(23,52,95,0.35), rgba(8,20,43,0)); }
.ss-person h3 { margin-bottom: 0.4em; }
.ss-page .dates { border-top-color: rgba(200,154,94,0.3); }
.ss-page .dates li { border-bottom-color: rgba(200,154,94,0.3); }
.ss-line-logo { width: 96px; margin: 0 auto 18px; opacity: 0.8; }

/* v0.1.7: the bronze line logo at the bottom, bigger (Oct 1 call) */
.ss-line-logo { width: 220px; opacity: 0.9; }

/* v0.1.17 (Oct 4): white line logo, visually hidden title, collaborators line */
.vh{position:absolute!important;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}.ss-logo{width:min(70vw,320px)!important}
.ss-collab{margin-top:2rem}

/* v0.1.20: keep each event date on one line (e.g. THU, NOV 19) */
.dates .when{white-space:nowrap}