/* Space guide: a quiet text-led interval following the photographic samples. */
.jbh-spaces{--jbh-paper:#f8f7f3;--jbh-ink:#252c28;--jbh-accent:#7c6748;background:var(--jbh-paper);background:color-mix(in srgb,var(--jbh-paper) 94%,var(--jbh-ink));color:var(--jbh-ink);font:400 16px/1.8 "IBM Plex Sans Arabic",Tahoma,sans-serif;direction:rtl;text-align:right;padding-block:88px;box-sizing:border-box}
.jbh-spaces *,.jbh-spaces *::before,.jbh-spaces *::after{box-sizing:border-box}
.jbsp-container{width:min(1440px,100%);margin-inline:auto;padding-inline:52px;display:grid;grid-template-columns:5fr 7fr;gap:72px;align-items:start}
.jbsp-eyebrow{font-size:14px;font-weight:500;color:var(--jbh-accent)}
.jbh-spaces h2{font:500 40px/1.45 "IBM Plex Sans Arabic",Tahoma,sans-serif;letter-spacing:0;color:var(--jbh-ink);margin:12px 0 22px;max-width:460px;text-transform:none}
.jbsp-intro>p{font-size:18px;line-height:1.9;margin:0;color:#555c55;max-width:450px}
.jbsp-prepare{border-inline-start:2px solid #c8bba7;padding-inline-start:20px;margin-top:40px;max-width:410px}
.jbh-spaces .jbsp-prepare h3{font:500 16px/1.7 "IBM Plex Sans Arabic",Tahoma,sans-serif;color:var(--jbh-ink);margin:0 0 8px;letter-spacing:0;text-transform:none}
.jbsp-prepare p{font-size:16px;line-height:1.85;color:#555c55;margin:0}
.jbsp-space{border-top:1px solid #cdd0c5;min-width:0}
.jbsp-space:last-of-type{border-bottom:1px solid #cdd0c5}
.jbsp-space summary{display:flex;align-items:center;justify-content:space-between;gap:24px;cursor:pointer;list-style:none;padding:26px 0;min-height:100px;color:var(--jbh-ink)}
.jbsp-space summary::-webkit-details-marker{display:none}
.jbsp-space summary::marker{content:""}
.jbsp-space summary>span:first-child{min-width:0}
.jbsp-space-title{display:block;font-size:24px;font-weight:500;line-height:1.5;overflow-wrap:anywhere}
.jbsp-space-subtitle{display:block;font-size:16px;line-height:1.75;color:#646b60;margin-top:4px}
.jbsp-toggle{display:grid;place-items:center;width:44px;height:44px;border:1px solid #cdd0c5;flex-shrink:0;transition:background .2s,border-color .2s}
.jbsp-toggle svg{width:20px;height:20px;transition:transform .25s}
.jbsp-space[open] .jbsp-toggle svg{transform:rotate(45deg)}
.jbsp-space summary:hover .jbsp-toggle{background:var(--jbh-paper);border-color:var(--jbh-accent)}
.jbsp-body{padding:0 0 28px 68px}
.jbsp-body>p{font-size:18px;line-height:1.9;color:#555c55;margin:0 0 22px}
.jbh-spaces .jbsp-body h3{font:500 14px/1.8 "IBM Plex Sans Arabic",Tahoma,sans-serif;letter-spacing:0;margin:0 0 10px;color:var(--jbh-accent);text-transform:none}
.jbsp-body ul{list-style:disc;padding:0 20px 0 0;margin:0 0 24px}
.jbsp-body li{font-size:16px;line-height:1.85;padding-inline-start:4px;margin:6px 0;color:var(--jbh-ink)}
.jbsp-body li::marker{color:var(--jbh-accent)}
.jbh-spaces .jbsp-contact{display:inline-flex;align-items:center;justify-content:space-between;gap:24px;min-height:48px;border-bottom:1px solid var(--jbh-accent);padding:10px 0;color:var(--jbh-ink);font-size:16px;font-weight:500;text-decoration:none;box-shadow:none;transition:color .2s}
.jbsp-contact svg{width:20px;height:20px;flex-shrink:0;transition:transform .2s}
.jbh-spaces .jbsp-contact:hover{color:var(--jbh-accent)}.jbsp-contact:hover svg{transform:translate(-2px,-2px)}
.jbsp-note{font-size:14px;line-height:1.8;color:#646b60;margin:22px 0 0}
.jbh-spaces summary:focus-visible,.jbh-spaces a:focus-visible{outline:2px solid var(--jbh-accent);outline-offset:5px}
@media(max-width:1120px){.jbsp-container{padding-inline:28px;gap:40px;grid-template-columns:2fr 3fr}.jbh-spaces h2{font-size:36px}.jbsp-body{padding-left:0}}
@media(max-width:820px){.jbh-spaces{padding-block:64px}.jbsp-container{grid-template-columns:1fr;gap:36px}.jbsp-intro>p{max-width:680px}.jbh-spaces h2{max-width:600px}.jbsp-prepare{max-width:680px;margin-top:24px}.jbsp-body{padding-inline-end:68px}}
@media(max-width:600px){.jbh-spaces{padding-block:52px}.jbsp-container{padding-inline:24px;gap:32px}.jbh-spaces h2{font-size:32px}.jbsp-space-title{font-size:24px}.jbsp-space summary{gap:16px;padding-block:22px}.jbsp-body{padding-inline-end:0}.jbsp-body>p,.jbsp-intro>p{font-size:18px;line-height:1.85}.jbsp-contact{width:100%}}
@media(max-width:380px){.jbsp-container{padding-inline:20px}.jbsp-space summary{gap:12px}.jbsp-space-title{font-size:22px}}
@media(prefers-reduced-motion:reduce){.jbh-spaces *{animation:none!important;transition:none!important}}