@import url('https://fonts.googleapis.com/css2?family=Plus+Jakarta+Sans:wght@400;500;600;700;750;800&family=Inter:wght@400;500;600&family=JetBrains+Mono:wght@400;500;700&display=swap');

:root {
  --background: #07090e;
  --foreground: #f8fafc;
  --card: #111827;
  --card-foreground: #f8fafc;
  --popover: #111827;
  --popover-foreground: #f8fafc;
  --primary: #00f0ff;
  --primary-foreground: #061014;
  --secondary: #162032;
  --secondary-foreground: #e2e8f0;
  --muted: #111827;
  --muted-foreground: #94a3b8;
  --accent: #102a37;
  --accent-foreground: #7ee7f8;
  --destructive: #ef4444;
  --border: rgba(148, 163, 184, 0.16);
  --input: rgba(148, 163, 184, 0.2);
  --ring: #00f0ff;
  --radius: 0.7rem;
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body { margin: 0; background: #07090e; color: #f8fafc; font-family: 'Inter', sans-serif; }
button, a { -webkit-tap-highlight-color: transparent; }
button { font: inherit; }
img { max-width: 100%; display: block; }
::selection { background: #00f0ff; color: #071017; }

.site-shell { overflow: hidden; background: #07090e; }
.container { width: min(1160px, calc(100% - 48px)); margin: 0 auto; }
.section { padding: 126px 0; }
.section-grid { position: relative; background-image: linear-gradient(rgba(0, 240, 255, .045) 1px, transparent 1px), linear-gradient(90deg, rgba(0, 240, 255, .045) 1px, transparent 1px); background-size: 64px 64px; }
.section-grid::before { content: ""; position: absolute; inset: 0; background: radial-gradient(circle at 78% 24%, rgba(0, 240, 255, .11), transparent 27%), linear-gradient(90deg, #07090e 0%, rgba(7, 9, 14, .88) 51%, rgba(7, 9, 14, .55) 100%); pointer-events: none; }
.site-header { position: fixed; z-index: 40; top: 0; width: 100%; border-bottom: 1px solid rgba(148,163,184,.11); background: rgba(7, 9, 14, .76); backdrop-filter: blur(18px); }
.header-inner { min-height: 76px; display: flex; align-items: center; justify-content: space-between; gap: 28px; }
.brand-lockup { display: inline-flex; align-items: center; gap: 11px; color: #f8fafc; border: 0; padding: 0; background: transparent; cursor: pointer; text-align: left; }
.brand-mark { display: grid; place-items: center; width: 31px; height: 31px; border: 1px solid #00f0ff; border-radius: 8px; color: #00f0ff; font: 700 10px/1 'JetBrains Mono', monospace; letter-spacing: -.08em; box-shadow: 0 0 18px rgba(0,240,255,.18); }
.brand-copy { font-family: 'Plus Jakarta Sans', sans-serif; font-size: 13px; font-weight: 750; letter-spacing: -.03em; }
.brand-copy span { display: block; color: #7ee7f8; font: 10px/1.3 'JetBrains Mono', monospace; letter-spacing: .08em; text-transform: uppercase; }
.desktop-nav { display: flex; align-items: center; gap: 30px; margin-left: auto; }
.desktop-nav button { border: 0; background: transparent; color: #94a3b8; cursor: pointer; font-size: 12px; transition: color .22s ease, transform .22s ease; }
.desktop-nav button:hover { color: #00f0ff; transform: translateY(-1px); }
.header-cta { display: inline-flex; align-items: center; gap: 8px; border: 1px solid rgba(0,240,255,.42); border-radius: 5px; padding: 10px 13px; color: #7ee7f8; font-size: 11px; text-decoration: none; transition: background .22s ease, box-shadow .22s ease, transform .22s ease; }
.header-cta:hover { background: rgba(0,240,255,.09); box-shadow: 0 0 24px rgba(0,240,255,.13); transform: translateY(-2px); }
.menu-toggle { display: none; color: #f8fafc; border: 0; background: transparent; cursor: pointer; }

.hero-section { min-height: 770px; padding: 158px 0 0; }
.hero-layout { position: relative; z-index: 1; display: grid; grid-template-columns: minmax(0, 1fr) minmax(390px, .82fr); gap: 90px; align-items: center; min-height: 530px; }
.hero-copy { padding: 22px 0 54px; }
.status-pill { width: fit-content; display: flex; align-items: center; gap: 9px; margin-bottom: 29px; border: 1px solid rgba(0,240,255,.2); border-radius: 999px; padding: 7px 11px; color: #7ee7f8; background: rgba(0,240,255,.045); font: 10px 'JetBrains Mono', monospace; letter-spacing: .02em; }
.status-dot, .terminal-live-dot { width: 6px; height: 6px; display: inline-block; border-radius: 50%; background: #10b981; box-shadow: 0 0 0 4px rgba(16,185,129,.11); }
.eyebrow { margin: 0 0 17px; color: #00f0ff; font: 10px 'JetBrains Mono', monospace; letter-spacing: .19em; text-transform: uppercase; }
.dark-eyebrow { color: #048b9c; }
h1, h2, h3, p { margin-top: 0; }
h1, h2, h3 { font-family: 'Plus Jakarta Sans', sans-serif; }
.hero-copy h1 { max-width: 680px; margin-bottom: 24px; color: #f8fafc; font-size: clamp(44px, 6vw, 76px); font-weight: 750; line-height: .99; letter-spacing: -.075em; }
h1 span, h2 span, h2 em { color: #00f0ff; font-style: normal; }
.hero-description { max-width: 526px; margin-bottom: 32px; color: #94a3b8; font-size: 16px; line-height: 1.75; }
.hero-actions { display: flex; flex-wrap: wrap; gap: 11px; }
.button { display: inline-flex; align-items: center; justify-content: center; gap: 9px; min-height: 45px; border-radius: 5px; padding: 0 16px; border: 1px solid transparent; cursor: pointer; font-size: 12px; text-decoration: none; transition: transform .22s ease, background .22s ease, box-shadow .22s ease, border-color .22s ease; }
.button:hover { transform: translateY(-2px); }
.button-primary { background: #00f0ff; color: #061014; font-weight: 700; box-shadow: 0 0 25px rgba(0,240,255,.14); }
.button-primary:hover { background: #7ee7f8; box-shadow: 0 0 35px rgba(0,240,255,.29); }
.button-quiet { background: transparent; color: #cbd5e1; border-color: rgba(148,163,184,.22); }
.button-quiet:hover { background: rgba(148,163,184,.08); border-color: rgba(0,240,255,.32); color: #f8fafc; }
.hero-notes { display: flex; flex-wrap: wrap; gap: 18px; margin-top: 30px; color: #64748b; font: 10px 'JetBrains Mono', monospace; }
.hero-notes span { display: inline-flex; align-items: center; gap: 5px; }
.hero-notes svg { color: #10b981; }
.hero-terminal { position: relative; border: 1px solid rgba(0,240,255,.22); border-radius: 11px; background: rgba(13, 21, 35, .78); box-shadow: 25px 35px 80px rgba(0,0,0,.3), 0 0 45px rgba(0,240,255,.07); transform: rotate(2deg); overflow: hidden; animation: terminal-float 7s ease-in-out infinite; }
.hero-terminal::before { content: ""; position: absolute; inset: 0; background: radial-gradient(circle at 75% 10%, rgba(0,240,255,.13), transparent 35%); pointer-events: none; }
.terminal-topbar, .terminal-footer { position: relative; display: flex; justify-content: space-between; align-items: center; padding: 13px 17px; color: #64748b; border-bottom: 1px solid rgba(148,163,184,.1); font: 10px 'JetBrains Mono', monospace; }
.terminal-footer { border-top: 1px solid rgba(148,163,184,.1); border-bottom: 0; }
.terminal-lights { display: flex; gap: 5px; }
.terminal-lights i { width: 7px; height: 7px; border-radius: 50%; background: #334155; }
.terminal-lights i:first-child { background: #f87171; }
.terminal-lights i:nth-child(2) { background: #fbbf24; }
.terminal-lights i:nth-child(3) { background: #34d399; }
.terminal-top-icon { color: #00f0ff; }
.terminal-body { display: flex; position: relative; min-height: 282px; padding: 25px 22px; }
.line-number { padding-right: 20px; color: #334155; font: 11px/2.1 'JetBrains Mono', monospace; text-align: right; user-select: none; }
.terminal-body pre { margin: 0; font: 11px/2.1 'JetBrains Mono', monospace; white-space: pre-wrap; }
.syntax-purple { color: #c084fc; }
.syntax-cyan { color: #67e8f9; }
.syntax-yellow { color: #facc15; }
.syntax-blue { color: #60a5fa; }
.syntax-green { color: #86efac; }
.terminal-cursor { width: 6px; height: 15px; position: absolute; left: 138px; bottom: 61px; background: #00f0ff; animation: blink 1.2s steps(2) infinite; }
.terminal-footer span { display: inline-flex; align-items: center; gap: 8px; }
.stat-strip { position: relative; z-index: 1; display: grid; grid-template-columns: 1fr 1fr 1fr 2fr; gap: 0; border-top: 1px solid rgba(148,163,184,.17); }
.stat-strip > div { min-height: 100px; display: flex; flex-direction: column; justify-content: center; border-right: 1px solid rgba(148,163,184,.14); padding: 0 24px; }
.stat-strip > div:first-child { padding-left: 0; }
.stat-strip > div:last-child { border-right: 0; }
.stat-strip strong { font: 700 29px 'Plus Jakarta Sans', sans-serif; letter-spacing: -.07em; }
.stat-strip strong span { color: #00f0ff; font-size: 14px; letter-spacing: 0; }
.stat-strip small { margin-top: 4px; color: #64748b; font: 9px 'JetBrains Mono', monospace; letter-spacing: .08em; text-transform: uppercase; }
.stat-quote { flex-direction: row !important; align-items: center; gap: 13px; color: #94a3b8; font-size: 12px; }
.stat-quote svg { flex: none; color: #00f0ff; }

.section-light { color: #0f172a; background: #f2f5f6; }
.section-light .heading-aside { color: #52616d; }
.section-light .eyebrow { color: #047c8b; }
.section-light h2 { color: #0b1722; }
.section-light h2 em { color: #0595a6; }
.split-heading { display: flex; justify-content: space-between; align-items: end; gap: 80px; }
.section-heading h2 { margin-bottom: 0; font-size: clamp(34px, 4vw, 56px); font-weight: 750; line-height: 1.03; letter-spacing: -.075em; }
.heading-aside { max-width: 315px; margin-bottom: 4px; color: #94a3b8; font-size: 13px; line-height: 1.8; }
.services-list { margin-top: 76px; border-top: 1px solid rgba(15,23,42,.16); }
.service-row { display: grid; grid-template-columns: 48px 55px minmax(230px, 1.25fr) 1fr 30px; align-items: center; gap: 23px; min-height: 123px; border-bottom: 1px solid rgba(15,23,42,.16); transition: padding .3s ease, background .3s ease; }
.service-row:hover { padding-left: 13px; padding-right: 13px; background: rgba(255,255,255,.72); }
.service-number { align-self: start; padding-top: 31px; color: #9aa7af; font: 10px 'JetBrains Mono', monospace; }
.service-icon { display: grid; place-items: center; width: 42px; height: 42px; border: 1px solid rgba(4,124,139,.3); border-radius: 50%; color: #048b9c; }
.service-main h3 { margin-bottom: 8px; color: #0f172a; font-size: 18px; letter-spacing: -.04em; }
.service-main p { max-width: 390px; margin-bottom: 0; color: #63717b; font-size: 12px; line-height: 1.65; }
.service-tags { display: flex; flex-wrap: wrap; justify-content: end; gap: 7px; }
.service-tags span { border: 1px solid rgba(15,23,42,.13); border-radius: 99px; padding: 5px 8px; color: #63717b; font: 9px 'JetBrains Mono', monospace; }
.service-arrow { color: #048b9c; transition: transform .2s ease; }
.service-row:hover .service-arrow { transform: translate(3px, -3px); }

.portfolio-section { background: #07090e; }
.portfolio-heading { align-items: end; }
.filter-row { display: flex; flex-wrap: wrap; gap: 8px; margin: 59px 0 27px; }
.filter-button { border: 1px solid rgba(148,163,184,.19); border-radius: 4px; padding: 8px 12px; background: transparent; color: #64748b; cursor: pointer; font: 10px 'JetBrains Mono', monospace; transition: color .2s ease, border-color .2s ease, background .2s ease, transform .2s ease; }
.filter-button:hover { color: #cbd5e1; border-color: rgba(0,240,255,.38); transform: translateY(-1px); }
.filter-button.active { border-color: #00f0ff; background: rgba(0,240,255,.1); color: #7ee7f8; }
.project-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 21px; }
.project-card { overflow: hidden; border: 1px solid rgba(148,163,184,.14); border-radius: 8px; background: #0d1523; transition: transform .3s ease, border-color .3s ease, box-shadow .3s ease; }
.project-card.is-hidden { display: none; }
.project-card:hover { border-color: rgba(0,240,255,.4); box-shadow: 0 18px 42px rgba(0,0,0,.2); transform: translateY(-5px); }
.project-card-featured { grid-column: span 2; display: grid; grid-template-columns: 1.1fr .9fr; }
.project-image-wrap { position: relative; min-height: 218px; overflow: hidden; }
.project-card-featured .project-image-wrap { min-height: 335px; }
.project-image-wrap img { width: 100%; height: 100%; position: absolute; object-fit: cover; filter: saturate(.7) contrast(1.08); transition: transform .5s ease, filter .5s ease; }
.project-card:hover img { transform: scale(1.04); filter: saturate(.95) contrast(1.08); }
.image-overlay { position: absolute; inset: 0; background: linear-gradient(145deg, rgba(0,240,255,.11), transparent 44%, rgba(7,9,14,.85)); }
.project-index, .project-year { position: absolute; top: 16px; color: #7ee7f8; font: 10px 'JetBrains Mono', monospace; }
.project-index { left: 17px; }
.project-year { right: 17px; color: #94a3b8; }
.project-content { display: flex; flex-direction: column; min-height: 250px; padding: 26px; }
.project-meta { display: flex; justify-content: space-between; align-items: center; margin-bottom: 22px; color: #7ee7f8; font: 11px 'JetBrains Mono', monospace; }
.project-meta small { color: #64748b; font-size: 9px; }
.badge-outline { display: inline-flex; align-items: center; border: 1px solid rgba(0,240,255,.25); border-radius: 99px; padding: 3px 9px; color: #7ee7f8; font: 9px 'JetBrains Mono', monospace; }
.project-content h3 { margin-bottom: 9px; color: #f8fafc; font-size: 24px; letter-spacing: -.06em; }
.project-content p { max-width: 400px; margin-bottom: 25px; color: #94a3b8; font-size: 12px; line-height: 1.7; }
.project-bottom { display: flex; align-items: end; justify-content: space-between; gap: 15px; margin-top: auto; }
.stack-list { display: flex; flex-wrap: wrap; gap: 6px; }
.stack-list span { border: 1px solid rgba(148,163,184,.15); border-radius: 3px; padding: 4px 6px; color: #64748b; font: 9px 'JetBrains Mono', monospace; }
.project-detail-button { display: inline-flex; align-items: center; gap: 5px; border: 0; background: transparent; color: #7ee7f8; cursor: pointer; font-size: 11px; white-space: nowrap; }
.project-detail-button:hover { color: #00f0ff; }

.estimator-section { background: #0d1523; border-top: 1px solid rgba(0,240,255,.13); border-bottom: 1px solid rgba(0,240,255,.13); }
.estimator-layout { display: grid; grid-template-columns: .8fr 1.2fr; gap: 100px; align-items: center; }
.estimator-copy h2 { margin-bottom: 25px; color: #f8fafc; font-size: clamp(36px, 4vw, 55px); line-height: 1.04; letter-spacing: -.075em; }
.estimator-copy > p { max-width: 340px; color: #94a3b8; font-size: 13px; line-height: 1.8; }
.estimator-reassurance { display: flex; gap: 10px; max-width: 350px; margin-top: 32px; color: #7ee7f8; font: 10px/1.6 'JetBrains Mono', monospace; }
.estimator-reassurance svg { flex: none; }
.estimator-card { border: 1px solid rgba(0,240,255,.2); border-radius: 8px; padding: 29px; background: rgba(7,9,14,.64); box-shadow: 0 20px 70px rgba(0,0,0,.18); }
.estimator-step { display: grid; grid-template-columns: 26px 1fr; gap: 18px; padding: 0 0 24px; margin-bottom: 24px; border-bottom: 1px solid rgba(148,163,184,.12); }
.estimator-step > span { color: #00f0ff; font: 10px 'JetBrains Mono', monospace; }
.estimator-step label { display: block; margin-bottom: 12px; color: #cbd5e1; font-size: 11px; }
.choice-grid { display: flex; flex-wrap: wrap; gap: 7px; }
.choice, .mini-choice, .feature-choice { border: 1px solid rgba(148,163,184,.18); border-radius: 4px; background: transparent; color: #64748b; cursor: pointer; transition: color .2s ease, border-color .2s ease, background .2s ease, transform .2s ease; }
.choice { padding: 8px 10px; font: 10px 'JetBrains Mono', monospace; }
.choice:hover, .mini-choice:hover, .feature-choice:hover { border-color: rgba(0,240,255,.4); color: #cbd5e1; transform: translateY(-1px); }
.choice.active, .mini-choice.active, .feature-choice.active { border-color: #00f0ff; background: rgba(0,240,255,.1); color: #7ee7f8; }
.feature-list { display: flex; flex-direction: column; align-items: start; gap: 8px; }
.feature-choice { display: inline-flex; align-items: center; gap: 9px; border: 0; padding: 0; font-size: 11px; }
.feature-check { display: grid; place-items: center; width: 16px; height: 16px; border: 1px solid rgba(148,163,184,.28); border-radius: 3px; color: #061014; }
.feature-choice.active .feature-check { border-color: #00f0ff; background: #00f0ff; }
.split-choice { grid-template-columns: 1fr 1fr; gap: 30px; }
.mini-choice-list { display: flex; gap: 5px; }
.mini-choice { padding: 6px 8px; font-size: 10px; }
.estimate-result { display: flex; align-items: center; justify-content: space-between; gap: 20px; }
.estimate-label { display: block; margin-bottom: 5px; color: #64748b; font: 9px 'JetBrains Mono', monospace; text-transform: uppercase; }
.estimate-result strong { color: #f8fafc; font: 700 27px 'Plus Jakarta Sans', sans-serif; letter-spacing: -.06em; }
.estimate-cta { display: inline-flex; align-items: center; gap: 7px; border-radius: 4px; padding: 11px 13px; background: #00f0ff; color: #061014; font-size: 11px; font-weight: 700; text-decoration: none; }

.process-grid { display: grid; grid-template-columns: repeat(5, 1fr); gap: 22px; margin-top: 76px; }
.process-step { position: relative; border-top: 1px solid rgba(15,23,42,.2); padding-top: 21px; }
.process-line-number { color: #9aa7af; font: 10px 'JetBrains Mono', monospace; }
.process-icon { display: grid; place-items: center; width: 39px; height: 39px; margin: 31px 0 21px; border: 1px solid rgba(4,124,139,.3); border-radius: 50%; color: #048b9c; }
.process-step h3 { margin-bottom: 9px; color: #0f172a; font-size: 16px; letter-spacing: -.04em; }
.process-step p { color: #63717b; font-size: 11px; line-height: 1.75; }

.contact-section { padding: 115px 0 24px; background: #07090e; }
.contact-layout { display: grid; grid-template-columns: 1fr .78fr; gap: 100px; align-items: center; padding-bottom: 112px; }
.contact-layout h2 { margin-bottom: 23px; color: #f8fafc; font-size: clamp(40px, 5vw, 66px); line-height: 1.01; letter-spacing: -.08em; }
.contact-layout > div > p:last-child { max-width: 360px; color: #94a3b8; font-size: 13px; line-height: 1.8; }
.contact-actions { display: flex; flex-direction: column; gap: 11px; }
.contact-action { display: flex; align-items: center; gap: 13px; width: 100%; min-height: 73px; border: 1px solid rgba(148,163,184,.2); border-radius: 5px; padding: 0 18px; background: rgba(13,21,35,.7); color: #f8fafc; cursor: pointer; text-align: left; text-decoration: none; transition: border-color .2s ease, background .2s ease, transform .2s ease; }
.contact-action:hover { transform: translateX(4px); border-color: rgba(0,240,255,.46); background: rgba(0,240,255,.07); }
.contact-action.primary { border-color: rgba(0,240,255,.42); background: #00f0ff; color: #061014; }
.contact-action.primary:hover { background: #7ee7f8; }
.contact-action > svg:last-child { margin-left: auto; }
.contact-action span { display: flex; flex-direction: column; gap: 4px; font-size: 13px; font-weight: 650; }
.contact-action small { color: #64748b; font: 9px 'JetBrains Mono', monospace; text-transform: uppercase; }
.contact-action.primary small { color: #24606a; }
.copy-phone-button { display: inline-flex; align-items: center; justify-content: end; gap: 6px; margin-top: 5px; border: 0; background: transparent; color: #64748b; cursor: pointer; font: 10px 'JetBrains Mono', monospace; }
.copy-phone-button:hover { color: #00f0ff; }
.footer-row { display: flex; justify-content: space-between; gap: 20px; padding-top: 23px; border-top: 1px solid rgba(148,163,184,.14); color: #475569; font: 9px 'JetBrains Mono', monospace; }
.footer-row a { color: #7ee7f8; text-decoration: none; }
.footer-dot { margin: 0 8px; color: #00f0ff; }

/* Dialogs */
.dialog-overlay { position: fixed; inset: 0; z-index: 100; display: none; align-items: center; justify-content: center; padding: 20px; background: rgba(4,6,10,.7); backdrop-filter: blur(4px); }
.dialog-overlay.is-open { display: flex; }
.project-dialog, .contact-dialog { position: relative; width: min(540px, 100%); max-height: 88vh; overflow-y: auto; border: 1px solid rgba(0,240,255,.22); border-radius: 10px; background: #0d1523; color: #f8fafc; box-shadow: 0 25px 90px rgba(0,0,0,.6); padding: 28px; }
.dialog-close { position: absolute; top: 16px; right: 16px; border: 0; background: transparent; color: #64748b; cursor: pointer; }
.dialog-close:hover { color: #f8fafc; }
.dialog-kicker { display: flex; justify-content: space-between; align-items: center; margin-bottom: 18px; color: #64748b; font: 10px 'JetBrains Mono', monospace; padding-right: 24px; }
.dialog-title { color: #f8fafc; font-size: 28px; letter-spacing: -.06em; margin-bottom: 10px; font-family: 'Plus Jakarta Sans', sans-serif; font-weight: 750; }
.dialog-description { color: #94a3b8; line-height: 1.7; font-size: 13px; }
.dialog-metric { display: flex; align-items: baseline; gap: 8px; margin: 14px 0 23px; padding-bottom: 20px; border-bottom: 1px solid rgba(148,163,184,.13); }
.dialog-metric span, .dialog-metric small, .dialog-label { color: #64748b; font: 9px 'JetBrains Mono', monospace; text-transform: uppercase; }
.dialog-metric strong { color: #00f0ff; font: 700 28px 'Plus Jakarta Sans', sans-serif; }
.dialog-section { margin-top: 20px; }
.dialog-section ul { display: flex; flex-direction: column; gap: 9px; margin: 12px 0 0; padding: 0; list-style: none; color: #cbd5e1; font-size: 11px; }
.dialog-section li { display: flex; gap: 8px; align-items: start; }
.dialog-section li svg { flex: none; color: #10b981; margin-top: 1px; }
.dialog-stack { margin-top: 11px; }
.dialog-cta { width: 100%; margin-top: 22px; }
.contact-dialog form { display: flex; flex-direction: column; gap: 9px; margin-top: 6px; }
.contact-dialog form label { margin-top: 5px; color: #cbd5e1; font-size: 11px; }
.contact-dialog input, .contact-dialog textarea { width: 100%; border-radius: 6px; border: 1px solid rgba(148,163,184,.2); background: rgba(7,9,14,.55); color: #f8fafc; padding: 10px 12px; font: 13px 'Inter', sans-serif; }
.contact-dialog input:focus, .contact-dialog textarea:focus { outline: none; border-color: rgba(0,240,255,.5); }
.contact-dialog textarea { min-height: 105px; resize: vertical; }
.form-submit { width: 100%; margin-top: 10px; background: #00f0ff; color: #061014; border: 0; }
.form-submit:hover { background: #7ee7f8; }

/* Toasts */
.toast-stack { position: fixed; z-index: 200; top: 18px; right: 18px; display: flex; flex-direction: column; gap: 10px; }
.toast-item { display: flex; align-items: center; gap: 9px; border-radius: 7px; padding: 12px 16px; background: #0d1523; border: 1px solid rgba(0,240,255,.25); color: #f8fafc; font-size: 12px; box-shadow: 0 15px 40px rgba(0,0,0,.35); opacity: 0; transform: translateY(-8px); transition: opacity .25s ease, transform .25s ease; }
.toast-item.show { opacity: 1; transform: translateY(0); }
.toast-item svg { color: #10b981; flex: none; }

@keyframes terminal-float { 0%, 100% { transform: rotate(2deg) translateY(0); } 50% { transform: rotate(1deg) translateY(-8px); } }
@keyframes blink { 0%, 45% { opacity: 1; } 46%, 100% { opacity: 0; } }

@media (max-width: 900px) {
  .hero-layout, .estimator-layout, .contact-layout { grid-template-columns: 1fr; gap: 50px; }
  .hero-section { min-height: auto; padding-bottom: 0; }
  .hero-terminal { max-width: 580px; margin: 0 auto; }
  .stat-strip { grid-template-columns: repeat(3, 1fr); }
  .stat-quote { grid-column: span 3; min-height: 70px !important; padding-left: 0 !important; border-top: 1px solid rgba(148,163,184,.14); }
  .estimator-copy { display: grid; grid-template-columns: 1fr 1fr; gap: 20px; }
  .estimator-copy .eyebrow, .estimator-copy h2 { grid-column: span 2; }
  .estimator-copy > p { margin-bottom: 0; }
  .estimator-reassurance { margin-top: 0; }
  .process-grid { grid-template-columns: repeat(3, 1fr); row-gap: 45px; }
  .process-step:last-child { grid-column: span 3; max-width: 31%; }
  .contact-layout { gap: 45px; }
  .contact-actions { max-width: 530px; }
}
@media (max-width: 680px) {
  .container { width: min(100% - 32px, 560px); }
  .section { padding: 85px 0; }
  .header-inner { min-height: 68px; }
  .desktop-nav { display: none; position: absolute; left: 16px; right: 16px; top: 76px; flex-direction: column; align-items: stretch; gap: 0; border: 1px solid rgba(0,240,255,.18); border-radius: 6px; padding: 5px; background: #0d1523; box-shadow: 0 15px 30px rgba(0,0,0,.3); }
  .desktop-nav.mobile-nav-open { display: flex; }
  .desktop-nav button { padding: 13px; text-align: left; }
  .header-cta { display: none; }
  .menu-toggle { display: grid; place-items: center; }
  .hero-section { padding-top: 123px; }
  .hero-layout { gap: 28px; }
  .hero-copy { padding-bottom: 25px; }
  .hero-copy h1 { font-size: clamp(43px, 14vw, 66px); }
  .hero-description { font-size: 14px; }
  .hero-actions { flex-direction: column; align-items: stretch; }
  .button { width: 100%; }
  .hero-notes { gap: 11px; font-size: 9px; }
  .hero-terminal { transform: rotate(0); }
  .terminal-body { min-height: 250px; padding: 22px 13px; }
  .line-number { padding-right: 12px; font-size: 9px; }
  .terminal-body pre { font-size: 9px; }
  .terminal-cursor { left: 105px; }
  .stat-strip { grid-template-columns: repeat(3, 1fr); }
  .stat-strip > div { padding: 0 11px; }
  .stat-strip strong { font-size: 22px; }
  .stat-strip small { font-size: 7px; }
  .stat-quote { grid-column: span 3; padding-left: 0 !important; font-size: 10px; }
  .split-heading { display: block; }
  .heading-aside { margin-top: 23px; }
  .services-list, .process-grid { margin-top: 46px; }
  .service-row { grid-template-columns: 31px 40px 1fr 20px; gap: 12px; min-height: 134px; }
  .service-main h3 { font-size: 16px; }
  .service-main p { font-size: 11px; }
  .service-tags { display: none; }
  .service-number { padding-top: 27px; }
  .service-icon { width: 35px; height: 35px; }
  .project-grid { grid-template-columns: 1fr; }
  .project-card-featured { grid-column: span 1; display: block; }
  .project-card-featured .project-image-wrap { min-height: 218px; }
  .project-content { min-height: 270px; padding: 21px; }
  .project-content h3 { font-size: 21px; }
  .filter-row { margin-top: 40px; overflow-x: auto; flex-wrap: nowrap; padding-bottom: 4px; }
  .filter-button { flex: none; }
  .estimator-copy { display: block; }
  .estimator-copy h2 { margin-bottom: 21px; }
  .estimator-reassurance { margin-top: 25px; }
  .estimator-card { padding: 20px; }
  .split-choice { display: block; }
  .split-choice > div + div { margin-top: 20px; }
  .estimate-result { align-items: stretch; flex-direction: column; }
  .estimate-cta { justify-content: center; }
  .process-grid { grid-template-columns: 1fr 1fr; gap: 34px 20px; }
  .process-step:last-child { grid-column: span 2; max-width: none; }
  .contact-section { padding-top: 85px; }
  .contact-layout { padding-bottom: 80px; }
  .contact-layout h2 { font-size: 47px; }
  .footer-row { flex-direction: column; gap: 10px; }
  .footer-row span:last-child { line-height: 1.7; }
  .dialog-title { font-size: 23px; }
}