:root { --ink:#061a33; --cream:#f4f8fd; --lime:#33a2ff; --orange:#1268d4; --muted:#52657a; --blue:#0878ef; --pale-blue:#dcecff; }
* { box-sizing:border-box; }
html { scroll-behavior:smooth; }
body { margin:0; background:var(--cream); color:var(--ink); font-family:Arial, Helvetica, sans-serif; }
a { color:inherit; text-decoration:none; }
.nav-wrap { height:88px; display:flex; align-items:center; justify-content:space-between; padding:0 5vw; border-bottom:1px solid rgba(6,26,51,.12); position:relative; z-index:10; background:rgba(255,255,255,.62); }
.brand { display:flex; align-items:center; gap:12px; font-size:17px; font-weight:800; letter-spacing:-.02em; }
.brand-mark { width:44px; height:44px; border-radius:50%; background:var(--ink); color:white; border:3px solid var(--blue); display:grid; place-items:center; font-size:13px; letter-spacing:-.08em; box-shadow:inset 0 0 0 2px rgba(255,255,255,.15); }
nav { display:flex; gap:34px; font-size:14px; font-weight:700; }
nav a:hover { opacity:.55; }
.nav-cta { min-width:174px; min-height:54px; background:linear-gradient(135deg,var(--blue),#0757bd); color:white; padding:16px 25px; border-radius:99px; font-size:15px; font-weight:800; display:flex; align-items:center; justify-content:center; box-shadow:0 12px 28px rgba(8,120,239,.22); }
.nav-cta span,.button span { margin-left:12px; }
.hero { min-height:720px; display:grid; grid-template-columns:1.03fr .97fr; padding:84px 5vw 66px; overflow:hidden; }
.hero-copy { padding-top:32px; position:relative; z-index:2; }
.eyebrow { display:flex; align-items:center; gap:10px; text-transform:uppercase; letter-spacing:.17em; font-size:11px; font-weight:800; margin:0 0 28px; }
.eyebrow span { width:38px; height:3px; background:var(--blue); display:inline-block; }
h1 { font-size:clamp(58px,6.2vw,98px); line-height:.91; letter-spacing:-.065em; margin:0; font-weight:800; max-width:820px; }
h1 em, h2 em { color:var(--blue); font-family:Georgia, serif; font-weight:400; }
.hero-lede { max-width:590px; font-size:18px; line-height:1.65; color:var(--muted); margin:36px 0 34px; }
.hero-actions { display:flex; align-items:center; gap:30px; }
.button { display:inline-flex; align-items:center; padding:17px 22px; border-radius:5px; font-size:14px; font-weight:800; }
.primary { background:linear-gradient(135deg,var(--blue),#0757bd); color:white; box-shadow:0 10px 25px rgba(8,120,239,.22); }
.text-link { font-size:13px; font-weight:800; border-bottom:1px solid var(--ink); padding:10px 0; }
.text-link span { margin-left:10px; }
.hero-visual { position:relative; min-height:560px; }
.hero-visual:before { content:""; position:absolute; width:540px; height:540px; border-radius:50%; background:linear-gradient(135deg,#dcecff,#78bbff); top:-12px; right:-2%; }
.hero-visual:after { content:""; position:absolute; width:450px; height:450px; border:2px solid rgba(8,120,239,.38); border-radius:50%; top:33px; right:7%; }
.phone-frame { position:absolute; width:305px; height:530px; background:var(--ink); border:8px solid white; border-radius:30px; top:0; right:17%; transform:rotate(4deg); z-index:2; box-shadow:0 28px 50px rgba(6,26,51,.3); overflow:hidden; color:white; }
.phone-top { height:46px; padding:20px; display:flex; gap:4px; }
.phone-top span { width:5px; height:5px; border-radius:50%; background:#81918b; }
.phone-content { padding:38px 27px; }
.phone-content p { color:#55b4ff; letter-spacing:.14em; font-size:9px; font-weight:800; }
.phone-content>strong { font-size:29px; line-height:1.05; letter-spacing:-.04em; }
.mini-chart { height:150px; display:flex; align-items:flex-end; gap:10px; margin:35px 0 24px; border-bottom:1px solid #52615c; }
.mini-chart i { width:22px; background:linear-gradient(#39a7ff,#0878ef); border-radius:4px 4px 0 0; }
.metric { display:flex; justify-content:space-between; color:#bcc6c2; font-size:11px; }
.metric b { color:#55b4ff; }
.signal-card { position:absolute; z-index:4; background:white; box-shadow:0 18px 35px rgba(6,26,51,.18); border-radius:12px; padding:20px 23px; display:flex; gap:14px; align-items:center; }
.signal-card small,.signal-card strong { display:block; }
.signal-card small { font-size:11px; color:#6a7c90; margin-bottom:5px; }
.signal-card strong { font-size:14px; }
.card-a { left:-2%; top:82px; }
.signal-icon { color:var(--blue); font-size:18px; }
.card-b { right:-2%; bottom:65px; }
.live-dot { width:8px; height:8px; background:#51bf70; border-radius:50%; margin-left:15px; }
.hero-stamp { position:absolute; z-index:5; left:3%; bottom:18px; width:132px; height:132px; border:2px solid var(--blue); color:var(--ink); border-radius:50%; display:grid; place-items:center; text-align:center; font-size:12px; font-weight:800; letter-spacing:.11em; transform:rotate(-8deg); background:rgba(255,255,255,.62); }
.hero-stamp b { font-size:23px; color:var(--blue); }
.industry-strip { background:white; border-top:1px solid #d7e3f0; border-bottom:1px solid #d7e3f0; padding:27px 0; overflow:hidden; }
.marquee-track { display:flex; width:max-content; animation:industry-scroll 28s linear infinite; }
.marquee-group { display:flex; align-items:center; gap:48px; padding-right:48px; white-space:nowrap; }
.marquee-group strong { font-size:16px; font-weight:900; text-transform:uppercase; letter-spacing:.12em; color:var(--blue); }
.marquee-group strong:after { content:"◆"; margin-left:48px; font-size:11px; color:var(--ink); }
.marquee-group span { font-family:Georgia,serif; font-size:22px; color:#263e58; }
@keyframes industry-scroll { from { transform:translateX(0); } to { transform:translateX(-50%); } }
.section { padding:110px 5vw; }
.section-heading { display:grid; grid-template-columns:.6fr 1.1fr 1fr; gap:55px; align-items:start; margin-bottom:60px; }
.section h2 { font-size:clamp(40px,4.2vw,66px); line-height:1; letter-spacing:-.055em; margin:0; }
.section-heading>p:last-child { margin:9px 0 0; color:var(--muted); line-height:1.7; font-size:16px; }
.service-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:18px; }
.service-grid article { background:white; padding:28px; min-height:360px; position:relative; border-top:3px solid var(--ink); }
.service-number { font-size:11px; color:#8c9692; }
.service-icon { height:115px; margin:35px 0 30px; display:grid; place-items:center; }
.service-icon span { display:block; width:88px; height:88px; border:13px solid #66b7ff; border-radius:50%; position:relative; }
.icon-02 span { border-radius:3px; border-color:var(--blue); transform:rotate(8deg); }
.icon-03 span { border-color:var(--ink); border-left-color:var(--blue); }
.service-grid h3 { font-size:23px; letter-spacing:-.035em; margin:0 0 14px; }
.service-grid p { color:var(--muted); font-size:14px; line-height:1.65; margin:0; }
.process { background:var(--ink); color:white; display:grid; grid-template-columns:1fr 1fr; gap:10vw; }
.eyebrow.light { color:#62b8ff; }
.process-copy>p:nth-of-type(2) { color:#b6c0bc; max-width:580px; line-height:1.7; margin:30px 0; }
.light-button { background:white; color:var(--ink); margin-top:10px; }
.process ol { list-style:none; margin:0; padding:0; }
.process li { border-top:1px solid #44534e; padding:27px 0; display:flex; gap:35px; }
.process li b { color:#62b8ff; font-size:11px; }
.process li strong,.process li span { display:block; }
.process li strong { font-size:19px; margin-bottom:8px; }
.process li span { color:#9ba8a3; font-size:13px; line-height:1.5; }
.difference { background:white; }
.difference-card { max-width:1100px; margin:auto; text-align:center; }
.difference-card .eyebrow { justify-content:center; }
.difference-card>p:nth-of-type(2) { max-width:760px; margin:30px auto 50px; color:var(--muted); line-height:1.75; }
.proof-row { display:grid; grid-template-columns:repeat(3,1fr); border-top:1px solid #d8ddd9; padding-top:36px; }
.proof-row div { border-right:1px solid #d8ddd9; padding:0 25px; }
.proof-row div:last-child { border:0; }
.proof-row strong,.proof-row span { display:block; }
.proof-row strong { font-size:18px; margin-bottom:8px; }
.proof-row span { color:var(--muted); font-size:13px; }
.contact { background:linear-gradient(135deg,#0878ef,#0657b8); color:white; text-align:center; }
.contact .eyebrow { justify-content:center; color:var(--ink); }
.contact .eyebrow span { background:var(--ink); }
.contact h2 { max-width:950px; margin:auto; }
.contact>p:nth-of-type(2) { margin:25px auto 35px; max-width:620px; line-height:1.6; }
.contact-actions { display:flex; justify-content:center; gap:14px; flex-wrap:wrap; }
.contact-button { background:white; color:var(--ink); min-width:245px; justify-content:center; }
.contact-button.outline { background:transparent; color:white; border:1px solid rgba(255,255,255,.7); }
footer { min-height:140px; background:#061a33; color:white; padding:32px 5vw; display:flex; align-items:center; justify-content:space-between; gap:25px; font-size:12px; }
footer .brand-mark { background:white; color:var(--ink); }
footer p { color:#9fb2c8; }
.footer-contact { display:flex; gap:20px; flex-wrap:wrap; }
.footer-contact a { color:white; font-weight:700; }
.footer-contact a:hover { color:#62b8ff; }

@media (max-width:900px) {
  nav { display:none; }
  .hero { grid-template-columns:1fr; padding-top:45px; }
  .hero-visual { margin-top:45px; min-height:520px; }
  .section-heading { grid-template-columns:1fr; gap:18px; }
  .service-grid { grid-template-columns:1fr; }
  .service-grid article { min-height:300px; }
  .process { grid-template-columns:1fr; }
}
@media (max-width:600px) {
  .nav-wrap { height:72px; }
  .nav-cta { font-size:0; width:42px; min-width:42px; min-height:42px; height:42px; padding:0; display:grid; place-items:center; }
  .nav-cta span { font-size:17px; margin:0; }
  .hero { padding-left:6vw; padding-right:6vw; }
  h1 { font-size:53px; }
  .hero-actions { align-items:flex-start; flex-direction:column; gap:12px; }
  .hero-visual { min-height:470px; transform:scale(.86); transform-origin:top center; margin-bottom:-55px; }
  .phone-frame { right:9%; }
  .card-a { left:-5%; }
  .marquee-group { gap:32px; padding-right:32px; }
  .marquee-group strong:after { margin-left:32px; }
  .marquee-group strong { font-size:14px; }
  .marquee-group span { font-size:19px; }
  .section { padding:80px 6vw; }
  .proof-row { grid-template-columns:1fr; gap:28px; }
  .proof-row div { border:0; }
  .contact-actions { flex-direction:column; align-items:stretch; }
  .contact-button { width:100%; min-width:0; }
  footer { flex-direction:column; align-items:flex-start; }
  .footer-contact { flex-direction:column; gap:10px; }
}

@media (prefers-reduced-motion:reduce) {
  html { scroll-behavior:auto; }
  .marquee-track { animation-play-state:paused; }
}