.github-main { overflow: clip; }
.github-hero { position: relative; min-height: 600px; display: grid; grid-template-columns: minmax(0, 1.15fr) minmax(280px, .7fr); align-items: center; gap: clamp(40px, 8vw, 120px); padding-block: clamp(82px, 12vw, 156px) 132px; }
.github-intro { max-width: 760px; }
.github-intro h1, .github-note h2 { margin: 22px 0; font: 400 clamp(48px, 7vw, 88px)/.99 var(--serif); letter-spacing: -.045em; }
.github-intro h1 em, .github-note h2 em { color: var(--accent); font-weight: 400; }
.github-lede { max-width: 530px; margin: 0 0 30px; color: var(--muted); font-size: clamp(16px, 1.8vw, 19px); line-height: 1.8; }
.github-profile-card { position: relative; min-height: 300px; padding: 32px; border: 1px solid var(--line-strong); background: radial-gradient(circle at 88% 7%, color-mix(in srgb, var(--accent) 14%, transparent), transparent 38%), var(--bg-raised); }
.github-monogram { width: 62px; height: 62px; display: grid; place-items: center; margin-bottom: 32px; border: 1px solid var(--accent); border-radius: 50%; color: var(--accent); font: 30px var(--serif); }
.github-monogram span { margin-left: -7px; font: 10px var(--mono); }
.github-profile-card h2 { margin: 8px 0; font: 400 32px var(--serif); }
.github-profile-card h2 span { color: var(--accent); }
.github-profile-card > p:not(.project-kicker) { margin: 0 0 20px; color: var(--muted); font-size: 13px; }
.github-index { position: absolute; bottom: 43px; left: 0; display: flex; align-items: center; gap: 16px; color: var(--faint); font: 9px var(--mono); letter-spacing: .12em; }
.github-index i { width: 54px; border-top: 1px solid var(--line-strong); }
.github-projects { padding-block: 80px 112px; border-top: 1px solid var(--line); }
.github-repo-grid { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 18px; margin-top: 40px; }
.github-repo-card { position: relative; min-height: 400px; padding: 26px 28px 24px; border: 1px solid var(--line); background: var(--bg-raised); transition: border-color .25s ease, transform .25s ease; }
.github-repo-card:hover { transform: translateY(-4px); border-color: var(--line-strong); }
.repo-topline { display: flex; justify-content: space-between; color: var(--faint); font: 9px var(--mono); letter-spacing: .1em; }
.repo-symbol { width: 68px; height: 68px; display: grid; place-items: center; margin: 36px 0 26px; border: 1px solid var(--line-strong); color: var(--accent); font-size: 32px; }
.repo-sky { color: var(--accent-cool); }
.github-repo-card h3 { margin: 8px 0 12px; font: 400 clamp(25px, 3vw, 34px) var(--serif); letter-spacing: -.025em; }
.github-repo-card > p:not(.project-kicker) { max-width: 480px; min-height: 58px; margin: 0; color: var(--muted); font-size: 13px; line-height: 1.8; }
.repo-tags { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 18px; }
.repo-tags span { padding: 5px 9px; border: 1px solid var(--line); color: var(--muted); font: 9px var(--mono); }
.repo-link { display: inline-flex; align-items: center; gap: 8px; margin-top: 25px; color: var(--accent); font-size: 13px; }
.repo-link span, .repo-link, .github-profile-card .text-link { transition: gap .2s ease, color .2s ease; }
.repo-link:hover { gap: 13px; }
.repo-note { display: block; margin-top: 10px; color: var(--faint); font-size: 10px; }
.github-note { display: grid; grid-template-columns: .7fr 1.2fr auto; align-items: end; gap: 44px; padding: 55px 0 90px; border-top: 1px solid var(--line); }
.github-note h2 { margin: 0 0 16px; font-size: clamp(40px, 5vw, 62px); }
.github-note > div > p { max-width: 590px; margin: 0; color: var(--muted); font-size: 14px; line-height: 1.9; }
.github-note .button { white-space: nowrap; }
.github-footer { grid-template-columns: 1fr 1fr 1fr auto; }
@media (max-width: 850px) { .github-hero { min-height: auto; grid-template-columns: 1fr .75fr; gap: 34px; padding-bottom: 120px; } .github-note { grid-template-columns: 1fr 2fr; } .github-note .button { grid-column: 2; justify-self: start; } }
@media (max-width: 650px) { .github-hero { grid-template-columns: 1fr; gap: 34px; padding-block: 72px 100px; } .github-intro h1 { font-size: clamp(46px, 13vw, 67px); } .github-profile-card { min-height: 250px; } .github-index { bottom: 35px; font-size: 7px; gap: 9px; } .github-index i { width: 22px; } .github-projects { padding-block: 62px 76px; } .github-repo-grid { grid-template-columns: 1fr; margin-top: 28px; } .github-repo-card { min-height: 0; padding: 22px; } .github-repo-card > p:not(.project-kicker) { min-height: 0; } .repo-symbol { margin: 26px 0 20px; } .github-note { grid-template-columns: 1fr; gap: 18px; padding-block: 42px 65px; } .github-note .button { grid-column: 1; } .github-footer { grid-template-columns: 1fr auto; } .github-footer > p { display: none; } .github-footer .back-top { grid-column: 1; grid-row: 2; } .github-footer small { grid-column: 2; grid-row: 2; } }
@media (prefers-reduced-motion: reduce) { .github-repo-card, .repo-link, .github-profile-card .text-link { transition: none; } .github-repo-card:hover { transform: none; } }