/* StayCore website inner pages — quiet premium layer (2026-11-05).
   Same language as the homepage: serif display type, pill buttons, hairlines, more air.
   Loaded after website-quiet-theme so equal-specificity rules win. Visible without JavaScript;
   website-motion.js adds html.sc-motion before anything is hidden for a reveal. */

body.website-page {
  --primary: #111110;
  --primary-hover: #2a2a28;
  --secondary: #f5f4f0;
  --text: #111110;
  --text-secondary: #6e6d68;
  --border-color: rgba(17, 17, 16, .1);
  --sc-night: #0d0d0c;
  --sc-ease: cubic-bezier(.2, .7, .1, 1);
  --sc-serif: 'Instrument Serif', 'Iowan Old Style', 'Palatino Linotype', Palatino, Georgia, 'StayCore Serif SC', 'Noto Serif SC', 'Songti SC', 'STSong', serif;
  --sc-arrow-dark: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='M3.5 8h8.5M8.6 4.6 12 8l-3.4 3.4' fill='none' stroke='%23111110' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
  background: var(--secondary);
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
}
html[lang=zh-HK] body.website-page { --sc-serif: 'Instrument Serif', 'Iowan Old Style', Georgia, 'StayCore Serif TC', 'Noto Serif TC', 'Songti TC', serif; }
html[lang=th] body.website-page { --sc-serif: 'Instrument Serif', Georgia, 'Noto Sans Thai', serif; }

/* ---------- Display type ---------- */
html body.website-page :is(section, header, main) :is(h1, h2):not(.footer *, .nav *, .sc-advisor *, [class*="card"] *),
html body.website-page .section-title {
  font-family: var(--sc-serif) !important; font-weight: 400 !important; letter-spacing: -.012em !important; text-wrap: balance;
}
html[lang^=zh] body.website-page :is(section, header, main) :is(h1, h2):not(.footer *, .nav *, .sc-advisor *, [class*="card"] *),
html[lang^=zh] body.website-page .section-title { word-break: keep-all; overflow-wrap: anywhere; letter-spacing: .005em !important; line-height: 1.2 !important; }
html[lang=th] body.website-page :is(section, header, main) :is(h1, h2):not(.footer *, .nav *, .sc-advisor *) { letter-spacing: 0 !important; line-height: 1.3 !important; }
html body.website-page :is(section, header, main) h2:not(.footer *, .nav *, .sc-advisor *, [class*="card"] *),
html body.website-page .section-title { font-size: clamp(36px, 4vw, 60px) !important; line-height: 1.08; }
html body.website-page :is(section, header, main) :is(h3, h4) { font-weight: 500; letter-spacing: -.01em; }
body.website-page :is(.section-subtitle, .page-hero p) { color: var(--text-secondary); font-weight: 400; }

/* Quieter scaffolding: kickers and badges become small grey labels. */
body.website-page :is(.demo-kicker, .page-hero .badge, .sc-experience-kicker, .section-kicker, .eyebrow) {
  border: 0 !important; background: none !important; padding: 0 !important; box-shadow: none !important;
  color: var(--text-secondary) !important; font-size: 12px !important; font-weight: 500 !important; letter-spacing: .04em !important; text-transform: none !important;
}

/* ---------- Page hero ---------- */
body.website-page .page-hero { padding: 168px 0 72px; border-bottom: 0; }
body.website-page .page-hero .container { gap: 40px 64px; }
html body.website-page .page-hero h1,
html body.website-page .page-hero .reveal-text { font-size: clamp(52px, 6.2vw, 100px) !important; line-height: 1 !important; }
html[lang^=zh] body.website-page .page-hero h1 { font-size: clamp(44px, 5.2vw, 82px) !important; line-height: 1.14 !important; }
html[lang=th] body.website-page .page-hero h1 { font-size: clamp(38px, 4.4vw, 66px) !important; line-height: 1.25 !important; }
body.website-page .page-hero p { font-size: 16px !important; line-height: 1.75 !important; }
body.website-page .demo-hero h1 { font-size: clamp(44px, 5.4vw, 88px) !important; line-height: 1.06 !important; }
html[lang^=zh] body.website-page .demo-hero h1 { font-size: clamp(40px, 4.8vw, 76px) !important; line-height: 1.16 !important; }
body.website-page .download-section .section-title { font-size: clamp(52px, 6.2vw, 100px) !important; line-height: 1 !important; }

/* Full-width scene photo under each page title */
.sc-page-visual { grid-column: 1 / -1; position: relative; margin: 16px 0 0; aspect-ratio: 21 / 9; overflow: hidden; border-radius: 22px; background: #e4e2dc; }
.sc-page-visual img { display: block; width: 100%; height: 100%; object-fit: cover; transform: scale(1.03); transition: transform 1.8s var(--sc-ease); }
html.sc-motion .sc-page-visual.is-in img, html:not(.sc-motion) .sc-page-visual img { transform: none; }
.sc-page-visual figcaption { position: absolute; left: 18px; bottom: 14px; color: rgba(255, 255, 255, .62); font-size: 11px; }

/* ---------- Buttons: one pill language ---------- */
body.website-page :is(.magnetic-btn, .cta-page-btn, .download-big-btn, .btn-submit, .btn-subscribe, .pay-btn, .sc-ex-link) {
  display: inline-flex; align-items: center; justify-content: center; gap: 12px; min-height: 44px; padding: 0 20px;
  border: 1px solid var(--border-color); border-radius: 999px; background: transparent; color: var(--text);
  font-family: inherit; font-size: 14px; font-weight: 500; letter-spacing: -.005em;
}
body.website-page :is(.magnetic-btn, .cta-page-btn, .download-big-btn, .sc-ex-link):not(.primary, .sc-ex-link--dark):hover { background: rgba(17, 17, 16, .04); border-color: rgba(17, 17, 16, .3); color: var(--text); }
body.website-page :is(.magnetic-btn.primary, .cta-page-btn.primary, .download-big-btn.primary, .btn-submit, .btn-subscribe, .pay-btn, .sc-ex-link--dark) {
  padding: 0 5px 0 20px; background: var(--text); border-color: var(--text); color: #fff !important;
}
body.website-page :is(.magnetic-btn.primary, .cta-page-btn.primary, .download-big-btn.primary, .sc-ex-link--dark)::after {
  content: '' !important; display: block !important; position: static !important; inset: auto !important; opacity: 1 !important; z-index: auto !important; transform: none !important;
  flex-shrink: 0; width: 34px; height: 34px; border-radius: 50%; background: #fff var(--sc-arrow-dark) center / 15px no-repeat !important;
  transition: transform .35s var(--sc-ease);
}
body.website-page :is(.magnetic-btn.primary, .cta-page-btn.primary, .download-big-btn.primary, .sc-ex-link--dark):hover { background: #2a2a28; border-color: #2a2a28; }
body.website-page :is(.magnetic-btn.primary, .cta-page-btn.primary, .download-big-btn.primary, .sc-ex-link--dark):hover::after { transform: translateX(2px) !important; }
body.website-page :is(.btn-submit, .btn-subscribe, .pay-btn) { padding: 0 22px; }
body.website-page .download-big-btn svg { width: 18px; height: 18px; fill: currentColor; }
body.website-page :is(.period-btn, .tab-btn, .sc-feature-picker button, .sc-frontdesk-topics button) {
  min-height: 38px; padding: 8px 16px; border-radius: 999px; font-size: 13px; font-weight: 500;
}
body.website-page .magnetic-btn.btn-accent { background: transparent; border-color: var(--border-color); color: var(--text); }

/* ---------- Navigation (light) ---------- */
body.website-page .nav { border-bottom-color: transparent; background: rgba(245, 244, 240, .86); backdrop-filter: blur(14px); -webkit-backdrop-filter: blur(14px); box-shadow: none; }
body.website-page .nav .nav-links { gap: 28px; }
body.website-page .nav .nav-links a { font-size: 13px; font-weight: 400; color: var(--text-secondary); }
body.website-page .nav .nav-links a:is(:hover, .active) { color: var(--text); }
body.website-page .nav .language-select { height: 36px; border-color: transparent; background-color: transparent; font-family: inherit; font-size: 13px; font-weight: 400; box-shadow: none; }
body.website-page .nav .language-select:hover { background-color: rgba(17, 17, 16, .04); }
body.website-page .nav .nav-cta { gap: 6px; }
body.website-page .nav .nav-cta .nav-cta-btn { height: 38px; min-height: 0; padding: 0 14px; border: 0; background: transparent; font-size: 13px; font-weight: 400; }
body.website-page .nav .nav-cta .nav-cta-btn:hover { background: rgba(17, 17, 16, .05); color: var(--text); }
body.website-page .nav .nav-cta .nav-cta-btn.primary { gap: 10px; padding: 0 4px 0 16px; background: var(--text); color: #fff !important; font-weight: 500; }
body.website-page .nav .nav-cta .nav-cta-btn.primary::after { width: 30px; height: 30px; background-size: 13px !important; }
body.website-page .nav .nav-cta .nav-cta-btn.primary:hover { background: #2a2a28; }
body.website-page .nav .hamburger { font-size: 13px; font-weight: 400; }

/* ---------- Cards, tables, closing ---------- */
body.website-page :is(.pricing-card, .plan-card, .case-card, .topic-card, .support-card, .tool-card, .value-card, .eco-card, .doc-card, .community-card, .step-card, .prep-card, .tip-card, .tips-card, .methodology-step, .login-card) {
  border-radius: 20px !important; border-color: var(--border-color) !important; box-shadow: none !important; transform: none !important;
  transition: border-color .25s, background-color .25s;
}
body.website-page :is(.pricing-card, .plan-card, .case-card, .topic-card, .support-card, .tool-card, .value-card, .eco-card, .doc-card, .community-card):hover { border-color: rgba(17, 17, 16, .24) !important; }
body.website-page .comparison-table { border-radius: 20px; }
body.website-page :is(.cta-section, .guide-cta, .tv-cta) { padding: 128px 0 96px; background: #ecebe6 !important; }
body.website-page .section { padding-top: 112px; padding-bottom: 112px; }

/* Footer lockup */
.footer-brand .brand-lockup { display: block; height: 24px; width: auto; }

/* AI product advisor: a small quiet mark that opens on hover */
html body.website-page .sc-advisor-launch { gap: 0; min-height: 0; padding: 5px; border-color: rgba(17, 17, 16, .08); background: rgba(255, 255, 255, .86); backdrop-filter: blur(12px); -webkit-backdrop-filter: blur(12px); box-shadow: 0 6px 24px rgba(17, 17, 16, .1); transition: padding .35s var(--sc-ease); }
body.website-page .sc-advisor-mark { width: 34px; height: 34px; font-size: 11px; }
body.website-page .sc-advisor-label { max-width: 0; overflow: hidden; white-space: nowrap; opacity: 0; transition: max-width .4s var(--sc-ease), opacity .25s, margin .4s var(--sc-ease); }
html body.website-page .sc-advisor-launch:is(:hover, :focus-visible) { padding-right: 14px; }
body.website-page .sc-advisor-launch:is(:hover, :focus-visible) .sc-advisor-label { max-width: 160px; opacity: 1; margin-left: 9px; }

/* ---------- Scroll reveal (tagged by website-motion.js) ---------- */
html.sc-motion .sc-auto-reveal { opacity: 0; transform: translateY(22px); transition: opacity .9s var(--sc-ease), transform 1s var(--sc-ease); transition-delay: calc(var(--i, 0) * 60ms); }
html.sc-motion .sc-auto-reveal.is-in { opacity: 1; transform: none; }

@media (max-width: 760px) {
  body.website-page .page-hero { padding: 128px 0 48px; }
  .sc-page-visual { aspect-ratio: 4 / 3; border-radius: 16px; margin-top: 8px; }
  body.website-page .section { padding-top: 80px; padding-bottom: 80px; }
  body.website-page :is(.cta-section, .guide-cta, .tv-cta) { padding: 88px 0 72px; }
  .footer-brand .brand-lockup { height: 22px; }
}
@media (prefers-reduced-motion: reduce) {
  .sc-page-visual img { transform: none !important; transition: none; }
}

/* =====================================================================
   Shared detail pass (2026-11-05 review) — inner pages
   ===================================================================== */
body.website-page {
  --sc-paper-2: #ecebe6;
  --sc-r-media: 10px;
  --sc-r-ui: 16px;
  --sc-arrow-light: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='M3.5 8h8.5M8.6 4.6 12 8l-3.4 3.4' fill='none' stroke='%23ffffff' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
}
/* Chinese: Simplified pages must not run on a Traditional face (missing glyphs fell back thinner) */
html[lang=zh-CN] body.website-page,
html[lang=zh-CN] body.website-page :is(h3, h4, h5, h6, button, input, select, textarea, .magnetic-btn) { font-family: 'Inter', 'PingFang SC', 'Noto Sans SC', 'Microsoft YaHei', sans-serif; }
html[lang=zh-CN] body.website-page { --sc-serif: 'StayCore Serif SC', 'Instrument Serif', 'Noto Serif SC', 'Songti SC', 'STSong', serif; }
html[lang=zh-HK] body.website-page { --sc-serif: 'StayCore Serif TC', 'Instrument Serif', 'Noto Serif TC', 'Songti TC', serif; }
/* Chinese headings: break between characters, never strand punctuation */
html[lang^=zh] body.website-page :is(section, header, main) :is(h1, h2):not(.footer *, .nav *, .sc-advisor *, [class*="card"] *),
html[lang^=zh] body.website-page .section-title { word-break: normal !important; overflow-wrap: normal !important; line-break: strict; text-wrap: balance; font-feature-settings: "halt"; }
html[lang^=zh] body.website-page :is(h3, h4, h5, h6, .tool-name, .category-name) { letter-spacing: 0 !important; }
body.website-page :is(p, li, figcaption) { text-wrap: pretty; }
/* Weight discipline: 400 for reading text, 500 for emphasis */
body.website-page :is(section, header) :is(p, li, small, label, td, input, select, textarea)::placeholder { font-weight: 400; }
body.website-page :is(section, header) :is(p, li, small, label, td, input, select, textarea) { font-weight: 400; }
body.website-page :is(section, header) :is(h3, h4, h5, strong, b, th, dt) { font-weight: 500; }

/* Same content edge as the homepage */
body.website-page .container { width: min(100%, 1344px); padding-inline: 48px; }
body.website-page .nav .nav-inner { width: 100%; max-width: 1344px; padding-inline: 48px; }
@media (max-width: 1100px) { body.website-page .container, body.website-page .nav .nav-inner { padding-inline: 30px; } }
@media (max-width: 768px) { body.website-page .container, body.website-page .nav .nav-inner { padding-inline: 20px; } }
@media (min-width: 769px) {
  body:is(.website-home, .website-page) .nav .nav-cta { order: 4; margin-left: 8px; }
  body.website-page .nav .hamburger { order: 3; margin-left: auto; color: var(--text-secondary); }
}
body.website-page .nav .hamburger > span { background: currentColor !important; height: 1.5px !important; }
body.website-page .nav .nav-cta .nav-cta-btn { height: 34px; }
body.website-page .nav .nav-cta .nav-cta-btn.primary { padding: 0 5px 0 14px; gap: 9px; }
body.website-page .nav .nav-cta .nav-cta-btn.primary::after { width: 24px !important; height: 24px !important; background-size: 11px !important; }
body.website-page .nav .language-select { field-sizing: content; }

/* Lighter buttons, one family (incl. the shared demo invite and page-specific links) */
body.website-page :is(.magnetic-btn, .cta-page-btn, .download-big-btn, .sc-ex-link, .page-demo-invite-action, .demo-hero-actions a, .loop-guardrail a) {
  min-height: 40px; padding: 0 18px; border-radius: 999px; font-size: 13px; font-weight: 500 !important; gap: 12px; text-decoration: none;
}
body.website-page :is(.magnetic-btn.primary, .cta-page-btn.primary, .download-big-btn.primary, .sc-ex-link--dark) { padding: 0 6px 0 18px; }
body.website-page :is(.magnetic-btn.primary, .cta-page-btn.primary, .download-big-btn.primary, .sc-ex-link--dark)::after { width: 28px !important; height: 28px !important; background-size: 12px !important; }
body.website-page .demo-hero-actions a:first-child { display: inline-flex; align-items: center; padding: 0 6px 0 18px; background: var(--text); border: 1px solid var(--text); color: #fff; }
body.website-page .demo-hero-actions a:first-child::after { content: ''; width: 28px; height: 28px; border-radius: 50%; background: #fff var(--sc-arrow-dark) center / 12px no-repeat; }
body.website-page .demo-hero-actions a:not(:first-child) { display: inline-flex; align-items: center; border: 1px solid var(--border-color); background: transparent; color: var(--text); }

/* Closing: the dark demo invite is the one ending; the light CTA after it repeated the same ask */
body.website-page .page-demo-invite + .cta-section { display: none; }
body.website-page .page-demo-invite { padding: 128px 0 112px; border: 0; background: var(--sc-night); }
body.website-page .page-demo-invite small { display: none; }
html body.website-page .page-demo-invite h2 { max-width: 16em; color: #fff; font-size: clamp(32px, 3.4vw, 52px) !important; line-height: 1.12 !important; }
body.website-page .page-demo-invite p { font-size: 15px; line-height: 1.75; color: rgba(255, 255, 255, .58); }
body.website-page .page-demo-invite-action { padding: 0 6px 0 18px; background: #fff; border-color: #fff; color: var(--text); }
body.website-page .page-demo-invite-action::after { content: ''; flex-shrink: 0; width: 28px; height: 28px; border-radius: 50%; background: var(--text) var(--sc-arrow-light) center / 12px no-repeat; transition: transform .35s var(--sc-ease); }
@media (hover: hover) and (pointer: fine) { body.website-page .page-demo-invite-action:hover { background: #f3efe8; color: var(--text); } body.website-page .page-demo-invite-action:hover::after { transform: translateX(2px); } }
body.website-page :is(.cta-section) h2 { color: var(--text); }

/* Footer: identical to the homepage */
body.website-page .footer { padding: 56px 0 40px; background: var(--sc-night); border-top: 1px solid rgba(255, 255, 255, .08); }
body.website-page .footer-links { gap: 4px 28px; }
html body.website-page .footer-links a { min-height: 32px; padding: 0 !important; border: 0 !important; border-radius: 0 !important; background: none !important; box-shadow: none !important; transform: none !important; color: rgba(255, 255, 255, .62) !important; font: 400 13px/1.5 Inter, 'PingFang SC', 'Noto Sans TC', sans-serif !important; }
html body.website-page .footer-links a:hover { color: #fff !important; }
html body.website-page :is(.footer-slogan, .copyright) { font-weight: 400 !important; color: rgba(255, 255, 255, .42) !important; }

/* Page photo: consistent distance from the title block */
.sc-page-visual { margin-top: 64px; border-radius: var(--sc-r-media); }
body.website-page .page-hero .container { row-gap: 0; }
@media (max-width: 760px) { .sc-page-visual { margin-top: 40px; } }

/* Kickers that repeat what the title says */
body.website-page :is(.demo-kicker, .sc-experience-kicker, .demo-data-label) { display: none !important; }

/* AI mark: hide while a form or the closing block is on screen (phones) */
body.sc-fab-hide .sc-advisor-launch { opacity: 0 !important; pointer-events: none !important; transform: translateY(8px); }
html body.website-page .sc-advisor-launch { transition: opacity .3s, transform .3s, padding .35s var(--sc-ease); }

/* Reveal: big blocks only fade, and start a little earlier */
html.sc-motion .sc-auto-reveal.sc-reveal-fade { transform: none; }

.sc-clause { display: inline-block; }

/* Cards that the old motion library hid until it animated them (the quiet site never runs it) */
body.website-page :is(.pricing-card, .feature-card) { opacity: 1; transform: none; }
/* Title and description need air when the hero grid stacks; the photo keeps ~64px from the text */
body.website-page .page-hero .container { row-gap: 24px; }
.sc-page-visual { margin-top: 40px; }
@media (max-width: 760px) { .sc-page-visual { margin-top: 24px; } }

/* Shared partials used on inner pages */
body:is(.website-home, .website-page) .sc-frontdesk-story { border-left-width: 1px !important; }
.sc-page-visual figcaption { font-size: 12px; }
@media (max-width: 760px) { html body.website-page .page-demo-invite h2 { font-size: 28px !important; } }
