/* Contact foreground; the sky uses the shared services scene unchanged. */
.contact-station-test { --contact-yellow: #ff635b; padding-top: 0; }
.contact-station-world { position: absolute; inset: 0; z-index: 5; }
.contact-station-center {
  position: absolute; left: 50%; top: 58%; width: 360px;
  transform: translate(-50%, -50%); text-align: center; color: white;
}
.station-channel-number {
  display: block; font: 11.5px/1.5 "Visio Science Gothic", sans-serif;
  letter-spacing: .18em; color: #bcbdc8;
}
.station-instrument { position: relative; width: 200px; height: 172px; margin: 0 auto; }
.station-dish-canvas { display: none; position: absolute; inset: 0; width: 100%; height: 100%; opacity: .88; }
.station-instrument.has-3d-dish .station-dish-canvas { display: block; }
.station-instrument.has-3d-dish > svg { visibility: hidden; }
.station-instrument svg { width: 100%; height: 100%; overflow: visible; opacity: .72; }
.station-dish-rotor [fill="url(#dish-face)"] { fill-opacity: .48; stroke-opacity: .75; }
.station-dish-rotor [fill="url(#dish-metal)"] { fill-opacity: .42; stroke-opacity: .65; }
.station-transmitter { filter: drop-shadow(0 0 7px #ff382d); }
.station-waves path { animation: station-broadcast 7s ease-out infinite; opacity: 0; }
.station-waves path:nth-child(2) { animation-delay: .7s; }
.station-waves path:nth-child(3) { animation-delay: 1.4s; }
@keyframes station-broadcast { 0%, 65%, 100% { opacity: 0; } 22% { opacity: .85; } }
.contact-station-connections { position: absolute; inset: 0; width: 100%; height: 100%; overflow: visible; pointer-events: none; }
.contact-station-connections path { fill: none; vector-effect: non-scaling-stroke; }
.station-wire { stroke: #ff544b; stroke-opacity: .33; stroke-width: 1; }
.station-pulse {
  stroke: #ffaea1; stroke-width: 2; stroke-linecap: round;
  stroke-dasharray: 1.8 98.2; stroke-dashoffset: 0; opacity: 0;
  filter: drop-shadow(0 0 4px #ff3229);
  animation: station-signal 7.5s linear infinite;
}
.contact-station-connections g:nth-child(2) .station-pulse { animation-delay: 2.5s; }
.contact-station-connections g:nth-child(3) .station-pulse { animation-delay: 5s; }
@keyframes station-signal { 0% { stroke-dashoffset: 0; opacity: 0; } 6%, 35% { opacity: .95; } 43%,100% { stroke-dashoffset: -100; opacity: 0; } }
.contact-station-connections g.is-active .station-wire { stroke-opacity: .9; stroke-width: 1.5; }
.station-channel {
  position: absolute; display: flex; flex-direction: column; gap: 13px;
  color: #fff; text-decoration: none; text-align: left;
  transform: translate(-50%, -50%); width: max-content; max-width: 31%;
  padding: 22px 12px; border-radius: 4px;
}
.station-email { left: 21%; top: 34%; }
.station-whatsapp { left: 80%; top: 34%; }
.station-project { left: 50%; top: 22%; text-align: center; max-width: 80%; }
.station-channel-title {
  display: block; font: 600 clamp(23px, 2.8175vw, 41.4px)/1.18 "Visio Science Gothic", sans-serif;
  letter-spacing: -.045em; white-space: nowrap;
  text-shadow: 1px 1px #e53830, 2px 2px #aa1617, 3px 3px #801013;
  transition: transform 650ms cubic-bezier(.2,.65,.25,1), text-shadow 650ms ease;
}
.station-project .station-channel-title { font-size: clamp(23px, 2.76vw, 39.1px); }
.station-link-arrow { display: inline-block; font-size: .6em; vertical-align: middle; color: #ff7a70; text-shadow: none; }
.station-channel-detail { color: #c5c5ce; font: 16.1px/1.5 "Visio Roc Grotesk", sans-serif; }
.station-channel:hover, .station-channel:focus-visible { color: #fff; text-decoration: none; }
.contact-station-test .station-project,
.contact-station-test .station-project:is(:visited, :hover, :focus, :active),
.contact-station-test .station-project .station-channel-title { color: #fff; }
.station-channel:is(:hover,:focus-visible) .station-channel-title { transform: scale(1.055); text-shadow: 1px 1px #ff6054, 2px 2px #d72423, 3px 3px #a7191a, 0 0 28px #ff342b55; }
.contact-station-test .station-channel:focus-visible { outline-color: #ff6b60; }
.station-enhanced .station-channel { animation: station-channel-in 1.25s ease both; }
.station-enhanced .station-project { animation-delay: .8s; }
.station-enhanced .station-email { animation-delay: 1.15s; }
.station-enhanced .station-whatsapp { animation-delay: 1.5s; }
@keyframes station-channel-in { from { opacity: 0; filter: blur(5px); } to { opacity: 1; filter: blur(0); } }
.contact-station-test .visio-contact-final { scroll-margin-top: 80px; }
.station-final-invite { position: relative; z-index: 1; display: grid; grid-template-columns: minmax(0, 360px) max-content; align-items: center; gap: clamp(24px, 6vw, 100px); margin-top: clamp(40px, 5vw, 72px); width: 100%; }
.contact-station-test .visio-contact-final .station-final-copy {
  max-width: none; margin: 0 0 24px !important; color: #efff13;
  font: 400 clamp(14px, 1.15vw, 17px)/1.65 "Visio Roc Grotesk", sans-serif;
  letter-spacing: 0; text-transform: none;
}
.station-final-copy span { opacity: 1; }
.station-final-cue { width: fit-content; max-width: 100%; color: #fff; font: 500 12px/1.5 "Visio Roc Grotesk", sans-serif; }
.station-final-signal { position: absolute; inset: 0; width: 100%; height: 100%; overflow: visible; pointer-events: none; }
.station-final-signal path { fill: none; stroke-linecap: round; }
.station-final-wire { stroke: #541911; stroke-width: 1; opacity: .38; }
.station-final-pulse { stroke: #ffd1bb; stroke-width: 2.6; stroke-dasharray: .12 99.88; filter: drop-shadow(0 0 3px #ffbaa3); animation: station-final-flow 4s linear infinite; }
.contact-station-test .visio-contact-final .station-open-form { position: relative; z-index: 1; margin: 0; white-space: nowrap; }
@media (max-width: 650px) {
  .station-final-invite { gap: 24px; }
  .contact-station-test .visio-contact-final .station-open-form { padding: 16px 12px; font-size: 14px; }
  .station-final-invite .station-open-form span { margin-left: 8px; }
}
@keyframes station-final-flow { 0% { stroke-dashoffset: 0; opacity: 0; } 8%,85% { opacity: .95; } 100% { stroke-dashoffset: -100; opacity: 0; } }
.contact-station-test .station-test-note { margin-top: 20px; font-size: 13px; color: #665955; }
@media (max-width: 850px) {
  .station-instrument { width: 160px; height: 137px; }
  .station-email { left: 22%; top: 34%; }
  .station-whatsapp { left: 78%; top: 34%; }
  .station-channel-title { font-size: clamp(20.7px, 3.45vw, 28.75px); }
  .station-channel-detail { font-size: 13.8px; }
  .station-channel-number { font-size: 9.2px; letter-spacing: .09em; }
}
@media (max-width: 540px) {
  .station-final-invite { grid-template-columns: 1fr; gap: 42px; }
  .station-final-invite .station-open-form { justify-self: end; }
  .contact-station-center { width: 92%; top: 54%; }
  .station-email { left: 27%; top: 33%; }
  .station-whatsapp { left: 75%; top: 33%; }
  .station-channel { max-width: 49%; gap: 9px; padding: 18px 6px; }
  .station-channel-title { font-size: 20.7px; }
  .station-email .station-channel-detail { font-size: 11.5px; }
  .station-project { max-width: 90%; top: 17%; }
  .station-project .station-channel-title { font-size: 27.6px; }
}
@media (prefers-reduced-motion: reduce) {
  .station-waves path, .station-pulse, .station-final-pulse, .station-enhanced .station-channel { animation: none; }
  .station-waves path { opacity: .4; }
  .station-channel-title { transition: none; }
}

html:has(.contact-station-test) { scrollbar-gutter: stable; }
html.station-modal-open { overflow: hidden; }
.station-open-form { padding: 20px 26px; border: 1px solid #ff4035; background: #0a0b10; color: white; font: 600 18px "Visio Science Gothic", sans-serif; cursor: pointer; }
.station-open-form span { margin-left: 18px; color: #ff685c; }
.station-dialog {
  --station-form-accent: #efff13;
  --contact-black: #eef0f4;
  --contact-sand: #11131b;
  --contact-red: #ff685e;
  position: fixed; inset: 0; width: min(760px, calc(100vw - 36px));
  max-width: none; max-height: calc(100dvh - 40px); padding: 0; margin: auto;
  border: 1px solid #91504c80; border-radius: 19px; overflow: hidden;
  color: #eef0f4; background: radial-gradient(ellipse at 100% 0%, #51252d55, transparent 55%), #10121bef;
  box-shadow: 0 28px 110px #000b, 0 0 50px #ff302916, inset 0 0 38px #ffffff03;
  opacity: 0; transform: translateY(16px) scale(.98);
  transition: opacity 300ms ease, transform 400ms cubic-bezier(.2,.7,.2,1);
  text-align: left;
}
.station-dialog[open] { display: flex; }
.station-dialog.is-visible { opacity: 1; transform: translateY(0) scale(1); }
.station-dialog::backdrop {
  background: #03040b00; backdrop-filter: blur(0); -webkit-backdrop-filter: blur(0);
  transition: background 350ms ease, backdrop-filter 350ms ease, -webkit-backdrop-filter 350ms ease;
}
.station-dialog.is-visible::backdrop { background: #03040b80; backdrop-filter: blur(9px); -webkit-backdrop-filter: blur(9px); }
.station-dialog-border { position: absolute; inset: 0; width: 100%; height: 100%; pointer-events: none; z-index: 3; overflow: visible; }
.station-dialog-border :is(rect, path) { fill: none; vector-effect: non-scaling-stroke; }
.station-dialog-track { stroke: #ff6a581f; stroke-width: 1; }
.station-dialog-signal {
  stroke: #ff7062; stroke-width: 1.5; stroke-linecap: round;
  stroke-dasharray: .05 99.95; stroke-dashoffset: 0; opacity: 0;
  filter: drop-shadow(0 0 3px #ff382988);
}
.station-dialog-head {
  stroke: #ff8978; stroke-width: 4; stroke-linecap: round;
  stroke-dasharray: .001 99.999; opacity: 0;
  filter: drop-shadow(0 0 4px #ff4939bb);
}
.station-dialog[open] .station-dialog-signal { animation: station-border-orbit 70s linear infinite; }
.station-dialog[open] .station-dialog-head { animation: station-border-head 70s linear infinite; }
/* Both ends move on a 100-unit loop. After a soft launch, the head travels
   two laps while the tail travels one, closing the line before fading. */
@keyframes station-border-orbit {
  0% { stroke-dasharray: .05 99.95; stroke-dashoffset: 0; opacity: 0; animation-timing-function: ease-in-out; }
  2.1429% { stroke-dasharray: .05 99.95; stroke-dashoffset: 0; opacity: .6; animation-timing-function: cubic-bezier(.42,0,1,1); }
  7.1429% { stroke-dasharray: 3 97; stroke-dashoffset: -3; opacity: .6; }
  91.4286% { stroke-dasharray: 100 0; stroke-dashoffset: -100; opacity: .6; animation-timing-function: ease-in-out; }
  98.5714% { stroke-dasharray: 100 0; stroke-dashoffset: -108.22; opacity: 0; }
  100% { stroke-dasharray: .05 99.95; stroke-dashoffset: -110; opacity: 0; }
}
@keyframes station-border-head {
  0% { stroke-dashoffset: 0; opacity: 0; animation-timing-function: ease-in-out; }
  2.1429% { stroke-dashoffset: 0; opacity: .8; animation-timing-function: cubic-bezier(.42,0,1,1); }
  7.1429% { stroke-dashoffset: -6; opacity: .8; }
  91.4286% { stroke-dashoffset: -200; opacity: .8; animation-timing-function: ease-in-out; }
  98.5714% { stroke-dashoffset: -208.22; opacity: 0; }
  100% { stroke-dashoffset: -210; opacity: 0; }
}
.station-dialog-scroll { width: 100%; padding: 34px 42px 28px; overflow-y: auto; overscroll-behavior: contain; scrollbar-width: thin; scrollbar-color: #86473f transparent; }
.station-dialog-close {
  position: absolute; right: 14px; top: 14px; z-index: 4;
  display: grid; place-items: center; width: 44px; height: 44px; padding: 10px;
  color: #dedee6; border: 1px solid #ffffff22; border-radius: 50%; background: #161822;
  cursor: pointer; transition: background 200ms ease, border-color 200ms ease;
}
.station-dialog-close svg { width: 22px; height: 22px; fill: none; stroke: currentColor; stroke-width: 1.5; }
.station-dialog-close:hover { background: #52252a; border-color: #ff685e; }
.station-dialog-heading { padding-right: 36px; margin-bottom: 24px; }
.contact-station-test .station-dialog-kicker { color: #fa8377; font: 10px/1.5 "Visio Science Gothic", sans-serif; letter-spacing: .16em; margin: 0 0 14px; }
.contact-station-test .station-dialog h2 { margin: 0 0 12px; padding: 0; color: #fff; font: 600 clamp(25px, 3.3vw, 37px)/1.15 "Visio Science Gothic", sans-serif; font-family: "Visio Science Gothic", sans-serif !important; letter-spacing: -.04em; text-transform: none; text-align: left; }
.station-dialog h2:focus { outline: none; }
.contact-station-test #station-dialog-intro { color: #bfc0cb; font-size: 14px; line-height: 1.5; margin: 0; }
.station-dialog .visio-contact-form-grid { gap: 14px 24px; }
.station-dialog .visio-contact-field label { font-family: "Visio Roc Grotesk", sans-serif; color: #c6c6d1; font-size: 10px; letter-spacing: .09em; margin-bottom: 8px; }
.contact-station-test .station-dialog .visio-contact-field :is(input,textarea) {
  padding: 11px 12px !important; border: 1px solid #ffffff26 !important; border-radius: 6px !important;
  color: #f3f3f7 !important; background: #ffffff04 !important; font-size: 16px !important;
  box-shadow: none !important; min-height: 44px; transition: border-color 220ms ease, background 220ms ease;
}
.contact-station-test .station-dialog .visio-contact-field :is(input,textarea):focus { border-color: #ff8070 !important; background: #ff7a6508 !important; outline: 1px solid #ff807044; outline-offset: 2px; }
.station-dialog .visio-contact-field textarea { min-height: 100px; height: 100px; }
.station-dialog .formerror:empty { display: none; }
.station-dialog .visio-contact-consent { margin-top: 18px; gap: 10px; }
.station-dialog .visio-contact-consent label { color: #bfc0cb; font-size: 12px; line-height: 1.5; }
.station-dialog .visio-contact-consent a { color: #f4c0b8; }
.station-dialog .visio-contact-consent input { accent-color: #ff6256; }
.station-dialog .visio-contact-submit { margin-top: 18px; width: 100%; padding: 15px 20px; min-height: 50px; font-size: 16px; background: #f04436; color: white; border: 1px solid #ff7366; }
.station-dialog .visio-contact-submit:hover { background: #ff5647; }
.contact-station-test .station-dialog .station-test-note { color: #aaaab7; font-size: 11px; margin: 12px 0 0; }
.station-dialog .formmessage { color: #ffbcaf; font-size: 13px; line-height: 1.5; }
.station-dialog .formmessage:empty { display: none; }
.contact-station-test .station-dialog :is(
  .station-dialog-kicker,
  #station-dialog-intro,
  .visio-contact-field label,
  .visio-contact-consent label,
  .visio-contact-consent a,
  .station-test-note,
  .formmessage,
  .formerror
) { color: var(--station-form-accent); }
.contact-station-test .station-dialog :is(
  .station-dialog-kicker,
  #station-dialog-intro,
  .visio-contact-consent label,
  .visio-contact-consent a
) { color: #ff0000; }
@media (max-width: 540px) {
  .station-dialog { width: calc(100vw - 20px); max-height: calc(100dvh - 20px); }
  .station-dialog-scroll { padding: 29px 22px 24px; }
  .station-dialog .visio-contact-form-grid { grid-template-columns: 1fr; gap: 13px; }
  .station-dialog-heading { padding-right: 24px; }
  .station-dialog-close { right: 9px; top: 9px; }
  .station-dialog h2 { max-width: 220px; }
}
@media (prefers-reduced-motion: reduce) {
  .station-dialog, .station-dialog::backdrop { transition: none; }
  .station-dialog[open] :is(.station-dialog-signal, .station-dialog-head) { animation: none; }
}
