/* CGC Motion v2026.10.27.4: site header (line under the header removed in .4; pills from .2). Every menu link is a pill with its own picture.
   Restyles the Astra header; the menu itself (labels, links, order) is untouched.
   The pictures are added by cgc-motion.php (nav_menu_item_title). Remove the plugin and the old header returns. */

/* ---------- sticky header that tightens as you scroll ---------- */
#masthead{position:sticky;top:var(--wp-admin--admin-bar--height,0px);z-index:999;}
#masthead .ast-primary-header-bar,#masthead .main-header-bar{border-bottom-width:0 !important;}
@media (max-width:600px){#masthead{top:0;}}
#masthead .custom-logo-link{display:inline-block;transition:transform .45s cubic-bezier(.2,.8,.2,1);}
#masthead .custom-logo-link:hover{transform:rotate(-5deg) scale(1.04);}
#masthead .custom-logo{display:block;}
#ast-mobile-header .custom-logo{width:84px;height:auto;}
@supports (animation-timeline:scroll()){
  #ast-desktop-header .custom-logo{animation:cgcmHdrLogo linear both;animation-timeline:scroll(root);animation-range:0px 180px;}
  #ast-desktop-header .site-branding{animation:cgcmHdrPad linear both;animation-timeline:scroll(root);animation-range:0px 180px;}
  #ast-mobile-header .custom-logo{animation:cgcmHdrLogoM linear both;animation-timeline:scroll(root);animation-range:0px 140px;}
  #masthead .ast-primary-header-bar{animation:cgcmHdrShadow linear both;animation-timeline:scroll(root);animation-range:0px 180px;}
}
@keyframes cgcmHdrLogo{from{width:120px;}to{width:70px;}}
@keyframes cgcmHdrLogoM{from{width:84px;}to{width:58px;}}
@keyframes cgcmHdrPad{from{padding-top:15px;padding-bottom:15px;}to{padding-top:8px;padding-bottom:8px;}}
@keyframes cgcmHdrShadow{from{box-shadow:0 0 0 rgba(29,27,28,0);}to{box-shadow:0 14px 30px -18px rgba(29,27,28,.55);}}

/* ---------- the pill (desktop and phone) ---------- */
#masthead .main-header-menu>li>a.cgcm-pl{
  display:inline-flex !important;align-items:center;gap:10px;box-sizing:border-box;
  height:48px !important;min-height:0 !important;line-height:1 !important;padding:0 18px 0 7px !important;
  border:0 !important;border-radius:999px;
  background:rgba(255,255,255,.14) !important;box-shadow:inset 0 0 0 1px rgba(255,255,255,.22);
  font-family:'Jost',sans-serif;font-weight:600;font-size:16px !important;letter-spacing:0;color:#fff !important;
  text-decoration:none !important;white-space:nowrap;
  transition:background .25s ease,color .25s ease,transform .35s cubic-bezier(.2,.8,.2,1),box-shadow .25s ease;
}
#masthead .main-header-menu>li>a.cgcm-pl:hover,
#masthead .main-header-menu>li>a.cgcm-pl:focus-visible,
#masthead .main-header-menu>li.current-menu-item>a.cgcm-pl,
#masthead .main-header-menu>li.current_page_parent>a.cgcm-pl{
  background:#fff !important;color:#DC3030 !important;box-shadow:0 12px 26px -14px rgba(29,27,28,.7);
}
#masthead .main-header-menu>li>a.cgcm-pl:hover{transform:translateY(-2px);}
#masthead .main-header-menu>li>a.cgcm-pl:focus-visible{outline:2px solid #1D1B1C;outline-offset:3px;}
#masthead a.cgcm-pl::before,#masthead a.cgcm-pl::after{display:none !important;content:none !important;}

.cgcm-ic{position:relative;flex:none;width:34px;height:34px;border-radius:50%;background:rgba(29,27,28,.22);display:flex;align-items:center;justify-content:center;overflow:hidden;transition:background .25s ease;}
a.cgcm-pl:hover .cgcm-ic,a.cgcm-pl:focus-visible .cgcm-ic,.current-menu-item>a.cgcm-pl .cgcm-ic,.current_page_parent>a.cgcm-pl .cgcm-ic{background:#DC3030;}
.cgcm-ic svg{width:20px;height:20px;overflow:visible;}

/* Home: a coffee cup that steams */
.cgcm-pl-home .cgcm-st{opacity:.5;}
.cgcm-pl-home:hover .cgcm-st{animation:cgcmSteam 1.2s ease-out infinite;}
.cgcm-pl-home:hover .cgcm-st+.cgcm-st{animation-delay:.25s;}
@keyframes cgcmSteam{0%{opacity:0;transform:translateY(3px);}40%{opacity:1;}100%{opacity:0;transform:translateY(-4px);}}

/* Episodes: leads in dark, live waveform, latest episode number */
#masthead .main-header-menu>li>a.cgcm-pl-ep{background:#1D1B1C !important;box-shadow:0 12px 26px -14px rgba(29,27,28,.8);padding-right:8px !important;}
#masthead .main-header-menu>li>a.cgcm-pl-ep:hover{background:#000 !important;color:#fff !important;}
#masthead .main-header-menu>li.current-menu-item>a.cgcm-pl-ep,#masthead .main-header-menu>li.current_page_parent>a.cgcm-pl-ep{background:#fff !important;color:#DC3030 !important;}
.cgcm-pl-ep .cgcm-ic{background:#DC3030;}
a.cgcm-pl-ep:hover .cgcm-ic{background:#E33B3B;}
.cgcm-wave{display:flex;align-items:center;gap:2px;height:16px;}
.cgcm-wave b{width:3px;height:100%;border-radius:2px;background:#fff;transform:scaleY(.35);animation:cgcmEq 1.8s ease-in-out infinite alternate;}
.cgcm-wave b:nth-child(2){animation-delay:.2s;}.cgcm-wave b:nth-child(3){animation-delay:.45s;}.cgcm-wave b:nth-child(4){animation-delay:.1s;}
a.cgcm-pl-ep:hover .cgcm-wave b{animation-duration:.9s;}
@keyframes cgcmEq{from{transform:scaleY(.3);}to{transform:scaleY(1);}}
.cgcm-num{display:inline-flex;align-items:center;gap:6px;height:32px;padding:0 11px;border-radius:999px;background:#DC3030;color:#fff;font-size:13px;font-variant-numeric:tabular-nums;}
.cgcm-num i{width:7px;height:7px;border-radius:50%;background:#fff;animation:cgcmBlink 1.2s steps(1) infinite;}
@keyframes cgcmBlink{50%{opacity:.25;}}

/* Guides: two pages that fan open */
.cgcm-pg{position:absolute;width:13px;height:17px;border-radius:2px 5px 2px 2px;background:#fff;transition:transform .45s cubic-bezier(.2,.8,.2,1);}
.cgcm-pg.a{transform:rotate(-8deg) translateX(-2px);}
.cgcm-pg.b{transform:rotate(6deg) translateX(3px);background:#F1D3D1;}
.cgcm-pg.b::before{content:"";position:absolute;left:3px;right:3px;top:5px;height:1.5px;background:#DC3030;box-shadow:0 3.5px 0 #DC3030,0 7px 0 #DC3030;}
a.cgcm-pl-gd:hover .cgcm-pg.a{transform:rotate(-20deg) translateX(-5px);}
a.cgcm-pl-gd:hover .cgcm-pg.b{transform:rotate(14deg) translateX(5px) translateY(-1px);background:#fff;}
.current-menu-item>a.cgcm-pl-gd .cgcm-pg.b{background:#fff;}

/* Guest Network: a flag that flips through the guests' countries */
.cgcm-fl{width:22px;height:16px;border-radius:2px;background:#fff center/cover no-repeat;box-shadow:0 0 0 1px rgba(0,0,0,.12);animation:cgcmFlags 12s steps(1) infinite;}
a.cgcm-pl-net:hover .cgcm-fl{animation-duration:3s;}
@keyframes cgcmFlags{
  0%{background-image:url(flags/flag-us.svg);}
  10%{background-image:url(flags/flag-ca.svg);}
  20%{background-image:url(flags/flag-gb.svg);}
  30%{background-image:url(flags/flag-au.svg);}
  40%{background-image:url(flags/flag-de.svg);}
  50%{background-image:url(flags/flag-mx.svg);}
  60%{background-image:url(flags/flag-is.svg);}
  70%{background-image:url(flags/flag-gb-sct.svg);}
  80%{background-image:url(flags/flag-ae.svg);}
  90%{background-image:url(flags/flag-il.svg);}
}

/* About: the two hosts as small avatars that lean apart */
.cgcm-pl-ab .cgcm-ic,.cgcm-pl-ab:hover .cgcm-ic,.current-menu-item>a.cgcm-pl-ab .cgcm-ic{width:52px;border-radius:999px;background:transparent;overflow:visible;}
.cgcm-av{position:absolute;top:3px;width:28px;height:28px;border-radius:50%;background:#ddd center/cover no-repeat;box-shadow:0 0 0 2px #DC3030;transition:transform .4s cubic-bezier(.2,.8,.2,1),box-shadow .25s ease;}
.cgcm-av.l{left:1px;background-image:url(img/host-left.jpg);z-index:1;}
.cgcm-av.r{left:23px;background-image:url(img/host-right.jpg);}
a.cgcm-pl-ab:hover .cgcm-av.l{transform:translateX(-3px) rotate(-6deg);}
a.cgcm-pl-ab:hover .cgcm-av.r{transform:translateX(3px) rotate(6deg);}
a.cgcm-pl-ab:hover .cgcm-av,.current-menu-item>a.cgcm-pl-ab .cgcm-av{box-shadow:0 0 0 2px #fff;}

/* Be a Guest: a mic that picks up sound */
.cgcm-pl-bg .cgcm-arc{opacity:0;transform-origin:12px 11px;}
a.cgcm-pl-bg:hover .cgcm-arc{animation:cgcmArc 1.2s ease-out infinite;}
a.cgcm-pl-bg:hover .cgcm-arc+.cgcm-arc{animation-delay:.3s;}
@keyframes cgcmArc{0%{opacity:0;transform:scale(.7);}40%{opacity:1;}100%{opacity:0;transform:scale(1.25);}}

/* ---------- desktop row ---------- */
#ast-hf-menu-1{gap:8px;align-items:center;}
#ast-hf-menu-1>li{display:flex;align-items:center;}
@media (max-width:1240px){
  #masthead #ast-hf-menu-1{gap:6px;}
  #masthead #ast-hf-menu-1>li>a.cgcm-pl{font-size:15px !important;height:44px !important;gap:8px;padding-right:14px !important;}
  #masthead #ast-hf-menu-1 .cgcm-ic{width:30px;height:30px;}
  #masthead #ast-hf-menu-1 .cgcm-pl-ab .cgcm-ic{width:48px;}
  #masthead #ast-hf-menu-1 .cgcm-av{top:2px;width:26px;height:26px;}
  #masthead #ast-hf-menu-1 .cgcm-av.r{left:21px;}
  #masthead #ast-hf-menu-1 .cgcm-num{height:28px;padding:0 9px;}
}
@media (max-width:1120px){
  #masthead #ast-hf-menu-1>li>a.cgcm-pl{padding-right:12px !important;font-size:14px !important;}
  #masthead #ast-hf-menu-1>li>a.cgcm-pl-ep{padding-right:7px !important;}
}
@media (max-width:1010px){
  #masthead #ast-hf-menu-1 .cgcm-pl-ep .cgcm-num{display:none;}
  #masthead #ast-hf-menu-1>li>a.cgcm-pl-ep{padding-right:14px !important;}
}

/* ---------- phone: round toggle, dark panel with stacked pills, Episodes first ---------- */
#ast-mobile-header .menu-toggle{width:46px;height:46px;padding:0;display:inline-flex;align-items:center;justify-content:center;border:0;border-radius:14px;background:#fff;color:#DC3030;box-shadow:0 10px 24px -14px rgba(29,27,28,.6);}
#ast-mobile-header .menu-toggle .ast-mobile-svg,#ast-mobile-header .menu-toggle svg{fill:#DC3030;color:#DC3030;}
#ast-mobile-header .menu-toggle.toggled{background:#1D1B1C;}
#ast-mobile-header .menu-toggle.toggled svg{fill:#fff;color:#fff;}
#ast-mobile-header .ast-mobile-header-content{background:#1D1B1C !important;padding:14px 16px 22px;box-shadow:0 30px 60px -30px rgba(0,0,0,.7);}
#ast-mobile-header .ast-mobile-header-content .main-header-menu{display:flex !important;flex-direction:column;gap:10px;background:transparent !important;border:0 !important;}
#ast-mobile-header .ast-mobile-header-content .main-header-menu>li{border:0 !important;background:transparent !important;animation:cgcmNavIn .5s cubic-bezier(.2,.8,.2,1) both;}
#ast-mobile-header .ast-mobile-header-content .main-header-menu>li.cgcm-li-ep{order:-1;}
#ast-mobile-header .ast-mobile-header-content .main-header-menu>li:nth-child(2){animation-delay:.04s;}
#ast-mobile-header .ast-mobile-header-content .main-header-menu>li:nth-child(3){animation-delay:.08s;}
#ast-mobile-header .ast-mobile-header-content .main-header-menu>li:nth-child(4){animation-delay:.12s;}
#ast-mobile-header .ast-mobile-header-content .main-header-menu>li:nth-child(5){animation-delay:.16s;}
#ast-mobile-header .ast-mobile-header-content .main-header-menu>li:nth-child(6){animation-delay:.2s;}
#ast-mobile-header .main-header-menu>li>a.cgcm-pl{display:flex !important;width:100%;height:60px !important;font-size:20px !important;padding:0 20px 0 9px !important;gap:14px;}
#ast-mobile-header .cgcm-ic{width:42px;height:42px;}
#ast-mobile-header .cgcm-pl-ab .cgcm-ic{width:64px;}
#ast-mobile-header .cgcm-av{top:4px;width:34px;height:34px;}
#ast-mobile-header .cgcm-av.r{left:29px;}
#ast-mobile-header .main-header-menu>li>a.cgcm-pl-ep{background:#DC3030 !important;box-shadow:none;}
#ast-mobile-header .main-header-menu>li>a.cgcm-pl-ep .cgcm-ic,#ast-mobile-header .main-header-menu>li>a.cgcm-pl-ep .cgcm-num{background:#1D1B1C;}
#ast-mobile-header .main-header-menu>li.current-menu-item>a.cgcm-pl-ep,#ast-mobile-header .main-header-menu>li.current_page_parent>a.cgcm-pl-ep{background:#fff !important;color:#DC3030 !important;}
#ast-mobile-header .cgcm-num{margin-left:auto;}
#ast-mobile-header .main-header-menu>li>a.cgcm-pl:hover{transform:none;}
@keyframes cgcmNavIn{from{opacity:0;translate:-14px 0;}to{opacity:1;translate:0 0;}}

/* ---------- phone footer: keep it inside the screen ---------- */
@media (max-width:600px){
  .site-above-footer-inner-wrap{padding-left:20px !important;padding-right:20px !important;}
  .site-above-footer-wrap>.ast-builder-grid-row-container-inner{min-width:0;}
}

@media (prefers-reduced-motion:reduce){
  #masthead *,#masthead *::before,#masthead *::after{animation:none !important;transition:none !important;}
  .cgcm-fl{background-image:url(flags/flag-ca.svg);}
}
