/**
 * 不動産買取ページ（会社概要・スタッフと同一系統のレイアウト）
 */

.page-buy .screen-reader-text {
  border: 0;
  clip: rect(1px, 1px, 1px, 1px);
  clip-path: inset(50%);
  height: 1px;
  margin: -1px;
  overflow: hidden;
  padding: 0;
  position: absolute;
  width: 1px;
  word-wrap: normal !important;
}

.page-buy {
  --buy-bar-bg: #1a237e;
  --buy-blob-start: #7dd3fc;
  --buy-blob-end: #a78bfa;
  --buy-inner: min(calc(100% - 40px), 1200px);
  --buy-hero-w: 990px;
  --buy-accent: #00698c;
  writing-mode: horizontal-tb;
  direction: ltr;
  overflow-x: hidden;
}

.page-buy .l-contents,
.page-buy .l-main,
.page-buy .p-page {
  width: 100% !important;
  max-width: 100% !important;
  min-width: 0;
  box-sizing: border-box;
}

.page-buy .p-page-buy,
.page-buy .p-buy-hero,
.page-buy .p-buy-body {
  word-break: normal;
  overflow-wrap: break-word;
  max-width: 100%;
}

/* ========== Hero ========== */
.page-buy .p-buy-hero {
  position: relative;
  width: var(--buy-hero-w);
  max-width: 100%;
  height: 340px;
  margin-left: auto;
  margin-right: auto;
  overflow: hidden;
  background: #b8c4c8;
  box-sizing: border-box;
}

.page-buy .p-buy-hero__bg {
  display: block;
  width: var(--buy-hero-w);
  max-width: 100%;
  height: 340px;
  object-fit: cover;
  object-position: center;
}

.page-buy .p-buy-hero__bg--ph {
  position: absolute;
  inset: 0;
  background: linear-gradient(135deg, #8a9aa0 0%, #c5d0d4 100%);
}

.page-buy .p-buy-hero-panel {
  position: absolute;
  left: 0;
  top: 126px;
  width: 308px;
  height: 117px;
  background: rgba(0, 0, 0, 0.58);
  display: flex;
  align-items: center;
  padding: 0 24px;
  box-sizing: border-box;
}

.page-buy .p-buy-hero-panel__left {
  width: 200px;
}

.page-buy .p-buy-hero-panel__en {
  margin: 0;
  color: #fff;
  font-size: 28px;
  line-height: 1.12;
  font-family: Georgia, "Times New Roman", serif;
  font-weight: 700;
  letter-spacing: 0.2px;
}

.page-buy .p-buy-hero-panel__divider {
  width: 1px;
  height: 92px;
  background: rgba(255, 255, 255, 0.8);
  margin: 0 20px 0 8px;
  flex-shrink: 0;
}

.page-buy .p-buy-hero-panel__right {
  color: #fff;
  font-weight: 700;
  font-size: 15px;
  white-space: nowrap;
}

/* ========== Body ========== */
.p-buy-body {
  background: #fff;
  padding: 28px 0 88px;
}

.p-buy-body__inner {
  max-width: var(--buy-inner);
  margin-left: auto;
  margin-right: auto;
  position: relative;
}

/* パンくず */
.p-buy-breadcrumb {
  font-size: 15px;
  color: #666;
  margin: 0 0 20px;
}

.p-buy-breadcrumb a {
  color: #00698c;
  text-decoration: none;
}

.p-buy-breadcrumb a:hover {
  text-decoration: underline;
}

.p-buy-breadcrumb__sep {
  margin: 0 8px;
  color: #999;
}

.p-buy-breadcrumb__current {
  color: #333;
}

/* キャッチ */
.p-buy-catch {
  text-align: center;
  font-size: 15px;
  font-weight: 600;
  color: #222;
  margin: 0 0 36px;
  line-height: 1.6;
}

/* イントロ＋ blob */
.p-buy-intro {
  position: relative;
  margin-bottom: 56px;
  padding: 8px 0 16px;
  min-height: 120px;
}

.p-buy-blob {
  position: absolute;
  border-radius: 50% 50% 40% 60% / 40% 50% 50% 60%;
  background: linear-gradient(135deg, var(--buy-blob-start) 0%, var(--buy-blob-end) 100%);
  opacity: 0.28;
  pointer-events: none;
  z-index: 0;
}

.p-buy-blob--left {
  top: -30px;
  left: -8%;
  width: min(52%, 420px);
  height: 280px;
}

.p-buy-blob--right {
  bottom: -50px;
  right: -10%;
  width: min(55%, 460px);
  height: 300px;
  background: linear-gradient(225deg, var(--buy-blob-start) 0%, var(--buy-blob-end) 100%);
}

.p-buy-intro__inner {
  position: relative;
  z-index: 1;
  text-align: center;
}

.p-buy-intro__title {
  font-size: clamp(22px, 4vw, 32px);
  font-weight: 700;
  color: #111;
  margin: 0 0 16px;
  line-height: 1.35;
}

.p-buy-intro__lead {
  font-size: 17px;
  font-weight: 600;
  color: #333;
  margin: 0;
}

/* ========== 特徴 8 カード ========== */
.p-buy-features {
  position: relative;
  z-index: 1;
  margin-bottom: 72px;
}

.p-buy-features__grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 20px;
  list-style: none;
  margin: 0;
  padding: 0;
}

.p-buy-feature {
  background: #fff;
  border: 1px solid #dcdcdc;
  border-radius: 8px;
  padding: 22px 18px 20px;
  text-align: center;
  box-sizing: border-box;
}

.p-buy-feature__icon {
  display: block;
  width: 44px;
  height: 44px;
  margin: 0 auto 14px;
  background-repeat: no-repeat;
  background-position: center;
  background-size: 40px 40px;
}

/* アイコン（SVG data URI） */
.p-buy-feature__icon--clock {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23444444' stroke-width='1.8'%3E%3Ccircle cx='12' cy='12' r='9'/%3E%3Cpath d='M12 7v5l3 2' stroke-linecap='round'/%3E%3C/svg%3E");
}

.p-buy-feature__icon--truck {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23444444' stroke-width='1.8'%3E%3Cpath d='M1 3h15v13H1zM16 8h4l3 3v5h-7V8z' stroke-linejoin='round'/%3E%3Ccircle cx='5.5' cy='18.5' r='2.5'/%3E%3Ccircle cx='18.5' cy='18.5' r='2.5'/%3E%3C/svg%3E");
}

.p-buy-feature__icon--house {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23444444' stroke-width='1.8'%3E%3Cpath d='M3 10.5L12 3l9 7.5V20a1 1 0 01-1 1h-5v-6H9v6H4a1 1 0 01-1-1v-9.5z' stroke-linejoin='round'/%3E%3C/svg%3E");
}

.p-buy-feature__icon--doc {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23444444' stroke-width='1.8'%3E%3Cpath d='M14 2H6a2 2 0 00-2 2v16a2 2 0 002 2h12a2 2 0 002-2V8l-6-6z' stroke-linejoin='round'/%3E%3Cpath d='M14 2v6h6M8 13h8M8 17h6' stroke-linecap='round'/%3E%3C/svg%3E");
}

.p-buy-feature__icon--lock {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23444444' stroke-width='1.8'%3E%3Crect x='5' y='11' width='14' height='10' rx='2'/%3E%3Cpath d='M8 11V7a4 4 0 018 0v4' stroke-linecap='round'/%3E%3C/svg%3E");
}

.p-buy-feature__icon--housecheck {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23444444' stroke-width='1.8'%3E%3Cpath d='M3 10.5L12 3l9 7.5V20a1 1 0 01-1 1h-4v-7H8v7H4a1 1 0 01-1-1v-9.5z' stroke-linejoin='round'/%3E%3Cpath d='M9 12l2 2 4-4' stroke-linecap='round'/%3E%3C/svg%3E");
}

.p-buy-feature__icon--calc {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23444444' stroke-width='1.8'%3E%3Crect x='4' y='3' width='16' height='18' rx='2'/%3E%3Cpath d='M8 7h8M8 11h2M12 11h2M16 11h2M8 15h2M12 15h2M16 15h2' stroke-linecap='round'/%3E%3C/svg%3E");
}

.p-buy-feature__icon--people {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23444444' stroke-width='1.8'%3E%3Ccircle cx='9' cy='7' r='3'/%3E%3Ccircle cx='17' cy='9' r='2.5'/%3E%3Cpath d='M3 21v-1a4 4 0 014-4h4a4 4 0 014 4v1M14 21v-1a3 3 0 013-3h2' stroke-linecap='round'/%3E%3C/svg%3E");
}

.p-buy-feature__title {
  display: block;
  font-size: 15px;
  font-weight: 700;
  color: #222;
  margin-bottom: 10px;
  line-height: 1.45;
}

.p-buy-feature__text {
  margin: 0;
  font-size: 15px;
  line-height: 1.75;
  color: #444;
  text-align: left;
}

/* ========== フロー ========== */
.p-buy-flow {
  position: relative;
  padding-bottom: 24px;
}

.p-buy-flow__heading {
  text-align: center;
  font-size: clamp(20px, 3vw, 26px);
  font-weight: 700;
  color: #111;
  margin: 0 0 36px;
  position: relative;
  z-index: 1;
}

.p-buy-flow__grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 28px 20px;
  position: relative;
  z-index: 1;
}

.p-buy-flow__step {
  border: 1px solid #dcdcdc;
  border-radius: 8px;
  padding: 18px 16px 20px;
  box-sizing: border-box;
  background: #fff;
}

.p-buy-flow__step-head {
  display: flex;
  align-items: flex-start;
  gap: 12px;
  margin-bottom: 10px;
}

.p-buy-flow__step-num {
  flex-shrink: 0;
  width: 36px;
  height: 36px;
  border-radius: 50%;
  background: var(--buy-accent);
  color: #fff;
  font-size: 15px;
  font-weight: 700;
  display: flex;
  align-items: center;
  justify-content: center;
  line-height: 1;
}

.p-buy-flow__step-title {
  margin: 0;
  font-size: 15px;
  font-weight: 700;
  color: #222;
  line-height: 1.4;
  padding-top: 4px;
}

.p-buy-flow__step-text {
  margin: 0;
  padding-left: 48px;
  font-size: 15px;
  line-height: 1.8;
  color: #444;
}

/* ========== フッター（会社概要と同様） ========== */
.page-buy .l-footer {
  background: #fff !important;
  padding: 0;
}

.page-buy .l-footer .l-inner {
  padding: 0;
  max-width: none;
}

.page-buy .l-footer .p-footer-banner,
.page-buy .l-footer .p-footer-main {
  display: none !important;
}

.page-buy .p-footer-copyright {
  width: 100vw;
  margin-left: calc(50% - 50vw);
  margin-right: calc(50% - 50vw);
  background: var(--buy-bar-bg) !important;
  color: #fff;
  border-top: 3px solid #007bff;
  border-bottom: 3px solid #007bff;
  padding: 16px 20px;
  text-align: center;
  box-sizing: border-box;
}

.page-buy .p-footer-copyright p {
  font-size: 15px;
  color: #fff;
  padding: 0;
  margin: 0;
}

/* ========== レスポンシブ ========== */
@media (max-width: 990px) {
  .page-buy .p-buy-hero {
    width: 100%;
    height: 280px;
  }

  .page-buy .p-buy-hero__bg {
    width: 100%;
    height: 280px;
  }

  .page-buy .p-buy-hero-panel {
    top: 50%;
    transform: translateY(-50%);
    width: min(308px, 85%);
  }

  .p-buy-features__grid {
    grid-template-columns: repeat(2, 1fr);
  }

  .p-buy-flow__grid {
    grid-template-columns: repeat(2, 1fr);
  }

  .p-buy-flow__step-text {
    padding-left: 0;
  }
}

@media (max-width: 767px) {
  .p-buy-blob--left,
  .p-buy-blob--right {
    width: 78vw;
    height: 78vw;
    max-height: 260px;
    opacity: 0.22;
  }

  .p-buy-features__grid {
    grid-template-columns: 1fr;
  }

  .p-buy-flow__grid {
    grid-template-columns: 1fr;
  }

  .p-buy-body {
    padding-left: 16px;
    padding-right: 16px;
  }
}