@import"https://fonts.googleapis.com/css2?family=DM+Mono:wght@400;500&family=Instrument+Serif:ital@0;1&family=Manrope:wght@400;500;600;700&display=swap";:root{font-family:Manrope,Arial,sans-serif;color:#e8edf7;background:#0b1020;font-synthesis:none}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;min-width:320px;background:#0b1020}a{color:inherit;text-decoration:none}.shell{width:min(1180px,calc(100% - 64px));margin-inline:auto}main{overflow:hidden;position:relative;background:radial-gradient(circle at 78% 16%,rgba(91,107,255,.2),transparent 28rem),radial-gradient(circle at 0% 35%,rgba(36,202,178,.09),transparent 27rem),#0b1020}main:after{content:"";position:absolute;top:0;right:0;bottom:0;left:0;opacity:.22;pointer-events:none;background-image:linear-gradient(rgba(255,255,255,.055) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.055) 1px,transparent 1px);background-size:64px 64px;-webkit-mask-image:linear-gradient(to bottom,black,transparent 70%);mask-image:linear-gradient(to bottom,black,transparent 70%)}.nav{height:100px;display:flex;justify-content:space-between;align-items:center;position:relative;z-index:1}.brand{display:grid;width:33px;height:33px;place-items:center}.brand img{display:block;width:33px;height:33px;border:1px solid rgba(232,237,247,.24);border-radius:11px;box-shadow:0 4px 14px #00000038}.nav-links,.eyebrow,.footer{font:12px DM Mono,monospace;letter-spacing:.04em}.nav-links{display:flex;gap:22px}.nav-links a{border-bottom:1px solid #75809d;padding-bottom:4px;transition:color .2s,border-color .2s}.nav-links a:hover{color:#8de7d4;border-color:#8de7d4}.hero{position:relative;z-index:1;min-height:calc(100vh - 164px);display:flex;flex-direction:column;justify-content:center;padding:30px 0 42px}.traits{display:flex;min-height:min(500px,calc(100vh - 215px));margin-inline:-22px}.trait{display:block;min-height:385px;position:relative;flex:1;overflow:hidden;padding:25px 48px;color:inherit;text-decoration:none;transition:flex .5s cubic-bezier(.2,.8,.2,1),filter .4s,opacity .4s,transform .4s}.trait:first-child{clip-path:polygon(0 0,100% 0,calc(100% - 42px) 100%,0 100%)}.trait:nth-child(2){margin-left:-42px;padding-left:78px;clip-path:polygon(42px 0,100% 0,calc(100% - 42px) 100%,0 100%)}.trait:last-child{margin-left:-42px;padding-left:78px;clip-path:polygon(42px 0,100% 0,100% 100%,0 100%)}.trait:after{content:"";position:absolute;width:190px;height:190px;right:-55px;bottom:-65px;border-radius:50%;border:1px solid currentColor;opacity:.2;box-shadow:0 0 0 28px #ffffff06,0 0 0 56px #ffffff05}.trait-index{position:relative;z-index:1;color:currentColor;font:12px DM Mono,monospace;letter-spacing:.08em;opacity:.75}.trait-title{position:relative;z-index:1;margin:0;padding-top:124px;color:#f0f3fa;font-size:clamp(2rem,3.2vw,3.8rem);line-height:.9;letter-spacing:-.075em;font-weight:600}.trait-title span{color:currentColor}.trait-developer{color:#8de7d4;background:linear-gradient(145deg,#184146b3,#0a1826e0)}.trait-developer h1{color:#eff4f8}.trait-maker{color:#ffb06b;background:linear-gradient(145deg,#5d3123c7,#201725e6)}.trait-student{color:#b0b8ff;background:linear-gradient(145deg,#2e2f66cc,#131634eb)}@media(hover:hover){.traits:hover .trait:not(:hover){filter:saturate(.55);opacity:.64}.trait:hover{flex:1.35;z-index:2}.trait:hover .trait-title{transform:translateY(-7px)}.trait-title{transition:transform .4s cubic-bezier(.2,.8,.2,1)}}.actions{display:flex;flex-wrap:wrap;gap:25px;margin-top:24px;align-items:center}.button{font-size:14px;font-weight:700;transition:transform .2s,background .2s}.button:hover{transform:translateY(-2px)}.button span{margin-left:8px}.primary{padding:16px 21px;color:#0b1020;background:#8de7d4;border-radius:3px}.primary:hover{background:#b3f7e8}.footer{position:relative;z-index:1;padding:25px 0 42px;border-top:1px solid rgba(232,237,247,.14);display:flex;color:#8390aa;gap:25px}.footer a{color:#b8c3d7;margin-left:auto}.footer a+a{margin-left:0}.footer a:hover{color:#8de7d4}@media(max-width:800px){.hero{min-height:auto}.traits{display:grid;grid-template-columns:1fr;min-height:0;margin-inline:0}.trait,.trait:nth-child(2),.trait:last-child{min-height:230px;margin-left:0;padding:25px;clip-path:none}.trait-title{padding-top:72px}}@media(max-width:650px){.shell{width:min(100% - 40px,1180px)}.nav{height:80px}.nav-links{gap:14px}.hero{min-height:calc(100vh - 163px);padding:55px 0}.trait{min-height:205px;padding:20px}.trait-title{font-size:2.8rem}.footer{flex-wrap:wrap;gap:18px}.footer a{margin-left:0}}
