/* Merriweather Holdings — polish layer (additive, on-theme, safe to remove).
   Extends the existing reveal/card system; no structural changes. */

/* smooth, anchored scrolling that clears the fixed nav */
html{scroll-behavior:smooth}
section,header.hero{scroll-margin-top:78px}

/* ── scroll-progress bar (CSS scroll-driven; degrades to hidden if unsupported) ── */
.scroll-prog{position:fixed;top:0;left:0;height:2px;width:100%;transform:scaleX(0);transform-origin:0 50%;
  background:linear-gradient(90deg,var(--accent),#c026d3 55%,#a855f7);
  box-shadow:0 0 14px -2px rgba(192,38,211,.65);z-index:400;pointer-events:none}
@supports (animation-timeline: scroll()){
  .scroll-prog{animation:sp-grow linear both;animation-timeline:scroll(root)}
  @keyframes sp-grow{to{transform:scaleX(1)}}
}
@supports not (animation-timeline: scroll()){ .scroll-prog{display:none} }

/* ── richer reveal choreography: blur-in + premium easing + more stagger steps ── */
.reveal{transition:opacity .8s cubic-bezier(.16,1,.3,1),transform .8s cubic-bezier(.16,1,.3,1),filter .8s cubic-bezier(.16,1,.3,1);filter:blur(7px)}
.reveal.in{filter:blur(0)}
.reveal.d4{transition-delay:.32s}.reveal.d5{transition-delay:.40s}.reveal.d6{transition-delay:.48s}

/* ── card accent that ties the site to the capability-briefing cards ── */
.card::after{content:"";position:absolute;left:0;top:0;height:2px;width:100%;
  background:linear-gradient(100deg,var(--accent),#c026d3 55%,#a855f7);opacity:.7;
  transition:opacity .25s,height .25s;z-index:2}
.card:hover::after{opacity:1;height:3px}
.card:hover{box-shadow:0 26px 70px -32px rgba(192,38,211,.35),0 24px 60px -30px rgba(0,0,0,.8)}

/* ── glass nav once scrolled ── */
nav.scrolled{background:rgba(7,10,15,.72);backdrop-filter:blur(14px) saturate(1.3);-webkit-backdrop-filter:blur(14px) saturate(1.3);border-bottom-color:var(--line)}

/* ── slow gradient shimmer on the hero keyword (subtle flex) ── */
h1 .hl{background:linear-gradient(100deg,#ff6b7f,#e879f9 38%,#c4b5fd 52%,#e879f9 66%,#ff6b7f);
  background-size:220% auto;-webkit-background-clip:text;background-clip:text;color:transparent;
  filter:drop-shadow(0 1px 2px rgba(0,0,0,.9)) drop-shadow(0 0 13px rgba(168,85,247,.35));
  animation:hl-shimmer 9s linear infinite}
@keyframes hl-shimmer{to{background-position:220% center}}

/* ── section eyebrow: tiny live accent dot before the label ── */
.sectlabel .eyebrow::before,section > .wrap > .reveal > .eyebrow:first-child::before{}

/* ── nav: raise burger breakpoint so inline links never overflow (overflowed at 881) ── */
@media(max-width:1050px){
  .navlinks{position:fixed;inset:64px 0 auto 0;flex-direction:column;background:var(--bg);
    border-bottom:1px solid var(--line);padding:24px;gap:20px;transform:translateY(-120%);transition:.3s;
    z-index:300;box-shadow:0 24px 48px -12px rgba(0,0,0,.8)}
  .navlinks.open{transform:none}
  .burger{display:block;position:relative;z-index:301}
}
@media(min-width:1051px){ nav .navin{gap:20px} .navlinks{margin-left:auto} }

/* hero layout reverted to the original site.css behavior (globe backdrop, feed top-right) */
.globe-hint{opacity:.55}

/* reduced-motion: strip the extra motion we added */
@media(prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  .reveal{filter:none}
  .scroll-prog{display:none}
  h1 .hl{animation:none}
}