/* MS Group Overseas Consultants — restrained premium motion layer */

:root {
  --ease-out: cubic-bezier(.16, 1, .3, 1);
  --ease-soft: cubic-bezier(.22, .8, .22, 1);
  --ease-spring: cubic-bezier(.2, 1.25, .32, 1);
  --motion-fast: 220ms;
  --motion-base: 460ms;
  --motion-slow: 820ms;
}

/* Universal interaction polish */
.button,
.nav-cta,
.journey-link,
.sector-display__footer button,
.leader-message,
.contact-choice__card,
.opportunity-item > button,
.message-tab,
.sector-tab,
.process-step,
.region-button,
.floating-contact__main,
.nav-drawer-actions button,
.process-screen__controls button,
.turnstile-retry,
.menu-toggle,
.floating-contact__item,
.text-link,
.hero-trust__item,
.principle-card,
.leader-card,
.deployment-card,
.why-card,
.contact-detail,
.nav-links a {
  transition:
    transform var(--motion-base) var(--ease-out),
    opacity var(--motion-base) var(--ease-out),
    color var(--motion-fast) ease,
    background-position var(--motion-base) var(--ease-out),
    background-color var(--motion-fast) ease,
    border-color var(--motion-fast) ease,
    box-shadow var(--motion-base) var(--ease-out),
    filter var(--motion-base) var(--ease-out);
}

.button svg,
.nav-cta svg,
.journey-link svg,
.sector-display__footer button svg,
.leader-message svg,
.text-link svg,
.opportunity-item > button svg,
.contact-choice__card > svg {
  transition: transform var(--motion-base) var(--ease-out);
}

/* Unified button sweep: a clean diagonal reveal across every real button. */
:is(button:not([disabled]), .footer-action__contacts > a) {
  position: relative;
  isolation: isolate;
  overflow: hidden;
  transition:
    transform 420ms var(--ease-out),
    color 260ms ease,
    background-color 260ms ease,
    background-position 420ms var(--ease-out),
    border-color 260ms ease,
    box-shadow 420ms var(--ease-out),
    filter 420ms var(--ease-out);
}

:is(button:not([disabled]), .footer-action__contacts > a)::before {
  content: "";
  position: absolute;
  z-index: 0;
  inset: -2px auto -2px -18%;
  width: 138%;
  background: linear-gradient(110deg, #031b35 0%, #0752a2 43%, #1682e8 72%, #5ac8fa 112%);
  transform: translate3d(-108%, 0, 0) skewX(-18deg);
  transform-origin: left center;
  transition: transform 520ms cubic-bezier(.3, 1, .8, 1);
  pointer-events: none;
}

:is(button:not([disabled]), .footer-action__contacts > a) > * {
  position: relative;
  z-index: 1;
}

:is(button:not([disabled]), .footer-action__contacts > a) > svg { transition: transform 420ms var(--ease-out); }

@media (hover: hover) and (pointer: fine) {
  .button:not([disabled]):hover,
  .nav-cta:hover,
  .journey-link:hover,
  .sector-display__footer button:hover {
    transform: translateY(-3px);
    color: #fff;
    background-image: var(--gradient-primary-hover);
    background-position: 100% 50%;
    box-shadow: 0 20px 44px rgba(7, 82, 162, .25);
  }
  .nav-drawer-actions button:hover {
    color: #fff;
    background: var(--gradient-primary-hover);
    transform: translateY(-2px);
    box-shadow: 0 16px 34px rgba(7,82,162,.24);
  }
  .button--ghost:hover,
  .journey-card--employer .journey-link:hover,
  .deployment-card--cta .button:hover,
  .message-letter .button:hover,
  .opportunities-intro .button:hover {
    color: #fff;
    -webkit-text-fill-color: #fff;
    border-color: rgba(255,255,255,.42);
    background: var(--gradient-primary-hover);
    box-shadow: 0 18px 38px rgba(6, 43, 82, .20);
  }
  .button:hover svg,
  .nav-cta:hover svg,
  .journey-link:hover svg,
  .sector-display__footer button:hover svg,
  .leader-message:hover svg,
  .text-link:hover svg,
  .opportunity-item > button:hover svg,
  .contact-choice__card:hover > svg { transform: translateX(4px); }
  .hero-trust__item:hover { transform: translateY(-4px); }
  .principle-card:not(.principle-card--accent):hover { padding-left: 18px; }
  .leader-card:hover,
  .deployment-card:hover { transform: translateY(-8px); box-shadow: 0 32px 80px rgba(6, 43, 82, .13); }
  .why-card:hover { background: var(--paper-2); }
  .contact-choice__card:hover,
  .contact-detail:hover { background: linear-gradient(135deg, rgba(10,102,199,.34), rgba(7,82,162,.30)); }
  .opportunity-item:hover { transform: translateX(8px); }
  .opportunity-item > button:hover {
    color: #fff;
    background: var(--gradient-primary-hover);
    transform: rotate(-8deg) scale(1.06);
  }
  .process-screen__controls button:hover,
  .floating-contact__main:hover,
  .menu-toggle:hover,
  .turnstile-retry:hover {
    color: #fff;
    background: var(--gradient-primary-hover);
    filter: saturate(1.08) brightness(1.04);
  }
  .message-tab.is-active:hover,
  .region-button.is-active:hover,
  .sector-tab.is-active:hover { background: var(--gradient-primary-hover); }
  .sector-tab:hover:not(.is-active),
  .process-step:hover:not(.is-active) { color: var(--ink); background: #fff; }

  :is(button:not([disabled]), .footer-action__contacts > a):is(:hover, :focus-visible) {
    color: #fff;
    -webkit-text-fill-color: #fff;
    border-color: rgba(143, 217, 255, .42);
    box-shadow: 0 17px 38px rgba(3, 37, 74, .22);
  }

  :is(button:not([disabled]), .footer-action__contacts > a):is(:hover, :focus-visible)::before {
    transform: translate3d(-8%, 0, 0) skewX(-8deg);
  }

  :is(button:not([disabled]), .footer-action__contacts > a):is(:hover, :focus-visible) > svg { transform: translateX(4px); }

  .button--ghost:hover { background: rgba(255,255,255,.86); }
  .journey-card--employer .journey-link:hover,
  .deployment-card--cta .button:hover { background: #fff; }
  .message-letter .button:hover,
  .opportunities-intro .button:hover,
  .leader-message:hover { background: transparent; }
  .contact-choice__card:hover { background: var(--gradient-soft); }
  .footer-action__contacts > a:hover,
  .footer-contact-action:hover { background: rgba(2,21,37,.20); }
}

.button:active,
.nav-cta:active,
.journey-link:active,
.sector-display__footer button:active,
.opportunity-item > button:active,
.contact-choice__card:active { transform: translateY(1px) scale(.985); }
:is(button:not([disabled]), .footer-action__contacts > a):active { transform: scale(.96); }

/* Hero load choreography */
.motion-ready .hero .eyebrow,
.motion-ready .hero-title-line__inner,
.motion-ready .hero-description,
.motion-ready .hero-actions,
.motion-ready .hero-trust,
.motion-ready .hero-visual,
.motion-ready .hero-bottom {
  opacity: 0;
  will-change: transform, opacity, filter;
}

.motion-ready .hero .eyebrow { transform: translateY(18px); }
.motion-ready .hero-title-line { overflow: clip; padding-bottom: .16em; }
.motion-ready .hero-title-line__inner { transform: translateY(110%); }
.motion-ready .hero-description,
.motion-ready .hero-actions,
.motion-ready .hero-trust { transform: translateY(24px); }
.motion-ready .hero-visual { transform: translate3d(48px, 16px, 0) scale(.96); filter: blur(8px); }
.motion-ready .hero-bottom { transform: translateY(18px); }

.motion-ready .hero.is-motion-inview .eyebrow,
.motion-ready .hero.is-motion-inview .hero-title-line__inner,
.motion-ready .hero.is-motion-inview .hero-description,
.motion-ready .hero.is-motion-inview .hero-actions,
.motion-ready .hero.is-motion-inview .hero-trust,
.motion-ready .hero.is-motion-inview .hero-visual,
.motion-ready .hero.is-motion-inview .hero-bottom {
  opacity: 1;
  transform: none;
  filter: none;
  transition-property: opacity, transform, filter;
  transition-duration: 760ms;
  transition-timing-function: var(--ease-out);
}
.motion-ready .hero.is-motion-inview .eyebrow { transition-delay: 60ms; }
.motion-ready .hero.is-motion-inview .hero-title-line:nth-of-type(1) .hero-title-line__inner { transition-delay: 120ms; }
.motion-ready .hero.is-motion-inview .gradient-text .hero-title-line__inner { transition-delay: 210ms; }
.motion-ready .hero.is-motion-inview .hero-description { transition-delay: 310ms; }
.motion-ready .hero.is-motion-inview .hero-actions { transition-delay: 390ms; }
.motion-ready .hero.is-motion-inview .hero-trust { transition-delay: 480ms; }
.motion-ready .hero.is-motion-inview .hero-visual { transition-delay: 210ms; transition-duration: 980ms; }
.motion-ready .hero.is-motion-inview .hero-bottom { transition-delay: 600ms; }

/* Ambient hero details */
@keyframes globeFloat {
  0%, 100% { transform: translate3d(0, -5px, 0) rotate(-.4deg); }
  50% { transform: translate3d(0, 7px, 0) rotate(.5deg); }
}
@keyframes orbitalTurn {
  to { transform: rotate(385deg); }
}
@keyframes orbitalTurnReverse {
  to { transform: rotate(-393deg); }
}
@keyframes routeFlow {
  to { stroke-dashoffset: -112; }
}
@keyframes stripFlow {
  to { transform: translateX(-50%); }
}
@keyframes footerBeamDrift {
  0%, 100% { translate: -2% 0; opacity: .62; }
  50% { translate: 4% -10px; opacity: 1; }
}
@keyframes footerWordmarkDrift {
  0%, 100% { translate: -1.5% 0; }
  50% { translate: 1.5% -5px; }
}
@keyframes footerScan {
  from { translate: 0 0; }
  to { translate: 620% 0; }
}

.motion-ready .hero-globe-image { animation: globeFloat 8s ease-in-out infinite; }
.motion-ready .globe-orbital-line--one { animation: orbitalTurn 28s linear infinite; }
.motion-ready .globe-orbital-line--two { animation: orbitalTurnReverse 34s linear infinite; }
.motion-ready .network-route { animation: routeFlow 9s linear infinite; }
.motion-ready .country-list[data-marquee="true"] { animation: stripFlow 34s linear infinite; }
.country-strip:hover .country-list[data-marquee="true"] { animation-play-state: paused; }
.motion-ready .footer-canvas__beam--one { animation: footerBeamDrift 13s ease-in-out infinite; }
.motion-ready .footer-canvas__beam--two { animation: footerBeamDrift 17s ease-in-out -6s infinite reverse; }
.motion-ready .footer-canvas__wordmark { animation: footerWordmarkDrift 18s ease-in-out infinite; }
.motion-ready .footer-ticker::after { animation: footerScan 11s linear infinite; }

/* Scroll reveals */
.motion-ready [data-reveal] {
  opacity: 0;
  filter: blur(3px);
  transform: translate3d(0, 28px, 0);
  transition:
    opacity 760ms var(--ease-out),
    transform 820ms var(--ease-out),
    filter 760ms var(--ease-out);
  transition-delay: var(--reveal-delay, 0ms);
  will-change: opacity, transform, filter;
}
.motion-ready [data-reveal="left"] { transform: translate3d(-30px, 0, 0); }
.motion-ready [data-reveal="right"] { transform: translate3d(30px, 0, 0); }
.motion-ready [data-reveal="scale"] { transform: scale(.98); }
.motion-ready [data-reveal].is-motion-visible {
  opacity: 1;
  filter: none;
  transform: none;
}

/* Staggered list entries */
.motion-ready .opportunity-item.is-motion-visible,
.motion-ready .why-card.is-motion-visible,
.motion-ready .process-step.is-motion-visible,
.motion-ready .sector-tab.is-motion-visible { transition-delay: var(--reveal-delay, 0ms); }

/* Interactive globe depth; values are assigned by motion.js */
.globe-stage { transform-style: preserve-3d; }
.globe-visual-shell {
  transform: translate3d(var(--globe-x, 0px), var(--globe-y, 0px), 0) rotateX(var(--globe-rx, 0deg)) rotateY(var(--globe-ry, 0deg));
  transition: transform 900ms var(--ease-out);
}
.hero-visual.is-interacting .globe-visual-shell { transition-duration: 150ms; }
.float-card { transform: translate3d(var(--card-x, 0px), var(--card-y, 0px), 0); }
.float-card--one { --depth: -.55; }
.float-card--two { --depth: .7; }
.float-card--three { --depth: -.8; }


/* Reference-inspired quiet ambient details */
@keyframes journeyOrbit {
  to { transform: rotate(360deg); }
}
@keyframes journeyOrbitReverse {
  to { transform: rotate(-360deg); }
}
@keyframes processOrbit {
  to { transform: rotate(360deg); }
}
@keyframes processIconFloat {
  0%, 100% { transform: translateY(-3px) rotate(-1deg); }
  50% { transform: translateY(4px) rotate(1deg); }
}
@keyframes deploymentHalo {
  to { transform: rotate(360deg); }
}
.motion-ready .journey-card__orb { animation: journeyOrbit 15s linear infinite; }
.motion-ready .journey-card--candidate .journey-card__orb { animation-name: journeyOrbitReverse; animation-duration: 18s; }
.motion-ready .process-radar { animation: processOrbit 19s linear infinite; }
.motion-ready #processIcon { animation: processIconFloat 5.2s ease-in-out infinite; }
.motion-ready .deployment-card__visual::after { animation: deploymentHalo 24s linear infinite; }

.process-screen.is-motion-swapping .process-screen__number { animation: processNumberIn 520ms var(--ease-out) both; }
.process-screen.is-motion-swapping #processIcon { animation: processIconIn 560ms var(--ease-spring) both; }
.process-screen.is-motion-swapping .process-screen__copy > * { animation: processCopyIn 520ms var(--ease-out) both; }
.process-screen.is-motion-swapping .process-screen__copy > *:nth-child(2) { animation-delay: 45ms; }
.process-screen.is-motion-swapping .process-screen__copy > *:nth-child(3) { animation-delay: 90ms; }
@keyframes processNumberIn { from { opacity: 0; transform: translateX(-15%) scale(.92); } to { opacity: 1; transform: translateX(-8%) scale(1); } }
@keyframes processIconIn { from { opacity: 0; transform: translateY(16px) scale(.72) rotate(-12deg); } to { opacity: 1; transform: translateY(-3px) scale(1) rotate(-1deg); } }
@keyframes processCopyIn { from { opacity: 0; transform: translateY(13px); } to { opacity: 1; transform: none; } }

/* Tab/panel state feedback */
.sector-display.is-motion-swapping,
.message-letter.is-motion-swapping,
.region-country-list.is-motion-swapping { animation: panelSwap 420ms var(--ease-out) both; }
@keyframes panelSwap {
  0% { opacity: .35; transform: translateY(10px); filter: blur(3px); }
  100% { opacity: 1; transform: none; filter: none; }
}
.process.is-process-pulsing .process-radar { animation: radarPulse 700ms var(--ease-out); }
@keyframes radarPulse {
  0% { opacity: .2; transform: scale(.82); }
  100% { opacity: 1; transform: scale(1); }
}

/* Modal */
.inquiry-modal.is-open .modal-backdrop { animation: backdropIn 260ms ease both; }
.inquiry-modal.is-open .modal-panel { animation: modalIn 520ms var(--ease-spring) both; }
.inquiry-modal.is-closing .modal-backdrop { animation: backdropOut 240ms ease both; }
.inquiry-modal.is-closing .modal-panel { animation: modalOut 240ms ease both; }
@keyframes backdropIn { from { opacity: 0; } }
@keyframes backdropOut { to { opacity: 0; } }
@keyframes modalIn { from { opacity: 0; transform: translateY(28px) scale(.97); } }
@keyframes modalOut { to { opacity: 0; transform: translateY(18px) scale(.98); } }

@media (max-width: 960px) {
  .motion-ready .hero-visual { transform: translateY(30px) scale(.98); }
  .motion-ready [data-reveal="left"],
  .motion-ready [data-reveal="right"] { transform: translate3d(0, 34px, 0); }
}

@media (max-width: 720px) {
  .motion-ready .hero-globe-image { animation-duration: 10s; }
  .motion-ready .country-list[data-marquee="true"] { animation-duration: 28s; }
}

@media (prefers-reduced-motion: reduce) {
  .motion-ready .hero .eyebrow,
  .motion-ready .hero-title-line__inner,
  .motion-ready .hero-description,
  .motion-ready .hero-actions,
  .motion-ready .hero-trust,
  .motion-ready .hero-visual,
  .motion-ready .hero-bottom,
  .motion-ready [data-reveal] {
    opacity: 1;
    filter: none;
    transform: none;
    transition: none;
  }
  .motion-ready .hero-globe-image,
  .motion-ready .globe-orbital-line,
  .motion-ready .network-route,
  .motion-ready .country-list[data-marquee="true"] { animation: none; }
}


/* Minimal animated edge treatment for selected large cards.
   The dual journey cards intentionally do not use this class. */
@property --border-trace-angle {
  syntax: "<angle>";
  inherits: false;
  initial-value: 0deg;
}

.border-motion-card {
  --border-trace-a: rgba(10, 102, 199, .10);
  --border-trace-b: rgba(34, 169, 237, .80);
  --border-trace-c: rgba(202, 160, 68, .54);
  position: relative;
  isolation: isolate;
}

.border-motion-card::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 8;
  padding: 1px;
  border-radius: inherit;
  pointer-events: none;
  opacity: .58;
  background: conic-gradient(
    from var(--border-trace-angle),
    transparent 0deg 238deg,
    var(--border-trace-a) 266deg,
    var(--border-trace-b) 302deg,
    var(--border-trace-c) 322deg,
    transparent 350deg 360deg
  );
  -webkit-mask: linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0);
  -webkit-mask-composite: xor;
  mask-composite: exclude;
}

:is(
  .principle-card--accent,
  .leader-card--blue,
  .message-letter,
  .deployment-card--cta,
  .political-map-frame,
  .contact-details
).border-motion-card {
  --border-trace-a: rgba(255, 255, 255, .10);
  --border-trace-b: rgba(90, 200, 250, .88);
  --border-trace-c: rgba(225, 190, 104, .70);
}

.motion-ready .border-motion-card.is-motion-visible::before,
.motion-ready .is-motion-visible .border-motion-card::before {
  animation: borderTraceOrbit 13s linear infinite;
}

[data-motion-paused="true"] .border-motion-card::before {
  animation-play-state: paused !important;
}

@keyframes borderTraceOrbit {
  to { --border-trace-angle: 360deg; }
}

@media (hover: hover) and (pointer: fine) {
  .border-motion-card:hover::before,
  .border-motion-card:focus-within::before {
    opacity: .94;
  }
}

@media (max-width: 720px) {
  .border-motion-card::before { opacity: .48; }
}
