:root{--bg-primary: #FAF8F5;--bg-secondary: #F1F5F9;--bg-card: #FFFFFF;--bg-card-hover: #FFFFFF;--bg-glass: rgba(255, 255, 255, .88);--accent-primary: #2563EB;--accent-sky: #0EA5E9;--accent-amber: #F59E0B;--accent-coral: #F97316;--accent-emerald: #10B981;--accent-teal: #0D9488;--gradient-brand: linear-gradient(135deg, #2563EB 0%, #0EA5E9 55%, #10B981 100%);--gradient-warm: linear-gradient(135deg, #F59E0B 0%, #F97316 100%);--gradient-wa: linear-gradient(135deg, #10B981 0%, #059669 100%);--gradient-featured: linear-gradient(180deg, #EFF6FF 0%, #FFFFFF 100%);--text-primary: #0F172A;--text-secondary: #475569;--text-muted: #64748B;--border-subtle: #E2E8F0;--border-highlight: #38BDF8;--shadow-card: 0 10px 30px -8px rgba(15, 23, 42, .06), 0 4px 12px -2px rgba(15, 23, 42, .04);--shadow-card-hover: 0 20px 38px -10px rgba(37, 99, 235, .13), 0 8px 16px -4px rgba(15, 23, 42, .05);--shadow-glow: 0 10px 25px -5px rgba(37, 99, 235, .35);--font-sans: "Plus Jakarta Sans", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;--font-mono: "JetBrains Mono", monospace;--container-max: 1200px;--radius-sm: 10px;--radius-md: 16px;--radius-lg: 24px;--radius-full: 9999px;--transition-fast: .22s cubic-bezier(.4, 0, .2, 1)}*,*:before,*:after{box-sizing:border-box;margin:0;padding:0}html{scroll-behavior:smooth;font-size:16px}body{font-family:var(--font-sans);background-color:var(--bg-primary);color:var(--text-primary);line-height:1.65;overflow-x:hidden;background-image:radial-gradient(circle at 12% 8%,rgba(14,165,233,.1) 0%,transparent 38%),radial-gradient(circle at 88% 14%,rgba(245,158,11,.11) 0%,transparent 36%),radial-gradient(circle at 50% 60%,rgba(16,185,129,.06) 0%,transparent 45%)}a{color:inherit;text-decoration:none;transition:color var(--transition-fast)}ul{list-style:none}button,input,select,textarea{font-family:inherit;font-size:inherit;color:inherit;background:none;border:none}button{cursor:pointer}.text-gradient{background:var(--gradient-brand);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}.section-header{text-align:center;max-width:720px;margin:0 auto 3rem}.section-header h2{font-size:clamp(1.75rem,3.5vw,2.45rem);font-weight:800;letter-spacing:-.025em;color:var(--text-primary);margin-bottom:.75rem}.section-header p{color:var(--text-secondary);font-size:1.04rem}.container{width:100%;max-width:var(--container-max);margin:0 auto;padding:0 1.25rem}section{padding:5rem 0;position:relative}section#portfolio,section#workflow{background-color:#f1f5f9a6;border-top:1px solid var(--border-subtle);border-bottom:1px solid var(--border-subtle)}.navbar{position:sticky;top:0;z-index:100;background:var(--bg-glass);backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px);border-bottom:1px solid var(--border-subtle);box-shadow:0 4px 20px -10px #0f172a0f}.navbar-inner{display:flex;align-items:center;justify-content:space-between;height:76px}.brand-logo{font-size:1.4rem;font-weight:800;letter-spacing:-.03em;color:var(--text-primary);display:flex;align-items:center;gap:.25rem}.brand-logo span.accent{color:var(--accent-primary);font-weight:700;font-size:1.05rem}.nav-links{display:flex;align-items:center;gap:2rem}.nav-links a{font-size:.95rem;font-weight:600;color:var(--text-secondary)}.nav-links a:hover{color:var(--accent-primary)}.mobile-menu-btn{display:none;padding:.5rem .85rem;color:var(--text-primary);background:#fff;border:1px solid var(--border-subtle);border-radius:var(--radius-sm);font-weight:600}.grid-3{display:grid;grid-template-columns:repeat(3,1fr);gap:1.65rem}.grid-2{display:grid;grid-template-columns:repeat(2,1fr);gap:1.5rem}.grid-4{display:grid;grid-template-columns:repeat(4,1fr);gap:1.35rem}.site-footer{background:#fff;border-top:1px solid var(--border-subtle);padding:3.5rem 0 2.5rem}.footer-inner{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:center;gap:1.5rem}.footer-copy{color:var(--text-muted);font-size:.92rem}@media (max-width: 992px){.grid-3,.grid-4{grid-template-columns:repeat(2,1fr)}}@media (max-width: 768px){section{padding:3.5rem 0}.mobile-menu-btn{display:inline-flex;align-items:center;justify-content:center}.nav-links{position:fixed;top:76px;left:0;right:0;background:#fff;border-bottom:1px solid var(--border-subtle);box-shadow:var(--shadow-card);flex-direction:column;padding:1.5rem;gap:1.15rem;transform:translateY(-150%);transition:transform .28s ease;z-index:99}.nav-links.active{transform:translateY(0)}.grid-3,.grid-2,.grid-4{grid-template-columns:1fr}}.btn{display:inline-flex;align-items:center;justify-content:center;gap:.55rem;padding:.85rem 1.6rem;border-radius:var(--radius-full);font-weight:700;font-size:.95rem;transition:all var(--transition-fast)}.btn-primary{background:var(--gradient-brand);color:#fff;box-shadow:var(--shadow-glow)}.btn-primary:hover{transform:translateY(-2px);filter:brightness(1.06)}.btn-wa{background:var(--gradient-wa);color:#fff;box-shadow:0 8px 20px -6px #10b98173}.btn-wa:hover{transform:translateY(-2px);filter:brightness(1.06)}.btn-outline{border:1.5px solid var(--border-subtle);background:#fff;color:var(--text-primary)}.btn-outline:hover{border-color:var(--accent-primary);color:var(--accent-primary);background:#eff6ff}.hero-section{padding:5rem 0 4rem;text-align:center}.hero-badge{display:inline-block;padding:.45rem 1.15rem;border-radius:var(--radius-full);background:#fef3c7;border:1px solid #FDE68A;color:#b45309;font-size:.8rem;font-weight:800;letter-spacing:.05em;margin-bottom:1.5rem}.hero-title{font-size:clamp(2.1rem,5vw,3.55rem);font-weight:800;line-height:1.16;letter-spacing:-.03em;color:var(--text-primary);max-width:900px;margin:0 auto 1.25rem}.hero-subtitle{color:var(--text-secondary);font-size:clamp(1rem,2vw,1.18rem);max-width:720px;margin:0 auto 2.25rem}.hero-actions{display:flex;flex-wrap:wrap;justify-content:center;gap:1rem;margin-bottom:3.5rem}.stats-bar{display:grid;grid-template-columns:repeat(4,1fr);gap:1rem;background:#fff;border:1px solid var(--border-subtle);border-radius:var(--radius-lg);padding:1.85rem;box-shadow:var(--shadow-card)}.stat-item h3{font-size:1.65rem;font-weight:800;color:var(--accent-primary)}.stat-item p{font-size:.88rem;color:var(--text-secondary);font-weight:500}@media (max-width: 768px){.stats-bar{grid-template-columns:repeat(2,1fr);padding:1.25rem}}.filter-tabs{display:flex;flex-wrap:wrap;justify-content:center;gap:.65rem;margin-bottom:2.5rem}.filter-tab{padding:.6rem 1.3rem;border-radius:var(--radius-full);border:1px solid var(--border-subtle);background:#fff;color:var(--text-secondary);font-size:.92rem;font-weight:700;transition:all var(--transition-fast);box-shadow:0 2px 6px #0f172a08}.filter-tab:hover{border-color:var(--accent-primary);color:var(--accent-primary)}.filter-tab.active{background:var(--gradient-brand);color:#fff;border-color:transparent;box-shadow:0 6px 16px -4px #2563eb59}.pricing-card{background:var(--bg-card);border:1.5px solid var(--border-subtle);border-radius:var(--radius-lg);padding:2.1rem 1.7rem;display:flex;flex-direction:column;justify-content:space-between;position:relative;transition:transform var(--transition-fast),box-shadow var(--transition-fast),border-color var(--transition-fast);box-shadow:var(--shadow-card)}.pricing-card:hover{transform:translateY(-6px);border-color:var(--border-highlight);box-shadow:var(--shadow-card-hover)}.pricing-card.featured{border-color:#93c5fd;background:var(--gradient-featured)}.card-badge{position:absolute;top:-13px;right:20px;background:var(--gradient-warm);color:#fff;font-size:.74rem;font-weight:800;padding:.3rem .9rem;border-radius:var(--radius-full);text-transform:uppercase;box-shadow:0 4px 12px #f59e0b59}.card-cat{font-size:.78rem;font-weight:800;color:var(--accent-teal);text-transform:uppercase;letter-spacing:.06em;margin-bottom:.35rem}.card-title{font-size:1.3rem;font-weight:800;color:var(--text-primary);margin-bottom:.5rem}.card-desc{font-size:.92rem;color:var(--text-secondary);margin-bottom:1.25rem}.card-price-box{padding:1rem 0;border-top:1px solid var(--border-subtle);border-bottom:1px solid var(--border-subtle);margin-bottom:1.25rem;display:flex;align-items:baseline;gap:.35rem}.price-amount{font-size:1.9rem;font-weight:800;font-family:var(--font-mono);color:var(--accent-primary)}.price-unit{font-size:.92rem;font-weight:600;color:var(--text-secondary)}.feature-list{margin-bottom:1.4rem;display:flex;flex-direction:column;gap:.65rem}.feature-list li{font-size:.92rem;color:var(--text-primary);display:flex;align-items:flex-start;gap:.55rem}.feature-list li span.check{color:var(--accent-emerald);font-weight:800;background:#d1fae5;width:20px;height:20px;border-radius:50%;display:inline-flex;align-items:center;justify-content:center;font-size:.75rem;flex-shrink:0;margin-top:2px}.card-limit{font-size:.8rem;color:#475569;background:#f8fafc;border:1px solid #E2E8F0;padding:.7rem .85rem;border-radius:var(--radius-sm);margin-bottom:1.25rem}.card-actions{display:grid;grid-template-columns:1fr 1fr;gap:.65rem}.portfolio-card{background:#fff;border:1px solid var(--border-subtle);border-radius:var(--radius-md);overflow:hidden;transition:transform var(--transition-fast),box-shadow var(--transition-fast);box-shadow:var(--shadow-card)}.portfolio-card:hover{transform:translateY(-5px);box-shadow:var(--shadow-card-hover)}.portfolio-thumb{position:relative;height:205px;background:linear-gradient(135deg,#dbeafe,#e0f2fe,#fef3c7);display:flex;align-items:center;justify-content:center;cursor:pointer;overflow:hidden}.portfolio-img{position:absolute;top:0;right:0;bottom:0;left:0;width:100%;height:100%;object-fit:cover;transition:transform var(--transition-fast);z-index:1}.portfolio-thumb:hover .portfolio-img{transform:scale(1.05)}.portfolio-thumb .play-trigger{width:60px;height:60px;border-radius:50%;background:#fff;color:var(--accent-primary);display:flex;align-items:center;justify-content:center;font-size:1.35rem;font-weight:800;box-shadow:0 10px 25px #2563eb40;transition:transform var(--transition-fast),background var(--transition-fast),color var(--transition-fast);z-index:2}.portfolio-thumb:hover .play-trigger{transform:scale(1.12);background:var(--accent-primary);color:#fff}.portfolio-meta-top{position:absolute;top:12px;left:12px;right:12px;display:flex;justify-content:space-between;z-index:2}.tag-pill{background:#ffffffeb;color:var(--text-primary);border:1px solid rgba(226,232,240,.9);padding:.25rem .75rem;border-radius:var(--radius-full);font-size:.75rem;font-weight:700;box-shadow:0 2px 8px #0f172a0f}.portfolio-body{padding:1.4rem}.portfolio-body h3{font-size:1.12rem;font-weight:800;color:var(--text-primary);margin-bottom:.45rem}.portfolio-stats{font-size:.8rem;color:var(--accent-primary);font-weight:700;margin-bottom:.45rem}.portfolio-body p{font-size:.9rem;color:var(--text-secondary)}.calc-wrapper{background:#fff;border:2px solid #BFDBFE;border-radius:var(--radius-lg);padding:2.5rem;box-shadow:var(--shadow-card-hover);display:grid;grid-template-columns:1.35fr 1fr;gap:2.25rem}.form-group{margin-bottom:1.25rem}.form-group label{display:block;font-size:.92rem;font-weight:700;margin-bottom:.45rem;color:var(--text-primary)}.form-control{width:100%;padding:.85rem 1rem;background:#f8fafc;border:1.5px solid var(--border-subtle);border-radius:var(--radius-sm);color:var(--text-primary);font-weight:500;transition:border-color var(--transition-fast),background var(--transition-fast)}.form-control:focus{outline:none;background:#fff;border-color:var(--accent-primary)}.addons-grid{display:flex;flex-direction:column;gap:.65rem}.addon-item{display:flex;align-items:center;justify-content:space-between;padding:.8rem 1rem;background:#f8fafc;border:1.5px solid var(--border-subtle);border-radius:var(--radius-sm);cursor:pointer;transition:border-color var(--transition-fast),background var(--transition-fast)}.addon-item:hover{border-color:#93c5fd;background:#eff6ff}.addon-item input{accent-color:var(--accent-primary);width:18px;height:18px}.calc-summary{background:linear-gradient(180deg,#f8fafc,#eff6ff);border:1.5px solid #DBEAFE;border-radius:var(--radius-md);padding:1.85rem;display:flex;flex-direction:column;justify-content:space-between}.summary-row{display:flex;justify-content:space-between;padding:.65rem 0;border-bottom:1px dashed #CBD5E1;font-size:.92rem;color:var(--text-secondary)}.summary-row strong,.summary-row span:last-child{color:var(--text-primary);font-weight:700}.summary-total{margin:1.25rem 0;padding:1.15rem;background:#ecfdf5;border:1.5px solid #6EE7B7;border-radius:var(--radius-sm);text-align:center}.summary-total span.label{display:block;font-size:.82rem;font-weight:600;color:#047857}.summary-total strong{font-size:2rem;color:#059669;font-family:var(--font-mono)}@media (max-width: 860px){.calc-wrapper{grid-template-columns:1fr;padding:1.5rem}}.step-card{background:#fff;border:1px solid var(--border-subtle);border-radius:var(--radius-md);padding:1.6rem;box-shadow:var(--shadow-card)}.step-num{display:inline-block;font-family:var(--font-mono);font-size:1.1rem;font-weight:800;color:var(--accent-primary);background:#eff6ff;padding:.3rem .75rem;border-radius:var(--radius-sm);margin-bottom:.75rem}.term-box{background:#fff;border:1px solid var(--border-subtle);border-left:4px solid var(--accent-primary);padding:1.35rem;border-radius:0 var(--radius-sm) var(--radius-sm) 0;box-shadow:var(--shadow-card)}.video-modal{position:fixed;top:0;right:0;bottom:0;left:0;background:#0f172aa6;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);display:none;align-items:center;justify-content:center;z-index:999;padding:1.25rem}.video-modal.open{display:flex}.video-modal-content{width:100%;max-width:860px;background:#fff;border:1px solid var(--border-subtle);border-radius:var(--radius-md);overflow:hidden;box-shadow:0 25px 50px -12px #0f172a59}.video-modal-header{display:flex;justify-content:space-between;align-items:center;padding:1rem 1.25rem;border-bottom:1px solid var(--border-subtle)}.video-frame-container{position:relative;padding-bottom:56.25%;height:0;background:#000}.video-frame-container iframe{position:absolute;top:0;left:0;width:100%;height:100%}.floating-wa{position:fixed;bottom:24px;right:24px;z-index:90;background:var(--gradient-wa);color:#fff;padding:.9rem 1.35rem;border-radius:var(--radius-full);font-weight:700;font-size:.92rem;box-shadow:0 12px 28px #10b98166;display:flex;align-items:center;gap:.5rem}