:root {
  --blue: #0b63f6;
  --blue-2: #1689ff;
  --blue-deep: #0539af;
  --ink: #0d1117;
  --muted: #646b79;
  --line: #dfe5ee;
  --soft: #f4f7fc;
  --white: #ffffff;
  --radius: 24px;
  --shadow: 0 24px 70px rgba(17, 53, 117, .12);
  --font: Inter, ui-sans-serif, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body {
  margin: 0;
  font-family: var(--font);
  color: var(--ink);
  background: var(--white);
  line-height: 1.6;
  overflow-x: hidden;
  -webkit-font-smoothing: antialiased;
}
body.menu-open, body.modal-open { overflow: hidden; }
::selection { background: rgba(11,99,246,.18); color: var(--ink); }
a { color: inherit; text-decoration: none; }
button, input, select, textarea { font: inherit; }
button { color: inherit; }
img { max-width: 100%; display: block; }

.container { width: min(1180px, calc(100% - 40px)); margin-inline: auto; }
.section { padding: 112px 0; position: relative; }

.scroll-progress { position: fixed; inset: 0 0 auto; height: 3px; z-index: 1000; pointer-events: none; }
.scroll-progress span { display: block; width: 0; height: 100%; background: linear-gradient(90deg, var(--blue), var(--blue-2)); box-shadow: 0 0 16px rgba(11,99,246,.55); }
.cursor-glow { position: fixed; width: 440px; height: 440px; border-radius: 50%; background: radial-gradient(circle, rgba(21,125,255,.09), transparent 67%); transform: translate(-50%,-50%); pointer-events: none; z-index: 0; opacity: 0; transition: opacity .3s; }

.preloader { position: fixed; inset: 0; z-index: 9999; background: #fff; display: grid; place-content: center; gap: 20px; transition: opacity .6s ease, visibility .6s ease; }
.preloader.done { opacity: 0; visibility: hidden; }
.preloader img { width: 150px; margin: auto; animation: loaderFloat 1.2s ease-in-out infinite alternate; }
.loader-line { width: 180px; height: 3px; background: #e8edf6; border-radius: 99px; overflow: hidden; }
.loader-line span { display: block; width: 45%; height: 100%; background: var(--blue); border-radius: inherit; animation: loaderLine 1s ease-in-out infinite; }
@keyframes loaderFloat { to { transform: translateY(-8px); } }
@keyframes loaderLine { from { transform: translateX(-110%); } to { transform: translateX(260%); } }

.site-header { position: fixed; top: 0; left: 0; width: 100%; z-index: 900; padding: 18px 0; transition: .35s ease; }
.site-header.scrolled { padding: 10px 0; background: rgba(255,255,255,.86); backdrop-filter: blur(18px); border-bottom: 1px solid rgba(223,229,238,.78); box-shadow: 0 8px 30px rgba(19,41,82,.06); }
.nav-wrap { display: flex; align-items: center; justify-content: space-between; gap: 26px; }
.brand { display: inline-flex; align-items: center; gap: 9px; font-weight: 800; font-size: 21px; letter-spacing: -.8px; white-space: nowrap; }
.brand img { width: 52px; height: 34px; object-fit: contain; }
.brand > span > span { color: var(--blue); }
.main-nav { display: flex; align-items: center; gap: 30px; margin-left: auto; }
.main-nav a { font-size: 14px; font-weight: 650; color: #303644; position: relative; }
.main-nav a::after { content: ""; position: absolute; left: 0; bottom: -8px; width: 100%; height: 2px; background: var(--blue); transform: scaleX(0); transform-origin: right; transition: transform .25s ease; }
.main-nav a:hover::after, .main-nav a.active::after { transform: scaleX(1); transform-origin: left; }
.menu-toggle { display: none; border: 0; background: transparent; width: 42px; height: 42px; padding: 10px; cursor: pointer; }
.menu-toggle span { display: block; height: 2px; background: var(--ink); margin: 5px 0; transition: .25s ease; }

.button { --mx: 0px; --my: 0px; display: inline-flex; align-items: center; justify-content: center; gap: 18px; min-height: 54px; padding: 0 24px; color: #fff; background: linear-gradient(135deg, var(--blue), #0752d9); border: 0; border-radius: 12px; font-weight: 750; font-size: 14px; box-shadow: 0 14px 28px rgba(11,99,246,.22); cursor: pointer; transform: translate(var(--mx), var(--my)); transition: box-shadow .25s, transform .14s ease, filter .25s; }
.button:hover { box-shadow: 0 18px 36px rgba(11,99,246,.3); filter: saturate(1.1); }
.button b { font-size: 18px; line-height: 1; }
.button-small { min-height: 44px; padding: 0 18px; border-radius: 10px; gap: 12px; }
.button-white { background: #fff; color: var(--ink); box-shadow: 0 16px 32px rgba(0,0,0,.16); }
.text-link { display: inline-flex; align-items: center; gap: 12px; font-weight: 750; font-size: 14px; }
.text-link span { color: var(--blue); transition: transform .2s ease; }
.text-link:hover span { transform: translate(3px,-2px); }

.hero { min-height: 940px; padding-top: 175px; padding-bottom: 70px; overflow: hidden; background: radial-gradient(circle at 78% 18%, rgba(25,130,255,.11), transparent 30%), linear-gradient(180deg,#fff 0%,#fff 72%,#f6f9ff 100%); }
#tech-canvas { position: absolute; inset: 0; width: 100%; height: 100%; opacity: .62; pointer-events: none; }
.hero-orb { position: absolute; border-radius: 50%; filter: blur(1px); pointer-events: none; }
.hero-orb-a { width: 410px; height: 410px; right: -150px; top: 160px; background: radial-gradient(circle at 35% 35%, rgba(47,153,255,.22), rgba(11,99,246,.02) 66%); }
.hero-orb-b { width: 280px; height: 280px; left: -110px; bottom: 50px; background: radial-gradient(circle, rgba(14,102,244,.1), transparent 70%); }
.hero-grid { position: relative; z-index: 2; display: grid; grid-template-columns: 1.02fr .98fr; align-items: center; gap: 72px; }
.eyebrow { display: inline-flex; align-items: center; gap: 10px; padding: 8px 13px; border: 1px solid rgba(11,99,246,.17); background: rgba(255,255,255,.7); border-radius: 999px; color: #315078; font-size: 12px; font-weight: 800; text-transform: uppercase; letter-spacing: 1.5px; box-shadow: 0 10px 30px rgba(11,99,246,.07); }
.live-dot { width: 8px; height: 8px; border-radius: 50%; background: var(--blue); box-shadow: 0 0 0 0 rgba(11,99,246,.45); animation: pulseDot 1.8s infinite; }
@keyframes pulseDot { 70% { box-shadow: 0 0 0 8px rgba(11,99,246,0); } 100% { box-shadow: 0 0 0 0 rgba(11,99,246,0); } }
.hero h1 { max-width: 700px; margin: 23px 0 22px; font-size: clamp(50px, 5.4vw, 78px); line-height: .99; letter-spacing: -4.4px; }
.gradient-text { display: inline-block; color: var(--blue); background: linear-gradient(90deg, var(--blue-deep), var(--blue-2)); -webkit-background-clip: text; background-clip: text; -webkit-text-fill-color: transparent; transition: opacity .22s, transform .22s; }
.gradient-text.switching { opacity: 0; transform: translateY(8px); }
.hero-lead { max-width: 620px; margin: 0; color: var(--muted); font-size: 18px; line-height: 1.75; }
.hero-actions { display: flex; align-items: center; gap: 30px; margin-top: 34px; }
.hero-trust { display: flex; gap: 32px; margin-top: 48px; }
.hero-trust > div { display: flex; align-items: center; gap: 10px; }
.hero-trust strong { color: var(--blue); font-size: 13px; }
.hero-trust span { color: #4e5665; font-size: 12px; font-weight: 680; line-height: 1.35; }

.hero-visual { position: relative; min-height: 560px; display: grid; place-items: center; perspective: 1300px; }
.visual-shell { width: 100%; max-width: 550px; border-radius: 23px; background: #fff; border: 1px solid rgba(152,173,207,.28); box-shadow: 0 36px 90px rgba(35,67,128,.18), 0 0 0 8px rgba(255,255,255,.72); overflow: hidden; transform-style: preserve-3d; }
.browser-bar { height: 46px; display: grid; grid-template-columns: 74px 1fr 44px; align-items: center; background: #f7f9fc; border-bottom: 1px solid #e8edf5; padding: 0 12px; }
.browser-dots { display: flex; gap: 6px; }
.browser-dots i { width: 8px; height: 8px; border-radius: 50%; background: #d5dce7; }
.browser-dots i:first-child { background: #ff7a7a; }.browser-dots i:nth-child(2) { background: #ffd56a; }.browser-dots i:last-child { background: #68d891; }
.browser-address { height: 26px; border: 1px solid #e5eaf1; background: #fff; border-radius: 7px; color: #96a0b0; font-size: 10px; display: flex; align-items: center; justify-content: center; gap: 6px; }
.browser-menu { text-align: right; color: #8993a3; font-size: 11px; letter-spacing: 1px; }
.browser-page { position: relative; min-height: 430px; overflow: hidden; background: linear-gradient(144deg, #fbfdff 0 49%, #eaf2ff 49.2% 100%); padding: 28px 32px; }
.browser-page::before { content:""; position:absolute; width:330px; height:330px; border:1px solid rgba(11,99,246,.1); border-radius:50%; right:-120px; top:30px; box-shadow: 0 0 0 35px rgba(11,99,246,.025), 0 0 0 72px rgba(11,99,246,.018); }
.mock-nav { position: relative; display:flex; align-items:center; justify-content:space-between; }
.mock-nav img { width: 74px; height: 40px; object-fit:contain; }
.mock-nav div { display:flex; gap:18px; }.mock-nav i { display:block; width:33px; height:4px; background:#cad3e0; border-radius:9px; }.mock-nav i:last-child{width:50px;background:var(--blue);}
.mock-hero { position:relative; margin-top:68px; max-width:380px; }
.mock-hero > span { font-size:9px; letter-spacing:3px; color:var(--blue); font-weight:900; }
.mock-hero h2 { margin:14px 0 22px; font-size:38px; line-height:1.04; letter-spacing:-2px; }.mock-hero h2 em { font-style:normal; color:var(--blue); }
.mock-button { width:106px; height:32px; border-radius:8px; background:var(--blue); box-shadow:0 12px 22px rgba(11,99,246,.23); }
.mock-cards { position:absolute; left:32px; right:32px; bottom:28px; display:grid; grid-template-columns:repeat(3,1fr); gap:12px; }
.mock-cards i { height:54px; background:rgba(255,255,255,.9); border:1px solid #e5ebf4; border-radius:10px; box-shadow:0 10px 24px rgba(33,70,130,.06); }
.floating-card { position:absolute; z-index:4; display:flex; align-items:center; gap:12px; min-width:175px; padding:14px 16px; border:1px solid rgba(214,223,236,.78); border-radius:14px; background:rgba(255,255,255,.89); backdrop-filter: blur(15px); box-shadow:0 18px 45px rgba(36,70,130,.16); transition: transform .2s ease; }
.floating-card-a { top:82px; right:-25px; }.floating-card-b { bottom:50px; left:-32px; }
.floating-card small { display:block; font-size:10px; color:#7b8492; }.floating-card strong { display:block; font-size:17px; letter-spacing:-.4px; }
.mini-icon { display:grid; place-items:center; width:34px; height:34px; border-radius:9px; color:#fff; background:var(--blue); }
.pulse-ring { width:34px; height:34px; border-radius:50%; border:8px solid rgba(11,99,246,.15); box-shadow:inset 0 0 0 3px var(--blue); }
.code-chip { position:absolute; right:15px; bottom:12px; padding:8px 12px; border-radius:9px; color:#fff; background:#111722; font-family: ui-monospace, SFMono-Regular, Menlo, monospace; font-size:11px; box-shadow:0 14px 30px rgba(13,17,23,.18); }

.stats-strip { position:relative; z-index:2; margin-top:70px; padding:26px 28px; display:grid; grid-template-columns:repeat(4,1fr); border:1px solid rgba(213,222,235,.8); background:rgba(255,255,255,.76); backdrop-filter:blur(12px); border-radius:18px; box-shadow:0 16px 45px rgba(35,67,128,.07); }
.stats-strip > div { padding:0 26px; border-right:1px solid #e2e8f1; }.stats-strip > div:last-child { border-right:0; }
.stats-strip strong { display:block; color:var(--blue); font-size:27px; letter-spacing:-1.3px; }.stats-strip span { display:block; color:#727b89; font-size:11px; font-weight:700; text-transform:uppercase; letter-spacing:.9px; }

.logo-marquee { overflow:hidden; border-top:1px solid #e6ebf2; border-bottom:1px solid #e6ebf2; background:#fff; }
.marquee-track { width:max-content; display:flex; align-items:center; gap:28px; padding:16px 0; animation:marquee 28s linear infinite; color:#8b94a2; }
.marquee-track span { font-size:12px; font-weight:900; letter-spacing:1.8px; }.marquee-track i { color:var(--blue); font-style:normal; }
@keyframes marquee { to { transform:translateX(-50%); } }

.section-heading { display:flex; justify-content:space-between; align-items:end; gap:50px; margin-bottom:55px; }
.section-heading > div { max-width:720px; }
.section-heading h2, .process-intro h2, .faq-intro h2 { margin:10px 0 0; font-size:clamp(38px,4.2vw,60px); line-height:1.06; letter-spacing:-3px; }
.section-heading > p { max-width:390px; margin:0 0 6px; color:var(--muted); }
.section-kicker { display:inline-block; color:var(--blue); font-size:11px; font-weight:900; text-transform:uppercase; letter-spacing:2px; }
.section-kicker.light { color:#9ec4ff; }

.services { background:#fff; }
.services-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:18px; }
.service-card { position:relative; min-height:460px; display:flex; flex-direction:column; padding:34px; border:1px solid #e4e9f1; border-radius:22px; background:#fff; overflow:hidden; transition:border-color .25s, box-shadow .25s; transform-style:preserve-3d; }
.service-card::after { content:""; position:absolute; width:180px; height:180px; right:-70px; top:-70px; border-radius:50%; background:radial-gradient(circle,rgba(11,99,246,.1),transparent 67%); }
.service-card:hover { border-color:rgba(11,99,246,.32); box-shadow:var(--shadow); }
.service-card.featured { background:linear-gradient(150deg,#0a62f4,#063fbf); color:#fff; border-color:transparent; box-shadow:0 25px 55px rgba(8,76,206,.22); }
.service-card.featured::after { width:310px; height:310px; right:-130px; top:-130px; background:radial-gradient(circle,rgba(255,255,255,.18),transparent 66%); }
.service-no { position:absolute; right:28px; top:26px; color:#a1a9b5; font-size:12px; font-weight:800; }.featured .service-no { color:rgba(255,255,255,.55); }
.service-icon { display:grid; place-items:center; width:54px; height:54px; border-radius:14px; background:#edf4ff; color:var(--blue); font-size:25px; font-weight:900; }.featured .service-icon { background:rgba(255,255,255,.13); color:#fff; }
.recommended { position:absolute; right:29px; top:56px; font-size:9px; font-weight:900; text-transform:uppercase; letter-spacing:1px; color:#bcd5ff; }
.service-card h3 { margin:27px 0 12px; font-size:26px; letter-spacing:-1px; }
.service-card p { margin:0; color:var(--muted); }.featured p { color:rgba(255,255,255,.76); }
.service-card ul { list-style:none; padding:0; margin:24px 0 30px; display:grid; gap:10px; font-size:13px; color:#3e4654; }.featured ul { color:rgba(255,255,255,.87); }
.service-card li::before { content:"✓"; margin-right:9px; color:var(--blue); font-weight:900; }.featured li::before { color:#a9caff; }
.service-card > a { margin-top:auto; display:flex; justify-content:space-between; align-items:center; padding-top:20px; border-top:1px solid #e7ebf2; font-size:13px; font-weight:800; }.featured > a { border-color:rgba(255,255,255,.2); }
.service-card > a span { color:var(--blue); }.featured > a span { color:#fff; }

.work { background:var(--soft); overflow:hidden; }
.filter-bar { display:flex; gap:8px; margin-top:-20px; margin-bottom:24px; flex-wrap:wrap; }
.filter-btn { border:1px solid #dce3ed; background:#fff; padding:9px 14px; border-radius:999px; cursor:pointer; font-size:12px; font-weight:750; color:#667080; transition:.2s; }
.filter-btn:hover,.filter-btn.active { color:#fff; background:var(--ink); border-color:var(--ink); }
.projects-grid { display:grid; grid-template-columns:1.35fr .65fr; gap:20px; }
.project-card { min-width:0; transition:opacity .3s, transform .3s; }.project-card.hidden { opacity:0; transform:scale(.96); display:none; }
.project-card-wide { grid-row:span 2; }
.project-preview { position:relative; overflow:hidden; border-radius:22px; min-height:280px; box-shadow:0 20px 50px rgba(29,57,105,.11); }
.project-card-wide .project-preview { min-height:635px; }
.project-preview-a { background:linear-gradient(140deg,#dce9ff,#f8fbff 60%,#bad3ff); display:grid; place-items:center; }
.project-browser { width:82%; height:70%; border-radius:15px; background:#fff; box-shadow:0 30px 60px rgba(36,67,119,.2); transform:rotate(-3deg); overflow:hidden; }
.project-top { height:30px; background:#f1f4f8; display:flex; gap:5px; align-items:center; padding-left:12px; }.project-top i { width:6px;height:6px;border-radius:50%;background:#c8d0dc; }
.project-layout { height:calc(100% - 30px); background:linear-gradient(110deg,rgba(5,17,33,.9),rgba(13,17,23,.2)), linear-gradient(135deg,#142235,#6482a5); color:#fff; padding:55px 42px; }
.project-layout small { letter-spacing:2px;font-size:8px; }.project-layout h3 { font-size:38px;line-height:1.05;max-width:310px;letter-spacing:-2px; }.project-layout span { display:block;width:90px;height:28px;border-radius:5px;background:#fff; }
.project-phone { position:absolute; right:5%; bottom:3%; width:30%; height:60%; border:8px solid #0d1117; border-radius:26px; background:#f7f9fc; transform:rotate(4deg); box-shadow:0 25px 50px rgba(14,30,57,.25); overflow:hidden; }
.project-phone div { height:60%;background:linear-gradient(155deg,#0c63f5,#58a7ff); }.project-phone strong { display:block;font-size:44px;color:#dfe7f2;padding:15px; }
.project-preview-b { background:#111723; color:#fff; min-height:300px; display:flex; align-items:center; justify-content:center; }
.product-orbit { position:absolute;width:230px;height:230px;border-radius:50%;border:1px solid rgba(74,146,255,.35);box-shadow:0 0 0 32px rgba(20,109,246,.06),0 0 0 64px rgba(20,109,246,.035); }
.product-orbit i { position:absolute;width:8px;height:8px;background:#3187ff;border-radius:50%; }.product-orbit i:first-child{left:18px;top:45px}.product-orbit i:nth-child(2){right:8px;top:105px}.product-orbit i:last-child{left:90px;bottom:-4px}
.product-bottle { position:relative;z-index:2;width:75px;height:145px;border-radius:16px 16px 25px 25px;background:linear-gradient(100deg,#d9e9ff,#fff 48%,#8dbdff);color:#0b63f6;font-weight:900;font-size:46px;display:grid;place-items:center;box-shadow:0 20px 38px rgba(0,0,0,.35); }
.product-copy { position:absolute;left:24px;top:24px;display:grid; }.product-copy small{font-size:7px;letter-spacing:2px;color:#78aaff}.product-copy b{font-size:34px;line-height:.9;margin-top:8px;letter-spacing:-2px}
.project-preview-c { min-height:300px;background:linear-gradient(145deg,#e9f1ff,#fff);display:flex;padding:28px;gap:12px; }
.dashboard-side { width:25%;border-radius:10px;background:#0d1117;padding:20px 13px;display:grid;align-content:start;gap:14px; }.dashboard-side i{height:6px;border-radius:9px;background:#2f3743}.dashboard-side i:first-child{background:#1b78ff;width:70%}
.dashboard-main { flex:1;border-radius:10px;background:#fff;padding:20px;box-shadow:0 18px 40px rgba(39,74,131,.12); }.dashboard-main small{font-size:8px;letter-spacing:1.5px;color:#778397}
.chart { height:120px;display:flex;align-items:end;gap:9px;padding-top:15px;border-bottom:1px solid #eef1f5; }.chart i{flex:1;border-radius:4px 4px 0 0;background:linear-gradient(#0d78ff,#b8d8ff)}.chart i:nth-child(1){height:34%}.chart i:nth-child(2){height:53%}.chart i:nth-child(3){height:45%}.chart i:nth-child(4){height:78%}.chart i:nth-child(5){height:92%}
.dash-pills{display:flex;gap:8px;margin-top:16px}.dash-pills span{height:28px;flex:1;border-radius:6px;background:#eef3fa}.dash-pills span:last-child{background:#0b63f6}
.project-meta { display:flex; align-items:center; justify-content:space-between; gap:16px; padding:18px 3px 4px; }
.project-meta span { color:var(--blue);font-size:10px;font-weight:900;text-transform:uppercase;letter-spacing:1.4px; }.project-meta h3{margin:3px 0 0;font-size:20px;letter-spacing:-.6px}
.project-open { flex:0 0 44px;width:44px;height:44px;border:1px solid #d9e1ec;border-radius:50%;background:#fff;cursor:pointer;font-size:18px;transition:.2s; }.project-open:hover{color:#fff;background:var(--blue);border-color:var(--blue);transform:rotate(45deg)}

.process { background:#0d1117;color:#fff;overflow:hidden; }
.process::before{content:"";position:absolute;width:520px;height:520px;border-radius:50%;right:-160px;top:-170px;background:radial-gradient(circle,rgba(25,126,255,.2),transparent 67%)}
.process-grid { display:grid;grid-template-columns:.8fr 1.2fr;gap:95px;align-items:start; }
.process-intro { position:sticky;top:150px; }.process-intro p{color:#939dab;max-width:460px}.process-intro .text-link{margin-top:22px}.process-intro .text-link span{color:#86b3ff}
.process-steps { position:relative; }.process-steps::before{content:"";position:absolute;left:28px;top:30px;bottom:30px;width:1px;background:#2c3440}
.process-step { position:relative;display:grid;grid-template-columns:58px 1fr;gap:25px;padding:0 0 52px;opacity:.5;transition:opacity .35s,transform .35s; }.process-step:last-child{padding-bottom:0}.process-step.active{opacity:1;transform:translateX(8px)}
.step-marker { width:58px;height:58px;border-radius:50%;display:grid;place-items:center;background:#161c25;border:1px solid #323a46;z-index:1;transition:.3s}.process-step.active .step-marker{background:var(--blue);border-color:var(--blue);box-shadow:0 0 0 9px rgba(11,99,246,.1)}
.step-marker span{font-size:11px;font-weight:900}.process-step h3{margin:3px 0 8px;font-size:23px;letter-spacing:-.6px}.process-step p{margin:0;color:#929ca9;max-width:520px}


.differentiators { background:#fff; }
.benefit-grid { display:grid;grid-template-columns:repeat(4,1fr);border-top:1px solid #e0e6ef;border-left:1px solid #e0e6ef; }
.benefit{padding:32px;border-right:1px solid #e0e6ef;border-bottom:1px solid #e0e6ef;min-height:260px;transition:.25s}.benefit:hover{background:#f7faff}.benefit span{color:var(--blue);font-size:11px;font-weight:900}.benefit h3{margin:50px 0 12px;font-size:21px;line-height:1.15;letter-spacing:-.6px}.benefit p{margin:0;color:var(--muted);font-size:14px}

.faq { background:var(--soft); }
.faq-grid { display:grid;grid-template-columns:.65fr 1.35fr;gap:90px;align-items:start; }.faq-intro p{color:var(--muted)}
.accordion{border-top:1px solid #d8e0eb}.accordion-item{border-bottom:1px solid #d8e0eb}.accordion-item button{width:100%;padding:22px 0;border:0;background:transparent;display:flex;justify-content:space-between;align-items:center;text-align:left;font-weight:800;cursor:pointer}.accordion-item button b{display:grid;place-items:center;width:28px;height:28px;border-radius:50%;background:#fff;color:var(--blue);font-size:18px}.accordion-panel{display:grid;grid-template-rows:0fr;transition:grid-template-rows .35s ease}.accordion-panel>p{overflow:hidden;margin:0;color:var(--muted);max-width:690px}.accordion-item.open .accordion-panel{grid-template-rows:1fr}.accordion-item.open .accordion-panel>p{padding-bottom:23px}

.contact { padding-top:70px;background:#fff; }
.contact-shell{display:grid;grid-template-columns:.85fr 1.15fr;gap:70px;padding:64px;border-radius:30px;background:linear-gradient(135deg,#0756dc,#0b78ff);color:#fff;box-shadow:0 35px 85px rgba(9,93,226,.28);position:relative;overflow:hidden}.contact-shell::before{content:"";position:absolute;width:560px;height:560px;border:1px solid rgba(255,255,255,.13);border-radius:50%;left:-300px;bottom:-330px;box-shadow:0 0 0 55px rgba(255,255,255,.025),0 0 0 110px rgba(255,255,255,.018)}
.contact-copy,.contact-form{position:relative;z-index:1}.contact-copy>img{width:120px;filter:drop-shadow(0 12px 25px rgba(0,0,0,.18));margin-bottom:28px}.contact-copy h2{margin:10px 0 20px;font-size:46px;line-height:1.04;letter-spacing:-2.5px}.contact-copy p{color:rgba(255,255,255,.76)}.instagram-link{display:inline-flex;align-items:center;gap:10px;margin-top:22px;padding:10px 14px;border:1px solid rgba(255,255,255,.25);border-radius:999px;background:rgba(255,255,255,.08);font-size:13px;font-weight:800}.instagram-link b{margin-left:10px}
.contact-form{display:grid;gap:16px;padding:28px;border-radius:20px;background:#fff;color:var(--ink);box-shadow:0 24px 60px rgba(3,43,120,.22)}.form-row{display:grid;grid-template-columns:repeat(2,1fr);gap:14px}.contact-form label{display:grid;gap:7px;font-size:11px;font-weight:800;color:#404858}.contact-form input,.contact-form select,.contact-form textarea{width:100%;border:1px solid #dfe5ee;background:#f9fbfe;border-radius:10px;padding:12px 13px;outline:none;color:var(--ink);transition:.2s}.contact-form textarea{resize:vertical;min-height:120px}.contact-form input:focus,.contact-form select:focus,.contact-form textarea:focus{border-color:#6ea7ff;box-shadow:0 0 0 3px rgba(11,99,246,.1);background:#fff}.contact-form .invalid{border-color:#e65252}.field-error{min-height:0;color:#d83e3e;font-size:9px}.form-footer{display:flex;justify-content:space-between;align-items:center;gap:18px}.consent{display:flex!important;grid-template-columns:auto 1fr!important;align-items:flex-start;gap:8px!important;font-weight:600!important;color:#6c7482!important;line-height:1.35}.consent input{width:15px!important;margin-top:1px;accent-color:var(--blue)}.contact-form .button-white{background:var(--ink);color:#fff;box-shadow:none;white-space:nowrap}

.site-footer{padding:70px 0 28px;background:#fff}.footer-top{display:grid;grid-template-columns:1fr 1fr 1fr;align-items:start;padding-bottom:45px;border-bottom:1px solid #e3e8ef}.footer-top p{margin:0;color:#697281}.footer-top nav{display:flex;justify-content:flex-end;gap:18px;flex-wrap:wrap;font-size:12px;font-weight:750}.footer-bottom{display:flex;justify-content:space-between;gap:20px;padding-top:22px;color:#8b94a1;font-size:10px;text-transform:uppercase;letter-spacing:.8px;font-weight:700}

.project-modal{position:fixed;inset:0;z-index:2000;display:grid;place-items:center;padding:20px}.project-modal[hidden]{display:none}.modal-backdrop{position:absolute;inset:0;background:rgba(8,12,20,.68);backdrop-filter:blur(8px)}.modal-card{position:relative;width:min(560px,100%);padding:42px;border-radius:24px;background:#fff;box-shadow:0 35px 100px rgba(0,0,0,.3);animation:modalIn .3s ease}.modal-card h2{margin:8px 0 14px;font-size:38px;letter-spacing:-2px;line-height:1.06}.modal-card p{color:var(--muted)}.modal-close{position:absolute;right:18px;top:16px;border:0;background:#edf2f8;width:36px;height:36px;border-radius:50%;font-size:22px;cursor:pointer}.modal-tags{display:flex;flex-wrap:wrap;gap:7px;margin:24px 0}.modal-tags span{padding:7px 10px;border-radius:999px;background:#edf4ff;color:#1554b5;font-size:10px;font-weight:800}.modal-actions{display:flex;align-items:center;justify-content:space-between;gap:18px;margin-top:17px}@keyframes modalIn{from{opacity:0;transform:translateY(18px) scale(.97)}to{opacity:1;transform:none}}
.toast{position:fixed;right:24px;bottom:24px;z-index:3000;padding:13px 17px;border-radius:11px;background:#0d1117;color:#fff;box-shadow:0 15px 35px rgba(0,0,0,.25);font-size:12px;font-weight:700;transform:translateY(20px);opacity:0;pointer-events:none;transition:.3s}.toast.show{transform:none;opacity:1}

.reveal { opacity:0; transform:translateY(25px); transition:opacity .75s ease, transform .75s cubic-bezier(.2,.75,.25,1); transition-delay:var(--delay,0ms); }
.reveal.in-view { opacity:1; transform:none; }

@media (max-width: 1050px) {
  .desktop-cta{display:none}.main-nav{gap:20px}.hero-grid{gap:30px}.hero h1{font-size:58px}.floating-card-a{right:0}.floating-card-b{left:0}.services-grid{grid-template-columns:1fr 1fr}.service-card:last-child{grid-column:1/-1;min-height:390px}.contact-shell{gap:35px;padding:45px}.benefit-grid{grid-template-columns:1fr 1fr}.process-grid{gap:50px}.projects-grid{grid-template-columns:1fr 1fr}.project-card-wide{grid-column:1/-1;grid-row:auto}.project-card-wide .project-preview{min-height:500px}
}

@media (max-width: 800px) {
  .section{padding:80px 0}.container{width:min(100% - 28px,1180px)}.site-header{padding:10px 0;background:rgba(255,255,255,.9);backdrop-filter:blur(14px);border-bottom:1px solid #e9edf3}.menu-toggle{display:block;z-index:2;margin-left:auto}.menu-toggle[aria-expanded="true"] span:first-child{transform:translateY(7px) rotate(45deg)}.menu-toggle[aria-expanded="true"] span:nth-child(2){opacity:0}.menu-toggle[aria-expanded="true"] span:last-child{transform:translateY(-7px) rotate(-45deg)}
  .main-nav{position:fixed;inset:0;display:flex;flex-direction:column;justify-content:center;align-items:center;gap:25px;background:rgba(255,255,255,.98);transform:translateY(-100%);opacity:0;visibility:hidden;transition:.35s}.main-nav.open{transform:none;opacity:1;visibility:visible}.main-nav a{font-size:24px}.brand{z-index:2}
  .hero{min-height:auto;padding-top:130px}.hero-grid{grid-template-columns:1fr}.hero h1{font-size:clamp(46px,12vw,68px);letter-spacing:-3.2px}.hero-lead{font-size:16px}.hero-visual{min-height:500px}.stats-strip{grid-template-columns:1fr 1fr;gap:24px}.stats-strip>div{border-right:0;padding:0}.section-heading{display:block}.section-heading>p{margin-top:22px}.services-grid{grid-template-columns:1fr}.service-card:last-child{grid-column:auto}.projects-grid{grid-template-columns:1fr}.project-card-wide{grid-column:auto}.project-card-wide .project-preview{min-height:450px}.process-grid{grid-template-columns:1fr}.process-intro{position:relative;top:auto}.contact-shell,.faq-grid{grid-template-columns:1fr}.contact-copy h2{font-size:40px}.benefit-grid{grid-template-columns:1fr 1fr}.footer-top{grid-template-columns:1fr;gap:25px}.footer-top nav{justify-content:flex-start}.footer-bottom{flex-wrap:wrap}
}

@media (max-width: 560px) {
  .cursor-glow{display:none}.section{padding:68px 0}.hero{padding-top:118px}.hero h1{font-size:45px;letter-spacing:-2.8px}.hero-actions{align-items:flex-start;flex-direction:column;gap:18px}.hero-trust{gap:15px;justify-content:space-between}.hero-trust>div{display:block}.hero-trust strong{display:block}.hero-visual{min-height:390px;margin-top:16px}.visual-shell{border-radius:17px}.browser-page{min-height:310px;padding:20px}.mock-hero{margin-top:42px}.mock-hero h2{font-size:27px}.mock-cards{left:20px;right:20px;bottom:18px}.floating-card{min-width:145px;padding:10px}.floating-card-a{top:35px;right:-7px}.floating-card-b{bottom:28px;left:-7px}.code-chip{display:none}.stats-strip{margin-top:35px;padding:20px}.stats-strip strong{font-size:22px}.stats-strip span{font-size:8px}.section-heading h2,.process-intro h2,.faq-intro h2{font-size:38px;letter-spacing:-2.3px}.services-grid{gap:13px}.service-card{min-height:430px;padding:27px}.filter-bar{overflow-x:auto;flex-wrap:nowrap;padding-bottom:5px}.filter-btn{white-space:nowrap}.project-card-wide .project-preview{min-height:345px}.project-browser{height:65%}.project-layout{padding:35px 22px}.project-layout h3{font-size:26px}.project-phone{border-width:5px}.process-steps::before{left:23px}.process-step{grid-template-columns:48px 1fr;gap:18px}.step-marker{width:48px;height:48px}.contact-shell{padding:30px 20px;border-radius:22px}.contact-copy h2{font-size:35px}.benefit-grid{grid-template-columns:1fr}.benefit{min-height:auto}.benefit h3{margin-top:25px}.form-row{grid-template-columns:1fr}.form-footer{align-items:stretch;flex-direction:column}.contact-form{padding:20px}.contact-form .button{width:100%}.footer-bottom{flex-direction:column}.modal-card{padding:32px 22px}.modal-card h2{font-size:31px}.modal-actions{align-items:stretch;flex-direction:column}.modal-actions .button{width:100%}
}

@media (prefers-reduced-motion: reduce) {
  *,*::before,*::after{scroll-behavior:auto!important;animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}.cursor-glow{display:none}.reveal{opacity:1;transform:none}.marquee-track{animation:none}
}

/* === Swiftech-Art v2: motion, theme, portfolio and contact === */
:root {
  --page-bg: #ffffff;
  --page-text: #0d1117;
  --surface: #ffffff;
  --surface-2: #f4f7fc;
  --surface-3: #eaf3ff;
  --text-muted: #646b79;
  --border-theme: #dfe5ee;
}

html[data-theme="dark"] {
  color-scheme: dark;
  --page-bg: #080d14;
  --page-text: #f4f7fb;
  --surface: #0e151f;
  --surface-2: #111b28;
  --surface-3: #10223a;
  --text-muted: #a8b2c1;
  --border-theme: #253246;
}

body { background: var(--page-bg); color: var(--page-text); transition: background-color .35s ease, color .35s ease; }
.section > .container, .logo-marquee .marquee-track, .site-footer > .container { position: relative; z-index: 2; }

/* Animated light-blue background objects generated in JS */
.ambient-bg { position: fixed; inset: 0; z-index: 1; overflow: hidden; pointer-events: none; }
.ambient-item { position: absolute; left: var(--x); top: var(--y); width: var(--size); height: var(--size); transform: translate3d(0,0,0); will-change: transform; opacity: var(--opacity); }
.ambient-item i { display: block; width: 100%; height: 100%; border-radius: var(--radius, 50%); background: linear-gradient(145deg, rgba(111,190,255,.26), rgba(31,137,255,.055)); border: 1px solid rgba(76,162,255,.2); box-shadow: 0 12px 55px rgba(56,149,255,.11); animation: ambientFloat var(--duration) ease-in-out var(--delay) infinite alternate, ambientSpin calc(var(--duration) * 2.3) linear infinite; }
.ambient-item.ring i { background: transparent; border: clamp(1px, .16vw, 3px) solid rgba(84,174,255,.2); box-shadow: inset 0 0 40px rgba(58,151,255,.055), 0 20px 70px rgba(58,151,255,.09); }
.ambient-item.square i { --radius: 24%; }
.ambient-item.line { height: 3px; }
.ambient-item.line i { border-radius: 999px; background: linear-gradient(90deg, transparent, rgba(56,153,255,.36), transparent); border: 0; box-shadow: none; }
html[data-theme="dark"] .ambient-item { opacity: calc(var(--opacity) * 1.35); }
html[data-theme="dark"] .ambient-item i { background: linear-gradient(145deg, rgba(31,127,255,.16), rgba(95,187,255,.045)); border-color: rgba(84,170,255,.16); box-shadow: 0 12px 65px rgba(0,108,255,.13); }
html[data-theme="dark"] .ambient-item.ring i { background: transparent; border-color: rgba(74,164,255,.18); }
@keyframes ambientFloat { from { translate: -10px -14px; scale: .95; } to { translate: 16px 22px; scale: 1.08; } }
@keyframes ambientSpin { to { rotate: 360deg; } }

.nav-actions { display: flex; align-items: center; gap: 10px; }
.theme-toggle { position: relative; flex: 0 0 auto; width: 44px; height: 44px; border: 1px solid rgba(119,139,173,.25); border-radius: 12px; background: rgba(255,255,255,.78); color: #344156; box-shadow: 0 10px 28px rgba(24,59,115,.08); cursor: pointer; overflow: hidden; backdrop-filter: blur(14px); transition: background .25s, border-color .25s, color .25s, transform .25s; }
.theme-toggle:hover { transform: translateY(-2px); border-color: rgba(11,99,246,.38); }
.theme-icon { position: absolute; inset: 0; display: grid; place-items: center; font-size: 19px; transition: opacity .25s, transform .35s; }
.theme-icon-moon { opacity: 1; transform: rotate(0) scale(1); }
.theme-icon-sun { opacity: 0; transform: rotate(-70deg) scale(.55); }
html[data-theme="dark"] .theme-toggle { background: rgba(17,26,39,.85); color: #d8e8ff; border-color: rgba(103,155,226,.24); box-shadow: 0 10px 32px rgba(0,0,0,.24); }
html[data-theme="dark"] .theme-icon-moon { opacity: 0; transform: rotate(70deg) scale(.55); }
html[data-theme="dark"] .theme-icon-sun { opacity: 1; transform: rotate(0) scale(1); }

/* Portfolio is now a stronger proof section */
.work { padding-top: 128px; background: linear-gradient(180deg, rgba(229,242,255,.94), rgba(247,251,255,.96) 52%, rgba(255,255,255,.98)); }
.work::before { content: ""; position: absolute; inset: 0; background: radial-gradient(circle at 12% 10%, rgba(46,150,255,.15), transparent 25%), radial-gradient(circle at 88% 72%, rgba(7,93,239,.1), transparent 28%); pointer-events: none; }
.portfolio-heading { margin-bottom: 30px; }
.portfolio-heading h2 { max-width: 820px; }
.portfolio-proof { display: grid; grid-template-columns: repeat(4,1fr); gap: 10px; margin: 0 0 22px; }
.portfolio-proof > div { min-height: 112px; display: flex; flex-direction: column; justify-content: center; padding: 20px; border: 1px solid rgba(111,156,217,.2); border-radius: 16px; background: rgba(255,255,255,.76); backdrop-filter: blur(12px); box-shadow: 0 16px 42px rgba(40,93,164,.07); }
.portfolio-proof strong { color: var(--blue); font-size: 31px; line-height: 1; letter-spacing: -1.5px; }
.portfolio-proof span { margin-top: 9px; color: #526071; font-size: 11px; font-weight: 750; line-height: 1.35; }
.portfolio-note { display: flex; align-items: center; gap: 10px; margin: 0 0 26px; color: #5d6878; font-size: 12px; }
.portfolio-note span { padding: 5px 9px; border-radius: 999px; background: var(--blue); color: #fff; font-size: 9px; font-weight: 900; text-transform: uppercase; letter-spacing: 1px; }
.work .filter-bar { margin-top: 0; }
.work .project-preview { box-shadow: 0 28px 75px rgba(25,65,126,.16); border: 1px solid rgba(94,139,202,.15); }
.work .project-card-wide .project-preview { min-height: 675px; }
.work .project-meta { padding-top: 22px; }
.work .project-meta h3 { font-size: 23px; }

/* More flexible contact options */
.contact-method-fieldset, .callback-fieldset { padding: 0; margin: 0; border: 0; }
.contact-method-fieldset legend, .callback-fieldset legend { margin-bottom: 8px; color: #404858; font-size: 11px; font-weight: 800; }
.contact-method-grid { display: grid; grid-template-columns: repeat(2,1fr); gap: 9px; }
.contact-method { position: relative; display: block !important; cursor: pointer; }
.contact-method input { position: absolute; opacity: 0; pointer-events: none; }
.contact-method > span { display: grid; gap: 2px; min-height: 64px; padding: 12px 14px; border: 1px solid #dfe5ee; border-radius: 12px; background: #f8fafe; transition: .2s; }
.contact-method > span b { color: #1f2937; font-size: 13px; }
.contact-method > span small { color: #7b8492; font-size: 9px; font-weight: 650; }
.contact-method.active > span { border-color: var(--blue); background: #edf5ff; box-shadow: 0 0 0 3px rgba(11,99,246,.08); }
.contact-method.active > span b { color: var(--blue); }
.contact-data-row > label[hidden], .callback-fieldset[hidden] { display: none !important; }
.callback-options { display: grid; grid-template-columns: repeat(5,1fr); gap: 7px; }
.callback-options label { position: relative; display: block !important; cursor: pointer; }
.callback-options input { position: absolute; opacity: 0; pointer-events: none; }
.callback-options span { display: grid; gap: 2px; min-height: 55px; padding: 9px 8px; border: 1px solid #dfe5ee; border-radius: 10px; background: #f8fafe; color: #354052; font-size: 10px; transition: .2s; }
.callback-options small { color: #818b99; font-size: 8px; font-weight: 650; }
.callback-options input:checked + span { border-color: var(--blue); background: #edf5ff; color: var(--blue); box-shadow: 0 0 0 2px rgba(11,99,246,.07); }

/* Complete dark theme */
html[data-theme="dark"] body { background: #080d14; color: #f3f6fb; }
html[data-theme="dark"] ::selection { background: rgba(59,147,255,.3); color: #fff; }
html[data-theme="dark"] .preloader { background: #080d14; }
html[data-theme="dark"] .loader-line { background: #1d2939; }
html[data-theme="dark"] .site-header.scrolled { background: rgba(8,13,20,.86); border-color: rgba(62,79,103,.58); box-shadow: 0 8px 30px rgba(0,0,0,.22); }
html[data-theme="dark"] .main-nav a { color: #c4cfdd; }
html[data-theme="dark"] .menu-toggle span { background: #f2f6fb; }
html[data-theme="dark"] .hero { background: radial-gradient(circle at 78% 18%, rgba(27,125,255,.16), transparent 31%), linear-gradient(180deg,#080d14 0%,#0a111c 72%,#0e1724 100%); }
html[data-theme="dark"] .eyebrow { border-color: rgba(77,155,255,.25); background: rgba(14,25,39,.75); color: #a9caff; box-shadow: 0 10px 30px rgba(0,0,0,.15); }
html[data-theme="dark"] .hero-lead, html[data-theme="dark"] .section-heading > p, html[data-theme="dark"] .service-card p, html[data-theme="dark"] .faq-intro p { color: #a7b2c1; }
html[data-theme="dark"] .hero-trust span { color: #a5afbd; }
html[data-theme="dark"] .visual-shell { border-color: rgba(93,127,176,.28); box-shadow: 0 36px 90px rgba(0,0,0,.42), 0 0 0 8px rgba(17,27,41,.64); }
html[data-theme="dark"] .floating-card { background: rgba(14,23,35,.88); border-color: rgba(89,124,174,.3); color: #eef5ff; box-shadow: 0 18px 45px rgba(0,0,0,.28); }
html[data-theme="dark"] .floating-card small { color: #98a7bb; }
html[data-theme="dark"] .stats-strip { background: rgba(14,22,34,.8); border-color: rgba(75,101,138,.24); box-shadow: 0 22px 60px rgba(0,0,0,.18); }
html[data-theme="dark"] .stats-strip span { color: #9ba7b8; }
html[data-theme="dark"] .logo-marquee { background: #0d1520; border-color: #202d3e; }
html[data-theme="dark"] .services, html[data-theme="dark"] .contact { background: #080d14; }
html[data-theme="dark"] .service-card { background: #0e151f; border-color: #233044; }
html[data-theme="dark"] .service-card:hover { border-color: rgba(69,149,255,.42); box-shadow: 0 24px 70px rgba(0,0,0,.28); }
html[data-theme="dark"] .service-card ul { color: #b7c2d0; }
html[data-theme="dark"] .service-card > a { border-color: #263448; }
html[data-theme="dark"] .service-icon { background: #10243f; }
html[data-theme="dark"] .work { background: linear-gradient(180deg, rgba(13,28,47,.97), rgba(10,19,30,.98) 54%, rgba(8,13,20,.99)); }
html[data-theme="dark"] .portfolio-proof > div { background: rgba(14,25,39,.74); border-color: rgba(70,132,213,.23); box-shadow: 0 16px 42px rgba(0,0,0,.2); }
html[data-theme="dark"] .portfolio-proof span, html[data-theme="dark"] .portfolio-note { color: #aeb9c8; }
html[data-theme="dark"] .filter-btn { background: #111b28; border-color: #28384e; color: #aeb9c8; }
html[data-theme="dark"] .filter-btn:hover, html[data-theme="dark"] .filter-btn.active { background: #1978ff; border-color: #1978ff; color: #fff; }
html[data-theme="dark"] .project-meta h3 { color: #edf4ff; }
html[data-theme="dark"] .project-open { background: #101a27; border-color: #2a3a50; color: #d9e7f8; }
html[data-theme="dark"] .differentiators { background: #080d14; }
html[data-theme="dark"] .benefit { background: #0e151f; border-color: #233044; }
html[data-theme="dark"] .benefit p { color: #a7b2c1; }
html[data-theme="dark"] .faq { background: #0d1520; }
html[data-theme="dark"] .accordion-item { border-color: #283548; }
html[data-theme="dark"] .accordion-item button { color: #eef4fc; }
html[data-theme="dark"] .accordion-item button b { background: #172235; }
html[data-theme="dark"] .accordion-panel > p { color: #a8b3c2; }
html[data-theme="dark"] .contact-form { background: #0e151f; color: #f2f6fb; box-shadow: 0 24px 60px rgba(0,0,0,.28); }
html[data-theme="dark"] .contact-form label, html[data-theme="dark"] .contact-method-fieldset legend, html[data-theme="dark"] .callback-fieldset legend { color: #c5d0df; }
html[data-theme="dark"] .contact-form input, html[data-theme="dark"] .contact-form select, html[data-theme="dark"] .contact-form textarea { border-color: #2a384b; background: #111b28; color: #eff5fc; }
html[data-theme="dark"] .contact-form input:focus, html[data-theme="dark"] .contact-form select:focus, html[data-theme="dark"] .contact-form textarea:focus { background: #142033; }
html[data-theme="dark"] .contact-method > span, html[data-theme="dark"] .callback-options span { background: #111b28; border-color: #29394e; }
html[data-theme="dark"] .contact-method > span b, html[data-theme="dark"] .callback-options span { color: #dbe7f5; }
html[data-theme="dark"] .contact-method > span small, html[data-theme="dark"] .callback-options small { color: #8f9caf; }
html[data-theme="dark"] .contact-method.active > span, html[data-theme="dark"] .callback-options input:checked + span { background: #10284a; border-color: #3088ff; }
html[data-theme="dark"] .consent { color: #9eabbc !important; }
html[data-theme="dark"] .contact-form .button-white { background: #eaf2ff; color: #0d1117; }
html[data-theme="dark"] .site-footer { background: #080d14; }
html[data-theme="dark"] .footer-top { border-color: #243044; }
html[data-theme="dark"] .footer-top p, html[data-theme="dark"] .footer-bottom { color: #8f9bac; }
html[data-theme="dark"] .modal-card { background: #0f1722; color: #f2f6fc; }
html[data-theme="dark"] .modal-card p { color: #a7b2c1; }
html[data-theme="dark"] .modal-close { background: #1b283a; color: #eaf2ff; }
html[data-theme="dark"] .modal-tags span { background: #10284a; color: #9fc5ff; }
html[data-theme="dark"] .toast { background: #edf4ff; color: #0d1117; }

@media (max-width: 1050px) {
  .callback-options { grid-template-columns: repeat(3,1fr); }
  .portfolio-proof { grid-template-columns: repeat(2,1fr); }
}

@media (max-width: 800px) {
  .nav-actions { margin-left: auto; }
  .menu-toggle { margin-left: 0; }
  .theme-toggle { width: 40px; height: 40px; border-radius: 10px; z-index: 2; }
  html[data-theme="dark"] .site-header { background: rgba(8,13,20,.9); border-color: #1d2a3b; }
  html[data-theme="dark"] .main-nav { background: rgba(8,13,20,.98); }
  .work .project-card-wide .project-preview { min-height: 500px; }
}

@media (max-width: 560px) {
  .ambient-item:nth-child(n+10) { display: none; }
  .portfolio-proof { grid-template-columns: 1fr 1fr; }
  .portfolio-proof > div { min-height: 104px; padding: 16px; }
  .portfolio-proof strong { font-size: 25px; }
  .portfolio-note { align-items: flex-start; }
  .contact-method-grid { grid-template-columns: 1fr 1fr; }
  .callback-options { grid-template-columns: repeat(2,1fr); }
  .nav-actions .desktop-cta { display: none; }
}

@media (prefers-reduced-motion: reduce) {
  .ambient-item i { animation: none !important; }
  .ambient-item { transform: none !important; }
  .theme-icon { transition: none; }
}

/* === Swiftech-Art v3: direct contact and richer motion === */

.ambient-bg::before,
.ambient-bg::after {
  content: "";
  position: absolute;
  pointer-events: none;
  will-change: transform;
}
.ambient-bg::before {
  inset: -35%;
  opacity: .26;
  background-image:
    linear-gradient(rgba(69,159,255,.08) 1px, transparent 1px),
    linear-gradient(90deg, rgba(69,159,255,.08) 1px, transparent 1px);
  background-size: 74px 74px;
  mask-image: radial-gradient(circle at 50% 45%, #000 0 34%, transparent 72%);
  animation: motionGridDrift 34s linear infinite;
}
.ambient-bg::after {
  width: 62vw;
  height: 62vw;
  min-width: 620px;
  min-height: 620px;
  right: -22vw;
  top: 18vh;
  border-radius: 50%;
  opacity: .24;
  filter: blur(28px);
  background: conic-gradient(from 35deg, transparent, rgba(99,190,255,.28), transparent 36%, rgba(20,111,255,.14), transparent 72%);
  animation: auroraOrbit 25s ease-in-out infinite alternate;
}
html[data-theme="dark"] .ambient-bg::before { opacity: .17; }
html[data-theme="dark"] .ambient-bg::after { opacity: .34; }
@keyframes motionGridDrift { to { transform: translate3d(74px,74px,0) rotate(.001deg); } }
@keyframes auroraOrbit {
  0% { transform: translate3d(-7vw,-8vh,0) rotate(0deg) scale(.88); }
  55% { transform: translate3d(-21vw,18vh,0) rotate(110deg) scale(1.08); }
  100% { transform: translate3d(-4vw,44vh,0) rotate(220deg) scale(.94); }
}
.ambient-item.dot { width: 12px !important; height: 12px !important; }
.ambient-item.dot i { border-radius: 50%; background: rgba(55,156,255,.62); border: 0; box-shadow: 0 0 0 8px rgba(65,164,255,.08), 0 0 28px rgba(25,132,255,.38); }
.ambient-item.cross i { position: relative; background: transparent; border: 0; box-shadow: none; }
.ambient-item.cross i::before,
.ambient-item.cross i::after { content:""; position:absolute; left:50%; top:50%; border-radius:999px; background:rgba(53,151,255,.28); transform:translate(-50%,-50%); }
.ambient-item.cross i::before { width:100%; height:2px; }
.ambient-item.cross i::after { width:2px; height:100%; }

.cursor-trail-dot {
  position: fixed;
  left: 0;
  top: 0;
  width: 7px;
  height: 7px;
  z-index: 950;
  border-radius: 50%;
  background: rgba(45,149,255,.62);
  box-shadow: 0 0 18px rgba(31,136,255,.42);
  pointer-events: none;
  transform: translate3d(-50%,-50%,0);
  opacity: 0;
  will-change: left, top, opacity, transform;
}

.section-motion-rail {
  position: absolute;
  z-index: 1;
  width: min(560px, 44vw);
  height: 1px;
  pointer-events: none;
  background: linear-gradient(90deg, transparent, rgba(34,139,255,.5), transparent);
  filter: drop-shadow(0 0 9px rgba(23,129,255,.3));
  animation: railSweep 9s ease-in-out infinite alternate;
}
.section-motion-rail::after {
  content:"";
  position:absolute;
  top:50%;
  left:50%;
  width:9px;
  height:9px;
  border-radius:50%;
  background:#63b6ff;
  box-shadow:0 0 0 7px rgba(59,159,255,.08), 0 0 20px rgba(42,146,255,.55);
  transform:translate(-50%,-50%);
  animation: railNode 4.5s ease-in-out infinite alternate;
}
.section-motion-rail.rail-a { left: -6vw; top: 18%; transform: rotate(-12deg); }
.section-motion-rail.rail-b { right: -8vw; bottom: 17%; transform: rotate(14deg); animation-delay: -4.5s; }
@keyframes railSweep { from { translate: -5vw -14px; opacity:.25; } to { translate: 8vw 18px; opacity:.8; } }
@keyframes railNode { from { left: 12%; } to { left: 88%; } }


.motion-surface { isolation:isolate; }
.motion-surface .surface-glow { position:absolute; z-index:0; left:0; top:0; width:260px; height:260px; border-radius:50%; background:radial-gradient(circle, rgba(71,163,255,.16), transparent 68%); transform:translate3d(calc(var(--surface-x, -400px) - 50%), calc(var(--surface-y, -400px) - 50%), 0); pointer-events:none; opacity:0; transition:opacity .25s; }
.motion-surface:hover .surface-glow { opacity:1; }
.service-card.motion-surface > :not(.surface-glow),
.benefit.motion-surface > :not(.surface-glow),
.portfolio-proof > div.motion-surface > :not(.surface-glow),
.contact-form.motion-surface > :not(.surface-glow) { position:relative; z-index:1; }
.project-preview { transition: transform .45s cubic-bezier(.2,.75,.25,1), box-shadow .45s ease; }
.project-preview::after { content:""; position:absolute; inset:-35%; z-index:10; background:linear-gradient(115deg, transparent 38%, rgba(255,255,255,.34) 48%, transparent 58%); transform:translateX(-68%) rotate(4deg); transition:transform .8s cubic-bezier(.2,.75,.25,1); pointer-events:none; }
.project-card:hover .project-preview { transform:translateY(-7px) scale(1.008); box-shadow:0 34px 86px rgba(21,70,143,.2); }
.project-card:hover .project-preview::after { transform:translateX(68%) rotate(4deg); }
.button { position:relative; overflow:hidden; }
.button::after { content:""; position:absolute; top:-120%; left:-38%; width:24%; height:340%; background:linear-gradient(90deg, transparent, rgba(255,255,255,.32), transparent); transform:rotate(18deg) translateX(-220%); transition:transform .65s ease; pointer-events:none; }
.button:hover::after { transform:rotate(18deg) translateX(650%); }

.contact { overflow:hidden; }
.form-status { min-height:0; margin:-2px 0 0; padding:0; border-radius:11px; font-size:11px; font-weight:750; line-height:1.45; opacity:0; transform:translateY(5px); transition:opacity .25s, transform .25s, padding .25s, background .25s; }
.form-status.show { min-height:40px; padding:11px 13px; opacity:1; transform:none; }
.form-status.success { background:#e8f8ef; color:#187143; }
.form-status.info { background:#edf5ff; color:#175cae; }
.form-status.error { background:#fff0f0; color:#b52c2c; }
.contact-form.is-sending { pointer-events:none; }
.contact-form.is-sending .button { opacity:.72; }
.contact-form .button .submit-spinner { width:15px; height:15px; border:2px solid currentColor; border-right-color:transparent; border-radius:50%; animation:submitSpin .65s linear infinite; }
@keyframes submitSpin { to { transform:rotate(360deg); } }
html[data-theme="dark"] .form-status.success { background:#123527; color:#9de4bd; }
html[data-theme="dark"] .form-status.info { background:#10294b; color:#a8ceff; }
html[data-theme="dark"] .form-status.error { background:#3a1d24; color:#ffc0c8; }

@media (max-width: 800px) {
  .section-motion-rail { width:70vw; opacity:.6; }
  .ambient-bg::before { background-size:54px 54px; }
  .cursor-trail-dot { display:none; }
}
@media (prefers-reduced-motion: reduce) {
  .ambient-bg::before,.ambient-bg::after,.section-motion-rail,.section-motion-rail::after,
  .cursor-trail-dot,.button::after,.project-preview::after { animation:none!important; transition:none!important; }
}
.contact-form .button .submit-spinner { display:inline-block; flex:0 0 auto; }