@import url('https://fonts.googleapis.com/css2?family=Raleway:wght@200;300;400;500;600&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Outfit:wght@200;300;400&display=swap');
:root{--bg:#092b44;--text:#fff;--text-secondary:rgba(255,255,255,0.6);--accent:#00D4FF}
*{margin:0;padding:0;box-sizing:border-box;font-weight:300}
body{font-family:'Raleway',sans-serif;background:var(--bg);color:var(--text);min-height:100vh;display:grid;grid-template-rows:auto 1fr;overflow-x:hidden;background:radial-gradient(circle at 0% 0%,rgba(0,212,255,0.08) 0%,transparent 50%),radial-gradient(circle at 100% 0%,rgba(255,255,255,0.08) 0%,transparent 50%),radial-gradient(circle at 100% 100%,rgba(0,212,255,0.08) 0%,transparent 50%),radial-gradient(circle at 0% 100%,rgba(255,255,255,0.08) 0%,transparent 50%),#092b44;background-attachment:fixed;position:relative}
::-webkit-scrollbar{width:8px;height:8px}
::-webkit-scrollbar-track{background:rgba(255,255,255,0.05);border-radius:4px}
::-webkit-scrollbar-thumb{background:rgba(255,255,255,0.1);border-radius:4px;transition:background 0.3s}
::-webkit-scrollbar-thumb:hover{background:rgba(0,212,255,0.2)}
body::before {content: '';position: fixed;inset: 0;background: url("data:image/svg+xml,%3Csvg width='800' height='800' viewBox='0 0 800 800' xmlns='http://www.w3.org/2000/svg'%3E%3Cg fill='none' fill-rule='evenodd'%3E%3Ccircle stroke='rgba(255,255,255,0.05)' stroke-width='1' cx='400' cy='400' r='150'/%3E%3Ccircle stroke='rgba(255,255,255,0.05)' stroke-width='1' cx='400' cy='400' r='250'/%3E%3Ccircle stroke='rgba(255,255,255,0.05)' stroke-width='1' cx='400' cy='400' r='350'/%3E%3C/g%3E%3C/svg%3E") center/cover no-repeat,
url("data:image/svg+xml,%3Csvg width='60' height='60' viewBox='0 0 60 60' xmlns='http://www.w3.org/2000/svg'%3E%3Cg fill='none' fill-rule='evenodd'%3E%3Cpath stroke='rgba(255,255,255,0.03)' stroke-width='1' d='M30 0v60M0 30h60'/%3E%3C/g%3E%3C/svg%3E") center/60px 60px repeat;opacity: 0.5;pointer-events: none;
}
.header{position:fixed;top:0;left:0;right:0;z-index:100;padding:20px 40px;display:flex;justify-content:space-between;align-items:center;background:rgb(0 0 0 / 16%);backdrop-filter:blur(20px);transition:transform 0.3s ease}
.brand{display:flex;align-items:center;gap:40px;width:100%}
.logo{height:35px;transition:opacity 0.3s}
.logo:hover{opacity:1}
.title{font-size:19px;font-weight:300;color:var(--text-secondary);margin-left:auto}
.main{padding:40px 20px;padding-bottom:0}
.footer{background:rgb(0 0 0 / 8%);backdrop-filter:blur(10px);padding:50px 0;margin-top:20px}
.footer-content{max-width:1000px;margin:0 auto;padding:0 20px;display:flex;flex-direction:column;align-items:center;gap:20px}
.footer-logo{height:18px;opacity:0.5;transition:opacity 0.2s}
.footer-logo:hover{opacity:0.8}
.footer-logo img{height:100%;width:auto}
.footer-links{display:flex;gap:20px;flex-wrap:wrap;justify-content:center}
.footer-links a{color:var(--text);text-decoration:none;opacity:0.5;transition:opacity 0.2s;font-size:14px}
.footer-links a:hover{opacity:0.8}
.footer-copyright{color:var(--text);opacity:0.3;font-size:13px;text-align:center}
.scroll-top{position:fixed;bottom:30px;right:30px;width:40px;height:40px;background:var(--accent);border:none;border-radius:8px;color:var(--bg);cursor:pointer;display:flex;align-items:center;justify-content:center;opacity:0;visibility:hidden;transform:translateY(20px);transition:all 0.3s ease;z-index:999;box-shadow:0 4px 16px rgba(0,0,0,0.2)}
.scroll-top.visible{opacity:1;visibility:visible;transform:translateY(0)}
.scroll-top:hover{transform:translateY(-5px);box-shadow:0 6px 20px rgba(0,212,255,0.3)}
.scroll-top i{font-size:16px}
.info-bar,.gallery-controls,.media-box{font-family:'Outfit',sans-serif;font-weight:200}
.title-section .media-title,.media-info{font-family:'Outfit',sans-serif}
input,select,textarea,button{font-family:'Outfit',sans-serif!important}
@media (max-width: 768px) {
    .header{padding:15px 20px}
    .brand{gap:20px}
    .logo{height:26px}
    .title{font-size:15px}
    .main{padding:30px 15px}
    .footer{padding:30px 0;}
    .footer-links{gap:16px}
    .footer-links a{font-size:13px}
    .scroll-top{bottom:20px;right:20px;width:36px;height:36px}    
}