:root{--bmj-bg:#f3f4f6;--bmj-paper:#fff;--bmj-ink:#171518;--bmj-charcoal:#252327;--bmj-muted:#716c70;--bmj-plum:#5e546f;--bmj-red:#9c2028;--bmj-line:rgba(23,21,24,.14);--bmj-serif:Georgia,"Times New Roman",serif;--bmj-sans:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;--bmj-mono:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;--bmj-shell:min(94vw,1440px)} html{scroll-behavior:smooth}body{background:#fff;color:var(--bmj-ink)}.bmj-shell{width:var(--bmj-shell);margin-inline:auto}.bmj-home{width:100%;font-family:var(--bmj-sans);background:#fff;overflow:hidden}.bmj-home *{box-sizing:border-box}.bmj-home img,.bmj-header img,.bmj-footer img{display:block;width:100%;height:100%;object-fit:cover}.bmj-kicker{font:700 .63rem/1.2 var(--bmj-mono);letter-spacing:.1em;text-transform:uppercase;color:var(--bmj-plum)} body.home #content,body.home #content.site-content{padding:0!important;margin:0!important;width:100%!important;max-width:none!important}body.home #content>.ast-container{display:block!important;width:100%!important;max-width:none!important;margin:0!important;padding:0!important}body.home #primary,body.home .site-main{width:100%!important;max-width:none!important;margin:0!important;padding:0!important}body.home a[href*="pinterest.com/pin/create"],body.home [data-pin-do="buttonPin"],body.home .pinterest-save-button{display:none!important} /* HEADER */ .bmj-header{position:relative;top:auto;z-index:1000;background:rgba(255,255,255,.96);backdrop-filter:blur(14px);border-bottom:1px solid var(--bmj-line)}.bmj-header__inner{min-height:66px;display:grid;grid-template-columns:1fr auto 1fr;align-items:center;gap:2rem}.bmj-wordmark{justify-self:start;display:inline-flex;align-items:center;text-decoration:none!important}.bmj-header-logo{display:block!important;width:auto!important;height:auto!important;max-width:118px!important;max-height:39px!important;object-fit:contain!important}.bmj-wordmark__fallback{font:700 1.15rem/1 var(--bmj-serif);color:var(--bmj-ink)}.bmj-nav{justify-self:center}.bmj-menu,.bmj-footer-menu{list-style:none!important;margin:0!important;padding:0!important}.bmj-menu{display:flex;gap:1.8rem;align-items:center}.bmj-menu li,.bmj-footer-menu li{margin:0!important}.bmj-menu a{font:700 .63rem/1 var(--bmj-mono)!important;letter-spacing:.08em;text-transform:uppercase;text-decoration:none!important;color:var(--bmj-ink)!important}.bmj-menu a:hover{color:var(--bmj-plum)!important}.bmj-menu-toggle{justify-self:end;display:none;width:40px;height:40px;border:0!important;background:transparent!important;padding:0!important}.bmj-menu-toggle>span:not(.screen-reader-text){display:block;width:22px;height:1px;margin:6px auto;background:var(--bmj-ink)}.bmj-right-now-trigger{justify-self:end;display:inline-flex!important;align-items:center;gap:.5rem;margin:0!important;padding:8px 0!important;border:0!important;border-radius:0!important;background:transparent!important;color:var(--bmj-ink)!important;box-shadow:none!important;font:700 .57rem/1 var(--bmj-mono)!important;text-transform:uppercase;letter-spacing:.08em;cursor:pointer}.bmj-right-now-trigger__dot{width:7px;height:7px;flex:0 0 7px;border-radius:50%;background:var(--bmj-red);box-shadow:0 0 0 0 rgba(156,32,40,.18);transition:box-shadow .2s ease,transform .2s ease}.bmj-right-now-trigger__text{max-width:0;overflow:hidden;white-space:nowrap;opacity:0;transform:translateX(4px);transition:max-width .22s ease,opacity .18s ease,transform .22s ease}.bmj-right-now-trigger:hover .bmj-right-now-trigger__text,.bmj-right-now-trigger:focus-visible .bmj-right-now-trigger__text{max-width:90px;opacity:1;transform:none}.bmj-right-now-trigger:hover .bmj-right-now-trigger__dot,.bmj-right-now-trigger:focus-visible .bmj-right-now-trigger__dot{box-shadow:0 0 0 6px rgba(156,32,40,.10);transform:scale(1.08)}.bmj-mobile-menu{padding:1.3rem 0 1.8rem;border-top:1px solid var(--bmj-line);background:#fff}.bmj-mobile-menu .bmj-menu{display:block}.bmj-mobile-menu .bmj-menu li+li{margin-top:1rem!important}.bmj-mobile-menu .bmj-menu a{font:400 1.9rem/1 var(--bmj-serif)!important;text-transform:none!important;letter-spacing:-.02em!important} /* STAGE */ .bmj-stage{background:var(--bmj-bg);padding:28px 0 0}.bmj-stage__shell{display:grid;grid-template-columns:minmax(0,1.55fr) minmax(320px,.7fr);min-height:610px;border:1px solid var(--bmj-line);background:#fff}.bmj-stage__visual{position:relative;overflow:hidden;background:#d9dce1}.bmj-stage__image{position:absolute;inset:0;margin:0;opacity:0;transform:scale(1.015);transition:opacity .32s ease,transform .5s ease}.bmj-stage__image.is-active{opacity:1;transform:scale(1)}.bmj-stage__image img{filter:saturate(.68) contrast(.98)}.bmj-stage__content{display:flex;flex-direction:column;padding:30px 30px 32px;border-left:1px solid var(--bmj-line)}.bmj-stage__intro{max-width:26rem;margin:0!important;color:var(--bmj-muted);font-size:.92rem;line-height:1.55}.bmj-stage__panels{position:relative;flex:1;margin-top:45px}.bmj-stage__panel{position:absolute;inset:0;display:flex;flex-direction:column;justify-content:flex-end;opacity:0;pointer-events:none;transform:translateY(7px);transition:opacity .24s ease,transform .24s ease}.bmj-stage__panel.is-active{opacity:1;pointer-events:auto;transform:none}.bmj-stage__panel h2{max-width:8ch;margin:.8rem 0 0!important;color:var(--bmj-ink)!important;font:400 clamp(2.8rem,4.7vw,5.5rem)/.94 var(--bmj-serif)!important;letter-spacing:-.05em!important}.bmj-stage__panel p{max-width:30rem;margin:1rem 0 0!important;color:var(--bmj-muted);line-height:1.6}.bmj-text-button{display:inline-flex!important;align-items:center;gap:.55rem;width:max-content;margin:1.25rem 0 0!important;padding:0 0 .3rem!important;border:0!important;border-bottom:1px solid currentColor!important;border-radius:0!important;background:transparent!important;color:var(--bmj-ink)!important;box-shadow:none!important;font:700 .62rem/1.1 var(--bmj-mono)!important;text-transform:uppercase;letter-spacing:.08em;cursor:pointer}.bmj-stage__rail{display:grid;grid-template-columns:repeat(4,1fr);border-inline:1px solid var(--bmj-line);border-bottom:1px solid var(--bmj-line);background:#fff}.bmj-stage__tab{display:flex!important;align-items:center;gap:.8rem;min-height:58px;margin:0!important;padding:14px 16px!important;border:0!important;border-right:1px solid var(--bmj-line)!important;border-radius:0!important;background:#fff!important;color:var(--bmj-ink)!important;box-shadow:none!important;text-align:left;cursor:pointer}.bmj-stage__tab:last-child{border-right:0!important}.bmj-stage__tab small{font:700 .56rem/1 var(--bmj-mono);color:var(--bmj-muted)}.bmj-stage__tab span{font:400 1rem/1 var(--bmj-serif)}.bmj-stage__tab.is-active{background:rgba(94,84,111,.075)!important;box-shadow:inset 0 -3px 0 var(--bmj-plum)!important} /* EXPLORE */ .bmj-explore{padding:88px 0 92px;background:#fff}.bmj-explore__head{display:flex;justify-content:space-between;align-items:flex-end;gap:2rem;margin-bottom:28px}.bmj-explore__head h2{margin:.4rem 0 0!important;color:var(--bmj-ink)!important;font:400 clamp(3rem,5vw,5.2rem)/.9 var(--bmj-serif)!important;letter-spacing:-.05em!important}.bmj-explore__categories{display:flex;gap:.5rem;flex-wrap:wrap;justify-content:flex-end}.bmj-explore__categories button{margin:0!important;padding:9px 12px!important;border:1px solid var(--bmj-line)!important;border-radius:999px!important;background:#fff!important;color:var(--bmj-ink)!important;box-shadow:none!important;font:700 .59rem/1 var(--bmj-mono)!important;text-transform:uppercase;letter-spacing:.07em}.bmj-explore__categories button.is-active{background:var(--bmj-ink)!important;color:#fff!important}.bmj-explore__body{display:grid;grid-template-columns:minmax(245px,.42fr) minmax(0,1.58fr);border-top:1px solid var(--bmj-line);border-bottom:1px solid var(--bmj-line);min-height:500px}.bmj-explore__lists{border-right:1px solid var(--bmj-line)}.bmj-explore__list{display:none}.bmj-explore__list.is-active{display:block}.bmj-explore__item{width:100%;display:grid!important;grid-template-columns:34px 1fr;align-items:center;gap:.5rem;min-height:82px;margin:0!important;padding:16px!important;border:0!important;border-bottom:1px solid var(--bmj-line)!important;border-radius:0!important;background:#fff!important;color:var(--bmj-ink)!important;box-shadow:none!important;text-align:left;cursor:pointer}.bmj-explore__item small{font:700 .55rem/1 var(--bmj-mono);color:var(--bmj-muted)}.bmj-explore__item span{font:400 clamp(1.2rem,1.6vw,1.55rem)/1.05 var(--bmj-serif)}.bmj-explore__item.is-active{background:rgba(94,84,111,.06)!important;box-shadow:inset 3px 0 0 var(--bmj-plum)!important}.bmj-explore__preview{display:grid;grid-template-columns:minmax(0,1.22fr) minmax(260px,.78fr);gap:0}.bmj-explore__preview-image{min-height:500px;overflow:hidden;background:#d9dce1}.bmj-explore__preview-image img{filter:saturate(.68);transition:opacity .16s ease}.bmj-explore__preview-copy{padding:34px 32px;display:flex;flex-direction:column;justify-content:flex-end;border-left:1px solid var(--bmj-line)}.bmj-explore__preview-copy h3{max-width:8ch;margin:.8rem 0 0!important;color:var(--bmj-ink)!important;font:400 clamp(2.6rem,4vw,4.5rem)/.94 var(--bmj-serif)!important;letter-spacing:-.045em!important}.bmj-explore__preview-copy p{max-width:28rem;margin:1rem 0 0!important;color:var(--bmj-muted);line-height:1.6} /* VISUAL BREAK */ .bmj-visual-break{position:relative;display:block!important;width:100%;height:clamp(270px,31vw,390px);margin:0!important;padding:0!important;border:0!important;border-radius:0!important;background:#ddd!important;box-shadow:none!important;overflow:hidden;cursor:pointer;text-align:left}.bmj-visual-break img{filter:saturate(.64);transform:scale(1.005);transition:transform .5s ease,filter .35s ease}.bmj-visual-break__shade{position:absolute;inset:0;background:linear-gradient(90deg,rgba(20,18,20,.08),transparent 48%,rgba(20,18,20,.12));opacity:.45;transition:opacity .25s ease}.bmj-visual-break__meta{position:absolute;right:clamp(18px,3vw,46px);bottom:clamp(18px,3vw,40px);display:grid;grid-template-columns:auto auto;align-items:center;gap:.25rem .7rem;min-width:122px;padding:12px 14px;background:rgba(255,255,255,.94);border:1px solid var(--bmj-line);color:var(--bmj-ink)}.bmj-visual-break__meta .bmj-kicker{grid-column:1/-1;color:var(--bmj-plum)}.bmj-visual-break__meta strong{font:700 .63rem/1 var(--bmj-mono);text-transform:uppercase;letter-spacing:.08em}.bmj-visual-break__meta>span:last-child{justify-self:end;transition:transform .2s ease}.bmj-visual-break:hover img,.bmj-visual-break:focus-visible img{transform:scale(1.018);filter:saturate(.72)}.bmj-visual-break:hover .bmj-visual-break__shade,.bmj-visual-break:focus-visible .bmj-visual-break__shade{opacity:.18}.bmj-visual-break:hover .bmj-visual-break__meta>span:last-child,.bmj-visual-break:focus-visible .bmj-visual-break__meta>span:last-child{transform:translate(2px,-2px)} /* SERVICES */ .bmj-services{background:var(--bmj-charcoal);color:#fff;padding:66px 0 70px}.bmj-services__head{display:grid;grid-template-columns:160px 1fr;align-items:end;margin-bottom:28px}.bmj-services__head .bmj-kicker{color:#b8afc5}.bmj-services__head h2{margin:0!important;color:#fff!important;font:400 clamp(3rem,5vw,5.3rem)/.9 var(--bmj-serif)!important;letter-spacing:-.05em!important}.bmj-services__interface{display:grid;grid-template-columns:260px 1fr;border-top:1px solid rgba(255,255,255,.2);border-bottom:1px solid rgba(255,255,255,.2);min-height:360px}.bmj-services__tabs{border-right:1px solid rgba(255,255,255,.2)}.bmj-services__tabs button{width:100%;display:grid!important;grid-template-columns:34px 1fr;align-items:center;gap:.5rem;min-height:70px;margin:0!important;padding:16px!important;border:0!important;border-bottom:1px solid rgba(255,255,255,.18)!important;border-radius:0!important;background:transparent!important;color:#fff!important;box-shadow:none!important;text-align:left}.bmj-services__tabs small{font:700 .55rem/1 var(--bmj-mono);color:#aaa4ad}.bmj-services__tabs span{font:400 1.2rem/1.05 var(--bmj-serif)}.bmj-services__tabs button.is-active{background:rgba(255,255,255,.07)!important;box-shadow:inset 3px 0 0 #b8afc5!important}.bmj-services__stage{position:relative;overflow:hidden}.bmj-services__panel{position:absolute;inset:0;display:grid;grid-template-columns:.72fr 1.28fr;opacity:0;pointer-events:none;transition:opacity .22s ease}.bmj-services__panel.is-active{opacity:1;pointer-events:auto}.bmj-services__copy{padding:26px;display:flex;flex-direction:column;justify-content:flex-end}.bmj-services__copy h3{margin:0!important;color:#fff!important;font:400 clamp(2.4rem,3.6vw,4rem)/.95 var(--bmj-serif)!important;letter-spacing:-.04em!important}.bmj-services__copy p{margin:1rem 0 0!important;color:#c9c4ca;line-height:1.6}.bmj-services__image{overflow:hidden;border-left:1px solid rgba(255,255,255,.2)}.bmj-services__image img{filter:saturate(.55) contrast(1.02)}.bmj-services__cta{display:inline-flex;margin-top:24px;padding:10px 0 4px;border-bottom:1px solid currentColor;color:#fff!important;text-decoration:none!important;font:700 .62rem/1 var(--bmj-mono);text-transform:uppercase;letter-spacing:.08em} /* DRAWER */ .bmj-drawer[hidden]{display:none!important}.bmj-drawer{position:fixed;inset:0;z-index:3000}.bmj-drawer__backdrop{position:absolute;inset:0;width:100%;height:100%;margin:0!important;padding:0!important;border:0!important;background:rgba(18,16,19,.46)!important;backdrop-filter:blur(3px);box-shadow:none!important}.bmj-drawer__panel{position:absolute;top:0;right:0;width:min(540px,92vw);height:100%;background:#f5f6f8;box-shadow:-18px 0 45px rgba(0,0,0,.13);overflow:auto;animation:bmj-slide-in .28s ease}.bmj-drawer__close{position:absolute;right:16px;top:16px;z-index:2;width:38px;height:38px;margin:0!important;padding:0!important;border:1px solid var(--bmj-line)!important;border-radius:50%!important;background:rgba(255,255,255,.92)!important;color:var(--bmj-ink)!important;box-shadow:none!important;font:300 1.5rem/1 var(--bmj-sans)!important}.bmj-drawer__image{height:46vh;min-height:290px}.bmj-drawer__image img{filter:saturate(.68)}.bmj-drawer__copy{padding:34px}.bmj-drawer__copy h2{margin:.8rem 0 0!important;color:var(--bmj-ink)!important;font:400 clamp(2.5rem,5vw,4.3rem)/.95 var(--bmj-serif)!important;letter-spacing:-.045em!important}.bmj-drawer__copy p{margin:1rem 0 0!important;color:var(--bmj-muted);line-height:1.65}.bmj-drawer__copy>a{display:inline-flex;margin-top:1.3rem;color:var(--bmj-ink)!important;text-decoration:none!important;border-bottom:1px solid currentColor;font:700 .61rem/1 var(--bmj-mono);text-transform:uppercase;letter-spacing:.08em}@keyframes bmj-slide-in{from{transform:translateX(100%)}to{transform:none}}body.bmj-drawer-open{overflow:hidden} /* FOOTER */ .bmj-footer{background:#fff;border-top:1px solid var(--bmj-line)}.bmj-footer__inner{padding:34px 0 24px}.bmj-footer__top{display:grid;grid-template-columns:minmax(150px,.8fr) minmax(0,1.2fr);align-items:center;gap:3rem;padding-bottom:30px}.bmj-footer__brand{display:inline-flex;width:max-content;max-width:100%;align-items:center;text-decoration:none!important}.bmj-footer-logo{display:block!important;width:auto!important;height:auto!important;max-width:128px!important;max-height:42px!important;object-fit:contain!important}.bmj-footer__fallback{font:700 1.12rem/1 var(--bmj-serif);color:var(--bmj-ink)}.bmj-footer__nav{justify-self:end}.bmj-footer-menu{display:flex;align-items:center;justify-content:flex-end;gap:1.45rem;flex-wrap:wrap}.bmj-footer-menu a,.bmj-footer__contact,.bmj-footer__top-link{font:700 .58rem/1 var(--bmj-mono)!important;text-transform:uppercase;letter-spacing:.075em;text-decoration:none!important;color:var(--bmj-ink)!important}.bmj-footer-menu a,.bmj-footer__contact{transition:color .18s ease}.bmj-footer-menu a:hover,.bmj-footer-menu a:focus-visible,.bmj-footer__contact:hover,.bmj-footer__contact:focus-visible{color:var(--bmj-plum)!important}.bmj-footer__bottom{display:grid;grid-template-columns:1fr auto auto;align-items:center;gap:1.5rem;padding-top:19px;border-top:1px solid var(--bmj-line)}.bmj-footer small{font:700 .55rem/1.35 var(--bmj-mono);letter-spacing:.03em;color:var(--bmj-muted)}.bmj-footer__contact{display:inline-flex;align-items:center;gap:.35rem}.bmj-footer__top-link{display:inline-flex!important;align-items:center;gap:.4rem;margin:0!important;padding:4px 0!important;border:0!important;border-radius:0!important;background:transparent!important;box-shadow:none!important;cursor:pointer}.bmj-footer__top-link span{transition:transform .18s ease}.bmj-footer__top-link:hover span,.bmj-footer__top-link:focus-visible span{transform:translateY(-2px)} /* TABLET */ @media(max-width:1099px){.bmj-header-logo{max-width:108px!important;max-height:36px!important}.bmj-stage__shell{grid-template-columns:minmax(0,1.3fr) minmax(290px,.7fr);min-height:540px}.bmj-stage__content{padding:26px}.bmj-stage__panel h2{font-size:clamp(2.7rem,5vw,4.6rem)!important}.bmj-explore__body{grid-template-columns:220px 1fr}.bmj-explore__preview{grid-template-columns:1.15fr .85fr}.bmj-explore__preview-copy{padding:28px}.bmj-services__interface{grid-template-columns:220px 1fr}.bmj-services__panel{grid-template-columns:.82fr 1.18fr}} @media(max-width:820px){.bmj-visual-break{height:clamp(250px,42vw,340px)}.bmj-header__inner{min-height:60px;grid-template-columns:1fr auto auto;gap:.7rem}.bmj-header-logo{max-width:98px!important;max-height:33px!important}.bmj-nav{display:none}.bmj-menu-toggle{display:block}.bmj-stage{padding-top:18px}.bmj-stage__shell{grid-template-columns:1fr;min-height:auto}.bmj-stage__visual{min-height:420px}.bmj-stage__content{min-height:330px;border-left:0;border-top:1px solid var(--bmj-line)}.bmj-stage__panels{margin-top:28px}.bmj-stage__rail{overflow-x:auto;grid-template-columns:repeat(4,minmax(150px,1fr));scrollbar-width:none}.bmj-stage__rail::-webkit-scrollbar{display:none}.bmj-explore{padding:68px 0 72px}.bmj-explore__head{align-items:flex-start;flex-direction:column}.bmj-explore__categories{justify-content:flex-start}.bmj-explore__body{grid-template-columns:1fr}.bmj-explore__lists{border-right:0;border-bottom:1px solid var(--bmj-line)}.bmj-explore__list.is-active{display:grid;grid-template-columns:repeat(3,1fr)}.bmj-explore__item{grid-template-columns:1fr;gap:.6rem;min-height:105px;border-right:1px solid var(--bmj-line)!important}.bmj-explore__item:last-child{border-right:0!important}.bmj-explore__preview{grid-template-columns:1.1fr .9fr}.bmj-explore__preview-image{min-height:390px}.bmj-services{padding:58px 0 62px}.bmj-services__head{grid-template-columns:1fr;gap:.5rem}.bmj-services__interface{grid-template-columns:1fr;min-height:auto}.bmj-services__tabs{display:grid;grid-template-columns:repeat(3,1fr);border-right:0;border-bottom:1px solid rgba(255,255,255,.2)}.bmj-services__tabs button{grid-template-columns:1fr;gap:.6rem;min-height:100px;border-right:1px solid rgba(255,255,255,.18)!important}.bmj-services__stage{height:350px}.bmj-services__panel{grid-template-columns:1fr 1.2fr}.bmj-footer__top{grid-template-columns:1fr;align-items:start;gap:1.5rem}.bmj-footer__nav{justify-self:start}.bmj-footer-menu{justify-content:flex-start}.bmj-footer__bottom{grid-template-columns:1fr auto;row-gap:1rem}.bmj-footer__top-link{grid-column:2;grid-row:1}.bmj-footer__contact{grid-column:2;grid-row:2}.bmj-footer small{grid-column:1;grid-row:1 / span 2;align-self:center}} /* MOBILE */ @media(max-width:600px){.bmj-right-now-trigger__text{display:none}.bmj-right-now-trigger{padding:10px!important}.bmj-right-now-trigger__dot{width:8px;height:8px;flex-basis:8px}:root{--bmj-shell:calc(100vw - 28px)}.bmj-header-logo{max-width:88px!important;max-height:30px!important}.bmj-stage__visual{min-height:330px}.bmj-stage__content{min-height:315px;padding:22px}.bmj-stage__intro{font-size:.85rem}.bmj-stage__panel h2{font-size:clamp(2.65rem,13vw,4.1rem)!important}.bmj-stage__rail{width:100%;padding-left:14px;padding-right:14px;border-inline:0;grid-template-columns:repeat(4,minmax(132px,1fr))}.bmj-stage__tab{min-height:54px;padding:12px 13px!important}.bmj-explore__head h2{font-size:clamp(2.8rem,15vw,4.5rem)!important}.bmj-explore__categories{flex-wrap:nowrap;width:100%;overflow-x:auto;padding-bottom:3px;scrollbar-width:none}.bmj-explore__categories::-webkit-scrollbar{display:none}.bmj-explore__categories button{flex:0 0 auto}.bmj-explore__list.is-active{grid-template-columns:1fr}.bmj-explore__item{grid-template-columns:30px 1fr;min-height:70px;border-right:0!important}.bmj-explore__preview{grid-template-columns:1fr}.bmj-explore__preview-image{min-height:320px}.bmj-explore__preview-copy{padding:24px 0 8px;border-left:0}.bmj-explore__preview-copy h3{font-size:clamp(2.4rem,12vw,3.7rem)!important}.bmj-visual-break{height:clamp(220px,58vw,320px);min-height:0;max-height:none}.bmj-visual-break__meta{right:14px;bottom:14px;min-width:112px;padding:10px 12px}.bmj-services__tabs{grid-template-columns:1fr}.bmj-services__tabs button{grid-template-columns:30px 1fr;min-height:64px;border-right:0!important}.bmj-services__stage{height:455px}.bmj-services__panel{grid-template-columns:1fr;grid-template-rows:auto 1fr}.bmj-services__copy{padding:24px 0}.bmj-services__image{border-left:0;border-top:1px solid rgba(255,255,255,.2);min-height:290px}.bmj-drawer__panel{top:auto;bottom:0;width:100%;height:min(88vh,760px);border-radius:18px 18px 0 0;animation:bmj-sheet-in .28s ease}.bmj-drawer__image{height:34vh;min-height:220px}.bmj-drawer__copy{padding:26px 22px 34px}@keyframes bmj-sheet-in{from{transform:translateY(100%)}to{transform:none}}.bmj-footer__inner{padding:28px 0 22px}.bmj-footer__top{padding-bottom:24px}.bmj-footer-logo{max-width:112px!important;max-height:38px!important}.bmj-footer-menu{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));width:100%;gap:0}.bmj-footer-menu li{border-top:1px solid var(--bmj-line)}.bmj-footer-menu li:nth-last-child(-n+2){border-bottom:1px solid var(--bmj-line)}.bmj-footer-menu a{display:block;padding:13px 0}.bmj-footer__bottom{grid-template-columns:1fr;gap:1rem;padding-top:18px}.bmj-footer small,.bmj-footer__contact,.bmj-footer__top-link{grid-column:1;grid-row:auto;justify-self:start}.bmj-footer__contact{margin-top:2px!important}} @media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}.bmj-stage__image,.bmj-stage__panel,.bmj-work-card img,.bmj-visual-break img,.bmj-right-now-trigger__text,.bmj-drawer__panel{transition:none!important;animation:none!important}} /* ========================================================= v0.8 — OPENING EXPERIENCE + LOGO SCALE Browse remains the structured interface; the opening now behaves like a single editorial stage instead of repeating it. ========================================================= */ /* Header logo: larger visual mark, while keeping the header restrained. */ .bmj-header__inner{ min-height:74px; } .bmj-header-logo{ max-width:190px!important; max-height:58px!important; } .bmj-wordmark{ overflow:visible; } /* Opening stage — one image-led canvas with floating UI. */ .bmj-stage{ padding:28px 0 72px; background:var(--bmj-bg); } .bmj-stage__frame{ position:relative; min-height:650px; overflow:hidden; border:1px solid var(--bmj-line); background:#d5d8dd; isolation:isolate; } .bmj-stage__visual{ position:absolute; inset:0; overflow:hidden; background:#d5d8dd; } .bmj-stage__image{ position:absolute; inset:0; margin:0; opacity:0; transform:scale(1.025); transition:opacity .36s ease,transform .7s cubic-bezier(.2,.7,.2,1); } .bmj-stage__image.is-active{ opacity:1; transform:scale(1); } .bmj-stage__image img{ filter:saturate(.66) contrast(.98); transition:transform .65s ease,filter .3s ease; } .bmj-stage__frame:hover .bmj-stage__image.is-active img{ transform:scale(1.012); filter:saturate(.72) contrast(.99); } .bmj-stage__veil{ position:absolute; inset:0; z-index:1; pointer-events:none; background: linear-gradient(90deg,rgba(20,18,20,.04) 0%,rgba(20,18,20,.02) 48%,rgba(20,18,20,.14) 100%), linear-gradient(0deg,rgba(20,18,20,.16) 0%,transparent 35%); } .bmj-stage__content{ position:absolute; z-index:2; top:26px; right:26px; bottom:108px; width:min(390px,32%); min-height:0; display:flex; flex-direction:column; padding:26px 27px 28px; border:1px solid rgba(23,21,24,.16); background:rgba(255,255,255,.92); backdrop-filter:blur(13px); } .bmj-stage__intro{ max-width:25rem; margin:0!important; color:var(--bmj-muted); font-size:.88rem; line-height:1.55; } .bmj-stage__panels{ position:relative; flex:1; margin-top:30px; } .bmj-stage__panel{ position:absolute; inset:0; display:flex; flex-direction:column; justify-content:flex-end; opacity:0; pointer-events:none; transform:translateY(10px); transition:opacity .25s ease,transform .3s ease; } .bmj-stage__panel.is-active{ opacity:1; pointer-events:auto; transform:none; } .bmj-stage__panel h2{ max-width:8ch; margin:.75rem 0 0!important; color:var(--bmj-ink)!important; font:400 clamp(2.8rem,4.25vw,5rem)/.93 var(--bmj-serif)!important; letter-spacing:-.05em!important; } .bmj-stage__panel p{ max-width:28rem; margin:1rem 0 0!important; color:var(--bmj-muted); line-height:1.58; } .bmj-stage__rail{ position:absolute; z-index:3; left:20px; right:20px; bottom:20px; width:auto; display:grid; grid-template-columns:repeat(4,1fr); border:1px solid rgba(23,21,24,.14); background:rgba(255,255,255,.93); backdrop-filter:blur(12px); } .bmj-stage__tab{ display:flex!important; align-items:center; gap:.75rem; min-height:64px; margin:0!important; padding:14px 16px!important; border:0!important; border-right:1px solid var(--bmj-line)!important; border-radius:0!important; background:transparent!important; color:var(--bmj-ink)!important; box-shadow:none!important; text-align:left; cursor:pointer; transition:background .18s ease,box-shadow .18s ease; } .bmj-stage__tab:last-child{ border-right:0!important; } .bmj-stage__tab small{ font:700 .55rem/1 var(--bmj-mono); color:var(--bmj-muted); } .bmj-stage__tab span{ font:400 1.03rem/1 var(--bmj-serif); } .bmj-stage__tab:hover, .bmj-stage__tab:focus-visible{ background:rgba(94,84,111,.045)!important; } .bmj-stage__tab.is-active{ background:rgba(94,84,111,.085)!important; box-shadow:inset 0 -3px 0 var(--bmj-plum)!important; } /* Tablet: keep the visual first, then content. This is a designed stack, not a squeezed desktop overlay. */ @media(max-width:1099px){ .bmj-header-logo{ max-width:175px!important; max-height:54px!important; } .bmj-stage__frame{ min-height:610px; } .bmj-stage__content{ width:min(360px,35%); } .bmj-stage__panel h2{ font-size:clamp(2.65rem,5vw,4.45rem)!important; } } @media(max-width:820px){ .bmj-header__inner{ min-height:68px; } .bmj-header-logo{ max-width:158px!important; max-height:50px!important; } .bmj-stage{ padding:18px 0 58px; } .bmj-stage__frame{ display:grid; grid-template-rows:430px auto auto; min-height:0; overflow:hidden; background:#fff; } .bmj-stage__visual{ position:relative; inset:auto; grid-row:1; min-height:430px; } .bmj-stage__veil{ grid-row:1; } .bmj-stage__content{ position:relative; inset:auto; grid-row:2; width:auto; min-height:310px; padding:25px 26px 28px; border:0; border-top:1px solid var(--bmj-line); background:#fff; backdrop-filter:none; } .bmj-stage__panels{ margin-top:24px; } .bmj-stage__rail{ position:relative; inset:auto; grid-row:3; width:100%; overflow-x:auto; grid-template-columns:repeat(4,minmax(150px,1fr)); border:0; border-top:1px solid var(--bmj-line); background:#fff; backdrop-filter:none; scrollbar-width:none; } .bmj-stage__rail::-webkit-scrollbar{ display:none; } .bmj-stage__tab{ min-height:58px; } } @media(max-width:600px){ .bmj-header__inner{ min-height:62px; } .bmj-header-logo{ max-width:142px!important; max-height:46px!important; } .bmj-stage__frame{ grid-template-rows:320px auto auto; } .bmj-stage__visual{ min-height:320px; } .bmj-stage__content{ min-height:300px; padding:22px 21px 25px; } .bmj-stage__intro{ font-size:.83rem; } .bmj-stage__panel h2{ font-size:clamp(2.55rem,12.5vw,3.95rem)!important; } .bmj-stage__rail{ grid-template-columns:repeat(4,minmax(132px,1fr)); } .bmj-stage__tab{ min-height:55px; padding:12px 13px!important; } } @media(prefers-reduced-motion:reduce){ .bmj-stage__image, .bmj-stage__image img, .bmj-stage__panel, .bmj-stage__tab{ transition:none!important; } } /* ========================================================= v0.9 / v1.0.8 — QUIET HOMEPAGE ABOUT CLOSER ========================================================= */ .bmj-endcap{ background:var(--bmj-paper); border-top:1px solid rgba(21,20,22,.09); border-bottom:1px solid var(--bmj-line); } .bmj-endcap__inner{ padding:clamp(56px,7vw,88px) 0 clamp(60px,8vw,98px); } .bmj-endcap .bmj-endcap__about-link{ margin-top:1.65rem; } @media(max-width:820px){ .bmj-endcap__inner{ padding:52px 0 62px; } } @media(max-width:600px){ .bmj-endcap__inner{ padding:44px 0 52px; } } /* ========================================================= v0.10 — FINAL HOMEPAGE COPY PASS ========================================================= */ .bmj-explore__title p{ margin:.8rem 0 0!important; color:var(--bmj-muted); font-size:.92rem; line-height:1.5; } .bmj-services__head{ align-items:start; } .bmj-services__head-copy{ max-width:860px; } .bmj-services__head h2{ max-width:13ch; font-size:clamp(2.8rem,4.6vw,4.9rem)!important; line-height:.93!important; } .bmj-services__head-copy>p{ max-width:46rem; margin:1.1rem 0 0!important; color:#c9c4ca; font-size:.96rem; line-height:1.62; } .bmj-services__tabs button span{ line-height:1.1; } @media(max-width:820px){ .bmj-services__head-copy{ max-width:680px; } .bmj-services__tabs{ grid-template-columns:repeat(2,1fr); } } @media(max-width:600px){ .bmj-services__tabs{ grid-template-columns:1fr; } .bmj-services__head h2{ max-width:12ch; font-size:clamp(2.6rem,12vw,3.8rem)!important; } } /* ========================================================= v0.14 — BROWSE WITHOUT PRE-SEGMENTING CONTENT ========================================================= */ .bmj-explore__list button span:first-child{ letter-spacing:-.02em; } .bmj-explore__preview p:empty, .bmj-drawer__text:empty{ display:none; } /* ========================================================= v0.15 — FLOW / PURPOSE CLEANUP ========================================================= */ /* The opening rail is four rotating highlights, not another category system. */ .bmj-stage__tab{ justify-content:center; text-align:center; } .bmj-stage__tab span{ font:700 .63rem/1 var(--bmj-mono); letter-spacing:.10em; color:var(--bmj-ink); } .bmj-stage__panel p:empty, .bmj-explore__preview p:empty, .bmj-drawer__text:empty{ display:none; } /* The visual break is now purely a breath in the page rhythm. */ .bmj-visual-break{ cursor:default!important; pointer-events:none; } .bmj-visual-break__meta{ display:none!important; } /* Accessible tab panels should disappear completely when inactive. */ [role="tabpanel"][hidden]{ display:none!important; } @media(prefers-reduced-motion:reduce){ .bmj-stage__tab, .bmj-explore__categories button, .bmj-services__tabs button{ transition:none!important; } } /* ========================================================= v0.16 — BLOG / WRITING SYSTEM Hybrid editorial: polished presentation without topic boxes. ========================================================= */ /* Remove Astra's page-width constraints on BMJ publishing templates. */ body.bmj-blog-page #content, body.bmj-blog-page #content.site-content, body.bmj-single-writing #content, body.bmj-single-writing #content.site-content{ padding:0!important; margin:0!important; width:100%!important; max-width:none!important; } body.bmj-blog-page #content>.ast-container, body.bmj-single-writing #content>.ast-container{ display:block!important; width:100%!important; max-width:none!important; margin:0!important; padding:0!important; } body.bmj-blog-page #primary, body.bmj-blog-page .site-main, body.bmj-single-writing #primary, body.bmj-single-writing .site-main{ width:100%!important; max-width:none!important; margin:0!important; padding:0!important; } .bmj-blog, .bmj-article{ width:100%; background:#fff; color:var(--bmj-ink); font-family:var(--bmj-sans); } .bmj-blog *, .bmj-article *{ box-sizing:border-box; } .bmj-blog img, .bmj-article img{ display:block; max-width:100%; height:auto; } /* Shared small editorial metadata */ .bmj-writing-meta{ display:flex; flex-wrap:wrap; align-items:center; gap:.45rem; color:var(--bmj-muted); font:700 .57rem/1.3 var(--bmj-mono); text-transform:uppercase; letter-spacing:.07em; } .bmj-inline-link{ display:inline-flex; align-items:center; gap:.48rem; width:max-content; margin-top:1.25rem; padding:0 0 .3rem; border-bottom:1px solid currentColor; color:var(--bmj-ink)!important; text-decoration:none!important; font:700 .61rem/1 var(--bmj-mono); text-transform:uppercase; letter-spacing:.08em; } .bmj-inline-link span{ color:var(--bmj-plum); transition:transform .18s ease; } .bmj-inline-link:hover span, .bmj-inline-link:focus-visible span{ transform:translate(2px,-2px); } /* BLOG MASTHEAD */ .bmj-blog__masthead{ padding:clamp(54px,8vw,108px) 0 clamp(30px,4vw,52px); background:var(--bmj-bg); border-bottom:1px solid var(--bmj-line); } .bmj-blog__masthead-inner{ display:grid; grid-template-columns:minmax(90px,.24fr) 1fr; align-items:end; gap:clamp(24px,5vw,80px); } .bmj-blog__masthead h1{ margin:0!important; color:var(--bmj-ink)!important; font:400 clamp(4.6rem,10vw,9.6rem)/.78 var(--bmj-serif)!important; letter-spacing:-.07em!important; } /* LATEST */ .bmj-blog-lead{ padding:clamp(30px,4vw,58px) 0 clamp(64px,8vw,112px); background:var(--bmj-bg); } .bmj-blog-lead__grid{ display:grid; grid-template-columns:minmax(0,1.35fr) minmax(330px,.65fr); min-height:clamp(500px,58vw,720px); border:1px solid var(--bmj-line); background:#fff; } .bmj-blog-lead__media{ position:relative; display:block; min-height:500px; overflow:hidden; background:#d9dce1; border-right:1px solid var(--bmj-line); text-decoration:none!important; } .bmj-blog-lead__media img{ width:100%; height:100%; object-fit:cover; filter:saturate(.76) contrast(.99); transition:transform .5s cubic-bezier(.2,.7,.2,1),filter .25s ease; } .bmj-blog-lead__media:hover img, .bmj-blog-lead__media:focus-visible img{ transform:scale(1.012); filter:saturate(.84) contrast(1); } .bmj-blog-lead__media.is-empty, .bmj-blog-card__media.is-empty{ display:grid; place-items:center; background: linear-gradient(135deg,rgba(94,84,111,.09),rgba(156,32,40,.04)), var(--bmj-bg); color:var(--bmj-plum)!important; } .bmj-blog-lead__media.is-empty span, .bmj-blog-card__media.is-empty span{ font:700 .6rem/1 var(--bmj-mono); text-transform:uppercase; letter-spacing:.12em; } .bmj-blog-lead__copy{ display:flex; flex-direction:column; justify-content:flex-end; padding:clamp(28px,4vw,52px); } .bmj-blog-lead__copy .bmj-writing-meta{ margin-top:1rem; } .bmj-blog-lead__copy h2{ max-width:9ch; margin:1rem 0 0!important; font:400 clamp(3rem,5vw,5.8rem)/.91 var(--bmj-serif)!important; letter-spacing:-.055em!important; } .bmj-blog-lead__copy h2 a{ color:var(--bmj-ink)!important; text-decoration:none!important; } .bmj-blog-lead__copy>p{ max-width:32rem; margin:1.25rem 0 0!important; color:var(--bmj-muted); font-size:.98rem; line-height:1.67; } /* FEED */ .bmj-blog-feed{ padding:clamp(64px,8vw,112px) 0 clamp(84px,10vw,140px); background:#fff; } .bmj-blog-feed__head{ padding-bottom:22px; border-bottom:1px solid var(--bmj-line); } .bmj-blog-grid{ display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); border-left:1px solid var(--bmj-line); } .bmj-blog-card{ min-width:0; border-right:1px solid var(--bmj-line); border-bottom:1px solid var(--bmj-line); } .bmj-blog-card__media{ display:block; aspect-ratio:4/3; overflow:hidden; background:#d9dce1; text-decoration:none!important; border-bottom:1px solid var(--bmj-line); } .bmj-blog-card__media img{ width:100%; height:100%; object-fit:cover; filter:saturate(.74); transition:transform .4s cubic-bezier(.2,.7,.2,1),filter .2s ease; } .bmj-blog-card__media:hover img, .bmj-blog-card__media:focus-visible img{ transform:scale(1.015); filter:saturate(.84); } .bmj-blog-card__body{ display:flex; flex-direction:column; min-height:330px; padding:24px 23px 27px; } .bmj-blog-card__body h2{ margin:1rem 0 0!important; font:400 clamp(1.75rem,2.5vw,2.7rem)/1 var(--bmj-serif)!important; letter-spacing:-.035em!important; } .bmj-blog-card__body h2 a{ color:var(--bmj-ink)!important; text-decoration:none!important; } .bmj-blog-card__body>p{ margin:1rem 0 0!important; color:var(--bmj-muted); font-size:.91rem; line-height:1.62; } .bmj-blog-card__body .bmj-inline-link{ margin-top:auto; padding-top:1.5rem; } /* PAGINATION */ .bmj-pagination{ margin-top:44px; } .bmj-pagination .page-numbers{ list-style:none!important; display:flex; flex-wrap:wrap; gap:8px; margin:0!important; padding:0!important; } .bmj-pagination .page-numbers li{ margin:0!important; } .bmj-pagination a, .bmj-pagination span{ display:grid; place-items:center; min-width:42px; min-height:42px; padding:0 12px; border:1px solid var(--bmj-line); color:var(--bmj-ink)!important; text-decoration:none!important; font:700 .58rem/1 var(--bmj-mono); text-transform:uppercase; letter-spacing:.05em; } .bmj-pagination .current{ background:var(--bmj-ink); color:#fff!important; border-color:var(--bmj-ink); } .bmj-blog-empty{ padding:60px 0; border-top:1px solid var(--bmj-line); border-bottom:1px solid var(--bmj-line); } .bmj-blog-empty p{ margin:0!important; font:400 clamp(2rem,4vw,4rem)/1 var(--bmj-serif); } /* ========================================================= SINGLE WRITING ========================================================= */ .bmj-article__header{ padding:clamp(54px,8vw,110px) 0 clamp(38px,5vw,68px); background:var(--bmj-bg); border-bottom:1px solid var(--bmj-line); } .bmj-article__header-inner{ display:grid; grid-template-columns:minmax(90px,.22fr) minmax(0,1fr); column-gap:clamp(28px,6vw,96px); } .bmj-article__back{ grid-column:1; grid-row:1 / span 4; align-self:start; width:max-content; color:var(--bmj-ink)!important; text-decoration:none!important; font:700 .59rem/1 var(--bmj-mono); text-transform:uppercase; letter-spacing:.08em; } .bmj-article__header .bmj-writing-meta{ grid-column:2; } .bmj-article__header h1{ grid-column:2; max-width:13ch; margin:1rem 0 0!important; color:var(--bmj-ink)!important; font:400 clamp(3.7rem,7.4vw,8rem)/.88 var(--bmj-serif)!important; letter-spacing:-.062em!important; text-wrap:balance; } .bmj-article__dek{ grid-column:2; max-width:48rem; margin:1.6rem 0 0!important; color:var(--bmj-muted); font:400 clamp(1.15rem,1.8vw,1.5rem)/1.5 var(--bmj-serif)!important; } .bmj-article__hero{ margin-top:clamp(24px,4vw,56px); margin-bottom:clamp(50px,7vw,92px); overflow:hidden; background:#d9dce1; } .bmj-article__hero img{ width:100%; max-height:min(78vh,900px); object-fit:cover; filter:saturate(.82); } .bmj-article__body{ padding:0 0 clamp(80px,10vw,140px); } .bmj-article__content{ width:min(760px,calc(100vw - 40px)); margin-inline:auto; color:#29262a; font-size:1.08rem; line-height:1.82; } .bmj-article__content>*:first-child{ margin-top:0; } .bmj-article__content p{ margin:0 0 1.55em!important; font:400 1.08rem/1.82 var(--bmj-sans)!important; } .bmj-article__content h2{ margin:2.2em 0 .72em!important; color:var(--bmj-ink)!important; font:400 clamp(2.25rem,4vw,3.6rem)/1 var(--bmj-serif)!important; letter-spacing:-.04em!important; } .bmj-article__content h3{ margin:2em 0 .7em!important; color:var(--bmj-ink)!important; font:400 clamp(1.55rem,2.5vw,2.25rem)/1.08 var(--bmj-serif)!important; letter-spacing:-.025em!important; } .bmj-article__content h4, .bmj-article__content h5, .bmj-article__content h6{ margin:2em 0 .7em!important; color:var(--bmj-ink)!important; font-family:var(--bmj-sans)!important; font-weight:700!important; line-height:1.2!important; } .bmj-article__content ul, .bmj-article__content ol{ margin:0 0 1.7em 1.2em!important; padding:0 0 0 1.1em!important; } .bmj-article__content li{ margin:.45em 0!important; padding-left:.3em; } .bmj-article__content a{ color:var(--bmj-plum)!important; text-decoration-thickness:1px!important; text-underline-offset:.18em; } .bmj-article__content blockquote{ margin:2.4em 0!important; padding:.2em 0 .2em clamp(22px,4vw,42px)!important; border-left:2px solid var(--bmj-plum)!important; color:var(--bmj-ink); } .bmj-article__content blockquote p{ margin:0!important; font:400 clamp(1.6rem,3vw,2.45rem)/1.25 var(--bmj-serif)!important; letter-spacing:-.025em; } .bmj-article__content figure{ margin:2.6em 0!important; } .bmj-article__content figcaption{ margin:.75rem 0 0!important; color:var(--bmj-muted); font-size:.78rem; line-height:1.45; } .bmj-article__content .alignwide{ width:min(1080px,calc(100vw - 40px)); max-width:none; margin-left:50%!important; transform:translateX(-50%); } .bmj-article__content .alignfull{ width:100vw; max-width:none; margin-left:50%!important; transform:translateX(-50%); } .bmj-article__content .wp-block-image img, .bmj-article__content .wp-block-gallery img{ width:100%; height:auto; } .bmj-article__content .wp-block-separator{ width:100%; margin:3rem 0!important; border:0!important; border-top:1px solid var(--bmj-line)!important; } .bmj-article__content pre, .bmj-article__content code{ font-family:var(--bmj-mono); } .bmj-article__content pre{ overflow:auto; margin:2rem 0!important; padding:20px; background:#eff0f2; border:1px solid var(--bmj-line); font-size:.86rem; line-height:1.6; } .bmj-article__content table{ width:100%; margin:2rem 0; border-collapse:collapse; font-size:.92rem; } .bmj-article__content th, .bmj-article__content td{ padding:12px; border:1px solid var(--bmj-line); text-align:left; vertical-align:top; } .bmj-article__content hr{ margin:3rem 0; border:0; border-top:1px solid var(--bmj-line); } .bmj-article__pages{ margin-top:3rem; font:700 .6rem/1.5 var(--bmj-mono); text-transform:uppercase; letter-spacing:.06em; } /* Article ending */ .bmj-article__footer{ padding:clamp(55px,7vw,92px) 0; background:#f7f7f8; border-top:1px solid var(--bmj-line); } .bmj-article__footer-head{ display:flex; align-items:center; justify-content:space-between; gap:2rem; padding-bottom:22px; } .bmj-article__footer-head>a{ color:var(--bmj-ink)!important; text-decoration:none!important; font:700 .59rem/1 var(--bmj-mono); text-transform:uppercase; letter-spacing:.07em; } .bmj-article-nav{ display:grid; grid-template-columns:1fr 1fr; border-top:1px solid var(--bmj-line); border-bottom:1px solid var(--bmj-line); } .bmj-article-nav__item{ position:relative; display:flex; min-height:190px; flex-direction:column; justify-content:flex-end; padding:26px 70px 26px 24px; border-right:1px solid var(--bmj-line); color:var(--bmj-ink)!important; text-decoration:none!important; transition:background .18s ease; } .bmj-article-nav__item:nth-child(2){ border-right:0; } .bmj-article-nav__item small{ margin-bottom:.75rem; color:var(--bmj-muted); font:700 .55rem/1 var(--bmj-mono); text-transform:uppercase; letter-spacing:.08em; } .bmj-article-nav__item strong{ max-width:18ch; font:400 clamp(1.55rem,2.5vw,2.4rem)/1.02 var(--bmj-serif); letter-spacing:-.03em; } .bmj-article-nav__item>span{ position:absolute; right:24px; bottom:28px; color:var(--bmj-plum); font-size:1.1rem; transition:transform .18s ease; } .bmj-article-nav__item:hover, .bmj-article-nav__item:focus-visible{ background:rgba(94,84,111,.05); } .bmj-article-nav__item:hover>span{ transform:translateX(-3px); } .bmj-article-nav__item.is-next{ padding:26px 24px 26px 70px; text-align:right; align-items:flex-end; } .bmj-article-nav__item.is-next>span{ left:24px; right:auto; } .bmj-article-nav__item.is-next:hover>span{ transform:translateX(3px); } .bmj-article-nav__item.is-empty{ pointer-events:none; min-height:0; } /* TABLET */ @media(max-width:900px){ .bmj-blog__masthead-inner{ grid-template-columns:1fr; gap:18px; } .bmj-blog-lead__grid{ grid-template-columns:1.1fr .9fr; } .bmj-blog-grid{ grid-template-columns:repeat(2,minmax(0,1fr)); } .bmj-article__header-inner{ grid-template-columns:1fr; } .bmj-article__back{ grid-column:1; grid-row:auto; margin-bottom:36px; } .bmj-article__header .bmj-writing-meta, .bmj-article__header h1, .bmj-article__dek{ grid-column:1; } } /* MOBILE */ @media(max-width:650px){ .bmj-blog__masthead{ padding:48px 0 30px; } .bmj-blog__masthead h1{ font-size:clamp(4.1rem,24vw,6.2rem)!important; } .bmj-blog-lead{ padding:18px 0 66px; } .bmj-blog-lead__grid{ grid-template-columns:1fr; min-height:0; } .bmj-blog-lead__media{ min-height:0; aspect-ratio:4/3; border-right:0; border-bottom:1px solid var(--bmj-line); } .bmj-blog-lead__copy{ padding:25px 22px 30px; } .bmj-blog-lead__copy h2{ max-width:12ch; font-size:clamp(2.9rem,14vw,4.3rem)!important; } .bmj-blog-feed{ padding:64px 0 88px; } .bmj-blog-grid{ grid-template-columns:1fr; } .bmj-blog-card__body{ min-height:280px; } .bmj-blog-card__body h2{ font-size:clamp(2rem,10vw,2.8rem)!important; } .bmj-article__header{ padding:48px 0 38px; } .bmj-article__back{ margin-bottom:30px; } .bmj-article__header h1{ max-width:100%; font-size:clamp(3.2rem,16vw,5rem)!important; } .bmj-article__dek{ font-size:1.1rem!important; } .bmj-article__hero{ width:calc(100vw - 28px); margin-top:18px; margin-bottom:48px; } .bmj-article__content{ width:calc(100vw - 36px); font-size:1rem; } .bmj-article__content p{ font-size:1rem!important; line-height:1.78!important; } .bmj-article__content .alignwide{ width:calc(100vw - 28px); } .bmj-article__footer-head{ align-items:flex-start; flex-direction:column; gap:14px; } .bmj-article-nav{ grid-template-columns:1fr; } .bmj-article-nav__item{ min-height:150px; border-right:0; border-bottom:1px solid var(--bmj-line); } .bmj-article-nav__item:nth-child(2){ border-bottom:0; } .bmj-article-nav__item.is-empty{ display:none; } .bmj-article-nav__item.is-next{ align-items:flex-start; padding:26px 70px 26px 24px; text-align:left; } .bmj-article-nav__item.is-next>span{ left:auto; right:24px; } } @media(prefers-reduced-motion:reduce){ .bmj-inline-link span, .bmj-blog-lead__media img, .bmj-blog-card__media img, .bmj-article-nav__item, .bmj-article-nav__item>span{ transition:none!important; } } /* ========================================================= v0.16.1 — IMAGE-OPTIONAL WRITING Posts without featured images become typography-led layouts rather than looking like an image failed to load. ========================================================= */ /* Lead story without image: editorial text feature */ .bmj-blog-lead.is-text-only .bmj-blog-lead__grid{ grid-template-columns:minmax(0,1fr); min-height:0; background:var(--bmj-ink); border-color:var(--bmj-ink); } .bmj-blog-lead.is-text-only .bmj-blog-lead__copy{ min-height:clamp(430px,52vw,650px); justify-content:flex-end; padding:clamp(32px,6vw,76px); } .bmj-blog-lead.is-text-only .bmj-kicker, .bmj-blog-lead.is-text-only .bmj-writing-meta, .bmj-blog-lead.is-text-only .bmj-blog-lead__copy>p{ color:rgba(255,255,255,.65); } .bmj-blog-lead.is-text-only .bmj-blog-lead__copy h2{ max-width:12ch; } .bmj-blog-lead.is-text-only .bmj-blog-lead__copy h2 a, .bmj-blog-lead.is-text-only .bmj-inline-link{ color:#fff!important; } .bmj-blog-lead.is-text-only .bmj-inline-link span{ color:#b9aec8; } /* Feed card without image: deliberately text-first */ .bmj-blog-card__body.is-text-only{ position:relative; min-height:430px; padding:30px 26px 30px; background:linear-gradient(180deg,rgba(94,84,111,.045),rgba(94,84,111,0)); } .bmj-blog-card__body.is-text-only::before{ content:"Writing"; display:block; margin-bottom:auto; padding-bottom:44px; color:var(--bmj-plum); font:700 .55rem/1 var(--bmj-mono); text-transform:uppercase; letter-spacing:.11em; } .bmj-blog-card__body.is-text-only h2{ font-size:clamp(2.25rem,3.4vw,3.5rem)!important; max-width:10ch; } .bmj-blog-card__body.is-text-only>p{ max-width:30rem; } /* Single articles already omit the hero cleanly when no featured image. Give the body slightly more breathing room in that case. */ .bmj-single-writing .bmj-article__header + .bmj-article__body{ padding-top:clamp(48px,7vw,88px); } .bmj-single-writing .bmj-article__hero + .bmj-article__body{ padding-top:0; } @media(max-width:650px){ .bmj-blog-lead.is-text-only .bmj-blog-lead__copy{ min-height:430px; padding:30px 22px 34px; } .bmj-blog-card__body.is-text-only{ min-height:360px; } } /* ========================================================= v0.16.2 — APPROVED HOMEPAGE COPY RESTORE ========================================================= */ .bmj-stage__tab{ justify-content:flex-start; text-align:left; } .bmj-stage__tab small{ display:block; color:var(--bmj-plum); font:700 .56rem/1 var(--bmj-mono); letter-spacing:.08em; } .bmj-stage__tab span{ font:700 .63rem/1 var(--bmj-mono); text-transform:uppercase; letter-spacing:.08em; } .bmj-visual-break{ cursor:pointer!important; pointer-events:auto!important; } .bmj-visual-break__meta{ display:grid!important; } [role="tabpanel"][hidden]{ display:none!important; } /* ========================================================= v0.16.6 — COPY/FLOW ONLY Preserve the approved visual design. Two font families total: display + body/interface. ========================================================= */ /* Opening: give the two thoughts enough room inside the existing stage. */ .bmj-stage__intro-block{ max-width:26rem; } .bmj-stage__intro{ max-width:20rem!important; margin:0!important; color:var(--bmj-ink)!important; font-family:var(--bmj-serif)!important; font-size:clamp(1.18rem,1.45vw,1.42rem)!important; font-weight:400!important; line-height:1.18!important; letter-spacing:-.018em!important; } .bmj-stage__intro-context{ max-width:25rem; margin:14px 0 0!important; color:var(--bmj-muted); font-family:var(--bmj-sans)!important; font-size:.84rem; font-weight:400; line-height:1.58; } .bmj-stage__panels{ margin-top:34px!important; } /* Interface labels are body/interface typography, not a third typeface. */ .bmj-stage__tab span{ font-family:var(--bmj-sans)!important; font-weight:600!important; letter-spacing:-.01em!important; } /* Browse purpose is integrated into the existing Browse header. */ .bmj-explore__title p{ max-width:42rem; font-family:var(--bmj-sans)!important; } /* Generational meaning anchors the quiet About MJ homepage closer. */ .bmj-endcap__lead{ max-width:34rem; } .bmj-endcap__lead .bmj-endcap__note{ max-width:32rem; margin:.8rem 0 0!important; color:var(--bmj-muted); font-family:var(--bmj-sans)!important; font-size:.88rem!important; font-weight:400!important; line-height:1.62!important; letter-spacing:0!important; } .bmj-endcap__lead .bmj-endcap__question{ max-width:31rem; margin:1.2rem 0 0!important; color:var(--bmj-charcoal); font-family:var(--bmj-serif)!important; font-size:clamp(1.25rem,1.65vw,1.65rem)!important; font-weight:400!important; line-height:1.2!important; letter-spacing:-.022em!important; } @media(max-width:820px){ .bmj-stage__intro-block{ max-width:32rem; } .bmj-stage__intro-context{ max-width:30rem; } .bmj-endcap__lead{ max-width:38rem; } .bmj-endcap__lead .bmj-endcap__note, .bmj-endcap__lead .bmj-endcap__question{ max-width:36rem; } } @media(max-width:600px){ .bmj-stage__intro{ font-size:1.15rem!important; } .bmj-stage__intro-context{ font-size:.83rem; line-height:1.55; } .bmj-stage__panels{ margin-top:28px!important; } .bmj-endcap__lead .bmj-endcap__question{ font-size:1.3rem!important; } } /* ========================================================= v0.16.8 — BROAD CONTENT ARCHITECTURE / RESPONSIVE POLISH ========================================================= */ /* No warm/beige article mastheads. */ .bmj-article__header{ background:#fff!important; } /* Right Now was removed from markup; make sure no stale control can surface. */ .bmj-right-now-trigger{ display:none!important; } /* Featured stage: same interactive design, now driven by actual content titles. */ .bmj-stage__rail{ grid-template-columns:repeat(var(--bmj-stage-count,4),minmax(0,1fr))!important; } .bmj-stage__tab{ transition:background .18s ease,box-shadow .18s ease,transform .18s ease!important; } .bmj-stage__tab span{ min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; } .bmj-stage__tab:hover, .bmj-stage__tab:focus-visible{ background:rgba(94,84,111,.055)!important; transform:translateY(-1px); } .bmj-stage__tab.is-active{ transform:none; } /* Restore a stronger sense of visual response without changing the structure. */ .bmj-stage__frame:hover .bmj-stage__image.is-active img{ transform:scale(1.018); } .bmj-explore__categories button{ transition:background .18s ease,color .18s ease,border-color .18s ease,transform .18s ease!important; } .bmj-explore__categories button:hover, .bmj-explore__categories button:focus-visible{ border-color:rgba(94,84,111,.48)!important; transform:translateY(-1px); } .bmj-explore__item{ transition:background .18s ease,box-shadow .18s ease!important; } .bmj-explore__item:hover, .bmj-explore__item:focus-visible{ background:rgba(94,84,111,.045)!important; } .bmj-explore__preview-image img{ transition:opacity .16s ease,transform .45s cubic-bezier(.2,.7,.2,1)!important; } .bmj-explore__body:hover .bmj-explore__preview-image img{ transform:scale(1.008); } .bmj-services__tabs button{ transition:background .18s ease,box-shadow .18s ease!important; } .bmj-services__tabs button:hover, .bmj-services__tabs button:focus-visible{ background:rgba(255,255,255,.045)!important; } /* Tablet: intentionally recompose rather than shrinking desktop. */ @media(max-width:820px){ .bmj-header__inner{ grid-template-columns:1fr auto!important; } .bmj-menu-toggle{ grid-column:2; justify-self:end; } .bmj-stage__rail{ grid-template-columns:repeat(var(--bmj-stage-count,4),minmax(180px,1fr))!important; scroll-snap-type:x proximity; } .bmj-stage__tab{ scroll-snap-align:start; } .bmj-explore__categories{ scroll-snap-type:x proximity; } .bmj-explore__categories button{ scroll-snap-align:start; } } /* Mobile: each interaction becomes touch-first and comfortably sized. */ @media(max-width:600px){ .bmj-stage__rail{ grid-template-columns:repeat(var(--bmj-stage-count,4),minmax(170px,1fr))!important; } .bmj-stage__tab{ min-height:60px!important; padding:13px 14px!important; } .bmj-stage__tab span{ white-space:normal; display:-webkit-box; -webkit-box-orient:vertical; -webkit-line-clamp:2; line-height:1.15!important; } .bmj-explore__categories button{ min-height:42px; padding:10px 14px!important; } .bmj-explore__item{ min-height:78px!important; } .bmj-text-button, .bmj-services__cta{ min-height:38px; align-items:center; } } @media(prefers-reduced-motion:reduce){ .bmj-stage__tab, .bmj-explore__categories button, .bmj-explore__item, .bmj-explore__preview-image img, .bmj-services__tabs button{ transition:none!important; transform:none!important; } } /* ========================================================= v0.17 — FLEXIBLE PUBLISHING SYSTEM Articles + Items + Creative/Life/Resources hubs. Homepage remains untouched. ========================================================= */ /* ------------------------- SINGLE CONTENT HEADER ------------------------- */ .bmj-article__header{ background:#fff!important; padding:clamp(54px,7vw,104px) 0 clamp(40px,5vw,70px)!important; } .bmj-article__header-inner{ grid-template-columns:minmax(90px,.18fr) minmax(0,1fr)!important; column-gap:clamp(30px,6vw,96px)!important; } .bmj-article__heading{ grid-column:2; max-width:1050px; } .bmj-article__sections{ display:flex; flex-wrap:wrap; gap:8px 14px; margin:0 0 18px; } .bmj-article__sections a{ color:var(--bmj-plum)!important; text-decoration:none!important; font-family:var(--bmj-sans)!important; font-size:.66rem; font-weight:700; line-height:1; letter-spacing:.05em; text-transform:uppercase; } .bmj-article__heading .bmj-writing-meta{ margin-bottom:16px; } .bmj-article__header h1{ grid-column:auto!important; max-width:14ch!important; margin:0!important; font-size:clamp(3.6rem,7vw,7.6rem)!important; line-height:.91!important; } .bmj-article__dek{ grid-column:auto!important; max-width:52rem!important; margin:clamp(22px,3vw,36px) 0 0!important; color:var(--bmj-muted)!important; font-family:var(--bmj-sans)!important; font-size:clamp(1.08rem,1.5vw,1.28rem)!important; line-height:1.62!important; letter-spacing:-.01em!important; } .bmj-article__hero{ background:#d9dce1!important; } .bmj-article.is-text-led .bmj-article__header{ padding-bottom:clamp(58px,7vw,100px)!important; } /* ------------------------- FLEXIBLE ARTICLE BODY ------------------------- */ .bmj-article__body{ padding:clamp(54px,7vw,88px) 0 clamp(82px,10vw,132px)!important; } .bmj-article__hero + .bmj-article__body{ padding-top:0!important; } .bmj-article__content{ width:min(760px,calc(100vw - 40px))!important; } .bmj-article__content p{ font-family:var(--bmj-sans)!important; } .bmj-article__content .wp-block-heading{ scroll-margin-top:100px; } .bmj-article__content .wp-block-pullquote{ margin:3.2rem 0!important; padding:2.3rem 0!important; border-top:1px solid var(--bmj-line); border-bottom:1px solid var(--bmj-line); } .bmj-article__content .wp-block-pullquote blockquote{ margin:0!important; padding:0!important; border:0!important; text-align:left; } .bmj-article__content .wp-block-pullquote p{ font-family:var(--bmj-serif)!important; font-size:clamp(1.9rem,3.4vw,3rem)!important; line-height:1.2!important; } .bmj-article__content .wp-block-columns{ gap:clamp(22px,4vw,48px); margin:2.7rem 0!important; } .bmj-article__content .wp-block-media-text{ margin:2.8rem 0!important; gap:clamp(22px,4vw,48px); } .bmj-article__content .wp-block-media-text__content{ padding:0!important; } .bmj-article__content .wp-block-buttons{ margin:2rem 0!important; gap:10px; } .bmj-article__content .wp-block-button__link{ border-radius:0!important; background:var(--bmj-ink)!important; color:#fff!important; padding:.8rem 1.1rem!important; font-family:var(--bmj-sans)!important; font-size:.72rem!important; font-weight:700!important; letter-spacing:.04em!important; text-transform:uppercase; text-decoration:none!important; } .bmj-article__content .wp-block-button.is-style-outline .wp-block-button__link{ background:transparent!important; color:var(--bmj-ink)!important; border:1px solid var(--bmj-ink)!important; } .bmj-article__content .wp-block-file{ display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between; gap:14px; margin:2rem 0!important; padding:18px; border:1px solid var(--bmj-line); background:#f3f4f6; } .bmj-article__content .wp-block-file a{ font-family:var(--bmj-sans)!important; } .bmj-article__content .wp-block-file__button{ margin:0!important; border-radius:0!important; background:var(--bmj-plum)!important; color:#fff!important; padding:.65rem .9rem!important; font-size:.68rem!important; font-weight:700!important; text-decoration:none!important; text-transform:uppercase; letter-spacing:.04em; } .bmj-article__content .wp-block-details{ margin:2rem 0!important; padding:18px 0; border-top:1px solid var(--bmj-line); border-bottom:1px solid var(--bmj-line); } .bmj-article__content .wp-block-details summary{ cursor:pointer; font-family:var(--bmj-sans)!important; font-weight:700; } .bmj-article__content iframe, .bmj-article__content video{ max-width:100%; } .bmj-article__content .wp-block-embed{ margin:2.8rem 0!important; } .bmj-article__content .wp-block-audio{ margin:2.4rem 0!important; } /* ------------------------- RELATED CONTENT ------------------------- */ .bmj-related{ padding:clamp(66px,8vw,106px) 0; background:#f3f4f6; border-top:1px solid var(--bmj-line); } .bmj-related__head{ display:flex; align-items:end; justify-content:space-between; gap:30px; margin-bottom:28px; } .bmj-related__head h2{ max-width:13ch; margin:0!important; color:var(--bmj-ink)!important; font-family:var(--bmj-serif)!important; font-size:clamp(2.5rem,4vw,4.4rem)!important; font-weight:400!important; line-height:.98!important; letter-spacing:-.045em!important; } .bmj-related__grid{ display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); border-left:1px solid var(--bmj-line); border-top:1px solid var(--bmj-line); } .bmj-related-card{ display:flex; min-width:0; flex-direction:column; border-right:1px solid var(--bmj-line); border-bottom:1px solid var(--bmj-line); background:#fff; } .bmj-related-card__media{ display:block; aspect-ratio:4/3; overflow:hidden; border-bottom:1px solid var(--bmj-line); background:#d9dce1; } .bmj-related-card__media img{ width:100%; height:100%; object-fit:cover; transition:transform .35s ease; } .bmj-related-card__media:hover img{ transform:scale(1.015); } .bmj-related-card__body{ display:flex; min-height:300px; flex:1; flex-direction:column; padding:22px; } .bmj-related-card.is-text-only .bmj-related-card__body{ min-height:380px; background:linear-gradient(180deg,rgba(94,84,111,.05),rgba(94,84,111,0)); } .bmj-related-card h3{ margin:1rem 0 0!important; font-family:var(--bmj-serif)!important; font-size:clamp(1.75rem,2.4vw,2.55rem)!important; font-weight:400!important; line-height:1.02!important; letter-spacing:-.035em!important; } .bmj-related-card h3 a{ color:var(--bmj-ink)!important; text-decoration:none!important; } .bmj-related-card p{ margin:1rem 0 0!important; color:var(--bmj-muted); font-family:var(--bmj-sans)!important; font-size:.88rem; line-height:1.6; } .bmj-related-card .bmj-inline-link{ margin-top:auto; padding-top:1.6rem; } /* ------------------------- ARTICLE CLOSING ------------------------- */ .bmj-article__footer{ background:#fff!important; } .bmj-article__footer-inner{ display:grid; grid-template-columns:minmax(0,1fr) auto; gap:clamp(40px,8vw,120px); align-items:end; } .bmj-article__footer-inner>div>p{ max-width:34rem; margin:.85rem 0 0!important; color:var(--bmj-muted); font-family:var(--bmj-sans)!important; font-size:.9rem; line-height:1.62; } .bmj-article__footer-links{ display:grid; grid-template-columns:repeat(2,minmax(130px,1fr)); border-top:1px solid var(--bmj-line); border-left:1px solid var(--bmj-line); } .bmj-article__footer-links a{ display:flex; align-items:center; justify-content:space-between; gap:16px; min-width:150px; padding:14px; border-right:1px solid var(--bmj-line); border-bottom:1px solid var(--bmj-line); color:var(--bmj-ink)!important; font-family:var(--bmj-sans)!important; font-size:.72rem; font-weight:700; text-decoration:none!important; } /* ------------------------- CONTENT HUBS ------------------------- */ .bmj-hub{ background:#fff; color:var(--bmj-ink); } .bmj-hub__header{ padding:clamp(58px,8vw,108px) 0 clamp(44px,6vw,74px); background:#fff; border-bottom:1px solid var(--bmj-line); } .bmj-hub__header-inner{ display:grid; grid-template-columns:minmax(100px,.2fr) minmax(0,.8fr); column-gap:clamp(30px,7vw,110px); align-items:end; } .bmj-hub__header .bmj-kicker{ grid-column:1; grid-row:1 / span 2; align-self:start; } .bmj-hub__header h1{ grid-column:2; margin:0!important; color:var(--bmj-ink)!important; font-family:var(--bmj-serif)!important; font-size:clamp(4.5rem,9vw,9rem)!important; font-weight:400!important; line-height:.82!important; letter-spacing:-.065em!important; } .bmj-hub__header p{ grid-column:2; max-width:44rem; margin:2rem 0 0!important; color:var(--bmj-muted); font-family:var(--bmj-sans)!important; font-size:1rem; line-height:1.66; } .bmj-hub__feed{ padding:clamp(58px,8vw,104px) 0 clamp(88px,10vw,140px); } .bmj-hub-grid{ display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); border-top:1px solid var(--bmj-line); border-left:1px solid var(--bmj-line); } .bmj-hub-card{ display:flex; min-width:0; flex-direction:column; border-right:1px solid var(--bmj-line); border-bottom:1px solid var(--bmj-line); background:#fff; } .bmj-hub-card__media{ display:block; aspect-ratio:4/3; overflow:hidden; border-bottom:1px solid var(--bmj-line); background:#d9dce1; } .bmj-hub-card__media img{ width:100%; height:100%; object-fit:cover; transition:transform .35s ease; } .bmj-hub-card__media:hover img{ transform:scale(1.015); } .bmj-hub-card__body{ display:flex; min-height:330px; flex:1; flex-direction:column; padding:23px; } .bmj-hub-card.is-text-only .bmj-hub-card__body{ min-height:420px; background:linear-gradient(180deg,rgba(94,84,111,.045),rgba(94,84,111,0)); } .bmj-hub-card h2{ margin:1rem 0 0!important; font-family:var(--bmj-serif)!important; font-size:clamp(1.9rem,2.8vw,3rem)!important; font-weight:400!important; line-height:1!important; letter-spacing:-.04em!important; } .bmj-hub-card h2 a{ color:var(--bmj-ink)!important; text-decoration:none!important; } .bmj-hub-card p{ margin:1rem 0 0!important; color:var(--bmj-muted); font-family:var(--bmj-sans)!important; font-size:.9rem; line-height:1.62; } .bmj-hub-card .bmj-inline-link{ margin-top:auto; padding-top:1.6rem; } .bmj-hub-empty{ padding:70px 0; border-top:1px solid var(--bmj-line); border-bottom:1px solid var(--bmj-line); } .bmj-hub-empty p{ margin:0!important; font-family:var(--bmj-serif)!important; font-size:clamp(2.5rem,5vw,5rem)!important; line-height:1!important; } .bmj-hub-empty span{ display:block; margin-top:1rem; color:var(--bmj-muted); font-family:var(--bmj-sans)!important; font-size:.9rem; } /* ------------------------- TABLET ------------------------- */ @media(max-width:900px){ .bmj-article__header-inner{ grid-template-columns:1fr!important; } .bmj-article__back{ grid-column:1!important; grid-row:auto!important; margin-bottom:34px; } .bmj-article__heading{ grid-column:1; } .bmj-related__grid, .bmj-hub-grid{ grid-template-columns:repeat(2,minmax(0,1fr)); } .bmj-article__footer-inner{ grid-template-columns:1fr; } .bmj-hub__header-inner{ grid-template-columns:1fr; gap:18px; } .bmj-hub__header .bmj-kicker, .bmj-hub__header h1, .bmj-hub__header p{ grid-column:1; grid-row:auto; } } /* ------------------------- MOBILE ------------------------- */ @media(max-width:650px){ .bmj-article__header h1{ font-size:clamp(3rem,15vw,4.8rem)!important; max-width:100%!important; } .bmj-article__sections{ gap:7px 12px; } .bmj-article__content .wp-block-columns{ display:block; } .bmj-related__head{ display:block; } .bmj-related__head h2{ margin-top:.8rem!important; } .bmj-related__grid, .bmj-hub-grid{ grid-template-columns:1fr; } .bmj-related-card__body, .bmj-hub-card__body{ min-height:280px; } .bmj-related-card.is-text-only .bmj-related-card__body, .bmj-hub-card.is-text-only .bmj-hub-card__body{ min-height:340px; } .bmj-article__footer-links{ grid-template-columns:1fr; width:100%; } .bmj-hub__header{ padding:48px 0 40px; } .bmj-hub__header h1{ font-size:clamp(4rem,22vw,6rem)!important; } .bmj-hub__feed{ padding:52px 0 84px; } } @media(prefers-reduced-motion:reduce){ .bmj-related-card__media img, .bmj-hub-card__media img{ transition:none!important; transform:none!important; } } /* ========================================================= v0.17.1 — ARTICLE SYSTEM POLISH ========================================================= */ /* Title/image/Open are all valid content-entry paths. */ .bmj-stage__title-link, .bmj-explore__preview h3 a, .bmj-hub-card h2 a, .bmj-related-card h3 a, .bmj-blog-card__body h2 a, .bmj-blog-lead__copy h2 a{ color:inherit!important; text-decoration:none!important; } .bmj-stage__image-link, .bmj-explore__preview-image{ display:block; width:100%; height:100%; text-decoration:none!important; } .bmj-stage__image-link img, .bmj-explore__preview-image img{ width:100%; height:100%; object-fit:cover; } .bmj-stage__title-link:hover, .bmj-stage__title-link:focus-visible, .bmj-explore__preview h3 a:hover, .bmj-explore__preview h3 a:focus-visible, .bmj-hub-card h2 a:hover, .bmj-hub-card h2 a:focus-visible, .bmj-related-card h3 a:hover, .bmj-related-card h3 a:focus-visible, .bmj-blog-card__body h2 a:hover, .bmj-blog-card__body h2 a:focus-visible, .bmj-blog-lead__copy h2 a:hover, .bmj-blog-lead__copy h2 a:focus-visible{ text-decoration:underline!important; text-decoration-thickness:1px!important; text-underline-offset:.12em; } /* Long-title safety. */ .bmj-article__header h1{ font-size:clamp(3.3rem,6.25vw,6.8rem)!important; max-width:16ch!important; text-wrap:balance; overflow-wrap:anywhere; } /* Full-width reading-column divider. */ .bmj-article__content .wp-block-separator, .bmj-article__content hr{ width:100%!important; max-width:none!important; margin:3.4rem 0!important; border:0!important; border-top:1px solid var(--bmj-line)!important; opacity:1!important; } /* Better visual-content rhythm without forcing images to stretch. */ .bmj-article__content>.wp-block-image{ margin:2.4rem 0!important; } .bmj-article__content>.wp-block-gallery{ margin:2.15rem 0 2.55rem!important; } .bmj-article__content .wp-block-gallery{ gap:12px!important; } .bmj-article__content .wp-block-gallery.has-nested-images figure.wp-block-image{ margin:0!important; } /* Understated instructional list treatment. */ .bmj-article__content ol{ counter-reset:bmj-step; list-style:none!important; margin:1.7rem 0 2.2rem!important; padding:0!important; } .bmj-article__content ol>li{ position:relative; counter-increment:bmj-step; margin:0!important; padding:.72rem 0 .72rem 2.4rem!important; border-bottom:1px solid rgba(23,21,24,.08); } .bmj-article__content ol>li:last-child{ border-bottom:0; } .bmj-article__content ol>li::before{ content:counter(bmj-step) "."; position:absolute; left:0; top:.72rem; color:var(--bmj-plum); font-family:var(--bmj-sans); font-weight:700; } /* Resource block cohesion. */ .bmj-article__content .wp-block-buttons + .wp-block-file, .bmj-article__content .wp-block-file{ margin-top:1rem!important; } .bmj-article__content .wp-block-file{ padding:16px!important; background:#f3f4f6!important; border-color:var(--bmj-line)!important; } .bmj-article__content .wp-block-file__button{ background:var(--bmj-plum)!important; transition:opacity .18s ease; } .bmj-article__content .wp-block-file__button:hover, .bmj-article__content .wp-block-file__button:focus-visible{ opacity:.88; } /* Related content scales to the amount of content actually available. */ .bmj-related{ padding:clamp(60px,7vw,94px) 0!important; } .bmj-related__head{ display:grid!important; grid-template-columns:minmax(0,.34fr) minmax(0,.66fr); align-items:end!important; gap:30px!important; margin-bottom:26px!important; } .bmj-related__head h2{ justify-self:start; max-width:12ch!important; } .bmj-related__grid{ width:100%; } .bmj-related__grid--1{ grid-template-columns:minmax(280px,420px)!important; } .bmj-related__grid--2{ grid-template-columns:repeat(2,minmax(0,1fr))!important; max-width:860px; } .bmj-related__grid--3{ grid-template-columns:repeat(3,minmax(0,1fr))!important; } .bmj-related-card__body{ min-height:270px!important; } .bmj-related-card.is-text-only .bmj-related-card__body{ min-height:330px!important; } .bmj-related__grid--1 .bmj-related-card{ max-width:420px; } .bmj-article__footer{ padding:clamp(54px,7vw,84px) 0!important; } @media(max-width:900px){ .bmj-related__head{ grid-template-columns:1fr!important; gap:12px!important; } .bmj-related__grid--2, .bmj-related__grid--3{ grid-template-columns:repeat(2,minmax(0,1fr))!important; max-width:none; } .bmj-related__grid--1{ grid-template-columns:minmax(0,420px)!important; } } @media(max-width:650px){ .bmj-article__header h1{ font-size:clamp(2.9rem,14vw,4.6rem)!important; max-width:100%!important; } .bmj-related__grid--1, .bmj-related__grid--2, .bmj-related__grid--3{ grid-template-columns:1fr!important; max-width:none!important; } .bmj-related__grid--1 .bmj-related-card{ max-width:none; } .bmj-article__content ol>li{ padding-left:2rem!important; } } @media(prefers-reduced-motion:reduce){ .bmj-article__content .wp-block-file__button{ transition:none!important; } } /* ========================================================= v0.18 — WORK WITH ME + BROWSE ROW CLICK ========================================================= */ /* Entire Browse row is clickable without changing the visual design. */ [data-explore-row-open]{ cursor:pointer; } /* ------------------------- WORK WITH ME ------------------------- */ .bmj-services-page{ background:#fff; color:var(--bmj-ink); } .bmj-services-page *{ box-sizing:border-box; } .bmj-services-hero{ padding:clamp(66px,8vw,118px) 0 clamp(70px,9vw,132px); background:#fff; border-bottom:1px solid var(--bmj-line); } .bmj-services-hero__inner{ display:grid; grid-template-columns:minmax(110px,.22fr) minmax(0,.78fr); gap:clamp(34px,7vw,110px); align-items:start; } .bmj-services-hero__copy{ max-width:980px; } .bmj-services-hero__copy h1{ max-width:12ch; margin:0!important; color:var(--bmj-ink)!important; font-family:var(--bmj-serif)!important; font-size:clamp(4rem,7.8vw,8.6rem)!important; font-weight:400!important; line-height:.88!important; letter-spacing:-.062em!important; text-wrap:balance; } .bmj-services-hero__copy>p{ max-width:42rem; margin:clamp(28px,3.5vw,42px) 0 0!important; color:var(--bmj-muted); font-family:var(--bmj-sans)!important; font-size:clamp(1.04rem,1.4vw,1.22rem); line-height:1.62; } .bmj-services-page__cta{ display:inline-flex; align-items:center; gap:.55rem; width:max-content; margin-top:clamp(28px,3vw,40px); padding:0 0 .34rem; border-bottom:1px solid currentColor; color:var(--bmj-ink)!important; font-family:var(--bmj-sans)!important; font-size:.72rem; font-weight:700; line-height:1; letter-spacing:.04em; text-decoration:none!important; text-transform:uppercase; } .bmj-services-page__cta span{ color:var(--bmj-plum); transition:transform .18s ease; } .bmj-services-page__cta:hover span, .bmj-services-page__cta:focus-visible span{ transform:translate(2px,-2px); } /* OFFERS */ .bmj-services-offers{ padding:clamp(72px,9vw,132px) 0; background:#f3f4f6; border-bottom:1px solid var(--bmj-line); } .bmj-services-offers__head{ display:grid; grid-template-columns:minmax(110px,.22fr) minmax(0,.78fr); column-gap:clamp(34px,7vw,110px); row-gap:14px; align-items:start; margin-bottom:clamp(34px,5vw,62px); } .bmj-services-offers__head>.bmj-kicker{ grid-column:2; grid-row:1; margin:0!important; } .bmj-services-offers__head h2{ grid-column:2; grid-row:2; max-width:13ch; margin:0!important; color:var(--bmj-ink)!important; font-family:var(--bmj-serif)!important; font-size:clamp(3rem,5vw,5.5rem)!important; font-weight:400!important; line-height:.95!important; letter-spacing:-.05em!important; } .bmj-services-offers__layout{ display:grid; grid-template-columns:minmax(260px,.32fr) minmax(0,.68fr); border-top:1px solid var(--bmj-line); border-left:1px solid var(--bmj-line); background:#fff; } .bmj-services-offers__tabs{ display:flex; flex-direction:column; border-right:1px solid var(--bmj-line); } .bmj-services-offers__tabs button{ display:grid; grid-template-columns:36px 1fr; align-items:start; gap:12px; min-height:108px; padding:22px; border:0; border-bottom:1px solid var(--bmj-line); background:#fff; color:var(--bmj-ink); text-align:left; cursor:pointer; transition:background .18s ease; } .bmj-services-offers__tabs button small{ color:var(--bmj-plum); font-family:var(--bmj-sans); font-size:.62rem; font-weight:700; letter-spacing:.05em; } .bmj-services-offers__tabs button span{ font-family:var(--bmj-sans); font-size:.95rem; font-weight:700; line-height:1.25; } .bmj-services-offers__tabs button:hover, .bmj-services-offers__tabs button:focus-visible, .bmj-services-offers__tabs button.is-active{ background:rgba(94,84,111,.055); } .bmj-services-offers__panels{ min-width:0; } .bmj-services-offer{ min-height:540px; padding:clamp(30px,5vw,62px); } .bmj-services-offer__top h3{ max-width:11ch; margin:1rem 0 0!important; font-family:var(--bmj-serif)!important; font-size:clamp(3rem,5vw,5.5rem)!important; font-weight:400!important; line-height:.94!important; letter-spacing:-.05em!important; } .bmj-services-offer__top>p{ max-width:42rem; margin:1.4rem 0 0!important; color:var(--bmj-muted); font-family:var(--bmj-sans)!important; font-size:1rem; line-height:1.66; } .bmj-services-offer__details{ display:grid; grid-template-columns:1fr 1fr; gap:clamp(30px,5vw,70px); margin-top:clamp(40px,5vw,66px); padding-top:28px; border-top:1px solid var(--bmj-line); } .bmj-services-offer__detail-label{ display:block; margin-bottom:14px; color:var(--bmj-muted); font-family:var(--bmj-sans); font-size:.66rem; font-weight:700; letter-spacing:.05em; text-transform:uppercase; } .bmj-services-offer__details ul{ list-style:none; margin:0!important; padding:0!important; } .bmj-services-offer__details li, .bmj-services-offer__details p{ margin:0!important; padding:.48rem 0; border-bottom:1px solid rgba(23,21,24,.08); color:var(--bmj-ink); font-family:var(--bmj-sans)!important; font-size:.92rem; line-height:1.5; } /* PROCESS */ .bmj-services-process{ padding:clamp(78px,10vw,142px) 0; background:var(--bmj-ink); color:#fff; } .bmj-services-process__inner{ display:grid; grid-template-columns:minmax(0,.38fr) minmax(0,.62fr); gap:clamp(48px,8vw,120px); align-items:start; } .bmj-services-process .bmj-kicker{ color:rgba(255,255,255,.58); } .bmj-services-process__head h2{ max-width:10ch; margin:1rem 0 0!important; color:#fff!important; font-family:var(--bmj-serif)!important; font-size:clamp(3rem,5vw,5.4rem)!important; font-weight:400!important; line-height:.95!important; letter-spacing:-.05em!important; } .bmj-services-process__head>p{ max-width:30rem; margin:1.5rem 0 0!important; color:rgba(255,255,255,.68); font-family:var(--bmj-sans)!important; font-size:.95rem; line-height:1.65; } .bmj-services-process__steps{ border-top:1px solid rgba(255,255,255,.18); } .bmj-services-process__steps article{ display:grid; grid-template-columns:52px minmax(120px,.35fr) 1fr; gap:18px; padding:24px 0; border-bottom:1px solid rgba(255,255,255,.18); } .bmj-services-process__steps small{ color:#b9aec8; font-family:var(--bmj-sans); font-size:.65rem; font-weight:700; } .bmj-services-process__steps h3{ margin:0!important; color:#fff!important; font-family:var(--bmj-sans)!important; font-size:1rem!important; font-weight:700!important; line-height:1.3!important; } .bmj-services-process__steps p{ margin:0!important; color:rgba(255,255,255,.67); font-family:var(--bmj-sans)!important; font-size:.9rem; line-height:1.6; } /* TERMS */ .bmj-services-terms{ padding:clamp(72px,9vw,128px) 0; background:#fff; border-bottom:1px solid var(--bmj-line); } .bmj-services-terms__inner{ display:grid; grid-template-columns:minmax(0,.36fr) minmax(0,.64fr); gap:clamp(44px,8vw,120px); } .bmj-services-terms__head h2{ max-width:9ch; margin:1rem 0 0!important; font-family:var(--bmj-serif)!important; font-size:clamp(3rem,5vw,5.2rem)!important; font-weight:400!important; line-height:.96!important; letter-spacing:-.05em!important; } .bmj-services-terms__list{ border-top:1px solid var(--bmj-line); } .bmj-services-terms__list>div{ display:grid; grid-template-columns:minmax(120px,.28fr) 1fr; gap:24px; padding:20px 0; border-bottom:1px solid var(--bmj-line); } .bmj-services-terms__list span{ font-family:var(--bmj-sans); font-size:.72rem; font-weight:700; } .bmj-services-terms__list p{ max-width:38rem; margin:0!important; color:var(--bmj-muted); font-family:var(--bmj-sans)!important; font-size:.91rem; line-height:1.6; } /* CLOSE */ .bmj-services-close{ padding:clamp(72px,10vw,144px) 0; background:#f3f4f6; } .bmj-services-close__inner{ display:grid; grid-template-columns:minmax(0,.18fr) minmax(0,.62fr) auto; gap:clamp(28px,6vw,90px); align-items:end; } .bmj-services-close h2{ max-width:10ch; margin:0!important; font-family:var(--bmj-serif)!important; font-size:clamp(3.3rem,5.8vw,6.2rem)!important; font-weight:400!important; line-height:.92!important; letter-spacing:-.052em!important; } .bmj-services-page__cta.is-large{ margin:0; white-space:nowrap; } /* TABLET */ @media(max-width:900px){ .bmj-services-hero__inner, .bmj-services-offers__head, .bmj-services-process__inner, .bmj-services-terms__inner{ grid-template-columns:1fr; gap:28px; } .bmj-services-offers__head{ row-gap:12px; } .bmj-services-offers__head>.bmj-kicker, .bmj-services-offers__head h2{ grid-column:1; grid-row:auto; } .bmj-services-offers__layout{ grid-template-columns:1fr; } .bmj-services-offers__tabs{ flex-direction:row; overflow-x:auto; border-right:0; border-bottom:1px solid var(--bmj-line); } .bmj-services-offers__tabs button{ min-width:240px; flex:1; border-right:1px solid var(--bmj-line); border-bottom:0; } .bmj-services-process__steps article{ grid-template-columns:44px 130px 1fr; } .bmj-services-close__inner{ grid-template-columns:1fr; align-items:start; } .bmj-services-page__cta.is-large{ margin-top:10px; } } /* MOBILE */ @media(max-width:650px){ .bmj-services-hero{ padding:52px 0 68px; } .bmj-services-hero__copy h1{ font-size:clamp(3.2rem,15vw,4.9rem)!important; max-width:11ch; } .bmj-services-offers, .bmj-services-process, .bmj-services-terms, .bmj-services-close{ padding:64px 0; } .bmj-services-offers__head h2, .bmj-services-process__head h2, .bmj-services-terms__head h2, .bmj-services-close h2{ font-size:clamp(2.8rem,13vw,4.1rem)!important; } .bmj-services-offers__tabs button{ min-width:210px; min-height:92px; padding:18px; } .bmj-services-offer{ min-height:0; padding:28px 20px 32px; } .bmj-services-offer__top h3{ font-size:clamp(2.8rem,13vw,4.2rem)!important; } .bmj-services-offer__details{ grid-template-columns:1fr; gap:26px; margin-top:38px; } .bmj-services-process__steps article{ grid-template-columns:36px 1fr; } .bmj-services-process__steps article p{ grid-column:2; } .bmj-services-terms__list>div{ grid-template-columns:1fr; gap:9px; } } @media(prefers-reduced-motion:reduce){ .bmj-services-page__cta span, .bmj-services-offers__tabs button{ transition:none!important; } } /* ========================================================= v0.18.1 — WORK WITH ME IMPLEMENTATION FIXES Structure/design preserved. ========================================================= */ /* The active offer should determine the section height naturally. */ .bmj-services-offer{ min-height:0!important; } .bmj-services-offers{ padding-bottom:clamp(40px,4.5vw,64px)!important; } /* Give the dark process panel a true internal gutter so large serif type, labels, and supporting copy never sit against or clip at the panel edge. */ .bmj-services-process__inner{ width:100%!important; max-width:none!important; padding-inline:clamp(28px,4vw,64px)!important; } /* Keep the process headline comfortably inside its own column. */ .bmj-services-process__head{ min-width:0; padding-left:2px; } .bmj-services-process__head h2{ max-width:10.5ch!important; overflow-wrap:normal; } /* Make the right-side process list respect the same safe bounds. */ .bmj-services-process__steps{ min-width:0; } /* Tablet/mobile retain deliberate internal gutters rather than collapsing all the way against the edge. */ @media(max-width:900px){ .bmj-services-process__inner{ padding-inline:clamp(24px,5vw,44px)!important; } } @media(max-width:650px){ .bmj-services-offers{ padding-bottom:42px!important; } .bmj-services-process__inner{ padding-inline:20px!important; } } /* ========================================================= v0.18.2 — WORK WITH ME CLOSING CTA Compact, single reading path. All other page structure preserved. ========================================================= */ .bmj-services-close{ padding:clamp(58px,7vw,88px) 0!important; } .bmj-services-close__inner{ display:block!important; max-width:760px!important; margin-inline:auto!important; padding-inline:0!important; } .bmj-services-close__inner>.bmj-kicker{ display:block; margin:0 0 18px!important; } .bmj-services-close h2{ max-width:11ch!important; margin:0!important; font-size:clamp(2.85rem,4.8vw,4.85rem)!important; line-height:.96!important; letter-spacing:-.045em!important; text-wrap:balance; } .bmj-services-close .bmj-services-page__cta.is-large{ display:inline-flex!important; margin-top:26px!important; white-space:normal!important; } /* Keep the section clearly grouped on tablet/mobile too. */ @media(max-width:900px){ .bmj-services-close__inner{ max-width:700px!important; } } @media(max-width:650px){ .bmj-services-close{ padding:52px 0 58px!important; } .bmj-services-close__inner{ max-width:none!important; } .bmj-services-close h2{ max-width:10ch!important; font-size:clamp(2.6rem,12vw,3.7rem)!important; } .bmj-services-close .bmj-services-page__cta.is-large{ margin-top:22px!important; } } /* ========================================================= v0.19 — ABOUT ========================================================= */ .bmj-about{ background:#fff; color:var(--bmj-ink); } /* HERO */ .bmj-about-hero{ padding:clamp(70px,9vw,128px) 0 clamp(76px,9vw,136px); background:#fff; border-bottom:1px solid var(--bmj-line); } .bmj-about-hero__inner{ display:grid; grid-template-columns:minmax(110px,.22fr) minmax(0,.78fr); gap:clamp(36px,7vw,110px); align-items:start; } .bmj-about-hero__copy{ max-width:950px; } .bmj-about-hero h1{ margin:0!important; color:var(--bmj-ink)!important; font-family:var(--bmj-serif)!important; font-size:clamp(5rem,10vw,10rem)!important; font-weight:400!important; line-height:.8!important; letter-spacing:-.07em!important; } .bmj-about-hero__lead{ max-width:50rem; margin:clamp(32px,4vw,50px) 0 0!important; color:var(--bmj-muted); font-family:var(--bmj-sans)!important; font-size:clamp(1.12rem,1.55vw,1.34rem); line-height:1.62; } /* WHY */ .bmj-about-reason{ padding:clamp(82px,10vw,148px) 0; background:#f3f4f6; border-bottom:1px solid var(--bmj-line); } .bmj-about-reason__inner{ display:grid; grid-template-columns:minmax(0,.38fr) minmax(0,.62fr); gap:clamp(48px,9vw,140px); align-items:start; } .bmj-about-reason__heading h2{ max-width:10ch; margin:1rem 0 0!important; color:var(--bmj-ink)!important; font-family:var(--bmj-serif)!important; font-size:clamp(3.2rem,5.4vw,5.8rem)!important; font-weight:400!important; line-height:.95!important; letter-spacing:-.052em!important; } .bmj-about-reason__copy{ max-width:46rem; } .bmj-about-reason__copy>p{ margin:0!important; color:var(--bmj-muted); font-family:var(--bmj-sans)!important; font-size:1rem; line-height:1.72; } .bmj-about-reason__copy>p + p{ margin-top:1.45rem!important; } .bmj-about-reason__copy .bmj-about-reason__question{ margin-top:clamp(42px,5vw,62px)!important; padding-top:clamp(28px,3vw,38px); border-top:1px solid var(--bmj-line); color:var(--bmj-ink); font-family:var(--bmj-serif)!important; font-size:clamp(1.8rem,3vw,2.8rem)!important; line-height:1.22!important; letter-spacing:-.03em!important; } /* RANGE */ .bmj-about-range{ padding:clamp(76px,9vw,132px) 0; background:#fff; border-bottom:1px solid var(--bmj-line); } .bmj-about-range__head{ display:grid; grid-template-columns:minmax(110px,.22fr) minmax(0,.78fr); gap:clamp(36px,7vw,110px); align-items:end; margin-bottom:clamp(36px,5vw,66px); } .bmj-about-range__head h2{ max-width:13ch; margin:0!important; font-family:var(--bmj-serif)!important; font-size:clamp(3rem,5vw,5.3rem)!important; font-weight:400!important; line-height:.96!important; letter-spacing:-.05em!important; } .bmj-about-range__grid{ display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); border-top:1px solid var(--bmj-line); border-left:1px solid var(--bmj-line); } .bmj-about-range__item{ display:block; min-height:250px; padding:clamp(24px,3vw,38px); border-right:1px solid var(--bmj-line); border-bottom:1px solid var(--bmj-line); color:inherit; text-decoration:none!important; transition:background .18s ease,box-shadow .18s ease; } .bmj-about-range__item:visited{ color:inherit; } .bmj-about-range__item:hover, .bmj-about-range__item:focus-visible{ background:rgba(94,84,111,.045); } .bmj-about-range__item:focus-visible{ outline:0; box-shadow:inset 0 0 0 2px var(--bmj-plum); } .bmj-about-range__item span{ display:block; color:var(--bmj-ink); font-family:var(--bmj-sans); font-size:.72rem; font-weight:700; letter-spacing:.05em; text-transform:uppercase; } .bmj-about-range__item .bmj-about-range__arrow{ display:inline-block; margin-left:.3rem; color:var(--bmj-plum); transition:transform .18s ease; } .bmj-about-range__item:hover .bmj-about-range__arrow, .bmj-about-range__item:focus-visible .bmj-about-range__arrow{ transform:translate(2px,-2px); } .bmj-about-range__item p{ max-width:34rem; margin:clamp(46px,6vw,82px) 0 0!important; color:var(--bmj-muted); font-family:var(--bmj-sans)!important; font-size:.95rem; line-height:1.65; } /* WORK BRIDGE */ .bmj-about-work{ padding:clamp(78px,10vw,138px) 0; background:var(--bmj-ink); color:#fff; } .bmj-about-work__inner{ display:grid; grid-template-columns:minmax(110px,.22fr) minmax(0,.78fr); gap:clamp(36px,7vw,110px); align-items:start; } .bmj-about-work .bmj-kicker{ color:rgba(255,255,255,.58); } .bmj-about-work__copy h2{ max-width:12ch; margin:0!important; color:#fff!important; font-family:var(--bmj-serif)!important; font-size:clamp(3.4rem,5.7vw,6rem)!important; font-weight:400!important; line-height:.94!important; letter-spacing:-.052em!important; } .bmj-about-work__copy p{ max-width:40rem; margin:1.5rem 0 0!important; color:rgba(255,255,255,.68); font-family:var(--bmj-sans)!important; font-size:.98rem; line-height:1.66; } .bmj-about-work .bmj-inline-link{ display:inline-flex; margin-top:2rem; color:#fff!important; } /* CLOSE */ .bmj-about-close{ padding:clamp(68px,9vw,116px) 0; background:var(--bmj-paper); } .bmj-about-close__inner{ max-width:960px; margin-inline:auto; } .bmj-about-close h2{ max-width:14ch; margin:1rem 0 0!important; font-family:var(--bmj-serif)!important; font-size:clamp(3rem,5.2vw,5.5rem)!important; font-weight:400!important; line-height:.96!important; letter-spacing:-.05em!important; } .bmj-about-close__links{ display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); margin-top:clamp(40px,5vw,62px); border-top:1px solid var(--bmj-line); border-left:1px solid var(--bmj-line); } .bmj-about-close__links a{ display:flex; align-items:center; justify-content:space-between; gap:16px; padding:15px; border-right:1px solid var(--bmj-line); border-bottom:1px solid var(--bmj-line); color:var(--bmj-ink)!important; font-family:var(--bmj-sans)!important; font-size:.72rem; font-weight:700; text-decoration:none!important; } .bmj-about-close__links a:hover, .bmj-about-close__links a:focus-visible{ background:rgba(94,84,111,.045); } @media(max-width:900px){ .bmj-about-hero__inner, .bmj-about-reason__inner, .bmj-about-range__head, .bmj-about-work__inner{ grid-template-columns:1fr; gap:28px; } .bmj-about-range__grid{ grid-template-columns:1fr 1fr; } .bmj-about-close__links{ grid-template-columns:repeat(2,minmax(0,1fr)); } } @media(max-width:650px){ .bmj-about-hero{ padding:54px 0 70px; } .bmj-about-hero h1{ font-size:clamp(4.5rem,24vw,6.5rem)!important; } .bmj-about-reason, .bmj-about-range, .bmj-about-work, .bmj-about-close{ padding:64px 0; } .bmj-about-reason__heading h2, .bmj-about-range__head h2, .bmj-about-work__copy h2, .bmj-about-close h2{ font-size:clamp(2.75rem,13vw,4rem)!important; } .bmj-about-range__grid{ grid-template-columns:1fr; } .bmj-about-range__item{ min-height:210px; } .bmj-about-range__item p{ margin-top:38px!important; } .bmj-about-close__links{ grid-template-columns:1fr; } } @media(prefers-reduced-motion:reduce){ .bmj-about-range__item, .bmj-about-range__arrow{ transition:none!important; } } /* ========================================================= v0.19.1 — ABOUT FLOW / SCALE POLISH Content and structure preserved. ========================================================= */ /* WHY THIS EXISTS Reduce headline pressure and keep large serif glyphs safely in-bounds. */ .bmj-about-reason__heading{ min-width:0; padding-left:6px; } .bmj-about-reason__heading h2{ max-width:11ch!important; font-size:clamp(2.9rem,4.65vw,4.95rem)!important; line-height:.98!important; } .bmj-about-reason__copy .bmj-about-reason__question{ font-size:clamp(1.65rem,2.55vw,2.45rem)!important; line-height:1.24!important; } /* WHAT BELONGS HERE Still editorial, but not another oversized hero. */ .bmj-about-range__head h2{ max-width:15ch!important; font-size:clamp(2.8rem,4.35vw,4.55rem)!important; line-height:.98!important; } .bmj-about-range__item{ min-height:205px!important; padding:clamp(22px,2.6vw,32px)!important; } .bmj-about-range__item p{ margin-top:clamp(30px,3.6vw,46px)!important; } /* WORK BRIDGE Add a real inner gutter so label/headline never sit on the black panel edge. */ .bmj-about-work__inner{ width:100%!important; max-width:none!important; padding-inline:clamp(28px,4vw,64px)!important; } .bmj-about-work__copy h2{ max-width:12ch!important; font-size:clamp(3.05rem,4.9vw,5.2rem)!important; line-height:.96!important; } .bmj-about-work__label{ min-width:0; } /* START SOMEWHERE Turn the oversized final hero into a compact closing endcap. */ .bmj-about-close{ padding:clamp(68px,8vw,102px) 0 clamp(54px,6.5vw,82px)!important; } .bmj-about-close__inner{ max-width:840px!important; margin-inline:auto!important; } .bmj-about-close h2{ max-width:15ch!important; font-size:clamp(2.65rem,4.2vw,4.35rem)!important; line-height:.98!important; letter-spacing:-.043em!important; } .bmj-about-close__links{ margin-top:clamp(28px,3.5vw,42px)!important; } /* Responsive cleanup keeps all fixes deliberate rather than shrinking desktop blindly. */ @media(max-width:900px){ .bmj-about-work__inner{ padding-inline:clamp(24px,5vw,44px)!important; } .bmj-about-reason__heading{ padding-left:0; } } @media(max-width:650px){ .bmj-about-reason__heading h2, .bmj-about-range__head h2, .bmj-about-work__copy h2{ font-size:clamp(2.55rem,11.5vw,3.7rem)!important; } .bmj-about-reason__copy .bmj-about-reason__question{ font-size:clamp(1.5rem,7vw,2rem)!important; } .bmj-about-range__item{ min-height:170px!important; } .bmj-about-range__item p{ margin-top:28px!important; } .bmj-about-work__inner{ padding-inline:20px!important; } .bmj-about-close{ padding:58px 0 54px!important; } .bmj-about-close h2{ max-width:12ch!important; font-size:clamp(2.45rem,11.5vw,3.45rem)!important; } .bmj-about-close__links{ margin-top:26px!important; } } /* ========================================================= v0.19.2 — CURATED HOMEPAGE FEATURES ========================================================= */ /* No-feature state: preserve the approved stage visual, but let the opening philosophy stand on its own instead of inventing/promoting content. */ .bmj-stage__content.is-intro-only{ bottom:auto!important; min-height:0!important; } .bmj-stage__frame.is-intro-only .bmj-stage__veil{ background: linear-gradient(90deg,rgba(20,18,20,.03) 0%,rgba(20,18,20,.01) 55%,rgba(20,18,20,.12) 100%), linear-gradient(0deg,rgba(20,18,20,.09) 0%,transparent 34%); } /* Feature hierarchy safety: actual article titles are less predictable than the original short labels, so the content panel now protects the intro. */ .bmj-stage__content.has-features .bmj-stage__panels{ margin-top:24px!important; min-height:0; overflow:hidden; } .bmj-stage__content.has-features .bmj-stage__panel{ justify-content:flex-end; overflow:hidden; } .bmj-stage__content.has-features .bmj-stage__panel h2{ max-width:10ch!important; font-size:clamp(2.15rem,3vw,3.55rem)!important; line-height:.95!important; overflow-wrap:anywhere; } .bmj-stage__content.has-features .bmj-stage__panel h2.is-long-title{ max-width:12ch!important; font-size:clamp(1.95rem,2.65vw,3.05rem)!important; line-height:.98!important; } .bmj-stage__content.has-features .bmj-stage__panel p{ margin-top:.75rem!important; font-size:.88rem!important; line-height:1.52!important; } /* Rail titles are real content titles now; keep them readable without allowing one long headline to explode the stage height. */ .bmj-stage__tab{ min-width:0; } .bmj-stage__tab span{ min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; font-family:var(--bmj-sans)!important; font-size:.76rem!important; font-weight:650!important; } /* Curated stage count can be 1–4. */ .bmj-stage__rail{ grid-template-columns:repeat(var(--bmj-stage-count,4),minmax(0,1fr))!important; } @media(max-width:900px){ .bmj-stage__content.is-intro-only{ position:relative!important; top:auto!important; right:auto!important; bottom:auto!important; width:auto!important; margin:0!important; border-left:0!important; border-right:0!important; border-bottom:0!important; } .bmj-stage__content.has-features .bmj-stage__panel h2{ font-size:clamp(2.2rem,7vw,3.4rem)!important; } .bmj-stage__rail{ grid-template-columns:repeat(var(--bmj-stage-count,4),minmax(180px,1fr))!important; } } @media(max-width:600px){ .bmj-stage__content.has-features .bmj-stage__panel h2, .bmj-stage__content.has-features .bmj-stage__panel h2.is-long-title{ max-width:100%!important; font-size:clamp(2rem,10vw,3rem)!important; } .bmj-stage__tab span{ white-space:normal; display:-webkit-box; -webkit-box-orient:vertical; -webkit-line-clamp:2; line-height:1.15!important; } } /* ========================================================= v0.19.3 — ABOUT / WHY THIS EXISTS PROPORTION FIX Only this section changes. ========================================================= */ .bmj-about-reason{ padding:clamp(54px,6vw,82px) 0!important; } .bmj-about-reason__inner{ grid-template-columns:minmax(240px,.32fr) minmax(0,.68fr)!important; gap:clamp(42px,6vw,90px)!important; align-items:start!important; } .bmj-about-reason__heading{ padding-left:0!important; } .bmj-about-reason__heading h2{ max-width:12ch!important; font-size:clamp(2.5rem,3.6vw,3.85rem)!important; line-height:1.01!important; letter-spacing:-.045em!important; } .bmj-about-reason__copy{ max-width:48rem!important; } .bmj-about-reason__copy>p{ font-size:.96rem!important; line-height:1.66!important; } .bmj-about-reason__copy>p + p{ margin-top:1.15rem!important; } .bmj-about-reason__copy .bmj-about-reason__question{ max-width:42rem!important; margin-top:clamp(28px,3vw,38px)!important; padding-top:22px!important; font-size:clamp(1.35rem,1.9vw,1.85rem)!important; line-height:1.3!important; letter-spacing:-.022em!important; } /* Prevent the left side from visually stretching the section. */ .bmj-about-reason__heading .bmj-kicker{ display:block; margin-bottom:12px!important; } @media(max-width:900px){ .bmj-about-reason{ padding:54px 0!important; } .bmj-about-reason__inner{ grid-template-columns:1fr!important; gap:30px!important; } .bmj-about-reason__heading h2{ max-width:13ch!important; font-size:clamp(2.55rem,7vw,3.7rem)!important; } } @media(max-width:650px){ .bmj-about-reason{ padding:46px 0 52px!important; } .bmj-about-reason__heading h2{ font-size:clamp(2.35rem,10.5vw,3.25rem)!important; } .bmj-about-reason__copy .bmj-about-reason__question{ font-size:clamp(1.3rem,6vw,1.7rem)!important; } } /* ========================================================= v0.19.4 — ABOUT / WHY THIS EXISTS INNER GUTTER ========================================================= */ .bmj-about-reason__inner{ padding-inline:clamp(28px,4vw,58px)!important; } @media(max-width:900px){ .bmj-about-reason__inner{ padding-inline:clamp(24px,5vw,42px)!important; } } @media(max-width:650px){ .bmj-about-reason__inner{ padding-inline:20px!important; } } /* ========================================================= v0.20 — CONTACT ========================================================= */ .bmj-contact{ background:#fff; color:var(--bmj-ink); } .bmj-contact-hero{ padding:clamp(70px,8vw,118px) 0 clamp(64px,7vw,96px); background:#fff; border-bottom:1px solid var(--bmj-line); } .bmj-contact-hero__inner{ display:grid; grid-template-columns:minmax(110px,.22fr) minmax(0,.78fr); gap:clamp(36px,7vw,110px); align-items:start; } .bmj-contact-hero__copy{ max-width:980px; } .bmj-contact-hero h1{ max-width:12ch; margin:0!important; color:var(--bmj-ink)!important; font-family:var(--bmj-serif)!important; font-size:clamp(3.9rem,7vw,7.4rem)!important; font-weight:400!important; line-height:.91!important; letter-spacing:-.06em!important; text-wrap:balance; } .bmj-contact-hero__copy>p{ max-width:38rem; margin:clamp(28px,3vw,38px) 0 0!important; color:var(--bmj-muted); font-family:var(--bmj-sans)!important; font-size:clamp(1rem,1.35vw,1.16rem); line-height:1.62; } .bmj-contact-body{ padding:clamp(66px,8vw,110px) 0; background:#f3f4f6; } .bmj-contact-body__inner{ display:grid; grid-template-columns:minmax(220px,.30fr) minmax(0,.70fr); gap:clamp(44px,8vw,118px); align-items:start; } .bmj-contact-notes{ position:sticky; top:110px; max-width:310px; } .bmj-contact-notes p{ margin:1rem 0 0!important; color:var(--bmj-muted); font-family:var(--bmj-sans)!important; font-size:.93rem; line-height:1.65; } .bmj-contact-notes .bmj-inline-link{ display:inline-flex; margin-top:1.5rem; } .bmj-contact-form-wrap{ min-width:0; padding:clamp(26px,4vw,48px); background:#fff; border:1px solid var(--bmj-line); } /* WPForms: strip generic plugin presentation and let BMJ own the layout. */ .bmj-contact-form-wrap .wpforms-container{ margin:0!important; } .bmj-contact-form-wrap .wpforms-form{ font-family:var(--bmj-sans)!important; } .bmj-contact-form-wrap .wpforms-field{ padding:0 0 28px!important; } .bmj-contact-form-wrap .wpforms-field-label{ margin:0 0 9px!important; color:var(--bmj-ink)!important; font-family:var(--bmj-sans)!important; font-size:.72rem!important; font-weight:700!important; line-height:1.3!important; letter-spacing:.035em!important; text-transform:none!important; } .bmj-contact-form-wrap .wpforms-required-label{ color:var(--bmj-red)!important; } .bmj-contact-form-wrap input[type="text"], .bmj-contact-form-wrap input[type="email"], .bmj-contact-form-wrap input[type="url"], .bmj-contact-form-wrap textarea, .bmj-contact-form-wrap select{ width:100%!important; max-width:none!important; border:0!important; border-bottom:1px solid var(--bmj-line)!important; border-radius:0!important; background:transparent!important; box-shadow:none!important; color:var(--bmj-ink)!important; font-family:var(--bmj-sans)!important; font-size:1rem!important; line-height:1.45!important; padding:11px 0!important; transition:border-color .18s ease!important; } .bmj-contact-form-wrap textarea{ min-height:150px!important; resize:vertical; border:1px solid var(--bmj-line)!important; padding:14px!important; } .bmj-contact-form-wrap input:focus, .bmj-contact-form-wrap textarea:focus, .bmj-contact-form-wrap select:focus{ border-color:var(--bmj-plum)!important; outline:0!important; box-shadow:none!important; } .bmj-contact-form-wrap .wpforms-field-name .wpforms-field-row{ max-width:none!important; } .bmj-contact-form-wrap .wpforms-field-name .wpforms-field-row-block{ padding:0 8px 0 0!important; } .bmj-contact-form-wrap .wpforms-field-name .wpforms-field-row-block:last-child{ padding-right:0!important; } .bmj-contact-form-wrap .wpforms-field-sublabel{ margin-top:6px!important; color:var(--bmj-muted)!important; font-family:var(--bmj-sans)!important; font-size:.68rem!important; } .bmj-contact-form-wrap .wpforms-field-radio ul, .bmj-contact-form-wrap .wpforms-field-checkbox ul, .bmj-contact-form-wrap ul.wpforms-field-required{ display:grid!important; grid-template-columns:1fr!important; gap:8px!important; margin:0!important; padding:0!important; list-style:none!important; } .bmj-contact-form-wrap .wpforms-field-radio li, .bmj-contact-form-wrap .wpforms-field-checkbox li{ margin:0!important; } .bmj-contact-form-wrap .wpforms-field-radio label, .bmj-contact-form-wrap .wpforms-field-checkbox label{ color:var(--bmj-ink)!important; font-family:var(--bmj-sans)!important; font-size:.92rem!important; line-height:1.4!important; } .bmj-contact-form-wrap input[type="radio"], .bmj-contact-form-wrap input[type="checkbox"]{ accent-color:var(--bmj-plum); } .bmj-contact-form-wrap .wpforms-submit-container{ margin:4px 0 0!important; padding:0!important; } .bmj-contact-form-wrap button[type="submit"], .bmj-contact-form-wrap .wpforms-submit{ min-height:46px!important; padding:0 20px!important; border:1px solid var(--bmj-ink)!important; border-radius:0!important; background:var(--bmj-ink)!important; box-shadow:none!important; color:#fff!important; font-family:var(--bmj-sans)!important; font-size:.72rem!important; font-weight:700!important; letter-spacing:.04em!important; text-transform:uppercase!important; transition:background .18s ease,color .18s ease!important; } .bmj-contact-form-wrap button[type="submit"]:hover, .bmj-contact-form-wrap button[type="submit"]:focus-visible, .bmj-contact-form-wrap .wpforms-submit:hover, .bmj-contact-form-wrap .wpforms-submit:focus-visible{ background:var(--bmj-plum)!important; border-color:var(--bmj-plum)!important; color:#fff!important; } .bmj-contact-form-wrap .wpforms-confirmation-container-full, .bmj-contact-form-wrap div[submit-success]>.wpforms-confirmation-container-full{ margin:0!important; padding:22px!important; border:1px solid var(--bmj-line)!important; background:#f3f4f6!important; color:var(--bmj-ink)!important; font-family:var(--bmj-sans)!important; } .bmj-contact-form-wrap .wpforms-error{ color:var(--bmj-red)!important; font-family:var(--bmj-sans)!important; font-size:.72rem!important; } .bmj-contact-form-missing{ padding:24px; border:1px solid var(--bmj-line); background:#f3f4f6; } .bmj-contact-form-missing p{ margin:0!important; font-family:var(--bmj-sans)!important; color:var(--bmj-muted); } /* Prevent Pinterest image-hover tooling from being relevant on Contact. */ .bmj-contact img[data-pin-no-hover], .bmj-contact-form-wrap img{ pointer-events:none; } @media(max-width:900px){ .bmj-contact-hero__inner, .bmj-contact-body__inner{ grid-template-columns:1fr; gap:30px; } .bmj-contact-notes{ position:static; max-width:540px; } } @media(max-width:650px){ .bmj-contact-hero{ padding:52px 0 60px; } .bmj-contact-hero h1{ max-width:11ch; font-size:clamp(3.15rem,14vw,4.7rem)!important; } .bmj-contact-body{ padding:48px 0 58px; } .bmj-contact-form-wrap{ padding:24px 18px; } .bmj-contact-form-wrap .wpforms-field-name .wpforms-field-row{ display:block!important; } .bmj-contact-form-wrap .wpforms-field-name .wpforms-field-row-block{ width:100%!important; padding:0!important; } .bmj-contact-form-wrap .wpforms-field-name .wpforms-field-row-block + .wpforms-field-row-block{ margin-top:16px!important; } } @media(prefers-reduced-motion:reduce){ .bmj-contact-form-wrap input, .bmj-contact-form-wrap textarea, .bmj-contact-form-wrap select, .bmj-contact-form-wrap button{ transition:none!important; } } /* ========================================================= v0.20.1 — CONTACT HERO ALIGNMENT ========================================================= */ .bmj-contact-hero__inner{ grid-template-columns:minmax(90px,.16fr) minmax(0,.84fr)!important; gap:clamp(24px,4vw,64px)!important; } .bmj-contact-hero__copy{ max-width:900px!important; } @media(max-width:900px){ .bmj-contact-hero__inner{ grid-template-columns:1fr!important; gap:22px!important; } } /* ========================================================= v0.20.2 — CONTACT LAYOUT CORRECTION Replace the split editorial lanes with one clear reading path. ========================================================= */ /* HERO: label, headline, support copy all belong to one column. */ .bmj-contact-hero__inner{ display:block!important; width:min(calc(100vw - 48px),1100px)!important; max-width:1100px!important; margin-inline:auto!important; padding-inline:0!important; } .bmj-contact-hero__label{ margin:0 0 18px!important; } .bmj-contact-hero__copy{ max-width:900px!important; } .bmj-contact-hero h1{ max-width:11ch!important; font-size:clamp(3.55rem,6.2vw,6.5rem)!important; } .bmj-contact-hero__copy>p{ max-width:36rem!important; margin-top:26px!important; } /* BODY: compact note row first, then a full-width form. */ .bmj-contact-body__inner{ display:block!important; width:min(calc(100vw - 48px),1100px)!important; max-width:1100px!important; margin-inline:auto!important; padding-inline:0!important; } .bmj-contact-notes{ position:static!important; display:grid!important; grid-template-columns:120px minmax(0,1fr) auto; align-items:start; gap:24px!important; max-width:none!important; margin:0 0 30px!important; padding:0 0 24px!important; border-bottom:1px solid var(--bmj-line); } .bmj-contact-notes .bmj-kicker{ padding-top:3px; } .bmj-contact-notes p{ max-width:520px!important; margin:0!important; } .bmj-contact-notes .bmj-inline-link{ margin:0!important; white-space:nowrap; } .bmj-contact-form-wrap{ width:100%!important; max-width:none!important; margin:0!important; padding:clamp(26px,4vw,48px)!important; } /* Ensure WPForms itself cannot create horizontal pressure. */ .bmj-contact-form-wrap .wpforms-container, .bmj-contact-form-wrap .wpforms-form, .bmj-contact-form-wrap .wpforms-field-container, .bmj-contact-form-wrap .wpforms-field-row{ width:100%!important; max-width:100%!important; box-sizing:border-box!important; } @media(max-width:900px){ .bmj-contact-hero__inner, .bmj-contact-body__inner{ width:min(calc(100vw - 40px),760px)!important; } .bmj-contact-notes{ grid-template-columns:1fr!important; gap:10px!important; } .bmj-contact-notes .bmj-inline-link{ margin-top:6px!important; } } @media(max-width:650px){ .bmj-contact-hero__inner, .bmj-contact-body__inner{ width:calc(100vw - 28px)!important; } .bmj-contact-hero h1{ font-size:clamp(3rem,13.5vw,4.35rem)!important; } .bmj-contact-notes{ margin-bottom:24px!important; padding-bottom:20px!important; } } /* ========================================================= v0.20.3 — CONTACT ASTRA WRAPPER FIX The old Contact page retained a constrained Astra/Elementor page layout. Reset the outer theme wrappers so the coded Contact template can center itself across the full viewport. ========================================================= */ body.bmj-contact-page #content, body.bmj-contact-page #content.site-content{ width:100%!important; max-width:none!important; margin:0!important; padding:0!important; } body.bmj-contact-page #content>.ast-container{ display:block!important; width:100%!important; max-width:none!important; margin:0!important; padding:0!important; } body.bmj-contact-page #primary, body.bmj-contact-page .site-main{ float:none!important; width:100%!important; max-width:none!important; margin:0!important; padding:0!important; } body.bmj-contact-page #secondary{ display:none!important; } body.bmj-contact-page .bmj-contact{ width:100%!important; max-width:none!important; margin:0!important; overflow-x:hidden; } /* v1.0.2 — destination links inherit the approved visual design */ .bmj-service-title-link, .bmj-service-title-link:visited{ color:inherit!important; font:inherit!important; line-height:inherit!important; letter-spacing:inherit!important; text-decoration:none!important; } .bmj-service-title-link:hover, .bmj-service-title-link:focus-visible{ color:inherit!important; text-decoration:none!important; } .bmj-service-image-link{ display:block; width:100%; height:100%; } .bmj-service-image-link img{ display:block; width:100%; height:100%; } .bmj-blog-lead__image>a, .bmj-blog-card__image>a, .bmj-hub-card__image>a, .bmj-related-card__image>a{ display:block; } /* ========================================================= v1.0.6 — GLOBAL HEADER CONSISTENCY / REGRESSION HARDENING ========================================================= */ .bmj-header{ -webkit-backdrop-filter:blur(14px); } .bmj-mobile-menu[hidden]{ display:none!important; } .bmj-wordmark:focus-visible, .bmj-menu a:focus-visible, .bmj-menu-toggle:focus-visible{ outline:2px solid var(--bmj-plum)!important; outline-offset:4px; } @media(min-width:821px){ .bmj-mobile-menu{ display:none!important; } } /* ========================================================= v1.0.9 — RESPONSIVE EDITORIAL ABOUT MJ CLOSER ========================================================= */ .bmj-endcap{ position:relative; isolation:isolate; overflow:hidden; background:var(--bmj-paper); } .bmj-endcap::before{ content:""; position:absolute; top:0; left:0; width:clamp(72px,9vw,132px); height:4px; background:var(--bmj-plum); } .bmj-endcap::after{ content:""; position:absolute; top:clamp(54px,7vw,92px); right:clamp(28px,5vw,78px); width:8px; height:8px; background:var(--bmj-red); } .bmj-endcap__inner{ position:relative; z-index:1; padding:clamp(72px,8vw,116px) 0 clamp(76px,9vw,126px)!important; } .bmj-endcap__lead{ display:grid; grid-template-columns:minmax(180px,.34fr) minmax(0,.66fr); gap:clamp(44px,8vw,132px); align-items:start; max-width:none!important; } .bmj-endcap__identity{ position:relative; min-height:clamp(230px,25vw,350px); padding:4px 0 0 clamp(18px,2vw,30px); border-left:1px solid rgba(94,84,111,.34); } .bmj-endcap__identity .bmj-kicker{ display:inline-flex; align-items:center; gap:.7rem; font-size:.66rem; } .bmj-endcap__identity .bmj-kicker::after{ content:""; width:34px; height:1px; background:rgba(94,84,111,.5); } .bmj-endcap__mark{ position:absolute; left:clamp(12px,1.7vw,24px); bottom:-.08em; display:block; color:rgba(94,84,111,.07); font:400 clamp(6.8rem,12vw,12.8rem)/.72 var(--bmj-serif); letter-spacing:-.09em; user-select:none; pointer-events:none; } @supports(-webkit-text-stroke:1px #000){ .bmj-endcap__mark{ color:transparent; -webkit-text-stroke:1px rgba(94,84,111,.22); } } .bmj-endcap__story{ max-width:56rem; padding-top:1px; } .bmj-endcap__lead .bmj-endcap__note{ max-width:42rem!important; margin:0!important; padding:0 0 clamp(28px,3.4vw,46px); border-bottom:1px solid rgba(23,21,24,.16); color:var(--bmj-muted); font-size:clamp(.92rem,1.05vw,1.04rem)!important; line-height:1.72!important; } .bmj-endcap__lead .bmj-endcap__question{ max-width:15ch!important; margin:clamp(30px,3.6vw,50px) 0 0!important; color:var(--bmj-ink); font-size:clamp(2.2rem,3.8vw,4.2rem)!important; line-height:1.02!important; letter-spacing:-.045em!important; text-wrap:balance; } .bmj-endcap .bmj-endcap__about-link{ margin-top:clamp(30px,3vw,42px)!important; } .bmj-endcap__about-link:focus-visible{ outline:2px solid var(--bmj-plum); outline-offset:5px; } @media(max-width:900px){ .bmj-endcap::after{ top:56px; right:24px; } .bmj-endcap__inner{ padding:62px 0 76px!important; } .bmj-endcap__lead{ grid-template-columns:minmax(150px,.28fr) minmax(0,.72fr); gap:clamp(32px,6vw,66px); } .bmj-endcap__identity{ min-height:250px; } .bmj-endcap__mark{ font-size:clamp(6rem,16vw,9.5rem); } .bmj-endcap__lead .bmj-endcap__question{ max-width:16ch!important; font-size:clamp(2rem,5vw,3.35rem)!important; } } @media(max-width:680px){ .bmj-endcap{ background:var(--bmj-paper); } .bmj-endcap::before{ width:84px; } .bmj-endcap::after{ top:46px; right:18px; width:7px; height:7px; } .bmj-endcap__inner{ padding:48px 0 58px!important; } .bmj-endcap__lead{ display:block; } .bmj-endcap__identity{ min-height:92px; padding:2px 0 20px 18px; border-left-color:rgba(94,84,111,.3); } .bmj-endcap__mark{ left:auto; right:0; bottom:8px; font-size:5.6rem; line-height:.72; opacity:.82; } .bmj-endcap__story{ position:relative; padding-top:26px; border-top:1px solid rgba(23,21,24,.14); } .bmj-endcap__lead .bmj-endcap__note{ max-width:100%!important; padding-bottom:26px; font-size:.92rem!important; line-height:1.68!important; } .bmj-endcap__lead .bmj-endcap__question{ max-width:17ch!important; margin-top:27px!important; font-size:clamp(1.95rem,9.6vw,2.75rem)!important; line-height:1.04!important; letter-spacing:-.04em!important; } .bmj-endcap .bmj-endcap__about-link{ margin-top:28px!important; } } @media(max-width:380px){ .bmj-endcap__mark{ font-size:4.8rem; } .bmj-endcap__lead .bmj-endcap__question{ font-size:1.85rem!important; } } @media(prefers-reduced-motion:reduce){ .bmj-endcap__about-link span{ transition:none!important; } } /* ========================================================= v1.0.13 — SITE-WIDE EDITORIAL RAIL ALIGNMENT STANDARD Shared pattern: contextual label in the left rail, primary heading/content in the right rail, both aligned at the top. ========================================================= */ :root{ --bmj-editorial-columns:minmax(110px,.22fr) minmax(0,.78fr); --bmj-editorial-gap:clamp(36px,7vw,110px); } @media(min-width:901px){ .bmj-services__head, .bmj-blog__masthead-inner, .bmj-article__header-inner, .bmj-hub__header-inner, .bmj-services-hero__inner, .bmj-services-offers__head, .bmj-about-hero__inner, .bmj-about-range__head, .bmj-about-work__inner{ grid-template-columns:var(--bmj-editorial-columns)!important; column-gap:var(--bmj-editorial-gap)!important; align-items:start!important; } /* Offers follows the same relationship as WORK → Creative direction. */ .bmj-services-offers__head>.bmj-kicker{ grid-column:1!important; grid-row:1!important; align-self:start!important; margin:0!important; } .bmj-services-offers__head h2{ grid-column:2!important; grid-row:1!important; } } @media(max-width:900px){ /* Every editorial rail becomes the same single reading path on tablet/mobile. */ .bmj-services__head, .bmj-blog__masthead-inner, .bmj-hub__header-inner, .bmj-services-hero__inner, .bmj-services-offers__head, .bmj-about-hero__inner, .bmj-about-range__head, .bmj-about-work__inner{ grid-template-columns:1fr!important; row-gap:18px!important; column-gap:0!important; align-items:start!important; } .bmj-services-offers__head>.bmj-kicker, .bmj-services-offers__head h2{ grid-column:1!important; grid-row:auto!important; } } /* ========================================================= v1.0.14 — WORK WITH ME SERVICES FULL-BLEED NEUTRAL FIELD Keep the services content on the existing editorial shell, but extend its gray section background edge-to-edge. ========================================================= */ .bmj-services-offers{ box-shadow:0 0 0 100vmax #f3f4f6; clip-path:inset(0 -100vmax); } /* ========================================================= v1.0.15 — HOMEPAGE OPENING INTERACTIVE FALLBACK Keep the opening action rail present even before curated homepage features exist. Real featured posts still replace these pathway links automatically. ========================================================= */ .bmj-stage__rail--fallback .bmj-stage__path{ text-decoration:none!important; } .bmj-stage__rail--fallback .bmj-stage__path:hover, .bmj-stage__rail--fallback .bmj-stage__path:focus-visible{ background:rgba(94,84,111,.085)!important; box-shadow:inset 0 -3px 0 var(--bmj-plum)!important; outline:none; } .bmj-stage__rail--fallback .bmj-stage__path:focus-visible{ box-shadow:inset 0 -3px 0 var(--bmj-plum),inset 0 0 0 2px rgba(94,84,111,.34)!important; } #bmj-browse{ scroll-margin-top:24px; } @media(prefers-reduced-motion:reduce){ #bmj-browse{scroll-margin-top:0;} } /* ========================================================= v1.0.16 — HOMEPAGE FALLBACK RAIL VISUAL POLISH Keep the empty-state pathways interactive, but make them read as part of the hero instead of a second nav bar. The real featured-post rail is intentionally unchanged. ========================================================= */ .bmj-stage__rail--fallback{ border-color:rgba(23,21,24,.09)!important; background:rgba(252,251,250,.80)!important; backdrop-filter:blur(16px) saturate(108%)!important; -webkit-backdrop-filter:blur(16px) saturate(108%)!important; box-shadow:0 1px 0 rgba(23,21,24,.025); } .bmj-stage__rail--fallback .bmj-stage__path{ min-height:52px; padding:10px 14px!important; gap:.58rem; border-right-color:rgba(23,21,24,.075)!important; transition:background .18s ease,box-shadow .18s ease,transform .18s ease!important; } .bmj-stage__rail--fallback .bmj-stage__path small{ opacity:.72; font-size:.51rem; } .bmj-stage__rail--fallback .bmj-stage__path span{ font-size:.60rem!important; } .bmj-stage__rail--fallback .bmj-stage__path:hover, .bmj-stage__rail--fallback .bmj-stage__path:focus-visible{ background:rgba(94,84,111,.045)!important; box-shadow:inset 0 -2px 0 rgba(94,84,111,.72)!important; transform:none; } .bmj-stage__rail--fallback .bmj-stage__path:focus-visible{ outline:2px solid rgba(94,84,111,.38); outline-offset:-2px; } @media(max-width:1099px){ .bmj-stage__rail--fallback{ background:#fbfafb!important; backdrop-filter:none!important; -webkit-backdrop-filter:none!important; border-top:1px solid rgba(23,21,24,.09)!important; } .bmj-stage__rail--fallback .bmj-stage__path{ min-height:52px; } } @media(max-width:600px){ .bmj-stage__rail--fallback .bmj-stage__path{ min-height:50px; padding:10px 12px!important; } } @media(prefers-reduced-motion:reduce){ .bmj-stage__rail--fallback .bmj-stage__path{ transition:none!important; } }