:root{
--bg-app:        #0A0F1E;
--bg-app-2:      #0B1322;
--bg-sidebar:    #0A0F1E;
--bg-card:       #121B30;
--bg-card-soft:  #0F1828;
--bg-pill:       #18233B;
--border-soft:   rgba(255,255,255,0.06);
--border-mid:    rgba(255,255,255,0.10);
--text-primary:  #F4F6FB;
--text-secondary:#9AA7C2;
--text-muted:    #5C6886;
--accent-blue:       #3B6FF6;
--accent-blue-dark:  #1E4FD6;
--accent-blue-soft:  rgba(59,111,246,0.14);
--accent-cyan:       #38C6D9;
--accent-orange:     #F2622E;
--accent-purple:     #8B5CF6;
--accent-teal:       #14B8A6;
--accent-red:        #EF4444;
--accent-green:      #22C55E;
--radius-sm: 8px;
--radius-md: 14px;
--radius-lg: 20px;
--radius-pill: 999px;
--shadow-card: 0 6px 22px rgba(0,0,0,0.35);
--sidebar-w: 248px;
--font-sans: -apple-system, BlinkMacSystemFont, "Segoe UI", Inter, Roboto, Helvetica, Arial, sans-serif;
} *,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{
margin:0;
font-family:var(--font-sans);
background:var(--bg-app);
color:var(--text-primary);
line-height:1.5;
-webkit-font-smoothing:antialiased;
}
img{max-width:100%;display:block}
a{color:inherit;text-decoration:none}
ul{margin:0;padding:0;list-style:none}
button{font-family:inherit;cursor:pointer}
input{font-family:inherit}
h1,h2,h3,h4,p{margin:0}
.b2b-icon{width:18px;height:18px;flex-shrink:0;stroke:currentColor;fill:none;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.screen-reader-text{position:absolute !important;left:-9999px;top:-9999px} .b2b-app{
display:flex;
min-height:100vh;
background:
radial-gradient(circle at 15% 0%, rgba(59,111,246,0.10), transparent 45%),
var(--bg-app);
} .b2b-sidebar{
width:var(--sidebar-w);
flex-shrink:0;
padding:20px 16px 24px;
display:flex;
flex-direction:column;
gap:18px;
border-right:1px solid var(--border-soft);
position:sticky;
top:0;
height:100vh;
overflow-y:auto;
}
.b2b-logo{
display:flex;
align-items:center;
gap:10px;
background:#fff;
border-radius:var(--radius-md);
padding:10px 14px;
}
.b2b-logo-mark{
display:grid;
grid-template-columns:1fr 1fr;
gap:2px;
width:26px;height:26px;flex-shrink:0;
}
.b2b-logo-mark span{border-radius:3px}
.b2b-logo-mark span:nth-child(1){background:#0B1322}
.b2b-logo-mark span:nth-child(2){background:var(--accent-blue)}
.b2b-logo-mark span:nth-child(3){background:var(--accent-blue)}
.b2b-logo-mark span:nth-child(4){background:#0B1322}
.b2b-logo-text strong{display:block;font-size:15px;letter-spacing:.02em;color:#0B1322;line-height:1.1}
.b2b-logo-text small{display:block;font-size:9.5px;letter-spacing:.12em;color:#8089a0;font-weight:600} .b2b-nav{display:flex;flex-direction:column;gap:2px;flex:1}
.b2b-nav-item{
display:flex;align-items:center;gap:11px;
padding:10px 12px;border-radius:var(--radius-sm);
color:var(--text-secondary);font-size:13.5px;font-weight:500;
transition:background .15s,color .15s;
width:100%;background:none;border:none;text-align:left;
}
.b2b-nav-item:hover{background:rgba(255,255,255,0.04);color:var(--text-primary)}
.b2b-nav-item.is-active{background:var(--accent-blue);color:#fff}
.b2b-nav-item .b2b-icon{opacity:.9;flex-shrink:0}
.b2b-nav-group{display:flex;flex-direction:column}
.b2b-nav-toggle{cursor:pointer}
.b2b-nav-chevron{margin-left:auto;width:15px;height:15px;transition:transform .18s}
.b2b-nav-group.is-open .b2b-nav-chevron{transform:rotate(180deg)}
.b2b-nav-group.is-open > .b2b-nav-toggle{background:rgba(255,255,255,0.04);color:var(--text-primary)}
.b2b-submenu{
display:none;flex-direction:column;gap:1px;
padding:4px 0 6px 0;margin-left:21px;
border-left:1px solid var(--border-soft);
}
.b2b-nav-group.is-open .b2b-submenu{display:flex}
.b2b-subnav-item{
display:block;padding:8px 12px;margin-left:8px;
font-size:12.5px;color:var(--text-secondary);border-radius:var(--radius-sm);
transition:background .15s,color .15s;
}
.b2b-subnav-item:hover{background:rgba(255,255,255,0.04);color:var(--text-primary)}
.b2b-subnav-item.is-active{color:var(--accent-blue);font-weight:600}
.b2b-sidebar-foot{display:flex;flex-direction:column;gap:10px}
.b2b-user-card{
background:var(--bg-card);border:1px solid var(--border-soft);
border-radius:var(--radius-md);padding:12px;
display:flex;align-items:center;gap:10px;
}
.b2b-user-card img,.b2b-user-card .b2b-avatar{
width:38px;height:38px;border-radius:50%;object-fit:cover;flex-shrink:0;
}
.b2b-user-card strong{font-size:13px;display:block}
.b2b-user-card span{font-size:11.5px;color:var(--text-muted)}
.b2b-help-card{
display:flex;align-items:center;justify-content:space-between;gap:8px;
background:transparent;border:1px solid var(--border-soft);
border-radius:var(--radius-md);padding:12px;font-size:12.5px;color:var(--text-secondary);
} .b2b-main{flex:1;min-width:0;padding:20px 28px 60px} .b2b-topbar{
display:flex;align-items:center;justify-content:space-between;gap:24px;
margin-bottom:22px;flex-wrap:wrap;
}
.b2b-greeting h1{font-size:19px;font-weight:700}
.b2b-greeting p{font-size:13px;color:var(--text-secondary);margin-top:2px}
.b2b-topbar-right{display:flex;align-items:center;gap:14px}
.b2b-search{
display:flex;align-items:center;gap:8px;
background:var(--bg-card);border:1px solid var(--border-soft);
border-radius:var(--radius-pill);padding:9px 16px;min-width:280px;
}
.b2b-search input{
background:none;border:none;outline:none;color:var(--text-primary);
font-size:13px;width:100%;
}
.b2b-search input::placeholder{color:var(--text-muted)}
.b2b-search .b2b-icon{color:var(--text-muted)}
.b2b-bell{position:relative;display:flex;align-items:center;justify-content:center;
width:38px;height:38px;border-radius:50%;background:var(--bg-card);
border:1px solid var(--border-soft);color:var(--text-secondary);cursor:pointer}
.b2b-bell .b2b-badge{
position:absolute;top:-4px;right:-4px;background:var(--accent-red);color:#fff;
font-size:10px;font-weight:700;border-radius:50%;width:17px;height:17px;
display:flex;align-items:center;justify-content:center;border:2px solid var(--bg-app);
}
.b2b-user-menu{display:flex;align-items:center;gap:6px;cursor:pointer}
.b2b-user-pill{
width:36px;height:36px;border-radius:50%;display:flex;align-items:center;justify-content:center;
background:linear-gradient(135deg,var(--accent-blue),var(--accent-purple));
color:#fff;font-size:12.5px;font-weight:700;
} .b2b-dropdown{position:relative}
.b2b-dropdown-panel{
position:absolute;right:0;top:calc(100% + 10px);width:300px;
background:var(--bg-card);border:1px solid var(--border-mid);
border-radius:var(--radius-md);box-shadow:var(--shadow-card);
padding:8px;z-index:40;display:none;
}
.b2b-dropdown.is-open .b2b-dropdown-panel{display:block}
.b2b-dropdown-item{display:flex;gap:10px;padding:10px;border-radius:var(--radius-sm)}
.b2b-dropdown-item:hover{background:rgba(255,255,255,0.04)}
.b2b-dropdown-item strong{font-size:12.5px;display:block}
.b2b-dropdown-item p{font-size:11.5px;color:var(--text-secondary);margin-top:2px} .b2b-section{margin-bottom:26px}
.b2b-section-head{
display:flex;align-items:center;justify-content:space-between;margin-bottom:13px;
}
.b2b-section-head h2{
font-size:12.5px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;
color:var(--text-primary);padding-left:10px;border-left:3px solid var(--accent-blue);
}
.b2b-section-head a{
font-size:12.5px;color:var(--accent-blue);font-weight:600;display:flex;align-items:center;gap:4px;
} .b2b-hero{
position:relative;border-radius:var(--radius-lg);overflow:hidden;
min-height:230px;display:flex;align-items:flex-end;margin-bottom:26px;
background-size:cover;background-position:center;
}
.b2b-hero::before{
content:"";position:absolute;inset:0;
background:linear-gradient(90deg, rgba(8,12,24,0.92) 0%, rgba(8,12,24,0.55) 45%, rgba(8,12,24,0.15) 100%);
}
.b2b-hero-content{position:relative;z-index:1;padding:26px 30px}
.b2b-hero-title{
font-size:30px;font-weight:800;line-height:1.08;text-transform:uppercase;
letter-spacing:.01em;color:#fff;margin-bottom:14px;
}
.b2b-hero-title em{color:var(--accent-cyan);font-style:normal;display:block}
.b2b-hero-title span{display:block}
.b2b-hero-tags{display:flex;align-items:center;gap:14px;flex-wrap:wrap}
.b2b-hero-tags span{
display:flex;align-items:center;gap:6px;font-size:12.5px;color:#E3E8F4;font-weight:600;
}
.b2b-hero-tags span .b2b-icon{width:15px;height:15px;color:var(--accent-cyan)} .b2b-grid{display:grid;grid-template-columns:2fr 1fr;gap:24px;align-items:start} .b2b-quick-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
.b2b-quick-card{
background:linear-gradient(160deg,var(--bg-card) 0%, var(--bg-card-soft) 100%);
border:1px solid var(--border-soft);border-radius:var(--radius-md);
padding:18px;position:relative;min-height:140px;display:flex;flex-direction:column;gap:10px;
transition:transform .15s, border-color .15s;
}
.b2b-quick-card:hover{transform:translateY(-2px);border-color:var(--border-mid)}
.b2b-quick-icon{
width:38px;height:38px;border-radius:11px;display:flex;align-items:center;justify-content:center;color:#fff;
}
.b2b-quick-card h3{font-size:14.5px;font-weight:700}
.b2b-quick-card p{font-size:12px;color:var(--text-secondary);line-height:1.45}
.b2b-quick-arrow{
position:absolute;right:16px;bottom:16px;width:26px;height:26px;border-radius:50%;
border:1px solid var(--border-mid);display:flex;align-items:center;justify-content:center;color:var(--text-secondary);
} .b2b-events-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
.b2b-event-card{
background:var(--bg-card);border:1px solid var(--border-soft);border-radius:var(--radius-md);
padding:14px;display:flex;gap:12px;align-items:flex-start;
}
.b2b-event-date{
background:var(--accent-blue-soft);color:var(--accent-blue);border-radius:var(--radius-sm);
padding:8px 10px;text-align:center;min-width:54px;
}
.b2b-event-date strong{display:block;font-size:19px;font-weight:800;line-height:1}
.b2b-event-date span{display:block;font-size:10px;font-weight:700;letter-spacing:.05em;margin-top:2px}
.b2b-event-info h3{font-size:13px;font-weight:700;margin-bottom:6px;line-height:1.3}
.b2b-event-meta{display:flex;align-items:center;gap:5px;font-size:11.5px;color:var(--text-secondary);margin-bottom:3px}
.b2b-event-meta .b2b-icon{width:13px;height:13px} .b2b-panel{background:var(--bg-card);border:1px solid var(--border-soft);border-radius:var(--radius-md);padding:6px;margin-bottom:24px}
.b2b-panel-inner{padding:8px}
.b2b-news-item{display:flex;gap:10px;padding:10px 8px;border-radius:var(--radius-sm)}
.b2b-news-item:hover{background:rgba(255,255,255,0.03)}
.b2b-news-icon{
width:32px;height:32px;border-radius:9px;display:flex;align-items:center;justify-content:center;
background:var(--accent-blue-soft);color:var(--accent-blue);flex-shrink:0;
}
.b2b-news-body{flex:1;min-width:0}
.b2b-news-body strong{font-size:12.5px;font-weight:700;display:block}
.b2b-news-body p{font-size:11.5px;color:var(--text-secondary);margin-top:2px;line-height:1.4}
.b2b-news-time{font-size:10.5px;color:var(--text-muted);white-space:nowrap;padding-top:2px}
.b2b-panel-foot{
display:flex;align-items:center;justify-content:center;gap:6px;
padding:10px;font-size:12px;font-weight:600;color:var(--accent-blue);
border-top:1px solid var(--border-soft);margin-top:4px;
} .b2b-highlights-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:16px}
.b2b-highlight-card{
background:var(--bg-card);border:1px solid var(--border-soft);border-radius:var(--radius-md);
overflow:hidden;display:flex;flex-direction:column;
}
.b2b-highlight-card img{width:100%;height:96px;object-fit:cover}
.b2b-highlight-body{padding:12px}
.b2b-highlight-body h3{font-size:12.5px;font-weight:700;margin-bottom:5px;line-height:1.3}
.b2b-highlight-body p{font-size:11px;color:var(--text-secondary);line-height:1.4}
.b2b-quote-card{
background:linear-gradient(160deg,var(--accent-blue-dark),var(--bg-card));
border-radius:var(--radius-md);padding:16px;display:flex;flex-direction:column;justify-content:space-between;
}
.b2b-quote-card .b2b-icon{width:22px;height:22px;color:rgba(255,255,255,0.55);margin-bottom:8px}
.b2b-quote-card blockquote{font-size:13px;font-weight:600;line-height:1.4;font-style:italic;color:#fff;margin-bottom:8px}
.b2b-quote-card cite{font-size:10.5px;color:rgba(255,255,255,0.7);font-style:normal;display:block;margin-bottom:10px}
.b2b-quote-card .b2b-quote-brand{font-size:10px;font-weight:700;color:rgba(255,255,255,0.85);text-align:right} .b2b-doc-item{display:flex;align-items:center;gap:10px;padding:10px 8px;border-radius:var(--radius-sm)}
.b2b-doc-item:hover{background:rgba(255,255,255,0.03)}
.b2b-doc-icon{
width:34px;height:34px;border-radius:9px;display:flex;align-items:center;justify-content:center;color:#fff;flex-shrink:0;
}
.b2b-doc-body{flex:1;min-width:0}
.b2b-doc-body strong{font-size:12.5px;font-weight:700;display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.b2b-doc-body span{font-size:11px;color:var(--text-muted)}
.b2b-doc-dl{
width:30px;height:30px;border-radius:50%;border:1px solid var(--border-mid);
display:flex;align-items:center;justify-content:center;color:var(--text-secondary);flex-shrink:0;
}
.b2b-doc-cta{
display:flex;align-items:center;gap:12px;background:var(--accent-blue);border-radius:var(--radius-md);
padding:14px;margin-top:6px;
}
.b2b-doc-cta .b2b-icon{width:20px;height:20px;color:#fff}
.b2b-doc-cta-text strong{font-size:13px;font-weight:700;color:#fff;display:block}
.b2b-doc-cta-text span{font-size:11px;color:rgba(255,255,255,0.8)}
.b2b-doc-cta .b2b-icon.chevron{margin-left:auto} .b2b-menu-toggle{
display:none;width:38px;height:38px;border-radius:var(--radius-sm);background:var(--bg-card);
border:1px solid var(--border-soft);align-items:center;justify-content:center;color:var(--text-primary);
} @media (max-width:1180px){
.b2b-grid{grid-template-columns:1fr}
.b2b-highlights-grid{grid-template-columns:repeat(2,1fr)}
}
@media (max-width:980px){
.b2b-quick-grid,.b2b-events-grid{grid-template-columns:1fr}
.b2b-search{min-width:180px}
}
@media (max-width:860px){
.b2b-sidebar{
position:fixed;left:0;top:0;z-index:50;transform:translateX(-100%);
transition:transform .2s ease;background:var(--bg-app);width:260px;
}
body.b2b-menu-open .b2b-sidebar{transform:translateX(0)}
.b2b-menu-toggle{display:flex}
.b2b-main{padding:16px}
.b2b-highlights-grid{grid-template-columns:1fr 1fr}
}
@media (max-width:560px){
.b2b-topbar{flex-direction:column;align-items:stretch}
.b2b-topbar-right{justify-content:space-between}
.b2b-search{flex:1;min-width:0}
.b2b-hero-title{font-size:22px}
.b2b-highlights-grid{grid-template-columns:1fr}
}