[ 質問者返信待ち ] コピーしたパターンを修正したい

お世話になっております、パターンライブラリのご利用ありがとうございます。

カスタムcssでは、カバーブロック自体が拡大され、影が薄くなる効果も消えてしまいました。

cssを拝見しました。

selector:hover　この書き方ですと、カバーブロック全体を対象としているので、カバーブロック自体が拡大します。
（この辺りは、ブラウザの検証ツールなどを使用してクラス名を確認して、背景画像の部分に対してcssを書くとうまくいくのではないかなと思います。）

パターンライブラリからコピーして使っていましたが、中央のテキストより上の範囲がリンクから外れる（ホバーして拡大はするがクリックできない）症状が出てしまいました。

おそらくですが、カバーブロックの中にグループブロックがあり、グループブロックの方にリンクを設置しているのではないかと思います。

VK パターンライブラリに、hover時に背景画像が拡大して背景画像が薄くなり影がつくような、ご希望に近いバナーを作成しました。
こちらからコピーして、微調整していただくと良いかもしれませんがいかがでしょうか。

求人バナー_カバーに全体リンク_hover時エフェクト

ご検討よろしくお願いいたします。

お世話になっております。

内容を確認しまして、元々の工務店で使用しているバナーですが、少し複雑な構成をしていましたので、新たにご要望に近いパターンをVK パターンライブラリに登録しました、
工務店で使用しているバナーはカバーブロックやボタンブロックを使用していますが、今回は背景画像を使用しないとのことでしたので、グリッドカラムカードブロックで実装してあります。

横並びバナー_グリッドカラムアイテムに全体リンク_hover時エフェクト

イメージと違う場合は以下で説明させていただきましたので、ご確認ください。

ーーー

今回工務店のパターンライブラリの、会社案内から役立ちブログまでの箇所を流用しておりますが、hover時に色が変わる効果はカスタムCSSに書かれていなかったと思うのですが、こちらはカスタムCSSを利用せず標準の機能で実装可能なのでしょうか？

こちらのパターンはカバーブロックのリンク機能を実装する前に作成したパターンになるため、「VK Block Patterns」プラグインを使用して、カバーブロックとボタンブロックで、ボタンブロックのリンクをカバー全体に広がるようなcssをプラグイン側で書いております。

hover時に色が薄くなる効果は、opacityで半透明にして実装しています。
::before要素で半透明の黒色を全体にいれており、hover時に透明になるようにしています。

selector .vk_button:not(.vkp_button-through-arrow)::before{/*背景スライドボタンは除外しないとおかしくなる*/
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  content: '';
  background: #000;
  opacity:0.4;
  transition: all 0.5s ease-out;
  z-index:-1;
}
selector .vk_button:hover::before {
  opacity: 0;
  transition: all 0.5s ease-out;
}

ご回答にあったカバーブロック内の構造ですが、カバーブロック直下にボタンブロックがあるだけで、特にグループブロックは使用しておりません。

画面キャプチャを確認しましたところ、カバーブロックの上に「グリッド」が入っておりますが、このグリッドは必要なのでしょうか。もしかすると、リンクの範囲がおかしくなる原因かもしれないと思いお聞きしました。

ご確認、よろしくお願い致します。