* {
box-sizing:border-box;
margin:0;
padding:0;
font-family:Arial, Helvetica, sans-serif;
}

:root {

    --navy-dark:#0B1B36;
    --navy:#10284D;
    --navy-card:#17345E;
    --gold:#D4AF37;
    --gold-light:#F2D675;
    --white:#FFFFFF;

}

body {

    background:#0B1B36;
    color:#FFFFFF;
    line-height:1.6;

}

body {

color:#FFFFFF;
line-height:1.6;

}

p {

color:#D9E2F2;

}


.navbar {

display:flex;
justify-content:space-between;
align-items:center;
padding:25px 8%;
background:#080d1a;

}


.logo {

font-size:24px;
font-weight:800;

}

.logo span {

color:var(--gold);

}


.nav-links a {

color:white;
text-decoration:none;
margin-left:25px;

}


.hero {

min-height:90vh;
display:flex;
align-items:center;
padding:8%;
background:
linear-gradient(
135deg,
rgba(11,27,54,.92),
rgba(16,40,77,.92)
),
url("assets/hero-bg.jpg");

background-size:cover;

}


.hero h1 {

font-size:64px;
line-height:1.1;

}


.hero span {

color:var(--gold);

}


.hero p {

max-width:650px;
font-size:20px;
margin:25px 0;

}


.buttons {

display:flex;
gap:20px;

}


.btn {

    padding:14px 30px;
    border-radius:30px;
    text-decoration:none;
    font-weight:700;
    color:#FFFFFF;
    border:2px solid #D4AF37;
    background:transparent;
    display:inline-flex;
    align-items:center;
    justify-content:center;
    transition:all .3s ease;

}


.btn:hover {

    background:#D4AF37;
    color:#0B1B36;
    transform:translateY(-3px);

}


.primary,
.secondary,
.pokemon-request {

    background:transparent;
    color:#FFFFFF;
    border:2px solid #D4AF37;

}



section {

padding:90px 8%;

}


h2 {

text-align:center;
font-size:42px;
margin-bottom:45px;

}



.cards,
.category-grid,
.steps {

display:grid;
grid-template-columns:repeat(auto-fit,minmax(230px,1fr));
gap:25px;

}



.card,
.category,
.steps div {

background:#17345E;
padding:35px;
border-radius:18px;
border:1px solid rgba(212,175,55,.35);

}


.card:hover,
.category:hover {

transform:translateY(-8px);
border-color:var(--gold);

}


.mission {

text-align:center;
background:#0f172a;

}


.mission p {

max-width:800px;
margin:20px auto;
font-size:20px;

}



.steps span {

color:var(--gold);
font-size:35px;
font-weight:bold;

}



.trust {

    background:#0B1B36;
    color:#FFFFFF;
    text-align:center;

}


.trust h2 {

    color:#FFFFFF;

}


.trust li {

    color:#D9E2F2;

}


.trust ul {

list-style:none;
font-size:20px;

}


.trust li {

margin:15px;

}



.contact {

text-align:center;
background:linear-gradient(
135deg,
#D4AF37,
#F2D675
);

color:#050B1A;

}


.contact a {

color:white;
font-size:22px;

}


footer {

padding:30px;
text-align:center;
background:#050816;

}



@media(max-width:700px){

.hero {

    flex-direction:column;

}


.hero-logo {

    flex:unset;
    margin-top:40px;

}


.hero-logo img {

    max-width:250px;

}

.hero h1 {

font-size:42px;

}


.navbar {

flex-direction:column;

}


.nav-links {

margin-top:20px;

}


}

.pokemon-request {

    background:transparent;
    color:#FFFFFF;
    border:2px solid #D4AF37;

}


.pokemon-request:hover {

    background:#D4AF37;
    color:#0B1B36;
    transform:translateY(-3px);

}

h1,
h2,
h3 {

color:#FFFFFF;

}

.orders {

    background:#10284D !important;
    text-align:center;
    color:#FFFFFF;


}


.orders-intro {

    max-width:800px;
    margin:0 auto 45px;
    font-size:18px;

}



.order-grid {

    display:grid;
    grid-template-columns:
    repeat(auto-fit,minmax(220px,1fr));

    gap:18px;

}



.order-item {

    background:#17345E;
    padding:20px;
    border-radius:14px;

    border:1px solid rgba(212,175,55,.35);

    color:#FFFFFF;
    font-weight:600;

    transition:.3s ease;

}



.order-item:hover {

    transform:translateY(-5px);
    border-color:#D4AF37;
    background:#1E4678;

}

.hero {

    display:flex;
    justify-content:space-between;
    align-items:center;
    gap:50px;

}


.hero-content {

    max-width:650px;

}


.hero-logo {

    flex:0 0 350px;
    display:flex;
    justify-content:center;
    align-items:center;

}


.hero-logo img {

    width:100%;
    max-width:350px;
    border-radius:20px;

    border:2px solid rgba(212,175,55,.6);

    box-shadow:
    0 0 30px rgba(212,175,55,.25);

}