.header{background:linear-gradient(90deg,#1a365d,#2a4365);padding:1rem 0;position:fixed;width:100%;top:0;z-index:1000;box-shadow:0 2px 10px rgba(0,0,0,.1)}.nav{max-width:1200px;margin:0 auto;padding:0 2rem;justify-content:space-between}.brand-container,.nav{display:flex;align-items:center}.brand-container{gap:12px;text-decoration:none;transition:opacity .2s}.brand-container:hover{opacity:.9}.logo-image{height:40px;width:auto;object-fit:contain}.brand-text{font-size:28px;font-weight:700;color:white;letter-spacing:.5px;text-transform:uppercase;background:linear-gradient(45deg,#ffffff,#e0e0e0);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;text-shadow:2px 2px 4px rgba(0,0,0,.2)}.brand-container:hover .brand-text{background:linear-gradient(45deg,#ffffff,#f5f5f5);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent}.nav-buttons{display:flex;gap:1rem}.btn{padding:.75rem 1.5rem;border:none;border-radius:8px;font-weight:600;cursor:pointer;transition:all .3s ease;text-decoration:none;display:inline-block;font-size:.9rem}.btn-outline{background:transparent;color:white;border:2px solid rgba(255,255,255,.3)}.btn-outline:hover{background:rgba(255,255,255,.1);border-color:white}.btn-primary{background:#f59e0b;color:white}.btn-primary:hover{background:#d97706;transform:translateY(-2px)}.hero{background:linear-gradient(135deg,#1e3a8a,#3b82f6 50%,#06b6d4);padding:8rem 2rem 6rem;text-align:center;color:white;position:relative;overflow:hidden}.hero:before{content:"";position:absolute;width:200%;height:200%;background:url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 100 100"><circle cx="20" cy="20" r="2" fill="white" opacity="0.1"/><circle cx="80" cy="80" r="1" fill="white" opacity="0.1"/><circle cx="40" cy="60" r="1.5" fill="white" opacity="0.05"/></svg>');animation:float 20s linear infinite}.hero-content{max-width:800px;margin:0 auto;position:relative;z-index:2}.hero h1{font-size:3.5rem;font-weight:800;margin-bottom:1.5rem;background:linear-gradient(45deg,#fff,#e0e7ff);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}.hero p{font-size:1.25rem;margin-bottom:2.5rem;opacity:.9}.hero-cta{display:flex;gap:1rem;justify-content:center;flex-wrap:wrap}.btn-hero{padding:1rem 2rem;font-size:1.1rem;border-radius:12px}.btn-secondary{background:rgba(255,255,255,.2);color:white;border:2px solid rgba(255,255,255,.3)}.btn-secondary:hover{background:rgba(255,255,255,.3)}.features{padding:6rem 2rem;background:#f8fafc}.container{max-width:1200px;margin:0 auto}.section-title{text-align:center;font-size:2.5rem;font-weight:700;margin-bottom:1rem;color:#1e293b}.section-subtitle{text-align:center;font-size:1.1rem;color:#64748b;margin-bottom:4rem}.features-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:2rem}.feature-card{background:white;padding:2rem;border-radius:16px;box-shadow:0 4px 6px rgba(0,0,0,.05);transition:all .3s ease;border:1px solid #e2e8f0;opacity:0;transform:translateY(30px)}.feature-card:hover{transform:translateY(-5px);box-shadow:0 10px 25px rgba(0,0,0,.1)}.feature-icon{width:60px;height:60px;background:linear-gradient(45deg,#3b82f6,#1d4ed8);border-radius:12px;display:flex;align-items:center;justify-content:center;margin-bottom:1.5rem;font-size:1.5rem}.feature-card h3{font-size:1.25rem;font-weight:600;margin-bottom:1rem;color:#1e293b}.feature-card p{color:#64748b}.demo{padding:6rem 2rem;background:linear-gradient(135deg,#667eea,#764ba2);min-height:100vh;display:flex;justify-content:center;align-items:center}.album-container{max-width:900px;width:100%;background:rgba(255,255,255,.95);backdrop-filter:blur(20px);border-radius:24px;box-shadow:0 30px 60px rgba(0,0,0,.15);padding:40px;position:relative;overflow:hidden}.album-container:before{content:"";position:absolute;top:0;left:0;right:0;bottom:0;background:url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 100 100"><defs><pattern id="grain" width="100" height="100" patternUnits="userSpaceOnUse"><circle cx="25" cy="25" r="1" fill="%23000" opacity="0.02"/><circle cx="75" cy="75" r="1" fill="%23000" opacity="0.02"/><circle cx="50" cy="10" r="0.5" fill="%23000" opacity="0.01"/><circle cx="20" cy="80" r="0.5" fill="%23000" opacity="0.01"/></pattern></defs><rect width="100" height="100" fill="url(%23grain)"/></svg>');pointer-events:none}.photo-viewer{position:relative;width:100%;height:500px;margin:30px 0;border-radius:20px;overflow:hidden;box-shadow:0 15px 35px rgba(0,0,0,.1);background:linear-gradient(45deg,#f0f2f5,#ffffff)}.photo-container{width:100%;height:100%;display:flex;align-items:center;justify-content:center;position:relative;background:radial-gradient(circle at 20% 80%,rgba(120,119,198,.1) 0,transparent 50%),radial-gradient(circle at 80% 20%,rgba(255,255,255,.8) 0,transparent 50%),radial-gradient(circle at 40% 40%,rgba(102,126,234,.05) 0,transparent 50%)}.demo-image{width:100%;height:100%;object-fit:contain;transition:opacity .3s ease}.nav-button{position:absolute;top:50%;transform:translateY(-50%);background:rgba(255,255,255,.2);backdrop-filter:blur(10px);border:none;width:50px;height:50px;border-radius:50%;cursor:pointer;display:flex;align-items:center;justify-content:center;font-size:20px;color:#333;transition:all .3s ease;box-shadow:0 4px 15px rgba(0,0,0,.1)}.nav-button:hover{transform:translateY(-50%) scale(1.1);box-shadow:0 6px 20px rgba(0,0,0,.15)}.nav-prev{left:20px}.nav-next{right:20px}.pagination{display:flex;justify-content:center;align-items:center;gap:12px;margin-top:30px}.page-indicator{width:12px;height:12px;border-radius:50%;background:rgba(102,126,234,.3);cursor:pointer;transition:all .3s ease}.page-indicator.active{background:linear-gradient(45deg,#667eea,#764ba2);transform:scale(1.3);box-shadow:0 2px 8px rgba(102,126,234,.4)}.page-indicator:hover{background:rgba(102,126,234,.6);transform:scale(1.2)}.thumbnails{display:flex;justify-content:center;gap:15px;margin-top:25px;padding:20px;background:rgba(0,0,0,.02);border-radius:16px;backdrop-filter:blur(10px)}.thumbnail{width:80px;height:60px;border-radius:6px;overflow:hidden;cursor:pointer;transition:all .3s ease;opacity:.7}.thumbnail:hover{opacity:.9}.thumbnail.active{opacity:1;box-shadow:0 0 0 2px #667eea}.thumbnail-image{width:100%;height:100%;object-fit:cover}.spiral-logo{width:200px;height:200px;opacity:.8;filter:drop-shadow(0 10px 20px rgba(0,0,0,.1));transition:all .3s ease}.spiral-logo:hover{transform:rotate(10deg) scale(1.05);opacity:1}.counter{position:absolute;top:20px;right:80px;background:rgba(0,0,0,.7);color:white;padding:8px 16px;border-radius:20px;font-size:14px;font-weight:500}.floating-shapes{position:absolute;width:100%;height:100%;overflow:hidden;pointer-events:none}.shape{position:absolute;opacity:.1;animation:float 6s ease-in-out infinite}.shape:first-child{top:10%;left:10%;width:60px;height:60px;background:linear-gradient(45deg,#667eea,#764ba2);border-radius:50%;animation-delay:0s}.shape:nth-child(2){top:70%;right:15%;width:40px;height:40px;background:linear-gradient(45deg,#764ba2,#667eea);border-radius:30%;animation-delay:2s}.shape:nth-child(3){bottom:20%;left:20%;width:80px;height:30px;background:linear-gradient(45deg,#667eea,#764ba2);border-radius:50px;animation-delay:4s}@keyframes float{0%,to{transform:translateY(0) rotate(0deg)}50%{transform:translateY(-20px) rotate(180deg)}}@media (max-width:768px){.album-container{padding:20px;margin:10px}.photo-viewer{height:400px}.spiral-logo{width:150px;height:150px}.thumbnails{gap:10px}.thumbnail{width:50px;height:50px}}.footer{background:#0f172a;color:white;padding:3rem 2rem 1rem}.footer-content{max-width:1200px;margin:0 auto;display:grid;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));gap:2rem}.footer-section h3{font-size:1.1rem;margin-bottom:1rem;font-weight:600}.footer-section a{color:#94a3b8;text-decoration:none;display:block;margin-bottom:.5rem;transition:color .3s ease}.footer-section a:hover{color:white}.footer-bottom{border-top:1px solid #334155;margin-top:2rem;padding-top:1rem;text-align:center;color:#64748b}@media (max-width:768px){.hero h1{font-size:2.5rem}.hero-cta{flex-direction:column;align-items:center}.demo-content{grid-template-columns:1fr;text-align:center}.nav{padding:0 1rem}.nav-buttons{flex-direction:column;gap:.5rem}}