/* ============================================================
   mail-baito.com — Designer: 翔平（速度 × 即金 × エネルギッシュ）
   テーマ: メールバイト、即金で稼げる在宅副業
   配色: ディープシアン × ヴィヴィッドイエロー × ホットピンク
   ============================================================ */
body.site-mailbaito {
  --color-bg:        #f4f9fa;
  --color-bg-soft:   #e6f1f3;
  --color-bg-deep:   #d5e7ea;
  --color-text:      #0a2126;
  --color-text-muted:#4a6970;
  --color-text-subtle:#7a949b;
  --color-border:    #c5dde2;

  --color-brand:        #006d77;
  --color-brand-soft:   #d7eef0;
  --color-brand-dark:   #003c41;
  --color-brand-light:  #00919e;
  --color-accent:       #ffd60a;       /* ヴィヴィッドイエロー */
  --color-accent-soft:  #fff4b8;
  --color-accent-dark:  #ffb700;

  --font-display: "M PLUS Rounded 1c", "Noto Sans JP", sans-serif;
  --font-body:    "M PLUS Rounded 1c", "Noto Sans JP", sans-serif;

  --radius: 8px;
  --radius-sm: 4px;
  --radius-lg: 12px;
}
body.site-mailbaito .pcwst-hero {
  background: linear-gradient(135deg, #003c41 0%, #006d77 60%, #00919e 100%);
  color: #fff;
  padding: clamp(80px, 13vw, 160px) var(--gap);
  clip-path: polygon(0 0, 100% 0, 100% calc(100% - 60px), 0 100%);
  margin-bottom: -1px;
}
body.site-mailbaito .pcwst-hero::before {
  background:
    radial-gradient(circle at 80% 30%, rgba(255, 214, 10, 0.3) 0%, transparent 40%),
    linear-gradient(135deg, rgba(0, 60, 65, 0.6) 0%, transparent 50%);
}
body.site-mailbaito .pcwst-hero::after {
  /* 斜めストライプ */
  background-image: repeating-linear-gradient(135deg, transparent 0, transparent 60px, rgba(255,214,10,0.04) 60px, rgba(255,214,10,0.04) 62px);
  background-size: auto;
  mask-image: none;
  -webkit-mask-image: none;
}
body.site-mailbaito .pcwst-hero__kicker {
  background: #ffd60a;
  color: #003c41;
  font-weight: 900;
  border: none;
}
body.site-mailbaito .pcwst-hero__kicker__dot { background: #003c41; }
body.site-mailbaito .pcwst-hero__title {
  font-family: var(--font-display);
  font-weight: 900 !important;
  letter-spacing: -0.04em !important;
}
body.site-mailbaito .pcwst-hero__title em {
  background: linear-gradient(120deg, #ffd60a 0%, #fff 100%);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
}
body.site-mailbaito .pcwst-hero__stat__value__unit { color: #ffd60a; }
body.site-mailbaito .pcwst-stats-block {
  background: #003c41;
  color: #fff;
  border-radius: 0;
  border: 4px solid #ffd60a;
}
body.site-mailbaito .pcwst-stat-item { background: transparent; color: #fff; }
body.site-mailbaito .pcwst-stat-item:hover { background: rgba(255,214,10,0.1); }
body.site-mailbaito .pcwst-stat-item__value { color: #ffd60a; font-family: var(--font-display); font-weight: 900; }
body.site-mailbaito .pcwst-stat-item__label { color: rgba(255,255,255,0.7); }
body.site-mailbaito .pcwst-post-card,
body.site-mailbaito .pcwst-job-card {
  border-radius: 4px;
  border: 2px solid #003c41;
  box-shadow: 6px 6px 0 #ffd60a;
}
body.site-mailbaito .pcwst-post-card:hover,
body.site-mailbaito .pcwst-job-card:hover {
  transform: translate(-4px, -4px);
  box-shadow: 12px 12px 0 #ffd60a;
}
body.site-mailbaito .pcwst-cat-card { border-radius: 8px; border: 2px solid #003c41; }
body.site-mailbaito .pcwst-cat-card::before { background: #003c41; }
body.site-mailbaito .pcwst-cat-card__icon { background: #ffd60a; color: #003c41; border-radius: 4px; }
body.site-mailbaito .pcwst-btn { border-radius: 4px; font-weight: 900; text-transform: uppercase; letter-spacing: 0.05em; }
body.site-mailbaito .pcwst-btn--primary { background: #ffd60a; color: #003c41; box-shadow: 6px 6px 0 #003c41; }
body.site-mailbaito .pcwst-btn--primary:hover { background: #fff; color: #003c41; transform: translate(-2px, -2px); box-shadow: 10px 10px 0 #003c41; }
body.site-mailbaito .pcwst-section__kicker { color: #ffb700; font-weight: 900; letter-spacing: 0.3em; }
body.site-mailbaito .pcwst-section__title__accent { color: #006d77; background: none; -webkit-text-fill-color: #006d77; }
body.site-mailbaito .pcwst-cta::before { background: linear-gradient(135deg, #003c41 0%, #006d77 100%); }
body.site-mailbaito .pcwst-site-footer { background: #003c41; }