/* Shared header + sidebar UI for CNP pages */
.cnp-top-bar{
  height:38px;
  display:flex;
  align-items:center;
  background:#121821;
  color:#b8c0cf;
  position:fixed;
  left:0;
  right:0;
  top:0;
  z-index:1002;
  transition:all .35s cubic-bezier(.4,0,.2,1);
}
.cnp-top-bar.hidden{transform:translateY(-100%);opacity:0}
.cnp-shared-container{max-width:1240px;margin:0 auto;padding:0 24px}
.cnp-top-bar .cnp-shared-container{display:flex;align-items:center;justify-content:space-between;font-size:13px}
.cnp-top-left,.cnp-top-right{display:flex;gap:16px;align-items:center}
.cnp-top-left span{display:flex;gap:6px;align-items:center}
.cnp-top-left i,.cnp-top-right i{color:#da7c2c}

.cnp-header{position:fixed;left:0;right:0;top:38px;z-index:1001;transition:all .35s cubic-bezier(.4,0,.2,1)}
.cnp-header-inner{border-bottom:1px solid rgba(255,255,255,.2);background:rgba(255,255,255,0);transition:all .35s cubic-bezier(.4,0,.2,1)}
.cnp-header-container{height:84px;display:flex;align-items:center;justify-content:space-between;gap:24px;transition:all .35s cubic-bezier(.4,0,.2,1)}
.cnp-header.scrolled{top:0}
.cnp-header.scrolled .cnp-header-inner{background:rgba(255,255,255,.98);backdrop-filter:blur(16px);box-shadow:0 8px 26px rgba(14,26,45,.09);border-bottom:1px solid #e4e9f2}
.cnp-header.scrolled .cnp-header-container{height:70px}

.cnp-logo{display:flex;align-items:center;gap:12px;text-decoration:none}
.cnp-logo-mark{width:46px;height:46px;background:linear-gradient(135deg,#da7c2c,#f5a623);border-radius:10px;display:flex;align-items:center;justify-content:center;color:#fff;font-family:'Poppins',sans-serif;font-weight:800;font-size:18px;transition:transform .3s}
.cnp-logo:hover .cnp-logo-mark{transform:rotate(-6deg) scale(1.05)}
.cnp-logo-text{font-size:20px;font-weight:800;color:#fff;transition:color .4s}
.cnp-logo-text em{font-style:normal;color:#da7c2c}
.cnp-header.scrolled .cnp-logo-text{color:#1b2332}
.cnp-nav{display:flex;align-items:center;gap:4px;list-style:none;margin:0;padding:0}
.cnp-nav li a{position:relative;display:flex;align-items:center;justify-content:center;min-height:44px;padding:0 16px;border-radius:10px;font-size:15px;font-weight:500;line-height:1;color:rgba(255,255,255,.92);transition:all .35s cubic-bezier(.4,0,.2,1);text-decoration:none;white-space:nowrap}
.cnp-nav li a:hover{background:rgba(255,255,255,.12)}
.cnp-header.scrolled .cnp-nav li a{color:#1b2332}
.cnp-header.scrolled .cnp-nav li a:hover{background:#f1f4f8;color:#da7c2c}
.cnp-nav li a.active{color:#da7c2c !important}
.cnp-nav li a.active::after{content:'';position:absolute;left:14px;right:14px;bottom:7px;height:2px;background:#da7c2c;border-radius:2px}

.cnp-header-cta{display:flex;align-items:center;gap:12px}
.cnp-header-search-btn{width:38px;height:38px;border-radius:8px;display:flex;align-items:center;justify-content:center;color:rgba(255,255,255,.85);font-size:16px;transition:all .35s cubic-bezier(.4,0,.2,1)}
.cnp-header-search-btn:hover{background:rgba(255,255,255,.15);color:#fff}
.cnp-header.scrolled .cnp-header-search-btn{color:#4e5d75}
.cnp-header.scrolled .cnp-header-search-btn:hover{background:#f1f4f8;color:#da7c2c}

.cnp-btn-cta{display:inline-flex;align-items:center;justify-content:center;gap:8px;height:42px;padding:0 20px;border-radius:50px;background:#da7c2c;color:#fff;font-weight:800;transition:all .35s cubic-bezier(.4,0,.2,1);text-decoration:none}
.cnp-btn-cta:hover{background:#b9651f;transform:translateY(-1px)}
.cnp-mobile-toggle{display:none;color:#fff;font-size:22px;padding:8px;background:transparent;border:none;cursor:pointer}
.cnp-header.scrolled .cnp-mobile-toggle{color:#1b2332}

.cnp-mobile-nav-overlay{position:fixed;inset:0;background:rgba(0,0,0,.46);z-index:1099;opacity:0;visibility:hidden;transition:all .35s cubic-bezier(.4,0,.2,1)}
.cnp-mobile-nav-overlay.open{opacity:1;visibility:visible}
.cnp-mobile-nav{position:fixed;top:0;right:-320px;width:300px;height:100%;background:#fff;z-index:1100;transition:right .35s cubic-bezier(.4,0,.2,1);padding:24px 20px}
.cnp-mobile-nav.open{right:0}
.cnp-mobile-nav-header{display:flex;align-items:center;justify-content:space-between;padding-bottom:12px;border-bottom:1px solid #edf1f6}
.cnp-mobile-nav-close{font-size:20px;color:#4e5d75;padding:6px;background:transparent;border:none}
.cnp-mobile-nav-title{font-weight:800;font-size:20px;color:#1d2431;text-decoration:none}
.cnp-mobile-nav ul{margin-top:18px;list-style:none;padding:0}
.cnp-mobile-nav li a{display:block;padding:12px 2px;border-bottom:1px solid #edf1f6;font-weight:700;color:#2a3344;text-decoration:none}

.cnp-sidebar-right{position:fixed;right:0;top:50%;transform:translateY(-50%);z-index:950;display:flex;flex-direction:column;border-radius:12px 0 0 12px;box-shadow:-4px 0 26px rgba(0,0,0,.16);overflow:visible}
.cnp-sb-item{position:relative;background:#fff;border-bottom:1px solid #eceff5;border-left:3px solid transparent;transition:all .24s}
.cnp-sb-item:first-child{border-radius:12px 0 0 0}
.cnp-sb-item:last-child{border-radius:0 0 0 12px;border-bottom:none}
.cnp-sb-item:hover{background:#f8fafc;border-left-color:#da7c2c}
.cnp-sb-item a{width:52px;height:52px;display:flex;align-items:center;justify-content:center;color:#6f7d95;text-decoration:none}
.cnp-sb-item i{font-size:18px}
.cnp-sb-item:hover i{color:#da7c2c}
.cnp-sb-item.accent{background:#da7c2c}
.cnp-sb-item.accent i{color:#fff}
.cnp-sb-item .sb-label{position:absolute;right:100%;top:50%;transform:translateY(-50%) translateX(8px);opacity:0;visibility:hidden;transition:all .2s;white-space:nowrap;padding:8px 14px;border-radius:8px 0 0 8px;background:#fff;border:1px solid #dfe5ef;border-right:none;color:#2b3445;font-size:13px;font-weight:800}
.cnp-sb-item:hover .sb-label{opacity:1;visibility:visible;transform:translateY(-50%) translateX(0)}
.cnp-sb-item.accent .sb-label{background:#b86217;color:#fff;border-color:#a35512}

.has-shared-header-offset .main-wrap{padding-top:122px}

@media (max-width:1100px){
  .cnp-nav,.cnp-header-cta{display:none}
  .cnp-mobile-toggle{display:block}
  .cnp-sidebar-right{display:none}
}

@media (max-width:768px){
  .cnp-top-bar{display:none}
  .cnp-header{top:0}
  .cnp-header-container{height:72px}
  .has-shared-header-offset .main-wrap{padding-top:72px}
}