:root {
  --elu-blue: #0875b9;
  --elu-navy: #0d1720;
  --elu-yellow: #ffe51f;
  --elu-orange: #f7941d;
  --elu-paper: #f6f5ef;
}

html { scroll-behavior: smooth; }
body.admin-bar .site-header { top: 32px; }
.site-header { position: sticky; top: 0; z-index: 1000; }
.site-header .current-menu-item > a { color: var(--elu-blue); }
.wp-site-blocks { padding: 0; }
.screen-reader-text {
  position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px;
  overflow: hidden; clip: rect(0,0,0,0); white-space: nowrap; border: 0;
}
.home-button {
  position: fixed; left: 18px; bottom: 18px; z-index: 999;
  display: inline-flex; align-items: center; gap: .5rem;
  padding: .78rem 1.05rem; border-radius: 999px; color: #fff;
  background: var(--elu-navy); box-shadow: 0 12px 28px rgb(0 0 0 / 22%);
  font: 700 .78rem/1 var(--font-sans, Arial, sans-serif);
  letter-spacing: .08em; text-decoration: none;
}
.home-button:hover { background: var(--elu-blue); color: #fff; }

.content-page { max-width: 1080px; margin: 0 auto; padding: 7rem 5vw; }
.content-page h1 { font-size: clamp(2.5rem, 7vw, 5.5rem); margin-bottom: 2rem; }
.content-page .entry-content { font-size: 1.08rem; line-height: 1.75; }
.content-page .entry-content > * { max-width: 780px; }
.content-page .entry-content img { max-width: 100%; height: auto; }

.catalogue-tools form { display: flex; gap: .75rem; flex-wrap: wrap; align-items: end; }
.catalogue-tools select,
.catalogue-tools input {
  min-height: 48px; border: 1px solid #ccd1d4; background: #fff;
  padding: .75rem 1rem; border-radius: 3px;
}
.catalogue-tools button { min-height: 48px; }
.product-card a { color: inherit; text-decoration: none; }
.product-photo { width: 100%; height: 100%; object-fit: contain; }
.product-card .stock-chip {
  position: absolute; bottom: 1rem; left: 1rem; padding: .38rem .62rem;
  border-radius: 999px; background: #fff; color: #173b2a; font-size: .7rem; font-weight: 800;
}
.pagination { display: flex; justify-content: center; gap: .5rem; padding-top: 3rem; }
.pagination .page-numbers { padding: .7rem .9rem; border: 1px solid #d7dadc; text-decoration: none; color: #111; }
.pagination .current { background: var(--elu-navy); color: #fff; }

.product-detail {
  display: grid; grid-template-columns: minmax(0, .9fr) minmax(0, 1.1fr);
  gap: clamp(2rem, 5vw, 6rem); padding: 5rem 5vw; max-width: 1380px; margin: 0 auto;
}
.product-gallery { position: sticky; top: 110px; align-self: start; }
.product-main-image {
  display: grid; place-items: center; min-height: 520px; background: #f4f4ef; position: relative;
}
.product-main-image img { max-width: 82%; max-height: 470px; object-fit: contain; }
.product-copy h1 { font-size: clamp(2rem, 4vw, 4.2rem); line-height: 1.04; }
.product-meta-line { color: #657078; font-weight: 700; text-transform: uppercase; letter-spacing: .07em; }
.energy-label {
  display: inline-grid; place-items: center; min-width: 64px; height: 44px;
  padding: 0 .8rem; color: #fff; font-weight: 900; font-size: 1.4rem;
  clip-path: polygon(0 0, 82% 0, 100% 50%, 82% 100%, 0 100%);
}
.energy-a { background:#149447 }.energy-b { background:#52a83e }.energy-c { background:#b5c632 }
.energy-d { background:#f6df21; color:#111 }.energy-e { background:#f6b51d; color:#111 }
.energy-f { background:#ed7b24 }.energy-g { background:#d73b2f }
.article-status {
  display: flex; gap: .9rem; align-items: center; margin: 1.5rem 0;
  padding: 1rem 1.2rem; background: #f4f4ef; border-left: 4px solid var(--elu-blue);
}
.article-status .pictogram { font-size: 2rem; font-weight: 900; }
.characteristics { margin-top: 2rem; }
.characteristics > div {
  display: flex; justify-content: space-between; gap: 1rem;
  padding: .8rem 0; border-bottom: 1px solid #e2e2dd;
}
.breadcrumb { max-width: 1380px; margin: 0 auto; padding: 1.2rem 5vw; font-size: .82rem; color: #667; }
.breadcrumb a { color: inherit; }

.blog-index { background: var(--elu-paper); padding: 6rem 5vw; }
.blog-index-inner { max-width: 1320px; margin: 0 auto; }
.blog-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 2rem; }
.blog-card { background: #fff; }
.blog-card img { width: 100%; aspect-ratio: 4/3; object-fit: contain; object-position: center; background: #315daf; }
.blog-card-copy { padding: 1.5rem; }
.blog-card h2 { font-size: 1.5rem; }
.blog-card a { color: inherit; text-decoration: none; }
.single-post-content { max-width: 820px; margin: 0 auto; padding: 6rem 5vw; }
.single-post-content h1 { font-size: clamp(2.4rem, 6vw, 4.8rem); line-height: 1.05; }
.single-post-content .post-meta { color: #68727a; margin-bottom: 2.5rem; }
.single-post-content .entry-content { font-size: 1.08rem; line-height: 1.8; }

.planogramme-page { padding: 4rem 3vw 8rem; background: #eef1f2; min-height: 100vh; }
.planogramme-shell { max-width: 1600px; margin: auto; }
.plano-toolbar {
  display: grid; grid-template-columns: repeat(4, minmax(130px, 1fr)) auto;
  gap: .8rem; padding: 1rem; background: #fff; position: sticky; top: 90px; z-index: 20;
  box-shadow: 0 8px 24px rgb(0 0 0 / 8%);
}
.plano-toolbar label { font-size: .72rem; font-weight: 800; text-transform: uppercase; }
.plano-toolbar input, .plano-toolbar select { display: block; width: 100%; margin-top: .3rem; padding: .6rem; }
.plano-main { display: grid; grid-template-columns: 310px minmax(700px, 1fr); gap: 1rem; margin-top: 1rem; }
.plano-products, .plano-config { background: #fff; padding: 1rem; }
.plano-products { max-height: calc(100vh - 180px); overflow: auto; position: sticky; top: 180px; }
.plano-product {
  display: grid; grid-template-columns: 64px 1fr; gap: .7rem; padding: .7rem 0;
  border-bottom: 1px solid #e8e8e4; cursor: grab;
}
.plano-product img { width: 64px; height: 72px; object-fit: contain; }
.plano-product strong { font-size: .78rem; line-height: 1.2; }
.plano-product small { display: block; color: #6e767b; margin-top: .3rem; }
.gondolas { display: flex; gap: 18px; align-items: end; overflow-x: auto; padding: 1rem; background: #dfe4e6; min-height: 720px; }
.gondola-wrap { flex: 0 0 auto; }
.gondola-title { display: flex; justify-content: space-between; align-items: center; margin-bottom: .4rem; font-weight: 800; }
.gondola {
  position: relative; display: flex; flex-direction: column; justify-content: flex-end;
  background: linear-gradient(90deg,#ddd,#f8f8f8 8%,#f2f2f2 92%,#ccc);
  border: 8px solid #555; border-bottom-width: 18px; overflow: hidden;
}
.shelf {
  position: relative; display: flex; align-items: end; gap: 2px; padding: 4px 6px 10px;
  border-bottom: 9px solid #676767; background: repeating-linear-gradient(90deg,#e6e6e6 0 3px,#f7f7f7 3px 9px);
}
.shelf.dragover { outline: 4px solid var(--elu-blue); outline-offset: -4px; }
.facing { position: relative; flex: 0 0 auto; display: flex; align-items: end; justify-content: center; }
.facing img { width: 100%; height: 100%; object-fit: contain; object-position: bottom; pointer-events: none; }
.facing button { position: absolute; top: -5px; right: -5px; border: 0; border-radius: 50%; width: 20px; height: 20px; display:none; }
.facing:hover button { display:block; }
.gondola-settings { margin: .65rem 0 1rem; padding: .7rem; background: #fff; }
.gondola-settings label { display: inline-block; margin: .3rem; font-size: .72rem; }
.gondola-settings input { width: 75px; padding: .35rem; }

.brand-panels { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.exolight-panel { background: #191919; color: #fff; position: relative; overflow: hidden; }
.exolight-panel .brand-letter { color: rgb(255 255 255 / 7%); }
.exolight-panel .panel-index { color: #b8bec3; }
.exolight-panel .exolight-wordmark {
  margin: .5rem 0 1.3rem; color: #fff; font: 900 clamp(2rem, 4vw, 4.1rem)/1 var(--font-display, Arial, sans-serif);
  letter-spacing: -.06em;
}
.exolight-panel .exolight-wordmark::first-letter { color: var(--elu-orange); }
.exolight-panel .button { color: #111; background: var(--elu-orange); }
.exolight-panel .panel-external { color: #fff; }
.brand-exolight { background: #191919; color: #fff; }

@media (max-width: 900px) {
  body.admin-bar .site-header { top: 46px; }
  .product-detail, .blog-grid { grid-template-columns: 1fr; }
  .product-gallery { position: static; }
  .plano-main { grid-template-columns: 1fr; }
  .plano-products { position: static; max-height: 350px; }
  .plano-toolbar { grid-template-columns: 1fr 1fr; top: 70px; }
  .brand-panels { grid-template-columns: 1fr; }
}

@media print {
  .site-header, .home-button, .plano-toolbar, .plano-products, .gondola-settings, footer { display:none !important; }
  .planogramme-page, .plano-main, .gondolas { padding:0; margin:0; background:#fff; }
}