@charset "UTF-8";
:root{--paper:#f4f2eb;--ink:#303b31;--olive:#4c5b3d;--muted:#737b6b;--mint:#45695f;--mint-soft:#e0eae3;--mint-line:#b9cec2;--line:#d9dcd0;--serif:Georgia,"Times New Roman",serif;--sans:"Segoe UI",Arial,sans-serif}
*{box-sizing:border-box}[hidden]{display:none!important}
html{height:100%;background:var(--paper)}
body{margin:0;height:100svh;overflow:hidden;color:var(--ink);font-family:var(--sans);-webkit-font-smoothing:antialiased}
body::before{content:"";position:fixed;inset:0;pointer-events:none;z-index:-1;background:radial-gradient(ellipse at 5% 70%,#e2e6d47a,transparent 50%),radial-gradient(ellipse at 95% 10%,#d5e5dc53,transparent 50%);animation:ambient-in 3s both}
a{color:inherit}button{font-family:inherit}button,a{-webkit-tap-highlight-color:transparent}
.svg-definitions{position:absolute;width:0;height:0;overflow:hidden}
.page{width:min(1280px,calc(100% - 100px));height:100svh;margin:auto;display:grid;grid-template-rows:80px minmax(0,1fr) 58px}
.masthead{display:flex;align-items:center;border-bottom:1px solid var(--line)}
.wordmark{display:inline-flex;align-items:center;gap:14px;text-decoration:none;font-size:22px;font-weight:450;line-height:1;letter-spacing:.65px;text-transform:uppercase}
.wordmark svg{width:32px;height:32px;flex-shrink:0;fill:none;stroke:var(--olive);stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round}
.profile{width:100%;height:100%;max-height:640px;align-self:center;display:grid;grid-template-columns:minmax(0,405px) minmax(0,670px);grid-template-rows:auto minmax(0,1fr);column-gap:clamp(38px,5.8vw,90px);row-gap:20px;justify-content:center;padding:28px 0}
.portrait{grid-column:1;grid-row:1/3;align-self:center;width:min(100%,calc((100svh - 215px)*.75));margin:0;justify-self:center;border-radius:180px 180px 10px 10px;box-shadow:0 20px 46px -20px #39432e44,0 5px 16px -8px #39432e2b}
.portrait-window{position:relative;aspect-ratio:3/4;border-radius:inherit;overflow:hidden;background:#d6d6c7;animation:portrait-open 2.3s cubic-bezier(.16,1,.3,1) both}
.portrait img{width:100%;height:100%;display:block;object-fit:cover;object-position:50% 50%;animation:portrait-settle 2.8s cubic-bezier(.16,1,.3,1) both}
.portrait-window::after{content:"";position:absolute;inset:-50%;pointer-events:none;background:linear-gradient(115deg,transparent 30%,#fff4 45%,transparent 60%);transform:translateX(100%);animation:photo-light 2.7s .2s both}
.identity{grid-column:2;grid-row:1}
h1{font-family:var(--serif);font-size:clamp(32px,3.7vw,51px);font-weight:400;line-height:1.1;letter-spacing:-1.4px;margin:0 0 13px}
.name-line{display:block;overflow:hidden;padding-bottom:3px}.name-line>span{display:block;animation:name-in 1.6s .5s cubic-bezier(.16,1,.3,1) both}
.name-given{font-size:.63em;letter-spacing:-.6px;color:var(--olive);margin-top:5px}.name-given>span{animation-delay:.72s}
.role{font-size:13px;line-height:1.5;color:#626b5d;margin:0;white-space:nowrap}
.details{grid-column:2;grid-row:2;display:flex;flex-direction:column;min-height:0}
.tabs{display:grid;grid-template-columns:.85fr 1fr 1.4fr;gap:8px;flex-shrink:0;margin-bottom:20px}
.tabs button{border:1px solid var(--line);border-radius:5px;background:#fffefa60;color:var(--ink);font-size:13px;font-weight:500;text-align:center;padding:12px 10px;cursor:pointer;transition:background .25s,color .25s,box-shadow .25s}
.tabs button[aria-selected="true"]{background:var(--olive);color:#faf9ef;border-color:var(--olive);box-shadow:0 5px 12px #39432e0d}
.tabs button:hover:not([aria-selected="true"]){background:#e9eddf}
.panel-region{flex:1;min-height:0}
.panel{height:100%;min-height:0;outline:none;--density:1}
.panel-content{width:100%}
.panel-heading{margin:0 0 calc(13px * var(--density));font-size:calc(12px * var(--density));line-height:1.55;font-weight:500;color:var(--muted)}
.qualification-heading{max-width:570px}
.qualifications{display:grid;gap:calc(11px * var(--density))}
.qualification{display:flex;align-items:flex-start;gap:10px;font-size:calc(13px * var(--density));line-height:1.5}
.qualification p{margin:0}
.qualification a{color:var(--mint);text-decoration-color:#45695f66;text-underline-offset:3px}.qualification a:hover{text-decoration-color:var(--mint)}.qualification strong{font-weight:600}
.qualification-dot{width:4px;height:4px;background:var(--mint);border-radius:50%;flex-shrink:0;margin-top:.55em}
.nav-grid{display:grid;grid-template-columns:1fr;gap:calc(6px * var(--density))}
.nav-link{min-width:0;display:flex;align-items:center;gap:calc(13px * var(--density));min-height:calc(44px * var(--density));padding:calc(9px * var(--density)) calc(14px * var(--density));text-decoration:none;border-bottom:1px solid var(--line);font-size:calc(13px * var(--density));line-height:1.5;transition:background .25s,color .25s}
.nav-link{border-radius:5px;background:#e5e9db;border-bottom-color:transparent}.nav-link.underlined>span:not(.service-icon){text-decoration:underline;text-decoration-color:#768764;text-decoration-thickness:1px;text-underline-offset:4px}

.nav-link:hover{color:var(--olive);background:#dce3cf}
.service-icon{width:20px;height:20px;flex-shrink:0;display:block;background:currentColor;mask:var(--icon) center/contain no-repeat;-webkit-mask:var(--icon) center/contain no-repeat;color:var(--olive)}
.icon-telegram{--icon:url("assets/icons/telegram.svg?v=20261017")}.icon-pinterest{--icon:url("assets/icons/pinterest.svg?v=20261017")}.icon-dzen{--icon:url("assets/icons/dzen.svg?v=20261017")}.icon-vk{--icon:url("assets/icons/vk.svg?v=20261017")}.icon-stepik{--icon:url("assets/icons/stepik.svg?v=20261017")}
.link-arrow{width:15px;height:15px;flex-shrink:0;fill:none;stroke:currentColor;stroke-width:1.3;margin-left:auto;transition:transform .25s}
.nav-link:hover .link-arrow,.course:hover .link-arrow{transform:translate(2px,-2px)}
.social-links{display:flex;gap:10px;margin-top:calc(15px * var(--density))}
.social-links a{background:var(--mint-soft);display:flex;align-items:center;justify-content:center;gap:8px;flex:1;min-width:0;border:1px solid var(--line);border-radius:5px;padding:calc(11px * var(--density)) 7px;font-size:calc(11px * var(--density));text-decoration:none;white-space:nowrap;transition:background .25s,border-color .25s}
.social-links a:hover{background:#d3e2d8;border-color:#9bb8a7}
.social-links .service-icon{width:15px;height:15px}
.tj-mark{font-family:Arial,sans-serif;font-size:11px;font-weight:800;letter-spacing:-1.5px;color:var(--olive)}
.course-grid{display:grid;grid-template-columns:1fr;gap:calc(9px * var(--density))}
.course{display:flex;align-items:center;gap:calc(14px * var(--density));min-height:calc(68px * var(--density));padding:calc(14px * var(--density));border:1px solid var(--mint-line);border-radius:7px;background:var(--mint-soft);color:#354c43;text-decoration:none;font-size:calc(13px * var(--density));line-height:1.55;transition:background .25s,border-color .25s}
.course:hover{background:#d3e2d8;border-color:#9bb8a7}
.course-title{flex:1;min-width:0}
.course .service-icon{width:19px;height:19px;color:var(--mint)}
.course .link-arrow{width:14px;height:14px}
.footer{border-top:1px solid var(--line);display:flex;align-items:center;justify-content:flex-end}
.contact-link{display:flex;align-items:center;gap:9px;text-decoration:none;font-size:12px;line-height:1;color:var(--olive);height:100%;padding:0 14px;border-radius:5px;transition:background .25s}
.contact-link>span:last-child{display:flex;align-items:center;min-height:19px;padding-bottom:1px}.contact-link:hover{background:#e5e9dc}.contact-link .service-icon{width:19px;height:19px}
a:focus-visible,button:focus-visible,.panel:focus-visible{outline:2px solid var(--mint);outline-offset:4px}
.reveal{animation:arrive 1.4s cubic-bezier(.16,1,.3,1) both;animation-delay:var(--delay,0ms)}
.footer.reveal{animation-name:ambient-in}
.panel-enter .panel-content{animation:panel-in .45s cubic-bezier(.16,1,.3,1) both}
@keyframes arrive{from{opacity:0;transform:translateY(23px)}to{opacity:1;transform:translateY(0)}}
@keyframes name-in{from{opacity:0;transform:translateY(110%) rotate(2deg)}to{opacity:1;transform:translateY(0) rotate(0)}}
@keyframes portrait-open{from{opacity:0;clip-path:inset(14% 0 6% 0 round 180px 180px 10px 10px);transform:translateY(18px)}to{opacity:1;clip-path:inset(0 round 180px 180px 10px 10px);transform:translateY(0)}}
@keyframes portrait-settle{from{transform:scale(1.1)}to{transform:scale(1)}}
@keyframes photo-light{0%{transform:translateX(-100%);opacity:0}25%{opacity:.6}100%{transform:translateX(100%);opacity:0}}
@keyframes ambient-in{from{opacity:0}to{opacity:1}}
@keyframes panel-in{from{opacity:0;transform:translateY(7px)}to{opacity:1;transform:translateY(0)}}
@media(min-width:761px) and (max-height:760px){
.page{grid-template-rows:62px minmax(0,1fr) 43px}.profile{padding:20px 0;row-gap:16px}.portrait{width:min(100%,calc((100svh - 165px)*.75))}h1{font-size:40px;margin-bottom:10px}.role{font-size:12px}.tabs{margin-bottom:16px}.tabs button{padding:10px}.qualifications{gap:calc(9px * var(--density))}.qualification{font-size:calc(12px * var(--density));line-height:1.45}.panel-heading{font-size:calc(11px * var(--density))}
}
@media(max-width:1100px) and (min-width:761px){
.page{width:calc(100% - 56px)}.profile{grid-template-columns:minmax(0,.7fr) minmax(0,1.3fr);column-gap:35px}.wordmark{font-size:20px}h1{font-size:36px}.role{font-size:11px}.tabs button{font-size:12px}.nav-grid{gap:calc(5px * var(--density))}.nav-link{font-size:calc(12px * var(--density));gap:8px}.social-links{gap:7px}
}
@media(max-width:760px){
.page{width:calc(100% - 36px);grid-template-rows:64px minmax(0,1fr) 45px}.wordmark{font-size:clamp(11px,3.1vw,17px);font-weight:450;letter-spacing:.15px;gap:9px}.wordmark svg{width:25px;height:25px}
.profile{height:100%;max-height:none;max-width:600px;justify-self:center;grid-template-columns:minmax(0,.65fr) minmax(0,1fr);grid-template-rows:auto auto minmax(0,1fr);column-gap:22px;row-gap:15px;padding:20px 0 10px}
.portrait{grid-column:1;grid-row:1;width:min(100%,calc((100svh - 530px)*.55));min-width:70px;max-width:130px;border-radius:100px 100px 6px 6px;box-shadow:0 16px 28px -13px #39432e55,0 5px 12px -7px #39432e22}
.identity{display:contents}h1{grid-column:2;grid-row:1;align-self:center;font-size:clamp(21px,5vw,31px);letter-spacing:-.8px;margin:0}.name-given{font-size:.64em;line-height:1.4;letter-spacing:-.25px;margin-top:4px}
.role{grid-column:1/-1;grid-row:2;font-size:clamp(8px,2.5vw,12px);line-height:1.4;text-align:center;justify-self:center;white-space:nowrap}
.details{grid-column:1/-1;grid-row:3}.tabs{gap:6px;margin-bottom:16px}.tabs button{font-size:11px;padding:11px 7px}
.panel-heading{font-size:calc(11px * var(--density));margin-bottom:calc(11px * var(--density))}.qualifications{gap:calc(10px * var(--density))}.qualification{font-size:calc(12px * var(--density));line-height:1.47}
.nav-grid{gap:calc(5px * var(--density))}.nav-link{font-size:calc(11px * var(--density));line-height:1.5;gap:8px;min-height:calc(43px * var(--density))}.nav-link>.service-icon{width:17px;height:17px}.nav-link .link-arrow{display:none}
.social-links{gap:6px;margin-top:calc(18px * var(--density))}.social-links a{font-size:calc(9px * var(--density));gap:5px;padding-inline:4px}.social-links .service-icon{width:13px;height:13px}
.course-grid{gap:calc(9px * var(--density))}.course{font-size:calc(12px * var(--density));line-height:1.5;padding:calc(13px * var(--density));gap:calc(12px * var(--density));min-height:calc(68px * var(--density))}
.footer{justify-content:flex-end}.contact-link{font-size:11px;padding:0 3px}.contact-link .service-icon{width:17px;height:17px}
}
@media(max-width:760px) and (max-height:700px){
.page{grid-template-rows:49px minmax(0,1fr) 35px}.profile{padding:12px 0 8px;row-gap:11px}.portrait{width:65px;min-width:65px;max-width:80px}h1{font-size:22px}.name-given{font-size:.63em}.role{font-size:clamp(8px,2.45vw,10px)}.tabs{margin-bottom:12px}.tabs button{padding:9px 5px;font-size:10px}
.panel-heading{font-size:calc(10px * var(--density))}.qualifications{gap:calc(7px * var(--density))}.qualification{font-size:calc(11px * var(--density));line-height:1.42}.nav-link{min-height:calc(37px * var(--density))}.course{font-size:calc(11px * var(--density));min-height:calc(60px * var(--density));padding:calc(11px * var(--density))}.contact-link{font-size:10px}
}
@media(max-height:500px) and (min-width:600px){
.page{width:calc(100% - 44px);grid-template-rows:43px minmax(0,1fr) 33px}.wordmark{font-size:16px}.wordmark svg{width:24px;height:24px}
.profile{grid-template-columns:minmax(0,.55fr) minmax(0,1.45fr);grid-template-rows:auto minmax(0,1fr);column-gap:28px;row-gap:10px;padding:10px 0}
.portrait{grid-column:1;grid-row:1/3;width:min(100%,calc((100svh - 108px)*.75));max-width:220px}.identity{display:block;grid-column:2;grid-row:1}h1{font-size:27px;margin-bottom:5px}.name-line{display:inline;overflow:visible}.name-given{font-size:.64em;margin-left:6px}.name-line>span{display:inline}.role{font-size:10px;text-align:left}.details{grid-column:2;grid-row:2}.tabs{margin-bottom:10px}.tabs button{padding:8px;font-size:10px}.qualification{font-size:calc(10px * var(--density));line-height:1.4}.qualifications{gap:calc(6px * var(--density))}.panel-heading{font-size:calc(10px * var(--density));margin-bottom:calc(9px * var(--density))}.nav-link{min-height:calc(25px * var(--density));font-size:calc(10px * var(--density));padding:calc(4px * var(--density)) 10px}.nav-link .service-icon{width:16px;height:16px}.nav-grid{gap:calc(3px * var(--density))}.social-links{margin-top:calc(10px * var(--density))}.social-links a{padding-block:calc(6px * var(--density))}.course{min-height:calc(43px * var(--density));font-size:calc(10px * var(--density));padding:calc(10px * var(--density));gap:calc(8px * var(--density))}.footer a{font-size:10px}
}
@media(max-height:500px) and (min-width:600px){.contact-link{padding:0 8px}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation:none!important;transition:none!important}}

