/* PAJ 2026 / immersive glass edition. Load after every other stylesheet. */
:root {
  --ink: #f5f1e8;
  --navy: #040916;
  --paper: transparent;
  --muted: #abb6c7;
  --line: rgba(200, 180, 129, .25);
  --blue: #2e6df0;
  --warm: #e5c783;
  --gold: #e5c783;
  --gold-soft: #bca775;
  --glass-edge: rgba(231, 207, 155, .24);
}

html { background: #030712; scroll-padding-top:140px; }
body {
  position: relative;
  isolation: isolate;
  color: var(--ink);
  background: transparent;
}
::selection { background: #e5c783; color: #060b17; }
a:focus-visible, button:focus-visible, summary:focus-visible, [tabindex]:focus-visible {
  outline-color: #f1dca7;
}

/* One continuous living material follows the visitor through the entire LP. */
.ambient-scene {
  position: fixed;
  inset: 0;
  z-index: 0;
  overflow: hidden;
  pointer-events: none;
  background: radial-gradient(ellipse at 70% 25%, #174697 0, transparent 57%),
    radial-gradient(ellipse at 17% 76%, #8b6b2c 0, transparent 55%), #030712;
  contain: strict;
}
.ambient-scene .hero-canvas {
  position: absolute;
  inset: 0;
  display: block;
  width: 100%;
  height: 100%;
  z-index: 0;
  opacity: 0;
  filter: blur(56px) saturate(1.12);
  transform: scale(1.16);
  transform-origin: center;
  transition: opacity .8s;
}
.has-live-ambient .ambient-scene .hero-canvas { opacity: 1; }
.ambient-fallback-light { position:absolute; inset:-20%; background:radial-gradient(ellipse at 70% 35%,#caa65970,transparent 49%),radial-gradient(ellipse at 30% 73%,#135af193,transparent 57%); filter:blur(55px); animation:ambient-drift 12s ease-in-out infinite alternate; }
.has-live-ambient .ambient-fallback-light { display:none; }
html[data-motion="paused"] .ambient-fallback-light, .paj-page-hidden .ambient-fallback-light { animation-play-state:paused; }
@keyframes ambient-drift { from { transform:translate(-10%,12%); } to { transform:translate(10%,-12%); } }
@media(prefers-reduced-motion:reduce) { html:not([data-motion="running"]) .ambient-fallback-light { animation:none; } }
@media(prefers-reduced-motion:reduce) { html[data-motion="running"] .ambient-fallback-light { animation:ambient-drift 12s ease-in-out infinite alternate!important; } html[data-motion="running"].paj-page-hidden .ambient-fallback-light { animation-play-state:paused!important; } }
.ambient-scene::after {
  content: '';
  position: absolute;
  inset: 0;
  pointer-events: none;
  background: linear-gradient(90deg, #02061040, #02061005 65%, #02061010),
    linear-gradient(0deg, #0206101c, transparent 40%, #02061010);
}
main, .footer { position: relative; z-index: 1; }
.site-header { z-index: 30; }
main > section, .section-light, .awards, .join, .footer {
  background: transparent;
}
.hero {
  min-height: 850px;
  background: transparent;
  isolation: auto;
}
.hero > .hero-art, .hero-grid, .hero > .hero-canvas,
.program > .ambient, .join > .ambient, .award-halo {
  display: none;
}
.hero-shade, .hero.has-live-motion .hero-shade {
  background: linear-gradient(0deg, #0206102b, transparent 35%);
}
.hero .hero-cursor-lens, .hero .hero-lens-mask { display: none !important; }
.motion-fallback::before { display: none; }

/* An unmistakable awards identity, held in a fine black-glass navigation bar. */
.site-header {
  top: 24px;
  height: 100px;
  padding: 10px 21px 10px 25px;
  border-color: #dcc79138;
  border-radius: 3px;
  color: #f8f3e9;
  background: linear-gradient(110deg, #03081282, #0d214244);
  box-shadow: inset 0 1px 0 #efdbad0d, 0 12px 45px #00000012;
  backdrop-filter: blur(22px);
  -webkit-backdrop-filter: blur(22px);
}
.site-header.is-fixed {
  background: linear-gradient(110deg, #030812d9, #08152ad1);
  border-color: #dcc79140;
  box-shadow: 0 16px 50px #00000028;
}
.brand { flex: 0 0 auto; gap: 0; }
.brand-logo {
  display: block;
  position: relative;
  overflow: hidden;
  width: 162px;
  height: auto;
  aspect-ratio: 1197 / 581;
}
.brand-logo > img { position:absolute; width:160.401%; height:auto; max-width:none; left:-30.0752%; top:-42.1687%; }
.brand-symbol { color: var(--gold); }
.desktop-nav a { color: #e2e6ed; letter-spacing: .13em; }
.desktop-nav a::after { background: var(--gold); }
.header-cta {
  padding: 12px 17px;
  border-color: #ddc48766;
  border-radius: 2px;
  color: #f0dbaa;
  background: linear-gradient(110deg, #d6b46912, #143f7626);
}
.header-cta:hover { background: #d9bc7321; }
.hero-kicker { color: #e8ddc4; }
.status-dot { background: #e5c783; box-shadow: 0 0 15px #f0c676b3; }
.hero h1 { color: #fffaf0; text-shadow: 0 4px 42px #02071626; }
.hero h1 i { color: #ebce8a; }
.hero-copy > p { color: #f5f1e7; }
.hero-copy-line { background: linear-gradient(90deg, #e5c783b3, #e5c78320); }
.hero-en { color: #c0cee3; }
.hero-side { color: #e6d6b48c; }
.hero-interaction-hint { color: #e7d6bca6; letter-spacing: .15em; }
.hero-interaction-hint::before {
  width: 22px;
  height: 1px;
  background: #ddc18b8c;
  border: 0;
  border-radius: 0;
  box-shadow: none;
}
.hero-footnote, .hero-footnote a { color: #bcc8d9; }

/* Glass is used as an accent; generous open space lets the material breathe. */
.glass, .glass-light {
  background: linear-gradient(115deg, #08234475, #03091363 64%, #88662416);
  border: 1px solid var(--glass-edge);
  box-shadow: inset 0 1px 0 #fff4d615, inset 0 -1px 0 #2e6ee626, 0 25px 80px #00000018;
  backdrop-filter: blur(26px);
  -webkit-backdrop-filter: blur(26px);
}
.event-strip {
  border-radius: 4px;
  background: linear-gradient(115deg, #081a3482, #02081273 60%, #654d2221);
  border-color: #dac18b4d;
}
.event-date { border-color: #dfc79040; }
.event-date .micro, .event-place .micro { color: #ceb98e; }
.event-date p { color: #f3e5c5; }
.event-date p small { color: #c8d0de; }
.event-place p { color: #f1f1ef; }
.button { border-radius: 2px; }
.button-light, .button-dark {
  background: linear-gradient(115deg, #ead7a7, #cdb474 72%, #dbc590);
  color: #111725;
  border: 1px solid #f5e5bd61;
  box-shadow: inset 0 1px 0 #fff4d18c, 0 8px 35px #ddb6580b;
}
.button-light:hover, .button-dark:hover {
  background: linear-gradient(115deg, #f6e8c9, #e2cc94);
  color: #080d15;
  box-shadow: 0 10px 40px #d9b65b20;
}
.button-outline { border-color: #e0c58d70; color: #eeddb7; background: #09172b4d; }
.button-outline:hover { background: #d5b66f17; }
.text-link { color: #e9d6a8; border-bottom-color: #d5bb8073; }
.pill { color: #d9c18c; border-color: #d9bc7947; background: #03091429; }
.section-caption { border-top-color: #d9c18c45; color: #e5cf9f; }
.section-caption .muted { color: #afbacc; }
.section-note { color: #a7b5cb; }
h2, h3 { color: #f4f0e7; }
.warm-text { color: #e0c17b; }
.about { padding-top: 110px; padding-bottom: 126px; }
.about-layout { padding-top: 75px; padding-bottom: 82px; }
.about-copy p { color: #c3ccda; }
.about-copy .lead { color: #f3eee4; }
.wide-photo {
  border: 1px solid #f0d79938;
  border-radius: 4px;
  box-shadow: 0 24px 65px #00000029;
}
.wide-photo > img { filter: saturate(.82) contrast(1.025); }
.photo-caption {
  background: linear-gradient(110deg, #030b19b8, #07162886);
  border-color: #e9d5a636;
  border-radius: 2px;
}
.photo-caption > span:first-child { color: #ead5a5; }
.program { padding-bottom: 135px; }
.section-heading > p { color: #c2ccdb; }
.program-tabs { border-color: #bda66e52; }
.program-tabs button { color: #9daac1; }
.program-tabs button span { color: #bfa775; }
.program-tabs button[aria-selected="true"] {
  color: #f0ddb2;
  border-bottom-color: #e1c586;
}
.program-tabs button:hover { color: #f2dfb4; }
.program-panel { border-radius: 5px; padding: 16px; gap: 16px; }
.program-details { padding: 29px 35px; }
.program-en { color: #cbb27c; font-weight: 350; }
.program-details div > p:last-child { color: #c3ccda; }
.program-note { color: #b1bdd0; border-color: #cdb4773b; }
.program-note span { color: #e1c586; }
.program-photo { border-radius: 2px; border: 1px solid #d6c89e21; }
.program-photo figcaption { background: linear-gradient(transparent, #020711cc); color: #eeece5; }
.exhibition-art {
  border-radius: 2px;
  border: 1px solid #e0c99526;
  isolation: isolate;
  background: linear-gradient(140deg, #05112947, #1018262e 48%, #1c1b132b);
}
.exhibit-orbit {
  border: 0;
  border-radius: 32% 65% 44% 71% / 48% 39% 67% 56%;
  box-shadow: none;
  background: linear-gradient(135deg, #1b60efb3, #2862a930 70%);
  backdrop-filter: none;
  -webkit-backdrop-filter: none;
  filter: blur(39px);
  opacity: .85;
  z-index: -1;
}
.orbit-a { width: 340px; height: 280px; left: -8%; top: -12%; }
.orbit-b { width: 430px; height: 325px; right: -28%; top: 26%; background: linear-gradient(140deg, #b58a33a3, #f4d28e52 60%, transparent); }
.orbit-c { width: 260px; height: 230px; bottom: -16%; left: 3%; background: #143c9180; }
.exhibit-label { color: #f5edda; text-shadow: 0 3px 24px #05102044; }
.art-caption { color: #c3bdab; }

/* The old literal sphere illustration is replaced with defocused gold light. */
.awards { padding: 54px 0 122px; }
.awards .section-caption { border-color: #d9c18c45; color: #e5cf9f; }
.awards-layout { gap: 8%; margin-top: 78px; }
.award-art {
  min-height: 560px;
  border-radius: 3px;
  border: 1px solid #d9c18c33;
  background: linear-gradient(125deg, #06142e24, #0307110d 53%, #5d491d1c);
  backdrop-filter: blur(12px);
  -webkit-backdrop-filter: blur(12px);
  box-shadow: inset 0 1px 0 #edd8a21f, 0 22px 80px #0000000d;
  isolation: isolate;
}
.award-art > img { display: none; }
.award-art::before {
  content: '';
  position: absolute;
  inset: -20%;
  z-index: -1;
  background: radial-gradient(ellipse 16% 43% at 49% 43%, #ffe3a6b3, #b8964333 73%, transparent 98%),
    radial-gradient(ellipse 31% 24% at 38% 68%, #d3a65063, transparent 86%),
    radial-gradient(ellipse 38% 29% at 70% 29%, #356fd96b, transparent 86%);
  transform: rotate(29deg);
  filter: blur(42px);
  opacity: .74;
}
.award-art::after {
  content: 'AWARDS';
  position: absolute;
  left: 26px;
  right: 26px;
  top: 29px;
  color: #f2deb4b8;
  font-size: clamp(32px, 4vw, 62px);
  font-weight: 300;
  letter-spacing: -.055em;
  line-height: 1;
}
.award-art-caption { padding: 40px 27px 26px; background: linear-gradient(transparent, #03071154); color: #d0c2a3; }
.award-art-caption > span:last-child { color: #f0dbab; font-size: 65px; font-weight: 250; }
.awards-copy > p { color: #c3ccda; }
.pill-dark { color: #ddc58f; border-color: #d9bc7947; }
.award-info { border-radius: 3px; background: linear-gradient(120deg, #06152d75, #56441d1c); }
.award-info > .micro { color: #d8bf85; }
.award-info p { color: #bcc8db; }
.light-link { color: #e9d6a8; }
.highlights { padding-top: 78px; padding-bottom: 122px; }
.highlight-grid { gap: 25px; }
.highlight-card { color: #d4c39e; }
.highlight-card > img { border-radius: 3px; border: 1px solid #dbc69230; filter: saturate(.76) contrast(1.03); }
.highlight-card > span { border-color: #d9c18c45; padding-top: 18px; }
.highlight-card b { color: #efdeb6; }
.access { padding-bottom: 126px; }
.venue-art {
  background: linear-gradient(115deg, #06153166, #10347740 70%, #90722c1c);
  border-color: #d9c18c38;
  border-radius: 3px;
  box-shadow: inset 0 1px 0 #e9d4a814, 0 20px 55px #00000015;
  backdrop-filter: blur(15px);
  -webkit-backdrop-filter: blur(15px);
}
.venue-lines { opacity: .16; }
.venue-building > div {
  background: linear-gradient(90deg, #152e6166, #acc0db1a);
  border-color: #d8c79670;
  box-shadow: 10px 10px 35px #19428229;
}
.venue-art-title { color: #e7d1a0; }
.venue-art .art-caption { color: #b0bdd0; }
.event-table dt { color: #d1b982; }
.event-table dd { color: #e9edf3; }
.event-table dd span { color: #aebcd0; }
.event-table dd.date-value { color: #f0dcae; }
.join { padding: 58px 0 92px; }
.join-heading { margin: 83px 0 58px; }
.join-heading > .micro, .join-card .micro { color: #dbbf85; }
.join-heading h2 { text-shadow: 0 3px 35px #0206102b; }
.join-heading > p:last-child { color: #c4cede; }
.join-cards { max-width: 1050px; gap: 26px; }
.join-card { border-radius: 3px; padding: 36px; }
.join-card p { color: #b9c6d9; }
.paj-ui-motion .join-card:hover {
  border-color: #e2c88c80;
  box-shadow: inset 0 1px 0 #ffe9b71a, 0 16px 50px #0a357426;
}
.join-invitation { color: #b7c4d7; margin-top: 32px; }
.faq { padding-top: 90px; padding-bottom: 120px; }
.faq-layout > div > .micro { color: #dec68d; }
.faq summary { color: #e5eaf3; }
.faq summary > span { color: #dbc18a; }
.faq details p { color: #b8c5d9; }
.footer { padding-top: 57px; border-top: 1px solid #d9c18c38; }
.footer-brand { color: #f0e1c2; }
.footer-brand > span { color: #b0bfd3; }
.back-top { color: #e4c98f; border-color: #d7bd8157; background: #05102a3b; border-radius: 3px; }
.back-top:hover { background: #d9bc731f; }
.footer-bottom { color: #a5b3c7; border-color: #cbb47d2e; }
.motion-toggle {
  background: #061020cc;
  color: #edd8a6;
  border-color: #dac18b70;
  box-shadow: 0 6px 25px #00000029;
}
.motion-toggle:hover { background: #173159e6; }
.mobile-nav:not([hidden]) {
  color: #f4ecd9;
  border-color: #d9c18c57;
  background: #040c1bf5;
  border-radius: 3px;
}
.mobile-nav > a { border-color: #cfb77933; }
.mobile-nav > a > span { color: #b5c3d9; }
dialog {
  color: #f3ecd9;
  background: linear-gradient(120deg, #07152af5, #050b17f0);
  border-color: #dac18b75;
  border-radius: 5px;
  box-shadow: 0 30px 110px #00000085;
}
dialog::backdrop { background: #02040be0; }
dialog > .micro { color: #d3ba81; }
dialog p, dialog li { color: #becadd; }
.dialog-close { background: #d9bc7317; color: #e9d3a4; }
#photo-dialog { background: #050c19f5; }
#photo-dialog .dialog-close { color: #0b1425; background: #e7d3a5; }

@media (max-width: 1100px) {
  .brand-logo { width: 158px; }
  .site-header { padding-left: 19px; gap: 20px; }
  .desktop-nav { gap: 22px; }
  .desktop-nav a { font-size: 14px; }
  .program-details { padding: 23px; }
  .awards-layout { gap: 6%; }
  .award-art { min-height: 520px; }
}
@media (max-width: 760px) {
  html { scroll-padding-top:110px; }
  .ambient-scene .hero-canvas { filter: blur(42px) saturate(1.12); transform: scale(1.25); }
  .ambient-scene::after { background: linear-gradient(90deg, #02061024, #0206100d); }
  .site-header { top: 14px; height: 83px; padding: 10px 13px 10px 16px; gap: 12px; }
  .brand-logo { width: 128px; }
  .header-cta { padding: 9px 10px; font-size: 14px; gap: 10px; }
  .menu-toggle { width: 26px; flex: 0 0 26px; }
  .menu-toggle span { background: #e8d7b0; }
  .mobile-nav:not([hidden]) { top: 82px; }
  .hero { min-height: 740px; height: 100svh; }
  .hero > .hero-content { padding-top: 132px; }
  .hero h1 { font-size: clamp(40px, 10.9vw, 81px); margin-bottom: 25px; }
  .hero h1 i { color: #ebce8a; }
  .hero-copy > p { font-size: 17px; }
  .hero-shade, .hero.has-live-motion .hero-shade { background: linear-gradient(0deg, #0206101f, transparent 30%); }
  .hero-bottom { bottom: 20px; }
  .event-strip { padding: 18px; gap: 17px 12px; }
  .event-date p { font-size: 20px; }
  .event-place p { font-size: 14px; }
  .hero-footnote { margin-bottom: 29px; }
  .glass, .glass-light { backdrop-filter: blur(18px); -webkit-backdrop-filter: blur(18px); }
  .about { padding: 68px 0 76px; }
  .about-layout { padding: 41px 0; gap: 30px; }
  .about h2 { font-size: 51px; }
  .wide-photo { aspect-ratio: 1.13; }
  .section-caption { border-top-color: #d9c18c54; }
  .program { padding-bottom: 76px; }
  .program-tabs { border-color: #d5b87859; border-radius: 2px; }
  .program-tabs button { background: #091a333d; color: #b3bfd3; }
  .program-tabs button[aria-selected="true"] { background: linear-gradient(110deg, #d4b67029, #0e2d5466); color: #f1dcad; }
  .program-tabs button:nth-child(odd), .program-tabs button:nth-child(-n+2) { border-color: #d5b8783b; }
  .program-panel { padding: 9px; gap: 10px; }
  .program-details { padding: 19px 15px 16px; }
  .program-en { font-size: 29px; }
  .exhibit-orbit { filter: blur(34px); }
  .exhibit-label { font-size: 49px; }
  .awards { padding: 39px 0 76px; }
  .awards-layout { gap: 34px; margin-top: 37px; }
  .award-art { min-height: 0; height: 345px; margin-inline: 0; border-radius: 3px; }
  .award-art::after { left: 22px; top: 24px; font-size: 39px; }
  .award-art::before { filter: blur(35px); }
  .award-art-caption { padding: 30px 22px 22px; }
  .award-art-caption > span:last-child { font-size: 50px; }
  .awards-copy { padding: 0; }
  .awards-copy h2 { font-size: 33px; }
  .highlights { padding: 56px 0 76px; }
  .highlight-grid { gap: 25px; }
  .highlight-card > span { padding-top: 12px; }
  .access { padding-bottom: 76px; }
  .access h2 { font-size: 29px; }
  .venue-art { height: 255px; }
  .join { padding: 36px 0 59px; }
  .join-heading { margin: 44px 0 35px; }
  .join-heading h2 { font-size: 44px; }
  .join-cards { gap: 16px; }
  .join-card { padding: 28px 23px 25px; }
  .join-invitation { margin-top: 24px; }
  .faq { padding: 51px 0 77px; }
  .footer { padding: 41px 0 26px; }
  .footer-bottom { padding-bottom: 25px; }
}
@media (max-width: 400px) {
  .site-header { padding-left: 13px; gap: 10px; }
  .brand-logo { width: 124px; }
  .header-cta { font-size: 14px; padding: 9px 8px; gap: 7px; }
  .header-cta span { font-size: 15px; }
  .hero-copy { gap: 15px; }
  .event-strip { padding: 15px; gap: 16px 10px; }
  .event-date p { font-size: 18px; }
  .event-place p { font-size: 14px; }
  .about h2 { font-size: 47px; }
}
@media (max-width: 360px) {
  .brand-logo { width: 128px; }
  .hero { min-height: 730px; }
  .hero h1 { font-size: 10.6vw; }
  .hero-copy > p { font-size: 15px; }
  .hero-copy-line { width: 24px; }
  .about h2 { font-size: 44px; }
  .awards-copy h2 { font-size: 30px; }
  .program-details h3 { font-size: 21px; }
  .join-heading h2 { font-size: 40px; }
  .venue-art-title { font-size: 27px; left: 21px; }
  .event-table dl > div { grid-template-columns: 66px 1fr; gap: 12px; }
}
@media print {
  .ambient-scene { display: none; }
  html, body { color: #111; background: #fff; }
  main > section, .footer { background: #071329; }
  .hero > .hero-art { display: none; }
}
