:root{
  --bg:#f4f7fb;--panel:#fff;--text:#182230;--muted:#7b8798;--line:#e8edf4;
  --primary:#246bfd;--primary2:#6d5dfc;--sidebar:#101828;--sidebar2:#172033;
  --success:#17b26a;--warning:#f79009;--shadow:0 12px 35px rgba(16,24,40,.08);
  --radius:18px;
}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;font-family:Inter,system-ui,sans-serif;background:var(--bg);color:var(--text)}
a{text-decoration:none;color:inherit}button{font:inherit}.app-shell{min-height:100vh}.sidebar{position:fixed;z-index:30;left:0;top:0;bottom:0;width:280px;background:linear-gradient(180deg,var(--sidebar),var(--sidebar2));color:#dbe2ed;display:flex;flex-direction:column;transition:.25s}
.brand{height:82px;padding:18px 22px;display:flex;gap:12px;align-items:center;border-bottom:1px solid rgba(255,255,255,.07)}
.brand-mark{width:42px;height:42px;border-radius:13px;background:linear-gradient(135deg,#2f80ff,#7559ff);display:grid;place-items:center;color:#fff;font-weight:800;box-shadow:0 8px 24px rgba(58,95,255,.35)}
.brand strong,.brand small{display:block}.brand strong{color:#fff}.brand small{font-size:11px;color:#8e9bb1;margin-top:4px}
.sidebar-scroll{padding:16px 14px;overflow:auto;flex:1}.menu-label{font-size:10px;letter-spacing:.13em;color:#68768f;text-transform:uppercase;font-weight:800;padding:15px 12px 8px}
.menu-item{width:100%;border:0;background:transparent;color:#aeb9ca;padding:11px 12px;border-radius:10px;display:flex;align-items:center;gap:12px;cursor:pointer;text-align:left;margin:2px 0}
.menu-item>i:first-child{font-size:17px;width:22px}.menu-item span{flex:1}.menu-item .arrow{font-size:12px;transition:.2s}
.menu-item:hover,.menu-item.active{background:rgba(255,255,255,.075);color:#fff}.menu-toggle.open .arrow{transform:rotate(180deg)}
.submenu{display:none;padding:3px 0 7px 46px}.submenu.show{display:block}.submenu a{display:block;color:#8492a8;font-size:13px;padding:8px 0}.submenu a:hover{color:#fff}
.sidebar-user{padding:16px 18px;border-top:1px solid rgba(255,255,255,.07);display:flex;gap:10px;align-items:center}.sidebar-user .avatar{width:37px;height:37px;border-radius:50%;display:grid;place-items:center;background:#253858;color:#fff;font-weight:700}.sidebar-user div:nth-child(2){flex:1}.sidebar-user strong,.sidebar-user small{display:block}.sidebar-user strong{font-size:12px;color:#fff}.sidebar-user small{font-size:10px;color:#7f8ca2;margin-top:3px}
.main{margin-left:280px;min-height:100vh;transition:.25s}.topbar{position:sticky;z-index:20;top:0;height:82px;background:rgba(255,255,255,.91);backdrop-filter:blur(14px);border-bottom:1px solid var(--line);display:flex;align-items:center;justify-content:space-between;padding:0 30px}.topbar-left,.topbar-actions,.breadcrumb{display:flex;align-items:center}.topbar-left{gap:13px}.breadcrumb{gap:8px;font-size:12px;color:var(--muted)}.breadcrumb i{font-size:9px}.breadcrumb strong{color:#344054}
.icon-btn{width:40px;height:40px;border:1px solid var(--line);background:#fff;border-radius:11px;display:grid;place-items:center;color:#596579;cursor:pointer}.mobile-menu{display:none}.topbar-actions{gap:9px}.badge-btn{position:relative}.badge-btn span{position:absolute;right:-4px;top:-5px;min-width:18px;height:18px;padding:0 4px;border-radius:9px;background:#f04438;color:#fff;font-size:10px;display:grid;place-items:center;border:2px solid #fff}.login-btn{height:40px;border-radius:11px;background:#eef4ff;color:#246bfd;padding:0 14px;display:flex;align-items:center;gap:8px;font-size:13px;font-weight:700}
.content{max-width:1540px;margin:auto;padding:30px}.hero{min-height:400px;border-radius:26px;padding:54px;background:linear-gradient(125deg,#14213d 0%,#20386a 55%,#3d4fa3 100%);color:#fff;display:grid;grid-template-columns:1.2fr .8fr;overflow:hidden;position:relative;box-shadow:var(--shadow)}
.hero:before{content:"";position:absolute;width:350px;height:350px;border-radius:50%;background:rgba(85,105,255,.25);filter:blur(20px);right:-70px;top:-100px}.hero-copy,.hero-visual{position:relative;z-index:2}.eyebrow{display:inline-flex;align-items:center;gap:7px;font-size:11px;font-weight:800;letter-spacing:.11em;color:#a8c7ff}.eyebrow.neutral{color:#667085}.eyebrow.light{color:#cfd8ff}.hero h1{max-width:710px;font-size:44px;line-height:1.12;margin:15px 0 15px;letter-spacing:-.035em}.hero p{max-width:660px;line-height:1.8;color:#c7d0e4;font-size:15px}.hero-actions{display:flex;gap:10px;margin-top:25px}.btn{display:inline-flex;align-items:center;justify-content:center;gap:9px;min-height:44px;padding:0 18px;border-radius:12px;font-size:13px;font-weight:750}.btn.primary{background:var(--primary);color:#fff;box-shadow:0 9px 25px rgba(36,107,253,.28)}.btn.ghost{border:1px solid var(--line);background:#fff;color:#344054}.hero .btn.ghost{border-color:rgba(255,255,255,.2);background:rgba(255,255,255,.08);color:#fff}.btn.white{background:#fff;color:#3042a5}.btn.full{width:100%}.hero-stats{display:flex;gap:38px;margin-top:34px}.hero-stats div{display:flex;flex-direction:column}.hero-stats strong{font-size:21px}.hero-stats span{font-size:11px;color:#9ca9c2;margin-top:5px}
.hero-visual{display:grid;place-items:center;min-height:280px}.hero-orb{width:195px;height:195px;border-radius:52px;transform:rotate(12deg);background:linear-gradient(135deg,#2b75ff,#8358ff);box-shadow:0 35px 70px rgba(8,18,51,.42),inset 0 0 40px rgba(255,255,255,.12);display:grid;place-items:center}.hero-orb span{font-size:65px;font-weight:900;transform:rotate(-12deg);letter-spacing:-.09em}.glass-card{position:absolute;width:215px;padding:14px;border:1px solid rgba(255,255,255,.18);border-radius:16px;background:rgba(255,255,255,.1);backdrop-filter:blur(14px);display:flex;align-items:center;gap:10px;box-shadow:0 18px 40px rgba(0,0,0,.16)}.glass-card b,.glass-card small{display:block}.glass-card b{font-size:12px}.glass-card small{font-size:9px;color:#c4cce0;margin-top:3px}.glass-card>div:nth-child(2){flex:1}.card-a{left:0;top:38px}.card-b{right:-8px;bottom:38px}.mini-icon{width:35px;height:35px;border-radius:10px;display:grid;place-items:center;background:#2563eb}.mini-icon.violet{background:#7c3aed}.status-dot{width:8px;height:8px;border-radius:50%;background:#32d583}
.section{padding-top:40px}.section-head{display:flex;justify-content:space-between;align-items:end;margin-bottom:20px}.section-head h2,.panel-head h2{font-size:24px;margin:6px 0 0;letter-spacing:-.025em}.section-head p{color:var(--muted);font-size:13px}.text-link{font-size:12px;font-weight:700;color:var(--primary)}
.service-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:16px}.service-card,.panel,.product-card,.price-card{background:var(--panel);border:1px solid var(--line);border-radius:var(--radius);box-shadow:0 3px 10px rgba(16,24,40,.025)}.service-card{padding:22px;transition:.2s}.service-card:hover,.product-card:hover{transform:translateY(-3px);box-shadow:var(--shadow)}.service-top{display:flex;justify-content:space-between}.status{font-size:10px;font-weight:700;color:#039855;background:#ecfdf3;padding:5px 8px;border-radius:20px}.index{font-size:11px;color:#98a2b3;font-weight:700}.service-icon{margin:18px 0 13px;width:46px;height:46px;border-radius:13px;background:#eef4ff;color:#246bfd;display:grid;place-items:center;font-size:20px}.service-icon.green{background:#ecfdf3;color:#039855}.service-icon.orange{background:#fff6ed;color:#f79009}.service-icon.violet{background:#f4f3ff;color:#6938ef}.pill{display:inline-block;font-size:9px;font-weight:800;padding:4px 7px;border-radius:7px}.pill.gold{color:#b54708;background:#fffaeb}.service-card h3{font-size:15px;line-height:1.4;margin:10px 0 8px}.service-card p{color:var(--muted);font-size:12px;line-height:1.65;min-height:78px}.service-card>a{font-size:11px;font-weight:750;color:var(--primary)}
.dashboard-grid{display:grid;grid-template-columns:1.55fr .75fr;gap:18px;margin-top:40px}.panel{padding:24px}.panel-head{display:flex;justify-content:space-between;align-items:end;margin-bottom:10px}.small-btn,.filter{border:1px solid var(--line);background:#fff;border-radius:9px;padding:8px 11px;font-size:11px;color:#667085;cursor:pointer}.news-item{display:grid;grid-template-columns:58px 1fr;gap:16px;padding:19px 0;border-bottom:1px solid var(--line)}.news-item:last-child{border:0}.datebox{width:56px;height:58px;background:#f7f9fc;border:1px solid var(--line);border-radius:12px;display:grid;place-items:center;padding:7px}.datebox strong{font-size:18px;line-height:1}.datebox span{font-size:8px;color:#98a2b3;font-weight:800}.news-copy h3{font-size:14px;margin:0 0 6px}.news-copy p{font-size:11px;line-height:1.6;color:var(--muted);margin:0}.meta{display:flex;gap:15px;margin-top:8px;color:#98a2b3;font-size:9px}.quick-links a{display:flex;align-items:center;gap:11px;padding:14px 0;border-bottom:1px solid var(--line)}.quick-links a:last-child{border:0}.quick-icon{width:40px;height:40px;border-radius:11px;background:#f2f4f7;color:#475467;display:grid;place-items:center}.quick-links a div{flex:1}.quick-links b,.quick-links small{display:block}.quick-links b{font-size:12px}.quick-links small{font-size:9px;color:#98a2b3;margin-top:4px}.quick-links>a>i{font-size:10px;color:#b0b8c5}
.filters{display:flex;gap:7px}.filter.active{background:#eef4ff;color:var(--primary);border-color:#d5e3ff}.product-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}.product-card{overflow:hidden;transition:.2s}.product-preview{height:165px;display:grid;place-items:center;position:relative;overflow:hidden}.product-preview:before,.product-preview:after{content:"";position:absolute;border-radius:28px;transform:rotate(20deg)}.product-preview:before{width:180px;height:110px;background:rgba(255,255,255,.16);left:-28px;top:22px}.product-preview:after{width:130px;height:130px;border:20px solid rgba(255,255,255,.1);right:-28px;bottom:-36px}.product-preview span{font-size:25px;font-weight:900;color:#fff;letter-spacing:.1em}.p1{background:linear-gradient(135deg,#ff7a18,#e34850)}.p2{background:linear-gradient(135deg,#1a936f,#114b5f)}.p3{background:linear-gradient(135deg,#4656df,#7c4dff)}.product-body{padding:17px}.category{font-size:9px;font-weight:800;color:#667085;text-transform:uppercase}.product-body h3{font-size:14px;margin:7px 0}.stars{font-size:11px;letter-spacing:2px;color:#fdb022}.product-foot{display:flex;justify-content:space-between;align-items:center;margin-top:14px;padding-top:12px;border-top:1px solid var(--line)}.product-foot b{font-size:12px}.product-foot span{font-size:9px;color:#039855;background:#ecfdf3;padding:5px 7px;border-radius:8px}
.centered{justify-content:center;text-align:center}.pricing-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;max-width:1050px;margin:auto}.price-card{padding:26px;position:relative}.price-card.featured{border:2px solid #5c67f2;transform:translateY(-7px);box-shadow:0 22px 50px rgba(92,103,242,.14)}.recommended{position:absolute;right:16px;top:16px;font-size:8px;font-weight:800;color:#fff;background:#665df5;padding:5px 8px;border-radius:20px}.plan{font-size:10px;color:#667085;font-weight:800}.price-card h3{font-size:25px;margin:9px 0 20px}.price-card h3 small{font-size:10px;color:#98a2b3;font-weight:500}.price-card ul{list-style:none;padding:0;margin:0 0 22px}.price-card li{display:flex;gap:9px;align-items:flex-start;font-size:11px;color:#667085;padding:8px 0}.price-card li i{color:#17b26a}
.contact-strip{margin-top:45px;border-radius:22px;padding:32px 38px;background:linear-gradient(115deg,#2f3d97,#5159d8);color:#fff;display:flex;align-items:center;justify-content:space-between}.contact-strip h2{margin:6px 0 7px;font-size:25px}.contact-strip p{margin:0;color:#dbe0ff;font-size:12px}.footer{padding:25px 30px 35px;display:flex;align-items:center;justify-content:space-between;color:#98a2b3;font-size:10px}.footer strong{color:#475467;margin-right:8px}.footer div:last-child{display:flex;gap:18px}.overlay{display:none}
body.sidebar-collapsed .sidebar{width:82px}body.sidebar-collapsed .main{margin-left:82px}body.sidebar-collapsed .brand>span:nth-child(2),body.sidebar-collapsed .menu-label,body.sidebar-collapsed .menu-item span,body.sidebar-collapsed .menu-item .arrow,body.sidebar-collapsed .submenu,body.sidebar-collapsed .sidebar-user>div:nth-child(2),body.sidebar-collapsed .sidebar-user>i{display:none}body.sidebar-collapsed .menu-item{justify-content:center}body.sidebar-collapsed .brand{justify-content:center;padding:18px}body.sidebar-collapsed .sidebar-user{justify-content:center}
@media(max-width:1180px){.service-grid{grid-template-columns:repeat(2,1fr)}.hero{grid-template-columns:1fr}.hero-visual{display:none}.product-grid{grid-template-columns:repeat(2,1fr)}.pricing-grid{grid-template-columns:1fr;max-width:700px}.price-card.featured{transform:none}}
@media(max-width:880px){.sidebar{transform:translateX(-100%)}.sidebar.mobile-open{transform:translateX(0)}.main{margin-left:0}.desktop-collapse{display:none}.mobile-menu{display:grid}.overlay.show{display:block;position:fixed;z-index:25;inset:0;background:rgba(16,24,40,.5)}.dashboard-grid{grid-template-columns:1fr}.hero{padding:35px}.hero h1{font-size:36px}.content{padding:20px}.breadcrumb{display:none}}
@media(max-width:620px){.topbar{height:70px;padding:0 15px}.content{padding:14px}.hero{padding:28px 22px;border-radius:19px}.hero h1{font-size:30px}.hero-stats{gap:17px;flex-wrap:wrap}.service-grid,.product-grid{grid-template-columns:1fr}.section-head{align-items:flex-start;gap:15px;flex-direction:column}.filters{max-width:100%;overflow:auto}.contact-strip{padding:25px;align-items:flex-start;gap:20px;flex-direction:column}.footer{gap:15px;align-items:flex-start;flex-direction:column}.login-btn span{display:none}}


/* =========================
   TOP NAVIGATION UPGRADE
   ========================= */
.topbar{overflow:visible}
.topbar-left{min-width:0}
.top-brand{display:none;align-items:center;gap:9px;margin-right:4px}
.top-brand-mark{width:34px;height:34px;border-radius:10px;display:grid;place-items:center;background:linear-gradient(135deg,#246bfd,#7756ff);color:#fff;font-size:11px;font-weight:900;box-shadow:0 8px 20px rgba(36,107,253,.22)}
.top-brand b,.top-brand small{display:block}.top-brand b{font-size:12px}.top-brand small{font-size:8px;color:#98a2b3;margin-top:1px}

.top-menu{height:82px;display:flex;align-items:stretch;gap:2px;margin-left:5px}
.top-link{position:relative;height:100%;border:0;background:transparent;color:#667085;padding:0 12px;display:flex;align-items:center;gap:7px;font-size:12px;font-weight:700;cursor:pointer;white-space:nowrap}
.top-link>i:first-child{font-size:14px}.top-link .chev{font-size:9px;margin-left:1px;transition:.2s}
.top-link:hover,.top-link.active,.top-dropdown.open>.top-link{color:#246bfd}
.top-link:after{content:"";position:absolute;left:12px;right:12px;bottom:0;height:3px;border-radius:3px 3px 0 0;background:linear-gradient(90deg,#246bfd,#765bff);transform:scaleX(0);transition:.2s}
.top-link:hover:after,.top-link.active:after,.top-dropdown.open>.top-link:after{transform:scaleX(1)}
.top-dropdown{position:relative;height:100%}.top-dropdown.open .chev{transform:rotate(180deg)}
.top-dropdown-menu{position:absolute;z-index:50;left:0;top:calc(100% + 10px);width:310px;padding:12px;background:#fff;border:1px solid #e7ebf2;border-radius:16px;box-shadow:0 20px 55px rgba(16,24,40,.14);opacity:0;visibility:hidden;transform:translateY(-8px) scale(.985);transform-origin:top left;transition:.18s}
.top-dropdown-menu:before{content:"";position:absolute;left:24px;top:-6px;width:12px;height:12px;background:#fff;border-left:1px solid #e7ebf2;border-top:1px solid #e7ebf2;transform:rotate(45deg)}
.top-dropdown.open>.top-dropdown-menu{opacity:1;visibility:visible;transform:translateY(0) scale(1)}
.dropdown-title,.mega-label{font-size:9px;font-weight:850;color:#98a2b3;letter-spacing:.11em;padding:7px 9px 8px}
.top-dropdown-menu>a,.mega-column>a{position:relative;display:flex;gap:11px;align-items:center;padding:10px;border-radius:11px;color:#475467}
.top-dropdown-menu>a:hover,.mega-column>a:hover{background:#f6f8fc;color:#246bfd}
.top-dropdown-menu b,.top-dropdown-menu small,.mega-column b,.mega-column small{display:block}
.top-dropdown-menu b,.mega-column b{font-size:11px}.top-dropdown-menu small,.mega-column small{font-size:8.5px;color:#98a2b3;margin-top:3px;font-weight:500}
.drop-icon{width:36px;height:36px;border-radius:10px;display:grid;place-items:center;background:#eef4ff;color:#246bfd;font-size:15px;flex:0 0 auto}
.drop-icon.violet{background:#f4f3ff;color:#6938ef}.drop-icon.green{background:#ecfdf3;color:#039855}
.dropdown-footer{border-top:1px solid #edf0f5;margin-top:7px;padding:10px 8px 2px}.dropdown-footer a{font-size:10px;color:#246bfd;font-weight:750}
.course-menu{width:330px}.course-menu>a>i{width:30px;height:30px;border-radius:9px;background:#f5f7fb;display:grid;place-items:center;color:#667085}
.mega{position:static}.mega-menu{left:50%;transform:translate(-50%,-8px) scale(.985);width:min(760px,calc(100vw - 330px));display:grid;grid-template-columns:1fr 1fr 230px;gap:10px;padding:16px;transform-origin:top center}.mega.open>.mega-menu{transform:translate(-50%,0) scale(1)}
.mega-menu:before{display:none}.mega-column{padding:2px}.mega-column>a>i{width:34px;height:34px;border-radius:10px;background:#f5f7fb;color:#667085;display:grid;place-items:center;flex:0 0 auto}
.mega-promo{border-radius:14px;background:linear-gradient(145deg,#14213d,#304aa4);color:#fff;padding:20px;display:flex;flex-direction:column;justify-content:flex-end;min-height:210px;overflow:hidden;position:relative}.mega-promo:before{content:"MT";position:absolute;right:-8px;top:-20px;font-size:92px;font-weight:900;color:rgba(255,255,255,.07);letter-spacing:-.08em}.mega-promo span{font-size:9px;color:#adc8ff;font-weight:800;letter-spacing:.12em}.mega-promo h4{font-size:16px;line-height:1.45;margin:9px 0 22px}.mega-promo a{font-size:10px;color:#fff;font-weight:750}

/* Logged-in cPanel */
.user-cpanel{position:relative}
.cpanel-toggle{border:1px solid #e7ebf2;background:#fff;border-radius:13px;height:48px;padding:4px 9px 4px 5px;display:flex;align-items:center;gap:8px;cursor:pointer;transition:.2s}.cpanel-toggle:hover,.user-cpanel.open .cpanel-toggle{border-color:#cddcff;box-shadow:0 7px 20px rgba(16,24,40,.07)}
.online-avatar,.cpanel-avatar{width:36px;height:36px;border-radius:11px;background:linear-gradient(135deg,#246bfd,#765bff);color:#fff;display:grid;place-items:center;font-size:10px;font-weight:900;position:relative}.online-dot{position:absolute;right:-2px;bottom:-2px;width:10px;height:10px;border:2px solid #fff;border-radius:50%;background:#17b26a}
.cpanel-name{text-align:left;min-width:92px}.cpanel-name b,.cpanel-name small{display:block}.cpanel-name b{font-size:10.5px;color:#344054}.cpanel-name small{font-size:7.5px;color:#98a2b3;margin-top:2px}.cpanel-toggle>i{font-size:9px;color:#98a2b3;transition:.2s}.user-cpanel.open .cpanel-toggle>i{transform:rotate(180deg)}
.cpanel-menu{position:absolute;z-index:55;right:0;top:calc(100% + 10px);width:320px;background:#fff;border:1px solid #e7ebf2;border-radius:17px;box-shadow:0 22px 60px rgba(16,24,40,.16);padding:12px;opacity:0;visibility:hidden;transform:translateY(-8px) scale(.985);transform-origin:top right;transition:.18s}.user-cpanel.open .cpanel-menu{opacity:1;visibility:visible;transform:translateY(0) scale(1)}
.cpanel-head{display:flex;align-items:center;gap:10px;padding:8px}.cpanel-head>div{flex:1}.cpanel-head b,.cpanel-head small{display:block}.cpanel-head b{font-size:12px}.cpanel-head small{font-size:8px;color:#98a2b3;margin-top:2px}.member-badge{font-size:7px;font-weight:900;background:#fffaeb;color:#b54708;padding:5px 7px;border-radius:8px}
.cpanel-stats{display:grid;grid-template-columns:repeat(3,1fr);background:#f7f9fc;border:1px solid #edf0f5;border-radius:12px;margin:7px 3px 10px}.cpanel-stats div{text-align:center;padding:10px 4px}.cpanel-stats div+div{border-left:1px solid #e9edf3}.cpanel-stats b,.cpanel-stats small{display:block}.cpanel-stats b{font-size:11px}.cpanel-stats small{font-size:7px;color:#98a2b3;margin-top:2px}
.cpanel-group{padding:3px}.cpanel-group>span{display:block;font-size:7.5px;color:#98a2b3;font-weight:850;letter-spacing:.11em;padding:8px 8px 5px}.cpanel-group>a{display:flex;align-items:center;gap:10px;padding:9px 8px;border-radius:10px;font-size:10px;color:#475467}.cpanel-group>a:hover{background:#f6f8fc;color:#246bfd}.cpanel-group>a>i:first-child{width:28px;height:28px;border-radius:8px;background:#f5f7fb;display:grid;place-items:center}.cpanel-group>a>span:nth-child(2){flex:1}.cpanel-group>a>i:last-child{font-size:8px;color:#b2bac6}.count-badge{flex:0 0 auto!important;font-size:7px;background:#eef4ff;color:#246bfd;padding:4px 6px;border-radius:7px}
.cpanel-logout{border-top:1px solid #edf0f5;margin-top:6px;padding:10px 7px 2px}.cpanel-logout a{display:flex;gap:8px;align-items:center;font-size:10px;font-weight:750;color:#d92d20}

/* Header search */
.top-search-panel{position:absolute;z-index:60;left:50%;top:50%;width:min(640px,calc(100% - 60px));height:52px;transform:translate(-50%,-50%) scale(.98);background:#fff;border:1px solid #dce3ec;border-radius:14px;box-shadow:0 18px 60px rgba(16,24,40,.16);display:flex;align-items:center;gap:12px;padding:0 14px;opacity:0;visibility:hidden;transition:.16s}.top-search-panel.show{opacity:1;visibility:visible;transform:translate(-50%,-50%) scale(1)}.top-search-panel>i{color:#98a2b3}.top-search-panel input{flex:1;border:0;outline:0;font-size:12px;color:#344054}.top-search-panel kbd{font:700 8px Inter;background:#f2f4f7;border:1px solid #e4e7ec;color:#98a2b3;border-radius:6px;padding:4px 6px}

/* Floating contact stack */
.floating-actions{position:fixed;z-index:80;right:20px;bottom:22px;display:flex;flex-direction:column;align-items:flex-end;gap:10px}
.contact-stack{display:flex;flex-direction:column;gap:9px;align-items:flex-end;opacity:1;transform:translateY(0);transition:.22s}
.float-contact{position:relative;width:46px;height:46px;border-radius:15px;display:grid;place-items:center;color:#fff;font-size:17px;box-shadow:0 10px 24px rgba(16,24,40,.18);transition:.18s}.float-contact:hover{transform:translateY(-2px) scale(1.04)}
.float-contact.zalo{background:linear-gradient(135deg,#0a7cff,#0760d8)}.float-contact.messenger{background:linear-gradient(135deg,#7356ff,#2f7bf6)}.float-contact.phone{background:linear-gradient(135deg,#18b663,#0b8f4c);animation:contactPulse 2.2s infinite}.float-contact.email{background:linear-gradient(135deg,#f79009,#e76808)}
.float-tooltip{position:absolute;right:56px;top:50%;transform:translateY(-50%) translateX(5px);white-space:nowrap;background:#101828;color:#fff;font-size:9px;font-weight:700;padding:7px 9px;border-radius:8px;opacity:0;visibility:hidden;transition:.15s;pointer-events:none}.float-tooltip:after{content:"";position:absolute;right:-4px;top:50%;width:8px;height:8px;background:#101828;transform:translateY(-50%) rotate(45deg)}.float-contact:hover .float-tooltip{opacity:1;visibility:visible;transform:translateY(-50%) translateX(0)}
.contact-master{height:48px;border:0;border-radius:16px;background:#101828;color:#fff;box-shadow:0 12px 30px rgba(16,24,40,.25);display:flex;align-items:center;gap:8px;padding:0 15px;cursor:pointer;font-weight:800;font-size:11px}.contact-master i{font-size:16px}.floating-actions.collapsed .contact-stack{opacity:0;pointer-events:none;transform:translateY(12px);max-height:0;overflow:hidden}

/* Back to top */
.back-to-top{position:fixed;z-index:78;right:22px;bottom:290px;width:42px;height:42px;border:1px solid #e3e8f0;border-radius:13px;background:rgba(255,255,255,.95);backdrop-filter:blur(10px);color:#344054;box-shadow:0 10px 25px rgba(16,24,40,.1);display:grid;place-items:center;cursor:pointer;opacity:0;visibility:hidden;transform:translateY(10px);transition:.2s}.back-to-top.show{opacity:1;visibility:visible;transform:translateY(0)}.back-to-top:hover{background:#246bfd;color:#fff;border-color:#246bfd;transform:translateY(-2px)}
@keyframes contactPulse{0%,100%{box-shadow:0 10px 24px rgba(16,24,40,.18),0 0 0 0 rgba(23,178,106,.25)}50%{box-shadow:0 10px 24px rgba(16,24,40,.18),0 0 0 8px rgba(23,178,106,0)}}

@media(min-width:1350px){.top-brand{display:flex}}
@media(max-width:1280px){.top-menu .top-link{padding:0 8px;font-size:11px}.top-brand{display:none}.cpanel-name{display:none}.cpanel-toggle{padding-right:6px}}
@media(max-width:1040px){.top-menu{display:none}.top-brand{display:flex}.mega-menu{width:680px}.topbar-actions{margin-left:auto}}
@media(max-width:620px){.top-brand span:nth-child(2){display:none}.top-search-btn{display:none}.cpanel-name{display:none}.cpanel-menu{position:fixed;right:10px;left:10px;top:76px;width:auto}.floating-actions{right:13px;bottom:14px}.contact-master span{display:none}.contact-master{width:48px;padding:0;justify-content:center}.back-to-top{right:16px;bottom:280px}}


/* =========================
   SETTINGS DRAWER + COOKIES
   ========================= */
.settings-fab{
  position:fixed;z-index:82;right:20px;bottom:342px;height:46px;border:0;border-radius:15px;
  background:linear-gradient(135deg,#ffffff,#f7f9fc);color:#344054;
  box-shadow:0 12px 28px rgba(16,24,40,.14);border:1px solid #e7ebf2;
  display:flex;align-items:center;gap:8px;padding:0 14px;cursor:pointer;font-weight:800;font-size:10px;
  transition:.2s
}
.settings-fab:hover{transform:translateY(-2px);border-color:var(--primary);color:var(--primary)}
.settings-fab i{font-size:15px;animation:settingsSpin 7s linear infinite}
@keyframes settingsSpin{to{transform:rotate(360deg)}}

.settings-drawer{
  position:fixed;z-index:100;top:0;right:0;bottom:0;width:390px;max-width:calc(100vw - 20px);
  background:#fff;border-left:1px solid #e7ebf2;box-shadow:-22px 0 60px rgba(16,24,40,.16);
  transform:translateX(105%);transition:.26s ease;display:flex;flex-direction:column
}
.settings-drawer.open{transform:translateX(0)}
.settings-header{height:82px;padding:0 20px;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid #edf0f5}
.settings-header h3{margin:4px 0 0;font-size:18px}
.settings-close{width:38px;height:38px;border:1px solid #e7ebf2;border-radius:11px;background:#fff;color:#667085;display:grid;place-items:center;cursor:pointer}
.settings-body{padding:18px;overflow:auto;flex:1}
.setting-section{padding:16px 0;border-bottom:1px solid #edf0f5}
.setting-section:first-child{padding-top:0}
.setting-title{display:flex;align-items:center;justify-content:space-between;margin-bottom:12px}
.setting-title b,.setting-title small,.setting-row b,.setting-row small{display:block}
.setting-title b,.setting-row b{font-size:11px;color:#344054}
.setting-title small,.setting-row small{font-size:8.5px;color:#98a2b3;margin-top:3px;line-height:1.45}

.segmented{display:grid;grid-template-columns:repeat(3,1fr);gap:7px}
.segmented button{
  min-height:38px;border:1px solid #e5eaf0;border-radius:10px;background:#fff;color:#667085;
  font-size:9px;font-weight:750;cursor:pointer;display:flex;align-items:center;justify-content:center;gap:6px
}
.segmented button.active{background:#eef4ff;border-color:#cddcff;color:var(--primary);box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--primary) 10%,transparent)}

.toggle-list{display:flex;flex-direction:column;gap:2px}
.setting-row{display:flex;align-items:center;gap:12px;padding:10px 0;cursor:pointer}
.setting-row>span{flex:1}
.setting-row input{position:absolute;opacity:0;pointer-events:none}
.switch-ui{width:42px;height:23px;border-radius:20px;background:#d0d5dd;position:relative;transition:.2s;flex:0 0 auto}
.switch-ui:after{content:"";position:absolute;top:3px;left:3px;width:17px;height:17px;border-radius:50%;background:#fff;box-shadow:0 2px 5px rgba(16,24,40,.18);transition:.2s}
.setting-row input:checked + .switch-ui{background:var(--primary)}
.setting-row input:checked + .switch-ui:after{transform:translateX(19px)}

.accent-grid{display:grid;grid-template-columns:repeat(5,1fr);gap:9px}
.accent-grid button{height:40px;border-radius:11px;border:3px solid transparent;cursor:pointer;position:relative}
.accent-grid button.active:after{content:"✓";position:absolute;inset:0;display:grid;place-items:center;color:#fff;font-weight:900;font-size:13px}
.accent-grid button[data-accent="blue"]{background:#246bfd}
.accent-grid button[data-accent="violet"]{background:#7a5af8}
.accent-grid button[data-accent="green"]{background:#17b26a}
.accent-grid button[data-accent="orange"]{background:#f79009}
.accent-grid button[data-accent="red"]{background:#f04438}

.settings-note{margin-top:16px;border-radius:12px;background:#f7f9fc;border:1px solid #edf0f5;padding:12px;display:flex;gap:9px;color:#667085;font-size:9px;line-height:1.5}
.settings-note i{color:var(--primary);font-size:15px}
.settings-footer{padding:14px 18px;border-top:1px solid #edf0f5}
.reset-settings{width:100%;height:42px;border:1px solid #e7ebf2;border-radius:11px;background:#fff;color:#475467;font-size:10px;font-weight:800;cursor:pointer}
.reset-settings:hover{background:#f7f9fc;color:#d92d20}
.settings-backdrop{position:fixed;z-index:95;inset:0;background:rgba(16,24,40,.38);backdrop-filter:blur(2px);opacity:0;visibility:hidden;transition:.2s}
.settings-backdrop.show{opacity:1;visibility:visible}

/* Theme states */
body.theme-dark{--bg:#0f1724;--panel:#151f2f;--text:#e5ebf5;--muted:#94a3b8;--line:#243247;--sidebar:#0b1220;--sidebar2:#111b2c}
body.theme-dark .topbar,
body.theme-dark .service-card,
body.theme-dark .panel,
body.theme-dark .product-card,
body.theme-dark .price-card,
body.theme-dark .settings-drawer,
body.theme-dark .top-dropdown-menu,
body.theme-dark .cpanel-menu,
body.theme-dark .icon-btn,
body.theme-dark .cpanel-toggle,
body.theme-dark .top-search-panel{background:#151f2f;color:#e5ebf5;border-color:#243247}
body.theme-dark .top-link,
body.theme-dark .cpanel-name b,
body.theme-dark .service-card h3,
body.theme-dark .news-copy h3,
body.theme-dark .product-body h3,
body.theme-dark .setting-title b,
body.theme-dark .setting-row b{color:#dfe7f3}
body.theme-dark .top-link:hover,
body.theme-dark .top-link.active{color:var(--primary)}
body.theme-dark .setting-section,
body.theme-dark .settings-header,
body.theme-dark .settings-footer,
body.theme-dark .news-item,
body.theme-dark .product-foot,
body.theme-dark .cpanel-group,
body.theme-dark .cpanel-logout{border-color:#243247}
body.theme-dark .segmented button,
body.theme-dark .settings-close,
body.theme-dark .reset-settings{background:#111a28;color:#c5cfdd;border-color:#2a3950}
body.theme-dark .segmented button.active{background:color-mix(in srgb,var(--primary) 18%,#111a28)}
body.theme-dark .settings-note,
body.theme-dark .cpanel-stats{background:#111a28;border-color:#243247}
body.theme-dark .footer strong{color:#d2dae7}

body.density-compact .content{padding:20px}
body.density-compact .service-card,
body.density-compact .panel,
body.density-compact .price-card{padding:18px}
body.density-comfortable .content{padding:40px}
body.density-comfortable .service-grid,
body.density-comfortable .product-grid,
body.density-comfortable .pricing-grid{gap:24px}

body.no-animations *,body.no-animations *:before,body.no-animations *:after{
  animation:none!important;transition:none!important;scroll-behavior:auto!important
}
body.hide-contacts .floating-actions{display:none}
body.header-static .topbar{position:relative}

@media(max-width:620px){
  .settings-fab{right:13px;bottom:332px;width:46px;padding:0;justify-content:center}
  .settings-fab span{display:none}
  .settings-drawer{width:calc(100vw - 10px)}
}


/* =========================
   KHO GIAO DIEN ALL
   ========================= */
.catalog-page{max-width:1540px}
.catalog-hero{position:relative;overflow:hidden;min-height:280px;border-radius:24px;padding:38px 42px;display:grid;grid-template-columns:1.25fr .75fr;align-items:center;background:linear-gradient(130deg,#14213d,#263d7d 60%,#4c49a8);color:#fff;box-shadow:var(--shadow)}
.catalog-hero:before{content:"";position:absolute;width:320px;height:320px;border-radius:50%;background:rgba(87,105,255,.22);right:-70px;top:-120px;filter:blur(14px)}
.catalog-breadcrumb{display:flex;align-items:center;gap:8px;font-size:9px;color:#aab7cf;margin-bottom:20px}.catalog-breadcrumb i{font-size:7px}.catalog-breadcrumb a:hover{color:#fff}
.catalog-hero h1{font-size:38px;margin:8px 0 10px;letter-spacing:-.04em}.catalog-hero p{max-width:680px;color:#c9d2e4;font-size:12px;line-height:1.8}
.catalog-hero-stats{display:flex;gap:28px;margin-top:22px}.catalog-hero-stats div{display:flex;flex-direction:column}.catalog-hero-stats b{font-size:17px}.catalog-hero-stats small{font-size:8px;color:#9eabc3;margin-top:3px}
.catalog-hero-art{min-height:190px;display:grid;place-items:center;position:relative}.catalog-window{width:210px;height:145px;border:1px solid rgba(255,255,255,.18);background:rgba(255,255,255,.10);backdrop-filter:blur(12px);border-radius:18px;box-shadow:0 28px 60px rgba(0,0,0,.24);display:flex;flex-direction:column;justify-content:center;align-items:center;position:relative;z-index:2;transform:rotate(-4deg)}.catalog-window-top{position:absolute;top:0;left:0;right:0;height:30px;border-bottom:1px solid rgba(255,255,255,.13);display:flex;align-items:center;gap:5px;padding:0 10px}.catalog-window-top i{width:6px;height:6px;border-radius:50%;background:rgba(255,255,255,.35)}.catalog-window b{font-size:46px;letter-spacing:-.08em}.catalog-window small{font-size:8px;letter-spacing:.18em;color:#bdc8e0}
.catalog-orbit{position:absolute;border:1px solid rgba(255,255,255,.12);border-radius:50%}.orbit-a{width:280px;height:140px;transform:rotate(20deg)}.orbit-b{width:160px;height:260px;transform:rotate(50deg)}
.catalog-panel{margin-top:22px;padding:22px;background:var(--panel);border:1px solid var(--line);border-radius:18px}.catalog-heading{display:flex;align-items:end;justify-content:space-between;margin-bottom:14px}.catalog-heading h2{font-size:18px;margin:5px 0 0}.catalog-filter-toggle{display:none;border:1px solid var(--line);background:var(--panel);color:var(--text);border-radius:10px;padding:9px 11px;font-size:9px}
.catalog-chips{display:flex;gap:7px;flex-wrap:wrap}.catalog-chip{border:1px solid var(--line);background:var(--panel);color:var(--muted);border-radius:10px;padding:8px 10px;font-size:8.5px;font-weight:700;cursor:pointer;transition:.15s}.catalog-chip:hover,.catalog-chip.active{background:color-mix(in srgb,var(--primary) 9%,var(--panel));border-color:color-mix(in srgb,var(--primary) 28%,var(--line));color:var(--primary)}
.catalog-toolbar{display:flex;align-items:center;justify-content:space-between;gap:14px;margin-top:16px}.catalog-search{height:44px;max-width:480px;flex:1;border:1px solid var(--line);background:var(--panel);border-radius:12px;display:flex;align-items:center;gap:9px;padding:0 12px}.catalog-search>i{color:#98a2b3}.catalog-search input{flex:1;border:0;outline:0;background:transparent;color:var(--text);font-size:10px}.catalog-search button{border:0;background:transparent;color:#98a2b3;cursor:pointer}.catalog-toolbar-right{display:flex;gap:9px}.catalog-toolbar select{height:44px;border:1px solid var(--line);background:var(--panel);color:var(--text);border-radius:11px;padding:0 12px;font-size:9px;outline:0}.view-switch{display:flex;border:1px solid var(--line);background:var(--panel);border-radius:11px;padding:4px}.view-switch button{width:34px;border:0;background:transparent;color:#98a2b3;border-radius:8px;cursor:pointer}.view-switch button.active{background:#eef4ff;color:var(--primary)}
.catalog-summary{display:flex;justify-content:space-between;align-items:center;margin:18px 1px 11px;color:var(--muted);font-size:9px}.catalog-summary b{color:var(--text)}.catalog-active-filter{background:#eef4ff;color:var(--primary);padding:6px 8px;border-radius:8px;font-weight:750}
.catalog-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:15px}.catalog-card{background:var(--panel);border:1px solid var(--line);border-radius:16px;overflow:hidden;transition:.2s;box-shadow:0 3px 10px rgba(16,24,40,.025)}.catalog-card:hover{transform:translateY(-3px);box-shadow:var(--shadow)}
.catalog-preview{height:145px;position:relative;display:grid;place-items:center;overflow:hidden}.catalog-preview:after{content:"";position:absolute;width:170px;height:90px;border:18px solid rgba(255,255,255,.10);border-radius:28px;right:-55px;bottom:-45px;transform:rotate(25deg)}.preview-code{font-size:20px;color:#fff;font-weight:900;letter-spacing:.1em;z-index:2}.browser-mock{position:absolute;left:12px;top:10px;display:flex;gap:4px}.browser-mock span{width:5px;height:5px;background:rgba(255,255,255,.45);border-radius:50%}.catalog-id{position:absolute;right:10px;top:9px;color:rgba(255,255,255,.7);font-size:7px;font-weight:800}
.preview-shop{background:linear-gradient(135deg,#ff7a18,#d9485f)}.preview-game{background:linear-gradient(135deg,#273c75,#6c5ce7)}.preview-bike{background:linear-gradient(135deg,#0f766e,#0ea5e9)}.preview-food{background:linear-gradient(135deg,#e17055,#d63031)}.preview-company{background:linear-gradient(135deg,#34495e,#2d6cdf)}.preview-blog{background:linear-gradient(135deg,#7c3aed,#db2777)}.preview-health{background:linear-gradient(135deg,#00a884,#38bdf8)}.preview-pc{background:linear-gradient(135deg,#111827,#475569)}.preview-news{background:linear-gradient(135deg,#e67e22,#c0392b)}.preview-sport{background:linear-gradient(135deg,#16a085,#14532d)}.preview-car{background:linear-gradient(135deg,#334155,#b91c1c)}.preview-mobile{background:linear-gradient(135deg,#2563eb,#7c3aed)}.preview-realestate{background:linear-gradient(135deg,#0f766e,#65a30d)}.preview-school{background:linear-gradient(135deg,#2563eb,#06b6d4)}.preview-media{background:linear-gradient(135deg,#9333ea,#ec4899)}.preview-admin{background:linear-gradient(135deg,#334155,#6366f1)}.preview-landing{background:linear-gradient(135deg,#f59e0b,#ef4444)}.preview-travel{background:linear-gradient(135deg,#0891b2,#2563eb)}.preview-fashion{background:linear-gradient(135deg,#be185d,#7c3aed)}.preview-it{background:linear-gradient(135deg,#0f172a,#2563eb)}
.catalog-card-body{padding:14px}.catalog-meta{display:flex;justify-content:space-between;gap:8px;color:#667085;font-size:7.5px}.stock-dot{color:#039855;display:flex;align-items:center;gap:4px}.stock-dot i{width:5px;height:5px;background:#17b26a;border-radius:50%}.catalog-card h3{font-size:11px;line-height:1.45;margin:8px 0 6px;min-height:32px}.catalog-rating{display:flex;align-items:center;gap:7px}.catalog-rating span{font-size:8px;color:#fdb022;letter-spacing:1px}.catalog-rating small{font-size:7px;color:#98a2b3}.catalog-price-row{display:flex;align-items:end;justify-content:space-between;gap:10px;border-top:1px solid var(--line);margin-top:10px;padding-top:10px}.catalog-price-row small,.catalog-price-row b{display:block}.catalog-price-row small{font-size:7px;color:#98a2b3}.catalog-price-row b{font-size:10px;margin-top:2px}.catalog-actions{display:flex;gap:6px}.preview-btn,.detail-btn{height:30px;border-radius:8px;font-size:8px;display:flex;align-items:center;justify-content:center}.preview-btn{width:30px;border:1px solid var(--line);background:var(--panel);color:#667085;cursor:pointer}.detail-btn{padding:0 9px;background:var(--primary);color:#fff;font-weight:750}
.catalog-grid.list-view{grid-template-columns:1fr}.catalog-grid.list-view .catalog-card{display:grid;grid-template-columns:190px 1fr}.catalog-grid.list-view .catalog-preview{height:100%}.catalog-grid.list-view .catalog-card h3{min-height:auto;font-size:12px}
.catalog-empty{display:none;text-align:center;padding:50px 20px;background:var(--panel);border:1px dashed var(--line);border-radius:16px}.catalog-empty.show{display:block}.catalog-empty i{font-size:30px;color:#98a2b3}.catalog-empty h3{font-size:14px}.catalog-empty p{font-size:9px;color:var(--muted)}.catalog-empty button{border:0;background:var(--primary);color:#fff;border-radius:9px;padding:9px 12px;font-size:9px;cursor:pointer}
.catalog-pagination{display:flex;justify-content:center;align-items:center;gap:5px;margin:28px 0 10px}.catalog-pagination button{min-width:34px;height:34px;border:1px solid var(--line);background:var(--panel);color:#667085;border-radius:9px;font-size:9px;cursor:pointer}.catalog-pagination button.active{background:var(--primary);border-color:var(--primary);color:#fff}.catalog-pagination button:disabled{opacity:.4}
body.theme-dark .catalog-panel,body.theme-dark .catalog-card,body.theme-dark .catalog-search,body.theme-dark .catalog-toolbar select,body.theme-dark .view-switch{background:var(--panel)}
@media(max-width:1280px){.catalog-grid{grid-template-columns:repeat(3,1fr)}}
@media(max-width:900px){.catalog-grid{grid-template-columns:repeat(2,1fr)}.catalog-hero{grid-template-columns:1fr}.catalog-hero-art{display:none}}
@media(max-width:620px){.catalog-hero{padding:26px 20px}.catalog-hero h1{font-size:30px}.catalog-grid{grid-template-columns:1fr}.catalog-toolbar{align-items:stretch;flex-direction:column}.catalog-search{max-width:none;width:100%}.catalog-toolbar-right{justify-content:space-between}.catalog-toolbar select{flex:1}.catalog-filter-toggle{display:block}.catalog-chips.mobile-collapsed{display:none}.catalog-grid.list-view .catalog-card{grid-template-columns:1fr}.catalog-grid.list-view .catalog-preview{height:130px}}


/* =========================
   CATEGORY: WEBSITE TIN TUC
   ========================= */
.catalog-chip-link{display:inline-flex;align-items:center}
.news-cat-hero{position:relative;overflow:hidden;min-height:310px;border-radius:24px;padding:40px 44px;display:grid;grid-template-columns:1.2fr .8fr;align-items:center;background:linear-gradient(125deg,#121c34,#243f73 58%,#1f6a8a);color:#fff;box-shadow:var(--shadow)}
.news-cat-hero:after{content:"";position:absolute;width:310px;height:310px;border-radius:50%;right:-70px;top:-120px;background:rgba(76,190,255,.13);filter:blur(8px)}
.news-cat-copy{position:relative;z-index:2}.news-cat-hero h1{font-size:40px;letter-spacing:-.045em;margin:10px 0 12px}.news-cat-hero p{max-width:700px;color:#c8d5e6;font-size:12px;line-height:1.8}.news-cat-actions{display:flex;gap:9px;margin-top:22px}
.news-cat-visual{min-height:220px;display:grid;place-items:center;position:relative;z-index:2}.news-screen{width:270px;height:185px;border:1px solid rgba(255,255,255,.18);border-radius:17px;background:rgba(255,255,255,.09);backdrop-filter:blur(12px);box-shadow:0 28px 60px rgba(0,0,0,.25);transform:rotate(3deg);padding:13px}.news-screen-bar{height:18px;display:flex;gap:4px}.news-screen-bar i{width:5px;height:5px;border-radius:50%;background:rgba(255,255,255,.45)}.news-screen-layout{display:grid;grid-template-columns:1.7fr .8fr;gap:8px;height:135px}.news-screen-main,.news-screen-side{display:flex;flex-direction:column;gap:6px}.news-screen-main span{height:72px;border-radius:8px;background:linear-gradient(135deg,rgba(59,130,246,.7),rgba(124,58,237,.55))}.news-screen-main b{height:10px;border-radius:5px;background:rgba(255,255,255,.18)}.news-screen-main b:last-child{width:65%}.news-screen-side b{height:28px;border-radius:6px;background:rgba(255,255,255,.13)}.news-float-tag{position:absolute;border:1px solid rgba(255,255,255,.18);background:rgba(15,30,57,.72);backdrop-filter:blur(10px);padding:8px 10px;border-radius:10px;font-size:8px;font-weight:800;box-shadow:0 12px 26px rgba(0,0,0,.16)}.tag-a{left:12px;top:25px}.tag-b{right:3px;bottom:28px}
.news-info-section{display:grid;grid-template-columns:1.55fr .7fr;gap:18px;margin-top:22px}.news-info-main,.news-info-side{background:var(--panel);border:1px solid var(--line);border-radius:18px}.news-info-main{padding:27px}.news-info-main h2{font-size:23px;margin:7px 0 8px}.news-info-lead{font-size:11px;color:var(--muted);line-height:1.8;max-width:850px}.news-info-features{display:grid;grid-template-columns:repeat(2,1fr);gap:10px;margin-top:20px}.news-info-features>div{display:flex;gap:10px;align-items:flex-start;padding:12px;border-radius:12px;background:#f8fafc;border:1px solid #edf1f5}.feature-icon{width:35px;height:35px;border-radius:10px;background:#eef4ff;color:var(--primary);display:grid;place-items:center;flex:0 0 auto}.news-info-features b,.news-info-features small{display:block}.news-info-features b{font-size:10px}.news-info-features small{font-size:8px;color:#98a2b3;line-height:1.5;margin-top:3px}
.news-info-side{padding:20px}.info-side-head{display:flex;gap:10px;align-items:center;padding-bottom:13px;border-bottom:1px solid var(--line)}.info-side-icon{width:38px;height:38px;border-radius:11px;background:linear-gradient(135deg,var(--primary),var(--primary2));color:#fff;display:grid;place-items:center}.info-side-head b,.info-side-head small{display:block}.info-side-head b{font-size:11px}.info-side-head small{font-size:8px;color:#98a2b3;margin-top:2px}.news-info-side ul{list-style:none;padding:5px 0;margin:0}.news-info-side li{display:flex;justify-content:space-between;gap:10px;padding:9px 0;border-bottom:1px solid var(--line);font-size:8.5px}.news-info-side li span{color:#98a2b3}.news-info-side li b{text-align:right}.info-side-note{display:flex;gap:8px;background:#ecfdf3;color:#05603a;padding:10px;border-radius:10px;margin-top:10px}.info-side-note i{font-size:13px}.info-side-note p{font-size:7.8px;line-height:1.5;margin:0}.info-contact-btn{height:38px;border-radius:10px;background:var(--primary);color:#fff;display:flex;align-items:center;justify-content:center;gap:7px;margin-top:12px;font-size:9px;font-weight:800}
.news-usecases{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;margin-top:18px}.news-usecase{display:flex;gap:10px;align-items:center;padding:14px;background:var(--panel);border:1px solid var(--line);border-radius:14px}.news-usecase>i{width:36px;height:36px;border-radius:10px;background:#f3f6fa;color:var(--primary);display:grid;place-items:center}.news-usecase b,.news-usecase small{display:block}.news-usecase b{font-size:9.5px}.news-usecase small{font-size:7.5px;color:#98a2b3;margin-top:3px}
.news-products-section{padding-top:32px}.news-catalog-toolbar{display:grid;grid-template-columns:minmax(260px,1fr) auto 155px;gap:10px;align-items:center}.news-tech-filter{display:flex;gap:5px;padding:4px;border:1px solid var(--line);background:var(--panel);border-radius:11px}.news-tech-filter button{height:34px;border:0;background:transparent;color:#667085;border-radius:8px;padding:0 10px;font-size:8px;font-weight:750;cursor:pointer}.news-tech-filter button.active{background:#eef4ff;color:var(--primary)}.news-catalog-toolbar select{height:44px;border:1px solid var(--line);background:var(--panel);color:var(--text);border-radius:11px;padding:0 10px;font-size:9px}.news-tech-row{display:flex;gap:5px;flex-wrap:wrap;margin:7px 0}.news-tech-row span{font-size:7px;color:#667085;background:#f4f6f8;padding:4px 6px;border-radius:6px}
body.theme-dark .news-info-features>div,body.theme-dark .news-usecase,body.theme-dark .news-tech-row span{background:#111a28}
@media(max-width:1000px){.news-info-section{grid-template-columns:1fr}.news-usecases{grid-template-columns:repeat(2,1fr)}.news-catalog-toolbar{grid-template-columns:1fr}.news-tech-filter{overflow:auto}.news-cat-hero{grid-template-columns:1fr}.news-cat-visual{display:none}}
@media(max-width:620px){.news-cat-hero{padding:27px 21px}.news-cat-hero h1{font-size:30px}.news-info-features{grid-template-columns:1fr}.news-usecases{grid-template-columns:1fr}.news-cat-actions{flex-wrap:wrap}}


/* =========================
   SERVICE OVERVIEW PAGE
   ========================= */
.service-overview-hero{min-height:340px;border-radius:25px;padding:44px;display:grid;grid-template-columns:1.2fr .8fr;align-items:center;background:linear-gradient(125deg,#14213d,#263f79 58%,#4a4f9d);color:#fff;position:relative;overflow:hidden;box-shadow:var(--shadow)}
.service-overview-hero:before{content:"";position:absolute;width:340px;height:340px;border-radius:50%;right:-90px;top:-120px;background:rgba(93,106,255,.22);filter:blur(12px)}
.service-overview-copy{position:relative;z-index:2}.service-overview-hero h1{font-size:42px;letter-spacing:-.045em;margin:10px 0 12px}.service-overview-hero p{max-width:700px;color:#cad3e5;font-size:12px;line-height:1.8}.service-overview-actions{display:flex;gap:9px;margin-top:22px}.service-overview-stats{display:flex;gap:28px;margin-top:24px}.service-overview-stats div{display:flex;flex-direction:column}.service-overview-stats b{font-size:17px}.service-overview-stats small{font-size:8px;color:#aab7cd;margin-top:3px}
.service-overview-art{position:relative;min-height:230px;display:grid;place-items:center}.service-core{width:150px;height:150px;border-radius:42px;transform:rotate(8deg);background:linear-gradient(135deg,#2b75ff,#825bf7);box-shadow:0 30px 65px rgba(0,0,0,.28),inset 0 0 35px rgba(255,255,255,.12);display:flex;flex-direction:column;align-items:center;justify-content:center}.service-core span{font-size:46px;font-weight:900;letter-spacing:-.08em}.service-core small{font-size:7px;letter-spacing:.18em;color:#d8dfff}.service-node{position:absolute;width:48px;height:48px;border-radius:15px;border:1px solid rgba(255,255,255,.17);background:rgba(255,255,255,.1);backdrop-filter:blur(10px);display:grid;place-items:center;font-size:17px}.node-a{left:13%;top:12%}.node-b{right:12%;top:16%}.node-c{left:19%;bottom:9%}.node-d{right:16%;bottom:7%}
.service-intro{display:grid;grid-template-columns:1.2fr .8fr;gap:22px;margin-top:22px;padding:25px;background:var(--panel);border:1px solid var(--line);border-radius:18px}.service-intro h2{font-size:23px;margin:7px 0 9px}.service-intro p{font-size:11px;color:var(--muted);line-height:1.75}.service-intro-points{display:flex;flex-direction:column;gap:9px}.service-intro-points>div{display:flex;gap:10px;padding:11px;border-radius:11px;background:#f8fafc;border:1px solid #edf1f5}.service-intro-points i{width:32px;height:32px;border-radius:9px;background:#eef4ff;color:var(--primary);display:grid;place-items:center}.service-intro-points b,.service-intro-points small{display:block}.service-intro-points b{font-size:9.5px}.service-intro-points small{font-size:7.5px;color:#98a2b3;margin-top:3px}
.service-list-section{padding-top:32px}.service-filter-pills{display:flex;gap:6px}.service-filter-pills button{border:1px solid var(--line);background:var(--panel);color:#667085;border-radius:9px;height:34px;padding:0 10px;font-size:8px;font-weight:750}.service-filter-pills button.active{background:#eef4ff;color:var(--primary);border-color:#d5e3ff}
.service-hub-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:15px}.service-hub-card{padding:20px;background:var(--panel);border:1px solid var(--line);border-radius:16px;transition:.2s}.service-hub-card:hover{transform:translateY(-3px);box-shadow:var(--shadow)}.service-hub-top{display:flex;justify-content:space-between;align-items:center}.service-hub-icon{width:42px;height:42px;border-radius:12px;display:grid;place-items:center;font-size:17px}.service-hub-icon.blue{background:#eef4ff;color:#246bfd}.service-hub-icon.violet{background:#f4f3ff;color:#6938ef}.service-hub-icon.green{background:#ecfdf3;color:#039855}.service-hub-icon.orange{background:#fff6ed;color:#f79009}.service-hub-status{font-size:7px;color:#039855;background:#ecfdf3;padding:5px 7px;border-radius:8px}.service-hub-status i{display:inline-block;width:5px;height:5px;background:#17b26a;border-radius:50%;margin-right:3px}.service-hub-tag{display:inline-block;margin-top:14px;font-size:7px;color:#667085;background:#f4f6f8;padding:4px 6px;border-radius:6px}.service-hub-card h3{font-size:14px;margin:8px 0}.service-hub-card p{font-size:9px;color:var(--muted);line-height:1.65;min-height:44px}.service-hub-card ul{list-style:none;padding:0;margin:12px 0}.service-hub-card li{font-size:8px;color:#667085;padding:4px 0;display:flex;gap:6px}.service-hub-card li i{color:#17b26a}.service-hub-foot{border-top:1px solid var(--line);padding-top:11px;margin-top:11px;display:flex;justify-content:space-between;align-items:end}.service-hub-foot small,.service-hub-foot b{display:block}.service-hub-foot small{font-size:7px;color:#98a2b3}.service-hub-foot b{font-size:9px;margin-top:2px}.service-hub-foot a{font-size:8px;font-weight:800;color:var(--primary)}
.service-process-section{padding-top:36px}.process-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:13px}.process-card{position:relative;padding:20px;background:var(--panel);border:1px solid var(--line);border-radius:15px}.process-card>span{position:absolute;right:15px;top:13px;font-size:9px;font-weight:900;color:#cbd3df}.process-card>i{width:40px;height:40px;border-radius:11px;background:#eef4ff;color:var(--primary);display:grid;place-items:center}.process-card h3{font-size:11px;margin:12px 0 6px}.process-card p{font-size:8px;color:var(--muted);line-height:1.6}
.service-package-section{margin-top:34px;border-radius:20px;padding:28px 32px;background:linear-gradient(120deg,#283b93,#5258d8);color:#fff;display:flex;align-items:center;justify-content:space-between;gap:30px}.service-package-copy{max-width:700px}.service-package-copy h2{font-size:24px;margin:7px 0 8px}.service-package-copy p{font-size:10px;color:#d8defc}.service-package-features{display:flex;flex-wrap:wrap;gap:10px 16px;margin-top:15px}.service-package-features span{font-size:8px;color:#eef1ff}.service-package-features i{margin-right:4px}.service-package-price{text-align:right;min-width:190px}.service-package-price small,.service-package-price strong,.service-package-price span{display:block}.service-package-price small{font-size:8px;color:#ccd4ff}.service-package-price strong{font-size:28px}.service-package-price span{font-size:8px;color:#cdd5ff;margin-bottom:12px}
.service-faq{padding-top:34px}.faq-list{display:grid;gap:8px}.faq-list details{background:var(--panel);border:1px solid var(--line);border-radius:12px;padding:0 15px}.faq-list summary{list-style:none;cursor:pointer;display:flex;justify-content:space-between;align-items:center;font-size:10px;font-weight:800;padding:14px 0}.faq-list summary::-webkit-details-marker{display:none}.faq-list summary i{font-size:10px}.faq-list details[open] summary i{transform:rotate(45deg)}.faq-list p{font-size:8.5px;color:var(--muted);line-height:1.7;padding:0 0 14px;margin:0}
body.theme-dark .service-intro-points>div,body.theme-dark .service-hub-tag{background:#111a28}
@media(max-width:1050px){.service-hub-grid{grid-template-columns:repeat(2,1fr)}.process-grid{grid-template-columns:repeat(2,1fr)}.service-overview-hero{grid-template-columns:1fr}.service-overview-art{display:none}.service-intro{grid-template-columns:1fr}}
@media(max-width:620px){.service-overview-hero{padding:27px 21px}.service-overview-hero h1{font-size:31px}.service-hub-grid,.process-grid{grid-template-columns:1fr}.service-package-section{align-items:flex-start;flex-direction:column}.service-package-price{text-align:left}.service-filter-pills{overflow:auto;max-width:100%}}


/* =========================
   TYPOGRAPHY SCALE UPGRADE
   ========================= */
body{font-size:15px}
.menu-label{font-size:11px}.menu-item{font-size:14px}.submenu a{font-size:14px}
.brand strong{font-size:16px}.brand small{font-size:12px}
.breadcrumb{font-size:13px}.login-btn{font-size:14px}
.top-link{font-size:13px}.top-dropdown-menu b,.mega-column b{font-size:13px}
.top-dropdown-menu small,.mega-column small{font-size:10px}
.dropdown-title,.mega-label{font-size:10px}
.cpanel-name b{font-size:12px}.cpanel-name small{font-size:9px}
.cpanel-head b{font-size:13px}.cpanel-head small{font-size:10px}
.cpanel-stats b{font-size:12px}.cpanel-stats small{font-size:9px}
.cpanel-group>span{font-size:9px}.cpanel-group>a{font-size:12px}
.eyebrow{font-size:12px}
.hero p,.catalog-hero p,.news-cat-hero p,.service-overview-hero p{font-size:14px}
.hero-stats span,.catalog-hero-stats small,.service-overview-stats small{font-size:10px}
.section-head h2,.panel-head h2{font-size:27px}.section-head p{font-size:14px}
.text-link{font-size:13px}
.service-card h3{font-size:17px}.service-card p{font-size:14px}.service-card>a{font-size:12px}
.status{font-size:11px}.pill{font-size:10px}
.news-copy h3{font-size:16px}.news-copy p{font-size:13px}.meta{font-size:10px}
.quick-links b{font-size:14px}.quick-links small{font-size:10px}
.category{font-size:10px}.product-body h3{font-size:16px}.product-foot b{font-size:14px}.product-foot span{font-size:10px}
.plan{font-size:11px}.price-card h3 small{font-size:11px}.price-card li{font-size:13px}
.contact-strip p{font-size:13px}.footer{font-size:11px}
.catalog-breadcrumb{font-size:11px}.catalog-heading h2{font-size:21px}.catalog-chip{font-size:10px}
.catalog-search input,.catalog-toolbar select{font-size:11px}.catalog-summary{font-size:11px}
.catalog-meta{font-size:9px}.catalog-card h3{font-size:14px}.catalog-rating{font-size:10px}
.catalog-price-row small{font-size:9px}.catalog-price-row b{font-size:12px}.preview-btn,.detail-btn{font-size:10px}
.news-info-main h2{font-size:26px}.news-info-lead{font-size:13px}
.news-info-features b{font-size:12px}.news-info-features small{font-size:10px}
.info-side-head b{font-size:13px}.info-side-head small{font-size:10px}
.news-info-side li{font-size:10px}.info-side-note p{font-size:9px}.info-contact-btn{font-size:11px}
.news-usecase b{font-size:12px}.news-usecase small{font-size:9px}
.news-tech-filter button{font-size:10px}.news-catalog-toolbar select{font-size:11px}.news-tech-row span{font-size:9px}
.service-intro h2{font-size:26px}.service-intro p{font-size:13px}
.service-intro-points b{font-size:12px}.service-intro-points small{font-size:9px}
.service-filter-pills button{font-size:10px}.service-hub-tag{font-size:9px}
.service-hub-card h3{font-size:16px}.service-hub-card p{font-size:11px}.service-hub-card li{font-size:10px}
.service-hub-foot small{font-size:9px}.service-hub-foot b{font-size:11px}.service-hub-foot a{font-size:10px}
.process-card h3{font-size:13px}.process-card p{font-size:10px}
.service-package-copy p{font-size:12px}.service-package-features span{font-size:10px}
.faq-list summary{font-size:12px}.faq-list p{font-size:10px}
.settings-fab{font-size:11px}.setting-title b,.setting-row b{font-size:13px}.setting-title small,.setting-row small{font-size:10px}
.segmented button{font-size:10px}.settings-note{font-size:10px}.reset-settings{font-size:11px}
.float-tooltip{font-size:10px}.contact-master{font-size:12px}

/* =========================
   AUTH PAGES
   ========================= */
.auth-page{min-height:100vh;background:
radial-gradient(circle at 20% 20%,rgba(36,107,253,.14),transparent 32%),
radial-gradient(circle at 80% 10%,rgba(122,90,248,.13),transparent 30%),
linear-gradient(180deg,#f7f9fc,#eef3f9);display:grid;grid-template-columns:1.05fr .95fr}
.auth-brand-panel{position:relative;padding:48px;overflow:hidden;background:linear-gradient(145deg,#111c33,#243d78 60%,#4b4ea4);color:#fff;display:flex;flex-direction:column;justify-content:space-between}
.auth-brand-panel:before,.auth-brand-panel:after{content:"";position:absolute;border-radius:50%;border:1px solid rgba(255,255,255,.10)}
.auth-brand-panel:before{width:420px;height:420px;right:-180px;top:-120px}
.auth-brand-panel:after{width:260px;height:260px;left:-120px;bottom:-100px}
.auth-logo{display:flex;align-items:center;gap:12px;position:relative;z-index:2}
.auth-logo-mark{width:48px;height:48px;border-radius:15px;background:linear-gradient(135deg,#2b75ff,#815af7);display:grid;place-items:center;font-weight:900;font-size:18px;box-shadow:0 15px 35px rgba(0,0,0,.2)}
.auth-logo b,.auth-logo small{display:block}.auth-logo b{font-size:18px}.auth-logo small{font-size:11px;color:#aebbd1;margin-top:3px}
.auth-promo{position:relative;z-index:2;max-width:600px}.auth-promo .eyebrow{color:#abc8ff}.auth-promo h1{font-size:44px;line-height:1.15;letter-spacing:-.045em;margin:14px 0}.auth-promo p{font-size:15px;line-height:1.8;color:#cbd4e6}
.auth-benefits{display:grid;grid-template-columns:repeat(2,1fr);gap:12px;margin-top:25px}.auth-benefit{padding:15px;border:1px solid rgba(255,255,255,.12);background:rgba(255,255,255,.07);backdrop-filter:blur(10px);border-radius:14px;display:flex;gap:10px}.auth-benefit i{width:36px;height:36px;border-radius:10px;background:rgba(255,255,255,.1);display:grid;place-items:center}.auth-benefit b,.auth-benefit small{display:block}.auth-benefit b{font-size:12px}.auth-benefit small{font-size:10px;color:#aebbd0;margin-top:4px;line-height:1.4}
.auth-panel-footer{position:relative;z-index:2;font-size:11px;color:#8ea0bd}
.auth-form-wrap{display:flex;align-items:center;justify-content:center;padding:40px}
.auth-card{width:min(470px,100%);background:#fff;border:1px solid #e5eaf1;border-radius:22px;padding:32px;box-shadow:0 24px 60px rgba(16,24,40,.10)}
.auth-card-head{margin-bottom:24px}.auth-card-head h2{font-size:30px;letter-spacing:-.035em;margin:7px 0}.auth-card-head p{font-size:13px;color:#7b8798;line-height:1.6}
.auth-field{margin-bottom:15px}.auth-field label{display:block;font-size:12px;font-weight:800;color:#344054;margin-bottom:7px}
.auth-input{height:48px;border:1px solid #dfe5ed;border-radius:12px;display:flex;align-items:center;gap:10px;padding:0 13px;background:#fff}
.auth-input:focus-within{border-color:#9ab9ff;box-shadow:0 0 0 3px rgba(36,107,253,.08)}
.auth-input>i{color:#98a2b3}.auth-input input{flex:1;border:0;outline:0;font:inherit;font-size:13px;color:#344054;background:transparent}.auth-input button{border:0;background:transparent;color:#98a2b3;cursor:pointer}
.auth-row{display:flex;justify-content:space-between;align-items:center;gap:12px;margin:10px 0 18px}.auth-check{display:flex;align-items:center;gap:7px;font-size:11px;color:#667085}.auth-row>a{font-size:11px;color:#246bfd;font-weight:800}
.auth-submit{width:100%;height:48px;border:0;border-radius:12px;background:linear-gradient(135deg,#246bfd,#6f5df7);color:#fff;font-size:13px;font-weight:850;cursor:pointer;box-shadow:0 12px 25px rgba(36,107,253,.20)}
.auth-submit:hover{filter:brightness(1.03)}
.auth-divider{display:flex;align-items:center;gap:10px;margin:20px 0;color:#98a2b3;font-size:10px}.auth-divider:before,.auth-divider:after{content:"";height:1px;background:#edf0f5;flex:1}
.auth-social{display:grid;grid-template-columns:repeat(2,1fr);gap:9px}.auth-social button{height:44px;border:1px solid #e3e8ef;background:#fff;border-radius:11px;font-size:11px;font-weight:750;color:#475467;cursor:pointer}.auth-social button i{margin-right:6px}
.auth-bottom{text-align:center;margin-top:20px;font-size:11px;color:#7b8798}.auth-bottom a{color:#246bfd;font-weight:800}
.auth-back{display:inline-flex;align-items:center;gap:7px;font-size:11px;color:#667085;margin-bottom:18px}
.auth-note{padding:12px;border-radius:11px;background:#f7f9fc;border:1px solid #edf0f5;color:#667085;font-size:10px;line-height:1.55;margin:15px 0}
.auth-strength{height:5px;background:#edf0f5;border-radius:6px;overflow:hidden;margin-top:7px}.auth-strength span{display:block;height:100%;width:65%;background:linear-gradient(90deg,#f79009,#17b26a)}
.auth-success-box{display:none;padding:13px;border-radius:11px;background:#ecfdf3;color:#05603a;border:1px solid #abefc6;font-size:11px;margin-bottom:14px}
.auth-success-box.show{display:block}
body.theme-dark .auth-card{background:#151f2f;border-color:#243247}.theme-dark .auth-card-head h2,.theme-dark .auth-field label{color:#e5ebf5}.theme-dark .auth-input,.theme-dark .auth-social button{background:#111a28;border-color:#2a3950}.theme-dark .auth-input input{color:#e5ebf5}
@media(max-width:900px){.auth-page{grid-template-columns:1fr}.auth-brand-panel{min-height:340px;padding:32px}.auth-promo h1{font-size:34px}.auth-form-wrap{padding:24px}.auth-card{padding:26px}}
@media(max-width:560px){.auth-benefits{grid-template-columns:1fr}.auth-brand-panel{min-height:300px}.auth-promo h1{font-size:29px}.auth-promo p{font-size:13px}.auth-form-wrap{padding:14px}.auth-card{border-radius:17px;padding:21px}.auth-social{grid-template-columns:1fr}}


/* =========================
   SERVICE GROUP + DETAIL
   ========================= */
.service-group-hero{min-height:320px;border-radius:24px;padding:42px;display:grid;grid-template-columns:1.2fr .8fr;align-items:center;background:linear-gradient(125deg,#14213d,#263d74 58%,#2f6f92);color:#fff;position:relative;overflow:hidden}
.service-group-hero h1{font-size:40px;margin:10px 0 12px;letter-spacing:-.04em}.service-group-hero p{font-size:14px;line-height:1.8;color:#c9d5e6;max-width:720px}.service-group-actions{display:flex;gap:9px;margin-top:22px}
.service-group-visual{min-height:230px;position:relative;display:grid;place-items:center}.sg-screen{width:270px;height:180px;border:1px solid rgba(255,255,255,.17);background:rgba(255,255,255,.08);border-radius:18px;backdrop-filter:blur(12px);box-shadow:0 28px 60px rgba(0,0,0,.24);padding:12px;transform:rotate(3deg)}.sg-top{display:flex;gap:4px;height:22px}.sg-top i{width:5px;height:5px;background:rgba(255,255,255,.45);border-radius:50%}.sg-layout{display:grid;grid-template-columns:55px 1fr;gap:8px;height:130px}.sg-nav{border-radius:8px;background:rgba(255,255,255,.12)}.sg-content{display:flex;flex-direction:column;gap:7px}.sg-content b{height:25px;border-radius:7px;background:rgba(255,255,255,.12)}.sg-content b:first-child{height:55px;background:linear-gradient(135deg,rgba(59,130,246,.7),rgba(124,58,237,.5))}
.sg-badge{position:absolute;padding:8px 10px;border:1px solid rgba(255,255,255,.16);background:rgba(15,30,57,.7);border-radius:10px;font-size:10px;font-weight:800}.b1{left:7%;top:18%}.b2{right:4%;top:20%}.b3{right:10%;bottom:10%}
.service-group-info{display:grid;grid-template-columns:1.1fr .9fr;gap:20px;margin-top:22px;padding:26px;background:var(--panel);border:1px solid var(--line);border-radius:18px}.service-group-info h2{font-size:26px;margin:7px 0 9px}.service-group-info p{font-size:13px;color:var(--muted);line-height:1.75}.sgi-points{display:grid;grid-template-columns:repeat(2,1fr);gap:9px}.sgi-points>div{display:flex;gap:9px;padding:11px;border-radius:11px;background:#f8fafc;border:1px solid #edf1f5}.sgi-points i{width:34px;height:34px;border-radius:9px;background:#eef4ff;color:var(--primary);display:grid;place-items:center}.sgi-points b,.sgi-points small{display:block}.sgi-points b{font-size:12px}.sgi-points small{font-size:10px;color:#98a2b3;margin-top:3px;line-height:1.4}
.group-services-section{padding-top:32px}.group-service-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:15px}.group-service-card{padding:20px;background:var(--panel);border:1px solid var(--line);border-radius:16px}.group-service-card.featured{border-color:#b8c9ff;box-shadow:0 16px 36px rgba(36,107,253,.09)}.gsc-top{display:flex;justify-content:space-between;align-items:center}.gsc-icon{width:42px;height:42px;border-radius:12px;background:#eef4ff;color:#246bfd;display:grid;place-items:center;font-size:17px}.gsc-icon.violet{background:#f4f3ff;color:#6938ef}.gsc-icon.green{background:#ecfdf3;color:#039855}.gsc-icon.orange{background:#fff6ed;color:#f79009}.gsc-icon.blue2{background:#eff8ff;color:#1570ef}.gsc-icon.pink{background:#fdf2fa;color:#c11574}.gsc-status{font-size:9px;color:#039855;background:#ecfdf3;padding:5px 7px;border-radius:8px}.gsc-status i{display:inline-block;width:5px;height:5px;border-radius:50%;background:#17b26a;margin-right:3px}.gsc-plan{display:inline-block;margin-top:14px;font-size:9px;font-weight:800;color:#667085;background:#f4f6f8;padding:4px 6px;border-radius:6px}.group-service-card h3{font-size:17px;margin:8px 0}.group-service-card p{font-size:12px;color:var(--muted);line-height:1.65;min-height:58px}.group-service-card ul{list-style:none;padding:0;margin:12px 0}.group-service-card li{font-size:11px;color:#667085;padding:4px 0}.group-service-card li i{color:#17b26a;margin-right:5px}.gsc-foot{display:flex;justify-content:space-between;align-items:end;border-top:1px solid var(--line);padding-top:12px}.gsc-foot small,.gsc-foot b{display:block}.gsc-foot small{font-size:9px;color:#98a2b3}.gsc-foot b{font-size:11px}.gsc-foot a{font-size:11px;color:var(--primary);font-weight:800}
.group-flow-section{padding-top:34px}.group-flow-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:12px}.group-flow-grid>div{padding:18px;background:var(--panel);border:1px solid var(--line);border-radius:14px}.group-flow-grid span{font-size:10px;font-weight:900;color:#98a2b3}.group-flow-grid h3{font-size:13px;margin:8px 0 5px}.group-flow-grid p{font-size:10px;color:var(--muted);line-height:1.6}

/* detail */
.service-detail-header{display:grid;grid-template-columns:1.3fr .7fr;gap:20px;padding:30px;background:var(--panel);border:1px solid var(--line);border-radius:20px}.sdh-main h1{font-size:34px;margin:10px 0 7px}.sdh-badges{display:flex;gap:7px}.gold-badge,.active-badge{font-size:9px;font-weight:900;padding:6px 8px;border-radius:8px}.gold-badge{background:#fffaeb;color:#b54708}.active-badge{background:#ecfdf3;color:#039855}.active-badge i{display:inline-block;width:5px;height:5px;background:#17b26a;border-radius:50%;margin-right:3px}.sdh-code{font-size:11px;color:#667085}.sdh-desc{font-size:13px;color:var(--muted);line-height:1.75;max-width:780px}.sdh-actions{display:flex;gap:9px;margin-top:18px}.sdh-price-card{background:linear-gradient(145deg,#14213d,#2f4a92);color:#fff;border-radius:16px;padding:22px}.sdh-price-label{font-size:10px;color:#b9c6de}.sdh-price-card strong{display:block;font-size:27px;margin:6px 0 3px}.sdh-price-card small{font-size:10px;color:#aebbd2}.sdh-price-sep{height:1px;background:rgba(255,255,255,.12);margin:14px 0}.sdh-price-card p{font-size:10px;line-height:1.6;color:#cbd4e6}.buy-service-btn,.ask-service-btn{height:40px;border-radius:10px;display:flex;align-items:center;justify-content:center;gap:7px;font-size:10px;font-weight:800;margin-top:8px}.buy-service-btn{background:#fff;color:#243d78}.ask-service-btn{border:1px solid rgba(255,255,255,.18);color:#fff}
.service-detail-meta{display:grid;grid-template-columns:repeat(4,1fr);gap:10px;margin-top:14px}.service-detail-meta>div{display:flex;gap:10px;align-items:center;padding:13px;background:var(--panel);border:1px solid var(--line);border-radius:12px}.service-detail-meta i{width:34px;height:34px;border-radius:9px;background:#eef4ff;color:var(--primary);display:grid;place-items:center}.service-detail-meta small,.service-detail-meta b{display:block}.service-detail-meta small{font-size:9px;color:#98a2b3}.service-detail-meta b{font-size:11px;margin-top:2px}
.service-detail-layout{display:grid;grid-template-columns:minmax(0,1fr) 290px;gap:18px;margin-top:18px}.service-detail-content,.detail-side-card{background:var(--panel);border:1px solid var(--line);border-radius:16px}.service-detail-content{padding:22px}.service-tabs{display:flex;gap:6px;border-bottom:1px solid var(--line);padding-bottom:10px;margin-bottom:18px}.service-tabs button{border:0;background:transparent;color:#667085;border-radius:8px;padding:8px 10px;font-size:11px;font-weight:800;cursor:pointer}.service-tabs button.active{background:#eef4ff;color:var(--primary)}.service-tab-panel{display:none}.service-tab-panel.active{display:block}.service-tab-panel h2{font-size:23px;margin:7px 0 10px}.service-tab-panel>p{font-size:12px;color:var(--muted);line-height:1.75}
.service-benefit-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin-top:18px}.service-benefit-grid>div{padding:14px;border:1px solid var(--line);background:#f8fafc;border-radius:12px}.service-benefit-grid i{width:34px;height:34px;border-radius:9px;background:#eef4ff;color:var(--primary);display:grid;place-items:center}.service-benefit-grid h3{font-size:12px;margin:9px 0 4px}.service-benefit-grid p{font-size:10px;color:#7b8798;line-height:1.5;margin:0}.service-extra-callout{display:flex;gap:10px;background:#fffaeb;border:1px solid #fedf89;color:#7a2e0e;padding:14px;border-radius:12px}.service-extra-callout i{font-size:18px}.service-extra-callout b{font-size:12px}.service-extra-callout p{font-size:10px;line-height:1.6;margin:4px 0 0}
.service-ref-list{display:grid;gap:8px}.service-ref-list a{display:flex;align-items:center;gap:10px;padding:12px;border:1px solid var(--line);border-radius:11px}.ref-icon{width:35px;height:35px;border-radius:9px;background:#eef4ff;color:var(--primary);display:grid;place-items:center}.service-ref-list a>div{flex:1}.service-ref-list b,.service-ref-list small{display:block}.service-ref-list b{font-size:11px}.service-ref-list small{font-size:9px;color:#98a2b3;margin-top:3px}.service-ref-list>a>i{font-size:10px;color:#98a2b3}
.service-detail-sidebar{display:flex;flex-direction:column;gap:12px}.detail-side-card{padding:18px}.detail-side-card h3{font-size:14px;margin:7px 0 10px}.detail-side-card ul{list-style:none;padding:0;margin:0}.detail-side-card li{display:flex;justify-content:space-between;gap:10px;padding:9px 0;border-bottom:1px solid var(--line);font-size:10px}.detail-side-card li span{color:#98a2b3}.green-text{color:#039855}.support-card{text-align:center}.support-icon{width:48px;height:48px;border-radius:14px;background:#eef4ff;color:var(--primary);display:grid;place-items:center;margin:0 auto;font-size:20px}.support-card p{font-size:10px;color:var(--muted);line-height:1.6}.support-card a{font-size:10px;color:var(--primary);font-weight:800}
.service-related{padding-top:28px}.service-related-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}.service-related-grid>a{display:flex;align-items:center;gap:10px;padding:14px;background:var(--panel);border:1px solid var(--line);border-radius:12px}.service-related-grid>a>i{width:36px;height:36px;border-radius:10px;background:#eef4ff;color:var(--primary);display:grid;place-items:center}.service-related-grid>a>div{flex:1}.service-related-grid b,.service-related-grid small{display:block}.service-related-grid b{font-size:11px}.service-related-grid small{font-size:9px;color:#98a2b3;margin-top:3px}.service-related-grid>a>span{color:#98a2b3}
body.theme-dark .sgi-points>div,body.theme-dark .service-benefit-grid>div{background:#111a28}
@media(max-width:1000px){.service-group-hero{grid-template-columns:1fr}.service-group-visual{display:none}.service-group-info{grid-template-columns:1fr}.group-service-grid{grid-template-columns:repeat(2,1fr)}.group-flow-grid{grid-template-columns:repeat(2,1fr)}.service-detail-header{grid-template-columns:1fr}.service-detail-layout{grid-template-columns:1fr}.service-detail-meta{grid-template-columns:repeat(2,1fr)}}
@media(max-width:650px){.service-group-hero{padding:27px 21px}.service-group-hero h1{font-size:30px}.sgi-points,.group-service-grid,.group-flow-grid,.service-benefit-grid,.service-related-grid{grid-template-columns:1fr}.service-detail-meta{grid-template-columns:1fr}.service-detail-header{padding:20px}.sdh-main h1{font-size:27px}.service-tabs{overflow:auto}}

/* =========================
   MEMBER CPANEL
   ========================= */
.member-shell{min-height:100vh;background:var(--bg)}
.member-content{max-width:1480px;margin:auto;padding:28px}
.member-hero{display:grid;grid-template-columns:1.2fr .8fr;gap:18px;align-items:stretch}
.member-welcome,.member-profile-mini,.member-panel,.member-stat,.purchase-card{background:var(--panel);border:1px solid var(--line);border-radius:18px}
.member-welcome{padding:28px;background:linear-gradient(130deg,#14213d,#29447f 62%,#5158ad);color:#fff;position:relative;overflow:hidden}
.member-welcome:after{content:"MT";position:absolute;right:-8px;bottom:-30px;font-size:150px;font-weight:900;color:rgba(255,255,255,.05)}
.member-welcome h1{font-size:34px;margin:8px 0}.member-welcome p{font-size:13px;line-height:1.75;color:#cbd5e7;max-width:720px}
.member-profile-mini{padding:20px;display:flex;align-items:center;gap:14px}.member-avatar{width:84px;height:84px;border-radius:22px;object-fit:cover;background:linear-gradient(135deg,#246bfd,#7a5af8);border:4px solid #fff;box-shadow:0 12px 28px rgba(16,24,40,.14)}
.member-avatar-fallback{width:84px;height:84px;border-radius:22px;background:linear-gradient(135deg,#246bfd,#7a5af8);display:grid;place-items:center;color:#fff;font-size:24px;font-weight:900;border:4px solid #fff;box-shadow:0 12px 28px rgba(16,24,40,.14)}
.member-profile-mini b,.member-profile-mini small{display:block}.member-profile-mini b{font-size:16px}.member-profile-mini small{font-size:11px;color:#98a2b3;margin-top:4px}.member-gold{display:inline-flex;margin-top:8px;background:#fffaeb;color:#b54708;padding:5px 8px;border-radius:8px;font-size:9px;font-weight:900}
.member-stats{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;margin-top:18px}.member-stat{padding:18px}.member-stat span{display:flex;align-items:center;justify-content:space-between}.member-stat i{width:38px;height:38px;border-radius:11px;background:#eef4ff;color:var(--primary);display:grid;place-items:center}.member-stat b{font-size:23px;margin-top:12px;display:block}.member-stat small{font-size:10px;color:#98a2b3}
.member-grid{display:grid;grid-template-columns:1.35fr .65fr;gap:18px;margin-top:18px}.member-panel{padding:20px}.member-panel h2{font-size:20px;margin:5px 0 14px}
.member-quick{display:grid;grid-template-columns:repeat(2,1fr);gap:10px}.member-quick a{display:flex;gap:10px;align-items:center;padding:13px;border:1px solid var(--line);border-radius:12px}.member-quick i{width:36px;height:36px;border-radius:10px;background:#eef4ff;color:var(--primary);display:grid;place-items:center}.member-quick b,.member-quick small{display:block}.member-quick b{font-size:12px}.member-quick small{font-size:9px;color:#98a2b3;margin-top:3px}
.member-activity{display:grid;gap:9px}.member-activity div{display:flex;gap:10px;align-items:flex-start;padding:10px 0;border-bottom:1px solid var(--line)}.member-activity i{color:var(--primary)}.member-activity b,.member-activity small{display:block}.member-activity b{font-size:11px}.member-activity small{font-size:9px;color:#98a2b3;margin-top:3px}
.member-form-grid{display:grid;grid-template-columns:1fr 1fr;gap:14px}.member-field{display:flex;flex-direction:column;gap:7px}.member-field.full{grid-column:1/-1}.member-field label{font-size:11px;font-weight:800;color:#344054}.member-field input,.member-field textarea,.member-field select{border:1px solid var(--line);background:var(--panel);color:var(--text);border-radius:11px;padding:12px 13px;font:inherit;font-size:12px;outline:0}.member-field textarea{min-height:100px;resize:vertical}.member-field input:focus,.member-field textarea:focus,.member-field select:focus{border-color:#9ab9ff;box-shadow:0 0 0 3px rgba(36,107,253,.08)}
.profile-layout{display:grid;grid-template-columns:320px 1fr;gap:18px}.profile-card{padding:20px;background:var(--panel);border:1px solid var(--line);border-radius:18px;text-align:center}.profile-card h3{font-size:16px;margin:12px 0 3px}.profile-card p{font-size:10px;color:#98a2b3}.avatar-wrap{position:relative;width:120px;height:120px;margin:auto}.avatar-wrap img,.avatar-placeholder{width:120px;height:120px;border-radius:28px;object-fit:cover;background:linear-gradient(135deg,#246bfd,#7a5af8);display:grid;place-items:center;color:#fff;font-size:32px;font-weight:900}.avatar-edit{position:absolute;right:-4px;bottom:-4px;width:38px;height:38px;border-radius:12px;background:#101828;color:#fff;border:4px solid var(--panel);display:grid;place-items:center;cursor:pointer}.avatar-edit input{display:none}
.form-actions{display:flex;justify-content:flex-end;gap:9px;margin-top:18px}.member-btn{height:42px;border-radius:11px;padding:0 15px;border:1px solid var(--line);background:#fff;color:#475467;font-size:11px;font-weight:800;cursor:pointer}.member-btn.primary{background:var(--primary);color:#fff;border-color:var(--primary)}
.password-strength{height:6px;border-radius:8px;background:#edf0f5;overflow:hidden;margin-top:6px}.password-strength span{display:block;height:100%;width:0;background:linear-gradient(90deg,#f04438,#f79009,#17b26a);transition:.2s}
.security-note{display:flex;gap:10px;padding:14px;border:1px solid #fedf89;background:#fffaeb;color:#7a2e0e;border-radius:12px;font-size:10px;line-height:1.6;margin-bottom:16px}
.purchase-toolbar{display:flex;justify-content:space-between;gap:12px;align-items:center;margin-bottom:16px}.purchase-filter{display:flex;gap:6px}.purchase-filter button{height:34px;border:1px solid var(--line);background:var(--panel);border-radius:9px;padding:0 10px;font-size:10px;cursor:pointer}.purchase-filter button.active{background:#eef4ff;color:var(--primary);border-color:#d5e3ff}
.purchase-list{display:grid;gap:12px}.purchase-card{padding:18px;display:grid;grid-template-columns:58px 1fr auto;gap:14px;align-items:center}.purchase-icon{width:54px;height:54px;border-radius:14px;background:#eef4ff;color:var(--primary);display:grid;place-items:center;font-size:20px}.purchase-card h3{font-size:14px;margin:0 0 4px}.purchase-card p{font-size:10px;color:#98a2b3;margin:0}.purchase-meta{display:flex;gap:8px;flex-wrap:wrap;margin-top:8px}.purchase-meta span{font-size:9px;background:#f4f6f8;color:#667085;padding:5px 7px;border-radius:7px}.purchase-side{text-align:right}.purchase-side b,.purchase-side small{display:block}.purchase-side b{font-size:12px}.purchase-side small{font-size:9px;color:#98a2b3;margin-top:3px}.purchase-status{display:inline-block;margin-top:8px;font-size:9px;font-weight:800;padding:5px 8px;border-radius:8px;background:#ecfdf3;color:#039855}.purchase-status.expired{background:#fef3f2;color:#d92d20}
.member-page-title{display:flex;justify-content:space-between;align-items:flex-end;margin-bottom:18px}.member-page-title h1{font-size:28px;margin:5px 0}.member-page-title p{font-size:11px;color:#98a2b3;margin:0}
.member-back{font-size:11px;color:var(--primary);font-weight:800}
body.theme-dark .profile-card,body.theme-dark .member-panel,body.theme-dark .member-stat,body.theme-dark .purchase-card,body.theme-dark .member-profile-mini{background:var(--panel)}
body.theme-dark .member-field label{color:#e5ebf5}.theme-dark .member-btn{background:#111a28;color:#dbe5f3}
@media(max-width:1000px){.member-hero,.member-grid,.profile-layout{grid-template-columns:1fr}.member-stats{grid-template-columns:repeat(2,1fr)}}
@media(max-width:650px){.member-content{padding:14px}.member-stats{grid-template-columns:1fr}.member-quick{grid-template-columns:1fr}.member-form-grid{grid-template-columns:1fr}.member-field.full{grid-column:auto}.purchase-card{grid-template-columns:48px 1fr}.purchase-side{grid-column:2;text-align:left}.purchase-toolbar{align-items:flex-start;flex-direction:column}.purchase-filter{overflow:auto;max-width:100%}}

/* =========================
   PRODUCTS INTRO + NEWS HUB
   ========================= */
.content-hub-hero{min-height:310px;border-radius:24px;padding:40px 42px;display:grid;grid-template-columns:1.15fr .85fr;align-items:center;background:linear-gradient(125deg,#14213d,#29447f 58%,#5158ad);color:#fff;position:relative;overflow:hidden;box-shadow:var(--shadow)}
.content-hub-hero h1{font-size:40px;letter-spacing:-.045em;margin:10px 0 12px}.content-hub-hero p{font-size:14px;line-height:1.8;color:#cbd5e7;max-width:720px}
.content-hub-art{position:relative;min-height:210px;display:grid;place-items:center}.content-hub-orb{width:165px;height:165px;border-radius:42px;background:linear-gradient(135deg,#2b75ff,#8358ff);display:grid;place-items:center;box-shadow:0 30px 60px rgba(0,0,0,.28)}.content-hub-orb i{font-size:54px}.hub-float{position:absolute;padding:9px 11px;border-radius:11px;border:1px solid rgba(255,255,255,.16);background:rgba(255,255,255,.09);backdrop-filter:blur(10px);font-size:10px;font-weight:800}.hub-f1{left:9%;top:18%}.hub-f2{right:4%;top:20%}.hub-f3{right:12%;bottom:10%}

.product-intro-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:15px;margin-top:22px}.product-intro-card{background:var(--panel);border:1px solid var(--line);border-radius:16px;padding:20px;transition:.2s}.product-intro-card:hover{transform:translateY(-3px);box-shadow:var(--shadow)}.product-intro-icon{width:44px;height:44px;border-radius:12px;background:#eef4ff;color:var(--primary);display:grid;place-items:center;font-size:18px}.product-intro-card h3{font-size:17px;margin:11px 0 7px}.product-intro-card p{font-size:12px;color:var(--muted);line-height:1.65;min-height:60px}.product-intro-card ul{list-style:none;padding:0;margin:12px 0}.product-intro-card li{font-size:11px;color:#667085;padding:4px 0}.product-intro-card li i{color:#17b26a;margin-right:5px}.product-intro-card a{font-size:11px;font-weight:800;color:var(--primary)}
.product-showcase{display:grid;grid-template-columns:1fr 1fr;gap:18px;margin-top:24px}.product-showcase-main,.product-showcase-side{background:var(--panel);border:1px solid var(--line);border-radius:18px}.product-showcase-main{padding:24px}.product-showcase-main h2{font-size:25px;margin:7px 0 9px}.product-showcase-main p{font-size:13px;color:var(--muted);line-height:1.75}.product-showcase-side{padding:18px;display:grid;gap:10px}.product-feature-row{display:flex;gap:10px;align-items:center;padding:11px;border:1px solid var(--line);border-radius:11px}.product-feature-row i{width:36px;height:36px;border-radius:10px;background:#eef4ff;color:var(--primary);display:grid;place-items:center}.product-feature-row b,.product-feature-row small{display:block}.product-feature-row b{font-size:12px}.product-feature-row small{font-size:9px;color:#98a2b3;margin-top:3px}

.news-top-layout{display:grid;grid-template-columns:1.4fr .6fr;gap:18px;margin-top:22px}.news-featured{background:var(--panel);border:1px solid var(--line);border-radius:18px;overflow:hidden}.news-featured-visual{height:260px;background:linear-gradient(135deg,#173b74,#7048d8);position:relative;display:flex;align-items:flex-end;padding:24px;color:#fff}.news-featured-visual:after{content:"NEWS";position:absolute;right:18px;top:10px;font-size:68px;font-weight:900;color:rgba(255,255,255,.07)}.news-featured-visual h2{font-size:27px;max-width:680px;margin:8px 0}.news-featured-visual p{font-size:12px;color:#d9e1ef;max-width:640px;line-height:1.6}.news-featured-meta{display:flex;gap:12px;font-size:10px;color:#c4d0e3}.latest-news-panel{background:var(--panel);border:1px solid var(--line);border-radius:18px;padding:18px}.latest-news-panel h2{font-size:20px;margin:5px 0 10px}.latest-news-list{display:grid;gap:2px}.latest-news-list a{display:grid;grid-template-columns:42px 1fr;gap:9px;padding:11px 0;border-bottom:1px solid var(--line)}.latest-news-list a:last-child{border:0}.latest-news-index{width:38px;height:38px;border-radius:10px;background:#eef4ff;color:var(--primary);display:grid;place-items:center;font-size:11px;font-weight:900}.latest-news-list b,.latest-news-list small{display:block}.latest-news-list b{font-size:11px;line-height:1.4}.latest-news-list small{font-size:9px;color:#98a2b3;margin-top:3px}
.news-category-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;margin-top:18px}.news-category-card{background:var(--panel);border:1px solid var(--line);border-radius:15px;padding:16px}.news-category-card i{width:38px;height:38px;border-radius:10px;background:#eef4ff;color:var(--primary);display:grid;place-items:center}.news-category-card h3{font-size:13px;margin:10px 0 5px}.news-category-card p{font-size:10px;color:var(--muted);line-height:1.5}.news-category-card span{font-size:9px;color:#98a2b3}.news-category-card a{display:inline-block;margin-top:10px;font-size:10px;color:var(--primary);font-weight:800}
.news-list-section{padding-top:28px}.news-card-list{display:grid;gap:12px}.news-list-card{display:grid;grid-template-columns:200px 1fr;background:var(--panel);border:1px solid var(--line);border-radius:15px;overflow:hidden}.news-list-thumb{min-height:130px;background:linear-gradient(135deg,#30477f,#7a5af8);display:grid;place-items:center;color:#fff;font-size:22px;font-weight:900;letter-spacing:.08em}.news-list-body{padding:16px}.news-list-body h3{font-size:16px;margin:5px 0}.news-list-body p{font-size:11px;color:var(--muted);line-height:1.6}.news-list-meta{display:flex;gap:12px;font-size:9px;color:#98a2b3}.news-list-body a{font-size:10px;color:var(--primary);font-weight:800}
.news-group-layout{display:grid;grid-template-columns:minmax(0,1fr) 300px;gap:18px}.news-group-sidebar{background:var(--panel);border:1px solid var(--line);border-radius:16px;padding:18px;height:max-content}.news-group-sidebar h3{font-size:15px;margin:5px 0 10px}.news-group-sidebar a{display:flex;justify-content:space-between;padding:9px 0;border-bottom:1px solid var(--line);font-size:10px;color:#667085}.news-group-sidebar a.active{color:var(--primary);font-weight:800}
.article-layout{display:grid;grid-template-columns:minmax(0,1fr) 300px;gap:18px}.article-card{background:var(--panel);border:1px solid var(--line);border-radius:18px;padding:26px}.article-card h1{font-size:32px;line-height:1.25;letter-spacing:-.035em;margin:10px 0}.article-meta{display:flex;gap:12px;flex-wrap:wrap;color:#98a2b3;font-size:10px;border-bottom:1px solid var(--line);padding-bottom:14px;margin-bottom:18px}.article-lead{font-size:14px!important;font-weight:600;color:#475467!important}.article-card p{font-size:13px;color:var(--muted);line-height:1.85}.article-card h2{font-size:22px;margin:25px 0 9px}.article-cover{height:300px;border-radius:14px;background:linear-gradient(135deg,#193b72,#7048d8);display:grid;place-items:center;color:#fff;font-size:36px;font-weight:900;letter-spacing:.08em;margin:18px 0}.article-callout{border-left:4px solid var(--primary);background:#f7f9fc;padding:14px;border-radius:0 10px 10px 0;font-size:12px;line-height:1.7;color:#475467}.article-tags{display:flex;gap:7px;flex-wrap:wrap;margin-top:22px}.article-tags a{font-size:9px;background:#f4f6f8;color:#667085;padding:6px 8px;border-radius:8px}
.article-side-card{background:var(--panel);border:1px solid var(--line);border-radius:15px;padding:18px;margin-bottom:12px}.article-side-card h3{font-size:14px;margin:5px 0 10px}.article-related a{display:block;padding:9px 0;border-bottom:1px solid var(--line)}.article-related b,.article-related small{display:block}.article-related b{font-size:10px;line-height:1.4}.article-related small{font-size:8px;color:#98a2b3;margin-top:3px}
body.theme-dark .article-callout{background:#111a28;color:#d3dbe7}
@media(max-width:1050px){.product-intro-grid{grid-template-columns:repeat(2,1fr)}.product-showcase,.news-top-layout,.news-group-layout,.article-layout{grid-template-columns:1fr}.news-category-grid{grid-template-columns:repeat(2,1fr)}}
@media(max-width:650px){.content-hub-hero{grid-template-columns:1fr;padding:27px 21px}.content-hub-art{display:none}.content-hub-hero h1{font-size:30px}.product-intro-grid,.news-category-grid{grid-template-columns:1fr}.news-list-card{grid-template-columns:1fr}.news-list-thumb{min-height:110px}.article-card{padding:19px}.article-card h1{font-size:25px}.article-cover{height:210px}}


/* =========================
   TOP APPS MENU
   ========================= */
.apps-menu-wrap{position:relative}
.apps-menu-btn{
  width:42px;height:42px;border:0;border-radius:13px;background:#eef4ff;color:var(--primary);
  display:grid;place-items:center;cursor:pointer;font-size:18px;transition:.2s
}
.apps-menu-btn:hover,.apps-menu-wrap.open .apps-menu-btn{background:#dfeaff;box-shadow:0 8px 20px rgba(36,107,253,.12)}
.apps-menu-panel{
  position:absolute;z-index:70;right:0;top:calc(100% + 12px);width:480px;
  background:var(--panel);border:1px solid var(--line);border-radius:16px;
  box-shadow:0 24px 65px rgba(16,24,40,.16);
  opacity:0;visibility:hidden;transform:translateY(-8px) scale(.985);
  transform-origin:top right;transition:.18s;overflow:hidden
}
.apps-menu-wrap.open .apps-menu-panel{opacity:1;visibility:visible;transform:translateY(0) scale(1)}
.apps-menu-head{
  height:60px;padding:0 20px;display:flex;align-items:center;justify-content:space-between;
  border-bottom:1px solid var(--line)
}
.apps-menu-head b{font-size:15px}.apps-menu-head span{font-size:12px;color:#667085;font-weight:700}
.apps-menu-list{max-height:520px;overflow:auto}
.apps-menu-item{
  display:grid;grid-template-columns:56px minmax(0,1fr) auto;gap:12px;align-items:center;
  padding:18px 20px;border-bottom:1px solid var(--line)
}
.apps-menu-item:last-child{border-bottom:0}
.apps-menu-icon{
  width:50px;height:50px;border-radius:50%;background:#f6f8fb;display:grid;place-items:center;
  font-size:22px
}
.apps-menu-icon.jira{color:#2684ff}
.apps-menu-icon.inferno{color:#e5484d}
.apps-menu-icon.evernote{color:#2db84c}
.apps-menu-icon.gitlab{color:#fc6d26}
.apps-menu-icon.webdev{color:#246bfd}
.apps-menu-icon.github{color:#24292f}
.apps-menu-copy b,.apps-menu-copy small{display:block}
.apps-menu-copy b{font-size:15px;color:var(--text)}
.apps-menu-copy small{font-size:11px;color:#667085;margin-top:4px}
.apps-switch{position:relative;width:46px;height:28px;display:inline-block}
.apps-switch input{position:absolute;opacity:0;pointer-events:none}
.apps-switch-ui{
  position:absolute;inset:0;border-radius:20px;background:#e4e7ec;transition:.2s;cursor:pointer
}
.apps-switch-ui:after{
  content:"";position:absolute;top:4px;left:4px;width:20px;height:20px;border-radius:50%;
  background:#fff;box-shadow:0 2px 5px rgba(16,24,40,.18);transition:.2s
}
.apps-switch input:checked + .apps-switch-ui{background:var(--primary)}
.apps-switch input:checked + .apps-switch-ui:after{transform:translateX(18px)}
.apps-menu-footer{padding:18px 20px;border-top:1px solid var(--line);background:var(--panel)}
.apps-menu-footer a{
  height:48px;border:1px solid var(--line);border-radius:11px;background:var(--panel);
  display:flex;align-items:center;justify-content:center;font-size:14px;font-weight:800;color:var(--text)
}
.apps-menu-footer a:hover{border-color:#b9c9ef;background:#f8fafc}
.apps-menu-panel:before{
  content:"";position:absolute;right:18px;top:-6px;width:12px;height:12px;background:var(--panel);
  border-left:1px solid var(--line);border-top:1px solid var(--line);transform:rotate(45deg)
}
body.theme-dark .apps-menu-icon{background:#111a28}
body.theme-dark .apps-menu-footer a:hover{background:#111a28}
@media(max-width:620px){
  .apps-menu-panel{position:fixed;left:10px;right:10px;top:76px;width:auto}
  .apps-menu-item{padding:14px}
  .apps-menu-copy b{font-size:13px}
  .apps-menu-copy small{font-size:10px}
}

/* =========================
   COURSE CATALOG CONVERT
   ========================= */
.course-hero{min-height:310px;border-radius:24px;padding:40px 42px;display:grid;grid-template-columns:1.2fr .8fr;align-items:center;background:linear-gradient(125deg,#13203a,#27457f 58%,#4e56aa);color:#fff;position:relative;overflow:hidden}
.course-hero h1{font-size:40px;margin:10px 0 12px;letter-spacing:-.045em}.course-hero p{font-size:14px;line-height:1.8;color:#cbd5e7;max-width:720px}
.course-art{position:relative;min-height:220px;display:grid;place-items:center}.course-book{width:170px;height:150px;border-radius:28px;background:linear-gradient(135deg,#246bfd,#7a5af8);display:grid;place-items:center;box-shadow:0 30px 60px rgba(0,0,0,.25)}.course-book i{font-size:58px}.course-badge{position:absolute;padding:9px 11px;border:1px solid rgba(255,255,255,.16);background:rgba(255,255,255,.08);backdrop-filter:blur(10px);border-radius:10px;font-size:10px;font-weight:800}.cb1{left:7%;top:17%}.cb2{right:3%;top:20%}.cb3{right:10%;bottom:10%}
.course-info{margin-top:20px;padding:16px 18px;border-radius:13px;background:#eef4ff;border:1px solid #dce7ff;color:#34518d;font-size:11px;line-height:1.6}
.course-toolbar{display:grid;grid-template-columns:minmax(260px,1fr) auto auto;gap:10px;align-items:center;margin-top:20px}.course-search{height:44px;border:1px solid var(--line);background:var(--panel);border-radius:11px;display:flex;align-items:center;gap:8px;padding:0 12px}.course-search input{flex:1;border:0;outline:0;background:transparent;color:var(--text);font-size:12px}.course-filter{display:flex;gap:5px;padding:4px;border:1px solid var(--line);background:var(--panel);border-radius:11px}.course-filter button{height:34px;border:0;background:transparent;border-radius:8px;padding:0 10px;font-size:10px;color:#667085;cursor:pointer}.course-filter button.active{background:#eef4ff;color:var(--primary)}
.course-section{padding-top:28px}.course-section-head{display:flex;justify-content:space-between;align-items:end;margin-bottom:12px}.course-section-head h2{font-size:22px;margin:5px 0}.course-section-head p{font-size:11px;color:var(--muted);max-width:900px;line-height:1.6}
.course-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}.course-card{background:var(--panel);border:1px solid var(--line);border-radius:16px;overflow:hidden;transition:.2s}.course-card:hover{transform:translateY(-3px);box-shadow:var(--shadow)}.course-cover{height:130px;background:linear-gradient(135deg,#22365f,#5b56cc);display:flex;align-items:flex-end;padding:14px;color:#fff;position:relative}.course-cover:after{content:"MT";position:absolute;right:8px;top:-6px;font-size:62px;font-weight:900;color:rgba(255,255,255,.07)}.course-cover b{font-size:18px;z-index:2}.course-card-body{padding:15px}.course-card-body h3{font-size:15px;line-height:1.4;margin:6px 0}.course-card-body p{font-size:10px;color:var(--muted);line-height:1.6;min-height:48px}.course-type{font-size:9px;background:#ecfdf3;color:#039855;padding:5px 7px;border-radius:7px;font-weight:800}.course-type.paid{background:#fffaeb;color:#b54708}.course-metrics{display:grid;grid-template-columns:repeat(3,1fr);gap:5px;margin-top:12px}.course-metrics div{background:#f7f9fc;border-radius:8px;padding:8px;text-align:center}.course-metrics b,.course-metrics small{display:block}.course-metrics b{font-size:11px}.course-metrics small{font-size:8px;color:#98a2b3;margin-top:2px}.course-foot{display:flex;justify-content:space-between;align-items:center;border-top:1px solid var(--line);margin-top:12px;padding-top:11px}.course-status{font-size:9px;color:#039855}.course-card a{font-size:10px;color:var(--primary);font-weight:800}
.course-empty{display:none;text-align:center;padding:35px;background:var(--panel);border:1px dashed var(--line);border-radius:14px;margin-top:15px}.course-empty.show{display:block}
body.theme-dark .course-info{background:#111a28;color:#b8c9e8;border-color:#243247}.theme-dark .course-metrics div{background:#111a28}
@media(max-width:1050px){.course-grid{grid-template-columns:repeat(2,1fr)}.course-toolbar{grid-template-columns:1fr}.course-hero{grid-template-columns:1fr}.course-art{display:none}}
@media(max-width:650px){.course-hero{padding:27px 21px}.course-hero h1{font-size:30px}.course-grid{grid-template-columns:1fr}.course-filter{overflow:auto}}

/* converted service pages enhancement */
.convert-source-note{display:flex;gap:10px;align-items:flex-start;padding:13px;border:1px solid #dce7ff;background:#eef4ff;border-radius:12px;color:#36558c;font-size:10px;line-height:1.6;margin-top:14px}
.service-source-list{display:grid;gap:10px}.service-source-card{display:grid;grid-template-columns:48px 1fr auto;gap:12px;align-items:center;padding:15px;background:var(--panel);border:1px solid var(--line);border-radius:13px}.service-source-card>i{width:44px;height:44px;border-radius:12px;background:#eef4ff;color:var(--primary);display:grid;place-items:center;font-size:18px}.service-source-card h3{font-size:14px;margin:0 0 4px}.service-source-card p{font-size:10px;color:var(--muted);line-height:1.5;margin:0}.service-source-card a{font-size:10px;color:var(--primary);font-weight:800}
.detail-source-benefits{display:grid;grid-template-columns:repeat(2,1fr);gap:9px}.detail-source-benefits>div{display:flex;gap:9px;padding:12px;border:1px solid var(--line);border-radius:11px;background:#f8fafc}.detail-source-benefits i{color:#17b26a}.detail-source-benefits span{font-size:10px;line-height:1.5}
@media(max-width:650px){.service-source-card{grid-template-columns:42px 1fr}.service-source-card a{grid-column:2}.detail-source-benefits{grid-template-columns:1fr}}

/* =========================
   SEO / ACCESSIBILITY HELPERS
   ========================= */
.seo-skip-link{position:fixed;left:12px;top:-60px;z-index:9999;background:#101828;color:#fff;padding:10px 14px;border-radius:8px;font-size:13px;font-weight:800;transition:.15s}
.seo-skip-link:focus{top:12px}
:focus-visible{outline:3px solid color-mix(in srgb,var(--primary) 45%,transparent);outline-offset:2px}

/* SERVICE SUBPAGES 2026 */
.svcx-hero{border-radius:24px;padding:38px 40px;background:linear-gradient(125deg,#13203a,#29477f 60%,#5558b2);color:#fff;display:grid;grid-template-columns:1.15fr .85fr;gap:24px;align-items:center;overflow:hidden}
.svcx-hero h1{font-size:38px;margin:10px 0}.svcx-hero p{font-size:13px;line-height:1.8;color:#d2dbea;max-width:760px}.svcx-art{min-height:190px;display:grid;place-items:center}.svcx-art i{font-size:72px;width:150px;height:150px;border-radius:36px;display:grid;place-items:center;background:rgba(255,255,255,.1);border:1px solid rgba(255,255,255,.15)}
.svcx-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}.svcx-card,.svcx-panel,.price-card{background:var(--panel);border:1px solid var(--line);border-radius:16px;padding:19px}.svcx-card i{width:42px;height:42px;border-radius:11px;background:#eef4ff;color:var(--primary);display:grid;place-items:center;font-size:18px}.svcx-card h3{font-size:15px;margin:11px 0 6px}.svcx-card p,.svcx-panel p{font-size:11px;color:var(--muted);line-height:1.7}.svcx-list{list-style:none;padding:0}.svcx-list li{font-size:11px;padding:7px 0;border-bottom:1px solid var(--line)}.svcx-list i{color:#17b26a;margin-right:7px}.svcx-steps{display:grid;grid-template-columns:repeat(4,1fr);gap:10px}.svcx-step{padding:17px;border:1px solid var(--line);border-radius:14px;background:var(--panel)}.svcx-step b{font-size:12px}.svcx-step span{display:grid;place-items:center;width:30px;height:30px;border-radius:9px;background:#eef4ff;color:var(--primary);font-weight:900;margin-bottom:9px}.svcx-step p{font-size:10px;color:var(--muted);line-height:1.6}
.price-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}.price-card{position:relative}.price-card.featured{border:2px solid var(--primary);transform:translateY(-5px)}.price-card h3{font-size:18px}.price-card strong{font-size:28px;display:block;margin:10px 0;color:var(--primary)}.price-card small{color:var(--muted)}.price-card ul{list-style:none;padding:0;margin:14px 0}.price-card li{font-size:10px;padding:6px 0}.price-card li:before{content:"✓";color:#17b26a;font-weight:900;margin-right:7px}.price-badge{position:absolute;right:12px;top:12px;background:#eef4ff;color:var(--primary);font-size:8px;font-weight:900;padding:5px 7px;border-radius:7px}
.svcx-cta{margin-top:24px;border-radius:18px;padding:25px;background:#101828;color:#fff;display:flex;justify-content:space-between;align-items:center;gap:18px}.svcx-cta h2{font-size:22px;margin:0 0 5px}.svcx-cta p{font-size:11px;color:#cbd5e1;margin:0}
@media(max-width:950px){.svcx-grid,.price-grid{grid-template-columns:repeat(2,1fr)}.svcx-steps{grid-template-columns:repeat(2,1fr)}}@media(max-width:650px){.svcx-hero{grid-template-columns:1fr;padding:26px 20px}.svcx-art{display:none}.svcx-hero h1{font-size:29px}.svcx-grid,.price-grid,.svcx-steps{grid-template-columns:1fr}.svcx-cta{align-items:flex-start;flex-direction:column}.price-card.featured{transform:none}}


/* =========================================================
   MT.NET.VN PRO V2
   ========================================================= */
:root{
  --pro-radius-xs:9px;
  --pro-radius-sm:12px;
  --pro-radius:16px;
  --pro-radius-lg:22px;
  --pro-shadow-sm:0 4px 14px rgba(16,24,40,.05);
  --pro-shadow:0 18px 50px rgba(16,24,40,.10);
  --pro-shadow-lg:0 30px 80px rgba(16,24,40,.16);
  --pro-container:1540px;
}
body{font-size:16px;letter-spacing:-.005em}
.content{max-width:var(--pro-container)}
.section{padding-top:52px}
.section-head{margin-bottom:24px}
.section-head h2,.panel-head h2{font-size:30px;letter-spacing:-.035em}
.section-head p{font-size:14px;line-height:1.7}
.service-card,.panel,.product-card,.price-card,.member-panel,.catalog-card,.group-service-card,.service-hub-card{
  box-shadow:var(--pro-shadow-sm);transition:transform .22s ease,box-shadow .22s ease,border-color .22s ease
}
.service-card:hover,.product-card:hover,.catalog-card:hover,.group-service-card:hover,.service-hub-card:hover{
  transform:translateY(-4px);box-shadow:var(--pro-shadow);border-color:color-mix(in srgb,var(--primary) 24%,var(--line))
}

/* Smart header */
.topbar{
  transition:height .22s ease,box-shadow .22s ease,background .22s ease;
  box-shadow:0 1px 0 var(--line)
}
body.pro-scrolled .topbar{height:68px;box-shadow:0 10px 30px rgba(16,24,40,.08)}
body.pro-scrolled .top-menu{height:68px}
body.pro-scrolled .cpanel-toggle{height:44px}
body.pro-scrolled .top-brand-mark{width:31px;height:31px}
.topbar .top-link{font-size:13px;font-weight:750}
.topbar-actions{gap:8px}
.icon-btn,.apps-menu-btn{border-radius:12px}

/* Pro Mega menu */
.pro-mega-label{font-size:9px;font-weight:900;letter-spacing:.12em;color:#98a2b3;margin:2px 0 8px}
.mega-menu{padding:18px;gap:14px;border-radius:18px}
.mega-column>a{padding:11px;border-radius:12px}
.mega-column>a:hover{background:linear-gradient(135deg,#f7f9fc,#f1f5ff)}
.mega-promo{min-height:225px;border-radius:16px}
.pro-new{font-size:7px;font-weight:900;background:#ecfdf3;color:#039855;padding:4px 6px;border-radius:7px;margin-left:auto}
.pro-soon{font-size:7px;font-weight:900;background:#fff6ed;color:#c4320a;padding:4px 6px;border-radius:7px;margin-left:auto}

/* Command palette */
.command-backdrop{position:fixed;z-index:190;inset:0;background:rgba(15,23,42,.56);backdrop-filter:blur(7px);opacity:0;visibility:hidden;transition:.18s}
.command-backdrop.show{opacity:1;visibility:visible}
.command-center{position:fixed;z-index:200;left:50%;top:11vh;width:min(760px,calc(100vw - 28px));transform:translate(-50%,-18px) scale(.98);opacity:0;visibility:hidden;background:var(--panel);border:1px solid var(--line);border-radius:20px;box-shadow:0 34px 90px rgba(15,23,42,.26);overflow:hidden;transition:.18s}
.command-center.show{opacity:1;visibility:visible;transform:translate(-50%,0) scale(1)}
.command-search{height:66px;display:flex;align-items:center;gap:12px;padding:0 18px;border-bottom:1px solid var(--line)}
.command-search>i{font-size:20px;color:#98a2b3}
.command-search input{flex:1;border:0;outline:0;background:transparent;color:var(--text);font-size:15px}
.command-search kbd{font:700 9px Inter;background:#f2f4f7;border:1px solid #e4e7ec;color:#667085;border-radius:7px;padding:5px 7px}
.command-body{max-height:62vh;overflow:auto;padding:12px}
.command-group-title{padding:8px 9px;font-size:9px;font-weight:900;color:#98a2b3;letter-spacing:.12em}
.command-item{display:grid;grid-template-columns:40px 1fr auto;gap:10px;align-items:center;padding:10px;border-radius:12px;cursor:pointer}
.command-item:hover,.command-item.active{background:#f5f8ff}
.command-item i{width:38px;height:38px;border-radius:10px;background:#eef4ff;color:var(--primary);display:grid;place-items:center}
.command-item b,.command-item small{display:block}.command-item b{font-size:12px}.command-item small{font-size:9px;color:#98a2b3;margin-top:3px}.command-item span{font-size:9px;color:#98a2b3}
.command-empty{display:none;text-align:center;padding:34px;color:#98a2b3;font-size:12px}
.command-empty.show{display:block}
.command-footer{display:flex;justify-content:space-between;padding:10px 14px;border-top:1px solid var(--line);font-size:9px;color:#98a2b3}
.command-shortcut{display:inline-flex;align-items:center;gap:6px;font-size:10px;color:#667085;margin-left:5px}

/* Homepage PRO hero */
.pro-home-hero{position:relative;overflow:hidden;border-radius:28px;padding:58px;background:
linear-gradient(125deg,#0f1b32,#203b72 56%,#4e53a8);color:#fff;display:grid;grid-template-columns:1.15fr .85fr;min-height:475px;box-shadow:0 30px 75px rgba(18,32,73,.22)}
.pro-home-hero:before{content:"";position:absolute;width:460px;height:460px;border-radius:50%;right:-120px;top:-150px;background:radial-gradient(circle,rgba(111,105,255,.26),transparent 68%)}
.pro-home-copy{position:relative;z-index:2}.pro-home-copy h1{font-size:52px;line-height:1.08;letter-spacing:-.055em;max-width:820px;margin:15px 0 18px}.pro-home-copy p{font-size:15px;line-height:1.8;color:#cbd5e7;max-width:720px}
.pro-home-badges{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:10px}.pro-home-badges span{font-size:9px;padding:6px 9px;border-radius:20px;background:rgba(255,255,255,.09);border:1px solid rgba(255,255,255,.12);color:#dce5f6}
.pro-home-actions{display:flex;gap:10px;margin-top:26px;flex-wrap:wrap}.pro-home-actions .btn{min-height:48px;padding:0 20px}
.pro-home-stats{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;margin-top:34px;max-width:720px}.pro-home-stats div{padding:13px 14px;border:1px solid rgba(255,255,255,.11);background:rgba(255,255,255,.055);border-radius:13px}.pro-home-stats b,.pro-home-stats small{display:block}.pro-home-stats b{font-size:21px}.pro-home-stats small{font-size:9px;color:#aebbd2;margin-top:3px}
.pro-home-art{position:relative;display:grid;place-items:center;z-index:2}.pro-dashboard-preview{width:360px;height:280px;border-radius:24px;border:1px solid rgba(255,255,255,.16);background:rgba(255,255,255,.08);backdrop-filter:blur(18px);box-shadow:0 35px 70px rgba(0,0,0,.26);padding:16px;transform:rotate(2deg)}
.pro-preview-top{display:flex;gap:5px;height:22px}.pro-preview-top i{width:6px;height:6px;border-radius:50%;background:rgba(255,255,255,.45)}
.pro-preview-layout{display:grid;grid-template-columns:80px 1fr;gap:10px;height:220px}.pro-preview-side{border-radius:12px;background:rgba(255,255,255,.1)}.pro-preview-main{display:grid;grid-template-columns:repeat(2,1fr);gap:9px}.pro-preview-main span{border-radius:12px;background:rgba(255,255,255,.11)}.pro-preview-main span:first-child{grid-column:1/-1;background:linear-gradient(135deg,rgba(36,107,253,.65),rgba(122,90,248,.55))}
.pro-float-card{position:absolute;padding:11px 13px;border-radius:12px;background:rgba(10,21,42,.78);border:1px solid rgba(255,255,255,.14);backdrop-filter:blur(12px);box-shadow:0 18px 38px rgba(0,0,0,.18)}.pro-float-card b,.pro-float-card small{display:block}.pro-float-card b{font-size:11px}.pro-float-card small{font-size:8px;color:#b6c3d8;margin-top:3px}.pro-float-a{left:-8px;top:38px}.pro-float-b{right:-8px;bottom:42px}

/* trust strip / testimonials */
.pro-trust-strip{display:grid;grid-template-columns:1.2fr repeat(3,.6fr);gap:12px;margin-top:20px}.pro-trust-intro,.pro-trust-item{background:var(--panel);border:1px solid var(--line);border-radius:15px;padding:17px}.pro-trust-intro b{font-size:14px}.pro-trust-intro p{font-size:10px;color:var(--muted);margin:5px 0 0;line-height:1.5}.pro-trust-item b,.pro-trust-item small{display:block}.pro-trust-item b{font-size:19px}.pro-trust-item small{font-size:9px;color:#98a2b3;margin-top:3px}
.pro-testimonials{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}.pro-testimonial{background:var(--panel);border:1px solid var(--line);border-radius:16px;padding:20px}.pro-testimonial .stars{font-size:11px}.pro-testimonial p{font-size:11px;line-height:1.7;color:var(--muted)}.pro-client{display:flex;gap:9px;align-items:center;margin-top:14px}.pro-client-avatar{width:38px;height:38px;border-radius:11px;background:linear-gradient(135deg,#246bfd,#7a5af8);color:#fff;display:grid;place-items:center;font-size:10px;font-weight:900}.pro-client b,.pro-client small{display:block}.pro-client b{font-size:10px}.pro-client small{font-size:8px;color:#98a2b3;margin-top:2px}

/* footer pro */
.pro-footer{margin-top:52px;background:#0f1724;color:#d6dfeb}
.pro-footer-main{max-width:var(--pro-container);margin:auto;padding:46px 30px 32px;display:grid;grid-template-columns:1.25fr repeat(4,.75fr);gap:28px}
.pro-footer-brand{max-width:330px}.pro-footer-logo{display:flex;gap:10px;align-items:center}.pro-footer-logo span{width:42px;height:42px;border-radius:12px;background:linear-gradient(135deg,#246bfd,#7a5af8);display:grid;place-items:center;color:#fff;font-weight:900}.pro-footer-logo b,.pro-footer-logo small{display:block}.pro-footer-logo b{font-size:15px}.pro-footer-logo small{font-size:9px;color:#7f8fa7;margin-top:3px}.pro-footer-brand p{font-size:10px;color:#8fa0b8;line-height:1.7;margin-top:14px}
.pro-footer-col h4{font-size:11px;color:#fff;margin:0 0 13px}.pro-footer-col a{display:block;color:#8fa0b8;font-size:10px;padding:6px 0}.pro-footer-col a:hover{color:#fff}
.pro-footer-newsletter{display:flex;margin-top:12px}.pro-footer-newsletter input{min-width:0;flex:1;height:38px;border:1px solid #29364a;background:#111d2e;color:#fff;border-radius:10px 0 0 10px;padding:0 10px;font-size:9px}.pro-footer-newsletter button{width:42px;border:0;background:var(--primary);color:#fff;border-radius:0 10px 10px 0}
.pro-footer-bottom{border-top:1px solid #1e2b3e;max-width:var(--pro-container);margin:auto;padding:16px 30px 22px;display:flex;justify-content:space-between;gap:15px;color:#6f829d;font-size:9px}.pro-footer-bottom div{display:flex;gap:14px}

/* CPanel V2 */
.member-welcome{box-shadow:var(--pro-shadow)}
.member-stat{position:relative;overflow:hidden}.member-stat:after{content:"";position:absolute;width:75px;height:75px;border-radius:50%;right:-30px;bottom:-30px;background:color-mix(in srgb,var(--primary) 8%,transparent)}
.member-panel{border-radius:18px}
.pro-progress{height:7px;border-radius:10px;background:#edf1f6;overflow:hidden;margin-top:8px}.pro-progress span{display:block;height:100%;border-radius:10px;background:linear-gradient(90deg,var(--primary),var(--primary2))}
.pro-cpanel-banner{display:flex;justify-content:space-between;align-items:center;gap:18px;margin-top:18px;padding:18px 20px;border-radius:16px;background:linear-gradient(120deg,#edf4ff,#f4f1ff);border:1px solid #dce7ff}.pro-cpanel-banner h3{font-size:14px;margin:0 0 4px}.pro-cpanel-banner p{font-size:9px;color:#667085;margin:0}

/* floating visual cleanup */
.floating-actions,.settings-fab,.back-to-top{filter:drop-shadow(0 8px 18px rgba(16,24,40,.10))}
body.pro-scrolled .back-to-top{opacity:1}

/* responsive PRO */
@media(max-width:1200px){.pro-home-copy h1{font-size:45px}.pro-home-hero{grid-template-columns:1fr}.pro-home-art{display:none}.pro-trust-strip{grid-template-columns:repeat(2,1fr)}.pro-footer-main{grid-template-columns:1.2fr repeat(2,1fr)}}
@media(max-width:760px){.pro-home-hero{padding:34px 24px;border-radius:21px;min-height:auto}.pro-home-copy h1{font-size:34px}.pro-home-stats{grid-template-columns:repeat(2,1fr)}.pro-trust-strip,.pro-testimonials{grid-template-columns:1fr}.pro-footer-main{grid-template-columns:1fr 1fr;padding:34px 20px}.pro-footer-brand{grid-column:1/-1}.pro-footer-bottom{padding:15px 20px;flex-direction:column}.command-center{top:7vh}.command-body{max-height:68vh}}
@media(max-width:520px){.pro-footer-main{grid-template-columns:1fr}.pro-footer-brand{grid-column:auto}.pro-home-copy h1{font-size:30px}.pro-home-stats{grid-template-columns:1fr 1fr}}


/* =========================================================
   MT.NET.VN PRO V3
   ========================================================= */

/* Smooth system */
html{scroll-padding-top:90px}
body{transition:background .2s ease,color .2s ease}
::selection{background:color-mix(in srgb,var(--primary) 24%,transparent)}
a,button,input,select,textarea{-webkit-tap-highlight-color:transparent}

/* Notification center */
.notification-wrap{position:relative}
.notification-panel{
  position:absolute;z-index:85;right:0;top:calc(100% + 12px);width:390px;
  background:var(--panel);border:1px solid var(--line);border-radius:17px;
  box-shadow:var(--pro-shadow-lg);opacity:0;visibility:hidden;
  transform:translateY(-8px) scale(.985);transform-origin:top right;transition:.18s;overflow:hidden
}
.notification-wrap.open .notification-panel{opacity:1;visibility:visible;transform:translateY(0) scale(1)}
.notification-head{padding:16px 17px;border-bottom:1px solid var(--line);display:flex;align-items:center;justify-content:space-between}
.notification-head b{font-size:14px}.notification-head button{border:0;background:transparent;color:var(--primary);font-size:9px;font-weight:800;cursor:pointer}
.notification-tabs{display:flex;gap:5px;padding:9px 12px;border-bottom:1px solid var(--line)}
.notification-tabs button{height:30px;border:0;background:transparent;color:#667085;border-radius:8px;padding:0 9px;font-size:9px;font-weight:750;cursor:pointer}
.notification-tabs button.active{background:#eef4ff;color:var(--primary)}
.notification-list{max-height:390px;overflow:auto}
.notification-item{display:grid;grid-template-columns:38px 1fr auto;gap:9px;padding:13px 15px;border-bottom:1px solid var(--line);position:relative}
.notification-item.unread{background:color-mix(in srgb,var(--primary) 4%,var(--panel))}
.notification-icon{width:36px;height:36px;border-radius:10px;background:#eef4ff;color:var(--primary);display:grid;place-items:center}
.notification-copy b,.notification-copy small{display:block}.notification-copy b{font-size:10.5px;line-height:1.4}.notification-copy small{font-size:8.5px;color:#98a2b3;margin-top:3px;line-height:1.4}
.notification-time{font-size:7.5px;color:#98a2b3;white-space:nowrap}
.notification-dot{position:absolute;right:12px;bottom:12px;width:6px;height:6px;border-radius:50%;background:var(--primary)}
.notification-footer{padding:12px;border-top:1px solid var(--line)}.notification-footer a{height:36px;border-radius:9px;background:#f6f8fc;color:#475467;display:flex;align-items:center;justify-content:center;font-size:9px;font-weight:800}

/* Toast system */
.toast-stack{position:fixed;z-index:300;right:18px;top:92px;width:min(360px,calc(100vw - 28px));display:flex;flex-direction:column;gap:9px;pointer-events:none}
.pro-toast{pointer-events:auto;display:grid;grid-template-columns:36px 1fr auto;gap:9px;align-items:center;background:var(--panel);border:1px solid var(--line);border-radius:14px;padding:12px;box-shadow:var(--pro-shadow);opacity:0;transform:translateX(25px) scale(.98);transition:.22s}
.pro-toast.show{opacity:1;transform:translateX(0) scale(1)}
.pro-toast.hide{opacity:0;transform:translateX(15px)}
.pro-toast-icon{width:34px;height:34px;border-radius:10px;display:grid;place-items:center;background:#ecfdf3;color:#039855}
.pro-toast.warning .pro-toast-icon{background:#fff6ed;color:#f79009}.pro-toast.info .pro-toast-icon{background:#eef4ff;color:var(--primary)}
.pro-toast b,.pro-toast small{display:block}.pro-toast b{font-size:10.5px}.pro-toast small{font-size:8.5px;color:#98a2b3;margin-top:3px;line-height:1.4}
.pro-toast button{border:0;background:transparent;color:#98a2b3;cursor:pointer}

/* Skeleton */
.skeleton{position:relative;overflow:hidden;background:#edf1f5!important;color:transparent!important;border-color:transparent!important}
.skeleton:after{content:"";position:absolute;inset:0;transform:translateX(-100%);background:linear-gradient(90deg,transparent,rgba(255,255,255,.62),transparent);animation:proSkeleton 1.25s infinite}
@keyframes proSkeleton{100%{transform:translateX(100%)}}
.skeleton-line{height:10px;border-radius:7px;margin:7px 0}.skeleton-line.short{width:62%}.skeleton-circle{width:42px;height:42px;border-radius:50%}
.pro-loading-overlay{position:fixed;z-index:350;inset:0;background:rgba(255,255,255,.92);display:grid;place-items:center;transition:.25s}
.pro-loading-overlay.hide{opacity:0;visibility:hidden}
.pro-loader{text-align:center}.pro-loader-mark{width:58px;height:58px;border-radius:18px;background:linear-gradient(135deg,var(--primary),var(--primary2));color:#fff;display:grid;place-items:center;font-size:15px;font-weight:900;margin:auto;box-shadow:0 15px 35px rgba(36,107,253,.22);animation:proLoaderPulse 1.1s ease-in-out infinite alternate}.pro-loader span{display:block;font-size:9px;color:#98a2b3;margin-top:11px;letter-spacing:.08em}
@keyframes proLoaderPulse{to{transform:translateY(-3px) scale(1.03)}}

/* Button state */
.btn.is-loading,.member-btn.is-loading,.auth-submit.is-loading{position:relative;pointer-events:none;color:transparent!important}
.btn.is-loading:after,.member-btn.is-loading:after,.auth-submit.is-loading:after{content:"";position:absolute;left:50%;top:50%;width:15px;height:15px;margin:-8px 0 0 -8px;border:2px solid rgba(255,255,255,.45);border-top-color:#fff;border-radius:50%;animation:proSpin .7s linear infinite}
@keyframes proSpin{to{transform:rotate(360deg)}}

/* Cookie consent */
.cookie-consent{position:fixed;z-index:250;left:20px;bottom:20px;width:min(440px,calc(100vw - 40px));background:var(--panel);border:1px solid var(--line);border-radius:17px;box-shadow:var(--pro-shadow-lg);padding:18px;opacity:0;visibility:hidden;transform:translateY(15px);transition:.22s}
.cookie-consent.show{opacity:1;visibility:visible;transform:translateY(0)}
.cookie-consent-head{display:flex;gap:10px;align-items:flex-start}.cookie-consent-icon{width:40px;height:40px;border-radius:11px;background:#fff6ed;color:#f79009;display:grid;place-items:center;font-size:17px}
.cookie-consent h3{font-size:13px;margin:0 0 4px}.cookie-consent p{font-size:9.5px;line-height:1.6;color:var(--muted);margin:0}.cookie-actions{display:flex;gap:7px;margin-top:14px}.cookie-actions button{height:36px;border-radius:9px;padding:0 12px;font-size:9px;font-weight:800;cursor:pointer}.cookie-accept{border:0;background:var(--primary);color:#fff}.cookie-essential{border:1px solid var(--line);background:var(--panel);color:#475467}.cookie-settings-link{margin-left:auto;border:0;background:transparent!important;color:var(--primary)!important}

/* reading progress for articles */
.reading-progress{position:fixed;z-index:24;left:0;top:0;height:3px;width:0;background:linear-gradient(90deg,var(--primary),var(--primary2));transition:width .05s linear}
body.pro-scrolled .reading-progress{top:0}

/* Scroll reveal */
.pro-reveal{opacity:0;transform:translateY(18px);transition:opacity .55s ease,transform .55s ease}
.pro-reveal.revealed{opacity:1;transform:none}

/* Deep dark */
body.theme-dark .notification-panel,
body.theme-dark .pro-toast,
body.theme-dark .cookie-consent{background:#151f2f;border-color:#243247}
body.theme-dark .notification-item.unread{background:#111a28}
body.theme-dark .notification-footer a{background:#111a28;color:#d6deea}
body.theme-dark .pro-loading-overlay{background:rgba(15,23,36,.94)}
body.theme-dark .skeleton{background:#263448!important}
body.theme-dark .pro-cpanel-banner{background:linear-gradient(120deg,#111d31,#1d2140);border-color:#283752}

/* Error pages */
.error-page{min-height:100vh;background:radial-gradient(circle at 50% 20%,rgba(36,107,253,.12),transparent 34%),var(--bg);display:grid;place-items:center;padding:25px}
.error-card{max-width:760px;width:100%;text-align:center;background:var(--panel);border:1px solid var(--line);border-radius:26px;padding:48px;box-shadow:var(--pro-shadow)}
.error-code{font-size:96px;line-height:1;font-weight:900;letter-spacing:-.08em;background:linear-gradient(135deg,var(--primary),var(--primary2));-webkit-background-clip:text;color:transparent}
.error-card h1{font-size:27px;margin:13px 0 8px}.error-card p{font-size:12px;color:var(--muted);line-height:1.7;max-width:560px;margin:0 auto}.error-actions{display:flex;justify-content:center;gap:8px;flex-wrap:wrap;margin-top:22px}.error-links{display:flex;justify-content:center;gap:15px;flex-wrap:wrap;margin-top:24px}.error-links a{font-size:10px;color:#667085}

/* Better mobile bottom actions */
@media(max-width:620px){
 .notification-panel{position:fixed;left:10px;right:10px;top:76px;width:auto}
 .toast-stack{top:78px;right:10px;width:calc(100vw - 20px)}
 .cookie-consent{left:10px;bottom:10px;width:calc(100vw - 20px)}
 .error-card{padding:32px 20px}.error-code{font-size:72px}
}
@media(prefers-reduced-motion:reduce){
 *,*:before,*:after{animation-duration:.001ms!important;animation-iteration-count:1!important;scroll-behavior:auto!important;transition-duration:.001ms!important}
 .pro-reveal{opacity:1;transform:none}
}


/* =========================================================
   MT.NET.VN PRO V4
   ========================================================= */

/* Mobile bottom nav */
.mobile-bottom-nav{display:none}
@media(max-width:760px){
  body{padding-bottom:72px}
  .mobile-bottom-nav{
    position:fixed;z-index:120;left:10px;right:10px;bottom:10px;height:58px;
    display:grid;grid-template-columns:repeat(5,1fr);background:color-mix(in srgb,var(--panel) 92%,transparent);
    border:1px solid var(--line);border-radius:17px;box-shadow:0 18px 45px rgba(16,24,40,.16);
    backdrop-filter:blur(16px);padding:5px
  }
  .mobile-bottom-nav a,.mobile-bottom-nav button{
    border:0;background:transparent;color:#7c8798;border-radius:12px;display:flex;flex-direction:column;
    align-items:center;justify-content:center;gap:3px;font-size:7px;font-weight:800;cursor:pointer
  }
  .mobile-bottom-nav i{font-size:17px}
  .mobile-bottom-nav a.active,.mobile-bottom-nav button:active{background:#eef4ff;color:var(--primary)}
  .floating-actions{bottom:82px}.settings-fab{bottom:398px}.back-to-top{bottom:345px}
}

/* Member PRO V4 common */
.v4-page-head{display:flex;justify-content:space-between;align-items:flex-end;gap:16px;margin-bottom:18px}
.v4-page-head h1{font-size:30px;margin:5px 0}.v4-page-head p{font-size:11px;color:var(--muted);margin:0;line-height:1.6}
.v4-toolbar{display:flex;justify-content:space-between;gap:10px;align-items:center;margin-bottom:14px;flex-wrap:wrap}
.v4-filter{display:flex;gap:5px;flex-wrap:wrap}.v4-filter button{height:34px;border:1px solid var(--line);background:var(--panel);color:#667085;border-radius:9px;padding:0 10px;font-size:9px;font-weight:800;cursor:pointer}.v4-filter button.active{background:#eef4ff;color:var(--primary);border-color:#d7e3ff}
.v4-search{height:38px;min-width:260px;border:1px solid var(--line);background:var(--panel);border-radius:10px;display:flex;align-items:center;gap:8px;padding:0 10px}.v4-search input{flex:1;border:0;background:transparent;outline:0;color:var(--text);font-size:10px}

/* Notification page */
.notifications-page-grid{display:grid;grid-template-columns:minmax(0,1fr) 285px;gap:16px}
.notification-page-list{background:var(--panel);border:1px solid var(--line);border-radius:16px;overflow:hidden}
.notification-page-item{display:grid;grid-template-columns:46px 1fr auto;gap:11px;padding:16px;border-bottom:1px solid var(--line);position:relative}.notification-page-item:last-child{border-bottom:0}
.notification-page-item.unread{background:color-mix(in srgb,var(--primary) 4%,var(--panel))}
.notification-page-item .notification-icon{width:42px;height:42px}
.notification-page-item h3{font-size:12px;margin:0 0 4px}.notification-page-item p{font-size:9.5px;line-height:1.55;color:var(--muted);margin:0}.notification-page-meta{font-size:8px;color:#98a2b3;white-space:nowrap}
.v4-side-card{background:var(--panel);border:1px solid var(--line);border-radius:15px;padding:16px}.v4-side-card h3{font-size:13px;margin:5px 0 10px}.v4-side-card a{display:flex;justify-content:space-between;padding:8px 0;border-bottom:1px solid var(--line);font-size:9.5px;color:#667085}

/* Orders / invoices */
.order-table-wrap{background:var(--panel);border:1px solid var(--line);border-radius:16px;overflow:auto}
.order-table{width:100%;border-collapse:collapse;min-width:850px}.order-table th,.order-table td{padding:13px 14px;border-bottom:1px solid var(--line);text-align:left}.order-table th{font-size:8px;color:#98a2b3;text-transform:uppercase;letter-spacing:.08em;background:#f8fafc}.order-table td{font-size:10px}.order-table td b{font-size:10.5px}.order-status{display:inline-flex;padding:5px 7px;border-radius:7px;font-size:8px;font-weight:900;background:#ecfdf3;color:#039855}.order-status.pending{background:#fffaeb;color:#b54708}.order-status.cancelled{background:#fef3f2;color:#d92d20}
.order-actions{display:flex;gap:5px}.order-actions a,.order-actions button{height:29px;border:1px solid var(--line);background:var(--panel);border-radius:8px;padding:0 8px;font-size:8px;color:#475467;display:inline-flex;align-items:center;cursor:pointer}
.invoice-card{max-width:930px;margin:auto;background:var(--panel);border:1px solid var(--line);border-radius:18px;padding:28px}.invoice-head{display:flex;justify-content:space-between;gap:20px;border-bottom:1px solid var(--line);padding-bottom:18px}.invoice-brand{display:flex;gap:10px;align-items:center}.invoice-brand-mark{width:48px;height:48px;border-radius:13px;background:linear-gradient(135deg,var(--primary),var(--primary2));color:#fff;display:grid;place-items:center;font-weight:900}.invoice-head h2{font-size:19px;margin:0}.invoice-head p{font-size:9px;color:#98a2b3}.invoice-id{text-align:right}.invoice-id b{display:block;font-size:17px}.invoice-id small{font-size:9px;color:#98a2b3}.invoice-parties{display:grid;grid-template-columns:1fr 1fr;gap:25px;padding:20px 0}.invoice-parties b{font-size:10px}.invoice-parties p{font-size:9.5px;line-height:1.6;color:#667085}.invoice-total{display:flex;justify-content:flex-end;margin-top:18px}.invoice-total-box{width:320px}.invoice-total-box div{display:flex;justify-content:space-between;padding:7px 0;font-size:10px}.invoice-total-box .grand{font-size:15px;font-weight:900;border-top:1px solid var(--line);padding-top:12px}

/* Wishlist */
.wishlist-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}.wishlist-card{background:var(--panel);border:1px solid var(--line);border-radius:16px;overflow:hidden}.wishlist-visual{height:125px;background:linear-gradient(135deg,#20396e,#7357d6);display:grid;place-items:center;color:#fff;font-size:20px;font-weight:900;position:relative}.wishlist-heart{position:absolute;right:10px;top:10px;width:34px;height:34px;border:0;border-radius:10px;background:rgba(255,255,255,.15);color:#fff;cursor:pointer}.wishlist-body{padding:14px}.wishlist-body h3{font-size:13px;margin:0 0 5px}.wishlist-body p{font-size:9.5px;color:var(--muted);line-height:1.5}.wishlist-foot{display:flex;justify-content:space-between;align-items:center;margin-top:12px}.wishlist-foot b{font-size:11px}.wishlist-foot a{font-size:9px;color:var(--primary);font-weight:800}

/* Support tickets */
.ticket-layout{display:grid;grid-template-columns:minmax(0,1fr) 320px;gap:16px}.ticket-list{display:grid;gap:10px}.ticket-item{background:var(--panel);border:1px solid var(--line);border-radius:13px;padding:14px;display:grid;grid-template-columns:1fr auto;gap:10px}.ticket-item h3{font-size:12px;margin:0 0 4px}.ticket-item p{font-size:9px;color:#98a2b3;margin:0}.ticket-status{font-size:8px;font-weight:900;padding:5px 7px;border-radius:7px;height:max-content;background:#ecfdf3;color:#039855}.ticket-status.pending{background:#fffaeb;color:#b54708}.ticket-status.closed{background:#f2f4f7;color:#667085}
.ticket-compose{display:grid;gap:10px}.ticket-compose input,.ticket-compose textarea,.ticket-compose select{border:1px solid var(--line);background:var(--panel);border-radius:10px;padding:11px;font:inherit;font-size:10px;color:var(--text)}.ticket-compose textarea{min-height:120px;resize:vertical}

/* Message center */
.message-shell{display:grid;grid-template-columns:280px minmax(0,1fr);height:650px;background:var(--panel);border:1px solid var(--line);border-radius:17px;overflow:hidden}
.message-threads{border-right:1px solid var(--line);overflow:auto}.message-threads-head{padding:14px;border-bottom:1px solid var(--line)}.message-threads-head h3{font-size:13px;margin:0 0 9px}.message-thread{display:grid;grid-template-columns:38px 1fr;gap:9px;padding:12px;border-bottom:1px solid var(--line);cursor:pointer}.message-thread.active{background:#eef4ff}.message-thread-avatar{width:36px;height:36px;border-radius:10px;background:linear-gradient(135deg,var(--primary),var(--primary2));color:#fff;display:grid;place-items:center;font-size:9px;font-weight:900}.message-thread b,.message-thread small{display:block}.message-thread b{font-size:10px}.message-thread small{font-size:8px;color:#98a2b3;margin-top:3px}
.message-chat{display:grid;grid-template-rows:auto 1fr auto;min-width:0}.message-chat-head{padding:14px;border-bottom:1px solid var(--line);display:flex;justify-content:space-between}.message-chat-head b{font-size:12px}.message-chat-body{padding:18px;overflow:auto;display:flex;flex-direction:column;gap:10px}.bubble{max-width:70%;padding:10px 12px;border-radius:13px;background:#f2f4f7;font-size:9.5px;line-height:1.55}.bubble.me{align-self:flex-end;background:var(--primary);color:#fff}.bubble small{display:block;font-size:7.5px;margin-top:4px;opacity:.65}.message-compose{display:flex;gap:8px;padding:12px;border-top:1px solid var(--line)}.message-compose input{flex:1;border:1px solid var(--line);border-radius:10px;padding:0 11px;font-size:10px;background:var(--panel);color:var(--text)}.message-compose button{width:42px;border:0;border-radius:10px;background:var(--primary);color:#fff}

/* Security Center */
.security-grid{display:grid;grid-template-columns:1fr 1fr;gap:14px}.security-card{background:var(--panel);border:1px solid var(--line);border-radius:16px;padding:18px}.security-card h3{font-size:14px;margin:5px 0}.security-card p{font-size:9.5px;color:var(--muted);line-height:1.6}.security-score{display:flex;align-items:center;gap:12px}.security-score-ring{width:72px;height:72px;border-radius:50%;display:grid;place-items:center;background:conic-gradient(var(--primary) 0 78%,#edf1f5 78% 100%);position:relative}.security-score-ring:after{content:"";position:absolute;inset:7px;border-radius:50%;background:var(--panel)}.security-score-ring b{position:relative;z-index:2;font-size:16px}.device-list{display:grid;gap:8px}.device-item{display:grid;grid-template-columns:36px 1fr auto;gap:9px;align-items:center;padding:10px;border:1px solid var(--line);border-radius:10px}.device-item>i{width:34px;height:34px;border-radius:9px;background:#eef4ff;color:var(--primary);display:grid;place-items:center}.device-item b,.device-item small{display:block}.device-item b{font-size:10px}.device-item small{font-size:8px;color:#98a2b3;margin-top:2px}.device-item button{border:1px solid var(--line);background:var(--panel);border-radius:8px;padding:6px 8px;font-size:8px;color:#d92d20;cursor:pointer}
.twofa-code{display:grid;grid-template-columns:repeat(6,1fr);gap:6px;margin:13px 0}.twofa-code input{width:100%;height:44px;border:1px solid var(--line);border-radius:9px;text-align:center;font-size:16px;font-weight:800;background:var(--panel);color:var(--text)}

/* Search V2 */
.command-recent{padding:7px 9px 3px;display:flex;gap:6px;flex-wrap:wrap}.command-recent button{border:1px solid var(--line);background:var(--panel);border-radius:8px;padding:6px 8px;font-size:8px;color:#667085;cursor:pointer}
.command-highlight{background:#fff3bf;border-radius:3px;color:#7a4d00}

/* Offline */
.offline-banner{position:fixed;z-index:310;left:50%;bottom:18px;transform:translate(-50%,20px);background:#101828;color:#fff;border-radius:11px;padding:9px 13px;font-size:9px;font-weight:800;opacity:0;visibility:hidden;transition:.2s}.offline-banner.show{opacity:1;visibility:visible;transform:translate(-50%,0)}

@media(max-width:1000px){.notifications-page-grid,.ticket-layout,.security-grid{grid-template-columns:1fr}.wishlist-grid{grid-template-columns:repeat(2,1fr)}}
@media(max-width:720px){.message-shell{grid-template-columns:1fr;height:auto}.message-threads{max-height:260px;border-right:0;border-bottom:1px solid var(--line)}.message-chat{min-height:500px}.wishlist-grid{grid-template-columns:1fr}.invoice-card{padding:18px}.invoice-parties{grid-template-columns:1fr}.v4-page-head{align-items:flex-start;flex-direction:column}}


/* =========================================================
   MT.NET.VN PRO V5
   ========================================================= */

/* Commerce / Cart */
.cart-page-grid{display:grid;grid-template-columns:minmax(0,1fr) 340px;gap:18px}
.cart-list{display:grid;gap:11px}.cart-item{display:grid;grid-template-columns:58px minmax(0,1fr) auto;gap:12px;align-items:center;background:var(--panel);border:1px solid var(--line);border-radius:15px;padding:15px}
.cart-icon{width:54px;height:54px;border-radius:14px;background:#eef4ff;color:var(--primary);display:grid;place-items:center;font-size:20px}.cart-item h3{font-size:12px;margin:0 0 4px}.cart-item p{font-size:9px;color:var(--muted);margin:0}.cart-item-meta{display:flex;gap:6px;flex-wrap:wrap;margin-top:7px}.cart-item-meta span{font-size:8px;background:#f4f6f8;color:#667085;padding:4px 6px;border-radius:6px}.cart-side{text-align:right}.cart-side b{display:block;font-size:12px}.cart-remove{border:0;background:transparent;color:#d92d20;font-size:8px;margin-top:7px;cursor:pointer}
.cart-summary{background:var(--panel);border:1px solid var(--line);border-radius:16px;padding:18px;height:max-content;position:sticky;top:90px}.cart-summary h3{font-size:15px;margin:5px 0 14px}.cart-row{display:flex;justify-content:space-between;padding:8px 0;font-size:10px}.cart-row.total{border-top:1px solid var(--line);padding-top:13px;margin-top:5px;font-size:15px;font-weight:900}.cart-coupon{display:flex;gap:6px;margin:12px 0}.cart-coupon input{min-width:0;flex:1;height:38px;border:1px solid var(--line);border-radius:9px;padding:0 10px;background:var(--panel);color:var(--text);font-size:9px}.cart-coupon button{border:1px solid var(--line);background:var(--panel);border-radius:9px;padding:0 10px;font-size:8px;font-weight:800}
.checkout-grid{display:grid;grid-template-columns:minmax(0,1fr) 360px;gap:18px}.checkout-panel{background:var(--panel);border:1px solid var(--line);border-radius:16px;padding:20px}.checkout-panel h2{font-size:19px;margin:5px 0 15px}.pay-methods{display:grid;gap:8px}.pay-method{border:1px solid var(--line);border-radius:11px;padding:12px;display:flex;gap:9px;align-items:center;cursor:pointer}.pay-method.active{border-color:#a8c1ff;background:#f6f9ff}.pay-method i{width:35px;height:35px;border-radius:10px;background:#eef4ff;color:var(--primary);display:grid;place-items:center}.pay-method b,.pay-method small{display:block}.pay-method b{font-size:10px}.pay-method small{font-size:8px;color:#98a2b3;margin-top:2px}
.checkout-success{min-height:72vh;display:grid;place-items:center}.success-card{max-width:700px;text-align:center;background:var(--panel);border:1px solid var(--line);border-radius:24px;padding:42px;box-shadow:var(--pro-shadow)}.success-icon{width:82px;height:82px;border-radius:24px;background:#ecfdf3;color:#039855;display:grid;place-items:center;font-size:36px;margin:auto}.success-card h1{font-size:27px;margin:16px 0 8px}.success-card p{font-size:11px;color:var(--muted);line-height:1.7}.success-order{margin:18px 0;padding:14px;border:1px solid var(--line);border-radius:12px;background:#f8fafc;text-align:left}.success-order div{display:flex;justify-content:space-between;padding:6px 0;font-size:9.5px}

/* Compare */
.compare-table-wrap{overflow:auto;background:var(--panel);border:1px solid var(--line);border-radius:16px}.compare-table{border-collapse:collapse;width:100%;min-width:900px}.compare-table th,.compare-table td{padding:13px;border-bottom:1px solid var(--line);border-right:1px solid var(--line);font-size:9.5px;text-align:center}.compare-table th:first-child,.compare-table td:first-child{text-align:left;min-width:180px}.compare-table th{background:#f8fafc}.compare-product{padding:10px}.compare-product i{width:46px;height:46px;border-radius:13px;background:#eef4ff;color:var(--primary);display:grid;place-items:center;margin:0 auto 8px;font-size:19px}.compare-product b,.compare-product small{display:block}.compare-product b{font-size:11px}.compare-product small{font-size:8px;color:#98a2b3;margin-top:3px}.compare-check{color:#17b26a;font-size:15px}.compare-no{color:#d0d5dd}

/* Help Center */
.help-hero{border-radius:24px;padding:45px;background:linear-gradient(125deg,#12203a,#2a477e 58%,#5557aa);color:#fff;text-align:center}.help-hero h1{font-size:36px;margin:10px 0}.help-hero p{font-size:12px;color:#cbd5e7}.help-search{max-width:720px;margin:22px auto 0;height:52px;background:#fff;border-radius:13px;display:flex;align-items:center;gap:9px;padding:0 14px}.help-search i{color:#98a2b3}.help-search input{flex:1;border:0;outline:0;font-size:12px}.help-category-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:12px}.help-category{background:var(--panel);border:1px solid var(--line);border-radius:15px;padding:17px}.help-category i{width:40px;height:40px;border-radius:11px;background:#eef4ff;color:var(--primary);display:grid;place-items:center}.help-category h3{font-size:12px;margin:10px 0 4px}.help-category p{font-size:9px;color:var(--muted);line-height:1.5}.help-category span{font-size:8px;color:#98a2b3}
.faq-pro{display:grid;gap:8px}.faq-pro details{background:var(--panel);border:1px solid var(--line);border-radius:12px;padding:0 14px}.faq-pro summary{padding:13px 0;font-size:10.5px;font-weight:800;cursor:pointer}.faq-pro p{font-size:9.5px;color:var(--muted);line-height:1.6;padding-bottom:13px;margin:0}

/* Activity center */
.activity-timeline{position:relative;margin-left:13px}.activity-timeline:before{content:"";position:absolute;left:12px;top:0;bottom:0;width:1px;background:var(--line)}.activity-entry{display:grid;grid-template-columns:26px 1fr;gap:12px;position:relative;padding-bottom:16px}.activity-node{width:25px;height:25px;border-radius:8px;background:#eef4ff;color:var(--primary);display:grid;place-items:center;font-size:9px;z-index:2}.activity-box{background:var(--panel);border:1px solid var(--line);border-radius:12px;padding:12px}.activity-box b,.activity-box small{display:block}.activity-box b{font-size:10px}.activity-box small{font-size:8px;color:#98a2b3;margin-top:3px}.activity-box p{font-size:9px;color:var(--muted);margin:6px 0 0}

/* Recently viewed */
.recently-viewed{display:grid;grid-template-columns:repeat(4,1fr);gap:10px}.recent-card{background:var(--panel);border:1px solid var(--line);border-radius:13px;padding:13px;display:flex;gap:9px}.recent-card i{width:35px;height:35px;border-radius:9px;background:#eef4ff;color:var(--primary);display:grid;place-items:center;flex:0 0 auto}.recent-card b,.recent-card small{display:block}.recent-card b{font-size:9.5px}.recent-card small{font-size:7.8px;color:#98a2b3;margin-top:3px}

/* PWA install */
.install-app-btn{height:40px;border:1px solid var(--line);background:var(--panel);color:#475467;border-radius:10px;padding:0 12px;font-size:9px;font-weight:800;display:none;align-items:center;gap:6px;cursor:pointer}.install-app-btn.show{display:inline-flex}

/* Command actions */
.command-action{display:grid;grid-template-columns:40px 1fr auto;gap:10px;align-items:center;padding:10px;border-radius:12px;cursor:pointer}.command-action:hover{background:#f5f8ff}.command-action i{width:38px;height:38px;border-radius:10px;background:#f4f3ff;color:#6938ef;display:grid;place-items:center}.command-action b,.command-action small{display:block}.command-action b{font-size:12px}.command-action small{font-size:9px;color:#98a2b3;margin-top:3px}.command-action span{font-size:8px;color:#98a2b3}

/* Mini cart top */
.mini-cart-wrap{position:relative}.mini-cart-panel{position:absolute;z-index:86;right:0;top:calc(100% + 12px);width:340px;background:var(--panel);border:1px solid var(--line);border-radius:16px;box-shadow:var(--pro-shadow-lg);opacity:0;visibility:hidden;transform:translateY(-8px);transition:.18s}.mini-cart-wrap.open .mini-cart-panel{opacity:1;visibility:visible;transform:none}.mini-cart-head{padding:14px;border-bottom:1px solid var(--line);display:flex;justify-content:space-between}.mini-cart-head b{font-size:12px}.mini-cart-items{padding:8px}.mini-cart-item{display:grid;grid-template-columns:34px 1fr auto;gap:8px;padding:9px;border-bottom:1px solid var(--line)}.mini-cart-item i{width:32px;height:32px;border-radius:9px;background:#eef4ff;color:var(--primary);display:grid;place-items:center}.mini-cart-item b,.mini-cart-item small{display:block}.mini-cart-item b{font-size:9px}.mini-cart-item small{font-size:7.5px;color:#98a2b3;margin-top:2px}.mini-cart-item span{font-size:8.5px;font-weight:800}.mini-cart-foot{padding:12px;border-top:1px solid var(--line)}.mini-cart-foot a{height:36px;border-radius:9px;background:var(--primary);color:#fff;display:flex;align-items:center;justify-content:center;font-size:9px;font-weight:800}

body.theme-dark .order-table th,body.theme-dark .compare-table th{background:#111a28}.theme-dark .success-order,.theme-dark .pay-method.active{background:#111a28}

@media(max-width:1050px){.cart-page-grid,.checkout-grid{grid-template-columns:1fr}.cart-summary{position:static}.help-category-grid,.recently-viewed{grid-template-columns:repeat(2,1fr)}}
@media(max-width:650px){.cart-item{grid-template-columns:46px 1fr}.cart-side{grid-column:2;text-align:left}.help-category-grid,.recently-viewed{grid-template-columns:1fr}.help-hero{padding:30px 18px}.help-hero h1{font-size:28px}.success-card{padding:28px 18px}.mini-cart-panel{position:fixed;left:10px;right:10px;top:76px;width:auto}}


/* =========================================================
   MT.NET.VN PRO V6 - SECURITY-FIRST FINAL HTML
   ========================================================= */
.v6-security-banner{display:flex;gap:10px;align-items:flex-start;padding:13px 15px;border-radius:12px;border:1px solid #b2ddff;background:#eff8ff;color:#175cd3;font-size:9.5px;line-height:1.6;margin-bottom:16px}
.v6-security-banner i{font-size:16px;margin-top:1px}.v6-security-banner b{display:block;color:#1849a9;margin-bottom:2px}
.v6-grid-2{display:grid;grid-template-columns:1fr 1fr;gap:14px}.v6-grid-3{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}.v6-card{background:var(--panel);border:1px solid var(--line);border-radius:16px;padding:18px;box-shadow:var(--pro-shadow-sm)}.v6-card h3{font-size:14px;margin:6px 0}.v6-card p{font-size:9.5px;color:var(--muted);line-height:1.6}.v6-kpi{font-size:26px;font-weight:900;letter-spacing:-.04em}.v6-muted{font-size:8.5px;color:#98a2b3}
.v6-action-row{display:flex;gap:7px;flex-wrap:wrap;margin-top:12px}.v6-chip{display:inline-flex;align-items:center;gap:5px;font-size:8px;font-weight:800;padding:5px 7px;border-radius:7px;background:#f2f4f7;color:#667085}.v6-chip.good{background:#ecfdf3;color:#039855}.v6-chip.warn{background:#fffaeb;color:#b54708}
.v6-progress{height:8px;border-radius:10px;background:#eef1f5;overflow:hidden}.v6-progress span{display:block;height:100%;background:linear-gradient(90deg,var(--primary),var(--primary2));border-radius:10px}
.v6-table-wrap{overflow:auto;background:var(--panel);border:1px solid var(--line);border-radius:15px}.v6-table{width:100%;border-collapse:collapse;min-width:760px}.v6-table th,.v6-table td{padding:12px 13px;border-bottom:1px solid var(--line);text-align:left;font-size:9px}.v6-table th{font-size:8px;text-transform:uppercase;letter-spacing:.08em;color:#98a2b3;background:#f8fafc}.v6-table td b{font-size:9.8px}
.v6-toolbar{display:flex;align-items:center;justify-content:space-between;gap:9px;flex-wrap:wrap;margin-bottom:13px}.v6-toolbar .v4-search{min-width:220px}
.v6-empty{text-align:center;padding:30px;border:1px dashed var(--line);border-radius:13px;color:#98a2b3}.v6-empty i{display:block;font-size:28px;margin-bottom:8px}.v6-empty b{display:block;font-size:11px;color:var(--text)}.v6-empty span{font-size:8.5px}

/* Custom dashboard */
.widget-board{display:grid;grid-template-columns:repeat(12,1fr);gap:12px}.dash-widget{grid-column:span 4;background:var(--panel);border:1px solid var(--line);border-radius:15px;padding:16px;position:relative;cursor:grab}.dash-widget.large{grid-column:span 8}.dash-widget.dragging{opacity:.45}.dash-widget-head{display:flex;justify-content:space-between;align-items:center}.dash-widget-head b{font-size:11px}.dash-widget-head button{border:0;background:transparent;color:#98a2b3;cursor:pointer}.dash-widget-value{font-size:24px;font-weight:900;margin-top:13px}.widget-manager{display:flex;gap:7px;flex-wrap:wrap;margin-bottom:13px}.widget-manager button{height:32px;border:1px solid var(--line);background:var(--panel);border-radius:8px;padding:0 9px;font-size:8px;cursor:pointer}.widget-manager button.off{opacity:.45;text-decoration:line-through}

/* Project center */
.project-card{background:var(--panel);border:1px solid var(--line);border-radius:16px;padding:17px}.project-head{display:flex;justify-content:space-between;gap:10px}.project-head h3{font-size:13px;margin:0 0 4px}.project-head p{font-size:8.5px;color:#98a2b3;margin:0}.project-stage{font-size:8px;font-weight:900;padding:5px 7px;border-radius:7px;background:#eef4ff;color:var(--primary);height:max-content}.project-milestones{display:grid;grid-template-columns:repeat(4,1fr);gap:6px;margin-top:13px}.project-milestone{padding:8px;border-radius:9px;background:#f8fafc;border:1px solid var(--line);font-size:8px}.project-milestone.done{background:#ecfdf3;color:#027a48}.project-files{display:flex;gap:6px;flex-wrap:wrap;margin-top:11px}.project-files a{font-size:8px;padding:6px 8px;border:1px solid var(--line);border-radius:8px}

/* Download center */
.download-card{display:grid;grid-template-columns:44px 1fr auto;gap:11px;align-items:center;padding:13px;background:var(--panel);border:1px solid var(--line);border-radius:12px}.download-icon{width:42px;height:42px;border-radius:11px;background:#eef4ff;color:var(--primary);display:grid;place-items:center}.download-card b,.download-card small{display:block}.download-card b{font-size:10px}.download-card small{font-size:8px;color:#98a2b3;margin-top:3px}.download-meta{display:flex;gap:5px;margin-top:6px}.download-meta span{font-size:7.5px;background:#f2f4f7;padding:4px 6px;border-radius:6px}.download-card .member-btn{height:34px}

/* Subscription */
.subscription-card{display:grid;grid-template-columns:1fr auto;gap:12px;background:var(--panel);border:1px solid var(--line);border-radius:14px;padding:15px}.subscription-card h3{font-size:12px;margin:0 0 4px}.subscription-card p{font-size:8.5px;color:#98a2b3}.renew-toggle{display:flex;align-items:center;gap:7px;font-size:8px}.renew-toggle input{width:34px;height:18px}

/* Finance */
.finance-balance{padding:22px;border-radius:18px;background:linear-gradient(130deg,#14213d,#29447f,#5558b0);color:#fff}.finance-balance small{font-size:8.5px;color:#b9c6d8}.finance-balance strong{display:block;font-size:32px;margin:7px 0}.finance-balance-actions{display:flex;gap:7px;margin-top:13px}

/* Quote builder */
.quote-layout{display:grid;grid-template-columns:minmax(0,1fr) 340px;gap:16px}.quote-options{display:grid;gap:9px}.quote-option{display:grid;grid-template-columns:24px 1fr auto;gap:9px;align-items:center;padding:12px;border:1px solid var(--line);border-radius:11px;background:var(--panel);cursor:pointer}.quote-option.selected{border-color:#a8c1ff;background:#f6f9ff}.quote-option input{accent-color:var(--primary)}.quote-option b,.quote-option small{display:block}.quote-option b{font-size:10px}.quote-option small{font-size:8px;color:#98a2b3;margin-top:2px}.quote-option strong{font-size:9px}.quote-summary{background:var(--panel);border:1px solid var(--line);border-radius:15px;padding:17px;height:max-content;position:sticky;top:90px}.quote-total{font-size:25px;font-weight:900;margin:9px 0}

/* Booking */
.booking-days{display:grid;grid-template-columns:repeat(7,1fr);gap:6px}.booking-day{border:1px solid var(--line);background:var(--panel);border-radius:9px;padding:9px 5px;text-align:center;cursor:pointer}.booking-day.active{background:#eef4ff;border-color:#b7ccff;color:var(--primary)}.booking-day b,.booking-day small{display:block}.booking-day b{font-size:10px}.booking-day small{font-size:7px;color:#98a2b3}.booking-slots{display:grid;grid-template-columns:repeat(4,1fr);gap:7px;margin-top:13px}.booking-slot{height:38px;border:1px solid var(--line);background:var(--panel);border-radius:9px;font-size:8px;cursor:pointer}.booking-slot.active{background:var(--primary);color:#fff;border-color:var(--primary)}

/* Theme builder */
.theme-builder-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:12px}.theme-option{padding:13px;border:1px solid var(--line);border-radius:11px}.theme-option label{font-size:9px;font-weight:800;display:block;margin-bottom:8px}.theme-swatches{display:flex;gap:7px}.theme-swatch{width:30px;height:30px;border-radius:9px;border:3px solid transparent;cursor:pointer}.theme-swatch.active{border-color:#101828}.density-toggle{display:flex;gap:6px}.density-toggle button{height:31px;border:1px solid var(--line);background:var(--panel);border-radius:8px;padding:0 9px;font-size:8px}.density-toggle button.active{background:#eef4ff;color:var(--primary)}

/* Security modal / session */
.security-session-banner{position:fixed;z-index:320;left:50%;bottom:20px;transform:translate(-50%,20px);background:#101828;color:#fff;padding:11px 14px;border-radius:11px;box-shadow:var(--pro-shadow);font-size:8.5px;opacity:0;visibility:hidden;transition:.2s}.security-session-banner.show{opacity:1;visibility:visible;transform:translate(-50%,0)}
.security-status-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:8px}.security-status{padding:11px;border:1px solid var(--line);border-radius:10px;background:var(--panel)}.security-status i{color:#039855}.security-status b,.security-status small{display:block}.security-status b{font-size:9px;margin-top:6px}.security-status small{font-size:7.5px;color:#98a2b3;margin-top:2px}

body.theme-dark .v6-table th,.theme-dark .project-milestone{background:#111a28}.theme-dark .quote-option.selected{background:#111a28}.theme-dark .v6-security-banner{background:#10233a;color:#b2ddff;border-color:#194f7a}
body.compact-mode .v6-card,body.compact-mode .member-panel,body.compact-mode .dash-widget{padding:12px}body.compact-mode .section{padding-top:34px}
@media(max-width:1050px){.v6-grid-3,.security-status-grid{grid-template-columns:repeat(2,1fr)}.quote-layout{grid-template-columns:1fr}.quote-summary{position:static}.dash-widget,.dash-widget.large{grid-column:span 6}}
@media(max-width:700px){.v6-grid-2,.v6-grid-3,.theme-builder-grid,.security-status-grid{grid-template-columns:1fr}.dash-widget,.dash-widget.large{grid-column:span 12}.project-milestones{grid-template-columns:repeat(2,1fr)}.booking-days{grid-template-columns:repeat(4,1fr)}.booking-slots{grid-template-columns:repeat(2,1fr)}}

.auth-alert{margin:0 0 12px;padding:10px 12px;border:1px solid #fecdca;background:#fef3f2;color:#b42318;border-radius:10px;font-size:12px;line-height:1.5}


/* =========================================================
   PRO6 V6 LEGACY SIDEBAR COLLISION GUARD
   ========================================================= */
#main-content .sidebar,
.pro6-legacy-content .sidebar{
  position:static!important;inset:auto!important;width:auto!important;height:auto!important;
  min-height:0!important;max-width:100%!important;z-index:auto!important;transform:none!important;
  display:block!important;flex:none!important;background:transparent!important;color:inherit!important;
  box-shadow:none!important;border:0!important;padding:0!important;margin:0!important;overflow:visible!important
}
#main-content .main,.pro6-legacy-content .main{
  margin-left:0!important;min-height:0!important;position:static!important;width:auto!important;transform:none!important
}