@import url('https://fonts.googleapis.com/css2?family=DM+Sans:wght@300;400;500&family=Instrument+Serif:ital@0;1&display=swap');

:root{--paper:#f4f0e9;--ink:#241922;--plum:#531b48;--muted:#746b70;--line:#cfc7c4;--white:#fff}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--paper);color:var(--ink);font-family:"DM Sans",Arial,sans-serif;font-weight:300}a{color:inherit;text-decoration:none}img{display:block;width:100%}button{font:inherit}.skip-link{position:fixed;z-index:50;top:12px;left:12px;padding:10px 14px;background:var(--ink);color:var(--paper);transform:translateY(-160%)}.skip-link:focus{transform:none}.site-header{height:88px;display:flex;align-items:center;justify-content:space-between;padding:0 4vw;border-bottom:1px solid var(--line)}.brand{font-family:"Instrument Serif",Georgia,serif;font-size:25px}.site-header nav{display:flex;gap:34px;font-size:12px}.site-header nav a:hover{color:var(--plum)}.menu-button{display:none;border:0;background:none;color:inherit}.hero{min-height:calc(100vh - 88px);display:grid;grid-template-columns:1fr 1fr;gap:7vw;align-items:center;padding:6vw 4vw 7vw}.hero-copy{max-width:700px}.kicker,.section-number{font-size:10px;line-height:1.4;text-transform:uppercase;letter-spacing:.16em;color:var(--muted);font-weight:500}.hero h1{font-family:"Instrument Serif",Georgia,serif;font-size:clamp(65px,7.5vw,122px);font-weight:400;line-height:.88;letter-spacing:-.035em;margin:46px 0 42px}.hero h1 em,.contact h2 em{color:var(--plum);font-weight:400}.hero-intro{max-width:470px;font-size:18px;line-height:1.6;color:var(--muted);margin:0 0 38px}.arrow-link{display:flex;align-items:center;justify-content:space-between;width:180px;padding-bottom:9px;border-bottom:1px solid var(--ink);font-size:12px;font-weight:500}.hero-image{margin:0}.hero-image img{height:min(70vh,760px);min-height:520px;object-fit:cover;object-position:55% center}.hero-image figcaption{margin-top:12px;color:var(--muted);font-size:10px;text-transform:uppercase;letter-spacing:.1em}.intro-section{padding:11vw 8vw;border-top:1px solid var(--line)}.large-copy{max-width:1130px;font-family:"Instrument Serif",Georgia,serif;font-size:clamp(45px,5.5vw,88px);line-height:1.02;letter-spacing:-.025em;margin:70px 0 90px}.services{list-style:none;margin:0;padding:22px 0 0;border-top:1px solid var(--line);display:grid;grid-template-columns:repeat(3,1fr);font-size:11px;text-transform:uppercase;letter-spacing:.12em}.work{padding:8vw 4vw 12vw;background:var(--white)}.section-head{display:flex;justify-content:space-between;align-items:flex-end;margin-bottom:7vw}.section-head h2,.about h2{font-family:"Instrument Serif",Georgia,serif;font-weight:400;font-size:clamp(48px,5vw,78px);line-height:.95;letter-spacing:-.025em;margin:0}.projects{display:grid;grid-template-columns:1fr 1fr;gap:9vw 4vw}.project-image{overflow:hidden;background:#ddd}.project-image.landscape{aspect-ratio:4/3}.project-image.portrait{aspect-ratio:4/5}.project-image img{height:100%;object-fit:cover;transition:transform .7s ease}.project:hover img{transform:scale(1.02)}.project-info{display:grid;grid-template-columns:1fr auto;position:relative;padding-top:18px}.project-info h3{font-family:"Instrument Serif",Georgia,serif;font-size:29px;font-weight:400;margin:0 0 5px}.project-info p{grid-column:1;font-size:10px;text-transform:uppercase;letter-spacing:.11em;color:var(--muted);margin:0}.project-info span{grid-column:2;grid-row:1/3;font-size:10px;color:var(--muted);padding-top:8px}.about{display:grid;grid-template-columns:1fr 1fr;min-height:720px;border-top:1px solid var(--line)}.about-mark{background:#ece6e1;display:flex;align-items:center;justify-content:center;padding:8vw}.about-mark img{max-width:520px;mix-blend-mode:multiply}.about-copy{padding:10vw 8vw;display:flex;flex-direction:column;justify-content:center}.about-copy h2{margin:52px 0 48px}.about-copy>p:not(.section-number){max-width:570px;font-size:16px;line-height:1.75;color:var(--muted);margin:0 0 20px}.contact{background:var(--plum);color:var(--paper);padding:10vw 4vw 4vw}.contact .section-number{color:#cbb9c6}.contact h2{font-family:"Instrument Serif",Georgia,serif;font-size:clamp(62px,8.2vw,132px);line-height:.88;letter-spacing:-.035em;font-weight:400;margin:7vw 0}.contact h2 em{color:var(--paper);opacity:.62}.email{display:flex;justify-content:space-between;align-items:center;border-top:1px solid rgba(255,255,255,.35);border-bottom:1px solid rgba(255,255,255,.35);padding:25px 0;font-size:clamp(18px,2.2vw,32px)}.contact-meta{display:flex;justify-content:space-between;margin-top:80px;font-size:10px;text-transform:uppercase;letter-spacing:.12em;color:#cbb9c6}footer{height:78px;display:flex;align-items:center;justify-content:space-between;padding:0 4vw;background:var(--plum);color:#cbb9c6;border-top:1px solid rgba(255,255,255,.18);font-size:10px;text-transform:uppercase;letter-spacing:.1em}.reveal{opacity:1;transform:none}.js .reveal{opacity:0;transform:translateY(18px);transition:opacity .7s ease,transform .7s ease}.js .reveal.visible{opacity:1;transform:none}
@media(max-width:800px){.site-header{height:72px;padding:0 22px}.menu-button{display:block}.site-header nav{position:fixed;z-index:20;inset:72px 0 auto;background:var(--paper);border-bottom:1px solid var(--line);padding:30px 22px;display:none;flex-direction:column;gap:24px}.site-header nav.open{display:flex}.hero{display:block;padding:80px 22px}.hero h1{font-size:clamp(58px,18vw,88px);margin:36px 0}.hero-image{margin-top:70px}.hero-image img{height:62vh;min-height:440px}.intro-section{padding:100px 22px}.large-copy{margin:50px 0 70px}.services{grid-template-columns:1fr;gap:18px}.work{padding:90px 22px}.section-head{display:block;margin-bottom:65px}.section-head h2{margin-top:30px}.projects{display:block}.project{margin-bottom:80px}.project-image.portrait{aspect-ratio:4/5}.about{grid-template-columns:1fr}.about-mark{min-height:440px;padding:60px}.about-copy{padding:90px 22px}.contact{padding:100px 22px 40px}.contact h2{margin:65px 0}.contact-meta{gap:18px;flex-direction:column;margin-top:60px}footer{padding:0 22px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}.js .reveal{opacity:1;transform:none;transition:none}.project-image img{transition:none}}

/* Dark editorial opening */
.site-header{position:relative;z-index:2;background:#21131f;color:#f4f0e9;border-color:rgba(244,240,233,.18)}
.brand{display:flex;align-items:center;gap:12px;letter-spacing:.01em}.brand-mark{width:27px;height:27px;display:grid;place-items:center;border:1px solid rgba(244,240,233,.45);border-radius:50%;font-family:Georgia,serif;font-size:14px;color:#d7b778}.site-header nav a:hover{color:#d7b778}
.hero{position:relative;background:#21131f;color:#f4f0e9;overflow:hidden;isolation:isolate}
.hero:before{content:"PHOSKY";position:absolute;z-index:-1;left:-.025em;bottom:-.17em;font-family:"Instrument Serif",Georgia,serif;font-size:24vw;line-height:1;color:rgba(244,240,233,.025);letter-spacing:-.05em;pointer-events:none}
.hero:after{content:"";position:absolute;z-index:-1;inset:22px;background:linear-gradient(90deg,rgba(215,183,120,.18),transparent 24%,transparent 76%,rgba(215,183,120,.18)) top/100% 1px no-repeat,linear-gradient(90deg,rgba(215,183,120,.18),transparent 24%,transparent 76%,rgba(215,183,120,.18)) bottom/100% 1px no-repeat;pointer-events:none}
.hero .kicker{color:#c8b8c3}.hero h1{font-size:clamp(67px,7.8vw,128px);text-shadow:0 2px 20px rgba(0,0,0,.12)}.hero h1 em{color:#d7b778}.hero-intro{color:#c8bfc5}.hero .arrow-link{color:#f4f0e9;border-color:rgba(244,240,233,.55)}
.hero-image{position:relative;padding:13px;border:1px solid rgba(215,183,120,.5);box-shadow:18px 18px 0 rgba(83,27,72,.72)}.hero-image:before,.hero-image:after{content:"";position:absolute;width:34px;height:34px;pointer-events:none}.hero-image:before{left:-7px;top:-7px;border-left:1px solid #d7b778;border-top:1px solid #d7b778}.hero-image:after{right:-7px;bottom:-7px;border-right:1px solid #d7b778;border-bottom:1px solid #d7b778}.hero-image img{filter:saturate(.88) contrast(1.04)}.hero-image figcaption{color:#c8b8c3;margin:14px 0 2px 2px}
@media(max-width:800px){.site-header{background:#21131f;color:#f4f0e9}.site-header nav{background:#21131f;border-color:rgba(244,240,233,.18)}.hero{padding-top:72px}.hero:after{inset:12px}.hero h1{font-size:clamp(58px,18vw,88px)}.hero-image{margin-right:10px;box-shadow:10px 10px 0 rgba(83,27,72,.72)}}
