:root{--ink:#252825;--muted:#626660;--line:#d8dbd5;--accent:#67543e}*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:95px}body{margin:0;background:#fff;color:var(--ink);font-family:Arial,Helvetica,sans-serif;font-size:16px;line-height:1.6}a{color:inherit;text-decoration:none}a:focus-visible{outline:2px solid #836843;outline-offset:6px}.skip{position:absolute;top:-100px;z-index:20;background:white;padding:12px}.skip:focus{top:10px}header{height:112px;margin:0 5%;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid var(--line)}.brand{font-size:30px;font-weight:700;letter-spacing:-1.5px;line-height:1;display:inline-flex;flex-direction:column;gap:8px}.brand span{font-size:12px;letter-spacing:3px;font-weight:400}nav{display:flex;gap:38px;font-size:14px}nav a:hover,.textlink:hover{color:var(--accent)}nav a:last-child{margin-left:30px}.hero{padding:36px 5% 0}.eyebrow,.section-label{font-size:12px;letter-spacing:1.7px;font-weight:500}.eyebrow{display:flex;justify-content:space-between}.headline{display:flex;align-items:flex-end;justify-content:space-between;gap:40px;padding:52px 0 56px}h1{font-size:clamp(54px,7.6vw,118px);font-weight:400;line-height:1.04;letter-spacing:-5px;margin:0}h1 em{font-family:Georgia,serif;font-weight:400;color:var(--accent)}.intro{padding-bottom:6px;min-width:240px}.intro p{font-size:17px;color:var(--muted);line-height:1.65;margin:0 0 32px}.textlink{display:flex;justify-content:space-between;gap:45px;border-bottom:1px solid var(--ink);padding-bottom:8px;font-size:14px}.hero-image{margin:0}.hero-image img{display:block;width:100%;height:530px;object-fit:cover;object-position:center 56%;background:#e2e4df}.hero-image figcaption{display:flex;justify-content:space-between;gap:16px;font-size:12px;letter-spacing:.8px;padding-top:13px;color:var(--muted)}.hero-image figcaption span{letter-spacing:0}.section{display:grid;grid-template-columns:1fr 2.15fr;gap:45px;margin:0 5%;padding:115px 0;border-bottom:1px solid var(--line)}h2{font-size:clamp(34px,4vw,58px);font-weight:400;letter-spacing:-1.9px;line-height:1.16;margin:0 0 34px}.large-copy{font-size:24px;line-height:1.55;max-width:710px;margin:0 0 30px}.studio-columns{display:grid;grid-template-columns:1fr 1fr;gap:40px;color:var(--muted)}p{margin:0 0 20px}.services h2{margin-bottom:50px}.service{border-top:1px solid var(--line);padding:25px 0;display:grid;grid-template-columns:30px 1fr 1.15fr;gap:18px}.service>span{font-size:12px;padding-top:5px;color:var(--muted)}h3{font-size:21px;font-weight:400;line-height:1.35;margin:0}.service p{font-size:16px;color:var(--muted);margin:0}.projects{padding:110px 5%}.project-heading{display:flex;justify-content:space-between;align-items:end;margin-bottom:48px;gap:30px}.project-heading .section-label{margin-bottom:28px}.project-heading h2{margin:0}.project-heading p{font-size:16px;color:var(--muted);margin:0}.project-row{display:grid;grid-template-columns:35px 1.2fr 1fr .7fr 20px;align-items:center;gap:20px;padding:36px 0;border-top:1px solid var(--line);transition:background .2s}.project-row:last-child{border-bottom:1px solid var(--line)}.project-row:hover{background:#f4f5f2}.project-num,.project-type{font-size:12px;color:var(--muted);letter-spacing:1px}.project-row h3{font-size:25px;letter-spacing:-.5px}.project-row div{font-size:14px}.project-row div span{display:block;color:var(--muted);margin-top:4px}.contact{background:var(--ink);color:#fff;padding:65px 5% 80px}.contact .section-label{color:#c0c5bc;margin-bottom:45px}.contact-grid{display:grid;grid-template-columns:1.65fr 1fr;gap:70px}.contact h2{font-size:clamp(40px,4.8vw,72px);margin:0}.contact p{max-width:340px;color:#d0d5cc}.language{font-size:14px;border-top:1px solid #5c6259;padding-top:16px;display:block;max-width:340px}footer{display:flex;align-items:center;justify-content:space-between;gap:30px;padding:45px 5%}footer>span{font-size:12px;color:var(--muted);letter-spacing:.5px}footer .brand{font-size:24px}footer .brand span{font-size:12px;letter-spacing:1.8px}@media(min-width:1700px){body{max-width:1800px;margin:auto}}@media(max-width:800px){header{height:95px}nav{gap:18px}nav a:last-child{margin-left:0}.headline{gap:25px}h1{letter-spacing:-3px}.intro{min-width:190px}.intro p{font-size:16px}.hero-image img{height:390px}.section{grid-template-columns:1fr;gap:32px;padding:75px 0}.service{grid-template-columns:25px 1fr 1fr}.project-type{display:none}.project-row{grid-template-columns:25px 1.2fr 1fr 16px}.project-row h3{font-size:21px}.contact-grid{gap:30px}footer>span:nth-child(2){display:none}}@media(max-width:540px){header{align-items:center}.brand{font-size:24px}nav{gap:15px;font-size:14px}nav a:first-child{display:none}.eyebrow{font-size:12px;letter-spacing:.7px}.eyebrow span{display:none}.headline{display:block;padding:36px 0}.intro{margin-top:28px;max-width:280px}.intro p br{display:none}.intro p{margin-bottom:22px}h1{font-size:61px;letter-spacing:-3px}.hero-image img{height:340px}.hero-image figcaption{display:block;font-size:12px}.hero-image figcaption span{display:block;margin-top:5px}.studio-columns{grid-template-columns:1fr;gap:0}.large-copy{font-size:22px}.service{grid-template-columns:25px 1fr;gap:12px}.service p{grid-column:2}.project-heading{display:block}.project-heading p{margin-top:22px}.projects{padding:70px 5%}.project-row{grid-template-columns:25px 1fr 16px;gap:12px;padding:26px 0}.project-row div{grid-column:2;grid-row:2}.project-row>span:last-child{grid-column:3;grid-row:1}.contact-grid{grid-template-columns:1fr;gap:25px}.contact{padding:45px 5%}.contact h2{font-size:43px}footer{align-items:start}footer>span{max-width:135px;text-align:right}}@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}}
/* Project photography */
.hero{display:grid;grid-template-columns:1fr 1fr;column-gap:6%;padding-top:34px}.hero>.eyebrow{grid-column:1/-1;margin-bottom:36px}.hero .headline{display:flex;flex-direction:column;align-items:flex-start;justify-content:center;padding:30px 0;gap:40px}.hero h1{font-size:clamp(54px,6.2vw,94px);letter-spacing:-3.7px}.hero .intro{max-width:310px}.hero-image img{height:auto;aspect-ratio:3/4;object-fit:cover}.hero-image figcaption{flex-direction:column;gap:3px;font-size:12px}.photo-gallery{display:grid;grid-template-columns:1fr 1fr;gap:52px 32px;margin-bottom:75px}.gallery-item{margin:0;min-width:0}.gallery-item:first-child{grid-column:1/-1;max-width:100%;display:grid;grid-template-columns:1.5fr 1fr;align-items:center;gap:7%}.gallery-item a{display:block;overflow:hidden;background:#f0f0ed}.gallery-item img{width:100%;height:auto;aspect-ratio:3/4;object-fit:cover;display:block;transition:transform .35s}.gallery-item:first-child img{aspect-ratio:1}.gallery-item a:hover img{transform:scale(1.025)}.gallery-item figcaption{padding-top:18px;display:flex;justify-content:space-between;gap:14px}.gallery-item figcaption h3{font-size:23px;letter-spacing:-.5px}.gallery-item figcaption p{font-size:14px;color:var(--muted);margin:5px 0 0}.gallery-item figcaption>span{font-size:12px;letter-spacing:1px;white-space:nowrap;padding-top:5px;color:var(--muted)}.gallery-item:first-child figcaption{display:flex;flex-direction:column;gap:20px;padding:0}.gallery-item:first-child h3{font-size:clamp(30px,3.3vw,48px);line-height:1.15;max-width:280px}.project-list-label{font-size:12px;letter-spacing:1.5px;margin-bottom:25px}.project-row:hover{background:transparent}@media(max-width:800px){.hero h1{font-size:58px;letter-spacing:-2.5px}.hero .headline{gap:22px}.hero-image img{height:auto}.gallery-item figcaption{flex-direction:column;gap:4px}}@media(max-width:540px){.hero{display:block}.hero>.eyebrow{margin-bottom:0}.hero .headline{padding:35px 0;gap:0}.hero h1{font-size:61px}.hero-image img{height:auto;aspect-ratio:3/4}.photo-gallery{grid-template-columns:1fr;gap:35px;margin-bottom:55px}.gallery-item:first-child{display:block;grid-column:auto}.gallery-item:first-child figcaption{padding-top:18px;gap:4px}.gallery-item:first-child h3{font-size:23px;max-width:none}.gallery-item figcaption h3{font-size:23px}.gallery-item:first-child img{aspect-ratio:1}.project-heading{margin-bottom:30px}}@media(prefers-reduced-motion:reduce){.gallery-item img{transition:none}}
/* Square portfolio grid */
.photo-gallery{grid-template-columns:repeat(3,minmax(0,1fr));gap:5px;margin-bottom:65px}.gallery-item,.gallery-item:first-child{display:block;grid-column:auto;position:relative;max-width:none;aspect-ratio:1;min-width:0}.gallery-item a,.gallery-item:first-child a{width:100%;height:100%;aspect-ratio:1}.gallery-item img,.gallery-item:first-child img{width:100%;height:100%;aspect-ratio:1;object-fit:cover;object-position:center}.gallery-item figcaption,.gallery-item:first-child figcaption{position:absolute;left:0;right:0;bottom:0;padding:35px 16px 14px;background:linear-gradient(transparent,rgba(0,0,0,.72));color:white;display:block;opacity:0;transition:opacity .2s;pointer-events:none}.gallery-item:hover figcaption,.gallery-item:focus-within figcaption{opacity:1}.gallery-item figcaption h3,.gallery-item:first-child h3{font-size:18px;line-height:1.25;max-width:none;color:white}.gallery-item figcaption p{display:none}.gallery-item figcaption>span{color:white;font-size:12px;display:block;margin-top:6px}.gallery-item a:focus-visible{outline:3px solid #67543e;outline-offset:-3px}.gallery-item a:hover img{transform:none}@media(max-width:800px){.photo-gallery{grid-template-columns:repeat(3,minmax(0,1fr));gap:4px}}@media(max-width:540px){.photo-gallery{grid-template-columns:repeat(3,minmax(0,1fr));gap:3px;margin-bottom:45px}.gallery-item:first-child figcaption{padding:25px 8px 8px}.gallery-item figcaption{padding:25px 8px 8px}.gallery-item figcaption h3,.gallery-item:first-child h3{font-size:14px}.gallery-item figcaption>span{display:none}}@media(prefers-reduced-motion:reduce){.gallery-item figcaption{transition:none}}
/* Supplied studio identity; preserve original artwork */
header{height:180px}.brand{display:block;flex-shrink:0}.brand .logo-window{display:block;position:relative;width:170px;aspect-ratio:1.22;overflow:hidden;letter-spacing:normal}.logo-window img{display:block;position:absolute;width:145%;height:auto;max-width:none;left:-22%;top:-29%}footer .brand .logo-window{width:150px}html{scroll-padding-top:30px}@media(max-width:540px){header{height:145px;gap:16px}.brand .logo-window{width:130px}footer .brand .logo-window{width:130px}nav{gap:12px}nav a:last-child span{display:none}}@media(max-width:360px){header{flex-wrap:wrap;height:auto;padding:16px 0;gap:14px}nav{width:100%;justify-content:space-between}.brand .logo-window{width:125px}}
/* Compact identity and panoramic opening image */
header{height:102px;border-bottom:0}.brand .logo-window{width:96px}footer .brand .logo-window{width:105px}.hero{display:block;position:relative;padding:0;margin:0 3%;isolation:isolate}.hero .hero-image{position:relative;margin:0}.hero .hero-image img{display:block;width:100%;height:clamp(420px,43vw,630px);aspect-ratio:auto;object-fit:cover;object-position:center 39%}.hero .hero-image:after{content:"";position:absolute;inset:0 0 36px;background:linear-gradient(90deg,rgba(13,19,19,.57),rgba(13,19,19,.12) 57%,transparent);pointer-events:none}.hero .headline{position:absolute;z-index:2;left:5%;top:50%;transform:translateY(-50%);display:block;padding:0;max-width:430px;color:white}.hero h1{font-size:clamp(36px,4.1vw,60px);line-height:1.08;letter-spacing:-1.7px;text-shadow:0 1px 12px rgba(0,0,0,.16)}.hero h1 em{color:white}.hero .intro{margin-top:22px;padding:0;max-width:300px;min-width:0}.hero .intro p{font-size:16px;line-height:1.55;color:white;margin:0 0 22px;text-shadow:0 1px 6px rgba(0,0,0,.35)}.hero .textlink{font-size:14px;color:white;border-color:rgba(255,255,255,.7);max-width:245px}.hero .textlink:hover{color:#fff;border-color:#fff}.hero-image figcaption{height:36px;padding-top:10px;display:flex;flex-direction:row;align-items:start;justify-content:space-between;font-size:12px;gap:12px}.hero-image figcaption span{margin:0}@media(max-width:800px){header{height:96px}.brand .logo-window{width:90px}.hero .headline{left:6%;max-width:360px}.hero .hero-image img{height:460px;object-position:48% 38%}.hero h1{font-size:46px}}@media(max-width:540px){header{height:88px;flex-wrap:nowrap;padding:0;gap:16px}.brand .logo-window{width:80px}footer .brand .logo-window{width:90px}nav{width:auto;gap:16px;justify-content:initial}.hero{margin:0 3%}.hero .hero-image img{height:440px;object-position:43% 36%}.hero .headline{left:7%;right:7%;top:auto;bottom:78px;transform:none;max-width:none;padding:0}.hero h1{font-size:38px;letter-spacing:-1px}.hero .intro{margin-top:18px;max-width:280px}.hero .intro p{font-size:15px;margin-bottom:18px}.hero .hero-image:after{bottom:52px;background:linear-gradient(0deg,rgba(13,19,19,.73),rgba(13,19,19,.22) 72%,rgba(13,19,19,.06))}.hero-image figcaption{height:52px;display:block;font-size:12px;line-height:1.5}.hero-image figcaption span{display:block;margin:0}.hero .textlink{max-width:220px}}@media(max-width:360px){nav{gap:12px;font-size:14px}.brand .logo-window{width:72px}.hero h1{font-size:35px}}
/* Left navigation sits close to photography; identity on the right */
header{align-items:flex-end;justify-content:space-between;padding-bottom:12px;height:112px;gap:24px}header nav{order:0;align-self:flex-end;padding-bottom:8px;border-bottom:1px solid #a5a8a2;gap:32px}header nav a:last-child{margin-left:0}header>.brand{order:1;align-self:center;margin-left:auto}header nav a:first-child{display:inline}@media(max-width:800px){header{height:105px;padding-bottom:12px}header nav{gap:24px}}@media(max-width:540px){header{height:96px;padding:0 0 10px;gap:16px;flex-wrap:nowrap}header nav{width:auto;gap:14px;padding-bottom:7px;font-size:14px}header>.brand .logo-window{width:72px}}@media(max-width:360px){header{gap:10px;height:90px}header nav{gap:10px;font-size:13px}header>.brand .logo-window{width:62px}}
/* Quiet editorial typography and image-led pacing */
:root{--ink:#343937;--muted:#6a706c;--line:#dce0dc;--accent:#47534e}body{font-family:'Jost',Arial,sans-serif;font-weight:400;letter-spacing:.15px;line-height:1.75}h1,h2{font-family:'Cormorant Garamond',Georgia,serif;font-weight:400;letter-spacing:-.5px}h2{font-size:clamp(36px,3.8vw,54px);line-height:1.12}nav{font-family:'Jost',Arial,sans-serif;font-size:14px;letter-spacing:1px}.section-label,.project-list-label{letter-spacing:2px;font-size:12px}.hero{margin:0 2%}.hero .hero-image img{height:clamp(440px,46vw,650px);object-position:center 39%}.hero .headline{left:7%;max-width:480px}.hero h1{font-family:'Cormorant Garamond',Georgia,serif;font-size:clamp(40px,4.3vw,64px);font-weight:400;line-height:1.02;letter-spacing:-.4px;max-width:440px}.hero .intro{margin-top:22px}.hero .intro p{font-family:'Jost',Arial,sans-serif;font-size:16px;font-weight:400;line-height:1.6}.textlink{font-family:'Jost',Arial,sans-serif;letter-spacing:.5px}.hero-image figcaption{letter-spacing:1px}.studio.section{display:block;padding:125px 0 115px;max-width:920px;margin:0 auto;text-align:center;border-bottom:0}.studio>.section-label{margin-bottom:28px}.studio h2{max-width:650px;margin:0 auto 30px;font-size:clamp(38px,4.3vw,60px)}.studio .large-copy{font-family:'Cormorant Garamond',Georgia,serif;font-size:clamp(26px,2.5vw,36px);line-height:1.3;max-width:760px;margin:0 auto 35px}.studio-columns{gap:40px;max-width:770px;margin:auto;text-align:left;font-size:16px}.projects{padding:35px 5% 110px}.project-heading{align-items:center;margin-bottom:45px}.project-heading h2{font-size:clamp(38px,4vw,56px)}.project-heading p{font-size:16px}.photo-gallery{gap:6px}.project-row h3{font-family:'Cormorant Garamond',Georgia,serif;font-size:28px;letter-spacing:0}.project-row{padding:28px 0}.services.section{padding:95px 0 110px;border-top:1px solid var(--line);border-bottom:0}.service h3{font-family:'Jost',Arial,sans-serif;font-size:18px}.service p{line-height:1.7}.contact{padding:75px 7% 85px;background:#343e39}.contact h2{font-family:'Cormorant Garamond',Georgia,serif;font-size:clamp(40px,4.7vw,66px);letter-spacing:-.4px}.contact .section-label{letter-spacing:2px}.contact p{font-size:16px}footer{padding-top:40px;padding-bottom:40px}@media(max-width:1000px){.studio.section{margin:0 7%}}@media(max-width:540px){.hero{margin:0 2%}.hero .hero-image img{height:450px}.hero .headline{left:7%;right:7%;bottom:82px;max-width:none}.hero h1{font-size:42px;max-width:290px;line-height:1.02}.hero .intro p{font-size:16px}.hero-image figcaption{letter-spacing:.4px}.studio.section{padding:75px 0 60px}.studio h2{font-size:40px;margin-bottom:24px}.studio .large-copy{font-size:28px}.studio-columns{display:block;font-size:16px;text-align:center}.studio-columns p{margin-bottom:22px}.projects{padding:20px 5% 65px}.project-heading h2{font-size:40px}.photo-gallery{gap:3px}.services.section{padding:65px 0}.contact{padding:55px 6%}.contact h2{font-size:43px}.project-row h3{font-size:24px}}
/* Centered compact identity, individually underlined navigation */
header{display:grid;grid-template-columns:minmax(0,1fr) auto minmax(0,1fr);align-items:end;height:88px;padding:0 0 7px;gap:24px}header>.brand{grid-column:2;grid-row:1;order:0;align-self:end;margin:0;justify-self:center}header>.brand .logo-window{width:76px}header nav{grid-row:1;order:0;width:auto;align-self:end;display:flex;border:0;padding:0 0 3px;gap:30px;font-size:14px;letter-spacing:.7px}header .nav-left{grid-column:1;justify-self:start}header .nav-right{grid-column:3;justify-self:end}header nav a{display:inline-block!important;border-bottom:1px solid #8e9690;padding-bottom:5px;line-height:1.4;margin:0!important}header nav a:hover{border-color:var(--ink)}@media(max-width:800px){header{height:82px;gap:18px;padding-bottom:6px}header nav{gap:22px}header>.brand .logo-window{width:70px}}@media(max-width:540px){header{height:76px;gap:12px;padding:0 0 5px}header nav{gap:14px;font-size:14px;letter-spacing:0;padding-bottom:2px}header>.brand .logo-window{width:60px}header nav a{padding-bottom:4px}}@media(max-width:360px){header{gap:8px;height:72px}header nav{gap:9px;font-size:14px}header>.brand .logo-window{width:52px}}
/* A taller opening photograph reveals more of the original composition. */
.hero .hero-image img{height:clamp(520px,55vw,780px);object-position:center 43%}@media(max-width:800px){.hero .hero-image img{height:560px;object-position:center 43%}}@media(max-width:540px){.hero .hero-image img{height:530px;object-position:center 43%}}
/* A short studio introduction leads directly into the portfolio. */
.studio.section{display:block;padding:52px 0 38px;margin:0 auto;max-width:850px;text-align:center}.studio h1{font-family:'Cormorant Garamond',Georgia,serif;font-size:clamp(34px,3.4vw,48px);font-weight:400;line-height:1.08;letter-spacing:-.4px;margin:0 0 22px}.studio-summary{font-size:16px;line-height:1.65;color:var(--muted);max-width:720px;margin:0 auto}.projects{padding-top:14px}.project-heading{margin-bottom:18px;align-items:baseline;gap:20px;display:flex;justify-content:space-between}.project-heading h2{font-family:'Jost',Arial,sans-serif;font-size:14px;font-weight:400;line-height:1.5;letter-spacing:1px;margin:0}.project-heading p{font-size:14px;margin:0;color:var(--muted)}@media(max-width:900px){.studio.section{margin:0 7%}}@media(max-width:540px){.studio.section{padding:35px 0 28px;margin:0 6%}.studio h1{font-size:36px;margin-bottom:18px}.studio-summary{font-size:16px;line-height:1.6}.studio-summary br{display:none}.projects{padding-top:8px}.project-heading{display:flex;margin-bottom:14px;gap:15px}.project-heading h2{font-size:14px}.project-heading p{font-size:12px;text-align:right;margin:0}}
/* Increase the centered company logo by 30%. */
header>.brand .logo-window{width:98.8px}@media(max-width:800px){header>.brand .logo-window{width:91px}}@media(max-width:540px){header>.brand .logo-window{width:78px}}@media(max-width:360px){header>.brand .logo-window{width:67.6px}}
/* Mixed journal with six-at-a-time browsing and a return-to-place photo viewer. */
.projects{max-width:1180px;width:84%;margin:0 auto;padding-left:0;padding-right:0}.photo-gallery{margin-bottom:20px}.gallery-item[hidden],#load-more[hidden]{display:none!important}.gallery-more{text-align:center;margin:18px 0 0}.gallery-more button{font:inherit;font-size:15px;letter-spacing:.7px;background:none;border:0;border-bottom:1px solid #929a94;padding:8px 20px;cursor:pointer;color:var(--ink)}.gallery-more p{font-size:12px;color:var(--muted);margin:12px 0 0}.gallery-more button:focus-visible,.photo-close:focus-visible{outline:2px solid #a5b8ac;outline-offset:4px}#photo-viewer{border:0;padding:64px 30px 25px;max-width:none;max-height:none;width:100%;height:100%;margin:0;background:rgba(20,24,22,.97);color:#fff;overflow:auto}#photo-viewer::backdrop{background:rgba(0,0,0,.85)}#photo-viewer[open]{display:flex;align-items:center;justify-content:center;flex-direction:column;gap:15px}#full-photo{display:block;max-width:100%;max-height:calc(100dvh - 135px);width:auto;height:auto;object-fit:contain;flex-shrink:0}#photo-caption{margin:0;font-size:14px;color:#e1e5e0}.photo-close{position:fixed;top:16px;right:24px;z-index:2;font:inherit;font-size:16px;background:#252b27;color:white;border:1px solid #6e7971;padding:8px 15px;cursor:pointer;min-height:44px}@media(max-width:540px){.projects{width:88%}#photo-viewer{padding:70px 12px 25px}.photo-close{right:14px}#full-photo{max-height:calc(100dvh - 145px)}}
/* Handwritten philosophy headline; retain the body typography. */
.studio h1{font-family:'Caveat',cursive;font-size:clamp(42px,4.2vw,58px);font-weight:400;line-height:1.15;letter-spacing:0;margin-bottom:24px}@media(max-width:540px){.studio h1{font-size:44px;line-height:1.14;margin-bottom:20px}}
/* Fine, connected signature-style lettering inspired by the supplied sample. */
.studio h1{font-family:'The Nautigal',cursive;font-weight:400;font-size:clamp(52px,5.4vw,74px);line-height:1.05;letter-spacing:0;margin-bottom:28px;padding:8px 12px}@media(max-width:540px){.studio h1{font-size:58px;line-height:1.06;margin-bottom:24px}}
/* User-supplied Messy Nessy font. */
.studio h1{font-family:'Messy Nessy',cursive;font-weight:400;font-size:clamp(40px,4.1vw,58px);line-height:1.4;letter-spacing:0;padding:10px 16px;margin-bottom:22px}@media(max-width:540px){.studio h1{font-size:42px;line-height:1.4;margin-bottom:20px}}
/* Larger pale-gray signature with closely spaced lines. */
.studio h1{font-size:clamp(48px,4.9vw,70px);line-height:1;color:#929793;padding:12px 16px;margin-bottom:28px}@media(max-width:540px){.studio h1{font-size:50px;line-height:1;margin-bottom:24px}}
/* Keep the philosophy on a single responsive line. */
.studio h1{white-space:nowrap;font-size:clamp(28px,4.9vw,64px);padding:12px 0;line-height:1.2}@media(max-width:540px){.studio h1{font-size:clamp(24px,6.2vw,33px);line-height:1.2}}
/* Compact contact section with the studio's signature lettering. */
.contact{padding:38px 7% 42px}.contact .section-label{margin-bottom:22px}.contact h2{font-family:'Messy Nessy',cursive;font-size:clamp(38px,3.8vw,54px);font-weight:400;line-height:1.15;letter-spacing:0;margin:0}.contact-grid{align-items:center;gap:40px}.contact p{margin-bottom:12px;line-height:1.55}.contact .language{padding-top:10px}@media(max-width:540px){.contact{padding:30px 6% 32px}.contact .section-label{margin-bottom:20px}.contact h2{font-family:'Messy Nessy',cursive;font-size:42px;line-height:1.15}.contact-grid{gap:22px}}
/* Match service headline to the contact signature typography. */
.services h2{font-family:'Messy Nessy',cursive;font-size:clamp(38px,3.8vw,54px);font-weight:400;line-height:1.15;letter-spacing:0}@media(max-width:540px){.services h2{font-size:42px;line-height:1.15}}
/* Full-width, double-size service signature. */
.services.section{display:block}.services>.section-label{margin-bottom:26px}.services h2{font-size:clamp(76px,7.6vw,108px);white-space:nowrap;line-height:1.15;margin:0 0 50px;transform-origin:left center}.services .service{max-width:850px;margin-left:auto}@media(max-width:1100px){.services h2{font-size:clamp(34px,7.6vw,84px)}}@media(max-width:540px){.services h2{font-size:7.3vw;white-space:nowrap;margin-bottom:32px;line-height:1.2}.services>.section-label{margin-bottom:20px}}
.services h2{text-align:center;width:100%;transform-origin:center}

/* Three rows of photographs with a persistent draggable scrollbar. */
.gallery-scroll-shell{position:relative;padding-right:24px}
.gallery-scroll-shell .photo-gallery{height:auto;max-height:none;overflow-y:auto;overflow-x:hidden;align-content:start;margin-bottom:0;scrollbar-width:none;overscroll-behavior-y:contain}
.gallery-scroll-shell .photo-gallery::-webkit-scrollbar{display:none}
.gallery-scrollbar{position:absolute;right:0;top:0;bottom:0;width:18px;border-radius:10px;background:#eceeeb;cursor:pointer;touch-action:none}
.gallery-scroll-thumb{position:absolute;top:0;left:3px;right:3px;min-height:44px;border-radius:8px;background:#929a94;cursor:grab}
.gallery-scrollbar:active .gallery-scroll-thumb{cursor:grabbing;background:#606d64}
.gallery-scrollbar:focus-visible,.photo-gallery:focus-visible{outline:2px solid #47534e;outline-offset:3px}
@media(max-width:540px){.gallery-scroll-shell{padding-right:22px}}

/* Clip the journal to a fixed nine-photo window, including before JS loads. */
.gallery-scroll-shell{overflow:hidden;isolation:isolate}
.gallery-scroll-shell .photo-gallery{aspect-ratio:1;grid-auto-rows:calc((100% - 12px)/3);min-height:0;contain:paint;clip-path:inset(0)}
.gallery-scroll-shell .gallery-item{min-height:0;overflow:hidden}
@media(max-width:540px){.gallery-scroll-shell .photo-gallery{grid-auto-rows:calc((100% - 6px)/3)}}

/* Reveal signature text only after its webfont is ready. */
html:not(.signature-ready) .studio h1,html:not(.signature-ready) .services h2,html:not(.signature-ready) .contact h2{opacity:0}

/* Center the footer logo and reduce it to 90% of its previous size. */
footer{display:grid;grid-template-columns:minmax(0,1fr) auto minmax(0,1fr);align-items:center}
footer>.brand{grid-column:2;grid-row:1;justify-self:center}
footer>.brand .logo-window{width:94.5px}
footer>span:nth-child(2){grid-column:1;grid-row:1;justify-self:start}
footer>span:last-child{grid-column:3;grid-row:1;justify-self:end;text-align:right}
@media(max-width:540px){footer>.brand .logo-window{width:81px}footer>span:last-child{grid-column:1/-1;grid-row:2;justify-self:center;text-align:center;max-width:none}footer{gap:18px}}

/* A compact, softly framed contact section centered within the page. */
.contact{width:84%;max-width:1000px;margin:0 auto;padding:30px 36px 32px;background:#f0f2f0;color:var(--ink);border-top:1px solid #dce1dc;border-bottom:1px solid #dce1dc;text-align:center}
.contact .section-label{color:#69736b;margin-bottom:16px}
.contact-grid{grid-template-columns:1fr;gap:18px;justify-items:center}
.contact h2{font-size:clamp(32px,3.1vw,44px);line-height:1.18;text-align:center}
.contact-grid>div{width:100%;max-width:440px}
.contact p{max-width:440px;margin:0 auto 10px;color:#5f6962;font-size:16px;line-height:1.5}
.contact .language{max-width:220px;margin:0 auto;padding-top:8px;border-color:#cbd2cc;color:#69736b;font-size:14px}
@media(max-width:540px){.contact{width:88%;padding:26px 18px 28px}.contact h2{font-size:34px}.contact-grid{gap:16px}.contact .section-label{margin-bottom:14px}}

/* Center the service list beneath its full-width heading. */
.services .service{margin-left:auto;margin-right:auto;width:100%}

/* Subtle fade across project photographs and their enlarged view. */
.gallery-item img,#full-photo{filter:saturate(.94) contrast(.96) brightness(1.02)}

/* Keep the studio identity and navigation visible while scrolling. */
header{position:sticky;top:0;z-index:50;background:#fff;box-shadow:0 0 0 1px #fff}
header::before{content:"";position:absolute;inset:0 -5.556%;background:#fff;z-index:-1;pointer-events:none}
html{scroll-padding-top:108px}
@media(max-width:800px){html{scroll-padding-top:102px}}
@media(max-width:540px){html{scroll-padding-top:96px}}

/* Give the contact introduction room for a single desktop line. */
.contact-grid>div{max-width:none}
.contact .contact-intro{max-width:none;white-space:nowrap}
.contact-details a{text-decoration:underline;text-underline-offset:3px}
@media(max-width:1000px){.contact .contact-intro{white-space:normal;text-wrap:pretty}}

/* Align the service label and match the two main signature headlines. */
.services>.section-label{text-align:center}
.studio.section{max-width:none;width:90%;margin-left:auto;margin-right:auto}
.studio h1,.services h2{font-size:clamp(76px,7.6vw,108px);color:#858b87}
@media(max-width:1100px){.studio h1,.services h2{font-size:clamp(34px,7.6vw,84px)}}
@media(max-width:540px){.studio h1,.services h2{font-size:7.3vw}}

/* Match header and footer logos at every screen size. */
header>.brand .logo-window,footer>.brand .logo-window{width:98.8px}
@media(max-width:800px){header>.brand .logo-window,footer>.brand .logo-window{width:91px}}
@media(max-width:540px){header>.brand .logo-window,footer>.brand .logo-window{width:78px}}
@media(max-width:360px){header>.brand .logo-window,footer>.brand .logo-window{width:67.6px}}

/* Reveal photo captions on hover or keyboard focus. */
.gallery-item figcaption,.gallery-item:first-child figcaption{opacity:0;padding:34px 12px 10px;pointer-events:none;transition:opacity .3s ease}
.gallery-item:hover figcaption,.gallery-item:focus-within figcaption{opacity:1}
@media(prefers-reduced-motion:reduce){.gallery-item figcaption{transition:none}}
.gallery-item figcaption .photo-location{display:block;color:#fff;font-size:12px;margin:4px 0 0}
.gallery-item figcaption>span{display:block;font-size:12px;margin-top:3px;padding-top:0}
#photo-caption{text-align:center;max-width:900px;line-height:1.5}
@media(max-width:540px){.gallery-item figcaption h3,.gallery-item:first-child figcaption h3,.gallery-item figcaption .photo-location{display:none}.gallery-item figcaption>span{font-size:12px}.project-heading{flex-wrap:wrap}.project-heading>p{font-size:14px}}

/* Keep browsing controls clear of the full photograph. */
#full-photo{max-height:calc(100dvh - 210px)}
.photo-navigation{display:flex;align-items:center;justify-content:center;gap:24px;flex-shrink:0}
.photo-navigation button{font:inherit;font-size:24px;line-height:1;min-width:48px;min-height:44px;border:1px solid #6e7971;background:#252b27;color:white;cursor:pointer;border-radius:2px}
.photo-navigation button:hover{background:#414b44}
.photo-navigation button:focus-visible{outline:2px solid #a5b8ac;outline-offset:4px}
#photo-position{min-width:65px;text-align:center;font-size:14px;font-variant-numeric:tabular-nums;color:#e1e5e0}

/* Mobile journal: two columns and a four-row scroll window. */
@media(max-width:767px){
  .gallery-scroll-shell .photo-gallery{grid-template-columns:repeat(2,minmax(0,1fr));aspect-ratio:auto;gap:6px}
  .gallery-scroll-shell .gallery-item{grid-column:auto;grid-row:auto;aspect-ratio:1}
  .gallery-scroll-shell{padding-right:16px}
  .gallery-scrollbar{width:8px;background:#f1f1f3}
  .gallery-scroll-thumb{left:1px;right:1px;background:#a1a1a6}
}
/* White, restrained photo viewer shared across all devices. */
#photo-viewer{background:#fff;color:#1d1d1f;padding:76px 40px 28px;font-family:-apple-system,BlinkMacSystemFont,'Helvetica Neue',Arial,sans-serif}
#photo-viewer::backdrop{background:#fff}
#photo-viewer[open]{gap:18px}
#full-photo{max-height:calc(100dvh - 230px);max-width:100%;object-fit:contain}
#photo-caption{color:#6e6e73;font-size:14px;font-weight:400;line-height:1.6;max-width:800px}
.photo-close{top:max(20px,env(safe-area-inset-top));right:max(24px,env(safe-area-inset-right));width:44px;height:44px;min-height:44px;padding:0;border:0;border-radius:50%;background:#f5f5f7;color:#1d1d1f;font-size:28px;line-height:1;font-weight:300}
.photo-navigation{gap:20px}
.photo-navigation button{border:0;border-radius:50%;background:#f5f5f7;color:#1d1d1f;width:44px;min-width:44px;height:44px;font-size:22px;transition:background .2s ease}
.photo-close:hover,.photo-navigation button:hover{background:#e8e8ed}
.photo-close:focus-visible,.photo-navigation button:focus-visible{outline:2px solid #0071e3;outline-offset:4px}
#photo-position{color:#86868b;font-size:14px;min-width:64px}
@media(max-width:767px){
  #photo-viewer{padding:76px 16px max(24px,env(safe-area-inset-bottom))}
  #photo-viewer[open]{gap:16px}
  #full-photo{max-height:calc(100dvh - 270px)}
  #photo-caption{font-size:14px;max-width:38em}
  .photo-close{right:16px}
}
@media(prefers-reduced-motion:reduce){.photo-navigation button{transition:none}}

/* Shared project selection in navigation and the journal heading. */
.project-picker{position:relative;display:inline-block;text-align:left}
.project-trigger{display:inline-flex;align-items:center;gap:8px;background:none;border:0;color:inherit;font:inherit;cursor:pointer;padding:0;min-height:32px;text-align:inherit}
header .project-trigger{border-bottom:1px solid #8e9690;padding-bottom:5px;letter-spacing:inherit;line-height:1.4;min-height:0}
.picker-chevron{font-family:Arial,sans-serif;font-size:16px;flex-shrink:0;transition:transform .2s}
.project-trigger[aria-expanded=true] .picker-chevron{transform:rotate(180deg)}
.project-options{position:absolute;top:100%;left:0;z-index:40;min-width:220px;padding:8px;background:#fff;border:1px solid #e9e9ec;border-radius:12px;box-shadow:0 12px 36px #00000012}
.project-options[hidden],.project-empty[hidden],.gallery-scroll-shell[hidden],.gallery-more[hidden]{display:none!important}
.project-options button{display:flex;justify-content:space-between;align-items:center;gap:18px;width:100%;min-height:44px;padding:10px 12px;border:0;border-radius:6px;background:none;color:#1d1d1f;font:inherit;font-size:14px;text-align:left;cursor:pointer;letter-spacing:0}
.project-options button:hover,.project-options button[aria-pressed=true]{background:#f5f5f7}
.project-options small{font-size:12px;color:#86868b;white-space:nowrap}
.project-trigger:focus-visible,.project-options button:focus-visible{outline:2px solid #0071e3;outline-offset:3px}
.journal-picker{color:var(--muted);font-size:14px;text-align:right}
.journal-picker .project-options{left:auto;right:0;text-align:left}
.project-empty{min-height:340px;display:flex;flex-direction:column;align-items:center;justify-content:center;background:#fafafa;border:1px solid #eee;text-align:center;padding:40px 20px}
.project-empty h3{font-size:24px;font-weight:400;color:#1d1d1f;margin:0 0 12px}
.project-empty p{color:#86868b;font-size:16px;margin:0}
#projects{scroll-margin-top:120px}
@media(max-width:767px){.journal-picker{max-width:100%}.journal-picker .project-trigger{font-size:14px}.project-heading{flex-wrap:wrap}.project-options{min-width:210px}.project-empty{min-height:360px}}

/* Clear, minimal chevrons for browsing full photographs. */
.photo-navigation{gap:24px}
.photo-navigation button{display:inline-flex;align-items:center;justify-content:center;width:52px;min-width:52px;height:52px;padding:0;background:#e8e8ed;color:#303034;border:0;border-radius:50%;transition:background .18s ease,transform .18s ease}
.photo-navigation button svg{display:block;width:26px;height:26px;fill:none;stroke:currentColor;stroke-width:2.25;stroke-linecap:round;stroke-linejoin:round;pointer-events:none}
.photo-navigation button:hover{background:#d7d7dd;color:#1d1d1f}
.photo-navigation button:active{transform:scale(.95);background:#ccccd2}
#photo-position{color:#6e6e73}
@media(prefers-reduced-motion:reduce){.photo-navigation button{transition:none}}

/* Always-visible Before labels on gallery thumbnails. */
.gallery-item>a{position:relative}
.gallery-item .before-badge{position:absolute;top:8px;left:8px;z-index:2;background:#000;color:#fff;font-family:Arial,Helvetica,sans-serif;font-size:8pt;font-weight:400;line-height:1;letter-spacing:0;width:42px;height:42px;border-radius:50%;display:flex;align-items:center;justify-content:center;padding:0;pointer-events:none}