/* Finitions Signature : noir, anthracite et argent. Composition conservée. */
@media screen {
  :root[data-concept=signature] {
    --group-primary: #4b4b4b;
    --group-secondary: #999999;
    --group-accent: #8b8b8b;
    --group-blend: #747474;
    --group-light: #d3d3d3;
    --group-pink-light: #c3c3c3;
    --signature-panel: linear-gradient(135deg, #4b4b4b, #303030 78%);
    --signature-control: linear-gradient(125deg, #505050, #343434);
  }

  /* Reflets neutres et surfaces anthracite, sans dominante colorée. */
  :root[data-concept=signature] body {
    background: radial-gradient(ellipse at 78% 0, #4b4b4b40, transparent 53%) no-repeat,
      radial-gradient(ellipse at 12% 0, #ffffff08, transparent 45%) no-repeat, #242424;
    background-size: 100% 1100px, 100% 900px;
  }
  :root[data-concept=signature] .header {
    background: linear-gradient(110deg, #363636, #272727 65%, #393939);
    box-shadow: 0 1px #99999966;
  }
  :root[data-concept=signature] .hero {
    background: #3c3c3c;
    border-color: #b3b3b3;
    box-shadow: inset 0 1px #ededed55, 0 14px 45px #0003;
  }
  :root[data-concept=signature] .hero:after {
    background: radial-gradient(ellipse at 78% 4%, #99999926, transparent 54%),
      radial-gradient(ellipse at 12% 0, #ffffff08, transparent 48%),
      linear-gradient(180deg, #313131 0%, #313131 39%, #313131cf 48%, transparent 78%);
  }
  :root[data-concept=signature] .hero h1 em {
    background-image: linear-gradient(105deg, #fff, #d3d3d3 56%, #ebebeb);
  }
  :root[data-concept=signature] .page-intro {
    background: radial-gradient(ellipse at 50% -60%, #99999970, transparent 75%);
  }
  :root[data-concept=signature] .category-aside {
    background: linear-gradient(145deg, #484848, #303030);
    border-color: #ababab;
  }
  :root[data-concept=signature] .footer {
    background: linear-gradient(135deg, #454545, #303030 70%);
    border-color: #a8a8a8;
  }
  :root[data-concept=signature] :is(.eyebrow, .product-card .range, .category-label) {
    color: var(--group-light);
  }
  :root[data-concept=signature] :is(.note-dot, .status-mark) {
    background: var(--group-pink-light);
  }

  /* Les contrôles gagnent un reflet argenté à l’interaction. */
  :root[data-concept=signature] .hero-actions a:first-child {
    background: var(--signature-control)!important;
    border-color: var(--signature-silver)!important;
    color: #fff!important;
    box-shadow: inset 0 1px #ffffff26, 0 4px 16px #0002;
  }
  :root[data-concept=signature] body :is(.category-button[aria-pressed=true],
    .menu-toggle[aria-expanded=true]) {
    background: var(--signature-control);
    border-color: #efefef;
    color: #fff;
    box-shadow: inset 0 1px #ffffff38;
  }
  :root[data-concept=signature] .header #main-navigation>a[aria-current=page] {
    color: #fff;
    border-color: #efefef!important;
    box-shadow: inset 0 1px #ffffff26;
  }
  :root[data-concept=signature] .header #main-navigation .account-link {
    background: var(--signature-control);
  }
  :root[data-concept=signature] :is(.account-tabs button[aria-selected=true],
    .portal-nav a[aria-current=page]) {
    color: #fff;
    border-color: var(--signature-silver);
  }
  :root[data-concept=signature] :is(.hero-actions a:not(:first-child),
    .header, .catalogue-filter-button, .searchbox, .site-back, .chat-launcher,
    .studio-upload) svg:not(.apple):not(.led-power-icon) {
    color: #e6e6e6;
  }
  :root[data-concept=signature] :is(input[type=checkbox], input[type=radio], input[type=range]) {
    accent-color: var(--signature-silver);
  }
  :root[data-concept=signature] :is(.visual .example, .service-tag, .account-tag) {
    color: #e8e8e8;
    border-color: #bebebe;
  }
  :root[data-concept=signature] :is(.text-link, .footer-company-info a, .contact-email a) {
    text-decoration-color: var(--group-secondary);
    border-bottom-color: var(--group-secondary);
  }

  :root[data-concept=signature] :is(a, button, input, textarea, select, summary):focus-visible {
    outline-color: var(--group-pink-light)!important;
    box-shadow: 0 0 0 6px #242424!important;
  }
  :root[data-concept=signature] ::selection { background: var(--group-light); color: #202020; }
}
@media screen and (min-width:1101px) {
  :root[data-concept=signature] .header #main-navigation>a[aria-current=page] {
    background: var(--signature-control);
  }
}
@media screen and (max-width:1100px) {
  :root[data-concept=signature] .header #main-navigation {
    background: #313131!important;
    border-color: #b3b3b3!important;
  }
}
@media screen and (max-width:700px) {
  :root[data-concept=signature] .hero:after {
    background: radial-gradient(ellipse at 78% 4%, #99999926, transparent 54%),
      radial-gradient(ellipse at 12% 0, #ffffff08, transparent 48%),
      linear-gradient(180deg, #313131 0%, #313131 60%, #31313188 73%, transparent 90%);
  }
  :root[data-concept=signature] .category-aside { background: transparent; }
  :root[data-concept=signature] .category-list { background: #3c3c3c; }
}
@media screen and (hover:hover) and (pointer:fine) {
  :root[data-concept=signature] :is(.button, .hero-actions a, .auth-button,
    .header #main-navigation>a, .menu-toggle, .cart-button, .catalogue-filter-button,
    .mobile-category, .category-button, .led-power, .site-back, .chat-launcher):not(:disabled):hover {
    background: linear-gradient(120deg, #666666, #454545)!important;
    border-color: var(--group-pink-light)!important;
    color: #fff!important;
    box-shadow: inset 0 1px #ffffff38, 0 4px 16px #4b4b4b38;
  }
  :root[data-concept=signature] :is(input, select, textarea):not(:disabled):hover {
    border-color: var(--group-light);
  }
  :root[data-concept=signature] :is(.text-link, .footer-company-info a, .contact-email a):hover {
    color: #dbdbdb;
    box-shadow: none;
  }
}
@media screen {
  :root[data-concept=signature] :is(a:not(.brand), button:not(:disabled)):active {
    border-color: var(--group-pink-light);
    box-shadow: inset 0 0 0 1px var(--group-pink-light);
  }
}
@media (forced-colors:active) {
  :root[data-concept=signature] :is(a, button, input, select, textarea):focus-visible {
    outline-color: Highlight!important;
  }
}
