:root {
  --bg: #05090d;
  --panel: #0b1118;
  --text: #f4f7f9;
  --muted: #93a1ad;
  --line: rgba(255,255,255,.1);
  --cyan: #55d9e4;
}

* { box-sizing: border-box; }
html, body, h1, h2, h3, p { padding: 0; }
img { max-width: 100%; }
button, input, textarea, select { font: inherit; }
html { scroll-behavior: smooth; }
body { margin: 0; background: var(--bg); color: var(--text); font-family: Arial, Helvetica, sans-serif; }
a { color: inherit; text-decoration: none; }

main { overflow: hidden; background: radial-gradient(circle at 82% 5%, rgba(48,111,129,.12), transparent 27%), var(--bg); }
.site-header { height: 86px; max-width: 1400px; margin: auto; padding: 0 48px; display: flex; align-items: center; justify-content: space-between; border-bottom: 1px solid var(--line); position: relative; z-index: 10; }
.wordmark { display: flex; align-items: center; gap: 12px; font-size: 14px; font-weight: 700; letter-spacing: .24em; }
nav { display: flex; align-items: center; gap: 34px; color: #aab4bd; font-size: 13px; }
nav a:hover { color: white; }
.nav-contact { border: 1px solid rgba(255,255,255,.25); padding: 11px 18px; border-radius: 999px; color: white; }

.hero { min-height: calc(100vh - 86px); max-width: 1400px; margin: auto; padding: 90px 7vw 70px; display: grid; grid-template-columns: 1.05fr .95fr; align-items: center; position: relative; }
.hero-copy { position: relative; z-index: 2; }
.eyebrow { color: var(--cyan); letter-spacing: .19em; text-transform: uppercase; font-size: 11px; font-weight: 700; margin: 0 0 24px; }
h1 { font-size: clamp(52px, 6vw, 92px); letter-spacing: -.055em; line-height: .98; margin: 0; font-weight: 300; }
h1 span { color: #82909c; }
.hero-text { max-width: 590px; font-size: 18px; line-height: 1.7; color: #a9b4bd; margin: 34px 0; }
.hero-actions { display: flex; align-items: center; gap: 32px; }
.primary-button { display: inline-flex; align-items: center; gap: 18px; border-radius: 4px; padding: 15px 22px; background: linear-gradient(135deg,#1a8fbe,#38c1cd); color: #fff; font-size: 13px; font-weight: 700; box-shadow: 0 10px 40px rgba(22,164,190,.2); }
.primary-button:hover { filter: brightness(1.15); transform: translateY(-1px); }
.text-link { font-size: 13px; color: #c1c9cf; }
.text-link span { color: var(--cyan); margin-left: 8px; }
.hero-mark { width: min(500px, 38vw); aspect-ratio: 1; display: grid; place-items: center; position: relative; justify-self: end; }
.hero-mark::before { content: ""; position: absolute; inset: 14%; border-radius: 50%; background: rgba(81,202,218,.08); filter: blur(35px); }
.hero-glow { position: absolute; right: -16%; top: -30%; width: 700px; height: 700px; border: 1px solid rgba(91,210,222,.08); border-radius: 50%; box-shadow: 0 0 100px rgba(46,163,180,.05) inset; }
.orbit { position:absolute;border:1px solid rgba(255,255,255,.045);border-radius:50%;pointer-events:none;animation:orbit-spin var(--speed) linear infinite; }
.orbit i { position:absolute;left:50%;top:-3px;width:6px;height:6px;border-radius:50%;background:currentColor;box-shadow:0 0 7px currentColor,0 0 18px currentColor; }
.orbit-blue { inset:2%;color:#28a9ff;--speed:29s;--start:20deg; }
.orbit-cyan { inset:10%;color:#48ded7;--speed:23s;--start:116deg;animation-direction:reverse; }
.orbit-violet { inset:18%;color:#a66cff;--speed:19s;--start:215deg; }
.orbit-green { inset:27%;color:#8cd43a;--speed:16s;--start:302deg;animation-direction:reverse; }
@keyframes orbit-spin { from { transform:rotate(var(--start)); } to { transform:rotate(calc(var(--start) + 360deg)); } }
.scroll-hint { position: absolute; bottom: 24px; left: 7vw; font-size: 10px; text-transform: uppercase; letter-spacing: .18em; color: #687580; }
.scroll-hint span { color: var(--cyan); margin-left: 8px; }

.brand-mark { width:100%;height:100%;object-fit:contain;display:block;border-radius:22%;filter:drop-shadow(0 18px 44px rgba(100,215,230,.16));position:relative;z-index:1; }
.brand-mark-small { width:48px;height:48px;flex:0 0 auto;border-radius:13px;filter:drop-shadow(0 5px 12px rgba(100,215,230,.22)); }
.brand-mark-hero { width:72%;height:72%;border-radius:0;filter:drop-shadow(0 0 25px rgba(130,225,235,.2));z-index:2; }

.section { max-width: 1400px; margin: auto; padding: 120px 48px; }
.products { border-top: 1px solid var(--line); }
.section-heading { display: flex; justify-content: space-between; align-items: end; gap: 50px; margin-bottom: 52px; }
.section-heading h2, .manifesto h2, .contact h2 { font-size: clamp(38px,5vw,66px); line-height: 1.06; letter-spacing: -.045em; font-weight: 300; margin: 0; }
.section-heading > p { max-width: 440px; color: var(--muted); line-height: 1.7; font-size: 15px; }
.product-grid { display: grid; grid-template-columns: repeat(4,1fr); gap: 14px; }
.product-card { min-height: 430px; padding: 28px; border: 1px solid var(--line); background: linear-gradient(145deg,rgba(255,255,255,.035),rgba(255,255,255,.012)); display: flex; flex-direction: column; position: relative; overflow:hidden; transition: .3s ease; }
.product-card::after { content:""; position:absolute; width:220px;height:220px;top:-120px;right:-100px;border-radius:50%;background:var(--card-color);filter:blur(70px);opacity:.10;transition:.3s; }
.product-card:hover { transform: translateY(-5px); border-color: color-mix(in srgb,var(--card-color) 45%,transparent); }
.product-card:hover::after { opacity:.2; }
.card-blue{--card-color:#2499ef}.card-cyan{--card-color:#44dcd7}.card-violet{--card-color:#9c59e6}.card-green{--card-color:#83c93a}
.product-top { display:flex; justify-content:space-between; align-items:flex-start; }
.product-logo { width:78px;height:78px;display:block;object-fit:cover;border-radius:18px;box-shadow:0 12px 32px rgba(0,0,0,.34); }
.status { font-size: 10px; color:#9fdc61;border:1px solid rgba(132,203,59,.35);border-radius:99px;padding:6px 10px;text-transform:uppercase;letter-spacing:.14em; }
.product-copy { margin-top: auto; }
.product-card h3 { font-weight: 400; font-size: 25px; letter-spacing: -.02em; margin: 0 0 9px; }
.product-line { color:var(--card-color)!important;text-transform:uppercase;letter-spacing:.13em;font-size:9px!important;font-weight:700; }
.product-card p { color:#8997a2;font-size:13px;line-height:1.65; }
.product-link { border-top:1px solid var(--line);padding-top:18px;margin-top:20px;font-size:11px;text-transform:uppercase;letter-spacing:.12em;color:#bac3ca;display:flex;justify-content:space-between; }
.product-link b { color:var(--card-color);font-size:14px; }

.manifesto { border-top: 1px solid var(--line); display:grid;grid-template-columns:80px 1.1fr .9fr;gap:60px;align-items:start; }
.manifesto-number { color:#48545e;font-size:11px;letter-spacing:.15em;padding-top:4px; }
.manifesto h2 { max-width:650px; }
.manifesto-copy { color:#98a5ae;font-size:15px;line-height:1.8;padding-top:35px; }
.signature { color:white!important;margin-top:36px;display:flex;flex-direction:column;font-weight:700; }
.signature span { color:#65727d;font-size:11px;text-transform:uppercase;letter-spacing:.12em;font-weight:400;margin-top:5px; }
.contact { text-align:center;border-top:1px solid var(--line);padding-top:140px;padding-bottom:140px;background:radial-gradient(circle at 50% 70%,rgba(33,151,169,.12),transparent 35%); }
.contact h2 { font-size:clamp(44px,6vw,80px); }
.contact > p:not(.eyebrow) { color:#919da7;max-width:600px;margin:25px auto 35px;line-height:1.7; }
footer { max-width:1400px;margin:auto;border-top:1px solid var(--line);padding:38px 48px;display:flex;align-items:center;justify-content:space-between;color:#697681;font-size:11px; }
footer > div { display:flex;gap:22px; }
footer a:hover { color:white; }
.legal { max-width:1400px;margin:auto;padding:0 48px 50px;color:#84919b; }
.legal details { border-top:1px solid var(--line); }
.legal summary { cursor:pointer;padding:20px 0;font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:#aeb7bd;list-style:none; }
.legal summary::-webkit-details-marker { display:none; }
.legal summary::after { content:"+";float:right;color:var(--cyan);font-size:16px; }
.legal details[open] summary::after { content:"−"; }
.legal-content { max-width:720px;padding:0 0 35px;font-size:13px;line-height:1.7; }
.legal-content h2 { color:white;font-size:20px;font-weight:400;letter-spacing:-.02em; }

@media (max-width: 950px) {
  .product-grid { grid-template-columns: repeat(2,1fr); }
  .hero { grid-template-columns: 1fr; padding-top:70px; }
  .hero-mark { position:absolute;right:-15%;top:8%;opacity:.28;width:60vw; }
  .hero-copy { max-width:720px; }
  .manifesto { grid-template-columns:45px 1fr; }
  .manifesto-copy { grid-column:2; }
}
@media (max-width: 650px) {
  .site-header { padding:0 22px;height:72px; }
  nav a:not(.nav-contact) { display:none; }
  .hero { min-height:calc(100vh - 72px);padding:70px 22px 65px; }
  h1 { font-size:47px; }
  .hero-text { font-size:16px; }
  .hero-actions { align-items:flex-start;flex-direction:column;gap:20px; }
  .hero-mark { right:-35%;top:16%;width:90vw; }
  .scroll-hint { left:22px; }
  .section { padding:90px 22px; }
  .section-heading { align-items:start;flex-direction:column;gap:15px; }
  .product-grid { grid-template-columns:1fr; }
  .product-card { min-height:360px; }
  .manifesto { grid-template-columns:1fr;gap:25px; }
  .manifesto-number { display:none; }
  .manifesto-copy { grid-column:1;padding-top:0; }
  footer { padding:30px 22px;align-items:flex-start;flex-direction:column;gap:22px; }
  .legal { padding:0 22px 35px; }
}

@media (prefers-reduced-motion: reduce) { html{scroll-behavior:auto}.orbit{animation:none}.product-card,.primary-button{transition:none} }
