.join-page{--sprout:#c1d97c;background:#050a16}
.join-atmosphere{position:fixed;inset:0;pointer-events:none;background:radial-gradient(ellipse at 77% 42%,#57714029,transparent 48%),radial-gradient(ellipse at 15% 82%,#3134641a,transparent 55%)}
.join-page .page{grid-template-rows:auto 1fr auto}
.join-page header{align-items:center}
.join-page main{width:100%;max-width:1400px;justify-self:center;align-self:start;padding:clamp(58px,7vw,112px) 0 72px}
.join-intro{display:grid;grid-template-columns:minmax(0,1.15fr) minmax(0,1fr);gap:clamp(26px,4vw,68px);align-items:center}
.join-copy{padding:0 0 36px;max-width:630px}
.join-kicker{font:500 .875rem/1.4 Consolas,monospace;text-transform:uppercase;letter-spacing:.18em;color:var(--sprout);margin:0 0 28px}
.join-page h1{font-family:"Iowan Old Style","Palatino Linotype",Palatino,Georgia,serif;font-size:clamp(62px,7.3vw,112px);line-height:.97;letter-spacing:-.06em}
.join-page h1 em{color:var(--sprout)}
.join-lead{font-size:clamp(18px,1.55vw,22px);line-height:1.55;color:#e0e3db;max-width:37ch;margin:32px 0 17px}
.join-research,.join-publications,.join-message{font-size:1rem;line-height:1.7;color:#b3bdcd;max-width:50ch;margin:0}
.join-publications,.join-message{margin-top:20px}
.join-publications a{color:#d7a6a1;text-decoration:underline;text-decoration-color:#d7a6a180;text-underline-offset:4px}
.join-publications a:hover,.join-publications a:focus-visible{color:#f1b8b0;text-decoration-color:currentColor}
.join-email{margin-top:30px}
.join-email a{display:inline-flex;align-items:center;gap:14px;min-height:44px;border-bottom:1px solid #c1d97c80;color:#e5edca;font-size:clamp(16px,1.45vw,21px);line-height:1.45;overflow-wrap:anywhere}
.join-email a:hover{border-color:var(--sprout);color:#f0ffd1}
.join-email a span{color:var(--sprout)}
.join-art{--art-height:690px;margin:0;min-width:0;align-self:center}
.sprout-stage{position:relative;width:min(100%,calc(var(--art-height)*.78));aspect-ratio:39/50;margin-inline:auto;isolation:isolate}
/* Register the generated wash to the existing cup, beneath the original root ink. */
.sprout-water{position:absolute;left:11.2%;top:25.8%;width:80.5%;height:69.6%;opacity:.42;pointer-events:none}
/* A brief glimmer in the existing wash; the drawing never repeats its growth. */
@keyframes water-shimmer{0%,78%,100%{opacity:.42}85%{opacity:.50}92%{opacity:.44}}
@media(prefers-reduced-motion:no-preference){
 .join-art[data-growth="complete"] .sprout-water{animation:water-shimmer 22s 6s ease-in-out infinite;animation-play-state:paused}
 .join-art[data-growth="complete"][data-water-motion="playing"] .sprout-water{animation-play-state:running}
}
.growth-definitions{position:absolute;overflow:hidden;pointer-events:none}
/* The static artwork is the fallback; the mask exists only during this one-shot reveal. */
.join-art:not([data-growth="complete"]) .sprout-ink{mask-image:url("#sprout-growth-mask");mask-mode:luminance}
@keyframes sprout-fail-open{to{mask-image:none}}
@media(prefers-reduced-motion:no-preference){.join-art[data-growth="waiting"] .sprout-ink{animation:sprout-fail-open 0s 6s forwards}}
@media(prefers-reduced-motion:reduce){.join-art .sprout-ink{mask-image:none!important;animation:none!important}}
/* Display-only notch removes the signature, not the drawing or original asset.
   Intrinsic aspect ratio keeps the notch registered at every viewport size. */
.join-art .sprout-ink{position:relative;display:block;width:100%;height:auto;clip-path:polygon(0 0,100% 0,100% 91.5%,68% 91.5%,68% 100%,0 100%);filter:invert(1) hue-rotate(180deg) url("../publications/original/ink-effects.svg#paperless-ink")}
@media(max-width:1000px){.join-intro{grid-template-columns:minmax(0,1.2fr) minmax(0,.85fr);gap:20px}.join-page h1{font-size:clamp(58px,8vw,80px)}.join-art{--art-height:580px}}
@media(max-width:700px){
 .join-page main{padding-top:42px;padding-bottom:46px}
 .join-intro{grid-template-columns:minmax(0,1fr) minmax(108px,.68fr);gap:0 18px;align-items:center}
 .join-copy{display:contents}
 .join-page h1{grid-column:1/-1;grid-row:2;font-size:clamp(58px,13vw,82px)}
 .join-kicker{grid-column:1/-1;grid-row:1;margin-bottom:22px}
 .join-lead{grid-column:1;grid-row:3;margin:26px 0;font-size:18px;line-height:1.55}
 .join-art{grid-column:2;grid-row:3;--art-height:340px;width:100%;justify-self:center;margin:16px 0}
 .join-research,.join-publications,.join-message,.join-email{grid-column:1/-1;max-width:none}
 .join-atmosphere{background:radial-gradient(ellipse at 86% 38%,#57714026,transparent 45%),radial-gradient(ellipse at 15% 82%,#3134641a,transparent 55%)}
}
@media(max-width:420px){.join-nav{gap:14px}.join-email a{font-size:1rem;gap:7px}}
@media(max-width:340px){.join-page header{flex-wrap:wrap;gap:10px}.join-nav{margin-left:9px}.join-email a{font-size:.9375rem}}