:root{--ink:#0b1630;--navy:#071a44;--blue:#1565e0;--cyan:#33c6f4;--line:#e3e8f2;--dot:#c9d3e3;--muted:#5d6b85;--bg:#f5f7fb}
*{box-sizing:border-box;margin:0;padding:0}
html{overflow-x:hidden;scroll-behavior:smooth}
body{font-family:Inter,system-ui,sans-serif;color:var(--ink);background:#fff;line-height:1.6;overflow-x:hidden}
a{color:inherit;text-decoration:none}
button{font:inherit;color:inherit;background:none;border:0;cursor:pointer}
img{max-width:100%}
.wrap{max-width:1200px;margin:0 auto;padding:0 24px}
:focus{outline:none}
:focus-visible{outline:2px solid var(--cyan);outline-offset:2px}

/* header */
.site-head{position:absolute;inset:0 0 auto;z-index:20;color:#fff}
.bar{display:flex;align-items:center;gap:24px;height:76px}
.brand{font-family:Montserrat;font-weight:900;font-size:26px;letter-spacing:.5px;white-space:nowrap}
.nav{margin-left:auto}
.nav>ul{display:flex;list-style:none}
.nav>ul>li{position:relative}
.nav>ul>li>button{padding:26px 11px;font-size:14px;font-weight:600;white-space:nowrap;opacity:.92}
.nav>ul>li:hover>button,.nav>ul>li.on>button{opacity:1;color:var(--cyan)}
.nav ul ul{display:none;position:absolute;top:100%;left:0;min-width:220px;background:#fff;color:var(--ink);list-style:none;border-radius:10px;padding:8px;box-shadow:0 14px 40px rgba(7,26,68,.22)}
.nav>ul>li:hover>ul,.nav li.open>ul{display:block}
.nav ul ul a{display:block;padding:9px 12px;border-radius:6px;font-size:14px;white-space:nowrap}
.nav ul ul a:hover,.nav ul ul a[aria-current]{background:var(--bg);color:var(--blue)}
.menu-btn{display:none;margin-left:auto;width:42px;height:42px;border-radius:8px;border:1px solid rgba(255,255,255,.35)}
.menu-btn span{display:block;width:18px;height:2px;background:#fff;margin:4px auto}

/* buttons */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;height:50px;padding:0 26px;border-radius:999px;font-weight:700;font-size:15px;white-space:nowrap}
.btn.fill{background:linear-gradient(90deg,var(--blue),#2aa8f0);color:#fff;box-shadow:0 10px 30px rgba(33,140,240,.4)}
.btn.line{border:1.5px solid rgba(255,255,255,.6);color:#fff}
.btn.line:hover{background:rgba(255,255,255,.12)}
.btn.dark{background:var(--navy);color:#fff}
.btn.dark:hover{background:var(--blue)}

/* home hero */
.hero{position:relative;min-height:max(880px,100vh);color:#fff;display:flex;align-items:center;background:var(--navy) url(/assets/img/incheon-convensia-art.jpg) 72% 50%/cover;isolation:isolate}
.hero:before{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(90deg,rgba(4,14,40,.82) 0%,rgba(6,26,74,.45) 60%,rgba(6,26,74,.2) 100%),linear-gradient(180deg,rgba(4,14,40,.55) 0%,rgba(4,14,40,0) 30%,rgba(4,14,40,0) 70%,rgba(4,14,40,.85) 100%)}
.hero .wrap{width:100%;padding-top:190px;padding-bottom:200px}
.eyebrow{font-size:clamp(16px,1.6vw,22px);font-weight:600;letter-spacing:.4px;color:#cfe4ff}
.eyebrow b{color:var(--cyan)}
.hero h1{font-family:Montserrat;font-weight:900;font-size:clamp(72px,13vw,168px);line-height:.95;letter-spacing:-2px;margin:18px 0 28px;color:#fff}
.meta{display:flex;flex-wrap:wrap;gap:10px 28px;font-size:19px;font-weight:600}
.meta div+div:before{content:"·";margin-right:28px;color:var(--cyan)}
.cta{display:flex;flex-wrap:wrap;gap:12px;margin-top:34px}

/* dates strip */
.dates{position:relative;z-index:5;margin-top:-92px}
.dates ol{list-style:none;display:grid;grid-template-columns:repeat(6,1fr);background:#fff;border-radius:16px;box-shadow:0 20px 50px rgba(7,26,68,.16);overflow:hidden}
.dates li{padding:22px 20px;border-right:2px dotted var(--dot)}
.dates li:last-child{border-right:0;background:linear-gradient(135deg,var(--blue),#1c9be8);color:#fff}
.dates time{display:block;font-family:Montserrat;font-weight:800;font-size:17px}
.dates span{display:block;font-size:13px;color:var(--muted);margin-top:4px}
.dates li:last-child span{color:#dbeeff}
.dates li.next{background:#eef6ff}
.dates li.next time{color:var(--blue)}
.dates .d{display:inline-block;margin-top:10px;font-size:12px;font-weight:700;font-style:normal;color:var(--blue);background:#dcecff;border-radius:999px;padding:2px 10px}

.home section{padding:96px 0}
.kicker{font-size:13px;font-weight:700;letter-spacing:2px;text-transform:uppercase;color:var(--blue)}
.home h2{font-family:Montserrat;font-weight:800;font-size:clamp(28px,3.4vw,40px);line-height:1.2;margin:10px 0 18px;letter-spacing:-.5px}
.lead{color:var(--muted);font-size:17px;max-width:760px}

/* quick links */
.quick{padding:72px 0 0}
.quick .grid{display:grid;grid-template-columns:repeat(4,1fr);gap:18px}
.q{position:relative;height:170px;border-radius:14px;overflow:hidden;color:#fff;display:flex;flex-direction:column;justify-content:flex-end;padding:20px;isolation:isolate}
.q img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:-2;transition:transform .5s}
.q:after{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(180deg,rgba(7,26,68,.15),rgba(7,26,68,.88))}
.q i{display:grid;place-items:center;width:56px;height:56px;border-radius:50%;margin-bottom:auto;color:#fff;background:rgba(255,255,255,.16);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);box-shadow:inset 0 1px 0 rgba(255,255,255,.25),0 6px 18px rgba(4,14,40,.25);transition:.25s}
.q i svg{width:26px;height:26px}
.q:hover i{background:rgba(51,198,244,.32)}
.q b{font-family:Montserrat;font-size:19px;font-weight:700;white-space:nowrap}
.q:hover img{transform:scale(1.06)}

/* conferences */
.confs{background:var(--bg);margin-top:96px}
.about{display:grid;grid-template-columns:1.1fr 1fr;gap:56px;align-items:end;margin-bottom:44px}
.cgrid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
.c{background:#fff;border:1px solid var(--line);border-radius:14px;padding:22px;transition:.2s}
.c:hover{border-color:#9cc6fb;box-shadow:0 12px 30px rgba(21,101,224,.12);transform:translateY(-3px)}
.c b{font-family:Montserrat;font-weight:800;font-size:20px;color:var(--blue)}
.c p{font-size:15px;font-weight:600;margin:8px 0 12px;line-height:1.4}
.c small{font-size:12.5px;color:var(--muted)}

/* venue */
.venue .grid{display:grid;grid-template-columns:1.15fr 1fr;gap:56px;align-items:center}
.venue figure{position:relative;border-radius:18px;overflow:hidden;aspect-ratio:4/3}
.venue figure img{width:100%;height:100%;object-fit:cover}
.venue figure img+img{position:absolute;right:16px;bottom:16px;width:42%;height:auto;aspect-ratio:4/3;border-radius:12px;border:4px solid #fff}
.venue ul{list-style:none;margin:26px 0 30px;display:grid;gap:12px}
.venue li{display:flex;gap:12px;font-size:15px}
.venue li b{min-width:120px}

/* sub pages */
.page-head{position:relative;color:#fff;background:var(--navy) var(--photo) 50% 50%/cover;isolation:isolate}
.page-head:before{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(180deg,rgba(4,14,40,.86) 0%,rgba(6,26,74,.62) 55%,rgba(4,14,40,.9) 100%)}
.page-head .wrap{padding-top:190px;padding-bottom:72px}
.crumb{font-size:14px;font-weight:600;color:#bcd3f5}
.crumb a:hover{color:#fff}
.crumb span{margin:0 8px;color:var(--cyan)}
.page-head h1{font-family:Montserrat;font-weight:800;font-size:clamp(32px,4.6vw,54px);line-height:1.15;letter-spacing:-.5px;margin-top:12px}
.page-body{display:grid;grid-template-columns:250px minmax(0,1fr);gap:64px;padding-top:64px;padding-bottom:110px;min-height:520px}
.side{position:sticky;top:24px;align-self:start}
.side h2{font-family:Montserrat;font-size:13px;font-weight:700;letter-spacing:2px;text-transform:uppercase;color:var(--blue);padding-bottom:14px;border-bottom:2px solid var(--ink)}
.side ul{list-style:none}
.side li{border-bottom:2px dotted var(--dot)}
.side a{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:14px 4px;font-weight:600;font-size:15px;color:#33415c;transition:.15s}
.side a:after{content:"→";color:var(--dot);transition:.15s}
.side a:hover{color:var(--blue)}
.side a:hover:after{color:var(--blue);transform:translateX(3px)}
.side a[aria-current]{color:var(--blue)}
.side a[aria-current]:after{color:var(--blue)}

/* page text (source/content) */
.prose{font-size:16px;color:#243049;min-width:0}
.prose>*+*{margin-top:18px}
.prose h2{font-family:Montserrat;font-size:24px;font-weight:800;color:var(--ink);letter-spacing:-.3px;line-height:1.3;margin-top:48px}
.prose>h2:first-child,.prose>section:first-child>h2:first-child{margin-top:0}
.prose h2 small{display:block;font-family:Inter;font-size:15px;font-weight:600;color:var(--muted);letter-spacing:0;margin-top:6px}
.prose h2[id]{scroll-margin-top:24px}
.prose h3{font-family:Montserrat;font-size:18px;font-weight:700;color:var(--ink);margin-top:32px}
.prose h2+*,.prose h3+*{margin-top:12px}
.prose a:not(.btn):not(.file){color:var(--blue);text-decoration:underline;text-underline-offset:3px;text-decoration-color:#a9c8f5;overflow-wrap:anywhere}
.prose a:not(.btn):not(.file):hover{text-decoration-color:var(--blue)}
.prose ul,.prose ol{padding-left:22px}
.prose li+li{margin-top:6px}
.prose li::marker{color:var(--blue)}
.prose strong,.prose b{color:var(--ink)}
.prose .note{font-size:14.5px;color:var(--muted);background:var(--bg);border-left:3px solid var(--cyan);padding:12px 16px;border-radius:0 8px 8px 0}
.prose .btn{background:var(--navy);color:#fff;height:48px;margin-right:8px}
.prose .btn:hover{background:var(--blue)}
.prose .file{display:inline-flex;align-items:center;gap:10px;padding:10px 16px;border:1px solid var(--line);border-radius:10px;font-weight:600;font-size:14.5px;color:var(--ink);transition:.15s;margin:4px 6px 4px 0;max-width:100%}
.prose .file:before{content:"";flex:none;width:16px;height:16px;background:var(--blue);-webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 4v12M6 10l6 6 6-6M5 20h14'/%3E%3C/svg%3E") center/contain no-repeat;mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 4v12M6 10l6 6 6-6M5 20h14'/%3E%3C/svg%3E") center/contain no-repeat}
.prose .file:hover{border-color:var(--blue);color:var(--blue)}
.prose figure img{display:block;border-radius:12px}
.prose .photos{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:14px}
.prose .photos img{width:100%;aspect-ratio:4/3;object-fit:cover}
.prose figcaption{font-size:14px;color:var(--muted);margin-top:8px}
.prose .table{overflow-x:auto;border-radius:14px;box-shadow:0 0 0 1px var(--line),0 10px 28px rgba(7,26,68,.06);background:#fff}
.prose table{width:100%;border-collapse:collapse;font-size:15px}
.prose th,.prose td{padding:14px 18px;text-align:left;vertical-align:top;border-bottom:1px solid var(--line)}
.prose thead th{background:var(--navy);color:#fff;font-size:13.5px;font-weight:700;letter-spacing:.3px;border-bottom:0;white-space:nowrap}
.prose thead th small{font-weight:500;color:#9fb6dc;font-size:12px}
.prose tbody th{font-weight:700;color:var(--ink)}
.prose tbody tr:last-child>*{border-bottom:0}
.prose tbody tr:hover>td{background:#f8fbff}
/* registration fees */
.prose table.fees td{font-family:Montserrat;font-weight:700;font-size:16px;color:var(--ink);white-space:nowrap}
.prose table.fees td.na{font-family:Inter;font-weight:500;font-size:14px;color:var(--muted)}
.prose table.fees thead th.hl{background:var(--blue)}
.prose table.fees td.hl{background:#eef6ff;color:var(--blue)}
.prose table.fees tr.group>th{background:var(--bg);color:var(--blue);font-size:12px;font-weight:700;letter-spacing:1.5px;text-transform:uppercase;padding:10px 18px}
.prose table.fees tbody tr:not(.group)>th{padding-left:30px}
.prose dl.info{display:grid;grid-template-columns:minmax(140px,220px) 1fr;border-top:2px solid var(--ink)}
.prose dl.info dt,.prose dl.info dd{padding:14px 4px;border-bottom:2px dotted var(--dot)}
.prose dl.info dt{font-weight:700;color:var(--ink);grid-column:1}
.prose dl.info dd{grid-column:2}
.prose dl.info dd+dd{border-top:0}
.prose dl.info dt:has(+dd+dd),.prose dl.info dd:has(+dd){border-bottom:0;padding-bottom:2px}
.prose dl.info dd+dd{padding-top:2px}
.prose dl.people{display:grid;grid-template-columns:minmax(160px,240px) 1fr;gap:0 24px}
.prose dl.people dt{font-weight:700;color:var(--blue);padding-top:14px;grid-column:1}
.prose dl.people dd{grid-column:2;padding-top:14px}
.prose dl.people dd+dd{padding-top:2px}
.prose ul.topics{list-style:none;padding:0;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:0 28px;border-top:2px solid var(--ink)}
.prose ul.topics li{margin:0;padding:10px 2px 10px 18px;border-bottom:2px dotted var(--dot);position:relative;font-size:15px}
.prose ul.topics li:before{content:"";position:absolute;left:2px;top:19px;width:6px;height:6px;border-radius:50%;background:var(--cyan)}
.prose ul.names{list-style:none;padding:0;display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:8px 24px}
.prose ul.names li{margin:0;padding:8px 0;border-bottom:2px dotted var(--dot)}
.prose details{border:1px solid var(--line);border-radius:12px;padding:0 18px}
.prose details+details{margin-top:10px}
.prose summary{cursor:pointer;padding:16px 0;font-weight:700;color:var(--ink);list-style:none;display:flex;justify-content:space-between;gap:12px}
.prose summary::-webkit-details-marker{display:none}
.prose summary:after{content:"+";color:var(--blue);font-size:20px;line-height:1}
.prose details[open] summary:after{content:"−"}
.prose details[open]{padding-bottom:16px}
.prose .covers{display:grid;grid-template-columns:repeat(auto-fill,minmax(130px,1fr));gap:18px}
.prose .covers a{display:block;text-decoration:none;color:var(--ink);font-weight:600;font-size:13.5px;text-align:center}
.prose .covers img{display:block;width:100%;aspect-ratio:3/4;object-fit:cover;border-radius:8px;border:1px solid var(--line);margin-bottom:8px;transition:.2s}
.prose .covers a:hover img{transform:translateY(-3px);box-shadow:0 10px 24px rgba(7,26,68,.14)}
.prose section.tour+section.tour{margin-top:56px;padding-top:40px;border-top:2px dotted var(--dot)}
.prose section.tour>*+*{margin-top:16px}
/* General Program timetable */
.prose .table:has(table.program){box-shadow:none;background:none;border-radius:0}
.prose table.program{table-layout:fixed;min-width:760px;border-collapse:separate;border-spacing:6px;margin:-6px;width:calc(100% + 12px);font-size:14px}
.prose table.program th,.prose table.program td{border:0;border-radius:10px;text-align:center;vertical-align:middle;line-height:1.4;padding:14px 10px;font-weight:600}
.prose table.program thead th{background:var(--navy);font-family:Montserrat;font-size:15px}
.prose table.program .session{background:#e6f0ff;color:#0f3c96}
.prose table.program .meal{background:#fff3d4;color:#7a5200}
.prose table.program .break{background:#fff;color:var(--muted);box-shadow:inset 0 0 0 2px var(--dot)}
.prose table.program .off{background:#f1f4f9;color:#4b5870}
.prose table.program .off:empty{background:repeating-linear-gradient(135deg,#f6f8fb 0 8px,#eef2f7 8px 16px)}
.prose table.program tr:hover>td{filter:none}
/* poster board drawing + photo */
.prose .poster-board{display:grid;grid-template-columns:minmax(180px,260px) 1fr;gap:20px;align-items:stretch}
.prose .poster-board figure{background:var(--bg);border-radius:14px;padding:18px;display:flex;align-items:center;justify-content:center}
.prose .poster-board .shot{padding:0;overflow:hidden;background:#fff;box-shadow:0 0 0 1px var(--line)}
.prose .poster-board .shot img{width:100%;height:100%;object-fit:cover;border-radius:0}
.prose .poster-board svg{width:100%;max-width:230px;height:auto}

/* partners + footer */
.partners{padding:56px 0;border-top:1px solid var(--line)}
.partners .row{display:flex;flex-wrap:wrap;align-items:center;gap:28px 44px}
.partners h3{font-size:12px;letter-spacing:2px;text-transform:uppercase;color:var(--muted);width:100%}
.partners img{width:auto;object-fit:contain;display:block}
.partners .sep{width:1px;height:40px;background:var(--line)}
.site-foot{background:var(--navy);color:#b7c5e2;padding:48px 0;font-size:14px}
.site-foot .row{display:flex;flex-wrap:wrap;justify-content:space-between;gap:24px}
.site-foot b{color:#fff;font-family:Montserrat;font-size:20px}
.site-foot img{height:22px}
.site-foot .r{text-align:right}

/* right quick bar: one pill (I-ASEM | Techno-Press) + round TOP button; names in tooltips */
.qside{position:fixed;right:22px;top:50%;transform:translateY(-50%);z-index:30;display:flex;flex-direction:column;align-items:center;gap:12px}
.qgroup{display:flex;flex-direction:column;width:68px;padding:6px 0;border-radius:34px;background:rgba(255,255,255,.92);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);box-shadow:0 10px 28px rgba(7,26,68,.18)}
.qgroup a{position:relative;display:grid;place-items:center;height:62px;transition:transform .25s}
.qgroup a+a:before{content:"";position:absolute;top:0;left:16px;right:16px;border-top:2px dotted var(--dot)}
.qgroup a:hover{transform:translateY(-1px)}
.qgroup img{width:36px;height:36px;object-fit:contain;transition:transform .3s cubic-bezier(.2,.7,.2,1.4)}
.qgroup .tpm{width:30px;height:30px}
.qgroup a:hover img{transform:scale(1.12)}
.qside .to-top{position:relative;display:grid;place-items:center;width:68px;height:68px;border-radius:50%;background:linear-gradient(135deg,var(--navy),var(--blue));color:#fff;box-shadow:0 10px 26px rgba(21,101,224,.35);transition:transform .25s,box-shadow .25s,opacity .3s,visibility .3s}
.qside .to-top:hover{transform:translateY(-3px);box-shadow:0 14px 32px rgba(21,101,224,.45)}
.qside .to-top svg{width:24px;height:24px;transition:transform .25s}
.qside .to-top:hover svg{transform:translateY(-3px)}
.qside .tip{position:absolute;right:calc(100% + 12px);top:50%;transform:translate(6px,-50%);background:var(--ink);color:#fff;font-size:12px;font-weight:600;line-height:1;padding:8px 11px;border-radius:7px;white-space:nowrap;opacity:0;pointer-events:none;transition:opacity .2s,transform .25s cubic-bezier(.2,.7,.2,1);z-index:2}
.qside .tip:before{content:"";position:absolute;left:100%;top:50%;margin-top:-5px;border:5px solid transparent;border-left-color:var(--ink)}
.qside a:hover .tip,.qside button:hover .tip,.qside a:focus-visible .tip,.qside button:focus-visible .tip{opacity:1;transform:translate(0,-50%)}

@media (max-width:1180px){
  .menu-btn{display:block}
  .nav{display:none;position:fixed;inset:76px 0 0;background:var(--navy);overflow:auto;padding:8px 20px 40px}
  .menu-open .nav{display:block}
  .nav>ul{flex-direction:column}
  .nav>ul>li>button{width:100%;text-align:left;padding:16px 4px;font-size:16px;border-bottom:1px solid rgba(255,255,255,.12)}
  .nav ul ul{position:static;box-shadow:none;background:transparent;color:#cfe0ff;padding:4px 0 10px 12px}
  .nav>ul>li:hover>ul{display:none}
  .nav li.open>ul{display:block}
  .nav ul ul a:hover,.nav ul ul a[aria-current]{background:rgba(255,255,255,.08);color:#fff}
  .menu-open .site-head{background:var(--navy);position:fixed}
}
@media (max-width:960px){
  .dates ol{grid-template-columns:repeat(3,1fr)}
  .dates li:nth-child(3){border-right:0}
  .dates li:nth-child(-n+3){border-bottom:2px dotted var(--dot)}
  .quick .grid,.cgrid{grid-template-columns:repeat(2,1fr)}
  .about,.venue .grid{grid-template-columns:1fr;gap:28px}
  .page-body{grid-template-columns:1fr;gap:32px;padding-top:28px}
  .side{position:static}
  .side h2{display:none}
  .side ul{display:flex;flex-wrap:wrap;gap:8px}
  .side li{border:0}
  .side a{padding:8px 14px;border:1px solid var(--line);border-radius:999px;font-size:14px}
  .side a:after{display:none}
  .side a[aria-current]{background:var(--navy);border-color:var(--navy);color:#fff}
}
@media (max-width:560px){
  .wrap{padding:0 16px}
  .hero{min-height:720px}
  .hero .wrap{padding-top:140px;padding-bottom:150px}
  .meta{font-size:16px;flex-direction:column;gap:4px}
  .meta div+div:before{display:none}
  .dates ol{grid-template-columns:1fr 1fr}
  .dates li{border-right:2px dotted var(--dot)!important;border-bottom:2px dotted var(--dot)}
  .dates li:nth-child(2n){border-right:0!important}
  .quick .grid{grid-template-columns:1fr;gap:12px}
  .q{height:96px;padding:16px;flex-direction:row;align-items:center;gap:14px;justify-content:flex-start}
  .q i{margin:0;width:46px;height:46px;flex:none}
  .q i svg{width:22px;height:22px}
  .cgrid{grid-template-columns:1fr}
  .c p{min-height:0}
  .home section{padding:64px 0}
  .confs{margin-top:64px}
  .venue li b{min-width:96px}
  .page-head .wrap{padding-top:130px;padding-bottom:44px}
  .page-body{min-height:0}
  .prose .table table{min-width:600px}
  .prose .table table.program{min-width:760px}
  .prose dl.info,.prose dl.people,.prose ul.topics{grid-template-columns:1fr}
  .prose dl.info dt,.prose dl.people dt{border-bottom:0;padding-bottom:0}
  .prose dl.info dd,.prose dl.people dd{grid-column:1}
  .prose dl.info dd{padding-top:4px}
  .site-foot .r{text-align:left}
  .qside{top:auto;bottom:16px;right:12px;transform:none;gap:8px}
  .qgroup{width:48px;padding:2px 0}
  .qgroup a{height:46px}
  .qgroup a+a:before{left:10px;right:10px}
  .qgroup img{width:26px;height:26px}
  .qgroup .tpm{width:22px;height:22px}
  .qside .to-top{width:48px;height:48px}
  .qside .tip{display:none}
  .prose .poster-board{grid-template-columns:1fr}
}

/* ---------- motion: page change, header, hover/press/focus, entrance and scroll reveal ----------
   Reveal and entrance run only with html.motion (set in <head> unless the visitor asks for less motion). */
@view-transition{navigation:auto}
/* a plain crossfade; the header (and quick bar) stay put */
::view-transition-old(root){animation:vt-out .22s ease both}
::view-transition-new(root){animation:vt-in .32s ease both}
@keyframes vt-out{to{opacity:0}}
@keyframes vt-in{from{opacity:0}}
.site-head{view-transition-name:site-head}
.qside{view-transition-name:qside}
.scroll-progress{view-transition-name:progress}
::view-transition-group(site-head),::view-transition-group(qside),::view-transition-group(progress){animation:none}
::view-transition-old(site-head),::view-transition-new(site-head),::view-transition-old(qside),::view-transition-new(qside){animation:none}
::view-transition-old(site-head){display:none}
::view-transition-old(qside){display:none}
::view-transition-old(progress),::view-transition-new(progress){animation:none}
::view-transition-old(progress){display:none}
@media (prefers-reduced-motion:reduce){::view-transition-old(root),::view-transition-new(root){animation:none}}

.scroll-progress{position:fixed;left:0;top:0;right:0;height:3px;z-index:60;background:linear-gradient(90deg,var(--cyan),var(--blue));transform-origin:0 50%;transform:scaleX(0);pointer-events:none}

/* header becomes a glass bar once the page scrolls */
.site-head{position:fixed;transition:background .35s,box-shadow .35s}
.site-head .bar{transition:height .35s}
html.scrolled .site-head{background:rgba(7,26,68,.86);backdrop-filter:blur(14px) saturate(140%);-webkit-backdrop-filter:blur(14px) saturate(140%);box-shadow:0 10px 30px rgba(4,14,40,.25)}
html.scrolled .site-head .bar{height:64px}
.brand{transition:letter-spacing .35s cubic-bezier(.2,.7,.2,1)}
.brand:hover{letter-spacing:1.5px}

/* menu: underline grows, dropdown fades in */
@media (min-width:1181px){
  .nav>ul>li>button{position:relative;transition:padding .35s,color .2s}
  .nav>ul>li>button:after{content:"";position:absolute;left:11px;right:11px;bottom:18px;height:2px;border-radius:2px;background:var(--cyan);transform:scaleX(0);transition:transform .3s cubic-bezier(.2,.7,.2,1),bottom .35s}
  .nav>ul>li:hover>button:after,.nav>ul>li.on>button:after{transform:scaleX(1)}
  html.scrolled .nav>ul>li>button{padding-top:20px;padding-bottom:20px}
  html.scrolled .nav>ul>li>button:after{bottom:12px}
  .nav ul ul{display:block;visibility:hidden;opacity:0;transform:translateY(10px);transition:opacity .22s,transform .3s cubic-bezier(.2,.7,.2,1),visibility .3s}
  .nav>ul>li:hover>ul,.nav li.open>ul{visibility:visible;opacity:1;transform:none}
  .nav ul ul a{transition:background .2s,color .2s,padding .25s}
  .nav ul ul a:hover{padding-left:18px}
}

/* buttons: light sweep on hover, press on click */
.btn{position:relative;overflow:hidden;isolation:isolate;transition:transform .25s cubic-bezier(.2,.7,.2,1),box-shadow .25s,background .25s,color .25s}
.btn:before{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(110deg,transparent 30%,rgba(255,255,255,.35) 50%,transparent 70%);transform:translateX(-120%);transition:transform .7s cubic-bezier(.2,.7,.2,1)}
.btn:hover{transform:translateY(-2px)}
.btn:hover:before{transform:translateX(120%)}
.btn.fill:hover{box-shadow:0 14px 34px rgba(33,140,240,.5)}
a,button{-webkit-tap-highlight-color:transparent}
.btn:active,.q:active,.c:active,.qgroup a:active,.qside .to-top:active,.side a:active,.prose .file:active,.menu-btn:active{scale:.96;transition:scale .08s}
:focus-visible{outline:2px solid var(--cyan);outline-offset:4px;transition:outline-offset .2s}

/* cards and lists */
.q{transition:transform .35s cubic-bezier(.2,.7,.2,1),box-shadow .35s}
.q:hover{transform:translateY(-4px);box-shadow:0 18px 40px rgba(7,26,68,.28)}
.q img{transition:transform .9s cubic-bezier(.2,.7,.2,1)}
.q i{transition:background .3s,transform .4s cubic-bezier(.2,.7,.2,1.4)}
.q:hover i{transform:scale(1.08)}
.q b{transition:transform .35s cubic-bezier(.2,.7,.2,1)}
.q:hover b{transform:translateX(4px)}
.c{transition:transform .35s cubic-bezier(.2,.7,.2,1),box-shadow .35s,border-color .35s}
.c b{display:inline-block;transition:transform .35s cubic-bezier(.2,.7,.2,1)}
.c:hover b{transform:translateX(3px)}
.dates li{transition:background .3s}
.dates li:not(:last-child):hover{background:#f6faff}
.dates time{transition:color .3s}
.dates li:not(:last-child):hover time{color:var(--blue)}
.venue figure img:first-child{transition:transform 1.2s cubic-bezier(.2,.7,.2,1)}
.venue figure:hover img:first-child{transform:scale(1.04)}
.partners img{transition:transform .3s}
.partners a:hover img{transform:translateY(-2px)}
.side a{transition:color .2s,padding .3s cubic-bezier(.2,.7,.2,1)}
.side a:hover{padding-left:10px}
.prose .photos figure,.prose>figure{overflow:hidden;border-radius:12px}
.prose .photos img,.prose>figure img{transition:transform .8s cubic-bezier(.2,.7,.2,1)}
.prose .photos figure:hover img{transform:scale(1.04)}
.prose details{transition:border-color .25s}
.prose details:hover{border-color:#b9d3f8}
.prose summary:after{transition:transform .3s}
.prose details[open] summary:after{transform:rotate(180deg)}
.prose .table tbody tr>*{transition:background .2s}
.prose .file{transition:border-color .2s,color .2s,transform .25s}
.prose .file:hover{transform:translateY(-1px)}

/* TOP appears after the first screen */
.qside .to-top{opacity:0;visibility:hidden;translate:0 8px}
html.past .qside .to-top{opacity:1;visibility:visible;translate:0 0}

/* hero photo as its own layer: slow zoom on load, light parallax on scroll */
.hero{overflow:hidden;background-image:none}
.hero:after{content:"";position:absolute;inset:-4% 0;z-index:-2;background:url(/assets/img/incheon-convensia-art.jpg) 72% 50%/cover;transform:translate3d(0,var(--py,0),0)}
html.motion .hero:after{animation:kenburns 14s cubic-bezier(.2,.6,.3,1) both}
@keyframes kenburns{from{scale:1.12}to{scale:1}}

/* entrance */
html.motion .hero .eyebrow,html.motion .hero h1,html.motion .hero .meta,html.motion .hero .cta,
html.motion .page-head .crumb,html.motion .page-head h1{animation:rise 1s cubic-bezier(.2,.7,.2,1) both}
html.motion .hero h1{animation-delay:.12s}
html.motion .hero .meta{animation-delay:.26s}
html.motion .hero .cta{animation-delay:.38s}
html.motion .page-head h1{animation-delay:.1s}
@keyframes rise{from{opacity:0;transform:translateY(16px)}}

/* scroll reveal (site.js marks the elements) */
html.motion [data-reveal]{opacity:0;translate:0 26px;transition:opacity .9s cubic-bezier(.2,.7,.2,1) var(--d,0s),translate .9s cubic-bezier(.2,.7,.2,1) var(--d,0s),transform .35s cubic-bezier(.2,.7,.2,1),box-shadow .35s,border-color .35s,background .3s}
html.motion [data-reveal].in{opacity:1;translate:0 0}