:root {
  color-scheme: light dark;
  --navy: #0b2c56;
  --deep: light-dark(#f4f8fc, #0f2433);
  --text: light-dark(#0b1c24, #e6f1ff);
  --muted: light-dark(#46596b, #b6c5d6);
  --cyan: light-dark(#0a6ea8, #3bc1ff);
  --mint: light-dark(#0a7f6b, #64ffda);
  --border: light-dark(rgba(11, 44, 86, .18), rgba(182, 197, 214, .18));
  --hero-start: light-dark(#e7eef7, #0b2c56);
  --hero-middle: light-dark(#edf5fc, #0c2a49);
  --card: light-dark(#fff, rgba(17,41,58,.65));
  --button-text: light-dark(#fff, #06121c);
  --radar-grid: light-dark(rgba(10,110,168,.08), rgba(59,193,255,.055));
  --radar-border: light-dark(rgba(10,110,168,.25), rgba(59,193,255,.22));
  --radar-axis: light-dark(rgba(10,110,168,.15), rgba(59,193,255,.12));
  --radar-sweep: light-dark(rgba(10,127,107,.15), rgba(100,255,218,.15));
  --email-border: light-dark(rgba(10,127,107,.4), rgba(100,255,218,.4));
  font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  font-synthesis: none;
}
:root[data-theme="light"] { color-scheme: light; }
:root[data-theme="dark"] { color-scheme: dark; }

* { box-sizing: border-box; }
html { scroll-behavior: smooth; scroll-padding-top: 28px; }
body { margin: 0; background: var(--deep); color: var(--text); line-height: 1.6; }
a { color: inherit; text-decoration: none; }
a:focus-visible, button:focus-visible { outline: 3px solid var(--cyan); outline-offset: 6px; border-radius: 3px; }
a:hover { color: var(--mint); }
p, h1, h2, h3, h4 { margin: 0; }
.container { width: min(1120px, calc(100% - 80px)); margin-inline: auto; }
.skip-link { position: absolute; z-index: 5; top: -80px; left: 20px; padding: 12px 20px; background: white; color: var(--navy); }
.skip-link:focus { top: 12px; }
.site-header { background: #fff; color: var(--navy); }
.header-inner { min-height: 98px; display: flex; justify-content: space-between; align-items: center; gap: 24px; }
.brand { display: inline-flex; flex-direction: column; line-height: 1; }
.brand:hover { color: var(--navy); }
.brand-logo { display: block; width: 220px; height: auto; }
.brand-subtitle { font-size: 9px; font-weight: 650; letter-spacing: 3px; margin-top: 8px; padding-left: 2px; }
nav { display: flex; align-items: center; gap: 34px; font-size: 14px; font-weight: 550; }
.header-actions { display: flex; align-items: center; gap: 24px; }
.header-preferences { display: flex; align-items: center; gap: 12px; }
.language-switch { display: flex; gap: 2px; padding: 3px; border: 1px solid #d6e1ed; border-radius: 6px; }
.language-switch a { display: grid; place-items: center; min-width: 32px; min-height: 32px; padding: 5px; border-radius: 3px; font-size: 11px; font-weight: 600; }
.language-switch a:hover { background: #f4f8fc; color: #0b2c56; }
.language-switch a[aria-current="page"] { background: #0b2c56; color: white; }
.theme-switch { display: flex; gap: 2px; padding: 3px; border: 1px solid #d6e1ed; border-radius: 6px; }
.theme-switch[hidden] { display: none; }
.theme-switch button { display: grid; place-items: center; min-width: 32px; min-height: 32px; padding: 5px; border: 0; border-radius: 3px; background: transparent; color: #46596b; cursor: pointer; font: inherit; font-size: 11px; }
.theme-switch button:hover { background: #f4f8fc; color: #0b2c56; }
.theme-switch button[aria-pressed="true"] { background: #0b2c56; color: white; }
.theme-switch svg { width: 17px; height: 17px; fill: none; stroke: currentColor; stroke-width: 1.6; stroke-linecap: round; stroke-linejoin: round; }
nav a:hover, .site-footer a:hover { color: #0a6ea8; }
.nav-contact { border: 1px solid #d6e1ed; border-radius: 6px; padding: 10px 17px; }
.nav-contact span { margin-left: 14px; }
.hero { background: linear-gradient(110deg, var(--hero-start), var(--hero-middle) 60%, var(--deep)); overflow: hidden; }
.hero-inner { position: relative; display: grid; grid-template-columns: 1.4fr 1fr; align-items: center; min-height: 460px; gap: 30px; }
.hero-copy { padding-block: 65px; position: relative; z-index: 1; }
.eyebrow { font-size: 11px; font-weight: 650; letter-spacing: 2.2px; color: var(--muted); }
.hero .eyebrow { display: flex; align-items: center; gap: 12px; }
.small-line { height: 2px; width: 26px; background: var(--mint); }
h1 { font-size: clamp(36px, 4.3vw, 57px); font-weight: 650; line-height: 1.12; letter-spacing: -2.2px; margin: 23px 0; }
h1 span { color: var(--mint); }
.hero-description { color: var(--muted); max-width: 410px; font-size: 17px; line-height: 1.75; }
.button { display: inline-flex; align-items: center; gap: 32px; margin-top: 30px; padding: 13px 21px; border-radius: 5px; background: var(--cyan); color: var(--button-text); font-size: 14px; font-weight: 650; transition: background .15s; }
.button:hover { background: var(--mint); color: var(--button-text); }
.radar-art { position: relative; justify-self: center; width: 360px; height: 360px; opacity: .85; }
.radar-grid { position: absolute; inset: -35px; background-image: linear-gradient(var(--radar-grid) 1px, transparent 1px), linear-gradient(90deg, var(--radar-grid) 1px, transparent 1px); background-size: 36px 36px; mask-image: radial-gradient(circle, #000 30%, transparent 70%); }
.radar-orbit { position: absolute; border: 1px solid var(--radar-border); border-radius: 50%; }
.orbit-outer { inset: 12px; }
.orbit-middle { inset: 65px; }
.orbit-inner { inset: 118px; }
.radar-axis { position: absolute; background: var(--radar-axis); }
.axis-horizontal { height: 1px; left: 12px; right: 12px; top: 50%; }
.axis-vertical { width: 1px; top: 12px; bottom: 12px; left: 50%; }
.radar-sweep { position: absolute; inset: 12px; border-radius: 50%; background: conic-gradient(from 5deg, transparent 0deg 260deg, var(--radar-sweep) 355deg, transparent 356deg); }
.radar-point, .radar-center { position: absolute; width: 7px; height: 7px; background: var(--mint); border-radius: 50%; box-shadow: 0 0 18px rgba(100,255,218,.45); }
.point-one { left: 116px; top: 94px; }
.point-two { right: 89px; top: 135px; width: 5px; height: 5px; background: var(--cyan); }
.point-three { left: 96px; bottom: 96px; width: 5px; height: 5px; background: var(--cyan); }
.radar-center { top: calc(50% - 3.5px); left: calc(50% - 3.5px); }
.radar-caption { position: absolute; bottom: -12px; width: 100%; text-align: center; font-size: 8px; color: var(--muted); letter-spacing: 2.8px; }
.software-section { padding-top: 44px; }
.section-heading { display: flex; justify-content: space-between; gap: 20px; align-items: center; margin-bottom: 20px; }
.section-heading p { font-size: 12px; color: var(--muted); }
.product { display: flex; align-items: center; gap: 26px; border: 1px solid var(--border); border-radius: 9px; padding: 30px; background: var(--card); }
.product-brand { flex: 0 0 230px; }
.product-category { color: var(--mint); font-size: 9px; letter-spacing: 1.8px; font-weight: 600; }
.product-logo { position: relative; width: 230px; max-width: 100%; aspect-ratio: 2512 / 1153; overflow: hidden; margin-top: 12px; }
/* Frame the artwork without changing the supplied PNG's transparent padding. */
.product-logo img { position: absolute; width: 163.0573%; height: auto; max-width: none; left: -24.6815%; top: -65.0477%; }
.product-copy { flex: 1; min-width: 0; }
.product-copy > p { font-size: 14px; color: var(--muted); }
.product-copy h4 { font-size: 20px; font-weight: 600; letter-spacing: -.3px; line-height: 1.4; margin-block: 14px 8px; }
.product-copy .eu-note { display: flex; gap: 10px; align-items: center; margin-top: 18px; padding-top: 14px; border-top: 1px solid var(--border); color: var(--mint); font-size: 12px; font-weight: 550; }
.eu-flag { display: block; flex: 0 0 32px; width: 32px; height: auto; }
.product-link { margin-left: auto; font-size: 14px; font-weight: 600; white-space: nowrap; padding: 12px 0 12px 24px; }
.product-link > span:first-child { color: var(--mint); margin-left: 16px; }
.product-domain { display: block; color: var(--muted); font-weight: 400; font-size: 11px; margin-top: 5px; }
.contact-section { display: flex; justify-content: space-between; align-items: center; gap: 32px; padding-block: 45px 50px; }
.contact-section h2 { font-size: 23px; font-weight: 550; letter-spacing: -.5px; margin: 9px 0; }
.contact-section > div > p:last-child { font-size: 13px; color: var(--muted); }
.email-link { font-size: 16px; padding-block: 10px; border-bottom: 1px solid var(--email-border); }
.email-link span { color: var(--mint); margin-left: 18px; }
.site-footer { background: #fff; color: #46596b; }
.footer-inner { min-height: 74px; display: flex; justify-content: space-between; align-items: center; gap: 20px; font-size: 11px; }
.site-footer a span { margin-left: 7px; }
.company-details { padding-block: 14px; }

@media (min-width: 1600px) { .hero-inner { min-height: 500px; } }
@media (max-width: 900px) {
  .container { width: calc(100% - 48px); }
  .hero-inner { grid-template-columns: 1.4fr .8fr; }
  .radar-art { width: 280px; height: 280px; }
  .orbit-middle { inset: 53px; } .orbit-inner { inset: 94px; }
  .contact-section { align-items: flex-start; flex-direction: column; gap: 18px; }
  .product { gap: 20px; padding: 24px; flex-wrap: wrap; }
  .product-link { margin-left: 0; padding: 0; }
}
@media (max-width: 1000px) {
  .header-inner { min-height: 84px; display: grid; grid-template-columns: 1fr auto; gap: 14px; padding-block: 16px; }
  .header-actions { display: contents; }
  .header-preferences { grid-column: 2; grid-row: 1; }
  nav { grid-column: 1 / -1; grid-row: 2; width: 100%; justify-content: space-between; gap: 16px; font-size: 12px; }
  .nav-contact { padding: 8px 10px; }
  .nav-contact span { margin-left: 3px; }
}
@media (max-width: 780px) {
  .header-preferences { flex-direction: column; align-items: flex-end; gap: 8px; }
  .brand-logo { width: 124px; }
  .brand-subtitle { font-size: 7px; letter-spacing: 2px; margin-top: 6px; }
}
@media (max-width: 600px) {
  .container { width: calc(100% - 40px); }
  .hero-inner { grid-template-columns: 1fr; gap: 0; }
  .hero-copy { padding-block: 52px 34px; }
  h1 { font-size: clamp(32px, 8.2vw, 46px); letter-spacing: -1.4px; }
  .hero-description { font-size: 16px; max-width: 340px; }
  .radar-art { width: 240px; height: 240px; margin-bottom: 40px; }
  .orbit-middle { inset: 47px; } .orbit-inner { inset: 82px; }
  .point-one { left: 76px; top: 62px; } .point-two { right: 57px; top: 100px; } .point-three { left: 68px; bottom: 65px; }
  .software-section { padding-top: 32px; }
  .section-heading p { display: none; }
  .product { gap: 20px; padding: 24px 20px; flex-direction: column; align-items: flex-start; }
  .product-brand { flex: none; max-width: 100%; }
  .product-copy { flex: none; }
  .product-copy > p { font-size: 13px; }
  .product-copy h4 { font-size: 19px; }
  .product-link { margin-left: 0; }
  .contact-section { padding-block: 36px 40px; }
  .contact-section h2 { font-size: 21px; }
  .email-link { font-size: 15px; overflow-wrap: anywhere; }
  .footer-inner { flex-direction: column; align-items: flex-start; justify-content: center; gap: 6px; padding-block: 20px; }
  .company-details { padding-block: 0; }
}
@media (max-width: 360px) {
  .header-inner { flex-wrap: wrap; padding-block: 16px; gap: 14px; }
  nav { width: 100%; justify-content: space-between; gap: 10px; }
  .nav-contact { padding-inline: 7px; }
}
@media (prefers-reduced-motion: reduce) { html { scroll-behavior: auto; } .button { transition: none; } }