@font-face{font-family:'Avenir Next Cyr';src:url('assets/fonts/avenirnextcyr-light.ttf') format('truetype');font-style:normal;font-weight:300;font-display:swap}
@font-face{font-family:'Avenir Next Cyr';src:url('assets/fonts/avenirnextcyr-regular.ttf') format('truetype');font-style:normal;font-weight:400;font-display:swap}
@font-face{font-family:'Avenir Next Cyr';src:url('assets/fonts/avenirnextcyr-demi.ttf') format('truetype');font-style:normal;font-weight:600;font-display:swap}
@font-face{font-family:'Avenir Next Cyr';src:url('assets/fonts/avenirnextcyr-heavy.ttf') format('truetype');font-style:normal;font-weight:800;font-display:swap}

:root{--paper:#f5f5f5;--cover-paper:#f1f1f5;--ink:#2c251b;--muted:rgba(44,37,27,.63);--line:rgba(44,37,27,.28);--glass:rgba(228,237,240,.29);--glass-open:rgba(222,233,237,.72);--header-h:43px;--cover-progress:0;--shadow:0 16px 50px rgba(44,37,27,.11)}
*{box-sizing:border-box}html{scroll-behavior:smooth;background:var(--paper)}body{margin:0;min-width:320px;background:var(--paper);color:var(--ink);font-family:'Avenir Next Cyr','Avenir Next',Arial,sans-serif;font-weight:400}body.is-about-open{overflow:hidden}button,a{font:inherit;color:inherit}button{border:0;cursor:pointer}.grain{position:fixed;inset:0;z-index:50;pointer-events:none;opacity:.032;background-image:radial-gradient(#2c251b .5px,transparent .72px);background-size:4px 4px;mix-blend-mode:multiply}

/* Fixed profile header and its expanding About sheet */
.site-header{position:fixed;top:18px;left:clamp(12px,2.2vw,32px);right:clamp(12px,2.2vw,32px);z-index:31;display:flex;align-items:center;justify-content:space-between;height:var(--header-h);padding:0 15px;border:1px solid rgba(255,255,255,.58);border-radius:2px;background:rgba(232,240,243,.42);box-shadow:0 1px 0 rgba(44,37,27,.14),0 8px 28px rgba(44,37,27,.04);backdrop-filter:blur(20px) saturate(108%);-webkit-backdrop-filter:blur(20px) saturate(108%);text-align:left;transition:background .32s ease,border-color .32s ease}.site-header:hover{background:rgba(231,240,243,.61);border-color:rgba(255,255,255,.8)}.site-header:focus-visible,.about-panel a:focus-visible,.project-image:focus-visible,.project-caption:focus-visible,.mix-tile:focus-visible,.archive-row:focus-visible{outline:2px solid var(--ink);outline-offset:4px}.site-name,.header-about{display:block;font-size:13px;line-height:1;font-weight:600;letter-spacing:-.045em}.site-name{min-width:0;white-space:nowrap}.site-name__full,.header-about__close{display:none}.header-about{font-size:12px;text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:3px}.about-backdrop{position:fixed;z-index:28;inset:0;width:100%;height:100%;padding:0;background:rgba(241,241,245,0);opacity:0;pointer-events:none;transition:opacity .35s ease}.about-panel{position:fixed;z-index:30;top:calc(18px + var(--header-h) - 1px);left:clamp(12px,2.2vw,32px);right:clamp(12px,2.2vw,32px);max-height:calc(100svh - 82px);overflow:auto;border:1px solid rgba(255,255,255,.62);border-top-color:rgba(255,255,255,.36);border-radius:0 0 2px 2px;background:var(--glass-open);box-shadow:0 16px 42px rgba(44,37,27,.08);backdrop-filter:blur(28px) saturate(112%);-webkit-backdrop-filter:blur(28px) saturate(112%);opacity:0;pointer-events:none;transform:translateY(-28px);transform-origin:top;transition:opacity .32s ease,transform .48s cubic-bezier(.2,.8,.2,1)}.about-panel__inner{min-height:min(55svh,550px);padding:clamp(34px,5vw,76px) clamp(18px,4.2vw,65px) clamp(20px,3vw,38px)}.about-panel__layout{display:grid;grid-template-columns:minmax(0,1.35fr) minmax(130px,.68fr) minmax(180px,.72fr);grid-template-areas:'intro contacts availability';gap:clamp(25px,5.5vw,100px);align-items:start}.about-panel p{margin:0}.about-panel__intro{grid-area:intro;display:grid;gap:24px;max-width:600px;font-size:clamp(14px,1.3vw,19px);line-height:1.14;letter-spacing:-.044em}.about-panel__hello{font-size:clamp(23px,2.75vw,43px);font-weight:600;line-height:.97;letter-spacing:-.062em}.about-panel__contacts{grid-area:contacts;display:grid;align-content:start;gap:5px;padding-top:5px;font-size:clamp(12px,1.05vw,15px);line-height:1.18;letter-spacing:-.04em}.about-panel__label{margin-bottom:10px!important;color:var(--muted);font-size:10px;letter-spacing:.01em;text-transform:uppercase}.about-panel a{text-decoration-thickness:1px;text-underline-offset:3px}.about-panel__links{display:grid;gap:4px;margin-top:12px}.about-panel__availability{grid-area:availability;align-self:start;padding-top:5px;font-size:clamp(16px,1.65vw,25px);font-weight:600;line-height:.98;letter-spacing:-.058em}.about-panel__clients{margin-top:clamp(48px,7vw,106px)!important;padding-top:10px;border-top:1px solid rgba(44,37,27,.46);font-size:clamp(11px,1vw,14px);line-height:1.22;letter-spacing:-.04em}.about-panel__clients span{margin-right:clamp(24px,5vw,84px);color:var(--muted);font-size:10px;letter-spacing:.01em;text-transform:uppercase}body.is-about-open .about-backdrop{opacity:1;pointer-events:auto}body.is-about-open .about-panel{opacity:1;pointer-events:auto;transform:translateY(0)}body.is-about-open .site-header{background:rgba(228,238,242,.82);border-bottom-color:rgba(255,255,255,.3)}body.is-about-open .site-name__short,body.is-about-open .header-about__open{display:none}body.is-about-open .site-name__full,body.is-about-open .header-about__close{display:block}body.is-about-open .header-about{text-decoration:none}

/* Cover: two translucent bands first mask Becentaurea, then separate on scroll */
.cover{height:126svh;min-height:800px;background:var(--cover-paper)}.cover-pin{position:sticky;top:0;height:100svh;min-height:620px;overflow:hidden;background:var(--cover-paper)}.cover-project{position:absolute;top:50%;left:50%;width:min(72vw,1040px);height:min(76svh,780px);overflow:hidden;padding:0;background:#e8e8e7;transform:translate(-50%,-50%)}.cover-project img{width:100%;height:100%;display:block;object-fit:cover;object-position:center 48%;filter:saturate(.79);transform:scale(calc(1 + var(--cover-progress) * .018));transition:filter .5s ease,transform .1s linear}.cover-project:hover img{filter:saturate(.95)}.cover-band{position:absolute;z-index:4;left:clamp(12px,2.2vw,32px);right:clamp(12px,2.2vw,32px);border:1px solid rgba(255,255,255,.62);background:var(--glass);box-shadow:0 1px 0 rgba(44,37,27,.1);backdrop-filter:blur(25px) saturate(106%);-webkit-backdrop-filter:blur(25px) saturate(106%)}.cover-title{top:calc(50% - clamp(168px,20vh,230px));display:grid;place-content:center;min-height:clamp(124px,17vh,168px);padding:18px clamp(18px,4vw,70px);text-align:center;transform:translateY(calc(var(--cover-progress) * -255px));transition:transform .08s linear}.cover-title p{margin:0 0 8px;font-size:clamp(11px,1vw,14px);line-height:1.1;letter-spacing:-.035em}.cover-title h1{max-width:1100px;margin:0;font-size:clamp(27px,3.35vw,51px);font-weight:800;line-height:1.02;letter-spacing:.04em}.cover-bottom{top:calc(50% + clamp(36px,6vh,58px));display:flex;justify-content:center;gap:clamp(25px,6vw,112px);min-height:clamp(88px,12vh,118px);padding:15px clamp(18px,4vw,70px);text-align:center;transform:translateY(calc(var(--cover-progress) * 244px));transition:transform .08s linear}.cover-bottom p{margin:0;align-self:center;font-size:clamp(14px,1.6vw,24px);line-height:1.04;letter-spacing:-.043em}.scroll-cue{position:absolute;z-index:6;bottom:29px;left:50%;font-size:21px;line-height:1;text-decoration:none;transform:translateX(-50%);opacity:calc(1 - var(--cover-progress) * 1.9);transition:opacity .1s linear}

/* A single fixed timeline marker governs every year in the feed */
.timeline-year{position:fixed;z-index:12;top:50%;left:clamp(12px,2.2vw,32px);display:flex;align-items:center;gap:9px;opacity:0;pointer-events:none;transform:translateY(12px);transition:opacity .28s ease,transform .28s ease}.timeline-year.is-visible{opacity:1;transform:translateY(0)}.timeline-year__line{display:block;width:clamp(42px,6.6vw,100px);height:1px;background:var(--ink)}.timeline-year__value{font-size:13px;font-weight:600;letter-spacing:-.05em}

.work{width:min(1380px,100%);margin:0 auto;padding:0 clamp(12px,2.2vw,32px) clamp(100px,12vw,180px)}.project{margin-top:clamp(64px,9vw,150px)}.project--feature{margin-top:clamp(28px,5vw,70px)}.project-caption{width:100%;display:grid;grid-template-columns:minmax(38px,13vw) minmax(0,1fr) auto auto;align-items:start;gap:12px;padding:0;background:transparent;text-align:left}.caption-rule{height:1px;margin-top:9px;background:var(--ink)}.caption-main{display:flex;flex-direction:column;gap:3px}.caption-main strong{font-size:clamp(22px,3.05vw,48px);font-weight:800;line-height:.9;letter-spacing:-.065em;text-transform:uppercase}.caption-main small{max-width:360px;font-size:12px;line-height:1.24;letter-spacing:-.036em}.caption-meta{min-width:65px;font-size:11px;line-height:1.15;text-align:right;letter-spacing:-.04em}.caption-arrow{font-size:21px;line-height:.8;transition:transform .3s ease}.project-caption:hover .caption-arrow{transform:translate(4px,-4px)}.project-image{position:relative;display:block;width:clamp(240px,67vw,944px);margin-left:auto;overflow:hidden;padding:0;background:#e6e6e6;text-align:left}.project-image img{display:block;width:100%;aspect-ratio:1.03;object-fit:cover;transition:transform .55s cubic-bezier(.2,.7,.2,1),filter .55s}.project--nda .project-image img{object-position:center 40%}.project--perlamutria .project-image{width:clamp(240px,59vw,820px);margin-left:clamp(0px,12vw,190px)}.project--perlamutria .project-image img{aspect-ratio:1.18}.project-image span{position:absolute;right:11px;bottom:11px;padding:7px 9px;border:1px solid rgba(255,255,255,.52);background:rgba(245,245,245,.58);font-size:11px;line-height:1;opacity:0;transform:translateY(8px);backdrop-filter:blur(10px);transition:.25s ease}.project-image:hover img{transform:scale(1.025);filter:contrast(1.03)}.project-image:hover span{opacity:1;transform:none}.project-image+.project-caption,.mix-tile+.project-caption{margin-top:12px}.project--mix{display:grid;grid-template-columns:minmax(0,1fr) 45%;align-items:end;gap:clamp(20px,8vw,140px)}.mix-tile{position:relative;display:flex;flex-direction:column;align-items:flex-start;justify-content:space-between;width:100%;min-height:clamp(360px,48vw,650px);overflow:hidden;padding:18px;color:#f4f4f1;background:#2e2b28;text-align:left}.mix-tile:before{position:absolute;inset:0;content:"";background:linear-gradient(143deg,#e1dfdb 0 1px,transparent 1px 19%,rgba(244,244,241,.22) 19.1% 19.3%,transparent 19.4% 52%,rgba(244,244,241,.18) 52.1% 52.3%,transparent 52.4%),radial-gradient(circle at 76% 24%,#d7d5d2 0 1px,transparent 1.5px);background-size:auto,18px 18px;opacity:.54}.mix-tile>*{position:relative}.mix-tile__year,.mix-tile__note{font-size:12px;line-height:1.25;letter-spacing:-.04em}.mix-tile__title{font-size:clamp(43px,6.2vw,93px);font-weight:800;line-height:.76;letter-spacing:-.1em;text-transform:uppercase}.mix-tile__arrow{align-self:flex-end;font-size:29px;transition:transform .3s}.mix-tile:hover .mix-tile__arrow{transform:translate(4px,-4px)}.project--mix .project-caption{padding-bottom:3px}.year-divider{display:none}.archive{position:relative;margin-top:clamp(130px,20vw,300px);padding-top:clamp(18px,3vw,40px);border-top:1px solid var(--ink)}.archive-intro{display:grid;grid-template-columns:1fr minmax(0,1.35fr);gap:20px;align-items:end;margin-bottom:clamp(38px,5vw,70px)}.archive-intro p{max-width:340px;margin:0;font-size:13px;line-height:1.22;letter-spacing:-.04em}.archive h2{margin:0;font-size:clamp(64px,12vw,184px);font-weight:800;line-height:.72;letter-spacing:-.1em;text-transform:uppercase}.archive-table{position:relative;z-index:2;border-top:1px solid var(--ink)}.archive-labels,.archive-row{display:grid;grid-template-columns:1.1fr 1.25fr .85fr;gap:16px;text-align:left}.archive-labels{padding:9px 0;color:var(--muted);font-size:10px;line-height:1;text-transform:uppercase;letter-spacing:.025em}.archive-row{width:100%;padding:13px 0;border-bottom:1px solid var(--line);background:transparent;font-size:clamp(13px,1.45vw,20px);line-height:1.04;letter-spacing:-.045em;transition:padding .3s ease,background .3s ease}.archive-row strong{font-weight:600}.archive-row:hover{padding-right:12px;padding-left:12px;background:rgba(255,255,255,.42)}.archive-preview{position:absolute;right:7.5%;bottom:25px;z-index:1;width:clamp(130px,23vw,320px);height:clamp(170px,31vw,410px);overflow:hidden;opacity:.28;pointer-events:none;transition:opacity .35s ease,transform .35s ease}.archive-preview img{width:100%;height:100%;object-fit:cover;transition:opacity .25s ease}.archive:has(.archive-row:hover) .archive-preview{opacity:.83;transform:translateY(-8px)}.site-footer{display:grid;grid-template-columns:1fr auto 34px;align-items:center;gap:20px;width:min(1380px,100%);margin:0 auto;padding:14px clamp(12px,2.2vw,32px) 22px;border-top:1px solid var(--ink);font-size:11px;letter-spacing:-.035em}.site-footer button{padding:0;background:transparent;text-decoration:underline;text-underline-offset:3px}.site-footer a{font-size:20px;text-align:right;text-decoration:none}

/* Projects keep their separate dialog; About no longer uses it */
.case-dialog{width:min(1160px,calc(100% - 28px));max-width:none;height:min(85svh,860px);max-height:none;padding:0;border:0;background:transparent;color:var(--ink)}.case-dialog::backdrop{background:rgba(44,37,27,.26);backdrop-filter:blur(7px)}.dialog-inner{position:relative;width:100%;height:100%;overflow:auto;padding:clamp(64px,8vw,116px) clamp(22px,6vw,84px) clamp(30px,5vw,70px);border:1px solid rgba(255,255,255,.6);background:rgba(245,245,245,.9);box-shadow:var(--shadow);backdrop-filter:blur(18px);-webkit-backdrop-filter:blur(18px)}.dialog-inner:before{position:absolute;top:0;right:0;left:0;height:var(--header-h);border-bottom:1px solid rgba(44,37,27,.35);background:rgba(236,242,244,.51);content:"";backdrop-filter:blur(20px)}.dialog-close{position:absolute;z-index:1;top:9px;right:13px;width:28px;height:28px;padding:0;background:transparent;font-size:29px;font-weight:300;line-height:.75}.dialog-kicker{margin:0 0 clamp(45px,8vw,115px);font-size:11px;letter-spacing:-.03em;text-transform:uppercase}.dialog-title{max-width:1000px;margin:0;font-size:clamp(57px,10vw,155px);font-weight:800;line-height:.72;letter-spacing:-.105em;text-transform:uppercase}.dialog-body{display:grid;grid-template-columns:minmax(0,1.25fr) minmax(190px,.75fr);gap:clamp(34px,10vw,170px);margin-top:clamp(42px,6vw,78px);padding-top:12px;border-top:1px solid var(--ink)}.dialog-copy{display:grid;gap:19px}.dialog-copy p{max-width:620px;margin:0;font-size:clamp(17px,2vw,27px);line-height:1.07;letter-spacing:-.052em}.dialog-meta{font-size:13px;line-height:1.38;letter-spacing:-.04em}.dialog-meta strong{font-weight:600}.dialog-image{display:block;width:100%;max-height:47vh;margin-top:clamp(42px,7vw,86px);object-fit:cover}.reveal{opacity:0;transform:translateY(28px);transition:opacity .7s ease,transform .7s cubic-bezier(.2,.7,.2,1)}.reveal.is-visible{opacity:1;transform:none}

@media (max-width:760px){:root{--header-h:39px}.site-header{top:9px;padding:0 11px}.site-name,.header-about{font-size:11px}.header-about{font-size:10px}.about-panel{top:calc(9px + var(--header-h) - 1px);max-height:calc(100svh - 58px)}.about-panel__inner{min-height:auto;padding:29px 14px 20px}.about-panel__layout{grid-template-columns:1fr 1fr;grid-template-areas:'intro intro' 'contacts availability';gap:32px 18px}.about-panel__intro{gap:17px;font-size:13px}.about-panel__hello{font-size:25px}.about-panel__contacts{font-size:11px}.about-panel__availability{font-size:17px}.about-panel__clients{margin-top:43px!important;font-size:10px}.about-panel__clients span{display:block;margin:0 0 7px}.cover{height:120svh;min-height:650px}.cover-pin{min-height:560px}.cover-project{width:calc(100vw - 24px);height:min(74svh,620px)}.cover-title{top:calc(50% - 144px);min-height:111px;padding:12px 16px}.cover-title p{margin-bottom:7px;font-size:10px}.cover-title h1{font-size:clamp(21px,6.4vw,31px);line-height:1.02;letter-spacing:.028em}.cover-bottom{top:calc(50% + 21px);min-height:87px;gap:18px;padding:11px 13px}.cover-bottom p{font-size:12px}.scroll-cue{bottom:18px}.timeline-year{gap:6px;top:49%}.timeline-year__line{width:35px}.timeline-year__value{font-size:11px}.work{padding-bottom:86px}.project{margin-top:80px}.project-caption{grid-template-columns:48px minmax(0,1fr) 42px 17px;gap:7px}.caption-rule{margin-top:7px}.caption-main strong{font-size:22px}.caption-main small{font-size:10px;line-height:1.2}.caption-meta{min-width:0;font-size:9px}.caption-arrow{font-size:17px}.project-image{width:88vw}.project-image img{aspect-ratio:.86}.project--perlamutria .project-image{width:78vw;margin-left:0}.project--perlamutria .project-image img{aspect-ratio:.93}.project--mix{display:block}.mix-tile{width:73vw;min-height:95vw}.mix-tile__title{font-size:54px}.project--mix .project-caption{margin-top:12px}.archive{margin-top:160px}.archive-intro{grid-template-columns:1fr;gap:27px}.archive h2{font-size:81px}.archive-intro p{font-size:12px}.archive-labels,.archive-row{grid-template-columns:.82fr 1.1fr .8fr;gap:8px}.archive-labels{font-size:8px}.archive-row{font-size:12px;line-height:1.08}.archive-preview{right:9px;bottom:16px;width:40vw;height:52vw}.site-footer{grid-template-columns:1fr auto 26px;gap:8px;padding-bottom:15px;font-size:9px}.case-dialog{width:calc(100% - 16px);height:calc(100svh - 16px)}.dialog-inner{padding:68px 18px 28px}.dialog-title{font-size:59px}.dialog-body{grid-template-columns:1fr;gap:34px;margin-top:40px}.dialog-copy p{font-size:18px}.dialog-meta{font-size:12px}.dialog-image{max-height:37vh}.project-image span{opacity:1;transform:none;font-size:9px}.archive-row:hover{padding-right:0;padding-left:0;background:transparent}}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}.cover-title,.cover-bottom,.cover-project img,.scroll-cue,.reveal,.about-panel,.about-backdrop,.timeline-year{transition:none}.reveal{opacity:1;transform:none}}

/* Figma lock: cover and About are intentionally plain planes, not glass. */
:root{--paper:#f1f1f5;--cover-paper:#f1f1f5;--header-surface:#c0d2d5;--ink:#2c251b;--muted:rgba(44,37,27,.6)}
html{scrollbar-gutter:stable}
html{scrollbar-width:thin;scrollbar-color:var(--header-surface) transparent}
::-webkit-scrollbar{width:4px;height:4px}
::-webkit-scrollbar-track{background:transparent}
::-webkit-scrollbar-thumb{background:var(--header-surface);border:0;border-radius:0}
::-webkit-scrollbar-button{display:none;width:0;height:0}
.grain{display:none}

/* One continuous About sheet: the header is the sheet's first line. */
.site-header{top:18px;left:17px;right:17px;height:32px;padding:0;border:0;border-radius:0;background:var(--header-surface);box-shadow:none;backdrop-filter:none;-webkit-backdrop-filter:none;transition:background .35s ease,color .35s ease}
.site-header:hover{background:var(--header-surface);border-color:transparent}
.site-name,.header-about{font-family:'Avenir Next Cyr','Avenir Next',Arial,sans-serif;font-weight:800;line-height:32px;letter-spacing:0}
.site-name{font-size:40px}
.header-about{font-size:13px;font-weight:400;text-decoration:none}
.site-name__short{display:block}.site-name__full,.header-about__close{display:none}
.about-backdrop{z-index:28;background:transparent;transition:none}
.about-panel{z-index:30;top:0;right:0;left:0;max-height:none;height:72svh;overflow:auto;border:0;border-radius:0;background:var(--header-surface);box-shadow:none;backdrop-filter:none;-webkit-backdrop-filter:none;opacity:0;transform:translateY(-100%);transition:transform .48s cubic-bezier(.2,.8,.2,1),opacity .1s linear}
.about-panel__inner{min-height:100%;padding:clamp(126px,15.2vh,164px) 17px clamp(32px,4.5vh,52px)}
.about-panel__layout{display:grid;grid-template-columns:minmax(0,530px) minmax(210px,330px);grid-template-areas:'intro availability' 'contacts availability';justify-content:space-between;gap:clamp(42px,8vh,88px) clamp(68px,14vw,260px);align-content:start}
.about-panel__intro{grid-area:intro;max-width:530px;display:block;font-size:20px;font-weight:400;line-height:1.18;letter-spacing:0;color:var(--muted)}
.about-panel__intro p{margin:0}.about-panel__hello{font-size:inherit;font-weight:inherit;line-height:inherit;letter-spacing:inherit}
.about-panel__availability{grid-area:availability;max-width:330px;padding:0;font-size:20px;font-weight:400;line-height:1.18;letter-spacing:0;color:var(--muted)}
.about-panel__contacts{grid-area:contacts;display:grid;gap:3px;padding:0;font-size:14px;font-weight:400;line-height:1.22;letter-spacing:0;color:var(--muted)}
.about-panel__label{margin:0 0 11px!important;color:var(--muted);font-size:14px;letter-spacing:0;text-transform:none}.about-panel__links{gap:3px;margin-top:0}.about-panel a{color:inherit;text-decoration:none}.about-panel a:hover{text-decoration:underline;text-underline-offset:3px}.about-panel__clients{display:none}
body.is-about-open .about-panel{opacity:1;pointer-events:auto;transform:translateY(0)}
body.is-about-open .site-header{background:transparent;border:0}
body.is-about-open .site-name__short,body.is-about-open .header-about__open{display:none}
body.is-about-open .site-name__full,body.is-about-open .header-about__close{display:block}
body.is-about-open .header-about{font-size:18px;font-weight:400;line-height:32px}

/* Cover geometry from the 1920 × 1080 Figma composition. */
.cover{height:126svh;min-height:720px;background:var(--cover-paper)}
.cover-pin{min-height:560px;background:var(--cover-paper)}
.cover-project{z-index:1;top:0;right:1.15vw;bottom:0;left:1.15vw;width:auto;height:auto;margin:0;padding:0;transform:none;background:#e8e8e7}
.cover-project img{object-position:center 48%;filter:saturate(.79);transform:scale(calc(1 + var(--cover-progress) * .012))}
.cover-mask{position:absolute;z-index:4;right:-2vw;left:-2vw;display:flex;justify-content:center;background:rgba(241,241,245,.76);border:0;box-shadow:none;backdrop-filter:none;-webkit-backdrop-filter:none;transition:transform .08s linear}
.cover-mask--top{top:50px;height:calc(65.46svh - 50px);align-items:flex-end;padding:0 18px 5.74svh;transform:translateY(calc(var(--cover-progress) * -22svh))}
.cover-mask--top h1{display:grid;gap:4px;margin:0;color:var(--ink);font-size:48px;font-weight:800;line-height:52px;letter-spacing:.04em;text-align:center}
.cover-mask--top h1 span{display:block;white-space:nowrap}
.cover-stripe{position:absolute;z-index:5;right:1.15vw;left:1.15vw;display:block;height:1.76svh;min-height:14px;background:var(--cover-paper);transition:transform .08s linear}
.cover-stripe--one{top:65.46svh;transform:translateY(calc(var(--cover-progress) * -22svh))}
.cover-stripe--two{top:73.61svh;transform:translateY(calc(var(--cover-progress) * 26svh))}
.cover-mask--bottom{top:74.44svh;height:25.56svh;align-items:center;padding:0 18px;transform:translateY(calc(var(--cover-progress) * 26svh))}
.cover-mask--bottom p{display:grid;gap:2px;margin:0;color:var(--ink);font-size:48px;font-weight:400;line-height:50px;letter-spacing:0;text-align:center}
.cover-mask--bottom p span{display:block;white-space:nowrap}
.cover-title,.cover-bottom,.cover-band{display:none}
.scroll-cue{z-index:7;bottom:22px;font-size:24px;font-weight:400;color:var(--ink)}

.timeline-year{left:17px;gap:9px}.timeline-year__line{width:clamp(42px,6.6vw,100px);height:1px;background:var(--ink)}.timeline-year__value{font-size:13px;font-weight:400;letter-spacing:0}

@media (max-width:760px){
  .site-header{top:12px;left:12px;right:12px;height:21px}.site-name,.header-about{line-height:21px}.site-name{font-size:22px}.header-about{font-size:11px}body.is-about-open .header-about{font-size:15px;line-height:21px}
  .about-panel{height:76svh}.about-panel__inner{padding:76px 12px 26px}.about-panel__layout{grid-template-columns:minmax(0,1fr);grid-template-areas:'intro' 'availability' 'contacts';gap:36px}.about-panel__intro,.about-panel__availability{max-width:310px;font-size:16px;line-height:1.2}.about-panel__contacts{font-size:12px}.about-panel__label{font-size:12px}
  .cover{height:121svh;min-height:620px}.cover-pin{min-height:520px}.cover-project{right:12px;left:12px}.cover-mask--top{top:33px;height:calc(65.46svh - 33px);padding-bottom:5.7svh}.cover-mask--top h1{gap:2px;font-size:clamp(17px,5.8vw,25px);line-height:1.08;letter-spacing:.04em}.cover-mask--bottom p{gap:1px;font-size:clamp(17px,5.8vw,25px);line-height:1.08}.cover-mask--top,.cover-stripe--one{transform:translateY(calc(var(--cover-progress) * -19svh))}.cover-stripe--two,.cover-mask--bottom{transform:translateY(calc(var(--cover-progress) * 23svh))}.cover-stripe{right:12px;left:12px;height:1.76svh;min-height:11px}.scroll-cue{bottom:16px;font-size:21px}.timeline-year{left:12px;gap:6px}.timeline-year__line{width:35px}.timeline-year__value{font-size:11px}
}

/* Final navigation refinements. */
.cover-case-caption{scroll-margin-top:calc(100svh - 100px)}
@media (min-width:761px){
  .site-header{top:18px;height:36px;border-color:rgba(192,210,213,.86);background:rgba(192,210,213,.40)}
  .site-header:hover{border-color:rgba(192,210,213,.86);background:rgba(192,210,213,.40)}
  .site-name,.header-about{line-height:36px}
  body.is-about-open .site-header{top:20px;height:48px;border-color:transparent;background:transparent}
  body.is-about-open .site-name,.header-about{line-height:48px}
  body.is-about-open .header-about__open,body.is-about-open .header-about__close{display:none}
  .timeline-year.is-archive .timeline-year__line{width:66px}
}
@media (max-width:760px){.timeline-year.is-archive .timeline-year__line{width:29px}}

/* Final NDA card composition: one image, with the caption over its lower edge. */
.project--nda{position:relative;height:460px}
.project--nda .project-image{height:100%}
.project--nda .project-image img{width:100%;height:100%;aspect-ratio:auto;object-fit:cover;object-position:center center}
.project--nda .project-caption{position:absolute;right:0;bottom:0;left:0;z-index:2;display:grid;height:94px;min-height:94px;margin:0;padding:12px 22px;border-top:max(14px,1.76svh) solid var(--cover-paper);background:rgba(241,241,245,.66);backdrop-filter:none;-webkit-backdrop-filter:none}
.project--nda .project-caption .caption-main{display:grid;grid-template-columns:198px minmax(0,1fr);align-items:center;gap:20px;width:100%;height:100%}
.project--nda .project-caption .caption-main strong{display:block;font-size:20px;font-weight:800;line-height:1;letter-spacing:.02em;white-space:nowrap}
.project--nda .project-caption .caption-main small{display:block;margin:0;font-size:14px;font-weight:400;line-height:1;letter-spacing:.02em;text-align:left;white-space:nowrap;color:var(--ink)}

@media (max-width:760px){
  .project--nda{height:460px}
  .project--nda .project-caption{height:90px;min-height:90px;padding:11px 14px;border-top-width:max(11px,1.76svh)}
  .project--nda .project-caption .caption-main{grid-template-columns:minmax(104px,34%) minmax(0,1fr);gap:12px}
  .project--nda .project-caption .caption-main strong{font-size:clamp(14px,4vw,20px)}
  .project--nda .project-caption .caption-main small{font-size:12px;white-space:normal}
}

/* NDA Studio is one continuous image with an overlaid glass caption. */
.project--nda{position:relative;height:460px}
.project--nda .project-image{height:100%}
.project--nda .project-image img{width:100%;height:100%;object-fit:cover;object-position:center center}
.project--nda .project-caption{position:absolute;right:0;bottom:0;left:0;z-index:2;height:94px;min-height:94px;margin:0;padding:12px 22px;border-top:max(14px,1.76svh) solid var(--cover-paper);background:rgba(241,241,245,.76);backdrop-filter:blur(12px) saturate(106%);-webkit-backdrop-filter:blur(12px) saturate(106%)}
.project--nda .project-caption .caption-main{display:grid;grid-template-columns:198px minmax(0,1fr);align-items:center;gap:20px;width:100%;height:100%}
.project--nda .project-caption .caption-main strong{font-size:20px;font-weight:800;line-height:1;letter-spacing:.02em;white-space:nowrap}
.project--nda .project-caption .caption-main small{margin:0;font-size:14px;font-weight:400;line-height:1;letter-spacing:.02em;text-align:left;white-space:nowrap;color:var(--ink)}

@media (max-width:760px){
  .project--nda{height:460px}
  .project--nda .project-caption{height:90px;min-height:90px;padding:11px 14px;border-top-width:max(11px,1.76svh)}
  .project--nda .project-caption .caption-main{grid-template-columns:minmax(104px,34%) minmax(0,1fr);gap:12px}
  .project--nda .project-caption .caption-main strong{font-size:clamp(14px,4vw,20px)}
  .project--nda .project-caption .caption-main small{font-size:12px;white-space:normal}
}

/* Project cards — Page 1 / frame 1 38. */
.project--nda .project-image img{object-position:center center}
.project--mix .project-image--graphic{height:224px}
.project--mix .project-image--graphic img{width:100%;height:100%;aspect-ratio:auto;object-fit:cover}
.project--nda .project-caption{background:linear-gradient(rgba(241,241,245,.70),rgba(241,241,245,.70)),url('assets/nda-studio.webp') center bottom / 100% 554px no-repeat}
.project--mix .project-caption{background:linear-gradient(rgba(241,241,245,.70),rgba(241,241,245,.70)),url('assets/graphic-works.webp') center bottom / 100% 318px no-repeat}
.project-image + .project-caption{align-items:center}
.project-caption .caption-main{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:20px;width:100%}
.project-caption .caption-main strong{font-size:20px;font-weight:800;line-height:1;letter-spacing:.02em}
.project-caption .caption-main small{margin-top:0;font-size:14px;font-weight:400;line-height:1;letter-spacing:.02em;text-align:right;color:var(--ink)}

@media (max-width:760px){
  .project--mix .project-image--graphic{height:224px}
  .project-caption .caption-main{gap:12px}
  .project-caption .caption-main strong{font-size:clamp(14px,4vw,20px)}
  .project-caption .caption-main small{font-size:12px}
}

/* Archive: a quiet, aligned continuation of the feed rather than a separate feature. */
.timeline-index{
  margin:clamp(112px,12vw,180px) 0 48px;
  color:var(--ink);
  font-size:20px;
  font-weight:800;
  line-height:1;
  letter-spacing:0;
  text-align:center;
}
.archive{margin-top:0;padding:0;border:0}
.archive-list{display:grid;gap:8px;width:100%}
.archive-row{display:grid;grid-template-columns:1.15fr 1fr .72fr;gap:clamp(20px,3.5vw,64px);width:100%;padding:0;border:0;background:transparent;color:var(--ink);font-size:clamp(14px,1.05vw,20px);font-weight:400;line-height:1.18;letter-spacing:-.025em;text-align:left}
.archive-row strong{font-weight:600}.archive-row:hover{padding:0;background:transparent}
.archive-row[data-year]{scroll-margin-top:45vh}
.timeline-year.is-archive .timeline-year__line{width:clamp(36px,4vw,64px)}

@media (max-width:760px){
  .timeline-index{margin:84px 0 36px;font-size:20px}
  .archive{margin-top:0}.archive-list{gap:12px}.archive-row{grid-template-columns:minmax(0,1.2fr) minmax(0,.8fr);gap:14px;font-size:14px;line-height:1.18}.archive-row>span:nth-of-type(1){display:none}.archive-row>span:last-child{text-align:right}
  .timeline-year.is-archive .timeline-year__line{width:28px}
}

/* Open About: the reference's copy, two-column detail block and baseline links. */
.about-panel__inner{min-height:100%;height:100%;padding:52px 22px 18px}
.about-panel__layout{min-height:100%;height:100%;display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);grid-template-rows:auto 1fr auto;grid-template-areas:'intro intro' 'contacts availability' 'links links';column-gap:18px;row-gap:0;align-items:start}
.about-panel__intro{grid-area:intro;display:grid;gap:18px;max-width:88%;font-size:16px;font-weight:400;line-height:1.1;letter-spacing:0;color:rgba(44,37,27,.78)}
.about-panel__intro p{margin:0}
.about-panel__contacts,.about-panel__availability{position:relative;align-self:start;max-width:none;padding-top:18px;font-size:16px;line-height:1.08;letter-spacing:0}
.about-panel__contacts{grid-area:contacts;display:grid;gap:3px;font-weight:800;color:rgba(44,37,27,.78)}
.about-panel__availability{grid-area:availability;font-weight:800;color:rgba(44,37,27,.6)}
.about-panel__contacts::before,.about-panel__availability::before{position:absolute;top:0;right:0;left:0;height:4px;background:rgba(241,241,245,.9);content:''}
.about-panel__label{margin:0 0 17px!important;font-size:16px;font-weight:800;line-height:1.08;letter-spacing:0;text-transform:none;color:rgba(44,37,27,.6)}
.about-panel__links{grid-area:links;display:grid;width:100%;grid-template-columns:repeat(3,1fr);align-items:end;margin:0;font-size:16px;font-weight:800;line-height:1;text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:3px;color:rgba(44,37,27,.78)}
.about-panel__links a{color:inherit;text-decoration:inherit;text-decoration-thickness:inherit;text-underline-offset:inherit}.about-panel__links a:nth-child(1){justify-self:start}.about-panel__links a:nth-child(2){justify-self:center}.about-panel__links a:nth-child(3){justify-self:end}

@media (max-width:760px){
  .about-panel__inner{padding:47px 14px 14px}
  .about-panel__layout{column-gap:12px}
  .about-panel__intro{max-width:100%;gap:14px;font-size:14px;line-height:1.13}
  .about-panel__contacts,.about-panel__availability{padding-top:13px;font-size:12px;line-height:1.14}
  .about-panel__label{margin-bottom:11px!important;font-size:12px}
  .about-panel__contacts::before,.about-panel__availability::before{height:3px}
  .about-panel__links{font-size:12px}
}

@media (prefers-reduced-motion:reduce){.cover-mask,.cover-stripe,.about-panel{transition:none}}

/* Final Figma composition: a narrow header and first image sit inside the cover planes. */
:root{--image-width:min(46vw,884px);--frame-width:var(--image-width);--cover-project-drop:0px}
.site-header{top:20px;right:auto;left:50%;width:var(--frame-width);height:48px;padding:0 22px;transform:translateX(-50%);border:1px solid rgba(241,241,245,.56);border-radius:0;background:rgba(192,210,213,.48);box-shadow:none;backdrop-filter:blur(22px) saturate(108%);-webkit-backdrop-filter:blur(22px) saturate(108%)}
.site-header:hover{background:rgba(192,210,213,.56);border-color:rgba(241,241,245,.7)}
.site-name,.header-about{line-height:48px}.site-name{font-size:24px}.site-name__short{opacity:.78}.header-about{font-size:14px;font-weight:800;text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:3px}.header-about__open{opacity:.6}

.custom-cursor{position:fixed;z-index:100;top:0;left:0;width:12px;height:12px;border:1px solid rgba(241,241,245,.56);border-radius:50%;background:rgba(192,210,213,.48);box-sizing:border-box;box-shadow:0 1px 0 rgba(44,37,27,.08);backdrop-filter:blur(18px) saturate(108%);-webkit-backdrop-filter:blur(18px) saturate(108%);pointer-events:none;opacity:0;transform:translate(-50%,-50%);transition:width .18s ease,height .18s ease,background .18s ease,border-color .18s ease,opacity .12s ease}.custom-cursor.is-visible{opacity:1}.custom-cursor.is-interactive{width:20px;height:20px;border-color:rgba(228,100,144,.72);background:rgba(228,100,144,.48);backdrop-filter:blur(18px) saturate(108%);-webkit-backdrop-filter:blur(18px) saturate(108%)}
@media (hover:hover) and (pointer:fine){body,body *{cursor:none}}

.about-panel{top:20px;right:auto;left:50%;width:var(--frame-width);height:calc(65.46svh - 20px);overflow:auto;transform:translateX(-50%);clip-path:inset(0 0 100% 0);border:1px solid rgba(241,241,245,.52);background:rgba(192,210,213,.36);box-shadow:none;backdrop-filter:blur(30px) saturate(110%);-webkit-backdrop-filter:blur(30px) saturate(110%);transition:clip-path .72s cubic-bezier(.16,1,.3,1),background .32s ease}
.about-panel__inner{min-height:100%;height:100%;padding:52px 22px 18px}.about-panel__layout{min-height:100%;height:100%;display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);grid-template-rows:auto 1fr auto;grid-template-areas:'intro intro' 'contacts availability' 'links links';column-gap:18px;row-gap:0;align-items:start}
.about-panel__intro{grid-area:intro;display:grid;gap:18px;max-width:88%;font-size:16px;font-weight:400;line-height:1.1;letter-spacing:0;color:rgba(44,37,27,.78)}.about-panel__intro p{margin:0}.about-panel__contacts,.about-panel__availability{position:relative;align-self:start;max-width:none;padding-top:18px;font-size:16px;line-height:1.08;letter-spacing:0}.about-panel__contacts{grid-area:contacts;display:grid;gap:3px;font-weight:800;color:rgba(44,37,27,.78)}.about-panel__availability{grid-area:availability;font-weight:800;color:rgba(44,37,27,.6)}.about-panel__contacts::before,.about-panel__availability::before{position:absolute;top:0;right:0;left:0;height:4px;background:rgba(241,241,245,.9);content:''}.about-panel__label{margin:0 0 17px!important;font-size:16px;font-weight:800;line-height:1.08;letter-spacing:0;text-transform:none;color:rgba(44,37,27,.6)}.about-panel__links{grid-area:links;display:grid;width:100%;grid-template-columns:repeat(3,1fr);align-items:end;margin:0;font-size:16px;font-weight:800;line-height:1;text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:3px;color:rgba(44,37,27,.78)}.about-panel__links a{color:inherit;text-decoration:inherit;text-decoration-thickness:inherit;text-underline-offset:inherit}.about-panel__links a:nth-child(1){justify-self:start}.about-panel__links a:nth-child(2){justify-self:center}.about-panel__links a:nth-child(3){justify-self:end}
body.is-about-open .about-panel{transform:translateX(-50%);clip-path:inset(0 0 0 0)}
body.is-about-open .site-header{background:transparent;border-color:transparent;backdrop-filter:none;-webkit-backdrop-filter:none}
body.is-about-open .header-about{font-size:17px;font-weight:400;text-decoration:none;line-height:48px}
.about-panel__intro{gap:13px;font-size:13px;font-weight:500;line-height:1.06;letter-spacing:-.01em}
.about-panel__intro p + p{padding-left:0}
.about-panel__intro{transform:translateY(-2px)}
.about-panel__contacts>a,.about-panel__links{font-size:12px;font-weight:600}
@media (min-width:761px){.about-panel__contacts,.about-panel__availability{margin-top:18px}}
.about-panel__contacts::before,.about-panel__availability::before{height:2px}
.cover-mask--top h1{justify-items:center;margin-right:auto;margin-left:auto;text-align:center}
.cover-mask,.cover-stripe{opacity:calc(1 - var(--cover-progress))}

.cover{height:calc(100svh + 100px);min-height:0}.cover-pin{min-height:0;overflow:visible}
.cover-project{top:72px;right:auto;bottom:auto;left:50%;width:var(--image-width);height:670px;min-height:0;transform:translate(-50%,calc(var(--cover-progress) * var(--cover-project-drop)));background:#e8e8e7}
.cover-project img{object-position:center 48%;filter:saturate(.79)}
.cover-mask{right:0;left:0;background:rgba(241,241,245,.76)}
.cover-mask--top{top:0;height:65.46svh;padding-bottom:5.74svh;transform:translateY(calc(var(--cover-progress) * -72svh))}
.cover-mask--top h1{width:calc(var(--image-width) - 48px);max-width:calc(100vw - 48px);font-size:24px;line-height:28px;transform:translateY(28px)}.cover-stripe{right:calc((100vw - var(--image-width))/2 - 20px);left:calc((100vw - var(--image-width))/2 - 20px)}
.cover-stripe--one{transform:translateY(calc(var(--cover-progress) * -74svh))}.cover-stripe--two{transform:translateY(calc(var(--cover-progress) * 29svh))}
.cover-mask--bottom{right:auto;left:50%;width:var(--image-width);transform:translateX(-50%) translateY(calc(var(--cover-progress) * 28svh))}.cover-mask--bottom p{width:calc(var(--image-width) - 48px);max-width:calc(100vw - 48px);font-size:24px;line-height:28px;transform:translateY(-28px)}
.cover-case-caption{position:absolute;z-index:6;top:662px;left:50%;display:flex;width:var(--image-width);height:80px;flex-direction:column;align-items:flex-start;justify-content:flex-start;padding:12px 22px;border:0;background:rgba(241,241,245,.76);font-family:'Avenir Next Cyr','Avenir Next',Arial,sans-serif;color:var(--ink);text-align:left;box-sizing:border-box;opacity:clamp(0,calc((var(--cover-progress) - .72) * 3.58),1);transform:translateX(-50%);backdrop-filter:blur(20px) saturate(108%);-webkit-backdrop-filter:blur(20px) saturate(108%);transition:opacity .24s ease-out}
.cover-case-caption strong{display:block;font-size:14px;font-weight:800;line-height:1;letter-spacing:-.02em}.cover-case-caption span{display:block;margin-top:20px;font-size:13px;font-weight:500;line-height:1.06;letter-spacing:-.01em;color:rgba(44,37,27,.78)}
.work{width:var(--image-width);padding:80px 0 clamp(100px,12vw,180px)}
.project{margin-top:62px}.project--feature{display:none}.project--nda{margin-top:80px}.project--feature .project-image{width:100%;margin:0}.project--feature .project-image img{aspect-ratio:.92;object-position:center 48%}
.project--feature .project-caption{display:grid;grid-template-columns:minmax(46px,13%) minmax(0,1fr);gap:12px;margin-top:12px;padding:12px 16px;border:1px solid rgba(241,241,245,.48);background:rgba(192,210,213,.42);backdrop-filter:blur(20px) saturate(108%);-webkit-backdrop-filter:blur(20px) saturate(108%)}
.project--feature .caption-meta,.project--feature .caption-arrow{display:none}.project--feature .caption-main strong{font-size:18px;line-height:1;text-transform:none;letter-spacing:0}.project--feature .caption-main small{font-size:12px;line-height:1.2;letter-spacing:0}
.project-image,.project--perlamutria .project-image{width:100%;margin-left:0}.project-image+.project-caption{display:none}
.project--nda .project-image img,.project--perlamutria .project-image img{height:460px;aspect-ratio:auto;object-fit:cover}.project-image span{display:none}
.project--mix{display:block}.mix-tile{width:100%;height:224px;min-height:0;padding:18px 22px;flex-direction:row;align-items:center;justify-content:space-between;box-sizing:border-box}.mix-tile__year{align-self:flex-start}.mix-tile__note{align-self:flex-end}.mix-tile__title{font-size:clamp(36px,4.5vw,62px);line-height:.82}
.project-image + .project-caption,.mix-tile + .project-caption{display:grid;width:100%;min-height:94px;grid-template-columns:minmax(0,1fr);gap:0;margin-top:0;padding:12px 22px;box-sizing:border-box;border-top:max(14px,1.76svh) solid var(--cover-paper);background:rgba(241,241,245,.76);font-family:'Avenir Next Cyr','Avenir Next',Arial,sans-serif;color:var(--ink);backdrop-filter:blur(20px) saturate(108%);-webkit-backdrop-filter:blur(20px) saturate(108%)}
.project--nda .project-caption{background:linear-gradient(rgba(241,241,245,.76),rgba(241,241,245,.76)),url('assets/nda.webp') center bottom / 100% 460px no-repeat}.project--mix .project-caption{background:rgba(192,210,213,.48)}.project--perlamutria .project-caption{background:linear-gradient(rgba(241,241,245,.76),rgba(241,241,245,.76)),url('assets/perlamutria.webp') center bottom / 100% 460px no-repeat}
.project-caption .caption-rule,.project-caption .caption-meta,.project-caption .caption-arrow{display:none}.project-caption .caption-main{display:block}.project-caption .caption-main strong{display:block;font-size:14px;font-weight:800;line-height:1;letter-spacing:-.02em;text-transform:none}.project-caption .caption-main small{display:block;max-width:none;margin-top:20px;font-size:13px;font-weight:500;line-height:1.06;letter-spacing:-.01em;color:rgba(44,37,27,.78)}
.timeline-year{left:calc(50% - var(--frame-width)/2);transform:translate(-112px,12px)}.timeline-year.is-visible{transform:translate(-112px,0)}.timeline-year__line{width:calc(clamp(42px,6.6vw,100px) + 22px);height:.5px}

@media (max-width:760px){
  :root{--image-width:calc(100vw - 48px);--frame-width:var(--image-width);--cover-project-drop:0px}
  .site-header{top:12px;height:28px;padding:0 14px}.site-name,.header-about{line-height:28px}.site-name{font-size:20px}.header-about{font-size:11px}.about-panel{top:12px;height:calc(65.46svh - 12px)}.about-panel__inner{padding:47px 14px 14px}.about-panel__layout{column-gap:12px}.about-panel__intro{max-width:100%;gap:12px;font-size:14px;font-weight:500;line-height:1.09;letter-spacing:-.01em}.about-panel__intro p + p{padding-left:0}.about-panel__contacts,.about-panel__availability{padding-top:13px;font-size:12px;line-height:1.14}.about-panel__label{margin-bottom:11px!important;font-size:12px}.about-panel__contacts::before,.about-panel__availability::before{height:1.5px}.about-panel__links{font-size:12px}body.is-about-open .header-about{font-size:14px;line-height:28px}
  .cover{height:calc(100svh + 100px);min-height:0}.cover-project{top:54px;height:calc(100svh - 54px);min-height:0}.cover-mask--top{height:65.46svh;padding-bottom:5.7svh}.cover-mask--top h1,.cover-mask--bottom p{font-size:20px;line-height:24px}.cover-case-caption{top:calc(100svh - 80px);height:80px;padding:12px 14px}.cover-case-caption strong{font-size:11px}.cover-case-caption span{margin-top:20px;font-size:14px;line-height:1.09}.timeline-year{left:calc(50% - var(--frame-width)/2);transform:translate(-64px,12px)}.timeline-year.is-visible{transform:translate(-64px,0)}.timeline-year__line{width:57px}
  .project--nda .project-image img,.project--perlamutria .project-image img{height:460px}.mix-tile{height:224px;padding:14px}.mix-tile__title{font-size:30px}.project-image + .project-caption,.mix-tile + .project-caption{min-height:90px;padding:11px 14px;border-top-width:max(11px,1.76svh)}.project-caption .caption-main strong{font-size:11px}.project-caption .caption-main small{margin-top:20px;font-size:14px;line-height:1.09}
  .work{width:var(--image-width);padding-top:48px}.project{margin-top:48px}.project--feature .project-caption{margin-top:9px;padding:9px 11px}.project--feature .caption-main strong{font-size:15px}.project--feature .caption-main small{font-size:10px}
}

/* Final navigation refinements. */
.cover-case-caption{scroll-margin-top:calc(100svh - 100px)}
@media (min-width:761px){
  .site-header{top:18px;height:36px;border-color:rgba(192,210,213,.86);background:rgba(192,210,213,.40)}
  .site-header:hover{border-color:rgba(192,210,213,.86);background:rgba(192,210,213,.40)}
  .site-name,.header-about{line-height:36px}
  body.is-about-open .site-header{top:20px;height:48px;border-color:transparent;background:transparent}
  body.is-about-open .site-name,.header-about{line-height:48px}
  body.is-about-open .header-about__open,body.is-about-open .header-about__close{display:none}
  .timeline-year__line,.timeline-year.is-archive .timeline-year__line{width:66px}
}
@media (max-width:760px){.timeline-year.is-archive .timeline-year__line{width:29px}}

/* NDA Studio: the glass information strip is part of the image card. */
.project--nda{position:relative;height:460px}
.project--nda .project-image{height:100%}
.project--nda .project-image img{width:100%;height:100%;aspect-ratio:auto;object-fit:cover;object-position:center center}
.project--nda .project-caption{position:absolute;right:0;bottom:0;left:0;z-index:2;display:grid;height:94px;min-height:94px;margin:0;padding:12px 22px;border-top:max(14px,1.76svh) solid var(--cover-paper);background:rgba(241,241,245,.66);backdrop-filter:none;-webkit-backdrop-filter:none}
.project--nda .project-caption .caption-main{display:flex;width:100%;height:100%;flex-direction:column;align-items:flex-start;justify-content:center;gap:20px}
.project--nda .project-caption .caption-main strong{display:block;font-size:14px;font-weight:800;line-height:1;letter-spacing:.02em;white-space:nowrap}
.project--nda .project-caption .caption-main small{display:block;margin:0;font-size:13px;font-weight:400;line-height:1;letter-spacing:.02em;text-align:left;white-space:nowrap;color:var(--ink)}

@media (max-width:760px){
  .project--nda{height:460px}
  .project--nda .project-caption{height:90px;min-height:90px;padding:11px 14px;border-top-width:max(11px,1.76svh)}
  .project--nda .project-caption .caption-main{gap:20px}
  .project--nda .project-caption .caption-main strong{font-size:11px}
  .project--nda .project-caption .caption-main small{font-size:13px;white-space:normal}
}

/* Keep both cover text blocks optically centered at every responsive width. */
.cover-mask--top h1,.cover-mask--bottom p{justify-items:center;gap:0;font-size:20px;line-height:22px}
.cover-mask--top h1 span,.cover-mask--bottom p span{width:max-content;justify-self:center;text-align:center}

@media (max-width:760px){
  .cover-mask--top h1,.cover-mask--bottom p{gap:0;font-size:20px;line-height:22px}
}

/* Mobile timeline: keep the year visible before the rule, which enters the cards. */
@media (max-width:760px){
  .timeline-year{right:auto;left:calc(50% - var(--frame-width)/2);flex-direction:row;transform:translate(-4px,12px)}
  .timeline-year.is-visible{transform:translate(-4px,0)}
}

/* Page 1 covers: a single feed system, with the caption over the image. */
.project--feed{position:relative;height:460px;margin-top:80px}
.project--feed .project-image{width:100%;height:100%;margin:0}
.project--feed .project-image img{width:100%;height:100%;aspect-ratio:auto;object-fit:cover;object-position:center center}
.project--feed .project-caption{position:absolute;right:0;bottom:0;left:0;z-index:2;display:flex;width:100%;height:94px;min-height:94px;margin:0;padding:12px 22px;box-sizing:border-box;border-top:max(14px,1.76svh) solid var(--cover-paper);background:rgba(241,241,245,.66);color:var(--ink);backdrop-filter:none;-webkit-backdrop-filter:none}
.project--feed .project-caption .caption-main{display:flex;width:100%;height:100%;flex-direction:column;align-items:flex-start;justify-content:center;gap:20px}
.project--feed .project-caption .caption-main strong{display:block;font-size:14px;font-weight:800;line-height:1;letter-spacing:.02em;text-transform:none;white-space:nowrap}
.project--feed .project-caption .caption-main small{display:block;margin:0;font-size:13px;font-weight:400;line-height:1;letter-spacing:.02em;color:var(--ink);white-space:nowrap}
.project--feed-narrow{height:224px}
.project--feed-narrow .project-image img{object-fit:cover}
.project--theatre .project-image img{object-position:center 52%}
.project--theatre{height:clamp(360px,41vw,520px)}
.project--theatre .project-image{background:#fff}
.project--theatre .project-image img{object-fit:contain;object-position:center}
.project--theatre .project-caption__link{text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:3px}
.project--perlamutria .project-image img{object-position:center 54%}
.project--waffles .project-image img{object-position:center 43%}
.project--supernova .project-image img{object-position:center 51%}

@media (max-width:760px){
  .project--feed{height:460px;margin-top:48px}
  .project--theatre{height:clamp(220px,58vw,360px)}
  .project--feed-narrow{height:224px}
  .project--feed .project-caption{height:90px;min-height:90px;padding:11px 14px;border-top-width:max(11px,1.76svh)}
  .project--feed .project-caption .caption-main{gap:20px}
  .project--feed .project-caption .caption-main strong{font-size:11px}
  .project--feed .project-caption .caption-main small{font-size:13px;white-space:normal}
}

/* Comparison pass: NDA's divider is intentionally finer than the other cards. */
.project--nda .project-caption{border-top-width:4px}

/* Cosmoscow card stays a flat image, without the previous inset highlight. */
.project--graphic-one .project-image,.project--graphic-one .project-image::before,.project--graphic-one .project-image::after{box-shadow:none;filter:none}
.project--graphic-one .project-image img,.project--graphic-one .project-image:hover img{box-shadow:none;filter:none}

/* NDA case prototype: a wider continuation of the feed, with a quiet glass header. */
.case-dialog[data-case="nda"]{width:min(68vw,1040px);height:calc(100svh - 36px);margin:18px auto;padding:0;overflow:hidden;background:transparent}
.case-dialog[data-case="nda"]::backdrop{background:rgba(44,37,27,.16);backdrop-filter:blur(4px);-webkit-backdrop-filter:blur(4px)}
.case-dialog[data-case="nda"] .dialog-inner{height:100%;padding:43px 0 0;overflow:auto;border:0;background:var(--cover-paper);box-shadow:none;backdrop-filter:none;-webkit-backdrop-filter:none}
.case-dialog[data-case="nda"] .dialog-inner::before{position:absolute;z-index:4;top:0;right:0;left:0;height:42px;border:1px solid rgba(192,210,213,.86);background:rgba(192,210,213,.42);box-shadow:none;backdrop-filter:blur(22px) saturate(108%);-webkit-backdrop-filter:blur(22px) saturate(108%)}
.case-dialog[data-case="nda"] .dialog-close{position:absolute;z-index:6;top:0;right:16px;width:42px;height:42px;padding:0;color:rgba(44,37,27,.78);font-size:24px;font-weight:400;line-height:42px;text-align:right}
.case-page{width:100%;margin:0;color:var(--ink)}
.case-page figure{margin:0}
.case-page img{display:block;width:100%}
.case-page__hero{width:100%;height:min(68svh,690px);overflow:hidden}
.case-page__hero img{height:100%;object-fit:cover;object-position:center 48%}
.case-page__intro{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr) auto;align-items:center;min-height:82px;padding:17px 24px;border-top:4px solid var(--cover-paper);background:rgba(192,210,213,.42)}
.case-page__intro h2,.case-page__intro p{margin:0;font-size:14px;line-height:1.08;letter-spacing:.01em}
.case-page__intro h2{font-weight:800}.case-page__intro p{font-weight:400}.case-page__intro span{font-size:13px;color:rgba(44,37,27,.62)}
.case-page__space{height:clamp(90px,14vw,190px)}
.case-page__image{width:calc(100% - 48px);margin:0 24px}
.case-page__image img{height:auto}
.case-page__note{display:grid;grid-template-columns:1fr 1fr;gap:32px;padding:22px 24px 90px}
.case-page__note p{max-width:390px;margin:0;font-size:13px;line-height:1.18;color:rgba(44,37,27,.78)}

@media (max-width:760px){
  .case-dialog[data-case="nda"]{width:calc(100% - 24px);height:calc(100svh - 24px);margin:12px auto}
  .case-dialog[data-case="nda"] .dialog-inner{padding-top:37px}
  .case-dialog[data-case="nda"] .dialog-inner::before{height:36px}
  .case-dialog[data-case="nda"] .dialog-close{right:12px;width:36px;height:36px;font-size:21px;line-height:36px}
  .case-page__hero{height:62svh}
  .case-page__intro{grid-template-columns:1fr auto;gap:18px;min-height:92px;padding:15px 14px}
  .case-page__intro p{grid-column:1/-1;grid-row:2}.case-page__intro span{grid-column:2;grid-row:1}
  .case-page__space{height:72px}
  .case-page__image{width:calc(100% - 28px);margin:0 14px}
  .case-page__note{grid-template-columns:1fr;gap:18px;padding:16px 14px 58px}
}

/* Desktop feed rhythm: vertical covers grow with the viewport; every card keeps one gap. */
@media (min-width:761px){
  .work{margin-top:0;padding-top:40px}
  .project--nda{margin-top:0}
  .project--feed{margin-top:40px}
  .project--nda,.project--feed:not(.project--feed-narrow){height:clamp(460px,53vw,670px)}
  .project--feed-narrow{height:224px}
  .project--nda .project-image img{object-position:center 50%}
  .project--waffles .project-image img{object-position:center 48%}
}

/* Becentaurea uses the same translucent in-image caption system as the feed. */
.cover-case-caption{
  top:648px;
  height:94px;
  min-height:62px;
  padding:12px 22px;
  border-top:max(14px,1.76svh) solid var(--cover-paper);
  background:rgba(241,241,245,.66);
  backdrop-filter:none;
  -webkit-backdrop-filter:none;
}

@media (max-width:760px){
  .cover-case-caption{
    top:calc(100svh - 90px);
    height:90px;
    min-height:90px;
    padding:11px 14px;
    border-top-width:max(11px,1.76svh);
  }
  .project--nda{margin-top:0}
}

/* One caption surface across every project: 70% opacity and a shared divider. */
.cover-case-caption,.project--nda .project-caption,.project--feed .project-caption{
  background:rgba(241,241,245,.70);
  backdrop-filter:none;
  -webkit-backdrop-filter:none;
}
.project--nda .project-caption{border-top-width:max(14px,1.76svh)}

@media (max-width:760px){
  .project--nda .project-caption{border-top-width:max(11px,1.76svh)}
}

/* Mobile only: a taller header keeps the same 12/14px vertical framing. */
@media (max-width:760px){
  .site-header{height:48px}
  .site-name,.header-about,body.is-about-open .header-about{line-height:48px}
  .cover-project{top:74px;height:calc(100svh - 74px)}
  .about-panel__inner{padding-top:67px}
}

/* Desktop timeline: equal 12px gaps on both sides of the rule. */
@media (min-width:761px){
  .timeline-year{gap:12px}
  .timeline-year__line,.timeline-year.is-archive .timeline-year__line{width:80px}
}

/* Caption principle: supporting roles are regular; the principal role after the slash is demi. */
.cover-case-caption .cover-case-caption__roles{
  margin-top:5px;
  font-size:13px;
  font-weight:400;
  line-height:1.06;
  letter-spacing:-.01em;
  text-transform:lowercase;
}
.cover-case-caption .cover-case-caption__roles b{font-weight:600}

/* Keep the two-line caption as one vertically centered group. */
.cover-case-caption{justify-content:center}

/* Shared project-caption structure: regular supporting roles, then a demi key role. */
.project--nda .caption-main,
.project--theatre .caption-main,
.project--graphic-one .caption-main,
.project--graphic-two .caption-main,
.project--perlamutria .caption-main,
.project--supernova .caption-main{
  display:flex;
  height:100%;
  flex-direction:column;
  align-items:flex-start;
  justify-content:center;
  gap:5px;
}
.project--nda .project-caption .caption-main{gap:5px}
.project-caption .caption-main .project-caption__roles{
  display:block;
  max-width:none;
  margin:0;
  font-size:13px;
  font-weight:400;
  line-height:1.06;
  letter-spacing:-.01em;
  text-transform:lowercase;
  color:rgba(44,37,27,.78);
}
.project-caption .caption-main .project-caption__roles b{font-weight:600}

/* Every feed caption after Becentaurea shares NDA's compact, centered rhythm. */
.project--feed .project-caption .caption-main{
  display:flex;
  height:100%;
  flex-direction:column;
  align-items:flex-start;
  justify-content:center;
  gap:5px;
}
.project--feed .project-caption .caption-main small{margin:0}

/* Project Opened — Becentaurea prototype: the feed cover stays intact inside a long glass case. */
.case-dialog[data-case]{
  inset:16px auto auto 50%;
  width:min(calc(var(--image-width) + 64px),calc(100vw - 32px));
  height:calc(100svh - 32px);
  margin:0;
  padding:0;
  overflow:visible;
  border:0;
  background:transparent;
  color:var(--cover-paper);
  transform:translateX(-50%);
}
.case-dialog[data-case]::backdrop{
  background:rgba(44,37,27,.16);
  backdrop-filter:blur(6px);
  -webkit-backdrop-filter:blur(6px);
}
.case-dialog[data-case] .dialog-inner{
  height:100%;
  padding:54px 0 44px;
  overflow:auto;
  border:1px solid rgba(44,37,27,.76);
  background:rgba(44,37,27,.76);
  box-shadow:none;
  backdrop-filter:blur(18px) saturate(108%);
  -webkit-backdrop-filter:blur(18px) saturate(108%);
  scrollbar-width:none;
}
.case-dialog[data-case] .dialog-inner::-webkit-scrollbar{display:none}
.case-external-scrollbar{display:none}
.case-dialog[data-case] .case-external-scrollbar{
  position:absolute;
  top:0;
  left:calc(100% + 2px);
  display:block;
  width:2px;
  height:100%;
  pointer-events:none;
}
.case-dialog[data-case] .case-external-scrollbar span{
  display:block;
  width:2px;
  min-height:26px;
  background:var(--ink);
}
.case-dialog[data-case] .dialog-inner::before{
  height:42px;
  border:0;
  border-bottom:1px solid rgba(241,241,245,.24);
  background:transparent;
  backdrop-filter:none;
  -webkit-backdrop-filter:none;
}
.case-dialog[data-case] .dialog-close{
  top:7px;
  right:12px;
  z-index:6;
  width:28px;
  height:28px;
  padding:0;
  font-size:0;
  background:transparent;
}
.case-dialog[data-case] .dialog-close::before,
.case-dialog[data-case] .dialog-close::after{
  position:absolute;
  top:13px;
  left:4px;
  width:20px;
  height:1px;
  background:var(--cover-paper);
  content:"";
}
.case-dialog[data-case] .dialog-close::before{transform:rotate(45deg)}
.case-dialog[data-case] .dialog-close::after{transform:rotate(-45deg)}
.case-page--project{width:100%}
.case-page--project .case-page__hero{
  width:calc(100% - 16px);
  height:670px;
  margin:8px auto 0;
  overflow:hidden;
}
.case-page--project .case-page__hero img{
  width:100%;
  height:100%;
  object-fit:cover;
  object-position:center 48%;
}
.case-page--project .case-page__intro{
  display:flex;
  width:calc(100% - 16px);
  min-height:0;
  margin:0 auto;
  padding:16px 0 0;
  flex-direction:column;
  align-items:flex-start;
  justify-content:center;
  gap:5px;
  border:0;
  background:transparent;
  color:var(--cover-paper);
}
.case-page--project .case-page__intro h2,
.case-page--project .case-page__intro p{margin:0}
.case-page--project .case-page__intro h2{font-size:14px;font-weight:800;line-height:1;letter-spacing:-.02em}
.case-page--project .case-page__intro p{font-size:13px;font-weight:400;line-height:1.06;letter-spacing:-.01em}
.case-page--project .case-page__intro b{font-weight:600}
.case-page__title-link{color:inherit;text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:3px}
.case-page--project .case-page__description{
  width:calc(100% - 16px);
  margin:26px auto 0;
  color:var(--cover-paper);
}
.case-page--project .case-page__description-rule{
  width:min(100%,552px);
  height:2px;
  background:rgba(241,241,245,.9);
}
.case-page--project .case-page__description-copy{
  display:grid;
  width:min(100%,530px);
  margin-top:28px;
  gap:13px;
  opacity:.7;
  font-size:13px;
  font-weight:500;
  line-height:1.06;
  letter-spacing:-.01em;
}
.case-page--project .case-page__description-copy p{margin:0}
.case-page--project .case-page__placeholders{
  --case-grid-gap:10px;
  --case-section-gap:40px;
  display:grid;
  width:calc(100% - 16px);
  margin:68px auto 0;
  gap:var(--case-section-gap);
}
.case-grid{display:grid;gap:var(--case-grid-gap)}
.case-grid--two{grid-template-columns:repeat(2,minmax(0,1fr))}
.case-grid--four{grid-template-columns:repeat(4,minmax(0,1fr))}
.case-grid--three{grid-template-columns:repeat(3,minmax(0,1fr))}
.case-placeholder{
  width:100%;
  aspect-ratio:2 / 3;
  border:1px solid rgba(241,241,245,.24);
  background:rgba(241,241,245,.16);
}
.case-placeholder--large{aspect-ratio:4 / 5}
.case-placeholder--wide{aspect-ratio:16 / 9}
.case-page__content{display:block}
.case-page__content > * + *{margin-top:var(--case-section-gap)}
.case-page__content > .case-media--compact-gap{margin-top:var(--case-grid-gap)}
.case-page__content .case-media{margin-right:0;margin-left:0}
.case-page__content .case-media img{display:block;width:100%;height:auto}
.case-page__content .case-grid .case-media{overflow:hidden}
.case-page__content .case-grid--two .case-media,.case-page__content .case-grid--four .case-media{aspect-ratio:2 / 3}
.case-page__content .case-grid--three .case-media{aspect-ratio:7 / 10}
.case-page__content .case-grid .case-media img{height:100%;object-fit:cover}
.case-page__placeholders.case-page__content--nda,.case-page__placeholders.case-page__content--becentaurea{--case-section-gap:12px}
.case-page__content--nda > .case-media--compact-gap{margin-top:12px}
@media (max-width:760px){
  .case-dialog[data-case]{inset:12px auto auto 50%;width:calc(100% - 24px);height:calc(100svh - 24px);margin:0}
  .case-dialog[data-case] .dialog-inner{padding:46px 0 28px}
  .case-dialog[data-case] .dialog-inner::before{height:36px}
  .case-dialog[data-case] .dialog-close{position:absolute;z-index:10;top:12px;right:12px;width:44px;height:44px}
  .case-dialog[data-case] .dialog-close::before,
  .case-dialog[data-case] .dialog-close::after{top:21px;left:10px;width:24px;height:2px;background:var(--ink)}
  .case-page--project .case-page__hero{width:calc(100% - 8px);height:calc(100svh - 120px);margin-top:4px}
  .case-page--project .case-page__intro,.case-page--project .case-page__description,.case-page--project .case-page__placeholders{width:calc(100% - 8px)}
  .case-page--project .case-page__intro{min-height:0;padding:14px 14px 0}
  .case-page__placeholders{--case-grid-gap:7px;--case-section-gap:28px;margin-top:48px}
}

@media (hover:hover) and (pointer:fine){
  .case-dialog[data-case] .custom-cursor{
    border-color:rgba(44,37,27,.76);
    background:rgba(44,37,27,.76);
    box-shadow:0 1px 0 rgba(44,37,27,.08);
  }
}

/* An opened project owns the wheel; the page behind it remains still. */
body.is-case-open{overflow:hidden}
.case-dialog[data-case] .dialog-inner{
  padding-top:0;
  overscroll-behavior:contain;
}
.case-dialog[data-case] .dialog-inner::before{display:none}
@media (max-width:760px){
  .case-dialog[data-case] .dialog-inner{padding-top:0}
}

/* The close control stays outside the scrolling case, beside its external scroll indicator. */
@media (min-width:761px){
  .case-dialog[data-case] .dialog-close{
    position:absolute;
    top:0;
    right:auto;
    left:calc(100% + 12px);
    width:44px;
    height:44px;
  }
  .case-dialog[data-case] .dialog-close::before,
  .case-dialog[data-case] .dialog-close::after{
    top:21px;
    left:10px;
    width:24px;
    height:2px;
    background:var(--ink);
  }
}

/* Default cursor: the portfolio's ink glass; interactive controls remain pink. */
.custom-cursor{
  border-color:rgba(44,37,27,.76);
  background:rgba(44,37,27,.76);
}
@media (hover:hover) and (pointer:fine){
  .case-dialog[data-case] .custom-cursor.is-case-outside{
    border-color:rgba(44,37,27,.76);
    background:rgba(44,37,27,.76);
    box-shadow:0 1px 0 rgba(44,37,27,.08);
  }
}

/* A full-viewport dialog hit area makes every point outside the card deterministic. */
.case-dialog[data-case]{
  --case-open-width:min(calc(var(--image-width) + 64px),calc(100vw - 96px));
  inset:0;
  width:100vw;
  max-width:none;
  height:100svh;
  max-height:none;
  margin:0;
  transform:none;
}
.case-dialog[data-case] .dialog-inner{
  width:var(--case-open-width);
  height:calc(100svh - 32px);
  margin:16px auto;
}
.case-dialog[data-case] .case-external-scrollbar{
  top:16px;
  left:calc(50% + var(--case-open-width) / 2 + 2px);
  height:calc(100svh - 32px);
}
@media (min-width:761px){
  .case-dialog[data-case] .dialog-close{
    position:fixed;
    top:16px;
    right:auto;
    left:calc(50% + var(--case-open-width) / 2 + 12px);
  }
}
@media (max-width:760px){
  .case-dialog[data-case]{--case-open-width:calc(100vw - 24px)}
  .case-dialog[data-case] .dialog-inner{
    width:var(--case-open-width);
    height:calc(100svh - 24px);
    margin:12px auto;
  }
  .case-dialog[data-case] .case-external-scrollbar{
    top:12px;
    left:calc(50% + var(--case-open-width) / 2 + 2px);
    height:calc(100svh - 24px);
  }
  .case-dialog[data-case] .dialog-close{position:fixed}
}

/* Desktop feed: preserve the rule's right endpoint while extending it 28px to the left. */
@media (min-width:761px){
  .timeline-year{transform:translate(-140px,12px)}
  .timeline-year.is-visible{transform:translate(-140px,0)}
  .timeline-year__line{width:108px}
  .timeline-year.is-archive .timeline-year__line{width:64px}
}

/* One stable timeline measure for projects and Index. */
@media (min-width:761px){
  .timeline-year__line,.timeline-year.is-archive .timeline-year__line{width:89px}
}

/* Footer continues the archive grid: credit in column one, return control in column two. */
.site-footer{
  width:100%;
  margin:0;
  padding:12px max(12px,calc((100% - var(--image-width)) / 2));
  border-top:1px solid var(--ink);
  font-size:clamp(14px,1.05vw,20px);
  font-weight:400;
  line-height:1.18;
  letter-spacing:-.025em;
}
.site-footer span{white-space:nowrap}
@media (max-width:760px){
  .site-footer{
    padding:14px 24px 12px;
    font-size:14px;
  }
}

/* Confirmed card variants: centred coming-soon marks. */
.cover-case-caption{background:rgba(241,241,245,.70)}
.project-image .project-soon{position:absolute;z-index:1;top:50%;right:auto;bottom:auto;left:50%;display:block;padding:0;border:0;background:transparent;font-size:20px;font-weight:800;line-height:1;letter-spacing:0;color:rgba(44,37,27,.52);opacity:1;transform:translate(-50%,-50%);pointer-events:none}
.project--graphic-one .project-soon{color:rgba(241,241,245,.88)}
.project--graphic-two .project-soon{color:var(--paper)}
.project--waffles .project-soon{color:var(--paper)}
.project-image:hover .project-soon{transform:translate(-50%,-50%)}

/* Becentaurea keeps its card unchanged; only its opened glass uses GLS blue. */
.case-dialog[data-case="becentaurea"] .dialog-inner{border-color:rgba(192,210,213,.76);background:rgba(192,210,213,.76)}

/* Perlamutria: intrinsic image proportions dictate each content group. */
.case-page__content--perlamutria .case-grid--screens{grid-template-columns:repeat(3,minmax(0,1fr))}
.case-page__content--perlamutria .case-grid--screens .case-media{aspect-ratio:auto}
.case-page__content--perlamutria .case-grid--screens .case-media img{height:auto;object-fit:initial}
.case-page__content--perlamutria .case-grid--box-strip{grid-template-columns:1.954fr 1fr;align-items:start}
.case-page__content--perlamutria .case-grid--box-strip .case-media{aspect-ratio:auto}
.case-page__content--perlamutria .case-grid--box-strip .case-media img{height:auto;object-fit:initial}

/* Graphic Works: every pair stays independent, with the widest case rhythm. */
.case-page__content--graphic-works{--case-grid-gap:40px;--case-section-gap:40px}
.case-page__content--graphic-works .case-separator{width:100%;height:1px;margin-right:auto;margin-left:auto;background:rgba(241,241,245,.92)}
.case-page__content--graphic-works > .case-separator:not(:first-child){margin-top:calc(var(--case-section-gap) / 2)}
.case-page__content--graphic-works > .case-separator + .case-grid{margin-top:calc(var(--case-section-gap) / 2)}
.case-page__content--graphic-works .case-grid--graphic-first .case-media,.case-page__content--graphic-works .case-grid--graphic-posts .case-media,.case-page__content--graphic-works .case-grid--graphic-stories .case-media,.case-page__content--graphic-works .case-grid--graphic-slides .case-media{aspect-ratio:auto}
.case-page__content--graphic-works .case-grid--graphic-first .case-media img,.case-page__content--graphic-works .case-grid--graphic-posts .case-media img,.case-page__content--graphic-works .case-grid--graphic-stories .case-media img,.case-page__content--graphic-works .case-grid--graphic-slides .case-media img{height:auto;object-fit:initial}
.case-page__content--graphic-works .case-grid--illustrations .case-media{aspect-ratio:auto}
.case-page__content--graphic-works .case-grid--illustrations .case-media img{height:auto;object-fit:initial}
.case-page__content--graphic-works .case-grid--mr-posters .case-media{aspect-ratio:auto}
.case-page__content--graphic-works .case-grid--mr-posters .case-media img{height:auto;object-fit:initial}
.case-page__content--becentaurea .case-grid--bec-first .case-media{aspect-ratio:auto}
.case-page__content--becentaurea .case-grid--bec-first .case-media img{height:auto;object-fit:initial}
.project-image--inactive:hover img{transform:none;filter:none}

/* The theatre triptych uses the supplied artwork at its natural aspect ratio. */
.project--feed.project--theatre{height:auto}
.project--theatre .project-image{height:auto;background:#fff}
.project--theatre .project-image img{height:auto;aspect-ratio:auto;object-fit:initial;object-position:center;transform:none}
.project--theatre .project-image:hover img{transform:none}
@media (max-width:760px){
  .cover-mask--bottom p{width:100%;max-width:calc(100vw - 48px);font-size:clamp(17px,5vw,20px);transform:translateY(-40px)}
  .cover-mask--bottom p span{width:max-content;max-width:100%;justify-self:center;text-align:center}
  .timeline-year,.timeline-year.is-archive{right:auto;left:50%;gap:0;transform:translate(-50%,12px)}
  .timeline-year.is-visible,.timeline-year.is-visible.is-archive{transform:translate(-50%,0)}
  .timeline-year__line,.timeline-year.is-archive .timeline-year__line{display:none}
  .timeline-year__value{color:var(--ink);font-size:11px;font-weight:600;opacity:1}
}

/* The desktop year follows the same centred, line-free system as mobile. */
@media (min-width:761px){
  .timeline-year,.timeline-year.is-archive{right:auto;left:50%;gap:0;transform:translate(-50%,12px)}
  .timeline-year.is-visible,.timeline-year.is-visible.is-archive{transform:translate(-50%,0)}
  .timeline-year__line,.timeline-year.is-archive .timeline-year__line{display:none}
  .timeline-year__value{color:var(--ink);font-size:16px;font-weight:800;opacity:1}
}

/* Final navigation and mobile type hierarchy. */
.nav-arrow{position:relative;display:block;width:24px;height:24px;font-style:normal}
.nav-arrow::before{position:absolute;top:4px;left:11px;width:2px;height:16px;background:currentColor;content:""}
.nav-arrow::after{position:absolute;left:8px;width:8px;height:8px;border-right:2px solid currentColor;border-bottom:2px solid currentColor;content:""}
.nav-arrow--down::after{bottom:3px;transform:rotate(45deg)}
.nav-arrow--up::after{top:3px;transform:rotate(225deg)}
.scroll-cue{display:grid;width:32px;height:32px;place-items:center;color:var(--ink);font-size:0}
.footer-to-top{display:grid;width:32px;height:32px;place-items:center;justify-self:end;color:rgba(44,37,27,.78);text-decoration:none}
.site-footer{grid-template-columns:minmax(0,1fr) auto;padding-right:clamp(12px,2.2vw,32px)}
.timeline-index{margin-top:48px;margin-bottom:48px}

@media (max-width:760px){
  .about-panel__contacts,
  .about-panel__availability{margin-top:19px}
  .timeline-year__value{font-weight:800}
  .timeline-index{margin-top:36px;margin-bottom:36px}
  .cover-mask--bottom p{font-size:18px;letter-spacing:-.01em;transform:translateY(-28px)}
  .cover-case-caption strong,
  .project--nda .project-caption .caption-main strong,
  .project--feed .project-caption .caption-main strong{font-size:13px;letter-spacing:.01em}
  .cover-case-caption .cover-case-caption__roles,
  .project-caption .caption-main .project-caption__roles,
  .project--nda .project-caption .caption-main small,
  .project--feed .project-caption .caption-main small{font-size:13px}
  .case-dialog[data-case] .dialog-close{position:fixed;z-index:100;top:12px;right:12px}
  .case-dialog[data-case="becentaurea"] .dialog-close::before,
  .case-dialog[data-case="becentaurea"] .dialog-close::after{background:var(--paper)}
  .site-footer{padding-right:12px}
}