/* Shared Japanese typography. Loaded after the page/layout styles. */
@media screen {
  :root {
    --font: "Hiragino Sans", "Hiragino Kaku Gothic ProN", "BIZ UDPGothic", "Yu Gothic", Meiryo, "Noto Sans JP", sans-serif;
    --font-brand: "Helvetica Neue", Helvetica, Arial, sans-serif;
    --type-caption: .875rem;
    --type-body: 1rem;
    --type-h3: clamp(1.25rem, 1.05rem + .65vw, 1.5rem);
    --type-h2: clamp(1.75rem, 1.4rem + 1.1vw, 2.25rem);
    --type-h1: clamp(2rem, 1.5rem + 1.5vw, 3rem);
    --type-hero: clamp(1.875rem, 1.45rem + 1.35vw, 2.5rem);
    --leading-body: 1.85;
    --leading-heading: 1.5;
  }
  html { -webkit-text-size-adjust: 100%; text-size-adjust: 100%; }
  body { font-size: var(--type-body); font-weight: 400; line-height: var(--leading-body); letter-spacing: .02em; line-break: strict; word-break: normal; }
  p { line-height: var(--leading-body); }
  h1, h2, h3 { font-weight: 700; line-height: var(--leading-heading); letter-spacing: .02em; overflow-wrap: anywhere; }
  .page-title { font-size: var(--type-h1); font-weight: 700; line-height: var(--leading-heading); letter-spacing: .02em; }
  h2, .access-copy h2, .contact-directory h2, .page-contact h2 { font-size: var(--type-h2); font-weight: 700; line-height: var(--leading-heading); letter-spacing: .02em; }
  .service-preview h3, .product-card h3, .service-item h3, .inquiry-steps h3, .guidance-list h3, #review-title { font-size: var(--type-h3); font-weight: 700; line-height: var(--leading-heading); letter-spacing: .02em; }

  /* Keep the Latin wordmark distinct from Japanese reading text. */
  .brand, .hero-name, .site-footer .footer-brand { font-family: var(--font-brand); }
  .brand { line-height: 1.2; }
  .brand-jp { font-family: var(--font); font-size: var(--type-caption); font-weight: 400; letter-spacing: .02em; line-height: 1.5; }
  .brand .brand-jp { padding-left: 0; border-left: 0; margin-right: 12px; }
  .brand .brand-dot { margin-right: 0; }
  .site-footer .footer-brand { display: inline-flex; align-items: baseline; gap: 0; }
  .site-footer .footer-company-prefix { font-family: var(--font); font-size: var(--type-body); font-weight: 400; line-height: 1.5; letter-spacing: .02em; color: var(--ink); margin-right: 12px; white-space: nowrap; }
  .header-business, .eyebrow { font-size: var(--type-caption); letter-spacing: .02em; }
  .nav-ja { font-size: var(--type-body); font-weight: 700; line-height: 1.5; }
  .nav-en { font-family: var(--font-brand); font-size: var(--type-caption); line-height: 1.4; letter-spacing: .06em; opacity: 1; }
  .site-header #main-nav a { gap: 4px; }
  .menu-button { font-size: var(--type-caption); }

  .hero-subtitle { font-size: var(--type-h3); font-weight: 700; line-height: 1.5; letter-spacing: .06em; }
  .hero-subtitle span { font-size: var(--type-caption); letter-spacing: .04em; }
  .hero-copy .hero-subtitle { margin: 0 0 12px; }
  .hero-reading { display: block; margin-top: 14px; font-size: var(--type-caption); line-height: 1.5; font-weight: 400; letter-spacing: .04em; color: var(--muted); }
  .hero-description { font-size: var(--type-hero); font-weight: 700; line-height: 1.6; letter-spacing: .02em; }
  .hero-detail, .page-lead, .service-overview, .business-scope, .service-item p, .service-item li, .service-preview p, .product-description, .section-intro, .inquiry-steps p, .guidance-list p, .news-row, .form-intro, .faq-list p, .faq-list summary, .page-contact p {
    font-size: var(--type-body); line-height: var(--leading-body); letter-spacing: .02em;
  }
  .service-overview, .page-lead, .business-scope, .service-item p { max-width: 48em; }
  .hero-detail br { display: none; }
  .hero-detail { max-width: 25em; }
  .hero-bottom, .hero-visual figcaption, .breadcrumbs, .product-category, .product-model, .product-note p, .news-row time, .profile-note, .address-block>span, .access-map figcaption, .contact-label, .form-explanation, .field-help, .form-data-note, .copy-draft p, .contact-directory-grid p {
    font-size: var(--type-caption); line-height: 1.8; letter-spacing: .02em;
  }
  .hero-visual figcaption { flex-wrap: wrap; row-gap: 8px; }
  .hero-visual figcaption a { flex-shrink: 0; }
  .button, .access-actions .button, .text-button, .hero-actions .text-button, .product-inquiry, .inquiry-cta { font-size: var(--type-body); font-weight: 700; line-height: 1.5; letter-spacing: .02em; }
  .text-button { min-height: 44px; }
  .button { min-height: 52px; }
  .hero-actions { flex-wrap: wrap; }
  .hero-actions .button { gap: 24px; }
  .profile-row, .profile-row dt, .profile-row dd, .review-values dt, .review-values dd, .address-block p, .business-hours { font-size: var(--type-body); line-height: var(--leading-body); }
  .profile-row dt, .review-values dt { font-weight: 700; }
  .profile-row dd, .review-values dd { min-width: 0; overflow-wrap: anywhere; }
  .profile-row { padding: 23px 0; }
  .address-block>span { color: #fff; }
  .hours-label { flex: 0 0 auto; white-space: nowrap; }
  .contact-directory-grid .contact-phone { font-size: clamp(1.75rem, 1.5rem + .7vw, 2rem); font-weight: 700; letter-spacing: .02em; }
  .contact-directory-grid .contact-email { font-size: clamp(1.125rem, 1rem + .45vw, 1.5rem); font-weight: 700; letter-spacing: 0; }
  .contact-directory-grid .contact-label { font-weight: 700; }

  .field label { font-size: var(--type-body); font-weight: 700; line-height: 1.6; gap: 10px; }
  .field input, .field textarea, .field select { font-family: var(--font); font-size: var(--type-body); font-weight: 400; line-height: 1.7; letter-spacing: .02em; min-height: 52px; }
  .required-label, .optional-label { font-size: var(--type-caption); font-weight: 700; line-height: 1.5; padding: 2px 7px; letter-spacing: .02em; }
  .required-label { color: #fff; background: #d00000; }
  .form-data-note, .copy-draft p { max-width: 48em; }
  .field { margin-bottom: 28px; }
  .footer-company, .footer-company .business-hours, .footer-links a, .back-top, .footer-bottom p { font-size: var(--type-caption); line-height: 1.8; letter-spacing: .02em; }
  .footer-company strong { font-size: var(--type-body); font-weight: 700; }
  .footer-company>a { overflow-wrap: anywhere; max-width: 100%; }
  .footer-links a { min-height: 44px; }
  .toast { font-size: var(--type-body); line-height: 1.7; }
  .news-row { grid-template-columns: 130px 1fr 20px; }
  .split-heading>.text-button { flex-shrink: 0; }
  @media (min-width: 761px) and (max-height: 800px) {
    .hero-copy { padding-top: 24px; padding-bottom: 20px; }
    .hero-copy h1 { margin-top: 16px; }
    .hero-name { font-size: clamp(6rem, 8vw, 8rem); }
    .hero-subtitle { margin-top: 10px; }
    .hero-description { margin-top: 16px; font-size: 2rem; line-height: 1.5; }
    .hero-detail { margin-top: 8px; }
    .hero-actions { margin-top: 16px; }
    .hero-bottom { padding-top: 16px; }
  }
  @media (max-width: 1000px) {
    .site-header #main-nav a { padding-left: 16px; padding-right: 16px; }
    .contact-directory-grid { grid-template-columns: 1fr; }
    .contact-directory-grid>div+div { border-left: 0; border-top: 1px solid var(--line); padding-left: 0; }
  }
  @media (max-width: 760px) {
    .hero-name { font-size: clamp(6.5rem, 24vw, 10.9375rem); }
    .hero-actions { flex-direction: column; align-items: flex-start; gap: 12px; }
    .hero-visual figcaption { padding: 16px var(--gutter); }
    .hero-bottom { padding-top: 24px; }
    .news-row { grid-template-columns: 1fr 20px; }
    .page-contact .button { gap: 20px; }
    .footer-top { flex-wrap: wrap; gap: 18px; }
    .site-footer .footer-brand { font-size: 4.25rem; }
    .footer-content { gap: 32px; }
    .footer-links { gap: 8px 20px; }
    .business-hours p { gap: 12px; flex-wrap: wrap; }
  }
  @media (max-width: 600px) {
    .profile-row { grid-template-columns: 1fr; gap: 7px; padding: 20px 0; }
    .profile-row dt { color: var(--muted); }
    .product-note { gap: 16px; }
    .access-actions { align-items: flex-start; flex-direction: column; gap: 12px; }
  }
}
