
:root{
  --bg:#07111f;
  --panel:#0e1b31;
  --panel2:#132542;
  --text:#eaf2ff;
  --muted:#b8c7e6;
  --accent:#7cc4ff;
  --accent2:#ffd166;
  --border:rgba(255,255,255,.12);
}


body{
  margin:0;
  font-family:Arial,Helvetica,sans-serif;
  background:radial-gradient(circle at top,#122447 0%,var(--bg) 55%);
  color:var(--text);
  line-height:1.6;
}

a{color:inherit;text-decoration:none}


.container{
  width:min(1120px,92%);
  margin:0 auto;
}

header,footer{
  background:rgba(5,12,24,.88);
  border-bottom:1px solid var(--border);
}

.page-hero h1{
  margin:0;
}

nav ul{
  list-style:none;
  padding:0;
  margin:0;
  display:flex;
  gap:.75rem;
  flex-wrap:wrap;
  align-items:center;
}

nav a{
  display:block;
  padding:.7rem 1rem;
  border-radius:999px;
  background:rgba(255,255,255,.06);
  transition:.2s;
}

.nav-wrap{
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:1rem;
  padding:1rem 0;
}

nav a:focus{
  background:var(--accent);
  color:#08111d;
}

.Main-navigation {
display: flex;
justify-content: center;
gap: 20px;
}

.hero{
  padding:2rem 0 1rem;
}

.hero-card{
  background:linear-gradient(135deg,rgba(124,196,255,.16),rgba(255,209,102,.08));
  border:1px solid var(--border);
  border-radius:24px;
  padding:2rem;
  box-shadow:0 20px 50px rgba(0,0,0,.22);
}

.hero-grid{
  display:grid;
  grid-template-columns:1.3fr .9fr;
  gap:1.5rem;
  align-items:center;
}

.hero-badges{
  display:flex;
  flex-wrap:wrap;
  gap:.75rem;
  margin-top:1rem;
}

.section-title{
  margin:0 0 1rem;
}

.card-grid{
  display:flex;
  flex-wrap:wrap;
  gap:1rem;
}

.planet-card{
  flex:1 1 220px;
  background:var(--panel);
  border:1px solid var(--border);
  border-radius:20px;
  overflow:hidden;
  box-shadow:0 16px 40px rgba(0,0,0,.18);
  display:flex;
  flex-direction:column;
}

.planet-card h3{
  margin:.25rem 0 .5rem;
}

.planet-card p{
  color:var(--muted);
  margin:.25rem 0 1rem;
}
.planet-table{
  width:100%;
  border-collapse:collapse;
  min-width:720px;
}

.planet-table thead th{
  background:rgba(124,196,255,.14);
}

.float-img {
  float:left;
  width:min(260px,42%);
  margin:0 1rem .75rem ;
  border-radius:18px;
  overflow:hidden;
}

.footer-inner{
  padding:1rem 0;
  color:var(--muted);
  display:flex;
  justify-content:space-between;
  gap:1rem;
  flex-wrap:wrap;
}

.planet-card {
  padding: .75rem;
}

.button{
  display:inline-block;
  padding:.7rem 1rem;
  background:var(--accent2);
  color:#1b1503;
  border-radius:999px;
  font-weight:700;
  display: flex;
  justify-content: center;
}

.table-wrap{
  overflow-x:auto;
  background:var(--panel);
  border:1px solid var(--border);
  border-radius:20px;
  padding:1rem;
}

.planet-table{
  width:100%;
  border-collapse:collapse;
  min-width:720px;
}

.planet-table th,.planet-table td{
  padding:.9rem;
  border:1px solid var(--border);
  text-align:left;
}

.planet-table thead th{
  background:rgba(124,196,255,.14);
}

.content-section,.page-card{
  background:var(--panel);
  border:1px solid var(--border);
  border-radius:20px;
  padding:1.25rem;
  box-shadow:0 16px 40px rgba(0,0,0,.14);
}

footer{
  border-top:1px solid var(--border);
  border-bottom:none;
  margin-top:2rem;
}

.footer-inner{
  padding:1rem 0;
  color:var(--muted);
  display:flex;
  justify-content:space-between;
  gap:1rem;
  flex-wrap:wrap;
}

.small{
  color:var(--muted);
}

img {
  height: 200px;
  width: 250px;
}

h2,h3,h1 {
  text-transform:capitalize
}
