:root { --amber:#d97706; --amber-bright:#fb923c; --page:#070a0f; --border:rgba(148,163,184,.2); --text:#f8fafc; --muted:#9aa9bd; }
* { box-sizing:border-box; }
body { min-width:320px; min-height:100vh; margin:0; color:var(--text); font-family:Arial,sans-serif; background:radial-gradient(circle at 8% 2%,rgba(217,119,6,.26),transparent 31rem),radial-gradient(circle at 91% 93%,rgba(14,116,144,.14),transparent 29rem),linear-gradient(180deg,#111a2d 0%,var(--page) 49%,#05070b 100%); }
a { color:inherit; }.home-shell { display:flex; width:min(1180px,100%); min-height:100vh; margin:0 auto; padding:28px clamp(20px,5vw,58px) 24px; flex-direction:column; }.home-header { display:flex; align-items:center; justify-content:space-between; gap:16px; }.brand { color:#fff; font-size:1.55rem; font-weight:900; letter-spacing:-.06em; text-decoration:none; }.brand span { color:var(--amber-bright); }.eyebrow,.product-kicker,.home-footer { color:var(--muted); font-size:.7rem; font-weight:800; letter-spacing:.12em; text-transform:uppercase; }
.home-language-switch { display:inline-flex; overflow:hidden; border:1px solid rgba(148,163,184,.3); border-radius:7px; background:rgba(15,23,42,.7); }.home-language-switch button { min-width:34px; border:0; border-left:1px solid rgba(148,163,184,.22); color:#94a3b8; background:transparent; padding:6px 7px; font:inherit; font-size:.7rem; font-weight:850; cursor:pointer; }.home-language-switch button:first-child { border-left:0; }.home-language-switch button:hover { color:#fff; }.home-language-switch button.is-active { color:#fff; background:rgba(14,116,144,.56); }
.hero { max-width:790px; margin:clamp(30px,5vh,54px) 0 clamp(30px,5vh,52px); }.eyebrow { margin:0 0 12px; color:#f7c76e; }.hero h1 { max-width:11ch; margin:0; font-size:clamp(2.35rem,5.1vw,4.15rem); line-height:.98; letter-spacing:-.07em; }.hero h1 span { color:var(--amber-bright); }.hero-copy { max-width:50ch; margin:18px 0 0; color:#c6d0de; font-size:clamp(.98rem,1.5vw,1.1rem); font-weight:600; line-height:1.6; }
.product-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:14px; }.product-card { position:relative; display:flex; min-height:285px; padding:23px; flex-direction:column; overflow:hidden; border:1px solid var(--border); border-radius:12px; background:linear-gradient(155deg,rgba(31,43,64,.92),rgba(12,17,28,.9)); box-shadow:0 18px 42px rgba(0,0,0,.18); text-decoration:none; transition:transform .18s ease,border-color .18s ease; }.product-card::after { position:absolute; right:-55px; bottom:-72px; width:170px; height:170px; border:1px solid currentColor; border-radius:50%; content:''; opacity:.09; }.product-card:hover,.product-card:focus-visible { border-color:currentColor; outline:0; transform:translateY(-4px); }.product-card--cloud { color:#f6c15a; }.product-card--edu { color:#75d5f5; }.product-card--flasher { color:#9ee6b0; }.product-icon { display:grid; width:49px; height:49px; margin-bottom:auto; place-items:center; border:1px solid currentColor; border-radius:10px; background:rgba(2,6,23,.34); }.product-icon svg { width:30px; height:30px; }.product-kicker { margin-top:25px; color:inherit; font-size:.64rem; opacity:.8; }.product-card strong { margin-top:7px; color:#fff; font-size:1.36rem; letter-spacing:-.035em; }.product-copy { max-width:29ch; margin-top:10px; color:#c4cfdd; font-size:.87rem; font-weight:600; line-height:1.5; }.product-link { display:inline-flex; align-items:center; gap:8px; margin-top:20px; color:#fff; font-size:.82rem; font-weight:800; }.product-link b { color:inherit; font-size:1.05rem; transition:transform .18s ease; }.product-card:hover .product-link b { transform:translateX(4px); }.home-footer { margin-top:auto; padding-top:42px; letter-spacing:.08em; text-align:center; }.home-footer span { margin:0 6px; color:var(--amber); }
@media(max-width:780px) { .home-shell { padding-top:20px; }.hero { margin:34px 0 42px; }.product-grid { grid-template-columns:1fr; }.product-card { min-height:208px; }.product-icon { margin-bottom:3px; }.product-kicker { margin-top:17px; } } @media(max-width:420px) { .hero h1 { font-size:2.3rem; }.product-card { padding:20px; } }