:root {
  --ink: #20273a;
  --muted: #69728a;
  --paper: #f7f7fc;
  --surface: #ffffff;
  --surface-2: #f0edf9;
  --line: #e6e6f0;
  --purple: #7657ff;
  --purple-dark: #5835ed;
  --purple-soft: #eee9ff;
  --blue: #12a8dd;
  --blue-soft: #e8f7fd;
  --coral: #ff5f7e;
  --coral-soft: #fff0f3;
  --yellow: #f3b928;
  --yellow-soft: #fff7d9;
  --green: #2bbf83;
  --max: 1460px;
  --shadow: 0 18px 55px rgba(67, 50, 123, .10);
  --shadow-sm: 0 8px 24px rgba(67, 50, 123, .08);
}

html[data-theme="dark"] {
  --ink: #f4f3fb;
  --muted: #aaa8bc;
  --paper: #171622;
  --surface: #22202e;
  --surface-2: #2a2738;
  --line: #373446;
  --purple-soft: #332b55;
  --blue-soft: #183542;
  --coral-soft: #41252f;
  --yellow-soft: #40381f;
  --shadow: 0 18px 55px rgba(0,0,0,.25);
  --shadow-sm: 0 8px 24px rgba(0,0,0,.18);
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body { margin: 0; color: var(--ink); background: radial-gradient(circle at 8% 10%, rgba(118,87,255,.07), transparent 28rem), radial-gradient(circle at 94% 18%, rgba(18,168,221,.08), transparent 24rem), var(--paper); font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", "PingFang SC", "Microsoft YaHei", sans-serif; line-height: 1.68; -webkit-font-smoothing: antialiased; }
a { color: inherit; text-decoration: none; }
button, input { font: inherit; }
img { max-width: 100%; }
::selection { color: white; background: var(--purple); }
.skip-link { position: fixed; left: 1rem; top: -5rem; z-index: 99; padding: .65rem 1rem; color: white; background: var(--purple); border-radius: 999px; }
.skip-link:focus { top: 1rem; }
.container { width: min(var(--max), calc(100% - 2.5rem)); margin: 0 auto; }
.narrow { width: min(820px, calc(100% - 2rem)); margin: 0 auto; }
.section { padding: 5.5rem 0; }
.section-sm { padding: 3.5rem 0; }

.site-header { position: sticky; top: 0; z-index: 30; border-bottom: 1px solid var(--line); background: color-mix(in srgb, var(--surface) 92%, transparent); backdrop-filter: blur(18px); }
.header-inner { width: min(var(--max), calc(100% - 2rem)); min-height: 82px; margin: 0 auto; display: flex; align-items: center; gap: 1.2rem; }
.brand { display: inline-flex; align-items: center; gap: .7rem; flex: 0 0 auto; font-weight: 900; letter-spacing: -.035em; }
.brand-mark { display: grid; width: 40px; height: 40px; place-items: center; color: white; background: linear-gradient(135deg, var(--purple), #a94eff); border-radius: 13px; box-shadow: 0 8px 20px rgba(118,87,255,.28); font-size: 1.2rem; }
.brand small { display: block; color: var(--muted); font-size: .58rem; font-weight: 800; letter-spacing: .14em; }
.site-nav { display: flex; align-items: center; gap: 1rem; min-width: 0; margin-left: auto; }
.nav-main, .nav-actions { display: flex; align-items: center; gap: .25rem; }
.nav-main a { padding: .7rem .72rem; color: var(--ink); border-radius: 12px; font-size: .88rem; font-weight: 760; white-space: nowrap; }
.nav-main a:hover { color: var(--purple); background: var(--purple-soft); }
.nav-main a[aria-current="page"] { color: var(--purple-dark); background: var(--purple-soft); }
.nav-actions { gap: .45rem; }
.nav-chip { display: inline-flex; align-items: center; justify-content: center; min-height: 42px; padding: .62rem .82rem; border: 0; border-radius: 13px; font-size: .82rem; font-weight: 820; white-space: nowrap; cursor: pointer; }
.chip-blue { color: #087ea9; background: var(--blue-soft); }
.chip-red { color: #e33258; background: var(--coral-soft); }
.chip-purple { color: white; background: linear-gradient(135deg, var(--purple), #8c4fff); box-shadow: 0 8px 18px rgba(118,87,255,.25); }
.theme-toggle { color: var(--ink); border: 1px solid var(--line); background: var(--surface); }
.menu-toggle { display: none; margin-left: auto; padding: .52rem .8rem; color: var(--ink); border: 1px solid var(--line); border-radius: 10px; background: var(--surface); }

.eyebrow { margin: 0 0 1rem; color: var(--purple); font-size: .76rem; font-weight: 900; letter-spacing: .14em; text-transform: uppercase; }
.eyebrow::before { content: ""; display: inline-block; width: 28px; height: 3px; margin: 0 .6rem .18rem 0; background: linear-gradient(90deg, var(--purple), var(--coral)); border-radius: 9px; }
.section-title { max-width: 800px; margin: 0; font-size: clamp(1.85rem, 3.3vw, 3.2rem); line-height: 1.1; letter-spacing: -.04em; }
.section-lead { max-width: 720px; margin: 1rem 0 0; color: var(--muted); }
.section-head { display: flex; justify-content: space-between; align-items: end; gap: 2rem; margin-bottom: 2.2rem; }
.text-link { color: var(--purple); font-weight: 830; }
.text-link:hover { text-decoration: underline; text-underline-offset: 4px; }

.hero { position: relative; overflow: hidden; padding: 4.5rem 0; border-bottom: 1px solid var(--line); }
.hero::before { content: ""; position: absolute; width: 520px; height: 520px; left: -210px; top: -220px; border-radius: 50%; background: rgba(118,87,255,.10); }
.hero::after { content: ""; position: absolute; width: 420px; height: 420px; right: -150px; bottom: -250px; border-radius: 50%; background: rgba(255,95,126,.09); }
.hero-inner { position: relative; z-index: 1; display: grid; grid-template-columns: minmax(0, 1.05fr) minmax(440px, .95fr); gap: 4rem; align-items: center; min-height: 570px; }
.hero h1 { max-width: 900px; margin: 0; font-size: clamp(2.7rem, 4.8vw, 4.8rem); line-height: 1.06; letter-spacing: -.055em; }
.hero h1 > span { display: block; }
.hero h1 em { color: var(--purple); font-style: normal; background: linear-gradient(90deg, var(--purple), #ba41ba); background-clip: text; -webkit-background-clip: text; -webkit-text-fill-color: transparent; }
.hero-copy { max-width: 720px; margin: 1.5rem 0 0; color: var(--muted); font-size: 1.06rem; }
.hero-actions { display: flex; flex-wrap: wrap; gap: .8rem; margin-top: 1.8rem; }
.btn { display: inline-flex; align-items: center; justify-content: center; min-height: 48px; padding: .75rem 1.15rem; border: 1px solid var(--line); border-radius: 13px; font-weight: 820; transition: .2s ease; }
.btn:hover { transform: translateY(-2px); box-shadow: var(--shadow-sm); }
.btn-primary { color: white; border-color: var(--purple); background: linear-gradient(135deg, var(--purple), #914dff); }
.btn-ghost { color: var(--ink); background: var(--surface); }
.hero-note { display: flex; flex-wrap: wrap; gap: 1rem; margin-top: 1.8rem; color: var(--muted); font-size: .82rem; }
.hero-note span::before { content: "✓"; margin-right: .38rem; color: var(--green); font-weight: 900; }

.atlas-board { position: relative; padding: 1.2rem; border: 1px solid var(--line); border-radius: 30px; background: var(--surface); box-shadow: var(--shadow); transform: rotate(1deg); }
.atlas-board::before { content: ""; position: absolute; inset: -10px 18px auto -10px; height: 55%; z-index: -1; border-radius: 30px; background: linear-gradient(135deg, rgba(118,87,255,.22), rgba(18,168,221,.14)); transform: rotate(-3deg); }
.atlas-top { display: flex; justify-content: space-between; padding: .45rem .4rem 1rem; font-size: .82rem; font-weight: 850; }
.atlas-top strong { color: var(--green); font-size: .74rem; }
.atlas-grid { display: grid; grid-template-columns: 1fr 1fr; gap: .8rem; }
.atlas-tile { display: flex; min-height: 145px; padding: 1.1rem; border-radius: 20px; flex-direction: column; justify-content: flex-end; transition: .2s ease; }
.atlas-tile:hover { transform: translateY(-3px) rotate(-1deg); }
.atlas-tile b { font-size: 1.3rem; }
.atlas-tile span { margin-top: .25rem; color: color-mix(in srgb, currentColor 65%, transparent); font-size: .8rem; }
.tile-purple { color: #5837d8; background: var(--purple-soft); }
.tile-blue { color: #087fa8; background: var(--blue-soft); }
.tile-yellow { color: #9d7000; background: var(--yellow-soft); }
.tile-coral { color: #d93b5d; background: var(--coral-soft); }
.atlas-stats { display: grid; grid-template-columns: repeat(3, 1fr); gap: .5rem; margin-top: .8rem; }
.atlas-stats span { padding: .8rem .5rem; color: var(--muted); border: 1px solid var(--line); border-radius: 14px; text-align: center; font-size: .72rem; }
.atlas-stats strong { display: block; color: var(--ink); font-size: 1.25rem; }

.route-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 1rem; }
.route-card, .article-card, .topic-card, .tool-card, .region-card { border: 1px solid var(--line); background: var(--surface); box-shadow: var(--shadow-sm); }
.route-card { position: relative; min-height: 215px; overflow: hidden; padding: 1.35rem; border-radius: 22px; transition: .2s ease; }
.route-card::before { content: ""; position: absolute; left: 0; right: 0; top: 0; height: 5px; background: var(--purple); }
.route-card:nth-child(4n+2)::before { background: var(--blue); }
.route-card:nth-child(4n+3)::before { background: var(--yellow); }
.route-card:nth-child(4n+4)::before { background: var(--coral); }
.route-card:hover { transform: translateY(-5px); box-shadow: var(--shadow); }
.route-no { color: var(--purple); font: 850 .74rem ui-monospace, SFMono-Regular, Menlo, monospace; }
.route-card h3 { margin: 2.1rem 0 .65rem; font-size: 1.2rem; line-height: 1.28; }
.route-card p { margin: 0; color: var(--muted); font-size: .88rem; }
.question-card { min-height: 195px; }
.risk-card { background: linear-gradient(150deg, var(--surface), var(--coral-soft)); }
.risk-grid { margin-top: 1rem; }

.article-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 1rem; }
.article-card { display: flex; min-height: 315px; padding: 1.4rem; border-radius: 22px; flex-direction: column; transition: .2s ease; }
.article-card:hover { transform: translateY(-4px); box-shadow: var(--shadow); }
.article-card.featured { grid-column: span 2; color: white; border: 0; background: linear-gradient(135deg, #6448ed, #974dff 65%, #c04dba); }
.article-card.featured .article-meta, .article-card.featured p { color: rgba(255,255,255,.76); }
.article-card.featured .text-link { color: white; }
.article-meta { display: flex; gap: .7rem; color: var(--muted); font-size: .72rem; font-weight: 800; text-transform: uppercase; }
.article-card h3 { margin: 2.8rem 0 .8rem; font-size: clamp(1.25rem, 2vw, 1.75rem); line-height: 1.22; letter-spacing: -.025em; }
.article-card p { margin: 0 0 1rem; color: var(--muted); font-size: .9rem; }
.article-card .text-link { margin-top: auto; }
.tag-row { display: flex; flex-wrap: wrap; gap: .45rem; }
.tag { display: inline-flex; padding: .27rem .55rem; color: var(--muted); border: 1px solid var(--line); border-radius: 999px; background: color-mix(in srgb, var(--surface-2) 60%, transparent); font-size: .71rem; }

.topic-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 1rem; }
.topic-card { padding: 1.4rem; border-radius: 22px; }
.topic-card h3 { margin: .65rem 0; font-size: 1.25rem; }
.topic-card p { margin: 0 0 1rem; color: var(--muted); font-size: .88rem; }
.profile-status { display: inline-flex; padding: .35rem .65rem; color: var(--purple-dark); border-radius: 999px; background: var(--purple-soft); font-size: .72rem; font-weight: 850; }
.status-blue { color: #087fa8; background: var(--blue-soft); }
.status-yellow { color: #986900; background: var(--yellow-soft); }
.keyword-cloud { display: flex; flex-wrap: wrap; gap: .45rem; }
.keyword-cloud a, .keyword-cloud span { padding: .3rem .58rem; color: var(--muted); border-radius: 8px; background: var(--surface-2); font-size: .74rem; }
.keyword-cloud a:hover { color: white; background: var(--purple); }

.brand-band { position: relative; overflow: hidden; padding: 3rem; color: white; border-radius: 28px; background: linear-gradient(120deg, #563ae2, #814fff 58%, #b84cbf); box-shadow: 0 22px 60px rgba(99,66,216,.24); }
.brand-band::after { content: "AIRPORT PICKS"; position: absolute; right: -1rem; bottom: -2.2rem; color: rgba(255,255,255,.10); font-size: clamp(4rem, 11vw, 9rem); font-weight: 950; line-height: 1; letter-spacing: -.08em; white-space: nowrap; }
.brand-band > * { position: relative; z-index: 1; }
.brand-band .eyebrow { color: #eadfff; }
.brand-band .eyebrow::before { background: white; }
.brand-band h2 { max-width: 760px; margin: 0; font-size: clamp(1.9rem, 3.8vw, 3.35rem); line-height: 1.08; letter-spacing: -.045em; }
.brand-band p { max-width: 700px; color: rgba(255,255,255,.76); }
.brand-band .btn { color: #5b3bd7; border: 0; background: white; }

.recommend-container { width: min(1120px, calc(100% - 2.5rem)); margin: 0 auto; }
.recommend-page-hero { padding: 2.7rem 0 2.2rem; border-bottom: 1px solid var(--line); background: color-mix(in srgb, var(--surface-2) 45%, var(--surface)); }
.recommend-page-hero .crumbs { margin-bottom: 1.1rem; }
.recommend-page-hero .eyebrow { margin-bottom: .55rem; font-size: .66rem; }
.recommend-page-hero h1 { max-width: 850px; margin: 0; font-size: clamp(1.75rem, 2.3vw, 2.1rem); line-height: 1.2; letter-spacing: -.025em; }
.recommend-page-hero > .recommend-container > p:last-child { max-width: 760px; margin: .75rem 0 0; color: var(--muted); font-size: .9rem; }
.recommend-page-body { padding: 2rem 0 4rem; }
.affiliate-disclosure { display: flex; gap: .7rem; margin-bottom: 1rem; padding: .8rem .9rem; color: var(--muted); border: 1px solid color-mix(in srgb, var(--yellow) 34%, var(--line)); border-radius: 12px; background: var(--yellow-soft); font-size: .78rem; }
.affiliate-disclosure strong { flex: 0 0 auto; color: var(--ink); }
.airport-recommend-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1rem; }
.airport-card { position: relative; display: flex; min-height: 405px; padding: 1.3rem; overflow: hidden; border: 1px solid var(--line); border-radius: 18px; background: var(--surface); box-shadow: var(--shadow-sm); flex-direction: column; }
.airport-card::after { content: ""; position: absolute; width: 145px; height: 145px; right: -78px; top: -82px; border: 26px solid var(--purple-soft); border-radius: 50%; }
.airport-card:nth-child(2)::after { border-color: var(--blue-soft); }
.airport-card-top { position: relative; z-index: 1; display: flex; align-items: center; justify-content: space-between; gap: 1rem; }
.airport-rank { color: color-mix(in srgb, var(--purple) 66%, var(--muted)); font: 900 .7rem ui-monospace, SFMono-Regular, Menlo, monospace; letter-spacing: .12em; }
.airport-card h2 { position: relative; z-index: 1; margin: 1.65rem 0 .55rem; font-size: clamp(1.35rem, 2vw, 1.55rem); letter-spacing: -.025em; }
.airport-coupon { display: grid; grid-template-columns: auto minmax(0, 1fr) auto; gap: .55rem; align-items: center; margin: .9rem 0; padding: .65rem .7rem; border: 1px dashed color-mix(in srgb, var(--purple) 42%, var(--line)); border-radius: 10px; background: color-mix(in srgb, var(--purple-soft) 48%, var(--surface)); }
.airport-coupon span { color: var(--muted); font-size: .72rem; font-weight: 800; }
.airport-coupon code { color: var(--purple-dark); font-family: ui-monospace, "SFMono-Regular", Consolas, monospace; font-size: .9rem; font-weight: 900; letter-spacing: 0; }
.airport-coupon button { padding: .34rem .55rem; color: var(--purple); border: 1px solid color-mix(in srgb, var(--purple) 32%, var(--line)); border-radius: 7px; background: var(--surface); font: inherit; font-size: .68rem; font-weight: 850; cursor: pointer; }
.airport-coupon button:hover { color: white; border-color: var(--purple); background: var(--purple); }
.airport-summary { max-width: 640px; margin: 0 0 .9rem; color: var(--muted); font-size: .84rem; }
.airport-facts { display: grid; gap: .5rem; margin: 0 0 .85rem; }
.airport-facts div { padding: .65rem .75rem; border-radius: 10px; background: var(--surface-2); }
.airport-facts dt { margin-bottom: .25rem; color: var(--muted); font-size: .7rem; font-weight: 850; letter-spacing: .08em; text-transform: uppercase; }
.airport-facts dd { margin: 0; font-size: .8rem; }
.airport-card-actions { display: flex; flex-wrap: wrap; gap: .55rem; margin-top: auto; padding-top: 1rem; }
.airport-card-actions .btn { min-width: 116px; padding: .68rem .85rem; justify-content: center; font-size: .78rem; }
.airport-link-note { margin: .85rem 0 0; color: var(--muted); font-size: .7rem; }
.recommend-method { padding-top: 3rem; }
.recommend-method h2 { margin: 0 0 1rem; font-size: clamp(1.5rem, 2.2vw, 1.85rem); }

.page-hero { position: relative; overflow: hidden; padding: 2.7rem 0 2.2rem; border-bottom: 1px solid var(--line); background: color-mix(in srgb, var(--surface-2) 42%, var(--surface)); }
.page-hero::after { content: ""; position: absolute; width: 170px; height: 170px; right: 8%; top: -118px; border: 28px solid rgba(118,87,255,.055); border-radius: 50%; }
.page-hero .container { width: min(1180px, calc(100% - 2.5rem)); }
.page-hero .eyebrow { margin-bottom: .55rem; font-size: .66rem; }
.page-hero h1 { position: relative; z-index: 1; max-width: 920px; margin: 0; font-size: clamp(1.75rem, 2.3vw, 2.1rem); line-height: 1.2; letter-spacing: -.025em; }
.page-hero p:not(.eyebrow) { position: relative; z-index: 1; max-width: 820px; margin: .75rem 0 0; color: var(--muted); font-size: .9rem; }
.page-hero + .section { padding-top: 2.6rem; }
.page-hero + .section-sm { padding-top: 2rem; }
.crumbs { margin-bottom: 1.3rem; color: var(--muted); font-size: .8rem; }

.filter-bar { position: sticky; top: 82px; z-index: 10; padding: .9rem 0; border-bottom: 1px solid var(--line); background: color-mix(in srgb, var(--surface) 92%, transparent); backdrop-filter: blur(15px); }
.filter-inner { display: flex; gap: .55rem; overflow-x: auto; scrollbar-width: none; }
.filter-inner::-webkit-scrollbar { display: none; }
.filter-btn { flex: 0 0 auto; padding: .52rem .78rem; color: var(--muted); border: 1px solid var(--line); border-radius: 999px; background: var(--surface); cursor: pointer; }
.filter-btn.active, .filter-btn:hover { color: white; border-color: var(--purple); background: var(--purple); }
.search-wrap { margin: 2rem 0; }
.search-input { width: 100%; padding: 1rem 1.1rem; color: var(--ink); border: 1px solid var(--line); outline: 0; border-radius: 14px; background: var(--surface); box-shadow: var(--shadow-sm); }
.search-input:focus { border-color: var(--purple); box-shadow: 0 0 0 4px rgba(118,87,255,.10); }
.tool-section { padding: 1.4rem 0 3rem; }
.tool-section h2 { display: flex; align-items: center; justify-content: space-between; margin: 0 0 1rem; font-size: 1.6rem; }
.tool-section h2 small { color: var(--muted); font: 750 .7rem ui-monospace, monospace; }
.tool-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: .8rem; }
.tool-card { display: flex; min-height: 165px; padding: 1.15rem; border-radius: 18px; flex-direction: column; transition: .2s ease; }
.tool-card:hover { transform: translateY(-3px); border-color: color-mix(in srgb, var(--purple) 45%, var(--line)); box-shadow: var(--shadow); }
.tool-card h3 { margin: 0 0 .4rem; }
.tool-card p { margin: 0 0 1rem; color: var(--muted); font-size: .82rem; }
.tool-card .text-link { margin-top: auto; font-size: .8rem; }
.empty-state { display: none; padding: 3rem 0; color: var(--muted); text-align: center; }

.matrix { width: 100%; overflow: hidden; border-collapse: separate; border-spacing: 0; border: 1px solid var(--line); border-radius: 20px; background: var(--surface); box-shadow: var(--shadow-sm); }
.matrix th, .matrix td { padding: 1rem; text-align: left; border-bottom: 1px solid var(--line); }
.matrix th { color: var(--purple); background: var(--purple-soft); font-size: .76rem; letter-spacing: .06em; text-transform: uppercase; }
.matrix td { color: var(--muted); }
.matrix td strong { color: var(--ink); }
.matrix tr:last-child td { border-bottom: 0; }
.region-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 1rem; }
.region-card { min-height: 190px; padding: 1.3rem; border-radius: 22px; }
.region-card h3 { margin: 0 0 .7rem; font-size: 1.3rem; }
.region-card p { color: var(--muted); font-size: .88rem; }

.article-header { padding: 3.5rem 0 2.5rem; border-bottom: 1px solid var(--line); background: linear-gradient(145deg, var(--surface), var(--purple-soft)); }
.article-header h1 { max-width: 960px; margin: .7rem 0 .9rem; font-size: clamp(1.85rem, 2.3vw, 2.3rem); line-height: 1.18; letter-spacing: -.025em; }
.article-deck { max-width: 780px; color: var(--muted); font-size: .92rem; }
.article-byline { display: flex; flex-wrap: wrap; gap: .9rem; margin-top: 1.05rem; color: var(--muted); font-size: .72rem; font-weight: 750; }
.article-layout { display: grid; grid-template-columns: minmax(0, 1fr) 280px; gap: 3.5rem; align-items: start; padding: 3rem 0 5rem; }
.prose { min-width: 0; }
.prose h2 { margin: 2.35rem 0 .8rem; font-size: clamp(1.35rem, 2vw, 1.65rem); line-height: 1.24; letter-spacing: -.025em; scroll-margin-top: 110px; }
.prose h3 { margin: 2rem 0 .8rem; }
.prose p, .prose li { color: var(--muted); }
.prose strong { color: var(--ink); }
.prose a { color: var(--purple); text-decoration: underline; text-underline-offset: 3px; }
.prose blockquote { margin: 1.5rem 0; padding: 1rem 1.2rem; color: var(--ink); border-left: 4px solid var(--purple); border-radius: 0 12px 12px 0; background: var(--purple-soft); }
.prose table { width: 100%; margin: 1.5rem 0; border-collapse: collapse; }
.prose th, .prose td { padding: .8rem; border: 1px solid var(--line); text-align: left; }
.article-aside { position: sticky; top: 110px; padding: 1.15rem; border: 1px solid var(--line); border-radius: 18px; background: var(--surface); box-shadow: var(--shadow-sm); }
.article-aside strong { display: block; margin-bottom: .7rem; }
.toc a { display: block; padding: .35rem 0; color: var(--muted); font-size: .82rem; }
.toc a:hover { color: var(--purple); }
.notice { margin-bottom: 1rem; padding: 1rem 1.1rem; color: #b02d4d; border: 1px solid color-mix(in srgb, var(--coral) 35%, var(--line)); border-radius: 14px; background: var(--coral-soft); }

/* Homepage: calm editorial portal, aligned with inner pages */
.home-classic { background: linear-gradient(180deg, color-mix(in srgb, var(--surface-2) 42%, var(--paper)) 0, var(--paper) 48rem); }
.classic-home-hero { position: relative; overflow: hidden; padding: 4.6rem 0 4.15rem; border-bottom: 1px solid var(--line); }
.classic-home-hero::before { content: ""; position: absolute; width: 34rem; height: 34rem; right: -13rem; top: -18rem; border: 5rem solid rgba(118,87,255,.055); border-radius: 50%; }
.classic-home-grid { position: relative; z-index: 1; display: grid; grid-template-columns: minmax(370px, .84fr) minmax(0, 1.16fr); gap: clamp(2.35rem, 4vw, 4.8rem); align-items: center; min-height: 500px; }
.network-globe { position: relative; width: min(100%, 560px); margin: 0; padding: 1.5rem; justify-self: center; border: 1px solid var(--line); border-radius: 42% 58% 48% 52% / 55% 42% 58% 45%; background: color-mix(in srgb, var(--surface) 88%, transparent); box-shadow: var(--shadow); }
.network-globe::before, .network-globe::after { content: ""; position: absolute; z-index: -1; border-radius: 50%; }
.network-globe::before { width: 42%; height: 42%; left: -6%; bottom: -6%; background: rgba(18,168,221,.10); }
.network-globe::after { width: 34%; height: 34%; right: -4%; top: -5%; background: rgba(118,87,255,.11); }
.network-globe img { display: block; width: 100%; height: auto; }
.network-globe figcaption { position: absolute; left: 2rem; bottom: 1.45rem; padding: .42rem .7rem; color: var(--muted); border: 1px solid var(--line); border-radius: 999px; background: color-mix(in srgb, var(--surface) 91%, transparent); font-size: .68rem; font-weight: 750; }
.classic-home-copy h1 { max-width: 720px; margin: 0; font-family: Georgia, "Noto Serif SC", "Songti SC", serif; font-size: clamp(2rem, 2.75vw, 2.85rem); font-weight: 650; line-height: 1.16; letter-spacing: -.03em; }
.classic-home-copy > p:not(.eyebrow) { max-width: 720px; margin: 1.05rem 0 0; color: var(--muted); font-size: .92rem; }
.classic-home-facts { display: flex; flex-wrap: wrap; gap: .65rem 1.5rem; margin-top: 2rem; padding-top: 1.3rem; border-top: 1px solid var(--line); color: var(--muted); font-size: .8rem; }
.classic-home-facts b { margin-right: .28rem; color: var(--ink); font-size: 1.05rem; }
.classic-home-keywords { display: flex; flex-wrap: wrap; gap: .34rem; margin-top: 1.15rem; padding-top: 1rem; border-top: 1px solid var(--line); }
.classic-home-keywords > span { width: 100%; margin-bottom: .1rem; color: var(--muted); font-size: .7rem; font-weight: 850; letter-spacing: .08em; }
.classic-home-keywords a { padding: .27rem .55rem; color: var(--muted); border: 1px solid var(--line); border-radius: 999px; background: color-mix(in srgb, var(--surface) 82%, transparent); font-size: .7rem; transition: .18s ease; }
.classic-home-keywords a:hover { color: white; border-color: var(--purple); background: var(--purple); }
.classic-home-keywords .more { color: var(--purple); border-color: color-mix(in srgb, var(--purple) 32%, var(--line)); font-weight: 800; }
.home-classic .section-title { font-size: clamp(1.75rem, 2.6vw, 2.6rem); line-height: 1.13; }

.home-quick-section { padding: 4.8rem 0; border-bottom: 1px solid var(--line); background: color-mix(in srgb, var(--surface) 58%, transparent); }
.home-quick-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 1rem; }
.home-quick-card { position: relative; min-height: 220px; padding: 1.4rem; overflow: hidden; border: 1px solid var(--line); border-radius: 22px; background: var(--surface); box-shadow: var(--shadow-sm); transition: .2s ease; }
.home-quick-card::after { content: ""; position: absolute; width: 105px; height: 105px; right: -45px; bottom: -52px; border: 18px solid var(--purple-soft); border-radius: 50%; }
.home-quick-card:nth-child(2n)::after { border-color: var(--blue-soft); }
.home-quick-card:nth-child(3n)::after { border-color: var(--yellow-soft); }
.home-quick-card:hover { transform: translateY(-4px); border-color: color-mix(in srgb, var(--purple) 35%, var(--line)); box-shadow: var(--shadow); }
.home-quick-card > span { display: inline-flex; padding: .3rem .58rem; color: var(--purple-dark); border-radius: 999px; background: var(--purple-soft); font-size: .7rem; font-weight: 850; }
.home-quick-card h3 { margin: 1.8rem 0 .55rem; font-size: 1.32rem; }
.home-quick-card p { max-width: 270px; margin: 0; color: var(--muted); font-size: .86rem; }
.home-quick-card b { display: block; margin-top: 1.4rem; color: var(--purple); font-size: .78rem; }

.home-latest { border-bottom: 1px solid var(--line); }
.home-latest .article-card.featured { background: linear-gradient(140deg, #5141aa, #7560cb 64%, #4b86a5); }
.home-keywords { background: color-mix(in srgb, var(--surface-2) 48%, transparent); }
.home-keyword-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 1rem; }
.home-keyword-group { padding: 1.4rem; border: 1px solid var(--line); border-radius: 20px; background: var(--surface); box-shadow: var(--shadow-sm); }
.home-keyword-group h3 { margin: 0 0 1rem; font-size: 1.12rem; }
.home-keyword-group h3 a { display: flex; justify-content: space-between; gap: 1rem; }
.home-keyword-group h3 span { color: var(--purple); }

/* Scientific internet knowledge base: dense editorial index */
.knowledge-container { width: min(1180px, calc(100% - 2.5rem)); margin: 0 auto; }
.knowledge-hero { padding: 2.7rem 0 2.2rem; border-bottom: 1px solid var(--line); background: color-mix(in srgb, var(--surface-2) 42%, var(--surface)); }
.knowledge-hero .crumbs { margin-bottom: 1.1rem; }
.knowledge-hero .eyebrow { margin-bottom: .55rem; font-size: .66rem; }
.knowledge-hero h1 { max-width: 920px; margin: 0; font-size: clamp(1.75rem, 2.3vw, 2.1rem); line-height: 1.2; letter-spacing: -.025em; }
.knowledge-hero > .knowledge-container > p:last-child { max-width: 820px; margin: .75rem 0 0; color: var(--muted); font-size: .9rem; }
.knowledge-body { padding: 2rem 0 5rem; }
.knowledge-layout { display: grid; grid-template-columns: 220px minmax(0, 1fr); gap: 2.5rem; align-items: start; }
.knowledge-sidebar { position: sticky; top: 100px; padding: 1rem; border: 1px solid var(--line); border-radius: 14px; background: var(--surface); box-shadow: var(--shadow-sm); }
.knowledge-sidebar > strong { display: block; margin-bottom: .7rem; font-size: .88rem; }
.knowledge-sidebar nav { display: grid; max-height: calc(100vh - 245px); gap: .25rem; overflow-y: auto; scrollbar-width: thin; }
.knowledge-sidebar nav a { display: flex; align-items: center; justify-content: space-between; gap: .7rem; padding: .58rem .65rem; color: var(--muted); border-radius: 8px; font-size: .78rem; }
.knowledge-sidebar nav a:hover { color: var(--purple); background: var(--purple-soft); }
.knowledge-sidebar nav b { min-width: 1.4rem; color: var(--purple); text-align: right; font-size: .68rem; }
.knowledge-side-link { display: block; margin-top: .8rem; padding-top: .8rem; color: var(--purple); border-top: 1px solid var(--line); font-size: .74rem; font-weight: 800; }
.knowledge-search { margin: 0 0 1.25rem; }
.knowledge-search .search-input { padding: .82rem .9rem; font-size: .84rem; }
.knowledge-overview { padding: 1.25rem; border: 1px solid var(--line); border-radius: 16px; background: var(--surface); box-shadow: var(--shadow-sm); }
.knowledge-section { padding-top: 2.6rem; scroll-margin-top: 100px; }
.knowledge-section[hidden] { display: none; }
.knowledge-section-head { display: flex; align-items: end; justify-content: space-between; gap: 1.2rem; margin-bottom: .85rem; }
.knowledge-section-head h2 { margin: 0; font-size: clamp(1.35rem, 2vw, 1.65rem); letter-spacing: -.02em; }
.knowledge-section-head p { max-width: 690px; margin: .25rem 0 0; color: var(--muted); font-size: .8rem; }
.knowledge-section-head > span { flex: 0 0 auto; color: var(--muted); font-size: .72rem; }
.knowledge-table { font-size: .78rem; }
.knowledge-table th, .knowledge-table td { padding: .72rem .78rem; }
.knowledge-table th:first-child { width: 145px; }
.knowledge-table th:last-child { width: 110px; }
.knowledge-list { overflow: hidden; border: 1px solid var(--line); border-radius: 14px; background: var(--surface); box-shadow: var(--shadow-sm); }
.knowledge-entry { display: grid; grid-template-columns: 125px minmax(0, 1fr) 24px; gap: 1rem; align-items: center; min-height: 112px; padding: 1rem 1.1rem; border-bottom: 1px solid var(--line); transition: .18s ease; }
.knowledge-entry[hidden], .article-card[hidden] { display: none; }
.knowledge-entry:last-child { border-bottom: 0; }
.knowledge-entry:hover { background: color-mix(in srgb, var(--purple-soft) 42%, var(--surface)); }
.knowledge-entry-meta { display: grid; gap: .25rem; color: var(--muted); font-size: .68rem; font-weight: 800; }
.knowledge-entry h3 { margin: 0 0 .3rem; font-size: 1rem; line-height: 1.38; }
.knowledge-entry p { margin: 0; color: var(--muted); font-size: .78rem; line-height: 1.58; }
.knowledge-entry > b { color: var(--purple); font-size: 1rem; }
.knowledge-empty { margin-bottom: 1.25rem; padding: 1rem; color: var(--muted); border: 1px dashed var(--line); border-radius: 12px; background: var(--surface); font-size: .82rem; text-align: center; }
.knowledge-empty[hidden] { display: none; }

.topic-index-card { grid-column: 1 / -1; padding: 1.4rem; }
.topic-index-head { display: flex; align-items: end; justify-content: space-between; gap: 1rem; padding-bottom: 1rem; border-bottom: 1px solid var(--line); }
.topic-index-head h3 { margin: 0 0 .3rem; font-size: 1.25rem; }
.topic-index-head p { margin: 0; color: var(--muted); font-size: .88rem; }
.topic-index-head > span { flex: 0 0 auto; color: var(--muted); font-size: .76rem; font-weight: 800; }
.topic-keyword-list { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); column-gap: 1.8rem; }
.topic-keyword-row { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: .8rem; align-items: center; min-height: 62px; border-bottom: 1px solid var(--line); font-size: .9rem; }
.topic-keyword-row > a:first-child { display: flex; min-width: 0; align-items: center; justify-content: space-between; gap: .7rem; }
.topic-keyword-row strong { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.topic-keyword-row span, .topic-keyword-row > a:last-child { color: var(--purple); font-size: .82rem; font-weight: 750; }
.topic-keyword-row:hover strong { color: var(--purple); }

.site-footer { padding: 4rem 0 2rem; color: #eff0f8; background: #202033; }
.footer-grid { display: grid; grid-template-columns: 1.3fr 1fr 1fr; gap: 3rem; }
.footer-grid h3 { margin: 0 0 .8rem; }
.footer-grid p, .footer-grid a { color: #aaaabd; font-size: .86rem; }
.footer-links { display: grid; gap: .45rem; }
.footer-links a:hover { color: white; }
.footer-bottom { display: flex; justify-content: space-between; gap: 1rem; margin-top: 2.5rem; padding-top: 1.3rem; color: #77778d; border-top: 1px solid #353549; font-size: .75rem; }

@media (max-width: 1320px) {
  .site-nav { display: none; position: absolute; left: 1rem; right: 1rem; top: 74px; max-height: calc(100vh - 90px); padding: 1rem; overflow-y: auto; align-items: stretch; flex-direction: column; border: 1px solid var(--line); border-radius: 18px; background: var(--surface); box-shadow: var(--shadow); }
  .site-nav.open { display: flex; }
  .nav-main { display: grid; grid-template-columns: repeat(2, 1fr); }
  .nav-actions { display: grid; grid-template-columns: repeat(2, 1fr); }
  .menu-toggle { display: block; }
}
@media (max-width: 1120px) {
  .classic-home-grid { grid-template-columns: minmax(330px, .8fr) minmax(0, 1.2fr); gap: 2.5rem; }
  .classic-home-copy h1 { font-size: clamp(1.95rem, 3.4vw, 2.55rem); }
  .dossier-layout { grid-template-columns: 80px minmax(0, 1fr); }
  .dossier-panel { grid-column: 2; margin: 0 0 4rem; }
  .ledger-grid { grid-template-columns: repeat(2, 1fr); }
  .journal-layout { grid-template-columns: 260px minmax(0, 1fr); gap: 3rem; }
}
@media (max-width: 1000px) {
  .classic-home-grid { grid-template-columns: 1fr; min-height: 0; }
  .network-globe { width: min(640px, 92%); margin: 0 auto; order: 2; }
  .classic-home-copy { order: 1; text-align: center; }
  .classic-home-copy > p:not(.eyebrow) { margin-right: auto; margin-left: auto; }
  .classic-home-copy .hero-actions, .classic-home-facts, .classic-home-keywords { justify-content: center; }
  .classic-home-keywords > span { text-align: center; }
  .home-quick-grid { grid-template-columns: repeat(2, 1fr); }
  .home-keyword-grid { grid-template-columns: repeat(2, 1fr); }
  .hero-inner { grid-template-columns: 1fr; }
  .atlas-board { max-width: 680px; }
  .route-grid { grid-template-columns: repeat(2, 1fr); }
  .article-grid, .topic-grid, .region-grid { grid-template-columns: repeat(2, 1fr); }
  .tool-grid { grid-template-columns: repeat(2, 1fr); }
  .article-layout { grid-template-columns: 1fr; }
  .article-aside { display: none; }
  .knowledge-layout { grid-template-columns: 1fr; gap: 1.4rem; }
  .knowledge-sidebar { position: static; }
  .knowledge-sidebar nav { grid-template-columns: repeat(2, minmax(0, 1fr)); max-height: none; }
}
@media (max-width: 650px) {
  .container { width: min(100% - 1.25rem, var(--max)); }
  .section { padding: 4rem 0; }
  .hero { padding: 3rem 0; }
  .hero-inner { min-height: 0; gap: 3rem; }
  .hero h1 { font-size: clamp(2.25rem, 11vw, 3.25rem); }
  .atlas-board { padding: .8rem; border-radius: 22px; transform: none; }
  .atlas-tile { min-height: 115px; padding: .85rem; }
  .atlas-stats { grid-template-columns: 1fr; }
  .route-grid, .article-grid, .topic-grid, .tool-grid, .region-grid, .footer-grid { grid-template-columns: 1fr; }
  .airport-recommend-grid { grid-template-columns: 1fr; }
  .recommend-container { width: min(100% - 2rem, 1120px); }
  .recommend-page-hero { padding: 2.2rem 0 1.8rem; }
  .recommend-page-hero h1 { font-size: clamp(1.55rem, 7vw, 1.85rem); }
  .recommend-page-body { padding: 1.4rem 0 3rem; }
  .airport-card { min-height: auto; padding: 1.15rem; }
  .airport-card h2 { margin-top: 1.35rem; }
  .affiliate-disclosure { align-items: flex-start; flex-direction: column; }
  .knowledge-container { width: min(100% - 1.25rem, 1180px); }
  .knowledge-hero { padding: 2.2rem 0 1.8rem; }
  .knowledge-hero h1 { font-size: clamp(1.55rem, 7vw, 1.85rem); }
  .knowledge-body { padding: 1.4rem 0 4rem; }
  .knowledge-sidebar nav { grid-template-columns: 1fr; }
  .knowledge-overview { padding: .9rem; }
  .knowledge-section { padding-top: 2.1rem; }
  .knowledge-section-head { align-items: start; flex-direction: column; gap: .35rem; }
  .knowledge-entry { grid-template-columns: minmax(0, 1fr) 20px; gap: .55rem; min-height: 0; padding: .9rem; }
  .knowledge-entry-meta { grid-column: 1 / -1; display: flex; gap: .7rem; }
  .article-card.featured { grid-column: auto; }
  .section-head { align-items: start; flex-direction: column; }
  .brand-band { padding: 2rem 1.25rem; }
  .page-hero { padding: 2.2rem 0 1.8rem; }
  .page-hero .container { width: min(100% - 1.25rem, 1180px); }
  .page-hero h1 { font-size: clamp(1.55rem, 7vw, 1.85rem); line-height: 1.2; letter-spacing: -.025em; }
  .page-hero + .section { padding-top: 1.6rem; }
  .topic-index-head { align-items: start; flex-direction: column; gap: .35rem; }
  .topic-keyword-list { grid-template-columns: 1fr; }
  .article-header { padding: 2.8rem 0 2rem; }
  .article-header h1 { font-size: clamp(1.6rem, 7.2vw, 1.95rem); line-height: 1.2; letter-spacing: -.02em; }
  .matrix { display: block; overflow-x: auto; }
  .footer-bottom { flex-direction: column; }
  .nav-main, .nav-actions { grid-template-columns: 1fr; }
  .classic-home-hero { padding: 3.2rem 0 3.5rem; }
  .classic-home-grid { gap: 2.2rem; }
  .classic-home-copy { text-align: left; }
  .classic-home-copy h1 { font-size: clamp(1.75rem, 7.5vw, 2.1rem); line-height: 1.16; }
  .classic-home-copy > p:not(.eyebrow) { font-size: .94rem; }
  .classic-home-copy .hero-actions, .classic-home-facts, .classic-home-keywords { justify-content: flex-start; }
  .classic-home-keywords > span { text-align: left; }
  .network-globe { width: 100%; padding: .6rem; border-radius: 32px; }
  .network-globe figcaption { left: 1rem; bottom: .8rem; font-size: .62rem; }
  .home-quick-section { padding: 3.8rem 0; }
  .home-quick-grid, .home-keyword-grid { grid-template-columns: 1fr; }
  .home-quick-card { min-height: 195px; }
  .dossier-layout { display: block; min-height: 0; }
  .dossier-rail { display: grid; grid-template-columns: auto auto 1fr; gap: .8rem; padding: 1rem 0; border-right: 0; border-bottom: 2px solid var(--d-line); justify-items: start; }
  .dossier-rail span, .dossier-rail small { writing-mode: initial; }
  .dossier-rail strong { margin: 0; font-size: 1.5rem; }
  .dossier-rail i { width: 100%; min-height: 2px; }
  .dossier-rail small { grid-column: 1 / -1; }
  .dossier-copy { padding: 3.5rem 0; }
  .dossier-copy h1 { font-size: clamp(2.65rem, 12.5vw, 3.6rem); letter-spacing: -.06em; }
  .dossier-panel { margin: 0 0 3rem; box-shadow: 7px 7px 0 var(--d-orange); }
  .home-section-head { grid-template-columns: 1fr; }
  .ledger-grid { grid-template-columns: 1fr; }
  .ledger-grid a { min-height: 190px; }
  .ledger-grid span { margin-bottom: 2rem; }
  .journal-layout { grid-template-columns: 1fr; }
  .journal-title { position: static; }
  .journal-row { grid-template-columns: 42px 1fr; padding: .8rem 0; }
  .journal-time { grid-column: 2; text-align: left; }
  .topic-line { grid-template-columns: 45px 1fr auto; padding: .8rem 0; }
  .topic-line p { grid-column: 2 / -1; }
  .home-brand-note { padding: 2rem 1.2rem; box-shadow: 7px 7px 0 var(--d-blue); }
}
@media (prefers-reduced-motion: reduce) { html { scroll-behavior: auto; } *, *::before, *::after { transition: none !important; } }
