/*
 * Public-site visual system: a restrained editorial palette.
 * The page-level layouts remain intact; this file deliberately owns shared
 * color, surface, focus, and button treatment across every public route.
 */
:root{
  --ink:#211923!important;
  --muted:#706873!important;
  --green:#991657!important;
  --green-dark:#5b0c34!important;
  --purple:#991657!important;
  --purple-dark:#5b0c34!important;
  --mint:#f2dce7!important;
  --pink:#d8a84d!important;
  --gold:#b98535!important;
  --paper:#f8f1f5!important;
  --line:#e9dfe4!important;
  --white:#fff!important;
  --bj-ink:#211923!important;
  --bj-muted:#706873!important;
  --bj-purple:#991657!important;
  --bj-purple-dark:#5b0c34!important;
  --bj-line:#e9dfe4!important;
}

html{background:#fffafd}
body{background:#fffafd!important;color:#211923!important}
::selection{background:#f2dce7;color:#211923}

/* Shared navigation: clear hierarchy, with the established plum accent. */
.site-header{border-bottom:1px solid transparent}
.site-brand{color:#211923}
.site-nav{color:#211923;font-weight:760}
.site-nav a:after{background:#991657}
.site-pill{border-color:#c9a2b6;background:#fffafd;color:#211923;border-radius:999px;font-weight:760}
.site-pill.primary{background:#211923;border-color:#211923;color:#fff}
.site-pill:hover{border-color:#991657;color:#991657}
.site-pill.primary:hover{background:#5b0c34;border-color:#5b0c34;color:#fff}
.site-brand:focus-visible,.site-nav a:focus-visible,.site-pill:focus-visible,a:focus-visible,button:focus-visible,input:focus-visible,select:focus-visible{outline:3px solid rgba(153,22,87,.24)!important;outline-offset:4px}

/* A single confident action color; supporting surfaces stay quiet. */
.btn,.button,button[type="submit"],input[type="submit"]{background:#211923!important;color:#fff!important;border-color:#211923!important;border-radius:999px!important;box-shadow:none!important}
.btn:hover,.button:hover,button[type="submit"]:hover,input[type="submit"]:hover{background:#5b0c34!important;border-color:#5b0c34!important}
.btn.outline,.button.outline{background:transparent!important;color:#211923!important;border-color:#c9a2b6!important}
.btn.outline:hover,.button.outline:hover{border-color:#991657!important;color:#991657!important}

/* Repeated surfaces used by the homepage, market, detail pages, and intake. */
.hero,.headline,.market-hero{background:#fffafd}
.project-radar,.acceptance-band,.final{background:var(--ink)!important}
.platform-value,.journey,.faq,.content,.content-band,.closing,.form-shell,.join-shell{background:var(--paper)!important}
.why-card,.task-card,.project-card,.route-card,.side-card,.rule-box,.fit-column,.form-card,.register-card,.faq-card{border-color:var(--line)!important;background:#fff}
.radar-list,.work-list{background:var(--line)!important}
.radar-item,.work-item{background:#fff!important}
.radar-item:hover,.route:hover{background:#fcf1f6!important}
.partner-band{background:#f3e4eb!important}
.journey-visual,.workbench{background:#f4e8ee!important}

/* Small indicators retain meaning without making the page look like a dashboard. */
.eyebrow,.section-kicker,.journey-kicker,.route-link,.radar-intro a,.text-link,.rule-label{color:var(--purple)!important}
.eyebrow:before,.section-kicker:before,.journey-kicker:before{background:var(--purple)!important}
.status-dot,.process-step:before{background:#991657!important;box-shadow:0 0 0 5px rgba(153,22,87,.12)!important}
.status-dot.wait{background:#d8a84d!important;box-shadow:0 0 0 5px rgba(216,168,77,.14)!important}
.status-dot.pool{background:#5369a9!important;box-shadow:0 0 0 5px rgba(83,105,169,.12)!important}
.route-no,.journey-number,.step-num{color:var(--purple)!important}
.step-num{border-color:#c9a2b6!important}
.step:hover .step-num{background:var(--purple)!important;color:#fff!important}

/* Forms: quieter inputs, stronger selected and error states. */
input,select,textarea{background:#fffafd!important;border-color:#dfcad5!important;color:var(--ink)!important}
input:focus,select:focus,textarea:focus{border-color:var(--purple)!important;box-shadow:0 0 0 4px rgba(153,22,87,.12)!important}
.form-step.active,.progress-step.active,.step.active{color:var(--purple)!important}

/* Keep readable contrast when legacy page styles used a saturated accent. */
.body p,.body ul,.meta,.note,.side-note,.faq details p,.final p,.acceptance-band>p{color:var(--muted)!important}
.acceptance-band,.final{color:#fff!important}
.acceptance-band h1,.acceptance-band h2,.acceptance-band h3,.final h1,.final h2,.final h3{color:#fff!important}
.acceptance-band>p,.final p{color:#ead6df!important}

@media (max-width:1000px){
  .site-header{border-bottom-color:var(--line)}
}

/*
 * Editorial type and layout layer.
 * Public routes keep their local content structures, while this layer gives
 * them one reading rhythm instead of competing page-by-page font systems.
 */
:root{
  --bj-font-display:"Songti SC","STSong","Source Han Serif SC","Noto Serif SC",serif;
  --bj-font-sans:"PingFang SC","Hiragino Sans GB","Microsoft YaHei","Noto Sans SC",sans-serif;
  --bj-font-latin:"Avenir Next","Helvetica Neue",sans-serif;
  --of-ink:#260d20!important;
  --of-ink-soft:#624655!important;
  --of-muted:#8f7180!important;
  --of-accent:#cf157d!important;
  --of-accent-deep:#8f0a58!important;
  --of-paper:#fffafd!important;
  --of-tint:#f8f1f5!important;
  --of-line:#e4d3dc!important;
  --of-shadow:0 22px 58px rgba(52,18,42,.08)!important;
}

html{font-size:16px}
body,button,input,select,textarea{font-family:var(--bj-font-sans)!important}
body{letter-spacing:0!important}
body p,body li{font-size:inherit;text-wrap:pretty}

/* Existing public pages: serif is reserved for statements and section titles. */
.headline h1,.hero h1,.title-row h2,.section-title,.closing h2,.support h2,.rule-box h2,
.side-body h1,.status-card b,main>h1{
  font-family:var(--bj-font-display)!important;
  font-weight:600!important;
  letter-spacing:-.032em!important;
}
.headline h1,.hero h1{line-height:1.12!important}
.body p,.body ul,.content p,.content li,.hero p,.meta,.note,.side-note,.qa p,.qa ul{
  font-family:var(--bj-font-sans)!important;
  letter-spacing:0!important;
}
.body p,.content p,.meta,.qa p,.qa ul{line-height:1.78!important}
.site-header{height:78px}
.site-brand strong,.site-nav,.site-pill,.btn,.button{font-family:var(--bj-font-sans)!important}
.site-brand strong{letter-spacing:-.025em}
.site-nav{font-size:14px!important;font-weight:760!important}
.site-pill{min-height:38px!important;font-size:14px!important}
.headline,.hero{border-top-color:#e4d3dc!important}
.status-card,.search-panel,.group,.quick-card,.side-panel,.register-card,.rule-box,.fit-column,
.side-card,.workbench,.acceptance-band,.support{
  border-radius:18px!important;
}
.quick-card,.group,.status-card,.search-panel,.side-panel,.register-card,.rule-box,.fit-column,
.side-card,.workbench{
  box-shadow:none!important;
}
.quick-card:hover{transform:translateY(-3px)!important}
.qa summary{font-family:var(--bj-font-display)!important;font-weight:600!important;letter-spacing:-.018em!important}
.qa summary:after{font-family:var(--bj-font-latin)!important;font-weight:400}
.hero h1,.headline h1{max-width:17em}
.hero p,.headline p{max-width:42em}

/* Shared details and information pages retain their facts, but not the old dense-card feel. */
.content,.content-band,.closing{background:#f8f1f5!important}
.content .body,.content-band .article{max-width:780px}
.content .body h2,.content-band .section-title{margin-top:42px!important}
.body h2,.section-title{font-family:var(--bj-font-display)!important;letter-spacing:-.025em!important}
.bottom-apply .btn,.closing .btn,.support .btn{border-radius:999px!important}

/* Homepage and marketplace */
body.of-page{
  background:#fffafd!important;
  color:#260d20!important;
  font-family:var(--bj-font-sans)!important;
}
.of-page .of-wrap{width:min(1320px,calc(100% - 64px))}
.of-page .of-header{min-height:84px;gap:28px}
.of-page .of-brand{font-family:var(--bj-font-sans)!important;font-size:19px!important;font-weight:820!important;letter-spacing:-.035em!important}
.of-page .of-brand img{width:34px!important;height:34px!important}
.of-page .of-nav{gap:28px!important;color:#624655!important;font-family:var(--bj-font-sans)!important;font-size:14px!important;font-weight:720!important}
.of-page .of-pill{border-color:#d4b5c4!important;border-radius:999px!important;font-family:var(--bj-font-sans)!important}
.of-page .of-pill.primary{background:#260d20!important;border-color:#260d20!important}
.of-page .of-display,
.of-page .of-editorial-head h2,
.of-page .of-paths-intro h2,
.of-page .of-project-preview-head h2,
.of-page .of-rules-head h2,
.of-page .of-market-list-head h2{
  font-family:var(--bj-font-display)!important;
  font-weight:600!important;
  letter-spacing:-.045em!important;
}
.of-page .of-display{line-height:1.1!important}
.of-page .of-display em,
.of-page .of-editorial-head h2 em,
.of-page .of-project-preview-head h2 em,
.of-page .of-rules-head h2 em{color:#cf157d!important}
.of-page .of-eyebrow{
  color:#cf157d!important;
  font-family:var(--bj-font-sans)!important;
  font-size:12px!important;
  font-weight:820!important;
  letter-spacing:.12em!important;
}
.of-page .of-lead,.of-page .of-editorial-side p,.of-page .of-project-preview-side>p,
.of-page .of-paths-intro>p:last-child,.of-page .of-rules-head>p{
  color:#624655!important;
  font-size:17px!important;
  line-height:1.8!important;
}
.of-page .of-button{
  border-color:#d4b5c4!important;
  border-radius:999px!important;
  background:transparent!important;
  color:#260d20!important;
  font-family:var(--bj-font-sans)!important;
  font-size:14px!important;
  font-weight:780!important;
}
.of-page .of-button.primary,.of-page .of-hero-actions .of-button:first-child{
  background:#260d20!important;
  border-color:#260d20!important;
  color:#fff!important;
}
.of-page .of-domain-section{background:#f8f1f5!important}
.of-page .of-domain-card{
  border-color:#e4d3dc!important;
  border-radius:23px!important;
  box-shadow:none!important;
}
.of-page .of-domain-card:hover{
  border-color:#cfa9ba!important;
  box-shadow:0 18px 42px rgba(52,18,42,.08)!important;
}
.of-page .of-domain-mark{background:#8f0a58!important;border-radius:15px!important}
.of-page .of-domain-card--more{background:#f2e5eb!important;border-color:#d6b8c5!important}
.of-page .of-domain-card--more .of-domain-mark{background:#fff!important}
.of-page .of-domain-card h3{
  font-family:var(--bj-font-display)!important;
  font-weight:600!important;
  letter-spacing:-.04em!important;
}

/* The flow is intentionally one heading row plus an oversized 2:3 visual and readable cards. */
.of-page .of-paths{background:#260d20!important}
.of-page .of-paths-layout{
  grid-template-columns:minmax(0,.83fr) minmax(0,1fr)!important;
  gap:clamp(36px,6vw,92px)!important;
  padding:clamp(90px,10vw,140px) 0!important;
}
.of-page .of-paths-intro{
  position:static!important;
  grid-column:1/-1!important;
  display:grid!important;
  grid-template-columns:minmax(0,1.1fr) minmax(280px,.64fr)!important;
  gap:clamp(42px,10vw,168px)!important;
  padding:0 0 8px!important;
  align-items:end!important;
}
.of-page .of-paths-intro .of-eyebrow,.of-page .of-paths-intro h2{grid-column:1!important}
.of-page .of-paths-intro>p:last-child{
  grid-column:2!important;
  grid-row:1/3!important;
  max-width:390px!important;
  margin:0!important;
  color:#e8cfda!important;
}
.of-page .of-paths-intro h2{color:#fff!important;font-size:clamp(49px,5.2vw,76px)!important;line-height:1.08!important}
.of-page .of-paths-intro h2 em{color:#f3a3c9!important}
.of-page .of-paths .of-eyebrow{color:#f3a3c9!important}
.of-page .of-path-visual-stack{
  top:96px!important;
  aspect-ratio:2/3!important;
  border-radius:22px!important;
  background:#4f1a38!important;
  box-shadow:0 30px 72px rgba(0,0,0,.22)!important;
}
.of-page .of-path-visual:after{background:linear-gradient(180deg,rgba(38,13,32,.12),transparent 34%,rgba(38,13,32,.16))!important}
.of-page .of-path-visual span{
  top:26px!important;
  left:27px!important;
  font-family:var(--bj-font-latin)!important;
  font-size:48px!important;
  font-weight:400!important;
  letter-spacing:0!important;
}
.of-page .of-path-cards{gap:28px!important}
.of-page .of-path-card{
  min-height:0!important;
  padding:clamp(30px,3.2vw,46px)!important;
  border:1px solid rgba(255,255,255,.16)!important;
  border-radius:22px!important;
  background:rgba(255,255,255,.035)!important;
  color:#f7eef3!important;
  box-shadow:none!important;
  transform:none!important;
}
.of-page .of-path-card:not(.is-active){opacity:.48!important}
.of-page .of-path-card.is-active{
  border-color:#fff!important;
  background:#fffafd!important;
  color:#260d20!important;
  box-shadow:0 24px 54px rgba(0,0,0,.16)!important;
}
.of-page .of-path-line{gap:14px!important;color:inherit!important}
.of-page .of-path-line span{color:#f3a3c9!important;font-family:var(--bj-font-latin)!important;font-size:14px!important}
.of-page .of-path-card.is-active .of-path-line span{color:#cf157d!important}
.of-page .of-path-line i{width:62px!important;background:#f3a3c9!important}
.of-page .of-path-card.is-active .of-path-line i{background:#cf157d!important}
.of-page .of-path-card h3{
  margin-top:31px!important;
  color:inherit!important;
  font-family:var(--bj-font-display)!important;
  font-size:clamp(49px,4.65vw,67px)!important;
  font-weight:600!important;
  line-height:1.04!important;
  letter-spacing:-.055em!important;
}
.of-page .of-path-quote{
  margin-top:25px!important;
  color:inherit!important;
  font-size:20px!important;
  font-weight:500!important;
  line-height:1.55!important;
  letter-spacing:-.02em!important;
}
.of-page .of-path-card>p:last-of-type{
  margin-top:16px!important;
  color:inherit!important;
  font-size:15px!important;
  line-height:1.78!important;
  opacity:.74!important;
}
.of-page .of-path-card a{margin-top:24px!important;color:inherit!important;font-size:14px!important}

/* Project cards are data cards first. Any later featured entry can scroll into this same track. */
.of-page .of-project-preview{background:#fffafd!important}
.of-page .of-project-preview-head{
  grid-template-columns:minmax(0,1.15fr) minmax(330px,.58fr)!important;
  gap:clamp(44px,9vw,154px)!important;
  margin-bottom:30px!important;
}
.of-page .of-project-preview-head h2{font-size:clamp(49px,5vw,76px)!important;line-height:1.1!important}
.of-page .of-project-preview-meta{display:flex;align-items:end;justify-content:space-between;gap:24px;margin-top:28px}
.of-page .of-project-summary{gap:34px!important;margin:0!important}
.of-page .of-project-summary dt,.of-page .of-market-stats dt{
  font-family:var(--bj-font-latin)!important;
  color:#260d20!important;
  font-weight:400!important;
}
.of-page .of-project-summary dd{color:#8f7180!important;font-size:12px!important;font-weight:760!important}
.of-page .of-all-projects{
  padding-bottom:7px;
  border-bottom:1px solid currentColor;
  color:#260d20;
  font-family:var(--bj-font-sans);
  font-size:14px;
  font-weight:780;
  white-space:nowrap;
}
.of-page .of-project-controls{display:flex;justify-content:flex-end;gap:10px;margin:0 0 20px}
.of-page .of-project-controls .of-carousel-button{width:48px!important;height:48px!important;border-radius:14px!important}
.of-page .of-project-viewport{overflow:hidden}
.of-page .of-project-grid{
  grid-template-columns:none!important;
  grid-auto-columns:calc((100% - 44px)/3)!important;
  grid-auto-flow:column!important;
  gap:22px!important;
  overflow-x:auto!important;
  overscroll-behavior-inline:contain!important;
  padding:0 0 12px!important;
  scroll-behavior:smooth!important;
  scroll-snap-type:inline mandatory!important;
  scrollbar-width:none!important;
}
.of-page .of-project-grid::-webkit-scrollbar{display:none}
.of-page .of-project{
  min-height:382px!important;
  padding:30px!important;
  border-color:#e4d3dc!important;
  border-radius:20px!important;
  box-shadow:none!important;
  scroll-snap-align:start!important;
}
.of-page .of-project:hover{border-color:#cfa9ba!important;box-shadow:0 18px 42px rgba(52,18,42,.08)!important}
.of-page .of-tag{border-color:#e4d3dc!important;color:#624655!important}
.of-page .of-project h3,.of-page .of-market-card h3{
  font-family:var(--bj-font-display)!important;
  font-weight:600!important;
  letter-spacing:-.035em!important;
}
.of-page .of-project h3{margin-top:29px!important;font-size:clamp(29px,2.4vw,39px)!important;line-height:1.2!important}
.of-page .of-project p,.of-page .of-market-card p{color:#624655!important;font-size:15px!important;line-height:1.75!important}
.of-page .of-project-meta,.of-page .of-card-terms{border-top-color:#eedfe6!important;color:#8f7180!important}
.of-page .of-project a,.of-page .of-market-card a{color:#cf157d!important}
.of-page .of-project-discovery,.of-page .of-market-join{
  border-style:solid!important;
  border-color:#dabdc9!important;
  border-radius:20px!important;
  background:#f7edf2!important;
}
.of-page .of-project-discovery-mark,.of-page .of-market-join-mark{border-radius:14px!important}

/* Rules behave like a reading surface, not another pile of cards. */
.of-page .of-rules{background:#f8f1f5!important}
.of-page .of-rules-head{
  display:grid;
  grid-template-columns:minmax(0,1.1fr) minmax(300px,.58fr);
  gap:clamp(42px,10vw,160px);
  align-items:end;
  margin-bottom:48px;
}
.of-page .of-rules-head h2{margin:0;color:#260d20;font-size:clamp(48px,5vw,74px);line-height:1.1}
.of-page .of-rule-layout{display:grid;grid-template-columns:minmax(240px,.45fr) minmax(0,1fr);gap:clamp(44px,8vw,120px);align-items:start}
.of-page .of-rule-note{position:sticky;top:96px;padding:26px 0;border-top:2px solid #cf157d}
.of-page .of-rule-note span{color:#cf157d;font-family:var(--bj-font-latin);font-size:12px;font-weight:700;letter-spacing:.14em}
.of-page .of-rule-note p{margin:20px 0 0;color:#624655;font-size:16px;line-height:1.78}
.of-page .of-rule-note a{display:inline-block;margin-top:24px;padding-bottom:7px;border-bottom:1px solid currentColor;font-size:14px;font-weight:780}
.of-page .of-rules .of-faq{border-top:1px solid #e0ced7}
.of-page .of-rules .of-faq details{border-bottom:1px solid #e0ced7;background:transparent!important}
.of-page .of-rules .of-faq summary{
  position:relative;
  padding:25px 52px 25px 0!important;
  color:#260d20!important;
  font-family:var(--bj-font-display)!important;
  font-size:clamp(22px,2.2vw,30px)!important;
  font-weight:600!important;
  letter-spacing:-.025em!important;
  line-height:1.35!important;
}
.of-page .of-rules .of-faq summary:after{
  position:absolute;
  top:50%;
  right:2px;
  width:32px;
  height:32px;
  transform:translateY(-50%);
  border:1px solid #d4b5c4;
  border-radius:50%;
  color:#cf157d;
  content:"+";
  display:grid;
  place-items:center;
  font-family:var(--bj-font-latin);
  font-size:24px;
  font-weight:400;
}
.of-page .of-rules .of-faq details[open] summary:after{content:"−";background:#cf157d;color:#fff}
.of-page .of-rules .of-faq p{max-width:650px;margin:0 54px 24px 0!important;color:#624655!important;font-size:16px!important;line-height:1.78!important}

.of-page .of-closing{padding:clamp(84px,10vw,140px) 0!important;background:#260d20!important}
.of-page .of-closing .of-eyebrow{color:#f3a3c9!important}
.of-page .of-closing h2{
  max-width:830px!important;
  margin:16px 0 0!important;
  color:#fff!important;
  font-family:var(--bj-font-display)!important;
  font-size:clamp(50px,5.5vw,82px)!important;
  font-weight:600!important;
  line-height:1.08!important;
  letter-spacing:-.045em!important;
}
.of-page .of-closing p:not(.of-eyebrow){max-width:610px!important;margin:25px 0 0!important;color:#e6cbd7!important;font-size:17px!important;line-height:1.78!important}
.of-page .of-closing-actions{display:flex;flex-wrap:wrap;gap:12px;margin-top:34px}
.of-page .of-closing .of-button{border-color:rgba(255,255,255,.54)!important;color:#fff!important}
.of-page .of-closing .of-button.primary{background:#f3a3c9!important;border-color:#f3a3c9!important;color:#260d20!important}
.of-page .of-footer{padding-top:36px!important;padding-bottom:42px!important;color:#8f7180!important}

/* Marketplace hierarchy stays compatible with existing filtering and URL state. */
.of-page .of-market-hero--editorial{padding:96px 0 78px!important}
.of-page .of-market-hero--editorial .of-display{font-size:clamp(55px,5.4vw,82px)!important}
.of-page .of-market-list-head h2{font-size:clamp(39px,4.3vw,61px)!important;line-height:1.1!important}
.of-page .of-filter-band{border-color:#e4d3dc!important;background:rgba(255,250,253,.94)!important}
.of-page .of-search,.of-page .of-filter{border-color:#ead9e1!important;border-radius:999px!important}
.of-page .of-filter:hover,.of-page .of-filter[aria-pressed="true"]{border-color:#260d20!important;background:#260d20!important}
.of-page .of-filter--status[aria-pressed="true"]{border-color:#cf157d!important;background:#cf157d!important}
.of-page .of-market-card{border-color:#e4d3dc!important;border-radius:20px!important;box-shadow:none!important}
.of-page .of-market-card:hover{border-color:#cfa9ba!important;box-shadow:0 18px 42px rgba(52,18,42,.08)!important}

@media(max-width:900px){
  .of-page .of-wrap{width:calc(100% - 40px)}
  .of-page .of-paths-layout{grid-template-columns:1fr!important}
  .of-page .of-paths-intro{display:block!important}
  .of-page .of-paths-intro>p:last-child{max-width:640px!important;margin-top:22px!important}
  .of-page .of-path-visual-stack{position:relative!important;top:auto!important;width:min(520px,100%)!important;margin:0 auto!important}
  .of-page .of-path-card:not(.is-active){opacity:.58!important}
  .of-page .of-project-preview-head,.of-page .of-rules-head{grid-template-columns:1fr!important;gap:24px!important}
  .of-page .of-rule-layout{grid-template-columns:1fr!important;gap:32px!important}
  .of-page .of-rule-note{position:static!important}
}
@media(max-width:620px){
  .site-header{height:66px}
  .of-page .of-wrap{width:calc(100% - 32px)}
  .of-page .of-header{min-height:68px}
  .of-page .of-display{font-size:46px!important;line-height:1.14!important}
  .of-page .of-editorial-head h2,.of-page .of-project-preview-head h2,.of-page .of-rules-head h2{font-size:44px!important}
  .of-page .of-paths-layout{padding:74px 0!important}
  .of-page .of-paths-intro h2{font-size:46px!important}
  .of-page .of-paths-intro>p:last-child{font-size:16px!important}
  .of-page .of-path-visual-stack{height:auto!important;border-radius:18px!important}
  .of-page .of-path-card{padding:30px!important;border-radius:18px!important}
  .of-page .of-path-card h3{margin-top:28px!important;font-size:51px!important}
  .of-page .of-path-quote{font-size:19px!important}
  .of-page .of-project-preview-meta{align-items:flex-start;flex-direction:column}
  .of-page .of-project-controls{justify-content:flex-start}
  .of-page .of-project-grid{grid-auto-columns:minmax(272px,84%)!important}
  .of-page .of-project{padding:27px!important;border-radius:18px!important}
  .of-page .of-project h3{font-size:31px!important}
  .of-page .of-rules .of-faq summary{padding:22px 45px 22px 0!important;font-size:23px!important}
  .of-page .of-rules .of-faq p{margin-right:0!important;font-size:15px!important}
  .of-page .of-closing h2{font-size:48px!important}
  .of-page .of-closing-actions{display:grid;grid-template-columns:1fr}
  .of-page .of-closing .of-button{justify-content:center}
}
@media(prefers-reduced-motion:reduce){
  .of-page .of-project-grid{scroll-behavior:auto!important}
}

/*
 * Homepage reference refinements:
 * Keep the established plum palette, while giving the four long-form sections
 * a quieter editorial rhythm and aligning repeatable project actions.
 */
.of-page .of-paths{
  background:#fffafd!important;
  color:#260d20!important;
}
.of-page .of-paths-layout{
  grid-template-columns:minmax(320px,.7fr) minmax(0,1fr)!important;
  align-items:start!important;
  gap:clamp(56px,10vw,172px)!important;
  padding:clamp(106px,11vw,166px) 0!important;
}
.of-page .of-paths-intro{
  display:block!important;
  grid-column:1/-1!important;
  padding:0!important;
}
.of-page .of-paths-intro .of-eyebrow,
.of-page .of-paths .of-eyebrow{
  color:#cf157d!important;
}
.of-page .of-paths-intro h2{
  max-width:900px!important;
  color:#260d20!important;
  font-size:clamp(54px,5.9vw,92px)!important;
  line-height:1.03!important;
}
.of-page .of-paths-intro h2 em{color:#cf157d!important}
.of-page .of-paths-intro>p:last-child{
  max-width:560px!important;
  margin:25px 0 0!important;
  color:#624655!important;
}
.of-page .of-path-visual-stack{
  position:sticky!important;
  top:96px!important;
  grid-column:1!important;
  grid-row:2!important;
  width:100%!important;
  height:min(72vh,710px)!important;
  aspect-ratio:2/3!important;
  border-radius:24px!important;
  background:#ead9e1!important;
  box-shadow:0 24px 58px rgba(52,18,42,.11)!important;
}
.of-page .of-path-visual:after{
  background:linear-gradient(180deg,rgba(38,13,32,.1),transparent 35%,rgba(38,13,32,.14))!important;
}
.of-page .of-path-visual span{
  top:30px!important;
  left:30px!important;
  color:#fff!important;
  font-size:49px!important;
}
.of-page .of-story-visual--wang span{display:none!important}
.of-page .of-path-cards{
  grid-column:2!important;
  grid-row:2!important;
  display:grid!important;
  gap:22px!important;
}
.of-page .of-path-card,
.of-page .of-path-card.is-active,
.of-page .of-path-card:not(.is-active){
  display:flex!important;
  min-height:285px!important;
  flex-direction:column!important;
  padding:clamp(31px,4vw,54px)!important;
  border:1px solid #decdd6!important;
  border-radius:24px!important;
  background:#fff!important;
  color:#260d20!important;
  opacity:1!important;
  box-shadow:none!important;
  transform:none!important;
}
.of-page .of-path-card.is-active{
  border-color:#cfa9ba!important;
  box-shadow:0 21px 48px rgba(52,18,42,.08)!important;
}
.of-page .of-path-card h3{
  max-width:620px!important;
  margin:0!important;
  color:#260d20!important;
  font-family:var(--bj-font-display)!important;
  font-size:clamp(39px,4.25vw,64px)!important;
  font-weight:600!important;
  line-height:1.12!important;
  letter-spacing:-.05em!important;
}
.of-page .of-path-quote{
  max-width:590px!important;
  margin:24px 0 0!important;
  color:#624655!important;
  font-family:var(--bj-font-sans)!important;
  font-size:17px!important;
  font-weight:400!important;
  line-height:1.8!important;
  letter-spacing:0!important;
}
.of-page .of-path-card a{
  align-self:flex-start!important;
  margin-top:auto!important;
  padding:12px 0 6px!important;
  border-bottom:1px solid currentColor!important;
  color:#cf157d!important;
  font-family:var(--bj-font-sans)!important;
  font-size:14px!important;
  font-weight:800!important;
}

.of-page .of-project-preview-head{
  align-items:stretch!important;
  margin-bottom:34px!important;
}
.of-page .of-project-preview-side{
  display:flex!important;
  min-height:294px!important;
  flex-direction:column!important;
  padding-bottom:0!important;
}
.of-page .of-project-preview-side>p{
  max-width:460px!important;
}
.of-page .of-project-preview-meta{
  margin-top:auto!important;
}
.of-page .of-project-controls{
  justify-content:flex-end!important;
  margin:25px 0 0!important;
}
.of-page .of-project-grid{
  align-items:stretch!important;
}
.of-page .of-project{
  min-height:438px!important;
  height:438px!important;
  padding:34px!important;
}
.of-page .of-project-card-main{
  display:flex;
  min-height:0;
  flex-direction:column;
}
.of-page .of-project h3{
  display:-webkit-box;
  min-height:2.4em;
  overflow:hidden;
  -webkit-box-orient:vertical;
  -webkit-line-clamp:2;
}
.of-page .of-project-card-main>p{
  display:-webkit-box;
  min-height:5.25em;
  overflow:hidden;
  -webkit-box-orient:vertical;
  -webkit-line-clamp:3;
}
.of-page .of-project-footer{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:18px;
  margin-top:auto;
  padding-top:22px;
  border-top:1px solid #eedfe6;
}
.of-page .of-project-footer .of-project-meta{
  max-width:58%;
  margin:0!important;
  padding:0!important;
  border:0!important;
}
.of-page .of-project-apply{
  display:inline-flex!important;
  min-width:108px;
  min-height:56px;
  flex:0 0 auto;
  align-items:center;
  justify-content:center;
  padding:0 18px!important;
  border:1px solid #260d20!important;
  border-radius:15px!important;
  background:#260d20!important;
  color:#fff!important;
  font-size:14px!important;
  font-weight:800!important;
  white-space:nowrap;
}
.of-page .of-project-apply:hover{
  border-color:#8f0a58!important;
  background:#8f0a58!important;
  color:#fff!important;
}

.of-page .of-rules{
  padding:clamp(105px,11vw,164px) 0!important;
}
.of-page .of-rules-head{
  align-items:end!important;
  margin-bottom:64px!important;
}
.of-page .of-rules-head>p{
  max-width:470px!important;
  margin:0 0 7px!important;
}
.of-page .of-rule-layout{
  grid-template-columns:minmax(245px,.42fr) minmax(0,1fr)!important;
  gap:clamp(64px,10vw,176px)!important;
}
.of-page .of-rule-note{
  position:static!important;
  padding:31px 0 0!important;
  border-top:2px solid #cf157d!important;
}
.of-page .of-rule-note p{
  max-width:340px!important;
}
.of-page .of-rules .of-faq{
  max-width:820px!important;
  justify-self:end;
}
.of-page .of-rules .of-faq summary{
  padding:28px 58px 28px 0!important;
  font-size:clamp(23px,2.1vw,31px)!important;
  line-height:1.3!important;
}
.of-page .of-rules .of-faq summary:after{
  right:0!important;
  width:36px!important;
  height:36px!important;
  border-color:#d6b8c5!important;
}
.of-page .of-rules .of-faq p{
  max-width:680px!important;
  margin:0 62px 29px 0!important;
}

.of-page .of-closing{
  display:flex!important;
  min-height:575px!important;
  align-items:center!important;
  padding:clamp(104px,11vw,165px) 0!important;
  background:#260d20!important;
}
.of-page .of-closing-inner{
  width:min(1110px,calc(100% - 64px))!important;
  margin:0 auto!important;
}
.of-page .of-closing h2{
  max-width:740px!important;
  font-size:clamp(56px,5.8vw,90px)!important;
}
.of-page .of-closing p:not(.of-eyebrow){
  max-width:570px!important;
  margin-top:27px!important;
}
.of-page .of-closing-actions{
  gap:14px!important;
  margin-top:38px!important;
}
.of-page .of-closing .of-button{
  min-height:56px!important;
  padding-inline:25px!important;
}

@media(max-width:980px){
  .of-page .of-paths-layout{
    grid-template-columns:1fr!important;
    gap:36px!important;
  }
  .of-page .of-paths-intro,
  .of-page .of-path-visual-stack,
  .of-page .of-path-cards{
    grid-column:auto!important;
    grid-row:auto!important;
  }
  .of-page .of-path-visual-stack{
    position:relative!important;
    top:auto!important;
    width:min(480px,100%)!important;
    height:min(128vw,640px)!important;
    margin:0 auto!important;
  }
  .of-page .of-path-cards{gap:18px!important}
  .of-page .of-path-card,
  .of-page .of-path-card.is-active,
  .of-page .of-path-card:not(.is-active){
    min-height:245px!important;
  }
  .of-page .of-project-preview-side{
    min-height:0!important;
  }
  .of-page .of-project-grid{
    grid-auto-columns:calc((100% - 22px)/2)!important;
  }
  .of-page .of-rule-layout{
    grid-template-columns:1fr!important;
    gap:39px!important;
  }
  .of-page .of-rules .of-faq{
    justify-self:stretch;
  }
}

@media(max-width:620px){
  .of-page .of-paths-layout,
  .of-page .of-rules{
    padding-top:82px!important;
    padding-bottom:82px!important;
  }
  .of-page .of-paths-intro h2{
    font-size:48px!important;
  }
  .of-page .of-paths-intro>p:last-child{
    margin-top:20px!important;
  }
  .of-page .of-path-visual-stack{
    height:min(136vw,560px)!important;
    border-radius:18px!important;
  }
  .of-page .of-path-visual span{
    top:23px!important;
    left:23px!important;
    font-size:39px!important;
  }
  .of-page .of-path-card,
  .of-page .of-path-card.is-active,
  .of-page .of-path-card:not(.is-active){
    min-height:232px!important;
    padding:31px 28px!important;
    border-radius:18px!important;
  }
  .of-page .of-path-card h3{
    font-size:39px!important;
  }
  .of-page .of-path-quote{
    margin-top:19px!important;
    font-size:16px!important;
  }
  .of-page .of-project-preview-side{
    gap:0!important;
  }
  .of-page .of-project-preview-meta{
    margin-top:28px!important;
  }
  .of-page .of-project-controls{
    justify-content:flex-start!important;
    margin-top:20px!important;
  }
  .of-page .of-project-grid{
    grid-auto-columns:minmax(274px,86%)!important;
  }
  .of-page .of-project{
    min-height:414px!important;
    height:414px!important;
    padding:28px!important;
  }
  .of-page .of-project h3{
    min-height:0!important;
    font-size:31px!important;
  }
  .of-page .of-project-card-main>p{
    min-height:5.25em!important;
  }
  .of-page .of-project-footer{
    gap:13px!important;
    padding-top:18px!important;
  }
  .of-page .of-project-footer .of-project-meta{
    max-width:55%!important;
    font-size:11px!important;
  }
  .of-page .of-project-apply{
    min-width:95px!important;
    min-height:50px!important;
    padding-inline:13px!important;
    border-radius:13px!important;
    font-size:13px!important;
  }
  .of-page .of-rules-head{
    margin-bottom:43px!important;
  }
  .of-page .of-rules .of-faq summary{
    padding:23px 48px 23px 0!important;
    font-size:23px!important;
  }
  .of-page .of-rules .of-faq summary:after{
    width:32px!important;
    height:32px!important;
    font-size:22px!important;
  }
  .of-page .of-rules .of-faq p{
    margin:0 0 23px!important;
  }
  .of-page .of-closing{
    min-height:490px!important;
    padding:87px 0!important;
  }
  .of-page .of-closing-inner{
    width:calc(100% - 32px)!important;
  }
  .of-page .of-closing h2{
    font-size:52px!important;
  }
}

/*
 * Editorial unification: the homepage sections share one calm reading system.
 * The established plum palette stays intact, but the accent is reserved for
 * emphasis and links instead of becoming every surface.
 */
:root{
  --bj-editorial-paper:#f8f3f5;
  --bj-editorial-card:#fffdfd;
  --bj-editorial-border:#d9c9d1;
  --bj-editorial-icon:#826b7a;
  --bj-editorial-accent:#ad1764;
  --bj-editorial-copy:#705a67;
}
.of-page .of-domain-section,
.of-page .of-project-preview,
.of-page .of-rules{
  background:var(--bj-editorial-paper)!important;
}
.of-page .of-paths{background:#fffafd!important}
.of-page .of-editorial-head h2,
.of-page .of-project-preview-head h2,
.of-page .of-rules-head h2,
.of-page .of-paths-intro h2{
  color:#260d20!important;
  font-weight:600!important;
  line-height:1.06!important;
  letter-spacing:-.052em!important;
}
.of-page .of-editorial-head h2 em,
.of-page .of-project-preview-head h2 em,
.of-page .of-rules-head h2 em,
.of-page .of-paths-intro h2 em{
  color:var(--bj-editorial-accent)!important;
}
.of-page .of-eyebrow{
  color:var(--bj-editorial-accent)!important;
  font-size:12px!important;
  font-weight:800!important;
  letter-spacing:.1em!important;
}
.of-page .of-eyebrow:before{background:var(--bj-editorial-accent)!important}
.of-page .of-editorial-side p,
.of-page .of-project-preview-side>p,
.of-page .of-rules-head>p,
.of-page .of-paths-intro>p:last-child{
  color:var(--bj-editorial-copy)!important;
  font-size:16px!important;
  line-height:1.78!important;
}
.of-page .of-editorial-side a,
.of-page .of-all-projects,
.of-page .of-rule-note a,
.of-page .of-path-card a{
  color:#260d20!important;
  font-size:14px!important;
  font-weight:780!important;
}
.of-page .of-editorial-side a:hover,
.of-page .of-all-projects:hover,
.of-page .of-rule-note a:hover,
.of-page .of-path-card a:hover{color:var(--bj-editorial-accent)!important}
.of-page .of-carousel-button{
  border-color:#e4d6dd!important;
  border-radius:15px!important;
  background:#fffdfd!important;
  color:var(--bj-editorial-icon)!important;
  box-shadow:0 3px 10px rgba(52,18,42,.025)!important;
}
.of-page .of-carousel-button:hover{
  border-color:var(--bj-editorial-icon)!important;
  background:var(--bj-editorial-icon)!important;
  color:#fff!important;
  transform:none!important;
}

/* Ability direction: use the reference's generous header and muted icon cards. */
.of-page .of-domain-section{padding:clamp(100px,10vw,148px) 0 clamp(86px,9vw,128px)!important}
.of-page .of-domain-section>.of-wrap{
  display:grid!important;
  grid-template-columns:minmax(0,1fr)!important;
}
.of-page .of-domain-head{grid-row:1!important}
.of-page .of-domain-viewport{grid-row:2!important}
.of-page .of-domain-controls{
  grid-row:3!important;
  justify-content:center!important;
  margin:42px 0 0!important;
}
.of-page .of-scroll-note{
  grid-row:4!important;
  margin-top:15px!important;
  color:#927987!important;
}
.of-page .of-domain-card{
  min-height:418px!important;
  padding:34px 35px 29px!important;
  border-color:var(--bj-editorial-border)!important;
  border-radius:25px!important;
  background:var(--bj-editorial-card)!important;
  box-shadow:none!important;
}
.of-page .of-domain-card:hover{
  border-color:#bca4b0!important;
  box-shadow:0 18px 40px rgba(52,18,42,.06)!important;
  transform:translateY(-3px)!important;
}
.of-page .of-domain-mark{
  width:58px!important;
  height:58px!important;
  border-radius:14px!important;
  background:var(--bj-editorial-icon)!important;
}
.of-page .of-domain-mark img{width:29px!important;height:29px!important}
.of-page .of-domain-kicker{
  margin-top:31px!important;
  color:#907887!important;
  font-size:11px!important;
  letter-spacing:.07em!important;
}
.of-page .of-domain-card h3{
  margin-top:9px!important;
  color:#260d20!important;
  font-size:clamp(29px,2.15vw,38px)!important;
  font-weight:600!important;
  line-height:1.13!important;
}
.of-page .of-domain-card>p:not(.of-domain-kicker){
  margin-top:18px!important;
  color:var(--bj-editorial-copy)!important;
  font-size:14px!important;
  line-height:1.72!important;
}
.of-page .of-domain-link{
  color:var(--bj-editorial-accent)!important;
  font-size:13px!important;
  font-weight:780!important;
}
.of-page .of-domain-card--more{
  border-style:solid!important;
  background:#f3e9ee!important;
}
.of-page .of-domain-card--more .of-domain-mark{background:#fff!important}

/* The same typography carries through the photo-led collaboration path. */
.of-page .of-paths-layout{padding:clamp(106px,10vw,156px) 0!important}
.of-page .of-paths-intro h2{font-size:clamp(52px,5.45vw,82px)!important}
.of-page .of-path-visual-stack{
  border-radius:25px!important;
  box-shadow:0 18px 46px rgba(52,18,42,.08)!important;
}
.of-page .of-path-card,
.of-page .of-path-card.is-active,
.of-page .of-path-card:not(.is-active){
  border-color:var(--bj-editorial-border)!important;
  border-radius:25px!important;
  background:var(--bj-editorial-card)!important;
  box-shadow:none!important;
}
.of-page .of-path-card.is-active{
  border-color:#bfa8b4!important;
  box-shadow:0 18px 40px rgba(52,18,42,.06)!important;
}
.of-page .of-path-card h3{
  font-size:clamp(37px,3.8vw,56px)!important;
  line-height:1.12!important;
}
.of-page .of-path-quote{
  color:var(--bj-editorial-copy)!important;
  font-size:16px!important;
  line-height:1.76!important;
}

/* Project cards stay action-oriented, but inherit the quieter card system. */
.of-page .of-project-preview{padding:clamp(100px,10vw,148px) 0!important}
.of-page .of-project-preview-side{
  min-height:274px!important;
}
.of-page .of-project-preview-meta{gap:30px!important}
.of-page .of-project-summary dt{
  color:#260d20!important;
  font-size:clamp(47px,3.8vw,59px)!important;
}
.of-page .of-project-summary dd{color:#907887!important}
.of-page .of-project{
  min-height:424px!important;
  height:424px!important;
  padding:32px!important;
  border-color:var(--bj-editorial-border)!important;
  border-radius:25px!important;
  background:var(--bj-editorial-card)!important;
}
.of-page .of-project:hover{
  border-color:#bca4b0!important;
  box-shadow:0 18px 40px rgba(52,18,42,.06)!important;
  transform:translateY(-3px)!important;
}
.of-page .of-tag{
  border-color:#ded0d7!important;
  background:#fff!important;
  color:#7d6472!important;
}
.of-page .of-project h3{
  margin-top:25px!important;
  font-size:clamp(27px,2.12vw,34px)!important;
  line-height:1.2!important;
}
.of-page .of-project p{color:var(--bj-editorial-copy)!important;font-size:14px!important}
.of-page .of-project-footer{border-top-color:#e9dde2!important}
.of-page .of-project-meta{color:#907887!important}
.of-page .of-project-apply{
  min-width:100px!important;
  min-height:52px!important;
  border-radius:13px!important;
  background:#260d20!important;
  border-color:#260d20!important;
}

/* Rules become part of the same editorial canvas rather than a separate UI. */
.of-page .of-rules{padding:clamp(104px,10vw,150px) 0!important}
.of-page .of-rules-head{margin-bottom:60px!important}
.of-page .of-rule-layout{
  grid-template-columns:minmax(250px,.45fr) minmax(0,1fr)!important;
  gap:clamp(66px,9vw,164px)!important;
}
.of-page .of-rule-note{
  padding-top:27px!important;
  border-top:1px solid var(--bj-editorial-accent)!important;
}
.of-page .of-rule-note span{
  color:var(--bj-editorial-accent)!important;
  font-family:var(--bj-font-sans)!important;
  font-size:12px!important;
  font-weight:800!important;
  letter-spacing:.08em!important;
}
.of-page .of-rule-note p{
  color:var(--bj-editorial-copy)!important;
  font-size:15px!important;
  line-height:1.78!important;
}
.of-page .of-rules .of-faq{
  max-width:840px!important;
  border-top-color:var(--bj-editorial-border)!important;
}
.of-page .of-rules .of-faq details{border-bottom-color:var(--bj-editorial-border)!important}
.of-page .of-rules .of-faq summary{
  padding:27px 58px 27px 0!important;
  color:#260d20!important;
  font-size:clamp(23px,2vw,30px)!important;
  font-weight:600!important;
  line-height:1.34!important;
}
.of-page .of-rules .of-faq summary:after{
  width:34px!important;
  height:34px!important;
  border-color:#d8c6cf!important;
  color:var(--bj-editorial-accent)!important;
}
.of-page .of-rules .of-faq details[open] summary:after{
  background:var(--bj-editorial-icon)!important;
  border-color:var(--bj-editorial-icon)!important;
}
.of-page .of-rules .of-faq p{
  color:var(--bj-editorial-copy)!important;
  font-size:15px!important;
  line-height:1.8!important;
}

/* Closing keeps the dark anchor, with the quieter highlight tone above. */
.of-page .of-closing .of-eyebrow{color:#e6a4c7!important}
.of-page .of-closing .of-eyebrow:before{background:#e6a4c7!important}
.of-page .of-closing h2{letter-spacing:-.052em!important}
.of-page .of-closing .of-button.primary{
  background:#e6a4c7!important;
  border-color:#e6a4c7!important;
}

@media(max-width:900px){
  .of-page .of-domain-controls{
    justify-content:flex-start!important;
    margin-top:28px!important;
  }
  .of-page .of-rule-layout{
    grid-template-columns:1fr!important;
    gap:37px!important;
  }
}
@media(max-width:620px){
  .of-page .of-domain-section,
  .of-page .of-project-preview,
  .of-page .of-rules{padding:82px 0!important}
  .of-page .of-domain-card{
    min-height:358px!important;
    padding:29px 28px 25px!important;
    border-radius:19px!important;
  }
  .of-page .of-domain-mark{width:52px!important;height:52px!important}
  .of-page .of-domain-kicker{margin-top:26px!important}
  .of-page .of-domain-card h3{font-size:31px!important}
  .of-page .of-path-card h3{font-size:38px!important}
  .of-page .of-project{
    min-height:402px!important;
    height:402px!important;
    padding:28px!important;
    border-radius:19px!important;
  }
  .of-page .of-project h3{font-size:30px!important}
  .of-page .of-rules-head{margin-bottom:43px!important}
  .of-page .of-rules .of-faq summary{font-size:23px!important}
}

/*
 * Reference-language reset
 * The homepage deliberately uses the same quiet color ratio and interaction
 * rhythm across sections. The green logo remains a distinct brand asset.
 */
:root{
  --bj-ref-paper:#fff;
  --bj-ref-tint:#f5f0f3;
  --bj-ref-ink:#1a0816;
  --bj-ref-copy:#4a2039;
  --bj-ref-muted:#7d6675;
  --bj-ref-line:#e0d4db;
  --bj-ref-accent:#cd128a;
  --bj-ref-coral:#ec8e83;
}
.of-page{
  --of-ink:var(--bj-ref-ink)!important;
  --of-ink-soft:var(--bj-ref-copy)!important;
  --of-muted:var(--bj-ref-muted)!important;
  --of-accent:var(--bj-ref-accent)!important;
  --of-paper:var(--bj-ref-paper)!important;
  --of-tint:var(--bj-ref-tint)!important;
  --of-line:var(--bj-ref-line)!important;
}
html,body.of-page{overflow-x:clip}
body.of-page{background:var(--bj-ref-paper)!important;color:var(--bj-ref-ink)!important}
.of-page .of-wrap{width:min(1440px,calc(100% - 128px))!important}
.of-page .of-header{min-height:71px!important;gap:32px!important}
.of-page .of-brand{font-size:18px!important;font-weight:700!important;letter-spacing:-.02em!important}
.of-page .of-nav{gap:26px!important;color:var(--bj-ref-copy)!important;font-size:14px!important;font-weight:500!important}
.of-page .of-pill{
  min-height:43px!important;
  border-color:var(--bj-ref-copy)!important;
  border-radius:18px!important;
  color:var(--bj-ref-ink)!important;
  font-weight:500!important;
}
.of-page .of-pill.primary{background:var(--bj-ref-ink)!important;border-color:var(--bj-ref-ink)!important;color:#fff!important}
.of-page .of-display,
.of-page .of-editorial-head h2,
.of-page .of-paths-intro h2,
.of-page .of-project-preview-head h2,
.of-page .of-rules-head h2,
.of-page .of-closing h2{
  font-family:var(--bj-font-sans)!important;
  font-weight:500!important;
  letter-spacing:-.014em!important;
}
.of-page .of-display{font-size:clamp(48px,4.75vw,72px)!important;line-height:1.14!important}
.of-page .of-display em,
.of-page .of-editorial-head h2 em,
.of-page .of-paths-intro h2 em,
.of-page .of-project-preview-head h2 em,
.of-page .of-rules-head h2 em{color:var(--bj-ref-accent)!important}
.of-page .of-eyebrow{
  color:var(--bj-ref-copy)!important;
  font-size:11px!important;
  font-weight:600!important;
  letter-spacing:.08em!important;
}
.of-page .of-eyebrow:before{height:1px!important;width:24px!important;background:var(--bj-ref-coral)!important}
.of-page .of-lead,
.of-page .of-editorial-side p,
.of-page .of-project-preview-side>p,
.of-page .of-paths-intro>p:last-child,
.of-page .of-rules-head>p{
  color:var(--bj-ref-copy)!important;
  font-size:16px!important;
  font-weight:400!important;
  line-height:1.72!important;
}
.of-page .of-button{
  min-height:46px!important;
  border-radius:18px!important;
  border-color:var(--bj-ref-ink)!important;
  color:var(--bj-ref-ink)!important;
  font-size:14px!important;
  font-weight:500!important;
}
.of-page .of-button.primary{background:var(--bj-ref-ink)!important;border-color:var(--bj-ref-ink)!important;color:#fff!important}

/* One asymmetric headline grid, repeated throughout the page. */
.of-page .of-editorial-head,
.of-page .of-project-preview-head,
.of-page .of-rules-head{
  grid-template-columns:minmax(0,7fr) minmax(292px,3fr)!important;
  align-items:end!important;
  gap:clamp(56px,10vw,176px)!important;
}
.of-page .of-editorial-head h2,
.of-page .of-project-preview-head h2,
.of-page .of-rules-head h2{
  max-width:760px!important;
  font-size:clamp(46px,4.9vw,70px)!important;
  line-height:1.15!important;
}
.of-page .of-editorial-side,
.of-page .of-project-preview-side{padding:0 0 4px!important}
.of-page .of-editorial-side a,
.of-page .of-all-projects,
.of-page .of-rule-note a,
.of-page .of-path-card a{
  color:var(--bj-ref-ink)!important;
  font-size:14px!important;
  font-weight:600!important;
}

/* Capability rail: spacious content cards and intentional track controls. */
.of-page .of-domain-section{background:var(--bj-ref-paper)!important;padding:clamp(106px,10vw,154px) 0!important}
.of-page .of-domain-section>.of-wrap{display:block!important}
.of-page .of-domain-head{margin-bottom:54px!important}
.of-page .of-domain-viewport{
  margin-inline:calc((min(1440px,calc(100vw - 128px)) - 100vw)/2)!important;
}
.of-page .of-domain-track{
  grid-auto-columns:clamp(310px,25.5vw,380px)!important;
  gap:18px!important;
  padding-inline:max(64px,calc((100vw - min(1440px,calc(100vw - 128px)))/2))!important;
  cursor:grab!important;
}
.of-page .of-domain-track.is-dragging{cursor:grabbing!important;scroll-snap-type:none!important;scroll-behavior:auto!important}
.of-page .of-domain-card{
  min-height:438px!important;
  padding:32px 31px 27px!important;
  border:1px solid var(--bj-ref-line)!important;
  border-radius:16px!important;
  background:var(--bj-ref-paper)!important;
  box-shadow:none!important;
}
.of-page .of-domain-card:hover{
  border-color:#c9b3c0!important;
  box-shadow:0 16px 34px rgba(26,8,22,.06)!important;
  transform:translateY(-3px)!important;
}
.of-page .of-domain-mark{
  width:44px!important;
  height:44px!important;
  border:1px solid var(--bj-ref-line)!important;
  border-radius:50%!important;
  background:transparent!important;
}
.of-page .of-domain-mark img{
  width:23px!important;
  height:23px!important;
  filter:brightness(0) saturate(100%) invert(12%) sepia(16%) saturate(3277%) hue-rotate(263deg) brightness(90%) contrast(105%)!important;
}
.of-page .of-domain-kicker{
  margin-top:28px!important;
  color:var(--bj-ref-muted)!important;
  font-size:11px!important;
  font-weight:500!important;
  letter-spacing:.05em!important;
}
.of-page .of-domain-card h3{
  margin-top:10px!important;
  color:var(--bj-ref-ink)!important;
  font-family:var(--bj-font-sans)!important;
  font-size:clamp(27px,2.05vw,34px)!important;
  font-weight:500!important;
  line-height:1.22!important;
  letter-spacing:-.02em!important;
}
.of-page .of-domain-card>p:not(.of-domain-kicker){
  margin-top:18px!important;
  color:var(--bj-ref-copy)!important;
  font-size:14px!important;
  line-height:1.7!important;
}
.of-page .of-domain-link{
  color:var(--bj-ref-ink)!important;
  font-size:13px!important;
  font-weight:600!important;
}
.of-page .of-domain-card--more{border-style:dashed!important;background:var(--bj-ref-tint)!important}
.of-page .of-domain-card--more .of-domain-mark{background:#fff!important}
.of-page .of-domain-controls{justify-content:flex-start!important;margin:30px 0 0!important}
.of-page .of-carousel-button{
  width:46px!important;
  height:46px!important;
  border:1px solid var(--bj-ref-line)!important;
  border-radius:15px!important;
  background:#fff!important;
  color:var(--bj-ref-ink)!important;
  box-shadow:none!important;
}
.of-page .of-carousel-button:hover:not(:disabled){background:var(--bj-ref-ink)!important;border-color:var(--bj-ref-ink)!important;color:#fff!important;transform:none!important}
.of-page .of-carousel-button:disabled{cursor:not-allowed!important;opacity:.32!important}
.of-page .of-scroll-note{display:none!important}

/* The photo-led path remains the visual pause, with a restrained type system. */
.of-page .of-paths{background:var(--bj-ref-ink)!important}
.of-page .of-paths-layout{padding:clamp(112px,10vw,154px) 0!important}
.of-page .of-paths-intro h2{
  color:#fff!important;
  font-size:clamp(46px,4.8vw,70px)!important;
  line-height:1.14!important;
}
.of-page .of-paths-intro h2 em{color:var(--bj-ref-accent)!important}
.of-page .of-paths-intro>p:last-child{color:#dccbd5!important}
.of-page .of-path-card,.of-page .of-path-card.is-active,.of-page .of-path-card:not(.is-active){
  border-radius:16px!important;
  box-shadow:none!important;
}
.of-page .of-path-card h3{
  font-family:var(--bj-font-sans)!important;
  font-size:clamp(34px,3.1vw,48px)!important;
  font-weight:500!important;
  line-height:1.18!important;
  letter-spacing:-.022em!important;
}
.of-page .of-path-quote{font-size:17px!important;font-weight:400!important;letter-spacing:0!important;line-height:1.72!important}

/* Projects become a readable market on desktop instead of a second rail. */
.of-page .of-project-preview{background:var(--bj-ref-paper)!important;padding:clamp(108px,10vw,154px) 0!important}
.of-page .of-project-preview-head{margin-bottom:54px!important}
.of-page .of-project-preview-side{min-height:0!important}
.of-page .of-project-preview-meta{align-items:flex-end!important;margin-top:27px!important}
.of-page .of-project-summary{gap:30px!important}
.of-page .of-project-summary dt{
  color:var(--bj-ref-ink)!important;
  font-family:var(--bj-font-sans)!important;
  font-size:clamp(40px,3.25vw,54px)!important;
  font-weight:500!important;
  letter-spacing:-.03em!important;
}
.of-page .of-project-summary dd{color:var(--bj-ref-muted)!important;font-size:12px!important;font-weight:500!important}
.of-page .of-project-viewport{overflow:visible!important}
.of-page .of-project-grid{
  grid-template-columns:repeat(3,minmax(0,1fr))!important;
  grid-auto-columns:auto!important;
  grid-auto-flow:row!important;
  gap:18px!important;
  overflow:visible!important;
  padding:0!important;
  scroll-snap-type:none!important;
}
.of-page .of-project{
  min-height:390px!important;
  height:auto!important;
  padding:28px!important;
  border:1px solid var(--bj-ref-line)!important;
  border-radius:16px!important;
  background:#fff!important;
  box-shadow:none!important;
}
.of-page .of-project:hover{border-color:#c9b3c0!important;box-shadow:0 16px 34px rgba(26,8,22,.06)!important;transform:translateY(-3px)!important}
.of-page .of-tag{border-color:var(--bj-ref-line)!important;background:#fff!important;color:var(--bj-ref-copy)!important;font-weight:500!important}
.of-page .of-project h3{
  margin-top:26px!important;
  color:var(--bj-ref-ink)!important;
  font-family:var(--bj-font-sans)!important;
  font-size:clamp(24px,1.85vw,31px)!important;
  font-weight:500!important;
  line-height:1.25!important;
  letter-spacing:-.018em!important;
}
.of-page .of-project p{color:var(--bj-ref-copy)!important;font-size:14px!important;line-height:1.72!important}
.of-page .of-project-footer{border-top-color:var(--bj-ref-line)!important}
.of-page .of-project-meta{color:var(--bj-ref-muted)!important}
.of-page .of-project-apply{
  min-width:0!important;
  min-height:0!important;
  padding:0 0 6px!important;
  border:0!important;
  border-bottom:1px solid currentColor!important;
  border-radius:0!important;
  background:transparent!important;
  color:var(--bj-ref-ink)!important;
  font-size:14px!important;
  font-weight:600!important;
}
.of-page .of-project-discovery{
  border-color:var(--bj-ref-line)!important;
  border-radius:16px!important;
  background:var(--bj-ref-tint)!important;
}
.of-page .of-project-discovery h3{
  font-family:var(--bj-font-sans)!important;
  font-weight:500!important;
  letter-spacing:-.02em!important;
}

/* Rules use the same editorial rail, rather than a separate FAQ component. */
.of-page .of-rules{background:var(--bj-ref-tint)!important;padding:clamp(108px,10vw,154px) 0!important}
.of-page .of-rules-head{margin-bottom:58px!important}
.of-page .of-rule-layout{grid-template-columns:minmax(245px,3fr) minmax(0,7fr)!important;gap:clamp(56px,9vw,152px)!important}
.of-page .of-rule-note{border-top:1px solid var(--bj-ref-coral)!important}
.of-page .of-rule-note span{color:var(--bj-ref-muted)!important;font-weight:600!important}
.of-page .of-rule-note p{color:var(--bj-ref-copy)!important;font-size:15px!important}
.of-page .of-rules .of-faq{max-width:none!important;border-top:1px solid var(--bj-ref-line)!important}
.of-page .of-rules .of-faq details{border-bottom:1px solid var(--bj-ref-line)!important}
.of-page .of-rules .of-faq summary{
  padding:26px 52px 26px 0!important;
  color:var(--bj-ref-ink)!important;
  font-family:var(--bj-font-sans)!important;
  font-size:clamp(20px,1.75vw,27px)!important;
  font-weight:500!important;
  letter-spacing:-.012em!important;
  line-height:1.42!important;
}
.of-page .of-rules .of-faq summary:after{
  width:27px!important;
  height:27px!important;
  border-color:var(--bj-ref-line)!important;
  border-radius:0!important;
  color:var(--bj-ref-ink)!important;
  font-size:20px!important;
}
.of-page .of-rules .of-faq details[open] summary:after{background:var(--bj-ref-ink)!important;border-color:var(--bj-ref-ink)!important;color:#fff!important}
.of-page .of-rules .of-faq p{max-width:680px!important;color:var(--bj-ref-copy)!important;font-size:15px!important;line-height:1.78!important}

.of-page .of-closing{background:var(--bj-ref-ink)!important}
.of-page .of-closing h2{font-size:clamp(46px,4.8vw,70px)!important;line-height:1.15!important}
.of-page .of-closing .of-button.primary{background:#fff!important;border-color:#fff!important;color:var(--bj-ref-ink)!important}
.of-page .of-footer{color:var(--bj-ref-muted)!important}
.of-float-project{
  position:fixed;
  z-index:16;
  right:30px;
  bottom:30px;
  display:flex;
  align-items:center;
  gap:12px;
  padding:8px 8px 8px 17px;
  border:1px solid var(--bj-ref-line);
  border-radius:17px;
  background:rgba(255,255,255,.94);
  box-shadow:0 14px 38px rgba(26,8,22,.14);
  opacity:0;
  pointer-events:none;
  transform:translateY(10px);
  transition:opacity .24s ease,transform .24s ease;
}
.of-float-project.is-visible{opacity:1;pointer-events:auto;transform:translateY(0)}
.of-float-project a{color:var(--bj-ref-ink);font-size:14px;font-weight:600;text-decoration:none}
.of-float-project button{display:grid;width:30px;height:30px;place-items:center;padding:0;border:0;border-radius:10px;background:transparent;color:var(--bj-ref-muted);font:400 22px/1 var(--bj-font-sans);cursor:pointer}
.of-float-project button:hover{background:var(--bj-ref-tint);color:var(--bj-ref-ink)}
.of-page .of-domain-section,
.of-page .of-project-preview,
.of-page .of-rule-layout,
.of-page .of-closing-inner{transition:opacity .45s ease,transform .45s ease}
@media (prefers-reduced-motion:no-preference){
  .of-page .of-domain-section:not(.is-revealed),
  .of-page .of-project-preview:not(.is-revealed),
  .of-page .of-rule-layout:not(.is-revealed),
  .of-page .of-closing-inner:not(.is-revealed){opacity:.01;transform:translateY(22px)}
}
@media(max-width:1024px){
  .of-page .of-wrap{width:calc(100% - 64px)!important}
  .of-page .of-editorial-head,
  .of-page .of-project-preview-head,
  .of-page .of-rules-head{gap:50px!important}
  .of-page .of-domain-viewport{margin-inline:calc((calc(100% - 64px) - 100vw)/2)!important}
  .of-page .of-domain-track{padding-inline:32px!important}
  .of-page .of-project-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important}
}
@media(max-width:820px){
  .of-page .of-editorial-head,
  .of-page .of-project-preview-head,
  .of-page .of-rules-head{grid-template-columns:1fr!important;gap:25px!important}
  .of-page .of-rule-layout{grid-template-columns:1fr!important;gap:38px!important}
  .of-page .of-project-grid{
    grid-template-columns:none!important;
    grid-auto-columns:minmax(274px,84%)!important;
    grid-auto-flow:column!important;
    overflow-x:auto!important;
    padding-bottom:12px!important;
    scroll-snap-type:inline mandatory!important;
  }
  .of-page .of-project{scroll-snap-align:start!important}
}
@media(max-width:620px){
  .of-page .of-wrap{width:calc(100% - 32px)!important}
  .of-page .of-header{min-height:64px!important}
  .of-page .of-display,
  .of-page .of-editorial-head h2,
  .of-page .of-project-preview-head h2,
  .of-page .of-rules-head h2,
  .of-page .of-paths-intro h2,
  .of-page .of-closing h2{font-size:42px!important}
  .of-page .of-domain-section,
  .of-page .of-project-preview,
  .of-page .of-rules{padding:82px 0!important}
  .of-page .of-domain-viewport{margin-inline:-16px!important}
  .of-page .of-domain-track{grid-auto-columns:minmax(276px,81%)!important;padding-inline:16px!important}
  .of-page .of-domain-card{min-height:366px!important;padding:27px 25px 23px!important}
  .of-page .of-project{min-height:382px!important;padding:25px!important}
  .of-page .of-rule-note{position:relative!important;top:auto!important}
  .of-float-project{right:16px!important;bottom:16px!important}
}

/* Real collaborator stories: a standalone editorial gallery, not a repurposed process widget. */
.of-page .of-stories{
  padding:clamp(112px,10vw,156px) 0!important;
  background:var(--bj-ref-paper)!important;
  color:var(--bj-ref-ink)!important;
}
.of-page .of-stories-head{
  display:grid!important;
  grid-template-columns:minmax(0,7fr) minmax(292px,3fr)!important;
  align-items:end!important;
  gap:clamp(56px,10vw,176px)!important;
  padding-bottom:54px!important;
  border-bottom:1px solid var(--bj-ref-line)!important;
}
.of-page .of-stories-head h2{
  max-width:760px!important;
  margin:0!important;
  color:var(--bj-ref-ink)!important;
  font-family:var(--bj-font-sans)!important;
  font-size:clamp(46px,4.9vw,70px)!important;
  font-weight:500!important;
  line-height:1.15!important;
  letter-spacing:-.014em!important;
}
.of-page .of-stories-head h2 em{color:var(--bj-ref-accent)!important;font-style:normal!important}
.of-page .of-stories-head>p{
  max-width:380px!important;
  margin:0 0 4px!important;
  color:var(--bj-ref-copy)!important;
  font-size:16px!important;
  line-height:1.72!important;
}
.of-page .of-stories-grid{
  display:grid!important;
  grid-template-columns:repeat(3,minmax(0,1fr))!important;
  gap:18px!important;
  padding-top:31px!important;
}
.of-page .of-story-card{
  display:flex!important;
  min-width:0!important;
  flex-direction:column!important;
  border-top:1px solid var(--bj-ref-ink)!important;
  background:transparent!important;
  transition:transform .35s ease!important;
}
.of-page .of-story-card:focus-visible{
  outline:2px solid var(--bj-ref-accent)!important;
  outline-offset:7px!important;
}
.of-page .of-story-media{
  position:relative!important;
  aspect-ratio:3 / 4.32!important;
  overflow:hidden!important;
  margin:18px 0 0!important;
  background:#dfd1d7!important;
}
.of-page .of-story-media:after{
  position:absolute!important;
  inset:0!important;
  background:linear-gradient(180deg,rgba(31,8,22,.02),rgba(31,8,22,.18))!important;
  content:""!important;
  pointer-events:none!important;
}
.of-page .of-story-media img{
  display:block!important;
  width:100%!important;
  height:100%!important;
  object-fit:cover!important;
  transition:transform .7s cubic-bezier(.2,.75,.25,1)!important;
}
.of-page .of-story-card:nth-child(1) .of-story-media img{object-position:62% center!important}
.of-page .of-story-card:nth-child(2) .of-story-media img{object-position:48% center!important}
.of-page .of-story-card:nth-child(3) .of-story-media img{object-position:62% center!important}
.of-page .of-story-card:hover .of-story-media img,
.of-page .of-story-card:focus-within .of-story-media img{transform:scale(1.045)!important}
.of-page .of-story-card:hover{transform:translateY(-5px)!important}
.of-page .of-story-media span{
  position:absolute!important;
  z-index:1!important;
  top:18px!important;
  left:20px!important;
  color:#fff!important;
  font-family:var(--bj-font-latin)!important;
  font-size:19px!important;
  font-weight:500!important;
  letter-spacing:.02em!important;
}
.of-page .of-story-copy{
  display:flex!important;
  min-height:316px!important;
  flex:1!important;
  flex-direction:column!important;
  padding:24px 2px 4px!important;
}
.of-page .of-story-role{
  margin:0!important;
  color:var(--bj-ref-muted)!important;
  font-size:11px!important;
  font-weight:600!important;
  letter-spacing:.08em!important;
}
.of-page .of-story-copy h3{
  margin:9px 0 0!important;
  color:var(--bj-ref-ink)!important;
  font-family:var(--bj-font-sans)!important;
  font-size:clamp(28px,2.25vw,38px)!important;
  font-weight:500!important;
  letter-spacing:-.025em!important;
  line-height:1.2!important;
}
.of-page .of-story-quote{
  margin:22px 0 0!important;
  color:var(--bj-ref-ink)!important;
  font-size:17px!important;
  font-weight:400!important;
  line-height:1.68!important;
}
.of-page .of-story-detail{
  margin:15px 0 0!important;
  color:var(--bj-ref-copy)!important;
  font-size:14px!important;
  line-height:1.74!important;
}
.of-page .of-story-copy a{
  align-self:flex-start!important;
  margin-top:auto!important;
  padding:23px 0 5px!important;
  border-bottom:1px solid currentColor!important;
  color:var(--bj-ref-ink)!important;
  font-size:14px!important;
  font-weight:600!important;
}
.of-page .of-story-copy a:hover{color:var(--bj-ref-accent)!important}
@media(max-width:820px){
  .of-page .of-stories-head{grid-template-columns:1fr!important;gap:25px!important;padding-bottom:37px!important}
  .of-page .of-stories-grid{
    grid-template-columns:none!important;
    grid-auto-columns:minmax(276px,80%)!important;
    grid-auto-flow:column!important;
    overflow-x:auto!important;
    padding:27px 0 14px!important;
    scroll-snap-type:inline mandatory!important;
  }
  .of-page .of-story-card{scroll-snap-align:start!important}
  .of-page .of-story-copy{min-height:326px!important}
}
@media(max-width:620px){
  .of-page .of-stories{padding:82px 0!important}
  .of-page .of-stories-head h2{font-size:42px!important}
  .of-page .of-stories-head>p{font-size:16px!important}
  .of-page .of-stories-grid{margin-right:-16px!important;padding-right:16px!important}
  .of-page .of-story-media{margin-top:15px!important}
  .of-page .of-story-copy{min-height:318px!important;padding-top:21px!important}
  .of-page .of-story-quote{font-size:16px!important}
}

/* Three chapters: fixed introduction + fixed image + scroll-led story card, matching the reference composition. */
.of-page .of-paths--chapters{min-height:180vh!important;background:#210918!important;color:#fff!important}
.of-page .of-paths--chapters[data-path-active="grow"]{background:#52251d!important}
.of-page .of-paths--chapters[data-path-active="shape"]{background:#670543!important}
.of-page .of-paths--chapters .of-paths-layout{
  position:sticky!important;
  top:0!important;
  grid-template-columns:minmax(280px,347px) minmax(340px,388px) minmax(380px,449px)!important;
  align-items:center!important;
  align-content:center!important;
  justify-content:space-between!important;
  height:100vh!important;
  gap:64px!important;
  padding:100px 64px 60px!important;
}
.of-page .of-paths--chapters .of-paths-intro{
  position:static!important;
  top:auto!important;
  grid-column:auto!important;
  display:block!important;
  padding:0!important;
  transform:none!important;
}
.of-page .of-paths--chapters .of-paths-intro h2{
  color:#fff!important;
  font-size:clamp(48px,4vw,62px)!important;
  font-weight:400!important;
  line-height:1.02!important;
  letter-spacing:-.06em!important;
}
.of-page .of-paths--chapters .of-paths-intro h2 em{color:#ef0f96!important}
.of-page .of-paths--chapters .of-paths-intro>p:last-child{
  max-width:340px!important;
  margin:26px 0 0!important;
  color:#e8ccd9!important;
  font-size:16px!important;
  line-height:1.76!important;
}
.of-page .of-paths--chapters .of-path-visual-stack{
  position:relative!important;
  top:auto!important;
  grid-column:auto!important;
  grid-row:auto!important;
  width:auto!important;
  height:min(640px,calc(100vh - 160px))!important;
  margin:0!important;
  aspect-ratio:auto!important;
  overflow:hidden!important;
  border-radius:30px!important;
  background:#432338!important;
  box-shadow:0 24px 70px rgba(0,0,0,.2)!important;
  transform:none!important;
}
.of-page .of-paths--chapters .of-path-visual{
  position:absolute!important;
  inset:0!important;
  margin:0!important;
  opacity:0!important;
  transform:scale(1.035)!important;
  transition:opacity .55s ease,transform .8s ease!important;
}
.of-page .of-paths--chapters .of-path-visual.is-active{opacity:1!important;transform:scale(1)!important}
.of-page .of-paths--chapters .of-path-visual img{display:block!important;width:100%!important;height:100%!important;object-fit:cover!important}
.of-page .of-paths--chapters .of-path-visual[data-path-visual="earn"] img{object-position:62% center!important}
.of-page .of-paths--chapters .of-path-visual[data-path-visual="grow"] img{object-position:48% center!important}
.of-page .of-paths--chapters .of-path-visual[data-path-visual="shape"] img{object-position:62% center!important}
.of-page .of-paths--chapters .of-path-visual:after{
  position:absolute!important;
  inset:auto 0 0!important;
  height:43%!important;
  background:linear-gradient(180deg,transparent,rgba(20,4,14,.72))!important;
  content:""!important;
}
.of-page .of-paths--chapters .of-path-visual figcaption{
  position:absolute!important;
  z-index:1!important;
  right:24px!important;
  bottom:25px!important;
  left:24px!important;
  display:grid!important;
  gap:8px!important;
}
.of-page .of-paths--chapters .of-path-visual figcaption strong{color:#ff96d2!important;font-size:21px!important;font-weight:500!important;letter-spacing:-.025em!important}
.of-page .of-paths--chapters .of-path-visual figcaption span{color:#fff!important;font-size:13px!important;font-weight:600!important}
.of-page .of-paths--chapters .of-path-cards{
  position:relative!important;
  grid-column:auto!important;
  grid-row:auto!important;
  display:block!important;
  width:100%!important;
  height:min(558px,calc(100vh - 160px))!important;
  overflow:hidden!important;
}
.of-page .of-paths--chapters .of-path-track{
  display:flex!important;
  width:300%!important;
  height:100%!important;
  transform:translate3d(0,0,0)!important;
  transition:transform .76s cubic-bezier(.22,.72,.24,1)!important;
  will-change:transform!important;
}
.of-page .of-paths--chapters[data-path-active="grow"] .of-path-track{transform:translate3d(-33.333333%,0,0)!important}
.of-page .of-paths--chapters[data-path-active="shape"] .of-path-track{transform:translate3d(-66.666667%,0,0)!important}
.of-page .of-paths--chapters .of-path-card,
.of-page .of-paths--chapters .of-path-card.is-active,
.of-page .of-paths--chapters .of-path-card:not(.is-active){
  position:absolute!important;
  inset:0!important;
  display:block!important;
  min-height:0!important;
  padding:44px!important;
  border:1px solid rgba(255,255,255,.15)!important;
  border-radius:30px!important;
  background:rgba(255,255,255,.025)!important;
  color:#fff!important;
  box-shadow:0 20px 48px rgba(0,0,0,.05)!important;
  opacity:1!important;
  pointer-events:auto!important;
  transform:none!important;
  transition:background .45s ease,border-color .45s ease!important;
}
.of-page .of-paths--chapters .of-path-track .of-path-card{position:relative!important;inset:auto!important;flex:0 0 calc(100% / 3)!important;height:100%!important}
.of-page .of-paths--chapters .of-path-card.is-active{
  border-color:rgba(255,255,255,.21)!important;
  background:rgba(255,255,255,.055)!important;
  box-shadow:none!important;
  opacity:1!important;
  pointer-events:auto!important;
  transform:none!important;
}
.of-page .of-paths--chapters .of-path-line{color:#f4d6e4!important;font-size:12px!important;font-weight:700!important;letter-spacing:.14em!important}
.of-page .of-paths--chapters .of-path-line span{color:#f4d6e4!important;font-size:14px!important}
.of-page .of-paths--chapters .of-path-line i{width:88px!important;height:2px!important;background:#ef0f96!important}
.of-page .of-paths--chapters .of-path-line b{font-weight:700!important}
.of-page .of-paths--chapters .of-path-card h3{
  margin:26px 0 0!important;
  color:#fff!important;
  font-family:var(--bj-font-sans)!important;
  font-size:clamp(46px,3.35vw,56px)!important;
  font-weight:400!important;
  line-height:1.06!important;
  letter-spacing:-.05em!important;
}
.of-page .of-paths--chapters .of-path-quote{
  margin:18px 0 0!important;
  color:#fff!important;
  font-size:16px!important;
  font-weight:400!important;
  line-height:1.47!important;
  letter-spacing:-.02em!important;
}
.of-page .of-paths--chapters .of-path-credit{
  margin:12px 0 0!important;
  color:#e5bacf!important;
  font-size:12px!important;
  font-weight:600!important;
  letter-spacing:.04em!important;
}
.of-page .of-paths--chapters .of-path-card>p:last-of-type{
  margin:28px 0 0!important;
  padding-top:22px!important;
  border-top:1px solid rgba(255,255,255,.12)!important;
  color:#ead5e0!important;
  font-size:13px!important;
  line-height:1.65!important;
}
@media(max-width:1100px){
  .of-page .of-paths--chapters{min-height:0!important}
  .of-page .of-paths--chapters .of-paths-layout{position:relative!important;top:auto!important;height:auto!important;grid-template-columns:minmax(0,.7fr) minmax(300px,1fr)!important;gap:55px!important;padding:74px 0!important}
  .of-page .of-paths--chapters .of-paths-intro{
    position:relative!important;
    top:auto!important;
    grid-column:1/-1!important;
    display:grid!important;
    grid-template-columns:minmax(0,1fr) minmax(280px,.65fr)!important;
    gap:55px!important;
    align-items:end!important;
    padding:0!important;
    transform:none!important;
  }
  .of-page .of-paths--chapters .of-paths-intro .of-eyebrow,
  .of-page .of-paths--chapters .of-paths-intro h2{grid-column:1!important}
  .of-page .of-paths--chapters .of-paths-intro>p:last-child{grid-column:2!important;grid-row:1/3!important;margin:0!important}
  .of-page .of-paths--chapters .of-path-cards{position:static!important;display:grid!important;height:auto!important;overflow:visible!important;gap:18px!important}
  .of-page .of-paths--chapters .of-path-track{display:grid!important;width:auto!important;height:auto!important;gap:18px!important;transform:none!important}
  .of-page .of-paths--chapters .of-path-card,
  .of-page .of-paths--chapters .of-path-card.is-active,
  .of-page .of-paths--chapters .of-path-card:not(.is-active){position:relative!important;inset:auto!important;min-height:245px!important;height:auto!important;padding:31px!important;opacity:.64!important;pointer-events:auto!important;transform:none!important}
  .of-page .of-paths--chapters .of-path-card.is-active{opacity:1!important}
}
@media(max-width:820px){
  .of-page .of-paths--chapters .of-paths-layout{grid-template-columns:1fr!important;padding:72px 0!important}
  .of-page .of-paths--chapters .of-paths-intro{display:block!important;grid-column:auto!important}
  .of-page .of-paths--chapters .of-paths-intro>p:last-child{margin-top:24px!important}
  .of-page .of-paths--chapters .of-path-visual-stack{position:relative!important;top:auto!important;height:380px!important;transform:none!important}
  .of-page .of-paths--chapters .of-path-cards{gap:18px!important}
  .of-page .of-paths--chapters .of-path-card,
  .of-page .of-paths--chapters .of-path-card.is-active,
  .of-page .of-paths--chapters .of-path-card:not(.is-active){min-height:0!important;opacity:.64!important;transform:none!important}
  .of-page .of-paths--chapters .of-path-card.is-active{opacity:1!important}
}
@media(max-width:620px){
  .of-page .of-paths--chapters .of-paths-layout{padding:62px 0!important}
  .of-page .of-paths--chapters .of-paths-intro h2{font-size:45px!important}
  .of-page .of-paths--chapters .of-paths-intro>p:last-child{font-size:16px!important}
  .of-page .of-paths--chapters .of-path-visual-stack{height:340px!important;border-radius:25px!important}
  .of-page .of-paths--chapters .of-path-card,
  .of-page .of-paths--chapters .of-path-card.is-active,
  .of-page .of-paths--chapters .of-path-card:not(.is-active){padding:28px!important;border-radius:25px!important}
  .of-page .of-paths--chapters .of-path-line i{width:48px!important}
  .of-page .of-paths--chapters .of-path-card h3{margin-top:18px!important;font-size:42px!important}
  .of-page .of-paths--chapters .of-path-quote{margin-top:14px!important;font-size:16px!important}
  .of-page .of-paths--chapters .of-path-card>p:last-of-type{margin-top:17px!important;padding-top:16px!important}
}

/* Stories: follow the reference interaction. Wide screens use a pinned vertical
   card track; tablet and phone switch to an intentional horizontal story rail. */
@media(min-width:1281px){
  .of-page .of-paths--chapters .of-paths-layout{
    grid-template-columns:1.08fr .86fr 1fr!important;
    gap:64px!important;
    padding:100px 64px 60px!important;
    overflow:hidden!important;
  }
  .of-page .of-paths--chapters .of-paths-intro>p:last-child{max-width:34ch!important}
  .of-page .of-paths--chapters .of-path-visual-stack{
    width:100%!important;
    height:min(640px,calc(100vh - 160px))!important;
    border-radius:20px!important;
  }
  .of-page .of-paths--chapters .of-path-cards{
    position:relative!important;
    display:flex!important;
    align-items:center!important;
    width:100%!important;
    height:min(760px,calc(100vh - 160px))!important;
    overflow:visible!important;
  }
  .of-page .of-paths--chapters .of-path-track{
    position:absolute!important;
    top:0!important;
    right:0!important;
    left:0!important;
    display:flex!important;
    flex-direction:column!important;
    width:100%!important;
    height:auto!important;
    gap:64px!important;
    transition:none!important;
    will-change:transform!important;
  }
  .of-page .of-paths--chapters[data-path-active="grow"] .of-path-track,
  .of-page .of-paths--chapters[data-path-active="shape"] .of-path-track{
    transform:translate3d(0,var(--path-track-y,0),0)!important;
  }
  .of-page .of-paths--chapters .of-path-track .of-path-card,
  .of-page .of-paths--chapters .of-path-card,
  .of-page .of-paths--chapters .of-path-card.is-active,
  .of-page .of-paths--chapters .of-path-card:not(.is-active){
    position:relative!important;
    inset:auto!important;
    flex:0 0 auto!important;
    width:100%!important;
    min-height:0!important;
    height:auto!important;
    padding:44px!important;
    border-radius:28px!important;
    opacity:.25!important;
    pointer-events:none!important;
    transform:none!important;
    transition:opacity .5s cubic-bezier(.22,1,.36,1)!important;
  }
  .of-page .of-paths--chapters .of-path-card.is-active{
    opacity:1!important;
    pointer-events:auto!important;
  }
  .of-page .of-paths--chapters .of-path-track .of-path-card{
    min-height:540px!important;
  }
  .of-page .of-paths--chapters .of-path-rail-controls{display:none!important}
}

@media(min-width:821px) and (max-width:1280px){
  .of-page .of-paths--chapters{
    min-height:0!important;
    overflow:hidden!important;
  }
  .of-page .of-paths--chapters .of-paths-layout{
    position:relative!important;
    top:auto!important;
    display:grid!important;
    grid-template-columns:1fr!important;
    width:min(100%,1146px)!important;
    height:auto!important;
    gap:32px!important;
    padding:88px 64px 80px!important;
    overflow:visible!important;
  }
  .of-page .of-paths--chapters .of-paths-intro{
    width:100%!important;
    max-width:720px!important;
  }
  .of-page .of-paths--chapters .of-paths-intro h2{
    max-width:14ch!important;
    font-size:clamp(40px,4.25vw,54px)!important;
  }
  .of-page .of-paths--chapters .of-paths-intro>p:last-child{
    max-width:38ch!important;
    margin-top:22px!important;
  }
  .of-page .of-paths--chapters .of-path-visual-stack{
    width:100%!important;
    height:auto!important;
    max-height:none!important;
    aspect-ratio:2.08 / 1!important;
    border-radius:16px!important;
  }
  .of-page .of-paths--chapters .of-path-cards{
    display:block!important;
    width:calc(100% + 64px)!important;
    height:auto!important;
    margin-right:-64px!important;
    overflow-x:auto!important;
    overflow-y:hidden!important;
    scroll-snap-type:x mandatory!important;
    scroll-padding-inline:0!important;
    overscroll-behavior-x:contain!important;
    scrollbar-width:none!important;
  }
  .of-page .of-paths--chapters .of-path-cards::-webkit-scrollbar{display:none!important}
  .of-page .of-paths--chapters .of-path-track{
    position:relative!important;
    inset:auto!important;
    display:flex!important;
    flex-direction:row!important;
    width:max-content!important;
    height:auto!important;
    gap:18px!important;
    padding-bottom:8px!important;
    transform:none!important;
    transition:none!important;
  }
  .of-page .of-paths--chapters[data-path-active="grow"] .of-path-track,
  .of-page .of-paths--chapters[data-path-active="shape"] .of-path-track{transform:none!important}
  .of-page .of-paths--chapters .of-path-track .of-path-card,
  .of-page .of-paths--chapters .of-path-card,
  .of-page .of-paths--chapters .of-path-card.is-active,
  .of-page .of-paths--chapters .of-path-card:not(.is-active){
    position:relative!important;
    inset:auto!important;
    flex:0 0 min(45vw,520px)!important;
    width:min(45vw,520px)!important;
    min-height:0!important;
    height:auto!important;
    padding:38px 40px!important;
    border-radius:24px!important;
    opacity:.25!important;
    pointer-events:auto!important;
    scroll-snap-align:center!important;
    scroll-snap-stop:always!important;
  }
  .of-page .of-paths--chapters .of-path-card.is-active{opacity:1!important}
  .of-page .of-paths--chapters .of-path-rail-controls{
    display:grid!important;
    grid-template-columns:48px minmax(120px,1fr) auto 48px!important;
    align-items:center!important;
    gap:14px!important;
    width:100%!important;
    margin-top:8px!important;
  }
}

.of-page .of-path-rail-controls{display:none}
.of-page .of-path-rail-arrow{
  display:grid!important;
  width:48px!important;
  height:48px!important;
  padding:0!important;
  place-items:center!important;
  border:1px solid rgba(255,255,255,.3)!important;
  border-radius:50%!important;
  background:transparent!important;
  color:#fff!important;
  font:400 24px/1 var(--bj-font-sans)!important;
  cursor:pointer!important;
  transition:background .2s ease,border-color .2s ease,opacity .2s ease!important;
}
.of-page .of-path-rail-arrow:hover:not(:disabled){border-color:#ef0f96!important;background:#ef0f96!important}
.of-page .of-path-rail-arrow:disabled{opacity:.34!important;cursor:not-allowed!important}
.of-page .of-path-rail-progress{display:flex!important;align-items:center!important;justify-content:center!important;gap:8px!important}
.of-page .of-path-rail-dot{
  width:22px!important;
  height:32px!important;
  padding:0!important;
  border:0!important;
  background:transparent!important;
  cursor:pointer!important;
}
.of-page .of-path-rail-dot::after{
  display:block!important;
  width:100%!important;
  height:2px!important;
  background:rgba(255,255,255,.28)!important;
  content:""!important;
  transition:width .25s ease,background .25s ease!important;
}
.of-page .of-path-rail-dot.is-active::after{width:30px!important;background:#ef0f96!important}
.of-page .of-path-rail-count{
  color:#f6dbe8!important;
  font-family:var(--bj-font-latin)!important;
  font-size:13px!important;
  font-weight:700!important;
  letter-spacing:.1em!important;
  white-space:nowrap!important;
}
.of-page .of-path-rail-count i{margin:0 3px!important;font-style:normal!important;opacity:.55!important}

@media(max-width:820px){
  .of-page .of-paths--chapters .of-path-rail-controls{display:none!important}
}