/* Refero-guided motion layer; existing brand and product tokens remain authoritative. */
:root {
  --motion-fast: 120ms;
  --motion-state: 220ms;
  --motion-enter: 480ms;
  --motion-ease: cubic-bezier(.2,.75,.2,1);
}
.site-header { transition: box-shadow var(--motion-state) ease, background-color var(--motion-state) ease; }
.site-header.is-scrolled { background: #f5f7fbf5; box-shadow: 0 1px 0 var(--line), 0 12px 32px #17213b08; }
.site-header::after {
  content: ''; position: absolute; left: 0; right: 0; bottom: -1px; height: 2px;
  background: var(--accent,var(--blue)); pointer-events: none;
  transform: scaleX(var(--reading-progress,0)); transform-origin: left center;
}
.site-nav > a:not(.nav-cta), .footer-links a { text-decoration: none; background-image: linear-gradient(currentColor,currentColor); background-size: 0 1px; background-repeat: no-repeat; background-position: left bottom; transition: background-size var(--motion-state) var(--motion-ease), color var(--motion-fast) ease; }
.site-nav > a:not(.nav-cta):is(:hover,:focus-visible), .footer-links a:is(:hover,:focus-visible) { background-size: 100% 1px; }
.button, .nav-cta { position: relative; isolation: isolate; transition: background-color var(--motion-fast) ease, color var(--motion-fast) ease, border-color var(--motion-fast) ease, box-shadow var(--motion-state) ease; }
.button:hover, .nav-cta:hover { transform: none; }
.button-primary::after, .button-dark::after, .nav-cta::after {
  content: ''; position: absolute; inset: 0; pointer-events: none; border-radius: inherit;
  background: linear-gradient(110deg,transparent 25%,#ffffff28 47%,transparent 68%);
  background-size: 250% 100%; background-position: 130% center; opacity: 0;
  transition: opacity var(--motion-fast) ease, background-position var(--motion-enter) var(--motion-ease);
}
.button-primary:is(:hover,:focus-visible)::after, .button-dark:is(:hover,:focus-visible)::after, .nav-cta:is(:hover,:focus-visible)::after { opacity: 1; background-position: 0 center; }
.button:active, .nav-cta:active { box-shadow: inset 0 2px 8px #00000020; }
.text-action span[aria-hidden], .button span[aria-hidden], .nav-cta span { display: inline-block; transition: translate var(--motion-fast) var(--motion-ease); }
:is(.text-action,.button,.nav-cta):is(:hover,:focus-visible) span[aria-hidden] { translate: 3px -2px; }
.text-action { text-underline-offset: 6px; }
.text-action:is(:hover,:focus-visible) { text-decoration: underline; text-decoration-thickness: 1px; }
.contact-form :is(input,textarea,select) { transition: border-color var(--motion-fast) ease, box-shadow var(--motion-fast) ease; }
.contact-form :is(input,textarea,select):focus-visible { box-shadow: 0 0 0 4px color-mix(in srgb,var(--accent,var(--blue)) 10%,transparent); }

/* Light follows the pointer only across existing product media, never body copy. */
.motion-surface { position: relative; isolation: isolate; }
.motion-surface::after {
  content: ''; position: absolute; inset: 0; border-radius: inherit; z-index: 5;
  pointer-events: none; opacity: 0;
  background: radial-gradient(400px circle at var(--light-x,50%) var(--light-y,40%),#ffffff55,transparent 68%);
  box-shadow: inset 0 0 0 1px #ffffff60;
  transition: opacity var(--motion-state) ease;
}
.motion-surface:focus-visible::after, .motion-surface:focus-within::after { opacity: .6; }
.solution-stage { box-shadow: 0 16px 40px color-mix(in srgb,var(--accent) 7%,transparent), inset 0 1px 0 #ffffffb3; }
.project-surface { transition: box-shadow var(--motion-state) ease; }
.project-surface:is(:hover,:focus-visible) { box-shadow: 0 18px 42px #17213b12; }
.project-mock { transition-duration: var(--motion-state); }
.plan-card, .price-card { transition: border-color var(--motion-state) ease, box-shadow var(--motion-state) ease; }
:is(.plan-card,.price-card):focus-within { border-color: var(--accent,var(--blue)); box-shadow: 0 14px 42px color-mix(in srgb,var(--accent,var(--blue)) 10%,transparent); }
@media (hover: hover) and (pointer: fine) and (prefers-reduced-motion: no-preference) {
  .motion-depth { transform: perspective(1400px) rotateX(var(--surface-rx,0deg)) rotateY(var(--surface-ry,0deg)); transform-origin: center; transition: transform var(--motion-state) var(--motion-ease), box-shadow var(--motion-state) ease; }
  .motion-surface.is-lit::after { opacity: 1; }
  .solution-stage.is-lit { box-shadow: 0 24px 55px color-mix(in srgb,var(--accent) 12%,transparent), inset 0 1px 0 #fff; }
}

/* Native disclosures retain their keyboard, layout and no-JS behavior. */
@keyframes detail-enter { from { opacity: .35; translate: 0 -4px; } to { opacity: 1; translate: 0 0; } }
@media (prefers-reduced-motion: no-preference) {
  main details[open] > :not(summary), .nav-dropdown[open] .nav-dropdown-menu { animation: detail-enter var(--motion-state) var(--motion-ease); }
}
@media (hover: none), (pointer: coarse) {
  .motion-depth, .project-surface:hover .project-mock { transform: none; }
  .motion-surface::after { display: none; }
  .service-card:hover, .workshop-feature:hover, .feature-grid article:hover, .sector-grid article:hover, .resource-grid article:hover { transform: none; box-shadow: none; }
}
@media (prefers-reduced-motion: reduce) {
  .motion-depth, .project-surface:hover .project-mock { transform: none; }
  .motion-surface::after, .button-primary::after, .button-dark::after, .nav-cta::after { display: none; }
  :is(.text-action,.button,.nav-cta) span { translate: none !important; }
  .site-header::after { display: none; }
}
@media (forced-colors: active) {
  .motion-surface::after, .button-primary::after, .button-dark::after, .nav-cta::after, .site-header::after { display: none; }
  .motion-depth { transform: none; }
}
@media print {
  .motion-surface::after, .site-header::after { display: none; }
  .motion-depth { transform: none; }
}