.overlay{
  position:fixed;
  inset:0;
  z-index:8;
  display:none;
  align-items:center;
  justify-content:center;
  padding:22px;
  background:rgba(0,0,0,.18);
  backdrop-filter:blur(10px);
}
@media (prefers-color-scheme: dark){
  .overlay{background:rgba(0,0,0,.32)}
}
.overlay[data-open="true"]{display:flex}
.overlay-shell{
  width:min(1120px, 96vw);
  height:min(760px, 90vh);
  background:var(--glass-strong);
  border:1px solid var(--border);
  border-radius:28px;
  box-shadow:0 36px 120px var(--shadow-strong);
  overflow:hidden;
  display:grid;
  grid-template-rows:auto minmax(0,1fr) auto;
  transform:translateY(12px) scale(.985);
  opacity:0;
  transition:transform .35s var(--ease), opacity .35s var(--ease);
}
.overlay[data-open="true"] .overlay-shell{
  transform:translateY(0) scale(1);
  opacity:1;
}
.overlay-top{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:14px;
  padding:18px 18px 16px;
  border-bottom:1px solid var(--border);
  background:linear-gradient(90deg, rgba(255,69,0,.14), transparent 55%), linear-gradient(180deg, rgba(254,204,157,.18), transparent);
}
.overlay-title{
  font-size:24px;
  font-weight:700;
  font-style:italic;
  letter-spacing:.4px;
  color:var(--ink);
}
.close-btn{
  width:44px;
  height:44px;
  border-radius:16px;
  border:1px solid var(--border);
  background:rgba(255,255,255,.06);
  color:var(--ink);
  font:700 28px/1 var(--font);
  cursor:pointer;
  display:grid;
  place-items:center;
}
.close-btn:focus-visible{outline:3px solid rgba(255,69,0,.36); outline-offset:3px}
.overlay-footer{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:18px;
  padding:14px 18px 16px;
  border-top:1px solid var(--border);
  background:linear-gradient(180deg, rgba(243,229,209,.14), rgba(243,229,209,.24));
}
.overlay-footer-copy{
  display:flex;
  flex-direction:column;
  gap:4px;
  min-width:0;
}
.overlay-footer-copy strong{
  color:var(--ink);
  font:700 16px/1.2 var(--font);
}
.overlay-footer-copy span{
  color:var(--ink-soft);
  font:600 13px/1.35 var(--font);
}
.overlay-footer-links{
  display:flex;
  align-items:center;
  gap:14px;
  flex-wrap:wrap;
  justify-content:flex-end;
}
.overlay-body{
  min-height:0;
  overflow:auto;
  padding:18px;
}
.widget-grid{
  display:grid;
  gap:16px;
  grid-template-columns:repeat(12, minmax(0, 1fr));
  align-items:start;
}
.card{
  background:linear-gradient(135deg, rgba(254,204,157,.42), rgba(243,229,209,.72));
  border:1px solid var(--border);
  border-radius:24px;
  box-shadow:0 22px 70px var(--shadow);
  padding:16px;
  overflow:hidden;
}
@media (prefers-color-scheme: dark){
  .card{background:linear-gradient(135deg, rgba(255,69,0,.09), rgba(18,6,6,.32))}
}
.card h3{
  margin:0 0 10px;
  font-size:22px;
  font-weight:700;
  letter-spacing:.2px;
}
.card p{margin:0; color:var(--ink-soft); font-size:18px; font-weight:500}
.subtle{color:var(--ink-soft)}
.btn{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:10px;
  padding:12px 14px;
  border-radius:16px;
  border:1px solid var(--border-2);
  background:linear-gradient(135deg, rgba(255,69,0,.12), rgba(138,28,28,.08));
  color:var(--ink);
  font:600 18px/1 var(--font);
  cursor:pointer;
  text-decoration:none;
  user-select:none;
}
.btn:focus-visible{outline:3px solid rgba(255,69,0,.36); outline-offset:3px}
.btn.primary{
  background:linear-gradient(135deg, rgba(255,69,0,.92), rgba(138,28,28,.82));
  color:var(--c-pearl);
  border-color:rgba(243,229,209,.24);
}
.wax{
  position:relative;
  padding-right:56px;
}
.wax::after{
  content:"";
  position:absolute;
  right:12px;
  top:50%;
  transform:translateY(-50%);
  width:34px;
  height:34px;
  border-radius:999px;
  background:radial-gradient(circle at 35% 30%, rgba(243,229,209,.72), rgba(255,69,0,.95) 55%, rgba(138,28,28,.92) 100%);
  box-shadow:0 10px 26px rgba(138,28,28,.24);
}
.grid-6{grid-column:span 6}
.grid-7{grid-column:span 7}
.grid-5{grid-column:span 5}
.grid-12{grid-column:span 12}
.grid-4{grid-column:span 4}
.grid-8{grid-column:span 8}
@media (max-width: 920px){
  .grid-7,.grid-6,.grid-5,.grid-4,.grid-8{grid-column:span 12}
  .overlay-shell{height:min(820px, 92vh)}
}
.rhombus-grid{
  display:grid;
  grid-template-columns:repeat(4, minmax(0, 1fr));
  gap:14px;
}
@media (max-width: 920px){
  .rhombus-grid{grid-template-columns:repeat(2, minmax(0, 1fr))}
}
@media (max-width: 520px){
  .rhombus-grid{grid-template-columns:1fr}
}
.rhombus{
  position:relative;
  aspect-ratio:1/1;
  border-radius:24px;
  border:1px solid var(--border);
  background:linear-gradient(135deg, rgba(138,28,28,.86), rgba(255,69,0,.62));
  box-shadow:0 18px 55px var(--shadow);
  display:grid;
  place-items:center;
  overflow:hidden;
  cursor:pointer;
  transform:rotate(45deg);
  transition:transform .35s var(--ease), filter .35s var(--ease);
}
.rhombus > *{transform:rotate(-45deg)}
.rhombus:hover{transform:rotate(45deg) scale(1.03); filter:contrast(1.03)}
.rhombus .label{
  text-align:center;
  padding:12px;
  color:var(--c-pearl);
}
.rhombus .label strong{
  display:block;
  font-size:18px;
  font-weight:700;
  letter-spacing:.4px;
}
.rhombus .label span{
  display:block;
  margin-top:6px;
  font-size:14px;
  opacity:.9;
}
.timeline{
  display:flex;
  align-items:center;
  gap:14px;
  overflow:auto;
  padding:10px 6px 18px;
  scroll-snap-type:x mandatory;
}
.node{
  flex:0 0 auto;
  width:14px;
  height:14px;
  border-radius:999px;
  background:rgba(243,229,209,.85);
  box-shadow:0 0 0 10px rgba(243,229,209,.16);
  scroll-snap-align:center;
  position:relative;
  cursor:pointer;
}
.node[data-kind="orchestra"]{background:var(--c-deep-red); box-shadow:0 0 0 10px rgba(138,28,28,.14)}
.node[data-kind="faculty"]{background:var(--c-orange); box-shadow:0 0 0 10px rgba(255,69,0,.16)}
.node[data-kind="student"]{background:var(--c-peach); box-shadow:0 0 0 10px rgba(254,204,157,.22)}
.node[data-kind="open"]{background:rgba(243,229,209,.9); box-shadow:0 0 0 10px rgba(243,229,209,.16)}
.ticket{
  position:absolute;
  left:50%;
  top:-10px;
  transform:translate(-50%,-100%);
  width:240px;
  padding:12px 12px 10px;
  border-radius:18px;
  background:var(--glass-strong);
  border:1px solid var(--border);
  box-shadow:0 20px 70px var(--shadow);
  opacity:0;
  pointer-events:none;
  transition:opacity .18s var(--ease);
}
.node:hover .ticket, .node:focus-visible .ticket{opacity:1}
.ticket strong{display:block; font-size:16px; margin-bottom:6px}
.ticket span{display:block; font-size:14px; color:var(--ink-soft)}
.form-row{
  display:flex;
  gap:12px;
  flex-wrap:wrap;
  align-items:center;
}
.select{
  display:flex;
  flex-direction:column;
  gap:8px;
}
select{
  height:44px;
  border-radius:16px;
  border:1px solid var(--border);
  background:rgba(255,255,255,.08);
  color:var(--ink);
  font:600 16px/1 var(--font);
  padding:0 12px;
}

/* --- Mini carousel (overlay widgets) --- */
.mini-carousel{
  position:relative;
  border-radius:20px;
  border:1px solid var(--border);
  background:rgba(255,255,255,.05);
  overflow:hidden;
}
.mini-carousel-viewport{overflow:hidden}
.mini-carousel-track{
  display:flex;
  transform:translateX(0);
  transition:transform .45s var(--ease);
  will-change:transform;
}
.mini-carousel-slide{min-width:100%;}
.mini-carousel-slide img{
  width:100%;
  height:clamp(320px, 48vh, 480px);
  object-fit:cover;
  display:block;
}
@media (max-width: 520px){
  .mini-carousel-slide img{height:240px}
}
.mini-carousel-caption{
  padding:14px 16px 84px;
  background:linear-gradient(180deg, rgba(0,0,0,0), rgba(0,0,0,.08));
}
.mini-carousel-caption strong{
  display:block;
  font-size:21px;
  font-weight:700;
  letter-spacing:.2px;
  color:var(--ink);
}
.mini-carousel-caption span{
  display:block;
  margin-top:6px;
  font-size:16px;
  color:var(--ink-soft);
}
.mini-carousel-nav{
  position:absolute;
  inset:auto 12px 12px 12px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
}
.carousel-btn{
  width:44px;
  height:44px;
  border-radius:16px;
  border:1px solid var(--border);
  background:rgba(255,255,255,.08);
  color:var(--ink);
  font:700 20px/1 var(--font);
  cursor:pointer;
  display:grid;
  place-items:center;
  box-shadow:0 16px 45px var(--shadow);
}
.carousel-btn:focus-visible{outline:3px solid rgba(255,69,0,.36); outline-offset:3px}
.mini-carousel-dots{
  display:flex;
  align-items:center;
  justify-content:center;
  gap:8px;
}
.dot-btn{
  width:10px;
  height:10px;
  border-radius:999px;
  border:1px solid var(--border);
  background:rgba(255,255,255,.12);
  cursor:pointer;
}
.dot-btn[aria-current="true"]{
  background:linear-gradient(135deg, rgba(255,69,0,.92), rgba(138,28,28,.82));
  border-color:rgba(243,229,209,.24);
}

.media-chip-row{
  display:flex;
  flex-wrap:wrap;
  gap:10px;
  margin-top:12px;
}
.media-chip{
  display:inline-flex;
  align-items:center;
  gap:8px;
  padding:10px 12px;
  border-radius:999px;
  border:1px solid var(--border);
  background:rgba(255,255,255,.06);
  color:var(--ink);
  font:600 14px/1 var(--font);
}


/* --- Overlay scrollbar palette (explicit targets) --- */
.overlay-body{
  scrollbar-width: thin;
  scrollbar-color: var(--c-orange) rgba(254,204,157,.35);
}
.overlay-body::-webkit-scrollbar{width:12px}
.overlay-body::-webkit-scrollbar-track{
  background:rgba(254,204,157,.35);
  border-radius:12px;
}
.overlay-body::-webkit-scrollbar-thumb{
  background:linear-gradient(180deg, rgba(255,69,0,.92), rgba(138,28,28,.82));
  border-radius:12px;
}
.overlay-body::-webkit-scrollbar-thumb:hover{
  background:linear-gradient(180deg, rgba(255,96,28,.95), rgba(176,74,43,.9));
}

/* Horizontal scrolls inside overlay */
.timeline{
  scrollbar-width: thin;
  scrollbar-color: var(--c-orange) rgba(254,204,157,.28);
}
.timeline::-webkit-scrollbar{height:10px}
.timeline::-webkit-scrollbar-track{
  background:rgba(254,204,157,.28);
  border-radius:12px;
}
.timeline::-webkit-scrollbar-thumb{
  background:linear-gradient(90deg, rgba(255,69,0,.92), rgba(138,28,28,.82));
  border-radius:12px;
}

/* --- "Enter section" card layout --- */
.section-enter{
  display:flex;
  justify-content:center;
  align-items:center;
  padding:24px;
}
.section-enter .btn{
  font-size:20px;
  padding:16px 20px;
  border-radius:18px;
}

/* --- Season calendar: click-to-select details --- */
.season-detail{
  margin-top:14px;
  padding:12px 14px;
  border-radius:18px;
  border:1px solid var(--border);
  background:rgba(255,255,255,.06);
  display:flex;
  flex-direction:column;
  gap:6px;
}
.season-detail strong{
  font-size:18px;
  font-weight:700;
  color:var(--ink);
}
.season-detail span{
  font-size:14px;
  color:var(--ink-soft);
}
.node.is-active{
  outline:3px solid rgba(255,69,0,.26);
  outline-offset:3px;
  box-shadow:0 0 0 12px rgba(255,69,0,.12);
}
.node[aria-current="true"]{ /* fallback */
  outline:3px solid rgba(255,69,0,.26);
  outline-offset:3px;
}


/* 15% font bump for card lists */
.card li{font-size:18px; line-height:1.55;}

/* --- Remove wax seal circle on buttons --- */
.wax{padding-right:16px !important;}
.wax::after{display:none !important;}


/* === Contact FAB + Modal === */
.contact-fab{
  position:fixed;
  right: calc(18px + env(safe-area-inset-right));
  bottom: calc(18px + env(safe-area-inset-bottom));
  z-index: 95;
  display:flex;
  align-items:center;
  gap:10px;
  padding:12px 14px;
  border-radius:999px;
  border:1px solid var(--border);
  background:rgba(243,229,209,.84);
  box-shadow:0 18px 50px var(--shadow);
  color:var(--ink);
  font:700 13px/1 var(--font);
  letter-spacing:.12em;
  text-transform:uppercase;
  cursor:pointer;
  backdrop-filter: blur(12px);
  -webkit-tap-highlight-color: transparent;
}
.contact-fab:hover{ transform: translateY(-1px); }
.contact-fab:focus-visible{ outline:3px solid rgba(255,69,0,.36); outline-offset:3px; }
body.overlay-active .contact-fab,
body.legal-open .contact-fab,
body.contact-open .contact-fab,
body.popup-open .contact-fab{
  opacity:0;
  visibility:hidden;
  pointer-events:none;
  transform:translateY(10px);
}
.contact-fab-ico{
  width:34px;
  height:34px;
  border-radius:999px;
  display:grid;
  place-items:center;
  background: linear-gradient(180deg, rgba(255,69,0,.16), rgba(138,28,28,.10));
  border:1px solid rgba(138,28,28,.18);
}
.contact-modal{
  position:fixed;
  inset:0;
  z-index:70;
  display:grid;
  place-items:center;
  opacity:0;
  pointer-events:none;
}
.contact-modal[data-open="true"]{
  opacity:1;
  pointer-events:auto;
}
.contact-backdrop{
  position:absolute;
  inset:0;
  background: rgba(35,6,6,.30);
  backdrop-filter: blur(6px);
}
.contact-card{
  position:relative;
  width:min(980px, calc(100vw - 40px));
  max-height: min(78vh, 760px);
  overflow:auto;
  border-radius:26px;
  border:1px solid var(--border);
  background: rgba(243,229,209,.90);
  box-shadow:0 30px 110px var(--shadow-strong);
  padding:22px 22px 16px;
}
.contact-close{
  position:absolute;
  top:14px;
  right:14px;
  width:38px;
  height:38px;
  border-radius:12px;
  border:1px solid var(--border);
  background: rgba(243,229,209,.95);
  color: var(--ink);
  cursor:pointer;
}
.contact-close:focus-visible{ outline:3px solid rgba(255,69,0,.36); outline-offset:3px; }
.contact-head h2{
  margin:0;
  font:700 28px/1.15 var(--font);
  color:var(--ink);
}
.contact-head p{
  margin:8px 0 0;
  color:var(--ink-soft);
}
.contact-grid{
  display:grid;
  grid-template-columns: 1.2fr .8fr;
  gap:18px;
  margin-top:16px;
}
@media (max-width: 860px){
  .contact-grid{ grid-template-columns:1fr; }
}
.contact-form label{
  display:grid;
  gap:6px;
  margin-bottom:12px;
}
.contact-form span{ color:var(--ink); font:600 14px/1.2 var(--font); }
.contact-form input, .contact-form textarea{
  width:100%;
  padding:12px 12px;
  border-radius:14px;
  border:1px solid rgba(138,28,28,.22);
  background: rgba(255,255,255,.64);
  color: var(--ink);
  font:500 15px/1.25 var(--font);
}
.contact-msg textarea{ resize: vertical; min-height: 120px; }
.contact-actions{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  flex-wrap:wrap;
  margin-top:8px;
}
.contact-submit{
  padding:12px 14px;
  border-radius:14px;
  border:1px solid rgba(138,28,28,.22);
  background: linear-gradient(180deg, rgba(255,69,0,.18), rgba(138,28,28,.10));
  color:var(--ink);
  font:700 15px/1 var(--font);
  cursor:pointer;
}
.contact-note{ margin:0; color:var(--ink-soft); font:500 13px/1.4 var(--font); }
.contact-details h3{ margin:0 0 10px; font:700 18px/1.1 var(--font); color:var(--ink); }
.contact-details ul{ margin:0; padding-left:18px; color:var(--ink-soft); }
.contact-mini{ margin-top:14px; }
.contact-mini h4{ margin:0 0 10px; font:700 15px/1.1 var(--font); color:var(--ink); }
.contact-chips{ display:flex; flex-wrap:wrap; gap:10px; }
.chip{
  display:inline-flex;
  padding:10px 12px;
  border-radius:999px;
  border:1px solid rgba(138,28,28,.20);
  background: rgba(255,255,255,.52);
  color:var(--ink);
  text-decoration:none;
  font:600 13px/1 var(--font);
}
.chip:hover{ transform: translateY(-1px); }
.contact-foot{
  display:flex;
  justify-content:flex-end;
  gap:14px;
  margin-top:14px;
  padding-top:12px;
  border-top:1px solid rgba(138,28,28,.14);
}
.legal-link{
  color:var(--ink-soft);
  text-decoration:none;
  font:600 13px/1 var(--font);
}
.legal-link:hover{ color:var(--ink); text-decoration:underline; }

/* === Legal modal === */
.legal-modal{
  position:fixed; inset:0; z-index:80;
  display:grid; place-items:center;
  opacity:0; pointer-events:none;
}
.legal-modal[data-open="true"]{ opacity:1; pointer-events:auto; }
.legal-backdrop{ position:absolute; inset:0; background: rgba(35,6,6,.32); backdrop-filter: blur(6px); }
.legal-card{
  position:relative;
  width:min(980px, calc(100vw - 40px));
  max-height: min(82vh, 820px);
  overflow:auto;
  border-radius:26px;
  border:1px solid var(--border);
  background: rgba(243,229,209,.92);
  box-shadow:0 30px 110px var(--shadow-strong);
  padding:20px 20px 16px;
}
.legal-close{
  position:absolute; top:14px; right:14px;
  width:38px; height:38px;
  border-radius:12px;
  border:1px solid var(--border);
  background: rgba(243,229,209,.96);
  color: var(--ink);
  cursor:pointer;
}
.legal-close:focus-visible{ outline:3px solid rgba(255,69,0,.36); outline-offset:3px; }
.legal-head h2{ margin:0; font:800 22px/1.1 var(--font); color:var(--ink); }
.legal-tabs{
  display:flex; gap:10px; flex-wrap:wrap;
  margin-top:10px;
}
.legal-tab{
  padding:10px 12px;
  border-radius:999px;
  border:1px solid rgba(138,28,28,.18);
  background: rgba(255,255,255,.52);
  color: var(--ink);
  font:700 13px/1 var(--font);
  cursor:pointer;
}
.legal-tab[aria-current="true"]{
  background: linear-gradient(180deg, rgba(255,69,0,.18), rgba(138,28,28,.10));
}
.legal-body{ margin-top:14px; color: var(--ink-soft); }
.legal-body h3{ margin:0 0 10px; color: var(--ink); font:800 20px/1.2 var(--font); }
.legal-body h4{ margin:14px 0 8px; color: var(--ink); font:800 15px/1.2 var(--font); }
.legal-body ul{ margin:0; padding-left:18px; }
.cookie-prefs{ margin-top:12px; display:grid; gap:10px; }
.cookie-toggle{
  display:flex; align-items:center; gap:10px;
  padding:12px 12px;
  border-radius:16px;
  border:1px solid rgba(138,28,28,.16);
  background: rgba(255,255,255,.50);
}
.cookie-actions{ display:flex; align-items:center; justify-content:space-between; gap:12px; flex-wrap:wrap; }
.cookie-save{
  padding:12px 14px;
  border-radius:14px;
  border:1px solid rgba(138,28,28,.22);
  background: linear-gradient(180deg, rgba(255,69,0,.18), rgba(138,28,28,.10));
  color:var(--ink);
  font:800 14px/1 var(--font);
  cursor:pointer;
}
.cookie-status{ margin:0; font:600 13px/1.4 var(--font); color: var(--ink-soft); }

/* === Cookie banner === */
.cookie-banner{
  position:fixed;
  left:12px;
  bottom:12px;
  width:min(430px, calc(100vw - 24px));
  max-width:calc(100vw - 24px);
  z-index:98;
  border-radius:22px;
  border:1px solid var(--border);
  background: rgba(243,229,209,.94);
  box-shadow:0 18px 60px var(--shadow);
  backdrop-filter: blur(12px);
  -webkit-backdrop-filter: blur(12px);
  opacity:0; transform: translateY(10px);
  pointer-events:none;
}
.cookie-banner[data-open="true"]{
  opacity:1; transform: translateY(0);
  pointer-events:auto;
}
.cookie-inner{
  display:flex; gap:14px; align-items:center; justify-content:space-between;
  padding:14px 14px;
}
.cookie-copy p{ margin:6px 0 0; }
.cookie-buttons{ display:flex; gap:10px; flex-wrap:wrap; justify-content:flex-end; }
.cookie-btn{
  padding:10px 12px;
  border-radius:999px;
  border:1px solid rgba(138,28,28,.18);
  background: rgba(255,255,255,.52);
  color: var(--ink);
  font:800 12px/1 var(--font);
  letter-spacing:.08em;
  text-transform:uppercase;
  cursor:pointer;
}
.cookie-btn.primary{
  background: linear-gradient(180deg, rgba(255,69,0,.20), rgba(138,28,28,.12));
}
@media (max-width: 680px){
  .cookie-banner{
    left:12px;
    right:12px;
    width:auto;
  }
  .cookie-inner{ flex-direction:column; align-items:flex-start; }
  .cookie-buttons{ width:100%; justify-content:flex-start; }
  .has-cookie-banner .contact-fab{
    bottom: calc(18px + 170px + env(safe-area-inset-bottom));
  }
}

.has-cookie-banner .back-btn{
  bottom: calc(18px + 132px + env(safe-area-inset-bottom));
}

@media (max-width: 760px){
  .overlay-footer{
    flex-direction:column;
    align-items:flex-start;
  }
  .overlay-footer-links{
    justify-content:flex-start;
  }
}