@font-face{font-family:"Open Sans";src:url("fonts/open-sans-400.ttf") format("truetype");font-style:normal;font-weight:400;font-display:block}
@font-face{font-family:"Open Sans";src:url("fonts/open-sans-600.ttf") format("truetype");font-style:normal;font-weight:600;font-display:block}
@font-face{font-family:"Open Sans";src:url("fonts/open-sans-700.ttf") format("truetype");font-style:normal;font-weight:700;font-display:block}
:root{--ink:#101214;--cyan:#18b8c4;--line:#dfe2e3;--paper:#fdfdfc;--rail:69px;--header:104px;--side:165px}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;overflow-x:hidden;background:var(--paper);color:var(--ink);font-family:"Open Sans",Arial,sans-serif;font-size:11px;line-height:1.5}
.noise{position:fixed;z-index:30;inset:0;pointer-events:none;opacity:.16;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='.85' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.07'/%3E%3C/svg%3E")}

.rail{position:fixed;z-index:20;inset:0 auto 0 0;width:var(--rail);display:flex;flex-direction:column;align-items:center;padding:14px 0;border-right:1px solid var(--line);background:#fff}
.rail-pixel-logo{flex:none;display:grid;grid-template-columns:repeat(24,2px);grid-template-rows:repeat(24,2px);width:48px;height:48px;margin:0 0 14px;text-decoration:none}
.rail-pixel-logo svg{display:block;width:2px;height:2px;overflow:hidden;shape-rendering:crispEdges}
.rail-name{flex:none;display:block;width:100%;height:240px;margin-bottom:40px;color:#090b0d;text-decoration:none;overflow:hidden}
.rail-name img{display:block;width:69px;height:auto;max-width:none;margin:0 auto;clip-path:inset(54px 3px 0 0)}
.rail-rule{flex:none;width:1px;height:74px;margin:0 0 36px;background:#9fa5a7}
.rail-glyphs{flex:0 1 auto;width:100%;min-height:0;overflow:hidden;display:flex;flex-direction:column;align-items:center;justify-content:flex-start;padding:0 14px}
.glyph-pair{width:100%;height:16px;display:grid;grid-template-columns:1fr 1fr;justify-items:center;align-items:center;gap:9px;font:400 11px/1 "Microsoft YaHei","Microsoft JhengHei","Yu Gothic","Malgun Gothic","Segoe UI Symbol","Arial Unicode MS",serif}
.glyph-pair[hidden]{display:none}
.glyph-pair i{font-style:normal;transition:opacity .18s ease,transform .18s ease}
.glyph-pair i.changing{opacity:0;transform:translateY(4px)}
.socials{flex:none;display:grid;justify-items:center;gap:26px;margin-top:36px;padding-top:0}
.socials a{color:#111;text-decoration:none;font-weight:700;font-size:14px}

.page-shell{min-height:100vh;margin-left:var(--rail)}
.topbar{position:relative;z-index:12;height:var(--header);display:flex;align-items:center;padding:0 90px 0 45px;border-bottom:1px solid #eceeef;background:rgba(255,255,255,.94)}
.brand{display:flex;align-items:center;gap:8px;color:inherit;text-decoration:none;font:600 14px/1.2 "Open Sans",Arial,sans-serif;letter-spacing:.5px}
.brand span{color:var(--cyan)}
.brand-label{font:inherit;white-space:nowrap}
.brand i{width:36px;height:4px;margin-left:6px;background:var(--cyan)}
.site-nav{display:flex;gap:42px;margin-left:80px}
.site-nav a{position:relative;padding:43px 0;color:#565b5e;text-decoration:none;font:400 13px/1.2 "Open Sans",Arial,sans-serif}
.site-nav a::after{content:"";position:absolute;height:2px;right:100%;bottom:30px;left:0;background:var(--cyan);transition:right .22s ease}
.site-nav a:hover::after,.site-nav a.active::after{right:0}
.language{margin-left:auto;display:flex;align-items:center;gap:6px;font-size:10px}
.language button{appearance:none;border:0;background:transparent;padding:6px 2px;color:#a7abad;cursor:pointer;font:600 10px/1.2 "Open Sans",Arial,sans-serif}
.language button.active{color:var(--ink)}
.language span{color:#c9cccd}
.menu{display:none}

main{position:relative;width:100%;display:grid;grid-template-columns:var(--side) minmax(0,1fr);margin:0;padding:0 64px 0 45px}
.discipline-nav{position:sticky;top:30px;align-self:start;z-index:8;display:flex;flex-direction:column;align-items:flex-start;padding-top:30px}
.discipline-mark{width:59px;height:59px;display:grid;place-items:center;margin-bottom:15px;border:1px solid var(--cyan);border-radius:50%;font:700 18px/1 "Open Sans",Arial,sans-serif;transform:rotate(-12deg)}
.discipline-nav a{color:var(--ink);text-decoration:none;font:600 9px/1.95 "Open Sans",Arial,sans-serif;letter-spacing:.25px;transition:color .2s ease,transform .2s ease}
.discipline-nav a.active{color:#078d99;transform:translateX(1px)}
.sections{min-width:0}
.discipline-section{min-height:672px;padding:30px 0 88px;scroll-margin-top:0}
.discipline-section+.discipline-section{border-top:1px solid #eceeef}
.section-heading{margin-bottom:38px}
.section-heading h1{margin:0;white-space:nowrap;font:600 clamp(29px,3vw,42px)/1.15 "Open Sans",Arial,sans-serif;letter-spacing:.2px}
.section-heading h1 em{font-style:normal;margin-left:0}
.section-heading h1 b{color:var(--cyan)}
.section-heading p{margin:14px 0 0;font-size:14px;line-height:1.55}
.designer-placeholder{min-height:470px;display:grid;place-content:center;margin:0;text-align:center}
.designer-placeholder h1{max-width:760px;white-space:normal}
.designer-placeholder p:empty{display:none}
.designer-grid[hidden]{display:none!important}

.cards{width:100%;display:grid;grid-template-columns:repeat(auto-fit,minmax(230px,1fr));grid-auto-rows:1px;column-gap:16px;row-gap:0;align-items:start;visibility:hidden;opacity:0}
.cards.is-ready{visibility:visible;opacity:1;transition:opacity .12s ease}
.card{position:relative;min-width:0;min-height:216px;overflow:hidden;border:0;background:rgba(255,255,255,.9);padding:19px;box-shadow:0 16px 42px rgba(18,25,29,.10),0 2px 8px rgba(18,25,29,.055);transition:box-shadow .2s ease,transform .2s ease}
.card:hover{box-shadow:0 22px 54px rgba(18,25,29,.14),0 4px 12px rgba(18,25,29,.07);transform:translateY(-1px)}
.card[id]{scroll-margin-top:90px}
.card h2{position:relative;z-index:2;margin:13px 0 8px;font:600 17px/1.22 "Open Sans",Arial,sans-serif;letter-spacing:0}
.card p{position:relative;z-index:2;max-width:205px;margin:0;font-size:10.5px;line-height:1.58}
.meta{position:relative;z-index:2;display:grid;gap:5px;font:600 9px/1.25 "Open Sans",Arial,sans-serif}
.meta b{color:#13a3ae;letter-spacing:.9px}
.card footer{position:absolute;z-index:4;bottom:18px;left:19px;font:600 9px/1.25 "Open Sans",Arial,sans-serif}
.card footer b{margin-left:7px;font-size:12px}
.card{background-color:#fff;background-repeat:no-repeat;background-size:cover;background-position:center}
.card::before{content:"";position:absolute;z-index:1;inset:0;pointer-events:none;background:linear-gradient(180deg,rgba(255,255,255,.97) 0,rgba(255,255,255,.88) 34%,rgba(255,255,255,.34) 70%,rgba(255,255,255,.08) 100%)}
.card-feature{min-height:464px;background-image:url("../img/cards/01_balroc_geometric_structure.png");background-position:43% center}
.data-card{min-height:248px;background-image:url("../img/cards/02_infrastructure_modular_architecture.png");background-position:62% center}
.event-card{min-height:232px;background-image:url("../img/cards/10_black_sea_forum_topography.png");background-position:64% center}
.xibrief-card{min-height:232px;background-image:url("../img/cards/07_xibrief_geometric_x.png");background-position:center}
.card-cta{position:absolute;z-index:6;inset:0}
.xiboard-card{min-height:288px;background-image:url("../img/cards/05_decision_support_hud.png");background-position:60% center}
.mark-oshpri-card{min-height:232px;background-image:url("../img/cards/08_research_publication_data_visualization.png");background-position:68% center}
.depth3d-card{min-height:248px;background-image:url("../img/cards/09_depth3d_wireframe_terrain.png");background-position:58% center}
.depth3d-card .meta b{color:#b88400}
.wholedbone-card{min-height:288px;background-image:url("../img/cards/03_research_systems_data_burst.png");background-position:center}
.wholedbone-card .meta b{color:#3d70c5}
.phpbb-card{min-height:248px;background-image:url("../img/cards/04_patent_engineering_blueprint.png");background-position:58% center}
.idhtml-card{min-height:248px;background-image:url("../img/cards/07_xibrief_geometric_x.png");background-position:center}
.node-card,.dark-card{min-height:424px}
.node-card{background-image:url("../img/cards/03_research_systems_data_burst.png");background-position:center}
.patent-card{min-height:240px;background-image:url("../img/cards/04_patent_engineering_blueprint.png");background-position:center}
.paper-card{min-height:272px;background-image:url("../img/cards/08_research_publication_data_visualization.png");background-position:center}
.article-card{min-height:288px}
.article-bg-01{background-image:url("../img/cards/01_balroc_geometric_structure.png");background-position:48% center}
.article-bg-02{background-image:url("../img/cards/02_infrastructure_modular_architecture.png");background-position:62% center}
.article-bg-03{background-image:url("../img/cards/03_research_systems_data_burst.png")}
.article-bg-04{background-image:url("../img/cards/04_patent_engineering_blueprint.png")}
.article-bg-05{background-image:url("../img/cards/05_decision_support_hud.png");background-position:62% center}
.article-bg-06{background-image:url("../img/cards/06_nato_innovation_brutalist_interior.png");background-position:61% center}
.article-bg-07{background-image:url("../img/cards/07_xibrief_geometric_x.png")}
.article-bg-08{background-image:url("../img/cards/08_research_publication_data_visualization.png");background-position:65% center}
.article-bg-09{background-image:url("../img/cards/09_depth3d_wireframe_terrain.png");background-position:60% center}
.article-bg-10{background-image:url("../img/cards/10_black_sea_forum_topography.png");background-position:64% center}
.dark-card{background-image:url("../img/cards/06_nato_innovation_brutalist_interior.png");background-position:61% center}
.radar-card{min-height:256px;background-image:url("../img/cards/05_decision_support_hud.png");background-position:62% center}
.hero-card{min-height:288px;background-image:url("../img/cards/11_osprey_lion_sensor.png");background-position:67% center}
.card-feature img,.hero-card img,.stripe-orb,.contours,.nodes,.patent-lines,.paper,.radar{display:none}

.site-footer{display:grid;grid-template-columns:minmax(210px,.82fr) repeat(3,minmax(210px,1fr));align-items:start;gap:clamp(42px,5vw,92px);margin:0;padding:clamp(68px,7vw,104px) clamp(36px,5vw,92px) clamp(78px,8vw,118px);border-top:1px solid #eceeef;color:var(--ink);background:#fff;font:400 14px/1.55 "Open Sans",Arial,sans-serif}
.site-footer__intro{display:flex;flex-direction:column;align-items:flex-start}
.site-footer__logo{color:var(--ink);text-decoration:none;font:600 clamp(28px,2.2vw,38px)/1.15 "Open Sans",Arial,sans-serif;letter-spacing:0}
.site-footer__intro p{margin:28px 0 38px;color:#99a3aa;font-size:14px;line-height:1.65;letter-spacing:.2px}
.site-footer__home{color:#078d99;text-decoration:none;font-weight:700;transition:color .18s ease}
.site-footer__home span{display:inline-block;margin-left:7px;font-size:18px;transition:transform .18s ease}
.site-footer__home:hover,.site-footer__home:focus-visible{color:var(--ink);outline:none}
.site-footer__home:hover span,.site-footer__home:focus-visible span{transform:translate(2px,-2px)}
.site-footer__column{min-width:0}
.site-footer__group{display:grid;justify-items:start;gap:16px}
.site-footer__group+.site-footer__group{margin-top:54px}
.site-footer__group h2{margin:0 0 5px;color:var(--ink);font-size:14px;font-weight:700;line-height:1.25;letter-spacing:0}
.site-footer__group a{max-width:100%;color:#929da4;text-decoration:none;font-size:14px;line-height:1.38;transition:color .18s ease,transform .18s ease}
.site-footer__group a:hover,.site-footer__group a:focus-visible,.site-footer__group a.active{color:#078d99;outline:none;transform:translateX(2px)}

@media(min-width:1800px){.cards{grid-template-columns:repeat(auto-fit,minmax(250px,1fr))}}
@media(max-width:1200px){
  :root{--side:136px}
  .topbar{padding:0 54px 0 27px}
  .site-nav{gap:20px;margin-left:44px}
  main{padding-right:44px;padding-left:27px}
  .section-heading h1{font-size:35px}
  .site-footer{grid-template-columns:repeat(2,minmax(0,1fr));gap:64px 72px;padding:64px 44px 82px 27px}
}
@media(max-width:900px){
  :root{--rail:0px;--header:64px}
  .rail{display:none}
  .page-shell{margin-left:0}
  .topbar{position:sticky;top:0;height:64px;padding:0 14px;background:#fff;backdrop-filter:none}
  .brand{font-size:12px}.brand i{width:22px;height:3px}
  .menu{display:grid;order:3;gap:5px;margin-left:10px;border:0;background:transparent;padding:8px}
  .menu span{display:block;width:20px;height:2px;background:#111}
  .site-nav{display:none;position:absolute;top:64px;right:0;left:0;flex-direction:column;gap:0;margin:0;padding:8px 18px 18px;border-bottom:1px solid var(--line);background:#fff}
  .site-nav.open{display:flex}.site-nav a{padding:10px 0}.site-nav a::after{bottom:6px;width:22px}
  .language{margin-left:auto}
  main{display:block;padding:0 14px}
  .discipline-nav{top:64px;z-index:11;flex-direction:row;gap:14px;align-items:center;margin:0 -14px;padding:10px 14px;border-bottom:1px solid var(--line);background:#fff;backdrop-filter:none}
  .discipline-mark{width:32px;height:32px;margin:0;font-size:14px}.discipline-nav a{font-size:9px}
  .discipline-section{min-height:auto;padding:40px 0 64px;scroll-margin-top:110px}
  .designer-placeholder{min-height:340px}
  .section-heading h1{white-space:normal;font-size:clamp(29px,8vw,42px);line-height:1}
  .section-heading h1 em{margin-left:0}.section-heading p{font-size:13px}
  .cards{grid-template-columns:1fr;grid-auto-rows:1px}
  .site-footer{gap:54px 40px;padding:54px 28px 70px}
}
@media(max-width:600px){
  .site-footer{grid-template-columns:1fr;gap:50px;padding:48px 20px 64px}
  .site-footer__intro p{margin:20px 0 26px}
  .site-footer__group+.site-footer__group{margin-top:42px}
}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*::before,*::after{transition:none!important}}
