:root{color-scheme:dark;--bg:#080b0e;--ink:#f0f0e9;--muted:#a7adb3;--lime:#c6db95;--sans:'Manrope',Arial,sans-serif;--mono:'DM Mono',monospace}
*{box-sizing:border-box}
html{background:var(--bg)}
body{margin:0;color:var(--ink);font-family:var(--sans);-webkit-font-smoothing:antialiased}
::selection{background:var(--lime);color:var(--bg)}
a{color:inherit}
.page{position:relative;z-index:2;max-width:1920px;min-height:100svh;margin:auto;padding:42px clamp(24px,5.2vw,100px) 30px;display:flex;flex-direction:column}
header{display:flex;justify-content:space-between;align-items:center;gap:24px}
.wordmark{display:flex;gap:15px;align-items:center;text-decoration:none;font-size:12px;font-weight:600;letter-spacing:.15em;line-height:1.3}
.mark{display:flex;gap:4px;align-items:center;height:31px;transform:skew(-16deg)}
.mark i{width:3px;height:24px;background:var(--ink)}
.mark i:nth-child(2){height:34px}
.mark i:nth-child(3){height:16px}
.discipline{font:400 12px var(--mono);letter-spacing:.13em;color:var(--muted)}
main{flex:1;display:flex;flex-direction:column;justify-content:center;padding:70px 0 48px}
h1{font-size:clamp(64px,7.7vw,132px);font-weight:400;letter-spacing:-.067em;line-height:1.04;margin:0;position:relative}
h1>span{color:#9eaeca}
.introduction{width:min(430px,100%);align-self:flex-end;margin-top:-38px;position:relative}
.introduction p{font-size:16px;line-height:1.8;margin:0;color:var(--muted)}
.introduction .intro-title{color:var(--ink);margin-bottom:16px;font-size:16px;line-height:1.65}
footer{display:flex;align-items:center;justify-content:space-between;gap:24px;border-top:1px solid #ffffff20;padding-top:25px}
.availability{display:flex;align-items:center;gap:11px;font:400 12px var(--mono);margin:0;color:#c3c8c5}
.availability>span{width:5px;height:5px;border-radius:50%;background:var(--lime);box-shadow:0 0 12px #c6db9530}
.email{font-size:15px;display:inline-flex;gap:32px;align-items:center;text-decoration:none;padding:8px 0;transition:color .2s}
.email>span{font-size:21px;transition:transform .25s}
a.email:hover{color:var(--lime)}
a.email:hover>span{transform:translate(3px,-3px)}
a:focus-visible{outline:2px solid var(--lime);outline-offset:8px}
.atmosphere{position:fixed;inset:0;overflow:hidden;pointer-events:none;background:radial-gradient(ellipse at 82% 39%,#15233233,transparent 55%)}
.light{position:absolute;right:-12%;top:-24%;width:68vw;height:77vw;transform:rotate(-32deg);border-radius:50%;background:radial-gradient(ellipse at center,transparent 43%,#5b799f0b 48%,#859cb223 50%,#335b9225 53%,#263f6517 59%,transparent 67%);filter:blur(24px);opacity:.85;animation:breathe 20s ease-in-out infinite alternate}
.grain{position:fixed;inset:0;z-index:3;pointer-events:none;opacity:.035;background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 180 180' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Cpath fill='%23fff' filter='url(%23n)' d='M0 0h180v180H0z'/%3E%3C/svg%3E")}
header,main,footer{animation:arrive 1.1s ease both}
main{animation-delay:.1s}footer{animation-delay:.2s}
@keyframes arrive{from{opacity:0;transform:translateY(9px)}to{opacity:1;transform:translateY(0)}}
@keyframes breathe{to{transform:translate(-3%,4%) rotate(-24deg);opacity:.6}}
@media(min-width:1500px){.introduction{margin-top:-15px;width:470px}.introduction p,.introduction .intro-title{font-size:18px}}
@media(max-width:1050px){.introduction{margin-top:36px;width:400px}main{padding-top:60px}h1{font-size:clamp(64px,9vw,100px)}}
@media(max-width:600px){.page{padding:28px 24px 22px}.discipline{font-size:10px;letter-spacing:.07em;max-width:90px;text-align:right;line-height:1.6}.wordmark{font-size:10px;gap:12px}main{padding:64px 0 44px}h1{font-size:clamp(43px,10.6vw,64px);line-height:1.09;letter-spacing:-.06em}.introduction{align-self:flex-start;margin-top:40px;max-width:355px}.introduction p,.introduction .intro-title{font-size:15px;line-height:1.75}footer{align-items:flex-start;flex-direction:column;gap:14px;padding-top:22px}.email{font-size:15px;gap:23px}.availability{font-size:12px}.light{width:155vw;height:190vw;right:-86%;top:-2%;filter:blur(20px)}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation:none!important;transition:none!important}}