
    /* ================= INTRO / SERVICE OVERVIEW ================= */

    .leather-care-services {
      background: var(--gradient-soft);
    }

    .leather-service-card {
      background: #FFFFFF;
      border-radius: 24px;
      padding: 2.4rem 2.2rem;
      box-shadow: 0 6px 16px rgba(15, 23, 42, 0.06);
      margin-bottom: 2.4rem;
      position: relative;
      overflow: hidden;
      transition: all 0.3s ease;
      border: 1px solid rgba(148, 163, 184, 0.2);
    }

    .leather-service-card::before {
      content: "";
      position: absolute;
      inset: 0;
      background:
        radial-gradient(circle at top left, rgba(102, 126, 234, 0.14), transparent 55%);
      opacity: 0;
      transition: opacity 0.3s ease;
      pointer-events: none;
    }

    .leather-service-card:hover {
      transform: translateY(-4px);
      box-shadow: 0 10px 30px rgba(15, 23, 42, 0.10);
      border-color: rgba(102, 126, 234, 0.4);
    }

    .leather-service-card:hover::before {
      opacity: 1;
    }

    .leather-service-title {
      font-size: 1.8rem;
      font-weight: 700;
      margin-bottom: 0.5rem;
    }

    .leather-service-body-text {
      font-size: 1rem;
      color: #4B5563;
      margin-bottom: 0;
    }

    .leather-service-image-wrap {
      position: relative;
      max-width: 380px;
      margin: 0 auto;
    }

    .leather-service-image-wrap img {
      border-radius: 24px;
      box-shadow: 0 12px 35px rgba(15, 23, 42, 0.12);
      width: 100%;
      display: block;
      filter: saturate(1.05) contrast(1.03);
    }


    .leather-service-badge-floating {
      position: absolute;
      bottom: -12px;
      left: 14px;
      background: rgba(15, 23, 42, 0.96);
      color: #E5E7EB;
      padding: 0.65rem 0.9rem;
      border-radius: 999px;
      font-size: 0.78rem;
      display: inline-flex;
      align-items: center;
      gap: 0.4rem;
      backdrop-filter: blur(8px);
      box-shadow: 0 12px 28px rgba(15, 23, 42, 0.7);
    }

    .leather-service-badge-floating i {
      color: #00BBD4;
    }


    /* ================= PROCESS SECTION ================= */

    .leather-process-section {
      background: #EFF6FF;
    }

    .leather-process-grid-card {
      background: #ffffff;
      border-radius: 20px;
      padding: 1.6rem 1.4rem;
      box-shadow: var(--shadow-sm);
      height: 100%;
      transition: var(--transition);
      position: relative;
      overflow: hidden;
      border: 1px solid rgba(191, 219, 254, 0.9);
    }

    .other-section-eyebrow {
    font-size: 0.8rem;
    text-transform: uppercase;
    letter-spacing: 0.18em;
    color: #0047B3;
    font-weight: 600;
    margin-bottom: 0.4rem;
    }
    .leather-process-grid-card::before {
      content: "";
      position: absolute;
      inset: 0;
      background:
        radial-gradient(circle at top left, rgba(102, 126, 234, 0.16), transparent 60%);
      opacity: 0;
      transition: opacity 0.25s ease;
    }
.leather-section-subtitle {
  color: #64748B;
}
.leather-section-title {
  color: #233267;
}
    .leather-process-grid-card:hover {
      transform: translateY(-3px);
      box-shadow: 0 12px 35px rgba(15, 23, 42, 0.12);
      border-color: rgba(102, 126, 234, 0.6);
    }

    .leather-process-grid-card:hover::before {
      opacity: 1;
    }

    .leather-process-step-number {
      width: 32px;
      height: 32px;
      border-radius: 999px;
      background: linear-gradient(135deg, var(--primary), var(--accent-color));
      color: #ffffff;
      display: inline-flex;
      align-items: center;
      justify-content: center;
      font-size: 0.8rem;
      font-weight: 700;
      margin-bottom: 0.55rem;
    }

    .leather-process-grid-card h3 {
      font-size: 1.02rem;
      font-weight: 600;
      margin-bottom: 0.35rem;
    }

    .leather-process-grid-card p {
      font-size: 0.92rem;
      color: #4B5563;
      margin-bottom: 0;
    }

    
    /* ================= WHY CHOOSE US ================= */

    .leather-why-section {
      background: #F8FAFC;
    }

    .leather-why-card {
      background: #ffffff;
      border-radius: 18px;
      padding: 1.7rem 1.4rem;
      box-shadow: 0 10px 30px rgba(15, 23, 42, 0.10);
      height: 100%;
      transition: all 0.3s ease;
      border: 1px solid rgba(209, 213, 219, 0.9);
    }

    .leather-why-card:hover {
      transform: translateY(-3px);
      box-shadow: 0 10px 30px rgba(15, 23, 42, 0.10);
      border-color: rgba(102, 126, 234, 0.45);
    }

    .leather-why-icon {
      width: 42px;
      height: 42px;
      border-radius: 999px;
      background: rgba(102, 126, 234, 0.12);
      display: inline-flex;
      align-items: center;
      justify-content: center;
      color: #0047B3;
      font-size: 1.15rem;
      margin-bottom: 0.7rem;
    }
.leather-why-icon img {
  width: 15px;
}
    .leather-why-card h3 {
      font-size: 1.02rem;
      font-weight: 600;
      margin-bottom: 0.35rem;
    }

    .leather-why-card p {
      font-size: 0.92rem;
      color: #4B5563;
      margin-bottom: 0;
    }


    /* === UPHOLSTERY Page === */


    /* ================= INTRO / SERVICE OVERVIEW ================= */

    .care-services {
      background: linear-gradient(180deg, #FFFFFF 0%, #F8FAFC 100%);
    }

    .other-service-card {
      background: #FFFFFF;
      border-radius: 24px;
      padding: 2.4rem 2.2rem;
      box-shadow: 0 6px 16px rgba(15, 23, 42, 0.06);
      margin-bottom: 2.4rem;
      position: relative;
      overflow: hidden;
      transition: all 0.3s ease;
      border: 1px solid rgba(148, 163, 184, 0.2);
    }

    .other-service-card::before {
      content: "";
      position: absolute;
      inset: 0;
      background:
        radial-gradient(circle at top left, rgba(102, 126, 234, 0.14), transparent 55%);
      opacity: 0;
      transition: opacity 0.3s ease;
      pointer-events: none;
    }

    .other-service-card:hover {
      transform: translateY(-4px);
      box-shadow: 0 12px 35px rgba(15, 23, 42, 0.12);
      border-color: rgba(102, 126, 234, 0.4);
    }

    .other-service-card:hover::before {
      opacity: 1;
    }

    .other-service-title {
      font-size: 1.8rem;
      font-weight: 700;
      margin-bottom: 0.5rem;
    }

    .other-service-body-text {
      font-size: 1rem;
      color: #4B5563;
      margin-bottom: 1.6rem;
    }

    .other-service-image-wrap {
      position: relative;
      max-width: 380px;
      margin: 0 auto;
    }

    .other-service-image-wrap img {
      border-radius: 24px;
      box-shadow: 0 12px 35px rgba(15, 23, 42, 0.12);
      width: 100%;
      display: block;
      filter: saturate(1.05) contrast(1.03);
    }

    .other-service-image-wrap::before {
      content: "";
      position: absolute;
      inset: 10%;
      border-radius: 30px;
      border: 1px solid rgba(148, 163, 184, 0.35);
      transform: rotate(-3deg);
      z-index: -1;
    }

    .other-service-badge-floating {
      position: absolute;
      bottom: -12px;
      left: 14px;
      background: rgba(15, 23, 42, 0.96);
      color: #E5E7EB;
      padding: 0.65rem 0.9rem;
      border-radius: 999px;
      font-size: 0.78rem;
      display: inline-flex;
      align-items: center;
      gap: 0.4rem;
      backdrop-filter: blur(8px);
      box-shadow: 0 12px 28px rgba(15, 23, 42, 0.7);
    }

    .other-service-badge-floating i {
      color: #00BBD4;
    }

    .other-service-overview-meta {
      display: flex;
      flex-wrap: wrap;
      gap: 1.5rem;
      margin-bottom: 1.3rem;
      position: relative;
      z-index: 1;
    }

    .other-service-overview-meta .meta-item {
      min-width: 150px;
    }

    .other-service-overview-meta .meta-label {
      display: block;
      font-size: 0.78rem;
      text-transform: uppercase;
      letter-spacing: 0.14em;
      color: #9CA3AF;
      margin-bottom: 0.2rem;
    }

    .other-service-overview-meta .meta-value {
      font-size: 0.96rem;
      font-weight: 600;
      color: #0047B3;
    }

    /* ================= PROCESS SECTION ================= */

    .other-process-section {
      background: #EFF6FF;
    }

    .other-process-section .section-eyebrow {
      color: #0066FF;
    }

    .other-process-grid-card {
      background: #ffffff;
      border-radius: 20px;
      padding: 1.6rem 1.4rem;
      box-shadow: var(--shadow-sm);
      height: 100%;
      transition: var(--transition);
      position: relative;
      overflow: hidden;
      border: 1px solid rgba(191, 219, 254, 0.9);
    }

    .other-process-grid-card::before {
      content: "";
      position: absolute;
      inset: 0;
      background:
        radial-gradient(circle at top left, rgba(102, 126, 234, 0.16), transparent 60%);
      opacity: 0;
      transition: opacity 0.25s ease;
    }

    .other-process-grid-card:hover {
      transform: translateY(-3px);
      box-shadow: 0 10px 30px rgba(15, 23, 42, 0.10);
      border-color: rgba(102, 126, 234, 0.6);
    }

    .other-process-grid-card:hover::before {
      opacity: 1;
    }

    .other-process-step-number {
      width: 32px;
      height: 32px;
      border-radius: 999px;
      background: linear-gradient(135deg, #0066FF, #00BBD4);
      color: #ffffff;
      display: inline-flex;
      align-items: center;
      justify-content: center;
      font-size: 0.8rem;
      font-weight: 700;
      margin-bottom: 0.55rem;
    }

    .other-process-grid-card h3 {
      font-size: 1.02rem;
      font-weight: 600;
      margin-bottom: 0.35rem;
    }

    .other-process-grid-card p {
      font-size: 0.92rem;
      color: #4B5563;
      margin-bottom: 0;
    }

    /* ================= BENEFITS SECTION ================= */

    .benefits-section {
      background: linear-gradient(180deg, #FFFFFF 0%, #F8FAFC 100%);
    }

    .benefit-card {
      background: #ffffff;
      border-radius: 18px;
      padding: 1.7rem 1.4rem;
      box-shadow: 0 6px 16px rgba(15, 23, 42, 0.06);
      height: 100%;
      transition: all 0.3s ease;
      border: 1px solid rgba(209, 213, 219, 0.9);
    }

    .benefit-card:hover {
      transform: translateY(-3px);
      box-shadow: 0 10px 30px rgba(15, 23, 42, 0.10);
      border-color: rgba(102, 126, 234, 0.45);
    }

    .benefit-icon {
      width: 42px;
      height: 42px;
      border-radius: 999px;
      background: rgba(102, 126, 234, 0.12);
      display: inline-flex;
      align-items: center;
      justify-content: center;
      color: #0066FF;
      font-size: 1.15rem;
      margin-bottom: 0.7rem;
    }
.benefit-icon img {
  width: 15px;
}
    .benefit-card h3 {
      font-size: 1.02rem;
      font-weight: 600;
      margin-bottom: 0.35rem;
    }

    .benefit-card p {
      font-size: 0.92rem;
      color: #4B5563;
      margin-bottom: 0;
    }

    /* === STEAM IRON === */
    
    .ironing-image-column {
      position: relative;
    }

    .ironing-hero-visual {
      position: relative;
      max-width: 420px;
      margin: 0 auto;
    }

    .ironing-hero-visual-main {
      position: relative;
      z-index: 2;
      border-radius: 12px;
      overflow: hidden;
      box-shadow: var(--shadow-md);
      border: 4px solid #FFFFFF;
    }

    .ironing-hero-visual-main img {
      width: 100%;
      height: auto;
      display: block;
      object-fit: cover;
    }

    /* Stylized image layout: circle + floating cards */
    .spa-image-column {
      position: relative;
    }

    .spa-hero-visual {
      position: relative;
      max-width: 420px;
      margin: 0 auto;
    }

    .spa-hero-visual-main {
      position: relative;
      z-index: 2;
      border-radius: 12px;
      overflow: hidden;
      box-shadow: var(--shadow-md);
      border: 4px solid #FFFFFF;
    }

    .spa-hero-visual-main img {
      width: 100%;
      height: auto;
      display: block;
      object-fit: cover;
    }

    .spa-hero-visual-ring {
      position: absolute;
      inset: -12px;
      border-radius: 12px;
      border: 1px dashed rgba(148, 163, 184, 0.55);
      z-index: 1;
    }

