:root{--cf-blue:#1677f9;--cf-blue-2:#0754c8;--cf-navy:#06285f;--cf-bg:#f5f8fd;--cf-surface:#fff;--cf-text:#17243b;--cf-muted:#7b879c;--cf-border:#e5ebf4;--cf-soft:#eef6ff;--cf-success:#15966f;--cf-danger:#c43d50;--cf-shadow:0 14px 38px rgba(23,45,82,.07);--cf-radius:18px}
html,body{background:linear-gradient(180deg,#f8fbff 0%,#f3f6fb 100%)!important;color:var(--cf-text)!important}
body,*{font-family:'Hind Siliguri','Poppins',system-ui,sans-serif}
a{color:inherit}
/* shared public shell */
.cf-sidebar{background:rgba(255,255,255,.96)!important;border-color:var(--cf-border)!important;box-shadow:0 18px 45px rgba(15,47,114,.09)!important}
.cf-brand-logo,.cf-mobile-brand-logo{object-fit:contain!important}
.cf-menu a.active,.cf-menu a:hover{background:var(--cf-soft)!important;color:var(--cf-blue)!important}
.cf-top{background:rgba(255,255,255,.94)!important;border-color:var(--cf-border)!important}
.cf-search{border-color:var(--cf-border)!important;background:#fff!important}
.cf-search:focus-within{border-color:#9ec5ff!important;box-shadow:0 0 0 4px rgba(22,119,249,.08)!important}
.cf-search i,.cf-icon{color:var(--cf-blue)!important}
.cf-heading-icon,.cf-cat-icon,.cf-bottom-note>i{background:var(--cf-soft)!important;color:var(--cf-blue)!important}
.cf-filter,.cf-category-tab.active,.cf-bottom-note a,.cf-view-btn:hover{background:linear-gradient(135deg,var(--cf-blue),var(--cf-blue-2))!important;border-color:transparent!important;color:#fff!important}
.cf-project-card:hover{border-color:#bcd7fb!important}
.cf-project-card{box-shadow:var(--cf-shadow)!important}
.cf-project-card,.cf-category-panel,.cf-bottom-note,.cf-profile-card,.cf-profile-hero{border-color:var(--cf-border)!important}
.cf-mobile-nav{border-color:var(--cf-border)!important}
.cf-mobile-nav-item.active{color:var(--cf-blue)!important;background:var(--cf-soft)!important}
/* order flow: real responsive website, not phone mockup */
.cf-order-shell{min-height:100vh;display:flex;background:linear-gradient(180deg,#f8fbff,#f3f6fb)}
.cf-order-sidebar{position:fixed;left:18px;top:18px;bottom:18px;width:205px;background:rgba(255,255,255,.96);border:1px solid var(--cf-border);border-radius:24px;box-shadow:0 18px 45px rgba(15,47,114,.09);padding:18px 12px;z-index:50;display:flex;flex-direction:column}
.cf-order-brand{display:block;text-align:center;padding:8px 8px 20px;border-bottom:1px solid var(--cf-border)}
.cf-order-brand img{width:150px;max-width:100%;height:42px;object-fit:contain}
.cf-order-menu{display:grid;gap:6px;padding-top:16px}
.cf-order-menu a{display:flex;align-items:center;gap:11px;text-decoration:none;color:#68758b;padding:12px 13px;border-radius:13px;font-size:11px;font-weight:700}
.cf-order-menu a:hover{background:var(--cf-soft);color:var(--cf-blue)}
.cf-order-menu i{width:18px;text-align:center}
.cf-order-main{width:100%;margin-left:245px;min-height:100vh;display:flex;flex-direction:column;position:relative}
.cf-order-top{height:76px;display:flex;align-items:center;justify-content:space-between;padding:0 42px;background:rgba(255,255,255,.9);border-bottom:1px solid var(--cf-border);position:sticky;top:0;z-index:30;backdrop-filter:blur(14px)}
.cf-order-top h2{font-family:Poppins,sans-serif;font-size:18px;margin:0}.cf-order-top p{font-size:10px;color:var(--cf-muted);margin:2px 0 0}.cf-order-close{width:40px;height:40px;border:1px solid var(--cf-border);border-radius:12px;display:grid;place-items:center;text-decoration:none;color:var(--cf-muted);background:#fff}.cf-order-close:hover{color:var(--cf-blue);background:var(--cf-soft)}
.cf-order-main .of-content{width:min(1120px,calc(100% - 64px));margin:0 auto;padding:28px 0 115px;background:transparent;overflow:visible;flex:1}
.cf-order-main .of-header{height:auto;padding:0;border:0;background:transparent}
.cf-order-main .stepper{width:min(1120px,calc(100% - 64px));margin:22px auto 0;height:82px;border:1px solid var(--cf-border);border-radius:18px;background:#fff;box-shadow:var(--cf-shadow);padding:10px 14px}
.cf-order-main .step{font-size:10px}.cf-order-main .step .num{width:34px;height:34px}.cf-order-main .of-title{font-size:28px}.cf-order-main .of-sub{font-size:12px}.cf-order-main .card{border-radius:18px;box-shadow:var(--cf-shadow);padding:20px}.cf-order-main .input,.cf-order-main .select,.cf-order-main textarea{font-size:12px;padding:12px 13px;border-radius:12px}.cf-order-main .field label{font-size:11px}.cf-order-main .bottom{position:fixed;left:245px;right:0;bottom:0;padding:14px 42px;background:rgba(255,255,255,.95);border-top:1px solid var(--cf-border);box-shadow:0 -10px 30px rgba(23,45,82,.06);justify-content:flex-end}.cf-order-main .bottom .btn{flex:0 1 210px;min-height:46px;border-radius:13px;font-size:11px}.cf-order-main .btn.primary{background:linear-gradient(135deg,var(--cf-blue),var(--cf-blue-2))}.cf-order-main .btn.secondary{background:#fff;border-color:var(--cf-border)}
/* checkout/success pages that still use old order shell */
body>.app .of-header{background:#fff!important;border-color:var(--cf-border)!important}
body>.app .of-brand .icon{background:var(--cf-soft)!important;color:var(--cf-blue)!important}
body>.app .of-close{border-color:var(--cf-border)!important}
@media(max-width:700px){
 .cf-sidebar{display:none!important}.cf-main{margin-left:0!important}
 .cf-order-shell{display:block}.cf-order-sidebar{display:none}.cf-order-main{margin-left:0;min-height:100vh;padding-bottom:78px}
 .cf-order-top{height:64px;padding:0 14px}.cf-order-top h2{font-size:15px}.cf-order-top p{font-size:8px}.cf-order-close{width:36px;height:36px}
 .cf-order-main .of-content{width:auto;margin:0;padding:18px 12px 105px}.cf-order-main .stepper{width:auto;margin:10px 12px 0;height:76px;border-radius:16px;padding:8px}.cf-order-main .step{font-size:8px}.cf-order-main .step .num{width:29px;height:29px;font-size:9px}
 .cf-order-main .of-title{font-size:22px}.cf-order-main .of-sub{font-size:10px}.cf-order-main .card{padding:14px;border-radius:16px}.cf-order-main .bottom{left:0;right:0;padding:10px 12px;gap:7px}.cf-order-main .bottom .btn{flex:1;min-height:44px;font-size:10px}
 .cf-mobile-nav{display:grid!important}
}
