:root { --bg:#09070f; --panel:#171020; --text:#fbf9ff; --muted:#aaa0b1; --line:rgba(255,255,255,.1); --purple:#a970ff; --purple-deep:#6d34c7; --cyan:#19c7e8; --danger:#ff8097; }
*, *::before, *::after { box-sizing: border-box; }
html, body { min-width:320px; min-height:100%; }
body { margin:0; color:var(--text); background:radial-gradient(circle at 14% 10%,rgba(169,112,255,.15),transparent 26rem),radial-gradient(circle at 88% 88%,rgba(25,199,232,.06),transparent 23rem),var(--bg); font-family:Inter,system-ui,sans-serif; }
body::before { content:""; position:fixed; inset:0; z-index:-1; opacity:.14; background-image:linear-gradient(rgba(255,255,255,.05) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.05) 1px,transparent 1px); background-size:52px 52px; mask-image:radial-gradient(circle at center,black,transparent 80%); }
button, input, select, textarea { font:inherit; }
.contact-page { width:min(1180px,calc(100% - 32px)); min-height:100dvh; margin:0 auto; padding:22px 0 40px; }
.contact-header { min-height:50px; display:grid; grid-template-columns:1fr auto 1fr; align-items:center; gap:20px; }
.context-back, .contact-tools-link { width:max-content; min-height:42px; padding:0 13px; display:inline-flex; align-items:center; gap:8px; border:1px solid var(--line); border-radius:10px; background:rgba(255,255,255,.025); color:#ddd5e2; text-decoration:none; font-size:10px; font-weight:800; cursor:pointer; }
.contact-tools-link { justify-self:end; }
.contact-brand { display:inline-flex; align-items:center; gap:10px; color:inherit; text-decoration:none; }
.contact-brand-mark { width:38px; height:38px; padding:9px 8px; display:flex; align-items:flex-end; justify-content:center; gap:3px; border:1px solid rgba(255,255,255,.16); border-radius:12px; background:linear-gradient(145deg,rgba(201,155,255,.28),rgba(109,52,199,.82)); }
.contact-brand-mark i { width:5px; border-radius:999px; background:white; }
.contact-brand-mark i:nth-child(1){height:9px;opacity:.72}.contact-brand-mark i:nth-child(2){height:17px}.contact-brand-mark i:nth-child(3){height:13px;opacity:.86}
.contact-brand > span:last-child strong,.contact-brand > span:last-child small{display:block}.contact-brand strong{font:800 15px Syne,sans-serif}.contact-brand small{margin-top:2px;color:var(--muted);font-size:7px;font-weight:800;letter-spacing:.16em}
.contact-layout { min-height:calc(100dvh - 112px); padding:64px 0 30px; display:grid; grid-template-columns:minmax(0,.82fr) minmax(500px,1.18fr); gap:clamp(46px,7vw,95px); align-items:center; }
.contact-eyebrow { margin:0 0 17px; color:#c99bff; font-size:9px; font-weight:800; letter-spacing:.19em; text-transform:uppercase; }
.contact-intro h1 { margin:0; font:700 clamp(45px,6vw,72px)/.98 Syne,sans-serif; letter-spacing:-.05em; }
.contact-intro > p:nth-of-type(2) { max-width:540px; margin:23px 0 0; color:var(--muted); font-size:14px; line-height:1.75; }
.contact-route-list { margin-top:35px; display:grid; gap:7px; }
.contact-route-list article { padding:11px; display:flex; align-items:center; gap:12px; border:1px solid rgba(255,255,255,.07); border-radius:11px; background:rgba(255,255,255,.02); }
.contact-route-list article > span { width:30px; height:30px; flex:0 0 auto; display:grid; place-items:center; border-radius:8px; color:#d1b3f8; background:rgba(169,112,255,.1); font-size:8px; font-weight:800; }
.contact-route-list strong,.contact-route-list small{display:block}.contact-route-list strong{font-size:9px}.contact-route-list small{margin-top:3px;color:#8f8596;font-size:8px;line-height:1.4}
.contact-form-panel { padding:27px; border:1px solid rgba(255,255,255,.12); border-radius:23px; background:linear-gradient(145deg,rgba(31,22,43,.94),rgba(17,12,25,.9)); box-shadow:0 30px 90px rgba(0,0,0,.4); }
.contact-form-heading { display:flex; align-items:center; gap:12px; }
.contact-form-icon { width:44px; height:44px; display:grid; place-items:center; border-radius:12px; color:#e0c7ff; background:rgba(169,112,255,.14); font-weight:800; }
.contact-form-heading p,.contact-form-heading h2{margin:0}.contact-form-heading p{color:#91869a;font-size:7px;font-weight:800;letter-spacing:.15em}.contact-form-heading h2{margin-top:4px;font:700 22px Syne,sans-serif;letter-spacing:-.035em}
.contact-error-summary { margin-top:18px; padding:13px; border:1px solid rgba(255,128,151,.3); border-radius:11px; background:rgba(255,128,151,.07); }
.contact-error-summary strong{font-size:10px}.contact-error-summary ul{margin:8px 0 0;padding-left:18px;color:#ffc1cc;font-size:9px;line-height:1.7}.contact-error-summary a{color:inherit}
#contactForm { margin-top:22px; display:grid; gap:15px; }
.contact-field-row { display:grid; grid-template-columns:1fr 1fr; gap:12px; }
.contact-field { min-width:0; display:grid; gap:7px; color:#ded7e3; font-size:9px; font-weight:700; }
.contact-field > span em { color:#887e8e; font-size:8px; font-style:normal; font-weight:500; }
.contact-field input,.contact-field select,.contact-field textarea { width:100%; border:1px solid rgba(255,255,255,.11); border-radius:10px; outline:0; background:rgba(5,3,9,.26); color:white; transition:border-color .15s ease,box-shadow .15s ease; }
.contact-field input,.contact-field select{height:45px;padding:0 12px}.contact-field textarea{min-height:125px;padding:12px;resize:vertical;line-height:1.55}.contact-field select option{background:#171020;color:white}
.contact-field input:focus,.contact-field select:focus,.contact-field textarea:focus{border-color:rgba(169,112,255,.62);box-shadow:0 0 0 3px rgba(169,112,255,.1)}
.contact-field [aria-invalid="true"]{border-color:rgba(255,128,151,.7)}
.field-hint,.field-error{min-height:12px;color:#8f8596;font-size:7.5px;font-weight:500;line-height:1.45}.field-error{color:#ffacba}
.contact-submit-row { margin-top:3px; display:flex; align-items:center; justify-content:space-between; gap:18px; }
.contact-submit-row p { max-width:310px; margin:0; color:#8f8596; font-size:7.5px; line-height:1.5; }
#contactSubmit { min-width:150px; min-height:46px; padding:0 17px; display:inline-flex; align-items:center; justify-content:center; gap:8px; border:0; border-radius:10px; background:linear-gradient(135deg,#ad72ff,#7439cf); color:white; font-size:9px; font-weight:800; cursor:pointer; }
#contactSubmit:disabled{cursor:wait;opacity:.72}.button-loader{width:14px;height:14px;border:2px solid rgba(255,255,255,.3);border-top-color:white;border-radius:50%;animation:contact-spin .7s linear infinite}@keyframes contact-spin{to{transform:rotate(360deg)}}
@media(max-width:880px){.contact-layout{grid-template-columns:1fr;align-items:start}.contact-intro{max-width:700px}.contact-route-list{grid-template-columns:repeat(3,1fr)}.contact-route-list article{align-items:flex-start}.contact-route-list article>span{display:none}}
@media(max-width:620px){.contact-page{width:calc(100% - 24px);padding-top:12px}.contact-header{grid-template-columns:1fr auto}.contact-brand{grid-column:1/-1;grid-row:1;justify-self:center}.context-back{grid-column:1;grid-row:1;z-index:1;width:42px;padding:0;justify-content:center;font-size:0}.context-back span{font-size:14px}.contact-tools-link{grid-column:2;grid-row:1;z-index:1}.contact-layout{padding-top:42px;gap:34px}.contact-intro h1{font-size:clamp(39px,12vw,54px)}.contact-intro>p:nth-of-type(2){font-size:12px}.contact-route-list{grid-template-columns:1fr}.contact-form-panel{padding:19px;border-radius:18px}.contact-field-row{grid-template-columns:1fr}.contact-submit-row{align-items:stretch;flex-direction:column}.contact-submit-row p{max-width:none}#contactSubmit{width:100%;min-height:48px}}
@media(prefers-reduced-motion:reduce){.button-loader{animation:none}}
