.hero{min-height:36rem;height:calc(100svh - var(--header-height));padding:0 var(--gutter) var(--gutter);grid-template-columns:repeat(12,minmax(0,1fr));align-items:center;display:grid;overflow:hidden}.hero-clouds{min-height:calc(36rem - var(--gutter));width:100%;height:calc(100svh - var(--header-height) - var(--gutter));object-fit:cover;grid-area:1/1/auto/9;display:block}.hero-intro{z-index:1;grid-area:1/7/auto/13;position:relative}.hero-brand{bottom:calc(100% + var(--inset));position:absolute;left:clamp(-120px,-8vw,-40px)}.hero-copy{padding:var(--inset);background:var(--color-paper)}@media (prefers-reduced-motion:no-preference){[data-hero-entrance] .site-header .contact-bar{clip-path:inset(0 100% 0 0)}[data-hero-entrance] .hero-clouds{clip-path:inset(0 0 0 100%)}[data-hero-entrance] .hero-brand{clip-path:inset(100% 0 0)}[data-hero-entrance] .hero-copy{clip-path:inset(0 0 100%)}}.hero-copy p,.overview-copy p{font-size:var(--text-lead);line-height:var(--leading-copy);text-wrap:pretty;font-weight:400}.developer-overview{min-height:max(42rem,100svh);padding:var(--gutter);grid-template-columns:repeat(12,minmax(0,1fr));display:grid}.overview-overlay{display:contents}.overview-paper{object-fit:cover;grid-area:1/6/auto/10;align-self:center;width:287px;max-width:100%;height:492px;display:block}.overview-meadow{z-index:1;width:100%;height:calc(100svh - 2 * var(--gutter));object-fit:cover;grid-area:1/8/auto/13;display:block;position:relative}.developer-links{z-index:2;align-self:end;gap:var(--space-3);flex-direction:column;grid-area:1/1/auto/5;display:flex;position:relative}.developer-links .eyebrow{margin-bottom:var(--space-2)}.developer-links a{font-size:var(--text-lead);line-height:var(--leading-copy)}.overview-copy{z-index:2;padding:clamp(var(--space-4), 2vw, var(--space-7)) var(--inset);background:var(--color-paper);grid-area:1/3/auto/9;align-self:center;position:relative;transform:translate(12vw,-26svh)}@media (width>=761px) and (width<=1100px){.hero-copy{padding:var(--space-7)}.developer-links{grid-column:1/7}}@media (width<=760px){.hero{height:calc(100svh - var(--mobile-header-height,80px));min-height:min-content;padding-bottom:var(--space-6);grid-template-rows:minmax(140px,1fr) auto;grid-template-columns:repeat(6,minmax(0,1fr));display:grid;overflow:visible}.hero-clouds{grid-area:1/1/auto/7;height:100%}.hero-intro{grid-area:2/2/auto/7;margin-top:-50px}.hero-brand{bottom:calc(100% + 28px);left:-30px}.hero-copy{padding:var(--space-7) 0 0 var(--space-6)}.hero-copy p{font-size:clamp(1.25rem,5.6vw,1.4375rem)}.developer-overview{height:100svh;min-height:560px;padding-block:var(--space-5);row-gap:var(--space-6);grid-template-rows:minmax(0,1fr) auto;grid-template-columns:repeat(6,minmax(0,1fr))}.overview-overlay{width:min(100%, calc(32ch + var(--space-5)));padding:var(--space-5) 0 var(--space-5) var(--space-5);grid-area:1/1/auto/7;align-self:center;display:grid;position:relative}.overview-copy{width:100%;padding:var(--space-6);grid-area:1/1;max-width:32ch;transform:none}.overview-copy p{font-size:clamp(1.25rem,5.6vw,1.4375rem)}.overview-paper{grid-area:auto;width:215px;height:100%;position:absolute;inset:0 auto auto 0}.overview-meadow{contain:size;grid-area:1/3/auto/7;height:100%;min-height:0}.developer-links{gap:var(--space-3);grid-area:2/1/auto/7}.developer-links a{font-size:var(--text-lead)}}@media (width<=380px){.page-surface{--mobile-header-height:98px}}@media (width<=760px){.hero-clouds{min-height:0}}.work-shelf{--spine:clamp(48px, 6vw, 88px);height:100svh;min-height:640px;display:flex}.shelf-index{padding:var(--inset);justify-content:space-between;gap:var(--space-8);flex-direction:column;flex:0 0 clamp(280px,30vw,440px);display:flex}.shelf-index .eyebrow{margin-bottom:var(--space-4)}.shelf-index h2{font-size:var(--text-section);letter-spacing:-.01em;font-weight:500;line-height:1}.shelf-links{gap:var(--space-2);flex-direction:column;display:flex}.shelf-links a{min-height:24px;font-size:clamp(20px,1.8vw,28px);line-height:var(--leading-copy)}.shelf-links [data-project-link=aleli]{white-space:nowrap}.shelf-books{overscroll-behavior-x:contain;scrollbar-width:thin;flex:auto;justify-content:flex-end;min-width:0;display:flex;overflow:auto hidden;container-type:inline-size}.shelf-track{width:min(100%, calc(var(--book-count) * var(--spine) + min(560px, 36vw)));flex:none;justify-content:flex-end;height:100%;display:flex;container-type:inline-size}.work-book{--panel:min(560px, 36vw, calc(100cqw - var(--book-count) * var(--spine)));flex:0 0 var(--spine);min-width:var(--spine);border-left:var(--rule);border-block:var(--rule);background:var(--book-color);height:100%;color:var(--book-ink);transition:flex-grow var(--motion-slow) var(--ease-out);position:relative;overflow:hidden}.work-book[open]{flex-grow:1000}.book-spine{width:var(--spine);padding:var(--space-6) 0 var(--space-5);cursor:pointer;flex-direction:column;align-items:center;list-style:none;display:flex;position:absolute;inset:0 auto 0 0}.book-spine::-webkit-details-marker{display:none}.book-spine:focus-visible{outline-offset:-6px}.spine-project-link{display:none}@media (hover:hover) and (pointer:fine) and (width>=761px){.spine-project-link{display:block;position:absolute;inset:0}}.spine-label{font-family:var(--font-mono);font-size:var(--text-caption);letter-spacing:.1em}.spine-label:first-child{text-transform:uppercase}.spine-title{margin-top:var(--space-4);writing-mode:vertical-rl;white-space:nowrap;font-size:clamp(20px,1.8vw,26px);font-weight:500;line-height:1}.spine-rule{width:60%;margin-top:var(--space-5);border-top:1px solid}.spine-year{writing-mode:vertical-rl;font-family:var(--font-mono);font-size:var(--text-caption);letter-spacing:.06em;white-space:nowrap;margin-top:auto}.spine-year+.spine-rule{margin:var(--space-5) 0 var(--space-3)}.spine-number{font-family:var(--font-mono);font-size:var(--text-body)}.book-panel{top:0;left:var(--spine);width:var(--panel);height:100%;padding:var(--space-6) var(--space-7) var(--space-6) var(--space-2);gap:var(--space-5);flex-direction:column;display:flex;position:absolute}.book-image{border:1px solid var(--book-ink);background:var(--color-canvas);flex:1;min-height:0;position:relative;overflow:hidden}.book-image img{width:100%;height:100%;display:block}.book-image-contain{background:var(--book-color);padding:6%}.book-preview{opacity:0;pointer-events:none;background:var(--book-color);width:100%;height:100%;position:absolute;inset:0}.book-image-contain .book-preview{padding:6%}.book-preview[data-playing]{opacity:1}.book-preview-toggle{top:calc(var(--space-6) + var(--space-2));right:calc(var(--space-7) + var(--space-2));z-index:1;min-height:36px;padding:var(--space-2);border:1px solid var(--book-ink);color:var(--book-ink);background:var(--book-color);font-family:var(--font-mono);font-size:var(--text-caption);cursor:pointer;position:absolute}@media (pointer:coarse){.book-preview-toggle{min-height:44px}}.book-caption{gap:var(--space-2);flex-direction:column;display:flex}.book-caption h3{font-size:var(--text-title);font-weight:500;line-height:var(--leading-heading)}.book-caption p{font-family:var(--font-mono);font-size:var(--text-label);line-height:var(--leading-detail)}@media (width<=760px){.work-shelf{height:100svh;min-height:440px;padding-top:var(--space-5);grid-template-rows:auto minmax(0,1fr);display:grid}.shelf-index{padding:var(--space-5) var(--gutter) var(--space-8)}.shelf-links{display:none}.shelf-books{scroll-snap-type:x proximity;scrollbar-width:none;height:100%;padding-block:var(--space-3) var(--space-8);scroll-padding-inline:14vw;display:block;overflow:auto hidden}.shelf-books::-webkit-scrollbar{display:none}.shelf-books[data-magnet-ready]{scroll-snap-type:none}.shelf-track{--spine:40px;justify-content:flex-start;gap:var(--space-4);width:max-content;height:100%;min-height:0;padding-inline:14vw;display:flex;position:relative;container-type:normal}.work-book,.work-book[open]{--panel:calc(72vw - var(--spine));border:var(--rule);scroll-snap-align:center;width:72vw;height:100%;transform:scale(var(--book-scale,1));transform-origin:50%;flex:0 0 72vw;transition:none}.book-spine{padding-block:var(--space-5)}.spine-title{font-size:21px}.spine-label,.spine-year{font-size:10px}.book-panel{padding:var(--space-4) var(--space-4) var(--space-4) var(--space-2);gap:var(--space-4)}.book-caption h3{font-size:clamp(24px,7vw,32px)}.book-caption p{font-size:var(--text-caption)}}@media (width<=760px) and (height<=700px){.book-spine .spine-label,.book-spine .spine-rule,.book-spine .spine-year{display:none}.spine-title{margin-top:0;font-size:18px}.spine-number{margin-top:auto}}.shelf-links [aria-current]:after{transform:scaleX(1)}
