/* Photographic, full-width direction for the design studio homepage. */
.design-home{--ink:#171717;--paper:#fff;--orange:#4d4846;background:#fff}
.design-home .container{width:calc(100% - 112px);max-width:1680px}
.design-home h1,.design-home h2,.design-home h3{font-weight:400;letter-spacing:-.065em}
.design-home .site-header{position:absolute;inset:0 0 auto;background:transparent;border:0;color:white;z-index:20}
.design-home .nav-wrap{height:108px;max-width:none;gap:35px}
.design-home .brand{font-size:32px;letter-spacing:-1.8px}.design-home .brand-mark{width:39px;margin-right:13px}
.design-home #main-nav{gap:40px;background:transparent}
.design-home #main-nav>a{font-size:12px;text-transform:uppercase;font-weight:600;letter-spacing:.025em}
.design-home #main-nav>a:hover{color:#ddd}
.design-home #main-nav .nav-cta{background:#fff;color:#171717;padding:23px 32px;border-radius:3px;margin-left:25px;gap:20px}
.design-home #main-nav .nav-cta:hover{background:#e8e6e2;color:#171717}
/* The artwork's front face spans x39.2–59% and y19.2–43.4%.
   Frame the image and copy together, independently of the carousel below. */
.cinema-hero{--face-width:clamp(300px,32vw,720px);--art-width:calc(var(--face-width)*5.050505);--art-height:calc(var(--art-width)*.5625);--face-height:calc(var(--art-height)*.242);--face-top:calc(var(--art-height)*.192);position:relative;overflow:hidden;isolation:isolate;background:#050a23;color:white;padding-top:var(--face-top)}
.cinema-backdrop{position:absolute;top:0;left:calc(50% - var(--art-width)*.491);width:var(--art-width);height:var(--art-height);max-width:none;object-fit:contain;z-index:-3}
.cinema-shade{position:absolute;inset:0;background:linear-gradient(180deg,#050b238c 0px,#050b231f 150px,transparent 250px,transparent 70%,#050b23aa 100%);z-index:-2}
.cinema-message{display:flex;flex-direction:column;align-items:center;justify-content:center;width:var(--face-width);height:var(--face-height);margin-inline:auto;text-align:center;padding:clamp(12px,1.5vw,24px) clamp(16px,2vw,32px);position:relative;z-index:2;container-type:inline-size;color:#10152c}
.cinema-message h1{font-size:clamp(24px,10.6cqi,64px);line-height:1.08;margin:0 0 clamp(16px,5cqi,24px);font-weight:400;letter-spacing:-.055em;color:inherit}
.cinema-button{background:white;color:#111;border-radius:3px;padding:22px 37px;font-size:12px;font-weight:650;letter-spacing:.015em;min-width:168px;line-height:1.4;border:0}
.cinema-button:hover{background:#e4e1dc;color:#111;transform:translateY(-2px)}
.cinema-message .cinema-button{background:#10152c;color:#fff;font-size:clamp(11px,3cqi,13px);padding:clamp(12px,3.6cqi,20px) clamp(18px,6cqi,32px);min-width:0;min-height:44px;flex-shrink:0}
.cinema-message .cinema-button:hover{background:#293354;color:#fff}
.cinema-message p{font-size:clamp(12px,3.8cqi,17px);line-height:1.5;color:#252940;margin:clamp(12px,3cqi,20px) 0 0;font-weight:400;max-width:32ch}
/* Raised lettering follows the artwork's light from the upper left. */
.cinema-message h1{text-shadow:.025em .04em .025em #592d2824,.1em .14em .09em #592d2838}
.cinema-message p{text-shadow:.04em .07em .08em #592d2824}
.cinema-message .cinema-button{box-shadow:1px 2px 2px #592d2830,clamp(3px,.7cqi,5px) clamp(5px,1.2cqi,8px) clamp(7px,1.8cqi,12px) #592d2840}
.cinema-message .cinema-button:hover{box-shadow:1px 3px 3px #592d2830,clamp(4px,.9cqi,6px) clamp(7px,1.6cqi,11px) clamp(9px,2.2cqi,15px) #592d2840}
.design-home #main-nav>a[aria-current=page]:after{background:#fff}
.cinema-showcase{position:relative;display:grid;grid-template-columns:34vw 46vw 34vw;gap:3.1vw;align-items:start;left:50%;transform:translateX(-50%);width:max-content;margin-top:82px;padding-bottom:55px}
.showcase-card{display:block;box-shadow:0 30px 60px #0003;border-radius:8px;overflow:hidden;transition:transform .35s;outline-offset:7px}
.showcase-left{transform:translateY(60px) rotate(-4deg)}.showcase-right{transform:translateY(60px) rotate(4deg)}
.showcase-centre:hover{transform:translateY(-10px)}.showcase-left:hover{transform:translateY(50px) rotate(-3deg)}.showcase-right:hover{transform:translateY(50px) rotate(3deg)}
.concept-site{color:#181616;background:#e2d6cf;overflow:hidden;container-type:inline-size}
.concept-site-nav{display:flex;align-items:center;justify-content:space-between;gap:15px;padding:24px 27px;font-size:7px;font-weight:650;line-height:1.3}
.concept-site-nav b{font-weight:700;letter-spacing:-.03em;font-size:9px}
.concept-site-foot{display:flex;justify-content:space-between;gap:12px;padding:20px 27px;font-size:6px;letter-spacing:.025em;font-weight:500}
.barber-composition{position:relative;min-height:380px;min-height:56cqw;padding:0 27px}
.barber-detail{width:26%;height:240px;height:32cqw;object-fit:cover;object-position:50% 40%}
.barber-portrait{position:absolute;right:27px;bottom:0;width:32%;height:270px;height:38cqw;object-fit:cover;object-position:45% 40%}
.barber-title{position:absolute;left:20%;top:42%;z-index:1;text-align:center;max-width:73%}
.barber-title>span{font-size:clamp(25px,3.4vw,62px);font-size:7.3cqw;line-height:.94;letter-spacing:-.065em;font-weight:700;display:block}
.barber-title p{font-family:Georgia,serif;font-size:3.4cqw;font-style:italic;line-height:1.2;margin:9px 0}
.concept-interior{background:#d4c6b5;color:#28221c}
.concept-interior .concept-site-nav b{font-family:Georgia,serif;font-weight:400;font-size:13px;letter-spacing:-.04em}
.interior-composition{position:relative;min-height:450px;min-height:76cqw;padding:0 27px}
.interior-title{position:absolute;top:0;left:24px;font-family:Georgia,serif;font-size:13cqw;letter-spacing:-.06em;line-height:.91;z-index:1}
.interior-composition img{position:absolute;width:76%;height:70%;right:0;bottom:0;object-fit:cover}
.concept-coffee{background:#e4ac75;color:#272b1e}
.coffee-composition{position:relative;min-height:450px;min-height:76cqw;padding:0 27px}
.coffee-composition>span{position:relative;font-size:17cqw;letter-spacing:-.065em;line-height:.91;display:block;z-index:1}
.coffee-composition em{font-family:Georgia,serif;font-weight:400}
.coffee-composition img{position:absolute;width:62%;height:72%;right:0;bottom:0;object-fit:cover;object-position:60% 50%}
.cinema-bottom{position:relative;display:flex;align-items:center;justify-content:space-between;padding:0 56px 26px;font-size:9px;letter-spacing:.065em;color:#f6f2ed}
.collection-section{padding:100px 0 80px;background:#f0efeb}
.collection-heading{display:grid;grid-template-columns:1.3fr 1fr;gap:10%;align-items:end;margin-bottom:55px}
.collection-heading h2{font-size:clamp(43px,4.5vw,76px);line-height:1.04;margin:0}
.collection-heading>div{max-width:390px;justify-self:end}
.collection-heading p{font-size:17px;line-height:1.55;margin:0 0 22px}
.design-home .text-link{font-size:14px;font-weight:500}
.collection-grid{display:grid;grid-template-columns:1fr 1fr;gap:38px 32px}
.collection-wide{grid-column:1/-1}
.collection-scene{padding:45px;display:flex;align-items:center;justify-content:center;overflow:hidden;min-height:400px}
.collection-scene .concept-site{width:100%;box-shadow:0 16px 40px #1c161f20;transition:transform .4s}
.collection-scene:hover .concept-site{transform:scale(1.025)}
.scene-barber{background:#ac9283 url('../images/design/barber-detail.jpg') center 40%/cover;min-height:580px;position:relative;isolation:isolate;padding:65px 16%}
.scene-barber:before{content:'';position:absolute;inset:0;background:#482d2080;z-index:-1}
.scene-barber .concept-site{max-width:900px}
.scene-interior{background:#c2c4b2}.scene-coffee{background:#b9774c}
.collection-caption{display:flex;justify-content:space-between;align-items:center;padding:20px 0 0}
.collection-caption h3{font-size:23px!important;letter-spacing:-.035em!important;margin:0 0 5px}
.collection-caption span{font-size:9px;letter-spacing:.06em;color:#555}
.collection-caption>a{font-size:30px;padding:0 5px 10px 15px}
.collection-note{font-size:11px;color:#5d5a55;margin:40px 0 0}
.creative-section{background:#20221f;color:#fff;padding:105px 0 30px;overflow:hidden}
.creative-grid{display:grid;grid-template-columns:.8fr 1.2fr;gap:7%;align-items:center}
.creative-copy .eyebrow{color:#b6beb1;font-size:9px}
.creative-copy h2{font-size:clamp(56px,5.7vw,94px);line-height:.99;margin:25px 0}
.creative-copy p{font-size:16px;line-height:1.6;color:#d1d4cc;max-width:345px;margin-bottom:30px}
.creative-note{display:block;font-size:12px;margin:18px 0 0;color:#bcc4b7}
.creative-art{position:relative;min-width:0;padding:35px 28px 155px;isolation:isolate}
.creative-window{transform:rotate(-3deg);width:100%;max-width:640px;margin:auto;box-shadow:0 25px 70px #0003}
.creative-window-bar{background:#ebe5dc;color:#46483f;display:flex;justify-content:space-between;font-size:7px;padding:13px 15px}
.creative-window .concept-site{background:#d2d7bd}.creative-window .interior-composition{display:flex;flex-direction:column;gap:20px;min-height:0;padding:0 24px}.creative-window .interior-title{position:static;display:block;font-size:10cqw;line-height:.95}.creative-window .interior-composition img{position:static;width:100%;height:auto;aspect-ratio:1.8;object-fit:cover;display:block}
.creative-palette{position:absolute;right:0;bottom:100px;width:220px;background:#f0e8db;color:#272d23;padding:20px;transform:rotate(5deg);box-shadow:0 10px 35px #0002}
.creative-palette>span,.creative-type>span{font-size:8px;letter-spacing:.07em}.creative-palette>div{display:flex;gap:9px;margin:17px 0}
.creative-palette i{width:34px;height:34px;border-radius:50%;background:#393e2d}.creative-palette i:nth-child(2){background:#858e67}.creative-palette i:nth-child(3){background:#d0a88a}.creative-palette i:nth-child(4){background:#c6b5c9}
.creative-palette small,.creative-type small{font-size:9px;display:block}
.creative-type{position:absolute;bottom:0;left:0;width:245px;background:#c4c9b2;padding:20px 24px;color:#282b21;transform:rotate(3deg);box-shadow:0 10px 35px #0002}
.creative-type strong{font-family:Georgia,serif;display:flex;gap:30px;font-size:56px;line-height:1.3;font-weight:400;letter-spacing:-.07em}.creative-type strong span{font-family:'DM Sans',sans-serif}
.creative-facts{display:flex;justify-content:space-between;gap:25px;margin-top:70px;border-top:1px solid #fff3;padding-top:25px;font-size:9px;letter-spacing:.04em;color:#d9ded3}
.partnership-section{padding:115px 0;background:#fff}.partnership-section>.container{display:grid;grid-template-columns:1fr 1fr;gap:45px 12%}
.partnership-heading .eyebrow{font-size:9px}.partnership-heading h2{font-size:clamp(42px,4.4vw,73px);margin:25px 0}.partnership-heading p{font-size:16px;line-height:1.7;max-width:430px;color:#565656}
.partnership-steps article{display:flex;gap:30px;padding:30px 0;border-top:1px solid #c7c7c1}.partnership-steps article>span{font-size:12px}.partnership-steps h3{font-size:26px;letter-spacing:-.045em!important;margin:0 0 15px}.partnership-steps p{font-size:14px;color:#555;margin:0}.partnership-section .text-link{justify-self:start;align-self:start}
.cinema-faq{background:#f0efeb;padding:90px 0}.cinema-faq>.container{display:grid;grid-template-columns:1fr 1.2fr;gap:10%}.cinema-faq h2{font-size:clamp(36px,3.4vw,54px);margin:0}.cinema-faq .faqs summary{font-size:17px;padding-block:23px}.cinema-faq .faqs p{font-size:14px}.cinema-faq .faqs details{border-color:#c9c6bf}
.cinema-final{position:relative;isolation:isolate;min-height:650px;display:grid;place-items:center;text-align:center;color:white;padding:80px 24px;background:#463e32;overflow:hidden}.cinema-final>img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:50% 58%;z-index:-2}.cinema-final:after{content:'';position:absolute;inset:0;background:#1d1c1a80;z-index:-1}.cinema-final h2{font-size:clamp(50px,5.2vw,85px);line-height:1.05;margin:0 0 35px}.final-secondary{display:block;font-size:13px;margin-top:25px;text-decoration:underline;text-underline-offset:5px}
.design-home .site-footer{background:#101210;color:white;padding-top:65px}.design-home .site-footer .brand-dot,.design-home .footer-wordmark,.design-home .footer-wordmark span{color:white}.design-home .footer-main p,.design-home .footer-bottom{color:#b0b4ab}.design-home .footer-wordmark{border-color:#ffffff30;font-weight:500}.design-home .footer-email{border-color:#ffffff30}.design-home .footer-wordmark{margin-top:40px}.design-home .footer-main .eyebrow{color:#b0b4ab}
@media(min-width:1800px){.cinema-showcase{margin-top:110px}.cinema-button{font-size:15px;padding:26px 43px;min-width:208px}.design-home .nav-wrap{height:115px}.design-home #main-nav>a{font-size:15px}.concept-site-nav{font-size:9px}.concept-site-nav b{font-size:12px}.cinema-bottom{font-size:11px}}
@media(max-width:1100px){.design-home .container{width:calc(100% - 64px)}.design-home #main-nav{gap:24px}.design-home #main-nav .nav-cta{margin-left:0;padding:20px 23px}.cinema-showcase{grid-template-columns:40vw 58vw 40vw;gap:4vw;margin-top:75px}.cinema-bottom{padding-inline:32px;font-size:8px}.scene-barber{padding:45px 10%;min-height:480px}.collection-scene{padding:32px}.creative-grid{gap:35px;grid-template-columns:1fr}.creative-art{padding:30px 20px 155px;width:95%;max-width:620px;justify-self:center}.creative-palette{bottom:110px;padding:15px;right:0;width:185px}.creative-palette i{width:27px;height:27px}.creative-type{bottom:0;left:0;width:210px}.creative-type strong{font-size:53px}.creative-copy h2{font-size:66px}.partnership-section>.container{gap:30px 7%}.cinema-faq>.container{gap:6%}}
@media(max-width:800px){.design-home .container{width:calc(100% - 40px)}.design-home .nav-wrap{height:82px}.design-home .brand{font-size:28px}.design-home .brand-mark{width:32px;margin-right:9px}.design-home .menu-toggle{color:white;border-color:#ffffff80;border-radius:3px;background:#0002;font-size:12px}.design-home #main-nav{background:#20201f;color:#fff;top:82px;padding:20px;gap:14px}.design-home #main-nav .nav-cta{align-self:start;margin:8px 0 0}.cinema-hero{--face-width:min(420px,calc(100vw - 40px))}.cinema-button{padding:20px 28px;font-size:12px}.cinema-showcase{grid-template-columns:54vw 76vw 54vw;gap:5vw;margin-top:75px;padding-bottom:45px}.showcase-left,.showcase-right{transform:translateY(45px) rotate(-5deg)}.showcase-right{transform:translateY(45px) rotate(5deg)}.concept-site-nav{padding:17px 18px;gap:8px;font-size:5px}.concept-site-nav b{font-size:7px}.barber-composition{padding:0 18px}.barber-portrait{right:18px}.concept-site-foot{font-size:5px;padding:16px 18px}.cinema-bottom{padding:0 20px 25px;gap:30px;font-size:7px}.cinema-bottom>span{max-width:150px}.collection-section{padding:65px 0 55px}.collection-heading{grid-template-columns:1fr;gap:25px;margin-bottom:35px}.collection-heading h2{font-size:45px}.collection-heading>div{justify-self:start;max-width:460px}.collection-heading p{font-size:15px}.collection-grid{gap:30px 20px}.collection-scene{padding:22px;min-height:0}.scene-barber{padding:30px 10%}.collection-caption{align-items:start}.collection-caption h3{font-size:19px!important}.collection-caption span{font-size:7px;display:block;max-width:200px}.collection-caption>a{font-size:22px;padding-left:10px}.collection-note{font-size:10px;margin-top:28px}.creative-section{padding:65px 0 25px}.creative-grid{grid-template-columns:1fr;gap:35px}.creative-copy h2{font-size:62px}.creative-copy p{max-width:400px;font-size:15px}.creative-art{width:95%;max-width:560px;justify-self:center;padding:35px 20px 170px}.creative-palette{bottom:120px;width:200px}.creative-type{bottom:0;width:230px}.creative-facts{margin-top:35px;flex-direction:column;gap:17px;font-size:8px}.partnership-section{padding:65px 0}.partnership-section>.container{grid-template-columns:1fr;gap:30px}.partnership-heading h2{font-size:45px}.partnership-heading p{font-size:15px;max-width:550px}.partnership-steps h3{font-size:24px}.cinema-faq{padding:65px 0}.cinema-faq>.container{grid-template-columns:1fr;gap:35px}.cinema-faq h2{font-size:40px}.cinema-faq .faqs summary{font-size:16px}.cinema-final{min-height:530px}.cinema-final h2{font-size:51px}.design-home .site-footer{padding-top:45px}.design-home .footer-wordmark{margin-top:30px}html:not(.js) .design-home .site-header{position:relative;background:#20201f}html:not(.js) .design-home #main-nav{background:transparent}html:not(.js) .design-home .nav-wrap{height:auto}}
@media(max-width:480px){.cinema-showcase{margin-top:76px;grid-template-columns:60vw 84vw 60vw;gap:6vw;padding-bottom:40px}.showcase-card{border-radius:4px}.showcase-left,.showcase-right{opacity:.85}.barber-title>span{font-size:7.8cqw}.barber-title{left:13%;top:42%}.barber-title p{font-size:4cqw}.concept-site-nav{padding:14px 14px;font-size:4px}.concept-site-nav b{font-size:6px}.barber-composition{padding:0 14px}.barber-portrait{right:14px}.concept-site-foot{padding:14px;font-size:4px}.cinema-bottom{font-size:6px;gap:15px}.cinema-bottom>span{max-width:120px}.collection-heading h2{font-size:39px}.collection-grid{grid-template-columns:1fr;gap:30px}.collection-wide{grid-column:auto}.collection-scene{padding:28px}.scene-barber{padding:28px 20px}.collection-caption h3{font-size:22px!important}.collection-caption span{font-size:8px}.collection-scene .concept-site-nav{font-size:4px}.collection-scene .concept-site-nav b{font-size:6px}.creative-copy h2{font-size:58px}.creative-copy .eyebrow{font-size:8px}.partnership-heading h2{font-size:39px}.partnership-steps article{gap:20px}.partnership-steps h3{font-size:23px}.cinema-faq h2{font-size:36px}.cinema-final{min-height:500px}.cinema-final h2{font-size:43px}}
@media(prefers-reduced-motion:reduce){.showcase-card,.collection-scene .concept-site{transition:none}}
/* Keep concept lettering in clear space between the two photographs. */
.barber-detail{height:28cqw}.barber-portrait{width:29%}.barber-title{left:5%;top:55%;max-width:64%;width:64%}.barber-title>span{font-size:6.3cqw}.barber-title p{font-size:3.1cqw}
/* Real project previews: every card is reachable by scrolling, touch or keyboard. */
.project-showcase{--project-width:min(72vw,1000px);position:relative;margin-top:82px}
.project-track{display:flex;gap:36px;overflow-x:auto;overscroll-behavior-x:contain;scroll-snap-type:x mandatory;scroll-padding-inline:calc((100% - var(--project-width))/2);padding:12px calc((100% - var(--project-width))/2) 22px;scrollbar-width:thin;scrollbar-color:#ddd8cf #ffffff20;position:relative}
.project-slide{display:block;flex:0 0 var(--project-width);min-width:0;scroll-snap-align:center;color:#171717;background:#f4f1ed;border-radius:7px;overflow:hidden;box-shadow:0 20px 50px #0003;text-decoration:none;outline-offset:5px}
.project-browser{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:13px 18px;background:#f4f1ed;color:#4a4742;font-size:11px;line-height:1.3}.project-dots{font-size:8px;letter-spacing:3px;color:#8d8880}
.project-slide img,.portfolio-preview img{display:block;width:100%;height:auto;aspect-ratio:1.85;object-fit:contain;background:#f8f8f8}
.project-slide:nth-child(2) img,.portfolio-ross img{background:#0c0c0c}
.project-label{display:flex;align-items:center;justify-content:space-between;gap:15px;padding:18px 22px}.project-label strong{font-size:17px;font-weight:500}.project-label>span{font-size:10px;letter-spacing:.06em}
.project-slide:hover .project-label>span{text-decoration:underline;text-underline-offset:4px}
.project-controls{display:flex;align-items:center;justify-content:space-between;gap:20px;width:var(--project-width);margin:22px auto 35px;font-size:10px;letter-spacing:.06em}.project-hint>span{font-size:18px;margin-left:8px}.project-controls>a{border-bottom:1px solid #ffffff60;padding-bottom:3px}
.project-navigation{display:none;align-items:center;gap:18px}.js .project-navigation{display:flex}.project-navigation button{width:44px;height:44px;border:1px solid #ffffff80;border-radius:50%;background:#14141440;color:#fff;font-size:22px;line-height:1}.project-navigation button:hover:not(:disabled){background:#fff;color:#171717}.project-navigation button:disabled{opacity:.3;cursor:default}.project-navigation>span{min-width:42px;text-align:center;font-variant-numeric:tabular-nums}
.project-track:focus-visible,.project-slide:focus-visible,.project-navigation button:focus-visible{outline:3px solid #fff;outline-offset:3px}
.portfolio-section{position:relative}.anchor-alias{position:absolute;top:0}.portfolio-section .eyebrow{display:block;margin-bottom:20px}.portfolio-grid{display:grid;grid-template-columns:1fr 1fr;gap:48px 32px}.portfolio-project:first-child{grid-column:1/-1;max-width:1120px;width:100%;justify-self:center}.portfolio-preview{display:block;padding:30px;background:#dad6ce;transition:background .2s}.portfolio-impact .portfolio-preview{background:#c3cbd0}.portfolio-ross .portfolio-preview{background:#a38169}.portfolio-julie .portfolio-preview{background:#d8d6dc}.portfolio-preview .project-browser{font-size:10px}.portfolio-preview:hover{background:#b9b4a9}.portfolio-caption{display:flex;align-items:center;justify-content:space-between;gap:20px;padding:20px 0 0}.portfolio-caption h3{font-size:24px;margin:0 0 5px!important;letter-spacing:-.04em}.portfolio-caption p{font-size:12px;margin:0;color:#555}.portfolio-visit{font-size:12px;border-bottom:1px solid #777;padding-bottom:4px;white-space:nowrap}.sr-only{position:absolute!important;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap;border:0}
@media(max-width:800px){.project-showcase{--project-width:84vw;margin-top:65px}.project-track{gap:20px}.project-browser{font-size:9px;padding:10px 13px}.project-label{padding:14px}.project-label strong{font-size:14px}.project-label>span{font-size:8px}.project-controls{font-size:8px;flex-wrap:wrap;gap:16px;margin-bottom:28px}.project-hint{display:none}.project-navigation{gap:12px}.project-navigation button{width:42px;height:42px}.portfolio-preview{padding:18px}.portfolio-caption{align-items:start;gap:12px}.portfolio-caption h3{font-size:21px}.portfolio-visit{font-size:10px}.portfolio-grid{gap:35px 20px}}
@media(max-width:540px){.portfolio-grid{grid-template-columns:1fr}.portfolio-project:first-child{grid-column:auto}.project-showcase{--project-width:88vw}.project-label strong{font-size:12px}.project-label>span{font-size:7px}.project-browser{font-size:8px}.project-dots{font-size:6px;letter-spacing:2px}.portfolio-preview{padding:16px}.portfolio-caption h3{font-size:22px}.portfolio-visit{font-size:11px}}
@media(prefers-reduced-motion:reduce){.portfolio-preview{transition:none}}
.portfolio-section .collection-heading>div:first-child{max-width:none;justify-self:stretch}
/* Floating project composition: genuine screenshots, without browser chrome. */
.project-showcase{--project-width:min(46vw,940px);margin-top:82px}
.project-track{gap:3.1vw;padding-top:20px;padding-bottom:85px;scrollbar-width:none}
.project-track::-webkit-scrollbar{display:none}
.project-slide{background:none;box-shadow:none;overflow:visible;border-radius:0;position:relative}
.project-surface{border-radius:8px;overflow:hidden;box-shadow:0 24px 65px #0005;transform:translateY(var(--card-drop,0px)) rotate(var(--card-angle,0deg)) scale(var(--card-scale,1));transform-origin:50% 50%;will-change:transform;background:#eee}
.project-slide img{width:100%;height:auto;aspect-ratio:auto;object-fit:contain;background:none}
.project-label{position:relative;color:#fff;padding:19px 3px 0;opacity:.65;transform:translateY(var(--card-drop,0px));gap:15px}
.project-label strong{font-size:12px;font-weight:450;letter-spacing:.02em}.project-label>span{font-size:9px;letter-spacing:.05em}
.project-slide.is-current .project-label{opacity:1}.project-slide:hover .project-surface{box-shadow:0 30px 75px #0007}
.project-controls{width:var(--project-width);margin:0 auto 35px}.project-hint{font-size:8px}.project-controls>a{font-size:8px}.project-navigation{gap:13px}.project-navigation button{background:#ffffff0a;border-color:#ffffff50;width:38px;height:38px;font-size:19px}.project-navigation>span{font-size:9px;min-width:34px}
.portfolio-preview{padding:24px;border-radius:6px}.portfolio-preview .project-browser{display:none}.portfolio-preview img{border-radius:3px;box-shadow:0 12px 30px #0002}
@media(min-width:1800px){.project-showcase{margin-top:110px}}
@media(max-width:1100px){.project-showcase{--project-width:58vw}.project-controls{width:70vw}}
@media(max-width:800px){.project-showcase{--project-width:76vw;margin-top:75px}.project-track{gap:5vw;padding-bottom:78px}.project-controls{width:76vw}.project-label strong{font-size:11px}.project-label>span{font-size:8px}.project-navigation button{width:42px;height:42px}}
@media(max-width:480px){.project-showcase{--project-width:84vw}.project-track{gap:6vw}.project-controls{width:84vw}.project-label{padding-top:15px}.project-label strong{font-size:10px}.project-label>span{font-size:7px}.project-surface{border-radius:5px}.portfolio-preview{padding:16px}}
@media(prefers-reduced-motion:reduce){.project-surface{will-change:auto}}

/* Short routes to the full portfolio and service pages. */
.home-directory{background:#f0efeb;padding:70px 0}
.home-directory-grid{display:grid;grid-template-columns:1fr 1fr;gap:70px}
.home-directory article{position:relative;min-width:0}
.home-directory article+article{border-left:1px solid #cbc9c1;padding-left:70px}
.home-directory .eyebrow{color:#64655c;margin-bottom:20px}
.home-directory h2{font-size:clamp(32px,3.2vw,49px);line-height:1.1}
.home-directory p{font-size:15px;line-height:1.65;max-width:480px;margin:20px 0 24px;color:#565b52}
.home-directory .text-link{font-size:13px}
@media(max-width:1100px){.home-directory-grid{gap:40px}.home-directory article+article{padding-left:40px}}
@media(max-width:800px){.home-directory{padding:50px 0}.home-directory-grid{grid-template-columns:1fr;gap:35px}.home-directory article+article{padding:35px 0 0;border-left:0;border-top:1px solid #cbc9c1}.home-directory h2{font-size:36px}}

/* Below tablet widths, decorative samples have their own row. */
@media(max-width:640px){.creative-art{width:100%;padding:25px 12px 0;display:grid;grid-template-columns:1fr 1fr;gap:30px 12px}.creative-palette{position:relative;inset:auto;width:auto;padding:14px 12px;grid-column:2;grid-row:2;transform:rotate(3deg)}.creative-palette>div{gap:5px;margin:15px 0}.creative-palette i{width:clamp(18px,4.5vw,27px);height:clamp(18px,4.5vw,27px);flex:0 0 clamp(18px,4.5vw,27px)}.creative-type{position:relative;inset:auto;width:auto;padding:14px 12px;grid-column:1;grid-row:2;transform:rotate(-3deg)}.creative-type strong{font-size:clamp(27px,8.3vw,48px);gap:14px;margin:8px 0}.creative-type small,.creative-palette small{font-size:8px}.creative-palette>span,.creative-type>span{font-size:7px}.creative-window{grid-column:1/-1;width:94%;margin:auto}.creative-window .interior-composition{padding-inline:16px;gap:15px}}