/*
 * aiz 首页版本 B —「编辑画报」
 * 风格：浅色高级感 + 大字排版 + 杂志式拼贴，适合品牌调性展示
 */
*{box-sizing:border-box;margin:0;padding:0}
:root{
  --bg:#faf9f7;--surface:#fff;--ink:#111214;--ink-2:#5b5f66;
  --line:#e8e5e0;--accent:#111214;--warm:#e8663d;--warm-soft:#fdf0ea;
}
html{scroll-behavior:smooth}
body{background:var(--bg);color:var(--ink);
  font:15px/1.7 "Helvetica Neue",-apple-system,BlinkMacSystemFont,"PingFang SC","Microsoft YaHei",sans-serif;
  -webkit-font-smoothing:antialiased}
a{color:inherit;text-decoration:none}
img{display:block;max-width:100%}
.wrap{max-width:1240px;margin:0 auto;padding:0 32px}
@media(max-width:640px){.wrap{padding:0 20px}}

/* 顶栏 */
header{position:sticky;top:0;z-index:50;background:rgba(250,249,247,.86);
  backdrop-filter:blur(14px);border-bottom:1px solid var(--line)}
.nav{display:flex;align-items:center;gap:34px;height:72px}
.brand{display:flex;align-items:center;gap:9px;font-size:18px;font-weight:800;letter-spacing:-.4px}
.brand img{width:28px;height:28px;border-radius:8px;object-fit:cover}
.nav-links{display:flex;gap:26px}
.nav-links a{font-size:14px;color:var(--ink-2);font-weight:520;position:relative;padding:4px 0}
.nav-links a::after{content:'';position:absolute;left:0;bottom:0;width:0;height:1.5px;background:var(--ink);transition:width .25s}
.nav-links a:hover{color:var(--ink)}
.nav-links a:hover::after{width:100%}
.nav-right{margin-left:auto;display:flex;gap:10px;align-items:center}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;
  padding:11px 22px;border-radius:99px;font-size:14px;font-weight:650;
  border:1px solid transparent;transition:all .2s}
.btn-dark{background:var(--ink);color:#fff}
.btn-dark:hover{background:#2a2c30;transform:translateY(-1px)}
.btn-line{border-color:var(--line);color:var(--ink-2)}
.btn-line:hover{border-color:var(--ink);color:var(--ink)}

/* Hero 编辑式 */
.hero{padding:74px 0 20px}
.kicker{display:flex;align-items:center;gap:12px;font-size:12px;letter-spacing:.16em;
  text-transform:uppercase;color:var(--ink-2);margin-bottom:26px;font-weight:650}
.kicker::before{content:'';width:36px;height:1px;background:var(--ink)}
h1{font-size:clamp(40px,7.4vw,86px);line-height:.98;letter-spacing:-3.4px;font-weight:830}
h1 .thin{font-weight:250;font-style:normal;letter-spacing:-2.6px}
h1 .accent{color:var(--warm)}
.hero-lead{display:grid;grid-template-columns:1.15fr .85fr;gap:56px;align-items:end;margin-top:38px}
@media(max-width:900px){.hero-lead{grid-template-columns:1fr;gap:26px}}
.hero-lead p{font-size:17px;color:var(--ink-2);max-width:520px;line-height:1.75}
.hero-actions{display:flex;gap:12px;flex-wrap:wrap;margin-top:26px}
.hero-actions .btn{padding:14px 30px;font-size:15px}
.metrics{display:flex;gap:40px;flex-wrap:wrap;padding-top:12px;border-top:1px solid var(--line)}
.metric b{display:block;font-size:26px;font-weight:800;letter-spacing:-.8px;line-height:1.2}
.metric span{font-size:12px;color:var(--ink-2);letter-spacing:.02em}

/* 杂志拼贴 */
.editorial{margin:56px 0 8px;display:grid;grid-template-columns:1.55fr 1fr;gap:16px}
@media(max-width:820px){.editorial{grid-template-columns:1fr}}
.ed-hero{position:relative;border-radius:6px;overflow:hidden;background:#eee}
.ed-hero img{width:100%;height:100%;object-fit:cover;aspect-ratio:16/10}
.ed-side{display:grid;gap:16px;grid-template-rows:1fr 1fr}
.ed-cell{position:relative;border-radius:6px;overflow:hidden;background:#eee}
.ed-cell img{width:100%;height:100%;object-fit:cover;aspect-ratio:16/9}
.cap{position:absolute;left:0;bottom:0;right:0;padding:34px 16px 13px;
  background:linear-gradient(to top,rgba(0,0,0,.72),transparent);color:#fff;
  font-size:12.5px;font-weight:600;letter-spacing:.02em}

/* 作品带 */
.section{padding:76px 0 0}
.sec-head{display:flex;align-items:baseline;justify-content:space-between;gap:18px;
  padding-bottom:22px;border-bottom:1px solid var(--line);margin-bottom:30px}
.sec-head h2{font-size:clamp(26px,3.6vw,40px);letter-spacing:-1.4px;font-weight:800;line-height:1.1}
.sec-head .idx{font-size:12px;color:var(--ink-2);letter-spacing:.16em;font-weight:650}
.sec-head p{color:var(--ink-2);font-size:14.5px;margin-top:6px}
.sec-link{font-size:13.5px;font-weight:650;white-space:nowrap;border-bottom:1.5px solid var(--ink);padding-bottom:2px}

/* 灵感网格 */
.masonry{columns:3;column-gap:16px}
@media(max-width:940px){.masonry{columns:2}}
@media(max-width:600px){.masonry{columns:1}}
.tile{break-inside:avoid;margin-bottom:16px;position:relative;border-radius:6px;overflow:hidden;background:#eee}
.tile img{width:100%;transition:transform .5s cubic-bezier(.2,.8,.2,1)}
.tile:hover img{transform:scale(1.05)}
.tile .ov{position:absolute;inset:0;background:linear-gradient(to top,rgba(0,0,0,.82) 0%,rgba(0,0,0,.12) 46%,transparent 70%);
  opacity:0;transition:opacity .3s;display:flex;flex-direction:column;justify-content:flex-end;padding:16px;color:#fff}
.tile:hover .ov,.tile:focus-within .ov{opacity:1}
.tile .ov h3{font-size:13.5px;font-weight:650;line-height:1.45;
  display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden;margin-bottom:6px}
.tile .ov span{font-size:11.5px;opacity:.85}

/* 能力列表（编号式） */
.rows{border-top:1px solid var(--line)}
.row{display:grid;grid-template-columns:64px 1fr 1.4fr;gap:24px;padding:26px 0;border-bottom:1px solid var(--line);align-items:baseline}
@media(max-width:760px){.row{grid-template-columns:1fr;gap:8px}}
.row .num{font-size:12px;color:var(--ink-2);letter-spacing:.14em;font-weight:650}
.row h3{font-size:19px;font-weight:750;letter-spacing:-.5px}
.row p{color:var(--ink-2);font-size:14.5px}

/* CTA */
.cta{margin:84px 0 72px;padding:64px 40px;background:var(--ink);color:#fff;border-radius:8px;
  display:flex;align-items:center;justify-content:space-between;gap:32px;flex-wrap:wrap}
.cta h2{font-size:clamp(26px,3.8vw,42px);letter-spacing:-1.6px;font-weight:800;line-height:1.1}
.cta p{color:rgba(255,255,255,.62);margin-top:10px;font-size:14.5px}
.cta .btn{background:var(--warm);color:#fff;padding:14px 34px;font-size:15px}
.cta .btn:hover{background:#d9562f;transform:translateY(-1px)}

footer{padding:30px 0 46px;border-top:1px solid var(--line);color:var(--ink-2);font-size:13px}
.foot{display:flex;justify-content:space-between;gap:16px;flex-wrap:wrap}
.foot a:hover{color:var(--ink);text-decoration:underline}

/* 等高示例网格（避免竖图撑高整列） */
.samples{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
@media(max-width:900px){.samples{grid-template-columns:repeat(2,1fr)}}
@media(max-width:600px){.samples{grid-template-columns:1fr}}
.samples .tile img{width:100%;height:100%;aspect-ratio:4/3;object-fit:cover}

/* 移动端适配 */
@media(max-width:760px){
  .nav{gap:12px;height:60px}
  .nav-links{display:none}
  .brand{font-size:16px;white-space:nowrap}
  .nav-right .btn{padding:9px 15px;font-size:13px;white-space:nowrap}
  .nav-right .btn-line{display:none}
  .hero{padding:44px 0 12px}
  h1{letter-spacing:-1.6px}
  .hero-lead{margin-top:24px}
  .metrics{gap:26px;padding-top:16px}
  .metrics .metric b{font-size:21px}
  .editorial{margin:34px 0 0}
  .section{padding:48px 0 0}
  .sec-head{flex-direction:column;align-items:flex-start;gap:8px;padding-bottom:16px;margin-bottom:22px}
  .cta{padding:38px 22px;margin:52px 0 48px}
}

/* ============================================================
   动效层（SEO 友好：全部为渐进增强，JS 失效时内容照常显示）
   ============================================================ */

/* 滚动揭示：默认可见，加 .js-reveal 后才隐藏，避免无 JS 时空白 */
.reveal{opacity:1;transform:none}
.reveal.reveal-armed{opacity:0;transform:translateY(26px);
  transition:opacity .72s cubic-bezier(.22,.61,.36,1),transform .72s cubic-bezier(.22,.61,.36,1)}
.reveal.reveal-armed.is-in{opacity:1;transform:none}
.reveal.reveal-armed.d1{transition-delay:.08s}
.reveal.reveal-armed.d2{transition-delay:.16s}
.reveal.reveal-armed.d3{transition-delay:.24s}
@media(prefers-reduced-motion:reduce){
  .js-reveal .reveal{opacity:1!important;transform:none!important;transition:none!important}
  .marquee__track{animation:none!important}
}

/* 首屏视差：图片轻微位移，营造纵深 */
.parallax-wrap{overflow:hidden;position:relative}
.parallax-img{will-change:transform;transform:translate3d(0,0,0) scale(1.06)}

/* 横向无缝跑马灯（灵感作品自动滚动） */
.marquee{position:relative;overflow:hidden;padding:6px 0;
  -webkit-mask-image:linear-gradient(90deg,transparent,#000 5%,#000 95%,transparent);
  mask-image:linear-gradient(90deg,transparent,#000 5%,#000 95%,transparent)}
.marquee__track{display:flex;gap:14px;width:max-content;animation:marquee 46s linear infinite}
.marquee:hover .marquee__track{animation-play-state:paused}
@keyframes marquee{from{transform:translate3d(0,0,0)}to{transform:translate3d(-50%,0,0)}}
.marquee__item{flex:0 0 auto;width:250px;border-radius:8px;overflow:hidden;position:relative;background:#eee}
.marquee__item img{width:100%;height:170px;object-fit:cover;display:block;transition:transform .5s,filter .5s}
.marquee__item:hover img{transform:scale(1.06)}
.marquee__cap{position:absolute;inset:auto 0 0 0;padding:26px 11px 9px;font-size:11.5px;color:#fff;
  background:linear-gradient(to top,rgba(0,0,0,.82),transparent);
  display:-webkit-box;-webkit-line-clamp:1;-webkit-box-orient:vertical;overflow:hidden}

/* 画廊卡片：悬停放大 + 光晕 */
.tile{transform:translateZ(0)}
.tile::after{content:'';position:absolute;inset:0;pointer-events:none;
  box-shadow:inset 0 0 0 1px rgba(255,255,255,.14);opacity:0;transition:opacity .3s;border-radius:6px}
.tile:hover::after{opacity:1}

/* 卡片加载渐进淡入（图片解码完成后） */
.tile img{opacity:0;transition:opacity .5s ease,transform .5s cubic-bezier(.2,.8,.2,1)}
.tile img.is-loaded{opacity:1}

/* 数字滚动 */
.count{font-variant-numeric:tabular-nums}

/* 滚动进度条 */
.scroll-progress{position:fixed;top:0;left:0;height:2px;width:0;z-index:99;
  background:linear-gradient(90deg,var(--warm),#111214);transition:width .08s linear}


/* 关键：保证 hidden 属性优先于本文件的 display 规则 */
.jn-auth-overlay [hidden],
.jn-auth-overlay [hidden] * { display: none !important; }

/* ============================================================
   登录 / 注册弹窗换肤 —— 匹配「编辑画报」浅色主题
   只覆盖视觉属性（颜色/字体/圆角/阴影），不改布局与显隐逻辑
   ============================================================ */


/* 弹窗定位（原依赖 auth-session.css，本页独立实现） */
.jn-auth-overlay{
  position:fixed;inset:0;z-index:9999;
  display:grid;place-items:center;overflow-y:auto;
  padding:20px;box-sizing:border-box;
}
.jn-auth-overlay[hidden]{display:none !important}
.jn-auth-modal.replica-login-modal{
  position:relative;
  width:min(430px, calc(100vw - 40px));
  max-height:calc(100dvh - 40px);
  overflow-y:auto;
}
@media(max-width:520px){
  .jn-auth-overlay{align-items:flex-end;padding:0}
  .jn-auth-modal.replica-login-modal{width:100%;max-height:92dvh;border-radius:18px 18px 0 0 !important}
}

/* 保证 hidden 属性始终优先 */
.jn-auth-overlay [hidden] { display: none !important; }

body.public-home .jn-auth-overlay,
.jn-auth-overlay { background: rgba(12,12,14,.52) !important; backdrop-filter: blur(6px); }

body.public-home .jn-auth-overlay .jn-auth-modal.replica-login-modal,
.jn-auth-modal.replica-login-modal {
  background: #fff !important;
  border-radius: 14px !important;
  box-shadow: 0 30px 80px -20px rgba(12,12,14,.42), 0 0 0 1px rgba(12,12,14,.05) !important;
  color: #111214 !important;
  font-family: "Helvetica Neue", -apple-system, BlinkMacSystemFont, "PingFang SC", "Microsoft YaHei", sans-serif !important;
}

/* 标题与副标题 */
.jn-auth-logo span { color: #111214 !important; font-weight: 800 !important; letter-spacing: -.3px; }
.jn-auth-subtitle { color: #5b5f66 !important; }


/* 标签页：隐藏未启用方式的按钮，避免空白占位 */
.jn-auth-tabs button[hidden]{display:none !important}
.jn-auth-tabs button[aria-selected="false"]{background:transparent !important}
/* 手机号登录未开启时只显示启用的标签 */


/* 标签容器：按可见按钮数自适应，避免隐藏按钮仍占格 */
.jn-auth-tabs:has(button[hidden]){grid-template-columns:1fr}
.jn-auth-tabs{display:flex !important;gap:4px !important}
.jn-auth-tabs button{flex:1 1 0 !important}
.jn-auth-tabs button[hidden]{display:none !important;flex:0 0 0 !important}

/* 标签页 */
.jn-auth-tabs { background: #f5f3f0 !important; border-radius: 10px !important; }
.jn-auth-tabs button { color: #5b5f66 !important; font-weight: 600 !important; }
.jn-auth-tabs button[aria-selected="true"] { color: #111214 !important; background: #fff !important; border-radius: 7px !important; }
.jn-auth-tabs button::after { display: none !important; }

/* 输入框 */
.jn-auth-modal.replica-login-modal input:not([type="checkbox"]):not([type="radio"]) {
  background: #fbfaf8 !important;
  border: 1px solid #e8e5e0 !important;
  border-radius: 9px !important;
  color: #111214 !important;
  font-size: 14px !important;
  box-shadow: none !important;
}
.jn-auth-modal.replica-login-modal input:not([type="checkbox"]):not([type="radio"]):focus {
  background: #fff !important;
  border-color: #111214 !important;
  box-shadow: 0 0 0 3px rgba(17,18,20,.06) !important;
}
.jn-auth-modal.replica-login-modal input::placeholder { color: #a8abb1 !important; }
.jn-auth-modal.replica-login-modal .jn-auth-form label > span,
.jn-auth-modal.replica-login-modal .jn-registration-form label > span {
  color: #5b5f66 !important; font-size: 12px !important; font-weight: 650 !important;
}

/* 主按钮 */
.jn-auth-modal.replica-login-modal .jn-auth-submit,
.jn-auth-modal.replica-login-modal .jn-registration-form button[type="submit"] {
  background: #111214 !important;
  color: #fff !important;
  border: 0 !important;
  border-radius: 99px !important;
  font-weight: 700 !important;
}
.jn-auth-modal.replica-login-modal .jn-auth-submit:hover:not(:disabled) { background: #2a2c30 !important; }

/* 验证码按钮 */
.jn-auth-modal.replica-login-modal .jn-code-row button[data-send-code] {
  background: #fff !important;
  border: 1px solid #e8e5e0 !important;
  border-radius: 9px !important;
  color: #111214 !important;
  font-weight: 650 !important;
}
.jn-auth-modal.replica-login-modal .jn-code-row button[data-send-code]:hover:not(:disabled) { border-color: #111214 !important; }

/* 提示文字 */
.jn-auth-modal.replica-login-modal .front-auth-inline-tip { border-radius: 8px !important; }

/* 链接与协议 */
.jn-auth-modal.replica-login-modal .jn-auth-forgot-link,
.jn-auth-modal.replica-login-modal .jn-auth-register-switch,
.jn-auth-modal.replica-login-modal .jn-agree span,
.jn-auth-modal.replica-login-modal .jn-third-title { color: #5b5f66 !important; }
.jn-auth-modal.replica-login-modal .jn-agree a { color: #111214 !important; }
.jn-auth-modal.replica-login-modal .jn-agree input[type="checkbox"] { accent-color: #111214 !important; }

/* 第三方登录：仅改颜色，保持原有横向排列 */
.jn-auth-modal.replica-login-modal .jn-social-login-btn {
  background: #fff !important;
  border: 1px solid #e8e5e0 !important;
  color: #111214 !important;
}
.jn-auth-modal.replica-login-modal .jn-third-grid.jn-third-reserved {
  background: transparent !important; border: 0 !important; box-shadow: none !important;
}

/* 协议弹窗只改配色 */
.jn-auth-agreement-layer { background: rgba(12,12,14,.5) !important; }
.jn-auth-agreement-dialog { background: #fff !important; border-radius: 14px !important; color: #111214 !important; }
.jn-auth-agreement-header { background: #f9f8f6 !important; }
.jn-auth-agreement-content { color: #5b5f66 !important; }
.jn-auth-agreement-footer button[data-agreement-confirm] { background: #111214 !important; color: #fff !important; border-radius: 99px !important; }
.jn-auth-agreement-footer button { border-radius: 99px !important; }