2026-08-19 10:24:17 +03:00
|
|
|
.homePage{position:relative;max-width:1440px;margin:auto;padding:52px 32px 80px}.homePage:before{content:"";position:absolute;z-index:-1;top:-90px;right:4%;width:430px;height:430px;border-radius:50%;background:radial-gradient(circle,rgba(65,132,226,.18),transparent 68%);filter:blur(10px)}.homeHero{display:flex;justify-content:space-between;align-items:end;gap:48px;margin-bottom:32px}.homeHero h1{margin:7px 0 10px;font-size:clamp(38px,5vw,64px);line-height:1;letter-spacing:-.045em}.heroCopy{margin:0;color:var(--text-muted);font-size:16px}.eyebrow{color:var(--accent-strong);font-size:12px;font-weight:700;letter-spacing:.12em;text-transform:uppercase}.environmentBadge{min-width:220px;padding:13px 16px;border:1px solid rgba(116,158,211,.35);border-radius:14px;background:linear-gradient(135deg,rgba(255,255,255,.88),rgba(225,238,255,.82));font-weight:700;box-shadow:var(--shadow-sm);backdrop-filter:blur(12px)}.environmentBadge small{display:block;margin:3px 0 0 18px;color:var(--text-muted);font-weight:400}.statusDot{display:inline-block;width:9px;height:9px;margin-right:9px;border-radius:50%;background:var(--success);box-shadow:0 0 0 4px rgba(38,147,104,.12)}.toolGrid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px}.toolCard{position:relative;display:flex;min-height:180px;padding:24px;overflow:hidden;border:1px solid rgba(115,154,204,.28);border-radius:20px;background:linear-gradient(145deg,rgba(255,255,255,.94),rgba(231,241,255,.78));color:var(--text);text-decoration:none;box-shadow:0 12px 30px rgba(30,77,132,.08);transition:transform 280ms cubic-bezier(.23,1,.32,1),box-shadow 280ms,border-color 280ms}.toolCard:before{content:"";position:absolute;inset:auto -55px -70px auto;width:155px;height:155px;border-radius:50%;background:radial-gradient(circle,rgba(43,117,211,.16),transparent 70%);transition:transform 350ms}.toolCard:nth-child(3n+2){background:linear-gradient(145deg,rgba(255,255,255,.94),rgba(226,235,255,.82))}.toolCard:nth-child(3n){background:linear-gradient(145deg,rgba(255,255,255,.94),rgba(220,242,250,.8))}.toolCard:hover{transform:translateY(-4px);border-color:rgba(36,119,197,.5);box-shadow:0 18px 38px rgba(30,77,132,.16)}.toolCard:hover:before{transform:scale(1.18)}.toolCard:active{transform:translateY(0);box-shadow:0 8px 18px rgba(30,77,132,.1)}.toolCardCopy{align-self:flex-end;position:relative;z-index:1}.toolCard h2{margin:0 0 7px;font-size:clamp(27px,2.2vw,34px);letter-spacing:-.025em}.toolCard p{max-width:85%;margin:0;color:var(--text-muted);font-size:13px;line-height:1.45}.toolIcon{position:absolute;top:18px;left:22px;display:grid;place-items:center;width:56px;height:56px;border:1px solid rgba(57,126,209,.22);border-radius:17px;background:linear-gradient(145deg,#f8fbff,#dcecff);color:var(--accent);font-size:32px;box-shadow:0 8px 18px rgba(37,103,180,.12)}.cardArrow{position:absolute;right:22px;bottom:20px;color:var(--accent-strong);font-size:22px;font-weight:700;transition:transform 200ms}.toolCard:hover .cardArrow{transform:translateX(4px)}@media(max-width:960px){.toolGrid{grid-template-columns:repeat(2,1fr)}.homeHero{align-items:start;flex-direction:column}}@media(max-width:640px){.homePage{padding:36px 18px}.toolGrid{grid-template-columns:1fr}}
|
