/* ============ ОДНА КАРТОЧКА В РЯД ============ */
.masterclasses-grid{
  display:flex;
  flex-direction:column;
  gap:34px;
  max-width:1180px;
  margin:0 auto;
}

.masterclass-card{
  position:relative;
  display:grid;
  grid-template-columns:auto 1fr;   /* ширина фото — по натуральной ширине */
  gap:0;
  background:linear-gradient(135deg,rgba(201,162,94,.07) 0%,rgba(201,162,94,.015) 100%);
  border:1px solid rgba(201,162,94,.22);
  overflow:hidden;
  transition:border-color .5s ease, box-shadow .5s ease, transform .5s ease;
}
.masterclass-card::before{
  content:'';position:absolute;
  top:0;left:0;right:0;height:2px;
  background:var(--gold-grad);
  transform:scaleX(0);
  transform-origin:left;
  transition:transform .5s cubic-bezier(.4,0,.2,1);
  z-index:3;
}
.masterclass-card:hover{
  border-color:rgba(201,162,94,.6);
  transform:translateY(-4px);
  box-shadow:0 22px 50px rgba(0,0,0,.5);
}
.masterclass-card:hover::before{transform:scaleX(1)}

/* ============================================================
   ФОТО — вертикальное, видно ЦЕЛИКОМ.
   Никакой обрезки: картинка сохраняет свои пропорции,
   высота карточки автоматически подстраивается.
   ============================================================ */
.masterclass-image{
  position:relative;
  background:#0a0d0e;
  overflow:hidden;
  display:flex;
  align-items:stretch;
  max-width:380px;          /* ограничиваем ширину, чтобы вертикальное фото не было слишком широким */
}
.masterclass-image img{
  width:100%;
  height:100%;
  max-height:640px;         /* мягкий лимит по высоте, чтобы очень длинные фото не растягивали карточку бесконечно */
  object-fit:contain;       /* НЕ режем — сохраняем пропорции */
  object-position:center;
  display:block;
  transition:transform 1.2s cubic-bezier(.2,.8,.2,1);
  background:#0a0d0e;
}
.masterclass-card:hover .masterclass-image img{transform:scale(1.02)}

.masterclass-info{
  padding:44px 46px 40px;
  display:flex;
  flex-direction:column;
  position:relative;
  min-width:0;
}

.masterclass-info .num{
  font-family:'Cormorant Garamond',serif;
  font-size:46px;
  line-height:1;
  background:var(--gold-text);
  -webkit-background-clip:text;background-clip:text;
  -webkit-text-fill-color:transparent;
  letter-spacing:1px;
  margin-bottom:12px;
  font-weight:500;
}

.masterclass-info h3{
  font-family:'Cormorant Garamond',serif;
  font-size:30px;
  color:#fff;
  font-weight:500;
  letter-spacing:1px;
  line-height:1.18;
  margin-bottom:6px;
}
.masterclass-info h3::after{
  content:'';display:block;
  width:44px;height:1px;
  background:var(--gold);
  margin-top:16px;
  transition:width .5s ease;
}
.masterclass-card:hover .masterclass-info h3::after{width:76px}

.masterclass-info .subtitle{
  font-family:'Cormorant Garamond',serif;
  font-size:17px;
  font-style:italic;
  color:var(--gold-light);
  letter-spacing:.4px;
  margin-bottom:20px;
  display:block;
}

.masterclass-info .lead{
  font-size:16px;
  line-height:1.75;
  color:#fff;
  margin-bottom:22px;
  font-weight:300;
}
.masterclass-info .lead strong{color:var(--gold-light);font-weight:500}

.masterclass-block-title{
  font-family:'Jost',sans-serif;
  font-size:11px;
  letter-spacing:4px;
  text-transform:uppercase;
  color:var(--gold);
  margin-bottom:14px;
  font-weight:500;
  display:block;
}

.masterclass-list{
  list-style:none;
  margin:0 0 22px;
  padding:0;
}
.masterclass-list li{
  position:relative;
  padding:8px 0 8px 26px;
  font-size:15.5px;
  line-height:1.7;
  color:rgba(255,255,255,.92);
  font-weight:300;
}
.masterclass-list li::before{
  content:'';position:absolute;
  left:0;top:17px;
  width:8px;height:8px;
  background:var(--gold);
  transform:rotate(45deg);
  box-shadow:0 0 10px rgba(201,162,94,.8);
}
.masterclass-list li strong{color:var(--gold-light);font-weight:500}

.masterclass-ideal{
  font-size:15px;
  line-height:1.8;
  color:rgba(255,255,255,.85);
  margin-bottom:22px;
  font-weight:300;
}
.masterclass-ideal strong{
  color:var(--gold);
  font-weight:500;
  letter-spacing:.5px;
}

.masterclass-meta{
  margin-top:auto;
  padding-top:22px;
  border-top:1px solid rgba(201,162,94,.2);
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:12px 26px;
}
.masterclass-meta .row-item{
  display:flex;
  align-items:flex-start;
  gap:12px;
  font-family:'Jost',sans-serif;
  font-size:14px;
  color:#fff;
  line-height:1.5;
}
.masterclass-meta .row-item .icon{
  flex-shrink:0;
  width:18px;
  height:18px;
  color:var(--gold);
  margin-top:2px;
}
.masterclass-meta .row-item a{
  color:#fff;
  border-bottom:1px solid rgba(201,162,94,.35);
  transition:color .35s ease,border-color .35s ease;
}
.masterclass-meta .row-item a:hover{
  color:var(--gold-light);
  border-color:var(--gold-light);
}
.masterclass-meta .row-item strong{
  color:var(--gold-light);
  font-weight:500;
  letter-spacing:.4px;
}

.masterclass-cta{
  margin-top:26px;
  align-self:flex-start;
  display:inline-flex;
  align-items:center;
  gap:14px;
  padding:15px 38px;
  border:1px solid var(--gold);
  color:var(--gold);
  background:transparent;
  font-family:'Jost',sans-serif;
  font-size:11px;
  font-weight:500;
  letter-spacing:4px;
  text-transform:uppercase;
  text-decoration:none;
  position:relative;
  overflow:hidden;
  transition:color .5s ease,border-color .5s ease;
  cursor:pointer;
}
.masterclass-cta::before{
  content:'';position:absolute;inset:0;
  background:var(--gold-grad);
  transform:translateX(-101%);
  transition:transform .55s cubic-bezier(.4,0,.2,1);
  z-index:0;
}
.masterclass-cta:hover{color:#0a0e10;border-color:transparent}
.masterclass-cta:hover::before{transform:translateX(0)}
.masterclass-cta span{position:relative;z-index:2}

/* ============ ПЛАНШЕТ ============ */
@media (max-width:1180px){
  .masterclass-image{max-width:320px}
  .masterclass-image img{max-height:560px}
  .masterclass-info{padding:36px 34px 34px}
  .masterclass-info h3{font-size:26px}
  .masterclass-info .num{font-size:38px}
}

/* ============ МОБИЛЬНАЯ — фото СВЕРХУ во всю ширину ============ */
@media (max-width:940px){
  .masterclasses-grid{gap:26px}
  .masterclass-card{
    grid-template-columns:1fr;
  }
  .masterclass-image{
    max-width:100%;
    width:100%;
  }
  .masterclass-image img{
    width:100%;
    height:auto;            /* натуральная высота */
    max-height:none;        /* без ограничения — фото видно целиком */
    object-fit:contain;
  }
  .masterclass-info{padding:26px 24px 28px}
  .masterclass-info .num{font-size:34px;margin-bottom:8px}
  .masterclass-info h3{font-size:22px}
  .masterclass-info .subtitle{font-size:15.5px;margin-bottom:16px}
  .masterclass-info .lead{font-size:15.5px;margin-bottom:18px}
  .masterclass-list li{font-size:15px;padding:7px 0 7px 24px}
  .masterclass-list li::before{width:7px;height:7px;top:16px}
  .masterclass-ideal{font-size:14.5px;margin-bottom:18px}
  .masterclass-meta{grid-template-columns:1fr;gap:10px}
  .masterclass-meta .row-item{font-size:13.5px}
  .masterclass-cta{padding:13px 28px;font-size:10.5px;letter-spacing:3px;align-self:stretch;justify-content:center}
}

@media (max-width:480px){
  .masterclass-info{padding:22px 18px 24px}
  .masterclass-info h3{font-size:20px}
  .masterclass-info .num{font-size:30px}
  .masterclass-info .lead{font-size:15px}
  .masterclass-list li{font-size:14.5px}
}