/*
Theme Name: 三河結心（Yuisin）
Theme URI: https://mikawayuishin.jp
Author: 久保田 和義
Description: 三河結心公式WordPressテーマ
Version: 1.0
Text Domain: yuisin
*/

/* 読み込み元CSS */
@import url('assets/main.css');


 :root{
      --pink:#FBE9E7;
      --gold:#D4AF37;
      --brown:#5C4033;
      --red:#C73E3A; /* 朱色 */
      --muted:#7a6b64;
      --white:#fff;
      --max-width:1140px;
    }

    *{box-sizing:border-box;margin:0;padding:0}
    body{
      font-family:"Noto Sans JP",sans-serif;
      color:var(--brown);
      background:var(--white);
      line-height:1.8;
    }
    img{max-width:100%;height:auto;display:block}
    a{text-decoration:none;color:inherit}

    .container{
      width:calc(100% - 32px);
      max-width:var(--max-width);
      margin:0 auto;
    }

    /* HEADER */
    header.site-header{
      background:#fff;
      border-bottom:2px solid var(--red);
      position:sticky;top:0;z-index:10;
    }
    .header-inner{
      height:76px;display:flex;align-items:center;justify-content:space-between;
    }
    .brand{display:flex;align-items:center;gap:14px;}
    .brand img.logo{
      height:54px;width:auto;display:block;
    }
    .site-title .jp{font-family:"Noto Serif JP",serif;font-size:18px;font-weight:700;color:var(--brown);}
    .site-title .en{font-family:"Playfair Display",serif;font-size:12px;color:var(--muted);letter-spacing:1px;}

  
    nav.main-nav a{position:relative;padding-bottom:4px;}
    nav.main-nav a::after{
      content:"";position:absolute;bottom:0;left:0;width:0;height:2px;background:var(--red);transition:width 0.3s;
    }
    nav.main-nav a:hover::after{width:100%;}
    .btn-cta{
      border:1px solid var(--red);
      color:var(--red);
      padding:9px 14px;
      border-radius:8px;
      font-weight:700;
      transition:all .3s;
    }
    .btn-cta:hover{background:var(--red);color:#fff;}

    /* HERO */
    .hero{
  background:
    linear-gradient(rgba(255,255,255,0.6),rgba(255,255,255,0.6)),
    url('/wp-content/themes/yuisin/assets/img/yuisin/mmskv.jpg') center/cover no-repeat;
  padding: 84px 0 56px;
}

    .hero-inner{display:flex;align-items:center;gap:36px;flex-wrap:wrap;}
    .hero-copy{max-width:640px}
    .eyebrow{font-size:14px;color:var(--red);margin-bottom:10px;letter-spacing:2px;}
    h1.hero-title{
      font-family:"Noto Serif JP",serif;
      font-size:44px;margin-bottom:14px;
      background:linear-gradient(90deg, var(--red), var(--gold));
      -webkit-background-clip:text;
      -webkit-text-fill-color:transparent;
    }
    p.hero-sub{font-size:18px;margin-bottom:22px;color:#60483f}
    .hero-ctas{display:flex;gap:12px;align-items:center;flex-wrap:wrap;}
    .btn-primary{
      background:var(--red);color:#fff;padding:14px 22px;border-radius:10px;font-weight:700;transition:all .3s;
    }
    .btn-primary:hover{background:var(--gold);color:var(--brown);}
    .btn-secondary{
      border:1px solid var(--red);color:var(--red);padding:12px 18px;border-radius:10px;transition:all .3s;
    }
    .btn-secondary:hover{background:var(--red);color:#fff;}

     /* Hero visual (right) */
    .hero-visual{min-width:320px;max-width:420px}
    .visual-card{background:var(--white);padding:18px;border-radius:14px;box-shadow:0 12px 30px rgba(0,0,0,0.06);border:1px solid rgba(92,64,51,0.04)}

    
    /* COMMON SECTION STYLE */
    section{padding:80px 0;}
    section h2{
      font-family:"Noto Serif JP",serif;
      font-size:28px;
      text-align:center;
      color:var(--red);
      letter-spacing:2px;
      margin-bottom:16px;
    }
    section p.intro{
      text-align:center;
      color:var(--muted);
      margin-bottom:40px;
    }

    /* ABOUT */
    #about .about-inner{
      display:grid;
      grid-template-columns:1fr 1fr;
      gap:100px;
      align-items:center;
    }
    #about img{border-radius:12px;box-shadow:0 8px 20px rgba(0,0,0,0.05);}

    /* SERVICE */
    #service .services{
      display:grid;
      grid-template-columns:repeat(auto-fit,minmax(280px,1fr));
      gap:24px;
    }
    .service-card{
      background:#fff;
      border:1px solid var(--pink);
      border-radius:12px;
      padding:24px;
      text-align:center;
      transition:transform .3s;
    }
    .service-card:hover{transform:translateY(-4px);}
    .service-card h3{
      color:var(--red);
      margin-bottom:10px;
      font-family:"Noto Serif JP",serif;
    }

    /* VOICES */
    #voices .voice-list{
      display:grid;
      grid-template-columns:repeat(auto-fit,minmax(320px,1fr));
      gap:24px;
    }
    .voice{
      background:#fff;
      border-left:6px solid var(--red);
      border-radius:8px;
      padding:20px;
      font-size:15px;
      box-shadow:0 4px 10px rgba(0,0,0,0.05);
    }
    .voice span{
      display:block;
      margin-top:12px;
      font-weight:700;
      color:var(--muted);
    }

    /* PLANS */
    #plans{
      background:linear-gradient(to bottom, #fff, #fdf6f5);
    }
    .plans{display:grid;grid-template-columns:repeat(2,1fr);gap:18px;margin-top:24px;}
    .plan{
      background:#fff;padding:24px;border-radius:12px;border:2px solid var(--pink);text-align:center;
      box-shadow:0 8px 20px rgba(0,0,0,0.03);transition:transform 0.3s;
    }
    .plan:hover{transform:translateY(-4px);}
    .plan h3{font-family:"Noto Serif JP",serif;color:var(--red);font-size:20px;}
    .plan .price{font-size:26px;color:var(--gold);font-weight:700;margin:8px 0}
    .plan-detail-center {
  /* グリッド内で両カラムにまたがらせる */
  grid-column: 1 / -1;

  /* 中央揃え */
  display: flex;
  justify-content: center;
  align-items: center;

  /* 見た目調整 */
  margin-top: 24px;
  width: 100%;
}




    /* CONTACT */
    .contact-grid{display:grid;grid-template-columns:1fr 360px;gap:24px;align-items:start}
    form .input, form textarea{width:100%;padding:10px;border:1px solid rgba(92,64,51,0.08);border-radius:8px;margin-top:8px}
    form button{margin-top:12px;}

    label{font-weight:700;}
    input,textarea{
      padding:10px;
      border:1px solid #ccc;
      border-radius:6px;
      font-size:16px;
      font-family:"Noto Sans JP",sans-serif;
    }
    textarea{height:120px;}
    button{
      background:var(--red);
      color:#fff;
      border:none;
      padding:12px;
      border-radius:8px;
      font-size:16px;
      font-weight:700;
      cursor:pointer;
      transition:background .3s;
    }
    button:hover{background:var(--gold);color:var(--brown);}

    /* FOOTER */
    footer.site-footer{
      background:#2b2623;color:#fff;padding:36px 0;text-align:center;border-top:4px solid var(--red);
    }
    @media (max-width:768px) {
      .header-inner {
        flex-direction:column;
        gap:12px;
        height:auto;
        padding:10px 0;
      }

      nav.main-nav {
        flex-wrap:wrap;
        justify-content:center;
        gap:12px;
      }

      .hero {
        padding:60px 0;
        text-align:center;
      }

      h1.hero-title {
        font-size:32px;
      }

      p.hero-sub {
        font-size:16px;
      }

      .plans {
        grid-template-columns:1fr;
      }

      .plan {
        padding:18px;
      }
    }

    @media (max-width:480px) {
      h1.hero-title {
        font-size:26px;
      }

      .btn-primary, .btn-secondary {
        width:100%;
        text-align:center;
      }
    }
/* 料金プランページ：横並びレイアウト */
.plans-grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr); /* 2カラム */
  gap: 32px;
  margin-top: 40px;
}

.plan-card {
  background: #fff;
  border: 2px solid #f5e2df;
  border-radius: 14px;
  padding: 28px;
  box-shadow: 0 6px 20px rgba(0,0,0,0.05);
  transition: transform .3s;
}

.plan-card:hover {
  transform: translateY(-6px);
}

/* おすすめプランを強調 */
.plan-card.featured {
  border: 3px solid #C73E3A;
  box-shadow: 0 8px 30px rgba(199,62,58,0.15);
  position: relative;
}

/* おすすめバッジ */
.plan-badge {
  position: absolute;
  top: -12px;
  right: -12px;
  background: #C73E3A;
  color: #fff;
  padding: 6px 14px;
  border-radius: 20px;
  font-size: 13px;
  font-weight: bold;
}

.plan-title {
  font-family: "Noto Serif JP", serif;
  font-size: 22px;
  color: #C73E3A;
  margin-bottom: 10px;
}

.plan-price {
  font-size: 26px;
  color: #D4AF37;
  font-weight: bold;
  margin-bottom: 12px;
}

.plan-details,
.plan-features {
  list-style: none;
  padding: 0;
  margin: 14px 0;
}

.plan-details li,
.plan-features li {
  background: #faf5f4;
  padding: 10px;
  margin-bottom: 8px;
  border-radius: 8px;
  font-size: 15px;
}

.plan-desc {
  margin: 16px 0;
  color: #7a6b64;
  font-size: 15px;
}

/* 下部のボタン */
.plans-contact {
  margin-top: 40px;
  text-align: center;
}

/* スマホ用：1カラムに変更 */
@media (max-width: 768px) {
  .plans-grid {
    grid-template-columns: 1fr;
  }
}
/* ブログ一覧 */
.blog-list { display:grid; grid-template-columns:repeat(auto-fit,minmax(280px,1fr)); gap:24px; margin-top:24px; }
.blog-item { background:#fff; padding:16px; border-radius:8px; box-shadow:0 6px 18px rgba(0,0,0,.05); }
.blog-thumb img { width:100%; height:160px; object-fit:cover; border-radius:6px; margin-bottom:10px; }
.blog-title { font-size:18px; color:#C73E3A; margin:8px 0; }
.blog-excerpt { color:#7a6b64; }

/* 個別記事 */
.blog-article { max-width:900px; margin:0 auto; padding:40px 0; }
.blog-title { font-size:30px; margin-bottom:12px; }
.blog-meta { color:#7a6b64; margin-bottom:18px; }
.blog-thumb-large img { width:100%; height:auto; margin-bottom:20px; }
.blog-content { line-height:1.9; color:#4b3c36; }

/* ページネーション */
.pagination { margin-top:28px; text-align:center; }
nav.main-nav ul.main-menu {
  display: flex !important;
  flex-direction: row !important;
  gap: 30px;
  list-style: none;
  margin: 0;
  padding: 0;
}

nav.main-nav ul.main-menu li {
  list-style: none;
}

nav.main-nav ul.main-menu li a {
  text-decoration: none;
  color: #333;
  font-weight: 500;
}