:root { --zsf-navy:#02152c; --zsf-ink:#071b32; --zsf-blue:#0759cf; --zsf-teal:#009d96; --zsf-violet:#6535c9; --zsf-gold:#ffca05; --zsf-line:#dbe5ef; --zsf-muted:#506277; --zsf-surface:#f5f8fc; }
.zsf2-page { color:var(--zsf-ink); overflow:hidden; background:#fff; }.zsf2-page * { box-sizing:border-box; }
.zsf2-hero { min-height:650px; display:flex; align-items:center; position:relative; isolation:isolate; overflow:hidden; padding:0; background:var(--zsf-navy); }.zsf2-hero::before { content:""; position:absolute; z-index:1; inset:0; background:linear-gradient(90deg,rgba(1,15,37,.91) 0%,rgba(1,15,37,.76) 49%,rgba(1,15,37,.36) 100%); }.zsf2-hero::after { content:""; position:absolute; z-index:1; right:-9%; bottom:-32%; width:min(53vw,720px); aspect-ratio:1; border:1px solid rgba(255,202,5,.52); border-radius:50%; box-shadow:0 0 0 36px rgba(255,255,255,.025),0 0 0 76px rgba(255,255,255,.018); animation:zsf-orbit 13s linear infinite; }.zsf2-hero-img { position:absolute; inset:0; width:100%; height:100%; object-fit:cover; object-position:center; filter:saturate(.82) contrast(1.13); }.zsf2-hero-inner { position:relative; z-index:2; max-width:1200px; text-align:left; }
.zsf2-kicker { color:var(--zsf-gold); display:inline-flex; align-items:center; gap:9px; font:800 .78rem/1 var(--font-display); letter-spacing:.1em; text-transform:uppercase; }.zsf2-kicker::before { content:""; width:9px; height:9px; border-radius:50%; background:currentColor; box-shadow:0 0 0 7px rgba(255,202,5,.14); }
.zsf2-hero h1,.zsf2-heading h2,.zsf2-intro-copy h2,.zsf2-ai-copy h2,.zsf2-cta h2 { font-family:var(--font-display); letter-spacing:-.055em; }.zsf2-hero h1 { max-width:750px; margin:18px 0 26px; color:#fff; font-size:clamp(3.25rem,6.25vw,6.05rem); line-height:.94; }.zsf2-hero h1 span { color:#fff; }.zsf2-hero p { max-width:570px; margin:0 0 34px; color:#e2edf8; font-size:1.08rem; line-height:1.65; }.zsf2-hero-cta { display:inline-flex; align-items:center; gap:16px; padding:16px 20px; border:0; border-radius:0; background:#fff; color:var(--zsf-navy); font:800 .84rem/1 var(--font-display); text-decoration:none; transition:background .2s ease,gap .2s ease; }.zsf2-hero-cta:hover { gap:22px; background:var(--zsf-gold); }.zsf2-hero-cta span,.zsf2-cta .button span { font-size:1.22em; }.zsf2-hero-index { position:absolute; right:24px; bottom:42px; color:#fff; font:500 .7rem/1 var(--font-display); letter-spacing:.14em; }.zsf2-hero-index::before { content:""; display:inline-block; width:45px; margin:0 12px 3px 0; border-top:1px solid var(--zsf-gold); }
.zsf2-intro,.zsf2-services,.zsf2-tech { padding:92px 0; }.zsf2-intro { background:var(--zsf-surface); }.zsf2-intro-grid { display:grid; grid-template-columns:minmax(0,1.1fr) minmax(480px,.9fr); gap:64px; align-items:center; }.zsf2-intro-copy h2 { margin:14px 0; max-width:620px; font-size:clamp(2.35rem,3.7vw,4.05rem); line-height:1; }.zsf2-intro-copy p { max-width:650px; margin:0; color:var(--zsf-muted); font-size:1.08rem; line-height:1.7; }.zsf2-outcome-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:12px; }.zsf2-outcome-grid article { min-height:195px; padding:22px 17px; background:#fff; border-top:3px solid var(--zsf-gold); }.zsf2-outcome-grid article:nth-child(2) { border-color:var(--zsf-teal); }.zsf2-outcome-grid article:nth-child(3) { border-color:var(--zsf-violet); }.zsf2-outcome-grid img { width:54px; height:54px; object-fit:contain; }.zsf2-outcome-grid b,.zsf2-outcome-grid span { display:block; }.zsf2-outcome-grid b { margin-top:22px; font-family:var(--font-display); font-size:1rem; }.zsf2-outcome-grid span { margin-top:7px; color:var(--zsf-muted); font-size:.88rem; line-height:1.45; }
.zsf2-heading { max-width:900px; margin:0 auto 42px; text-align:center; }.zsf2-heading h2 { margin:14px auto 10px; font-size:clamp(2.35rem,4.3vw,4.65rem); line-height:.98; }.zsf2-heading p { max-width:710px; margin:auto; color:var(--zsf-muted); line-height:1.65; }.zsf2-service-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:22px; }.zsf2-service-card { min-height:510px; padding:27px; display:flex; flex-direction:column; border:1px solid var(--zsf-line); border-top:5px solid var(--zsf-blue); background:#fff; transition:transform .25s ease,box-shadow .25s ease; }.zsf2-service-card:hover { transform:translateY(-7px); box-shadow:0 20px 45px rgba(2,21,44,.12); }.zsf2-card-teal { border-top-color:var(--zsf-teal); }.zsf2-card-violet { border-top-color:var(--zsf-violet); }.zsf2-card-top { display:flex; align-items:center; justify-content:space-between; }.zsf2-card-top img { width:76px; height:76px; object-fit:contain; }.zsf2-card-top span { color:#b9c5d3; font:800 1rem/1 var(--font-display); }.zsf2-service-card h3 { margin:30px 0 12px; font:800 clamp(1.52rem,2vw,2rem)/1.02 var(--font-display); letter-spacing:-.04em; }.zsf2-card-blue h3 { color:var(--zsf-blue); }.zsf2-card-teal h3 { color:#007f7a; }.zsf2-card-violet h3 { color:#5630ad; }.zsf2-service-card p { margin:0; color:var(--zsf-muted); line-height:1.58; }.zsf2-service-card ul { padding:0; margin:26px 0; list-style:none; }.zsf2-service-card li { position:relative; padding:0 0 12px 22px; color:#25394d; line-height:1.42; }.zsf2-service-card li::before { content:""; position:absolute; left:0; top:.45em; width:8px; height:8px; border-radius:50%; background:var(--zsf-blue); }.zsf2-card-teal li::before { background:var(--zsf-teal); }.zsf2-card-violet li::before { background:var(--zsf-violet); }.zsf2-service-card strong { display:block; margin-top:auto; padding-top:18px; border-top:1px solid var(--zsf-line); font:800 .94rem/1.35 var(--font-display); color:var(--zsf-ink); }
.zsf2-ai { padding:78px 0; background:linear-gradient(120deg,#02152c,#083d75); }.zsf2-ai-layout { display:grid; grid-template-columns:minmax(0,.82fr) minmax(0,1.18fr); gap:62px; align-items:center; }.zsf2-ai-copy h2 { margin:14px 0; color:#fff; font-size:clamp(2.35rem,3.8vw,4.2rem); line-height:.98; }.zsf2-ai-copy p { max-width:540px; color:#cad9ea; line-height:1.68; }.zsf2-ai-brands { display:flex; gap:18px; align-items:center; margin-top:27px; }.zsf2-ai-brands img { width:42px; height:42px; object-fit:contain; filter:brightness(0) invert(1); }.zsf2-ai-brands img:first-child { filter:none; }.zsf2-ai-flow { display:grid; grid-template-columns:repeat(2,1fr); border-top:1px solid rgba(255,255,255,.2); border-left:1px solid rgba(255,255,255,.2); }.zsf2-ai-flow article { min-height:155px; padding:23px; border-right:1px solid rgba(255,255,255,.2); border-bottom:1px solid rgba(255,255,255,.2); background:rgba(255,255,255,.035); }.zsf2-ai-flow img { width:56px; height:56px; object-fit:contain; }.zsf2-ai-flow b { display:block; max-width:215px; margin-top:16px; color:#fff; font:800 1.05rem/1.18 var(--font-display); }
.zsf2-method { padding:92px 0; background:var(--zsf-navy); }.zsf2-heading-light h2 { color:#fff; }.zsf2-journey { display:grid; grid-template-columns:repeat(6,1fr); position:relative; border-top:1px solid rgba(255,255,255,.2); }.zsf2-journey::before { content:""; position:absolute; top:44px; left:8%; right:8%; border-top:2px dashed rgba(255,202,5,.65); }.zsf2-journey article { position:relative; z-index:1; padding:27px 15px 0; text-align:center; }.zsf2-journey span { display:block; width:38px; height:38px; margin:0 auto 13px; padding-top:10px; border-radius:50%; background:var(--zsf-gold); color:var(--zsf-navy); font:800 .72rem/1 var(--font-display); }.zsf2-journey img { width:68px; height:68px; padding:8px; object-fit:contain; background:#fff; border-radius:50%; }.zsf2-journey h3 { margin:17px 0 7px; color:#fff; font:800 1.05rem/1 var(--font-display); }.zsf2-journey p { margin:0; color:#b9c9da; font-size:.84rem; line-height:1.45; }
.zsf2-tech { background:#fff; }.zsf2-tech-grid { display:grid; grid-template-columns:repeat(4,1fr); gap:1px; border:1px solid var(--zsf-line); background:var(--zsf-line); }.zsf2-tech-grid article { min-height:165px; padding:22px; background:#fff; }.zsf2-tech-grid>article>img { width:56px; height:56px; object-fit:contain; }.zsf2-tech-grid b,.zsf2-tech-grid span { display:block; }.zsf2-tech-grid b { margin-top:13px; font:800 1rem/1 var(--font-display); }.zsf2-tech-grid span { margin-top:7px; color:var(--zsf-muted); font-size:.9rem; line-height:1.45; }.zsf2-tech-cloud,.zsf2-tech-ai { display:grid; grid-template-columns:repeat(3,1fr); align-items:center; gap:9px; }.zsf2-tech-ai { grid-template-columns:repeat(2,1fr); }.zsf2-tech-cloud>img,.zsf2-tech-ai>img { width:42px; height:42px; object-fit:contain; }.zsf2-tech-cloud>div,.zsf2-tech-ai>div { grid-column:1/-1; }
.zsf2-cta { padding:0 0 78px; background:#fff; }.zsf2-cta-shell { display:flex; gap:40px; align-items:center; justify-content:space-between; padding:42px 48px; background:linear-gradient(105deg,#02152c,#083d75); }.zsf2-cta h2 { max-width:690px; margin:12px 0 0; color:#fff; font-size:clamp(2rem,3vw,3.4rem); line-height:1; }.zsf2-cta .button { flex:none; display:inline-flex; align-items:center; gap:12px; }
@keyframes zsf-orbit { to { transform:rotate(360deg); } }
@media (max-width:1050px) { .zsf2-intro-grid,.zsf2-ai-layout { grid-template-columns:1fr; gap:38px; }.zsf2-service-grid { grid-template-columns:1fr; }.zsf2-service-card { min-height:0; }.zsf2-tech-grid { grid-template-columns:repeat(2,1fr); }.zsf2-journey { grid-template-columns:repeat(3,1fr); row-gap:30px; }.zsf2-journey::before { display:none; } }
@media (max-width:700px) { .zsf2-hero { min-height:580px; }.zsf2-hero h1 { font-size:clamp(2.75rem,13vw,4rem); }.zsf2-hero-index { right:16px; bottom:24px; }.zsf2-intro,.zsf2-services,.zsf2-tech,.zsf2-method { padding:62px 0; }.zsf2-outcome-grid { grid-template-columns:1fr; }.zsf2-outcome-grid article { min-height:0; display:flex; gap:18px; align-items:center; }.zsf2-outcome-grid b { margin-top:0; }.zsf2-outcome-grid span { margin-top:5px; }.zsf2-service-card { padding:23px; }.zsf2-ai { padding:62px 0; }.zsf2-ai-flow { grid-template-columns:1fr; }.zsf2-ai-flow article { min-height:0; display:flex; gap:17px; align-items:center; }.zsf2-ai-flow b { margin:0; }.zsf2-journey { grid-template-columns:repeat(2,1fr); }.zsf2-tech-grid { grid-template-columns:1fr; }.zsf2-tech-grid article { min-height:145px; }.zsf2-cta-shell { display:block; padding:34px 25px; }.zsf2-cta .button { margin-top:26px; }.zsf2-cta { padding-bottom:60px; } }
