/* The reference's full-height navigation: a dark panel over a grainy backdrop. */
html { scrollbar-gutter: stable; }
.reference-transfer.menu-open .site-header { visibility:hidden; }
.reference-menu { position:fixed;inset:0;z-index:210;visibility:hidden;pointer-events:none;color:var(--paper);transition:visibility 0s .65s; }
.reference-menu.is-open { visibility:visible;pointer-events:auto;transition-delay:0s; }
.reference-menu-backdrop { position:absolute;inset:0;background:rgba(72,80,74,.48);opacity:0;transition:opacity .6s ease;backdrop-filter:grayscale(1) blur(3px); }
.reference-menu-backdrop::after { content:'';position:absolute;inset:0;opacity:.5;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.86' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Cpath fill='%23777' filter='url(%23n)' d='M0 0h160v160H0z'/%3E%3C/svg%3E"); }
.reference-menu.is-open .reference-menu-backdrop { opacity:1; }
.reference-menu-panel { position:absolute;inset:0 25% 0 0;background:var(--ink);background-image:linear-gradient(#242c28ed,#242c28ed),var(--reference-dark);background-size:400px;transform:translateX(-101%);transition:transform .65s cubic-bezier(.22,1,.36,1);overflow-y:auto;overscroll-behavior:contain; }
.reference-menu.is-open .reference-menu-panel { transform:translateX(0); }
.reference-menu-brand { position:absolute;top:25px;left:40px;z-index:2;display:block; }
.reference-menu-brand img { width:166px;filter:grayscale(1) brightness(0) invert(1); }
.reference-transfer .reference-menu .main-nav { display:flex;position:relative;inset:auto;flex-direction:column;justify-content:center;width:100%;min-height:100%;max-height:none;margin:0;padding:160px 7% 90px 16.6%;background:none;border:0;overflow:visible;pointer-events:auto;color:var(--paper); }
.reference-menu .main-nav ul { display:flex;flex-direction:column;align-items:stretch;gap:14px; }
.reference-transfer .reference-menu .main-nav ul a { display:inline-flex;min-height:0;font-family:Reference Lausanne,Arial,sans-serif;font-size:clamp(45px,6.3vw,104px);font-weight:550;line-height:1.13;letter-spacing:-.045em;text-decoration:none;color:transparent;-webkit-text-stroke:1px var(--paper);transition:color .2s ease; }
.reference-transfer .reference-menu .main-nav ul a:is(:hover,:focus-visible,.is-active) { color:var(--paper);text-decoration:none; }
.reference-menu-contact { display:flex;flex-direction:column;align-items:flex-start;gap:12px;border-top:1px solid var(--line-dark);padding-top:34px;margin-top:38px; }
.reference-transfer .reference-menu .reference-menu-contact a { font:350 15px/1.4 Reference Lausanne,Arial,sans-serif;min-height:28px;color:var(--paper); }
.reference-menu-contact a:hover { color:var(--green); }
.reference-menu-close { position:absolute;right:40px;top:25px;z-index:3;display:flex;align-items:center;gap:20px;min-height:44px;padding:4px 0;border:0;background:transparent;color:var(--paper);font:550 15px/1 Reference Lausanne,Arial,sans-serif; }
.reference-menu-close i { position:relative;width:28px;height:28px; }
.reference-menu-close i::before,.reference-menu-close i::after { content:'';position:absolute;top:13px;left:0;width:28px;height:3px;background:var(--green);transform:rotate(45deg); }
.reference-menu-close i::after { transform:rotate(-45deg); }
.reference-menu :focus-visible { outline:2px solid var(--green);outline-offset:7px; }
@media(min-width:1800px) { .reference-menu .main-nav ul { gap:18px; } }
@media(max-width:700px) {
 .reference-menu-panel { right:0; }
 .reference-menu-brand { top:23px;left:20px; }
 .reference-menu-brand img { width:125px; }
 .reference-menu-close { top:17px;right:20px;gap:12px;font-size:12px; }
 .reference-transfer .reference-menu .main-nav { padding:130px 24px 48px; }
 .reference-transfer .reference-menu .main-nav ul a { font-size:clamp(38px,9.9vw,68px); }
 .reference-menu .main-nav ul { gap:16px; }
 .reference-menu-contact { margin-top:30px;padding-top:25px; }
}
@media(max-height:700px) and (min-width:701px) {
 .reference-transfer .reference-menu .main-nav { padding-top:110px;padding-bottom:35px; }
 .reference-transfer .reference-menu .main-nav ul a { font-size:clamp(40px,7.5vh,65px); }
 .reference-menu .main-nav ul { gap:8px; }
 .reference-menu-contact { margin-top:22px;padding-top:20px;gap:5px; }
}
@media(prefers-reduced-motion:reduce) {
 .reference-menu,.reference-menu-panel,.reference-menu-backdrop,.reference-transfer .reference-menu .main-nav ul a { transition:none; }
}
