/* Readable event details alongside a projected-3D scene with native controls. */
.event-hero {
  --scene-accent: #87f2d5;
  --scene-soft: #87f2d518;
  position: relative;
  background: radial-gradient(ellipse at 79% 35%, #12515944, transparent 48%),
    radial-gradient(ellipse at 65% 75%, #6335af22, transparent 50%), #060d16;
  color: #f3f7fc;
  border-bottom: 1px solid #ffffff20;
}
.event-hero[data-stop="govern"] { --scene-accent: #ffc184; --scene-soft: #ffc18418; }
.event-hero[data-stop="operate"] { --scene-accent: #c4aeff; --scene-soft: #c4aeff18; }
.event-hero-layout {
  display: grid;
  grid-template-columns: 1fr 1.15fr;
  gap: clamp(28px, 4vw, 64px);
  align-items: start;
  padding-block: 48px 56px;
}
.event-intro { min-width: 0; }
.event-intro h1 { margin: 0 0 28px; font-family: Ember, Pretendard, sans-serif; font-weight: 700; font-size: clamp(64px, 7.6vw, 112px); letter-spacing: -.055em; line-height: .96; }
.event-intro h1 span { display: block; }
.event-intro h1 span:last-child { color: #87f2d5; }
.event-message { margin: 0; font-size: clamp(17px, 1.65vw, 23px); line-height: 1.65; letter-spacing: -.65px; word-break: keep-all; overflow-wrap: anywhere; }
.event-message strong { display: block; margin-bottom: 10px; font-size: clamp(20px, 1.95vw, 27px); letter-spacing: -.8px; }
.event-message>span { display: block; color: #d1ddeb; }
.event-details { display: grid; gap: 16px; margin: 30px 0 26px; padding-top: 25px; border-top: 1px solid #ffffff26; }
.event-details>div { display: grid; grid-template-columns: 38px 1fr; gap: 14px; }
.event-details dt { padding-top: 2px; font-size: 15px; color: #a9bcd0; }
.event-details dd { margin: 0; font-size: 19px; font-weight: 700; line-height: 1.5; }
.event-details dd span { display: block; color: #bdccdd; font-size: 16px; font-weight: 400; margin-top: 3px; }
.event-details .event-date { display:flex; align-items:center; flex-wrap:wrap; gap:8px 12px; }
.event-details #event-badge { display:inline-block; margin:0; padding:2px 8px; border:1px solid #87f2d548; border-radius:4px; color:#9fe8d5; background:#87f2d50a; font-size:13px; font-weight:600; letter-spacing:.3px; line-height:1.5; white-space:nowrap; }
.event-agenda-link { display: inline-flex; align-items: center; justify-content: space-between; gap: 48px; padding: 16px 22px; min-height: 56px; background: #87f2d5; color: #05251e; border-radius: 6px; font-size: 18px; font-weight: 700; transition: background .2s, transform .2s; }
.event-agenda-link:hover { background: #b1ffe9; transform: translateY(-2px); }
.event-agenda-link>span { font-size: 24px; line-height: 1; }
.event-explorer { min-width: 0; margin-top: 4px; }
.topic-tabs { display: grid; grid-template-columns: repeat(3, 1fr); border-bottom: 1px solid #ffffff28; }
.topic-tab { display: flex; align-items: center; justify-content: center; gap: 10px; padding: 16px 8px; min-height: 60px; color: #acbed2; border-bottom: 3px solid transparent; }
.topic-tab>span { font-family: Ember, sans-serif; font-size: 14px; }
.topic-tab strong { font-size: 20px; }
.topic-tab.active { color: var(--scene-accent); border-color: var(--scene-accent); background: linear-gradient(transparent, var(--scene-soft)); }
.topic-tab:hover { color: #fff; background-color: #ffffff08; }
.topic-panel { border-radius: 4px; }
.topic-stage { height: 460px; position: relative; isolation: isolate; }
.event-hero #core-universe { position: absolute; inset: 0; width: 100%; height: 100%; pointer-events: auto; cursor: grab; touch-action: pan-y; }
.event-hero #core-universe.swiping { cursor: grabbing; }
.topic-core { position: absolute; top: 46%; left: 50%; transform: translate(-50%, -50%); display: grid; justify-items: center; pointer-events: none; text-shadow: 0 2px 15px #000; }
.topic-core img { width: 64px; height: 64px; border-radius: 14px; box-shadow: 0 0 42px var(--scene-soft), 0 8px 30px #0006; margin-bottom: 10px; }
.topic-core>span { font-size: 14px; color: #d0e4f0; white-space: nowrap; }
.topic-core>strong { font: 700 26px/1.3 Ember, sans-serif; color: #edf9f7; }
.topic-nodes { position: absolute; inset: 0; pointer-events: none; }
.topic-nodes>div { position: absolute; display: flex; align-items: center; gap: 10px; padding: 11px 14px; border: 1px solid #c8e6ff30; border-radius: 12px; background: #142338d9; backdrop-filter: blur(10px); box-shadow: 0 12px 35px #0005; animation: orbit-label-float 7s ease-in-out infinite; }
.topic-nodes>div:nth-child(1) { top: 12%; left: 0; }
.topic-nodes>div:nth-child(2) { top: 46%; right: 0; animation-delay: -2.5s; }
.topic-nodes>div:nth-child(3) { bottom: 7%; left: 9%; animation-delay: -4.5s; }
.topic-nodes img { background: #fff; width: 40px; height: 40px; padding: 4px; border: 1px solid #fff; border-radius: 9px; flex-shrink: 0; }
.topic-nodes strong { font: 400 16px/1.4 Ember, sans-serif; color: #f0f6ff; }
.topic-copy { padding: 0; margin: 5px 0 24px; }
.topic-kicker { display: flex; gap: 12px; font-size: 14px; color: var(--scene-accent); }
.topic-copy h2 { font-size: 29px; line-height: 1.4; letter-spacing: -.6px; margin: 9px 0; }
.topic-copy>p { color: #c5d3e3; font-size: 17px; line-height: 1.8; word-break: keep-all; min-height: 3.6em; }
.event-hero :focus-visible { outline: 2px solid var(--scene-accent); outline-offset: 5px; }
.event-hero .event-agenda-link:focus-visible { outline-color: #fff; }
.event-hero.tour-unavailable:before { display: none; }
.event-hero.tour-unavailable .topic-stage { opacity: .6; }
.motion-paused .topic-nodes>div { animation-play-state: paused; }
@keyframes orbit-label-float { 0%,100% { transform: translateY(0); } 50% { transform: translateY(-9px); } }
@media(prefers-reduced-motion:reduce) { .topic-nodes>div { animation: none; } }

@media (min-width: 761px) and (max-width: 1100px) {
  .event-hero-layout { gap: 30px; grid-template-columns: 1.05fr 1fr; padding-block: 44px 54px; }
  .event-intro h1 { font-size: clamp(60px, 7.8vw, 84px); }
  .event-message { font-size: 18px; }
  .event-message strong { font-size: 22px; }
  .topic-tab { gap: 6px; }
  .topic-tab strong { font-size: 18px; }
  .topic-stage { height: 400px; }
  .topic-copy { padding-left: 0; }
  .topic-copy h2 { font-size: 26px; }
  .topic-nodes strong { font-size: 14px; }
  .topic-nodes>div { padding: 9px; gap: 7px; }
  .topic-nodes img { width: 34px; height: 34px; }
}
@media (max-width: 760px) {
  .event-hero-layout { grid-template-columns: 1fr; gap: 0; padding-block: 30px 38px; }
  .event-intro { display: contents; }
  .event-intro h1 { order: 2; }
  .event-message { order: 3; margin-bottom: 26px; }
  .event-explorer { order: 4; }
  .event-details { order: 5; }
  .event-agenda-link { order: 6; }
  .event-intro h1 { font-size: clamp(60px, 14vw, 100px); margin:0 0 24px; }
  .event-message { font-size: clamp(16px, 4.2vw, 22px); letter-spacing: -.6px; }
  .event-message strong { font-size: clamp(19px, 5vw, 25px); }
  .event-details { margin-top: 25px; gap: 14px; padding-top: 22px; }
  .event-details dd { font-size: 18px; }
  .event-details dd span { font-size: 15px; }
  .event-agenda-link { width: 100%; }
  .event-explorer { margin: 0; }
  .topic-tab strong { font-size: 19px; }
  .topic-stage { height: 350px; }
  .topic-core img { width: 48px; height: 48px; }
  .topic-core>strong { font-size: 23px; }
  .topic-nodes>div { padding: 8px 10px; gap: 7px; }
  .topic-nodes strong { font-size: 14px; }
  .topic-nodes img { width: 32px; height: 32px; }
  .topic-nodes>div:nth-child(1) { top: 6%; }
  .topic-nodes>div:nth-child(2) { top: 67%; }
  .topic-nodes>div:nth-child(3) { bottom: 1%; left: 0; }
  .topic-copy { padding-left: 0; }
  .topic-copy h2 { font-size: 27px; }
}
@media (max-width: 370px) {
  .topic-tab { gap: 6px; }
  .topic-tab strong { font-size: 17px; }
  .topic-nodes strong { font-size: 14px; }
}
@media print { .event-hero { display: none!important; } }
