:root { --ink:#16323b; --deep:#0f3d47; --teal:#167a78; --sand:#f4eee4; --warm:#c7673b; --paper:#fffdf9; --muted:#66767b; --line:#d9e0de; --shadow:0 18px 55px rgba(15,61,71,.12); }
* { box-sizing:border-box; }
html { scroll-behavior:smooth; }
body { margin:0; color:var(--ink); background:var(--paper); font:16px/1.7 Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif; }
img { max-width:100%; display:block; }
a { color:inherit; text-decoration:none; }
a:focus-visible, button:focus-visible, input:focus-visible, select:focus-visible, textarea:focus-visible, summary:focus-visible { outline:3px solid rgba(22,122,120,.38); outline-offset:3px; }
h1,h2,h3,p { margin:0; }
h1,h2,h3 { font-family:Georgia, "Times New Roman", serif; line-height:1.1; letter-spacing:-.03em; }
h1 { font-size:clamp(2.8rem, 5.5vw, 5.25rem); max-width:14ch; }
h2 { font-size:clamp(2rem, 3.6vw, 3.4rem); }
h3 { font-size:1.7rem; }
p + p { margin-top:1rem; }
.shell { width:min(1160px, calc(100% - 48px)); margin:0 auto; }
.header { position:sticky; top:0; z-index:20; background:rgba(255,253,249,.95); border-bottom:1px solid rgba(22,50,59,.1); backdrop-filter:blur(12px); }
.nav { min-height:78px; display:flex; align-items:center; gap:28px; }
.brand { flex:0 0 auto; font-weight:780; font-size:1.08rem; letter-spacing:-.03em; }
.brand span { color:var(--warm); }
.nav-links { display:flex; align-items:center; justify-content:center; gap:24px; margin-left:auto; font-size:.93rem; }
.nav-links a { position:relative; padding:8px 0; }
.nav-links a::after { content:""; position:absolute; height:2px; left:0; right:0; bottom:2px; transform:scaleX(0); transform-origin:left; background:var(--warm); transition:transform .2s ease; }
.nav-links a:hover::after,.nav-links a.active::after { transform:scaleX(1); }
.menu { display:none; border:0; background:transparent; color:var(--deep); font:inherit; font-weight:700; cursor:pointer; }
.btn { display:inline-flex; align-items:center; justify-content:center; min-height:48px; padding:12px 20px; color:white; background:var(--warm); border:1px solid var(--warm); border-radius:2px; font-weight:750; cursor:pointer; transition:transform .2s ease, background .2s ease; }
.btn:hover { transform:translateY(-2px); background:#ac522d; }
.btn-small { min-height:40px; padding:8px 14px; font-size:.9rem; }
.btn-ghost { color:var(--deep); background:rgba(255,253,249,.88); border-color:rgba(255,253,249,.88); }
.btn-ghost:hover { background:#fff; }
.hero { min-height:700px; display:grid; align-items:end; padding:100px 0 78px; color:white; background:linear-gradient(90deg, rgba(6,30,36,.76) 0%, rgba(6,30,36,.46) 50%, rgba(6,30,36,.12) 100%), url('/assets/images/hero-great-wall.webp') center/cover no-repeat; }
.hero-copy { max-width:760px; }
.hero p { max-width:640px; margin-top:25px; font-size:1.12rem; }
.eyebrow { display:block; margin-bottom:15px; color:var(--warm); font-size:.74rem; font-weight:800; letter-spacing:.14em; text-transform:uppercase; }
.hero .eyebrow,.dark .eyebrow { color:#ffb28c; }
.actions { display:flex; flex-wrap:wrap; gap:12px; margin-top:30px; }
.hero-note { color:rgba(255,255,255,.76); font-size:.87rem !important; }
.breadcrumbs { padding-top:18px; }
.breadcrumbs ol { display:flex; flex-wrap:wrap; gap:7px; margin:0; padding:0; list-style:none; color:#65777b; font-size:.8rem; }
.breadcrumbs li { display:flex; align-items:center; min-width:0; }
.breadcrumbs li:not(:last-child)::after { content:"/"; margin-left:7px; color:#9aa8aa; }
.breadcrumbs a { text-decoration:underline; text-underline-offset:3px; }
.section,.soft,.dark { padding:98px 0; }
.section-intro { max-width:820px; margin-bottom:42px; }
.section-intro p,.page-hero p { max-width:720px; margin-top:18px; color:var(--muted); font-size:1.05rem; }
.cards { display:grid; grid-template-columns:repeat(3,1fr); gap:24px; }
.route-card { display:flex; flex-direction:column; overflow:hidden; background:#fff; box-shadow:var(--shadow); }
.route-image { overflow:hidden; aspect-ratio:1.25; background:var(--sand); }
.route-image picture { display:block; width:100%; height:100%; }
.route-image img { width:100%; height:100%; object-fit:cover; transition:transform .45s ease; }
.route-card:hover img { transform:scale(1.045); }
.route-copy { flex:1; display:flex; flex-direction:column; align-items:flex-start; padding:23px 23px 25px; }
.route-copy > span,.number { color:var(--teal); font-size:.74rem; font-weight:800; letter-spacing:.1em; text-transform:uppercase; }
.route-copy h3 { margin-top:9px; }
.route-copy p { margin-top:13px; color:var(--muted); }
.text-link { margin-top:20px; color:var(--deep); font-weight:800; }
.text-link b { color:var(--warm); padding-left:4px; }
.soft { background:var(--sand); }
.partner-section { padding:82px 0; color:#f8fcfc; background:linear-gradient(112deg,#103e48,#166b70); }
.partner-grid { display:grid; grid-template-columns:1fr 1fr; gap:70px; align-items:start; }
.partner-section h2 { max-width:13ch; }
.partner-section p { max-width:600px; margin-top:18px; color:rgba(255,255,255,.85); }
.partner-section .eyebrow { color:#ffb28c; }
.partner-points { padding:8px 0 0; }
.partner-points ul { margin:0; padding:0; list-style:none; border-top:1px solid rgba(255,255,255,.25); }
.partner-points li { position:relative; padding:16px 0 16px 26px; border-bottom:1px solid rgba(255,255,255,.25); color:rgba(255,255,255,.89); }
.partner-points li::before { content:""; position:absolute; top:28px; left:1px; width:10px; height:10px; border-radius:50%; background:#ffb28c; }
.partner-points .text-link { color:#fff; }
.split { display:grid; grid-template-columns:.9fr 1.1fr; gap:90px; align-items:start; }
.split p { margin-top:18px; color:#52676d; }
.steps { list-style:none; padding:0; margin:0; border-top:1px solid rgba(15,61,71,.18); }
.steps li { display:grid; grid-template-columns:68px 1fr; gap:15px; padding:20px 0; border-bottom:1px solid rgba(15,61,71,.18); }
.steps b { color:var(--warm); font-size:.9rem; }
.steps strong,.steps small { display:block; }
.steps small { margin-top:4px; color:#52676d; }
.destination-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:1px; background:var(--line); border:1px solid var(--line); }
.destination-grid article { min-height:185px; padding:29px; background:var(--paper); }
.destination-grid h3,.destination-grid h2 { margin-top:8px; }
.destination-grid p { margin-top:10px; color:var(--muted); }
.destination-grid small { display:block; margin-top:17px; color:var(--teal); font-size:.77rem; font-weight:750; line-height:1.45; }
.destination-grid.large article { min-height:225px; }
.destination-grid .route-note { font-size:.94rem; }
.guide-rows { border-top:1px solid var(--line); }
.guide-row { display:grid; grid-template-columns:200px minmax(0,1fr); gap:28px; padding:26px 0; border-bottom:1px solid var(--line); align-items:center; }
.guide-row-image { display:block; aspect-ratio:4/3; overflow:hidden; border-radius:8px; background:var(--sand); }
.guide-row-image picture,.guide-row-image img { display:block; width:100%; height:100%; object-fit:cover; }
.guide-row-copy { min-width:0; }
.guide-row h3 { margin:7px 0 0; font-size:clamp(1.3rem,2.1vw,1.8rem); line-height:1.25; }
.guide-row h3 a:hover { color:var(--teal); }
.guide-row p { margin:9px 0 0; max-width:740px; color:var(--muted); }
.guide-row .text-link { display:inline-block; margin-top:12px; }
.guide-row a:focus-visible { outline:2px solid var(--teal); outline-offset:4px; }
@media (max-width:560px) {
 .guide-row { grid-template-columns:96px minmax(0,1fr); align-items:start; gap:16px; padding:22px 0; }
 .guide-row .number { font-size:.65rem; letter-spacing:.08em; }
 .guide-row h3 { font-size:1.2rem; }
 .guide-row p { font-size:.88rem; line-height:1.55; }
 .guide-row .text-link { font-size:.88rem; }
}
.guide-grid { display:grid; grid-template-columns:repeat(2,1fr); gap:1px; background:var(--line); border:1px solid var(--line); }
.guide-grid article { display:flex; flex-direction:column; align-items:flex-start; min-height:270px; padding:30px; background:var(--paper); }
.guide-grid h3 { margin-top:10px; font-size:1.65rem; }
.guide-grid p { margin-top:13px; color:var(--muted); }
.guide-grid .text-link { margin-top:auto; padding-top:18px; }
.guide-list { border-top:1px solid var(--line); }
.guide-list-item { display:grid; grid-template-columns:280px minmax(0,1fr); gap:30px; padding:29px 0; border-bottom:1px solid var(--line); }
.guide-list-thumb { display:block; overflow:hidden; aspect-ratio:1.35; background:var(--sand); }
.guide-list-thumb picture,.guide-list-thumb img { display:block; width:100%; height:100%; }
.guide-list-thumb img { object-fit:cover; transition:transform .35s ease; }
.guide-list-item:hover .guide-list-thumb img { transform:scale(1.04); }
.guide-list-copy { display:flex; flex-direction:column; align-items:flex-start; }
.guide-list-copy h2 { margin-top:7px; font-size:clamp(1.65rem, 2.5vw, 2.25rem); }
.guide-list-copy h2 a:hover { color:var(--teal); }
.guide-list-copy p { max-width:760px; margin-top:10px; color:var(--muted); }
.guide-list-copy .text-link { margin-top:16px; }
.pagination { display:flex; flex-wrap:wrap; gap:8px; margin-top:36px; }
.pagination a,.pagination span { display:inline-flex; align-items:center; justify-content:center; min-width:42px; min-height:42px; padding:8px 13px; border:1px solid var(--line); color:var(--deep); font-weight:750; }
.pagination span { color:#fff; background:var(--deep); border-color:var(--deep); }
.pagination a:hover { color:#fff; background:var(--warm); border-color:var(--warm); }
.dark { color:#fff; background:var(--deep); }
.narrow { max-width:800px; }
.dark h2 { max-width:16ch; }
.dark p { max-width:670px; margin-top:17px; color:rgba(255,255,255,.8); }
.dark .btn { margin-top:27px; }
.page-hero { padding:100px 0 64px; background:linear-gradient(180deg,#f8f5ee,#fffdf9); }
.page-hero h1 { color:var(--deep); }
.content-grid { display:grid; grid-template-columns:minmax(0,1.45fr) minmax(280px,.55fr); gap:70px; align-items:start; }
.content-grid article h2,.prose h2 { margin-top:36px; font-size:2rem; }
.content-grid article h2:first-child,.prose h2:first-child { margin-top:0; }
.content-grid article p,.prose p { margin-top:13px; color:#51666d; }
.content-grid li,.request-card li { margin:8px 0; color:#51666d; }
.guide-checklist,.guide-flow { margin-top:38px; padding:28px; background:var(--sand); border-top:4px solid var(--warm); }
.guide-checklist h2,.guide-flow h2 { margin-top:0; font-size:1.8rem; }
.guide-checklist ul { margin:15px 0 0; padding-left:20px; }
.guide-sources { border-top-color:var(--deep); }
.guide-sources p { margin-top:12px; }
.guide-sources a { text-decoration:underline; text-underline-offset:3px; }
.guide-flow > p { margin-top:12px; }
.guide-flow ol { margin:19px 0 0; padding:0; list-style:none; border-top:1px solid rgba(15,61,71,.18); }
.guide-flow li { display:grid; grid-template-columns:88px 1fr; gap:15px; margin:0; padding:13px 0; border-bottom:1px solid rgba(15,61,71,.18); }
.guide-flow strong { color:var(--warm); font-size:.83rem; letter-spacing:.06em; text-transform:uppercase; }
.guide-media { margin:32px 0 38px; overflow:hidden; background:#fff; box-shadow:var(--shadow); }
.guide-media picture,.guide-media img { display:block; width:100%; }
.guide-media img { max-height:440px; object-fit:cover; }
.guide-media figcaption { padding:15px 18px 17px; }
.guide-media figcaption strong,.guide-media figcaption small { display:block; }
.guide-media figcaption strong { color:var(--deep); font-family:Georgia, "Times New Roman", serif; line-height:1.35; }
.guide-media figcaption small { margin-top:8px; color:#65777b; font-size:.76rem; }
.guide-media figcaption a { text-decoration:underline; text-underline-offset:3px; }
.request-card { position:sticky; top:102px; padding:30px; background:var(--sand); border-top:4px solid var(--warm); }
.request-card h2 { margin-top:4px; font-size:2rem; }
.request-card p { margin-top:14px; color:#51666d; }
.request-card .btn { width:100%; margin-top:22px; }
.route-hero { position:relative; min-height:540px; display:grid; align-items:end; overflow:hidden; color:white; background:var(--deep); }
.route-hero::after { content:""; position:absolute; inset:0; background:linear-gradient(0deg,rgba(5,25,30,.78),rgba(5,25,30,.08) 70%); }
.route-hero > img { position:absolute; inset:0; width:100%; height:100%; object-fit:cover; }
.route-hero-copy { position:relative; z-index:1; padding-bottom:58px; }
.route-hero-copy p { margin-top:17px; font-size:1.08rem; }
.lead { color:var(--deep) !important; font-family:Georgia, "Times New Roman", serif; font-size:1.35rem; line-height:1.5; }
.itinerary { display:grid; grid-template-columns:repeat(5,1fr); gap:1px; background:var(--line); border:1px solid var(--line); }
.itinerary article { min-height:290px; padding:26px; background:#fffdf9; }
.itinerary span { display:block; color:var(--warm); font-size:.72rem; font-weight:800; letter-spacing:.13em; text-transform:uppercase; }
.itinerary h3 { margin-top:13px; font-size:1.45rem; }
.itinerary p { margin-top:14px; color:#52676d; font-size:.94rem; line-height:1.65; }
.experience-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:24px; }
.experience-grid article { padding:28px; border-top:4px solid var(--warm); background:var(--sand); }
.experience-grid h3 { font-size:1.48rem; }
.experience-grid p { margin-top:13px; color:#52676d; }
.route-gallery { display:grid; grid-template-columns:repeat(3,1fr); gap:24px; }
.route-gallery figure { margin:0; overflow:hidden; background:#fff; box-shadow:var(--shadow); }
.route-gallery img { width:100%; aspect-ratio:1.25; object-fit:cover; }
.route-gallery figcaption { padding:16px 18px 18px; }
.route-gallery figcaption strong,.route-gallery figcaption small { display:block; }
.route-gallery figcaption strong { color:var(--deep); font-family:Georgia, "Times New Roman", serif; font-size:1.08rem; line-height:1.35; }
.route-gallery figcaption small { margin-top:10px; color:#65777b; font-size:.76rem; }
.route-gallery figcaption a { text-decoration:underline; text-underline-offset:3px; }
.form-layout { display:grid; grid-template-columns:.75fr 1.25fr; gap:70px; align-items:start; }
.form-layout > div > p { margin-top:18px; color:var(--muted); }
.form { padding:29px; background:#fff; box-shadow:var(--shadow); }
.form-grid { display:grid; grid-template-columns:repeat(2,1fr); gap:18px; }
.form label { display:grid; gap:7px; color:var(--deep); font-size:.88rem; font-weight:750; }
.form input,.form select,.form textarea { width:100%; border:1px solid #c7d2d0; border-radius:1px; padding:12px; color:var(--ink); background:#fff; font:inherit; font-size:16px; }
.form textarea { min-height:148px; resize:vertical; }
.form input:focus,.form select:focus,.form textarea:focus { outline:3px solid rgba(22,122,120,.18); border-color:var(--teal); }
.full { grid-column:1 / -1; }
.consent span { display:flex; gap:9px; align-items:flex-start; color:var(--muted); font-weight:500; }
.consent input { width:auto; margin-top:5px; }
.trap { position:absolute !important; left:-10000px; width:1px; height:1px; overflow:hidden; }
.notice { margin-top:22px; padding:15px 16px; color:#174d3c; background:#e7f6ec; border-left:4px solid #338a61; }
.faq details { border-top:1px solid rgba(15,61,71,.18); padding:19px 0; }
.faq details:last-child { border-bottom:1px solid rgba(15,61,71,.18); }
.faq summary { cursor:pointer; color:var(--deep); font-weight:780; }
.faq details p { margin:12px 28px 0 0; color:#51666d; }
footer { padding:58px 0 26px; color:#dce8e8; background:#0a2c34; }
.footer-grid { display:grid; grid-template-columns:1.6fr .7fr .7fr; gap:50px; }
footer .brand { color:#fff; }
footer p { max-width:420px; margin-top:14px; color:#aec2c4; font-size:.91rem; }
footer strong { display:block; margin-bottom:12px; color:#fff; }
footer a:not(.brand) { display:block; margin:7px 0; color:#b9ccce; font-size:.92rem; }
.footer-email { display:inline-block !important; margin-top:14px !important; color:#fff !important; font-weight:700; }
.footer-note { margin-top:47px; padding-top:19px; border-top:1px solid rgba(255,255,255,.14); color:#9eb7ba; font-size:.78rem; }
@media (max-width:880px) { .nav { min-height:67px; gap:16px; } .menu { display:block; margin-left:auto; min-height:44px; padding:8px; } .nav-cta { display:none; } .nav-links { position:fixed; top:67px; right:0; left:0; display:none; margin:0; padding:18px 24px 25px; background:var(--paper); border-bottom:1px solid var(--line); box-shadow:0 20px 35px rgba(15,61,71,.12); } .nav-links.is-open { display:grid; } .nav-links a { padding:11px 0; } body.menu-open::after { content:""; position:fixed; inset:67px 0 0; z-index:10; background:rgba(6,30,36,.26); } .header { z-index:30; } .nav { position:relative; z-index:31; } .cards { grid-template-columns:1fr; max-width:560px; } .split,.content-grid,.form-layout,.partner-grid { grid-template-columns:1fr; gap:37px; } .request-card { position:static; } .destination-grid,.guide-grid { grid-template-columns:1fr 1fr; } .itinerary,.experience-grid,.route-gallery { grid-template-columns:1fr 1fr; } .guide-list-item { grid-template-columns:220px minmax(0,1fr); gap:24px; } .itinerary article { min-height:0; } .footer-grid { grid-template-columns:1.3fr 1fr; } .footer-grid > :first-child { grid-column:1 / -1; } }
@media (max-width:560px) { body { font-size:15px; } .shell { width:min(100% - 32px, 1160px); } .hero { min-height:650px; padding:80px 0 50px; background-position:58% center; } h1 { font-size:clamp(2.55rem, 12vw, 3.55rem); } .section,.soft,.dark { padding:67px 0; } .partner-section { padding:67px 0; } .page-hero { padding:56px 0 42px; } .breadcrumbs { padding-top:14px; } .route-hero { min-height:440px; } .route-hero-copy { padding-bottom:38px; } .destination-grid,.guide-grid,.itinerary,.experience-grid,.route-gallery { grid-template-columns:1fr; } .guide-list-item { grid-template-columns:1fr; gap:17px; } .guide-list-thumb { max-width:none; } .form { padding:21px; } .form-grid { grid-template-columns:1fr; gap:15px; } .full { grid-column:auto; } .footer-grid { grid-template-columns:1fr; gap:29px; } .footer-grid > :first-child { grid-column:auto; } .actions { display:grid; } .actions .btn { width:100%; } .itinerary article { padding:23px; } .partner-points li { padding-left:24px; } }
