/* ==========================================================================
   BEA360 – UberMenu v2 (matcher mockuppet "BEA360 Header")
   Indsæt i: UberMenu > General Settings > Custom Styles (erstatter v1-CSS),
   eller i Cornerstone > Global CSS. Hent selv farverne fra BEA CI.
   Layout (kolonner, bredde) styres i UberMenu-punkterne, se opsætningsguiden.
   Klasser: bea-head  bea-all  bea-feature  bea-btn  bea-pill  bea-strip  bea-r
            bea-w-700 / bea-w-760 / bea-w-780 (panelbredde på N0-punktet)
   ========================================================================== */
.ubermenu-main,.ubermenu-main .ubermenu-target{font-family:'IBM Plex Sans',system-ui,sans-serif}

/* ---------- Topbar ---------- */
.ubermenu-main .ubermenu-item-level-0>.ubermenu-target{font-size:15px;font-weight:500;border-bottom:3px solid transparent}
.ubermenu-main .ubermenu-item-level-0:hover>.ubermenu-target,
.ubermenu-main .ubermenu-item-level-0.ubermenu-active>.ubermenu-target,
.ubermenu-main .ubermenu-item-level-0.ubermenu-current-menu-ancestor>.ubermenu-target{border-bottom-color:#3B82F6;background:#F3F6FB;color:#1F274D}
.ubermenu-main .ubermenu-item-level-0>.ubermenu-target .ubermenu-sub-indicator{opacity:1}

/* ---------- Panel ---------- */
.ubermenu-main .ubermenu-submenu.ubermenu-submenu-type-mega{
  background:#fff;border:1px solid #D5DAE3;border-top:3px solid #3B82F6;border-radius:0;
  box-shadow:0 24px 48px rgba(20,26,56,.18);padding:0}
.ubermenu-main .ubermenu-submenu.ubermenu-submenu-type-mega.ubermenu-submenu-align-full_width{border-left:0;border-right:0}
/* afgrænsede paneler: sæt klassen på N0-punktet */
.ubermenu-main .bea-w-700>.ubermenu-submenu{width:700px!important;min-width:0!important}
.ubermenu-main .bea-w-760>.ubermenu-submenu{width:760px!important;min-width:0!important}
.ubermenu-main .bea-w-780>.ubermenu-submenu{width:780px!important;min-width:0!important}

/* kolonner (N1) */
.ubermenu-main .ubermenu-submenu-type-mega>.ubermenu-item-level-1{padding:28px 20px 20px}
.ubermenu-main .ubermenu-submenu-type-mega>.ubermenu-item-level-1>.ubermenu-submenu{padding:0;border:0;box-shadow:none;background:transparent}

/* kolonneoverskrift: sæt klassen bea-head (eller "Display as Header") */
.ubermenu-main .bea-head>.ubermenu-target,
.ubermenu-main .ubermenu-item-header>.ubermenu-target{
  display:flex;justify-content:space-between;gap:8px;
  font:500 12px/1.2 'IBM Plex Mono',monospace;letter-spacing:.14em;text-transform:uppercase;
  color:#1D4ED8;background:transparent;padding:0 0 12px;margin-bottom:8px;border-bottom:1px solid #D5DAE3}
.ubermenu-main .bea-head>a.ubermenu-target:after{content:"\2192";letter-spacing:0}
.ubermenu-main .bea-head>a.ubermenu-target:hover{color:#1F274D}
.ubermenu-main .bea-head>.ubermenu-target .ubermenu-target-text{white-space:normal}

/* links (N2) */
.ubermenu-main .ubermenu-submenu .ubermenu-item-normal>.ubermenu-target{
  padding:8px 0;font-size:15px;line-height:20px;font-weight:600;color:#1F274D;background:transparent}
.ubermenu-main .ubermenu-submenu .ubermenu-item-normal>.ubermenu-target:hover{color:#1D4ED8;background:transparent}
.ubermenu-main .ubermenu-target-description{display:block;font-weight:400;font-size:13px;line-height:18px;color:#4B5563;margin-top:2px}
.ubermenu-main .ubermenu-submenu .ubermenu-item-normal>.ubermenu-target .ubermenu-sub-indicator{display:none}

/* "Alle … sider →" */
.ubermenu-main .bea-all>.ubermenu-target{color:#1D4ED8!important;margin-top:6px}

/* ---------- Fremhævet panel (feature) ---------- */
.ubermenu-main .ubermenu-submenu-type-mega>li.ubermenu-item-level-1.bea-feature{
  background:#F3F6FB;padding:28px;margin:28px 20px 20px;align-self:start;
  clip-path:polygon(32px 0,100% 0,100% 100%,0 100%,0 32px)}
.ubermenu-main .bea-feature>.ubermenu-target{padding:0;background:transparent;border:0}
.ubermenu-main .bea-feature>.ubermenu-target .ubermenu-target-title{
  font-family:'Sora',sans-serif;font-weight:800;font-size:19px;line-height:1.25;color:#1F274D;text-transform:none;letter-spacing:0}
.ubermenu-main .bea-feature>.ubermenu-target:after{content:none!important}
.ubermenu-main .bea-feature .ubermenu-target-description{font-size:14px;line-height:22px;margin:8px 0 12px}
/* knap i feature: klassen bea-btn på N2-punktet */
.ubermenu-main .bea-btn>.ubermenu-target{
  display:inline-block;background:#1D4ED8;color:#fff!important;border-radius:4px;padding:12px 22px!important;margin:4px 0 8px;font-size:15px}
.ubermenu-main .bea-btn>.ubermenu-target:hover{background:#1F274D;color:#fff!important}
/* pladsholder-pille: klassen bea-pill */
.ubermenu-main .bea-pill>.ubermenu-target{
  display:inline-block;font:400 11px 'IBM Plex Mono',monospace!important;border:1px dashed #7A859B;border-radius:4px;padding:1px 6px!important;color:#4B5563!important}

/* ---------- Strip i bunden af panelet ---------- */
.ubermenu-main .ubermenu-submenu-type-mega>li.ubermenu-item-level-1.bea-strip{
  width:100%!important;padding:0 28px;background:#F3F6FB;border-top:1px solid #D5DAE3}
.ubermenu-main .bea-strip>.ubermenu-target{display:none}
.ubermenu-main .bea-strip>.ubermenu-submenu{
  display:flex!important;align-items:center;gap:28px;flex-wrap:wrap;min-height:56px;
  position:static!important;visibility:visible!important;opacity:1!important;width:auto!important}
.ubermenu-main .bea-strip .ubermenu-item{width:auto!important;float:none;padding:0}
.ubermenu-main .bea-strip .ubermenu-item>.ubermenu-target{padding:0;font-size:14px;font-weight:600}
.ubermenu-main .bea-strip .bea-r{margin-left:auto}
.ubermenu-main .bea-strip .bea-r>.ubermenu-target{font-weight:400;color:#4B5563}
/* etiket i strip (klassen bea-head på et punkt uden link) */
.ubermenu-main .bea-strip .bea-head>.ubermenu-target{border:0;padding:0;margin:0}

/* ---------- Mobil ---------- */
@media (max-width:959px){
  .ubermenu-main .ubermenu-item-level-0>.ubermenu-target{font-size:17px;font-weight:600;border-bottom:1px solid #D5DAE3}
  .ubermenu-main .ubermenu-submenu.ubermenu-submenu-type-mega{background:#F3F6FB;border:0;box-shadow:none;clip-path:none}
  .ubermenu-main .ubermenu-submenu-type-mega>.ubermenu-item-level-1{padding:10px 20px 6px;width:100%!important}
  .ubermenu-main .ubermenu-submenu .ubermenu-item-normal>.ubermenu-target{font-size:15px;font-weight:500;padding:9px 0 9px 14px;border-left:2px solid #3B82F6;margin-bottom:2px}
  .ubermenu-main .bea-feature,.ubermenu-main .bea-strip{display:none!important}
}
@media (prefers-reduced-motion:reduce){.ubermenu *{transition:none!important}}

/* ==========================================================================
   Header-tillæg: fuld bredde (kræver Bound Submenu To = Unbounded; baren er
   .x-masthead .x-bar, ingen ekstra klasse nødvendig)
   ========================================================================== */
.x-masthead .x-bar{position:relative}
.x-masthead .x-bar-content,.x-masthead .x-bar-content .x-container{position:static}
/* fuld bredde panel: indhold centreres i 1280 px */
.ubermenu-main .ubermenu-submenu-type-mega.ubermenu-submenu-align-full_width{
  padding-left:max(32px,calc(50% - 640px));padding-right:max(32px,calc(50% - 640px))}
/* strip skal også række ud til kanterne */
.ubermenu-main .ubermenu-submenu-align-full_width>li.bea-strip{
  margin-left:calc(-1 * max(32px,calc(50vw - 640px)));margin-right:calc(-1 * max(32px,calc(50vw - 640px)));
  padding-left:max(32px,calc(50vw - 640px));padding-right:max(32px,calc(50vw - 640px));width:auto!important}

/* ==========================================================================
   Kolonnebredder via klasser på N1-punktet (alternativ til UberMenus
   kolonneindstilling): bea-c5 = 1/5, bea-c4 = 1/4, bea-c3 = 1/3, bea-c1 = hel række
   ========================================================================== */
.ubermenu-main .ubermenu-submenu-type-mega>li.bea-c5{width:20%!important;box-sizing:border-box;float:left}
.ubermenu-main .ubermenu-submenu-type-mega>li.bea-c4{width:25%!important;box-sizing:border-box;float:left}
.ubermenu-main .ubermenu-submenu-type-mega>li.bea-c3{width:33.3333%!important;box-sizing:border-box;float:left}
.ubermenu-main .ubermenu-submenu-type-mega>li.bea-c1{width:100%!important;box-sizing:border-box;float:left;clear:both}
.ubermenu-main .ubermenu-submenu-type-mega:after{content:"";display:block;clear:both}
@media (max-width:959px){.ubermenu-main .ubermenu-submenu-type-mega>li[class*="bea-c"]{width:100%!important;float:none}}

/* v2.3 – feature i samme række som kolonnerne, strip til kanterne */
.ubermenu-main .ubermenu-submenu-type-mega>li.bea-feature.bea-c4{width:calc(25% - 40px)!important}
.ubermenu-main .ubermenu-submenu-type-mega>li.bea-feature.bea-c3{width:calc(33.3333% - 40px)!important}
.ubermenu-main .bea-full>.ubermenu-submenu>li.bea-strip{
  width:calc(100% + 2 * max(12px,calc(50vw - 660px)))!important;
  margin-left:calc(-1 * max(12px,calc(50vw - 660px)))!important;margin-right:0!important;
  padding-left:max(12px,calc(50vw - 660px))!important;padding-right:max(12px,calc(50vw - 660px))!important;box-sizing:border-box}

/* v2.4 – billeder og knap i feature-paneler */
.ubermenu-main .bea-feature>.ubermenu-target{border-bottom:0!important;margin:0!important}
.ubermenu-main .bea-feature:before{content:"";display:block;height:150px;margin:-28px -28px 20px;background:#D5DAE3 center/cover no-repeat}
.ubermenu-main .bea-feature.bea-img-viden:before{background-image:url(https://bea360.dk/wp-content/uploads/2026/10/workspace-dualmonitor-1024x768.jpg)}
.ubermenu-main .bea-feature.bea-img-student:before{background-image:url(https://bea360.dk/wp-content/uploads/2026/10/team-praesentation-1024x768.jpg)}
.ubermenu-main .bea-feature.bea-img-priser:before{background-image:url(https://bea360.dk/wp-content/uploads/2026/10/byggeplads-tablet-1024x768.jpg)}
.ubermenu-main .bea-feature .ubermenu-submenu{padding:0!important}
.ubermenu-main .ubermenu-submenu .ubermenu-item.bea-btn>.ubermenu-target{display:inline-block;background:#1D4ED8;color:#fff!important;border-radius:4px;padding:12px 22px!important}
.ubermenu-main .ubermenu-submenu .ubermenu-item.bea-btn>.ubermenu-target:hover{background:#1F274D;color:#fff!important}

/* v2.5 – feature, beskrivelse, knap, strip */
.ubermenu-main .ubermenu-submenu-type-mega>li.bea-feature{float:left!important;clear:none!important;box-sizing:border-box}
.ubermenu-main .bea-feature>.ubermenu-target{display:block!important;padding:0!important;background:none!important}
.ubermenu-main .bea-feature>.ubermenu-target .ubermenu-target-title{display:block;font:700 18px/24px Sora,sans-serif;text-transform:none;letter-spacing:0;color:#1F274D}
.ubermenu-main .bea-feature>.ubermenu-target .ubermenu-target-description{display:block!important;margin:8px 0 14px;font:400 14px/22px 'IBM Plex Sans',sans-serif!important;text-transform:none!important;letter-spacing:0!important;color:#4B5563!important;white-space:normal}
.ubermenu-main .bea-feature>.ubermenu-target:after{content:none!important}
.ubermenu-main .bea-feature li.ubermenu-item.bea-btn>a.ubermenu-target{display:inline-block!important;background:#1D4ED8!important;color:#fff!important;border-radius:4px;padding:12px 22px!important;font:600 14px/1 'IBM Plex Sans',sans-serif;text-transform:none;letter-spacing:0}
.ubermenu-main .bea-feature li.ubermenu-item.bea-btn>a.ubermenu-target:hover{background:#1F274D!important}
.ubermenu-main .bea-strip{display:flex!important;align-items:center;flex-wrap:nowrap;gap:24px}
.ubermenu-main .bea-strip>.ubermenu-submenu,.ubermenu-main .bea-strip .ubermenu-submenu{position:static!important;display:flex!important;align-items:center;gap:24px;width:auto!important;padding:0!important;border:0!important;box-shadow:none!important;background:none!important;opacity:1!important;visibility:visible!important}
.ubermenu-main .bea-strip .bea-r{margin-left:auto}
.ubermenu-main .bea-strip .bea-head>a.ubermenu-target:after,.ubermenu-main .bea-strip .bea-head>.ubermenu-target:after{content:none!important}

/* v2.6 – strip under alt, kant til kant */
.ubermenu-main .ubermenu-submenu-type-mega>li.ubermenu-item-level-1.bea-strip{float:none!important;clear:both!important;display:flex!important;width:calc(100% + 2 * max(12px,calc(50vw - 660px)))!important;max-width:none!important;margin:24px calc(-1 * max(12px,calc(50vw - 660px))) 0!important;box-sizing:border-box}

/* v2.7 – højrestillet note i strip */
.ubermenu-main .bea-strip>.ubermenu-submenu,.ubermenu-main .bea-strip .ubermenu-submenu{flex:1 1 auto!important;width:100%!important}
.ubermenu-main .bea-strip .bea-r{margin-left:auto!important}

/* v2.8 – kolonneoverskrifter */
.ubermenu-main .bea-head>.ubermenu-target,
.ubermenu-main .bea-head>.ubermenu-target .ubermenu-target-text{font-size:13px!important;letter-spacing:.12em!important;color:#1F274D!important;font-weight:600!important}
.ubermenu-main .bea-head>a.ubermenu-target:hover,
.ubermenu-main .bea-head>a.ubermenu-target:hover .ubermenu-target-text{color:#1D4ED8!important}
.ubermenu-main .bea-head>a.ubermenu-target:after{color:#1D4ED8}

/* v2.9 – vinder over ældre kopi af reglerne (samme specificitet som originalen, indlæses senere) */
.ubermenu-main .ubermenu-submenu-type-mega>li.ubermenu-item-level-1.bea-strip{padding-left:max(12px,calc(50vw - 660px))!important;padding-right:max(12px,calc(50vw - 660px))!important}
.ubermenu-main .bea-strip>.ubermenu-submenu{flex-wrap:nowrap!important}

/* v3.0 – strip kant til kant uafhængigt af panelets padding (full-bleed) */
.ubermenu-main .bea-full>.ubermenu-submenu{overflow-x:clip}
.ubermenu-main .bea-full>.ubermenu-submenu.ubermenu-submenu-type-mega>li.ubermenu-item-level-1.bea-strip{width:auto!important;max-width:none!important;margin-left:calc(50% - 50vw)!important;margin-right:calc(50% - 50vw)!important;padding-left:calc(50vw - 50%)!important;padding-right:calc(50vw - 50%)!important;box-sizing:border-box}

/* v3.1 – smalle paneler under/ved siden af forælderen (klasserne bea-narrow [+ bea-right] på N0-punktet) */
.ubermenu-main li.bea-narrow{position:relative!important}
.ubermenu-main li.bea-narrow>.ubermenu-submenu.ubermenu-submenu-type-mega{width:760px!important;min-width:0!important;max-width:calc(100vw - 24px)!important;left:0!important;right:auto!important;margin:0!important;padding:0!important;border:1px solid #D5DAE3!important;border-top:3px solid #3B82F6!important;box-shadow:0 24px 48px rgba(20,26,56,.18)}
.ubermenu-main li.bea-narrow.bea-right>.ubermenu-submenu.ubermenu-submenu-type-mega{left:auto!important;right:0!important}
.ubermenu-main li.bea-narrow>.ubermenu-submenu>li.bea-strip{margin:0!important;padding-left:28px!important;padding-right:28px!important;width:100%!important}

/* v3.2: smalle paneler centreres ens under navigationen (ikke hængt op på hvert punkt) og gøres bredere */
.ubermenu-main li.bea-narrow{position:static!important}
.ubermenu-main li.bea-narrow>.ubermenu-submenu.ubermenu-submenu-type-mega,
.ubermenu-main li.bea-narrow.bea-right>.ubermenu-submenu.ubermenu-submenu-type-mega{width:880px!important;max-width:calc(100vw - 24px)!important;left:calc(50% - 440px)!important;right:auto!important}
@media (max-width:1000px){.ubermenu-main li.bea-narrow>.ubermenu-submenu.ubermenu-submenu-type-mega,.ubermenu-main li.bea-narrow.bea-right>.ubermenu-submenu.ubermenu-submenu-type-mega{left:12px!important}}

/* v3.3: alle undermenuer i fuld bredde – bea-narrow opfører sig som bea-full */
.ubermenu-main li.bea-narrow>.ubermenu-submenu.ubermenu-submenu-type-mega,
.ubermenu-main li.bea-narrow.bea-right>.ubermenu-submenu.ubermenu-submenu-type-mega{width:auto!important;min-width:0!important;max-width:none!important;left:0!important;right:0!important;margin:20px 0 0!important;padding-left:max(32px,calc(50% - 640px))!important;padding-right:max(32px,calc(50% - 640px))!important;border:0!important;overflow-x:clip}
.ubermenu-main .bea-narrow>.ubermenu-submenu.ubermenu-submenu-type-mega>li.ubermenu-item-level-1.bea-strip{width:auto!important;max-width:none!important;margin-left:calc(50% - 50vw)!important;margin-right:calc(50% - 50vw)!important;padding-left:calc(50vw - 50%)!important;padding-right:calc(50vw - 50%)!important;box-sizing:border-box}
@media (max-width:1000px){.ubermenu-main li.bea-narrow>.ubermenu-submenu.ubermenu-submenu-type-mega,.ubermenu-main li.bea-narrow.bea-right>.ubermenu-submenu.ubermenu-submenu-type-mega{left:0!important}}
