.nocode-hero{padding-top:var(--spacing-2xl);padding-bottom:var(--spacing-3xl);background-color:#fff;position:relative;overflow:hidden}.hero-character{z-index:0;pointer-events:none;width:auto;height:350px;position:absolute;top:35%;transform:translateY(-50%)}.hero-character-left{left:-12rem}.hero-character-right{right:-12rem}.nocode-hero-content{text-align:center;align-items:center;gap:var(--spacing-xl);z-index:1;flex-direction:column;max-width:1100px;margin:0 auto;display:flex;position:relative}.nocode-hero-badge-link{background:conic-gradient(from var(--angle,0deg),#db2777 0deg,#e6e6eb 60deg,#e6e6eb 300deg,#db2777 360deg);opacity:0;border-radius:64px;padding:2px;text-decoration:none;animation:.6s ease-out forwards fadeInUp,3s linear infinite rotateBorder;display:inline-flex;position:relative}@property --angle{syntax:"<angle>";inherits:false;initial-value:0deg}@keyframes rotateBorder{0%{--angle:0deg}to{--angle:360deg}}.nocode-hero-badge{background-color:#fff;border-radius:50px;align-items:center;gap:.5rem;padding:.5rem 1rem;font-size:.875rem;display:inline-flex}.badge-beta{background-color:var(--color-pink-light-bg);color:var(--color-pink-primary);font-weight:var(--font-weight-semibold);text-transform:uppercase;letter-spacing:.05em;border-radius:20px;padding:.25rem .625rem;font-size:.75rem}.nocode-hero-badge .badge-text{color:var(--color-text-primary);font-weight:var(--font-weight-medium)}.nocode-hero-title{color:var(--color-primary-dark);letter-spacing:-.035em;opacity:0;max-width:800px;font-size:5rem;font-weight:500;line-height:1.05;animation:.6s ease-out .1s forwards fadeInUp}.nocode-hero-description{color:var(--color-text-secondary);opacity:0;max-width:620px;font-size:1.125rem;line-height:1.7;animation:.6s ease-out .2s forwards fadeInUp}.nocode-hero-comparison{width:100%;max-width:900px;margin-top:var(--spacing-lg);opacity:0;grid-template-columns:1fr auto 1fr;align-items:start;gap:1.5rem;animation:.6s ease-out .3s forwards fadeInUp;display:grid}.comparison-side{flex-direction:column;gap:1rem;display:flex}.comparison-label{font-size:.875rem;font-weight:var(--font-weight-semibold);text-transform:uppercase;letter-spacing:.05em;text-align:center;border-radius:6px;padding:.5rem 1rem}.comparison-hard .comparison-label{color:var(--color-red);background-color:#ba383a1a}.comparison-easy .comparison-label{background-color:var(--color-pink-light-bg);color:var(--color-pink-primary)}.comparison-content{flex:1}.code-block{border-radius:var(--radius-lg);filter:grayscale(30%);background-color:#1e1e28;overflow:hidden;box-shadow:0 8px 32px #00000026}.code-header{background-color:#2a2a36;border-bottom:1px solid #3a3a46;align-items:center;gap:.5rem;padding:.75rem 1rem;display:flex}.code-dot{border-radius:50%;width:12px;height:12px}.code-dot.red{background-color:#ff5f56}.code-dot.yellow{background-color:#ffbd2e}.code-dot.green{background-color:#27c93f}.code-filename{color:#888;font-size:.75rem;font-family:var(--font-mono);margin-left:auto}.code-body{font-family:var(--font-mono);color:#a0a0a0;text-align:left;white-space:pre;margin:0;padding:1rem;font-size:.75rem;line-height:1.6;overflow-x:auto}.code-error{color:#ff6b6b;background-color:#ba383a4d;-webkit-text-decoration:underline wavy #ff6b6b;text-decoration:underline wavy #ff6b6b;display:inline}.code-error-banner{color:#ff6b6b;font-size:.75rem;font-weight:var(--font-weight-medium);background-color:#ba383a33;align-items:center;gap:.5rem;padding:.75rem 1rem;display:flex}.error-icon{background-color:var(--color-red);color:#fff;width:18px;height:18px;font-weight:var(--font-weight-bold);border-radius:50%;justify-content:center;align-items:center;font-size:.625rem;display:flex}.comparison-divider{justify-content:center;align-self:center;align-items:center;display:flex}.vs-badge{background:linear-gradient(135deg,var(--color-purple)0%,var(--color-pink-primary)100%);color:#fff;width:48px;height:48px;font-weight:var(--font-weight-bold);border-radius:50%;justify-content:center;align-items:center;font-size:.875rem;display:flex}.demo-input-wrapper{background-color:#fff;border-radius:24px;padding:1.5rem;position:relative;box-shadow:0 8px 32px #00000014,0 4px 16px #0000001f}.demo-input-wrapper:before{content:"";z-index:-1;background:linear-gradient(135deg,#a78bfa66 0%,#ec489966 50%,#fb718566 100%);border-radius:30px;position:absolute;inset:-6px;box-shadow:0 0 20px #a78bfa4d}.demo-input-wrapper h3{font-size:1.125rem;font-weight:var(--font-weight-semibold);color:var(--color-primary-dark);text-align:center;margin-bottom:1rem}.demo-input-field{margin-bottom:.75rem;position:relative}.demo-input{width:100%;color:var(--color-text-primary);background:#f8f8f8;border-radius:12px;padding:1.125rem 3rem 1.125rem 1.25rem;font-size:1.125rem;line-height:1.5}.demo-input-hint{background-color:var(--color-primary-dark);color:#fff;width:28px;height:28px;font-size:.875rem;font-weight:var(--font-weight-semibold);border-radius:6px;justify-content:center;align-items:center;display:flex;position:absolute;top:50%;right:.75rem;transform:translateY(-50%)}.demo-suggestions{flex-wrap:wrap;gap:.5rem;display:flex}.demo-chip{font-size:.75rem;font-weight:var(--font-weight-medium);color:var(--color-text-secondary);background-color:#f8f8f8;border-radius:8px;padding:.5rem .75rem}.nocode-hero-cta{margin-top:var(--spacing-lg);opacity:0;flex-direction:column;align-items:center;gap:.75rem;animation:.6s ease-out .4s forwards fadeInUp;display:flex}.cta-microcopy{color:var(--color-text-secondary);font-size:.875rem}.btn-primary{color:#fff;cursor:pointer;background:linear-gradient(#1e1e28 0%,#141317 100%);border:1px solid #303038;text-decoration:none;box-shadow:0 1px 4px #00000040}.btn-primary:hover{background:linear-gradient(#282832 0%,#1e1d21 100%)}.btn-large{font-size:.9375rem;font-weight:var(--font-weight-semibold);border-radius:var(--radius-md);align-items:center;gap:.5rem;padding:.875rem 1.75rem;display:inline-flex}.btn-arrow{transition:transform var(--transition-fast);font-size:1.125rem}.btn-primary:hover .btn-arrow{transform:translate(4px)}.modal-overlay{z-index:1000;background-color:#0009;justify-content:center;align-items:center;padding:2rem;animation:.2s modalFadeIn;display:flex;position:fixed;inset:0}@keyframes modalFadeIn{0%{opacity:0}to{opacity:1}}.modal-content{border-radius:var(--radius-lg);background:#fff;width:100%;max-width:480px;max-height:90vh;animation:.3s slideUp;overflow-y:auto;box-shadow:0 20px 60px #0000004d}@keyframes slideUp{0%{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}.modal-header{border-bottom:1px solid #ececec;justify-content:space-between;align-items:center;padding:1.75rem 2rem 1.25rem;display:flex}.modal-header h2{color:var(--color-primary-dark);margin:0;font-size:1.5rem;font-weight:600}.modal-close{color:var(--color-text-secondary);cursor:pointer;width:32px;height:32px;transition:all var(--transition-fast);background:0 0;border:none;border-radius:6px;justify-content:center;align-items:center;padding:0;font-size:2rem;display:flex}.modal-close:hover{color:var(--color-primary-dark);background-color:#f0f0f0}.modal-body{padding:2rem}.modal-description{color:var(--color-text-secondary);margin-bottom:1.5rem;font-size:1rem;line-height:1.6}.beta-form{flex-direction:column;gap:1.25rem;display:flex}.form-group{flex-direction:column;gap:.5rem;display:flex}.form-group label{font-size:.875rem;font-weight:var(--font-weight-semibold);color:var(--color-primary-dark)}.form-group input,.form-group select{border-radius:var(--radius-md);color:var(--color-text-primary);transition:all var(--transition-fast);background:#fff;border:2px solid #e5e7eb;padding:.875rem 1rem;font-family:inherit;font-size:.9375rem}.form-group input:focus,.form-group select:focus{border-color:var(--color-pink-primary);outline:none;box-shadow:0 0 0 3px #db27771a}.form-group-consent{margin-top:.5rem}.consent-label{cursor:pointer;align-items:flex-start;gap:.75rem;font-weight:400;display:flex}.consent-label input[type=checkbox]{cursor:pointer;width:18px;height:18px;accent-color:var(--color-pink-primary);flex-shrink:0;margin-top:.25rem}.consent-text{color:var(--color-text-secondary);font-size:.875rem;line-height:1.6}.consent-text a{color:var(--color-primary-dark);text-decoration:underline}.btn-submit{color:#fff;cursor:pointer;background:#1e1e28;border:none;border-radius:8px;width:100%;margin-top:.5rem;padding:.875rem 1.75rem;font-size:.9375rem;font-weight:600;transition:all .2s;box-shadow:0 1px 3px #0003}.btn-submit:hover{background:#2a2a36}.modal-success{text-align:center;padding:3rem 2rem}.success-icon-large{background:linear-gradient(135deg,var(--color-purple)0%,var(--color-pink-primary)100%);color:#fff;border-radius:50%;justify-content:center;align-items:center;width:80px;height:80px;margin:0 auto 1.5rem;display:flex}.modal-success h3{color:var(--color-primary-dark);margin-bottom:.75rem;font-size:1.5rem;font-weight:600}.modal-success p{color:var(--color-text-secondary);font-size:1rem}@keyframes fadeInUp{0%{opacity:0;transform:translateY(30px)}to{opacity:1;transform:translateY(0)}}@media (max-width:1023px){.nocode-hero-title{font-size:3.5rem}.nocode-hero-comparison{grid-template-columns:1fr;gap:1.5rem}.comparison-divider{padding:.5rem 0}.vs-badge{width:40px;height:40px;font-size:.75rem}}@media (max-width:809px){.nocode-hero{padding-top:var(--spacing-xl);padding-bottom:var(--spacing-2xl)}.hero-character{display:none}.nocode-hero-title{font-size:2.75rem}.nocode-hero-description{font-size:1rem}.code-body{font-size:.6875rem}.demo-input-wrapper{padding:1.25rem}.demo-input-wrapper h3{font-size:1rem}.demo-input{padding:1rem 2.75rem 1rem 1rem;font-size:1rem}.demo-chip{padding:.375rem .5rem;font-size:.6875rem}}@media (max-width:480px){.nocode-hero-title{font-size:2rem;line-height:1.15}.nocode-hero-badge{text-align:center;flex-wrap:wrap;justify-content:center}.btn-large{padding:.75rem 1.5rem;font-size:.875rem}.nocode-hero-comparison{gap:1rem}.comparison-label{padding:.375rem .75rem;font-size:.75rem}.code-body{padding:.75rem;font-size:.625rem}.code-header{padding:.5rem .75rem}.code-error-banner{padding:.5rem .75rem;font-size:.6875rem}.demo-input-wrapper{padding:1rem}.demo-input-wrapper:before{border-radius:20px;inset:-4px}.demo-input-wrapper h3{margin-bottom:.75rem;font-size:.9375rem}.demo-input{padding:.875rem 2.5rem .875rem .875rem;font-size:.9375rem}.demo-input-hint{width:24px;height:24px;font-size:.75rem;right:.5rem}.demo-suggestions{gap:.375rem}.demo-chip{padding:.375rem .5rem;font-size:.625rem}.vs-badge{width:36px;height:36px;font-size:.6875rem}}
.how-it-works{background-color:#fff}.hiw-header{text-align:center;max-width:720px;margin:0 auto var(--spacing-3xl)}.hiw-title{font-size:3rem;font-weight:var(--font-weight-black);color:var(--color-primary-dark);margin-bottom:var(--spacing-md);letter-spacing:-.02em;line-height:1.1}.hiw-description{color:var(--color-text-secondary);font-size:1.125rem;line-height:1.6}.hiw-steps{gap:var(--spacing-xl);grid-template-columns:repeat(3,1fr);display:grid}.hiw-step{gap:var(--spacing-md);flex-direction:column;display:flex}.hiw-illustration{border-radius:var(--radius-lg);width:100%;margin-bottom:var(--spacing-md);background-color:#f0f0f0;border:2px solid #0000001a;overflow:hidden;box-shadow:0 4px 12px #00000014}.hiw-illustration-image{width:100%;height:auto;display:block}.hiw-content{flex-direction:column;gap:.5rem;display:flex}.hiw-step-title{font-size:1.25rem;font-weight:var(--font-weight-bold);color:var(--color-primary-dark);margin-top:var(--spacing-sm);align-items:center;gap:.5rem;display:flex}.step-number{font-size:1.25rem;font-weight:var(--font-weight-bold);color:var(--color-primary-dark);margin-right:.5rem}.hiw-step-description{color:var(--color-text-secondary);font-size:.9375rem;line-height:1.6}@media (max-width:1023px){.hiw-title{font-size:2.5rem}.hiw-steps{gap:var(--spacing-2xl);grid-template-columns:1fr}}@media (max-width:809px){.hiw-title{font-size:2rem}.hiw-description{font-size:1rem}.hiw-step-title{font-size:1.125rem}.hiw-step-description{font-size:.875rem}}@media (max-width:480px){.hiw-title{font-size:1.75rem}}
.use-cases{background-color:#fff}.use-cases-header{text-align:center;max-width:720px;margin:0 auto var(--spacing-3xl)}.use-cases-title{font-size:3rem;font-weight:var(--font-weight-black);color:var(--color-primary-dark);margin-bottom:var(--spacing-md);letter-spacing:-.02em;line-height:1.1}.use-cases-description{color:var(--color-text-secondary);font-size:1.125rem;line-height:1.6}.use-cases-grid{gap:var(--spacing-xl);grid-template-columns:repeat(2,1fr);max-width:1000px;margin:0 auto;display:grid}.workflow-card{padding:var(--spacing-lg);border:1px solid var(--color-bg-light-gray);border-radius:var(--radius-lg);transition:all var(--transition-normal);background-color:#fff;flex-direction:column;display:flex}.workflow-card:hover{border-color:var(--color-pink-primary);transform:translateY(-4px);box-shadow:0 8px 24px #db27771a}.workflow-illustration{border-radius:var(--radius-md);width:100%;margin-bottom:var(--spacing-md);background-color:#f8f8f8;overflow:hidden}.workflow-illustration-image{width:100%;height:auto;display:block}.workflow-title{font-size:1.25rem;font-weight:var(--font-weight-bold);color:var(--color-primary-dark);margin-bottom:var(--spacing-sm)}.workflow-description{color:var(--color-text-secondary);margin-bottom:var(--spacing-md);flex:1;font-size:.9375rem;line-height:1.6}.workflow-benefit{color:var(--color-pink-primary);font-size:.875rem;font-weight:var(--font-weight-medium);margin-bottom:var(--spacing-md);align-items:flex-start;gap:.5rem;line-height:1.4;display:flex}.benefit-icon{background:linear-gradient(135deg,var(--color-purple)0%,var(--color-pink-primary)100%);color:#fff;border-radius:50%;flex-shrink:0;justify-content:center;align-items:center;width:20px;height:20px;display:flex}.workflow-cta{border-radius:var(--radius-md);width:100%;font-size:.9375rem;font-weight:var(--font-weight-semibold);color:#fff;cursor:pointer;transition:all var(--transition-fast);background:linear-gradient(#1e1e28 0%,#141317 100%);border:1px solid #303038;justify-content:center;align-items:center;gap:.5rem;padding:.75rem 1.25rem;display:flex;box-shadow:0 1px 4px #00000040}.workflow-cta:hover{background:linear-gradient(#282832 0%,#1e1d21 100%)}.cta-arrow{transition:transform var(--transition-fast)}.workflow-cta:hover .cta-arrow{transform:translate(4px)}@media (max-width:1023px){.use-cases-title{font-size:2.5rem}}@media (max-width:809px){.use-cases-title{font-size:2rem}.use-cases-description{font-size:1rem}.use-cases-grid{grid-template-columns:1fr}}@media (max-width:480px){.use-cases-title{font-size:1.75rem}.use-cases-description{font-size:.9375rem}.workflow-card{padding:var(--spacing-md)}.workflow-title{font-size:1.125rem}.workflow-description{font-size:.875rem}.workflow-benefit{font-size:.8125rem}}
