/* Strength Signal visual language, adapted for the public brand website.
   Original logo files, copy, themes and responsive behavior are preserved. */
:root {
  --radius-card: 12px;
  --radius-inner: 8px;
  --signal-line: rgb(101 186 250 / 7%);
  --signal-edge: rgb(101 186 250 / 26%);
  --signal-mono: "SFMono-Regular", Consolas, "Liberation Mono", monospace;
}
[data-theme="light"] {
  --radius-card: 12px;
  --radius-inner: 8px;
  --signal-line: rgb(3 118 198 / 5%);
  --signal-edge: rgb(3 118 198 / 25%);
}
body {
  background-image: linear-gradient(var(--signal-line) 1px, transparent 1px),
    linear-gradient(90deg, var(--signal-line) 1px, transparent 1px);
  background-size: 36px 36px;
}
.site-header {
  background: color-mix(in srgb, var(--color-bg) 88%, transparent);
  border-bottom-color: var(--signal-edge);
}
.hero {
  min-height: 0;
  padding-top: calc(var(--header-height) + 1.75rem);
  padding-bottom: 2rem;
}
.hero-inner {
  isolation: isolate;
  overflow: hidden;
  min-height: clamp(38rem, 75vh, 52rem);
  padding: clamp(2rem, 4vw, 4.5rem);
  gap: 1.5rem;
  border: 1px solid var(--signal-edge);
  border-radius: 12px;
  background: var(--color-bg);
  box-shadow: 0 30px 90px -40px rgb(0 0 0 / 60%), 0 0 55px rgb(3 118 198 / 6%);
  animation: none;
}
.cinema-field {
  position: absolute;
  z-index: -1;
  inset: 0;
  overflow: hidden;
  pointer-events: none;
  background: radial-gradient(ellipse at 85% 25%, rgb(3 118 198 / 22%), transparent 65%);
}
.cinema-texture {
  position: absolute;
  inset: -3%;
  background: linear-gradient(90deg, #060622 8%, rgb(6 6 34 / 95%) 30%, rgb(6 6 34 / 68%) 58%, rgb(6 6 34 / 52%)),
    url("./assets/science-field-blue.webp") right 45% / 76% auto no-repeat;
  opacity: .85;
  animation: cinema-camera 24s ease-in-out infinite alternate;
}
.cinema-field::after {
  position: absolute;
  inset: 0;
  content: "";
  background: repeating-linear-gradient(0deg, rgb(101 186 250 / 2%) 0 1px, transparent 1px 5px),
    linear-gradient(0deg, rgb(6 6 34 / 82%), transparent 26%, transparent 80%, rgb(6 6 34 / 35%));
}
.cinema-beam {
  position: absolute;
  width: 60%;
  height: 180%;
  top: -50%;
  right: -5%;
  background: linear-gradient(100deg, transparent 35%, rgb(101 186 250 / 9%) 48%, rgb(220 242 255 / 12%) 50%, transparent 65%);
  filter: blur(20px);
  animation: cinema-beam 18s ease-in-out infinite alternate;
}
.cinema-horizon {
  position: absolute;
  top: 55%;
  left: 42%;
  width: 68%;
  height: 1px;
  background: linear-gradient(90deg, transparent, #65bafa, transparent);
  box-shadow: 0 0 16px #0376c6, 0 0 42px rgb(3 118 198 / 50%);
  transform: rotate(-12deg);
  opacity: .5;
  animation: cinema-horizon 8s ease-in-out infinite alternate;
}
.cinema-scan {
  position: absolute;
  inset: -25% auto -25% 45%;
  width: 13%;
  background: linear-gradient(90deg, transparent, rgb(101 186 250 / 12%), transparent);
  filter: blur(10px);
  opacity: 0;
  animation: cinema-scan 13s ease-in-out 2s infinite;
}
.scene-heading, .scene-footer {
  position: absolute;
  left: clamp(2rem, 4vw, 4.5rem);
  right: clamp(2rem, 4vw, 4.5rem);
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
  font-family: var(--signal-mono);
  font-size: .65rem;
  letter-spacing: .15em;
  text-transform: uppercase;
  color: var(--color-muted);
}
.scene-heading { top: 1.7rem; }
.scene-heading span:first-child { color: var(--color-primary); }
.scene-footer { bottom: 1.35rem; padding-top: 1rem; border-top: 1px solid var(--signal-edge); }
.hero-copy { padding-block: 3rem; }
.hero-copy h1 { font-size: clamp(3rem, 4.5vw, 5.4rem); line-height: 1.03; }
.hero-copy .eyebrow { font-size: .66rem; letter-spacing: .18em; display: flex; align-items: center; gap: .65rem; }
.hero-copy .eyebrow::before {
  content: ""; flex: 0 0 5px; width: 5px; height: 5px; border-radius: 50%;
  background: var(--color-primary); box-shadow: 0 0 0 4px var(--color-primary-wash), 0 0 14px var(--color-primary);
}
.hero-intro { font-size: clamp(1rem, 1.2vw, 1.18rem); max-width: 38ch; line-height: 1.65; }
.hero-stage { min-height: 24rem; }
.hero-emblem { width: min(94%, 27rem); }
.orbit-canvas { opacity: .48; }
.ambience-toggle {
  display: inline-flex; gap: .5rem; align-items: center; min-height: 36px;
  border: 0; padding: .3rem 0 .3rem .5rem; color: var(--color-muted); background: transparent;
  font: inherit; letter-spacing: .04em; text-transform: none; cursor: pointer;
}
.ambience-toggle:hover { color: var(--color-primary); }
.ambience-toggle:focus-visible { outline: 2px solid var(--color-primary); outline-offset: 4px; }
.ambience-toggle:disabled { cursor: default; }
.ambience-icon { width: 7px; height: 9px; border-inline: 2px solid currentColor; }
[aria-pressed="true"] .ambience-icon { border: 0; width: 0; height: 0; border-block: 5px solid transparent; border-left: 7px solid currentColor; }
.exploration-path {
  position: relative; display: grid; grid-template-columns: repeat(3, 1fr);
  max-width: var(--content-wide); margin: 1rem auto 0; gap: 1rem;
}
.exploration-path a {
  display: flex; align-items: center; gap: 1rem; padding: 1.1rem 1.2rem;
  font-size: .75rem; color: var(--color-muted); text-decoration: none;
  border: 1px solid var(--color-border); border-radius: 6px;
  background: color-mix(in srgb, var(--color-surface) 85%, transparent);
  transition: border-color .25s, background .25s, color .25s;
}
.exploration-path a:hover, .exploration-path a:focus-visible { border-color: var(--color-primary); background: var(--color-surface-2); color: var(--color-text); }
.exploration-path span { color: var(--color-primary); font: .7rem var(--signal-mono); }
.exploration-path b { margin-left: auto; color: var(--color-primary); font-size: 1.1rem; font-weight: 500; }
.ticker { padding-block: 1rem; background: color-mix(in srgb, var(--color-bg) 70%, transparent); }
.ticker-set span { font: 500 .72rem var(--font-body); letter-spacing: .2em; text-transform: uppercase; color: var(--color-muted); }
.ticker-set i { font-size: .8rem; }
.quote { position: relative; background: radial-gradient(ellipse at 50% 50%, var(--color-primary-wash), transparent 65%); }
.quote::after { content: ""; position: absolute; left: 30%; right: 30%; bottom: 0; height: 1px; background: linear-gradient(90deg, transparent, var(--signal-edge), transparent); }
.trajectory {
  background: linear-gradient(var(--signal-line) 1px, transparent 1px),
    linear-gradient(90deg, var(--signal-line) 1px, transparent 1px), var(--color-surface);
  background-size: 36px 36px;
  border-color: var(--signal-edge);
}
.trajectory-progress, .trajectory-dot { filter: drop-shadow(0 0 6px rgb(3 118 198 / 35%)); }
.stack-card, .field-card {
  background: linear-gradient(145deg, rgb(3 118 198 / 9%), transparent 48%), var(--color-surface);
  border-top-width: 1px;
  border-color: var(--signal-edge);
  box-shadow: inset 0 1px rgb(101 186 250 / 15%), 0 24px 65px -40px rgb(0 0 0 / 35%);
}
.stack-card:hover, .field-card:hover { box-shadow: inset 0 1px rgb(101 186 250 / 40%), 0 0 36px rgb(3 118 198 / 9%); }
.stack-index, .field-label { font-family: var(--signal-mono); }
.research-frame { border: 1px solid var(--signal-edge); border-radius: 12px; box-shadow: 0 25px 75px -40px rgb(3 118 198 / 40%); }
.join-section { position: relative; isolation: isolate; overflow: hidden; }
.join-section::after {
  content: ""; position: absolute; z-index: -1; inset: 0; pointer-events: none;
  background: linear-gradient(90deg, rgb(0 0 98 / 85%), rgb(0 0 98 / 65%)), url("./assets/science-field-blue.webp") right center / cover;
  opacity: .55;
}
[data-theme="light"] .cinema-texture {
  background: linear-gradient(90deg, #f4f8fb 8%, rgb(244 248 251 / 96%) 30%, rgb(244 248 251 / 70%) 58%, rgb(244 248 251 / 35%)),
    url("./assets/science-field-blue.webp") right 45% / 76% auto no-repeat;
}
[data-theme="light"] .cinema-field::after { background: linear-gradient(0deg, rgb(244 248 251 / 85%), transparent 35%); }
[data-theme="light"] .hero-inner { background: #f4f8fb; box-shadow: 0 24px 65px -40px rgb(0 0 98 / 25%); }
[data-theme="light"] .cinema-beam { opacity: .45; }
@keyframes cinema-camera { from { transform: scale(1); } to { transform: scale(1.055) translate(-.7%, .4%); } }
@keyframes cinema-beam { from { transform: translateX(-9%) rotate(-8deg); opacity: .45; } to { transform: translateX(14%) rotate(-3deg); opacity: .9; } }
@keyframes cinema-horizon { from { opacity: .2; transform: rotate(-12deg) scaleX(.8); } to { opacity: .55; transform: rotate(-12deg) scaleX(1); } }
@keyframes cinema-scan { 0%, 55% { transform: translateX(-100%) skew(-18deg); opacity: 0; } 67% { opacity: .8; } 90%, 100% { transform: translateX(450%) skew(-18deg); opacity: 0; } }
[data-ambience-paused="true"] .cinema-field *,
[data-ambience-paused="true"] .ticker-track,
[data-ambience-paused="true"] .field-signature .ring { animation-play-state: paused !important; }
@media (max-width: 1100px) and (min-width: 901px) {
  .hero-copy h1 { font-size: 3.2rem; }
  .exploration-path a { gap: .65rem; padding-inline: .8rem; }
}
@media (max-width: 900px) {
  .hero { padding-top: calc(var(--header-height) + 1rem); padding-bottom: 1.25rem; }
  .hero-inner { min-height: 0; padding: 3rem 1.5rem 4.5rem; gap: .75rem; }
  .hero-stage { min-height: 0; padding-block: 1.25rem .5rem; }
  .hero-emblem { width: clamp(12rem, 55vw, 17.5rem); }
  .hero-copy { padding-block: .75rem 0; gap: 1rem; }
  .hero-copy h1 { font-size: clamp(2.35rem, 6vw, 4rem); }
  .hero-intro { max-width: 48ch; font-size: 1rem; }
  .scene-heading, .scene-footer { left: 1.5rem; right: 1.5rem; font-size: .56rem; }
  .scene-heading { top: 1.25rem; }
  .scene-footer { bottom: .65rem; padding-top: .35rem; }
  .cinema-texture { background-size: auto, 120% auto; opacity: .6; }
  .exploration-path { gap: .6rem; }
  .exploration-path a { gap: .55rem; padding: .85rem; font-size: .68rem; }
}
@media (max-width: 600px) {
  .hero { padding-inline: .75rem; }
  .hero-inner { padding-inline: 1.25rem; }
  .scene-heading, .scene-footer { left: 1.25rem; right: 1.25rem; }
  .scene-caption { max-width: 16ch; line-height: 1.5; letter-spacing: .08em; }
  .hero-copy .eyebrow { font-size: .58rem; letter-spacing: .1em; }
  .hero-copy h1 { font-size: clamp(2rem, 8.6vw, 3.5rem); }
  .hero-intro { font-size: .9rem; }
  .exploration-path { grid-template-columns: 1fr; gap: 0; margin-top: .65rem; }
  .exploration-path a { border: 0; border-bottom: 1px solid var(--color-border); border-radius: 0; padding: .8rem 1rem; background: transparent; font-size: .75rem; }
  .cinema-horizon { top: 24%; left: 5%; width: 100%; }
  .cinema-beam { width: 100%; right: -25%; }
}
@media (prefers-reduced-motion: reduce) {
  .cinema-field * { animation: none !important; }
  .cinema-scan { display: none; }
  .cinema-beam { opacity: .5; }
}

/* Immersive edition: full-width moving film, camera depth, staged logo reveal. */
.hero { padding: var(--header-height) 0 0; }
.hero-inner {
  max-width: none;
  min-height: max(43rem, calc(100svh - var(--header-height)));
  padding: 5rem var(--gutter) 7rem;
  border: 0; border-radius: 0; box-shadow: none;
  grid-template-columns: minmax(0, 1.05fr) minmax(0, .95fr);
  gap: clamp(2rem, 5vw, 5rem);
}
.cinema-film {
  position: absolute; inset: -3%;
  width: 106%; height: 106%; object-fit: cover; object-position: 65% center;
  opacity: .64; transform: translate3d(var(--camera-x, 0px), var(--camera-y, 0px), 0) scale(1.03);
  filter: saturate(.7);
}
.cinema-texture {
  inset: 0; opacity: 1; animation: none;
  background: linear-gradient(90deg, #060622 0%, rgb(6 6 34 / 96%) 22%, rgb(6 6 34 / 70%) 43%, rgb(6 6 34 / 24%) 72%, rgb(6 6 34 / 38%));
}
.cinema-field::after {
  background: linear-gradient(0deg, #060622, transparent 25%, transparent 75%, rgb(6 6 34 / 60%)),
    repeating-linear-gradient(0deg, rgb(101 186 250 / 1.2%) 0 1px, transparent 1px 4px);
}
.depth-canvas { position: absolute; inset: 0; width: 100%; height: 100%; }
.cinema-beam { right: -2%; width: 90%; animation-duration: 10s; filter: blur(12px); }
.cinema-horizon { height: 2px; top: 54%; left: 38%; animation-duration: 4.5s; }
.cinema-scan { animation-duration: 8s; width: 24%; }
.scene-heading, .scene-footer { left: var(--gutter); right: var(--gutter); }
.scene-heading { top: 2.2rem; }
.scene-footer { bottom: 1.5rem; }
.hero-copy { position: relative; z-index: 2; padding-block: 1.5rem; }
.hero-copy h1 { font-size: clamp(3.2rem, 5.4vw, 6.1rem); line-height: .99; letter-spacing: -.06em; }
.hero-copy h1 em { white-space: normal; }
.hero-intro { max-width: 37ch; color: #b2c3d4; }
.hero-stage { min-height: 27rem; animation: emblem-arrival 1.8s cubic-bezier(.16,1,.3,1) both; }
.hero-emblem { width: min(100%, 30rem); }
.hero-emblem-image { animation: emblem-focus 2.4s cubic-bezier(.16,1,.3,1) both; }
.hero-stage::after {
  position: absolute; content: ""; width: 115%; height: 1px; left: -7.5%; top: 47%;
  background: linear-gradient(90deg, transparent, rgb(160 216 255 / 70%), transparent);
  box-shadow: 0 0 24px rgb(101 186 250 / 65%);
  opacity: 0; pointer-events: none;
  animation: emblem-sweep 8s ease-in-out 1.5s infinite;
}
.orbit-canvas { opacity: .7; }
.scroll-cue { display: flex; align-items: center; gap: 1rem; color: var(--color-muted); text-decoration: none; min-height: 44px; }
.scroll-cue:hover { color: var(--color-primary); }
.scroll-cue i { display: block; width: 1px; height: 26px; background: var(--signal-edge); position: relative; overflow: hidden; }
.scroll-cue i::after { content: ""; position: absolute; inset: 0; background: var(--color-primary); animation: scroll-signal 2s ease-in-out infinite; }
.ambience-toggle { min-height: 44px; }
.exploration-path { margin: 0 auto; padding: 1rem var(--gutter) 1.5rem; max-width: none; background: var(--color-bg); }
.exploration-path a { border: 0; border-top: 1px solid var(--signal-edge); border-radius: 0; background: none; padding-block: 1.5rem; }
.quote { overflow: hidden; min-height: 70vh; }
.quote::before {
  content: ""; position: absolute; left: -15%; top: 50%; width: 130%; height: 1px;
  background: linear-gradient(90deg, transparent, var(--color-primary), transparent);
  box-shadow: 0 0 35px rgb(3 118 198 / 40%); opacity: .3;
  transform: rotate(-9deg);
}
.quote blockquote { position: relative; z-index: 1; }
.quote-line { text-shadow: 0 4px 40px var(--color-bg); }
.stack-card::after {
  content: ""; position: absolute; top: -1px; left: 15%; width: 40%; height: 1px;
  background: linear-gradient(90deg, transparent, var(--color-primary), transparent);
  animation: panel-edge 6s ease-in-out infinite alternate;
}
.research-image { position: relative; }
.research-frame img { transition: filter 1s; }
.research-frame:hover img { filter: contrast(1.08) saturate(1.15); }
[data-theme="light"] .hero-inner { background: #f4f8fb; box-shadow: none; }
[data-theme="light"] .cinema-film { opacity: .38; }
[data-theme="light"] .cinema-texture {
  background: linear-gradient(90deg, #f4f8fb 0%, rgb(244 248 251 / 96%) 22%, rgb(244 248 251 / 82%) 43%, rgb(244 248 251 / 35%) 72%, rgb(244 248 251 / 50%));
}
[data-theme="light"] .cinema-field::after { background: linear-gradient(0deg, #f4f8fb, transparent 25%, transparent 80%, rgb(244 248 251 / 65%)); }
[data-theme="light"] .hero-intro { color: var(--color-muted); }
@keyframes emblem-arrival { from { opacity: 0; transform: scale(.84); } to { opacity: 1; transform: scale(1); } }
@keyframes emblem-focus { from { filter: blur(14px); clip-path: inset(0 100% 0 0); } 50% { filter: blur(0); } to { filter: blur(0); clip-path: inset(0); } }
@keyframes emblem-sweep { 0%, 60%, 100% { opacity: 0; transform: translateY(-100px); } 68% { opacity: .6; } 82% { opacity: 0; transform: translateY(110px); } }
@keyframes scroll-signal { from { transform: translateY(-100%); } to { transform: translateY(100%); } }
@keyframes panel-edge { from { left: 8%; opacity: .3; } to { left: 52%; opacity: .9; } }
@supports (animation-timeline: view()) {
  @media (prefers-reduced-motion: no-preference) {
    .hero-copy { animation: cinema-depart linear both; animation-timeline: view(); animation-range: exit 0% exit 85%; }
    .research-frame { animation: research-unveil linear both; animation-timeline: view(); animation-range: entry 10% entry 90%; }
  }
}
@keyframes cinema-depart { to { opacity: 0; filter: blur(8px); } }
@keyframes research-unveil { from { clip-path: inset(10% 8%); filter: brightness(.65); } to { clip-path: inset(0); filter: brightness(1); } }
[data-ambience-paused="true"] .hero-stage::after,
[data-ambience-paused="true"] .scroll-cue i::after,
[data-ambience-paused="true"] .stack-card::after { animation-play-state: paused; }
@media (max-width: 1100px) and (min-width: 901px) {
  .hero-copy h1 { font-size: 3.75rem; }
  .hero-stage { min-height: 22rem; }
}
@media (max-width: 900px) {
  .hero-inner { grid-template-columns: 1fr; min-height: 0; padding: 4rem var(--gutter) 5.5rem; gap: 1rem; }
  .hero-stage { min-height: 0; padding-block: 1.75rem .75rem; }
  .hero-emblem { width: clamp(14rem, 56vw, 21rem); }
  .hero-copy { padding-block: 0; }
  .hero-copy h1 { font-size: clamp(2.5rem, 7vw, 4rem); }
  .hero-copy h1 em { white-space: normal; }
  .cinema-film { object-position: 65% center; opacity: .5; }
  .cinema-texture { background: linear-gradient(0deg, #060622 0%, rgb(6 6 34 / 87%) 40%, rgb(6 6 34 / 30%) 80%); }
  [data-theme="light"] .cinema-texture { background: linear-gradient(0deg, #f4f8fb 0%, rgb(244 248 251 / 88%) 40%, rgb(244 248 251 / 35%) 80%); }
  .scene-heading { top: 1.3rem; }
  .scene-footer { bottom: .75rem; }
  .scene-caption { display: none; }
  .scroll-cue { font-size: .55rem; letter-spacing: .08em; }
  .exploration-path { padding-top: 0; }
}
@media (max-width: 600px) {
  .hero-inner { padding: 3rem 1.5rem 5.5rem; gap: 1.25rem; }
  .hero-stage { padding-block: 1.5rem .5rem; }
  .hero-copy h1 { font-size: clamp(2.35rem, 10vw, 3.7rem); }
  .hero-intro { font-size: .95rem; }
  .hero-copy .eyebrow { font-size: .59rem; }
  .scene-heading, .scene-footer { left: 1.5rem; right: 1.5rem; }
  .exploration-path { padding-inline: 1.5rem; }
  .exploration-path a { padding-block: .8rem; }
}
@media (prefers-reduced-motion: reduce) {
  .hero-stage, .hero-emblem-image, .hero-stage::after, .scroll-cue i::after, .stack-card::after { animation: none; }
  .hero-copy { animation: none; opacity: 1; filter: none; }
  .hero-emblem-image { clip-path: none; filter: none; }
}