/* THE HARMONY HOTEL TOKYO - Static website package */
:root{--bg:#fcfaf6;--paper:#fffdf9;--text:#2d2b28;--muted:#706a62;--gold:#b28a4d;--line:#ddd2bf;--soft:#f7f2e9;--max:1200px;--serif:"Times New Roman","Noto Serif JP","Yu Mincho",serif;--jp:"Noto Serif JP","Yu Mincho","Hiragino Mincho ProN",serif}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;color:var(--text);background:var(--bg);font-family:var(--jp);font-size:14px;line-height:2;letter-spacing:.055em}img{display:block;max-width:100%}a{color:inherit;text-decoration:none}.container{max-width:var(--max);margin:auto;padding:0 48px}.header{position:absolute;z-index:10;top:0;left:0;width:100%;height:92px;color:#453f39}.header__inner{height:100%;display:flex;align-items:center;gap:42px}.brand{display:flex;align-items:center;gap:13px;color:#474038;white-space:nowrap}.brand span{font-family:var(--serif);font-size:13px;letter-spacing:.09em;text-align:center;line-height:1.28}.brand small{display:block;font-size:9px;letter-spacing:.34em;margin-top:4px}.navigation{display:flex;align-items:center;justify-content:center;gap:25px;flex:1;font-size:12px}.navigation a.active{color:var(--gold)}.header__actions{display:flex;align-items:center;gap:30px;font-size:12px}.reserve{display:grid;place-content:center;background:var(--gold);color:#fff;width:95px;height:48px;font-size:14px}.hero{position:relative;min-height:650px;background:linear-gradient(90deg,#fff 0%,#fff 27%,rgba(255,255,255,.72) 39%,transparent 59%),var(--paper);overflow:hidden}.hero__photo{position:absolute;right:0;top:0;height:100%;width:min(72%,1080px);background-image:linear-gradient(to bottom,rgba(255,255,255,.03),rgba(255,255,255,.08)),url("images/hero-lobby.jpg");background-size:cover;background-position:center right}.hero__content{position:relative;z-index:2;padding-top:197px}.hero__title{font-size:37px;line-height:1.82;letter-spacing:.17em;margin:0 0 26px}.hero__lead{font-size:14px;line-height:2.15;color:#48433e;margin:0 0 31px}.text-link{display:inline-flex;align-items:center;gap:18px;color:var(--gold);font-size:13px;border-bottom:1px solid var(--gold);padding:0 0 9px}.text-link span{font-size:17px}.booking{position:absolute;z-index:3;bottom:27px;left:50%;transform:translateX(-50%);width:calc(100% - 140px);padding:0;background:rgba(255,253,249,.95);border:1px solid #d8c8ac;display:grid;grid-template-columns:1.25fr 1.25fr 1fr 1fr 152px;height:92px;align-items:center}.booking label{position:relative;display:flex;flex-direction:column;padding:0 32px;border-right:1px solid #e9dfd0;line-height:1.6}.booking label span{font-size:11px;color:#625d56;margin-bottom:8px}.booking strong{font-size:15px;font-weight:400}.booking i{position:absolute;right:21px;bottom:3px;font-style:normal;color:#58524b}.booking button{border:0;background:var(--gold);color:white;height:56px;margin:18px;font-family:var(--jp);font-size:15px;letter-spacing:.14em}.section{padding:58px 0;border-bottom:1px solid var(--line)}.eyebrow{margin:0 0 11px;color:var(--gold);font-family:var(--serif);font-size:12px;letter-spacing:.1em}.section-copy h2,.restaurant h2{font-weight:400;font-size:28px;line-height:1.72;letter-spacing:.13em;margin:0 0 18px}.section-copy>p:not(.eyebrow),.restaurant p:not(.eyebrow){margin:0 0 22px;color:#514d47}.concept__grid{display:grid;grid-template-columns:33% 1fr;gap:55px;align-items:center}.concept__gallery{display:grid;grid-template-columns:1fr 1.02fr;grid-template-rows:1fr 1fr;gap:8px;height:330px}.concept__gallery img{width:100%;height:100%;object-fit:cover}.concept__gallery .gallery-main{grid-row:1/3}.rooms{padding-top:54px;background:#fffdf9}.rooms__grid{display:grid;grid-template-columns:29% 1fr;gap:45px}.rooms__copy h2{font-size:27px}.room-cards{display:grid;grid-template-columns:repeat(3,1fr);gap:19px}.room-card{border:1px solid #e5dac7;background:#fff}.room-card img{width:100%;height:145px;object-fit:cover}.room-card div{padding:14px 18px 17px}.room-card h3{font-weight:400;font-size:14px;letter-spacing:.1em;margin:0 0 5px}.room-card p{font-size:11px;line-height:1.8;color:#5f5951;margin:0 0 9px}.room-card strong{font-family:var(--serif);font-size:16px;color:var(--gold);font-weight:400}.facilities{padding:42px 0 36px}.facilities__grid{display:grid;grid-template-columns:1fr 1.02fr;gap:42px}.facilities__grid>.section-copy{border-right:1px solid var(--line);padding-right:40px}.facilities .section-copy h2,.restaurant h2{font-size:25px}.features{display:flex;justify-content:space-between;align-items:end;margin-top:24px;color:var(--gold);font-family:var(--serif);font-size:28px}.features span{text-align:center}.features small{display:block;color:#534f49;font-family:var(--jp);font-size:9px;font-weight:400;letter-spacing:.08em}.restaurant{display:grid;grid-template-columns:1fr 205px;gap:32px}.restaurant img{width:100%;height:188px;object-fit:cover}.footer{padding:30px 0 18px;background:#fffdf9}.footer__grid{display:grid;grid-template-columns:1.25fr 1.05fr .62fr;gap:45px}.footer ul{list-style:none;margin:0 0 11px;padding:0;font-size:11px;line-height:2.5}.footer time{display:inline-block;width:88px;color:#5e5952}.footer__brand p{font-size:11px;color:#645f57;line-height:2.2;margin:16px 0}.footer__links{display:flex;flex-direction:column;font-size:11px;gap:7px;border-left:1px solid var(--line);padding-left:32px}.social{font-size:15px!important;color:#333!important}.copyright{text-align:right;margin:10px max(calc((100% - var(--max))/2 + 48px),48px) 0 0;font:10px var(--serif);color:#777166}
@media(max-width:980px){.container{padding:0 26px}.navigation{display:none}.header__inner{justify-content:space-between}.hero{min-height:680px}.hero__photo{opacity:.37;width:100%}.booking{position:relative;left:auto;bottom:auto;transform:none;margin:55px 26px 0;width:auto;grid-template-columns:repeat(2,1fr);height:auto;padding:10px}.booking button{grid-column:1/3}.concept__grid,.rooms__grid,.facilities__grid,.footer__grid{display:block}.concept__gallery{margin-top:38px}.rooms__copy{margin-bottom:35px}.facilities__grid>.section-copy{padding:0 0 36px;border:0}.restaurant{padding-top:35px;border-top:1px solid var(--line)}.footer__grid section{margin-bottom:28px}.footer__links{padding:0;border:0}.copyright{margin:0;text-align:center}}
@media(max-width:620px){body{font-size:13px}.header{height:74px}.brand span{font-size:11px}.header__actions span{display:none}.reserve{width:74px;height:42px}.hero__content{padding-top:132px}.hero__title{font-size:27px}.hero{min-height:750px}.booking{grid-template-columns:1fr}.booking label{padding:13px 22px}.booking button{grid-column:auto;width:calc(100% - 28px);margin:14px}.section{padding:42px 0}.section-copy h2,.restaurant h2{font-size:22px}.concept__gallery{height:250px}.room-cards{grid-template-columns:1fr}.room-card img{height:190px}.restaurant{display:block}.restaurant img{margin-top:24px;height:210px}.features{font-size:21px}}