/* Thème : ProtectionChat (charte de www.protectionchat.ch)
   Polices : family=Figtree:wght@400;500;600;700&family=Bricolage+Grotesque:opsz,wght@12..96,700;12..96,800 */
:root{
  --ink:#17261E; --muted:#4C5A52; --line:#DCE2DC;
  --bg:#F5F6F2; --card:#FFFFFF;
  --brand:#1F4A36; --brand-2:#143326; --ok:#1F4A36;
  --accent:#B4561A; --cta:#B4561A; --cta-2:#934413;
  --r:16px; --btn-r:999px;
  --font:'Figtree',system-ui,-apple-system,'Segoe UI',sans-serif;
  --display:'Bricolage Grotesque','Figtree',system-ui,sans-serif; --display-weight:700;
  --foot-bg:#143326; --foot-ink:#D7E4DB; --head-bg:#FFFFFF;
  --brand-ink:#17261E; --brand-dot:#B4561A;
  --shadow:0 1px 2px rgba(23,38,30,.05),0 10px 28px rgba(23,38,30,.08);
}
body{font-size:17px}
h1,h2,h3{letter-spacing:-.01em}
h1{font-weight:800}
h3{font-family:var(--display);color:var(--brand)}
a{color:var(--brand)}
.nav a:hover{color:var(--accent)}
.cart-link .badge,.badge{background:var(--accent)}
.btn{border-color:var(--brand);color:var(--brand);font-weight:700}
.btn:hover{background:#E6EEE8}
.btn.primary{font-weight:700}
.langs a.on{background:#E6EEE8;color:var(--ink)}

/* Accueil : bandeau vert foncé comme le site principal */
.hero{max-width:none;background:linear-gradient(135deg,#1F4A36,#143326);color:#fff;border-radius:var(--r);padding:30px 34px;margin:20px 0 26px}
.hero h1{color:#fff;font-size:clamp(1.55rem,2.6vw,2.2rem);line-height:1.15;margin:0 0 .35em;max-width:880px}
.hero p{color:#E3ECE6;font-size:1.05rem;max-width:680px;margin:0}
.hero.has-img{background:linear-gradient(100deg,rgba(20,51,38,.92) 0%,rgba(31,74,54,.72) 55%,rgba(31,74,54,.45) 100%),var(--hero-img) center/cover no-repeat;padding:56px 40px;min-height:220px}
@media (max-width:600px){.hero{padding:22px 20px}.hero.has-img{padding:26px 20px}}

/* Cartes des catégories et produits : titre sur l'image, comme « Solutions » */
.card{border:1px solid var(--line);box-shadow:none}
.card:hover{box-shadow:var(--shadow)}
.price{color:var(--brand)}
.tag{background:#FBEFE5;color:#934413}

/* Pages de contenu (FAQ, avis, instructions) */
.page details{background:var(--card);border:1px solid var(--line);border-radius:var(--r);padding:0 18px;margin:0 0 10px}
.page details[open]{box-shadow:var(--shadow)}
.page summary{font-family:var(--display);font-weight:700;font-size:1.1rem;color:var(--ink);padding:16px 0;cursor:pointer}
.page summary::marker{color:var(--accent)}
.cat-note{background:#E6EEE8;border-left-color:var(--accent)}
.foot a{color:#fff}

/* Accueil : catégories façon « Solutions » (titre sur la photo, flèche ronde) */
.cat-tile{position:relative;border:0;aspect-ratio:4/3;color:#fff}
.cat-tile .card-img{position:absolute;inset:0;aspect-ratio:auto;height:100%}
.cat-tile .card-img::after{content:'';position:absolute;inset:0;background:linear-gradient(180deg,rgba(20,51,38,0) 35%,rgba(20,51,38,.85))}
.cat-tile .card-body{position:absolute;left:0;right:0;bottom:0;padding:16px 64px 16px 18px;z-index:1}
.cat-tile .card-body h2{color:#fff;font-size:1.25rem;margin:0}
.cat-tile .card-body p{color:#E3ECE6;margin:2px 0 0;font-size:.9rem}
.cat-tile::after{content:'→';position:absolute;right:16px;bottom:18px;width:34px;height:34px;border-radius:50%;background:#fff;color:#17261E;display:grid;place-items:center;font-weight:700;z-index:1}
.cat-tile:hover::after{background:var(--accent);color:#fff}