/* Sober variant (client's "academic, down-to-earth" direction).
   Level S: no motion, no orange. Level T: typographic restraint.
   Loaded after overrides.css only in the sober build. */

/* ---------- Level S ---------- */

/* No motion anywhere. Stillness is the signal. */
*,
*::before,
*::after {
  animation: none !important;
  transition: none !important;
}

/* Hero copy fully visible, no JS reveal states */
header .text,
header .text * {
  opacity: 1 !important;
  transform: none !important;
  visibility: visible !important;
}

/* Retire the remaining orange accents */
.button.accent,
.filter.accent {
  background: #000;
  border-color: #000;
  color: #f7f7f7;
}

/* Off-white circles so the black icons read on the black footer */
footer .container article.social-links ul.socials a,
footer .container-wide article.social-links ul.socials a {
  background: #f7f7f7;
}

section.big-image .label-top {
  color: #000;
}

.program-archive-item.active {
  --hover-bg: #000;
  --hover-border: #000;
}

/* Sponsor marquee becomes a still, centered logo row (first set only;
   the rest are loop duplicates) */
.sponsors-marquee .marquee .container .items-wrapper {
  transform: none !important;
  flex-wrap: wrap;
  justify-content: center;
  gap: 40px;
}

/* Partner logos in greyscale */
.sponsors-marquee .marquee .container .item img,
.sponsors-grid .sponsor img {
  filter: grayscale(1);
  opacity: 0.85;
}

/* Speaker grid: every card the same size (no double-size key speakers),
   photos uniformly square */
.speakers-grid .speaker.key-speaker,
section.speakers .container-wide .speakers-grid .speaker.key-speaker {
  grid-area: auto;
}
.speakers-grid .speaker img {
  width: 100%;
  height: auto;
  aspect-ratio: 1;
  object-fit: cover;
}

/* KIT page photo pairs: same height, top-aligned (no staggered offset) */
section.image-duo .item:nth-child(2) {
  margin-top: 0;
}

/* Homepage program highlights: still 2-column grid instead of a
   carousel; the frozen Swiper otherwise lays all cards in one
   unbounded row (visible on ultrawide screens) */
section.program .slider .items-wrapper {
  transform: none !important;
  flex-wrap: wrap;
  gap: 20px;
}
section.program .program-slider .item {
  width: calc(50% - 10px) !important;
  margin: 0 !important;
}
@media (max-width: 800px) {
  section.program .program-slider .item {
    width: 100% !important;
  }
}

/* Program cards: quieter titles, no hover inversion */
.program-archive-item .main h3,
section.program .program-item .main h3 {
  font-size: 2.2rem;
  line-height: 2.8rem;
  letter-spacing: .05rem;
}
.program-archive-item.active-hover:hover,
.program-archive-item.active-hover:focus-visible,
section.program .program-item.active-hover:hover,
section.program .program-item.active-hover:focus-visible {
  --hover-bg: #f7f7f7;
  --hover-border: #1014181f;
  --hover-color: #000;
}

/* Day filter: active state black, not orange */
section.program .container article.title .controls .day-filter button.active,
section.program .container-wide article.title .controls .day-filter button.active,
section.program-archive .container-wide .controls .day-control .day-tabs .day-tab.active {
  color: #000;
}

/* Program page: single TBA line under the day/space controls */
.program-archive-list .tba {
  text-align: center;
  padding: 48px 0 24px;
  font-size: 1.6rem;
  color: #4f4f4f;
}

/* Program sessions have no photos; cards size to their text */
section.program .portrait,
section.program-archive .portrait {
  display: none;
}
.program-archive-item .main {
  height: auto;
  min-height: 0;
}
.program-archive-item {
  align-items: flex-start;
}
.program-archive-item .description {
  align-self: flex-start;
}

/* Program list: stack of quiet rows, day subtitle carries the theme */
.program-archive-list {
  display: flex;
  flex-direction: column;
  gap: 12px;
}

/* Nav: cluster around the centered logo on very wide screens */
nav#nav-desktop .container {
  max-width: 1360px;
  margin-left: auto;
  margin-right: auto;
}

/* Nav: size items to their labels so seven fit around the logo */
nav#nav-desktop .container ul.nav-links li,
nav#nav-desktop .container ul.nav-links li a {
  width: auto;
  min-width: 0;
}
nav#nav-desktop .container ul.nav-links li a {
  padding: 0 16px;
}

/* Homepage stat arrows: graphite instead of orange */
section.text-stats ul.stats li svg path {
  fill: #4f4f4f;
}

/* Footer wordmark: graphite outline instead of orange */
footer .hero svg path {
  stroke: #4f4f4f;
}

/* ---------- Level T ---------- */

/* Display type: smaller, tighter, quieter */
h1,
.h1 {
  font-size: 5.2rem;
  line-height: 1.15;
  letter-spacing: 0.02em;
}

h2 {
  font-size: 3.4rem;
  line-height: 1.2;
  letter-spacing: 0.01em;
}

/* Split display headings (stacked h2 blocks): clearly below the page
   h1, which they otherwise outweigh at three lines of 4rem */
section.text-title article.title h2,
section.text-title article.title h2 h2 {
  font-size: 2.8rem;
  line-height: 1.2;
}

/* Venue page: the About KIT text block breathes before the FAQ,
   matching the air above it */
section.text-title + section.faq {
  padding-top: 40px;
}

/* Labels: less shouting */
.label {
  letter-spacing: 0.06em;
  color: #4f4f4f;
}

/* Body paragraphs justified within their existing (centered) frames;
   headings and labels stay centered. Hyphenation prevents rivers. */
header .container article.text p,
section article.text p,
section .container > p:not(.tba),
section.faq .faq-item .collapse,
.legal-page section.text-title article.text p {
  text-align: justify !important;
  hyphens: auto;
  -webkit-hyphens: auto;
}

/* More air between sections */
main section {
  padding-top: 72px;
  padding-bottom: 72px;
}

/* ...except directly under the hero, where a text section should sit
   one to two text rows below the tagline */
header:has(+ section.text-title) {
  margin-bottom: 16px;
}
header + section.text-title {
  margin-top: 0;
  padding-top: 0;
}

/* Pages with no body sections (press): breathe before the footer logo.
   The theme zeroes footer margin with !important, so match it. */
header + footer {
  margin-top: 48px !important;
}

/* Homepage headline on one line (desktop); wraps naturally on phones */
.home-page header .container article.text {
  max-width: none;
}
.home-page header h1 {
  white-space: nowrap;
  font-size: clamp(2.4rem, 3.6vw, 4.6rem);
}
@media (max-width: 700px) {
  .home-page header h1 {
    white-space: normal;
    font-size: 2.6rem;
  }
}

/* Framed content-width photo (program page) */
section.photo-framed .container {
  max-width: 960px;
  margin: 0 auto;
  padding: 0 20px;
}
section.photo-framed img {
  width: 100%;
  height: auto;
  display: block;
  border: 1px solid #1014181f;
  background: #f7f7f7;
  padding: 10px;
  box-sizing: border-box;
}
