/* Only the approved workshop hero; existing header, form and sections keep their styles. */
#cs-workshop {
  --cs-canvas: #f3eee9;
  background: linear-gradient(180deg, #eee8f7 0%, #f1ebf4 25%, var(--cs-canvas) 48%);
  color: #111619;
  padding: 216px 0 0;
  font-family: 'Inter', sans-serif;
  overflow: hidden;
}
#cs-workshop > .elementor-container { max-width: 1280px; }
#cs-workshop > .elementor-container > .elementor-column > .elementor-widget-wrap {
  padding: 0;
  justify-content: center;
  align-content: flex-start;
  column-gap: 16px;
}
#cs-workshop .elementor-widget { margin-bottom: 0; }
#cs-workshop .cs-eyebrow { padding: 0 20px; }
#cs-workshop .cs-eyebrow .elementor-heading-title {
  font: 600 11px/1.6 'Inter', sans-serif;
  letter-spacing: .18em;
  color: #49525a;
  text-align: center;
}
#cs-workshop .cs-eyebrow::after {
  content: ''; display: block; width: 30px; height: 3px;
  background: var(--color-accent, #d4af37); border-radius: 2px; margin: 8px auto 12px;
}
#cs-workshop .cs-title { padding: 0 20px; }
#cs-workshop .cs-title .elementor-heading-title {
  font: 800 clamp(44px, 4.4vw, 56px)/1.03 'Inter', sans-serif;
  letter-spacing: -.055em; color: #111619; text-align: center;
  text-transform: none; margin: 0;
}
#cs-workshop .cs-title span { color: var(--color-primary, #3f3075); position: relative; white-space: nowrap; }
#cs-workshop .cs-title span::after {
  content: ''; position: absolute; left: 8%; right: 5%; bottom: -8px;
  height: 7px; border-top: 2px solid var(--color-accent, #d4af37); border-radius: 50%; transform: rotate(-2deg);
}
#cs-workshop .cs-description { margin: 14px 0 18px; padding: 0 24px; }
#cs-workshop .cs-description p {
  font: 400 18px/1.4 'Inter', sans-serif; letter-spacing: -.025em;
  color: #49525a; max-width: 600px; text-align: center; margin: 0 auto;
}
#cs-workshop .elementor-widget-button { width: auto; max-width: calc(100% - 40px); }
#cs-workshop .elementor-button {
  display: inline-flex; justify-content: center; align-items: center; min-height: 46px;
  border: 1px solid #b7b4b0; border-radius: 14px; padding: 12px 24px;
  background: transparent !important; color: #111619 !important;
  font: 650 14px/1.4 'Inter', sans-serif; text-decoration: none;
  transition: background .15s ease, transform .15s ease;
}
#cs-workshop .cs-primary .elementor-button { background: #111619 !important; border-color: #111619; color: #fff !important; }
#cs-workshop .elementor-button:hover { background: #e6dfd7 !important; transform: translateY(-2px); }
#cs-workshop .cs-primary .elementor-button:hover { background: #303638 !important; }
#cs-workshop a:focus-visible { outline: 3px solid var(--color-primary, #3f3075); outline-offset: 4px; }
#cs-workshop .cs-artwork { margin-top: 0; }
#cs-workshop .cs-media { position: relative; width: 100%; aspect-ratio: 16 / 9; }
#cs-workshop .cs-media img, #cs-workshop .cs-media video {
  position: absolute; inset: 0; width: 100%; height: 100%; object-fit: contain; display: block;
  -webkit-mask-image: linear-gradient(to bottom, transparent, rgba(0, 0, 0, .35) 7%, #000 20%, #000 83%, transparent);
  mask-image: linear-gradient(to bottom, transparent, rgba(0, 0, 0, .35) 7%, #000 20%, #000 83%, transparent);
}
#cs-workshop .cs-media video { opacity: 0; }
#cs-workshop .cs-media video[data-ready] { opacity: 1; }
#cs-workshop .cs-media::after {
  content: ''; position: absolute; inset: 0; pointer-events: none;
  background: linear-gradient(90deg, var(--cs-canvas), transparent 12%, transparent 88%, var(--cs-canvas));
}
#cs-workshop .elementor-button-icon svg { width: 20px; height: 20px; }
#cs-workshop .elementor-button-content-wrapper { align-items: center; gap: 10px; }
#cs-workshop .cs-title, #cs-workshop .cs-description { animation: cs-copy-in .45s ease-out both; }
@keyframes cs-copy-in { from { opacity: 0; transform: translateY(6px); } to { opacity: 1; transform: none; } }
@media (min-width: 1025px) {
  #cs-workshop .cs-media { width: clamp(560px, calc((100svh - 500px) * 1.77778), 820px); max-width: 100%; margin-inline: auto; }
}
@media (min-width: 768px) and (max-width: 1024px) {
  #cs-workshop { padding-top: 180px; }
}
@media (max-width: 767px) {
  #cs-workshop { padding-top: 158px; }
  #cs-workshop .cs-eyebrow .elementor-heading-title { font-size: 9px; letter-spacing: .12em; }
  #cs-workshop .cs-title .elementor-heading-title { font-size: clamp(36px, 9.5vw, 56px); }
  #cs-workshop .cs-description { margin: 20px 0 24px; }
  #cs-workshop .cs-description p { font-size: 17px; max-width: 420px; }
  #cs-workshop .elementor-widget-button { width: calc(100% - 64px); margin-bottom: 10px; }
  #cs-workshop .elementor-button { width: 100%; }
  #cs-workshop .cs-artwork { margin-top: 4px; }
}
@media (prefers-reduced-motion: reduce) {
  #cs-workshop .cs-title, #cs-workshop .cs-description { animation: none; }
  #cs-workshop .elementor-button { transition: none; }
  #cs-workshop .elementor-button:hover { transform: none; }
}

/* Restored introduction video, immediately below the animated hero. */
#cs-intro-video { background: #f3eee9; padding: 32px 24px 56px; }
#cs-intro-video > .elementor-container { max-width: 960px; }
#cs-intro-video .elementor-widget-wrap { padding: 0; }
#cs-intro-video .elementor-wrapper { --video-aspect-ratio: 1.7777778; border-radius: 16px; overflow: hidden; background: #111619; }
#cs-intro-video .elementor-custom-embed-play:focus-visible { outline: 3px solid #fff; outline-offset: 8px; border-radius: 50%; }
@media (max-width: 767px) { #cs-intro-video { padding: 20px 20px 32px; } }
