/* Réglages linguistiques posés par-dessus la feuille de style de la page française.
   Les pages /ja et /en chargent exactement le même design que /home
   (/_memento-offer/styles.css) : ce fichier n'ajuste que la typographie propre
   à chaque langue, jamais la mise en page ni les couleurs. */

/* ------------------------------------------------------------------ */
/* Japonais                                                            */
/* ------------------------------------------------------------------ */

/* Le japonais a besoin de fontes dédiées, d'un interlignage plus généreux
   et d'aucun crénage négatif : les chasses fixes des idéogrammes ne se
   resserrent pas comme les lettres latines. */
html[lang="ja"] body {
  font-family:
    "Hiragino Kaku Gothic ProN", "Hiragino Sans", "Yu Gothic Medium", "Yu Gothic",
    "Noto Sans JP", Meiryo, Inter, ui-sans-serif, system-ui, -apple-system,
    BlinkMacSystemFont, "Segoe UI", sans-serif;
  line-height: 1.8;
  line-break: strict;
  /* Les navigateurs coupent le japonais à n'importe quel caractère, y compris au
     milieu d'un mot composé. auto-phrase coupe aux frontières de syntagme sur
     les moteurs qui le gèrent ; les autres retrouvent le comportement par
     défaut, qui reste l'usage courant en japonais. */
  word-break: auto-phrase;
}

html[lang="ja"] h1,
html[lang="ja"] h2,
html[lang="ja"] h3,
html[lang="ja"] h4,
html[lang="ja"] .brand,
html[lang="ja"] .eyebrow,
html[lang="ja"] .promise p,
html[lang="ja"] .commercial-price strong,
html[lang="ja"] .commercial-inclusion h4 {
  letter-spacing: normal;
}

/* Les fontes japonaises du système ne dépassent pas le gras (700) : les
   graisses 850-900 du design latin sont synthétisées et bavent à l'écran. */
html[lang="ja"] h1,
html[lang="ja"] h2,
html[lang="ja"] h3,
html[lang="ja"] h4,
html[lang="ja"] .eyebrow,
html[lang="ja"] .promise p,
html[lang="ja"] .audit-eyebrow,
html[lang="ja"] .commercial-card-kicker,
html[lang="ja"] .commercial-badge,
html[lang="ja"] .motion-hub p,
html[lang="ja"] .motion-sources > p,
html[lang="ja"] .motion-outputs > p {
  font-weight: 700;
}

/* Les capitales espacées du design latin n'ont pas d'équivalent en japonais :
   on garde un léger espacement, sans l'effet « lettrage ». */
html[lang="ja"] .eyebrow,
html[lang="ja"] .promise p,
html[lang="ja"] .audit-eyebrow,
html[lang="ja"] .commercial-card-kicker,
html[lang="ja"] .commercial-badge,
html[lang="ja"] .motion-hub p,
html[lang="ja"] .motion-sources > p,
html[lang="ja"] .motion-outputs > p {
  letter-spacing: 0.04em;
}

/* Titres : interlignes rouverts et corps réduits, le japonais occupe une
   surface bien plus dense que le français à taille égale. */
html[lang="ja"] .hero h1 {
  font-size: clamp(2.35rem, 4.5vw, 4.5rem);
  line-height: 1.28;
}

html[lang="ja"] .hero h1 span {
  line-height: 1.28;
}

html[lang="ja"] .hero-lead {
  font-size: clamp(1rem, 1.35vw, 1.15rem);
  line-height: 1.95;
}

html[lang="ja"] .promise h2 {
  font-size: clamp(1.6rem, 2.9vw, 3.05rem);
  line-height: 1.5;
}

html[lang="ja"] .pricing-heading h2 {
  font-size: clamp(1.7rem, 3.1vw, 3.4rem);
  line-height: 1.42;
}

html[lang="ja"] .pricing-lead,
html[lang="ja"] .audit-lead {
  line-height: 1.95;
}

html[lang="ja"] .commercial-card-header h3 {
  font-size: clamp(1.6rem, 2.1vw, 2.3rem);
  line-height: 1.35;
}

html[lang="ja"] .commercial-summary h3 {
  font-size: clamp(1.45rem, 2vw, 2.15rem);
  line-height: 1.5;
}

html[lang="ja"] .audit-cta h2 {
  font-size: clamp(1.6rem, 2.9vw, 3.05rem);
  line-height: 1.45;
}

html[lang="ja"] .audit-card h3 {
  font-size: clamp(1.35rem, 1.85vw, 1.75rem);
  line-height: 1.45;
}

/* Le titre du hub tient dans une boîte étroite : à la taille latine, le
   japonais y laissait un caractère orphelin sur la seconde ligne. */
html[lang="ja"] .motion-hub h2 {
  font-size: clamp(0.92rem, 1.18vw, 1.06rem);
  line-height: 1.45;
}

html[lang="ja"] .commercial-inclusion h4 {
  line-height: 1.6;
}

/* Le récapitulatif doit garder la base de facturation « ／1社 » : sans elle, un
   tarif mensuel se lit par utilisateur au Japon. Une chasse un peu réduite
   permet de la garder sur une seule ligne dans une colonne étroite. */
html[lang="ja"] .commercial-summary ol strong {
  font-size: 0.72rem;
  letter-spacing: normal;
}

html[lang="ja"] .commercial-summary ol li {
  padding-inline: 8px;
}

html[lang="ja"] .commercial-inclusion li,
html[lang="ja"] .audit-benefits p {
  line-height: 1.75;
}

/* Petits libellés de la figure animée : le japonais y est vite illisible. */
html[lang="ja"] .motion-source-list strong,
html[lang="ja"] .motion-outputs strong {
  font-size: 0.74rem;
  line-height: 1.45;
}

html[lang="ja"] .motion-outputs article small,
html[lang="ja"] .motion-hub-actions span {
  line-height: 1.5;
}

@media (max-width: 620px) {
  /* Sur un écran de téléphone, l'accroche japonaise débordait d'un caractère
     sur une seconde ligne à l'intérieur de sa pastille. */
  html[lang="ja"] .eyebrow {
    font-size: 0.72rem;
    letter-spacing: 0.01em;
  }

  html[lang="ja"] .hero h1 {
    font-size: clamp(1.95rem, 8.4vw, 2.5rem);
  }

  html[lang="ja"] .pricing-heading h2 {
    font-size: clamp(1.5rem, 7.2vw, 2.15rem);
  }

  html[lang="ja"] .commercial-card-header h3 {
    font-size: 1.7rem;
  }
}

/* ------------------------------------------------------------------ */
/* Anglais                                                             */
/* ------------------------------------------------------------------ */

/* L'anglais suit le design latin tel quel : seuls les titres, plus longs
   qu'en français, ont besoin d'un crénage un peu moins serré. */
html[lang="en"] .hero h1 {
  letter-spacing: -0.055em;
}

html[lang="en"] .pricing-heading h2,
html[lang="en"] .audit-cta h2 {
  letter-spacing: -0.045em;
}
