:root {
–primary-color: #000000;
–secondary-color: #FFFFFF;
–accent-color: #FFDE00;
–text-color: #333333;
–light-bg: #f9f9f9;
–dark-card: #1a1a1a;
–transition: all 0.3s ease;
}

.seopt-case-study {
font-family: ‘Montserrat’, sans-serif;
color: var(–text-color);
line-height: 1.6;
background: #fff;
}

.seopt-case-study * {
box-sizing: border-box;
}

.seopt-case-study .container {
max-width: 1000px;
margin: 0 auto;
padding: 0 20px;
}

/* HERO */
.seopt-case-study .hero-cs {
background: var(–primary-color);
color: #fff;
padding: 100px 0 60px;
text-align: center;
border-bottom: 5px solid var(–accent-color);
}

.seopt-case-study .hero-cs h1 {
font-size: clamp(2rem, 5vw, 3.5rem);
font-weight: 800;
margin-bottom: 20px;
text-transform: uppercase;
color: #fff;
}

.seopt-case-study .hero-cs .client-tag {
display: inline-block;
background: var(–accent-color);
color: #000;
padding: 5px 20px;
border-radius: 50px;
font-weight: 700;
font-size: 0.9rem;
margin-bottom: 20px;
}

/* SECTION CHRONOLOGY */
.seopt-case-study .chrono-section {
padding: 60px 0;
background: var(–light-bg);
}

.seopt-case-study .chrono-grid {
display: grid;
grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
gap: 30px;
margin-top: 40px;
}

.seopt-case-study .chrono-card {
background: #fff;
padding: 30px;
border-radius: 15px;
box-shadow: 0 10px 30px rgba(0, 0, 0, 0.05);
border-top: 4px solid var(–primary-color);
}

.seopt-case-study .chrono-card.alert {
border-top-color: #ff4444;
}

.seopt-case-study .chrono-card.success {
border-top-color: #00c851;
}

.seopt-case-study .chrono-date {
font-weight: 800;
color: var(–primary-color);
font-size: 1.2rem;
margin-bottom: 10px;
}

/* THE FALL */
.seopt-case-study .crash-section {
padding: 80px 0;
background: var(–primary-color);
color: #fff;
}

.seopt-case-study .crash-stats {
display: flex;
flex-wrap: wrap;
gap: 40px;
margin-top: 50px;
justify-content: center;
}

.seopt-case-study .stat-box-cs {
text-align: center;
flex: 1;
min-width: 200px;
padding: 30px;
border: 1px solid rgba(255, 255, 255, 0.1);
border-radius: 20px;
}

.seopt-case-study .stat-val {
font-size: 3rem;
font-weight: 900;
color: var(–accent-color);
display: block;
}

/* RESULTS TABLE */
.seopt-case-study .results-table-wrap {
margin-top: 50px;
overflow-x: auto;
}

.seopt-case-study table {
width: 100%;
border-collapse: collapse;
background: #fff;
border-radius: 15px;
overflow: hidden;
}

.seopt-case-study th {
background: var(–primary-color);
color: #fff;
padding: 20px;
text-align: left;
}

.seopt-case-study td {
padding: 20px;
border-bottom: 1px solid #eee;
}

.seopt-case-study tr:last-child td {
border-bottom: none;
}

/* CTA */
.seopt-case-study .cta-cs {
padding: 80px 0;
text-align: center;
background: var(–accent-color);
}

.seopt-case-study .btn-cs {
display: inline-block;
background: #000;
color: #fff;
padding: 20px 40px;
border-radius: 60px;
font-weight: 800;
text-decoration: none;
font-size: 1.2rem;
transition: var(–transition);
box-shadow: 0 10px 20px rgba(0, 0, 0, 0.15);
}

.seopt-case-study .btn-cs:hover {
transform: scale(1.05);
box-shadow: 0 15px 30px rgba(0, 0, 0, 0.25);
}

@media (max-width: 768px) {
.seopt-case-study .hero-cs {
padding: 60px 0 40px;
}

.seopt-case-study .stat-val {
font-size: 2.5rem;
}
}