:root{--ink:#10100f;--paper:#f2efe6;--orange:#ff6a36;--blue:#4ab4ff;--mint:#78d6b2;--line:rgba(16,16,15,.18)}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:var(--paper);color:var(--ink);font-family:"SFMono-Regular",Consolas,"Liberation Mono",monospace;line-height:1.55}
a{color:inherit}
.masthead{height:72px;display:flex;align-items:center;justify-content:space-between;padding:0 clamp(22px,5vw,72px);border-bottom:1px solid var(--line);font-size:12px;letter-spacing:.08em;position:relative;z-index:3}
.wordmark,.github-link{text-decoration:none;font-weight:800}.wordmark span{color:var(--orange);padding:0 4px}.github-link:hover{text-decoration:underline}
.hero{min-height:calc(100vh - 72px);padding:clamp(72px,11vw,150px) clamp(22px,8vw,120px) 64px;display:flex;flex-direction:column;justify-content:center;position:relative;overflow:hidden}
.eyebrow{text-transform:uppercase;font-weight:800;font-size:12px;letter-spacing:.16em;margin:0 0 24px}
h1,h2,h3{font-family:Georgia,"Times New Roman",serif;font-weight:400;letter-spacing:-.055em;margin:0;line-height:.92}
h1{font-size:clamp(68px,12vw,174px);max-width:1100px;position:relative;z-index:1}h1 em{color:var(--orange);font-weight:400}
.lede{font-size:clamp(16px,1.7vw,22px);max-width:670px;margin:48px 0 42px;position:relative;z-index:1}.down{font-weight:800;text-decoration:none;position:relative;z-index:1}.down span{color:var(--orange)}
.orbit{position:absolute;border:1px solid var(--line);border-radius:50%;pointer-events:none}.orbit:after{content:"";position:absolute;width:14px;height:14px;border-radius:50%;background:var(--orange);top:20%;left:5%}.orbit-a{width:42vw;height:42vw;right:-10vw;top:6vw}.orbit-b{width:25vw;height:25vw;right:4vw;top:15vw;transform:rotate(110deg)}
.projects{border-top:1px solid var(--line)}.section-heading{padding:100px clamp(22px,8vw,120px);display:grid;grid-template-columns:1fr 2fr 1fr;gap:36px;align-items:end}.section-heading h2{font-size:clamp(48px,7vw,96px)}.section-heading>p:last-child{max-width:360px;margin:0}
.project{min-height:620px;border-top:1px solid var(--line);padding:56px clamp(22px,8vw,120px);display:grid;grid-template-columns:150px minmax(260px,1fr) minmax(340px,1fr);gap:clamp(24px,5vw,80px);align-items:center;position:relative}.project-index{align-self:start;font-size:12px;letter-spacing:.12em;font-weight:800}.project-mark{font-size:clamp(130px,20vw,270px);text-align:center;filter:drop-shadow(14px 18px 0 rgba(255,106,54,.2))}.project-copy h3{font-size:clamp(58px,8vw,108px);margin-bottom:32px}.project-copy p{max-width:620px;font-size:17px}.project-copy ul{display:flex;flex-wrap:wrap;list-style:none;padding:0;margin:28px 0 40px;gap:8px}.project-copy li{border:1px solid currentColor;border-radius:99px;padding:7px 12px;font-size:11px;text-transform:uppercase;letter-spacing:.06em}.actions{display:flex;gap:20px;align-items:center;flex-wrap:wrap}.button{display:inline-block;background:var(--ink);color:var(--paper);padding:14px 20px;text-decoration:none;font-weight:800;font-size:13px}.button:hover{transform:translate(-2px,-2px);box-shadow:4px 4px 0 var(--orange)}.text-link{font-size:13px;font-weight:800}
.project-delagger{background:#ffd7c8}.project-senel{background:#cceee2}.project-pets{background:#cceaff}.senel-mark{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;text-align:center}.senel-mark b{font:400 clamp(68px,10vw,132px)/1 Georgia,serif;border-bottom:4px solid var(--mint)}.senel-mark span{grid-column:1/-1;font-size:11px;letter-spacing:.08em}.pet-stage{aspect-ratio:1;border-radius:50%;background:#0d1827;display:grid;place-items:center;box-shadow:18px 18px 0 rgba(16,16,15,.12)}.pet-stage img{width:72%;image-rendering:pixelated}
.notes{padding:110px clamp(22px,8vw,120px);border-top:1px solid var(--line)}.notes-heading{display:grid;grid-template-columns:1fr 2fr 1fr;gap:36px;align-items:end;margin-bottom:64px}.notes-heading h2{font-size:clamp(48px,7vw,94px)}.notes-heading>p:last-child{margin:0;max-width:390px}.note-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}.note{min-height:430px;padding:30px;display:flex;flex-direction:column;text-decoration:none;border:1px solid var(--ink);box-shadow:7px 7px 0 var(--ink);transition:transform .18s ease,box-shadow .18s ease}.note:hover{transform:translate(3px,3px);box-shadow:4px 4px 0 var(--ink)}.note>span{font-size:10px;text-transform:uppercase;letter-spacing:.1em;font-weight:800}.note h3{font-size:clamp(36px,4.2vw,64px);margin:48px 0 28px}.note p{font-size:14px;margin:0 0 32px}.note b{font-size:12px;margin-top:auto;text-decoration:underline}.note-orange{background:#ffd7c8}.note-mint{background:#cceee2}.note-blue{background:#cceaff}
.principles{background:var(--ink);color:var(--paper);padding:120px clamp(22px,8vw,120px)}.principles h2{font-size:clamp(52px,9vw,124px);color:var(--orange)}.principles>p:not(.eyebrow){max-width:630px;margin:44px 0 36px;font-size:18px}.button-light{background:var(--paper);color:var(--ink)}
footer{padding:30px clamp(22px,5vw,72px);display:flex;justify-content:space-between;font-size:11px;text-transform:uppercase;letter-spacing:.08em}
@media(max-width:980px){.note-grid{grid-template-columns:1fr}.note{min-height:330px}.note h3{font-size:clamp(42px,8vw,68px)}}
@media(max-width:820px){.section-heading,.notes-heading{grid-template-columns:1fr}.project{grid-template-columns:1fr;min-height:auto}.project-mark,.senel-mark,.pet-stage{max-width:360px;margin:auto}.project-index{margin-bottom:10px}.orbit{opacity:.5}footer{gap:20px;flex-direction:column}}
@media(prefers-reduced-motion:no-preference){.project .project-mark,.project .senel-mark,.project .pet-stage{transition:transform .25s ease}.project:hover .project-mark,.project:hover .senel-mark,.project:hover .pet-stage{transform:translateY(-8px) rotate(-1deg)}}
