/* Bella Luna: moonlight, quiet water and softly traced terrain. */
:root{
  --navy:#203c52;
  --deep:#142e42;
  --mist:#f4f7f8;
  --ink:#203c52;
  --muted:#536b78;
  --line:#dbe5e8;
  --blue:#385f80;
  --sky:#bad5df;
  --moon:#faf7ef;
  --earth:#6f8c88;
}
body{background:radial-gradient(ellipse at 85% 0%,#e7eef4 0,transparent 42%),var(--mist)}
.site-header{background:rgba(244,247,248,.96)}
.mark:after{background:var(--moon)}
h1 em,h2 em{color:#456e83}
.hero-art{background:linear-gradient(145deg,#dfeaf0 0%,#d1e0e7 65%,#c9d9d8 100%);border:1px solid #d7e2e6}
.hero-art:before{content:"";position:absolute;width:215px;height:215px;right:-18px;top:-24px;border-radius:50%;background:radial-gradient(circle at 38% 35%,#fffdf7,#f2eee2 80%);box-shadow:0 0 65px 25px #faf7ef55}
.hero-art .topo{color:#74979a;opacity:.5}
.hero-art .orbit-label{color:#38586b}
.field-card{background:linear-gradient(150deg,#294b61,#203c52);box-shadow:0 12px 30px #203c5214}
.field-card .product-label,.field-card small{color:#d1e3e5}
.estimate-card{background:var(--moon);transform:rotate(-2deg);box-shadow:0 12px 30px #203c5217}
.mini-line{border-color:#e3e5de}
.art-caption{color:#486774}
.btn.primary{background:var(--blue);border-color:var(--blue);box-shadow:0 4px 12px #203c5210}
.btn.primary:hover{background:#2c4e6b}
.btn:hover{background:#e5edef}
.btn.dark{background:var(--navy)}
.btn.dark:hover{background:#2c4e6b}
.btn.light:hover{background:#31556d}
.nav a:hover,.resource-card .type,.pipeline .number{color:var(--blue)}
.ribbon{background:#eaf0f1}
.product-card,.resource-card,.pipeline article,.pipeline article:first-child{background:#fdfefd;box-shadow:0 5px 20px #203c5205}
.dz-art{background:linear-gradient(145deg,#294b61,#203c52)}
.dz-art .topo{color:#88aaa4}
.dz-tag{color:#d1e3e5}
.principles{background:linear-gradient(120deg,#203c52,#2d5062)}
.principles h2 em{color:#c6dfe3}
.principles-list .num{color:#c6dfe3}
.principles-list p{color:#d1dfe5}
.principles-list article{border-color:#4c6a78}
.contact-band{background:linear-gradient(115deg,#e3ecee,#edf2ee)}
.aside,.notice{background:#eaf0f0}
.status{background:#e7efef;color:#3c626c}
.status:before{background:var(--earth)}
.status.pending{background:#edf1f1}
.status.pending:before{background:#648699}
.footer{background:var(--deep)}
.footer .mark{background:var(--moon)}
.footer .mark:after{background:var(--deep)}
.future-box{background:var(--navy)}
.screen-caption{background:var(--moon)}
@media(max-width:700px){.nav{background:var(--mist)}.hero-art:before{width:170px;height:170px;right:-20px;top:-15px}}

/* The full name is the primary wordmark; the crescent and terrain form the seal. */
.logo{gap:13px;letter-spacing:.2px}
.brand-mark{width:48px;height:48px;flex-shrink:0;filter:drop-shadow(0 3px 5px #142e420d)}
.brand-name{font-size:22px;font-weight:620;letter-spacing:.1px;line-height:1.05}
.brand-name small{font-size:9px;letter-spacing:4.8px;font-weight:600;margin-top:8px;padding-left:2px}
.hero-art:before{background:radial-gradient(circle at 35% 42%,#e6e3d852 0 9%,transparent 10%),radial-gradient(circle at 64% 28%,#e6e3d844 0 6%,transparent 7%),radial-gradient(circle at 70% 63%,#e6e3d833 0 12%,transparent 13%),radial-gradient(circle at 38% 35%,#fffdf7,#f2eee2 80%)}
@media(max-width:700px){.brand-mark{width:43px;height:43px}.brand-name{font-size:19px}.brand-name small{font-size:8px;letter-spacing:4px;margin-top:7px}}

/* New moon: a quiet dark disc above the earth, signifying a fresh beginning. */
.hero-art:before{background:radial-gradient(circle at 35% 30%,#9ab1bd,#67869b 80%);border:1px solid #e8ede6;box-shadow:0 0 0 5px #bad5df18,0 0 45px 14px #a8c8d733}

/* Natural moon surface: warm moonlight, quiet craters and cool limb shading. */
.hero-art:before{background:radial-gradient(ellipse at 30% 35%,#7c96a32b 0,#7c96a31a 7%,transparent 15%),radial-gradient(ellipse at 65% 60%,#7c96a326 0,#7c96a318 10%,transparent 20%),radial-gradient(circle at 60% 22%,#7c96a322 0,#7c96a315 4%,transparent 10%),radial-gradient(circle at 38% 72%,#7c96a322 0,#7c96a315 6%,transparent 13%),radial-gradient(circle at 68% 30%,#fffdf3,#e9e9de 65%,#a7bdc8 100%);border:1px solid #edf0e6;box-shadow:0 0 0 5px #faf7ef18,0 0 45px 14px #faf7ef33}
