:root{
 --navy:#06111f;--navy2:#0b1b31;--panel:#0d213b;--panel2:#102a48;
 --gold:#f3b93f;--gold2:#ffd86f;--white:#f7faff;--muted:#a7b5c9;
 --line:rgba(255,255,255,.10);--shadow:0 25px 70px rgba(0,0,0,.42);
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{
    margin:0;
    background:radial-gradient(circle at 12% 5%,rgba(243,185,63,.07),transparent 28%),radial-gradient(circle at 92% 30%,rgba(35,101,174,.13),transparent 30%),var(--navy);
    color:var(--white);
    font-family:Inter,Arial,sans-serif;overflow-x:hidden
}
a{text-decoration:none;color:inherit}.container{width:min(1180px,92%);margin:auto}.gold{color:var(--gold2)}
.topbar{
    height:38px;
    background:#030a13;
    border-bottom:1px solid var(--line);
    font-size:14px;color:#bdc8d8
}
.topbar .container{
    height:100%;
    display:flex;
    justify-content:space-between;
    align-items:center
}
.topbar-left,.topbar-right{display:flex;gap:22px;align-items:center}
.topbar i{
    color:var(--gold);
    margin-right:6px
}
header{
    position:sticky;
    top:0;
    z-index:1000;
    background:rgba(6,17,31,.91);
    backdrop-filter:blur(18px);
    border-bottom:1px solid var(--line)
}
.nav{
    min-height:82px;
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:28px
}
.brand-wrap{
    display:flex;
    align-items:center;
    background:linear-gradient(120deg,#ffffff 0%,#fffdf7 30%,#f3cf68 50%,#fffdf7 70%,#ffffff 100%);
    border:1px solid rgba(243,185,63,.38);
    border-radius:14px;
    padding:5px 13px;
    box-shadow:0 8px 30px rgba(0,0,0,.32),0 0 28px rgba(243,185,63,.10);
    height:70px;min-width:230px
}
.brand-wrap img{
    width:210px;
    height:70px;
    object-fit:contain;
    object-position:center
}
.navlinks{
    display:flex;
    align-items:center;
    gap:4px;
    height:100%;
    font-size:12px;
    font-weight:700;
    color:#dbe4ef
}
.navlinks>a,.drop>button{
    padding:13px 12px;
    border:0;
    background:none;
    color:inherit;
    font:inherit;
    cursor:pointer;
    position:relative;
    white-space:nowrap
}
.navlinks>a:hover,.drop:hover>button,.navlinks>a.active,.drop.active>button{color:var(--gold2)}
.navlinks>a.active:after,.drop.active>button:after{
    content:"";
    position:absolute;
    left:12px;
    right:12px;
    bottom:4px;
    height:2px;
    background:linear-gradient(90deg,var(--gold),var(--gold2));
    border-radius:4px
}
.drop{position:relative}
.drop>button i{font-size:10px;margin-left:5px}
.dropdown{
    position:absolute;top:calc(100% - 2px);
    left:0;
    min-width:245px;
    padding:9px;
    background:rgba(6,17,31,.98);
    border:1px solid var(--line);
    border-radius:12px;
    box-shadow:var(--shadow);
    opacity:0;
    visibility:hidden;
    transform:translateY(8px);
    transition:.22s
}
.drop:hover .dropdown,.drop:focus-within .dropdown{
    opacity:1;
    visibility:visible;
    transform:none
}
.dropdown a{
    display:block;
    padding:11px 12px;
    border-radius:7px;
    color:#aebbd0;
    font-size:11px;
    line-height:1.3
}
.dropdown a:hover{
    background:rgba(243,185,63,.08);
    color:var(--gold2)
}
.nav-cta{
    /*
    border:1px solid rgba(243,185,63,.5)!important;
    border-radius:999px!important;
    color:var(--gold2)!important;
    margin-left:6px
    */
    padding:11px 18px;
    border:1px solid rgba(243,185,63,.55)!important;
    border-radius:999px!important;
    background:linear-gradient(135deg,rgba(243,185,63,.16),rgba(243,185,63,.04))!important;
    color:var(--gold2)!important;
}
.menu-btn{
    display:none;
    background:none;
    border:0;
    color:#fff;
    font-size:27px
}
.hero{
    min-height:690px;
    display:flex;
    align-items:center;
    position:relative;
    overflow:hidden
}
.hero:before{
    /*
    content:"";
    position:absolute;
    width:600px;
    height:600px;
    border-radius:50%;
    right:-180px;
    top:50px;
    background:radial-gradient(circle,rgba(243,185,63,.12),transparent 68%);
    animation:pulseGlow 5s infinite
    */
    content:"";
    position:absolute;
    inset:0;
    background:radial-gradient(circle at 72% 42%,rgba(243,185,63,.12),transparent 40%);
    pointer-events:none;
}
.hero-grid{
    display:grid;
    grid-template-columns:1.04fr .96fr;
    align-items:center;
    gap:45px
}
.eyebrow{
    display:inline-flex;
    align-items:center;
    gap:9px;
    padding:8px 13px;
    border:1px solid rgba(243,185,63,.3);
    background:rgba(243,185,63,.06);
    border-radius:999px;
    color:var(--gold2);
    font-size:12px;
    font-weight:800;
    letter-spacing:1.6px;
    text-transform:uppercase;
    animation:fadeUp .7s both
}
.dot{
    width:7px;
    height:7px;
    border-radius:50%;
    background:var(--gold);
    box-shadow:0 0 18px var(--gold);
    animation:pulse 1.7s infinite
}
h1{
    font-family:Manrope,Arial;
    font-size:clamp(43px,5.2vw,76px);
    line-height:1.03;
    letter-spacing:-3px;
    margin:20px 0 18px;
    animation:fadeUp .8s .08s both
}
.gradient{
    background:linear-gradient(90deg,#c88918,var(--gold2),#fff,var(--gold));
    background-size:250% auto;-webkit-background-clip:text;
    color:transparent;
    animation:shine 5s linear infinite
}
.hero-copy{
    font-size:17px;
    line-height:1.85;
    color:var(--muted);
    max-width:650px;
    animation:fadeUp .8s .16s both
}
.actions{
    display:flex;
    gap:13px;
    margin-top:27px;
    animation:fadeUp .8s .24s both
}
.btn{
    display:inline-flex;
    align-items:center;
    gap:9px;
    padding:14px 21px;
    border-radius:9px;
    font-size:13px;
    font-weight:800;
    transition:.3s
}
.btn-gold{
    color:#07111f;
    background:linear-gradient(135deg,var(--gold2),var(--gold));
    box-shadow:0 12px 35px rgba(243,185,63,.18)
}
.btn-gold:hover{
    transform:translateY(-3px);
    box-shadow:0 18px 45px rgba(243,185,63,.3)
}
.btn-outline{
    border:1px solid var(--line);
    background:rgba(255,255,255,.035);
    color:#e9eff7
}
.btn-outline:hover{
    border-color:rgba(243,185,63,.45);
    color:var(--gold2);
    transform:translateY(-3px)
}
.hero-stats{
    display:flex;
    gap:30px;
    margin-top:40px;
    animation:fadeUp .9s .4s both
}
.stat strong{
    display:block;
    font:800 26px Manrope
}
.stat span{
    font-size:11px;
    color:#8492a7;
    text-transform:uppercase;
    letter-spacing:1.1px
}
.hero-visual{
    min-height:500px;
    display:grid;
    place-items:center;
    position:relative;
    animation:float 6s ease-in-out infinite
}
.hero-ring{
    position:absolute;
    width:500px;
    height:500px;
    border-radius:50%;
    border:1px solid rgba(243,185,63,.16);
    box-shadow:0 0 100px rgba(243,185,63,.07),inset 0 0 70px rgba(243,185,63,.04);
    animation:spin 22s linear infinite
}
/* */
.hero-ring:before,.hero-ring:after{
    content:"";
    position:absolute;
    border-radius:50%;
    background:var(--gold);
    box-shadow:0 0 25px var(--gold)
}
.hero-ring:before{width:8px;height:8px;left:15%;top:8%}
.hero-ring:after{width:6px;height:6px;right:12%;bottom:18%}
/* */
.hero-art{
    width:min(560px,100%);
    position:relative;
    z-index:2;
    filter:drop-shadow(0 35px 35px rgba(0,0,0,.42))
}
.chip{
    position:absolute;
    z-index:3;
    padding:11px 13px;
    border:1px solid rgba(255,255,255,.12);
    background:rgba(8,24,44,.82);
    backdrop-filter:blur(15px);
    border-radius:11px;
    box-shadow:var(--shadow);
    font-size:11px;
    font-weight:800;
    animation:floatChip 4s ease-in-out infinite
}
.chip i{
    color:var(--gold);
    margin-right:5px
}
.chip1{
    left:0;
    top:12%
}
.chip2{
    right:0;
    top:38%;
    animation-delay:-1.2s
}
.chip3{
    left:10%;
    bottom:8%;
    animation-delay:-2.1s
}
.ticker{
    border-top:1px solid var(--line);
    border-bottom:1px solid var(--line);
    background:rgba(255,255,255,.025);
    overflow:hidden
}
.ticker-track{
    display:flex;
    width:max-content;
    animation:marquee 28s linear infinite
}
.ticker span{
    padding:17px 35px;
    color:#bdc8d8;
    font-size:12px;
    letter-spacing:1.5px;
    text-transform:uppercase;
    white-space:nowrap
}
.ticker span:before{
    content:"✦";
    color:var(--gold);
    margin-right:15px
}
section{
    padding:100px 0;
    position:relative
}
.section-head{
    max-width:720px;
    margin-bottom:45px
}
.kicker{
    font-size:12px;
    letter-spacing:2px;
    text-transform:uppercase;
    color:var(--gold);
    font-weight:800
}
.section-head h2{
    font:800 clamp(32px,4vw,52px)/1.1 Manrope;margin:10px 0 14px;
    letter-spacing:-1.5px
}
.section-head p{
    color:var(--muted);
    line-height:1.8;
    margin:0
}
.grid{
    display:grid;
    grid-template-columns:repeat(4,1fr);
    gap:16px
}
.card{
    min-height:275px;
    padding:24px;
    position:relative;
    overflow:hidden;
    border:1px solid var(--line);
    border-radius:17px;
    background:linear-gradient(145deg,rgba(16,42,72,.72),rgba(7,19,34,.9));
    transition:.4s
}
.card:hover{
    transform:translateY(-8px);
    border-color:rgba(243,185,63,.4);
    box-shadow:0 25px 65px rgba(0,0,0,.28)
}
.card:before{
    content:"";
    position:absolute;
    width:160px;
    height:160px;
    right:-80px;
    top:-80px;
    border-radius:50%;
    background:radial-gradient(circle,rgba(243,185,63,.2),transparent 68%);
    transition:.5s
}
.card:hover:before{
    transform:scale(1.7)
}
.icon{
    width:45px;
    height:45px;
    display:grid;
    place-items:center;
    border-radius:11px;
    background:rgba(243,185,63,.08);
    border:1px solid rgba(243,185,63,.25);
    color:var(--gold2);
    font-size:20px
}
.card h3{
    font:700 18px Manrope;
    margin:18px 0 9px
}
.card p{
    color:#8f9db2;
    font-size:12px;
    line-height:1.7
}
.card img{
    position:absolute;
    right:-25px;
    bottom:-10px;
    width:160px;
    opacity:.17;
    transition:.4s
}
.card:hover img{
    opacity:.3;
    transform:scale(1.08)
}
.card-link{
    position:absolute;
    bottom:20px;
    left:24px;
    color:var(--gold2);
    font-size:11px;
    font-weight:800
}
.split{
    display:grid;
    grid-template-columns:.9fr 1.1fr;
    gap:70px;
    align-items:center
}
.artbox{
    min-height:440px;
    border:1px solid var(--line);
    border-radius:24px;
    background:linear-gradient(145deg,#0d2542,#06111e);
    display:grid;
    place-items:center;
    overflow:hidden;
    position:relative
}
.artbox:before{
    content:"";
    position:absolute;
    width:320px;
    height:320px;
    border-radius:50%;
    background:radial-gradient(circle,rgba(243,185,63,.16),transparent 68%);
    animation:pulseGlow 4s infinite
}
.artbox img{
    width:85%;
    position:relative;
    z-index:2;
    filter:drop-shadow(0 25px 30px rgba(0,0,0,.4))
}
.list{
    display:grid;
    gap:13px;
    margin-top:25px
}
.list-item{
    display:grid;
    grid-template-columns:40px 1fr;
    gap:12px;
    padding:16px;
    border:1px solid var(--line);
    border-radius:13px;
    background:rgba(255,255,255,.025);
    transition:.3s
}
.list-item:hover{
    transform:translateX(6px);
    background:rgba(243,185,63,.045);
    border-color:rgba(243,185,63,.24)
}
.list-item i{
    color:var(--gold);
    font-size:22px
}
.list-item strong{
    display:block;
    font-size:14px;
    margin-bottom:4px
}
.list-item span{
    color:#8d9caf;
    font-size:13px;
    line-height:1.6
}
.cta{
    padding:70px 0;
    background:radial-gradient(circle at 80% 50%,rgba(243,185,63,.14),transparent 35%),linear-gradient(135deg,#0b203a,#06111f);
    border-top:1px solid rgba(243,185,63,.12);
    border-bottom:1px solid var(--line);
}
.cta-inner{
    display:flex;
    justify-content:space-between;
    align-items:center;
    gap:30px
}
.cta h2{
    font:800 38px Manrope;margin:7px 0
}
.cta p{
    color:#9eacc0;
    line-height:1.7;
    max-width:650px
}
.page-hero{
    padding:90px 0 75px;
    background:radial-gradient(circle at 75% 30%,rgba(243,185,63,.11),transparent 30%);
    border-bottom:1px solid var(--line)
}
.page-hero h1{
    font-size:clamp(40px,5vw,66px);
    margin:12px 0
}
.breadcrumbs{
    font-size:11px;
    color:#75849a;
    margin-top:16px
}
.breadcrumbs a:hover{color:var(--gold2)
}
.content-grid{
    display:grid;
    grid-template-columns:1fr 1fr;gap:20px
}
.info{
    padding:28px;
    border:1px solid var(--line);
    border-radius:17px;
    background:rgba(255,255,255,.025)
}
.info h3{
    font:700 20px Manrope;
    margin:0 0 10px
}
.info p,.info li{
    font-size:13px;
    color:#9ba9bc;
    line-height:1.8
}
.info ul{padding-left:18px}
footer{
    background:#030a12;
    padding:65px 0 22px
}
.footer-grid{
    display:grid;
    grid-template-columns:1.5fr 1fr 1fr 1fr;
    gap:45px
}
.footer-brand{
    background:linear-gradient(120deg,#ffffff 0%,#fffdf7 30%,#f3cf68 50%,#fffdf7 70%,#ffffff 100%);
    border:1px solid rgba(243,185,63,.38);
    border-radius:10px;
    padding:5px 12px;
    width:230px;
    box-shadow:0 6px 24px rgba(0,0,0,.25)
}
.footer-brand img{
    width:205px;
    height:80px;
    object-fit:contain
}
.footer p{
    color:#7f8da2;
    font-size:12px;
    line-height:1.8;
    max-width:400px
}
footer h4{
    font-size:11px;
    letter-spacing:1px;
    text-transform:uppercase;
    margin:5px 0 18px
}
footer ul{
    list-style:none;
    padding:0;
    margin:0;
    display:grid;
    gap:10px
}
footer li a{
    font-size:11px;
    color:#7f8da2
}
footer li a:hover{color:var(--gold2)}
.copyright{
    margin-top:45px;
    padding-top:18px;
    border-top:1px solid var(--line);
    display:flex;
    justify-content:space-between;
    color:#606f83;
    font-size:10px
}
.legal{display:flex;gap:16px}
.reveal{
    opacity:0;
    transform:translateY(25px);
    transition:.8s
}
.reveal.show{opacity:1;transform:none}
@keyframes fadeUp{from{opacity:0;transform:translateY(22px)}to{opacity:1;transform:none}}
@keyframes shine{to{background-position:250% center}}
@keyframes spin{to{transform:rotate(360deg)}}
@keyframes float{50%{transform:translateY(-10px)}}
@keyframes floatChip{50%{transform:translateY(-8px)}}
@keyframes pulse{50%{transform:scale(1.5);box-shadow:0 0 25px var(--gold)}}
@keyframes pulseGlow{50%{transform:scale(1.12);opacity:.7}}
@keyframes marquee{to{transform:translateX(-50%)}}
@media(max-width:1050px)
{
    .nav{min-height:100px}
    .brand-wrap{height:88px;min-width:205px}
    .brand-wrap img{width:205px;height:78px}
    .navlinks{gap:0}
    .navlinks>a,.drop>button{padding:10px 7px}
    .grid{grid-template-columns:repeat(2,1fr)}
    .split{grid-template-columns:1fr}
    .footer-grid{grid-template-columns:1fr 1fr}
}
@media(max-width:760px)
{
    .topbar-left span:nth-child(2),.topbar-right{display:none}
    .topbar .container{justify-content:center}
    .nav{min-height:82px}
    .brand-wrap{height:72px;min-width:165px;padding:3px 9px}
    .brand-wrap img{width:165px;height:65px}
    .navlinks{
        display:none;
        position:absolute;
        top:82px;
        left:4%;
        right:4%;
        height:auto;
        padding:12px;
        flex-direction:column;
        align-items:stretch;
        background:rgba(5,15,27,.99);
        border:1px solid var(--line);
        border-radius:14px
    }
    .navlinks.mobile-open{display:flex}
    .navlinks>a,.drop>button{padding:12px}
    .dropdown{
        position:static;
        display:none;
        opacity:1;
        visibility:visible;
        transform:none;
        box-shadow:none;
        border:0;
        background:rgba(255,255,255,.025);
        margin:3px 0
    }
    .drop.open .dropdown{display:block}
    .menu-btn{display:block}
    .hero{padding:65px 0}
    .hero-grid{grid-template-columns:1fr}
    .hero-visual{min-height:350px}
    .hero-ring{width:330px;height:330px}
    .chip{font-size:9px}
    .grid,.content-grid,.footer-grid{grid-template-columns:1fr}
    .cta-inner{display:block}
    .cta .btn{margin-top:20px}
    .copyright{display:block;line-height:1.8}
    .legal{margin-top:8px}
    .page-hero{padding:65px 0 55px}
}

    /* Animated background */
    .bg-grid{
      position:fixed;inset:0;pointer-events:none;z-index:-5;
      background-image:
        linear-gradient(rgba(255,255,255,.025) 1px,transparent 1px),
        linear-gradient(90deg,rgba(255,255,255,.025) 1px,transparent 1px);
      background-size:55px 55px;
      mask-image:linear-gradient(to bottom,black,transparent 92%);
    }
    .orb{
      position:fixed;border-radius:50%;pointer-events:none;filter:blur(2px);z-index:-4;
      opacity:.5;mix-blend-mode:screen;
    }
    .orb.one{width:320px;height:320px;left:-130px;top:190px;background:radial-gradient(circle,rgba(243,185,63,.18),transparent 70%);animation:drift 13s ease-in-out infinite}
    .orb.two{width:420px;height:420px;right:-180px;top:650px;background:radial-gradient(circle,rgba(38,113,202,.16),transparent 70%);animation:drift 17s ease-in-out infinite reverse}
    @keyframes drift{50%{transform:translate(45px,-30px) scale(1.08)}}
    
/* Why */
.why{background:linear-gradient(180deg,transparent,rgba(255,255,255,.025),transparent)}
.why-grid{
    display:grid;
    grid-template-columns:repeat(3,1fr);
    gap:18px
}
.why-box{
    padding:28px;
    border:1px solid var(--line);
    border-radius:17px;
    background:rgba(255,255,255,.025);
    transition:.35s
}
.why-box:hover{
    border-color:rgba(243,185,63,.3);
    background:rgba(243,185,63,.035);
    transform:translateY(-5px)
}
.why-number{
    font-family:Manrope;
    color:rgba(243,185,63,.18);
    font-size:48px;
    font-weight:800;
    line-height:1
}
.why-box h3{
    font-size:17px;
    margin:18px 0 9px
}
.why-box p{
    color:#8f9eb2;
    font-size:14px;
    line-height:1.75;
    margin:0
}

@media(max-width:1000px){
      .why-grid{grid-template-columns:1fr 1fr}
    }
@media(max-width:600px){
      .business-grid,.why-grid,.footer-grid{grid-template-columns:1fr}
    }    