/* Disabled custom cursor */
.cursor { display: none !important; }
body, a, button { cursor: auto !important; }
a, button, [data-hover], .btn, [role="button"] { cursor: pointer !important; }


    .res-hero { padding: 9rem 2.5rem 4rem; max-width: var(--container); margin: 0 auto; position: relative; z-index: 1; }
    .res-hero__pill { display: inline-flex; align-items: center; gap: 0.5rem; padding: 0.5rem 1rem; background: rgba(9,111,200,.08); border-radius: var(--radius-pill); font-family: var(--f-en); font-size: 0.6875rem; font-weight: 700; letter-spacing: 0.24em; color: var(--c-brand); text-transform: uppercase; margin-bottom: 2rem; opacity: 0; animation: fadeIn 1s var(--ease-out) .2s forwards; }
    .res-hero__pill::before { content: ''; width: 0.5rem; height: 0.5rem; background: var(--c-brand); border-radius: 50%; box-shadow: 0 0 8px rgba(9,111,200,.6); animation: dotPulse 2s var(--ease-soft) infinite; }
    @keyframes fadeIn { to { opacity: 1; } }
    .res-hero__title { font-family: var(--f-ja-bold); font-weight: 900; font-size: clamp(2rem, 5vw, 4rem); line-height: 1.4; letter-spacing: 0.04em; color: var(--c-text); margin-bottom: 1rem; }
    .res-hero__en { font-family: var(--f-en); font-weight: 700; font-style: italic; font-size: clamp(1.5rem, 4vw, 3rem); line-height: 1; letter-spacing: -0.04em; color: var(--c-text-mute); margin-top: 0.5rem; }
    .res-hero__lead { font-family: var(--f-ja-bold); font-weight: 700; font-size: clamp(1rem, 1.3vw, 1.1875rem); line-height: 1.9; letter-spacing: 0.08em; color: var(--c-text); max-width: 36em; margin-top: 2rem; }

    /* Category filter */
    .res-filter { max-width: var(--container); margin: 0 auto; padding: 0 2.5rem; position: relative; z-index: 1; }
    .res-filter__inner { display: flex; flex-wrap: wrap; gap: 0.625rem; align-items: center; padding: 1.5rem 0; border-top: 1px solid var(--c-line); border-bottom: 1px solid var(--c-line); }
    .res-filter__label { font-family: var(--f-en); font-size: 0.6875rem; font-weight: 700; letter-spacing: 0.32em; color: var(--c-text-mute); text-transform: uppercase; margin-right: 1.5rem; }
    .res-filter__btn { padding: 0.625rem 1.125rem; background: transparent; border: 1px solid var(--c-line); border-radius: var(--radius-pill); font-family: var(--f-ja-bold); font-size: 0.8125rem; font-weight: 700; letter-spacing: 0.08em; color: var(--c-text-sub); cursor: auto; transition: background-color .3s, color .3s, border-color .3s; }
    .res-filter__btn:hover { border-color: var(--c-text); color: var(--c-text); }
    .res-filter__btn.is-active { background: var(--c-text); color: var(--c-bg); border-color: var(--c-text); }

    /* Resources grid */
    .res-list { padding: 4rem 2.5rem 6rem; max-width: var(--container); margin: 0 auto; position: relative; z-index: 1; }
    .res-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 1.5rem; }
    .res-card { background: var(--c-surface); border-radius: var(--radius-lg); overflow: hidden; box-shadow: var(--shadow-rest); transition: transform .5s var(--ease-out), box-shadow .5s var(--ease-out); cursor: auto; display: flex; flex-direction: column; }
    .res-card.is-hidden { display: none; }
    .res-card:hover { transform: translateY(-6px); box-shadow: var(--shadow-hover); }
    .res-card__thumb { aspect-ratio: 16/10; position: relative; overflow: hidden; background: linear-gradient(135deg, var(--c-brand-deep), var(--c-brand)); }
    .res-card__thumb--orange { background: linear-gradient(135deg, #BE4F2A, var(--c-accent)); }
    .res-card__thumb--dark { background: linear-gradient(135deg, #0F1A33, var(--c-brand)); }
    .res-card__thumb--coral { background: linear-gradient(135deg, var(--c-accent), var(--c-brand-2)); }
    .res-card__thumb--brand2 { background: linear-gradient(135deg, var(--c-brand), var(--c-brand-2)); }
    .res-card__thumb-pattern { position: absolute; inset: 0; background-image: radial-gradient(circle at 20% 30%, rgba(255,255,255,.18), transparent 50%), radial-gradient(circle at 80% 70%, rgba(255,255,255,.12), transparent 60%); }
    .res-card__thumb-icon { position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); width: 4rem; height: 4rem; color: rgba(255,255,255,.85); }
    .res-card__badge { position: absolute; top: 1rem; left: 1rem; padding: 0.375rem 0.875rem; background: rgba(255,255,255,.95); border-radius: 999px; font-family: var(--f-en); font-size: 0.625rem; font-weight: 700; letter-spacing: 0.16em; color: var(--c-text); text-transform: uppercase; z-index: 1; }
    .res-card__pages { position: absolute; top: 1rem; right: 1rem; padding: 0.375rem 0.875rem; background: rgba(0,0,0,.4); border: 1px solid rgba(255,255,255,.3); border-radius: 999px; font-family: var(--f-en); font-size: 0.625rem; font-weight: 700; letter-spacing: 0.16em; color: #fff; text-transform: uppercase; z-index: 1; backdrop-filter: blur(8px); }
    .res-card__body { padding: 1.75rem 1.75rem 2rem; display: flex; flex-direction: column; flex: 1; }
    .res-card__title { font-family: var(--f-ja-bold); font-weight: 900; font-size: 1.0625rem; line-height: 1.65; letter-spacing: 0.06em; color: var(--c-text); margin-bottom: 1rem; }
    .res-card__lead { font-family: var(--f-ja); font-weight: 500; font-size: 0.8125rem; line-height: 1.9; letter-spacing: 0.06em; color: var(--c-text-sub); margin-bottom: 1.5rem; flex: 1; }
    .res-card__cta { display: flex; align-items: center; justify-content: center; gap: 0.75rem; padding: 0.875rem 1.25rem; background: var(--c-text); color: var(--c-bg); font-family: var(--f-ja-bold); font-size: 0.8125rem; font-weight: 700; letter-spacing: 0.12em; border-radius: var(--radius-pill); transition: background-color .25s, transform .25s; text-align: center; width: 100%; }
    .res-card:hover .res-card__cta { background: var(--c-brand); transform: translateY(-2px); }
    .res-card__cta::after { content: '↓'; font-family: var(--f-en); font-weight: 400; transition: transform .35s var(--ease-spring); }
    .res-card:hover .res-card__cta::after { transform: translateY(3px); }

    /* ===== フィーチャー枠 (板垣承認 2026-06-05): メイン資料を最上部の大カードに格上げ ===== */
    .res-featured { max-width: var(--container); margin: 0 auto; padding: 2.5rem 2.5rem 0; position: relative; z-index: 1; }
    .res-featured__card { display: grid; grid-template-columns: minmax(0,.92fr) 1.08fr; background: var(--c-surface); border-radius: var(--radius-xl); overflow: hidden; box-shadow: 0 1px 2px rgba(10,15,30,.04), 0 18px 44px rgba(10,15,30,.10), 0 40px 80px -20px rgba(9,111,200,.20); border: 1.5px solid rgba(9,111,200,.18); transition: transform .5s var(--ease-out); }
    .res-featured__card:hover { transform: translateY(-4px); }
    .res-featured__thumb { position: relative; min-height: 360px; overflow: hidden; background: linear-gradient(135deg, #0F1A33, var(--c-brand)); }
    .res-featured__thumb-pattern { position: absolute; inset: 0; background-image: radial-gradient(circle at 22% 28%, rgba(255,255,255,.18), transparent 50%), radial-gradient(circle at 80% 72%, rgba(255,255,255,.12), transparent 60%); }
    .res-featured__thumb-icon { position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); width: 5.5rem; height: 5.5rem; color: rgba(255,255,255,.9); }
    .res-featured__badge { position: absolute; top: 1.5rem; left: 1.5rem; padding: 0.5rem 1.1rem; background: rgba(255,255,255,.95); border-radius: 999px; font-family: var(--f-en); font-size: 0.6875rem; font-weight: 700; letter-spacing: 0.16em; color: var(--c-text); text-transform: uppercase; z-index: 1; }
    .res-featured__pages { position: absolute; top: 1.5rem; right: 1.5rem; padding: 0.5rem 1.1rem; background: rgba(0,0,0,.4); border: 1px solid rgba(255,255,255,.3); border-radius: 999px; font-family: var(--f-en); font-size: 0.6875rem; font-weight: 700; letter-spacing: 0.16em; color: #fff; text-transform: uppercase; z-index: 1; backdrop-filter: blur(8px); }
    .res-featured__body { padding: 3.5rem; display: flex; flex-direction: column; justify-content: center; align-items: center; text-align: center; }
    .res-featured__label { display: inline-flex; align-items: center; gap: 0.5rem; padding: 0.5rem 1.15rem; background: rgba(255,118,105,.12); border-radius: var(--radius-pill); font-family: var(--f-en); font-size: 0.6875rem; font-weight: 800; letter-spacing: 0.2em; text-transform: uppercase; color: var(--c-accent); margin-bottom: 1.5rem; }
    .res-featured__label::before { content: '★'; font-size: 0.75rem; line-height: 1; }
    .res-featured__title { font-family: var(--f-ja-bold); font-weight: 900; font-size: clamp(1.55rem,2.4vw,2.05rem); line-height: 1.45; letter-spacing: 0.02em; color: var(--c-text); margin: 0 auto 1.25rem; max-width: 16em; text-wrap: balance; }
    .res-featured__lead { font-family: var(--f-ja); font-weight: 500; font-size: 0.95rem; line-height: 2; letter-spacing: 0.06em; color: var(--c-text-sub); margin: 0 auto 2.5rem; max-width: 32em; }
    .res-featured__cta { display: inline-flex; align-items: center; justify-content: center; gap: 0.75rem; align-self: center; min-width: 18rem; padding: 1.2rem 3rem; background: linear-gradient(135deg, var(--c-brand), var(--c-brand-deep)); color: #fff; font-family: var(--f-ja-bold); font-size: 0.9375rem; font-weight: 700; letter-spacing: 0.12em; border-radius: var(--radius-pill); box-shadow: 0 12px 28px -8px rgba(9,111,200,.45); transition: transform .25s, box-shadow .25s; }
    .res-featured__card:hover .res-featured__cta { transform: translateY(-2px); }
    .res-featured__cta::after { content: '↓'; font-family: var(--f-en); font-weight: 400; }
    .res-list__heading { display: flex; align-items: baseline; gap: 1rem; margin-bottom: 2rem; }
    .res-list__heading-en { font-family: var(--f-en); font-weight: 700; font-size: 0.6875rem; letter-spacing: 0.28em; color: var(--c-text-mute); text-transform: uppercase; }
    .res-list__heading-ja { font-family: var(--f-ja-bold); font-weight: 900; font-size: 1.05rem; letter-spacing: 0.06em; color: var(--c-text); }

    /* CTA */
    .res-cta { padding: 4rem 2.5rem 10rem; max-width: var(--container); margin: 0 auto; }
    .res-cta__inner { padding: 6rem 4rem; background: linear-gradient(135deg, #0A0F1C 0%, #0F1A33 50%, #1F2D55 100%); border-radius: var(--radius-xl); text-align: center; color: #fff; position: relative; overflow: hidden; box-shadow: 0 30px 60px -20px rgba(9,111,200,.20); }
    .res-cta__inner::before { content: ''; position: absolute; top: 20%; left: 50%; transform: translateX(-50%); width: 70%; height: 60%; background: radial-gradient(circle, rgba(118,183,237,.40), transparent 60%); filter: blur(60px); animation: ctaGlow 8s var(--ease-soft) infinite; pointer-events: none; }
    @keyframes ctaGlow { 0%,100% { opacity: 0.6; transform: translateX(-50%) scale(1); } 50% { opacity: 1; transform: translateX(-50%) scale(1.1); } }
    .res-cta__inner > * { position: relative; z-index: 1; }
    .res-cta__label { font-family: var(--f-en); font-size: 0.6875rem; font-weight: 700; letter-spacing: 0.32em; color: rgba(255,255,255,.7); text-transform: uppercase; margin-bottom: 2rem; display: inline-flex; align-items: center; gap: 0.875rem; }
    .res-cta__label::before, .res-cta__label::after { content: ''; display: block; width: 2rem; height: 1px; background: rgba(255,255,255,.4); }
    .res-cta__title { font-family: var(--f-ja-bold); font-weight: 900; font-size: clamp(1.75rem, 3.5vw, 2.5rem); line-height: 1.5; letter-spacing: 0.04em; color: #fff; margin-bottom: 1.5rem; }
    .res-cta__title em { font-style: normal; color: var(--c-brand-2); }
    .res-cta__sub { font-family: var(--f-ja-bold); font-weight: 700; font-size: 0.9375rem; line-height: 2.1; letter-spacing: 0.08em; color: rgba(255,255,255,.85); max-width: 32em; margin: 0 auto 3rem; }
    .res-cta__actions { display: inline-flex; gap: 1rem; flex-wrap: wrap; justify-content: center; }
    .res-cta .btn { display: inline-flex; align-items: center; gap: 0.75rem; padding: 1rem 1.625rem; font-family: var(--f-ja-bold); font-size: 0.8125rem; font-weight: 700; letter-spacing: 0.12em; border-radius: var(--radius-pill); position: relative; overflow: hidden; transition: transform .35s var(--ease-spring); cursor: auto; }
    .res-cta .btn--primary { background: #fff; color: var(--c-text); }
    .res-cta .btn--primary::after { content: '→'; transition: transform .4s var(--ease-spring); }
    .res-cta .btn--primary:hover { transform: translateY(-3px); }
    .res-cta .btn--primary:hover::after { transform: translateX(5px); }
    .res-cta .btn--secondary { background: rgba(255,255,255,.08); color: #fff; border: 1.5px solid rgba(255,255,255,.4); backdrop-filter: blur(8px); }
    .res-cta .btn--secondary:hover { background: #fff; color: var(--c-text); border-color: #fff; transform: translateY(-3px); }

    @media (max-width: 1024px) {
      .res-hero, .res-filter, .res-list, .res-cta, .res-featured { padding-left: 1.5rem; padding-right: 1.5rem; }
      .res-grid { grid-template-columns: repeat(2, 1fr); }
      .res-featured__card { grid-template-columns: 1fr; }
      .res-featured__thumb { min-height: 240px; }
      .res-featured__body { padding: 2.75rem 2rem; }
    }
    @media (max-width: 768px) {
      .res-grid { grid-template-columns: 1fr; }
      .res-cta__inner { padding: 4rem 1.5rem; }
    }

    /* プラグイン (aibuilderz-form-extender) のJS描画を抑制し、テーマ管理の単一grid に統一
       プラグイン側 `body.page-id-18 .res-grid {display:none !important}` (specificity 0,0,2,1) に確実勝つよう、
       .res-grid を2重クラス指定して specificity を 0,0,3,1 に上げる */
    body.page-id-18 .res-grid.res-grid { display: grid !important; }
    body.page-id-18 .res-featured.res-featured { display: block !important; }
    body.page-id-18 .aie-resource-sections { display: none !important; }
  

/* ============================================================
   FIX A: featured カード スマホ横オーバーフロー (title/lead/cta)
   原因: align-items:center の flex 子が内容幅にシュリンク、
   かつ max-width(16em/32em) と cta min-width(18rem) が
   スマホ幅を超え、折り返さず1行ではみ出す。
   対策: 子要素を width:100% で本文幅に固定し折り返させる。
   ============================================================ */
@media (max-width: 1024px) {
  .res-featured__title { width: 100%; max-width: 100%; }
  .res-featured__lead  { width: 100%; max-width: 100%; }
  .res-featured__cta   { min-width: 0; width: 100%; max-width: 28rem; }
}
@media (max-width: 768px) {
  .res-featured__body  { padding: 2.5rem 1.5rem 2.75rem; }
  .res-featured__title {
    font-size: clamp(1.4rem, 6vw, 1.85rem);
    line-height: 1.55;
    letter-spacing: 0.01em;
    white-space: normal;
    word-break: keep-all;   /* スペースのみ折り返し点 → AIBUILDERZ / サービス概要資料 の2行に */
    overflow-wrap: anywhere; /* 長いCJK連続が幅を超える場合の保険 */
  }
  .res-featured__lead  { font-size: 0.9rem; line-height: 1.95; }
  .res-featured__cta   { padding: 1.05rem 1.5rem; font-size: 0.9rem; }
}

/* ============================================================
   FIX B: 資料DL誘導 — リッチ/キラキラ アニメーション (2026-06-05)
   ボタンにシャイン(光沢スイープ)+グロー、サムネに微動。
   ブランド(洗練)を崩さない控えめな常時モーション。
   ============================================================ */
@keyframes resShine {
  0%   { transform: translateX(-160%) skewX(-20deg); opacity: 0; }
  8%   { opacity: 1; }
  46%  { opacity: 1; }
  60%  { transform: translateX(280%) skewX(-20deg); opacity: 0; }
  100% { transform: translateX(280%) skewX(-20deg); opacity: 0; }
}
@keyframes resGlow {
  0%, 100% { box-shadow: 0 12px 28px -8px rgba(9,111,200,.45), 0 0 0 0 rgba(118,183,237,0); }
  50%      { box-shadow: 0 16px 34px -8px rgba(9,111,200,.60), 0 0 26px 3px rgba(118,183,237,.45); }
}
@keyframes resBob {
  0%, 100% { transform: translateY(0); }
  50%      { transform: translateY(3px); }
}
@keyframes resPatDrift {
  0%, 100% { transform: translate(0, 0) scale(1); }
  50%      { transform: translate(2%, -2%) scale(1.06); }
}
@keyframes resIconFloat {
  0%, 100% { transform: translate(-50%, -50%); }
  50%      { transform: translate(-50%, calc(-50% + 4px)); }
}

/* B-1. Featured 主資料DLボタン (最重要・常時シャイン+グロー) */
.res-featured__cta {
  position: relative;
  overflow: hidden;
  isolation: isolate;
  animation: resGlow 3s var(--ease-soft) infinite;
}
.res-featured__cta::before {
  content: '';
  position: absolute;
  top: 0; bottom: 0; left: 0;
  width: 40%;
  background: linear-gradient(105deg, transparent 0%, rgba(255,255,255,.65) 50%, transparent 100%);
  transform: translateX(-160%) skewX(-20deg);
  animation: resShine 3.6s var(--ease-soft) infinite;
  pointer-events: none;
  z-index: 3;
}
.res-featured__cta::after {
  position: relative;
  z-index: 2;
  animation: resBob 2.4s var(--ease-soft) infinite;
}

/* B-2. Featured サムネ: 模様ドリフト + アイコン浮遊 */
.res-featured__thumb-pattern { animation: resPatDrift 12s var(--ease-soft) infinite; }
.res-featured__thumb-icon    { animation: resIconFloat 4s var(--ease-soft) infinite; }

/* B-3. グリッド資料カードのDLボタン (控えめ・スタッガー) */
.res-card__cta {
  position: relative;
  overflow: hidden;
  isolation: isolate;
}
.res-card__cta::before {
  content: '';
  position: absolute;
  top: 0; bottom: 0; left: 0;
  width: 38%;
  background: linear-gradient(105deg, transparent 0%, rgba(255,255,255,.5) 50%, transparent 100%);
  transform: translateX(-160%) skewX(-20deg);
  animation: resShine 4.8s var(--ease-soft) infinite;
  pointer-events: none;
  z-index: 3;
}
.res-grid .res-card:nth-child(3n+2) .res-card__cta::before { animation-delay: 1.5s; }
.res-grid .res-card:nth-child(3n+3) .res-card__cta::before { animation-delay: 2.9s; }

/* B-4. 下部CTA「無料相談」ボタンにも淡いシャイン */
.res-cta .btn--primary {
  position: relative;
  overflow: hidden;
  isolation: isolate;
}
.res-cta .btn--primary::before {
  content: '';
  position: absolute;
  top: 0; bottom: 0; left: 0;
  width: 42%;
  background: linear-gradient(105deg, transparent 0%, rgba(9,111,200,.16) 50%, transparent 100%);
  transform: translateX(-160%) skewX(-20deg);
  animation: resShine 5.2s var(--ease-soft) infinite;
  pointer-events: none;
  z-index: 1;
}

/* アクセシビリティ: モーション低減設定では常時アニメを停止 */
@media (prefers-reduced-motion: reduce) {
  .res-featured__cta,
  .res-featured__cta::before,
  .res-featured__cta::after,
  .res-featured__thumb-pattern,
  .res-featured__thumb-icon,
  .res-card__cta::before,
  .res-cta .btn--primary::before { animation: none !important; }
}