@import url('https://fonts.googleapis.com/css2?family=DM+Sans:wght@300;400;500&family=Noto+Sans+JP:wght@300;400;500;700&display=swap');
:root{--ink:#3a343e;--paper:#f2edf0;--pink:#dfb9b5;--lav:#c8c1db;--line:#b9aeb7}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--paper);color:var(--ink);font-family:'Noto Sans JP',sans-serif;font-weight:300}button{font:inherit;cursor:pointer}a{color:inherit}.skip{position:absolute;left:-9999px;z-index:30}.skip:focus{left:12px;top:12px;background:white;padding:12px}.fiction{background:#4f4853;color:#fff;text-align:center;font-size:10px;line-height:1.7;padding:8px 20px}header{height:83px;padding:0 5%;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid var(--line)}.logo{display:flex;gap:14px;align-items:center;text-decoration:none;font-size:18px;font-weight:500}.logo-mark{width:43px;height:43px;border-radius:50%;border:1px solid;display:grid;place-items:center;font-size:20px}.logo small{display:block;font:10px 'DM Sans',sans-serif;letter-spacing:.16em;margin-top:3px}header nav{display:flex;gap:30px;font-size:11px}header nav a{text-decoration:none}
.hero{min-height:790px;position:relative;overflow:hidden;display:grid;grid-template-columns:1.05fr .95fr}.hero-curve{position:absolute;inset:0;pointer-events:none;z-index:2}.hero-curve svg{width:100%;height:100%}.hero-curve path{fill:none;stroke:#b895aa;stroke-width:1.3;opacity:.8;stroke-dasharray:1300;animation:trace 7s ease-out both}.hero-curve path+path{stroke:#c5b5c8;animation-delay:.7s}@keyframes trace{from{stroke-dashoffset:1300}to{stroke-dashoffset:0}}.hero-left{padding:90px 8% 65px 11%;display:flex;flex-direction:column;align-items:flex-start;position:relative;z-index:3}.hero-left>span,.hero-side,.hero-image span,.space-heading>span,.space-image span,.flow-title>span,.plan-title>span,.note-body>span,.closing>span{font:10px 'DM Sans',sans-serif;letter-spacing:.2em}.hero h1{font-size:clamp(90px,11vw,185px);font-weight:300;line-height:1.35;letter-spacing:-.12em;margin:60px 0 25px}.hero h1 em{font-style:normal;color:#9c889e}.hero-left p{font-size:15px;line-height:2.8;margin:0 0 30px}.hero-left a{font-size:12px;text-decoration:none;border-bottom:1px solid;padding:11px 0;margin-top:auto}.hero-image{position:relative;overflow:hidden;clip-path:ellipse(78% 78% at 100% 50%);background:var(--lav)}.hero-image img{width:100%;height:100%;object-fit:cover;filter:saturate(.7) contrast(.9)}.hero-image span{position:absolute;bottom:35px;right:30px;background:#f2edf0df;padding:10px}.hero-side{position:absolute;right:3%;top:30px;z-index:4;writing-mode:vertical-rl;color:#fff}
.space{display:grid;grid-template-columns:.8fr 1.35fr .45fr;gap:5%;padding:140px 6%;align-items:center}.space-heading{align-self:start}.space h2{font-size:clamp(50px,4vw,70px);font-weight:300;line-height:1.6;letter-spacing:-.12em;margin:30px 0}.space-heading p,.space-caption p{font-size:12px;line-height:2.8;max-width:340px}.space-image{height:600px;position:relative;clip-path:ellipse(72% 65% at 50% 50%)}.space-image img{width:100%;height:100%;object-fit:cover;filter:saturate(.65)}.space-image span{position:absolute;bottom:40px;left:50%;transform:translateX(-50%);background:#f3eff0df;padding:10px;white-space:nowrap}.space-caption{align-self:end}.space-caption b{font-size:clamp(100px,12vw,210px);font-weight:300;line-height:1;color:#d4cbd8}.space-caption p{writing-mode:vertical-rl;height:330px;margin:20px auto 0}
.flow{padding:120px 6% 150px;background:#dfd8e2}.flow-title{max-width:1300px;margin:auto;display:grid;grid-template-columns:.5fr 1.4fr .7fr;gap:35px;align-items:end}.flow h2{font-size:clamp(50px,6vw,100px);font-weight:300;line-height:1.4;letter-spacing:-.12em;margin:0}.flow-title p{font-size:12px;line-height:2.5}.flow-line{max-width:1300px;margin:40px auto 0;height:140px}.flow-line svg{width:100%;height:100%}.flow-line path{fill:none;stroke:#ad849d;stroke-width:2}.flow-scenes{max-width:1300px;margin:auto;display:grid;grid-template-columns:repeat(3,1fr);gap:8%}.flow-scenes article{border-top:1px solid #8e8292;padding-top:20px}.flow-scenes article:nth-child(2){margin-top:45px}.flow-scenes article:nth-child(3){margin-top:90px}.flow-scenes span{font:300 46px 'DM Sans',sans-serif;color:#8e8292}.flow-scenes h3{font-size:20px;font-weight:400;margin:18px 0}.flow-scenes p{font-size:12px;line-height:2.5}
.plan{padding:125px 6%;background:#f7f3f4}.plan-title{max-width:1300px;margin:0 auto 65px;display:grid;grid-template-columns:.45fr 1.4fr .65fr;gap:35px;align-items:end}.plan h2{font-size:clamp(50px,6vw,95px);font-weight:300;letter-spacing:-.12em;line-height:1.45;margin:0}.plan-title p{font-size:12px;line-height:2.5}.plan-layout{max-width:1300px;margin:auto;display:grid;grid-template-columns:.8fr 1.2fr;gap:8%}.group{border-top:1px solid var(--line);padding:28px 0 35px}.group>span{font:10px 'DM Sans',sans-serif;letter-spacing:.2em}.group h3{font-size:20px;font-weight:400;margin:12px 0 24px}.options{display:flex;flex-wrap:wrap;gap:9px}.option{background:transparent;border:1px solid #a59aa7;border-radius:100px;padding:12px 18px;font-size:12px;min-height:45px}.option.active{background:#594e5f;color:white;border-color:#594e5f}.safe{font-size:10px;line-height:2.2}.note{background:#e4dce4;align-self:start}.note-photo{height:390px;overflow:hidden;clip-path:ellipse(82% 84% at 50% 0)}.note-photo img{width:100%;height:100%;object-fit:cover;filter:saturate(.7)}.note-photo img.fade-in{animation:appear .7s ease both}@keyframes appear{from{opacity:.2;transform:scale(1.03)}to{opacity:1;transform:scale(1)}}.note-body{padding:35px 8% 50px}.note h3{font-size:33px;font-weight:300;margin:15px 0 28px}.note dl{margin:0}.note dl div{display:flex;justify-content:space-between;gap:20px;border-top:1px solid #b4a7b8;padding:13px 0;font-size:12px}.note dd{margin:0;text-align:right}.note button{background:transparent;border:1px solid var(--ink);padding:12px 20px;margin-top:22px;font-size:11px;border-radius:100px}.note p{font-size:10px;line-height:2.2}
.closing{text-align:center;padding:140px 20px;background:var(--lav)}.closing h2{font-size:clamp(50px,6vw,95px);font-weight:300;letter-spacing:-.12em;margin:25px 0}.closing p{font-size:12px;line-height:2}.closing a{display:inline-block;border-bottom:1px solid;text-decoration:none;padding:11px;margin-top:24px;font-size:12px}footer{display:flex;justify-content:space-between;padding:25px 5%;background:#4f4853;color:white;font:10px 'DM Sans',sans-serif;letter-spacing:.1em}footer a{text-decoration:none}button:focus-visible,a:focus-visible{outline:3px solid #d47963;outline-offset:3px}
@media(max-width:1000px){.hero{grid-template-columns:1fr}.hero-left{min-height:650px}.hero-image{height:500px;clip-path:ellipse(80% 75% at 50% 50%)}.space{grid-template-columns:1fr 1fr}.space-caption{grid-column:1/-1;display:flex;align-items:center}.space-caption p{writing-mode:horizontal-tb;height:auto}.flow-title,.plan-title{grid-template-columns:1fr 2fr}.flow-title p,.plan-title p{grid-column:2}.plan-layout{grid-template-columns:1fr}.note{max-width:700px}.space-image{height:450px}}
@media(max-width:600px){header{height:68px}.logo{font-size:15px}.logo small{font-size:7px}.logo-mark{width:35px;height:35px}header nav a:not(:last-child){display:none}header nav{font-size:10px}.hero-left{padding:55px 6%;min-height:590px}.hero h1{font-size:80px;margin:50px 0}.hero-left p{font-size:12px;line-height:2.4}.hero-image{height:380px}.hero-side{top:640px}.space{display:block;padding:85px 6%}.space h2{font-size:65px}.space-image{height:420px;margin-top:45px}.space-caption{margin-top:30px}.space-caption b{font-size:90px}.flow{padding:85px 6%}.flow-title,.plan-title{display:block}.flow h2,.plan h2{font-size:60px;margin:20px 0}.flow-line{height:80px}.flow-scenes{display:block}.flow-scenes article,.flow-scenes article:nth-child(2),.flow-scenes article:nth-child(3){margin:25px 0 0}.plan{padding:85px 6%}.plan-title{margin-bottom:40px}.note-photo{height:270px}.note h3{font-size:27px}.closing{padding:100px 20px}footer{flex-direction:column;gap:10px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}.hero-curve path,.note-photo img.fade-in{animation:none}}

/* The first screen pairs the actual room scene with a quiet typographic column. */
.hero{min-height:690px;display:grid;grid-template-columns:minmax(330px,40%) minmax(0,60%);background:#eee9ea;overflow:hidden}
.hero-curve,.hero-side{display:none}
.hero-left{min-width:0;min-height:0;padding:62px clamp(28px,5vw,86px) 56px;justify-content:flex-end;align-items:flex-start;gap:0}
.hero-left>span{color:#706472;line-height:1.6;margin-bottom:auto}
.hero h1{font-size:clamp(72px,8vw,138px);line-height:1.16;letter-spacing:.04em;font-weight:400;margin:35px 0 16px;white-space:nowrap}
.hero-left .hero-lead{font-size:clamp(26px,2.7vw,43px);line-height:1.5;letter-spacing:.04em;margin:0 0 24px;font-weight:300}
.hero-left .hero-copy{font-size:13px;line-height:2.1;margin:0 0 24px;max-width:36em}
.hero-left a{margin:0;padding:8px 0;font-size:13px}
.hero-image{min-width:0;min-height:690px;clip-path:none;background:#cbbdb0}
.hero-image img{display:block;width:100%;height:100%;object-fit:cover;object-position:52% 50%;filter:none}
.hero-image span{bottom:22px;right:22px;background:#f3ede9e8;color:#453b3e;letter-spacing:.07em;font:11px 'Noto Sans JP',sans-serif;padding:8px 12px}
@media(max-width:1000px){.hero{min-height:0;grid-template-columns:1fr}.hero-image{grid-row:1;min-height:0;height:clamp(350px,51vw,490px)}.hero-left{grid-row:2;min-height:0;padding:34px 6% 48px;display:block}.hero-left>span{display:block;margin:0 0 12px}.hero h1{font-size:clamp(64px,10vw,102px);margin:0 0 8px}.hero-left .hero-lead{font-size:clamp(25px,4vw,38px);margin:0 0 13px}.hero-left .hero-copy{font-size:12px;margin:0 0 16px}.hero-image span{bottom:16px;right:16px}}
@media(max-width:600px){.hero-image{height:clamp(330px,94vw,390px)}.hero-left{padding:26px 6% 42px}.hero h1{font-size:clamp(59px,15vw,75px)}.hero-left .hero-lead{font-size:27px;line-height:1.35}.hero-left .hero-copy{font-size:11px;line-height:1.8}.hero-image img{object-position:48% 50%}}