/* A small journey through the impossible, ending with a very simple hello. */
.contact-cosmos {
    --paper: #080d17;
    --ink: #edf3ff;
    --muted: #9ba9bf;
    --line: #273043;
    --soft: #101827;
    --orange: #93e8d2;
    --orange-text: #a3efdc;
    background: radial-gradient(ellipse at 85% 15%, #21234266, transparent 50%), var(--paper);
    color: var(--ink);
}
.contact-cosmos .site-header { background: #080d17bb; }
.contact-cosmos .site-footer { background: linear-gradient(130deg, #0d1624, #101423); }
.contact-cosmos .main-nav a { color: #b4c0d3; }
.contact-cosmos .main-nav a[aria-current] { color: var(--orange); }
.contact-opening { display: flex; align-items: flex-end; justify-content: space-between; gap: 30px; padding-block: 43px 35px; }
.contact-opening .eyebrow { font-size: 8px; letter-spacing: .13em; color: #a9b6ce; margin-bottom: 23px; }
.contact-opening h1 { font-size: clamp(44px, 4.4vw, 64px); line-height: 1.08; letter-spacing: -.05em; }
.contact-opening h1 .serif { color: #b7bddf; letter-spacing: -.05em; }
.contact-opening>p { font-size: 12px; line-height: 1.9; margin-bottom: 4px; }
.dimension-experience { --journey: 1; position: relative; border: 1px solid #344157; border-radius: 12px; overflow: hidden; background: #090f1d; box-shadow: 0 30px 90px #0003; }
.dimension-topline { display: flex; align-items: center; justify-content: space-between; gap: 20px; padding: 19px 25px; color: #a3b3cd; border-bottom: 1px solid #263246; font-size: 8px; letter-spacing: .09em; background: #121a2933; }
.dimension-topline>span:first-child { display: flex; align-items: center; gap: 9px; }
.transmission-dot { width: 5px; height: 5px; border-radius: 50%; background: #97ead2; box-shadow: 0 0 12px #97ead288; }
.dimension-stage { position: relative; isolation: isolate; overflow: hidden; height: 460px; background: radial-gradient(ellipse at 28% 52%, #234f562b, transparent 37%), radial-gradient(ellipse at 75% 48%, #523d8c33, transparent 44%), #090f1d; }
.dimension-stage::after { content: ''; position: absolute; inset: 0; pointer-events: none; z-index: 2; background: linear-gradient(0deg, #090f1d 0, transparent 22%, transparent 91%, #090f1d88); }
.dimension-canvas { position: absolute; width: 100%; height: 100%; inset: 0; opacity: 0; transition: opacity .8s; }
.dimension-stage.is-rendered .dimension-canvas { opacity: 1; }
.dimension-axis { position: absolute; top: 23px; left: 25px; font-size: 8px; letter-spacing: .16em; color: #778aa9; z-index: 3; }
.portal-label { position: absolute; top: 79%; left: 27%; transform: translateX(-50%); color: #93cbbb; letter-spacing: .12em; font-size: 7px; z-index: 3; }
.portal-label-exit { left: 73%; color: #b7a5e7; }
.space-traveler { position: absolute; z-index: 3; width: clamp(85px, 9vw, 130px); left: 81%; top: 54%; transform: translate(-50%, -50%) rotate(9deg); filter: drop-shadow(0 0 18px #a4b5ff30); will-change: transform; pointer-events: none; }
.space-traveler svg { width: 100%; overflow: visible; }
.traveler-leg { transform-origin: 68px 136px; animation: traveler-leg 4.5s ease-in-out infinite alternate; }
.traveler-leg-other { transform-origin: 92px 136px; animation: traveler-leg 5s -2s ease-in-out infinite alternate-reverse; }
.traveler-message { position: absolute; z-index: 4; right: 6%; top: 24px; padding: 19px 24px; border: 1px solid #64748d88; border-radius: 12px 12px 3px 12px; background: linear-gradient(135deg, #17263bdb, #25243bd9); box-shadow: 0 8px 40px #7f83d915; max-width: 350px; opacity: 1; transform: none; transition: opacity .7s ease, transform .8s cubic-bezier(.2,.8,.2,1); }
.traveler-message::after { content: ''; position: absolute; width: 12px; height: 12px; bottom: -7px; right: 38px; background: #25243b; border-bottom: 1px solid #64748d88; border-right: 1px solid #64748d88; transform: rotate(45deg); }
.traveler-message>.mono { color: #a0ead7; font-size: 7px; letter-spacing: .12em; }
.traveler-message h2 { margin-block: 12px 9px; font-size: 43px; line-height: 1.1; letter-spacing: -.04em; }
.traveler-message h2 em { font: italic 1em Georgia,serif; color: #d2c7ff; }
.traveler-message>p { font-size: 10px; color: #b7c6dd; }
.dimension-experience:not([data-phase="connected"]) .traveler-message { opacity: 0; transform: translateY(15px) scale(.96); pointer-events: none; visibility: hidden; }
.journey-caption { position: absolute; bottom: 21px; left: 25px; right: 25px; z-index: 3; display: flex; align-items: center; justify-content: space-between; gap: 20px; }
.journey-caption>.mono { font-size: 8px; letter-spacing: .1em; color: #a9e8d7; }
.journey-caption>p { font-size: 10px; color: #9baac2; }
.dimension-console { position: relative; padding: 19px 25px 13px; border-top: 1px solid #2c374d; background: #101827; }
.dimension-console::before { content: ''; position: absolute; left: 0; top: -1px; height: 1px; width: 100%; transform: scaleX(var(--journey)); transform-origin: left; background: linear-gradient(90deg,#79d7bf,#c0a2ff); box-shadow: 0 0 8px #92abef66; }
.dimension-steps { display: grid; grid-template-columns: repeat(5,1fr); gap: 15px; padding: 0; margin: 0; list-style: none; }
.dimension-steps li { display: flex; align-items: center; gap: 12px; color: #7f90ad; font: 10px var(--mono); transition: color .5s; }
.dimension-steps li>span { font-size: 8px; width: 26px; height: 26px; border: 1px solid #35445e; border-radius: 50%; display: grid; place-items: center; transition: border-color .5s, background .5s, box-shadow .5s; }
.dimension-steps .is-past { color: #a8c1d4; }.dimension-steps .is-current { color: #d7f8ee; }
.dimension-steps .is-current>span { background: #8ae3c916; border-color: #8ddfc5; box-shadow: 0 0 17px #83e0c522; }
.dimension-experience[data-phase="connected"] .dimension-steps li:last-child { color: #d5c6ff; }
.journey-controls { display: flex; align-items: center; gap: 24px; border-top: 1px solid #263249; margin-top: 16px; padding-top: 4px; }
.journey-controls .control { color: #a4b5cd; font-size: 9px; min-height: 40px; }
.journey-controls .control:hover { color: #c4ffeb; }.journey-controls .control>span { font-size: 16px; color: #9de5d2; transition: transform .4s; }
.journey-replay:hover>span { transform: rotate(90deg); }.journey-controls .motion-toggle { margin-left: auto; }
.dimension-experience[data-phase="connected"] .journey-skip { display: none; }
.dimension-fallback { position: absolute; inset: 0; }
.dimension-fallback i { position: absolute; left: 50%; top: 49%; width: 160px; height: 160px; border: 1px solid #829cd190; transform: translate(-50%,-50%) rotate(30deg); box-shadow: 0 0 18px #7da4e31a; }
.dimension-fallback i:nth-child(2) { transform: translate(-50%,-50%) rotate(60deg) scale(.72); border-color: #a2dbcf88; }
.dimension-fallback i:nth-child(3) { transform: translate(-50%,-50%) rotate(85deg) scale(.42); }
.dimension-fallback::before,.dimension-fallback::after { content: ''; position: absolute; left: 27%; top: 51%; width: 78px; height: 215px; border: 3px solid #9ae8d5; border-radius: 50%; transform: translate(-50%,-50%) rotate(12deg); box-shadow: 0 0 18px #6ce0c466, inset 0 0 18px #6ce0c455; }
.dimension-fallback::after { left: 73%; transform: translate(-50%,-50%) rotate(-12deg); border-color: #c3a9ff; box-shadow: 0 0 18px #b895fb66,inset 0 0 18px #b895fb55; }
.dimension-stage.is-rendered .dimension-fallback { display: none; }
.dimension-experience.is-inactive .space-traveler svg * { animation-play-state: paused; }
.contact-cosmos .contact-details { padding-top: 43px; }
.contact-cosmos .contact-details>div:first-child { border: 1px solid #2d3b52; border-radius: 8px; background: radial-gradient(ellipse at 85% 50%, #25324a55, transparent 65%), #101725; padding: 25px 28px 0; transition: border-color .4s, box-shadow .4s; }
.contact-cosmos .contact-details>div:first-child:hover { border-color: #6b9f9b; box-shadow: 0 0 35px #6cceb50a; }
.contact-cosmos .contact-details .eyebrow { color: #a4cbbb; font-size: 8px; letter-spacing: .13em; }
.contact-cosmos .contact-email { font-size: clamp(22px,3.5vw,49px); border: 0; padding-block: 15px 27px; transition: color .3s; }
.contact-cosmos .contact-email>span { color: #a4e9d4; transition: transform .4s; }
.contact-cosmos .contact-email:hover>span { transform: translate(5px,-5px); }
.contact-cosmos .contact-socials { padding-block: 24px; border-bottom: 1px solid var(--line); }
.contact-cosmos .contact-socials a { padding: 8px 0; font-size: 12px; }.contact-cosmos .contact-socials a>span { color: #b6a7e0; }
.contact-cosmos .contact-signoff { padding-block: 18px 59px; }.contact-cosmos .contact-signoff>.mono { color: #8193b0; font-size: 8px; letter-spacing: .09em; }
.contact-cosmos .contact-signoff p { color: #c5d1e4; font-size: 25px; }
.contact-opening { animation: dimension-rise .85s ease both; }.dimension-experience { animation: dimension-rise 1s .12s ease both; }
.contact-details.is-revealed { animation: dimension-rise .8s ease both; }
@keyframes dimension-rise { from { opacity: 0; transform: translateY(18px); } to { opacity: 1; transform: none; } }
@keyframes traveler-leg { from { transform: rotate(-5deg); } to { transform: rotate(6deg); } }
@media(max-width:1100px) { .contact-opening h1 { font-size: 53px; }.contact-opening>p { font-size: 10px; }.dimension-coordinate { display: none; }.dimension-steps li { font-size: 9px; gap: 8px; }.traveler-message { right: 4%; }.traveler-message h2 { font-size: 37px; } }
@media(max-width:760px) {
    .contact-opening { flex-direction: column; align-items: flex-start; padding-block: 31px 27px; gap: 21px; }
    .contact-opening .eyebrow { font-size: 7px; letter-spacing: .07em; gap: 8px; margin-bottom: 20px; }
    .contact-opening h1 { font-size: clamp(36px,9.2vw,54px); }
    .contact-opening>p { font-size: 11px; }
    .dimension-topline { padding: 15px 17px; gap: 12px; font-size: 6px; letter-spacing: .03em; }
    .dimension-topline>span:nth-child(2) { max-width: 95px; text-align: right; line-height: 1.6; }
    .dimension-stage { height: 470px; }
    .dimension-axis { left: 17px; top: 19px; font-size: 7px; }
    .space-traveler { width: 88px; left: 80%; top: 43%; }
    .traveler-message { top: auto; bottom: 77px; left: 19px; right: 19px; max-width: none; padding: 18px 20px; border-radius: 10px; text-align: center; }
    .traveler-message::after { top: -7px; bottom: auto; right: 23%; transform: rotate(225deg); }
    .traveler-message h2 { font-size: 38px; margin-block: 10px; }.traveler-message>p { font-size: 9px; }
    .portal-label { top: 51%; left: 23%; font-size: 6px; letter-spacing: .05em; }.portal-label-exit { left: 73%; }
    .journey-caption { left: 17px; right: 17px; bottom: 17px; flex-direction: column; align-items: flex-start; gap: 7px; }
    .journey-caption>.mono { font-size: 7px; }.journey-caption>p { font-size: 9px; max-width: 260px; }
    .dimension-console { padding: 16px 15px 9px; }.dimension-steps { gap: 6px; }.dimension-steps li { flex-direction: column; gap: 8px; font-size: 6px; letter-spacing: -.02em; }
    .dimension-steps li>span { width: 25px; height: 25px; font-size: 7px; }.journey-controls { gap: 15px; margin-top: 14px; flex-wrap: wrap; }.journey-controls .control { font-size: 7px; gap: 6px; }.journey-controls .control>span { font-size: 14px; }
    .dimension-fallback i { top: 36%; width: 95px; height: 95px; }.dimension-fallback::before,.dimension-fallback::after { top: 36%; height: 145px; width: 40px; }.dimension-fallback::before { left: 23%; }
    .contact-cosmos .contact-details { padding-block: 29px 20px; }.contact-cosmos .contact-details>div:first-child { padding: 20px 18px 0; }
    .contact-cosmos .contact-email { font-size: clamp(16px,4.8vw,30px); padding-block: 16px 23px; gap: 10px; }.contact-cosmos .contact-socials { gap: 23px; }.contact-cosmos .contact-socials .eyebrow { flex-basis: 100%; }
    .contact-cosmos .contact-signoff { padding-block: 11px 40px; gap: 20px; }.contact-cosmos .contact-signoff p { font-size: 23px; }
}

/* Art direction: a quiet gallery around an immersive, sculptural scene. */
.contact-cosmos { --paper:#f1f0fa; --ink:#202128; --muted:#60616f; --line:#d8d7e4; --soft:#e8e7f1; --orange:#3431ff; --orange-text:#3431dd; background:var(--paper); color:var(--ink); }
.contact-cosmos .site-header { background:transparent; border:0; }
.contact-cosmos .site-header .nav { min-height:96px; }
.contact-cosmos .wordmark { color:#202128; }
.contact-cosmos .main-nav { gap:5px; }
.contact-cosmos .main-nav a { color:#44444f; padding:10px 14px; border-radius:30px; font-size:11px; }
.contact-cosmos .main-nav a:hover { background:#e1e0ee; }
.contact-cosmos .main-nav a[aria-current] { background:#272831; color:white; }
.contact-cosmos .main-nav a[aria-current]::after { display:none; }
.contact-cosmos .sound-toggle { background:#e5e4ef; border-radius:40px; padding:12px 15px; color:#53535f; }
.contact-opening { display:grid; grid-template-columns:1.45fr 1fr auto; align-items:end; gap:30px; padding-block:33px 33px; }
.contact-opening .eyebrow { font:9px Arial,sans-serif; color:#686874; letter-spacing:.025em; margin-bottom:18px; }
.contact-opening h1 { font:500 clamp(48px,6.7vw,96px)/.95 Arial,sans-serif; letter-spacing:-.075em; }
.contact-opening h1 .accent { color:#3431ff; }
.contact-opening>p { font-size:14px; color:#50515d; line-height:1.5; margin-bottom:3px; }
.contact-hello-pill { display:inline-flex; align-items:center; justify-content:center; gap:21px; font-size:10px; font-weight:600; background:#292a33; color:#fff; border-radius:40px; padding:16px 22px; transition:transform .35s,background .35s; margin-bottom:3px; white-space:nowrap; }
.contact-hello-pill:hover { color:white; background:#3431ff; transform:translateY(-3px); }
.contact-hello-pill span { font-size:16px; }
.dimension-experience { --ink:#f4f4ff; --muted:#b9b9ca; --orange:#adafff; --orange-text:#fff; border:0; border-radius:23px; box-shadow:none; background:#17171e; }
.dimension-topline,.dimension-axis,.portal-label,.dimension-steps { display:none; }
.dimension-stage { height:clamp(480px,57vw,620px); background:radial-gradient(ellipse at 70% 45%,#292940,#16161d 80%); }
.dimension-stage::after { background:linear-gradient(0deg,#17171e,transparent 18%,transparent 85%,#17171e22); }
.dimension-depth-canvas { position:absolute; inset:0; height:100%; width:100%; opacity:0; transition:opacity 1s; }
.dimension-stage.has-depth .dimension-depth-canvas { opacity:1; }
.dimension-stage.has-depth .dimension-canvas { opacity:.38; }
.space-traveler { width:clamp(120px,14vw,200px); filter:drop-shadow(12px 20px 20px #0006); }
.traveler-message { left:5.5%; top:12%; right:auto; padding:0; border:0; border-radius:0; background:none; box-shadow:none; max-width:52%; }
.traveler-message::after { display:none; }
.traveler-message>.mono { font:9px Arial,sans-serif; color:#c3c3d6; letter-spacing:.06em; }
.traveler-message h2 { font:500 clamp(62px,8vw,114px)/.9 Arial,sans-serif; letter-spacing:-.075em; margin:27px 0 22px; color:#fff; }
.traveler-message h2 em { font:inherit; color:#b2afff; }
.traveler-message>p { font-size:12px; color:#c6c6d8; }
.scene-contact-link { display:inline-flex; align-items:center; gap:23px; font-size:9px; background:#f1f0fa; color:#292a33; border-radius:30px; padding:13px 18px; margin-top:24px; transition:transform .35s,background .35s; }
.scene-contact-link:hover { color:#1f1f29; background:#cccaff; transform:translateY(-3px); }
.scene-contact-link>span { font-size:16px; }
.dimension-experience[data-phase="connected"] .traveler-message h2 { animation:cinema-copy .85s cubic-bezier(.2,.8,.2,1) both; }
.journey-caption { bottom:24px; left:32px; right:32px; }
.journey-caption>.mono { font:8px Arial,sans-serif; letter-spacing:.08em; color:#bab8e8; }
.journey-caption>p { color:#a5a5b9; font:10px Arial,sans-serif; }
.dimension-console { padding:0 22px 15px; border:0; background:#17171e; }
.dimension-console::before { top:auto; bottom:0; background:#7c77ff; box-shadow:none; opacity:.65; }
.journey-controls { margin:0; padding:0; border:0; gap:10px; }
.journey-controls .control { color:#d1d0e0; background:#2a2a36; border:1px solid #ffffff0c; padding:10px 16px; border-radius:30px; font:9px Arial,sans-serif; min-height:38px; }
.journey-controls .control:hover { background:#414052; color:white; }
.journey-controls .control>span { color:#bdb9ff; }
.journey-controls .motion-toggle { background:transparent; border-color:#44434e; }
.contact-scroll-note { display:flex; justify-content:space-between; align-items:center; gap:20px; padding-top:17px; color:#42434c; font-size:8px; }
.contact-scroll-note>span:nth-child(odd) { font-size:21px; font-weight:300; }
.contact-cosmos .contact-details { padding-block:105px 20px; }
.contact-cosmos .contact-details>div:first-child { border:0; border-radius:0; background:none; padding:0; }
.contact-cosmos .contact-details>div:first-child:hover { box-shadow:none; }
.contact-cosmos .contact-details .eyebrow { color:#646471; font:9px Arial,sans-serif; letter-spacing:.045em; }
.contact-cosmos .contact-email { font-size:clamp(22px,4.6vw,66px); color:#25262d; letter-spacing:-.06em; padding-block:27px 39px; border-bottom:1px solid #cfcedd; }
.contact-cosmos .contact-email:hover { color:#3431ff; }
.contact-cosmos .contact-email>span { display:grid; place-items:center; width:65px; height:65px; border-radius:50%; background:#dfddea; color:#35323d; font-size:35px; flex-shrink:0; }
.contact-cosmos .contact-socials { border:0; padding-block:22px; }
.contact-cosmos .contact-socials a { padding:12px 19px; border-radius:30px; background:#e3e1ef; color:#393840; font-size:11px; }
.contact-cosmos .contact-socials a:hover { background:#d5d2ea; }
.contact-cosmos .contact-socials a>span { color:#393840; }
.contact-cosmos .contact-signoff { padding-block:30px 80px; border-bottom:1px solid #d5d3e3; }
.contact-cosmos .contact-signoff>.mono { color:#6d6b7a; font:8px Arial,sans-serif; }
.contact-cosmos .contact-signoff p { color:#41414d; font-size:35px; letter-spacing:-.05em; }
.contact-cosmos .site-footer { background:#e7e5f1; padding-top:50px; }
.contact-cosmos .footer-name { font-size:55px; letter-spacing:-.065em; }
.contact-cosmos .footer-links a { background:#d9d6e8; border-radius:30px; padding:10px 16px; }
.contact-cosmos .footer-bottom { color:#686674; }
@keyframes cinema-copy { from { opacity:0; transform:translateY(30px); filter:blur(5px); } to { opacity:1; transform:none; filter:blur(0); } }
@media(max-width:1100px) {
    .contact-opening { grid-template-columns:1.4fr 1fr; gap:24px; }
    .contact-opening h1 { font-size:7.8vw; }.contact-opening>p { font-size:12px; }.contact-hello-pill { display:none; }
    .contact-cosmos .site-header .nav { gap:15px; }.contact-cosmos .main-nav a { padding-inline:10px; }
    .traveler-message { max-width:53%; }.traveler-message h2 { font-size:9vw; }
}
@media(max-width:760px) {
    .contact-cosmos .site-header .nav { min-height:80px; }
    .contact-cosmos .main-nav { padding-top:13px; gap:3px; }.contact-cosmos .main-nav a { padding:8px 10px; font-size:10px; }
    .contact-cosmos .sound-toggle { padding:9px 10px; font-size:8px; }
    .contact-opening { display:block; padding-block:28px; }
    .contact-opening .eyebrow { margin-bottom:18px; font-size:8px; }
    .contact-opening h1 { font-size:clamp(47px,13.2vw,82px); }
    .contact-opening>p { margin-top:23px; font-size:12px; }
    .dimension-experience { border-radius:17px; }.dimension-stage { height:550px; }
    .space-traveler { width:100px; }
    .traveler-message { left:24px; right:24px; top:auto; bottom:73px; max-width:none; text-align:left; }
    .traveler-message>.mono { font-size:7px; }.traveler-message h2 { font-size:62px; line-height:.91; margin:16px 0; }
    .traveler-message h2 br { display:none; }.traveler-message h2 em::before { content:' '; white-space:pre; }
    .traveler-message>p { font-size:10px; }.scene-contact-link { margin-top:17px; padding:11px 16px; font-size:8px; }
    .journey-caption { left:24px; right:24px; bottom:17px; gap:8px; }.journey-caption>p { font-size:8px; max-width:260px; }.journey-caption>.mono { font-size:7px; }
    .dimension-console { padding:0 15px 14px; }.journey-controls { gap:8px; }.journey-controls .control { padding:9px 12px; font-size:8px; }.journey-controls .motion-toggle { padding-inline:11px; }
    .contact-scroll-note { gap:10px; font-size:6px; padding-top:13px; }.contact-scroll-note>span:nth-child(2) { max-width:90px; }.contact-scroll-note>span:nth-child(3) { display:none; }.contact-scroll-note>span:nth-child(odd) { font-size:17px; }
    .contact-cosmos .contact-details { padding-top:65px; }.contact-cosmos .contact-details>div:first-child { padding:0; }
    .contact-cosmos .contact-email { font-size:clamp(17px,5vw,28px); align-items:center; gap:9px; padding-block:22px 30px; }
    .contact-cosmos .contact-email>span { width:33px; height:33px; font-size:22px; }
    .contact-cosmos .contact-socials { gap:12px; }.contact-cosmos .contact-socials a { font-size:10px; gap:18px; padding:11px 16px; }
    .contact-cosmos .contact-signoff { padding-block:10px 45px; }.contact-cosmos .contact-signoff p { font-size:29px; }.contact-cosmos .footer-name { font-size:43px; }.contact-cosmos .footer-links { gap:13px; }
}
@media(max-width:360px) { .traveler-message h2 { font-size:52px; }.contact-cosmos .contact-email { font-size:16px; }.contact-cosmos .contact-email>span { width:28px; height:28px; } }
