/* Our Story page (/our-story/). Built from Phoenix Williams's Canva mock-up (11/9), in the site's own fonts and colors:
   Playfair Display for headings, Poppins for text, the site blue #1762AE. Only this page uses these classes. */
.bd-story{--bd-blue:#1762AE;--bd-ink:#2D2A3D;--bd-text:#334155;font-family:"Poppins",Sans-serif;font-size:17px;line-height:1.75;color:var(--bd-text)}
.bd-story *,.bd-story *::before,.bd-story *::after{box-sizing:border-box}
.bd-story h1,.bd-story h2{font-family:"Playfair Display",serif;font-weight:500;color:var(--bd-ink);margin:0;letter-spacing:0}
.bd-story p{margin:0 0 1.1em}
.bd-story p:last-child{margin-bottom:0}
.bd-story .bd-wrap{width:min(1140px,calc(100% - 48px));margin-inline:auto}
.bd-story .bd-narrow{width:min(920px,calc(100% - 48px));margin-inline:auto}

/* bands */
.bd-story .bd-band{position:relative;padding:96px 0;text-align:center;overflow:hidden;isolation:isolate}
.bd-story .bd-band--blue{background:var(--bd-blue);color:#fff}
.bd-story .bd-band--blue h1,.bd-story .bd-band--blue h2,.bd-story .bd-band--photo h2{color:#fff}
.bd-story .bd-band h2{font-size:clamp(30px,3.6vw,46px);line-height:1.2;margin-bottom:26px}
.bd-story .bd-band p{max-width:880px;margin-inline:auto}
.bd-story .bd-hero{padding-top:176px}
.bd-story .bd-hero h1{font-size:clamp(34px,4.6vw,58px);line-height:1.15;margin-bottom:30px}
.bd-story .bd-kicker{font-family:"Playfair Display",serif;font-weight:500;text-transform:uppercase;font-size:clamp(15px,1.5vw,20px);letter-spacing:.03em;margin:0 0 24px}
.bd-story .bd-lead{font-size:clamp(17px,1.55vw,21px);line-height:1.7}

/* photo bands: the picture is set on the section (--bd-img), a dark layer sits on top so the white text stays readable */
.bd-story .bd-band--photo{color:#fff}
.bd-story .bd-band--photo::before{content:"";position:absolute;inset:0;z-index:-2;background:var(--bd-img) center/cover no-repeat}
.bd-story .bd-band--photo::after{content:"";position:absolute;inset:0;z-index:-1;background:rgba(14,30,66,.76)}
.bd-story .bd-people::before{filter:blur(6px) saturate(.75);transform:scale(1.08)}
.bd-story .bd-people::after{background:rgba(30,38,56,.74)}

/* the two founders */
.bd-story .bd-section{padding:96px 0 0}
.bd-story .bd-section h2{font-size:clamp(30px,3.6vw,46px);line-height:1.2;text-align:center;margin-bottom:56px}
.bd-story .bd-founder{display:grid;grid-template-columns:1fr 1fr;gap:56px;align-items:center;margin-bottom:64px}
.bd-story .bd-founder figure{margin:0}
.bd-story .bd-founder img{display:block;width:100%;aspect-ratio:3/2;object-fit:cover;border-radius:25px}
.bd-story .bd-founder p{text-align:left;font-size:17px}
/* The corridor photo is a small file (193 x 257 px): show it upright at about 1.4 times its size instead of cropping it to 3:2 and enlarging it nearly 3 times. */
.bd-story .bd-founder figure.bd-portrait{display:flex;justify-content:center}
.bd-story .bd-founder .bd-portrait img{width:100%;max-width:270px;aspect-ratio:193/257;object-fit:cover}
.bd-story .bd-conviction{font-family:"Playfair Display",serif;font-weight:500;text-transform:uppercase;font-size:clamp(19px,2vw,26px);line-height:1.45;text-align:center;color:var(--bd-ink);max-width:860px;margin:24px auto 0;padding-bottom:96px}

/* Experience Should Compound */
.bd-story .bd-compound{padding:96px 0}
.bd-story .bd-compound h2{font-size:clamp(30px,3.6vw,46px);line-height:1.2;text-align:center;margin-bottom:48px}
.bd-story .bd-compound-grid{display:grid;grid-template-columns:5fr 6fr;gap:56px;align-items:center}
.bd-story .bd-compound-grid p{font-size:17px}
.bd-story .bd-quote{margin:0;padding:48px 44px;border-radius:25px;background:#E3E7EE;color:#3A4254;text-align:center;font-style:italic;font-weight:500;text-transform:uppercase;font-size:clamp(18px,1.7vw,23px);line-height:1.55;letter-spacing:.02em}

@media (max-width:1024px){
  .bd-story .bd-founder,.bd-story .bd-compound-grid{gap:36px}
}
@media (max-width:767px){
  .bd-story{font-size:16px}
  .bd-story .bd-band,.bd-story .bd-compound{padding:64px 0}
  .bd-story .bd-band.bd-hero{padding-top:128px}
  .bd-story .bd-section{padding-top:64px}
  .bd-story .bd-section h2,.bd-story .bd-compound h2{margin-bottom:36px}
  .bd-story .bd-founder{grid-template-columns:1fr;gap:24px;margin-bottom:48px}
  .bd-story .bd-founder figure{order:-1}
  .bd-story .bd-conviction{padding-bottom:64px}
  .bd-story .bd-compound-grid{grid-template-columns:1fr;gap:28px}
  .bd-story .bd-quote{padding:32px 24px}
}
