:root {
  color-scheme: dark;
  --muted: #a6aaa3;
  --line: #2a3027;
  --darkline: #2a3027;
  --surface: #0b0f0b;
}
html,
body,
.prototype-bar,
.hero,
.schedule,
.home-contact,
.festival-footer,
.bottom-cta {
  background: #000;
}
.site-header {
  background: transparent;
  border-bottom-color: transparent;
  isolation: isolate;
}
.site-header::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: -1;
  pointer-events: none;
  background: rgba(0, 0, 0, var(--header-opacity, 0));
  transition: background-color 0.5s ease-in-out;
}
/* Every primary masthead starts behind the same transparent navigation. */
.page-home,
body:has(.about-page, .festival-submissions-page, .festival-committee-page,
  .news-main, .partners-page, .archive-page) {
  padding-top: 0;
}
.page-home .hero > .wrap {
  padding-top: var(--header-height);
}
.festival-submissions-page .festival-submission-intro {
  margin-top: 0;
}
.festival-submissions-page,
.festival-submissions-page .festival-preparation,
.festival-submissions-page .festival-timeline,
.festival-submissions-page .festival-preparation .festival-notice {
  background: #000;
}
.festival-submissions-page .festival-preparation,
.festival-submissions-page .festival-timeline {
  box-shadow: 0 0 0 100vmax #000;
}
/* Transparent borders extend each existing background under the navigation
   while preserving its content spacing at every responsive breakpoint. */
.festival-submission-intro > .festival-preparation,
.festival-committee-page .festival-jury-hero,
.news-main > .news-hero,
.partners-page > .partners-hero,
.archive-page > .archive-hero {
  border-top: var(--header-height) solid transparent;
  background-clip: border-box;
}
/* Match the news masthead: title first, then the green page label. */
.festival-submission-intro > .festival-preparation,
.festival-jury-hero > .festival-jury-wrap,
.partners-hero > .partners-wrap,
.archive-hero > .wrap {
  display: flex;
  flex-direction: column;
}
.festival-submission-intro > .festival-preparation > h1,
.festival-jury-hero > .festival-jury-wrap > h1,
.partners-hero > .partners-wrap > h1,
.archive-hero > .wrap > h1 {
  order: -1;
  margin: 0;
}
.festival-submission-intro > .festival-preparation > .kicker,
.festival-jury-hero > .festival-jury-wrap > .kicker,
.partners-hero > .partners-wrap > .partners-eyebrow,
.archive-hero > .wrap > .archive-eyebrow {
  margin: 24px 0 0;
}
.festival-submission-intro > .festival-preparation > .festival-notice {
  margin-top: 36px;
}
body,
.bottom-cta,
.imported-festival {
  color: var(--paper);
}
.bottom-cta {
  border-top: 1px solid var(--line);
}
.ticker {
  color: var(--ink);
}
.btn {
  color: var(--paper);
  border-color: #626b58;
}
.btn.primary {
  color: var(--ink);
  border-color: var(--lime);
}
.btn.light {
  border-color: #626b58;
}
.btn.dark {
  background: var(--surface);
  border-color: #626b58;
}
.category,
.schedule-grid,
.date-item,
.form-actions,
.summary-total,
.review-row,
.spec-table td,
.currency-tabs button,
.file-card {
  border-color: var(--line);
}
.date-item:first-child:before {
  background: var(--lime);
}
.date-item p,
.field-hint,
.summary-price small,
.summary-card .tiny,
.summary-foot h4,
.upload-controls {
  color: var(--muted);
}
.category-footer button {
  border-color: #626b58;
}
.category-footer button:hover {
  color: var(--ink);
}
.panel,
.form-panel,
.summary-card,
.table-wrap,
.admin-table,
.modal,
.stat,
.success-top,
.upload-zone,
.file-card {
  background: var(--surface);
  color: var(--paper);
  border-color: var(--line);
}
.admin-table th {
  background: #151b12;
}
input:not([type="checkbox"]):not([type="radio"]):not([type="file"]),
select,
textarea,
.auth-layout input,
.stack input,
.stack select,
.stack textarea,
.filter-bar input,
.filter-bar select {
  background: #070a07;
  color: var(--paper);
  border-color: #46503c;
}
.choice.selected,
.payment-method.selected,
.upload-zone.dragging {
  background: #14200e;
  border-color: var(--lime);
}
.demo-note,
.file-icon,
.status-pill {
  background: #15200f;
  color: var(--lime);
}
.progress {
  background: #273020;
}
.error-box {
  background: #2a1511;
  color: #ffb4a8;
  border-color: #8d5145;
}
#auth-error,
.error-message,
.danger {
  color: #ffb4a8;
}
.imported-festival .festival-prose .text-btn {
  color: var(--paper);
}
.imported-festival .festival-tile,
.imported-festival .festival-person-photo,
.imported-festival .festival-notice {
  background: var(--surface);
}
.imported-festival a.festival-tile:hover {
  background: #14200e;
  border-color: var(--lime);
}
.festival-dimensions li {
  color: var(--ink);
}
.imported-festival .festival-price {
  color: var(--paper) !important;
}
.about-hero {
  position: relative;
  isolation: isolate;
  overflow: hidden;
  min-height: calc(clamp(480px, calc(100svh - var(--header-height)), 640px) + var(--header-height));
  padding-top: var(--header-height);
  display: flex;
  align-items: center;
  background: #000;
}
.about-hero-image,
.about-hero-shade {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
}
.about-hero-image {
  object-fit: cover;
  object-position: center;
  filter: brightness(0.65) saturate(0.8);
}
.about-hero-shade {
  z-index: 1;
  background:
    linear-gradient(90deg, #0009, #0003 75%),
    linear-gradient(180deg, #0002 0%, #0004 55%, #000 100%);
}
.about-hero-content {
  position: relative;
  z-index: 2;
  padding-top: 48px;
  padding-bottom: 80px;
}
.about-hero .breadcrumb {
  color: #d0d4c9;
  margin-bottom: 40px;
}
.about-hero .kicker {
  color: var(--lime);
  margin-bottom: 24px;
}
.about-hero h1 {
  font: 700 clamp(48px, 5.5vw, 80px)/1.1 var(--display);
  letter-spacing: -2px;
  color: var(--paper);
  max-width: 12ch;
}
.about-hero-lead {
  max-width: 680px;
  margin-top: 32px;
  font-size: 18px;
  line-height: 1.9;
  color: #d0d4c9;
}
.about-page-content {
  padding-top: 24px;
  padding-bottom: 64px;
}
@media (max-width: 700px) {
  .about-hero {
    min-height: calc(500px + var(--header-height));
  }
  .about-hero-image {
    object-position: 60% center;
  }
  .about-hero-content {
    padding-top: 40px;
    padding-bottom: 64px;
  }
  .about-hero .breadcrumb {
    margin-bottom: 32px;
  }
  .about-hero h1 {
    font-size: clamp(44px, 12vw, 60px);
  }
  .about-hero-lead {
    font-size: 16px;
    margin-top: 24px;
  }
}
