/* Navigation study only: original page layouts, footage and colour remain untouched. */
html { scrollbar-gutter: stable; }
.cn-header,.cn-menu,.cn-fallback { --sans:var(--body); }
.cn-header {
  --cn-ink:#f1eee6; --cn-muted:#abb7c4; --cn-edge:#c3d6e22e;
  position:fixed; inset:16px 28px auto; width:auto; height:72px; z-index:80;
  display:flex; align-items:center; gap:24px; padding:0 20px;
  color:var(--cn-ink); background:linear-gradient(135deg,#333c466e,#111820de 55%,#212b35b8);
  border:1px solid var(--cn-edge); border-radius:21px;
  box-shadow:inset 0 1px 0 #ffffff20,inset 0 -1px 0 #0000003d,0 12px 40px #0000002e;
  -webkit-backdrop-filter:blur(16px); backdrop-filter:blur(16px);
  transition:transform .3s ease,border-color .2s ease;
  view-transition-name:cn-navigation;
}
.cn-header::before { content:''; position:absolute; top:-1px; left:30px; width:32%; height:1px; background:linear-gradient(90deg,transparent,#e3e9ef75,transparent); pointer-events:none; }
.cn-header.cn-hidden:not(:focus-within) { transform:translateY(calc(-100% - 26px)); }
.cn-brand { display:flex; align-items:center; gap:12px; flex-shrink:0; color:inherit; text-decoration:none; }
.cn-brand>span { font:500 19px/1 var(--display); letter-spacing:1.35px; white-space:nowrap; }
.cn-brand .brand-mark { width:23px; height:23px; color:#d5dedf; }
.cn-current { display:flex; gap:16px; align-items:center; margin:auto; font-size:13px; }
.cn-current-index { font:10px/1.4 var(--sans); letter-spacing:1.5px; color:#a0b0bd; }
.cn-actions { display:flex; gap:9px; align-items:center; flex-shrink:0; }
.cn-header .cn-button,.cn-menu .cn-button {
  min-height:42px; display:inline-flex; align-items:center; justify-content:center; gap:12px;
  padding:0 16px; border-radius:12px; border:1px solid #d0dde323;
  color:#e4e9ed; background:linear-gradient(145deg,#333d47,#1c252e);
  box-shadow:inset 0 1px 0 #ffffff12,3px 3px 7px #040b125c,-2px -2px 6px #a6bcd009;
  font:11px/1.3 var(--sans); cursor:pointer; white-space:nowrap;
  transition:background .16s ease,box-shadow .16s ease,transform .16s ease;
}
.cn-header .cn-button:hover,.cn-menu .cn-button:hover { background:linear-gradient(145deg,#3b4652,#25313e); }
.cn-header .cn-button:active,.cn-menu .cn-button:active,.cn-header .cn-button[aria-pressed=true] {
  transform:translateY(1px); box-shadow:inset 3px 3px 7px #030a115c,inset -2px -2px 6px #aec3d510;
}
.cn-header .cn-menu-button { padding:0 18px; background:linear-gradient(145deg,#e7e9e1,#bdc9cc); color:#15212a; border-color:#ffffff45; box-shadow:inset 0 1px 0 #fff8,3px 3px 9px #0005; }
.cn-header .cn-menu-button:hover { background:linear-gradient(145deg,#f2f2e9,#d0d9dc); }
.cn-menu-icon { display:grid; gap:4px; width:16px; }
.cn-menu-icon i { height:1px; width:16px; background:currentColor; }
.cn-menu-icon i:last-child { width:11px; justify-self:end; }
.cn-links { display:none; }
.cn-header a:focus-visible,.cn-header button:focus-visible,.cn-menu a:focus-visible,.cn-menu button:focus-visible,.cn-fallback a:focus-visible { outline:2px solid #e6d4b8; outline-offset:5px; }
.cn-menu {
  position:fixed; inset:102px 28px auto; margin:0; width:calc(100% - 56px); height:auto;
  max-width:none; max-height:calc(100dvh - 126px); padding:25px 32px 20px;
  border:1px solid #dce9ed2c; border-radius:24px; color:#f0eee8;
  background:linear-gradient(135deg,#242e38fa,#111921fc 60%,#1c242dfc);
  box-shadow:inset 0 1px 0 #e6f2ff18,0 30px 100px #0008;
  overflow:auto; overscroll-behavior:contain; z-index:100;
}
.cn-menu::backdrop { background:#04080dbd; }
.cn-menu[open] { animation:cn-menu-in .33s cubic-bezier(.2,.75,.25,1) both; }
.cn-menu-top { display:flex; justify-content:space-between; gap:20px; align-items:center; padding-bottom:20px; border-bottom:1px solid #b7cbd322; }
.cn-kicker { font:10px/1.5 var(--sans); letter-spacing:2px; color:#adc1cc; }
.cn-menu-top p { font:400 24px/1.3 var(--serif); margin:5px 0 0; }
.cn-menu-grid { display:grid; grid-template-columns:1.05fr 1fr; align-items:center; gap:6vw; padding:22px 0; }
.cn-chapters { display:grid; gap:0; }
.cn-menu .cn-chapter { position:relative; display:grid; grid-template-columns:24px 1fr 25px; align-items:center; gap:16px; border-top:1px solid #b7cbd31b; padding:12px 12px; color:#b7c1cb; text-decoration:none; border-radius:4px; transition:color .18s ease,background .18s ease; }
.cn-menu .cn-chapter:last-child { border-bottom:1px solid #b7cbd31b; }
.cn-menu .cn-chapter>span:nth-child(2) { font:400 clamp(27px,2.8vw,46px)/1.1 var(--serif); letter-spacing:-.9px; }
.cn-number { font:10px/1 var(--sans); color:#8095a5; letter-spacing:1px; }
.cn-row-arrow { font:22px/1 var(--sans); opacity:0; transform:translateX(-5px); transition:opacity .18s,transform .18s; }
.cn-menu .cn-chapter:is(:hover,:focus-visible,[aria-current=page],.cn-previewing) { color:#faf5e7; background:linear-gradient(90deg,#cad4df0d,transparent); }
.cn-menu .cn-chapter[aria-current=page] .cn-number { color:#e8cfaa; }
.cn-menu .cn-chapter:is(:hover,:focus-visible,.cn-previewing) .cn-row-arrow { opacity:1; transform:none; }
.cn-preview { margin:0; min-width:0; }
.cn-preview-photo { background:#080e14; border:1px solid #dbe8ed24; border-radius:9px; padding:7px; box-shadow:inset 3px 3px 9px #0006,inset -1px -1px 3px #c7d5df0a; }
.cn-preview-photo img { width:100%; height:clamp(180px,23vh,270px); object-fit:contain; display:block; transition:opacity .16s ease; }
.cn-preview-photo.cn-image-loading img { opacity:.5; }
.cn-preview-line { display:flex; justify-content:space-between; gap:10px; font:10px/1.5 var(--sans); letter-spacing:1.7px; color:#8da5b8; margin-top:13px; }
.cn-preview h2 { font:400 clamp(22px,2.1vw,34px)/1.2 var(--serif); letter-spacing:-.5px; margin:9px 0 12px; min-height:2.4em; }
.cn-preview figcaption { font:13px/1.65 var(--sans); color:#b1bfca; min-height:3.3em; }
.cn-preview figcaption a { color:#d1dde5; text-decoration:underline; text-underline-offset:3px; white-space:nowrap; }
.cn-contact { display:grid; grid-template-columns:repeat(3,1fr); gap:9px; margin-top:15px; }
.cn-contact button { position:relative; padding:3px; border:1px solid #a8bcc52a; border-radius:5px; background:#080e14; cursor:pointer; box-shadow:inset 2px 2px 5px #0005; }
.cn-contact button[aria-pressed=true] { border-color:#cfbea1; }
.cn-contact img { display:block; width:100%; height:50px; object-fit:cover; opacity:.7; }
.cn-contact button[aria-pressed=true] img,.cn-contact button:hover img { opacity:1; }
.cn-contact span { position:absolute; right:5px; bottom:3px; font:10px/1.4 var(--sans); color:white; background:#080e14b0; padding:1px 4px; }
.cn-menu-bottom { display:flex; align-items:center; justify-content:space-between; gap:20px; border-top:1px solid #b7cbd322; padding-top:15px; color:#abb8c4; font:10px/1.5 var(--sans); }
.cn-menu-open { overflow:hidden; }
.cn-fallback { padding:100px 28px 12px; display:flex; gap:16px; flex-wrap:wrap; font:13px/1.5 var(--sans); background:#151e27; color:#eee; }
html:not(.cn-js) .cn-menu-button { display:none; }
html:not(.cn-js) .cn-header [data-sound-toggle],html:not(.cn-js) .cn-header [data-motion-toggle],html:not(.cn-js) .cn-links { display:none; }
.cn-header .cn-button[hidden] { display:none; }
html[data-cn-variant=b] .cn-current { display:none; }
html[data-cn-variant=b] .cn-links { display:flex; align-items:center; justify-content:center; flex:1; gap:2px; white-space:nowrap; }
.cn-links a { position:relative; z-index:1; font:12px/1.4 var(--sans); padding:12px 10px; color:#bcc7cf; text-decoration:none; border-radius:10px; transition:color .18s; }
.cn-links a[aria-current=page] { color:#f4ede0; background:#0a131b6b; box-shadow:inset 2px 2px 5px #03070c8f,inset -1px -1px 3px #d3e7fc13; }
.cn-links a:is(:hover,:focus-visible) { color:#fff8e7; background:#d7e5f00b; }
html[data-cn-variant=b] .cn-header { gap:14px; }
html[data-cn-variant=b] .cn-menu-button { display:none; }
.cn-hover-preview { position:absolute; top:calc(100% + 13px); left:50%; width:280px; padding:7px; border-radius:12px; background:#15202df5; border:1px solid #d8e8f62b; box-shadow:0 16px 40px #0007; visibility:hidden; opacity:0; transform:translate(-50%,6px); pointer-events:none; transition:opacity .16s,transform .16s,visibility .16s; }
.cn-hover-preview.cn-hover-visible { opacity:1; visibility:visible; transform:translate(-50%,0); }
.cn-hover-preview img { display:block; width:100%; height:145px; object-fit:contain; background:#070e15; border-radius:6px; }
.cn-hover-preview p { font:11px/1.5 var(--sans); margin:8px 6px 4px; color:#e9e9e3; }
.cn-hover-preview small { display:block; margin:0 6px 4px; font:12px/1.5 var(--sans); color:#b4c1cf; }
body.embed-view .cn-header { display:none; }
@keyframes cn-menu-in { from { opacity:0; transform:translateY(-12px) scale(.99); } to { opacity:1; transform:none; } }
@view-transition { navigation:auto; }
::view-transition-group(root),::view-transition-group(cn-navigation) { animation-duration:520ms; }
::view-transition-old(root) { animation:cn-page-out-left 520ms cubic-bezier(.22,.75,.25,1) both; }
::view-transition-new(root) { animation:cn-page-in-right 520ms cubic-bezier(.22,.75,.25,1) both; }
::view-transition-old(root),::view-transition-new(root) { mix-blend-mode:normal; }
::view-transition-image-pair(root) { isolation:isolate; }
::view-transition-old(cn-navigation),::view-transition-new(cn-navigation) { animation:none; }
::view-transition-old(cn-navigation) { opacity:0; }
html[data-cn-direction=back]::view-transition-old(root) { animation-name:cn-page-out-right; }
html[data-cn-direction=back]::view-transition-new(root) { animation-name:cn-page-in-left; }
html[data-cn-direction=same]::view-transition-old(root),html[data-cn-direction=same]::view-transition-new(root) { animation:none; }
@keyframes cn-page-out-left { to { transform:translateX(-100%); } }
@keyframes cn-page-in-right { from { transform:translateX(100%); } }
@keyframes cn-page-out-right { to { transform:translateX(100%); } }
@keyframes cn-page-in-left { from { transform:translateX(-100%); } }
/* A modest entry is the fallback when the browser skips cross-document transitions. */
.cn-arrival main { animation:cn-arrival-right .3s ease-out both; }
html[data-cn-direction=back].cn-arrival main { animation-name:cn-arrival-left; }
@keyframes cn-arrival-right { from { opacity:.8; transform:translateX(24px); } }
@keyframes cn-arrival-left { from { opacity:.8; transform:translateX(-24px); } }
@media(min-width:1700px) { .cn-header { inset-inline:48px; } .cn-menu { inset-inline:48px; width:calc(100% - 96px); padding:30px 44px 22px; } .cn-menu-grid { gap:8vw; } .cn-menu .cn-chapter { padding-block:16px; } .cn-preview-photo img { height:30vh; max-height:345px; } .cn-contact img { height:70px; } }
@media(max-width:1200px) {
  html[data-cn-variant=b] .cn-links { display:none; }
  html[data-cn-variant=b] .cn-current { display:flex; }
  html[data-cn-variant=b] .cn-menu-button { display:inline-flex; }
}
@media(max-width:760px) {
  .cn-header { inset:12px 12px auto; height:64px; gap:10px; padding:0 12px; border-radius:18px; }
  .cn-brand { gap:9px; } .cn-brand>span { font-size:16px; letter-spacing:.8px; }
  .cn-brand .brand-mark { width:19px; height:19px; } .cn-brand .brand-mark:after { width:9px; height:9px; }
  .cn-current,html[data-cn-variant=b] .cn-current { display:none; }
  .cn-actions { margin-left:auto; gap:7px; }
  .cn-header .cn-button { min-height:40px; padding:0 10px; font-size:10px; gap:8px; border-radius:11px; }
  .cn-menu { inset:87px 12px auto; width:calc(100% - 24px); max-height:calc(100dvh - 100px); padding:17px; border-radius:19px; }
  .cn-menu-top { padding-bottom:14px; } .cn-menu-top p { font-size:21px; } .cn-kicker { font-size:8px; letter-spacing:1.25px; }
  .cn-menu-top { position:sticky; top:-17px; z-index:2; background:#202a34; padding-top:12px; }
  .cn-menu-grid { grid-template-columns:1fr; gap:22px; padding:16px 0; }
  .cn-menu .cn-chapter { grid-template-columns:20px 1fr 20px; padding:10px 5px; gap:10px; min-height:48px; }
  .cn-menu .cn-chapter>span:nth-child(2) { font-size:28px; }
  .cn-preview-photo img { height:175px; } .cn-preview h2 { font-size:24px; min-height:0; }
  .cn-preview figcaption { font-size:13px; min-height:0; } .cn-contact { margin-top:13px; } .cn-contact img { height:50px; }
  .cn-menu-bottom { gap:10px; } .cn-menu-bottom>span { max-width:145px; font-size:9px; }
}
@media(max-width:360px) { .cn-brand>span { font-size:13px; letter-spacing:.5px; } .cn-header { padding-inline:9px; gap:7px; } .cn-header .cn-button { padding:0 8px; font-size:9px; } }
@media(prefers-reduced-motion:reduce) { .cn-header,.cn-menu,.cn-chapter,.cn-button,.cn-preview-photo img,.cn-row-arrow,.cn-hover-preview { transition:none!important; animation:none!important; } ::view-transition-group(*),::view-transition-old(*),::view-transition-new(*) { animation:none!important; } .cn-arrival main { animation:none; } }
body.reduced .cn-menu,body.reduced .cn-header,body.reduced .cn-chapter,body.reduced .cn-button,body.reduced .cn-preview-photo img,body.reduced .cn-row-arrow,body.reduced .cn-hover-preview { animation:none!important; transition:none!important; }
html:has(body.reduced)::view-transition-group(*),html:has(body.reduced)::view-transition-old(*),html:has(body.reduced)::view-transition-new(*) { animation:none!important; }
html:has(body.reduced).cn-arrival main { animation:none; }
