/* About Medusa / Founder: the philosophy on the left, the founder's cut-out silhouette on the
   right, set against a violet glow and two fine orbits, dissolving into the sky at her feet. */
.medusa-founder { --mono: "JetBrains Mono", ui-monospace, SFMono-Regular, Consolas, monospace; position: relative; display: grid; grid-template-columns: minmax(0, 1.15fr) minmax(0, .85fr); gap: clamp(28px, 4vw, 80px); align-items: center; max-width: 1760px; margin: 0 auto; padding: clamp(80px, 9vw, 140px) 3.2rem clamp(60px, 6vw, 100px); color: #e0e5ef; }
.medusa-founder__label { display: flex; align-items: center; gap: 16px; margin: 0 0 22px; font: 300 10px/1.4 var(--_font-default); letter-spacing: .14em; color: #aab6c8; }
.medusa-founder__label span { width: 70px; height: 1px; background: #aab6c82b; }
.medusa-founder__eyebrow { margin: 0 0 16px; font: 400 10px/1.3 var(--mono); letter-spacing: .18em; text-transform: uppercase; color: #a79ac8; }
.medusa-founder h2 { margin: 0 0 26px; font: 400 clamp(34px, 3.8vw, 66px)/1.02 var(--_font-default); letter-spacing: -.045em; color: #f1f3f9; }
.medusa-founder__lead { max-width: 60ch; margin: 0 0 30px; font: 300 clamp(14px, 1.1vw, 18px)/1.6 var(--_font-default); color: #afb9cc; }
.medusa-founder__quote { position: relative; max-width: 60ch; margin: 0 0 28px; padding: 4px 0 4px 24px; border-left: 1px solid #a58cff66; }
.medusa-founder__quote p { margin: 0; font: 300 clamp(15px, 1.2vw, 19px)/1.6 var(--_font-default); font-style: italic; color: #d6dcea; }
/* Name and call to action share one row. */
.medusa-founder__signature { display: flex; flex-wrap: wrap; align-items: center; gap: 24px clamp(24px, 3vw, 56px); }
.medusa-founder__sign { display: flex; flex-direction: column; gap: 6px; }
/* Glass call to action: frosted pill, light rim, violet orb with the arrow. */
.medusa-founder__cta { position: relative; display: inline-flex; align-items: center; gap: 16px; padding: 8px 8px 8px 26px; border: 1px solid #e0e5ef38; border-radius: 999px; overflow: hidden; color: #f1f3f9; text-decoration: none; font: 400 12px/1 "JetBrains Mono", ui-monospace, SFMono-Regular, Consolas, monospace; letter-spacing: .16em; text-transform: uppercase; background: linear-gradient(145deg, #2a3459a6, #0c122280); box-shadow: inset 1px 1px 0 #ffffff26, inset -1px -1px 0 #00000040, 0 14px 40px #03060e80, 0 0 30px #7657f026; -webkit-backdrop-filter: blur(16px) saturate(130%); backdrop-filter: blur(16px) saturate(130%); transition: border-color .35s, box-shadow .35s; }
.medusa-founder__cta::before { content: ''; position: absolute; inset: 0; border-radius: inherit; background: linear-gradient(105deg, transparent 30%, #ffffff1f 45%, transparent 60%); transform: translateX(-120%); transition: transform .9s ease; pointer-events: none; }
.medusa-founder__cta i { display: grid; place-items: center; width: 42px; height: 42px; border-radius: 50%; background: radial-gradient(circle at 35% 30%, #c9b9ff, #7657f0 60%, #4b35b0); box-shadow: 0 0 18px #7657f080, inset 0 1px 0 #ffffff59; transition: transform .35s; }
.medusa-founder__cta svg { width: 16px; height: 16px; color: #fff; }
.medusa-founder__cta:hover { border-color: #c9b9ff80; box-shadow: inset 1px 1px 0 #ffffff33, 0 18px 50px #03060e99, 0 0 40px #7657f04d; }
.medusa-founder__cta:hover::before { transform: translateX(120%); }
.medusa-founder__cta:hover i { transform: rotate(45deg); }
.medusa-founder__cta:focus-visible { outline: 2px solid #a3b8d2; outline-offset: 4px; }
.medusa-founder__sign strong { font: 400 clamp(26px, 2.2vw, 38px)/1.05 var(--_font-default); letter-spacing: -.02em; color: #f1f3f9; }
.medusa-founder__sign em { font: 300 clamp(16px, 1.3vw, 20px)/1.2 var(--_font-default); font-style: normal; color: #c9d2e2; }
.medusa-founder__sign a { align-self: flex-start; font: 400 11px/1.4 var(--mono); letter-spacing: .12em; color: #b9a8ff; text-decoration: none; border-bottom: 1px solid #b9a8ff4d; transition: border-color .3s, color .3s; }
.medusa-founder__sign a:hover { color: #e0d8ff; border-color: #e0d8ff; }
.medusa-founder__sign a:focus-visible { outline: 2px solid #a3b8d2; outline-offset: 3px; }
.medusa-founder__sr { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }

/* The orbits and glow are sized to the portrait itself, so everything stays in proportion. */
.medusa-founder__portrait { position: relative; align-self: center; justify-self: center; width: min(100%, 500px); margin: 0; }
.medusa-founder__portrait::before { content: ''; position: absolute; left: 50%; top: 10%; width: 100%; aspect-ratio: 1; transform: translateX(-50%); border-radius: 50%; background: radial-gradient(circle, #7657f059, #3d345826 45%, transparent 70%); filter: blur(20px); }
.medusa-founder__orbit { position: absolute; left: 50%; top: 2%; width: 104%; aspect-ratio: 1; transform: translateX(-50%); border-radius: 50%; border: 1px solid #c9bdf238; }
.medusa-founder__orbit--outer { top: -9%; width: 126%; border-color: #c9bdf21f; }
.medusa-founder__portrait img { position: relative; display: block; width: 100%; height: auto; -webkit-mask-image: linear-gradient(180deg, #000 72%, transparent 100%); mask-image: linear-gradient(180deg, #000 72%, transparent 100%); filter: drop-shadow(0 0 40px #7657f033); }
@media (prefers-reduced-motion: no-preference) {
  .medusa-founder__orbit { animation: medusa-founder-orbit 60s linear infinite; border-top-color: #c9bdf28c; }
  .medusa-founder__orbit--outer { animation-duration: 90s; animation-direction: reverse; }
  @keyframes medusa-founder-orbit { to { transform: translateX(-50%) rotate(1turn); } }
}
@media (max-width: 991px) {
  .medusa-founder { grid-template-columns: minmax(0, 1fr); }
  .medusa-founder__portrait { order: -1; max-width: 420px; margin: 0 auto; }
}
@media (max-width: 767px) {
  .medusa-founder { padding-inline: 2.2rem; }
}

/* Home page variant (.medusa-founder--stage): the philosophy on the left, the founder's silhouette in
   the centre inside an orbit of crystal satellites (js/founder-orbit.js), the title and signature on
   the right. The DOM keeps the title first for reading order; the grid places it on the right.
   The-gaze.html keeps the base two-column layout above. */
.medusa-founder--stage {
  --stage-h: clamp(560px, 86vh, 860px);
  grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr); grid-template-areas: "philosophy stage intro";
  gap: clamp(20px, 2.4vw, 48px); padding-top: clamp(70px, 7vw, 120px);
}
.medusa-founder__intro { grid-area: intro; }
.medusa-founder__philosophy { grid-area: philosophy; }
.medusa-founder--stage h2 { margin-bottom: 18px; font-size: clamp(40px, 4.2vw, 76px); line-height: .98; }
.medusa-founder__subtitle { margin: 0 0 18px; font: 400 clamp(18px, 1.5vw, 26px)/1.15 var(--_font-default); letter-spacing: -.02em; color: #d6dcea; }
.medusa-founder--stage .medusa-founder__lead { max-width: 44ch; margin-bottom: 34px; font-size: clamp(14px, 1vw, 17px); }
.medusa-founder__philosophy-title { margin: 0 0 22px; font: 400 clamp(24px, 2vw, 34px)/1.05 var(--_font-default); letter-spacing: -.03em; color: #f1f3f9; }
.medusa-founder--stage .medusa-founder__quote { max-width: 46ch; margin: 0; }
.medusa-founder--stage .medusa-founder__quote p { font-size: clamp(15px, 1.15vw, 19px); }
.medusa-founder--stage .medusa-founder__signature { gap: 22px clamp(20px, 2vw, 40px); }

/* Centre stage: the silhouette, a violet glow, and the orbit drawn by founder-orbit.js.
   Stones on the far side of the orbit pass behind her (z 1), the near side in front (z 3). */
.medusa-founder__stage { grid-area: stage; position: relative; isolation: isolate; height: var(--stage-h); aspect-ratio: .88; margin: 0; }
.medusa-founder__stage::before { content: ''; position: absolute; z-index: 0; left: 50%; top: 18%; width: 90%; aspect-ratio: 1; transform: translateX(-50%); border-radius: 50%; background: radial-gradient(circle, #7657f04d, #3d345822 45%, transparent 70%); filter: blur(24px); }
.medusa-founder__figure { position: absolute; z-index: 2; left: 50%; top: 0; height: 100%; width: auto; transform: translateX(-50%); -webkit-mask-image: linear-gradient(180deg, #000 86%, transparent 100%); mask-image: linear-gradient(180deg, #000 86%, transparent 100%); }
.medusa-founder__orbits { position: absolute; inset: 0; width: 100%; height: 100%; overflow: visible; pointer-events: none; }
.medusa-founder__orbits--back { z-index: 1; }
.medusa-founder__orbits--front { z-index: 3; }
.medusa-founder__orbits ellipse { fill: none; stroke: #d8d0ff; stroke-width: 1; vector-effect: non-scaling-stroke; }
.medusa-founder__orbits--back ellipse { stroke-opacity: .28; }
.medusa-founder__orbits--front ellipse { stroke-opacity: .55; }
.medusa-founder__orbits circle { fill: #fff; }
.medusa-founder__satellite { position: absolute; left: 0; top: 0; width: 40px; height: auto; pointer-events: none; will-change: transform; filter: drop-shadow(0 0 8px #8d7cf066); }

@media (max-width: 1199px) {
  /* One column: title, then the silhouette with room for its orbit, then the philosophy. */
  .medusa-founder--stage { --stage-h: clamp(520px, 74vh, 720px); grid-template-columns: minmax(0, 1fr); grid-template-areas: "intro" "stage" "philosophy"; row-gap: 56px; }
  .medusa-founder__stage { justify-self: center; }
  .medusa-founder--stage .medusa-founder__quote { max-width: 70ch; }
}
@media (max-width: 767px) {
  .medusa-founder--stage { row-gap: 40px; }
  .medusa-founder__stage { width: min(100%, 520px); height: auto; }
}