:root { --bg:#020817; --panel:#07152f; --text:#f8fbff; --muted:#9ca9c7; --line:rgba(255,255,255,.09); --green:#14e66e; --blue:#2d7dff; --purple:#8a4dff; --shadow:0 20px 45px rgba(0,0,0,.32); --max-width:1240px; }
* { box-sizing:border-box; margin:0; padding:0; }
html { min-height:100%; overflow-x:clip; background:#001126; }
body { min-height:100vh; font-family:"Inter",Arial,sans-serif; color:var(--text); background-color:#001126; background-image:radial-gradient(circle at 12% 0,rgba(45,125,255,.14),transparent 28%),radial-gradient(circle at 90% 40%,rgba(138,77,255,.1),transparent 27%),linear-gradient(180deg,#020817,#031129 55%,#020817); line-height:1.6; overflow-x:clip; }
a { color:inherit; text-decoration:none; }
.container { width:min(92%,var(--max-width)); margin:0 auto; }
.menu-toggle { display:none; width:52px; height:52px; flex:0 0 52px; align-items:center; justify-content:center; padding:0; border:1px solid rgba(255,255,255,.16); border-radius:11px; background:rgba(255,255,255,.1); color:#fff; cursor:pointer; position:relative; z-index:1001; }
.menu-toggle span { pointer-events:none; display:block; font-size:29px; font-weight:900; line-height:1; }
.btn { display:inline-flex; align-items:center; justify-content:center; padding:13px 20px; border:1px solid transparent; border-radius:13px; font-weight:750; transition:transform .25s ease,background .25s ease,box-shadow .25s ease; }
.btn-primary { color:#041218; background:linear-gradient(135deg,var(--green),#0fcb61); box-shadow:0 12px 28px rgba(20,230,110,.15); }
.btn-primary:hover { transform:translateY(-2px); color:#fff; background:linear-gradient(135deg,var(--blue),var(--purple)); }
.services-hero { padding:88px 0 58px; text-align:center; }
.eyebrow { display:inline-flex; margin-bottom:18px; padding:8px 13px; border:1px solid rgba(20,230,110,.18); border-radius:999px; color:#a6f6c5; background:rgba(20,230,110,.06); font-weight:700; font-size:.86rem; }
.services-hero h1 { max-width:900px; margin:0 auto 20px; font-size:clamp(2.65rem,7vw,5.2rem); line-height:1.02; letter-spacing:-2.5px; }
.services-hero h1 span { color:var(--green); }
.services-hero p { max-width:760px; margin:0 auto; color:var(--muted); font-size:1.08rem; }
.services { padding:28px 0 100px; }
.services > .container > h2 { font-size:clamp(2rem,4vw,3rem); line-height:1.1; margin-bottom:10px; }
.section-subtitle { max-width:740px; margin-bottom:34px; color:var(--muted); }
.services-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:22px; }
.service-card { display:flex; min-width:0; flex-direction:column; padding:26px; border:1px solid var(--line); border-radius:22px; background:linear-gradient(180deg,rgba(11,26,58,.97),rgba(7,20,46,.97)); box-shadow:var(--shadow); transition:transform .28s ease,border-color .28s ease; }
.service-card:hover { transform:translateY(-7px); border-color:rgba(20,230,110,.25); }
.service-icon { width:48px; height:48px; display:grid; place-items:center; margin-bottom:20px; border-radius:14px; color:var(--green); background:rgba(20,230,110,.09); }
.service-icon svg { width:24px; height:24px; }
.service-card h3 { margin-bottom:9px; font-size:1.3rem; }
.service-card p { flex:1; margin-bottom:20px; color:var(--muted); font-size:.94rem; }
.service-link { display:inline-flex; align-items:center; gap:8px; color:var(--green); font-weight:700; }
.service-link svg { width:18px; height:18px; }
.service-link:hover { color:#fff; }
.services-cta { display:flex; align-items:center; justify-content:space-between; gap:24px; margin-top:42px; padding:28px; border:1px solid rgba(20,230,110,.16); border-radius:22px; background:rgba(20,230,110,.055); }
.services-cta p { color:var(--muted); }
.footer { padding:30px 0 42px; border-top:1px solid rgba(255,255,255,.06); text-align:center; color:var(--muted); }
@media (max-width:980px) { .services-grid { grid-template-columns:repeat(2,minmax(0,1fr)); } }
@media (max-width:700px) { .services-hero { padding:62px 0 42px; text-align:left; } .services-hero h1 { letter-spacing:-1.5px; } .services-hero p { margin:0; } .services-grid { grid-template-columns:1fr; } .services-cta { align-items:stretch; flex-direction:column; } }
@media (prefers-reduced-motion:reduce) { *,*::before,*::after { scroll-behavior:auto!important; transition-duration:.01ms!important; } }
