/* Safety Notice Card Styles 
    - Adapted to match the site's existing dark theme.
    - Uses 'Poppins' font.
*/
.safety-wrapper {
font-family: 'Poppins', -apple-system, sans-serif;
max-width: 980px;
margin: 25px auto;
}

.safety-wrapper .section-title {
text-align: center;
font-size: 2.5em;
font-weight: 600;
color: #e8e6e3;
margin-bottom: 20px;
}

.safety-card-container {
background-color: #2a2d2f;
border: 1px solid #444;
border-radius: 12px;
padding: 25px 30px;
box-shadow: 0 2px 8px rgba(0, 0, 0, 0.25);
transition: transform 0.25s ease-out, box-shadow 0.25s ease-out, background-color 0.25s ease-out;
}

.safety-card-container:hover {
transform: translateY(-4px);
background-color: #303336;
box-shadow: 0 5px 15px rgba(0, 0, 0, 0.35);
}

.safety-card-header {
display: flex;
justify-content: center;
margin-bottom: 15px;
}

.safety-card-header .icon svg {
width: 32px;
height: 32px;
fill: #5865F2;
}

.safety-card-body p.intro-text {
color: #d0d0d0;
line-height: 1.6;
margin: 0 0 25px 0;
text-align: center;
font-size: 16px;
}

.safety-tips-list {
list-style: none;
padding-left: 0;
border-top: 1px solid #444;
padding-top: 25px;
}

.safety-tips-list li {
color: #d0d0d0;
position: relative;
padding-left: 30px;
margin-bottom: 14px;
line-height: 1.5;
font-size: 15px;
}

.safety-tips-list li::before {
content: '✓';
position: absolute;
left: 5px;
top: 2px;
color: #5865F2;
font-weight: 700;
font-size: 16px;
}

.safety-tips-list li strong {
color: #e0e0e0;
font-weight: 600;
}

.safety-card-footer {
margin-top: 25px;
padding-top: 15px;
border-top: 1px solid #444;
color: #a0a0a0;
font-size: 14px;
font-style: italic;
text-align: center;
}

.safety-card-action {
text-align: center;
margin-top: 25px;
}

.safety-card-button {
display: inline-block;
background-color: #5865F2;
color: #ffffff;
padding: 12px 28px;
border-radius: 25px;
text-decoration: none;
font-weight: 600;
font-size: 15px;
border: none;
cursor: pointer;
box-shadow: 0 2px 4px rgba(88, 101, 242, 0.2);
transition: all 0.2s ease-in-out;
}

.safety-card-button:hover {
background-color: #4752C4;
transform: translateY(-2px);
box-shadow: 0 4px 8px rgba(88, 101, 242, 0.3);
}