/* =========================================================
   PC HERO / BUILDING / TYPOGRAPHY FINAL REFINEMENT
   Desktop only unless explicitly marked shared.
   ========================================================= */

/* Font system shared across both languages */
:root{
  --font-en-display:"Cormorant Garamond","Times New Roman",serif;
  --font-en-body:"Manrope","Helvetica Neue",Arial,sans-serif;
  --font-ja-display:"Shippori Mincho","Yu Mincho","Hiragino Mincho ProN",serif;
  --font-ja-body:"Zen Kaku Gothic New","Hiragino Kaku Gothic ProN","Yu Gothic",sans-serif;
}

/* English typography */
html[lang="en"] body{
  font-family:var(--font-en-body)!important;
  font-weight:400;
  letter-spacing:.01em;
}

html[lang="en"] h1,
html[lang="en"] h2,
html[lang="en"] h3,
html[lang="en"] blockquote,
html[lang="en"] .lead,
html[lang="en"] .footer-brand-line{
  font-family:var(--font-en-display)!important;
  font-weight:500!important;
}

/* Japanese typography */
html[lang="ja"] body{
  font-family:var(--font-ja-body)!important;
  font-weight:400;
  letter-spacing:.02em;
}

html[lang="ja"] h1,
html[lang="ja"] h2,
html[lang="ja"] h3,
html[lang="ja"] blockquote,
html[lang="ja"] .lead,
html[lang="ja"] .footer-brand-line{
  font-family:var(--font-ja-display)!important;
  font-weight:500!important;
}

/* Brand name always uses the same Roman serif */
.hero-brand-title,
.wordmark,
.footer-brand-line,
.reserve-line-brand{
  font-family:var(--font-en-display)!important;
}

/* Body-copy consistency */
p,
li,
small,
input,
select,
textarea,
button,
.button,
.eyebrow,
.detail-row span,
.section-social-link,
.social-group a{
  font-family:inherit;
}

@media (min-width:769px){

  /* =======================================================
     HERO — vertically and horizontally balanced on desktop
     ======================================================= */
  .hero{
    min-height:100vh!important;
    display:flex!important;
    align-items:center!important;
    justify-content:center!important;
    padding-top:72px!important;
    overflow:hidden!important;
  }

  .hero-content{
    position:relative!important;
    inset:auto!important;
    width:min(1180px,88vw)!important;
    max-width:1180px!important;
    margin:0 auto!important;
    padding:3rem 0 2rem!important;
    transform:translateY(2.5vh);
    text-align:left;
  }

  .hero-brand-title,
  body.ja .hero-brand-title{
    margin:0 0 1.35rem!important;
    font-size:clamp(5.5rem,9.2vw,10rem)!important;
    line-height:.84!important;
    letter-spacing:.012em!important;
    white-space:nowrap!important;
  }

  .hero-brand-subtitle{
    margin-bottom:1.35rem!important;
    font-size:clamp(.88rem,1.05vw,1.08rem)!important;
    font-weight:600!important;
    line-height:1.7!important;
    letter-spacing:.2em!important;
  }

  .hero-brand-statement{
    max-width:720px!important;
    margin-bottom:1.6rem!important;
    font-size:clamp(1.05rem,1.25vw,1.25rem)!important;
    font-weight:450!important;
    line-height:1.9!important;
  }

  html[lang="ja"] .hero-brand-statement{
    font-family:var(--font-ja-display)!important;
    font-weight:500!important;
    line-height:2!important;
    letter-spacing:.035em!important;
  }

  .hero-actions-simple{
    margin-bottom:1.35rem!important;
  }

  .all-instagram-links{
    margin-top:.25rem!important;
  }

  .hero-guest-welcome{
    margin-top:1rem!important;
  }

  /* =======================================================
     DESKTOP TYPE SCALE
     ======================================================= */
  html[lang="en"] h2{
    letter-spacing:-.025em!important;
  }

  html[lang="ja"] h2{
    letter-spacing:-.035em!important;
  }

  html[lang="en"] p{
    line-height:1.85;
  }

  html[lang="ja"] p{
    line-height:2;
  }

  .eyebrow{
    font-size:.78rem!important;
    font-weight:600!important;
    letter-spacing:.13em!important;
  }

  html[lang="ja"] .eyebrow{
    letter-spacing:.09em!important;
  }

  .button{
    font-size:.75rem!important;
    font-weight:600!important;
    letter-spacing:.1em!important;
  }

  html[lang="ja"] .button{
    letter-spacing:.06em!important;
  }

  /* =======================================================
     FINAL BUILDING / RESERVATION IMAGE
     ======================================================= */
  .reserve{
    position:relative!important;
    min-height:88vh!important;
    overflow:hidden!important;
    background:#111!important;
  }

  .reserve-bg,
  .reserve-bg picture,
  .reserve-bg img{
    position:absolute!important;
    inset:0!important;
    width:100%!important;
    height:100%!important;
  }

  .reserve-bg img{
    object-fit:cover!important;
    object-position:center 42%!important;
    transform:none!important;
    animation:none!important;
    filter:brightness(.83) saturate(.96)!important;
    background:transparent!important;
  }

  /* Fallback if image is a direct child */
  .reserve > img{
    position:absolute!important;
    inset:0!important;
    width:100%!important;
    height:100%!important;
    object-fit:cover!important;
    object-position:center 42%!important;
    transform:none!important;
    animation:none!important;
  }

  .reserve::before{
    content:"";
    position:absolute;
    inset:0;
    z-index:1;
    pointer-events:none;
    background:
      linear-gradient(90deg,rgba(0,0,0,.68) 0%,rgba(0,0,0,.34) 44%,rgba(0,0,0,.12) 100%),
      linear-gradient(0deg,rgba(0,0,0,.24),transparent 55%);
  }

  .reserve-content{
    position:relative!important;
    z-index:2!important;
  }
}

/* Keep the approved mobile version intact.
   Only font-family consistency is inherited from shared rules above. */