/* 桂林逐梦文化传媒有限公司 官网样式 */
* { margin:0; padding:0; box-sizing:border-box; }
html { scroll-behavior:smooth; }
body {
  font-family:'Noto Sans SC', -apple-system, 'PingFang SC', 'Microsoft YaHei', sans-serif;
  color:#1b1c21; background:#f4f2ec; -webkit-font-smoothing:antialiased;
  overflow-x:hidden;
}
a { text-decoration:none; color:inherit; }
::selection { background:#1f3c6e; color:#fff; }
.serif { font-family:'Noto Serif SC', serif; }

/* layout */
.container { max-width:1320px; margin:0 auto; padding:clamp(80px,9vw,130px) clamp(20px,5vw,72px); }
.sec { border-top:1px solid #ddd9cd; }
.sec--cream { background:#f4f2ec; }
.sec--white { background:#fff; }
.sec--navy { background:#16294d; color:#fff; }
.sec--dark { background:#1b1c21; color:#fff; }

/* eyebrow label */
.eyebrow { display:flex; align-items:center; gap:14px; margin-bottom:24px; }
.eyebrow i { width:34px; height:1px; background:#1f3c6e; display:block; }
.eyebrow span { font-size:12px; letter-spacing:3px; font-weight:600; color:#1f3c6e; }
.eyebrow--light i { background:#7c97c8; }
.eyebrow--light span { color:#9fb4d8; }

/* headings */
.h2 { font-family:'Noto Serif SC',serif; font-size:clamp(28px,3.4vw,44px); font-weight:700; line-height:1.3; }

/* nav */
.nav {
  position:fixed; top:0; left:0; right:0; z-index:100; height:74px;
  display:flex; align-items:center; justify-content:space-between;
  padding:0 clamp(20px,5vw,72px);
  background:rgba(244,242,236,0.9); backdrop-filter:blur(10px);
  border-bottom:1px solid #ddd9cd;
}
.nav-brand { display:flex; align-items:baseline; gap:11px; }
.nav-brand b { font-family:'Noto Serif SC',serif; font-weight:700; font-size:21px; letter-spacing:1px; color:#1b1c21; }
.nav-brand i { font-size:10px; letter-spacing:2px; color:#9a9588; font-weight:500; font-style:normal; }
.nav-links { display:flex; align-items:center; gap:clamp(14px,2.4vw,36px); }
.nav-link { font-size:14.5px; color:#4a4b52; font-weight:500; transition:color .2s; }
.nav-link:hover { color:#1f3c6e; }
.nav-cta { display:inline-flex; align-items:center; height:40px; padding:0 22px; background:#1f3c6e; color:#fff; font-size:14px; font-weight:500; transition:background .2s; }
.nav-cta:hover { background:#16294d; }

/* buttons */
.btn { display:inline-flex; align-items:center; height:52px; padding:0 30px; font-weight:500; font-size:15px; transition:all .2s; }
.btn--primary { background:#1f3c6e; color:#fff; }
.btn--primary:hover { background:#16294d; }
.btn--ghost { background:transparent; border:1px solid #b9b4a6; color:#1b1c21; }
.btn--ghost:hover { border-color:#1f3c6e; color:#1f3c6e; }
.btn--sm { height:50px; padding:0 28px; }

/* hero */
.hero { padding:170px clamp(20px,5vw,72px) 0; max-width:1320px; margin:0 auto; }
.hero h1 { font-family:'Noto Serif SC',serif; font-weight:700; font-size:clamp(40px,6.6vw,92px); line-height:1.1; letter-spacing:1px; max-width:15ch; }
.hero-lead { display:flex; flex-wrap:wrap; gap:60px; align-items:flex-end; margin-top:46px; padding-bottom:64px; border-bottom:1px solid #ddd9cd; }
.hero-lead p { max-width:540px; font-size:17px; line-height:1.95; color:#54555d; }
.hero-btns { display:flex; gap:14px; }
.stats { display:grid; grid-template-columns:repeat(4,1fr); gap:clamp(16px,3vw,40px); padding:50px 0 90px; }
.stat b { font-family:'Noto Serif SC',serif; font-size:clamp(34px,4.4vw,58px); font-weight:700; color:#1f3c6e; line-height:1; display:block; }
.stat b small { font-size:0.42em; color:#1b1c21; }
.stat span { font-size:13.5px; color:#84817a; margin-top:12px; display:block; }

/* about */
.about-grid { display:grid; grid-template-columns:0.85fr 1.15fr; gap:clamp(40px,7vw,100px); }
.about-lead { font-family:'Noto Serif SC',serif; font-size:clamp(20px,2.2vw,28px); font-weight:500; line-height:1.7; color:#1b1c21; margin-bottom:36px; }
.about-grid p.body { font-size:16px; line-height:2.05; color:#54555d; margin-bottom:22px; }
.about-grid p.body.last { margin-bottom:40px; }
.tags { display:flex; flex-wrap:wrap; border-top:1px solid #e5e2d8; }
.tags > div { flex:1; min-width:150px; padding:18px 0; border-bottom:1px solid #e5e2d8; }
.tags > div + div { padding-left:24px; }
.tags span { font-size:14px; color:#1b1c21; font-weight:500; }

/* section header (flex row) */
.sec-head { display:flex; align-items:flex-end; justify-content:space-between; gap:30px; flex-wrap:wrap; margin-bottom:60px; }
.sec-head p { max-width:400px; font-size:15px; line-height:1.9; color:#6b6c74; }

/* business 3-col */
.cols3 { display:grid; grid-template-columns:repeat(3,1fr); border-top:1px solid #ccc7b9; }
.cols3 > div { padding:42px 36px 50px; border-right:1px solid #ddd9cd; }
.cols3 > div:last-child { border-right:none; }
.cols3 .num { font-family:'Noto Serif SC',serif; font-size:15px; color:#1f3c6e; font-weight:600; margin-bottom:30px; }
.cols3 h3 { font-size:22px; font-weight:700; margin-bottom:16px; }
.cols3 p { font-size:15px; line-height:1.95; color:#5c5d65; }

/* marketing banner */
.banner-grid { display:grid; grid-template-columns:1.1fr 0.9fr; gap:clamp(30px,5vw,80px); align-items:end; }
.banner-grid h2 { font-family:'Noto Serif SC',serif; font-size:clamp(30px,4.4vw,58px); font-weight:700; line-height:1.18; }
.banner-grid h2 span { color:#9fb4d8; font-size:0.55em; font-weight:600; letter-spacing:2px; }
.banner-grid p { font-size:16px; line-height:2; color:#c5cfe0; }
.banner-pad { padding:clamp(70px,8vw,110px) clamp(20px,5vw,72px); max-width:1320px; margin:0 auto; }

/* service matrix */
.matrix { display:grid; grid-template-columns:repeat(auto-fit,minmax(230px,1fr)); border-top:1px solid #ccc7b9; border-left:1px solid #e5e2d8; }
.matrix > div { padding:34px 30px; border-right:1px solid #e5e2d8; border-bottom:1px solid #e5e2d8; transition:background .2s; }
.matrix > div:hover { background:#f7f6f1; }
.matrix .tag { font-size:12px; color:#1f3c6e; font-weight:600; letter-spacing:1px; margin-bottom:14px; }
.matrix h3 { font-size:18px; font-weight:700; margin-bottom:11px; }
.matrix p { font-size:14px; line-height:1.8; color:#5c5d65; }

/* effect analysis */
.effect-grid { display:grid; grid-template-columns:0.9fr 1.1fr; gap:clamp(40px,6vw,90px); align-items:center; }
.effect-grid > div:first-child p { font-size:16px; line-height:2; color:#54555d; margin-bottom:34px; }
.metrics { display:grid; grid-template-columns:repeat(3,1fr); border-top:1px solid #ccc7b9; border-left:1px solid #ddd9cd; }
.metrics > div { padding:24px 20px; border-right:1px solid #ddd9cd; border-bottom:1px solid #ddd9cd; }
.metrics b { font-size:15px; font-weight:700; color:#1b1c21; display:block; }
.metrics small { font-size:12px; color:#8b887f; margin-top:5px; display:block; }
.metrics .hl { background:#16294d; }
.metrics .hl b { color:#fff; }
.metrics .hl small { color:#9fb4d8; }

/* why us */
.why-cols { display:grid; grid-template-columns:repeat(3,1fr); border-top:1px solid #ccc7b9; }
.why-cols > div { padding:44px 40px 10px; border-right:1px solid #ddd9cd; }
.why-cols > div:last-child { border-right:none; }
.why-cols .t { font-family:'Noto Serif SC',serif; font-size:24px; font-weight:700; color:#1f3c6e; margin-bottom:20px; }
.why-cols p { font-size:15px; line-height:1.95; color:#5c5d65; }

/* ai */
.ai-head h2 { font-family:'Noto Serif SC',serif; font-size:clamp(28px,3.6vw,48px); font-weight:700; max-width:18ch; line-height:1.25; margin-bottom:18px; }
.ai-head .lead { max-width:620px; font-size:16px; line-height:1.95; color:#c5cfe0; margin-bottom:64px; }
.ai-cols { display:grid; grid-template-columns:repeat(3,1fr); border-top:1px solid rgba(255,255,255,0.2); }
.ai-cols > div { padding:40px 34px 14px; border-right:1px solid rgba(255,255,255,0.12); }
.ai-cols > div:last-child { border-right:none; }
.ai-cols .num { font-size:13px; font-weight:600; color:#9fb4d8; margin-bottom:24px; }
.ai-cols h3 { font-size:21px; font-weight:700; margin-bottom:14px; }
.ai-cols p { font-size:14.5px; line-height:1.9; color:#bcc7da; }
.ai-flow { display:flex; align-items:center; gap:18px; flex-wrap:wrap; margin-top:50px; font-family:'Noto Serif SC',serif; font-size:clamp(15px,1.7vw,19px); font-weight:600; color:#dce4f0; }
.ai-flow .dash { color:#6c84ba; }
.ai-flow .loop { color:#9fb4d8; }

/* advantages */
.adv-list { border-top:1px solid #ccc7b9; }
.adv-row { display:grid; grid-template-columns:80px 1fr; gap:clamp(20px,4vw,60px); padding:38px 0; border-bottom:1px solid #ddd9cd; align-items:baseline; }
.adv-row .n { font-family:'Noto Serif SC',serif; font-size:30px; font-weight:700; color:#1f3c6e; }
.adv-row .body { display:grid; grid-template-columns:280px 1fr; gap:clamp(16px,3vw,48px); align-items:baseline; }
.adv-row h3 { font-size:21px; font-weight:700; }
.adv-row p { font-size:15.5px; line-height:1.95; color:#54555d; }

/* contact */
.contact-grid { display:grid; grid-template-columns:1fr 1fr; gap:clamp(40px,6vw,100px); align-items:center; }
.contact-grid h2 { font-family:'Noto Serif SC',serif; font-size:clamp(30px,4vw,52px); font-weight:700; line-height:1.25; margin-bottom:22px; }
.contact-grid > div:first-child p { font-size:16px; line-height:1.95; color:#54555d; }
.contact-list { border-top:1px solid #ccc7b9; }
.contact-list > * { display:grid; grid-template-columns:80px 1fr; gap:20px; padding:26px 0; border-bottom:1px solid #e5e2d8; align-items:baseline; }
.contact-list > *:last-child { border-bottom:none; }
.contact-list .k { font-size:13px; color:#8b887f; }
.contact-list .v-lg { font-family:'Noto Serif SC',serif; font-size:22px; font-weight:600; }
.contact-list .v-md { font-size:18px; font-weight:600; word-break:break-all; }
.contact-list .v-sm { font-size:16px; font-weight:500; line-height:1.7; }

/* footer */
.foot-pad { max-width:1320px; margin:0 auto; padding:clamp(50px,6vw,72px) clamp(20px,5vw,72px) 36px; }
.foot-top { display:flex; flex-wrap:wrap; justify-content:space-between; gap:36px; padding-bottom:38px; border-bottom:1px solid rgba(255,255,255,0.12); }
.foot-top .brand { font-family:'Noto Serif SC',serif; font-weight:700; font-size:18px; margin-bottom:16px; }
.foot-top .desc { max-width:400px; font-size:13.5px; line-height:1.95; color:#9b9ca3; }
.foot-cols { display:flex; gap:clamp(30px,5vw,70px); flex-wrap:wrap; }
.foot-col .label { font-size:12px; color:#6c6d74; margin-bottom:16px; letter-spacing:1px; }
.foot-col .links { display:flex; flex-direction:column; gap:12px; font-size:14px; color:#b6b7bd; }
.foot-col .links a { transition:color .2s; }
.foot-col .links a:hover { color:#fff; }
.foot-bottom { display:flex; flex-wrap:wrap; justify-content:space-between; gap:12px; padding-top:24px; font-size:12.5px; color:#6c6d74; }
.foot-bottom .right { display:flex; gap:18px; flex-wrap:wrap; }
.foot-bottom a { transition:color .2s; }
.foot-bottom a:hover { color:#fff; }

/* responsive */
@media (max-width:880px) {
  .nav-links { gap:14px; }
  .nav-link { display:none; }
  .about-grid, .banner-grid, .effect-grid, .contact-grid { grid-template-columns:1fr; }
  .cols3, .why-cols, .ai-cols, .metrics { grid-template-columns:1fr; }
  .stats { grid-template-columns:repeat(2,1fr); row-gap:30px; }
  .adv-row { grid-template-columns:48px 1fr; gap:20px; }
  .adv-row .body { grid-template-columns:1fr; gap:10px; }
  .cols3 > div, .why-cols > div { border-right:none; border-bottom:1px solid #ddd9cd; }
  .ai-cols > div { border-right:none; border-bottom:1px solid rgba(255,255,255,0.12); }
}
