/* ==========================================================
   小峰家具 — スマートフォン向けの調整（〜760px）
   ========================================================== */
.mbar { display: none; }
.swipe-hint { display: none; align-items: center; gap: 10px; margin-top: 18px; font-family: var(--latin); font-size: 11px; letter-spacing: .28em; color: var(--mute); text-transform: uppercase; }
.swipe-hint i { width: 40px; height: 1px; background: var(--line); position: relative; overflow: hidden; }
.swipe-hint i::after { content: ""; position: absolute; inset: 0; background: var(--ink); transform: translateX(-100%); animation: swipe 2.4s var(--ease) infinite; }
@keyframes swipe { 60%, 100% { transform: translateX(100%); } }

@media (max-width: 760px) {
  body { font-size: 13.5px; font-weight: 400; line-height: 2; letter-spacing: .04em; }
  .sec { padding: 88px 0; }
  .sec-head { margin-bottom: 34px; gap: 18px; }
  .h-sec { font-size: 23px; letter-spacing: .1em; }
  .label { font-size: 11px; letter-spacing: .28em; }

  /* ---- hero：写真を主役に、コピーは下部に横組み ---- */
  .hero { height: 100svh; min-height: 600px; }
  .hero-copy { justify-content: flex-end; padding: calc(var(--header) + 20px) var(--gutter) 104px; }
  .hero-title { writing-mode: horizontal-tb; height: auto; margin: 0; align-self: stretch; font-size: 30px; line-height: 1.7; letter-spacing: .14em; text-shadow: 0 1px 24px rgba(0,0,0,.35); }
  .hero-title span:nth-child(2) { margin-top: 0; }
  .hero-meta { display: grid; margin-top: 14px; }
  .hero-meta .label { display: none; }
  .hero-meta p { color: rgba(255,255,255,.88); font-size: 12px; }
  .hero-meta p br { display: none; }
  .hero-caption { bottom: 28px; }
  .hero-caption a b { font-size: 12.5px; }
  .hero-caption a span { font-size: 10.5px; }
  .hero-count { font-size: 12px; }
  .hero-count .bar { width: 44px; }
  .hero-visual::after { background: linear-gradient(180deg, rgba(0,0,0,.42) 0%, rgba(0,0,0,0) 20%, rgba(0,0,0,0) 42%, rgba(0,0,0,.74) 100%); }

  /* ---- statement ---- */
  .statement { gap: 14px; }
  .statement-text { font-size: 15.5px; line-height: 2.2; margin-bottom: 40px; }
  .statement .img-b { margin-top: 36%; }
  .statement-foot { grid-template-columns: repeat(3, 1fr); margin-top: 56px; }
  .statement-foot div, .statement-foot div + div { padding: 20px 4px 0; border-bottom: 0; border-left: 0; text-align: center; }
  .statement-foot div + div { border-left: 1px solid var(--line-soft); }
  .statement-foot b { font-size: 32px; }
  .statement-foot span { font-size: 10.5px; line-height: 1.6; }

  /* ---- 商品カード：情報を縦に整理 ---- */
  .card-body { padding-top: 12px; gap: 1px; }
  .card-row { display: contents; }
  .card-no { order: 0; font-size: 11.5px; letter-spacing: .14em; }
  .card-title { order: 1; font-size: 14px; letter-spacing: .08em; line-height: 1.6; }
  .card-dim { order: 2; font-size: 10.5px; letter-spacing: .02em; line-height: 1.6; }
  .card-price { order: 3; font-size: 13px; margin-top: 6px; }
  .card-price.muted { font-size: 10.5px; }
  .card-status { font-size: 9.5px; padding: 3px 8px; }

  /* ---- Selection：横スワイプ ---- */
  .selection { display: flex; overflow-x: auto; scroll-snap-type: x mandatory; gap: 14px; margin: 0 calc(-1 * var(--gutter)); padding: 0 var(--gutter) 6px; scrollbar-width: none; }
  .selection::-webkit-scrollbar { display: none; }
  .selection .card, .selection .card:first-child { flex: 0 0 76%; scroll-snap-align: start; scroll-margin-left: var(--gutter); }
  .selection .card-title, .selection .card:first-child .card-title { font-size: 15px; }
  .selection .card-dim { font-size: 11.5px; }
  .swipe-hint { display: flex; }

  /* ---- material ---- */
  .material-visual img { height: 78vw; }
  .material-body { padding: 72px var(--gutter) 80px; }
  .material h2 { font-size: 23px; margin: 16px 0 20px; }
  .material-lead { margin-bottom: 40px; font-size: 13px; }
  .feature { grid-template-columns: 34px 1fr; gap: 6px 14px; padding: 24px 0; }
  .feature .num { font-size: 19px; }
  .feature h3 { font-size: 15.5px; }
  .feature p { font-size: 12.5px; }

  /* ---- size guide：1行にまとめる ---- */
  .size-row { grid-template-columns: 1fr auto 32px; grid-template-areas: "p s g" "r s g"; gap: 0 14px; padding: 18px 0; }
  .size-row p { display: none; }
  .size-row .people { grid-area: p; font-size: 16px; }
  .size-row .range { grid-area: r; font-size: 16px; }
  .size-row .stock { grid-area: s; grid-column: auto; align-self: center; font-size: 11px; text-align: right; }
  .size-row .stock b { font-size: 20px; }
  .size-row .go { grid-area: g; grid-row: auto; grid-column: auto; width: 32px; height: 32px; align-self: center; }

  /* ---- flow ---- */
  .flow li, .flow li:first-child { grid-template-columns: 50px 1fr; padding: 22px 0; }
  .flow .n { font-size: 30px; }
  .flow h3 { font-size: 15.5px; }
  .flow p { font-size: 12.5px; }

  /* ---- contact band ---- */
  .contact-band .visual { min-height: 56vw; }
  .contact-band .body { padding: 60px var(--gutter) 68px; gap: 22px; }
  .contact-band h2 { font-size: 19px; letter-spacing: .08em; word-break: keep-all; overflow-wrap: anywhere; }
  .contact-band h2 br { display: none; }
  .tel-block { padding: 20px 0; }
  .tel-block a { font-size: 30px; }

  /* ---- 下層ページ見出し ---- */
  .page-head { padding: calc(var(--header) + 34px) 0 30px; }
  .page-head h1 { font-size: 27px; margin-top: 12px; }
  .page-head .wrap > div > div { margin-top: 24px !important; }
  .page-head p { font-size: 12.5px; }

  /* ---- 一覧 ---- */
  .result { margin: 26px 0 22px; }
  .result b { font-size: 26px; }
  .grid { gap: 36px 12px; }

  /* ---- 商品詳細 ---- */
  .item { padding-top: var(--header); }
  .item .crumbs { display: none; }
  .item-info { padding-top: 8px; }
  .item-title { font-size: 23px; margin: 6px 0 12px; }
  .item-price { margin-top: 20px; padding: 20px 0; }
  .item-price b { font-size: 30px; }
  .spec div { grid-template-columns: 6em 1fr; padding: 11px 0; font-size: 12.5px; }
  .item-cta .btn { min-height: 56px; }
  .dim { padding: 18px 14px 12px; }

  /* ---- お問い合わせ ---- */
  .form { gap: 26px; }
  .form .btn { width: 100%; min-width: 0 !important; }
  .contact-side b { font-size: 26px; }

  /* ---- footer ---- */
  .site-footer { padding: 64px 0 calc(96px + env(safe-area-inset-bottom)); }
  .footer-top { gap: 36px 20px; }
  .footer-bottom { margin-top: 48px; flex-direction: column; gap: 6px; }

  /* ---- 下部固定バー ---- */
  .mbar {
    display: grid; grid-template-columns: 1fr 2fr; gap: 8px;
    position: fixed; z-index: 50; left: 0; right: 0; bottom: 0;
    padding: 10px 12px calc(10px + env(safe-area-inset-bottom));
    background: rgba(244,242,237,.94); backdrop-filter: blur(14px); -webkit-backdrop-filter: blur(14px);
    border-top: 1px solid var(--line-soft);
    transform: translateY(110%); transition: transform .5s var(--ease-out);
  }
  .mbar.show { transform: none; }
  .mbar a { height: 48px; display: flex; align-items: center; justify-content: center; gap: 8px; font-size: 12.5px; letter-spacing: .12em; border: 1px solid var(--ink); }
  .mbar a svg { width: 16px; height: 16px; flex: none; }
  .mbar a.fill { background: var(--ink); color: var(--bg); }
  .mbar.three { grid-template-columns: 1fr 1fr 1.5fr; }
  .menu-open .mbar { transform: translateY(110%); }

  /* ---- メニュー ---- */
  .nav a { padding: 18px 0; }
  .nav a .ja { font-size: 18px; }
}