/* ==========================================================================
   Homepage — OnPurpose Futures
   ========================================================================== */

/* ---------- Hero ------------------------------------------------------- */
.home-hero {
  --hero-pad-top: clamp(3.5rem, 9vh, 7rem);
  position: relative; isolation: isolate; overflow: hidden;
  min-height: min(100svh, 1000px);
  display: flex; flex-direction: column; justify-content: flex-end;
  background: var(--navy-950);
}
.home-hero .gridlines { z-index: -2; opacity: .35; }
.home-hero__media {
  position: absolute; top: 0; right: 0; bottom: 0; width: min(64%, 1040px); z-index: -3;
  -webkit-mask-image: linear-gradient(90deg, transparent 0%, rgba(0,0,0,.28) 16%, rgba(0,0,0,.82) 38%, #000 56%), linear-gradient(0deg, transparent 0%, rgba(0,0,0,.6) 16%, #000 34%);
  -webkit-mask-composite: source-in;
  mask-image: linear-gradient(90deg, transparent 0%, rgba(0,0,0,.28) 16%, rgba(0,0,0,.82) 38%, #000 56%), linear-gradient(0deg, transparent 0%, rgba(0,0,0,.6) 16%, #000 34%);
  mask-composite: intersect;
}
.home-hero__media picture, .home-hero__img { width: 100%; height: 100%; }
.home-hero__img { object-fit: cover; object-position: 62% 26%; filter: saturate(.9) brightness(.86) contrast(1.06); }
.home-hero__media::after { /* a cool grade so the warm image belongs to the night */
  content: ""; position: absolute; inset: 0;
  background: linear-gradient(200deg, rgba(7,17,29,0) 30%, rgba(7,17,29,.45) 100%), linear-gradient(180deg, rgba(7,17,29,.82) 0, rgba(7,17,29,.6) 96px, rgba(7,17,29,0) 26%); /* QA: stronger top scrim — the transparent header sat on pale sky (≈2.5:1) */
}
.home-hero__rays { z-index: -1; }
.home-hero__inner { position: relative; padding-bottom: clamp(2.25rem, 5vh, 4rem); }
.home-hero__eyebrow { margin-bottom: clamp(1.25rem, 3vh, 2rem); }
.home-hero__title { max-width: 11.5ch; }
.home-hero__title em { color: var(--gold-soft); padding-right: .05em; }
.home-hero__foot { display: flex; flex-wrap: wrap; align-items: flex-end; justify-content: space-between; gap: 1.75rem 3rem; margin-top: clamp(1.75rem, 4vh, 3rem); }
.home-hero__lead { max-width: 44ch; color: var(--fog); }
.home-hero__band {
  position: relative; display: flex; align-items: center; gap: 2rem;
  padding-block: 1.15rem calc(1.15rem + env(safe-area-inset-bottom, 0px));
  border-top: 1px solid var(--line-on-dark);
}
.home-hero__motto { font-family: var(--font-serif); font-style: italic; font-size: 1.2rem; color: var(--ivory); white-space: nowrap; }
.home-hero__engines { display: flex; flex-wrap: wrap; gap: .4rem 1.4rem; list-style: none; margin: 0 auto; padding: 0; font-family: var(--font-mono); font-size: var(--fs-micro); letter-spacing: .08em; text-transform: uppercase; color: var(--mist); }
.home-hero__engines li { display: inline-flex; align-items: center; gap: .55rem; }
.home-hero__engines li::before { content: ""; width: 4px; height: 4px; border-radius: 50%; background: var(--gold); }
.home-hero__scroll { display: inline-flex; align-items: center; gap: .75rem; font-family: var(--font-mono); font-size: var(--fs-micro); letter-spacing: .14em; text-transform: uppercase; color: var(--mist); text-decoration: none; min-height: 44px; }
.home-hero__scroll-line { position: relative; width: 1px; height: 34px; background: var(--line-on-dark-strong); overflow: hidden; }
.home-hero__scroll-line::after { content: ""; position: absolute; left: 0; top: -40%; width: 1px; height: 40%; background: var(--gold); animation: hero-scroll 2.4s var(--ease-in-out) infinite; }
@keyframes hero-scroll { 0% { top: -40%; } 70%, 100% { top: 100%; } }
.home-hero__scroll:hover { color: var(--ivory); }

@media (max-width: 1100px) { .home-hero__engines { display: none; } .home-hero__band { justify-content: space-between; } }
@media (max-width: 760px) {
  .home-hero { --hero-pad-top: 46svh; }
  .home-hero__media { width: 100%; bottom: auto; height: 62%;
    -webkit-mask-image: linear-gradient(0deg, transparent 0%, rgba(0,0,0,.3) 24%, rgba(0,0,0,.85) 52%, #000 70%); mask-image: linear-gradient(0deg, transparent 0%, rgba(0,0,0,.3) 24%, rgba(0,0,0,.85) 52%, #000 70%); }
  .home-hero__inner::before { content: ""; position: absolute; inset: -3rem 0 0; z-index: -1; pointer-events: none; background: linear-gradient(180deg, rgba(7,17,29,0), rgba(7,17,29,.7) 4rem, rgba(7,17,29,.85)); }
  .home-hero__eyebrow { color: var(--gold-soft); }
  .home-hero__img { object-position: 74% 18%; }
  .home-hero__title { max-width: 9.5ch; }
  .home-hero__foot .btn-row { width: 100%; }
  .home-hero__foot .btn { flex: 1 1 100%; }
  .home-hero__motto { font-size: 1.05rem; white-space: normal; }
}

/* ---------- 01 Conviction --------------------------------------------- */
.home-conviction { overflow: hidden; }
.home-conviction::after { /* five levels of change */
  content: ""; position: absolute; right: -320px; bottom: -320px; width: 1100px; height: 1100px; z-index: -1; pointer-events: none; opacity: .55;
  background:
    radial-gradient(circle, transparent 0 109px, var(--stone) 110px 111px, transparent 112px),
    radial-gradient(circle, transparent 0 209px, var(--stone) 210px 211px, transparent 212px),
    radial-gradient(circle, transparent 0 309px, var(--stone) 310px 311px, transparent 312px),
    radial-gradient(circle, transparent 0 409px, var(--stone) 410px 411px, transparent 412px),
    radial-gradient(circle, transparent 0 509px, var(--stone) 510px 511px, transparent 512px),
    radial-gradient(circle, var(--gold-deep) 0 4px, transparent 5px);
}
.home-conviction__grid { display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); column-gap: var(--col-gap); row-gap: clamp(2rem, 4vw, 3.5rem); }
.home-conviction__grid > * { min-width: 0; }
.home-conviction__eyebrow { grid-column: 1 / -1; }
.home-conviction__title { grid-column: 1 / span 8; max-width: 19ch; }
.home-conviction__aside { grid-column: 9 / span 4; align-self: end; display: grid; gap: 1.1rem; padding-bottom: .6rem; }
.home-conviction__aside .lead { font-size: clamp(1.08rem, 1rem + .3vw, 1.25rem); }
.home-charter { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) minmax(0, 1.35fr); gap: var(--col-gap); margin-top: clamp(3.5rem, 7vw, 6.5rem); }
.home-charter__item { padding-top: 1.4rem; border-top: 1px solid var(--line-on-light-strong); display: flex; flex-direction: column; gap: .9rem; min-width: 0; }
.home-charter__label { color: var(--gold-ink); text-transform: uppercase; letter-spacing: .12em; }
.home-charter__text { font-size: 1.05rem; line-height: 1.6; color: var(--charcoal); max-width: 38ch; }
.home-charter__item--promise { border-top-color: var(--gold-deep); border-top-width: 2px; padding-top: calc(1.4rem - 1px); }
.home-charter__promise { font-family: var(--font-serif); font-size: clamp(1.55rem, 1.2rem + 1.1vw, 2.2rem); line-height: 1.2; }
.home-charter__promise em { color: var(--gold-ink); }
@media (max-width: 1100px) { .home-conviction__title { grid-column: 1 / span 7; } .home-conviction__aside { grid-column: 8 / span 5; } }
@media (max-width: 960px) {
  .home-conviction__title, .home-conviction__aside { grid-column: 1 / -1; }
  .home-charter { grid-template-columns: 1fr; }
}

/* ---------- 02 Culture Engineering ------------------------------------- */
.home-ce__grid { display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); column-gap: var(--col-gap); row-gap: 3rem; align-items: center; }
.home-ce__copy { grid-column: 1 / span 6; min-width: 0; }
.home-mlp { grid-column: 8 / span 5; min-width: 0; }
.home-ce__definition { margin: clamp(1.75rem, 3vw, 2.5rem) 0 0; padding-left: 1.4rem; border-left: 1px solid var(--gold); }
.home-ce__definition p { font-family: var(--font-serif); font-size: clamp(1.35rem, 1.1rem + .8vw, 1.85rem); line-height: 1.3; color: var(--ivory); }
.home-ce__disciplines { display: flex; flex-wrap: wrap; gap: .5rem; list-style: none; padding: 0; margin: 1.5rem 0 0; }
.home-ce__disciplines li { padding: .38rem .75rem; border: 1px solid var(--line-on-dark-strong); border-radius: 999px; font-size: .8125rem; color: var(--fog); }
.home-mlp__stage { position: relative; }
.home-mlp__svg { width: 58%; height: auto; overflow: visible; }
.mlp-layer path { fill: rgba(194, 162, 122, .06); stroke: var(--gold); stroke-width: 1; vector-effect: non-scaling-stroke; transition: fill var(--dur-2) var(--ease-out); }
.mlp-layer--regime path { fill: rgba(194, 162, 122, .12); }
.mlp-layer--niches path { fill: rgba(227, 207, 171, .08); stroke-dasharray: 4 4; }
.mlp-flow line, .mlp-flow path { stroke: var(--mist); stroke-width: 1; fill: none; vector-effect: non-scaling-stroke; }
.mlp-rise line { stroke: var(--gold-soft); stroke-width: 1; vector-effect: non-scaling-stroke; stroke-dasharray: 3 5; }
.mlp-rise circle { fill: var(--gold-soft); }
.mlp-origin { fill: var(--gold-soft); }
.mlp-origin-ring { fill: none; stroke: var(--gold); stroke-width: 1; vector-effect: non-scaling-stroke; opacity: .6; }
@media (prefers-reduced-motion: no-preference) {
  .mlp-rise line { animation: mlp-rise 3.2s linear infinite; }
  @keyframes mlp-rise { to { stroke-dashoffset: -32; } }
}
.home-mlp__labels { position: absolute; inset: 0 0 0 62%; list-style: none; margin: 0; padding: 0; }
.home-mlp__label { position: absolute; left: 0; right: 0; transform: translateY(-50%); display: grid; gap: .25rem; padding-left: 1rem; border-left: 1px solid var(--line-on-dark-strong); }
.home-mlp__label strong { font-family: var(--font-sans); font-size: var(--fs-label); font-weight: 700; letter-spacing: .16em; text-transform: uppercase; color: var(--gold); }
.home-mlp__label span { font-size: .875rem; line-height: 1.45; color: var(--fog); }
.home-mlp__label--landscape { top: 16.8%; }
.home-mlp__label--regime { top: 50%; }
.home-mlp__label--niches { top: 82%; }
.home-mlp .figcaption { margin-top: 1.5rem; max-width: 46ch; }
@media (max-width: 1100px) { .home-ce__copy { grid-column: 1 / span 7; } .home-mlp { grid-column: 8 / span 5; } }
@media (max-width: 960px) { .home-ce__copy, .home-mlp { grid-column: 1 / -1; } .home-mlp { max-width: 620px; } }
@media (max-width: 520px) {
  .home-mlp__svg { width: 66%; }
  .home-mlp__labels { inset: 0 0 0 66%; }
  .home-mlp__label { padding-left: .6rem; }
  .home-mlp__label span { font-size: .75rem; }
}

/* ---------- 03 Challenge (ledgers) ------------------------------------- */
.ledger { display: grid; grid-template-columns: minmax(0, 3fr) minmax(0, 9fr); column-gap: var(--col-gap); row-gap: 1.75rem; padding-block: clamp(2rem, 3.5vw, 3rem); border-top: 1px solid var(--line-on-light-strong); }
.ledger + .ledger { margin-top: 0; }
.ledger__head { display: flex; flex-direction: column; gap: .6rem; min-width: 0; padding-right: 1rem; }
.ledger__kicker { color: var(--gold-ink); text-transform: uppercase; letter-spacing: .12em; }
.ledger__cells { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); min-width: 0; }
.ledger__cells--four { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.ledger__cell { display: flex; flex-direction: column; gap: .7rem; min-width: 0; padding: 0 clamp(1rem, 2vw, 2rem) 0; border-left: 1px solid var(--line-on-light); }
.ledger__cells--four .ledger__cell:nth-child(n+3) { padding-top: 2rem; margin-top: 2rem; border-top: 1px solid var(--line-on-light); }
.ledger__geo { color: var(--slate); text-transform: uppercase; letter-spacing: .08em; font-size: var(--fs-micro); }
.ledger__value { font-family: var(--font-serif); font-size: clamp(3.2rem, 2rem + 3.8vw, 5.75rem); line-height: .92; letter-spacing: -.025em; color: var(--ink); font-variant-numeric: lining-nums; }
.ledger__value sup { font-size: .45em; vertical-align: .9em; color: var(--gold-ink); }
.ledger__value--sm { font-size: clamp(2.5rem, 1.8rem + 2.4vw, 4rem); }
.ledger__unit { font-size: .32em; letter-spacing: 0; margin-left: .35em; color: var(--slate); font-family: var(--font-sans); font-weight: 600; vertical-align: .25em; }
.ledger__label { font-size: .975rem; line-height: 1.55; color: var(--charcoal); max-width: 36ch; }
.ledger .source-line { margin-top: auto; padding-top: .25rem; }
.ledger .source-line a { text-decoration-color: var(--line-on-light-strong); }

.share-viz { display: grid; gap: .65rem; padding-block: .6rem .2rem; }
.share-viz__row { display: grid; grid-template-columns: 3.2rem minmax(0, 1fr) 3rem; align-items: center; gap: .75rem; }
.share-viz__year { color: var(--slate); }
.share-viz__track { position: relative; height: 12px; background: color-mix(in srgb, var(--stone) 55%, transparent); }
.share-viz__fill { position: absolute; inset: 0 auto 0 0; width: var(--v); background: var(--gold-deep); }
.share-viz__row--proj .share-viz__fill { background: repeating-linear-gradient(135deg, var(--gold-deep) 0 3px, transparent 3px 6px); outline: 1px solid var(--gold-deep); outline-offset: -1px; }
.share-viz__val { font-family: var(--font-serif); font-size: 1.6rem; line-height: 1; text-align: right; }

.dots-viz { display: flex; gap: 6px; padding-top: .3rem; }
.dots-viz span { width: 15px; height: 15px; border-radius: 50%; background: var(--gold-deep); }
.dots-viz span.is-off { background: transparent; box-shadow: inset 0 0 0 1.5px var(--gold-deep); }
.bars-viz { display: grid; gap: .55rem; padding-top: .3rem; }
.bars-viz__row { display: grid; gap: .25rem; }
.bars-viz__bar { display: block; height: 14px; width: var(--b); background: var(--navy-800); }
.bars-viz__bar--range { background: linear-gradient(90deg, var(--navy-800) 0 83.3%, color-mix(in srgb, var(--navy-800) 35%, transparent) 83.3% 100%); }
.bars-viz__val { font-family: var(--font-mono); font-size: var(--fs-micro); color: var(--slate); letter-spacing: .03em; }

.home-challenge__close { display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); column-gap: var(--col-gap); row-gap: 2.5rem; margin-top: clamp(2.5rem, 5vw, 4.5rem); padding-top: clamp(2.5rem, 5vw, 4rem); border-top: 1px solid var(--line-on-light-strong); }
.home-challenge__beneath { grid-column: 1 / span 5; min-width: 0; }
.home-challenge__risks { list-style: none; padding: 0; margin: 1.5rem 0 0; display: grid; gap: .1rem; }
.home-challenge__risks li { padding: .8rem 0; border-bottom: 1px solid var(--line-on-light); color: var(--slate); }
.home-challenge__risks li span { font-family: var(--font-serif); font-size: 1.45rem; color: var(--ink); margin-right: .35rem; }
.home-challenge__response { grid-column: 7 / span 6; min-width: 0; display: flex; flex-direction: column; gap: 1.25rem; align-items: flex-start; }
.home-challenge__response .statement { max-width: 24ch; }
.home-challenge__response .statement em { color: var(--gold-ink); }
@media (max-width: 1100px) {
  .ledger { grid-template-columns: 1fr; }
  .ledger__head { padding-right: 0; max-width: 60ch; }
}
@media (max-width: 860px) {
  .ledger__cells { grid-template-columns: 1fr; }
  .ledger__cells--four { grid-template-columns: 1fr; }
  .ledger__cell, .ledger__cells--four .ledger__cell:nth-child(n+3) { border-left: 0; padding: 1.75rem 0 0; margin-top: 1.75rem; border-top: 1px solid var(--line-on-light); }
  .ledger__cell:first-child { margin-top: 0; }
  .home-challenge__beneath, .home-challenge__response { grid-column: 1 / -1; }
}

/* ---------- 04 Method (systems diagram) --------------------------------- */
.method { display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); column-gap: var(--col-gap); row-gap: 2.5rem; align-items: center; }
.method__diagram { grid-column: 1 / span 6; position: relative; width: 100%; max-width: 640px; aspect-ratio: 1; justify-self: center; }
.method__svg { position: absolute; inset: 0; width: 100%; height: 100%; overflow: visible; }
.method__orbit { fill: none; stroke: var(--line-on-dark-strong); stroke-width: 1; vector-effect: non-scaling-stroke; }
.method__orbit-flow { fill: none; stroke: var(--gold); stroke-width: 1.4; vector-effect: non-scaling-stroke; stroke-dasharray: 2 26; opacity: .8; }
@media (prefers-reduced-motion: no-preference) { .method__orbit-flow { animation: orbit-flow 6s linear infinite; } @keyframes orbit-flow { to { stroke-dashoffset: -280; } } }
.method__core-ring { fill: rgba(194,162,122,.04); stroke: var(--line-on-dark-strong); stroke-width: 1; vector-effect: non-scaling-stroke; }
.method__core-ring--inner { fill: none; stroke-dasharray: 2 4; }
.method__spokes line { stroke: var(--line-on-dark); stroke-width: 1; vector-effect: non-scaling-stroke; transition: stroke var(--dur-2), stroke-width var(--dur-2); }
.method__spokes line.is-active { stroke: var(--gold); stroke-width: 1.6; }
.method__chevrons path { fill: none; stroke: var(--gold); stroke-width: 1.2; vector-effect: non-scaling-stroke; opacity: .75; }
.method__origin { fill: var(--gold-soft); }
.method__core { position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); display: grid; gap: .1rem; text-align: center; pointer-events: none; }
.method__core .mono { font-size: var(--fs-micro); letter-spacing: .18em; text-transform: uppercase; color: var(--gold-soft); }
.method__nodes { position: absolute; inset: 0; }
.method__node {
  position: absolute; transform: translate(-50%, -50%); width: clamp(48px, 10.5%, 66px); aspect-ratio: 1; border-radius: 50%;
  display: grid; place-items: center; padding: 0; border: 1px solid var(--line-on-dark-strong); background: var(--navy-950); color: var(--ivory);
  font-family: var(--font-mono); font-size: .8rem; letter-spacing: .04em;
  transition: background-color var(--dur-2) var(--ease-out), border-color var(--dur-2), color var(--dur-2), box-shadow var(--dur-2) var(--ease-out);
}
.method__node:hover { border-color: var(--gold); }
.method__node[aria-selected="true"] { background: var(--gold); border-color: var(--gold); color: var(--navy-950); box-shadow: 0 0 0 8px rgba(194,162,122,.14), 0 0 40px rgba(227,207,171,.25); }
.method__node-label { position: absolute; white-space: nowrap; font-family: var(--font-sans); font-size: .8125rem; font-weight: 700; letter-spacing: .14em; text-transform: uppercase; color: var(--fog); pointer-events: none; transition: color var(--dur-2); }
.method__node[aria-selected="true"] .method__node-label, .method__node:hover .method__node-label { color: var(--gold-soft); }
.method__node[data-side="top"] .method__node-label { bottom: calc(100% + 12px); left: 50%; transform: translateX(-50%); }
.method__node[data-side="bottom"] .method__node-label { top: calc(100% + 12px); left: 50%; transform: translateX(-50%); }
.method__node[data-side="right"] .method__node-label { left: calc(100% + 14px); top: 50%; transform: translateY(-50%); }
.method__node[data-side="left"] .method__node-label { right: calc(100% + 14px); top: 50%; transform: translateY(-50%); }

.method__stages { grid-column: 8 / span 5; list-style: none; padding: 0; margin: 0; min-width: 0; }
.method__stage { display: grid; gap: 1.1rem; }
.js .method__stage { min-height: 22rem; align-content: start; }
.method__stage + .method__stage { margin-top: 3rem; }
.js .method__stage + .method__stage { margin-top: 0; }
.method__count { color: var(--gold); letter-spacing: .1em; }
.method__lead { font-size: var(--fs-lead); line-height: 1.5; color: var(--fog); max-width: 40ch; }
.method__cols { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1.5rem; padding-top: 1.25rem; border-top: 1px solid var(--line-on-dark); }
.method__k { color: var(--mist); text-transform: uppercase; letter-spacing: .1em; margin-bottom: .6rem; font-size: var(--fs-micro); }
.method__cols ul { list-style: none; padding: 0; margin: 0; display: grid; gap: .45rem; font-size: .9375rem; }
.method__cols li { display: flex; gap: .6rem; }
.method__cols li::before { content: ""; flex: none; width: 5px; height: 5px; margin-top: .6em; border-radius: 50%; background: var(--gold); }
.method__controls { display: flex; gap: .5rem; align-items: center; margin-top: .5rem; }
.method__controls .icon-btn { border-color: var(--line-on-dark-strong); }
.method__controls .icon-btn:hover { border-color: var(--gold); }
.method__controls .mono { margin-left: .5rem; color: var(--mist); font-size: var(--fs-micro); }
.method__stage.is-entering { animation: stage-in var(--dur-3) var(--ease-out); }
@keyframes stage-in { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: none; } }
.method__foot { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: center; gap: 1rem 2rem; margin-top: clamp(2.5rem, 5vw, 4rem); padding-top: 1.5rem; border-top: 1px solid var(--line-on-dark); }
.method__loop { display: flex; align-items: center; gap: .7rem; color: var(--fog); font-size: .9375rem; }
.method__loop .icon { color: var(--gold); }
@media (max-width: 1100px) { .method__diagram { grid-column: 1 / span 7; } .method__stages { grid-column: 8 / span 5; } }
@media (max-width: 900px) {
  .method__diagram, .method__stages { grid-column: 1 / -1; }
  .method__diagram { max-width: 520px; width: calc(100% - 2.5rem); }
  .js .method__stage { min-height: 0; }
}
@media (max-width: 560px) {
  .method__node-label { font-size: .64rem; letter-spacing: .08em; }
  .method__node[data-side="right"] .method__node-label { left: 50%; top: calc(100% + 6px); transform: translateX(-50%); }
  .method__node[data-side="left"] .method__node-label { right: auto; left: 50%; top: calc(100% + 6px); transform: translateX(-50%); }
  .method__core { display: none; }
  .method__cols { grid-template-columns: 1fr; }
}

/* ---------- 05 Pillars -------------------------------------------------- */
.pillars { border-top: 1px solid var(--line-on-light-strong); }
.pillars__trigger {
  position: relative; display: grid; grid-template-columns: 3rem minmax(0, 1fr) auto; align-items: baseline; gap: 1rem; width: 100%;
  padding: 1.35rem 0; border: 0; border-bottom: 1px solid var(--line-on-light); background: none; text-align: left; color: var(--slate);
  transition: color var(--dur-2) var(--ease-out);
}
.pillars__trigger::before { content: ""; position: absolute; left: 0; top: -1px; height: 2px; width: 0; background: var(--gold-deep); transition: width var(--dur-3) var(--ease-out); }
.pillars__num { color: var(--gold-ink); }
.pillars__name { font-family: var(--font-serif); font-size: clamp(1.6rem, 1.2rem + 1.5vw, 2.6rem); line-height: 1.08; letter-spacing: -.01em; }
.pillars__chev { width: 22px; height: 22px; color: var(--gold-deep); opacity: 0; transform: translateX(-8px); transition: opacity var(--dur-2), transform var(--dur-2) var(--ease-out); align-self: center; }
.pillars__trigger:hover, .pillars__trigger[aria-expanded="true"] { color: var(--ink); }
.pillars__trigger[aria-expanded="true"]::before { width: 100%; }
.pillars__trigger[aria-expanded="true"] .pillars__chev, .pillars__trigger:hover .pillars__chev { opacity: 1; transform: none; }
.pillars__panel { display: grid; grid-template-columns: 120px minmax(0, 1fr); gap: 1.75rem; padding: 2rem 0 2.5rem; }
.pillars__body { display: flex; flex-direction: column; align-items: flex-start; gap: 1rem; min-width: 0; }
.pillars__body .h3 { max-width: 26ch; }
.pillars__body .muted { max-width: 52ch; }
.pillars__list { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: .5rem; }
.pillars__list li { padding: .35rem .75rem; border: 1px solid var(--line-on-light-strong); border-radius: 999px; font-size: .8125rem; color: var(--charcoal); background: var(--white); }
.pillars__body .link-arrow { color: var(--gold-ink); }
.pillars__art svg { width: 100%; height: auto; overflow: visible; }
.pillars__art line, .pillars__art polyline, .pillars__art circle:not(.art-dot) { fill: none; stroke: var(--gold-deep); stroke-width: 1; vector-effect: non-scaling-stroke; }
.pillars__art .art-nodes circle { fill: var(--paper); }
.pillars__art .art-dot { fill: var(--navy-900); }
.pillars__art .art-rings circle { opacity: .8; }

@media (min-width: 961px) {
  .pillars { display: grid; grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); grid-auto-rows: auto; column-gap: clamp(2.5rem, 5vw, 6rem); border-top: 0; }
  .pillars__item { display: contents; }
  .pillars__trigger { grid-column: 1; }
  .pillars__item:first-child .pillars__trigger { border-top: 1px solid var(--line-on-light-strong); }
  .pillars__panel { grid-column: 2; grid-row: 1 / span 5; align-self: start; position: sticky; top: calc(var(--header-h) + 2rem);
    grid-template-columns: 1fr; padding: clamp(2rem, 3vw, 3rem); background: var(--ivory); border: 1px solid var(--line-on-light); }
  .pillars__art { width: 140px; }
  .js .pillars__panel.is-entering { animation: stage-in var(--dur-3) var(--ease-out); }
}
@media (max-width: 960px) { .pillars__panel { grid-template-columns: 72px minmax(0, 1fr); gap: 1.1rem; padding-top: 1.25rem; } }
@media (max-width: 600px) { .pillars__panel { grid-template-columns: 1fr; } .pillars__art { width: 64px; } .pillars__trigger { grid-template-columns: 2.25rem minmax(0, 1fr) auto; } }

/* ---------- 06 Initiatives --------------------------------------------- */
.flagship { display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); column-gap: var(--col-gap); row-gap: 2.5rem; align-items: center; padding-bottom: clamp(3rem, 6vw, 5.5rem); }
.flagship__plate { grid-column: 1 / span 5; position: relative; overflow: hidden; background: var(--white); aspect-ratio: 720 / 724; }
.flagship__plate::after { content: ""; position: absolute; inset: 14px; border: 1px solid rgba(166,132,90,.45); pointer-events: none; }
.flagship__plate img { width: 100%; height: 100%; object-fit: cover; }
.flagship__copy { grid-column: 7 / span 6; min-width: 0; }
.flagship__title { margin-top: 1rem; max-width: 12ch; }
.flagship__title em { display: block; font-size: .5em; letter-spacing: -.005em; margin-top: .35em; }
.flagship__scale { display: grid; grid-template-columns: minmax(0, 1fr) 72px minmax(0, 1fr); align-items: start; gap: 1.25rem; margin-top: clamp(2rem, 4vw, 3rem); padding-top: 1.75rem; border-top: 1px solid var(--line-on-dark); }
.flagship__figure { display: flex; flex-direction: column; align-items: flex-start; gap: .7rem; min-width: 0; }
.flagship__num { font-family: var(--font-serif); font-size: clamp(2.6rem, 1.8rem + 2.6vw, 4.2rem); line-height: .95; letter-spacing: -.02em; color: var(--ivory); }
.flagship__figure:last-child .flagship__num { color: var(--gold-soft); }
.flagship__figure .small { color: var(--fog); max-width: 30ch; }
.flagship__ray { position: relative; height: 100%; min-height: 3rem; }
.flagship__ray span { position: absolute; left: 0; right: 0; top: 1.6rem; height: 1px; background: linear-gradient(90deg, var(--ivory), var(--gold)); }
.flagship__ray span::before { content: ""; position: absolute; left: -3px; top: -3px; width: 7px; height: 7px; border-radius: 50%; background: var(--ivory); }
.flagship__ray span::after { content: ""; position: absolute; right: 0; top: -4px; border: 4.5px solid transparent; border-left: 7px solid var(--gold); border-right: 0; }
.initiative-index { list-style: none; padding: 0; margin: 0; border-top: 1px solid var(--line-on-dark-strong); }
.initiative-index__row {
  display: grid; grid-template-columns: minmax(0, 4fr) minmax(0, 6fr) 15rem 28px; align-items: center; gap: 1.5rem 2rem;
  padding: 1.6rem .25rem; border-bottom: 1px solid var(--line-on-dark); text-decoration: none; position: relative;
  transition: background-color var(--dur-2) var(--ease-out), padding var(--dur-2) var(--ease-out);
}
.initiative-index__row::before { content: ""; position: absolute; left: 0; bottom: -1px; height: 1px; width: 0; background: var(--gold); transition: width var(--dur-3) var(--ease-out); }
.initiative-index__row:hover { background: rgba(246,241,231,.03); padding-left: 1rem; }
.initiative-index__row:hover::before { width: 100%; }
.initiative-index__name { font-family: var(--font-serif); font-size: clamp(1.5rem, 1.2rem + 1vw, 2.15rem); line-height: 1.1; color: var(--ivory); }
.initiative-index__sub { display: block; font-family: var(--font-sans); font-size: .8125rem; color: var(--mist); margin-top: .3rem; letter-spacing: .01em; }
.initiative-index__desc { color: var(--fog); font-size: .9375rem; line-height: 1.55; }
.initiative-index__row .tag { justify-self: end; }
.initiative-index__row .icon-arrow { width: 22px; height: 22px; color: var(--gold); transition: transform var(--dur-2) var(--ease-out); }
.initiative-index__row:hover .icon-arrow { transform: translateX(5px); }
@media (max-width: 960px) {
  .flagship__plate { grid-column: 1 / span 6; max-width: 520px; }
  .flagship__copy { grid-column: 1 / -1; }
  .initiative-index__row { grid-template-columns: minmax(0, 1fr) 28px; gap: .75rem 1rem; }
  .initiative-index__name { grid-column: 1; }
  .initiative-index__desc, .initiative-index__row .tag { grid-column: 1; justify-self: start; }
  .initiative-index__row .icon-arrow { grid-column: 2; grid-row: 1; }
}
@media (max-width: 600px) {
  .flagship__plate { grid-column: 1 / -1; }
  .flagship__scale { grid-template-columns: 1fr; }
  .flagship__ray { min-height: 44px; }
  .flagship__ray span { left: 1.5rem; right: auto; top: 0; bottom: 0; width: 1px; height: auto; background: linear-gradient(180deg, var(--ivory), var(--gold)); }
  .flagship__ray span::before { left: -3px; top: -3px; }
  .flagship__ray span::after { right: auto; left: -4px; top: auto; bottom: 0; border: 4.5px solid transparent; border-top: 7px solid var(--gold); border-bottom: 0; }
}

/* ---------- 07 Homo Completum teaser ----------------------------------- */
.home-hc__grid { display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); column-gap: var(--col-gap); row-gap: 3rem; align-items: center; }
.home-hc__copy { grid-column: 1 / span 5; min-width: 0; }
.hc-teaser__figure { grid-column: 7 / span 6; min-width: 0; margin: 0; }
.hc-teaser__controls { display: flex; flex-wrap: wrap; gap: .5rem; margin-top: 2rem; }
.hc-chip { min-height: 44px; padding: 0 1.1rem; border: 1px solid var(--line-on-light-strong); border-radius: 999px; background: transparent; font-size: .875rem; font-weight: 650; color: var(--charcoal); transition: background-color var(--dur-2), color var(--dur-2), border-color var(--dur-2); }
.hc-chip:hover { border-color: var(--navy-900); }
.hc-chip[aria-pressed="true"] { background: var(--navy-900); border-color: var(--navy-900); color: var(--ivory); }
.hc-teaser__readout { position: relative; margin-top: 1.25rem; min-height: 8.5rem; padding: 1.25rem 1.35rem; border-left: 2px solid var(--gold-deep); background: color-mix(in srgb, var(--paper) 70%, transparent); }
.hc-read { display: grid; gap: .45rem; }
.hc-read__k { color: var(--gold-ink); text-transform: uppercase; letter-spacing: .1em; font-size: var(--fs-micro); }
.hc-read__t { font-family: var(--font-serif); font-size: clamp(1.25rem, 1.1rem + .5vw, 1.55rem); line-height: 1.3; }
.hc-svg { width: 100%; height: auto; overflow: visible; }
.hc-rays line { stroke: var(--gold-deep); stroke-width: 1; vector-effect: non-scaling-stroke; opacity: .22; }
.hc-circle circle { fill: transparent; stroke: var(--gold-deep); stroke-width: 1.2; vector-effect: non-scaling-stroke; transition: fill var(--dur-3) var(--ease-out), stroke var(--dur-2), opacity var(--dur-3) var(--ease-out); }
.hc-circle .hc-inner { stroke-dasharray: 2 5; opacity: .6; }
.hc-circle text { font-family: var(--font-serif); font-size: 30px; fill: var(--ink); transition: fill var(--dur-2), opacity var(--dur-3); }
.hc-circle .hc-sub { font-family: var(--font-mono); font-size: 11px; letter-spacing: .12em; text-transform: uppercase; fill: var(--slate); }
.hc-origin { fill: var(--navy-900); }
.hc-origin-ring { fill: none; stroke: var(--navy-900); stroke-width: 1; vector-effect: non-scaling-stroke; opacity: .45; }
[data-hc-figure][data-active="all"] .hc-circle > circle:first-child { fill: rgba(194,162,122,.10); }
[data-hc-figure]:not([data-active="all"]) .hc-circle { opacity: .32; }
[data-hc-figure][data-active="spirit"] .hc-circle--spirit, [data-hc-figure][data-active="soul"] .hc-circle--soul, [data-hc-figure][data-active="body"] .hc-circle--body { opacity: 1; }
[data-hc-figure][data-active="spirit"] .hc-circle--spirit > circle:first-child, [data-hc-figure][data-active="soul"] .hc-circle--soul > circle:first-child, [data-hc-figure][data-active="body"] .hc-circle--body > circle:first-child { fill: rgba(194,162,122,.2); stroke: var(--navy-900); }
.hc-circle { transition: opacity var(--dur-3) var(--ease-out); cursor: pointer; }
.hc-teaser__cap { display: flex; flex-wrap: wrap; justify-content: center; gap: .35rem .6rem; margin-top: 1.25rem; font-size: .875rem; color: var(--slate); text-align: center; }
.hc-teaser__cap .mono { color: var(--gold-ink); text-transform: uppercase; letter-spacing: .08em; }
@media (max-width: 960px) { .home-hc__copy, .hc-teaser__figure { grid-column: 1 / -1; } .hc-teaser__figure { max-width: 560px; justify-self: center; width: 100%; } }

/* ---------- 08 Social value -------------------------------------------- */
.home-sv__top { display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); column-gap: var(--col-gap); row-gap: 2rem; align-items: end; }
.home-sv__copy { grid-column: 1 / span 7; min-width: 0; }
.home-sv__image { grid-column: 9 / span 4; margin: 0; overflow: hidden; aspect-ratio: 620 / 300;
  -webkit-mask-image: linear-gradient(90deg, transparent, #000 30%); mask-image: linear-gradient(90deg, transparent, #000 30%); }
.home-sv__image img { width: 100%; height: 100%; object-fit: cover; }
.sv-line { list-style: none; padding: 0; margin: clamp(3rem, 6vw, 5rem) 0 0; display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); border-top: 1px solid var(--navy-900); counter-reset: sv; }
.sv-line li { position: relative; display: flex; flex-direction: column; gap: .5rem; padding: 1.4rem 1.25rem 1.6rem 0; min-width: 0; transition: background-color var(--dur-2); }
.sv-line li::before { content: ""; position: absolute; left: 0; top: -4px; width: 7px; height: 7px; border-radius: 50%; background: var(--navy-900); transition: background-color var(--dur-2), transform var(--dur-2) var(--ease-out); }
.sv-line li:hover::before { background: var(--gold-deep); transform: scale(1.5); }
.sv-line__n { color: var(--gold-ink); }
.sv-line__t { font-family: var(--font-serif); font-size: clamp(1.4rem, 1.15rem + .8vw, 1.9rem); line-height: 1.1; }
.sv-line__d { font-size: .875rem; color: var(--slate); line-height: 1.45; }
.home-sv__bottom { display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); column-gap: var(--col-gap); row-gap: 2.5rem; margin-top: clamp(2.5rem, 5vw, 4rem); }
.home-sv__receive { grid-column: 1 / span 5; min-width: 0; }
.home-sv__receive .hairline-list { margin-top: 1rem; }
.home-sv__promise { grid-column: 7 / span 6; min-width: 0; display: flex; flex-direction: column; align-items: flex-start; }
.home-sv__promise .quote { max-width: 26ch; }
@media (max-width: 960px) {
  .home-sv__copy, .home-sv__image, .home-sv__receive, .home-sv__promise { grid-column: 1 / -1; }
  .home-sv__image { max-width: 560px; }
  .sv-line { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .sv-line li:nth-child(n+4) { border-top: 1px solid var(--line-on-light); }
}
@media (max-width: 560px) {
  .sv-line { grid-template-columns: 1fr; border-top: 0; border-left: 1px solid var(--navy-900); }
  .sv-line li { padding: 0 0 1.4rem 1.4rem; display: grid; grid-template-columns: 2.25rem minmax(0, 1fr); column-gap: .5rem; row-gap: .2rem; }
  .sv-line li:nth-child(n+4) { border-top: 0; }
  .sv-line li::before { left: -4px; top: .45rem; }
  .sv-line__n { grid-row: 1 / span 2; padding-top: .35rem; }
}

/* ---------- 09 Agents of transformation -------------------------------- */
.home-agents { overflow: hidden; }
.home-agents__net { z-index: -1; opacity: .75; }
.home-agents::before { content: ""; position: absolute; inset: 0; z-index: -1; pointer-events: none; background: radial-gradient(ellipse 70% 80% at 18% 50%, rgba(7,17,29,.92), rgba(7,17,29,.2) 70%); }
.home-agents__grid { display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); column-gap: var(--col-gap); row-gap: 3rem; align-items: center; }
.home-agents__copy { grid-column: 1 / span 6; min-width: 0; }
.home-agents__copy .display { max-width: 16ch; }
.home-agents__line { margin-top: 1.5rem; font-family: var(--font-serif); font-style: italic; font-size: clamp(1.4rem, 1.1rem + 1vw, 2rem); color: var(--gold-soft); }
.home-agents__path { grid-column: 8 / span 5; list-style: none; margin: 0; padding: 0; border-top: 1px solid var(--line-on-dark-strong); background: rgba(7,17,29,.55); -webkit-backdrop-filter: blur(6px); backdrop-filter: blur(6px); }
.home-agents__path li { display: grid; grid-template-columns: 7.5rem minmax(0, 1fr); gap: 1rem; padding: 1.15rem 1rem 1.15rem 0; border-bottom: 1px solid var(--line-on-dark); }
.home-agents__path li .mono { color: var(--gold); text-transform: uppercase; letter-spacing: .08em; padding-top: .2rem; font-size: var(--fs-micro); }
.home-agents__path li p { color: var(--fog); font-size: .9375rem; }
.home-agents__path .home-agents__quote { display: block; padding: 1.6rem 0 0; border-bottom: 0; }
.home-agents__path li p.h3 { font-size: var(--fs-h3); color: var(--ivory); }
@media (max-width: 960px) { .home-agents__copy, .home-agents__path { grid-column: 1 / -1; } }
@media (max-width: 520px) { .home-agents__path li { grid-template-columns: 1fr; gap: .25rem; } }

/* ---------- 10 Impact ambition ----------------------------------------- */
.impact-split { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); border-top: 1px solid var(--line-on-light-strong); border-bottom: 1px solid var(--line-on-light-strong); }
.impact-split__col { display: flex; flex-direction: column; gap: 1.5rem; padding: clamp(2rem, 3.5vw, 3rem) clamp(1.25rem, 3.5vw, 3.5rem) clamp(2rem, 3.5vw, 3rem) 0; min-width: 0; }
.impact-split__col--targets { padding-left: clamp(1.25rem, 3.5vw, 3.5rem); padding-right: 0; border-left: 1px solid var(--line-on-light-strong); }
.impact-split__head { display: flex; flex-direction: column; align-items: flex-start; gap: .8rem; }
.impact-empty { padding: 1.5rem; border: 1px dashed var(--line-on-light-strong); background: repeating-linear-gradient(135deg, transparent 0 9px, rgba(20,24,29,.025) 9px 10px); display: grid; gap: .6rem; }
.impact-empty__big { font-family: var(--font-serif); font-size: clamp(1.6rem, 1.3rem + 1vw, 2.2rem); line-height: 1.15; }
.impact-split__list li { display: grid; grid-template-columns: 22px minmax(0, 1fr); gap: .75rem; align-items: start; font-size: .9375rem; }
.impact-split__list .icon { color: var(--st-verified); width: 18px; height: 18px; margin-top: .2rem; }
.impact-split__col .link-arrow { color: var(--gold-ink); align-self: flex-start; }
.impact-target { display: grid; grid-template-columns: minmax(0, auto) minmax(0, 1fr); gap: 1.25rem; align-items: center; padding-bottom: 1.25rem; border-bottom: 1px solid var(--line-on-light); }
.impact-target__num { font-family: var(--font-serif); font-size: clamp(2.8rem, 2rem + 2.6vw, 4.4rem); line-height: .95; letter-spacing: -.02em; min-width: 4.3ch; }
.impact-target > div { display: flex; flex-direction: column; align-items: flex-start; gap: .5rem; }
.horizons { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 1px; background: var(--line-on-light); border: 1px solid var(--line-on-light); }
.horizons__item { display: flex; flex-direction: column; gap: .3rem; padding: 1rem; background: var(--ivory); min-width: 0; }
.horizons__item .mono { color: var(--gold-ink); font-size: var(--fs-micro); }
.horizons__item strong { font-family: var(--font-serif); font-weight: 400; font-size: 1.4rem; }
.ladder-mini { list-style: none; padding: 0; margin: clamp(2.5rem, 5vw, 4rem) 0 0; display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); align-items: end; gap: 6px; }
.ladder-mini li { display: flex; flex-direction: column; justify-content: flex-end; gap: .2rem; padding: 1rem; background: var(--paper); border: 1px solid var(--line-on-light); font-family: var(--font-serif); font-size: 1.35rem; line-height: 1.1; min-width: 0; }
.ladder-mini li .mono { font-family: var(--font-mono); font-size: var(--fs-micro); color: var(--gold-ink); margin-bottom: auto; }
.ladder-mini li em { font-family: var(--font-sans); font-style: normal; font-size: .8125rem; color: var(--slate); line-height: 1.4; }
.ladder-mini li:nth-child(1) { min-height: 7.5rem; }
.ladder-mini li:nth-child(2) { min-height: 9rem; }
.ladder-mini li:nth-child(3) { min-height: 10.5rem; }
.ladder-mini li:nth-child(4) { min-height: 12rem; }
.ladder-mini li:nth-child(5) { min-height: 13.5rem; background: var(--navy-900); border-color: var(--navy-900); color: var(--ivory); }
.ladder-mini li:nth-child(5) .mono { color: var(--gold); }
.ladder-mini li:nth-child(5) em { color: var(--mist); }
@media (max-width: 900px) {
  .impact-split { grid-template-columns: 1fr; }
  .impact-split__col { padding-right: 0; }
  .impact-split__col--targets { padding-left: 0; border-left: 0; border-top: 1px solid var(--line-on-light-strong); }
}
@media (max-width: 640px) {
  .horizons { grid-template-columns: 1fr; }
  .ladder-mini { grid-template-columns: 1fr; gap: 4px; }
  .ladder-mini li, .ladder-mini li:nth-child(n) { min-height: 0; display: grid; grid-template-columns: 2.25rem 7.5rem minmax(0, 1fr); align-items: baseline; gap: .5rem; }
  .ladder-mini li:nth-child(1) { margin-right: 20%; } .ladder-mini li:nth-child(2) { margin-right: 15%; } .ladder-mini li:nth-child(3) { margin-right: 10%; } .ladder-mini li:nth-child(4) { margin-right: 5%; }
  .ladder-mini li .mono { margin: 0; }
}

/* ---------- 11 Build the future with us -------------------------------- */
.home-join__head { max-width: 900px; }
.join { display: grid; grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); gap: clamp(2rem, 5vw, 5rem); margin-top: clamp(2.5rem, 5vw, 4rem); align-items: start; }
.join__list { display: flex; flex-direction: column; border-top: 1px solid var(--line-on-light-strong); }
.join__tab {
  position: relative; display: flex; flex-direction: column; align-items: flex-start; gap: .1rem; width: 100%; min-height: 56px;
  padding: .85rem 2.5rem .85rem 1.1rem; border: 0; border-bottom: 1px solid var(--line-on-light); background: transparent; text-align: left;
  font-size: 1rem; font-weight: 600; color: var(--charcoal); transition: background-color var(--dur-2), color var(--dur-2), padding var(--dur-2) var(--ease-out);
}
.join__tab .mono { font-weight: 400; font-size: var(--fs-micro); text-transform: uppercase; letter-spacing: .1em; color: var(--gold-ink); }
.join__tab::before { content: ""; position: absolute; left: 0; top: 0; bottom: 0; width: 2px; background: var(--gold-deep); transform: scaleY(0); transition: transform var(--dur-2) var(--ease-out); }
.join__tab::after { content: "→"; position: absolute; right: 1rem; top: 50%; transform: translate(-6px, -50%); opacity: 0; color: var(--gold); transition: opacity var(--dur-2), transform var(--dur-2) var(--ease-out); }
.join__tab:hover { background: var(--ivory); }
.join__tab[aria-selected="true"] { background: var(--navy-900); color: var(--ivory); padding-left: 1.4rem; }
.join__tab[aria-selected="true"] .mono { color: var(--gold); }
.join__tab[aria-selected="true"]::before { transform: scaleY(1); }
.join__tab[aria-selected="true"]::after { opacity: 1; transform: translate(0, -50%); }
.join__panel { display: flex; flex-direction: column; gap: 1.1rem; padding-top: .5rem; }
.join__panel:not([hidden]) { animation: stage-in var(--dur-3) var(--ease-out); }
.join__panel .h2 { max-width: 18ch; }
.join__panel .muted { max-width: 54ch; }
.join__k { color: var(--gold-ink); text-transform: uppercase; letter-spacing: .12em; font-size: var(--fs-micro); }
.join__links { display: grid; margin-top: .75rem; border-top: 1px solid var(--line-on-light-strong); }
.join__link { display: flex; align-items: center; justify-content: space-between; gap: 1rem; min-height: 64px; padding: 1rem 0; border-bottom: 1px solid var(--line-on-light); text-decoration: none; font-family: var(--font-serif); font-size: clamp(1.3rem, 1.1rem + .6vw, 1.65rem); line-height: 1.2; transition: color var(--dur-2), padding var(--dur-2) var(--ease-out); }
.join__link .icon-arrow { width: 22px; height: 22px; color: var(--gold-deep); transition: transform var(--dur-2) var(--ease-out); }
.join__link:hover { color: var(--gold-ink); padding-left: .5rem; }
.join__link:hover .icon-arrow { transform: translateX(4px); }
.home-join__guide { display: flex; flex-wrap: wrap; align-items: center; gap: 1rem 1.5rem; margin-top: clamp(3rem, 6vw, 5rem); padding: 1.5rem 0; border-top: 1px solid var(--line-on-light-strong); border-bottom: 1px solid var(--line-on-light-strong); }
.home-join__guide p { flex: 1 1 320px; font-size: 1.05rem; color: var(--charcoal); }
.home-join__guide .link-arrow { color: var(--gold-ink); }
@media (max-width: 960px) { .join { grid-template-columns: 1fr; } }