* { margin:0; padding:0; box-sizing:border-box; }
  body { background:#050609; overflow-x:hidden; }
  a { color:#aeb6c4; text-decoration:none; }
  a:hover { color:#ffffff; }
  ::selection { background:#7b9be0; color:#050609; }
  @keyframes floaty { 0%,100%{ transform:translateY(0); } 50%{ transform:translateY(-10px); } }
  @keyframes pulseDot { 0%,100%{ opacity:.35; } 50%{ opacity:1; } }
  @keyframes contactGlowSweep {
    0% { transform:translate3d(-18%, -12%, 0) rotate(12deg); opacity:.07; }
    100% { transform:translate3d(24%, 10%, 0) rotate(12deg); opacity:.14; }
  }
  @keyframes contactPanelIn {
    from { opacity:0; transform:translate3d(24px, 18px, 0) scale(.985); }
    to { opacity:1; transform:translate3d(0, 0, 0) scale(1); }
  }
  @keyframes contactSignal {
    0%,100% { opacity:.45; transform:scaleX(.72); }
    50% { opacity:1; transform:scaleX(1); }
  }
  @keyframes servicePulse {
    0%,100% { opacity:.42; transform:scale(.96); }
    50% { opacity:1; transform:scale(1); }
  }
  .hero-stage { min-height:100vh; overflow-x:hidden; }
  html, body {
    height:auto !important;
    min-height:100%;
    overflow-x:hidden;
  }
  #dc-root,
  .sc-host {
    height:auto !important;
    min-height:100vh;
    overflow:visible;
  }
  html.home-entry-lock .hero-inner,
  html.home-entry-lock .stats-wrap,
  html.home-entry-lock .stats-card,
  html.home-entry-lock .scroll-label {
    transform:none !important;
    opacity:1 !important;
    filter:none !important;
  }
  html.home-entry-lock .astro-layer {
    transform:translateX(-50%) !important;
    opacity:1 !important;
    filter:none !important;
  }
  html.home-entry-lock .transition-home-services .transition-layer,
  html.home-entry-lock .transition-home-services .transition-depth-marker,
  html.home-entry-lock .transition-moon,
  html.home-entry-lock .transition-viewport-atmosphere {
    opacity:0 !important;
    filter:none !important;
  }
  .hero-inner {
    min-height:calc(100vh - 150px);
    padding-left:clamp(92px,8vw,132px) !important;
  }
  .astro-layer {
    position:absolute;
    z-index:1;
    top:1vh;
    left:59%;
    width:min(108vw,1700px);
    aspect-ratio:16/9;
    transform:translateX(-50%);
    pointer-events:none;
    will-change:transform;
    transition:none;
  }
  .astro-layer img {
    position:absolute;
    inset:0;
    width:100%;
    height:100%;
    object-fit:cover;
    display:block;
    opacity:0;
    visibility:visible;
    filter:contrast(1.08) brightness(1.03) saturate(.92);
    transition:opacity .25s ease;
    -webkit-mask-image:radial-gradient(ellipse 70% 80% at 51% 43%, #000 65%, rgba(0,0,0,.78) 78%, transparent 100%);
    mask-image:radial-gradient(ellipse 70% 80% at 51% 43%, #000 65%, rgba(0,0,0,.78) 78%, transparent 100%);
  }
  .astro-layer.is-video-ready img { opacity:.96; }
  .hero-copy { max-width:620px; padding-top:8px; }
  .hero-title { font-size:clamp(48px,5vw,78px); max-width:10.8ch; text-wrap:balance; }
  .hero-actions { align-items:center; }
  .hero-primary-cta { min-width:220px; text-align:center; }
  .nav-link.is-active {
    color:#ffffff;
    position:relative;
  }
  .nav-link.is-active::after {
    content:"";
    position:absolute;
    left:50%;
    bottom:-18px;
    width:68px;
    height:2px;
    transform:translateX(-50%);
    background:#7fa8ff;
    box-shadow:0 0 18px rgba(127,168,255,.9);
  }
  .scroll-label {
    left:clamp(18px,2.4vw,38px) !important;
    bottom:clamp(42px,7vh,82px) !important;
    width:18px;
    pointer-events:none;
  }
  .scroll-label span:first-child {
    white-space:nowrap;
    transform:rotate(180deg) translateX(1px) !important;
  }
  .stats-card { min-width:0; }
  .cinematic-transition {
    position:relative;
    min-height:220vh;
    background:#040609;
    color:#f4f6fb;
    font-family:Manrope,sans-serif;
    overflow:hidden;
    isolation:isolate;
    contain:paint;
    max-width:100vw;
  }
  .transition-home-services {
    min-height:205vh;
    margin-top:-113vh;
    margin-bottom:-100vh;
    background:transparent;
    pointer-events:none;
    z-index:7;
    overflow:hidden;
    contain:paint;
  }
  .transition-pin {
    position:sticky;
    top:0;
    height:100vh;
    overflow:hidden;
    background:#040609;
    perspective:1100px;
    contain:paint;
    max-width:100vw;
  }
  .transition-home-services .transition-pin {
    background:transparent;
    pointer-events:none;
  }
  .transition-layer {
    position:absolute;
    inset:0;
    pointer-events:none;
    will-change:transform, opacity, clip-path;
  }
  .transition-bg {
    z-index:0;
    background:
      radial-gradient(70% 78% at 50% 50%, rgba(44,72,117,.36), transparent 68%),
      linear-gradient(180deg, #040609, #07101a 52%, #040609);
    transform:translateZ(-160px) scale(1.18);
  }
  .transition-home-services .transition-bg {
    opacity:0;
    background:
      radial-gradient(48% 42% at 64% 45%, rgba(137,173,235,.2), transparent 70%),
      radial-gradient(82% 72% at 50% 50%, rgba(7,12,21,.04), rgba(4,6,9,.58) 78%, rgba(4,6,9,.76));
  }
  .transition-video {
    z-index:1;
    inset:-16%;
    opacity:.46;
    mix-blend-mode:screen;
    transform:translate3d(20vw, 0, 0) scale(1.08);
  }
  .transition-home-services .transition-video {
    inset:-24%;
    opacity:0;
    mix-blend-mode:screen;
    transform:translate3d(42vw, 6vh, 0) scale(1.55);
    filter:blur(18px) brightness(.82) contrast(1.04);
    -webkit-mask-image:radial-gradient(ellipse at 58% 48%, #000 0%, rgba(0,0,0,.72) 20%, transparent 48%);
    mask-image:radial-gradient(ellipse at 58% 48%, #000 0%, rgba(0,0,0,.72) 20%, transparent 48%);
  }
  .transition-video video,
  .transition-media-img {
    width:100%;
    height:100%;
    object-fit:cover;
    display:block;
  }
  .transition-media-img {
    opacity:.5;
    filter:brightness(.72) contrast(1.08) saturate(.86);
  }
  /* Smoke transition (assets/smoke-transition.*) — services -> contact.
     Driven by FIXED, full-viewport layers (like the home->services atmosphere) so
     coverage is guaranteed and there is no pin misposition or black tail. */
  .transition-services-contact {
    min-height:132vh;
    margin-top:-22vh;
    margin-bottom:-72vh;
    background:transparent;
    pointer-events:none;
    z-index:8;
  }
  .transition-services-contact .transition-pin {
    background:transparent;
    pointer-events:none;
  }
  .transition-services-contact .transition-smoke {
    z-index:2;
    inset:-14%;
    opacity:0;
    mix-blend-mode:screen;
    filter:contrast(1.65) brightness(.58) saturate(.72);
    -webkit-mask-image:linear-gradient(180deg, transparent 0%, #000 12%, #000 86%, transparent 100%);
    mask-image:linear-gradient(180deg, transparent 0%, #000 12%, #000 86%, transparent 100%);
  }
  .transition-services-contact .transition-smoke video {
    width:100%;
    height:100%;
    object-fit:cover;
    display:block;
  }
  .transition-services-contact .transition-smoke-back {
    z-index:1;
    filter:blur(10px) invert(1) contrast(2.6) brightness(.46) saturate(.6);
  }
  .transition-services-contact .transition-smoke-front {
    z-index:3;
    filter:invert(1) contrast(3.2) brightness(.62) saturate(.62);
  }
  .contact-atmosphere {
    position:fixed;
    inset:0;
    z-index:6;
    pointer-events:none;
    opacity:0;
    background:
      radial-gradient(58% 46% at 50% 44%, rgba(96,126,186,.18), transparent 72%),
      radial-gradient(120% 100% at 50% 50%, transparent 34%, rgba(4,7,13,.5) 66%, rgba(3,5,9,.92) 100%),
      linear-gradient(180deg, #05080f 0%, #0a1120 46%, #06090f 100%);
    will-change:opacity;
    contain:paint;
  }
  .contact-smoke {
    position:fixed;
    inset:-12%;
    z-index:7;
    pointer-events:none;
    opacity:0;
    mix-blend-mode:screen;
    will-change:transform, opacity;
  }
  .contact-smoke video {
    width:100%;
    height:100%;
    object-fit:cover;
    display:block;
  }
  .contact-smoke-back { z-index:7; filter:blur(7px) brightness(.6) saturate(.72); }
  .contact-smoke-front { z-index:9; filter:contrast(1.12) brightness(1.02) saturate(.82); }
  .contact-copy {
    position:fixed;
    z-index:10;
    pointer-events:none;
    opacity:0;
    left:clamp(28px,7vw,120px);
    bottom:clamp(64px,14vh,140px);
    max-width:640px;
  }
  .contact-copy span {
    display:block;
    margin-bottom:16px;
    color:#8aa6e6;
    font-size:12px;
    letter-spacing:.28em;
    text-transform:uppercase;
    font-weight:800;
  }
  .contact-copy strong {
    display:block;
    font-family:Sora,sans-serif;
    font-size:clamp(40px,6vw,84px);
    line-height:1;
    color:#fff;
  }
  .contact-copy p {
    margin-top:20px;
    max-width:460px;
    color:#aeb9cb;
    font-size:clamp(15px,1.2vw,18px);
    line-height:1.7;
  }
  .transition-aperture {
    z-index:3;
    inset:-8%;
    background:
      radial-gradient(circle at 50% 48%, transparent 0%, transparent 18%, rgba(5,8,13,.22) 34%, rgba(3,5,8,.94) 66%),
      linear-gradient(90deg, rgba(3,5,8,.92), transparent 32%, transparent 68%, rgba(3,5,8,.92));
    clip-path:circle(18% at 50% 50%);
  }
  .transition-home-services .transition-aperture {
    opacity:0;
    background:
      radial-gradient(circle at 52% 48%, transparent 0%, transparent 18%, rgba(87,127,200,.12) 40%, rgba(2,3,6,.48) 78%),
      linear-gradient(90deg, rgba(3,5,8,.24), transparent 34%, transparent 66%, rgba(3,5,8,.24));
    clip-path:circle(72% at 58% 48%);
  }
  .transition-streaks {
    z-index:4;
    inset:-20% -35%;
    opacity:.58;
    background:
      linear-gradient(112deg, transparent 0%, transparent 36%, rgba(126,172,244,.42) 49%, transparent 56%, transparent 100%),
      linear-gradient(112deg, transparent 0%, transparent 47%, rgba(255,255,255,.16) 50%, transparent 54%, transparent 100%);
    transform:translate3d(-38vw, 0, 0) rotate(0.001deg);
  }
  .transition-fog {
    z-index:2;
    inset:-20%;
    opacity:.38;
    background:
      radial-gradient(circle at 18% 56%, rgba(134,170,231,.24), transparent 24%),
      radial-gradient(circle at 72% 38%, rgba(82,122,190,.22), transparent 28%),
      radial-gradient(circle at 50% 72%, rgba(255,255,255,.07), transparent 34%);
    filter:blur(18px);
    transform:translate3d(0, 12vh, 0) scale(1.05);
  }
  .transition-home-services .transition-fog {
    opacity:0;
    filter:blur(24px);
  }
  .transition-copy {
    z-index:5;
    position:absolute;
    left:clamp(28px,7vw,120px);
    bottom:clamp(58px,12vh,120px);
    max-width:720px;
    transform:translate3d(0, 50px, 0);
    opacity:.2;
  }
  .transition-home-services .transition-copy {
    display:none;
  }
  .transition-copy span {
    display:block;
    margin-bottom:18px;
    color:#8aa6e6;
    font-size:12px;
    letter-spacing:.28em;
    text-transform:uppercase;
    font-weight:800;
  }
  .transition-copy strong {
    display:block;
    font-family:Sora,sans-serif;
    font-size:clamp(42px,6vw,90px);
    line-height:.98;
    color:#ffffff;
    letter-spacing:0;
  }
  .transition-copy p {
    margin-top:22px;
    max-width:520px;
    color:#9eaabc;
    font-size:clamp(15px,1.2vw,18px);
    line-height:1.7;
  }
  .transition-depth-marker {
    z-index:5;
    position:absolute;
    right:clamp(28px,5vw,80px);
    top:50%;
    width:12px;
    height:12px;
    border-radius:50%;
    background:#8aa6e6;
    box-shadow:0 0 34px 8px rgba(138,166,230,.45);
    transform:translate3d(0, -50%, 0) scale(.8);
    pointer-events:none;
  }
  .transition-home-services .transition-depth-marker {
    opacity:0;
  }
  .transition-warp-grid {
    z-index:3;
    opacity:0;
    perspective:900px;
    mix-blend-mode:screen;
  }
  .transition-warp-grid::before,
  .transition-warp-grid::after {
    content:"";
    position:absolute;
    inset:-18%;
    background:
      linear-gradient(90deg, rgba(137,171,235,.18) 1px, transparent 1px),
      linear-gradient(0deg, rgba(137,171,235,.12) 1px, transparent 1px);
    background-size:72px 72px;
    transform:rotateX(64deg) translate3d(0, 28vh, -120px) scale(1.35);
    transform-origin:center bottom;
    -webkit-mask-image:linear-gradient(180deg, transparent 12%, #000 44%, transparent 84%);
    mask-image:linear-gradient(180deg, transparent 12%, #000 44%, transparent 84%);
  }
  .transition-warp-grid::after {
    background-size:144px 144px;
    opacity:.42;
    transform:rotateX(68deg) translate3d(0, 16vh, -260px) scale(1.8);
  }
  .transition-portal {
    z-index:4;
    inset:50% auto auto 50%;
    width:min(52vw,760px);
    aspect-ratio:1;
    border-radius:50%;
    opacity:0;
    transform:translate3d(-50%, -50%, 0) scale(.48) rotate(-18deg);
    mix-blend-mode:screen;
  }
  .transition-portal::before,
  .transition-portal::after {
    content:"";
    position:absolute;
    inset:0;
    border-radius:50%;
    border:1px solid rgba(143,184,255,.32);
    box-shadow:
      0 0 42px rgba(109,159,255,.22),
      inset 0 0 56px rgba(109,159,255,.14);
    background:
      conic-gradient(from 40deg, transparent 0deg, rgba(143,184,255,.64) 34deg, transparent 72deg, transparent 168deg, rgba(255,255,255,.3) 190deg, transparent 232deg, transparent 360deg);
    -webkit-mask-image:radial-gradient(circle, transparent 48%, #000 50%, #000 57%, transparent 60%);
    mask-image:radial-gradient(circle, transparent 48%, #000 50%, #000 57%, transparent 60%);
  }
  .transition-portal::after {
    inset:12%;
    transform:rotate(38deg);
    opacity:.75;
    -webkit-mask-image:radial-gradient(circle, transparent 45%, #000 48%, #000 53%, transparent 56%);
    mask-image:radial-gradient(circle, transparent 45%, #000 48%, #000 53%, transparent 56%);
  }
  .transition-starburst {
    z-index:5;
    inset:-10%;
    opacity:0;
    mix-blend-mode:screen;
  }
  .transition-starburst span {
    position:absolute;
    left:50%;
    top:50%;
    width:clamp(80px,12vw,220px);
    height:1px;
    border-radius:999px;
    opacity:.72;
    background:linear-gradient(90deg, transparent, rgba(180,207,255,.94), transparent);
    box-shadow:0 0 16px rgba(118,172,255,.55);
    transform-origin:left center;
    transform:rotate(var(--a)) translateX(var(--d)) scaleX(var(--s));
  }
  .transition-starburst span:nth-child(1) { --a:-32deg; --d:12vw; --s:.7; }
  .transition-starburst span:nth-child(2) { --a:-18deg; --d:20vw; --s:1.05; }
  .transition-starburst span:nth-child(3) { --a:-4deg; --d:16vw; --s:.82; }
  .transition-starburst span:nth-child(4) { --a:11deg; --d:22vw; --s:1.16; }
  .transition-starburst span:nth-child(5) { --a:27deg; --d:13vw; --s:.72; }
  .transition-starburst span:nth-child(6) { --a:44deg; --d:19vw; --s:.92; }
  .transition-horizon {
    z-index:6;
    inset:auto -14% -10vh;
    height:58vh;
    opacity:0;
    background:
      radial-gradient(70% 130% at 50% 100%, rgba(147,186,255,.38), transparent 70%),
      linear-gradient(90deg, transparent 4%, rgba(160,200,255,.5) 50%, transparent 96%);
    filter:blur(24px);
    transform:translate3d(0, 20vh, 0) scaleX(.72);
    mix-blend-mode:screen;
  }
  .transition-seam-veil {
    z-index:6;
    inset:-12% -10%;
    opacity:0;
    background:
      linear-gradient(180deg, transparent 0%, rgba(33,53,83,.34) 17%, rgba(18,30,50,.76) 33%, rgba(12,20,34,.58) 47%, rgba(25,45,76,.62) 62%, transparent 86%),
      radial-gradient(92% 46% at 50% 32%, rgba(151,187,247,.3), transparent 72%),
      radial-gradient(84% 48% at 50% 66%, rgba(64,101,164,.26), transparent 74%);
    filter:blur(12px) saturate(1.08);
    transform:translate3d(0, 8vh, 0) scale(1.08);
  }
  .transition-seam-veil::before,
  .transition-seam-veil::after {
    content:"";
    position:absolute;
    inset:14% -8% 12%;
    background:
      linear-gradient(98deg, transparent 10%, rgba(187,213,255,.18) 34%, transparent 50%),
      linear-gradient(82deg, transparent 24%, rgba(111,159,235,.14) 52%, transparent 70%);
    filter:blur(26px);
    opacity:.78;
    mix-blend-mode:screen;
  }
  .transition-seam-veil::after {
    inset:24% -14% 28%;
    background:linear-gradient(180deg, transparent, rgba(198,219,255,.2), transparent);
    filter:blur(18px);
    opacity:.7;
  }
  .transition-nebula-dust {
    z-index:7;
    inset:-20%;
    opacity:0;
    background:
      radial-gradient(40% 44% at 24% 34%, rgba(124,169,244,.28), transparent 70%),
      radial-gradient(52% 38% at 76% 42%, rgba(185,209,255,.16), transparent 72%),
      radial-gradient(62% 44% at 48% 70%, rgba(67,103,165,.24), transparent 76%);
    filter:blur(16px) saturate(1.12);
    mix-blend-mode:screen;
    transform:translate3d(-6vw, 12vh, 0) scale(1.14);
    -webkit-mask-image:linear-gradient(180deg, transparent 3%, #000 16%, #000 80%, transparent 97%);
    mask-image:linear-gradient(180deg, transparent 3%, #000 16%, #000 80%, transparent 97%);
  }
  .transition-nebula-dust::before,
  .transition-nebula-dust::after {
    content:"";
    position:absolute;
    inset:-8%;
    background:
      radial-gradient(circle, rgba(230,239,255,.9) 0 1px, transparent 1.35px) 0 0 / 82px 68px,
      radial-gradient(circle, rgba(139,173,234,.7) 0 .85px, transparent 1.25px) 28px 20px / 124px 92px,
      radial-gradient(circle, rgba(255,255,255,.42) 0 .7px, transparent 1.15px) 44px 8px / 66px 114px;
    opacity:.56;
    filter:drop-shadow(0 0 7px rgba(139,173,234,.68));
  }
  .transition-nebula-dust::after {
    inset:4% -14%;
    opacity:.28;
    filter:blur(1px) drop-shadow(0 0 10px rgba(157,194,255,.42));
    transform:scale(1.45) rotate(3deg);
  }
  .transition-light-ribbons {
    z-index:8;
    inset:-22% -18%;
    opacity:0;
    background:
      linear-gradient(106deg, transparent 24%, rgba(150,190,255,.1) 39%, rgba(230,240,255,.3) 44%, transparent 51%),
      linear-gradient(112deg, transparent 48%, rgba(116,165,244,.22) 53%, transparent 62%),
      linear-gradient(76deg, transparent 16%, rgba(203,222,255,.16) 29%, transparent 38%);
    filter:blur(.5px);
    mix-blend-mode:screen;
    transform:translate3d(-16vw, 4vh, 0) rotate(.001deg);
    -webkit-mask-image:linear-gradient(180deg, transparent 7%, #000 21%, #000 78%, transparent 94%);
    mask-image:linear-gradient(180deg, transparent 7%, #000 21%, #000 78%, transparent 94%);
  }
  .transition-viewport-atmosphere {
    position:fixed;
    inset:0;
    z-index:8;
    pointer-events:none;
    opacity:0;
    background:
      radial-gradient(46% 34% at 50% 42%, rgba(138,176,244,.34), rgba(28,46,78,.26) 44%, transparent 70%),
      radial-gradient(130% 108% at 50% 46%, transparent 26%, rgba(5,9,16,.42) 60%, rgba(3,5,10,.9) 100%),
      linear-gradient(180deg, #05090f 0%, #0a1424 32%, #0c1c31 50%, #091320 72%, #04070d 100%);
    filter:saturate(1.05);
    transform:translate3d(0, 8vh, 0) scale(1.04);
    will-change:transform, opacity;
    contain:paint;
  }
  .transition-viewport-atmosphere::before,
  .transition-viewport-atmosphere::after {
    content:"";
    position:absolute;
    inset:-10%;
    pointer-events:none;
  }
  .transition-viewport-atmosphere::before {
    opacity:.74;
    background:
      radial-gradient(circle, rgba(235,242,255,.82) 0 .9px, transparent 1.25px) 8px 0 / 88px 74px,
      radial-gradient(circle, rgba(139,174,235,.68) 0 .8px, transparent 1.2px) 34px 28px / 132px 96px,
      radial-gradient(circle, rgba(255,255,255,.34) 0 .65px, transparent 1.05px) 52px 16px / 70px 118px;
    filter:drop-shadow(0 0 7px rgba(139,174,235,.55));
    -webkit-mask-image:linear-gradient(180deg, transparent 8%, #000 25%, #000 78%, transparent 95%);
    mask-image:linear-gradient(180deg, transparent 8%, #000 25%, #000 78%, transparent 95%);
  }
  .transition-viewport-atmosphere::after {
    opacity:.86;
    background:
      linear-gradient(180deg, rgba(157,190,244,.16), rgba(13,23,40,.56) 30%, rgba(74,112,178,.3) 68%, transparent),
      linear-gradient(102deg, transparent 18%, rgba(185,212,255,.2) 38%, transparent 54%),
      linear-gradient(82deg, transparent 38%, rgba(116,166,244,.2) 54%, transparent 70%);
    filter:blur(28px);
    mix-blend-mode:screen;
  }
  /* Cinematic focal moon — the subject the camera flies toward at the midpoint */
  .transition-moon {
    position:fixed;
    top:50%;
    left:50%;
    z-index:9;
    width:min(66vh,620px);
    aspect-ratio:1;
    pointer-events:none;
    opacity:0;
    transform:translate3d(-50%,-50%,0) scale(.2);
    will-change:transform, opacity;
  }
  /* Realistic moon image (assets/moon.png) — shared by the transition + services moons */
  .moon-img {
    width:100%;
    height:100%;
    object-fit:contain;
    display:block;
    filter:drop-shadow(0 0 60px rgba(126,170,255,.28));
  }
  .transition-service-signals {
    z-index:9;
    position:absolute;
    inset:auto clamp(24px,7vw,110px) clamp(70px,13vh,140px) auto;
    display:grid;
    gap:12px;
    width:min(360px, 34vw);
    pointer-events:none;
  }
  .transition-service-signals span {
    display:flex;
    align-items:center;
    justify-content:space-between;
    min-height:48px;
    padding:0 18px;
    border:1px solid rgba(147,186,255,.24);
    background:linear-gradient(90deg, rgba(10,18,31,.18), rgba(112,157,230,.08));
    color:#eef4ff;
    font-size:11px;
    letter-spacing:.22em;
    text-transform:uppercase;
    font-weight:800;
    opacity:0;
    transform:translate3d(70px, 22px, 0) scale(.92);
    filter:blur(10px);
    box-shadow:0 0 24px rgba(112,157,230,.08);
  }
  .transition-service-signals span::after {
    content:"";
    width:8px;
    height:8px;
    border-radius:50%;
    background:#8aa6e6;
    box-shadow:0 0 18px rgba(138,166,230,.8);
  }
  .services-aurora {
    position:absolute;
    z-index:1;
    inset:-18%;
    pointer-events:none;
    opacity:0;
    mix-blend-mode:screen;
    filter:blur(18px);
    background:
      radial-gradient(36% 48% at 26% 60%, rgba(111,165,255,.32), transparent 72%),
      radial-gradient(42% 52% at 76% 28%, rgba(194,216,255,.18), transparent 70%),
      linear-gradient(116deg, transparent 18%, rgba(126,174,255,.18) 44%, transparent 68%);
    transform:translate3d(0, 10vh, 0) scale(1.08);
  }
  .services-screen {
    --services-y:0px;
    --services-fade:1;
    --services-tilt:0deg;
    position:relative;
    min-height:100vh;
    min-height:100svh;
    overflow:clip;
    background:transparent;
    color:#f3f6fb;
    font-family:Manrope,sans-serif;
    /* Feather the whole screen's top edge so it dissolves into the transition
       (only affects rendering while the top edge is on-screen — i.e. during the entry) */
    -webkit-mask-image:linear-gradient(180deg, transparent 0, rgba(0,0,0,.6) 10vh, #000 22vh, #000 100%);
    mask-image:linear-gradient(180deg, transparent 0, rgba(0,0,0,.6) 10vh, #000 22vh, #000 100%);
  }
  /* Feathered background so the top edge dissolves into the transition (no seam) */
  .services-screen::before {
    content:"";
    position:absolute;
    inset:0;
    z-index:0;
    pointer-events:none;
    background:
      radial-gradient(80% 60% at 73% 36%, rgba(82,125,201,.22), transparent 62%),
      linear-gradient(180deg, #040609 0%, #07101a 44%, #040609 100%);
    -webkit-mask-image:linear-gradient(180deg, transparent 0, rgba(0,0,0,.5) 12vh, #000 26vh, #000 100%);
    mask-image:linear-gradient(180deg, transparent 0, rgba(0,0,0,.5) 12vh, #000 26vh, #000 100%);
  }
  .services-pin {
    position:relative;
    top:0;
    min-height:100vh;
    min-height:100svh;
    overflow:hidden;
  }
  .services-pin::before {
    content:"";
    position:absolute;
    inset:0;
    z-index:0;
    background:
      radial-gradient(86% 34% at 50% 0%, rgba(121,169,255,.16), transparent 70%),
      linear-gradient(180deg, transparent 0%, rgba(8,15,26,.18) 20%, rgba(4,6,9,.18) 70%, rgba(4,6,9,.92) 100%),
      radial-gradient(circle at 22% 46%, rgba(138,166,230,.11), transparent 34%);
    pointer-events:none;
  }
  .services-pin::after {
    content:"";
    position:absolute;
    inset:0;
    z-index:1;
    opacity:calc(.12 + var(--services-fade) * .22);
    background:linear-gradient(90deg, transparent, rgba(133,181,255,.16), transparent);
    transform:translate3d(calc(-34% + var(--services-fade) * 52%), 0, 0);
    pointer-events:none;
  }
  .services-moon {
    position:absolute;
    z-index:0;
    top:50%;
    right:-13vw;
    width:min(76vw,1080px);
    aspect-ratio:1;
    transform:translate3d(0, calc(-50% + var(--services-y)), 0) rotate(var(--services-tilt));
    overflow:visible;
    opacity:.82;
    pointer-events:none;
    will-change:transform;
  }
  .services-moon .moon-img {
    filter:drop-shadow(0 0 90px rgba(119,170,255,.30));
  }
  .services-content {
    position:relative;
    z-index:2;
    width:100%;
    max-width:1600px;
    min-height:100vh;
    margin:0 auto;
    padding:clamp(90px,10vh,120px) clamp(28px,4.5vw,68px);
    display:grid;
    grid-template-columns:minmax(0, .92fr) minmax(360px, .58fr);
    gap:clamp(38px,5vw,90px);
    align-items:center;
  }
  .services-copy {
    max-width:710px;
    transform:translate3d(0, calc(var(--services-y) * -.22), 0);
    will-change:transform;
  }
  .services-kicker {
    display:flex;
    align-items:center;
    gap:16px;
    color:#8aa6e6;
    font-size:12px;
    letter-spacing:.24em;
    text-transform:uppercase;
    font-weight:700;
  }
  .services-kicker::before {
    content:"";
    width:48px;
    height:1px;
    background:#7b9be0;
    box-shadow:0 0 14px rgba(123,155,224,.72);
  }
  .services-title {
    margin-top:26px;
    font-family:Sora,sans-serif;
    font-size:clamp(48px,5.2vw,86px);
    line-height:1.03;
    max-width:10ch;
    color:#f4f6fb;
  }
  .services-title span { color:#8aa6e6; }
  .services-lede {
    margin-top:28px;
    max-width:560px;
    font-size:clamp(16px,1.18vw,19px);
    line-height:1.72;
    color:#b4bece;
    text-shadow:0 1px 16px rgba(4,7,14,.6);
  }
  .services-progress {
    margin-top:42px;
    display:flex;
    align-items:center;
    gap:18px;
    color:#6f7b90;
    font-size:11px;
    letter-spacing:.18em;
    text-transform:uppercase;
    font-weight:700;
  }
  .services-progress span {
    width:120px;
    height:1px;
    background:linear-gradient(90deg, #8aa6e6, rgba(138,166,230,.1));
    transform:scaleX(calc(.22 + var(--services-fade) * .78));
    transform-origin:left center;
    box-shadow:0 0 18px rgba(138,166,230,.35);
  }
  .services-list {
    display:grid;
    gap:14px;
    transform:translate3d(0, calc(var(--services-y) * .18), 0);
    will-change:transform;
  }
  .service-card {
    position:relative;
    display:grid;
    grid-template-columns:auto 1fr;
    gap:20px;
    align-items:start;
    min-height:120px;
    padding:22px 24px;
    border:1px solid rgba(176,206,246,.16);
    border-radius:12px;
    background:linear-gradient(135deg, rgba(13,18,28,.72), rgba(7,11,18,.44));
    box-shadow:inset 0 0 34px rgba(127,168,255,.035);
    backdrop-filter:blur(10px);
    transform:translate3d(calc((1 - var(--services-fade)) * 12px), 0, 0);
    opacity:calc(.9 + var(--services-fade) * .1);
    transition:border-color .3s ease, box-shadow .3s ease, background .3s ease;
    overflow:hidden;
  }
  /* left accent bar that lights up on hover */
  .service-card::after {
    content:"";
    position:absolute;
    left:0;
    top:14%;
    bottom:14%;
    width:2px;
    border-radius:2px;
    background:linear-gradient(180deg, transparent, #8aa6e6, transparent);
    opacity:0;
    transform:scaleY(.4);
    transform-origin:center;
    transition:opacity .3s ease, transform .3s ease;
    pointer-events:none;
  }
  .service-card::before {
    content:"";
    position:absolute;
    inset:0;
    border-radius:inherit;
    background:linear-gradient(100deg, rgba(124,165,235,.14), transparent 46%);
    opacity:0;
    transition:opacity .3s ease;
    pointer-events:none;
  }
  .service-card:hover::before { opacity:1; }
  .service-card:hover::after { opacity:1; transform:scaleY(1); }
  .service-card:hover {
    border-color:rgba(138,166,230,.5);
    box-shadow:inset 0 0 34px rgba(127,168,255,.06), 0 18px 46px -22px rgba(90,130,220,.55);
    background:linear-gradient(135deg, rgba(17,24,38,.82), rgba(9,14,23,.5));
  }
  /* Icon medallion — swap the inline <svg> for an <img> here to use a real photo */
  .service-icon {
    position:relative;
    width:52px;
    height:52px;
    flex:none;
    display:grid;
    place-items:center;
    border-radius:12px;
    color:#9cb6f0;
    border:1px solid rgba(138,166,230,.34);
    background:
      radial-gradient(120% 120% at 30% 20%, rgba(124,165,235,.22), transparent 60%),
      linear-gradient(160deg, rgba(20,30,50,.9), rgba(8,13,22,.9));
    box-shadow:0 0 22px rgba(138,166,230,.14), inset 0 1px 0 rgba(255,255,255,.05);
    transition:color .3s ease, border-color .3s ease, box-shadow .3s ease, transform .3s ease;
  }
  .service-icon svg { width:24px; height:24px; }
  .service-card:hover .service-icon {
    color:#dbe6ff;
    border-color:rgba(158,186,250,.7);
    box-shadow:0 0 30px rgba(138,166,230,.34), inset 0 1px 0 rgba(255,255,255,.08);
    transform:translateY(-1px);
  }
  .service-card-body { min-width:0; }
  .service-head {
    display:flex;
    align-items:baseline;
    justify-content:space-between;
    gap:12px;
  }
  .service-card h3 {
    font-family:Sora,sans-serif;
    font-size:clamp(18px,1.6vw,24px);
    line-height:1.18;
    color:#ffffff;
    letter-spacing:0;
  }
  .service-index {
    flex:none;
    font-size:12px;
    font-weight:800;
    letter-spacing:.14em;
    color:#5f6f8c;
    font-family:Sora,sans-serif;
  }
  .service-card:hover .service-index { color:#8aa6e6; }
  .service-card p {
    margin-top:10px;
    color:#aab5c8;
    font-size:14px;
    line-height:1.62;
  }
  .service-orbit {
    position:absolute;
    z-index:1;
    right:7vw;
    top:24vh;
    width:13px;
    height:13px;
    border-radius:50%;
    background:#8aa6e6;
    box-shadow:0 0 18px 3px rgba(138,166,230,.58);
    animation:servicePulse 2.8s ease-in-out infinite;
  }
  .contact-screen {
    --contact-x:0px;
    --contact-y:0px;
    --contact-tilt-x:0deg;
    --contact-tilt-y:0deg;
    --spot-x:64%;
    --spot-y:34%;
    min-height:100vh;
    position:relative;
    overflow:hidden;
    background:#020407;
    color:#f5f7fb;
    font-family:Manrope,sans-serif;
  }
  .contact-screen::after {
    content:"";
    position:absolute;
    inset:-3.5%;
    z-index:0;
    background:url("../assets/letstalk.png") center center / cover no-repeat;
    transform-origin:34% 50%;
    transform:translate3d(calc(var(--contact-x) * -1), calc(var(--contact-y) * -.7), 0) scale(1.035);
    will-change:transform;
    backface-visibility:hidden;
    opacity:.98;
  }
  .contact-screen::before {
    content:"";
    position:absolute;
    inset:0;
    z-index:1;
    background:
      radial-gradient(circle at var(--spot-x) var(--spot-y), rgba(135,180,255,.17) 0%, rgba(135,180,255,.075) 18%, transparent 38%),
      linear-gradient(90deg, rgba(0,0,0,.08) 0%, rgba(0,0,0,.08) 46%, rgba(0,0,0,.54) 100%),
      linear-gradient(180deg, rgba(0,0,0,.34) 0%, rgba(0,0,0,.02) 24%, rgba(0,0,0,.5) 100%);
    pointer-events:none;
  }
  .contact-orbit {
    position:absolute;
    z-index:1;
    inset:auto auto 8% 7%;
    width:34vw;
    max-width:580px;
    aspect-ratio:1;
    border:1px solid rgba(135,178,245,.12);
    border-radius:50%;
    transform:translate3d(calc(var(--contact-x) * .42), calc(var(--contact-y) * .32), 0);
    pointer-events:none;
    opacity:.65;
  }
  .contact-orbit::before,
  .contact-orbit::after {
    content:"";
    position:absolute;
    border-radius:50%;
    border:1px solid rgba(135,178,245,.1);
  }
  .contact-orbit::before { inset:12%; }
  .contact-orbit::after { inset:32%; box-shadow:0 0 34px rgba(118,168,255,.08); }
  .contact-header {
    position:relative;
    z-index:3;
    display:flex;
    align-items:center;
    justify-content:space-between;
    padding:29px 0 24px;
    gap:32px;
  }
  .contact-logo {
    height:34px;
    width:auto;
    flex:none;
  }
  .contact-nav {
    display:flex;
    align-items:center;
    gap:clamp(22px,2.6vw,44px);
    font-size:13px;
    letter-spacing:.14em;
    text-transform:uppercase;
    font-weight:600;
  }
  .contact-nav a {
    color:#aeb6c4;
    position:relative;
    transition:color .2s ease, text-shadow .2s ease;
  }
  .contact-nav a:hover {
    color:#ffffff;
    text-shadow:0 0 16px rgba(140,184,255,.5);
  }
  .contact-cta {
    border:1px solid rgba(142,185,244,.7);
    border-radius:4px;
    color:#fff;
    padding:16px 34px;
    font-size:16px;
    letter-spacing:.04em;
    text-transform:uppercase;
    font-weight:700;
    background:rgba(3,7,13,.42);
    box-shadow:inset 0 0 24px rgba(123,171,246,.06), 0 0 24px rgba(99,143,220,.12);
  }
  .contact-content {
    position:relative;
    z-index:2;
    min-height:calc(100vh - 87px);
    display:flex;
    justify-content:flex-end;
    align-items:flex-start;
    padding:clamp(22px,2.6vw,34px) clamp(42px,4.4vw,86px);
  }
  .contact-panel {
    width:min(520px, 100%);
    border:1px solid rgba(133,180,244,.55);
    border-radius:18px;
    background:linear-gradient(135deg, rgba(12,18,27,.82), rgba(7,14,21,.64));
    box-shadow:inset 0 0 36px rgba(135,183,255,.08), 0 0 36px rgba(100,160,255,.22);
    backdrop-filter:blur(14px);
    padding:30px 48px 28px;
    position:relative;
    overflow:hidden;
    animation:contactPanelIn .72s cubic-bezier(.2,.8,.2,1) both;
    transform-style:preserve-3d;
  }
  .contact-panel::before {
    content:"";
    position:absolute;
    inset:-38% -70%;
    background:linear-gradient(90deg, transparent, rgba(140,184,255,.22), transparent);
    animation:contactGlowSweep 12s ease-in-out infinite alternate;
    pointer-events:none;
  }
  .contact-panel::after {
    content:"";
    position:absolute;
    top:18px;
    right:18px;
    width:58px;
    height:2px;
    border-radius:999px;
    background:linear-gradient(90deg, transparent, rgba(135,180,255,.75), transparent);
    animation:contactSignal 3.6s ease-in-out infinite;
    pointer-events:none;
  }
  .contact-kicker {
    display:flex;
    align-items:center;
    gap:14px;
    color:#e3e9f5;
    font-size:14px;
    text-transform:uppercase;
    font-weight:500;
  }
  .contact-kicker::before {
    content:"";
    width:24px;
    height:2px;
    background:#8fb1ff;
    box-shadow:0 0 14px rgba(143,177,255,.9);
  }
  .contact-title {
    font-family:Sora,sans-serif;
    margin-top:22px;
    font-size:clamp(48px,4.4vw,68px);
    line-height:1;
    font-weight:700;
    letter-spacing:0;
    color:#ffffff;
  }
  .contact-subtitle {
    max-width:330px;
    margin-top:16px;
    font-size:19px;
    line-height:1.45;
    color:#d0d5df;
  }
  .contact-methods {
    display:flex;
    flex-direction:column;
    gap:9px;
    margin-top:18px;
  }
  .contact-method {
    position:relative;
    display:flex;
    align-items:center;
    gap:24px;
    min-height:72px;
    padding:11px 20px;
    border:1px solid rgba(176,206,246,.32);
    border-radius:10px;
    background:linear-gradient(135deg, rgba(18,28,39,.56), rgba(10,16,24,.36));
    transition:transform .22s ease, border-color .22s ease, background .22s ease, box-shadow .22s ease;
    isolation:isolate;
  }
  .contact-method::after {
    content:"";
    position:absolute;
    inset:0;
    z-index:-1;
    border-radius:inherit;
    background:linear-gradient(90deg, rgba(126,172,244,.13), transparent 42%);
    opacity:0;
    transition:opacity .22s ease;
  }
  .contact-method:hover {
    transform:translateX(-4px);
    border-color:rgba(152,195,255,.68);
    background:linear-gradient(135deg, rgba(26,40,56,.72), rgba(10,16,24,.42));
    box-shadow:0 0 22px rgba(105,158,255,.12);
  }
  .contact-method:hover::after { opacity:1; }
  .contact-icon {
    width:50px;
    height:50px;
    display:grid;
    place-items:center;
    flex:none;
    color:#f7fbff;
    filter:drop-shadow(0 0 7px rgba(129,169,255,.9));
  }
  .contact-label {
    display:block;
    color:#d7dce6;
    font-size:15px;
    margin-bottom:6px;
  }
  .contact-value {
    display:block;
    color:#fff;
    font-size:18px;
    line-height:1.22;
  }
  .contact-send {
    margin-top:18px;
    width:100%;
    min-height:64px;
    border:1px solid rgba(121,175,245,.74);
    border-radius:10px;
    background:rgba(4,9,16,.44);
    color:#ffffff;
    display:flex;
    align-items:center;
    justify-content:center;
    gap:48px;
    font-size:23px;
    font-weight:500;
    box-shadow:inset 0 0 26px rgba(137,177,255,.05);
    transition:transform .22s ease, border-color .22s ease, box-shadow .22s ease, background .22s ease;
  }
  .contact-send:hover {
    transform:translateY(-2px);
    border-color:rgba(174,211,255,.95);
    background:rgba(10,19,31,.58);
    box-shadow:0 0 26px rgba(113,171,255,.2), inset 0 0 26px rgba(137,177,255,.08);
  }
  @media (min-width: 1500px) {
    .astro-layer { top:1vh; left:59%; width:min(108vw,1760px); }
    .hero-title { font-size:clamp(56px,4.85vw,84px); }
  }
  @media (max-width: 1180px) {
    .hero-inner { padding-left:clamp(72px,7vw,100px) !important; }
    .hero-grid { margin-top:clamp(44px,8vh,84px) !important; }
    .hero-title { font-size:clamp(44px,6.4vw,68px); }
    .scroll-label { left:22px !important; }
  }
  @media (max-width: 980px) {
    .astro-layer { top:18vh; left:62%; width:96vw; opacity:.48; }
    .hero-inner {
      min-height:auto;
      padding:0 clamp(22px,5vw,46px) 34px !important;
    }
    .hero-grid { grid-template-columns:1fr !important; }
    .feature-list { display:none !important; }
    .hero-copy { max-width:680px; }
    .hero-title { font-size:clamp(42px,9.2vw,68px); max-width:11.5ch; }
    .scroll-label { display:none !important; }
    .nav-links { display:none !important; }
    .nav-cta { padding:13px 20px !important; }
    .stats-card { padding:24px clamp(22px,6vw,38px) !important; }
    .cinematic-transition { min-height:150vh; }
    .transition-home-services {
      min-height:155vh;
      margin-top:-108vh;
      margin-bottom:-72vh;
    }
    .transition-video { inset:-8%; transform:translate3d(10vw, 0, 0) scale(1.04); }
    .transition-portal { width:min(76vw,560px); }
    .transition-service-signals {
      right:clamp(22px,5vw,46px);
      bottom:clamp(54px,10vh,90px);
      width:min(320px, 42vw);
    }
    .transition-service-signals span { min-height:42px; padding:0 14px; }
    .transition-copy { left:clamp(22px,5vw,46px); bottom:clamp(54px,10vh,90px); max-width:620px; }
    .transition-copy strong { font-size:clamp(40px,10vw,72px); }
    .services-screen { min-height:auto; }
    .services-pin { position:relative; min-height:auto; }
    .services-content {
      min-height:auto;
      grid-template-columns:1fr;
      padding:86px clamp(22px,5vw,46px);
      gap:36px;
    }
    .services-title { max-width:11ch; }
    .services-lede { max-width:680px; }
    .services-moon {
      top:10vh;
      right:-30vw;
      width:112vw;
      opacity:.32;
      filter:saturate(.75) contrast(1.04) brightness(.68);
    }
    .services-copy,
    .services-list,
    .service-card {
      transform:none;
    }
    .contact-header { padding:29px 0 24px; }
    .contact-nav { display:none !important; }
    .contact-content { min-height:calc(100vh - 87px); justify-content:center; align-items:flex-end; padding:44px clamp(22px,5vw,46px); }
    .contact-panel { width:min(560px, 100%); }
  }
  @media (max-width: 640px) {
    .astro-layer { top: 20vh; left: 70%; width: 140vw; opacity: 0.25; }
    .hero-stage { min-height:auto; }
    .hero-inner { padding:0 20px 32px !important; }
    .hero-grid { margin-top:clamp(34px,8vh,58px) !important; }
    .hero-copy { max-width:100%; }
    .hero-title { font-size:clamp(40px,11vw,58px); line-height:1.15 !important; max-width:100%; }
    .hero-copy p { margin-top:22px !important; max-width:100% !important; font-size:16px !important; line-height:1.62 !important; }
    .hero-actions { width:100%; gap:18px !important; margin-top:34px !important; align-items:stretch !important; flex-direction:column; }
    .hero-primary-cta { width:100%; min-width:0; padding:18px 22px !important; text-align:center; }
    .showreel-link { width:100%; justify-content:center; }
    .hamburger-menu { display:none !important; }
    .nav-cta { display:block !important; }
    .stats-wrap { padding:0 20px 24px !important; }
    .stats-card { padding:22px !important; justify-content:flex-start !important; }
    .stats-grid { display:grid !important; grid-template-columns:repeat(2, minmax(0, 1fr)); gap:24px !important; width:100%; }
    .follow-row { width:100%; justify-content:space-between; }
    .cinematic-transition { min-height:122vh; }
    .transition-home-services {
      min-height:118vh;
      margin-top:-92vh;
      margin-bottom:-44vh;
    }
    .transition-pin { height:100vh; }
    .transition-video { opacity:.3; }
    .transition-aperture { clip-path:circle(32% at 50% 50%); }
    .transition-streaks { opacity:.36; }
    .transition-portal { width:86vw; }
    .transition-warp-grid { opacity:.24; }
    .transition-starburst span { width:120px; }
    .transition-service-signals { display:none; }
    .transition-copy { bottom:78px; }
    .transition-copy p { font-size:15px; }
    .services-content { padding:72px 20px; }
    .services-title { font-size:clamp(40px,12vw,58px); }
    .services-lede { font-size:16px; line-height:1.62; }
    .services-progress { margin-top:32px; }
    .services-moon { right:-44vw; width:136vw; opacity:.24; }
    .service-card {
      grid-template-columns:1fr;
      min-height:auto;
      padding:20px;
    }
    .service-number { width:34px; height:34px; }
    .service-orbit { display:none; }
    .contact-screen::after {
      inset:0;
      background-position:39% center;
      animation:none;
      transform:none;
      will-change:auto;
    }
    .contact-orbit { display:none; }
    .contact-screen::before { background:linear-gradient(180deg, rgba(0,0,0,.5), rgba(0,0,0,.18) 38%, rgba(0,0,0,.78)); }
    .contact-header { padding:29px 0 24px; }
    .contact-logo { height:34px; }
    .contact-nav { display:none; }
    .contact-content { min-height:auto; padding:46px 20px 34px; }
    .contact-panel { padding:28px 20px 22px; border-radius:14px; }
    .contact-title { font-size:clamp(42px,13vw,58px); }
    .contact-subtitle { font-size:17px; }
    .contact-method { min-height:74px; gap:16px; padding:12px 14px; }
    .contact-icon { width:42px; height:42px; }
    .contact-value { font-size:16px; overflow-wrap:anywhere; }
    .contact-send { min-height:64px; gap:28px; font-size:20px; }
  }
  @media (prefers-reduced-motion: reduce) {
    .cinematic-transition {
      min-height:80vh;
    }
    .transition-home-services {
      min-height:0;
      margin:0;
      display:none;
    }
    .transition-pin {
      position:relative;
      height:80vh;
    }
    .transition-layer,
    .transition-copy,
    .transition-depth-marker,
    .transition-viewport-atmosphere,
    .transition-service-signals span,
    .services-aurora {
      transform:none !important;
      transition:none !important;
      animation:none !important;
    }
    .transition-service-signals,
    .transition-viewport-atmosphere,
    .services-aurora {
      display:none;
    }
    .contact-screen::after,
    .contact-panel,
    .contact-panel::before,
    .contact-method,
    .contact-send {
      animation:none !important;
      transition:none !important;
    }
    .contact-screen::after { transform:none; }
    .contact-orbit,
    .contact-panel::after {
      display:none;
    }
  }
  @media (max-width: 420px) {
    nav { gap:18px !important; }
    nav img { height:30px !important; }
    .nav-cta { display:none !important; }
    .hero-title { font-size:clamp(38px,13.5vw,52px); }
    .stats-grid { grid-template-columns:1fr; }
  }