:root{--color-navy-blue:#1b1b39;--color-purposium-blue:#3965fa;--color-soft-blue:#99b7fc;--color-pale-blue:#e9ebff;--color-base-white:#fff;--color-light-gray:#ededed;--color-dark-gray:#202020;--color-deep-teal:#215452;--color-green:#8cc63e;--color-pale-green:#e0ffb7;--color-yellow:#ffd16b;--color-pale-yellow:#fff2d6;--color-orange:#ff6d47;--color-brick:#6f3432;--bg:#f4f4f6;--ink:var(--color-navy-blue);--dim:#6b6b76;--accent:var(--color-purposium-blue);--cta:#000;--pad:clamp(20px, 4vw, 56px);--mono:"JetBrains Mono", ui-monospace, SFMono-Regular, Menlo, monospace;--display:"Caacupe One", system-ui, sans-serif;--paper-noise:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='260' height='260'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='2' stitchTiles='stitch'/%3E%3CfeColorMatrix values='0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 1 0 0 0 0'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E")}*{box-sizing:border-box}html,body{background:var(--bg);color:var(--ink);margin:0;padding:0}body{font-family:var(--display);-webkit-font-smoothing:antialiased;overflow-x:hidden}.sec{z-index:2;padding:clamp(88px, 13vh, 150px) var(--pad);background:var(--bg);position:relative}.sec-wrap{max-width:1180px;margin-inline:auto}.sec-head{font:500 clamp(10px, 1vw, 11px) / 1 var(--mono);letter-spacing:.22em;text-transform:uppercase;color:var(--dim);justify-content:space-between;align-items:baseline;gap:16px;display:flex}.sec-head b{color:var(--accent);font-weight:700}.sec-rule{opacity:.16;background:currentColor;height:1px;margin:14px 0 clamp(26px,5vh,54px)}.sec-title{font-family:var(--display);letter-spacing:-.03em;margin:0;font-size:clamp(42px,8.6vw,122px);font-weight:400;line-height:.9}.sec-lede{max-width:46ch;font:400 clamp(13px, 1.15vw, 15px) / 1.75 var(--mono);color:var(--dim);margin:clamp(18px,3vh,30px) 0 0}.sec--dark{--ink:var(--color-base-white);--dim:#ffffff8c;--accent:var(--color-soft-blue);background:var(--color-navy-blue);color:var(--color-base-white)}.paper{background:var(--color-base-white);position:relative}.paper:after{content:"";opacity:.14;mix-blend-mode:multiply;background-image:var(--paper-noise);pointer-events:none;background-size:220px;position:absolute;inset:0}.perf{--s:13px;--r:5.6px;-webkit-mask:radial-gradient(var(--r), #0000 98%, #000) round calc(-1 * var(--s)) calc(-1 * var(--s)) / calc(2 * var(--s)) calc(2 * var(--s)), linear-gradient(#000 0 0) no-repeat 50% / calc(100% - 2 * var(--s)) calc(100% - 2 * var(--s));mask:radial-gradient(var(--r), #0000 98%, #000) round calc(-1 * var(--s)) calc(-1 * var(--s)) / calc(2 * var(--s)) calc(2 * var(--s)), linear-gradient(#000 0 0) no-repeat 50% / calc(100% - 2 * var(--s)) calc(100% - 2 * var(--s))}.drop{filter:drop-shadow(0 22px 30px #1b1b3938)drop-shadow(0 3px 6px #1b1b391a)}.postmark{color:var(--accent);mix-blend-mode:multiply;pointer-events:none}.postmark svg{width:100%;height:auto;display:block}.postmark text{font-family:var(--mono);letter-spacing:.16em;fill:currentColor;font-weight:700}#work{background:var(--bg);padding:0 0 clamp(80px,12vh,140px);position:relative}#work.is-front{z-index:2}.work-inner{min-height:100svh;padding:clamp(96px, 14vh, 150px) var(--pad) clamp(40px, 6vh, 70px);flex-direction:column;justify-content:center;display:flex}.work-intro{width:100%;max-width:1180px;margin-inline:auto}.work-intro .sec-title{font-size:clamp(64px,15vw,210px)}.work-count{font:500 11px / 1 var(--mono);letter-spacing:.22em;text-transform:uppercase;color:var(--dim);align-items:baseline;gap:14px;margin-top:clamp(20px,4vh,38px);display:flex}.work-count i{opacity:.24;background:currentColor;flex:1;height:1px}.work-list{max-width:1180px;padding-inline:var(--pad);margin-inline:auto;overflow-x:clip}.work-stack{flex-direction:column;gap:10px;display:flex}.wrow{cursor:pointer;height:3rem;transition:height .55s cubic-bezier(.4,0,.2,1);position:relative}.wrow.is-open{height:clamp(15rem,25vw,21rem)}.wrow:focus-visible{outline:2px solid var(--accent);outline-offset:4px}.wrow-body{align-items:stretch;height:100%;display:flex}.wrow-side{opacity:0;flex-direction:column;flex:0 0;justify-content:center;gap:10px;min-width:0;transition:flex-basis .55s cubic-bezier(.4,0,.2,1),opacity .3s,padding .55s cubic-bezier(.4,0,.2,1);display:flex;overflow:hidden}.wrow.is-open .wrow-side{opacity:1;flex-basis:28%;transition-delay:0s,.16s,0s}.wrow-side--l{text-align:right;align-items:flex-end}.wrow.is-open .wrow-side--l{padding-right:clamp(14px,1.8vw,30px)}.wrow-side--r{align-items:flex-start}.wrow.is-open .wrow-side--r{padding-left:clamp(14px,1.8vw,30px)}.wrow-idx{font:700 clamp(10px, 1vw, 11px) / 1 var(--mono);letter-spacing:.24em;color:var(--accent);white-space:nowrap}.wrow-side h3{font-family:var(--display);letter-spacing:-.025em;margin:0;font-size:clamp(24px,3.2vw,46px);font-weight:400;line-height:.98}.wrow-year{font:500 clamp(10px, 1vw, 11px) / 1 var(--mono);letter-spacing:.2em;color:var(--dim)}.wrow-side p{max-width:34ch;font:400 clamp(12px, 1.05vw, 14px) / 1.7 var(--mono);color:var(--dim);margin:0}.wrow-tags{flex-wrap:wrap;gap:7px;margin:0;padding:0;list-style:none;display:flex}.wrow-tags li{font:500 10px / 1 var(--mono);letter-spacing:.12em;text-transform:uppercase;color:var(--dim);white-space:nowrap;border:1px solid #1b1b3947;border-radius:999px;padding:5px 11px}.wrow-media{flex:auto;min-width:0;position:relative}.wrow-poster{--s:8px;--r:3.4px;background:var(--c,var(--accent));height:100%;-webkit-mask:radial-gradient(var(--r), #0000 98%, #000) round calc(-1 * var(--s)) calc(-1 * var(--s)) / calc(2 * var(--s)) calc(2 * var(--s)), linear-gradient(#000 0 0) no-repeat 50% / calc(100% - 2 * var(--s)) calc(100% - 2 * var(--s));mask:radial-gradient(var(--r), #0000 98%, #000) round calc(-1 * var(--s)) calc(-1 * var(--s)) / calc(2 * var(--s)) calc(2 * var(--s)), linear-gradient(#000 0 0) no-repeat 50% / calc(100% - 2 * var(--s)) calc(100% - 2 * var(--s))}.wrow-frame{color:#fff;opacity:0;border:1.5px solid #ffffff80;flex-direction:column;justify-content:space-between;padding:clamp(8px,1vw,15px);transition:opacity .3s;display:flex;position:absolute;inset:clamp(9px,1.1vw,16px)}.wrow.is-open .wrow-frame{opacity:1;transition-delay:.18s}.wrow-corner{font:700 clamp(8px, .8vw, 10px) / 1 var(--mono);letter-spacing:.2em;text-transform:uppercase;justify-content:space-between;display:flex}.wrow-corner em{font-style:normal}.wrow-shot{object-fit:cover;opacity:0;width:100%;height:100%;transition:opacity .4s;position:absolute;inset:0}.wrow.is-open .wrow-shot{opacity:1;transition-delay:.12s}.wrow-poster:after{content:"";opacity:0;pointer-events:none;background:linear-gradient(#0a0a1a6b 0%,#0a0a1a0f 34% 66%,#0a0a1a75 100%);transition:opacity .4s;position:absolute;inset:0}.wrow.is-open .wrow-poster:after{opacity:1;transition-delay:.12s}.wrow-frame{z-index:1}.wrow-label{font:500 clamp(9px, .95vw, 11px) / 1 var(--mono);letter-spacing:.2em;text-transform:uppercase;color:#ffffffc7;align-items:center;gap:clamp(10px,1.6vw,22px);padding:0 clamp(16px,2vw,28px);transition:opacity .25s;display:flex;position:absolute;inset:0}.wrow-label strong{font-family:var(--display);letter-spacing:-.01em;text-transform:none;color:#fff;flex:1;font-size:clamp(15px,1.7vw,22px);font-weight:400}.wrow-label-y{color:#ffffffa8}.wrow--light .wrow-label{color:#1b1b39b3}.wrow--light .wrow-label strong,.wrow--light .wrow-label-y{color:var(--color-navy-blue)}.wrow.is-open .wrow-label{opacity:0}#about{background:var(--color-pale-blue)}.about-grid{grid-template-columns:minmax(0,1.15fr) minmax(0,.85fr);align-items:start;gap:clamp(28px,5vw,72px);display:grid}.letter{rotate:-.7deg}.letter-paper{background:var(--color-base-white) repeating-linear-gradient(transparent 0 31px, #1b1b3917 31px 32px);font:400 clamp(13px, 1.15vw, 15px) / 32px var(--mono);color:var(--ink);background-position:0 clamp(26px,3.4vw,46px);padding:clamp(26px,3.4vw,46px) clamp(24px,3vw,44px) clamp(30px,4vw,52px) clamp(38px,4.6vw,66px)}.letter-paper:before{content:"";inset-block:0;background:#ff6d4780;width:1px;position:absolute;left:clamp(26px,3.2vw,46px)}.letter-paper h3{font:700 clamp(15px, 1.5vw, 19px) / 32px var(--mono);letter-spacing:.02em;margin:0 0 32px}.letter-paper p{margin:0 0 32px}.letter-paper p:last-of-type{margin-bottom:0}.letter-paper mark{background:linear-gradient(transparent 62%, var(--color-yellow) 62% 92%, transparent 92%);color:inherit}.letter-sign{font-family:var(--display);color:var(--accent);margin-top:32px;font-size:clamp(26px,3.4vw,42px);line-height:1;rotate:-3deg}.about-side{flex-direction:column;gap:clamp(20px,3vh,34px);display:flex}.about-polaroid{align-self:center;width:min(100%,300px);rotate:3deg}.about-polaroid figure{background:var(--color-base-white);margin:0;padding:11px 11px 15px}.about-polaroid img{aspect-ratio:1/.86;object-fit:cover;filter:saturate(.9)contrast(1.04)sepia(.06);width:100%;display:block}.about-polaroid figcaption{font:500 10px / 1 var(--mono);letter-spacing:.14em;text-transform:uppercase;color:var(--dim);justify-content:space-between;margin-top:12px;display:flex}.about-stats{grid-template-columns:repeat(3,1fr);gap:10px;margin:0;padding:0;display:grid}.about-stats div{text-align:center;background:var(--color-base-white);border:1px solid #1b1b391a;padding:clamp(14px,1.6vw,20px) 10px}.about-stats dt{font-family:var(--display);color:var(--accent);font-size:clamp(26px,3.2vw,42px);line-height:1}.about-stats dd{font:500 9.5px / 1.4 var(--mono);letter-spacing:.16em;text-transform:uppercase;color:var(--dim);margin:8px 0 0}.notes{grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:clamp(20px,3vw,34px);display:grid}.note-card{rotate:var(--rot,0deg);transition:rotate .45s,translate .45s}.note-card:hover{translate:0 -8px;rotate:0deg}.note-paper{height:100%;color:var(--color-navy-blue);flex-direction:column;gap:20px;padding:clamp(24px,2.6vw,34px);display:flex}.note-top{justify-content:space-between;align-items:flex-start;gap:14px;display:flex}.note-quotemark{font-family:var(--display);color:var(--color-purposium-blue);font-size:54px;line-height:.6}.note-stamp{aspect-ratio:.82;background:var(--color-pale-blue);border:1.4px solid var(--color-purposium-blue);width:46px;font:700 8px / 1.3 var(--mono);letter-spacing:.08em;text-align:center;color:var(--color-purposium-blue);flex:none;place-items:center;display:grid;rotate:4deg}.note-paper blockquote{font-family:var(--display);letter-spacing:-.015em;flex:1;margin:0;font-size:clamp(19px,1.9vw,25px);line-height:1.28}.note-by{font:500 10.5px / 1.7 var(--mono);letter-spacing:.16em;text-transform:uppercase;color:#6b6b76;border-top:1px dashed #1b1b3947;padding-top:16px}.note-by strong{color:var(--color-navy-blue);font-weight:700;display:block}#colophon{--ink:var(--color-base-white);--dim:#ffffff80;--accent:var(--color-soft-blue);background:var(--cta);color:var(--color-base-white);padding-bottom:clamp(28px,5vh,46px)}.foot-cta{font-family:var(--display);letter-spacing:-.035em;color:var(--color-base-white);margin:clamp(10px,2vh,20px) 0 clamp(46px,8vh,90px);font-size:clamp(40px,9.6vw,148px);line-height:.88;text-decoration:none;display:block}.foot-cta span{transition:translate .4s cubic-bezier(.34,1.4,.64,1),color .3s;display:inline-block}.foot-cta:hover span{color:var(--color-soft-blue);translate:0 -6px}.foot-cta small{font:500 11px / 1 var(--mono);letter-spacing:.24em;text-transform:uppercase;color:var(--dim);margin-top:clamp(14px,2vh,22px);display:block}.foot-grid{grid-template-columns:repeat(auto-fit,minmax(200px,1fr));align-items:start;gap:clamp(26px,4vw,54px);display:grid}.foot-col h4{font:700 10px / 1 var(--mono);letter-spacing:.24em;text-transform:uppercase;color:var(--accent);margin:0 0 16px}.foot-col ul{margin:0;padding:0;list-style:none}.foot-col li+li{margin-top:10px}.foot-col a,.foot-col address{font:400 13px / 1.75 var(--mono);color:#ffffffc7;font-style:normal;text-decoration:none}.foot-col a{align-items:center;gap:9px;transition:color .25s;display:inline-flex}.foot-col a:before{content:"";opacity:.5;background:currentColor;width:14px;height:1px;transition:width .25s}.foot-col a:hover{color:#fff}.foot-col a:hover:before{width:26px}.foot-label{background:#ffffff0f;border:1px dashed #ffffff47;padding:clamp(16px,2vw,22px)}.foot-label strong{font:700 10px / 1 var(--mono);letter-spacing:.24em;text-transform:uppercase;color:var(--accent);margin-bottom:8px;display:block}.foot-bottom{font:400 10.5px / 1.6 var(--mono);letter-spacing:.16em;text-transform:uppercase;color:var(--dim);border-top:1px solid #ffffff29;flex-wrap:wrap;justify-content:space-between;align-items:center;gap:14px;margin-top:clamp(44px,7vh,80px);padding-top:20px;display:flex}@media (width<=860px){.about-grid{grid-template-columns:1fr}.wrow.is-open{height:26rem}.wrow-body{flex-direction:column}.wrow-media{flex:auto;width:100%;min-height:0}.wrow-side{text-align:left;flex:none;align-items:flex-start;gap:8px;width:100%;height:0;padding:0}.wrow.is-open .wrow-side{flex-basis:auto;height:auto}.wrow.is-open .wrow-side--l{padding:0 0 10px}.wrow.is-open .wrow-side--r{padding:10px 0 0}.wrow-side p{max-width:none}.about-polaroid{width:min(100%,260px)}}@media (prefers-reduced-motion:reduce){.wrow,.wrow-side,.wrow-frame,.wrow-label,.note-card,.foot-cta span{transition:none}}.work-title,.about-title,.notes-title{padding-bottom:.08em;overflow:hidden}.about-stats dt{font-variant-numeric:tabular-nums}
