:root{
  --navy:#071a38; --gold:#d9b66b; --ink:#13284a; --muted:#63708a;
  --card:#fff; --line:#e8eaf0; --shadow:0 10px 30px rgba(10,28,58,.12);
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:#eef1f5;color:var(--ink);font-family:-apple-system,BlinkMacSystemFont,"PingFang SC","Microsoft YaHei",sans-serif}
a{text-decoration:none;color:inherit}
.page{max-width:720px;margin:auto;background:#fff;min-height:100vh;box-shadow:0 0 40px rgba(0,0,0,.08)}
.lang-bar{display:flex;justify-content:flex-end;padding:10px 14px;background:#fff;border-bottom:1px solid var(--line)}
.lang-bar select{padding:8px 10px;border-radius:10px;border:1px solid #d7dce4;font-size:14px}
.hero{position:relative;min-height:720px;color:#fff;overflow:hidden;background:
linear-gradient(180deg,rgba(4,18,42,.18) 0%,rgba(4,18,42,.38) 48%,rgba(4,18,42,.92) 100%),
url("https://images.unsplash.com/photo-1563492065599-3520f775eeed?auto=format&fit=crop&w=1400&q=85") center/cover}
.hero:after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(3,17,39,.7),transparent 65%);pointer-events:none}
.hero-content{position:relative;z-index:1;padding:44px 26px 28px;min-height:720px;display:flex;flex-direction:column;justify-content:space-between}
.kicker{font-size:13px;letter-spacing:.18em;opacity:.9}
h1{font-family:Georgia,"Songti SC","STSong",serif;font-size:43px;line-height:1.16;margin:12px 0 16px;letter-spacing:.02em}
h1 span{color:#f1d28e}
.lead{font-size:16px;line-height:1.8;max-width:600px;margin:0}
.stats{display:grid;grid-template-columns:repeat(4,1fr);gap:8px;margin-top:30px}
.stat{border:1px solid rgba(255,255,255,.35);border-radius:14px;padding:14px 6px;text-align:center;background:rgba(5,20,45,.25);backdrop-filter:blur(6px)}
.stat b{display:block;font-size:15px;margin-bottom:4px}.stat small{font-size:11px;opacity:.78}
.section{padding:28px 20px}
.section h2{font-family:Georgia,"Songti SC","STSong",serif;font-size:24px;margin:0 0 9px}
.section p{font-size:14px;line-height:1.8;margin:0;color:#4c5b72}
.landmarks{display:grid;grid-template-columns:repeat(5,1fr);gap:7px;margin-top:16px}
.landmark{height:112px;border-radius:12px;overflow:hidden;position:relative;background-size:cover;background-position:center}
.landmark:after{content:"";position:absolute;inset:35% 0 0;background:linear-gradient(transparent,rgba(0,0,0,.78))}
.landmark span{position:absolute;z-index:1;bottom:9px;left:7px;right:7px;color:#fff;font-size:12px;font-weight:600}
.experience{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin-top:16px}
.exp{min-height:180px;border-radius:14px;overflow:hidden;position:relative;background-size:cover;background-position:center;color:#fff}
.exp:after{content:"";position:absolute;inset:40% 0 0;background:linear-gradient(transparent,rgba(0,0,0,.86))}
.exp div{position:absolute;z-index:1;bottom:12px;padding:0 12px}.exp b{display:block;font-size:15px;margin-bottom:4px}.exp small{line-height:1.5}
.tip{margin:8px 20px 0;padding:18px;border-radius:18px;background:#f7f1e4;border:1px solid #ead8b0;display:flex;gap:14px;align-items:center}
.tip .icon{font-size:30px}.tip b{display:block;margin-bottom:5px}.tip p{font-size:13px;line-height:1.6;color:#665c4b;margin:0}
.suitable{margin-top:14px;background:#f5f7fa;border-radius:18px;padding:18px}
.tags{display:flex;flex-wrap:wrap;gap:7px;margin-top:10px}.tag{background:#fff;border:1px solid #e1e5eb;border-radius:999px;padding:7px 11px;font-size:12px}
.boats{background:#f5f7fa;padding:30px 16px}
.boats-title{text-align:center;margin-bottom:18px}.boats-title h2{margin-bottom:5px}.boats-title p{margin:0;color:var(--muted);font-size:13px}
.boat{background:#fff;border-radius:18px;overflow:hidden;box-shadow:var(--shadow);margin-bottom:14px}
.boat-img{height:150px;background-size:cover;background-position:center}
.boat-body{padding:14px}
.boat-name{font-family:Georgia,"Songti SC","STSong",serif;font-size:19px;font-weight:700}
.boat-en{font-size:11px;color:#8a7250;margin-top:3px}
.links{display:grid;grid-template-columns:repeat(3,1fr);gap:7px;margin-top:13px}
.btn{border-radius:10px;padding:10px 5px;text-align:center;color:#fff;font-weight:700;font-size:12px;transition:.15s}
.btn:active{transform:scale(.97)}
.ctrip{background:#1685e5}.klook{background:#ff7a00}.gyg{background:#ef4b3f}
.note{text-align:center;font-size:11px;color:#8791a2;padding:4px 20px 18px}
.footer{background:var(--navy);color:#f4d48e;text-align:center;padding:25px 20px;font-family:Georgia,"Songti SC","STSong",serif;letter-spacing:.08em}

@media(max-width:520px){
  .hero{min-height:650px}.hero-content{min-height:650px;padding:32px 20px 22px}
  h1{font-size:35px}.lead{font-size:15px}.stats{gap:5px}.stat{padding:11px 3px}.stat b{font-size:13px}.stat small{font-size:10px}
  .landmarks{grid-template-columns:repeat(2,1fr)}.landmark{height:130px}.landmark:last-child{grid-column:span 2}
  .experience{grid-template-columns:1fr}.exp{min-height:190px}
}