/* DataCalc's styles are loaded only by its introduction pages. */
:root {
  color-scheme:light;
  --dc-bg:#f5f8fc;
  --dc-surface:#ffffff;
  --dc-text:#132640;
  --dc-muted:#54677e;
  --dc-blue:#075fc7;
  --dc-navy:#101d34;
  --dc-line:#dce5ef;
  --dc-soft:#eaf1f8;
  --dc-cyan:#70dcea;
}
* { box-sizing:border-box; }
html { scroll-behavior:smooth; }
body { margin:0; background:var(--dc-bg); color:var(--dc-text); font-family:-apple-system,BlinkMacSystemFont,"Segoe UI","Hiragino Sans","PingFang SC",sans-serif; line-height:1.8; }
a { color:var(--dc-blue); text-underline-offset:.24em; }
a:hover { color:#08478e; }
a:focus-visible,summary:focus-visible,[tabindex]:focus-visible { outline:3px solid var(--dc-blue); outline-offset:5px; }
img { max-width:100%; }
p,h1,h2,h3 { margin-block-start:0; }
h1,h2,h3 { overflow-wrap:anywhere; }
figure { margin:0; }
.dc-wrap { width:min(1120px,calc(100% - 64px)); margin-inline:auto; }
.dc-skip { position:absolute; inset-block-start:12px; inset-inline-start:18px; z-index:5; min-height:44px; padding:10px 20px; background:var(--dc-surface); border-radius:8px; transform:translateY(-180%); }
.dc-skip:focus { transform:none; }
.dc-hero { padding-block:22px 72px; color:#fff; background:radial-gradient(ellipse at 86% 77%,#16435d 0,transparent 45%),radial-gradient(ellipse at 4% 0%,#16345a 0,transparent 54%),var(--dc-navy); border-block-end:1px solid #294358; }
.dc-nav { display:flex; justify-content:space-between; align-items:center; gap:24px; margin-block-end:60px; }
.dc-back { display:inline-flex; align-items:center; min-height:44px; color:#c5d6e8; font-size:.85rem; text-decoration:none; flex-shrink:0; }
.dc-back span { display:inline-block; margin-inline-end:8px; }
.dc-back:hover { color:#fff; }
.dc-languages { display:flex; flex-wrap:wrap; gap:4px; }
.dc-languages a { display:inline-flex; align-items:center; justify-content:center; min-width:44px; min-height:44px; padding:8px 10px; border-radius:8px; color:#c5d6e8; font-size:.78rem; text-decoration:none; }
.dc-languages a:hover { background:#24405c; color:#fff; }
.dc-languages a[aria-current="page"] { background:#d8f8fd; color:#102f4e; font-weight:700; }
.dc-hero a:focus-visible { outline-color:var(--dc-cyan); }
.dc-hero-grid { display:grid; grid-template-columns:minmax(0,1.6fr) minmax(0,1fr); align-items:center; gap:76px; }
.dc-hero-copy { min-width:0; }
.dc-brand { display:flex; align-items:center; gap:16px; }
.dc-brand img { flex:0 0 auto; width:64px; height:64px; border-radius:16px; box-shadow:0 6px 20px #00000026; }
.dc-brand h1 { margin:0; font-size:1.4rem; line-height:1.4; font-weight:700; letter-spacing:-.025em; }
.dc-eyebrow { margin-block-end:10px; color:var(--dc-blue); font-size:.75rem; font-weight:700; letter-spacing:.08em; }
.dc-brand .dc-eyebrow { margin-block-end:3px; color:#bad2e8; font-size:.69rem; letter-spacing:.055em; }
.dc-headline { margin-block:30px 22px; font-size:clamp(2.45rem,4.65vw,3.85rem); line-height:1.25; letter-spacing:-.04em; font-weight:750; white-space:pre-line; text-wrap:balance; overflow-wrap:anywhere; }
.dc-lead { max-width:590px; margin-block-end:24px; color:#c5d6e8; font-size:1.03rem; line-height:1.95; }
.dc-pills { display:flex; flex-wrap:wrap; gap:8px; list-style:none; padding:0; margin:0 0 26px; }
.dc-pills li { max-width:100%; padding:5px 11px; border:1px solid #406078; border-radius:6px; color:#d4e6f6; background:#ffffff05; font-size:.73rem; overflow-wrap:anywhere; }
.dc-actions { display:flex; flex-wrap:wrap; align-items:center; gap:14px 18px; }
.dc-primary { display:inline-flex; align-items:center; justify-content:center; gap:18px; max-width:100%; min-height:50px; padding:13px 22px; border-radius:10px; background:var(--dc-cyan); color:#10334c; font-size:.9rem; font-weight:750; text-decoration:none; box-shadow:0 4px 18px #00102633; overflow-wrap:anywhere; }
.dc-primary:hover { background:#a3eef6; color:#10334c; }
.dc-release { color:#b5c9de; font-size:.76rem; }
.dc-section-links { display:flex; flex-wrap:wrap; gap:4px 24px; margin-block-start:20px; font-size:.8rem; }
.dc-section-links a { display:inline-flex; align-items:center; min-height:44px; color:#cde5f7; }
.dc-section-links a:hover { color:var(--dc-cyan); }
.dc-phone { position:relative; width:min(100%,260px); justify-self:center; }
.dc-phone img { position:relative; display:block; width:100%; height:auto; border:6px solid #263749; border-radius:38px; background:#132138; box-shadow:0 28px 64px #00000040,0 0 0 1px #6a819555; }
.dc-phone figcaption { margin-block-start:18px; text-align:center; color:#bad0e3; font-size:.72rem; }
.dc-main { padding-block:72px 16px; }
.dc-section { margin-block-end:80px; scroll-margin-block-start:24px; }
.dc-section h2 { margin-block-end:18px; font-size:clamp(1.8rem,3vw,2.55rem); line-height:1.4; font-weight:700; letter-spacing:-.035em; text-wrap:balance; }
.dc-muted { max-width:850px; color:var(--dc-muted); font-size:.94rem; }
.dc-features,.dc-steps { display:grid; gap:22px; list-style:none; padding:0; margin:32px 0 0; }
.dc-features { grid-template-columns:repeat(2,minmax(0,1fr)); }
.dc-features li { padding:28px; background:var(--dc-surface); border:1px solid var(--dc-line); border-radius:16px; box-shadow:0 5px 14px #18355003; }
.dc-number { display:block; margin-block-end:18px; color:var(--dc-blue); font-size:.75rem; font-weight:700; letter-spacing:.1em; font-variant-numeric:tabular-nums; }
.dc-features h3,.dc-steps h3 { margin-block-end:12px; font-size:1.17rem; line-height:1.5; }
.dc-features p,.dc-steps p { margin:0; color:var(--dc-muted); font-size:.91rem; }
.dc-example { display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1fr); align-items:center; gap:56px; padding:40px; background:#e9f2fb; border:1px solid #d7e5f4; border-radius:20px; }
.dc-example-copy p:last-child { margin:0; color:var(--dc-muted); font-size:.94rem; }
.dc-example-result { min-width:0; padding:28px; border:1px solid #263e57; border-radius:16px; background:radial-gradient(ellipse at 100% 100%,#193e57 0,transparent 75%),var(--dc-navy); color:#fff; }
.dc-equation { margin-block-end:28px; padding-block-end:20px; border-block-end:1px solid #395169; color:#d0e1f4; font-size:clamp(1.15rem,2.5vw,1.65rem); font-weight:550; letter-spacing:-.02em; font-variant-numeric:tabular-nums; overflow-wrap:anywhere; direction:ltr; text-align:start; }
.dc-result-label { margin-block-end:6px; color:#bad1e8; font-size:.78rem; }
.dc-result { margin-block-end:14px; color:var(--dc-cyan); font-size:clamp(1.9rem,3.3vw,2.75rem); line-height:1.3; font-weight:700; letter-spacing:-.04em; font-variant-numeric:tabular-nums; overflow-wrap:anywhere; }
.dc-example-note { margin:0; color:#b5c9de; font-size:.76rem; }
.dc-gallery { display:grid; grid-auto-flow:column; grid-auto-columns:calc((100% - 48px) / 3); gap:24px; margin-block-start:32px; padding:28px; overflow-x:auto; overscroll-behavior-inline:contain; scroll-snap-type:inline proximity; scroll-padding-inline:28px; scrollbar-color:#688aaa #e5edf6; scrollbar-width:thin; background:var(--dc-soft); border:1px solid var(--dc-line); border-radius:20px; }
.dc-gallery figure { min-width:0; scroll-snap-align:start; }
.dc-gallery a { display:block; border-radius:18px; }
.dc-gallery img { display:block; width:100%; height:auto; border:1px solid #c7d5e5; border-radius:18px; background:#102543; }
.dc-gallery figcaption { padding-block:17px 4px; font-size:.85rem; line-height:1.7; overflow-wrap:anywhere; }
.dc-gallery figcaption span { display:block; margin-block-end:4px; color:var(--dc-blue); font-size:.73rem; font-weight:650; }
.dc-how { padding-block:36px 40px; border-block:1px solid var(--dc-line); }
.dc-steps { grid-template-columns:repeat(3,minmax(0,1fr)); gap:32px; }
.dc-steps li { padding-inline-start:22px; border-inline-start:2px solid #89b7e9; }
.dc-local-note { display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1.3fr); align-items:center; gap:40px; padding:34px 36px; border:1px solid #c7e5eb; border-radius:16px; background:#e2f2f5; }
.dc-local-note h2 { margin:0; font-size:1.75rem; }
.dc-local-note>p { margin:0; color:#355d6d; font-size:.92rem; }
.dc-support-grid { display:grid; grid-template-columns:minmax(0,1.8fr) minmax(0,1fr); align-items:start; gap:48px; margin-block-start:30px; }
.dc-support-grid h3 { margin-block-end:14px; font-size:1.15rem; }
details { border-block-end:1px solid var(--dc-line); }
summary { min-height:44px; padding-block:19px; cursor:pointer; font-size:.96rem; overflow-wrap:anywhere; }
summary::marker { color:var(--dc-blue); }
.dc-answer { margin:0; padding-block:0 22px; color:var(--dc-muted); font-size:.9rem; }
.dc-contact { padding:26px; border:1px solid var(--dc-line); border-radius:14px; background:var(--dc-surface); }
.dc-contact p { color:var(--dc-muted); font-size:.9rem; }
.dc-email { display:flex; flex-wrap:wrap; column-gap:.35em; align-items:center; min-height:44px; margin-block-start:12px; font-size:.82rem; overflow-wrap:anywhere; }
.dc-privacy { padding:38px; border:1px solid var(--dc-line); border-radius:16px; background:#ffffff75; }
.dc-privacy h2 { font-size:1.8rem; }
.dc-updated { color:var(--dc-muted); font-size:.78rem; }
.dc-policy-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:28px 42px; margin-block:30px; }
.dc-policy-grid h3 { margin-block-end:8px; font-size:1rem; }
.dc-policy-grid p { margin:0; color:var(--dc-muted); font-size:.88rem; }
.dc-footer { padding-block:22px; border-block-start:1px solid var(--dc-line); font-size:.8rem; }
.dc-footer .dc-wrap,.dc-footer nav { display:flex; align-items:center; justify-content:space-between; flex-wrap:wrap; gap:10px 24px; }
.dc-footer p { margin:0; color:var(--dc-muted); }
.dc-footer a { display:inline-flex; align-items:center; min-height:44px; }
html[dir="rtl"] body { font-family:-apple-system,BlinkMacSystemFont,"Geeza Pro",Arial,sans-serif; }
html[dir="rtl"] .dc-back span { transform:scaleX(-1); }
html[dir="rtl"] .dc-headline,html[dir="rtl"] .dc-eyebrow,html[dir="rtl"] .dc-result,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) {
  .dc-nav { flex-direction:column; align-items:flex-start; gap:12px; margin-block-end:38px; }
  .dc-hero-grid { grid-template-columns:minmax(0,1.3fr) minmax(0,1fr); gap:36px; }
  .dc-headline { font-size:clamp(2.25rem,4.5vw,3.2rem); }
  .dc-features { gap:18px; }
  .dc-example { gap:30px; padding:30px; }
  .dc-example-result { padding:24px; }
  .dc-gallery { grid-auto-columns:calc((100% - 24px) / 2.4); padding:24px; scroll-padding-inline:24px; }
  .dc-support-grid { grid-template-columns:minmax(0,1.5fr) minmax(0,1fr); gap:30px; }
}
@media(max-width:680px) {
  .dc-wrap { width:calc(100% - 40px); }
  .dc-hero { padding-block:14px 44px; }
  .dc-nav { margin-block-end:30px; }
  .dc-languages { gap:2px; }
  .dc-languages a { padding:8px 9px; font-size:.76rem; }
  .dc-hero-grid { grid-template-columns:minmax(0,1fr); gap:40px; }
  .dc-brand img { width:56px; height:56px; border-radius:14px; }
  .dc-brand h1 { font-size:1.28rem; }
  .dc-headline { margin-block:26px 20px; font-size:clamp(2.15rem,8.5vw,3.2rem); }
  .dc-lead { font-size:.96rem; line-height:1.9; }
  .dc-phone { width:min(244px,100%); }
  .dc-main { padding-block:46px 8px; }
  .dc-section { margin-block-end:54px; }
  .dc-section h2 { font-size:clamp(1.7rem,6.5vw,2.15rem); }
  .dc-features,.dc-steps,.dc-example,.dc-local-note,.dc-support-grid,.dc-policy-grid { grid-template-columns:minmax(0,1fr); gap:24px; }
  .dc-features li { padding:24px; }
  .dc-gallery { grid-auto-columns:min(68vw,260px); gap:22px; padding:22px; scroll-padding-inline:22px; border-radius:16px; }
  .dc-example,.dc-local-note,.dc-privacy { padding:26px 22px; }
  .dc-example-result { padding:22px; }
  .dc-equation { margin-block-end:22px; font-size:1.3rem; }
  .dc-result { font-size:2.25rem; }
  .dc-local-note h2 { font-size:1.7rem; }
  .dc-privacy .dc-email { font-size:.78rem; }
  .dc-footer .dc-wrap { align-items:flex-start; }
}
@media(max-width:360px) {
  .dc-wrap { width:calc(100% - 32px); }
  .dc-example,.dc-local-note,.dc-privacy { padding:22px 18px; }
  .dc-example-result { padding:20px 16px; }
  .dc-equation { font-size:1.13rem; }
  .dc-result { font-size:1.95rem; }
  .dc-contact { padding:22px; }
}
@media(prefers-reduced-motion:reduce) {
  html { scroll-behavior:auto; }
  .dc-gallery { scroll-snap-type:none; }
}
