/* DEFUXA editorial motion — nonessential, lightweight, respects reduced-motion. */
/* Smoother crossfade after JS initialises; slides remain paintable so the transition is visible. */
.dfx-spotlight--enhanced .dfx-spotlight__slide,
.dfx-spotlight--enhanced .dfx-spotlight__slide[hidden] {
  display:block!important;
  opacity:0;
  visibility:hidden;
  z-index:1;
  pointer-events:none;
  transform:scale(1.008);
  transition:opacity .42s ease, transform .42s ease, visibility 0s linear .42s;
}
.dfx-spotlight--enhanced .dfx-spotlight__slide.is-active,
.dfx-spotlight--enhanced .dfx-spotlight__slide.is-leaving {
  visibility:visible;
}
.dfx-spotlight--enhanced .dfx-spotlight__slide.is-active {
  opacity:1;
  z-index:3;
  pointer-events:auto;
  transform:scale(1);
  transition-delay:0s;
}
.dfx-spotlight--enhanced .dfx-spotlight__slide.is-leaving {
  opacity:0;
  z-index:2;
  pointer-events:none;
  transform:scale(1.01);
}
.dfx-spotlight__image {transition:transform .42s cubic-bezier(.22,.61,.36,1)}
@media (hover:hover) and (pointer:fine) {
  .dfx-spotlight__story:hover .dfx-spotlight__image {transform:scale(1.02)}
  .story-card {transition:transform .32s cubic-bezier(.22,.61,.36,1), box-shadow .32s ease}
  .story-card-art {overflow:hidden}
  .story-card-art > img {transition:transform .52s cubic-bezier(.22,.61,.36,1),filter .52s ease;transform-origin:center center}
  .story-card:is(:hover,:focus-within) {transform:translateY(-3px)}
  .story-card:is(:hover,:focus-within) .story-card-art > img {transform:scale(1.03);filter:brightness(1.035)}
  .dfx-discovery-story__img {transition:transform .46s cubic-bezier(.22,.61,.36,1)}
  .dfx-discovery-story:is(:hover,:focus-within) .dfx-discovery-story__img {transform:scale(1.03)}
  .dfx-lead-layout .rail-story {transition:transform .28s ease}
  .dfx-lead-layout .rail-story:is(:hover,:focus-within) {transform:translateX(2px)}
  .dfx-rail-module__thumb {overflow:hidden}
  .dfx-rail-module__thumb img {transition:transform .42s ease}
  .dfx-rail-module__item:is(:hover,:focus-within) .dfx-rail-module__thumb img {transform:scale(1.03)}
}
/* Quiet, custom globe next to GLOBAL NEWS. */
.masthead .wordmark {align-items:center; gap:11px}
.masthead .wordmark b {
  display:inline-flex;
  align-items:center;
  line-height:1;
}
.masthead .wordmark .dfx-brand-globe {
  display:inline-flex;
  flex:0 0 auto;
  align-self:center;
  align-items:center;
  justify-content:center;
  width:31px;
  height:31px;
  margin-left:2px;
  transform:translateY(1px);
  color:inherit;
}
.masthead .wordmark .dfx-brand-globe svg {display:block;width:100%;height:100%;overflow:visible}
.dfx-brand-globe__outline {fill:none;stroke:currentColor;stroke-width:1.65}
.dfx-brand-globe__sphere {fill:none;stroke:currentColor;stroke-width:1.3;stroke-linecap:round;transform-origin:24px 24px;animation:dfx-editorial-globe 28s linear infinite}
.dfx-brand-globe__signal {fill:none;stroke:#bd243b;stroke-width:2.2;stroke-linecap:round;opacity:.9}
.dfx-brand-globe__signal--inner {stroke-width:1.5;opacity:.65}
@keyframes dfx-editorial-globe {to{transform:rotate(360deg)}}
@media(max-width:640px){.masthead .wordmark .dfx-brand-globe{width:24px;height:24px;margin-left:1px;transform:none}}
@media(max-width:380px){.masthead .wordmark .dfx-brand-globe{width:21px;height:21px}}
@media(prefers-reduced-motion:reduce){
 .dfx-spotlight--enhanced .dfx-spotlight__slide,
 .dfx-spotlight--enhanced .dfx-spotlight__slide[hidden] {transition:none!important;transform:none!important}
 .dfx-spotlight__image,.story-card,.story-card-art>img,
 .dfx-discovery-story__img,.dfx-lead-layout .rail-story,
 .dfx-rail-module__thumb img {transition:none!important;transform:none!important;filter:none!important}
 .dfx-brand-globe__sphere {animation:none!important}
}

/* DEFUXA header polish: visually group theme toggle and Search as one control cluster.
   Keep the editorial tagline separate, avoid spacing hacks and preserve mobile layout. */
.masthead .masthead-right {gap:26px}
.masthead .dfx-masthead-actions {
  display:flex;
  align-items:center;
  justify-content:flex-end;
  gap:14px;
  flex:0 0 auto;
}
.masthead .dfx-masthead-actions .search-launch {
  min-height:42px;
  padding:0 13px;
  gap:8px;
  white-space:nowrap;
}
.masthead .dfx-masthead-actions .search-launch .ui-icon {width:17px;height:17px}
@media(max-width:900px) {
  .masthead .masthead-right {gap:12px}
  .masthead .dfx-masthead-actions {gap:10px}
}
@media(max-width:680px) {
  .masthead .dfx-masthead-actions {gap:7px}
  .masthead .dfx-masthead-actions .search-launch {min-height:40px;padding:0 10px}
}
@media(max-width:350px) {
  .masthead .dfx-masthead-actions {gap:5px}
  .masthead .dfx-masthead-actions .search-launch {padding:0}
}

/* V12.70 — prevent brand globe overlapping the light/dark-mode button on phones.
   This is purely a masthead layout correction. No site data or images are touched. */
@media (max-width:430px) {
  .masthead {column-gap:10px}
  .masthead .wordmark {
    flex:0 1 auto;
    min-width:0;
    gap:5px;
    font-size:clamp(21px,6.2vw,24px);
    letter-spacing:-.075em;
  }
  .masthead .wordmark b {
    font-size:.43em;
    width:clamp(49px,13.5vw,60px);
    padding-left:5px;
    line-height:1.12;
  }
  .masthead .wordmark .dfx-brand-globe {
    width:18px;
    height:18px;
    margin-left:0;
    transform:none;
  }
  .masthead .masthead-right {margin-left:auto;flex:0 0 auto}
  .masthead .dfx-masthead-actions {gap:5px}
  .masthead .dfx-theme-trigger,
  .masthead .mobile-menu,
  .masthead .search-launch {
    width:38px;
    min-width:38px;
    min-height:38px;
    padding:0;
  }
}
