/* Liquid Glass-inspired controls. Reading surfaces stay opaque and quiet. */
:root {
 --nav-height: 96px;
 --glass-ink: #263438;
 --glass-edge: rgba(255,255,255,.88);
 --glass-shadow: 0 8px 28px #34475012, 0 2px 5px #34475009, inset 0 1px 0 #ffffffed, inset 0 -1px 0 #ffffff70;
 --motion-ease: cubic-bezier(.22,1,.36,1);
 --motion-spring: cubic-bezier(.22,1.15,.36,1);
}
body { background:#f5f6f3; }
html { scroll-padding-top:100px; }
.header {
 height:96px; padding:12px var(--pad); gap:0;
 background:transparent; border:0; pointer-events:none;
}
.header-shell {
 position:relative; display:flex; align-items:center; gap:24px;
 width:100%; max-width:1480px; height:72px; margin:0 auto;
 padding:0 24px; border:1px solid var(--glass-edge); border-radius:28px;
 background:linear-gradient(145deg,#ffffffed,#f0f3f1f5);
 box-shadow:var(--glass-shadow); color:var(--glass-ink); pointer-events:auto;
 transition:height 420ms var(--motion-ease), width 480ms var(--motion-ease), border-radius 420ms var(--motion-ease), box-shadow 420ms ease, background-color 420ms ease;
}
.header.is-scrolled .header-shell {
 height:60px; width:calc(100% - 32px); border-radius:23px;
 box-shadow:0 10px 32px #273b491c,0 2px 5px #273b490a,inset 0 1px 0 #fff,inset 0 -1px 0 #ffffff90;
}
.wordmark { font-size:27px; flex:none; }
.desktop-nav { margin:0 auto 0 32px; gap:4px; }
.desktop-nav a { padding:11px 16px; border-radius:20px; font-size:13px; transition:background-color 180ms ease,color 180ms ease; }
.desktop-nav a:hover { background:#ffffff80; }
.desktop-nav a[aria-current="location"] { color:#2449c9; background:#ffffffa8; box-shadow:0 1px 4px #2634380d,inset 0 1px 0 #fff; }
.header-right { gap:20px; }
.languages { gap:0; border-radius:18px; padding:3px; background:#5366760b; box-shadow:inset 0 1px 3px #5366760a; }
.languages a { display:grid; place-items:center; min-width:34px; min-height:34px; padding:6px; border-radius:15px; font-size:10px; color:#586364; transition:background-color 200ms ease,box-shadow 200ms ease,color 200ms ease; }
.languages a[aria-current="true"] { text-decoration:none; background:#ffffffd9; color:#253c88; box-shadow:0 2px 5px #33485b12,inset 0 1px 0 #fff; }
.header-contact { align-items:center; gap:18px; padding:10px 16px; border:1px solid #ffffffb3; border-radius:20px; font-size:12px; background:#ffffff66; box-shadow:inset 0 1px 0 #fff; }
.header-contact>span:last-child { font-size:20px; }
.hero.hero--profile {
 margin-top:-96px; padding-top:154px; padding-bottom:30px;
 background:radial-gradient(ellipse at 87% 16%,#dce7f2 0,transparent 49%),radial-gradient(ellipse at 12% 82%,#dce8df 0,transparent 60%),linear-gradient(125deg,#f1f4ee,#e8eeee 62%,#eef0f5);
}
.hero-evidence {
 border:1px solid #ffffffd9; border-radius:24px; padding:28px;
 background:#f7f9f5d9; box-shadow:0 12px 40px #52626909,inset 0 1px 0 #fff;
}
.hero-evidence h2 { font-size:26px; }
.hero-team { gap:20px; margin:25px 0; }
.hero-availability { border-color:#aab9b645; }
.hero-tenure { color:#304ec3; }
.hero-name { letter-spacing:-.025em; }
.primary-link,.disclosure-toggle,.disclosure-bottom,.gallery-toggle-bar,.header-contact,.menu-toggle {
 transition:transform 300ms var(--motion-spring),box-shadow 250ms ease,background-color 200ms ease,border-color 200ms ease;
}
.primary-link {
 border:1px solid #5f7ef2; border-radius:999px; padding:15px 24px;
 background:linear-gradient(165deg,#5475f0,#3155d8 65%,#2e4ec4); color:white;
 box-shadow:0 6px 18px #3657ce24,inset 0 1px 0 #aabafa,inset 0 -1px 0 #2240a870;
}
.primary-link:hover { background:linear-gradient(165deg,#6381f5,#3b60e3 65%,#3555ce); box-shadow:0 8px 22px #3657ce30,inset 0 1px 0 #b8c6ff; }
.primary-link:active,.disclosure-toggle:active,.disclosure-bottom:active,.header-contact:active,.menu-toggle:active { transform:scale(.97); }
.hero-actions .text-link { border-bottom-color:#8a96915e; }
.hero-evidence .text-link { gap:22px; }
.intro { background:#f5f6f3; }
.work { background:radial-gradient(ellipse at 90% 0,#dce7ed 0,transparent 58%),linear-gradient(145deg,#e9efea,#e8eeef); }
.case-browser { border:1px solid #ffffffcf; border-radius:28px; background:#f8faf6b8; box-shadow:0 14px 44px #42545a0a,inset 0 1px 0 #fff; }
.case-tabs {
 position:relative; isolation:isolate; margin:14px 14px 0; padding:6px;
 border:1px solid #ffffffdf; border-radius:20px;
 background:linear-gradient(145deg,#e4ebe4d9,#e2e9eff0); box-shadow:inset 0 1px 3px #49616b0c;
}
.case-tabs::before {
 content:""; box-sizing:border-box; position:absolute; z-index:-1; left:6px; top:6px; bottom:6px;
 width:calc((100% - 12px)/3); border:1px solid #fff; border-radius:14px;
 background:linear-gradient(145deg,#ffffffed,#f9fbf9b8);
 box-shadow:0 3px 10px #32495b19,0 1px 2px #32495b0c,inset 0 1px 0 #fff;
 transform:translateX(0); transition:transform 460ms var(--motion-spring);
}
.case-tabs[data-active="dnipro"]::before { transform:translateX(100%); }
.case-tabs[data-active="uz"]::before { transform:translateX(200%); }
.case-tabs .case-tab { position:relative; min-height:48px; padding:10px 18px; border:0; border-radius:14px; background:transparent; color:#586765; justify-content:center; transition:color 200ms ease,transform 240ms var(--motion-spring); }
.case-tabs .case-tab:hover { background:#ffffff26; color:#263438; }
.case-tabs .case-tab[aria-selected="true"] { background:transparent; color:#2848b5; font-weight:750; }
.case-tabs .case-tab:active { transform:scale(.97); }
.case-tabs .case-tab:focus-visible { outline-color:#3455e6; outline-offset:1px; }
.case-browser .case,.case-browser .case:nth-child(even) { padding:34px; scroll-margin-top:0; }
.case-browser .case-art-inner { border-radius:18px; }
.case-art.metinvest .character-cover { background:radial-gradient(ellipse at 30% 15%,#ecf2ec,#d7e3e0 75%); border-color:#ffffffad; }
.disclosure-toggle,.disclosure-bottom {
 border-radius:999px; border:1px solid #a9b9b9; background:linear-gradient(155deg,#fff,#f0f4f2); color:#283d4c;
 box-shadow:0 3px 9px #3950590a,inset 0 1px 0 #fff; padding:12px 20px;
}
.disclosure-toggle:hover,.disclosure-bottom:hover { background:#fff; color:#2449c9; border-color:#92a6b4; box-shadow:0 5px 14px #39505914,inset 0 1px 0 #fff; }
.disclosure-toggle[aria-expanded="true"] { color:#2449c9; background:#e9eef7; border-color:#aebcdc; }
.disclosure-toggle[aria-expanded="true"]:hover { background:#f1f4fc; color:#2449c9; }
.disclosure-chevron { transition:transform 420ms var(--motion-spring); }
.gallery-toggle-bar { border-radius:14px; border-color:#ffffffd9; background:linear-gradient(155deg,#fffffff0,#eff5f2e6); box-shadow:var(--glass-shadow); color:#283d4c; }
.character-cover:hover .gallery-toggle-bar { background:#ffffffed; border-color:#fff; }
.character-cover:active .gallery-toggle-bar { transform:scale(.98); }
.character-stage,.character-strip { border-radius:16px; }
.video-cover { border-radius:16px; }
.video-play { border:1px solid #ffffffdb; background:#f9fcf1df; box-shadow:var(--glass-shadow); transition:transform 300ms var(--motion-spring),background-color 200ms ease; }
.video-card:hover .video-play { transform:scale(1.08); background:#fff; color:#2848b5; }
.profile { background:#f8f8f5; }
.earlier summary { min-height:30px; }
.earlier[open] .disclosure-chevron { transform:rotate(180deg); }
.tools { background:linear-gradient(135deg,#e8efef,#edf0f5); }
.learn-screenshot-link { border-radius:16px; overflow:hidden; border-color:#c5d1d1; box-shadow:0 18px 40px #233e5014; }
.contact { background:radial-gradient(ellipse at 100% 0,#526fe2,transparent 70%),#304dc7; }
.header-contact:hover { background:#ffffffb3; }
.mobile-nav {
 top:calc(100% + 10px); border:1px solid #ffffffeb; border-radius:24px;
 background:#f5f8f4f7; padding:12px 18px; box-shadow:0 20px 48px #2a3f4d26,inset 0 1px 0 white;
 max-height:calc(100dvh - 108px);
}
.mobile-nav a { border-radius:14px; padding:12px 16px; font-size:18px; min-height:48px; }
.mobile-nav a:hover,.mobile-nav a[aria-current="location"] { background:#dce5ef7d; color:#2848b5; }
.no-js .case-tabs::before { display:none; }
.no-js .header-shell { max-width:1480px; }
@supports ((backdrop-filter:blur(1px)) or (-webkit-backdrop-filter:blur(1px))) {
 .header-shell { background:linear-gradient(145deg,#ffffffa8,#f3f7f18c); -webkit-backdrop-filter:blur(24px) saturate(145%); backdrop-filter:blur(24px) saturate(145%); }
 .header.is-scrolled .header-shell { background-color:#f6f9f41f; }
 .case-tabs { background:linear-gradient(145deg,#dae5db7d,#dce6ed99); -webkit-backdrop-filter:blur(16px) saturate(130%); backdrop-filter:blur(16px) saturate(130%); }
 .gallery-toggle-bar,.video-play { -webkit-backdrop-filter:blur(12px) saturate(130%); backdrop-filter:blur(12px) saturate(130%); }
 .mobile-nav { background:#f5f8f4f0; }
}
@media(min-width:901px) { .hero-layout { grid-template-columns:minmax(0,1fr) 340px; gap:clamp(44px,6vw,100px); } }
@media(max-width:1100px) {
 .header-shell { padding:0 18px; gap:16px; }
 .desktop-nav { margin-left:8px; gap:0; }
 .desktop-nav a { padding:11px 12px; }
 .header-right { gap:12px; }
 .header-contact { gap:12px; }
 .hero-evidence { padding:24px; }
 .case-browser .case,.case-browser .case:nth-child(even) { padding:26px; }
}
@media(min-width:761px) and (max-width:960px) { .header-contact { display:none; } }
@media(max-width:900px) { .hero-evidence { gap:0 28px; } .hero-team { margin:0; } }
@media(max-width:760px) {
 :root { --nav-height:84px; }
 html { scroll-padding-top:90px; }
 .header { height:84px; padding:10px 14px; }
 .header-shell { height:60px; padding:0 15px; border-radius:23px; gap:12px; }
 .header.is-scrolled .header-shell { height:56px; width:calc(100% - 8px); border-radius:21px; }
 .wordmark { font-size:25px; }
 .header-right { gap:12px; margin-left:auto; }
 .languages a { min-width:32px; min-height:34px; }
 .menu-toggle { display:flex; align-items:center; width:40px; height:40px; padding:10px; border-radius:16px; background:#ffffff70; box-shadow:inset 0 1px 0 #fff; }
 .menu-toggle span { height:1.5px; }
 .hero.hero--profile { margin-top:-84px; padding-top:120px; padding-bottom:24px; }
 .hero-evidence { border-radius:20px; padding:22px; }
 .hero-team { margin:20px 0; }
 .hero-name { margin-bottom:24px; }
 .case-browser { border-radius:22px; }
 .case-tabs { margin:10px 10px 0; padding:5px; border-radius:17px; }
 .case-tabs::before { left:5px; top:5px; bottom:5px; width:calc((100% - 10px)/3); border-radius:12px; }
 .case-tabs .case-tab { min-height:48px; padding:8px 6px; font-size:11px; line-height:1.35; border-radius:12px; }
 .case-browser .case,.case-browser .case:nth-child(even) { padding:20px; }
 .gallery-toggle-bar { font-size:12px; }
 .learn-screenshot-link { border-radius:10px; }
 .mobile-nav { padding:10px; }
 .mobile-nav a { font-size:18px; }
}
@media(max-width:380px) {
 .header { padding-left:10px; padding-right:10px; }
 .case-tabs { margin-left:6px; margin-right:6px; }
 .case-tabs .case-tab { font-size:10px; }
 .case-browser .case,.case-browser .case:nth-child(even) { padding:16px; }
 .hero-evidence { padding:20px; }
}
@media(prefers-reduced-transparency:reduce),(prefers-contrast:more) {
 .header-shell,.header.is-scrolled .header-shell,.mobile-nav,.case-tabs,.gallery-toggle-bar,.video-play { -webkit-backdrop-filter:none; backdrop-filter:none; background:#f5f7f3; border-color:#85958d; }
 .case-tabs::before { background:#fff; border-color:#8294b5; }
 .languages a[aria-current="true"],.desktop-nav a[aria-current="location"] { background:#fff; }
}
@media(prefers-reduced-motion:reduce) {
 html { scroll-behavior:auto; }
 *,*::before,*::after { animation:none!important; transition:none!important; }
 .primary-link:active,.disclosure-toggle:active,.disclosure-bottom:active,.header-contact:active,.menu-toggle:active,.case-tabs .case-tab:active,.character-cover:active .gallery-toggle-bar,.video-card:hover .video-play { transform:none; }
}
