/* Homepage: five screens, one typeface, one accent, no stock footage. */
.hq { --hq-w: min(1180px, 90vw); }
.hq section { width: var(--hq-w); margin: 0 auto; }

.hq-hero { padding: clamp(96px, 16vh, 184px) 0 clamp(40px, 6vw, 72px); }
.hq-hero h1 { max-width: 14.5em; margin: 0; font-size: clamp(44px, 6.6vw, 96px); line-height: 1.0; color: var(--sy-white, #fcfcfe); text-wrap: balance; }
.hq-hero p { max-width: 30em; margin: clamp(22px, 3vw, 34px) 0 0; font-size: clamp(18px, 1.7vw, 22px); line-height: 1.5; color: var(--sy-gray, #a3a3ab); }
.hq-hero .sy-actions { margin-top: clamp(28px, 3.4vw, 40px); }


.hq-notice { display: flex; flex-wrap: wrap; gap: 6px 18px; align-items: baseline; padding: 18px 0; border-top: 1px solid var(--sy-line, #232327); border-bottom: 1px solid var(--sy-line, #232327); font-size: 15px; color: var(--sy-gray, #a3a3ab); }
.hq-notice strong { font-weight: 500; color: var(--sy-white, #fcfcfe); }
.hq-notice a { color: var(--sy-white, #fcfcfe); text-decoration: underline; text-underline-offset: 3px; text-decoration-color: rgba(252, 252, 254, .35); }

.hq-block { padding: clamp(80px, 12vw, 160px) 0; border-bottom: 1px solid var(--sy-line, #232327); display: grid; grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); gap: clamp(28px, 5vw, 80px); }
.hq-block h2 { margin: 0; font-size: clamp(32px, 3.6vw, 52px); line-height: 1.04; }
.hq-block > div > p { margin: 0; max-width: 34em; font-size: clamp(18px, 1.6vw, 21px); line-height: 1.55; color: var(--sy-gray, #a3a3ab); }
.hq-block > div > p + p { margin-top: 18px; }
.hq-block a.hq-more { display: inline-block; margin-top: 26px; font-size: 16px; color: var(--sy-white, #fcfcfe); text-decoration: underline; text-underline-offset: 4px; text-decoration-color: rgba(252, 252, 254, .35); }
.hq-block a.hq-more:hover { text-decoration-color: currentColor; }

.hq-services { list-style: none; margin: 0; padding: 0; border-top: 1px solid var(--sy-line, #232327); }
.hq-services li { border-bottom: 1px solid var(--sy-line, #232327); }
.hq-services a { display: grid; grid-template-columns: minmax(0, 2fr) minmax(0, 3fr); gap: 20px; align-items: baseline; padding: 22px 0; color: inherit; text-decoration: none; }
.hq-services b { font-family: var(--syn-display); font-weight: 500; font-size: clamp(20px, 1.9vw, 26px); color: var(--sy-white, #fcfcfe); transition: color .2s ease; }
.hq-services span { font-size: 16px; line-height: 1.5; color: var(--sy-gray, #a3a3ab); }
.hq-services a:hover b, .hq-services a:focus-visible b { color: #6b8aff; }

.hq-end { padding: clamp(96px, 14vw, 176px) 0 clamp(80px, 10vw, 128px); }
.hq-end h2 { margin: 0; max-width: 13em; font-size: clamp(36px, 4.6vw, 68px); line-height: 1.02; }
.hq-end p { margin: 20px 0 0; font-size: 18px; color: var(--sy-gray, #a3a3ab); }
.hq-end .sy-actions { margin-top: 32px; }

@media (max-width: 820px) {
  .hq-block { grid-template-columns: minmax(0, 1fr); }
  .hq-services a { grid-template-columns: minmax(0, 1fr); gap: 6px; }
}
.hq-scope { margin: 22px 0 0; max-width: 24em; font-size: 17px; line-height: 1.55; color: var(--sy-gray, #a3a3ab); }
.hq-scope a { color: var(--sy-white, #fcfcfe); text-decoration: underline; text-underline-offset: 3px; text-decoration-color: rgba(252, 252, 254, .35); }

/* Field: full-screen oscillators behind the page. Scenes: one statement per screen. */
.hq-field { position: fixed; inset: 0; width: 100vw; height: 100vh; z-index: 0; pointer-events: none; }
.hq > section { position: relative; z-index: 1; }
.hq-hero { min-height: calc(100svh - 72px); display: flex; flex-direction: column; justify-content: center; padding: 0; }
.hq-scenes { height: 600svh; width: 100% !important; }
.hq-scenes-stage { position: sticky; top: 0; height: 100svh; display: grid; place-items: center; }
.hq-scene { grid-area: 1 / 1; margin: 0; width: min(980px, 88vw); text-align: center; font-family: var(--syn-display); font-weight: 500; font-size: clamp(32px, 4.6vw, 68px); line-height: 1.08; letter-spacing: -.015em; color: var(--sy-white, #fcfcfe); text-wrap: balance; opacity: 0; will-change: opacity, transform; text-shadow: 0 0 40px rgba(10, 10, 10, .9); }
.hq-scene a { display: inline-block; margin-top: 26px; font-family: var(--syn-text, inherit); font-size: 17px; letter-spacing: 0; color: var(--sy-white, #fcfcfe); text-decoration: underline; text-underline-offset: 4px; text-decoration-color: rgba(252, 252, 254, .4); text-shadow: none; }
.hq-scene a { display: block; width: fit-content; margin: 28px auto 0; }
.hq-scenes-readout { position: absolute; left: 50%; bottom: 32px; transform: translateX(-50%); display: flex; gap: 28px; margin: 0; font-size: 12px; letter-spacing: .16em; text-transform: uppercase; color: var(--sy-gray-dim, #8a8a93); font-variant-numeric: tabular-nums; white-space: nowrap; }
.hq-scenes-readout [data-field-state] { color: #f2777a; transition: color .6s ease; }
.hq-scenes.is-tuned .hq-scenes-readout [data-field-state] { color: #6b8aff; }
.hq-notice, .hq-block, .hq-end { background: rgba(10, 10, 10, .72); }
.sy-visually-hidden { position: absolute !important; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
@media (prefers-reduced-motion: reduce) {
  .hq-scenes { height: auto; }
  .hq-scenes-stage { position: static; height: auto; display: block; padding: 80px 0; }
  .hq-scene { opacity: 1; text-align: left; margin: 0 auto 56px; font-size: clamp(28px, 3.4vw, 48px); }
  .hq-scenes-readout { display: none; }
}

.hq-block .rb-marks { display: grid; grid-template-columns: repeat(20, 10px); gap: 5px; margin-top: 30px; }
.hq-block .rb-marks i { width: 10px; height: 10px; background: #4d6bff; }
.hq-block > div > p.hq-source { margin-top: 18px; font-size: 13px; color: var(--sy-gray-dim, #8a8a93); }
.hq-source a { color: inherit; text-decoration: underline; text-underline-offset: 3px; text-decoration-color: rgba(252, 252, 254, .3); }
@media (prefers-reduced-motion: no-preference) {
  .rb-marks.is-armed i { background: #e5484d; transition: background .5s ease; transition-delay: calc(var(--d, 0) * 55ms); }
  .rb-marks.is-armed.is-blue i { background: #4d6bff; }
}

/* Built by a team from: a slow, quiet logo strip. */
.hq-from { padding: clamp(48px, 7vw, 88px) 0; border-bottom: 1px solid var(--sy-line, #232327); background: rgba(10, 10, 10, .72); }
.hq-from h2 { margin: 0 0 28px; font-size: 13px; font-weight: 400; letter-spacing: .16em; text-transform: uppercase; color: var(--sy-gray-dim, #8a8a93); text-align: center; }
.hq-from-track { overflow: hidden; -webkit-mask-image: linear-gradient(90deg, transparent, #000 12%, #000 88%, transparent); mask-image: linear-gradient(90deg, transparent, #000 12%, #000 88%, transparent); }
.hq-from-row { list-style: none; margin: 0; padding: 0; display: flex; align-items: center; gap: clamp(48px, 6vw, 88px); width: max-content; animation: hq-from-scroll 48s linear infinite; }
.hq-from-track:hover .hq-from-row { animation-play-state: paused; }
.hq-from-row li { display: flex; align-items: center; gap: 12px; flex: none; opacity: .62; transition: opacity .3s ease; }
.hq-from-row li:hover { opacity: .95; }
.hq-from-row img { display: block; width: auto; }
.hq-from-row span { font-size: 12px; letter-spacing: .14em; text-transform: uppercase; color: var(--sy-white, #fcfcfe); white-space: nowrap; }
@keyframes hq-from-scroll { to { transform: translateX(calc(-50% - clamp(24px, 3vw, 44px))); } }
@media (prefers-reduced-motion: reduce) {
  .hq-from-track { -webkit-mask-image: none; mask-image: none; }
  .hq-from-row { animation: none; width: auto; flex-wrap: wrap; justify-content: center; gap: 28px 48px; padding: 0 6vw; }
  .hq-from-row li[aria-hidden="true"] { display: none; }
}