@import url('https://fonts.googleapis.com/css2?family=Dancing+Script:wght@700&display=swap');

/* ============================================
   サイトロゴ（先頭大文字 Nurse Free 表示）
   ============================================ */
@import url('https://fonts.googleapis.com/css2?family=Pacifico&display=swap');

.site-name-text,
.site-name-text * {
  font-family: 'Pacifico', cursive !important;
  ...
}

/* ============================================
   ヒーロー写真背景レイヤー（最終版 v7：SP調整ツール反映）
   2026-05-25
   - PC: 下部グラデーション、横棒削除、ピル不透明、左下注釈
   - SP: 山下さんが調整ツールで決めた値を反映
   ============================================ */
.nf-hero {
  position: relative !important;
  overflow: hidden !important;
}

/* 写真層 + 下部グラデーション */
.nf-hero::after {
  content: '' !important;
  position: absolute !important;
  top: 0 !important;
  left: 0 !important;
  right: 0 !important;
  bottom: 0 !important;
  width: 100% !important;
  height: 100% !important;
  background-image:
    linear-gradient(
      180deg,
      transparent 0%,
      transparent 35%,
      rgba(13, 70, 50, 0.5) 50%,
      rgba(13, 70, 50, 0.85) 70%,
      rgba(13, 70, 50, 0.95) 100%
    ),
    url('/wp-content/themes/cocoon-child-master/images/hero-pc.jpg') !important;
  background-size: 100% 100%, 100% auto !important;
  background-position: center top, center top !important;
  background-repeat: no-repeat, no-repeat !important;
  z-index: 5 !important;
  opacity: 1 !important;
  pointer-events: none !important;
  display: block !important;
}

.nf-hero__inner {
  position: relative !important;
  z-index: 10 !important;
  text-shadow: 0 2px 8px rgba(0,0,0,0.7), 0 4px 16px rgba(0,0,0,0.5) !important;
  padding-bottom: 36px !important;
}

.nf-hero__features {
  margin-bottom: 28px !important;
}

.nf-hero__eyebrow-line {
  display: none !important;
}

.nf-hero__features {
  background: rgba(13, 70, 50, 0.92) !important;
  border-color: rgba(255, 255, 255, 0.5) !important;
}

.nf-hero__inner::before {
  content: '※写真はイメージです。実際の車両とは異なる場合があります。';
  position: absolute;
  bottom: 6px;
  left: calc(50% - 50vw);
  width: 100vw;
  padding: 0 12px;
  text-align: left;
  font-size: 10px;
  color: rgba(255, 255, 255, 0.7);
  text-shadow: 0 1px 2px rgba(0,0,0,0.8);
  z-index: 11;
  pointer-events: none;
  letter-spacing: 0.02em;
  line-height: 1.4;
}

/* SP用（山下さんが調整ツールで決めた値） */
@media (max-width: 640px) {
  .nf-hero::after {
    background-image:
      linear-gradient(
        180deg,
        transparent 0%,
        transparent 50%,
        rgba(13, 70, 50, 0.4) 65%,
        rgba(13, 70, 50, 0.8) 80%,
        rgba(13, 70, 50, 0.95) 100%
      ),
      url('/wp-content/themes/cocoon-child-master/images/hero-sp.jpg') !important;
    background-size: 100% 100%, 100% auto !important;
    background-position: center top, center top !important;
  }

  /* 全体位置 */
  .nf-hero__inner {
    padding-top: 131px !important;
    padding-bottom: 60px !important;
  }

  /* 看護師の単発バイト・副業マッチング */
  .nf-hero__eyebrow {
    font-size: 12px !important;
    line-height: 2.05 !important;
    margin-bottom: 32px !important;
  }

  /* 見出し（看護士同乗案件専門 等） */
  .nf-hero__title {
    font-size: 24px !important;
    line-height: 1.4 !important;
    margin-bottom: 10px !important;
  }
  /* 各行（span）を独立した行として表示 */
  .nf-hero__title-line-1,
  .nf-hero__title-line-2,
  .nf-hero__title-line-3 {
    display: block !important;
  }

  /* あなたの専門性を、最前線へ。 */
  .nf-hero__lead {
    font-size: 15px !important;
    line-height: 1.35 !important;
    margin-top: 10px !important;
    margin-bottom: 10px !important;
  }

  /* スポット案件から…完全無料 */
  .nf-hero__sublead {
    font-size: 11px !important;
    line-height: 1.5 !important;
    margin-bottom: 12px !important;
    white-space: nowrap !important;
    letter-spacing: 0.02em !important;
  }

  /* ピルバー */
  .nf-hero__features {
    margin-bottom: 0 !important;
    position: relative !important;
  }

  /* 注釈をピルバー（直接マッチング）の下に配置 */
  .nf-hero__features::after {
    content: '※写真はイメージです。実際の車両とは異なる場合があります。';
    position: absolute !important;
    top: calc(100% + 10px) !important;
    left: 50% !important;
    transform: translateX(-50%) !important;
    white-space: nowrap !important;
    font-size: 9px !important;
    color: rgba(255, 255, 255, 0.8) !important;
    text-shadow: 0 1px 2px rgba(0, 0, 0, 0.7) !important;
    letter-spacing: 0.02em !important;
    pointer-events: none !important;
  }

  /* デフォルトの左下注釈はSPでは非表示 */
  .nf-hero__inner::before {
    display: none !important;
  }
}
