/* Kentekai motion: brief feedback, quiet entrances, no perpetual animation. */
:root{
  --motion-ease:cubic-bezier(.22,.68,.22,1);
  --motion-ui:200ms;
  --motion-entry:450ms;
}
.button{
  transition:background-color var(--motion-ui) ease,color var(--motion-ui) ease,
    border-color var(--motion-ui) ease,box-shadow var(--motion-ui) ease,
    transform var(--motion-ui) var(--motion-ease);
}
.button svg,.text-link svg,.card-bottom svg,.service-icon svg{
  transition:transform var(--motion-ui) var(--motion-ease);
}
.button:focus-visible{
  box-shadow:0 4px 14px #18171c12;
}
.button:focus-visible svg{transform:translateX(3px)}
.button:active{transform:translateY(0) scale(.985);box-shadow:none}
.text-link{transition:color var(--motion-ui) ease}
.text-link:focus-visible svg{transform:translateX(4px)}
.site-header nav a{transition:color var(--motion-ui) ease}
.site-header nav a:after{
  content:'';position:absolute;left:0;right:0;bottom:4px;height:2px;
  background:var(--purple);transform:scaleX(0);transform-origin:left;
  transition:transform var(--motion-ui) var(--motion-ease);
}
.site-header nav a[aria-current]:after,.site-header nav a:focus-visible:after{transform:scaleX(1)}
.service-card{position:relative;transition:background-color var(--motion-ui) ease}
.service-card:after{
  content:'';position:absolute;left:0;right:0;bottom:0;height:2px;
  background:var(--purple);transform:scaleX(0);transform-origin:left;
  transition:transform 300ms var(--motion-ease);pointer-events:none;
}
.service-card h3{transition:color var(--motion-ui) ease}
.service-card:focus-visible{outline-offset:-5px;background:white}
.service-card:focus-visible:after{transform:scaleX(1)}
.service-card:focus-visible .card-bottom svg{transform:translate(3px,-3px)}
.service-card:focus-visible h3{color:var(--purple)}
.sector-tabs button{
  transition:background-color var(--motion-ui) ease,color var(--motion-ui) ease,
    border-color var(--motion-ui) ease,transform var(--motion-ui) var(--motion-ease);
}
.sector-tabs button:active{transform:scale(.98)}
.menu-toggle,.dialog-close{
  transition:background-color var(--motion-ui) ease,color var(--motion-ui) ease,
    border-color var(--motion-ui) ease;
}
.menu-toggle[aria-expanded=true]{color:var(--purple);background:var(--mist);border-color:var(--violet)}
.dialog-close:focus-visible{color:var(--purple);background:var(--mist);border-radius:6px}
dialog[open]{animation:kentekai-dialog 220ms var(--motion-ease)}
dialog[open]::backdrop{animation:kentekai-backdrop 180ms ease}
@keyframes kentekai-dialog{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}
@keyframes kentekai-backdrop{from{background-color:#18171c00}to{background-color:#18171c80}}
@keyframes kentekai-menu{from{opacity:0;transform:translateY(-6px)}to{opacity:1;transform:translateY(0)}}
@media(hover:hover) and (pointer:fine){
  .button:hover{transform:translateY(-2px);box-shadow:0 5px 16px #18171c16}
  .button:hover svg{transform:translateX(4px)}
  .button:active{transform:translateY(0) scale(.985);box-shadow:none}
  .header-cta:hover{background:var(--mist)}
  .closing .button:hover{background:var(--mist)}
  .site-header nav a:hover:after{transform:scaleX(1)}
  .service-card:hover:after{transform:scaleX(1)}
  .service-card:hover h3{color:var(--purple)}
  .service-card:hover .service-icon svg{transform:translateY(-3px)}
  .service-card:hover .card-bottom svg{transform:translate(3px,-3px)}
  .sector-tabs button:hover{transform:translateY(-1px)}
  .sector-tabs button:active{transform:translateY(0) scale(.98)}
  .dialog-close:hover{color:var(--purple);background:var(--mist);border-radius:6px}
}
@media(max-width:620px){
  .site-header nav.is-open{animation:kentekai-menu 200ms var(--motion-ease)}
  .site-header nav a:after{left:12px;right:auto;width:24px;bottom:6px}
}
@media(prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  *,*:before,*:after{animation:none!important;transition:none!important}
  .button,.button svg,.text-link svg,.card-bottom svg,.service-icon svg,.sector-tabs button{transform:none!important}
}
@media print{*,*:before,*:after{animation:none!important;transition:none!important}}
