:root {
  --sba-bg: #fffaf4;
  --sba-text: #4f4b46;
  --sba-muted: #84817e;
  --sba-line: #bcbab9;
  --sba-dark: #383430;
  --sba-dark-2: #5b534c;
}
.sba-page,
.sba-page * { box-sizing: border-box; }
.sba-page { overflow: hidden; background: var(--sba-bg); color: var(--sba-text); font-family: "SF Pro Display", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif; }
.sba-page img { width: 100%; height: 100%; object-fit: cover; display: block; }
.sba-page h1,.sba-page h2,.sba-page h3,.sba-page p,.sba-page blockquote { margin: 0; }
.sba-page em,.sba-serif { font-family: "Playfair Display", Georgia, serif; font-style: italic; font-weight: 400; }
.sba-desktop { display: block; }
.sba-mobile { display: none; }
.sba-kicker { color: var(--sba-muted); font-size: clamp(14px,1.25vw,24px); line-height: 1; letter-spacing: -.05em; text-transform: uppercase; }
.sba-section-pad { padding: clamp(70px,6.7vw,128px) max(40px,2.1vw); }
.sba-reveal { opacity: 0; transform: translateY(28px); transition: opacity .7s ease, transform .7s ease; }
.sba-reveal.is-visible { opacity: 1; transform: none; }
@media (prefers-reduced-motion: reduce) { .sba-reveal { opacity: 1; transform: none; transition: none; } }

.sba-hero { position: relative; min-height: 862px; height: 44.9vw; max-height: 980px; background: var(--sba-bg); }
.sba-hero-title { position: absolute; z-index: 3; left: 1.5vw; top: 4.2vw; display: flex; flex-direction: column; font-size: clamp(120px,12.4vw,238px); line-height: .8; letter-spacing: -.09em; text-transform: uppercase; }
.sba-hero-title .sba-serif { line-height: .7; }
.sba-hero-left { position: absolute; left: 0; bottom: 0; width: 26.1%; height: 52.8%; }
.sba-hero-right { position: absolute; right: 0; top: 0; width: 50%; height: 100%; }
.sba-scroll { position: absolute; z-index: 4; left: 42.4%; top: 47%; width: 135px; height: 135px; border: 0; background: var(--sba-dark); color: #fff; font-size: 70px; font-weight: 200; cursor: pointer; }

.sba-brand { position: relative; padding: 200px 40px 0; min-height: 1488px; }
.sba-brand > .sba-kicker { text-align: center; }
.sba-brand > h1 { margin: 42px auto 34px; max-width: 1550px; text-align: center; font-size: clamp(52px,5vw,96px); line-height: .9; letter-spacing: -.07em; font-weight: 400; }
.sba-brand-lead { max-width: 825px; margin: 0 auto; text-align: center; font-size: clamp(22px,1.67vw,32px); line-height: 1.2; letter-spacing: -.03em; }
.sba-brand-collage { position: relative; height: 620px; margin-top: 112px; }
.sba-brand-main { position: absolute; left: 26%; top: 0; width: 23.2%; height: 480px; }
.sba-brand-mini { position: absolute; height: 170px; }
.sba-mini-1 { right: 8.2%; top: 0; width: 9.8%; }
.sba-mini-2 { right: 16.7%; top: 217px; width: 17.9%; }
.sba-mini-3 { left: 0; top: 0; width: 9.8%; }
.sba-mini-4 { left: 0; top: 310px; width: 9.8%; }
.sba-brand-copy { position: absolute; font-size: 20px; line-height: 1.3; letter-spacing: -.03em; }
.sba-copy-a { left: 50.5%; top: 54px; width: 290px; }
.sba-copy-b { left: 66.7%; top: 426px; width: 362px; }
.sba-wordmark { margin-top: -40px; font-size: clamp(80px,11.5vw,220px); line-height: 1; letter-spacing: .22em; text-align: center; color: rgba(79,75,70,.09); white-space: nowrap; }

.sba-founder { position: relative; min-height: 918px; padding: 100px 8vw 80px; background: var(--sba-dark); color: #fff; text-align: center; }
.sba-founder .sba-kicker { color: var(--sba-line); }
.sba-founder blockquote { margin: 86px auto 40px; max-width: 1735px; font-size: clamp(38px,3.34vw,64px); line-height: .9; letter-spacing: -.07em; }
.sba-founder-details { display: grid; justify-items: center; gap: 4px; margin-top: 70px; }
.sba-founder-details img { width: 256px; height: 272px; margin-bottom: 16px; }
.sba-founder-details strong { font-size: 32px; font-weight: 500; }
.sba-founder-details span { color: #afaeac; font-size: 20px; }

.sba-history { min-height: 1450px; }
.sba-history > .sba-kicker { text-align: center; }
.sba-history > h2 { max-width: 985px; margin: 54px auto 100px; text-align: center; font-size: clamp(40px,3.34vw,64px); line-height: .9; letter-spacing: -.07em; font-weight: 400; }
.sba-history-grid { display: grid; grid-template-columns: 2fr .64fr .64fr; grid-template-rows: auto auto; gap: 24px 30px; align-items: start; }
.sba-history-wide { grid-row: 1 / span 2; height: 627px; }
.sba-history-text { font-size: 24px; line-height: 1.2; }
.sba-history-square { height: 285px; }
.sba-history-tall { grid-column: 3; grid-row: 1 / span 2; height: 625px; }
.sba-history-small { font-size: 20px; line-height: 1.3; }

.sba-dna { display: grid; grid-template-columns: 1fr 1fr; min-height: 1380px; }
.sba-dna-dark { padding: 64px 40px; background: var(--sba-dark); color: #fff; }
.sba-dna-dark .sba-kicker { color: var(--sba-line); }
.sba-dna-dark > h2 { margin-top: 24px; font-size: clamp(40px,3.34vw,64px); line-height: .9; letter-spacing: -.07em; font-weight: 400; }
.sba-dna-dark > h2 span { color: #afaeac; }
.sba-values { display: grid; gap: 42px; margin-top: 70px; }
.sba-values article { max-width: 540px; margin: 0 auto; text-align: center; }
.sba-values i { font-family: Arial,sans-serif; font-style: normal; letter-spacing: .35em; color: #fff; }
.sba-values h3 { margin: 8px 0 10px; font-size: 28px; font-weight: 500; }
.sba-values p { color: var(--sba-line); font-size: 20px; line-height: 1.3; }
.sba-dna-photo { min-height: 1380px; }

.sba-philosophy { min-height: 930px; }
.sba-philosophy-grid { display: grid; grid-template-columns: 1fr 1fr 1fr 1fr; gap: 10px; margin-top: 42px; align-items: start; }
.sba-philosophy h2 { grid-column: 1 / span 2; font-size: clamp(50px,5vw,96px); line-height: .9; letter-spacing: -.07em; font-weight: 400; }
.sba-philosophy h2 span { color: var(--sba-line); }
.sba-philosophy-copy { grid-column: 3; margin-top: 555px; }
.sba-philosophy-copy h3 { font-size: 32px; line-height: 1.2; font-weight: 400; }
.sba-philosophy-copy p { margin-top: 32px; color: rgba(79,75,70,.7); font-size: 20px; line-height: 1.3; }
.sba-philosophy-img { grid-column: 3; grid-row: 1; height: 482px; }
.sba-philosophy-img.tall { grid-column: 4; height: 732px; }

.sba-collections { min-height: 1215px; }
.sba-collections .centered { text-align: center; }
.sba-collections > h2 { margin: 40px auto; text-align: center; font-size: clamp(50px,5vw,96px); line-height: .9; letter-spacing: -.07em; font-weight: 400; }
.sba-collections-intro { display: grid; grid-template-columns: 1fr 1.5fr; gap: 50px; max-width: 1050px; margin: 70px auto 90px; align-items: start; }
.sba-collections-intro p:first-child { font-size: 32px; line-height: 1.2; text-align: right; }
.sba-collections-intro p:last-child { color: var(--sba-muted); font-size: 20px; line-height: 1.3; }
.sba-collection-strip { display: grid; grid-template-columns: 1fr 1fr 1.35fr 1fr 1fr; gap: 24px; align-items: end; }
.sba-collection-strip img { height: 373px; }
.sba-collection-strip img.featured { height: 691px; }

.sba-women { position: relative; min-height: 985px; }
.sba-women h2 { position: relative; z-index: 2; max-width: 690px; font-size: clamp(50px,5vw,96px); line-height: .9; letter-spacing: -.07em; font-weight: 400; }
.sba-women h2.right { margin: 330px 0 0 auto; text-align: right; }
.sba-women-collage { position: absolute; left: 50%; top: 105px; width: 520px; height: 610px; transform: translateX(-50%); }
.sba-women-collage .layer { position: absolute; inset: 0; object-fit: cover; }
.sba-women-collage .layer-a { transform: rotate(-.1deg); }
.sba-women-collage .layer-b { transform: rotate(3.5deg); }
.sba-women-collage .layer-c { transform: rotate(-3.7deg); }
.sba-women-tags span { position: absolute; z-index: 4; padding: 4px; background: #fff; max-width: 370px; font-size: 20px; line-height: 1.3; }
.sba-women-tags span:nth-child(1) { left: 22%; top: 350px; }
.sba-women-tags span:nth-child(2) { right: 17%; top: 175px; }
.sba-women-tags span:nth-child(3) { right: 17%; top: 410px; }
.sba-women-tags span:nth-child(4) { left: 28%; top: 665px; }

.sba-family { position: relative; display: grid; grid-template-columns: 1fr 1fr; gap: 50px; min-height: 950px; }
.sba-family-copy h2 { margin-top: 55px; font-size: clamp(50px,5vw,96px); line-height: .9; letter-spacing: -.07em; font-weight: 400; }
.sba-family-copy .lead { max-width: 670px; margin-top: 120px; font-size: 32px; line-height: 1.2; }
.sba-family-copy > p:last-child { max-width: 420px; margin-top: 34px; color: rgba(79,75,70,.7); font-size: 20px; line-height: 1.3; }
.sba-family-photo { height: 747px; }
.sba-family-small { position: absolute; left: 34%; top: 0; width: 179px; height: 170px; }

.sba-love { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; min-height: 1100px; }
.sba-love-photo { position: relative; height: 890px; }
.sba-love-photo > p { position: absolute; left: 10%; right: 10%; bottom: 80px; padding: 4px; background: #fff; text-align: center; font-size: 20px; line-height: 1.3; }
.sba-love-dark { min-height: 890px; padding: 64px 40px; background: var(--sba-dark); color: #fff; text-align: center; }
.sba-love-dark .sba-kicker { color: var(--sba-line); }
.sba-love-dark h2 { margin-top: 18px; font-size: clamp(40px,3.34vw,64px); line-height: .9; letter-spacing: -.07em; font-weight: 400; }
.sba-love-dark img { width: 350px; height: 341px; margin: 48px auto; }
.sba-love-dark > p:last-child { font-size: 32px; line-height: 1.2; }

.sba-mobile { padding: 24px; background: var(--sba-bg); }
.sba-m-hero h1,.sba-m-section h2,.sba-m-quote blockquote,.sba-m-final { font-family: "Playfair Display", Georgia, serif; font-style: italic; font-weight: 400; }
.sba-m-hero h1 { margin: 0 0 27px; font-size: 40px; line-height: 47px; }
.sba-m-hero img { height: 450px; }
.sba-m-section { margin-top: 27px; }
.sba-m-kicker { margin-bottom: 9px !important; color: var(--sba-muted); font-size: 10px; line-height: 13px; letter-spacing: .11em; }
.sba-m-section h2 { font-size: 30px; line-height: 37px; }
.sba-m-section > p:last-child { margin-top: 9px; font-size: 15px; line-height: 22px; }
.sba-m-image { height: 350px; margin-top: 27px; }
.sba-m-image.medium { height: 380px; }
.sba-m-image.tall { height: 410px; }
.sba-m-quote { margin-top: 27px; }
.sba-m-quote blockquote { font-size: 24px; line-height: 32px; }
.sba-m-quote strong,.sba-m-quote span { display: block; margin-top: 12px; color: var(--sba-muted); font-size: 13px; line-height: 20px; }
.sba-m-quote span { margin-top: 0; }
.sba-m-values { display: grid; gap: 1px; margin-top: 18px; }
.sba-m-values article { padding: 18px; background: #f5f3ef; }
.sba-m-values article:nth-child(odd) { background: var(--sba-bg); }
.sba-m-values small { color: var(--sba-muted); font-size: 10px; }
.sba-m-values h3 { margin-top: 7px; font-family: "Playfair Display", Georgia, serif; font-style: italic; font-size: 20px; line-height: 26px; font-weight: 400; }
.sba-m-final { margin: 32px 0 10px; text-align: center; font-size: 27px; line-height: 35px; }

@media (max-width: 1100px) and (min-width: 768px) {
  .sba-hero { min-height: 620px; }
  .sba-scroll { width: 90px; height: 90px; font-size: 45px; }
  .sba-brand { min-height: 1200px; padding-top: 120px; }
  .sba-brand-collage { transform: scale(.8); transform-origin: top center; }
  .sba-founder { min-height: 760px; }
  .sba-history { min-height: 1150px; }
  .sba-dna { min-height: 1100px; }
  .sba-dna-photo { min-height: 1100px; }
}
@media (max-width: 767px) {
  .sba-desktop { display: none; }
  .sba-mobile { display: block; }
  .sba-page { background: #fff; }
  .sba-reveal { opacity: 1; transform: none; }
}