/* Founder page: hero, scrapbook polaroids, pull quote (2 Nov 2026) */
.founder-hero .wrap { display: grid; gap: var(--space-8); align-items: center; }
@media (min-width: 860px) { .founder-hero .wrap { grid-template-columns: 1.1fr .9fr; gap: var(--space-12); } }
.founder-hero__copy { text-align: center; }
@media (min-width: 860px) { .founder-hero__copy { text-align: left; } }
.founder-hero__copy .headline--big { margin-bottom: var(--space-3); }

/* Polaroid frame for the scrapbook */
.snap { position: relative; margin: 0; background: #fff; padding: 12px 12px 14px; box-shadow: 0 2px 4px rgba(35,31,32,.08), 0 12px 28px rgba(126,63,158,.14); transform: rotate(var(--tilt, 0deg)); }
.snap img { display: block; width: 100%; height: auto; }
.snap figcaption { font-family: var(--font-hand); font-weight: 400; color: var(--ink); font-size: 23px; line-height: 1.22; padding: 12px 4px 2px; text-align: center; }
.snap::before { content: ""; position: absolute; top: -14px; left: 50%; width: 96px; height: 28px; margin-left: -48px; background: var(--tape, rgba(250,190,235,.72)); transform: rotate(var(--tape-tilt, -4deg)); box-shadow: 0 1px 2px rgba(35,31,32,.06); }
.snap--lagoon { --tape: rgba(157,241,255,.7); }
.snap--citrus { --tape: rgba(210,252,150,.75); }
.snap--lilac { --tape: rgba(226,169,241,.7); }
.snap--coral { --tape: rgba(255,182,155,.72); }

.founder-hello { font-family: var(--font-hand); color: var(--barbie); font-size: clamp(38px, 6vw, 48px); line-height: 1.15; margin: 0 0 var(--space-4); }
.prose .founder-beat { font-size: 21px; line-height: 31px; font-weight: 700; color: var(--lilac-ink); }

/* Scrapbook spread */
.scrapbook { list-style: none; margin: var(--space-12) auto 0; padding: 0; display: flex; flex-wrap: wrap; justify-content: center; gap: var(--space-12) var(--space-8); max-width: 1040px; }
.scrapbook > li { width: min(84%, 270px); }
.scrapbook > li.scrapbook__wide { width: min(92%, 400px); }
.scrapbook > li:nth-child(1) .snap { --tilt: -3deg; }
.scrapbook > li:nth-child(2) .snap { --tilt: 2.5deg; --tape-tilt: 5deg; }
.scrapbook > li:nth-child(3) .snap { --tilt: -1.5deg; }
.scrapbook > li:nth-child(4) .snap { --tilt: 1.5deg; --tape-tilt: 3deg; }
.scrapbook > li:nth-child(5) .snap { --tilt: -2.5deg; --tape-tilt: -6deg; }
@media (min-width: 960px) {
  .scrapbook > li:nth-child(2) { margin-top: var(--space-12); }
  .scrapbook > li:nth-child(4) { margin-top: calc(var(--space-12) * -1); }
}
@media (prefers-reduced-motion: no-preference) {
  .snap { transition: transform .25s ease; }
  .scrapbook .snap:hover { transform: rotate(0deg) scale(1.03); }
}

/* Pull quote */
.founder-quote { max-width: 18em; margin: 0 auto var(--space-6); font-family: var(--font-display); font-weight: 400; text-transform: uppercase; letter-spacing: .03em; color: var(--lilac); font-size: clamp(34px, 5.5vw, 54px); line-height: 1.3; text-align: center; }
.founder-quote em { font-style: normal; color: var(--barbie); }
.founder-after-quote { max-width: 34em; margin: 0 auto; text-align: center; font-size: 19px; line-height: 29px; }

/* Hero portrait: cut-out photo standing on a soft wobbly blob */
.founder-portrait { position: relative; margin: 0 auto; width: min(80%, 400px); padding-top: var(--space-6); }
.founder-portrait::before { content: ""; position: absolute; left: 0; right: 0; bottom: 0; height: 74%; background: var(--bubblegum); border-radius: var(--wobble); transform: rotate(-3deg); z-index: 0; }
.founder-portrait::after { content: ""; position: absolute; left: 7%; right: -5%; bottom: -10px; height: 66%; border: 2.5px solid var(--lilac); border-radius: var(--wobble); transform: rotate(4deg); z-index: 0; }
.founder-portrait img { position: relative; z-index: 1; display: block; width: 100%; height: auto; -webkit-mask-image: linear-gradient(#000 92%, transparent); mask-image: linear-gradient(#000 92%, transparent); }
.founder-portrait figcaption { position: absolute; z-index: 2; right: -6%; top: 30%; font-family: var(--font-hand); font-size: clamp(26px, 4vw, 32px); color: var(--pink-ink); transform: rotate(8deg); background: #fff; padding: 2px 12px 6px; border-radius: var(--wobble); box-shadow: 2px 3px 0 var(--lagoon); }
.scrapbook > li:nth-child(6) .snap { --tilt: 2deg; --tape-tilt: 4deg; }