/* ========== common ========== */
.section{padding:var(--section-pc) 0}
.section-alt{background:var(--surface-low)}
.text-muted{color:var(--muted)}
.btn{
      display:inline-flex;align-items:center;justify-content:center;gap:16px;
      font-weight:700;
      transition:transform .3s ease,background-color .3s ease,color .3s ease,border-color .3s ease,opacity .3s ease;
    }
.btn-ghost{
      border:1px solid var(--border);color:var(--text);
      padding:16px 32px;background:transparent;
    }
.btn-ghost:hover{background:#fff}
/* ========== page hero ========== */
.page-hero{
      position:relative;
      height:480px;
      display:flex;align-items:center;
      overflow:hidden;
      margin-top:var(--header-h);
    }
.page-hero-bg{
      position:absolute;inset:0;width:100%;height:100%;object-fit:cover;
    }
.page-hero-overlay{
      position:absolute;inset:0;
      background:linear-gradient(to right, rgba(0,0,0,.55) 0%, rgba(0,0,0,.15) 100%);
    }
.page-hero-content{
      position:relative;z-index:10;color:var(--white);
    }
.page-hero-content .small-label{
      display:block;color:rgba(255,255,255,.7);margin-bottom:16px;
    }
.page-hero-title{
      margin:0;
      font-family:"Shippori Mincho",serif;
      font-size:48px;line-height:1.5;font-weight:600;letter-spacing:.05em;
      color:var(--white);
    }
.page-hero-lead{
      margin:16px 0 0;font-size:16px;line-height:1.8;
      color:rgba(255,255,255,.85);max-width:480px;
    }
/* ========== breadcrumb ========== */
.breadcrumb{
      padding:16px 0;font-size:12px;color:var(--muted);
      border-bottom:1px solid var(--border);
    }
.breadcrumb a{color:var(--muted);transition:color .2s}
.breadcrumb a:hover{color:var(--green)}
.breadcrumb span{margin:0 8px;opacity:.5}
/* ========== philosophy ========== */
.two-col{display:grid;grid-template-columns:1fr;gap:64px;align-items:center}
.image-frame{overflow:hidden;border:1px solid var(--border)}
.image-frame img{
      width:100%;height:100%;object-fit:cover;
      transition:transform .7s ease;
    }
.image-frame:hover img{transform:scale(1.03)}
.philosophy-text p{
      margin:0 0 24px;line-height:2;
    }
.philosophy-text p:last-child{margin:0}
/* ========== features（こだわり）========== */
.feature-list{display:flex;flex-direction:column;gap:80px}
.feature-item{
      display:grid;grid-template-columns:1fr;gap:48px;align-items:center;
    }
.feature-item.reverse{}
.feature-num{
      font-family:"Shippori Mincho",serif;
      font-size:80px;line-height:1;font-weight:600;
      color:var(--border);letter-spacing:-.02em;
      margin-bottom:8px;
    }
.feature-item h3{
      margin:0 0 16px;
      font-family:"Shippori Mincho",serif;
      font-size:28px;line-height:1.5;font-weight:600;
    }
.feature-item p{
      margin:0;color:var(--muted);line-height:2;
    }
.feature-image{
      aspect-ratio:4/3;overflow:hidden;border:1px solid var(--border);
    }
.feature-image img{
      width:100%;height:100%;object-fit:cover;
      transition:transform .7s ease;
    }
.feature-image:hover img{transform:scale(1.03)}
/* ========== process（家づくりの流れ）========== */
.process-list{
      display:flex;flex-direction:column;gap:0;
      counter-reset:step;
    }
.process-item{
      display:grid;grid-template-columns:80px 1fr;gap:32px;
      padding:40px 0;
      border-bottom:1px solid var(--border);
      position:relative;
    }
.process-item:last-child{border-bottom:none}
.process-step{
      display:flex;flex-direction:column;align-items:center;gap:8px;
    }
.process-step-num{
      width:56px;height:56px;border-radius:50%;
      background:var(--green);color:var(--white);
      display:flex;align-items:center;justify-content:center;
      font-family:"Shippori Mincho",serif;
      font-size:20px;font-weight:600;
      flex-shrink:0;
    }
.process-step-line{
      width:1px;flex:1;min-height:24px;
      background:var(--border);
    }
.process-item:last-child .process-step-line{display:none}
.process-body h3{
      margin:12px 0 8px;
      font-family:"Shippori Mincho",serif;
      font-size:20px;font-weight:600;
    }
.process-body p{margin:0;color:var(--muted);line-height:2;font-size:15px}
.process-tag{
      display:inline-block;
      font-size:10px;font-weight:700;letter-spacing:.1em;
      color:var(--green);background:rgba(51,79,29,.08);
      padding:4px 10px;border-radius:2px;
    }
/* ========== cta ========== */
.cta{
      position:relative;overflow:hidden;
      background:var(--footer);color:var(--white);
      padding:96px 0;
    }
.cta-bg{
      position:absolute;inset:0;width:100%;height:100%;object-fit:cover;
      transition:transform .7s ease;
    }
.cta:hover .cta-bg{transform:scale(1.02)}
.cta-overlay{position:absolute;inset:0;background:rgba(0,0,0,.45)}
.cta-content{position:relative;z-index:10;text-align:center}
.cta-buttons{
      display:flex;flex-direction:column;gap:24px;
      justify-content:center;align-items:center;
    }
/* ========== footer ========== */
/* ========== responsive ========== */
@media(min-width:768px){
  .two-col{grid-template-columns:repeat(2,1fr)}
  .feature-item{grid-template-columns:repeat(2,1fr)}
  .feature-item.reverse .feature-image{order:-1}
  .cta-buttons{flex-direction:row}
}
@media(max-width:767px){
  .section{padding:var(--section-sp) 0}
  .section-title{font-size:28px;letter-spacing:.03em}
  .page-hero{height:360px}
  .page-hero-title{font-size:32px}
  .feature-num{font-size:56px}
  .feature-item h3{font-size:22px}
  .process-item{grid-template-columns:56px 1fr;gap:20px}
  .process-step-num{width:44px;height:44px;font-size:16px}
}