/* ■ 商品詳細専用 */

/* ◆ ファーストビュー */
.detail-hero{padding:32px var(--space-x) 0;background:linear-gradient(180deg,#f8f5ef,var(--paper))}
.detail-hero__inner{display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);gap:56px;align-items:center;max-width:1180px;margin:0 auto;padding:36px 0 56px}
.detail-hero h1{margin:0 0 6px;font:500 64px/1.2 var(--font-display);letter-spacing:.06em}
.detail-hero__reading{margin:0 0 14px;color:var(--muted);font-size:var(--fs-md);letter-spacing:.12em}
.detail-hero__tagline{margin:0 0 18px;font:500 var(--fs-h3-m)/1.7 var(--font-display)}
.detail-hero__description{margin:0 0 22px;color:var(--ink-soft);font-size:var(--fs-md);line-height:1.95}
.detail-hero__price{margin:0 0 4px;font-size:var(--fs-lg)}
.detail-hero__price strong{margin:0 4px;font:500 40px/1.3 var(--font-display)}
.detail-hero__price small{color:var(--muted);font-size:var(--fs-sm)}
.detail-hero__total{margin:0 0 24px;color:var(--muted);font-size:var(--fs-sm)}
.detail-actions{display:flex;flex-wrap:wrap;gap:12px;margin-bottom:18px}
.detail-demo-link{margin:0}
.detail-hero .devices{height:480px}

/* ◆ できること・おすすめ */
.recommend-grid--four{grid-template-columns:repeat(4,minmax(0,1fr))}
.recommend-grid--four img{height:190px}
.recommend-grid--four h3{font-size:var(--fs-h3-s)}
.recommend-grid--four p br{display:none}
.recommend-grid--four .is-phone img{padding:14px 0;background:var(--cream);object-fit:contain}
.detail-recommend{background:var(--cream)}

/* ◆ デザインプレビュー */
.detail-mosaic{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:var(--gap-grid);max-width:1180px;margin:0 auto}
.detail-mosaic figure{margin:0;overflow:hidden;border:1px solid var(--line);border-radius:6px;background:#fff;box-shadow:0 12px 28px rgba(57,43,27,.09)}
.detail-mosaic img{width:100%;height:100%;object-fit:cover;object-position:top}
.detail-mosaic__hero{grid-column:1/-1;grid-row:1;aspect-ratio:1440/836}
.detail-mosaic__concept,.detail-mosaic__services,.detail-mosaic__reasons{aspect-ratio:3/2}
.detail-mosaic__concept img,.detail-mosaic__services img{object-position:12% top}
.detail-mosaic .detail-mosaic__phone{z-index:1;grid-column:3;grid-row:1;align-self:end;justify-self:end;width:min(170px,50%);margin:0 36px -20px 0;border:4px solid #222;border-radius:16px;background:#222;box-shadow:0 18px 32px rgba(36,31,25,.28)}
.detail-mosaic__phone img{display:block;height:auto;border-radius:12px}

/* ◆ 標準で含まれる内容 */
.included-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;max-width:1180px;margin:0 auto}
.included-grid article{display:flex;align-items:center;gap:20px;padding:22px 24px;border:1px solid var(--line);border-radius:5px;background:linear-gradient(150deg,#fff,#fdfbf7)}
.included-grid .ui-icon{width:40px;height:40px;color:var(--gold-mid)}
.included-grid h3{margin:0 0 4px;font:500 var(--fs-h3-s)/1.6 var(--font-display);text-wrap:balance}
.included-grid p{margin:0;color:var(--muted);font-size:var(--fs-md);line-height:1.8;text-wrap:balance}
.detail-sections{max-width:1180px;margin:44px auto 0;text-align:center}
.detail-sections h3{margin:0 0 18px;font:500 var(--fs-h3-m)/1.6 var(--font-display)}
.detail-sections ul{display:flex;flex-wrap:wrap;justify-content:center;gap:10px;margin:0 0 18px;padding:0;list-style:none}
.detail-sections li{padding:8px 18px;border:1px solid var(--line);border-radius:999px;background:#fff;font-size:var(--fs-md)}
.detail-sections p{margin:0;color:var(--muted);font-size:var(--fs-md)}

/* ◆ 料金・流れ・質問・関連 */
.detail-price{background:#f8f5ef}