/* ----- stimulus slider wrapper ----- */
    .stsl-wrap {
      --orange: #e55a1c;
      --orange-dark: #c14a15;
      --orange-soft: #fdeee5;
      --cream: #fdfbf7;
      --cream-alt: #faf3e9;
      --ink: #2a231d;
      --ink-soft: #6b5f54;
      --border: #ece2d3;
      --white: #ffffff;
--stsl-ink-soft: #6b5f54;
      position: relative;
      width: 100%;
      color: var(--ink);
      background: var(--cream);
      padding: clamp(48px, 7vw, 88px) 0;
      overflow: hidden;
    }

    .stsl-container {
      width: 100%;
      margin: 0 auto;
      padding: 0 clamp(20px, 5vw, 64px);
      position: relative;
    }

    /* ----- viewport & track ----- */
    .stsl-viewport {
      overflow: hidden;
      border-radius: clamp(16px, 2.4vw, 28px);
      outline: none;
    }

    .stsl-track {
      display: flex;
      transition: transform 0.75s cubic-bezier(0.22, 1, 0.36, 1);
      will-change: transform;
    }

    .stsl-slide {
      flex: 0 0 100%;
      min-width: 0;
      display: grid;
      grid-template-columns: 1fr 1fr;
      gap: clamp(28px, 5vw, 56px);
      align-items: center;
      padding: 8px 4px;
    }

    /* image left · content right */
    .stsl-visual { order: 1; }
    .stsl-content { order: 2; }

    /* ----- visual panel (simple icon) ----- */
    .stsl-visual {
      position: relative;
      aspect-ratio: 4 / 3;
      width: 100%;
      border-radius: clamp(14px, 2vw, 26px);
      background:
        radial-gradient(circle at 30% 20%, rgba(229, 90, 28, 0.12), transparent 55%),
        var(--cream-alt);
      border: 1px solid var(--border);
      display: flex;
      align-items: center;
      justify-content: center;

    
    }
  	/* .stsl-visual img {
		width: 100%;
		height: 100%;
		max-height: 420px;
		object-fit: fill; 
		display: block;
	} */
	 .stsl-visual img {
		width: 100%;
		height: 100%;
		max-height: unset;
		object-fit: fill; /* Maintain aspect ratio while covering */
		display: block;
	}
    .stsl-visual-core {
      width: clamp(72px, 10vw, 110px);
      height: clamp(72px, 10vw, 110px);
      border-radius: clamp(18px, 2.4vw, 28px);
      background: var(--orange);
      color: var(--white);
      display: flex;
      align-items: center;
      justify-content: center;
      box-shadow: 0 22px 40px -16px rgba(229, 90, 28, 0.55);
      z-index: 2;
    }
    .stsl-visual-core svg {
      width: 48%;
      height: 48%;
      display: block;
      stroke: currentColor;
      fill: none;
    }

    /* ----- content ----- */
    .stsl-eyebrow {
      display: inline-flex;
      align-items: center;
      gap: 8px;
      font-size: 11px;
      font-weight: 700;
      letter-spacing: 0.16em;
      text-transform: uppercase;
      color: var(--orange);
      margin-bottom: 16px;
    }
    /* .stsl-content h2 {
      font-family: 'Lato', sans-serif;
      font-size: clamp(22px, 3.2vw, 36px);
      font-weight: 800;
      line-height: 1.2;
      color: var(--orange);
      margin: 0 0 16px;
    } */
    .stsl-content p {
      font-size: clamp(14px, 1.6vw, 15.5px);
      line-height: 1.7;
      color: var(--ink-soft);
      margin: 0 0 28px;
      max-width: 460px;
    }
    .stsl-cta {
      display: inline-flex;
      align-items: center;
      gap: 8px;
      background: var(--orange);
      color: var(--white);
      font-family: 'Lato', sans-serif;
      font-weight: 700;
      font-size: 14.5px;
      padding: 13px 28px;
      border-radius: 10px;
      border: none;
      cursor: pointer;
      box-shadow: 0 10px 22px -8px rgba(229, 90, 28, 0.5);
      transition: background 0.2s ease, transform 0.2s ease;
    }
    .stsl-cta:hover {
      background: var(--orange-dark);
      transform: translateY(-2px);
    }
    .stsl-cta:focus-visible {
      outline: 2px solid var(--orange-dark);
      outline-offset: 3px;
    }

    /* ----- staggered entrance ----- */
    .stsl-slide .stsl-content>* {
      opacity: 0;
      transform: translateY(14px);
      transition: opacity 0.6s ease, transform 0.6s ease;
    }
     .stsl-slide .stsl-content> h2, p {
     margin-bottom: 20px !important;
    }
    .stsl-slide.active .stsl-content>* {
      opacity: 1;
      transform: translateY(0);
    }
    .stsl-eyebrow{
      font-family: var(--crm-font-display);
     margin-bottom: 20px;
    
    letter-spacing: -.01em;
    font-size: clamp(22px, 3.2vw, 36px);
    font-weight: 800;
    line-height: 1.2;

    }
    .stsl-slide.active .stsl-content>*:nth-child(1) { transition-delay: 0.15s; }
    .stsl-slide.active .stsl-content>*:nth-child(2) { transition-delay: 0.25s; }
    .stsl-slide.active .stsl-content>*:nth-child(3) { transition-delay: 0.35s; }
    .stsl-slide.active .stsl-content>*:nth-child(4) { transition-delay: 0.45s; }

    /* ----- arrow controls ----- */
    .stsl-arrow {
      position: absolute;
      top: 50%;
      transform: translateY(-50%);
      width: 44px;
      height: 44px;
      border-radius: 50%;
      background: var(--white);
      border: 1px solid var(--border);
      color: var(--ink);
      display: flex;
      align-items: center;
      justify-content: center;
      cursor: pointer;
      box-shadow: 0 10px 24px -12px rgba(42, 35, 29, 0.3);
      transition: background 0.2s ease, color 0.2s ease, transform 0.2s ease;
      z-index: 3;
    }
    .stsl-arrow svg {
      width: 20px;
      height: 20px;
      stroke: currentColor;
      fill: none;
      stroke-width: 2.2;
      pointer-events: none;
    }
    .stsl-arrow:hover {
      background: var(--orange);
      color: var(--white);
    }
    .stsl-arrow:active {
      transform: translateY(-50%) scale(0.94);
    }
    .stsl-arrow-prev { left: 8px; }
    .stsl-arrow-next { right: 8px; }

    /* ----- responsive ----- */
    @media (max-width: 900px) {
      .stsl-slide {
        grid-template-columns: 1fr;
        text-align: center;
      }
      .stsl-content p { margin-left: auto; margin-right: auto; }
      .stsl-visual { max-width: 420px; margin: 0 auto; width: 100%; }
      .stsl-eyebrow { justify-content: center; }
    }

    @media (max-width: 560px) {
      .stsl-arrow { width: 36px; height: 36px; }
      .stsl-arrow svg { width: 17px; height: 17px; }
      .stsl-arrow-prev { left: 0; }
      .stsl-arrow-next { right: 0; }
      .stsl-visual-core { border-radius: 18px; }
    }

    @media (max-width: 380px) {
      .stsl-container { padding: 0 12px; }
    }

    @media (prefers-reduced-motion: reduce) {
      .stsl-track { transition: none !important; }
      .stsl-slide .stsl-content>* { transition: none !important; }
    }

	.stsl-content h2 {
		font-size: clamp(22px, 3.2vw, 36px);
		font-weight: 800;
		line-height: 1.2;
		color: var(--stsl-orange);
		margin-bottom: 16px;
	}

.stsl-content p {
    font-size: clamp(14px, 1.6vw, 15.5px);
    line-height: 1.7;
    color: var(--stsl-ink-soft);
    margin: 0 0 28px;
    max-width: 460px;
}