@font-face{font-family:Gantari;src:url(assets/regular.woff2)}@font-face{font-family:Gantari;src:url(assets/bold.woff2);font-weight:800}
:root{--bg:#0f2864;--ink:#f5f4ed;--accent:#0ab4ff;--line:#ffffff35;--card:#f5f4ed;--card-ink:#0f2864;color-scheme:dark;scroll-behavior:smooth;scroll-padding-top:90px}:root[data-look=paper]{--bg:#f0eee5;--ink:#0f2864;--accent:#00749e;--line:#0f28642e;color-scheme:light}:root[data-look=night]{--bg:#111923;--ink:#edf1ec;--accent:#0ab4ff;--card:#1d2b3b;--card-ink:#edf1ec}
*{box-sizing:border-box}body{margin:0;background:var(--bg);color:var(--ink);font:18px/1.5 Gantari,Arial,sans-serif}a{color:inherit;text-decoration:none}button{font:inherit;color:inherit;cursor:pointer}a,button{transition:color .2s,background .2s}a:focus-visible,button:focus-visible{outline:3px solid var(--accent);outline-offset:5px}a:hover{color:var(--accent)}h1,h2,p{margin:0}svg{width:24px;height:24px;fill:none;stroke:currentColor;stroke-width:1.5;flex-shrink:0}header{display:flex;align-items:center;justify-content:space-between;gap:18px;padding:20px 5vw;border-bottom:1px solid var(--line)}.brand{font-size:24px;letter-spacing:-1px;font-weight:800}.brand span{color:var(--accent)}.nav{display:flex;align-items:center;gap:12px;font-size:13px;min-height:44px}.skip{position:absolute;top:-100px;background:var(--bg);padding:15px;z-index:5}.skip:focus{top:0}.eyebrow{font-size:11px;font-weight:800;letter-spacing:.13em}.intro{padding:68px 5vw 52px;max-width:1800px;margin:auto}h1{font-size:clamp(60px,8.7vw,142px);line-height:.93;letter-spacing:-.065em;font-weight:800}h1 em{font-style:normal;color:var(--accent)}.intro h1{margin-top:30px}.intro-bottom{display:flex;justify-content:space-between;gap:40px;align-items:end;margin-top:35px}.intro-bottom p{font-size:17px}.index-link{display:flex;align-items:center;gap:25px;font-size:12px}.projects{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:24px;padding:0 5vw;max-width:1800px;margin:auto}.card{display:flex;flex-direction:column;background:var(--card);color:var(--card-ink);border-radius:10px;overflow:hidden;border:1px solid transparent;transition:transform .25s,border-color .25s}.card:hover{transform:translateY(-4px);color:var(--card-ink);border-color:var(--accent)}.card-top{display:flex;justify-content:space-between;gap:12px;padding:20px 24px;font-size:10px;letter-spacing:.06em;font-weight:800}.status{opacity:.8}.visual{height:280px;margin:0 16px;overflow:hidden;border-radius:4px;display:flex;align-items:center;justify-content:center;position:relative}.visual img{width:100%;height:100%;object-fit:cover;transition:transform .4s}.card:hover img{transform:scale(1.03)}.card-copy{padding:24px;display:flex;flex-direction:column;flex:1}.card h2{font-size:34px;letter-spacing:-.045em;line-height:1.08}.card p{font-size:15px;max-width:48ch;margin-top:13px}.card-cta{display:flex;justify-content:space-between;align-items:center;padding-top:25px;margin-top:auto;font-size:12px;font-weight:800}.city .visual{background:#0ab4ff;color:#0f2864}.city-word{font-size:98px;line-height:.75;letter-spacing:-.08em;font-weight:800;position:relative;transform:rotate(-9deg)}.orbit{position:absolute;width:280px;height:95px;border:1px solid currentColor;border-radius:50%;left:-20px;top:35px;transform:rotate(-30deg)}.container .visual{background:#d9e5c4;color:#243e31}.container-word{font-size:62px;line-height:.95;font-weight:800;letter-spacing:-.05em;border:2px solid currentColor;padding:12px 42px;transform:rotate(4deg);box-shadow:10px 10px 0 #b1c99a}.dinoschaufenster .visual{background:#eedacf;color:#613924}.dino-word{font-size:110px;line-height:.82;font-weight:800;letter-spacing:-.07em;transform:rotate(-5deg)}.dino-word span{display:block;font-size:30px;letter-spacing:.04em}.about{padding:100px 5vw;max-width:1800px;margin:auto;display:grid;grid-template-columns:1fr 1fr;gap:25px 40px}.about>.eyebrow{grid-column:1/-1}.about h2{font-size:clamp(42px,5vw,72px);letter-spacing:-.055em;line-height:1}.about p{max-width:48ch;align-self:center}footer{padding:32px 5vw;border-top:1px solid var(--line);display:flex;justify-content:space-between;gap:40px;font-size:12px}footer strong{font-size:11px;letter-spacing:.05em}footer p{margin-top:8px}.small{max-width:74ch;font-size:11px;opacity:.8}.legal{display:flex;gap:22px;align-items:end}.legal a{padding:10px 0}.detail{max-width:1450px;margin:auto;padding:65px 5vw 85px;min-height:72vh}.detail h1{font-size:clamp(54px,7vw,106px);margin-top:25px;max-width:16ch}.lead{font-size:clamp(21px,2.2vw,30px);max-width:50ch;margin-top:32px}.notice{border-left:3px solid var(--accent);padding:15px 22px;max-width:72ch;font-size:15px;margin-top:35px}.plan-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:35px;margin-top:65px}.plan-grid h2{font-size:27px;line-height:1.1;margin:15px 0}.plan-grid p{font-size:16px}.back{display:inline-flex;gap:15px;align-items:center;margin-top:55px;font-size:14px}.back svg{transform:rotate(180deg)}
@media(max-width:700px){header{padding:12px 5vw;gap:10px}.brand{font-size:19px}.nav{font-size:11px;gap:5px}.nav svg{width:16px}.intro{padding-top:40px}.intro h1{font-size:clamp(46px,10.9vw,76px)}.intro-bottom{display:block}.intro-bottom p{font-size:15px}.index-link{margin-top:22px;justify-content:space-between}.projects{gap:12px}.card-top{padding:12px;display:block;font-size:8px;line-height:1.4}.status{display:block;margin-top:6px;min-height:23px}.visual{height:145px;margin:0 8px}.card-copy{padding:14px 12px}.card h2{font-size:23px;overflow-wrap:anywhere}.card p{font-size:12px;line-height:1.5}.card-cta{font-size:10px;gap:8px}.card-cta svg{width:16px}.city-word{font-size:49px}.orbit{width:150px;height:53px;top:15px;left:-15px}.container-word{font-size:30px;padding:10px 14px;box-shadow:5px 5px 0 #b1c99a}.dino-word{font-size:53px}.dino-word span{font-size:15px}.about{padding-top:65px;padding-bottom:65px;grid-template-columns:1fr}.about p{font-size:16px}footer{display:block}.legal{margin-top:20px}.detail{padding-top:40px}.detail h1{font-size:clamp(43px,10vw,70px)}.plan-grid{grid-template-columns:1fr;gap:30px}.lead{font-size:22px}.notice{font-size:14px}.jano-quick-looks{gap:4px!important}.jano-look-dot{width:25px!important;height:25px!important}}
@media(prefers-reduced-motion:reduce){:root{scroll-behavior:auto}*,*::before,*::after{transition:none!important}.card:hover{transform:none}}
@media(max-width:700px){header{display:grid;grid-template-columns:1fr auto;row-gap:0}header .jano-quick-looks{flex-wrap:nowrap!important}header .nav{grid-column:1/-1;justify-self:end;min-height:30px;white-space:nowrap}.card h2{font-size:clamp(18px,4.4vw,23px);overflow-wrap:normal;hyphens:auto}.schriftzug .visual{background:#80808c}.visual img{object-fit:contain}.city-word{font-size:40px}.container-word{font-size:25px;padding:8px 12px}.dino-word{font-size:46px}.dino-word span{font-size:13px}}
/* Four editorial project covers, built from the actual original work / interactive scene. */
.projects .card{overflow:hidden;border-radius:16px;transition:transform .3s,border-color .3s}.projects .visual{position:relative;isolation:isolate;height:clamp(290px,30vw,480px);margin:0 14px;overflow:hidden;border-radius:10px;background:#102947}.projects .visual img{width:100%;height:100%;object-fit:cover;transition:transform .75s cubic-bezier(.2,.7,.2,1);display:block}.projects .visual::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,transparent 35%,#031523d9);pointer-events:none;z-index:1}.projects .schriftzug .visual img{object-position:50% 49%;transform:scale(1.12)}.projects .city .visual img{object-position:50% 50%;transform:scale(1.03)}.projects .container .visual img{object-position:50% 48%;transform:scale(1.08)}.projects .dinoschaufenster .visual img{object-position:56% 50%;transform:scale(1.12)}.projects .preview-title{position:absolute;left:25px;right:20px;bottom:25px;color:#fff;z-index:2;pointer-events:none}.preview-title span{display:block;font-size:10px;letter-spacing:.13em;margin-bottom:9px;font-weight:600}.preview-title b{display:block;font-size:clamp(30px,3.4vw,57px);line-height:.94;letter-spacing:-.055em;max-width:12ch}.projects .card:hover .visual>img,.projects .card:focus-visible .visual>img{transform:scale(1.17)}.projects .visual .preview-night{position:absolute;inset:0;opacity:0;transition:opacity .7s,transform .75s}.projects .city:hover .preview-night,.projects .city:focus-visible .preview-night{opacity:1}.projects .card:focus-visible{outline:3px solid var(--accent);outline-offset:4px}@media(max-width:700px){.projects .visual{height:215px;margin:0 7px;border-radius:7px}.projects .preview-title{left:12px;right:9px;bottom:15px}.preview-title span{font-size:7px;line-height:1.45;letter-spacing:.07em;margin-bottom:8px}.preview-title b{font-size:clamp(23px,6.2vw,40px)}.projects .container .visual img{object-position:52% 50%;transform:scale(1.04)}.projects .schriftzug .visual img{object-fit:contain;transform:scale(1.1)}.projects .city .visual img{object-position:52% 50%;transform:scale(1)}.projects .dinoschaufenster .visual img{object-position:58% 50%;transform:scale(1.04)}}@media(prefers-reduced-motion:reduce){.projects .visual img,.projects .visual .preview-night{transition:none}.projects .card:hover .visual>img{transform:none}}

@media(max-width:700px){.projects .schriftzug .visual img{object-fit:cover;object-position:49% 47%;transform:scale(1)}.projects .preview-title b{overflow-wrap:normal}}

/* The first project cover is the original, directly usable 3D model. */
.projects .schriftzug:hover{transform:none}.projects .project-model{margin:0 14px;border-radius:10px;flex:none}.projects .project-model .scene-viewport{height:clamp(280px,27vw,390px)}.projects .project-model .scene-topline{top:16px;left:15px;right:15px;font-size:8px;gap:12px}.projects .project-model .scene-toolbar{padding:10px;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:6px}.projects .project-model .scene-toolbar button{font-size:11px;padding:7px 5px;min-height:38px;white-space:nowrap}.projects .project-model .scene-help{font-size:10px;padding:0 12px 10px}.projects .project-model .scene-status{margin:0;bottom:12px;font-size:11px}.projects .project-model .scene-fallback{transform:none;transition:none;object-fit:contain}.projects .model-credit{font-size:10px;line-height:1.5;max-width:56ch;opacity:.78;margin-top:14px}.projects .schriftzug .card-cta{min-height:44px}.projects .schriftzug .card-copy h2 a:hover,.projects .schriftzug .card-cta:hover{text-decoration:underline;text-underline-offset:4px;color:inherit}
@media(max-width:700px){.projects{grid-template-columns:minmax(0,1fr);gap:20px}.projects .project-model{margin:0 10px}.projects .project-model .scene-viewport{height:260px}.projects .project-model .scene-toolbar button{min-height:42px}.projects .card-top{display:flex;align-items:center;padding:16px}.projects .card-top .status{margin:0;min-height:0}.projects .card-copy{padding:20px 16px}.projects .card h2{font-size:28px}.projects .card p{font-size:14px}.projects .card .model-credit{font-size:10px}.projects .visual{height:260px;margin:0 10px}.projects .preview-title b{font-size:36px}.projects .preview-title span{font-size:9px}.projects .card-cta{font-size:12px}.projects .project-model .scene-help{font-size:10px;margin:0}.projects .project-model .scene-status{font-size:11px}}
