:root{--bg:#020713;--panel:#071426;--line:#1e3858;--text:#f7f9ff;--muted:#9aafc9;--cyan:#08cfff;--violet:#8c35ff;--max:1180px}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--bg);color:var(--text);font-family:Inter,system-ui,-apple-system,"Segoe UI",sans-serif}a{text-decoration:none;color:inherit}button,input{font:inherit}.shell{width:min(var(--max),calc(100% - 38px));margin:auto}
.top{height:76px;position:sticky;top:0;z-index:50;display:flex;align-items:center;padding:0 max(19px,calc((100vw - var(--max))/2));background:rgba(2,7,19,.92);backdrop-filter:blur(16px);border-bottom:1px solid #14243b}.logo{height:38px}.nav{margin-left:auto;display:flex;gap:24px}.nav a{font-size:13px;color:#cbd6e7}.nav a:hover{color:var(--cyan)}.actions{display:flex;gap:10px;margin-left:24px}.btn{border:1px solid #294564;border-radius:9px;background:#071426;color:#fff;padding:12px 17px;cursor:pointer}.primary{border:0;background:linear-gradient(100deg,#00c9f5,#3d73ff,#912fff)}.hamb{display:none;margin-left:auto;background:none;border:0;color:white;font-size:25px}
.hero{min-height:650px;background:linear-gradient(90deg,rgba(2,7,19,.98) 0%,rgba(2,7,19,.88) 28%,rgba(2,7,19,.28) 54%,rgba(2,7,19,.12) 100%),url("../img/hero-cube-wide.webp") 65% center/cover no-repeat;border-bottom:1px solid #152941}.hero-in{min-height:650px;display:flex;align-items:center}.hero-copy{width:53%;padding:70px 0}.eyebrow{font-size:11px;letter-spacing:1.8px;color:#61dfff}.hero h1{font-size:58px;line-height:1.02;letter-spacing:-3px;margin:20px 0}.grad{background:linear-gradient(90deg,#04c8ff,#4774ff,#9c34f6);-webkit-background-clip:text;color:transparent}.hero p{font-size:16px;line-height:1.7;color:#a3b6ce;max-width:610px}.hero-buttons{display:flex;gap:11px;margin:26px 0}.traits{display:flex;gap:25px;color:#b7c7da;font-size:12px}.meaning{margin-top:27px;border-left:2px solid var(--cyan);padding:10px 13px;background:linear-gradient(90deg,rgba(5,24,43,.65),transparent)}.meaning b,.meaning span{display:block}.meaning span{color:#8fa8c4;font-size:11px;margin-top:4px}
.exp{display:grid;grid-template-columns:1.3fr repeat(3,1fr);border:1px solid #203b5b;border-radius:14px;background:#071220;margin-top:-36px;position:relative;z-index:3}.exp>div{padding:21px}.exp>div+div{border-left:1px solid #20344f}.exp b,.exp span{display:block}.exp b{font-size:22px}.exp span{font-size:10px;color:#8ea3be}.section{padding:82px 0}.head{text-align:center;margin-bottom:34px}.head small{color:#55dfff;letter-spacing:1.6px}.head h2{font-size:38px;margin:8px 0}.head p{color:#91a6c0}
.cards{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}.card{border:1px solid #203b5d;border-radius:14px;background:#071426;overflow:hidden}.media{height:190px;overflow:hidden;background:#061020}.media img{width:100%;height:100%;object-fit:cover;object-position:center;display:block}.body{padding:22px}.body h3{margin:0 0 10px}.body p{color:#9cb0c8;line-height:1.55}.more{border:0;background:none;color:#54dcff;padding:0;cursor:pointer}
.work{display:grid;grid-template-columns:repeat(4,1fr);gap:14px}.work .card{cursor:pointer}.work .media{height:165px}.work .body{padding:14px}.work h3{font-size:14px}.work p{font-size:10px;margin-bottom:0}
.about{display:grid;grid-template-columns:.85fr 1.15fr;gap:45px;align-items:center}.about img{width:100%;border:1px solid #213d60;border-radius:14px}.about p{color:#9bafc7;line-height:1.7}
footer{border-top:1px solid #152942;padding:45px 0 25px}.foot{display:grid;grid-template-columns:1.4fr 1fr 1fr 1fr;gap:40px}.foot img{height:40px}.foot b{font-size:12px}.foot a,.foot p{display:block;font-size:11px;color:#93a7c0;margin:9px 0}.foot a{cursor:pointer}.copy{border-top:1px solid #14243b;margin-top:25px;padding-top:15px;color:#6f839f;font-size:10px}
/* content modal */
.modal{display:none;position:fixed;inset:0;z-index:200;background:rgba(0,0,0,.74);backdrop-filter:blur(9px);padding:24px}.modal.show{display:grid;place-items:center}.modalbox{width:min(760px,100%);max-height:88vh;overflow:auto;background:#071426;border:1px solid #2c4d77;border-radius:18px;box-shadow:0 30px 100px #000;position:relative}.modalimg{width:100%;height:280px;object-fit:cover;display:none}.modalcontent{padding:26px}.modalcontent small{color:#5bdfff}.modalcontent h2{font-size:31px;margin:7px 0}.modalcontent h4{color:#9fb2ca;margin:0 0 16px}.modalcontent p{color:#b4c4d7;line-height:1.75;white-space:pre-line}.close{position:absolute;right:12px;top:12px;width:38px;height:38px;border:1px solid #37577d;border-radius:50%;background:#061020;color:#fff;font-size:22px;cursor:pointer}
/* J2 */
.j2{position:fixed;right:20px;bottom:18px;z-index:120}.j2btn{width:88px;height:88px;border:2px solid #6855ff;border-radius:50%;padding:2px;background:#061020;box-shadow:0 0 28px #513cff88;animation:float 4s ease-in-out infinite;cursor:pointer}.j2btn img{width:100%;height:100%;object-fit:cover;border-radius:50%}.bubble{position:absolute;right:82px;bottom:64px;width:230px;padding:13px 15px;border:1px solid #594bdf;border-radius:13px;background:#0a1730}.bubble b,.bubble span{display:block}.bubble span{font-size:10px;color:#9eb2ca;margin-top:4px;line-height:1.4}.chat{display:none;position:absolute;right:0;bottom:102px;width:390px;background:#061225;border:1px solid #4156d8;border-radius:17px;overflow:hidden;box-shadow:0 30px 90px #000}.chat.show{display:block}.chathead{display:flex;align-items:center;gap:10px;padding:12px;border-bottom:1px solid #203958}.chathead img{width:42px;height:42px;border-radius:50%;object-fit:cover}.chathead div{flex:1}.chathead small{display:block;color:#35e487}.chathead button{border:0;background:none;color:#fff;font-size:20px}.msgs{padding:15px;max-height:360px;overflow:auto}.botmsg{background:#0d1d33;border-radius:11px;padding:12px;color:#c8d5e6;font-size:12px;line-height:1.55}.botmsg b{display:block;color:#fff;margin-bottom:4px}.quick{display:grid;grid-template-columns:1fr 1fr;gap:7px;margin-top:10px}.quick button{border:1px solid #2c4e76;background:#08172b;color:#d9e5f5;border-radius:8px;padding:8px;font-size:11px}.chat form{display:grid;grid-template-columns:1fr 42px;gap:7px;padding:10px;border-top:1px solid #203958}.chat input{background:#071426;border:1px solid #294565;color:#fff;border-radius:8px;padding:10px}.send{border:0;border-radius:8px;background:linear-gradient(135deg,#2874ff,#8d31f5);color:#fff}.user-msg{margin:9px 0 9px auto;background:linear-gradient(90deg,#315dff,#8a31f4);padding:9px 11px;border-radius:10px;max-width:82%;font-size:12px}.bot-reply{margin:9px auto 9px 0;background:#0d1d33;padding:9px 11px;border-radius:10px;max-width:86%;font-size:12px;color:#c8d5e6}
@keyframes float{50%{transform:translateY(-8px)}}
@media(max-width:900px){.nav{display:none;position:absolute;top:68px;left:12px;right:12px;background:#061225;border:1px solid #203958;padding:15px;flex-direction:column}.nav.show{display:flex}.hamb{display:block}.actions{margin-left:10px}.actions .primary{display:none}.hero{background:linear-gradient(0deg,rgba(2,7,19,.99) 0%,rgba(2,7,19,.72) 55%,rgba(2,7,19,.18)),url("../img/hero-cube-wide.webp") 62% 5%/auto 53% no-repeat;min-height:780px}.hero-in{min-height:780px;align-items:flex-end}.hero-copy{width:100%;padding:330px 0 95px}.cards,.about{grid-template-columns:1fr}.work{grid-template-columns:1fr 1fr}.exp{grid-template-columns:1fr 1fr}.exp>div+div{border-left:0}.foot{grid-template-columns:1fr 1fr}}
@media(max-width:560px){.shell{width:calc(100% - 26px)}.logo{height:31px}.hero h1{font-size:42px}.traits{flex-wrap:wrap}.exp{grid-template-columns:1fr}.work{grid-template-columns:1fr}.foot{grid-template-columns:1fr}.bubble{display:none}.chat{position:fixed;left:8px;right:8px;bottom:98px;width:auto}.j2{right:11px;bottom:11px}.j2btn{width:76px;height:76px}.modal{padding:10px}.modalimg{height:210px}}

/* V4.1 LOCKED REBUILD */
.hero-in{position:relative}
.hero-rotate{display:inline-block;transition:opacity .35s ease,transform .35s ease,filter .35s ease}
.hero-rotate.swap{opacity:0;transform:translateY(12px);filter:blur(5px)}
.float-card{position:absolute;z-index:4;min-width:190px;padding:12px 15px;border:1px solid rgba(64,147,255,.58);border-radius:11px;background:rgba(5,18,37,.82);backdrop-filter:blur(12px);box-shadow:0 12px 45px rgba(0,0,0,.3);animation:techFloat 5s ease-in-out infinite}
.float-card:before{content:"";position:absolute;width:7px;height:7px;border-radius:50%;background:#28e5ff;box-shadow:0 0 13px #28e5ff}
.float-card b,.float-card span{display:block}.float-card b{font-size:11px;color:#fff}.float-card span{font-size:9px;color:#a8c1dd;margin-top:4px}
.fc-ai{right:29%;top:12%}.fc-ai:before{right:-4px;top:50%}.fc-soft{right:36%;bottom:23%;animation-delay:-1.2s}.fc-soft:before{right:-4px;top:50%}.fc-cloud{right:2%;top:17%;animation-delay:-2.4s}.fc-cloud:before{left:-4px;top:50%}.fc-sec{right:0;bottom:26%;animation-delay:-3.3s}.fc-sec:before{left:-4px;top:50%}
@keyframes techFloat{50%{transform:translateY(-9px)}}
.exp{background:rgba(5,18,35,.97);border-color:#31587f;box-shadow:0 14px 45px rgba(0,0,0,.35)}
.exp b{color:#fff;font-size:25px;font-weight:850;letter-spacing:-.3px}.exp span{color:#e7f2ff;font-size:12px;font-weight:650;margin-top:5px}
.card .media img{object-fit:cover;object-position:center}
.why-video{grid-template-columns:.72fr 1.28fr}
.video-frame{height:390px;position:relative;overflow:hidden;border:1px solid #294b72;border-radius:15px;background:#061020}
.video-frame video{width:100%;height:100%;object-fit:cover;display:block}
.video-note{position:absolute;left:14px;bottom:12px;padding:7px 10px;border:1px solid rgba(64,147,255,.45);border-radius:8px;background:rgba(4,14,29,.75);font-size:9px;letter-spacing:1.2px;color:#9cdfff}
@media(max-width:1100px){.float-card{transform:scale(.9)}.fc-ai{right:12%;top:9%}.fc-soft{right:18%;bottom:18%}.fc-cloud,.fc-sec{display:none}}
@media(max-width:900px){.float-card{display:none}.why-video{grid-template-columns:1fr}.video-frame{height:280px}.exp b{font-size:22px}.exp span{font-size:11px}}


/* ============================================================
   J2ONE FINAL EXPERIENCE STATS — HIGH VISIBILITY
   Keep this block at the END of app.css.
   ============================================================ */
.exp b {
    font-size: 52px !important;
    font-weight: 900 !important;
    line-height: 1 !important;
    letter-spacing: -1.5px !important;
    color: #ffffff !important;
}

.exp b .counter {
    font-size: inherit !important;
    font-weight: 900 !important;
    line-height: inherit !important;
    color: #ffffff !important;
}

.exp > div > span:last-child {
    display: block !important;
    margin-top: 12px !important;
    font-size: 16px !important;
    font-weight: 700 !important;
    line-height: 1.3 !important;
    color: #e8f3ff !important;
}

/* Tablet */
@media (max-width: 900px) {
    .exp b {
        font-size: 42px !important;
    }

    .exp > div > span:last-child {
        font-size: 15px !important;
    }
}

/* Phone */
@media (max-width: 560px) {
    .exp b {
        font-size: 38px !important;
        letter-spacing: -1px !important;
    }

    .exp > div > span:last-child {
        font-size: 14px !important;
    }
}


/* RECOVERY: language dropdown + video fallback */
.lang-wrap{position:relative}
.lang-menu{display:none;position:absolute;right:0;top:calc(100% + 8px);min-width:170px;padding:6px;background:#071426;border:1px solid #294564;border-radius:10px;box-shadow:0 18px 50px rgba(0,0,0,.45);z-index:160}
.lang-menu.show{display:block}
.lang-menu button{width:100%;padding:10px 12px;border:0;border-radius:7px;background:transparent;color:#fff;text-align:left;cursor:pointer}
.lang-menu button:hover{background:#10213a}
.video-frame{position:relative}
.video-replay{display:none;place-items:center;position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);width:54px;height:54px;border:1px solid #4d74a5;border-radius:50%;background:rgba(4,14,29,.8);color:#fff;cursor:pointer;z-index:3}
.exp .stat-value{display:flex!important;align-items:baseline!important;flex-wrap:nowrap!important;white-space:nowrap!important}
.exp .stat-value .counter,.exp .stat-value .stat-suffix{display:inline!important;white-space:nowrap!important}