/* TAIGA glued-panel profile contrast — 2026-09-06 v3 */

/*
 * Dark neutral stage inspired by the supplied fastening reference.
 * Goal: separate pale spruce from the background and keep the actual profile geometry readable.
 */

#profiles .profile-showcase-card:nth-child(-n+3) .profile-showcase-diagram,
#configurator .profile-choice-card[data-value="classic"] .profile-diagram,
#configurator .profile-choice-card[data-value="karelian"] .profile-diagram,
#configurator .profile-choice-card[data-value="hidden"] .profile-diagram,
.hx-profile[data-value="classic"] .hx-thumb,
.hx-profile[data-value="karelian"] .hx-thumb,
.hx-profile[data-value="hidden"] .hx-thumb{
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  overflow:hidden!important;
  background:
    radial-gradient(circle at 50% 42%,rgba(255,255,255,.10) 0 8%,rgba(255,255,255,.035) 34%,transparent 62%),
    linear-gradient(145deg,#36383b 0%,#2a2c2f 52%,#1f2124 100%)!important;
  box-shadow:
    inset 0 0 0 1px rgba(255,255,255,.07),
    inset 0 1px 0 rgba(255,255,255,.055),
    0 1px 0 rgba(0,0,0,.10)!important;
}

#profiles .profile-showcase-card:nth-child(-n+3) .profile-showcase-diagram img,
#configurator .profile-choice-card[data-value="classic"] .profile-diagram img,
#configurator .profile-choice-card[data-value="karelian"] .profile-diagram img,
#configurator .profile-choice-card[data-value="hidden"] .profile-diagram img,
.hx-profile[data-value="classic"] .hx-thumb img,
.hx-profile[data-value="karelian"] .hx-thumb img,
.hx-profile[data-value="hidden"] .hx-thumb img{
  display:block!important;
  width:100%!important;
  height:100%!important;
  max-width:none!important;
  max-height:none!important;
  object-fit:contain!important;
  object-position:50% 50%!important;
  transform-origin:50% 50%!important;
  filter:
    brightness(1.08)
    contrast(1.10)
    saturate(.90)
    drop-shadow(0 1px 0 rgba(255,255,255,.18))
    drop-shadow(0 8px 11px rgba(0,0,0,.42))!important;
}

/* Main profile cards: center the visible board, not the whitespace of the source file. */
#profiles .profile-showcase-card:nth-child(-n+3) .profile-showcase-diagram img{
  transform:translateY(-4%) scale(1.60)!important;
}

/* Configurator cards are smaller, so use a slightly softer scale. */
#configurator .profile-choice-card[data-value="classic"] .profile-diagram img,
#configurator .profile-choice-card[data-value="karelian"] .profile-diagram img,
#configurator .profile-choice-card[data-value="hidden"] .profile-diagram img{
  transform:translateY(-4%) scale(1.45)!important;
}

/* First-screen mini selector needs its own vertical correction. */
.hx-profile[data-value="classic"] .hx-thumb img,
.hx-profile[data-value="karelian"] .hx-thumb img,
.hx-profile[data-value="hidden"] .hx-thumb img{
  transform:translateY(-8%) scale(1.22)!important;
}

@media (min-width:1101px) and (max-height:840px){
  #profiles .profile-showcase-card:nth-child(-n+3) .profile-showcase-diagram img{transform:translateY(-4%) scale(1.53)!important}
  #configurator .profile-choice-card[data-value="classic"] .profile-diagram img,
  #configurator .profile-choice-card[data-value="karelian"] .profile-diagram img,
  #configurator .profile-choice-card[data-value="hidden"] .profile-diagram img{transform:translateY(-4%) scale(1.40)!important}
}

@media (max-width:1100px){
  #profiles .profile-showcase-card:nth-child(-n+3) .profile-showcase-diagram img{transform:translateY(-3%) scale(1.48)!important}
  #configurator .profile-choice-card[data-value="classic"] .profile-diagram img,
  #configurator .profile-choice-card[data-value="karelian"] .profile-diagram img,
  #configurator .profile-choice-card[data-value="hidden"] .profile-diagram img{transform:translateY(-3%) scale(1.38)!important}
}

@media (max-width:780px){
  #profiles .profile-showcase-card:nth-child(-n+3) .profile-showcase-diagram img{transform:translateY(-2%) scale(1.38)!important}
  #configurator .profile-choice-card[data-value="classic"] .profile-diagram img,
  #configurator .profile-choice-card[data-value="karelian"] .profile-diagram img,
  #configurator .profile-choice-card[data-value="hidden"] .profile-diagram img{transform:translateY(-2%) scale(1.30)!important}
  .hx-profile[data-value="classic"] .hx-thumb img,
  .hx-profile[data-value="karelian"] .hx-thumb img,
  .hx-profile[data-value="hidden"] .hx-thumb img{transform:translateY(-6%) scale(1.16)!important}
}