@charset "utf-8";
/* ==========================================================================
   en-refresh.css  —  English-site refresh (2026-09)
   Load LAST on every /en/ page, after en_index.css.

   Scope, deliberately narrow:
     1. Latin font stack + real bold weights (was: English rendered in a
        Chinese webfont that shipped Regular only, so every bold on the
        page was browser-synthesised and looked blurry).
     2. Keep the hero visually identical now that it is an <h1> whose lines
        are <span> instead of <p> (<p> is invalid inside a heading).
   Chinese pages are untouched — they keep Source Han Sans.
   ========================================================================== */

/* --- 1. Latin type ------------------------------------------------------
   System stack on purpose, not a webfont:
     · it ships genuine Medium/Bold, which kills the fake-bold blur;
     · it costs zero network requests, so LCP does not regress;
     · no Google Fonts dependency (unreachable from mainland China, and
       this stylesheet is served from the same domain as the CN site).
   To switch to Inter Tight later, prepend it to the two stacks below. */
body,
button, input, select, textarea {
  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto,
               "Helvetica Neue", Helvetica, Arial, sans-serif;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

/* Latin headings: slightly tighter tracking reads better than the
   letter-spacing tuned for Han characters. */
h1, h2, h3, h4, h5, h6,
.title, .banner_text_title {
  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto,
               "Helvetica Neue", Helvetica, Arial, sans-serif;
  letter-spacing: -0.01em;
}

/* Real weights instead of synthesised ones. */
b, strong, .bold,
.banner_text_title,
.contact_fl_box_p,
.footer_nav dt, .footer_nav2019 dt {
  font-weight: 600;
  -webkit-font-smoothing: antialiased;
}

/* Latin body copy wants a looser measure than Han text
   (Han has no ascenders/descenders, so it tolerates tighter leading). */
.by-box .safe-text-p,
.by-box .safe-text p,
.value-get-text p,
.logo_text p,
.add_text p {
  line-height: 1.6;
}

/* --- 2. Hero: <h1><span> replaces <div><p> ------------------------------
   Mirrors every existing `.banner_text_title p` rule so the rendering is
   byte-for-byte what it was. Selectors are paired, never replaced, so the
   original declarations keep working if markup is reverted. */
.index-swiper1 .text-banner6 .banner_text_title span {
  display: block;
  color: #fff;
  font-size: 32px;          /* matches en_index.css override of the 45px base */
  font-weight: 600;
  margin: 0;
  line-height: 1.4;
  letter-spacing: 1px;
}
h1.banner_text_title {
  font-size: inherit;       /* neutralise the h1 reset; spans carry the size */
  margin: 0;
}

@media screen and (max-width: 990px) {
  .index-swiper1 .text-banner6 .banner_text_title span {
    font-size: 1.3rem;
    letter-spacing: 0;
  }
  .text-banner.text-banner6 .banner_text_title span {
    font-size: 1.6rem;
  }
}
@media screen and (max-width: 768px) {
  .index-swiper1 .text-banner6 .banner_text_title span {
    font-size: 1.1rem;
  }
}

/* --- <picture> hero -----------------------------------------------------
   Same reasoning as the CN site: the old markup shipped a 3000px-wide JPEG
   to every device. <picture> serves one source, WebP where supported, and a
   1080px variant to phones. */
.banner_slide_img picture,
.banner_index6 picture {
  display: block;
  width: 100%;
}
.banner_slide_img picture img,
.banner_index6 picture img {
  width: 100%;
  height: auto;
  display: block;
}

/* --- .display_pc / .display_mobile toggle -------------------------------
   client.html ships two logo-wall images gated by these classes, but the
   EN pages never load css/style/common.css (the CN-only file that defines
   this rule), so both images render at once on every width. Re-declaring
   it here keeps the EN stylesheet self-contained instead of pulling in the
   whole CN common.css file. */
.display_pc {
  display: block;
}
.display_mobile {
  display: none;
}
@media screen and (max-width: 990px) {
  .display_pc {
    display: none;
  }
  .display_mobile {
    display: block;
  }
}

/* --- company_about.html: "About Cloudpense" intro block -----------------
   The CN page has an "关于云简业财"/"公司介绍" text block that the EN page
   never had (its own intro is the founder-quote banner instead). This adds
   just the paragraph typography for the two translated paragraphs slotted
   in between that banner and the "Rapid growth" timeline; the surrounding
   title/width/centering reuse the page's existing .about-group/.wh/.title
   utility classes as-is. */
.about-intro-text {
  max-width: 900px;
  margin: 0 auto 24px;
  color: #656565;
  font-size: 1rem;
  line-height: 1.8;
  text-align: left;
}
.about-intro-text:last-child {
  margin-bottom: 0;
}
.about-intro-text p + p {
  margin-top: 16px;
}