/* Progressive browser-native movement. Navigation and content remain ordinary HTML. */
@view-transition { navigation: auto; }
::view-transition-old(root) { animation: gp-page-out .16s ease-in both; }
::view-transition-new(root) { animation: gp-page-in .24s ease-out both; }
@keyframes gp-page-out { to { opacity: 0; } }
@keyframes gp-page-in { from { opacity: 0; } to { opacity: 1; } }

.cp-site .ch-thread-portal { display:grid;grid-template-columns:minmax(0,1.2fr) minmax(0,1fr);align-items:center;gap:clamp(30px,6vw,96px);padding:clamp(44px,6vw,88px) var(--cp-gutter);color:#f4f0e7;background:#080d10;border-bottom:1px solid #9edee622; }
.ch-thread-scene { position:relative;display:block;min-width:0;aspect-ratio:1.8;overflow:hidden;background:#10212b;isolation:isolate;text-decoration:none; }
.ch-thread-scene>img { width:100%;height:100%;object-fit:cover;display:block;transition:transform .7s cubic-bezier(.2,.75,.2,1); }
.ch-thread-scene::after { content:"";position:absolute;inset:0;z-index:1;background:linear-gradient(0deg,#080d10ed,transparent 45%);pointer-events:none; }
.ch-thread-orbit { position:absolute;inset:0;width:100%;height:100%;stroke:#a7e2eb70;stroke-width:1;pointer-events:none;transform:rotate(-12deg);transition:transform .8s cubic-bezier(.2,.75,.2,1); }
.ch-thread-orbit circle { fill:#d7bd80;stroke:#d7bd80; }
.ch-thread-orbit circle:first-of-type { fill:#080d10aa;stroke:#b9eaf1; }
.ch-thread-scene>span { position:absolute;left:24px;right:24px;bottom:22px;z-index:2;display:flex;justify-content:space-between;gap:16px;color:#f4f0e7;font-size:13px; }
.cp-site .ch-thread-copy h2 { margin:0;font-size:clamp(48px,6.5vw,104px);line-height:1.03;letter-spacing:-.025em;text-transform:uppercase; }
.cp-site .ch-thread-copy h2 em { color:#a5e3e9; }
.ch-thread-copy p { color:#b7c9ce;font-size:clamp(15px,1.3vw,18px);line-height:1.7;margin:22px 0; }
.ch-thread-copy>a { display:inline-flex;align-items:center;justify-content:space-between;gap:32px;min-height:48px;padding:12px 0;color:#e1c78c!important;text-decoration:none;border-bottom:1px solid #d4b77988;font-size:14px; }
.ch-thread-copy>a svg { transition:transform .2s; }
@media (hover:hover) and (prefers-reduced-motion:no-preference) {
 .ch-thread-scene:hover>img { transform:scale(1.035); }
 .ch-thread-scene:hover .ch-thread-orbit { transform:rotate(0); }
 .ch-thread-copy>a:hover svg { transform:translateX(5px); }
}
@supports (animation-timeline:view()) {
 @media (prefers-reduced-motion:no-preference) {
  .ch-thread-portal .ch-thread-copy { animation:gp-chapter-enter linear both;animation-timeline:view();animation-range:entry 0% entry 100%; }
  @keyframes gp-chapter-enter { from { opacity:.7;transform:translateY(18px); } to { opacity:1;transform:translateY(0); } }
 }
}
/* Offscreen editorial chapters can defer layout without hiding text from search. */
@supports (content-visibility:auto) {
 .ch-story,.ch-walk { content-visibility:auto;contain-intrinsic-size:auto 700px; }
}
@media(max-width:700px) {
 .cp-site .ch-thread-portal { grid-template-columns:1fr;gap:28px;padding:36px 22px 44px; }
 .ch-thread-scene { aspect-ratio:1.6; }
 .cp-site .ch-thread-copy h2 { font-size:clamp(46px,12vw,76px); }
 .ch-thread-copy h2 br { display:none; }
 .ch-thread-copy h2 em::before { content:" "; }
 .ch-thread-copy p { margin:18px 0; }
}
@media(prefers-reduced-motion:reduce) {
 @view-transition { navigation:none; }
 ::view-transition-group(*),::view-transition-old(*),::view-transition-new(*) { animation:none!important; }
 .ch-thread-scene>img,.ch-thread-orbit,.ch-thread-copy>a svg { transition:none; }
}
