:root{
  --midnight:#2C3E50;
  --gold:#D4AF37;
  --paper:#F4ECD8;
  --burgundy:#7B1E3A;
  --forest:#2A4739;
  --sienna:#A35638;
  --charcoal:#333333;
  --ink:#0E1420;
  --shadow:rgba(0,0,0,.28);
  --radius:18px;
  --radius-lg:26px;
  --focus:rgba(212,175,55,.9);
  --maxw:1160px;
  --ease:cubic-bezier(.2,.85,.2,1);
  --ease2:cubic-bezier(.25,.9,.2,1);
  --dur:720ms;
  --dur2:420ms;
  --panel-gap:10px;
  --topbar-h:60px;
  --sx:50%;
  --sy:50%;
}

*{box-sizing:border-box}
html,body{height:100%}
body{
  margin:0;
  font-family:system-ui,-apple-system,"Segoe UI",Roboto,Arial,sans-serif;
  background:radial-gradient(1000px 800px at 50% 20%, rgba(244,236,216,.12), transparent 60%), linear-gradient(180deg, #0B0F18 0%, #0B0F18 40%, #070A10 100%);
  color:var(--paper);
  overflow-x:hidden;
}

a{color:inherit}
img{max-width:100%;display:block}

.skip-link{
  position:absolute;
  left:12px;
  top:12px;
  padding:10px 12px;
  border-radius:12px;
  background:rgba(244,236,216,.12);
  backdrop-filter:blur(12px);
  border:1px solid rgba(244,236,216,.18);
  transform:translateY(-140%);
  transition:transform 220ms var(--ease);
  z-index:9999;
}
.skip-link:focus{transform:translateY(0); outline:2px solid var(--focus); outline-offset:2px}

.topbar{
  position:fixed;
  top:0;left:0;right:0;
  height:var(--topbar-h);
  display:flex;
  align-items:center;
  justify-content:space-between;
  padding:10px 14px;
  z-index:50;
  background:linear-gradient(180deg, rgba(7,10,16,.92), rgba(7,10,16,.60));
  border-bottom:1px solid rgba(244,236,216,.10);
  backdrop-filter:blur(12px);
}

.topbar-right{display:flex;gap:10px;align-items:center}

.home-btn,.sound-btn,.external-btn{
  appearance:none;
  border:1px solid rgba(244,236,216,.18);
  background:rgba(244,236,216,.08);
  color:var(--paper);
  border-radius:999px;
  padding:10px 12px;
  display:inline-flex;
  align-items:center;
  gap:10px;
  cursor:pointer;
  text-decoration:none;
  font-weight:600;
  letter-spacing:.01em;
  transition:transform 200ms var(--ease), background 200ms var(--ease), border-color 200ms var(--ease);
}
.home-btn:hover,.sound-btn:hover,.external-btn:hover{background:rgba(244,236,216,.12); transform:translateY(-1px)}
.home-btn:active,.sound-btn:active,.external-btn:active{transform:translateY(0)}
.home-btn:focus-visible,.sound-btn:focus-visible,.external-btn:focus-visible{outline:2px solid var(--focus); outline-offset:2px}
.home-ic,.sound-ic,.external-ic{font-size:18px; line-height:1}
.home-label,.sound-label,.external-label{font-size:13px}
.external-btn{background:rgba(212,175,55,.14); border-color:rgba(212,175,55,.30)}
.external-btn:hover{background:rgba(212,175,55,.18)}
.sound-btn[aria-pressed="true"]{background:rgba(212,175,55,.14); border-color:rgba(212,175,55,.30)}

main{padding-top:var(--topbar-h)}

.stage{
  min-height:calc(100vh - var(--topbar-h));
  display:flex;
  align-items:stretch;
  position:relative;
}

.stage-inner{
  width:100%;
  height:calc(100vh - var(--topbar-h));
  display:flex;
  gap:var(--panel-gap);
  padding:var(--panel-gap);
}

.panel-tabs{
  position:absolute;
  inset:0;
  z-index:6;
  display:flex;
  gap:var(--panel-gap);
  padding:var(--panel-gap);
  pointer-events:auto;
}

.panel-tabs .panel-trigger{
  position:relative;
  inset:auto;
  width:auto;
  height:auto;
  flex:1 1 0%;
  min-width:0;
}

body.is-open .panel-tabs{
  opacity:0;
  visibility:hidden;
  pointer-events:none;
}

.panel{
  position:relative;
  flex:1 1 0%;
  min-width:0;
  border-radius:var(--radius-lg);
  overflow:hidden;
  border:1px solid rgba(244,236,216,.12);
  box-shadow:0 22px 60px var(--shadow);
  isolation:isolate;
  cursor:pointer;
  user-select:none;
  -webkit-tap-highlight-color:rgba(212,175,55,.22);
  transition:flex var(--dur) var(--ease);
}

.panel-about{background:linear-gradient(180deg, rgba(123,30,58,.92), rgba(123,30,58,.78))}
.panel-courses{background:linear-gradient(180deg, rgba(42,71,57,.92), rgba(42,71,57,.78))}
.panel-shows{background:linear-gradient(180deg, rgba(44,62,80,.92), rgba(44,62,80,.78))}
.panel-people{background:linear-gradient(180deg, rgba(163,86,56,.92), rgba(163,86,56,.78))}
.panel-contacts{background:linear-gradient(180deg, rgba(58,38,72,.92), rgba(58,38,72,.78))}

.panel:before{
  content:"";
  position:absolute; inset:-40px;
  background:
    radial-gradient(800px 600px at 50% 20%, rgba(244,236,216,.12), transparent 60%),
    radial-gradient(800px 600px at 50% 120%, rgba(212,175,55,.08), transparent 60%);
  z-index:0;
  opacity:.9;
}

.panel-trigger{
  position:absolute;
  inset:0;
  z-index:2;
  border:0;
  background:transparent;
  color:inherit;
  cursor:pointer;
  user-select:none;
  padding:22px 16px;
  display:flex;
  flex-direction:column;
  justify-content:center;
  align-items:center;
  gap:14px;
  text-align:center;
  transition:filter 260ms var(--ease);
}
.panel-trigger:focus-visible{outline:2px solid var(--focus); outline-offset:-6px}
.panel-trigger:hover{filter:brightness(1.04)}
.panel-kicker{
  font-size:12px;
  letter-spacing:.14em;
  text-transform:uppercase;
  opacity:.86;
}
.panel-title{
  font-family:Georgia,"Times New Roman",Times,serif;
  font-weight:800;
  font-size:clamp(28px, 3.3vw, 58px);
  letter-spacing:.22em;
  text-transform:uppercase;
  writing-mode:vertical-rl;
  text-orientation:upright;
  transform:translateY(0);
  transition:transform var(--dur2) var(--ease2), letter-spacing var(--dur2) var(--ease2), writing-mode var(--dur2) var(--ease2);
  text-shadow:0 18px 60px rgba(0,0,0,.35);
}
.panel-hint{
  font-size:12px;
  opacity:.78;
  padding:8px 12px;
  border-radius:999px;
  background:rgba(244,236,216,.10);
  border:1px solid rgba(244,236,216,.14);
}

.panel-decor{
  position:absolute;
  inset:0;
  z-index:1;
  pointer-events:none;
  opacity:.65;
  color:rgba(244,236,216,.26);
}

.decor{
  position:absolute;
  filter:drop-shadow(0 18px 40px rgba(0,0,0,.28));
  transform:translate3d(calc(var(--px, 0px) * 1px), calc(var(--py, 0px) * 1px), 0);
  transition:opacity 220ms var(--ease);
  opacity:.95;
}

.decor-columns{left:10%; top:12%; animation:floatA 9.5s var(--ease2) infinite}
.decor-scroll{right:8%; bottom:10%; animation:floatB 11.5s var(--ease2) infinite}
.decor-brush{left:10%; bottom:10%; animation:floatB 11s var(--ease2) infinite}
.decor-compass{right:10%; top:10%; animation:floatA 9.2s var(--ease2) infinite}
.decor-masks{left:8%; top:12%; animation:floatA 10.2s var(--ease2) infinite}
.decor-spot{right:8%; bottom:10%; animation:floatB 12.2s var(--ease2) infinite}
.decor-monocle{left:8%; bottom:10%; animation:floatB 12.4s var(--ease2) infinite}
.decor-watch{right:10%; top:10%; animation:floatA 9.7s var(--ease2) infinite}
.decor-phone{left:10%; top:12%; animation:floatA 10.6s var(--ease2) infinite}
.decor-letter{right:8%; bottom:10%; animation:floatB 12.8s var(--ease2) infinite}

@keyframes floatA{
  0%,100%{transform:translate3d(calc(var(--px, 0px) * 1px), calc(var(--py, 0px) * 1px), 0) translateY(0)}
  50%{transform:translate3d(calc(var(--px, 0px) * 1px), calc(var(--py, 0px) * 1px), 0) translateY(-10px)}
}
@keyframes floatB{
  0%,100%{transform:translate3d(calc(var(--px, 0px) * 1px), calc(var(--py, 0px) * 1px), 0) translateY(0)}
  50%{transform:translate3d(calc(var(--px, 0px) * 1px), calc(var(--py, 0px) * 1px), 0) translateY(12px)}
}

.panel-content{
  position:absolute;
  inset:0;
  z-index:3;
  padding:24px clamp(16px, 2.4vw, 28px);
  overflow:auto;
  scrollbar-width:thin;
  scrollbar-color:var(--scroll-thumb, rgba(244,236,216,.30)) var(--scroll-track-solid, rgba(7,10,16,.22));
  opacity:0;
  pointer-events:none;
  transform:translateY(10px);
  transition:opacity var(--dur2) var(--ease2), transform var(--dur2) var(--ease2);
  cursor:auto;
}

.panel-content::-webkit-scrollbar{width:12px;height:12px}
.panel-content::-webkit-scrollbar-track{background:var(--scroll-track-webkit, rgba(7,10,16,.22))}
.panel-content::-webkit-scrollbar-thumb{
  background:var(--scroll-thumb, rgba(244,236,216,.30));
  border-radius:999px;
  border:3px solid rgba(0,0,0,0);
  background-clip:padding-box;
  box-shadow:inset 0 0 0 1px rgba(244,236,216,.14), 0 8px 18px rgba(0,0,0,.28);
}
.panel-content::-webkit-scrollbar-thumb:hover{background:var(--scroll-thumb-hover, rgba(244,236,216,.42))}
.panel-content::-webkit-scrollbar-corner{background:transparent}

.panel-head{
  max-width:var(--maxw);
  margin:0 auto 22px auto;
  padding-top:10px;
}

.section-title{
  font-family:Georgia,"Times New Roman",Times,serif;
  font-weight:800;
  font-size:clamp(30px, 3.2vw, 56px);
  margin:0 0 10px 0;
  letter-spacing:.02em;
}

.lead{
  margin:0 0 18px 0;
  font-size:clamp(15px, 1.15vw, 18px);
  line-height:1.6;
  color:rgba(244,236,216,.92);
  max-width:72ch;
}

.stats{
  display:grid;
  grid-template-columns:repeat(3, minmax(0,1fr));
  gap:12px;
  margin-top:14px;
}
.stat{
  border-radius:var(--radius);
  background:rgba(244,236,216,.08);
  border:1px solid rgba(244,236,216,.14);
  padding:12px 14px;
}
.stat-label{font-size:12px; opacity:.82; letter-spacing:.08em; text-transform:uppercase}
.stat-value{
  font-family:Georgia,"Times New Roman",Times,serif;
  font-weight:800;
  font-size:clamp(22px, 2.2vw, 34px);
  margin-top:6px;
  color:var(--paper);
}

.widget{
  max-width:var(--maxw);
  margin:0 auto 18px auto;
  border-radius:var(--radius-lg);
  background:rgba(7,10,16,.42);
  border:1px solid rgba(244,236,216,.12);
  padding:16px;
  backdrop-filter:blur(12px);
}

.widget-title-row{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:10px;
  margin-bottom:12px;
}
.widget-title{
  margin:0;
  font-family:Georgia,"Times New Roman",Times,serif;
  font-weight:800;
  letter-spacing:.02em;
  font-size:20px;
}
.muted{opacity:.78; font-size:13px}

.widget-actions{display:flex; gap:8px}
.icon-btn{
  appearance:none;
  border:1px solid rgba(244,236,216,.16);
  background:rgba(244,236,216,.08);
  color:var(--paper);
  border-radius:12px;
  padding:10px 12px;
  cursor:pointer;
  transition:transform 180ms var(--ease), background 180ms var(--ease);
}
.icon-btn:hover{transform:translateY(-1px); background:rgba(244,236,216,.12)}
.icon-btn:active{transform:translateY(0)}
.icon-btn:focus-visible{outline:2px solid var(--focus); outline-offset:2px}

.timeline{
  display:flex;
  gap:12px;
  overflow:auto;
  scroll-snap-type:x mandatory;
  padding:4px 2px 10px 2px;
  border-radius:18px;
  outline:none;
}
.timeline:focus-visible{outline:2px solid var(--focus); outline-offset:4px}
.tl-item{
  flex:0 0 min(360px, 84vw);
  scroll-snap-align:start;
  border-radius:18px;
  background:rgba(244,236,216,.08);
  border:1px solid rgba(244,236,216,.14);
  padding:14px 14px 16px 14px;
  min-height:132px;
}
.tl-year{
  font-family:Georgia,"Times New Roman",Times,serif;
  font-weight:800;
  font-size:22px;
  letter-spacing:.03em;
  color:rgba(212,175,55,.92);
}
.tl-body{margin-top:8px; line-height:1.6; color:rgba(244,236,216,.92)}

.sr-note{
  margin:10px 0 0 0;
  font-size:13px;
  opacity:.78;
}

.gallery-grid{
  display:grid;
  grid-template-columns:repeat(3, minmax(0, 1fr));
  gap:12px;
}
.card{
  border-radius:18px;
  overflow:hidden;
  border:1px solid rgba(244,236,216,.14);
  background:rgba(244,236,216,.06);
}
.figure img{aspect-ratio:4/3; object-fit:cover}
.figure figcaption{padding:12px 12px 14px 12px; font-size:13px; line-height:1.5; opacity:.92}

.cta-row{
  display:flex;
  gap:10px;
  flex-wrap:wrap;
  margin-top:12px;
}

.cta{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:10px;
  text-decoration:none;
  border-radius:999px;
  padding:12px 14px;
  font-weight:700;
  letter-spacing:.01em;
  border:1px solid rgba(212,175,55,.34);
  background:rgba(212,175,55,.16);
  color:var(--paper);
  cursor:pointer;
  transition:transform 200ms var(--ease), background 200ms var(--ease), border-color 200ms var(--ease);
}
.cta:hover{transform:translateY(-1px); background:rgba(212,175,55,.20)}
.cta:active{transform:translateY(0)}
.cta:focus-visible{outline:2px solid var(--focus); outline-offset:2px}
.cta-ghost{
  background:rgba(244,236,216,.08);
  border-color:rgba(244,236,216,.18);
}
.cta-ghost:hover{background:rgba(244,236,216,.12)}

.pill-row{display:flex; gap:10px; flex-wrap:wrap; margin-top:10px}
.pill{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  border-radius:999px;
  padding:10px 12px;
  border:1px solid rgba(244,236,216,.18);
  background:rgba(244,236,216,.08);
  text-decoration:none;
  font-weight:600;
  font-size:13px;
  transition:transform 180ms var(--ease), background 180ms var(--ease);
}
.pill:hover{transform:translateY(-1px); background:rgba(244,236,216,.12)}
.pill:focus-visible{outline:2px solid var(--focus); outline-offset:2px}

.courses-grid{
  display:grid;
  grid-template-columns:repeat(2, minmax(0,1fr));
  gap:12px;
  margin-top:10px;
}

.course-card{
  position:relative;
  border:1px solid rgba(244,236,216,.14);
  background:rgba(244,236,216,.06);
  border-radius:22px;
  overflow:hidden;
  padding:0;
  cursor:pointer;
  text-align:left;
  min-height:260px;
  transition:transform 220ms var(--ease), border-color 220ms var(--ease), background 220ms var(--ease);
}
.course-card:hover{transform:translateY(-2px); background:rgba(244,236,216,.08); border-color:rgba(212,175,55,.24)}
.course-card:focus-visible{outline:2px solid var(--focus); outline-offset:2px}

.course-face{
  position:absolute;
  inset:0;
  display:flex;
  align-items:center;
  justify-content:center;
  backface-visibility:hidden;
  transform-style:preserve-3d;
  transition:transform 700ms var(--ease);
}
.course-front{transform:rotateY(0)}
.course-back{
  transform:rotateY(180deg);
  padding:18px;
}

.course-card.is-flipped .course-front{transform:rotateY(-180deg)}
.course-card.is-flipped .course-back{transform:rotateY(0)}
.course-meta{display:flex; flex-direction:column; gap:10px}
.course-name{
  font-family:Georgia,"Times New Roman",Times,serif;
  font-weight:800;
  font-size:22px;
}
.course-desc{line-height:1.6; opacity:.92}
.course-details{font-size:13px; opacity:.88; line-height:1.6}

.polaroid{
  width:100%;
  height:100%;
  display:flex;
  flex-direction:column;
  padding:12px;
  gap:10px;
  background:rgba(244,236,216,.92);
  color:rgba(10,14,22,.92);
  border-radius:22px;
}
.polaroid img{
  border-radius:16px;
  height:100%;
  max-height:170px;
  object-fit:cover;
}
.polaroid-caption{
  font-family:Georgia,"Times New Roman",Times,serif;
  font-weight:800;
  letter-spacing:.01em;
  font-size:18px;
  padding:2px 4px 6px 4px;
}

.booking{margin-top:14px}
.booking-panel{margin-top:12px}
.reserve-form{
  display:grid;
  gap:12px;
  padding:14px;
  border-radius:22px;
  background:rgba(244,236,216,.06);
  border:1px solid rgba(244,236,216,.14);
}
.field{display:grid; gap:6px}
label{font-weight:700; font-size:13px; letter-spacing:.02em}
input,select,textarea{
  width:100%;
  border-radius:16px;
  border:1px solid rgba(244,236,216,.18);
  background:rgba(7,10,16,.50);
  color:var(--paper);
  padding:12px 12px;
  font:inherit;
  outline:none;
}
textarea{resize:vertical}
input:focus,select:focus,textarea:focus{outline:2px solid var(--focus); outline-offset:2px}
.form-actions{display:flex; flex-wrap:wrap; gap:10px; margin-top:4px}
.form-note{margin:8px 0 0 0; min-height:18px; font-size:13px; opacity:.88}

.ticket-row{display:flex; gap:10px; align-items:center; flex-wrap:wrap; margin-top:12px}
.ticket-btn{
  position:relative;
  display:inline-flex;
  flex-direction:column;
  gap:4px;
  padding:12px 16px;
  border-radius:18px;
  text-decoration:none;
  color:var(--paper);
  border:1px dashed rgba(212,175,55,.70);
  background:linear-gradient(180deg, rgba(212,175,55,.20), rgba(212,175,55,.10));
  box-shadow:0 16px 46px rgba(0,0,0,.28);
  transition:transform 200ms var(--ease), background 200ms var(--ease);
}
.ticket-btn:hover{transform:translateY(-1px); background:linear-gradient(180deg, rgba(212,175,55,.24), rgba(212,175,55,.12))}
.ticket-btn:focus-visible{outline:2px solid var(--focus); outline-offset:2px}
.ticket-top{
  font-family:Georgia,"Times New Roman",Times,serif;
  font-weight:800;
  letter-spacing:.02em;
  font-size:18px;
}
.ticket-bottom{font-size:12px; opacity:.86}
.ticket-btn:before,.ticket-btn:after{
  content:"";
  position:absolute;
  top:50%;
  width:14px;height:14px;
  background:rgba(7,10,16,.60);
  border-radius:50%;
  transform:translateY(-50%);
}
.ticket-btn:before{left:-7px}
.ticket-btn:after{right:-7px}

.widget-shows{position:relative}
.spotlight-layer{
  position:absolute;
  inset:0;
  pointer-events:none;
  border-radius:var(--radius-lg);
  background:radial-gradient(circle at var(--sx) var(--sy), rgba(244,236,216,.14) 0%, rgba(244,236,216,.08) 18%, rgba(7,10,16,.20) 42%, rgba(7,10,16,.52) 66%, rgba(7,10,16,.68) 100%);
  mix-blend-mode:screen;
  opacity:.9;
  transition:opacity 220ms var(--ease);
}

.carousel{
  display:flex;
  gap:12px;
  overflow:auto;
  scroll-snap-type:x mandatory;
  padding:4px 2px 10px 2px;
  border-radius:18px;
  outline:none;
}
.carousel:focus-visible{outline:2px solid var(--focus); outline-offset:4px}
.event-card{
  flex:0 0 min(420px, 86vw);
  scroll-snap-align:start;
  border-radius:18px;
  overflow:hidden;
  border:1px solid rgba(244,236,216,.14);
  background:rgba(244,236,216,.06);
}
.event-card img{aspect-ratio:16/9; object-fit:cover}
.event-body{padding:14px 14px 16px 14px}
.event-kicker{font-size:12px; text-transform:uppercase; letter-spacing:.14em; opacity:.82}
.event-title{
  font-family:Georgia,"Times New Roman",Times,serif;
  font-weight:800;
  margin:8px 0 6px 0;
  font-size:20px;
  letter-spacing:.01em;
}
.event-desc{margin:0; line-height:1.6; opacity:.92}
.event-meta{margin-top:10px; font-size:13px; opacity:.82}

.people-grid{
  display:grid;
  grid-template-columns:repeat(3, minmax(0,1fr));
  gap:12px;
}
.person-card{
  border-radius:22px;
  border:1px solid rgba(244,236,216,.14);
  background:rgba(244,236,216,.06);
  padding:16px;
  display:grid;
  gap:10px;
  align-content:start;
  transition:transform 220ms var(--ease), border-color 220ms var(--ease), background 220ms var(--ease);
}
.person-card:hover{transform:translateY(-2px); background:rgba(244,236,216,.08); border-color:rgba(212,175,55,.22)}
.avatar{
  width:84px;height:84px;
  border-radius:50%;
  display:grid;
  place-items:center;
  font-weight:800;
  letter-spacing:.06em;
  background:
    radial-gradient(40px 40px at 30% 30%, rgba(244,236,216,.18), transparent 60%),
    linear-gradient(145deg, rgba(244,236,216,.12), rgba(7,10,16,.30));
  border:1px solid rgba(244,236,216,.18);
  filter:grayscale(1);
  transition:filter 220ms var(--ease), transform 220ms var(--ease);
}
.person-card:hover .avatar{filter:grayscale(0); transform:translateY(-1px)}
.person-name{
  margin:0;
  font-family:Georgia,"Times New Roman",Times,serif;
  font-weight:800;
  letter-spacing:.01em;
  font-size:18px;
}
.person-role{margin:0; opacity:.86; line-height:1.5}
.person-actions{margin-top:4px}
.note-btn{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  text-decoration:none;
  padding:10px 12px;
  border-radius:999px;
  border:1px solid rgba(244,236,216,.18);
  background:rgba(244,236,216,.08);
  font-weight:700;
  font-size:13px;
  transition:transform 200ms var(--ease), background 200ms var(--ease);
}
.note-btn:hover{transform:translateY(-1px); background:rgba(244,236,216,.12)}
.note-btn:focus-visible{outline:2px solid var(--focus); outline-offset:2px}

.contact-grid{
  display:grid;
  grid-template-columns:1.15fr .85fr;
  gap:12px;
}
.map-wrap{
  position:relative;
  border-radius:22px;
  overflow:hidden;
  border:1px solid rgba(244,236,216,.14);
  background:rgba(244,236,216,.06);
  min-height:520px;
}
.map{
  width:100%;
  height:100%;
  border:0;
  filter:sepia(.55) contrast(1.06) saturate(.75);
}
.map-overlay{
  position:absolute;
  inset:0;
  background:radial-gradient(900px 600px at 30% 20%, rgba(244,236,216,.08), transparent 55%), linear-gradient(180deg, rgba(7,10,16,.22), rgba(7,10,16,.44));
  pointer-events:none;
}
.map-actions{
  position:absolute;
  left:12px;
  bottom:12px;
  display:flex;
  gap:10px;
  flex-wrap:wrap;
}

.logbook{
  border-radius:22px;
  border:1px solid rgba(244,236,216,.14);
  background:linear-gradient(180deg, rgba(244,236,216,.92), rgba(244,236,216,.84));
  color:rgba(10,14,22,.92);
  padding:16px;
}
.logbook .widget-title{color:rgba(10,14,22,.96)}
.logbook .muted{opacity:.74}
.contact-info{display:grid; gap:10px; margin:12px 0}
.info-row{display:flex; gap:10px; align-items:flex-start; line-height:1.55}
.info-ic{width:20px; opacity:.7}
.logbook a{color:rgba(10,14,22,.92)}
.guestbook{
  display:grid;
  gap:12px;
  padding:14px;
  border-radius:22px;
  background:rgba(10,14,22,.06);
  border:1px solid rgba(10,14,22,.10);
}
.logbook input,.logbook select,.logbook textarea{
  background:rgba(244,236,216,.70);
  border-color:rgba(10,14,22,.18);
  color:rgba(10,14,22,.92);
}
.logbook input:focus,.logbook select:focus,.logbook textarea:focus{outline:2px solid rgba(44,62,80,.85); outline-offset:2px}

.footer{max-width:var(--maxw); margin:18px auto 40px auto}
.footer-inner{
  display:flex;
  justify-content:space-between;
  gap:10px;
  flex-wrap:wrap;
  padding:14px 2px;
  opacity:.86;
}
.footer-right{display:flex; gap:12px; flex-wrap:wrap}
.footer a{opacity:.92}
.footer a:focus-visible{outline:2px solid var(--focus); outline-offset:2px}

.fallback{display:none}
.no-js .fallback{display:block; padding:24px; max-width:var(--maxw); margin:0 auto}
.no-js .stage{display:none}

body.is-open .panel-trigger{pointer-events:none}
body.is-open .panel{border-color:rgba(212,175,55,.22)}
body.is-open .panel[data-active="true"]{flex:40 1 0%}
body.is-open .panel[data-active="true"]{cursor:auto}
body.is-open .panel[data-active="false"]{flex:1 1 0%}
body.is-open .panel[data-active="true"] .panel-content{
  opacity:1;
  pointer-events:auto;
  transform:translateY(0);
}
body.is-open .panel[data-active="true"] .panel-title{
  writing-mode:horizontal-tb;
  text-orientation:mixed;
  letter-spacing:.08em;
}

body.is-open .panel[data-active="true"] .panel-trigger{
  position:sticky;
  top:0;
  inset:auto;
  height:auto;
  min-height:0;
  padding:14px 14px 12px 14px;
  align-items:flex-start;
  justify-content:flex-start;
  text-align:left;
  gap:8px;
  background:linear-gradient(180deg, rgba(7,10,16,.84), rgba(7,10,16,.30));
  border-bottom:1px solid rgba(244,236,216,.10);
  backdrop-filter:blur(10px);
}
body.is-open .panel[data-active="true"] .panel-trigger .panel-hint{display:none}
body.is-open .panel[data-active="true"] .panel-trigger .panel-kicker{opacity:.92}
body.is-open .panel[data-active="true"] .panel-trigger .panel-title{font-size:18px}

@media (max-width: 980px){
  .stats{grid-template-columns:1fr; gap:10px}
  .gallery-grid{grid-template-columns:1fr}
  .courses-grid{grid-template-columns:1fr}
  .people-grid{grid-template-columns:1fr}
  .contact-grid{grid-template-columns:1fr}
  .map-wrap{min-height:340px}
}

@media (max-width: 860px){
  .stage-inner,
  .panel-tabs{
    display:grid;
    grid-template-columns:1fr;
    height:auto;
    min-height:100vh;
    gap:12px;
    padding:
      calc(var(--panel-gap) + env(safe-area-inset-top) + 62px)
      max(14px, calc(var(--panel-gap) + env(safe-area-inset-right) + 4px))
      calc(var(--panel-gap) + env(safe-area-inset-bottom) + 70px)
      max(14px, calc(var(--panel-gap) + env(safe-area-inset-left) + 4px));
  }
  .panel-tabs .panel-trigger{
    width:min(100%, 680px);
    min-height:132px;
    margin-inline:auto;
  }
  .panel{
    min-height:132px;
    width:min(100%, 680px);
    margin-inline:auto;
    box-shadow:0 18px 46px rgba(0,0,0,.30);
  }
  .panel-title{
    writing-mode:horizontal-tb;
    letter-spacing:.10em;
    font-size:clamp(22px, 6.8vw, 34px);
  }
  .panel-trigger{
    position:relative;
    padding:18px 18px;
    align-items:flex-start;
    text-align:left;
  }
  .panel-hint{align-self:flex-start}
  .panel-decor{opacity:.46}

  body:not(.is-open) .panel-trigger,
  body.is-open .panel[data-active="false"] .panel-trigger{
    position:absolute;
    inset:0;
    width:100%;
    height:100%;
  }

  body.is-open .panel[data-active="true"]{
    position:fixed;
    inset:
      max(12px, calc(env(safe-area-inset-top) + 12px))
      max(12px, calc(env(safe-area-inset-right) + 12px))
      max(12px, calc(env(safe-area-inset-bottom) + 12px))
      max(12px, calc(env(safe-area-inset-left) + 12px));
    z-index:60;
    flex:none;
    width:auto;
    height:auto;
  }
  body.is-open .panel[data-active="false"]{display:none}
  body.is-open .panel[data-active="true"] .panel-content{padding-bottom:26px}
}

@media (prefers-reduced-motion: reduce){
  :root{--dur:1ms; --dur2:1ms}
  .decor{animation:none}
  .panel-content{transform:none}
  .spotlight-layer{opacity:.55}
  .course-face{transition:transform 1ms linear}
  .course-card:hover{transform:none}
  .person-card:hover{transform:none}
  .icon-btn:hover{transform:none}
  .cta:hover{transform:none}
  .pill:hover{transform:none}
  .home-btn:hover,.sound-btn:hover,.external-btn:hover{transform:none}
}


:root{--topbar-h:0px}
main{padding-top:0}
.stage{min-height:100vh}
.stage-inner,
.panel-tabs{height:100vh; padding:calc(var(--panel-gap) + env(safe-area-inset-top)) calc(var(--panel-gap) + env(safe-area-inset-right)) calc(var(--panel-gap) + env(safe-area-inset-bottom)) calc(var(--panel-gap) + env(safe-area-inset-left))}
.panel-title{font-size:clamp(22px, 2.8vw, 50px); letter-spacing:.18em}
body.is-open .panel-trigger{pointer-events:auto}
body.is-open .panel[data-active="true"] .panel-trigger{opacity:0; pointer-events:none}
body.is-open .panel[data-active="false"] .panel-trigger{padding:18px 10px}
body.is-open .panel[data-active="false"] .panel-kicker{display:none}
body.is-open .panel[data-active="false"] .panel-hint{display:none}
body.is-open .panel[data-active="false"] .panel-title{font-size:clamp(14px, 1.35vw, 22px); letter-spacing:.14em; opacity:.92}

.panel-top{
  position:sticky;
  top:0;
  z-index:12;
  display:flex;
  align-items:center;
  gap:10px;
  padding:10px 0 12px 0;
  margin-bottom:10px;
  background:linear-gradient(180deg, rgba(7,10,16,.82) 0%, rgba(7,10,16,.58) 50%, rgba(7,10,16,0) 100%);
  backdrop-filter:blur(10px);
}
.back-btn{
  appearance:none;
  border:1px solid rgba(244,236,216,.18);
  background:rgba(244,236,216,.08);
  color:var(--paper);
  border-radius:999px;
  padding:10px 12px;
  display:inline-flex;
  align-items:center;
  gap:10px;
  cursor:pointer;
  font-weight:700;
  letter-spacing:.01em;
  transition:transform 180ms var(--ease), background 180ms var(--ease);
  flex:0 0 auto;
}
.back-btn:hover{transform:translateY(-1px); background:rgba(244,236,216,.12)}
.back-btn:active{transform:translateY(0)}
.back-btn:focus-visible{outline:2px solid var(--focus); outline-offset:2px}
.back-ic{font-size:18px; line-height:1}
.back-tx{font-size:13px}
.panel-top-label{
  font-family:Georgia,"Times New Roman",Times,serif;
  font-weight:800;
  letter-spacing:.02em;
  font-size:16px;
  opacity:.92;
  flex:0 0 auto;
}
.panel-switch{
  display:flex;
  gap:8px;
  margin-left:auto;
  overflow:auto;
  padding-bottom:2px;
  scrollbar-width:none;
}
.panel-switch::-webkit-scrollbar{display:none}
.switch-pill{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  border-radius:999px;
  padding:10px 12px;
  border:1px solid rgba(244,236,216,.18);
  background:rgba(244,236,216,.06);
  text-decoration:none;
  font-weight:700;
  font-size:12px;
  letter-spacing:.02em;
  white-space:nowrap;
  transition:transform 160ms var(--ease), background 160ms var(--ease), border-color 160ms var(--ease);
}
.switch-pill:hover{transform:translateY(-1px); background:rgba(244,236,216,.10)}
.switch-pill:active{transform:translateY(0)}
.switch-pill:focus-visible{outline:2px solid var(--focus); outline-offset:2px}
.switch-pill[aria-current="page"]{background:rgba(212,175,55,.16); border-color:rgba(212,175,55,.32)}
@media (max-width: 520px){
  .panel-top-label{display:none}
  .back-tx{display:none}
  .back-btn{padding:10px 10px}
}

@media (max-width: 520px){
  .panel-switch{gap:6px}
  .switch-pill{padding:9px 10px; font-size:11px}
}
@media (max-width: 390px){
  .panel-switch{gap:5px}
  .switch-pill{padding:8px 9px; font-size:10px}
}
@media (min-width: 861px){
  .panel-content .panel-top .panel-switch{display:none}
}

.timeline,.carousel{
  scrollbar-width:none;
  -ms-overflow-style:none;
}
.timeline::-webkit-scrollbar,.carousel::-webkit-scrollbar{
  width:0;
  height:0;
}

body.is-open[data-active-panel="about"]{--active-panel-bg:linear-gradient(180deg, rgba(123,30,58,.92), rgba(123,30,58,.78));--scroll-track-webkit:var(--active-panel-bg);--scroll-track-solid:rgba(123,30,58,.55);--scroll-thumb:rgba(43,9,18,.92);--scroll-thumb-hover:rgba(31,6,13,.95)}
body.is-open[data-active-panel="courses"]{--active-panel-bg:linear-gradient(180deg, rgba(42,71,57,.92), rgba(42,71,57,.78));--scroll-track-webkit:var(--active-panel-bg);--scroll-track-solid:rgba(42,71,57,.55);--scroll-thumb:rgba(18,31,24,.92);--scroll-thumb-hover:rgba(12,22,17,.95)}
body.is-open[data-active-panel="shows"]{--active-panel-bg:linear-gradient(180deg, rgba(44,62,80,.92), rgba(44,62,80,.78));--scroll-track-webkit:var(--active-panel-bg);--scroll-track-solid:rgba(44,62,80,.55);--scroll-thumb:rgba(16,27,39,.92);--scroll-thumb-hover:rgba(12,21,31,.95)}
body.is-open[data-active-panel="people"]{--active-panel-bg:linear-gradient(180deg, rgba(163,86,56,.92), rgba(163,86,56,.78));--scroll-track-webkit:var(--active-panel-bg);--scroll-track-solid:rgba(163,86,56,.52);--scroll-thumb:rgba(69,35,21,.92);--scroll-thumb-hover:rgba(55,28,17,.95)}
body.is-open[data-active-panel="contacts"]{--active-panel-bg:linear-gradient(180deg, rgba(58,38,72,.92), rgba(58,38,72,.78));--scroll-track-webkit:var(--active-panel-bg);--scroll-track-solid:rgba(58,38,72,.58);--scroll-thumb:rgba(28,16,40,.92);--scroll-thumb-hover:rgba(20,12,30,.95)}
/* keep inactive side panels in their own colors instead of inheriting the active panel color */
body.is-open .panel-about[data-active="false"]{background:linear-gradient(180deg, rgba(123,30,58,.92), rgba(123,30,58,.78))}
body.is-open .panel-courses[data-active="false"]{background:linear-gradient(180deg, rgba(42,71,57,.92), rgba(42,71,57,.78))}
body.is-open .panel-shows[data-active="false"]{background:linear-gradient(180deg, rgba(44,62,80,.92), rgba(44,62,80,.78))}
body.is-open .panel-people[data-active="false"]{background:linear-gradient(180deg, rgba(163,86,56,.92), rgba(163,86,56,.78))}
body.is-open .panel-contacts[data-active="false"]{background:linear-gradient(180deg, rgba(58,38,72,.92), rgba(58,38,72,.78))}

.figure figcaption .inline-link{color:var(--gold); text-decoration:none; border-bottom:1px dashed rgba(212,175,55,.45)}
.figure figcaption .inline-link:hover{border-bottom-color:rgba(212,175,55,.8)}
.figure figcaption .inline-link:focus-visible{outline:2px solid var(--focus); outline-offset:3px; border-bottom-color:transparent}

.steps{
  display:flex;
  flex-wrap:wrap;
  gap:10px;
  margin-top:14px;
}
.step{
  display:flex;
  align-items:center;
  gap:10px;
  padding:10px 12px;
  border-radius:999px;
  border:1px solid rgba(244,236,216,.18);
  background:rgba(7,10,16,.26);
  box-shadow:0 10px 24px rgba(0,0,0,.18);
  font-size:13px;
}
.step-n{
  width:22px;
  height:22px;
  display:grid;
  place-items:center;
  border-radius:999px;
  background:rgba(212,175,55,.18);
  border:1px solid rgba(212,175,55,.32);
  font-weight:800;
  color:var(--paper);
}
.step-t{color:rgba(244,236,216,.92)}

.widget-courses .course-card{
  cursor:default;
  min-height:0;
  padding:14px;
  border-radius:var(--radius-md);
  border:1px solid rgba(244,236,216,.14);
  background:rgba(7,10,16,.22);
  display:flex;
  flex-direction:column;
  gap:12px;
}
.widget-courses .course-card:hover{transform:translateY(-2px)}
.course-img{
  width:100%;
  aspect-ratio:16/9;
  border-radius:16px;
  object-fit:cover;
  border:1px solid rgba(244,236,216,.12);
  background:rgba(0,0,0,.15);
}
.course-name{
  font-family:Georgia,"Times New Roman",Times,serif;
  font-weight:800;
  font-size:18px;
  letter-spacing:.02em;
  margin:0 0 6px;
}
.course-desc{margin:0 0 10px; color:rgba(244,236,216,.86)}
.course-details{margin:0; color:rgba(244,236,216,.80); font-size:13px; line-height:1.55}
.course-actions{margin-top:12px}

.event-actions{
  display:flex;
  gap:10px;
  flex-wrap:wrap;
  align-items:center;
  margin-top:10px;
}
.event-action{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  padding:8px 12px;
  border-radius:999px;
  border:1px solid rgba(244,236,216,.18);
  background:rgba(7,10,16,.26);
  color:rgba(244,236,216,.95);
  text-decoration:none;
  font-weight:800;
  letter-spacing:.06em;
  text-transform:uppercase;
  font-size:11px;
}
.event-action:hover{background:rgba(7,10,16,.34); border-color:rgba(244,236,216,.26)}
.event-action:focus-visible{outline:2px solid var(--focus); outline-offset:3px}
.event-details{margin:0}
.event-details > summary{list-style:none}
.event-details > summary::-webkit-details-marker{display:none}
.event-more{
  margin-top:10px;
  padding:10px 12px;
  border-radius:16px;
  border:1px solid rgba(244,236,216,.14);
  background:rgba(7,10,16,.22);
  color:rgba(244,236,216,.86);
  font-size:13px;
  line-height:1.55;
}

.info-block{
  margin-top:18px;
  padding:16px;
  border-radius:var(--radius-lg);
  border:1px solid rgba(244,236,216,.14);
  background:rgba(7,10,16,.18);
}
.info-grid{
  display:grid;
  grid-template-columns:repeat(2, minmax(0,1fr));
  gap:12px;
  margin-top:12px;
}
@media (max-width: 760px){
  .info-grid{grid-template-columns:1fr}
}
.info-card{
  padding:14px;
  border-radius:var(--radius-md);
  border:1px solid rgba(244,236,216,.12);
  background:rgba(7,10,16,.20);
}
.info-title{
  margin:0 0 8px;
  font-family:Georgia,"Times New Roman",Times,serif;
  font-weight:800;
  font-size:15px;
}
.next-list{
  margin-top:18px;
  padding:16px;
  border-radius:var(--radius-lg);
  border:1px solid rgba(244,236,216,.14);
  background:rgba(7,10,16,.18);
}
.next-list ul{margin:10px 0 0; padding-left:18px}
.next-list li{margin:8px 0; color:rgba(244,236,216,.88)}
.next-list strong{color:rgba(244,236,216,.96)}

.group-title{
  margin:18px 0 12px;
  font-size:12px;
  letter-spacing:.14em;
  text-transform:uppercase;
  color:rgba(244,236,216,.78);
}
.person-spec{margin:0 0 12px; color:rgba(244,236,216,.86); font-size:13px; line-height:1.55}
.person-actions{display:flex; gap:10px; flex-wrap:wrap; margin-top:10px}
.bio{margin:0}
.bio > summary{list-style:none}
.bio > summary::-webkit-details-marker{display:none}
.bio-body{
  margin-top:10px;
  padding:10px 12px;
  border-radius:16px;
  border:1px solid rgba(244,236,216,.14);
  background:rgba(7,10,16,.22);
  color:rgba(244,236,216,.86);
  font-size:13px;
  line-height:1.55;
}

.access-notes{
  margin:14px 0 12px;
  padding:14px;
  border-radius:var(--radius-md);
  border:1px solid rgba(244,236,216,.12);
  background:rgba(7,10,16,.18);
}
.access-notes ul{margin:10px 0 0; padding-left:18px}
.access-notes li{margin:8px 0; color:rgba(244,236,216,.86)}


@media (min-width: 861px){
  .people-grid{grid-template-columns:repeat(3, minmax(0,1fr))}
}

/* Home header/footer chrome */
.home-chrome{
  position:fixed;
  inset:0;
  z-index:36;
  pointer-events:none;
  transition:opacity 220ms var(--ease), transform 220ms var(--ease), visibility 220ms var(--ease);
}
.home-topbar,
.home-bottombar{
  position:fixed;
  left:max(20px, calc(var(--panel-gap) + env(safe-area-inset-left) + 10px));
  right:max(20px, calc(var(--panel-gap) + env(safe-area-inset-right) + 10px));
  min-height:48px;
  border-radius:20px;
  border:1px solid rgba(244,236,216,.15);
  background:linear-gradient(180deg, rgba(8,11,17,.84), rgba(8,11,17,.68));
  box-shadow:0 16px 38px rgba(0,0,0,.28);
  backdrop-filter:blur(12px);
}
.home-topbar{
  top:max(20px, calc(var(--panel-gap) + env(safe-area-inset-top) + 10px));
  display:grid;
  place-items:center;
}
.home-bottombar{
  bottom:max(20px, calc(var(--panel-gap) + env(safe-area-inset-bottom) + 10px));
  display:flex;
  align-items:center;
  justify-content:center;
  padding:10px 18px;
  pointer-events:auto;
}
.home-brand{
  font-family:Georgia,"Times New Roman",Times,serif;
  font-weight:800;
  font-size:clamp(14px, 1.25vw, 22px);
  letter-spacing:.22em;
  text-transform:uppercase;
  color:var(--paper);
}
.home-legal-nav{
  display:flex;
  align-items:center;
  justify-content:center;
  gap:20px;
  flex-wrap:wrap;
}
.home-legal-nav a,
.home-cookie-btn{
  appearance:none;
  border:0;
  background:none;
  color:var(--paper);
  text-decoration:none;
  font-size:12px;
  font-weight:700;
  letter-spacing:.14em;
  text-transform:uppercase;
  opacity:.9;
  transition:opacity 160ms var(--ease), transform 160ms var(--ease);
  font-family:inherit;
  cursor:pointer;
  padding:0;
}
.home-legal-nav a:hover,
.home-cookie-btn:hover{opacity:1; transform:translateY(-1px)}
.home-legal-nav a:focus-visible,
.home-cookie-btn:focus-visible{outline:2px solid var(--focus); outline-offset:4px; border-radius:999px}

/* Cookie banner */
.cookie-banner{
  position:fixed;
  left:0;
  right:0;
  margin-inline:auto;
  bottom:max(86px, calc(var(--panel-gap) + env(safe-area-inset-bottom) + 76px));
  z-index:38;
  width:min(460px, calc(100vw - 40px));
  transition:opacity 220ms var(--ease), transform 220ms var(--ease), visibility 220ms var(--ease);
}
.cookie-card{
  border-radius:24px;
  padding:18px;
  background:linear-gradient(180deg, rgba(8,11,17,.94), rgba(8,11,17,.82));
  border:1px solid rgba(244,236,216,.16);
  box-shadow:0 22px 54px rgba(0,0,0,.34);
  backdrop-filter:blur(16px);
}
.cookie-eyebrow{
  margin:0 0 6px 0;
  font-size:11px;
  font-weight:700;
  letter-spacing:.18em;
  text-transform:uppercase;
  opacity:.76;
}
.cookie-title{
  margin:0 0 10px 0;
  font-family:Georgia,"Times New Roman",Times,serif;
  font-size:clamp(24px, 2vw, 30px);
  line-height:1.08;
}
.cookie-text{
  margin:0;
  line-height:1.6;
  color:rgba(244,236,216,.88);
  font-size:14px;
}
.cookie-actions{
  display:flex;
  flex-wrap:wrap;
  gap:10px;
  margin-top:16px;
}
.cookie-btn,
.cookie-link{
  appearance:none;
  border:1px solid rgba(244,236,216,.18);
  background:rgba(244,236,216,.10);
  color:var(--paper);
  border-radius:999px;
  padding:10px 14px;
  text-decoration:none;
  font-weight:700;
  font-size:13px;
  cursor:pointer;
  transition:transform 160ms var(--ease), background 160ms var(--ease), border-color 160ms var(--ease), opacity 160ms var(--ease);
}
.cookie-btn:hover,
.cookie-link:hover{transform:translateY(-1px); background:rgba(244,236,216,.14)}
.cookie-btn:focus-visible,
.cookie-link:focus-visible{outline:2px solid var(--focus); outline-offset:2px}
.cookie-btn{background:rgba(212,175,55,.16); border-color:rgba(212,175,55,.28)}
.cookie-btn-ghost{background:rgba(244,236,216,.08); border-color:rgba(244,236,216,.18)}

/* Keep side panels readable and their original colors when another panel is open */
body.is-open .panel[data-active="false"]{
  filter:none;
  opacity:1;
}
body.is-open .panel[data-active="false"]:before{opacity:.92}
body.is-open .panel[data-active="false"] .panel-decor{opacity:.62}
body.is-open .panel[data-active="false"] .panel-title{color:var(--paper)}

/* Hide home-only chrome when a panel is open */
body.is-open .home-chrome,
body.is-open .cookie-banner{
  opacity:0;
  visibility:hidden;
  pointer-events:none;
  transform:translateY(-8px);
}

/* Legal pages */
.legal-body{
  background:
    radial-gradient(1000px 700px at 50% 0%, rgba(212,175,55,.12), transparent 58%),
    linear-gradient(180deg, #0B0F18 0%, #0B0F18 45%, #070A10 100%);
  color:var(--paper);
}
.legal-topbar{
  position:sticky;
  top:0;
  z-index:20;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  padding:18px max(18px, calc(env(safe-area-inset-left) + 18px)) 0 max(18px, calc(env(safe-area-inset-left) + 18px));
}
.legal-back{
  display:inline-flex;
  align-items:center;
  gap:8px;
  text-decoration:none;
  padding:10px 14px;
  border-radius:999px;
  border:1px solid rgba(244,236,216,.18);
  background:rgba(244,236,216,.08);
  backdrop-filter:blur(10px);
  font-weight:700;
}
.legal-back:focus-visible,
.legal-footer-nav a:focus-visible{outline:2px solid var(--focus); outline-offset:2px}
.legal-brand{
  font-family:Georgia,"Times New Roman",Times,serif;
  font-weight:800;
  letter-spacing:.2em;
  text-transform:uppercase;
  font-size:12px;
  opacity:.86;
}
.legal-main{
  padding:20px 18px 40px 18px;
}
.legal-shell{
  max-width:980px;
  margin:0 auto;
  padding:28px;
  border-radius:28px;
  background:linear-gradient(180deg, rgba(13,18,28,.84), rgba(13,18,28,.72));
  border:1px solid rgba(244,236,216,.12);
  box-shadow:0 24px 72px rgba(0,0,0,.32);
  backdrop-filter:blur(12px);
}
.legal-eyebrow{
  margin:0 0 6px 0;
  font-size:11px;
  font-weight:700;
  letter-spacing:.18em;
  text-transform:uppercase;
  opacity:.74;
}
.legal-title{
  margin:0 0 12px 0;
  font-family:Georgia,"Times New Roman",Times,serif;
  font-size:clamp(34px, 4vw, 56px);
  line-height:1.04;
}
.legal-intro{
  margin:0 0 24px 0;
  max-width:72ch;
  line-height:1.7;
  color:rgba(244,236,216,.9);
}
.legal-section + .legal-section{margin-top:22px}
.legal-section h2{
  margin:0 0 8px 0;
  font-family:Georgia,"Times New Roman",Times,serif;
  font-size:24px;
}
.legal-section p{margin:0; line-height:1.7; color:rgba(244,236,216,.9)}
.legal-list{
  margin:0;
  padding-left:18px;
  display:grid;
  gap:8px;
  line-height:1.7;
}
.legal-grid{
  display:grid;
  grid-template-columns:repeat(3, minmax(0, 1fr));
  gap:12px;
}
.legal-card{
  padding:16px;
  border-radius:20px;
  background:rgba(244,236,216,.06);
  border:1px solid rgba(244,236,216,.12);
}
.legal-card h3{
  margin:0 0 8px 0;
  font-family:Georgia,"Times New Roman",Times,serif;
  font-size:20px;
}
.legal-card p{margin:0; line-height:1.65}
.legal-footer{
  padding:0 18px 24px 18px;
}
.legal-footer-inner{
  max-width:980px;
  margin:0 auto;
  padding:16px 2px 0 2px;
  display:flex;
  justify-content:space-between;
  gap:12px;
  flex-wrap:wrap;
  opacity:.86;
}
.legal-footer-nav{
  display:flex;
  gap:14px;
  flex-wrap:wrap;
}
.fallback-legal{margin-top:16px}
.fallback-legal a{text-decoration:none}

@media (max-width: 980px){
  .home-legal-nav{gap:14px}
  .legal-grid{grid-template-columns:1fr}
}

@media (max-width: 860px){
  .home-topbar,
  .home-bottombar{
    left:max(14px, calc(var(--panel-gap) + env(safe-area-inset-left) + 4px));
    right:max(14px, calc(var(--panel-gap) + env(safe-area-inset-right) + 4px));
  }
  .home-topbar{
    top:max(10px, calc(var(--panel-gap) + env(safe-area-inset-top)));
    min-height:46px;
  }
  .home-bottombar{
    bottom:max(10px, calc(var(--panel-gap) + env(safe-area-inset-bottom)));
    min-height:52px;
    padding:10px 14px;
  }
  .home-brand{letter-spacing:.14em; font-size:13px}
  .home-legal-nav{gap:10px; justify-content:flex-start; overflow:auto; width:100%; flex-wrap:nowrap; padding-bottom:2px; scrollbar-width:none}
  .home-legal-nav::-webkit-scrollbar{display:none}
  .cookie-banner{left:14px; right:14px; width:auto; bottom:max(80px, calc(var(--panel-gap) + env(safe-area-inset-bottom) + 68px))}
  .legal-topbar{padding-top:14px}
  .legal-shell{padding:22px}
}

@media (prefers-reduced-motion: reduce){
  .home-legal-nav a:hover,
  .home-cookie-btn:hover,
  .cookie-btn:hover,
  .cookie-link:hover{transform:none}
}

/* Mobile spacing refinement: keep fixed home header/footer outside the panel stack */
@media (max-width: 860px){
  .stage{
    min-height:100svh;
  }

  .stage-inner{
    height:auto;
    min-height:100svh;
    align-content:start;
    gap:16px;
    padding-top:calc(env(safe-area-inset-top) + 84px);
    padding-right:max(14px, calc(env(safe-area-inset-right) + 14px));
    padding-bottom:calc(env(safe-area-inset-bottom) + 96px);
    padding-left:max(14px, calc(env(safe-area-inset-left) + 14px));
  }

  .panel{
    width:min(calc(100% - 10px), 680px);
    min-height:150px;
  }

  .home-topbar{
    top:max(8px, calc(env(safe-area-inset-top) + 8px));
  }

  .home-bottombar{
    bottom:max(8px, calc(env(safe-area-inset-bottom) + 8px));
  }
}

@media (max-width: 520px){
  .stage-inner{
    gap:14px;
    padding-top:calc(env(safe-area-inset-top) + 82px);
    padding-bottom:calc(env(safe-area-inset-bottom) + 94px);
  }

  .panel{
    width:min(calc(100% - 12px), 680px);
    min-height:148px;
  }
}

@media (max-width: 860px){
  html,
  body{
    max-width:100%;
    overflow-x:hidden;
  }

  .stage,
  .stage-inner,
  .panel,
  .content,
  .card,
  .modal-card,
  .legal-grid,
  .home-legal-nav{
    min-width:0 !important;
    max-width:100% !important;
  }

  .stats,
  .gallery-grid,
  .courses-grid,
  .people-grid,
  .contact-grid,
  .info-grid,
  .legal-grid{
    grid-template-columns:1fr !important;
  }

  .home-legal-nav,
  .panel-strip{
    -webkit-overflow-scrolling:touch;
  }
}

@media (min-width: 861px){
  body.is-open .panel[data-active="false"]::after{
    position:absolute;
    inset:0;
    z-index:4;
    display:flex;
    align-items:center;
    justify-content:center;
    color:var(--paper);
    font-family:Georgia,"Times New Roman",Times,serif;
    font-size:clamp(13px, 1.05vw, 18px);
    font-weight:800;
    letter-spacing:.14em;
    line-height:1;
    text-shadow:0 14px 38px rgba(0,0,0,.42);
    text-transform:uppercase;
    writing-mode:vertical-rl;
    text-orientation:upright;
    pointer-events:none;
  }

  body.is-open .panel-about[data-active="false"]::after{content:"ABOUT"}
  body.is-open .panel-courses[data-active="false"]::after{content:"COURSES"}
  body.is-open .panel-shows[data-active="false"]::after{content:"SHOWS"}
  body.is-open .panel-people[data-active="false"]::after{content:"PEOPLE"}
  body.is-open .panel-contacts[data-active="false"]::after{content:"CONTACTS"}
}

@media (max-width: 860px){
  .stage-inner,
  .panel-tabs{
    display:grid;
    grid-template-columns:1fr;
    gap:14px;
    padding-top:calc(env(safe-area-inset-top) + 76px);
    padding-right:max(14px, calc(env(safe-area-inset-right) + 14px));
    padding-bottom:calc(env(safe-area-inset-bottom) + 84px);
    padding-left:max(14px, calc(env(safe-area-inset-left) + 14px));
  }

  .panel,
  .panel-tabs .panel-trigger{
    width:min(calc(100% - 8px), 680px);
    min-height:clamp(104px, 14svh, 148px);
    margin-inline:auto;
  }

  .panel-tabs .panel-trigger,
  body:not(.is-open) .panel-tabs .panel-trigger{
    position:relative;
    inset:auto;
    height:auto;
    padding:16px 18px;
    align-items:center;
    justify-content:center;
    gap:8px;
    text-align:center;
    overflow:hidden;
  }

  .panel-tabs .panel-kicker{
    align-self:center;
    font-size:clamp(10px, 2.7vw, 12px);
    letter-spacing:.12em;
    line-height:1.2;
  }

  .panel-tabs .panel-title{
    writing-mode:horizontal-tb;
    text-orientation:mixed;
    transform:none;
    font-size:clamp(24px, 7.4vw, 34px);
    letter-spacing:.075em;
    line-height:1;
    max-width:100%;
    text-align:center;
    white-space:normal;
  }

  .panel-tabs .panel-trigger:focus-visible{
    outline-offset:-5px;
  }

  .home-bottombar{
    min-height:48px;
    padding:8px 12px;
  }

  .home-legal-nav{
    justify-content:center;
    gap:clamp(8px, 2.5vw, 12px);
  }

  .home-legal-nav a,
  .home-cookie-btn{
    font-size:clamp(10px, 2.6vw, 12px);
    letter-spacing:.11em;
  }
}

@media (max-width: 860px) and (min-height: 620px){
  .stage-inner,
  .panel-tabs{
    height:100svh;
    min-height:100svh;
    grid-template-rows:repeat(5, minmax(0, 1fr));
    align-content:stretch;
  }

  .panel,
  .panel-tabs .panel-trigger{
    height:100%;
    min-height:0;
  }
}

@media (max-width: 520px){
  .stage-inner,
  .panel-tabs{
    gap:12px;
    padding-top:calc(env(safe-area-inset-top) + 72px);
    padding-bottom:calc(env(safe-area-inset-bottom) + 78px);
  }

  .panel,
  .panel-tabs .panel-trigger{
    width:min(calc(100% - 6px), 680px);
  }

  .panel-tabs .panel-title{
    font-size:clamp(22px, 7.1vw, 30px);
    letter-spacing:.055em;
  }
}

@media (max-width: 390px){
  .panel-tabs .panel-title{
    font-size:clamp(20px, 6.8vw, 27px);
    letter-spacing:.04em;
  }

  .panel-tabs .panel-kicker{
    font-size:10px;
    letter-spacing:.09em;
  }

  .home-legal-nav{
    gap:8px;
  }

  .home-legal-nav a,
  .home-cookie-btn{
    font-size:10px;
    letter-spacing:.08em;
  }
}

@media (max-width: 860px) and (max-height: 619px){
  .stage-inner,
  .panel-tabs{
    height:auto;
    min-height:100svh;
    align-content:start;
  }

  .panel,
  .panel-tabs .panel-trigger{
    height:auto;
    min-height:112px;
  }
}
