/* ========================================================================
   WPU Knowledge & Research Portal — Build 24.10.30
   PHASE 2: SHARED PUBLIC SHELL
   Visual/presentation authority for public Header, Navigation, Footer,
   Breadcrumbs and Page Containers. Routes, forms, controllers, auth,
   queries, permissions and page-specific workflows remain unchanged.
   Loads after Phase 1 and legacy public styles.
   ======================================================================== */

:root{
  --wpu-public-shell-standard:1280px;
  --wpu-public-shell-wide:1440px;
  --wpu-public-shell-reading:840px;
  --wpu-public-shell-gutter:40px;
  --wpu-public-shell-header-h:76px;
  --wpu-public-shell-z-overlay:1060;
  --wpu-public-shell-z-header:1080;
  --wpu-public-shell-z-drawer:1085;
}

/* Shared container authority ------------------------------------------------ */
.wpu-unified-shell,
.wpu-page-shell,
.library-shell,
.wpu-public-container{
  box-sizing:border-box!important;
  width:100%!important;
  max-width:calc(var(--wpu-public-shell-standard) + (var(--wpu-public-shell-gutter) * 2))!important;
  margin-inline:auto!important;
  padding-inline:var(--wpu-public-shell-gutter)!important;
}
.wpu-public-container--wide{max-width:calc(var(--wpu-public-shell-wide) + (var(--wpu-public-shell-gutter) * 2))!important}
.wpu-public-container--reading{max-width:calc(var(--wpu-public-shell-reading) + (var(--wpu-public-shell-gutter) * 2))!important}
.wpu-public-container--full{max-width:none!important;padding-inline:0!important}
.wpu-public-container--full>.wpu-public-container{max-width:calc(var(--wpu-public-shell-standard) + (var(--wpu-public-shell-gutter) * 2))!important}

body.wpu-has-public-shell{min-height:100vh;display:flex;flex-direction:column;background:var(--wpu-surface-page,var(--wpu-ds-canvas,#f5f7fb))}
body.wpu-has-public-shell>main{flex:1 0 auto;min-width:0}
body.wpu-has-public-shell>.wpu-public-shell-footer{margin-top:auto!important}
html{scroll-padding-top:calc(var(--wpu-public-shell-header-h) + 24px)}
body :where(main [id],section[id],article[id],h1[id],h2[id],h3[id]){scroll-margin-top:calc(var(--wpu-public-shell-header-h) + 24px)}

/* Header ------------------------------------------------------------------- */
.wpu-public-shell-header{
  position:sticky!important;
  top:0!important;
  z-index:var(--wpu-public-shell-z-header)!important;
  isolation:isolate;
  min-height:var(--wpu-public-shell-header-h)!important;
  border:0!important;
  border-bottom:1px solid var(--wpu-divider,var(--wpu-ds-border,#d7e0ea))!important;
  background:rgba(255,255,255,.96)!important;
  box-shadow:0 1px 0 rgba(11,46,89,.025)!important;
  backdrop-filter:saturate(140%) blur(14px);
  transition:background var(--wpu-motion-standard,160ms) var(--wpu-ease,ease),box-shadow var(--wpu-motion-standard,160ms) var(--wpu-ease,ease),border-color var(--wpu-motion-standard,160ms) var(--wpu-ease,ease)!important;
}
.wpu-public-shell-header[data-wpu-shell-scrolled="1"]{
  background:rgba(255,255,255,.985)!important;
  border-bottom-color:var(--wpu-border,var(--wpu-ds-border,#d7e0ea))!important;
  box-shadow:0 6px 20px rgba(11,46,89,.07)!important;
}
.wpu-public-shell-header .wpu-unified-header-row{min-height:76px!important;gap:16px!important;position:relative}
.wpu-public-shell-header .wpu-unified-brand{flex:0 1 auto!important;gap:11px!important;margin:0!important;min-width:0;color:var(--wpu-navy,var(--wpu-ds-primary-deep,#0b2e59))!important}
.wpu-public-shell-header .wpu-unified-brand img{width:42px!important;height:42px!important;object-fit:contain!important;flex:0 0 42px}
.wpu-public-shell-header .wpu-unified-brand span{display:grid;min-width:0;line-height:1.08!important}
.wpu-public-shell-header .wpu-unified-brand strong{max-width:310px!important;color:var(--wpu-navy,var(--wpu-ds-primary-deep,#0b2e59))!important;font-size:.78rem!important;font-weight:720!important;letter-spacing:.015em!important;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.wpu-public-shell-header .wpu-unified-brand small{margin-top:4px!important;color:var(--wpu-blue,var(--wpu-ds-primary,#0b4f9c))!important;font-size:.92rem!important;font-weight:700!important;letter-spacing:-.01em!important;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}

.wpu-public-shell-header .wpu-unified-nav{position:static!important;display:flex!important;align-items:center!important;gap:2px!important;margin-left:auto!important;padding:0!important;border:0!important;border-radius:0!important;background:transparent!important;box-shadow:none!important}
.wpu-public-shell-header .wpu-unified-nav a{
  position:relative!important;
  width:auto!important;
  min-height:40px!important;
  padding:0 11px!important;
  border:1px solid transparent!important;
  border-radius:var(--wpu-radius-sm,8px)!important;
  background:transparent!important;
  color:var(--wpu-text-secondary,var(--wpu-ds-text-2,#42546a))!important;
  font-size:.81rem!important;
  font-weight:650!important;
  text-decoration:none!important;
  white-space:nowrap!important;
  transition:background var(--wpu-motion-fast,120ms) var(--wpu-ease,ease),color var(--wpu-motion-fast,120ms) var(--wpu-ease,ease),border-color var(--wpu-motion-fast,120ms) var(--wpu-ease,ease)!important;
}
.wpu-public-shell-header .wpu-unified-nav a:hover{background:var(--wpu-surface-hover,var(--wpu-ds-primary-soft,#f3f7fc))!important;color:var(--wpu-blue,var(--wpu-ds-primary,#0b4f9c))!important}
.wpu-public-shell-header .wpu-unified-nav a[aria-current="page"]{background:var(--wpu-surface-selected,var(--wpu-ds-primary-soft,#eaf3ff))!important;border-color:color-mix(in srgb,var(--wpu-blue,#0b4f9c) 15%,transparent)!important;color:var(--wpu-navy,var(--wpu-ds-primary-deep,#0b2e59))!important;font-weight:750!important}
.wpu-public-shell-header .wpu-unified-nav a[aria-current="page"]::after{content:""!important;position:absolute!important;left:12px!important;right:12px!important;bottom:3px!important;height:2px!important;border-radius:2px!important;background:var(--wpu-blue,var(--wpu-ds-primary,#0b4f9c))!important}
.wpu-public-shell-header :where(a,button):focus-visible{outline:2px solid var(--wpu-bright-blue,var(--wpu-ds-primary,#1473e6))!important;outline-offset:2px!important;box-shadow:none!important}

.wpu-public-shell-header .wpu-unified-nav-toggle{
  display:none!important;
  width:44px!important;height:44px!important;min-width:44px!important;min-height:44px!important;
  margin:0!important;padding:0!important;border:1px solid var(--wpu-border,var(--wpu-ds-border,#d7e0ea))!important;
  border-radius:var(--wpu-radius-sm,8px)!important;background:var(--wpu-surface-primary,var(--wpu-ds-surface,#fff))!important;
  align-items:center!important;justify-content:center!important;flex-direction:column!important;gap:4px!important;
  color:var(--wpu-navy,var(--wpu-ds-primary-deep,#0b2e59))!important;cursor:pointer;
}
.wpu-public-shell-header .wpu-unified-nav-toggle span{display:block;width:19px!important;height:2px!important;background:currentColor!important;transition:transform var(--wpu-motion-standard,160ms) var(--wpu-ease,ease),opacity var(--wpu-motion-fast,120ms) var(--wpu-ease,ease)!important}
.wpu-public-shell-header[data-nav-open="1"] .wpu-unified-nav-toggle span:nth-child(1){transform:translateY(6px) rotate(45deg)}
.wpu-public-shell-header[data-nav-open="1"] .wpu-unified-nav-toggle span:nth-child(2){opacity:0}
.wpu-public-shell-header[data-nav-open="1"] .wpu-unified-nav-toggle span:nth-child(3){transform:translateY(-6px) rotate(-45deg)}

.wpu-public-shell-actions{display:flex!important;align-items:center!important;gap:6px!important;flex:0 0 auto!important;margin-left:0!important;white-space:nowrap!important}
.wpu-public-shell-actions a{height:40px!important;min-height:40px!important;border-radius:var(--wpu-radius-sm,8px)!important;font-size:.77rem!important;font-weight:700!important}
.wpu-public-shell-actions .is-aira{background:var(--wpu-bright-blue-soft,var(--wpu-ds-primary-soft,#eaf3ff))!important;color:var(--wpu-navy,var(--wpu-ds-primary-deep,#0b2e59))!important;border-color:color-mix(in srgb,var(--wpu-blue,#0b4f9c) 16%,transparent)!important}
.wpu-public-shell-actions .is-profile,.wpu-public-shell-actions .is-search{background:var(--wpu-surface-primary,var(--wpu-ds-surface,#fff))!important;border-color:var(--wpu-border,var(--wpu-ds-border,#d7e0ea))!important}
.wpu-public-shell-actions a:hover{background:var(--wpu-surface-hover,var(--wpu-ds-surface-subtle,#f3f7fc))!important;color:var(--wpu-navy,var(--wpu-ds-primary-deep,#0b2e59))!important}

/* Context navigation / breadcrumbs ---------------------------------------- */
.wpu-context-subnav{position:sticky!important;top:var(--wpu-public-shell-header-h)!important;z-index:calc(var(--wpu-public-shell-z-header) - 2)!important;border-bottom:1px solid var(--wpu-divider,var(--wpu-ds-border,#e5ebf2))!important;background:rgba(248,250,252,.97)!important;box-shadow:none!important;backdrop-filter:saturate(130%) blur(10px)!important}
.wpu-context-subnav-row{min-height:48px!important;gap:20px!important}
.wpu-context-subnav-row>strong{color:var(--wpu-navy,var(--wpu-ds-primary-deep,#0b2e59))!important;font-size:.8rem!important;font-weight:750!important}
.wpu-context-subnav-links a{min-height:36px!important;padding-inline:10px!important;border-radius:var(--wpu-radius-sm,8px)!important;color:var(--wpu-text-secondary,var(--wpu-ds-text-2,#42546a))!important;font-size:.78rem!important;font-weight:650!important}
.wpu-context-subnav-links a:hover,.wpu-context-subnav-links a[aria-current="page"]{background:var(--wpu-surface-selected,var(--wpu-ds-primary-soft,#eaf3ff))!important;color:var(--wpu-navy,var(--wpu-ds-primary-deep,#0b2e59))!important}

.wpu-public-breadcrumbs,.wpu-breadcrumbs,.breadcrumbs,.breadcrumb{display:flex;align-items:center;flex-wrap:wrap;gap:6px;font-size:.82rem;color:var(--wpu-text-muted,var(--wpu-ds-text-3,#6a7a8e))}
.wpu-public-breadcrumbs a,.wpu-breadcrumbs a,.breadcrumbs a,.breadcrumb a{color:var(--wpu-text-secondary,var(--wpu-ds-text-2,#42546a));text-decoration:none}
.wpu-public-breadcrumbs a:hover,.wpu-breadcrumbs a:hover,.breadcrumbs a:hover,.breadcrumb a:hover{color:var(--wpu-blue,var(--wpu-ds-primary,#0b4f9c));text-decoration:underline}

.wpu-public-page-header,.wpu-page-header{margin-block:var(--wpu-space-6,24px) var(--wpu-space-8,32px)}
.wpu-public-page-header h1,.wpu-page-header h1{margin:0;color:var(--wpu-navy,var(--wpu-ds-primary-deep,#0b2e59));font-size:var(--wpu-font-h1,clamp(1.75rem,2.6vw,2.35rem));line-height:1.1}
.wpu-public-page-header p,.wpu-page-header p{max-width:700px;margin:var(--wpu-space-2,8px) 0 0;color:var(--wpu-text-secondary,var(--wpu-ds-text-2,#42546a));font-size:1rem;line-height:1.55}

/* Mobile overlay / drawer -------------------------------------------------- */
.wpu-public-shell-overlay{position:fixed;inset:0;z-index:var(--wpu-public-shell-z-overlay);display:block;width:100%;height:100%;margin:0;padding:0;border:0;background:rgba(7,35,66,.38);opacity:0;visibility:hidden;pointer-events:none;cursor:pointer;transition:opacity var(--wpu-motion-standard,160ms) var(--wpu-ease,ease),visibility var(--wpu-motion-standard,160ms) step-end}
body.wpu-public-nav-open{overflow:hidden!important;overscroll-behavior:none}
body.wpu-public-nav-open .wpu-public-shell-overlay{opacity:1;visibility:visible;pointer-events:auto;transition:opacity var(--wpu-motion-standard,160ms) var(--wpu-ease,ease),visibility 0s step-start}

/* Footer ------------------------------------------------------------------- */
.wpu-public-shell-footer{margin-top:0!important;border-top:1px solid rgba(255,255,255,.08)!important;background:var(--wpu-navy,#0b2e59)!important;color:#dce7f2!important}
.wpu-public-shell-footer .wpu-unified-footer-grid{grid-template-columns:minmax(280px,1.45fr) repeat(3,minmax(150px,.7fr))!important;gap:32px!important;padding-top:52px!important;padding-bottom:48px!important}
.wpu-public-shell-footer .wpu-unified-footer-mark img{width:44px!important;height:44px!important}
.wpu-public-shell-footer .wpu-unified-footer-mark strong,.wpu-public-shell-footer .wpu-unified-footer-links strong{color:#fff!important}
.wpu-public-shell-footer .wpu-unified-footer-mark small,.wpu-public-shell-footer .wpu-unified-footer-brand>p,.wpu-public-shell-footer .wpu-unified-footer-contact{color:#b9cbe0!important}
.wpu-public-shell-footer .wpu-unified-footer-brand>p{font-size:.86rem!important;line-height:1.6!important}
.wpu-public-shell-footer .wpu-unified-footer-links{gap:8px!important}
.wpu-public-shell-footer .wpu-unified-footer-links a{min-height:28px;display:inline-flex;align-items:center;color:#d4e2ef!important;font-size:.84rem!important;text-decoration:none!important;border-radius:6px}
.wpu-public-shell-footer .wpu-unified-footer-links a:hover{color:#fff!important;text-decoration:underline!important;text-underline-offset:3px}
.wpu-public-shell-footer :where(a,button):focus-visible{outline:2px solid #75b8ff!important;outline-offset:3px!important;box-shadow:none!important}
.wpu-public-shell-footer .wpu-unified-footer-bottom{border-top:1px solid rgba(255,255,255,.12)!important;background:var(--wpu-navy-strong,#072342)!important;color:#aebfd0!important}
.wpu-public-shell-footer .wpu-unified-footer-bottom>.wpu-unified-shell{min-height:56px!important}
.wpu-public-shell-footer .wpu-unified-footer-bottom a{color:#d4e2ef!important}

/* Compact desktop / tablet ------------------------------------------------- */
@media(max-width:1180px){
  :root{--wpu-public-shell-gutter:32px;--wpu-public-shell-header-h:70px}
  .wpu-public-shell-header .wpu-unified-header-row{min-height:70px!important;gap:10px!important}
  .wpu-public-shell-header .wpu-unified-brand img{width:38px!important;height:38px!important;flex-basis:38px}
  .wpu-public-shell-header .wpu-unified-brand strong{max-width:190px!important;font-size:.71rem!important}
  .wpu-public-shell-header .wpu-unified-brand small{font-size:.8rem!important}
  .wpu-public-shell-header .wpu-unified-nav{gap:0!important}
  .wpu-public-shell-header .wpu-unified-nav a{min-height:38px!important;padding-inline:8px!important;font-size:.75rem!important}
  .wpu-public-shell-actions .is-aira{display:none!important}
}
@media(max-width:1023px){
  :root{--wpu-public-shell-gutter:24px}
  .wpu-public-shell-header .wpu-unified-brand strong{display:none!important}
  .wpu-public-shell-header .wpu-unified-brand small{margin-top:0!important;max-width:150px;font-size:.75rem!important}
  .wpu-public-shell-header .wpu-unified-nav a{padding-inline:7px!important;font-size:.72rem!important}
  .wpu-public-shell-actions .is-search{display:none!important}
  .wpu-public-shell-actions .is-profile{width:40px!important;min-width:40px!important;padding:0!important}
  .wpu-public-shell-actions .is-profile .wpu-action-label{position:absolute!important;width:1px!important;height:1px!important;padding:0!important;margin:-1px!important;overflow:hidden!important;clip:rect(0,0,0,0)!important;white-space:nowrap!important;border:0!important}
}

/* Mobile: right-side drawer under a stable 64px masthead ------------------ */
@media(max-width:767px){
  :root{--wpu-public-shell-gutter:16px;--wpu-public-shell-header-h:64px}
  html{scroll-padding-top:calc(64px + 16px)}
  .wpu-public-shell-header{min-height:64px!important}
  .wpu-public-shell-header .wpu-unified-header-row{min-height:64px!important;gap:8px!important}
  .wpu-public-shell-header .wpu-unified-brand{order:1!important;max-width:min(58vw,230px)}
  .wpu-public-shell-header .wpu-unified-brand img{width:38px!important;height:38px!important;flex-basis:38px}
  .wpu-public-shell-header .wpu-unified-brand strong{display:block!important;max-width:150px!important;font-size:.68rem!important}
  .wpu-public-shell-header .wpu-unified-brand small{display:block!important;max-width:160px!important;font-size:.71rem!important}
  .wpu-public-shell-actions{order:2!important;margin-left:auto!important;gap:4px!important}
  .wpu-public-shell-actions .is-search{display:inline-flex!important;width:40px!important;min-width:40px!important;padding:0!important}
  .wpu-public-shell-actions .is-profile{width:40px!important;min-width:40px!important;padding:0!important}
  .wpu-public-shell-header .wpu-unified-nav-toggle{order:3!important;display:inline-flex!important;position:relative;z-index:4}
  .wpu-public-shell-header .wpu-unified-nav{
    position:fixed!important;top:64px!important;right:0!important;bottom:0!important;left:auto!important;
    z-index:var(--wpu-public-shell-z-drawer)!important;
    display:flex!important;flex-direction:column!important;align-items:stretch!important;gap:4px!important;
    width:min(88vw,360px)!important;max-width:360px!important;height:calc(100dvh - 64px)!important;
    margin:0!important;padding:18px 16px max(24px,env(safe-area-inset-bottom))!important;
    overflow-y:auto!important;overscroll-behavior:contain!important;
    border:0!important;border-left:1px solid var(--wpu-border,var(--wpu-ds-border,#d7e0ea))!important;border-radius:0!important;
    background:var(--wpu-surface-elevated,var(--wpu-ds-surface,#fff))!important;
    box-shadow:-18px 0 42px rgba(11,46,89,.14)!important;
    transform:translateX(102%)!important;visibility:hidden!important;pointer-events:none!important;
    transition:transform var(--wpu-motion-standard,160ms) var(--wpu-ease,ease),visibility var(--wpu-motion-standard,160ms) step-end!important;
  }
  .wpu-public-shell-header[data-nav-open="1"] .wpu-unified-nav{transform:translateX(0)!important;visibility:visible!important;pointer-events:auto!important;transition:transform var(--wpu-motion-standard,160ms) var(--wpu-ease,ease),visibility 0s step-start!important}
  .wpu-public-shell-header .wpu-unified-nav a{width:100%!important;min-height:46px!important;padding:0 14px!important;border-radius:var(--wpu-radius-sm,8px)!important;font-size:.9rem!important;font-weight:650!important}
  .wpu-public-shell-header .wpu-unified-nav a[aria-current="page"]{border-color:color-mix(in srgb,var(--wpu-blue,#0b4f9c) 18%,transparent)!important}
  .wpu-public-shell-header .wpu-unified-nav a[aria-current="page"]::after{display:none!important}
  .wpu-context-subnav{position:relative!important;top:auto!important}
  .wpu-context-subnav-row{min-height:46px!important;gap:10px!important}
  .wpu-context-subnav-row>strong{display:none!important}
  .wpu-context-subnav-links{width:100%!important}
  .wpu-public-page-header,.wpu-page-header{margin-block:20px 24px}
  .wpu-public-page-header p,.wpu-page-header p{font-size:.95rem}
  .wpu-public-shell-footer .wpu-unified-footer-grid{grid-template-columns:1fr!important;gap:26px!important;padding-top:38px!important;padding-bottom:34px!important}
  .wpu-public-shell-footer .wpu-unified-footer-bottom>.wpu-unified-shell{min-height:0!important;padding-block:16px!important;align-items:flex-start!important;flex-direction:column!important}
}
@media(max-width:479px){
  .wpu-public-shell-header .wpu-unified-brand{max-width:min(52vw,200px)}
  .wpu-public-shell-header .wpu-unified-brand strong{max-width:125px!important}
  .wpu-public-shell-header .wpu-unified-brand small{max-width:130px!important}
  .wpu-public-shell-actions .is-search{display:none!important}
}
@media(max-width:359px){
  .wpu-public-shell-header .wpu-unified-brand strong{display:none!important}
  .wpu-public-shell-header .wpu-unified-brand small{max-width:116px!important}
}

@media (prefers-reduced-motion: reduce){
  .wpu-public-shell-header,.wpu-public-shell-header *, .wpu-public-shell-overlay{scroll-behavior:auto!important;transition-duration:.001ms!important;animation-duration:.001ms!important;animation-iteration-count:1!important}
}

@media print{
  .wpu-public-shell-header .wpu-unified-nav,
  .wpu-public-shell-header .wpu-unified-nav-toggle,
  .wpu-public-shell-actions,
  .wpu-context-subnav,
  .wpu-public-shell-overlay,
  .wpu-public-shell-footer{display:none!important}
  .wpu-public-shell-header{position:static!important;min-height:0!important;border:0!important;box-shadow:none!important;background:#fff!important}
  .wpu-public-shell-header .wpu-unified-header-row{min-height:56px!important;padding-block:8px!important}
  body.wpu-has-public-shell{display:block!important;background:#fff!important}
}
