:root { --navy:#0b2239; --navy-2:#102e49; --brand:#147dc8; --action:#1274ba; --action-hover:#0e6099; --cyan:#26b7c9; --ink:#172b3d; --muted:#607184; --line:#dbe3e9; --pale:#f2f6f8; --white:#fff; --radius:16px; --shadow:0 18px 50px rgba(11,34,57,.12); }
* { box-sizing:border-box; }
html { scroll-behavior:smooth; }
body { margin:0; color:var(--ink); background:var(--white); font-family:"DM Sans",Arial,sans-serif; line-height:1.6; }
a { color:inherit; }
.container { width:min(1160px,calc(100% - 40px)); margin-inline:auto; }
.skip-link { position:fixed; left:16px; top:-60px; z-index:100; padding:10px 16px; color:#fff; background:var(--action); border-radius:8px; transition:.2s; }
.skip-link:focus { top:12px; }
.sr-only { position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; border:0; }
.site-header { position:sticky; top:0; z-index:20; background:rgba(255,255,255,.94); border-bottom:1px solid rgba(219,227,233,.75); backdrop-filter:blur(16px); }
.nav-wrap { min-height:78px; display:flex; align-items:center; justify-content:space-between; }
.brand { display:inline-flex; align-items:center; text-decoration:none; }
.brand-logo { display:block; width:clamp(150px,16vw,190px); height:auto; }
.site-nav { display:flex; align-items:center; gap:32px; font-size:14px; font-weight:600; }
.site-nav a { text-decoration:none; }.site-nav>a:not(.button):hover { color:var(--action); }
.language-switch { display:inline-flex; align-items:center; gap:6px; color:#91a0ad; font-size:12px; letter-spacing:.5px; }
.language-switch strong { color:var(--action); }
.language-switch a { color:var(--muted); }
.language-switch a:hover { color:var(--action); }
.button { display:inline-flex; align-items:center; justify-content:center; gap:18px; padding:14px 21px; color:#fff; background:var(--action); border:1px solid var(--action); border-radius:8px; font-weight:700; text-decoration:none; box-shadow:0 8px 20px rgba(18,116,186,.18); transition:transform .2s,background .2s; }
.button:hover { transform:translateY(-2px); background:var(--action-hover); }.button-small { padding:10px 17px; }
.menu-toggle { display:none; border:0; background:none; padding:10px; }.menu-toggle>span:not(.sr-only) { display:block; width:25px; height:2px; margin:5px; background:var(--navy); transition:.2s; }
.hero { overflow:hidden; position:relative; background:linear-gradient(120deg,#fff 46%,#edf4f7 46%); }
.hero:after { content:""; position:absolute; inset:auto -10% 0 45%; height:2px; background:linear-gradient(90deg,transparent,var(--cyan),transparent); transform:rotate(-28deg); }
.hero-grid { min-height:650px; display:grid; grid-template-columns:1.05fr .95fr; align-items:center; gap:70px; padding-block:78px; }
.eyebrow { margin:0 0 18px; color:var(--action); text-transform:uppercase; letter-spacing:2.2px; font-size:12px; font-weight:700; }
h1,h2,h3 { font-family:"Manrope",sans-serif; line-height:1.13; margin-top:0; color:var(--navy); }
h1 { margin-bottom:24px; font-size:clamp(44px,5.3vw,70px); letter-spacing:-3.5px; } h1 span { color:var(--brand); }
.hero-intro { max-width:620px; margin:0 0 30px; font-size:18px; color:var(--muted); }
.hero-actions { display:flex; align-items:center; gap:28px; }.text-link { font-weight:700; color:var(--navy); text-decoration:none; }.text-link span { color:var(--cyan); margin-left:6px; }
.trust-list { display:flex; gap:24px; margin:42px 0 0; padding:0; list-style:none; color:var(--muted); font-size:13px; }.trust-list span { color:var(--cyan); margin-right:5px; }
.hero-visual { position:relative; height:440px; display:grid; place-items:center; }
.orbit { position:absolute; border:1px solid rgba(20,125,200,.16); border-radius:50%; }.orbit-one { width:430px; height:430px; }.orbit-two { width:315px; height:315px; border-style:dashed; animation:spin 35s linear infinite; }
@keyframes spin { to { transform:rotate(360deg); } }
.visual-card { position:absolute; background:rgba(255,255,255,.92); border:1px solid #fff; border-radius:var(--radius); box-shadow:var(--shadow); backdrop-filter:blur(12px); }
.main-card { width:min(380px,90%); padding:28px; }.card-label { font-size:10px; letter-spacing:2px; color:var(--muted); font-weight:700; }
.network-map { position:relative; height:155px; margin:12px 0; background:radial-gradient(circle at 1px 1px,rgba(20,125,200,.14) 1px,transparent 1px); background-size:16px 16px; }
.node { position:absolute; z-index:2; width:17px; height:17px; border-radius:50%; background:var(--brand); border:5px solid #dbe9fb; }.node-de { left:17%; top:30%; }.node-me { right:15%; bottom:25%; background:var(--cyan); border-color:#d7f4f6; }
.route { position:absolute; width:62%; height:75px; left:24%; top:42%; border-top:2px dashed var(--brand); border-radius:50%; transform:rotate(12deg); }
.route-labels { display:flex; justify-content:space-between; font-size:12px; font-weight:700; color:var(--navy); }
.floating-card { right:-18px; bottom:45px; padding:16px 20px; display:flex; align-items:center; gap:12px; }.floating-card strong,.floating-card small { display:block; }.floating-card strong { font-size:13px; }.floating-card small { color:var(--muted); font-size:11px; }.status-dot { width:10px; height:10px; background:var(--cyan); border-radius:50%; box-shadow:0 0 0 6px rgba(38,183,201,.12); }
.section { padding:105px 0; scroll-margin-top:76px; }.split-layout { display:grid; grid-template-columns:1fr 1fr; gap:100px; }.section h2 { font-size:clamp(34px,4vw,51px); letter-spacing:-2px; margin-bottom:0; }.body-copy { border-left:2px solid var(--cyan); padding-left:36px; }.body-copy p { margin:0 0 20px; color:var(--muted); font-size:17px; }
.products { background:var(--pale); }.section-heading { display:flex; align-items:end; justify-content:space-between; gap:50px; margin-bottom:50px; }.section-heading>p { width:360px; color:var(--muted); margin:0 0 6px; }
.product-grid { display:grid; grid-template-columns:repeat(4,1fr); gap:16px; }.product-card { min-height:315px; padding:27px; background:#fff; border:1px solid #e1e7eb; border-radius:var(--radius); transition:transform .2s,box-shadow .2s; }.product-card:hover { transform:translateY(-5px); box-shadow:var(--shadow); }.card-number { float:right; color:#aab7c2; font-size:11px; }.product-card h3 { font-size:20px; margin:28px 0 12px; }.product-card p { margin:0; font-size:14px; color:var(--muted); }
.product-icon { width:54px; height:54px; margin-top:22px; position:relative; color:var(--brand); }.monitor { border:2px solid currentColor; border-radius:5px; height:38px; }.monitor:before { content:""; position:absolute; width:20px; height:2px; background:currentColor; bottom:-9px; left:15px; }.monitor:after { content:""; position:absolute; width:2px; height:8px; background:currentColor; bottom:-8px; left:24px; }.chip { width:42px; height:42px; margin:28px 6px 6px; border:2px solid currentColor; border-radius:5px; box-shadow:7px 0 0 -5px #fff,9px 0 currentColor,-7px 0 0 -5px #fff,-9px 0 currentColor,0 7px 0 -5px #fff,0 9px currentColor,0 -7px 0 -5px #fff,0 -9px currentColor; }.network i { position:absolute; width:14px; height:14px; border:2px solid currentColor; border-radius:3px; }.network i:first-child { top:0; left:20px; }.network i:nth-child(2) { bottom:0; left:0; }.network i:last-child { bottom:0; right:0; }.network:before { content:""; position:absolute; width:38px; height:26px; border:2px solid currentColor; border-top:0; bottom:10px; left:8px; }.search { width:42px; height:42px; border:2px solid currentColor; border-radius:50%; }.search:after { content:""; position:absolute; width:21px; height:2px; background:currentColor; transform:rotate(45deg); right:-14px; bottom:-7px; }.accent-card { background:var(--navy); border-color:var(--navy); }.accent-card h3 { color:#fff; }.accent-card p { color:#aec0d0; }.accent-card .card-number { color:#71879b; }.accent-card .product-icon { color:var(--cyan); }
.why { background:var(--navy); color:#fff; }.why-grid { display:grid; grid-template-columns:.8fr 1.2fr; gap:110px; }.eyebrow-light { color:var(--cyan); }.why h2 { color:#fff; margin-bottom:24px; }.why-intro>p:last-child { color:#aabccc; }.benefits { display:grid; grid-template-columns:1fr 1fr; gap:40px; }.benefit { display:flex; gap:20px; padding-top:22px; border-top:1px solid #355069; }.benefit>span { color:var(--cyan); font-size:11px; }.benefit h3 { color:#fff; font-size:18px; margin-bottom:8px; }.benefit p { color:#aabccc; margin:0; font-size:14px; }
.contact { background:linear-gradient(135deg,#fff,#eef5f6); }.contact-panel { display:grid; grid-template-columns:1.2fr .8fr; gap:80px; padding:58px 64px; background:#fff; border:1px solid var(--line); border-radius:20px; box-shadow:var(--shadow); }.contact-panel h2 { margin-bottom:20px; }.contact-panel>div:first-child>p:last-child { color:var(--muted); max-width:560px; }.contact-details { padding-left:38px; border-left:1px solid var(--line); }.contact-details>div { margin-bottom:17px; }.contact-details span,.contact-details strong { display:block; }.contact-details span { color:var(--muted); font-size:11px; text-transform:uppercase; letter-spacing:1.4px; }.contact-details strong { color:var(--navy); font-size:15px; }
.legal-page { min-height:100vh; background:var(--pale); }.legal-nav { display:flex; align-items:center; gap:22px; }.legal-main { padding:80px 0 110px; }.legal-card { max-width:780px; padding:55px 62px; background:#fff; border:1px solid var(--line); border-radius:20px; box-shadow:var(--shadow); }.legal-card h1 { margin-bottom:42px; font-size:clamp(40px,6vw,62px); letter-spacing:-2.5px; }.legal-card h2 { margin:34px 0 10px; font-size:20px; letter-spacing:-.5px; }.legal-card p { margin:0; color:var(--muted); }.legal-card a { color:var(--action); }.legal-note { margin-top:38px!important; padding-top:22px; border-top:1px solid var(--line); font-size:13px; }.legal-footer { padding:26px 0; color:#aebdcc; background:#071b2d; font-size:12px; }.legal-footer .container { display:flex; justify-content:space-between; gap:24px; }.legal-footer a { color:#fff; }
.site-footer { background:#071b2d; color:#aebdcc; padding:56px 0 24px; }.brand-light .brand-logo { filter:brightness(0) invert(1); }.footer-main { display:grid; grid-template-columns:1fr 1fr 1fr; align-items:center; padding-bottom:45px; }.footer-main>p { text-align:center; font-size:13px; }.footer-links { display:flex; justify-content:end; gap:24px; }.footer-links a { text-decoration:none; font-size:13px; }.footer-legal { border-top:1px solid #23394b; padding-top:20px; display:flex; justify-content:space-between; gap:30px; font-size:11px; }.footer-legal p { margin:0; }
.reveal { opacity:0; transform:translateY(18px); transition:opacity .6s ease,transform .6s ease; }.reveal.visible { opacity:1; transform:none; }
@media (prefers-reduced-motion:reduce) { html{scroll-behavior:auto}.orbit-two{animation:none}.reveal{opacity:1;transform:none;transition:none} }
@media (max-width:900px) { .menu-toggle{display:block}.site-nav{display:none;position:absolute;top:78px;left:0;right:0;flex-direction:column;align-items:stretch;gap:0;padding:12px 20px 22px;background:#fff;border-bottom:1px solid var(--line);box-shadow:var(--shadow)}.site-nav.open{display:flex}.site-nav a{padding:12px}.site-nav .language-switch{padding:12px}.language-switch a{padding:0}.menu-toggle[aria-expanded="true"]>span:nth-child(2){transform:translateY(7px) rotate(45deg)}.menu-toggle[aria-expanded="true"]>span:nth-child(3){opacity:0}.menu-toggle[aria-expanded="true"]>span:nth-child(4){transform:translateY(-7px) rotate(-45deg)}.hero-grid{grid-template-columns:1fr;min-height:auto;padding-block:70px;gap:30px}.hero-visual{height:390px}.floating-card{right:0}.split-layout,.why-grid,.contact-panel{grid-template-columns:1fr;gap:45px}.product-grid{grid-template-columns:1fr 1fr}.section-heading{align-items:start;flex-direction:column}.section-heading>p{width:auto}.contact-details{padding-left:0;border-left:0}.footer-main{grid-template-columns:1fr;gap:24px;text-align:center}.footer-main>p{margin:0}.footer-links{justify-content:center}.footer-legal{flex-direction:column;text-align:center}}
@media (max-width:600px) { .container{width:min(100% - 28px,1160px)}.hero{background:linear-gradient(165deg,#fff 55%,#edf4f7 55%)}.hero-grid{padding-top:52px}.hero-actions,.trust-list{align-items:stretch;flex-direction:column}.hero-actions{gap:16px}.text-link{text-align:center}.trust-list{gap:8px;margin-top:30px}.hero-visual{height:310px}.orbit-one{width:310px;height:310px}.orbit-two{width:240px;height:240px}.main-card{padding:22px}.floating-card{bottom:8px}.section{padding:75px 0}.split-layout{gap:32px}.body-copy{padding-left:22px}.product-grid,.benefits{grid-template-columns:1fr}.product-card{min-height:270px}.contact-panel{width:calc(100% - 28px);padding:34px 24px}.footer-legal p:last-child{line-height:1.5}.legal-nav .button{display:none}.legal-main{padding:48px 0 70px}.legal-card{padding:36px 24px}.legal-footer .container{flex-direction:column}h1{letter-spacing:-2.5px}}