
:root{--blue:#0875f7;--ink:#070b10;--navy:#061522;--muted:#59636e;--line:#e5eaf0;--soft:#f5f9fd}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;font-family:Arial,Helvetica,sans-serif;color:var(--ink);line-height:1.45}a{text-decoration:none;color:inherit}.wrap{width:min(1400px,92%);margin:auto}
header{height:78px;background:#fff;position:sticky;top:0;z-index:100;border-bottom:1px solid #edf0f3}.nav{height:100%;display:flex;align-items:center;justify-content:space-between;gap:28px}.logo{font-size:34px;font-weight:900;letter-spacing:-2.5px;line-height:.75}.logo b{color:var(--blue)}.logo small{display:block;font-size:6px;letter-spacing:.12em;text-align:center;margin-top:8px}.menu{display:flex;gap:28px;align-items:center;font-size:14px;font-weight:700}.menu a{padding:29px 0}.menu a:hover{color:var(--blue)}
.btn{display:inline-flex!important;align-items:center;justify-content:center;background:var(--blue);color:#fff!important;border-radius:7px;padding:14px 24px!important;font-weight:800;border:0;cursor:pointer}.btn.light{background:#fff;color:#09111a!important}.btn.outline{background:#fff;color:#0b1015!important;border:1.5px solid #111}
.hero{background:linear-gradient(90deg,#f7fbff 0,#fff 48%,#eef6ff 100%)}.hero-grid{display:grid;grid-template-columns:42% 58%;min-height:550px;align-items:center}.hero-copy{padding:50px 25px 40px 0}.eyebrow{font-size:11px;font-weight:900;letter-spacing:.35em;text-transform:uppercase;color:#4f5964}.hero h1{font-size:62px;line-height:.94;letter-spacing:-3.8px;margin:16px 0}.hero h1 span,.blue{color:var(--blue)}.hero p{font-size:19px;max-width:610px;color:#252d35}.actions{display:flex;gap:15px;margin-top:24px}.hero-art{height:550px}.hero-art img{width:100%;height:100%;object-fit:cover}.proof{display:grid;grid-template-columns:repeat(4,1fr);gap:18px;margin-top:34px}.proof div{font-size:13px;font-weight:800}.proof span{color:var(--blue);font-size:20px;margin-right:7px}
.servicebar{border-top:1px solid var(--line);border-bottom:1px solid var(--line)}.services{display:grid;grid-template-columns:repeat(4,1fr)}.service{display:flex;gap:15px;padding:25px 25px;border-right:1px solid var(--line);align-items:center}.service:last-child{border:0}.icon{width:52px;height:52px;display:grid;place-items:center;border-radius:50%;background:#eaf4ff;color:var(--blue);font-size:24px;flex:none}.service h3{margin:0 0 3px;font-size:17px}.service p{margin:0;color:var(--muted);font-size:13px}
.section{padding:88px 0}.dark{background:var(--navy);color:white}.section-title{display:flex;justify-content:space-between;align-items:end;gap:40px;margin-bottom:35px}.section h2{font-size:46px;line-height:1;letter-spacing:-2.4px;margin:10px 0}.section-title p{max-width:590px;color:var(--muted)}.dark .section-title p{color:#c6d0da}
.work{display:grid;grid-template-columns:repeat(4,1fr);gap:15px}.work-card{background:#fff;color:#090d12;border-radius:4px;overflow:hidden}.work-card img{width:100%;height:180px;object-fit:cover}.work-card .txt{padding:14px 16px}.work-card h3{font-size:14px;margin:0;text-transform:uppercase}.work-card p{font-size:12px;color:#59636e;margin:4px 0}
.benefits{display:grid;grid-template-columns:1.25fr repeat(4,1fr);gap:12px;align-items:stretch}.benefit-lead{padding-right:30px}.benefit{border:1px solid var(--line);border-radius:8px;padding:24px;background:white}.benefit .icon{margin-bottom:15px}.benefit h3{font-size:16px;margin:0 0 8px}.benefit p{font-size:13px;color:var(--muted);margin:0}
.pagehero{padding:95px 0 80px;background:linear-gradient(120deg,#f5faff,#fff)}.pagehero h1{font-size:62px;line-height:.94;letter-spacing:-3.5px;max-width:900px;margin:14px 0}.pagehero p{font-size:20px;max-width:760px;color:var(--muted)}.split{display:grid;grid-template-columns:1fr 1fr;gap:60px;align-items:center}.split img{width:100%;height:420px;object-fit:cover;border-radius:10px}
.cards{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}.card{border:1px solid var(--line);border-radius:10px;padding:30px}.card h3{font-size:22px;margin:10px 0}.card p{color:var(--muted)}.num{font-size:13px;font-weight:900;color:var(--blue)}
.brand-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:22px}.brand-panel{min-height:300px;border-radius:12px;padding:35px;background:var(--soft)}.brand-panel.darkpanel{background:var(--navy);color:white}.swatches{display:flex;gap:10px;margin:25px 0}.swatch{width:62px;height:62px;border-radius:8px}.s1{background:#0875f7}.s2{background:#061522}.s3{background:#eaf4ff}.s4{background:#fff;border:1px solid #ddd}
.price-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}.price-card{border:1px solid var(--line);padding:32px;border-radius:12px}.price-card.featured{border:2px solid var(--blue)}.price{font-size:44px;font-weight:900}.checks{list-style:none;padding:0}.checks li{padding:6px 0}.checks li:before{content:"✓";color:var(--blue);font-weight:900;margin-right:10px}
.faq details{border-bottom:1px solid var(--line);padding:18px 0}.faq summary{font-weight:800;font-size:18px;cursor:pointer}.contact{display:grid;grid-template-columns:.8fr 1.2fr;gap:60px}.form{padding:34px;border:1px solid var(--line);border-radius:12px}.form label{font-size:13px;font-weight:800;display:block}.form input,.form select,.form textarea{width:100%;padding:13px;border:1px solid #cbd4dd;border-radius:6px;margin:6px 0 15px;font:inherit}.form textarea{min-height:140px}
.cta{text-align:center;padding:85px 0;background:var(--blue);color:#fff}.cta h2{font-size:47px;line-height:1;letter-spacing:-2px;max-width:850px;margin:0 auto 18px}.cta p{font-size:18px;max-width:700px;margin:0 auto 25px}.footer{padding:50px 0;background:#030b12;color:#fff}.footer-grid{display:grid;grid-template-columns:1.5fr repeat(3,1fr);gap:40px}.footer p,.footer a{color:#a8b4bf}.footer a{display:block;margin:8px 0;font-size:14px}
@media(max-width:1000px){.menu a:not(.btn){display:none}.hero-grid{grid-template-columns:1fr}.hero-art{height:410px}.hero h1,.pagehero h1{font-size:52px}.services,.work{grid-template-columns:1fr 1fr}.benefits{grid-template-columns:1fr 1fr}.benefit-lead{grid-column:1/-1}.split,.contact{grid-template-columns:1fr}.cards,.price-grid{grid-template-columns:1fr 1fr}}
@media(max-width:620px){.hero h1,.pagehero h1{font-size:42px}.hero-copy{padding-right:0}.proof,.services,.work,.benefits,.cards,.price-grid,.brand-grid{grid-template-columns:1fr}.actions{flex-direction:column}.section-title{display:block}.section h2,.cta h2{font-size:36px}.footer-grid{grid-template-columns:1fr}.hero-art{height:320px}}
