/* 第 1 屏的字体尺寸（版式仍由 typography.css 决定，这里只改字号、字重与装饰强度）。

   用户的调整要求（2026-09-17）：
   - "作品集"要大字，和姓名差不多
   - 英文放大，并用 30% 透明度做装饰

   结构（index.html）：
     .screen-name   韩牧            最重的一级
     .screen-sub    作品集          第二级大字，和姓名同量级
     .screen-en     HAN MU / PORTFOLIO   英文，纯装饰（30% 透明度）
     .screen-eyebrow / .screen-tags      小标签

   注意：只对 [data-screen="1"] 生效，不要动 ABOUT / EXPERIENCE 两屏。 */

:root{--decor-opacity:.30}

/* ---- 姓名与"作品集"：两级等量的大字 ---- */
.hero h1.screen-name,
.screen[data-screen="1"] .screen-name{
  font-size:clamp(92px,9.6vw,176px);
  line-height:1;
  letter-spacing:-.02em;
  margin:0 0 6px;
}

/* "作品集"必须显式指定中文字体：
   typography.css 把 .screen-sub 定为 14px 的 Inter，且设了 --font-cn 指向英文字体，
   只写 font-size 会变成"放大的英文无衬线"，不是中文标题。 */
.screen[data-screen="1"] .screen-sub{
  font-family:'Display CN','思源黑体 CN','Source Han Sans SC','Noto Sans SC',
              'PingFang SC','Microsoft YaHei',sans-serif;
  font-weight:700;
  /* 和姓名同量级，略小一档作为第二层 */
  font-size:clamp(72px,7.4vw,136px);
  line-height:1.02;
  letter-spacing:-.01em;
  color:var(--text-primary);
  text-shadow:0 2px 24px rgba(5,5,6,.55);
  margin:0 0 22px;
}

/* ---- 英文：放大 + 30% 透明度，纯装饰，不承载信息 ---- */
.screen[data-screen="1"] .screen-en{
  font-family:var(--font-display-en);
  font-size:clamp(46px,4.6vw,84px);
  line-height:1.08;
  letter-spacing:-.01em;
  opacity:var(--decor-opacity);
  margin:0 0 26px;
}

/* 小标签：跟英文同层的装饰，透明度略高一点保证能读 */
.screen[data-screen="1"] .screen-tags{
  opacity:.72;
}

/* ---- 窄屏：粗体字面宽，同比收字号，避免顶出容器 ---- */
@media(max-width:1100px){
  .hero h1.screen-name,
  .screen[data-screen="1"] .screen-name{font-size:clamp(74px,11vw,118px)}
  .screen[data-screen="1"] .screen-sub{font-size:clamp(56px,8.6vw,96px)}
  .screen[data-screen="1"] .screen-en{font-size:clamp(36px,5.6vw,60px);margin-bottom:18px}
}
@media(max-width:700px){
  .hero h1.screen-name,
  .screen[data-screen="1"] .screen-name{font-size:clamp(62px,16vw,92px)}
  .screen[data-screen="1"] .screen-sub{font-size:clamp(46px,12vw,72px);margin-bottom:16px}
  .screen[data-screen="1"] .screen-en{font-size:clamp(26px,7.6vw,40px);margin-bottom:12px}
  .screen[data-screen="1"] .screen-eyebrow{font-size:10px}
  .screen[data-screen="1"] .screen-tags{font-size:12px}
}
