:root { --ink:#0c0c0d; --white:#f6f4ed; --accent:#dcd9ff; --muted:#a8a7a2; }
* { box-sizing:border-box; }
html { scroll-behavior:smooth; }
body { margin:0; color:var(--white); background:var(--ink); font-family:Manrope,Arial,sans-serif; }
a { color:inherit; text-decoration:none; }
.container { width:min(1180px,calc(100% - 48px)); margin:auto; }
.hero { overflow:hidden; position:relative; background:radial-gradient(circle at 77% 38%,#3c2454 0,transparent 27%),radial-gradient(circle at 22% 88%,#26223c 0,transparent 31%),#080808; }
.hero:after { content:""; position:absolute; z-index:0; right:-15%; bottom:-210px; width:70%; height:360px; border-radius:50%; background:#5a4b9c; filter:blur(95px); opacity:.34; }
.hero:before { content:""; position:absolute; inset:0; opacity:.32; pointer-events:none; background-image:linear-gradient(115deg,transparent 48%,#fff1 49%,transparent 50%),radial-gradient(#fff 0.55px,transparent .7px); background-size:130px 130px,5px 5px; mask-image:linear-gradient(#000,transparent 85%); }
.header { height:94px; display:flex; align-items:center; justify-content:space-between; position:relative; z-index:1; border-bottom:1px solid #ffffff23; }
.brand { display:flex; align-items:center; font-family:Montserrat,sans-serif; font-size:15px; font-weight:800; text-transform:uppercase; letter-spacing:.04em; }
nav { display:flex; gap:34px; font-size:13px; color:#deddd8; }
nav a:hover,.footer a:hover { color:var(--accent); }
.header-call { border:1px solid #ffffff5c; border-radius:999px; padding:10px 18px; font-size:12px; font-weight:700; }
.hero-grid { display:grid; grid-template-columns:1fr; gap:70px; align-items:center; min-height:0; padding:48px 0 54px; position:relative; z-index:1; text-align:center; }
.eyebrow { display:flex; align-items:center; gap:10px; color:#e6e4df; text-transform:uppercase; font-size:13px; font-weight:800; letter-spacing:.12em; margin:0 0 27px; }
.hero .eyebrow { justify-content:center; margin:30px 0 13px; font:700 clamp(22px,3vw,42px)/1.14 Montserrat,sans-serif; letter-spacing:-.04em; text-transform:uppercase; background:linear-gradient(105deg,#fff 5%,#dcd9ff 30%,#9d8ee6 48%,#fff 68%,#dcd9ff 88%); background-size:220% auto; -webkit-background-clip:text; background-clip:text; color:transparent; animation:shimmer 6s linear infinite; }.hero .eyebrow span { display:none; }
.eyebrow span { display:inline-block; width:8px; height:8px; border-radius:50%; background:var(--accent); box-shadow:0 0 15px var(--accent); }
.brand-visual { display:flex; align-items:center; justify-content:center; gap:28px; }
.logo-wrap { position:relative; width:min(720px,calc(100% - 150px)); aspect-ratio:2048 / 656; filter:drop-shadow(0 12px 30px #0009); }
.logo { display:block; width:100%; height:100%; object-fit:contain; transition:opacity .2s; }
.logo-canvas { position:absolute; inset:0; width:100%; height:100%; pointer-events:none; }
.equalizer { width:52px; height:82px; display:flex; align-items:flex-end; justify-content:center; gap:5px; }.equalizer i { display:block; width:4px; min-height:12px; border-radius:999px; transform-origin:bottom; background:linear-gradient(#fff,#a99be8); box-shadow:0 0 11px #b5a8fc8c; animation:equalize 1.1s ease-in-out infinite alternate; }.equalizer i:nth-child(1) { height:36px; animation-delay:-.35s; }.equalizer i:nth-child(2) { height:59px; animation-delay:-.75s; }.equalizer i:nth-child(3) { height:76px; animation-delay:-.1s; }.equalizer i:nth-child(4) { height:51px; animation-delay:-.55s; }.equalizer i:nth-child(5) { height:30px; animation-delay:-.9s; }.equalizer-right { transform:scaleX(-1); } @keyframes equalize { from { transform:scaleY(.2); opacity:.4; } to { transform:scaleY(1); opacity:1; } }
.intro { max-width:none; margin:0; color:#d4d1df; font:500 clamp(15px,1.5vw,20px)/1.4 Manrope,Arial,sans-serif; letter-spacing:.01em; text-transform:none; white-space:nowrap; }
@keyframes shimmer { to { background-position:220% center; } }
.about { padding:40px 0 44px; position:relative; overflow:hidden; }
.about:before { content:""; position:absolute; top:-80px; left:8%; width:42%; height:130px; border-radius:50%; background:#6154a5; filter:blur(90px); opacity:.13; }
.about > * { position:relative; z-index:1; }
.about-grid { display:flex; flex-direction:column; align-items:center; gap:18px; text-align:center; }
h1,h2 { font-family:Montserrat,sans-serif; text-transform:uppercase; letter-spacing:-.05em; margin:0; }
.about h2 { font-size:clamp(23px,2.7vw,34px); font-weight:400; letter-spacing:-.025em; line-height:1; background:linear-gradient(105deg,#fff 5%,#dcd9ff 30%,#9d8ee6 48%,#fff 68%,#dcd9ff 88%); background-size:220% auto; -webkit-background-clip:text; background-clip:text; color:transparent; animation:shimmer 6s linear infinite; } .about h2 em { color:inherit; font-style:normal; } .about h2 br { display:none; }
.about-text { width:100%; color:#c3c1bc; font-size:15px; line-height:1.75; }.concepts { display:grid; grid-template-columns:repeat(3,1fr); gap:9px; margin-top:0; text-align:left; }.concepts article { min-height:78px; position:relative; overflow:hidden; display:grid; grid-template-columns:35px 1fr; grid-template-rows:auto auto; align-content:center; column-gap:11px; row-gap:3px; padding:12px; border:0; border-radius:12px; background:#ffffff08; transition:background .18s ease; }.concepts article:before { display:none; }.concepts article:hover { transform:none; background:#ffffff16; box-shadow:none; }.concepts strong,.concepts span,.concepts .concept-icon { position:relative; z-index:1; }.concept-icon { grid-row:1 / 3; display:grid; place-items:center; width:35px; height:35px; color:#f4f2ee; border:1px solid #ffffff20; border-radius:9px; background:#ffffff08; }.concept-icon svg { width:19px; height:19px; fill:none; stroke:currentColor; stroke-width:1.7; stroke-linecap:round; stroke-linejoin:round; }.concepts article:last-child .concept-icon svg { fill:currentColor; stroke:none; }.concepts strong { font:800 11px/1.25 Montserrat,sans-serif; text-transform:uppercase; }.concepts span { color:#b1aea9; font-size:10px; line-height:1.3; }
.seo-info { max-width:760px; margin:17px auto 0; color:#aaa7b2; font-size:11px; line-height:1.55; text-align:center; }
@keyframes card-glow { from { transform:translate(-20px,0) scale(.85); opacity:.1; } to { transform:translate(-2px,50px) scale(1.25); opacity:.36; } }
.advertising { position:relative; overflow:hidden; background:radial-gradient(circle at 84% 45%,#312647 0,transparent 32%),#0c0c0d; color:#101010; padding:58px 0; }.ad-card { isolation:isolate; position:relative; overflow:hidden; min-height:320px; padding:52px 54px; display:flex; align-items:center; justify-content:space-between; gap:30px; border:0; border-radius:20px; background:linear-gradient(135deg,#e8e5ed,#d9d5df); box-shadow:0 18px 45px #00000045; transition:transform .3s ease,box-shadow .3s ease; }.ad-card:before { content:""; position:absolute; z-index:-1; width:390px; height:390px; top:-250px; right:-100px; border-radius:50%; background:#a99de2; filter:blur(55px); opacity:.45; transition:transform .5s ease,opacity .5s ease; }.ad-card:after { content:""; position:absolute; z-index:-1; width:230px; height:230px; bottom:-160px; left:42%; border-radius:50%; background:#fff; filter:blur(35px); }.ad-card:hover { transform:translateY(-6px); box-shadow:0 26px 55px #00000075; }.ad-card:hover:before { transform:translate(-35px,48px) scale(1.18); opacity:.7; }.ad-card .eyebrow { color:#333; }.ad-card .eyebrow span { background:#101010; box-shadow:none; }.ad-card h2 { font-size:clamp(32px,4vw,55px); line-height:1.02; }.contacts { min-width:310px; display:flex; flex-direction:column; align-items:flex-start; gap:12px; }.contacts a { font:700 30px Montserrat,sans-serif; border-bottom:0; transition:color .2s; }.contacts a:hover { color:#5b4da0; }.contacts p { color:#66625e; font-size:12px; max-width:255px; line-height:1.6; margin:7px 0 0; }
.footer { height:90px; color:#7c7b78; display:flex; justify-content:space-between; align-items:center; font-size:11px; }
@media(max-width:760px) { .container { width:min(100% - 32px,600px); }.header { height:75px; gap:8px; }.header nav { display:none; }.brand { max-width:calc(100% - 95px); font-size:10px; line-height:1.25; }.header-call { display:inline-flex; flex:0 0 auto; align-items:center; justify-content:center; padding:9px 13px; font-size:11px; }.hero { min-height:0; }.hero-grid { display:flex; flex-direction:column; align-items:stretch; justify-content:center; gap:20px; min-height:0; padding:38px 0 32px; }.brand-visual { gap:12px; }.logo-wrap { width:calc(100% - 118px); }.equalizer { width:40px; height:62px; }.logo { width:100%; }.eyebrow { font-size:10px; letter-spacing:.09em; }.hero .eyebrow { font-size:24px; white-space:normal; }.intro { font-size:15px; white-space:normal; }.about { padding:28px 0 32px; }.about-grid { gap:18px; }.concepts { grid-template-columns:1fr; }.concepts article { min-height:70px; }.ad-card { min-height:unset; padding:35px 24px; flex-direction:column; align-items:flex-start; }.contacts { min-width:0; }.contacts a { font-size:22px; }.footer { height:75px; } }