:root {
  --red: #C8412B; --red-dark: #A8321F; --navy: #14213D; --navy-2: #1C2B4D;
  --cream: #FBF6EE; --ink: #1E2433; --muted: #5B6275; --line: #E8DFD2; --gold: #F2B84B;
  --display: "Iowan Old Style", "Palatino Linotype", Palatino, "Book Antiqua", Georgia, "Times New Roman", serif; --font: ui-rounded, "SF Pro Rounded", system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
}
* { box-sizing: border-box; }
body { margin: 0; font-family: var(--font); color: var(--ink); background: var(--cream); line-height: 1.6; font-size: 17px; }
a { color: var(--red); }
h1, h2, h3 { font-family: var(--display); line-height: 1.15; margin: 0 0 .5em; color: var(--navy); }
.wrap { width: min(1080px, 100% - 32px); margin-inline: auto; }
.eyebrow { font-weight: 800; letter-spacing: .12em; text-transform: uppercase; font-size: .78rem; color: var(--red); margin-bottom: .6em; }

header { background: var(--navy); }
.nav { display: flex; align-items: center; justify-content: space-between; height: 68px; }
.logo { display: flex; align-items: center; gap: 12px; color: #fff; text-decoration: none; font-weight: 800; letter-spacing: .02em; }
.planet-mark { width: 30px; height: 30px; border-radius: 50%; background: radial-gradient(circle at 35% 35%, #E8674F, var(--red) 55%, var(--red-dark)); box-shadow: 0 0 0 4px rgba(242,184,75,.25); }
.nav a.contact { color: #fff; text-decoration: none; font-weight: 700; }

.hero { background: var(--navy); color: #DDE3F0; padding: 72px 0 96px; position: relative; overflow: hidden; }
.hero h1 { color: #fff; font-size: clamp(2.3rem, 6vw, 4rem); max-width: 780px; }
.hero h1 span { color: var(--gold); }
.hero p { font-size: 1.15rem; max-width: 600px; color: #C9D0E0; }
.hero .eyebrow { color: var(--gold); }
.mars { position: absolute; right: -80px; top: 40px; width: 340px; height: 340px; border-radius: 50%;
        background: radial-gradient(circle at 35% 30%, #E8674F, var(--red) 50%, #7E2415); opacity: .9; }
.mars::after { content: ""; position: absolute; inset: 60px 90px 150px 70px; border-radius: 50%; background: rgba(0,0,0,.12); }
.stars span { position: absolute; width: 3px; height: 3px; border-radius: 50%; background: #fff; opacity: .7; }
@media (max-width: 760px) { .mars { width: 200px; height: 200px; right: -70px; top: 16px; opacity: .45; } }

section { padding: 72px 0; }
.products { display: grid; grid-template-columns: repeat(2, 1fr); gap: 22px; margin-top: 28px; }
@media (max-width: 760px) { .products { grid-template-columns: 1fr; } }
.product { background: #fff; border: 1px solid var(--line); border-radius: 20px; padding: 28px; display: flex; flex-direction: column; box-shadow: 0 10px 30px rgba(20,33,61,.07); }
.product .top { display: flex; align-items: center; gap: 14px; margin-bottom: 14px; }
.product img { width: 60px; height: 60px; }
.tag { display: inline-block; font-size: .75rem; font-weight: 800; padding: 4px 10px; border-radius: 999px; background: #FBE3DC; color: var(--red-dark); }
.product p { color: var(--muted); }
.btn { display: inline-flex; align-self: flex-start; margin-top: auto; background: var(--red); color: #fff; text-decoration: none; font-weight: 800; padding: 12px 20px; border-radius: 999px; }
.btn:hover { background: var(--red-dark); }
.product.soon { background: transparent; border: 2px dashed var(--line); box-shadow: none; justify-content: center; }
.product.soon h3 { color: var(--muted); }

.about { display: grid; grid-template-columns: 1fr 1fr; gap: 40px; align-items: start; }
@media (max-width: 760px) { .about { grid-template-columns: 1fr; } }
.principles { list-style: none; padding: 0; margin: 0; }
.principles li { background: #fff; border: 1px solid var(--line); border-radius: 14px; padding: 16px 18px; margin-bottom: 10px; }
.principles b { color: var(--navy); }

.contact-box { background: var(--red); color: #fff; border-radius: 24px; padding: 40px; text-align: center; }
.contact-box h2 { color: #fff; }
.contact-box a { color: #fff; font-weight: 800; font-size: 1.2rem; overflow-wrap: anywhere; }
@media (max-width: 520px) { .contact-box { padding: 28px 20px; } .contact-box a { font-size: 1.05rem; } }

footer { background: var(--navy); color: #9AA3B8; padding: 32px 0; font-size: .9rem; }
footer .row { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 12px; }
footer a { color: #fff; text-decoration: none; margin-left: 16px; }
.stars .st1 { top:18%; left:8%; } .stars .st2 { top:30%; left:40%; } .stars .st3 { top:70%; left:22%; }
.stars .st4 { top:12%; left:62%; } .stars .st5 { top:55%; left:5%; } .stars .st6 { top:82%; left:55%; }
.u-pt0 { padding-top: 0 !important; } .u-rel { position: relative; } .u-m0 { margin: 0; }