/* ==========================================================================
   TRACE — catalogue. Presentation d'origine, correctifs en bas.
   ========================================================================== */

*{box-sizing:border-box}body{margin:0;background:#061725;color:#f6fbff;font-family:Inter,Arial,sans-serif}:root{--y:#f2c230;--line:rgba(255,255,255,.1);--muted:#8ca4b5}a{color:inherit;text-decoration:none}nav{position:sticky;top:0;z-index:20;padding:16px 5vw;display:flex;justify-content:space-between;align-items:center;background:rgba(6,23,37,.92);backdrop-filter:blur(14px);border-bottom:1px solid var(--line)}.brand{font-size:26px;font-weight:900}.brand span{color:var(--y)}.back{padding:11px 14px;border:1px solid var(--line);border-radius:10px}header{padding:90px 5vw 55px;background:radial-gradient(circle at 20% 20%,rgba(31,105,157,.27),transparent 30%)}.eyebrow{color:var(--y);font-size:11px;font-weight:900;letter-spacing:.15em}h1{font-size:clamp(50px,7vw,90px);line-height:.92;letter-spacing:-.06em;margin:15px 0}header p{color:#a1b5c2;max-width:720px;font-size:17px;line-height:1.6}.filters{padding:18px 5vw;border-top:1px solid var(--line);border-bottom:1px solid var(--line);display:flex;gap:8px;flex-wrap:wrap;position:sticky;top:65px;background:#071c2c;z-index:15}.filters button{background:#0c2a43;color:#dce7ed;border:1px solid var(--line);padding:9px 12px;border-radius:999px;cursor:pointer}.filters button.active{background:var(--y);color:#071827;border-color:var(--y)}main{padding:38px 5vw 100px}.grid{display:grid;grid-template-columns:repeat(4,1fr);gap:14px}.prod{border:1px solid var(--line);border-radius:18px;background:#092237;overflow:hidden;transition:.25s}.prod:hover{transform:translateY(-4px);border-color:rgba(242,194,48,.3)}.prod-visual{height:145px;background:linear-gradient(135deg,#173a52,#0a263b);display:flex;align-items:flex-end;padding:16px;position:relative;overflow:hidden}.prod-visual:after{content:'';position:absolute;width:110px;height:110px;border:1px solid rgba(255,255,255,.1);border-radius:50%;right:-20px;top:-15px}.prod-visual span{font-size:34px;font-weight:900;color:rgba(255,255,255,.22)}.prod-body{padding:18px}.prod-cat{font-size:8px;color:var(--y);font-weight:900;letter-spacing:.12em;text-transform:uppercase}.prod h3{font-size:19px;margin:8px 0}.prod p{color:#a2b4bf;font-size:12px;margin:0 0 10px}.prod small{display:block;color:#668397;min-height:28px;line-height:1.35}.prod button{margin-top:16px;background:transparent;border:1px solid rgba(242,194,48,.35);color:var(--y);padding:9px 11px;border-radius:9px;font-weight:800;cursor:pointer}.rfq{position:fixed;right:20px;bottom:20px;background:var(--y);color:#071827;padding:14px 16px;border-radius:12px;font-weight:900;box-shadow:0 18px 40px rgba(0,0,0,.28)}footer{border-top:1px solid var(--line);padding:30px 5vw;color:#6d8799}@media(max-width:1000px){.grid{grid-template-columns:repeat(3,1fr)}}@media(max-width:720px){.grid{grid-template-columns:repeat(2,1fr)}}@media(max-width:480px){.grid{grid-template-columns:1fr}h1{font-size:50px}}

.lang-switch{display:flex;align-items:center;gap:4px;padding:4px;border:1px solid rgba(255,255,255,.1);border-radius:10px;background:rgba(6,23,37,.65)}
.lang-switch button{border:0;background:transparent;color:#7894a7;font-size:10px;font-weight:900;padding:7px 8px;border-radius:7px;cursor:pointer}
.lang-switch button.active{background:#f2c230;color:#071827}

/* ==========================================================================
   CORRECTIFS
   ========================================================================== */

.brand { display: inline-flex; align-items: center; min-height: 44px; }
.brand img { height: 30px; width: auto; display: block; }

/* La barre de filtres se cale sur la hauteur reelle de la nav. */
.filters { top: var(--navh, 65px); }
.filters button { min-height: 44px; }
.filters button[aria-pressed="true"] { background: var(--y); color: #071827; border-color: var(--y); }

.prod button { min-height: 44px; }

/* Le selecteur de langue : de vrais liens, sauf la langue courante. */
.lang-switch a, .lang-switch button { min-height: 44px; }
.lang-switch a {
  display: inline-flex; align-items: center; justify-content: center;
  padding: 0 12px; border: 1px solid rgba(255,255,255,.14); border-radius: 8px;
  color: #8fa8ba; font-size: 12px; font-weight: 700; text-decoration: none; background: none;
}
.lang-switch a:hover { color: var(--y); border-color: var(--y); }
.lang-switch button.active { background: var(--y); color: #071827; border-color: var(--y); }

/* La vignette porte le packshot du catalogue maison. */
.prod-visual--photo { background: #fff; padding: 0; height: 165px; display: block; }
.prod-visual--photo:after { display: none; }
.prod-visual--photo img { width: 100%; height: 100%; object-fit: contain; padding: 14px; display: block; }

/* Le titre mene a la fiche, le bouton lance une demande : deux intentions. */
.prod h3 a { color: inherit; text-decoration: none; }
.prod h3 a:hover { color: var(--y); }
.prod-fiche {
  display: inline-flex; align-items: center; min-height: 44px; margin-top: 12px; margin-right: 8px;
  color: var(--y); font-weight: 800; font-size: 13px;
}
.prod-fiche:hover { text-decoration: underline; }

/* Le bouton flottant recouvrait la derniere carte sur mobile. */
@media (max-width: 720px) { main { padding-bottom: 130px; } }

:focus-visible { outline: 2px solid var(--y); outline-offset: 3px; }
.skip { position: absolute; left: -9999px; top: 0; z-index: 100; background: var(--y); color: #071827; padding: 14px 20px; font-weight: 800; }
.skip:focus { left: 0; }

@media (prefers-reduced-motion: reduce) { *, *::before, *::after { transition: none !important; animation: none !important; } }
