/* =====================================================================
   BDCC section blocks. Ported from the approved Staff preview.
   Rules carried over: halves/thirds/quarters, vertical centering, the
   center margin rule, lime only on dark grounds, one tick per headline.
   ===================================================================== */

/* breadcrumb: linked path, quiet parent, current page in accent */
.crumb-path{gap:10px}
.crumb-path::before{display:none}
.crumb-path a{color:var(--pine);opacity:.6;text-decoration:none;transition:opacity .2s}
.crumb-path a:hover{opacity:1}
.crumb-path i{font-style:normal;color:var(--pine);opacity:.35}
.crumb-path [aria-current]{color:var(--nectarine)}

/* ----- Photo split (Page Header, Call to Action) -----
   Dark pine; text on one half; the photo fills exactly the other half of the screen at full height.
   Text keeps the center margin rule: it sits as far from the center seam as the page margin is from the edge. */
.bx-split{background-color:var(--pine-deep);color:var(--sand);overflow:hidden;position:relative;padding-block:0}
.bx-split.has-rings{background-image:repeating-radial-gradient(circle at 50% 50%,transparent 0 95px,rgba(247,242,230,.08) 95px 96px)}
.bx-split .bx-g{display:flex;flex-direction:column}
.bx-split .bx-t{padding-block:clamp(56px,7vw,104px)}
.bx-split .crumb-path a,.bx-split .crumb-path i{color:var(--sand)}
.bx-split .crumb-path [aria-current]{color:var(--lime)}
.bx-h1{font-weight:700;font-stretch:112%;letter-spacing:-.03em;line-height:.95;font-size:clamp(2.8rem,6.4vw,6rem);color:var(--sand);margin:16px 0 0;text-wrap:balance}
.bx-split--header .crumb-path + .bx-h1{margin-top:16px}
.bx-split--header .bx-h1:first-child{margin-top:0}
.bx-h2{margin:0;font-weight:700;font-stretch:112%;letter-spacing:-.03em;line-height:.98;font-size:clamp(2.4rem,5vw,4.6rem);color:var(--sand);text-wrap:balance}
.bx-split .tick{display:block;width:96px;height:6px;background:var(--lime);margin:clamp(20px,2.4vw,28px) 0}
.bx-split--band .tick{margin:clamp(24px,2.8vw,36px) 0}
.bx-split .bx-h1 + .bx-x,.bx-split .bx-h2 + .bx-x{margin-top:20px}
.bx-x{margin:0;color:var(--sand);opacity:.9;font-size:clamp(1.12rem,1.4vw,1.19rem);line-height:1.6}
.bx-split--band .bx-x{max-width:34ch;font-size:clamp(1.12rem,1.5vw,1.3rem)}
.bx-split .btn{--bc:var(--lime);--gc:var(--pine-deep);margin-top:28px}
.bx-split--band .btn{margin-top:clamp(28px,3vw,40px)}
@media (max-width:599px){.bx-split .btn{width:100%}}
.bx-split .bx-p{margin:0 calc(-1 * var(--m));aspect-ratio:4/3;overflow:hidden}
.bx-split .bx-p img{width:100%;height:100%;object-fit:cover;display:block}
@media (min-width:960px){
 .bx-split .bx-g{display:grid;grid-template-columns:1fr 1fr;column-gap:56px;align-items:center}
 .bx-split--band .bx-g{min-height:clamp(560px,48vw,760px)}
 .bx-split .bx-p{aspect-ratio:auto;align-self:stretch;min-height:100%}
 .bx-split.photo-right .bx-p{margin:0 calc(-1 * max(var(--m), (100vw - var(--wrap)) / 2)) 0 -28px}
 .bx-split.photo-right .bx-t{padding-right:calc(max(var(--m), (100vw - var(--wrap)) / 2) - 28px)}
 .bx-split.photo-left .bx-p{order:-1;margin:0 -28px 0 calc(-1 * max(var(--m), (100vw - var(--wrap)) / 2))}
 .bx-split.photo-left .bx-t{padding-left:calc(max(var(--m), (100vw - var(--wrap)) / 2) - 28px)}
}

/* ----- People grid (Staff) ----- */
.sf-sec{padding-block:clamp(56px,7vw,104px);overflow-x:clip}
.sf-h2{margin:0;font-weight:700;font-stretch:112%;letter-spacing:-.025em;line-height:1.02;font-size:clamp(2rem,3.6vw,3.2rem);color:var(--pine);text-wrap:balance}
.sf-h2 + .sf-gl{margin-top:24px}
/* group label, then an orange rule to the right margin */
.sf-gl{display:flex;align-items:center;gap:16px;margin:0 0 24px;font-size:inherit}
.sf-gl::before{display:none!important}
.sf-gl::after{content:"";flex:1;height:1.5px;background:var(--nectarine);min-width:24px}
.sf-grid + .sf-gl{margin-top:clamp(48px,5vw,72px)}
.sf-grid{display:grid;gap:32px 24px;grid-template-columns:repeat(2,minmax(0,1fr))}
@media (min-width:640px){.sf-4{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media (min-width:1100px){.sf-4{grid-template-columns:repeat(4,minmax(0,1fr))}}
.sf-c{margin:0}
.sf-c h3{margin:16px 0 4px;font-size:clamp(1.15rem,1.5vw,1.35rem);letter-spacing:-.015em;line-height:1.15;color:var(--pine)}
.sf-c p{margin:0;line-height:1.4;opacity:.75}
.sf-ph{margin:0;aspect-ratio:4/5;overflow:hidden;background:var(--pine)}
.sf-ph img{width:100%;height:100%;object-fit:cover;display:block}
/* placeholder until headshots are in: pine square, outlined initials */
.sf-none{display:grid;place-items:center}
.sf-ini{font-weight:800;font-stretch:112%;letter-spacing:-.04em;line-height:1;font-size:clamp(3rem,6vw,5rem);color:transparent;-webkit-text-stroke:1.5px var(--lime)}
