:root { color-scheme: light; --bg:#faf8f4; --ink:#30302f; --muted:#69665f; --accent:#786497; --line:#e3dfd7; }
* { box-sizing:border-box; }
html { scroll-behavior:smooth; scroll-padding-top:35px; }
body { margin:0; background:var(--bg); color:var(--ink); font-family:Arial,Helvetica,sans-serif; -webkit-font-smoothing:antialiased; }
a { color:inherit; text-decoration:none; }
button { font:inherit; cursor:pointer; }
a:focus-visible,button:focus-visible { outline:2px solid var(--accent); outline-offset:6px; }
::selection { background:#e1d8ee; }
.shell { max-width:1500px; margin:auto; padding:0 6%; }
.header { display:flex; justify-content:space-between; align-items:center; height:116px; }
.wordmark { font-family:Georgia,'Times New Roman',serif; font-size:54px; font-style:italic; font-weight:600; letter-spacing:-4px; line-height:1; position:relative; padding-right:7px; }
.wordmark span { color:#9b81b9; margin-left:1px; }
.nav-contact { display:flex; align-items:center; gap:32px; font-size:13px; border:1px solid #d8d2c9; border-radius:50px; padding:13px 20px; transition:background .2s; }
.nav-contact:hover { background:#eee9f2; }
.nav-contact span { font-size:19px; }
.hero { display:grid; grid-template-columns: .95fr 1.05fr; align-items:center; min-height:650px; padding:10px 0 65px; }
.hero-content { z-index:1; padding:20px 0 35px; }
h1,h2 { font-family:Georgia,'Times New Roman',serif; font-weight:400; }
h1 { font-size:clamp(60px,7.1vw,108px); line-height:1.04; letter-spacing:-5px; margin:0 0 29px; }
h1 em,h2 em { color:var(--accent); font-weight:400; }
.hero-description { font-size:16px; line-height:1.8; color:var(--muted); max-width:340px; margin:0 0 30px; }
.text-link { display:inline-flex; gap:34px; align-items:center; padding:8px 0; font-size:13px; border-bottom:1px solid #aaa095; }
.text-link span { font-size:19px; transition:transform .2s; }
.text-link:hover span { transform:translate(3px,-3px); }
.playground { min-width:0; position:relative; margin:0 -5% 0 -6%; }
.sculpture-stage { position:relative; aspect-ratio:1/1; width:100%; }
#sculpture { position:absolute; inset:0; width:100%; height:100%; cursor:grab; touch-action:pan-y; }
#sculpture:active { cursor:grabbing; }
.sculpture-fallback { position:absolute; width:64%; height:64%; left:18%; top:18%; border-radius:46% 54% 64% 36% / 51% 45% 55% 49%; background:conic-gradient(from 30deg,#b6bfe5,#ead8e9,#f3d3af,#bbc7e2,#c8b8dc); box-shadow:inset 20px 10px 30px #ffffff99,inset -22px -22px 40px #9984a96b,0 32px 50px -28px #8e7b9a6b; transform:rotate(-25deg); }
.sculpture-stage.ready .sculpture-fallback { display:none; }
.playground-controls { text-align:center; min-height:68px; position:relative; margin-top:-22px; }
.playground-controls p { font-size:11px; line-height:1.7; color:#76716b; margin:0 0 9px; }
.playground-controls>div { display:flex; justify-content:center; gap:17px; }
.playground-controls button { border:0; background:none; color:#66547d; font-size:11px; padding:6px 4px; }
.playground-controls button:hover { text-decoration:underline; text-underline-offset:4px; }
.playground-controls button span { margin-left:7px; font-size:15px; }
#motion-toggle { color:#76716b; }
.focus { border-top:1px solid var(--line); padding:85px 0 90px; }
.intro { display:grid; grid-template-columns:1fr 1fr; gap:12%; align-items:center; margin-bottom:70px; }
h2 { font-size:clamp(36px,4.1vw,58px); line-height:1.12; letter-spacing:-2px; margin:0; }
.intro>p { color:var(--muted); font-size:15px; line-height:1.9; max-width:455px; margin:0; }
.focus-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:7%; }
.focus-grid article { min-width:0; }
.focus-grid h3 { font-size:19px; font-weight:400; letter-spacing:-.3px; margin:0 0 14px; }
.focus-grid p { color:var(--muted); font-size:13px; line-height:1.85; margin:0; max-width:300px; }
.mini-art { height:56px; width:64px; position:relative; margin-bottom:24px; }
.mini-art i { position:absolute; display:block; }
.art-tech i { width:33px; height:33px; border:1px solid #a18bb6; border-radius:10px; transform:rotate(-20deg); left:2px; top:14px; background:#e7ddee88; }
.art-tech i:nth-child(2) { left:14px; top:8px; background:#e3d7ee88; }
.art-tech i:nth-child(3) { left:26px; top:2px; background:#ebe3f188; }
.art-partners i { width:37px; height:37px; border-radius:50%; border:1px solid #b49c7a; top:6px; left:0; background:#f1e1c85c; }
.art-partners i:nth-child(2) { left:24px; border-color:#929fab; background:#d1e0eb70; }
.art-capital i { border-radius:30px; border:1px solid #99a58a; background:#e1e7d970; height:17px; width:48px; top:28px; left:0; }
.art-capital i:nth-child(2) { top:17px; left:6px; }
.art-capital i:nth-child(3) { top:6px; left:12px; }
.contact { background:#efebf2; border-radius:8px 85px 8px 8px; display:flex; justify-content:space-between; align-items:center; gap:45px; padding:62px 6%; margin:0 0 50px; }
.contact h2 { font-size:clamp(36px,4.1vw,58px); }
.contact p { color:var(--muted); font-size:13px; line-height:1.8; margin:0 0 20px; }
.contact a { display:flex; justify-content:space-between; gap:30px; border-bottom:1px solid #b2a5c0; padding-bottom:12px; font-size:15px; color:#5f4c75; }
.contact a span { font-size:21px; }
footer { display:flex; align-items:center; justify-content:space-between; gap:30px; padding:0 0 34px; }
footer .wordmark { font-size:38px; letter-spacing:-3px; }
.footer-company { margin-left:auto; font-size:10px; line-height:1.8; color:#726c64; }
.footer-company>span:last-child { display:block; font-size:9px; color:#7c766e; }
footer nav { display:flex; gap:22px; font-size:11px; margin-left:30px; color:#69635c; }
footer nav a:hover { text-decoration:underline; text-underline-offset:4px; }
.skip-link { position:fixed; top:10px; left:10px; z-index:10; background:var(--ink); color:#fff; padding:12px; transform:translateY(-180%); }
.skip-link:focus { transform:translateY(0); }
.notice { padding:44px 0; max-width:720px; }
.notice h2 { font-size:36px; margin:0 0 24px; }
.notice h3 { font-size:15px; font-weight:500; margin:26px 0 9px; }
.notice p { font-size:13px; line-height:1.85; color:var(--muted); margin:0; }
.notice p a { color:#6c5286; text-decoration:underline; text-underline-offset:3px; overflow-wrap:anywhere; }
.notice-header { display:flex; justify-content:flex-end; }
.close-notice { border:0; color:var(--ink); background:none; font-size:28px; padding:0 8px; }
dialog { background:var(--bg); color:var(--ink); border:1px solid #d8d0df; border-radius:16px; width:min(620px,calc(100% - 32px)); max-height:86dvh; padding:0; }
dialog::backdrop { background:#37303a55; backdrop-filter:blur(7px); }
dialog .notice { padding:24px 36px 36px; }
body.notice-open { overflow:hidden; }
.not-found { padding:100px 0; }
@media(min-width:1500px) { .hero { min-height:750px; } }
@media(max-width:1000px) { .shell { padding:0 5%; } .hero { min-height:590px; } h1 { letter-spacing:-3px; } .hero-description { font-size:14px; max-width:290px; } .intro { gap:9%; } .contact { padding:45px 5%; gap:25px; } .contact a { font-size:13px; gap:15px; } .playground-controls p { max-width:240px; margin:0 auto 5px; } }
@media(max-width:640px) {
  .shell { padding:0 24px; }
  .header { height:96px; }
  .wordmark { font-size:45px; letter-spacing:-3px; }
  .nav-contact { font-size:11px; gap:20px; padding:10px 15px; }
  .hero { grid-template-columns:1fr; min-height:0; padding:35px 0 32px; }
  .hero-content { padding:10px 0 0; }
  h1 { font-size:clamp(55px,14vw,82px); letter-spacing:-3px; line-height:1.04; margin-bottom:24px; }
  .hero-description { font-size:14px; line-height:1.85; max-width:290px; margin-bottom:19px; }
  .text-link { font-size:12px; }
  .playground { margin:8px -18px 0; }
  .playground-controls { margin-top:-12px; min-height:64px; }
  .playground-controls p { max-width:100%; font-size:10px; }
  .playground-controls button { font-size:10px; }
  .focus { padding:45px 0 55px; }
  .intro { grid-template-columns:1fr; gap:25px; margin-bottom:40px; }
  h2 { font-size:39px; letter-spacing:-1.5px; }
  .intro>p { font-size:14px; line-height:1.85; }
  .focus-grid { grid-template-columns:1fr; gap:32px; }
  .focus-grid article { display:grid; grid-template-columns:55px 1fr; column-gap:20px; }
  .mini-art { grid-row:1/3; margin:0; transform:scale(.8); transform-origin:top left; }
  .focus-grid h3 { font-size:19px; margin:0 0 10px; }
  .focus-grid p { grid-column:2; font-size:13px; max-width:none; }
  .contact { display:block; border-radius:7px 55px 7px 7px; padding:35px 25px; margin-bottom:35px; }
  .contact h2 { font-size:39px; margin-bottom:30px; }
  .contact p { font-size:12px; }
  .contact a { font-size:clamp(11px,3.3vw,14px); gap:9px; overflow-wrap:anywhere; }
  footer { flex-wrap:wrap; gap:23px; }
  footer .wordmark { font-size:36px; }
  footer nav { margin-left:auto; }
  .footer-company { order:3; width:100%; margin-left:0; font-size:9px; }
  .footer-company>span:last-child { font-size:8px; }
  dialog .notice { padding:18px 24px 30px; }
}
@media(prefers-reduced-motion:reduce) { html { scroll-behavior:auto; } *,*::before,*::after { transition:none!important; } }