
/* RC15.40 — exact reference layout on the full working site. */
.exact-epilogue-transition{
  min-height:0!important;height:auto!important;padding:0!important;margin:0!important;
  overflow:visible!important;background:#06111f!important;
}
.exact-epilogue{width:100%;background:#06111f}
.exact-epilogue__frame{
  position:relative;width:min(100vw,1920px);aspect-ratio:16/9;min-height:720px;margin:0 auto;
  overflow:hidden;background:
    radial-gradient(circle at 50% 42%,rgba(24,66,103,.17),transparent 39%),
    linear-gradient(180deg,#06111f 0%,#071422 100%);
}

/* No overlap: title owns its own top zone. */
.exact-epilogue__header{
  position:absolute;z-index:30;left:50%;top:2.5%;width:64%;transform:translateX(-50%);text-align:center
}
.exact-epilogue__header h2{
  margin:0;color:#f0f6ff;font-size:clamp(46px,4.45vw,86px);line-height:.95;letter-spacing:-.055em
}
.exact-epilogue__en{margin:1.1% 0 0;color:#22d3ee;font-size:clamp(14px,1.02vw,20px);line-height:1.25}
.exact-epilogue__ko{margin:.55% 0 0;color:#e2edf8;font-size:clamp(12px,.78vw,16px);line-height:1.35}
.exact-epilogue__cue{
  display:block;width:1px;height:27px;margin:11px auto 0;
  background:linear-gradient(180deg,#22d3ee,rgba(34,211,238,0))
}

/* Top 4: 18–43%, exactly one band. */
.exact-epilogue__featured{position:absolute;z-index:20;left:3.3%;right:3.3%;top:18.0%;height:25.6%}

.exact-memory{
  position:absolute;margin:0;overflow:hidden;border:1px solid rgba(34,211,238,.42);border-radius:15px;
  background:#081523;box-shadow:0 13px 34px rgba(0,0,0,.36),0 0 15px rgba(34,211,238,.07);
  cursor:pointer;transform-origin:center;transition:transform .22s cubic-bezier(.2,.8,.2,1),box-shadow .22s ease,filter .22s ease
}
.exact-memory img{display:block;width:100%;height:100%;object-fit:cover;object-position:center;filter:brightness(.9) saturate(.98)}
.exact-memory::after{
  content:"";position:absolute;z-index:2;left:0;right:0;bottom:0;height:40%;
  background:linear-gradient(to top,rgba(2,8,18,.93),rgba(2,8,18,0));pointer-events:none
}
.exact-memory figcaption{
  position:absolute;z-index:5;left:12px;bottom:10px;display:flex;gap:8px;align-items:baseline;
  font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;line-height:1;text-shadow:0 1px 6px rgba(0,0,0,.96)
}
.exact-memory figcaption b{color:#22d3ee;font-size:clamp(9px,.72vw,14px)}
.exact-memory figcaption span{color:#fff;font-size:clamp(9px,.66vw,13px);font-weight:700}

.f01{left:0;top:14%;width:24%;height:80%}
.f02{left:24.7%;top:0;width:23.9%;height:97%}
.f03{left:49.3%;top:1%;width:23.9%;height:96%}
.f04{left:73.8%;top:14%;width:26.2%;height:80%}
.f02 img{object-position:center 44%}

/* Lower 14 visually connect immediately to the top four. */
.exact-epilogue__orbit{position:absolute;z-index:8;left:0;right:0;top:43.1%;bottom:0}
.exact-epilogue__orbit::before{
  content:"";position:absolute;left:5.2%;top:8.5%;width:89.6%;height:78%;
  border:1px solid rgba(34,211,238,.88);border-radius:50%;box-shadow:0 0 12px rgba(34,211,238,.16)
}
.exact-epilogue__center{
  position:absolute;z-index:10;left:50%;top:46.5%;width:39%;transform:translate(-50%,-50%);text-align:center
}
.exact-epilogue__center>span{
  display:block;margin-bottom:12px;color:#22d3ee;font-size:clamp(8px,.58vw,11px);font-weight:800;letter-spacing:.20em
}
.exact-epilogue__center h3{
  margin:0;color:#eff6ff;font-size:clamp(52px,5.0vw,94px);line-height:.80;letter-spacing:-.06em
}
.exact-epilogue__center h3 em{color:#7f9fc0;font-style:normal;font-weight:650}
.exact-epilogue__center p{margin:18px 0 0;color:#8199b2;font-size:clamp(10px,.68vw,13px);line-height:1.5}

/* Enlarged lower cards. */
.exact-epilogue__orbit .exact-memory{
  width:13.4%;aspect-ratio:16/10;transform:translate(-50%,-50%);
}
.m05{left:66.0%;top:8%}.m06{left:78.3%;top:14%}.m07{left:87.0%;top:28%}.m08{left:90.3%;top:43%}
.m09{left:87.0%;top:59%}.m10{left:78.5%;top:73%}.m11{left:66.3%;top:82%}.m12{left:53.5%;top:86%}
.m13{left:40.6%;top:86%}.m14{left:27.8%;top:82%}.m15{left:16.0%;top:73%}.m16{left:7.8%;top:58%}
.m17{left:7.0%;top:36%}.m18{left:16.0%;top:14%}

.exact-memory.is-memory-pulse{
  z-index:60!important;filter:brightness(1.08);
  box-shadow:0 24px 64px rgba(0,0,0,.58),0 0 30px rgba(34,211,238,.23)
}
.exact-epilogue__featured .exact-memory.is-memory-pulse{transform:scale(1.11)}
.exact-epilogue__orbit .exact-memory.is-memory-pulse{transform:translate(-50%,-50%) scale(1.11)}

/* Suppress only the obsolete old first memory scene. */
#next-story > .epilogue__chapter--memory{display:none!important}

@media(max-width:1100px){
  .exact-epilogue__frame{min-height:640px}
  .exact-memory{border-radius:11px}
  .exact-memory figcaption{left:8px;bottom:7px;gap:5px}
  .exact-epilogue__center{width:44%}
}
@media(max-width:760px){
  .exact-epilogue__frame{aspect-ratio:auto;height:900px;min-height:900px}
  .exact-epilogue__header{width:90%;top:3%}
  .exact-epilogue__featured{left:2.5%;right:2.5%;top:18%;height:28%}
  .f01{left:0;top:11%;width:49%;height:41%}.f02{left:51%;top:0;width:49%;height:52%}
  .f03{left:0;top:54%;width:49%;height:45%}.f04{left:51%;top:55%;width:49%;height:42%}
  .exact-epilogue__orbit{top:48%}.exact-epilogue__orbit .exact-memory{width:19%}.exact-epilogue__center{width:54%}
}


/* RC15.41 — visibility fix
   This section is no longer controlled by the old Global Journey climax. */
.exact-epilogue-transition{
  position:relative !important;
  inset:auto !important;
  z-index:1 !important;
  display:block !important;
  opacity:1 !important;
  visibility:visible !important;
  width:100vw !important;
  max-width:none !important;
  margin-left:calc(50% - 50vw) !important;
  margin-right:calc(50% - 50vw) !important;
  transform:none !important;
  backdrop-filter:none !important;
}

/* Escape the max-width of the Global Journey container. */
.global-journey{
  overflow:visible !important;
}
.exact-epilogue,
.exact-epilogue__frame{
  opacity:1 !important;
  visibility:visible !important;
}


/* RC15.42 — taller memory orbit; preserve 16:9 composition and featured band. */
.exact-epilogue__orbit::before{
  top:1.5% !important;
  height:94% !important;
}
/* Spread the 14 lower memories vertically around the taller ellipse. */
.m05{left:66.0%;top:3%}.m06{left:78.3%;top:9%}.m07{left:87.0%;top:22%}.m08{left:90.3%;top:39%}
.m09{left:87.0%;top:62%}.m10{left:78.5%;top:79%}.m11{left:66.3%;top:91%}.m12{left:53.5%;top:96%}
.m13{left:40.6%;top:96%}.m14{left:27.8%;top:91%}.m15{left:16.0%;top:79%}.m16{left:7.8%;top:62%}
.m17{left:7.0%;top:39%}.m18{left:16.0%;top:9%}
/* Slightly larger lower cards, without changing the featured four. */
.exact-epilogue__orbit .exact-memory{width:14.2% !important;}


/* ============================================================
   RC15.43 — ORBIT CARD FIX
   1) Prevent lower memories from overlapping the top four.
   2) Keep every number/year label visible.
   3) Enlarge the lower-center memories.
   4) Preserve the existing The Next Story / Ten years typography.
   ============================================================ */

/* Give the lower orbit its own visual zone immediately below the featured band. */
.exact-epilogue__orbit{
  top:43.8% !important;
}

/* Keep the ellipse tall, but with enough breathing room from the featured row. */
.exact-epilogue__orbit::before{
  left:5.2% !important;
  top:7% !important;
  width:89.6% !important;
  height:84% !important;
}

/* Default lower memory size. */
.exact-epilogue__orbit .exact-memory{
  width:13.6% !important;
  aspect-ratio:16/10 !important;
  overflow:hidden !important;
}

/* All captions must remain visible. */
.exact-epilogue__orbit .exact-memory figcaption{
  display:flex !important;
  opacity:1 !important;
  visibility:visible !important;
  z-index:8 !important;
  left:10px !important;
  bottom:8px !important;
}
.exact-epilogue__orbit .exact-memory figcaption b,
.exact-epilogue__orbit .exact-memory figcaption span{
  display:inline !important;
  opacity:1 !important;
  visibility:visible !important;
}

/* Rebuild the 14-card orbit so the upper cards no longer collide with 01–04.
   The bottom arc is wider and the central cards are larger. */
.m05{left:69% !important;top:16% !important}
.m06{left:81% !important;top:23% !important}
.m07{left:89% !important;top:34% !important}
.m08{left:92% !important;top:48% !important}
.m09{left:88% !important;top:61% !important}

.m10{left:82% !important;top:72% !important}
.m11{left:68% !important;top:80% !important}
.m12{left:53.5% !important;top:84% !important}
.m13{left:39% !important;top:84% !important}
.m14{left:24.5% !important;top:80% !important}
.m15{left:11.5% !important;top:72% !important}

.m16{left:6.5% !important;top:59% !important}
.m17{left:7.5% !important;top:42% !important}
.m18{left:17% !important;top:23% !important}

/* Make the lower-center memories materially larger, as requested. */
.m10,.m11,.m12,.m13,.m14,.m15{
  width:15% !important;
}

/* Slightly strengthen the dark caption backing so years remain readable. */
.exact-epilogue__orbit .exact-memory::after{
  height:46% !important;
  background:linear-gradient(to top,rgba(2,8,18,.96),rgba(2,8,18,.04)) !important;
}

/* Keep the center copy untouched and above cards. */
.exact-epilogue__center{
  z-index:20 !important;
}

/* Desktop 16:9 is the reference layout. */
@media(min-width:1400px){
  .exact-epilogue__orbit .exact-memory{
    min-width:180px;
  }
  .m10,.m11,.m12,.m13,.m14,.m15{
    min-width:205px;
  }
}


/* ============================================================
   RC15.44 — TALLER ORBIT / CLEAR CENTER
   실제 홈페이지 수정:
   - 중앙 타이포그래피는 유지
   - 타원의 세로 반경 확대
   - 하단 중앙 카드 10~15를 더 아래로 이동
   - 중앙 카피와 사진 사이에 명확한 safe zone 확보
   ============================================================ */

/* 하단 구간 자체의 세로 공간을 더 확보 */
.exact-epilogue__orbit{
  top:42.8% !important;
  bottom:-4.5% !important;
}

/* 좌우 폭은 그대로, 세로 폭만 확장 */
.exact-epilogue__orbit::before{
  left:5.2% !important;
  top:2.5% !important;
  width:89.6% !important;
  height:94% !important;
}

/* 중앙 문구는 기존 위치를 유지하면서 사진보다 위에 보이도록 */
.exact-epilogue__center{
  left:50% !important;
  top:43.5% !important;
  width:39% !important;
  z-index:30 !important;
  pointer-events:none !important;
}

/* 중앙 문구 주변에 투명한 안전영역을 만들어 카드가 시각적으로 침범하지 않게 함 */
.exact-epilogue__center::before{
  content:"";
  position:absolute;
  z-index:-1;
  left:50%;
  top:50%;
  width:118%;
  height:116%;
  transform:translate(-50%,-50%);
  border-radius:42%;
  background:radial-gradient(
    ellipse at center,
    rgba(6,17,31,.97) 0%,
    rgba(6,17,31,.93) 56%,
    rgba(6,17,31,.54) 78%,
    rgba(6,17,31,0) 100%
  );
}

/* 상단 좌우 카드들은 상단 4장과 겹치지 않는 범위에서 조금 더 아래로 */
.m05{left:69% !important;top:13.5% !important}
.m06{left:81% !important;top:21.5% !important}
.m07{left:89% !important;top:34.5% !important}
.m08{left:92% !important;top:49% !important}
.m09{left:88% !important;top:63% !important}

/* 하단 중앙 아크를 명확히 아래로 내려 중앙 문구와 분리 */
.m10{left:81% !important;top:78% !important}
.m11{left:67.5% !important;top:87% !important}
.m12{left:53.5% !important;top:91% !important}
.m13{left:39.5% !important;top:91% !important}
.m14{left:25.5% !important;top:87% !important}
.m15{left:12.5% !important;top:78% !important}

.m16{left:6.5% !important;top:63% !important}
.m17{left:7.5% !important;top:46% !important}
.m18{left:17% !important;top:23% !important}

/* 하단 중앙 카드는 큰 크기를 유지 */
.m10,.m11,.m12,.m13,.m14,.m15{
  width:15% !important;
}

/* 1920×1080 계열 화면에서 하단 카드가 잘리지 않도록 프레임 공간 확대 */
@media(min-width:1400px){
  .exact-epilogue__frame{
    aspect-ratio:16/9 !important;
    min-height:900px !important;
  }
  .exact-epilogue__orbit{
    overflow:visible !important;
  }
}


/* ============================================================
   RC15.45 — BOTTOM CARDS FULLY VISIBLE
   목표:
   - 타원의 세로감 유지
   - 하단 카드가 프레임에 의해 일직선으로 잘리지 않도록 수정
   - 중앙 문구와의 간격 유지
   - 카드 크기는 유지
   ============================================================ */

/* 타원은 충분히 높게 유지하되 프레임 안쪽에서 끝나도록 조정 */
.exact-epilogue__orbit{
  top:42.8% !important;
  bottom:0 !important;
  overflow:visible !important;
}

.exact-epilogue__orbit::before{
  left:5.2% !important;
  top:3.5% !important;
  width:89.6% !important;
  height:88% !important;
}

/* 하단 아크 전체를 약간 위로 올려 카드 전체가 프레임 안에 들어오도록 함 */
.m10{left:81% !important;top:72.5% !important}
.m11{left:67.5% !important;top:80.5% !important}
.m12{left:53.5% !important;top:84.0% !important}
.m13{left:39.5% !important;top:84.0% !important}
.m14{left:25.5% !important;top:80.5% !important}
.m15{left:12.5% !important;top:72.5% !important}

/* 좌우 하단 카드도 새 하단 곡선에 자연스럽게 연결 */
.m09{left:88% !important;top:59.5% !important}
.m16{left:6.5% !important;top:59.5% !important}

/* 프레임 하단에 실제 여백 확보 */
@media(min-width:1400px){
  .exact-epilogue__frame{
    min-height:960px !important;
    padding-bottom:48px !important;
    box-sizing:border-box !important;
  }

  .exact-epilogue__orbit .exact-memory{
    max-height:none !important;
  }
}

/* 1920×1080 기준에서 하단 카드가 잘리지 않도록 안전 보정 */
@media(min-width:1700px) and (max-height:1200px){
  .exact-epilogue__frame{
    min-height:1020px !important;
  }
  .m10,.m11,.m12,.m13,.m14,.m15{
    top:82% !important;
  }
  .m10{left:81% !important}
  .m11{left:67.5% !important}
  .m12{left:53.5% !important}
  .m13{left:39.5% !important}
  .m14{left:25.5% !important}
  .m15{left:12.5% !important}
}


/* ============================================================
   RC15.53 — COMPLETE TALL ORBIT
   Rebuilt from RC15.51 QA FULL.
   IMPORTANT:
   - No translateY used for orbit placement.
   - Photo sizes preserved.
   - X positions preserved.
   - Only frame height + orbit Y positions changed.
   ============================================================ */

@media (min-width:1400px){

  /* Give the complete ellipse real vertical room inside the document flow. */
  .exact-epilogue__frame{
    aspect-ratio:auto !important;
    height:1350px !important;
    min-height:1350px !important;
    padding-bottom:0 !important;
    overflow:hidden !important;
    box-sizing:border-box !important;
  }

  .exact-epilogue{
    min-height:1350px !important;
    overflow:visible !important;
  }

  /* The orbit starts in the same visual place, but now has much more height. */
  .exact-epilogue__orbit{
    top:42.0% !important;
    bottom:0 !important;
    height:auto !important;
    overflow:visible !important;
  }

  /* A tall ellipse. Horizontal width is unchanged. */
  .exact-epilogue__orbit::before{
    left:5.2% !important;
    top:1.5% !important;
    width:89.6% !important;
    height:92% !important;
  }

  /* Freeze central statement. */
  .exact-epilogue__center{
    left:50% !important;
    top:42.5% !important;
    width:39% !important;
    z-index:30 !important;
  }

  /* ========================================================
     14 cards on one continuous tall ellipse.
     X coordinates = preserved.
     Y coordinates = redesigned only.
     ======================================================== */

  /* upper-right */
  .m05{ left:69% !important;   top:12% !important; }
  .m06{ left:81% !important;   top:19% !important; }
  .m07{ left:89% !important;   top:30% !important; }
  .m08{ left:92% !important;   top:43% !important; }
  .m09{ left:88% !important;   top:57% !important; }

  /* lower-right into bottom */
  .m10{ left:81% !important;   top:70% !important; }
  .m11{ left:67.5% !important; top:81% !important; }
  .m12{ left:53.5% !important; top:87% !important; }

  /* bottom-left outwards */
  .m13{ left:39.5% !important; top:87% !important; }
  .m14{ left:25.5% !important; top:81% !important; }
  .m15{ left:12.5% !important; top:70% !important; }

  /* left side upward */
  .m16{ left:6.5% !important;  top:57% !important; }
  .m17{ left:7.5% !important;  top:43% !important; }
  .m18{ left:17% !important;   top:27% !important; }

  /* Critical reset: remove any accidental movement inherited elsewhere. */
  .exact-epilogue__orbit .exact-memory{
    translate:none !important;
  }

  /* Keep all lower cards fully visible. */
  .exact-epilogue__orbit .exact-memory{
    max-height:none !important;
  }
}

/* 1920×1080 browser windows still get the full card arc by scrolling
   through the 1350px section instead of clipping the photos. */
@media (min-width:1700px) and (max-height:1200px){
  .exact-epilogue__frame{
    height:1350px !important;
    min-height:1350px !important;
  }
}


/* ============================================================
   RC15.54 — ORBIT POLISH
   - Keep card sizes and central typography frozen.
   - Raise m18 (2026 FRC) to the same visual level as m05 (2018).
   - Move the remaining cards progressively clockwise.
   - Increase spacing around the lower arc.
   ============================================================ */

@media (min-width:1400px){

  /* Right upper arc */
  .m05{ left:69% !important;   top:12% !important; }
  .m06{ left:81.5% !important; top:20% !important; }
  .m07{ left:89.5% !important; top:31.5% !important; }
  .m08{ left:92.3% !important; top:45% !important; }
  .m09{ left:88.3% !important; top:59% !important; }

  /* Right lower arc → bottom */
  .m10{ left:80.5% !important; top:72.5% !important; }
  .m11{ left:67% !important;   top:83% !important; }
  .m12{ left:52.5% !important; top:88.5% !important; }

  /* Bottom → left lower arc */
  .m13{ left:38% !important;   top:88% !important; }
  .m14{ left:24% !important;   top:82% !important; }
  .m15{ left:12.5% !important; top:71% !important; }

  /* Left side: progressively clockwise upward */
  .m16{ left:6.8% !important;  top:56% !important; }
  .m17{ left:8.5% !important;  top:37% !important; }

  /* 2026 FRC aligns vertically with 2018 on the opposite side */
  .m18{ left:19.5% !important; top:12% !important; }
}
