/* Midnight portfolio. Optical surfaces belong to controls, not long-form copy. */
:root {
 color-scheme:dark; --paper:#0d1219; --ink:#f0f3f7; --muted:#acb6c3; --line:#35404e; --blue:#99c3ff;
 --glass-ink:#e6edf6; --glass-edge:#b7cce52b;
 --glass-shadow:0 10px 28px #0004,inset 0 1px 0 #d4e7ff26,inset 0 -1px 0 #080e19a6;
}
body { background:var(--paper); }
::selection { background:#99c3ff; color:#111b29; }
.skip-link,.noscript { background:#172231; color:var(--ink); }
.hero.hero--profile {
 background:#0e141e url('assets/dark-ribbon.svg') center/cover no-repeat;
 padding-top:166px; padding-bottom:32px;
}
.hero.hero--profile .hero-name { font-size:26px; font-weight:600; }
.hero.hero--profile .hero-tenure { color:#a9bfdc; font-size:21px; border-color:#71859c55; }
.hero--profile h1 { color:#f3f5f8; font-weight:550; }
.hero-summary { color:#b4bdca; }
.hero-organisations { color:#b4c1d2; }
.hero-organisations span+span { border-color:#8294ad40; }
.hero-disciplines { color:#a1b0c3; }
.hero-availability { border-color:#9aaac226; color:#b9c4d3; }
.status-dot,.contact .status-dot { background:#a8c5e9; box-shadow:0 0 12px #95bdfb30; }
.header-shell,.header.is-scrolled .header-shell,.hero-evidence,.case-indicator,.language-indicator {
 color:var(--glass-ink); border-color:#a6bfd426;
 box-shadow:0 15px 38px #0004,inset 0 1px 0 #d8e8ff30,inset 0 -1px 0 #b5c8df0d;
}
.header-shell::before { background:linear-gradient(135deg,#283442b3,#10192791 70%,#26384a91); }
.header.is-scrolled .header-shell::before { background:linear-gradient(135deg,#1b2735df,#0c1521d9); }
.header-shell::after,.hero-evidence::after,.case-indicator::after,.language-indicator::after {
 padding:1px; opacity:.75;
 background:radial-gradient(ellipse at var(--light-x,22%) var(--light-y,0%),#e5f1ffa6,transparent 65%),linear-gradient(135deg,#a7bcd75c,transparent 35%,#6188b321 65%,#d3e5fa54);
}
.hero-evidence { border-radius:26px; }
.hero-evidence::before { background:linear-gradient(135deg,#a9bdd51a,#29384b38 50%,#1f2c3f47); }
.hero-evidence .eyebrow { color:#a9b8cd; }
.hero-evidence h2 { color:#f1f5fa; font-size:28px; }
.hero-evidence .hero-past,.hero-evidence .hero-team dt { color:#b3c0d1; }
.hero-evidence .hero-team { border-color:#b7c8dd2b; }
.hero-evidence .hero-team dd { color:#f0f5fb; font-size:54px; font-weight:500; }
.hero-evidence .text-link { color:#e2ebf7; border-color:#a4b8d245; }
.glass-sheen::before { background:linear-gradient(112deg,transparent 36%,#c0d8ff03 43%,#dceaff29 49%,#bfd7ff05 55%,transparent 64%); }
.header-shell .desktop-nav a,.header-shell .header-contact { color:#c5cfdd; }
.header-shell .desktop-nav a[aria-current="location"] { color:#f1f6ff; background:#a9c5ec13; box-shadow:inset 0 1px 0 #d9e7ff12; }
.languages { background:#02091247; box-shadow:inset 0 1px 3px #0004; }
.languages a { color:#a5b4c7; }
.languages a[aria-current="true"] { color:#f3f7ff; background:transparent; }
.language-indicator::before,.case-indicator::before { background:linear-gradient(140deg,#b3cceb26,#7d9fc00d 70%,#97bce326); }
.no-js .languages a[aria-current="true"] { background:#314056; }
.header-contact,.menu-toggle { background:#adc9f00b; border-color:#bccde82b; box-shadow:inset 0 1px 0 #cfe5ff1f; }
.mobile-nav { background:#101b2beb; border-color:#b7cde33d; box-shadow:0 20px 48px #0007,inset 0 1px 0 #dae9ff26; }
.mobile-nav a { color:#c5d2e4; }
.mobile-nav a[aria-current="location"] { color:#f1f6ff; background:#9abbeb19; }

/* Both hero actions are actual lenses. The primary has only a cooler tint. */
.hero-actions { gap:14px; }
.hero-actions .glass-cta {
 position:relative; isolation:isolate; overflow:visible; display:inline-flex; align-items:center; justify-content:space-between;
 min-height:54px; gap:28px; padding:14px 23px; border:1px solid #bbd3ed40; border-radius:999px;
 background:transparent; color:#e8f1ff; box-shadow:var(--glass-shadow); font-size:13px; font-weight:600;
}
.hero-actions .glass-cta::before {
 content:""; position:absolute; inset:0; border-radius:inherit; z-index:-1; pointer-events:none;
 background:linear-gradient(150deg,#93b9e42e,#4b6c8f18 60%,#86b4e427);
 -webkit-backdrop-filter:var(--optical-filter,blur(8px) saturate(115%)); backdrop-filter:var(--optical-filter,blur(8px) saturate(115%));
}
.hero-actions .glass-cta--secondary { border-color:#b7c7dc2e; color:#dde5ef; }
.hero-actions .glass-cta--secondary::before { background:linear-gradient(150deg,#b2c4d51a,#91a4bb08 60%,#afc6df13); }
.hero-actions .glass-cta::after {
 content:""; position:absolute; inset:-1px; width:auto; height:auto; padding:1px; border-radius:inherit; transform:none; opacity:.65;
 background:radial-gradient(ellipse at var(--light-x,22%) var(--light-y,0%),#e0f0ffb3,transparent 70%),linear-gradient(135deg,#b9d4f447,transparent 40%,#8eb5e045);
 -webkit-mask:linear-gradient(#fff 0 0) content-box,linear-gradient(#fff 0 0); mask:linear-gradient(#fff 0 0) content-box,linear-gradient(#fff 0 0); -webkit-mask-composite:xor; mask-composite:exclude;
 box-shadow:none; pointer-events:none; transition:opacity 260ms ease;
}
.hero-actions .glass-cta>span[aria-hidden] { font-size:21px; }

.intro,.profile { background:#10161e; }
.work { background:radial-gradient(ellipse at 100% 15%,#22324880,transparent 62%),#0e141d; }
.videos { background:#0d131c; }
.tools { background:radial-gradient(ellipse at 95% 15%,#26394c66,transparent 60%),#111923; }
.section-index { color:#b3c3d6; }
.section-heading>p,.metric-note { color:var(--muted); }
.metrics strong { color:#eaf0f8; }
.case-browser { background:linear-gradient(125deg,#1b2530db,#121b26e8); border-color:#b8cce027; box-shadow:0 20px 55px #0003,inset 0 1px 0 #cadcf00d; border-radius:24px; }
.case-tabs { background:linear-gradient(110deg,#050b124d,#8ca5c20a); border-color:#b5c9e025; box-shadow:inset 0 1px 4px #0003; }
.case-tabs .case-tab { color:#a9b7c9; }
.case-tabs .case-tab[aria-selected="true"] { color:#edf5ff; }
.case-tabs .case-tab:focus-visible { outline-color:#aacfff; }
/* Segmented controls have one moving lens. Their hit areas never scale into
   neighbouring segments or draw a second capsule over the selected lens. */
.case-tabs .case-tab::after,.languages a::after {
 inset:2px; border:0; box-shadow:none;
 background:radial-gradient(ellipse at var(--hover-x,50%) var(--hover-y,10%),#c9e0ff12,transparent 75%);
}
.case-tabs .case-tab:is(:hover,:active),.languages a:is(:hover,:active) { transform:none; box-shadow:none; }
.case-copy .case-outcome strong { color:#e1edff; font-weight:500; }
.case-art.metinvest .character-cover { background:radial-gradient(ellipse at 40% 5%,#344657,#1d2b39 80%); border-color:#a7c0df21; }
.case-art.dnipro .case-art-inner,.case-art.uz .case-art-inner { background:#172330; border:1px solid #a7c0df21; }
/* Course covers fill the frame at every breakpoint, including admin replacements. */
.case-browser .case-art:is(.dnipro,.uz) .case-art-inner {
 padding:0; height:auto; min-height:0; aspect-ratio:16/9;
}
.case-browser .case-art:is(.dnipro,.uz) .main-art {
 display:block; width:100%; height:100%; object-fit:cover; box-shadow:none;
}
.case-expanded,.case-team,.gallery-expanded,.project-expanded,.engine-project { border-color:var(--line); }
.case-evidence img { background:#1b2836; border-radius:12px; }
.character-stage,.character-strip { background:#1c2937; border:1px solid #b5cce019; }
.disclosure-toggle,.disclosure-bottom,.gallery-toggle-bar {
 background:linear-gradient(145deg,#7d9cbe1f,#607f9e0d); color:#dce8f7; border-color:#a9c4e345;
 box-shadow:0 5px 14px #0002,inset 0 1px 0 #dceaff1c;
}
.disclosure-toggle[aria-expanded="true"] { background:#9cbeeb17; color:#e4efff; border-color:#b5d2f24a; }
.gallery-toggle-bar { background:linear-gradient(145deg,#1e2e40d9,#162536bf); }
.experience .role { color:#c1d5ee; }
.earlier { overflow-anchor:none; }
.earlier summary { min-height:48px; padding:12px 18px; gap:18px; }
.earlier summary>span { min-width:0; }
.video-cover { background:#1d2a38; border:1px solid #a5c5e121; }
/* A clear lens over the thumbnail; the play glyph stays above the optics. */
.video-play {
 isolation:isolate; width:64px; height:64px; padding:0; border:0; color:#fff; background:transparent;
 -webkit-backdrop-filter:none; backdrop-filter:none;
 box-shadow:0 6px 18px #0005,inset 0 1px 1px #ffffff70,inset 0 -1px 2px #c8e0ff40;
 transition:transform 420ms var(--response),box-shadow 300ms ease;
}
.video-play::before {
 content:""; position:absolute; inset:0; z-index:-1; border-radius:inherit; pointer-events:none;
 background:linear-gradient(140deg,#e3f3ff26,#7190af0d 48%,#bddbff26);
 -webkit-backdrop-filter:var(--video-optical-filter,blur(2px) saturate(125%));
 backdrop-filter:var(--video-optical-filter,blur(2px) saturate(125%));
}
.video-play::after {
 content:""; position:absolute; inset:0; padding:1px; border-radius:inherit; pointer-events:none;
 background:conic-gradient(from 20deg,#eff8ffb3,#a9d0ff29 20%,#e8f6ff8c 44%,#6c91bf26 66%,#fff9 88%,#eff8ffb3);
 -webkit-mask:linear-gradient(#fff 0 0) content-box,linear-gradient(#fff 0 0); mask:linear-gradient(#fff 0 0) content-box,linear-gradient(#fff 0 0); -webkit-mask-composite:xor; mask-composite:exclude;
}
.video-play svg { width:21px; height:24px; margin-left:3px; filter:drop-shadow(0 1px 3px #0009); }
.video-glint { position:absolute; inset:0; overflow:hidden; border-radius:inherit; pointer-events:none; }
.video-glint::before {
 content:""; position:absolute; inset:-50%; background:linear-gradient(115deg,transparent 40%,#f3faff38 50%,transparent 60%);
 transform:translateX(-65%); transition:transform 650ms cubic-bezier(.2,.7,.2,1);
}
.video-card:focus-visible .video-play { outline:2px solid #dcecff; outline-offset:4px; }
.learn-visual { background:transparent; }
.learn-screenshot-link { border-color:#acc8e33d; box-shadow:0 24px 60px #0005; }
.image-caption { color:var(--muted); }
.engine-title img { filter:brightness(0) invert(1); }
.development i { background:#acc3dd; }
.contact { background:radial-gradient(ellipse at 95% 100%,#263a505e,transparent 70%),#0b111a; border-top:1px solid #a5b9cf21; }
.contact .section-index>span:first-child,.contact-top>p,.location p span,.footer-name { color:#9eafc5; }
.contact-bottom { border-color:#b6c9e12b; }

/* Quiet, pointer-aware reflections and physical feedback. */
:is(.disclosure-toggle,.disclosure-bottom,.header-contact,.menu-toggle,.desktop-nav a,.mobile-nav a)::after {
 background:radial-gradient(ellipse at var(--hover-x,50%) var(--hover-y,10%),#c9e0ff19,transparent 72%); box-shadow:inset 0 1px 0 #d4e7ff36;
}
@media(hover:hover) and (pointer:fine) {
 .hero-actions .glass-cta:hover { background:#c3ddff05; color:#fff; transform:translateY(-2px) scale(1.015); box-shadow:0 10px 24px #0005,inset 0 1px 0 #e5f1ff38; }
 .hero-actions .glass-cta:hover::after { opacity:1; transform:none; }
 :is(.disclosure-toggle,.disclosure-bottom,.header-contact,.menu-toggle):hover { color:#edf5ff; background:#93b6e21b; border-color:#b6d0f066; box-shadow:0 8px 22px #0004,inset 0 1px 0 #d9ecff32; }
 .header-shell .desktop-nav a:hover,.header-shell .mobile-nav a:hover { color:#e8f2ff; background:#a3c5ee0f; box-shadow:inset 0 1px 0 #d9e7ff12; }
 .case-tabs .case-tab:hover,.languages a:hover { color:#f1f7ff; background:transparent; }
 .text-link:not(.disclosure-toggle,.disclosure-bottom,.glass-cta,.glass-action):hover { color:#b5d5ff; }
 .disclosure-toggle[aria-expanded="true"]:hover { background:#aacbf325; color:#fff; }
 .character-cover:hover .gallery-toggle-bar { background:#293e53ed; border-color:#c0d8ed55; }
 .character-cover:hover,.video-card:hover .video-cover { box-shadow:0 14px 32px #0005; }
 .learn-screenshot-link:hover { box-shadow:0 28px 60px #0006; border-color:#bbd6f56b; }
 .video-card:hover h3,.earlier summary:hover { color:#b9d7ff; }
 .video-card:hover .video-play { color:#fff; background:transparent; transform:scale(1.06); box-shadow:0 8px 22px #0006,inset 0 1px 1px #ffffff9c,inset 0 -1px 2px #d9eaff5c; }
 .video-card:hover .video-glint::before { transform:translateX(65%); }
 .earlier summary:hover { background:#9cbce50b; }
 .contact-main:hover h2 { color:#c0d9fa; }
}
.hero-actions .glass-cta:active { transform:scale(.975); }
.video-card:active .video-play { transform:scale(.96); }
@media(min-width:1101px) {
 .hero-layout { grid-template-columns:minmax(0,1fr) 380px; gap:clamp(50px,7vw,120px); }
 .hero-evidence { height:410px; min-height:410px; padding:30px; }
}
@media(max-width:760px) {
 .hero.hero--profile { background-image:linear-gradient(180deg,#101722e6,#10172240 60%,transparent),url('assets/dark-ribbon.svg'); background-position:center,68% center; padding-top:124px; }
 .hero.hero--profile .hero-name { font-size:23px; }
 .hero.hero--profile .hero-tenure { font-size:20px; }
 .hero-evidence h2 { font-size:26px; }
 .hero-actions .glass-cta { padding:13px 19px; gap:22px; }
 .hero-actions { gap:12px; }
 .menu-toggle { background:#a8c7ef12; box-shadow:inset 0 1px 0 #d9eaff26; }
}
@media(max-width:380px) {
 .hero-actions .glass-cta { width:100%; justify-content:space-between; }
 .hero-evidence h2 { font-size:24px; }
}
@supports not ((backdrop-filter:blur(1px)) or (-webkit-backdrop-filter:blur(1px))) {
 .header-shell::before,.hero-evidence::before,.case-indicator::before,.language-indicator::before,.hero-actions .glass-cta::before { background:#202d3eea; }
 .video-play::before { background:#26364ce8; }
}
@media(prefers-reduced-transparency:reduce),(prefers-contrast:more) {
 .header-shell,.header.is-scrolled .header-shell,.mobile-nav,.case-tabs,.gallery-toggle-bar,.video-play { background:#182434; border-color:#8ba2bf; }
 .header-shell::before,.header.is-scrolled .header-shell::before,.hero-evidence::before,.case-indicator::before,.language-indicator::before,.hero-actions .glass-cta::before { background:#24344a; -webkit-backdrop-filter:none; backdrop-filter:none; }
 .languages a[aria-current="true"],.desktop-nav a[aria-current="location"] { background:#314863; color:#fff; }
 .video-play::before { background:#182434; -webkit-backdrop-filter:none; backdrop-filter:none; }
 .video-glint { display:none; }
}
@media(prefers-reduced-motion:reduce) {
 .hero-actions .glass-cta:is(:hover,:active) { transform:none; }
 .video-card:is(:hover,:active) .video-play,.video-glint::before { transform:none; }
 .video-glint { display:none; }
}