/* Dignitas Occidentis Center — shared site menu (v27) */
/* ============ Side navigation (drawer) ============ */
/* Opening/closing speed of the menu: raise --menu-dur for a slower movement.
   If you change it, also update MENU_DUR in site-menu.js */
:root{
--menu-dur:.9s;
--menu-ease:cubic-bezier(.25,.8,.25,1);
}
/* Menu button: thick navy lines */
.menu-btn{
margin-left:auto;
flex:0 0 auto;
width:50px;height:50px;
border:0;
border-radius:12px;
background:transparent;
cursor:pointer;
display:inline-flex;
flex-direction:column;
align-items:center;
justify-content:center;
gap:6px;
transition:background .25s ease;
}
.menu-btn:hover{background:rgba(11,18,32,.06)}
.menu-btn span{
display:block;
width:28px;height:3px;
background:var(--navy);
border-radius:2px;
}

/* Dimmed page behind the drawer */
.nav-scrim{
position:fixed;
inset:0;
background:rgba(11,18,32,.55);
opacity:0;
visibility:hidden;
transition:opacity var(--menu-dur) ease, visibility 0s linear var(--menu-dur);
z-index:90;
}
body.nav-open{overflow:hidden}
body.nav-open .nav-scrim{opacity:1;visibility:visible;transition:opacity var(--menu-dur) ease, visibility 0s}

/* Drawer panel */
.drawer{
position:fixed;
top:0;right:0;bottom:0;
width:min(440px, 86vw);
background:#fff;
color:#fff;
z-index:100;
display:flex;
flex-direction:column;
transform:translateX(100%);
visibility:hidden;
/* Slide only, no fade (v27) */
transition:transform var(--menu-dur) var(--menu-ease),
           visibility 0s linear var(--menu-dur);
box-shadow:-18px 0 48px rgba(0,0,0,.35);
padding-top:env(safe-area-inset-top);
padding-bottom:env(safe-area-inset-bottom);
}
body.nav-open .drawer{
transform:none;
visibility:visible;
transition:transform var(--menu-dur) var(--menu-ease),
           visibility 0s;
}

.drawer-head{
position:relative;
display:flex;
align-items:center;
justify-content:center;
padding:22px 64px 20px;
background:#fff;
border-bottom:1px solid rgba(168,135,58,.45);
}
.drawer-head img{height:67px;width:auto;display:block;margin-left:18px}
.drawer-close{
position:absolute;
top:50%;
right:16px;
margin-top:-22px;
width:44px;height:44px;
padding:0;
border:0;
border-radius:10px;
background:transparent;
color:#0b1220;
cursor:pointer;
display:inline-flex;
align-items:center;
justify-content:center;
opacity:.85;
transition:opacity .25s ease, transform .3s ease;
}
.drawer-close:hover{opacity:1;transform:rotate(90deg)}
.drawer-close svg{flex:none;width:32px;height:32px;fill:none;stroke:currentColor;stroke-width:2.4;stroke-linecap:round}

/* Two sliding views: main menu and Programs submenu */
.drawer-views{position:relative;flex:1;overflow:hidden}
.drawer-view{
position:absolute;
inset:0;
overflow-y:auto;
padding:0 0 24px;
transition:transform .4s cubic-bezier(.22,.61,.36,1), opacity .35s ease, visibility .4s ease;
}
.view-sub{transform:translateX(100%);opacity:0;visibility:hidden}
.drawer.sub-open .view-main{transform:translateX(-30%);opacity:0;visibility:hidden}
.drawer.sub-open .view-sub{transform:none;opacity:1;visibility:visible}

.nav-list{list-style:none;margin:0;padding:4px 28px;background:linear-gradient(180deg, #0b1220 0%, #111a2e 100%)}
.nav-item{
display:flex;
align-items:center;
gap:18px;
width:100%;
padding:18px 2px;
border:0;
border-bottom:1px solid rgba(255,255,255,.12);
background:none;
color:#fff;
font:inherit;
text-align:left;
cursor:pointer;
}
.nav-list li:last-child .nav-item{border-bottom:0}
.nav-item .ic{
width:26px;height:26px;
flex:0 0 26px;
color:#e3c374;
}
.nav-item .ic svg,
.nav-item .arr svg,
.sub-back svg{
width:100%;height:100%;
display:block;
fill:none;
stroke:currentColor;
stroke-width:1.3;
stroke-linecap:round;
stroke-linejoin:round;
}
.nav-item .ic svg{stroke-width:1.75}
.nav-item .arr svg{stroke-width:2.6}
.nav-item .lbl{flex:1;min-width:0}
.nav-item .t{
display:block;
font-size:15.5px;
font-weight:600;
letter-spacing:.14em;
text-transform:uppercase;
transition:color .25s ease;
}
.nav-item .d{
display:block;
margin-top:6px;
font-size:13.5px;
line-height:1.45;
font-weight:400;
letter-spacing:.01em;
color:rgba(255,255,255,.6);
}
.nav-item .arr{
width:18px;height:18px;
flex:0 0 18px;
color:#fff;
opacity:.7;
transition:transform .25s ease, opacity .25s ease;
}
.nav-item:hover .arr,
.nav-item:focus-visible .arr{transform:translateX(4px);opacity:1}
.nav-item:hover .t,
.nav-item:focus-visible .t{color:#ead9a8}

.sub-back{
display:inline-flex;
align-items:center;
gap:10px;
margin:12px 28px 14px;
padding:8px 2px;
border:0;
background:none;
color:#a8873a;
font:inherit;
font-size:15px;
font-weight:900;
letter-spacing:.16em;
text-transform:uppercase;
cursor:pointer;
transition:color .25s ease;
}
.sub-back:hover{color:#0b1220}
.sub-back svg{width:20px;height:20px;stroke-width:2.8}
.sub-title{
margin:10px 28px 14px;
text-align:center;
font-size:17px;
font-weight:600;
letter-spacing:.14em;
text-transform:uppercase;
color:#0b1220;
}
.view-sub .nav-item .t{font-size:14.5px;letter-spacing:.11em}

/* Social icons at the bottom */
.drawer-foot{
padding:20px 28px 26px;
background:linear-gradient(180deg, #0b1220 0%, #111a2e 100%);
}
.drawer-social{display:flex;gap:12px;flex-wrap:wrap;justify-content:center;transform:translateX(3px)}
.drawer-social a,
.drawer-social span{
width:38px;height:38px;
border:2px solid #e3c374;
border-radius:50%;
display:inline-flex;
align-items:center;
justify-content:center;
color:#e3c374;
transition:background .25s ease, color .25s ease, border-color .25s ease;
}
.drawer-social a:hover{background:#e3c374;border-color:#e3c374;color:#0b1220}
.drawer-social svg{width:16.4px;height:16.4px;display:block}
.drawer-social .fill{fill:currentColor;stroke:currentColor;stroke-width:1.05;stroke-linejoin:round}
.drawer-social .stroke{fill:none;stroke:currentColor;stroke-width:2.6;stroke-linecap:round;stroke-linejoin:round}

/* Icon shown without a link until its URL is set */
.drawer-social span.pending{opacity:.55;cursor:default}
.drawer :focus-visible,
.menu-btn:focus-visible{outline:2px solid var(--gold);outline-offset:3px}

/* Anchor targets are not hidden under the sticky header */
section[id]{scroll-margin-top:110px}

@media (prefers-reduced-motion: reduce){
.nav-scrim,.drawer,body.nav-open .nav-scrim,body.nav-open .drawer,.drawer-view,.nav-item .arr,.drawer-close{transition:none}
}

/* Current page in the menu */
.nav-item.current .t{color:var(--gold)}
.nav-item.current .arr{opacity:1}

/* Language selector in the menu header */
.menu-lang{
position:absolute;
left:20px;
top:50%;
transform:translateY(-50%) scale(.95);
transform-origin:left center;
display:inline-flex;
gap:4px;
padding:3px;
border:1px solid rgba(11,18,32,.18);
border-radius:999px;
background:#fff;
}
.menu-lang button{
min-width:38px;
padding:7px 10px;
border:0;
border-radius:999px;
background:transparent;
font:inherit;
font-size:12px;
font-weight:800;
letter-spacing:.06em;
color:#0b1220;
cursor:pointer;
}
.menu-lang button.active{background:#0b1220;color:#fff}

/* Image icons (pre-coloured PNG files) */
.nav-item .ic img{display:block;width:100%;height:100%;object-fit:contain}
/* Slightly larger program icons */
.ic-fellows img,.ic-osa img{transform:scale(1.3)}
.ic-colloquia img,.ic-watch img{transform:scale(1.42)}
.ic-summit img{transform:scale(1.2)}
.ic-media img{transform:scale(1.1)}
/* Main menu icons, closer in size to the Programs icons (v26) */
.view-main .nav-item .ic svg{transform:scale(1.35)}
.view-main .nav-item .ic-governance svg{transform:scale(1.42)}
