.coatings{margin-top:48px;scroll-margin-top:var(--header-offset,160px)}
.coatings h3,.coatings p,.coatings figure{margin:0}
.coatings .mp-title{margin:0;font:600 clamp(25px,3vw,38px)/1.18 'Unbounded',sans-serif;letter-spacing:-.03em}
.coatings .mp-intro{margin:16px 0 28px;color:#5b616a;font-size:18px;line-height:1.5}
.coatings .mp-coats{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:24px}
.coatings .mp-coat{min-width:0;display:flex;flex-direction:column;overflow:hidden;border:2px solid #e3e5e9;border-radius:24px}
.coatings .mp-sample{position:relative;height:clamp(240px,25vw,340px);background:#f4f5f7}
.coatings img{display:block;width:100%;height:100%;object-fit:cover}
.coatings figcaption{position:absolute;bottom:16px;left:16px;max-width:calc(100% - 32px);padding:8px 10px;border-radius:8px;background:#141619db;color:#fff;font-size:13px;line-height:1.3}
.coatings .mp-description{padding:24px 24px 20px}
.coatings h3{font:600 25px/1.25 'Onest',sans-serif}
.coatings .mp-description p{margin-top:8px;color:#5b616a;line-height:1.5}
.coatings .mp-action{min-height:50px;display:flex;align-items:center;justify-content:space-between;gap:16px;padding:12px 18px;border:0;border-radius:12px;background:#ffc917;color:#141619;text-align:left;font:600 16px/1.35 'Onest',sans-serif;cursor:pointer}
.coatings .mp-action .icon{width:20px;height:20px;flex-shrink:0}
.coatings .mp-action:hover{background:#f1bd09}
.coatings .mp-coat>.mp-action{margin:auto 24px 24px}
.coatings .mp-pural{margin-top:20px;display:flex;align-items:center;gap:24px;padding:24px;border-radius:20px;background:#f4f5f7}
.coatings .mp-pural-top{flex-shrink:0}
.coatings .mp-pural-tag{display:block;margin-top:6px;color:#5b616a;font-size:13px}
.coatings .mp-pural p{flex:1;color:#5b616a;line-height:1.5}
.coatings .mp-pural .mp-action{background:#fff;border:1px solid #d4d7dc}
.coatings .mp-pattern{margin-top:36px}
.coatings .mp-pattern-head{display:flex;justify-content:space-between;align-items:center;gap:16px;margin-bottom:16px}
.coatings .mp-pattern-head>span{font-size:14px;color:#5b616a}
.coatings .mp-pattern-choices{display:flex;gap:10px;margin-bottom:12px}
.coatings .mp-pattern-choice{min-height:46px;min-width:160px;padding:10px 20px;border:2px solid #e3e5e9;border-radius:12px;background:#fff;color:#141619;font:600 16px/1.3 'Onest',sans-serif;cursor:pointer}
.coatings .mp-pattern-choice[aria-pressed=true]{background:#141619;border-color:#141619;color:#fff}
.coatings .mp-pattern-image{position:relative;height:clamp(240px,30vw,360px);overflow:hidden;border-radius:20px;background:#f4f5f7}
.coatings .mp-pattern-image figcaption{background:#fff;color:#141619}
.coatings .mp-pattern>.mp-action{width:100%;margin-top:12px;background:#f4f5f7}
.coatings .mp-samples{margin-top:32px;padding:28px;display:grid;grid-template-columns:1fr auto;gap:10px 32px;border-radius:24px;background:#141619;color:#fff;align-items:center}
.coatings .mp-samples p{color:#d5d9de;line-height:1.5;grid-column:1}
.coatings .mp-samples .mp-action{grid-column:2;grid-row:1/3}
@media(max-width:700px){
  .coatings{margin-top:36px}
  .coatings .mp-intro{font-size:16px;margin-bottom:20px}
  .coatings .mp-coats{grid-template-columns:1fr;gap:16px}
  .coatings .mp-sample{height:220px}
  .coatings .mp-description{padding:18px 18px 16px}
  .coatings .mp-coat>.mp-action{margin: auto 18px 18px}
  .coatings .mp-action{font-size:15px}
  .coatings .mp-pural{flex-direction:column;align-items:stretch;gap:14px;padding:20px}
  .coatings .mp-pattern-head{align-items:baseline;flex-wrap:wrap;gap:6px}
  .coatings .mp-pattern-choice{min-width:0;flex:1;padding:10px}
  .coatings .mp-pattern-image{height:240px}
  .coatings .mp-samples{display:flex;flex-direction:column;align-items:stretch;gap:14px;padding:22px}
}
