/* The new home page's type (home-v2-wip.css) on the Windows App, SketchUp plugin, Rhino, Plugins & Apps, About, FAQ, Terms and Privacy pages, 4 languages each:
   Inter to read, Space Grotesk 700 for titles. Both are SIL OFL and served from /fonts, as on the home page, because
   Google Fonts is unreliable from mainland China. Latin only: CJK falls through to the system stack set per language.
   Scoped to each page's body class (winapp-page, su-plugin-page, rhp-body, plugins-body, info-page, apps-mkt) and to the page content: the shared header
   and the brand footer keep the site's type until it changes everywhere. Titles keep their case and their sizes; the
   Windows App hero takes the Rhino hero's. */
@font-face {
    font-family: "Inter";
    font-style: normal;
    font-weight: 100 900;
    font-display: swap;
    src: url("/fonts/inter-latin-wght-normal.woff2") format("woff2");
    unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
    font-family: "Space Grotesk";
    font-style: normal;
    font-weight: 700;
    font-display: swap;
    src: url("/fonts/space-grotesk-700-latin.woff2") format("woff2");
    unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

body.winapp-page,
body.su-plugin-page,
body.rhp-body,
body.plugins-body,
body.info-page,
body.apps-mkt {
    --wbt-cjk: "PingFang SC", "Microsoft YaHei", "Noto Sans SC", "Noto Sans CJK SC";
    --wbt-text: "Inter", var(--wbt-cjk), "Segoe UI", system-ui, sans-serif;
    --wbt-title: "Space Grotesk", "Inter", var(--wbt-cjk), "Segoe UI", system-ui, sans-serif;
    --wbt-track: -.02em;
}
body.winapp-page:lang(zh-TW),
body.su-plugin-page:lang(zh-TW),
body.rhp-body:lang(zh-TW),
body.plugins-body:lang(zh-TW),
body.info-page:lang(zh-TW),
body.info-page:lang(zh-Hant),
body.apps-mkt:lang(zh-TW) {
    --wbt-cjk: "PingFang TC", "Microsoft JhengHei", "Noto Sans TC", "Noto Sans CJK TC";
    --wbt-text: "Inter", var(--wbt-cjk), "Segoe UI", system-ui, sans-serif;
    --wbt-title: "Space Grotesk", "Inter", var(--wbt-cjk), "Segoe UI", system-ui, sans-serif;
}
body.winapp-page:lang(ja),
body.su-plugin-page:lang(ja),
body.rhp-body:lang(ja),
body.plugins-body:lang(ja),
body.info-page:lang(ja),
body.apps-mkt:lang(ja) {
    --wbt-cjk: "Hiragino Sans", "Hiragino Kaku Gothic ProN", "Yu Gothic", "Meiryo", "Noto Sans JP", "Noto Sans CJK JP";
    --wbt-text: "Inter", var(--wbt-cjk), "Segoe UI", system-ui, sans-serif;
    --wbt-title: "Space Grotesk", "Inter", var(--wbt-cjk), "Segoe UI", system-ui, sans-serif;
}
/* Chinese and Japanese have no capitals to pack tight. */
body.winapp-page:lang(zh), body.winapp-page:lang(ja),
body.su-plugin-page:lang(zh), body.su-plugin-page:lang(ja),
body.rhp-body:lang(zh), body.rhp-body:lang(ja),
body.plugins-body:lang(zh), body.plugins-body:lang(ja),
body.info-page:lang(zh), body.info-page:lang(ja),
body.apps-mkt:lang(zh), body.apps-mkt:lang(ja) { --wbt-track: 0; }

/* Text: the page content; buttons are named because they do not inherit the font. */
body.winapp-page main.page-shell,
body.winapp-page main.page-shell button,
body.su-plugin-page > section,
body.su-plugin-page > section button,
body.rhp-body .rhp-page,
body.rhp-body .rhp-page button,
body.plugins-body .plugins-page,
body.plugins-body > .footer,
body.info-page > section,
body.info-page > section button,
body.apps-mkt > section,
body.apps-mkt > section button { font-family: var(--wbt-text); }
/* Auto3D sets every element's face from one variable (auto3d-home.css), header included: point it at the home's text face. */
body.apps-mkt.auto3d-home-page { --a3h-font-ui: var(--wbt-text); }

/* Titles: Space Grotesk 700, packed as on the home page. */
body.winapp-page main.page-shell h2:not(.hero-subtitle),
body.su-plugin-page .hero-title,
body.su-plugin-page .section-title,
body.rhp-body .rhp-page .rhp-hero-title,
body.rhp-body .rhp-page .rhp-section-title,
body.rhp-body .rhp-page .rhp-final-title,
body.rhp-body .rhp-page .rhp-help-title,
body.plugins-body .plugins-page .pl-title,
body.plugins-body .plugins-page .pl-card-copy h3,
body.plugins-body .plugins-page .pl-soon-card h3,
body.info-page > section :is(.terms-hero-title, .privacy-hero-title, .about-hero-title, .faq-hero-title, .section-title, .contact-title, .cta-title),
body.apps-mkt > section :is(.hero-title, .features-title, .how-it-works-main-title, .cta-title),
body.apps-mkt .a3h :is(.a3h-h1, .a3h-h2, .a3h-cta h2) {
    font-family: var(--wbt-title);
    font-weight: 700;
    letter-spacing: var(--wbt-track);
}

/* Windows App hero at the Rhino hero's size: title clamp(42px, 4.4vw, 56px), the line under it as the Rhino lead.
   Phones keep their own sizes (the template's max-width: 767px rules). */
@media (min-width: 768px) {
    body.winapp-page .hero-title {
        font-size: clamp(42px, 4.4vw, 56px);
        line-height: 1.08;
    }
    body.winapp-page .hero-title span {
        font-size: inherit;
        line-height: inherit !important; /* the span carries an inline line-height: 1 */
        vertical-align: baseline;
    }
    body.winapp-page .hero-subtitle {
        font-size: clamp(20px, 2.4vw, 28px);
        font-weight: 450;
        letter-spacing: -.02em;
        line-height: 1.5;
    }
}
/* Phones: the Rhino phone title, 40px on up to two lines. The template's phone rule kept it on one line at 9.12vw,
   which ran 80px past a 390px screen. */
@media (max-width: 767px) {
    body.winapp-page .hero-title {
        font-size: 40px !important;
        line-height: 1.2 !important;
        letter-spacing: var(--wbt-track) !important;
        white-space: normal !important;
        text-wrap: balance;
    }
}

/* The grey line under the hero download buttons (2026-11-04, the owner's ask): the versions a download supports and,
   where it matters, one link. 13px muted text, centred. Dark mode takes the Workbench muted
   grey; html raises it over dark-theme.css's body.dark-mode p, which common.js injects after this file. */
body.winapp-page .dl-note,
body.su-plugin-page .dl-note,
body.rhp-body .dl-note {
    margin: 12px auto 0;
    max-width: 760px;
    padding: 0;
    font-family: var(--wbt-text);
    font-size: 13px;
    font-weight: 400;
    line-height: 1.55;
    letter-spacing: 0;
    color: #6b7280;
    text-align: center;
    text-wrap: balance;
}
/* Each item stays whole; a narrow screen breaks only between items, after the separator. */
body.winapp-page .dl-note > span,
body.su-plugin-page .dl-note > span,
body.rhp-body .dl-note > span { white-space: nowrap; }
/* SketchUp: the button's grid keeps 3rem below it; the line steps up into that space and keeps the 3rem under itself. */
body.su-plugin-page .hero-cta + .dl-note { margin: calc(12px - 3rem) auto 3rem; }
body.winapp-page .dl-note a,
body.su-plugin-page .dl-note a,
body.rhp-body .dl-note a {
    color: inherit;
    text-decoration: underline;
    text-decoration-thickness: 1px;
    text-underline-offset: 3px;
}
body.winapp-page .dl-note a:hover,
body.su-plugin-page .dl-note a:hover,
body.rhp-body .dl-note a:hover { color: #374151; }
html body.winapp-page.dark-mode .dl-note,
html body.su-plugin-page.dark-mode .dl-note,
html body.rhp-body.dark-mode .dl-note { color: #a0a7b2; }
html body.winapp-page.dark-mode .dl-note a:hover,
html body.su-plugin-page.dark-mode .dl-note a:hover,
html body.rhp-body.dark-mode .dl-note a:hover { color: #e7e9ed; }

/* Plugins & Apps page: the product titles are the home page's app rows (.hv2-app-title), so they take the title face
   too; the small uppercase labels (section heads, card eyebrows) take the home's app name (.hv2-app-name): Space
   Grotesk 700, lightly tracked. Sizes stay the template's. */
body.plugins-body .plugins-page .pl-section-head h2,
body.plugins-body .plugins-page .pl-card-eyebrow {
    font-family: var(--wbt-title);
    font-weight: 700;
    letter-spacing: .06em;
}
body.plugins-body .plugins-page .pl-card-eyebrow { color: #6b7280; }
body.plugins-body .plugins-page .pl-title { letter-spacing: -.03em; text-wrap: balance; }
body.plugins-body:lang(zh) .plugins-page .pl-title,
body.plugins-body:lang(ja) .plugins-page .pl-title { letter-spacing: 0; line-height: 1.2; }
/* RoomFlow, SnapRender and Auto3D (body.apps-mkt): titles in the home's title face (above); Auto3D's card, use-case and
   question titles are Inter at 600, as the home's tool cards, not the template's 500. */
body.apps-mkt .a3h { --weight-title: 600; }
body.apps-mkt .a3h :is(.a3h-h1, .a3h-h2, .a3h-cta h2) { font-weight: 700; line-height: 1.12; }
body.apps-mkt .a3h .a3h-h1 .grad { font-weight: 700; }
body.apps-mkt > section :is(.hero-title, .features-title, .how-it-works-main-title, .cta-title) { text-wrap: balance; }