/* Luxury Aviation Theme: Dark Navy + Gold Highlights with responsive/mobile styles and animations */ 
:root{
    --navy: #07132a;
    --navy-2: #0e2640;
    --gold: #d4af37;
    --gold-dark: #b2862c;
    --white: #ffffff;
    --muted: #b9c4d6;
    --glass: rgba(255,255,255,0.03);
}

*{box-sizing:border-box}
body{
    margin:0;
    font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
    background: linear-gradient(180deg,var(--navy),#041022);
    color:var(--white);
    -webkit-font-smoothing:antialiased;
    -moz-osx-font-smoothing:grayscale;
    line-height:1.5;
}

/* Container */
.container{width:92%;max-width:1200px;margin:0 auto;}

/* Header */
.header{background:var(--navy-2);border-bottom:3px solid var(--gold);position:sticky;top:0;z-index:50;}
.nav-wrapper{display:flex;align-items:center;justify-content:space-between;padding:14px 0;}
.logo-area{display:flex;align-items:center;gap:12px;}
.logo{width:56px;height:auto;border-radius:6px;border:2px solid rgba(212,175,55,0.12);background:var(--white);padding:4px;}
.brand{color:var(--gold);font-weight:700;font-size:1.15rem;letter-spacing:0.4px}

/* Nav */
.nav{display:flex;gap:18px;align-items:center;}
.nav a{color:var(--white);text-decoration:none;padding:8px 12px;border-radius:6px;font-weight:600;opacity:0.95}
.nav a:hover{color:var(--navy);background:var(--gold);box-shadow:0 6px 20px rgba(0,0,0,0.45)}

/* Mobile nav toggle */
.nav-toggle{display:none;background:none;border:0;cursor:pointer;padding:8px;border-radius:6px}
.nav-toggle span{display:block;width:26px;height:3px;background:var(--gold);margin:5px 0;border-radius:3px;transition:all .25s}

/* Hero */
.hero{padding:48px 0;display:grid;grid-template-columns:1fr 1fr;gap:30px;align-items:center}
.hero-text h2{font-size:2.1rem;color:var(--gold);margin:0 0 12px}
.hero-text p{color:var(--muted);margin:0 0 18px}
.hero-img img{width:100%;border-radius:12px;border:3px solid rgba(212,175,55,0.12);display:block}

/* Buttons */
.btn-primary{background:var(--gold);color:var(--navy);padding:12px 22px;border-radius:8px;text-decoration:none;font-weight:800;display:inline-block;box-shadow:0 6px 18px rgba(13,20,30,0.6);transition:transform .18s,box-shadow .18s}
.btn-primary:hover{transform:translateY(-3px);box-shadow:0 18px 40px rgba(13,20,30,0.6)}

/* Sections */
.section{padding:56px 0}
.section-title{color:var(--gold);text-align:center;font-size:1.9rem;margin-bottom:28px}

/* Grid */
.grid-3{display:grid;grid-template-columns:repeat(3,1fr);gap:24px}

/* Card / Fleet */
.card{background:linear-gradient(180deg,rgba(255,255,255,0.02),var(--glass));padding:18px;border-radius:12px;border:1px solid rgba(212,175,55,0.09);transition:transform .25s,box-shadow .25s;overflow:hidden}
.card img{width:100%;border-radius:8px;margin-bottom:12px;display:block}
.card h3{color:var(--gold);margin:6px 0 8px}
.card p{color:var(--muted);margin:0}

/* Hover gold glow */
.card:hover{transform:translateY(-8px);box-shadow:0 20px 50px rgba(10,18,30,0.6)}
.card:hover::after{content:'';position:absolute;inset:0;border-radius:12px;box-shadow:0 0 40px rgba(212,175,55,0.12);pointer-events:none}

/* Contact */
.contact-section{background:linear-gradient(180deg,transparent,rgba(0,0,0,0.06));padding:48px 0}
.contact-flex{display:flex;gap:28px;align-items:flex-start;flex-wrap:wrap}
.contact-info{flex:1;min-width:260px}
.contact-form{flex:1;min-width:260px;padding:18px}
.contact-form input,.contact-form textarea{width:100%;padding:12px;border-radius:8px;border:1px solid rgba(212,175,55,0.12);background:transparent;color:var(--white);margin-top:8px;resize:vertical}
.contact-form label{display:block;color:var(--muted);font-weight:600}
.contact-form .btn-primary{width:100%;text-align:center;margin-top:12px}

/* Footer */
.footer{padding:18px 0;border-top:2px solid rgba(212,175,55,0.08);text-align:center;color:var(--muted)}

/* Animations */
.fade-in{opacity:0;transform:translateY(10px);animation:fadeIn 0.9s forwards ease-out}
.fade-in-up{opacity:0;transform:translateY(18px);animation:fadeInUp 0.9s forwards ease-out}
.slide-in{opacity:0;transform:translateX(24px);animation:slideIn 0.9s forwards ease-out}

@keyframes fadeIn{to{opacity:1;transform:none}}
@keyframes fadeInUp{to{opacity:1;transform:none}}
@keyframes slideIn{to{opacity:1;transform:none}}

/* Staggered reveal for fade-in-up */
.grid-3 .fade-in-up{animation-delay:0.12s}
.grid-3 .fade-in-up:nth-child(2){animation-delay:0.20s}
.grid-3 .fade-in-up:nth-child(3){animation-delay:0.28s}
.grid-3 .fade-in-up:nth-child(4){animation-delay:0.36s}

/* Responsive */
@media (max-width: 900px){
    .grid-3{grid-template-columns:repeat(2,1fr)}
    .hero{grid-template-columns:1fr;gap:20px;padding:36px 0}
    .nav a{display:none}
    .nav-toggle{display:block}
    .nav{position:fixed;top:72px;right:18px;background:var(--navy-2);padding:14px;border-radius:10px;flex-direction:column;display:none;box-shadow:0 18px 50px rgba(2,6,12,0.6)}
    .nav.show{display:flex}
    .nav a{display:block;padding:10px 16px}
}

@media (max-width: 520px){
    .grid-3{grid-template-columns:1fr}
    .logo{width:46px}
    .brand{font-size:1rem}
    .hero-text h2{font-size:1.5rem}
    .hero{padding:28px 0}
    .nav{right:12px;top:64px}
}