:root { --blue:#0757c9; --deep:#071b42; --sky:#20a9ee; --yellow:#ffc400; --soft:#f3f7fc; --ink:#10213f; --muted:#5b6b85; --white:#fff; }
    * { box-sizing:border-box; }
    html { scroll-behavior:smooth; }
    body { margin:0; color:var(--ink); background:var(--white); font-family:Arial,Helvetica,sans-serif; line-height:1.55; }
    a { color:inherit; text-decoration:none; }
    .container { width:min(1120px, calc(100% - 40px)); margin:0 auto; }
    .topbar { background:var(--deep); color:#eaf3ff; font-size:.88rem; }
    .topbar .container { display:flex; justify-content:space-between; gap:16px; padding:9px 0; }
    .topbar strong { color:var(--yellow); }
    header { position:relative; overflow:hidden; background:linear-gradient(135deg,#fff 0%,#f3f8ff 53%,#dcecff 100%); }
    header:after { content:""; position:absolute; right:-120px; top:-120px; width:350px; height:350px; border-radius:50%; background:rgba(32,169,238,.13); }
    nav { position:relative; z-index:2; display:flex; align-items:center; justify-content:space-between; padding:20px 0; }
    .brand { display:flex; align-items:center; font-weight:900; letter-spacing:-.5px; }
    .brand-logo { display:block; width:78px; height:78px; }
    .brand-logo img { display:block; width:100%; height:100%; object-fit:contain; mix-blend-mode:multiply; }
    nav a { font-weight:700; font-size:.95rem; color:var(--deep); }
    .nav-links { display:flex; gap:25px; align-items:center; }
    .button { display:inline-flex; align-items:center; justify-content:center; gap:9px; border-radius:9px; padding:13px 20px; background:var(--blue); color:var(--white); font-weight:800; border:2px solid var(--blue); box-shadow:0 7px 18px rgba(7,87,201,.2); }
    .button:hover { background:#0649aa; }
    .button.yellow { background:var(--yellow); border-color:var(--yellow); color:var(--deep); box-shadow:none; }
    .button.outline { background:transparent; color:var(--blue); box-shadow:none; }
    .hero { position:relative; z-index:1; display:grid; grid-template-columns:1.08fr .92fr; gap:50px; align-items:center; padding:58px 0 78px; }
    .eyebrow { display:inline-flex; align-items:center; gap:8px; color:var(--blue); font-size:.86rem; font-weight:900; letter-spacing:1.4px; text-transform:uppercase; }
    .eyebrow:before { content:""; width:30px; height:4px; border-radius:4px; background:var(--yellow); }
    h1 { margin:16px 0 18px; color:var(--deep); font-size:clamp(2.45rem, 5.3vw, 4.7rem); line-height:.98; letter-spacing:-3px; }
    h1 em { color:var(--blue); font-style:normal; }
    .hero p { max-width:570px; color:var(--muted); font-size:1.12rem; margin:0 0 28px; }
    .hero-actions { display:flex; flex-wrap:wrap; gap:12px; }
    .hero-card { position:relative; min-height:370px; display:flex; align-items:center; justify-content:center; }
    .hero-art { position:relative; width:min(100%,420px); aspect-ratio:1/1; border-radius:37% 63% 54% 46% / 42% 38% 62% 58%; background:#fff; box-shadow:18px 20px 0 var(--yellow), 0 22px 35px rgba(7,27,66,.22); overflow:hidden; display:grid; place-items:center; padding:28px; }
    .hero-art:before { content:""; position:absolute; inset:12px; border:2px solid rgba(7,87,201,.12); border-radius:inherit; }
    .hero-logo { position:relative; z-index:1; width:100%; height:auto; display:block; mix-blend-mode:multiply; }
    .hero-badge { position:absolute; right:-4px; bottom:8px; background:#fff; border:8px solid var(--yellow); width:145px; height:145px; border-radius:50%; display:grid; place-items:center; text-align:center; font-weight:900; color:var(--deep); box-shadow:0 12px 24px rgba(7,27,66,.18); line-height:1.05; }
    .hero-badge b { display:block; color:var(--blue); font-size:2.15rem; }
    .hero-badge small { display:block; font-size:.72rem; letter-spacing:1px; }
    .trust-strip { background:var(--yellow); color:var(--deep); }
    .trust-strip .container { display:grid; grid-template-columns:repeat(4,1fr); gap:20px; padding:17px 0; text-align:center; font-weight:900; text-transform:uppercase; font-size:.88rem; }
    section { padding:82px 0; }
    .section-head { max-width:700px; margin:0 auto 38px; text-align:center; }
    .section-head h2 { margin:11px 0 10px; color:var(--deep); font-size:clamp(2rem,4vw,3rem); line-height:1.05; letter-spacing:-1.5px; }
    .section-head p { color:var(--muted); margin:0; }
    .services { background:var(--soft); }
    .service-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:18px; }
    .service { background:#fff; border-radius:15px; padding:26px 23px; border:1px solid #e2ebf5; box-shadow:0 8px 25px rgba(15,45,88,.05); transition:transform .2s ease, box-shadow .2s ease; }
    .service:hover { transform:translateY(-4px); box-shadow:0 14px 28px rgba(15,45,88,.1); }
    .service-icon { width:48px; height:48px; display:grid; place-items:center; border-radius:13px; background:#e6f2ff; color:var(--blue); font-size:1.5rem; margin-bottom:17px; }
    .service:nth-child(2) .service-icon { background:#fff6d7; color:#d49a00; }
    .service:nth-child(3) .service-icon { background:#e7f7ea; color:#3d9c41; }
    .service:nth-child(4) .service-icon { background:#f0e9ff; color:#7041bb; }
    .service:nth-child(5) .service-icon { background:#fff0e0; color:#e97a00; }
    .service:nth-child(6) .service-icon { background:#e2f6fb; color:#087d9e; }
    .service h3 { margin:0 0 7px; font-size:1.18rem; color:var(--deep); }
    .service p { color:var(--muted); margin:0; font-size:.94rem; }
    .about-grid { display:grid; grid-template-columns:.85fr 1.15fr; gap:62px; align-items:center; }
    .about-visual { background:var(--blue); border-radius:24px; padding:36px; min-height:310px; color:#fff; position:relative; overflow:hidden; }
    .about-visual:after { content:""; position:absolute; width:190px; height:190px; right:-60px; bottom:-75px; border:24px solid rgba(255,255,255,.12); border-radius:50%; }
    .about-visual-badge { width:108px; height:108px; display:grid; place-items:center; align-content:center; border:7px solid var(--yellow); border-radius:50%; color:var(--deep); background:#fff; box-shadow:0 10px 22px rgba(4,19,47,.18); line-height:1; margin-bottom:25px; }
    .about-visual-badge span { font-size:2.5rem; font-weight:900; letter-spacing:-2px; }
    .about-visual-badge small { margin-top:4px; font-size:.7rem; font-weight:900; letter-spacing:1.5px; }
    .about-visual-kicker { color:var(--yellow); font-weight:900; font-size:.78rem; letter-spacing:2px; text-transform:uppercase; margin-bottom:8px; }
    .about-visual h3 { font-size:1.7rem; line-height:1.1; margin:0 0 9px; max-width:250px; }
    .about-visual p { max-width:250px; color:#d9ebff; margin:0; }
    .about-copy .eyebrow { margin-bottom:5px; }
    .about-copy h2 { font-size:clamp(2rem,4vw,3rem); line-height:1.05; color:var(--deep); margin:12px 0 17px; letter-spacing:-1px; }
    .about-copy p { color:var(--muted); margin:0 0 17px; }
    .check-list { list-style:none; padding:0; margin:25px 0 0; display:grid; grid-template-columns:1fr 1fr; gap:12px; }
    .check-list li { font-weight:800; font-size:.94rem; }
    .check-list li:before { content:"✓"; display:inline-grid; place-items:center; width:23px; height:23px; margin-right:8px; border-radius:50%; background:#e3f3ff; color:var(--blue); }
    .contact { background:var(--deep); color:#fff; position:relative; overflow:hidden; }
    .contact:before { content:""; position:absolute; width:430px; height:430px; border:65px solid rgba(32,169,238,.12); border-radius:50%; right:-150px; top:-180px; }
    .contact-grid { position:relative; z-index:1; display:grid; grid-template-columns:1fr 1fr; gap:55px; align-items:center; }
    .contact h2 { margin:12px 0 15px; font-size:clamp(2rem,4vw,3.25rem); line-height:1.02; letter-spacing:-1.5px; }
    .contact p { color:#c4d5ee; max-width:480px; }
    .contact .coverage { margin:18px 0 24px; color:#fff; font-size:.98rem; }
    .contact .coverage strong { color:var(--yellow); }
    .contact .eyebrow { color:var(--sky); }
    .contact-cards { display:grid; gap:13px; }
    .contact-card { display:flex; gap:15px; align-items:center; padding:18px; border-radius:13px; background:rgba(255,255,255,.09); border:1px solid rgba(255,255,255,.12); }
    .contact-card .icon { width:42px; height:42px; flex:0 0 42px; display:grid; place-items:center; border-radius:10px; background:var(--yellow); color:var(--deep); font-size:1.2rem; font-weight:900; }
    .contact-card small { display:block; color:#9bb4d9; margin-bottom:2px; }
    .contact-card strong { font-size:1rem; color:#fff; overflow-wrap:anywhere; }
    footer { background:#04132f; color:#93a8c9; padding:25px 0; font-size:.86rem; }
    footer .container { display:flex; justify-content:space-between; gap:15px; flex-wrap:wrap; }
    footer strong { color:#fff; }
    @media (max-width: 840px) { .hero,.about-grid,.contact-grid { grid-template-columns:1fr; } .hero { padding-top:35px; } .hero-card { min-height:330px; margin-top:5px; } .service-grid { grid-template-columns:repeat(2,1fr); } .about-visual { min-height:250px; } }
    @media (max-width: 560px) { .container { width:min(100% - 28px, 1120px); } .topbar .container { display:block; text-align:center; } .topbar .container span + span { display:block; margin-top:3px; } nav { padding:15px 0; } .nav-links { display:none; } .brand-logo { width:64px; height:64px; } .hero { padding:35px 0 65px; } h1 { letter-spacing:-2px; } .hero-art { width:calc(100% - 22px); } .hero-badge { right:-2px; width:120px; height:120px; border-width:6px; } .hero-badge b { font-size:1.8rem; } .trust-strip .container { grid-template-columns:1fr; gap:5px; padding:14px 0; } section { padding:60px 0; } .service-grid { grid-template-columns:1fr; } .about-grid { gap:30px; } .check-list { grid-template-columns:1fr; } .contact-grid { gap:30px; } }
