.product-feature{position:relative;gap:5%;padding:44px;border:1px solid var(--border,#dce0ee);border-radius:28px;background:#fff;margin:36px 0;overflow:hidden}.product-feature:nth-of-type(even){direction:rtl}.product-feature>*{direction:ltr}.product-feature .product-copy{min-width:0}.product-copy h3{font-size:clamp(30px,3.1vw,48px);line-height:1.17;max-width:510px}.product-copy .product-wordmark{max-width:180px;height:48px;object-fit:contain;object-position:left;margin:22px 0}.product-feature .product-scene,.product-custom-cover{border-radius:22px}.product-custom-cover{width:100%;height:auto;object-fit:contain}.product-or-done{background:linear-gradient(130deg,#fff 48%,#f5f0f5)}.product-or-done .product-copy{max-width:520px}.product-next{display:flex;flex-wrap:wrap;gap:20px}.product-next>.eyebrow{width:100%}.product-editorial .prose{max-width:860px}.product-editorial h2{margin-top:48px}.product-access-link{display:inline-flex;gap:4px;align-items:center}.product-access-link .icon{width:12px;height:12px}.menu-products .menu-product{min-height:88px;padding-block:12px}.menu-product img{height:26px;max-width:130px}.menu-products{min-width:0}.product-or-done .product-external{display:flex}.tech-composition{grid-template-columns:repeat(2,minmax(0,1fr))}.tech-center{grid-column:1/-1}.hero-product-strip{display:flex;gap:12px;flex-wrap:wrap;margin-top:24px}.hero-product-strip a{color:#fff;border:1px solid #ffffff30;border-radius:30px;padding:7px 14px;display:inline-flex;gap:9px;font-size:13px;align-items:center}.hero-product-strip a:hover{border-color:#ff6d1d}.hero-product-strip .icon{width:14px;height:14px}
.ordone-scene{position:relative;min-width:0;min-height:480px;border-radius:22px;background:#101119;display:flex;align-items:center;padding:38px 18px 56px;overflow:hidden;box-shadow:inset 0 0 0 1px #ffffff10;color:#f8f8fc;font-family:Inter,sans-serif}.ordone-glow{position:absolute;inset:0;background:radial-gradient(ellipse at 78% 20%,#bf1c4138,transparent 65%)}.ordone-board{width:100%;position:relative;display:grid;grid-template-columns:35px minmax(0,1fr);border:1px solid #393942;border-radius:12px;background:#191a24;box-shadow:0 25px 35px #0007;overflow:hidden}.board-rail{display:flex;flex-direction:column;gap:20px;align-items:center;background:#14151d;border-right:1px solid #ffffff0d;padding-top:14px;font-size:15px;color:#838697}.board-symbol{font-weight:800;font-size:17px;color:#fff;letter-spacing:-2px}.board-symbol span{color:#ef3253}.board-rail-active{color:#f8617f;background:#b6174030;border-radius:4px;padding:0 4px}.board-workspace{min-width:0;padding:13px}.board-top{display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid #ffffff12;padding-bottom:11px;font-size:10px}.board-top strong>span{font-weight:400;color:#9b9dac;font-size:8px}.board-avatar{padding:4px 5px;border-radius:6px;background:#8d234750;color:#ffa4b6;font-size:8px}.board-greeting{display:flex;justify-content:space-between;align-items:center;margin:20px 0 18px;gap:8px}.board-greeting small{font-size:7px;letter-spacing:1px;color:#9495a8}.board-greeting h4{font-size:15px;line-height:1.4;letter-spacing:-.3px;margin:5px 0 0;color:#fff}.board-live{font-size:7px;color:#95c796;white-space:nowrap}.board-metrics{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:7px;margin-bottom:12px}.board-metrics>div{background:#232530;border:1px solid #ffffff09;padding:10px;border-radius:7px}.board-metrics>div>span{font-size:7px;color:#a6a7b7;display:block}.board-metrics strong{font-size:25px;font-weight:600;display:block;margin-top:7px;line-height:1}.board-metrics strong small{font-size:7px;font-weight:400;color:#9da0b0}.board-columns{display:grid;grid-template-columns:1.15fr 1fr;gap:10px}.board-route,.board-orders{background:#22242f;border:1px solid #ffffff0c;border-radius:7px;min-width:0;overflow:hidden}.board-card-title{display:flex;justify-content:space-between;padding:11px 9px;font-size:8px}.board-card-title small{color:#989cae;font-size:7px}.board-map{position:relative;background:linear-gradient(0deg,transparent 23%,#ffffff03 24%,#ffffff03 25%,transparent 26%),linear-gradient(90deg,transparent 23%,#ffffff03 24%,#ffffff03 25%,transparent 26%);background-size:25px 25px;padding:4px 0 20px}.board-map svg{width:100%;height:auto;display:block}.board-map-key{position:absolute;bottom:2px;left:9px;color:#eaa3b1;font-size:7px}.board-route-footer{padding:9px;border-top:1px solid #ffffff0b;font-size:7px;color:#9d9fb0}.board-route-footer strong{display:block;color:#eeeef5;font-size:8px;font-weight:500;margin-top:5px}.board-route-footer strong span{float:right;color:#f7859c}.board-orders>div:not(.board-card-title):not(.board-progress){display:flex;align-items:center;gap:5px;padding:9px 7px;border-bottom:1px solid #ffffff0c;font-size:7px}.order-avatar{font-size:7px;border-radius:5px;padding:5px;background:#343644}.board-orders small{display:block;color:#8e93a6;font-size:6px;margin-top:4px}.board-orders i{font-style:normal;font-size:6px;color:#e9b365;background:#c28a2e15;padding:4px;border-radius:4px;margin-left:auto}.board-orders i.order-done{color:#94d9b3;background:#30a16b15}.board-progress{padding:10px;font-size:7px;color:#c3c7d4}.board-progress>span{display:flex;justify-content:space-between}.board-progress>div{height:4px;border-radius:4px;background:linear-gradient(90deg,#ef3155 75%,#393c4c 75%);margin-top:8px}.board-bottom{display:flex;justify-content:space-between;gap:10px;margin-top:13px;color:#828798;font-size:6px}.board-demo-label{position:absolute;bottom:22px;left:0;right:0;text-align:center;color:#a9aaba;font-size:10px}.ordone-scene .board-metrics strong{color:#fff}
.language-switch{display:flex;align-items:center;gap:2px;padding:3px;border:1px solid #ffffff35;border-radius:20px;flex-shrink:0;margin-left:16px}.language-switch a{padding:5px 8px;color:#c5cbe4;font-size:11px;font-weight:700;border-radius:16px}.language-switch a[aria-current=page]{background:#fff;color:#263a83}.site-header .language-switch{order:3}.mobile-toggle{order:4}.translation-note{font-size:14px}
@media(min-width:1200px){.product-or-done{grid-template-columns:.88fr 1.12fr}.product-or-done .ordone-scene{min-height:490px;padding-inline:22px}.board-greeting h4{font-size:17px}}
@media(max-width:1100px){.product-feature{padding:28px;gap:30px}.ordone-scene{min-height:360px;padding:28px 12px 44px}.board-workspace{padding:8px}.board-columns{gap:6px}.board-greeting h4{font-size:11px}.board-live{display:none}.board-metrics>div{padding:7px}.board-metrics strong{font-size:20px}.language-switch{margin-left:8px}.main-navigation{flex:1}.nav-actions{gap:6px}.nav-actions .button{padding-inline:13px}}
@media(max-width:767px){.product-feature,.product-feature:nth-of-type(even){display:flex;flex-direction:column;padding:24px 18px;direction:ltr;margin:24px 0;border-radius:20px}.product-feature .product-copy{width:100%;max-width:none}.product-feature .product-scene,.product-feature .ordone-scene{width:100%;order:0}.product-feature .product-copy h3{font-size:32px}.ordone-scene{min-height:335px;padding:26px 9px 40px}.ordone-board{grid-template-columns:24px minmax(0,1fr)}.board-rail{font-size:12px;gap:16px}.board-symbol{font-size:12px}.board-greeting{margin:12px 0}.board-metrics{gap:4px}.board-metrics>div>span{font-size:6px}.board-metrics strong small{font-size:6px}.board-greeting h4{font-size:11px}.board-top strong>span{font-size:6px}.board-orders>div:not(.board-card-title):not(.board-progress){font-size:6px;padding:7px 5px}.order-avatar{display:none}.board-card-title{font-size:7px;padding:9px 6px}.board-route-footer{padding:8px 5px}.board-bottom{font-size:5px}.board-map{padding-bottom:18px}.board-metrics strong{font-size:21px}.board-demo-label{font-size:8px;bottom:17px}.product-next .button{white-space:normal;text-align:left}.language-switch{margin-left:auto;margin-right:12px}.site-header .brand{margin-right:0}.hero-product-strip{gap:8px}.hero-product-strip a{padding:6px 11px}.menu-product img{height:24px}}
@media(prefers-reduced-motion:reduce){.ordone-scene *{animation:none!important}}

/* A single brand mascot anchors the hero; owned products sit in a calm, aligned row. */
.hero{background:#0c1022}.hero-grid{min-height:740px;grid-template-columns:1fr 1fr;gap:36px}.hero-copy{padding-block:60px}.hero-stage.mascot-stage{transform:none;perspective:none;width:100%;height:630px;margin:0;display:flex;align-items:center;justify-content:center;position:relative;isolation:isolate}.mascot-art{width:110%;max-width:110%;height:590px;object-fit:contain;position:absolute;top:-18px;left:-5%;z-index:1;mask-image:radial-gradient(ellipse at 50% 47%,#000 57%,transparent 74%);-webkit-mask-image:radial-gradient(ellipse at 50% 47%,#000 57%,transparent 74%)}.mascot-orbit{position:absolute;top:92px;left:9%;width:83%;aspect-ratio:1;border:1px solid #5972c728;border-radius:50%;background:radial-gradient(circle,#263a8340,transparent 66%);transform:rotate(-20deg);z-index:0}.mascot-orbit:before{content:'';position:absolute;inset:-24px;border:1px solid #5972c714;border-radius:50%}.mascot-kicker{position:absolute;top:-20px;right:0;font-size:9px;letter-spacing:.18em;color:#9ca9d1;z-index:2}.mascot-signature{position:absolute;bottom:101px;left:0;right:0;display:flex;align-items:center;justify-content:center;gap:9px;color:#a7b4d7;font-size:11px;z-index:2}.mascot-signature>span{width:5px;height:5px;border-radius:50%;background:#ff6d1d;box-shadow:0 0 12px #ff6d1d80}.mascot-products{position:absolute;bottom:0;left:0;right:0;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));border:1px solid #ffffff1b;background:linear-gradient(130deg,#1a2342aa,#111728);border-radius:16px;padding:6px;z-index:3;box-shadow:0 20px 40px #0002}.mascot-product{padding:15px 10px;display:flex;align-items:center;gap:8px;min-width:0;color:#fff;position:relative;border-radius:11px;transition:background .2s}.mascot-product:not(:last-child):after{content:'';position:absolute;right:-1px;top:15px;bottom:15px;width:1px;background:#ffffff14}.mascot-product:hover{background:#263a8380}.mascot-product-mark{color:#ff8648}.mascot-product-wpdify .mascot-product-mark{color:#70dba9}.mascot-product-bordnex .mascot-product-mark{color:#aab9fb}.mascot-product-mark>.icon{width:19px;height:19px}.mascot-product strong{display:block;font-size:13px;font-weight:600;letter-spacing:-.2px;line-height:1.3}.mascot-product small{display:block;font-size:8px;line-height:1.5;color:#9eabce;margin-top:4px}.mascot-product>.icon{width:11px;height:11px;margin-left:auto;color:#9daaca}.hero-clients{margin-top:32px}
@media(max-width:1100px) and (min-width:768px){.hero-grid{gap:20px;min-height:660px}.hero-stage.mascot-stage{height:540px}.mascot-art{height:460px;top:20px}.mascot-products{left:-10px;right:-10px}.mascot-product{padding:12px 5px;gap:5px}.mascot-product small{font-size:7px}.mascot-product-mark>.icon{width:14px}.mascot-kicker{font-size:7px}.mascot-signature{font-size:9px}.hero h1{font-size:clamp(35px,3.7vw,48px)}}
@media(max-width:767px){.hero-grid{grid-template-columns:1fr;gap:0;min-height:0}.hero-copy{padding:45px 0 0}.hero-stage.mascot-stage{height:470px;width:100%;max-width:430px;margin-top:28px;margin-bottom:22px}.mascot-art{height:382px;width:112%;max-width:112%;left:-6%;top:8px}.mascot-kicker{top:4px;right:0;left:0;text-align:center;font-size:7px}.mascot-orbit{top:68px;left:7%;width:86%}.mascot-signature{bottom:96px;font-size:9px}.mascot-products{padding:4px;border-radius:13px}.mascot-product{padding:13px 6px;gap:5px;align-items:flex-start}.mascot-product strong{font-size:11px}.mascot-product small{font-size:7px;margin-top:5px}.mascot-product-mark>.icon{width:13px;height:13px}.mascot-product>.icon{display:none}.hero-clients{margin-top:28px}.hero-clients>span{font-size:8px}.hero h1{font-size:clamp(35px,8.6vw,48px)}.hero:after{height:20px}}
/* Very small phones (e.g. 320 px): logo, language switch and menu button share one row. */
@media(max-width:374px){.site-header .primary-nav{gap:10px}.site-header .brand{width:132px}.site-header .brand img{height:34px}.site-header .language-switch{margin-right:6px}.site-header .language-switch a{padding:5px 7px}}
/* Project pages: keep the "service areas" box clear of the gallery below. */
.project-detail .article-related{margin:0 0 40px}
@media(max-width:767px){.project-detail .article-related{margin-bottom:28px;padding:22px}.project-detail .article-related h2{font-size:24px}}
/* Product pages: consecutive light sections share one gap instead of two. */
.product-detail+.section,.product-editorial+.section{padding-top:0}
.product-editorial .prose>h2:first-child{margin-top:0}
/* Phones: 16px form text stops iOS Safari zooming into a field on focus; placeholders stay compact. */
@media(max-width:767px){.field input,.field select,.field textarea,.hero-lead input,.search-field input,.filter-select>select{font-size:16px}.hero-lead input::placeholder{font-size:11px}.search-field input::placeholder{font-size:13px}}
/* Tablets use the compact header too: keep the language switch next to the menu button. */
@media(max-width:900px){.js .site-header .language-switch{margin-left:auto;margin-right:12px}.js .site-header .brand{margin-right:0}}
@media(max-width:374px){.hero-lead input::placeholder{font-size:10px}}
/* Contact form honeypot: invisible to visitors and assistive tech, filled in by bots. */
.hp-field{position:absolute!important;left:-10000px!important;width:1px;height:1px;opacity:0;pointer-events:none}
/* Safari/WebKit: cards in grids and scroll tracks must be able to shrink below the
   intrinsic width of project screenshots (1440 px); Chrome does this implicitly. */
.project-grid>*,.experience-grid>*,.blog-grid>*,.sector-grid>*,.team-grid>*,.additional-brand-grid>*,.hero-grid>*,.service-panel>*,.proof-panel>*,.story-slide>*,.service-detail-top>*,.project-story-layout>*,.project-gallery>*,.product-case>*,.product-feature>*,.carousel-track>*,.service-project-track>*{min-width:0}
.project-card,.blog-card,.project-visual,.service-image,.story-image,.project-mockup,.device-laptop,.device-phone,.device-screen,.gallery-item{min-width:0;max-width:100%}
.project-mockup img,.device-screen>img{min-width:0;max-width:100%}
.experience-grid>.project-card{max-width:84%}
.resources-section .blog-grid>.blog-card{max-width:88%}
@media(min-width:651px){.experience-grid>.project-card,.resources-section .blog-grid>.blog-card{max-width:none}}
