/* /founder: the crown chakra's accent page. Plain text on the temple black, the slow rays behind it (the shared layer: assets/css/ds/chakra.css,
   assets/js/shell/chakra.js). No boxes, no cards, no chips: a short hairline opens each beat, the work for others is a list of plain rows and the
   social initiatives are plain names. Tokens only; the page wears Temple Dark in both themes (the wrapper carries .ds-theme-dark), the crown's colour
   comes from the layer's data-chakra rule (also set on the wrapper here).
   The portrait (when the media desk has placed one) keeps its approved area: a sized container, object-fit: contain, the backplate behind it, the layer
   behind both; nothing overlaps it. */
.founder-page { min-inline-size: 0; }
.founder-world { --ck: var(--ck-crown); --founder-pad: max(var(--ds-gutter, 1rem), calc((100% - 72rem) / 2)); font-family: var(--ds-font-ui); color: var(--ds-text); min-inline-size: 0; }
.founder-world a { color: var(--ds-accent); text-underline-offset: .2em; }
.founder-world a.ds-button { color: inherit; }
.founder-world :focus-visible { outline: 2px solid var(--ds-focus); outline-offset: 3px; border-radius: var(--ds-radius-sm); }

/* ---------------------------------------------------------------- the column: left, a short measure, the rays on the right */
.founder-world .ds-chakra-beat { box-sizing: border-box; padding-inline: var(--founder-pad); min-inline-size: 0; }
.founder-world .ds-chakra-beat > * { max-inline-size: none; margin-inline: 0; }
.founder-beat { padding-block: clamp(3.5rem, 11vh, 7rem) 0; }
.founder-beat.ds-chakra-beat--rule { border-block-start: 0; }
.founder-world .founder-col { display: flex; flex-direction: column; gap: var(--ds-space-5); min-inline-size: 0; max-inline-size: 34rem; padding-block-start: var(--ds-space-6); border-block-start: 1px solid var(--ds-border); }
.founder-world .founder-col--wide { max-inline-size: 40rem; }
.founder-beat--last { padding-block-end: clamp(5rem, 16vh, 9rem); }

/* ---------------------------------------------------------------- type: Cormorant Garamond for the voice, Mukta for the reading */
.founder-title, .founder-h, .founder-row__title, .founder-sub, .founder-statement { font-family: var(--ds-font-display); font-weight: 500; margin: 0; color: var(--ds-text); text-wrap: balance; }
.founder-title, .founder-h { text-shadow: 0 0 2.2rem color-mix(in srgb, var(--ck) 38%, transparent), 0 0 .6rem color-mix(in srgb, var(--ds-surface-sunken) 80%, transparent); }
.founder-title { font-size: clamp(2.7rem, 1.7rem + 4.6vw, 5.9rem); line-height: .98; letter-spacing: -.012em; overflow-wrap: break-word; }
.founder-h { font-size: clamp(2.1rem, 1.5rem + 2.6vw, 3.6rem); line-height: 1.04; letter-spacing: -.01em; overflow-wrap: break-word; }
.founder-statement { max-inline-size: 26ch; font-size: clamp(1.4rem, 1.1rem + 1.1vw, 1.95rem); line-height: 1.22; color: var(--ds-text-muted); text-shadow: 0 0 .6rem color-mix(in srgb, var(--ds-surface-sunken) 85%, transparent); }
.founder-sub { font-size: var(--ds-text-2xl); line-height: 1.15; margin-block-start: var(--ds-space-2); }
.founder-lede, .founder-prose, .founder-row__text, .founder-next__note, .founder-world .story-facts dd { font-variant-numeric: lining-nums tabular-nums;
  text-shadow: 0 0 .7rem color-mix(in srgb, var(--ds-surface-sunken) 90%, transparent), 0 0 .2rem color-mix(in srgb, var(--ds-surface-sunken) 80%, transparent); }
.founder-lede { margin: 0; max-inline-size: 32rem; font-size: var(--ds-text-lg); line-height: var(--ds-leading-normal); color: var(--ds-text); text-wrap: pretty; }
.founder-prose { max-inline-size: 60ch; font-size: var(--ds-text-md); line-height: 1.7; color: var(--ds-text); text-wrap: pretty; }
.founder-prose p { margin: 0 0 var(--ds-space-4); }
.founder-prose > p:last-child { margin-block-end: 0; }
.founder-prose a, .founder-world .story-facts a { display: inline-flex; align-items: center; min-block-size: 2.75rem; }
p.founder-prose { margin: 0; }

/* ---------------------------------------------------------------- the opening: the name low on the page, the portrait in its own area beside it */
.founder-world .founder-open { display: flex; align-items: center; min-block-size: min(46rem, 100svh); padding-block: calc(var(--ds-header-h) + var(--ds-space-9)) var(--ds-space-9); }
.founder-open__in { display: grid; gap: var(--ds-space-8); inline-size: 100%; min-inline-size: 0; }
.founder-open__in > * { min-inline-size: 0; }
.founder-open__text { display: flex; flex-direction: column; align-items: flex-start; gap: var(--ds-space-6); max-inline-size: 40rem; }
.founder-open .story-actions { margin-block-start: var(--ds-space-2); }
.founder-open .story-trust { color: var(--ds-text-muted); text-shadow: 0 0 .6rem color-mix(in srgb, var(--ds-surface-sunken) 90%, transparent); }
.founder-swaroop { position: relative; isolation: isolate; margin: 0 auto; inline-size: min(100%, 17rem); aspect-ratio: 4 / 5; }
.founder-swaroop img { display: block; inline-size: 100%; block-size: 100%; object-fit: contain; }
/* the luminous backplate: a quiet pool of dark that rests the rays behind it, an amber glow around it */
.founder-swaroop__plate { position: absolute; z-index: -1; inset: -12% -20%; max-inline-size: calc(100vw - 2 * var(--ds-space-4)); margin-inline: auto; pointer-events: none; filter: blur(var(--ds-blur-md));
  background: radial-gradient(closest-side, color-mix(in srgb, var(--ds-surface-sunken) 78%, transparent) 40%, color-mix(in srgb, var(--ds-accent) 24%, transparent) 72%, transparent 100%); }
@media (min-width: 64rem) {
  .founder-open__in--portrait { grid-template-columns: minmax(0, 40rem) minmax(0, 1fr); align-items: center; column-gap: var(--ds-space-10); }
  .founder-open__in--portrait .founder-swaroop { inline-size: 20rem; justify-self: center; }
}

/* ---------------------------------------------------------------- what he began: the dates as plain rows (a hairline above each, the year set large) */
.founder-world .story-facts { margin: var(--ds-space-2) 0 0; padding: 0; display: grid; gap: 0; border-block-start: 1px solid var(--ds-border); }
.founder-world .story-facts__row { display: grid; gap: var(--ds-space-1) var(--ds-space-6); padding-block: var(--ds-space-4); border-block-end: 1px solid var(--ds-border); }
.founder-world .story-facts dt { margin: 0; font-family: var(--ds-font-display); font-size: var(--ds-text-2xl); line-height: 1.1; letter-spacing: 0; text-transform: none; color: var(--ds-accent); font-variant-numeric: lining-nums tabular-nums; }
.founder-world .story-facts dd { margin: 0; color: var(--ds-text); line-height: var(--ds-leading-normal); }
@media (min-width: 48rem) { .founder-world .story-facts__row { grid-template-columns: 9rem minmax(0, 1fr); align-items: baseline; } }

/* ---------------------------------------------------------------- the work for others: plain rows divided by hairlines, then the initiatives as plain names */
.founder-rows, .founder-names { list-style: none; margin: 0; padding: 0; }
.founder-rows { display: grid; margin-block-start: var(--ds-space-2); border-block-start: 1px solid var(--ds-border); }
.founder-row { display: grid; gap: var(--ds-space-2) var(--ds-space-6); padding-block: var(--ds-space-5); border-block-end: 1px solid var(--ds-border); min-inline-size: 0; }
.founder-row__title { font-size: var(--ds-text-2xl); line-height: 1.15; }
.founder-row__text { margin: 0; font-size: var(--ds-text-md); line-height: 1.7; color: var(--ds-text-muted); text-wrap: pretty; }
@media (min-width: 48rem) { .founder-row { grid-template-columns: minmax(0, 14rem) minmax(0, 1fr); align-items: baseline; } }
.founder-names { display: flex; flex-wrap: wrap; gap: var(--ds-space-2) var(--ds-space-7); }
.founder-names__item { font-family: var(--ds-font-display); font-size: var(--ds-text-xl); line-height: 1.3; color: var(--ds-text); text-shadow: 0 0 .6rem color-mix(in srgb, var(--ds-surface-sunken) 90%, transparent); }

/* ---------------------------------------------------------------- the next step: two plain choices, each with its "nothing is asked of you" line */
.founder-next { display: grid; gap: var(--ds-space-7); margin-block-start: var(--ds-space-2); }
.founder-next__cell { display: flex; flex-direction: column; align-items: flex-start; gap: var(--ds-space-2); min-inline-size: 0; }
.founder-next__note { margin: 0; max-inline-size: 30ch; font-size: var(--ds-text-sm); color: var(--ds-text-muted); }
.founder-beat--last .ds-chakra-why { margin-block-start: var(--ds-space-6); }

@media (max-width: 47.99rem) {
  .founder-world .founder-open { align-items: flex-end; padding-block: calc(var(--ds-header-h) + var(--ds-space-8)) var(--ds-space-8); }
  .founder-names { gap: var(--ds-space-1) var(--ds-space-6); }
}