/* =============================================================================
   SHARED UTILITIES
   ============================================================================= */

.cleanrooms-ctas {
	display:     flex;
	align-items: center;
	flex-wrap:   wrap;
	gap:         16px;
}

/* =============================================================================
   SECTION 1: HEADER -- 60/40 bar + wide image card
   ============================================================================= */

.cleanrooms-header {
	padding-top:    100px;
	padding-bottom: 100px;
}

.cleanrooms-header__bar {
	display:     grid;
	grid-template-columns: 1fr 1fr;
	gap:         60px;
	align-items: start;
	margin-bottom: 50px;
}

.cleanrooms-header__lead {
	color:         var(--color-text-secondary);
	margin-bottom: 25px;
}

/* Wide image card */
.cleanrooms-header__banner {
	position:      relative;
	border:        1px solid var(--color-border-subtle);
	border-radius: 10px;
	overflow:      hidden;
	aspect-ratio:  8 / 3;
}

.cleanrooms-header__banner-img {
	width:            100%;
	height:           100%;
	object-fit:       cover;
	object-position:  left center;
}

/* Frosted-glass info card anchored to the right side of the banner */
.cleanrooms-header__banner-info {
	position:         absolute;
	right:            40px;
	top:              50%;
	transform:        translateY(-50%);
	background:       rgba(255, 255, 255, 0.88);
	backdrop-filter:  blur(8px);
	-webkit-backdrop-filter: blur(8px);
	border-radius:    8px;
	padding:          28px 32px;
	min-width:        220px;
}

.cleanrooms-header__info-list li {
	font-weight:   var(--weight-bold);
	padding:       10px 0;
	border-bottom: 1px solid var(--color-border-subtle);
}

.cleanrooms-header__info-list li:first-child {
	padding-top: 0;
}

.cleanrooms-header__info-list li:last-child {
	border-bottom:  none;
	padding-bottom: 0;
}

/* =============================================================================
   SECTION 2: TIMELINE -- horizontal numbered steps
   ============================================================================= */

.cleanrooms-timeline {
	padding-top:    50px;
	padding-bottom: 100px;
}

.cleanrooms-timeline__heading {
	margin-bottom: 64px;
	max-width:     560px;
}

.cleanrooms-timeline__steps {
	position: relative;
	display:  grid;
	grid-template-columns: repeat(4, 1fr);
	gap:      48px;
}

/* Horizontal connecting line, aligned to center of large numbers */
.cleanrooms-timeline__track {
	position:   absolute;
	top:        27px; /* ~center of 52px number at line-height 1 */
	left:       0;
	right:      0;
	height:     1px;
	background: var(--color-border-subtle);
}

.cleanrooms-timeline__step {
	position: relative;
	z-index:  1;
}

/* White background on the number masks the track line behind it */
.cleanrooms-timeline__num {
	display:       block;
	font-size:     52px;
	font-weight:   var(--weight-black);
	line-height:   1;
	color:         var(--color-accent);
	margin-bottom: 20px;
	background:    var(--color-bg-primary);
	padding-right: 14px;
	width:         fit-content;
}

.cleanrooms-timeline__step-heading {
	font-size:     var(--text-h5);
	margin-bottom: 12px;
}

.cleanrooms-timeline__step-body {
	font-size:     15px;
	color:         var(--color-text-secondary);
	line-height:   var(--leading-relaxed);
	margin-bottom: 16px;
}

.cleanrooms-timeline__step-link {
	font-size:   14px;
	font-weight: var(--weight-bold);
	color:       var(--color-accent);
}

.cleanrooms-timeline__step-link:hover {
	color:           var(--color-accent-hover);
	text-decoration: none;
}

/* =============================================================================
   SECTION 3: INDUSTRIES -- editorial asymmetric
   ============================================================================= */

.cleanrooms-industries {
	padding-top:      100px;
	padding-bottom:   100px;
	background-color: var(--color-bg-subtle);
	border-top:       1px solid var(--color-border-subtle);
	border-bottom:    1px solid var(--color-border-subtle);
}

.cleanrooms-industries__header {
	margin-bottom: 52px;
}

.cleanrooms-industries__subline {
	margin-top: 12px;
	color:      var(--color-text-secondary);
	max-width:  560px;
}

/* 60/40 asymmetric grid -- featured left, stack right */
.cleanrooms-industries__editorial {
	display:     grid;
	grid-template-columns: 60fr 40fr;
	gap:         60px;
	align-items: start;
}

/* Thick accent border separates featured from stack */
.cleanrooms-industries__featured {
	padding-right:  48px;
	border-right:   2px solid var(--color-accent);
}

.cleanrooms-industries__eyebrow {
	font-size:      13px;
	font-weight:    var(--weight-bold);
	letter-spacing: 1.5px;
	text-transform: uppercase;
	color:          var(--color-accent);
	font-style:     italic;
	margin-bottom:  10px;
}

.cleanrooms-industries__featured .cleanrooms-industries__entry-heading {
	font-size:     var(--text-h3);
	margin-bottom: 16px;
}

.cleanrooms-industries__featured .cleanrooms-industries__entry-body {
	font-size:   16px;
	color:       var(--color-text-secondary);
	line-height: var(--leading-relaxed);
}

.cleanrooms-industries__stack {
	display:        flex;
	flex-direction: column;
}

.cleanrooms-industries__entry {
	padding:       28px 0;
	border-bottom: 1px solid var(--color-border-subtle);
}

.cleanrooms-industries__entry:first-child {
	padding-top: 0;
}

.cleanrooms-industries__entry:last-child {
	border-bottom: none;
	padding-bottom: 0;
}

.cleanrooms-industries__entry .cleanrooms-industries__entry-heading {
	font-size:     var(--text-h5);
	margin-bottom: 10px;
}

.cleanrooms-industries__entry-body {
	font-size:   15px;
	color:       var(--color-text-secondary);
	line-height: var(--leading-relaxed);
}

/* =============================================================================
   SECTION 4: WHY WORK WITH US -- alternating image/text rows
   ============================================================================= */

.cleanrooms-reasons {
	padding-top:    100px;
	padding-bottom: 100px;
}

.cleanrooms-reasons__heading {
	margin-bottom: 72px;
	max-width:     700px;
}

.cleanrooms-reasons__rows {
	display:        flex;
	flex-direction: column;
	gap:            80px;
}

.cleanrooms-reasons__row {
	display:     flex;
	align-items: center;
	gap:         80px;
}

/* Odd rows: image left / text right (default) */
/* Even rows: image right / text left */
.cleanrooms-reasons__row:nth-child(even) {
	flex-direction: row-reverse;
}

.cleanrooms-reasons__row-media {
	flex:      0 0 45%;
	min-width: 0;
}

.cleanrooms-reasons__img {
	width:         100%;
	height:        500px;
	object-fit:    cover;
	border-radius: 10px;
}

.cleanrooms-reasons__row-text {
	flex:      1;
	min-width: 0;
}

.cleanrooms-reasons__row-heading {
	font-size:     clamp(22px, 2.5vw, 30px);
	margin-bottom: 20px;
}

.cleanrooms-reasons__row-text p {
	font-size:   16px;
	color:       var(--color-text-secondary);
	line-height: var(--leading-relaxed);
}

/* =============================================================================
   SECTION 5: TESTIMONIALS -- dark/near-black
   ============================================================================= */

.cleanrooms-testimonials {
	padding-top:      120px;
	padding-bottom:   120px;
	background-color: var(--color-text-primary);
}

.cleanrooms-testimonials__heading {
	color:         #ffffff;
	margin-bottom: 52px;
}

.cleanrooms-testimonials__grid {
	display:               grid;
	grid-template-columns: repeat(3, 1fr);
	gap:                   24px;
	margin-bottom:         56px;
}

.cleanrooms-testimonials__card {
	border:         1px solid rgba(255, 255, 255, 0.15);
	border-radius:  10px;
	padding:        40px 36px;
	display:        flex;
	flex-direction: column;
}

.cleanrooms-testimonials__quote-mark {
	display:     block;
	font-size:   64px;
	line-height: 0.6;
	color:       var(--color-accent);
	margin-top:  10px;
	font-family: Georgia, 'Times New Roman', serif;
}

.cleanrooms-testimonials__quote {
	flex:       1;
	margin-top: 20px;
}

.cleanrooms-testimonials__quote p {
	font-size:   15px;
	color:       rgba(255, 255, 255, 0.90);
	line-height: var(--leading-relaxed);
}

.cleanrooms-testimonials__divider {
	border:     none;
	border-top: 1px solid rgba(255, 255, 255, 0.15);
	margin:     24px 0;
}

.cleanrooms-testimonials__name {
	font-size:   15px;
	font-weight: var(--weight-bold);
	color:       #ffffff;
}

.cleanrooms-testimonials__role {
	font-size:  var(--text-body-small);
	color:      rgba(255, 255, 255, 0.60);
	margin-top: 4px;
}

/* -- Trust stats on dark background ---------------------------------------- */

.cleanrooms-stats {
	border-top:  1px solid rgba(255, 255, 255, 0.15);
	padding-top: 44px;
}

.cleanrooms-stats__list {
	display:         flex;
	justify-content: center;
	align-items:     center;
	flex-wrap:       wrap;
	gap:             0;
}

.cleanrooms-stats__item {
	font-size:   var(--text-body-small);
	font-weight: var(--weight-bold);
	color:       rgba(255, 255, 255, 0.75);
	padding:     0 28px;
	text-align:  center;
}

.cleanrooms-stats__item + .cleanrooms-stats__item {
	border-left: 1px solid rgba(255, 255, 255, 0.20);
}

/* =============================================================================
   SECTION 6: FINAL CTA -- burgundy block
   ============================================================================= */

.cleanrooms-final-cta {
	padding-top:      110px;
	padding-bottom:   110px;
	background-color: var(--color-accent);
}

.cleanrooms-final-cta__inner {
	max-width:    760px;
	margin-left:  auto;
	margin-right: auto;
	text-align:   center;
}

.cleanrooms-final-cta__heading {
	font-size:     clamp(28px, 4vw, var(--text-h2));
	color:         #ffffff;
	margin-bottom: 20px;
}

.cleanrooms-final-cta__body {
	font-size:     var(--text-body-lead);
	color:         rgba(255, 255, 255, 0.88);
	line-height:   var(--leading-relaxed);
	margin-bottom: 40px;
}

.cleanrooms-final-cta .cleanrooms-ctas {
	justify-content: center;
}

/* Primary CTA on burgundy: white bg / burgundy text */
.cleanrooms-final-cta .button--solid.button--burgundy {
	background-color: #ffffff;
	border-color:     #ffffff;
	color:            var(--color-accent);
}

/* Secondary CTA on burgundy: white outline / white text */
.cleanrooms-final-cta .button--outline.button--burgundy {
	border-color: rgba(255, 255, 255, 0.70);
	color:        #ffffff;
}

/* =============================================================================
   RESPONSIVE -- 1100px
   ============================================================================= */

@media (max-width: 1100px) {

	.cleanrooms-reasons__row {
		gap: 52px;
	}

}

/* =============================================================================
   RESPONSIVE -- 900px
   ============================================================================= */

@media (max-width: 900px) {

	/* Header */
	.cleanrooms-header__bar {
		grid-template-columns: 1fr;
		gap:                   28px;
	}

	.cleanrooms-header__banner {
		aspect-ratio: 4 / 3;
	}

	.cleanrooms-header__banner-info {
		right:     20px;
		left:      20px;
		top:       auto;
		bottom:    20px;
		transform: none;
		min-width: 0;
	}

	/* Timeline: collapse to vertical stack with left rail */
	.cleanrooms-timeline__steps {
		grid-template-columns: 1fr;
		gap:                   0;
	}

	.cleanrooms-timeline__track {
		top:    0;
		bottom: 0;
		left:   19px; /* ~center of the mobile number width */
		right:  auto;
		width:  1px;
		height: auto;
	}

	.cleanrooms-timeline__step {
		padding-left:   68px;
		padding-bottom: 40px;
	}

	.cleanrooms-timeline__step:last-child {
		padding-bottom: 0;
	}

	.cleanrooms-timeline__num {
		position:      absolute;
		left:          0;
		top:           0;
		font-size:     40px;
		padding-right: 0;
		background:    none;
		width:         auto;
	}

	/* Industries: single column */
	.cleanrooms-industries__editorial {
		grid-template-columns: 1fr;
		gap:                   0;
	}

	.cleanrooms-industries__featured {
		padding-right:  0;
		border-right:   none;
		border-bottom:  2px solid var(--color-accent);
		padding-bottom: 44px;
		margin-bottom:  44px;
	}

	/* Reasons: stack all rows, image always first */
	.cleanrooms-reasons__row,
	.cleanrooms-reasons__row:nth-child(even) {
		flex-direction: column;
	}

	.cleanrooms-reasons__row-media {
		flex:  none;
		width: 100%;
	}

	.cleanrooms-reasons__rows {
		gap: 56px;
	}

	/* Testimonials */
	.cleanrooms-testimonials__grid {
		grid-template-columns: 1fr;
	}

	.cleanrooms-stats__list {
		flex-direction: column;
		gap:            20px;
	}

	.cleanrooms-stats__item + .cleanrooms-stats__item {
		border-left: none;
		border-top:  1px solid rgba(255, 255, 255, 0.20);
		padding-top: 20px;
	}

}

/* =============================================================================
   RESPONSIVE -- 600px
   ============================================================================= */

@media (max-width: 600px) {

	/* Header */
	.cleanrooms-header {
		padding-top:    48px;
		padding-bottom: 48px;
	}

	/* Full-width stacked CTAs */
	.cleanrooms-ctas {
		flex-direction: column;
		align-items:    stretch;
	}

	.cleanrooms-ctas .button--solid,
	.cleanrooms-ctas .button--outline {
		width:     100%;
		min-width: 0;
	}

	/* Timeline */
	.cleanrooms-timeline {
		padding-top:    64px;
		padding-bottom: 64px;
	}

	.cleanrooms-timeline__num {
		font-size: 36px;
	}

	/* Industries */
	.cleanrooms-industries {
		padding-top:    64px;
		padding-bottom: 64px;
	}

	/* Reasons */
	.cleanrooms-reasons {
		padding-top:    64px;
		padding-bottom: 64px;
	}

	.cleanrooms-reasons__rows {
		gap: 44px;
	}

	/* Testimonials */
	.cleanrooms-testimonials {
		padding-top:    80px;
		padding-bottom: 80px;
	}

	.cleanrooms-testimonials__card {
		padding: 28px 24px;
	}

	/* Final CTA */
	.cleanrooms-final-cta {
		padding-top:    72px;
		padding-bottom: 72px;
	}

	.cleanrooms-final-cta__body {
		font-size: var(--text-body);
	}

}