/* Homepage copy refresh. The registered artwork, door and key geometry stay in styles.css. */
.brand-home-page .hero-intro { top: 4.45%; padding-inline: 3%; }
.brand-home-page #hero-title { width: 94%; max-width: 2200px; margin: 0 auto; color: #f7ebd7; font: 700 clamp(22px, 1.95vw, 50px)/1.45 "Noto Serif TC", "Songti TC", "PMingLiU", Georgia, serif; letter-spacing: .06em; text-wrap: balance; text-shadow: 0 2px 10px #0006; }
.brand-home-page #hero-title > span { display: block; }
.brand-home-page .hero-description { margin-top: .7vw; padding-inline: 12px; line-height: 1.65; }
.brand-home-page .hero-message { top: 62.8%; padding-inline: 12px; line-height: 1.6; }
.brand-home-page .hero-message .message-middle { line-height: 1.6; }
.brand-home-page .hero-message .message-second { margin-top: .35vw !important; }
.brand-home-page .message-second strong { font-size: 1.7em; padding-inline: .12em; }
.brand-home-page .soul-mark { top: 74%; }
.brand-home-page .home-invitation-english, .brand-home-page .home-enter-english { display: none; }
.brand-home-page[data-locale="en"] .soul-mark, .brand-home-page[data-locale="en"] .enter-button > img { display: none; }
.brand-home-page[data-locale="en"] .home-invitation-english { display: block; position: absolute; top: 74%; left: 48.875%; transform: translateX(-50%); color: #f7ebd7; font: 500 clamp(48px, 5vw, 128px)/1.1 Georgia, serif; transition: opacity .8s ease, filter .8s ease; }
.brand-home-page[data-locale="en"] .home-enter-english { display: grid; gap: 2px; font: 600 clamp(12px, 1.1vw, 26px)/1.1 Georgia, serif; letter-spacing: .04em; }
.brand-home-page .hero.is-animating .home-invitation-english { opacity: 0; filter: blur(3px); }
.brand-home-page .hero.is-complete .home-enter-english { display: none; }
.brand-home-page .home-afterword { position: relative; padding: 0 5% clamp(60px, 5vw, 128px); color: #f7ebd7; text-align: center; background: #0b1319; }
.brand-home-page .home-reassurance { max-width: 1300px; margin: 0 auto; font-size: clamp(16px, 1.15vw, 28px); font-weight: 600; line-height: 1.9; letter-spacing: .12em; text-wrap: balance; }
.brand-home-page .home-brand-signatures { display: grid; grid-template-columns: 1fr 1.3fr 1fr; align-items: center; gap: clamp(24px, 4vw, 95px); max-width: 950px; margin: clamp(38px, 4vw, 90px) auto 0; }
.brand-home-page .home-brand-tagline { display: grid; justify-items: center; gap: 10px; padding-block: 12px; }
.brand-home-page .home-brand-tagline strong { font-size: clamp(12px, .85vw, 21px); letter-spacing: .14em; }
.brand-home-page .home-brand-tagline em { font-size: clamp(10px, .66vw, 16px); font-weight: 600; letter-spacing: .1em; }
.brand-home-page .home-founder-signature p { margin: 9px 0 0; font-size: clamp(10px, .7vw, 16px); letter-spacing: .08em; line-height: 1.6; }
.brand-home-page .home-signature-artwork { display: grid; place-items: center; min-height: clamp(44px, 3.8vw, 86px); }
.brand-home-page .home-signature-text { display: block; color: #f7ebd7; font-family: "Noto Serif TC", "PMingLiU", Georgia, serif; font-size: clamp(18px, 1.4vw, 29px); font-weight: 500; line-height: 1.65; letter-spacing: .025em; text-wrap: balance; }
.brand-home-page[data-locale="en"] #hero-title { font-family: Georgia, "Times New Roman", serif; font-size: clamp(22px, 2.1vw, 48px); letter-spacing: .01em; }
.brand-home-page[data-locale="en"] #hero-title > span:last-child { font-size: .8em; }
.brand-home-page[data-locale="en"] .hero-description { max-width: 780px; margin-inline: auto; }
.brand-home-page[data-locale="en"] .hero-message { font-size: clamp(12px, .85vw, 20px); letter-spacing: .025em; }

@media (min-width: 768px) and (max-width: 1100px) {
  .brand-home-page .hero-intro { top: 3.5%; }
  .brand-home-page #hero-title { width: 100%; font-size: 22px; letter-spacing: .02em; }
  .brand-home-page .hero-description { margin-top: 10px; }
  .brand-home-page .hero-message { top: 61.9%; font-size: 12px; letter-spacing: .08em; }
  .brand-home-page .hero-message strong { font-size: 1.55em; }
}

@media (max-width: 767px) {
  /* Mobile artwork is already positioned in vw. This trims unused viewport-height
     space below the CTA without moving the registered door or key. */
  .brand-home-page .hero { height: 177.777778vw; min-height: 0; }
  .brand-home-page .hero-intro { top: 16vw; padding-inline: 14px; }
  .brand-home-page #hero-title { width: 100%; font-size: clamp(20px, 4.55vw, 31px); line-height: 1.4; letter-spacing: .025em; }
  .brand-home-page #hero-title > span:last-child { margin-top: 4px; font-size: .9em; }
  .brand-home-page .hero-description { margin-top: 3.2vw; padding-inline: 0; font-size: clamp(13px, 2.7vw, 18px); line-height: 1.65; letter-spacing: .06em; white-space: normal; text-wrap: balance; }
  .brand-home-page .hero-message { top: 100vw; padding-inline: 12px; font-size: clamp(13px, 2.7vw, 18px); letter-spacing: .02em; white-space: normal; text-wrap: balance; }
  .brand-home-page .soul-mark { top: 126vw; }
  .brand-home-page[data-locale="en"] .home-invitation-english { top: 126vw; left: 50.7%; font-size: 12vw; }
  .brand-home-page[data-locale="en"] .home-enter-english { font-size: 12px; }
  .brand-home-page .message-second strong { font-size: 1.45em; }
  .brand-home-page .hero-message .message-second { margin-top: 1.1vw !important; }
  .brand-home-page .home-afterword { padding: 0 24px 58px; }
  .brand-home-page .home-reassurance { font-size: 16px; letter-spacing: .05em; }
  .brand-home-page .home-brand-signatures { grid-template-columns: 1fr 1fr; gap: 28px 16px; margin-top: 32px; }
  .brand-home-page .home-founder-signature { grid-column: 1 / -1; grid-row: 2; }
  .brand-home-page .home-brand-tagline strong { font-size: 12px; }
  .brand-home-page .home-brand-tagline em { font-size: 10px; letter-spacing: .05em; }
  .brand-home-page[data-locale="en"] .hero-intro { top: 17vw; }
  .brand-home-page[data-locale="en"] #hero-title { font-size: clamp(20px, 4.6vw, 32px); line-height: 1.22; }
  .brand-home-page[data-locale="en"] #hero-title > span:last-child { max-width: 490px; margin: 7px auto 0; font-size: .72em; line-height: 1.3; }
  .brand-home-page[data-locale="en"] .hero-description { font-size: clamp(13px, 2.7vw, 17px); line-height: 1.45; max-width: 520px; }
  .brand-home-page[data-locale="en"] .hero-description > span { display: inline; }
  .brand-home-page[data-locale="en"] .hero-description > span + span::before { content: ' '; }
  .brand-home-page[data-locale="en"] .hero-message { font-size: clamp(13px, 2.55vw, 18px); letter-spacing: normal; }
  .brand-home-page[data-locale="en"] .message-second strong { font-size: 1.2em; }
}

@media (max-width: 359px) {
  /* Leave a separate control row below the door CTA, including its longer
     English label. Artwork and key registration remain based on vw above. */
  .brand-home-page .hero { height: calc(190vw + 44px); }
  .brand-home-page[data-locale="en"] .hero-intro { top: 16vw; }
  .brand-home-page .soul-mark { top: 144vw; }
  .brand-home-page[data-locale="en"] .home-invitation-english { top: 144vw; }
  .brand-home-page .enter-button { top: 165vw; }
}