:root{--primary: #DC2626;--primary-hover: #B91C1C;--primary-active: #991B1B;--red-500: #EF4444;--red-400: #F87171;--red-300: #FCA5A5;--red-200: #FECACA;--red-100: #FEE2E2;--red-50: #FEF2F2;--text-main: #111827;--text-secondary: #374151;--text-muted: #6B7280;--text-light: #9CA3AF;--bg-main: #FFFFFF;--bg-soft: #FEF2F2;--bg-card: #FFFFFF;--bg-glass: rgba(255, 255, 255, .85);--border-light: #FECACA;--border-soft: rgba(255, 255, 255, .5);--btn-shadow-color: 220 38 38;--btn-shadow-normal: 0 10px 15px -3px rgb(var(--btn-shadow-color) / .3), 0 4px 6px -4px rgb(var(--btn-shadow-color) / .3);--btn-shadow-hover: 0 10px 15px -3px rgb(var(--btn-shadow-color) / .5), 0 4px 6px -4px rgb(var(--btn-shadow-color) / .5);--cursor-text: url(/assets/cursor-text-CoiuP1OG.svg) 8 16, text;--cursor-grab: url(/assets/cursor-grab-CGDCQQkm.svg) 16 16, grab;--cursor-normal: url("data:image/svg+xml,%3csvg%20xmlns='http://www.w3.org/2000/svg'%20width='24'%20height='24'%20viewBox='0%200%2024%2024'%20fill='none'%3e%3cpath%20d='M22.3279%2010.8314L14.2845%2013.6783L10.8993%2022.26C10.4168%2023.5492%208.77187%2023.5187%208.3621%2022.2065L0.945274%202.7207C0.554525%201.46706%201.72469%200.29689%202.80974%200.856241L22.5446%208.02406C23.672%208.61855%2023.5227%2010.4433%2022.3279%2010.8314Z'%20fill='%232A1F31'%20stroke='white'/%3e%3c/svg%3e") 0 0, auto}*{margin:0;padding:0;box-sizing:border-box;letter-spacing:.3px;font-family:Inter,sans-serif}button{border:none;cursor:pointer}.primary-button{background-color:var(--primary);box-shadow:var(--btn-shadow-normal);border-radius:8px;color:#fff}.primary-button:hover{background-color:var(--primary-hover);box-shadow:var(--btn-shadow-hover)}.primary-button:active{background-color:var(--primary-active);box-shadow:var(--btn-shadow-hover)}.primary-button:disabled{opacity:.4;cursor:not-allowed}.secondary-button{background-color:var(--red-100);color:var(--primary);border-radius:8px}.secondary-button:hover{background-color:var(--red-200);color:var(--primary)}.secondary-button:active{background-color:var(--red-300)}.home-wrapper{display:flex;flex-wrap:wrap;align-items:center;justify-content:center;flex-direction:column}.home-hero{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-evenly;flex-direction:column;height:95vh;width:100%;background-color:var(--red-50);padding-top:200px;border-bottom:1px solid var(--red-200)}.home-hero-wrapper{display:flex;flex-wrap:wrap;align-items:center;justify-content:center;width:100%}.home-hero-content{display:flex;flex-wrap:wrap;justify-content:center;flex-direction:column;gap:20px}.home-hero-content h1{font-size:60px;font-weight:900;width:60%}.gradient-text{color:var(--primary)}.home-hero-content p{font-size:20px;width:50ch}.home-hero-btns{display:flex;flex-wrap:wrap;align-items:center;gap:20px}.video-btn{display:flex;align-items:center;gap:10px;padding:12px 32px;font-size:16px;font-weight:600;color:var(--primary);background-color:#fff;border:1px solid var(--red-300);border-radius:12px}.video-btn:hover{border:1px solid var(--red-500);background-color:var(--red-50)}.scrollToExplore{display:flex;flex-wrap:wrap;align-items:center;justify-content:center;flex-direction:column;gap:10px;animation:scroll-float 1s ease-in-out infinite;position:relative;bottom:-80px}.scrollToExplore p{font-size:14px}.steps{display:flex;flex-wrap:wrap;align-items:center;justify-content:center;flex-direction:column;padding:50px;gap:0px}.steps h1:first-child{font-size:50px;font-weight:900}.step-gradient{color:var(--primary)}.steps p{color:var(--text-secondary);font-size:18px}.steps-cards{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-evenly;padding-top:100px;gap:50px}.steps-card{display:flex;flex-wrap:wrap;align-items:flex-start;justify-content:center;flex-direction:column;gap:15px;padding:40px 20px;border-radius:12px;background-color:var(--red-50);border:1px solid var(--red-200);transition:all .3s ease-in-out}.steps-card:hover{transform:translateY(-2px);box-shadow:0 2px 10px #ff80806e;border:1px solid var(--primary)}.steps-card:hover .step-heading{color:var(--primary)}.step-icon{border:2px solid transparent;transition:all .3s ease-in-out}.steps-card:hover .step-icon{border:2px solid var(--primary)}.step-number{width:3rem;height:3rem;border-radius:50%;background-color:var(--primary);color:#fff;font-size:20px;display:grid;place-items:center}.step-icon{padding:15px;background-color:#fff;border-radius:12px;box-shadow:0 0 10px #0000001a}.step-heading{font-size:24px}.steps-card p{max-width:40ch;font-size:16px;color:var(--text-secondary)}.home-gradient-round-blur{position:absolute;top:100px;left:100px;width:18rem;height:18rem;background-color:var(--red-200);border-radius:50%;filter:blur(64px);animation:pulse 3s ease-in-out infinite}.canvas-gradient-round-blur{position:absolute;top:650px;right:80px;width:18rem;height:18rem;background-color:var(--red-200);border-radius:50%;filter:blur(64px);animation:pulse 3s ease-in-out infinite}.demo-modal{display:flex;flex-wrap:wrap;align-items:center;justify-content:center;position:fixed;z-index:20;background-color:#fff0;-webkit-backdrop-filter:blur(5px);backdrop-filter:blur(5px);background-color:#0006;height:100%;width:100%}.demo-frame{border:none;border-radius:15px;box-shadow:0 0 10px #0000001a;width:100%;max-width:1200px;aspect-ratio:16 / 9}.demo-close{display:flex;flex-wrap:wrap;align-items:center;justify-content:center;gap:10px;position:absolute;top:150px;right:360px;padding:10px 30px;background-color:var(--primary);color:#fff;border-radius:12px;box-shadow:var(--btn-shadow-normal);transition:all .2s ease-in-out}.demo-close:hover{background-color:var(--primary-hover)}@keyframes pulse{0%,to{opacity:.6}50%{opacity:1}}@keyframes scroll-float{0%,to{transform:translateY(0)}50%{transform:translateY(-5px)}}@media screen and (max-width:1370px){.home-gradient-round-blur,.scrollToExplore{display:none}}@media screen and (max-width:1319px){.home-hero-content{align-items:center}.canvas-wrapper{margin-top:50px}}@media screen and (max-width:1024px){.home-hero-content h1{font-size:48px;width:80%}.home-hero-content p{width:60ch}.starter-card{padding:50px;border-radius:24px}.starter-card h1{font-size:30px;text-align:center}.starter-card p{font-size:16px;text-align:center}.home-gradient-round-blur,.scrollToExplore{display:none}.demo-frame{max-width:95vw}}@media screen and (max-width:768px){.home-hero{height:auto;padding-top:120px;padding-bottom:80px}.home-hero-content h1{font-size:36px;width:100%;text-align:center}.home-hero-content p{width:100%;font-size:16px;text-align:center}.home-hero-btns{justify-content:center}.steps{padding:30px 20px}.steps h1:first-child{font-size:36px;text-align:center}.steps p{text-align:center;font-size:16px}.steps-cards{padding-top:50px;gap:30px}.steps-card{width:100%}.home-gradient-round-blur,.canvas-gradient-round-blur{display:none}}@media screen and (max-width:600px){.demo-frame{aspect-ratio:16 / 9;border-radius:10px}.demo-close{top:15px;right:15px;padding:6px 16px;font-size:12px}.demo-close{display:none}}@media screen and (max-width:480px){.home-hero-content h1{font-size:28px}.get-started-btn,.video-btn{width:70%;justify-content:center}.steps-card p{text-align:left;max-width:100%}}.canvas-wrapper{display:flex;align-items:center;justify-content:center;padding:20px;position:relative;max-width:550px;width:100%;z-index:5}.ui-builder-container{position:relative;width:100%;max-width:500px}.main-window{width:100%;aspect-ratio:4 / 3;position:relative;border-radius:calc(1.25rem - 3px);overflow:hidden;background:linear-gradient(135deg,#0f172a,#1e293b,#0f172a);display:flex;flex-wrap:wrap;flex-direction:column;border:2px solid var(--primary)}.window-header{display:flex;flex-wrap:wrap;align-items:center;gap:60px;padding:10px 14px;background:#1e293be6;border-bottom:1px solid #334155;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}.window-controls{display:flex;align-items:center;gap:6px}.control-dot{width:12px;height:12px;border-radius:50%;transition:all .2s ease-in-out;cursor:pointer}.control-dot:hover{transform:scale(1.2)}.control-dot.red{background:var(--primary)}.control-dot.yellow{background:#eab308}.control-dot.green{background:#22c55e}.url-bar{display:flex;flex-wrap:wrap;gap:6px;padding:5px 12px;border-radius:6px;background:#33415599;color:#94a3b8;font-size:12px;border:1px solid rgba(71,85,105,.5)}.url-bar .material-symbols-outlined{font-size:14px}.content-area{flex:1;display:flex;overflow:hidden}.left-sidebar{width:50px;background:#0f172acc;border-right:1px solid #334155;display:flex;flex-wrap:wrap;flex-direction:column;align-items:center;padding:12px 0;gap:8px}.sidebar-icon{width:34px;height:34px;border-radius:10px;display:flex;align-items:center;justify-content:center;cursor:pointer;transition:all .3s ease-in-out}.sidebar-icon.active{background:linear-gradient(135deg,var(--primary),var(--red-500));color:#fff}.sidebar-icon.active:hover{transform:scale(1.05)}.sidebar-icon:not(.active){background:#33415566;color:#64748b}.sidebar-icon:not(.active):hover{background:#334155cc;color:#94a3b8;transform:scale(1.05)}.sidebar-icon .material-symbols-outlined{font-size:18px}.sidebar-icon.settings{margin-top:auto}.canvas-area{flex:1;padding:12px;position:relative;display:flex;flex-wrap:wrap;align-items:center;justify-content:center}.glass-card{position:relative;z-index:10;background:#fffffff7;-webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px);border-radius:14px;padding:34px 14px;box-shadow:0 20px 40px #0000004d,0 0 0 1px #ffffff1a;animation:float 4s ease-in-out infinite;width:100%;max-width:300px}.card-header{display:flex;align-items:center;justify-content:space-between;margin-bottom:12px}.card-header-left{display:flex;align-items:center;gap:10px}.avatar{width:36px;height:36px;border-radius:50%;background:linear-gradient(135deg,var(--primary),var(--red-500));display:flex;align-items:center;justify-content:center;color:#fff;font-weight:700;font-size:13px;box-shadow:0 4px 12px #dc26264d}.card-title{font-weight:600;color:#1f2937;font-size:13px}.card-subtitle{font-size:10px;color:#6b7280}.card-header .material-symbols-outlined{color:#9ca3af;font-size:18px;cursor:pointer;transition:color .2s}.mini-chart{display:flex;align-items:flex-end;gap:3px;height:50px;margin-bottom:12px;padding:8px;background:#f8fafc;border-radius:8px}.chart-bar{flex:1;border-radius:3px 3px 0 0;transition:all .3s ease-in-out}.chart-bar:nth-child(1){height:40%;background:linear-gradient(to top,var(--red-50),var(--red-400))}.chart-bar:nth-child(2){height:65%;background:linear-gradient(to top,var(--red-200),var(--red-500))}.chart-bar:nth-child(3){height:45%;background:linear-gradient(to top,var(--red-400),#ef4444)}.chart-bar:nth-child(4){height:80%;background:linear-gradient(to top,var(--red-500),#dc2626)}.chart-bar:nth-child(5){height:100%;background:linear-gradient(to top,#dc2626,#b91c1c)}.chart-bar:nth-child(6){height:70%;background:linear-gradient(to top,var(--red-500),#dc2626)}.chart-bar:nth-child(7){height:55%;background:linear-gradient(to top,var(--red-300),#ef4444)}.stats-row{display:grid;grid-template-columns:repeat(3,1fr);gap:6px}.stat-item{border-radius:8px;padding:8px 6px;text-align:center;transition:all .2s ease-in-out}.stat-item:hover{transform:translateY(-2px)}.stat-item.red{background:linear-gradient(135deg,#fef2f2,#fee2e2)}.stat-item.green{background:linear-gradient(135deg,#f0fdf4,#dcfce7)}.stat-item.blue{background:linear-gradient(135deg,#eff6ff,#dbeafe)}.stat-value{font-weight:700;font-size:13px}.stat-item.red .stat-value{color:var(--red-500)}.stat-item.green .stat-value{color:#16a34a}.stat-item.blue .stat-value{color:#2563eb}.stat-label{font-size:10px;color:#6b7280;margin-top:2px}.home-right-panel{width:140px;background:#0f172acc;border-left:1px solid #334155;padding:10px}.panel-title{font-size:10px;color:#94a3b8;font-weight:700;margin-bottom:10px;letter-spacing:.5px}.property-group{margin-bottom:10px}.property-label{font-size:10px;color:#64748b;margin-bottom:4px}.color-options{display:flex;flex-wrap:wrap;gap:6px}.color-swatch{width:18px;height:18px;border-radius:4px;cursor:pointer;transition:all .2s}.color-swatch:hover{transform:scale(1.1)}.color-swatch.active{border:1px solid white}.color-swatch.red{background-color:var(--primary)}.color-swatch.blue{background-color:#0051ff}.color-swatch.green{background-color:#0f0}.color-swatch.purple{background-color:#ff0}.slider-track{height:5px;background:#334155;border-radius:999px}.slider-fill{height:100%;background:linear-gradient(90deg,var(--primary),var(--red-500));border-radius:9999px;transition:all .3s ease-in-out}.slider-fill.w-75{width:75%}.slider-fill.w-50{width:50%}.slider-fill.w-100{width:100%}.bottom-bar{display:flex;align-items:center;justify-content:end;padding:10px 12px;background:#0f172ae6;border-top:1px solid #334155}.action-buttons{display:flex;align-items:center;gap:6px}.btn{padding:6px 12px;border-radius:6px;font-size:12px;font-weight:500;cursor:pointer;border:none;transition:all .2s;display:flex;align-items:center;gap:4px}.btn-secondary{background:#334155;color:#cbd5e1;border:1px solid #475569}.btn .material-symbols-outlined{font-size:14px}.floating-notification{position:absolute;top:-20px;right:-20px;background:#fff;border-radius:14px;padding:10px 14px;box-shadow:0 20px 40px #00000026,0 0 0 1px #0000000d;border:1px solid #fee2e2;animation:float-delayed 3s ease-in-out infinite;z-index:20}.notification-content{display:flex;align-items:center;gap:10px}.notification-icon{width:36px;height:36px;border-radius:50%;background:linear-gradient(135deg,#dcfce7,#bbf7d0);display:flex;align-items:center;justify-content:center}.notification-icon .material-symbols-outlined{color:#16a34a;font-size:20px}.notification-title{font-weight:600;font-size:12px;color:#1f2937}.notification-subtitle{font-size:10px;color:#6b7280}.ring-container{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:115%;aspect-ratio:1;pointer-events:none}.ring{position:absolute;inset:0;border-radius:50%;border:2px dashed rgba(239,68,68,.2);animation:rotate-slow 25s linear infinite}.ring.inner{inset:40px;border:2px dashed rgba(239,68,68,.2);animation-direction:reverse;animation-duration:35s}@keyframes float{0%,to{transform:translateY(0)}50%{transform:translateY(-4px)}}@keyframes float-delayed{0%,to{transform:translateY(0) rotate(-1deg)}50%{transform:translateY(-5px) rotate(1deg)}}@keyframes rotate-slow{0%{transform:rotate(0)}to{transform:rotate(360deg)}}@media screen and (max-width:1552px){.ring-container{display:none}}@media screen and (max-width:1024px){.ring-container{display:none}.canvas-wrapper{margin-top:40px}}@media screen and (max-width:992px){.ui-builder-container{max-width:420px}.left-sidebar,.home-right-panel,.ring-container,.floating-notification{display:none}}@media screen and (max-width:768px){.ui-builder-container{max-width:100%}.url-bar{display:none}}.footer-wrapper{display:flex;flex-wrap:wrap;align-items:center;justify-content:flex-start;flex-direction:column;padding:50px 100px;width:100%;gap:50px}.footer-content{display:flex;flex-wrap:wrap;align-items:start;justify-content:space-around;gap:60px;width:100%}.footer-info{display:flex;flex-wrap:wrap;align-items:flex-start;justify-content:center;flex-direction:column;gap:20px}.footer-info>div{display:flex;flex-wrap:wrap;align-items:center;justify-content:center;gap:20px}.footer-info p{width:40ch}.footer-icon{padding:10px;background-color:var(--red-100);border-radius:50%;transition:all .3s ease-in-out;cursor:pointer}.footer-icon:hover{stroke-width:2px;transform:scale(1.05)}.footer-product{display:flex;flex-wrap:wrap;align-items:flex-start;justify-content:center;flex-direction:column;gap:20px}.footer-line{background-color:var(--red-100);width:80%;height:2px}.footer-copyright p{color:var(--text-muted)}@media screen and (max-width:1024px){.footer-wrapper{padding:50px}.footer-content{gap:40px}.footer-info p{width:30ch}}@media screen and (max-width:768px){.footer-wrapper{padding:40px 20px;gap:40px}.footer-content{flex-direction:column;align-items:center;gap:40px}.footer-info{align-items:center;text-align:center}.footer-info p{width:100%}.footer-info>div{justify-content:center}.footer-product,.footer-legal{align-items:center;text-align:center}.footer-line{width:100%}.footer-copyright p{text-align:center;font-size:14px}}@media screen and (max-width:480px){.footer-wrapper{padding:30px 15px}.footer-content{gap:30px}.footer-info>div{gap:15px}}.sirpam-logo{height:40px}.navbar{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-evenly;padding:15px 30px;background:var(--bg-glass);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);letter-spacing:.3px;position:sticky;top:0;border-bottom:1px solid var(--red-200);z-index:1000}.nav-logo{display:flex;flex-wrap:wrap;align-items:center;gap:10px}.nav-flex{display:flex;flex-wrap:wrap;align-items:center;gap:20px;position:relative}li{list-style:none}a{color:#000;text-decoration:none}.sirpam-logo{transition:all .3s ease-in-out}.sirpam-logo:hover{transform:scale(1.08) rotate(5deg)}.nav-heading{font-size:22px;color:var(--primary);font-weight:700}.navbar-navigations{display:flex;flex-wrap:wrap;align-items:center;justify-content:center;gap:30px;font-size:14px}.nav-btns{display:inline-block}.nav-btns:after{content:"";width:0px;height:2.2px;display:block;background:#000;transition:.5s;border-radius:12px;margin-top:2px}.nav-btns:hover:after{width:100%}.nav-btn{padding:10px 20px;font-size:14px;border-radius:8px;font-weight:700}.nav-btn-primary{background-color:var(--red-100);color:var(--primary)}.nav-btn-primary:hover{background-color:var(--red-200)}.nav-btn-primary:active{background-color:var(--red-300)}.mobile-menu{position:absolute;top:70px;left:0;width:100%;background:#fff;border-top:1px solid var(--red-200);display:flex;flex-direction:column;gap:20px;padding:30px 20px;z-index:1000}.mobile-menu a{font-size:16px;font-weight:600}.mobile-actions{display:flex;flex-direction:column;gap:15px;margin-top:10px}.hamburger{display:none}.nav-btn-profile{display:flex;flex-wrap:wrap;align-items:center;justify-content:center;gap:10px;color:var(--primary);font-size:16px;background:var(--red-100);padding:8px 20px;border-radius:8px;letter-spacing:.3px}#nav-dropdown{position:absolute;top:50px;right:0;z-index:20;animation:dropdownFade .2s ease-out forwards}#nav-dropdown-wrapper{display:flex;flex-wrap:wrap;align-items:center;justify-content:center;flex-direction:column;background-color:var(--red-100);gap:10px;padding:40px 30px;border-radius:12px;position:relative}#nav-dropdown button{display:flex;align-items:center;justify-content:center;gap:10px;padding:10px 30px;background:transparent;background-color:var(--primary);color:var(--red-100);border-radius:8px}#nav-dropdown-close{position:absolute;top:10px;right:10px}@keyframes dropdownFade{0%{opacity:0;transform:translateY(-8px)}to{opacity:1;transform:translateY(0)}}a.active:not(.nav-heading):not(.nav-btn){color:var(--primary);font-weight:700;text-decoration:underline;text-decoration-color:var(--primary);text-underline-offset:6px;text-decoration-thickness:2px}@media screen and (max-width:768px){.navbar{justify-content:space-between;padding:15px 20px}.desktop-navbar{display:none}.hamburger{display:block;cursor:pointer;z-index:1001}}.error-container{display:flex;flex-wrap:wrap;align-items:center;justify-content:center;flex-direction:column;margin-top:250px;position:relative}.error-card{background:var(--bg-card);border:1px solid var(--border-light);border-radius:16px;padding:3rem 2.5rem;text-align:center;max-width:420px;width:100%;box-shadow:0 20px 30px #dc262626}.code-container{display:flex;flex-wrap:wrap;align-items:center;justify-content:center;gap:10px}.error-four{animation:bounce 2s ease-in-out infinite}.error-zero{animation:wiggle 2s ease-in-out infinite}.error-code{font-size:5rem;font-weight:800;color:var(--primary);margin-bottom:.5rem}.error-title{font-size:1.5rem;font-weight:600;color:var(--text-main);margin-bottom:.75rem}.warning-float,.error-float{position:absolute;font-size:20px;padding:12px;border-radius:12px;border:4px solid var(--primary);box-shadow:var(--btn-shadow-hover);background-color:var(--red-50);z-index:10;animation:float-bounce 5s ease-in-out infinite}@keyframes bounce{0%,20%,50%,80%,to{transform:translateY(0)}40%{transform:translateY(-15px)}60%{transform:translateY(-7px)}}@keyframes float-bounce{0%,20%,50%,80%,to{transform:translateY(0)}40%{transform:translateY(-5px)}60%{transform:translateY(-5px)}}@keyframes wiggle{0%,to{transform:rotate(-10deg)}50%{transform:rotate(10deg)}}@media screen and (max-width:1440px){.warning-float,.error-float{display:none}}.login-container{height:93vh;width:100%;padding:8% 38% 10%;box-sizing:border-box;background-color:var(--bg-soft);display:flex;flex-wrap:wrap;align-items:center;justify-content:center;flex-direction:column}.main-container{width:100%;max-width:480px;margin:auto}.bottom-content{width:100%;background-color:var(--bg-main);padding:50px 30px;border-radius:25px;box-shadow:#959da533 0 8px 24px}.welcome-text{text-align:center;margin-bottom:30px}.welcome-text h5{color:gray;font-weight:600;margin-top:8px}.usermail-container{display:flex;flex-wrap:wrap;flex-direction:column;margin-bottom:5%}.usermail-container label{margin-bottom:8px}.usermail-container input{background-color:var(--bg-main);padding:10px 20px;font-size:16px;color:gray;color:var(--text-main);font-weight:600;border-radius:15px;border:2px solid var(--red-200)}.usermail-container input:focus{color:gray;outline:none}.usermail-container input::placeholder{font-weight:400}.password-container{display:flex;flex-direction:column;margin-bottom:5%}.password-container .label-flex a{font-size:small;font-weight:700;color:var(--red-500);cursor:pointer}.password-container .label-flex{display:flex;align-items:center;justify-content:space-between;margin-bottom:2%}.password-container input{background-color:var(--bg-main);font-size:16px;padding:10px 20px;color:gray;width:80%;font-weight:600;border-radius:15px;border:none}.password-container input:focus{border:none;outline:none}.password-container input::placeholder{font-weight:400}.input-div{padding-right:15px;width:100%;border:2px solid var(--red-200);border-radius:15px;display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;color:#000}.input-div:focus{outline:2px solid var(--red-500)}.input-div button{color:#000;opacity:.8}.btn-login{color:#fff;margin-bottom:5%}.option{width:100%;display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;text-transform:uppercase;gap:2px;margin-bottom:7%}.option .red-line{border:1px solid var(--red-100);width:42%}.option span{font-size:12px;color:gray;opacity:.9}.login-container p{text-align:center;font-size:medium;color:gray;font-weight:400}.login-container p a{font-size:medium;font-weight:700;color:var(--red-500);cursor:pointer}.google-btn{text-align:center;display:flex;align-items:center;justify-content:center;gap:2%}.google-btn img{width:10%;margin-right:2px}.eye-button{color:gray;font-size:0px;opacity:.5;background:transparent}.eye-button svg{width:20px;height:20px}@media(max-width:1024px){.login-container{padding:10% 15%}.top-content img{height:50%}.bottom-content{padding:10%}}@media(max-width:768px){.login-container{height:auto;min-height:100vh;padding:12% 15%}.top-content{height:auto;margin-bottom:8%}.top-content img{width:10%}.bottom-content{height:auto;padding:10%;border-radius:20px}.login-container p{margin-top:5%}}@media(max-width:480px){.login-container{width:100vw;padding:8% 1%}.top-content h1{font-size:16px}.top-content img{height:10%}.bottom-content{padding:8%;border-radius:16px}.welcome-text h2{font-size:18px}.welcome-text h5{font-size:13px}.usermail-container input,.password-container input{font-size:16px;padding:4%}.check-box span{font-size:13px}.login-container p,.login-container p a{font-size:14px}}@media(max-width:320px){.login-container{padding:6% 4%;min-height:100dvh}.top-content{gap:6px;margin-bottom:10%}.top-content img{height:32px}.top-content h1{font-size:14px}.bottom-content{padding:6%;border-radius:12px}.welcome-text h2{font-size:16px}.welcome-text h5{font-size:12px}.usermail-container input,.password-container input{font-size:14px;padding:6%}.password-container .label-flex a,.check-box span,.option span,.login-container p,.login-container p a{font-size:12px}}@media(min-width:1280px)and (max-width:1728px){.login-container{padding:6% 28%;height:100vh}.main-container{max-width:520px;margin:auto}.bottom-content{padding:6%}.top-content img{height:40px}}@media(min-width:1024px)and (max-width:1280px){.login-container{padding:6% 18%}}.signup-page{min-height:calc(100vh - 80px);display:flex;align-items:center;justify-content:center;background:var(--bg-soft)}.signup-card{width:450px;padding:36px;background:var(--bg-card);border-radius:20px;box-shadow:0 25px 50px #00000014}.signup-title{text-align:center;font-size:22px;font-weight:600;color:var(--text-main)}.signup-subtitle{text-align:center;margin-top:6px;font-size:14px;color:var(--text-muted)}.signup-form{margin-top:28px;display:flex;flex-direction:column;gap:12px}.input-label{font-size:15px;font-weight:500;color:var(--text-secondary)}.signup-input{width:100%;border-radius:10px;border:1px solid var(--red-300);font-size:14px;position:relative;padding:11px 12px 11px 44px}.signup-input:focus{outline:none;border-color:var(--primary)}.password-hint{font-size:13px;color:var(--text-muted)}.terms-container{display:flex;align-items:center;gap:8px;font-size:14px}.signup-btn{margin-top:14px;padding:12px;border-radius:10px}.divider{margin:18px 0;text-align:center;font-size:12px;color:var(--text-muted)}.google-btn{border:1px solid var(--red-300);padding:11px;border-radius:10px;background:#fff;font-size:16px;color:#000;cursor:pointer;text-align:center}.google-btn img{width:7%;margin-right:5px}.input-wrapper{position:relative}.or-divider{display:flex;align-items:center;text-align:center;margin:24px 0;color:var(--text-muted);font-size:12px}.or-divider:before,.or-divider:after{content:"";flex:1;border-bottom:1px solid var(--border-light)}.or-divider span{padding:0 12px;font-weight:500}.eye-icon{position:absolute;right:12px;top:50%;transform:translateY(-50%);cursor:pointer;color:#888}.icon{position:absolute;left:12px;top:50%;transform:translateY(-50%);cursor:pointer;color:#888}.login-text{margin-top:14px;text-align:center;font-size:15px;color:var(--text-muted)}Button{font-size:15px;font-weight:600}.link-text{color:var(--primary);font-weight:500;cursor:pointer}@media(max-width:480px){.signup-page{padding:16px}.signup-card{width:100%;padding:24px;border-radius:16px}.signup-title{font-size:20px}.signup-subtitle{font-size:13px}.signup-input,.google-btn,.signup-btn{font-size:14px}.terms-container{font-size:12px}}@media(min-width:481px)and (max-width:768px){.signup-page{padding:20px}.signup-card{width:100%;max-width:420px}}@media(min-width:769px)and (max-width:1024px){.signup-card{width:440px}}@media(min-width:1025px){.signup-card{width:450px}}.left-panel{position:relative;height:93vh;background:#fff;border-right:1px solid #e5e7eb;display:flex;flex-direction:column;padding:0;flex-shrink:0}.left-panel-scroll{flex:1;min-height:0;padding:16px 20px 16px 16px}.panel-tabs{display:flex;border-bottom:1px solid #eee}.tab{flex:1;padding:10px;border:none;background:none;font-weight:600;color:#9ca3af;cursor:pointer}.tab.active{color:#ef4444;border-bottom:2px solid #ef4444}.panel-title{margin:16px 0 8px}.search-row{display:flex;align-items:center;gap:8px;margin-bottom:12px}.search-row .search-box{flex:1}.add-near-search-btn{background:#ef4444;color:#fff;margin-bottom:8px;width:36px;height:36px;border-radius:8px;border:none;cursor:pointer;display:flex;align-items:center;justify-content:center;flex-shrink:0}.add-near-search-btn:hover{background:#d32f2f}.search-box{display:flex;align-items:center;gap:8px;padding:10px;border:1px solid #e5e7eb;border-radius:8px;color:#9ca3af}.search-box input{border:none;outline:none;width:100%}.section-heading{margin:16px 0 8px;font-size:11px;letter-spacing:1px;color:#9ca3af;font-weight:700}.grid{display:grid;grid-template-columns:repeat(2,1fr);gap:10px}.grid-item{border:1px solid #e5e7eb;border-radius:10px;padding:14px;text-align:center}.grid-item span{display:block;margin-top:6px;font-size:13px}.icon-box{padding:10px;border-radius:8px;background:#f3f4f6}.resize-handle{position:absolute;top:0;right:0;width:5px;height:100%;cursor:col-resize;z-index:50;touch-action:none;-webkit-user-select:none;user-select:none}.resize-handle:hover{background:#ef4444;border-right:5px solid #ef4444}.add-json-component-btn{width:100%;margin:14px 0;padding:10px 12px;background:#fff;color:var(--primary);border:2px dashed var(--primary);border-radius:10px;font-size:13px;font-weight:500;display:flex;align-items:center;justify-content:center;gap:8px;cursor:pointer;transition:all .2s ease}.add-json-component-btn:hover{background:#ffecec;border-color:#d32f2f;color:#d32f2f}.json-ai{display:flex;flex-wrap:wrap;align-items:center;justify-content:center;gap:10px;padding:10px 15px;width:100%;border-radius:12px;background-color:var(--primary);color:#fff;margin:14px 0;border:2px solid transparent;transition:all .3s ease-in-out}.json-ai:hover{background-color:#fff;color:var(--primary);border:2px dashed var(--primary)}.json-component-modal{position:fixed;inset:0;z-index:9999;background:#00000059;-webkit-backdrop-filter:blur(2px);backdrop-filter:blur(2px);display:flex;align-items:center;justify-content:center}.json-modal-box{width:520px;max-width:92%;background:#fff;border-radius:14px;padding:18px 20px;display:flex;flex-direction:column;box-shadow:0 25px 45px #00000040}.modal-header h4{margin:0;font-size:15px;font-weight:600;color:#e53935}.modal-cancel-btn{cursor:pointer;color:#9e9e9e}.modal-cancel-btn:hover{color:#e53935}.json-textarea{margin-top:12px;height:220px;padding:10px;font-size:13px;border-radius:10px;border:1px solid #e0e0e0;resize:none}.json-textarea:focus{outline:none;border-color:#e53935}.json-save-btn{margin-top:14px;padding:10px;width:100%;background:#e53935;color:#fff;border:none;border-radius:10px;font-size:14px;font-weight:600;cursor:pointer}.json-save-btn:hover{background:#d32f2f}.section-header{display:flex;align-items:center;gap:8px;cursor:pointer;padding:8px 6px;font-size:13px;font-weight:500;color:var(--text-secondary);-webkit-user-select:none;user-select:none}.section-header:hover{background:#0000000a;border-radius:6px}.chevron{transition:transform .2s ease}.chevron.open{transform:rotate(90deg)}.layers-container{padding:8px}.layer-item{display:flex;align-items:center;gap:6px;height:30px;cursor:pointer;border-radius:6px;padding-right:8px}.layer-item.selected{background:#ffe5e5;color:#d11a2a}.layer-label{flex:1;font-size:13px}.layer-eye{opacity:.6}.layer-drag{cursor:grab;font-size:14px;opacity:.5}.layer-selected{background:#007bff26;border-left:3px solid var(--primary)}.layer-item{position:relative}.layer-delete{opacity:0;transition:opacity .2s ease}.layer-item:hover .layer-delete{opacity:1;color:var(--primary)}.layer-item.selected .layer-delete{opacity:1}.context-menu{width:180px;background:#fff;border:3px solid #FEF2F2;border-radius:8px;box-shadow:0 8px 20px #00000014;padding:6px 0;font-size:14px}.menu-items{display:flex;align-items:center;gap:10px;padding:8px 14px;cursor:pointer;color:#374151}.menu-items:hover{background:#edeeee;border-radius:5px}.menu-divider{height:1px;background:#e5e7eb;margin:6px 0}.menu-items.delete{color:#dc2626}.menu-items.delete:hover{background:#fee2e2;border-radius:5px}.work-canvas-wrapper{display:flex;flex-wrap:wrap;align-items:center;justify-content:center;background-color:#f3f4f6;background-image:linear-gradient(to right,#ececec 1px,transparent 1px),linear-gradient(to bottom,#ececec 1px,transparent 1px);background-size:20px 20px;width:65%;padding:50px;overflow:scroll;position:relative}.canvas-drop-zone{background-color:#fff;border-radius:12px;min-height:100%;box-shadow:0 0 20px #0000001a}.test-component{transition:all .1s ease}.test-component:hover{outline:3px dashed var(--red-300);outline-offset:2px}.component-drag{position:absolute;top:5px;right:10px;cursor:move}.component-drag:active{cursor:grabbing}.right-panel{height:100%;width:19%;background-color:#fff;border:none;display:flex;flex-direction:column}.right-side-main-bar{width:100%;height:100%;overflow-y:scroll;color:#fff;display:flex;flex-direction:column}.empty{display:flex;flex-wrap:wrap;align-items:center;justify-content:center;flex-direction:column;width:19%}.error-text{color:#000;text-align:center}::-webkit-scrollbar{display:none}.button-flex{display:flex;background-color:#ffffff3d;-webkit-backdrop-filter:blur(5px);backdrop-filter:blur(5px);position:fixed;justify-content:center;align-items:center;width:19%;overflow-x:scroll;gap:40px;border-bottom:1px solid var(--red-300)}.button-flex button{flex:1;padding:12px;font-weight:600;font-size:12px;color:gray;border:none;background:none;cursor:pointer}.button-flex .active{color:var(--primary);border-bottom:3px solid var(--primary)}.right-side-content{width:100%;height:100%}.properties-content{width:100%;overflow-y:scroll;padding:4%;margin-top:9%}.properties-toggle{display:flex;align-items:center;justify-content:space-between;width:98%;margin-bottom:7%;padding:4% 0 1%;background-color:#fff}.properties-toggle span{color:#000}.properties-toggle div{display:flex;gap:5px;align-items:center}.toggle-button{transition:transform .2s ease}.toggle-button.open{transform:rotate(180deg)}.properties-section{margin-bottom:12px}.properties-toggle .title{color:#000}.properties-toggle .btn-icon{color:var(--primary)}#btn-icon{font-size:10px;color:var(--primary)}.toggle-button{width:10px;color:#000}.properties-general{display:flex;flex-direction:column;flex-wrap:wrap;margin-bottom:6%}.properties-general div label{display:block;margin-bottom:3%;font-size:10px;color:gray;font-weight:500;text-transform:uppercase}.properties-general div input{padding:2%;width:100%;font-size:12px;border-radius:5px;border:1px solid #e5e7eb;background-color:#f9fafb;margin-bottom:5%}.properties-general div select{padding:3%;color:gray;background-color:#f9fafb;border-radius:5px;border:1px solid #e5e7eb;width:100%}#checkbox-row{display:flex;align-items:center;gap:8px;margin-bottom:6px}#property-check{width:16px;height:16px;cursor:pointer}.properties-event div select{padding:3%;color:gray;background-color:#f9fafb;border-radius:5px;border:1px solid #e5e7eb;width:100%}.event-form label{display:block;margin-bottom:3px;font-size:10px;color:gray;font-weight:500;text-transform:uppercase}.checkbox-group{display:flex;gap:30px;align-items:center;flex-wrap:wrap}.checkbox-row{display:flex;align-items:center;gap:20px}.event-form input{padding:2%;width:100%;font-size:12px;border-radius:5px;border:1px solid #e5e7eb;background-color:#f9fafb;margin-bottom:4%}.event-form select{padding:2%;color:gray;background-color:#f9fafb;border-radius:5px;border:1px solid #e5e7eb;width:100%;margin-bottom:4%}.double-input{display:flex;width:100%;align-items:center;justify-content:space-between}.double-input label{color:gray}.display-input{width:100%}.display-input select{border-radius:5px;width:100%;padding:2%;margin-top:4%;background-color:#f9fafb;border:1px solid #e5e7eb;outline:none}.display-input label{font-size:10px;text-transform:uppercase;font-weight:700;margin-bottom:100%;color:gray}.input-child{width:48%}.input-child select{border-radius:5px;width:100%;padding:2%;margin-top:4%;background-color:#f9fafb;border:1px solid #e5e7eb;outline:none}.input-child label{font-size:10px;text-transform:uppercase;font-weight:700}.input-child input{border-radius:5px;width:100%;padding:2%;margin-top:4%;background-color:#f9fafb;border:1px solid #e5e7eb;outline:none}.custom-css div textarea{border-radius:5px;width:100%;padding:2%;margin-top:4%;background-color:#f9fafb;border:1px solid #e5e7eb;outline:none;resize:vertical;max-width:100%}.custom-css div label{display:block;margin-bottom:3px;font-size:10px;color:gray;font-weight:500;text-transform:uppercase}.cm-editor{font-family:Fira Code,monospace!important;font-size:14px!important}.cm-content{letter-spacing:.3px!important}.long-input{width:100%;color:gray;margin-top:5%;margin-bottom:5%}.long-input input{padding:1%;width:65%;background-color:#f9fafb;border:1px solid #e5e7eb;border-radius:5px;margin-bottom:3%;outline:none}.long-input label{font-size:10px;text-transform:uppercase;font-weight:700;display:block}.long-input div{margin-top:2%;display:flex;align-items:center;justify-content:space-between;gap:2%}.long-input select{padding:1%;width:33%;background-color:#f9fafb;border:1px solid #e5e7eb;border-radius:5px;margin-bottom:3%;outline:none}.long-input .grid-input,.four-button{width:100%}.btn-box{width:100%;display:flex;gap:6px;padding:2%;background-color:#f3f4f6;border-radius:10px;margin-bottom:5%}.btn-box button{flex:1;height:32px;border-radius:8px;border:none;background:transparent;color:gray;font-size:14px;cursor:pointer;transition:all .2s ease}.btn-box button.active{background-color:#fff;color:#dc2626;box-shadow:0 1px solid 3px #0000001f}.btn-box button:hover{background-color:#ffffffb3}.slider-input{width:100%;margin-bottom:5%}.slider-input label{display:block;color:gray;margin-bottom:1%}.slider-input{width:100%;margin-top:5%}.slider-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:6px}.slider-header label{font-size:11px;font-weight:600;color:gray;text-transform:uppercase}.slider-value{font-size:12px;color:gray}.slider-main input[type=range]{width:88%;-webkit-appearance:none;appearance:none;height:2px;background:#e5e7eb;border-radius:2px;outline:none;margin-right:2%}.four-side{width:100%;margin-top:4%;margin-bottom:8%}.four-side-title{font-size:11px;font-weight:600;color:gray;text-transform:uppercase;display:block;margin-bottom:6px}.four-side-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:6px}.four-side-grid div{display:flex;flex-direction:column;align-items:center}.four-side-grid span{font-size:10px;color:gray;margin-bottom:4px}.four-side-grid input{width:100%;height:32px;border:1px solid #e5e7eb;border-radius:6px;text-align:center;font-size:12px;background-color:#f9fafb}.four-side-grid input[type=number]{text-align:center}.background-content{width:100%;margin-bottom:7%}.background-content label{font-size:10px;text-transform:uppercase;font-weight:700;display:block;color:gray;margin-bottom:3%}.color-pallette{width:100%;display:flex;align-items:center;gap:8px;margin-bottom:4%}.color-pallette input[type=color]{width:36px;height:36px;padding:0;border:none;cursor:pointer;background-color:#f9fafb;border-radius:5px}.warn-msg{width:100%;height:100%;color:#000;display:flex;text-align:center;align-items:center;justify-content:center;margin-top:400px}.property-select{margin-bottom:10%}.color-box{flex:1}.color-input{width:100%;height:36px;padding:6px 8px;border:1px solid #e5e7eb;border-radius:6px;font-size:14px;letter-spacing:1px solid}.background-image label{font-size:10px;text-transform:uppercase;font-weight:700;display:block;color:gray;margin-bottom:3%}.image-input{width:100%;display:flex;flex-wrap:wrap;align-items:center;gap:10px}.image-input input{border-radius:5px;border:1px solid #e5e7eb;background-color:#fff;padding:2%}.image-input button{font-weight:500;color:#fff;background-color:var(--primary);font-size:14px;padding:8px 20px;cursor:pointer;border-radius:5px;transition:all .3s ease-in-out;box-shadow:var(--btn-shadow-normal)}.image-input button:hover{background-color:var(--primary-hover);box-shadow:var(--btn-shadow-hover)}.add-option{padding:2% 4%;background-color:#dc2626;color:#fff;border-radius:5px;font-weight:400}.border{width:100%}.border-properties{width:100%;display:flex;align-items:center;justify-content:center;gap:2%}.border-prop{width:48%;margin-bottom:5%}.border-prop label{font-size:10px;text-transform:uppercase;font-weight:700;display:block;color:gray;margin-bottom:3%}.border-prop input{width:100%;border-radius:5px;border:1px solid #e5e7eb;background-color:#f9fafb;padding:4%}.border-prop select{width:100%;padding:4%;border-radius:5px;background-color:#f9fafb;border:1px solid #e5e7eb;outline:none}.three-input{width:100%;display:flex;justify-content:space-between;margin-top:5%}.three-input div{width:32%}.three-input div label{font-size:10px;text-transform:uppercase;font-weight:700;display:block;color:gray;margin-bottom:3%}.three-input div input{width:100%;background-color:#f9fafb;outline:none;padding:4%;border:1px solid #e5e7eb;border-radius:5px}.three-input div select{width:100%;padding:4%;border-radius:5px;background-color:#f9fafb;border:1px solid #e5e7eb;outline:none}#text-color{margin-top:5%}.color{margin-top:5%;margin-bottom:5%}.typo{margin-bottom:5%}.effects-content{margin-top:5%}.color label{font-size:10px;text-transform:uppercase;font-weight:700;display:block;color:gray;margin-bottom:3%}.upload-import,.upload-section{width:100%}.upload-section label{font-size:10px;text-transform:uppercase;font-weight:700;display:block;color:gray;margin-bottom:3%}.upload-box{border:2px dashed #d1d5db;padding:15%;border-radius:12px;text-align:center;cursor:pointer;color:#000;font-size:12px;background:#fafafa}.upload-box:hover{border-color:#dc2626;background:#fff5f5}.upload-box span{color:#dc2626;font-weight:600}.upload-box p{font-size:13px;margin:8px 0 4px}.upload-box small{font-size:11px;color:gray}.divider{width:100%;display:flex;align-items:center;gap:2.5%}.divider div{width:45%;border:1px solid solid gray;height:0;opacity:.3}.divider span{color:gray;font-size:14px;content:none}.import-section{margin-top:5%;margin-bottom:5%}.import-section label{font-size:10px;text-transform:uppercase;font-weight:700;display:block;color:gray;margin-bottom:3%}.import-row{display:flex;gap:8px;color:gray}.url-input{flex:1;display:flex;align-items:center;gap:3%;border:1px solid #e5e7eb;border-radius:8px;padding:3%;background:#f9fafb}.url-input input{border:none;outline:none;width:100%;font-size:13px;background-color:#f9fafb}.fetch-btn{background:#dc2626;color:#fff;border:none;padding:3% 6%;border-radius:8px;font-size:13px;font-weight:600;cursor:pointer}.data-source{width:100%}.data-source label{font-size:10px;text-transform:uppercase;font-weight:700;display:block;color:gray;margin-bottom:3%}.data-row{color:gray;width:100%;display:flex;justify-content:space-between;border:1px solid #e5e7eb;padding:2%;border-radius:5px}.data-row input{border:none;outline:none;width:90%;background-color:#f9fafb;border-radius:5px}.data-row input:focus{outline:none;border:none}.data-icon{color:green}.sql-editor{position:relative;width:100%;background:linear-gradient(180deg,#0f172a,#020617);border-radius:10px;padding:5% 3% 15%;margin-top:8px;font-family:JetBrains Mono,monospace;margin-bottom:4%}.sql-code{margin:0;color:#22c55e;font-size:12px;line-height:1.6;white-space:pre-wrap}.sql-badge{position:absolute;bottom:6px;right:10px;font-size:10px;color:#94a3b8;letter-spacing:.05em}.api-connection{padding:4%;border:1px solid #e5e7eb;border-radius:10px}.api-icon{color:#00f}.api-row{width:100%;display:flex;align-items:center;justify-content:space-between}.api-row div p{color:#000}.link{opacity:.5;font-size:14px}.green-dot{background-color:#22c55e;padding:1%;border-radius:999px;width:1%}.api-text{display:flex;gap:4%}.api-button{margin-top:5%;color:#dc2626;background-color:#fee2e2;border-radius:5px;width:100%;padding:2%}.delete-box{background-color:#ffffff3d;-webkit-backdrop-filter:blur(5px);backdrop-filter:blur(5px);padding:9%;display:flex;flex-wrap:wrap;align-items:center;justify-content:center;bottom:0;border-top:1px solid var(--primary)}.delete-button{position:fixed;color:var(--primary);border:2px solid var(--primary);padding:10px 80px;border-radius:8px;background-color:var(--red-50);bottom:10px;transition:all .3s ease-in-out}.delete-button:hover{background-color:var(--red-100)}.scale,.scale div{width:100%}.scale div input{width:100%;background-color:#f9fafb;outline:none;padding:4%;border:1px solid #e5e7eb;border-radius:5px}.scale div label{font-size:10px;text-transform:uppercase;font-weight:700;display:block;color:gray;margin-bottom:3%}.properties-class input{padding:2%;width:100%;font-size:12px;border-radius:5px;border:1px solid #e5e7eb;background-color:#f9fafb}.api-form{width:100%;margin-top:5%}.api-form label{font-size:10px;text-transform:uppercase;font-weight:700;display:block;color:gray;margin-bottom:3%}.api-form input{width:100%;background-color:#f9fafb;outline:none;padding:4%;border:1px solid #e5e7eb;border-radius:5px}.content{margin-top:8%}.wrap-input{width:100%}.wrap-input label{font-size:10px;text-transform:uppercase;font-weight:700;display:block;color:gray;margin-bottom:3%}.wrap-input select{width:100%;padding:2%;border-radius:5px;background-color:#f9fafb;border:1px solid #e5e7eb;outline:none}.font-input{width:100%}.font-input select{width:100%;padding:2%;border-radius:5px;background-color:#f9fafb;border:1px solid #e5e7eb;outline:none}.font-input label{font-size:10px;text-transform:uppercase;font-weight:700;display:block;color:gray;margin-bottom:3%;margin-top:5%}.browse-btn:disabled{opacity:.7;cursor:not-allowed}.spinner{width:16px;height:16px;border:2px solid white;border-top:2px solid transparent;border-radius:50%;animation:spin .7s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}.imported-files{margin-top:12px;margin-bottom:5%}.imported-header{display:flex;justify-content:space-between;margin-bottom:10px}.imported-header .title{display:flex;align-items:center;gap:6px;font-weight:600;font-size:14px;color:#000}.count{background:#fee2e2;color:#dc2626;font-size:11px;padding:2px 6px;border-radius:999px}.file-card{display:flex;align-items:center;gap:10px;padding:10px;border:1px solid #e5e7eb;border-radius:10px;margin-bottom:8px;background:#fff}.file-card.uploading{background:#eff6ff;border-color:#bfdbfe}.file-icon{width:34px;height:34px;border-radius:8px;display:flex;align-items:center;justify-content:center}.file-icon.green{background:#dcfce7;color:#16a34a}.file-icon.orange{background:#ffedd5;color:#f97316}.file-icon.blue{background:#dbeafe;color:#2563eb}.file-info{flex:1}.file-info strong{display:block;font-size:13px;color:#000}.file-info small{font-size:11px;color:#6b7280}.file-actions{display:flex;gap:10px;color:#6b7280;cursor:pointer}.progress-bar{width:100%;height:6px;background:#bfdbfe;border-radius:6px;margin:6px 0}.progress{width:65%;height:100%;background:#2563eb;border-radius:6px}.upload-text{color:#2563eb}.api-card{display:flex;align-items:center;gap:10px;padding:10px 12px;background:#fff;border:1px solid #e8ede8;border-radius:10px;margin-top:5%}.api-card-icon{flex-shrink:0;width:34px;height:34px;border-radius:8px;background:#edf7f0;display:flex;align-items:center;justify-content:center;color:#3dbd6e}.api-card-info{flex:1;min-width:0;display:flex;flex-direction:column;gap:2px}.api-card-url{font-size:13px;font-weight:600;color:#1a1f1a;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;line-height:1.3}.api-card-meta{display:flex;align-items:center;gap:5px;font-size:11px;color:#93a393;text-transform:capitalize}.api-card-dot{width:4px;height:4px;border-radius:50%;display:inline-block;flex-shrink:0}.api-card-trash{flex-shrink:0;color:#c0c8c0;cursor:pointer;transition:color .15s}.file-loader{width:32px;height:32px;border-radius:50%;background:radial-gradient(farthest-side,var(--primary) 94%,#0000) top/8px 8px no-repeat,conic-gradient(#0000 30%,var(--primary));-webkit-mask:radial-gradient(farthest-side,#0000 calc(100% - 8px),#000 0);mask:radial-gradient(farthest-side,#0000 calc(100% - 8px),#000 0);animation:l13 1s infinite linear}.dock-wrapper{display:flex;flex-wrap:wrap;align-items:center;justify-content:center;gap:14px;position:fixed;bottom:50px;left:50%;transform:translate(-50%);padding:14px 26px;border-radius:999px;border:2px solid transparent;background:#f3f4f685;-webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px);transition:all .3s ease-in-out;box-shadow:0 10px 30px #0000001f,inset 0 1px #fff6}.dock-wrapper:hover{transform:translate(-50%) translateY(-4px);box-shadow:0 14px 40px #0000002e,inset 0 1px #ffffff80}.dock-wrapper svg{width:20px;height:20px;cursor:pointer;color:#000;transition:all .2s ease}.dock-wrapper svg:hover{color:var(--primary);transform:scale(1.15)}.dock-wrapper svg:active{transform:scale(.95)}.dock-wrapper>input{height:30px;width:70px;text-align:center;font-weight:500;font-size:14px;border-radius:10px;color:#111827;border:1px solid #F3F4F6;transition:all .3s ease-in-out;border:2px solid transparent;outline:none}.dock-wrapper>input:hover{border-color:var(--primary)}.divider-line{width:1px;height:20px;background-color:#ccc}.workspace-topbar{padding:10px 40px;display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:20px;position:fixed;top:85px;left:48%;transform:translate(-50%);z-index:20;border-radius:12px;background:#f3f4f685;-webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px);transition:all .3s ease-in-out;box-shadow:0 10px 30px #0000001f,inset 0 1px #fff6}.workspace-topbar-btns{display:flex;flex-wrap:wrap;align-items:center;gap:20px}.current-project{font-weight:550;cursor:pointer;transition:all .3s ease-in-out}.current-project:hover{color:var(--primary);font-weight:700}.current-url{display:flex;flex-wrap:wrap;align-items:center;justify-content:center;gap:20px;background-color:#fff;padding:10px 20px;border-radius:999px;transition:all .3s ease-in-out;border:2px solid var(--primary)}.current-url svg{cursor:pointer;transition:all .3s ease-in-out}.current-url svg:hover{color:var(--primary);transform:scale(1.1)}.save-btn p{display:flex;flex-wrap:wrap;align-items:center;justify-content:center;gap:10px}@media(max-width:1024px){.workspace-topbar{left:50%;transform:translate(-50%);padding:10px 20px;gap:15px}.workspace-topbar-btns{gap:15px}}@media(max-width:768px){.workspace-topbar{position:fixed;top:10px;left:10px;right:10px;transform:none;width:auto;flex-direction:column;align-items:stretch;padding:12px;gap:12px}.workspace-topbar-screens,.workspace-topbar-btns{justify-content:center;width:100%}.workspace-topbar-btns{flex-wrap:wrap}.divider-line{display:none}}@media(max-width:480px){.workspace-topbar-btns button{width:100%;justify-content:center}.workspace-topbar-screens{justify-content:space-between}}.loading-wrapper{display:flex;flex-wrap:wrap;align-items:center;justify-content:center;flex-direction:column;gap:20px}.loading-wrapper p{color:var(--primary);font-size:20px;font-weight:700}.blocks{border:2px solid var(--primary);max-width:158px;padding:4px;border-radius:8px;gap:4px;display:flex;flex-wrap:wrap}.blocks .block{display:flex;flex:1;border-radius:4px;background:var(--primary);width:75px;height:75px;animation:blockLoading 1s infinite}.blocks .block:nth-child(1){animation-delay:0ms}.blocks .block:nth-child(2){animation-delay:.2s}.blocks .block:nth-child(3){animation-delay:.4s}.blocks .block:nth-child(4){animation-delay:.6s}@keyframes blockLoading{0%,to{flex:1}50%{flex:4}}.component-editor-wrapper{position:relative;display:flex;flex-direction:column;height:93vh;overflow:hidden;background:#f9fafb}.editor-top-bar{position:absolute;top:12px;left:50%;transform:translate(-50%);padding:10px 28px;display:flex;align-items:center;gap:16px;z-index:30;border-radius:14px;background:#f3f4f685}.editor-top-bar .secondary-button:hover{color:var(--primary)}.editor-top-bar .secondary-button:active{transform:scale(.95)}.save-component-btn{padding:10px 20px;border-radius:12px;font-weight:600;background:var(--primary);color:#fff;border:none;cursor:pointer;font-size:medium}.save-component-btn:hover{opacity:.9}.save-component-btn:disabled{opacity:.5;cursor:not-allowed}.editor-body{display:flex;flex:1;overflow:hidden}.custom-component-modal{position:fixed;top:50%;left:50%;transform:translate(-50%,-50%);background:#fff;border-radius:12px;padding:16px;width:320px;max-width:90%;max-height:80vh;box-shadow:0 10px 30px #00000026;display:flex;flex-direction:column;gap:12px;overflow-y:auto;z-index:1200}.custom-component-modal h4{margin:0;font-size:14px;font-weight:600;color:#111827;text-align:center}.custom-component-modal input[type=text]{padding:8px 10px;border-radius:8px;border:1px solid #e5e7eb;font-size:14px;width:100%;outline:none}.custom-component-modal button{background-color:#dc2626;color:#fff;font-weight:600;border-radius:10px;padding:8px 16px;font-size:14px;border:none;cursor:pointer;box-shadow:0 2px 6px #00000026}.custom-component-modal button:hover:not(:disabled){background-color:#b91c1c;transform:translateY(-1px)}.custom-component-modal button:disabled{background-color:#fca5a5;cursor:not-allowed;opacity:.7}.icon-picker-wrapper{position:fixed;top:40%;left:40%;width:380px;max-height:300px;background:#fff;border-radius:12px;padding:16px;box-shadow:0 12px 32px #0000002e;overflow-y:auto;z-index:1000;display:flex;flex-direction:column;gap:12px}.icon-picker-header{font-size:14px;font-weight:600;color:#111827;text-align:center;margin:0}.icon-picker-search{display:flex;align-items:center;gap:8px;padding:8px 12px;border-radius:8px;border:1px solid #e5e7eb;color:#9ca3af}.icon-picker-search input{border:none;outline:none;width:100%;font-size:14px}.icon-picker-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(48px,1fr));gap:8px;padding:8px 0;flex:1;overflow-y:auto}.icon-picker-item{display:flex;align-items:center;justify-content:center;width:100%;height:48px;border-radius:8px;border:1px solid #e5e7eb;cursor:pointer;transition:all .2s ease;padding:0;margin:0}.search-box{display:flex;align-items:center;gap:8px;padding:8px 10px;border-radius:8px;border:1px solid #e5e7eb;color:#9ca3af;margin-bottom:8px}.search-box input{border:none;outline:none;width:100%;font-size:14px}.modal-header{display:flex;justify-content:space-between;align-items:center}.modal-cancel-btn{cursor:pointer;color:#888;transition:color .2s}.modal-cancel-btn:hover{color:red}.prompt-wrapper{position:fixed;top:50%;left:50%;transform:translate(-50%,-50%);background:#fff;border-radius:12px;padding:20px;box-shadow:0 10px 30px #00000026;display:flex;flex-wrap:wrap;justify-content:center;flex-direction:column;gap:12px;overflow-y:auto;z-index:1000;border:2px solid var(--red-400)}.prompt-header{display:flex;flex-wrap:wrap;align-items:center;gap:10px;margin-bottom:12px}.prompt-header h3{font-size:18px;font-weight:600;color:#333;margin:0}.prompt-header h3 span{color:var(--primary);font-weight:800}.prompt-icon{width:50px;height:50px;background:#fff1f0;color:var(--primary);border-radius:8px;display:flex;align-items:center;justify-content:center}.prompt-body{display:flex;flex-wrap:wrap;align-items:center;justify-content:center;flex-direction:column;gap:20px}.prompt-body textarea{border-radius:8px;border:2px solid #FEE2E2;font-size:16px;padding:5px}.prompt-btns{display:flex;flex-wrap:wrap;align-items:center;justify-content:flex-end;gap:20px;width:100%}.prompt-btns button{display:flex;flex-wrap:wrap;align-items:center;justify-content:center;gap:10px;padding:10px 20px;border-radius:8px}.prompt-cancel-btn{background-color:var(--red-50);transition:all .3s ease-in-out}.prompt-cancel-btn:hover{background-color:var(--red-200)}.prompt-generate-btn{background-color:var(--primary);color:#fff;transition:all .3s ease-in-out;box-shadow:var(--btn-shadow-normal)}.prompt-generate-btn:hover{background-color:var(--primary-hover);box-shadow:var(--btn-shadow-hover)}.json-output-wrapper{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-around;gap:20px;width:100%}.copy-icon{cursor:pointer}.file-loader{width:32px;height:32px;border-radius:50%;background:radial-gradient(farthest-side,#fff 94%,#0000) top/8px 8px no-repeat,conic-gradient(#0000 30%,#fff);-webkit-mask:radial-gradient(farthest-side,#0000 calc(100% - 8px),#000 0);mask:radial-gradient(farthest-side,#0000 calc(100% - 8px),#000 0);animation:l13 1s infinite linear}@keyframes l13{to{transform:rotate(1turn)}}.dashboard-container{background:#fef2f2;min-height:100vh;display:flex;justify-content:center}.dashboard-inner{width:100%;max-width:1400px;padding:48px 24px}.top-bar{display:flex;justify-content:space-between;align-items:center}.breadcrumb{display:flex;align-items:center;gap:10px;font-size:18px;font-weight:600}.breadcrumb-link{color:#6b7280;cursor:pointer}.breadcrumb-link:hover{color:var(--primary)}.breadcrumb-separator{color:#d1d5db}.breadcrumb-current{color:#000;font-weight:700}.top-bar h1{font-size:36px;font-weight:800;margin-bottom:6px}.search-box{display:flex;align-items:center;gap:10px;background:#fff;padding:10px 16px;border-radius:12px;border:1px solid #f1dcdc;width:320px}.search-box input{border:none;outline:none;font-size:14px;width:100%;background:transparent}.card-grid{margin-top:40px;display:grid;grid-template-columns:repeat(auto-fill,minmax(320px,1fr));gap:32px;justify-content:start}.create-card{border:2px dashed var(--red-400);background:#fff;border-radius:18px;padding:48px 30px;text-align:center;cursor:pointer}.create-card:hover{background:#fff7f7}.create-card h3{font-size:20px;font-weight:700;margin-bottom:6px}.create-card p{font-size:15px;color:#727782}.create-icon{width:70px;height:70px;background:#ffe8e8;border-radius:50%;display:flex;align-items:center;justify-content:center;margin:0 auto 20px;color:var(--primary)}.folder-card{background:#fff;padding:28px;border-radius:18px;border:2px solid #f1dcdc;cursor:pointer;transition:all .3s ease-in-out}.folder-card:hover{border:2px solid var(--primary);transform:translateY(-3px)}.card-top{display:flex;justify-content:space-between;align-items:center;margin-bottom:22px}.folder-icon{width:56px;height:56px;border-radius:16px;display:flex;align-items:center;justify-content:center;color:#fff}.folder-color{background:var(--red-50);color:var(--primary)}.folder-card h3{font-size:20px;font-weight:700;margin-bottom:6px}.desc{font-size:14px;color:#6b7280;margin-bottom:22px}.card-footer{display:flex;justify-content:space-between;align-items:center;font-size:14px;color:#9ca3af}.back-btn{margin-top:16px;background:none;border:none;font-size:16px;color:#374151;display:flex;align-items:center;gap:6px;cursor:pointer}.page-card{background:#fff;border-radius:18px;border:2px solid #f1dcdc;display:flex;flex-direction:column;justify-content:space-between;min-height:240px;padding:20px 24px;transition:all .3s ease-in-out}.page-card:hover{border:2px solid var(--primary);transform:translateY(-3px)}.page-top{background:#f7f8fa;height:100px;margin:-20px -24px 0;padding:20px 24px 16px;border-top-left-radius:18px;border-top-right-radius:18px}.page-header{display:flex;justify-content:space-between;align-items:center}.page-header-right{display:flex;align-items:center;gap:12px}.page-title{display:flex;flex-wrap:wrap;justify-content:center;flex-direction:column;gap:2px}.page-title h3{font-size:20px;font-weight:600}.page-description{font-size:12px;color:#6b7280}.page-divider{height:1px;background:#f1f1f1;margin:0}.page-footer{display:flex;align-items:center;margin-top:auto}.page-link{display:flex;flex-wrap:wrap;align-items:center;justify-content:center;gap:10px;cursor:pointer}.page-link p{font-size:12px;transition:all .3s ease-in-out;color:var(--primary);font-weight:700;letter-spacing:.5px}.page-link p:hover{text-decoration:underline;text-underline-offset:2px;text-decoration-thickness:2px}.last-modified{display:flex;align-items:center;gap:6px;font-size:13px;color:#6b7280}.open-page{display:flex;align-items:center;gap:6px;font-size:14px;font-weight:500;cursor:pointer;color:var(--primary)}.open-page:hover{gap:10px;color:var(--red-400)}.status{display:flex;flex-wrap:wrap;align-items:center;justify-content:center;font-size:14px;padding:10px 20px;border-radius:999px;font-weight:500}.status.published{background:#e6f9ed;color:#16a34a;font-weight:700}.status.draft{background:#fff4e5;color:#d97706;font-weight:700}.menu-wrapper{position:relative}.three-dots{cursor:pointer;width:20px;height:20px;flex-shrink:0}.three-dots:hover{background:#f3f4f6}.dropdown-menu{position:absolute;right:0;top:36px;width:180px;background:#fff;border-radius:14px;box-shadow:0 20px 50px #0000001a;padding:8px;z-index:100}.menu-item{display:flex;align-items:center;gap:10px;padding:10px 12px;border-radius:10px;font-size:14px;cursor:pointer}.menu-item:hover{background:#ededed}.menu-divider{height:1px;background:#f1f1f1;margin:6px 0}.menu-item.delete{color:var(--primary)}.menu-item.delete:hover{background:#fef2f2}.modal-overlay{position:fixed;inset:0;background:#00000059;-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);display:flex;align-items:center;justify-content:center;z-index:1000}.modal-box{width:420px;background:#fff;border-radius:16px;box-shadow:0 20px 60px #00000026;overflow:hidden}.modal-header{display:flex;align-items:center;justify-content:space-between;padding:18px 24px;border-bottom:1px solid #eee}.modal-header h2{font-size:18px;font-weight:600;color:#111}.close-icon{cursor:pointer;color:#777;transition:.2s all ease-in-out}.close-icon:hover{transform:scale(1.1);color:var(--primary)}.modal-body,.modal-body form{padding:20px 24px;display:flex;flex-wrap:wrap;justify-content:center;flex-direction:column;gap:12px}.modal-body label{font-size:13px;font-weight:500;color:#444}.modal-body input,.modal-body textarea{width:100%;padding:10px 14px;border-radius:10px;border:1px solid #ddd;font-size:14px;outline:none;transition:.2s}.modal-body input:focus,.modal-body textarea:focus{border:2px solid var(--primary)}.modal-body textarea{resize:none;min-height:90px}.modal-footer{display:flex;justify-content:flex-end;gap:12px;padding:16px 24px;border-top:1px solid #eee}.cancel-btn{background:transparent;border:none;font-size:14px;color:#555;cursor:pointer;padding:10px}.cancel-btn:hover{color:var(--primary);border-radius:10px}.primary-btn{background:var(--primary);color:#fff;border:none;padding:8px 18px;border-radius:8px;font-size:14px;font-weight:500;cursor:pointer;transition:.2s}.primary-btn:hover{background:var(--primary-hover)}.primary-btn:disabled{color:#cbcbcb;background-color:#ebebeb;cursor:not-allowed}.export-modal-overlay{position:fixed;inset:0;display:flex;align-items:center;justify-content:center;z-index:9999;background:#0003}.export-modal{background:#fff;border-radius:12px;padding:24px;width:340px;box-shadow:0 10px 30px #00000014;border:2px solid #FEE2E2}.export-header{display:flex;align-items:center;gap:10px;margin-bottom:12px}.export-header h3{font-size:18px;font-weight:600;color:#333;margin:0}.export-icon{width:34px;height:34px;background:#fff1f0;color:#b91c1c;border-radius:8px;display:flex;align-items:center;justify-content:center}.export-description{font-size:14px;color:#666;margin-bottom:20px}.export-modal-actions{display:flex;flex-direction:column;gap:12px}.export-btn{padding:10px 16px;border-radius:8px;background:#b91c1c;border:none;color:#fff;font-weight:600;display:flex;align-items:center;justify-content:center;gap:8px;cursor:pointer}.export-btn:hover{background:#e63946}.cancel-btn{padding:10px 16px;border-radius:8px;background:#f5f5f5;border:none;color:#555;cursor:pointer;transition:all .2s ease}@media(max-width:1024px){.dashboard-inner{padding:32px 20px}.card-grid{gap:24px}.search-box{width:260px}}@media(max-width:768px){.top-bar{flex-direction:column;align-items:flex-start;gap:16px}.search-box{width:100%}.top-bar h1{font-size:28px}.breadcrumb{font-size:16px}.card-grid{grid-template-columns:1fr;gap:20px}.create-card{padding:36px 20px}.folder-card,.page-card{padding:20px}.page-top{height:auto;padding:16px 20px}.modal-box{width:95%}}@media(max-width:480px){.dashboard-inner{padding:24px 16px}.top-bar h1{font-size:22px}.create-icon{width:56px;height:56px}.folder-card h3{font-size:18px}.page-title p{font-size:16px}.page-description{font-size:13px}.modal-body{padding:16px}.modal-footer{padding:14px 16px}.primary-btn{padding:8px 14px}}.delete-modal-overlay{position:fixed;inset:0;display:flex;align-items:center;justify-content:center;z-index:9999}.delete-modal{background:#fff;border-radius:12px;padding:24px;width:360px;box-shadow:0 10px 30px #00000014;border:2px solid #FEE2E2}.delete-header{display:flex;align-items:center;gap:10px;margin-bottom:12px}.delete-header h3{font-size:18px;font-weight:600;color:#333;margin:0}.delete-icon{width:34px;height:34px;background:#fff1f0;color:var(--primary);border-radius:8px;display:flex;align-items:center;justify-content:center}.delete-description{font-size:14px;color:#666;margin-bottom:20px}.delete-modal-actions{display:flex;justify-content:flex-end;gap:10px}.cancel-btn{padding:8px 16px;border-radius:8px;background:#f5f5f5;border:none;color:#555;cursor:pointer;transition:all .2s ease}.cancel-btn:hover{background:#eaeaea}.confirm-btn{padding:8px 16px;border-radius:8px;background:#b91c1c;border:none;color:#fff;font-weight:500;display:flex;align-items:center;gap:6px;cursor:pointer;transition:all .2s ease}.confirm-btn:hover{background:#e63946}.feature-container{width:100%}.heading-section{width:100%;padding:60px 280px 20px;text-align:center;position:relative}.heading-content{width:100%;padding:0 180px 20px}.heading-content h1{font-size:68px}.heading-content h1 span{background:linear-gradient(90deg,#2b1d25,#5e1e23,#932124,#b72626,#d72a2b);-webkit-background-clip:text;-webkit-text-fill-color:transparent}.heading-text{padding:0 370px}.heading-text p{font-size:20px;opacity:.5}.heading-btn{display:flex;align-items:center;justify-content:center;gap:20px;width:100%;margin-top:40px}.build-btn{display:flex;flex-wrap:wrap;align-items:center;justify-content:center;color:#fff;background-color:var(--primary);padding:15px 40px;border-radius:8px;font-size:18px;gap:10px}.demo-btn{display:flex;flex-wrap:wrap;align-items:center;justify-content:center;gap:10px;color:#000;background-color:#fff;border:1px solid var(--primary);padding:15px 40px;font-size:18px;border-radius:8px}.features-content{width:100%;margin-top:150px;display:flex;justify-content:space-between}.features{padding:30px 340px;width:100%}.feature-image{display:flex;flex-wrap:wrap;align-items:center;justify-content:center;width:40%;padding:40px;background-color:var(--red-100);border-radius:25px}.floating-box{width:100%;display:flex;flex-wrap:wrap;align-items:center;justify-content:center}.floating-box img{width:70%;border-radius:25px}.feature-text{width:45%;padding:40px 0}.feature-text span{display:inline-flex;align-items:center;text-transform:uppercase;font-size:14px;gap:5px;background-color:var(--red-100);padding:5px 20px;border-radius:999px}.feature-text span svg{width:20px;color:var(--primary)}.feature-text span p{padding:0;margin:0;color:var(--primary);font-size:14px;opacity:1}.feature-text h2{margin-top:20px;font-size:48px}.feature-text h2 span{font-size:48px;padding:0;background-color:#fff;color:var(--primary);text-transform:none}.feature-text p{margin-top:30px;font-size:16px;opacity:.5}.feature-text ul{margin-top:30px}.feature-text ul li{display:flex;align-items:center;gap:8px;margin-top:7px}.feature-text ul li span{padding:4px;border-radius:999px}#publish-dot{padding:4px;border-radius:50px;background-color:red}#connectivity-image{width:70%}.feature-bottom{padding:150px 380px;background-color:#ffeaea;margin-top:100px}.bottom-text{padding:0 230px;text-align:center}.bottom-text h1{font-size:64px}#publish{width:80%}.get-started{display:flex;flex-wrap:wrap;align-items:center;justify-content:center;background-color:var(--red-50);width:100%;padding:50px;color:#fff;position:relative;border-top:1px solid var(--red-200);border-bottom:1px solid var(--red-200)}.starter-card{display:flex;flex-wrap:wrap;align-items:center;justify-content:center;flex-direction:column;gap:20px;background:var(--primary);padding:100px 200px;border-radius:32px;box-shadow:0 0 10px var(--btn-shadow-normal)}.starter-card h1{font-size:50px;font-weight:800;letter-spacing:1px}.starter-card p{font-size:18px;color:#f3f3f3}.starter-pattern{inset:0;opacity:.1;position:absolute;background-image:radial-gradient(white 2px,transparent 2px);background-size:24px 24px;pointer-events:none}.starter-gradient{background-color:#ffffff36;padding:5px 15px;border-radius:15px;margin-left:20px}@media(max-width:1440px){.heading-section{padding:50px 240px 20px}.heading-content{padding:0 0 20px}.heading-content h1{font-size:60px}.heading-text{padding:0 180px}.features{padding:30px 150px}.features-content{margin-top:110px}.feature-image{display:flex;align-items:center}.floating-box img{width:75%}.feature-text p{padding:0 60px 0 0}.feature-bottom{padding:120px 180px}.bottom-text{padding:0 120px}.bottom-text h1{font-size:56px}}@media(max-width:1100px){.heading-section{padding:50px 120px 20px}.heading-content{padding:0 35px 20px}.heading-content h1{font-size:56px}.heading-text{padding:0 40px}.features{padding:0}.features-content{flex-direction:column;align-items:center;margin-bottom:40px}.feature-text p{padding:0}.starter-card{padding:50px;border-radius:24px}.starter-card h1{font-size:30px;text-align:center}.starter-card p{font-size:16px;text-align:center}.starter-card h1 span{background-color:transparent;margin-left:5px;padding:0}.feature-bottom{padding:120px 140px}.bottom-text{padding:0 80px}.bottom-text h1{font-size:52px}}@media(max-width:700px){.heading-section{padding:32px 20px 12px}.heading-content{padding:0 0 12px}.heading-content h1{font-size:40px}.heading-text{padding:0}.heading-text p{font-size:16px}.heading-btn{flex-direction:column;gap:12px;margin-top:24px}.build-btn,.demo-btn{width:100%;padding:16px 20px;border-radius:12px;font-size:16px}.features{padding:0 20px}.features-content{margin-top:60px;flex-direction:column;gap:24px}.feature-image,.feature-text{width:100%}.feature-image{padding:20px;border-radius:18px}.floating-box{padding:40px 0}.floating-box img,#connectivity-image{width:100%}.feature-text{padding:0}.feature-text h2,.feature-text h2 span{font-size:32px}.feature-text p{font-size:16px}.feature-bottom{padding:64px 20px}.bottom-text{padding:0}.bottom-text h1{font-size:36px}}.template-card{display:flex;flex-wrap:wrap;justify-content:center;flex-direction:column;border-radius:12px;background:#fff;box-shadow:0 0 10px #00000014;transition:all .3s ease-in-out;max-width:450px;width:100%}.template-card:hover{transform:translateY(-4px);box-shadow:0 4px 20px #00000026}.image-part{height:300px;overflow:hidden;border-top-left-radius:12px;border-top-right-radius:12px}.template-img{width:100%;height:100%;object-fit:cover;transition:all .6s ease-in-out}.template-card:hover .template-img{transform:scale(1.08)}.template-content{display:flex;flex-wrap:wrap;justify-content:center;flex-direction:column;padding:20px;gap:20px}.content-part{display:flex;flex-wrap:wrap;justify-content:center;flex-direction:column;gap:10px;margin-bottom:10px}.template-heading{font-size:20px;font-weight:700;transition:all .3s ease-in-out}.template-card:hover .template-heading{color:var(--primary)}.template-description{font-size:14px;color:#6b6b6b;line-height:1.5}.button-part{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:20px}.button-part button{padding:10px 25px;border-radius:8px;font-size:16px;display:flex;align-items:center;justify-content:center;gap:5px;box-shadow:0 4px 10px #0000001a;transition:all .3s ease-in-out}.btn-view{display:flex;flex-wrap:wrap;align-items:center;justify-content:center;gap:10px;padding:10px 25px;background:#ff005014;color:var(--primary);border-radius:8px;transition:all .3s ease-in-out}.btn-view:hover{background-color:var(--red-100);transform:translateY(-3px)}.btn-open{background:linear-gradient(135deg,var(--primary),var(--primary-hover));color:#fff;box-shadow:var(--btn-shadow-hover)}.btn-open:hover{background-color:var(--primary-hover);transform:translateY(-3px)}.template-wrapper{display:flex;flex-wrap:wrap;align-items:center;justify-content:center;flex-direction:column;width:100%;background-color:#fef2f2;padding:40px 0}.template-container{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-evenly;gap:44px;box-sizing:border-box;padding-bottom:50px;width:100%}.template-header{margin:50px 0 150px}.template-header h1{font-size:40px}.template-header span{color:var(--primary);padding:10px 20px;background-color:var(--red-100);border-radius:12px;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}@media(max-width:1100px){.template-container{grid-template-columns:repeat(2,minmax(0,1fr));padding:24px 8%}}@media(max-width:700px){.template-container{grid-template-columns:1fr;padding:16px 5%}.search-bar{flex-direction:column}.heading{margin-bottom:2%}}.profile-container{display:flex;flex-wrap:wrap;align-items:center;justify-content:center;background-color:#feecec;min-height:100vh}.profile-card{background-color:#fff;padding:50px 40px;box-shadow:0 -5px 1px 0 var(--primary);border-radius:15px}.profile-image{display:flex;flex-direction:column;align-items:center;justify-content:center;margin-bottom:4%}.profile-image div{padding:6%;border-radius:75px;background-color:var(--primary);box-shadow:7px 12px 29px -8px var(--red-500)}.profile-image div h1{font-size:40px;font-weight:300;color:#fff}.profile-image h3{margin-top:3%}.profile-details{width:100%;padding-top:20px}.profile-details h2{display:flex;align-items:center;gap:10px;font-size:18px;font-weight:600;margin-bottom:4%}.profile-form label{display:block;margin-bottom:1%}.profile-form input{width:100%;padding:2%;border-radius:25px;background-color:#fef8f8;border:1px solid #FEE2E2;outline:none;margin-bottom:3%;font-size:18px;font-weight:300}.profile-form .mail{display:flex;align-items:center;background-color:#fef8f8;border:1px solid #FEE2E2;border-radius:25px;padding:0 2%;gap:10px;margin-bottom:7%}#personal-mail{padding:2%;margin:0;font-size:18px;outline:none;border:none}.profile-form .hr{width:100%;height:1px;background-color:var(--red-200);margin-bottom:4%}.delete-account{display:flex;flex-wrap:wrap;padding:3%;align-items:center;justify-content:space-evenly;background-color:#fef8f8;border:1px solid #FEE2E2;border-radius:12px;gap:20px}.delete-account-wrapper{display:flex;flex-wrap:wrap;align-items:center;gap:10px}.delete-account .alert-icon{padding:12px 15px;border-radius:50px;background-color:#fee2e2}.delete-description{display:flex;flex-wrap:wrap;justify-content:center;flex-direction:column}.delete-description span{color:var(--primary-active);font-weight:500}.delete-description p{font-size:12px;color:#e23b3b;font-weight:300}.profile-delete-btn{padding:2% 6%;background-color:var(--primary);border-radius:10px;color:#fff;font-weight:400}@media(max-width:1440px){.profile-container{padding:2% 24%}}@media(max-width:1100px){.profile-container{padding:32px 16%}.profile-form input,#personal-mail{font-size:16px}}@media(max-width:700px){.profile-container{padding:20px 5%}.profile-card{padding:24px 16px}.profile-image div h1{font-size:32px}.profile-details{padding:0}.profile-details h2{font-size:16px;flex-wrap:wrap}.profile-form input{padding:12px 14px}.profile-form .mail{padding:0 12px}.delete-account{flex-direction:column;align-items:flex-start;gap:12px}.profile-delete-btn{width:100%;padding:12px 14px}.save-changes{flex-direction:column-reverse;align-items:stretch}.cancel-btn,.save-changes-btn{width:100%;padding:12px 14px}}.driver-active .driver-overlay,.driver-active *{pointer-events:none}.driver-active .driver-active-element,.driver-active .driver-active-element *,.driver-popover,.driver-popover *{pointer-events:auto}@keyframes animate-fade-in{0%{opacity:0}to{opacity:1}}.driver-fade .driver-overlay{animation:animate-fade-in .2s ease-in-out}.driver-fade .driver-popover{animation:animate-fade-in .2s}.driver-popover{all:unset;box-sizing:border-box;color:#2d2d2d;margin:0;padding:15px;border-radius:5px;min-width:250px;max-width:300px;box-shadow:0 1px 10px #0006;z-index:1000000000;position:fixed;top:0;right:0;background-color:#fff}.driver-popover *{font-family:Helvetica Neue,Inter,ui-sans-serif,"Apple Color Emoji",Helvetica,Arial,sans-serif}.driver-popover-title{font:19px/normal sans-serif;font-weight:700;display:block;position:relative;line-height:1.5;zoom:1;margin:0}.driver-popover-close-btn{all:unset;position:absolute;top:0;right:0;width:32px;height:28px;cursor:pointer;font-size:18px;font-weight:500;color:#d2d2d2;z-index:1;text-align:center;transition:color;transition-duration:.2s}.driver-popover-close-btn:hover,.driver-popover-close-btn:focus{color:#2d2d2d}.driver-popover-title[style*=block]+.driver-popover-description{margin-top:5px}.driver-popover-description{margin-bottom:0;font:14px/normal sans-serif;line-height:1.5;font-weight:400;zoom:1}.driver-popover-footer{margin-top:15px;text-align:right;zoom:1;display:flex;align-items:center;justify-content:space-between}.driver-popover-progress-text{font-size:13px;font-weight:400;color:#727272;zoom:1}.driver-popover-footer button{all:unset;display:inline-block;box-sizing:border-box;padding:3px 7px;text-decoration:none;text-shadow:1px 1px 0 #fff;background-color:#fff;color:#2d2d2d;font:12px/normal sans-serif;cursor:pointer;outline:0;zoom:1;line-height:1.3;border:1px solid #ccc;border-radius:3px}.driver-popover-footer .driver-popover-btn-disabled{opacity:.5;pointer-events:none}:not(body):has(>.driver-active-element){overflow:hidden!important}.driver-no-interaction,.driver-no-interaction *{pointer-events:none!important}.driver-popover-footer button:hover,.driver-popover-footer button:focus{background-color:#f7f7f7}.driver-popover-navigation-btns{display:flex;flex-grow:1;justify-content:flex-end}.driver-popover-navigation-btns button+button{margin-left:4px}.driver-popover-arrow{content:"";position:absolute;border:5px solid #fff}.driver-popover-arrow-side-over{display:none}.driver-popover-arrow-side-left{left:100%;border-right-color:transparent;border-bottom-color:transparent;border-top-color:transparent}.driver-popover-arrow-side-right{right:100%;border-left-color:transparent;border-bottom-color:transparent;border-top-color:transparent}.driver-popover-arrow-side-top{top:100%;border-right-color:transparent;border-bottom-color:transparent;border-left-color:transparent}.driver-popover-arrow-side-bottom{bottom:100%;border-left-color:transparent;border-top-color:transparent;border-right-color:transparent}.driver-popover-arrow-side-center{display:none}.driver-popover-arrow-side-left.driver-popover-arrow-align-start,.driver-popover-arrow-side-right.driver-popover-arrow-align-start{top:15px}.driver-popover-arrow-side-top.driver-popover-arrow-align-start,.driver-popover-arrow-side-bottom.driver-popover-arrow-align-start{left:15px}.driver-popover-arrow-align-end.driver-popover-arrow-side-left,.driver-popover-arrow-align-end.driver-popover-arrow-side-right{bottom:15px}.driver-popover-arrow-side-top.driver-popover-arrow-align-end,.driver-popover-arrow-side-bottom.driver-popover-arrow-align-end{right:15px}.driver-popover-arrow-side-left.driver-popover-arrow-align-center,.driver-popover-arrow-side-right.driver-popover-arrow-align-center{top:50%;margin-top:-5px}.driver-popover-arrow-side-top.driver-popover-arrow-align-center,.driver-popover-arrow-side-bottom.driver-popover-arrow-align-center{left:50%;margin-left:-5px}.driver-popover-arrow-none{display:none}.driver-popover.driverjs-theme{background-color:var(--primary);color:#fff}.driver-popover.driverjs-theme .driver-popover-title{font-size:20px;margin-top:18px}.driver-popover.driverjs-theme .driver-popover-title,.driver-popover.driverjs-theme .driver-popover-description,.driver-popover.driverjs-theme .driver-popover-progress-text{color:#fff}.driver-popover.driverjs-theme button{display:flex;flex-wrap:wrap;align-items:center;justify-content:center;background-color:#fff;color:var(--primary);border:1px solid var(--red-50);font-size:14px;border-radius:5px;font-weight:700;transition:all .3s ease-in-out}.driver-popover.driverjs-theme button:hover{background-color:var(--primary-hover);color:#fff;border-color:transparent}.driver-popover.driverjs-theme .driver-popover-navigation-btns{gap:3px}.driver-popover.driverjs-theme .driver-popover-close-btn{display:flex;flex-wrap:wrap;align-items:center;justify-content:center;color:#000;font-size:22px;border:none;padding:2px;transition:all .3s ease-in-out}.driver-popover.driverjs-theme .driver-popover-close-btn:hover{color:#fff}.driver-popover.driverjs-theme .driver-popover-arrow-side-left.driver-popover-arrow{border-left-color:var(--primary)}.driver-popover.driverjs-theme .driver-popover-arrow-side-right.driver-popover-arrow{border-right-color:var(--primary)}.driver-popover.driverjs-theme .driver-popover-arrow-side-top.driver-popover-arrow{border-top-color:var(--primary)}.driver-popover.driverjs-theme .driver-popover-arrow-side-bottom.driver-popover-arrow{border-bottom-color:var(--primary)}
