/* Orion Labs — shared styles for content/service pages */
:root{
  --bg:#06070f; --bg2:#0A0A18; --elev:#11131f;
  --cyan:#22D3EE; --cyan-lt:#67E8F9; --orange:#F59E0B; --orange-lt:#FBBF24;
  --text:#e9f3f7; --text-sec:#a9c2cc; --text-mut:#6f8893;
  --border:rgba(120,180,200,.14); --border-2:rgba(120,180,200,.22);
  --maxw:1080px;
}
*{margin:0;padding:0;box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  font-family:'DM Sans',system-ui,sans-serif;background:var(--bg);color:var(--text);
  line-height:1.65;-webkit-font-smoothing:antialiased;overflow-x:hidden;
}
#bg{position:fixed;inset:0;z-index:-1;width:100%;height:100%;display:block}
a{color:var(--cyan-lt);text-decoration:none}
.wrap{max-width:var(--maxw);margin:0 auto;padding:0 24px}

/* nav */
.nav{position:sticky;top:0;z-index:50;backdrop-filter:blur(14px);
  background:rgba(6,7,15,.72);border-bottom:1px solid var(--border)}
.nav-in{max-width:var(--maxw);margin:0 auto;padding:14px 24px;display:flex;align-items:center;justify-content:space-between;gap:16px}
.brand{display:flex;align-items:center;gap:10px;color:var(--text)}
.brand svg{width:30px;height:30px}
.brand b{font-family:'Bahnschrift','Unbounded',sans-serif;font-weight:700;letter-spacing:.18em;font-size:.92rem;text-transform:uppercase}
.brand b span{color:var(--cyan)}
.nav-links{display:flex;align-items:center;gap:22px}
.nav-links a{color:var(--text-sec);font-size:.9rem;font-weight:500}
.nav-links a:hover{color:var(--text)}
.nav-cta{padding:9px 18px;border-radius:999px;background:linear-gradient(135deg,var(--cyan),#3A7BD5);
  color:#04121a !important;font-weight:700;font-size:.85rem}
@media(max-width:720px){.nav-links a:not(.nav-cta){display:none}}

/* breadcrumb */
.crumb{font-family:'Space Mono',monospace;font-size:.72rem;letter-spacing:.06em;color:var(--text-mut);
  text-transform:uppercase;margin:28px 0 0}
.crumb a{color:var(--text-mut)}.crumb a:hover{color:var(--cyan)}

/* hero */
.hero{padding:46px 0 36px}
.kicker{font-family:'Space Mono',monospace;font-size:.74rem;letter-spacing:.22em;text-transform:uppercase;color:var(--cyan)}
h1{font-family:'Unbounded',sans-serif;font-weight:800;line-height:1.05;letter-spacing:-.01em;
  font-size:clamp(2rem,5.2vw,3.6rem);margin:14px 0 16px}
h1 .g{background:linear-gradient(135deg,var(--cyan-lt),var(--cyan));-webkit-background-clip:text;background-clip:text;color:transparent}
.lead{font-size:clamp(1.05rem,2vw,1.3rem);color:var(--text-sec);max-width:62ch}

/* sections */
section{padding:30px 0}
h2{font-family:'Unbounded',sans-serif;font-weight:700;font-size:clamp(1.4rem,3.2vw,2rem);margin:0 0 16px;letter-spacing:-.01em}
h3{font-family:'Unbounded',sans-serif;font-weight:600;font-size:1.1rem;margin:0 0 8px}
p{color:var(--text-sec);margin:0 0 14px;max-width:70ch}
.sec-lead{color:var(--text-sec);font-size:1.05rem;max-width:70ch;margin-bottom:22px}
ul.ticks{list-style:none;display:grid;gap:10px;margin:6px 0 8px}
ul.ticks li{position:relative;padding-left:30px;color:var(--text-sec)}
ul.ticks li::before{content:"✦";position:absolute;left:0;top:0;color:var(--cyan)}
strong{color:var(--text)}

/* cards */
.cards{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:16px;margin-top:18px}
.card{background:var(--elev);border:1px solid var(--border);border-radius:16px;padding:22px}
.card .ic{font-size:1.4rem;margin-bottom:10px}
.card p{margin:0;font-size:.95rem}
.card.link{transition:border-color .2s,transform .2s}
.card.link:hover{border-color:var(--cyan);transform:translateY(-3px)}
.card.link .more{display:inline-block;margin-top:12px;color:var(--cyan);font-weight:600;font-size:.85rem}

/* stat row */
.stats{display:flex;flex-wrap:wrap;gap:30px;margin:24px 0}
.stat .n{font-family:'Unbounded',sans-serif;font-weight:800;font-size:2rem;background:linear-gradient(135deg,var(--cyan-lt),var(--orange));-webkit-background-clip:text;background-clip:text;color:transparent}
.stat .l{font-size:.8rem;color:var(--text-mut);text-transform:uppercase;letter-spacing:.08em}

/* steps */
.steps{counter-reset:s;display:grid;gap:14px;margin-top:16px}
.step{display:flex;gap:16px;background:var(--elev);border:1px solid var(--border);border-radius:14px;padding:18px}
.step::before{counter-increment:s;content:counter(s);flex:none;width:34px;height:34px;border-radius:50%;
  display:grid;place-items:center;font-family:'Unbounded',sans-serif;font-weight:700;font-size:.9rem;
  color:var(--cyan);border:1px solid var(--cyan)}

/* faq */
.faq{display:grid;gap:12px;margin-top:16px}
.faq details{background:var(--elev);border:1px solid var(--border);border-radius:12px;padding:4px 18px}
.faq summary{cursor:pointer;font-family:'Unbounded',sans-serif;font-weight:600;font-size:1rem;padding:14px 0;list-style:none}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:"+";float:right;color:var(--cyan);font-weight:700}
.faq details[open] summary::after{content:"–"}
.faq details p{padding:0 0 14px;margin:0}

/* CTA band */
.cta{margin:44px 0;background:linear-gradient(135deg,rgba(34,211,238,.10),rgba(245,158,11,.08));
  border:1px solid var(--border-2);border-radius:20px;padding:38px 28px;text-align:center}
.cta h2{margin-bottom:8px}
.cta p{margin:0 auto 20px;color:var(--text-sec)}
.btn{display:inline-block;padding:14px 30px;border-radius:999px;font-weight:700;font-size:.95rem;cursor:pointer}
.btn-primary{background:linear-gradient(135deg,var(--cyan),#3A7BD5);color:#04121a}
.btn-ghost{border:1px solid var(--border-2);color:var(--text);margin-left:10px}
.btn:hover{opacity:.92}

/* contact form */
.form{display:flex;flex-direction:column;gap:14px;max-width:560px;margin-top:10px}
.form input,.form select,.form textarea{width:100%;padding:14px 16px;border-radius:10px;
  border:1px solid var(--border-2);background:var(--elev);color:var(--text);font-family:inherit;font-size:1rem;outline:none}
.form input::placeholder,.form textarea::placeholder{color:var(--text-mut)}
.form input:focus,.form select:focus,.form textarea:focus{border-color:var(--cyan)}
.form textarea{min-height:130px;resize:vertical}
.form .btn{align-self:flex-start;border:none}
.form-ok{display:none;background:linear-gradient(135deg,rgba(34,211,238,.12),rgba(245,158,11,.08));
  border:1px solid var(--border-2);border-radius:14px;padding:22px;margin-top:10px;max-width:560px}
.form-ok.show{display:block}
.form-ok h3{color:var(--cyan)}

/* contact modal */
.oc-ov{position:fixed;inset:0;z-index:200;background:rgba(4,5,11,.82);backdrop-filter:blur(8px);
  display:none;align-items:center;justify-content:center;padding:20px}
.oc-ov.open{display:flex}
.oc-card{background:var(--bg2);border:1px solid var(--border-2);border-radius:20px;padding:30px;
  max-width:480px;width:100%;position:relative;max-height:92vh;overflow:auto}
.oc-card h3{font-family:'Unbounded',sans-serif;font-size:1.4rem;margin:0 0 6px}
.oc-card .oc-sub{color:var(--text-sec);margin-bottom:16px;font-size:.95rem}
.oc-close{position:absolute;top:12px;right:16px;background:none;border:none;color:var(--text-mut);
  font-size:1.6rem;line-height:1;cursor:pointer}
.oc-close:hover{color:var(--cyan)}

/* blog */
.post-meta{font-family:'Space Mono',monospace;font-size:.74rem;letter-spacing:.04em;color:var(--text-mut);margin:10px 0 0;text-transform:uppercase}
.post-body{max-width:74ch}
.post-body h2{margin-top:36px}
.post-body h3{margin-top:22px}
.post-body p{margin:0 0 16px;color:var(--text-sec)}
.post-body ul,.post-body ol{margin:0 0 18px;padding-left:22px;color:var(--text-sec)}
.post-body li{margin-bottom:9px}
.post-body strong{color:var(--text)}
.post-body a{color:var(--cyan-lt)}
.post-body blockquote{border-left:3px solid var(--cyan);padding:10px 0 10px 18px;margin:0 0 18px;color:var(--text);font-style:italic;background:rgba(34,211,238,.05)}
.post-srcs{font-size:.85rem;color:var(--text-mut);margin-top:34px;border-top:1px solid var(--border);padding-top:16px}
.post-srcs a{color:var(--text-mut);text-decoration:underline}
.post-srcs li{margin-bottom:6px}

/* footer */
footer{border-top:1px solid var(--border);margin-top:50px;padding:34px 0 40px}
.foot{display:flex;flex-wrap:wrap;gap:20px;justify-content:space-between;align-items:center}
.foot a{color:var(--text-mut);font-size:.85rem;margin-right:16px}
.foot a:hover{color:var(--cyan)}
.foot .legal{color:var(--text-mut);font-size:.8rem}