83 lines
2.1 KiB
Markdown
83 lines
2.1 KiB
Markdown
|
# Introduction
|
||
|
|
|
||
|
|
<br><br>
|
||
|
|
|
||
|
|
<div class="intro-container container-fade-in">
|
||
|
|
<div class="intro-point animated-text delay-1">
|
||
|
|
<div class="intro-icon"><i class="fas fa-microchip"></i></div>
|
||
|
|
<div>LLMs are increasingly integrated into <span class="highlight-word">critical applications</span></div>
|
||
|
|
</div>
|
||
|
|
|
||
|
|
<div class="intro-point animated-text delay-2">
|
||
|
|
<div class="intro-icon"><i class="fas fa-exclamation-triangle"></i></div>
|
||
|
|
<div>Security vulnerabilities present <span class="highlight-word">significant challenges</span></div>
|
||
|
|
</div>
|
||
|
|
|
||
|
|
<div class="intro-point animated-text delay-3">
|
||
|
|
<div class="intro-icon"><i class="fas fa-clipboard-check"></i></div>
|
||
|
|
<div>Need for <span class="highlight-word">systematic evaluation</span> approaches</div>
|
||
|
|
</div>
|
||
|
|
|
||
|
|
<div class="intro-point animated-text delay-4">
|
||
|
|
<div class="intro-icon"><i class="fas fa-user-secret"></i></div>
|
||
|
|
<div>Focus on <span class="highlight-word">red teaming</span> methodologies</div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
|
||
|
|
<style>
|
||
|
|
.intro-container {
|
||
|
|
display: flex;
|
||
|
|
flex-direction: column;
|
||
|
|
align-items: center;
|
||
|
|
justify-content: center;
|
||
|
|
width: 85%;
|
||
|
|
max-width: 700px;
|
||
|
|
margin: 0 auto;
|
||
|
|
padding: 1.25rem;
|
||
|
|
background: var(--background-card);
|
||
|
|
border-radius: 8px;
|
||
|
|
border: 1px solid var(--card-border);
|
||
|
|
box-shadow: 0 4px 12px var(--card-shadow);
|
||
|
|
}
|
||
|
|
|
||
|
|
.intro-point {
|
||
|
|
display: flex;
|
||
|
|
align-items: center;
|
||
|
|
margin-bottom: 1rem;
|
||
|
|
padding: 0.5rem;
|
||
|
|
width: 100%;
|
||
|
|
transition: transform 0.2s ease;
|
||
|
|
}
|
||
|
|
|
||
|
|
.intro-point:hover {
|
||
|
|
transform: translateX(5px);
|
||
|
|
}
|
||
|
|
|
||
|
|
.intro-icon {
|
||
|
|
flex: 0 0 3rem;
|
||
|
|
font-size: 1.5rem;
|
||
|
|
color: var(--primary-color);
|
||
|
|
display: flex;
|
||
|
|
align-items: center;
|
||
|
|
justify-content: center;
|
||
|
|
margin-right: 1rem;
|
||
|
|
}
|
||
|
|
|
||
|
|
.highlight-word {
|
||
|
|
color: var(--highlight);
|
||
|
|
font-weight: 600;
|
||
|
|
position: relative;
|
||
|
|
background: linear-gradient(90deg, var(--highlight), var(--primary-color));
|
||
|
|
background-clip: text;
|
||
|
|
-webkit-background-clip: text;
|
||
|
|
color: transparent;
|
||
|
|
background-size: 200% auto;
|
||
|
|
animation: gentle-shimmer 4s linear infinite;
|
||
|
|
}
|
||
|
|
|
||
|
|
@keyframes gentle-shimmer {
|
||
|
|
0% { background-position: 0% 50%; }
|
||
|
|
100% { background-position: 200% 50%; }
|
||
|
|
}
|
||
|
|
</style>
|