/* ============================================================
   トップ セクション05 — Neovisionの制作実績 (WORKS)
   Figma node 243:7973 / 1440px 基準・コンテンツ 1100px
   数値・色・タイポは Figma REST API の実測値
   ============================================================ */

.nv-works{
  --nv-grad:linear-gradient(90deg,#2A67D4,#4EB1EA);
  --nv-en:'Montserrat','Noto Sans JP',sans-serif;
  padding:88px 0 104px;
  background:var(--nv-base);
  overflow:hidden;
}

/* ---- 見出し ---- */
.nv-works-head{
  position:relative;
  text-align:center;
  margin-bottom:56px;
}
.nv-works-eyebrow{
  display:block;
  font-family:var(--nv-en);
  font-weight:600;
  font-style:italic;
  font-size:96px;
  line-height:1;
  letter-spacing:3.84px;
  color:var(--nv-white);
  user-select:none;
}
.nv-works-title{
  position:relative;
  margin:-58px 0 0;
  font-size:40px;
  font-weight:700;
  letter-spacing:1.6px;
  line-height:60px;
  color:var(--nv-text);
}
.nv-works-line{
  display:block;
  width:40px;height:5px;
  margin:16px auto 0;
  border-radius:5px;
  background:var(--nv-grad);
  position:relative;
}
/* 見出し「Neovisionの制作実績」下の装飾ドット (.nv-works-line::after) は削除 (2026-07-19 / CEO判断)。バーのみ残す。 */
.nv-works-deco{
  position:absolute;
  right:-46px;
  top:-46px;
  width:240px;
  height:240px;
}

/* ---- カードグリッド ---- */
.nv-works-grid{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:24px;
}
.nv-works-card{
  display:flex;
  flex-direction:column;
  background:var(--nv-white);
  border-radius:12px;
  overflow:hidden;
}
/* カード全体を実績詳細ページへのリンクに (レイアウトは card を引き継ぐ) */
.nv-works-card-link{
  display:flex;
  flex-direction:column;
  flex:1 1 auto;
  transition:transform .2s ease, box-shadow .2s ease;
}
.nv-works-card-link:hover{
  transform:translateY(-3px);
  box-shadow:0 12px 28px rgba(31,58,95,.12);
}
.nv-works-thumb{
  display:block;
  width:100%;
  aspect-ratio:35 / 16;
  object-fit:cover;
  background:#EBF6FF;
}
.nv-works-info{
  padding:16px 24px 26px;
}
.nv-works-tag{
  display:inline-block;
  padding:0 12px;
  border-radius:999px;
  background:var(--nv-main);
  font-size:14px;
  line-height:21px;
  font-weight:700;
  letter-spacing:0.56px;
  color:var(--nv-white);
}
.nv-works-name{
  margin:12px 0 0;
  font-size:18px;
  line-height:27px;
  font-weight:700;
  letter-spacing:0.72px;
  color:var(--nv-text);
}
.nv-works-meta{
  margin:24px 0 0;
  font-size:14px;
  line-height:21px;
  font-weight:700;
  letter-spacing:0.56px;
  color:#828282;
}

/* ---- もっと見る ---- */
.nv-works-more{
  margin-top:40px;
  text-align:center;
}
.nv-works-btn{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:14px;
  width:260px;
  height:64px;
  border:3px solid transparent;
  border-radius:999px;
  background:linear-gradient(var(--nv-white),var(--nv-white)) padding-box, var(--nv-grad) border-box;
  font-size:16px;
  font-weight:700;
  letter-spacing:0.64px;
  color:var(--nv-text);
  transition:box-shadow .2s ease,transform .2s ease;
}
.nv-works-btn-arrow{
  width:24px;height:24px;
  position:relative;
  flex:0 0 24px;
}
.nv-works-btn-arrow::before{
  content:"";
  position:absolute;left:2px;top:50%;
  width:18px;height:2px;
  background:var(--nv-text);
  transform:translateY(-50%);
}
.nv-works-btn-arrow::after{
  content:"";
  position:absolute;right:3px;top:50%;
  width:8px;height:8px;
  border-top:2px solid var(--nv-text);
  border-right:2px solid var(--nv-text);
  transform:translateY(-50%) rotate(45deg);
}
.nv-works-btn:hover{
  box-shadow:0 8px 20px rgba(42,103,212,.18);
  transform:translateY(-1px);
}

/* ============================================================
   レスポンシブ
   ============================================================ */
@media (max-width:1024px){
  .nv-works{padding:72px 0 88px;}
  .nv-works-grid{grid-template-columns:repeat(2,1fr);gap:20px;}
  .nv-works-eyebrow{font-size:72px;}
  .nv-works-title{margin-top:-46px;}
  /* 装飾イラストは中央寄せタイトルに接近して重なるため、1024px以下では非表示にする
     (デスクトップ >1024px ではタイトル右端から115px以上離れており衝突しない)。 */
  .nv-works-head .nv-works-deco{display:none;} /* base.css .nv-page img(0,1,1) に勝つため親付き(0,2,0) */
}

@media (max-width:767px){
  /* Figma SP 390px 基準 (実測 node 695:23985 / 350px コンテンツ幅) */
  .nv-works{padding:32px 0 40px;}

  /* 見出し (透かし WORKS + タイトル + アクセントライン) */
  .nv-works-head{margin-bottom:24px;}
  .nv-works-eyebrow{font-size:40px;line-height:60px;letter-spacing:1.6px;}
  .nv-works-title{font-size:24px;line-height:36px;letter-spacing:0.96px;margin-top:-28px;}
  .nv-works-line{width:24px;height:3px;margin:8px auto 0;border-radius:3px;}
  .nv-works-head .nv-works-deco{display:none;} /* base.css .nv-page img(0,1,1) に勝つため親付き(0,2,0) */

  /* カードグリッド: 1カラム縦積み / full-bleed (350px) */
  .nv-works-grid{grid-template-columns:1fr;gap:16px;}
  .nv-works-card{border-radius:8px;}
  .nv-works-info{padding:12px 16px 16px;}
  .nv-works-tag{font-size:12px;line-height:18px;letter-spacing:0.48px;}
  .nv-works-name{margin-top:8px;font-size:16px;line-height:24px;letter-spacing:0.64px;}
  .nv-works-meta{margin-top:8px;font-size:12px;line-height:18px;letter-spacing:0.48px;}

  /* もっと見る */
  .nv-works-more{margin-top:24px;}
  .nv-works-btn{width:260px;max-width:100%;height:56px;border-width:2px;font-size:15px;letter-spacing:0.6px;}
}