:root {
  --ink: #061624;
  --ink-2: #0c2538;
  --blue: #0a5a8c;
  --blue-2: #0d78b8;
  --blue-3: #dff3ff;
  --paper: #f7fafc;
  --white: #ffffff;
  --line: #dce5eb;
  --muted: #637381;
  --soft: #edf3f7;
  --radius: 24px;
  --shadow: 0 22px 70px rgba(8, 31, 48, .11);
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body {
  margin: 0;
  color: var(--ink);
  background: var(--white);
  font-family: Inter, ui-sans-serif, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  -webkit-font-smoothing: antialiased;
  overflow-x: hidden;
}
body.menu-open { overflow: hidden; }
a { color: inherit; text-decoration: none; }
img { display: block; max-width: 100%; }
button, input, select, textarea { font: inherit; }
button { color: inherit; }
.shell { width: min(1180px, calc(100% - 40px)); margin: 0 auto; }
.section-pad { padding: 116px 0; }
.skip-link { position: fixed; left: 16px; top: -80px; z-index: 200; background: var(--ink); color: #fff; padding: 10px 14px; border-radius: 8px; }
.skip-link:focus { top: 16px; }

.site-header {
  position: fixed;
  z-index: 100;
  top: 0;
  left: 0;
  right: 0;
  background: rgba(255, 255, 255, .78);
  backdrop-filter: blur(18px);
  -webkit-backdrop-filter: blur(18px);
  border-bottom: 1px solid rgba(6, 22, 36, .08);
}
.nav-shell { height: 80px; display: grid; grid-template-columns: 1fr auto 1fr; align-items: center; gap: 28px; }
.brand { width: 108px; overflow: hidden; }
.brand img { width: 106px; height: 63px; object-fit: contain; }
.desktop-nav { display: flex; gap: 34px; font-size: 14px; font-weight: 600; color: #274154; }
.desktop-nav a { position: relative; transition: color .2s ease; }
.desktop-nav a::after { content: ""; position: absolute; left: 0; right: 100%; bottom: -8px; height: 1px; background: var(--blue); transition: right .25s ease; }
.desktop-nav a:hover { color: var(--blue); }
.desktop-nav a:hover::after { right: 0; }
.desktop-cta { justify-self: end; }
.menu-button, .mobile-menu { display: none; }

.button { min-height: 52px; padding: 0 21px; border: 0; border-radius: 999px; display: inline-flex; align-items: center; justify-content: center; gap: 12px; font-weight: 750; letter-spacing: -.02em; cursor: pointer; transition: transform .22s ease, box-shadow .22s ease, background .22s ease; }
.button:hover { transform: translateY(-2px); }
.button-primary { color: #fff; background: linear-gradient(135deg, #0a5a8c, #0b79b8); box-shadow: 0 14px 35px rgba(10, 90, 140, .25); }
.button-primary:hover { box-shadow: 0 18px 44px rgba(10, 90, 140, .34); }
.button-dark { color: #fff; background: var(--ink); }
.button-light { color: var(--ink); background: #fff; }
.button-small { min-height: 43px; padding: 0 17px; font-size: 13px; }

.hero { position: relative; min-height: 880px; padding-top: 180px; padding-bottom: 54px; background: linear-gradient(180deg, #fbfdff 0%, #f3f8fb 100%); isolation: isolate; overflow: hidden; }
.hero-grid { position: absolute; inset: 0; z-index: -3; background-image: linear-gradient(rgba(10, 90, 140, .055) 1px, transparent 1px), linear-gradient(90deg, rgba(10, 90, 140, .055) 1px, transparent 1px); background-size: 52px 52px; mask-image: linear-gradient(to bottom, transparent, black 20%, black 76%, transparent); }
.hero-glow { position: absolute; width: 520px; height: 520px; border-radius: 50%; filter: blur(80px); opacity: .32; z-index: -2; }
.hero-glow-one { right: -120px; top: 80px; background: #89d4ff; }
.hero-glow-two { left: -220px; bottom: 20px; background: #ccecff; opacity: .45; }
.hero-layout { display: grid; grid-template-columns: 1.02fr .98fr; align-items: center; gap: 52px; }
.eyebrow, .kicker { text-transform: uppercase; letter-spacing: .14em; font-size: 11px; font-weight: 800; color: var(--blue); }
.eyebrow { display: inline-flex; gap: 9px; align-items: center; padding: 8px 11px; border: 1px solid #c9e1ee; background: rgba(255,255,255,.7); border-radius: 999px; margin-bottom: 28px; }
.pulse-dot { width: 7px; height: 7px; border-radius: 50%; background: var(--blue-2); box-shadow: 0 0 0 6px rgba(13,120,184,.10); }
.hero h1 { margin: 0; max-width: 760px; font-size: clamp(48px, 5.3vw, 79px); line-height: .98; letter-spacing: -.062em; font-weight: 790; }
.hero h1 span, .section-heading h2 span, .why h2 span, .contact h2 span { color: var(--blue); }
.hero-lede { margin: 28px 0 0; max-width: 650px; color: #4d6270; font-size: 19px; line-height: 1.65; letter-spacing: -.018em; }
.hero-actions { display: flex; align-items: center; gap: 22px; margin-top: 34px; }
.text-link { font-size: 14px; font-weight: 750; color: #294457; display: inline-flex; gap: 8px; align-items: center; }
.trust-row { display: flex; gap: 23px; margin-top: 32px; color: #526a7a; font-size: 12px; font-weight: 650; }
.trust-row span { display: flex; align-items: center; gap: 7px; }
.trust-row i { font-style: normal; color: var(--blue); }
.hero-visual { min-height: 560px; display: grid; place-items: center; perspective: 900px; }
.orbital-card { position: relative; width: min(500px, 42vw); aspect-ratio: 1; border-radius: 44px; background: radial-gradient(circle at 50% 44%, rgba(14,122,184,.12), transparent 42%), linear-gradient(145deg, rgba(255,255,255,.94), rgba(236,246,251,.7)); border: 1px solid rgba(10,90,140,.15); box-shadow: var(--shadow); display: grid; place-items: center; overflow: hidden; transform: rotateY(-3deg) rotateX(2deg); }
.orbital-card::before { content: ""; position: absolute; inset: 18px; border-radius: 32px; border: 1px solid rgba(10,90,140,.08); }
.logo-core { width: 186px; height: 186px; border-radius: 50%; background: rgba(255,255,255,.93); box-shadow: 0 24px 70px rgba(0,57,88,.16); display: grid; place-items: center; z-index: 3; overflow: hidden; }
.logo-core img { width: 155px; height: 155px; object-fit: cover; object-position: center 18%; clip-path: circle(43% at 50% 37%); transform: scale(1.85); }
.orbital-ring { position: absolute; border-radius: 50%; border: 1px solid rgba(10,90,140,.22); }
.ring-one { width: 270px; height: 270px; animation: orbitSpin 18s linear infinite; }
.ring-two { width: 370px; height: 370px; border-style: dashed; animation: orbitSpin 28s linear infinite reverse; }
.ring-three { width: 460px; height: 460px; opacity: .45; }
.ring-one::before, .ring-two::before { content:""; position:absolute; width: 9px; height: 9px; border-radius: 50%; background: var(--blue-2); top: 13px; left: 50%; box-shadow: 0 0 20px #1a94d1; }
.float-chip { position: absolute; z-index: 5; min-width: 112px; padding: 11px 13px; border-radius: 14px; background: rgba(255,255,255,.89); border: 1px solid rgba(10,90,140,.14); box-shadow: 0 12px 30px rgba(9, 44, 65, .10); backdrop-filter: blur(10px); display: flex; gap: 8px; align-items: center; font-size: 11px; }
.float-chip b { color: var(--blue); font-size: 9px; letter-spacing: .1em; }
.float-chip span { font-weight: 750; }
.chip-top { top: 75px; right: 32px; }
.chip-right { right: 18px; bottom: 105px; }
.chip-bottom { left: 38px; bottom: 72px; }
.metrics-wrap { margin-top: 76px; display: grid; grid-template-columns: repeat(3, 1fr); border-top: 1px solid #cfdee7; border-bottom: 1px solid #cfdee7; }
.metric { display: flex; gap: 14px; align-items: center; padding: 22px 28px; color: #415b6c; font-size: 12px; border-right: 1px solid #cfdee7; }
.metric:first-child { padding-left: 0; }
.metric:last-child { border-right: 0; }
.metric strong { font-size: 11px; color: var(--blue); letter-spacing: .1em; }
.metric span { font-weight: 700; }

.section-heading { display: flex; justify-content: space-between; align-items: flex-end; gap: 60px; margin-bottom: 50px; }
.section-heading > div { max-width: 700px; }
.kicker { margin: 0 0 15px; }
.section-heading h2, .why h2, .contact h2 { margin: 0; font-size: clamp(40px, 4.5vw, 64px); line-height: 1.02; letter-spacing: -.052em; }
.section-heading > p { max-width: 390px; margin: 0; color: var(--muted); line-height: 1.75; font-size: 14px; }
.services { background: #fff; }
.service-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 20px; }
.service-card { min-height: 690px; position: relative; overflow: hidden; padding: 36px; border: 1px solid var(--line); border-radius: 28px; background: #f8fbfd; transition: transform .3s ease, box-shadow .3s ease; }
.service-card:hover { transform: translateY(-5px); box-shadow: var(--shadow); }
.service-card-dark { color: #fff; background: linear-gradient(155deg, #0d2a3d 0%, #061624 68%); border-color: #153a51; }
.service-topline { display: flex; align-items: center; justify-content: space-between; margin-bottom: 64px; }
.service-topline > span { color: #78909f; font-size: 11px; letter-spacing: .12em; }
.service-icon { width: 44px; height: 44px; display: grid; place-items: center; border-radius: 13px; border: 1px solid #d8e4eb; background: rgba(255,255,255,.75); color: var(--blue); font-size: 18px; }
.service-card-dark .service-icon { border-color: #26485c; background: #102d40; color: #70c9f6; }
.service-card h3 { margin: 0; max-width: 470px; font-size: 32px; line-height: 1.08; letter-spacing: -.045em; }
.service-card > p { max-width: 480px; margin: 18px 0 24px; color: #667b89; font-size: 14px; line-height: 1.7; }
.service-card-dark > p { color: #a8bbc7; }
.service-card ul { margin: 0; padding: 0; list-style: none; display: grid; grid-template-columns: repeat(2, 1fr); gap: 10px 18px; max-width: 470px; }
.service-card li { color: #466171; font-size: 12px; font-weight: 650; }
.service-card li::before { content: "•"; color: var(--blue); margin-right: 7px; }
.service-card-dark li { color: #d3dce1; }
.card-link { position: absolute; z-index: 3; left: 36px; bottom: 34px; display: inline-flex; gap: 9px; align-items: center; font-size: 13px; font-weight: 800; }
.card-link span { color: var(--blue); }
.service-card-dark .card-link span { color: #65c4f5; }
.card-graphic { position: absolute; width: 47%; min-width: 265px; height: 240px; right: -22px; bottom: 18px; }
.browser-ui { background: #fff; border: 1px solid #d7e4eb; border-radius: 18px 0 0 18px; box-shadow: -10px 20px 50px rgba(8,38,56,.09); overflow: hidden; transform: rotate(-2deg); }
.browser-bar { height: 30px; border-bottom: 1px solid #e2ebf0; padding: 11px; display: flex; gap: 5px; }
.browser-bar i { width: 5px; height: 5px; border-radius: 50%; background: #adc0cb; }
.browser-content { padding: 28px 25px; }
.ui-line { display: block; height: 5px; margin: 8px 0; border-radius: 99px; background: #dbe6ec; }
.ui-heavy { height: 11px; background: #16384e; }
.w-30 { width: 30%; }.w-75 { width: 75%; }.w-58 { width: 58%; }
.ui-button { width: 65px; height: 20px; border-radius: 99px; margin-top: 18px; background: var(--blue); }
.ui-panels { display: flex; gap: 8px; margin-top: 31px; }
.ui-panels i { width: 62px; height: 64px; border-radius: 8px; background: #edf4f7; border: 1px solid #dce8ed; }
.social-ui { right: -5px; bottom: 24px; transform: rotate(2deg); }
.social-mini-card { position: absolute; right: 0; top: 12px; width: 230px; height: 126px; border-radius: 18px; padding: 17px; background: #12334a; border: 1px solid #24485f; box-shadow: -10px 20px 50px rgba(0,0,0,.18); }
.social-mini-card span { font-size: 10px; color: #86a1b2; text-transform: uppercase; letter-spacing: .1em; }
.social-mini-card strong { float: right; color: #6bd1ff; font-size: 22px; }
.social-mini-card.second { top: 104px; right: 92px; width: 200px; background: #0b2537; }
.mini-bars { position: absolute; left: 17px; right: 17px; bottom: 17px; height: 54px; display: flex; align-items: end; gap: 7px; }
.mini-bars i { flex: 1; height: 40%; border-radius: 4px 4px 0 0; background: #1c709d; }
.mini-bars i:nth-child(2){height:66%}.mini-bars i:nth-child(3){height:50%}.mini-bars i:nth-child(4){height:82%}.mini-bars i:nth-child(5){height:100%;background:#43bff4}
.mini-line { height: 7px; width: 80%; margin-top: 20px; border-radius: 99px; background: #376077; }.mini-line.short{width:54%; margin-top:9px;background:#284b61}

.work { background: var(--paper); }
.live-work-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 34px 20px; }
.case-card { min-width: 0; }
.case-card-featured { grid-column: 1 / -1; }
.case-link { display: block; }
.case-preview { height: 475px; border-radius: 26px; overflow: hidden; position: relative; isolation: isolate; border: 1px solid rgba(8, 43, 65, .10); box-shadow: 0 18px 50px rgba(8, 35, 52, .08); transition: transform .35s ease, box-shadow .35s ease; }
.case-card-featured .case-preview { height: 560px; }
.case-link:hover .case-preview { transform: translateY(-6px); box-shadow: 0 30px 75px rgba(8, 35, 52, .15); }
.case-link:focus-visible { outline: none; }
.case-link:focus-visible .case-preview { outline: 3px solid rgba(13, 120, 184, .55); outline-offset: 4px; }
.live-preview { background: #d9e8ef; }
.live-preview-jka { background: linear-gradient(145deg, #0b1820, #1b2d37); }
.live-preview-ruyi { background: linear-gradient(145deg, #ece6dc, #d4c7ba); }
.live-preview-angies { background: linear-gradient(145deg, #f4ead8, #d9b98c); }
.browser-chrome { position: absolute; z-index: 4; top: 14px; left: 14px; right: 14px; height: 42px; display: grid; grid-template-columns: auto 1fr auto; align-items: center; gap: 12px; padding: 0 14px; border: 1px solid rgba(255,255,255,.36); border-radius: 13px; background: rgba(249,252,253,.88); box-shadow: 0 10px 30px rgba(0,0,0,.10); backdrop-filter: blur(14px); -webkit-backdrop-filter: blur(14px); color: #4d6270; }
.browser-dots { display: flex; gap: 5px; }
.browser-dots i { display: block; width: 6px; height: 6px; border-radius: 50%; background: #9fb0b9; }
.browser-address { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; text-align: center; font-size: 9px; letter-spacing: .06em; font-weight: 750; }
.browser-open { color: var(--blue); font-size: 14px; font-weight: 800; }
.site-stage { position: absolute; inset: 0; z-index: 2; overflow: hidden; background: transparent; }
.site-stage iframe { width: 1440px; height: 1000px; border: 0; pointer-events: none; transform: scale(.42); transform-origin: 0 0; background: #fff; opacity: 1; }
.case-card-featured .site-stage iframe { transform: scale(.76); }
.preview-fallback { position: absolute; z-index: 1; inset: 0; display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 80px 24px 40px; text-align: center; color: #fff; }
.preview-fallback span { font-size: 11px; letter-spacing: .28em; font-weight: 800; opacity: .72; }
.preview-fallback strong { margin-top: 8px; font-size: clamp(34px, 5vw, 72px); line-height: .95; letter-spacing: -.055em; }
.preview-fallback small { margin-top: 15px; font-size: 11px; letter-spacing: .1em; text-transform: uppercase; opacity: .66; }
.preview-fallback-ruyi { color: #3a2c25; }
.preview-fallback-angies { color: #432c19; }
.live-badge { position: absolute; z-index: 5; left: 28px; bottom: 26px; display: inline-flex; align-items: center; gap: 7px; padding: 8px 11px; border: 1px solid rgba(255,255,255,.4); border-radius: 999px; background: rgba(4,21,31,.78); color: #fff; backdrop-filter: blur(12px); -webkit-backdrop-filter: blur(12px); font-size: 9px; text-transform: uppercase; letter-spacing: .11em; font-weight: 800; }
.live-badge::before { content: ""; width: 6px; height: 6px; border-radius: 50%; background: #73e1ab; box-shadow: 0 0 0 4px rgba(115,225,171,.13); }
.preview-cta { position: absolute; z-index: 5; right: 26px; bottom: 24px; display: inline-flex; align-items: center; gap: 10px; min-height: 38px; padding: 0 13px 0 15px; border-radius: 999px; background: rgba(255,255,255,.93); box-shadow: 0 10px 28px rgba(0,0,0,.12); color: #173447; font-size: 10px; font-weight: 800; transition: transform .25s ease, background .25s ease; }
.preview-cta b { color: var(--blue); font-size: 13px; }
.case-link:hover .preview-cta { transform: translateY(-2px); background: #fff; }
.case-meta { display: flex; justify-content: space-between; align-items: flex-end; gap: 20px; padding: 18px 5px 0; }
.case-meta p { margin: 0 0 5px; color: #78909f; font-size: 10px; letter-spacing: .12em; text-transform: uppercase; font-weight: 750; }
.case-meta h3 { margin: 0; font-size: 19px; letter-spacing: -.025em; }
.case-meta small { display: block; margin-top: 6px; color: #8ba0ad; font-size: 10px; }
.case-meta > span { flex: 0 0 auto; font-size: 11px; color: #718794; border: 1px solid #d2dfe6; border-radius: 99px; padding: 7px 10px; }

.why { color: #fff; background: linear-gradient(135deg,#0b2436,#061624 72%); }
.why-layout { display: grid; grid-template-columns: .78fr 1.22fr; gap: 100px; align-items: start; }
.kicker-light { color: #75cff9; }
.why-copy > p:not(.kicker) { color: #9fb2bf; line-height: 1.78; margin: 28px 0 34px; max-width: 480px; font-size: 14px; }
.why-list { border-top: 1px solid #274356; }
.why-row { display: grid; grid-template-columns: 60px 1fr; gap: 22px; padding: 30px 0; border-bottom: 1px solid #274356; }
.why-num { color: #65c7f5; font-size: 10px; letter-spacing: .11em; padding-top: 6px; }
.why-row h3 { margin: 0; font-size: 24px; letter-spacing: -.035em; }
.why-row p { margin: 9px 0 0; color: #93a9b7; font-size: 13px; line-height: 1.7; max-width: 560px; }

.process { background: #fff; }
.process-grid { display: grid; grid-template-columns: repeat(4, 1fr); border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); }
.process-step { min-height: 220px; padding: 28px 28px 24px 0; border-right: 1px solid var(--line); }
.process-step + .process-step { padding-left: 28px; }
.process-step:last-child { border-right: 0; }
.process-step span { color: var(--blue); font-size: 10px; letter-spacing: .12em; }
.process-step h3 { margin: 54px 0 8px; font-size: 22px; letter-spacing: -.035em; }
.process-step p { color: var(--muted); font-size: 12px; line-height: 1.55; }

.contact { background: #082033; color: #fff; }
.contact-shell { display: grid; grid-template-columns: .88fr 1.12fr; gap: 90px; align-items: start; }
.contact-copy > p:not(.kicker) { max-width: 500px; margin: 26px 0 38px; color: #9fb3c0; line-height: 1.75; font-size: 14px; }
.contact-note { display: flex; gap: 14px; align-items: center; padding: 16px 18px; border: 1px solid #29465b; border-radius: 14px; width: fit-content; }
.contact-note > span { width: 34px; height: 34px; display:grid;place-items:center;border-radius:50%;background:#0e5f8f;color:#fff}.contact-note strong,.contact-note small{display:block}.contact-note strong{font-size:12px}.contact-note small{margin-top:3px;color:#7f98a8;font-size:10px}
.lead-form { background: #fff; color: var(--ink); padding: 34px; border-radius: 26px; box-shadow: 0 26px 70px rgba(0,0,0,.18); }
.field-row { display: grid; grid-template-columns: repeat(2, 1fr); gap: 14px; }
.lead-form label { display: block; margin-bottom: 17px; }
.lead-form label > span { display: flex; justify-content: space-between; gap: 10px; margin-bottom: 7px; color: #395467; font-size: 10px; text-transform: uppercase; letter-spacing: .09em; font-weight: 800; }
.lead-form label em { font-style: normal; font-weight: 500; color: #98a8b3; }
.lead-form input, .lead-form select, .lead-form textarea { width: 100%; border: 1px solid #d9e4ea; border-radius: 11px; background: #f9fbfc; color: var(--ink); outline: none; padding: 13px 14px; transition: border .2s ease, box-shadow .2s ease, background .2s ease; }
.lead-form input, .lead-form select { min-height: 48px; }
.lead-form textarea { resize: vertical; min-height: 104px; }
.lead-form input:focus, .lead-form select:focus, .lead-form textarea:focus { border-color: #70b6d9; box-shadow: 0 0 0 4px rgba(13,120,184,.08); background: #fff; }
.lead-form [aria-invalid="true"] { border-color: #bd3a3a; }
.form-submit { width: 100%; margin-top: 4px; }
.form-status { min-height: 18px; margin: 11px 0 0; text-align: center; font-size: 11px; color: #647d8d; }
.form-status.success { color: #1b7c57; }.form-status.error { color: #aa3030; }

.site-footer { padding: 70px 0 26px; background: #f7fafc; }
.footer-grid { display: grid; grid-template-columns: 2fr .8fr .8fr 1.2fr; gap: 52px; padding-bottom: 56px; }
.footer-brand img { width: 125px; height: 75px; object-fit: contain; margin-bottom: 15px; }
.footer-brand p { margin: 0; max-width: 270px; color: #6e8391; font-size: 12px; line-height: 1.65; }
.footer-label { margin: 0 0 16px !important; color: #91a2ad !important; font-size: 9px !important; text-transform: uppercase; letter-spacing: .14em; font-weight: 800; }
.footer-grid > div:not(.footer-brand) { display: flex; flex-direction: column; align-items: flex-start; gap: 9px; }
.footer-grid a { color: #425c6d; font-size: 12px; font-weight: 650; }
.footer-cta a { font-size: 26px; font-weight: 780; letter-spacing: -.04em; color: var(--ink); border-bottom: 1px solid #a7bdca; padding-bottom: 4px; }
.footer-cta a span { color: var(--blue); }
.footer-bottom { display: flex; justify-content: space-between; gap: 20px; padding-top: 22px; border-top: 1px solid #dae4ea; color: #8397a4; font-size: 10px; }

.reveal { opacity: 0; transform: translateY(20px); transition: opacity .72s ease, transform .72s cubic-bezier(.2,.7,.2,1); transition-delay: var(--delay, 0ms); }
.reveal.visible { opacity: 1; transform: translateY(0); }
@keyframes orbitSpin { to { transform: rotate(360deg); } }

@media (max-width: 980px) {
  .section-pad { padding: 92px 0; }
  .nav-shell { grid-template-columns: 1fr auto; }
  .desktop-nav, .desktop-cta { display: none; }
  .menu-button { display: grid; gap: 6px; width: 44px; height: 44px; border: 0; border-radius: 50%; background: var(--ink); padding: 14px 12px; cursor: pointer; }
  .menu-button span { display: block; height: 1px; background: #fff; transition: transform .2s ease; }
  .menu-button[aria-expanded="true"] span:first-child { transform: translateY(3.5px) rotate(45deg); }.menu-button[aria-expanded="true"] span:last-child { transform: translateY(-3.5px) rotate(-45deg); }
  .mobile-menu { position: fixed; top: 80px; left: 0; right: 0; height: calc(100vh - 80px); background: rgba(255,255,255,.98); padding: 32px 20px; flex-direction: column; gap: 4px; }
  .mobile-menu:not([hidden]) { display: flex; }
  .mobile-menu > a:not(.button) { padding: 15px 4px; border-bottom: 1px solid #e4ebef; font-size: 25px; font-weight: 760; letter-spacing: -.035em; }
  .mobile-menu .button { margin-top: 22px; }
  .hero { min-height: auto; padding-top: 150px; }
  .hero-layout { grid-template-columns: 1fr; }
  .hero-copy { text-align: center; }
  .hero h1, .hero-lede { margin-left: auto; margin-right: auto; }
  .hero-actions, .trust-row { justify-content: center; }
  .hero-visual { min-height: 520px; }
  .orbital-card { width: min(520px, 78vw); }
  .metrics-wrap { margin-top: 38px; }
  .service-grid { grid-template-columns: 1fr; }
  .service-card { min-height: 620px; }
  .why-layout, .contact-shell { grid-template-columns: 1fr; gap: 56px; }
  .process-grid { grid-template-columns: repeat(2, 1fr); }
  .process-step:nth-child(2){border-right:0}.process-step:nth-child(-n+2){border-bottom:1px solid var(--line)}
  .footer-grid { grid-template-columns: 1.6fr 1fr 1fr; }
  .footer-cta { grid-column: 1 / -1; margin-top: 14px; }
}

@media (max-width: 720px) {
  .shell { width: min(100% - 28px, 1180px); }
  .section-pad { padding: 76px 0; }
  .nav-shell { height: 68px; }
  .brand img { width: 88px; height: 53px; }
  .mobile-menu { top: 68px; height: calc(100vh - 68px); }
  .hero { padding-top: 122px; }
  .hero h1 { font-size: clamp(46px, 14vw, 64px); }
  .hero-lede { font-size: 16px; }
  .hero-actions { flex-direction: column; align-items: stretch; max-width: 380px; margin-left: auto; margin-right: auto; }
  .text-link { justify-content: center; padding: 8px; }
  .trust-row { flex-wrap: wrap; gap: 12px 18px; }
  .hero-visual { min-height: 390px; }
  .orbital-card { width: min(360px, 94vw); border-radius: 30px; }
  .logo-core { width: 135px; height: 135px; }.logo-core img{width:116px;height:116px}.ring-one{width:200px;height:200px}.ring-two{width:280px;height:280px}.ring-three{width:340px;height:340px}.float-chip{min-width:90px;padding:8px 9px;font-size:9px}.chip-top{top:40px;right:18px}.chip-right{right:8px;bottom:72px}.chip-bottom{left:18px;bottom:46px}
  .metrics-wrap { grid-template-columns: 1fr; }
  .metric { border-right: 0; border-bottom: 1px solid #cfdee7; padding: 18px 0; }.metric:last-child{border-bottom:0}
  .section-heading { display: block; margin-bottom: 34px; }.section-heading > p { margin-top: 18px; }
  .section-heading h2, .why h2, .contact h2 { font-size: 43px; }
  .service-card { min-height: 660px; padding: 26px; }.service-topline{margin-bottom:46px}.service-card h3{font-size:29px}.service-card ul{grid-template-columns:1fr}.card-link{left:26px;bottom:26px}.card-graphic{width:54%;min-width:225px;height:210px}.social-mini-card{width:200px}.social-mini-card.second{right:60px}
  .live-work-grid { grid-template-columns: 1fr; gap: 30px; }.case-card-featured{grid-column:auto}.case-preview,.case-card-featured .case-preview{height:430px}.site-stage iframe,.case-card-featured .site-stage iframe{transform:scale(.38)}.browser-chrome{top:10px;left:10px;right:10px}.live-badge{left:18px;bottom:18px}.preview-cta{right:18px;bottom:16px}
  .why-layout { gap: 44px; }
  .process-grid { grid-template-columns: 1fr; border-bottom: 0; }.process-step,.process-step + .process-step{padding:23px 0;border-right:0;border-bottom:1px solid var(--line)}.process-step h3{margin-top:30px}
  .lead-form { padding: 24px; }.field-row{grid-template-columns:1fr}
  .footer-grid { grid-template-columns: 1fr 1fr; gap: 36px 24px; }.footer-brand,.footer-cta{grid-column:1 / -1}.footer-bottom{flex-direction:column}
}

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