:root { --ink:#17324d; --muted:#607286; --line:#d9e4ef; --paper:#fbfdff; --mint:#e8f2fb; --green:#2167a5; --yellow:#f1b85b; --shadow:0 12px 35px rgba(23,50,77,.10); }
* { box-sizing:border-box; }
html { scroll-behavior:smooth; }
body { margin:0; color:var(--ink); background:var(--paper); font-family:-apple-system,BlinkMacSystemFont,"Noto Sans SC","PingFang SC","Microsoft YaHei",sans-serif; line-height:1.7; }
a { color:inherit; text-decoration:none; }
.container { width:min(1120px, calc(100% - 40px)); margin:auto; }
.site-header { background:rgba(251,253,251,.95); border-bottom:1px solid var(--line); position:sticky; top:0; z-index:10; backdrop-filter:blur(10px); }
.nav-wrap { height:76px; display:flex; align-items:center; justify-content:space-between; }
.brand { display:flex; align-items:center; gap:11px; }
.brand-mark { width:37px; height:37px; display:grid; place-items:center; border-radius:12px; background:var(--green); color:#fff; font-weight:800; font-size:20px; }
.brand strong,.brand small { display:block; line-height:1.25; }.brand strong { font-size:17px; }.brand small { color:var(--muted); font-size:11px; margin-top:3px; }
.source-link { color:var(--green); font-size:14px; font-weight:700; }
.hero { background:linear-gradient(135deg,#eaf4fc 0%,#fffaf1 100%); padding:58px 0 48px; }
.hero-grid { display:grid; grid-template-columns:1.15fr .85fr; gap:55px; align-items:center; }.eyebrow { color:var(--green); font-size:12px; font-weight:800; letter-spacing:.12em; margin:0 0 9px; text-transform:uppercase; }
h1 { font-size:clamp(32px,5vw,53px); letter-spacing:-.06em; line-height:1.17; margin:0 0 16px; }.hero h1 span { color:var(--green); }.hero-copy { color:#48625c; font-size:16px; margin:0 0 21px; }
.search-box { background:#fff; box-shadow:var(--shadow); border-radius:13px; padding:5px; display:flex; max-width:570px; }.search-box input { min-width:0; flex:1; border:0; outline:0; font-size:14px; padding:9px 13px; color:var(--ink); }.search-box button,.button { border:0; border-radius:9px; padding:9px 18px; background:var(--green); color:#fff; font-size:14px; font-weight:700; cursor:pointer; }.search-hint { color:var(--muted); font-size:12px; margin:9px 0 0; }
.hero-note { border:1px solid #c8dced; background:rgba(255,255,255,.67); border-radius:18px; padding:23px; display:flex; gap:14px; }.note-icon { width:30px; height:30px; border-radius:50%; display:grid; place-items:center; background:var(--yellow); font-weight:800; }.hero-note strong { font-size:15px; }.hero-note p { color:var(--muted); font-size:13px; margin:5px 0 0; }
.section { padding:65px 0 0; }.section-heading { display:flex; justify-content:space-between; align-items:end; margin-bottom:22px; }h2 { font-size:28px; letter-spacing:-.04em; line-height:1.3; margin:0; }.category-grid { display:grid; grid-template-columns:repeat(4,1fr); gap:15px; }.category-card { min-height:142px; border:2px solid #c7dced; border-radius:18px; background:#eef6fd; padding:21px; transition:.2s; cursor:pointer; }.category-card:hover { transform:translateY(-3px); box-shadow:var(--shadow); border-color:#6d9fc9; background:#fff; }.category-icon { font-size:29px; display:block; margin-bottom:9px; }.category-card strong { display:block; font-size:17px; }.category-card small { color:var(--muted); font-size:12px; }
.results-section { padding-bottom:75px; }.result-count { color:var(--muted); font-size:13px; }.question-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:15px; }.question-card { border:1px solid var(--line); border-radius:16px; background:#fff; padding:20px; transition:.2s; cursor:pointer; }.question-card .tag { color:var(--green); font-size:12px; font-weight:700; }.question-card h3 { font-size:17px; line-height:1.45; margin:9px 0 9px; }.question-card p { color:var(--muted); font-size:13px; margin:0; }.question-card .arrow { color:var(--green); display:block; text-align:right; font-size:19px; margin-top:13px; }
.official-banner { border-radius:20px; background:var(--ink); color:#f3faf5; padding:31px 34px; display:flex; justify-content:space-between; align-items:center; gap:28px; margin-bottom:75px; }.official-banner .eyebrow { color:#9ed6bd; }.official-banner h2 { font-size:22px; }.official-banner p:not(.eyebrow) { color:#bdd1c9; font-size:13px; margin:8px 0 0; }.button.secondary { background:#fff; color:var(--ink); white-space:nowrap; }
.site-footer { border-top:1px solid var(--line); padding:18px 0; color:var(--muted); font-size:11px; }.site-footer .container { display:flex; justify-content:space-between; gap:20px; }.site-footer a { color:var(--muted); text-decoration:underline; text-underline-offset:2px; }.empty-state { color:var(--muted); background:#fff; border:1px dashed var(--line); border-radius:16px; padding:25px; text-align:center; }.sr-only { position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; border:0; }
.page-heading { background:linear-gradient(135deg,#eaf4fc 0%,#fffaf1 100%); padding:45px 0 48px; }.page-heading h1 { font-size:clamp(31px,5vw,53px); margin:0 0 9px; }.page-heading p:not(.eyebrow) { color:var(--muted); margin:0; }.back-link { color:var(--green); font-size:14px; font-weight:700; display:inline-block; margin-bottom:25px; }.question-list { padding-bottom:84px; }.list-meta { display:flex; justify-content:space-between; color:var(--muted); font-size:13px; margin-bottom:12px; }.question-grid { display:block; }.question-card { display:grid; grid-template-columns:160px 1fr auto; gap:18px; align-items:center; padding:17px 5px; border:0; border-bottom:1px solid var(--line); border-radius:0; background:transparent; transition:background .2s; }.question-card:hover { transform:none; box-shadow:none; background:#f1f7fc; }.question-card .tag { color:var(--green); font-size:12px; font-weight:700; }.question-card h2 { font-size:17px; margin:0; }.question-card p { color:var(--muted); font-size:13px; margin:0; }.question-card .arrow { color:var(--green); font-size:14px; white-space:nowrap; font-weight:700; }.answer-page { max-width:800px; padding-top:58px; padding-bottom:84px; }.answer-lead { background:#eaf4fc; border-left:5px solid var(--green); border-radius:0 14px 14px 0; padding:24px 26px; font-size:18px; line-height:1.85; }.answer-section { border-bottom:1px solid var(--line); padding:30px 0; }.answer-section h2 { font-size:21px; margin-bottom:10px; }.answer-section p,.answer-section li { color:#4f6273; }.answer-section ul { padding-left:22px; }.source-box { background:#f2f7fc; border:1px solid var(--line); border-radius:16px; padding:24px; margin-top:30px; }.source-box p { margin:0 0 16px; }.disclaimer { color:var(--muted); font-size:12px; margin-top:28px; }.bottom-back { margin-top:27px; }.button { display:inline-block; }
.simple-page { max-width:800px; padding-top:55px; padding-bottom:85px; }.simple-page h2 { font-size:20px; margin:0 0 8px; }.simple-page p { color:#4f6273; margin:0 0 32px; }
@media(max-width:800px) { .hero-grid { grid-template-columns:1fr; gap:30px; }.category-grid { grid-template-columns:repeat(2,1fr); }.question-card { grid-template-columns:125px 1fr; gap:12px; }.question-card .arrow { grid-column:2; margin-top:-10px; }.official-banner { align-items:flex-start; flex-direction:column; }.nav-wrap { height:68px; }.source-link { font-size:12px; } }
@media(max-width:520px) { .container { width:min(100% - 28px,1120px); }.hero { padding:55px 0 45px; }.category-grid,.question-grid { grid-template-columns:1fr; }.section { padding-top:52px; }.results-section { padding-bottom:52px; }.official-banner { margin-bottom:52px; padding:25px 22px; }.site-footer .container { display:block; }.site-footer span { display:block; }.site-footer span+span { margin-top:5px; } }
