/* =========================================================
   カテゴリーごとの配色・操作時の色
========================================================= */

/* =========================================================
   START FROM 39 — CATEGORY PALETTE COLLECTION
   Version: 1.17.83 Final

   Base: Web Production coral × sand editorial system
   Layout remains unified; only controlled accents change.
========================================================= */

/* =========================================================
   00. SHARED EDITORIAL FINISH
========================================================= */

:where(
  .sf-life-hub,
  .sf-money-hub,
  .sf-work-hub,
  .sf-category-hub,
  .sf-company
) {
  --palette-paper: #fbf8f1;
  --palette-card: #fffdf8;
  --palette-ink: #26302d;
}

:where(
  .sf-life-path-card,
  .sf-money-path-card,
  .sf-work-path-card,
  .sf-life-feature-card,
  .sf-money-feature-card,
  .sf-work-feature-card,
  .sf-life-article-card,
  .sf-money-article-card,
  .sf-work-article-card,
  .sf-category-hub__topic-card,
  .sf-category-hub .sf-card
) {
  border-width: 1px !important;
  box-shadow: 0 12px 30px rgba(42, 37, 33, 0.055) !important;

  transition: transform 0.28s ease,
    box-shadow 0.28s ease,
    border-color 0.28s ease;
}

:where(
  .sf-life-path-card,
  .sf-money-path-card,
  .sf-work-path-card,
  .sf-life-feature-card,
  .sf-money-feature-card,
  .sf-work-feature-card,
  .sf-life-article-card,
  .sf-money-article-card,
  .sf-work-article-card,
  .sf-category-hub__topic-card,
  .sf-category-hub .sf-card
):focus-within {
  outline: 2px solid #bd9b62;
  outline-offset: 3px;
}

/* =========================================================
   01. 人生再設計 — BURGUNDY × IVORY
========================================================= */

.sf-life-hub {
  --life-sage: #6b203b;
  --life-sage-mid: #81304d;
  --life-sage-light: #a76079;
  --life-green: #762743;
  --life-green-dark: #59162f;
  --life-green-deep: #451024;
  --life-gold: #bd9b62;
  --life-gold-light: #ead8b9;
  --life-ivory: #f3eadc;
  --life-ivory-light: #fbf8f1;
  --category-warm: #7a2946;
  --category-warm-soft: #f2e0e5;

  background: #fbf8f1;
}

.sf-life-hero {
  background: linear-gradient(
    125deg,
    #471126 0%,
    #681b38 54%,
    #8b3e59 100%
  ) !important;
}

.sf-life-hero h1 {
  color: #fffaf3 !important;
}

.sf-life-hero-lead {
  color: rgba(255, 250, 243, 0.86) !important;
}

.sf-life-section-title,
.sf-life-category-head h2 {
  color: #59162f !important;
}

.sf-life-path-card:nth-child(even),
.sf-life-article-card:nth-child(even) {
  background: #fcf5f3 !important;
}

.sf-life-tag {
  color: #681b38 !important;
  background: #f2e0e5 !important;
  border-color: #dfbcc7 !important;
}

.sf-life-path-link,
.sf-life-text-link {
  color: #762743 !important;
}

.sf-life-wide-link > a {
  color: #59162f !important;
  border-color: #bd9b62 !important;
}

/* =========================================================
   02. お金 — COBALT × BUTTER
========================================================= */

.sf-money-hub {
  --money-green: #284a96;
  --money-green-mid: #385cab;
  --money-green-dark: #1f3e83;
  --money-green-deep: #172f68;
  --money-gold: #d0aa42;
  --money-gold-light: #f2dd92;
  --money-warm: #3158a6;
  --money-warm-soft: #e8eefb;
  --money-ivory: #f8efce;
  --money-ivory-light: #fcfaf3;
  --category-warm: #3158a6;
  --category-warm-soft: #e8eefb;

  background: #fcfaf3;
}

.sf-money-hero {
  background: linear-gradient(
    125deg,
    #172f68 0%,
    #24438b 54%,
    #3d62aa 100%
  ) !important;
}

.sf-money-hero h1 {
  color: #fffaf0 !important;
}

.sf-money-hero-lead {
  color: rgba(255, 250, 240, 0.87) !important;
}

.sf-money-section-title,
.sf-money-category-head h2,
.sf-money-select h2 {
  color: #1f3e83 !important;
}

.sf-money-path-card:nth-child(even),
.sf-money-article-card:nth-child(even) {
  background: #fffaf0 !important;
}

.sf-money-tag {
  color: #24438b !important;
  background: #e8eefb !important;
  border-color: #c8d4ef !important;
}

.sf-money-path-link,
.sf-money-text-link {
  color: #284a96 !important;
}

.sf-money-wide-link > a {
  color: #1f3e83 !important;
  border-color: #d0aa42 !important;
}

/* =========================================================
   03. 仕事 — NAVY × OFF-WHITE × RED
========================================================= */

.sf-work-hub {
  --work-green: #263853;
  --work-green-mid: #344864;
  --work-green-dark: #172640;
  --work-green-deep: #101d33;
  --work-gold: #b62032;
  --work-gold-light: #e9c9c5;
  --work-ivory: #f3eadc;
  --work-ivory-light: #fbf8f1;
  --category-warm: #a91d2d;
  --category-warm-soft: #f4e1df;

  background: #fbf8f1;
}

.sf-work-hero {
  background: linear-gradient(
    125deg,
    #101d33 0%,
    #172640 58%,
    #2b3d59 100%
  ) !important;
}

.sf-work-hero::after {
  background: #a91d2d !important;
}

.sf-work-hero h1 {
  color: #fffaf3 !important;
}

.sf-work-section-title,
.sf-work-category-head h2 {
  color: #172640 !important;
}

.sf-work-path-card:nth-child(even),
.sf-work-article-card:nth-child(even) {
  background: #fffaf4 !important;
}

.sf-work-tag {
  color: #8f1827 !important;
  background: #f4e1df !important;
  border-color: #e3c0bd !important;
}

.sf-work-path-link,
.sf-work-text-link {
  color: #8f1827 !important;
}

.sf-work-wide-link > a {
  color: #172640 !important;
  border-color: #a91d2d !important;
}

/* =========================================================
   04. 家族・相続 — PISTACHIO × PEARL
========================================================= */

.sf-category-hub--family {
  --hub-deep: #4d5e3a;
  --hub-mid: #93a66d;
  --hub-warm: #758552;
  --hub-warm-soft: #eef1df;
  --hub-gold: #c4a86a;
  --hub-ivory: #faf7ee;
  --hub-ink: #30372b;
}

.sf-category-hub--family .sf-category-hub__hero {
  background: linear-gradient(
    125deg,
    #465535 0%,
    #65764b 54%,
    #9aaa75 100%
  ) !important;
}

.sf-category-hub--family .sf-category-hub__topic-card:nth-child(2),
.sf-category-hub--family .sf-card:nth-child(even) {
  background: #f7f6e9 !important;
}

.sf-category-hub--family .sf-card__meta span {
  color: #58683e !important;
  background: #eef1df !important;
  border-color: #d7ddbe !important;
}

.sf-category-hub--family .sf-text-link,
.sf-category-hub--family .sf-category-hub__topic-card span {
  color: #607142 !important;
}

/* =========================================================
   05. 終活 — AZURE × CREAM
========================================================= */

.sf-category-hub--planning {
  --hub-deep: #315f89;
  --hub-mid: #79a7cf;
  --hub-warm: #4d83b3;
  --hub-warm-soft: #e7f0f7;
  --hub-gold: #c6a86b;
  --hub-ivory: #fbf7ed;
  --hub-ink: #263542;
}

.sf-category-hub--planning .sf-category-hub__hero {
  background: linear-gradient(
    125deg,
    #294f73 0%,
    #477cab 54%,
    #8bb4d6 100%
  ) !important;
}

.sf-category-hub--planning .sf-category-hub__topic-card:nth-child(2),
.sf-category-hub--planning .sf-card:nth-child(even) {
  background: #f2f7fa !important;
}

.sf-category-hub--planning .sf-card__meta span {
  color: #35698f !important;
  background: #e7f0f7 !important;
  border-color: #c8dce9 !important;
}

.sf-category-hub--planning .sf-text-link,
.sf-category-hub--planning .sf-category-hub__topic-card span {
  color: #35698f !important;
}

/* =========================================================
   06. 自分株式会社 — DUSTY PINK × MOCHA
========================================================= */

.sf-company {
  --sf-green: #704737;
  --sf-green-dark: #573329;
  --sf-green-deep: #43251f;
  --sf-blue: #8e5365;
  --sf-gold: #b68575;
  --sf-gold-light: #e4b9c4;
  --sf-cream: #fbf3f1;
  --sf-line: #dfcfc9;

  background: #fbf7f2 !important;
}

.sf-company-hero {
  background: linear-gradient(
      90deg,
      rgba(67, 37, 31, 0.98) 0%,
      rgba(87, 51, 41, 0.94) 31%,
      rgba(142, 83, 101, 0.66) 58%,
      rgba(142, 83, 101, 0.1) 100%
    ),
    url("https://startfrom39.com/wp-content/uploads/company-hero.jpg") center
      right / cover no-repeat !important;
}

.sf-company-special {
  color: #efc6d0 !important;
}

.sf-company-emblem-ring {
  color: #f1ccd5 !important;
  border-color: #d8a6b4 !important;
}

.sf-company-intro {
  background: #fffaf7 !important;
}

.sf-company-intro-copy h2,
.sf-company-bottom-copy strong {
  color: #573329 !important;
}

.sf-company-intro-copy strong {
  color: #8e5365 !important;
}

.sf-company-flow-item,
.sf-company-item-icon {
  color: #704737 !important;
}

.sf-company-flow-icon,
.sf-company-item-icon {
  border-color: #c99ba7 !important;
  background: #fffaf8 !important;
}

.sf-company-panel {
  border-color: #dfcfc9 !important;
  background: rgba(255, 250, 248, 0.82) !important;
}

.sf-company-panel-title {
  background: linear-gradient(90deg, #573329, #704737) !important;
}

.sf-company-panel-title-blue {
  background: linear-gradient(90deg, #734356, #945b70) !important;
}

.sf-company-number {
  background: #8e5365 !important;
}

.sf-company-btn-green {
  background: linear-gradient(90deg, #573329, #704737) !important;
}

.sf-company-btn-gold {
  background: linear-gradient(90deg, #a96f82, #c28b9a) !important;
}

.sf-company-menu > a {
  border-color: #b68575 !important;
}

/* =========================================================
   07. FAMILY / PLANNING SHARED PAPER TONE
========================================================= */

.sf-category-hub__topics {
  background: #fbf8f1;
}

.sf-category-hub__latest {
  background: #f2ece2;
}

.sf-category-hub__topic-card,
.sf-category-hub .sf-card {
  background: #fffdf8;
}

/* =========================================================
   08. HOVER EFFECTS
========================================================= */

@media (hover: hover) {
  :where(
    .sf-life-path-card,
    .sf-money-path-card,
    .sf-work-path-card,
    .sf-life-feature-card,
    .sf-money-feature-card,
    .sf-work-feature-card,
    .sf-life-article-card,
    .sf-money-article-card,
    .sf-work-article-card,
    .sf-category-hub__topic-card,
    .sf-category-hub .sf-card
  ):hover {
    transform: translateY(-6px);

    box-shadow: 0 22px 42px rgba(42, 37, 33, 0.12) !important;
  }

  .sf-life-wide-link > a:hover {
    color: #fff !important;
    background: #59162f !important;
  }

  .sf-money-wide-link > a:hover {
    color: #fff !important;
    background: #1f3e83 !important;
  }

  .sf-work-wide-link > a:hover {
    color: #fff !important;
    background: #172640 !important;
  }

  .sf-company-main-item:hover {
    background: #fff8f7 !important;
  }

  .sf-company-category-links > a:hover {
    color: #8e5365 !important;
  }
}

/* =========================================================
   09. TOUCH / ACTIVE FEEDBACK
========================================================= */

:where(
  .sf-life-path-card,
  .sf-money-path-card,
  .sf-work-path-card,
  .sf-life-feature-card,
  .sf-money-feature-card,
  .sf-work-feature-card,
  .sf-life-article-card,
  .sf-money-article-card,
  .sf-work-article-card,
  .sf-category-hub__topic-card,
  .sf-category-hub .sf-card
):active {
  transform: translateY(-2px);
}

/* =========================================================
   10. MOBILE
========================================================= */

@media (max-width: 767px) {
  :where(.sf-life-hero, .sf-money-hero, .sf-work-hero, .sf-category-hub__hero) {
    background-position: center !important;
  }

  :where(
    .sf-life-hub,
    .sf-money-hub,
    .sf-work-hub,
    .sf-category-hub,
    .sf-company
  ) {
    overflow-x: hidden;
  }
}

/* =========================================================
   11. REDUCED MOTION
========================================================= */

@media (prefers-reduced-motion: reduce) {
  :where(
    .sf-life-path-card,
    .sf-money-path-card,
    .sf-work-path-card,
    .sf-life-feature-card,
    .sf-money-feature-card,
    .sf-work-feature-card,
    .sf-life-article-card,
    .sf-money-article-card,
    .sf-work-article-card,
    .sf-category-hub__topic-card,
    .sf-category-hub .sf-card,
    .sf-life-wide-link > a,
    .sf-money-wide-link > a,
    .sf-work-wide-link > a
  ) {
    transition: none !important;
  }
}

/* =========================================================
   Next consolidated category palette patch
========================================================= */

/* =========================================================
   Start From 39 — Muted category palettes v1.17.86
   Low-saturation editorial colors selected to sit beside the
   site's ivory, forest green and restrained gold.
========================================================= */

/* =========================================================
   01 人生再設計 — Dusty plum × warm ivory
========================================================= */

.sf-life-hub {
  --life-sage: #806875;
  --life-sage-mid: #927b86;
  --life-sage-light: #b4a1a9;
  --life-green: #765a67;
  --life-green-dark: #624752;
  --life-green-deep: #513943;
  --life-gold: #b59c70;
  --life-gold-light: #e3d4ba;
  --category-warm: #80606d;
  --category-warm-soft: #f2e9eb;
}

.sf-life-hero {
  background: linear-gradient(125deg,#5a414c 0%,#765967 56%,#95808a 100%) !important;
}

.sf-life-path-card:nth-child(even),
.sf-life-article-card:nth-child(even) {
  background: #fcf8f5 !important;
}

.sf-life-tag {
  color: #6f5360 !important;
  background: #f2e9eb !important;
  border-color: #ded0d4 !important;
}

.sf-life-path-link,
.sf-life-text-link {
  color: #765a67 !important;
}

.sf-life-wide-link>a:hover {
  background: #624752 !important;
}

/* =========================================================
   02 お金 — Denim blue × pale butter
========================================================= */

.sf-money-hub {
  --money-green: #60748a;
  --money-green-mid: #71869a;
  --money-green-dark: #50657b;
  --money-green-deep: #405469;
  --money-gold: #bea66d;
  --money-gold-light: #e5d7af;
  --money-warm: #697e93;
  --money-warm-soft: #eaf0f3;
  --category-warm: #697e93;
  --category-warm-soft: #eaf0f3;
}

.sf-money-hero {
  background: linear-gradient(125deg,#40536a 0%,#5d7288 56%,#8394a4 100%) !important;
}

.sf-money-path-card:nth-child(even),
.sf-money-article-card:nth-child(even) {
  background: #fdfaf2 !important;
}

.sf-money-tag {
  color: #50657b !important;
  background: #eaf0f3 !important;
  border-color: #d1dce2 !important;
}

.sf-money-path-link,
.sf-money-text-link {
  color: #566c82 !important;
}

.sf-money-wide-link>a:hover {
  background: #50657b !important;
}

/* =========================================================
   03 仕事 — Slate navy × muted clay
========================================================= */

.sf-work-hub {
  --work-green: #4b5968;
  --work-green-mid: #60707e;
  --work-green-dark: #3c4b5a;
  --work-green-deep: #303e4d;
  --work-gold: #aa7566;
  --work-gold-light: #dfc8c0;
  --category-warm: #a66f60;
  --category-warm-soft: #f2e8e4;
}

.sf-work-hero {
  background: linear-gradient(125deg,#303d4c 0%,#465564 56%,#687784 100%) !important;
}

.sf-work-hero::after {
  background: #aa7566 !important;
}

.sf-work-path-card:nth-child(even),
.sf-work-article-card:nth-child(even) {
  background: #fcf8f4 !important;
}

.sf-work-tag {
  color: #8e5e51 !important;
  background: #f2e8e4 !important;
  border-color: #dfd0ca !important;
}

.sf-work-path-link,
.sf-work-text-link {
  color: #8e5e51 !important;
}

.sf-work-wide-link>a {
  border-color: #aa7566 !important;
}

.sf-work-wide-link>a:hover {
  background: #3c4b5a !important;
}

/* =========================================================
   04 家族・相続 — Muted sage × pearl
========================================================= */

.sf-category-hub--family {
  --hub-deep: #65705b;
  --hub-mid: #939d82;
  --hub-warm: #7f8a6c;
  --hub-warm-soft: #eef0e7;
  --hub-gold: #baa270;
}

.sf-category-hub--family .sf-category-hub__hero {
  background: linear-gradient(125deg,#5b6552 0%,#748066 56%,#9da58f 100%) !important;
}

/* =========================================================
   05 終活 — Mist blue × cream
========================================================= */

.sf-category-hub--planning {
  --hub-deep: #5d7382;
  --hub-mid: #8da1ae;
  --hub-warm: #718999;
  --hub-warm-soft: #eaf0f2;
  --hub-gold: #bba473;
}

.sf-category-hub--planning .sf-category-hub__hero {
  background: linear-gradient(125deg,#526977 0%,#6e8492 56%,#9aabb4 100%) !important;
}

/* =========================================================
   06 自分株式会社 — Dusty rose × soft mocha
========================================================= */

.sf-company {
  --sf-green: #73594f;
  --sf-green-dark: #624a42;
  --sf-green-deep: #503a34;
  --sf-blue: #9b737c;
  --sf-gold: #ae8b79;
  --sf-gold-light: #ddc0c5;
}

.sf-company-hero {
  background: linear-gradient(90deg,rgba(80,58,52,.98) 0%,rgba(98,74,66,.93) 34%,rgba(155,115,124,.50) 63%,rgba(155,115,124,.08) 100%),
    url("https://startfrom39.com/wp-content/uploads/company-hero.jpg") center right/cover no-repeat !important;
}

.sf-company-panel-title {
  background: linear-gradient(90deg,#624a42,#73594f) !important;
}

.sf-company-panel-title-blue {
  background: linear-gradient(90deg,#80606a,#9b737c) !important;
}

.sf-company-number {
  background: #9b737c !important;
}

.sf-company-btn-green {
  background: linear-gradient(90deg,#624a42,#73594f) !important;
}

.sf-company-btn-gold {
  background: linear-gradient(90deg,#96717a,#ae858e) !important;
}

/* =========================================================
   Keep the overall publication light and recognisably Start From 39.
========================================================= */

:where(.sf-life-hub,.sf-money-hub,.sf-work-hub,.sf-category-hub,.sf-company) {
  background: #faf7f0 !important;
}
