/* Precision pass over the shared dynamic case template. */
body #tpl-case.tpl-r2 { --r2-soft:#f5f6f7; --r2-line:#e5e7e9; --r2-max:1280px; }
body #tpl-case.tpl-r2 .tpl-hero { padding-top:clamp(70px,10vh,106px); padding-bottom:48px; }
body #tpl-case.tpl-r2 .tpl-h1 { font-size:clamp(38px,4.3vw,64px); font-weight:400; letter-spacing:-.02em; line-height:1.3; max-width:18em; }
body #tpl-case.tpl-r2 .tpl-h1.is-long { font-size:clamp(32px,3.5vw,50px); }
body #tpl-case.tpl-r2 .tpl-h1.is-xlong { font-size:clamp(28px,3vw,42px); }
body #tpl-case.tpl-r2 .tpl-hero .tpl-k { font-size:12px; font-weight:400; letter-spacing:.14em; margin-bottom:14px; opacity:.85; }
body #tpl-case.tpl-r2 .tpl-hero-foot { gap:26px; }
body #tpl-case.tpl-r2 .tpl-specs { grid-template-columns:repeat(2,minmax(0,1fr)); column-gap:56px; }
body #tpl-case.tpl-r2 .tpl-spec.is-name { display:none; }
body #tpl-case.tpl-r2 .tpl-spec + .tpl-spec:not(.is-name) { padding-inline:24px; }
body #tpl-case.tpl-r2 .tpl-spec dd { font-size:20px; font-weight:400; line-height:1.5; }
body #tpl-case.tpl-r2 .tpl-spec dt { font-size:11px; letter-spacing:.12em; opacity:.8; }
body #tpl-case.tpl-r2 .tpl-r2-btns { gap:12px; }
body #tpl-case.tpl-r2 .tpl-r2-btn { min-width:174px; min-height:46px; height:auto; padding:14px 26px; border:1px solid transparent; font-weight:400; letter-spacing:.03em; cursor:pointer; }
body #tpl-case.tpl-r2 .tpl-r2-btn.is-glass { border-color:rgba(255,255,255,.36); background:rgba(255,255,255,.09); }
body #tpl-case.tpl-r2 .tpl-about .tpl-lead { font-size:clamp(18px,1.45vw,22px); line-height:2; color:#494e55; }
body #tpl-case.tpl-r2 .tpl-tag { background:#fff; border:1px solid #e2e5e8; border-radius:5px; font-weight:400; }
body #tpl-case.tpl-r2 .tpl-rec .tpl-h2 { font-weight:400; letter-spacing:-.02em; }
body #tpl-case.tpl-r2 .tpl-card { background:#fff; border:1px solid #e5e7e9; box-shadow:0 4px 16px rgba(24,30,38,.035); border-radius:14px; height:100%; }
body #tpl-case.tpl-r2 .tpl-card .tpl-fig { border-radius:0; flex-shrink:0; }
body #tpl-case.tpl-r2 .tpl-card-b { padding:24px 24px 28px; gap:0; }
body #tpl-case.tpl-r2 .tpl-card-k { font-size:11px; letter-spacing:.08em; }
body #tpl-case.tpl-r2 .tpl-card-t { min-height:3em; font-size:21px; font-weight:400; line-height:1.5; }
body #tpl-case.tpl-r2 .tpl-card-d { margin-top:12px; }
body #tpl-case.tpl-r2 .tpl-card:hover { box-shadow:0 12px 32px rgba(24,30,38,.09); }
body #tpl-case.tpl-r2 .tpl-pn { margin-top:48px; border-top:1px solid #dddfe2; }
body #tpl-case.tpl-r2 .tpl-pn a,body #tpl-case.tpl-r2 .tpl-pn a+a { background:transparent; padding:28px 0; border-radius:0; }
body #tpl-case.tpl-r2 .tpl-pn a:hover { box-shadow:none; }
body #tpl-case.tpl-r2 .tpl-pn strong { font-weight:400; }
body #tpl-case.tpl-r2 .tpl-cta.tpl-cta-light .tpl-h2 { font-weight:400; letter-spacing:-.01em; line-height:1.6; }
body #tpl-case.tpl-r2 .tpl-cta.tpl-cta-light .tpl-btn { min-height:46px; height:auto; font-weight:400; }
body #tpl-case.tpl-r2 a:focus-visible,body #tpl-case.tpl-r2 button:focus-visible { outline:2px solid #929faa; outline-offset:5px; }
.detail-view { width:100vw; height:100dvh; max-width:none; max-height:none; margin:0; padding:0; border:0; background:#111315; color:#fff; overflow:hidden; }
.detail-view::backdrop { background:rgba(0,0,0,.9); }
.detail-view-bar { display:flex; align-items:center; justify-content:space-between; gap:24px; height:76px; padding:16px 32px; border-bottom:1px solid #2b2e31; }
.detail-view-title { font-size:14px; color:#d0d2d5; overflow:hidden; white-space:nowrap; text-overflow:ellipsis; margin:0; }
.detail-view-controls { display:flex; gap:10px; flex-shrink:0; }
.detail-view button { background:transparent; color:#fff; border:1px solid #4d5359; border-radius:4px; padding:10px 18px; min-height:44px; font:14px/1.5 "Microsoft YaHei",sans-serif; cursor:pointer; }
.detail-view button:hover { background:#30363c; }
.detail-view button:focus-visible { outline:2px solid #fff; outline-offset:3px; }
.detail-view-media { height:calc(100dvh - 76px); overflow:auto; overscroll-behavior:contain; }
.detail-view-media img { display:block; width:100%; height:100%; max-width:none; object-fit:contain; cursor:zoom-in; }
.detail-view.is-zoomed .detail-view-media img { width:200%; height:200%; cursor:zoom-out; }
html.detail-view-open { overflow:hidden; }
@media(prefers-reduced-motion:no-preference) {
  body #tpl-case.tpl-r2 .tpl-card { transition:box-shadow .3s ease,border-color .3s ease; }
  body #tpl-case.tpl-r2 .tpl-r2-btn,body #tpl-case.tpl-r2 .tpl-btn { transition:background-color .3s,transform .4s cubic-bezier(.22,1,.36,1),border-color .3s; }
  body #tpl-case.tpl-r2 .tpl-r2-btn:active,body #tpl-case.tpl-r2 .tpl-btn:active { transform:scale(.97); }
  body #tpl-case.tpl-r2 .tpl-card .tpl-fig img { transition:transform 1.1s cubic-bezier(.22,1,.36,1); }
  .detail-view[open] { animation:detail-view-in .3s ease; }
  @media(hover:hover) {
    body #tpl-case.tpl-r2 .tpl-r2-btn:hover,body #tpl-case.tpl-r2 .tpl-btn:hover { transform:translateY(-2px); }
    body #tpl-case.tpl-r2 .tpl-card:hover .tpl-fig img { transform:scale(1.035); }
  }
}
@keyframes detail-view-in { from { opacity:0; } to { opacity:1; } }
@media(max-width:700px) {
  body #tpl-case.tpl-r2 .tpl-card-b { padding:20px 20px 24px; }
  body #tpl-case.tpl-r2 .tpl-card-t { min-height:0; font-size:20px; }
  body #tpl-case.tpl-r2 .tpl-hero { min-height:620px; padding-top:64px; padding-bottom:28px; }
  body #tpl-case.tpl-r2 .tpl-hero-in,body #tpl-case.tpl-r2 .tpl-hero-foot { padding-inline:24px; }
  body #tpl-case.tpl-r2 .tpl-h1 { font-size:34px; }
  body #tpl-case.tpl-r2 .tpl-h1.is-long { font-size:28px; }
  body #tpl-case.tpl-r2 .tpl-h1.is-xlong { font-size:25px; }
  body #tpl-case.tpl-r2 .tpl-specs { column-gap:16px; }
  body #tpl-case.tpl-r2 .tpl-spec + .tpl-spec:not(.is-name) { padding-inline:0; }
  body #tpl-case.tpl-r2 .tpl-spec dd { font-size:16px; }
  body #tpl-case.tpl-r2 .tpl-r2-btns { display:grid; grid-template-columns:1fr 1fr; width:100%; }
  body #tpl-case.tpl-r2 .tpl-r2-btn { min-width:0; padding:12px; font-size:13px; }
  body #tpl-case.tpl-r2 .tpl-view-open { grid-column:1/-1; min-height:40px; }
  .detail-view-bar { height:72px; padding:12px 16px; gap:12px; }
  .detail-view-title { font-size:12px; }
  .detail-view button { padding:8px 12px; font-size:12px; }
  .detail-view-media { height:calc(100dvh - 72px); }
}
