:root{
      --dark:#222427;
      --muted:#9aa0a4;
      --accent:#ff6a1a; /* orange accent like the screenshot */
    }

    .test-section {
      min-height: 72vh;
      display: flex;
      align-items: stretch;
      overflow: hidden;
    }

    /* left content */
    .test-left {
      background: linear-gradient(180deg, var(--dark) 0%, #2b2d2f 100%);
      padding: 60px 6%;
      position: relative;
      display: flex;
      align-items: center;
    }

    .test-inner {
      max-width: 720px;
    }

    .eyebrow {
      color: var(--accent);
      font-weight:700;
      font-size: 0.9rem;
      letter-spacing: .06em;
      margin-bottom: 18px;
      display:inline-block;
    }

    .test-title {
      font-size: clamp(2rem, 4vw, 3.4rem);
      line-height: 1.02;
      font-weight: 800;
      margin-bottom: 20px;
      color: #fff;
    }

    .quote {
      font-style: italic;
      color: #dfe3e5;
      font-size: 1.05rem;
      line-height: 1.6;
      margin-bottom: 30px;
      border-left: 3px solid rgba(255,255,255,0.04);
      padding-left: 18px;
      opacity: .95;
    }

    /* avatars row */
    .avatars {
      display:flex;
      gap: 14px;
      align-items: center;
      margin-bottom: 16px;
    }

    .avatar {
      width:54px;
      height:54px;
      border-radius:12px;
      overflow:hidden;
      border: 3px solid rgba(255,255,255,0.08);
      background: #fff;
      display:inline-block;
      box-shadow: 0 6px 18px rgba(0,0,0,0.25);
      transform: translateY(0);
    }

    .avatar img {
      width:100%;
      height:100%;
      object-fit:cover;
      display:block;
    }

    /* navigation arrows on left panel */
    .testimonial-nav {
      position: absolute;
      right: 22px;
      bottom: 40px;
      display:flex;
      gap:12px;
      align-items:center;
    }

    .nav-btn {
      width:36px;
      height:36px;
      border-radius:50%;
      border:1px solid rgba(255,255,255,0.06);
      background: transparent;
      display:flex;
      align-items:center;
      justify-content:center;
      color: #fff;
      cursor: pointer;
      font-weight:700;
    }

    /* right image column */
    .test-right {
      position: relative;
      padding: 0;
      min-height: 72vh;
      display:flex;
    }

    .test-image {
      width:100%;
      height:100%;
      object-fit:cover;
      display:block;
    }

    /* small round CTA arrow like screenshot */
    .cta-round {
      position: absolute;
      right: 24px;
      bottom: 18px;
      width:52px;
      height:52px;
      border-radius:50%;
      border:2px solid var(--accent);
      display:flex;
      align-items:center;
      justify-content:center;
      color:var(--accent);
      background: transparent;
      cursor:pointer;
      z-index:5;
    }

    /* decorative faint building-lines background (optional) */
    .building-silhouette {
      position: absolute;
      left: 0;
      bottom: 0;
      width: 100%;
      height: 100%;
      opacity: 0.06;
      pointer-events:none;
      background-image: url('https://images.unsplash.com/photo-1505682634904-d7c9a4a6b5f2?q=80&w=1200&auto=format&fit=crop&ixlib=rb-4.0.3&s='); /* replace or remove */
      background-repeat: no-repeat;
      background-position: left bottom;
      background-size: contain;
    }

    /* responsiveness */
    @media (max-width: 991.98px) {
      .test-section { min-height: 60vh; }
      .test-left { padding: 36px 5%; }
      .testimonial-nav { position: static; margin-top: 10px; }
      .test-right { min-height: 40vh; }
      .cta-round { right: 16px; bottom: 16px; }
    }

    @media (max-width: 575.98px) {
      .test-left { padding: 26px 5%; }
      .test-title { font-size: 1.6rem; }
      .quote { font-size: 0.98rem; }
      .avatars .avatar { width:44px; height:44px; border-radius:10px; }
    }