/* Haapsalu — an asymmetric editorial atlas, terracotta / sea blue */
:root{--ink:#22384b;--muted:#586976;--blue:#a7c7d2;--blue2:#a7432c;--yellow:#e9b87c;--paper:#faf4e8;--soft:#eee5d7;--line:#c3b9a9}
html,body{background:#faf4e8;color:#22384b}.nav{background:#faf4e8e8;border-bottom:2px solid #22384b}.nav-brand span{border-radius:3px;background:#a7432c;color:#fff4df;rotate:-8deg;border:0}.hero{background:#ede3d3;isolation:isolate}.hero-yellow{background:radial-gradient(ellipse at 30% 40%,#e9ac73,transparent 65%),#faf4e8;width:68%;clip-path:polygon(0 0,100% 0,83% 100%,0 100%)}.hero-blue{background:radial-gradient(ellipse at 30% 50%,#b6d7dc,#719eaf);width:44%;left:auto;right:0;clip-path:polygon(22% 0,100% 0,100% 100%,0 100%)}.hero-copy{max-width:1150px}.hero h1{font-family:Georgia,serif;font-weight:500;font-style:italic;letter-spacing:-.08em;rotate:-3deg;text-shadow:3px 4px 0 #faf4e888}.hero h1 span:last-child{color:#a7432c}.hero-name{letter-spacing:.06em}.hero-camera{border:10px solid #faf4e8;box-shadow:15px 18px 0 #22384b55;rotate:5deg}.hero-actions a{border-radius:2px;background:#faf4e8;border:1px solid #22384b;box-shadow:4px 4px 0 #22384b}.hero-actions a:nth-child(2){background:#a7432c;color:#fff4df;rotate:-3deg}.hero-scroll{color:#22384b}.content-panel{background:#faf4e8}.content-panel:nth-of-type(3n){background:#e6eded}.content-panel:nth-of-type(4n){background:#f2dec8}.section-heading h2,.portfolio-intro h2,.era h2{font-family:Georgia,serif;font-weight:500;letter-spacing:-.045em}.section-number{font-family:Georgia,serif;font-style:italic;color:#a7432c}.intro-meta{border:1px solid #b4a999;background:#fffaf0;box-shadow:8px 8px 0 #dcc9b2;rotate:1deg}.software-card,.project-card,.education-card{border-radius:2px!important;border-color:#b4a999!important;box-shadow:7px 7px 0 #d7e2df}.project-row:nth-child(even){background:#f4e4d0}.era-year{font-family:Georgia,serif;font-style:italic;color:#a7432c}.nav a:hover,.hero-actions a:hover{color:#a7432c;translate:0 -2px}.download{border-radius:3px!important}.scroll-progress span{background:linear-gradient(90deg,#a7432c,#e9b87c,#629ba9)}
@media(max-width:640px){.hero h1{rotate:0}.hero-camera{border-width:6px;rotate:3deg}.intro-meta{rotate:0}.hero-yellow{width:80%}.hero-blue{width:50%}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation:none!important;transition:none!important;scroll-behavior:auto!important}}