:root {
  --bg: #ffffff;
  --bg-soft: #f7f9fc;
  --text: #111827;
  --muted: #64748b;
  --line: #e7ebf1;
  --dark: #0b1120;
  --dark-2: #101827;
  --red: #ff4d3d;
  --red-deep: #f13c2f;
  --blue: #249cff;
  --cyan: #29c7e8;
  --shadow: 0 24px 70px rgba(15, 23, 42, .10);
  --radius: 24px;
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body { margin: 0; font-family: Inter, sans-serif; color: var(--text); background: var(--bg); overflow-x: hidden; }
a { color: inherit; text-decoration: none; }
img { max-width: 100%; display: block; }
.container { width: min(1180px, calc(100% - 40px)); margin: 0 auto; }
.section-pad { padding: 112px 0; position: relative; }
.section-soft { background: var(--bg-soft); }

.page-glow { position: fixed; width: 420px; height: 420px; border-radius: 50%; filter: blur(90px); opacity: .10; pointer-events: none; z-index: -2; }
.glow-one { background: var(--red); left: -160px; top: 120px; }
.glow-two { background: var(--blue); right: -180px; top: 320px; }

.site-header { position: sticky; top: 0; z-index: 50; background: rgba(255,255,255,.86); backdrop-filter: blur(18px); border-bottom: 1px solid rgba(231,235,241,.75); }
.nav-wrap { height: 94px; display: flex; align-items: center; justify-content: space-between; gap: 28px; }
.brand { width: 260px; height: 84px; overflow: hidden; display: flex; align-items: center; }
.brand img { width: 250px; transform: scale(1.3); transform-origin: center; }
.nav { display: flex; align-items: center; gap: 30px; margin-left: auto; }
.nav a { font-size: 14px; color: #475569; font-weight: 600; transition: .25s ease; }
.nav a:hover { color: var(--text); }
.nav-toggle { display: none; background: none; border: 0; padding: 8px; }
.nav-toggle span { display: block; width: 24px; height: 2px; background: var(--text); margin: 5px 0; }

.btn { min-height: 50px; padding: 0 22px; border-radius: 13px; display: inline-flex; align-items: center; justify-content: center; font-weight: 700; font-size: 14px; transition: transform .25s ease, box-shadow .25s ease, background .25s ease; }
.btn:hover { transform: translateY(-2px); }
.btn-primary { color: #fff; background: linear-gradient(115deg, var(--red) 0%, var(--red-deep) 40%, var(--blue) 100%); box-shadow: 0 14px 30px rgba(37, 156, 255, .18), 0 10px 24px rgba(255,77,61,.14); }
.btn-secondary { border: 1px solid var(--line); background: #fff; color: var(--text); }
.btn-small { min-height: 44px; padding: 0 18px; }
.btn-light { background: #fff; color: var(--dark); }

.hero { padding-top: 90px; min-height: calc(100vh - 84px); display: flex; align-items: center; }
.hero-grid { display: grid; grid-template-columns: 1.02fr .98fr; gap: 72px; align-items: center; }
.eyebrow { display: inline-flex; align-items: center; gap: 10px; font-size: 12px; text-transform: uppercase; letter-spacing: .16em; font-weight: 800; color: #5e6b7d; margin-bottom: 18px; }
.eyebrow span { width: 26px; height: 2px; background: linear-gradient(90deg, var(--red), var(--blue)); }
h1,h2,h3 { font-family: Manrope, sans-serif; margin-top: 0; }
h1 { font-size: clamp(44px, 5.5vw, 76px); line-height: 1.02; letter-spacing: -.045em; margin-bottom: 24px; }
h2 { font-size: clamp(34px, 4vw, 54px); line-height: 1.08; letter-spacing: -.035em; margin-bottom: 20px; }
h3 { font-size: 20px; letter-spacing: -.02em; }
.gradient-text { background: linear-gradient(110deg, var(--red) 0%, #ff6559 35%, var(--blue) 70%, var(--cyan) 100%); -webkit-background-clip: text; background-clip: text; color: transparent; }
.hero-lead { color: var(--muted); line-height: 1.8; font-size: 18px; max-width: 680px; margin: 0 0 32px; }
.hero-actions { display: flex; flex-wrap: wrap; gap: 12px; }
.hero-proof { display: grid; grid-template-columns: repeat(3,1fr); gap: 16px; margin-top: 48px; padding-top: 28px; border-top: 1px solid var(--line); }
.hero-proof div { display: flex; flex-direction: column; gap: 5px; }
.hero-proof strong { font: 800 27px/1 Manrope, sans-serif; }
.hero-proof span { color: var(--muted); font-size: 12px; line-height: 1.5; }

.hero-visual { min-height: 520px; display: flex; align-items: center; justify-content: center; position: relative; }
.visual-orbit { position: absolute; border: 1px solid #dbe4ef; border-radius: 50%; }
.orbit-one { width: 470px; height: 470px; }
.orbit-two { width: 365px; height: 365px; border-style: dashed; animation: spin 28s linear infinite; }
.code-panel { width: 390px; min-height: 360px; border-radius: 26px; background: rgba(255,255,255,.95); box-shadow: var(--shadow); border: 1px solid #edf0f5; position: relative; z-index: 2; padding-bottom: 24px; transform: rotate(-1.5deg); }
.panel-top { height: 54px; border-bottom: 1px solid var(--line); padding: 0 18px; display: flex; align-items: center; justify-content: space-between; color: #8a94a3; font-size: 11px; }
.panel-dots { display: flex; gap: 6px; }.panel-dots i { width: 8px; height: 8px; border-radius: 50%; background: #d7dde7; }.panel-dots i:first-child { background: var(--red); }.panel-dots i:last-child { background: var(--blue); }
.code-lines { font-family: "SFMono-Regular", Consolas, monospace; font-size: 13px; line-height: 2.15; padding: 30px 24px 18px; color: #334155; }
.code-lines p { margin: 0; }.code-lines .indent { padding-left: 22px; }.code-lines em { color: #0f766e; font-style: normal; }.code-lines .red { color: var(--red); }.code-lines .blue { color: var(--blue); }
.stack-badges { display: flex; flex-wrap: wrap; gap: 8px; padding: 0 24px; }.stack-badges span { background: #f6f8fb; border: 1px solid #e9edf2; color: #475569; border-radius: 9px; padding: 8px 10px; font-size: 11px; font-weight: 700; }
.floating-card { position: absolute; z-index: 4; background: #fff; box-shadow: 0 18px 45px rgba(15,23,42,.13); padding: 13px 16px; border-radius: 13px; font-weight: 700; font-size: 12px; border: 1px solid #edf0f4; }
.fc-one { left: 0; bottom: 100px; }.fc-two { right: -10px; top: 105px; }.status-dot { display: inline-block; width: 8px; height: 8px; background: #22c55e; border-radius: 50%; margin-right: 7px; }

.trusted-bar { border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); padding: 24px 0; }
.trusted-content { display: flex; align-items: center; gap: 34px; color: #7b8797; font-size: 12px; }
.industry-list { display: flex; flex-wrap: wrap; gap: 30px; }.industry-list b { color: #475569; font-size: 13px; }

.split-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 90px; align-items: start; }
.section-heading p { max-width: 680px; color: var(--muted); line-height: 1.8; }
.section-heading.centered { text-align: center; max-width: 790px; margin: 0 auto 54px; }.section-heading.centered p { margin-left:auto;margin-right:auto; }
.about-copy { color: var(--muted); font-size: 16px; line-height: 1.85; }
.founder-card { margin-top: 30px; display: flex; align-items: center; gap: 14px; padding: 18px; border: 1px solid var(--line); border-radius: 18px; background: #fff; }
.founder-avatar { width: 48px; height: 48px; border-radius: 14px; display: grid; place-items: center; color: #fff; font-weight: 800; background: linear-gradient(135deg,var(--red),var(--blue)); }
.founder-card strong,.founder-card span { display:block; }.founder-card strong { color: var(--text); font-size: 14px; }.founder-card span { margin-top: 4px; font-size: 12px; }

.service-grid { display: grid; grid-template-columns: repeat(3,1fr); gap: 18px; }
.service-card { background: #fff; border: 1px solid #e9edf2; border-radius: 22px; padding: 28px; transition: .25s ease; }
.service-card:hover { transform: translateY(-5px); box-shadow: 0 18px 45px rgba(15,23,42,.07); }
.service-card p { color: var(--muted); line-height: 1.7; font-size: 14px; }
.service-card ul { list-style: none; padding: 0; margin: 18px 0 0; display: grid; gap: 8px; color: #526074; font-size: 12px; }.service-card li:before { content: "•"; color: var(--blue); font-weight: 900; margin-right: 8px; }
.icon-box { width: 46px; height: 46px; border-radius: 13px; display: grid; place-items: center; margin-bottom: 22px; font-family: Manrope,sans-serif; font-weight: 800; border: 1px solid transparent; }.flutter { color: var(--blue); background:#edf7ff;border-color:#d6edff }.laravel { color:var(--red);background:#fff1ef;border-color:#ffdcd7 }.api { color:#7c3aed;background:#f5f0ff;border-color:#e7dcff }.web { color:#0f766e;background:#edfffb;border-color:#d5f8f1 }.cloud { color:#d97706;background:#fff8e6;border-color:#f7ebc7 }.deploy { color:#2563eb;background:#eef4ff;border-color:#dce8ff }

.stack-section { overflow:hidden; }
.tech-cloud { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 40px; }.tech-cloud span { padding: 14px 18px; border: 1px solid var(--line); border-radius: 12px; background: #fff; color: #475569; font-size: 13px; font-weight: 700; box-shadow: 0 8px 22px rgba(15,23,42,.04); }

.section-dark { background: radial-gradient(circle at 18% 0%, rgba(255,77,61,.13), transparent 25%), radial-gradient(circle at 82% 18%, rgba(36,156,255,.15), transparent 26%), var(--dark); color: #fff; }
.section-heading.light p { color: #94a3b8; }.section-dark .eyebrow { color: #a7b1c0; }
.project-grid { display:grid;grid-template-columns:repeat(3,1fr);gap:18px; }
.project-card { min-height: 280px; border:1px solid rgba(255,255,255,.10);border-radius:22px;padding:26px;background:rgba(255,255,255,.055);backdrop-filter:blur(10px);transition:.25s ease; }.project-card:hover { transform:translateY(-5px);border-color:rgba(255,255,255,.2);background:rgba(255,255,255,.08); }
.project-meta { display:flex;justify-content:space-between;align-items:center;margin-bottom:34px; }.project-meta span { font-size:10px;text-transform:uppercase;letter-spacing:.14em;font-weight:800;color:#cbd5e1; }.project-meta small { font-size:10px;color:#718096; }
.project-card h3 { font-size:24px;margin-bottom:12px; }.project-card p { color:#9aa8ba;line-height:1.7;font-size:13px;min-height:66px; }
.project-tags { display:flex;flex-wrap:wrap;gap:7px;margin-top:22px; }.project-tags b { font-size:9px;letter-spacing:.04em;padding:7px 9px;border-radius:8px;background:rgba(255,255,255,.07);color:#cbd5e1; }
.projects-cta { text-align:center;margin-top:36px; }

.process-grid { display:grid;grid-template-columns:repeat(4,1fr);gap:1px;background:var(--line);border:1px solid var(--line);border-radius:22px;overflow:hidden; }
.process-step { background:#fff;padding:30px;min-height:220px; }.process-step b { display:block;color:var(--blue);font:800 12px/1 Manrope,sans-serif;margin-bottom:48px; }.process-step p { color:var(--muted);font-size:13px;line-height:1.7; }

.contact-section { padding-top: 20px; }
.contact-card { padding: 58px; border:1px solid var(--line);border-radius:28px;background:linear-gradient(135deg,#fff 0%,#f8fbff 55%,#fff6f4 100%);display:grid;grid-template-columns:1.2fr .8fr;gap:60px;align-items:center;box-shadow:var(--shadow); }
.contact-card h2 { font-size:clamp(32px,3.6vw,48px);margin-bottom:16px; }.contact-card p { color:var(--muted);line-height:1.7;max-width:700px; }.contact-actions { display:grid;gap:10px; }

.footer { margin-top:100px;border-top:1px solid var(--line);background:#fafbfc; }.footer-grid { padding:58px 0;display:grid;grid-template-columns:2fr 1fr 1fr;gap:60px; }.footer-brand img { width:230px;height:70px;object-fit:cover; }.footer-brand p { color:var(--muted);font-size:13px;max-width:360px;line-height:1.7; }.footer-links { display:grid;align-content:start;gap:10px; }.footer-links strong { font-size:13px;margin-bottom:6px; }.footer-links a { color:var(--muted);font-size:12px; }.footer-bottom { min-height:64px;border-top:1px solid var(--line);display:flex;align-items:center;justify-content:space-between;color:#8a94a3;font-size:11px; }

.reveal { opacity:0;transform:translateY(18px);transition:opacity .7s ease,transform .7s ease; }.reveal.visible { opacity:1;transform:none; }.delay-1 { transition-delay:.08s }.delay-2 { transition-delay:.16s }.delay-3 { transition-delay:.24s }
@keyframes spin { to { transform:rotate(360deg) } }

@media (max-width: 1024px) {
  .hero-grid,.split-grid,.contact-card { grid-template-columns:1fr; }
  .hero { min-height:auto; }.hero-copy { max-width:760px; }
  .hero-visual { min-height:480px; }.service-grid,.project-grid { grid-template-columns:repeat(2,1fr); }
  .process-grid { grid-template-columns:repeat(2,1fr); }
  .desktop-cta { display:none; }.nav { margin-left:0; }
}
@media (max-width: 760px) {
  .container { width:min(100% - 28px,1180px); }.section-pad { padding:80px 0; }.nav-wrap { height:72px; }.brand { width:190px;height:56px; }.brand img { width:215px; }
  .nav-toggle { display:block;margin-left:auto; }.nav { display:none;position:absolute;top:72px;left:14px;right:14px;background:#fff;border:1px solid var(--line);border-radius:16px;padding:18px;box-shadow:var(--shadow);flex-direction:column;align-items:flex-start;gap:18px; }.nav.open { display:flex; }
  .hero { padding-top:56px; }.hero-grid { gap:32px; }.hero-lead { font-size:16px; }.hero-actions { flex-direction:column;align-items:stretch; }.hero-proof { grid-template-columns:1fr; }.hero-visual { min-height:420px; }.code-panel { width:min(92%,360px); }.orbit-one { width:360px;height:360px; }.orbit-two { width:285px;height:285px; }.fc-one { left:0;bottom:42px; }.fc-two { right:0;top:55px; }
  .trusted-content { align-items:flex-start;flex-direction:column;gap:14px; }.industry-list { gap:16px 22px; }
  .service-grid,.project-grid,.process-grid,.footer-grid { grid-template-columns:1fr; }.section-heading.centered { margin-bottom:40px; }.split-grid { gap:34px; }
  .contact-card { padding:34px 24px;gap:28px; }.footer-grid { gap:34px; }.footer-bottom { flex-direction:column;align-items:flex-start;justify-content:center;gap:5px;padding:16px 0; }.footer { margin-top:70px; }
}