html, body { margin: 0; padding: 0; background: #2a2a1f; }
body { font-family: "Manrope", Helvetica, Arial, sans-serif; color: #F2F1E9; -webkit-font-smoothing: antialiased;font-weight: 300; }
a { color: #F2F1E9; text-decoration: none; }
a:hover { text-decoration: underline; text-underline-offset: 3px; }
[hidden] { display: none !important; }

body { background: #2a2a1f url("assets/bgr.jpg") center center / cover no-repeat; }

.page {
  --pad: clamp(24px, 3.5vw, 48px);
  --pad-r: 400px;
  position: relative; z-index: 1; min-height: 100vh; box-sizing: border-box;
  display: flex; flex-direction: column;
  padding: var(--pad) var(--pad-r) var(--pad) var(--pad);
}
@media (max-width: 767px) { .page { --pad-r: 24px; } }

header {
  display: flex; justify-content: space-between; align-items: flex-start; gap: 24px;
  margin-top: clamp(16px, 3vw, 48px);
  margin-right: calc(var(--pad) - var(--pad-r));
}
.main-logo { display: block; width: clamp(240px, 32vw, 480px); height: auto; }
nav { display: flex; gap: 16px; font-size: 15px; }
nav a { text-underline-offset: 3px; }
nav a.active { font-weight: 700; text-decoration: underline; }

.intro {
  margin: clamp(48px, 8vw, 120px) 0 0; max-width: 1400px;
  font-size: clamp(30px, 2.6vw, 43px); line-height: 1.2; font-weight: 300;
  text-wrap: pretty; display: flex; flex-direction: column; gap: 0.6em;
}
.intro span { display: block; }

.projects { list-style: none; margin: clamp(56px, 8vw, 120px) 0 0; padding: 0; width: 100%; display: flex; flex-direction: column; gap: 52px; }
.projects li { border-top: 1px solid #F2F1E9; padding-top: 40px; margin-right: calc(var(--pad) - var(--pad-r)); padding-right: calc(var(--pad-r) - var(--pad)); font-size: 1.4em; line-height: 1.4; text-wrap: pretty; display: flex; flex-direction: column; }.projects .logo { display: block; height: 40px; width: auto; max-width: 100%; object-fit: contain; object-position: left; margin-bottom: 24px; }
.projects p { margin: 0; }
.links { margin-top: 20px; display: flex; flex-direction: column; }

footer { margin-top: auto; padding-top: clamp(56px, 8vw, 120px); font-size: 13px; }
