:root {
  color-scheme: light;
  --paper: #f7f4ec;
  --pine: #263833;
  --apricot: #eaa77b;
  --sage: #b7c7b9;
  --secondary: #58665f;
  --line: #d9dfd5;
  --white: #fffdf8;
  font-synthesis: none;
  text-rendering: optimizeLegibility;
  -webkit-font-smoothing: antialiased;
}
* { box-sizing: border-box; }
html { scroll-behavior: smooth; scroll-padding-top: 28px; }
body { margin: 0; color: var(--pine); background: var(--paper); font: 16px/1.65 -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif; }
img { display: block; max-width: 100%; height: auto; }
a { color: inherit; text-underline-offset: 5px; text-decoration-thickness: 1px; }
a:hover { text-decoration-thickness: 2px; }
a:focus-visible { outline: 3px solid currentColor; outline-offset: 5px; border-radius: 3px; }
p, figure { margin: 0; }
h1, h2, h3 { margin: 0; font-weight: 550; letter-spacing: -.045em; text-wrap: balance; }
h1 { font-size: clamp(44px, 4.8vw, 68px); line-height: 1.08; }
h2 { font-size: clamp(34px, 3.5vw, 48px); line-height: 1.16; }
h3 { font-size: 23px; line-height: 1.3; letter-spacing: -.028em; }
em { font-style: normal; color: #657b68; }
.wrap { width: min(1200px, calc(100% - 96px)); margin-inline: auto; }
.site-header { display: flex; align-items: center; justify-content: space-between; gap: 28px; padding-block: 30px; border-bottom: 1px solid var(--line); }
.brand { display: inline-block; flex: 0 0 auto; }
.brand img { width: 167px; height: auto; }
.site-header nav { display: flex; align-items: center; flex-wrap: wrap; gap: 30px; font-size: 14px; font-weight: 500; }
.site-header nav a { text-decoration: none; padding-block: 8px; }
.site-header nav a:hover, .site-header nav a[aria-current] { text-decoration: underline; }
.site-header .language { border-left: 1px solid var(--line); padding-left: 30px; }
.skip { position: absolute; inset: -100px auto auto 12px; z-index: 5; background: var(--pine); color: var(--paper); padding: 10px 18px; border-radius: 6px; }
.skip:focus { top: 12px; }
.preview { background: var(--apricot); padding: 12px 24px; text-align: center; font-size: 13px; }
.hero { display: grid; grid-template-columns: 1.15fr 1fr; align-items: center; gap: 40px; padding-block: 66px 72px; }
.hero-copy { position: relative; z-index: 1; padding-bottom: 8px; }
.status { display: inline-flex; align-items: center; gap: 9px; font-size: 12px; letter-spacing: .13em; text-transform: uppercase; font-weight: 600; margin-bottom: 28px; }
.status span { width: 8px; height: 8px; background: var(--apricot); border-radius: 50%; box-shadow: 0 0 0 5px #eaa77b24; }
.hero-description { max-width: 450px; color: var(--secondary); font-size: 19px; line-height: 1.65; margin-top: 28px; }
.hero-actions { display: flex; align-items: center; flex-wrap: wrap; gap: 26px; margin-top: 32px; }
.button { display: inline-flex; align-items: center; justify-content: center; gap: 24px; min-height: 52px; border-radius: 8px; padding: 12px 23px; font-size: 14px; font-weight: 600; background: var(--pine); color: var(--paper); border: 1px solid var(--pine); text-decoration: none; transition: background-color .15s; }
.button:hover { background: #3a5046; text-decoration: none; }
.button-outline { background: transparent; color: var(--pine); }
.button-outline:hover { background: #e8ede3; }
.text-link { font-size: 14px; font-weight: 600; }
.platform { color: var(--secondary); font-size: 12px; margin-top: 21px; }
.hero-visual { position: relative; display: flex; flex-direction: column; align-items: center; min-width: 0; isolation: isolate; }
.hero-orbit { position: absolute; z-index: -1; inset: 12% -5% auto; opacity: .09; pointer-events: none; transform: rotate(-13deg); }
.hero-orbit img { width: 100%; }
.phone { position: relative; width: 278px; max-width: 100%; border: 7px solid #27332d; border-radius: 42px; overflow: hidden; box-shadow: 0 24px 56px -28px #23382f50, 0 0 0 1px #6b766d; background: #f5f7f9; }
.phone img { width: 100%; }
figcaption { color: var(--secondary); font-size: 11px; line-height: 1.5; text-align: center; margin-top: 22px; }
.features-section { padding-block: 88px 94px; border-top: 1px solid var(--line); }
.eyebrow { font-size: 11px; line-height: 1.6; font-weight: 650; letter-spacing: .12em; text-transform: uppercase; color: var(--secondary); margin-bottom: 17px; }
.section-description { font-size: 18px; line-height: 1.7; color: var(--secondary); }
.section-heading { max-width: 760px; }
.section-heading .section-description { max-width: 560px; margin-top: 23px; }
.feature-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 46px; margin-top: 54px; }
.feature-number { display: block; font-size: 13px; color: #657b68; border-top: 1px solid #bfc9bb; padding-top: 18px; margin-bottom: 24px; }
.feature p { color: var(--secondary); margin-top: 15px; font-size: 15px; line-height: 1.75; }
.timeline-section { display: grid; grid-template-columns: 1fr 1.05fr; align-items: center; gap: 80px; padding: 56px 64px; border-radius: 28px; background: #e9eee4; margin-bottom: 104px; }
.timeline-visual { display: flex; flex-direction: column; align-items: center; }
.timeline-visual .phone { width: 255px; border-width: 6px; border-radius: 38px; box-shadow: 0 20px 50px -28px #23382f50; }
.timeline-copy .section-description { margin-top: 26px; }
.check-list { list-style: none; margin: 29px 0 0; padding: 0; display: grid; gap: 12px; font-size: 14px; }
.check-list li { padding-left: 25px; position: relative; }
.check-list li::before { content: "↗"; position: absolute; left: 0; color: #536c57; }
.privacy-section { padding-block: 86px 82px; background: var(--pine); color: var(--paper); }
.privacy-section .eyebrow { color: #c2cdbc; }
.privacy-intro { display: grid; grid-template-columns: 1fr 1fr; gap: 80px; align-items: center; }
.privacy-intro h2 { font-size: clamp(32px, 3.3vw, 46px); }
.privacy-intro .section-description { color: #d6ded4; font-size: 17px; margin-bottom: 21px; }
.privacy-intro .text-link { color: #edbb97; }
.privacy-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 48px; margin-top: 58px; padding-top: 32px; border-top: 1px solid #55645a; }
.privacy-grid h3 { font-size: 19px; letter-spacing: -.015em; }
.privacy-grid p { color: #c8d3c6; font-size: 14px; line-height: 1.8; margin-top: 13px; }
.closing { display: flex; align-items: center; justify-content: space-between; gap: 40px; padding-block: 80px; }
.closing h2 { font-size: clamp(27px, 2.8vw, 37px); }
.closing p:not(.eyebrow) { max-width: 590px; color: var(--secondary); font-size: 15px; margin-top: 18px; }
.closing .button { flex-shrink: 0; }
.site-footer { border-top: 1px solid var(--line); padding-block: 38px 28px; }
.footer-top { display: flex; justify-content: space-between; align-items: flex-start; gap: 30px; }
.footer-top .brand img { width: 135px; }
.footer-tagline { color: var(--secondary); font-size: 12px; margin-top: 10px; }
.footer-top nav { display: flex; flex-wrap: wrap; gap: 14px 25px; font-size: 13px; padding-top: 8px; }
.footer-top nav a { text-decoration: none; }
.footer-top nav a:hover { text-decoration: underline; }
.footer-bottom { display: flex; justify-content: space-between; gap: 32px; color: var(--secondary); font-size: 11px; margin-top: 32px; }
.footer-bottom p:first-child { max-width: 650px; }
.footer-bottom p:last-child { flex-shrink: 0; }
.legal { padding-block: 70px 85px; }
.legal-intro { max-width: 760px; margin-bottom: 58px; }
.legal h1 { font-size: clamp(40px, 5vw, 62px); }
.legal-intro .section-description { max-width: 650px; margin-top: 22px; font-size: 20px; }
.meta { color: var(--secondary); font-size: 13px; margin-top: 20px; }
.legal-layout { display: grid; grid-template-columns: 240px minmax(0, 720px); gap: 80px; align-items: start; }
.contents { position: sticky; top: 28px; }
.contents .eyebrow { margin-bottom: 15px; }
.contents ol { list-style: none; padding: 0; margin: 0; display: grid; gap: 12px; font-size: 13px; line-height: 1.5; color: var(--secondary); }
.contents a { text-decoration: none; }
.contents a:hover { color: var(--pine); text-decoration: underline; }
.legal-body > section { padding-block: 29px; border-top: 1px solid var(--line); scroll-margin-top: 28px; }
.legal-body h2 { font-size: 24px; line-height: 1.35; letter-spacing: -.025em; margin-bottom: 15px; text-wrap: wrap; }
.legal-body p { font-size: 16px; line-height: 1.85; color: #48584e; }
.legal-body p + p { margin-top: 14px; }
.contact { margin-top: 25px; padding: 29px 32px; border-radius: 16px; background: var(--pine); color: var(--paper); }
.contact p { color: #d3dece; font-size: 14px; }
.contact p:first-of-type { font-size: 20px; color: var(--paper); }
.provider-links { margin-top: 24px; font-size: 13px; color: var(--secondary); }
.screenshot-pending { width: 278px; max-width: 100%; height: 580px; display: grid; place-content: center; border: 1px dashed var(--secondary); border-radius: 38px; color: var(--secondary); }
:lang(zh-Hans) h1 { font-size: clamp(38px, 4.3vw, 59px); line-height: 1.24; letter-spacing: -.045em; }
:lang(zh-Hans) h2 { line-height: 1.3; }
:lang(zh-Hans) .eyebrow { letter-spacing: .1em; }
@media (min-width: 1400px) { .hero { gap: 80px; padding-block: 72px 84px; } .phone { width: 296px; } }
@media (max-width: 1050px) {
  .wrap { width: calc(100% - 64px); }
  .hero { grid-template-columns: 1fr .85fr; gap: 30px; }
  .hero h1 { font-size: 48px; }
  .hero-description { font-size: 17px; }
  .phone { width: 250px; border-radius: 38px; }
  .feature-grid { gap: 28px; }
  .timeline-section { padding: 46px 38px; gap: 44px; }
  .timeline-visual .phone { width: 226px; border-radius: 34px; }
  .privacy-intro { gap: 48px; }
  .privacy-grid { gap: 30px; }
  .legal-layout { grid-template-columns: 200px minmax(0, 1fr); gap: 48px; }
  .footer-top nav { max-width: 460px; justify-content: flex-end; }
}
@media (max-width: 760px) {
  .wrap { width: calc(100% - 44px); }
  .site-header { align-items: center; gap: 20px; padding-block: 23px; }
  .site-header .brand img { width: 130px; }
  .site-header nav { gap: 6px 18px; font-size: 13px; justify-content: flex-end; }
  .site-header nav a:first-child { display: none; }
  .site-header .language { padding-left: 0; border-left: 0; }
  .hero { grid-template-columns: 1fr; gap: 48px; padding-block: 50px 56px; }
  .hero h1 { max-width: 540px; font-size: clamp(42px, 8vw, 60px); }
  .hero-description { max-width: 470px; font-size: 18px; margin-top: 23px; }
  .status { margin-bottom: 25px; }
  .hero-actions { gap: 24px; margin-top: 28px; }
  .platform { margin-top: 18px; }
  .hero-visual { width: min(450px, 100%); justify-self: center; }
  .hero-orbit { inset: 12% 10% auto; }
  .phone { width: 270px; border-width: 6px; border-radius: 40px; }
  .features-section { padding-block: 57px 60px; }
  h2 { font-size: 34px; }
  .section-description { font-size: 16px; }
  .section-heading .section-description { margin-top: 21px; }
  .feature-grid { grid-template-columns: 1fr; gap: 28px; margin-top: 34px; }
  .feature { display: grid; grid-template-columns: 34px minmax(0, 1fr); gap: 9px 16px; border-top: 1px solid var(--line); padding-top: 22px; }
  .feature-number { border: 0; padding: 3px 0 0; margin: 0; grid-row: span 2; }
  .feature h3 { font-size: 22px; }
  .feature p { margin-top: 0; font-size: 15px; }
  .timeline-section { grid-template-columns: 1fr; padding: 36px 24px; gap: 37px; margin-bottom: 60px; border-radius: 20px; }
  .timeline-copy { grid-row: 1; }
  .timeline-visual .phone { width: 250px; border-radius: 36px; }
  .timeline-copy .section-description { margin-top: 20px; }
  .check-list { margin-top: 23px; font-size: 13px; }
  .privacy-section { padding-block: 56px 54px; }
  .privacy-intro { grid-template-columns: 1fr; gap: 25px; }
  .privacy-intro h2 { font-size: 35px; }
  .privacy-intro .section-description { font-size: 16px; }
  .privacy-grid { grid-template-columns: 1fr; gap: 29px; margin-top: 35px; padding-top: 30px; }
  .privacy-grid p { margin-top: 9px; }
  .closing { flex-direction: column; align-items: flex-start; padding-block: 53px; gap: 26px; }
  .closing p:not(.eyebrow) { font-size: 14px; margin-top: 14px; }
  .footer-top, .footer-bottom { flex-direction: column; gap: 24px; }
  .footer-top nav { justify-content: flex-start; }
  .footer-bottom { margin-top: 26px; gap: 15px; }
  .legal { padding-block: 48px 54px; }
  .legal-intro { margin-bottom: 32px; }
  .legal-intro .section-description { font-size: 18px; }
  .legal-layout { grid-template-columns: 1fr; gap: 30px; }
  .contents { position: static; padding: 22px; background: #e9eee4; border-radius: 12px; }
  .contents ol { grid-template-columns: 1fr 1fr; gap: 12px 20px; font-size: 12px; }
  .legal-body h2 { font-size: 23px; }
  .legal-body p { font-size: 15px; }
  .legal-body > section { padding-block: 25px; }
  .contact { padding: 25px; }
  .contact p:first-of-type { font-size: 18px; overflow-wrap: anywhere; }
  :lang(zh-Hans) .hero h1 { font-size: clamp(37px, 7.8vw, 52px); }
}
@media (max-width: 380px) {
  .site-header { gap: 12px; }
  .site-header .brand img { width: 107px; }
  .site-header nav { gap: 4px 12px; font-size: 12px; }
  .hero h1 { font-size: 38px; }
  .hero-actions { gap: 17px; }
  .button { padding-inline: 19px; }
  .hero-description { font-size: 17px; }
  :lang(zh-Hans) .hero h1 { font-size: 34px; }
  .contents ol { grid-template-columns: 1fr; }
}
@media (prefers-reduced-motion: reduce) { html { scroll-behavior: auto; } .button { transition: none; } }
@media (prefers-contrast: more) { :root { --secondary: #35463a; --line: #8c9b8b; } .privacy-grid p, .privacy-intro .section-description, .privacy-section .eyebrow { color: var(--paper); } }
@media print {
  .preview, .site-header nav, .skip, .contents, .hero-orbit, .hero-actions, .site-footer nav { display: none; }
  body { background: white; font-size: 12pt; }
  .wrap { width: 100%; }
  .legal { padding-block: 25px; }
  .legal-layout { display: block; }
  .legal-intro { margin-bottom: 25px; }
  .legal-body > section { break-inside: avoid; }
  .contact, .privacy-section { background: white; color: var(--pine); border: 1px solid var(--line); }
  .contact p, .privacy-section p { color: var(--pine); }
  .phone { box-shadow: none; }
}
