/* Feuille de style du site MC Les Grenades */
:root{--bg:#f6f7f9;--surface:#fff;--ink:#1c2a36;--muted:#586571;--line:#d9dee3;--red:#b3262e;--green:#2b6b4c;--hero:#b3262e;--hero-ink:#fff;--ridge1:#951e26;--ridge2:#78171e;--road:#fff;
box-sizing:border-box;padding-top:env(safe-area-inset-top,0px);padding-bottom:env(safe-area-inset-bottom,0px)}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]){--bg:#141b21;--surface:#1d2730;--ink:#e8edf1;--muted:#a3b0ba;--line:#33414d;--red:#e0555c;--green:#5fb98d;--hero:#4a1116;--ridge1:#631820;--ridge2:#7d1e28}}
:root[data-theme="dark"]{--bg:#141b21;--surface:#1d2730;--ink:#e8edf1;--muted:#a3b0ba;--line:#33414d;--red:#e0555c;--green:#5fb98d;--hero:#4a1116;--ridge1:#631820;--ridge2:#7d1e28}
html{scroll-padding-top:env(safe-area-inset-top,0px)}
*,*::before,*::after{box-sizing:border-box}
body{margin:0;background:var(--bg);color:var(--ink);font:17px/1.6 Barlow,system-ui,sans-serif}
h1,h2,h3{font-family:"Barlow Condensed","Arial Narrow",sans-serif;line-height:1.05;margin:0 0 .5em;letter-spacing:.01em}
h1{font-size:clamp(2.6rem,9vw,4.6rem);font-weight:700}
h2{font-size:clamp(1.9rem,5vw,2.6rem);font-weight:700}
h3{font-size:1.4rem;font-weight:600}
a{color:var(--red)}
.wrap{max-width:960px;margin:0 auto;padding:0 20px}
header{background:var(--surface);border-bottom:3px solid var(--red);position:sticky;top:0;z-index:5}
header .wrap{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:4px 20px;padding-top:10px;padding-bottom:10px}
.logo{font:700 1.5rem "Barlow Condensed",sans-serif;text-decoration:none;color:var(--ink)}
.logo span{color:var(--red)}
nav{display:flex;flex-wrap:wrap;gap:2px 18px}
nav a{color:var(--ink);text-decoration:none;font-weight:600;padding:6px 0;border-bottom:3px solid transparent}
nav a[aria-current="page"]{border-color:var(--red)}
nav a:hover{border-color:var(--line)}
a:focus-visible,button:focus-visible{outline:3px solid var(--red);outline-offset:3px}
.page{display:none}.page.on{display:block}
.hero{background:var(--hero);color:var(--hero-ink);position:relative;overflow:hidden}
.hero .wrap{padding-top:56px;padding-bottom:210px;position:relative;z-index:1}
.hero p{max-width:34ch;font-size:1.2rem;margin:0}
.hero svg{position:absolute;left:0;bottom:0;width:100%;height:230px}
.ph{position:absolute;right:12px;bottom:8px;z-index:2;font-size:.8rem;color:#fff;opacity:.75}
.next{display:grid;gap:12px;margin-top:-34px;position:relative;z-index:3}
@media(min-width:640px){.next{grid-template-columns:1fr 1fr}}
.card{background:var(--surface);border:1px solid var(--line);border-left:6px solid var(--c,var(--red));border-radius:6px;padding:14px 18px}
.card.g{--c:var(--green)}
.card small{color:var(--muted);display:block}
.card strong{font:600 1.35rem "Barlow Condensed",sans-serif;display:block}
section.block{padding:44px 0 8px}
.cols{display:grid;gap:28px}
@media(min-width:760px){.cols{grid-template-columns:3fr 2fr}}
.box{background:var(--surface);border:1px solid var(--line);border-top:6px solid var(--green);border-radius:6px;padding:20px}
.btn{display:inline-block;background:var(--red);color:#fff;text-decoration:none;font-weight:600;padding:10px 20px;border-radius:6px;border:0;font-size:1rem;cursor:pointer}
.btn.alt{background:transparent;color:var(--red);border:2px solid var(--red)}
.join{background:var(--hero);color:var(--hero-ink);border-radius:6px;padding:24px;margin:36px 0}
.join a:not(.btn){color:#fff}
.join .btn{background:#fff;color:#b3262e}
.legend{display:flex;gap:18px;flex-wrap:wrap;margin:0 0 22px;color:var(--muted)}
.dot{display:inline-block;width:12px;height:12px;border-radius:50%;margin-right:6px;background:var(--red)}
.dot.g{background:var(--green)}
.month{font:700 1.3rem "Barlow Condensed",sans-serif;margin:26px 0 8px;color:var(--muted);border-bottom:1px solid var(--line);text-transform:capitalize}
.ev{display:grid;grid-template-columns:96px 1fr;gap:4px 14px;padding:10px 0 10px 12px;border-left:5px solid var(--red);margin-bottom:8px;background:var(--surface)}
.ev.g{border-color:var(--green)}
.ev time{font-weight:600}
.ev b{display:block}
.ev span{color:var(--muted)}
ul.docs{list-style:none;padding:0;margin:0}
ul.docs li{background:var(--surface);border:1px solid var(--line);border-radius:6px;padding:12px 16px;margin-bottom:8px}
table{border-collapse:collapse;width:100%;background:var(--surface)}
td{padding:10px 14px;border-bottom:1px solid var(--line)}
td:first-child{font-weight:600;width:42%}
.note{background:#fff6d6;color:#4a3d00;border-radius:6px;padding:10px 14px;font-size:.95rem;margin-bottom:22px}
footer{margin-top:56px;background:var(--surface);border-top:1px solid var(--line);padding:24px 0;color:var(--muted)}
footer .wrap{display:flex;flex-wrap:wrap;gap:8px 24px;justify-content:space-between}
@media(prefers-reduced-motion:no-preference){.hero p,.hero h1{animation:in .7s ease both}.hero p{animation-delay:.12s}@keyframes in{from{opacity:0;transform:translateY(8px)}}}
.hero{background:url(../images/hero.jpg) center 78%/cover no-repeat,var(--hero)}
.hero .wrap{padding-top:64px;padding-bottom:170px}
.hero h1,.hero p{text-shadow:0 2px 4px rgba(0,0,0,.6),0 0 26px rgba(0,0,0,.55)}
.photos{display:grid;gap:12px;margin-top:40px}
@media(min-width:640px){.photos{grid-template-columns:1fr 1fr}}
.photos img{width:100%;height:260px;object-fit:cover;border-radius:6px;display:block}
.hero .wrap{display:flex;flex-direction:column;justify-content:space-between;gap:120px;min-height:430px;padding-top:56px;padding-bottom:64px}
.hero p{max-width:36ch;font-weight:600}
.hero .wrap{padding-top:22px}
.hero h1{font-size:clamp(1.8rem,6.6vw,3.6rem);margin-bottom:0}
.dot.b{background:linear-gradient(90deg,var(--red) 50%,var(--green) 50%)}
.ev.b{border-image:linear-gradient(var(--red) 50%,var(--green) 50%) 1}
.team{display:grid;gap:12px}
@media(min-width:640px){.team{grid-template-columns:1fr 1fr}}
.person{display:flex;gap:16px;align-items:center;background:var(--surface);border:1px solid var(--line);border-radius:6px;padding:14px}
.avatar{flex:0 0 76px;height:76px;border-radius:50%;overflow:hidden;background:var(--line);color:var(--muted);display:flex;align-items:flex-end;justify-content:center}
.avatar svg{width:100%;height:100%}
.avatar img{width:100%;height:100%;object-fit:cover}
.person b{display:block;font:600 1.25rem "Barlow Condensed",sans-serif}
.person span{display:block;color:var(--muted)}
ul.docs small{display:block;color:var(--muted)}
ul.docs a{font-weight:600}

.person .addr{font-size:.8rem;overflow-wrap:break-word;user-select:all}
.social{display:flex;gap:14px;align-items:center}
.social a{display:inline-flex;width:34px;height:34px}
.social svg{width:100%;height:100%}
.social a:hover{opacity:.8}
.shop{background:var(--surface);border:1px solid var(--line);border-top:6px solid var(--red);border-radius:6px;padding:22px;margin-top:36px}
.shop h2{margin-bottom:.3em}
.shop .badge{display:inline-block;background:var(--red);color:#fff;font:600 .9rem "Barlow Condensed",sans-serif;letter-spacing:.08em;text-transform:uppercase;padding:2px 10px;border-radius:3px;margin-bottom:8px}
.shop small{display:block;color:var(--muted);margin-top:12px}
