:root{--ink:#0c2019;--deep:#07150f;--paper:#f6f5ef;--white:#fff;--lime:#dfff52;--orange:#ef7d4d;--line:rgba(12,32,25,.16);--serif:"Shippori Mincho",serif;--sans:"Noto Sans JP",sans-serif;--latin:"Manrope",sans-serif}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--paper);color:var(--ink);font:400 16px/1.85 var(--sans)}body.locked{overflow:hidden}a{color:inherit;text-decoration:none}button,input,select,textarea{font:inherit}.header{position:fixed;z-index:30;top:0;left:0;width:100%;display:flex;align-items:center;justify-content:space-between;padding:18px 4vw;color:white;transition:.3s}.header.scrolled{background:rgba(7,21,15,.94);backdrop-filter:blur(12px);box-shadow:0 1px 0 rgba(255,255,255,.12)}.logo{display:flex;align-items:center;gap:12px;line-height:1}.logo img{width:48px;height:48px;object-fit:contain}.logo b{font:700 15px var(--latin);letter-spacing:.16em}.logo small{display:block;margin-top:7px;font:600 9px var(--latin);letter-spacing:.14em;opacity:.68}.header nav{display:flex;align-items:center;gap:28px}.header nav a{font-size:13px;font-weight:600}.header .nav-cta{border:1px solid rgba(255,255,255,.6);border-radius:99px;padding:8px 17px}.menu{display:none;border:0;background:none;color:white}.section-no{font:700 12px var(--latin);letter-spacing:.18em}.hero{min-height:760px;height:100vh;position:relative;display:flex;align-items:center;color:white;background:linear-gradient(90deg,rgba(4,15,11,.86) 0%,rgba(4,15,11,.52) 40%,rgba(4,15,11,.06) 76%),url('../visuals/hero-sapporo-night.webp') center/cover no-repeat}.hero-content{width:min(760px,88vw);margin-left:6vw;padding-top:50px}.eyebrow{font:700 12px var(--latin);letter-spacing:.22em;color:var(--lime)}h1,h2,h3{font-family:var(--serif)}.hero h1{font-size:clamp(54px,7vw,104px);line-height:1.3;font-weight:600;margin:18px 0 28px}.hero h1 em{color:var(--lime);font-style:normal}.hero-content>p:not(.eyebrow){font-size:17px}.circle-link{display:inline-flex;align-items:center;gap:30px;margin-top:25px;font-size:14px;font-weight:700}.circle-link span{display:grid;place-items:center;width:50px;height:50px;background:var(--lime);color:var(--ink);border-radius:50%}.hero-foot{position:absolute;bottom:35px;left:6vw;right:6vw;display:flex;align-items:center;gap:18px;font:600 10px var(--latin);letter-spacing:.18em}.hero-foot i{height:1px;flex:1;background:rgba(255,255,255,.4)}.philosophy{min-height:820px;display:grid;grid-template-columns:1.22fr .78fr;background:var(--deep);color:white}.philosophy-image{min-height:720px;background:linear-gradient(90deg,transparent 65%,rgba(7,21,15,.78)),url('../visuals/family-living.jpg') center/cover no-repeat}.philosophy-copy{padding:100px 6vw 90px 5vw;align-self:center}.philosophy-copy h2,.section-head h2,.quality-photo h2,.company h2,.contact h2{font-size:clamp(40px,5vw,72px);line-height:1.42;margin:20px 0 32px}.philosophy-copy .lead{font-family:var(--serif);font-size:21px;line-height:1.85}.philosophy-copy>p:not(.section-no):not(.lead){color:#bec8c2}.philosophy blockquote{border-left:4px solid var(--lime);margin:42px 0 0;padding-left:22px;font-family:var(--serif);font-size:25px}.properties{padding:120px 5vw 140px;background:var(--paper)}.section-head{display:flex;justify-content:space-between;align-items:flex-end;gap:50px}.section-head>p{max-width:520px;color:#65716b}.filters{display:grid;grid-template-columns:1fr 1fr 1fr 1.2fr auto auto;gap:10px;align-items:end;margin:55px 0 30px;padding:18px;background:white;border:1px solid var(--line);border-radius:14px;box-shadow:0 15px 45px rgba(20,40,32,.06)}.filters label{display:grid;gap:6px}.filters label>span{font-size:12px;font-weight:700}.filters select,.filters input{width:100%;height:48px;border:1px solid var(--line);border-radius:7px;background:var(--paper);padding:0 13px}.filters .check{display:flex;align-items:center;height:48px;padding:0 8px;white-space:nowrap}.filters .check input{width:18px;height:18px}.filters button{height:48px;border:0;background:var(--ink);color:white;border-radius:7px;padding:0 16px;cursor:pointer}.result-head{display:flex;align-items:center;justify-content:space-between;margin-bottom:18px}.result-head p{margin:0}.result-head strong{font:700 26px var(--latin)}.result-head>span{font:600 10px var(--latin);letter-spacing:.17em;color:#7a867f}.building-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:22px}.building-card{background:white;border:1px solid var(--line);border-radius:14px;overflow:hidden;transition:.3s}.building-card:hover{transform:translateY(-5px);box-shadow:0 18px 50px rgba(13,37,29,.12)}.building-visual{height:270px;position:relative;overflow:hidden}.building-visual img{width:100%;height:100%;object-fit:cover;transition:.6s}.building-card:hover .building-visual img{transform:scale(1.035)}.room-count{position:absolute;left:15px;bottom:15px;background:var(--lime);color:var(--ink);border-radius:99px;padding:7px 12px;font-size:12px;font-weight:700}.building-body{padding:24px}.building-area{font:700 11px var(--latin);letter-spacing:.15em;color:#718078}.building-body h3{font-size:27px;margin:5px 0 8px}.building-access{font-size:13px;color:#66736d}.building-summary{display:grid;grid-template-columns:1fr 1fr;border-top:1px solid var(--line);margin-top:20px;padding-top:15px}.building-summary span{display:block;font-size:11px;color:#7e8883}.building-summary strong{font-size:14px}.building-open{width:100%;border:0;border-top:1px solid var(--line);background:white;padding:16px 24px;display:flex;justify-content:space-between;font-weight:700;cursor:pointer}.building-open span{color:var(--orange)}.empty-results{grid-column:1/-1;padding:70px;text-align:center;border:1px dashed var(--line);border-radius:14px}.quality{background:var(--deep);color:white;padding-bottom:120px}.quality-photo{min-height:680px;display:flex;align-items:flex-end;padding:90px 6vw;background:linear-gradient(90deg,rgba(5,18,13,.9),rgba(5,18,13,.18)),url('../visuals/quality-living.webp') center/cover no-repeat}.quality-photo>div{max-width:720px}.quality-photo p:last-child{max-width:560px;color:#d2dbd6}.quality-points{display:grid;grid-template-columns:repeat(4,1fr);padding:0 5vw;margin-top:60px}.quality-points article{padding:0 14px 30px;border-right:1px solid rgba(255,255,255,.14)}.quality-points article:last-child{border:0}.point-image{aspect-ratio:1.18/1;background-image:url('../visuals/quality-illustrations.webp');background-size:200% 200%;margin-bottom:22px;border-radius:8px}.point-image.p1{background-position:0 0}.point-image.p2{background-position:100% 0}.point-image.p3{background-position:0 100%}.point-image.p4{background-position:100% 100%}.quality-points article>span{color:var(--lime);font:700 11px var(--latin)}.quality-points h3{font-size:23px;margin:7px 0}.quality-points p{font-size:14px;color:#b8c3bd}.company{min-height:820px;display:flex;align-items:center;color:white;background:linear-gradient(90deg,rgba(5,17,12,.94) 0%,rgba(5,17,12,.7) 47%,rgba(5,17,12,.12) 80%),url('../visuals/company-studio.webp') center/cover no-repeat}.company-copy{width:min(720px,88vw);margin-left:6vw;padding:90px 0}.company-copy>p:not(.section-no){color:#c4cec9}.company dl{margin-top:40px;border-top:1px solid rgba(255,255,255,.22)}.company dl div{display:grid;grid-template-columns:130px 1fr;padding:15px 0;border-bottom:1px solid rgba(255,255,255,.22)}.company dt{font-size:12px;color:#9eaaa4}.company dd{margin:0}.contact{text-align:center;padding:130px 20px}.contact h2{margin-bottom:16px}.contact>p:not(.section-no){color:#68736e}.contact button{margin-top:28px;border:0;border-bottom:1px solid var(--ink);background:none;padding:12px 4px;font-weight:700;cursor:pointer}.contact button span{margin-left:50px}footer{background:var(--deep);color:white;padding:48px 5vw;display:flex;justify-content:space-between;align-items:flex-end}footer>div{display:flex;gap:28px;align-items:center;font-size:12px}footer small{opacity:.6}.building-modal,.contact-modal{width:min(1120px,94vw);max-height:92vh;border:0;padding:0;background:var(--paper);color:var(--ink);border-radius:14px;box-shadow:0 30px 100px rgba(0,0,0,.5)}dialog::backdrop{background:rgba(3,12,8,.84);backdrop-filter:blur(7px)}.modal-close{position:fixed;z-index:3;right:max(4vw,22px);top:max(4vh,18px);width:44px;height:44px;border:0;border-radius:50%;background:white;font-size:24px;cursor:pointer}.detail-hero{height:400px;position:relative}.detail-hero img{width:100%;height:100%;object-fit:cover}.detail-hero div{position:absolute;inset:auto 0 0;padding:70px 5vw 35px;color:white;background:linear-gradient(transparent,rgba(5,18,13,.9))}.detail-hero h2{font-size:42px;margin:5px 0}.detail-content{padding:45px 5vw 70px}.detail-overview{display:grid;grid-template-columns:1fr 1fr;gap:6vw}.detail-specs{border-top:1px solid var(--line)}.detail-specs div{display:flex;justify-content:space-between;padding:10px 0;border-bottom:1px solid var(--line);font-size:13px}.rooms-title{display:flex;justify-content:space-between;align-items:end;margin:55px 0 15px}.rooms-title h3{font-size:28px;margin:0}.room-list{display:grid;gap:12px}.room-card{display:grid;grid-template-columns:100px 1fr 1fr auto;align-items:center;gap:20px;padding:18px;background:white;border:1px solid var(--line);border-radius:10px}.room-no{font:700 22px var(--latin)}.room-no small{display:block;font:500 10px var(--sans);color:#77817c}.room-plan strong,.room-price strong{display:block}.room-price strong{font:700 20px var(--latin)}.room-price span{font-size:11px;color:#77817c}.room-card button{border:0;border-radius:99px;background:var(--ink);color:white;padding:10px 15px;cursor:pointer}.no-room{padding:35px;background:white;border:1px solid var(--line);text-align:center}.contact-box{padding:60px 7vw}.contact-box h2{font:600 40px var(--serif)}.contact-box form{display:grid;gap:17px}.contact-box label{display:grid;gap:5px;font-size:13px;font-weight:700}.contact-box input,.contact-box textarea{width:100%;border:1px solid var(--line);background:white;padding:12px;border-radius:6px}.form-two{display:grid;grid-template-columns:1fr 1fr;gap:14px}.contact-box form button{justify-self:start;border:0;border-radius:99px;background:var(--ink);color:white;padding:12px 20px;font-weight:700}.contact-box form button span{margin-left:35px}.loading{grid-column:1/-1;padding:60px;text-align:center}
@media(max-width:1050px){.filters{grid-template-columns:repeat(3,1fr)}.building-grid{grid-template-columns:1fr 1fr}.quality-points{grid-template-columns:1fr 1fr;gap:35px}.quality-points article{border:0}.philosophy{grid-template-columns:1fr}.philosophy-image{min-height:560px}.philosophy-copy{padding:80px 7vw}}
@media(max-width:760px){body{font-size:15px}.header{padding:13px 16px}.logo img{width:42px;height:42px}.header nav{position:fixed;inset:0;background:var(--deep);display:flex;flex-direction:column;justify-content:center;transform:translateX(100%);transition:.3s}.header nav.open{transform:none}.menu{z-index:2;display:grid;gap:6px}.menu span{display:block;width:25px;height:1px;background:currentColor}.hero{min-height:680px;background-position:62% center}.hero-content{margin-left:22px}.hero h1{font-size:46px}.hero-content>p:not(.eyebrow){font-size:15px}.hero-content br{display:none}.hero-foot{left:22px;right:22px}.philosophy-image{min-height:430px;background-image:linear-gradient(0deg,rgba(7,21,15,.65),transparent 45%),url('../visuals/family-living.jpg')}.philosophy-copy{padding:64px 22px}.philosophy-copy h2,.section-head h2,.quality-photo h2,.company h2,.contact h2{font-size:37px}.philosophy-copy .lead{font-size:18px}.properties{padding:85px 18px}.section-head{display:block}.section-head>p{margin-top:28px}.filters{grid-template-columns:1fr 1fr;margin-top:35px}.filters .keyword{grid-column:1/-1}.filters button{grid-column:1/-1}.result-head>span{display:none}.building-grid{grid-template-columns:1fr}.building-visual{height:250px}.quality-photo{min-height:580px;padding:65px 22px;background-position:38% center}.quality-points{grid-template-columns:1fr;padding:0 18px}.point-image{aspect-ratio:1.5/1}.company{min-height:720px;background-position:60% center}.company-copy{margin-left:22px;padding-right:22px}.company dl div{grid-template-columns:100px 1fr}.contact{padding:90px 18px}footer{flex-direction:column;align-items:flex-start;gap:30px}.detail-hero{height:300px}.detail-content{padding:30px 20px 50px}.detail-overview{grid-template-columns:1fr}.room-card{grid-template-columns:1fr 1fr;gap:12px}.room-card button{grid-column:1/-1}.form-two{grid-template-columns:1fr}}
.building-tags{display:flex;flex-wrap:wrap;gap:7px;margin-top:24px}.building-tags span{border:1px solid var(--line);border-radius:99px;padding:5px 10px;font-size:12px}.room-card button:disabled{background:#dfe3df;color:#758078;cursor:not-allowed}.room-modal{width:min(1180px,96vw);max-height:94vh;border:0;padding:0;background:var(--paper);color:var(--ink);border-radius:14px;box-shadow:0 30px 100px rgba(0,0,0,.5)}.room-detail-head{padding:46px 5vw 28px;position:relative}.room-detail-head h2{font-size:clamp(38px,5vw,62px);margin:9px 0 2px}.room-detail-head>p:last-child{margin:0;color:#65716b}.room-status{position:absolute;right:5vw;top:52px;padding:6px 13px;border-radius:99px;font-size:13px;font-weight:700}.room-status.available{background:var(--lime)}.room-status.unavailable{background:#e1e5e2;color:#65716b}.room-gallery{padding:0 5vw}.room-main-image{width:100%;aspect-ratio:16/9;max-height:640px;background:#e2e5df;border-radius:12px;overflow:hidden}.room-main-image img{width:100%;height:100%;object-fit:cover}.image-empty{height:100%;display:grid;place-items:center;color:#6b7771}.room-thumbnails{display:grid;grid-template-columns:repeat(8,1fr);gap:7px;margin-top:10px}.room-thumbnails button{padding:0;aspect-ratio:4/3;border:2px solid transparent;border-radius:6px;overflow:hidden;background:#ddd;cursor:pointer}.room-thumbnails button.active{border-color:var(--orange)}.room-thumbnails img{width:100%;height:100%;object-fit:cover}.gallery-note{font-size:12px;color:#738079;text-align:right;margin:7px 0 0}.room-detail-body{display:grid;grid-template-columns:1fr 1fr;gap:6vw;padding:42px 5vw}.room-description{font-family:var(--serif);font-size:19px;line-height:1.9;margin-top:0}.room-conditions{margin:0;border-top:1px solid var(--line)}.room-conditions div{display:flex;justify-content:space-between;gap:20px;padding:11px 0;border-bottom:1px solid var(--line)}.room-conditions dt{color:#6f7b75;font-size:13px}.room-conditions dd{margin:0;text-align:right}.room-conditions dd strong{font:700 21px var(--latin)}.room-detail-action{position:sticky;bottom:0;display:flex;justify-content:space-between;align-items:center;gap:20px;background:var(--deep);color:white;padding:20px 5vw}.room-detail-action div{display:grid}.room-detail-action small{color:#aebbb4}.room-detail-action button{border:0;border-radius:99px;background:var(--lime);color:var(--ink);padding:13px 20px;font-weight:700;cursor:pointer}.room-detail-action button span{margin-left:35px}.room-detail-action>p{margin:0;color:#c3ccc7}@media(max-width:760px){.room-detail-head{padding:38px 20px 20px}.room-status{right:20px;top:24px}.room-gallery{padding:0 14px}.room-main-image{aspect-ratio:4/3}.room-thumbnails{grid-template-columns:repeat(4,1fr)}.room-detail-body{grid-template-columns:1fr;padding:30px 20px}.room-detail-action{padding:16px 20px;align-items:stretch;flex-direction:column}.room-detail-action button{width:100%}}@media(max-width:430px){.filters{grid-template-columns:1fr}.filters .keyword{grid-column:auto}.hero h1{font-size:40px}.hero-foot{display:none}.quality-points{gap:20px}.room-card{grid-template-columns:1fr}.room-card button{grid-column:auto}.room-thumbnails{grid-template-columns:repeat(3,1fr)}.room-detail-head h2{font-size:36px}}
