/* =====================================================================
   ReYouth Partners トップページ専用スタイル
   出典：制作済み css/style.css（2026-07 受領版）
   変更点：body → body.ryp-front にスコープ／末尾にWordPress統合用の追加
   ===================================================================== */

:root{
    --paper:#F5F0E3;
    --paper-deep:#EDE5D0;
    --ink:#232E4A;
    --ink-soft:#4A5470;
    --vermillion:#B23A26;
    --vermillion-deep:#933120;
    --gold:#A98B4F;
    --line:#DCD2B8;
    --white:#FFFFFF;
    --mincho:"Shippori Mincho","Yu Mincho","Hiragino Mincho ProN",serif;
    --gothic:"Zen Kaku Gothic New","Yu Gothic","Hiragino Kaku Gothic ProN",sans-serif;
  }
  body.ryp-front *{margin:0;padding:0;box-sizing:border-box}
  html{scroll-behavior:smooth;scroll-padding-top:88px}
  body.ryp-front{
    font-family:var(--gothic);
    background:var(--paper);
    color:var(--ink);
    line-height:1.9;
    font-size:16px;
    -webkit-font-smoothing:antialiased;
  }
  body.ryp-front img{max-width:100%;display:block}
  :where(body.ryp-front) a{color:inherit}
  body.ryp-front :focus-visible{outline:2px solid var(--vermillion);outline-offset:3px}

  body.ryp-front .wrap{max-width:1120px;margin:0 auto;padding:0 24px}

  /* ===== 共通パーツ ===== */
  .eyebrow{
    font-family:var(--gothic);
    font-size:.8rem;
    letter-spacing:.28em;
    color:var(--vermillion);
    display:inline-flex;align-items:center;gap:.4em;
    margin-bottom:1.1rem;
  }
  .eyebrow::before{content:"「";color:var(--gold)}
  .eyebrow::after{content:"」";color:var(--gold)}
  .sec-title{
    font-family:var(--mincho);
    font-weight:600;
    font-size:clamp(1.7rem,3.4vw,2.4rem);
    letter-spacing:.08em;
    line-height:1.5;
    margin-bottom:1.2rem;
  }
  .btn{
    display:inline-block;
    font-family:var(--gothic);
    font-size:.95rem;
    letter-spacing:.12em;
    text-decoration:none;
    padding:.95em 2.4em;
    transition:opacity .25s ease, transform .25s ease;
  }
  .btn:hover{opacity:.85;transform:translateY(-1px)}
  .btn-primary{background:var(--ink);color:var(--paper)}
  .btn-accent{background:var(--vermillion);color:#FFF8EF}
  .btn-ghost{border:1px solid var(--ink);color:var(--ink);background:transparent}
  .note{font-size:.82rem;color:var(--ink-soft)}

  body.ryp-front section{padding:96px 0}
  @media (max-width:720px){body.ryp-front section{padding:64px 0}}

  /* ===== ヒーロー ===== */
  .hero{position:relative;overflow:hidden;padding:110px 0 130px;background:var(--paper)}
  .hero-ribbon{
    position:absolute;top:-140px;right:-180px;width:720px;height:150px;
    background:linear-gradient(100deg,var(--vermillion) 0%,var(--vermillion-deep) 100%);
    transform:rotate(38deg);transform-origin:top right;
    pointer-events:none;
  }
  .hero-ribbon::after{
    content:"";position:absolute;left:-8%;bottom:-22px;width:116%;height:2px;background:var(--gold);
  }
  .hero-grid{display:grid;grid-template-columns:64px 1fr;gap:32px;align-items:start;position:relative}
  .tate{
    writing-mode:vertical-rl;
    font-family:var(--mincho);font-size:1rem;letter-spacing:.5em;color:var(--ink-soft);
    border-left:1px solid var(--line);padding-left:20px;height:300px;
  }
  .hero h1{
    font-family:var(--mincho);font-weight:700;
    font-size:clamp(2rem,5vw,3.4rem);
    letter-spacing:.06em;line-height:1.7;margin:1rem 0 1.6rem;
  }
  .hero h1 .aka{color:var(--vermillion)}
  .hero-lead{max-width:36em;color:var(--ink-soft);margin-bottom:.9rem}
  .hero-for{
    font-size:.9rem;letter-spacing:.06em;margin-bottom:2rem;
    padding-left:1em;border-left:2px solid var(--vermillion);
  }
  .hero-actions{display:flex;flex-wrap:wrap;gap:16px;align-items:center}
  .hero-free{font-size:.82rem;color:var(--ink-soft);letter-spacing:.08em}
  @media (max-width:720px){
    .hero{padding:72px 0 90px}
    .hero-grid{grid-template-columns:1fr}
    .tate{display:none}
    .hero-ribbon{width:420px;height:90px;top:-70px;right:-140px}
  }

  /* ===== About ===== */
  .about{background:var(--paper-deep)}
  .about-grid{display:grid;grid-template-columns:1fr 1.3fr;gap:64px;align-items:start}
  .about-quote{
    font-family:var(--mincho);font-style:italic;font-size:1.15rem;line-height:2.1;
    border-left:3px solid var(--vermillion);padding-left:1.2em;margin:1.4rem 0;
  }
  @media (max-width:840px){.about-grid{grid-template-columns:1fr;gap:36px}}

  /* ===== サービス ===== */
  .svc-grid{display:grid;grid-template-columns:1fr 1fr;gap:1px;background:var(--line);border:1px solid var(--line);margin-top:2.4rem}
  .svc{background:var(--paper);padding:44px 40px}
  .svc-num{font-family:var(--mincho);font-size:.85rem;color:var(--vermillion);letter-spacing:.3em;margin-bottom:1rem}
  .svc-num::before{content:"「 ";color:var(--gold)}
  .svc-num::after{content:" 」";color:var(--gold)}
  .svc h3{font-family:var(--mincho);font-size:1.3rem;font-weight:600;letter-spacing:.08em;margin-bottom:.7rem}
  .svc p{font-size:.92rem;color:var(--ink-soft)}
  .svc .case{
    margin-top:1.1rem;font-size:.82rem;line-height:1.8;color:var(--ink);
    background:var(--paper-deep);padding:.9em 1.1em;
  }
  .svc .case b{color:var(--vermillion);font-weight:700;display:block;letter-spacing:.1em;margin-bottom:.2em;font-size:.78rem}
  @media (max-width:840px){.svc-grid{grid-template-columns:1fr}.svc{padding:34px 26px}}

  /* ===== 料金の考え方 ===== */
  .fee{background:var(--paper-deep)}
  .fee-box{display:grid;grid-template-columns:1fr 1fr 1fr;gap:24px;margin-top:2rem}
  .fee-item{background:var(--white);padding:30px 28px}
  .fee-item h3{font-family:var(--mincho);font-size:1.05rem;letter-spacing:.08em;margin-bottom:.5rem}
  .fee-item p{font-size:.88rem;color:var(--ink-soft)}
  @media (max-width:840px){.fee-box{grid-template-columns:1fr}}

  /* ===== 支援の流れ ===== */
  .flow-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:40px;margin-top:2.6rem}
  .flow{border-top:2px solid var(--vermillion);padding-top:1.4rem}
  .flow .roman{font-family:var(--mincho);font-style:italic;font-size:1.2rem;color:var(--gold)}
  .flow h3{font-family:var(--mincho);font-size:1.08rem;letter-spacing:.1em;margin:.5rem 0 .4rem}
  .flow p{font-size:.88rem;color:var(--ink-soft)}
  .flow .term{display:inline-block;margin-top:.7rem;font-size:.75rem;letter-spacing:.1em;color:var(--vermillion);border:1px solid var(--vermillion);padding:.15em .8em}
  @media (max-width:920px){.flow-grid{grid-template-columns:1fr 1fr;gap:32px}}
  @media (max-width:560px){.flow-grid{grid-template-columns:1fr}}

  /* ===== 選ばれる理由 ===== */
  .why{background:var(--paper-deep)}
  .why-row{
    display:grid;grid-template-columns:minmax(220px,.9fr) 2fr;gap:32px;
    padding:2rem 0;border-bottom:1px solid var(--line);align-items:baseline;
  }
  .why-row:first-of-type{border-top:1px solid var(--line);margin-top:2rem}
  .why-row h3{
    font-family:var(--mincho);font-size:1.15rem;font-weight:600;letter-spacing:.08em;line-height:1.8;
    word-break:keep-all;overflow-wrap:anywhere;
  }
  .why-row p{font-size:.95rem;color:var(--ink-soft)}
  @media (max-width:720px){.why-row{grid-template-columns:1fr;gap:8px}}

  /* ===== 代表メッセージ ===== */
  .founder-body{max-width:760px;margin-top:2.2rem;font-size:.95rem}
  .founder-body p+p{margin-top:1.1em}
  .founder-sign{
    margin-top:2.4rem;text-align:right;
    font-family:var(--mincho);letter-spacing:.15em;color:var(--ink);
  }
  .founder-sign small{font-size:.8rem;color:var(--ink-soft);margin-right:.8em;letter-spacing:.2em}
  .founder-sign strong{font-size:1.35rem;font-weight:600}

  /* ===== News ===== */
  .news-list{margin-top:2rem;border-top:1px solid var(--line)}
  .news-item{
    display:grid;grid-template-columns:130px 1fr;gap:24px;
    padding:1.2rem 0;border-bottom:1px solid var(--line);font-size:.95rem;
  }
  .news-item time{color:var(--vermillion);font-family:var(--mincho);letter-spacing:.06em}
  @media (max-width:560px){.news-item{grid-template-columns:1fr;gap:4px}}

  /* ===== 会社概要 ===== */
  .company{background:var(--paper-deep)}
  .company dl{margin-top:2rem;border-top:1px solid var(--line)}
  .company .row{
    display:grid;grid-template-columns:200px 1fr;gap:24px;
    padding:1.1rem 0;border-bottom:1px solid var(--line);
  }
  .company dt{font-size:.85rem;letter-spacing:.15em;color:var(--ink-soft)}
  .company dd{font-size:.95rem}
  .company dd a{color:var(--vermillion);text-decoration:underline;text-underline-offset:3px}
  @media (max-width:640px){.company .row{grid-template-columns:1fr;gap:4px}}

  /* ===== Contact ===== */
  .contact{background:var(--ink);color:var(--paper);padding:110px 0}
  .contact .eyebrow{color:var(--gold)}
  .contact .eyebrow::before,.contact .eyebrow::after{color:var(--vermillion)}
  .contact .sec-title{color:#FDF9EE;text-align:center}
  .contact-lead{text-align:center;color:#C7CCDA;font-size:.95rem;margin-bottom:3rem}
  .contact-center{text-align:center}
  .form{
    max-width:640px;margin:0 auto;background:rgba(255,255,255,.04);
    border:1px solid rgba(255,255,255,.14);padding:40px 36px;
  }
  .form .field{margin-bottom:1.4rem}
  .form label{display:block;font-size:.82rem;letter-spacing:.15em;margin-bottom:.45rem;color:#D8DCE8}
  .form label .req{color:#E4A28D;font-size:.7rem;margin-left:.5em}
  .form input[type=text],.form input[type=email],.form textarea{
    width:100%;background:#FDF9EE;border:1px solid transparent;padding:.8em 1em;
    font-family:var(--gothic);font-size:.95rem;color:var(--ink);
  }
  .form input:focus,.form textarea:focus{outline:2px solid var(--vermillion)}
  .form textarea{min-height:140px;resize:vertical}
  .form .consent{display:flex;gap:.6em;align-items:flex-start;font-size:.82rem;color:#C7CCDA;margin:1.6rem 0}
  .form .consent a{color:#E4A28D}
  .form .submit-row{text-align:center}
  .form .note{color:#9AA1B5;text-align:center;margin-top:1.2rem}

  /* ===== フッター ===== */
  footer{background:var(--ink);color:#C7CCDA;border-top:1px solid rgba(255,255,255,.12);padding:56px 0 40px}
  .foot-grid{display:grid;grid-template-columns:1.4fr 1fr 1fr;gap:40px}
  .foot-logo strong{font-family:var(--mincho);color:#FDF9EE;font-size:1.15rem;letter-spacing:.06em;display:block}
  .foot-logo span{font-size:.68rem;letter-spacing:.3em}
  footer h4{font-size:.75rem;letter-spacing:.25em;color:#8F97AC;margin-bottom:1rem}
  footer ul{list-style:none}
  footer li{font-size:.88rem;margin-bottom:.6rem}
  footer a{text-decoration:none;color:#C7CCDA}
  footer a:hover{color:#FDF9EE}
  .copyright{margin-top:48px;font-size:.75rem;letter-spacing:.1em;color:#7C849B;text-align:center}
  @media (max-width:720px){.foot-grid{grid-template-columns:1fr;gap:28px}}

  /* ===== プライバシーポリシー ===== */
  .privacy .wrap{max-width:820px}
  .privacy h3{font-family:var(--mincho);font-size:1.05rem;letter-spacing:.1em;margin:2rem 0 .6rem}
  .privacy p,.privacy li{font-size:.9rem;color:var(--ink-soft)}
  .privacy ul{padding-left:1.4em}

  /* ===== スクロール表示 ===== */
  .reveal{opacity:0;transform:translateY(18px);transition:opacity .7s ease,transform .7s ease}
  .reveal.in{opacity:1;transform:none}
  @media (prefers-reduced-motion:reduce){
    html{scroll-behavior:auto}
    .reveal{opacity:1;transform:none;transition:none}
    .btn{transition:none}
  }

  /* ===== WordPress統合用の追加 ===== */
  /* お知らせをリンク化した際の見た目（元デザインを踏襲） */
  a.news-item{text-decoration:none;color:inherit;transition:opacity .25s ease}
  a.news-item:hover{opacity:.72}
  a.news-item p{color:var(--ink)}

  /* 既存フォームのショートコードを埋め込む場合の外枠（.form と同等の見た目） */
  .ryp-form-embed{
    max-width:640px;margin:0 auto;background:rgba(255,255,255,.04);
    border:1px solid rgba(255,255,255,.14);padding:40px 36px;color:#D8DCE8;
  }
  .ryp-form-embed input[type=text],
  .ryp-form-embed input[type=email],
  .ryp-form-embed input[type=tel],
  .ryp-form-embed textarea{
    width:100%;background:#FDF9EE;border:1px solid transparent;padding:.8em 1em;
    font-family:var(--gothic);font-size:.95rem;color:var(--ink);
  }
  .ryp-form-embed input[type=submit],
  .ryp-form-embed button[type=submit]{
    display:inline-block;font-family:var(--gothic);font-size:.95rem;letter-spacing:.12em;
    background:var(--vermillion);color:#FFF8EF;border:none;cursor:pointer;padding:.95em 2.4em;
  }