/* Brand and portfolio refinements */
.site-loader { position:fixed; inset:0; z-index:200; display:flex; flex-direction:column; align-items:center; justify-content:center; background:radial-gradient(ellipse at 50% 48%,#142243 0%,#071126 55%); opacity:1; transition:opacity .65s ease,visibility .65s ease; pointer-events:none; }
.site-loader[hidden] { display:none; }
.site-loader.is-finished { opacity:0; visibility:hidden; }
.loader-brand { width:clamp(260px,52vw,440px); max-width:calc(100vw - 48px); mix-blend-mode:lighten; animation:loader-float 3.2s ease-in-out infinite; }
.loader-brand img { display:block; width:100%; height:auto; }
.loader-brand img, body .brand img {
  border:0;
  outline:0;
  box-shadow:none;
  /* Feather the original artwork's perimeter and its stray edge glow. */
  -webkit-mask-image:linear-gradient(to right,transparent,#000 2%,#000 97%,transparent 99%),linear-gradient(to bottom,transparent,#000 3%,#000 88%,transparent 97%);
  mask-image:linear-gradient(to right,transparent,#000 2%,#000 97%,transparent 99%),linear-gradient(to bottom,transparent,#000 3%,#000 88%,transparent 97%);
  -webkit-mask-composite:source-in;
  mask-composite:intersect;
}
.loader-shadow { width:160px; height:12px; margin:22px 0 27px; background:#428aff55; filter:blur(9px); border-radius:50%; animation:loader-shadow 3.2s ease-in-out infinite; }
.loader-track { display:block; width:112px; height:2px; overflow:hidden; border-radius:2px; background:#283b60; }
.loader-track span { display:block; width:50%; height:100%; background:linear-gradient(90deg,#17b9ff,#b846ff); animation:loader-sweep 1.8s ease-in-out infinite; }
.loader-label { margin-top:18px; color:#a9bbda; font:10px/1.5 'DM Mono',monospace; letter-spacing:.1em; text-transform:uppercase; }
@keyframes loader-float { 0%,100% { transform:translateY(0); } 50% { transform:translateY(-12px); } }
@keyframes loader-shadow { 0%,100% { transform:scaleX(1); opacity:.6; } 50% { transform:scaleX(.7); opacity:.3; } }
@keyframes loader-sweep { 0% { transform:translateX(-110%); } 100% { transform:translateX(220%); } }
html { scroll-padding-top:24px; }
body .hero { min-height:710px; }
body h1 { font-size:clamp(46px,5.6vw,73px); line-height:1.08; letter-spacing:-.055em; }
body .hero-grid { gap:52px; }
body .hero-copy { font-size:17px; }
body .console { transform:none; }
body .nav { background:#071126; isolation:isolate; }
body .brand { width:178px; height:auto; min-height:52px; overflow:visible; mix-blend-mode:lighten; }
body .brand img { width:178px; height:auto; }
body .nav-cta { background:#dceaff; }
body .service.core { background:#0e1c39; color:white; border-color:#1d3156; }
body .service.core p { color:#b4c2da; }
body .service.core .icon { background:#203253; color:#82d3ff; }
body .icon { margin-bottom:28px; }
body .service.other { min-height:255px; }
body .section-heading { grid-template-columns:1.18fr .82fr; }
body .section-heading p:not(.eyebrow) { line-height:1.8; }
.portfolio { background:#09142c; }
.portfolio .section-heading p:not(.eyebrow) { color:#a9bad4; }
.project-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:22px; }
.project-card { overflow:hidden; border:1px solid #263653; border-radius:14px; background:#101f3b; transition:transform .2s,border-color .2s; }
.project-card:hover { transform:translateY(-5px); border-color:#5577a5; }
.project-art { height:270px; position:relative; overflow:hidden; padding:23px; display:flex; flex-direction:column; justify-content:space-between; }
.jatra { background:radial-gradient(ellipse at 70% 80%,#277f62,transparent 65%),#102e29; }
.uniride { background:radial-gradient(ellipse at 75% 80%,#4752b7,transparent 70%),#202451; }
.oneportal { background:radial-gradient(ellipse at 70% 80%,#236396,transparent 65%),#142c48; }
.art-label { position:relative; z-index:2; font:10px 'DM Mono',monospace; letter-spacing:.12em; color:#c4dded; }
.project-monogram { position:relative; z-index:2; align-self:center; font-size:110px; line-height:1; font-weight:800; letter-spacing:-.12em; color:#efffff; }
.project-monogram span { font-size:46px; vertical-align:top; display:inline-block; padding-top:13px; }
.art-caption { position:relative; z-index:2; font-size:12px; color:#d6e7ee; }
.route { position:absolute; border:1px solid #86ecc75c; width:240px; height:260px; border-radius:55px; transform:rotate(35deg); top:70px; left:95px; }
.route i { position:absolute; width:12px; height:12px; background:#a0efce; border:3px solid #286c55; border-radius:50%; left:-6px; top:45px; }.route i:nth-child(2){left:auto;right:-6px;top:130px}.route i:nth-child(3){left:100px;top:-6px}
.community-orbit { position:absolute; width:235px; height:235px; border:1px solid #929dfb66; border-radius:50%; top:60px; left:90px; box-shadow:0 0 0 35px #9ca3ff0c,0 0 0 70px #9ca3ff08; }.community-orbit i { position:absolute; width:16px; height:16px; border-radius:50%; background:#a7b0ff; top:30px; left:22px; }.community-orbit i:nth-child(2){top:170px;left:8px}.community-orbit i:nth-child(3){top:6px;left:165px}
.portal-stack { position:absolute; inset:67px 26px 40px 80px; transform:rotate(-12deg); }.portal-stack i { position:absolute; inset:0; border:1px solid #8ac5f880; border-radius:13px; background:#73a8e510; }.portal-stack i:nth-child(2){transform:translate(15px,18px)}.portal-stack i:nth-child(3){transform:translate(30px,36px)}
.project-body { padding:25px; }.project-category { font:10px 'DM Mono',monospace; text-transform:uppercase; letter-spacing:.08em; color:#8faaca; }.project-body h3 { font-size:27px; letter-spacing:-.04em; margin:12px 0; }.project-body p { color:#b0c0d8; font-size:14px; line-height:1.8; min-height:100px; margin:0 0 23px; }.project-body a { display:flex; justify-content:space-between; border-top:1px solid #2c3b56; padding-top:19px; font-size:12px; font-weight:700; }.project-body a:hover { color:#81d5ff; }
.portfolio-note { text-align:center; color:#8fa5c5; font-size:13px; margin:35px 0 0; }.portfolio-note a { color:#d6eaff; }
.web-studio { background:#edf3fc; color:#0c1932; }.studio-grid { display:grid; grid-template-columns:1fr 1fr; gap:85px; }.web-studio .eyebrow { color:#49629b; }.web-studio h2 { font-size:clamp(34px,4.1vw,52px); letter-spacing:-.055em; line-height:1.12; margin:0 0 24px; }.web-studio p { color:#5a6d8a; font-size:15px; line-height:1.8; }.web-studio .button { margin-top:21px; }.studio-list article { display:flex; gap:21px; border-bottom:1px solid #cbd8ec; padding:22px 0; }.studio-list article:first-child { border-top:1px solid #cbd8ec; }.studio-list article>span { font:12px 'DM Mono',monospace; color:#5b5bd0; padding-top:4px; }.studio-list h3 { margin:0 0 7px; font-size:17px; letter-spacing:-.025em; }.studio-list p { font-size:13px; margin:0; }
a:focus-visible,button:focus-visible { outline:3px solid #52c8ff; outline-offset:5px; }
@media(max-width:1000px){.project-grid{gap:14px}.project-body{padding:20px}.project-art{height:235px}.project-body p{min-height:125px}.studio-grid{gap:40px}}
@media(max-width:850px){body .section-heading{grid-template-columns:1fr}body .hero{min-height:unset}.project-grid{grid-template-columns:1fr}.project-card{display:grid;grid-template-columns:1fr 1.2fr}.project-art{height:100%;min-height:285px}.project-body p{min-height:unset}.studio-grid{grid-template-columns:1fr}.marquee .shell{flex-wrap:wrap;padding:20px 0;gap:15px}.marquee .bar{display:none}body .hero-grid{gap:45px}}
@media(max-width:520px){.project-card{display:block}.project-art{height:240px;min-height:unset}.project-body p{min-height:unset}body h1{font-size:43px}body .pill{font-size:9px}.portfolio-note{text-align:left}.studio-grid{gap:30px}.project-monogram{font-size:100px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*{transition:none!important}}

/* A calm motion system: entrances, flowing accents, and responsive surfaces. */
.scroll-progress { position:fixed; top:0; left:0; width:100%; height:3px; z-index:100; pointer-events:none; background:linear-gradient(90deg,#17b9ff,#8b40ff,#e344ed); transform-origin:left; transform:scaleX(0); }
.motion-enabled .hero h1 em { background-size:200% 100%; animation:color-flow 9s ease-in-out infinite alternate; }
.motion-enabled .hero .pill { animation:arrive .7s both; }
.motion-enabled .hero h1 { animation:arrive .9s .08s both; }
.motion-enabled .hero-copy { animation:arrive .9s .18s both; }
.motion-enabled .hero-actions { animation:arrive .9s .25s both; }
.motion-enabled .hero-note { animation:arrive .9s .32s both; }
.motion-enabled .console { animation:console-arrive 1.1s .12s both, float-desk 7s 1.3s ease-in-out infinite; }
.motion-enabled .pulse { animation:status-pulse 3s ease-out infinite; }
.motion-enabled .mini-lines i { transform-origin:bottom; animation:signal 3.8s ease-in-out infinite alternate; }
.motion-enabled .mini-lines i:nth-child(2n) { animation-delay:-1.4s; }
.motion-enabled .mini-lines i:nth-child(3n) { animation-delay:-2.5s; }
.motion-enabled .route i { animation:waypoint 3s ease-in-out infinite; }
.motion-enabled .route i:nth-child(2) { animation-delay:1s; }
.motion-enabled .route i:nth-child(3) { animation-delay:2s; }
.motion-enabled .community-orbit { animation:orbit-turn 34s linear infinite; }
.motion-enabled .portal-stack { animation:portal-float 8s ease-in-out infinite; }
.motion-enabled .section-heading, .motion-enabled .service, .motion-enabled .project-card, .motion-enabled .studio-grid > div, .motion-enabled .method-item, .motion-enabled .industry, .motion-enabled .contact-grid > div { transition:opacity .7s ease,translate .7s cubic-bezier(.2,.7,.3,1),transform .25s ease,border-color .25s ease,box-shadow .25s ease; }
.motion-enabled .reveal-pending { opacity:0; translate:0 24px; }
.motion-enabled .service:nth-child(2n), .motion-enabled .project-card:nth-child(2) { transition-delay:.06s; }
.motion-enabled .project-card:nth-child(3) { transition-delay:.12s; }
.project-monogram { transition:transform .55s cubic-bezier(.2,.7,.3,1); }
.project-body a span, .button span { display:inline-block; transition:transform .25s ease; }
.project-body a:hover span, .button:hover span { transform:translateX(4px); }
.button.primary { background-size:160% 100%; }
.button.primary:hover { background-position:100% 50%; }
@media(hover:hover) and (pointer:fine) { .project-card:hover .project-monogram { transform:translateY(-6px) scale(1.05); }.service:hover .icon { transform:rotate(-5deg); }.icon { transition:transform .3s ease; }.industry { transition:background .25s ease; }.industry:hover { background:#ffffff80; } }
@keyframes arrive { from { opacity:0; transform:translateY(19px); } to { opacity:1; transform:translateY(0); } }
@keyframes console-arrive { from { opacity:0; translate:0 22px; } to { opacity:1; translate:0 0; } }
@keyframes float-desk { 0%,100% { transform:translateY(0); } 50% { transform:translateY(-9px); } }
@keyframes color-flow { from { background-position:0% 50%; } to { background-position:100% 50%; } }
@keyframes status-pulse { 0% { box-shadow:0 0 0 0 #43d9a344; } 65%,100% { box-shadow:0 0 0 9px #43d9a300; } }
@keyframes signal { from { transform:scaleY(.65); opacity:.6; } to { transform:scaleY(1); opacity:1; } }
@keyframes waypoint { 0%,100% { opacity:.45; } 50% { opacity:1; box-shadow:0 0 12px #a0efce77; } }
@keyframes orbit-turn { to { transform:rotate(360deg); } }
@keyframes portal-float { 0%,100% { transform:rotate(-12deg) translateY(0); } 50% { transform:rotate(-9deg) translateY(-7px); } }
@media(max-width:520px) { .motion-enabled .console { animation:console-arrive .8s both; } }
@media(prefers-reduced-motion:reduce) { *,*::before,*::after { animation:none!important; scroll-behavior:auto!important; }.reveal-pending { opacity:1!important; translate:none!important; }.scroll-progress { display:none; } }