.ai-blog-container{width:100%;min-height:100vh}.blog-header{background:linear-gradient(135deg,var(--primary-color) 0,#0f2a3e 100%);color:white;padding:80px 20px;text-align:center}.blog-header h1{font-size:2.5rem;font-weight:800;margin-bottom:15px;letter-spacing:-1px}.blog-header p{font-size:1.1rem;opacity:.9;max-width:600px;margin:0 auto}.blog-content{padding:60px 20px;background-color:var(--light-bg)}.blog-wrapper{max-width:1200px;margin:0 auto;display:grid;grid-template-columns:1fr 1.5fr;grid-gap:40px;gap:40px}.input-section{background:white;padding:30px;border-radius:12px;box-shadow:0 5px 15px rgba(0,0,0,.08);height:-moz-fit-content;height:fit-content}.input-section label{display:block;font-weight:600;color:var(--primary-color);margin-bottom:15px;font-size:1rem}.title-input{width:100%;padding:15px 20px;border:2px solid var(--border-color);border-radius:8px;font-size:1rem;transition:border-color .3s ease;margin-bottom:15px}.title-input:focus{outline:none;border-color:var(--accent-color);box-shadow:0 0 0 3px rgba(89,174,60,.1)}.title-input:disabled{background-color:#f5f5f5;cursor:not-allowed}.error-message{color:#e74c3c;font-size:.9rem;margin-bottom:15px;padding:10px;background-color:#fee;border-radius:6px;border-left:3px solid #e74c3c}.input-buttons{display:flex;gap:15px;flex-wrap:wrap}.input-buttons .btn{flex:1 1;min-width:120px}.input-buttons .btn:disabled{opacity:.6;cursor:not-allowed}.output-section{background:white;padding:30px;border-radius:12px;box-shadow:0 5px 15px rgba(0,0,0,.08);display:flex;flex-direction:column;min-height:500px}.output-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:20px;padding-bottom:15px;border-bottom:2px solid var(--border-color)}.output-header h2{color:var(--primary-color);font-size:1.3rem;margin:0}.output-actions{display:flex;gap:10px}.btn-small{padding:8px 16px;font-size:.85rem;border-radius:6px;border:2px solid var(--accent-color);background:white;color:var(--accent-color);cursor:pointer;transition:all .3s ease;font-weight:600}.btn-small:hover{background:var(--accent-color);color:white}.output-content{flex:1 1;overflow-y:auto;min-height:400px}.loading-state{display:flex;flex-direction:column;align-items:center;justify-content:center;height:400px;color:#666}.spinner{width:50px;height:50px;border:4px solid var(--border-color);border-top-color:var(--accent-color);border-radius:50%;animation:spin 1s linear infinite;margin-bottom:20px}@keyframes spin{to{transform:rotate(1turn)}}.empty-state{display:flex;flex-direction:column;align-items:center;justify-content:center;height:400px;color:#999;text-align:center}.empty-icon{font-size:4rem;margin-bottom:20px;opacity:.5}.empty-state p{font-size:1rem;max-width:400px}.blog-preview{width:100%;max-width:100%}.blog-content-display{font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,Fira Sans,Droid Sans,Helvetica Neue,sans-serif;font-size:1rem;line-height:1.8;color:#333;padding:30px;background:#ffffff;border-radius:8px;border:1px solid #e0e0e0;max-height:600px;overflow-y:auto;box-shadow:0 2px 8px rgba(0,0,0,.05)}.blog-content-display h1{font-size:2rem;font-weight:700;color:var(--primary-color);margin:30px 0 20px;padding-bottom:10px;border-bottom:3px solid var(--accent-color);line-height:1.3}.blog-content-display h1:first-child{margin-top:0}.blog-content-display h2{font-size:1.6rem;font-weight:600;color:var(--primary-color);margin:25px 0 15px;padding-top:10px;line-height:1.4}.blog-content-display h3{font-size:1.3rem;font-weight:600;color:#2c3e50;margin:20px 0 12px;line-height:1.4}.blog-content-display p{margin:15px 0;color:#444;line-height:1.8;text-align:left}.blog-content-display p:first-of-type{font-size:1.1rem;color:#555;font-weight:400}.blog-content-display ol,.blog-content-display ul{margin:15px 0;padding-left:30px;color:#444}.blog-content-display li{margin:8px 0;line-height:1.7;color:#555}.blog-content-display ul li{list-style-type:disc}.blog-content-display ol li{list-style-type:decimal}.blog-content-display strong{font-weight:600;color:#2c3e50}.blog-content-display em{font-style:italic;color:#555}.blog-content-display code{background:#f4f4f4;padding:2px 6px;border-radius:4px;font-family:Courier New,monospace;font-size:.9em;color:#e74c3c}.blog-content-display pre{background:#2d2d2d;color:#f8f8f2;padding:15px;border-radius:6px;overflow-x:auto;margin:15px 0;font-family:Courier New,monospace;font-size:.9rem;line-height:1.5}.blog-content-display blockquote{border-left:4px solid var(--accent-color);margin:20px 0;color:#666;font-style:italic;background:#f9f9f9;padding:15px 20px;border-radius:4px}.blog-content-display a{color:var(--accent-color);text-decoration:none;border-bottom:1px solid transparent;transition:border-color .3s ease}.blog-content-display a:hover{border-bottom-color:var(--accent-color)}.blog-content-display::-webkit-scrollbar{width:8px}.blog-content-display::-webkit-scrollbar-track{background:#f1f1f1;border-radius:4px}.blog-content-display::-webkit-scrollbar-thumb{background:var(--accent-color);border-radius:4px}.blog-content-display::-webkit-scrollbar-thumb:hover{background:#4a8a2e}.blog-features{padding:80px 20px;background:white}.blog-features h2{font-size:2rem;text-align:center;color:var(--primary-color);margin-bottom:50px}.features-list-blog{max-width:1000px;margin:0 auto;display:grid;grid-gap:30px;gap:30px}.feature-item{display:flex;gap:25px;align-items:flex-start;padding:25px;background:var(--light-bg);border-radius:10px;transition:all .3s ease;border-left:4px solid transparent}.feature-item:hover{border-left-color:var(--accent-color);transform:translateX(5px)}.feature-number{min-width:50px;width:50px;height:50px;background:var(--accent-color);color:white;border-radius:50%;display:flex;align-items:center;justify-content:center;font-weight:700;font-size:1.3rem}.feature-item h3{color:var(--primary-color);font-size:1.1rem;margin-bottom:8px}.feature-item p{color:#666;line-height:1.6;font-size:.95rem}.blog-tips{padding:80px 20px;background:var(--light-bg)}.blog-tips h2{font-size:2rem;text-align:center;color:var(--primary-color);margin-bottom:50px}.tips-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));grid-gap:25px;gap:25px;max-width:1000px;margin:0 auto}.tip-card{background:white;padding:30px;border-radius:10px;box-shadow:0 5px 15px rgba(0,0,0,.08);transition:all .3s ease;border-top:4px solid var(--accent-color)}.tip-card:hover{transform:translateY(-5px);box-shadow:0 15px 30px rgba(89,174,60,.2)}.tip-card h3{color:var(--primary-color);font-size:1.1rem;margin-bottom:12px}.tip-card p{color:#666;line-height:1.6;font-size:.9rem}@media (max-width:968px){.blog-wrapper{grid-template-columns:1fr;gap:30px}.output-section{min-height:400px}.blog-header h1{font-size:2rem}}@media (max-width:768px){.blog-header{padding:50px 20px}.blog-header h1{font-size:1.8rem}.blog-header p{font-size:.95rem}.blog-content,.blog-features,.blog-tips{padding:40px 20px}.input-section,.output-section{padding:20px}.output-content{min-height:300px}.empty-state,.loading-state{height:300px}.input-buttons{flex-direction:column}.input-buttons .btn{width:100%}.output-header{flex-direction:column;align-items:flex-start;gap:15px}.output-actions{width:100%;justify-content:flex-end}.feature-item{gap:15px;padding:20px}.tips-grid{grid-template-columns:1fr}}@media (max-width:480px){.blog-header h1{font-size:1.3rem}.blog-header p{font-size:.85rem}.blog-features h2,.blog-tips h2{font-size:1.3rem}.blog-content-display{padding:15px;font-size:.9rem}.blog-content-display h1{font-size:1.5rem}.blog-content-display h2{font-size:1.3rem}.blog-content-display h3{font-size:1.1rem}.feature-item{flex-direction:column;text-align:center}.feature-number{margin:0 auto}}