/* Мир Паркета v2 / лендинг для архитекторов и дизайнеров */
/* Шапка: светлая, см. .mp-dhero--light в core.css (раньше: фото-баннер min-height 86vh с затемнением) */

/* Плюсы */
.mp-perklist{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:1fr;border-top:1px solid var(--mp-ink)}
.mp-perklist li{display:grid;grid-template-columns:3.2rem 1fr;gap:.35rem 1rem;padding:1.9rem 0;border-bottom:1px solid var(--mp-line)}
.mp-perk__n{grid-row:1/span 2;font:300 1.5rem/1 var(--mp-font-display);color:var(--mp-muted)}
.mp-perklist .mp-h3{font-size:1.55rem}
.mp-perklist p{grid-column:2;margin:.2rem 0 0;color:var(--mp-muted);font-weight:300;max-width:32em}
.mp-perklist p a{color:var(--mp-ink);border-bottom:1px solid var(--mp-line)}
@media (min-width:768px){
  .mp-perklist{grid-template-columns:repeat(2,1fr);column-gap:clamp(2rem,4vw,5rem)}
}
@media (min-width:1100px){
  .mp-perklist{grid-template-columns:repeat(3,1fr);border-top:0}
  .mp-perklist li{display:block;padding:2rem 0 2.5rem;border-top:1px solid var(--mp-ink);border-bottom:0}
  .mp-perk__n{display:block;margin-bottom:1.5rem}
}

/* Материалы */
.mp-dmat__grid{display:grid;grid-template-columns:1fr;gap:clamp(1.75rem,1rem + 2vw,2.5rem)}
@media (min-width:640px){.mp-dmat__grid{grid-template-columns:repeat(2,1fr)}}
@media (min-width:1100px){.mp-dmat__grid{grid-template-columns:repeat(4,1fr)}}
.mp-dmat__i{display:block;min-width:0}
.mp-dmat__t{display:block;margin-top:1rem;font:400 clamp(1.4rem,1.2rem + .6vw,1.75rem)/1.2 var(--mp-font-display);color:var(--mp-ink)}
.mp-dmat__d{display:block;margin-top:.35rem;font-size:.9375rem;color:var(--mp-muted);font-weight:300}

/* Процесс (тёмный) */
.mp-steps--dark li{border-color:rgba(255,255,255,.25)!important}
.mp-steps--dark .mp-steps__n{color:#a9a69d}
.mp-steps--dark .mp-h3{color:#fff}
.mp-steps--dark p{color:#b9b6ad}
@media (min-width:1024px){.mp-steps--dark li{border-top-color:rgba(255,255,255,.5)!important}}

/* Проекты */
.mp-dproj__grid{display:grid;grid-template-columns:repeat(2,1fr);gap:1.25rem}
@media (min-width:1024px){.mp-dproj__grid{grid-template-columns:repeat(4,1fr);gap:2rem}}
.mp-dproj__i{display:block;min-width:0}
.mp-dproj__i .mp-proj__name{font-size:1.15rem}
@media (max-width:520px){.mp-dproj__grid{grid-template-columns:1fr}}

/* Отзывы */
.mp-quotes__grid{display:grid;gap:2.5rem;grid-template-columns:1fr}
@media (min-width:1024px){.mp-quotes__grid{grid-template-columns:repeat(3,1fr);gap:3rem}}
.mp-quote{margin:0;display:flex;flex-direction:column;gap:1.5rem;padding-top:1.5rem;border-top:1px solid var(--mp-ink)}
.mp-quote blockquote{margin:0;font:300 clamp(1.25rem,1.1rem + .5vw,1.5rem)/1.5 var(--mp-font-display);color:var(--mp-ink)}
.mp-quote p{margin:0}
.mp-quote figcaption{font-size:.875rem;color:var(--mp-muted);line-height:1.6}
.mp-quote figcaption b{display:block;color:var(--mp-ink);font-weight:500}
.mp-quote figcaption a{display:inline-block;margin-top:.4rem;border-bottom:1px solid var(--mp-line)}

/* Заявка: сетка 5/7, слева условия и материалы на почту, справа форма */
.mp-apply__grid{display:grid;gap:var(--mp-s7)}
@media (min-width:1024px){.mp-apply__grid{grid-template-columns:minmax(0,5fr) minmax(0,7fr);column-gap:clamp(3rem,1rem + 4vw,6rem);align-items:start}}
.mp-apply__text .mp-h2{margin:0 0 var(--mp-s5)}
.mp-apply__text .mp-lead{color:#e0ddd5;font-size:clamp(1.0625rem,1rem + .3vw,1.1875rem)}
.mp-apply__text .mp-lead+.mp-lead{margin-top:var(--mp-s4)}
.mp-apply__extra{list-style:none;margin:var(--mp-s7) 0 0;padding:0;display:grid;gap:var(--mp-s3)}
.mp-mailcard{display:grid;grid-template-columns:2.75rem minmax(0,1fr) auto;align-items:center;gap:var(--mp-s4);min-height:4.75rem;padding:var(--mp-s4) var(--mp-s5);border:1px solid rgba(255,255,255,.14);color:#fff;transition:border-color .3s var(--mp-ease),background-color .3s var(--mp-ease)}
.mp-mailcard:hover,.mp-mailcard:focus-visible{border-color:var(--mp-gold);background:rgba(200,162,74,.06);color:#fff}
.mp-mailcard__ico{display:flex;align-items:center;justify-content:center;width:2.75rem;height:2.75rem;border:1px solid rgba(200,162,74,.55);color:var(--mp-gold)}
.mp-mailcard__ico svg{width:20px;height:20px}
.mp-mailcard__t{display:block;font:400 1rem/1.35 var(--mp-font-text);color:#fff}
.mp-mailcard__s{display:block;margin-top:.2rem;font-size:.8125rem;line-height:1.4;color:#a9a69d}
.mp-mailcard__go{width:18px;height:18px;color:#a9a69d;transition:transform .3s var(--mp-ease),color .3s}
.mp-mailcard:hover .mp-mailcard__go{transform:translateX(4px);color:var(--mp-gold)}
/* панель формы на тёмном фоне */
.mp-apply__form{padding:clamp(1.5rem,.75rem + 3vw,3rem);border:1px solid rgba(255,255,255,.12);background:#151514}
.mp-apply__form .mp-form{--f-bg:#151514}
.mp-apply__formh{margin:0 0 var(--mp-s5);font:400 .75rem/1.2 var(--mp-font-text);letter-spacing:.2em;text-transform:uppercase;color:#b9b6ad}
@media (max-width:639px){.mp-apply__form{margin:0 calc(var(--mp-gutter)*-.5)}}

/* Формы (на странице и в окнах); общий вид задаёт .mp-form в ux.css, отправка — /js/v2/d-forms.js */
.mp-dform__row{display:grid;grid-template-columns:1fr;column-gap:var(--mp-s5)}
@media (min-width:640px){.mp-dform__row{grid-template-columns:repeat(2,minmax(0,1fr))}.mp-dform__f--wide{grid-column:1/-1}}
.mp-dform__f{position:relative}

/* окна «Каталог» и «Проекты»: нативный <dialog> (.mp-dialog из ux.css) */
.mp-ask__hp{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}
dialog.mp-pop{width:min(36rem,calc(100vw - 2rem));max-width:none}
dialog.mp-pop .mp-dialog__in{padding:clamp(1.75rem,1rem + 3vw,3.5rem)}
dialog.mp-pop h2{padding-right:2.5rem}
.mp-pop{max-width:34rem;color:var(--mp-ink-2)}
.mp-pop h2{margin:0 0 .75rem;font:300 clamp(1.75rem,1.4rem + 1.2vw,2.5rem)/1.1 var(--mp-font-display);color:var(--mp-ink);text-align:left;width:auto}
.mp-pop p{margin:0 0 1rem;font-weight:300}
.mp-pop .mp-dform{color:var(--mp-ink)}
.mp-pop .mp-dform .mp-btn{background:var(--mp-ink);border-color:var(--mp-ink);color:#fff!important}
.mp-pop .mp-dform .mp-btn:hover{background:#000;border-color:#000;color:var(--mp-gold)!important}
.mp-pop .mp-btn{width:auto;margin-top:.75rem}
.mp-pop .mp-dform .mp-btn{margin-top:0}
.mp-pop .mp-form__done{margin-top:var(--mp-s4)}