/* ============ ОРГАНИЗМ · /masters ============ */

/* — 1. Интро — */
.intro{padding:var(--sp-8) 0 var(--sp-16);}
.intro-title{margin-top:var(--sp-6);}
.intro-lead{max-width:640px;margin-top:var(--sp-6);}

/* — 2. Сетка мастеров — */
.masters{background:var(--surface);padding:var(--sp-24) 0;}
.mgrid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:var(--sp-6);align-items:stretch;}
.mcard{background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);
  overflow:hidden;display:flex;flex-direction:column;height:100%;transition:box-shadow .2s;}
.mcard:hover{box-shadow:var(--shadow-sm);}
.mcard-photo{aspect-ratio:3/4;overflow:hidden;background:var(--surface-2);}
.mcard-photo img{display:block;width:100%;height:100%;object-fit:cover;transition:transform .3s ease;}
.mcard:hover .mcard-photo img{transform:scale(1.02);}
.mcard-body{padding:var(--sp-6);display:flex;flex-direction:column;gap:var(--sp-2);flex:1;min-width:0;}
.mcard-desc{flex:1;}
.mcard-btn{width:100%;margin-top:var(--sp-4);}
/* Правило «один жёлтый в поле зрения»: пять карточек — пять кнопок, поэтому
   в покое они .btn-secondary, а жёлтой становится только карточка под курсором
   или с фокусом внутри. */
.mgrid.is-hover-accent .mcard:hover .mcard-btn,
.mgrid.is-hover-accent .mcard:focus-within .mcard-btn{
  background:var(--accent);border-color:var(--accent);color:var(--accent-ink);}
.mgrid.is-hover-accent .mcard:hover .mcard-btn:active{background:var(--accent-dark);border-color:var(--accent-dark);}

/* — 3. Полоса доверия — */
.trust{background:var(--surface-dark);min-height:280px;
  display:flex;flex-direction:column;align-items:center;justify-content:center;
  text-align:center;gap:var(--sp-6);padding:var(--sp-16) var(--gutter);}
.trust .h2{color:#FFFFFF;}
.trust .body{color:#FFFFFF;opacity:.75;}

/* — 4. Промо-CTA — */
.pick{background:var(--surface);padding:var(--sp-24) var(--gutter);display:flex;flex-direction:column;
  align-items:center;text-align:center;gap:var(--sp-6);}
.pick .h2{max-width:24ch;text-wrap:balance;}
.pick .body{max-width:52ch;}

/* ============ Tablet 768–1279 ============ */
@media (max-width:1279px){
  .masters{padding:var(--sp-16) 0;}
  .mgrid{grid-template-columns:repeat(2,minmax(0,1fr));}
  .pick{padding:var(--sp-16) var(--gutter);}
}
/* ============ Mobile <768 ============ */
@media (max-width:767px){
  .intro{padding:var(--sp-6) 0 var(--sp-12);}
  .masters{padding:var(--sp-12) 0;}
  .mgrid{grid-template-columns:1fr;gap:var(--sp-4);}
  .trust{min-height:0;padding:var(--sp-12) var(--gutter);}
  .trust .btn{width:100%;}
  .pick{padding:var(--sp-12) var(--gutter);}
  .pick .btn{width:100%;}
}
/* Тач-устройства: ховера нет — жёлтой кнопка становится только при фокусе */
@media (hover:none){
  .mgrid.is-hover-accent .mcard:hover .mcard-btn{background:var(--surface);border-color:var(--line-2);color:var(--ink);}
}