/* Precision typographic scale matching refined independent studio aesthetics.
   Fixed base 16px preserves browser ergonomics without uncontrolled rem ballooning. */
:root {
  font-size: 16px;
  --max: clamp(1160px, calc(34.375vw + 720px), 1600px);
}
body { font-size: .9375rem; }
.site-header .desktop-nav { font-size: .875rem; }
.site-header .nav-tools, .product-subnav { font-size: .8125rem; }
.site-header .desktop-nav a, .product-subnav a { white-space: nowrap; }
.site-header .language-list { min-width: 11rem; }
.site-header .wordmark { font-size: 1.375rem; }
.eyebrow { font-size: .75rem; letter-spacing: .12em; font-weight: 600; }
.home-intro h1 { font-size: clamp(2.375rem, 4.2vw, 3.625rem); letter-spacing: -0.03em; line-height: 1.16; }
.intro-subtitle { font-size: 1.0625rem; letter-spacing: -0.01em; line-height: 1.65; }
.intro-lead { font-size: 1.25rem; letter-spacing: -0.015em; line-height: 1.5; font-weight: 500; }
.intro-description, .chapter-description, .product-story .story-body,
.features p, .brand-philosophy > p:not(.eyebrow), .faq details p,
.page-heading > p:not(.eyebrow), .site-privacy p, .legal-content,
.feedback-copy > p:not(.eyebrow), .contact-banner p { font-size: .96875rem; line-height: 1.75; }
.primary-link, .secondary-link { font-size: .875rem; font-weight: 550; }
.text-link, .chapter-actions .text-link { font-size: .84375rem; font-weight: 550; }
.faq summary, .related a, .feedback-form label, .form-status, .subnav-brand { font-size: .90625rem; }
.product-identity { font-size: 1.125rem; font-weight: 650; }
.product-brand { font-size: .8125em; font-weight: 400; color: var(--muted); margin-left: .35em; }
.platform, .chapter-index, .feature-number, .footer-bottom,
.scene-caption, .hero-badge, .index-counter { font-size: .75rem; }
.chapter-copy h2 { font-size: clamp(1.875rem, 2.8vw, 2.625rem); letter-spacing: -0.025em; line-height: 1.2; }
.detail-hero h1 { font-size: clamp(2rem, 3.2vw, 2.875rem); letter-spacing: -0.025em; line-height: 1.25; }
.chapter-philosophy { font-size: .84375rem; line-height: 1.65; }
.keyword-chip, .product-keywords span { font-size: .78125rem; }
.detail-gallery figcaption,
.footer-main p, .footer-main > div, .app-list div > span, .list-action,
.feedback-form textarea::placeholder, .feedback-form input::placeholder,
.form-note, .fallback-link, .legal-top, .legal-notice, .legal-contact,
.subnav-links a { font-size: .8125rem; }
.dock-title { font-size: .75rem; font-weight: 500; }
.dock-icon { width: 3rem; height: 3rem; }
.app-dock a { width: 4.8rem; font-size: .75rem; white-space: nowrap; }
.home-intro .app-dock { gap: 1.15rem; }
.features h3, .feature-card h3, .related h2 { font-size: 1.1875rem; }
.product-story h2, .faq h2, .feedback-copy h2 { font-size: 1.75rem; }
.brand-philosophy h2, .philosophy-box h2 { font-size: 2rem; letter-spacing: -0.025em; }
.page-heading h1 { font-size: 2.375rem; letter-spacing: -0.03em; }
.legal-content h1 { font-size: 2rem; }
.legal-content h2, .contact-banner h2, .site-privacy h2 { font-size: 1.4375rem; }
.legal-content h3, .app-list strong { font-size: 1.0625rem; }
.home-intro .intro-bottom { font-size: .75rem; }

/* The migrated ReaderMode shares the same scale without editing its source copy. */
.reader-page .site-header .wordmark { font-size: 1.375rem; }
.reader-page .hero h1 { font-size: clamp(2.25rem, 4vw, 3.5rem); max-width: 61rem; }
.reader-page .hero .lead { font-size: 1.125rem; max-width: 45rem; }
.reader-page .hero .eyebrow, .reader-page .hero .button { font-size: .875rem; }
.reader-page .feature-body h3 { font-size: 1.125rem; }
.reader-page .feature-body p { font-size: .9375rem; }

@media (min-width: 1280px) {
  .nav-inner { max-width: clamp(1320px, calc(37.5vw + 840px), 1800px); }
  .chapter-copy { max-width: 30rem; }
  .chapter-description { max-width: 25rem; }
  .product-chapter { min-height: max(760px, 80svh); }
  .home-intro { max-height: 980px; }
  .brand-philosophy { width: 100%; max-width: 100%; }
  .philosophy-box { max-width: 48rem; margin-inline: auto; }
  .brand-philosophy > p:not(.eyebrow) { max-width: 35rem; }
  .faq, .legal-document, .legal-top { max-width: 54rem; }
  .page-heading { max-width: 65rem; }
  .page-heading h1 { max-width: 50rem; }
  .page-heading > p:not(.eyebrow) { max-width: 43rem; }
  .app-list, .site-privacy { max-width: 62rem; }
  .feedback-section { max-width: 72rem; }
  .footer { padding-inline: max(30px, calc((100vw - var(--max)) / 2)); }
  .visual-phone .primary-screen { width: 18.25rem; }
  .visual-phone .secondary-screen { width: 15rem; }
  .story-scene { height: 23rem; }
  .visual-icon { min-height: 26.25rem; }
  .reader-page .hero { min-height: max(740px, 78svh); }
  .reader-page .content-shell { max-width: min(90%, 80rem); }
}
@media (max-width: 1100px) and (min-width: 851px) {
  .site-header .nav-inner { gap: 14px; padding-inline: 22px; }
  .site-header .desktop-nav { gap: 14px; font-size: .875rem; }
  .site-header .nav-tools { gap: 14px; font-size: .8125rem; }
}
@media (max-width: 850px) {
  .site-header .wordmark, .reader-page .site-header .wordmark { font-size: 1.3125rem; }
  .site-header .mobile-menu nav a { font-size: 1rem; }
}
@media (max-width: 749px) {
  .home-intro .app-dock-wrapper { width: 100%; }
  .home-intro .app-dock { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 16px 12px; width: 100%; max-width: 420px; padding: 16px; }
  .home-intro .app-dock a { width: auto; min-width: 0; }
}
@media (max-width: 600px) {
  .home-intro h1 { font-size: clamp(1.875rem, 8.5vw, 2.125rem); }
  .intro-subtitle { font-size: .9375rem; line-height: 1.6; }
  .intro-lead { font-size: 1.0625rem; }
  .intro-description { font-size: .875rem; }
  .home-intro .app-dock { max-width: 380px; }
  .app-dock a { width: 3.3rem; font-size: .6875rem; }
  .dock-icon { width: 42px; height: 42px; }
  .dock-icon img { width: 100%; height: 100%; }
  .home-intro .intro-bottom { font-size: .6875rem; }
  .chapter-copy h2, .detail-hero h1 { font-size: 1.625rem; }
  .chapter-description, .product-story .story-body, .features p,
  .brand-philosophy > p:not(.eyebrow), .page-heading > p:not(.eyebrow),
  .faq details p, .feedback-copy > p:not(.eyebrow), .site-privacy p,
  .legal-content { font-size: .90625rem; }
  .chapter-philosophy, .product-keywords span { font-size: .8125rem; }
  .product-identity { font-size: 1rem; }
  .product-subnav { font-size: .75rem; }
  .subnav-inner { gap: 12px; }
  .subnav-brand { flex-shrink: 0; }
  .platform, .chapter-index { font-size: .6875rem; }
  .scene-caption { font-size: .625rem; }
  .product-story h2, .faq h2, .brand-philosophy h2, .feedback-copy h2 { font-size: 1.5rem; }
  .page-heading h1, .legal-content h1 { font-size: 1.75rem; }
  .legal-content h2 { font-size: 1.25rem; }
  .footer-main p, .footer-main > div, .footer-bottom { font-size: .75rem; }
  .list-action { font-size: 0; }
  .reader-page .hero h1 { font-size: 1.75rem; }
  .reader-page .hero .lead { font-size: .90625rem; }
  .reader-page .hero .button { font-size: .84375rem; }
}

/* Keep all seven app destinations visible on narrow phones. */
@media (max-width: 400px) {
  .home-intro .app-dock { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px 20px; max-width: 280px; }
}
