/* VF555 - Compressed CSS for Mobile-First SEO Optimized Website */
*{margin:0;padding:0;box-sizing:border-box}body{font-family:'Segoe UI',Tahoma,Geneva,Verdana,sans-serif;line-height:1.6;color:#333;background:#f8f9fa}img{max-width:100%;height:auto;display:block}a{text-decoration:none;color:inherit}ul{list-style:none}.container{max-width:1200px;margin:0 auto;padding:0 15px}

/* Header */
.header{background:linear-gradient(135deg,#ff6b35,#f7931e);padding:10px 0;position:sticky;top:0;z-index:1000;box-shadow:0 2px 10px rgba(0,0,0,0.1)}.header .container{display:flex;justify-content:space-between;align-items:center}.logo{height:50px;width:auto}.nav{display:flex;gap:20px}.nav a{color:#fff;font-weight:600;padding:8px 16px;border-radius:25px;transition:all 0.3s}.nav a:hover,.nav a.active{background:rgba(255,255,255,0.2);transform:translateY(-2px)}.mobile-menu{display:none;background:none;border:none;color:#fff;font-size:24px;cursor:pointer}

/* Floating Buttons */
.floating-buttons{position:fixed;bottom:20px;right:20px;z-index:999;display:flex;flex-direction:column;gap:10px}.floating-btn{background:linear-gradient(45deg,#ff6b35,#f7931e);color:#fff;border:none;padding:12px 20px;border-radius:50px;font-weight:bold;cursor:pointer;box-shadow:0 4px 15px rgba(255,107,53,0.4);animation:pulse 2s infinite;transition:all 0.3s}.floating-btn:hover{transform:scale(1.05);box-shadow:0 6px 20px rgba(255,107,53,0.6)}@keyframes pulse{0%,100%{transform:scale(1)}50%{transform:scale(1.05)}}

/* Hero Section */
.hero{background:linear-gradient(135deg,#667eea 0%,#764ba2 100%);color:#fff;padding:60px 0;text-align:center}.hero h1{font-size:2.5rem;margin-bottom:20px;text-shadow:2px 2px 4px rgba(0,0,0,0.3)}.hero p{font-size:1.2rem;margin-bottom:30px;opacity:0.9}.cta-btn{background:linear-gradient(45deg,#ff6b35,#f7931e);color:#fff;padding:15px 30px;border:none;border-radius:50px;font-size:1.1rem;font-weight:bold;cursor:pointer;transition:all 0.3s;box-shadow:0 4px 15px rgba(255,107,53,0.3)}.cta-btn:hover{transform:translateY(-3px);box-shadow:0 6px 20px rgba(255,107,53,0.5)}

/* Content Sections */
.section{padding:60px 0}.section-title{font-size:2rem;text-align:center;margin-bottom:40px;color:#333;position:relative}.section-title::after{content:'';position:absolute;bottom:-10px;left:50%;transform:translateX(-50%);width:60px;height:3px;background:linear-gradient(45deg,#ff6b35,#f7931e)}

/* Article Layout */
.article{background:#fff;border-radius:15px;box-shadow:0 5px 20px rgba(0,0,0,0.1);margin-bottom:30px;overflow:hidden}.article-header{padding:30px;background:linear-gradient(135deg,#667eea,#764ba2);color:#fff}.article-title{font-size:2rem;margin-bottom:15px;line-height:1.3}.article-meta{opacity:0.9;font-size:0.9rem}.article-content{padding:30px}.article-nav{background:#f8f9fa;padding:20px;border-radius:10px;margin-bottom:30px}.article-nav h3{margin-bottom:15px;color:#333}.article-nav ul{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:10px}.article-nav a{color:#666;padding:8px 12px;border-radius:5px;transition:all 0.3s}.article-nav a:hover{background:#e9ecef;color:#ff6b35}

/* Content Typography */
.content h2{font-size:1.8rem;margin:30px 0 20px;color:#333;border-left:4px solid #ff6b35;padding-left:15px}.content h3{font-size:1.4rem;margin:25px 0 15px;color:#444}.content p{margin-bottom:20px;line-height:1.8;color:#555}.content ul,.content ol{margin:20px 0;padding-left:30px}.content li{margin-bottom:10px;line-height:1.6}.highlight{background:linear-gradient(120deg,#a8edea 0%,#fed6e3 100%);padding:20px;border-radius:10px;margin:20px 0;border-left:4px solid #ff6b35}

/* Image Gallery */
.image-gallery{display:grid;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));gap:20px;margin:30px 0}.gallery-item{border-radius:10px;overflow:hidden;box-shadow:0 5px 15px rgba(0,0,0,0.1);transition:transform 0.3s}.gallery-item:hover{transform:translateY(-5px)}.gallery-item img{width:100%;height:200px;object-fit:cover}

/* Comments Section */
.comments{background:#f8f9fa;padding:30px;border-radius:15px;margin-top:40px}.comments-title{font-size:1.5rem;margin-bottom:25px;color:#333}.comment{background:#fff;padding:20px;border-radius:10px;margin-bottom:20px;box-shadow:0 2px 10px rgba(0,0,0,0.05)}.comment-author{font-weight:bold;color:#ff6b35;margin-bottom:5px}.comment-date{font-size:0.9rem;color:#666;margin-bottom:10px}.comment-text{line-height:1.6;color:#555}.rating{display:flex;gap:2px;margin-bottom:10px}.star{color:#ffc107;font-size:1.2rem}

/* Cards Grid */
.cards-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:30px;margin:40px 0}.card{background:#fff;border-radius:15px;overflow:hidden;box-shadow:0 5px 20px rgba(0,0,0,0.1);transition:all 0.3s}.card:hover{transform:translateY(-10px);box-shadow:0 15px 40px rgba(0,0,0,0.15)}.card-image{height:200px;background:linear-gradient(45deg,#667eea,#764ba2);position:relative}.card-content{padding:25px}.card-title{font-size:1.3rem;margin-bottom:15px;color:#333}.card-text{color:#666;line-height:1.6;margin-bottom:20px}.card-link{color:#ff6b35;font-weight:600;transition:color 0.3s}.card-link:hover{color:#e55a2b}

/* Footer */
.footer{background:#333;color:#fff;padding:40px 0;text-align:center}.footer-content{display:grid;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));gap:30px;margin-bottom:30px}.footer-section h3{margin-bottom:20px;color:#ff6b35}.footer-section a{color:#ccc;transition:color 0.3s}.footer-section a:hover{color:#ff6b35}.social-links{display:flex;justify-content:center;gap:20px;margin-top:20px}.social-link{display:inline-block;padding:10px;background:#555;border-radius:50%;transition:all 0.3s}.social-link:hover{background:#ff6b35;transform:translateY(-3px)}.copyright{border-top:1px solid #555;padding-top:20px;margin-top:30px;opacity:0.8}

/* Mobile Navigation */
.nav.mobile-open{display:flex;flex-direction:column;position:absolute;top:100%;left:0;right:0;background:#fff;box-shadow:0 4px 10px rgba(0,0,0,0.1);z-index:999;padding:20px}.nav.mobile-open a{color:#333;padding:15px 20px;border-bottom:1px solid #eee;margin:0}.nav.mobile-open a:hover{background:#f8f9fa;color:#ff6b35}

/* Responsive Design */
@media (max-width:768px){.header .container{position:relative}.nav{display:none}.nav.mobile-open{display:flex}.mobile-menu{display:block}.hero h1{font-size:2rem}.hero p{font-size:1rem}.section-title{font-size:1.5rem}.article-title{font-size:1.5rem}.content h2{font-size:1.4rem}.floating-buttons{bottom:15px;right:15px}.floating-btn{padding:10px 16px;font-size:0.9rem}.cards-grid{grid-template-columns:1fr}.image-gallery{grid-template-columns:repeat(auto-fit,minmax(200px,1fr))}.article-nav ul{grid-template-columns:1fr}}

/* SEO Optimizations */
.breadcrumb{padding:15px 0;font-size:0.9rem;color:#666}.breadcrumb a{color:#ff6b35}.schema-markup{display:none}.skip-link{position:absolute;top:-40px;left:6px;background:#ff6b35;color:#fff;padding:8px;border-radius:4px;transition:top 0.3s}.skip-link:focus{top:6px}

/* Performance Optimizations */
.lazy{opacity:0;transition:opacity 0.3s}.lazy.loaded{opacity:1}.preload{position:relative;overflow:hidden}.preload::after{content:'';position:absolute;top:0;left:-100%;width:100%;height:100%;background:linear-gradient(90deg,transparent,rgba(255,255,255,0.4),transparent);animation:loading 1.5s infinite}@keyframes loading{0%{left:-100%}100%{left:100%}}
