2026-04-21 11:30:07 +02:00
|
|
|
/*!*
|
|
|
|
|
* This file is part of the SplendidBear Websites' projects.
|
|
|
|
|
*
|
|
|
|
|
* Copyright (c) 2026 @ www.splendidbear.org
|
|
|
|
|
*
|
|
|
|
|
* For the full copyright and license information, please view the LICENSE
|
|
|
|
|
* file that was distributed with this source code.
|
|
|
|
|
*/
|
|
|
|
|
|
2026-04-11 20:45:51 +02:00
|
|
|
.hero-cta {
|
|
|
|
|
position: relative;
|
|
|
|
|
display: inline-block;
|
|
|
|
|
font: 800 28px 'Rajdhani', sans-serif;
|
|
|
|
|
text-transform: uppercase;
|
|
|
|
|
letter-spacing: 6px;
|
|
|
|
|
text-decoration: none;
|
|
|
|
|
color: #ffffff;
|
|
|
|
|
padding: 22px 100px 20px;
|
|
|
|
|
border-radius: 4px;
|
|
|
|
|
border: 1px solid rgba(246, 125, 82, 0.25);
|
|
|
|
|
|
|
|
|
|
background: linear-gradient(to bottom, #b30c06 0%, #d63d15 50%, #f67d52 100%);
|
|
|
|
|
|
|
|
|
|
box-shadow:
|
|
|
|
|
0 0 0 1px rgba(173, 10, 5, 0.2),
|
|
|
|
|
0 0 30px rgba(173, 10, 5, 0.35),
|
|
|
|
|
0 6px 24px rgba(0, 0, 0, 0.5),
|
|
|
|
|
inset 0 1px 0 rgba(255, 255, 255, 0.12);
|
|
|
|
|
|
|
|
|
|
transition: transform 220ms ease, box-shadow 220ms ease, letter-spacing 220ms ease;
|
|
|
|
|
animation: rise 0.8s 0.42s cubic-bezier(0.22, 1, 0.36, 1) both;
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
// Outer glow layer (blurred duplicate, always visible)
|
|
|
|
|
.hero-cta::before {
|
|
|
|
|
content: '';
|
|
|
|
|
position: absolute;
|
|
|
|
|
inset: -4px;
|
|
|
|
|
border-radius: 7px;
|
|
|
|
|
background: linear-gradient(to bottom, #ad0a05, #f67d52);
|
|
|
|
|
filter: blur(18px);
|
|
|
|
|
opacity: 0.3;
|
|
|
|
|
z-index: -1;
|
|
|
|
|
transition: opacity 220ms ease;
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
.hero-cta:hover {
|
|
|
|
|
transform: translateY(-4px);
|
|
|
|
|
letter-spacing: 8px;
|
|
|
|
|
box-shadow:
|
|
|
|
|
0 0 0 1px rgba(246, 125, 82, 0.3),
|
|
|
|
|
0 0 50px rgba(173, 10, 5, 0.65),
|
|
|
|
|
0 10px 32px rgba(0, 0, 0, 0.45),
|
|
|
|
|
inset 0 1px 0 rgba(255, 255, 255, 0.15);
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
.hero-cta:hover::before {
|
|
|
|
|
opacity: 0.55;
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
.hero-cta:active {
|
|
|
|
|
transform: translateY(-1px);
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
// Version / copyright line
|
|
|
|
|
.hero-meta {
|
|
|
|
|
position: relative;
|
|
|
|
|
z-index: 1;
|
|
|
|
|
font: 400 12px 'Rajdhani', sans-serif;
|
|
|
|
|
color: rgba(255, 255, 255, 0.5);
|
|
|
|
|
letter-spacing: 0.5px;
|
|
|
|
|
margin-top: 58px;
|
|
|
|
|
animation: rise 0.8s 0.55s cubic-bezier(0.22, 1, 0.36, 1) both;
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
.hero-meta a {
|
|
|
|
|
color: rgba(149, 207, 245, 0.65);
|
|
|
|
|
text-decoration: none;
|
|
|
|
|
transition: color 180ms;
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
.hero-meta a:hover {
|
|
|
|
|
color: #95cff5;
|
|
|
|
|
}
|
