/* ===========================================================
   金彩国际 JINCAI INTERNATIONAL
   设计令牌 — 数值取自 Ardot 画布设计稿
   =========================================================== */
:root{
  --bg-warm:      #F5F2ED;  /* 暖米白 · 页面底色 */
  --bg-card:      #FFFFFF;  /* 卡片 */
  --bg-soft:      #FBFAF7;  /* 联系区底色 */
  --ink:          #3A352F;  /* 主文字 墨灰褐 */
  --ink-body:     #7A736B;  /* 正文 暖灰 */
  --accent:       #A89A86;  /* 主强调 莫兰迪卡其 */
  --icon:         #8C7E6A;  /* 图标描边 */
  --rule:         #E4DED4;  /* 分割线 */
  --hairline:     #D8D0C4;  /* 装饰细线 */
  --btn-outline:  #C7BEAF;  /* 次按钮描边 */

  --footer-bg:      #3A352F;
  --footer-line:    #554E44;
  --footer-logo-line:#5A534A;
  --footer-title:   #A89A86;
  --footer-link:    #C9C1B5;
  --footer-intro:   #B7AEA1;

  --serif: 'Cormorant', 'Times New Roman', Georgia, serif;
  --sans:  'Noto Sans SC', 'Source Han Sans CN', 'PingFang SC', 'Microsoft YaHei', sans-serif;

  --gutter: 80px;           /* 页面左右留白 */
  --content: 1280px;        /* 内容区宽度 */
}

*{ margin:0; padding:0; box-sizing:border-box; }

html{ -webkit-font-smoothing:antialiased; text-rendering:optimizeLegibility; }

body{
  font-family: var(--sans);
  font-weight: 400;
  font-size: 16px;
  color: var(--ink-body);
  background: var(--bg-warm);
  line-height: 1.6;
}

a{ text-decoration:none; color:inherit; }
img{ display:block; }

.container{
  width:100%;
  max-width:1440px;
  margin:0 auto;
  padding-left: var(--gutter);
  padding-right: var(--gutter);
}

/* 通用小标题（英文衬线描眉） */
.eyebrow{
  font-family: var(--serif);
  font-weight:500;
  font-size:14px;
  letter-spacing:4px;
  color: var(--icon);
  line-height:1.4;
}

/* 按钮 ===================================================== */
.btn{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  font-family: var(--sans);
  font-size:15px;
  font-weight:500;
  letter-spacing:2px;
  border-radius:2px;
  padding:16px 46px;
  cursor:pointer;
  transition: background-color .25s ease, color .25s ease, border-color .25s ease;
  white-space:nowrap;
}
.btn-primary{ background: var(--accent); color:#FFFFFF; border:1px solid var(--accent); }
.btn-primary:hover{ background:#988B77; border-color:#988B77; }

.btn-outline{ background: var(--bg-warm); color: var(--ink); border:1px solid var(--btn-outline); }
.btn-outline:hover{ border-color: var(--accent); }
.btn-outline-light{ background: var(--bg-soft); }

.btn-ghost{
  font-size:14px;
  font-weight:500;
  letter-spacing:1px;
  padding:10px 26px;
  border:1px solid var(--icon);
  border-radius:2px;
  background: var(--bg-warm);
  color: var(--ink);
  transition: background-color .25s ease, color .25s ease;
}
.btn-ghost:hover{ background: var(--accent); color:#FFFFFF; border-color: var(--accent); }

/* 1. 导航栏 ================================================ */
.nav{ background: var(--bg-warm); }
.nav-inner{
  max-width:1440px;
  margin:0 auto;
  height:84px;
  padding:0 var(--gutter);
  display:flex;
  align-items:center;
  justify-content:space-between;
}
.logo{ display:flex; align-items:center; gap:14px; }
.logo-cn{
  font-family: var(--sans);
  font-size:20px; font-weight:500;
  letter-spacing:2px; color: var(--ink);
}
.logo-line{ width:1px; height:20px; background: var(--hairline); display:block; }
.logo-en{
  font-family: var(--serif);
  font-size:15px; font-weight:500;
  letter-spacing:3px; color: var(--icon);
}
.nav-links{ display:flex; align-items:center; gap:44px; }
.nav-link{
  font-size:14px; color: var(--ink-body);
  transition: color .25s ease;
}
.nav-link:hover{ color: var(--ink); }
.nav-link.is-active{ color: var(--ink); font-weight:500; }

.nav-divider{ height:1px; background: var(--rule); width:100%; }

/* 2. 首屏 ================================================== */
.hero{ background: var(--bg-warm); }
.hero-main{
  max-width:1440px;
  margin:0 auto;
  padding:110px var(--gutter) 96px;
  display:flex;
  flex-direction:column;
  align-items:center;
  gap:24px;
}
.orn-line{ width:1px; height:34px; background: var(--hairline); display:block; }
.hero-en{
  font-family: var(--serif);
  font-style:italic; font-weight:500;
  font-size:22px; letter-spacing:1px;
  color: var(--icon);
}
.hero-title{
  font-family: var(--sans);
  font-size:56px; font-weight:300;
  letter-spacing:6px;
  line-height:84px;
  color: var(--ink);
}
.hero-sub{
  font-size:16px; line-height:32px;
  color: var(--ink-body);
  max-width:560px;
  text-align:center;
}
.hero-cta{ display:flex; gap:18px; padding:20px 0 10px; }
.hero-trust{
  font-size:13px; letter-spacing:1px;
  color: var(--icon);
}
.hero-image-wrap{
  max-width:1440px;
  margin:0 auto;
  padding:0 var(--gutter) 100px;
}
.hero-image{
  width:100%; height:420px;
  object-fit:cover;
  border-radius:4px;
}

/* 3. 品牌理念 ============================================== */
.philosophy{ background: var(--bg-card); padding:110px 0; }
.philosophy .container{ display:flex; flex-direction:column; gap:72px; }
.philo-split{ display:flex; gap:96px; }
.philo-left{
  width:430px; flex:0 0 430px;
  display:flex; flex-direction:column; gap:26px;
}
.philo-title{
  font-size:38px; font-weight:300;
  letter-spacing:2px; line-height:60px;
  color: var(--ink);
}
.philo-para{
  font-size:15px; line-height:30px;
  color: var(--ink-body);
  max-width:420px;
}
.philo-right{ flex:1; }
.philo-item{ display:flex; gap:22px; align-items:flex-start; }
.philo-item-first{ padding-bottom:30px; }
.philo-item:not(.philo-item-first):not(.philo-item-last){ padding:30px 0; }
.philo-item-last{ padding-top:30px; }
.philo-num{
  font-family: var(--serif);
  font-size:24px; font-weight:400;
  line-height:30px; color: var(--accent);
}
.philo-item-text{ display:flex; flex-direction:column; gap:8px; }
.philo-item-title{
  font-size:18px; font-weight:500;
  letter-spacing:1px; color: var(--ink);
}
.philo-item-desc{
  font-size:14px; line-height:26px;
  color: var(--ink-body); max-width:520px;
}
.rule{ height:1px; background: var(--rule); width:100%; }

.stats{ display:flex; flex-direction:column; }
.stats-rule{ height:1px; background: var(--rule); width:100%; }
.stats-row{ padding-top:64px; display:flex; align-items:center; }
.stat{
  flex:1;
  display:flex; flex-direction:column;
  align-items:center; gap:12px;
}
.stat-num{
  font-family: var(--serif);
  font-size:46px; font-weight:500;
  line-height:52px; color: var(--ink);
}
.stat-label{
  font-size:14px; letter-spacing:2px;
  color: var(--ink-body);
}
.stat-divider{ width:1px; height:52px; background: var(--rule); flex:0 0 1px; }

/* 区块标题 ================================================= */
.section-head{ display:flex; flex-direction:column; gap:18px; }
.section-head-center{ align-items:center; text-align:center; }
.section-title{
  font-size:34px; font-weight:300;
  letter-spacing:3px; color: var(--ink);
  line-height:1.4;
}
.section-sub{ font-size:15px; letter-spacing:1px; color: var(--ink-body); }

/* 4. 核心服务 ============================================== */
.services{ background: var(--bg-warm); padding:110px 0; }
.services .container{ display:flex; flex-direction:column; gap:56px; }
.service-grid{
  display:grid;
  grid-template-columns:repeat(4, 1fr);
  gap:24px;
}
.service-card{
  background: var(--bg-card);
  border-radius:4px;
  padding:40px 32px;
  display:flex; flex-direction:column; gap:16px;
  transition: box-shadow .3s ease, transform .3s ease;
}
.service-card:hover{
  box-shadow:0 12px 32px rgba(58,53,47,.06);
  transform:translateY(-2px);
}
.card-icon{ display:block; width:26px; height:26px; }
.card-eyebrow{
  font-family: var(--serif);
  font-size:12px; font-weight:500;
  letter-spacing:3px; color: var(--icon);
}
.card-title{
  font-size:19px; font-weight:500;
  letter-spacing:1px; color: var(--ink);
}
.card-desc{ font-size:14px; line-height:26px; color: var(--ink-body); }

/* 5. 目的地 =============================================== */
.destinations{ background: var(--bg-card); padding:110px 0; }
.destinations .container{ display:flex; flex-direction:column; gap:56px; }
.dest-head{
  display:flex; align-items:flex-end; justify-content:space-between;
}
.dest-head-left{ display:flex; flex-direction:column; gap:18px; }
.text-link{
  display:inline-flex; align-items:center; gap:8px;
  padding-bottom:8px;
  font-size:14px; font-weight:500;
  letter-spacing:1px; color: var(--icon);
  transition: color .25s ease;
}
.text-link:hover{ color: var(--accent); }

.dest-grid{
  display:grid;
  grid-template-columns:repeat(5, 1fr);
  gap:20px;
}
.dest-card{ display:flex; flex-direction:column; gap:16px; }
.dest-img{
  width:100%; height:320px;
  object-fit:cover; border-radius:4px;
  transition: opacity .35s ease;
}
.dest-card:hover .dest-img{ opacity:.92; }
.dest-name-row{
  display:flex; flex-wrap:wrap; align-items:baseline; gap:4px 10px;
}
.dest-name{
  font-size:19px; font-weight:500;
  letter-spacing:1px; color: var(--ink);
}
.dest-name-en{
  font-family: var(--serif);
  font-style:italic; font-weight:500;
  font-size:12px; letter-spacing:1.5px;
  color: var(--icon); white-space:nowrap;
}
.dest-desc{ font-size:13px; line-height:24px; color: var(--ink-body); }
.dest-meta{
  font-size:11px; letter-spacing:1.5px; color: var(--icon);
  padding-top:2px;
}

/* 6. 信任背书 ============================================= */
.trust{ background: var(--bg-warm); padding:110px 0; }
.trust .container{ display:flex; flex-direction:column; gap:56px; }
.quote-row{ display:flex; gap:24px; }
.quote-card{
  flex:1;
  background: var(--bg-card);
  border-radius:4px;
  padding:44px 40px;
  display:flex; flex-direction:column; gap:20px;
}
.quote-mark{
  font-family: var(--serif);
  font-size:54px; font-weight:500;
  line-height:54px; color: var(--accent);
}
.quote-text{
  font-size:15px; line-height:30px; color: var(--ink);
}
.quote-rule{ width:40px; height:1px; background: var(--rule); display:block; }
.quote-name{
  font-size:14px; font-weight:500; letter-spacing:1px; color: var(--ink);
}
.quote-trip{ font-size:13px; color: var(--ink-body); }

/* 7. 联系方式 ============================================= */
.contact{ background: var(--bg-soft); padding:120px 0; }
.contact-inner{
  display:flex; flex-direction:column; align-items:center;
  gap:26px; text-align:center;
}
.contact-title{
  font-size:36px; font-weight:300;
  letter-spacing:3px; color: var(--ink);
  line-height:1.4;
}
.contact-cta{ display:flex; gap:18px; padding-top:18px; flex-wrap:wrap; justify-content:center; }
.contact-info{
  display:flex; gap:88px; padding-top:48px;
  justify-content:center; flex-wrap:wrap;
}
.info-item{
  display:flex; flex-direction:column; align-items:center; gap:10px;
  font-size:14px; letter-spacing:1px; color: var(--ink);
}

/* 意向表单 ================================================ */
.lead-form{
  width:100%; max-width:780px;
  margin-top:20px;
  background: var(--bg-card);
  border-radius:4px;
  padding:52px 48px 40px;
  text-align:left;
}
.form-grid{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:26px 24px;
}
.field{ display:flex; flex-direction:column; gap:10px; }
.field-full{ grid-column:1 / -1; }
.field-label{
  font-size:12px; letter-spacing:2px; color: var(--icon);
}
.field-input{
  width:100%;
  font-family: var(--sans);
  font-size:15px; line-height:1.6;
  color: var(--ink);
  background: var(--bg-soft);
  border:1px solid var(--rule);
  border-radius:2px;
  padding:14px 16px;
  transition: border-color .25s ease, background-color .25s ease;
  -webkit-appearance:none; appearance:none;
}
.field-input::placeholder{ color:#B6ADA0; }
.field-input:focus{
  outline:none;
  background:#FFFFFF;
  border-color: var(--accent);
}
.field-textarea{ resize:vertical; min-height:104px; line-height:1.8; }
.field-select{
  cursor:pointer; padding-right:44px;
  background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'><path d='M1 1.5L6 6.5L11 1.5' stroke='rgb(140,126,106)' stroke-width='1.2' fill='none' stroke-linecap='round' stroke-linejoin='round'/></svg>");
  background-repeat:no-repeat;
  background-position:right 16px center;
  background-size:12px 8px;
}

/* 蜜罐：真人看不见，自动脚本会填 */
.hp-field{
  position:absolute; left:-9999px;
  width:1px; height:1px; overflow:hidden;
}

.form-foot{
  display:flex; align-items:center; gap:24px;
  margin-top:32px; flex-wrap:wrap;
}
.form-submit{ cursor:pointer; }
.form-submit:disabled{ opacity:.6; cursor:default; }
.form-hint{
  flex:1; min-width:200px;
  font-size:12px; line-height:20px; color: var(--ink-body);
}
.form-privacy{
  margin-top:18px;
  font-size:13px; line-height:24px;
  color: var(--ink-body);
}
.form-msg{ margin-top:18px; min-height:20px; font-size:13px; line-height:22px; }
.form-msg.is-ok{ color:#5C7A5C; }
.form-msg.is-err{ color:#A6604F; }

.lead-form.is-sent{ padding:64px 48px; text-align:center; }
.lead-form.is-sent .form-grid,
.lead-form.is-sent .form-privacy,
.lead-form.is-sent .form-foot{ display:none; }
.lead-form.is-sent .form-msg{
  margin-top:0; font-size:16px; line-height:30px;
  letter-spacing:1px; color: var(--ink);
}

/* 8. 页脚 ================================================= */
.footer{ background: var(--footer-bg); padding:64px 0 36px; }
.footer-top{ display:flex; justify-content:space-between; gap:40px; }
.footer-brand{ display:flex; flex-direction:column; gap:12px; }
.footer-logo-row{ display:flex; align-items:center; gap:12px; }
.footer-logo-cn{
  font-size:17px; font-weight:500; letter-spacing:2px; color:#F5F2ED;
}
.footer-logo-line{ width:1px; height:16px; background: var(--footer-logo-line); display:block; }
.footer-logo-en{
  font-family: var(--serif);
  font-size:12px; font-weight:500; letter-spacing:3px; color: var(--footer-title);
}
.footer-tagline{
  font-family: var(--serif);
  font-style:italic; font-weight:500;
  font-size:14px; letter-spacing:1px; color: var(--icon);
}
.footer-intro{
  font-size:13px; line-height:24px; color: var(--footer-intro);
}
.footer-col{ display:flex; flex-direction:column; gap:16px; }
.footer-col-title{
  font-size:12px; font-weight:500; letter-spacing:3px; color: var(--footer-title);
}
.footer-links{ display:flex; flex-direction:column; gap:12px; }
.footer-links a{
  font-size:13px; color: var(--footer-link);
  transition: color .25s ease;
}
.footer-links a:hover{ color:#F5F2ED; }

.footer-bottom{ padding-top:36px; }
.footer-rule{ height:1px; background: var(--footer-line); width:100%; }
.footer-meta{
  display:flex; justify-content:space-between; align-items:center;
  padding-top:24px; gap:24px; flex-wrap:wrap;
  font-size:12px; letter-spacing:1px; color: var(--footer-title);
}

/* 待补充状态 ============================================== */
.pending{ color: var(--icon); }
.info-label{
  font-size:12px; letter-spacing:2px; color: var(--icon);
}
.stat-unit{ font-size:24px; letter-spacing:0; }
.contact-info-social{ padding-top:32px; }

/* 自适应降级（保持大屏 1440 还原度优先） ================== */
@media (max-width:1200px){
  :root{ --gutter:48px; }
  .service-grid{ grid-template-columns:repeat(2, 1fr); }
  .dest-grid{ grid-template-columns:repeat(3, 1fr); gap:24px; }
  .dest-img{ height:280px; }
  .philo-split{ flex-direction:column; gap:48px; }
  .philo-left{ width:100%; flex:none; }
  .philo-para,.philo-item-desc{ max-width:100%; }
  .contact-info{ gap:48px; }
  .footer-top{ flex-wrap:wrap; }
}
@media (max-width:900px){
  .quote-row{ flex-direction:column; }
  .form-grid{ grid-template-columns:1fr; gap:22px; }
  .lead-form{ padding:40px 32px 32px; }
}
@media (max-width:768px){
  :root{ --gutter:24px; }
  .nav-links{ display:none; }
  .service-grid,.dest-grid{ grid-template-columns:1fr; }
  .quote-row,.footer-top{ flex-direction:column; }
  .hero-title{ font-size:36px; line-height:56px; letter-spacing:4px; }
  .hero-image{ height:260px; }
  .hero-cta{ flex-wrap:wrap; justify-content:center; }
  .hero-cta .btn{ padding:14px 32px; letter-spacing:1px; }
  .lead-form{ padding:32px 22px 26px; }
  .form-foot{ gap:16px; }
  .form-submit{ width:100%; }
}
