/* Featured Announcements: the banner under the menu bar on the Calendar page (.fab) and the slideshow player page
   /announcements-featured (.fa). Markup: includes/site/featured.php and announcements-featured.php. Behaviour: assets/announcements.js.
   Mobbin: OpenTable gradient CTA band + Grammarly announcement bar (banner); Telegram / Instagram stories and
   Klook / Unity galleries (player). Banner: variations of the brand gold with black text; player: purple + gold. */
/* Colours: only the Brand Style Guide's tokens (Admin → Brand style guide), with its default values as fallbacks.
   Shades are mixes of those tokens with each other, white, black or transparency, never new hues. */
.fab,.fa,.evc,.vh,.post--video{--fa-primary:var(--brand-primary,#241236);--fa-violet:var(--brand-primary-2,#542675);--fa-deep:var(--brand-dark,#170a24);--fa-night:var(--brand-primary-deep,#1d0e2b);--fa-gold:var(--brand-accent,#d9b24c);--fa-gold-hi:var(--brand-accent-light,#ead59d);--fa-gold-ink:var(--brand-accent-ink,#876e2f);--fa-ink:var(--brand-text,#1d1a21);--fa-muted:var(--brand-muted,#6a686c);--fa-line:var(--brand-line,#e4e3e6);--fa-bg:var(--brand-bg,#fff)}
.fab *,.fa *{box-sizing:border-box}
.fab svg,.fa svg{width:1em;height:1em;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;flex:none}

/* ============================== Banner (≤150px tall) ============================== */
.fab{--fab-ink:var(--fa-ink);position:relative;isolation:isolate;overflow:hidden;max-height:150px;color:var(--fab-ink);
  background:linear-gradient(110deg,color-mix(in srgb,var(--fa-gold) 75%,var(--fa-gold-ink)) 0%,var(--fa-gold) 24%,color-mix(in srgb,var(--fa-gold) 45%,var(--fa-gold-hi)) 48%,var(--fa-gold-hi) 62%,var(--fa-gold) 80%,color-mix(in srgb,var(--fa-gold) 70%,var(--fa-gold-ink)) 100%);
  background-size:180% 100%;animation:fabFlow 12s ease-in-out infinite alternate;box-shadow:inset 0 -1px 0 color-mix(in srgb,var(--fa-gold-ink) 25%,transparent),0 14px 30px -22px var(--fa-gold-ink)}
.fab::before{content:"";position:absolute;inset:0;z-index:-1;background:radial-gradient(color-mix(in srgb,var(--fa-gold-ink) 14%,transparent) 1px,transparent 1.4px) 0 0/18px 18px;-webkit-mask-image:linear-gradient(90deg,#000,transparent 70%);mask-image:linear-gradient(90deg,#000,transparent 70%)}
.fab-glow{position:absolute;inset:0;z-index:-1;background:radial-gradient(380px circle at var(--mx,78%) var(--my,50%),color-mix(in srgb,var(--fa-gold-hi) 45%,transparent),transparent 62%);opacity:.75;transition:opacity .3s;pointer-events:none}
.fab-shine{position:absolute;inset:-50% auto -50% -30%;z-index:-1;width:22%;background:linear-gradient(90deg,transparent,#ffffff66,transparent);transform:skewX(-20deg);animation:fabShine 6.5s ease-in-out infinite;pointer-events:none}
.fab-inner{display:flex;align-items:center;gap:22px;width:min(1240px,calc(100% - 72px));min-height:96px;margin:0 auto;padding:14px 0}
.fab-inner>*:not(.fab-btn),.fab-btn-face{position:relative;z-index:1}

.fab-stack{position:relative;flex:none;width:124px;height:62px}
.fab-stack img{position:absolute;top:4px;left:0;width:96px;height:54px;object-fit:cover;border-radius:10px;border:2px solid #fff;box-shadow:0 10px 22px -8px color-mix(in srgb,var(--fa-deep) 80%,transparent);
  transform:translateX(calc(var(--i) * 12px)) rotate(calc((var(--i) - 1) * -6deg));transition:transform .45s cubic-bezier(.2,.8,.2,1.2)}
.fab-stack img[style*="--i:0"]{z-index:3}.fab-stack img[style*="--i:1"]{z-index:2}
.fab:hover .fab-stack img{transform:translateX(calc(var(--i) * 18px)) rotate(calc((var(--i) - 1) * -10deg)) translateY(-2px)}
.fab-play{position:absolute;z-index:4;left:34px;top:18px;display:grid;place-items:center;width:28px;height:28px;border-radius:50%;background:var(--fab-ink);color:var(--fa-gold-hi);box-shadow:0 0 0 0 color-mix(in srgb,var(--fa-ink) 53%,transparent);animation:fabPing 2.2s infinite}
.fab-play svg{width:13px;height:13px;margin-left:2px;fill:currentColor;stroke:none}
.fab-badge{flex:none;display:grid;place-items:center;width:56px;height:56px;border-radius:16px;background:#ffffff59;border:1px solid color-mix(in srgb,var(--fa-ink) 15%,transparent);font-size:28px;color:var(--fab-ink);backdrop-filter:blur(6px)}

.fab-copy{min-width:0;flex:1;display:grid;gap:4px}
.fab-eyebrow{display:flex;align-items:center;gap:8px;white-space:nowrap;font-size:12px;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:var(--fab-ink)}
.fab-eyebrow em{display:inline-grid;place-items:center;min-width:22px;height:20px;padding:0 7px;border-radius:10px;background:var(--fab-ink);color:var(--fa-gold-hi);font-style:normal;font-size:11px;letter-spacing:0}
.fab-dot,.fa-dot{position:relative;width:8px;height:8px;border-radius:50%;background:var(--fa-gold-hi);flex:none}
.fab .fab-dot{background:var(--fab-ink)}.fab .fab-dot::after{color:var(--fab-ink)}
.fab-dot::after,.fa-dot::after{content:"";position:absolute;inset:-4px;border-radius:50%;border:2px solid currentColor;color:var(--fa-gold-hi);animation:fabRing 1.8s ease-out infinite}
.fab-title{display:grid;margin:0;font-size:clamp(17px,1.9vw,24px);font-weight:800;line-height:1.2;letter-spacing:-.2px;text-shadow:0 1px 0 #ffffff59}
.fab-title span{grid-area:1/1;overflow:hidden;display:-webkit-box;-webkit-line-clamp:1;-webkit-box-orient:vertical;opacity:0;transform:translateY(70%);transition:opacity .45s,transform .55s cubic-bezier(.2,.8,.2,1)}
.fab-title span.is-on{opacity:1;transform:none}
.fab-title span.is-out{opacity:0;transform:translateY(-70%)}

.fab-btn{flex:none;text-decoration:none}   /* stays unpositioned and untransformed so its ::after can cover the whole banner */
.fab-btn-face{display:inline-flex;align-items:center;gap:10px;height:50px;padding:0 22px 0 24px;border-radius:999px;color:var(--fab-ink);font-size:15px;font-weight:800;white-space:nowrap;
  background:linear-gradient(110deg,#fff 0 40%,color-mix(in srgb,var(--fa-gold-hi) 35%,#fff) 50%,#fff 60% 100%) 120% 0/250% 100%;box-shadow:0 10px 24px -10px color-mix(in srgb,var(--fa-gold-ink) 80%,transparent),0 0 0 4px #ffffff59;transition:transform .2s,box-shadow .2s,background-position .9s}
.fab-btn::after{content:"";position:absolute;inset:0;z-index:2}   /* the whole banner is the link */
.fab-btn svg{width:18px;height:18px;stroke-width:2.4;transition:transform .25s}
.fab:hover .fab-btn-face{transform:translateY(-2px) scale(1.03);background-position:-20% 0;box-shadow:0 16px 30px -12px color-mix(in srgb,var(--fa-gold-ink) 80%,transparent),0 0 0 6px #ffffff73}
.fab:hover .fab-btn svg{transform:translateX(4px)}
.fab:active .fab-btn-face{transform:scale(.98)}
.fab:has(.fab-btn:focus-visible){outline:3px solid var(--fab-ink);outline-offset:-3px}
.fab-btn:focus-visible{outline:none}
.fab-btn-short{display:none}

@media(max-width:980px){.fab-inner{width:calc(100% - 40px);min-height:84px;gap:16px}}
@media(max-width:760px){
.fab-btn-long{display:none}.fab-btn-short{display:inline}
.fab-btn-face{height:42px;padding:0 14px 0 18px;font-size:14px}
.fab-stack{width:86px;height:46px}
.fab-stack img{width:68px;height:38px;border-radius:8px;transform:translateX(calc(var(--i) * 8px)) rotate(calc((var(--i) - 1) * -6deg))}
.fab-play{left:22px;top:10px;width:24px;height:24px}
.fab-title{font-size:16px}
.fab-title span{-webkit-line-clamp:2}
.fab-eyebrow{font-size:10.5px;letter-spacing:.12em}
}
@media(max-width:420px){.fab-stack,.fab-badge,.fab-eyebrow-long{display:none}.fab-inner{min-height:76px;padding:12px 0}.fab-title{font-size:15px}}

@keyframes fabFlow{from{background-position:0 0}to{background-position:100% 0}}
@keyframes fabShine{0%,55%{left:-30%}85%,100%{left:120%}}
@keyframes fabRing{from{transform:scale(.6);opacity:.9}to{transform:scale(1.8);opacity:0}}
@keyframes fabPing{0%{box-shadow:0 0 0 0 color-mix(in srgb,var(--fa-ink) 53%,transparent)}70%{box-shadow:0 0 0 10px color-mix(in srgb,var(--fa-ink) 0%,transparent)}100%{box-shadow:0 0 0 0 color-mix(in srgb,var(--fa-ink) 0%,transparent)}}

/* ============================== Player page ============================== */
.fa-page{background:var(--fa-bg)}
.fa{display:block}
.fa h1,.fa h2{font-family:inherit;text-transform:none;letter-spacing:-.4px}

.fa-stage{position:relative;padding:28px 20px 32px;
  background:radial-gradient(900px 420px at 12% -10%,color-mix(in srgb,var(--fa-violet) 30%,transparent),transparent 62%),radial-gradient(760px 420px at 100% 10%,color-mix(in srgb,var(--fa-gold) 18%,transparent),transparent 60%),linear-gradient(180deg,var(--fa-deep),var(--fa-primary))}
.fa-player{position:relative;width:100%;max-width:min(1180px,max(560px,calc((100svh - var(--mm-chrome,125px) - 150px) * 16 / 9)));aspect-ratio:16/9;margin:0 auto;border-radius:20px;overflow:hidden;
  background:var(--fa-deep);color:#fff;box-shadow:0 34px 80px -34px #000,0 0 0 1px #ffffff17;outline:none;user-select:none;-webkit-user-select:none;touch-action:pan-y}
.fa-player:focus-visible{box-shadow:0 34px 80px -34px #000,0 0 0 3px var(--fa-gold-hi)}
.fa-player:fullscreen{max-width:none;border-radius:0;aspect-ratio:auto}
.fa-player:fullscreen .fa-slide img,.fa-player:fullscreen .fa-slide video{object-fit:contain}

.fa-slides{position:absolute;inset:0}
.fa-slide{position:absolute;inset:0;opacity:0;visibility:hidden;transition:opacity .7s ease,visibility 0s .7s}
.fa-slide.is-active{opacity:1;visibility:visible;transition:opacity .7s ease}
.fa-slide img,.fa-slide video,.fa-slide iframe{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;border:0;background:var(--fa-deep)}
.fa-slide[data-kind=image].is-active img{animation:faKen 9s ease-out both}
.fa-player.is-paused .fa-slide.is-active img,.fa-player.is-holding .fa-slide.is-active img{animation-play-state:paused}
.fa-slide.is-playing .fa-yt-play{display:none}
.fa-shade{position:absolute;inset:0;pointer-events:none;background:linear-gradient(180deg,color-mix(in srgb,var(--fa-deep) 70%,transparent) 0,color-mix(in srgb,var(--fa-deep) 0%,transparent) 26%,color-mix(in srgb,var(--fa-deep) 0%,transparent) 52%,color-mix(in srgb,var(--fa-deep) 90%,transparent) 100%);transition:opacity .4s}
.fa-player.is-yt-playing .fa-shade,.fa-player.is-yt-playing .fa-caption,.fa-player.is-yt-playing .fa-bars{opacity:0;pointer-events:none}

.fa-bars{position:absolute;top:14px;left:18px;right:18px;z-index:3;display:flex;gap:5px;transition:opacity .3s}
.fa-bar{flex:1;height:3px;border-radius:3px;background:#ffffff47;overflow:hidden}
.fa-bar i{display:block;width:100%;height:100%;background:#fff;transform-origin:left;transform:scaleX(var(--p,0))}
.fa-top{position:absolute;top:28px;left:18px;right:18px;z-index:3;display:flex;align-items:center;gap:10px;pointer-events:none}
.fa-top>*{pointer-events:auto}
.fa-chip,.fa-count{display:inline-flex;align-items:center;gap:6px;height:30px;padding:0 12px;border-radius:15px;background:color-mix(in srgb,var(--fa-deep) 40%,transparent);border:1px solid #ffffff26;backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);font-size:12.5px;font-weight:700;letter-spacing:.02em}
.fa-chip svg{width:15px;height:15px}
.fa-count{font-variant-numeric:tabular-nums;color:#ffffffd9}
.fa-ctrls{margin-left:auto;display:flex;gap:8px}
.fa-ctrl,.fa-nav{display:grid;place-items:center;border:1px solid #ffffff2e;border-radius:50%;background:color-mix(in srgb,var(--fa-deep) 40%,transparent);color:#fff;cursor:pointer;backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);transition:background .2s,transform .2s,opacity .25s}
.fa-ctrl{width:40px;height:40px;font-size:18px}
.fa-ctrl:hover,.fa-nav:hover{background:#ffffff33;transform:scale(1.08)}
.fa-ctrl:active,.fa-nav:active{transform:scale(.94)}
.fa-ctrl:focus-visible,.fa-nav:focus-visible,.fa-yt-play:focus-visible{outline:3px solid var(--fa-gold-hi);outline-offset:2px}
.fa-ctrl[hidden]{display:none}
.fa-nav{position:absolute;top:50%;z-index:3;width:54px;height:54px;margin-top:-27px;font-size:24px;opacity:0}
.fa-nav--prev{left:18px}.fa-nav--next{right:18px}
.fa-player:hover .fa-nav,.fa-player:focus-within .fa-nav{opacity:1}
@media(pointer:coarse){.fa-nav{opacity:.9}}

.fa-caption{position:absolute;left:28px;right:28%;bottom:26px;z-index:3;display:grid;gap:8px;color:#fff;text-decoration:none;transition:opacity .3s}
.fa-caption strong{font-size:clamp(20px,2.7vw,36px);font-weight:800;line-height:1.12;letter-spacing:-.5px;text-shadow:0 2px 18px color-mix(in srgb,var(--fa-deep) 70%,transparent);overflow:hidden;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical}
.fa-caption:hover strong{text-decoration:underline;text-decoration-thickness:2px;text-underline-offset:5px}
.fa-kicker{justify-self:start;padding:4px 10px;border-radius:8px;background:linear-gradient(90deg,var(--fa-violet),var(--fa-primary));font-size:12px;font-weight:800;letter-spacing:.08em;text-transform:uppercase}
.fa-caption.is-swap{animation:faRise .55s cubic-bezier(.2,.8,.2,1) both}

.fa-yt-play{position:absolute;left:50%;top:50%;z-index:4;display:flex;align-items:center;gap:10px;height:64px;padding:0 26px 0 20px;border:0;border-radius:32px;transform:translate(-50%,-50%);
  background:#fff;color:var(--fa-deep);font:inherit;font-size:16px;font-weight:800;cursor:pointer;box-shadow:0 0 0 0 #ffffff80,0 18px 40px -12px #000;animation:faPulse 2.4s infinite;transition:transform .2s}
.fa-yt-play svg{width:24px;height:24px;fill:var(--fa-violet);stroke:none}
.fa-yt-play:hover{transform:translate(-50%,-50%) scale(1.06)}
.fa-toast{position:absolute;left:50%;bottom:22px;z-index:5;margin:0;padding:9px 16px;border-radius:20px;background:#fff;color:var(--fa-deep);font-size:14px;font-weight:700;transform:translate(-50%,12px);opacity:0;pointer-events:none;transition:opacity .25s,transform .25s;white-space:nowrap}
.fa-toast.is-on{opacity:1;transform:translate(-50%,0)}

/* Phones: the player is flush under the menu bar, edge to edge, and stays pinned while the rest scrolls beneath it. */
@media(max-width:767px){
.fa-stage{position:sticky;top:var(--mm-chrome,109px);z-index:7;padding:0;background:var(--fa-deep);box-shadow:0 10px 24px -14px var(--fa-deep)}
.fa-player{max-width:none;border-radius:0;box-shadow:none}
.fa-player:focus-visible{box-shadow:inset 0 0 0 3px var(--fa-gold-hi)}
.fa-bars{top:8px;left:10px;right:10px;gap:4px}
.fa-top{top:18px;left:10px;right:10px;gap:6px}
.fa-chip,.fa-count{height:26px;padding:0 9px;font-size:11px}
.fa-ctrl{width:34px;height:34px;font-size:15px}
.fa-ctrl[data-fa-full]{display:none}
.fa-nav{width:36px;height:36px;margin-top:-18px;font-size:18px}
.fa-nav--prev{left:8px}.fa-nav--next{right:8px}
.fa-caption{left:14px;right:56px;bottom:12px;gap:5px}
.fa-caption strong{font-size:17px;-webkit-line-clamp:1}
.fa-kicker{font-size:10px;padding:3px 8px}
.fa-yt-play{height:50px;padding:0 18px 0 14px;font-size:14px}
}
/* Phone turned sideways: the player takes over the screen, like a fullscreen video. */
@media(orientation:landscape) and (max-height:540px) and (pointer:coarse){
html:has(.fa-stage){overflow:hidden}
.fa-stage{position:fixed;inset:0;z-index:100;padding:env(safe-area-inset-top) env(safe-area-inset-right) env(safe-area-inset-bottom) env(safe-area-inset-left);background:#000}
.fa-player{width:100%;height:100%;max-width:none;aspect-ratio:auto;border-radius:0;box-shadow:none}
.fa-slide img,.fa-slide video{object-fit:contain}
}

/* Filmstrip + details */
.fa-wrap{width:min(1180px,calc(100% - 40px));margin:0 auto;padding:22px 0 56px}
.fa-strip{display:flex;gap:14px;overflow-x:auto;scroll-snap-type:x proximity;scroll-padding:0 6px;margin:0 -6px;padding:6px 6px 14px;scrollbar-width:thin}
.fa-thumb{flex:0 0 200px;display:grid;gap:8px;padding:0;border:0;background:none;color:var(--fa-ink);font:inherit;text-align:left;cursor:pointer;scroll-snap-align:start}
.fa-thumb-img{position:relative;display:block;aspect-ratio:16/9;overflow:hidden;border-radius:12px;background:linear-gradient(135deg,var(--fa-violet),var(--fa-primary));outline:3px solid transparent;outline-offset:2px;transition:outline-color .25s,transform .25s}
.fa-thumb-img img{width:100%;height:100%;object-fit:cover;filter:saturate(.75) brightness(.8);transition:transform .4s,filter .3s}
.fa-thumb:hover .fa-thumb-img img,.fa-thumb.is-active .fa-thumb-img img{filter:none}
.fa-thumb:hover .fa-thumb-img img{transform:scale(1.06)}
.fa-thumb:hover .fa-thumb-img{transform:translateY(-2px)}
.fa-thumb.is-active .fa-thumb-img{outline-color:var(--fa-violet)}
.fa-thumb:focus-visible{outline:none}.fa-thumb:focus-visible .fa-thumb-img{outline-color:var(--fa-gold)}
.fa-thumb-play{position:absolute;left:8px;bottom:10px;display:grid;place-items:center;width:26px;height:26px;border-radius:50%;background:#fffffff0;color:var(--fa-violet)}
.fa-thumb-play svg{width:12px;height:12px;margin-left:2px;fill:currentColor;stroke:none}
.fa-thumb-fill{position:absolute;left:0;right:0;bottom:0;height:4px;background:linear-gradient(90deg,var(--fa-violet),var(--fa-gold));transform-origin:left;transform:scaleX(var(--p,0))}
.fa-thumb-copy{display:grid;gap:2px;font-size:14px;font-weight:700;line-height:1.3}
.fa-thumb-copy{overflow:hidden;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical}
.fa-thumb-copy small{display:block;color:var(--fa-muted);font-size:11px;font-weight:700;letter-spacing:.08em;text-transform:uppercase}
.fa-thumb.is-active .fa-thumb-copy small{color:var(--fa-violet)}

.fa-detail{display:flex;align-items:flex-end;justify-content:space-between;gap:28px;margin-top:10px;padding:24px 0 6px;border-top:1px solid var(--fa-line)}
.fa-detail-copy{min-width:0;max-width:760px}
.fa-detail.is-swap .fa-detail-copy{animation:faRise .5s cubic-bezier(.2,.8,.2,1) both}
.fa-eyebrow{display:flex;align-items:center;gap:10px;margin:0 0 10px;font-size:13px;font-weight:800;letter-spacing:.14em;text-transform:uppercase!important;color:var(--fa-violet)}
.fa-eyebrow .fa-dot{background:var(--fa-primary)}.fa-eyebrow .fa-dot::after{color:var(--fa-primary)}
.fa-detail h2{margin:0;color:var(--fa-ink);font-size:clamp(24px,3vw,38px);font-weight:800;line-height:1.12}
.fa-meta{margin:10px 0 0;color:var(--fa-muted);font-size:14px;font-weight:600}
.fa-excerpt{margin:12px 0 0;color:var(--fa-ink);font-size:17px;line-height:1.6;max-width:62ch}
.fa-actions{display:flex;flex-wrap:wrap;gap:10px;flex:none}
.fa-btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;height:48px;padding:0 20px;border:1.5px solid var(--fa-line);border-radius:999px;background:var(--fa-bg);color:var(--fa-ink);font:inherit;font-size:15px;font-weight:700;text-decoration:none;cursor:pointer;transition:transform .2s,box-shadow .2s,border-color .2s,background-position .6s}
.fa-btn svg{width:18px;height:18px;transition:transform .2s}
.fa-btn:hover{transform:translateY(-2px);border-color:var(--fa-violet);box-shadow:0 10px 22px -14px var(--fa-violet)}
.fa-btn:hover svg{transform:translateX(3px)}
.fa-btn[data-fa-share]:hover svg{transform:translateY(-2px)}
.fa-btn--primary{border:0;color:#fff;background:linear-gradient(110deg,var(--fa-violet),var(--fa-primary) 55%,var(--fa-violet)) 0 0/180% 100%;box-shadow:0 12px 26px -14px var(--fa-violet)}
.fa-btn--primary:hover{background-position:100% 0;color:#fff}
.fa-btn:focus-visible{outline:3px solid var(--fa-gold);outline-offset:3px}
.fa-more{display:flex;flex-wrap:wrap;gap:12px 28px;margin:28px 0 0;padding-top:20px;border-top:1px solid var(--fa-line)}
.fa-more a{display:inline-flex;align-items:center;gap:6px;color:var(--fa-violet);font-weight:700;text-decoration:none}
.fa-more a:hover{text-decoration:underline}
.fa-noscript{margin:16px 0 0;padding-left:20px;line-height:1.8}

.fa-empty{display:grid;justify-items:center;gap:12px;width:min(620px,calc(100% - 40px));margin:56px auto 72px;padding:44px 28px;border-radius:24px;text-align:center;color:#fff;
  background:radial-gradient(500px 260px at 20% 0,color-mix(in srgb,var(--fa-gold) 33%,transparent),transparent 60%),linear-gradient(135deg,var(--fa-primary),var(--fa-violet))}
.fa-empty-icon{display:grid;place-items:center;width:64px;height:64px;border-radius:20px;background:#ffffff26;font-size:32px;color:var(--fa-gold-hi)}
.fa-empty h1{margin:0;font-size:clamp(26px,4vw,36px);font-weight:800;color:#fff}
.fa-empty p{margin:0;max-width:44ch;color:#ffffffd9;line-height:1.6}
.fa-empty .fa-actions{justify-content:center;margin-top:8px}
.fa-empty .fa-btn{border-color:#ffffff66;background:transparent;color:#fff}
.fa-empty .fa-btn--primary{background:#fff;color:var(--fa-deep)}

@media(max-width:767px){
.fa-wrap{padding:16px 0 40px}
.fa-thumb{flex-basis:148px}
.fa-thumb-copy{font-size:13px}
.fa-detail{flex-direction:column;align-items:stretch;gap:18px;padding-top:18px}
.fa-excerpt{font-size:16px}
.fa-actions .fa-btn{flex:1 1 auto}
}

@keyframes faKen{from{transform:scale(1.08)}to{transform:scale(1)}}
@keyframes faRise{from{opacity:0;transform:translateY(12px)}to{opacity:1;transform:none}}
@keyframes faPulse{0%{box-shadow:0 0 0 0 #ffffff80,0 18px 40px -12px #000}70%{box-shadow:0 0 0 18px #ffffff00,0 18px 40px -12px #000}100%{box-shadow:0 0 0 0 #ffffff00,0 18px 40px -12px #000}}

@media(prefers-reduced-motion:reduce){
.fab,.fab-shine,.fab-play,.fab-dot::after,.fa-dot::after,.fa-yt-play{animation:none}
.fab-shine{display:none}
.fab-title span,.fa-slide,.fa-slide.is-active{transition:none}
.fa-slide[data-kind=image].is-active img,.fa-caption.is-swap,.fa-detail.is-swap .fa-detail-copy{animation:none}
}

/* ============================== Related event card ==============================
   The calendar event an announcement is linked to: on the announcement page and under the player.
   After Mobbin's Meetup date/place card, Square's big-date event block and Apple's session row. */
.evc{--evc-ink:var(--fa-ink);--evc-muted:var(--fa-muted);position:relative;display:flex;align-items:center;gap:18px;margin:0 0 28px;padding:16px 18px;border:1px solid color-mix(in srgb,var(--fa-gold-hi) 65%,#fff);border-radius:18px;
  background:linear-gradient(120deg,color-mix(in srgb,var(--fa-gold-hi) 18%,#fff),#fff 60%);box-shadow:0 14px 34px -24px var(--fa-gold-ink);color:var(--evc-ink);transition:transform .2s,box-shadow .2s,border-color .2s}
.evc[hidden]{display:none}
.evc *{box-sizing:border-box}
.evc svg{width:1em;height:1em;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;flex:none}
.evc:hover{transform:translateY(-2px);border-color:var(--fa-gold);box-shadow:0 20px 40px -24px var(--fa-gold-ink)}
.evc-date{flex:none;display:grid;place-items:center;align-content:center;width:68px;height:68px;border-radius:16px;line-height:1;color:var(--fa-ink);background:linear-gradient(145deg,var(--fa-gold-hi),var(--fa-gold) 70%,color-mix(in srgb,var(--fa-gold) 70%,var(--fa-gold-ink)));box-shadow:inset 0 -2px 0 #0000001a}
.evc-date small{font-size:11px;font-weight:800;letter-spacing:.1em;text-transform:uppercase}
.evc-date b{margin-top:3px;font-size:28px;font-weight:800;letter-spacing:-.5px}
.evc--weekly .evc-date b{font-size:20px}
.evc-copy{flex:1;min-width:0;display:grid;gap:4px}
.evc-kicker{display:inline-flex;align-items:center;gap:6px;font-size:11.5px;font-weight:800;letter-spacing:.1em;text-transform:uppercase;color:var(--fa-gold-ink)}
.evc-title{font-size:19px;font-weight:800;line-height:1.25;color:var(--evc-ink)}
.evc-meta{display:flex;flex-wrap:wrap;gap:4px 16px;color:var(--evc-muted);font-size:14px;font-weight:600}
.evc-meta>span{display:inline-flex;align-items:center;gap:6px}
.evc-meta>span[hidden]{display:none}
.evc-meta svg{color:var(--fa-gold-ink)}
.evc-btn{flex:none;text-decoration:none}
.evc-btn::after{content:"";position:absolute;inset:0;border-radius:inherit}   /* the whole card opens the event */
.evc-btn-face{display:inline-flex;align-items:center;gap:8px;height:44px;padding:0 18px;border-radius:999px;background:var(--fa-ink);color:var(--fa-gold-hi);font-size:14px;font-weight:800;white-space:nowrap;transition:background .2s}
.evc-btn-face svg{width:16px;height:16px;transition:transform .2s}
.evc:hover .evc-btn-face{background:color-mix(in srgb,var(--fa-ink) 85%,#fff)}
.evc:hover .evc-btn-face svg{transform:translateX(3px)}
.evc:has(.evc-btn:focus-visible){outline:3px solid var(--fa-gold);outline-offset:3px}
.evc-btn:focus-visible{outline:none}
.evc.is-swap{animation:faRise .5s cubic-bezier(.2,.8,.2,1) both}
.fa-wrap .evc{margin:18px 0 0}
@media(max-width:640px){
.evc{flex-wrap:wrap;gap:14px;padding:14px}
.evc-date{width:56px;height:56px;border-radius:14px}.evc-date b{font-size:23px}
.evc-copy{flex:1 1 calc(100% - 72px)}
.evc-title{font-size:17px}
.evc-btn{flex:1 1 100%}.evc-btn-face{width:100%;justify-content:center}
}
@media(prefers-reduced-motion:reduce){.evc,.evc.is-swap{transition:none;animation:none}}

/* ============================== Video announcement hero ==============================
   /announcements/slug with a video: the player replaces the photo hero; title and summary sit below (post.php). */
.vh{padding:28px 20px 34px;background:radial-gradient(900px 420px at 12% -10%,color-mix(in srgb,var(--fa-violet) 30%,transparent),transparent 62%),radial-gradient(760px 420px at 100% 10%,color-mix(in srgb,var(--fa-gold) 18%,transparent),transparent 60%),linear-gradient(180deg,var(--fa-deep),var(--fa-primary))}
.vh *{box-sizing:border-box}
.vh-player{position:relative;width:100%;max-width:min(1100px,max(560px,calc((100svh - var(--mm-chrome,125px) - 120px) * 16 / 9)));aspect-ratio:16/9;margin:0 auto;border-radius:20px;overflow:hidden;background:var(--fa-deep);box-shadow:0 34px 80px -34px #000,0 0 0 1px #ffffff17}
.vh-player iframe,.vh-player video,.vh-poster{position:absolute;inset:0;width:100%;height:100%;border:0}
.vh-player video{background:#000}
.vh-poster{padding:0;background:var(--fa-deep);cursor:pointer}
.vh-poster img{width:100%;height:100%;object-fit:cover;transition:transform .6s ease,filter .3s}
.vh-poster::after{content:"";position:absolute;inset:0;background:radial-gradient(circle at 50% 50%,color-mix(in srgb,var(--fa-deep) 0%,transparent) 30%,color-mix(in srgb,var(--fa-deep) 60%,transparent) 100%)}
.vh-poster:hover img{transform:scale(1.03);filter:brightness(.85)}
.vh-play{position:absolute;left:50%;top:50%;z-index:1;display:flex;align-items:center;gap:10px;height:68px;padding:0 28px 0 22px;border-radius:34px;transform:translate(-50%,-50%);background:#fff;color:var(--fa-deep);font-size:17px;font-weight:800;box-shadow:0 0 0 0 #ffffff80,0 18px 40px -12px #000;animation:faPulse 2.4s infinite;transition:transform .2s}
.vh-play svg{width:26px;height:26px;fill:var(--fa-violet);stroke:none}
.vh-poster:hover .vh-play{transform:translate(-50%,-50%) scale(1.06)}
.vh-poster:focus-visible{outline:none}.vh-poster:focus-visible .vh-play{outline:3px solid var(--fa-gold-hi);outline-offset:4px}
.vh-noscript{position:absolute;left:50%;bottom:20px;transform:translateX(-50%);color:#fff}
.post--video{padding-top:clamp(2rem,4vw,3rem)}
.vh-head{margin:0 0 28px;padding-bottom:24px;border-bottom:1px solid var(--fa-line)}
.vh-kicker{display:inline-flex;align-items:center;gap:7px;padding:5px 12px;border-radius:999px;background:linear-gradient(90deg,var(--fa-violet),var(--fa-primary));color:#fff;font-size:12px;font-weight:800;letter-spacing:.08em;text-transform:uppercase}
.vh-kicker svg{width:15px;height:15px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.vh-title{margin:14px 0 0;font-size:clamp(2rem,4.6vw,3.25rem);font-weight:800;line-height:1.08;letter-spacing:-.02em;color:var(--fa-ink)}
.vh-sub{margin:14px 0 0;font-size:clamp(1.05rem,1.6vw,1.25rem);line-height:1.6;color:var(--fa-muted)}
@media(max-width:767px){
.vh{padding:0;background:var(--fa-deep)}
.vh-player{max-width:none;border-radius:0;box-shadow:none}
.vh-play{height:54px;padding:0 20px 0 16px;font-size:15px}
}
@media(prefers-reduced-motion:reduce){.vh-play{animation:none}.vh-poster img{transition:none}}

/* Player controls (pause, sound, full screen, arrows) appear only on hover, keyboard focus, or after a touch
   (.is-touched, assets/announcements.js), then fade away. Pause / play stays while the slideshow is paused. */
.fa-stage .fa-player .fa-ctrls,.fa-stage .fa-player .fa-nav{opacity:0;visibility:hidden}
.fa-stage .fa-player .fa-ctrls{transition:opacity .25s,visibility .25s}
.fa-stage .fa-player .fa-nav{transition:background .2s,transform .2s,opacity .25s,visibility .25s}
.fa-stage .fa-player:hover .fa-ctrls,.fa-stage .fa-player:hover .fa-nav,
.fa-stage .fa-player.is-touched .fa-ctrls,.fa-stage .fa-player.is-touched .fa-nav,
.fa-stage .fa-player:focus-visible .fa-ctrls,.fa-stage .fa-player:focus-visible .fa-nav,
.fa-stage .fa-player:has(:focus-visible) .fa-ctrls,.fa-stage .fa-player:has(:focus-visible) .fa-nav,
.fa-stage .fa-player.is-paused .fa-ctrls{opacity:1;visibility:visible}
@media(hover:none){.fa-stage .fa-player:hover:not(.is-touched):not(.is-paused) .fa-ctrls,.fa-stage .fa-player:hover:not(.is-touched) .fa-nav{opacity:0;visibility:hidden}}
