/* One wordmark geometry across public pages and the HTML application. */
:is(.site-brand,.client-brand){display:flex;flex-direction:row;align-items:center;gap:12px;font-family:NewZen,system-ui,sans-serif;font-size:22px;font-weight:700;white-space:nowrap;line-height:1.08}
:is(.site-brand,.client-brand)>:is(.brand-bulb,img){display:block;flex:0 0 32px;width:32px;height:44px;object-fit:contain}
:is(.site-brand,.client-brand)>:is(span:last-child,.brand-copy){display:block;line-height:1.08;transform:translateY(3px)}
:is(.site-brand,.client-brand) small{display:block;font-size:8px;font-weight:700;letter-spacing:1.8px;line-height:1.25;margin:2px 0 0;color:#d9ba77}
/* One radio pulse for the homepage and Saved courses wordmarks. */
.brand-beacon{position:relative;isolation:isolate;display:flex;align-items:center;justify-content:center;flex:0 0 32px;width:32px;height:44px}
.brand-beacon>.brand-bulb{position:relative;z-index:1;display:block;width:32px;height:44px;margin:0;object-fit:contain}
.brand-beacon::before,.brand-beacon::after{content:'';position:absolute;left:50%;top:calc(50% - 2px);width:28px;height:28px;border:1px solid #eed18a80;border-radius:50%;pointer-events:none;transform:translate(-50%,-50%);opacity:0;animation:brand-radio 4s ease-out infinite}
.brand-beacon::after{animation-delay:2s}
@keyframes brand-radio{0%{transform:translate(-50%,-50%) scale(.8);opacity:0}18%{opacity:.45}100%{transform:translate(-50%,-50%) scale(1.9);opacity:0}}
html:is(.reduced-motion,.client-reduced-motion,.a11y-reduce-motion,.a11y-pause-motion) .brand-beacon::before,html:is(.reduced-motion,.client-reduced-motion,.a11y-reduce-motion,.a11y-pause-motion) .brand-beacon::after{animation:none!important;opacity:0}
.client-bar{min-height:78px;padding:14px max(24px,calc((100vw - 1420px)/2))}
.uc-client #client-busy{top:78px}
.uc-client:is(.client-learning-home,.client-immersive) #client-busy{top:0}
.site-nav .nav-plan{display:inline-flex;align-items:center;justify-content:center;box-sizing:border-box;width:118px;flex:0 0 118px;min-height:42px;white-space:nowrap}
.site-nav .nav-signin{display:inline-flex;align-items:center;justify-content:center;min-height:42px}
.site-nav .nav-learning{gap:9px;color:#ecdbb3;border-color:#9b906b;background:#e5cc8b08}
.site-nav .nav-learning::after{content:'→';font-size:16px;line-height:1}
.uc-header-session .site-nav .nav-signin,.site-nav .nav-signin[hidden]{display:none!important}
.uc-header-pending .site-nav .nav-plan{visibility:hidden}
@media(max-width:800px){:is(.site-brand,.client-brand){font-size:20px}.client-bar{min-height:68px;padding:12px 18px}.uc-client #client-busy{top:68px}.site-nav .nav-plan{width:110px;flex-basis:110px;min-height:36px}}
/* Reserve the same mobile header geometry before and after authentication.
   Solid surfaces keep Safari's composited header from exposing the page below. */
.site-nav{isolation:isolate;background:#0b151d}
@media(max-width:1000px){
 .site-nav{display:grid!important;grid-template-columns:minmax(0,1fr) 110px;grid-template-rows:minmax(44px,auto) auto;gap:10px 12px}
 .site-nav .site-brand{grid-column:1;grid-row:1;align-self:center;margin-right:0;min-width:0}
 .site-nav nav{grid-column:1 / -1;grid-row:2;order:initial;margin-top:0}
 .site-nav .nav-plan,.site-nav .nav-signin{grid-column:2;justify-self:stretch;align-self:center;display:inline-flex;align-items:center;justify-content:center;min-height:36px;white-space:nowrap;transition:none;animation:none}
 .site-nav .nav-plan{grid-row:1;width:100%;min-height:36px;background:#0b151d}
 .site-nav .nav-signin{grid-row:1;border:1px solid #d9ba77;border-radius:24px;padding:6px 12px;font-size:13px;font-weight:700;color:#f4dfae;background:#202923}
 .site-nav .nav-signin:hover{background:#30372a}
 .site-nav .nav-learning{background:#111c20}
}
/* Keep the portrait/stacked header focused on signing in. Paid My learning stays. */
@media(max-width:1000px),(orientation:portrait){.site-nav .nav-plan:not(.nav-learning){display:none!important}}
@media(min-width:801px) and (max-width:1000px){.site-nav .site-brand{margin-top:3px}}
@media(max-width:380px){
 .site-nav{grid-template-columns:minmax(0,1fr) 94px;column-gap:8px}
 :is(.site-brand,.client-brand){font-size:18px;gap:8px}
 :is(.site-brand,.client-brand)>:is(.brand-bulb,img){width:28px;flex-basis:28px}
 .brand-beacon{width:28px;flex-basis:28px}
 .brand-beacon>.brand-bulb{width:28px}
 :is(.site-brand,.client-brand) small{font-size:6px;letter-spacing:1.2px}
 .site-nav .nav-plan{width:94px;flex-basis:94px;font-size:11px;padding-inline:8px}
}
.uc-client .client-saved .fi-header{min-height:78px;margin:-24px -40px 20px;padding:14px max(24px,calc((100vw - 1420px)/2));gap:10px}
.uc-client .client-saved .fi-saved-brand{margin-right:auto;flex-shrink:0}
.uc-client .client-saved .fi-saved-title{font:inherit;line-height:inherit;white-space:nowrap;overflow:visible}
.uc-client .client-saved .fi-header .fi-close{margin-left:0}
@media(max-width:800px){.uc-client .client-saved .fi-header{padding:12px 18px;min-height:68px}}
@media(max-width:700px){
 .uc-client .client-saved .fi-header{display:grid;grid-template-columns:minmax(0,1fr) 44px;margin:-14px -14px 14px;gap:10px 12px}
 .uc-client .client-saved .fi-saved-brand{grid-column:1;grid-row:1}
 .uc-client .client-saved .fi-header .fi-close{grid-column:2;grid-row:1}
 .uc-client .client-saved .fi-explore{grid-column:1 / -1;grid-row:2;justify-self:end}
}
@media(max-width:360px){.uc-client .client-saved .fi-header{margin:-10px -10px 14px}}
@media(min-width:701px) and (max-height:500px){.uc-client .client-saved .fi-header{margin:-10px -20px 8px}}