*{box-sizing:border-box}html{scroll-behavior:auto;scroll-padding-top:100px}body{margin:0;background:#faf9f6;color:#20201e;font-family:Arial,Helvetica,sans-serif;font-size:16px;line-height:1.6}a{color:inherit;text-decoration:none}a:hover{text-decoration:underline;text-underline-offset:5px}button{font:inherit;cursor:pointer}a:focus-visible,button:focus-visible{outline:3px solid #86764d;outline-offset:6px}img{display:block;max-width:100%;object-fit:cover}figure{margin:0}h1,h2,h3,p{margin-top:0}h1,h2,h3{font-weight:400;line-height:1.08;letter-spacing:-.045em}h1{font-size:clamp(52px,6.6vw,104px)}h2{font-size:clamp(34px,4vw,62px)}h3{font-size:32px}p{max-width:60ch}em{font-weight:400}.review{position:sticky;top:0;z-index:10;display:flex;justify-content:space-between;align-items:center;gap:24px;padding:13px 24px;background:#20201e;color:#fff;font-size:11px;letter-spacing:.03em}.review nav{display:flex;gap:22px}.review nav a{padding:5px 0;color:#ccc}.review nav [aria-current]{color:#fff;border-bottom:1px solid #fff}.review>span{color:#aaa}.skip{position:fixed;top:-100px;z-index:30;background:white;padding:12px}.skip:focus{top:0}.site{max-width:1600px;margin:auto;padding:0 5.5%}header{display:flex;justify-content:space-between;align-items:center;padding:30px 0;border-bottom:1px solid #c8c8c1}.wordmark{font-size:21px;font-weight:600;letter-spacing:-.06em}.wordmark-dot{display:none}header nav{display:flex;gap:30px;font-size:13px}.eyebrow{font-size:11px;letter-spacing:.12em;text-transform:uppercase;line-height:1.5;margin-bottom:30px}.hero{display:grid;grid-template-columns:1.3fr 1fr;gap:5%;padding:72px 0 35px}.hero-text{padding-top:20px}.hero h1{font-family:Georgia,serif;margin-bottom:30px}.intro{max-width:440px;font-size:18px}.contact-link{display:inline-flex;align-items:center;gap:35px;border:0;border-bottom:1px solid currentColor;padding:12px 0;background:transparent;color:inherit;font-size:14px}.hero-photo img{width:100%;height:600px;object-position:50% 44%}.hero-photo figcaption{font-size:10px;margin-top:12px;letter-spacing:.04em}.hero-foot{grid-column:1/-1;display:flex;justify-content:space-between;font-size:11px;margin-top:24px}.section-heading{display:grid;grid-template-columns:1fr 2fr 1.2fr;gap:35px;align-items:start;margin-bottom:55px}.section-heading h2{font-size:42px}.section-heading p:not(.eyebrow){font-size:14px}.work,.approach,.articles,.about{border-top:1px solid #c8c8c1;margin-top:85px;padding-top:55px}.project{display:grid;grid-template-columns:1.3fr 1fr;gap:7%;margin:0 0 100px}.project-visual{min-height:460px;position:relative;overflow:hidden}.drafted-visual{display:flex;flex-direction:column;align-items:center;justify-content:center;background:#eef1f3;color:#0c1724;gap:25px}.drafted-visual img{width:95px;height:95px;object-fit:contain}.drafted-visual>span{font-size:70px;font-weight:700;letter-spacing:-.07em}.drafted-visual small{font-size:10px;letter-spacing:.04em}.plumora-visual{background:#f7e1c3;display:flex;align-items:center}.plumora-visual>img:first-child{width:100%;height:100%;object-fit:cover}.plumora-visual .phone{position:absolute;right:6%;bottom:5%;width:25%;max-height:70%;object-fit:contain;box-shadow:0 8px 30px #33251e44}.project-copy{padding:18px 0}.project-copy .eyebrow{margin-bottom:20px}.project h3{font-size:48px;margin-bottom:10px}.project-deck{font-family:Georgia,serif;font-size:24px;line-height:1.3}.project-copy p:not(.eyebrow):not(.project-deck){font-size:14px}dl{font-size:12px;line-height:1.6;margin:25px 0}dt{font-weight:600;margin-top:16px}dd{margin:3px 0}.draft{color:#65645e;font-size:12px;line-height:1.6}.text-link{font-size:13px;border-bottom:1px solid;padding-bottom:6px;display:inline-block}.steps{padding:0;list-style:none;display:grid;grid-template-columns:repeat(4,1fr);gap:30px}.steps li{border-top:1px solid #aaa;padding-top:20px}.steps span{font-size:11px}.steps h3{font-size:25px;letter-spacing:-.03em;margin:35px 0 18px}.steps p{font-size:14px}.case{display:grid;grid-template-columns:1fr 3.3fr;gap:35px;background:#eeede7;padding:50px;margin-top:85px}.case h2{font-family:Georgia,serif}.case>div>p{max-width:660px}.flow{border-top:1px solid #ccc;border-bottom:1px solid #ccc;padding:20px 0;font-size:13px}.articles .section-heading{grid-template-columns:1fr 2fr 1.2fr}.article-list a{display:grid;grid-template-columns:1fr 3fr 30px;gap:30px;border-top:1px solid #c8c8c1;padding:28px 0;align-items:center}.article-list span{font-size:11px}.article-list h3{font-family:Georgia,serif;font-size:27px;margin:0}.article-list b{font-weight:400}.about{display:grid;grid-template-columns:1.3fr 1fr;gap:7%;align-items:center}.about-photos{position:relative;padding-right:70px;padding-bottom:50px}.about-photos img:first-child{width:90%;height:490px}.about-photos img:last-child{position:absolute;right:0;bottom:0;width:36%;border:8px solid #faf9f6}.about h2{font-family:Georgia,serif}.about p:not(.eyebrow){font-size:15px}.contact{padding:100px 0 85px;margin-top:90px;border-top:1px solid #bbb}.contact h2{font-family:Georgia,serif;font-size:clamp(50px,7vw,100px)}.contact-status{font-size:11px;color:#777;margin-top:22px}footer{display:flex;justify-content:space-between;gap:20px;padding:25px 0;border-top:1px solid #bbb;font-size:10px}
/* 02 — an exact, typographic grid */
.grid{background:#fff;color:#151515}.grid .site{padding:0 4%}.grid .hero{grid-template-columns:3fr 1fr;gap:35px;padding-top:45px}.grid h1,.grid h2,.grid h3,.grid .project-deck{font-family:Arial,sans-serif;font-weight:600}.grid h1{font-size:clamp(60px,8vw,125px);letter-spacing:-.075em}.grid h1 em{font-style:normal;font-weight:600;color:#777}.grid .hero-photo{align-self:end}.grid .hero-photo img{height:360px}.grid .hero-foot{border-top:1px solid;padding-top:22px}.grid .wordmark-dot{display:inline}.grid .section-heading{grid-template-columns:1fr 2fr 1fr}.grid .project{grid-template-columns:1fr 1fr;gap:0;border:1px solid #ccc;margin-bottom:30px}.grid .project-copy{padding:35px}.grid .project-visual{min-height:580px}.grid .steps{gap:0;border-bottom:1px solid}.grid .steps li{padding:22px;border-right:1px solid #aaa}.grid .case{background:#f3f3f3}.grid .about-photos img:last-child{border-color:#fff}.grid .contact{display:grid;grid-template-columns:1fr 2fr;gap:20px}.grid .contact .eyebrow{grid-row:span 4}.grid .contact h2{font-family:Arial,sans-serif}.grid .contact-link{width:fit-content}
/* 03 — dark photographic composition */
.nocturne{background:#171817;color:#edeee9}.nocturne .site{padding:0 5%}.nocturne header{border-color:#454642}.nocturne .hero{grid-template-columns:1fr 1fr;gap:0;position:relative;padding-top:45px}.nocturne .hero-text{z-index:1;padding:70px 0 40px}.nocturne .hero h1{font-family:Arial,sans-serif;font-size:clamp(55px,7vw,110px);margin-right:-20%;letter-spacing:-.06em}.nocturne .hero h1 em{font-family:Georgia,serif}.nocturne .hero-photo img{height:690px;opacity:.85}.nocturne .hero-photo figcaption{color:#aaa}.nocturne .section-heading{grid-template-columns:1fr 2fr 1.2fr}.nocturne .project{grid-template-columns:1.5fr 1fr}.nocturne .project-visual{min-height:530px}.nocturne .plumora-project{grid-template-columns:1fr 1.5fr}.nocturne .plumora-project .project-visual{order:2}.nocturne .case{background:#252723}.nocturne .draft{color:#b2b2a9}.nocturne .about-photos img:last-child{border-color:#171817}.nocturne .contact-status{color:#b2b2a9}.nocturne .work,.nocturne .approach,.nocturne .articles,.nocturne .about{border-color:#454642}.nocturne .contact{padding-left:20%}
/* 04 — a small-scale journal with a persistent index */
.notebook{background:#f4f2eb}.notebook .site{max-width:1350px;padding:0 5% 0 240px}.notebook header{position:fixed;top:110px;left:max(35px,calc((100vw - 1280px)/2));width:155px;display:block;border:0}.notebook header nav{display:flex;flex-direction:column;gap:15px;margin-top:40px}.notebook .wordmark{font-family:Georgia,serif;font-weight:400;font-size:25px}.notebook .hero{grid-template-columns:1.5fr 1fr;gap:30px;padding-top:65px}.notebook .hero h1{font-size:58px}.notebook .hero-photo{padding-top:65px}.notebook .hero-photo img{height:330px}.notebook .intro{font-size:16px}.notebook .hero-foot span{display:none}.notebook .eyebrow,.notebook .hero-foot,.notebook .article-list span{font-family:Consolas,monospace;letter-spacing:0;font-size:11px}.notebook .section-heading{display:block;max-width:550px}.notebook .section-heading h2{font-family:Georgia,serif;font-size:37px}.notebook .section-heading .eyebrow{margin-bottom:20px}.notebook .project{grid-template-columns:1fr;gap:20px;margin-bottom:65px}.notebook .project-visual{min-height:300px;height:350px}.notebook .project-copy{display:grid;grid-template-columns:1fr 1.5fr;column-gap:35px}.notebook .project-copy h3,.notebook .project-copy .eyebrow,.notebook .project-copy .project-deck{grid-column:1}.notebook .project-copy>p:not(.eyebrow):not(.project-deck),.notebook .project-copy dl{grid-column:2}.notebook .project-copy dl{grid-row:2/6;margin-top:0}.notebook .project-copy>p:not(.eyebrow):not(.project-deck){grid-row:1}.notebook .steps{grid-template-columns:1fr 1fr}.notebook .case{display:block;padding:35px}.notebook .case h2{font-size:40px}.notebook .article-list a{grid-template-columns:1fr 2fr 20px}.notebook .article-list h3{font-size:24px}.notebook .about{grid-template-columns:1fr;gap:45px}.notebook .about-photos{max-width:440px}.notebook .about-photos img:first-child{height:420px}.notebook .about-photos img:last-child{border-color:#f4f2eb}.notebook .contact h2{font-size:65px}.notebook footer{flex-wrap:wrap}
/* 05 — centred introduction, exhibition-scale work */
.gallery{background:white}.gallery .site{max-width:1700px;padding:0 7%}.gallery header{border:0;padding:38px 0}.gallery .hero{display:flex;flex-direction:column;align-items:center;text-align:center;padding-top:55px;gap:35px}.gallery .hero-text{display:contents}.gallery .hero .eyebrow{order:0;margin:0}.gallery .hero h1{order:1;font-size:clamp(58px,7.5vw,115px);max-width:1000px;margin:0}.gallery .hero h1 br:first-child{display:none}.gallery .hero-photo{order:2;width:260px}.gallery .hero-photo img{height:300px;object-position:50% 40%}.gallery .hero .intro{order:3;max-width:540px;margin:0;font-size:18px}.gallery .hero .contact-link{order:4}.gallery .hero-foot{order:5;width:100%;margin-top:35px}.gallery .section-heading{display:block;text-align:center;max-width:680px;margin:0 auto 70px}.gallery .section-heading p{margin-left:auto;margin-right:auto}.gallery .section-heading h2{font-family:Georgia,serif;font-size:54px}.gallery .project{grid-template-columns:1.6fr 1fr;gap:6%;align-items:center}.gallery .project-visual{height:620px}.gallery .plumora-project{grid-template-columns:1fr 1.6fr}.gallery .plumora-project .project-visual{order:2}.gallery .project-copy{max-width:420px}.gallery .steps{text-align:center;gap:45px}.gallery .case{background:#f7f7f4}.gallery .about{gap:12%}.gallery .about-photos img:last-child{border-color:white}.gallery .contact{text-align:center}.gallery .contact p{margin-left:auto;margin-right:auto}
/* Comparison overview */
.chooser-main{max-width:1450px;margin:auto;padding:70px 5%}.chooser-main>h1{font-family:Georgia,serif;font-size:clamp(55px,7vw,100px);margin-bottom:35px}.chooser-intro{display:flex;justify-content:space-between;gap:60px;margin-bottom:60px;font-size:15px}.chooser-intro p:first-child{max-width:480px}.directions{display:grid;grid-template-columns:repeat(3,1fr);gap:55px 30px}.direction-card:hover{text-decoration:none}.mini{height:300px;padding:25px;position:relative;border:1px solid #d8d6ce;overflow:hidden;background:#f7f6f2;transition:box-shadow .15s}.direction-card:hover .mini{box-shadow:0 10px 25px #0001}.mini-name{font-family:Georgia,serif;font-size:45px;line-height:1;position:relative;z-index:1}.mini img{position:absolute;right:20px;bottom:35px;width:43%;height:185px}.mini-label{position:absolute;bottom:20px;left:25px;font-size:9px;line-height:1.4}.card-caption{display:flex;justify-content:space-between;border-bottom:1px solid #ccc;padding:15px 0;font-size:12px}.direction-card h2{font-size:23px;letter-spacing:-.03em;margin:20px 0 12px}.direction-card>p{font-size:13px;color:#666}.card-grid .mini{background:white}.card-grid .mini-name{font-family:Arial;font-weight:700;font-size:52px}.card-grid .mini img{width:30%;height:140px}.card-nocturne .mini{background:#171817;color:#fff}.card-nocturne .mini img{right:0;bottom:0;width:60%;height:100%;opacity:.7}.card-nocturne .mini-name{font-family:Arial;font-size:50px}.card-nocturne .mini-label{z-index:1}.card-notebook .mini{background:#f0eee5;padding-left:65px}.card-notebook .mini:before{content:'JW /';position:absolute;left:18px;top:30px;font-size:10px}.card-notebook .mini-name{font-size:33px}.card-notebook .mini img{width:34%;height:145px;bottom:45px;right:35px}.card-gallery .mini{text-align:center;background:white}.card-gallery .mini-name{font-size:39px}.card-gallery .mini img{width:100px;height:115px;left:calc(50% - 50px);bottom:50px}.card-gallery .mini-label{left:0;width:100%;bottom:15px}.review-note{font-size:12px;color:#777;border-top:1px solid #ccc;padding-top:25px;margin-top:60px;max-width:none}
@media(min-width:1700px){.notebook header{left:calc((100vw - 1280px)/2)}}
@media(max-width:1000px){.review{gap:15px}.review>span{display:none}.review nav{gap:15px}.site{padding:0 5%}.hero h1{font-size:62px}.hero-photo img{height:480px}.section-heading,.nocturne .section-heading,.grid .section-heading{grid-template-columns:1fr 2fr}.section-heading>p:last-child{grid-column:2}.project{gap:5%}.project-visual{min-height:400px}.steps{grid-template-columns:1fr 1fr}.notebook .site{padding-left:190px}.notebook header{left:25px;width:130px}.notebook .hero{display:block}.notebook .hero-photo{padding-top:20px;max-width:300px}.gallery .project-visual{height:500px}.directions{grid-template-columns:1fr 1fr}}
@media(max-width:680px){.review{display:block;padding:10px 14px}.review>a{display:none}.review nav{gap:15px;overflow-x:auto;white-space:nowrap;font-size:10px}.review nav a{padding:5px 0}header{padding:23px 0;gap:20px}.wordmark{font-size:18px}header nav{gap:12px;font-size:11px}header nav a:nth-child(2){display:none}.site,.grid .site,.nocturne .site,.gallery .site,.notebook .site{padding:0 6%}.hero,.grid .hero,.nocturne .hero{display:flex;flex-direction:column;padding-top:35px;gap:25px}.hero-text,.nocturne .hero-text{padding:0}.hero h1,.grid .hero h1,.nocturne .hero h1,.notebook .hero h1{font-size:clamp(45px,10vw,68px);margin-right:0}.hero-photo,.grid .hero-photo{width:100%}.hero-photo img,.grid .hero-photo img,.nocturne .hero-photo img{height:450px}.hero-foot{font-size:10px;gap:25px;align-items:end}.hero-foot span{max-width:160px}.section-heading,.grid .section-heading,.nocturne .section-heading,.articles .section-heading{display:block}.section-heading h2,.gallery .section-heading h2{font-size:36px}.section-heading>p:last-child{max-width:400px}.project,.grid .project,.nocturne .project,.nocturne .plumora-project,.gallery .project,.gallery .plumora-project{display:flex;flex-direction:column;gap:24px;margin-bottom:60px}.project-visual,.grid .project-visual,.nocturne .project-visual,.gallery .project-visual{width:100%;min-height:340px;height:360px;order:0!important}.project-copy,.grid .project-copy{padding:0}.grid .project-copy{padding:24px}.project h3{font-size:40px}.work,.approach,.articles,.about{margin-top:60px;padding-top:35px}.section-heading{margin-bottom:30px}.steps{gap:24px}.steps h3{font-size:23px;margin-top:20px}.steps p{font-size:13px}.grid .steps li{padding:14px}.case{display:block;padding:25px;margin-top:50px}.case h2,.notebook .case h2{font-size:35px}.flow{font-size:12px}.article-list a,.notebook .article-list a{grid-template-columns:1fr 20px;gap:12px}.article-list span{grid-column:1/-1}.article-list h3{font-size:25px}.about{display:block}.about-photos{margin-bottom:45px;padding-right:45px}.about-photos img:first-child{height:400px}.contact,.nocturne .contact{padding:55px 0;margin-top:60px}.contact h2,.notebook .contact h2{font-size:55px}.grid .contact{display:block}.contact-status{font-size:12px}footer{flex-wrap:wrap;font-size:10px}.notebook header{position:static;width:auto;display:flex;padding:23px 0}.notebook header nav{flex-direction:row;margin:0}.notebook .hero-photo{max-width:none}.notebook .project-copy{display:block}.notebook .project-copy dl{margin:25px 0}.gallery .hero{gap:25px}.gallery .hero h1{font-size:54px}.gallery .hero-photo{width:230px}.gallery .hero-photo img{height:280px}.gallery .hero-foot{margin-top:15px}.gallery .section-heading{text-align:left}.gallery .steps{text-align:left;gap:25px}.chooser-main{padding:45px 6%}.chooser-intro{display:block}.chooser-intro p:last-child{font-size:12px}.directions{grid-template-columns:1fr}.mini{height:330px}.mini img{height:220px}.chooser-main>h1{font-size:57px}}
@media(prefers-reduced-motion:reduce){*{transition:none!important;scroll-behavior:auto!important}}

/* Grid refinement: consistent reading columns and contextual metadata. */
.grid .site{max-width:1440px;padding:0 5%}
.grid header{padding:28px 0}
.grid .hero{grid-template-columns:minmax(0,3fr) minmax(0,1fr);gap:48px;padding:64px 0 0}
.grid .hero-text{padding-top:0}
.grid .hero h1{font-size:clamp(62px,7.4vw,112px);line-height:1.02;letter-spacing:-.07em;margin-bottom:32px}
.grid .hero h1 em{color:#737373}
.grid .hero .eyebrow{margin-bottom:28px;letter-spacing:.08em}
.grid .hero .intro{font-size:17px;max-width:48ch;line-height:1.65;margin-bottom:18px}
.grid .hero-photo{align-self:end;margin-bottom:4px}
.grid .hero-photo img{height:auto;aspect-ratio:3/4;object-position:center}
.grid .work,.grid .approach,.grid .articles,.grid .about{margin-top:104px;padding-top:38px}
.grid .section-heading{display:grid;grid-template-columns:1fr 3fr;gap:30px;margin-bottom:42px}
.grid .section-heading .eyebrow{margin:8px 0 0;color:#555;letter-spacing:.06em}
.grid .section-heading h2{font-size:clamp(32px,3.4vw,48px);margin:0;line-height:1.12;letter-spacing:-.045em}
.grid .articles .section-heading .text-link{grid-column:2;justify-self:start;margin-top:-10px}
.grid .project{border:0;border-top:1px solid #d7d7d7;gap:0;margin:0 0 44px;grid-template-columns:1fr 1fr}
.grid .project-visual{min-height:480px}
.grid .project-copy{padding:36px 0 28px 48px}
.grid .project-copy .eyebrow{margin-bottom:12px;letter-spacing:.06em;color:#626262}
.grid .project h3{font-size:44px;line-height:1.1;margin-bottom:16px}
.grid .project-deck{font-size:21px;font-weight:400;letter-spacing:-.025em;line-height:1.35;margin-bottom:20px}
.grid .project-copy p:not(.eyebrow):not(.project-deck){font-size:15px;line-height:1.7}
.grid .project-copy dl{font-size:14px;line-height:1.65;margin:24px 0}
.grid .project-copy dt{font-size:12px;color:#555;margin-bottom:6px}
.grid .project-review{border-top:1px solid #ddd;margin-top:28px;padding-top:15px;color:#606060;font-size:12px}
.grid .project-review summary{cursor:pointer;width:fit-content}
.grid .project-review summary:focus-visible{outline:2px solid;outline-offset:5px}
.grid .project-review dl{margin-bottom:0}
.grid .steps{border-bottom:0}
.grid .steps li{padding:24px;border-color:#d7d7d7}
.grid .steps li:first-child{padding-left:0}
.grid .steps li:last-child{border-right:0}
.grid .steps h3{margin-top:20px;margin-bottom:16px}
.grid .steps span{color:#666}
.grid .case{grid-template-columns:1fr 3fr;gap:30px;padding:36px;background:#f5f5f3}
.grid .case h2{font-size:40px;line-height:1.15}
.grid .case .flow{font-size:13px;line-height:1.8}
.grid .case .draft{border-left:2px solid #aaa;padding-left:15px;max-width:70ch}
.grid .article-list a{grid-template-columns:1fr 3fr 20px;padding:27px 0;gap:30px}
.grid .article-list h3{font-family:Arial,sans-serif;font-size:25px;line-height:1.25;font-weight:400;letter-spacing:-.025em}
.grid .article-list span{font-size:12px;color:#626262}
.grid .about{grid-template-columns:1fr 1fr;gap:48px;align-items:center}
.grid .about-photos{padding:0;margin:0}
.grid .about-photos img:first-child{position:static;width:100%;height:auto;aspect-ratio:4/5;border:0;object-position:center}
.grid .about h2{font-family:Arial,sans-serif;font-size:42px;line-height:1.12}
.grid .about .eyebrow{color:#555;margin-bottom:20px}
.grid .about p:not(.eyebrow){font-size:16px;line-height:1.7}
.grid .contact{grid-template-columns:1fr 3fr;gap:20px 30px;margin-top:104px;padding:40px 0 80px}
.grid .contact .eyebrow{grid-column:1;grid-row:1/4;margin-top:8px;color:#555}
.grid .contact h2,.grid .contact>p:not(.eyebrow),.grid .contact>.contact-link{grid-column:2;margin:0}
.grid .contact h2{font-size:clamp(45px,6vw,80px);line-height:1.08}
.grid .contact>p:not(.eyebrow){max-width:43ch}
.grid .contact>.contact-link{font-size:19px;padding:10px 0}
.grid footer{font-size:12px;padding:24px 0}
@media(max-width:1000px){.grid .hero{gap:28px}.grid .hero h1{font-size:7.4vw}.grid .project-copy{padding-left:28px}.grid .project-visual{min-height:440px}.grid .steps li:nth-child(2){border-right:0}.grid .steps li:nth-child(3){padding-left:0}}
@media(max-width:680px){.grid .site{padding:0 6%}.grid .hero{display:flex;padding-top:38px;gap:32px}.grid .hero h1{font-size:clamp(43px,10vw,65px);line-height:1.05}.grid .hero .eyebrow{font-size:10px;margin-bottom:25px}.grid .hero .intro{font-size:16px}.grid .hero-photo{width:100%;margin:0}.grid .hero-photo img{height:auto;aspect-ratio:4/5}.grid .work,.grid .approach,.grid .articles,.grid .about{margin-top:64px;padding-top:28px}.grid .section-heading{display:block;margin-bottom:30px}.grid .section-heading .eyebrow{margin:0 0 16px}.grid .section-heading h2{font-size:33px}.grid .articles .section-heading .text-link{margin-top:22px}.grid .project{display:flex;gap:0;margin-bottom:38px}.grid .project-visual{height:340px;min-height:340px}.grid .project-copy{padding:26px 0 0}.grid .project h3{font-size:37px}.grid .steps{grid-template-columns:1fr;gap:0}.grid .steps li,.grid .steps li:first-child,.grid .steps li:nth-child(3){padding:20px 0;border-right:0;display:grid;grid-template-columns:30px 1fr;gap:8px 12px}.grid .steps h3{margin:0;font-size:24px}.grid .steps span{padding-top:3px}.grid .steps p{grid-column:2;font-size:14px;margin-bottom:4px}.grid .case{display:block;padding:25px;margin-top:60px}.grid .case h2{font-size:31px}.grid .article-list a{grid-template-columns:1fr 20px;gap:10px}.grid .article-list h3{font-size:23px}.grid .article-list span{grid-column:1/-1}.grid .about{display:block}.grid .about-photos{margin-bottom:30px}.grid .about h2{font-size:34px}.grid .contact{display:block;margin-top:64px;padding:30px 0 60px}.grid .contact .eyebrow{margin:0 0 24px}.grid .contact h2{font-size:46px;margin-bottom:25px}.grid .contact>p:not(.eyebrow){margin-bottom:22px}.grid .contact>.contact-link{font-size:17px}}

/* Two reviewable opening compositions, with identical content and photography. */
.hero-comparison{display:flex;align-items:center;gap:24px;padding:18px 0;font-size:11px;border-bottom:1px solid #e4e4e4;color:#666}
.hero-comparison>span{margin-right:auto}
.hero-comparison a{padding:5px 0;border-bottom:1px solid transparent}
.hero-comparison [aria-current]{border-color:#151515;color:#151515}
.grid.hero-a .hero{grid-template-columns:1.12fr 1fr;align-items:center;gap:6%;padding-top:42px}
.grid.hero-a .hero h1{font-size:clamp(52px,5.4vw,78px);line-height:1.07;letter-spacing:-.06em}
.grid.hero-a .hero-photo{align-self:stretch;margin:0}
.grid.hero-a .hero-photo img{width:100%;height:100%;min-height:550px;max-height:680px;aspect-ratio:4/5;object-position:50% 45%}
.grid.hero-a .hero-text{padding:30px 0}
.grid.hero-a .hero .intro{max-width:43ch}
.grid.hero-b .hero{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));grid-template-rows:auto auto auto auto;column-gap:0;row-gap:0;padding-top:42px;isolation:isolate}
.grid.hero-b .hero-text{display:contents}
.grid.hero-b .hero-photo{grid-column:7/13;grid-row:1/5;align-self:stretch;margin:0;z-index:-1}
.grid.hero-b .hero-photo img{height:100%;width:100%;min-height:650px;aspect-ratio:auto;object-position:50% 45%}
.grid.hero-b .hero .eyebrow{grid-column:1/7;grid-row:1;align-self:end;margin:35px 0 28px}
.grid.hero-b .hero h1{grid-column:1/10;grid-row:2;align-self:start;font-size:clamp(62px,7.4vw,106px);line-height:1.03;letter-spacing:-.065em;margin:0 0 35px;z-index:1}
.grid.hero-b .hero h1 em{color:#151515}
.grid.hero-b .hero .intro{grid-column:1/6;grid-row:3;max-width:42ch;font-size:16px;margin:0 0 18px}
.grid.hero-b .hero .contact-link{grid-column:1/6;grid-row:4;align-self:start;justify-self:start;margin-bottom:30px}
@media(min-width:1500px){.grid.hero-a .hero h1{font-size:82px}}
@media(min-width:681px) and (max-width:1000px){.grid.hero-a .hero{gap:5%}.grid.hero-a .hero h1{font-size:5.5vw}.grid.hero-a .hero-photo img{min-height:490px}.grid.hero-a .hero .intro{font-size:15px}.grid.hero-b .hero h1{font-size:7.2vw}.grid.hero-b .hero-photo img{min-height:570px}.grid.hero-b .hero .eyebrow{font-size:9px}.grid.hero-b .hero .intro{font-size:14px}.grid.hero-b .hero .contact-link{font-size:12px;gap:15px}}
@media(max-width:680px){.hero-comparison{gap:18px;flex-wrap:wrap;padding:12px 0;font-size:10px}.hero-comparison>span{width:100%;margin:0}.grid.hero-a .hero{display:flex;gap:28px;padding-top:30px}.grid.hero-a .hero-text{padding:0}.grid.hero-a .hero h1{font-size:clamp(40px,10.5vw,68px);line-height:1.07}.grid.hero-a .hero-photo img{height:auto;min-height:0;aspect-ratio:4/5}.grid.hero-b .hero{grid-template-columns:repeat(12,minmax(0,1fr));grid-template-rows:auto auto auto auto;row-gap:0;padding-top:28px}.grid.hero-b .hero .eyebrow{grid-column:1/-1;grid-row:1;font-size:9px;margin:0 0 25px}.grid.hero-b .hero h1{grid-column:1/-1;grid-row:2;align-self:start;font-size:clamp(39px,10.3vw,65px);margin:0;line-height:1.06;padding-top:8px}.grid.hero-b .hero-photo{grid-column:4/-1;grid-row:2;align-self:start;margin-top:76px;margin-bottom:25px}.grid.hero-b .hero-photo img{height:auto;min-height:0;aspect-ratio:3/4;object-position:center}.grid.hero-b .hero .intro{grid-column:1/-1;grid-row:3;font-size:16px;margin:0 0 16px}.grid.hero-b .hero .contact-link{grid-column:1/-1;grid-row:4;margin:0}}
@media(max-width:680px){.grid.hero-b .hero-photo{margin-top:150px}}
@media(min-width:681px){.grid.hero-b .hero h1{color:#fff;mix-blend-mode:difference}.grid.hero-b .hero h1 em{color:inherit}}
.grid.hero-b .hero{background:#fff}
@media(min-width:681px){
 .grid.hero-b .hero{height:var(--welcome-height,calc(100svh - 220px));min-height:0;padding:24px 0 0;grid-template-rows:minmax(28px,.6fr) minmax(0,2.4fr) minmax(70px,1fr) minmax(36px,.5fr)}
 .grid.hero-b .hero-photo{min-height:0;height:100%;overflow:hidden}
 .grid.hero-b .hero-photo img{min-height:0;max-height:100%;height:100%;object-fit:cover;object-position:50% 45%}
 .grid.hero-b .hero .eyebrow{margin:0 0 14px;align-self:end;font-size:clamp(9px,1vw,11px)}
 .grid.hero-b .hero h1{font-size:min(7.4vw,calc(var(--welcome-height) * .155),106px);margin:0;align-self:center;line-height:1.03}
 .grid.hero-b .hero .intro{font-size:clamp(12px,1.25vw,16px);line-height:1.5;margin:8px 0;align-self:center}
 .grid.hero-b .hero .contact-link{margin:0;align-self:end;font-size:13px;padding:8px 0}
}
body.presentation .review,body.presentation .hero-comparison{display:none}
@media(max-width:680px){body.presentation.grid.hero-b header{padding:20px 0}body.presentation.grid.hero-b .hero{padding-top:22px}body.presentation.grid.hero-b .hero .eyebrow{margin-bottom:16px}body.presentation.grid.hero-b .hero-photo{margin-top:135px;max-height:32svh;overflow:hidden}body.presentation.grid.hero-b .hero-photo img{height:32svh;object-fit:cover;object-position:50% 40%}body.presentation.grid.hero-b .hero h1{font-size:min(10.3vw,5.5svh)}body.presentation.grid.hero-b .hero .intro{font-size:14px;line-height:1.5;margin-bottom:8px}body.presentation.grid.hero-b .hero .contact-link{padding:8px 0;font-size:12px}}
.overlap-switcher{display:flex;gap:26px;padding:12px 0;border-bottom:1px solid #ddd;font-size:12px;color:#666}
.overlap-switcher a{padding:5px 0;border-bottom:1px solid transparent}
.overlap-switcher [aria-current]{border-color:#111;color:#111}
@media(min-width:681px){
 .grid.hero-b.overlap-study .hero{position:relative}
 .grid.hero-b.overlap-study .hero h1{font-size:min(6.2vw,calc(var(--welcome-height) * .148),90px);grid-column:1/-1;width:100%}
 .headline-line{display:block;width:fit-content;white-space:nowrap}
 .grid.hero-b.overlap-study .hero-photo{position:absolute;left:var(--portrait-left);right:0;top:24px;bottom:0;height:auto;width:auto;grid-area:auto}
 .grid.hero-b.overlap-study .hero-photo img{object-position:60% 45%}
 .grid.hero-b.overlap-study .hero .intro{max-width:calc(var(--portrait-left) - 30px);width:42ch;grid-column:1/7}
 .grid.hero-b.overlap-study .hero .eyebrow{grid-column:1/7;font-size:10px}
 .overlap-3 .line-three{transform:translateX(var(--line-shift))}
 .overlap-4 .line-one{margin-left:8%}
 .overlap-4 .line-two{margin-left:16%}
 .overlap-4 .line-three{margin-left:24%}
}
@media(max-width:680px){.overlap-switcher{gap:16px;overflow-x:auto;white-space:nowrap;font-size:10px}.overlap-study .headline-line{display:block}.grid.hero-b.overlap-study .hero h1{font-size:9.5vw}.overlap-1 .hero-photo{margin-top:150px!important}.overlap-2 .hero-photo{grid-column:9/-1!important;margin-top:90px!important}.overlap-3 .hero-photo{grid-column:6/-1!important;margin-top:90px!important}.overlap-4 .hero-photo{grid-column:4/-1!important;margin-top:40px!important}.overlap-4 .line-two{margin-left:5%}.overlap-4 .line-three{margin-left:10%}.grid.hero-b.overlap-study .hero h1{color:white;mix-blend-mode:difference}.grid.hero-b.overlap-study .hero .intro{margin-top:12px}}
@media(min-width:681px){.overlap-2 .line-three{transform:translateX(var(--line-shift))}.grid.hero-b.overlap-study .hero h1{align-self:start}.grid.hero-b.overlap-study .hero-photo img{object-position:0% 45%}}
.grid .project h3 a{display:inline-flex;align-items:baseline;gap:16px}
.grid .project h3 a span{font-size:.55em;font-weight:400}
.grid .drafted-visual{padding:0;display:block;position:relative}
.drafted-animation{position:absolute;inset:0;width:100%;height:100%;border:0}
.grid .plumora-visual{display:block;position:relative;min-height:580px;background:#f7e1c3}
.plumora-cover{position:absolute;inset:0;border:0;padding:0;width:100%;height:100%;color:#fff;background:#3c382e;text-align:left;overflow:hidden}
.plumora-cover>img{width:100%;height:100%;object-fit:cover;object-position:center}
.plumora-cover:after{content:'';position:absolute;inset:0;background:linear-gradient(180deg,#19140c88,transparent 45%,#19140c99)}
.plumora-brand{position:absolute;top:30px;left:32px;font:clamp(40px,5vw,68px)/1 Georgia,serif;letter-spacing:-.04em;z-index:1}
.demo-invitation{position:absolute;bottom:28px;left:32px;right:32px;display:flex;justify-content:space-between;font-size:13px;z-index:1}
.plumora-demo{position:absolute;inset:0;background:#f7f4ed;display:flex;flex-direction:column}
.plumora-demo[hidden],.plumora-cover[hidden]{display:none}
.demo-toolbar{display:flex;justify-content:space-between;align-items:center;gap:16px;padding:12px 18px;background:#f7f4ed;color:#24251f;font-size:11px;border-bottom:1px solid #ddd}
.close-demo{border:0;background:transparent;padding:8px;font-size:12px}
.demo-slot{flex:1;min-height:0;display:flex;justify-content:center;background:#eae7df}
.demo-slot iframe{height:100%;width:100%;max-width:440px;border:0;background:#fff}
@media(max-width:680px){.grid .plumora-visual{height:580px;min-height:580px}.plumora-brand{font-size:48px;left:24px}.demo-invitation{left:24px;right:24px}.grid .drafted-visual{height:340px}}
.demo-fallback{display:flex;align-items:center;gap:24px;padding:28px;width:100%;color:#24251f}
.demo-fallback>img{width:42%;max-height:440px;object-fit:contain}
.demo-fallback h4{font:26px/1.2 Georgia,serif;margin:0 0 20px}
.demo-fallback p{font-size:14px;line-height:1.6}
.demo-fallback a{display:inline-block;font-size:14px;border-bottom:1px solid;padding-bottom:5px}
.demo-fallback small{display:block;font-size:10px;line-height:1.5;color:#68685e;margin-top:24px}
@media(max-width:680px){.demo-fallback{padding:20px;gap:18px}.demo-fallback h4{font-size:23px}.demo-fallback p,.demo-fallback a{font-size:12px}}

/* Original Plumora character and display face, composed as a quiet brand poster. */
@font-face{font-family:PlumoraDisplay;src:url('assets/plumora-display.ttf') format('truetype');font-display:swap}
.plumora-cover{background:#e6dff0;color:#292238;z-index:3;transform-origin:50% 100%;transition:transform 450ms cubic-bezier(.22,.7,.2,1),opacity 260ms ease;will-change:transform}
.plumora-cover:after{display:none}
.plumora-cover .plumora-brand{font-family:PlumoraDisplay,Georgia,serif;top:34px;left:0;width:100%;text-align:center;font-size:clamp(54px,6vw,84px);letter-spacing:-.045em;z-index:2}
.plumora-tagline{position:absolute;top:125px;left:0;width:100%;text-align:center;font:16px/1.4 Georgia,serif;z-index:2}
.plumora-cover>img{position:absolute;left:50%;bottom:44px;transform:translateX(-50%);width:80%;height:65%;object-fit:contain;filter:drop-shadow(0 18px 12px #3824481a);z-index:1}
.brand-orbit{position:absolute;width:80%;aspect-ratio:1;left:10%;bottom:30px;border-radius:50%;background:#f4dcb0}
.brand-stamp{position:absolute;bottom:20px;right:20px;font:9px/1.5 Arial,sans-serif;letter-spacing:.1em;text-align:right;z-index:2}
.plumora-demo{z-index:2;opacity:0;transform:translateY(18px) scale(.97);transition:opacity 240ms ease,transform 450ms cubic-bezier(.22,.7,.2,1);pointer-events:none}
.demo-open .plumora-cover{transform:translateY(-105%) rotate(-3deg);opacity:0;pointer-events:none}
.demo-open .plumora-demo{opacity:1;transform:none;pointer-events:auto}
@media(prefers-reduced-motion:reduce){.plumora-cover,.plumora-demo{transition:none;transform:none}.demo-open .plumora-cover{transform:none;opacity:0}}
@media(max-width:680px){.plumora-cover .plumora-brand{font-size:64px;top:38px}.plumora-tagline{top:123px;font-size:15px}}

/* Generated as a two-leaf doorway: the artwork itself becomes the transition. */
.grid .plumora-visual{perspective:1100px;isolation:isolate}
.plumora-cover{background:transparent;overflow:visible;transform:none;opacity:1;will-change:auto;transition:none;perspective:1100px;transform-style:preserve-3d}
.postal-door{position:absolute;top:0;bottom:0;width:50%;background-image:url('assets/plumora-post-office-doors.png');background-size:200% 100%;background-repeat:no-repeat;backface-visibility:hidden;transition:transform 680ms cubic-bezier(.22,.7,.15,1),filter 680ms ease;will-change:transform}
.postal-door-left{left:0;background-position:left center;transform-origin:left center}
.postal-door-right{right:0;background-position:right center;transform-origin:right center}
.plumora-cover .plumora-brand{top:11%;font-size:clamp(52px,6vw,80px);color:#fff0cb;text-shadow:0 2px 10px #122c25b3;transition:opacity 180ms ease,transform 320ms ease}
.demo-open .plumora-cover{transform:none;opacity:1;pointer-events:none}
.demo-open .postal-door-left{transform:rotateY(-104deg);filter:brightness(.6)}
.demo-open .postal-door-right{transform:rotateY(104deg);filter:brightness(.6)}
.demo-open .plumora-brand{opacity:0;transform:translateY(-8px)}
.plumora-demo{opacity:0;transform:scale(.94);transition:opacity 250ms ease,transform 680ms cubic-bezier(.22,.7,.15,1)}
.demo-open .plumora-demo{opacity:1;transform:scale(1)}
@media(prefers-reduced-motion:reduce){.postal-door,.plumora-cover .plumora-brand,.plumora-demo{transition:none}.demo-open .postal-door{transform:none;opacity:0}.demo-open .plumora-cover{opacity:0}}
.grid .plumora-visual{width:100%;height:auto;min-height:0;aspect-ratio:1;align-self:start}
.plumora-demo .demo-fallback>img{max-height:100%;min-height:0}
.plumora-demo .demo-slot{overflow:auto}
@media(max-width:1000px){.plumora-cover .plumora-brand{font-size:clamp(40px,5.6vw,64px)}}
@media(max-width:680px){.plumora-cover .plumora-brand{font-size:58px}}

/* Keep the embedded app usable on narrow project cards. */
.grid .plumora-visual{min-height:560px}
.plumora-demo .demo-slot{overflow:hidden}
.demo-slot iframe{display:block;flex:1;min-height:0}
@media(max-width:680px){.grid .plumora-visual{min-height:600px;aspect-ratio:auto}}

.grid .plumora-visual{overflow:clip}

/* Match Plumora's original 390 × 844 app viewport, scaled as one complete screen. */
.plumora-demo .demo-slot{display:grid;place-items:center;position:relative;background:#f6eddd url('assets/plumora-demo-stationery.png') center/cover no-repeat;overflow:clip}
.demo-phone{position:relative;padding:calc(7px * var(--phone-scale));border-radius:calc(31px * var(--phone-scale));background:#303234;box-shadow:0 0 0 1px #222,2px 3px 5px #372b1c55,12px 20px 35px #372b1c40}
.demo-phone-screen{position:relative;width:100%;height:100%;overflow:clip;border-radius:calc(24px * var(--phone-scale));background:#173c3a}
.demo-slot .demo-phone iframe{position:absolute;inset:0;width:390px;height:844px;max-width:none;min-height:0;transform:scale(var(--phone-scale));transform-origin:top left;border:0;display:block}

.grid .plumora-visual{min-width:0;aspect-ratio:auto;height:clamp(560px,42vw,760px)}
.plumora-demo,.plumora-demo .demo-slot{min-width:0}
@media(max-width:680px){.grid .plumora-visual{height:600px}}

/* The demo fills the card; retain a keyboard-only exit without a visible banner. */
.plumora-demo>.close-demo{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap;border:0;z-index:5}
.plumora-demo>.close-demo:focus-visible{width:auto;height:auto;margin:0;padding:8px 12px;top:12px;right:12px;clip-path:none;background:#f7f4ed;color:#24251f}
/* Original Plumora Swoop, contained in the project card rather than the viewport. */
.swoop-transition .postal-door,.swoop-transition .plumora-brand{transition:none!important;transform:none!important;filter:none!important}
.swoop-transition .plumora-cover{transition:opacity 180ms ease}
.swoop-transition.demo-open .plumora-cover{opacity:0;transition:none}
.swoop-transition .plumora-demo{transform:none;transition:none}
.portfolio-swoop{position:absolute;left:0;top:0;width:240%;height:240%;z-index:6;pointer-events:none;visibility:hidden;contain:layout style}
.portfolio-swoop.is-flying{visibility:visible;animation:portfolio-swoop-flight 2000ms linear both;will-change:transform}
.portfolio-swoop-crowd{position:absolute;inset:10%;background-image:url('assets/swoop-dove-crowd.png');background-size:clamp(180px,22vw,320px);mask-image:radial-gradient(ellipse closest-side,#000 87%,transparent 100%)}
.portfolio-swoop>img{position:absolute;width:15%;height:13%;object-fit:contain;filter:grayscale(1) brightness(1.85);pointer-events:none}
@keyframes portfolio-swoop-flight{0%{transform:translate3d(-104.167%,45.833%,0)}42%{transform:translate3d(-37.5%,-20.833%,0)}58%{transform:translate3d(-20.833%,-37.5%,0)}100%{transform:translate3d(45.833%,-104.167%,0)}}
@media(prefers-reduced-motion:reduce){.portfolio-swoop{display:none}.swoop-transition .plumora-cover{transition:none}}
/* Shared project frame: Drafted and Plumora always use identical dimensions. */
.grid .project-visual:is(.drafted-visual,.plumora-visual){width:100%;min-width:0;height:480px;min-height:480px;aspect-ratio:auto;align-self:start}
@media(max-width:1000px){.grid .project-visual:is(.drafted-visual,.plumora-visual){height:440px;min-height:440px}}
@media(max-width:680px){.grid .project-visual:is(.drafted-visual,.plumora-visual){height:340px;min-height:340px}}
/* Let the selected Grid design use the desktop viewport instead of a 1440px cap. */
@media(min-width:1001px){.grid .site{width:80%;max-width:none;padding:0}}
@media(min-width:681px) and (max-width:1000px){.grid .site{width:90%;max-width:none;padding:0}}

/* Two equal portrait project columns, with their copy below the experience. */
@media(min-width:1001px){.grid .site{width:70%}}
.grid .work{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:clamp(24px,3vw,56px);align-items:start}
.grid .work>.section-heading{grid-column:1/-1;margin-bottom:0}
.grid .work>.project{display:flex;flex-direction:column;min-width:0;margin:0;border-top:0;gap:0}
.grid .project-visual:is(.drafted-visual,.plumora-visual){height:auto;min-height:0;aspect-ratio:4/5;flex:none}
.grid .project-copy{width:100%;padding:28px 0 0;max-width:60ch}
.grid .plumora-cover{background:#183c31 url('assets/plumora-post-office-doors.png') center/cover no-repeat}
.grid .postal-door{display:none}
@media(max-width:800px){.grid .work{grid-template-columns:minmax(0,1fr);gap:48px}.grid .project-copy{padding-top:24px}}