.masterclasses { 
  position: relative;
  overflow: hidden;
  isolation: isolate;
  background:
    linear-gradient(118deg, rgba(255, 243, 220, 0.34) 0%, rgba(255, 243, 220, 0.08) 28%, transparent 52%),
    linear-gradient(145deg, rgba(240, 232, 221, 0.96) 0%, rgba(232, 222, 210, 0.94) 100%);
  padding: 120px 0; 
  box-shadow: inset 0 20px 40px rgba(51,43,37,0.1), inset 0 -20px 40px rgba(51,43,37,0.1);
}

.masterclasses::before,
.masterclasses::after {
  content: '';
  position: absolute;
  pointer-events: none;
  z-index: 0;
}

.masterclasses::before {
  inset: -4% 10% auto 28%;
  height: 76%;
  background:
    linear-gradient(112deg, transparent 0%, rgba(255, 243, 220, 0.14) 24%, rgba(var(--accent-rgb), 0.11) 42%, transparent 68%);
  filter: blur(16px);
  animation: lightSweep 20s ease-in-out infinite;
}

.masterclasses::after {
  width: clamp(220px, 24vw, 360px);
  height: clamp(220px, 24vw, 360px);
  left: -3%;
  bottom: 4%;
  background:
    radial-gradient(circle at 50% 50%, rgba(var(--accent-rgb), 0.12), transparent 60%),
    url('../../public/images/ornaments/stone-fragment.svg') center/70% no-repeat;
  opacity: 0.14;
  mix-blend-mode: multiply;
  --float-tilt: -10deg;
  animation: stoneFragmentDrift 22s ease-in-out infinite;
}

.class-card {
  display: grid; grid-template-columns: 1fr;
  /* Massive carved stone block */
  box-shadow: var(--shadow-carved-out);
  border-radius: var(--radius-xl);
  overflow: hidden;
}
@media(min-width: 900px) { .class-card { grid-template-columns: 1.1fr 1fr; } }

.cc-content { padding: 60px 48px; background: var(--bg); }

.cc-visual { 
  border-left: 2px solid var(--border); 
  min-height: 400px; display: flex; 
  align-items: center; justify-content: center; 
  background: var(--surface2); 
  /* Chiseled inward */
  box-shadow: var(--shadow-carved-in);
}

@media(max-width: 899px) {
  .cc-visual {
    border-left: none;
    border-top: 1px solid var(--border);
    min-height: 320px;
  }
}