:root {
  --bg: #07101c;
  --surface: rgba(12, 22, 37, 0.74);
  --surface-strong: rgba(17, 28, 46, 0.92);
  --border: rgba(168, 199, 255, 0.12);
  --text: #f7f9fc;
  --muted: rgba(247, 249, 252, 0.72);
  --accent: #65d9ff;
  --accent-strong: #7f8cff;
  --shadow: 0 30px 90px rgba(0,0,0,.34);
  --radius-xl: 34px;
  --radius-lg: 24px;
  --container:1180px;
}

*{
box-sizing:border-box;
}

body{
margin:0;
font-family:Inter,Arial,sans-serif;
color:var(--text);

background:
radial-gradient(circle at 20% 18%,rgba(101,217,255,.12),transparent 26%),
radial-gradient(circle at 80% 26%,rgba(127,140,255,.12),transparent 24%),
linear-gradient(180deg,#07101c 0%,#08111d 100%);
}

.page-shell{
padding:24px 20px 36px;
}

.landing{
width:min(100%,var(--container));
margin:0 auto;
}

.hero{
padding:24px;
border-radius:var(--radius-xl);
background:var(--surface);
border:1px solid var(--border);
backdrop-filter:blur(18px);
}

.hero-grid{
display:grid;
grid-template-columns:1.05fr .95fr;
gap:22px;
align-items:start;
}

.hero-copy{
display:grid;
gap:18px;
}

.hero-badge{
display:none;
}

.hero h1{
margin:0;
font-size:clamp(2.4rem,5vw,4.6rem);
font-weight:800;
line-height:.95;
}

.steps-panel{
padding:22px;
border-radius:var(--radius-lg);
background:rgba(9,18,31,.56);
border:1px solid rgba(255,255,255,.07);
}

.steps-list{
list-style:none;
padding:0;
margin:0;
display:grid;
gap:10px;
}

.steps-list li{
padding:13px 14px;
border-radius:14px;
background:rgba(255,255,255,.03);
border:1px solid rgba(255,255,255,.05);
display:flex;
gap:12px;
}

.steps-list li::before{
content:"";
width:8px;
height:8px;
margin-top:.6em;
border-radius:999px;
background:linear-gradient(135deg,var(--accent),var(--accent-strong));
box-shadow:0 0 0 6px rgba(101,217,255,.16);
}

.hero-visual{
position:relative;
min-height:560px;
border-radius:28px;
overflow:hidden;
border:1px solid rgba(101,217,255,.12);
background:
radial-gradient(circle at 60% 20%,rgba(101,217,255,.25),transparent 32%),
linear-gradient(180deg,rgba(11,20,34,.78),rgba(6,11,19,.28));
}

.visual-grid{
position:absolute;
inset:0;

background:
linear-gradient(rgba(101,217,255,.08) 1px,transparent 1px),
linear-gradient(90deg,rgba(101,217,255,.08) 1px,transparent 1px);

background-size:34px 34px;

transform:
perspective(900px)
rotateX(72deg)
scale(1.18)
translateY(34%);
}

.visual-platform{
position:absolute;
left:50%;
bottom:86px;
width:280px;
height:280px;
transform:translateX(-50%);
}

.platform-ring{
position:absolute;
inset:0;
border-radius:24px;
transform:rotate(45deg);

border:2px solid rgba(101,217,255,.85);

box-shadow:
0 0 30px rgba(101,217,255,.45);
}

.platform-core{
position:absolute;
inset:18px;
border-radius:24px;
transform:rotate(45deg);
background:rgba(15,29,49,.6);
}

.visual-cube{
position:absolute;
left:50%;
top:150px;
transform:translateX(-50%);
}

.visual-cube img{
width:320px;
display:block;
filter:drop-shadow(0 0 40px rgba(0,170,255,.35));
}

.content-block{
margin-top:22px;
padding:30px;
border-radius:var(--radius-lg);

background:var(--surface-strong);
border:1px solid var(--border);

text-align:center;
}

.partnership-text{
font-size:1.8rem;
font-weight:600;
margin-bottom:22px;
}

.main-offer{
font-size:1.05rem;
font-weight:600;
line-height:1.6;
margin-bottom:18px;
color:var(--muted);
}

.signature-inline{
font-size:18px;
margin-top:8px;
}

.signature-inline a{
color:#7fd3ff;
text-decoration:none;
font-weight:600;

text-shadow:
0 0 6px rgba(127,211,255,.6),
0 0 14px rgba(127,211,255,.5),
0 0 24px rgba(101,217,255,.35);

transition:all .25s ease;
}

.signature-inline a:hover{
color:#a8e8ff;

text-shadow:
0 0 10px rgba(127,211,255,.9),
0 0 22px rgba(127,211,255,.8),
0 0 36px rgba(101,217,255,.7);
}

/* планшеты */

@media(max-width:1024px){

.hero-grid{
grid-template-columns:1fr;
}

.hero-visual{
order:-1;
min-height:420px;
}

.visual-cube img{
width:220px;
}

}

/* МОБИЛЬНАЯ ВЕРСИЯ */

@media (max-width:768px){

.hero{
padding:18px;
}

.hero-grid{
grid-template-columns:1fr;
gap:18px;
}

.visual-platform{
display:none;
}

.visual-grid{
display:none;
}

.hero-visual{
min-height:160px;
background:none;
border:none;
}

.visual-cube{
top:0;
left:50%;
transform:translateX(-50%);
}

.visual-cube img{
width:170px;
filter:drop-shadow(0 0 30px rgba(0,170,255,.35));
}

.content-block{
margin-top:8px;
}

.hero h1{
font-size:2.2rem;
line-height:1.05;
}

.steps-panel{
padding:16px;
}

.steps-list li{
font-size:14px;
}

.partnership-text{
font-size:1.35rem;
}

.main-offer{
font-size:.95rem;
}

.signature-inline{
font-size:16px;
}

}