/* Shared brand accents. Operational success/warning/error colors are separate. */
:root {
  /* Approved art-direction palette. Adoption is scoped to the review lab first. */
  --korppi-raven: #050608;
  --korppi-graphite: #0d1014;
  --korppi-charcoal: #171b21;
  --korppi-mist: #f5f5f3;
  --korppi-snow: #fafaf8;
  --korppi-gray-100: #e8eaed;
  --korppi-gray-200: #d6dadf;
  --korppi-gray-300: #b8c0c7;
  --korppi-ice: #a8d7f2;
  --korppi-ice-deep: #7fbfdb;
  --korppi-success: #a9c8b0;
  --korppi-warning: #d9c59a;
  --korppi-danger: #d7a4a4;
  --korppi-radius-panel: 24px;
  --korppi-radius-card: 16px;
  --korppi-radius-control: 10px;
  --korppi-border-light: #d6dadf;
  --korppi-border-dark: #ffffff26;
  --korppi-shadow: 0 8px 32px #0506080a;
  --accent: #a8c5ff;
  --accent-hover: #c4d8ff;
  --accent-soft: #eef4ff;
  --accent-ink: #14243c;
  --accent-text: #3c5d88;
  --accent-focus: #5275a3;
  --accent-on-dark: #a8c5ff;
  --brand-display: Arial, Helvetica, sans-serif;
  /* Keep photographic detail and natural skin tones without competing with the accent. */
  --brand-photo-filter: saturate(.72) contrast(1.03);
  --motion-duration-fast: 160ms;
  --motion-duration-base: 320ms;
  --motion-route-duration: 240ms;
  --motion-ease: cubic-bezier(.22, 1, .36, 1);
  --motion-reveal-distance: 32px;
  --motion-duration-fast: 160ms;
  --motion-duration-base: 320ms;
  --motion-route-duration: 240ms;
  --motion-ease: cubic-bezier(.22, 1, .36, 1);
  --motion-reveal-distance: 32px;
}

:root { --motion-feedback:180ms; --motion-reveal:440ms; --motion-recompose:500ms; --motion-handoff:760ms; --motion-menu:560ms; --motion-route:680ms; --motion-stagger:40ms; }

/* Shared accessibility and locale controls used by every website layout. */
.skip-link {
  position: fixed;
  inset-block-start: 8px;
  inset-inline-start: 8px;
  z-index: 1000;
  padding: 12px 18px;
  color: #fff;
  background: #061831;
  transform: translateY(-180%);
}
.skip-link:focus { transform: translateY(0); }
.language-code { display:none; }
.language-globe { display:none; }
.language-switcher a[data-language-selected]{box-shadow:inset 2px 0 var(--korppi-ice,#a8d7f2)!important}
:root{--motion-language-total:900;--motion-language-select:80ms;--motion-language-interpret:200ms;--motion-language-abstract:80ms;--motion-language-recompose:160ms;--motion-language-resolve:220ms}
.recompose-text{transform:translateY(calc(clamp(0,calc(var(--language-progress,0)/var(--language-interpret-end,.2)),1)*3px));opacity:calc(1 - clamp(0,calc(var(--language-progress,0)/var(--language-interpret-end,.2)),1)*.3)}
[data-language-phase="abstract"] .recompose-text,[data-language-phase="recompose"] .recompose-text{visibility:hidden}
[data-language-phase="resolve"] .recompose-text{visibility:visible;--text-reveal:clamp(0,calc((var(--language-progress) - var(--language-resolve-start,.68) - var(--recompose-offset,0)) / .22),1);clip-path:inset(calc((1 - var(--text-reveal))*100% - var(--text-reveal)*.15em) -.08em -.18em);transform:translateY(calc((1 - var(--text-reveal))*6px));opacity:calc(.7 + var(--text-reveal)*.3)}
.recompose-skeleton{position:fixed;inset:0;pointer-events:none;z-index:90;overflow:clip;--line-progress:clamp(0,calc((var(--language-progress) - var(--language-compose-start,.32))/(var(--language-resolve-start,.68) - var(--language-compose-start,.32))),1);--line-eased:calc(var(--line-progress)*var(--line-progress)*(3 - 2*var(--line-progress)))}
.recompose-skeleton>span{position:absolute;height:2px;transform-origin:left center;background:repeating-linear-gradient(90deg,currentColor 0,currentColor 19%,transparent 19%,transparent 22%);opacity:.6;transform:translate(calc(var(--line-x)*(1 - var(--line-eased))),calc(var(--line-y)*(1 - var(--line-eased)))) scaleX(calc(var(--line-scale) + (1 - var(--line-scale))*var(--line-eased)))}
[data-language-phase="resolve"] .recompose-skeleton{clip-path:inset(0 0 calc(clamp(0,calc((var(--language-progress) - var(--language-resolve-start,.68))/.1),1)*100%) 0)}
.language-processing-dots{display:none}
.language-lab-samples{display:grid;grid-template-columns:1fr 1fr;gap:24px;margin-top:32px}.language-lab-samples article{padding:24px;display:grid;gap:24px;align-content:start}.language-lab-samples h2{max-width:15ch;font-size:clamp(30px,3.4vw,64px)}.language-lab-samples p{max-width:36ch}.language-lab-dark{background:#111417;color:#f5f5f3}
@media(max-width:600px){.language-lab-samples{grid-template-columns:1fr}}
[data-language-processing]{position:relative}
[data-language-processing]>:not(.language-processing-dots){visibility:hidden}
[data-language-processing]>.language-processing-dots{display:block;position:absolute;inset:0;display:grid;place-items:center;font-size:22px;letter-spacing:2px;color:inherit}
[data-motion-wing-cut]{position:fixed;right:0;top:100px;width:160px;height:3px;pointer-events:none;z-index:99;background:var(--korppi-ice,#a8d7f2);clip-path:polygon(0 100%,80% 0,100% 50%,75% 100%);animation:wing-cut 160ms var(--motion-ease,cubic-bezier(.22,.72,.18,1)) both}
@keyframes wing-cut{from{transform:translateX(100%)}to{transform:translateX(-24px);clip-path:polygon(0 100%,0 100%,0 100%,0 100%)}}
@media(max-width:600px){:root{--motion-language-total:600}[data-motion-wing-cut]{width:100px}}
@media(prefers-reduced-motion:reduce){.recompose-skeleton,[data-motion-wing-cut]{display:none}.recompose-text{transform:none!important;opacity:1!important;clip-path:none!important;visibility:visible!important}}
.language-switcher { position: relative; flex: 0 0 auto; font-size: 12px; color: inherit; }
.language-switcher summary { cursor: pointer; display: flex; align-items: center; gap: 8px; padding: 10px 8px; list-style: none; white-space: nowrap; }
.language-switcher summary::-webkit-details-marker { display: none; }
.language-switcher nav { position: absolute; inset-block-start: calc(100% + 6px); inset-inline-end: 0; z-index: 150; min-width: 136px; padding: 6px; background: #f7f7f5; color: #10151b; border: 1px solid #d7d9dc; border-radius: 8px; box-shadow: 0 8px 24px #0002; }
.language-switcher a { display: block; padding: 10px; color: inherit; font: inherit; text-decoration: none; }
.language-switcher a:hover { background: #e5ebf7; }
.language-switcher summary:focus-visible { outline: 2px solid currentColor; outline-offset: 2px; }
@media (max-width: 980px) { .site-header .language-switcher { grid-column: 1 / -1; } .site-header .language-switcher nav { position: static; display: flex; flex-wrap: wrap; margin: 4px 0 10px; box-shadow: none; } }
.language-switcher a[aria-current] { background:#e7edf0; }
.language-switcher summary{min-height:44px;min-width:124px;justify-content:space-between;padding:10px 14px;border:1px solid #89919866;border-radius:3px;transition:background 160ms,border-color 160ms}
.language-switcher summary:hover,.language-switcher[open] summary{background:#89919815;border-color:#899198}
.language-chevron{transition:transform 160ms}.language-switcher[open] .language-chevron{transform:rotate(180deg)}
.language-switcher>nav,.marketing-footer .language-switcher>nav{display:grid;gap:3px;inline-size:224px;min-width:0;max-inline-size:calc(100vw - 40px);padding:8px;background:#f9faf8;color:#171b1e;border:1px solid #c7cdd0;border-radius:4px;box-shadow:0 14px 42px #0002;z-index:180}
.language-panel-title{padding:8px 12px 12px;color:#677079;font-size:11px;letter-spacing:.08em;text-transform:uppercase;border-bottom:1px solid #171b1e14;margin-bottom:3px}
.language-switcher>nav>a{display:flex;justify-content:space-between;align-items:center;gap:24px;min-height:46px;padding:10px 12px;border-radius:2px;font-size:14px;text-decoration:none!important}
.language-switcher>nav>a small{font-size:10px;color:#63717b}
.language-switcher>nav>a:hover{background:#e7edf0}.language-switcher>nav>a[aria-current]{box-shadow:inset 2px 0 var(--korppi-ice,#a8d7f2)}
.language-switcher>nav>a:active{background:#d9e3e9}
.language-switcher[open]>nav{animation:language-panel-in 160ms ease-out}
@keyframes language-panel-in{from{opacity:0;transform:translateY(4px)}to{opacity:1;transform:none}}
@media(prefers-reduced-motion:reduce){.language-switcher[open]>nav{animation:none}.language-switcher summary,.language-chevron{transition:none}}
.language-switcher a:focus-visible { outline: 2px solid currentColor; outline-offset: 2px; }
.not-found-page .language-switcher { color: #fff; }
@media (max-width: 760px) { .auth-header .language-switcher { color: #e6edff; } .auth-header { gap: 8px; } .auth-header .app-brand-logo { max-width: 34vw; } }
[dir="rtl"] :is(.legal-main, .auth-form-panel, .team-story) { text-align: start; }
.business-translation { margin: 20px 0; padding: 18px; border: 1px solid #c7d1c9; border-radius: 12px; background: #f5f8f5; color: #20372a; overflow-wrap: anywhere; }
.business-translation summary { cursor: pointer; font-weight: 600; }
.business-translation p { font-size: 14px; line-height: 1.6; white-space: pre-wrap; }
.business-translation article { border-top: 1px solid #d8e0da; padding: 10px 0; }
.business-translation article details { font-size: 12px; color: #465a4d; }
/* Quiet, reusable material layers. Strength is local; no global animation. */
.material-paper { --material-strength:.035; background-color:var(--korppi-mist); background-image:repeating-linear-gradient(115deg,transparent 0 2px,rgb(5 6 8 / var(--material-strength)) 2px 3px); }
.material-graphite { --material-strength:.11; background-color:var(--korppi-graphite); background-image:linear-gradient(125deg,rgb(250 250 248 / var(--material-strength)),transparent 32%,#050608 80%); }
.signal-fx { --signal-size:24px; --signal-color:var(--korppi-ice); width:var(--signal-size); height:var(--signal-size); color:var(--signal-color); }
.signal-fx [data-fx-active],.signal-fx [data-fx-confirmed] { opacity:0; }
.signal-fx[data-state="active"] [data-fx-active],.signal-fx[data-state="confirmed"] [data-fx-confirmed] { opacity:1; }
.signal-fx[data-state="active"] [data-fx-active] { transform-origin:center; animation:signal-fx-once 600ms var(--motion-ease) 1 both; }
@keyframes signal-fx-once { from { transform:scale(.7); opacity:.7; } to { transform:scale(1); opacity:.2; } }
@media(prefers-reduced-motion:reduce) { .signal-fx [data-fx-active] { animation:none!important; } }

/* Language Wing Release: glyph fragments leave; media stays in place. */
.recompose-wing{position:fixed;inset:0;z-index:90;pointer-events:none;overflow:hidden;--wing-out:clamp(0,calc(var(--language-progress,0)/.58),1)}
.recompose-wing-shard{position:absolute;clip-path:polygon(calc(var(--shard)*25% - 12%) -20%,calc(var(--shard)*25% + 25%) -20%,calc(var(--shard)*25% + 37%) 120%,calc(var(--shard)*25% ) 120%);transform:translate(calc(var(--wing-out)*var(--wing-out)*var(--travel)),calc(var(--wing-out)*var(--wing-out)*var(--travel)*-.65));opacity:calc(1 - var(--wing-out)*var(--wing-out));transform-origin:center;will-change:transform,opacity}
.recompose-wing-shard>*{visibility:visible!important;animation:none!important;transition:none!important}
.recompose-wing-grain{position:absolute;width:2px;height:2px;background:currentColor;opacity:calc(sin(var(--wing-out)*3.14159)*.55);transform:translate(calc(var(--wing-out)*var(--travel)),calc(var(--wing-out)*var(--travel)*-.7))}
[data-language-wing] .recompose-text{visibility:hidden;transform:none;opacity:1}
[data-language-wing][data-language-phase="resolve"] .recompose-text{visibility:visible;--text-reveal:clamp(0,calc((var(--language-progress) - var(--language-resolve-start,.49) - var(--recompose-offset,0))/.34),1);clip-path:polygon(-8% -20%,calc(var(--text-reveal)*140% - 20%) -20%,calc(var(--text-reveal)*140% - 40%) 125%,-8% 125%);transform:none;opacity:1}
@media(max-width:600px){:root{--motion-language-total:760}}
@media(prefers-reduced-motion:reduce){.recompose-wing{display:none}}
