/* PAGE 3: SOLUTIONS STYLES */

.cs-main--solutions {
  background: radial-gradient(circle at top center, #151a2a 0, #05070a 65%);
}

/* === SECTION 1: SOLUTIONS HERO === */

.cs-sol-hero {
  padding-top: 110px;
}

.cs-sol-hero-inner {
  position: relative;
  display: grid;
  grid-template-columns: minmax(0, 1.35fr) minmax(0, 1.25fr);
  gap: 30px;
  align-items: center;
}

.cs-sol-hero-copy {
  position: relative;
  padding-right: 18px;
}

.cs-sol-hero-copy::before {
  content: "";
  position: absolute;
  inset: -26px -40px -40px -40px;
  background: radial-gradient(circle at 0 0, #f6a7231a, transparent 70%);
  pointer-events: none;
}

.cs-sol-hero-title {
  margin: 0 0 12px;
  font-family: "CS-Heading", system-ui, sans-serif;
  font-size: 30px;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.cs-sol-hero-text {
  margin: 0 0 14px;
  font-size: 14px;
  line-height: 1.7;
  color: var(--cs-text-muted);
}

.cs-sol-hero-list {
  margin: 0;
  padding-left: 18px;
  font-size: 13px;
  line-height: 1.6;
  color: var(--cs-text-soft);
}

.cs-sol-hero-list li + li {
  margin-top: 4px;
}

.cs-sol-hero-visual {
  position: relative;
  display: grid;
  gap: 12px;
}

.cs-sol-hero-visual::before {
  content: "";
  position: absolute;
  inset: -40px -40px auto 26%;
  height: 190px;
  background: radial-gradient(circle at 100% 0, #20d0b244, transparent 60%);
  opacity: 0.9;
  pointer-events: none;
}

.cs-sol-hero-card {
  position: relative;
  padding: 9px 11px 11px;
  border-radius: 22px;
  background: radial-gradient(circle at 0 0, #171c2b, #05070a 80%);
  border: 1px solid rgba(255, 255, 255, 0.1);
  box-shadow: var(--cs-shadow-subtle);
  transform-origin: center;
  transition: transform 0.22s ease, box-shadow 0.22s ease,
    border-color 0.22s ease;
}

.cs-sol-hero-card:hover {
  transform: translateY(-3px) scale(1.01);
  box-shadow: 0 24px 46px rgba(0, 0, 0, 0.9);
  border-color: rgba(246, 167, 35, 0.7);
}

.cs-sol-hero-card figcaption {
  margin-top: 8px;
  font-size: 12px;
  color: var(--cs-text-soft);
}

/* === SECTION 2: SERVICE MOSAIC === */

.cs-sol-mosaic {
  background: radial-gradient(circle at top right, #171c2b 0, #05070a 70%);
}

.cs-sol-mosaic-inner {
  position: relative;
}

.cs-sol-mosaic-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 16px;
  margin-top: 22px;
}

.cs-sol-mosaic-card {
  position: relative;
  padding: 12px 12px 13px;
  border-radius: 24px;
  background: linear-gradient(
    150deg,
    rgba(17, 22, 34, 0.97),
    rgba(8, 13, 23, 0.99)
  );
  border: 1px solid rgba(255, 255, 255, 0.09);
  box-shadow: var(--cs-shadow-subtle);
  overflow: hidden;
}

.cs-sol-mosaic-card::after {
  content: "";
  position: absolute;
  inset: -40%;
  background: conic-gradient(
    from 210deg,
    transparent,
    rgba(246, 167, 35, 0.14),
    rgba(32, 208, 178, 0.18),
    transparent
  );
  mix-blend-mode: screen;
  opacity: 0;
  transition: opacity 0.25s ease;
}

.cs-sol-mosaic-card:hover::after {
  opacity: 1;
}

.cs-sol-mosaic-head {
  position: relative;
  display: flex;
  flex-direction: column;
  gap: 4px;
  margin-bottom: 6px;
}

.cs-sol-mosaic-tag {
  align-self: flex-start;
  padding: 3px 9px;
  border-radius: 999px;
  border: 1px solid rgba(255, 255, 255, 0.22);
  font-size: 10px;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--cs-text-soft);
}

.cs-sol-mosaic-title {
  margin: 0;
  font-family: "CS-Heading";
  font-size: 14px;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.cs-sol-mosaic-text {
  margin: 0 0 8px;
  font-size: 13px;
  line-height: 1.6;
  color: var(--cs-text-muted);
}

.cs-sol-mosaic-media {
  margin: 0;
}

/* === SECTION 3: ROUTE & TIMING === */

.cs-sol-route {
  background: radial-gradient(circle at bottom left, #171c2b 0, #05070a 70%);
}

.cs-sol-route-inner {
  position: relative;
}

.cs-sol-route-layout {
  display: grid;
  grid-template-columns: minmax(0, 1.3fr) minmax(0, 1.2fr);
  gap: 26px;
  align-items: flex-start;
}

.cs-sol-route-timeline {
  position: relative;
  padding-left: 16px;
}

.cs-sol-route-timeline::before {
  content: "";
  position: absolute;
  left: 4px;
  top: 6px;
  bottom: 6px;
  width: 2px;
  background: linear-gradient(
    180deg,
    rgba(246, 167, 35, 0.7),
    rgba(32, 208, 178, 0.7)
  );
  opacity: 0.7;
}

.cs-sol-route-step {
  position: relative;
  display: flex;
  gap: 10px;
  margin-bottom: 16px;
}

.cs-sol-route-step:last-child {
  margin-bottom: 0;
}

.cs-sol-route-dot {
  width: 12px;
  height: 12px;
  border-radius: 999px;
  background: linear-gradient(135deg, #f6a723, #c46744);
  box-shadow: 0 0 16px rgba(246, 167, 35, 0.9);
}

.cs-sol-route-title {
  margin: 0 0 4px;
  font-family: "CS-Heading";
  font-size: 14px;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.cs-sol-route-text {
  margin: 0;
  font-size: 13px;
  line-height: 1.6;
  color: var(--cs-text-muted);
}

.cs-sol-route-gallery {
  display: grid;
  gap: 14px;
}

.cs-sol-route-photo {
  margin: 0;
}

.cs-sol-route-photo figcaption {
  margin-top: 6px;
  font-size: 12px;
  color: var(--cs-text-soft);
}

/* === RESPONSIVE SOLUTIONS PAGE === */

@media (max-width: 1024px) {
  .cs-sol-hero-inner {
    grid-template-columns: minmax(0, 1fr);
  }

  .cs-sol-hero-copy::before {
    inset: -18px -20px -26px -20px;
  }

  .cs-sol-hero-visual {
    grid-auto-flow: column;
    grid-auto-columns: minmax(0, 1fr);
    overflow-x: auto;
    padding-bottom: 6px;
  }

  .cs-sol-hero-card {
    min-width: 220px;
  }

  .cs-sol-mosaic-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .cs-sol-route-layout {
    grid-template-columns: minmax(0, 1fr);
  }

  .cs-sol-route-gallery {
    margin-top: 16px;
  }
}

@media (max-width: 768px) {
  .cs-sol-hero {
    padding-top: 90px;
  }

  .cs-sol-mosaic-grid {
    gap: 14px;
  }
}

@media (max-width: 640px) {
  .cs-sol-mosaic-grid {
    grid-template-columns: minmax(0, 1fr);
  }

  .cs-sol-route-timeline {
    padding-left: 12px;
  }
}

@media (max-width: 480px) {
  .cs-sol-hero-title {
    font-size: 24px;
  }

  .cs-sol-hero-copy::before {
    inset: -14px -12px -22px -12px;
  }
}
/* === SECTION 4: CLIENT PROFILES === */

.cs-sol-profiles {
  background: radial-gradient(circle at top center, #171c2b 0, #05070a 70%);
}

.cs-sol-profiles-inner {
  position: relative;
}

.cs-sol-profiles-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 16px;
  margin-top: 22px;
}

.cs-sol-profile-card {
  position: relative;
  padding: 12px 12px 13px;
  border-radius: 24px;
  background: linear-gradient(
    150deg,
    rgba(17, 22, 34, 0.97),
    rgba(8, 13, 23, 0.99)
  );
  border: 1px solid rgba(255, 255, 255, 0.09);
  box-shadow: var(--cs-shadow-subtle);
  overflow: hidden;
}

.cs-sol-profile-card::after {
  content: "";
  position: absolute;
  inset: -40%;
  background: conic-gradient(
    from 220deg,
    transparent,
    rgba(246, 167, 35, 0.14),
    rgba(32, 208, 178, 0.18),
    transparent
  );
  mix-blend-mode: screen;
  opacity: 0;
  transition: opacity 0.25s ease;
}

.cs-sol-profile-card:hover::after {
  opacity: 1;
}

.cs-sol-profile-head {
  position: relative;
  display: flex;
  flex-direction: column;
  gap: 4px;
  margin-bottom: 6px;
}

.cs-sol-profile-tag {
  align-self: flex-start;
  padding: 3px 9px;
  border-radius: 999px;
  border: 1px solid rgba(255, 255, 255, 0.22);
  font-size: 10px;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--cs-text-soft);
}

.cs-sol-profile-title {
  margin: 0;
  font-family: "CS-Heading";
  font-size: 14px;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.cs-sol-profile-text {
  margin: 0 0 8px;
  font-size: 13px;
  line-height: 1.6;
  color: var(--cs-text-muted);
}

.cs-sol-profile-media {
  margin: 0;
}

.cs-sol-profile-card--text {
  border-style: dashed;
}

/* === SECTION 5: ONSITE SUPPORT RIBBON === */

.cs-sol-onsite {
  background: radial-gradient(circle at top right, #151a2a 0, #05070a 70%);
}

.cs-sol-onsite-inner {
  position: relative;
}

.cs-sol-onsite-layout {
  display: grid;
  grid-template-columns: minmax(0, 1.3fr) minmax(0, 1.2fr);
  gap: 26px;
  align-items: center;
}

.cs-sol-onsite-steps {
  display: flex;
  flex-direction: column;
  gap: 10px;
}

.cs-sol-onsite-step {
  padding: 9px 11px;
  border-radius: 18px;
  background: linear-gradient(
    145deg,
    rgba(5, 7, 10, 0.96),
    rgba(18, 23, 38, 0.99)
  );
  border: 1px solid rgba(255, 255, 255, 0.08);
  box-shadow: var(--cs-shadow-subtle);
}

.cs-sol-onsite-step-tag {
  display: inline-block;
  margin-bottom: 3px;
  font-family: "CS-Heading";
  font-size: 11px;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--cs-text-soft);
}

.cs-sol-onsite-text {
  margin: 0;
  font-size: 13px;
  color: var(--cs-text-muted);
}

.cs-sol-onsite-gallery {
  display: grid;
  gap: 14px;
}

.cs-sol-onsite-photo {
  margin: 0;
}

.cs-sol-onsite-photo figcaption {
  margin-top: 6px;
  font-size: 12px;
  color: var(--cs-text-soft);
}

/* === SECTION 6: QUALITY & CHECKLIST === */

.cs-sol-quality {
  background: radial-gradient(circle at bottom left, #171c2b 0, #05070a 70%);
}

.cs-sol-quality-inner {
  position: relative;
}

.cs-sol-quality-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 18px;
  margin-top: 22px;
}

.cs-sol-quality-card {
  position: relative;
  padding: 12px 12px 13px;
  border-radius: 24px;
  background: linear-gradient(
    150deg,
    rgba(17, 22, 34, 0.97),
    rgba(8, 13, 23, 0.99)
  );
  border: 1px solid rgba(255, 255, 255, 0.09);
  box-shadow: var(--cs-shadow-subtle);
  overflow: hidden;
}

.cs-sol-quality-card::after {
  content: "";
  position: absolute;
  inset: -40%;
  background: conic-gradient(
    from 210deg,
    transparent,
    rgba(246, 167, 35, 0.14),
    rgba(32, 208, 178, 0.18),
    transparent
  );
  mix-blend-mode: screen;
  opacity: 0;
  transition: opacity 0.25s ease;
}

.cs-sol-quality-card:hover::after {
  opacity: 1;
}

.cs-sol-quality-head {
  position: relative;
  display: flex;
  flex-direction: column;
  gap: 4px;
  margin-bottom: 6px;
}

.cs-sol-quality-tag {
  align-self: flex-start;
  padding: 3px 9px;
  border-radius: 999px;
  border: 1px solid rgba(255, 255, 255, 0.22);
  font-size: 10px;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--cs-text-soft);
}

.cs-sol-quality-title {
  margin: 0;
  font-family: "CS-Heading";
  font-size: 14px;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.cs-sol-quality-text {
  margin: 0 0 8px;
  font-size: 13px;
  line-height: 1.6;
  color: var(--cs-text-muted);
}

.cs-sol-quality-media {
  margin: 0;
}
/* === SECTION 7: PROJECT BOARD === */

.cs-sol-board {
  background: radial-gradient(circle at top center, #151a2a 0, #05070a 70%);
}

.cs-sol-board-inner {
  position: relative;
}

.cs-sol-board-layout {
  display: grid;
  grid-template-columns: minmax(0, 1.4fr) minmax(0, 1.2fr);
  gap: 26px;
  align-items: flex-start;
}

.cs-sol-board-columns {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 10px;
}

.cs-sol-board-column {
  padding: 9px 10px;
  border-radius: 18px;
  background: linear-gradient(
    145deg,
    rgba(5, 7, 10, 0.96),
    rgba(18, 23, 38, 0.99)
  );
  border: 1px solid rgba(255, 255, 255, 0.08);
  box-shadow: var(--cs-shadow-subtle);
}

.cs-sol-board-label {
  margin: 0 0 4px;
  font-family: "CS-Heading";
  font-size: 13px;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.cs-sol-board-list {
  margin: 0;
  padding-left: 16px;
  font-size: 13px;
  line-height: 1.5;
  color: var(--cs-text-muted);
}

.cs-sol-board-list li + li {
  margin-top: 3px;
}

.cs-sol-board-gallery {
  display: grid;
  gap: 14px;
}

.cs-sol-board-photo {
  margin: 0;
}

.cs-sol-board-photo figcaption {
  margin-top: 6px;
  font-size: 12px;
  color: var(--cs-text-soft);
}

/* === SECTION 8: BUDGET & PHASING === */

.cs-sol-budget {
  background: radial-gradient(circle at top right, #171c2b 0, #05070a 70%);
}

.cs-sol-budget-inner {
  position: relative;
}

.cs-sol-budget-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 16px;
  margin-top: 22px;
}

.cs-sol-budget-card {
  position: relative;
  padding: 12px 12px 13px;
  border-radius: 24px;
  background: linear-gradient(
    150deg,
    rgba(17, 22, 34, 0.97),
    rgba(8, 13, 23, 0.99)
  );
  border: 1px solid rgba(255, 255, 255, 0.09);
  box-shadow: var(--cs-shadow-subtle);
  overflow: hidden;
}

.cs-sol-budget-card--focus {
  border-color: rgba(246, 167, 35, 0.9);
  box-shadow: 0 0 26px rgba(246, 167, 35, 0.5);
}

.cs-sol-budget-title {
  margin: 0 0 4px;
  font-family: "CS-Heading";
  font-size: 14px;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.cs-sol-budget-text {
  margin: 0 0 6px;
  font-size: 13px;
  line-height: 1.6;
  color: var(--cs-text-muted);
}

.cs-sol-budget-list {
  margin: 0;
  padding-left: 16px;
  font-size: 13px;
  line-height: 1.5;
  color: var(--cs-text-soft);
}

.cs-sol-budget-list li + li {
  margin-top: 3px;
}

.cs-sol-budget-gallery {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 14px;
  margin-top: 18px;
}

.cs-sol-budget-photo {
  margin: 0;
}

.cs-sol-budget-photo figcaption {
  margin-top: 6px;
  font-size: 12px;
  color: var(--cs-text-soft);
}

/* === SECTION 9: DIGITAL TRACKING === */

.cs-sol-tracking {
  background: radial-gradient(circle at bottom left, #171c2b 0, #05070a 70%);
}

.cs-sol-tracking-inner {
  position: relative;
}

.cs-sol-tracking-layout {
  display: grid;
  grid-template-columns: minmax(0, 1.3fr) minmax(0, 1.2fr);
  gap: 26px;
  align-items: center;
}

.cs-sol-tracking-copy {
  display: flex;
  flex-direction: column;
  gap: 10px;
}

.cs-sol-tracking-line {
  display: flex;
  gap: 10px;
  align-items: flex-start;
}

.cs-sol-tracking-dot {
  width: 12px;
  height: 12px;
  border-radius: 999px;
  background: linear-gradient(135deg, #20d0b2, #4cc9f0);
  box-shadow: 0 0 16px rgba(32, 208, 178, 0.9);
  animation: cs-sol-tracking-pulse 2.4s ease-in-out infinite;
  flex-shrink: 0;
}

.cs-sol-tracking-title {
  margin: 0 0 4px;
  font-family: "CS-Heading";
  font-size: 14px;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.cs-sol-tracking-text {
  margin: 0;
  font-size: 13px;
  line-height: 1.6;
  color: var(--cs-text-muted);
}

.cs-sol-tracking-gallery {
  display: grid;
  gap: 14px;
}

.cs-sol-tracking-photo {
  margin: 0;
}

.cs-sol-tracking-photo figcaption {
  margin-top: 6px;
  font-size: 12px;
  color: var(--cs-text-soft);
}

/* pulse animation */
@keyframes cs-sol-tracking-pulse {
  0% {
    transform: scale(1);
    opacity: 0.7;
  }
  50% {
    transform: scale(1.25);
    opacity: 1;
  }
  100% {
    transform: scale(1);
    opacity: 0.7;
  }
}
/* === PAGE 3 SECTION 10: TRAINING & WORKSHOPS === */

.cs-sol-training {
  background: radial-gradient(circle at top center, #171c2b 0, #05070a 70%);
}

.cs-sol-training-inner {
  position: relative;
}

.cs-sol-training-layout {
  display: grid;
  grid-template-columns: minmax(0, 1.25fr) minmax(0, 1.25fr);
  gap: 26px;
  align-items: center;
}

.cs-sol-training-copy {
  display: flex;
  flex-direction: column;
  gap: 10px;
}

.cs-sol-training-item {
  padding: 9px 11px;
  border-radius: 18px;
  background: linear-gradient(
    145deg,
    rgba(5, 7, 10, 0.96),
    rgba(18, 23, 38, 0.99)
  );
  border: 1px solid rgba(255, 255, 255, 0.08);
  box-shadow: var(--cs-shadow-subtle);
}

.cs-sol-training-tag {
  display: inline-block;
  margin-bottom: 3px;
  font-family: "CS-Heading";
  font-size: 11px;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--cs-text-soft);
}

.cs-sol-training-text {
  margin: 0;
  font-size: 13px;
  color: var(--cs-text-muted);
}

.cs-sol-training-gallery {
  display: grid;
  gap: 14px;
}

.cs-sol-training-photo {
  margin: 0;
}

.cs-sol-training-photo figcaption {
  margin-top: 6px;
  font-size: 12px;
  color: var(--cs-text-soft);
}

/* === PAGE 3 SECTION 11: SAFETY & COMPLIANCE === */

.cs-sol-safety {
  background: radial-gradient(circle at top right, #151a2a 0, #05070a 70%);
}

.cs-sol-safety-inner {
  position: relative;
}

.cs-sol-safety-layout {
  display: grid;
  grid-template-columns: minmax(0, 1.3fr) minmax(0, 1.2fr);
  gap: 26px;
  align-items: center;
}

.cs-sol-safety-pills {
  display: flex;
  flex-direction: column;
  gap: 10px;
}

.cs-sol-safety-pill {
  padding: 9px 11px;
  border-radius: 18px;
  background: linear-gradient(
    145deg,
    rgba(5, 7, 10, 0.96),
    rgba(18, 23, 38, 0.99)
  );
  border: 1px solid rgba(255, 255, 255, 0.08);
  box-shadow: var(--cs-shadow-subtle);
}

.cs-sol-safety-label {
  display: inline-block;
  margin-bottom: 3px;
  font-family: "CS-Heading";
  font-size: 11px;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--cs-text-soft);
}

.cs-sol-safety-text {
  margin: 0;
  font-size: 13px;
  color: var(--cs-text-muted);
}

.cs-sol-safety-gallery {
  display: grid;
  gap: 14px;
}

.cs-sol-safety-photo {
  margin: 0;
}

.cs-sol-safety-photo figcaption {
  margin-top: 6px;
  font-size: 12px;
  color: var(--cs-text-soft);
}

/* === PAGE 3 SECTION 12: WAREHOUSE LAYOUT & STAGING === */

.cs-sol-layout {
  background: radial-gradient(circle at bottom left, #171c2b 0, #05070a 70%);
}

.cs-sol-layout-inner {
  position: relative;
}

.cs-sol-layout-grid {
  display: grid;
  grid-template-columns: minmax(0, 1.3fr) minmax(0, 1.2fr);
  gap: 26px;
  align-items: center;
}

.cs-sol-layout-scheme {
  padding: 10px 12px;
  border-radius: 20px;
  background: linear-gradient(
    145deg,
    rgba(5, 7, 10, 0.96),
    rgba(18, 23, 38, 0.99)
  );
  border: 1px solid rgba(255, 255, 255, 0.12);
  box-shadow: var(--cs-shadow-subtle);
}

.cs-sol-layout-row {
  display: flex;
  align-items: flex-start;
  gap: 8px;
  margin-bottom: 8px;
}

.cs-sol-layout-row:last-child {
  margin-bottom: 0;
}

.cs-sol-layout-dot {
  width: 10px;
  height: 10px;
  border-radius: 999px;
  box-shadow: 0 0 14px rgba(246, 167, 35, 0.9);
  flex-shrink: 0;
}

.cs-sol-layout-dot--project {
  background: linear-gradient(135deg, #f6a723, #c46744);
}

.cs-sol-layout-dot--staging {
  background: linear-gradient(135deg, #20d0b2, #4cc9f0);
}

.cs-sol-layout-dot--route {
  background: linear-gradient(135deg, #ffce66, #f05b21);
}

.cs-sol-layout-row-text {
  margin: 0;
  font-size: 13px;
  color: var(--cs-text-muted);
}

.cs-sol-layout-gallery {
  display: grid;
  gap: 14px;
}

.cs-sol-layout-photo {
  margin: 0;
}

.cs-sol-layout-photo figcaption {
  margin-top: 6px;
  font-size: 12px;
  color: var(--cs-text-soft);
}
@media (max-width: 1024px) {
  .cs-sol-training-layout,
  .cs-sol-safety-layout,
  .cs-sol-layout-grid {
    grid-template-columns: minmax(0, 1fr);
  }

  .cs-sol-layout-gallery,
  .cs-sol-safety-gallery,
  .cs-sol-training-gallery {
    margin-top: 16px;
  }
}

@media (max-width: 640px) {
  .cs-sol-training-layout,
  .cs-sol-safety-layout,
  .cs-sol-layout-grid {
    gap: 20px;
  }
}
.cs-sol-data {
  background: radial-gradient(circle at top center, #151a2a 0, #05070a 70%);
}

.cs-sol-data-inner {
  position: relative;
}

.cs-sol-data-layout {
  display: grid;
  grid-template-columns: minmax(0, 1.3fr) minmax(0, 1.2fr);
  gap: 26px;
  align-items: center;
}

.cs-sol-data-cards {
  display: flex;
  flex-direction: column;
  gap: 10px;
}

.cs-sol-data-card {
  padding: 9px 11px;
  border-radius: 18px;
  background: linear-gradient(145deg, rgba(5, 7, 10, 0.96), rgba(18, 23, 38, 0.99));
  border: 1px solid rgba(255, 255, 255, 0.08);
  box-shadow: var(--cs-shadow-subtle);
}

.cs-sol-data-label {
  display: inline-block;
  margin-bottom: 3px;
  font-family: "CS-Heading";
  font-size: 11px;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--cs-text-soft);
}

.cs-sol-data-text {
  margin: 0;
  font-size: 13px;
  color: var(--cs-text-muted);
}

.cs-sol-data-gallery {
  display: grid;
  gap: 14px;
}

.cs-sol-data-photo {
  margin: 0;
}

.cs-sol-data-photo figcaption {
  margin-top: 6px;
  font-size: 12px;
  color: var(--cs-text-soft);
}

/* PARTNERS */

.cs-sol-partners {
  background: radial-gradient(circle at top right, #171c2b 0, #05070a 70%);
}

.cs-sol-partners-inner {
  position: relative;
}

.cs-sol-partners-layout {
  display: grid;
  grid-template-columns: minmax(0, 1.3fr) minmax(0, 1.2fr);
  gap: 26px;
  align-items: center;
}

.cs-sol-partner-chips {
  display: flex;
  flex-direction: column;
  gap: 10px;
}

.cs-sol-partner-chip {
  padding: 9px 11px;
  border-radius: 18px;
  background: linear-gradient(145deg, rgba(5, 7, 10, 0.96), rgba(18, 23, 38, 0.99));
  border: 1px solid rgba(255, 255, 255, 0.08);
  box-shadow: var(--cs-shadow-subtle);
}

.cs-sol-partner-tag {
  display: inline-block;
  margin-bottom: 3px;
  font-family: "CS-Heading";
  font-size: 11px;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--cs-text-soft);
}

.cs-sol-partner-text {
  margin: 0;
  font-size: 13px;
  color: var(--cs-text-muted);
}

.cs-sol-partners-gallery {
  display: grid;
  gap: 14px;
}

.cs-sol-partners-photo {
  margin: 0;
}

.cs-sol-partners-photo figcaption {
  margin-top: 6px;
  font-size: 12px;
  color: var(--cs-text-soft);
}

/* AFTER-SALES SUPPORT */

.cs-sol-support {
  background: radial-gradient(circle at bottom center, #171c2b 0, #05070a 70%);
}

.cs-sol-support-inner {
  position: relative;
}

.cs-sol-support-layout {
  display: grid;
  grid-template-columns: minmax(0, 1.3fr) minmax(0, 1.2fr);
  gap: 26px;
  align-items: center;
}

.cs-sol-support-cards {
  display: flex;
  flex-direction: column;
  gap: 10px;
}

.cs-sol-support-card {
  padding: 9px 11px;
  border-radius: 18px;
  background: linear-gradient(145deg, rgba(5, 7, 10, 0.96), rgba(18, 23, 38, 0.99));
  border: 1px solid rgba(255, 255, 255, 0.08);
  box-shadow: var(--cs-shadow-subtle);
}

.cs-sol-support-label {
  display: inline-block;
  margin-bottom: 3px;
  font-family: "CS-Heading";
  font-size: 11px;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--cs-text-soft);
}

.cs-sol-support-text {
  margin: 0;
  font-size: 13px;
  color: var(--cs-text-muted);
}

.cs-sol-support-gallery {
  display: grid;
  gap: 14px;
}

.cs-sol-support-photo {
  margin: 0;
}

.cs-sol-support-photo figcaption {
  margin-top: 6px;
  font-size: 12px;
  color: var(--cs-text-soft);
}

/* RESPONSIVE FOR 13–15 */

@media (max-width: 1024px) {
  .cs-sol-data-layout,
  .cs-sol-partners-layout,
  .cs-sol-support-layout {
    grid-template-columns: minmax(0, 1fr);
  }

  .cs-sol-data-gallery,
  .cs-sol-partners-gallery,
  .cs-sol-support-gallery {
    margin-top: 16px;
  }
}

@media (max-width: 640px) {
  .cs-sol-data-layout,
  .cs-sol-partners-layout,
  .cs-sol-support-layout {
    gap: 20px;
  }
}
.cs-sol-eco {
  background: radial-gradient(circle at top center, #151a2a 0, #05070a 70%);
}

.cs-sol-eco-inner {
  position: relative;
}

.cs-sol-eco-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 14px;
  margin-top: 20px;
}

.cs-sol-eco-card {
  padding: 9px 11px;
  border-radius: 18px;
  background: linear-gradient(145deg, rgba(5, 7, 10, 0.96), rgba(18, 23, 38, 0.99));
  border: 1px solid rgba(255, 255, 255, 0.08);
  box-shadow: var(--cs-shadow-subtle);
}

.cs-sol-eco-title {
  margin: 0 0 4px;
  font-family: "CS-Heading";
  font-size: 13px;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.cs-sol-eco-text {
  margin: 0;
  font-size: 13px;
  color: var(--cs-text-muted);
}

.cs-sol-eco-gallery {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 14px;
  margin-top: 18px;
}

.cs-sol-eco-photo {
  margin: 0;
}

.cs-sol-eco-photo figcaption {
  margin-top: 6px;
  font-size: 12px;
  color: var(--cs-text-soft);
}

/* ARCHITECTS */

.cs-sol-architects {
  background: radial-gradient(circle at top right, #171c2b 0, #05070a 70%);
}

.cs-sol-architects-inner {
  position: relative;
}

.cs-sol-architects-grid {
  display: grid;
  grid-template-columns: minmax(0, 1.3fr) minmax(0, 1.2fr);
  gap: 26px;
  align-items: center;
}

.cs-sol-architects-copy {
  display: flex;
  flex-direction: column;
  gap: 10px;
}

.cs-sol-architects-item {
  padding: 9px 11px;
  border-radius: 18px;
  background: linear-gradient(145deg, rgba(5, 7, 10, 0.96), rgba(18, 23, 38, 0.99));
  border: 1px solid rgba(255, 255, 255, 0.08);
  box-shadow: var(--cs-shadow-subtle);
}

.cs-sol-architects-label {
  display: inline-block;
  margin-bottom: 3px;
  font-family: "CS-Heading";
  font-size: 11px;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--cs-text-soft);
}

.cs-sol-architects-text {
  margin: 0;
  font-size: 13px;
  color: var(--cs-text-muted);
}

.cs-sol-architects-gallery {
  display: grid;
  gap: 14px;
}

.cs-sol-architects-photo {
  margin: 0;
}

.cs-sol-architects-photo figcaption {
  margin-top: 6px;
  font-size: 12px;
  color: var(--cs-text-soft);
}

/* NEXT STEPS */

.cs-sol-next {
  background: radial-gradient(circle at bottom center, #171c2b 0, #05070a 70%);
}

.cs-sol-next-inner {
  position: relative;
}

.cs-sol-next-grid {
  display: grid;
  grid-template-columns: minmax(0, 1.3fr) minmax(0, 1.2fr);
  gap: 26px;
  align-items: center;
}

.cs-sol-next-copy {
  display: flex;
  flex-direction: column;
  gap: 10px;
}

.cs-sol-next-item {
  padding: 9px 11px;
  border-radius: 18px;
  background: linear-gradient(145deg, rgba(5, 7, 10, 0.96), rgba(18, 23, 38, 0.99));
  border: 1px solid rgba(255, 255, 255, 0.08);
  box-shadow: var(--cs-shadow-subtle);
}

.cs-sol-next-label {
  display: inline-block;
  margin-bottom: 3px;
  font-family: "CS-Heading";
  font-size: 11px;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--cs-text-soft);
}

.cs-sol-next-text {
  margin: 0;
  font-size: 13px;
  color: var(--cs-text-muted);
}

.cs-sol-next-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
}

.cs-sol-next-gallery {
  display: grid;
  gap: 14px;
}

.cs-sol-next-photo {
  margin: 0;
}

.cs-sol-next-photo figcaption {
  margin-top: 6px;
  font-size: 12px;
  color: var(--cs-text-soft);
}

/* RESPONSIVE 16–18 */

@media (max-width: 1024px) {
  .cs-sol-eco-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }

  .cs-sol-eco-gallery {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }

  .cs-sol-architects-grid,
  .cs-sol-next-grid {
    grid-template-columns: minmax(0, 1fr);
  }

  .cs-sol-architects-gallery,
  .cs-sol-next-gallery {
    margin-top: 16px;
  }
}

@media (max-width: 768px) {
  .cs-sol-eco-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .cs-sol-eco-gallery {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .cs-sol-next-actions {
    flex-direction: column;
    align-items: flex-start;
  }
}

@media (max-width: 640px) {
  .cs-sol-eco-grid,
  .cs-sol-eco-gallery {
    grid-template-columns: minmax(0, 1fr);
  }

  .cs-sol-architects-grid,
  .cs-sol-next-grid {
    gap: 20px;
  }
}
/* MOBILE FIX: LAYİHƏ LÖVHƏSİ (PAGE 3 SECTION 7) */
@media (max-width: 768px) {
  /* сама секция – всё в одну колонку */
  .cs-sol-board-layout {
    grid-template-columns: minmax(0, 1fr);
    gap: 18px;
  }

  /* колонки плана, material, obyekt günü – одна под другой */
  .cs-sol-board-columns {
    grid-template-columns: minmax(0, 1fr);
    gap: 8px;
  }

  .cs-sol-board-column {
    padding: 8px 10px;
  }

  .cs-sol-board-list {
    padding-left: 16px;
    font-size: 12px;
  }
}
