/* v3 首页九宫格门户 — 数值逐项照抄 docs/mockup-v3.html（380px 基准）。
   作用域限 body.home-v3；其余页面不受影响。
   字号/间距用 cqi 随格子等比缩放（380 手机 → 桌面放大居中），px 值为旧浏览器回退。
   球黄（--ball）只用于 Members 格与宣言格那条 rule；照片格为渐层占位，真照片到位后替换。 */

body.home-v3{
  background:
    repeating-linear-gradient(52deg, rgba(255,255,255,.045) 0 1px, transparent 1px 7px),
    repeating-linear-gradient(-52deg, rgba(255,255,255,.045) 0 1px, transparent 1px 7px),
    linear-gradient(180deg, var(--court), var(--court-deep));
  background-attachment:fixed;
  min-height:100vh;
}

/* ---- 导航：2026-09-15 起统一为 nav.css 的 .lab-nav，透明版覆写随旧 markup 一并移除 ---- */

/* ---- 画布与球场线 ---- */
.v3-main{position:relative;display:flex;flex-direction:column;align-items:center}
/* 裁切只给球场线，main 保持 visible——否则按钮的涟漪在窄窗口会被切掉 */
.v3-courtline-wrap{position:absolute;inset:0;overflow:hidden;pointer-events:none}
.v3-courtline{
  position:absolute;left:-15%;top:118px;width:130%;height:4px;
  background:rgba(242,237,218,.5);transform:rotate(-7deg);pointer-events:none;
}

/* ---- 九宫格 ---- */
.v3-grid{
  position:relative;
  /* minmax(0,1fr)：切断「字号随容器涨→内容撑宽容器」的反馈环，380px 不溢出 */
  display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;
  width:min(100% - 36px, 800px);
  margin:16px auto 0;
  container-type:inline-size;
}
.v3-tile{min-width:0}
.v3-tile{
  aspect-ratio:1;position:relative;
  display:flex;flex-direction:column;justify-content:center;
  padding:10px;padding:2.9cqi;
  box-shadow:0 3px 12px rgba(20,18,16,.25);
  text-decoration:none;
}
.v3-serif{font-family:var(--font-display);font-weight:var(--weight-semibold)}

/* 照片格（渐层占位，来源 mockup；真照片以 background-image 替换） */
.v3-photo{padding:0}
.v3-tag{
  position:absolute;left:8px;bottom:6px;left:2.3cqi;bottom:1.7cqi;
  font-size:9px;font-size:2.6cqi;letter-spacing:1px;color:rgba(253,251,247,.75);
}
.v3-ball{position:absolute;width:15px;height:15px;width:4.4cqi;height:4.4cqi;border-radius:var(--radius-full);background:var(--gold)}
.v3-p1{background:url("../../photos/tiles/p1.jpg") center/cover no-repeat,linear-gradient(135deg,#1e3b2d,#142921)}
.v3-p1 .v3-tag,.v3-p1 .v3-ball{display:none}
.v3-p2{background:url("../../photos/tiles/p2.jpg") center/cover no-repeat,linear-gradient(160deg,#c99a6b,#8a5a35)}
.v3-p2 .v3-tag{display:none}
.v3-p3{background:url("../../photos/tiles/p3.jpg") center/cover no-repeat,linear-gradient(150deg,#7b93a8,#45596b)}
.v3-p3 .v3-tag{display:none}
.v3-p4{background:url("../../photos/tiles/p4.jpg") center/cover no-repeat,linear-gradient(140deg,#d8c193,#987a49)}
.v3-p4 .v3-tag,.v3-p4 .v3-ball{display:none}

/* 宣言格：ink 底 + bone 大字 + 球黄 rule */
/* 宣言格：金底 + 藏青字（host 2026-08-19 定）*/
.v3-statement{background:linear-gradient(140deg,#cbaa63,#a98a4a)}
.v3-statement h1{
  font-size:15px;font-size:4.4cqi;line-height:1.15;
  text-transform:uppercase;color:var(--navy);letter-spacing:.3px;
}
.v3-rule{width:26px;width:7.6cqi;height:2px;background:var(--gold);margin:7px 0 0;margin:2cqi 0 0}
.v3-statement .v3-rule{background:var(--navy)}
.v3-sub{font-size:9.5px;font-size:2.8cqi;margin:6px 0 0;margin-top:1.7cqi;line-height:1.4}
.v3-statement .v3-sub{color:rgba(31,44,72,.88)}

/* 三扇门 */
.v3-tile{overflow:hidden}
.v3-door h2{font-size:17px;font-size:5cqi;color:var(--court)}
.v3-door .v3-sub{color:var(--ash)}
.v3-bone{background:var(--cream)}

/* 门格 hover（参考 feature-section-with-hover-effects 的交互语言，纯 CSS 复刻：
   渐层浮现 + 标题右移 + 金线生长变深 + 箭头滑动，200ms） */
.v3-door::after,.v3-first::after{
  content:"";position:absolute;inset:0;pointer-events:none;
  background:linear-gradient(to top, rgba(179,146,79,.20), transparent 60%);
  opacity:0;transition:opacity .2s var(--ease-standard);
}
.v3-members::after{background:linear-gradient(to top, rgba(242,237,218,.16), transparent 60%)}
.v3-door:hover::after,.v3-first:hover::after{opacity:1}
.v3-door h2,.v3-first h2{transition:transform .2s var(--ease-standard)}
.v3-door:hover h2,.v3-first:hover h2{transform:translateX(4px)}
.v3-door .v3-rule,.v3-first .v3-rule{transition:width .2s var(--ease-standard),background-color .2s var(--ease-standard)}
.v3-door:hover .v3-rule,.v3-first:hover .v3-rule{width:12cqi;background:var(--gold-deep)}
.v3-door:hover .v3-door-arrow{transform:translateX(4px)}
.v3-first{transition:border-color .2s var(--ease-standard)}
.v3-first:hover{border-color:var(--gold)}
/* 文字与装饰保持在 hover 渐层之上 */
.v3-door h2,.v3-door .v3-sub,.v3-first h2,.v3-first .v3-sub,.v3-first .v3-rule,.v3-door .v3-rule{position:relative;z-index:1}
.v3-door-icon,.v3-door-arrow{z-index:1}
.v3-door-arrow{transition:transform .2s var(--ease-standard)}

/* 门格装饰（参考 host 附件：icon + 金线 + 箭头 + 背景纹理） */
.v3-door-icon{width:20px;height:20px;width:5.5cqi;height:5.5cqi;color:var(--gold-deep);margin-bottom:1.4cqi;position:relative}
.v3-door .v3-rule{margin-top:1.6cqi}
.v3-door-arrow{position:absolute;right:3cqi;bottom:2.6cqi;width:16px;height:16px;width:4.6cqi;height:4.6cqi;color:var(--gold-deep)}
.v3-door-motif{position:absolute;pointer-events:none}
.v3-motif-leaf{top:0;right:0;width:62%;height:62%;opacity:.12}
.v3-motif-ball{top:0;right:0;width:100%;height:100%;opacity:.28}
.v3-door h2,.v3-door .v3-sub{position:relative}
/* Members 格：真实合照底 + 墨绿 scrim 保文字（B 方案，host 2026-08-19 拍板） */
.v3-members{
  background:
    linear-gradient(180deg, rgba(10,31,21,.35), rgba(10,31,21,.62)),
    url("../../photos/tiles/p5.jpg") center/cover no-repeat,
    var(--gold);
}
.v3-members h2{color:var(--cream)}
.v3-members .v3-sub{color:rgba(242,237,218,.9)}
/* 卡片箭头统一（UI/UX 检查指出只有两扇门有箭头，host 2026-09-15 批）：
   Members 深底用奶油白，Net-Work 沿用金深 */
.v3-members .v3-door-arrow{color:var(--cream)}
.v3-first:hover .v3-door-arrow{transform:translateX(4px)}

/* The Net-Work 格（原第一次来？；host 2026-08-19 改） */
.v3-first{background:var(--cream);border:1px solid var(--hairline)}
/* 「第一次来？」提示 chip：这格连去 /events#first-time，光看「The Net-Work」
   猜不到；给新客一个看得懂的入口词（UI/UX 检查指出，host 2026-09-15 批） */
.v3-hint{
  position:relative;z-index:1;align-self:flex-start;
  font-size:9px;font-size:2.6cqi;letter-spacing:.5px;
  color:var(--court);border:1px solid var(--gold-deep);border-radius:var(--radius-full);
  padding:2px 8px;padding:.6cqi 2.3cqi;margin-bottom:4px;margin-bottom:1.2cqi;
}
.v3-first h2{
  font-size:15.5px;font-size:4.6cqi;font-weight:var(--weight-semibold);color:var(--court);
}
.v3-first .v3-rule{margin-top:1.6cqi}
.v3-first .v3-sub{color:var(--ash)}

/* ---- 双路 CTA（绿画布上） ---- */
.v3-cta{
  width:min(100% - 36px, 800px);
  margin-inline:auto;
  padding:6px 0 20px;
  display:flex;align-items:center;gap:var(--space-md);flex-wrap:wrap;
}
.v3-cta .v3-l1{font-size:13px;color:var(--cream);margin:0}
.v3-cta .v3-l2{font-size:13px;color:rgba(242,237,218,.8);margin:0}
.v3-cta .pill{
  background:var(--cream);color:var(--court-deep);
  min-height:auto;padding:9px 22px;font-size:13px;
}

/* ---- 手机重排（host 2026-09-15 批）----
   380 基准的 3×3 直接缩到手机，字随格子缩到 9–15px，主张变成「眯着眼读」。
   ≤719px（与 nav.css 同一断点）改两栏直排：先读主张，再给下一场入口，
   Members/About 两列，Net-Work 一条，照片沉底当相册。字级脱离 cqi 缩放。 */
@media (max-width:719px){
  .v3-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
  .v3-statement{order:1;grid-column:1/-1;aspect-ratio:auto;padding:24px 20px}
  .v3-door-events{order:2;grid-column:1/-1;aspect-ratio:auto;padding:20px 20px 30px}
  .v3-members{order:3}
  .v3-door-about{order:4;padding:14px}
  .v3-first{order:5;grid-column:1/-1;aspect-ratio:auto;padding:18px 20px 24px}
  .v3-p1{order:6}
  .v3-p2{order:7}
  .v3-p3{order:8}
  .v3-p4{order:9}

  /* 品牌主张 ≥16px（UI/UX 检查的底线），其余回到正常可读字级 */
  .v3-statement h1{font-size:22px}
  .v3-sub{font-size:14px;margin-top:8px}
  .v3-door h2,.v3-first h2{font-size:20px}
  .v3-rule{width:26px;margin-top:10px}
  .v3-door-icon{width:22px;height:22px;margin-bottom:8px}
  .v3-door-arrow{width:18px;height:18px;right:12px;bottom:12px}
  .v3-hint{font-size:11px;padding:3px 10px;margin-bottom:6px}
  .v3-tag{left:8px;bottom:6px;font-size:9px}
  .v3-ball{width:15px;height:15px}
}

/* ---- Footer 暗色适配；宽度对齐九宫格 ---- */
.home-v3 .site-footer{border-top:1px solid rgba(250,248,245,.25);margin-top:var(--space-section)}
.home-v3 .site-footer .container{max-width:800px;width:min(100% - 36px, 800px);padding-inline:0}
.home-v3 .footer-brand{color:var(--on-primary)}
.home-v3 .footer-tag,.home-v3 .footer-col .col-head,.home-v3 .fine-print{color:rgba(250,248,245,.65)}
.home-v3 .footer-col a{color:rgba(250,248,245,.8)}
.home-v3 .footer-col a:hover{color:var(--on-primary)}
.home-v3 .fine-print{border-top:1px solid rgba(250,248,245,.25)}

/* ---- 限时海报弹窗（首页）：手机优先，最宽 420px；过期由 app.js 依 data-until 移除 ---- */
.promo{border:0;padding:0;background:transparent;overflow:visible;max-width:min(88vw,420px);max-height:92vh}
.promo::backdrop{background:rgba(8,20,14,.74)}
.promo-link{position:relative;display:block;border-radius:14px;overflow:hidden;text-decoration:none;
  box-shadow:0 24px 60px rgba(0,0,0,.45)}
.promo-link img{display:block;width:100%;height:auto}
.promo-cta{display:block;background:var(--court-deep);color:var(--cream);
  font-size:14px;font-weight:var(--weight-semibold);text-align:center;padding:14px 12px;letter-spacing:.02em}
.promo-x{position:absolute;top:-16px;right:-8px;z-index:2;width:40px;height:40px;border-radius:50%;
  border:0;background:var(--cream);color:var(--court-deep);font-size:15px;line-height:40px;
  cursor:pointer;box-shadow:0 6px 18px rgba(0,0,0,.35)}
