/* Trusty Consulting — motion layer (v1.16). Transform and opacity only; switched off for visitors who ask for reduced motion.
   Not loaded on the salary tax calculator pages. */

/* ---------- Scroll reveal (classes are added by anim.js, so nothing is hidden without JavaScript) ---------- */
html.anim-on .anim-r{opacity:0;transform:translateY(24px);transition:opacity .75s ease,transform .85s cubic-bezier(.2,.7,.2,1)}
html.anim-on .anim-r.in{opacity:1;transform:none}

/* ---------- Header: compact on scroll ---------- */
@media(min-width:981px){
  header .hbar,header .brand img{transition:height .35s ease}
  header.scrolled .hbar{height:76px}
  header.scrolled .brand img{height:60px}
  header.scrolled{box-shadow:0 16px 30px -18px rgba(0,0,0,.85)}
}

/* ---------- Reading progress (articles) ---------- */
.tprog{position:fixed;left:0;top:0;height:3px;width:100%;background:var(--gold-grad);transform-origin:left;transform:scaleX(0);z-index:300;pointer-events:none}

@media(prefers-reduced-motion:no-preference){
  /* ---------- Hero entrance ---------- */
  @keyframes aUp{from{opacity:0;transform:translateY(26px)}to{opacity:1;transform:none}}
  @keyframes aPop{0%{opacity:0;transform:scale(.55)}70%{transform:scale(1.1)}100%{opacity:1;transform:none}}
  @keyframes aLine{from{width:0}to{width:26px}}
  @keyframes aKb{from{transform:scale(1)}to{transform:scale(1.07)}}
  @keyframes aShine{from{left:-70%}to{left:130%}}
  @keyframes aDraw{to{stroke-dashoffset:0}}
  @keyframes aPulse{0%{transform:scale(.45);opacity:.9}100%{transform:scale(2.7);opacity:0}}

  .hero.hero-img .hero-copy>*,.bo-hero-in>*,.ins-hero .wrap>*,.detail-hero .dh-in>*,.detail-hero .dh,.post-hero .ph-in>*,.cr-hero .bo-hero-in>*{animation:aUp .85s cubic-bezier(.2,.7,.2,1) both}
  .hero.hero-img .hero-copy>*:nth-child(1),.bo-hero-in>*:nth-child(1),.ins-hero .wrap>*:nth-child(1),.detail-hero .dh-in>*:nth-child(1),.post-hero .ph-in>*:nth-child(1){animation-delay:.05s}
  .hero.hero-img .hero-copy>*:nth-child(2),.bo-hero-in>*:nth-child(2),.ins-hero .wrap>*:nth-child(2),.detail-hero .dh-in>*:nth-child(2),.post-hero .ph-in>*:nth-child(2){animation-delay:.16s}
  .hero.hero-img .hero-copy>*:nth-child(3),.bo-hero-in>*:nth-child(3),.ins-hero .wrap>*:nth-child(3),.detail-hero .dh-in>*:nth-child(3),.post-hero .ph-in>*:nth-child(3){animation-delay:.27s}
  .hero.hero-img .hero-copy>*:nth-child(4),.bo-hero-in>*:nth-child(4),.ins-hero .wrap>*:nth-child(4),.detail-hero .dh-in>*:nth-child(4),.post-hero .ph-in>*:nth-child(4){animation-delay:.38s}
  .hero.hero-img .hero-copy>*:nth-child(n+5),.bo-hero-in>*:nth-child(n+5),.ins-hero .wrap>*:nth-child(n+5),.post-hero .ph-in>*:nth-child(n+5){animation-delay:.48s}
  .bo-tiles li{animation:aUp .8s cubic-bezier(.2,.7,.2,1) both}
  .bo-tiles li:nth-child(1){animation-delay:.55s}.bo-tiles li:nth-child(2){animation-delay:.65s}.bo-tiles li:nth-child(3){animation-delay:.75s}
  .bo-flag{animation:aPop .7s cubic-bezier(.2,.7,.2,1) .2s both}
  .hero .eyebrow::before,.detail-hero .eyebrow::before,.ins-hero .eyebrow::before,.bo-hero .eyebrow::before{animation:aLine .9s ease .3s both}
  .bo-flagstrip a{animation:aPop .55s cubic-bezier(.2,.7,.2,1) both;animation-delay:calc(var(--i,0) * 45ms + .7s)}

  /* Slow, subtle zoom on the country photos */
  .bo-hero .bo-img{animation:aKb 26s ease-in-out infinite alternate;transform-origin:80% 45%;will-change:transform}

  /* ---------- Buttons: gold shine ---------- */
  .btn-gold{position:relative;overflow:hidden}
  .btn-gold::after{content:"";position:absolute;top:0;left:-70%;width:45%;height:100%;background:linear-gradient(100deg,transparent,rgba(255,255,255,.55),transparent);transform:skewX(-20deg);pointer-events:none}
  .btn-gold:hover::after{animation:aShine .9s ease}
  .bo-act .btn-gold::after,.hero-actions .btn-gold::after{animation:aShine 1.3s ease 2.1s 1}

  /* ---------- Network map ---------- */
  html.anim-on .nm-arc{stroke-dashoffset:1}
  html.anim-on .nm-pin{opacity:0;transition:opacity .6s ease}
  html.anim-on .netmap.in .nm-arc{animation:aDraw 1.7s ease forwards;animation-delay:calc(var(--i,0) * .09s + .25s)}
  html.anim-on .netmap.in .nm-pin{opacity:1;transition-delay:calc(var(--i,0) * .09s + .95s)}
  .nm-ring{fill:none;stroke:#E3BC4B;stroke-width:1.1;transform-box:fill-box;transform-origin:center;animation:aPulse 2.8s ease-out infinite}
  .nm-pin:nth-child(3n) .nm-ring{animation-delay:.9s}.nm-pin:nth-child(3n+1) .nm-ring{animation-delay:1.7s}
}

/* ---------- Network map (static look, always) ---------- */
.nm-sec{background:radial-gradient(90% 120% at 50% 0%,#0F2B5E 0%,#04183F 55%,#020F2C 100%);color:#fff;position:relative;overflow:hidden}
.nm-sec::before{content:"";position:absolute;left:0;right:0;top:0;height:2px;background:var(--gold-grad)}
.nm-card{background:linear-gradient(160deg,#0B2250,#04183F 55%,#020F2C);border-radius:12px;padding:38px 30px 34px;margin:6px 0 46px;color:#fff;position:relative;overflow:hidden;box-shadow:var(--shadow)}
.nm-card::before{content:"";position:absolute;left:30px;right:30px;top:0;height:2px;background:var(--gold-grad)}
.nm-head{text-align:center;max-width:46em;margin:0 auto 12px}
.nm-head h2{color:#fff;font-size:38px;margin:14px 0 12px}.nm-card .nm-head h2{font-size:30px}
.nm-head p{color:var(--on-dark);font-size:16.5px;margin:0 auto}
.netmap{position:relative;max-width:1100px;margin:6px auto 0;aspect-ratio:1000/383}
.nm-base,.nm-svg{position:absolute;inset:0;width:100%;height:100%;display:block}
.nm-base{opacity:.5}
.nm-svg{overflow:visible}
.nm-arc{fill:none;stroke:#E3BC4B;stroke-opacity:.55;stroke-width:1.1;stroke-dasharray:1;stroke-dashoffset:0}
.nm-run{fill:#FFF4CC}
.nm-pin{cursor:pointer}
.nm-dot{fill:#fff;stroke:#E3BC4B;stroke-width:1.2}
.nm-odot{fill:#E3BC4B;stroke:#fff;stroke-width:1.5}
.nm-lbl{font-family:var(--font);font-size:11.5px;font-weight:600;fill:#fff;paint-order:stroke;stroke:#04183F;stroke-width:3.2px;stroke-linejoin:round;opacity:0;pointer-events:none;transition:opacity .2s}
.nm-pin:hover .nm-lbl,.nm-pin:focus .nm-lbl,.nm-pin:focus-visible .nm-lbl{opacity:1}
.nm-pin:hover .nm-dot{fill:#E3BC4B}
.nm-origin .nm-lbl{opacity:1;font-size:12.5px;fill:#EFCF68}
.nm-cta{text-align:center;margin-top:20px}
@media(max-width:700px){.nm-head h2{font-size:28px}.nm-card .nm-head h2{font-size:24px}.nm-card{padding:28px 16px 26px}.nm-origin .nm-lbl{font-size:16px}.nm-lbl{display:none}.nm-origin .nm-lbl{display:block}}