/* TAIGA glued-panel mobile profile-grid refinement — 2026-09-07 v7
 * Loaded after panel-mobile-v5.css. The detailed profile catalogue becomes a
 * compact 2x2 choice grid with one shared detail panel below it.
 */

@media (max-width:900px){
  body[data-taiga-smart-product="kleenaya-imitatsiya-brusa"] #profiles{
    scroll-margin-top:86px!important;
  }
  body[data-taiga-smart-product="kleenaya-imitatsiya-brusa"] #profiles .section-head{
    margin-bottom:16px!important;
  }
  body[data-taiga-smart-product="kleenaya-imitatsiya-brusa"] #profiles .section-head h2{
    font-size:clamp(28px,8.4vw,38px)!important;
    line-height:.94!important;
    letter-spacing:-.045em!important;
  }
  body[data-taiga-smart-product="kleenaya-imitatsiya-brusa"] #profiles .section-head p{
    max-width:31em!important;
    font-size:12px!important;
    line-height:1.38!important;
  }

  /* Detailed catalogue: same 2x2 mental model as the quick selector. */
  body[data-taiga-smart-product="kleenaya-imitatsiya-brusa"] #profiles .profile-showcase-grid{
    display:grid!important;
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
    gap:10px!important;
    align-items:stretch!important;
  }
  body[data-taiga-smart-product="kleenaya-imitatsiya-brusa"] #profiles .profile-showcase-card{
    display:grid!important;
    grid-template-rows:auto 92px auto auto!important;
    align-content:start!important;
    width:100%!important;
    min-width:0!important;
    min-height:0!important;
    height:auto!important;
    padding:9px!important;
    overflow:hidden!important;
    border-radius:16px!important;
    background:#fbfaf6!important;
    color:#24362f!important;
    border:1px solid rgba(36,54,47,.14)!important;
    box-shadow:none!important;
    cursor:pointer!important;
    transition:border-color .18s ease,box-shadow .18s ease,transform .18s ease!important;
  }
  body[data-taiga-smart-product="kleenaya-imitatsiya-brusa"] #profiles .profile-showcase-card.is-mobile-selected{
    border-color:#24362f!important;
    box-shadow:inset 0 -4px 0 #c5a66f!important;
  }
  body[data-taiga-smart-product="kleenaya-imitatsiya-brusa"] #profiles .profile-showcase-card:active{
    transform:scale(.99)!important;
  }
  body[data-taiga-smart-product="kleenaya-imitatsiya-brusa"] #profiles .profile-showcase-head{
    display:flex!important;
    align-items:center!important;
    justify-content:space-between!important;
    gap:5px!important;
    min-width:0!important;
    margin:0 0 7px!important;
  }
  body[data-taiga-smart-product="kleenaya-imitatsiya-brusa"] #profiles .profile-showcase-head small{
    min-width:0!important;
    overflow:hidden!important;
    text-overflow:ellipsis!important;
    white-space:nowrap!important;
    font-size:7px!important;
    letter-spacing:.11em!important;
    color:#67736d!important;
  }
  body[data-taiga-smart-product="kleenaya-imitatsiya-brusa"] #profiles .profile-showcase-head span{
    flex:0 0 auto!important;
    padding:4px 6px!important;
    font-size:6.8px!important;
    line-height:1!important;
    color:#66736c!important;
    background:#f4f3ee!important;
    border:1px solid rgba(36,54,47,.13)!important;
    border-radius:999px!important;
  }
  body[data-taiga-smart-product="kleenaya-imitatsiya-brusa"] #profiles .profile-showcase-diagram{
    position:relative!important;
    width:100%!important;
    height:92px!important;
    min-height:92px!important;
    margin:0 0 9px!important;
    overflow:hidden!important;
    border-radius:12px!important;
    background:#24362f!important;
  }
  body[data-taiga-smart-product="kleenaya-imitatsiya-brusa"] #profiles .profile-showcase-diagram img{
    width:100%!important;
    height:100%!important;
    object-fit:contain!important;
    transform:scale(1.58)!important;
  }
  body[data-taiga-smart-product="kleenaya-imitatsiya-brusa"] #profiles .profile-showcase-card h3{
    min-width:0!important;
    min-height:32px!important;
    margin:0 0 6px!important;
    overflow:visible!important;
    overflow-wrap:anywhere!important;
    font-size:16px!important;
    line-height:1!important;
    letter-spacing:-.035em!important;
    color:#24362f!important;
  }
  body[data-taiga-smart-product="kleenaya-imitatsiya-brusa"] #profiles .profile-showcase-card>p,
  body[data-taiga-smart-product="kleenaya-imitatsiya-brusa"] #profiles .profile-tags{
    display:none!important;
  }
  body[data-taiga-smart-product="kleenaya-imitatsiya-brusa"] #profiles .profile-showcase-action{
    width:100%!important;
    min-width:0!important;
    min-height:31px!important;
    margin:0!important;
    padding:7px 0 0!important;
    display:flex!important;
    align-items:center!important;
    justify-content:space-between!important;
    gap:6px!important;
    overflow:visible!important;
    border:0!important;
    border-top:1px solid rgba(36,54,47,.14)!important;
    border-radius:0!important;
    background:transparent!important;
    color:#24362f!important;
    font-size:9px!important;
    font-weight:850!important;
    line-height:1!important;
    white-space:nowrap!important;
    text-align:left!important;
  }
  body[data-taiga-smart-product="kleenaya-imitatsiya-brusa"] #profiles .profile-showcase-action b{
    flex:0 0 auto!important;
    font-size:14px!important;
  }

  /* Individual profile: equal-size fourth choice, not a tall blueprint card. */
  body[data-taiga-smart-product="kleenaya-imitatsiya-brusa"] #profiles .profile-showcase-card.custom{
    background:#edf2ed!important;
    border:1px dashed rgba(36,54,47,.34)!important;
    color:#24362f!important;
  }
  body[data-taiga-smart-product="kleenaya-imitatsiya-brusa"] #profiles .profile-showcase-card.custom.is-mobile-selected{
    border-style:solid!important;
    border-color:#24362f!important;
  }
  body[data-taiga-smart-product="kleenaya-imitatsiya-brusa"] #profiles .profile-showcase-card.custom .profile-showcase-diagram{
    display:grid!important;
    place-items:center!important;
    background:#e5ece6!important;
    box-shadow:inset 0 0 0 1px rgba(36,54,47,.07)!important;
  }
  body[data-taiga-smart-product="kleenaya-imitatsiya-brusa"] #profiles .profile-showcase-card.custom .profile-showcase-diagram img{
    display:none!important;
  }
  body[data-taiga-smart-product="kleenaya-imitatsiya-brusa"] #profiles .profile-showcase-card.custom .profile-showcase-diagram::before{
    content:""!important;
    width:34px!important;
    height:42px!important;
    border:1.5px solid #24362f!important;
    border-radius:7px!important;
    background:
      linear-gradient(#24362f,#24362f) 9px 13px/16px 1px no-repeat,
      linear-gradient(#24362f,#24362f) 9px 20px/13px 1px no-repeat,
      linear-gradient(#24362f,#24362f) 9px 27px/16px 1px no-repeat,
      #f9f7f1!important;
    box-shadow:4px 4px 0 rgba(36,54,47,.12)!important;
  }
  body[data-taiga-smart-product="kleenaya-imitatsiya-brusa"] #profiles .profile-showcase-card.custom .profile-showcase-diagram::after{
    content:"↑"!important;
    position:absolute!important;
    right:18px!important;
    bottom:15px!important;
    width:22px!important;
    height:22px!important;
    display:grid!important;
    place-items:center!important;
    border-radius:50%!important;
    background:#24362f!important;
    color:#fff!important;
    font-size:13px!important;
    font-weight:900!important;
  }
  body[data-taiga-smart-product="kleenaya-imitatsiya-brusa"] #profiles .profile-showcase-card.custom .profile-showcase-action{
    min-height:31px!important;
    margin:0!important;
    padding:7px 0 0!important;
    border:0!important;
    border-top:1px solid rgba(36,54,47,.18)!important;
    border-radius:0!important;
    background:transparent!important;
    color:#24362f!important;
  }
  body[data-taiga-smart-product="kleenaya-imitatsiya-brusa"] #profiles .profile-showcase-card.custom .profile-showcase-action b{
    width:auto!important;
    height:auto!important;
    min-width:0!important;
    border:0!important;
    font-size:14px!important;
    line-height:1!important;
  }
  body[data-taiga-smart-product="kleenaya-imitatsiya-brusa"] #profiles .profile-showcase-card.custom .profile-showcase-action b::before,
  body[data-taiga-smart-product="kleenaya-imitatsiya-brusa"] #profiles .profile-showcase-card.custom .profile-showcase-action b::after{
    content:none!important;
    display:none!important;
  }

  /* One shared detail panel: all explanation lives here instead of inside four cards. */
  body[data-taiga-smart-product="kleenaya-imitatsiya-brusa"] #profiles .mobile-profile-detail{
    margin-top:12px!important;
    padding:15px!important;
    display:grid!important;
    grid-template-columns:1fr auto!important;
    grid-template-areas:
      "eyebrow eyebrow"
      "title badge"
      "copy copy"
      "meta meta"
      "action action"!important;
    gap:8px 10px!important;
    border:1px solid rgba(36,54,47,.14)!important;
    border-radius:18px!important;
    background:#f7f4ed!important;
    color:#24362f!important;
  }
  body[data-taiga-smart-product="kleenaya-imitatsiya-brusa"] #profiles .mobile-profile-detail[hidden]{
    display:none!important;
  }
  body[data-taiga-smart-product="kleenaya-imitatsiya-brusa"] #profiles .mobile-profile-detail small{
    grid-area:eyebrow!important;
    font-size:7px!important;
    font-weight:850!important;
    letter-spacing:.13em!important;
    text-transform:uppercase!important;
    color:#738079!important;
  }
  body[data-taiga-smart-product="kleenaya-imitatsiya-brusa"] #profiles .mobile-profile-detail h3{
    grid-area:title!important;
    margin:0!important;
    font-size:20px!important;
    line-height:1!important;
    letter-spacing:-.035em!important;
  }
  body[data-taiga-smart-product="kleenaya-imitatsiya-brusa"] #profiles .mobile-profile-detail .mobile-profile-detail-badge{
    grid-area:badge!important;
    align-self:start!important;
    padding:5px 8px!important;
    border:1px solid rgba(36,54,47,.14)!important;
    border-radius:999px!important;
    background:#fff9!important;
    font-size:7px!important;
    font-weight:850!important;
    white-space:nowrap!important;
  }
  body[data-taiga-smart-product="kleenaya-imitatsiya-brusa"] #profiles .mobile-profile-detail p{
    grid-area:copy!important;
    margin:0!important;
    font-size:11.5px!important;
    line-height:1.4!important;
    color:#59635e!important;
  }
  body[data-taiga-smart-product="kleenaya-imitatsiya-brusa"] #profiles .mobile-profile-detail-meta{
    grid-area:meta!important;
    display:flex!important;
    flex-wrap:wrap!important;
    gap:6px!important;
  }
  body[data-taiga-smart-product="kleenaya-imitatsiya-brusa"] #profiles .mobile-profile-detail-meta span{
    padding:6px 8px!important;
    border-radius:999px!important;
    background:#ece9e1!important;
    font-size:7.5px!important;
    font-weight:800!important;
    line-height:1!important;
  }
  body[data-taiga-smart-product="kleenaya-imitatsiya-brusa"] #profiles .mobile-profile-detail-action{
    grid-area:action!important;
    width:100%!important;
    min-height:42px!important;
    margin-top:2px!important;
    border:0!important;
    border-radius:999px!important;
    background:#24362f!important;
    color:#fff!important;
    font-size:10px!important;
    font-weight:850!important;
    cursor:pointer!important;
  }
}

@media (max-width:380px){
  body[data-taiga-smart-product="kleenaya-imitatsiya-brusa"] #profiles .profile-showcase-grid{
    gap:8px!important;
  }
  body[data-taiga-smart-product="kleenaya-imitatsiya-brusa"] #profiles .profile-showcase-card{
    padding:8px!important;
  }
  body[data-taiga-smart-product="kleenaya-imitatsiya-brusa"] #profiles .profile-showcase-diagram{
    height:82px!important;
    min-height:82px!important;
  }
  body[data-taiga-smart-product="kleenaya-imitatsiya-brusa"] #profiles .profile-showcase-card h3{
    min-height:29px!important;
    font-size:14.5px!important;
  }
  body[data-taiga-smart-product="kleenaya-imitatsiya-brusa"] #profiles .profile-showcase-action{
    font-size:8.5px!important;
  }
}
