:root{--paper:#fff;--ink:#171717;--muted:#696969;--line:#dedede;--margin:clamp(20px,4vw,72px)}*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:30px}body{margin:0;background:var(--paper);color:var(--ink);font:16px/1.6 Arial,Helvetica,sans-serif}a{color:inherit;text-decoration:none}a:focus-visible{outline:2px solid currentColor;outline-offset:6px}.skip{position:fixed;top:-100px;left:20px;padding:12px;background:#111;color:#fff;z-index:5}.skip:focus{top:12px}.header{padding:27px var(--margin);display:flex;justify-content:space-between;align-items:center;gap:24px}.logo{font-size:25px;font-weight:500;letter-spacing:-1px;line-height:1.2}.header nav{display:flex;gap:30px;font-size:14px}.header nav a:hover,footer a:hover{opacity:.55}.banner{position:relative;margin:0 var(--margin);isolation:isolate;background:#262626}.banner-image{display:block;width:100%;height:auto}.banner::after{content:'';position:absolute;inset:0;background:linear-gradient(90deg,#0006,transparent 65%);z-index:0;pointer-events:none}.banner-copy{position:absolute;z-index:1;left:5%;top:50%;transform:translateY(-50%);color:#fff;max-width:43%}.eyebrow{font-size:12px;letter-spacing:.08em;margin:0;text-transform:uppercase}h1{font-size:clamp(36px,5vw,84px);font-weight:400;line-height:1.08;letter-spacing:-.045em;margin:16px 0 22px}.banner-copy>p:not(.eyebrow){font-size:clamp(14px,1.4vw,20px);line-height:1.55;margin:0 0 30px}.banner-link{font-size:14px;border-bottom:1px solid #ffffff99;padding-bottom:6px}.banner-link:hover{border-color:#fff}h2{font-size:clamp(28px,3vw,46px);font-weight:400;letter-spacing:-.035em;line-height:1.2;margin:0}.work{padding:80px var(--margin)}.section-head{display:flex;align-items:baseline;justify-content:space-between;gap:25px;margin-bottom:32px}.section-head>p{font-size:13px;color:var(--muted);margin:0}.photo-grid{columns:2;column-gap:24px}.photo-grid figure{margin:0 0 24px;break-inside:avoid}.photo-grid img{display:block;width:100%;height:auto}.diptych{display:flex;align-items:stretch;gap:6px;width:100%;overflow:hidden}.photo-grid .diptych img{width:0;min-width:0;height:100%;object-fit:contain;align-self:stretch}.about{padding:75px var(--margin);border-top:1px solid var(--line);display:grid;grid-template-columns:1fr 2fr;gap:50px}.about-label .eyebrow{color:var(--muted)}.about-sign{display:none}.about-body h2{margin:0 0 28px}.about-body>p{max-width:730px;color:var(--muted);font-size:17px;margin:18px 0}.about-body>.about-intro{font-size:21px;color:var(--ink)}.expertise{display:grid;grid-template-columns:repeat(3,1fr);gap:24px;margin-top:38px}.expertise>div{border-top:1px solid var(--line);padding-top:18px}.expertise span{font-size:12px;color:var(--muted)}.expertise h3{font-weight:400;font-size:16px;line-height:1.45;margin:14px 0 8px}.expertise p{font-size:14px;color:var(--muted);margin:0}.contact{padding:65px var(--margin);margin:0;border-top:1px solid var(--line);display:flex;justify-content:space-between;gap:45px;align-items:center}.contact .eyebrow{color:var(--muted);margin-bottom:18px}.contact p:not(.eyebrow){font-size:16px;color:var(--muted);max-width:450px;margin-top:20px}.contact-links{min-width:265px;text-align:center}.contact-button{display:block;background:var(--ink);color:#fff;padding:18px 28px;font-size:17px}.contact-button span{display:block;font-size:12px;color:#ccc;margin-top:4px}.contact-button:hover{background:#363636}.instagram-link{display:block;margin-top:20px;font-size:14px}.phone-link{display:block;margin-top:9px;font-size:16px}.instagram-link:hover,.phone-link:hover{text-decoration:underline;text-underline-offset:4px}footer{margin:0 var(--margin);padding:24px 0;border-top:1px solid var(--line);display:flex;gap:25px;color:var(--muted);font-size:12px}footer a{margin-left:auto;font-size:14px}@media(min-width:1900px){body{max-width:2200px;margin:auto}}@media(max-width:900px){.about{grid-template-columns:1fr 3fr;gap:30px}.expertise{grid-template-columns:1fr;gap:22px}.expertise>div{display:grid;grid-template-columns:25px 1fr;gap:6px 12px}.expertise h3{margin:0}.expertise p{grid-column:2}}@media(max-width:650px){.header{padding:23px var(--margin);gap:15px;flex-wrap:wrap}.logo{font-size:22px}.header nav{gap:17px;font-size:13px}.banner-copy{position:relative;max-width:none;left:auto;top:auto;transform:none;padding:26px 24px 31px}.banner::after{display:none}.banner-copy .eyebrow{display:none}.banner-copy h1{font-size:40px;margin:0 0 16px}.banner-copy>p:not(.eyebrow){font-size:16px;margin-bottom:22px}.banner-image{width:100%;height:auto}.work{padding:50px var(--margin)}.section-head{display:block;margin-bottom:25px}.section-head>p{margin-top:12px}.photo-grid{columns:1}.photo-grid figure{margin-bottom:20px}.diptych{gap:4px}.about{display:block;padding:45px var(--margin)}.about-label{margin-bottom:23px}.about-body>.about-intro{font-size:20px}.about-body>p{font-size:16px}.contact{display:block;padding:45px var(--margin)}.contact-links{min-width:0;margin-top:28px}.contact-button{padding:18px}.contact p:not(.eyebrow){max-width:none}footer{flex-wrap:wrap;gap:12px 20px}footer>span:nth-child(2){display:none}}@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}}

@media(min-width:651px){.banner-copy{top:auto;bottom:7%;transform:none}.banner-copy h1{font-size:clamp(32px,4vw,64px);margin:12px 0 16px}.banner-copy>p:not(.eyebrow){margin-bottom:20px}}

/* Graphite editorial layout */
:root{--paper:#1b1c1d;--ink:#f1eee8;--muted:#b5b3af;--line:#404142;--margin:clamp(22px,5vw,96px);color-scheme:dark}
body{font-family:Arial,Helvetica,sans-serif}
.header{padding-top:34px;padding-bottom:34px;align-items:center}
.logo{font-size:clamp(26px,3vw,46px);font-weight:400;letter-spacing:-.065em}
.header nav{gap:clamp(20px,3vw,48px);font-size:14px}
.header nav a{padding:6px 0;border-bottom:1px solid transparent;transition:border-color .2s}
.header nav a:hover{opacity:1;border-color:var(--ink)}
.banner{margin:0 var(--margin);background:#151617}
.banner::after{background:linear-gradient(0deg,#0009,transparent 65%)}
.banner-copy{max-width:60%;left:4%}
.banner-copy .eyebrow{display:none}
.banner-copy h1{font-size:clamp(42px,6.5vw,104px);font-weight:400;letter-spacing:-.06em;line-height:1;margin:0 0 18px}
.banner-copy>p:not(.eyebrow){font-size:clamp(16px,1.3vw,20px);max-width:380px}
.banner-link{font-size:14px}
.work{padding:clamp(64px,8vw,140px) var(--margin)}
.photo-grid{columns:auto;display:grid;grid-template-columns:repeat(12,minmax(0,1fr));gap:clamp(40px,6vw,112px) clamp(20px,3vw,56px);align-items:center}
.photo-grid figure{grid-column:span 6;margin:0;min-width:0}
.photo-grid figure[data-layout="1"]{grid-column:span 7}
.photo-grid figure[data-layout="2"]{grid-column:span 5;padding:9% 0 0 5%}
.photo-grid figure[data-layout="5"],.photo-grid figure[data-layout="8"],.photo-grid figure[data-layout="12"],.photo-grid figure[data-layout="20"]{grid-column:1/-1;width:88%;justify-self:center}
.photo-grid figure[data-layout="8"],.photo-grid figure[data-layout="12"]{width:100%}

.photo-grid img{height:auto}
.diptych{gap:clamp(6px,1vw,16px)}
.about{padding:90px var(--margin);grid-template-columns:1fr 2fr;gap:7vw}
h2{font-size:clamp(34px,4.6vw,72px);letter-spacing:-.05em;line-height:1.08}
.about-body>.about-intro{font-size:clamp(21px,2vw,30px);line-height:1.5}
.about-body>p{max-width:800px;line-height:1.75}
.eyebrow{font-size:14px;letter-spacing:.1em}
.expertise{margin-top:50px;gap:30px}
.expertise span{font-size:14px}
.expertise h3{font-size:17px}
.expertise p{line-height:1.65}
.contact{padding:90px var(--margin);align-items:flex-end}
.contact h2{max-width:700px}
.contact-links{min-width:300px}
.contact-button{background:var(--ink);color:var(--paper);padding:22px 34px;transition:background .2s}
.contact-button span{color:#555;font-size:12px}
.contact-button:hover{background:#d5d1c9}
.instagram-link,.phone-link{font-size:15px}
footer{padding:30px 0;font-size:14px}
@media(max-width:900px){.about{grid-template-columns:1fr 3fr;gap:35px}.contact{gap:30px}.contact-links{min-width:255px}}
@media(max-width:650px){
.header{padding-top:24px;padding-bottom:24px;gap:18px}.logo{font-size:30px}.header nav{font-size:14px;gap:20px}
.banner-copy{max-width:none;padding:28px 22px 32px}.banner-copy h1{font-size:clamp(40px,10vw,62px)}.banner-copy>p:not(.eyebrow){font-size:16px}
.work{padding-top:48px;padding-bottom:60px}.photo-grid{display:flex;flex-direction:column;gap:36px}.photo-grid figure,.photo-grid figure:nth-child(n){width:100%;padding:0}.diptych{gap:6px}
.about{display:block;padding:48px var(--margin)}.about-label{margin-bottom:28px}.about-body>.about-intro{font-size:22px}.expertise{margin-top:32px}
.contact{display:block;padding:48px var(--margin)}.contact-links{min-width:0;margin-top:30px}.contact h2{font-size:42px}footer{font-size:13px}
}
@media(min-width:651px){.photo-grid figure[data-layout="11"],.photo-grid figure[data-layout="19"]{grid-column:1/-1;width:65%;justify-self:center}}

.banner-copy h1{font-size:clamp(30px,4.8vw,76px)}
@media(max-width:650px){.banner-copy h1{font-size:clamp(26px,7.2vw,46px);letter-spacing:-.045em}}

.banner-copy h1{font-size:clamp(26px,3.5vw,60px);line-height:1.12;letter-spacing:-.04em;margin:0;text-wrap:balance}
@media(max-width:650px){.banner-copy h1{font-size:clamp(26px,6.8vw,40px);margin:0}}

@font-face{font-family:Manrope;src:url('/ai-assets/manrope-regular.ttf') format('truetype');font-style:normal;font-weight:400;font-display:swap}
.banner-copy{max-width:88%;color:#f4f4f4}
.banner-copy .eyebrow{display:block;font-family:Manrope,Arial,sans-serif;font-size:14px;font-weight:400;letter-spacing:.14em;color:#c2c5c8;margin:0 0 16px}
.banner-copy h1{font-family:Manrope,Arial,sans-serif;font-size:clamp(28px,3.5vw,60px);font-weight:400;line-height:1.22;letter-spacing:-.025em;color:#f4f4f4;margin:0;text-wrap:initial}
@media(max-width:650px){.banner-copy{max-width:none}.banner-copy .eyebrow{display:block;margin-bottom:14px}.banner-copy h1{font-size:clamp(22px,5.4vw,35px);line-height:1.3}}

.storefronts{padding:0 var(--margin) clamp(60px,8vw,120px)}.storefronts h2{font-family:Manrope,Arial,sans-serif;font-size:clamp(28px,3vw,46px);font-weight:400;color:#f4f4f4;margin:0 0 36px}.storefront-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:clamp(20px,3vw,48px)}.storefront-grid figure{margin:0}.storefront-grid img{display:block;width:100%;height:auto}@media(max-width:650px){.storefront-grid{grid-template-columns:1fr;gap:24px}.storefronts h2{margin-bottom:24px}}

@font-face{font-family:Forum;src:url('/ai-assets/forum-regular.ttf') format('truetype');font-style:normal;font-weight:400;font-display:swap}
.banner-copy{left:4%;max-width:80%}
.banner-copy h1{font-family:Forum,Georgia,serif;font-size:clamp(25px,2.5vw,42px);line-height:1.18;letter-spacing:0;font-weight:400;color:#e2dbd0;text-shadow:0 2px 14px #0007}
.banner-copy .eyebrow{font-family:Manrope,Arial,sans-serif;font-size:20px;line-height:1.3;letter-spacing:.12em;color:#f3eee5;margin:0 0 14px;text-shadow:0 1px 8px #0009}
@media(max-width:650px){.banner-copy{max-width:none;left:auto}.banner-copy h1{font-size:clamp(24px,5.6vw,32px);line-height:1.22}.banner-copy .eyebrow{font-size:20px;margin-bottom:12px}}

@media(min-width:651px){.photo-grid .new-work:last-child{grid-column:1/-1;width:65%;justify-self:center}}

.header{flex-wrap:wrap}.header nav{flex-wrap:wrap;row-gap:8px}.section-head .eyebrow{font-size:14px;letter-spacing:.1em;line-height:1.6}

/* Cross-portfolio navigation */
.header nav{align-items:center}
.header nav a.portfolio-switch{display:inline-flex;align-items:center;justify-content:center;min-height:44px;padding:10px 18px;border:1px solid var(--ink);border-radius:2px;background:var(--ink);color:var(--paper);line-height:1.3;white-space:nowrap;transition:background .2s,color .2s}
.header nav a.portfolio-switch:hover{background:#d5d1c9;border-color:#d5d1c9;opacity:1}

.site-header{
  height:84px;
  padding:0 var(--gutter);
  display:grid;
  grid-template-columns:1fr auto 1fr;
  align-items:center;
  border-bottom:1px solid var(--rule);
  position:relative;
  z-index:10;
  background:rgba(255,255,255,.98)
}
.brand{font-size:clamp(17px,1.45vw,23px);font-weight:600;letter-spacing:-.025em;white-space:nowrap}
.role{font-size:10px;font-weight:600;letter-spacing:.14em;color:var(--muted);white-space:nowrap}
.nav{justify-self:end;display:flex;gap:26px;font-size:10px;font-weight:600;letter-spacing:.1em}
.nav a{position:relative;padding:8px 0}
.nav a:after{content:"";position:absolute;left:0;right:100%;bottom:3px;height:1px;background:var(--ink);transition:right .25s ease}
.nav a:hover:after{right:0}
.menu-toggle{display:none;background:none;border:0;padding:10px 0;width:28px}
.menu-toggle span{display:block;height:1px;background:var(--ink);margin:6px 0}
@media(max-width:900px){.site-header{height:72px;grid-template-columns:1fr auto;padding:0 18px}
.role{display:none}
.nav{display:none;position:absolute;top:72px;left:0;right:0;background:var(--bg);padding:26px 18px 30px;border-bottom:1px solid var(--rule);flex-direction:column;align-items:flex-start;gap:18px;font-size:12px}
.nav.open{display:flex}
.menu-toggle{display:block;justify-self:end}
.brand{font-size:19px}}
.site-header{height:auto;min-height:84px;gap:22px;padding-top:20px;padding-bottom:20px}
.role{font-size:12px;line-height:1.4;font-weight:400;margin:0;letter-spacing:.09em}
.brand{font-weight:400}
.nav{font-size:14px;letter-spacing:.02em;font-weight:400;gap:24px}
.menu-toggle{width:44px;height:44px;padding:10px;cursor:pointer}
.menu-toggle span{transition:transform .2s}
.menu-toggle[aria-expanded="true"] span:first-child{transform:translateY(3.5px) rotate(45deg)}
.menu-toggle[aria-expanded="true"] span:last-child{transform:translateY(-3.5px) rotate(-45deg)}
@media(max-width:1100px){.role{display:none}
.site-header{grid-template-columns:1fr auto}}
@media(max-width:900px){.site-header{min-height:72px;padding:14px 18px}
.nav{top:100%;font-size:16px;gap:6px;padding:14px 18px}
.nav a{width:100%;padding:10px 0}
.brand{font-size:clamp(16px,3.7vw,21px)}}
.nav a[aria-current="page"]:after{right:0}
@media(min-width:901px){.nav{flex-wrap:wrap;row-gap:4px}}
.nav{align-items:center}
.nav a.portfolio-switch{display:inline-flex;align-items:center;justify-content:center;min-height:44px;padding:10px 18px;border:1px solid #171717;border-radius:2px;background:transparent;color:#171717;line-height:1.3;white-space:nowrap;transition:background .2s,color .2s}
.nav a.portfolio-switch:after{display:none}
.nav a.portfolio-switch:hover{background:#f3f3f3;border-color:#171717}
@media(max-width:900px){.nav{align-items:flex-start}
.nav a.portfolio-switch{width:auto;margin:8px 0}}
body{font-family:Manrope,Arial,sans-serif}.banner-copy h1{font-family:Manrope,Arial,sans-serif}
.site-header{--ink:#151515;--bg:#fff;--rule:#e9e9e9;--muted:#7a7a7a;--gutter:clamp(18px,3.1vw,52px);color:#151515;font-family:Manrope,Arial,sans-serif;line-height:1.5}
.site-header button{font:inherit;color:inherit}.site-header a:focus-visible,.site-header button:focus-visible{outline:2px solid currentColor;outline-offset:5px}
.site-header .nav a.portfolio-switch{background:transparent;color:#171717}
@media(min-width:901px){.site-header .menu-toggle{display:none}}

/* A clear AI destination on desktop and mobile. */
.nav a.portfolio-switch,.site-header .nav a.portfolio-switch{background:#171717;color:#fff;border-color:#171717;gap:12px;font-weight:600;letter-spacing:.04em}
.nav a.portfolio-switch:hover,.site-header .nav a.portfolio-switch:hover{background:#363636;color:#fff;border-color:#363636}
.mobile-ai-link{display:none}
@media(max-width:900px){
.site-header{grid-template-columns:minmax(0,1fr) auto auto;gap:12px}
.mobile-ai-link{display:inline-flex;align-items:center;justify-content:center;background:#171717;color:#fff;font-size:11px;letter-spacing:.03em;line-height:1.2;min-height:40px;padding:10px 12px;white-space:nowrap}
}
@media(max-width:380px){.site-header{gap:7px;padding-left:12px;padding-right:12px}.site-header .brand{font-size:14px}.mobile-ai-link{font-size:10px;padding:10px 8px}.site-header .menu-toggle{width:36px}}

/* Room for Home and the two portfolio destinations. */
@media(min-width:901px) and (max-width:1380px){.site-header{grid-template-columns:1fr auto}.site-header .role{display:none}.site-header .nav{gap:16px}}

/* Mobile editorial rhythm: pairs, full-width diptychs and landscape frames. */
@media(max-width:650px){
 :root{--margin:16px}
 .photo-grid,.storefront-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:22px 10px;align-items:center}
 .photo-grid>figure:nth-child(n),.storefront-grid>figure{grid-column:auto;width:100%;padding:0;margin:0;min-width:0}
 .photo-grid>figure.mobile-wide,.storefront-grid>figure.mobile-wide{grid-column:1/-1}
 .photo-grid>figure.mobile-solo,.storefront-grid>figure.mobile-solo{grid-column:1/-1;width:74%;justify-self:center}
 .diptych{gap:5px}
}

/* Editorial diptych with both original frames visible. */
.warehouse-collage{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:clamp(5px,.7vw,12px);margin:0 0 clamp(40px,6vw,112px);align-items:start}
.warehouse-collage img{display:block;width:100%;height:auto;min-width:0}
@media(max-width:650px){.warehouse-collage{gap:5px;margin-bottom:32px}}

/* Subtle zoom within each frame, including individual collage panels. */
.image-frame{display:block;overflow:hidden;min-width:0}
.image-frame>img{transform:scale(1);transform-origin:center;transition:transform .55s cubic-bezier(.2,.65,.3,1)}
.diptych>.image-frame{width:0;min-width:0;height:100%;align-self:stretch}
.photo-grid .diptych .image-frame>img{width:100%;height:100%;object-fit:contain}
@media(hover:hover) and (pointer:fine){.image-frame:hover>img{transform:scale(1.025)}}
@media(prefers-reduced-motion:reduce){.image-frame>img{transition:none}.image-frame:hover>img{transform:none}}

/* Second project: full frames aligned by their original aspect ratios. */
.red-window-series{display:grid;grid-template-columns:1143fr 1151fr;gap:clamp(5px,.7vw,12px);margin:0 auto clamp(32px,4vw,64px);width:88%;align-items:start}
.red-window-series img{display:block;width:100%;height:auto}
@media(max-width:650px){.red-window-series{width:100%;gap:5px;margin-bottom:32px}}

/* Featured projects retain their full frames and individual visual rhythm. */
.featured-series{display:grid;grid-template-columns:var(--pair-columns);gap:clamp(6px,1vw,16px);width:100%;margin:0 auto clamp(32px,4vw,64px);align-items:start}
.featured-series--sea,.featured-series--city{width:88%}
.featured-series img{display:block;width:100%;height:auto}
@media(max-width:650px){.featured-series{width:100%;gap:5px;margin-bottom:28px}}

/* Two coastal campaign frames form a single full-width project. */
.photo-grid>figure.coast-series{grid-column:1/-1;width:100%;padding:0}
.coast-pair{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:clamp(5px,.7vw,12px);align-items:start}
.coast-pair img{display:block;width:100%;height:auto}
@media(min-width:651px){.photo-grid>figure[data-layout="2"],.photo-grid>figure[data-layout="8"]{grid-column:span 6;width:100%;padding:0}}

/* LAST STOP: original, uncropped photographs in equal 3:4 panels. */
.last-stop{margin:0 0 clamp(32px,4vw,64px)}
.last-stop h2{font-size:14px;font-weight:400;line-height:1.6;letter-spacing:.1em;margin:0 0 20px}
.last-stop-pair{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:clamp(6px,1vw,16px);align-items:start}
.last-stop-pair img{display:block;width:100%;height:auto;aspect-ratio:3/4;object-fit:contain;object-position:center top}
@media(max-width:650px){.last-stop-pair{grid-template-columns:minmax(0,1fr);gap:20px}.last-stop h2{margin-bottom:16px}.last-stop{margin-bottom:28px}}
