/* Moved from inline <style> blocks in index.html (original order). */
/* Dark AI Theme */
/* Animated Background */
@keyframes float {
0%,
100% {
transform: translate(0, 0) scale(1);
}
50% {
transform: translate(30px, -30px) scale(1.1);
}
}
/* Header Styles */
@keyframes pulse-ring {
0% {
transform: scale(0.95);
box-shadow: 0 0 0 0 rgba(99, 102, 241, 0.7);
}
70% {
transform: scale(1);
box-shadow: 0 0 0 10px rgba(99, 102, 241, 0);
}
100% {
transform: scale(0.95);
box-shadow: 0 0 0 0 rgba(99, 102, 241, 0);
}
}
@keyframes gradient-flow {
0%,
100% {
background-position: 0% 50%;
}
50% {
background-position: 100% 50%;
}
}
/* Agent Cards */
.ai-card {
position: relative;
background: rgba(15, 23, 42, 0.6);
backdrop-filter: blur(20px);
border-radius: 20px;
padding: 2rem;
height: 100%;
border: 1px solid rgba(99, 102, 241, 0.1);
overflow: hidden;
transition: all 0.4s cubic-bezier(0.4, 0, 0.2, 1);
}
.card-glare {
position: absolute;
top: -50%;
left: -50%;
width: 200%;
height: 200%;
background: radial-gradient(circle, rgba(99, 102, 241, 0.15) 0%, transparent 50%);
opacity: 0;
transition: opacity 0.3s;
pointer-events: none;
}
.ai-card:hover {
transform: translateY(-5px);
box-shadow: 0 20px 40px -10px rgba(99, 102, 241, 0.3);
border-color: rgba(99, 102, 241, 0.3);
}
.ai-card:hover .card-glare {
opacity: 1;
}
/* Card Header */
@keyframes blink {
0%,
100% {
opacity: 1;
}
50% {
opacity: 0.4;
}
}
/* Card Body */
/* Card Footer */
@keyframes ripple {
0% {
transform: scale(0.5);
opacity: 1;
}
100% {
transform: scale(1.5);
opacity: 0;
}
}
/* Responsive */
@media (max-width: 768px) {
.ai-card {
padding: 1.5rem;
}
}
/* Product film section spacing */
.gb-tour-section {
padding-top: 40px;
padding-bottom: 48px;
}
/* AI agents: team roster layout (5 ID-badge cards in one row) */
@keyframes arPulse {
50% {
box-shadow: 0 0 0 7px rgba(76, 175, 80, 0);
}
}
/* Agent card: coming soon */
/* Smaller screens: wrap cards and centre the last row */
/* Compact section spacing: hero, agents, FAQ, newsletter footer */
.hero { padding-top: 120px !important; padding-bottom: 48px !important; }
@media (min-width: 992px) {
.hero { height: auto !important; min-height: 0 !important; padding-top: 128px !important; padding-bottom: 56px !important; }
}
#AI-Agents .page-vertical-padding { padding-top: 0 !important; padding-bottom: 0 !important; }
#faq { padding-top: 56px !important; padding-bottom: 56px !important; }
#faq .page-vertical-padding,
#faq .section-padding-large { padding-top: 0 !important; padding-bottom: 0 !important; }
@media (max-width: 767px) {
#faq { padding-top: 40px !important; padding-bottom: 40px !important; }
}
/* Agents section: more compact cards and spacing */