/* /about: DDigiLeads (white-label fullest here). shared.css carries the chrome. */

/* Intentional width hierarchy on this page:
   - the "Who publishes it" origin block is the WIDE editorial hero
     (--about-hero), matching the home page lede width.
   - every supporting prose block (Four Doors, free assessment, About
     DDigiLeads) sits at the standard reading measure (--measure, defined in
     shared.css), which is VISIBLY NARROWER than the hero.
   The width contrast is deliberate: the hero opens the page, the narrower
   sections read as the supporting detail. */
:root { --about-hero: 64rem; }

.about { background: var(--color-surface-default); padding-block: var(--bdri-space-8); }
@media (min-width: 760px) { .about { padding-block: var(--bdri-space-9); } }
.about__inner { max-width: var(--measure); }
.about__h2 { font-family: var(--bdri-text-h2-family); font-size: var(--bdri-size-h3); font-weight: var(--bdri-weight-semibold); line-height: var(--bdri-lh-snug); color: var(--color-text-default); margin-block: var(--bdri-space-6) var(--bdri-space-3); }
.about__p { font-size: var(--bdri-size-body-lg); line-height: var(--bdri-lh-loose); color: var(--color-text-subtle); margin-bottom: var(--bdri-space-3); }
.about__cta { display: flex; flex-wrap: wrap; gap: var(--bdri-space-3); margin-top: var(--bdri-space-6); padding-top: var(--bdri-space-6); border-top: var(--bw-divider) solid var(--color-border-subtle); }

/* ---- "Who publishes it" : wide editorial hero --------------------------------
   Ported from the home page .lede pattern (eyebrow + large display-serif
   headline + body + short accent rule). The headline carries the display
   emphasis, so the origin paragraphs are uniform body text (.about__p) with no
   enlarged first paragraph. */
.about__origin { max-width: var(--about-hero); }
.about__origin-eyebrow { margin: 0 0 var(--bdri-space-3); }
.about__origin-title {
  font-family: var(--bdri-text-display-family);
  font-size: clamp(2rem, 4.4vw, 3rem);
  font-weight: var(--bdri-weight-semibold);
  line-height: var(--bdri-lh-snug);
  letter-spacing: var(--bdri-text-h2-tracking);
  color: var(--color-text-default);
  margin: 0 0 var(--bdri-space-5);
  text-wrap: balance;
}
.about__origin-body > .about__p:last-child { margin-bottom: 0; }
/* short accent rule, matching the home lede rule */
.about__origin-rule {
  display: block;
  width: 72px;
  height: var(--bw-accent);
  margin-top: var(--bdri-space-6);
  border-radius: var(--radius-pill);
  background: var(--color-accent-primary);
}

/* ---- founders ("Who's behind it"): light register, two-up portraits ------- */
.founders { background: var(--color-surface-subtle); border-top: var(--bw-divider) solid var(--color-border-subtle); padding-block: var(--bdri-space-8); }
@media (min-width: 760px) { .founders { padding-block: var(--bdri-space-9); } }
.founders__inner { max-width: 60rem; }
.founders__h2 { font-family: var(--bdri-text-h2-family); font-size: var(--bdri-size-h2); font-weight: var(--bdri-weight-semibold); line-height: var(--bdri-lh-snug); color: var(--color-text-default); margin: 0 0 var(--bdri-space-6); }
.founders__grid { display: grid; gap: var(--bdri-space-7); }
@media (min-width: 760px) { .founders__grid { grid-template-columns: 1fr 1fr; gap: var(--bdri-space-7); } }

.founder { display: flex; flex-direction: column; gap: var(--bdri-space-4); }
.founder__photo {
  display: block; width: 100%; height: auto; aspect-ratio: 4 / 5; object-fit: cover; object-position: center top;
  background: var(--color-surface-default);
  border: var(--bw-divider) solid var(--color-border-default);
  border-radius: var(--radius-card);
  box-shadow: var(--bdri-shadow-card);
}
.founder__body { display: flex; flex-direction: column; }
.founder__name { font-family: var(--bdri-text-h3-family); font-size: var(--bdri-size-h3); font-weight: var(--bdri-weight-semibold); line-height: var(--bdri-lh-snug); color: var(--color-text-default); margin: 0; }
.founder__role {
  font-family: var(--bdri-font-mono); font-size: var(--bdri-size-caption); letter-spacing: 0.04em;
  text-transform: uppercase; color: var(--color-accent-primary);
  margin: var(--bdri-space-2) 0 var(--bdri-space-3);
}
.founder__bio { font-size: var(--bdri-size-body); line-height: var(--bdri-lh-loose); color: var(--color-text-subtle); margin: 0; }

/* ---- About DDigiLeads blurb: light register ------------------------------- */
.ddigi-blurb { background: var(--color-surface-default); padding-block: var(--bdri-space-8); }
.ddigi-blurb__inner { max-width: var(--measure); }
.ddigi-blurb__h2 { font-family: var(--bdri-text-h2-family); font-size: var(--bdri-size-h3); font-weight: var(--bdri-weight-semibold); line-height: var(--bdri-lh-snug); color: var(--color-text-default); margin: 0 0 var(--bdri-space-4); }
.ddigi-blurb__p { font-size: var(--bdri-size-body-lg); line-height: var(--bdri-lh-loose); color: var(--color-text-subtle); margin: 0 0 var(--bdri-space-3); }
.ddigi-blurb__p:last-child { margin-bottom: 0; }

.inst-section { background: var(--color-surface-subtle); border-top: var(--bw-divider) solid var(--color-border-subtle); padding-block: var(--bdri-space-8); }