@font-face{font-family:StudioSans;src:url('/assets/fonts/dm-sans.ttf') format('truetype');font-weight:100 900;font-display:swap}
@font-face{font-family:StudioSerif;src:url('/assets/fonts/newsreader.ttf') format('truetype');font-weight:200 800;font-display:swap}
*{box-sizing:border-box}
html{scroll-behavior:smooth;scroll-padding-top:32px}
body{margin:0;background:var(--paper);color:var(--ink);font-family:StudioSans,Arial,sans-serif;--paper:#f3f4f0;--ink:#202922;--muted:#546056;--line:#ccd3ca;--accent:#315d48;--stage:#dce5dc;--quiet:#e9ede7;--news:#e8e5dc;line-height:1.65;color-scheme:light}
a{color:inherit;text-underline-offset:.28em}a:hover{color:var(--accent)}
a,button,summary{touch-action:manipulation}
a:focus-visible,button:focus-visible,summary:focus-visible{outline:2px solid var(--accent);outline-offset:6px}
button{font:inherit;color:var(--ink);background:transparent;border:1px solid var(--line);padding:8px 14px;border-radius:24px;cursor:pointer;min-height:44px;transition:background .18s,color .18s}
button:hover{background:var(--quiet)}button:active{background:var(--stage)}
.skip{position:absolute;top:-90px;left:20px;background:var(--paper);padding:12px;z-index:3}.skip:focus{top:10px}
.wrap{max-width:1440px;margin:auto;padding:0 5vw}
header{height:90px;display:flex;align-items:center;justify-content:space-between;gap:24px;border-bottom:1px solid var(--line)}
.brand{text-decoration:none;font-size:21px;letter-spacing:-.055em;font-weight:600;white-space:nowrap}
nav{display:flex;align-items:center;gap:32px}nav a{font-size:15px;text-decoration:none;position:relative;padding:10px 0}
nav a:after{content:'';height:1px;background:currentColor;position:absolute;bottom:7px;left:0;right:0;transform:scaleX(0);transform-origin:left;transition:transform .2s}nav a:hover:after{transform:scaleX(1)}nav button{font-size:14px}
.hero{padding:56px 0 62px;display:grid;grid-template-columns:1.08fr 1fr;align-items:center;gap:5vw}
.hero h1{font-family:StudioSerif,Georgia,serif;font-size:clamp(56px,6.2vw,88px);font-weight:400;line-height:.98;letter-spacing:-.035em;margin:0 0 24px}.hero h1 em{font-style:normal;color:var(--accent)}
.hero p{max-width:34ch;font-size:18px;color:var(--muted);margin:0 0 28px}
.button{display:inline-flex;align-items:center;justify-content:space-between;gap:32px;min-height:48px;padding:12px 22px;background:var(--accent);color:#f3f4f0;text-decoration:none;font-size:15px;border-radius:3px;transition:transform .2s,filter .2s}
.button:hover{color:#f3f4f0;filter:brightness(1.12)}.button:active{transform:translateY(2px)}
.button span,.project-link span{display:inline-block;transition:transform .22s}.button:hover span{transform:translateY(3px)}
.hero-art{background:var(--stage);height:470px;position:relative;overflow:hidden;isolation:isolate}
.phone-pair{display:flex;align-items:flex-start;justify-content:center;padding:38px 24px 0;height:415px;overflow:hidden}
.phone-pair img{width:205px;height:auto;display:block;border-radius:24px;box-shadow:0 16px 34px #2029221a;transform:rotate(-8deg);position:relative}.phone-pair .second{width:195px;margin:45px 0 0 -32px;transform:rotate(7deg)}
.art-caption{display:flex;justify-content:space-between;gap:18px;position:absolute;bottom:0;left:0;right:0;min-height:55px;align-items:center;padding:14px 24px;text-decoration:none;font-size:14px;background:var(--stage);border-top:1px solid color-mix(in srgb,var(--ink) 12%,transparent)}.art-caption span{font-weight:500;white-space:nowrap}
.works{border-top:1px solid var(--line);padding:38px 0 76px}.section-heading{display:flex;justify-content:space-between;align-items:baseline;gap:20px;margin-bottom:30px}.section-title{font-size:22px;letter-spacing:-.035em;font-weight:500;margin:0}.section-heading>span{font-size:14px;color:var(--muted)}
.project-grid{display:grid;grid-template-columns:1fr 1fr;gap:36px}
.project-visual,.news-visual{height:400px;position:relative;overflow:hidden;display:flex;align-items:center;justify-content:center;text-decoration:none}
.project-visual{background:var(--stage);padding-top:60px;align-items:flex-start}.project-visual img{height:520px;width:auto;border-radius:22px;box-shadow:0 14px 34px #20292212;display:block;transform:rotate(-4deg);transition:transform .55s cubic-bezier(.2,.7,.2,1)}.project-visual:hover img{transform:translateY(-12px) rotate(0deg)}
.news-visual{background:var(--news);padding:40px}.news-visual img{width:100%;height:auto;display:block;box-shadow:0 16px 30px #20292212;transition:transform .55s cubic-bezier(.2,.7,.2,1)}.news-visual:hover img{transform:scale(1.035)}
.project-title{display:flex;justify-content:space-between;gap:20px;align-items:baseline;margin:24px 0 10px}.project h3{font-family:StudioSerif,Georgia,serif;font-size:36px;font-weight:450;letter-spacing:-.025em;line-height:1.15;margin:0}.project h3 a{text-decoration:none}.project small{font-size:14px;color:var(--muted);white-space:nowrap}
.project p{color:var(--muted);max-width:43ch;font-size:16px;margin:0 0 20px}.project-link{font-size:15px;font-weight:500;text-decoration:none;border-bottom:1px solid var(--line);padding-bottom:4px;display:inline-flex;gap:14px;align-items:center}.project-link:hover{border-color:var(--accent)}.project-link:hover span{transform:translate(2px,-2px)}.project-status{font-size:13px;color:var(--muted);margin-left:18px}
.about{padding:60px 0 76px;border-top:1px solid var(--line);display:grid;grid-template-columns:1fr 2fr;gap:50px}.about h2{font-size:20px;font-weight:500;letter-spacing:-.03em;margin:0}.about p{font-family:StudioSerif,Georgia,serif;font-size:clamp(32px,3.4vw,48px);letter-spacing:-.025em;line-height:1.1;margin:0 0 24px}.about .small{font-family:StudioSans,Arial,sans-serif;font-size:17px;color:var(--muted);letter-spacing:0;max-width:52ch;line-height:1.7;margin-bottom:0}
footer{border-top:1px solid var(--line);padding:28px 0 32px;display:flex;justify-content:space-between;align-items:center;gap:28px;font-size:14px;color:var(--muted)}footer div{display:flex;gap:24px;flex-wrap:wrap}footer a{text-decoration:none}footer a:hover{text-decoration:underline}
.project-hero{padding:56px 0 64px;display:grid;grid-template-columns:1fr 1fr;gap:8vw;align-items:center}.project-hero h1{font-family:StudioSerif,Georgia,serif;font-size:clamp(62px,7vw,96px);letter-spacing:-.04em;line-height:1;font-weight:400;margin:26px 0 20px}.project-hero p{font-size:23px;color:var(--ink);max-width:28ch;line-height:1.4}.project-hero .sub{font-size:17px;color:var(--muted);max-width:38ch;line-height:1.65}.project-hero .not-live{font-size:14px;color:var(--muted);max-width:38ch}
.project-hero .hero-art{height:490px;display:flex;justify-content:center;align-items:flex-start;padding-top:36px}.project-hero .hero-art>img{width:230px;height:auto;border-radius:26px;transform:rotate(-5deg);box-shadow:0 20px 44px #20292218}
.story{display:grid;grid-template-columns:1fr 1fr;gap:8vw;padding:64px 0 72px;border-top:1px solid var(--line);align-items:center}.story h2{font-family:StudioSerif,Georgia,serif;font-size:38px;font-weight:400;letter-spacing:-.025em;line-height:1.15;margin:0 0 16px}.story h2:not(:first-child){margin-top:38px}.story p{color:var(--muted);max-width:44ch;font-size:17px}.story .screens{display:flex;justify-content:center;background:var(--quiet);overflow:hidden;height:470px;padding-top:28px}.screens img{width:210px;height:auto;align-self:flex-start;border-radius:22px;box-shadow:0 12px 24px #20292212}
.details{padding:56px 0 70px;border-top:1px solid var(--line)}.details h2{font-family:StudioSerif,Georgia,serif;font-size:38px;font-weight:400;letter-spacing:-.025em;line-height:1.15;margin:0 0 24px}.details p{color:var(--muted);max-width:67ch;font-size:17px}
.text-page{max-width:740px;margin:0 auto;padding:52px 0 80px}.text-page h1{font-family:StudioSerif,Georgia,serif;font-size:clamp(42px,5vw,64px);font-weight:400;line-height:1.05;letter-spacing:-.03em;margin:28px 0 24px}.text-page h2{font-size:22px;font-weight:500;line-height:1.35;letter-spacing:-.025em;margin:40px 0 12px}.text-page p,.text-page li{color:var(--muted);font-size:17px;line-height:1.75}.text-page .lead{font-size:21px;line-height:1.5;margin-bottom:32px}.text-page .date{font-size:14px}.text-page ul{padding-left:24px}
details{padding:20px 0;border-bottom:1px solid var(--line)}summary{font-weight:500;cursor:pointer;font-size:17px;list-style:none;position:relative;padding-right:34px}summary::-webkit-details-marker{display:none}summary:after{content:'+';position:absolute;right:2px;top:0;font-size:24px;line-height:1.15;font-weight:400;color:var(--muted)}details[open] summary:after{content:'−'}details[open] summary{color:var(--accent)}details p{margin-bottom:0;max-width:64ch}
.back{font-size:14px;text-decoration:none;color:var(--muted)}.back:hover{text-decoration:underline}.contact{padding:28px;background:var(--quiet);margin-top:40px}.contact h2{margin-top:0}.not-live{font-size:14px;color:var(--muted)}
@media(prefers-color-scheme:dark){body{--paper:#1c241f;--ink:#e9eee8;--muted:#b7c4b9;--line:#435247;--accent:#94b69e;--stage:#334439;--quiet:#27332b;--news:#394339;color-scheme:dark}.button,.button:hover{color:#19291f}}
body[data-theme=light]{--paper:#f3f4f0;--ink:#202922;--muted:#546056;--line:#ccd3ca;--accent:#315d48;--stage:#dce5dc;--quiet:#e9ede7;--news:#e8e5dc;color-scheme:light}body[data-theme=dark]{--paper:#1c241f;--ink:#e9eee8;--muted:#b7c4b9;--line:#435247;--accent:#94b69e;--stage:#334439;--quiet:#27332b;--news:#394339;color-scheme:dark}body[data-theme=dark] .button,body[data-theme=dark] .button:hover{color:#19291f}body[data-theme=light] .button,body[data-theme=light] .button:hover{color:#f3f4f0}
@media(max-width:1000px) and (min-width:768px){.hero{gap:32px}.hero h1{font-size:64px}.phone-pair{padding-top:50px}.phone-pair img{width:170px}.phone-pair .second{width:160px}.project-title{flex-direction:column;gap:8px}.news-visual{padding:24px}}
@media(max-width:767px){
html{scroll-padding-top:24px}.wrap{padding:0 24px}header{height:76px;gap:12px}.brand{font-size:19px}nav{gap:18px}nav a{font-size:14px}nav .about-link{display:none}nav button{font-size:13px;padding:8px 12px}
.hero,.project-hero{grid-template-columns:1fr;padding:40px 0 44px;gap:32px}.hero h1{font-size:clamp(50px,13.4vw,68px);line-height:1;margin-bottom:20px}.hero p{font-size:17px;margin-bottom:24px;max-width:34ch}.hero-art{height:380px}.phone-pair{height:326px;padding:30px 16px 0}.phone-pair img{width:165px;border-radius:20px}.phone-pair .second{width:150px;margin:40px 0 0 -40px}.art-caption{padding:14px 16px;font-size:14px;gap:12px}
.section-heading{margin-bottom:24px}.section-title{font-size:22px}.section-heading>span{font-size:12px}.works{padding:28px 0 44px}.project-grid{grid-template-columns:1fr;gap:40px}.project-visual,.news-visual{height:330px}.project-visual{padding-top:32px}.project-visual img{height:480px}.news-visual{padding:24px}.project-title{margin-top:20px;gap:12px}.project h3{font-size:32px}.project small{font-size:13px}.project p{font-size:16px;margin-bottom:16px}.project-status{margin-left:14px}
.about{grid-template-columns:1fr;padding:36px 0 44px;gap:24px}.about p{font-size:37px}.about .small{font-size:16px}footer{align-items:flex-start;flex-direction:column;gap:16px;font-size:13px;padding:24px 0}
.project-hero h1{font-size:64px}.project-hero p{font-size:22px}.project-hero .hero-art{height:400px;padding-top:28px}.project-hero .hero-art>img{width:200px}.story{grid-template-columns:1fr;padding:36px 0 44px;gap:26px}.story h2{font-size:34px}.story p{font-size:16px}.story .screens{height:430px}.screens img{width:190px}.details{padding:36px 0 44px}.details h2{font-size:34px}.details p{font-size:16px}.text-page{padding:36px 0 48px}.text-page h1{font-size:44px}.text-page .lead{font-size:19px}.text-page p,.text-page li{font-size:16px}.contact{padding:22px}
}
@media(max-width:359px){.wrap{padding:0 18px}.brand{font-size:17px}nav{gap:12px}.hero h1{font-size:48px}.project-title{align-items:flex-start;flex-direction:column;gap:6px}.art-caption{font-size:11px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*{transition:none!important;animation:none!important}.button:active{transform:none}.project-visual:hover img,.news-visual:hover img{transform:none}}