/* Portfolio collections: generous composition, restrained motion, real CMS artwork. */
.portfolio-page{background:#f2f0e7;--portfolio-paper:#f2f0e7;--portfolio-ink:#202720;--portfolio-muted:#65705f;--portfolio-gold:#e6cc83}
.portfolio-page .sr-only,.portfolio-results-status{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap;border:0}
.portfolio-page [hidden]{display:none!important}
.portfolio-page .portfolio-hero{position:relative;isolation:isolate;padding:70px 7% 0;overflow:visible;background:transparent;min-height:0}
.portfolio-page .portfolio-hero::before{content:'';position:absolute;inset:-240px 0 0;z-index:-1;opacity:1;border-radius:0 0 38px 38px;background-color:#202720;background-image:radial-gradient(ellipse at 85% 0,#ddc58d14,transparent 65%),linear-gradient(#ddc58d07 1px,transparent 1px),linear-gradient(90deg,#ddc58d07 1px,transparent 1px);background-size:auto,80px 80px,80px 80px;mask-image:none}
.portfolio-intro-grid{display:grid;grid-template-columns:1.2fr 1fr;gap:7%;align-items:center;padding:0 0 64px;min-height:390px}
.portfolio-intro-copy{position:relative;z-index:2}
.portfolio-page .portfolio-intro-copy h1{font-size:clamp(54px,5.8vw,100px);line-height:1.06;letter-spacing:-.065em;margin:0 0 28px;font-weight:500}
.portfolio-intro-copy h1 em{display:inline-block;font-family:Caveat,cursive;font-size:1.05em;line-height:1.12;letter-spacing:-.035em;color:#ddc58d}
.portfolio-intro-copy>p{font-size:16px;line-height:1.9;max-width:460px;color:#b3bbad;margin-bottom:28px}
.portfolio-intro-art{position:relative;width:100%;height:360px;perspective:1200px}
.portfolio-intro-art{display:grid;place-items:center;padding-bottom:20px}
.portfolio-drawing-browser{width:100%;max-width:490px;border:1px solid #ddc58d55;border-radius:12px;background:#242d2380;box-shadow:0 18px 45px #0c130c25;overflow:hidden;rotate:0deg}
.portfolio-drawing-window{display:flex;align-items:center;justify-content:space-between;padding:15px 18px;border-bottom:1px solid #ddc58d33;color:#c2b181}
.portfolio-drawing-window>span{display:flex;gap:6px}.portfolio-drawing-window i{width:5px;height:5px;background:#b4ab83;border-radius:50%}
.portfolio-drawing-window small{font:500 9px/1 Manrope,sans-serif;letter-spacing:.13em}
.portfolio-website-drawing g:first-child{stroke-width:1.4}
.portfolio-website-drawing{display:block;width:100%;height:auto;color:#c3b17c;overflow:visible}
.portfolio-logo-drawing{display:block;width:min(100%,365px);height:100%;max-height:340px;overflow:visible}
.portfolio-art-note{position:absolute;bottom:-10px;left:9%;font:26px/1.2 Caveat,cursive;color:#ddc58d;rotate:-5deg}
.portfolio-hero-bottom{display:flex;align-items:center;justify-content:space-between;gap:20px;padding:24px 0;border-top:1px solid #ddc58d24;font-size:9px;letter-spacing:.13em;color:#aeb7a5}
.portfolio-hero-bottom>a{display:flex;align-items:center;gap:12px;letter-spacing:0;color:#e6cc83;font-size:12px}.portfolio-hero-bottom svg{width:16px;height:16px}
.portfolio-page .portfolio-work{background:var(--portfolio-paper);color:var(--portfolio-ink);padding:90px 7% 0;margin:0;overflow:clip}
.portfolio-work-heading{display:flex;justify-content:space-between;align-items:flex-end;gap:70px;margin-bottom:65px}.portfolio-work-heading .eyebrow{color:#8c713a;font-size:10px}.portfolio-work-heading h2{margin:20px 0 0;font-size:clamp(40px,4.3vw,70px);letter-spacing:-.055em;line-height:1.1}.portfolio-work-heading>p{width:300px;font-size:15px;line-height:1.85;color:#65705f;margin:0 0 5px}
.portfolio-project-list{display:grid;gap:100px}.portfolio-project.web-project{min-width:0;margin:0}
.portfolio-project-heading{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:20px;margin-bottom:28px}
.portfolio-index{align-self:start;font-size:11px;color:#8c713a;padding-top:5px}.portfolio-index i{display:block;width:20px;height:1px;background:#ad945b;margin-top:12px}
.portfolio-project-kicker{font-size:9px;letter-spacing:.14em;color:#7b806f;margin:0 0 10px}.portfolio-project-heading h3{font:500 clamp(28px,3vw,46px)/1.15 Manrope,sans-serif;letter-spacing:-.045em;margin:0 0 8px}.portfolio-project-heading>div>p:last-child{margin:0;font-size:13px;color:#687260}
.portfolio-project-visit{display:flex;align-items:center;gap:24px;font-size:13px;padding:12px 0;border-bottom:1px solid #aa914f66;white-space:nowrap}.portfolio-project-visit svg{width:20px;height:20px;transition:translate .25s}.portfolio-project-visit:hover svg{translate:2px -2px}
.portfolio-page .portfolio-project-display{position:relative;padding:66px 19% 70px 5%;border-radius:20px;background:#e8e4d8;background-image:radial-gradient(ellipse at 20% 20%,#fff7,transparent 75%);overflow:hidden;isolation:isolate}
.portfolio-project:nth-child(2n) .portfolio-project-display{background-color:#e2e5dc}
.portfolio-device-label{position:absolute;left:5%;top:26px;font-size:8px;letter-spacing:.13em;color:#6a705f}
.portfolio-project-display .project-desktop{position:relative;top:auto;left:auto;width:100%;margin:0;transform:translateY(calc(var(--portfolio-parallax,0)*-12px)) rotate(calc(var(--portfolio-parallax,0)*-.35deg));border-radius:10px;box-shadow:0 20px 35px #20272018}
.portfolio-project-display .project-browser-bar{padding:12px 14px}.portfolio-project-display .project-browser-bar>span{font-size:8px;letter-spacing:.04em}
.portfolio-project-display .project-desktop>img{display:block;width:100%;height:auto;aspect-ratio:auto;object-fit:contain}
.portfolio-project-display .project-phone{position:absolute;top:auto;left:auto;margin:0;right:4%;bottom:24px;width:21%;transform:translateY(calc(var(--portfolio-parallax,0)*14px)) rotate(3deg)}
.portfolio-project-foot{display:flex;align-items:center;gap:25px;margin-top:22px;padding-bottom:25px;border-bottom:1px solid #20272024;font-size:11px;color:#6c735f}.portfolio-detail-note{margin-left:auto;font:22px Caveat,cursive;color:#8b7748}
.portfolio-filter-bar{display:flex;flex-wrap:wrap;gap:8px;margin:-12px 0 34px;width:fit-content;max-width:100%}
.portfolio-filter-bar>button{border:1px solid #20272020;border-radius:30px;padding:12px 19px;background:transparent;font:500 13px 'DM Sans',sans-serif;color:#65705f;cursor:pointer;display:flex;gap:14px;align-items:center;transition:background .3s ease,color .3s ease,border-color .3s ease,box-shadow .3s ease}
.portfolio-filter-bar>button>span{font-size:10px;opacity:.6;font-variant-numeric:tabular-nums}.portfolio-filter-bar>button[aria-pressed=true]{color:#202720;background:#e6cc83;border-color:#e6cc83}.portfolio-filter-bar>button:hover{border-color:#ae9356}
.portfolio-design-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));grid-auto-rows:340px;grid-auto-flow:dense;gap:28px}
.portfolio-design-item{min-width:0;min-height:0}.portfolio-design-large{grid-row:span 2}.portfolio-design-item>figure{display:flex;flex-direction:column;height:100%;margin:0}
.portfolio-design-open{flex:1;position:relative;display:block;width:100%;padding:0;min-height:0;border:1px solid #20272014;border-radius:14px;background:#faf8f1;cursor:zoom-in;overflow:hidden;transition:translate .35s,box-shadow .35s,border-color .35s}
.portfolio-design-number{position:absolute;left:20px;top:17px;font-size:9px;letter-spacing:.08em;color:#92947e;z-index:1}
.portfolio-design-art{position:absolute;inset:25px 0 16px;display:flex;align-items:center;justify-content:center}
.portfolio-design-art>img{width:var(--art-scale,85%);height:var(--art-scale,85%);object-fit:contain;display:block;max-width:100%;transition:scale .5s cubic-bezier(.22,1,.36,1)}
.portfolio-design-zoom{position:absolute;right:16px;bottom:16px;display:grid;place-items:center;width:32px;height:32px;border:1px solid #b6a06a60;border-radius:50%;font:22px/1 Manrope;color:#89723b;background:#faf8f1b8;transition:background .25s,rotate .35s}
.portfolio-design-item figcaption{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-top:17px;padding:0 2px 6px}.portfolio-design-item figcaption span{font-size:8px;letter-spacing:.13em;color:#848772}.portfolio-design-item h3{font:500 17px/1.4 Manrope,sans-serif;letter-spacing:-.025em;margin:4px 0 0}.portfolio-design-item figcaption>svg{width:18px;height:18px;color:#a28a4b;opacity:.6}
.portfolio-empty{padding:40px;border:1px solid #20272020;border-radius:14px;font-size:15px;color:#65705f;line-height:1.8}
.portfolio-collection-end{margin-top:90px;padding:55px 0 65px;display:flex;align-items:center;gap:22px;border-top:1px solid #20272020;color:#737a65}.portfolio-collection-end>span{font-size:35px;color:#a38c50}.portfolio-collection-end>p{margin:0;font:27px Caveat,cursive}.portfolio-collection-end>a{margin-left:auto;display:flex;align-items:center;gap:20px;font-size:13px;color:#756035}.portfolio-collection-end svg{width:20px;height:20px}
.portfolio-page .portfolio-contact{padding-top:95px;padding-bottom:90px;background:#202720}.portfolio-contact>p{max-width:440px;margin:0 auto 20px;font-size:15px;color:#b3bbad}.portfolio-contact .contact-link{font-size:17px;gap:30px}.portfolio-contact .contact-link>svg{width:24px;height:24px}
.portfolio-page button:focus-visible,.portfolio-page .portfolio-design-open:focus-visible{outline:2px solid #a78a43;outline-offset:5px}
@media(hover:hover) and (pointer:fine){.portfolio-design-open:hover{translate:0 -5px;border-color:#bba26080;box-shadow:0 15px 30px -13px #443c2633}.portfolio-design-open:hover img{scale:1.025}.portfolio-design-open:hover .portfolio-design-zoom{background:#e6cc83;rotate:90deg}}
@media(prefers-reduced-motion:no-preference){
.portfolio-motion [data-portfolio-reveal]{transition:opacity .7s ease var(--portfolio-reveal-delay,0ms),translate .85s cubic-bezier(.22,1,.36,1) var(--portfolio-reveal-delay,0ms)}
.portfolio-motion [data-portfolio-reveal].portfolio-awaiting{opacity:0;translate:0 30px}
.portfolio-work-heading>p{--portfolio-reveal-delay:100ms}
.portfolio-motion .portfolio-design-item.portfolio-scroll-item{opacity:var(--portfolio-scroll-opacity,1);translate:0 var(--portfolio-scroll-y,0px);transition:none}
}
@media(min-width:1600px){.portfolio-page .portfolio-hero,.portfolio-page .portfolio-work{padding-left:max(7%,calc((100vw - 1400px)/2));padding-right:max(7%,calc((100vw - 1400px)/2))}}
@media(max-width:1100px){.portfolio-design-grid{grid-template-columns:repeat(2,minmax(0,1fr));grid-auto-rows:310px}.portfolio-intro-grid{gap:3%}.portfolio-intro-art{height:300px}.portfolio-project-foot{gap:15px}.portfolio-detail-note{font-size:19px}.portfolio-project-heading{grid-template-columns:minmax(0,1fr) auto;gap:12px}}
@media(max-width:800px){
.portfolio-page .portfolio-hero{padding:50px 6% 0}.portfolio-page .portfolio-hero::before{border-radius:0 0 26px 26px}.portfolio-intro-grid{grid-template-columns:1fr;gap:32px;padding-bottom:32px;min-height:0}
.portfolio-page .portfolio-intro-copy h1{font-size:clamp(48px,10.8vw,72px);margin-bottom:20px}.portfolio-intro-copy>p{font-size:14px;line-height:1.85;max-width:100%;margin-bottom:22px}
.portfolio-intro-art{height:300px;max-width:440px;margin:0 auto 22px}.portfolio-drawing-browser{width:94%;max-width:430px;border-radius:9px}.portfolio-drawing-window{padding:11px 13px}.portfolio-drawing-window small{font-size:7px}.portfolio-logo-drawing{max-height:230px;width:min(75%,260px)}.portfolio-art-note{font-size:24px;left:10%;bottom:-2px}
.portfolio-hero-bottom{font-size:8px;padding:20px 0;gap:12px;flex-wrap:wrap}.portfolio-hero-bottom>span:first-child{display:none}.portfolio-hero-bottom>a{font-size:11px}
.portfolio-page .portfolio-work{padding:55px 6% 0}.portfolio-work-heading{display:block;margin-bottom:36px}.portfolio-work-heading h2{font-size:42px;margin-top:17px}.portfolio-work-heading>p{width:auto;max-width:400px;font-size:14px;margin:24px 0 0}.portfolio-work-heading .eyebrow{font-size:8px}
.portfolio-project-list{gap:60px}.portfolio-project-heading{grid-template-columns:1fr;gap:12px;margin-bottom:22px}.portfolio-project-heading h3{font-size:29px}.portfolio-project-heading>div>p:last-child{font-size:12px}.portfolio-project-kicker{font-size:8px;margin-bottom:8px}.portfolio-project-visit{grid-column:1;justify-self:start;font-size:12px;padding:5px 0 9px;gap:20px}.portfolio-index{font-size:10px}
.portfolio-page .portfolio-project-display{padding:42px 18% 43px 4%;border-radius:12px;min-height:0}.portfolio-device-label{top:16px;left:4%;font-size:6px}.portfolio-project-display .project-browser-bar{padding:7px}.portfolio-project-display .project-browser-bar>span{font-size:5px;margin-left:3px}.portfolio-project-display .project-browser-bar>i{width:3px;height:3px}.portfolio-project-display .project-desktop{border-radius:6px}.portfolio-project-display .project-phone{width:27%;right:1%;bottom:12px}
.portfolio-project-foot{gap:12px;flex-wrap:wrap;margin-top:17px;padding-bottom:18px;font-size:9px}.portfolio-detail-note{width:100%;margin:0;font-size:22px}
.portfolio-filter-bar{gap:7px;margin:0 0 24px}.portfolio-filter-bar>button{font-size:12px;padding:10px 15px;gap:10px}.portfolio-design-grid{gap:24px 14px;grid-auto-rows:225px}.portfolio-design-large{grid-column:span 2;grid-row:span 2}.portfolio-design-number{left:12px;top:11px;font-size:8px}.portfolio-design-art{inset:22px 0 11px}.portfolio-design-item figcaption{margin-top:12px;gap:6px}.portfolio-design-item figcaption span{font-size:6px;letter-spacing:.1em}.portfolio-design-item h3{font-size:13px;line-height:1.45}.portfolio-design-item figcaption>svg{width:15px;height:15px}.portfolio-design-open{border-radius:10px}.portfolio-design-zoom{right:10px;bottom:10px;width:26px;height:26px;font-size:18px}
.portfolio-collection-end{margin-top:50px;padding:32px 0 42px;gap:12px;flex-wrap:wrap}.portfolio-collection-end>span{font-size:27px}.portfolio-collection-end>p{font-size:24px}.portfolio-collection-end>a{width:100%;margin:10px 0 0 39px;font-size:12px;gap:15px}
.portfolio-page .portfolio-contact{padding:65px 6%}.portfolio-contact h2{font-size:44px}.portfolio-contact>p{font-size:14px}.portfolio-contact .contact-link{font-size:15px}
.portfolio-lightbox{width:94vw;height:92dvh;padding:20px 16px 15px;border-radius:13px}.portfolio-lightbox-top h2{font-size:20px}.portfolio-lightbox-close{width:36px;height:36px;font-size:24px}.portfolio-lightbox-art{padding:20px 0}.portfolio-lightbox-top .eyebrow{font-size:7px}
}
@media(max-width:400px){.portfolio-design-grid{grid-auto-rows:205px}.portfolio-intro-art{height:300px}}
@media(prefers-reduced-motion:reduce){.portfolio-project-display .project-desktop,.portfolio-project-display .project-phone{transform:none}.portfolio-design-open:hover{translate:none}.portfolio-design-open:hover img{scale:1}.portfolio-page *{scroll-behavior:auto}}

/* Logo construction lines share the entire hero, aligned to the original vector. */
.portfolio-construction-grid{position:absolute;left:0;top:-240px;width:100%;height:calc(100% + 240px);z-index:0;pointer-events:none;fill:none;stroke:#ddc58d;stroke-width:1;clip-path:inset(0 round 0 0 38px 38px)}
.portfolio-intro-grid,.portfolio-hero-bottom{position:relative;z-index:1}
@media(max-width:800px){.portfolio-construction-grid{clip-path:inset(0 round 0 0 26px 26px)}}

.portfolio-project-story{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,280px),1fr));gap:28px 48px;margin-top:32px}
.portfolio-project-story>div{min-width:0}
.portfolio-project-story h4{font:500 18px/1.4 Manrope,sans-serif;letter-spacing:-.025em;margin:0 0 12px;color:var(--portfolio-ink)}
.portfolio-project-story p{font-size:15px;line-height:1.85;color:var(--portfolio-muted);margin:0;white-space:pre-line;overflow-wrap:anywhere}

.portfolio-project-chips{display:flex;flex-wrap:wrap;gap:10px;list-style:none;margin:0;padding:0;max-width:100%}
.portfolio-project-chips li{padding:9px 16px;border:1px solid #20272026;border-radius:999px;background:#e8e4d8;color:var(--portfolio-ink);font-size:12px;line-height:1.5;overflow-wrap:anywhere;max-width:100%}

/* Match the homepage device composition on mobile. */
@media(max-width:800px){
 .portfolio-page .portfolio-project-display{display:flow-root;padding:24px 5% 20px;margin-inline:0;min-height:0;border-radius:16px;background:#e8e4d9}
 .portfolio-project-display .portfolio-device-label{display:none}
 .portfolio-page .portfolio-project-display .project-desktop{position:absolute;top:24px;left:5%;width:90%;max-width:none;margin:0;border-radius:7px;box-shadow:0 10px 22px #20272018;transform:none}
 .portfolio-page .portfolio-project-display .project-phone{position:relative;width:52%;right:auto;bottom:auto;margin:70px 0 0 auto;transform:none;z-index:2}
}

.portfolio-collection-end>span{display:flex;flex:0 0 auto;align-items:center;justify-content:center;line-height:1}
.portfolio-collection-end .portfolio-idea-icon{display:block;width:35px;height:35px}
@media(max-width:800px){.portfolio-collection-end .portfolio-idea-icon{width:27px;height:27px}}

.portfolio-lightbox{position:fixed;inset:0;width:min(1100px,94vw);max-width:none;height:min(92dvh,1100px);max-height:none;margin:auto;padding:26px 30px 20px;border:1px solid #e6cc8333;border-radius:18px;background:#f7f5ed;color:#202720;box-shadow:0 30px 100px #0004;overflow:hidden;box-sizing:border-box}
.portfolio-lightbox[open]{display:flex;flex-direction:column}.portfolio-lightbox::backdrop{background:#10170fe0;backdrop-filter:blur(8px)}
.portfolio-lightbox-top{display:flex;justify-content:space-between;align-items:center;gap:20px;flex-shrink:0}.portfolio-lightbox-top .eyebrow{color:#90743d;font-size:9px}.portfolio-lightbox-top h2{font:500 25px/1.4 Manrope,sans-serif;letter-spacing:-.04em;margin:6px 0 0;overflow-wrap:anywhere}.portfolio-lightbox-top>div{min-width:0}
.portfolio-lightbox-close,.portfolio-lightbox-bottom>button{display:grid;place-items:center;flex-shrink:0;border:1px solid #20272022;border-radius:50%;width:44px;height:44px;background:transparent;color:#202720;cursor:pointer}.portfolio-lightbox button svg{width:24px;height:24px}
.portfolio-lightbox-art{display:flex;align-items:center;justify-content:center;flex:1;min-height:0;padding:25px 0}.portfolio-lightbox-art img{display:block;max-width:100%;max-height:100%;width:100%;height:100%;object-fit:contain}
.portfolio-lightbox-bottom{display:flex;align-items:center;justify-content:center;gap:24px;font-size:12px;color:#737a65;flex-shrink:0}.portfolio-lightbox-bottom>button:disabled{opacity:.3;cursor:default}
html.portfolio-modal-open{overflow:hidden;scrollbar-gutter:stable}
@media(max-width:800px){
 .portfolio-lightbox{inset:0;width:100%;height:100vh;height:100dvh;max-width:100%;max-height:none;margin:0;border:0;border-radius:0;box-shadow:none;padding:max(18px,env(safe-area-inset-top)) max(16px,env(safe-area-inset-right)) max(16px,env(safe-area-inset-bottom)) max(16px,env(safe-area-inset-left))}
 .portfolio-lightbox-top{gap:12px}.portfolio-lightbox-top h2{font-size:20px}.portfolio-lightbox-art{padding:20px 0}
}

/* Frosted desktop frame with an opaque presentation area. */
@media(min-width:801px){
 .portfolio-lightbox{background:rgba(247,245,237,.58);-webkit-backdrop-filter:blur(22px) saturate(115%);backdrop-filter:blur(22px) saturate(115%);border-color:#ffffff70;box-shadow:0 24px 80px #10170f30}
 .portfolio-lightbox::backdrop{background:rgba(16,23,15,.28);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}
 .portfolio-lightbox-art{background:#f7f5ed;border-radius:12px;margin:22px 0 18px;padding:24px;overflow:hidden}
 .portfolio-lightbox-bottom{color:#202720}
 .portfolio-lightbox-close,.portfolio-lightbox-bottom>button{background:#f7f5edb8;border-color:#20272030}
}

@media(max-width:800px){
 html.mobile-lightbox-open,html.mobile-lightbox-open body{background:#f7f5ed!important}
 html.mobile-lightbox-open{color-scheme:light}
 .portfolio-lightbox::backdrop{background:#f7f5ed}
}

@media(prefers-reduced-motion:no-preference){
 .portfolio-lightbox.lightbox-entering::backdrop{animation:portfolio-backdrop-in .48s ease-out both}
 .portfolio-lightbox.lightbox-leaving::backdrop{animation:portfolio-backdrop-out .28s ease-in both}
 @keyframes portfolio-backdrop-in{from{opacity:0}to{opacity:1}}
 @keyframes portfolio-backdrop-out{from{opacity:1}to{opacity:0}}
}

.portfolio-lightbox-art img{-webkit-user-drag:none;user-select:none;-webkit-user-select:none}

@media(prefers-reduced-motion:no-preference){.portfolio-filter-bar>button:hover{box-shadow:0 4px 12px #2027200a}.portfolio-filter-bar>button:active{transform:scale(.97)}}

/* A quiet testimonial beside the project story, with one shared baseline. */
.portfolio-project-details{display:grid;gap:30px;margin-top:38px;padding-bottom:32px;border-bottom:1px solid #20272020;align-items:start}
.portfolio-project-details.has-review{grid-template-columns:repeat(2,minmax(0,1fr));gap:clamp(28px,3.5vw,48px)}
.portfolio-project-copy{min-width:0;padding-top:3px}
.portfolio-project-details .portfolio-project-story{margin-top:0}
.portfolio-project-details .portfolio-project-story h4{font-size:17px;margin-bottom:13px}
.portfolio-project-details .portfolio-project-foot{margin-top:24px;padding-bottom:0;border-bottom:0}
.portfolio-project-details .portfolio-project-chips{gap:8px}
.portfolio-project-details .portfolio-project-chips li{font-size:11px;padding:7px 13px;background:#e8e4d880;border-color:#2027201a}
.portfolio-project-review{position:relative;min-width:0;padding:21px 25px 19px;border:0;border-radius:3px 3px 10px 10px;background:#faf8f0 url('/assets/home/paper-grain.svg');box-shadow:0 8px 24px -16px #30291e30}
.portfolio-project-review .review-paper-top{gap:12px;font-size:8px;letter-spacing:.12em;color:#8a7547}
.portfolio-project-review .review-paper-top>.review-stars{font-size:15px;letter-spacing:1px}
.portfolio-project-review blockquote{position:relative;margin:16px 0 0;padding:0 0 0 23px}
.portfolio-project-review blockquote::before{content:'“';position:absolute;left:-2px;top:-9px;font:42px/1 Georgia,serif;color:#b5a16c}
.portfolio-project-review blockquote p{font-size:14px;line-height:1.75;color:#424b3c;white-space:pre-line;overflow-wrap:anywhere;margin:0}
.portfolio-project-review .review-author{margin:16px 0 0 23px;padding-top:12px;border-top:1px solid #89774926}
.portfolio-project-review .review-author strong{font-size:23px;line-height:1.35}
.portfolio-project-review .review-author div>span{font-size:11px;line-height:1.6;margin-top:3px;color:#79806f}
@media(max-width:1000px) and (min-width:801px){.portfolio-project-review{padding:21px}.portfolio-project-review .review-paper-top{flex-wrap:wrap;gap:7px}}
@media(max-width:800px){
 .portfolio-project-details{margin-top:26px;padding-bottom:28px}
 .portfolio-project-details.has-review{grid-template-columns:minmax(0,1fr);gap:25px}
 .portfolio-project-review{padding:22px}
 .portfolio-project-review blockquote{margin-top:18px}
 .portfolio-project-review .review-paper-top{font-size:8px}
}

/* Keep the signature compact so the testimonial balances the adjacent project copy. */
.portfolio-project-review .review-author>div{display:flex;align-items:baseline;justify-content:space-between;flex-wrap:wrap;gap:3px 18px;width:100%}
.portfolio-project-review .review-author div>span{margin-top:0}

/* A composited three-slide stage: images follow the finger without fades or src swaps. */
.portfolio-lightbox-art{overflow:hidden;touch-action:pan-y pinch-zoom;overscroll-behavior-x:contain}
.portfolio-swipe-viewport{position:relative;flex:1;align-self:stretch;min-width:0;min-height:0;overflow:hidden}
.portfolio-swipe-track{position:absolute;inset:0;transform:translate3d(0,0,0)}
.portfolio-swipe-track.is-moving{will-change:transform}
.portfolio-swipe-slide{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;backface-visibility:hidden}
.portfolio-swipe-slide[hidden]{display:none}
.portfolio-lightbox-art .portfolio-swipe-slide img{width:100%;height:100%;object-fit:contain;pointer-events:none;-webkit-user-drag:none;user-select:none}

/* Keep short and two-line captions from resizing the image stage between slides. */
@media(max-width:800px){.portfolio-lightbox-top h2{min-height:2.8em}}

/* Let swiping images enter at the mobile dialog edge, beyond its text inset. */
@media(max-width:800px){
 .portfolio-lightbox-art{margin-left:calc(-1 * max(16px,env(safe-area-inset-left)));margin-right:calc(-1 * max(16px,env(safe-area-inset-right)))}
}

/* Match the homepage's reading sizes across both portfolio collections. */
.portfolio-page{--portfolio-reading-size:17px;--portfolio-label-size:12px}
.portfolio-intro-copy>p,.portfolio-work-heading>p,
.portfolio-project-heading>div>p:last-child,.portfolio-project-story p,
.portfolio-project-review blockquote p,.portfolio-contact>p,.portfolio-empty{
 font-size:var(--portfolio-reading-size);line-height:1.85;
}
.portfolio-intro-copy>p{max-width:520px}
.portfolio-work-heading>p{width:340px;max-width:100%}
.portfolio-work-heading .eyebrow,.portfolio-project-kicker,
.portfolio-design-item figcaption span,.portfolio-design-number,
.portfolio-lightbox-top .eyebrow,.portfolio-project-review .review-paper-top{
 font-size:var(--portfolio-label-size);line-height:1.6;letter-spacing:.08em;
}
.portfolio-project-foot,.portfolio-project-details .portfolio-project-chips li,
.portfolio-project-review .review-author div>span{font-size:13px;line-height:1.6}
.portfolio-project-visit,.portfolio-filter-bar>button,
.portfolio-hero-bottom>a,.portfolio-collection-end>a,.portfolio-lightbox-bottom{font-size:14px;line-height:1.5}
.portfolio-filter-bar>button>span,.portfolio-hero-bottom,.portfolio-index{font-size:12px}
.portfolio-design-item h3{font-size:18px;line-height:1.5}
.portfolio-project-details .portfolio-project-story h4{font-size:19px;line-height:1.4}
.portfolio-project-review .review-paper-top{flex-wrap:wrap}
.portfolio-project-review .review-paper-top>.review-stars{font-size:20px}
.portfolio-contact .contact-link{font-size:20px}
@media(max-width:800px){
 .portfolio-page{--portfolio-reading-size:16px;--portfolio-label-size:11px}
 .portfolio-work-heading>p{width:auto}
 .portfolio-design-item h3{font-size:16px;line-height:1.45;overflow-wrap:anywhere}
 .portfolio-project-details .portfolio-project-story h4{font-size:17px}
 .portfolio-project-foot,.portfolio-project-details .portfolio-project-chips li{font-size:12px}
 .portfolio-project-review .review-paper-top>.review-stars{font-size:17px}
 .portfolio-contact .contact-link{font-size:17px}
 .portfolio-design-item figcaption{align-items:flex-start}
 .portfolio-design-item figcaption>div{min-width:0}
 .portfolio-lightbox-top h2{font-size:22px;line-height:1.3}
}