﻿/* Single Class only: shared tokens, no checkout or site-shell overrides. */
.dj-class-single{ --single-radius: var(--dj-radius-lg,28px); max-width: 1180px; margin-inline: auto; padding: clamp(.8rem,2.5vw,1.8rem); color: #fff;}
.dj-class-single *{ box-sizing: border-box;}
.dj-class-single :is(.dj-class-hero,.dj-class-facts,.dj-class-order,.dj-class-private,.dj-class-prerequisites){ min-width: 0; border: 1px solid rgba(49,207,255,.45); border-radius: var(--single-radius); background: radial-gradient(ellipse at top left,rgba(49,207,255,.09),transparent 60%),linear-gradient(140deg,rgba(16,39,112,.85),rgba(27,3,56,.96)); box-shadow: inset 0 1px rgba(255,255,255,.12),0 6px 18px rgba(7,4,30,.15);}
.dj-class-single .dj-class-hero{ display: grid; grid-template-columns: minmax(0,1.35fr) minmax(0,1fr); align-items: center; gap: 1.2rem; min-height: 0; padding: 1rem; margin-bottom: 1.1rem; overflow: hidden;}
.dj-class-single .dj-class-hero > div:first-child{ min-width: 0; padding: .7rem;}
.dj-class-single .dj-class-hero h1{ margin: .7rem 0 1rem; font-size: clamp(1.45rem,3vw,2.4rem); line-height: 1.5; overflow-wrap: anywhere;}
.dj-class-single .dj-class-hero__art{ min-height: 0; height: auto; border-radius: calc(var(--single-radius) - 8px); overflow: hidden; border: 1px solid rgba(49,207,255,.2);}
.dj-class-single .dj-class-hero__art img{ display: block; width: 100%; height: auto; max-height: 270px; object-fit: contain; border-radius: inherit;}
.dj-class-single .dj-class-hero .dj-landing-card__badge{ display: inline-flex; padding: .2rem .8rem; border: 1px solid #9c6fe2; border-radius: 999px; background: linear-gradient(145deg,#7433b0,#4a247e); font-size: .8rem;}
.dj-class-single .dj-class-back{ display: inline-flex; align-items: center; justify-content: center; gap: .6rem; min-height: 44px; max-width: 100%; padding: .55rem 1rem; color: #e5f8ff; border: 1px solid #31cfff; border-radius: var(--dj-radius-md,18px); background: rgba(16,39,112,.4); text-decoration: none; font-size: .9rem; white-space: normal;}
.dj-class-single .dj-class-back svg{ flex: 0 0 18px;}
.dj-class-single a:focus-visible{ outline: 3px solid #31cfff; outline-offset: 4px;}
.dj-class-single .dj-class-back:hover{ background: rgba(49,207,255,.12);}
.dj-class-single .dj-class-layout{ display: grid; grid-template-columns: minmax(0,2fr) minmax(0,1fr); gap: 1rem; align-items: stretch; margin: 0;}
.dj-class-single :is(.dj-class-facts,.dj-class-order,.dj-class-private,.dj-class-prerequisites){ padding: clamp(1rem,2vw,1.4rem);}
.dj-class-single .dj-class-order{ position: static; align-self: stretch; display: flex; flex-direction: column; justify-content: center; text-align: center;}
.dj-class-single h2{ margin: 0 0 .85rem; color: #fff; font-size: 1.15rem;}
.dj-class-single .dj-class-order__price{ gap: .4rem; margin: .7rem 0; padding: 0; background: none;}
.dj-class-single .dj-class-order__price small{ color: #c7d4ef; line-height: 1.8;}
.dj-class-single .dj-class-order__price strong{ font-size: clamp(1.25rem,2vw,1.6rem); overflow-wrap: anywhere;}
.dj-class-single .dj-class-order__action{ margin: .75rem 0 0;}
.dj-class-single .dj-class-order .dj-class-cta{ min-height: 46px; border: 1px solid rgba(255,113,170,.6); border-radius: var(--dj-radius-md,18px); color: #fff; background: linear-gradient(145deg,#ed409d,#9824b0); box-shadow: inset 0 1px rgba(255,255,255,.24),0 3px #53206e;}
.dj-class-single .dj-class-order a.dj-class-cta:hover{ background: linear-gradient(145deg,#ff58ae,#ac35c2);}
.dj-class-single .dj-class-order a.dj-class-cta:active{ transform: translateY(2px); box-shadow: inset 0 1px rgba(255,255,255,.2);}
.dj-class-single .dj-class-order .dj-class-cta--disabled{ background: #39304e; border-color: #655879; box-shadow: none; color: #d7cce3;}
.dj-class-single .dj-class-facts__rows{ display: grid; gap: .7rem;}
.dj-class-single .dj-class-facts dl{ display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: .7rem; margin: 0;}
.dj-class-single .dj-class-facts dl div{ min-width: 0; padding: .7rem .9rem; border: 1px solid rgba(124,143,228,.2); border-radius: var(--dj-radius-md,18px); background: linear-gradient(145deg,rgba(38,70,137,.38),rgba(35,23,73,.4));}
.dj-class-single .dj-class-facts dt{ color: #c7d4ef; font-size: .8rem;}
.dj-class-single .dj-class-facts dd{ font-size: .95rem; line-height: 1.7; overflow-wrap: anywhere;}
.dj-class-single .dj-class-facts__schedule{ display: grid; gap: .7rem;}
.dj-class-single :is(.dj-class-private,.dj-class-prerequisites){ display: block; margin-top: 1rem;}
.dj-class-single .dj-class-private .dj-class-private__links{ display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: .8rem;}
.dj-class-single .dj-class-private a{ display: flex; flex-direction: column; justify-content: center; gap: .3rem; min-height: 64px; text-align: center;}
.dj-class-single .dj-class-private a span{ font-size: .8rem; line-height: 1.7; color: #d5e4fa;}
.dj-class-single .dj-class-private a:hover{ background: rgba(49,207,255,.15);}
.dj-class-single .dj-class-prerequisites__list{ display: grid; gap: .8rem;}
.dj-class-single .dj-class-layout > .dj-class-order{ grid-column: 2; grid-row: 1;}
.dj-class-single .dj-class-layout > .dj-class-facts{ grid-column: 1; grid-row: 1;}
@media (max-width: 900px){ .dj-class-single .dj-class-layout{ grid-template-columns: minmax(0,1fr);} .dj-class-single .dj-class-layout > :is(.dj-class-order,.dj-class-facts){ grid-column: auto; grid-row: auto;} }
@media (max-width: 620px){
    .dj-class-single .dj-class-hero{ grid-template-columns: minmax(0,1fr); gap: .4rem; padding: .7rem;}
    .dj-class-single .dj-class-hero__art{ grid-row: 1;}
    .dj-class-single .dj-class-hero__art img{ max-height: 180px;}
    .dj-class-single .dj-class-hero > div:first-child{ padding: .4rem;}
    .dj-class-single .dj-class-hero h1{ margin: .5rem 0 .7rem;}
    .dj-class-single .dj-class-back{ width: 100%; font-size: .8rem;}
    .dj-class-single .dj-class-facts dl, .dj-class-single .dj-class-private .dj-class-private__links{ grid-template-columns: minmax(0,1fr);}
    .dj-class-single .dj-class-order{ padding: .9rem;}
}

.dj-class-single .dj-class-layout>.dj-class-access{align-self:start;justify-content:flex-start}
