:root {
  --bg: #0d0a12; --panel: #17111f; --panel2: #21172e; --purple: #a970ff;
  --purple-bright: #c5a0ff; --text: #f6f1fc; --muted: #b8adca; --line: #342544;
  --max: 1160px;
}
* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body { margin: 0; background: var(--bg); color: var(--text); font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif; line-height: 1.6; }
a { color: inherit; text-decoration: none; }
.topline { text-align: center; padding: 8px 16px; background: #21142f; color: #d8c4ff; font-size: .75rem; letter-spacing: .08em; }
.site-header { max-width: var(--max); margin: auto; padding: 20px 24px; display: flex; align-items: center; justify-content: space-between; gap: 24px; }
.brand { display: inline-flex; align-items: center; gap: 12px; min-width: max-content; }
.brand-mark { display: grid; place-items: center; width: 44px; height: 44px; border: 1px solid var(--purple); border-radius: 13px 13px 13px 3px; color: var(--purple-bright); box-shadow: 0 0 24px #9b5cff22; padding: 7px; }
.brand-mark svg { display: block; width: 100%; height: 100%; }
.brand strong { display: block; font-size: .98rem; letter-spacing: .16em; }
.brand small { display: block; color: var(--muted); font-size: .58rem; letter-spacing: .12em; }
nav { display: flex; align-items: center; gap: 28px; font-size: .9rem; color: var(--muted); }
nav a:hover { color: white; }
.nav-cta { border: 1px solid #684a8b; padding: 10px 15px; border-radius: 9px; color: white; }
.menu-toggle { display: none; border: 1px solid var(--line); color: white; background: var(--panel); padding: 8px 12px; border-radius: 8px; }
.hero { max-width: var(--max); margin: auto; padding: 70px 24px 82px; display: grid; grid-template-columns: 1.05fr .95fr; align-items: center; gap: 40px; min-height: 520px; }
.eyebrow { color: var(--purple-bright); font-size: .72rem; letter-spacing: .18em; font-weight: 800; margin: 0 0 18px; }
.pulse { display: inline-block; width: 7px; height: 7px; border-radius: 50%; background: #bd90ff; margin-right: 9px; box-shadow: 0 0 12px var(--purple); }
h1,h2,h3,p { margin-top: 0; }
h1 { font-size: clamp(2.8rem, 5.4vw, 5rem); line-height: 1.04; letter-spacing: -.055em; margin-bottom: 24px; }
h1 span { color: var(--purple-bright); }
.hero-intro { max-width: 530px; color: var(--muted); font-size: 1.1rem; }
.hero-actions { display: flex; gap: 12px; flex-wrap: wrap; margin: 30px 0 25px; }
.button { display: inline-flex; align-items: center; justify-content: center; gap: 12px; border: 0; border-radius: 10px; padding: 13px 18px; font: inherit; font-weight: 750; cursor: pointer; }
.button-primary { color: #160d22; background: linear-gradient(135deg, #d4b7ff, #a875ff); box-shadow: 0 7px 30px #9e65ff20; }
.button-primary:hover { filter: brightness(1.08); transform: translateY(-1px); }
.button-quiet { color: var(--text); border: 1px solid var(--line); background: transparent; }
.trust-row { display: flex; flex-wrap: wrap; gap: 18px; color: var(--muted); font-size: .8rem; }
.trust-row i { color: var(--purple-bright); font-style: normal; margin-right: 5px; }
.hero-art { min-height: 360px; position: relative; display: grid; place-items: center; overflow: hidden; border: 1px solid #352347; border-radius: 28px; background: radial-gradient(ellipse at 50% 48%, #45275e 0%, #21142f 35%, #100b18 72%); }
.hero-art::before { content: ""; position: absolute; inset: 0; opacity: .2; background-image: linear-gradient(#9f76ca22 1px, transparent 1px), linear-gradient(90deg, #9f76ca22 1px, transparent 1px); background-size: 32px 32px; mask-image: linear-gradient(transparent, black, transparent); }
.moon { position: absolute; width: 210px; height: 210px; border-radius: 50%; background: linear-gradient(145deg, #f0e3ff, #b784f7 48%, #6b3d9e); box-shadow: 0 0 70px #b77aff77, inset -24px -20px 38px #4c276c66; }
.moon::after { content: ""; position: absolute; inset: 18px 20px 18px 44px; border-radius: 50%; background: #241333; box-shadow: -8px 0 18px #b784f7; }
.sigil { position: relative; z-index: 2; width: 105px; height: 105px; color: #f5eaff; filter: drop-shadow(0 4px 25px #a970ff); transform: translateY(4px); }
.sigil svg { display: block; width: 100%; height: 100%; }
.orbit { position: absolute; border: 1px solid #d4b7ff55; border-radius: 50%; width: 310px; height: 115px; transform: rotate(-28deg); }
.orbit-two { width: 350px; height: 145px; transform: rotate(40deg); border-color: #d4b7ff33; }
.art-label { position: absolute; z-index: 3; color: #d9c5f7; font-size: .65rem; letter-spacing: .2em; }
.label-top { top: 28px; left: 28px; }.label-bottom { bottom: 26px; right: 24px; }
.ticker { display: flex; justify-content: center; align-items: center; gap: 24px; flex-wrap: wrap; padding: 20px; border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); color: #c6b5dc; font-size: .7rem; letter-spacing: .15em; }
.ticker b { color: var(--purple); }
.section { max-width: var(--max); margin: auto; padding: 90px 24px; }
.section-heading { max-width: 720px; margin: 0 auto 38px; text-align: center; }
h2 { font-size: clamp(2rem, 4vw, 3.25rem); letter-spacing: -.045em; line-height: 1.1; margin-bottom: 16px; }
.section-heading > p:last-child, .muted { color: var(--muted); }
.service-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 16px; }
.service-card { position: relative; background: linear-gradient(155deg, #1b1425, #120e18); border: 1px solid var(--line); border-radius: 17px; padding: 26px; min-height: 290px; }
.service-card.featured { border-color: #7a55a6; box-shadow: inset 0 1px #c6a3ff20; }
.service-icon { display: grid; place-items: center; width: 48px; height: 48px; margin-bottom: 22px; background: #39234e; color: var(--purple-bright); border-radius: 13px; font-size: 1.5rem; }
.card-kicker { display: block; color: var(--purple-bright); font-size: .62rem; letter-spacing: .12em; margin: -8px 0 8px; }
.service-card h3 { font-size: 1.22rem; margin-bottom: 10px; }.service-card p { color: var(--muted); font-size: .92rem; min-height: 70px; }
.price { border-top: 1px solid var(--line); padding-top: 15px; font-weight: 750; }
.price small { display: block; color: var(--muted); font-size: .72rem; font-weight: 400; margin-top: 3px; }
.small-note { color: #9385a7; font-size: .78rem; text-align: center; margin: 22px 0 0; }
.process-section { background: #130e1a; border-top: 1px solid #251a32; border-bottom: 1px solid #251a32; }
.process-layout { max-width: var(--max); margin: auto; padding: 90px 24px; display: grid; grid-template-columns: .9fr 1.1fr; gap: 70px; }
.process-layout > div:first-child { padding-top: 20px; }
.steps { display: grid; gap: 0; }
.step { display: grid; grid-template-columns: 55px 1fr; gap: 16px; padding: 20px 0; border-bottom: 1px solid var(--line); }
.step:first-child { border-top: 1px solid var(--line); }
.step > span { color: var(--purple-bright); font-size: .9rem; font-weight: 800; letter-spacing: .08em; }
.step h3 { margin-bottom: 5px; font-size: 1.05rem; }.step p { margin: 0; color: var(--muted); font-size: .9rem; }
.request-section { padding-top: 82px; padding-bottom: 82px; }
.request-panel { display: grid; grid-template-columns: 1fr 1fr; gap: 54px; padding: clamp(24px, 5vw, 52px); border: 1px solid #50366b; border-radius: 22px; background: radial-gradient(ellipse at top left, #342047, #18111f 58%); }
.request-panel h2 { margin-bottom: 18px; }
.notice { display: flex; gap: 12px; padding: 14px; border: 1px solid #6c4d8e; background: #231832; border-radius: 11px; color: #d9c8f0; margin-top: 24px; font-size: .85rem; }
.notice span { color: var(--purple-bright); font-size: 1.2rem; }.notice p { margin: 0; }.notice strong { color: white; }
form { display: grid; align-content: center; gap: 10px; }
label { font-size: .8rem; color: #d7cce5; font-weight: 700; margin-top: 5px; }
select, textarea { width: 100%; border: 1px solid #473454; background: #100b17; color: #a99bb9; border-radius: 9px; padding: 13px; font: inherit; }
select:disabled, textarea:disabled { opacity: .75; cursor: not-allowed; }
.full { width: 100%; margin-top: 8px; }.form-help { color: #a99bb9; font-size: .72rem; text-align: center; margin: 0; }
.faq-section { max-width: 850px; padding-top: 35px; }
.faq-list details { border-bottom: 1px solid var(--line); padding: 18px 0; }
.faq-list summary { cursor: pointer; font-weight: 750; list-style: none; display: flex; justify-content: space-between; gap: 15px; }
.faq-list summary::after { content: "+"; color: var(--purple-bright); font-size: 1.3rem; line-height: 1; }.faq-list details[open] summary::after { content: "−"; }
.faq-list details p { color: var(--muted); margin: 12px 0 0; max-width: 700px; }
.site-footer { border-top: 1px solid var(--line); padding: 35px max(24px, calc((100vw - var(--max)) / 2)); }
.site-footer > p { color: var(--muted); font-size: .8rem; margin: 18px 0 25px; }
.footer-bottom { display: flex; justify-content: space-between; gap: 15px; flex-wrap: wrap; border-top: 1px solid var(--line); padding-top: 18px; color: #9485a7; font-size: .72rem; }
@media (max-width: 800px) {
  .site-header { flex-wrap: wrap; }.menu-toggle { display: block; }
  nav { display: none; width: 100%; flex-direction: column; align-items: stretch; gap: 0; padding-top: 10px; }
  nav.open { display: flex; } nav a { padding: 12px 4px; border-top: 1px solid var(--line); }
  .hero { grid-template-columns: 1fr; padding-top: 45px; gap: 35px; }.hero-art { min-height: 300px; }
  .service-grid { grid-template-columns: 1fr; }.service-card { min-height: auto; }.service-card p { min-height: auto; }
  .process-layout { grid-template-columns: 1fr; gap: 30px; padding-top: 65px; padding-bottom: 65px; }
  .request-panel { grid-template-columns: 1fr; gap: 28px; }
}
@media (max-width: 480px) {
  .topline { font-size: .65rem; }.site-header { padding: 16px; }.hero, .section { padding-left: 18px; padding-right: 18px; }
  h1 { font-size: 2.7rem; }.hero-art { min-height: 265px; }.moon { width: 165px; height: 165px; }.sigil { width: 86px; height: 86px; }
  .orbit { width: 250px; }.ticker { gap: 10px; font-size: .6rem; }.hero-actions .button { width: 100%; }
  .site-footer { padding-left: 18px; padding-right: 18px; }
}
