/* download.css — 資料ダウンロード page (ja/download/) */
/* Download dialog (.dlm) and .dl-meta type = site.css */
/* ---------- kits — 2 packs (User Kit / Partner Kit) ---------- */
.kit{display:flex;flex-direction:column;overflow:hidden;border:1px solid var(--line);border-radius:var(--r-panel);background:var(--bg-card)}
/* fanned covers on a dark panel */
.kit__visual{position:relative;aspect-ratio:16 / 7;overflow:hidden;background:var(--dark)}
.kit__visual::before{content:"";position:absolute;inset:0;
  background:radial-gradient(circle at 50% 40%,rgba(99,102,241,.32),rgba(99,102,241,0) 62%),
    linear-gradient(#22224A 1px,transparent 1px) 0 0/32px 32px,linear-gradient(90deg,#22224A 1px,transparent 1px) 0 0/32px 32px;opacity:.9}
.kit__visual img{position:absolute;display:block;height:auto;border-radius:6px;box-shadow:0 14px 32px rgba(0,0,0,.45);outline:1px solid rgba(255,255,255,.1)}
.kit__visual--3 img{width:58%}
.kit__visual--3 img:nth-child(1){left:8%;top:22%}
.kit__visual--3 img:nth-child(2){left:21%;top:15%}
.kit__visual--3 img:nth-child(3){left:34%;top:8%}
.kit__visual--5 img{width:52%}
.kit__visual--5 img:nth-child(1){left:6%;top:28%}
.kit__visual--5 img:nth-child(2){left:15%;top:23%}
.kit__visual--5 img:nth-child(3){left:24%;top:18%}
.kit__visual--5 img:nth-child(4){left:33%;top:13%}
.kit__visual--5 img:nth-child(5){left:42%;top:8%}
.kit__body{display:flex;flex-direction:column;flex:1;padding:28px 36px 32px}
.kit h3{margin-top:12px;font-size:var(--h4);line-height:1.5;color:var(--ink)}
.kit__for{margin-top:8px;font-size:14px;font-weight:600;line-height:1.8;color:var(--accent-strong)}
.kit__desc{margin-top:12px}
.kit__docs{display:flex;flex-wrap:wrap;gap:8px;margin:18px 0 0;padding:0;list-style:none}
.kit__docs li{padding:6px 14px;border:1px solid var(--line);border-radius:var(--r-pill);background:var(--white);font-size:13px;font-weight:600;line-height:1.5;color:var(--ink)}
.kit__foot,.doc__foot{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:16px}
.kit__foot{margin-top:auto;padding-top:24px}
/* ---------- how it works (3 steps) ---------- */
.dl-flow{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px;margin:48px 0 0;padding:0;list-style:none}
.dl-flow li{padding:24px;border-radius:var(--r-card);background:var(--bg-tint)}
.dl-flow__k{display:block;font-family:var(--mono);font-size:12px;font-weight:700;letter-spacing:.18em;color:var(--accent)}
.dl-flow b{display:block;margin-top:8px}
.dl-flow p{margin-top:4px}
/* ---------- documents — compact rows (cover | title + one-line description | pages + button) ---------- */
.docs{display:grid;gap:12px}
.doc{display:grid;grid-template-columns:184px minmax(0,1fr);gap:28px;align-items:center;padding:16px 24px 16px 16px;
  border:1px solid var(--line);border-radius:var(--r-panel);background:var(--white);transition:box-shadow .2s}
.doc:hover{box-shadow:0 10px 26px rgba(16,16,36,.08)}
.doc__media img{display:block;width:100%;height:auto;border-radius:var(--r-sm);box-shadow:0 6px 16px rgba(16,16,36,.14)}
.doc__body{display:grid;grid-template-columns:minmax(0,1fr) auto;column-gap:32px;align-items:center}
.doc__body > :not(.doc__foot){grid-column:1}
.doc__tags{display:flex;flex-wrap:wrap;align-items:center;gap:12px}
.doc__tag{display:inline-flex;align-items:center;padding:4px 12px;border-radius:var(--r-pill);background:var(--accent-wash);
  font-size:12px;font-weight:600;line-height:1.6;color:var(--accent-strong)}
.doc__en{font-family:var(--mono);font-size:11px;font-weight:600;letter-spacing:.16em;text-transform:uppercase;color:var(--muted)}
.doc h3{margin-top:6px;font-size:17px;line-height:1.5;color:var(--ink)}
.doc__desc{margin-top:2px;font-size:13.5px;line-height:1.75;color:var(--body)}
.doc__foot{margin-top:24px;padding-top:20px;border-top:1px solid var(--line)}
.doc .doc__foot{grid-column:2;grid-row:1 / span 3;margin:0;padding:0;border:0;flex-direction:column;align-items:flex-end;gap:8px}
.doc .btn{height:42px;padding:0 20px;font-size:14px}
/* ---------- white papers — 6 compact cards in 2 rows (cover on top) ---------- */
.wps{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px}
.wp{display:flex;flex-direction:column;overflow:hidden;border:1px solid var(--line);border-radius:var(--r-panel);background:var(--white);transition:box-shadow .2s,transform .2s}
.wp:hover{box-shadow:0 12px 30px rgba(16,16,36,.10);transform:translateY(-2px)}
.wp__media{background:var(--dark)}
.wp__media img{display:block;width:100%;height:auto}
.wp__body{display:flex;flex-direction:column;flex:1;padding:18px 22px 20px}
.wp h3{margin-top:10px;font-size:16px;line-height:1.55;color:var(--ink)}
.wp__desc{margin:6px 0 16px;font-size:13px;line-height:1.75;color:var(--body)}
.wp .doc__foot{margin-top:auto;padding-top:14px;gap:12px}
.wp .btn{height:40px;padding:0 18px;font-size:14px}
/* ---------- responsive ---------- */
@media (max-width:1024px){
  .kits{grid-template-columns:1fr}
  .doc{grid-template-columns:150px minmax(0,1fr);gap:24px}
}
@media (max-width:860px){
  .wps{grid-template-columns:repeat(2,minmax(0,1fr))}
  .kit__body{padding:24px 24px 32px}
  .dl-flow{grid-template-columns:1fr}
  .doc{grid-template-columns:120px minmax(0,1fr);gap:16px;padding:14px 16px 16px 14px;align-items:start}
  .doc__body{grid-template-columns:minmax(0,1fr)}
  .doc .doc__foot{grid-column:1;grid-row:auto;flex-direction:row;align-items:center;justify-content:space-between;margin-top:12px}
}
@media (max-width:560px){
  .wps{grid-template-columns:1fr}
  .doc{grid-template-columns:96px minmax(0,1fr);gap:14px}
  .doc .doc__foot{flex-wrap:wrap;gap:8px 12px}
  .doc .btn{width:auto;height:38px;padding:0 14px;font-size:13px}
  .doc .dl-meta{white-space:nowrap}
}
