:root { --bg:#f0eee8; --ink:#181817; --muted:#6a6963; --line:#cac8c1; --paper:#e5e2da; --accent:#ee5635; }
[data-theme="dark"] { --bg:#151514; --ink:#eeece6; --muted:#a5a39b; --line:#4b4a46; --paper:#222220; --accent:#ff714f; }
* { box-sizing:border-box; }
html { scroll-behavior:smooth; }
body { margin:0; overflow-x:hidden; color:var(--ink); background:var(--bg); font-family:"DM Sans",Arial,sans-serif; -webkit-font-smoothing:antialiased; transition:background-color .35s ease,color .35s ease; }
a { color:inherit; text-decoration:none; } button { color:inherit; font:inherit; } ::selection { color:#fff; background:var(--accent); }
.noise { position:fixed; z-index:9; inset:0; pointer-events:none; opacity:.035; background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 180 180' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.7'/%3E%3C/svg%3E"); }
.shell { width:min(1440px,100%); margin-inline:auto; padding-inline:44px; }
.site-header { display:flex; min-height:104px; align-items:center; justify-content:space-between; }
.monogram { display:grid; width:45px; height:45px; grid-template-columns:1fr 1fr; overflow:hidden; border:1px solid var(--ink); border-radius:50%; font-family:"DM Mono",monospace; font-size:12px; line-height:43px; text-align:center; transition:.25s; }.monogram span+span { border-left:1px solid var(--ink); }.monogram:hover { color:var(--bg); background:var(--ink); transform:rotate(12deg); }.monogram:hover span+span { border-color:var(--bg); }
.header-center { display:flex; align-items:center; gap:11px; color:var(--muted); font-family:"DM Mono",monospace; font-size:10px; letter-spacing:.06em; }.header-center b { color:var(--ink); font-weight:400; }
.tools { display:flex; align-items:center; gap:16px; font-family:"DM Mono",monospace; font-size:11px; }.tools button { border:0; background:transparent; cursor:pointer; padding:5px; }.language-option { padding-bottom:2px; border-bottom:1px solid transparent; }.language-option.is-active { border-color:var(--ink); }.language-separator { margin:0 3px; color:var(--muted); }
.theme-toggle { display:grid; width:30px; height:30px; place-items:center; padding:0!important; border:1px solid var(--line)!important; border-radius:50%!important; font-size:14px; transition:transform .35s,border-color .25s; }.theme-toggle:hover { border-color:var(--ink)!important; transform:rotate(180deg); }.theme-symbol-dark { display:none; } [data-theme="dark"] .theme-symbol-light { display:none; } [data-theme="dark"] .theme-symbol-dark { display:block; }
.project-hero { display:grid; min-height:calc(100svh - 104px); padding-top:clamp(56px,8vw,116px); padding-bottom:50px; grid-template-columns:minmax(0,1fr) minmax(220px,.55fr); align-content:space-between; gap:60px; }
.eyebrow,.index,.detail-label,.fact-list dt,.footer { font-family:"DM Mono",monospace; font-size:10px; letter-spacing:.06em; }.eyebrow { display:flex; align-items:center; gap:9px; margin:0; }.eyebrow-dot { width:7px; height:7px; border-radius:50%; background:var(--accent); }.index { color:var(--muted); }
.project-hero h1 { max-width:1000px; margin:24px 0 0; font-size:clamp(68px,11vw,168px); font-weight:500; letter-spacing:-.085em; line-height:.78; }.project-hero h1 i { color:var(--accent); font-family:"Playfair Display",serif; font-weight:500; }.project-lead { max-width:370px; align-self:end; margin:0; color:var(--muted); font-size:clamp(17px,1.55vw,22px); letter-spacing:-.035em; line-height:1.25; }
.project-rule { height:1px; background:var(--line); }.detail { display:grid; padding-top:clamp(82px,11vw,155px); padding-bottom:clamp(100px,13vw,185px); grid-template-columns:minmax(0,1.28fr) minmax(240px,.6fr); gap:clamp(50px,11vw,170px); }.detail-label { margin:0 0 25px; color:var(--muted); }.detail h2 { max-width:790px; margin:0; font-size:clamp(38px,5.1vw,76px); font-weight:500; letter-spacing:-.07em; line-height:.95; }.detail h2 i { font-family:"Playfair Display",serif; font-weight:500; }.narrative { max-width:640px; margin-top:52px; }.narrative p { margin:0; font-size:clamp(17px,1.7vw,23px); letter-spacing:-.03em; line-height:1.4; }.narrative p+p { margin-top:24px; color:var(--muted); }
.fact-list { margin:0; border-top:1px solid var(--ink); }.fact-list div { display:grid; padding:15px 0; grid-template-columns:110px 1fr; gap:17px; border-bottom:1px solid var(--line); }.fact-list dt { color:var(--muted); }.fact-list dd { margin:0; font-size:14px; line-height:1.4; }
.project-shots { padding-bottom:clamp(85px,10vw,145px); }.shots-heading { display:flex; align-items:baseline; justify-content:space-between; gap:30px; padding-top:10px; border-top:1px solid var(--ink); }.shots-heading .detail-label { margin-top:16px; }.shots-heading > p:last-child { max-width:250px; margin:16px 0 0; color:var(--muted); font-size:13px; line-height:1.4; }.shots-grid { display:grid; margin-top:34px; grid-template-columns:1.35fr .65fr; gap:18px; }.shots-grid--single { grid-template-columns:minmax(0,1fr); }.shots-grid figure { margin:0; }.shots-grid img { display:block; width:100%; border:1px solid var(--line); }.shots-grid figcaption { padding-top:10px; color:var(--muted); font-family:"DM Mono",monospace; font-size:10px; letter-spacing:.05em; }
.project-shots--product .shots-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }.project-shots--product .shot--wide { grid-column:1 / -1; }.project-shots--stacked .shots-grid { grid-template-columns:minmax(0,1fr); }
.project-shots--coremimari .shots-grid { padding:clamp(12px,2vw,27px); background:#171716; }.project-shots--coremimari .site-preview { overflow:hidden; border:1px solid #5d5a50; background:#0d0d0c; }.site-preview-bar { display:flex; align-items:center; justify-content:space-between; min-height:35px; padding:0 12px; border-bottom:1px solid #4d4b44; color:#c2a65a; font-family:"DM Mono",monospace; font-size:9px; letter-spacing:.06em; }.site-preview-bar span:last-child { color:#a4a096; }.project-shots--coremimari img { aspect-ratio:2 / 1; border:0; object-fit:cover; object-position:center bottom; filter:saturate(.82) contrast(1.04); }.project-shots--coremimari figcaption { padding:11px 12px 12px; color:#b8b4aa; }
.project-action { display:flex; align-items:center; justify-content:space-between; gap:25px; padding:27px 0; border-top:1px solid var(--ink); border-bottom:1px solid var(--line); }.project-action p { max-width:380px; margin:0; color:var(--muted); font-size:14px; line-height:1.45; }.action-link { display:inline-flex; align-items:center; gap:15px; flex:none; font-family:"DM Mono",monospace; font-size:11px; letter-spacing:.04em; }.action-link b { display:grid; width:35px; height:35px; place-items:center; border:1px solid var(--ink); border-radius:50%; font-size:18px; font-weight:400; transition:.25s; }.action-link:hover b { color:var(--bg); background:var(--ink); transform:rotate(-45deg); }
.next { padding-top:clamp(90px,10vw,145px); padding-bottom:75px; color:var(--ink); background:var(--paper); }.next-header { display:flex; align-items:end; justify-content:space-between; padding-bottom:25px; border-bottom:1px solid var(--line); }.next-header h2 { margin:0; font-size:clamp(33px,4vw,57px); font-weight:500; letter-spacing:-.06em; }.next-header p { margin:0; color:var(--muted); font-family:"DM Mono",monospace; font-size:10px; }
.next-list { display:grid; grid-template-columns:repeat(3,1fr); }.next-list a { display:flex; min-height:174px; padding:22px 18px; flex-direction:column; justify-content:space-between; border-right:1px solid var(--line); transition:background .25s,color .25s; }.next-list a:first-child { border-left:1px solid var(--line); }.next-list a:hover { color:#fff; background:var(--accent); }.next-number { color:var(--accent); font-family:"DM Mono",monospace; font-size:10px; }.next-list a:hover .next-number { color:#fff; }.next-title { display:flex; align-items:center; justify-content:space-between; gap:12px; font-size:20px; font-weight:500; letter-spacing:-.04em; }.next-title span:last-child { font-size:18px; }
.footer { display:grid; padding-top:20px; padding-bottom:35px; grid-template-columns:1fr auto 1fr; align-items:center; color:var(--muted); }.footer a { justify-self:center; color:var(--ink); }.footer a:last-child { justify-self:end; color:var(--muted); }
@media (max-width:760px) { .shell { padding-inline:20px; }.site-header { min-height:82px; }.header-center { display:none; }.tools { gap:8px; }.project-hero { min-height:720px; padding-top:65px; padding-bottom:35px; grid-template-columns:1fr; gap:28px; }.project-hero h1 { margin-top:18px; font-size:clamp(58px,19vw,82px); }.project-lead { max-width:315px; align-self:auto; font-size:18px; }.detail { padding-top:80px; grid-template-columns:1fr; gap:56px; }.detail h2 { font-size:43px; }.narrative { margin-top:32px; }.narrative p { font-size:18px; }.fact-list div { grid-template-columns:88px 1fr; gap:11px; }.project-shots { padding-bottom:80px; }.shots-heading { display:block; }.shots-grid { grid-template-columns:1fr; margin-top:25px; }.project-action { align-items:flex-start; flex-direction:column; }.next { padding-top:73px; padding-bottom:45px; }.next-header { display:block; }.next-header p { margin-top:12px; }.next-list { grid-template-columns:1fr; }.next-list a,.next-list a:first-child { min-height:100px; border-right:0; border-bottom:1px solid var(--line); border-left:0; }.footer { grid-template-columns:1fr auto; row-gap:20px; }.footer a { justify-self:end; }.footer a:last-child { grid-column:1/-1; justify-self:start; } }
@media (prefers-reduced-motion:reduce) { *,*::before,*::after { scroll-behavior:auto!important; animation-duration:.01ms!important; transition-duration:.01ms!important; } }
