/* 版本二：国际影展调性。满幅流体布局，超大字号对比，中英并置。
   配色仍取 docs/06 常量，但用法不同：以近黑与米白为底，金色只作重音。 */
:root{
  --ink:#0E1116;          /* 比 161B26 更沉，接近印刷黑 */
  --ink-2:#1A1F29;
  --paper:#FAF8F4;        /* 米白纸感，比纯白柔和 */
  --paper-2:#F1EDE5;
  --line:#D6D2C8;
  --line-d:#2A303C;
  --gold:#B8860B;
  --gold-l:#D4A93A;
  --blue:#2E5C8A;
  --teal:#2B7A85;
  --gray:#6B7280;
  --dim:#8D94A3;

  /* 流体字号：小屏到 1920 宽屏连续变化，不靠断点跳档 */
  --d0: clamp(38px, 7.4vw, 116px);
  --d1: clamp(30px, 4.6vw, 72px);
  --d2: clamp(22px, 2.6vw, 40px);
  --d3: clamp(17px, 1.35vw, 22px);
  --body: clamp(14.5px, 0.98vw, 17px);
  --meta: clamp(10px, 0.72vw, 12px);

  --pad: clamp(20px, 4.4vw, 76px);
  --maxw: 1720px;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}
body{
  margin:0;background:var(--paper);color:var(--ink);
  font:var(--body)/1.75 "PingFang SC","Hiragino Sans GB","Microsoft YaHei",system-ui,sans-serif;
  -webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;
}
a{color:inherit;text-decoration:none}

/* 容器：满幅贴边。版心不靠居中收口，靠正文自身的 max-width 控制行长，
   这样超宽屏上版面真正铺开，而不是中间一条窄带。 */
.w{width:100%;padding:0 var(--pad)}
.bleed{width:100%;padding:0 var(--pad)}

/* 小型大写标签：只对拉丁文加字距，中文不加 */
.lab{
  font-size:var(--meta);letter-spacing:.24em;text-transform:uppercase;
  color:var(--gold);font-weight:600;
}
.lab.cn{letter-spacing:.08em;text-transform:none}
.rule{height:1px;background:var(--line);border:0;margin:0}
.rule.d{background:var(--line-d)}

/* ── 顶栏 ── */
.nav{position:sticky;top:0;z-index:60;background:rgba(250,248,244,.92);
  backdrop-filter:saturate(160%) blur(10px);border-bottom:1px solid var(--line)}
.nav .in{display:flex;align-items:baseline;gap:clamp(16px,2.4vw,44px);
  height:clamp(54px,4.4vw,72px);width:100%;padding:0 var(--pad)}
.nav .mark{font-weight:700;font-size:var(--d3);letter-spacing:.01em;white-space:nowrap}
.nav .mark em{display:block;font-style:normal;font-size:var(--meta);letter-spacing:.22em;
  color:var(--gold);font-weight:600;margin-top:2px}
.nav ul{display:flex;gap:clamp(12px,1.5vw,28px);list-style:none;margin:0 0 0 auto;padding:0;
  font-size:clamp(12px,.86vw,14px);flex-wrap:wrap}
.nav a{color:var(--gray);padding-bottom:3px;border-bottom:1.5px solid transparent;transition:.2s}
.nav a:hover{color:var(--ink)}
.nav a.on{color:var(--ink);border-bottom-color:var(--gold)}
.nav a.go{background:var(--ink);color:var(--paper);padding:7px 18px;border:0}
.nav a.go:hover{background:var(--gold);color:var(--ink)}

/* ── 首屏：影展海报式 ── */
/* 首屏高度由内容决定。
   上留白刻意小于下留白：海报式首屏的重心应当偏下，上重下轻会显得没排完。
   1920 宽下上 60px、下 72px，比值约 0.83。 */
.hero{background:var(--ink);color:var(--paper);display:flex;flex-direction:column;
  justify-content:flex-end}
.hero .in{width:100%;padding:clamp(32px,3.4vw,60px) var(--pad) clamp(40px,4.6vw,72px)}

/* 子页首屏。内容比首页少，留白同比收窄。
   原先这组值以内联样式散在 12 个模板里，改动要逐个找，收进这里统一管。 */
.hero.sub .in{padding:clamp(26px,2.6vw,44px) var(--pad) clamp(30px,3.2vw,52px)}
.hero .top{color:var(--gold-l);margin-bottom:clamp(20px,3.4vw,54px)}
.hero .top .en{color:var(--dim);letter-spacing:.24em;font-size:var(--meta);margin-top:6px}
.hero h1{font-size:var(--d0);line-height:.98;margin:0;font-weight:700;letter-spacing:-.01em}
.hero .en-big{font-size:clamp(20px,3.1vw,52px);line-height:1.02;margin:clamp(8px,1vw,16px) 0 0;
  font-weight:300;letter-spacing:.03em;color:transparent;
  -webkit-text-stroke:1px var(--dim);text-stroke:1px var(--dim)}
.hero .motto{margin:clamp(22px,3vw,46px) 0 0;font-size:var(--d3);color:var(--gold-l);letter-spacing:.06em}
.hero .motto em{display:block;font-style:normal;font-size:clamp(11px,.82vw,13.5px);
  letter-spacing:.2em;color:var(--dim);margin-top:8px;text-transform:uppercase}
.hero .lines{margin:clamp(22px,2.6vw,40px) 0 0;max-width:66ch;color:#B9C0CD;
  font-size:var(--body);line-height:2.05}
.hero .lines p{margin:0}

/* 首屏底栏：编号索引 ＋ 行动 */
.strip{border-top:1px solid var(--line-d);background:var(--ink)}
/* 底栏满幅：四格等分铺满视口，金色行动块直抵右边缘。
   原先受 max-width 收口，金块右侧空出一条暗带，看着像没做完。 */
.strip .in{width:100%;display:grid;
  grid-template-columns:repeat(auto-fit,minmax(190px,1fr));align-items:stretch}
.strip a{padding:clamp(16px,1.7vw,26px) var(--pad);border-right:1px solid var(--line-d);
  display:flex;gap:14px;align-items:baseline;transition:.2s}
.strip a:not(:first-child){padding-left:clamp(18px,1.8vw,32px)}
.strip a:last-child{border-right:0}
.strip a:hover{background:var(--ink-2)}
.strip .no{font-size:clamp(11px,.78vw,13px);color:var(--gold);letter-spacing:.14em;font-weight:600}
.strip .nm{color:var(--paper);font-size:clamp(13px,1vw,16px)}
.strip .nm em{display:block;font-style:normal;color:var(--dim);font-size:var(--meta);
  letter-spacing:.18em;margin-top:3px;text-transform:uppercase}
.strip .cta{background:var(--gold);border-right:0}
.strip .cta:hover{background:var(--gold-l)}
.strip .cta .nm,.strip .cta .no{color:var(--ink)}
.strip .cta .nm em{color:rgba(14,17,22,.6)}

/* ── 区块：编辑式两栏，标签列吸顶 ── */
.sec{padding:clamp(48px,6.5vw,120px) 0;border-top:1px solid var(--line)}
.sec.dark{background:var(--ink);color:var(--paper);border-top-color:var(--line-d)}
.sec.tint{background:var(--paper-2)}
.cols{display:grid;grid-template-columns:minmax(230px,1.05fr) minmax(0,3.3fr);
  gap:clamp(24px,3.6vw,72px);align-items:start}
.cols .side{position:sticky;top:calc(clamp(54px,4.4vw,72px) + 28px)}
.cols .side h2{font-size:var(--d2);line-height:1.22;margin:10px 0 0;font-weight:700;
  letter-spacing:-.005em;text-wrap:balance}
.cols .side .en{font-size:var(--meta);letter-spacing:.22em;color:var(--gray);
  margin-top:10px;text-transform:uppercase}
.sec.dark .cols .side .en{color:var(--dim)}
.lede{font-size:var(--d3);line-height:1.75;margin:0 0 clamp(18px,2vw,32px);max-width:62ch}
.sec p{margin:0 0 1.05em;max-width:70ch}
.sec.dark p{color:#B9C0CD}
.sec .muted{color:var(--gray)}
.sec.dark .muted{color:var(--dim)}

/* ── 索引行：影展节目单式 ── */
.idx{border-top:1px solid var(--line)}
.sec.dark .idx{border-top-color:var(--line-d)}
.idx .it{display:grid;grid-template-columns:clamp(38px,3.4vw,72px) minmax(0,1fr) minmax(0,1.35fr);
  gap:clamp(14px,2vw,40px);padding:clamp(18px,2.2vw,34px) 0;
  border-bottom:1px solid var(--line);align-items:start;transition:.25s}
.sec.dark .idx .it{border-bottom-color:var(--line-d)}
.idx a.it:hover{padding-left:10px}
.idx .n{font-size:clamp(12px,.86vw,15px);color:var(--gold);letter-spacing:.1em;
  font-weight:600;padding-top:.35em}
.idx h3{margin:0;font-size:var(--d3);font-weight:700;line-height:1.35}
.idx h3 em{display:block;font-style:normal;font-size:var(--meta);letter-spacing:.2em;
  color:var(--gray);margin-top:6px;text-transform:uppercase;font-weight:600}
.sec.dark .idx h3 em{color:var(--dim)}
.idx .txt{color:var(--gray);font-size:var(--body);max-width:62ch}
.sec.dark .idx .txt{color:#B9C0CD}

/* ── 数字带 ── */
.nums{display:grid;grid-template-columns:repeat(auto-fit,minmax(130px,1fr));
  gap:clamp(14px,2vw,36px);margin-top:clamp(18px,2vw,30px)}
.nums div{border-top:1px solid var(--line);padding-top:12px}
.sec.dark .nums div{border-top-color:var(--line-d)}
.nums b{display:block;font-size:var(--d2);font-weight:700;line-height:1.05;letter-spacing:-.01em}
.sec.dark .nums b{color:var(--gold-l)}
.nums span{display:block;font-size:var(--meta);letter-spacing:.16em;color:var(--gray);margin-top:8px}
.sec.dark .nums span{color:var(--dim)}

/* ── 表 ── */
.tb{width:100%;max-width:1180px;border-collapse:collapse;margin:clamp(14px,1.6vw,24px) 0}
.tb th,.tb td{border-bottom:1px solid var(--line);padding:clamp(11px,1.1vw,16px) 10px;
  text-align:left;vertical-align:top;font-size:var(--body)}
.tb th{font-size:var(--meta);letter-spacing:.16em;color:var(--gray);text-transform:uppercase;font-weight:600}
.sec.dark .tb th,.sec.dark .tb td{border-bottom-color:var(--line-d)}

/* ── 定义列表 ── */
.dl{border-top:1px solid var(--line)}
.sec.dark .dl{border-top-color:var(--line-d)}
.dl .r{display:grid;grid-template-columns:minmax(140px,.9fr) minmax(0,3fr);
  gap:clamp(14px,2.2vw,44px);padding:clamp(15px,1.8vw,26px) 0;border-bottom:1px solid var(--line)}
.sec.dark .dl .r{border-bottom-color:var(--line-d)}
.dl dt{font-weight:700;font-size:var(--body)}
.dl dd{margin:0;color:var(--gray);max-width:74ch}
.sec.dark .dl dd{color:#B9C0CD}

/* ── 按钮 ── */
.btn{display:inline-flex;align-items:center;gap:10px;padding:clamp(11px,1vw,15px) clamp(22px,2vw,36px);
  background:var(--ink);color:var(--paper);font-size:var(--body);transition:.2s;border:1px solid var(--ink)}
.btn:hover{background:var(--gold);border-color:var(--gold);color:var(--ink)}
.btn.o{background:transparent;color:var(--ink)}
.btn.o:hover{background:var(--ink);color:var(--paper)}
.sec.dark .btn{background:var(--gold);border-color:var(--gold);color:var(--ink)}
.sec.dark .btn:hover{background:var(--paper);border-color:var(--paper)}

/* ── 提示 ── */
.box{border-left:2px solid var(--gold);padding:clamp(14px,1.4vw,22px) clamp(16px,1.6vw,28px);
  background:var(--paper-2);margin:clamp(16px,1.8vw,28px) 0;font-size:var(--body)}
.sec.dark .box{background:var(--ink-2);border-left-color:var(--gold-l)}
.box.warn{border-left-color:#A33;background:#FBF2F2}
.box.ok{border-left-color:var(--teal);background:#EFF6F6}

/* ── 页脚 ── */
.ft{background:var(--ink);color:var(--dim);padding:clamp(40px,5vw,84px) 0 clamp(26px,3vw,44px);
  font-size:clamp(12.5px,.86vw,14px);line-height:1.95}
.ft .grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(190px,1fr));
  gap:clamp(20px,2.6vw,52px)}
.ft h4{color:var(--paper);font-size:var(--meta);letter-spacing:.2em;margin:0 0 14px;
  text-transform:uppercase;font-weight:600}
.ft a:hover{color:var(--paper)}
.ft .base{margin-top:clamp(28px,3.4vw,56px);padding-top:clamp(18px,2vw,30px);
  border-top:1px solid var(--line-d);color:#6E7686;font-size:clamp(11.5px,.78vw,13px)}

/* ── 面包屑与返回 ── */
/* 子页原先只有顶部导航，没有任何返回入口，深层页尤其明显。
   面包屑放在首屏引导行上方，返回首页与上级都在一步之内。 */
.crumb{display:flex;align-items:center;gap:10px;margin-bottom:clamp(14px,1.8vw,26px);
  font-size:var(--meta);letter-spacing:.14em;color:var(--dim);flex-wrap:wrap}
.crumb a{color:var(--dim);border-bottom:1px solid transparent;padding-bottom:2px;transition:.2s}
.crumb a:hover{color:var(--gold-l);border-bottom-color:var(--gold-l)}
.crumb .sep{opacity:.45}
.crumb .cur{color:var(--paper)}
.sec .crumb{color:var(--gray)}
.sec .crumb a{color:var(--gray)}
.sec .crumb a:hover{color:var(--ink);border-bottom-color:var(--gold)}
.sec .crumb .cur{color:var(--ink)}

/* 返回上级：正文末尾的显式出口 */
.back{display:inline-flex;align-items:center;gap:9px;margin-top:clamp(28px,3.4vw,54px);
  padding-top:clamp(16px,1.8vw,26px);border-top:1px solid var(--line);
  font-size:var(--body);color:var(--gray);transition:.2s}
.back:hover{color:var(--ink)}
.sec.dark .back{border-top-color:var(--line-d);color:var(--dim)}
.sec.dark .back:hover{color:var(--paper)}

/* 回到顶部：长页滚动一屏后出现 */
.totop{position:fixed;right:16px;bottom:62px;z-index:79;width:44px;height:44px;
  display:flex;align-items:center;justify-content:center;background:var(--ink);
  color:var(--paper);border:1px solid var(--line-d);opacity:0;pointer-events:none;
  transition:opacity .25s,background .2s;font-size:15px}
.totop.show{opacity:1;pointer-events:auto}
.totop:hover{background:var(--gold);color:var(--ink);border-color:var(--gold)}

/* 品牌位可点回首页，加上悬停反馈，否则看不出是链接 */
.nav .mark{transition:.2s}
.nav .mark:hover{color:var(--gold)}

/* ── 主题切换 ── */
.sw{position:fixed;right:16px;bottom:16px;z-index:80;display:flex;
  border:1px solid var(--line-d);background:var(--ink);font-size:11px;letter-spacing:.12em}
.sw a{padding:8px 14px;color:var(--dim)}
.sw a.on{background:var(--gold);color:var(--ink);font-weight:600}

/* ── 正文文档 ── */
.doc{font-size:var(--body);line-height:2.05;max-width:78ch}
.doc h1{font-size:var(--d2);margin:2em 0 .6em;font-weight:700}
.doc h2{font-size:var(--d3);margin:1.9em 0 .5em;font-weight:700}
.doc h3{font-size:var(--body);margin:1.6em 0 .4em;font-weight:700}
.doc p{margin:0 0 .9em}
.doc table{width:100%;border-collapse:collapse;margin:1.2em 0}
.doc th,.doc td{border-bottom:1px solid var(--line);padding:10px 8px;text-align:left;
  vertical-align:top;font-size:calc(var(--body) - .5px)}
.toc{border-top:1px solid var(--line);border-bottom:1px solid var(--line);
  padding:clamp(14px,1.6vw,24px) 0;margin:0 0 clamp(24px,3vw,44px);
  columns:2;column-gap:clamp(20px,3vw,50px)}
.toc a{display:block;color:var(--gray);padding:3px 0;font-size:calc(var(--body) - 1px);
  break-inside:avoid}
.toc a:hover{color:var(--ink)}

/* ── 表单 ── */
.fm label{display:block;margin:clamp(14px,1.4vw,20px) 0 5px;font-size:var(--meta);
  letter-spacing:.14em;color:var(--gray);text-transform:uppercase;font-weight:600}
.fm input[type=text],.fm input[type=number],.fm input[type=email],.fm select,.fm textarea{
  width:100%;padding:clamp(9px,.9vw,13px) 12px;border:1px solid var(--line);
  background:#fff;font:inherit;font-size:var(--body);border-radius:0}
.fm input:focus,.fm select:focus,.fm textarea:focus{outline:0;border-color:var(--ink)}
.fm textarea{min-height:86px;resize:vertical}
.fm .g{display:grid;grid-template-columns:repeat(auto-fit,minmax(210px,1fr));
  gap:clamp(12px,1.6vw,26px)}
.tabs{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));
  border:1px solid var(--line);margin:clamp(14px,1.6vw,24px) 0 6px}
.tabs button{padding:clamp(11px,1.1vw,16px);border:0;border-right:1px solid var(--line);
  background:#fff;font:inherit;font-size:var(--body);cursor:pointer;color:var(--gray)}
.tabs button:last-child{border-right:0}
.tabs button.on{background:var(--ink);color:var(--paper)}
.up{border:1px solid var(--line);padding:clamp(14px,1.4vw,22px);margin:12px 0;background:#fff}
.up.on{border-color:var(--blue)}
.up.done{border-color:var(--teal);background:#F4FAFA}
.up .nm{font-weight:700;margin-bottom:5px;font-size:var(--body)}
.up .hi{font-size:calc(var(--body) - 1.5px);color:var(--gray);margin-bottom:9px}
.bar{height:2px;background:var(--line);margin:10px 0 6px;display:none}
.bar i{display:block;height:100%;width:0;background:var(--ink);transition:width .25s}
.up .st{font-size:calc(var(--body) - 1.5px);color:var(--gray)}

@media(max-width:900px){
  /* 导航：窄屏下 9 个菜单项会换成 7 行，而容器高度是固定的，
     后 8 项会被整个裁掉，手机上无法导航。改为品牌单独一行、
     菜单横向可滑，始终单行，不裁切。 */
  .nav .in{height:auto;flex-direction:column;align-items:stretch;
    gap:8px;padding-top:10px;padding-bottom:10px}
  .nav ul{margin-left:0;flex-wrap:nowrap;overflow-x:auto;gap:18px;
    padding-bottom:6px;scrollbar-width:none;-webkit-overflow-scrolling:touch}
  .nav ul::-webkit-scrollbar{display:none}
  .nav li{flex:0 0 auto}
  .nav a.go{padding:6px 14px}

  /* 三个通道页签在 335px 内只排得下 2 列，第三个单独占半行，
     视觉上失衡。窄屏改为整列堆叠。 */
  .tabs{grid-template-columns:1fr}
  .tabs button{border-right:0;border-bottom:1px solid var(--line)}
  .tabs button:last-child{border-bottom:0}

  .cols{grid-template-columns:1fr}
  .cols .side{position:static}

  /* 索引行在窄屏收成两列：编号一列，其余全在第二列。
     原先只写了 .idx .txt{grid-column:2}，但首页与规则页的第三个子元素
     是包着说明和数字带的外层 div，选择器没命中，它被自动排进 30px 宽的
     第一列，正文被挤成一字一行。改成「第二个及之后的子元素一律进第二列」。 */
  .idx .it{grid-template-columns:clamp(30px,7vw,48px) minmax(0,1fr)}
  .idx .it > *:nth-child(n+2){grid-column:2;min-width:0}
  .idx .txt{max-width:none}
  .nums{grid-template-columns:repeat(auto-fit,minmax(96px,1fr))}

  /* 导航项的可点高度原为 21px，手指点不准。撑到 44px，
     与 iOS 的最小点击区一致；横向滑动时也更容易命中。 */
  .nav ul a{display:flex;align-items:center;min-height:44px}
  .nav a.go{min-height:38px}
  .dl .r{grid-template-columns:1fr;gap:6px}
  .toc{columns:1}
  /* 这里原有一条 .hero{min-height:auto;padding-top:clamp(48px,14vw,90px)}。
     首屏重构后留白已由 .hero .in 统一控制，那条成了重复叠加：
     窄屏上 52.5+32=85px、下仅 40px，比值 2.1，比桌面端更头重。已删除。 */
  .strip .in{grid-template-columns:1fr}
  .strip a{border-right:0;border-bottom:1px solid var(--line-d)}
}
