
/* =========================================================
   FINAL UNIFIED TYPOGRAPHY
   Same font system on PC, tablet and mobile.
   Must load after every other stylesheet.
   ========================================================= */

:root{
  --atlas-en-display:"Cormorant Garamond","Times New Roman",serif;
  --atlas-en-body:"Manrope","Helvetica Neue",Arial,sans-serif;
  --atlas-ja-display:"Shippori Mincho","Yu Mincho","Hiragino Mincho ProN",serif;
  --atlas-ja-body:"Zen Kaku Gothic New","Hiragino Kaku Gothic ProN","Yu Gothic",sans-serif;
}

/* -------------------------
   ENGLISH
   ------------------------- */
html[lang="en"] body,
html[lang="en"] p,
html[lang="en"] li,
html[lang="en"] a,
html[lang="en"] span,
html[lang="en"] small,
html[lang="en"] label,
html[lang="en"] input,
html[lang="en"] select,
html[lang="en"] textarea,
html[lang="en"] button,
html[lang="en"] .button,
html[lang="en"] .eyebrow,
html[lang="en"] .detail-row,
html[lang="en"] .section-social-link,
html[lang="en"] .reserve-instagram-link,
html[lang="en"] .social-group{
  font-family:var(--atlas-en-body)!important;
}

html[lang="en"] h1,
html[lang="en"] h2,
html[lang="en"] h3,
html[lang="en"] h4,
html[lang="en"] blockquote,
html[lang="en"] .lead,
html[lang="en"] .card-content h3,
html[lang="en"] .benefit h3,
html[lang="en"] .reserve-options span{
  font-family:var(--atlas-en-display)!important;
  font-weight:500!important;
}

/* -------------------------
   JAPANESE
   ------------------------- */
html[lang="ja"] body,
html[lang="ja"] p,
html[lang="ja"] li,
html[lang="ja"] a,
html[lang="ja"] span,
html[lang="ja"] small,
html[lang="ja"] label,
html[lang="ja"] input,
html[lang="ja"] select,
html[lang="ja"] textarea,
html[lang="ja"] button,
html[lang="ja"] .button,
html[lang="ja"] .eyebrow,
html[lang="ja"] .detail-row,
html[lang="ja"] .section-social-link,
html[lang="ja"] .reserve-instagram-link,
html[lang="ja"] .social-group{
  font-family:var(--atlas-ja-body)!important;
}

html[lang="ja"] h1,
html[lang="ja"] h2,
html[lang="ja"] h3,
html[lang="ja"] h4,
html[lang="ja"] blockquote,
html[lang="ja"] .lead,
html[lang="ja"] .card-content h3,
html[lang="ja"] .benefit h3,
html[lang="ja"] .reserve-options span{
  font-family:var(--atlas-ja-display)!important;
  font-weight:500!important;
}

/* Roman brand name remains identical in both languages */
.hero-brand-title,
.wordmark,
.scroll-wordmark,
.footer-brand-line,
.footer-brand h2,
.reserve-line-brand{
  font-family:var(--atlas-en-display)!important;
  font-weight:500!important;
}

/* Consistent controls, navigation and labels */
.site-header,
.desktop-nav,
.mobile-menu,
.language-toggle,
.menu-toggle,
.header-cta,
.hero-actions,
.hero-instagram-links,
.detail-row,
.social-links,
.reserve-options small,
.contact-form,
.footer-bottom,
.mobile-sticky-actions{
  font-family:inherit!important;
}

.eyebrow,
.detail-row span,
.section-social-link,
.reserve-instagram-link,
.social-group a,
.reserve-options small,
.footer-bottom,
.mobile-sticky-actions a{
  font-weight:600!important;
}

/* Consistent Japanese rhythm on every screen size */
html[lang="ja"] body{
  font-weight:400!important;
  letter-spacing:.018em;
}

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

html[lang="ja"] h1,
html[lang="ja"] h2,
html[lang="ja"] h3{
  letter-spacing:-.03em!important;
}

/* Consistent English rhythm on every screen size */
html[lang="en"] body{
  font-weight:400!important;
  letter-spacing:.008em;
}

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

html[lang="en"] h1,
html[lang="en"] h2,
html[lang="en"] h3{
  letter-spacing:-.025em!important;
}

/* Hero title uses one identical style in Japanese and English */
.hero-brand-title,
html[lang="ja"] .hero-brand-title,
html[lang="en"] .hero-brand-title{
  font-family:var(--atlas-en-display)!important;
  font-weight:500!important;
  letter-spacing:.01em!important;
}

/* Japanese and English button typography remain visually balanced */
html[lang="ja"] .button,
html[lang="ja"] button{
  letter-spacing:.055em!important;
}

html[lang="en"] .button,
html[lang="en"] button{
  letter-spacing:.09em!important;
}

/* Mobile must use the same families — only sizes may change */
@media(max-width:768px){
  html[lang="en"] body,
  html[lang="en"] p,
  html[lang="en"] a,
  html[lang="en"] span,
  html[lang="en"] button,
  html[lang="en"] input,
  html[lang="en"] select,
  html[lang="en"] textarea{
    font-family:var(--atlas-en-body)!important;
  }

  html[lang="ja"] body,
  html[lang="ja"] p,
  html[lang="ja"] a,
  html[lang="ja"] span,
  html[lang="ja"] button,
  html[lang="ja"] input,
  html[lang="ja"] select,
  html[lang="ja"] textarea{
    font-family:var(--atlas-ja-body)!important;
  }

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

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

  .hero-brand-title,
  .wordmark,
  .footer-brand-line,
  .footer-brand h2,
  .reserve-line-brand{
    font-family:var(--atlas-en-display)!important;
  }
}
