/* Portfolio / Maxim Kozlov */
:root{color-scheme:dark;--bg:#0b0c10;--surface:#131419;--surface2:#191a22;--line:#292a33;--text:#f3f2f7;--muted:#aaa9b8;--purple:#b699ff;--blue:#93aeff;--max:1240px;font-family:Arial,Helvetica,sans-serif;font-synthesis:none}
*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:100px}body{margin:0;background:var(--bg);color:var(--text);font-size:1rem;line-height:1.65}body:has(dialog[open]){overflow:hidden}a{color:inherit;text-decoration:none}button{font:inherit;cursor:pointer}button,a{-webkit-tap-highlight-color:transparent}button{color:inherit}button:focus-visible,a:focus-visible,summary:focus-visible{outline:2px solid var(--purple);outline-offset:6px}img{display:block;max-width:100%}svg{width:24px;height:24px}p,h1,h2,h3,h4{margin-top:0}button{border:0}button:disabled{cursor:default}.container{width:min(var(--max),calc(100% - 96px));margin-inline:auto}.skip-link{position:fixed;top:-70px;left:20px;padding:12px 20px;background:var(--purple);color:var(--bg);z-index:200}.skip-link:focus{top:12px}.site-header{position:sticky;top:0;z-index:20;border-bottom:1px solid var(--line);background:#0b0c10ed;backdrop-filter:blur(18px)}.header-inner{width:min(var(--max),calc(100% - 96px));margin:auto;min-height:88px;display:flex;align-items:center;justify-content:space-between;gap:28px}.brand{display:flex;align-items:center;gap:22px}.brand-mark{font-size:1.8125rem;font-weight:800;letter-spacing:-2px;line-height:1}.brand-mark span{color:var(--purple);margin:0 2px}.brand-domain{color:var(--muted);font-size:0.875rem;border-left:1px solid var(--line);padding-left:22px}.site-header nav{display:flex;gap:30px;font-size:0.875rem}.site-header nav a{color:var(--muted);transition:color .2s}.site-header nav a:hover{color:var(--text)}.header-actions{display:flex;align-items:center;gap:24px}.language{display:flex;gap:3px;background:#16171d;padding:3px;border-radius:7px}.language button{font-size:0.8125rem;background:none;color:var(--muted);border-radius:4px;padding:7px 9px;min-height:36px}.language button[aria-pressed=true]{background:#2d263e;color:#e4d7ff}.github-header{display:flex;padding:10px}.menu-toggle{display:none;background:none;font-size:0.875rem;padding:10px}.mobile-nav[hidden]{display:none!important}.hero{display:grid;grid-template-columns:1.25fr 1fr;gap:9%;align-items:center;padding-block:88px 82px}.eyebrow{font-family:Consolas,'Courier New',monospace;font-size:0.75rem;font-weight:500;letter-spacing:1.5px;color:var(--muted);line-height:1.6;margin-bottom:28px}.hero .eyebrow{color:var(--purple);display:flex;align-items:center;gap:13px}.tiny-line{width:28px;height:1px;background:var(--purple)}h1{font-size:clamp(4rem,6.9vw,6.375rem);line-height:1.02;letter-spacing:-5px;font-weight:750;margin-bottom:27px}.name-period{color:var(--purple)}.hero-role{font-size:clamp(1.125rem,1.8vw,1.5rem);font-weight:500;letter-spacing:-.4px;margin-bottom:17px}.hero-description{color:var(--muted);max-width:530px;line-height:1.8;margin-bottom:30px}.hero-buttons{display:flex;gap:12px;flex-wrap:wrap}.button{display:inline-flex;align-items:center;justify-content:center;gap:22px;padding:14px 23px;border:1px solid var(--line);border-radius:7px;font-size:0.875rem;font-weight:600;min-height:50px;transition:background .2s,transform .2s}.button:hover{transform:translateY(-2px)}.primary{background:var(--purple);border-color:var(--purple);color:#140e22}.primary:hover{background:#c7b0ff}.secondary{background:#16171c}.secondary:hover{background:#24232e}.file-label{font-size:0.75rem;letter-spacing:.7px;color:var(--muted);font-weight:400}.hero-location{display:flex;flex-wrap:wrap;gap:12px;margin-top:27px;font-size:0.75rem;color:var(--muted)}.separator{color:#55515f}.hero-visual{position:relative;padding:0 8px 31px 0;max-width:465px;justify-self:end;width:100%}.portrait-frame{position:relative;background:#24202e;border:1px solid #44404d;padding:10px;transform:rotate(2deg);border-radius:4px}.portrait{width:100%;aspect-ratio:1/1;object-fit:cover;filter:saturate(.65);border-radius:2px}.portrait-caption{display:flex;justify-content:space-between;gap:10px;font:0.75rem Consolas,monospace;letter-spacing:1px;color:#c8c2d4;padding:14px 4px 4px}.terminal-note{position:absolute;bottom:0;left:-38px;display:grid;grid-template-columns:auto 1fr;gap:2px 20px;padding:18px 24px;background:#15151dec;border:1px solid #494052;border-radius:8px;backdrop-filter:blur(12px);font-family:Consolas,monospace;font-size:0.75rem;box-shadow:0 14px 44px #0005;transform:rotate(-2deg)}.terminal-note>span:last-child{grid-column:1/-1;color:#ddd7e8}.terminal-prompt{color:var(--purple)}.terminal-command{color:var(--muted)}.photo-coordinate{position:absolute;right:1px;bottom:-24px;color:#817989;font:0.75rem Consolas,monospace;letter-spacing:1.2px}.stack-strip{border-block:1px solid var(--line);background:#101115}.stack-strip .container{display:flex;justify-content:space-between;align-items:center;gap:18px;padding-block:22px;color:#c1bdcc;font:0.875rem Consolas,monospace;flex-wrap:wrap}.stack-strip i{font-style:normal;color:#554862}.section{padding-block:90px}.section-heading{display:flex;justify-content:space-between;align-items:flex-end;gap:40px;margin-bottom:36px}.section-heading .eyebrow{margin-bottom:12px;color:var(--purple)}h2{font-size:clamp(1.875rem,3.5vw,2.75rem);letter-spacing:-1.4px;line-height:1.2;margin-bottom:0}.section-heading>p{max-width:365px;color:var(--muted);font-size:0.9375rem;line-height:1.7;margin:0}.project-card{background:var(--surface);border:1px solid var(--line);border-radius:12px;overflow:hidden}.flagship{display:grid;grid-template-columns:1fr 1.15fr;align-items:center;min-height:365px}.project-copy{padding:38px}.project-number{font:0.75rem Consolas,monospace;letter-spacing:1px;color:var(--purple);margin-bottom:23px}.project-card h3{font-size:1.625rem;font-weight:550;letter-spacing:-.7px;line-height:1.3;margin-bottom:15px}.project-copy>p:not(.project-number){color:var(--muted);font-size:0.9375rem;line-height:1.75}.tags{display:flex;flex-wrap:wrap;gap:7px;margin-top:23px}.tags span{font:0.75rem Consolas,monospace;line-height:1.5;padding:5px 9px;border:1px solid #34323e;border-radius:4px;color:#c5bed5;background:#1a1921}.project-preview{width:100%;height:100%;object-fit:cover;object-position:left top;min-height:250px}.feature-visual{padding:27px 0 27px 16px;position:relative;overflow:hidden;background:linear-gradient(135deg,#22202c,#14151a);height:100%;display:flex;align-items:center}.feature-visual img{width:112%;max-width:none;transform:perspective(1100px) rotateY(-9deg) rotateZ(-2deg);border:1px solid #56525c;border-radius:6px;box-shadow:0 22px 60px #0009;min-height:240px;object-fit:cover;object-position:left top}.project-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:22px;margin-top:22px}.project-grid .project-card{display:flex;flex-direction:column}.project-grid .project-copy{padding:29px;display:flex;flex-direction:column;flex:1}.project-grid .project-copy>p:not(.project-number){margin-bottom:0}.project-grid .tags{margin-bottom:24px}.project-grid h3{font-size:1.4375rem}.project-headline{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap;margin-bottom:18px}.project-headline .project-number{margin:0}.status{font-size:0.75rem;color:#c4b2ea;padding:3px 9px;border:1px solid #443751;border-radius:20px;background:#251f30;white-space:nowrap}.status.building{color:#bad0f1;border-color:#334359;background:#1c2632}.detail-button{display:flex;justify-content:space-between;align-items:center;gap:20px;text-align:left;width:100%;margin-top:auto;border-top:1px solid var(--line);background:none;padding:18px 0 0;font-size:0.875rem}.detail-button:hover{color:var(--purple)}.flagship .detail-button{margin-top:25px}.detail-button span:last-child{font-size:1.375rem;color:var(--purple)}.card-art{height:170px;overflow:hidden;border-bottom:1px solid var(--line);background:#16161f;display:flex;align-items:center;justify-content:center}.code-art{padding:24px 30px;display:block;font:0.75rem/1.9 Consolas,monospace;color:#c7bfda}.code-art .comment{color:#868197}.code-art .syntax{color:var(--purple)}.code-art .value{color:#9bc8c1}.code-art span{display:block}.mini-flow{display:flex;align-items:center;justify-content:center;gap:12px;padding:20px;flex-wrap:wrap}.flow-node{font:0.75rem Consolas,monospace;padding:12px 15px;border:1px solid #4a3c61;background:#251d32;border-radius:6px;text-align:center;color:#ddd1f6}.flow-connector{color:#78698f}.flow-node.blue{border-color:#354863;background:#1b2637;color:#bacff1}.mini-flow small{font-size:0.75rem;display:block;color:#aaa2bd;margin-top:4px}.project-art-image{width:100%;height:100%;object-fit:cover;object-position:50% 58%;filter:saturate(.75)}.minor-heading{display:flex;gap:24px;align-items:center;margin-top:45px;font:0.8125rem Consolas,monospace;color:var(--muted);letter-spacing:1px}.minor-heading:after{content:'';height:1px;background:var(--line);flex:1}.project-grid.secondary-grid{grid-template-columns:repeat(3,minmax(0,1fr))}.secondary-grid .project-copy{padding:25px}.secondary-grid h3{font-size:1.3125rem}.secondary-grid .card-art{height:155px}.skills-section{background:#101115;border-block:1px solid var(--line)}.skills-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:32px 40px}.skill-group{border-top:1px solid #36323f;padding-top:20px}.skill-group h3{font-size:1rem;font-weight:500;margin-bottom:13px}.skill-group h3 span{font:0.75rem Consolas,monospace;color:var(--purple);margin-right:12px}.skill-group p{color:var(--muted);font-size:0.875rem;line-height:1.9;margin:0}.learning{display:grid;grid-template-columns:220px 1fr;gap:35px;margin-top:42px;padding:27px 0 0;border-top:1px solid var(--line)}.learning h3{font-size:0.875rem;font-weight:500;margin:0;color:var(--purple)}.learning p{color:var(--muted);font:0.8125rem/2 Consolas,monospace;margin:0}.timeline{margin-top:15px}.experience-row{display:grid;grid-template-columns:230px 1fr;gap:40px;padding:30px 0;border-top:1px solid var(--line)}.experience-date{font:0.8125rem/1.8 Consolas,monospace;color:var(--muted)}.experience-body h3{font-size:1.375rem;font-weight:500;letter-spacing:-.3px;margin-bottom:4px}.experience-body .role{color:var(--purple);font-size:0.875rem;margin-bottom:15px}.experience-body>p:last-child{color:var(--muted);font-size:0.9375rem;max-width:760px;margin-bottom:0}.education{display:grid;grid-template-columns:1fr 1fr;gap:35px;margin-top:42px;border-top:1px solid var(--line);padding-top:35px}.education h3{font-size:1rem;font-weight:500}.education p{font-size:0.875rem;color:var(--muted)}.certificate{display:block;border:1px solid #463754;border-radius:10px;padding:25px 28px;background:linear-gradient(115deg,#211a2c,#14151a);transition:border-color .2s}.certificate:hover{border-color:var(--purple)}.certificate-title{display:flex;justify-content:space-between;font-size:1.3125rem;margin-bottom:13px}.certificate p{margin:0 0 6px}.certificate .cert-expiry{font-size:0.75rem;color:#b9a5d5}.contact-section{border-block:1px solid #302b3b;background:radial-gradient(ellipse at 80% 110%,#33204950,transparent 65%),#111015}.contact-layout{display:grid;grid-template-columns:1fr 1fr;gap:70px;align-items:center}.contact-layout h2{font-size:clamp(2.1875rem,4vw,3.3125rem);max-width:600px;line-height:1.15}.contact-layout p:not(.eyebrow){color:var(--muted);font-size:0.9375rem;max-width:500px;margin:23px 0 0}.contact-links{display:grid}.contact-link{display:flex;justify-content:space-between;gap:20px;align-items:center;border-bottom:1px solid #38303e;padding:20px 0;min-width:0}.contact-link:first-child{border-top:1px solid #38303e}.contact-link small{display:block;color:var(--muted);font-size:0.75rem;margin-bottom:3px}.contact-link strong{font-size:clamp(1rem,1.6vw,1.3125rem);font-weight:400;overflow-wrap:anywhere}.contact-link>span:last-child{font-size:1.5rem;color:var(--purple)}.contact-link:hover strong{color:var(--purple)}.site-footer{min-height:110px;display:flex;align-items:center;justify-content:space-between;gap:20px;color:var(--muted);font-size:0.75rem}.site-footer .brand-mark{font-size:1.5rem;color:var(--text)}dialog{background:#14151b;border:1px solid #44404e;border-radius:14px;color:var(--text);width:min(880px,calc(100% - 36px));max-height:88dvh;padding:0;box-shadow:0 30px 100px #0008}dialog::backdrop{background:#050508db;backdrop-filter:blur(7px)}.dialog-bar{position:sticky;top:0;background:#14151bf5;display:flex;justify-content:space-between;align-items:center;padding:16px 30px;border-bottom:1px solid var(--line);z-index:1}.dialog-bar .eyebrow{margin:0;font-size:0.75rem}.icon-button{background:#28252f;width:40px;height:40px;border-radius:50%;font-size:1.5625rem;line-height:1}.icon-button:hover{background:#4b3b62}#dialog-content{padding:32px 36px 38px}#dialog-content h2{margin:15px 0 20px;font-size:2rem}#dialog-content .lead{color:#c0bbcc;font-size:1rem}#dialog-content h3{font-size:1rem;font-weight:500;margin:30px 0 12px;color:var(--purple)}.detail-list{padding-left:20px;color:#c3becc;font-size:0.9375rem;line-height:1.85}.detail-list li{padding-left:5px;margin-bottom:6px}.detail-list li::marker{color:#8f73bb}.dialog-links{display:flex;flex-wrap:wrap;gap:10px;margin-top:27px}.dialog-links .button{font-size:0.8125rem;padding:10px 16px;gap:10px}.gallery{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px;margin-top:28px}.gallery.single{grid-template-columns:1fr}.gallery button{background:#1b1c24;border:1px solid #3c3746;padding:0;border-radius:7px;overflow:hidden;text-align:left}.gallery img{width:100%;height:180px;object-fit:cover;object-position:left top}.gallery.single img{height:auto;max-height:370px;object-fit:contain}.gallery span{display:block;padding:12px 15px;font-size:0.75rem;color:var(--muted)}.image-dialog{width:min(1500px,calc(100% - 30px));background:#0d0e12;padding:55px 14px 10px;overflow:auto}.image-dialog .icon-button{position:absolute;right:12px;top:9px}.image-dialog img{max-height:72dvh;max-width:100%;object-fit:contain;margin:auto}.image-dialog p{font-size:0.8125rem;color:var(--muted);text-align:center;margin:10px}.noscript-note{padding-block:35px;color:var(--muted)}.project-card,.certificate{transition:border-color .25s}.project-card:hover{border-color:#51425e}::selection{background:#71529a;color:white}
@media(min-width:1600px){.hero{padding-block:110px 100px}}
@media(max-width:1050px){.container,.header-inner{width:calc(100% - 56px)}.hero{gap:6%;padding-block:65px}.hero-description{font-size:0.9375rem}h1{font-size:4.75rem}.site-header nav{gap:18px}.brand-domain{display:none}.hero-role{font-size:1.1875rem}.terminal-note{left:-20px;padding:14px 18px;font-size:0.75rem}.project-grid.secondary-grid{grid-template-columns:1fr 1fr}.secondary-grid .project-card:last-child{grid-column:1/-1;display:grid;grid-template-columns:1fr 1fr}.secondary-grid .project-card:last-child .card-art{height:100%;min-height:260px;border-bottom:0}.project-copy{padding:28px}.flagship{grid-template-columns:1fr 1fr}.contact-layout{gap:40px}}
@media(max-width:760px){.container,.header-inner{width:calc(100% - 40px)}.header-inner{min-height:72px;gap:10px}.site-header nav[data-nav]{display:none}.header-actions{gap:7px}.menu-toggle{display:block}.github-header{display:none}.site-header .mobile-nav{display:grid;padding:5px 20px 20px;gap:0}.mobile-nav a{padding:12px 0;border-top:1px solid var(--line)}.hero{grid-template-columns:1fr;gap:50px;padding-block:54px 60px}.hero-copy{max-width:550px}h1{font-size:clamp(4rem,15vw,5.8125rem);letter-spacing:-3.8px}.hero-description{font-size:1rem}.hero-role{font-size:1.3125rem}.hero-visual{width:80%;max-width:400px;margin:0 auto;justify-self:center}.terminal-note{left:-22px}.hero-location{font-size:0.75rem}.stack-strip .container{justify-content:center;gap:11px 16px;padding-block:20px;font-size:0.75rem}.stack-strip i{display:none}.section{padding-block:62px}.section-heading{display:block;margin-bottom:27px}.section-heading>p{margin-top:18px;max-width:500px}.section-heading .eyebrow{margin-bottom:12px}h2{font-size:2.125rem}.flagship{grid-template-columns:1fr}.feature-visual{min-height:230px;padding:24px 15px}.feature-visual img{max-height:280px;width:100%;object-fit:contain;min-height:0;transform:rotate(-2deg)}.project-grid,.project-grid.secondary-grid{grid-template-columns:1fr}.secondary-grid .project-card:last-child{grid-column:auto;display:flex}.secondary-grid .project-card:last-child .card-art{height:190px;min-height:0}.project-copy,.project-grid .project-copy,.secondary-grid .project-copy{padding:25px}.project-card h3{font-size:1.5625rem}.skills-grid{grid-template-columns:1fr 1fr;gap:27px 20px}.learning{grid-template-columns:1fr;gap:10px}.experience-row{grid-template-columns:1fr;gap:12px;padding-block:25px}.experience-body h3{font-size:1.375rem}.education{grid-template-columns:1fr;gap:20px}.contact-layout{grid-template-columns:1fr;gap:35px}.contact-layout h2{font-size:2.5rem}.contact-link strong{font-size:1.1875rem}.site-footer{min-height:100px;gap:12px;font-size:0.75rem}.site-footer .brand-mark{font-size:1.375rem}.dialog-bar{padding:12px 20px}#dialog-content{padding:23px}#dialog-content h2{font-size:1.6875rem}.gallery{grid-template-columns:1fr}.gallery img{height:auto}.gallery.single img{max-height:400px}.button{padding:13px 19px}.project-number{font-size:0.75rem}}
@media(max-width:380px){.container,.header-inner{width:calc(100% - 30px)}h1{font-size:3.8125rem}.hero-role{font-size:1.125rem}.hero-buttons{gap:8px}.button{padding-inline:14px;gap:12px}.skills-grid{grid-template-columns:1fr}.hero-visual{width:86%}.terminal-note{left:-10px;font-size:0.75rem}.brand-mark{font-size:1.625rem}.language button{padding-inline:7px}.site-footer{flex-wrap:wrap;padding-block:25px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*:before,*:after{transition:none!important;animation:none!important}}
@media(min-width:761px){.project-grid:not(.secondary-grid)>.project-card:last-child{grid-column:1/-1;display:grid;grid-template-columns:.85fr 1.15fr}.project-grid:not(.secondary-grid)>.project-card:last-child>.card-art{height:100%;min-height:280px;border-bottom:0;border-right:1px solid var(--line)}}
/* Keep media proportional and narrow screens free of horizontal overflow. */
.portrait{height:auto}.feature-visual img{height:auto;max-height:360px;object-fit:cover}.flagship{min-height:365px}.contact-layout>*{min-width:0}.contact-layout h2{overflow-wrap:break-word}.contact-link>span:first-child{min-width:0}.hero-description,.project-copy>p:not(.project-number),.experience-body>p:last-child,.contact-layout p:not(.eyebrow){font-size:1rem}
@media(max-width:380px){.contact-layout h2{font-size:2rem;letter-spacing:-1px}}
.skip-link{top:0;transform:translateY(-150%)}.skip-link:focus{top:12px;transform:translateY(0)}