/* Earth Now: scoped presentation, shared site pages remain independent. */
:root { color-scheme: dark; }
* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body { margin: 0; background: #07121c; color: #eef5f8; font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", "Hiragino Sans", "PingFang SC", sans-serif; line-height: 1.75; }
a { color: #78dfe8; text-underline-offset: .2em; }
a:hover { color: #fff; }
a:focus-visible, summary:focus-visible, video:focus-visible { outline: 3px solid #70e6ef; outline-offset: 5px; }
img { max-width: 100%; }
p, h1, h2, h3 { margin-block-start: 0; }
figure { margin: 0; }
.en-wrap { width: min(1160px, calc(100% - 64px)); margin-inline: auto; }
.en-skip { position: absolute; inset-block-start: 12px; inset-inline-start: 18px; padding: 10px 20px; background: #07121c; transform: translateY(-160%); z-index: 5; }
.en-skip:focus { transform: none; }
.en-hero { position: relative; overflow: hidden; background: radial-gradient(ellipse at 80% 60%, #16465780, transparent 58%), #07121c; padding-block: 24px 80px; border-block-end: 1px solid #233541; }
.en-nav { display: flex; justify-content: space-between; align-items: center; gap: 28px; margin-block-end: 60px; }
.en-back { color: #b2c9d5; font-size: .86rem; text-decoration: none; flex-shrink: 0; }
.en-back span { display: inline-block; margin-inline-end: 10px; }
.en-languages { display: flex; flex-wrap: wrap; justify-content: flex-end; gap: 4px; }
.en-languages a { padding: 8px 11px; min-height: 42px; color: #b2c9d5; font-size: .8rem; text-decoration: none; border-radius: 6px; }
.en-languages a:hover { background: #153343; color: #fff; }
.en-languages a[aria-current] { background: #a4edf1; color: #092a33; font-weight: 700; }
.en-hero-grid { display: grid; grid-template-columns: minmax(0,1.4fr) minmax(0,.8fr); gap: 80px; align-items: center; }
.en-brand { display: flex; align-items: center; gap: 20px; }
.en-brand img { width: 76px; height: 76px; border-radius: 19px; border: 1px solid #365160; }
.en-brand h1 { margin: 0; font-size: 2.05rem; font-weight: 550; letter-spacing: -.04em; line-height: 1.2; }
.en-eyebrow { font-size: .71rem; letter-spacing: .18em; font-weight: 650; color: #79d4df; margin-block-end: 14px; }
.en-brand .en-eyebrow { font-size: .59rem; margin-block-end: 7px; color: #a4c2ce; }
.en-headline { font-size: clamp(2.5rem, 5.2vw, 4.3rem); line-height: 1.22; letter-spacing: -.05em; font-weight: 600; text-wrap: balance; margin-block: 38px 24px; }
.en-lead { font-size: 1.05rem; color: #b4cbd8; max-width: 560px; margin-block-end: 26px; }
.en-pills { display: flex; flex-wrap: wrap; gap: 9px; list-style: none; padding: 0; margin: 0 0 30px; }
.en-pills li { font-size: .76rem; border: 1px solid #355361; color: #ccdde4; padding: 5px 12px; border-radius: 30px; }
.en-actions { display: flex; flex-wrap: wrap; gap: 18px; align-items: center; }
.en-primary { display: inline-flex; flex-direction: column; padding: 14px 22px; border-radius: 8px; background: #b1eef0; color: #082d37; font-size: .92rem; font-weight: 700; text-decoration: none; }
.en-primary:hover { background: #d5f8fa; color: #082d37; }
.en-primary small { font-size: .71rem; font-weight: 500; direction: ltr; }
.en-release { font-size: .76rem; color: #b5c9d2; }
.en-section-links { display: flex; flex-wrap: wrap; gap: 8px 22px; margin-block-start: 28px; font-size: .79rem; }
.en-phone { width: min(100%, 300px); justify-self: center; position: relative; }
.en-phone::before { content: ""; width: 470px; height: 470px; border: 1px solid #2b63704d; border-radius: 50%; position: absolute; top: 15%; left: 50%; transform: translateX(-50%); z-index: 0; pointer-events: none; }
.en-phone img { display: block; width: 100%; height: auto; border-radius: 38px; border: 5px solid #385767; position: relative; background: #000; box-shadow: 0 30px 80px #0006; }
.en-phone figcaption { text-align: center; color: #a0b8c6; font-size: .72rem; margin-block-start: 18px; position: relative; }
.en-main { padding-block: 80px 48px; }
.en-section { margin-block-end: 86px; scroll-margin-block-start: 24px; }
.en-section h2 { font-size: clamp(1.9rem, 3.3vw, 2.8rem); line-height: 1.35; letter-spacing: -.035em; text-wrap: balance; margin-block-end: 18px; font-weight: 600; }
.en-muted { color: #acbfcb; font-size: .92rem; }
.en-demo { display: grid; grid-template-columns: minmax(0,1fr) minmax(0,.68fr); gap: 80px; align-items: center; padding: 48px; background: radial-gradient(ellipse at 100% 0, #153d4880, transparent 70%), #0c1d29; border: 1px solid #294652; border-radius: 24px; }
.en-demo-copy { min-width: 0; }
.en-steps { list-style: none; padding: 0; margin: 32px 0 0; }
.en-steps li { display: flex; gap: 20px; padding-block: 20px; border-block-start: 1px solid #294652; }
.en-step-number { display: grid; place-items: center; flex: 0 0 38px; height: 38px; border-radius: 50%; background: #173c47; color: #9be7eb; font-size: .75rem; font-variant-numeric: tabular-nums; direction: ltr; }
.en-steps h3 { margin-block-end: 6px; font-size: 1.08rem; line-height: 1.5; }
.en-steps p { margin: 0; color: #b2c7d3; font-size: .9rem; }
.en-demo-player { width: min(100%,300px); justify-self: center; }
.en-demo-player video { display: block; width: 100%; height: auto; aspect-ratio: 886 / 1920; background: #000; border: 1px solid #365968; border-radius: 16px; box-shadow: 0 20px 50px #0005; }
.en-demo-player figcaption { margin-block-start: 16px; color: #acc3cf; font-size: .74rem; text-align: center; }
.en-demo-player figcaption a { display: block; margin-block-start: 8px; }
.en-gallery { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 24px; margin-block-start: 34px; }
.en-gallery figure { min-width: 0; }
.en-gallery a { display: block; border-radius: 15px; }
.en-gallery img { display: block; width: 100%; height: auto; border: 1px solid #2b4352; border-radius: 15px; }
.en-gallery figcaption { padding-block-start: 15px; font-size: .83rem; color: #b4cbd8; }
.en-gallery figcaption span { color: #62cbd6; margin-inline-end: 12px; font-size: .7rem; }
.en-features { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 24px; list-style: none; padding: 0; margin: 34px 0 0; }
.en-features li { padding: 28px; border-block-start: 1px solid #517682; background: #101f2b; border-radius: 0 0 12px 12px; }
.en-number { font-size: .72rem; color: #7fe1e8; display: block; margin-block-end: 20px; letter-spacing: .1em; }
.en-features h3 { font-size: 1.2rem; line-height: 1.5; margin-block-end: 12px; }
.en-features p { font-size: .92rem; color: #b2c7d3; margin: 0; }
.en-imagery { display: grid; grid-template-columns: 1fr 1.2fr; gap: 48px; border-block: 1px solid #29414d; padding-block: 42px; }
.en-imagery h2 { font-size: 1.8rem; }
.en-imagery p { color: #b2c7d3; margin-block-end: 20px; }
.en-source-links { display: flex; flex-wrap: wrap; gap: 10px 22px; font-size: .8rem; }
.en-contact { display: grid; grid-template-columns: minmax(0,1fr) auto; align-items: center; gap: 36px; border-block-end: 1px solid #29414d; padding-block: 14px 34px; margin-block-end: 38px; }
.en-contact p { max-width: 680px; color: #b2c7d3; margin: 0; }
.en-contact a { justify-self: start; }
.en-faq-title { font-size: 1.2rem; }
details { border-block-end: 1px solid #29414d; }
summary { font-size: 1rem; padding-block: 20px; cursor: pointer; }
.en-answer { padding: 0 0 24px; color: #b2c7d3; font-size: .92rem; max-width: 920px; }
.en-privacy { padding: 40px; border: 1px solid #29414d; border-radius: 16px; background: #0b1a25; }
.en-privacy h2 { font-size: 1.8rem; }
.en-privacy h3 { font-size: 1rem; margin-block: 26px 8px; }
.en-privacy p { color: #aec5d1; font-size: .89rem; max-width: 960px; }
.en-privacy .en-source-links { margin-block-start: 24px; }
.en-footer { border-block-start: 1px solid #29414d; padding-block: 30px; font-size: .83rem; }
.en-footer .en-wrap { display: flex; gap: 20px; flex-wrap: wrap; justify-content: space-between; }
.en-footer p { margin: 0; color: #90acbb; }
html[dir="rtl"] body { font-family: -apple-system, BlinkMacSystemFont, "Geeza Pro", "Arial", sans-serif; }
html[dir="rtl"] .en-back span { transform: scaleX(-1); }
html[dir="rtl"] .en-headline, html[dir="rtl"] .en-eyebrow, html[dir="rtl"] h1, html[dir="rtl"] h2 { letter-spacing: 0; }
html[lang="zh-Hant"] body { font-family: -apple-system, BlinkMacSystemFont, "PingFang TC", sans-serif; }
@media(max-width: 1000px) {
  .en-nav { flex-direction: column; align-items: flex-start; gap: 16px; margin-block-end: 42px; }
  .en-languages { justify-content: flex-start; }
  .en-hero-grid { grid-template-columns: minmax(0,1.2fr) minmax(0,.8fr); gap: 42px; }
  .en-headline { font-size: 3.1rem; }
  .en-gallery { gap: 16px; }
  .en-features { gap: 16px; }
  .en-features li { padding: 22px; }
  .en-demo { gap: 36px; padding: 32px; }
  .en-contact { grid-template-columns: 1fr; gap: 24px; }
}
@media(max-width: 680px) {
  .en-wrap { width: calc(100% - 40px); }
  .en-hero { padding-block: 20px 48px; }
  .en-nav { gap: 18px; margin-block-end: 34px; }
  .en-languages a { padding: 8px 10px; font-size: .76rem; }
  .en-hero-grid { grid-template-columns: 1fr; gap: 42px; }
  .en-brand img { width: 64px; height: 64px; border-radius: 16px; }
  .en-brand h1 { font-size: 1.9rem; }
  .en-headline { font-size: clamp(2.3rem, 10vw, 3.4rem); margin-block: 28px 22px; }
  .en-lead { font-size: .98rem; }
  .en-phone { width: 255px; }
  .en-main { padding-block: 48px 12px; }
  .en-section { margin-block-end: 56px; }
  .en-demo { grid-template-columns: 1fr; gap: 30px; padding: 26px 20px; border-radius: 18px; }
  .en-steps { margin-block-start: 24px; }
  .en-steps li { gap: 14px; padding-block: 16px; }
  .en-gallery { display: flex; overflow-x: auto; gap: 16px; padding-block-end: 20px; scroll-snap-type: x proximity; }
  .en-gallery figure { flex: 0 0 min(78vw,300px); scroll-snap-align: start; }
  .en-features, .en-imagery { grid-template-columns: 1fr; gap: 20px; }
  .en-imagery { padding-block: 28px; }
  .en-imagery h2 { margin: 0; }
  .en-privacy { padding: 26px 22px; }
}
@media(prefers-reduced-motion:reduce) { html { scroll-behavior: auto; } }