/* SOBAN F&B business page — hanji white, meok ink, one earth-brown accent (per 2026-09 plan) */
.soban-page{background:var(--hanji);color:var(--meok)}
.soban-page .eyebrow{color:var(--earth)}
.soban-page h1,.soban-page h2,.soban-page h3{color:var(--meok);text-wrap:balance}

/* hero */
.soban-hero{padding:var(--sp-8) 0 0;border-bottom:1px solid #e3dccf}
.soban-hero-grid{display:grid;grid-template-columns:minmax(0,1.3fr) minmax(0,.7fr);gap:var(--sp-7);align-items:center}
.soban-hero h1{margin:var(--sp-3) 0;font-size:clamp(34px,4.1vw,58px);line-height:1.12;letter-spacing:-.045em;word-break:keep-all}
.soban-head h2,.brand-points h3,.sys-text h3{word-break:keep-all}
.soban-hero p{max-width:640px;margin:0;color:#5f5a52;font-size:17px;line-height:1.85}
.soban-hero .soban-status{display:flex;align-items:center;gap:10px;margin-top:var(--sp-3);font-size:13px;color:var(--meok)}
.soban-status span{width:9px;height:9px;flex:none;border-radius:50%;background:var(--earth);box-shadow:0 0 0 4px #8a5a3b26}
.soban-parts{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:1px;max-width:560px;margin-top:var(--sp-4);background:#d6cbb8;border:1px solid #d6cbb8}
.soban-parts a{display:grid;gap:4px;padding:16px 18px;background:#fffdf8;font-size:16px;font-weight:700;transition:background .2s}
.soban-parts a:hover{background:#f1eadd}
.soban-parts small{font:600 10px "IBM Plex Mono",monospace;letter-spacing:.1em;color:var(--earth)}
.soban-hero-logo{display:grid;place-items:center;aspect-ratio:1;max-width:100%;background:#fffdf8;border:1px solid #e3dccf}
.soban-hero-logo img{width:70%;height:auto}
.soban-facts{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));margin-top:var(--sp-7);border-top:1px solid #d6cbb8}
.soban-facts div{padding:var(--sp-3) var(--sp-2);border-right:1px solid #e3dccf}
.soban-facts div:last-child{border-right:0}
.soban-facts b{display:block;font:600 10px "IBM Plex Mono",monospace;letter-spacing:.08em;color:var(--earth)}
.soban-facts span{display:block;margin-top:var(--sp-1);font-size:14px}

/* section heads */
.soban-section{padding:var(--section-y) 0;border-bottom:1px solid #e3dccf;scroll-margin-top:var(--header-h)}
.soban-head{display:grid;gap:var(--sp-2);align-content:start}
.soban-head.wide{grid-template-columns:minmax(0,1fr) minmax(0,1fr);column-gap:var(--sp-6);margin-bottom:var(--content-gap);padding-top:var(--sp-3);border-top:2px solid var(--meok)}
.soban-head.wide .eyebrow{grid-column:1/-1}
.soban-head h2{margin:0;font-size:clamp(32px,3.6vw,50px);line-height:1.12;letter-spacing:-.045em}
.soban-head p{margin:0;max-width:600px;color:#5f5a52;line-height:1.85}

/* figures cropped from the plan */
.soban-fig{margin:0}
.soban-fig img{display:block;width:100%;height:auto;border:1px solid #e3dccf;background:#fff;box-shadow:0 18px 40px -28px #3b2a1a55}
.soban-fig figcaption{margin-top:12px;font-size:13px;line-height:1.6;color:#7a7368}

/* 01 brand */
.brand-figs{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--sp-5)}
.brand-points{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));margin-top:var(--sp-6);border-top:1px solid var(--meok)}
.brand-points article{padding:var(--sp-3) var(--sp-3) 0 0}
.brand-points article+article{padding-left:var(--sp-3);border-left:1px solid #e3dccf}
.brand-points h3{margin:0 0 var(--sp-1);font-size:19px}
.brand-points p{margin:0;font-size:14px;line-height:1.8;color:#5f5a52}

/* 02 system */
.system-section{background:#efe9dd}
.sys-row{display:grid;grid-template-columns:minmax(0,.36fr) minmax(0,1fr);gap:var(--sp-5);align-items:start;padding:var(--sp-5) 0;border-top:1px solid #d6cbb8}
.sys-text{position:sticky;top:calc(var(--header-h) + 24px)}
.sys-text small{font:600 10px "IBM Plex Mono",monospace;letter-spacing:.1em;color:var(--earth)}
.sys-text h3{margin:var(--sp-1) 0;font-size:24px;letter-spacing:-.02em}
.sys-text p{margin:0;font-size:14px;line-height:1.8;color:#5f5a52}
.phones{display:grid;grid-template-columns:repeat(2,minmax(0,260px));gap:var(--sp-4);justify-content:start}
.soban-page .soban-note{margin:var(--sp-2) 0 0;font-size:13px;color:#7a7368}
.benefits{display:grid;grid-template-columns:auto 1fr;gap:var(--sp-4);margin-top:var(--sp-5);padding:var(--sp-4);background:var(--meok);color:#f6f2ea}
.benefits>b{font:600 11px "IBM Plex Mono",monospace;letter-spacing:.08em;color:#d9b89a;white-space:nowrap}
.benefits dl{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:var(--sp-3);margin:0}
.benefits dt{font-weight:700;font-size:15px}
.benefits dd{margin:6px 0 0;font-size:13px;line-height:1.65;color:#cfc6b8}

/* next steps */
.soban-steps{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));list-style:none;margin:0;padding:0;border-top:1px solid #d6cbb8}
.soban-steps li{padding:var(--sp-3) var(--sp-3) var(--sp-3) 0;border-right:1px solid #e3dccf}
.soban-steps li+li{padding-left:var(--sp-3)}
.soban-steps li:last-child{border-right:0}
.soban-steps small{font:600 10px "IBM Plex Mono",monospace;letter-spacing:.08em;color:#9b9388}
.soban-steps .now small{color:var(--earth)}
.soban-steps .now{box-shadow:inset 0 3px 0 var(--earth)}
.soban-steps h3{margin:var(--sp-4) 0 var(--sp-1);font-size:19px}
.soban-steps p{margin:0;font-size:13px;line-height:1.7;color:#5f5a52}
.soban-page .contact-band{background:#ece5d8}

@media(max-width:1050px){
  .benefits{grid-template-columns:1fr}
  .benefits dl{grid-template-columns:repeat(3,minmax(0,1fr))}
  .soban-steps{grid-template-columns:repeat(2,minmax(0,1fr))}
  .soban-steps li:nth-child(2){border-right:0}
  .soban-steps li:nth-child(3){padding-left:0}
}
@media(max-width:800px){
  .soban-hero{padding-top:var(--sp-7)}
  .soban-hero-grid,.soban-head.wide,.sys-row{grid-template-columns:1fr;gap:var(--sp-3)}
  .soban-hero-logo{aspect-ratio:auto;padding:var(--sp-5) 0}
  .soban-hero-logo img{width:220px}
  .soban-facts{grid-template-columns:1fr 1fr}
  .soban-facts div:nth-child(2){border-right:0}
  .brand-figs,.brand-points{grid-template-columns:1fr}
  .brand-points article+article{padding-left:0;border-left:0;border-top:1px solid #e3dccf}
  .sys-text{position:static}
  .benefits dl{grid-template-columns:1fr 1fr}
}
@media(max-width:560px){
  .soban-parts{grid-template-columns:1fr}
  .phones{grid-template-columns:1fr 1fr;gap:var(--sp-2)}
  .soban-steps{grid-template-columns:1fr}
  .soban-steps li,.soban-steps li+li{padding-left:0;border-right:0;border-bottom:1px solid #e3dccf}
  .benefits dl{grid-template-columns:1fr}
}
