/* Farhan Saqib Portfolio — production stylesheet */
:root {
  --bg:#070a12;
  --surface:#0d1220;
  --surface2:#131a2a;
  --text:#f4f7ff;
  --muted:#aab4c8;
  --cyan:#39e7ff;
  --violet:#8a6cff;
  --lime:#b8ff62;
  --line:rgba(255,255,255,.11);
  --max:1200px;
  --display:'Space Grotesk',sans-serif;
  --body:'DM Sans',sans-serif;
}
* {
  box-sizing:border-box;
}
html {
  scroll-behavior:smooth;
  background:var(--bg);
}
body {
  margin:0;
  background:var(--bg);
  color:var(--text);
  font-family:var(--body);
  font-size:1rem;
  line-height:1.65;
  overflow-x:hidden;
}
body.menu-open {
  overflow:hidden;
}
::selection {
  background:var(--cyan);
  color:#071018;
}
a {
  color:inherit;
  text-decoration:none;
}
img {
  display:block;
  max-width:100%;
  height:auto;
}
button,input,textarea,select {
  font:inherit;
}
.container {
  width:min(calc(100% - 40px),var(--max));
  margin:auto;
}
.narrow {
  width:min(calc(100% - 40px),820px)!important;
}
.sr-only {
  position:absolute;
  width:1px;
  height:1px;
  padding:0;
  margin:-1px;
  overflow:hidden;
  clip:rect(0,0,0,0);
  white-space:nowrap;
  border:0;
}
.skip {
  position:fixed;
  top:8px;
  left:8px;
  z-index:9999;
  background:var(--cyan);
  color:#041018;
  padding:10px 16px;
  border-radius:8px;
  transform:translateY(-150%);
}
.skip:focus {
  transform:none;
}
.noise {
  position:fixed;
  inset:0;
  z-index:999;
  pointer-events:none;
  opacity:.028;
  background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 180 180' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.8' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
}
.cursor-glow {
  position:fixed;
  width:420px;
  height:420px;
  border-radius:50%;
  background:radial-gradient(circle,rgba(57,231,255,.09),transparent 65%);
  transform:translate(-50%,-50%);
  z-index:0;
  pointer-events:none;
  transition:opacity .3s;
}
.site-header {
  position:fixed;
  top:0;
  left:0;
  right:0;
  z-index:900;
  padding:16px 0;
  transition:.3s;
}
.site-header.scrolled {
  background:rgba(7,10,18,.86);
  backdrop-filter:blur(18px);
  border-bottom:1px solid var(--line);
  padding:10px 0;
}
.nav-wrap {
  display:flex;
  align-items:center;
  justify-content:space-between;
}
.brand {
  display:flex;
  gap:11px;
  align-items:center;
  font-family:var(--display);
  font-weight:700;
  line-height:1.1;
}
.brand small {
  display:block;
  color:var(--muted);
  font-family:var(--body);
  font-size:.67rem;
  font-weight:500;
  margin-top:4px;
  letter-spacing:.06em;
  text-transform:uppercase;
}
.brand-mark {
  display:grid;
  place-items:center;
  width:42px;
  height:42px;
  border:1px solid rgba(57,231,255,.45);
  border-radius:12px;
  color:var(--cyan);
  background:rgba(57,231,255,.06);
  font-size:.9rem;
  box-shadow:inset 0 0 20px rgba(57,231,255,.05);
}
.nav {
  display:flex;
  gap:6px;
  align-items:center;
}
.nav>a {
  padding:10px 14px;
  color:var(--muted);
  font-size:.92rem;
}
.nav>a:hover,.nav>a:focus-visible {
  color:var(--text);
}
.nav .nav-cta {
  color:var(--text);
  border:1px solid var(--line);
  border-radius:999px;
  margin-left:8px;
  padding-inline:18px;
}
.menu-toggle {
  display:none;
  background:none;
  border:0;
  width:44px;
  height:44px;
  padding:9px;
}
.menu-toggle span:not(.sr-only) {
  display:block;
  height:2px;
  background:var(--text);
  margin:6px;
}
.hero {
  position:relative;
  min-height:100vh;
  padding:128px 0 56px;
  display:grid;
  align-items:center;
  overflow:hidden;
}
.hero-grid {
  display:grid;
  grid-template-columns:1.15fr .85fr;
  align-items:center;
  gap:42px;
  position:relative;
  z-index:2;
}
.hero-copy {
  padding-top:28px;
}
.eyebrow {
  display:block;
  color:var(--cyan);
  text-transform:uppercase;
  letter-spacing:.16em;
  font-size:.75rem;
  font-weight:700;
  margin-bottom:18px;
}
.hero-title {
  font-family:var(--display);
  font-size:clamp(3.25rem,7.2vw,7.1rem);
  line-height:.91;
  letter-spacing:-.065em;
  margin:0;
  max-width:850px;
}
.hero-title span {
  display:block;
}
.outline {
  color:transparent;
  -webkit-text-stroke:1.5px rgba(244,247,255,.65);
}
.hero-lead {
  max-width:690px;
  color:var(--muted);
  font-size:clamp(1.05rem,1.5vw,1.28rem);
  margin:30px 0;
}
.hero-actions,.cta-actions {
  display:flex;
  gap:12px;
  flex-wrap:wrap;
}
.button {
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:16px;
  min-height:52px;
  padding:13px 22px;
  border-radius:999px;
  font-weight:700;
  border:1px solid transparent;
  cursor:pointer;
  transition:transform .25s,background .25s,border .25s;
}
.button:hover {
  transform:translateY(-2px);
}
.button.primary {
  background:var(--cyan);
  color:#041118;
}
.button.primary:hover {
  background:#78efff;
}
.button.ghost {
  border-color:var(--line);
  background:rgba(255,255,255,.025);
}
.button.ghost:hover {
  border-color:rgba(57,231,255,.5);
}
.hero-meta {
  display:flex;
  gap:28px;
  margin-top:45px;
  padding-top:24px;
  border-top:1px solid var(--line);
}
.hero-meta span {
  color:var(--muted);
  font-size:.78rem;
}
.hero-meta b {
  display:block;
  color:var(--text);
  font-family:var(--display);
  font-size:.95rem;
}
.hero-portrait {
  height:min(75vh,780px);
  position:relative;
  display:flex;
  justify-content:center;
  align-items:flex-end;
}
.hero-portrait img {
  position:relative;
  z-index:2;
  max-height:100%;
  width:auto;
  filter:drop-shadow(0 35px 70px rgba(0,0,0,.55));
}
.portrait-ring {
  position:absolute;
  inset:12% -8% 2%;
  border-radius:50% 50% 20% 20%;
  border:1px solid rgba(57,231,255,.22);
  background:radial-gradient(circle at 50% 35%,rgba(138,108,255,.2),transparent 40%),linear-gradient(160deg,rgba(57,231,255,.08),rgba(255,255,255,.01));
  box-shadow:inset 0 0 90px rgba(57,231,255,.05);
}
.portrait-ring:before,.portrait-ring:after {
  content:'';
  position:absolute;
  border-radius:50%;
  border:1px solid rgba(255,255,255,.1);
  inset:8%;
}
.portrait-ring:after {
  inset:18%;
  border-color:rgba(184,255,98,.12);
}
.portrait-label {
  position:absolute;
  z-index:3;
  right:-22px;
  top:16%;
  display:flex;
  align-items:center;
  gap:15px;
  background:rgba(13,18,32,.85);
  backdrop-filter:blur(12px);
  border:1px solid var(--line);
  padding:11px 15px;
  border-radius:12px;
  font-size:.72rem;
  text-transform:uppercase;
  letter-spacing:.08em;
}
.portrait-label:before {
  content:'';
  width:8px;
  height:8px;
  border-radius:50%;
  background:var(--lime);
  box-shadow:0 0 12px var(--lime);
}
.portrait-label b {
  color:var(--muted);
}
.hero-chip {
  position:absolute;
  z-index:3;
  padding:10px 14px;
  border:1px solid var(--line);
  background:rgba(7,10,18,.82);
  backdrop-filter:blur(10px);
  border-radius:999px;
  font-size:.74rem;
  font-weight:700;
}
.chip-one {
  left:-4%;
  bottom:26%;
}
.chip-two {
  right:-8%;
  bottom:9%;
}
.orb {
  position:absolute;
  border-radius:50%;
  filter:blur(4px);
  pointer-events:none;
}
.orb-a {
  width:420px;
  height:420px;
  background:radial-gradient(circle,rgba(57,231,255,.11),transparent 70%);
  left:-120px;
  top:15%;
}
.orb-b {
  width:520px;
  height:520px;
  background:radial-gradient(circle,rgba(138,108,255,.12),transparent 70%);
  right:-100px;
  bottom:-100px;
}
.scroll-cue {
  position:absolute;
  left:28px;
  bottom:34px;
  color:var(--muted);
  font-size:.7rem;
  text-transform:uppercase;
  letter-spacing:.12em;
  writing-mode:vertical-rl;
}
.scroll-cue span {
  margin-top:10px;
  color:var(--cyan);
}
.marquee {
  overflow:hidden;
  border-block:1px solid var(--line);
  background:var(--surface);
  padding:15px 0;
}
.marquee>div {
  display:flex;
  gap:28px;
  width:max-content;
  animation:marquee 66s linear infinite;
  text-transform:uppercase;
  letter-spacing:.08em;
  font-family:var(--display);
  font-size:.8rem;
}
.marquee b {
  color:var(--cyan);
}
@keyframes marquee {
to {
    transform:translateX(-50%);
  }
}
.section {
  padding:120px 0;
  position:relative;
}
.split {
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:9vw;
}
.display,.section h2,.cta-band h2 {
  font-family:var(--display);
  font-size:clamp(2.1rem,4vw,4.2rem);
  line-height:1.07;
  letter-spacing:-.045em;
  margin:0;
}
.display em,.page-hero h1 em,.contact-hero h1 em {
  font-style:normal;
  color:var(--cyan);
}
.large-copy {
  color:var(--muted);
  font-size:1.2rem;
}
.large-copy p:first-child {
  margin-top:0;
}
.text-link {
  display:inline-block;
  color:var(--text);
  font-weight:700;
  border-bottom:1px solid rgba(57,231,255,.45);
  padding-bottom:4px;
}
.section-head {
  display:flex;
  justify-content:space-between;
  align-items:end;
  gap:25px;
  margin-bottom:42px;
}
.section-head h2 {
  max-width:760px;
  font-size:clamp(2rem,3.5vw,3.5rem);
}
.service-grid {
  display:grid;
  grid-template-columns:repeat(4,1fr);
  gap:12px;
}
.service-card {
  min-height:350px;
  border:1px solid var(--line);
  background:linear-gradient(145deg,rgba(255,255,255,.035),rgba(255,255,255,.01));
  padding:26px;
  display:flex;
  flex-direction:column;
  position:relative;
  overflow:hidden;
  transition:.35s;
}
.service-card:after {
  content:'';
  position:absolute;
  width:180px;
  height:180px;
  border-radius:50%;
  background:rgba(57,231,255,.08);
  right:-100px;
  bottom:-100px;
  filter:blur(5px);
  transition:.35s;
}
.service-card:hover {
  transform:translateY(-6px);
  border-color:rgba(57,231,255,.35);
}
.service-card:hover:after {
  right:-50px;
  bottom:-50px;
}
.service-num {
  font-size:.72rem;
  color:var(--muted);
}
.service-icon {
  font-family:var(--display);
  font-size:2rem;
  color:var(--cyan);
  margin:30px 0;
}
.service-card h3 {
  font-family:var(--display);
  font-size:1.32rem;
  margin:0 0 14px;
}
.service-card p {
  color:var(--muted);
  font-size:.9rem;
  margin:0;
}
.service-card .text-link {
  margin-top:auto;
  font-size:.82rem;
  border:0;
}
.project-grid {
  display:grid;
  grid-template-columns:repeat(2,1fr);
  gap:18px;
}
.project-card {
  border:1px solid var(--line);
  background:var(--surface);
  overflow:hidden;
  transition:.35s;
}
.project-card:hover {
  transform:translateY(-5px);
  border-color:color-mix(in srgb,var(--project) 55%,transparent);
}
.project-visual {
  aspect-ratio:16/10;
  background:radial-gradient(circle at 70% 30%,color-mix(in srgb,var(--project) 28%,transparent),transparent 35%),linear-gradient(135deg,#0b1020,#151e34);
  position:relative;
  padding:28px;
  overflow:hidden;
}
.project-visual:before {
  content:'';
  position:absolute;
  inset:10%;
  border:1px solid color-mix(in srgb,var(--project) 35%,transparent);
  border-radius:50%;
  transform:rotate(-18deg);
}
.project-visual:after {
  content:'';
  position:absolute;
  width:170px;
  height:170px;
  border:1px solid color-mix(in srgb,var(--project) 50%,transparent);
  border-radius:50%;
  right:8%;
  bottom:-60px;
}
.project-index,.project-sector {
  position:relative;
  z-index:2;
  color:var(--muted);
  font-size:.72rem;
  text-transform:uppercase;
  letter-spacing:.12em;
}
.project-sector {
  float:right;
  color:var(--project);
}
.project-visual strong {
  position:absolute;
  left:28px;
  right:28px;
  bottom:25px;
  z-index:2;
  font-family:var(--display);
  font-size:clamp(2rem,4vw,4.2rem);
  line-height:.85;
  letter-spacing:-.06em;
}
.project-visual strong i {
  font-style:normal;
  color:var(--project);
}
.project-copy {
  display:flex;
  justify-content:space-between;
  align-items:center;
  padding:25px;
}
.project-copy span {
  font-size:.72rem;
  color:var(--project);
  text-transform:uppercase;
  letter-spacing:.1em;
}
.project-copy h3,.project-copy h2 {
  font-family:var(--display);
  font-size:1.35rem;
  margin:4px 0;
}
.project-copy p {
  color:var(--muted);
  margin:0;
  font-size:.9rem;
  max-width:470px;
}
.round-arrow {
  display:grid!important;
  place-items:center;
  width:48px;
  height:48px;
  border-radius:50%;
  border:1px solid var(--line);
  font-size:1.15rem!important;
  color:var(--text)!important;
}
.process {
  background:var(--surface);
}
.sticky-copy {
  align-self:start;
  position:sticky;
  top:140px;
}
.sticky-copy p {
  color:var(--muted);
  max-width:470px;
}
.process-list {
  list-style:none;
  margin:0;
  padding:0;
}
.process-list li {
  display:grid;
  grid-template-columns:70px 1fr;
  gap:20px;
  padding:30px 0;
  border-top:1px solid var(--line);
}
.process-list li>span {
  color:var(--cyan);
  font-size:.75rem;
}
.process-list h3 {
  font-family:var(--display);
  font-size:1.55rem;
  margin:0 0 8px;
}
.process-list p {
  color:var(--muted);
  margin:0;
}
.geo-section {
  overflow:hidden;
}
.geo-grid {
  display:grid;
  grid-template-columns:1fr 1fr;
  align-items:center;
  gap:10vw;
}
.geo-grid h2 {
  font-size:clamp(2.4rem,4vw,4.5rem);
}
.geo-grid p {
  color:var(--muted);
  font-size:1.1rem;
  margin-bottom:25px;
}
.geo-orbit {
  aspect-ratio:1;
  max-width:500px;
  border:1px solid var(--line);
  border-radius:50%;
  display:grid;
  place-items:center;
  position:relative;
  background:radial-gradient(circle,rgba(57,231,255,.12),transparent 60%);
}
.geo-orbit:before,.geo-orbit:after {
  content:'';
  position:absolute;
  border:1px dashed rgba(255,255,255,.12);
  border-radius:50%;
  inset:14%;
}
.geo-orbit:after {
  inset:30%;
  border-style:solid;
}
.geo-orbit>span {
  font-family:var(--display);
  font-size:4rem;
  color:var(--cyan);
}
.geo-orbit>b {
  position:absolute;
  display:grid;
  place-items:center;
  width:58px;
  height:58px;
  border-radius:50%;
  background:var(--surface2);
  border:1px solid var(--line);
  font-size:.78rem;
}
.geo-orbit>b:nth-of-type(1) {
  top:8%;
  left:46%;
}
.geo-orbit>b:nth-of-type(2) {
  right:6%;
  top:50%;
}
.geo-orbit>b:nth-of-type(3) {
  bottom:7%;
  left:38%;
}
.geo-orbit>b:nth-of-type(4) {
  left:4%;
  top:43%;
}
.accordion details {
  border-top:1px solid var(--line);
  padding:0;
}
.accordion details:last-child {
  border-bottom:1px solid var(--line);
}
.accordion summary {
  list-style:none;
  cursor:pointer;
  padding:22px 0;
  display:flex;
  justify-content:space-between;
  gap:20px;
  font-family:var(--display);
  font-size:1.05rem;
}
.accordion summary::-webkit-details-marker {
  display:none;
}
.accordion summary span {
  color:var(--cyan);
  font-size:1.4rem;
  transition:.25s;
}
.accordion details[open] summary span {
  transform:rotate(45deg);
}
.accordion details p {
  color:var(--muted);
  margin:0;
  padding:0 40px 22px 0;
}
.cta-band {
  padding:90px 0;
  background:linear-gradient(110deg,rgba(57,231,255,.14),rgba(138,108,255,.18)),var(--surface);
  border-block:1px solid var(--line);
}
.cta-band>.container {
  display:flex;
  justify-content:space-between;
  align-items:end;
  gap:35px;
}
.cta-band h2 {
  max-width:760px;
}
.cta-band p {
  color:var(--muted);
  max-width:690px;
  margin-bottom:0;
}
.site-footer {
  padding:80px 0 24px;
  background:#05070c;
}
.footer-grid {
  display:grid;
  grid-template-columns:2fr 1fr 1.4fr;
  gap:8vw;
}
.footer-grid p {
  color:var(--muted);
  max-width:430px;
}
.footer-grid h2 {
  font-family:var(--display);
  font-size:.75rem;
  text-transform:uppercase;
  letter-spacing:.13em;
  color:var(--cyan);
  margin:0 0 18px;
}
.footer-grid>div:not(:first-child) {
  display:flex;
  flex-direction:column;
  gap:9px;
}
.footer-grid>div:not(:first-child) a {
  color:var(--muted);
}
.footer-grid a:hover {
  color:var(--text);
}
.footer-bottom {
  display:flex;
  justify-content:space-between;
  color:#6f788c;
  font-size:.78rem;
  border-top:1px solid var(--line);
  padding-top:20px;
  margin-top:60px;
}
.float-wa {
  position:fixed;
  right:22px;
  bottom:22px;
  z-index:800;
  display:grid;
  place-items:center;
  width:54px;
  height:54px;
  border-radius:50%;
  background:var(--lime);
  color:#071008;
  font-weight:900;
  box-shadow:0 8px 30px rgba(184,255,98,.2);
}
.page-hero {
  padding:160px 0 100px;
  min-height:72vh;
  display:flex;
  align-items:end;
  background:radial-gradient(circle at 80% 20%,rgba(138,108,255,.14),transparent 28%);
}
.page-hero.compact {
  min-height:62vh;
}
.breadcrumb {
  display:flex;
  gap:9px;
  flex-wrap:wrap;
  color:#788297;
  font-size:.75rem;
  margin-bottom:45px;
}
.breadcrumb a:hover {
  color:var(--cyan);
}
.page-hero-grid {
  display:grid;
  grid-template-columns:1.25fr .75fr;
  gap:7vw;
  align-items:end;
}
.page-hero h1,.contact-hero h1,.project-hero h1 {
  font-family:var(--display);
  font-size:clamp(3.2rem,7vw,7rem);
  line-height:.96;
  letter-spacing:-.06em;
  margin:0;
  max-width:1050px;
}
.page-hero p {
  color:var(--muted);
  font-size:1.2rem;
  max-width:760px;
}
.portrait-card {
  position:relative;
  border:1px solid var(--line);
  padding:10px;
  background:var(--surface);
  transform:rotate(2deg);
}
.portrait-card img {
  aspect-ratio:4/5;
  object-fit:cover;
  object-position:center top;
}
.portrait-card span {
  position:absolute;
  bottom:20px;
  left:20px;
  background:rgba(7,10,18,.85);
  padding:7px 11px;
  border:1px solid var(--line);
  font-size:.72rem;
}
.value-grid {
  display:grid;
  grid-template-columns:repeat(4,1fr);
  gap:12px;
  margin-top:40px;
}
.value-grid article {
  padding:25px;
  border-top:1px solid var(--line);
  background:var(--surface);
}
.value-grid b {
  color:var(--cyan);
  font-size:.75rem;
}
.value-grid h3 {
  font-family:var(--display);
  font-size:1.28rem;
}
.value-grid p {
  color:var(--muted);
  font-size:.9rem;
}
.story {
  background:var(--surface);
}
.story-grid {
  display:grid;
  grid-template-columns:.8fr 1.2fr;
  gap:9vw;
  align-items:center;
}
.story-image {
  background:radial-gradient(circle,rgba(57,231,255,.16),transparent 60%);
  border:1px solid var(--line);
  max-height:750px;
  overflow:hidden;
}
.story-image img {
  width:100%;
  height:100%;
  object-fit:cover;
}
.story-grid>div:last-child>p {
  color:var(--muted);
  font-size:1.1rem;
}
.check-list,.line-list {
  list-style:none;
  padding:0;
  margin:26px 0;
}
.check-list li {
  padding:12px 0 12px 28px;
  border-bottom:1px solid var(--line);
  position:relative;
}
.check-list li:before {
  content:'✓';
  position:absolute;
  left:0;
  color:var(--cyan);
}
.service-row {
  display:grid;
  grid-template-columns:60px 1fr 80px 50px;
  gap:25px;
  align-items:center;
  padding:30px 0;
  border-top:1px solid var(--line);
  transition:.25s;
}
.service-row:last-child {
  border-bottom:1px solid var(--line);
}
.service-row>span {
  color:var(--muted);
  font-size:.75rem;
}
.service-row h2 {
  font-size:clamp(1.5rem,3vw,3rem);
  margin:0;
}
.service-row p {
  color:var(--muted);
  margin:4px 0;
  max-width:700px;
}
.service-row>b {
  font-family:var(--display);
  font-size:2rem;
  color:var(--cyan);
}
.service-row>i {
  display:grid;
  place-items:center;
  width:44px;
  height:44px;
  border-radius:50%;
  border:1px solid var(--line);
  font-style:normal;
}
.service-row:hover {
  padding-inline:18px;
  background:var(--surface);
}
.dark-panel {
  background:var(--surface);
}
.service-hero {
  min-height:80vh;
}
.service-hero h1 {
  max-width:1000px;
}
.service-hero>div>p {
  max-width:800px;
}
.service-kicker {
  display:flex;
  align-items:center;
  gap:22px;
  margin-bottom:22px;
}
.service-kicker span {
  color:var(--muted);
}
.service-kicker b {
  font-family:var(--display);
  color:var(--cyan);
  font-size:2rem;
}
.outcome {
  padding:70px 0;
  background:var(--cyan);
  color:#041118;
}
.outcome .eyebrow {
  color:#095263;
}
.outcome p {
  font-family:var(--display);
  font-size:clamp(1.8rem,4vw,4rem);
  line-height:1.13;
  letter-spacing:-.04em;
  max-width:1100px;
  margin:0;
}
.two-panels {
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:15px;
}
.two-panels>div {
  padding:42px;
  border:1px solid var(--line);
  background:var(--surface);
}
.two-panels h2 {
  font-size:2rem;
}
.line-list li {
  padding:16px 0;
  border-bottom:1px solid var(--line);
  color:var(--muted);
}
.method {
  background:radial-gradient(circle at 85% 50%,rgba(138,108,255,.12),transparent 35%);
}
.proof-strip {
  padding:65px 0;
  border-block:1px solid var(--line);
  background:var(--surface);
}
.proof-strip .container>div {
  display:flex;
  flex-wrap:wrap;
  gap:12px;
}
.proof-strip .container>div>* {
  padding:10px 15px;
  border:1px solid var(--line);
  border-radius:999px;
}
.proof-strip a:hover {
  border-color:var(--cyan);
}
.related-grid {
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:12px;
}
.related-grid>a {
  padding:30px;
  border:1px solid var(--line);
  background:var(--surface);
}
.related-grid>a>span {
  font-size:1.8rem;
  color:var(--cyan);
}
.related-grid h3 {
  font-family:var(--display);
  font-size:1.4rem;
}
.related-grid p {
  color:var(--muted);
}
.project-hero {
  min-height:80vh;
  padding:160px 0 90px;
  display:flex;
  align-items:end;
  background:radial-gradient(circle at 75% 35%,color-mix(in srgb,var(--project) 18%,transparent),transparent 35%);
}
.project-hero h1 {
  font-size:clamp(4rem,10vw,10rem);
  color:var(--project);
}
.project-hero p {
  color:var(--muted);
  font-size:1.25rem;
  max-width:850px;
}
.project-eyebrow {
  display:flex;
  gap:20px;
  color:var(--muted);
  text-transform:uppercase;
  letter-spacing:.12em;
  font-size:.72rem;
  margin-bottom:20px;
}
.project-eyebrow b {
  color:var(--project);
}
.project-eyebrow i {
  font-style:normal;
}
.case-banner {
  padding:45px 0;
  background:var(--project);
  color:#041018;
}
.case-banner .container {
  display:flex;
  justify-content:space-between;
  align-items:center;
}
.case-banner span,.case-banner i {
  font-size:.75rem;
  text-transform:uppercase;
  letter-spacing:.12em;
  font-style:normal;
}
.case-banner strong {
  font-family:var(--display);
  font-size:clamp(2rem,5vw,5rem);
}
.case-grid {
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:14px;
}
.case-grid>div {
  border-top:1px solid var(--line);
  padding:30px 5px;
}
.case-grid h2 {
  font-size:1.6rem;
}
.case-grid p {
  color:var(--muted);
}
.case-role {
  background:var(--surface);
}
.tag-cloud {
  display:flex;
  gap:12px;
  flex-wrap:wrap;
  align-content:center;
}
.tag-cloud span {
  padding:14px 18px;
  border:1px solid var(--line);
  border-radius:999px;
}
.case-note {
  background:#05070c;
}
.case-device {
  max-width:1000px;
  margin:auto;
  border:1px solid color-mix(in srgb,var(--project) 55%,transparent);
  border-radius:18px;
  overflow:hidden;
  box-shadow:0 40px 120px rgba(0,0,0,.4);
}
.browser-bar {
  height:50px;
  background:var(--surface2);
  display:flex;
  align-items:center;
  gap:7px;
  padding:0 18px;
}
.browser-bar i {
  width:8px;
  height:8px;
  border-radius:50%;
  background:var(--muted);
  opacity:.5;
}
.browser-bar span {
  margin:auto;
  color:var(--muted);
  font-size:.72rem;
}
.device-content {
  aspect-ratio:16/8;
  display:flex;
  flex-direction:column;
  justify-content:end;
  padding:6%;
  background:radial-gradient(circle at 75% 25%,color-mix(in srgb,var(--project) 30%,transparent),transparent 34%),linear-gradient(135deg,#0b1020,#17213a);
}
.device-content span {
  color:var(--project);
  text-transform:uppercase;
  letter-spacing:.12em;
  font-size:.75rem;
}
.device-content strong {
  font-family:var(--display);
  font-size:clamp(3rem,8vw,7rem);
  line-height:.9;
  letter-spacing:-.06em;
}
.device-content p {
  color:var(--muted);
  max-width:660px;
}
.caption {
  text-align:center;
  color:var(--muted);
  font-size:.8rem;
}
.next-project {
  padding:80px 0;
}
.next-project a {
  display:flex;
  justify-content:space-between;
  align-items:center;
  border-top:1px solid var(--line);
  padding-top:25px;
  font-family:var(--display);
  font-size:clamp(2rem,5vw,5rem);
}
.next-project a:hover {
  color:var(--cyan);
}
.note {
  padding-top:0;
}
.note>.container {
  border:1px solid var(--line);
  padding:28px;
}
.note p {
  color:var(--muted);
  margin:0;
}
.article-grid {
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:14px;
}
.article-card {
  min-height:430px;
  padding:28px;
  border:1px solid var(--line);
  display:flex;
  flex-direction:column;
  background:var(--surface);
  transition:.25s;
}
.article-card:hover {
  transform:translateY(-5px);
  border-color:rgba(57,231,255,.35);
}
.article-card>span {
  color:var(--cyan);
  font-size:.72rem;
  text-transform:uppercase;
}
.article-card h2 {
  font-size:1.7rem;
  margin-top:40px;
}
.article-card p {
  color:var(--muted);
}
.article-card b {
  margin-top:auto;
  font-size:.85rem;
}
.article-hero {
  padding:170px 0 100px;
  background:radial-gradient(circle at 65% 20%,rgba(57,231,255,.13),transparent 35%);
}
.article-hero h1 {
  font-family:var(--display);
  font-size:clamp(3rem,6vw,6rem);
  line-height:.98;
  letter-spacing:-.055em;
  margin:0;
}
.article-hero>div>p {
  font-size:1.25rem;
  color:var(--muted);
}
.author {
  display:flex;
  align-items:center;
  gap:14px;
  margin-top:35px;
}
.author img {
  width:56px;
  height:56px;
  border-radius:50%;
  object-fit:cover;
}
.author span {
  font-size:.8rem;
  color:var(--muted);
}
.author b {
  display:block;
  color:var(--text);
}
.article-body {
  width:min(calc(100% - 40px),900px);
  padding:80px 0;
}
.article-body>section {
  display:grid;
  grid-template-columns:50px 1fr;
  padding:35px 0;
  border-top:1px solid var(--line);
}
.article-body>section>span {
  color:var(--cyan);
  font-size:.72rem;
}
.article-body h2 {
  font-size:2rem;
}
.article-body p {
  color:var(--muted);
  font-size:1.1rem;
}
.article-body aside {
  margin-top:45px;
  padding:35px;
  background:var(--surface);
  border:1px solid var(--line);
}
.article-body aside h2 {
  margin-top:0;
}
.contact-hero {
  padding:160px 0 100px;
  min-height:90vh;
  display:flex;
  align-items:center;
}
.contact-grid {
  display:grid;
  grid-template-columns:1.2fr .8fr;
  gap:8vw;
  align-items:center;
}
.contact-hero p {
  color:var(--muted);
  font-size:1.2rem;
  max-width:700px;
}
.contact-links {
  margin-top:40px;
}
.contact-links a {
  display:flex;
  justify-content:space-between;
  gap:15px;
  padding:16px 0;
  border-top:1px solid var(--line);
}
.contact-links a:last-child {
  border-bottom:1px solid var(--line);
}
.contact-links span {
  color:var(--muted);
  font-size:.8rem;
}
.contact-links b {
  font-size:.9rem;
}
.contact-card {
  border:1px solid var(--line);
  background:var(--surface);
  padding:10px;
}
.contact-card img {
  aspect-ratio:4/4.4;
  object-fit:cover;
  object-position:top;
}
.contact-card>div {
  display:grid;
  grid-template-columns:1fr 1fr;
  padding:18px;
  gap:6px 15px;
}
.contact-card span {
  font-size:.72rem;
  color:var(--muted);
}
.form-section {
  background:var(--surface);
}
.form-head {
  max-width:700px;
  margin-bottom:35px;
}
.form-head p {
  color:var(--muted);
}
form {
  max-width:950px;
}
.field-grid {
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:18px;
}
label {
  display:grid;
  gap:8px;
  font-size:.82rem;
  font-weight:700;
  margin-bottom:18px;
}
input,textarea,select {
  width:100%;
  border:1px solid var(--line);
  background:#080c15;
  color:var(--text);
  padding:14px 15px;
  border-radius:8px;
  outline:none;
}
input:focus,textarea:focus,select:focus {
  border-color:var(--cyan);
  box-shadow:0 0 0 3px rgba(57,231,255,.1);
}
textarea {
  resize:vertical;
}
.consent {
  grid-template-columns:22px 1fr;
  align-items:start;
  font-weight:500;
  color:var(--muted);
}
.consent input {
  width:18px;
  height:18px;
}
.form-status {
  color:var(--cyan);
}
.legal section {
  padding:25px 0;
  border-top:1px solid var(--line);
}
.legal h2 {
  font-size:1.6rem;
}
.legal p {
  color:var(--muted);
}
.not-found {
  min-height:100vh;
  display:grid;
  place-items:center;
  text-align:center;
  position:relative;
  overflow:hidden;
  padding:140px 0;
}
.not-found .container {
  position:relative;
}
.huge-404 {
  display:block;
  font-family:var(--display);
  font-size:clamp(8rem,28vw,24rem);
  line-height:.7;
  letter-spacing:-.1em;
  color:transparent;
  -webkit-text-stroke:1px rgba(57,231,255,.35);
  position:absolute;
  inset:50% auto auto 50%;
  transform:translate(-50%,-50%);
  z-index:-1;
}
.not-found h1 {
  font-family:var(--display);
  font-size:clamp(2.5rem,5vw,5rem);
  margin:0;
}
.not-found p {
  color:var(--muted);
}
.not-found .hero-actions {
  justify-content:center;
}
.reveal {
  opacity:0;
  transform:translateY(24px);
  transition:opacity .7s ease,transform .7s ease;
}
.reveal.visible {
  opacity:1;
  transform:none;
}
@media(max-width:1050px) {
.hero-grid {
    grid-template-columns:1fr .7fr;
  }
.service-grid {
    grid-template-columns:repeat(2,1fr);
  }
.value-grid {
    grid-template-columns:repeat(2,1fr);
  }
.article-grid {
    grid-template-columns:1fr 1fr;
  }
.hero-chip {
    display:none;
  }
.portrait-label {
    right:0;
  }
.case-grid {
    grid-template-columns:1fr;
  }
}
@media(max-width:900px) {
.container {
    width:min(calc(100% - 28px),var(--max));
  }
.site-header {
    padding:10px 0;
  }
.nav {
    position:fixed;
    inset:0;
    background:rgba(7,10,18,.98);
    padding:110px 25px 40px;
    display:flex;
    flex-direction:column;
    align-items:stretch;
    gap:6px;
    transform:translateX(100%);
    transition:.35s;
  }
.nav.open {
    transform:none;
  }
.nav>a {
    font-family:var(--display);
    font-size:1.5rem;
    padding:14px;
  }
.nav .nav-cta {
    margin:15px 0 0;
    text-align:center;
  }
.menu-toggle {
    display:block;
    z-index:2;
  }
.hero {
    padding-top:110px;
    min-height:auto;
  }
.hero-grid {
    grid-template-columns:1fr;
  }
.hero-title {
    font-size:clamp(3.2rem,16vw,5.6rem);
  }
.hero-portrait {
    height:560px;
  }
.hero-meta {
    gap:14px;
    flex-wrap:wrap;
  }
.scroll-cue {
    display:none;
  }
.section {
    padding:78px 0;
  }
.split,.geo-grid,.story-grid,.page-hero-grid,.two-panels,.contact-grid {
    grid-template-columns:1fr;
    gap:45px;
  }
.section-head {
    align-items:start;
    flex-direction:column;
  }
.service-grid,.project-grid,.value-grid,.related-grid,.article-grid {
    grid-template-columns:1fr;
  }
.service-card {
    min-height:300px;
  }
.project-visual strong {
    font-size:2.5rem;
  }
.sticky-copy {
    position:static;
  }
.geo-orbit {
    max-width:360px;
    margin:auto;
  }
.cta-band>.container {
    align-items:start;
    flex-direction:column;
  }
.footer-grid {
    grid-template-columns:1fr;
    gap:40px;
  }
.footer-bottom {
    flex-direction:column;
    gap:8px;
  }
.page-hero {
    padding:130px 0 75px;
    min-height:auto;
  }
.page-hero h1,.contact-hero h1 {
    font-size:clamp(3rem,14vw,5rem);
  }
.portrait-card {
    max-width:460px;
  }
.story-image {
    max-height:580px;
  }
.service-row {
    grid-template-columns:42px 1fr 34px;
    padding:24px 0;
  }
.service-row>b {
    display:none;
  }
.service-row p {
    font-size:.85rem;
  }
.two-panels>div {
    padding:28px;
  }
.case-banner .container {
    align-items:start;
    flex-direction:column;
  }
.case-banner strong {
    order:-1;
  }
.project-hero {
    min-height:74vh;
  }
.project-hero h1 {
    font-size:clamp(4rem,18vw,7rem);
  }
.case-role .split {
    gap:25px;
  }
.device-content {
    aspect-ratio:4/5;
  }
.device-content strong {
    font-size:3.5rem;
  }
.article-hero {
    padding:140px 0 70px;
  }
.contact-hero {
    padding:130px 0 80px;
  }
.contact-card {
    max-width:480px;
  }
.field-grid {
    grid-template-columns:1fr;
  }
.float-wa {
    right:14px;
    bottom:14px;
  }
.cursor-glow {
    display:none;
  }
}
@media(max-width:430px) {
.hero-portrait {
    height:470px;
  }
.service-grid {
    grid-template-columns:1fr;
  }
.hero-meta span {
    width:45%;
  }
.page-hero h1 {
    font-size:2.9rem;
  }
.project-eyebrow {
    flex-wrap:wrap;
  }
.service-row {
    grid-template-columns:34px 1fr 25px;
    gap:9px;
  }
.service-row h2 {
    font-size:1.35rem;
  }
.service-row>i {
    width:30px;
    height:30px;
  }
.contact-links a {
    flex-direction:column;
  }
.contact-card>div {
    grid-template-columns:1fr;
  }
}
@media(prefers-reduced-motion:reduce) {
html {
    scroll-behavior:auto;
  }
.marquee>div {
    animation:none;
  }
.reveal {
    opacity:1;
    transform:none;
    transition:none;
  }
.button,.project-card,.service-card {
    transition:none;
  }
.cursor-glow {
    display:none;
  }
}
@media print {
.site-header,.site-footer,.float-wa,.noise,.cursor-glow,.cta-band {
    display:none!important;
  }
body {
    background:white;
    color:#111;
  }
.section,.page-hero {
    padding:30px 0;
  }
.page-hero {
    min-height:0;
  }
.page-hero p,.large-copy,.story-grid>div:last-child>p {
    color:#333;
  }
}
/* Immersive motion and dimensional system */
.page-loader {
  position:fixed;
  inset:0;
  z-index:99999;
  display:grid;
  place-content:center;
  justify-items:center;
  gap:18px;
  background:#05070d;
  transition:opacity .7s cubic-bezier(.7,0,.2,1),visibility .7s;
}
.page-loader.loaded {
  opacity:0;
  visibility:hidden;
}
.loader-mark {
  display:grid;
  place-items:center;
  width:74px;
  height:74px;
  border:1px solid var(--cyan);
  border-radius:22px;
  color:var(--cyan);
  font:700 1.1rem var(--display);
  box-shadow:0 0 50px rgba(57,231,255,.2);
  animation:loaderFloat 1.8s ease-in-out infinite;
  position:relative;
}
.loader-mark:before {
  content:'';
  position:absolute;
  inset:-16px;
  border-radius:50%;
  border:1px solid transparent;
  border-top-color:rgba(57,231,255,.55);
  border-right-color:rgba(138,108,255,.35);
  animation:loaderSpin 1.6s linear infinite;
}
.page-loader i {
  display:block;
  width:180px;
  height:1px;
  background:rgba(255,255,255,.09);
  overflow:hidden;
  position:relative;
}
.page-loader i:after {
  content:'';
  position:absolute;
  inset:0;
  background:var(--cyan);
  transform-origin:left;
  animation:loadLine 1.35s cubic-bezier(.65,0,.35,1) infinite;
}
.page-loader b {
  font-size:.62rem;
  letter-spacing:.2em;
  color:#78849a;
}
.scroll-progress {
  position:fixed;
  left:0;
  top:0;
  width:0;
  height:2px;
  z-index:9998;
  background:linear-gradient(90deg,var(--cyan),var(--violet),var(--lime));
  box-shadow:0 0 18px var(--cyan);
}
.ambient-canvas {
  position:fixed;
  inset:0;
  width:100%;
  height:100%;
  z-index:0;
  pointer-events:none;
  opacity:.42;
}
.scanlines {
  position:fixed;
  inset:0;
  z-index:998;
  pointer-events:none;
  opacity:.025;
  background:repeating-linear-gradient(to bottom,transparent 0,transparent 3px,#fff 4px);
}
.page-transition {
  position:fixed;
  inset:0;
  z-index:9900;
  background:radial-gradient(circle at center,var(--cyan),var(--violet) 145%);
  clip-path:circle(0% at 50% 50%);
  pointer-events:none;
}
.hero-grid-floor {
  position:absolute;
  left:-15%;
  right:-15%;
  bottom:-32%;
  height:70%;
  transform:perspective(520px) rotateX(68deg);
  transform-origin:center top;
  background-image:linear-gradient(rgba(57,231,255,.15) 1px,transparent 1px),linear-gradient(90deg,rgba(57,231,255,.15) 1px,transparent 1px);
  background-size:58px 58px;
  mask-image:linear-gradient(to bottom,black,transparent 72%);
  animation:gridDrift 9s linear infinite;
}
.hero-3d {
  position:absolute;
  inset:-5% -18%;
  width:136%;
  height:110%;
  z-index:1;
  pointer-events:none;
  filter:drop-shadow(0 0 18px rgba(57,231,255,.35));
}
.portrait-ring {
  transform-style:preserve-3d;
  animation:ringBreathe 6s ease-in-out infinite;
}
.portrait-ring:before {
  animation:orbitSpin 18s linear infinite;
}
.portrait-ring:after {
  animation:orbitSpinReverse 13s linear infinite;
}
.orbit-dot {
  position:absolute;
  z-index:2;
  width:9px;
  height:9px;
  border-radius:50%;
  background:var(--lime);
  box-shadow:0 0 18px var(--lime);
  left:50%;
  top:7%;
  transform-origin:0 290px;
  animation:dotOrbit 9s linear infinite;
}
.coordinate-hud {
  position:absolute;
  z-index:4;
  left:-5%;
  top:12%;
  display:grid;
  gap:3px;
  font:600 .56rem/1.3 var(--body);
  letter-spacing:.12em;
  color:#6f8198;
}
.coordinate-hud b {
  color:var(--cyan);
}
.home-hero .hero-copy>* {
  will-change:transform;
}
.hero-title span {
  overflow:hidden;
  transform-origin:left;
}
.home.ready .hero-title span {
  animation:titleIn 1.15s cubic-bezier(.16,1,.3,1) both;
}
.home.ready .hero-title span:nth-child(2) {
  animation-delay:.11s;
}
.home.ready .hero-title span:nth-child(3) {
  animation-delay:.2s;
}
.home.ready .hero-lead {
  animation:fadeRise .9s .42s both;
}
.home.ready .hero-actions {
  animation:fadeRise .9s .53s both;
}
.home.ready .hero-meta {
  animation:fadeRise .9s .64s both;
}
.tilt-card {
  transform-style:preserve-3d;
  will-change:transform;
  transition:transform .18s ease-out,border-color .3s,box-shadow .3s!important;
}
.tilt-card>a,.tilt-card>span,.tilt-card>h3,.tilt-card>p {
  transform-style:preserve-3d;
}
.tilt-card:hover {
  box-shadow:0 28px 80px rgba(0,0,0,.35),0 0 0 1px rgba(57,231,255,.1);
  z-index:3;
}
.service-card:hover .service-icon,.service-card:hover h3 {
  transform:translateZ(34px);
}
.service-icon,.service-card h3 {
  transition:transform .25s;
}
.card-beam {
  position:absolute;
  inset:-80% -40%;
  background:linear-gradient(105deg,transparent 42%,rgba(57,231,255,.15) 49%,transparent 56%);
  transform:translateX(-60%) rotate(8deg);
  transition:transform .8s cubic-bezier(.2,.7,.2,1);
}
.service-card:hover .card-beam {
  transform:translateX(60%) rotate(8deg);
}
.project-grid-lines {
  position:absolute;
  inset:0;
  z-index:0;
  background-image:linear-gradient(color-mix(in srgb,var(--project) 15%,transparent) 1px,transparent 1px),linear-gradient(90deg,color-mix(in srgb,var(--project) 15%,transparent) 1px,transparent 1px);
  background-size:34px 34px;
  transform:perspective(500px) rotateX(58deg) scale(1.35);
  transform-origin:center bottom;
  mask-image:linear-gradient(to top,black,transparent 78%);
  animation:gridDrift 12s linear infinite;
}
.project-card:hover .project-visual:before {
  animation:projectOrbit 6s linear infinite;
}
.project-card:hover .project-visual:after {
  transform:translate3d(-18px,-18px,42px) scale(1.08);
}
.project-visual:after {
  transition:transform .45s;
  transform-style:preserve-3d;
}
.project-visual strong {
  transform:translateZ(42px);
  text-shadow:0 12px 35px rgba(0,0,0,.45);
}
.reveal {
  opacity:0;
  transform:translate3d(0,55px,0) scale(.975);
  filter:blur(9px);
  transition:opacity .9s cubic-bezier(.16,1,.3,1),transform .9s cubic-bezier(.16,1,.3,1),filter .8s;
  transition-delay:calc(var(--reveal-i,0) * .07s);
}
.reveal.visible {
  opacity:1;
  transform:none;
  filter:none;
}
.service-grid .reveal:nth-child(2),.project-grid .reveal:nth-child(2),.value-grid .reveal:nth-child(2) {
  transition-delay:.08s;
}
.service-grid .reveal:nth-child(3),.project-grid .reveal:nth-child(3),.value-grid .reveal:nth-child(3) {
  transition-delay:.16s;
}
.service-grid .reveal:nth-child(4),.project-grid .reveal:nth-child(4),.value-grid .reveal:nth-child(4) {
  transition-delay:.24s;
}
/* Scroll-scene depth: activated on the [data-scroll-scene] hook already present
   across every hero/CTA/section template. --scene is a -1..1 progress value set
   by the cinematic motion loop (or, on supporting browsers, natively by the
   scroll-timeline rule further down) as the section crosses the viewport centre.
   translate/scale are used as independent properties (not the transform
   shorthand) so this composes cleanly with each element's own keyframe
   animation instead of overriding it. */
@property --scene {
  syntax:'<number>';
  inherits:true;
  initial-value:0;
}
[data-scroll-scene] {
  --scene:0;
}
[data-scroll-scene] .orb,
[data-scroll-scene] .geo-orbit,
[data-scroll-scene] .hub-sphere,
[data-scroll-scene] .service-object,
[data-scroll-scene] .project-object,
[data-scroll-scene] .team-orbit,
[data-scroll-scene] .join-portal,
[data-scroll-scene] .cta-orbit,
[data-scroll-scene] .project-constellation {
  translate:0 calc(var(--scene,0) * -28px);
  scale:calc(1 + var(--scene,0) * .05);
}
@supports (animation-timeline:view()) {
  @media (min-width:901px) and (prefers-reduced-motion:no-preference) {
    [data-scroll-scene] {
      animation:sceneProgress 1s linear both;
      animation-timeline:view();
      animation-range:cover 0% cover 100%;
    }
  }
}
@keyframes sceneProgress {
  0% { --scene:-1; }
  50% { --scene:0; }
  100% { --scene:1; }
}
/* Velocity skew: a small, decaying skew applied to a few large media elements
   while the page is scrolling fast, driven by --vskew from the motion loop. */
.scroll-skew {
  transform:skewY(var(--vskew,0deg));
  transition:transform .3s cubic-bezier(.16,1,.3,1);
}
/* A quiet diagonal light sweep on hover, matching the .card-beam treatment
   already used on service cards, without needing any new markup. */
.project-card {
  position:relative;
}
.project-card:before {
  content:'';
  position:absolute;
  inset:-60% -20%;
  z-index:2;
  background:linear-gradient(100deg,transparent 42%,rgba(57,231,255,.10) 50%,transparent 58%);
  transform:translateX(-60%) rotate(6deg);
  transition:transform .9s cubic-bezier(.2,.7,.2,1);
  pointer-events:none;
}
.project-card:hover:before {
  transform:translateX(60%) rotate(6deg);
}
.section:before {
  content:'';
  position:absolute;
  left:0;
  top:0;
  width:0;
  height:1px;
  background:linear-gradient(90deg,var(--cyan),transparent);
  transition:width 1.4s cubic-bezier(.16,1,.3,1);
}
.section.in-view:before {
  width:65%;
}
.process-list li {
  transition:transform .45s,background .45s,padding .45s;
}
.process-list li:hover {
  transform:translateX(12px);
  background:linear-gradient(90deg,rgba(57,231,255,.06),transparent);
  padding-left:16px;
}
.geo-orbit {
  transform-style:preserve-3d;
  animation:geoFloat 7s ease-in-out infinite;
}
.geo-orbit:before {
  animation:orbitSpin 25s linear infinite;
}
.geo-orbit:after {
  animation:orbitSpinReverse 18s linear infinite;
}
.geo-orbit>b {
  animation:satellitePulse 3s ease-in-out infinite;
}
.geo-orbit>b:nth-of-type(2) {
  animation-delay:.7s;
}
.geo-orbit>b:nth-of-type(3) {
  animation-delay:1.4s;
}
.geo-orbit>b:nth-of-type(4) {
  animation-delay:2.1s;
}
.cta-band {
  overflow:hidden;
  isolation:isolate;
}
.cta-band:before {
  content:'';
  position:absolute;
  inset:-100% -20%;
  z-index:-1;
  background:conic-gradient(from 90deg,transparent,rgba(57,231,255,.16),transparent 30%);
  animation:ctaSweep 10s linear infinite;
}
.float-wa {
  animation:waPulse 2.4s ease-in-out infinite;
}
.button.primary {
  position:relative;
  overflow:hidden;
}
.button.primary:after {
  content:'';
  position:absolute;
  inset:-2px;
  background:linear-gradient(110deg,transparent 25%,rgba(255,255,255,.65),transparent 55%);
  transform:translateX(-130%);
}
.button.primary:hover:after {
  animation:buttonShine .8s;
}
.page-hero,.project-hero,.contact-hero,.article-hero {
  position:relative;
  overflow:hidden;
}
.page-hero:after,.project-hero:after,.contact-hero:after,.article-hero:after {
  content:'';
  position:absolute;
  width:42vw;
  height:42vw;
  border:1px solid rgba(57,231,255,.12);
  border-radius:50%;
  right:-14vw;
  top:-18vw;
  box-shadow:0 0 0 5vw rgba(138,108,255,.025),0 0 0 11vw rgba(57,231,255,.018);
  animation:heroHalo 18s linear infinite;
  pointer-events:none;
}
.case-device {
  transform-style:preserve-3d;
  transition:transform .2s ease-out;
}
.story-image {
  transform-style:preserve-3d;
  transition:transform .18s ease-out;
}
.story-image:after {
  content:'';
  position:absolute;
  inset:0;
  background:linear-gradient(115deg,transparent 40%,rgba(57,231,255,.15),transparent 60%);
  transform:translateX(-100%);
  animation:portraitScan 7s ease-in-out infinite;
}
.story-image {
  position:relative;
}
.magnetic {
  will-change:transform;
}
@keyframes loaderFloat {
50% {
    transform:translateY(-8px) rotate(4deg);
    box-shadow:0 12px 70px rgba(57,231,255,.3);
  }
}
@keyframes loaderSpin {
to {
    transform:rotate(360deg);
  }
}
@keyframes loadLine {
0% {
    transform:scaleX(0);
    transform-origin:left;
  }
48% {
    transform:scaleX(1);
    transform-origin:left;
  }
52% {
    transform:scaleX(1);
    transform-origin:right;
  }
100% {
    transform:scaleX(0);
    transform-origin:right;
  }
}
@keyframes gridDrift {
to {
    background-position:0 116px,116px 0;
  }
}
@keyframes orbitSpin {
to {
    transform:rotate(360deg) rotateX(58deg);
  }
}
@keyframes orbitSpinReverse {
to {
    transform:rotate(-360deg) rotateY(42deg);
  }
}
@keyframes dotOrbit {
to {
    transform:rotate(360deg) translateY(-16px);
  }
}
@keyframes ringBreathe {
50% {
    transform:scale(1.035);
    box-shadow:inset 0 0 120px rgba(57,231,255,.09),0 0 60px rgba(57,231,255,.06);
  }
}
@keyframes titleIn {
from {
    opacity:0;
    transform:translate3d(0,110%,0) rotateX(-50deg);
    filter:blur(8px);
  }
to {
    opacity:1;
    transform:none;
    filter:none;
  }
}
@keyframes fadeRise {
from {
    opacity:0;
    transform:translateY(28px);
  }
to {
    opacity:1;
    transform:none;
  }
}
@keyframes projectOrbit {
to {
    transform:rotate(342deg) scale(1.08);
  }
}
@keyframes geoFloat {
50% {
    transform:translateY(-14px) rotateX(4deg) rotateY(-4deg);
  }
}
@keyframes satellitePulse {
50% {
    box-shadow:0 0 35px rgba(57,231,255,.22);
    transform:scale(1.08);
  }
}
@keyframes ctaSweep {
to {
    transform:rotate(360deg);
  }
}
@keyframes waPulse {
50% {
    box-shadow:0 0 0 12px rgba(184,255,98,0),0 8px 35px rgba(184,255,98,.35);
    transform:translateY(-3px);
  }
}
@keyframes buttonShine {
to {
    transform:translateX(130%);
  }
}
@keyframes heroHalo {
to {
    transform:rotate(360deg);
  }
}
@keyframes portraitScan {
0%,45% {
    transform:translateX(-120%);
  }
65%,100% {
    transform:translateX(120%);
  }
}
@media(max-width:900px) {
.ambient-canvas {
    opacity:.2;
  }
.hero-grid-floor {
    bottom:-8%;
    height:40%;
  }
.hero-3d {
    inset:0 -10%;
    width:120%;
    height:100%;
    opacity:.8;
  }
.coordinate-hud {
    display:none;
  }
.orbit-dot {
    display:none;
  }
.tilt-card {
    transform:none!important;
  }
.page-loader b {
    font-size:.55rem;
  }
.scanlines {
    opacity:.018;
  }
.project-grid-lines {
    animation:none;
  }
}
@media(prefers-reduced-motion:reduce) {
.page-loader {
    display:none;
  }
.ambient-canvas,.hero-3d,.hero-grid-floor,.scanlines {
    display:none;
  }
.portrait-ring,.portrait-ring:before,.portrait-ring:after,.geo-orbit,.geo-orbit:before,.geo-orbit:after,.geo-orbit>b,.float-wa,.cta-band:before,.story-image:after {
    animation:none!important;
  }
.home.ready .hero-title span,.home.ready .hero-lead,.home.ready .hero-actions,.home.ready .hero-meta {
    animation:none!important;
  }
.reveal {
    opacity:1;
    transform:none;
    filter:none;
  }
.tilt-card,.case-device,.story-image {
    transform:none!important;
  }
}
/* Release 2: hub navigation, contextual objects, packages and responsive polish */
.portrait-label {
  top:auto;
  bottom:3%;
  right:3%;
  max-width:320px;
}
.nav-group {
  position:relative;
}
.nav-group>a {
  display:flex;
  align-items:center;
  gap:7px;
  padding:10px 14px;
  color:var(--muted);
  font-size:.92rem;
}
.nav-group>a span {
  font-size:.7rem;
  color:var(--cyan);
}
.nav-group:hover>a,.nav-group:focus-within>a {
  color:var(--text);
}
.mega-menu {
  position:absolute;
  top:calc(100% + 18px);
  left:50%;
  width:min(860px,88vw);
  display:grid;
  grid-template-columns:240px 1fr;
  gap:25px;
  padding:24px;
  background:rgba(7,10,18,.97);
  border:1px solid rgba(57,231,255,.24);
  box-shadow:0 30px 90px rgba(0,0,0,.55);
  backdrop-filter:blur(22px);
  opacity:0;
  visibility:hidden;
  transform:translate(-42%,-8px);
  transition:.25s;
  border-radius:18px;
}
.project-menu {
  width:min(760px,86vw);
  transform:translate(-52%,-8px);
}
.nav-group:hover .mega-menu,.nav-group:focus-within .mega-menu {
  opacity:1;
  visibility:visible;
  transform:translate(-42%,0);
}
.nav-group:hover .project-menu,.nav-group:focus-within .project-menu {
  transform:translate(-52%,0);
}
.mega-menu>div:first-child {
  padding:10px 15px 10px 4px;
  border-right:1px solid var(--line);
}
.mega-menu b {
  font:700 1.15rem var(--display);
}
.mega-menu p {
  color:var(--muted);
  font-size:.82rem;
}
.mega-feature {
  display:inline-flex!important;
  color:var(--cyan)!important;
  font-weight:700;
  font-size:.78rem!important;
  padding:8px 0!important;
}
.mega-links {
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:4px 14px;
}
.mega-links a {
  display:flex;
  gap:10px;
  padding:7px 8px;
  color:var(--muted);
  font-size:.78rem;
  border-radius:8px;
}
.mega-links a:hover {
  color:var(--text);
  background:rgba(57,231,255,.07);
}
.mega-links span {
  color:var(--cyan);
  font-size:.62rem;
  margin-top:2px;
}
.resume-mini {
  display:inline-flex;
  margin-top:8px;
  color:var(--cyan);
  font-weight:700;
  font-size:.78rem;
}
.site-footer {
  padding:52px 0 20px;
}
.footer-grid {
  grid-template-columns:1.8fr .8fr .9fr 1.25fr;
  gap:4vw;
}
.footer-grid p {
  font-size:.88rem;
}
.footer-grid>div:not(:first-child) {
  gap:6px;
}
.footer-grid>div:not(:first-child) a {
  font-size:.86rem;
}
.footer-bottom {
  margin-top:34px;
}
.back-to-top {
  position:fixed;
  right:20px;
  bottom:20px;
  z-index:820;
  width:58px;
  height:58px;
  border:1px solid rgba(57,231,255,.35);
  border-radius:18px;
  background:rgba(8,13,24,.88);
  color:var(--text);
  backdrop-filter:blur(14px);
  display:grid;
  place-content:center;
  justify-items:center;
  gap:0;
  cursor:pointer;
  opacity:0;
  visibility:hidden;
  transform:translateY(18px) rotate(8deg);
  transition:.3s;
  box-shadow:0 14px 45px rgba(0,0,0,.38);
}
.back-to-top.visible {
  opacity:1;
  visibility:visible;
  transform:none;
}
.back-to-top span {
  font-size:1.25rem;
  color:var(--cyan);
  line-height:1;
}
.back-to-top small {
  font-size:.5rem;
  letter-spacing:.14em;
  margin-top:3px;
}
.back-to-top:hover {
  border-color:var(--cyan);
  box-shadow:0 0 34px rgba(57,231,255,.16);
}
[data-scroll-fx] {
  --sy:0px;
  --sx:0px;
  --sr:0deg;
  transform:translate3d(var(--sx),var(--sy),0) rotate(var(--sr));
  will-change:transform;
}
.cta-orbit {
  position:absolute;
  right:8%;
  top:50%;
  width:280px;
  height:280px;
  transform:translateY(-50%);
  border:1px solid rgba(57,231,255,.14);
  border-radius:50%;
  z-index:-1;
  animation:orbitSpin 22s linear infinite;
}
.cta-orbit i {
  position:absolute;
  width:12px;
  height:12px;
  border-radius:50%;
  background:var(--cyan);
  box-shadow:0 0 20px var(--cyan);
}
.cta-orbit i:nth-child(1) {
  left:20%;
  top:5%;
}
.cta-orbit i:nth-child(2) {
  right:2%;
  top:52%;
  background:var(--violet);
}
.cta-orbit i:nth-child(3) {
  left:25%;
  bottom:4%;
  background:var(--lime);
}
.services-hub-hero,.projects-hub-hero,.team-hero,.join-hero {
  min-height:88vh;
  align-items:center;
}
.services-hub-hero>.container,.projects-hub-hero>.container,.team-hero>.container,.join-hero>.container {
  position:relative;
  z-index:2;
}
.services-hub-hero p,.projects-hub-hero p,.team-hero p,.join-hero p {
  max-width:820px;
}
.hub-sphere,.project-constellation,.team-orbit,.join-portal {
  position:absolute;
  right:5vw;
  top:17%;
  width:min(38vw,480px);
  aspect-ratio:1;
  z-index:1;
  pointer-events:none;
  transform-style:preserve-3d;
}
.hub-sphere {
  border:1px solid rgba(57,231,255,.3);
  border-radius:50%;
  background:radial-gradient(circle at 38% 35%,rgba(57,231,255,.18),transparent 55%);
  box-shadow:inset 0 0 80px rgba(57,231,255,.08),0 0 100px rgba(57,231,255,.07);
}
.hub-sphere:before,.hub-sphere:after {
  content:'';
  position:absolute;
  inset:12%;
  border:1px dashed rgba(138,108,255,.4);
  border-radius:50%;
  transform:rotateX(68deg);
}
.hub-sphere:after {
  inset:25%;
  transform:rotateY(70deg);
  border-color:rgba(184,255,98,.32);
}
.hub-sphere i {
  position:absolute;
  inset:8%;
  border-top:1px solid rgba(255,255,255,.18);
  border-radius:50%;
  animation:orbitSpin 13s linear infinite;
}
.hub-sphere i:nth-child(2) {
  inset:20%;
  animation-direction:reverse;
  animation-duration:9s;
}
.hub-sphere i:nth-child(3) {
  inset:34%;
  animation-duration:16s;
}
.hub-sphere span {
  position:absolute;
  inset:0;
  display:grid;
  place-items:center;
  font:700 clamp(1.3rem,3vw,3rem) var(--display);
  letter-spacing:.25em;
  color:var(--cyan);
}
.project-constellation i {
  position:absolute;
  width:74px;
  height:74px;
  border:1px solid rgba(57,231,255,.25);
  transform:rotate(45deg);
  background:rgba(57,231,255,.03);
  box-shadow:0 0 40px rgba(57,231,255,.08);
}
.project-constellation i:nth-child(1) {
  left:10%;
  top:12%;
}
.project-constellation i:nth-child(2) {
  right:8%;
  top:30%;
  width:105px;
  height:105px;
  border-color:rgba(138,108,255,.35);
}
.project-constellation i:nth-child(3) {
  left:35%;
  bottom:4%;
  width:135px;
  height:135px;
  border-color:rgba(184,255,98,.25);
}
.project-constellation i:nth-child(4) {
  left:42%;
  top:35%;
  width:18px;
  height:18px;
  background:var(--cyan);
  box-shadow:0 0 30px var(--cyan);
}
.project-constellation:before,.project-constellation:after {
  content:'';
  position:absolute;
  left:15%;
  right:10%;
  top:44%;
  height:1px;
  background:linear-gradient(90deg,var(--cyan),var(--violet),var(--lime));
  transform:rotate(22deg);
  opacity:.45;
}
.project-constellation:after {
  transform:rotate(-34deg);
}
.project-constellation b {
  position:absolute;
  right:30%;
  bottom:22%;
  font:700 4rem var(--display);
  color:transparent;
  -webkit-text-stroke:1px rgba(255,255,255,.22);
}
.growth-loop,.project-principles,.delivery-system,.team-capabilities {
  background:linear-gradient(180deg,#090d17,var(--surface));
}
.section-head>p {
  max-width:470px;
  color:var(--muted);
  margin:0;
}
.growth-steps {
  display:grid;
  grid-template-columns:repeat(4,1fr);
  gap:12px;
}
.growth-steps article {
  min-height:230px;
  padding:26px;
  border:1px solid var(--line);
  background:linear-gradient(145deg,rgba(255,255,255,.04),rgba(255,255,255,.01));
  position:relative;
  overflow:hidden;
}
.growth-steps article:after {
  content:'';
  position:absolute;
  width:120px;
  height:120px;
  border:1px solid rgba(57,231,255,.18);
  border-radius:50%;
  right:-55px;
  bottom:-55px;
  transition:.4s;
}
.growth-steps article:hover:after {
  right:-20px;
  bottom:-20px;
}
.growth-steps span,.service-row small {
  color:var(--cyan);
  font-size:.7rem;
  letter-spacing:.1em;
}
.growth-steps b {
  display:block;
  font:700 1.45rem var(--display);
  margin:34px 0 10px;
}
.growth-steps p {
  color:var(--muted);
  font-size:.9rem;
}
.service-row small {
  display:block;
  margin-top:10px;
}
.service-row:hover small {
  color:var(--lime);
}
.service-page {
  --accent:var(--cyan);
  --accent2:var(--violet);
}
.service-web-development {
  --accent:#39e7ff;
  --accent2:#60a5fa;
}
.service-ecommerce-development {
  --accent:#f472b6;
  --accent2:#a78bfa;
}
.service-seo {
  --accent:#b8ff62;
  --accent2:#22d3ee;
}
.service-geo-aeo {
  --accent:#a78bfa;
  --accent2:#39e7ff;
}
.service-digital-marketing {
  --accent:#fb923c;
  --accent2:#f472b6;
}
.service-social-media-management {
  --accent:#60a5fa;
  --accent2:#f472b6;
}
.service-content-organic-marketing {
  --accent:#bef264;
  --accent2:#34d399;
}
.service-graphic-design-branding {
  --accent:#f472b6;
  --accent2:#fbbf24;
}
.service-local-seo-google-business-profile {
  --accent:#34d399;
  --accent2:#22d3ee;
}
.service-website-care-performance {
  --accent:#22d3ee;
  --accent2:#60a5fa;
}
.service-analytics-conversion-optimization {
  --accent:#fbbf24;
  --accent2:#a78bfa;
}
.service-page .eyebrow,.service-page .service-kicker b {
  color:var(--accent);
}
.service-hero {
  background:radial-gradient(circle at 78% 34%,color-mix(in srgb,var(--accent) 18%,transparent),transparent 32%),radial-gradient(circle at 92% 65%,color-mix(in srgb,var(--accent2) 12%,transparent),transparent 28%);
}
.service-hero>.container {
  position:relative;
  z-index:2;
}
.service-object {
  position:absolute;
  right:7vw;
  top:22%;
  width:min(32vw,390px);
  aspect-ratio:1;
  z-index:1;
  transform-style:preserve-3d;
  filter:drop-shadow(0 24px 45px rgba(0,0,0,.45));
}
.service-object>span {
  position:absolute;
  inset:0;
  display:grid;
  place-items:center;
  font:700 clamp(3rem,8vw,7rem) var(--display);
  color:var(--accent);
  text-shadow:0 0 40px color-mix(in srgb,var(--accent) 55%,transparent);
}
.service-object i {
  position:absolute;
  inset:7%;
  border:1px solid color-mix(in srgb,var(--accent) 42%,transparent);
  transform:rotate(45deg);
  animation:serviceObjectSpin 15s linear infinite;
}
.service-object i:nth-of-type(2) {
  inset:20%;
  border-style:dashed;
  border-color:color-mix(in srgb,var(--accent2) 45%,transparent);
  animation-direction:reverse;
  animation-duration:11s;
}
.service-object i:nth-of-type(3) {
  inset:34%;
  border-radius:50%;
  animation-duration:8s;
}
.service-object b {
  position:absolute;
  right:4%;
  bottom:4%;
  font:600 .65rem var(--body);
  letter-spacing:.2em;
  color:var(--muted);
}
.service-object--ecommerce-development i,.service-object--graphic-design-branding i {
  border-radius:28% 72% 68% 32%;
}
.service-object--seo i,.service-object--content-organic-marketing i {
  border-radius:50% 10% 50% 10%;
}
.service-object--geo-aeo i {
  border-radius:50%;
  transform:rotateX(68deg);
}
.service-object--digital-marketing i,.service-object--analytics-conversion-optimization i {
  clip-path:polygon(50% 0,100% 100%,0 100%);
}
.service-object--social-media-management i {
  border-radius:50%;
  border-style:dotted;
}
.service-object--local-seo-google-business-profile i {
  border-radius:50% 50% 50% 0;
}
.service-object--website-care-performance i {
  clip-path:polygon(30% 0,70% 0,78% 23%,100% 30%,100% 70%,78% 77%,70% 100%,30% 100%,22% 77%,0 70%,0 30%,22% 23%);
}
@keyframes serviceObjectSpin {
to {
    transform:rotate(405deg);
  }
}
.growth-lens {
  background:radial-gradient(circle at 75% 45%,color-mix(in srgb,var(--accent) 10%,transparent),transparent 35%);
}
.phase-track {
  display:grid;
  grid-template-columns:repeat(4,1fr);
  gap:0;
  border-block:1px solid var(--line);
}
.phase-track article {
  min-height:210px;
  padding:30px 24px;
  border-right:1px solid var(--line);
  position:relative;
}
.phase-track article:last-child {
  border:0;
}
.phase-track span {
  color:var(--accent);
  font-size:.72rem;
}
.phase-track h3 {
  font:600 1.15rem var(--display);
  margin-top:42px;
}
.phase-track i {
  position:absolute;
  right:-5px;
  top:50%;
  width:10px;
  height:10px;
  border-radius:50%;
  background:var(--accent);
  box-shadow:0 0 18px var(--accent);
  z-index:2;
}
.pricing-section {
  background:#05070c;
}
.pricing-grid {
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:14px;
  align-items:stretch;
}
.price-card {
  padding:30px;
  border:1px solid var(--line);
  background:linear-gradient(155deg,var(--surface),#080c15);
  display:flex;
  flex-direction:column;
  min-width:0;
  position:relative;
  overflow:hidden;
}
.price-card:after {
  content:'';
  position:absolute;
  inset:auto -25% -35% 35%;
  height:210px;
  border:1px solid color-mix(in srgb,var(--accent) 30%,transparent);
  border-radius:50%;
  pointer-events:none;
}
.price-card.featured {
  border-color:color-mix(in srgb,var(--accent) 62%,transparent);
  transform:translateY(-10px);
  box-shadow:0 28px 75px color-mix(in srgb,var(--accent) 10%,transparent);
}
.price-top {
  display:flex;
  justify-content:space-between;
  color:var(--muted);
  font-size:.68rem;
  text-transform:uppercase;
  letter-spacing:.11em;
}
.price-top span {
  color:var(--accent);
}
.price-card h3 {
  font:700 1.8rem/1 var(--display);
  margin:34px 0 12px;
}
.price-card>p {
  color:var(--muted);
  min-height:76px;
}
.dual-price {
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:8px;
  margin:22px 0;
}
.dual-price>span {
  display:block;
  padding:15px 12px;
  background:rgba(255,255,255,.035);
  border:1px solid var(--line);
  font:700 1.05rem var(--display);
  overflow-wrap:anywhere;
}
.dual-price small {
  display:block;
  color:var(--muted);
  font:500 .62rem var(--body);
  margin-bottom:5px;
}
.price-card ul {
  list-style:none;
  padding:0;
  margin:0 0 28px;
}
.price-card li {
  position:relative;
  padding:9px 0 9px 20px;
  color:var(--muted);
  font-size:.84rem;
  border-bottom:1px solid rgba(255,255,255,.06);
}
.price-card li:before {
  content:'+';
  position:absolute;
  left:0;
  color:var(--accent);
}
.price-card .button {
  margin-top:auto;
  position:relative;
  z-index:2;
}
.pricing-note {
  color:var(--muted);
  font-size:.78rem;
  margin:24px 0 0;
}
.mini-case-grid {
  display:grid!important;
  grid-template-columns:repeat(3,1fr);
  gap:12px;
}
.mini-case-grid>a {
  display:block!important;
  border:1px solid var(--line)!important;
  border-radius:0!important;
  padding:24px!important;
  background:var(--surface);
}
.mini-case-grid>a>span {
  color:var(--accent);
  font-size:.68rem;
  text-transform:uppercase;
  letter-spacing:.1em;
}
.mini-case-grid h3 {
  font:600 1.35rem var(--display);
  margin:10px 0;
}
.mini-case-grid p {
  color:var(--muted);
  font-size:.85rem;
}
.mini-case-grid b {
  font-size:.76rem;
  color:var(--text);
}
.project-object {
  position:absolute;
  right:8%;
  top:18%;
  width:42%;
  height:55%;
  z-index:1;
  transform-style:preserve-3d;
  pointer-events:none;
}
.project-object i,.project-object b {
  position:absolute;
}
.project-object b {
  inset:0;
  display:grid;
  place-items:center;
  font:700 clamp(2rem,5vw,4.5rem) var(--display);
  color:var(--project);
  text-shadow:0 0 28px color-mix(in srgb,var(--project) 55%,transparent);
}
.project-object--route i {
  left:2%;
  right:2%;
  height:34%;
  border-top:2px solid var(--project);
  border-radius:50%;
  transform:rotate(-12deg);
}
.project-object--route i:nth-child(2) {
  top:24%;
  transform:rotate(18deg);
}
.project-object--route i:nth-child(3) {
  top:48%;
  transform:rotate(-25deg);
}
.project-object--nodes i {
  width:26px;
  height:26px;
  border:2px solid var(--project);
  border-radius:50%;
  box-shadow:80px 25px 0 -3px color-mix(in srgb,var(--project) 50%,transparent),40px 95px 0 -5px var(--project);
}
.project-object--nodes i:nth-child(1) {
  left:12%;
  top:10%;
}
.project-object--nodes i:nth-child(2) {
  right:28%;
  top:30%;
  transform:scale(.7);
}
.project-object--nodes i:nth-child(3) {
  left:40%;
  bottom:5%;
  transform:scale(.45);
}
.project-object--nodes:before,.project-object--nodes:after {
  content:'';
  position:absolute;
  left:20%;
  right:15%;
  top:48%;
  height:1px;
  background:var(--project);
  transform:rotate(22deg);
  opacity:.7;
}
.project-object--nodes:after {
  transform:rotate(-40deg);
}
.project-object--vessel i {
  inset:8% 20%;
  border:2px solid var(--project);
  border-radius:38% 62% 48% 52%;
  transform:rotate(18deg);
}
.project-object--vessel i:nth-child(2) {
  inset:24% 10%;
  transform:rotate(-16deg);
}
.project-object--vessel i:nth-child(3) {
  inset:35%;
  border-radius:50%;
  box-shadow:0 0 35px var(--project);
}
.project-object--neon i {
  left:15%;
  right:15%;
  top:25%;
  height:3px;
  background:var(--project);
  box-shadow:0 0 16px var(--project),0 0 38px var(--project);
  transform:rotate(-28deg);
}
.project-object--neon i:nth-child(2) {
  top:50%;
  transform:rotate(32deg);
}
.project-object--neon i:nth-child(3) {
  top:70%;
  transform:rotate(-10deg);
}
.project-object--care i:first-child {
  inset:15% 43%;
  background:var(--project);
  box-shadow:0 0 25px color-mix(in srgb,var(--project) 60%,transparent);
}
.project-object--care i:nth-child(2) {
  inset:40% 14%;
  background:var(--project);
}
.project-object--care i:nth-child(3) {
  inset:7%;
  border:1px solid var(--project);
  border-radius:50%;
  opacity:.4;
}
.project-object--trail i {
  width:55%;
  height:55%;
  left:5%;
  bottom:0;
  border-left:2px solid var(--project);
  border-top:2px solid var(--project);
  transform:rotate(45deg) skew(-8deg,-8deg);
}
.project-object--trail i:nth-child(2) {
  left:38%;
  width:42%;
  height:42%;
  opacity:.65;
}
.project-object--trail i:nth-child(3) {
  left:68%;
  width:25%;
  height:25%;
  opacity:.35;
}
.project-object--large {
  right:5vw;
  top:20%;
  width:min(38vw,520px);
  height:min(45vw,570px);
  opacity:.8;
}
.project-hero>.container {
  position:relative;
  z-index:2;
}
.project-hero--route h1,.project-hero--nodes h1,.project-hero--vessel h1,.project-hero--neon h1,.project-hero--care h1,.project-hero--trail h1 {
  max-width:880px;
}
.highlight-grid {
  display:grid;
  grid-template-columns:repeat(4,1fr);
  gap:12px;
}
.highlight-grid article {
  min-height:170px;
  border:1px solid var(--line);
  padding:24px;
  background:var(--surface);
}
.highlight-grid span {
  color:var(--project);
  font-size:.7rem;
}
.highlight-grid h3 {
  font:600 1.15rem var(--display);
  margin-top:35px;
}
.project-page .eyebrow {
  color:var(--project);
}
.case-role p {
  color:var(--muted);
}
.device-content {
  position:relative;
  overflow:hidden;
}
.device-content>.project-object {
  top:6%;
  right:5%;
  height:54%;
  opacity:.55;
}
.device-content .button {
  align-self:flex-start;
  position:relative;
  z-index:3;
}
.team-orbit {
  border:1px solid rgba(57,231,255,.25);
  border-radius:50%;
  animation:geoFloat 7s ease-in-out infinite;
}
.team-orbit:before,.team-orbit:after {
  content:'';
  position:absolute;
  inset:16%;
  border:1px dashed rgba(138,108,255,.42);
  border-radius:50%;
  transform:rotateX(65deg);
}
.team-orbit:after {
  transform:rotateY(70deg);
  inset:28%;
}
.team-orbit i {
  position:absolute;
  width:54px;
  height:54px;
  border-radius:18px;
  border:1px solid var(--line);
  background:var(--surface);
  box-shadow:0 0 35px rgba(57,231,255,.08);
}
.team-orbit i:nth-child(1) {
  left:8%;
  top:12%;
}
.team-orbit i:nth-child(2) {
  right:4%;
  top:35%;
}
.team-orbit i:nth-child(3) {
  left:16%;
  bottom:8%;
}
.team-orbit i:nth-child(4) {
  right:22%;
  bottom:0;
}
.team-orbit span {
  position:absolute;
  inset:0;
  display:grid;
  place-items:center;
  font:700 1.1rem var(--display);
  letter-spacing:.18em;
  color:var(--cyan);
}
.capability-constellation {
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:12px;
}
.capability-constellation article {
  min-height:210px;
  padding:26px;
  border:1px solid var(--line);
  position:relative;
  background:var(--surface);
  overflow:hidden;
}
.capability-constellation span {
  color:var(--cyan);
  font-size:.7rem;
}
.capability-constellation h3 {
  font:600 1.4rem var(--display);
  margin-top:48px;
  max-width:230px;
}
.capability-constellation i {
  position:absolute;
  width:130px;
  height:130px;
  border:1px solid rgba(57,231,255,.18);
  border-radius:50%;
  right:-50px;
  bottom:-50px;
}
.join-portal {
  border:1px solid rgba(184,255,98,.28);
  transform:perspective(700px) rotateY(-22deg) rotateX(10deg);
}
.join-portal:before,.join-portal:after,.join-portal i {
  content:'';
  position:absolute;
  inset:10%;
  border:1px solid rgba(184,255,98,.24);
  transform:rotate(45deg);
}
.join-portal:after {
  inset:24%;
  border-color:rgba(57,231,255,.28);
  animation:serviceObjectSpin 12s linear infinite;
}
.join-portal i {
  inset:38%;
  border-color:rgba(138,108,255,.42);
}
.join-portal span {
  position:absolute;
  inset:0;
  display:grid;
  place-items:center;
  font:700 5rem var(--display);
  color:var(--lime);
  text-shadow:0 0 30px var(--lime);
}
.application-brief {
  background:var(--surface);
}
.application-card {
  padding:36px;
  border:1px solid rgba(184,255,98,.3);
  background:#080d15;
}
.application-card>span {
  color:var(--lime);
  font-size:.68rem;
  letter-spacing:.12em;
}
.application-card h3 {
  font:600 1.5rem var(--display);
}
@media(max-width:1120px) {
.nav-group>a,.nav>a {
    padding-inline:9px;
  }
.mega-menu {
    left:auto;
    right:-180px;
    transform:translateY(-8px);
  }
.project-menu {
    right:-120px;
    transform:translateY(-8px);
  }
.nav-group:hover .mega-menu,.nav-group:focus-within .mega-menu,.nav-group:hover .project-menu,.nav-group:focus-within .project-menu {
    transform:none;
  }
.footer-grid {
    grid-template-columns:1.5fr 1fr 1fr;
  }
.footer-grid>div:last-child {
    grid-column:2/4;
  }
.service-object,.project-object--large,.hub-sphere,.project-constellation,.team-orbit,.join-portal {
    opacity:.45;
  }
.pricing-grid {
    gap:9px;
  }
.price-card {
    padding:24px 20px;
  }
.dual-price {
    grid-template-columns:1fr;
  }
.growth-steps,.highlight-grid {
    grid-template-columns:repeat(2,1fr);
  }
}
@media(max-width:900px) {
.nav {
    overflow-y:auto;
    overflow-x:hidden;
  }
.nav-group {
    width:100%;
  }
.nav-group>a {
    font:600 1.5rem var(--display);
    padding:14px;
  }
.mega-menu {
    position:static;
    width:100%;
    display:block;
    padding:0 14px 14px;
    opacity:1;
    visibility:visible;
    transform:none!important;
    background:transparent;
    border:0;
    box-shadow:none;
  }
.mega-menu>div:first-child {
    display:none;
  }
.mega-links {
    grid-template-columns:1fr 1fr;
    gap:2px 8px;
  }
.mega-links a {
    font-size:.72rem;
    padding:6px;
  }
.nav>a {
    font-size:1.35rem;
  }
.portrait-label {
    bottom:2%;
    right:2%;
    font-size:.58rem;
    max-width:235px;
  }
.services-hub-hero,.projects-hub-hero,.team-hero,.join-hero {
    min-height:auto;
  }
.hub-sphere,.project-constellation,.team-orbit,.join-portal,.service-object,.project-object--large {
    width:320px;
    right:-110px;
    top:100px;
    opacity:.25;
  }
.growth-steps,.pricing-grid,.phase-track,.highlight-grid,.capability-constellation,.mini-case-grid {
    grid-template-columns:1fr;
  }
.phase-track article {
    min-height:auto;
    border-right:0;
    border-bottom:1px solid var(--line);
  }
.phase-track article:last-child {
    border-bottom:0;
  }
.phase-track i {
    right:auto;
    left:26px;
    top:auto;
    bottom:-5px;
  }
.price-card.featured {
    transform:none;
  }
.price-card>p {
    min-height:0;
  }
.footer-grid {
    grid-template-columns:1fr 1fr;
    gap:28px 20px;
  }
.footer-grid>div:first-child {
    grid-column:1/-1;
  }
.footer-grid>div:last-child {
    grid-column:auto;
  }
.footer-bottom {
    margin-top:28px;
  }
.back-to-top {
    right:12px;
    bottom:12px;
    width:50px;
    height:50px;
  }
.project-object {
    width:55%;
    right:0;
    opacity:.7;
  }
.project-copy {
    align-items:flex-start;
  }
.project-copy .round-arrow {
    flex:0 0 44px;
  }
.cta-orbit {
    opacity:.25;
    right:-100px;
  }
.dual-price {
    grid-template-columns:1fr 1fr;
  }
}
@media(max-width:480px) {
.mega-links {
    grid-template-columns:1fr;
  }
.hero-actions .button {
    width:100%;
  }
.footer-grid {
    grid-template-columns:1fr;
  }
.footer-grid>div,.footer-grid>div:last-child {
    grid-column:1;
  }
.dual-price {
    grid-template-columns:1fr;
  }
.growth-steps {
    grid-template-columns:1fr;
  }
.project-visual {
    aspect-ratio:1/1.05;
  }
.project-object {
    width:70%;
    top:15%;
  }
.service-row small {
    font-size:.62rem;
  }
.price-card {
    padding:22px 18px;
  }
.team-orbit,.join-portal {
    display:none;
  }
}
@media(prefers-reduced-motion:reduce) {
[data-scroll-fx] {
    transform:none!important;
  }
.service-object i,.hub-sphere i,.join-portal:after,.cta-orbit {
    animation:none!important;
  }
[data-scroll-scene] {
    --scene:0!important;
  }
[data-scroll-scene] .orb,[data-scroll-scene] .geo-orbit,[data-scroll-scene] .hub-sphere,
  [data-scroll-scene] .service-object,[data-scroll-scene] .project-object,
  [data-scroll-scene] .team-orbit,[data-scroll-scene] .join-portal,
  [data-scroll-scene] .cta-orbit,[data-scroll-scene] .project-constellation {
    translate:none!important;
    scale:none!important;
  }
.scroll-skew {
    transform:none!important;
  }
.project-card:before {
    display:none!important;
  }
}
.cta-band {
  position:relative;
  contain:paint;
  overflow:hidden;
}
/* Mobile motion uses bounded light/opacity only, never page-sized transforms. */
@media (max-width:900px) {
html {
    overflow-x:clip;
    scroll-behavior:auto;
    scrollbar-gutter:stable;
  }
body {
    width:100%;
    min-width:0;
    overflow:visible;
  }
main {
    contain:paint;
    min-width:0;
  }
main *, main *::before, main *::after {
    min-width:0;
    transform-style:flat!important;
    animation:none!important;
  }
main > *, .site-footer {
    max-width:100%;
  }
.container, .narrow {
    max-width:calc(100% - 28px);
  }
h1, h2, h3, p, a, li, .breadcrumb {
    overflow-wrap:break-word;
  }
.section {
    overflow:visible;
  }
.hero, .page-hero, .project-hero, .contact-hero, .article-hero,
  .cta-band, .geo-section, .project-visual, .story-image, .case-device {
    contain:paint;
    overflow:clip;
  }
.site-header, .site-header.scrolled {
    width:100%;
    left:0;
    right:0;
    padding:10px 0;
    z-index:910;
    background:#070a12;
    border-bottom:1px solid var(--line);
    backdrop-filter:none;
    transform:none;
    transition:none;
  }
.nav-wrap {
    min-height:44px;
    gap:8px;
  }
.nav-wrap .brand {
    min-width:0;
    flex:1;
  }
.brand-mark {
    flex:0 0 42px;
  }
.brand small {
    font-size:clamp(.52rem,2.4vw,.67rem);
  }
.menu-toggle {
    display:block;
    flex:0 0 44px;
    position:relative;
  }
html.menu-open {
    overflow:hidden;
  }
.nav {
    display:none;
    position:fixed;
    inset:64px 0 0;
    width:auto;
    height:calc(100dvh - 64px);
    max-height:calc(100dvh - 64px);
    padding:12px 14px 24px;
    margin:0;
    z-index:905;
    background:#070a12;
    overflow:auto;
    overscroll-behavior:contain;
    transform:none!important;
    clip-path:none;
    transition:none;
  }
.nav.open {
    display:flex;
    flex-direction:column;
    align-items:stretch;
  }
.nav > *, .mega-menu {
    flex-shrink:0;
  }
.nav-group {
    width:100%;
  }
.mega-menu {
    position:static;
    width:100%;
    max-width:100%;
    transform:none!important;
    backdrop-filter:none;
  }
.mega-links {
    grid-template-columns:1fr;
  }
.mega-links a {
    font-size:.85rem;
    padding:9px 6px;
  }
.nav-group>a, .nav>a {
    font-size:1.25rem;
  }
.page-loader, .page-transition, .ambient-canvas, .cursor-glow, .noise,
  .scanlines, .hero-3d, .hero-grid-floor, .card-beam, .scroll-progress,
  .orbit-dot, .cta-orbit, .orb, .back-to-top {
    display:none!important;
  }
[data-scroll-fx], [data-parallax], .tilt-card, .case-device,
  .story-image, .portrait-card, .hero-copy > *, .hero-title span {
    transform:none!important;
    filter:none!important;
    will-change:auto!important;
  }
.reveal {
    transform:translateY(16px);
    filter:none!important;
    transition:opacity .55s cubic-bezier(.16,1,.3,1),transform .55s cubic-bezier(.16,1,.3,1)!important;
  }
.reveal.visible {
    opacity:1;
    transform:none;
  }
.section::before, .story-image::after, .button::after, .project-card:before {
    display:none;
  }
.hero {
    background:radial-gradient(ellipse at 80% 25%,rgba(57,231,255,.10),transparent 60%);
  }
.hero-grid {
    grid-template-columns:minmax(0,1fr);
  }
.hero-title {
    font-size:clamp(2.8rem,14vw,5.6rem);
  }
.hero-portrait {
    width:100%;
    height:470px;
    contain:paint;
    overflow:clip;
  }
.hero-portrait img {
    max-width:100%;
    object-fit:contain;
  }
.portrait-ring {
    inset:8% 2% 0;
    transform:none;
  }
.portrait-label {
    left:50%;
    right:auto;
    bottom:3%;
    transform:translateX(-50%);
    width:max-content;
    max-width:95%;
  }
.portrait-label b {
    display:none;
  }
.marquee {
    contain:paint;
  }
.marquee > div {
    width:100%;
    flex-wrap:wrap;
    justify-content:center;
    gap:10px 18px;
    padding:0 14px;
    transform:none;
  }
.marquee > div > div[aria-hidden] {
    display:none!important;
  }
.marquee b {
    display:none;
  }
.geo-grid {
    gap:28px;
  }
.geo-orbit {
    width:260px;
    max-width:100%;
    height:260px;
    margin:0 auto;
    transform:none;
  }
.geo-orbit>b {
    width:48px;
    height:48px;
  }
.geo-orbit>span {
    font-size:3rem;
  }
.geo-orbit>b:nth-of-type(1) {
    top:0;
    left:calc(50% - 24px);
  }
.geo-orbit>b:nth-of-type(2) {
    right:0;
    top:calc(50% - 24px);
  }
.geo-orbit>b:nth-of-type(3) {
    bottom:0;
    left:calc(50% - 24px);
  }
.geo-orbit>b:nth-of-type(4) {
    left:0;
    top:calc(50% - 24px);
  }
.cta-band::before {
    inset:0;
    width:auto;
    height:auto;
    transform:none;
    background:radial-gradient(ellipse at 20% 50%,rgba(57,231,255,.22),transparent 70%);
  }
.portrait-ring, .cta-band::before {
    animation:mobile-light 6s ease-in-out infinite alternate!important;
  }
.service-object, .hub-sphere, .project-constellation, .team-orbit, .join-portal {
    max-width:70%;
  }
.project-grid-lines {
    transform:none;
    inset:0;
  }
.project-visual strong {
    transform:none;
  }
.site-footer {
    padding:40px 0 20px;
  }
.footer-grid {
    gap:24px;
  }
.footer-grid > div {
    min-width:0;
  }
.footer-grid a {
    overflow-wrap:anywhere;
  }
.footer-bottom {
    margin-top:24px;
  }
}
@keyframes mobile-light {
from {
    opacity:.55;
  }
to {
    opacity:1;
  }
}
@media (max-width:900px) and (prefers-reduced-motion:reduce) {
.portrait-ring, .cta-band::before {
    animation:none!important;
  }
.reveal {
    opacity:1!important;
    transform:none!important;
    transition:none!important;
  }
}